@godxjp/ui 33.19.0 → 33.21.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.
- package/README.md +4 -4
- package/agent/START-HERE.md +7 -7
- package/agent/components/AppSettingPicker.json +0 -1
- package/agent/components/AppShell.json +11 -1
- package/agent/components/CardShowcase.json +44 -0
- package/agent/components/CatalogCard.json +83 -0
- package/agent/components/CatalogDetail.json +76 -0
- package/agent/components/CatalogDetailSection.json +52 -0
- package/agent/components/CatalogDetailTag.json +27 -0
- package/agent/components/Descriptions.json +6 -0
- package/agent/components/EditorialArticle.json +53 -0
- package/agent/components/EditorialAuth.json +53 -0
- package/agent/components/EditorialAuthCard.json +52 -0
- package/agent/components/EditorialBanner.json +53 -0
- package/agent/components/EditorialBreadcrumb.json +38 -0
- package/agent/components/EditorialCard.json +70 -0
- package/agent/components/EditorialEmptyPanel.json +57 -0
- package/agent/components/EditorialFilterBar.json +51 -0
- package/agent/components/EditorialFilterField.json +39 -0
- package/agent/components/EditorialFilterPanel.json +46 -0
- package/agent/components/EditorialFooter.json +54 -0
- package/agent/components/EditorialFootnote.json +36 -0
- package/agent/components/EditorialHero.json +52 -0
- package/agent/components/EditorialInlineSearch.json +54 -0
- package/agent/components/EditorialMasthead.json +52 -0
- package/agent/components/EditorialMetaBar.json +37 -0
- package/agent/components/EditorialPageHeader.json +73 -0
- package/agent/components/EditorialPanel.json +48 -0
- package/agent/components/EditorialPillNav.json +41 -0
- package/agent/components/EditorialPrompt.json +54 -0
- package/agent/components/EditorialSearch.json +112 -0
- package/agent/components/EditorialSection.json +68 -0
- package/agent/components/EditorialSectionHead.json +62 -0
- package/agent/components/EditorialStats.json +32 -0
- package/agent/components/EditorialTextButton.json +47 -0
- package/agent/components/EditorialToggleGroup.json +52 -0
- package/agent/components/EditorialToolbar.json +45 -0
- package/agent/components/Eyebrow.json +39 -0
- package/agent/components/HoldingCard.json +69 -0
- package/agent/components/HoldingCardAction.json +51 -0
- package/agent/components/HoldingGrid.json +37 -0
- package/agent/components/NumberInput.json +5 -0
- package/agent/components/PriceSummary.json +32 -0
- package/agent/components/SettingsLayout.json +31 -0
- package/agent/components/SettingsPanel.json +53 -0
- package/agent/components/Tabs.json +2 -2
- package/agent/components/ThemePicker.json +54 -0
- package/agent/components/TopbarItem.json +5 -0
- package/agent/components-index.json +292 -98
- package/agent/components.json +2054 -4
- package/agent/index.json +7 -7
- package/agent/llms.txt +8 -8
- package/agent/tokens.json +5646 -126
- package/dist/components/data-display/badge.js +4 -2
- package/dist/components/data-display/descriptions.d.ts +5 -1
- package/dist/components/data-display/descriptions.js +21 -9
- package/dist/components/data-entry/form-field.js +2 -2
- package/dist/components/data-entry/number-input.d.ts +1 -0
- package/dist/components/data-entry/number-input.js +8 -0
- package/dist/components/data-entry/select.js +24 -2
- package/dist/components/data-entry/toggle.d.ts +2 -1
- package/dist/components/data-entry/toggle.js +12 -2
- package/dist/components/general/button.js +7 -0
- package/dist/components/general/typography.d.ts +1 -1
- package/dist/components/layout/app-shell.d.ts +1 -1
- package/dist/components/layout/app-shell.js +28 -2
- package/dist/components/layout/centered-shell.js +4 -0
- package/dist/components/layout/editorial-account.d.ts +51 -0
- package/dist/components/layout/editorial-account.js +466 -0
- package/dist/components/layout/editorial-catalog.d.ts +18 -0
- package/dist/components/layout/editorial-catalog.js +164 -0
- package/dist/components/layout/editorial.d.ts +56 -0
- package/dist/components/layout/editorial.js +867 -0
- package/dist/components/layout/index.d.ts +6 -0
- package/dist/components/layout/index.js +98 -0
- package/dist/components/layout/mobile-shell.d.ts +2 -0
- package/dist/components/layout/mobile-shell.js +18 -11
- package/dist/components/layout/responsive-grid.js +9 -1
- package/dist/components/layout/topbar-item.d.ts +1 -0
- package/dist/components/layout/topbar-item.js +2 -0
- package/dist/components/navigation/tabs.d.ts +1 -1
- package/dist/components/navigation/tabs.js +17 -5
- package/dist/contracts/measurement.json +1 -1
- package/dist/lib/toast-clearance.js +1 -1
- package/dist/props/components/data-display.prop.d.ts +3 -1
- package/dist/props/components/data-entry.prop.d.ts +9 -0
- package/dist/props/components/editorial-account.prop.d.ts +249 -0
- package/dist/props/components/editorial-account.prop.js +0 -0
- package/dist/props/components/general.prop.d.ts +6 -2
- package/dist/props/components/layout.prop.d.ts +602 -2
- package/dist/props/components/navigation.prop.d.ts +2 -0
- package/dist/props/registry.d.ts +1140 -8
- package/dist/props/registry.js +805 -1
- package/dist/styles/badge-layout.css +2 -0
- package/dist/styles/control.css +58 -12
- package/dist/styles/core.css +1 -0
- package/dist/styles/data-display-layout.css +39 -3
- package/dist/styles/editorial-account-layout.css +1130 -0
- package/dist/styles/focus-ring.css +33 -10
- package/dist/styles/form-layout.css +8 -1
- package/dist/styles/index.css +1 -0
- package/dist/styles/layers.json +248 -1
- package/dist/styles/layout.css +2022 -0
- package/dist/styles/navigation-layout.css +5 -0
- package/dist/styles/shell-layout.css +100 -2
- package/dist/styles/table-layout.css +25 -13
- package/dist/styles/text-layout.css +6 -0
- package/dist/styles.css +1 -1
- package/dist/tokens/base.css +2 -0
- package/dist/tokens/components/badge.css +3 -0
- package/dist/tokens/components/control.css +9 -0
- package/dist/tokens/components/descriptions.css +2 -0
- package/dist/tokens/components/editorial-account.css +393 -0
- package/dist/tokens/components/editorial.css +721 -0
- package/dist/tokens/components/form.css +4 -0
- package/dist/tokens/components/navigation.css +2 -0
- package/dist/tokens/components/shell.css +23 -0
- package/dist/tokens/components/table.css +1 -1
- package/docs/TOKENS.md +26 -0
- package/package.json +2 -2
- package/scripts/ui-audit.mjs +3 -2
|
@@ -16,6 +16,8 @@
|
|
|
16
16
|
gap: var(--badge-space-gap);
|
|
17
17
|
padding: var(--badge-space-y) var(--badge-space-x);
|
|
18
18
|
|
|
19
|
+
min-block-size: var(--badge-min-height, auto);
|
|
20
|
+
|
|
19
21
|
border-radius: var(--badge-radius, calc(var(--radius) / var(--radius-ratio)));
|
|
20
22
|
border-width: var(--stroke-hairline);
|
|
21
23
|
font-size: var(--badge-font-size);
|
package/dist/styles/control.css
CHANGED
|
@@ -104,9 +104,9 @@
|
|
|
104
104
|
align-items: center;
|
|
105
105
|
justify-content: center;
|
|
106
106
|
cursor: pointer;
|
|
107
|
-
gap: var(--control-gap);
|
|
107
|
+
gap: var(--button-gap, var(--control-gap));
|
|
108
108
|
white-space: nowrap;
|
|
109
|
-
font-weight: var(--font-weight
|
|
109
|
+
font-weight: var(--button-font-weight);
|
|
110
110
|
transition-property: color, background-color, border-color, box-shadow;
|
|
111
111
|
transition-duration: 150ms;
|
|
112
112
|
}
|
|
@@ -132,8 +132,8 @@
|
|
|
132
132
|
}
|
|
133
133
|
|
|
134
134
|
.ui-button svg {
|
|
135
|
-
width: var(--control-icon-size);
|
|
136
|
-
height: var(--control-icon-size);
|
|
135
|
+
width: var(--button-icon-size, var(--control-icon-size));
|
|
136
|
+
height: var(--button-icon-size, var(--control-icon-size));
|
|
137
137
|
flex-shrink: 0;
|
|
138
138
|
}
|
|
139
139
|
|
|
@@ -184,7 +184,8 @@
|
|
|
184
184
|
--button-outline-background,
|
|
185
185
|
hsl(var(--background) / var(--button-outline-background-alpha, 100%))
|
|
186
186
|
);
|
|
187
|
-
|
|
187
|
+
|
|
188
|
+
color: var(--button-outline-foreground, hsl(var(--foreground)));
|
|
188
189
|
|
|
189
190
|
box-shadow: var(--shadow-sm);
|
|
190
191
|
}
|
|
@@ -247,8 +248,8 @@
|
|
|
247
248
|
|
|
248
249
|
.ui-button--default-size {
|
|
249
250
|
height: var(--control-height);
|
|
250
|
-
padding-inline: var(--
|
|
251
|
-
font-size: var(--font-size
|
|
251
|
+
padding-inline: var(--button-padding-inline);
|
|
252
|
+
font-size: var(--button-font-size);
|
|
252
253
|
}
|
|
253
254
|
|
|
254
255
|
.ui-button--sm {
|
|
@@ -1796,6 +1797,19 @@
|
|
|
1796
1797
|
--control-height: var(--control-height-lg);
|
|
1797
1798
|
}
|
|
1798
1799
|
|
|
1800
|
+
.ui-number-input[data-width="auto"] {
|
|
1801
|
+
font-size: var(--control-font-size);
|
|
1802
|
+
inline-size: calc(
|
|
1803
|
+
var(--number-input-chars, 6) * 1ch + var(--control-padding-x) + var(--control-height) +
|
|
1804
|
+
var(--space-2) + 2px
|
|
1805
|
+
);
|
|
1806
|
+
max-inline-size: 100%;
|
|
1807
|
+
}
|
|
1808
|
+
.ui-number-input[data-width="bounded"] {
|
|
1809
|
+
inline-size: var(--control-bounded-width);
|
|
1810
|
+
max-inline-size: 100%;
|
|
1811
|
+
}
|
|
1812
|
+
|
|
1799
1813
|
.ui-number-input-field {
|
|
1800
1814
|
inline-size: 100%;
|
|
1801
1815
|
text-align: end;
|
|
@@ -2001,6 +2015,25 @@
|
|
|
2001
2015
|
gap: var(--search-select-option-space-gap);
|
|
2002
2016
|
}
|
|
2003
2017
|
|
|
2018
|
+
.ui-select-option-body {
|
|
2019
|
+
display: inline-flex;
|
|
2020
|
+
min-inline-size: 0;
|
|
2021
|
+
align-items: center;
|
|
2022
|
+
gap: var(--search-select-option-space-gap);
|
|
2023
|
+
}
|
|
2024
|
+
|
|
2025
|
+
.ui-select-option-icon {
|
|
2026
|
+
display: inline-flex;
|
|
2027
|
+
flex: none;
|
|
2028
|
+
align-items: center;
|
|
2029
|
+
}
|
|
2030
|
+
|
|
2031
|
+
.ui-select-option-label {
|
|
2032
|
+
min-inline-size: 0;
|
|
2033
|
+
overflow: hidden;
|
|
2034
|
+
text-overflow: ellipsis;
|
|
2035
|
+
}
|
|
2036
|
+
|
|
2004
2037
|
.ui-search-select-values {
|
|
2005
2038
|
display: flex;
|
|
2006
2039
|
min-inline-size: 0;
|
|
@@ -3266,20 +3299,20 @@
|
|
|
3266
3299
|
padding-block: var(--button-space-block);
|
|
3267
3300
|
}
|
|
3268
3301
|
|
|
3269
|
-
.ui-button--default-size:has(> svg),
|
|
3270
|
-
.ui-button--md:has(> svg) {
|
|
3302
|
+
.ui-button--default-size:has(> svg):not([data-label]),
|
|
3303
|
+
.ui-button--md:has(> svg):not([data-label]) {
|
|
3271
3304
|
padding-inline: var(--button-icon-space-inline-md);
|
|
3272
3305
|
}
|
|
3273
3306
|
|
|
3274
|
-
.ui-button--sm:has(> svg) {
|
|
3307
|
+
.ui-button--sm:has(> svg):not([data-label]) {
|
|
3275
3308
|
padding-inline: var(--button-icon-space-inline-sm);
|
|
3276
3309
|
}
|
|
3277
3310
|
|
|
3278
|
-
.ui-button--lg:has(> svg) {
|
|
3311
|
+
.ui-button--lg:has(> svg):not([data-label]) {
|
|
3279
3312
|
padding-inline: var(--button-icon-space-inline-lg);
|
|
3280
3313
|
}
|
|
3281
3314
|
|
|
3282
|
-
.ui-button--xs:has(> svg) {
|
|
3315
|
+
.ui-button--xs:has(> svg):not([data-label]) {
|
|
3283
3316
|
padding-inline: var(--button-icon-space-inline-xs);
|
|
3284
3317
|
}
|
|
3285
3318
|
|
|
@@ -3994,6 +4027,19 @@
|
|
|
3994
4027
|
.ui-dashboard-grid-item[data-held] .ui-dashboard-grid-move {
|
|
3995
4028
|
cursor: grabbing;
|
|
3996
4029
|
}
|
|
4030
|
+
|
|
4031
|
+
@media print {
|
|
4032
|
+
.ui-dashboard-grid-items {
|
|
4033
|
+
grid-auto-rows: auto;
|
|
4034
|
+
}
|
|
4035
|
+
.ui-dashboard-grid-content {
|
|
4036
|
+
overflow: visible;
|
|
4037
|
+
}
|
|
4038
|
+
.ui-dashboard-grid-move,
|
|
4039
|
+
.ui-dashboard-grid-resize {
|
|
4040
|
+
display: none;
|
|
4041
|
+
}
|
|
4042
|
+
}
|
|
3997
4043
|
@media (prefers-reduced-motion: reduce) {
|
|
3998
4044
|
.ui-dashboard-grid-item,
|
|
3999
4045
|
.ui-dashboard-grid-move,
|
package/dist/styles/core.css
CHANGED
|
@@ -35,19 +35,25 @@
|
|
|
35
35
|
}
|
|
36
36
|
|
|
37
37
|
.ui-persona [data-slot="persona-name"] {
|
|
38
|
-
font-size: var(--persona-name-font-size, var(--font-size-sm));
|
|
38
|
+
font-size: var(--persona-name-font-size, var(--font-size-sm, var(--font-size-base)));
|
|
39
39
|
font-weight: var(--persona-name-font-weight, var(--font-weight-medium));
|
|
40
40
|
color: var(--persona-name-color, hsl(var(--foreground)));
|
|
41
41
|
}
|
|
42
42
|
|
|
43
43
|
.ui-persona[data-size="sm"] [data-slot="persona-name"] {
|
|
44
|
-
font-size: var(
|
|
44
|
+
font-size: var(
|
|
45
|
+
--persona-name-font-size-sm,
|
|
46
|
+
var(--font-size-xs, calc(var(--font-size-base) / var(--font-size-ratio)))
|
|
47
|
+
);
|
|
45
48
|
}
|
|
46
49
|
|
|
47
50
|
.ui-persona [data-slot="persona-description"] {
|
|
48
51
|
align-self: flex-start;
|
|
49
52
|
max-inline-size: 100%;
|
|
50
|
-
font-size: var(
|
|
53
|
+
font-size: var(
|
|
54
|
+
--persona-description-font-size,
|
|
55
|
+
var(--font-size-xs, calc(var(--font-size-base) / var(--font-size-ratio)))
|
|
56
|
+
);
|
|
51
57
|
color: var(--persona-description-color, hsl(var(--muted-foreground)));
|
|
52
58
|
}
|
|
53
59
|
|
|
@@ -2685,6 +2691,36 @@
|
|
|
2685
2691
|
|
|
2686
2692
|
@layer godxjp-ui-responsive {
|
|
2687
2693
|
|
|
2694
|
+
[data-slot="descriptions"][data-label-width="content"] {
|
|
2695
|
+
grid-template-columns: repeat(
|
|
2696
|
+
var(--descriptions-column-count, 1),
|
|
2697
|
+
fit-content(var(--descriptions-label-max-width)) minmax(0, 1fr)
|
|
2698
|
+
);
|
|
2699
|
+
column-gap: var(--descriptions-label-gap);
|
|
2700
|
+
}
|
|
2701
|
+
[data-slot="descriptions"][data-label-width="content"][data-bordered] {
|
|
2702
|
+
column-gap: 0;
|
|
2703
|
+
}
|
|
2704
|
+
[data-slot="descriptions"][data-label-width="content"] > [data-slot="descriptions-item"] {
|
|
2705
|
+
grid-column: span calc(2 * var(--descriptions-item-span, 1));
|
|
2706
|
+
grid-template-columns: subgrid;
|
|
2707
|
+
}
|
|
2708
|
+
[data-slot="descriptions"][data-label-width="content"]
|
|
2709
|
+
> [data-slot="descriptions-item"][data-span="filled"] {
|
|
2710
|
+
grid-column: 1 / -1;
|
|
2711
|
+
}
|
|
2712
|
+
[data-slot="descriptions"][data-label-width="content"]
|
|
2713
|
+
> [data-slot="descriptions-item"]
|
|
2714
|
+
> [data-slot="descriptions-value"] {
|
|
2715
|
+
grid-column: 2 / -1;
|
|
2716
|
+
}
|
|
2717
|
+
[data-slot="descriptions"][data-label-width="content"]
|
|
2718
|
+
> [data-slot="descriptions-item"]
|
|
2719
|
+
> [data-slot="descriptions-label"] {
|
|
2720
|
+
min-inline-size: 0;
|
|
2721
|
+
overflow-wrap: anywhere;
|
|
2722
|
+
}
|
|
2723
|
+
|
|
2688
2724
|
@media (min-width: 640px) {
|
|
2689
2725
|
[data-slot="descriptions"][data-columns-responsive] {
|
|
2690
2726
|
--descriptions-column-count: var(
|