@pantheon-systems/pds-toolkit-react 2.0.0-alpha.33 → 2.0.0-alpha.35

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 (64) hide show
  1. package/bin/pds-codemod.cjs +58 -0
  2. package/codemods/v1-to-v2/mappings.json +1258 -0
  3. package/codemods/v1-to-v2/transforms/__testfixtures__/prop-value-standardization/basic.input.tsx +36 -0
  4. package/codemods/v1-to-v2/transforms/__testfixtures__/prop-value-standardization/basic.output.tsx +36 -0
  5. package/codemods/v1-to-v2/transforms/__tests__/prop-value-standardization.test.js +6 -0
  6. package/codemods/v1-to-v2/transforms/prop-value-standardization.js +112 -0
  7. package/dist/components/Table/Table.d.ts +107 -1
  8. package/dist/components/Tag/Tag.d.ts +5 -2
  9. package/dist/components/badges/Badge/Badge.d.ts +1 -1
  10. package/dist/components/buttons/ButtonLink/ButtonLink.d.ts +1 -1
  11. package/dist/components/buttons/ClipboardButton/ClipboardButton.d.ts +5 -1
  12. package/dist/components/buttons/MenuButton/MenuButton.d.ts +1 -1
  13. package/dist/components/buttons/SegmentedButton/SegmentedButton.d.ts +6 -5
  14. package/dist/components/icons/Icon/generated-icon-data.d.ts +16 -2
  15. package/dist/css/component-css/pds-badge.css +1 -1
  16. package/dist/css/component-css/pds-button-nav.css +1 -1
  17. package/dist/css/component-css/pds-button.css +37 -13
  18. package/dist/css/component-css/pds-close-button.css +1 -1
  19. package/dist/css/component-css/pds-datepicker.css +1 -1
  20. package/dist/css/component-css/pds-drawer.css +1 -1
  21. package/dist/css/component-css/pds-dropdown-menu.css +1 -1
  22. package/dist/css/component-css/pds-icon-button.css +3 -1
  23. package/dist/css/component-css/pds-index.css +61 -29
  24. package/dist/css/component-css/pds-menu-button.css +1 -1
  25. package/dist/css/component-css/pds-nav-menu.css +1 -1
  26. package/dist/css/component-css/pds-navbar.css +1 -1
  27. package/dist/css/component-css/pds-pagination-mini.css +1 -1
  28. package/dist/css/component-css/pds-panel-list.css +1 -1
  29. package/dist/css/component-css/pds-panel.css +1 -1
  30. package/dist/css/component-css/pds-section-message.css +1 -1
  31. package/dist/css/component-css/pds-segmented-button.css +1 -1
  32. package/dist/css/component-css/pds-side-nav-global.css +1 -1
  33. package/dist/css/component-css/pds-side-nav.css +1 -1
  34. package/dist/css/component-css/pds-site-footer.css +1 -1
  35. package/dist/css/component-css/pds-sortable-list.css +1 -1
  36. package/dist/css/component-css/pds-status-checker.css +1 -1
  37. package/dist/css/component-css/pds-stepper.css +3 -1
  38. package/dist/css/component-css/pds-table-of-contents.css +1 -1
  39. package/dist/css/component-css/pds-table.css +3 -1
  40. package/dist/css/component-css/pds-tag.css +1 -1
  41. package/dist/css/component-css/pds-tally.css +1 -1
  42. package/dist/css/component-css/pds-theme-switcher.css +1 -1
  43. package/dist/css/component-css/pds-toaster.css +1 -1
  44. package/dist/css/component-css/pds-tree-nav.css +1 -1
  45. package/dist/css/component-css/pds-user-menu.css +2 -2
  46. package/dist/css/component-css/pds-utility-button.css +3 -1
  47. package/dist/css/component-css/pds-workspace-selector.css +1 -1
  48. package/dist/css/design-tokens/variables.dark.css +189 -203
  49. package/dist/css/design-tokens/variables.global.css +0 -3
  50. package/dist/css/design-tokens/variables.light.css +174 -188
  51. package/dist/css/layout-css/pds-app-layout.css +1 -1
  52. package/dist/css/layout-css/pds-index.css +1 -1
  53. package/dist/css/pds-components.css +61 -29
  54. package/dist/css/pds-core.css +2 -2
  55. package/dist/css/pds-layouts.css +1 -1
  56. package/dist/index.css +1 -1
  57. package/dist/index.js +10522 -14167
  58. package/dist/index.js.map +1 -1
  59. package/dist/libs/types/custom-types.d.ts +2 -2
  60. package/dist/libs/types/layout-types.d.ts +1 -1
  61. package/dist/svg/anglesDown.svg +3 -0
  62. package/dist/svg/anglesUp.svg +3 -0
  63. package/dist/utilities/FlexContainer/FlexContainer.d.ts +2 -1
  64. package/package.json +19 -4
package/dist/css/design-tokens/variables.light.css CHANGED
@@ -1,102 +1,77 @@
1
1
  :root, [data-theme="light"] {
2
- --pds-color-badge-apollo-background: oklch(0.8975 0.1774 96.79);
3
- --pds-color-badge-apollo-foreground: oklch(0.2046 0 0);
4
- --pds-color-badge-apollo-secondary-background: oklch(0.9598 0.0751 97.78);
5
- --pds-color-badge-apollo-secondary-foreground: oklch(0.2842 0.0752 49.97);
6
- --pds-color-badge-iris-background: oklch(0.5558 0.2372 267.79);
7
- --pds-color-badge-iris-foreground: oklch(1.0000 0 0);
8
- --pds-color-badge-iris-secondary-background: oklch(0.9401 0.0349 232.04);
9
- --pds-color-badge-iris-secondary-foreground: oklch(0.3462 0.2268 270.06);
10
- --pds-color-badge-hypnos-background: oklch(0.542 0.2895 299.91);
11
- --pds-color-badge-hypnos-foreground: oklch(1.0000 0 0);
12
- --pds-color-badge-hypnos-secondary-background: oklch(0.9404 0.0521 325.00);
13
- --pds-color-badge-hypnos-secondary-foreground: oklch(0.3933 0.2209 291.24);
14
- --pds-color-badge-gaia-background: oklch(0.8853 0 0);
15
- --pds-color-badge-gaia-foreground: oklch(0.2046 0 0);
16
- --pds-color-badge-gaia-secondary-background: oklch(0.9606 0.0164 79.35);
17
- --pds-color-badge-gaia-secondary-foreground: oklch(0.2812 0.0674 57.94);
18
- --pds-color-badge-aether-background: oklch(0.2046 0 0);
19
- --pds-color-badge-aether-foreground: oklch(1.0000 0 0);
20
- --pds-color-badge-aether-secondary-background: oklch(0.9595 0.0167 230.90);
21
- --pds-color-badge-aether-secondary-foreground: oklch(0.2930 0.0705 242.77);
22
- --pds-color-badge-success-background: oklch(0.5118 0.1311 147.75);
2
+ --pds-color-badge-brand-background: oklch(0.8622 0.1681 88.31);
3
+ --pds-color-badge-brand-foreground: oklch(0.2178 0 0);
4
+ --pds-color-badge-brand-muted-background: oklch(0.9577 0.0624 93.43);
5
+ --pds-color-badge-brand-muted-foreground: oklch(0.3894 0.0774 72.04);
6
+ --pds-color-badge-success-background: oklch(0.4733 0.1035 134.24);
23
7
  --pds-color-badge-success-foreground: oklch(1.0000 0 0);
24
- --pds-color-badge-success-secondary-background: oklch(0.9606 0.0559 147.50);
25
- --pds-color-badge-success-secondary-foreground: oklch(0.2986 0.1016 142.50);
26
- --pds-color-badge-warning-background: oklch(0.8008 0.1637 90.52);
27
- --pds-color-badge-warning-foreground: oklch(0.2046 0 0);
28
- --pds-color-badge-warning-secondary-background: oklch(0.9465 0.0444 75.99);
29
- --pds-color-badge-warning-secondary-foreground: oklch(0.2868 0.1177 29.23);
30
- --pds-color-badge-critical-background: oklch(0.5856 0.2126 29.44);
8
+ --pds-color-badge-success-muted-background: oklch(0.9301 0.0402 124.12);
9
+ --pds-color-badge-success-muted-foreground: oklch(0.3746 0.0812 134.16);
10
+ --pds-color-badge-warning-background: oklch(0.5658 0.1338 53.43);
11
+ --pds-color-badge-warning-foreground: oklch(1.0000 0 0);
12
+ --pds-color-badge-warning-muted-background: oklch(0.9208 0.0469 69.27);
13
+ --pds-color-badge-warning-muted-foreground: oklch(0.3111 0.0678 55.70);
14
+ --pds-color-badge-critical-background: oklch(0.4501 0.1581 26.35);
31
15
  --pds-color-badge-critical-foreground: oklch(1.0000 0 0);
32
- --pds-color-badge-critical-secondary-background: oklch(0.9248 0.0402 41.03);
33
- --pds-color-badge-critical-secondary-foreground: oklch(0.3488 0.1431 29.23);
34
- --pds-color-badge-info-background: oklch(0.5476 0.1867 255.95);
16
+ --pds-color-badge-critical-muted-background: oklch(0.8859 0.0414 19.05);
17
+ --pds-color-badge-critical-muted-foreground: oklch(0.2550 0.0814 25.05);
18
+ --pds-color-badge-info-background: oklch(0.4662 0.0924 245.48);
35
19
  --pds-color-badge-info-foreground: oklch(1.0000 0 0);
36
- --pds-color-badge-info-secondary-background: oklch(0.9469 0.0406 215.88);
37
- --pds-color-badge-info-secondary-foreground: oklch(0.2923 0.2026 264.05);
38
- --pds-color-badge-discovery-background: oklch(0.4401 0.1973 306.55);
20
+ --pds-color-badge-info-muted-background: oklch(0.9123 0.0286 231.46);
21
+ --pds-color-badge-info-muted-foreground: oklch(0.2906 0.0644 249.78);
22
+ --pds-color-badge-discovery-background: oklch(0.4277 0.1065 303.89);
39
23
  --pds-color-badge-discovery-foreground: oklch(1.0000 0 0);
40
- --pds-color-badge-discovery-secondary-background: oklch(0.9487 0.0459 325.93);
41
- --pds-color-badge-discovery-secondary-foreground: oklch(0.3272 0.1732 301.51);
42
- --pds-color-badge-amber-background: oklch(0.5748 0.1493 51.28);
43
- --pds-color-badge-amber-foreground: oklch(1.0000 0 0);
44
- --pds-color-badge-amber-secondary-background: oklch(0.9408 0.0522 78.34);
45
- --pds-color-badge-amber-secondary-foreground: oklch(0.3116 0.1279 29.23);
46
- --pds-color-badge-orange-background: oklch(0.5822 0.1890 38.39);
24
+ --pds-color-badge-discovery-muted-background: oklch(0.9077 0.0264 310.39);
25
+ --pds-color-badge-discovery-muted-foreground: oklch(0.2671 0.0855 295.38);
26
+ --pds-color-badge-rose-background: oklch(0.5479 0.1847 1.24);
27
+ --pds-color-badge-rose-foreground: oklch(1.0000 0 0);
28
+ --pds-color-badge-rose-muted-background: oklch(0.9106 0.0331 351.20);
29
+ --pds-color-badge-rose-muted-foreground: oklch(0.3361 0.1343 13.26);
30
+ --pds-color-badge-orange-background: oklch(0.5874 0.1832 40.31);
47
31
  --pds-color-badge-orange-foreground: oklch(1.0000 0 0);
48
- --pds-color-badge-orange-secondary-background: oklch(0.9266 0.0452 57.50);
49
- --pds-color-badge-orange-secondary-foreground: oklch(0.3445 0.1414 29.23);
32
+ --pds-color-badge-orange-muted-background: oklch(0.9175 0.0328 49.33);
33
+ --pds-color-badge-orange-muted-foreground: oklch(0.3445 0.1414 29.23);
50
34
  --pds-color-badge-lime-background: oklch(0.5540 0.1620 135.05);
51
35
  --pds-color-badge-lime-foreground: oklch(1.0000 0 0);
52
- --pds-color-badge-lime-secondary-background: oklch(0.9603 0.0793 132.38);
53
- --pds-color-badge-lime-secondary-foreground: oklch(0.2918 0.0993 142.50);
54
- --pds-color-badge-teal-background: oklch(0.5203 0.0927 183.02);
55
- --pds-color-badge-teal-foreground: oklch(1.0000 0 0);
56
- --pds-color-badge-teal-secondary-background: oklch(0.9599 0.0392 182.77);
57
- --pds-color-badge-teal-secondary-foreground: oklch(0.3045 0.0567 176.40);
36
+ --pds-color-badge-lime-muted-background: oklch(0.9185 0.0344 128.89);
37
+ --pds-color-badge-lime-muted-foreground: oklch(0.2918 0.0993 142.50);
58
38
  --pds-color-badge-sky-background: oklch(0.5571 0.1189 235.42);
59
39
  --pds-color-badge-sky-foreground: oklch(1.0000 0 0);
60
- --pds-color-badge-sky-secondary-background: oklch(0.9539 0.0448 206.80);
61
- --pds-color-badge-sky-secondary-foreground: oklch(0.3083 0.1049 255.90);
40
+ --pds-color-badge-sky-muted-background: oklch(0.9144 0.0264 224.25);
41
+ --pds-color-badge-sky-muted-foreground: oklch(0.3083 0.1049 255.90);
62
42
  --pds-color-badge-indigo-background: oklch(0.4574 0.1942 275.52);
63
43
  --pds-color-badge-indigo-foreground: oklch(1.0000 0 0);
64
- --pds-color-badge-indigo-secondary-background: oklch(0.9452 0.0263 257.03);
65
- --pds-color-badge-indigo-secondary-foreground: oklch(0.3152 0.1990 274.45);
66
- --pds-color-badge-rose-background: oklch(0.5479 0.1847 1.24);
67
- --pds-color-badge-rose-foreground: oklch(1.0000 0 0);
68
- --pds-color-badge-rose-secondary-background: oklch(0.9305 0.0434 346.32);
69
- --pds-color-badge-rose-secondary-foreground: oklch(0.3361 0.1343 13.26);
70
- --pds-color-badge-slate-background: oklch(0.5169 0.0320 248.45);
71
- --pds-color-badge-slate-foreground: oklch(1.0000 0 0);
72
- --pds-color-badge-slate-secondary-background: oklch(0.9604 0.0137 247.97);
73
- --pds-color-badge-slate-secondary-foreground: oklch(0.2787 0.0367 249.26);
74
- --pds-color-badge-sand-background: oklch(0.5693 0.0766 76.35);
75
- --pds-color-badge-sand-foreground: oklch(1.0000 0 0);
76
- --pds-color-badge-sand-secondary-background: oklch(0.9607 0.0315 78.17);
77
- --pds-color-badge-sand-secondary-foreground: oklch(0.2816 0.0657 60.48);
78
- --pds-color-badge-mint-background: oklch(0.5463 0.1062 171.76);
79
- --pds-color-badge-mint-foreground: oklch(1.0000 0 0);
80
- --pds-color-badge-mint-secondary-background: oklch(0.9601 0.0479 173.52);
81
- --pds-color-badge-mint-secondary-foreground: oklch(0.3074 0.0697 159.89);
44
+ --pds-color-badge-indigo-muted-background: oklch(0.9364 0.0311 281.82);
45
+ --pds-color-badge-indigo-muted-foreground: oklch(0.3152 0.1990 274.45);
46
+ --pds-color-badge-ink-background: oklch(0.2178 0 0);
47
+ --pds-color-badge-ink-foreground: oklch(1.0000 0 0);
48
+ --pds-color-badge-ink-muted-background: oklch(0.8761 0 0);
49
+ --pds-color-badge-ink-muted-foreground: oklch(0.2178 0 0);
82
50
  --pds-color-badge-silver-background: oklch(0.8047 0 0);
83
- --pds-color-badge-silver-foreground: oklch(0.2046 0 0);
84
- --pds-color-badge-silver-secondary-background: oklch(0.9551 0 0);
85
- --pds-color-badge-silver-secondary-foreground: oklch(0.3211 0 0);
86
- --pds-color-badge-stone-background: oklch(0.5103 0 0);
51
+ --pds-color-badge-silver-foreground: oklch(0.2178 0 0);
52
+ --pds-color-badge-silver-muted-background: oklch(0.9430 0 0);
53
+ --pds-color-badge-silver-muted-foreground: oklch(0.3211 0 0);
54
+ --pds-color-badge-slate-background: oklch(0.4766 0.0328 237.46);
55
+ --pds-color-badge-slate-foreground: oklch(1.0000 0 0);
56
+ --pds-color-badge-slate-muted-background: oklch(0.9388 0.0118 239.91);
57
+ --pds-color-badge-slate-muted-foreground: oklch(0.3850 0.0290 240.04);
58
+ --pds-color-badge-stone-background: oklch(0.4876 0.0094 73.66);
87
59
  --pds-color-badge-stone-foreground: oklch(1.0000 0 0);
88
- --pds-color-badge-stone-secondary-background: oklch(0.8822 0 0);
89
- --pds-color-badge-stone-secondary-foreground: oklch(0.2850 0 0);
90
- --pds-color-badge-feature-foreground: oklch(1.0000 0 0);
91
- --pds-color-banner-info-background: oklch(0.5476 0.1867 255.95);
60
+ --pds-color-badge-stone-muted-background: oklch(0.9261 0.0144 84.58);
61
+ --pds-color-badge-stone-muted-foreground: oklch(0.4022 0.0071 84.59);
62
+ --pds-color-badge-gold-background: oklch(0.5693 0.0766 76.35);
63
+ --pds-color-badge-gold-foreground: oklch(1.0000 0 0);
64
+ --pds-color-badge-gold-muted-background: oklch(0.9281 0.0348 98.08);
65
+ --pds-color-badge-gold-muted-foreground: oklch(0.2816 0.0657 60.48);
66
+ --pds-color-banner-info-background: oklch(0.4662 0.0924 245.48);
92
67
  --pds-color-banner-info-foreground: oklch(1.0000 0 0);
93
- --pds-color-banner-warning-background: oklch(0.8008 0.1637 90.52);
94
- --pds-color-banner-warning-foreground: oklch(0.2178 0 0);
95
- --pds-color-banner-critical-background: oklch(0.5856 0.2126 29.44);
68
+ --pds-color-banner-warning-background: oklch(0.5658 0.1338 53.43);
69
+ --pds-color-banner-warning-foreground: oklch(1.0000 0 0);
70
+ --pds-color-banner-critical-background: oklch(0.4501 0.1581 26.35);
96
71
  --pds-color-banner-critical-foreground: oklch(1.0000 0 0);
97
- --pds-color-banner-discovery-background: oklch(0.5817 0.2576 306.75);
72
+ --pds-color-banner-discovery-background: oklch(0.4277 0.1065 303.89);
98
73
  --pds-color-banner-discovery-foreground: oklch(1.0000 0 0);
99
- --pds-color-banner-neutral-background: oklch(0.2046 0 0);
74
+ --pds-color-banner-neutral-background: oklch(0.2178 0 0);
100
75
  --pds-color-banner-neutral-foreground: oklch(1.0000 0 0);
101
76
  --pds-color-card-background: oklch(1.0000 0 0);
102
77
  --pds-color-code-block-dark-background: var(--pds-color-surface-reverse);
@@ -107,40 +82,23 @@
107
82
  --pds-color-code-block-light-foreground: #3B3D45;
108
83
  --pds-color-code-block-light-line-prefix: #686D78;
109
84
  --pds-color-code-block-light-highlight: #DEDFE0;
110
- --pds-color-dashboard-toggle-button-background: var(--pds-color-surface-reverse);
111
- --pds-color-dashboard-toggle-button-foreground: var(--pds-color-foreground-reverse);
112
- --pds-color-dashboard-nav-background: var(--pds-color-surface-default-secondary);
113
- --pds-color-dashboard-nav-background-admin: #edecf8;
114
- --pds-color-dashboard-nav-item-background-default: rgba(255, 255, 255, 0.00);
115
- --pds-color-dashboard-nav-item-background-hover: oklch(0.9401 0 0);
116
- --pds-color-dashboard-nav-item-background-hover-admin: oklch(0.9851 0 0);
117
- --pds-color-dashboard-nav-item-background-active: var(--pds-color-surface-reverse);
118
- --pds-color-dashboard-nav-item-foreground-default: var(--pds-color-foreground-default);
119
- --pds-color-dashboard-nav-item-foreground-hover: var(--pds-color-foreground-default);
120
- --pds-color-dashboard-nav-item-foreground-active: var(--pds-color-foreground-reverse);
121
- --pds-color-datepicker-accent-foreground: oklch(0.5558 0.2372 267.79);
122
- --pds-color-datepicker-range-background: oklch(0.955 0.0212 268.43);
85
+ --pds-color-datepicker-accent-foreground: oklch(0.5256 0.1988 268.04);
86
+ --pds-color-datepicker-range-background: oklch(0.9500 0.0300 268.00);
123
87
  --pds-color-datepicker-range-foreground: oklch(0.2178 0 0);
124
- --pds-color-datepicker-selected-background: oklch(0.5558 0.2372 267.79);
125
- --pds-color-datepicker-selected-foreground: oklch(0.9702 0 0);
126
- --pds-color-log-row-standard-background-default: oklch(0.2178 0 0);
127
- --pds-color-log-row-standard-background-hover: oklch(0.5173 0 0);
128
- --pds-color-log-row-warning-background-default: oklch(0.9665 0.0199 70.00);
129
- --pds-color-log-row-error-background-default: oklch(0.9740 0.0075 17.42);
130
- --pds-color-pagination-foreground-hover: oklch(0.2046 0 0);
88
+ --pds-color-datepicker-selected-background: oklch(0.5256 0.1988 268.04);
89
+ --pds-color-datepicker-selected-foreground: oklch(1.0000 0 0);
90
+ --pds-color-pagination-foreground-hover: oklch(0.2178 0 0);
131
91
  --pds-color-pagination-foreground-active: var(--pds-color-interactive-link-active);
132
- --pds-color-pagination-foreground-current: oklch(1 0 0);
133
- --pds-color-pagination-background-hover: oklch(0.9401 0 0);
134
- --pds-color-pagination-background-active: oklch(0.8775 0.0595 268.38);
135
- --pds-color-pagination-background-current: oklch(0.5558 0.2372 267.79);
92
+ --pds-color-pagination-foreground-current: var(--pds-color-interactive-background-current-foreground);
93
+ --pds-color-pagination-background-hover: oklch(0.9702 0 0);
94
+ --pds-color-pagination-background-active: oklch(0.9500 0.0300 268.00);
95
+ --pds-color-pagination-background-current: oklch(0.5256 0.1988 268.04);
136
96
  --pds-color-panel-sunken-background: oklch(0.9702 0 0);
137
- --pds-color-panel-raised-background: oklch(0.9851 0 0);
138
- --pds-color-panel-overlay-background: oklch(0.9851 0 0);
139
97
  --pds-color-expansion-panel-hover: oklch(0.9702 0 0);
140
98
  --pds-color-expansion-panel-open: oklch(0.9702 0 0);
141
- --pds-color-popover-border: oklch(0.8047 0 0);
142
- --pds-color-skeleton-regular-base: oklch(0.8853 0 0);
143
- --pds-color-skeleton-regular-movement: oklch(0.9851 0 0);
99
+ --pds-color-popover-border: oklch(0.9430 0 0);
100
+ --pds-color-skeleton-regular-base: oklch(0.8761 0 0);
101
+ --pds-color-skeleton-regular-movement: oklch(0.9702 0 0);
144
102
  --pds-color-skeleton-bold-base: oklch(0.8047 0 0);
145
103
  --pds-color-skeleton-bold-movement: oklch(0.9702 0 0);
146
104
  --pds-color-sortable-border-hover: oklch(0.7913 0.1048 267.25);
@@ -151,106 +109,119 @@
151
109
  --pds-color-spinner-mono-1: #171717;
152
110
  --pds-color-spinner-mono-2: #66666680;
153
111
  --pds-color-spinner-mono-3: transparent;
154
- --pds-color-spinner-mono-reverse-1: #FFFFFF;
112
+ --pds-color-spinner-mono-reverse-1: var(--pds-color-foreground-reverse);
155
113
  --pds-color-spinner-mono-reverse-2: #ffffff80;
156
114
  --pds-color-spinner-mono-reverse-3: transparent;
157
115
  --pds-color-spinner-critical-secondary-1: #DE2E21;
158
116
  --pds-color-spinner-critical-secondary-2: #F5B6B0;
159
117
  --pds-color-spinner-critical-secondary-3: transparent;
160
118
  --pds-color-table-sort-icon-inactive: oklch(0.78 0 0);
161
- --pds-color-tabs-border: oklch(0.8853 0 0);
162
- --pds-color-tag-apollo-background: #f4e296;
163
- --pds-color-tag-apollo-foreground: #461c00;
164
- --pds-color-tag-iris-background: #bcdeff;
165
- --pds-color-tag-iris-foreground: #1d00ac;
166
- --pds-color-tag-hypnos-background: #f2c8ff;
167
- --pds-color-tag-hypnos-foreground: #5000af;
168
- --pds-color-tag-gaia-background: #ebdfcf;
169
- --pds-color-tag-gaia-foreground: #411f00;
170
- --pds-color-tag-aether-background: #d1e5ef;
171
- --pds-color-tag-aether-foreground: #002f4c;
172
- --pds-color-tag-success-background: #c2efc7;
173
- --pds-color-tag-success-foreground: #003900;
174
- --pds-color-tag-warning-background: #ffd7b1;
175
- --pds-color-tag-warning-foreground: #570000;
176
- --pds-color-tag-critical-background: #ffc7b8;
177
- --pds-color-tag-critical-foreground: #730000;
178
- --pds-color-tag-info-background: #bcdeff;
179
- --pds-color-tag-info-foreground: #1d00ac;
180
- --pds-color-tag-discovery-background: #f4cfff;
181
- --pds-color-tag-discovery-foreground: #47007c;
182
- --pds-color-tag-amber-background: #bb5900;
183
- --pds-color-tag-amber-foreground: oklch(1 0 0);
184
- --pds-color-tag-orange-background: #d24300;
185
- --pds-color-tag-orange-foreground: oklch(1 0 0);
186
- --pds-color-tag-lime-background: #448600;
187
- --pds-color-tag-lime-foreground: oklch(1 0 0);
188
- --pds-color-tag-teal-background: #007a6e;
189
- --pds-color-tag-teal-foreground: oklch(1 0 0);
190
- --pds-color-tag-sky-background: #007daf;
191
- --pds-color-tag-sky-foreground: oklch(1 0 0);
192
- --pds-color-tag-indigo-background: #4040c0;
193
- --pds-color-tag-indigo-foreground: oklch(1 0 0);
194
- --pds-color-tag-rose-background: #c0306a;
195
- --pds-color-tag-rose-foreground: oklch(1 0 0);
196
- --pds-color-tag-slate-background: #5a6a7a;
197
- --pds-color-tag-slate-foreground: oklch(1 0 0);
198
- --pds-color-tag-sand-background: #917141;
199
- --pds-color-tag-sand-foreground: oklch(1 0 0);
200
- --pds-color-tag-mint-background: #008469;
201
- --pds-color-tag-mint-foreground: oklch(1 0 0);
202
- --pds-color-tag-silver-background: #969696;
203
- --pds-color-tag-silver-foreground: oklch(1 0 0);
204
- --pds-color-tag-stone-background: #717171;
205
- --pds-color-tag-stone-foreground: oklch(1 0 0);
206
- --pds-color-toast-background: oklch(0.3715 0 0);
207
- --pds-color-toast-foreground: oklch(0.9702 0 0);
208
- --pds-color-toast-action: oklch(0.8047 0 0);
209
- --pds-color-toast-info-icon: oklch(0.7019 0.1604 252.41);
210
- --pds-color-toast-success-icon: oklch(0.7275 0.177 148.24);
211
- --pds-color-toast-warning-icon: oklch(0.8008 0.1637 90.52);
212
- --pds-color-toast-critical-icon: oklch(0.6766 0.1572 26.68);
119
+ --pds-color-tabs-border: oklch(0.8761 0 0);
120
+ --pds-color-tag-orange-background: oklch(0.9175 0.0328 49.33);
121
+ --pds-color-tag-orange-foreground: oklch(0.3445 0.1414 29.23);
122
+ --pds-color-tag-stone-background: oklch(0.9261 0.0144 84.58);
123
+ --pds-color-tag-stone-foreground: oklch(0.4022 0.0071 84.59);
124
+ --pds-color-tag-gold-background: oklch(0.9281 0.0348 98.08);
125
+ --pds-color-tag-gold-foreground: oklch(0.2816 0.0657 60.48);
126
+ --pds-color-tag-lime-background: oklch(0.9185 0.0344 128.89);
127
+ --pds-color-tag-lime-foreground: oklch(0.2918 0.0993 142.50);
128
+ --pds-color-tag-mint-background: oklch(0.9073 0.0527 151.10);
129
+ --pds-color-tag-mint-foreground: oklch(0.3285 0.0782 152.24);
130
+ --pds-color-tag-teal-background: oklch(0.9189 0.0386 190.48);
131
+ --pds-color-tag-teal-foreground: oklch(0.3255 0.0535 183.50);
132
+ --pds-color-tag-sky-background: oklch(0.9144 0.0264 224.25);
133
+ --pds-color-tag-sky-foreground: oklch(0.3083 0.1049 255.90);
134
+ --pds-color-tag-slate-background: oklch(0.9388 0.0118 239.91);
135
+ --pds-color-tag-slate-foreground: oklch(0.3850 0.0290 240.04);
136
+ --pds-color-tag-indigo-background: oklch(0.9364 0.0311 281.82);
137
+ --pds-color-tag-indigo-foreground: oklch(0.3152 0.1990 274.45);
138
+ --pds-color-tag-purple-background: oklch(0.9113 0.0569 309.38);
139
+ --pds-color-tag-purple-foreground: oklch(0.3212 0.1930 280.92);
140
+ --pds-color-tag-magenta-background: oklch(0.9002 0.0517 333.06);
141
+ --pds-color-tag-magenta-foreground: oklch(0.3752 0.1614 342.18);
142
+ --pds-color-tag-rose-background: oklch(0.9390 0.0187 9.31);
143
+ --pds-color-tag-rose-foreground: oklch(0.3361 0.1343 13.26);
144
+ --pds-color-tag-red-background: oklch(0.8878 0.0422 25.25);
145
+ --pds-color-tag-red-foreground: oklch(0.3680 0.1455 30.49);
146
+ --pds-color-tag-silver-background: oklch(0.9430 0 0);
147
+ --pds-color-tag-silver-foreground: oklch(0.3211 0 0);
148
+ --pds-color-tag-orange-solid-background: oklch(0.5874 0.1832 40.31);
149
+ --pds-color-tag-orange-solid-foreground: oklch(1.0000 0 0);
150
+ --pds-color-tag-teal-solid-background: oklch(0.5216 0.0902 182.77);
151
+ --pds-color-tag-teal-solid-foreground: oklch(1.0000 0 0);
152
+ --pds-color-tag-indigo-solid-background: oklch(0.4574 0.1942 275.52);
153
+ --pds-color-tag-indigo-solid-foreground: oklch(1.0000 0 0);
154
+ --pds-color-tag-magenta-solid-background: oklch(0.4094 0.1728 339.08);
155
+ --pds-color-tag-magenta-solid-foreground: oklch(1.0000 0 0);
156
+ --pds-color-tag-rose-solid-background: oklch(0.5479 0.1847 1.24);
157
+ --pds-color-tag-rose-solid-foreground: oklch(1.0000 0 0);
158
+ --pds-color-tag-success-solid-background: oklch(0.4733 0.1035 134.24);
159
+ --pds-color-tag-success-solid-foreground: oklch(1.0000 0 0);
160
+ --pds-color-tag-warning-solid-background: oklch(0.5658 0.1338 53.43);
161
+ --pds-color-tag-warning-solid-foreground: oklch(1.0000 0 0);
162
+ --pds-color-tag-critical-solid-background: oklch(0.4501 0.1581 26.35);
163
+ --pds-color-tag-critical-solid-foreground: oklch(1.0000 0 0);
164
+ --pds-color-tag-info-solid-background: oklch(0.4662 0.0924 245.48);
165
+ --pds-color-tag-info-solid-foreground: oklch(1.0000 0 0);
166
+ --pds-color-tag-discovery-solid-background: oklch(0.4277 0.1065 303.89);
167
+ --pds-color-tag-discovery-solid-foreground: oklch(1.0000 0 0);
168
+ --pds-color-tally-success-background: oklch(0.5670 0.1201 132.73);
169
+ --pds-color-tally-success-foreground: oklch(1.0000 0 0);
170
+ --pds-color-tally-warning-background: oklch(0.5658 0.1338 53.43);
171
+ --pds-color-tally-warning-foreground: oklch(1.0000 0 0);
172
+ --pds-color-tally-critical-background: oklch(0.4501 0.1581 26.35);
173
+ --pds-color-tally-critical-foreground: oklch(1.0000 0 0);
174
+ --pds-color-tally-info-background: oklch(0.4662 0.0924 245.48);
175
+ --pds-color-tally-info-foreground: oklch(1.0000 0 0);
176
+ --pds-color-tally-discovery-background: oklch(0.4277 0.1065 303.89);
177
+ --pds-color-tally-discovery-foreground: oklch(1.0000 0 0);
213
178
  --pds-color-surface-default: oklch(1.0000 0 0);
214
179
  --pds-color-surface-default-secondary: oklch(0.9702 0 0);
215
180
  --pds-color-surface-reverse: oklch(0.2178 0 0);
216
181
  --pds-color-border-default: oklch(0.9430 0 0);
217
- --pds-color-border-default-secondary: oklch(0.8818 0 0);
218
- --pds-color-border-input: oklch(0.8818 0 0);
182
+ --pds-color-border-default-secondary: oklch(0.8761 0 0);
183
+ --pds-color-border-input: oklch(0.8761 0 0);
219
184
  --pds-color-border-separator: oklch(0.8047 0 0);
220
185
  --pds-color-border-hover: oklch(0.85 0 0);
221
186
  --pds-color-button-primary-background-default: oklch(0.2178 0 0);
222
187
  --pds-color-button-primary-background-hover: oklch(0.3493 0.0293 246.75);
188
+ --pds-color-button-primary-background-active: oklch(0.4144 0.0264 246.75);
223
189
  --pds-color-button-primary-foreground: var(--pds-color-foreground-reverse);
224
190
  --pds-color-button-secondary-background-default: rgba(255, 255, 255, 0.00);
225
191
  --pds-color-button-secondary-background-hover: oklch(0.9702 0 0);
192
+ --pds-color-button-secondary-background-active: oklch(0.9702 0 0);
226
193
  --pds-color-button-secondary-border: oklch(0.8047 0 0);
227
194
  --pds-color-button-secondary-foreground-default: oklch(0.2178 0 0);
228
195
  --pds-color-button-secondary-foreground-hover: oklch(0.2178 0 0);
229
196
  --pds-color-button-subtle-background-default: rgba(255, 255, 255, 0.00);
230
197
  --pds-color-button-subtle-background-hover: oklch(0.9702 0 0);
198
+ --pds-color-button-subtle-background-active: oklch(0.9702 0 0);
231
199
  --pds-color-button-subtle-foreground: oklch(0.2178 0 0);
232
200
  --pds-color-button-brand-background-default: oklch(0.8622 0.1681 88.31);
233
201
  --pds-color-button-brand-background-hover: oklch(0.8018 0.1553 87.86);
202
+ --pds-color-button-brand-background-active: oklch(0.7457 0.1444 87.86);
234
203
  --pds-color-button-brand-foreground: oklch(0.2178 0 0);
235
204
  --pds-color-button-highlight-background-default: oklch(0.5256 0.1988 268.04);
236
205
  --pds-color-button-highlight-background-hover: oklch(0.4293 0.1892 266.63);
237
- --pds-color-button-highlight-foreground: oklch(1.0000 0 0);
206
+ --pds-color-button-highlight-background-active: oklch(0.3864 0.1703 266.63);
207
+ --pds-color-button-highlight-foreground: var(--pds-color-foreground-reverse);
238
208
  --pds-color-button-critical-background-default: oklch(0.5338 0.1771 25.54);
239
209
  --pds-color-button-critical-background-hover: oklch(0.4501 0.1581 26.35);
240
- --pds-color-button-critical-foreground: oklch(0.9702 0 0);
210
+ --pds-color-button-critical-background-active: oklch(0.4051 0.1423 26.35);
211
+ --pds-color-button-critical-foreground: oklch(1.0000 0 0);
241
212
  --pds-color-button-critical-secondary-background-default: rgba(255, 255, 255, 0.00);
242
213
  --pds-color-button-critical-secondary-background-hover: oklch(0.9740 0.0075 17.42);
214
+ --pds-color-button-critical-secondary-background-active: oklch(0.9740 0.0075 17.42);
243
215
  --pds-color-button-critical-secondary-border-default: var(--pds-color-status-critical-foreground);
244
216
  --pds-color-button-critical-secondary-border-hover: var(--pds-color-status-critical-foreground);
245
217
  --pds-color-button-critical-secondary-foreground: oklch(0.4501 0.1581 26.35);
246
- --pds-color-button-navbar-background-default: rgba(255, 255, 255, 0.00);
247
- --pds-color-button-navbar-background-hover: oklch(0.9702 0 0);
248
- --pds-color-button-navbar-foreground: oklch(0.2178 0 0);
249
218
  --pds-color-button-reverse-background-default: oklch(0.9702 0 0);
250
- --pds-color-button-reverse-background-hover: oklch(0.8818 0 0);
219
+ --pds-color-button-reverse-background-hover: oklch(0.8761 0 0);
220
+ --pds-color-button-reverse-background-active: oklch(0.8148 0 0);
251
221
  --pds-color-button-reverse-foreground: oklch(0.2178 0 0);
252
222
  --pds-color-button-reverse-secondary-background-default: rgba(255, 255, 255, 0.00);
253
223
  --pds-color-button-reverse-secondary-background-hover: oklch(0.2931 0 0);
224
+ --pds-color-button-reverse-secondary-background-active: oklch(0.3638 0 0);
254
225
  --pds-color-button-reverse-secondary-border: oklch(0.5103 0 0);
255
226
  --pds-color-button-reverse-secondary-foreground: oklch(1.0000 0 0);
256
227
  --pds-color-close-button-foreground: oklch(0.5173 0 0);
@@ -272,11 +243,11 @@
272
243
  --pds-color-icon-button-reverse-border-hover: oklch(0.5103 0 0);
273
244
  --pds-color-icon-button-reverse-foreground: oklch(0.9430 0 0);
274
245
  --pds-color-split-button-primary-separator: oklch(0.5173 0 0);
275
- --pds-color-split-button-secondary-separator: oklch(0.8818 0 0);
246
+ --pds-color-split-button-secondary-separator: oklch(0.8761 0 0);
276
247
  --pds-color-segmented-button-background-inactive: oklch(0.9702 0 0);
277
- --pds-color-segmented-button-background-active: oklch(1.0000 0 0);
248
+ --pds-color-segmented-button-background-active: oklch(0.5256 0.1988 268.04);
278
249
  --pds-color-segmented-button-foreground-inactive: var(--pds-color-foreground-default-secondary);
279
- --pds-color-segmented-button-foreground-active: var(--pds-color-foreground-default);
250
+ --pds-color-segmented-button-foreground-active: var(--pds-color-foreground-reverse);
280
251
  --pds-color-category-ai-foreground: oklch(0.5200 0.1177 303.12);
281
252
  --pds-color-category-ai-utility: oklch(0.6777 0.0966 309.02);
282
253
  --pds-color-category-ai-background: oklch(0.9559 0.0143 308.29);
@@ -343,14 +314,14 @@
343
314
  --pds-color-dropdown-top-border: #dfdfdf;
344
315
  --pds-color-foreground-default: oklch(0.2178 0 0);
345
316
  --pds-color-foreground-default-secondary: oklch(0.5173 0 0);
346
- --pds-color-foreground-reverse: oklch(0.9702 0 0);
317
+ --pds-color-foreground-reverse: oklch(1.0000 0 0);
347
318
  --pds-color-foreground-reverse-secondary: oklch(0.8452 0 0);
348
319
  --pds-color-input-placeholder: oklch(0.8047 0 0);
349
320
  --pds-color-input-file-upload-button-background-default: oklch(0.9702 0 0);
350
321
  --pds-color-input-file-upload-button-background-hover: oklch(0.9430 0 0);
351
322
  --pds-color-input-selected-background: oklch(0.5256 0.1988 268.04);
352
323
  --pds-color-input-selected-foreground: oklch(1.0000 0 0);
353
- --pds-color-input-switch-icon: oklch(0.9702 0 0);
324
+ --pds-color-input-switch-icon: oklch(1.0000 0 0);
354
325
  --pds-color-input-tag-background-default: oklch(0.907 0 0);
355
326
  --pds-color-input-tag-background-hover: oklch(0.87 0 0);
356
327
  --pds-color-input-tag-background-active: oklch(0.9559 0.0143 308.29);
@@ -358,24 +329,26 @@
358
329
  --pds-color-input-tag-foreground-hover: oklch(0.2178 0 0);
359
330
  --pds-color-input-tag-foreground-active: oklch(0.5256 0.1988 268.04);
360
331
  --pds-color-input-tag-outline-active: oklch(0.5256 0.1988 268.04);
361
- --pds-color-interactive-background-hover: oklch(0.9702 0 0);
362
- --pds-color-interactive-background-active: oklch(0.9430 0 0);
363
332
  --pds-color-interactive-focus: oklch(0.5256 0.1988 268.04);
364
333
  --pds-color-interactive-link-default: oklch(0.5256 0.1988 268.04);
365
334
  --pds-color-interactive-link-hover: oklch(0.6015 0.1484 35.70);
366
335
  --pds-color-interactive-link-active: oklch(0.5093 0.1241 35.58);
367
336
  --pds-color-interactive-link-visited: oklch(0.5256 0.1988 268.04);
368
- --pds-color-interactive-ui-hover: oklch(0.5256 0.1988 268.04);
369
- --pds-color-interactive-ui-active: oklch(0.5256 0.1988 268.04);
370
- --pds-color-interactive-ui-current: oklch(0.5256 0.1988 268.04);
371
- --pds-color-interactive-ui-background-hover: oklch(0.9702 0 0);
372
- --pds-color-interactive-ui-background-active: oklch(0.9430 0 0);
337
+ --pds-color-interactive-foreground-current: oklch(0.5256 0.1988 268.04);
338
+ --pds-color-interactive-foreground-hover: oklch(0.5256 0.1988 268.04);
339
+ --pds-color-interactive-foreground-active: oklch(0.5256 0.1988 268.04);
340
+ --pds-color-interactive-foreground-inactive: oklch(0.8047 0 0);
341
+ --pds-color-interactive-background-current: oklch(0.5256 0.1988 268.04);
342
+ --pds-color-interactive-background-current-foreground: oklch(1.0000 0 0);
343
+ --pds-color-interactive-background-hover: oklch(0.9702 0 0);
344
+ --pds-color-interactive-background-active: oklch(0.9430 0 0);
345
+ --pds-color-interactive-background-selected: oklch(0.9500 0.0300 268.00);
373
346
  --pds-color-interactive-reverse-focus: oklch(0.6496 0.1590 270.95);
374
347
  --pds-color-interactive-reverse-link-default: oklch(0.6496 0.1590 270.95);
375
348
  --pds-color-interactive-reverse-link-hover: oklch(0.6707 0.1296 32.99);
376
349
  --pds-color-interactive-reverse-link-active: oklch(0.7480 0.1030 37.44);
377
350
  --pds-color-interactive-reverse-link-visited: oklch(0.6496 0.1590 270.95);
378
- --pds-color-interactive-reverse-ui-hover: oklch(0.6496 0.1590 270.95);
351
+ --pds-color-interactive-reverse-foreground-hover: oklch(0.6496 0.1590 270.95);
379
352
  --pds-color-nav-item-reverse-foreground-hover: oklch(0.8272 0.0507 309.02);
380
353
  --pds-color-nav-item-reverse-foreground-active: oklch(0.8272 0.0507 309.02);
381
354
  --pds-color-overlay: rgba(0, 0, 0, 0.45);
@@ -393,26 +366,40 @@
393
366
  --pds-color-status-success-fill: oklch(0.5670 0.1201 132.73);
394
367
  --pds-color-status-success-border: oklch(0.8774 0.0659 125.63);
395
368
  --pds-color-status-success-background: oklch(0.9656 0.0192 122.83);
396
- --pds-color-status-warning-foreground: oklch(0.5428 0.1292 52.61);
369
+ --pds-color-status-success-background-hover: oklch(0.9301 0.0402 124.12);
370
+ --pds-color-status-warning-foreground: oklch(0.5658 0.1338 53.43);
397
371
  --pds-color-status-warning-fill: oklch(0.6419 0.1457 55.55);
398
372
  --pds-color-status-warning-border: oklch(0.8603 0.0782 67.73);
399
373
  --pds-color-status-warning-background: oklch(0.9665 0.0199 70.00);
374
+ --pds-color-status-warning-background-hover: oklch(0.9208 0.0469 69.27);
400
375
  --pds-color-status-critical-foreground: oklch(0.4501 0.1581 26.35);
401
376
  --pds-color-status-critical-fill: oklch(0.5338 0.1771 25.54);
402
377
  --pds-color-status-critical-border: oklch(0.7978 0.0754 20.67);
403
378
  --pds-color-status-critical-background: oklch(0.9740 0.0075 17.42);
379
+ --pds-color-status-critical-background-hover: oklch(0.8859 0.0414 19.05);
404
380
  --pds-color-status-info-foreground: oklch(0.4662 0.0924 245.48);
405
381
  --pds-color-status-info-fill: oklch(0.5510 0.1014 242.56);
406
382
  --pds-color-status-info-border: oklch(0.8372 0.0459 236.03);
407
383
  --pds-color-status-info-background: oklch(0.9584 0.0134 233.74);
384
+ --pds-color-status-info-background-hover: oklch(0.9123 0.0286 231.46);
408
385
  --pds-color-status-discovery-foreground: oklch(0.4277 0.1065 303.89);
409
386
  --pds-color-status-discovery-fill: oklch(0.5200 0.1177 303.12);
410
387
  --pds-color-status-discovery-border: oklch(0.8272 0.0507 309.02);
411
388
  --pds-color-status-discovery-background: oklch(0.9559 0.0143 308.29);
412
- --pds-color-status-neutral-background: oklch(0.8818 0 0);
389
+ --pds-color-status-discovery-background-hover: oklch(0.9077 0.0264 310.39);
390
+ --pds-color-status-neutral-background: oklch(0.8761 0 0);
413
391
  --pds-color-status-neutral-indicator: oklch(0.5173 0 0);
414
392
  --pds-color-status-frozen-fill: oklch(0.5510 0.1014 242.56);
415
393
  --pds-color-status-disabled-fill: oklch(0.8047 0 0);
394
+ --pds-elevation-button-primary-active: inset 0px 2px 4px 0px rgba(0, 0, 0, 0.15);
395
+ --pds-elevation-button-secondary-active: inset 0px 1px 3px 0px rgba(0, 0, 0, 0.10);
396
+ --pds-elevation-button-subtle-active: inset 0px 0px 1px 0px rgba(0, 0, 0, 0.20);
397
+ --pds-elevation-button-critical-active: inset 0px 2px 4px 0px rgba(0, 0, 0, 0.15);
398
+ --pds-elevation-button-critical-secondary-active: inset 0px 1px 3px 0px rgba(0, 0, 0, 0.15);
399
+ --pds-elevation-button-brand-active: inset 0px 1px 3px 0px rgba(0, 0, 0, 0.10);
400
+ --pds-elevation-button-highlight-active: inset 0px 2px 4px 0px rgba(0, 0, 0, 0.15);
401
+ --pds-elevation-button-reverse-active: inset 0px 1px 3px 0px rgba(0, 0, 0, 0.10);
402
+ --pds-elevation-button-reverse-secondary-active: inset 0px 2px 4px 0px rgba(0, 0, 0, 0.15);
416
403
  --pds-elevation-drawer-left: 4px 0px 16px 0px rgba(0, 0, 0, 0.08);
417
404
  --pds-elevation-drawer-right: -4px 0px 16px 0px rgba(0, 0, 0, 0.08);
418
405
  --pds-elevation-icon-button-pressed: inset 0px 0px 4px 1px rgba(0, 0, 0, 0.04);
@@ -436,7 +423,6 @@
436
423
  --pds-gradient-avatar-earth: linear-gradient(315deg, #6BC5FC 0%, #218C5F 100%);
437
424
  --pds-gradient-avatar-moon: linear-gradient(315deg, #A2CFFF 0%, #8A70FF 100%);
438
425
  --pds-gradient-avatar-sun: linear-gradient(135deg, #E65F35 0%, #FFFF11 100%);
439
- --pds-gradient-badge-feature: linear-gradient(81deg, oklch(0.5939 0.2479 349.85) 3.17%, oklch(0.5157 0.2324 282.97) 92.85%);
440
426
  --pds-gradient-card-yellow: linear-gradient(225deg, #FFCB45 0%, #FFDC28 50%, #FFF1A9 100%);
441
427
  --pds-gradient-card-mint: linear-gradient(225deg, #4BCE97 0%, #BAF3DB 100%);
442
428
  --pds-gradient-card-lavender: linear-gradient(225deg, #8A70FF 0%, #BFB1FF 100%);
package/dist/css/layout-css/pds-app-layout.css CHANGED
@@ -1,3 +1,3 @@
1
1
  .pds-app-layout{--toggle-icon-size:1.5rem;--toggle-trigger-size:2rem;--button-offset:calc(var(--toggle-trigger-size)*-0.5);--pds-app-layout-top-offset:0px;box-sizing:border-box;column-gap:0;display:flex;flex-direction:row;min-height:calc(100dvh - var(--pds-app-layout-top-offset));width:100%}.pds-app-layout__main{flex:1;padding:var(--pds-spacing-2xl);position:relative}.pds-app-layout__sidebar{position:relative;z-index:1}.pds-app-layout:has(.pds-app-layout__sidebar) .pds-app-layout__main{border-left:1px solid var(--pds-color-border-default);transition:border-color .15s ease-in-out}.pds-app-layout__sidebar--collapsed .pds-identity-block__text{opacity:0}.pds-app-layout__sidebar--collapsed .pds-app-layout__sidebar-content-bottom,.pds-app-layout__sidebar--collapsed .pds-app-layout__sidebar-content-top,.pds-app-layout__sidebar--collapsed .pds-app-layout__sidebar-identity{padding-inline-start:var(--pds-spacing-l)}.pds-app-layout__sidebar--collapsed .pds-app-layout__sidebar-navigation{--side-nav-global-item-inset:var(--pds-spacing-m);overflow-x:visible}.pds-app-layout__sidebar--collapsed .pds-app-layout__sidebar-navigation .pds-side-nav-global__item-wrapper a{padding-inline:0;width:2rem}.pds-app-layout__sidebar--collapsed .pds-app-layout__sidebar-inner{padding-inline-end:var(--pds-spacing-s)}.pds-app-layout__sidebar{transition:width .2s ease-in-out,min-width .2s ease-in-out}.pds-app-layout:has(.pds-app-layout__sidebar-toggle-button:hover)
2
- .pds-app-layout__main{border-left-color:var(--pds-color-border-hover)}.pds-app-layout__sidebar-toggle-tooltip.pds-tooltip{height:100%;position:absolute;right:var(--button-offset);top:0;width:var(--toggle-trigger-size);z-index:2}.pds-app-layout__sidebar-toggle-tooltip .pds-tooltip__trigger-custom{display:flex;height:100%;width:100%}.pds-app-layout__sidebar-toggle-button{background-color:transparent;border:none;cursor:pointer;height:100%;position:relative;width:100%}.pds-app-layout__sidebar-toggle-button:focus-visible{outline:none}.pds-app-layout__sidebar-toggle-button:focus-visible>.pds-app-layout__sidebar-toggle-icon{outline:var(--pds-border-width-default) solid var(--pds-color-interactive-focus);outline-offset:2px}.pds-app-layout__sidebar-toggle-button:hover>.pds-app-layout__sidebar-toggle-icon{background-color:var(--pds-color-dashboard-toggle-button-background);filter:brightness(.9)}.pds-app-layout__sidebar-toggle-icon{align-items:center;background-color:var(--pds-color-dashboard-toggle-button-background);border:none;border-radius:50%;bottom:var(--pds-spacing-2xl);color:var(--pds-color-dashboard-toggle-button-foreground);display:flex;height:var(--toggle-icon-size);justify-content:center;position:absolute;right:.25rem;transition:var(--pds-animation-transition-rotation);width:var(--toggle-icon-size);z-index:2}.pds-app-layout__sidebar-toggle-button[aria-expanded=false]
2
+ .pds-app-layout__main{border-left-color:var(--pds-color-border-hover)}.pds-app-layout__sidebar-toggle-tooltip.pds-tooltip{height:100%;position:absolute;right:var(--button-offset);top:0;width:var(--toggle-trigger-size);z-index:2}.pds-app-layout__sidebar-toggle-tooltip .pds-tooltip__trigger-custom{display:flex;height:100%;width:100%}.pds-app-layout__sidebar-toggle-button{background-color:transparent;border:none;cursor:pointer;height:100%;position:relative;width:100%}.pds-app-layout__sidebar-toggle-button:focus-visible{outline:none}.pds-app-layout__sidebar-toggle-button:focus-visible>.pds-app-layout__sidebar-toggle-icon{outline:var(--pds-border-width-default) solid var(--pds-color-interactive-focus);outline-offset:2px}.pds-app-layout__sidebar-toggle-button:hover>.pds-app-layout__sidebar-toggle-icon{background-color:var(--pds-color-surface-reverse);filter:brightness(.9)}.pds-app-layout__sidebar-toggle-icon{align-items:center;background-color:var(--pds-color-surface-reverse);border:none;border-radius:50%;bottom:var(--pds-spacing-2xl);color:var(--pds-color-foreground-reverse);display:flex;height:var(--toggle-icon-size);justify-content:center;position:absolute;right:.25rem;transition:var(--pds-animation-transition-rotation);width:var(--toggle-icon-size);z-index:2}.pds-app-layout__sidebar-toggle-button[aria-expanded=false]
3
3
  .pds-app-layout__sidebar-toggle-icon{transform:rotate(180deg);transition:var(--pds-animation-transition-rotation)}.pds-app-layout__sidebar-inner{display:flex;flex-direction:column;height:100%;margin-inline-start:0;padding-block-end:var(--pds-spacing-2xl);padding-block-start:var(--pds-spacing-xl);padding-inline-end:var(--pds-spacing-l);transition:padding-inline-end .2s ease-in-out}.pds-app-layout__sidebar-identity{align-items:center;display:flex;gap:var(--pds-spacing-s);justify-content:flex-start;padding-block-end:var(--pds-spacing-xl);padding-inline-start:var(--pds-spacing-l)}.pds-app-layout__drawer-toggle{flex-shrink:0;margin-inline-start:auto}.pds-app-layout__sidebar-content-top{padding-block-end:var(--pds-spacing-l);padding-inline-start:var(--pds-spacing-l)}.pds-app-layout__sidebar-navigation{--side-nav-global-item-inset:var(--pds-spacing-m);flex:1;overflow-x:clip;text-wrap:nowrap}.pds-app-layout__sidebar-navigation .pds-side-nav-global__item--top-level:before,.pds-app-layout__sidebar-navigation .pds-side-nav-global__item-wrapper{height:2rem}.pds-app-layout__sidebar-navigation .pds-side-nav-global__item-wrapper a{padding-inline:var(--pds-spacing-4xs)}.pds-app-layout__sidebar-navigation .pds-side-nav-global__menu--second-level{padding-inline-start:calc(var(--side-nav-global-icon-width) + var(--side-nav-global-space-after-icon))}.pds-app-layout__sidebar-navigation .pds-side-nav-global__item--second-level a{padding-inline:var(--pds-spacing-3xs)}.pds-app-layout__sidebar-content-bottom{margin-block-start:auto;padding-block-start:var(--pds-spacing-l);padding-inline-start:var(--pds-spacing-l)}.pds-app-layout--scrollable{height:calc(100dvh - var(--pds-app-layout-top-offset));overflow:hidden}.pds-app-layout--scrollable .pds-app-layout__main,.pds-app-layout--scrollable .pds-app-layout__sidebar-inner{overflow-y:auto}
package/dist/css/layout-css/pds-index.css CHANGED
@@ -1,3 +1,3 @@
1
1
  .pds-app-layout{--toggle-icon-size:1.5rem;--toggle-trigger-size:2rem;--button-offset:calc(var(--toggle-trigger-size)*-0.5);--pds-app-layout-top-offset:0px;box-sizing:border-box;column-gap:0;display:flex;flex-direction:row;min-height:calc(100dvh - var(--pds-app-layout-top-offset));width:100%}.pds-app-layout__main{flex:1;padding:var(--pds-spacing-2xl);position:relative}.pds-app-layout__sidebar{position:relative;z-index:1}.pds-app-layout:has(.pds-app-layout__sidebar) .pds-app-layout__main{border-left:1px solid var(--pds-color-border-default);transition:border-color .15s ease-in-out}.pds-app-layout__sidebar--collapsed .pds-identity-block__text{opacity:0}.pds-app-layout__sidebar--collapsed .pds-app-layout__sidebar-content-bottom,.pds-app-layout__sidebar--collapsed .pds-app-layout__sidebar-content-top,.pds-app-layout__sidebar--collapsed .pds-app-layout__sidebar-identity{padding-inline-start:var(--pds-spacing-l)}.pds-app-layout__sidebar--collapsed .pds-app-layout__sidebar-navigation{--side-nav-global-item-inset:var(--pds-spacing-m);overflow-x:visible}.pds-app-layout__sidebar--collapsed .pds-app-layout__sidebar-navigation .pds-side-nav-global__item-wrapper a{padding-inline:0;width:2rem}.pds-app-layout__sidebar--collapsed .pds-app-layout__sidebar-inner{padding-inline-end:var(--pds-spacing-s)}.pds-app-layout__sidebar{transition:width .2s ease-in-out,min-width .2s ease-in-out}.pds-app-layout:has(.pds-app-layout__sidebar-toggle-button:hover)
2
- .pds-app-layout__main{border-left-color:var(--pds-color-border-hover)}.pds-app-layout__sidebar-toggle-tooltip.pds-tooltip{height:100%;position:absolute;right:var(--button-offset);top:0;width:var(--toggle-trigger-size);z-index:2}.pds-app-layout__sidebar-toggle-tooltip .pds-tooltip__trigger-custom{display:flex;height:100%;width:100%}.pds-app-layout__sidebar-toggle-button{background-color:transparent;border:none;cursor:pointer;height:100%;position:relative;width:100%}.pds-app-layout__sidebar-toggle-button:focus-visible{outline:none}.pds-app-layout__sidebar-toggle-button:focus-visible>.pds-app-layout__sidebar-toggle-icon{outline:var(--pds-border-width-default) solid var(--pds-color-interactive-focus);outline-offset:2px}.pds-app-layout__sidebar-toggle-button:hover>.pds-app-layout__sidebar-toggle-icon{background-color:var(--pds-color-dashboard-toggle-button-background);filter:brightness(.9)}.pds-app-layout__sidebar-toggle-icon{align-items:center;background-color:var(--pds-color-dashboard-toggle-button-background);border:none;border-radius:50%;bottom:var(--pds-spacing-2xl);color:var(--pds-color-dashboard-toggle-button-foreground);display:flex;height:var(--toggle-icon-size);justify-content:center;position:absolute;right:.25rem;transition:var(--pds-animation-transition-rotation);width:var(--toggle-icon-size);z-index:2}.pds-app-layout__sidebar-toggle-button[aria-expanded=false]
2
+ .pds-app-layout__main{border-left-color:var(--pds-color-border-hover)}.pds-app-layout__sidebar-toggle-tooltip.pds-tooltip{height:100%;position:absolute;right:var(--button-offset);top:0;width:var(--toggle-trigger-size);z-index:2}.pds-app-layout__sidebar-toggle-tooltip .pds-tooltip__trigger-custom{display:flex;height:100%;width:100%}.pds-app-layout__sidebar-toggle-button{background-color:transparent;border:none;cursor:pointer;height:100%;position:relative;width:100%}.pds-app-layout__sidebar-toggle-button:focus-visible{outline:none}.pds-app-layout__sidebar-toggle-button:focus-visible>.pds-app-layout__sidebar-toggle-icon{outline:var(--pds-border-width-default) solid var(--pds-color-interactive-focus);outline-offset:2px}.pds-app-layout__sidebar-toggle-button:hover>.pds-app-layout__sidebar-toggle-icon{background-color:var(--pds-color-surface-reverse);filter:brightness(.9)}.pds-app-layout__sidebar-toggle-icon{align-items:center;background-color:var(--pds-color-surface-reverse);border:none;border-radius:50%;bottom:var(--pds-spacing-2xl);color:var(--pds-color-foreground-reverse);display:flex;height:var(--toggle-icon-size);justify-content:center;position:absolute;right:.25rem;transition:var(--pds-animation-transition-rotation);width:var(--toggle-icon-size);z-index:2}.pds-app-layout__sidebar-toggle-button[aria-expanded=false]
3
3
  .pds-app-layout__sidebar-toggle-icon{transform:rotate(180deg);transition:var(--pds-animation-transition-rotation)}.pds-app-layout__sidebar-inner{display:flex;flex-direction:column;height:100%;margin-inline-start:0;padding-block-end:var(--pds-spacing-2xl);padding-block-start:var(--pds-spacing-xl);padding-inline-end:var(--pds-spacing-l);transition:padding-inline-end .2s ease-in-out}.pds-app-layout__sidebar-identity{align-items:center;display:flex;gap:var(--pds-spacing-s);justify-content:flex-start;padding-block-end:var(--pds-spacing-xl);padding-inline-start:var(--pds-spacing-l)}.pds-app-layout__drawer-toggle{flex-shrink:0;margin-inline-start:auto}.pds-app-layout__sidebar-content-top{padding-block-end:var(--pds-spacing-l);padding-inline-start:var(--pds-spacing-l)}.pds-app-layout__sidebar-navigation{--side-nav-global-item-inset:var(--pds-spacing-m);flex:1;overflow-x:clip;text-wrap:nowrap}.pds-app-layout__sidebar-navigation .pds-side-nav-global__item--top-level:before,.pds-app-layout__sidebar-navigation .pds-side-nav-global__item-wrapper{height:2rem}.pds-app-layout__sidebar-navigation .pds-side-nav-global__item-wrapper a{padding-inline:var(--pds-spacing-4xs)}.pds-app-layout__sidebar-navigation .pds-side-nav-global__menu--second-level{padding-inline-start:calc(var(--side-nav-global-icon-width) + var(--side-nav-global-space-after-icon))}.pds-app-layout__sidebar-navigation .pds-side-nav-global__item--second-level a{padding-inline:var(--pds-spacing-3xs)}.pds-app-layout__sidebar-content-bottom{margin-block-start:auto;padding-block-start:var(--pds-spacing-l);padding-inline-start:var(--pds-spacing-l)}.pds-app-layout--scrollable{height:calc(100dvh - var(--pds-app-layout-top-offset));overflow:hidden}.pds-app-layout--scrollable .pds-app-layout__main,.pds-app-layout--scrollable .pds-app-layout__sidebar-inner{overflow-y:auto}.pds-docs-layout{column-gap:var(--pds-spacing-2xl);display:flex;flex:1;flex-direction:row;height:100%}.pds-docs-layout__content,.pds-docs-layout__sidebar{padding-block:var(--pds-spacing-2xl)}.pds-docs-layout__content{flex:1}.pds-docs-layout__sidebar{border-inline-end:1px solid var(--pds-color-border-default);max-width:var(--docs-sidebar-max-width,20rem);min-width:var(--docs-sidebar-min-width,15rem);width:var(--docs-sidebar-width,18%)}.pds-docs-layout__sidebar-inner{margin-inline-end:var(--pds-spacing-xl);overflow-x:hidden}[data-pds-mobile] .pds-docs-layout{flex-direction:column;height:unset}[data-pds-mobile] .pds-docs-layout__content,[data-pds-mobile] .pds-docs-layout__sidebar{border:none;max-width:unset;width:100%}[data-pds-mobile] .pds-docs-layout__sidebar{border-block-end:var(--pds-border-width-default) solid var(--pds-color-border-default);min-width:unset}[data-pds-mobile] .pds-docs-layout__sidebar-inner{margin-inline-end:0}.pds-stepper-layout{padding-inline:0}.pds-stepper-layout__form-container{padding-block-start:var(--pds-spacing-2xl)}@media (min-width:768px){.pds-stepper-layout__form-container{margin-inline:auto;padding-inline:14%}}@media (min-width:1280px){.pds-stepper-layout__form-container{padding-inline:16%}}.pds-stepper__button-group{column-gap:var(--pds-spacing-xl);display:flex;justify-content:space-between;padding-block-start:var(--pds-spacing-3xl)}@media (min-width:768px){.pds-stepper__button-group{margin-inline-start:50%;max-width:var(--stepper-layout-max-width);padding-inline:calc(var(--pds-spacing-stepper-indicator-size)*2);transform:translate3d(-50%,0,0);width:100vw}}.pds-three-item-layout .pds-grid-item{display:flex;flex-direction:column}.pds-three-item-layout--start .pds-grid-item{justify-content:flex-start}.pds-three-item-layout--center .pds-grid-item{justify-content:center}.pds-three-item-layout--end .pds-grid-item{justify-content:flex-end}.pds-two-item-layout .pds-grid-item{display:flex;flex-direction:column}.pds-two-item-layout--start .pds-grid-item{justify-content:flex-start}.pds-two-item-layout--center .pds-grid-item{justify-content:center}.pds-two-item-layout--end .pds-grid-item{justify-content:flex-end}