@parag.smarter.codes/kanban

About Kanban's Storybook

Kanban's Storybook describes Kanban's isolated UI components of 1st version of TalkingDB.

Installation

# npm
npm install

# yarn
yarn

Running the React App

# npm
npm start

# yarn
yarn start

Running the Storybook

# npm
npm run storybook

# yarn
yarn run storybook

Publishing the Storybook

npx chromatic --project-token=013e9ca1d923

List of Kanban's Storybook UI components

1. Card: Card is the child component of Kanban that is responsible for showing information of one single entity.
   • Card Template: Describes the Layout of Card w.r.t Product design
2. Kanban: Kanban is the parent component that contains multiple child components and some instances related to its functionality for example Card Component, Columns(Swimlanes), Adding Cards by pressing Add button located at the Column's Header, Editing Card in its custom Dialog-Box, etc.
   • Kanban Template: Describes the Layout of Kanban with a custom Card. w.r.t [Product design]
   • Card Template: Same as mentioned in Card Template
   • Adding Cards: Showing how cards are added/edited in Kanban.
3. AdvancedFilter: AdvancedFilter is a Re-usable filter component for Kanban & DataGrid component.
4. SortComponent: SortComponent is a component responsible for global sorting in the Kanban.
5. GlobalSearch: GlobalSearch is a component responsible for global searching in the Kanban.

Kanban's Storybook Live URL

https://615d2b96546a6c004a1f12d7-ifmypvxaqw.chromatic.com/