npm - @tmorrow/cre8-wc - Versions diffs - 2.3.6 → 2.3.10 - Mend

@tmorrow/cre8-wc 2.3.6 → 2.3.10

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.

Files changed (260) hide show

package/lib/design-tokens/brands/cre8-a2ui/css/tokens_cre8-a2ui.module.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"tokens_cre8-a2ui.module.d.ts","sourceRoot":"","sources":["../../../../../design-tokens/brands/cre8-a2ui/css/tokens_cre8-a2ui.module.ts"],"names":[],"mappings":"AAAA,QAAA,MAAM,IAAI,~~264HAk1DT~~,CAAC;AAEF,eAAe,IAAI,CAAC"}
1	+ {"version":3,"file":"tokens_cre8-a2ui.module.d.ts","sourceRoot":"","sources":["../../../../../design-tokens/brands/cre8-a2ui/css/tokens_cre8-a2ui.module.ts"],"names":[],"mappings":"AAAA,QAAA,MAAM,IAAI,6t8HA82DT,CAAC;AAEF,eAAe,IAAI,CAAC"}

package/lib/design-tokens/brands/cre8-a2ui/css/tokens_cre8-a2ui.module.js CHANGED Viewed

@@ -863,8 +863,16 @@ const a2ui = `
   --cre8-warning-500: var(--cre8-seed-warning);
   --cre8-warning-600: oklch(from var(--cre8-seed-warning) 0.6658 calc(c * 0.956) calc(h - 11.76));
-  /* accent */
+  /* accent
+     -50 and -500 added by hand (not from the original generator, which never
+     emitted them) to give info-status tokens a real ramp to point at instead
+     of borrowing primary's. Simple relative lightness offsets from the -600
+     identity step, not the per-hue-tuned coefficients the rest of this ramp
+     uses -- close enough for a light tint and a mid-strength fill, not a
+     claim of the same precision. */
+  --cre8-accent-50: oklch(from var(--cre8-seed-accent) 0.96 calc(c * 0.15) h);
   --cre8-accent-200: oklch(from var(--cre8-seed-accent) 0.9024 calc(c * 0.245) calc(h + 13.69));
+  --cre8-accent-500: oklch(from var(--cre8-seed-accent) calc(l + 0.08) c h);
   --cre8-accent-600: var(--cre8-seed-accent);
   /* Overlays — neutral-900 at fixed alpha */
@@ -893,6 +901,22 @@ const a2ui = `
   --cre8-spacing-120: calc(var(--cre8-seed-space) * 30);
   --cre8-spacing-160: calc(var(--cre8-seed-space) * 40);
+  /* Padding — a deliberately narrow slice of the spacing scale.
+     The full scale above spans a 0.5x-40x range (80x), which is right for
+     layout gaps and section margins but wrong for component padding: reseed
+     --cre8-seed-space for a chunkier padding feel and the *layout* end of
+     that same scale swings by tens of pixels for a change meant to nudge
+     button/card padding by a couple of pixels. Padding gets its own 0.5x-6x
+     range (12x) instead -- aliases of the existing tight-end steps, not new
+     math -- so retheming padding doesn't also retheme page layout. Component
+     padding should reference these, never --cre8-spacing-* directly; gap and
+     margin (genuine layout) can still reach the full scale above. */
+  --cre8-padding-2: var(--cre8-spacing-2);
+  --cre8-padding-4: var(--cre8-spacing-4);
+  --cre8-padding-8: var(--cre8-spacing-8);
+  --cre8-padding-16: var(--cre8-spacing-16);
+  --cre8-padding-24: var(--cre8-spacing-24);
   /* Font size — multiples of the font-size seed */
   --cre8-font-size-0: calc(var(--cre8-seed-font-size) * 0.75);
   --cre8-font-size-1: calc(var(--cre8-seed-font-size) * 0.875);
@@ -918,6 +942,10 @@ const a2ui = `
   --cre8-radius-tabs: calc(var(--cre8-seed-radius) * 0.5);
   --cre8-radius-large: var(--cre8-seed-radius);
   --cre8-radius-container: var(--cre8-seed-radius);
+  /* Rounder than a card by convention, but proportional to the seed --
+     not forced to a pill. A near-zero seed radius should produce a nearly
+     square button, not a full pill regardless of that value. */
+  --cre8-radius-button: calc(var(--cre8-seed-radius) * 2);
   --cre8-radius-pill: calc(var(--cre8-seed-radius) * 37.5);
   /* Border width — multiples of the border-width seed */
@@ -1015,9 +1043,9 @@ const a2ui = `
   --cre8-color-bg-warning: var(--cre8-bg-warning);
   --cre8-bg-warning-strong: var(--cre8-warning-500);
   --cre8-color-bg-warning-strong: var(--cre8-bg-warning-strong);
-  --cre8-bg-info: var(--cre8-primary-50);
+  --cre8-bg-info: var(--cre8-accent-50);
   --cre8-color-bg-info: var(--cre8-bg-info);
-  --cre8-bg-info-strong: var(--cre8-primary-500);
+  --cre8-bg-info-strong: var(--cre8-accent-500);
   --cre8-color-bg-info-strong: var(--cre8-bg-info-strong);
   --cre8-bg-attention: var(--cre8-neutral-0);
   --cre8-color-bg-attention: var(--cre8-bg-attention);
@@ -1055,7 +1083,7 @@ const a2ui = `
   --cre8-color-content-error-icon: var(--cre8-content-error-icon);
   --cre8-content-warning-icon: var(--cre8-warning-600);
   --cre8-color-content-warning-icon: var(--cre8-content-warning-icon);
-  --cre8-content-info-icon: var(--cre8-primary-500);
+  --cre8-content-info-icon: var(--cre8-accent-500);
   --cre8-color-content-info-icon: var(--cre8-content-info-icon);
   --cre8-content-attention-icon: var(--cre8-primary-400);
   --cre8-color-content-attention-icon: var(--cre8-content-attention-icon);
@@ -1103,7 +1131,7 @@ const a2ui = `
   --cre8-color-border-error: var(--cre8-border-error);
   --cre8-border-warning: var(--cre8-warning-400);
   --cre8-color-border-warning: var(--cre8-border-warning);
-  --cre8-border-info: var(--cre8-primary-500);
+  --cre8-border-info: var(--cre8-accent-500);
   --cre8-color-border-info: var(--cre8-border-info);
   --cre8-border-attention: var(--cre8-primary-400);
   --cre8-color-border-attention: var(--cre8-border-attention);
@@ -1767,7 +1795,7 @@ const a2ui = `
   --cre8-line-heights-18: 0.16;
   --cre8-border-radius-default: var(--cre8-radius-field);
   --cre8-border-radius-round: var(--cre8-radius-pill);
-  --cre8-border-radius-button: var(--cre8-radius-pill);
+  --cre8-border-radius-button: var(--cre8-radius-button);
   --cre8-border-radius-badge: var(--cre8-radius-pill);
   --cre8-border-radius-brand: var(--cre8-radius-pill);
   --cre8-border-radius-none: var(--cre8-radius-none);