@bloomkit/react 0.2.3 → 0.2.4
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 +22 -72
- package/dist/index.cjs +196 -16
- package/dist/index.cjs.map +1 -1
- package/dist/index.css +1 -1
- package/dist/index.d.cts +25 -1
- package/dist/index.d.ts +25 -1
- package/dist/index.js +197 -17
- package/dist/index.js.map +1 -1
- package/package.json +3 -3
package/README.md
CHANGED
|
@@ -29,6 +29,28 @@ Add the Google Fonts to your HTML `<head>`:
|
|
|
29
29
|
<link href="https://fonts.googleapis.com/css2?family=DM+Sans:wght@300;400;500&family=Fraunces:opsz,wght@9..144,300;9..144,500&display=swap" rel="stylesheet" />
|
|
30
30
|
```
|
|
31
31
|
|
|
32
|
+
## Customization
|
|
33
|
+
|
|
34
|
+
All components accept a `className` prop for customization with Tailwind utility classes:
|
|
35
|
+
|
|
36
|
+
```tsx
|
|
37
|
+
<Button variant="primary" className="rounded-full px-8">
|
|
38
|
+
Custom Button
|
|
39
|
+
</Button>
|
|
40
|
+
|
|
41
|
+
<Card className="bg-white shadow-xl max-w-md">
|
|
42
|
+
<CardContent>Custom styled card</CardContent>
|
|
43
|
+
</Card>
|
|
44
|
+
|
|
45
|
+
<Input className="border-blue-300 focus:border-blue-500" placeholder="Custom input" />
|
|
46
|
+
|
|
47
|
+
<Badge variant="sage" className="text-sm uppercase tracking-wider">
|
|
48
|
+
Custom Badge
|
|
49
|
+
</Badge>
|
|
50
|
+
```
|
|
51
|
+
|
|
52
|
+
Tailwind classes merge cleanly with bloom's defaults — your classes always win.
|
|
53
|
+
|
|
32
54
|
## Components
|
|
33
55
|
|
|
34
56
|
### Button
|
|
@@ -398,78 +420,6 @@ function PaletteSwitcher() {
|
|
|
398
420
|
|
|
399
421
|
The `"bloom"` palette is always available as the default. Custom palettes override the default tokens — any token you don't specify falls back to Bloom's defaults. Both color mode and palette choice are persisted to `localStorage`.
|
|
400
422
|
|
|
401
|
-
## Theming with CSS
|
|
402
|
-
|
|
403
|
-
You can also theme with pure CSS instead of the provider — override tokens directly in your stylesheet:
|
|
404
|
-
|
|
405
|
-
### Example: "Ocean Mist" theme
|
|
406
|
-
|
|
407
|
-
```css
|
|
408
|
-
/* index.css */
|
|
409
|
-
@import "@bloomkit/react/styles.css";
|
|
410
|
-
|
|
411
|
-
/* Light mode */
|
|
412
|
-
:root {
|
|
413
|
-
/* Fonts */
|
|
414
|
-
--bloom-font: 'Nunito', sans-serif;
|
|
415
|
-
--bloom-font-display: 'Space Grotesk', sans-serif;
|
|
416
|
-
|
|
417
|
-
/* Surfaces */
|
|
418
|
-
--bloom-bg: #F4F8FA;
|
|
419
|
-
--bloom-surface: #E8F0F4;
|
|
420
|
-
--bloom-surface2: #D4E2EA;
|
|
421
|
-
|
|
422
|
-
/* Text */
|
|
423
|
-
--bloom-text: #1A2E3A;
|
|
424
|
-
--bloom-text-secondary: #5E7A8C;
|
|
425
|
-
|
|
426
|
-
/* Accents — success/primary (sage) */
|
|
427
|
-
--bloom-accent1: #6AB8C4;
|
|
428
|
-
--bloom-accent1-deep: #3A96A8;
|
|
429
|
-
|
|
430
|
-
/* Accents — warning (sand) */
|
|
431
|
-
--bloom-accent2: #E0A860;
|
|
432
|
-
--bloom-accent2-deep: #C08840;
|
|
433
|
-
|
|
434
|
-
/* Accents — info/accent (lavender) */
|
|
435
|
-
--bloom-accent3: #7CA0D4;
|
|
436
|
-
--bloom-accent3-deep: #5A80B8;
|
|
437
|
-
|
|
438
|
-
/* Accents — error/danger (rose) */
|
|
439
|
-
--bloom-accent4: #D47A7A;
|
|
440
|
-
--bloom-accent4-deep: #B85A5A;
|
|
441
|
-
|
|
442
|
-
/* Shadows */
|
|
443
|
-
--bloom-shadow: 0 2px 24px rgba(26, 46, 58, 0.06);
|
|
444
|
-
--bloom-shadow-hover: 0 8px 40px rgba(26, 46, 58, 0.1);
|
|
445
|
-
|
|
446
|
-
/* Shape — optional */
|
|
447
|
-
--bloom-radius-sm: 6px;
|
|
448
|
-
--bloom-radius: 10px;
|
|
449
|
-
--bloom-radius-lg: 14px;
|
|
450
|
-
}
|
|
451
|
-
|
|
452
|
-
/* Dark mode */
|
|
453
|
-
:root.dark,
|
|
454
|
-
[data-theme="dark"] {
|
|
455
|
-
--bloom-bg: #0E1A20;
|
|
456
|
-
--bloom-surface: #162228;
|
|
457
|
-
--bloom-surface2: #1E2E36;
|
|
458
|
-
--bloom-text: #D8E8EE;
|
|
459
|
-
--bloom-text-secondary: #7A9AAC;
|
|
460
|
-
--bloom-accent1: #4A9AAC;
|
|
461
|
-
--bloom-accent1-deep: #2A7A8C;
|
|
462
|
-
--bloom-accent2: #C89048;
|
|
463
|
-
--bloom-accent2-deep: #A87030;
|
|
464
|
-
--bloom-accent3: #5A80B8;
|
|
465
|
-
--bloom-accent3-deep: #3A60A0;
|
|
466
|
-
--bloom-accent4: #B85A5A;
|
|
467
|
-
--bloom-accent4-deep: #983A3A;
|
|
468
|
-
--bloom-shadow: 0 2px 24px rgba(0, 0, 0, 0.3);
|
|
469
|
-
--bloom-shadow-hover: 0 8px 40px rgba(0, 0, 0, 0.4);
|
|
470
|
-
}
|
|
471
|
-
```
|
|
472
|
-
|
|
473
423
|
### Available tokens
|
|
474
424
|
|
|
475
425
|
| Token | What it controls |
|
package/dist/index.cjs
CHANGED
|
@@ -119,13 +119,13 @@ var buttonVariants = _classvarianceauthority.cva.call(void 0,
|
|
|
119
119
|
"active:translate-y-0 active:scale-[0.98]"
|
|
120
120
|
],
|
|
121
121
|
secondary: [
|
|
122
|
-
"bg-[var(--bloom-surface)]
|
|
122
|
+
"bg-[var(--bloom-surface)] color-[var(--bloom-text)]",
|
|
123
123
|
"border border-[var(--bloom-surface2)]",
|
|
124
124
|
"hover:-translate-y-[2px] hover:shadow-[var(--bloom-shadow-hover)]",
|
|
125
125
|
"active:translate-y-0 active:scale-[0.98]"
|
|
126
126
|
],
|
|
127
127
|
ghost: [
|
|
128
|
-
"bg-transparent
|
|
128
|
+
"bg-transparent color-[var(--bloom-text)]",
|
|
129
129
|
"hover:bg-[var(--bloom-surface)]",
|
|
130
130
|
"active:scale-[0.98]"
|
|
131
131
|
],
|
|
@@ -145,7 +145,7 @@ var buttonVariants = _classvarianceauthority.cva.call(void 0,
|
|
|
145
145
|
"active:translate-y-0 active:scale-[0.98]"
|
|
146
146
|
],
|
|
147
147
|
success: [
|
|
148
|
-
"bg-[var(--bloom-accent1-deep)]
|
|
148
|
+
"bg-[var(--bloom-accent1)] color-[var(--bloom-accent1-deep)]",
|
|
149
149
|
"hover:-translate-y-[2px] hover:shadow-[var(--bloom-shadow-hover)]",
|
|
150
150
|
"active:translate-y-0 active:scale-[0.98]"
|
|
151
151
|
]
|
|
@@ -224,7 +224,7 @@ var CardTitle = _react.forwardRef.call(void 0,
|
|
|
224
224
|
{
|
|
225
225
|
ref,
|
|
226
226
|
className: cn(
|
|
227
|
-
"font-[family-name:var(--bloom-font-display)] text-[18px] font-medium
|
|
227
|
+
"font-[family-name:var(--bloom-font-display)] text-[18px] font-medium color-[var(--bloom-text)] leading-[var(--bloom-leading-heading)]",
|
|
228
228
|
className
|
|
229
229
|
),
|
|
230
230
|
...props
|
|
@@ -347,16 +347,16 @@ var badgeVariants = _classvarianceauthority.cva.call(void 0,
|
|
|
347
347
|
"inline-flex items-center gap-[var(--space-xs)]",
|
|
348
348
|
"rounded-[var(--bloom-radius-pill)]",
|
|
349
349
|
"px-[var(--space-md)] py-[var(--space-xs)]",
|
|
350
|
-
"text-[var(--bloom-text-micro)] font-medium font-[family-name:var(--bloom-font)]",
|
|
350
|
+
"text-[length:var(--bloom-text-micro)] font-medium font-[family-name:var(--bloom-font)]",
|
|
351
351
|
"tracking-[var(--bloom-letter-wide)] uppercase"
|
|
352
352
|
],
|
|
353
353
|
{
|
|
354
354
|
variants: {
|
|
355
355
|
variant: {
|
|
356
|
-
sage: "bg-[var(--bloom-accent1)]/20
|
|
357
|
-
sand: "bg-[var(--bloom-accent2)]/20
|
|
358
|
-
lavender: "bg-[var(--bloom-accent3)]/20
|
|
359
|
-
rose: "bg-[var(--bloom-accent4)]/20
|
|
356
|
+
sage: "bg-[var(--bloom-accent1)]/20 color-[var(--bloom-accent1-deep)]",
|
|
357
|
+
sand: "bg-[var(--bloom-accent2)]/20 color-[var(--bloom-accent2-deep)]",
|
|
358
|
+
lavender: "bg-[var(--bloom-accent3)]/20 color-[var(--bloom-accent3-deep)]",
|
|
359
|
+
rose: "bg-[var(--bloom-accent4)]/20 color-[var(--bloom-accent4-deep)]"
|
|
360
360
|
}
|
|
361
361
|
},
|
|
362
362
|
defaultVariants: {
|
|
@@ -488,16 +488,16 @@ var avatarVariants = _classvarianceauthority.cva.call(void 0,
|
|
|
488
488
|
[
|
|
489
489
|
"relative inline-flex items-center justify-center",
|
|
490
490
|
"rounded-full overflow-hidden",
|
|
491
|
-
"bg-[var(--bloom-accent1)]/20
|
|
491
|
+
"bg-[var(--bloom-accent1)]/20 color-[var(--bloom-accent1-deep)]",
|
|
492
492
|
"font-[family-name:var(--bloom-font)] font-medium",
|
|
493
493
|
"select-none shrink-0"
|
|
494
494
|
],
|
|
495
495
|
{
|
|
496
496
|
variants: {
|
|
497
497
|
size: {
|
|
498
|
-
sm: "h-[32px] w-[32px] text-[var(--bloom-text-micro)]",
|
|
499
|
-
md: "h-[40px] w-[40px] text-[var(--bloom-text-caption)]",
|
|
500
|
-
lg: "h-[56px] w-[56px] text-[var(--bloom-text-body)]"
|
|
498
|
+
sm: "h-[32px] w-[32px] text-[length:var(--bloom-text-micro)]",
|
|
499
|
+
md: "h-[40px] w-[40px] text-[length:var(--bloom-text-caption)]",
|
|
500
|
+
lg: "h-[56px] w-[56px] text-[length:var(--bloom-text-body)]"
|
|
501
501
|
}
|
|
502
502
|
},
|
|
503
503
|
defaultVariants: {
|
|
@@ -965,8 +965,8 @@ var TabsTrigger = _react.forwardRef.call(void 0, ({ className, ...props }, ref)
|
|
|
965
965
|
"color-[var(--bloom-text-secondary)]",
|
|
966
966
|
"rounded-[var(--bloom-radius-pill)]",
|
|
967
967
|
"transition-all duration-[var(--bloom-duration)] ease-[var(--bloom-ease)]",
|
|
968
|
-
"hover:
|
|
969
|
-
"data-[state=active]:
|
|
968
|
+
"hover:color-[var(--bloom-text)]",
|
|
969
|
+
"data-[state=active]:color-[var(--bloom-text)]",
|
|
970
970
|
"data-[state=active]:bg-[var(--bloom-surface2)]",
|
|
971
971
|
"focus-visible:outline-none focus-visible:ring-[4px] focus-visible:ring-[var(--bloom-accent1)]/30",
|
|
972
972
|
"disabled:pointer-events-none disabled:opacity-50",
|
|
@@ -1281,6 +1281,179 @@ var Skeleton = _react.forwardRef.call(void 0,
|
|
|
1281
1281
|
);
|
|
1282
1282
|
Skeleton.displayName = "Skeleton";
|
|
1283
1283
|
|
|
1284
|
+
// src/components/checkbox/checkbox.tsx
|
|
1285
|
+
|
|
1286
|
+
var _reactcheckbox = require('@radix-ui/react-checkbox'); var CheckboxPrimitive = _interopRequireWildcard(_reactcheckbox);
|
|
1287
|
+
|
|
1288
|
+
var Checkbox = _react.forwardRef.call(void 0,
|
|
1289
|
+
({ className, label, ...props }, ref) => {
|
|
1290
|
+
const checkbox = /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
1291
|
+
CheckboxPrimitive.Root,
|
|
1292
|
+
{
|
|
1293
|
+
ref,
|
|
1294
|
+
className: cn(
|
|
1295
|
+
"peer h-[20px] w-[20px] shrink-0 cursor-pointer",
|
|
1296
|
+
"rounded-[var(--bloom-radius-sm)]",
|
|
1297
|
+
"border border-[var(--bloom-surface2)]",
|
|
1298
|
+
"bg-[var(--bloom-surface)]",
|
|
1299
|
+
"transition-all duration-[var(--bloom-duration-fast)] ease-[var(--bloom-ease)]",
|
|
1300
|
+
"focus-visible:outline-none focus-visible:ring-[4px] focus-visible:ring-[var(--bloom-accent1)]/30",
|
|
1301
|
+
"disabled:cursor-not-allowed disabled:opacity-50",
|
|
1302
|
+
"data-[state=checked]:bg-[var(--bloom-accent1-deep)] data-[state=checked]:border-[var(--bloom-accent1-deep)]",
|
|
1303
|
+
className
|
|
1304
|
+
),
|
|
1305
|
+
...props,
|
|
1306
|
+
children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, CheckboxPrimitive.Indicator, { className: "flex items-center justify-center", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
1307
|
+
"svg",
|
|
1308
|
+
{
|
|
1309
|
+
width: "12",
|
|
1310
|
+
height: "12",
|
|
1311
|
+
viewBox: "0 0 12 12",
|
|
1312
|
+
fill: "none",
|
|
1313
|
+
stroke: "white",
|
|
1314
|
+
strokeWidth: "2",
|
|
1315
|
+
strokeLinecap: "round",
|
|
1316
|
+
strokeLinejoin: "round",
|
|
1317
|
+
children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { d: "M2.5 6l2.5 2.5 4.5-5" })
|
|
1318
|
+
}
|
|
1319
|
+
) })
|
|
1320
|
+
}
|
|
1321
|
+
);
|
|
1322
|
+
if (!label) return checkbox;
|
|
1323
|
+
return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "label", { className: "inline-flex items-center gap-[var(--space-sm)] cursor-pointer", children: [
|
|
1324
|
+
checkbox,
|
|
1325
|
+
/* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "text-[length:var(--bloom-text-body)] font-[family-name:var(--bloom-font)] color-[var(--bloom-text)]", children: label })
|
|
1326
|
+
] });
|
|
1327
|
+
}
|
|
1328
|
+
);
|
|
1329
|
+
Checkbox.displayName = "Checkbox";
|
|
1330
|
+
|
|
1331
|
+
// src/components/select/select.tsx
|
|
1332
|
+
|
|
1333
|
+
var _reactselect = require('@radix-ui/react-select'); var SelectPrimitive = _interopRequireWildcard(_reactselect);
|
|
1334
|
+
|
|
1335
|
+
var Select = SelectPrimitive.Root;
|
|
1336
|
+
var SelectTrigger = _react.forwardRef.call(void 0,
|
|
1337
|
+
({ className, children, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0,
|
|
1338
|
+
SelectPrimitive.Trigger,
|
|
1339
|
+
{
|
|
1340
|
+
ref,
|
|
1341
|
+
className: cn(
|
|
1342
|
+
"inline-flex items-center justify-between gap-[var(--space-sm)]",
|
|
1343
|
+
"h-[44px] w-full px-[var(--space-lg)]",
|
|
1344
|
+
"rounded-[var(--bloom-radius)] bg-[var(--bloom-surface)]",
|
|
1345
|
+
"border border-[var(--bloom-surface2)]",
|
|
1346
|
+
"text-[length:var(--bloom-text-body)] font-[family-name:var(--bloom-font)] color-[var(--bloom-text)]",
|
|
1347
|
+
"transition-all duration-[var(--bloom-duration)] ease-[var(--bloom-ease)]",
|
|
1348
|
+
"focus-visible:outline-none focus-visible:ring-[4px] focus-visible:ring-[var(--bloom-accent1)]/20 focus-visible:border-[var(--bloom-accent1-deep)]",
|
|
1349
|
+
"disabled:cursor-not-allowed disabled:opacity-50",
|
|
1350
|
+
"data-[placeholder]:color-[var(--bloom-text-secondary)]",
|
|
1351
|
+
className
|
|
1352
|
+
),
|
|
1353
|
+
...props,
|
|
1354
|
+
children: [
|
|
1355
|
+
children,
|
|
1356
|
+
/* @__PURE__ */ _jsxruntime.jsx.call(void 0, SelectPrimitive.Icon, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
1357
|
+
"svg",
|
|
1358
|
+
{
|
|
1359
|
+
width: "16",
|
|
1360
|
+
height: "16",
|
|
1361
|
+
viewBox: "0 0 16 16",
|
|
1362
|
+
fill: "none",
|
|
1363
|
+
stroke: "currentColor",
|
|
1364
|
+
strokeWidth: "1.5",
|
|
1365
|
+
strokeLinecap: "round",
|
|
1366
|
+
strokeLinejoin: "round",
|
|
1367
|
+
children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { d: "M4 6l4 4 4-4" })
|
|
1368
|
+
}
|
|
1369
|
+
) })
|
|
1370
|
+
]
|
|
1371
|
+
}
|
|
1372
|
+
)
|
|
1373
|
+
);
|
|
1374
|
+
SelectTrigger.displayName = "SelectTrigger";
|
|
1375
|
+
var SelectValue = SelectPrimitive.Value;
|
|
1376
|
+
var SelectContent = _react.forwardRef.call(void 0,
|
|
1377
|
+
({ className, children, position = "popper", ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SelectPrimitive.Portal, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
1378
|
+
SelectPrimitive.Content,
|
|
1379
|
+
{
|
|
1380
|
+
ref,
|
|
1381
|
+
position,
|
|
1382
|
+
sideOffset: 8,
|
|
1383
|
+
className: cn(
|
|
1384
|
+
"bloom z-50 min-w-[var(--radix-select-trigger-width)] overflow-hidden",
|
|
1385
|
+
"rounded-[var(--bloom-radius)]",
|
|
1386
|
+
"bg-[var(--bloom-surface)] p-[var(--space-xs)]",
|
|
1387
|
+
"shadow-[var(--bloom-shadow-hover)]",
|
|
1388
|
+
"border border-[var(--bloom-surface2)]",
|
|
1389
|
+
"data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95",
|
|
1390
|
+
"data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95",
|
|
1391
|
+
className
|
|
1392
|
+
),
|
|
1393
|
+
...props,
|
|
1394
|
+
children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
1395
|
+
SelectPrimitive.Viewport,
|
|
1396
|
+
{
|
|
1397
|
+
className: cn(
|
|
1398
|
+
position === "popper" && "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]"
|
|
1399
|
+
),
|
|
1400
|
+
children
|
|
1401
|
+
}
|
|
1402
|
+
)
|
|
1403
|
+
}
|
|
1404
|
+
) })
|
|
1405
|
+
);
|
|
1406
|
+
SelectContent.displayName = "SelectContent";
|
|
1407
|
+
var SelectItem = _react.forwardRef.call(void 0,
|
|
1408
|
+
({ className, children, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0,
|
|
1409
|
+
SelectPrimitive.Item,
|
|
1410
|
+
{
|
|
1411
|
+
ref,
|
|
1412
|
+
className: cn(
|
|
1413
|
+
"relative flex items-center",
|
|
1414
|
+
"rounded-[var(--bloom-radius-sm)]",
|
|
1415
|
+
"px-[var(--space-md)] py-[var(--space-sm)] pl-[var(--space-2xl)]",
|
|
1416
|
+
"text-[length:var(--bloom-text-body)] font-[family-name:var(--bloom-font)] color-[var(--bloom-text)]",
|
|
1417
|
+
"cursor-pointer select-none outline-none",
|
|
1418
|
+
"transition-colors duration-[var(--bloom-duration-fast)]",
|
|
1419
|
+
"data-[highlighted]:bg-[var(--bloom-surface2)]",
|
|
1420
|
+
"data-[disabled]:opacity-50 data-[disabled]:pointer-events-none",
|
|
1421
|
+
className
|
|
1422
|
+
),
|
|
1423
|
+
...props,
|
|
1424
|
+
children: [
|
|
1425
|
+
/* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "absolute left-[var(--space-sm)] flex h-[16px] w-[16px] items-center justify-center", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SelectPrimitive.ItemIndicator, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
1426
|
+
"svg",
|
|
1427
|
+
{
|
|
1428
|
+
width: "12",
|
|
1429
|
+
height: "12",
|
|
1430
|
+
viewBox: "0 0 12 12",
|
|
1431
|
+
fill: "none",
|
|
1432
|
+
stroke: "currentColor",
|
|
1433
|
+
strokeWidth: "2",
|
|
1434
|
+
strokeLinecap: "round",
|
|
1435
|
+
strokeLinejoin: "round",
|
|
1436
|
+
children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { d: "M2.5 6l2.5 2.5 4.5-5" })
|
|
1437
|
+
}
|
|
1438
|
+
) }) }),
|
|
1439
|
+
/* @__PURE__ */ _jsxruntime.jsx.call(void 0, SelectPrimitive.ItemText, { children })
|
|
1440
|
+
]
|
|
1441
|
+
}
|
|
1442
|
+
)
|
|
1443
|
+
);
|
|
1444
|
+
SelectItem.displayName = "SelectItem";
|
|
1445
|
+
var SelectSeparator = _react.forwardRef.call(void 0,
|
|
1446
|
+
({ className, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
1447
|
+
SelectPrimitive.Separator,
|
|
1448
|
+
{
|
|
1449
|
+
ref,
|
|
1450
|
+
className: cn("h-px my-[var(--space-xs)] bg-[var(--bloom-surface2)]", className),
|
|
1451
|
+
...props
|
|
1452
|
+
}
|
|
1453
|
+
)
|
|
1454
|
+
);
|
|
1455
|
+
SelectSeparator.displayName = "SelectSeparator";
|
|
1456
|
+
|
|
1284
1457
|
// src/components/theme/theme.tsx
|
|
1285
1458
|
|
|
1286
1459
|
|
|
@@ -1630,5 +1803,12 @@ var builtInPalettes = [midnightGarden, desertRose, oceanMist];
|
|
|
1630
1803
|
|
|
1631
1804
|
|
|
1632
1805
|
|
|
1633
|
-
|
|
1806
|
+
|
|
1807
|
+
|
|
1808
|
+
|
|
1809
|
+
|
|
1810
|
+
|
|
1811
|
+
|
|
1812
|
+
|
|
1813
|
+
exports.Alert = Alert; exports.AlertDescription = AlertDescription; exports.AlertTitle = AlertTitle; exports.Avatar = Avatar; exports.AvatarGroup = AvatarGroup; exports.Badge = Badge; exports.Button = Button; exports.Card = Card; exports.CardContent = CardContent; exports.CardDescription = CardDescription; exports.CardFooter = CardFooter; exports.CardHeader = CardHeader; exports.CardTitle = CardTitle; exports.Checkbox = Checkbox; exports.DatePicker = DatePicker; exports.Dropdown = Dropdown; exports.DropdownItem = DropdownItem; exports.DropdownSeparator = DropdownSeparator; exports.Input = Input; exports.Modal = Modal; exports.Progress = Progress; exports.ProgressCircular = ProgressCircular; exports.Select = Select; exports.SelectContent = SelectContent; exports.SelectItem = SelectItem; exports.SelectSeparator = SelectSeparator; exports.SelectTrigger = SelectTrigger; exports.SelectValue = SelectValue; exports.Skeleton = Skeleton; exports.Slider = Slider; exports.Tabs = Tabs; exports.TabsContent = TabsContent; exports.TabsList = TabsList; exports.TabsTrigger = TabsTrigger; exports.Textarea = Textarea; exports.ThemeProvider = ThemeProvider; exports.ToastProvider = ToastProvider; exports.Toggle = Toggle; exports.Tooltip = Tooltip; exports.TooltipProvider = TooltipProvider; exports.alertVariants = alertVariants; exports.avatarVariants = avatarVariants; exports.badgeVariants = badgeVariants; exports.bloomSpring = bloomSpring; exports.bloomTransition = bloomTransition; exports.bloomTransitionFast = bloomTransitionFast; exports.bloomTransitionSlow = bloomTransitionSlow; exports.builtInPalettes = builtInPalettes; exports.buttonVariants = buttonVariants; exports.cardHoverLift = cardHoverLift; exports.cardVariants = cardVariants; exports.cn = cn; exports.desertRose = desertRose; exports.fadeIn = fadeIn; exports.hoverLift = hoverLift; exports.inputVariants = inputVariants; exports.midnightGarden = midnightGarden; exports.oceanMist = oceanMist; exports.progressFillVariants = progressFillVariants; exports.progressTrackVariants = progressTrackVariants; exports.skeletonVariants = skeletonVariants; exports.slideUp = slideUp; exports.tabsListVariants = tabsListVariants; exports.toastVariants = toastVariants; exports.useBreathing = useBreathing; exports.useReducedMotion = useReducedMotion; exports.useTheme = useTheme; exports.useToast = useToast;
|
|
1634
1814
|
//# sourceMappingURL=index.cjs.map
|