Nascent Prototype Metaverse

    emotion-solid
    TypeScript icon, indicating that this package has built-in type declarations

    1.1.1 • Public • Published

    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

    Keywords

    none

    Install

    npm i emotion-solid

    DownloadsWeekly Downloads

    14

    Version

    1.1.1

    License

    MIT

    Unpacked Size

    349 kB

    Total Files

    8

    Last publish

    Collaborators

    • acidic9