@croissantpay/merchant-components NPM

CRUDS: Croissant Retailer UI Design System

This repo contains our React.js component library for retailers.

Scripts

To run locally: yarn install && yarn run storybook

Technologies

Storybook
React
Sass
Typescript
Jest

Component File Structure

Components are located in the src/components/merchant-components folder.

Each component contains 3 files:

Component.tsx - The React component that can be exported and used on the retailer side
Component.module.css - The component-specific styling
Component.stories.mdx - The MDX documentation, viewable on the component's Doc tab in Storybook.

Other File Structure within /src

api/mocks - Mock API data for use within Storybook example components
api/product - API fetch call
assets - Contains images and logos folders
helpers - Contains helper functions for updating cookies.
introduction MDX documentation about our Storybook component library.
scss - Contains variables.scss and global.scss which import our Google Fonts.
utilities - Contains the types folder

Storybook Component Library

Visit our Storybook web app that allows developers, designers, PMs, and other stakeholders to check if the UI looks right without touching code or requiring a local dev environment.

URL OF Storybook Component Library