@ambita/design-system 6.0.1-161.0 → 6.0.1-181.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -6,7 +6,7 @@ Vue 3 component library built with TypeScript, Vite, Reka UI, and SCSS.
6
6
 
7
7
  ### First Run
8
8
 
9
- Generate NPM token (try `npm whoami` to check if configured). If no response, follow this guide: https://ambita.atlassian.net/wiki/spaces/AI/pages/3060006975/Generate+NPM_TOKEN
9
+ Generate NPM token (try `npm whoami` to check if configured). If no response, follow [this guide](https://ambita.atlassian.net/wiki/spaces/AI/pages/3060006975/Generate+NPM_TOKEN).
10
10
 
11
11
  To get the project up and running locally:
12
12
 
@@ -18,33 +18,54 @@ npm run storybook
18
18
 
19
19
  This will install dependencies, build the required theme assets, and start Storybook on port 6006.
20
20
 
21
- > **Note:** The `build:storybook:prepare` step is required because Storybook needs the compiled theme CSS files in `dist/themes/`. If you see an error about missing `./dist/themes` directory, run this build step first.
21
+ > [!IMPORTANT]
22
+ > The `build:storybook:prepare` step is **required** before running Storybook for the first time. Storybook needs the compiled theme CSS files in `dist/themes/`. If you see an error about missing `./dist/themes` directory, run this build step first.
22
23
 
23
- ### Architecture
24
+ You can also run `npm start` to test it running with Vite.
25
+
26
+ ### Subsequent Runs
27
+
28
+ ```sh
29
+ npm run storybook
30
+ ```
31
+
32
+ ---
33
+
34
+ ### Features
24
35
 
25
36
  The design system features:
26
37
 
27
- - **Two Component Types:** Legacy Aux components and modern Neo components (built with Reka UI)
28
- - **Streamlined Token System:** 93 CSS custom properties (down from 157)
29
- - **Shared Dropdown Tokens:** All dropdown components use common tokens
30
- - **SCSS Mixins:** Reusable patterns in `src/css/neo-mixins.scss`
38
+ - **Two Component Types:**
39
+ - **Neo** components (built with modern Reka UI primitives)
40
+ - **Aux** components
41
+ - some custom-built components
42
+ - some deprecated components, now replaced by Neo components
43
+ - **Design Token System and Themes**
44
+ - **Formatters**
45
+ - **SCSS Mixins**
46
+
47
+ ---
31
48
 
32
49
  ### Documentation
33
50
 
34
51
  - **[Ambita Style Guide](https://design.ambita.com)** - Brand guidelines, colors, typography, and visual standards
35
52
 
36
- Key guides for contributors:
53
+ - **[Storybook](https://design.ambita.com)** - Interactive components and implementation/usage documentation
54
+
55
+ - **[Spotify Portal](https://design.ambita.com)** - Technical docs and this project's relations other projects etc.
56
+
57
+ Key guides for developers:
58
+
59
+ - **[INTEGRATION_GUIDE.md](docs/INTEGRATION_GUIDE.md)** - How to install and use the design system in your projects
60
+ - **[CONTRIBUTING.md](docs/CONTRIBUTING.md)** - General info on contributing
37
61
 
38
- - **[docs/CONTRIBUTING.md](docs/CONTRIBUTING.md)** - General info on contributing
39
- - **[docs/INTEGRATION_GUIDE.md](docs/INTEGRATION_GUIDE.md)** - How to use the design system in projects
40
- - **[docs/REKA_UI_SCSS_GUIDE.md](docs/REKA_UI_SCSS_GUIDE.md)** - Portal components and `:deep()` selectors
41
- - **[docs/NEO_COMPONENT_PATTERNS.md](docs/NEO_COMPONENT_PATTERNS.md)** - Common patterns and mixins
42
- - **[docs/INTERACTION_TESTING_GUIDE.md](docs/INTERACTION_TESTING_GUIDE.md)** - Storybook interaction tests
43
- - **[.claude/CLAUDE.md](.claude/CLAUDE.md)** - Project instructions for Claude Code
62
+ ---
44
63
 
45
64
  ### [Vivid Blueprint](https://github.com/Ambita/vivid-blueprint)
46
65
 
47
- Recommended front-end template for new Ambita projects, pre-configured with this design system.
66
+ Recommended front-end template for new Ambita projects, pre-configured with this design system and best-practices. Based on the official creators of Vue's [create-vue](https://github.com/vuejs/create-vue) project.
67
+
68
+ ---
48
69
 
49
70
  ### Scripts
50
71
 
@@ -104,9 +125,10 @@ npm run format
104
125
  npm run type-check
105
126
  ```
106
127
 
128
+ ---
129
+
107
130
  ## Links
108
131
 
109
132
  - [Vivid Blueprint](https://github.com/Ambita/vivid-blueprint)
110
133
  - [Icons](https://github.com/Ambita/design-system-icons)
111
134
  - [Reka UI](https://reka-ui.com)
112
-