diff --git a/.changeset/fifty-memes-accept.md b/.changeset/fifty-memes-accept.md deleted file mode 100644 index 10579f45..00000000 --- a/.changeset/fifty-memes-accept.md +++ /dev/null @@ -1,15 +0,0 @@ ---- -'@grasdouble/lufa_plugin_vscode_lufa-ds-preview': patch -'@grasdouble/lufa_microfrontend_main-container': patch -'@grasdouble/lufa_design-system-docusaurus': patch -'@grasdouble/lufa_design-system-playwright': patch -'@grasdouble/lufa_microfrontend_home': patch -'@grasdouble/lufa_design-system-storybook': patch -'@grasdouble/cdn_autobuild-server': patch -'@grasdouble/lufa_design-system-themes': patch -'@grasdouble/lufa_design-system-tokens': patch -'@grasdouble/lufa_design-system': patch -'@grasdouble/lufa_design-system-cli': patch ---- - -Fix tokens and their usage diff --git a/.changeset/fix-design-system-tokens-and-components.md b/.changeset/fix-design-system-tokens-and-components.md deleted file mode 100644 index 36cbdbce..00000000 --- a/.changeset/fix-design-system-tokens-and-components.md +++ /dev/null @@ -1,51 +0,0 @@ ---- -'@grasdouble/lufa_design-system': patch -'@grasdouble/lufa_design-system-tokens': patch -'@grasdouble/lufa_design-system-storybook': patch -'@grasdouble/lufa_design-system-playwright': patch -'@grasdouble/lufa_design-system-cli': patch -'@grasdouble/lufa_design-system-docusaurus': patch -'@grasdouble/lufa_plugin_vscode_lufa-ds-preview': patch ---- - -fix(design-system): token usage corrections and component enhancements - -## Token System Fixes - -### Correct Token Usage -- **Text Component**: Use typography font-weight tokens instead of hardcoded values (400, 500, 600, 700) -- **Button Component**: Use semantic UI radius tokens instead of primitive radius scale -- **Input Component**: Use component-specific tokens for all properties (padding, font-size, colors, borders) -- **Label Component**: Use component-specific tokens for font-size, color, spacing, and line-height -- **Card Component**: Add proper color token for text color - -### Removed Deprecated Theme File -- Removed all `--lufa-token-*` custom properties from `theme.css` -- Theme-specific overrides now properly use the standard token hierarchy (`--lufa-core-*`, `--lufa-semantic-*`, `--lufa-component-*`) -- Theme file is now intentionally empty with documentation explaining the new approach - -## Component Enhancements - -### New Features -- **Flex Component**: Added `gap="none"` prop for zero gap spacing -- **Grid Component**: Added `gap="none"`, `gapX="none"`, and `gapY="none"` props for zero gap spacing -- **Stack Component**: Fixed `spacing="none"` to use 0 instead of tight spacing - -### CSS Improvements -- Improved CSS formatting and readability across components -- Better use of CSS custom properties -- Consistent multi-line gradient declarations in Divider component - -## Visual Regression Tests -- Added comprehensive Playwright visual snapshots for all components in both light and dark modes -- Snapshots cover: Badge, Box, Button, Card, Center, Container, Divider, Flex, Grid, Icon, Input, Label, Stack, Text - -## Type Safety -- Improved TypeScript types with proper interface formatting -- Better type consistency across hook definitions - -## Breaking Changes -None - All changes maintain backward compatibility - -## Migration -No action required - Changes are either internal or additive features diff --git a/.changeset/foundation-components-adr012.md b/.changeset/foundation-components-adr012.md deleted file mode 100644 index a9efb792..00000000 --- a/.changeset/foundation-components-adr012.md +++ /dev/null @@ -1,40 +0,0 @@ ---- -"@grasdouble/lufa_design-system": minor -"@grasdouble/lufa_design-system-docusaurus": patch -"@grasdouble/lufa_design-system-storybook": patch -"@grasdouble/lufa_design-system-playwright": patch ---- - -feat(design-system): implement ADR-012 Foundation components documentation - -## New Foundation Components - -Added 3 new foundation layout components with comprehensive documentation, tests, and Storybook stories: - -- **AspectRatio** - Maintains consistent aspect ratios for media and containers (28 tests) -- **Bleed** - Breaks out of container constraints for full-width content (23 tests) -- **Cluster** - Wrapping layout for collections with intelligent spacing (67 tests) - -## Component Reclassification - -- **Divider** moved from Content → Foundation category (maintains backward compatibility) - -## Documentation - -- Complete MDX documentation for all 3 new components following official template -- Interactive live demos with LiveDemoSection tabs -- Updated component overview with 10 Foundation components total - -## Architecture - -Foundation components now total 10 as per ADR-012: -1. Box, Stack, Flex, Grid, Container, Center (existing) -2. Divider (reclassified from Content) -3. AspectRatio, Cluster, Bleed (new) - -All components include: -- Full TypeScript support with polymorphic APIs -- Accessibility compliance (WCAG 2.1 AA) -- Design token integration -- Visual regression tests -- Storybook stories diff --git a/.changeset/proud-panthers-obey.md b/.changeset/proud-panthers-obey.md deleted file mode 100644 index d437f3e5..00000000 --- a/.changeset/proud-panthers-obey.md +++ /dev/null @@ -1,43 +0,0 @@ ---- -'@grasdouble/lufa_design-system': major -'@grasdouble/lufa_design-system-tokens': minor -'@grasdouble/lufa_design-system-storybook': minor -'@grasdouble/lufa_design-system-docusaurus': minor -'@grasdouble/lufa_design-system-playwright': minor ---- - -refactor(design-system): migrate to 5-category structure and eliminate token warnings - -BREAKING CHANGE: Component organization changed from 3-layer to 5-category structure - -## Component Migration (3-layer → 5-category) - -Migrated 16 components to new semantic categories: -- **Foundation** (6): Box, Stack, Flex, Grid, Container, Center -- **Content** (4): Text, Icon, Badge, Divider -- **Interaction** (3): Button, Input, Label -- **Composition** (1): Card -- **Utility** (2): Portal, VisuallyHidden - -**Note**: Public API unchanged - imports from `@grasdouble/lufa_design-system` work as before. - -## Token System Improvements - -- Created custom `size/rem/fluid` transform for fluid typography -- Created custom `shadow/css/shorthand-custom` transform -- Eliminated all 22 transformation warnings (now 0 warnings) -- Updated style-dictionary config with explicit transform order -- Fixed value resolution order in CSS and JSON formats - -## Documentation Updates - -- Updated 17 Storybook story titles to reflect new categories -- Fixed component count in READMEs (16/16 complete) -- Updated 15 internal documentation files -- Replaced deprecated primitives package reference with tokens - -## Testing Infrastructure - -- Migrated 16 Playwright tests + 28 snapshots -- Migrated 23 Storybook stories -- Migrated 16 Docusaurus examples diff --git a/.changeset/quick-bobcats-post.md b/.changeset/quick-bobcats-post.md deleted file mode 100644 index feeeb7a9..00000000 --- a/.changeset/quick-bobcats-post.md +++ /dev/null @@ -1,6 +0,0 @@ ---- -'@grasdouble/lufa_plugin_vscode_lufa-ds-preview': patch -'@grasdouble/lufa_design-system-tokens': patch ---- - -Fix vscode extension to match changes made recentrly diff --git a/packages/apps/microfrontend/home/CHANGELOG.md b/packages/apps/microfrontend/home/CHANGELOG.md index f772143a..0c36277e 100644 --- a/packages/apps/microfrontend/home/CHANGELOG.md +++ b/packages/apps/microfrontend/home/CHANGELOG.md @@ -1,5 +1,16 @@ # @grasdouble/lufa_microfrontend_home +## 0.3.5 + +### Patch Changes + +- 03e75af: Fix tokens and their usage +- Updated dependencies [03e75af] +- Updated dependencies [18d206b] +- Updated dependencies [4d7849f] +- Updated dependencies [4f51c98] + - @grasdouble/lufa_design-system@2.0.0 + ## 0.3.4 ### Patch Changes diff --git a/packages/apps/microfrontend/home/package.json b/packages/apps/microfrontend/home/package.json index 718e5a28..25336ee4 100644 --- a/packages/apps/microfrontend/home/package.json +++ b/packages/apps/microfrontend/home/package.json @@ -1,6 +1,6 @@ { "name": "@grasdouble/lufa_microfrontend_home", - "version": "0.3.4", + "version": "0.3.5", "private": false, "license": "MIT", "type": "module", diff --git a/packages/apps/microfrontend/main-container/CHANGELOG.md b/packages/apps/microfrontend/main-container/CHANGELOG.md index 933d5017..cdab4797 100644 --- a/packages/apps/microfrontend/main-container/CHANGELOG.md +++ b/packages/apps/microfrontend/main-container/CHANGELOG.md @@ -1,5 +1,16 @@ # @grasdouble/lufa_microfrontend_main-container +## 0.6.13 + +### Patch Changes + +- 03e75af: Fix tokens and their usage +- Updated dependencies [03e75af] +- Updated dependencies [18d206b] +- Updated dependencies [4d7849f] +- Updated dependencies [4f51c98] + - @grasdouble/lufa_design-system@2.0.0 + ## 0.6.12 ### Patch Changes diff --git a/packages/apps/microfrontend/main-container/package.json b/packages/apps/microfrontend/main-container/package.json index 18800e98..d119fa17 100644 --- a/packages/apps/microfrontend/main-container/package.json +++ b/packages/apps/microfrontend/main-container/package.json @@ -1,6 +1,6 @@ { "name": "@grasdouble/lufa_microfrontend_main-container", - "version": "0.6.12", + "version": "0.6.13", "private": true, "license": "MIT", "type": "module", diff --git a/packages/cdn/autobuild-server/CHANGELOG.md b/packages/cdn/autobuild-server/CHANGELOG.md index cf1fa4f3..eabd0f91 100644 --- a/packages/cdn/autobuild-server/CHANGELOG.md +++ b/packages/cdn/autobuild-server/CHANGELOG.md @@ -1,5 +1,11 @@ # @grasdouble/cdn_autobuild-server +## 0.3.4 + +### Patch Changes + +- 03e75af: Fix tokens and their usage + ## 0.3.3 ### Patch Changes diff --git a/packages/cdn/autobuild-server/package.json b/packages/cdn/autobuild-server/package.json index 8cab69af..417eb371 100644 --- a/packages/cdn/autobuild-server/package.json +++ b/packages/cdn/autobuild-server/package.json @@ -1,6 +1,6 @@ { "name": "@grasdouble/cdn_autobuild-server", - "version": "0.3.3", + "version": "0.3.4", "private": false, "description": "Self-fed CDN from npm packages", "type": "module", diff --git a/packages/design-system/cli/CHANGELOG.md b/packages/design-system/cli/CHANGELOG.md index 406830dc..102fce58 100644 --- a/packages/design-system/cli/CHANGELOG.md +++ b/packages/design-system/cli/CHANGELOG.md @@ -1,5 +1,60 @@ # @grasdouble/lufa_design-system-cli +## 1.0.1 + +### Patch Changes + +- 03e75af: Fix tokens and their usage +- 18d206b: fix(design-system): token usage corrections and component enhancements + + ## Token System Fixes + + ### Correct Token Usage + - **Text Component**: Use typography font-weight tokens instead of hardcoded values (400, 500, 600, 700) + - **Button Component**: Use semantic UI radius tokens instead of primitive radius scale + - **Input Component**: Use component-specific tokens for all properties (padding, font-size, colors, borders) + - **Label Component**: Use component-specific tokens for font-size, color, spacing, and line-height + - **Card Component**: Add proper color token for text color + + ### Removed Deprecated Theme File + - Removed all `--lufa-token-*` custom properties from `theme.css` + - Theme-specific overrides now properly use the standard token hierarchy (`--lufa-core-*`, `--lufa-semantic-*`, `--lufa-component-*`) + - Theme file is now intentionally empty with documentation explaining the new approach + + ## Component Enhancements + + ### New Features + - **Flex Component**: Added `gap="none"` prop for zero gap spacing + - **Grid Component**: Added `gap="none"`, `gapX="none"`, and `gapY="none"` props for zero gap spacing + - **Stack Component**: Fixed `spacing="none"` to use 0 instead of tight spacing + + ### CSS Improvements + - Improved CSS formatting and readability across components + - Better use of CSS custom properties + - Consistent multi-line gradient declarations in Divider component + + ## Visual Regression Tests + - Added comprehensive Playwright visual snapshots for all components in both light and dark modes + - Snapshots cover: Badge, Box, Button, Card, Center, Container, Divider, Flex, Grid, Icon, Input, Label, Stack, Text + + ## Type Safety + - Improved TypeScript types with proper interface formatting + - Better type consistency across hook definitions + + ## Breaking Changes + + None - All changes maintain backward compatibility + + ## Migration + + No action required - Changes are either internal or additive features + +- Updated dependencies [03e75af] +- Updated dependencies [18d206b] +- Updated dependencies [4f51c98] +- Updated dependencies [976a5f8] + - @grasdouble/lufa_design-system-tokens@1.1.0 + ## 1.0.0 ### Major Changes diff --git a/packages/design-system/cli/package.json b/packages/design-system/cli/package.json index 435e975b..9b43ad69 100644 --- a/packages/design-system/cli/package.json +++ b/packages/design-system/cli/package.json @@ -1,6 +1,6 @@ { "name": "@grasdouble/lufa_design-system-cli", - "version": "1.0.0", + "version": "1.0.1", "private": false, "description": "Lufa Design System - CLI tools for theme validation", "license": "MIT", diff --git a/packages/design-system/docusaurus/CHANGELOG.md b/packages/design-system/docusaurus/CHANGELOG.md index 5c512054..2ba68863 100644 --- a/packages/design-system/docusaurus/CHANGELOG.md +++ b/packages/design-system/docusaurus/CHANGELOG.md @@ -1,5 +1,129 @@ # @grasdouble/lufa_design-system-docusaurus +## 1.1.0 + +### Minor Changes + +- 4f51c98: refactor(design-system): migrate to 5-category structure and eliminate token warnings + + BREAKING CHANGE: Component organization changed from 3-layer to 5-category structure + + ## Component Migration (3-layer → 5-category) + + Migrated 16 components to new semantic categories: + - **Foundation** (6): Box, Stack, Flex, Grid, Container, Center + - **Content** (4): Text, Icon, Badge, Divider + - **Interaction** (3): Button, Input, Label + - **Composition** (1): Card + - **Utility** (2): Portal, VisuallyHidden + + **Note**: Public API unchanged - imports from `@grasdouble/lufa_design-system` work as before. + + ## Token System Improvements + - Created custom `size/rem/fluid` transform for fluid typography + - Created custom `shadow/css/shorthand-custom` transform + - Eliminated all 22 transformation warnings (now 0 warnings) + - Updated style-dictionary config with explicit transform order + - Fixed value resolution order in CSS and JSON formats + + ## Documentation Updates + - Updated 17 Storybook story titles to reflect new categories + - Fixed component count in READMEs (16/16 complete) + - Updated 15 internal documentation files + - Replaced deprecated primitives package reference with tokens + + ## Testing Infrastructure + - Migrated 16 Playwright tests + 28 snapshots + - Migrated 23 Storybook stories + - Migrated 16 Docusaurus examples + +### Patch Changes + +- 03e75af: Fix tokens and their usage +- 18d206b: fix(design-system): token usage corrections and component enhancements + + ## Token System Fixes + + ### Correct Token Usage + - **Text Component**: Use typography font-weight tokens instead of hardcoded values (400, 500, 600, 700) + - **Button Component**: Use semantic UI radius tokens instead of primitive radius scale + - **Input Component**: Use component-specific tokens for all properties (padding, font-size, colors, borders) + - **Label Component**: Use component-specific tokens for font-size, color, spacing, and line-height + - **Card Component**: Add proper color token for text color + + ### Removed Deprecated Theme File + - Removed all `--lufa-token-*` custom properties from `theme.css` + - Theme-specific overrides now properly use the standard token hierarchy (`--lufa-core-*`, `--lufa-semantic-*`, `--lufa-component-*`) + - Theme file is now intentionally empty with documentation explaining the new approach + + ## Component Enhancements + + ### New Features + - **Flex Component**: Added `gap="none"` prop for zero gap spacing + - **Grid Component**: Added `gap="none"`, `gapX="none"`, and `gapY="none"` props for zero gap spacing + - **Stack Component**: Fixed `spacing="none"` to use 0 instead of tight spacing + + ### CSS Improvements + - Improved CSS formatting and readability across components + - Better use of CSS custom properties + - Consistent multi-line gradient declarations in Divider component + + ## Visual Regression Tests + - Added comprehensive Playwright visual snapshots for all components in both light and dark modes + - Snapshots cover: Badge, Box, Button, Card, Center, Container, Divider, Flex, Grid, Icon, Input, Label, Stack, Text + + ## Type Safety + - Improved TypeScript types with proper interface formatting + - Better type consistency across hook definitions + + ## Breaking Changes + + None - All changes maintain backward compatibility + + ## Migration + + No action required - Changes are either internal or additive features + +- 4d7849f: feat(design-system): implement ADR-012 Foundation components documentation + + ## New Foundation Components + + Added 3 new foundation layout components with comprehensive documentation, tests, and Storybook stories: + - **AspectRatio** - Maintains consistent aspect ratios for media and containers (28 tests) + - **Bleed** - Breaks out of container constraints for full-width content (23 tests) + - **Cluster** - Wrapping layout for collections with intelligent spacing (67 tests) + + ## Component Reclassification + - **Divider** moved from Content → Foundation category (maintains backward compatibility) + + ## Documentation + - Complete MDX documentation for all 3 new components following official template + - Interactive live demos with LiveDemoSection tabs + - Updated component overview with 10 Foundation components total + + ## Architecture + + Foundation components now total 10 as per ADR-012: + 1. Box, Stack, Flex, Grid, Container, Center (existing) + 2. Divider (reclassified from Content) + 3. AspectRatio, Cluster, Bleed (new) + + All components include: + - Full TypeScript support with polymorphic APIs + - Accessibility compliance (WCAG 2.1 AA) + - Design token integration + - Visual regression tests + - Storybook stories + +- Updated dependencies [03e75af] +- Updated dependencies [18d206b] +- Updated dependencies [4d7849f] +- Updated dependencies [4f51c98] +- Updated dependencies [976a5f8] + - @grasdouble/lufa_design-system-themes@1.0.1 + - @grasdouble/lufa_design-system-tokens@1.1.0 + - @grasdouble/lufa_design-system@2.0.0 + ## 1.0.0 ### Major Changes diff --git a/packages/design-system/docusaurus/package.json b/packages/design-system/docusaurus/package.json index 0ea04625..6d364655 100644 --- a/packages/design-system/docusaurus/package.json +++ b/packages/design-system/docusaurus/package.json @@ -1,6 +1,6 @@ { "name": "@grasdouble/lufa_design-system-docusaurus", - "version": "1.0.0", + "version": "1.1.0", "private": true, "license": "MIT", "scripts": { diff --git a/packages/design-system/main/CHANGELOG.md b/packages/design-system/main/CHANGELOG.md index f679991b..ddadcddb 100644 --- a/packages/design-system/main/CHANGELOG.md +++ b/packages/design-system/main/CHANGELOG.md @@ -1,5 +1,128 @@ # @grasdouble/lufa_design-system +## 2.0.0 + +### Major Changes + +- 4f51c98: refactor(design-system): migrate to 5-category structure and eliminate token warnings + + BREAKING CHANGE: Component organization changed from 3-layer to 5-category structure + + ## Component Migration (3-layer → 5-category) + + Migrated 16 components to new semantic categories: + - **Foundation** (6): Box, Stack, Flex, Grid, Container, Center + - **Content** (4): Text, Icon, Badge, Divider + - **Interaction** (3): Button, Input, Label + - **Composition** (1): Card + - **Utility** (2): Portal, VisuallyHidden + + **Note**: Public API unchanged - imports from `@grasdouble/lufa_design-system` work as before. + + ## Token System Improvements + - Created custom `size/rem/fluid` transform for fluid typography + - Created custom `shadow/css/shorthand-custom` transform + - Eliminated all 22 transformation warnings (now 0 warnings) + - Updated style-dictionary config with explicit transform order + - Fixed value resolution order in CSS and JSON formats + + ## Documentation Updates + - Updated 17 Storybook story titles to reflect new categories + - Fixed component count in READMEs (16/16 complete) + - Updated 15 internal documentation files + - Replaced deprecated primitives package reference with tokens + + ## Testing Infrastructure + - Migrated 16 Playwright tests + 28 snapshots + - Migrated 23 Storybook stories + - Migrated 16 Docusaurus examples + +### Minor Changes + +- 4d7849f: feat(design-system): implement ADR-012 Foundation components documentation + + ## New Foundation Components + + Added 3 new foundation layout components with comprehensive documentation, tests, and Storybook stories: + - **AspectRatio** - Maintains consistent aspect ratios for media and containers (28 tests) + - **Bleed** - Breaks out of container constraints for full-width content (23 tests) + - **Cluster** - Wrapping layout for collections with intelligent spacing (67 tests) + + ## Component Reclassification + - **Divider** moved from Content → Foundation category (maintains backward compatibility) + + ## Documentation + - Complete MDX documentation for all 3 new components following official template + - Interactive live demos with LiveDemoSection tabs + - Updated component overview with 10 Foundation components total + + ## Architecture + + Foundation components now total 10 as per ADR-012: + 1. Box, Stack, Flex, Grid, Container, Center (existing) + 2. Divider (reclassified from Content) + 3. AspectRatio, Cluster, Bleed (new) + + All components include: + - Full TypeScript support with polymorphic APIs + - Accessibility compliance (WCAG 2.1 AA) + - Design token integration + - Visual regression tests + - Storybook stories + +### Patch Changes + +- 03e75af: Fix tokens and their usage +- 18d206b: fix(design-system): token usage corrections and component enhancements + + ## Token System Fixes + + ### Correct Token Usage + - **Text Component**: Use typography font-weight tokens instead of hardcoded values (400, 500, 600, 700) + - **Button Component**: Use semantic UI radius tokens instead of primitive radius scale + - **Input Component**: Use component-specific tokens for all properties (padding, font-size, colors, borders) + - **Label Component**: Use component-specific tokens for font-size, color, spacing, and line-height + - **Card Component**: Add proper color token for text color + + ### Removed Deprecated Theme File + - Removed all `--lufa-token-*` custom properties from `theme.css` + - Theme-specific overrides now properly use the standard token hierarchy (`--lufa-core-*`, `--lufa-semantic-*`, `--lufa-component-*`) + - Theme file is now intentionally empty with documentation explaining the new approach + + ## Component Enhancements + + ### New Features + - **Flex Component**: Added `gap="none"` prop for zero gap spacing + - **Grid Component**: Added `gap="none"`, `gapX="none"`, and `gapY="none"` props for zero gap spacing + - **Stack Component**: Fixed `spacing="none"` to use 0 instead of tight spacing + + ### CSS Improvements + - Improved CSS formatting and readability across components + - Better use of CSS custom properties + - Consistent multi-line gradient declarations in Divider component + + ## Visual Regression Tests + - Added comprehensive Playwright visual snapshots for all components in both light and dark modes + - Snapshots cover: Badge, Box, Button, Card, Center, Container, Divider, Flex, Grid, Icon, Input, Label, Stack, Text + + ## Type Safety + - Improved TypeScript types with proper interface formatting + - Better type consistency across hook definitions + + ## Breaking Changes + + None - All changes maintain backward compatibility + + ## Migration + + No action required - Changes are either internal or additive features + +- Updated dependencies [03e75af] +- Updated dependencies [18d206b] +- Updated dependencies [4f51c98] +- Updated dependencies [976a5f8] + - @grasdouble/lufa_design-system-tokens@1.1.0 + ## 1.0.0 ### Major Changes diff --git a/packages/design-system/main/package.json b/packages/design-system/main/package.json index 287bf366..8fc67a77 100644 --- a/packages/design-system/main/package.json +++ b/packages/design-system/main/package.json @@ -1,6 +1,6 @@ { "name": "@grasdouble/lufa_design-system", - "version": "1.0.0", + "version": "2.0.0", "private": false, "license": "MIT", "type": "module", diff --git a/packages/design-system/playwright/CHANGELOG.md b/packages/design-system/playwright/CHANGELOG.md index e08b8797..8bc13bfe 100644 --- a/packages/design-system/playwright/CHANGELOG.md +++ b/packages/design-system/playwright/CHANGELOG.md @@ -1,5 +1,120 @@ # @grasdouble/lufa_design-system-playwright +## 1.1.0 + +### Minor Changes + +- 4f51c98: refactor(design-system): migrate to 5-category structure and eliminate token warnings + + BREAKING CHANGE: Component organization changed from 3-layer to 5-category structure + + ## Component Migration (3-layer → 5-category) + + Migrated 16 components to new semantic categories: + - **Foundation** (6): Box, Stack, Flex, Grid, Container, Center + - **Content** (4): Text, Icon, Badge, Divider + - **Interaction** (3): Button, Input, Label + - **Composition** (1): Card + - **Utility** (2): Portal, VisuallyHidden + + **Note**: Public API unchanged - imports from `@grasdouble/lufa_design-system` work as before. + + ## Token System Improvements + - Created custom `size/rem/fluid` transform for fluid typography + - Created custom `shadow/css/shorthand-custom` transform + - Eliminated all 22 transformation warnings (now 0 warnings) + - Updated style-dictionary config with explicit transform order + - Fixed value resolution order in CSS and JSON formats + + ## Documentation Updates + - Updated 17 Storybook story titles to reflect new categories + - Fixed component count in READMEs (16/16 complete) + - Updated 15 internal documentation files + - Replaced deprecated primitives package reference with tokens + + ## Testing Infrastructure + - Migrated 16 Playwright tests + 28 snapshots + - Migrated 23 Storybook stories + - Migrated 16 Docusaurus examples + +### Patch Changes + +- 03e75af: Fix tokens and their usage +- 18d206b: fix(design-system): token usage corrections and component enhancements + + ## Token System Fixes + + ### Correct Token Usage + - **Text Component**: Use typography font-weight tokens instead of hardcoded values (400, 500, 600, 700) + - **Button Component**: Use semantic UI radius tokens instead of primitive radius scale + - **Input Component**: Use component-specific tokens for all properties (padding, font-size, colors, borders) + - **Label Component**: Use component-specific tokens for font-size, color, spacing, and line-height + - **Card Component**: Add proper color token for text color + + ### Removed Deprecated Theme File + - Removed all `--lufa-token-*` custom properties from `theme.css` + - Theme-specific overrides now properly use the standard token hierarchy (`--lufa-core-*`, `--lufa-semantic-*`, `--lufa-component-*`) + - Theme file is now intentionally empty with documentation explaining the new approach + + ## Component Enhancements + + ### New Features + - **Flex Component**: Added `gap="none"` prop for zero gap spacing + - **Grid Component**: Added `gap="none"`, `gapX="none"`, and `gapY="none"` props for zero gap spacing + - **Stack Component**: Fixed `spacing="none"` to use 0 instead of tight spacing + + ### CSS Improvements + - Improved CSS formatting and readability across components + - Better use of CSS custom properties + - Consistent multi-line gradient declarations in Divider component + + ## Visual Regression Tests + - Added comprehensive Playwright visual snapshots for all components in both light and dark modes + - Snapshots cover: Badge, Box, Button, Card, Center, Container, Divider, Flex, Grid, Icon, Input, Label, Stack, Text + + ## Type Safety + - Improved TypeScript types with proper interface formatting + - Better type consistency across hook definitions + + ## Breaking Changes + + None - All changes maintain backward compatibility + + ## Migration + + No action required - Changes are either internal or additive features + +- 4d7849f: feat(design-system): implement ADR-012 Foundation components documentation + + ## New Foundation Components + + Added 3 new foundation layout components with comprehensive documentation, tests, and Storybook stories: + - **AspectRatio** - Maintains consistent aspect ratios for media and containers (28 tests) + - **Bleed** - Breaks out of container constraints for full-width content (23 tests) + - **Cluster** - Wrapping layout for collections with intelligent spacing (67 tests) + + ## Component Reclassification + - **Divider** moved from Content → Foundation category (maintains backward compatibility) + + ## Documentation + - Complete MDX documentation for all 3 new components following official template + - Interactive live demos with LiveDemoSection tabs + - Updated component overview with 10 Foundation components total + + ## Architecture + + Foundation components now total 10 as per ADR-012: + 1. Box, Stack, Flex, Grid, Container, Center (existing) + 2. Divider (reclassified from Content) + 3. AspectRatio, Cluster, Bleed (new) + + All components include: + - Full TypeScript support with polymorphic APIs + - Accessibility compliance (WCAG 2.1 AA) + - Design token integration + - Visual regression tests + - Storybook stories + ## 1.0.0 ### Major Changes diff --git a/packages/design-system/playwright/package.json b/packages/design-system/playwright/package.json index 7d1c934f..c4b4031f 100644 --- a/packages/design-system/playwright/package.json +++ b/packages/design-system/playwright/package.json @@ -1,6 +1,6 @@ { "name": "@grasdouble/lufa_design-system-playwright", - "version": "1.0.0", + "version": "1.1.0", "private": true, "description": "", "keywords": [], diff --git a/packages/design-system/storybook/CHANGELOG.md b/packages/design-system/storybook/CHANGELOG.md index 99579166..125a30cc 100644 --- a/packages/design-system/storybook/CHANGELOG.md +++ b/packages/design-system/storybook/CHANGELOG.md @@ -1,5 +1,129 @@ # @grasdouble/lufa_design-system-storybook +## 1.1.0 + +### Minor Changes + +- 4f51c98: refactor(design-system): migrate to 5-category structure and eliminate token warnings + + BREAKING CHANGE: Component organization changed from 3-layer to 5-category structure + + ## Component Migration (3-layer → 5-category) + + Migrated 16 components to new semantic categories: + - **Foundation** (6): Box, Stack, Flex, Grid, Container, Center + - **Content** (4): Text, Icon, Badge, Divider + - **Interaction** (3): Button, Input, Label + - **Composition** (1): Card + - **Utility** (2): Portal, VisuallyHidden + + **Note**: Public API unchanged - imports from `@grasdouble/lufa_design-system` work as before. + + ## Token System Improvements + - Created custom `size/rem/fluid` transform for fluid typography + - Created custom `shadow/css/shorthand-custom` transform + - Eliminated all 22 transformation warnings (now 0 warnings) + - Updated style-dictionary config with explicit transform order + - Fixed value resolution order in CSS and JSON formats + + ## Documentation Updates + - Updated 17 Storybook story titles to reflect new categories + - Fixed component count in READMEs (16/16 complete) + - Updated 15 internal documentation files + - Replaced deprecated primitives package reference with tokens + + ## Testing Infrastructure + - Migrated 16 Playwright tests + 28 snapshots + - Migrated 23 Storybook stories + - Migrated 16 Docusaurus examples + +### Patch Changes + +- 03e75af: Fix tokens and their usage +- 18d206b: fix(design-system): token usage corrections and component enhancements + + ## Token System Fixes + + ### Correct Token Usage + - **Text Component**: Use typography font-weight tokens instead of hardcoded values (400, 500, 600, 700) + - **Button Component**: Use semantic UI radius tokens instead of primitive radius scale + - **Input Component**: Use component-specific tokens for all properties (padding, font-size, colors, borders) + - **Label Component**: Use component-specific tokens for font-size, color, spacing, and line-height + - **Card Component**: Add proper color token for text color + + ### Removed Deprecated Theme File + - Removed all `--lufa-token-*` custom properties from `theme.css` + - Theme-specific overrides now properly use the standard token hierarchy (`--lufa-core-*`, `--lufa-semantic-*`, `--lufa-component-*`) + - Theme file is now intentionally empty with documentation explaining the new approach + + ## Component Enhancements + + ### New Features + - **Flex Component**: Added `gap="none"` prop for zero gap spacing + - **Grid Component**: Added `gap="none"`, `gapX="none"`, and `gapY="none"` props for zero gap spacing + - **Stack Component**: Fixed `spacing="none"` to use 0 instead of tight spacing + + ### CSS Improvements + - Improved CSS formatting and readability across components + - Better use of CSS custom properties + - Consistent multi-line gradient declarations in Divider component + + ## Visual Regression Tests + - Added comprehensive Playwright visual snapshots for all components in both light and dark modes + - Snapshots cover: Badge, Box, Button, Card, Center, Container, Divider, Flex, Grid, Icon, Input, Label, Stack, Text + + ## Type Safety + - Improved TypeScript types with proper interface formatting + - Better type consistency across hook definitions + + ## Breaking Changes + + None - All changes maintain backward compatibility + + ## Migration + + No action required - Changes are either internal or additive features + +- 4d7849f: feat(design-system): implement ADR-012 Foundation components documentation + + ## New Foundation Components + + Added 3 new foundation layout components with comprehensive documentation, tests, and Storybook stories: + - **AspectRatio** - Maintains consistent aspect ratios for media and containers (28 tests) + - **Bleed** - Breaks out of container constraints for full-width content (23 tests) + - **Cluster** - Wrapping layout for collections with intelligent spacing (67 tests) + + ## Component Reclassification + - **Divider** moved from Content → Foundation category (maintains backward compatibility) + + ## Documentation + - Complete MDX documentation for all 3 new components following official template + - Interactive live demos with LiveDemoSection tabs + - Updated component overview with 10 Foundation components total + + ## Architecture + + Foundation components now total 10 as per ADR-012: + 1. Box, Stack, Flex, Grid, Container, Center (existing) + 2. Divider (reclassified from Content) + 3. AspectRatio, Cluster, Bleed (new) + + All components include: + - Full TypeScript support with polymorphic APIs + - Accessibility compliance (WCAG 2.1 AA) + - Design token integration + - Visual regression tests + - Storybook stories + +- Updated dependencies [03e75af] +- Updated dependencies [18d206b] +- Updated dependencies [4d7849f] +- Updated dependencies [4f51c98] +- Updated dependencies [976a5f8] + - @grasdouble/lufa_design-system-themes@1.0.1 + - @grasdouble/lufa_design-system-tokens@1.1.0 + - @grasdouble/lufa_design-system@2.0.0 + ## 1.0.0 ### Major Changes diff --git a/packages/design-system/storybook/package.json b/packages/design-system/storybook/package.json index 1aebb3f4..9fc0678f 100644 --- a/packages/design-system/storybook/package.json +++ b/packages/design-system/storybook/package.json @@ -1,6 +1,6 @@ { "name": "@grasdouble/lufa_design-system-storybook", - "version": "1.0.0", + "version": "1.1.0", "private": true, "license": "MIT", "type": "module", diff --git a/packages/design-system/themes/CHANGELOG.md b/packages/design-system/themes/CHANGELOG.md index aee9d1a5..cbacf65d 100644 --- a/packages/design-system/themes/CHANGELOG.md +++ b/packages/design-system/themes/CHANGELOG.md @@ -1,5 +1,16 @@ # @grasdouble/lufa_design-system-themes +## 1.0.1 + +### Patch Changes + +- 03e75af: Fix tokens and their usage +- Updated dependencies [03e75af] +- Updated dependencies [18d206b] +- Updated dependencies [4f51c98] +- Updated dependencies [976a5f8] + - @grasdouble/lufa_design-system-tokens@1.1.0 + ## 1.0.0 ### Major Changes diff --git a/packages/design-system/themes/package.json b/packages/design-system/themes/package.json index c1860960..fb2fcb96 100644 --- a/packages/design-system/themes/package.json +++ b/packages/design-system/themes/package.json @@ -1,6 +1,6 @@ { "name": "@grasdouble/lufa_design-system-themes", - "version": "1.0.0", + "version": "1.0.1", "private": false, "description": "Lufa Design System - Theme variants (ocean, forest, etc.)", "license": "MIT", diff --git a/packages/design-system/tokens/CHANGELOG.md b/packages/design-system/tokens/CHANGELOG.md index 2c97abde..b66ae743 100644 --- a/packages/design-system/tokens/CHANGELOG.md +++ b/packages/design-system/tokens/CHANGELOG.md @@ -1,5 +1,91 @@ # @grasdouble/lufa_design-system-tokens +## 1.1.0 + +### Minor Changes + +- 4f51c98: refactor(design-system): migrate to 5-category structure and eliminate token warnings + + BREAKING CHANGE: Component organization changed from 3-layer to 5-category structure + + ## Component Migration (3-layer → 5-category) + + Migrated 16 components to new semantic categories: + - **Foundation** (6): Box, Stack, Flex, Grid, Container, Center + - **Content** (4): Text, Icon, Badge, Divider + - **Interaction** (3): Button, Input, Label + - **Composition** (1): Card + - **Utility** (2): Portal, VisuallyHidden + + **Note**: Public API unchanged - imports from `@grasdouble/lufa_design-system` work as before. + + ## Token System Improvements + - Created custom `size/rem/fluid` transform for fluid typography + - Created custom `shadow/css/shorthand-custom` transform + - Eliminated all 22 transformation warnings (now 0 warnings) + - Updated style-dictionary config with explicit transform order + - Fixed value resolution order in CSS and JSON formats + + ## Documentation Updates + - Updated 17 Storybook story titles to reflect new categories + - Fixed component count in READMEs (16/16 complete) + - Updated 15 internal documentation files + - Replaced deprecated primitives package reference with tokens + + ## Testing Infrastructure + - Migrated 16 Playwright tests + 28 snapshots + - Migrated 23 Storybook stories + - Migrated 16 Docusaurus examples + +### Patch Changes + +- 03e75af: Fix tokens and their usage +- 18d206b: fix(design-system): token usage corrections and component enhancements + + ## Token System Fixes + + ### Correct Token Usage + - **Text Component**: Use typography font-weight tokens instead of hardcoded values (400, 500, 600, 700) + - **Button Component**: Use semantic UI radius tokens instead of primitive radius scale + - **Input Component**: Use component-specific tokens for all properties (padding, font-size, colors, borders) + - **Label Component**: Use component-specific tokens for font-size, color, spacing, and line-height + - **Card Component**: Add proper color token for text color + + ### Removed Deprecated Theme File + - Removed all `--lufa-token-*` custom properties from `theme.css` + - Theme-specific overrides now properly use the standard token hierarchy (`--lufa-core-*`, `--lufa-semantic-*`, `--lufa-component-*`) + - Theme file is now intentionally empty with documentation explaining the new approach + + ## Component Enhancements + + ### New Features + - **Flex Component**: Added `gap="none"` prop for zero gap spacing + - **Grid Component**: Added `gap="none"`, `gapX="none"`, and `gapY="none"` props for zero gap spacing + - **Stack Component**: Fixed `spacing="none"` to use 0 instead of tight spacing + + ### CSS Improvements + - Improved CSS formatting and readability across components + - Better use of CSS custom properties + - Consistent multi-line gradient declarations in Divider component + + ## Visual Regression Tests + - Added comprehensive Playwright visual snapshots for all components in both light and dark modes + - Snapshots cover: Badge, Box, Button, Card, Center, Container, Divider, Flex, Grid, Icon, Input, Label, Stack, Text + + ## Type Safety + - Improved TypeScript types with proper interface formatting + - Better type consistency across hook definitions + + ## Breaking Changes + + None - All changes maintain backward compatibility + + ## Migration + + No action required - Changes are either internal or additive features + +- 976a5f8: Fix vscode extension to match changes made recentrly + ## 1.0.0 ### Major Changes diff --git a/packages/design-system/tokens/package.json b/packages/design-system/tokens/package.json index c1951909..cb966945 100644 --- a/packages/design-system/tokens/package.json +++ b/packages/design-system/tokens/package.json @@ -1,6 +1,6 @@ { "name": "@grasdouble/lufa_design-system-tokens", - "version": "1.0.0", + "version": "1.1.0", "private": false, "description": "Lufa Design System - Semantic design tokens (colors, spacing, typography, etc.)", "license": "MIT", diff --git a/packages/plugins/vscode/vscode-lufa-ds-preview/CHANGELOG.md b/packages/plugins/vscode/vscode-lufa-ds-preview/CHANGELOG.md index a52fa925..03651291 100644 --- a/packages/plugins/vscode/vscode-lufa-ds-preview/CHANGELOG.md +++ b/packages/plugins/vscode/vscode-lufa-ds-preview/CHANGELOG.md @@ -1,5 +1,61 @@ # @grasdouble/lufa_plugin_vscode_lufa-ds-preview +## 0.4.4 + +### Patch Changes + +- 03e75af: Fix tokens and their usage +- 18d206b: fix(design-system): token usage corrections and component enhancements + + ## Token System Fixes + + ### Correct Token Usage + - **Text Component**: Use typography font-weight tokens instead of hardcoded values (400, 500, 600, 700) + - **Button Component**: Use semantic UI radius tokens instead of primitive radius scale + - **Input Component**: Use component-specific tokens for all properties (padding, font-size, colors, borders) + - **Label Component**: Use component-specific tokens for font-size, color, spacing, and line-height + - **Card Component**: Add proper color token for text color + + ### Removed Deprecated Theme File + - Removed all `--lufa-token-*` custom properties from `theme.css` + - Theme-specific overrides now properly use the standard token hierarchy (`--lufa-core-*`, `--lufa-semantic-*`, `--lufa-component-*`) + - Theme file is now intentionally empty with documentation explaining the new approach + + ## Component Enhancements + + ### New Features + - **Flex Component**: Added `gap="none"` prop for zero gap spacing + - **Grid Component**: Added `gap="none"`, `gapX="none"`, and `gapY="none"` props for zero gap spacing + - **Stack Component**: Fixed `spacing="none"` to use 0 instead of tight spacing + + ### CSS Improvements + - Improved CSS formatting and readability across components + - Better use of CSS custom properties + - Consistent multi-line gradient declarations in Divider component + + ## Visual Regression Tests + - Added comprehensive Playwright visual snapshots for all components in both light and dark modes + - Snapshots cover: Badge, Box, Button, Card, Center, Container, Divider, Flex, Grid, Icon, Input, Label, Stack, Text + + ## Type Safety + - Improved TypeScript types with proper interface formatting + - Better type consistency across hook definitions + + ## Breaking Changes + + None - All changes maintain backward compatibility + + ## Migration + + No action required - Changes are either internal or additive features + +- 976a5f8: Fix vscode extension to match changes made recentrly +- Updated dependencies [03e75af] +- Updated dependencies [18d206b] +- Updated dependencies [4f51c98] +- Updated dependencies [976a5f8] + - @grasdouble/lufa_design-system-tokens@1.1.0 + ## 0.4.3 ### Patch Changes diff --git a/packages/plugins/vscode/vscode-lufa-ds-preview/package.json b/packages/plugins/vscode/vscode-lufa-ds-preview/package.json index 0acde758..753b4448 100644 --- a/packages/plugins/vscode/vscode-lufa-ds-preview/package.json +++ b/packages/plugins/vscode/vscode-lufa-ds-preview/package.json @@ -1,7 +1,7 @@ { "name": "@grasdouble/lufa_plugin_vscode_lufa-ds-preview", "displayName": "Lufa DS Preview", - "version": "0.4.3", + "version": "0.4.4", "private": false, "description": "Token previews and decorators for the Lufa design system", "categories": [