Table of Contents |
---|
Coding standards
Tech stack
...
Tokens should have prefix cds-
(Chameleon Design System).
Token naming rules are yet TBD.
File and folder naming and organization
This section explains how your file and folder should be named and structured.Component package should be placed in to packages/design-system/(components|blocks|foundations)/<component-name>
folder. Structure of the package is following:
docs
overview.stories.mdx – explanation of what is this component for
tokens.stories.mdx – component specific tokens
stories
properties.stories.tsx – playground for developers to play with props options
variations.stories.tsx – display all possible configuration options
src
component-name.scss – component styles entry point
component-name.tokens.scss – component specific tokens
component-name.test.tsx – unit tests
component-name.tsx – component code
models.ts – component interface
index.tsx – entry point
package.json – package configuration
tsconfig.json – ts configuration