@pathscale/ui 0.0.164 → 0.0.166
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/badge/Badge.css +233 -0
- package/dist/components/badge/Badge.d.ts +24 -17
- package/dist/components/badge/index.d.ts +9 -1
- package/dist/index.css +245 -0
- package/dist/index.js +81 -70
- package/package.json +1 -1
|
@@ -0,0 +1,233 @@
|
|
|
1
|
+
@reference "tailwindcss";
|
|
2
|
+
|
|
3
|
+
/* ==========================================================================
|
|
4
|
+
Badge - Small informational badges for displaying labels, statuses, and categories.
|
|
5
|
+
========================================================================== */
|
|
6
|
+
|
|
7
|
+
/* Base styles */
|
|
8
|
+
.badge {
|
|
9
|
+
@apply inline-flex shrink-0 items-center justify-center gap-0.5 font-medium;
|
|
10
|
+
|
|
11
|
+
/* Default size (matches --md) */
|
|
12
|
+
@apply min-h-7 min-w-7 rounded-3xl text-xs leading-[1.34];
|
|
13
|
+
|
|
14
|
+
/* Default tokens */
|
|
15
|
+
--badge-bg: var(--color-default);
|
|
16
|
+
--badge-fg: var(--color-default-foreground);
|
|
17
|
+
--badge-border: var(--color-background);
|
|
18
|
+
|
|
19
|
+
background-color: var(--badge-bg);
|
|
20
|
+
color: var(--badge-fg);
|
|
21
|
+
border: 1px solid var(--badge-border);
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
.badge__label {
|
|
25
|
+
@apply px-0.5;
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
.badge-anchor {
|
|
29
|
+
@apply relative inline-flex shrink-0;
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
/* ==========================================================================
|
|
33
|
+
Size variants
|
|
34
|
+
========================================================================== */
|
|
35
|
+
|
|
36
|
+
.badge--lg {
|
|
37
|
+
@apply min-h-8 min-w-8 rounded-2xl text-sm leading-[1.43];
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
.badge--md {
|
|
41
|
+
/* No styles as this is the default size */
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
.badge--sm {
|
|
45
|
+
@apply min-h-4 min-w-4 rounded-xl text-[10px] leading-[1.34];
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
.badge--xs {
|
|
49
|
+
@apply min-h-3 min-w-3 rounded-lg text-[9px] leading-[1.2];
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
.badge--xl {
|
|
53
|
+
@apply min-h-9 min-w-9 rounded-2xl text-sm leading-[1.43];
|
|
54
|
+
}
|
|
55
|
+
|
|
56
|
+
/* ==========================================================================
|
|
57
|
+
Color variants - set foreground color
|
|
58
|
+
========================================================================== */
|
|
59
|
+
|
|
60
|
+
.badge--accent {
|
|
61
|
+
--badge-fg: var(--color-accent);
|
|
62
|
+
}
|
|
63
|
+
|
|
64
|
+
.badge--default {
|
|
65
|
+
--badge-fg: var(--color-default-foreground);
|
|
66
|
+
}
|
|
67
|
+
|
|
68
|
+
.badge--success {
|
|
69
|
+
--badge-fg: var(--color-success);
|
|
70
|
+
}
|
|
71
|
+
|
|
72
|
+
.badge--warning {
|
|
73
|
+
--badge-fg: var(--color-warning);
|
|
74
|
+
}
|
|
75
|
+
|
|
76
|
+
.badge--danger {
|
|
77
|
+
--badge-fg: var(--color-danger);
|
|
78
|
+
}
|
|
79
|
+
|
|
80
|
+
.badge--neutral {
|
|
81
|
+
--badge-fg: var(--color-neutral);
|
|
82
|
+
}
|
|
83
|
+
|
|
84
|
+
.badge--info {
|
|
85
|
+
--badge-fg: var(--color-info);
|
|
86
|
+
}
|
|
87
|
+
|
|
88
|
+
.badge--error {
|
|
89
|
+
--badge-fg: var(--color-error);
|
|
90
|
+
}
|
|
91
|
+
|
|
92
|
+
.badge--ghost {
|
|
93
|
+
--badge-fg: currentColor;
|
|
94
|
+
}
|
|
95
|
+
|
|
96
|
+
/* ==========================================================================
|
|
97
|
+
Variant styles
|
|
98
|
+
========================================================================== */
|
|
99
|
+
|
|
100
|
+
.badge--primary {
|
|
101
|
+
/* Solid background - compound variants below handle bg/fg per color */
|
|
102
|
+
}
|
|
103
|
+
|
|
104
|
+
.badge--secondary {
|
|
105
|
+
/* Default background with colored text - base behavior */
|
|
106
|
+
}
|
|
107
|
+
|
|
108
|
+
.badge--soft {
|
|
109
|
+
/* Soft/muted background - compound variants below handle bg/fg per color */
|
|
110
|
+
}
|
|
111
|
+
|
|
112
|
+
.badge--outline {
|
|
113
|
+
--badge-border: var(--badge-bg);
|
|
114
|
+
background-color: transparent;
|
|
115
|
+
}
|
|
116
|
+
|
|
117
|
+
.badge--dash {
|
|
118
|
+
--badge-border: var(--badge-bg);
|
|
119
|
+
background-color: transparent;
|
|
120
|
+
border-style: dashed;
|
|
121
|
+
}
|
|
122
|
+
|
|
123
|
+
/* ==========================================================================
|
|
124
|
+
Placement variants
|
|
125
|
+
========================================================================== */
|
|
126
|
+
|
|
127
|
+
.badge--top-right {
|
|
128
|
+
@apply absolute top-0 right-0;
|
|
129
|
+
transform: translate(25%, -25%);
|
|
130
|
+
}
|
|
131
|
+
|
|
132
|
+
.badge--top-left {
|
|
133
|
+
@apply absolute top-0 left-0;
|
|
134
|
+
transform: translate(-25%, -25%);
|
|
135
|
+
}
|
|
136
|
+
|
|
137
|
+
.badge--bottom-right {
|
|
138
|
+
@apply absolute right-0 bottom-0;
|
|
139
|
+
transform: translate(25%, 25%);
|
|
140
|
+
}
|
|
141
|
+
|
|
142
|
+
.badge--bottom-left {
|
|
143
|
+
@apply absolute bottom-0 left-0;
|
|
144
|
+
transform: translate(-25%, 25%);
|
|
145
|
+
}
|
|
146
|
+
|
|
147
|
+
/* ==========================================================================
|
|
148
|
+
Compound variants - Primary (solid background)
|
|
149
|
+
========================================================================== */
|
|
150
|
+
|
|
151
|
+
.badge--primary.badge--accent {
|
|
152
|
+
--badge-bg: var(--color-accent);
|
|
153
|
+
--badge-fg: var(--color-accent-foreground);
|
|
154
|
+
}
|
|
155
|
+
|
|
156
|
+
.badge--primary.badge--default {
|
|
157
|
+
--badge-bg: var(--color-default);
|
|
158
|
+
--badge-fg: var(--color-default-foreground);
|
|
159
|
+
}
|
|
160
|
+
|
|
161
|
+
.badge--primary.badge--success {
|
|
162
|
+
--badge-bg: var(--color-success);
|
|
163
|
+
--badge-fg: var(--color-success-foreground);
|
|
164
|
+
}
|
|
165
|
+
|
|
166
|
+
.badge--primary.badge--warning {
|
|
167
|
+
--badge-bg: var(--color-warning);
|
|
168
|
+
--badge-fg: var(--color-warning-foreground);
|
|
169
|
+
}
|
|
170
|
+
|
|
171
|
+
.badge--primary.badge--danger {
|
|
172
|
+
--badge-bg: var(--color-danger);
|
|
173
|
+
--badge-fg: var(--color-danger-foreground);
|
|
174
|
+
}
|
|
175
|
+
|
|
176
|
+
.badge--primary.badge--neutral {
|
|
177
|
+
--badge-bg: var(--color-neutral);
|
|
178
|
+
--badge-fg: var(--color-neutral-foreground);
|
|
179
|
+
}
|
|
180
|
+
|
|
181
|
+
.badge--primary.badge--info {
|
|
182
|
+
--badge-bg: var(--color-info);
|
|
183
|
+
--badge-fg: var(--color-info-foreground);
|
|
184
|
+
}
|
|
185
|
+
|
|
186
|
+
.badge--primary.badge--error {
|
|
187
|
+
--badge-bg: var(--color-error);
|
|
188
|
+
--badge-fg: var(--color-error-foreground);
|
|
189
|
+
}
|
|
190
|
+
|
|
191
|
+
/* ==========================================================================
|
|
192
|
+
Compound variants - Soft (muted background)
|
|
193
|
+
========================================================================== */
|
|
194
|
+
|
|
195
|
+
.badge--soft.badge--accent {
|
|
196
|
+
--badge-bg: var(--color-accent-soft);
|
|
197
|
+
--badge-fg: var(--color-accent-soft-foreground);
|
|
198
|
+
}
|
|
199
|
+
|
|
200
|
+
.badge--soft.badge--default {
|
|
201
|
+
--badge-bg: var(--color-default);
|
|
202
|
+
--badge-fg: var(--color-default-foreground);
|
|
203
|
+
}
|
|
204
|
+
|
|
205
|
+
.badge--soft.badge--success {
|
|
206
|
+
--badge-bg: var(--color-success-soft);
|
|
207
|
+
--badge-fg: var(--color-success-soft-foreground);
|
|
208
|
+
}
|
|
209
|
+
|
|
210
|
+
.badge--soft.badge--warning {
|
|
211
|
+
--badge-bg: var(--color-warning-soft);
|
|
212
|
+
--badge-fg: var(--color-warning-soft-foreground);
|
|
213
|
+
}
|
|
214
|
+
|
|
215
|
+
.badge--soft.badge--danger {
|
|
216
|
+
--badge-bg: var(--color-danger-soft);
|
|
217
|
+
--badge-fg: var(--color-danger-soft-foreground);
|
|
218
|
+
}
|
|
219
|
+
|
|
220
|
+
.badge--soft.badge--neutral {
|
|
221
|
+
--badge-bg: var(--color-neutral);
|
|
222
|
+
--badge-fg: var(--color-neutral-foreground);
|
|
223
|
+
}
|
|
224
|
+
|
|
225
|
+
.badge--soft.badge--info {
|
|
226
|
+
--badge-bg: var(--color-info-soft);
|
|
227
|
+
--badge-fg: var(--color-info-soft-foreground);
|
|
228
|
+
}
|
|
229
|
+
|
|
230
|
+
.badge--soft.badge--error {
|
|
231
|
+
--badge-bg: var(--color-error-soft);
|
|
232
|
+
--badge-fg: var(--color-error-soft-foreground);
|
|
233
|
+
}
|
|
@@ -1,19 +1,26 @@
|
|
|
1
1
|
import { type JSX } from "solid-js";
|
|
2
|
-
import
|
|
3
|
-
|
|
4
|
-
size?: ComponentSize;
|
|
5
|
-
color?: ComponentColor;
|
|
6
|
-
variant?: ComponentVariant;
|
|
7
|
-
responsive?: boolean;
|
|
8
|
-
dataTheme?: string;
|
|
2
|
+
import "./Badge.css";
|
|
3
|
+
interface BadgeAnchorProps extends JSX.HTMLAttributes<HTMLSpanElement> {
|
|
9
4
|
class?: string;
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
5
|
+
children: JSX.Element;
|
|
6
|
+
}
|
|
7
|
+
declare const BadgeAnchor: (props: BadgeAnchorProps) => JSX.Element;
|
|
8
|
+
type BadgeColor = "default" | "accent" | "success" | "warning" | "danger" | "neutral" | "primary" | "secondary" | "info" | "error" | "ghost";
|
|
9
|
+
type BadgeVariant = "primary" | "secondary" | "soft" | "outline" | "dash";
|
|
10
|
+
type BadgeSize = "xs" | "sm" | "md" | "lg" | "xl";
|
|
11
|
+
type BadgePlacement = "top-right" | "top-left" | "bottom-right" | "bottom-left";
|
|
12
|
+
interface BadgeRootProps extends Omit<JSX.HTMLAttributes<HTMLSpanElement>, "color"> {
|
|
13
|
+
class?: string;
|
|
14
|
+
children?: JSX.Element;
|
|
15
|
+
color?: BadgeColor;
|
|
16
|
+
variant?: BadgeVariant;
|
|
17
|
+
size?: BadgeSize;
|
|
18
|
+
placement?: BadgePlacement;
|
|
19
|
+
}
|
|
20
|
+
declare const BadgeRoot: (props: BadgeRootProps) => JSX.Element;
|
|
21
|
+
interface BadgeLabelProps extends JSX.HTMLAttributes<HTMLSpanElement> {
|
|
22
|
+
class?: string;
|
|
23
|
+
}
|
|
24
|
+
declare const BadgeLabel: (props: BadgeLabelProps) => JSX.Element;
|
|
25
|
+
export { BadgeRoot, BadgeLabel, BadgeAnchor };
|
|
26
|
+
export type { BadgeRootProps, BadgeLabelProps, BadgeAnchorProps };
|
|
@@ -1 +1,9 @@
|
|
|
1
|
-
|
|
1
|
+
import { BadgeAnchor, BadgeLabel, BadgeRoot } from "./Badge";
|
|
2
|
+
declare const Badge: ((props: import("./Badge").BadgeRootProps) => import("solid-js").JSX.Element) & {
|
|
3
|
+
Anchor: (props: import("./Badge").BadgeAnchorProps) => import("solid-js").JSX.Element;
|
|
4
|
+
Label: (props: import("./Badge").BadgeLabelProps) => import("solid-js").JSX.Element;
|
|
5
|
+
Root: (props: import("./Badge").BadgeRootProps) => import("solid-js").JSX.Element;
|
|
6
|
+
};
|
|
7
|
+
export default Badge;
|
|
8
|
+
export { Badge, BadgeRoot, BadgeLabel, BadgeAnchor };
|
|
9
|
+
export type { BadgeRootProps, BadgeRootProps as BadgeProps, BadgeLabelProps, BadgeAnchorProps, } from "./Badge";
|
package/dist/index.css
CHANGED
|
@@ -1,3 +1,248 @@
|
|
|
1
|
+
@layer properties {
|
|
2
|
+
@supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
|
|
3
|
+
*, :before, :after, ::backdrop {
|
|
4
|
+
--tw-font-weight: initial;
|
|
5
|
+
--tw-leading: initial;
|
|
6
|
+
}
|
|
7
|
+
}
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
.badge {
|
|
11
|
+
justify-content: center;
|
|
12
|
+
align-items: center;
|
|
13
|
+
gap: calc(var(--spacing, .25rem) * .5);
|
|
14
|
+
--tw-font-weight: var(--font-weight-medium, 500);
|
|
15
|
+
font-weight: var(--font-weight-medium, 500);
|
|
16
|
+
min-height: calc(var(--spacing, .25rem) * 7);
|
|
17
|
+
min-width: calc(var(--spacing, .25rem) * 7);
|
|
18
|
+
border-radius: var(--radius-3xl, 1.5rem);
|
|
19
|
+
font-size: var(--text-xs, .75rem);
|
|
20
|
+
line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));
|
|
21
|
+
--tw-leading: 1.34;
|
|
22
|
+
--badge-bg: var(--color-default);
|
|
23
|
+
--badge-fg: var(--color-default-foreground);
|
|
24
|
+
--badge-border: var(--color-background);
|
|
25
|
+
background-color: var(--badge-bg);
|
|
26
|
+
color: var(--badge-fg);
|
|
27
|
+
border: 1px solid var(--badge-border);
|
|
28
|
+
flex-shrink: 0;
|
|
29
|
+
line-height: 1.34;
|
|
30
|
+
display: inline-flex;
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
.badge__label {
|
|
34
|
+
padding-inline: calc(var(--spacing, .25rem) * .5);
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
.badge-anchor {
|
|
38
|
+
flex-shrink: 0;
|
|
39
|
+
display: inline-flex;
|
|
40
|
+
position: relative;
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
.badge--lg {
|
|
44
|
+
min-height: calc(var(--spacing, .25rem) * 8);
|
|
45
|
+
min-width: calc(var(--spacing, .25rem) * 8);
|
|
46
|
+
border-radius: var(--radius-2xl, 1rem);
|
|
47
|
+
font-size: var(--text-sm, .875rem);
|
|
48
|
+
line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));
|
|
49
|
+
--tw-leading: 1.43;
|
|
50
|
+
line-height: 1.43;
|
|
51
|
+
}
|
|
52
|
+
|
|
53
|
+
.badge--sm {
|
|
54
|
+
min-height: calc(var(--spacing, .25rem) * 4);
|
|
55
|
+
min-width: calc(var(--spacing, .25rem) * 4);
|
|
56
|
+
border-radius: var(--radius-xl, .75rem);
|
|
57
|
+
--tw-leading: 1.34;
|
|
58
|
+
font-size: 10px;
|
|
59
|
+
line-height: 1.34;
|
|
60
|
+
}
|
|
61
|
+
|
|
62
|
+
.badge--xs {
|
|
63
|
+
min-height: calc(var(--spacing, .25rem) * 3);
|
|
64
|
+
min-width: calc(var(--spacing, .25rem) * 3);
|
|
65
|
+
border-radius: var(--radius-lg, .5rem);
|
|
66
|
+
--tw-leading: 1.2;
|
|
67
|
+
font-size: 9px;
|
|
68
|
+
line-height: 1.2;
|
|
69
|
+
}
|
|
70
|
+
|
|
71
|
+
.badge--xl {
|
|
72
|
+
min-height: calc(var(--spacing, .25rem) * 9);
|
|
73
|
+
min-width: calc(var(--spacing, .25rem) * 9);
|
|
74
|
+
border-radius: var(--radius-2xl, 1rem);
|
|
75
|
+
font-size: var(--text-sm, .875rem);
|
|
76
|
+
line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));
|
|
77
|
+
--tw-leading: 1.43;
|
|
78
|
+
line-height: 1.43;
|
|
79
|
+
}
|
|
80
|
+
|
|
81
|
+
.badge--accent {
|
|
82
|
+
--badge-fg: var(--color-accent);
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
.badge--default {
|
|
86
|
+
--badge-fg: var(--color-default-foreground);
|
|
87
|
+
}
|
|
88
|
+
|
|
89
|
+
.badge--success {
|
|
90
|
+
--badge-fg: var(--color-success);
|
|
91
|
+
}
|
|
92
|
+
|
|
93
|
+
.badge--warning {
|
|
94
|
+
--badge-fg: var(--color-warning);
|
|
95
|
+
}
|
|
96
|
+
|
|
97
|
+
.badge--danger {
|
|
98
|
+
--badge-fg: var(--color-danger);
|
|
99
|
+
}
|
|
100
|
+
|
|
101
|
+
.badge--neutral {
|
|
102
|
+
--badge-fg: var(--color-neutral);
|
|
103
|
+
}
|
|
104
|
+
|
|
105
|
+
.badge--info {
|
|
106
|
+
--badge-fg: var(--color-info);
|
|
107
|
+
}
|
|
108
|
+
|
|
109
|
+
.badge--error {
|
|
110
|
+
--badge-fg: var(--color-error);
|
|
111
|
+
}
|
|
112
|
+
|
|
113
|
+
.badge--ghost {
|
|
114
|
+
--badge-fg: currentColor;
|
|
115
|
+
}
|
|
116
|
+
|
|
117
|
+
.badge--outline {
|
|
118
|
+
--badge-border: var(--badge-bg);
|
|
119
|
+
background-color: #0000;
|
|
120
|
+
}
|
|
121
|
+
|
|
122
|
+
.badge--dash {
|
|
123
|
+
--badge-border: var(--badge-bg);
|
|
124
|
+
background-color: #0000;
|
|
125
|
+
border-style: dashed;
|
|
126
|
+
}
|
|
127
|
+
|
|
128
|
+
.badge--top-right {
|
|
129
|
+
top: calc(var(--spacing, .25rem) * 0);
|
|
130
|
+
right: calc(var(--spacing, .25rem) * 0);
|
|
131
|
+
position: absolute;
|
|
132
|
+
transform: translate(25%, -25%);
|
|
133
|
+
}
|
|
134
|
+
|
|
135
|
+
.badge--top-left {
|
|
136
|
+
top: calc(var(--spacing, .25rem) * 0);
|
|
137
|
+
left: calc(var(--spacing, .25rem) * 0);
|
|
138
|
+
position: absolute;
|
|
139
|
+
transform: translate(-25%, -25%);
|
|
140
|
+
}
|
|
141
|
+
|
|
142
|
+
.badge--bottom-right {
|
|
143
|
+
right: calc(var(--spacing, .25rem) * 0);
|
|
144
|
+
bottom: calc(var(--spacing, .25rem) * 0);
|
|
145
|
+
position: absolute;
|
|
146
|
+
transform: translate(25%, 25%);
|
|
147
|
+
}
|
|
148
|
+
|
|
149
|
+
.badge--bottom-left {
|
|
150
|
+
bottom: calc(var(--spacing, .25rem) * 0);
|
|
151
|
+
left: calc(var(--spacing, .25rem) * 0);
|
|
152
|
+
position: absolute;
|
|
153
|
+
transform: translate(-25%, 25%);
|
|
154
|
+
}
|
|
155
|
+
|
|
156
|
+
.badge--primary.badge--accent {
|
|
157
|
+
--badge-bg: var(--color-accent);
|
|
158
|
+
--badge-fg: var(--color-accent-foreground);
|
|
159
|
+
}
|
|
160
|
+
|
|
161
|
+
.badge--primary.badge--default {
|
|
162
|
+
--badge-bg: var(--color-default);
|
|
163
|
+
--badge-fg: var(--color-default-foreground);
|
|
164
|
+
}
|
|
165
|
+
|
|
166
|
+
.badge--primary.badge--success {
|
|
167
|
+
--badge-bg: var(--color-success);
|
|
168
|
+
--badge-fg: var(--color-success-foreground);
|
|
169
|
+
}
|
|
170
|
+
|
|
171
|
+
.badge--primary.badge--warning {
|
|
172
|
+
--badge-bg: var(--color-warning);
|
|
173
|
+
--badge-fg: var(--color-warning-foreground);
|
|
174
|
+
}
|
|
175
|
+
|
|
176
|
+
.badge--primary.badge--danger {
|
|
177
|
+
--badge-bg: var(--color-danger);
|
|
178
|
+
--badge-fg: var(--color-danger-foreground);
|
|
179
|
+
}
|
|
180
|
+
|
|
181
|
+
.badge--primary.badge--neutral {
|
|
182
|
+
--badge-bg: var(--color-neutral);
|
|
183
|
+
--badge-fg: var(--color-neutral-foreground);
|
|
184
|
+
}
|
|
185
|
+
|
|
186
|
+
.badge--primary.badge--info {
|
|
187
|
+
--badge-bg: var(--color-info);
|
|
188
|
+
--badge-fg: var(--color-info-foreground);
|
|
189
|
+
}
|
|
190
|
+
|
|
191
|
+
.badge--primary.badge--error {
|
|
192
|
+
--badge-bg: var(--color-error);
|
|
193
|
+
--badge-fg: var(--color-error-foreground);
|
|
194
|
+
}
|
|
195
|
+
|
|
196
|
+
.badge--soft.badge--accent {
|
|
197
|
+
--badge-bg: var(--color-accent-soft);
|
|
198
|
+
--badge-fg: var(--color-accent-soft-foreground);
|
|
199
|
+
}
|
|
200
|
+
|
|
201
|
+
.badge--soft.badge--default {
|
|
202
|
+
--badge-bg: var(--color-default);
|
|
203
|
+
--badge-fg: var(--color-default-foreground);
|
|
204
|
+
}
|
|
205
|
+
|
|
206
|
+
.badge--soft.badge--success {
|
|
207
|
+
--badge-bg: var(--color-success-soft);
|
|
208
|
+
--badge-fg: var(--color-success-soft-foreground);
|
|
209
|
+
}
|
|
210
|
+
|
|
211
|
+
.badge--soft.badge--warning {
|
|
212
|
+
--badge-bg: var(--color-warning-soft);
|
|
213
|
+
--badge-fg: var(--color-warning-soft-foreground);
|
|
214
|
+
}
|
|
215
|
+
|
|
216
|
+
.badge--soft.badge--danger {
|
|
217
|
+
--badge-bg: var(--color-danger-soft);
|
|
218
|
+
--badge-fg: var(--color-danger-soft-foreground);
|
|
219
|
+
}
|
|
220
|
+
|
|
221
|
+
.badge--soft.badge--neutral {
|
|
222
|
+
--badge-bg: var(--color-neutral);
|
|
223
|
+
--badge-fg: var(--color-neutral-foreground);
|
|
224
|
+
}
|
|
225
|
+
|
|
226
|
+
.badge--soft.badge--info {
|
|
227
|
+
--badge-bg: var(--color-info-soft);
|
|
228
|
+
--badge-fg: var(--color-info-soft-foreground);
|
|
229
|
+
}
|
|
230
|
+
|
|
231
|
+
.badge--soft.badge--error {
|
|
232
|
+
--badge-bg: var(--color-error-soft);
|
|
233
|
+
--badge-fg: var(--color-error-soft-foreground);
|
|
234
|
+
}
|
|
235
|
+
|
|
236
|
+
@property --tw-font-weight {
|
|
237
|
+
syntax: "*";
|
|
238
|
+
inherits: false
|
|
239
|
+
}
|
|
240
|
+
|
|
241
|
+
@property --tw-leading {
|
|
242
|
+
syntax: "*";
|
|
243
|
+
inherits: false
|
|
244
|
+
}
|
|
245
|
+
|
|
1
246
|
.glow-card {
|
|
2
247
|
--glow-color-border: oklch(100% 0 0 / .3);
|
|
3
248
|
--glow-color-bg: oklch(100% 0 0 / .1);
|
package/dist/index.js
CHANGED
|
@@ -3974,75 +3974,86 @@ const Background = (props)=>{
|
|
|
3974
3974
|
})();
|
|
3975
3975
|
};
|
|
3976
3976
|
const background_Background = Background;
|
|
3977
|
-
var Badge_tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<
|
|
3978
|
-
const
|
|
3977
|
+
var Badge_tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<span>"), Badge_tmpl$2 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<span data-slot=badge-label>");
|
|
3978
|
+
const BadgeContext = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createContext)({});
|
|
3979
|
+
const BadgeAnchor = (props)=>{
|
|
3979
3980
|
const [local, others] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.splitProps)(props, [
|
|
3980
|
-
"
|
|
3981
|
-
"
|
|
3982
|
-
"variant",
|
|
3983
|
-
"responsive",
|
|
3984
|
-
"dataTheme",
|
|
3985
|
-
"class",
|
|
3986
|
-
"className",
|
|
3987
|
-
"style",
|
|
3988
|
-
"aria-label",
|
|
3989
|
-
"aria-describedby",
|
|
3990
|
-
"aria-labelledby",
|
|
3991
|
-
"role"
|
|
3981
|
+
"children",
|
|
3982
|
+
"class"
|
|
3992
3983
|
]);
|
|
3993
|
-
const classes = ()=>twMerge("badge", local.class, local.className, clsx({
|
|
3994
|
-
"badge-xl": "xl" === local.size,
|
|
3995
|
-
"badge-lg": "lg" === local.size,
|
|
3996
|
-
"badge-md": "md" === local.size,
|
|
3997
|
-
"badge-sm": "sm" === local.size,
|
|
3998
|
-
"badge-xs": "xs" === local.size,
|
|
3999
|
-
"badge-soft": "soft" === local.variant,
|
|
4000
|
-
"badge-dash": "dash" === local.variant,
|
|
4001
|
-
"badge-outline": "outline" === local.variant,
|
|
4002
|
-
"badge-neutral": "neutral" === local.color,
|
|
4003
|
-
"badge-primary": "primary" === local.color,
|
|
4004
|
-
"badge-secondary": "secondary" === local.color,
|
|
4005
|
-
"badge-accent": "accent" === local.color,
|
|
4006
|
-
"badge-ghost": "ghost" === local.color,
|
|
4007
|
-
"badge-info": "info" === local.color,
|
|
4008
|
-
"badge-success": "success" === local.color,
|
|
4009
|
-
"badge-warning": "warning" === local.color,
|
|
4010
|
-
"badge-error": "error" === local.color,
|
|
4011
|
-
"badge-responsive": local.responsive
|
|
4012
|
-
}));
|
|
4013
3984
|
return (()=>{
|
|
4014
3985
|
var _el$ = Badge_tmpl$();
|
|
4015
3986
|
(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(others, {
|
|
4016
|
-
get ["data-theme"] () {
|
|
4017
|
-
return local.dataTheme;
|
|
4018
|
-
},
|
|
4019
3987
|
get ["class"] () {
|
|
4020
|
-
return
|
|
3988
|
+
return twMerge("badge-anchor", local.class);
|
|
4021
3989
|
},
|
|
4022
|
-
|
|
4023
|
-
return local.style;
|
|
4024
|
-
},
|
|
4025
|
-
get role () {
|
|
4026
|
-
return local.role || "status";
|
|
4027
|
-
},
|
|
4028
|
-
get ["aria-label"] () {
|
|
4029
|
-
return local["aria-label"];
|
|
4030
|
-
},
|
|
4031
|
-
get ["aria-describedby"] () {
|
|
4032
|
-
return local["aria-describedby"];
|
|
4033
|
-
},
|
|
4034
|
-
get ["aria-labelledby"] () {
|
|
4035
|
-
return local["aria-labelledby"];
|
|
4036
|
-
},
|
|
4037
|
-
get ["aria-hidden"] () {
|
|
4038
|
-
return "presentation" === local.role || "none" === local.role ? true : void 0;
|
|
4039
|
-
}
|
|
3990
|
+
"data-slot": "badge-anchor"
|
|
4040
3991
|
}), false, true);
|
|
4041
|
-
(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$, ()=>
|
|
3992
|
+
(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$, ()=>local.children);
|
|
4042
3993
|
return _el$;
|
|
4043
3994
|
})();
|
|
4044
3995
|
};
|
|
4045
|
-
const
|
|
3996
|
+
const BadgeRoot = (props)=>{
|
|
3997
|
+
const [local, others] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.splitProps)(props, [
|
|
3998
|
+
"children",
|
|
3999
|
+
"class",
|
|
4000
|
+
"color",
|
|
4001
|
+
"variant",
|
|
4002
|
+
"size",
|
|
4003
|
+
"placement"
|
|
4004
|
+
]);
|
|
4005
|
+
const classes = ()=>{
|
|
4006
|
+
const color = local.color ?? "default";
|
|
4007
|
+
const variant = local.variant ?? "primary";
|
|
4008
|
+
const size = local.size ?? "md";
|
|
4009
|
+
const placement = local.placement ?? "top-right";
|
|
4010
|
+
return twMerge(clsx("badge", `badge--${size}`, `badge--${color}`, `badge--${variant}`, `badge--${placement}`), local.class);
|
|
4011
|
+
};
|
|
4012
|
+
const badgeChildren = ()=>{
|
|
4013
|
+
const c = local.children;
|
|
4014
|
+
if ("string" == typeof c || "number" == typeof c) return (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(BadgeLabel, {
|
|
4015
|
+
children: c
|
|
4016
|
+
});
|
|
4017
|
+
return c;
|
|
4018
|
+
};
|
|
4019
|
+
return (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(BadgeContext.Provider, {
|
|
4020
|
+
value: {},
|
|
4021
|
+
get children () {
|
|
4022
|
+
var _el$2 = Badge_tmpl$();
|
|
4023
|
+
(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$2, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(others, {
|
|
4024
|
+
get ["class"] () {
|
|
4025
|
+
return classes();
|
|
4026
|
+
},
|
|
4027
|
+
"data-slot": "badge"
|
|
4028
|
+
}), false, true);
|
|
4029
|
+
(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$2, badgeChildren);
|
|
4030
|
+
return _el$2;
|
|
4031
|
+
}
|
|
4032
|
+
});
|
|
4033
|
+
};
|
|
4034
|
+
const BadgeLabel = (props)=>{
|
|
4035
|
+
const [local, others] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.splitProps)(props, [
|
|
4036
|
+
"children",
|
|
4037
|
+
"class"
|
|
4038
|
+
]);
|
|
4039
|
+
(0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.useContext)(BadgeContext);
|
|
4040
|
+
return (()=>{
|
|
4041
|
+
var _el$3 = Badge_tmpl$2();
|
|
4042
|
+
(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$3, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)({
|
|
4043
|
+
get ["class"] () {
|
|
4044
|
+
return twMerge("badge__label", local.class);
|
|
4045
|
+
}
|
|
4046
|
+
}, others), false, true);
|
|
4047
|
+
(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$3, ()=>local.children);
|
|
4048
|
+
return _el$3;
|
|
4049
|
+
})();
|
|
4050
|
+
};
|
|
4051
|
+
const Badge = Object.assign(BadgeRoot, {
|
|
4052
|
+
Anchor: BadgeAnchor,
|
|
4053
|
+
Label: BadgeLabel,
|
|
4054
|
+
Root: BadgeRoot
|
|
4055
|
+
});
|
|
4056
|
+
const badge = Badge;
|
|
4046
4057
|
var Breadcrumbs_tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<div><ul>");
|
|
4047
4058
|
const Breadcrumbs_Breadcrumbs = (props)=>{
|
|
4048
4059
|
const [local, others] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.splitProps)(props, [
|
|
@@ -6514,7 +6525,7 @@ function getDefaultColor() {
|
|
|
6514
6525
|
};
|
|
6515
6526
|
}
|
|
6516
6527
|
var AlphaSlider_tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<div role=slider aria-label="Alpha (opacity)"aria-valuemin=0 aria-valuemax=1><div class="absolute inset-0"></div><div class="absolute inset-0"></div><div>');
|
|
6517
|
-
const
|
|
6528
|
+
const AlphaSlider = (props)=>{
|
|
6518
6529
|
const context = useColorPickerContext();
|
|
6519
6530
|
const [isDragging, setIsDragging] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createSignal)(false);
|
|
6520
6531
|
let sliderRef;
|
|
@@ -6608,7 +6619,7 @@ const AlphaSlider_AlphaSlider = (props)=>{
|
|
|
6608
6619
|
return _el$;
|
|
6609
6620
|
})();
|
|
6610
6621
|
};
|
|
6611
|
-
const
|
|
6622
|
+
const colorpicker_AlphaSlider = AlphaSlider;
|
|
6612
6623
|
(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.delegateEvents)([
|
|
6613
6624
|
"mousedown",
|
|
6614
6625
|
"keydown"
|
|
@@ -8273,7 +8284,7 @@ const ColorPicker = (props)=>{
|
|
|
8273
8284
|
return local.showAlpha;
|
|
8274
8285
|
},
|
|
8275
8286
|
get children () {
|
|
8276
|
-
return (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(
|
|
8287
|
+
return (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(colorpicker_AlphaSlider, {});
|
|
8277
8288
|
}
|
|
8278
8289
|
}), null);
|
|
8279
8290
|
(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$5, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(colorpicker_ColorInput, {}), null);
|
|
@@ -9049,9 +9060,9 @@ const ConnectionStatus = (props)=>{
|
|
|
9049
9060
|
case "connecting":
|
|
9050
9061
|
return "warning";
|
|
9051
9062
|
case "error":
|
|
9052
|
-
return "
|
|
9063
|
+
return "danger";
|
|
9053
9064
|
default:
|
|
9054
|
-
return "
|
|
9065
|
+
return "default";
|
|
9055
9066
|
}
|
|
9056
9067
|
});
|
|
9057
9068
|
const getStatusText = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>{
|
|
@@ -9126,7 +9137,7 @@ const ConnectionStatus = (props)=>{
|
|
|
9126
9137
|
gap: "sm",
|
|
9127
9138
|
get children () {
|
|
9128
9139
|
return [
|
|
9129
|
-
(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(
|
|
9140
|
+
(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(badge, {
|
|
9130
9141
|
get color () {
|
|
9131
9142
|
return getBadgeColor();
|
|
9132
9143
|
},
|
|
@@ -9165,7 +9176,7 @@ const ConnectionStatus = (props)=>{
|
|
|
9165
9176
|
return !local.showDetails;
|
|
9166
9177
|
},
|
|
9167
9178
|
get children () {
|
|
9168
|
-
return (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(
|
|
9179
|
+
return (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(badge, {
|
|
9169
9180
|
get color () {
|
|
9170
9181
|
return getBadgeColor();
|
|
9171
9182
|
},
|
|
@@ -9977,7 +9988,7 @@ const menu_Menu = Object.assign(Menu, {
|
|
|
9977
9988
|
Details: menu_MenuDetails,
|
|
9978
9989
|
Menu: Menu
|
|
9979
9990
|
});
|
|
9980
|
-
const
|
|
9991
|
+
const DropdownMenu = (props)=>{
|
|
9981
9992
|
const [local, others] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.splitProps)(props, [
|
|
9982
9993
|
"class",
|
|
9983
9994
|
"className",
|
|
@@ -10014,7 +10025,7 @@ const DropdownMenu_DropdownMenu = (props)=>{
|
|
|
10014
10025
|
}
|
|
10015
10026
|
}));
|
|
10016
10027
|
};
|
|
10017
|
-
const
|
|
10028
|
+
const dropdown_DropdownMenu = DropdownMenu;
|
|
10018
10029
|
function useDropdown(trigger, disabled = false) {
|
|
10019
10030
|
const [open, setOpenState] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createSignal)(false);
|
|
10020
10031
|
let ref;
|
|
@@ -10163,7 +10174,7 @@ const Dropdown = (props)=>{
|
|
|
10163
10174
|
(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$2, ()=>local.children);
|
|
10164
10175
|
return _el$2;
|
|
10165
10176
|
})(),
|
|
10166
|
-
(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(
|
|
10177
|
+
(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(dropdown_DropdownMenu, {
|
|
10167
10178
|
id: fallbackMenuId,
|
|
10168
10179
|
"aria-labelledby": fallbackToggleId,
|
|
10169
10180
|
role: "listbox",
|
|
@@ -10182,7 +10193,7 @@ const Dropdown = (props)=>{
|
|
|
10182
10193
|
const dropdown_Dropdown = Object.assign(Dropdown, {
|
|
10183
10194
|
Details: DropdownDetails,
|
|
10184
10195
|
Toggle: dropdown_DropdownToggle,
|
|
10185
|
-
Menu:
|
|
10196
|
+
Menu: dropdown_DropdownMenu,
|
|
10186
10197
|
Item: dropdown_DropdownItem
|
|
10187
10198
|
});
|
|
10188
10199
|
const dropdown = dropdown_Dropdown;
|
|
@@ -19869,4 +19880,4 @@ const createRouteTransitionResolver = (options)=>{
|
|
|
19869
19880
|
return fallback ?? noMotion;
|
|
19870
19881
|
};
|
|
19871
19882
|
};
|
|
19872
|
-
export { accordion_Accordion as Accordion, alert_Alert as Alert, AlphaSlider, artboard_Artboard as Artboard, avatar as Avatar, background_Background as Background, Badge, bottom_sheet_BottomSheet as BottomSheet, Breadcrumbs, breadcrumbs_BreadcrumbsItem as BreadcrumbsItem, browsermockup_BrowserMockup as BrowserMockup, button_Button as Button, Calendar, card_Card as Card, carousel_Carousel as Carousel, chatbubble_ChatBubble as ChatBubble, checkbox_Checkbox as Checkbox, codemockup_CodeMockup as CodeMockup, CodeMockupLine, collapse_Collapse as Collapse, CollapseContent, CollapseDetails, CollapseTitle, colorpicker_ColorInput as ColorInput, colorpicker_ColorPicker as ColorPicker, ColorPickerContext, ColorPickerFlowerSelector, colorpicker_ColorPickerGradientSelector as ColorPickerGradientSelector, ColorPickerWheelSelector, colorpicker_ColorPreview as ColorPreview, colorpicker_ColorSwatches as ColorSwatches, ColorWheel, colorpicker_ColorWheelFlower as ColorWheelFlower, ConfirmDialog, connectionstatus_ConnectionStatus as ConnectionStatus, CookieConsent, copy_button_CopyButton as CopyButton, countdown_Countdown as Countdown, diff_Diff as Diff, divider as Divider, dock as Dock, Drawer, dropdown as Dropdown, DropdownSelect, EmptyState, EnhancedTable, Fieldset, FileInput, FirefoxPWABanner, flex_Flex as Flex, floating_dock_FloatingDock as FloatingDock, footer_Footer as Footer, form_Form as Form, form_actions_FormActions as FormActions, glass_panel_GlassPanel as GlassPanel, GlowCard, Grid, hero_Hero as Hero, colorpicker_HueSlider as HueSlider, I18nContext, I18nProvider, icon_Icon as Icon, immersive_landing_ImmersiveLanding as ImmersiveLanding, ImmersiveLandingContext, indicator_Indicator as Indicator, input as Input, join_Join as Join, kbd_Kbd as Kbd, language_switcher_LanguageSwitcher as LanguageSwitcher, LightnessSlider, link_Link as Link, live_chat_LiveChatBubble as LiveChatBubble, LiveChatPanel, loading_Loading as Loading, mask as Mask, menu_Menu as Menu, modal_Modal as Modal, MotionDiv, navbar_Navbar as Navbar, noise_background_NoiseBackground as NoiseBackground, PWAInstallPrompt, Pagination, phonemockup_PhoneMockup as PhoneMockup, Progress, props_table_PropsTable as PropsTable, radialprogress_RadialProgress as RadialProgress, radio_Radio as Radio, radio_group_RadioGroup as RadioGroup, range_Range as Range, Rating, colorpicker_SaturationBrightness as SaturationBrightness, select_Select as Select, showcase_ShowcaseBlock as ShowcaseBlock, ShowcaseSection, sidenav_Sidenav as Sidenav, sidenav_SidenavButton as SidenavButton, sidenav_SidenavGroup as SidenavGroup, sidenav_SidenavItem as SidenavItem, sidenav_SidenavLink as SidenavLink, sidenav_SidenavMenu as SidenavMenu, SizePicker, skeleton_Skeleton as Skeleton, SkipLink, RangeSlider as SliderField, Stack, stat_card_StatCard as StatCard, stats_Stats as Stats, status_Status as Status, steps as Steps, streaming_table_StreamingTable as StreamingTable, Summary, SvgBackground, Swap, switch_field_SwitchField as SwitchField, table_Table as Table, tabs_Tabs as Tabs, textarea_Textarea as Textarea, ThemeColorPicker, Timeline, timeline_TimelineEnd as TimelineEnd, timeline_TimelineItem as TimelineItem, timeline_TimelineMiddle as TimelineMiddle, timeline_TimelineStart as TimelineStart, toast_Toast as Toast, ToastContainer, ToastStack_ToastStack as ToastStack, toggle_Toggle as Toggle, tooltip_Tooltip as Tooltip, video_preview_VideoPreview as VideoPreview, windowmockup_WindowMockup as WindowMockup, createHueShiftStore, createI18n, createMotionPresets, createMotionSystem, createPopmotionDriver, createRouteTransitionResolver, createSizeStore, createStreamingTableStore, connectionstatus_ConnectionStatus as default, defaultMotionTokens, enablePopmotion, getDefaultHueShiftStore, getDefaultSizeStore, getMotionDriver, presets_getPreset as getPreset, immediateDriver, mergeMotionTokens, motionDistances, motionDurations, motionEasings, motionPresets, noMotion, prefersReducedMotion, presets_registerPreset as registerPreset, resetHueShift, resolveEase, presets_resolvePreset as resolvePreset, routeTransition, runMotion, setMotionDriver, toastStore, useColorPickerContext, useDesktop, useFormValidation, useI18n, useImmersiveLanding, useImmersiveLandingContext };
|
|
19883
|
+
export { accordion_Accordion as Accordion, alert_Alert as Alert, colorpicker_AlphaSlider as AlphaSlider, artboard_Artboard as Artboard, avatar as Avatar, background_Background as Background, badge as Badge, bottom_sheet_BottomSheet as BottomSheet, Breadcrumbs, breadcrumbs_BreadcrumbsItem as BreadcrumbsItem, browsermockup_BrowserMockup as BrowserMockup, button_Button as Button, Calendar, card_Card as Card, carousel_Carousel as Carousel, chatbubble_ChatBubble as ChatBubble, checkbox_Checkbox as Checkbox, codemockup_CodeMockup as CodeMockup, CodeMockupLine, collapse_Collapse as Collapse, CollapseContent, CollapseDetails, CollapseTitle, colorpicker_ColorInput as ColorInput, colorpicker_ColorPicker as ColorPicker, ColorPickerContext, ColorPickerFlowerSelector, colorpicker_ColorPickerGradientSelector as ColorPickerGradientSelector, ColorPickerWheelSelector, colorpicker_ColorPreview as ColorPreview, colorpicker_ColorSwatches as ColorSwatches, ColorWheel, colorpicker_ColorWheelFlower as ColorWheelFlower, ConfirmDialog, connectionstatus_ConnectionStatus as ConnectionStatus, CookieConsent, copy_button_CopyButton as CopyButton, countdown_Countdown as Countdown, diff_Diff as Diff, divider as Divider, dock as Dock, Drawer, dropdown as Dropdown, DropdownSelect, EmptyState, EnhancedTable, Fieldset, FileInput, FirefoxPWABanner, flex_Flex as Flex, floating_dock_FloatingDock as FloatingDock, footer_Footer as Footer, form_Form as Form, form_actions_FormActions as FormActions, glass_panel_GlassPanel as GlassPanel, GlowCard, Grid, hero_Hero as Hero, colorpicker_HueSlider as HueSlider, I18nContext, I18nProvider, icon_Icon as Icon, immersive_landing_ImmersiveLanding as ImmersiveLanding, ImmersiveLandingContext, indicator_Indicator as Indicator, input as Input, join_Join as Join, kbd_Kbd as Kbd, language_switcher_LanguageSwitcher as LanguageSwitcher, LightnessSlider, link_Link as Link, live_chat_LiveChatBubble as LiveChatBubble, LiveChatPanel, loading_Loading as Loading, mask as Mask, menu_Menu as Menu, modal_Modal as Modal, MotionDiv, navbar_Navbar as Navbar, noise_background_NoiseBackground as NoiseBackground, PWAInstallPrompt, Pagination, phonemockup_PhoneMockup as PhoneMockup, Progress, props_table_PropsTable as PropsTable, radialprogress_RadialProgress as RadialProgress, radio_Radio as Radio, radio_group_RadioGroup as RadioGroup, range_Range as Range, Rating, colorpicker_SaturationBrightness as SaturationBrightness, select_Select as Select, showcase_ShowcaseBlock as ShowcaseBlock, ShowcaseSection, sidenav_Sidenav as Sidenav, sidenav_SidenavButton as SidenavButton, sidenav_SidenavGroup as SidenavGroup, sidenav_SidenavItem as SidenavItem, sidenav_SidenavLink as SidenavLink, sidenav_SidenavMenu as SidenavMenu, SizePicker, skeleton_Skeleton as Skeleton, SkipLink, RangeSlider as SliderField, Stack, stat_card_StatCard as StatCard, stats_Stats as Stats, status_Status as Status, steps as Steps, streaming_table_StreamingTable as StreamingTable, Summary, SvgBackground, Swap, switch_field_SwitchField as SwitchField, table_Table as Table, tabs_Tabs as Tabs, textarea_Textarea as Textarea, ThemeColorPicker, Timeline, timeline_TimelineEnd as TimelineEnd, timeline_TimelineItem as TimelineItem, timeline_TimelineMiddle as TimelineMiddle, timeline_TimelineStart as TimelineStart, toast_Toast as Toast, ToastContainer, ToastStack_ToastStack as ToastStack, toggle_Toggle as Toggle, tooltip_Tooltip as Tooltip, video_preview_VideoPreview as VideoPreview, windowmockup_WindowMockup as WindowMockup, createHueShiftStore, createI18n, createMotionPresets, createMotionSystem, createPopmotionDriver, createRouteTransitionResolver, createSizeStore, createStreamingTableStore, connectionstatus_ConnectionStatus as default, defaultMotionTokens, enablePopmotion, getDefaultHueShiftStore, getDefaultSizeStore, getMotionDriver, presets_getPreset as getPreset, immediateDriver, mergeMotionTokens, motionDistances, motionDurations, motionEasings, motionPresets, noMotion, prefersReducedMotion, presets_registerPreset as registerPreset, resetHueShift, resolveEase, presets_resolvePreset as resolvePreset, routeTransition, runMotion, setMotionDriver, toastStore, useColorPickerContext, useDesktop, useFormValidation, useI18n, useImmersiveLanding, useImmersiveLandingContext };
|