@bcc-code/design-tokens 3.0.10 → 3.0.12

package/README.md

@@ -186,9 +186,44 @@ We welcome contributions! Here's how to get started:
 - **Build configuration** is in `export-tokens/build.js` using Style Dictionary
 - **Output files** are generated in `build/bcc/` with organized folders for `css/` and `js/`
 
+### GitHub-Figma Workflow
+
+The design token system integrates with Figma through Figma Token Studio, creating a streamlined workflow between design and development:
+
+**1. Design in Figma**
+- Design tokens are created and managed in Figma using the Token Studio plugin
+- Tokens are organized into collections: primitives, semantic (light/dark), typeface, and PrimeVue
+- Designers can make changes directly in Figma and preview them in real-time
+
+**2. Export from Figma Token Studio**
+- Use the Token Studio plugin to export tokens as JSON files
+- Export collections separately or as a complete token set
+- Tokens are exported in the Figma Token Studio format with proper references
+
+**3. Sync to GitHub**
+- Export token files from Figma Token Studio
+- Update the corresponding files in the `tokens/` directory:
+  - `tokens/primitives/` - Base design tokens (colors, dimensions, typography)
+  - `tokens/semantic/light.json` - Light theme semantic tokens
+  - `tokens/semantic/dark.json` - Dark theme semantic tokens
+  - `tokens/typeface/` - Font definitions
+  - `tokens/primevue/aura-primitive.json` - PrimeVue Aura primitive tokens
+- Commit changes to your feature branch
+
+**4. Build and Deploy**
+- Run `npm run build` to transform tokens into CSS, JS, and Tailwind formats
+- The Style Dictionary build system processes tokens with custom transforms
+- Generated files in `build/bcc/` are ready for distribution
+
+**5. Version and Release**
+- Create pull request with token changes
+- Review generated output files and test with demo application
+- Merge to main branch triggers automated release process
+- New package version is published to npm with updated tokens
+
 ### Making Changes
 
-1. **Token updates:** Modify files in `tokens/` directory or sync from Figma Token Studio
+1. **Token updates:** Export from Figma Token Studio and update files in `tokens/` directory
 2. **Build system changes:** Update `export-tokens/build.js` for new formats or transformations
 3. **PrimeVue preset:** Modify `config/primevue.config.js` for theme mapping changes
 
@@ -203,7 +238,7 @@ We welcome contributions! Here's how to get started:
 
 A comprehensive demo application is available in the `demo/` directory featuring:
 
-- **CSS Variables showcase**: E-commerce product cards, newsletter forms, and status displays using pure CSS with BCC tokens
+- **CSS Variables showcase**: Custom cards, newsletter forms, and status displays using pure CSS with BCC tokens
 - **Tailwind Utilities showcase**: Project management dashboard with utility-first CSS classes
 - **PrimeVue Components showcase**: User profiles, settings panels, and component galleries
 - **Theme switching**: Manual dark/light mode toggle with system preference detection

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bcc-code/design-tokens",
-  "version": "3.0.10",
+  "version": "3.0.12",
   "description": "Design tokens build system",
   "type": "module",
   "exports": {
@@ -37,10 +37,13 @@
   },
   "homepage": "https://github.com/bcc-code/bcc-tokens#readme",
   "dependencies": {
-    "@tokens-studio/sd-transforms": "^1.3.0",
-    "style-dictionary": "^5.0.0"
+    "@tokens-studio/sd-transforms": "^2.0.1",
+    "style-dictionary": "^5.0.1"
   },
   "peerDependencies": {
     "@primeuix/themes": "^1.1.1"
+  },
+  "overrides": {
+    "tmp": "^0.2.4"
   }
 }