es

emotion-solid

Emotion JS support for Solid JS projects

Showing:

Popularity

Downloads/wk

7

GitHub Stars

8

Maintenance

Last Commit

3mos ago

Contributors

0

Package

Dependencies

4

License

MIT

Type Definitions

Built-In

Tree-Shakeable

Yes?

Categories

Readme

Emotion Solid

Emotion JS support for Solid JS.

Installation

npm i emotion-solid
# or
yarn add emotion-solid

Usage

import { styled } from 'emotion-solid'

export type ButtonProps = {
  block?: boolean
}

const StyledButton = styled('button')<ButtonProps>(
  {
    display: 'inline-block',
    padding: '8px 6px',
    borderRadius: 8,
  },
  ({ block }) =>
    block && {
      display: 'block',
      width: '100%',
    }
)

const Button: Component<ButtonProps> = (props) => {
  return <StyledButton {...props}>{props.children}</StyledButton>
}

export default Button
import { render } from 'solid-js/web'
import Button from './Button'

function App() {
  return <Button block>Click Me</Button>
}

render(() => <App />, document.getElementById('app'))

Contributing 🙌

Contributions are more than welcome. If you see any changes fit, go ahead and open an issue or PR.


Any support is a huge motivation, thank you very much!

Buy Me A Coffee

Rate & Review

Great Documentation0
Easy to Use0
Performant0
Highly Customizable0
Bleeding Edge0
Responsive Maintainers0
Poor Documentation0
Hard to Use0
Slow0
Buggy0
Abandoned0
Unwelcoming Community0
100