@godxjp/ui 28.12.0 → 29.0.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 (178) hide show
  1. package/agent/START-HERE.md +29 -10
  2. package/agent/components/Anchor.json +6 -1
  3. package/agent/components/AppLauncher.json +10 -0
  4. package/agent/components/AppShell.json +1 -1
  5. package/agent/components/AreaChart.json +19 -1
  6. package/agent/components/Attachments.json +26 -1
  7. package/agent/components/BarChart.json +11 -1
  8. package/agent/components/BranchScopePicker.json +10 -0
  9. package/agent/components/Cascader.json +6 -1
  10. package/agent/components/Checkbox.json +6 -0
  11. package/agent/components/CompactBarTrend.json +1 -1
  12. package/agent/components/CredentialReveal.json +21 -0
  13. package/agent/components/DataState.json +1 -1
  14. package/agent/components/DataTable.json +4 -4
  15. package/agent/components/FormField.json +1 -1
  16. package/agent/components/InfiniteQueryState.json +1 -1
  17. package/agent/components/Input.json +1 -1
  18. package/agent/components/InputOTP.json +35 -0
  19. package/agent/components/LineChart.json +20 -2
  20. package/agent/components/ListRow.json +1 -1
  21. package/agent/components/Masonry.json +1 -1
  22. package/agent/components/MasterDetail.json +1 -1
  23. package/agent/components/PasswordStrength.json +1 -1
  24. package/agent/components/PermissionMatrix.json +6 -1
  25. package/agent/components/SearchInput.json +5 -0
  26. package/agent/components/Select.json +1 -0
  27. package/agent/components/ServiceRolePanel.json +5 -0
  28. package/agent/components/Sidebar.json +1 -1
  29. package/agent/components/Switch.json +6 -0
  30. package/agent/components/Table.json +8 -3
  31. package/agent/components/Tabs.json +10 -0
  32. package/agent/components/ThemeScope.json +49 -0
  33. package/agent/components/TimeRangePicker.json +5 -0
  34. package/agent/components/Topbar.json +1 -0
  35. package/agent/components/TopbarItem.json +2 -1
  36. package/agent/components/Transfer.json +6 -1
  37. package/agent/components/TreeSelect.json +1 -1
  38. package/agent/components/Upload.json +5 -0
  39. package/agent/components/UploadCropDialog.json +1 -1
  40. package/agent/components/formatDate.json +1 -1
  41. package/agent/components-index.json +5 -0
  42. package/agent/components.json +297 -31
  43. package/agent/index.json +19 -9
  44. package/agent/llms.txt +10 -10
  45. package/agent/patterns/tenant-brand-color.json +28 -0
  46. package/agent/patterns-index.json +27 -0
  47. package/agent/patterns.json +28 -0
  48. package/agent/rules.json +15 -0
  49. package/agent/tokens.json +4965 -970
  50. package/dist/app/index.d.ts +3 -0
  51. package/dist/app/index.js +3 -0
  52. package/dist/app/tenant-theme.d.ts +80 -0
  53. package/dist/app/tenant-theme.js +154 -0
  54. package/dist/app/theme-axes.d.ts +14 -1
  55. package/dist/app/theme-axes.js +24 -31
  56. package/dist/components/charts/chart-cartesian.d.ts +5 -1
  57. package/dist/components/charts/chart-cartesian.js +15 -8
  58. package/dist/components/data-display/badge.d.ts +1 -1
  59. package/dist/components/data-display/badge.js +20 -2
  60. package/dist/components/data-display/carousel.js +4 -4
  61. package/dist/components/data-display/data-table.js +13 -2
  62. package/dist/components/data-display/permission-matrix.js +1 -1
  63. package/dist/components/data-display/table.d.ts +11 -2
  64. package/dist/components/data-display/table.js +18 -2
  65. package/dist/components/data-entry/control-appearance.d.ts +12 -6
  66. package/dist/components/data-entry/control-appearance.js +1 -1
  67. package/dist/components/data-entry/select.js +4 -3
  68. package/dist/components/feedback/dialog.js +6 -3
  69. package/dist/components/feedback/overlay-header-tone.d.ts +7 -0
  70. package/dist/components/feedback/overlay-header-tone.js +4 -4
  71. package/dist/components/feedback/sheet.d.ts +1 -1
  72. package/dist/components/feedback/sheet.js +6 -9
  73. package/dist/components/feedback/sonner.js +16 -3
  74. package/dist/components/general/button.js +22 -5
  75. package/dist/components/layout/affix.js +15 -1
  76. package/dist/components/layout/sidebar.js +7 -1
  77. package/dist/components/navigation/anchor.d.ts +1 -1
  78. package/dist/components/navigation/anchor.js +5 -4
  79. package/dist/components/navigation/app-setting-picker.js +1 -1
  80. package/dist/components/navigation/pagination.js +1 -1
  81. package/dist/components/navigation/tabs.js +15 -2
  82. package/dist/components/query/infinite-query-state.d.ts +22 -6
  83. package/dist/contracts/measurement.json +1 -1
  84. package/dist/i18n/messages/en.json +0 -697
  85. package/dist/i18n/messages/ja.json +0 -691
  86. package/dist/i18n/messages/vi.json +0 -691
  87. package/dist/lib/control-styles.d.ts +31 -11
  88. package/dist/lib/control-styles.js +6 -6
  89. package/dist/lib/overlay-portal.d.ts +20 -0
  90. package/dist/lib/overlay-portal.js +93 -0
  91. package/dist/props/components/app.prop.d.ts +12 -0
  92. package/dist/props/components/charts.prop.d.ts +30 -0
  93. package/dist/props/components/index.d.ts +1 -1
  94. package/dist/props/components/navigation.prop.d.ts +21 -2
  95. package/dist/props/components/query.prop.d.ts +36 -2
  96. package/dist/props/registry.d.ts +46 -1
  97. package/dist/props/registry.js +38 -3
  98. package/dist/styles/alert-layout.css +34 -14
  99. package/dist/styles/badge-layout.css +10 -6
  100. package/dist/styles/base.css +14 -5
  101. package/dist/styles/card-layout.css +19 -8
  102. package/dist/styles/chart-layout.css +22 -3
  103. package/dist/styles/control.css +165 -59
  104. package/dist/styles/data-display-layout.css +129 -36
  105. package/dist/styles/data-entry-layout.css +23 -87
  106. package/dist/styles/dialog-layout.css +49 -19
  107. package/dist/styles/float-button-layout.css +5 -5
  108. package/dist/styles/focus-ring.css +9 -5
  109. package/dist/styles/layout.css +42 -15
  110. package/dist/styles/logo-layout.css +1 -1
  111. package/dist/styles/motion.css +1 -1
  112. package/dist/styles/navigation-layout.css +90 -29
  113. package/dist/styles/shell-layout.css +63 -40
  114. package/dist/styles/table-layout.css +56 -17
  115. package/dist/styles/text-layout.css +13 -4
  116. package/dist/styles/toggle.css +8 -2
  117. package/dist/tokens/components/actions.css +1 -1
  118. package/dist/tokens/components/attachments.css +4 -4
  119. package/dist/tokens/components/badge.css +4 -4
  120. package/dist/tokens/components/callout.css +1 -1
  121. package/dist/tokens/components/card.css +9 -4
  122. package/dist/tokens/components/chart.css +10 -1
  123. package/dist/tokens/components/chat-bubble.css +1 -1
  124. package/dist/tokens/components/control.css +28 -10
  125. package/dist/tokens/components/conversations.css +2 -1
  126. package/dist/tokens/components/data-display.css +12 -7
  127. package/dist/tokens/components/descriptions.css +1 -1
  128. package/dist/tokens/components/draggable-panel.css +1 -1
  129. package/dist/tokens/components/feedback.css +28 -8
  130. package/dist/tokens/components/float-button.css +1 -1
  131. package/dist/tokens/components/legal-document.css +1 -1
  132. package/dist/tokens/components/logo.css +1 -1
  133. package/dist/tokens/components/mega-menu.css +5 -3
  134. package/dist/tokens/components/navigation.css +21 -7
  135. package/dist/tokens/components/segmented.css +8 -3
  136. package/dist/tokens/components/shell.css +19 -5
  137. package/dist/tokens/components/table.css +9 -1
  138. package/dist/tokens/components/thought-chain.css +1 -1
  139. package/dist/tokens/components/toggle.css +2 -0
  140. package/dist/tokens/components/tree.css +3 -1
  141. package/dist/tokens/components/upload.css +6 -6
  142. package/dist/tokens/components/welcome.css +1 -1
  143. package/dist/tokens/foundation.css +28 -1
  144. package/docs/COMPOSITION-VS-COMPONENT.md +31 -0
  145. package/docs/CUSTOMER-THEMING.md +637 -1
  146. package/docs/DESIGN-AUTHORITY.md +13 -0
  147. package/docs/FRAME-COVERAGE-REPORT.md +3 -2
  148. package/docs/GLASSMORPHISM-STANDARD.md +196 -0
  149. package/docs/THEME-API-COVERAGE.md +538 -0
  150. package/docs/TOKEN-RESOLUTION.md +195 -0
  151. package/docs/TOKENS.md +63 -24
  152. package/docs/asset-modules.d.ts +7 -0
  153. package/docs/data-display/charts.tsx +80 -0
  154. package/docs/data-display/data-table/index.tsx +30 -0
  155. package/docs/data-display/popover.tsx +1 -1
  156. package/docs/data-display/table.tsx +52 -0
  157. package/docs/feedback/sheet.tsx +10 -10
  158. package/docs/foundation/density.tsx +4 -4
  159. package/docs/i18n/messages/en.json +1201 -0
  160. package/docs/i18n/messages/ja.json +1195 -0
  161. package/docs/i18n/messages/vi.json +1195 -0
  162. package/docs/layout/account-chip.tsx +2 -2
  163. package/docs/layout/responsive-grid.tsx +1 -1
  164. package/docs/navigation/toolbar.tsx +20 -12
  165. package/docs/providers/theme-scope.tsx +186 -0
  166. package/docs/showcase/caimono-price-comparison.tsx +911 -0
  167. package/docs/showcase/case4-login.tsx +2 -2
  168. package/docs/showcase/marketing-page.tsx +3 -2
  169. package/docs/showcase/permission-matrix.tsx +13 -5
  170. package/docs/showcase/table-pagination.tsx +2 -1
  171. package/docs/showcase/tenant-brand-color.tsx +338 -0
  172. package/docs/showcase/theme-customization.tsx +2 -1
  173. package/docs/showcase/theme-lab.tsx +2125 -0
  174. package/docs/themes/flat.css +462 -0
  175. package/docs/themes/glassmorphism.css +958 -0
  176. package/docs/themes/index.ts +200 -0
  177. package/package.json +4 -3
  178. package/scripts/explain-token.mjs +382 -0
@@ -20,7 +20,18 @@
20
20
  --control-gap-sm: var(--space-inline-xs);
21
21
  --control-radius: var(--radius);
22
22
 
23
- --button-radius: var(--radius-md);
23
+ --button-radius: var(--radius-md, calc(var(--radius) / var(--radius-ratio)));
24
+
25
+ --button-default-background: initial;
26
+ --button-destructive-background: initial;
27
+ --button-outline-background: initial;
28
+ --button-outline-background-alpha: initial;
29
+ --button-outline-border-color: initial;
30
+ --button-secondary-background: initial;
31
+ --button-secondary-background-alpha: initial;
32
+
33
+ --button-link-foreground: initial;
34
+ --button-backdrop-blur-size: initial;
24
35
 
25
36
  --control-font-size: var(--font-size-base);
26
37
  --control-border-width: var(--stroke-hairline);
@@ -36,6 +47,7 @@
36
47
 
37
48
  --control-variant-filled-background: var(--muted);
38
49
  --control-variant-filled-hover-background: initial;
50
+ --control-variant-filled-hover-background-alpha: initial;
39
51
 
40
52
  --control-count-font-size: var(--font-size-sm, var(--font-size-base));
41
53
  --control-count-color: var(--muted-foreground);
@@ -72,7 +84,7 @@
72
84
  --font-size-xs,
73
85
  calc(var(--font-size-base) / var(--font-size-ratio))
74
86
  );
75
- --slider-tooltip-radius: var(--radius-sm);
87
+ --slider-tooltip-radius: initial;
76
88
  --slider-tooltip-padding-inline: var(--space-2);
77
89
  --slider-tooltip-offset-block: var(--space-2);
78
90
 
@@ -82,6 +94,7 @@
82
94
 
83
95
  --choice-button-selected-color: initial;
84
96
  --choice-button-selected-border-color: initial;
97
+ --choice-button-selected-border-color-alpha: initial;
85
98
  --choice-button-solid-background: initial;
86
99
  --choice-button-solid-color: initial;
87
100
 
@@ -138,6 +151,7 @@
138
151
  --slider-range-background: initial;
139
152
 
140
153
  --switch-unchecked-background: initial;
154
+ --switch-unchecked-background-alpha: initial;
141
155
 
142
156
  --switch-content-unchecked-foreground: initial;
143
157
 
@@ -199,7 +213,7 @@
199
213
 
200
214
  --control-affix-inset-inline-end: var(--space-2);
201
215
  --control-affix-action-size: 1.5rem;
202
- --control-affix-action-radius: var(--radius-sm);
216
+ --control-affix-action-radius: initial;
203
217
  --control-affix-icon-size: var(--icon-size-md);
204
218
 
205
219
  --control-affix-rest-alpha: 0.5;
@@ -266,7 +280,7 @@
266
280
 
267
281
  --cascader-result-space-inline: var(--space-2);
268
282
  --cascader-result-space-block: 0.375rem;
269
- --cascader-result-radius: var(--radius-sm);
283
+ --cascader-result-radius: initial;
270
284
  --cascader-result-icon-space-inline-end: var(--space-2);
271
285
  --cascader-empty-space-block: var(--space-6);
272
286
 
@@ -274,6 +288,9 @@
274
288
 
275
289
  --select-content-inline-size: auto;
276
290
 
291
+ --select-content-background: initial;
292
+ --select-content-backdrop-blur-size: initial;
293
+
277
294
  --select-empty-space-block: var(--search-select-placeholder-space-block);
278
295
  --select-scroll-button-space-block: var(--space-1);
279
296
 
@@ -291,7 +308,7 @@
291
308
  );
292
309
  --time-picker-column-space-inset: var(--space-1);
293
310
  --time-picker-option-space-block: 0.375rem;
294
- --time-picker-option-radius: var(--radius-md);
311
+ --time-picker-option-radius: initial;
295
312
  --time-picker-option-font-size: var(--font-size-sm, var(--font-size-base));
296
313
  --time-picker-footer-space-inset: var(--space-2);
297
314
  --time-picker-footer-space-gap: var(--space-2);
@@ -301,7 +318,7 @@
301
318
  --tree-select-list-max-height: min(300px, 50vh);
302
319
  --tree-select-row-space-block: 0.375rem;
303
320
  --tree-select-row-space-inline-end: var(--space-2);
304
- --tree-select-row-radius: var(--radius-sm);
321
+ --tree-select-row-radius: initial;
305
322
  --tree-select-row-font-size: var(--font-size-sm, var(--font-size-base));
306
323
 
307
324
  --tree-select-depth-space-base: var(--space-2);
@@ -328,9 +345,9 @@
328
345
  --font-size-xs,
329
346
  calc(var(--font-size-base) / var(--font-size-ratio))
330
347
  );
331
- --calendar-weekday-radius: var(--radius-md);
348
+ --calendar-weekday-radius: initial;
332
349
  --calendar-day-font-size: var(--font-size-sm, var(--font-size-base));
333
- --calendar-day-radius: var(--radius-md);
350
+ --calendar-day-radius: initial;
334
351
  --calendar-chevron-size: var(--icon-size-md);
335
352
  --calendar-footer-space-gap: var(--space-2);
336
353
  --calendar-footer-space-block-start: var(--space-2);
@@ -341,7 +358,7 @@
341
358
  --calendar-grid-border-color: initial;
342
359
 
343
360
  --transfer-pane-min-height: 14rem;
344
- --transfer-pane-radius: var(--radius-md);
361
+ --transfer-pane-radius: initial;
345
362
  --transfer-panes-space-gap: var(--space-3);
346
363
  --transfer-header-space-inline: var(--space-3);
347
364
  --transfer-header-space-block: var(--space-2);
@@ -352,7 +369,7 @@
352
369
  --transfer-row-space-inline: var(--space-2);
353
370
  --transfer-row-space-block: var(--space-2);
354
371
  --transfer-row-space-gap: var(--space-2);
355
- --transfer-row-radius: var(--radius-sm);
372
+ --transfer-row-radius: initial;
356
373
  --transfer-row-font-size: var(--font-size-sm, var(--font-size-base));
357
374
 
358
375
  --transfer-row-check-space-block-start: 0.125rem;
@@ -418,6 +435,7 @@
418
435
 
419
436
  --control-surface-border-color: initial;
420
437
  --control-surface-background: initial;
438
+ --control-surface-background-alpha: initial;
421
439
 
422
440
  --control-filled-border-color: transparent;
423
441
  --control-filled-background: initial;
@@ -8,7 +8,7 @@
8
8
  --conversations-item-height: var(--band-height-md);
9
9
  --conversations-item-gap: var(--space-inline-sm);
10
10
  --conversations-item-padding-inline: var(--space-inline-sm);
11
- --conversations-item-radius: var(--radius);
11
+ --conversations-item-radius: initial;
12
12
  --conversations-item-font-size: var(
13
13
  --font-size-xs,
14
14
  calc(var(--font-size-base) / var(--font-size-ratio))
@@ -16,6 +16,7 @@
16
16
 
17
17
  --conversations-item-color: initial;
18
18
  --conversations-item-active-background: initial;
19
+ --conversations-item-active-background-alpha: initial;
19
20
  --conversations-item-active-color: initial;
20
21
  --conversations-item-active-font-weight: var(--font-weight-medium);
21
22
 
@@ -5,6 +5,9 @@
5
5
  --accordion-chevron-size: var(--icon-size-md);
6
6
  --carousel-arrow-icon-size: var(--icon-size-md);
7
7
 
8
+ --carousel-arrow-inset-block-start: initial;
9
+ --carousel-dots-block-size: 0px;
10
+
8
11
  --accordion-focus-ring-offset: 2px;
9
12
  --carousel-dot-focus-ring-offset: 2px;
10
13
  --progress-label-font-size: var(
@@ -19,7 +22,7 @@
19
22
  );
20
23
  --code-block-line-height: var(--line-height-normal);
21
24
  --code-block-space-inset: var(--space-3);
22
- --code-block-radius: var(--radius-md);
25
+ --code-block-radius: initial;
23
26
  --code-block-max-height-sm: 12rem;
24
27
  --code-block-max-height-md: 20rem;
25
28
  --code-block-max-height-lg: 32rem;
@@ -50,18 +53,19 @@
50
53
  --prose-quote-space-inline: var(--space-3);
51
54
  --prose-code-font-size: calc(1em / var(--font-size-ratio));
52
55
  --prose-code-space-inline: var(--space-1);
53
- --prose-code-radius: var(--radius-sm);
56
+ --prose-code-radius: initial;
54
57
 
55
58
  --prose-link-color: initial;
56
59
 
57
60
  --prose-link-decoration-line: underline;
58
- --prose-image-radius: var(--radius-md);
61
+ --prose-image-radius: initial;
59
62
  --timeline-note-font-size: var(
60
63
  --font-size-xs,
61
64
  calc(var(--font-size-base) / var(--font-size-ratio))
62
65
  );
63
66
 
64
67
  --avatar-background: initial;
68
+ --avatar-background-alpha: initial;
65
69
 
66
70
  --avatar-tint: transparent;
67
71
 
@@ -93,7 +97,7 @@
93
97
 
94
98
  --avatar-glyph-size-lg: calc(var(--icon-size-lg) * var(--scaling));
95
99
 
96
- --avatar-square-radius: var(--radius-lg);
100
+ --avatar-square-radius: initial;
97
101
  --avatar-square-size: var(--control-height);
98
102
  --avatar-square-background: initial;
99
103
  --avatar-square-foreground: initial;
@@ -116,10 +120,11 @@
116
120
  --avatar-presence-offline-color: initial;
117
121
 
118
122
  --progress-track-background: initial;
123
+ --progress-track-background-alpha: initial;
119
124
  --progress-fill-background: initial;
120
125
 
121
126
  --progress-breakdown-block-size: 1.375rem;
122
- --progress-breakdown-radius: var(--radius);
127
+ --progress-breakdown-radius: initial;
123
128
 
124
129
  --progress-meter-block-size: 0.5rem;
125
130
  --progress-meter-block-size-sm: 0.25rem;
@@ -163,7 +168,7 @@
163
168
  --thumbnail-block-size: 6rem;
164
169
  --thumbnail-block-size-lg: 10rem;
165
170
  --thumbnail-border-width: var(--stroke-hairline);
166
- --thumbnail-radius: var(--radius);
171
+ --thumbnail-radius: initial;
167
172
 
168
173
  --timeline-dot-done-background: initial;
169
174
  --timeline-dot-done-foreground: initial;
@@ -198,7 +203,7 @@
198
203
  );
199
204
  --timeline-grid-event-gap: var(--space-1);
200
205
  --timeline-grid-event-space-inset: var(--space-1);
201
- --timeline-grid-event-radius: var(--radius-sm);
206
+ --timeline-grid-event-radius: initial;
202
207
  --timeline-grid-event-border-width: var(--stroke-md);
203
208
  --timeline-grid-now-width: var(--stroke-sm);
204
209
 
@@ -22,7 +22,7 @@
22
22
  --descriptions-row-min-height: auto;
23
23
 
24
24
  --descriptions-border-width: var(--stroke-hairline);
25
- --descriptions-border-radius: var(--radius-md);
25
+ --descriptions-border-radius: initial;
26
26
 
27
27
  --descriptions-cell-padding-y: var(--space-2);
28
28
  --descriptions-cell-padding-x: var(--space-3);
@@ -18,7 +18,7 @@
18
18
  --draggable-panel-block-size: auto;
19
19
  --draggable-panel-max-block-size: 70vh;
20
20
 
21
- --draggable-panel-radius: var(--radius-lg);
21
+ --draggable-panel-radius: initial;
22
22
  --draggable-panel-shadow: var(--shadow-lg);
23
23
  --draggable-panel-border-width: var(--stroke-hairline);
24
24
 
@@ -4,9 +4,14 @@
4
4
  --sheet-width-default: 22.5rem;
5
5
 
6
6
  --sheet-overlay-background: initial;
7
+
7
8
  --sheet-overlay-alpha: 40%;
8
9
 
9
- --sheet-shadow: var(--shadow-lg);
10
+ --sheet-overlay-backdrop-blur-size: initial;
11
+
12
+ --sheet-surface-background: initial;
13
+
14
+ --sheet-shadow: initial;
10
15
  --sheet-header-space-gap: 0.375rem;
11
16
  --sheet-title-block-space-gap: var(--space-1);
12
17
  --sheet-title-row-space-gap: var(--space-3);
@@ -26,8 +31,13 @@
26
31
  --dialog-width-default: 32rem;
27
32
  --dialog-viewport-inset: 1.5rem;
28
33
  --dialog-overlay-background: initial;
34
+
29
35
  --dialog-overlay-alpha: 60%;
30
36
 
37
+ --dialog-overlay-backdrop-blur-size: initial;
38
+
39
+ --dialog-surface-background: initial;
40
+
31
41
  --dialog-space-x: var(--space-chrome-x);
32
42
  --dialog-space-y: var(--space-chrome-y);
33
43
  --dialog-space-inset: var(--dialog-space-y) var(--dialog-space-x);
@@ -50,7 +60,7 @@
50
60
 
51
61
  --dialog-step-up-error-font-size: var(--font-size-sm, var(--font-size-base));
52
62
 
53
- --alert-radius: var(--card-radius);
63
+ --alert-radius: initial;
54
64
  --alert-space-inset: var(--space-section-active);
55
65
  --alert-space-gap: var(--space-inline-md);
56
66
  --alert-inner-space-gap: var(--space-stack-sm);
@@ -90,7 +100,7 @@
90
100
  --skeleton-row-gap: var(--space-stack-sm);
91
101
  --skeleton-cell-gap: var(--space-inline-lg);
92
102
  --skeleton-card-inset: var(--space-section-active);
93
- --skeleton-radius: var(--radius);
103
+ --skeleton-radius: initial;
94
104
 
95
105
  --skeleton-background: initial;
96
106
 
@@ -102,7 +112,7 @@
102
112
  --skeleton-stat-value-width: 8rem;
103
113
  --skeleton-stat-caption-width: 5rem;
104
114
 
105
- --skeleton-element-radius: var(--radius-sm);
115
+ --skeleton-element-radius: initial;
106
116
  --skeleton-button-width-ratio: 2;
107
117
  --skeleton-input-width-ratio: 5;
108
118
 
@@ -126,29 +136,39 @@
126
136
  --tooltip-max-width: 20rem;
127
137
  --tooltip-space-inline: var(--space-2);
128
138
  --tooltip-space-block: var(--space-1);
129
- --tooltip-radius: var(--radius);
139
+ --tooltip-radius: initial;
130
140
  --tooltip-font-size: var(--font-size-xs, calc(var(--font-size-base) / var(--font-size-ratio)));
131
141
 
132
- --tooltip-shadow: var(--shadow-md);
142
+ --tooltip-shadow: initial;
143
+
144
+ --tooltip-backdrop-blur-size: initial;
133
145
 
134
146
  --tooltip-background: initial;
135
147
  --tooltip-foreground: initial;
136
148
  --tooltip-border-color: initial;
149
+ --tooltip-border-color-alpha: initial;
137
150
 
138
151
  --popover-width: 18rem;
139
152
  --popover-space-inset: var(--space-4);
140
- --popover-radius: var(--radius);
141
- --popover-shadow: var(--shadow-md);
153
+ --popover-radius: initial;
154
+
155
+ --popover-shadow: initial;
156
+
157
+ --popover-backdrop-blur-size: initial;
142
158
  --popover-header-space-gap: var(--space-1);
143
159
  --popover-header-font-size: var(--font-size-sm, var(--font-size-base));
144
160
 
145
161
  --popover-surface-background: initial;
146
162
  --popover-surface-foreground: initial;
147
163
  --popover-surface-border-color: initial;
164
+ --popover-surface-border-color-alpha: initial;
148
165
 
149
166
  --popover-surface-inline-size: initial;
150
167
 
151
168
  --toast-icon-size: var(--icon-size-md);
152
169
 
170
+ --toast-background: initial;
171
+ --toast-backdrop-blur-size: initial;
172
+
153
173
  --toast-mobile-offset: 16px;
154
174
  }
@@ -22,7 +22,7 @@
22
22
  --float-button-shadow: var(--shadow-lg);
23
23
 
24
24
  --float-button-group-gap: var(--space-stack-md);
25
- --float-button-group-radius: var(--radius-lg);
25
+ --float-button-group-radius: initial;
26
26
 
27
27
  --float-button-badge-background: initial;
28
28
  --float-button-badge-foreground: hsl(var(--destructive-foreground));
@@ -13,7 +13,7 @@
13
13
  --legal-document-toc-max-height: calc(100dvh - var(--space-12));
14
14
  --legal-document-toc-gap: var(--space-1);
15
15
  --legal-document-toc-item-padding: var(--space-1) var(--space-2);
16
- --legal-document-toc-item-radius: var(--radius);
16
+ --legal-document-toc-item-radius: initial;
17
17
  --legal-document-toc-title-font-size: var(
18
18
  --font-size-2xs,
19
19
  calc(var(--font-size-base) / var(--font-size-ratio) / var(--font-size-ratio))
@@ -1,6 +1,6 @@
1
1
 
2
2
  :root {
3
- --logo-radius: var(--radius);
3
+ --logo-radius: initial;
4
4
  --logo-size-xs: 1.25rem;
5
5
  --logo-size-sm: 1.5rem;
6
6
  --logo-size-md: 1.75rem;
@@ -6,12 +6,13 @@
6
6
  --mega-menu-trigger-height: var(--control-height);
7
7
  --mega-menu-trigger-padding-x: var(--space-3);
8
8
  --mega-menu-trigger-gap: var(--space-inline-sm);
9
- --mega-menu-trigger-radius: var(--radius-sm);
9
+ --mega-menu-trigger-radius: initial;
10
10
  --mega-menu-trigger-font-size: var(--font-size-sm, var(--font-size-base));
11
11
  --mega-menu-trigger-foreground: hsl(var(--foreground));
12
12
  --mega-menu-trigger-background: transparent;
13
13
 
14
14
  --mega-menu-trigger-hover-background: initial;
15
+ --mega-menu-trigger-hover-background-alpha: initial;
15
16
  --mega-menu-trigger-hover-foreground: initial;
16
17
  --mega-menu-trigger-open-background: initial;
17
18
  --mega-menu-trigger-open-foreground: initial;
@@ -23,7 +24,7 @@
23
24
  --mega-menu-panel-foreground: hsl(var(--popover-foreground));
24
25
  --mega-menu-panel-border-color: hsl(var(--border));
25
26
  --mega-menu-panel-border-width: 1px;
26
- --mega-menu-panel-radius: var(--radius-md);
27
+ --mega-menu-panel-radius: initial;
27
28
  --mega-menu-panel-padding: var(--space-6);
28
29
  --mega-menu-panel-shadow: var(--shadow-md);
29
30
  --mega-menu-panel-offset: 0px;
@@ -51,10 +52,11 @@
51
52
  --mega-menu-link-gap: var(--space-inline-sm);
52
53
  --mega-menu-link-padding-x: var(--space-2);
53
54
  --mega-menu-link-padding-y: var(--space-2);
54
- --mega-menu-link-radius: var(--radius-sm);
55
+ --mega-menu-link-radius: initial;
55
56
  --mega-menu-link-font-size: var(--font-size-sm, var(--font-size-base));
56
57
  --mega-menu-link-foreground: hsl(var(--foreground));
57
58
  --mega-menu-link-hover-background: initial;
59
+ --mega-menu-link-hover-background-alpha: initial;
58
60
  --mega-menu-link-hover-foreground: initial;
59
61
  --mega-menu-link-current-foreground: initial;
60
62
  --mega-menu-link-description-font-size: var(
@@ -53,6 +53,11 @@
53
53
  --tabs-list-max-inline-size: 100%;
54
54
  --tabs-list-overflow: auto;
55
55
 
56
+ --tabs-list-background: initial;
57
+ --tabs-list-background-alpha: initial;
58
+ --tabs-trigger-active-background: initial;
59
+ --tabs-trigger-active-background-alpha: initial;
60
+
56
61
  --tabs-placement-responsive-breakpoint-width: 48rem;
57
62
 
58
63
  --tabs-indicator-background: initial;
@@ -92,13 +97,17 @@
92
97
  --tabs-card-list-radius: 0px;
93
98
  --tabs-card-list-space-inset: 0px;
94
99
  --tabs-card-list-space-gap: var(--space-1);
95
- --tabs-card-radius: var(--radius-md);
100
+
101
+ --tabs-card-radius: var(--radius-md, calc(var(--radius) / var(--radius-ratio)));
96
102
  --tabs-card-rail-border-width: var(--stroke-hairline);
97
103
  --tabs-card-background: initial;
104
+ --tabs-card-background-alpha: initial;
98
105
 
99
106
  --tabs-panel-background: initial;
107
+ --tabs-panel-background-alpha: initial;
100
108
  --tabs-panel-border-width: var(--tabs-card-rail-border-width);
101
- --tabs-panel-radius: var(--tabs-card-radius);
109
+
110
+ --tabs-panel-radius: initial;
102
111
  --tabs-panel-space-inset: var(--space-4);
103
112
 
104
113
  --tabs-count-min-width: var(--space-4);
@@ -111,6 +120,7 @@
111
120
  --tabs-count-card-background: initial;
112
121
  --tabs-count-color: initial;
113
122
  --tabs-count-active-background: initial;
123
+ --tabs-count-active-background-alpha: initial;
114
124
  --tabs-count-active-color: initial;
115
125
  --tabs-count-forced-outline-width: var(--stroke-hairline);
116
126
 
@@ -118,18 +128,19 @@
118
128
  --tabs-extra-gap: var(--space-2);
119
129
 
120
130
  --tabs-overflow-size: var(--band-height-md);
121
- --tabs-overflow-radius: var(--radius-md);
131
+ --tabs-overflow-radius: initial;
122
132
  --tabs-overflow-icon-size: var(--control-icon-size);
123
133
  --tabs-add-size: var(--band-height-md);
124
- --tabs-add-radius: var(--radius-md);
134
+ --tabs-add-radius: initial;
125
135
  --tabs-add-icon-size: var(--control-icon-size);
126
136
  --tabs-trigger-icon-size: var(--control-icon-size);
127
137
  --tabs-tab-remove-size: var(--band-height-xs);
128
- --tabs-tab-remove-radius: var(--radius-sm);
138
+ --tabs-tab-remove-radius: initial;
129
139
  --tabs-tab-remove-icon-size: var(--icon-size-xs);
130
140
  --tabs-tab-remove-space-inline-end: var(--space-1);
131
141
 
132
142
  --menu-item-hover-background: initial;
143
+ --menu-item-hover-background-alpha: initial;
133
144
  --menu-item-hover-foreground: initial;
134
145
 
135
146
  --filter-bar-sticky-offset: 0px;
@@ -144,7 +155,7 @@
144
155
  --filter-bar-section-gap: var(--space-2);
145
156
 
146
157
  --menu-item-height: var(--band-height-md);
147
- --menu-item-radius: var(--radius-sm);
158
+ --menu-item-radius: initial;
148
159
  --menu-item-space-inline: var(--space-2);
149
160
  --menu-item-space-gap: var(--space-2);
150
161
  --menu-item-font-size: var(--font-size-base);
@@ -158,6 +169,9 @@
158
169
 
159
170
  --dropdown-content-min-width: 8rem;
160
171
 
172
+ --dropdown-content-background: initial;
173
+ --dropdown-content-backdrop-blur-size: initial;
174
+
161
175
  --menu-content-width-sm: 12rem;
162
176
  --menu-content-width-md: 16rem;
163
177
  --menu-content-width-lg: 20rem;
@@ -196,7 +210,7 @@
196
210
  --steps-nav-space-gap: var(--space-2);
197
211
  --steps-nav-space-inline: var(--space-4);
198
212
  --steps-nav-space-block: var(--space-3);
199
- --steps-nav-radius: var(--radius-md);
213
+ --steps-nav-radius: initial;
200
214
  --steps-nav-separator-size: var(--control-icon-size-sm);
201
215
 
202
216
  --steps-progress-ring-width: var(--stroke-md);
@@ -5,9 +5,10 @@
5
5
  --segmented-track-padding: calc(var(--space-1) / 2);
6
6
 
7
7
  --segmented-track-background: initial;
8
+ --segmented-track-background-alpha: initial;
8
9
 
9
- --segmented-track-radius: var(--radius);
10
- --segmented-item-radius: var(--radius-md);
10
+ --segmented-track-radius: initial;
11
+ --segmented-item-radius: initial;
11
12
 
12
13
  --segmented-item-padding-inline: calc(var(--control-padding-x) - 1px);
13
14
 
@@ -25,10 +26,14 @@
25
26
  --segmented-item-selected-color: var(--foreground);
26
27
 
27
28
  --segmented-item-hover-background: initial;
29
+ --segmented-item-hover-background-alpha: initial;
28
30
  --segmented-item-active-background: var(--secondary);
31
+ --segmented-item-active-background-alpha: 100%;
29
32
 
30
33
  --segmented-item-selected-background: initial;
31
- --segmented-item-selected-shadow: var(--shadow-md);
34
+ --segmented-item-selected-background-alpha: initial;
35
+
36
+ --segmented-item-selected-shadow: initial;
32
37
 
33
38
  --segmented-item-selected-font-weight: var(--font-weight-medium);
34
39
 
@@ -57,6 +57,8 @@
57
57
  --font-size-xs,
58
58
  calc(var(--font-size-base) / var(--font-size-ratio))
59
59
  );
60
+
61
+ --sidebar-logo-mark-color: initial;
60
62
  --sidebar-avatar-font-size: var(
61
63
  --font-size-2xs,
62
64
  calc(var(--font-size-base) / var(--font-size-ratio) / var(--font-size-ratio))
@@ -69,6 +71,16 @@
69
71
  --sidebar-gradient: none;
70
72
  --topbar-gradient: none;
71
73
 
74
+ --sidebar-surface-background: initial;
75
+ --sidebar-surface-background-alpha: initial;
76
+
77
+ --sidebar-backdrop-blur-size: initial;
78
+
79
+ --app-shell-bar-background: initial;
80
+
81
+ --app-shell-bar-backdrop-blur-size: initial;
82
+ --app-shell-nav-rail-background: initial;
83
+
72
84
  --app-shell-viewport-inset: 0px;
73
85
  --app-shell-bar-height: var(--band-height-2xl);
74
86
 
@@ -125,7 +137,7 @@
125
137
  --sidebar-nav-item-padding-x: 0.625rem;
126
138
  --sidebar-nav-gap: 2px;
127
139
 
128
- --sidebar-nav-item-radius: calc(var(--radius) - 1px);
140
+ --sidebar-nav-item-radius: initial;
129
141
  --sidebar-nav-scroll-padding: var(--space-3) var(--space-2);
130
142
  --sidebar-section-gap: var(--space-4);
131
143
  --sidebar-section-label-padding-x: var(--space-2);
@@ -153,6 +165,7 @@
153
165
  --topbar-item-color: var(--muted-foreground);
154
166
 
155
167
  --topbar-item-hover-background: initial;
168
+ --topbar-item-hover-background-alpha: initial;
156
169
  --topbar-item-hover-color: initial;
157
170
  --topbar-item-active-background: var(--secondary);
158
171
 
@@ -204,14 +217,15 @@
204
217
  --app-launcher-tile-padding: var(--space-2);
205
218
 
206
219
  --app-launcher-tile-min-height: var(--control-height-comfortable);
207
- --app-launcher-tile-radius: var(--radius);
220
+ --app-launcher-tile-radius: initial;
208
221
  --app-launcher-tile-color: var(--foreground);
209
222
  --app-launcher-tile-hover-background: initial;
223
+ --app-launcher-tile-hover-background-alpha: initial;
210
224
  --app-launcher-tile-hover-color: initial;
211
225
 
212
226
  --app-launcher-tile-current-background: initial;
213
227
  --app-launcher-mark-size: 2.5rem;
214
- --app-launcher-mark-radius: var(--radius);
228
+ --app-launcher-mark-radius: initial;
215
229
  --app-launcher-mark-background: var(--secondary);
216
230
  --app-launcher-mark-foreground: var(--secondary-foreground);
217
231
  --app-launcher-mark-font-size: var(--font-size-sm, var(--font-size-base));
@@ -239,7 +253,7 @@
239
253
  --app-launcher-launchpad-grid-gap: var(--space-6);
240
254
  --app-launcher-launchpad-tile-inline-size: 7.5rem;
241
255
  --app-launcher-launchpad-tile-padding: var(--space-3);
242
- --app-launcher-launchpad-tile-radius: var(--radius-lg);
256
+ --app-launcher-launchpad-tile-radius: initial;
243
257
  --app-launcher-launchpad-tile-gap: var(--space-3);
244
258
  --app-launcher-launchpad-tile-hover-background: color-mix(
245
259
  in srgb,
@@ -247,7 +261,7 @@
247
261
  transparent
248
262
  );
249
263
  --app-launcher-launchpad-mark-size: 4rem;
250
- --app-launcher-launchpad-mark-radius: var(--radius-lg);
264
+ --app-launcher-launchpad-mark-radius: initial;
251
265
 
252
266
  --app-launcher-launchpad-mark-background: color-mix(in srgb, hsl(var(--card)) 78%, transparent);
253
267
  --app-launcher-launchpad-mark-border-color: color-mix(
@@ -21,8 +21,14 @@
21
21
  --table-head-font-weight: var(--font-weight-medium);
22
22
 
23
23
  --table-header-background: initial;
24
+ --table-header-background-alpha: initial;
24
25
  --table-header-foreground: initial;
25
26
 
27
+ --table-surface-background: initial;
28
+ --table-surface-background-alpha: initial;
29
+
30
+ --table-surface-backdrop-blur-size: initial;
31
+
26
32
  --table-pin-shadow: -6px 0 6px -5px hsl(var(--foreground) / 0.12);
27
33
 
28
34
  --table-fixed-shadow-start: 6px 0 6px -5px hsl(var(--foreground) / 0.12);
@@ -41,7 +47,9 @@
41
47
 
42
48
  --table-row-striped-alpha: 0%;
43
49
  --table-row-hover-background: initial;
50
+ --table-row-hover-background-alpha: initial;
44
51
  --table-row-selected-background: initial;
52
+ --table-row-selected-background-alpha: initial;
45
53
  }
46
54
 
47
55
  :root {
@@ -91,7 +99,7 @@
91
99
 
92
100
  --table-skeleton-line-block-size: 1rem;
93
101
  --table-skeleton-line-height: var(--table-skeleton-line-block-size);
94
- --table-skeleton-radius: var(--radius-sm);
102
+ --table-skeleton-radius: initial;
95
103
 
96
104
  --table-font-size: var(--font-size-sm, var(--font-size-base));
97
105
 
@@ -28,7 +28,7 @@
28
28
  --thought-chain-item-gap: var(--space-2);
29
29
  --thought-chain-item-padding-block: var(--space-2);
30
30
  --thought-chain-item-padding-inline: var(--space-3);
31
- --thought-chain-item-radius: var(--radius);
31
+ --thought-chain-item-radius: initial;
32
32
  --thought-chain-item-solid-background: initial;
33
33
  --thought-chain-item-outlined-border: initial;
34
34
  }
@@ -22,9 +22,11 @@
22
22
  --toggle-soft-count-color: initial;
23
23
 
24
24
  --toggle-pressed-count-background: initial;
25
+ --toggle-pressed-count-background-alpha: initial;
25
26
  --toggle-pressed-count-color: initial;
26
27
 
27
28
  --toggle-pressed-border-color: initial;
29
+ --toggle-pressed-border-color-alpha: initial;
28
30
 
29
31
  --toggle-count-forced-outline-width: var(--stroke-hairline);
30
32
  }