@fastwork/xosmoz-theme 0.40.0 → 0.42.0

package/README.md

@@ -78,7 +78,7 @@ Surface and layout colors that adapt between light and dark themes.
 
 ### Semantic Colors
 
-Six semantic categories: `primary`, `danger`, `success`, `warning`, `info`, `neutral`.
+Eight semantic categories: `primary`, `danger`, `success`, `warning`, `info`, `neutral`, `orange`, `purple`.
 
 Each category follows the same token structure — replace `{name}` with the category:
 
@@ -116,16 +116,13 @@ Each category follows the same token structure — replace `{name}` with the cat
 
 ### Raw Color Palettes
 
-10-step scales (100–1000) for each palette. Available palettes: `fastwork`, `gray`, `green`, `mint`, `amber`, `red`, `orange`, `purple`, `cyan`, `black-alpha`, `white-alpha`.
+Single base color per palette. Available palettes: `fastwork`, `gray`, `green`, `yellow`, `red`, `orange`, `purple`, `cyan`.
 
 ```css
---xz-color-{palette}-100   /* lightest */
---xz-color-{palette}-200
-/* ... */
---xz-color-{palette}-1000  /* darkest */
+--xz-color-{palette}   /* palette base color */
 ```
 
-Alpha palettes (`black-alpha`, `white-alpha`) use opacity steps from 0.1 to 1.0.
+Each palette color is defined using OKLCH
 
 ### Typography
 
@@ -220,13 +217,14 @@ Usage: `font: var(--xz-font-heading1);`
 import { lightTheme, darkTheme, themes, getTheme, getThemeNames } from '@fastwork/xosmoz-theme';
 
 // Access raw palette colors
-lightTheme.colors.fastwork[600]       // 'oklch(0.613 0.233 260.608)'
-lightTheme.colors.gray[300]           // 'oklch(0.792 0.006 264.532)'
+lightTheme.palette.fastwork.value          // 'oklch(0.57 0.237 260.608)'
 
 // Access semantic colors
 lightTheme.colors.primary.bg[100]     // solid fill color
 lightTheme.colors.primary.fg[100]     // 'oklch(1 0 0 / 0.95)' — white for text on solid bg
 lightTheme.colors.primary.text[100]   // colored text
+lightTheme.colors.orange.bg[100]      // orange solid fill
+lightTheme.colors.purple.soft[100]    // purple tinted background
 
 // Access base tokens
 lightTheme.colors.surface[200]        // card background

package/dist/dart/xz_colors.generated.dart

@@ -37,10 +37,11 @@ class XzBaseScale {
   Color get shade400 => _shades[400]!;
 }
 
-/// Semantic role color with soft, line, bg, fg, text sub-groups.
+/// Semantic role color with soft, softSolid, line, bg, fg, text sub-groups.
 class XzRoleColor {
   const XzRoleColor({
     this.soft = const {},
+    this.softSolid = const {},
     this.line = const {},
     this.bg = const {},
     this.fg = const {},
@@ -48,6 +49,7 @@ class XzRoleColor {
   });
 
   final Map<int, Color> soft;
+  final Map<int, Color> softSolid;
   final Map<int, Color> line;
   final Map<int, Color> bg;
   final Map<int, Color> fg;
@@ -55,6 +57,8 @@ class XzRoleColor {
 
   Color get soft100 => soft[100]!;
   Color get soft200 => soft[200]!;
+  Color get softSolid100 => softSolid[100]!;
+  Color get softSolid200 => softSolid[200]!;
   Color get line100 => line[100]!;
   Color get line200 => line[200]!;
   Color get line300 => line[300]!;
@@ -67,120 +71,31 @@ class XzRoleColor {
 /// Palette colors — theme-independent. Access directly: XzPalette.fastwork.shade600
 abstract class XzPalette {
   static const fastwork = XzColorSwatch({
-    100: Color(0xFFE6F0FF),
-    200: Color(0xFFBDD6FF),
-    300: Color(0xFF94BCFF),
-    400: Color(0xFF6BA1FF),
-    500: Color(0xFF508FFF),
-    600: Color(0xFF2F7CFF),
-    700: Color(0xFF0B53C5),
-    800: Color(0xFF053F9A),
-    900: Color(0xFF042D72),
-    1000: Color(0xFF021B4A),
+
   });
 
   static const gray = XzColorSwatch({
-    100: Color(0xFFEFEFEF),
-    200: Color(0xFFD3D5D6),
-    300: Color(0xFFB9BBBF),
-    400: Color(0xFF9FA3A9),
-    500: Color(0xFF8A94A3),
-    600: Color(0xFF798598),
-    700: Color(0xFF4F5D72),
-    800: Color(0xFF3E4856),
-    900: Color(0xFF2B333E),
-    1000: Color(0xFF191F28),
-  });
 
-  static const green = XzColorSwatch({
-    100: Color(0xFFE5F4E5),
-    200: Color(0xFFB9E1B9),
-    300: Color(0xFF84D08D),
-    400: Color(0xFF47BF55),
-    500: Color(0xFF00B231),
-    600: Color(0xFF00A01F),
-    700: Color(0xFF007113),
-    800: Color(0xFF00570C),
-    900: Color(0xFF003F06),
-    1000: Color(0xFF002703),
   });
 
-  static const mint = XzColorSwatch({
-    100: Color(0xFFE0F5EB),
-    200: Color(0xFFAAE4C9),
-    300: Color(0xFF65D4A8),
-    400: Color(0xFF00BF8B),
-    500: Color(0xFF00AE7E),
-    600: Color(0xFF009C6D),
-    700: Color(0xFF006F43),
-    800: Color(0xFF005630),
-    900: Color(0xFF003E21),
-    1000: Color(0xFF002614),
-  });
+  static const green = XzColorSwatch({
 
-  static const amber = XzColorSwatch({
-    100: Color(0xFFF5EEDC),
-    200: Color(0xFFE7D3A1),
-    300: Color(0xFFDBB758),
-    400: Color(0xFFCA9B00),
-    500: Color(0xFFBA8B00),
-    600: Color(0xFFFFB504),
-    700: Color(0xFF844E00),
-    800: Color(0xFF673B00),
-    900: Color(0xFF4A2A00),
-    1000: Color(0xFF2D1A00),
   });
 
   static const red = XzColorSwatch({
-    100: Color(0xFFFFE9E5),
-    200: Color(0xFFFFC4BA),
-    300: Color(0xFFFF9D8C),
-    400: Color(0xFFFF6E5A),
-    500: Color(0xFFFF4733),
-    600: Color(0xFFF02816),
-    700: Color(0xFFAE0D00),
-    800: Color(0xFF880700),
-    900: Color(0xFF640400),
-    1000: Color(0xFF410200),
+
   });
 
   static const orange = XzColorSwatch({
-    100: Color(0xFFFAECDD),
-    200: Color(0xFFF3CDA4),
-    300: Color(0xFFEFAB61),
-    400: Color(0xFFE58900),
-    500: Color(0xFFD57900),
-    600: Color(0xFFFFB504),
-    700: Color(0xFF914300),
-    800: Color(0xFF742F00),
-    900: Color(0xFF552100),
-    1000: Color(0xFF341500),
+
   });
 
   static const purple = XzColorSwatch({
-    100: Color(0xFFF1EBFE),
-    200: Color(0xFFDBCBFC),
-    300: Color(0xFFC6A9FE),
-    400: Color(0xFFAF88FF),
-    500: Color(0xFFA171FF),
-    600: Color(0xFF9059FF),
-    700: Color(0xFF673ABA),
-    800: Color(0xFF502A91),
-    900: Color(0xFF3A1D6B),
-    1000: Color(0xFF231045),
+
   });
 
   static const cyan = XzColorSwatch({
-    100: Color(0xFFDEF3FC),
-    200: Color(0xFF9FE2EE),
-    300: Color(0xFF42D0E6),
-    400: Color(0xFF00B7CD),
-    500: Color(0xFF00A6BA),
-    600: Color(0xFF0094AA),
-    700: Color(0xFF00677E),
-    800: Color(0xFF004F63),
-    900: Color(0xFF003948),
-    1000: Color(0xFF00232C),
+
   });
 
 }
@@ -255,7 +170,7 @@ class XzColors {
     text: XzBaseScale({
       100: Color(0xFF18181B),
       200: Color(0xB318181B),
-      300: Color(0x8018181B),
+      300: Color(0x9918181B),
     }),
     line: XzBaseScale({
       100: Color(0xF2E9EDF4),
@@ -264,107 +179,87 @@ class XzColors {
     }),
     primary: XzRoleColor(
       soft: {
-        100: Color(0x1A2F7CFF),
-        200: Color(0x292F7CFF),
+        100: Color(0x1A0669FF),
+        200: Color(0x290669FF),
       },
-      line: {
-        100: Color(0xFFC6DBFF),
-        200: Color(0xFF97BEFF),
-        300: Color(0xFF7AABFF),
+      softSolid: {
+        100: Color(0xFFE0ECFE),
+        200: Color(0xFFD3E4FF),
       },
       bg: {
-        100: Color(0xFF2F7CFF),
-        200: Color(0xFF176FFF),
+        100: Color(0xFF0669FF),
+        200: Color(0xFF0061EF),
       },
       fg: {
-        100: Color(0xF2FFFFFF),
-      },
-      text: {
-        100: Color(0xFF2F7CFF),
+        100: Color(0xFFFFFFFF),
       },
     ),
     danger: XzRoleColor(
       soft: {
-        100: Color(0x1AF02816),
-        200: Color(0x29F02816),
+        100: Color(0x1AE32A20),
+        200: Color(0x29E32A20),
       },
-      line: {
-        100: Color(0xFFFDCDC6),
-        200: Color(0xFFFEA092),
-        300: Color(0xFFFC8372),
+      softSolid: {
+        100: Color(0xFFF8E7E7),
+        200: Color(0xFFF9DCDA),
       },
       bg: {
-        100: Color(0xFFF02816),
-        200: Color(0xFFE51401),
+        100: Color(0xFFE32A20),
+        200: Color(0xFFD81912),
       },
       fg: {
-        100: Color(0xF2FFFFFF),
-      },
-      text: {
-        100: Color(0xFFF02816),
+        100: Color(0xFFFFFFFF),
       },
     ),
     success: XzRoleColor(
       soft: {
-        100: Color(0x1A00A01F),
-        200: Color(0x2900A01F),
+        100: Color(0x1A15C02D),
+        200: Color(0x2915C02D),
       },
-      line: {
-        100: Color(0xFFC2E5C5),
-        200: Color(0xFF8CD08E),
-        300: Color(0xFF69C46C),
+      softSolid: {
+        100: Color(0xFFE5F4E9),
+        200: Color(0xFFDAF1DE),
       },
       bg: {
-        100: Color(0xFF00A01F),
-        200: Color(0xFF00961C),
+        100: Color(0xFF15C02D),
+        200: Color(0xFF00B625),
       },
       fg: {
-        100: Color(0xF2FFFFFF),
-      },
-      text: {
-        100: Color(0xFF00A01F),
+        100: Color(0xF2000000),
       },
     ),
     warning: XzRoleColor(
       soft: {
-        100: Color(0x1AFFB504),
-        200: Color(0x29FFB504),
+        100: Color(0x1AFFB508),
+        200: Color(0x29FFB508),
       },
-      line: {
-        100: Color(0xFFFAE9CF),
-        200: Color(0xFFFCD9A0),
-        300: Color(0xFFFECE81),
+      softSolid: {
+        100: Color(0xFFF7F3EA),
+        200: Color(0xFFF8EFDF),
       },
       bg: {
-        100: Color(0xFFFFB504),
+        100: Color(0xFFFFB508),
         200: Color(0xFFF3AC00),
       },
       fg: {
-        100: Color(0xF2FFFFFF),
-      },
-      text: {
-        100: Color(0xFFFFB504),
+        100: Color(0xF2000000),
       },
     ),
     info: XzRoleColor(
       soft: {
-        100: Color(0x1A0094AA),
-        200: Color(0x290094AA),
+        100: Color(0x1A00CAE7),
+        200: Color(0x2900CAE7),
       },
-      line: {
-        100: Color(0xFFADE5F4),
-        200: Color(0xFF4CD0EA),
-        300: Color(0xFF00C0DC),
+      softSolid: {
+        100: Color(0xFFE6F5FA),
+        200: Color(0xFFDCF2F9),
       },
       bg: {
-        100: Color(0xFF0094AA),
-        200: Color(0xFF008A9F),
+        100: Color(0xFF00CAE7),
+        200: Color(0xFF00C0DB),
       },
       fg: {
-        100: Color(0xF2FFFFFF),
-      },
-      text: {
-        100: Color(0xFF0094AA),
+        100: Color(0xF2000000),
       },
     ),
     neutral: XzRoleColor(
@@ -372,10 +267,9 @@ class XzColors {
         100: Color(0x1A798598),
         200: Color(0x29798598),
       },
-      line: {
-        100: Color(0xFFD6DAE2),
-        200: Color(0xFFB6BDC9),
-        300: Color(0xFFA3ACBA),
+      softSolid: {
+        100: Color(0xFFE9EDF2),
+        200: Color(0xFFE1E6EB),
       },
       bg: {
         100: Color(0xFF798598),
@@ -384,9 +278,6 @@ class XzColors {
       fg: {
         100: Color(0xFFFFFFFF),
       },
-      text: {
-        100: Color(0xFF798598),
-      },
     ),
   );
 
@@ -412,8 +303,8 @@ class XzColors {
     }),
     text: XzBaseScale({
       100: Color(0xFFEEF2F9),
-      200: Color(0x99EEF2F9),
-      300: Color(0x80EEF2F9),
+      200: Color(0xA6EEF2F9),
+      300: Color(0x8CEEF2F9),
     }),
     line: XzBaseScale({
       100: Color(0xF23E424D),
@@ -422,107 +313,87 @@ class XzColors {
     }),
     primary: XzRoleColor(
       soft: {
-        100: Color(0x1A2F7CFF),
-        200: Color(0x292F7CFF),
+        100: Color(0x1A0669FF),
+        200: Color(0x290669FF),
       },
-      line: {
-        100: Color(0xFF2C4169),
-        200: Color(0xFF2C549C),
-        300: Color(0xFF2B5FBD),
+      softSolid: {
+        100: Color(0xFF2A354A),
+        200: Color(0xFF2A3955),
       },
       bg: {
-        100: Color(0xFF2F7CFF),
-        200: Color(0xFF4F8FFF),
+        100: Color(0xFF0669FF),
+        200: Color(0xFF347EFF),
       },
       fg: {
-        100: Color(0xF2FFFFFF),
-      },
-      text: {
-        100: Color(0xFF85B2FF),
+        100: Color(0xFFFFFFFF),
       },
     ),
     danger: XzRoleColor(
       soft: {
-        100: Color(0x1AF02816),
-        200: Color(0x29F02816),
+        100: Color(0x1AE32A20),
+        200: Color(0x29E32A20),
       },
-      line: {
-        100: Color(0xFF5A3638),
-        200: Color(0xFF8B3A35),
-        300: Color(0xFFA83931),
+      softSolid: {
+        100: Color(0xFF3D3238),
+        200: Color(0xFF483439),
       },
       bg: {
-        100: Color(0xFFF02816),
-        200: Color(0xFFFF4632),
+        100: Color(0xFFE32A20),
+        200: Color(0xFFF64032),
       },
       fg: {
-        100: Color(0xF2FFFFFF),
-      },
-      text: {
-        100: Color(0xFFFF8D7B),
+        100: Color(0xFFFFFFFF),
       },
     ),
     success: XzRoleColor(
       soft: {
-        100: Color(0x1A00A01F),
-        200: Color(0x2900A01F),
+        100: Color(0x1A15C02D),
+        200: Color(0x2915C02D),
       },
-      line: {
-        100: Color(0xFF294A37),
-        200: Color(0xFF1F6731),
-        300: Color(0xFF0E7929),
+      softSolid: {
+        100: Color(0xFF2D3C3B),
+        200: Color(0xFF2F443C),
       },
       bg: {
-        100: Color(0xFF00A01F),
-        200: Color(0xFF00B224),
+        100: Color(0xFF15C02D),
+        200: Color(0xFF35D141),
       },
       fg: {
-        100: Color(0xF2FFFFFF),
-      },
-      text: {
-        100: Color(0xFF2CD53D),
+        100: Color(0xF2000000),
       },
     ),
     warning: XzRoleColor(
       soft: {
-        100: Color(0x1AFFB504),
-        200: Color(0x29FFB504),
+        100: Color(0x1AFFB508),
+        200: Color(0x29FFB508),
       },
-      line: {
-        100: Color(0xFF594E3F),
-        200: Color(0xFF8D6F3F),
-        300: Color(0xFFAE843B),
+      softSolid: {
+        100: Color(0xFF3D3B3B),
+        200: Color(0xFF48423D),
       },
       bg: {
-        100: Color(0xFFFFB504),
+        100: Color(0xFFFFB508),
         200: Color(0xFFFFCC76),
       },
       fg: {
-        100: Color(0xF2FFFFFF),
-      },
-      text: {
-        100: Color(0xFFFFF4E4),
+        100: Color(0xF2000000),
       },
     ),
     info: XzRoleColor(
       soft: {
-        100: Color(0x1A0094AA),
-        200: Color(0x290094AA),
+        100: Color(0x1A00CAE7),
+        200: Color(0x2900CAE7),
       },
-      line: {
-        100: Color(0xFF07495C),
-        200: Color(0xFF006274),
-        300: Color(0xFF007184),
+      softSolid: {
+        100: Color(0xFF2E3C47),
+        200: Color(0xFF304451),
       },
       bg: {
-        100: Color(0xFF0094AA),
-        200: Color(0xFF00A5BD),
+        100: Color(0xFF00CAE7),
+        200: Color(0xFF31DBF8),
       },
       fg: {
-        100: Color(0xF2FFFFFF),
-      },
-      text: {
-        100: Color(0xFF00C7E4),
+        100: Color(0xF2000000),
       },
     ),
     neutral: XzRoleColor(
@@ -530,10 +401,9 @@ class XzColors {
         100: Color(0x1A798598),
         200: Color(0x29798598),
       },
-      line: {
-        100: Color(0xFF3C424E),
-        200: Color(0xFF505766),
-        300: Color(0xFF5C6575),
+      softSolid: {
+        100: Color(0xFF313641),
+        200: Color(0xFF363B46),
       },
       bg: {
         100: Color(0xFF798598),
@@ -542,9 +412,6 @@ class XzColors {
       fg: {
         100: Color(0xFFFFFFFF),
       },
-      text: {
-        100: Color(0xFFA6B3C7),
-      },
     ),
   );