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

    0.1.4 • Public • Published

    Welcome to Launch UI - Solid JS Version

    A UI library containing a set of beautiful Solid JS components.

    Join Solid UI Discord channel

    Storybook available at launch-ui.netlify.app.


    npm install @launch/solid
    # or
    yarn add @launch/solid


    • yarn The project uses yarn over alternatives such as NPM/PNPM/...
    • node

    Clone & Setup

    Clone the repository to your local machine.

    $ git clone git@github.com:launch-ai/launch-ui.git

    Install dependencies & git hooks.

    $ yarn install

    Run the storybook.

    $ yarn run storybook


    Styling is done with Emotion and twin.macro using a custom styled util.


    import tw from 'twin.macro'
    import { styled } from './src/utils/styled'
    type ButtonProps = { block: boolean }
    type StyledButtonProps = ButtonProps
    const baseStyles = tw`border border-black px-4 py-2`
    const blockStyles = ({ block }: StyledButtonProps) => block && tw`block w-full`
    const StyledButton = styled('button')<StyledButtonProps>(
    const Button: Component<ButtonProps> = (props) => {
      return (
        <StyledButton block={props.block}>
    export default Button

    Commit messages

    Conventional Commits is used for all commit messages with the AngularJS variation.

    This is enforced by a pre-commit hook with commitlint. If your commit message does not meet the conventional commits standard, the commit hook will fail. This helps with generating changelogs with version updates.

    In summary, the commit message header has the following format:

    <type>(<scope>): <short summary>
      │       │             │
      │       │             └─⫸ Summary in present tense. Not capitalized. No period at the end.
      │       │
      │       └─⫸ Commit Scope: products|orders|settings|...
      └─⫸ Commit Type: build|ci|docs|feat|fix|perf|refactor|test

    The commit type must be one of the following:

    • build: Changes that affect the build system or external dependencies (example scopes: gulp, broccoli, npm)
    • ci: Changes to our CI configuration files and scripts (example scopes: Circle, BrowserStack, SauceLabs)
    • docs: Documentation only changes
    • feat: A new feature
    • fix: A bug fix
    • perf: A code change that improves performance
    • refactor: A code change that neither fixes a bug nor adds a feature
    • test: Adding missing tests or correcting existing tests

    Pre-commit Hooks

    Husky and lint-staged is used for pre-commit git hooks.

    When you execute a commit, the following commands will be executed:

    • Lint staged files:

      npx lint-staged

    • Validate commit message:

      npx --no-install commitlint --edit ""

    The configuration can be found in .husky/pre-commit and in package.json under "lint-staged".

    Additional hooks can be added with:

    npx husky add .husky/pre-commit "yarn test"

    Join Solid UI Discord channel


    npm i @launch/solid

    DownloadsWeekly Downloads






    Unpacked Size

    367 kB

    Total Files


    Last publish


    • vishvadlamani
    • acidic9