@juwel-development/design-system 3.3.0 → 3.5.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.
Files changed (40) hide show
  1. package/README.md +20 -0
  2. package/dist/design-system.js +237 -126
  3. package/dist/index.css +1 -1
  4. package/dist/types/Display/Meter/Meter.d.ts +59 -0
  5. package/dist/types/Display/Meter/MeterConfigurationError.d.ts +3 -0
  6. package/dist/types/Display/Typography/Eyebrow/Eyebrow.d.ts +5 -2
  7. package/dist/types/Display/Typography/H1/H1.d.ts +5 -2
  8. package/dist/types/Display/Typography/H2/H2.d.ts +5 -2
  9. package/dist/types/Display/Typography/H3/H3.d.ts +5 -2
  10. package/dist/types/Display/Typography/H4/H4.d.ts +5 -2
  11. package/dist/types/Display/Typography/H5/H5.d.ts +5 -2
  12. package/dist/types/Display/Typography/H6/H6.d.ts +5 -2
  13. package/dist/types/Display/Typography/Note/Note.d.ts +5 -2
  14. package/dist/types/Display/Typography/P/P.d.ts +5 -2
  15. package/dist/types/Display/Typography/Prose/Prose.d.ts +6 -3
  16. package/dist/types/Interaction/Slider/Slider.d.ts +41 -0
  17. package/dist/types/Interaction/Slider/SliderConfigurationError.d.ts +3 -0
  18. package/dist/types/Theme/Palette.d.ts +22 -2
  19. package/dist/types/index.d.ts +2 -0
  20. package/package.json +1 -1
  21. package/src/Display/Meter/Meter.tsx +136 -0
  22. package/src/Display/Meter/MeterConfigurationError.ts +6 -0
  23. package/src/Display/Typography/Eyebrow/Eyebrow.tsx +12 -2
  24. package/src/Display/Typography/H1/H1.tsx +12 -2
  25. package/src/Display/Typography/H2/H2.tsx +12 -2
  26. package/src/Display/Typography/H3/H3.tsx +12 -2
  27. package/src/Display/Typography/H4/H4.tsx +12 -2
  28. package/src/Display/Typography/H5/H5.tsx +12 -2
  29. package/src/Display/Typography/H6/H6.tsx +12 -2
  30. package/src/Display/Typography/Note/Note.tsx +12 -2
  31. package/src/Display/Typography/P/P.tsx +12 -2
  32. package/src/Display/Typography/Prose/Prose.tsx +13 -3
  33. package/src/Interaction/Slider/Slider.tsx +125 -0
  34. package/src/Interaction/Slider/SliderConfigurationError.ts +6 -0
  35. package/src/Theme/Palette.ts +32 -5
  36. package/src/Theme/renderTokens.ts +23 -0
  37. package/src/index.ts +2 -0
  38. package/src/tokens.css +19 -3
  39. package/src/tokens.dark.css +14 -0
  40. package/src/tokens.light.css +17 -3
package/README.md CHANGED
@@ -74,6 +74,26 @@ on an ancestor re-points every token underneath it.
74
74
  A product re-themes the whole system by supplying its own values for the same role
75
75
  names, which is what lets one design system serve several brands.
76
76
 
77
+ ### Typography status tones
78
+
79
+ Typography whose colour is selectable accepts the general `success`, `warning`, `error`, and
80
+ `info` status tones alongside `foreground` and `muted`. This includes `H1`–`H6`, `Eyebrow`, `P`,
81
+ `Note`, and `Prose.Body`; fixed-colour members such as `Prose.Lede` and `Prose.Tail` remain fixed.
82
+
83
+ ```tsx
84
+ <P color={'warning'}>Warning: patience is low and the offer gap is wide.</P>
85
+ ```
86
+
87
+ A status tone reinforces status that the content already communicates: never use colour as the
88
+ only cue. Selecting one changes only the semantic text colour and does not add an ARIA role, live
89
+ region, icon, or wording. The caller remains responsible for announcement behavior when a changing
90
+ status needs it.
91
+
92
+ All four palette roles must remain at least 4.5:1 against `surface` in every theme because they can
93
+ paint normal-size and small text. They remain general roles rather than typography-only tokens, so
94
+ constraints from other carriers also apply; `error`, for example, remains Meter's depletion
95
+ endpoint and must keep that complete path at least 3:1 against `meterTrack`.
96
+
77
97
  ### Single-theme builds
78
98
 
79
99
  `styles.css` and `tokens.css` carry both colour sets, so a product that ships only one