@ataraui/ataraui-react 0.4.0 → 0.6.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -1116,7 +1116,675 @@ var Popover = ({
1116
1116
  ] });
1117
1117
  };
1118
1118
  Popover.displayName = "Popover";
1119
+ var ToastContext = React13__default.default.createContext(null);
1120
+ var counter = 0;
1121
+ var genId = () => `toast-${++counter}`;
1122
+ var ToastProvider = ({ children }) => {
1123
+ const [toasts, setToasts] = React13__default.default.useState([]);
1124
+ const toast = React13__default.default.useCallback((input) => {
1125
+ const id = genId();
1126
+ setToasts((prev) => [...prev, { ...input, id }]);
1127
+ return id;
1128
+ }, []);
1129
+ const dismiss = React13__default.default.useCallback((id) => {
1130
+ setToasts((prev) => prev.filter((t) => t.id !== id));
1131
+ }, []);
1132
+ const dismissAll = React13__default.default.useCallback(() => {
1133
+ setToasts([]);
1134
+ }, []);
1135
+ return /* @__PURE__ */ jsxRuntime.jsx(ToastContext.Provider, { value: { toasts, toast, dismiss, dismissAll }, children });
1136
+ };
1137
+ var useToast = () => {
1138
+ const ctx = React13__default.default.useContext(ToastContext);
1139
+ if (!ctx) throw new Error("useToast must be used within a ToastProvider");
1140
+ return ctx;
1141
+ };
1142
+ var toastVariants = classVarianceAuthority.cva(
1143
+ "pointer-events-auto relative flex w-80 max-w-[calc(100vw-2rem)] items-start gap-3 overflow-hidden rounded-(--radius-lg) border p-4 pr-8 shadow-lg",
1144
+ {
1145
+ variants: {
1146
+ variant: {
1147
+ default: "border-(--color-neutral-200) bg-white text-(--color-neutral-800)",
1148
+ success: "border-green-200 bg-green-50 text-green-900",
1149
+ warning: "border-yellow-200 bg-yellow-50 text-yellow-900",
1150
+ destructive: "border-red-200 bg-red-50 text-red-900"
1151
+ }
1152
+ },
1153
+ defaultVariants: { variant: "default" }
1154
+ }
1155
+ );
1156
+ var positionClasses = {
1157
+ "top-left": "top-4 left-4 items-start",
1158
+ "top-center": "top-4 left-1/2 -translate-x-1/2 items-center",
1159
+ "top-right": "top-4 right-4 items-end",
1160
+ "bottom-left": "bottom-4 left-4 items-start",
1161
+ "bottom-center": "bottom-4 left-1/2 -translate-x-1/2 items-center",
1162
+ "bottom-right": "bottom-4 right-4 items-end"
1163
+ };
1164
+ var SingleToast = ({ toast, onDismiss, defaultDuration }) => {
1165
+ var _a, _b;
1166
+ const duration = (_a = toast.duration) != null ? _a : defaultDuration;
1167
+ React13__default.default.useEffect(() => {
1168
+ if (duration <= 0) return;
1169
+ const timer = setTimeout(() => onDismiss(toast.id), duration);
1170
+ return () => clearTimeout(timer);
1171
+ }, [duration, onDismiss, toast.id]);
1172
+ return /* @__PURE__ */ jsxRuntime.jsxs(
1173
+ "div",
1174
+ {
1175
+ role: "status",
1176
+ "aria-live": "polite",
1177
+ className: toastVariants({ variant: (_b = toast.variant) != null ? _b : "default" }),
1178
+ children: [
1179
+ toast.icon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "mt-0.5 shrink-0 [&>svg]:size-4", children: toast.icon }),
1180
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 space-y-1", children: [
1181
+ toast.title && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-semibold leading-none", children: toast.title }),
1182
+ toast.description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs opacity-80", children: toast.description }),
1183
+ toast.action && /* @__PURE__ */ jsxRuntime.jsx(
1184
+ "button",
1185
+ {
1186
+ type: "button",
1187
+ onClick: () => {
1188
+ toast.action.onClick();
1189
+ onDismiss(toast.id);
1190
+ },
1191
+ className: "mt-1.5 text-xs font-medium underline underline-offset-2 hover:no-underline focus:outline-none",
1192
+ children: toast.action.label
1193
+ }
1194
+ )
1195
+ ] }),
1196
+ /* @__PURE__ */ jsxRuntime.jsx(
1197
+ "button",
1198
+ {
1199
+ type: "button",
1200
+ "aria-label": "Dismiss",
1201
+ onClick: () => onDismiss(toast.id),
1202
+ className: "absolute right-2 top-2 rounded opacity-50 transition-opacity hover:opacity-100 focus:outline-none focus-visible:ring-2 focus-visible:ring-(--color-primary-500)",
1203
+ children: /* @__PURE__ */ jsxRuntime.jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
1204
+ /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M18 6 6 18" }),
1205
+ /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m6 6 12 12" })
1206
+ ] })
1207
+ }
1208
+ )
1209
+ ]
1210
+ }
1211
+ );
1212
+ };
1213
+ var Toaster = ({
1214
+ position = "bottom-right",
1215
+ defaultDuration = 4e3,
1216
+ className
1217
+ }) => {
1218
+ const { toasts, dismiss } = useToast();
1219
+ const [mounted, setMounted] = React13__default.default.useState(false);
1220
+ React13__default.default.useEffect(() => {
1221
+ setMounted(true);
1222
+ }, []);
1223
+ if (!mounted) return null;
1224
+ return reactDom.createPortal(
1225
+ /* @__PURE__ */ jsxRuntime.jsx(
1226
+ "div",
1227
+ {
1228
+ "aria-label": "Notifications",
1229
+ className: cn(
1230
+ "fixed z-[100] flex flex-col gap-2 pointer-events-none",
1231
+ positionClasses[position],
1232
+ className
1233
+ ),
1234
+ children: toasts.map((t) => /* @__PURE__ */ jsxRuntime.jsx(
1235
+ SingleToast,
1236
+ {
1237
+ toast: t,
1238
+ onDismiss: dismiss,
1239
+ defaultDuration
1240
+ },
1241
+ t.id
1242
+ ))
1243
+ }
1244
+ ),
1245
+ document.body
1246
+ );
1247
+ };
1248
+ Toaster.displayName = "Toaster";
1249
+ ToastProvider.displayName = "ToastProvider";
1250
+ var alertVariants = classVarianceAuthority.cva(
1251
+ "relative flex w-full gap-3 rounded-(--radius-lg) border p-4 text-sm",
1252
+ {
1253
+ variants: {
1254
+ variant: {
1255
+ default: "border-(--color-neutral-200) bg-(--color-neutral-50) text-(--color-neutral-700)",
1256
+ success: "border-green-200 bg-green-50 text-green-800",
1257
+ warning: "border-yellow-200 bg-yellow-50 text-yellow-800",
1258
+ destructive: "border-red-200 bg-red-50 text-red-800"
1259
+ }
1260
+ },
1261
+ defaultVariants: { variant: "default" }
1262
+ }
1263
+ );
1264
+ var Alert = ({
1265
+ variant,
1266
+ icon,
1267
+ onClose,
1268
+ className,
1269
+ children,
1270
+ ...props
1271
+ }) => {
1272
+ return /* @__PURE__ */ jsxRuntime.jsxs(
1273
+ "div",
1274
+ {
1275
+ role: "alert",
1276
+ className: cn(alertVariants({ variant }), className),
1277
+ ...props,
1278
+ children: [
1279
+ icon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "mt-0.5 shrink-0 [&>svg]:size-4", children: icon }),
1280
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1", children }),
1281
+ onClose && /* @__PURE__ */ jsxRuntime.jsx(
1282
+ "button",
1283
+ {
1284
+ type: "button",
1285
+ "aria-label": "Dismiss",
1286
+ onClick: onClose,
1287
+ className: "ml-auto shrink-0 self-start rounded opacity-60 transition-opacity hover:opacity-100 focus:outline-none focus-visible:ring-2 focus-visible:ring-(--color-primary-500)",
1288
+ children: /* @__PURE__ */ jsxRuntime.jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
1289
+ /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M18 6 6 18" }),
1290
+ /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m6 6 12 12" })
1291
+ ] })
1292
+ }
1293
+ )
1294
+ ]
1295
+ }
1296
+ );
1297
+ };
1298
+ Alert.displayName = "Alert";
1299
+ var AlertTitle = ({
1300
+ className,
1301
+ children,
1302
+ ...props
1303
+ }) => /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("font-semibold leading-none tracking-tight", className), ...props, children });
1304
+ AlertTitle.displayName = "AlertTitle";
1305
+ var AlertDescription = ({
1306
+ className,
1307
+ children,
1308
+ ...props
1309
+ }) => /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("mt-1 text-[0.8rem] opacity-80", className), ...props, children });
1310
+ AlertDescription.displayName = "AlertDescription";
1311
+ var progressVariants = classVarianceAuthority.cva(
1312
+ "w-full overflow-hidden rounded-full bg-(--color-neutral-200)",
1313
+ {
1314
+ variants: {
1315
+ size: {
1316
+ sm: "h-1",
1317
+ md: "h-2",
1318
+ lg: "h-3"
1319
+ }
1320
+ },
1321
+ defaultVariants: { size: "md" }
1322
+ }
1323
+ );
1324
+ var Progress = ({
1325
+ value,
1326
+ size,
1327
+ label,
1328
+ showLabel = false,
1329
+ className,
1330
+ ...props
1331
+ }) => {
1332
+ const isIndeterminate = value === void 0 || value === null;
1333
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-full", children: [
1334
+ (label || showLabel) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-1.5 flex items-center justify-between text-xs text-(--color-neutral-600)", children: [
1335
+ label && /* @__PURE__ */ jsxRuntime.jsx("span", { children: label }),
1336
+ showLabel && !isIndeterminate && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "ml-auto font-medium", children: [
1337
+ Math.round(value),
1338
+ "%"
1339
+ ] })
1340
+ ] }),
1341
+ /* @__PURE__ */ jsxRuntime.jsx(
1342
+ "div",
1343
+ {
1344
+ role: "progressbar",
1345
+ "aria-valuemin": 0,
1346
+ "aria-valuemax": 100,
1347
+ "aria-valuenow": isIndeterminate ? void 0 : value,
1348
+ className: cn(progressVariants({ size }), className),
1349
+ ...props,
1350
+ children: /* @__PURE__ */ jsxRuntime.jsx(
1351
+ "div",
1352
+ {
1353
+ className: cn(
1354
+ "h-full rounded-full bg-(--color-primary-500) transition-all duration-300 ease-in-out",
1355
+ isIndeterminate && "w-1/3 animate-[indeterminate_1.5s_ease-in-out_infinite]"
1356
+ ),
1357
+ style: isIndeterminate ? void 0 : { width: `${Math.min(100, Math.max(0, value))}%` }
1358
+ }
1359
+ )
1360
+ }
1361
+ )
1362
+ ] });
1363
+ };
1364
+ Progress.displayName = "Progress";
1365
+ var skeletonVariants = classVarianceAuthority.cva(
1366
+ "animate-pulse bg-(--color-neutral-200)",
1367
+ {
1368
+ variants: {
1369
+ variant: {
1370
+ text: "h-4 w-full rounded",
1371
+ circle: "rounded-full",
1372
+ rect: "rounded-(--radius-md)"
1373
+ }
1374
+ },
1375
+ defaultVariants: { variant: "rect" }
1376
+ }
1377
+ );
1378
+ var Skeleton = ({
1379
+ variant,
1380
+ width,
1381
+ height,
1382
+ className,
1383
+ style,
1384
+ ...props
1385
+ }) => {
1386
+ return /* @__PURE__ */ jsxRuntime.jsx(
1387
+ "div",
1388
+ {
1389
+ "aria-hidden": "true",
1390
+ className: cn(skeletonVariants({ variant }), className),
1391
+ style: {
1392
+ width: typeof width === "number" ? `${width}px` : width,
1393
+ height: typeof height === "number" ? `${height}px` : height,
1394
+ ...style
1395
+ },
1396
+ ...props
1397
+ }
1398
+ );
1399
+ };
1400
+ Skeleton.displayName = "Skeleton";
1401
+ var tabsListVariants = classVarianceAuthority.cva(
1402
+ "flex items-center gap-1 rounded-(--radius-lg) bg-(--color-neutral-100) p-1",
1403
+ {
1404
+ variants: {
1405
+ variant: {
1406
+ default: "bg-(--color-neutral-100)",
1407
+ outline: "bg-transparent border border-(--color-neutral-200)",
1408
+ pills: "bg-transparent gap-2"
1409
+ }
1410
+ },
1411
+ defaultVariants: { variant: "default" }
1412
+ }
1413
+ );
1414
+ var tabsTriggerVariants = classVarianceAuthority.cva(
1415
+ "inline-flex items-center justify-center whitespace-nowrap rounded-(--radius-md) px-3 py-1.5 text-sm font-medium transition-all focus:outline-none focus-visible:ring-2 focus-visible:ring-(--color-primary-500) disabled:pointer-events-none disabled:opacity-50",
1416
+ {
1417
+ variants: {
1418
+ variant: {
1419
+ default: "text-(--color-neutral-500) data-[state=active]:bg-white data-[state=active]:text-(--color-neutral-900) data-[state=active]:shadow-sm",
1420
+ outline: "text-(--color-neutral-500) data-[state=active]:border data-[state=active]:border-(--color-neutral-200) data-[state=active]:bg-white data-[state=active]:text-(--color-neutral-900)",
1421
+ pills: "text-(--color-neutral-500) rounded-full data-[state=active]:bg-(--color-primary-500) data-[state=active]:text-white"
1422
+ }
1423
+ },
1424
+ defaultVariants: { variant: "default" }
1425
+ }
1426
+ );
1427
+ var TabsContext = React13__default.default.createContext(null);
1428
+ var useTabsContext = () => {
1429
+ const ctx = React13__default.default.useContext(TabsContext);
1430
+ if (!ctx) throw new Error("Tabs components must be used within <Tabs>");
1431
+ return ctx;
1432
+ };
1433
+ var Tabs = ({
1434
+ value,
1435
+ defaultValue = "",
1436
+ onChange,
1437
+ variant = "default",
1438
+ className,
1439
+ children,
1440
+ ...props
1441
+ }) => {
1442
+ const [uncontrolled, setUncontrolled] = React13__default.default.useState(defaultValue);
1443
+ const isControlled = value !== void 0;
1444
+ const active = isControlled ? value : uncontrolled;
1445
+ const setActive = React13__default.default.useCallback((val) => {
1446
+ if (!isControlled) setUncontrolled(val);
1447
+ onChange == null ? void 0 : onChange(val);
1448
+ }, [isControlled, onChange]);
1449
+ return /* @__PURE__ */ jsxRuntime.jsx(TabsContext.Provider, { value: { active, setActive, variant }, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("flex flex-col gap-2", className), ...props, children }) });
1450
+ };
1451
+ Tabs.displayName = "Tabs";
1452
+ var TabsList = ({ className, children, ...props }) => {
1453
+ const { variant } = useTabsContext();
1454
+ return /* @__PURE__ */ jsxRuntime.jsx(
1455
+ "div",
1456
+ {
1457
+ role: "tablist",
1458
+ className: cn(tabsListVariants({ variant }), className),
1459
+ ...props,
1460
+ children
1461
+ }
1462
+ );
1463
+ };
1464
+ TabsList.displayName = "TabsList";
1465
+ var TabsTrigger = ({
1466
+ value,
1467
+ className,
1468
+ children,
1469
+ ...props
1470
+ }) => {
1471
+ const { active, setActive, variant } = useTabsContext();
1472
+ const isActive = active === value;
1473
+ return /* @__PURE__ */ jsxRuntime.jsx(
1474
+ "button",
1475
+ {
1476
+ type: "button",
1477
+ role: "tab",
1478
+ "aria-selected": isActive,
1479
+ "data-state": isActive ? "active" : "inactive",
1480
+ onClick: () => setActive(value),
1481
+ className: cn(tabsTriggerVariants({ variant }), className),
1482
+ ...props,
1483
+ children
1484
+ }
1485
+ );
1486
+ };
1487
+ TabsTrigger.displayName = "TabsTrigger";
1488
+ var TabsContent = ({
1489
+ value,
1490
+ className,
1491
+ children,
1492
+ ...props
1493
+ }) => {
1494
+ const { active } = useTabsContext();
1495
+ if (active !== value) return null;
1496
+ return /* @__PURE__ */ jsxRuntime.jsx(
1497
+ "div",
1498
+ {
1499
+ role: "tabpanel",
1500
+ className: cn("mt-2", className),
1501
+ ...props,
1502
+ children
1503
+ }
1504
+ );
1505
+ };
1506
+ TabsContent.displayName = "TabsContent";
1507
+ var accordionVariants = classVarianceAuthority.cva(
1508
+ "w-full",
1509
+ {
1510
+ variants: {
1511
+ variant: {
1512
+ default: "divide-y divide-(--color-neutral-200) rounded-(--radius-lg) border border-(--color-neutral-200)",
1513
+ ghost: "divide-y divide-(--color-neutral-200)",
1514
+ outlined: "flex flex-col gap-2"
1515
+ }
1516
+ },
1517
+ defaultVariants: { variant: "default" }
1518
+ }
1519
+ );
1520
+ var AccordionContext = React13__default.default.createContext(null);
1521
+ var useAccordionContext = () => {
1522
+ const ctx = React13__default.default.useContext(AccordionContext);
1523
+ if (!ctx) throw new Error("Accordion components must be used within <Accordion>");
1524
+ return ctx;
1525
+ };
1526
+ var Accordion = ({
1527
+ type = "single",
1528
+ value,
1529
+ defaultValue,
1530
+ onChange,
1531
+ variant = "default",
1532
+ className,
1533
+ children,
1534
+ ...props
1535
+ }) => {
1536
+ const initOpen = defaultValue ? Array.isArray(defaultValue) ? defaultValue : [defaultValue] : [];
1537
+ const [uncontrolled, setUncontrolled] = React13__default.default.useState(initOpen);
1538
+ const isControlled = value !== void 0;
1539
+ const openItems = isControlled ? Array.isArray(value) ? value : [value] : uncontrolled;
1540
+ const toggle = React13__default.default.useCallback((val) => {
1541
+ var _a;
1542
+ let next;
1543
+ if (type === "single") {
1544
+ next = openItems.includes(val) ? [] : [val];
1545
+ } else {
1546
+ next = openItems.includes(val) ? openItems.filter((v) => v !== val) : [...openItems, val];
1547
+ }
1548
+ if (!isControlled) setUncontrolled(next);
1549
+ onChange == null ? void 0 : onChange(type === "single" ? (_a = next[0]) != null ? _a : "" : next);
1550
+ }, [isControlled, onChange, openItems, type]);
1551
+ return /* @__PURE__ */ jsxRuntime.jsx(AccordionContext.Provider, { value: { openItems, toggle, variant }, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn(accordionVariants({ variant }), className), ...props, children }) });
1552
+ };
1553
+ Accordion.displayName = "Accordion";
1554
+ var AccordionItemContext = React13__default.default.createContext(null);
1555
+ var useAccordionItemContext = () => {
1556
+ const ctx = React13__default.default.useContext(AccordionItemContext);
1557
+ if (!ctx) throw new Error("AccordionTrigger/Content must be used within <AccordionItem>");
1558
+ return ctx;
1559
+ };
1560
+ var AccordionItem = ({
1561
+ value,
1562
+ disabled = false,
1563
+ className,
1564
+ children,
1565
+ ...props
1566
+ }) => {
1567
+ const { openItems, variant } = useAccordionContext();
1568
+ const isOpen = openItems.includes(value);
1569
+ return /* @__PURE__ */ jsxRuntime.jsx(AccordionItemContext.Provider, { value: { value, isOpen, disabled }, children: /* @__PURE__ */ jsxRuntime.jsx(
1570
+ "div",
1571
+ {
1572
+ "data-state": isOpen ? "open" : "closed",
1573
+ className: cn(
1574
+ variant === "outlined" && "rounded-(--radius-lg) border border-(--color-neutral-200)",
1575
+ disabled && "opacity-50 pointer-events-none",
1576
+ className
1577
+ ),
1578
+ ...props,
1579
+ children
1580
+ }
1581
+ ) });
1582
+ };
1583
+ AccordionItem.displayName = "AccordionItem";
1584
+ var AccordionTrigger = ({
1585
+ className,
1586
+ children,
1587
+ ...props
1588
+ }) => {
1589
+ const { toggle } = useAccordionContext();
1590
+ const { value, isOpen } = useAccordionItemContext();
1591
+ return /* @__PURE__ */ jsxRuntime.jsxs(
1592
+ "button",
1593
+ {
1594
+ type: "button",
1595
+ "aria-expanded": isOpen,
1596
+ onClick: () => toggle(value),
1597
+ className: cn(
1598
+ "flex w-full items-center justify-between px-4 py-4 text-sm font-medium text-(--color-neutral-900) transition-all hover:bg-(--color-neutral-50) focus:outline-none focus-visible:ring-2 focus-visible:ring-(--color-primary-500)",
1599
+ className
1600
+ ),
1601
+ ...props,
1602
+ children: [
1603
+ children,
1604
+ /* @__PURE__ */ jsxRuntime.jsx(
1605
+ "svg",
1606
+ {
1607
+ xmlns: "http://www.w3.org/2000/svg",
1608
+ width: "16",
1609
+ height: "16",
1610
+ viewBox: "0 0 24 24",
1611
+ fill: "none",
1612
+ stroke: "currentColor",
1613
+ strokeWidth: "2",
1614
+ strokeLinecap: "round",
1615
+ strokeLinejoin: "round",
1616
+ className: cn("shrink-0 text-(--color-neutral-500) transition-transform duration-200", isOpen && "rotate-180"),
1617
+ children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m6 9 6 6 6-6" })
1618
+ }
1619
+ )
1620
+ ]
1621
+ }
1622
+ );
1623
+ };
1624
+ AccordionTrigger.displayName = "AccordionTrigger";
1625
+ var AccordionContent = ({
1626
+ className,
1627
+ children,
1628
+ ...props
1629
+ }) => {
1630
+ const { isOpen } = useAccordionItemContext();
1631
+ if (!isOpen) return null;
1632
+ return /* @__PURE__ */ jsxRuntime.jsx(
1633
+ "div",
1634
+ {
1635
+ className: cn("px-4 pb-4 text-sm text-(--color-neutral-600)", className),
1636
+ ...props,
1637
+ children
1638
+ }
1639
+ );
1640
+ };
1641
+ AccordionContent.displayName = "AccordionContent";
1642
+ var tableVariants = classVarianceAuthority.cva(
1643
+ "w-full caption-bottom text-sm",
1644
+ {
1645
+ variants: {
1646
+ variant: {
1647
+ default: "",
1648
+ striped: "",
1649
+ bordered: ""
1650
+ }
1651
+ },
1652
+ defaultVariants: { variant: "default" }
1653
+ }
1654
+ );
1655
+ var TableContext = React13__default.default.createContext({ variant: "default" });
1656
+ var Table = ({
1657
+ variant = "default",
1658
+ className,
1659
+ children,
1660
+ ...props
1661
+ }) => {
1662
+ return /* @__PURE__ */ jsxRuntime.jsx(TableContext.Provider, { value: { variant }, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-full overflow-auto rounded-(--radius-lg) border border-(--color-neutral-200)", children: /* @__PURE__ */ jsxRuntime.jsx(
1663
+ "table",
1664
+ {
1665
+ className: cn(tableVariants({ variant }), className),
1666
+ ...props,
1667
+ children
1668
+ }
1669
+ ) }) });
1670
+ };
1671
+ Table.displayName = "Table";
1672
+ var TableHeader = ({
1673
+ className,
1674
+ children,
1675
+ ...props
1676
+ }) => /* @__PURE__ */ jsxRuntime.jsx(
1677
+ "thead",
1678
+ {
1679
+ className: cn("bg-(--color-neutral-50) [&_tr]:border-b [&_tr]:border-(--color-neutral-200)", className),
1680
+ ...props,
1681
+ children
1682
+ }
1683
+ );
1684
+ TableHeader.displayName = "TableHeader";
1685
+ var TableBody = ({
1686
+ className,
1687
+ children,
1688
+ ...props
1689
+ }) => {
1690
+ const { variant } = React13__default.default.useContext(TableContext);
1691
+ return /* @__PURE__ */ jsxRuntime.jsx(
1692
+ "tbody",
1693
+ {
1694
+ className: cn(
1695
+ "[&_tr:last-child]:border-0",
1696
+ variant === "striped" && "[&_tr:nth-child(odd)]:bg-(--color-neutral-50)",
1697
+ className
1698
+ ),
1699
+ ...props,
1700
+ children
1701
+ }
1702
+ );
1703
+ };
1704
+ TableBody.displayName = "TableBody";
1705
+ var TableFooter = ({
1706
+ className,
1707
+ children,
1708
+ ...props
1709
+ }) => /* @__PURE__ */ jsxRuntime.jsx(
1710
+ "tfoot",
1711
+ {
1712
+ className: cn("border-t border-(--color-neutral-200) bg-(--color-neutral-50) font-medium", className),
1713
+ ...props,
1714
+ children
1715
+ }
1716
+ );
1717
+ TableFooter.displayName = "TableFooter";
1718
+ var TableRow = ({
1719
+ className,
1720
+ children,
1721
+ ...props
1722
+ }) => {
1723
+ const { variant } = React13__default.default.useContext(TableContext);
1724
+ return /* @__PURE__ */ jsxRuntime.jsx(
1725
+ "tr",
1726
+ {
1727
+ className: cn(
1728
+ "border-b border-(--color-neutral-200) transition-colors hover:bg-(--color-neutral-50)",
1729
+ variant === "bordered" && "[&_td]:border-r [&_td]:last:border-r-0 [&_th]:border-r [&_th]:last:border-r-0",
1730
+ className
1731
+ ),
1732
+ ...props,
1733
+ children
1734
+ }
1735
+ );
1736
+ };
1737
+ TableRow.displayName = "TableRow";
1738
+ var TableHead = ({
1739
+ className,
1740
+ children,
1741
+ ...props
1742
+ }) => /* @__PURE__ */ jsxRuntime.jsx(
1743
+ "th",
1744
+ {
1745
+ className: cn(
1746
+ "h-10 px-4 text-left align-middle text-xs font-semibold uppercase tracking-wide text-(--color-neutral-500)",
1747
+ className
1748
+ ),
1749
+ ...props,
1750
+ children
1751
+ }
1752
+ );
1753
+ TableHead.displayName = "TableHead";
1754
+ var TableCell = ({
1755
+ className,
1756
+ children,
1757
+ ...props
1758
+ }) => /* @__PURE__ */ jsxRuntime.jsx(
1759
+ "td",
1760
+ {
1761
+ className: cn("px-4 py-3 align-middle text-(--color-neutral-700)", className),
1762
+ ...props,
1763
+ children
1764
+ }
1765
+ );
1766
+ TableCell.displayName = "TableCell";
1767
+ var TableCaption = ({
1768
+ className,
1769
+ children,
1770
+ ...props
1771
+ }) => /* @__PURE__ */ jsxRuntime.jsx(
1772
+ "caption",
1773
+ {
1774
+ className: cn("mt-4 text-sm text-(--color-neutral-500)", className),
1775
+ ...props,
1776
+ children
1777
+ }
1778
+ );
1779
+ TableCaption.displayName = "TableCaption";
1119
1780
 
1781
+ exports.Accordion = Accordion;
1782
+ exports.AccordionContent = AccordionContent;
1783
+ exports.AccordionItem = AccordionItem;
1784
+ exports.AccordionTrigger = AccordionTrigger;
1785
+ exports.Alert = Alert;
1786
+ exports.AlertDescription = AlertDescription;
1787
+ exports.AlertTitle = AlertTitle;
1120
1788
  exports.Avatar = Avatar;
1121
1789
  exports.Badge = Badge;
1122
1790
  exports.Button = Button;
@@ -1141,12 +1809,30 @@ exports.ModalFooter = ModalFooter;
1141
1809
  exports.ModalHeader = ModalHeader;
1142
1810
  exports.ModalTitle = ModalTitle;
1143
1811
  exports.Popover = Popover;
1812
+ exports.Progress = Progress;
1144
1813
  exports.RadioGroup = RadioGroup;
1145
1814
  exports.Select = Select;
1146
1815
  exports.Separator = Separator;
1816
+ exports.Skeleton = Skeleton;
1147
1817
  exports.Spinner = Spinner;
1148
1818
  exports.Switch = Switch;
1819
+ exports.Table = Table;
1820
+ exports.TableBody = TableBody;
1821
+ exports.TableCaption = TableCaption;
1822
+ exports.TableCell = TableCell;
1823
+ exports.TableFooter = TableFooter;
1824
+ exports.TableHead = TableHead;
1825
+ exports.TableHeader = TableHeader;
1826
+ exports.TableRow = TableRow;
1827
+ exports.Tabs = Tabs;
1828
+ exports.TabsContent = TabsContent;
1829
+ exports.TabsList = TabsList;
1830
+ exports.TabsTrigger = TabsTrigger;
1831
+ exports.ToastProvider = ToastProvider;
1832
+ exports.Toaster = Toaster;
1149
1833
  exports.Tooltip = Tooltip;
1834
+ exports.accordionVariants = accordionVariants;
1835
+ exports.alertVariants = alertVariants;
1150
1836
  exports.avatarVariants = avatarVariants;
1151
1837
  exports.badgeVariants = badgeVariants;
1152
1838
  exports.buttonVariants = buttonVariants;
@@ -1157,9 +1843,16 @@ exports.drawerVariants = drawerVariants;
1157
1843
  exports.fontSize = fontSize;
1158
1844
  exports.inputVariants = inputVariants;
1159
1845
  exports.modalVariants = modalVariants;
1846
+ exports.progressVariants = progressVariants;
1160
1847
  exports.radius = radius;
1161
1848
  exports.selectVariants = selectVariants;
1162
1849
  exports.separatorVariants = separatorVariants;
1850
+ exports.skeletonVariants = skeletonVariants;
1163
1851
  exports.spinnerVariants = spinnerVariants;
1852
+ exports.tableVariants = tableVariants;
1853
+ exports.tabsListVariants = tabsListVariants;
1854
+ exports.tabsTriggerVariants = tabsTriggerVariants;
1855
+ exports.toastVariants = toastVariants;
1856
+ exports.useToast = useToast;
1164
1857
  //# sourceMappingURL=index.js.map
1165
1858
  //# sourceMappingURL=index.js.map