🚀 bynd-ui-library

BYND UI Component Library built for React to provide a composable and extensible component library and design system to reuse across client projects.

📖 Getting Started

Refer to the documentation for installation and usage https://bynd-ui-library.vercel.app/

🥷 Contributing

To contribute please follow our CONTRIBUTING guidelines.

Prerequisites

• Install nvm to manage Node.js versions.
• NodeJS Open-source, cross-platform, back-end, JavaScript runtime environment.

@bynd-ui-library/react has been built on top of @mui/material, refer to their documentation https://mui.com/material-ui/getting-started/overview/ for more detailed API references.

Install

nvm use
npm i

Directory Structure

  .
  ├── docs                    # Storybook documentation pages
  ├── public                  # Storybook and Vite public directory
  ├── src                     # Package src code
  │   ├── component           # All UI components, including MUI wrappers and custom components
  │   ├── foundation          # Storybook foundation styles documentation
  │   ├── hooks               # Custom react hooks
  │   ├── styles              # Global (non-scoped) CSS
  │   ├── themes              # Preset theme configurations
  │   ├── tokens              # Shared design tokens
  │   ├── types               # TypeScript declaration files
  │   └── utils               # Generic util functions
  ├── test-utils              # Unit test utilities and mocks
  ├── storybook-static        # Compiled storybook
  └── dist                    # Compiled package dist code

Commands

| Command | Description | | --------------------------- | ------------------------------------------------------------------------------------------------------- | | npm run build | Build library package for publishing | | npm run storybook | Run storybook dev server for local development | | npm run build-storybook | Build storybook for production | | npm run format | Prettier formatting check | | npm run format:fix | Fix prettier formatting errors | | npm run lint | Runs all linters | | npm run lint:scripts | Run eslint | | npm run lint:scripts:fix | Fix eslint errors | | npm run lint:styles | Run stylelint | | npm run lint:styles:fix | Fix stylelint errors | | npm run lint:markdown | Run markdownlint | | npm run lint:markdown:fix | Fix markdownlint errors | | npm run lint:commit | Run commitlint against last commit message | | npm run commit | git commit fallback to run commitizen | | npm test | Run jest unit tests | | npm test:coverage | Run jest unit tests with code coverage reports (check report locally with npx http-server ./coverage) | | npm test:watch | Run jest unit tests with file watching |

📦 Changelog

📝 License