@dilipod/ui 0.2.6 → 0.2.7

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.mjs CHANGED
@@ -5,13 +5,14 @@ import { clsx } from 'clsx';
5
5
  import { twMerge } from 'tailwind-merge';
6
6
  import { jsxs, jsx } from 'react/jsx-runtime';
7
7
  import * as SheetPrimitive from '@radix-ui/react-dialog';
8
- import { X, Check, CaretDown, CaretRight, Circle } from '@phosphor-icons/react';
8
+ import { X, Check, CaretDown, CaretRight, Circle, Info, WarningCircle, CheckCircle } from '@phosphor-icons/react';
9
9
  export { AddressBook, ArrowLeft, ArrowRight, ArrowSquareOut, ArrowUpRight, Brain, Briefcase, Buildings, Calendar, CaretDown, CaretRight, CaretUp, ChartBar, ChartLineUp, ChatCircle, Check, CheckCircle, CheckSquare, Circle, Clock, Copy, Crosshair, Database, DotsThree, DotsThreeVertical, Download, Envelope, EnvelopeSimple, Eye, EyeSlash, File, FileText, Files, FirstAid, Funnel, Gear, GearSix, Globe, Handshake, House, Info, Lightning, Link, LinkedinLogo, List, MagnifyingGlass, Minus, Pause, PencilSimple, Phone, Play, Plus, Question, Quotes, Receipt, Robot, Rocket, ShieldCheck, ShoppingCart, SignIn, SignOut, SortAscending, SortDescending, Stop, Target, Trash, TrendUp, Upload, User, UserCircleCheck, UserPlus, Users, UsersThree, VideoCamera, Wallet, Warning, WarningCircle, X, XLogo } from '@phosphor-icons/react';
10
10
  import 'react-dom';
11
11
  import * as AccordionPrimitive from '@radix-ui/react-accordion';
12
12
  import * as NavigationMenuPrimitive from '@radix-ui/react-navigation-menu';
13
13
  import * as AvatarPrimitive from '@radix-ui/react-avatar';
14
14
  import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
15
+ import * as ToastPrimitives from '@radix-ui/react-toast';
15
16
 
16
17
  // src/components/button.tsx
17
18
  function cn(...inputs) {
@@ -1142,6 +1143,7 @@ var Sidebar = React21.forwardRef(
1142
1143
  pathname,
1143
1144
  searchButton,
1144
1145
  helpLink,
1146
+ assistantButton,
1145
1147
  header,
1146
1148
  LinkComponent,
1147
1149
  className,
@@ -1187,7 +1189,7 @@ var Sidebar = React21.forwardRef(
1187
1189
  item.name
1188
1190
  )) }),
1189
1191
  children,
1190
- (bottomNav.length > 0 || helpLink) && /* @__PURE__ */ jsxs("div", { className: "px-3 pb-3 space-y-1 border-t pt-3", children: [
1192
+ (bottomNav.length > 0 || helpLink || assistantButton) && /* @__PURE__ */ jsxs("div", { className: "px-3 pb-3 space-y-1 border-t pt-3", children: [
1191
1193
  bottomNav.map((item) => /* @__PURE__ */ jsx(
1192
1194
  SidebarNavItem,
1193
1195
  {
@@ -1197,6 +1199,17 @@ var Sidebar = React21.forwardRef(
1197
1199
  },
1198
1200
  item.name
1199
1201
  )),
1202
+ assistantButton && /* @__PURE__ */ jsxs(
1203
+ "button",
1204
+ {
1205
+ onClick: assistantButton.onClick,
1206
+ className: "flex w-full items-center gap-3 rounded-sm px-3 py-2 text-sm bg-[var(--cyan)]/10 text-[var(--black)] hover:bg-[var(--cyan)]/20 transition-colors font-medium",
1207
+ children: [
1208
+ assistantButton.icon && /* @__PURE__ */ jsx(assistantButton.icon, { className: "h-4 w-4 text-[var(--cyan)]" }),
1209
+ assistantButton.label
1210
+ ]
1211
+ }
1212
+ ),
1200
1213
  helpLink && /* @__PURE__ */ jsxs(
1201
1214
  "a",
1202
1215
  {
@@ -1303,7 +1316,7 @@ var CodeBlock = React21.forwardRef(
1303
1316
  );
1304
1317
  CodeBlock.displayName = "CodeBlock";
1305
1318
  var FormField = React21.forwardRef(
1306
- ({ label, error, helperText, required, id, className, children, ...props }, ref) => {
1319
+ ({ label, error, helperText, hint, required, id, className, children, ...props }, ref) => {
1307
1320
  const fieldId = id || React21.useId();
1308
1321
  const errorId = `${fieldId}-error`;
1309
1322
  const helperId = `${fieldId}-helper`;
@@ -1323,7 +1336,10 @@ var FormField = React21.forwardRef(
1323
1336
  return child;
1324
1337
  });
1325
1338
  return /* @__PURE__ */ jsxs("div", { ref, className: cn("space-y-2", className), ...props, children: [
1326
- label && /* @__PURE__ */ jsx(Label2, { htmlFor: fieldId, className: required ? 'after:content-["*"] after:ml-0.5 after:text-red-500' : "", children: label }),
1339
+ (label || hint) && /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
1340
+ label && /* @__PURE__ */ jsx(Label2, { htmlFor: fieldId, className: required ? 'after:content-["*"] after:ml-0.5 after:text-red-500' : "", children: label }),
1341
+ hint && /* @__PURE__ */ jsx("div", { children: hint })
1342
+ ] }),
1327
1343
  enhancedChildren,
1328
1344
  error && /* @__PURE__ */ jsx("p", { id: errorId, className: "text-sm text-red-600", role: "alert", children: error }),
1329
1345
  helperText && !error && /* @__PURE__ */ jsx("p", { id: helperId, className: "text-xs text-muted-foreground", children: helperText })
@@ -1430,7 +1446,239 @@ var Divider = React21.forwardRef(
1430
1446
  }
1431
1447
  );
1432
1448
  Divider.displayName = "Divider";
1449
+ var ToastProvider = ToastPrimitives.Provider;
1450
+ var ToastViewport = React21.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
1451
+ ToastPrimitives.Viewport,
1452
+ {
1453
+ ref,
1454
+ className: cn(
1455
+ "fixed bottom-0 right-0 z-[100] flex max-h-screen w-full flex-col-reverse p-4 sm:max-w-[420px]",
1456
+ className
1457
+ ),
1458
+ ...props
1459
+ }
1460
+ ));
1461
+ ToastViewport.displayName = ToastPrimitives.Viewport.displayName;
1462
+ var toastVariants = cva(
1463
+ "group pointer-events-auto relative flex w-full items-center justify-between space-x-4 overflow-hidden rounded-sm border p-4 shadow-lg transition-all data-[swipe=cancel]:translate-x-0 data-[swipe=end]:translate-x-[var(--radix-toast-swipe-end-x)] data-[swipe=move]:translate-x-[var(--radix-toast-swipe-move-x)] data-[swipe=move]:transition-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[swipe=end]:animate-out data-[state=closed]:fade-out-80 data-[state=closed]:slide-out-to-right-full data-[state=open]:slide-in-from-bottom-full",
1464
+ {
1465
+ variants: {
1466
+ variant: {
1467
+ default: "border-gray-200 bg-white text-[var(--black)]",
1468
+ success: "border-emerald-200 bg-emerald-50 text-emerald-900",
1469
+ error: "border-red-200 bg-red-50 text-red-900",
1470
+ warning: "border-amber-200 bg-amber-50 text-amber-900"
1471
+ }
1472
+ },
1473
+ defaultVariants: {
1474
+ variant: "default"
1475
+ }
1476
+ }
1477
+ );
1478
+ var Toast = React21.forwardRef(({ className, variant, ...props }, ref) => {
1479
+ return /* @__PURE__ */ jsx(
1480
+ ToastPrimitives.Root,
1481
+ {
1482
+ ref,
1483
+ className: cn(toastVariants({ variant }), className),
1484
+ ...props
1485
+ }
1486
+ );
1487
+ });
1488
+ Toast.displayName = ToastPrimitives.Root.displayName;
1489
+ var ToastAction = React21.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
1490
+ ToastPrimitives.Action,
1491
+ {
1492
+ ref,
1493
+ className: cn(
1494
+ "inline-flex h-8 shrink-0 items-center justify-center rounded-sm border bg-transparent px-3 text-sm font-medium ring-offset-background transition-colors hover:bg-gray-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",
1495
+ className
1496
+ ),
1497
+ ...props
1498
+ }
1499
+ ));
1500
+ ToastAction.displayName = ToastPrimitives.Action.displayName;
1501
+ var ToastClose = React21.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
1502
+ ToastPrimitives.Close,
1503
+ {
1504
+ ref,
1505
+ className: cn(
1506
+ "absolute right-2 top-2 rounded-sm p-1 text-gray-500 opacity-0 transition-opacity hover:text-gray-900 focus:opacity-100 focus:outline-none focus:ring-2 group-hover:opacity-100",
1507
+ className
1508
+ ),
1509
+ "toast-close": "",
1510
+ ...props,
1511
+ children: /* @__PURE__ */ jsx(X, { size: 16 })
1512
+ }
1513
+ ));
1514
+ ToastClose.displayName = ToastPrimitives.Close.displayName;
1515
+ var ToastTitle = React21.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
1516
+ ToastPrimitives.Title,
1517
+ {
1518
+ ref,
1519
+ className: cn("text-sm font-semibold", className),
1520
+ ...props
1521
+ }
1522
+ ));
1523
+ ToastTitle.displayName = ToastPrimitives.Title.displayName;
1524
+ var ToastDescription = React21.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
1525
+ ToastPrimitives.Description,
1526
+ {
1527
+ ref,
1528
+ className: cn("text-sm opacity-90", className),
1529
+ ...props
1530
+ }
1531
+ ));
1532
+ ToastDescription.displayName = ToastPrimitives.Description.displayName;
1533
+ var ToastIcon = ({ variant }) => {
1534
+ switch (variant) {
1535
+ case "success":
1536
+ return /* @__PURE__ */ jsx(CheckCircle, { size: 20, weight: "fill", className: "text-emerald-600" });
1537
+ case "error":
1538
+ return /* @__PURE__ */ jsx(WarningCircle, { size: 20, weight: "fill", className: "text-red-600" });
1539
+ case "warning":
1540
+ return /* @__PURE__ */ jsx(WarningCircle, { size: 20, weight: "fill", className: "text-amber-600" });
1541
+ default:
1542
+ return /* @__PURE__ */ jsx(Info, { size: 20, weight: "fill", className: "text-gray-600" });
1543
+ }
1544
+ };
1545
+ var TOAST_LIMIT = 5;
1546
+ var TOAST_REMOVE_DELAY = 5e3;
1547
+ var count = 0;
1548
+ function genId() {
1549
+ count = (count + 1) % Number.MAX_SAFE_INTEGER;
1550
+ return count.toString();
1551
+ }
1552
+ var toastTimeouts = /* @__PURE__ */ new Map();
1553
+ var addToRemoveQueue = (toastId) => {
1554
+ if (toastTimeouts.has(toastId)) {
1555
+ return;
1556
+ }
1557
+ const timeout = setTimeout(() => {
1558
+ toastTimeouts.delete(toastId);
1559
+ dispatch({
1560
+ type: "REMOVE_TOAST",
1561
+ toastId
1562
+ });
1563
+ }, TOAST_REMOVE_DELAY);
1564
+ toastTimeouts.set(toastId, timeout);
1565
+ };
1566
+ var reducer = (state, action) => {
1567
+ switch (action.type) {
1568
+ case "ADD_TOAST":
1569
+ return {
1570
+ ...state,
1571
+ toasts: [action.toast, ...state.toasts].slice(0, TOAST_LIMIT)
1572
+ };
1573
+ case "UPDATE_TOAST":
1574
+ return {
1575
+ ...state,
1576
+ toasts: state.toasts.map(
1577
+ (t) => t.id === action.toast.id ? { ...t, ...action.toast } : t
1578
+ )
1579
+ };
1580
+ case "DISMISS_TOAST": {
1581
+ const { toastId } = action;
1582
+ if (toastId) {
1583
+ addToRemoveQueue(toastId);
1584
+ } else {
1585
+ state.toasts.forEach((toast2) => {
1586
+ addToRemoveQueue(toast2.id);
1587
+ });
1588
+ }
1589
+ return {
1590
+ ...state,
1591
+ toasts: state.toasts.map(
1592
+ (t) => t.id === toastId || toastId === void 0 ? {
1593
+ ...t,
1594
+ open: false
1595
+ } : t
1596
+ )
1597
+ };
1598
+ }
1599
+ case "REMOVE_TOAST":
1600
+ if (action.toastId === void 0) {
1601
+ return {
1602
+ ...state,
1603
+ toasts: []
1604
+ };
1605
+ }
1606
+ return {
1607
+ ...state,
1608
+ toasts: state.toasts.filter((t) => t.id !== action.toastId)
1609
+ };
1610
+ }
1611
+ };
1612
+ var listeners = [];
1613
+ var memoryState = { toasts: [] };
1614
+ function dispatch(action) {
1615
+ memoryState = reducer(memoryState, action);
1616
+ listeners.forEach((listener) => {
1617
+ listener(memoryState);
1618
+ });
1619
+ }
1620
+ function toast({ ...props }) {
1621
+ const id = genId();
1622
+ const update = (props2) => dispatch({
1623
+ type: "UPDATE_TOAST",
1624
+ toast: { ...props2, id }
1625
+ });
1626
+ const dismiss = () => dispatch({ type: "DISMISS_TOAST", toastId: id });
1627
+ dispatch({
1628
+ type: "ADD_TOAST",
1629
+ toast: {
1630
+ ...props,
1631
+ id,
1632
+ open: true,
1633
+ onOpenChange: (open) => {
1634
+ if (!open) dismiss();
1635
+ }
1636
+ }
1637
+ });
1638
+ return {
1639
+ id,
1640
+ dismiss,
1641
+ update
1642
+ };
1643
+ }
1644
+ function useToast() {
1645
+ const [state, setState] = React21.useState(memoryState);
1646
+ React21.useEffect(() => {
1647
+ listeners.push(setState);
1648
+ return () => {
1649
+ const index = listeners.indexOf(setState);
1650
+ if (index > -1) {
1651
+ listeners.splice(index, 1);
1652
+ }
1653
+ };
1654
+ }, [state]);
1655
+ return {
1656
+ ...state,
1657
+ toast,
1658
+ dismiss: (toastId) => dispatch({ type: "DISMISS_TOAST", toastId })
1659
+ };
1660
+ }
1661
+ function Toaster() {
1662
+ const { toasts } = useToast();
1663
+ return /* @__PURE__ */ jsxs(ToastProvider, { children: [
1664
+ toasts.map(function({ id, title, description, action, variant, ...props }) {
1665
+ const safeVariant = variant ?? void 0;
1666
+ return /* @__PURE__ */ jsxs(Toast, { variant: safeVariant, ...props, children: [
1667
+ /* @__PURE__ */ jsxs("div", { className: "flex gap-3", children: [
1668
+ /* @__PURE__ */ jsx(ToastIcon, { variant: safeVariant }),
1669
+ /* @__PURE__ */ jsxs("div", { className: "grid gap-1", children: [
1670
+ title && /* @__PURE__ */ jsx(ToastTitle, { children: title }),
1671
+ description && /* @__PURE__ */ jsx(ToastDescription, { children: description })
1672
+ ] })
1673
+ ] }),
1674
+ action,
1675
+ /* @__PURE__ */ jsx(ToastClose, {})
1676
+ ] }, id);
1677
+ }),
1678
+ /* @__PURE__ */ jsx(ToastViewport, {})
1679
+ ] });
1680
+ }
1433
1681
 
1434
- export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, Avatar, AvatarFallback, AvatarImage, Badge, Button, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Checkbox, CodeBlock, Divider, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EmptyState, FormField, IconBox, Input, Label2 as Label, Logo, NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, NavigationMenuViewport, Progress, Separator2 as Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Sidebar, SidebarNavItem, Stat, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tag, Textarea, alertVariants, badgeVariants, buttonVariants, cn, iconBoxVariants, navigationMenuTriggerStyle, progressVariants, statVariants, tagVariants, valueVariants };
1682
+ export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, Avatar, AvatarFallback, AvatarImage, Badge, Button, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Checkbox, CodeBlock, Divider, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EmptyState, FormField, IconBox, Input, Label2 as Label, Logo, NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, NavigationMenuViewport, Progress, Separator2 as Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Sidebar, SidebarNavItem, Stat, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tag, Textarea, Toast, ToastAction, ToastClose, ToastDescription, ToastIcon, ToastProvider, ToastTitle, ToastViewport, Toaster, alertVariants, badgeVariants, buttonVariants, cn, iconBoxVariants, navigationMenuTriggerStyle, progressVariants, statVariants, tagVariants, toast, useToast, valueVariants };
1435
1683
  //# sourceMappingURL=index.mjs.map
1436
1684
  //# sourceMappingURL=index.mjs.map