@sinlead/pitaya-ui v0.1.4
Pitaya UI
CYBERBIZ 後台管理使用的 Design System Library,目前給:CYBERBIZ Admin、CYBERBIZ Automation 以及 CYBERBIZ OMO 等專案共用。
planned versions:
- v0: essential legacy components.
- v1: restructure, redefined guidelines and make use of design tokens
Usage
:warning: 為了可以初始化 i18n.ts
的設定,統一讓所有元件從 src/components/pitayas/index.tsx
匯出。
因此使用此 Pitaya 共用元件庫,元件是從 pitayas/index.tsx
引入,不同於以往 EC 從特定的 PitayaComponent file 引入。
使用此 Pitaya 共用元件庫路徑寫法範例:
import { PitayaComponent } from '@src/components/pitayas';
Devlopment
projects:
lib/
: library itself.storybook/
: served as a consumer project and a documentation site at the same time.
Install
yarn
Workflow
yarn start
to start dev server. Go tohttp://localhost:3000/
to implement components and interate.- (TBD for details) Write unit test.
If everything work as expected. Build the component and test it in storybook project to simulate the usage in other consumer project.
A. Build the library
cd lib yarn build cd ../
This will build the library to
/dist
folder, which get reflected in the storybook project as we've set up the link in previous step. B. Setup local link ONCEcd storybook yarn add @sinlead/pitaya-ui@link:../lib/ # link-install the package cd ../
C. Use the built component in storybook
cd ./storybook yarn storybook
D. (TBD for details) Write storybook documentation.
yarn workspace pitaya-ui-storybook add @sinlead/pitaya-ui@link:../lib
Deploy
Library
TBC
Storybook
TBC