@pathscale/ui 2.7.2 → 2.7.3
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/dist/components/_shared/index.d.ts +1 -1
- package/dist/components/_shared/material.css +23 -6
- package/dist/components/_shared/overlayPosition.d.ts +2 -2
- package/dist/components/accordion/Accordion.css +3 -3
- package/dist/components/accordion/index.d.ts +1 -1
- package/dist/components/address/Address.css +24 -8
- package/dist/components/address/index.d.ts +3 -3
- package/dist/components/address/index.js +1 -1
- package/dist/components/alert/Alert.css +8 -2
- package/dist/components/alert/index.d.ts +2 -2
- package/dist/components/auth-card/index.d.ts +1 -1
- package/dist/components/auth-field-group/index.d.ts +1 -1
- package/dist/components/auth-footer-links/index.d.ts +1 -1
- package/dist/components/auth-message/index.d.ts +1 -1
- package/dist/components/auth-powered-by/index.d.ts +1 -1
- package/dist/components/auth-submit-button/index.d.ts +1 -1
- package/dist/components/avatar/Avatar.css +10 -6
- package/dist/components/avatar/index.d.ts +1 -1
- package/dist/components/badge/Badge.css +0 -1
- package/dist/components/badge/index.d.ts +2 -2
- package/dist/components/breadcrumb/index.d.ts +1 -1
- package/dist/components/button/Button.css +35 -7
- package/dist/components/button/index.d.ts +1 -1
- package/dist/components/button-group/ButtonGroup.css +2 -1
- package/dist/components/button-group/index.d.ts +1 -1
- package/dist/components/calendar/Calendar.css +18 -5
- package/dist/components/calendar/index.d.ts +1 -1
- package/dist/components/card/index.d.ts +4 -4
- package/dist/components/chatbubble/index.d.ts +1 -1
- package/dist/components/checkbox/Checkbox.css +26 -9
- package/dist/components/checkbox/index.d.ts +1 -1
- package/dist/components/checkbox-group/index.d.ts +1 -1
- package/dist/components/chip/Chip.css +61 -19
- package/dist/components/chip/index.d.ts +2 -2
- package/dist/components/close-button/CloseButton.css +5 -1
- package/dist/components/close-button/index.d.ts +1 -1
- package/dist/components/collapsible/index.d.ts +2 -2
- package/dist/components/color-field/ColorField.css +12 -4
- package/dist/components/color-field/index.d.ts +1 -1
- package/dist/components/color-picker/index.d.ts +2 -2
- package/dist/components/color-slider/ColorSlider.css +2 -1
- package/dist/components/color-slider/index.d.ts +1 -1
- package/dist/components/color-swatch/index.d.ts +1 -1
- package/dist/components/color-swatch-picker/index.d.ts +2 -3
- package/dist/components/color-wheel-flower/ColorWheelFlower.css +6 -2
- package/dist/components/color-wheel-flower/colorWheelFlowerContext.d.ts +1 -1
- package/dist/components/color-wheel-flower/index.d.ts +4 -4
- package/dist/components/combo-box/ComboBox.css +29 -10
- package/dist/components/combo-box/index.d.ts +1 -1
- package/dist/components/composer/Composer.css +65 -21
- package/dist/components/composer/index.d.ts +3 -3
- package/dist/components/composer/index.js +1 -1
- package/dist/components/data-grid/createDataGrid.d.ts +1 -1
- package/dist/components/data-grid/index.d.ts +1 -1
- package/dist/components/date-field/DateField.css +47 -13
- package/dist/components/date-field/index.d.ts +1 -1
- package/dist/components/date-picker/DatePicker.css +24 -6
- package/dist/components/date-picker/index.d.ts +1 -1
- package/dist/components/date-range-picker/DateRangePicker.css +28 -7
- package/dist/components/date-range-picker/index.d.ts +1 -1
- package/dist/components/dialog/Dialog.css +17 -4
- package/dist/components/dialog/index.d.ts +1 -1
- package/dist/components/dock/Dock.css +10 -2
- package/dist/components/dock/index.d.ts +1 -1
- package/dist/components/drawer/Drawer.a11y.d.ts +1 -1
- package/dist/components/drawer/Drawer.css +31 -7
- package/dist/components/drawer/index.d.ts +1 -1
- package/dist/components/dropdown/Dropdown.css +2 -1
- package/dist/components/dropdown/index.d.ts +2 -2
- package/dist/components/empty/index.d.ts +1 -1
- package/dist/components/fieldset/index.d.ts +1 -1
- package/dist/components/footer/index.d.ts +1 -1
- package/dist/components/form/index.d.ts +3 -3
- package/dist/components/form/index.js +1 -1
- package/dist/components/glow-card/GlowCard.css +5 -2
- package/dist/components/glow-card/index.d.ts +1 -1
- package/dist/components/header/Header.css +4 -1
- package/dist/components/header/index.d.ts +1 -1
- package/dist/components/icon/Icon.css +24 -8
- package/dist/components/icon/index.d.ts +1 -1
- package/dist/components/immersive-landing/ImmersiveLanding.css +27 -12
- package/dist/components/immersive-landing/components/CookieConsent.d.ts +1 -1
- package/dist/components/immersive-landing/components/FirefoxPWABanner.d.ts +1 -1
- package/dist/components/immersive-landing/components/PWAInstallPrompt.d.ts +1 -1
- package/dist/components/immersive-landing/index.d.ts +5 -5
- package/dist/components/immersive-landing/index.js +4 -4
- package/dist/components/immersive-landing/types.d.ts +1 -1
- package/dist/components/input/Input.css +14 -5
- package/dist/components/input/index.d.ts +1 -1
- package/dist/components/input-otp/InputOTP.css +10 -3
- package/dist/components/input-otp/index.d.ts +1 -1
- package/dist/components/kbd/index.d.ts +1 -1
- package/dist/components/label/Label.css +5 -2
- package/dist/components/label/index.d.ts +1 -1
- package/dist/components/language-switcher/LanguageSwitcher.css +4 -2
- package/dist/components/language-switcher/createI18n.d.ts +1 -1
- package/dist/components/language-switcher/index.d.ts +2 -2
- package/dist/components/language-switcher/index.js +1 -1
- package/dist/components/link/index.d.ts +1 -1
- package/dist/components/list-box/ListBox.css +8 -4
- package/dist/components/list-box/index.d.ts +5 -5
- package/dist/components/live-chat/LiveChat.css +15 -6
- package/dist/components/live-chat/index.d.ts +3 -3
- package/dist/components/menu/Menu.css +28 -10
- package/dist/components/menu/index.d.ts +2 -2
- package/dist/components/metal-border/engine/color.js +1 -1
- package/dist/components/metal-border/engine/glow/geometry.d.ts +5 -5
- package/dist/components/metal-border/engine/glow/geometry.js +10 -10
- package/dist/components/metal-border/engine/glow/glow.d.ts +18 -6
- package/dist/components/metal-border/engine/glow/glow.js +37 -37
- package/dist/components/metal-border/engine/index.d.ts +3 -3
- package/dist/components/metal-border/engine/index.js +1 -1
- package/dist/components/metal-border/engine/presets.d.ts +3 -3
- package/dist/components/metal-border/engine/presets.js +45 -45
- package/dist/components/metal-border/engine/renderer/core.d.ts +1 -1
- package/dist/components/metal-border/engine/shaders.js +4 -4
- package/dist/components/metal-border/index.d.ts +1 -1
- package/dist/components/meter/Meter.css +0 -5
- package/dist/components/meter/index.d.ts +1 -1
- package/dist/components/navbar/Navbar.css +2 -1
- package/dist/components/navbar/index.d.ts +2 -2
- package/dist/components/noise-background/index.d.ts +1 -1
- package/dist/components/pagination/Pagination.css +0 -1
- package/dist/components/password-field/index.d.ts +2 -2
- package/dist/components/password-requirements/index.d.ts +1 -1
- package/dist/components/popover/Popover.css +5 -1
- package/dist/components/popover/index.d.ts +2 -2
- package/dist/components/progress/Progress.css +2 -6
- package/dist/components/progress/index.d.ts +1 -1
- package/dist/components/radial-progress/RadialProgress.css +0 -5
- package/dist/components/radial-progress/index.d.ts +1 -1
- package/dist/components/radio/Radio.css +23 -8
- package/dist/components/radio-group/RadioGroup.css +11 -3
- package/dist/components/radio-group/index.d.ts +1 -1
- package/dist/components/range-calendar/RangeCalendar.css +8 -5
- package/dist/components/scroll-area/ScrollArea.css +8 -26
- package/dist/components/scroll-area/index.d.ts +1 -1
- package/dist/components/select/Select.css +14 -4
- package/dist/components/select/index.d.ts +1 -1
- package/dist/components/separator/index.d.ts +1 -1
- package/dist/components/size-picker/index.d.ts +2 -2
- package/dist/components/skeleton/Skeleton.css +86 -26
- package/dist/components/skeleton/index.d.ts +2 -2
- package/dist/components/slider/index.d.ts +1 -1
- package/dist/components/spinner/index.d.ts +1 -1
- package/dist/components/status/index.d.ts +2 -3
- package/dist/components/switch/Switch.css +62 -18
- package/dist/components/switch/index.d.ts +1 -1
- package/dist/components/table/Table.context.d.ts +1 -1
- package/dist/components/table/Table.css +27 -9
- package/dist/components/tabs/Tabs.css +7 -2
- package/dist/components/tabs/index.d.ts +1 -1
- package/dist/components/text/index.d.ts +1 -1
- package/dist/components/textarea/Textarea.css +39 -10
- package/dist/components/textarea/index.d.ts +1 -1
- package/dist/components/theme-color-picker/index.d.ts +2 -2
- package/dist/components/theme-color-picker/index.js +1 -1
- package/dist/components/time-field/TimeField.css +47 -13
- package/dist/components/time-field/index.d.ts +1 -1
- package/dist/components/toast/Toast.css +2 -1
- package/dist/components/toast/index.d.ts +1 -1
- package/dist/components/toolbar/Toolbar.css +5 -2
- package/dist/components/toolbar/index.d.ts +1 -1
- package/dist/components/tooltip/Tooltip.css +6 -3
- package/dist/components/tooltip/index.d.ts +1 -1
- package/dist/components/video-preview/index.d.ts +1 -1
- package/dist/hooks/date/index.d.ts +2 -2
- package/dist/hooks/date/index.js +2 -2
- package/dist/hooks/form/getFirstFieldError.js +0 -1
- package/dist/hooks/form/index.d.ts +3 -3
- package/dist/hooks/form/index.js +1 -1
- package/dist/hooks/table/index.d.ts +1 -1
- package/dist/hooks/table/useAnchoredOverlayPosition.d.ts +1 -1
- package/dist/index.d.ts +94 -100
- package/dist/index.js +32 -32
- package/dist/lab.d.ts +34 -35
- package/dist/lab.js +10 -10
- package/dist/layouts.manifest.json +1 -1
- package/dist/lib/layouts/index.d.ts +1 -1
- package/dist/lib/style/index.d.ts +1 -1
- package/dist/motion/easing.js +2 -2
- package/dist/motion/index.d.ts +7 -9
- package/dist/motion/index.js +5 -5
- package/dist/motion/route.js +1 -1
- package/dist/motion/solid/AnimatedCollapse.d.ts +2 -2
- package/dist/motion/solid/MotionDiv.d.ts +1 -1
- package/dist/motion/solid/index.d.ts +4 -4
- package/dist/motion/solid/index.js +1 -1
- package/dist/motion/system.js +1 -1
- package/dist/motion/tokens.d.ts +1 -1
- package/dist/primitives/streaming/index.d.ts +2 -2
- package/dist/styles/themes/dark.css +12 -4
- package/dist/styles/themes/light.css +12 -4
- package/package.json +1 -1
|
@@ -14,9 +14,7 @@
|
|
|
14
14
|
|
|
15
15
|
.scroll-area--fade.scroll-area--vertical[data-top-scroll="true"] {
|
|
16
16
|
--scroll-linear-gradient:
|
|
17
|
-
0deg,
|
|
18
|
-
#000 calc(100% - var(--scroll-area-size)),
|
|
19
|
-
transparent;
|
|
17
|
+
0deg, #000 calc(100% - var(--scroll-area-size)), transparent;
|
|
20
18
|
|
|
21
19
|
mask-image: linear-gradient(var(--scroll-linear-gradient));
|
|
22
20
|
-webkit-mask-image: linear-gradient(var(--scroll-linear-gradient));
|
|
@@ -24,9 +22,7 @@
|
|
|
24
22
|
|
|
25
23
|
.scroll-area--fade.scroll-area--vertical[data-bottom-scroll="true"] {
|
|
26
24
|
--scroll-linear-gradient:
|
|
27
|
-
180deg,
|
|
28
|
-
#000 calc(100% - var(--scroll-area-size)),
|
|
29
|
-
transparent;
|
|
25
|
+
180deg, #000 calc(100% - var(--scroll-area-size)), transparent;
|
|
30
26
|
|
|
31
27
|
mask-image: linear-gradient(var(--scroll-linear-gradient));
|
|
32
28
|
-webkit-mask-image: linear-gradient(var(--scroll-linear-gradient));
|
|
@@ -34,12 +30,8 @@
|
|
|
34
30
|
|
|
35
31
|
.scroll-area--fade.scroll-area--vertical[data-top-bottom-scroll="true"] {
|
|
36
32
|
--scroll-linear-gradient:
|
|
37
|
-
#000,
|
|
38
|
-
#000,
|
|
39
|
-
transparent 0,
|
|
40
|
-
#000 var(--scroll-area-size),
|
|
41
|
-
#000 calc(100% - var(--scroll-area-size)),
|
|
42
|
-
transparent;
|
|
33
|
+
#000, #000, transparent 0, #000 var(--scroll-area-size),
|
|
34
|
+
#000 calc(100% - var(--scroll-area-size)), transparent;
|
|
43
35
|
|
|
44
36
|
mask-image: linear-gradient(var(--scroll-linear-gradient));
|
|
45
37
|
-webkit-mask-image: linear-gradient(var(--scroll-linear-gradient));
|
|
@@ -47,9 +39,7 @@
|
|
|
47
39
|
|
|
48
40
|
.scroll-area--fade.scroll-area--horizontal[data-left-scroll="true"] {
|
|
49
41
|
--scroll-linear-gradient:
|
|
50
|
-
270deg,
|
|
51
|
-
#000 calc(100% - var(--scroll-area-size)),
|
|
52
|
-
transparent;
|
|
42
|
+
270deg, #000 calc(100% - var(--scroll-area-size)), transparent;
|
|
53
43
|
|
|
54
44
|
mask-image: linear-gradient(var(--scroll-linear-gradient));
|
|
55
45
|
-webkit-mask-image: linear-gradient(var(--scroll-linear-gradient));
|
|
@@ -57,9 +47,7 @@
|
|
|
57
47
|
|
|
58
48
|
.scroll-area--fade.scroll-area--horizontal[data-right-scroll="true"] {
|
|
59
49
|
--scroll-linear-gradient:
|
|
60
|
-
90deg,
|
|
61
|
-
#000 calc(100% - var(--scroll-area-size)),
|
|
62
|
-
transparent;
|
|
50
|
+
90deg, #000 calc(100% - var(--scroll-area-size)), transparent;
|
|
63
51
|
|
|
64
52
|
mask-image: linear-gradient(var(--scroll-linear-gradient));
|
|
65
53
|
-webkit-mask-image: linear-gradient(var(--scroll-linear-gradient));
|
|
@@ -67,13 +55,8 @@
|
|
|
67
55
|
|
|
68
56
|
.scroll-area--fade.scroll-area--horizontal[data-left-right-scroll="true"] {
|
|
69
57
|
--scroll-linear-gradient:
|
|
70
|
-
to right,
|
|
71
|
-
#000,
|
|
72
|
-
#000,
|
|
73
|
-
transparent 0,
|
|
74
|
-
#000 var(--scroll-area-size),
|
|
75
|
-
#000 calc(100% - var(--scroll-area-size)),
|
|
76
|
-
transparent;
|
|
58
|
+
to right, #000, #000, transparent 0, #000 var(--scroll-area-size),
|
|
59
|
+
#000 calc(100% - var(--scroll-area-size)), transparent;
|
|
77
60
|
|
|
78
61
|
mask-image: linear-gradient(var(--scroll-linear-gradient));
|
|
79
62
|
-webkit-mask-image: linear-gradient(var(--scroll-linear-gradient));
|
|
@@ -90,4 +73,3 @@
|
|
|
90
73
|
height: 0;
|
|
91
74
|
}
|
|
92
75
|
}
|
|
93
|
-
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
+
export type { ScrollAreaOrientation, ScrollAreaProps, ScrollAreaVariant, ScrollAreaVisibility, } from "./ScrollArea.generated";
|
|
1
2
|
export { default } from "./ScrollArea.generated";
|
|
2
|
-
export type { ScrollAreaProps, ScrollAreaVisibility, ScrollAreaOrientation, ScrollAreaVariant, } from "./ScrollArea.generated";
|
|
@@ -20,7 +20,8 @@
|
|
|
20
20
|
justify-content: space-between;
|
|
21
21
|
gap: 0.5rem;
|
|
22
22
|
border-radius: 1rem;
|
|
23
|
-
border: var(--border, 1px) solid
|
|
23
|
+
border: var(--border, 1px) solid
|
|
24
|
+
var(--color-field-border, var(--color-base-300));
|
|
24
25
|
background-color: var(--color-field, var(--color-base-100));
|
|
25
26
|
padding: 0.5rem 0.75rem;
|
|
26
27
|
text-align: left;
|
|
@@ -48,7 +49,11 @@
|
|
|
48
49
|
@media (hover: hover) {
|
|
49
50
|
.ui-select__trigger:hover:not(:disabled) {
|
|
50
51
|
background-color: var(--color-base-200);
|
|
51
|
-
border-color: color-mix(
|
|
52
|
+
border-color: color-mix(
|
|
53
|
+
in oklch,
|
|
54
|
+
var(--color-base-content) 10%,
|
|
55
|
+
transparent
|
|
56
|
+
);
|
|
52
57
|
}
|
|
53
58
|
}
|
|
54
59
|
|
|
@@ -57,7 +62,11 @@
|
|
|
57
62
|
outline: var(--focus-ring-width, 2px) solid var(--color-accent);
|
|
58
63
|
outline-offset: var(--focus-ring-offset, 2px);
|
|
59
64
|
border-color: var(--color-accent);
|
|
60
|
-
background-color: color-mix(
|
|
65
|
+
background-color: color-mix(
|
|
66
|
+
in oklch,
|
|
67
|
+
var(--color-accent) 8%,
|
|
68
|
+
var(--color-base-100)
|
|
69
|
+
);
|
|
61
70
|
}
|
|
62
71
|
|
|
63
72
|
.ui-select__trigger:active:not(:disabled) {
|
|
@@ -140,7 +149,8 @@
|
|
|
140
149
|
overflow-y: auto;
|
|
141
150
|
overscroll-behavior: contain;
|
|
142
151
|
border-radius: 1.5rem;
|
|
143
|
-
border: var(--border, 1px) solid
|
|
152
|
+
border: var(--border, 1px) solid
|
|
153
|
+
color-mix(in oklch, var(--color-base-content) 8%, transparent);
|
|
144
154
|
background-color: var(--color-base-100);
|
|
145
155
|
box-shadow:
|
|
146
156
|
0 20px 32px rgb(var(--shadow-color, 0 0 0) / 16%),
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
+
export type { SelectIndicatorProps, SelectListboxProps, SelectOptionProps, SelectPlacement, SelectPopoverProps, SelectProps, SelectRootProps, SelectSelectionMode, SelectTriggerProps, SelectValueProps, SelectValueType, SelectVariant, } from "./Select.generated";
|
|
1
2
|
export { default } from "./Select.generated";
|
|
2
|
-
export type { SelectProps, SelectRootProps, SelectPlacement, SelectValueType, SelectVariant, SelectSelectionMode, SelectTriggerProps, SelectValueProps, SelectIndicatorProps, SelectPopoverProps, SelectListboxProps, SelectOptionProps, } from "./Select.generated";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export { default, Separator, type
|
|
1
|
+
export { default, Separator, type SeparatorOrientation, type SeparatorProps, type SeparatorVariant, } from "./Separator.generated";
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
export { default as SizePicker } from "./SizePicker.generated";
|
|
2
1
|
export type { SizePickerProps } from "./SizePicker.generated";
|
|
3
|
-
export {
|
|
2
|
+
export { default as SizePicker } from "./SizePicker.generated";
|
|
3
|
+
export { createSizeStore, getDefaultSizeStore, type SizePreset, type SizeStore, } from "./sizeStore";
|
|
@@ -7,7 +7,11 @@
|
|
|
7
7
|
position: relative;
|
|
8
8
|
overflow: hidden;
|
|
9
9
|
border-radius: var(--radius-field, 0.25rem);
|
|
10
|
-
background-color: color-mix(
|
|
10
|
+
background-color: color-mix(
|
|
11
|
+
in oklab,
|
|
12
|
+
var(--color-base-300) 70%,
|
|
13
|
+
transparent
|
|
14
|
+
);
|
|
11
15
|
}
|
|
12
16
|
|
|
13
17
|
/* -------------------------------------------------------------------------------------------------
|
|
@@ -67,7 +71,8 @@
|
|
|
67
71
|
}
|
|
68
72
|
|
|
69
73
|
@keyframes skeleton-pulse {
|
|
70
|
-
0%,
|
|
74
|
+
0%,
|
|
75
|
+
100% {
|
|
71
76
|
opacity: 1;
|
|
72
77
|
}
|
|
73
78
|
50% {
|
|
@@ -112,33 +117,84 @@
|
|
|
112
117
|
width: 100%;
|
|
113
118
|
}
|
|
114
119
|
|
|
115
|
-
.skeleton--xs {
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
.skeleton--
|
|
119
|
-
|
|
120
|
+
.skeleton--xs {
|
|
121
|
+
height: 0.5rem;
|
|
122
|
+
}
|
|
123
|
+
.skeleton--sm {
|
|
124
|
+
height: 0.75rem;
|
|
125
|
+
}
|
|
126
|
+
.skeleton--md {
|
|
127
|
+
height: 1rem;
|
|
128
|
+
}
|
|
129
|
+
.skeleton--lg {
|
|
130
|
+
height: 1.5rem;
|
|
131
|
+
}
|
|
132
|
+
.skeleton--xl {
|
|
133
|
+
height: 2rem;
|
|
134
|
+
}
|
|
120
135
|
|
|
121
|
-
.skeleton--circle.skeleton--xs {
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
.skeleton--circle.skeleton--
|
|
136
|
+
.skeleton--circle.skeleton--xs {
|
|
137
|
+
width: 1.5rem;
|
|
138
|
+
height: 1.5rem;
|
|
139
|
+
}
|
|
140
|
+
.skeleton--circle.skeleton--sm {
|
|
141
|
+
width: 2rem;
|
|
142
|
+
height: 2rem;
|
|
143
|
+
}
|
|
144
|
+
.skeleton--circle.skeleton--md {
|
|
145
|
+
width: 2.5rem;
|
|
146
|
+
height: 2.5rem;
|
|
147
|
+
}
|
|
148
|
+
.skeleton--circle.skeleton--lg {
|
|
149
|
+
width: 3rem;
|
|
150
|
+
height: 3rem;
|
|
151
|
+
}
|
|
152
|
+
.skeleton--circle.skeleton--xl {
|
|
153
|
+
width: 4rem;
|
|
154
|
+
height: 4rem;
|
|
155
|
+
}
|
|
126
156
|
|
|
127
|
-
.skeleton--rect.skeleton--xs {
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
.skeleton--rect.skeleton--
|
|
131
|
-
|
|
157
|
+
.skeleton--rect.skeleton--xs {
|
|
158
|
+
height: 4rem;
|
|
159
|
+
}
|
|
160
|
+
.skeleton--rect.skeleton--sm {
|
|
161
|
+
height: 6rem;
|
|
162
|
+
}
|
|
163
|
+
.skeleton--rect.skeleton--md {
|
|
164
|
+
height: 8rem;
|
|
165
|
+
}
|
|
166
|
+
.skeleton--rect.skeleton--lg {
|
|
167
|
+
height: 12rem;
|
|
168
|
+
}
|
|
169
|
+
.skeleton--rect.skeleton--xl {
|
|
170
|
+
height: 16rem;
|
|
171
|
+
}
|
|
132
172
|
|
|
133
|
-
.skeleton--width-full {
|
|
134
|
-
|
|
135
|
-
|
|
173
|
+
.skeleton--width-full {
|
|
174
|
+
width: 100%;
|
|
175
|
+
}
|
|
176
|
+
.skeleton--width-fit {
|
|
177
|
+
width: fit-content;
|
|
178
|
+
}
|
|
179
|
+
.skeleton--width-screen {
|
|
180
|
+
width: 100vw;
|
|
181
|
+
}
|
|
136
182
|
|
|
137
|
-
.skeleton--radius-none {
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
.skeleton--radius-
|
|
141
|
-
|
|
183
|
+
.skeleton--radius-none {
|
|
184
|
+
border-radius: 0;
|
|
185
|
+
}
|
|
186
|
+
.skeleton--radius-sm {
|
|
187
|
+
border-radius: 0.25rem;
|
|
188
|
+
}
|
|
189
|
+
.skeleton--radius-md {
|
|
190
|
+
border-radius: 0.5rem;
|
|
191
|
+
}
|
|
192
|
+
.skeleton--radius-lg {
|
|
193
|
+
border-radius: 0.75rem;
|
|
194
|
+
}
|
|
195
|
+
.skeleton--radius-full {
|
|
196
|
+
border-radius: var(--radius-pill, 9999px);
|
|
197
|
+
}
|
|
142
198
|
|
|
143
199
|
/* -----------------------------------------------------------------------
|
|
144
200
|
* Multi-line text placeholder
|
|
@@ -156,7 +212,11 @@
|
|
|
156
212
|
height: 1rem;
|
|
157
213
|
width: 100%;
|
|
158
214
|
border-radius: inherit;
|
|
159
|
-
background-color: color-mix(
|
|
215
|
+
background-color: color-mix(
|
|
216
|
+
in oklab,
|
|
217
|
+
var(--color-base-300) 70%,
|
|
218
|
+
transparent
|
|
219
|
+
);
|
|
160
220
|
}
|
|
161
221
|
|
|
162
222
|
/* A short last line is what makes a stack read as a paragraph. */
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
export {
|
|
2
|
-
export
|
|
1
|
+
export type { SkeletonAnimation, SkeletonProps, SkeletonShape, } from "./Skeleton.generated";
|
|
2
|
+
export { SkeletonLayout as default, SkeletonLayout as Skeleton, } from "./Skeleton.generated";
|
|
3
3
|
export { skeleton } from "./Skeleton.recipe";
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
export { SpinnerLayout as default, SpinnerLayout as Spinner } from "./Spinner.generated";
|
|
2
1
|
export type { SpinnerProps, SpinnerShape } from "./Spinner.generated";
|
|
2
|
+
export { SpinnerLayout as default, SpinnerLayout as Spinner, } from "./Spinner.generated";
|
|
3
3
|
export { spinner } from "./Spinner.recipe";
|
|
@@ -1,3 +1,2 @@
|
|
|
1
|
-
export {
|
|
2
|
-
export
|
|
3
|
-
export { FLAPPING_THRESHOLD } from "./status";
|
|
1
|
+
export type { Health, Quality, StatusItem, StatusSummary, StatusTransition, } from "./status";
|
|
2
|
+
export { diffStatus, FLAPPING_THRESHOLD, summarizeStatus } from "./status";
|
|
@@ -11,11 +11,23 @@
|
|
|
11
11
|
-webkit-tap-highlight-color: transparent;
|
|
12
12
|
|
|
13
13
|
--switch-control-bg: var(--color-default);
|
|
14
|
-
--switch-control-bg-hover: color-mix(
|
|
14
|
+
--switch-control-bg-hover: color-mix(
|
|
15
|
+
in oklab,
|
|
16
|
+
var(--switch-control-bg),
|
|
17
|
+
transparent 20%
|
|
18
|
+
);
|
|
15
19
|
--switch-control-bg-pressed: var(--switch-control-bg-hover);
|
|
16
20
|
--switch-control-bg-checked: var(--color-accent);
|
|
17
|
-
--switch-control-bg-checked-hover: color-mix(
|
|
18
|
-
|
|
21
|
+
--switch-control-bg-checked-hover: color-mix(
|
|
22
|
+
in oklab,
|
|
23
|
+
var(--switch-control-bg-checked),
|
|
24
|
+
var(--shade, var(--color-base-content)) var(--shade-hover, 8%)
|
|
25
|
+
);
|
|
26
|
+
--switch-control-border: color-mix(
|
|
27
|
+
in oklab,
|
|
28
|
+
var(--color-base-content) 24%,
|
|
29
|
+
transparent
|
|
30
|
+
);
|
|
19
31
|
--switch-control-border-checked: color-mix(
|
|
20
32
|
in oklab,
|
|
21
33
|
var(--switch-control-bg-checked) 74%,
|
|
@@ -106,7 +118,8 @@
|
|
|
106
118
|
.switch:focus-within .switch__control,
|
|
107
119
|
.switch__input:focus-visible + .switch__control,
|
|
108
120
|
.switch[data-focus-visible="true"] .switch__control {
|
|
109
|
-
box-shadow: 0 0 0 3px
|
|
121
|
+
box-shadow: 0 0 0 3px
|
|
122
|
+
color-mix(in oklab, var(--switch-control-bg-checked) 22%, transparent);
|
|
110
123
|
}
|
|
111
124
|
|
|
112
125
|
/* ── Hover state ── */
|
|
@@ -196,19 +209,14 @@
|
|
|
196
209
|
|
|
197
210
|
/* ── Color: default ── */
|
|
198
211
|
|
|
199
|
-
|
|
200
212
|
/* ── Color: accent (default) ── */
|
|
201
213
|
|
|
202
|
-
|
|
203
214
|
/* ── Color: success ── */
|
|
204
215
|
|
|
205
|
-
|
|
206
216
|
/* ── Color: warning ── */
|
|
207
217
|
|
|
208
|
-
|
|
209
218
|
/* ── Color: danger ── */
|
|
210
219
|
|
|
211
|
-
|
|
212
220
|
/* ── Disabled state ── */
|
|
213
221
|
|
|
214
222
|
.switch--disabled,
|
|
@@ -219,7 +227,11 @@
|
|
|
219
227
|
|
|
220
228
|
.switch--disabled .switch__thumb,
|
|
221
229
|
.switch[data-disabled="true"] .switch__thumb {
|
|
222
|
-
background-color: color-mix(
|
|
230
|
+
background-color: color-mix(
|
|
231
|
+
in oklab,
|
|
232
|
+
var(--color-default-foreground) 20%,
|
|
233
|
+
transparent
|
|
234
|
+
);
|
|
223
235
|
}
|
|
224
236
|
|
|
225
237
|
.switch--disabled[data-selected="true"] .switch__thumb,
|
|
@@ -229,41 +241,73 @@
|
|
|
229
241
|
|
|
230
242
|
.switch--flavor-neutral {
|
|
231
243
|
--switch-control-bg-checked: var(--color-default-foreground);
|
|
232
|
-
--switch-control-bg-checked-hover: color-mix(
|
|
244
|
+
--switch-control-bg-checked-hover: color-mix(
|
|
245
|
+
in oklab,
|
|
246
|
+
var(--switch-control-bg-checked),
|
|
247
|
+
var(--shade, var(--color-base-content)) var(--shade-hover, 8%)
|
|
248
|
+
);
|
|
233
249
|
}
|
|
234
250
|
|
|
235
251
|
.switch--flavor-primary {
|
|
236
252
|
--switch-control-bg-checked: var(--color-primary);
|
|
237
|
-
--switch-control-bg-checked-hover: color-mix(
|
|
253
|
+
--switch-control-bg-checked-hover: color-mix(
|
|
254
|
+
in oklab,
|
|
255
|
+
var(--switch-control-bg-checked),
|
|
256
|
+
var(--shade, var(--color-base-content)) var(--shade-hover, 8%)
|
|
257
|
+
);
|
|
238
258
|
}
|
|
239
259
|
|
|
240
260
|
.switch--flavor-secondary {
|
|
241
261
|
--switch-control-bg-checked: var(--color-secondary);
|
|
242
|
-
--switch-control-bg-checked-hover: color-mix(
|
|
262
|
+
--switch-control-bg-checked-hover: color-mix(
|
|
263
|
+
in oklab,
|
|
264
|
+
var(--switch-control-bg-checked),
|
|
265
|
+
var(--shade, var(--color-base-content)) var(--shade-hover, 8%)
|
|
266
|
+
);
|
|
243
267
|
}
|
|
244
268
|
|
|
245
269
|
.switch--flavor-accent {
|
|
246
270
|
--switch-control-bg-checked: var(--color-accent);
|
|
247
|
-
--switch-control-bg-checked-hover: color-mix(
|
|
271
|
+
--switch-control-bg-checked-hover: color-mix(
|
|
272
|
+
in oklab,
|
|
273
|
+
var(--switch-control-bg-checked),
|
|
274
|
+
var(--shade, var(--color-base-content)) var(--shade-hover, 8%)
|
|
275
|
+
);
|
|
248
276
|
}
|
|
249
277
|
|
|
250
278
|
.switch--flavor-destructive {
|
|
251
279
|
--switch-control-bg-checked: var(--color-danger);
|
|
252
|
-
--switch-control-bg-checked-hover: color-mix(
|
|
280
|
+
--switch-control-bg-checked-hover: color-mix(
|
|
281
|
+
in oklab,
|
|
282
|
+
var(--switch-control-bg-checked),
|
|
283
|
+
var(--shade, var(--color-base-content)) var(--shade-hover, 8%)
|
|
284
|
+
);
|
|
253
285
|
}
|
|
254
286
|
|
|
255
287
|
.switch--flavor-success {
|
|
256
288
|
--switch-control-bg-checked: var(--color-success);
|
|
257
|
-
--switch-control-bg-checked-hover: color-mix(
|
|
289
|
+
--switch-control-bg-checked-hover: color-mix(
|
|
290
|
+
in oklab,
|
|
291
|
+
var(--switch-control-bg-checked),
|
|
292
|
+
var(--shade, var(--color-base-content)) var(--shade-hover, 8%)
|
|
293
|
+
);
|
|
258
294
|
}
|
|
259
295
|
|
|
260
296
|
.switch--flavor-warning {
|
|
261
297
|
--switch-control-bg-checked: var(--color-warning);
|
|
262
|
-
--switch-control-bg-checked-hover: color-mix(
|
|
298
|
+
--switch-control-bg-checked-hover: color-mix(
|
|
299
|
+
in oklab,
|
|
300
|
+
var(--switch-control-bg-checked),
|
|
301
|
+
var(--shade, var(--color-base-content)) var(--shade-hover, 8%)
|
|
302
|
+
);
|
|
263
303
|
}
|
|
264
304
|
|
|
265
305
|
.switch--flavor-info {
|
|
266
306
|
--switch-control-bg-checked: var(--color-info);
|
|
267
|
-
--switch-control-bg-checked-hover: color-mix(
|
|
307
|
+
--switch-control-bg-checked-hover: color-mix(
|
|
308
|
+
in oklab,
|
|
309
|
+
var(--switch-control-bg-checked),
|
|
310
|
+
var(--shade, var(--color-base-content)) var(--shade-hover, 8%)
|
|
311
|
+
);
|
|
268
312
|
}
|
|
269
313
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export { default, type
|
|
1
|
+
export { default, type ToggleColor, type ToggleProps, type ToggleSize, } from "./Switch.generated";
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { type Accessor } from "solid-js";
|
|
2
1
|
import type { JSX } from "@solidjs/web";
|
|
2
|
+
import { type Accessor } from "solid-js";
|
|
3
3
|
export type TableVariant = "primary" | "secondary";
|
|
4
4
|
export type TableSortDirection = "ascending" | "descending";
|
|
5
5
|
export type TableSortDescriptor = {
|
|
@@ -52,11 +52,13 @@
|
|
|
52
52
|
scrollbar-color: oklch(100% 0 0 / 0.15) transparent;
|
|
53
53
|
}
|
|
54
54
|
|
|
55
|
-
:is([data-theme="dark"], .dark)
|
|
55
|
+
:is([data-theme="dark"], .dark)
|
|
56
|
+
.table__scroll-container::-webkit-scrollbar-thumb {
|
|
56
57
|
background: oklch(100% 0 0 / 0.15);
|
|
57
58
|
}
|
|
58
59
|
|
|
59
|
-
:is([data-theme="dark"], .dark)
|
|
60
|
+
:is([data-theme="dark"], .dark)
|
|
61
|
+
.table__scroll-container::-webkit-scrollbar-thumb:hover {
|
|
60
62
|
background: oklch(100% 0 0 / 0.25);
|
|
61
63
|
}
|
|
62
64
|
|
|
@@ -88,7 +90,8 @@
|
|
|
88
90
|
|
|
89
91
|
@supports (color: color-mix(in lab, red, red)) {
|
|
90
92
|
.table__header {
|
|
91
|
-
border-bottom: var(--border, 1px) solid
|
|
93
|
+
border-bottom: var(--border, 1px) solid
|
|
94
|
+
color-mix(in oklch, var(--color-base-content) 8%, transparent);
|
|
92
95
|
}
|
|
93
96
|
}
|
|
94
97
|
|
|
@@ -124,7 +127,8 @@
|
|
|
124
127
|
|
|
125
128
|
@supports (color: color-mix(in lab, red, red)) {
|
|
126
129
|
.table-root--secondary .table__row .table__cell {
|
|
127
|
-
border-bottom: var(--border, 1px) solid
|
|
130
|
+
border-bottom: var(--border, 1px) solid
|
|
131
|
+
color-mix(in oklch, var(--color-base-content) 5%, transparent);
|
|
128
132
|
}
|
|
129
133
|
}
|
|
130
134
|
|
|
@@ -183,7 +187,11 @@
|
|
|
183
187
|
|
|
184
188
|
@supports (color: color-mix(in lab, red, red)) {
|
|
185
189
|
.table__column::after {
|
|
186
|
-
background-color: color-mix(
|
|
190
|
+
background-color: color-mix(
|
|
191
|
+
in oklch,
|
|
192
|
+
var(--color-base-content) 10%,
|
|
193
|
+
transparent
|
|
194
|
+
);
|
|
187
195
|
}
|
|
188
196
|
}
|
|
189
197
|
|
|
@@ -279,7 +287,8 @@
|
|
|
279
287
|
|
|
280
288
|
@supports (color: color-mix(in lab, red, red)) {
|
|
281
289
|
.table__cell {
|
|
282
|
-
border-bottom: var(--border, 1px) solid
|
|
290
|
+
border-bottom: var(--border, 1px) solid
|
|
291
|
+
color-mix(in oklch, var(--color-base-content) 5%, transparent);
|
|
283
292
|
}
|
|
284
293
|
}
|
|
285
294
|
|
|
@@ -294,7 +303,11 @@
|
|
|
294
303
|
}
|
|
295
304
|
|
|
296
305
|
.table__expanded-row .table__expanded-cell {
|
|
297
|
-
background-color: color-mix(
|
|
306
|
+
background-color: color-mix(
|
|
307
|
+
in oklch,
|
|
308
|
+
var(--color-base-200) 75%,
|
|
309
|
+
var(--color-base-100)
|
|
310
|
+
);
|
|
298
311
|
}
|
|
299
312
|
|
|
300
313
|
.table__expanded-cell {
|
|
@@ -328,7 +341,8 @@
|
|
|
328
341
|
.table__page-size-select {
|
|
329
342
|
min-width: 4.5rem;
|
|
330
343
|
border-radius: 0.75rem;
|
|
331
|
-
border: var(--border, 1px) solid
|
|
344
|
+
border: var(--border, 1px) solid
|
|
345
|
+
color-mix(in oklch, var(--color-base-content) 10%, transparent);
|
|
332
346
|
background-color: var(--color-base-100);
|
|
333
347
|
padding-inline: 0.75rem;
|
|
334
348
|
padding-block: 0.5rem;
|
|
@@ -375,7 +389,11 @@
|
|
|
375
389
|
|
|
376
390
|
@supports (color: color-mix(in lab, red, red)) {
|
|
377
391
|
.table__column-resizer {
|
|
378
|
-
background-color: color-mix(
|
|
392
|
+
background-color: color-mix(
|
|
393
|
+
in oklch,
|
|
394
|
+
var(--color-base-content) 10%,
|
|
395
|
+
transparent
|
|
396
|
+
);
|
|
379
397
|
}
|
|
380
398
|
}
|
|
381
399
|
|
|
@@ -143,7 +143,11 @@
|
|
|
143
143
|
border-radius: var(--radius-box);
|
|
144
144
|
width: var(--tabs-indicator-width, 0px);
|
|
145
145
|
height: var(--tabs-indicator-height, 0px);
|
|
146
|
-
transform: translate3d(
|
|
146
|
+
transform: translate3d(
|
|
147
|
+
var(--tabs-indicator-x, 0px),
|
|
148
|
+
var(--tabs-indicator-y, 0px),
|
|
149
|
+
0
|
|
150
|
+
);
|
|
147
151
|
opacity: 0;
|
|
148
152
|
pointer-events: none;
|
|
149
153
|
background-color: var(--color-base-100);
|
|
@@ -175,7 +179,8 @@
|
|
|
175
179
|
scrollbar-width: none;
|
|
176
180
|
}
|
|
177
181
|
|
|
178
|
-
.tabs--secondary
|
|
182
|
+
.tabs--secondary
|
|
183
|
+
.tabs__list[data-orientation="horizontal"]::-webkit-scrollbar {
|
|
179
184
|
display: none;
|
|
180
185
|
}
|
|
181
186
|
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
+
export type { TabIndicatorProps, TabListContainerProps, TabListProps, TabPanelProps, TabProps, TabSeparatorProps, TabsRootProps, } from "./Tabs.generated";
|
|
1
2
|
export { default, Tabs } from "./Tabs.generated";
|
|
2
|
-
export type { TabsRootProps, TabListContainerProps, TabListProps, TabProps, TabIndicatorProps, TabSeparatorProps, TabPanelProps, } from "./Tabs.generated";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export { default, Text,
|
|
1
|
+
export { default, Text, type TextFamily, type TextLeading, type TextProps, TextRoot, type TextRootProps, type TextSize, type TextTracking, type TextTransform, type TextVariant, type TextWeight, } from "./Text.generated";
|