rgm-design-system 2.1.0 → 2.1.2

package/dist/index.js

@@ -12,7 +12,7 @@ import { cjk as Jt } from "@streamdown/cjk";
 import { math as Qt } from "@streamdown/math";
 import { GripVerticalIcon as pt, CornerDownRightIcon as ea, PencilLineIcon as ta, Trash2Icon as ft, ArrowUpIcon as aa, ChevronDownIcon as Y, MoreHorizontal as ra, ChevronRight as na, ChevronLeftIcon as gt, ChevronRightIcon as ae, ArrowRight as oa, ArrowLeft as ia, CheckIcon as re, XIcon as ne, SearchIcon as sa, CircleIcon as De, MinusIcon as la, MoreHorizontalIcon as Te, ChevronUpIcon as bt, PanelLeftIcon as da, Loader2Icon as ht, OctagonXIcon as ca, TriangleAlertIcon as ua, InfoIcon as ma, CircleCheckIcon as pa, GitBranchIcon as fa, TrendingUpIcon as vt, BookmarkIcon as xt, DatabaseIcon as ga, Table2Icon as ba, SlidersHorizontalIcon as ha, ListIcon as va, FilterIcon as xa, Code2Icon as wa, CopyIcon as wt, MenuIcon as ya, PlusIcon as yt, SettingsIcon as Na, Maximize2Icon as za, Clock3Icon as ka, PencilIcon as Ca } from "lucide-react";
 import { cva as B } from "class-variance-authority";
-import { Slot as V, Accordion as te, AlertDialog as X, AspectRatio as _a, Avatar as Ge, Separator as Ia, Checkbox as tt, Collapsible as Oe, Dialog as R, ContextMenu as j, Direction as Nt, DropdownMenu as $, Label as Sa, HoverCard as we, Menubar as L, NavigationMenu as J, Popover as pe, Progress as at, RadioGroup as Le, ScrollArea as me, Select as O, Tooltip as ie, Slider as ve, Switch as rt, Tabs as Me, Toggle as Da, ToggleGroup as zt } from "radix-ui";
+import { Slot as V, Accordion as te, AlertDialog as X, AspectRatio as _a, Avatar as Ge, Separator as Ia, Checkbox as tt, Collapsible as Oe, Dialog as R, ContextMenu as j, Direction as Nt, DropdownMenu as $, Label as Sa, HoverCard as we, Menubar as L, NavigationMenu as J, Popover as me, Progress as at, RadioGroup as Le, ScrollArea as ue, Select as O, Tooltip as pe, Slider as ve, Switch as rt, Tabs as Me, Toggle as Da, ToggleGroup as zt } from "radix-ui";
 import { getDefaultClassNames as kt, DayPicker as Ta } from "react-day-picker";
 import Ma from "embla-carousel-react";
 import * as Be from "recharts";
@@ -24,7 +24,7 @@ import { OTPInput as $a, OTPInputContext as La } from "input-otp";
 import * as He from "react-resizable-panels";
 import { useTheme as Ea } from "next-themes";
 import { Toaster as Fa } from "sonner";
-import { useReducedMotion as Ct, motion as ue, AnimatePresence as Ga } from "motion/react";
+import { useReducedMotion as Ct, motion as ce, AnimatePresence as Ga } from "motion/react";
 function r(...e) {
   return Wt(Ut(e));
 }
@@ -494,7 +494,7 @@ const Wa = "rounded-xl border border-input bg-card px-3 py-2 shadow-xs focus-wit
     placeholder: S = "Ask anything...",
     onKeyDown: A,
     "aria-label": H = "Chat message",
-    ...le
+    ...se
   }, ee) {
     const K = p.useRef(null), x = s !== void 0, [T, I] = p.useState(c), E = x ? s : T, q = E.trim().length > 0 && !C, F = t ?? {
       disabled: !q,
@@ -514,7 +514,7 @@ const Wa = "rounded-xl border border-input bg-card px-3 py-2 shadow-xs focus-wit
     function ge() {
       q && (l == null || l(E), x || I(""));
     }
-    function de(P) {
+    function le(P) {
       W(P.content), y == null || y(P), b == null || b(P.id), queueMicrotask(() => {
         const U = K.current;
         U == null || U.focus(), U == null || U.setSelectionRange(
@@ -530,7 +530,7 @@ const Wa = "rounded-xl border border-input bg-card px-3 py-2 shadow-xs focus-wit
           {
             className: "pb-5",
             messages: h,
-            onEditMessage: de,
+            onEditMessage: le,
             onRemoveMessage: b,
             onReorderMessage: v
           }
@@ -539,7 +539,7 @@ const Wa = "rounded-xl border border-input bg-card px-3 py-2 shadow-xs focus-wit
           /* @__PURE__ */ a(
             Ve,
             {
-              ...le,
+              ...se,
               "aria-label": H,
               className: r(
                 "relative z-10 resize-none overflow-hidden border-0 bg-transparent text-foreground shadow-none outline-none placeholder:text-muted-foreground focus-visible:ring-0 dark:bg-transparent",
@@ -577,7 +577,7 @@ const Wa = "rounded-xl border border-input bg-card px-3 py-2 shadow-xs focus-wit
         z,
         {
           asChild: !0,
-          className: "mt-3 mb-0 w-full max-w-[50rem] pr-1 text-right font-medium leading-none text-muted-foreground/70",
+          className: "mt-3 mb-0 w-full max-w-[50rem] pr-1 text-right text-xs font-medium leading-none text-muted-foreground/70",
           variant: "small",
           children: /* @__PURE__ */ a("p", { children: i })
         }
@@ -1092,7 +1092,7 @@ function mo({
     }
   );
 }
-function se({
+function ie({
   className: e,
   orientation: t = "horizontal",
   decorative: n = !0,
@@ -1165,7 +1165,7 @@ function go({
   ...n
 }) {
   return /* @__PURE__ */ a(
-    se,
+    ie,
     {
       "data-slot": "button-group-separator",
       orientation: t,
@@ -2414,7 +2414,7 @@ function Ce({ className: e, ...t }) {
     "div",
     {
       "data-slot": "dialog-header",
-      className: r("flex flex-col gap-2 text-center sm:text-left", e),
+      className: r("flex flex-col gap-2 text-left", e),
       ...t
     }
   );
@@ -3448,7 +3448,7 @@ function rs({
       ),
       ...n,
       children: [
-        /* @__PURE__ */ a(se, { className: "absolute inset-0 top-1/2" }),
+        /* @__PURE__ */ a(ie, { className: "absolute inset-0 top-1/2" }),
         e && /* @__PURE__ */ a(
           "span",
           {
@@ -3684,7 +3684,7 @@ function ws({
   ...t
 }) {
   return /* @__PURE__ */ a(
-    se,
+    ie,
     {
       "data-slot": "item-separator",
       orientation: "horizontal",
@@ -4417,14 +4417,14 @@ function sl({
 function ll({
   ...e
 }) {
-  return /* @__PURE__ */ a(pe.Root, { "data-slot": "popover", ...e });
+  return /* @__PURE__ */ a(me.Root, { "data-slot": "popover", ...e });
 }
 function dl({
   className: e,
   ...t
 }) {
   return /* @__PURE__ */ a(
-    pe.Trigger,
+    me.Trigger,
     {
       "data-slot": "popover-trigger",
       className: r("cursor-pointer", e),
@@ -4438,8 +4438,8 @@ function cl({
   sideOffset: n = 4,
   ...o
 }) {
-  return /* @__PURE__ */ a(pe.Portal, { children: /* @__PURE__ */ a(
-    pe.Content,
+  return /* @__PURE__ */ a(me.Portal, { children: /* @__PURE__ */ a(
+    me.Content,
     {
       "data-slot": "popover-content",
       align: t,
@@ -4455,7 +4455,7 @@ function cl({
 function ul({
   ...e
 }) {
-  return /* @__PURE__ */ a(pe.Anchor, { "data-slot": "popover-anchor", ...e });
+  return /* @__PURE__ */ a(me.Anchor, { "data-slot": "popover-anchor", ...e });
 }
 function ml({ className: e, ...t }) {
   return /* @__PURE__ */ a(
@@ -4595,14 +4595,14 @@ function Fe({
   ...n
 }) {
   return /* @__PURE__ */ d(
-    me.Root,
+    ue.Root,
     {
       "data-slot": "scroll-area",
       className: r("relative", e),
       ...n,
       children: [
         /* @__PURE__ */ a(
-          me.Viewport,
+          ue.Viewport,
           {
             "data-slot": "scroll-area-viewport",
             className: "size-full rounded-[inherit] transition-[color,box-shadow] outline-none focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1",
@@ -4610,7 +4610,7 @@ function Fe({
           }
         ),
         /* @__PURE__ */ a(Rr, {}),
-        /* @__PURE__ */ a(me.Corner, {})
+        /* @__PURE__ */ a(ue.Corner, {})
       ]
     }
   );
@@ -4621,7 +4621,7 @@ function Rr({
   ...n
 }) {
   return /* @__PURE__ */ a(
-    me.ScrollAreaScrollbar,
+    ue.ScrollAreaScrollbar,
     {
       "data-slot": "scroll-area-scrollbar",
       orientation: t,
@@ -4633,7 +4633,7 @@ function Rr({
       ),
       ...n,
       children: /* @__PURE__ */ a(
-        me.ScrollAreaThumb,
+        ue.ScrollAreaThumb,
         {
           "data-slot": "scroll-area-thumb",
           className: "relative flex-1 rounded-full bg-border"
@@ -4965,11 +4965,11 @@ function lt({ className: e, ...t }) {
   );
 }
 function Ue({
-  delayDuration: e = 0,
+  delayDuration: e = 500,
   ...t
 }) {
   return /* @__PURE__ */ a(
-    ie.Provider,
+    pe.Provider,
     {
       "data-slot": "tooltip-provider",
       delayDuration: e,
@@ -4980,14 +4980,14 @@ function Ue({
 function We({
   ...e
 }) {
-  return /* @__PURE__ */ a(ie.Root, { "data-slot": "tooltip", ...e });
+  return /* @__PURE__ */ a(pe.Root, { "data-slot": "tooltip", ...e });
 }
 function Xe({
   className: e,
   ...t
 }) {
   return /* @__PURE__ */ a(
-    ie.Trigger,
+    pe.Trigger,
     {
       "data-slot": "tooltip-trigger",
       className: r("cursor-pointer", e),
@@ -5001,8 +5001,8 @@ function Ze({
   children: n,
   ...o
 }) {
-  return /* @__PURE__ */ a(ie.Portal, { children: /* @__PURE__ */ d(
-    ie.Content,
+  return /* @__PURE__ */ a(pe.Portal, { children: /* @__PURE__ */ a(
+    pe.Content,
     {
       "data-slot": "tooltip-content",
       sideOffset: t,
@@ -5011,10 +5011,7 @@ function Ze({
         e
       ),
       ...o,
-      children: [
-        n,
-        /* @__PURE__ */ a(ie.Arrow, { className: "z-(--layer-tooltip) size-2.5 translate-y-[calc(-50%_-_2px)] rotate-45 rounded-[2px] bg-foreground fill-foreground" })
-      ]
+      children: n
     }
   ) });
 }
@@ -5059,7 +5056,7 @@ function Tl({
     }),
     [y, N, g, u, l, m, h]
   );
-  return /* @__PURE__ */ a(Ot.Provider, { value: b, children: /* @__PURE__ */ a(Ue, { delayDuration: 0, children: /* @__PURE__ */ a(
+  return /* @__PURE__ */ a(Ot.Provider, { value: b, children: /* @__PURE__ */ a(Ue, { children: /* @__PURE__ */ a(
     "div",
     {
       "data-slot": "sidebar-wrapper",
@@ -5269,7 +5266,7 @@ function El({
   ...t
 }) {
   return /* @__PURE__ */ a(
-    se,
+    ie,
     {
       "data-slot": "sidebar-separator",
       "data-sidebar": "separator",
@@ -6719,7 +6716,7 @@ function zd({
   recents: S,
   recentDeleteDialogLabels: A,
   recentRenameDialogLabels: H,
-  recentsTitle: le = "Recents",
+  recentsTitle: se = "Recents",
   renderRecentAction: ee,
   renderSavedPromptAction: K,
   savedPrompts: x,
@@ -6727,7 +6724,7 @@ function zd({
   savedPromptsTitle: I = "Saved Prompts",
   ...E
 }) {
-  const [q, F] = p.useState(null), [W, ge] = p.useState(null), [de, P] = p.useState(""), U = p.useRef(null), Ye = p.useRef(null), ce = {
+  const [q, F] = p.useState(null), [W, ge] = p.useState(null), [le, P] = p.useState(""), U = p.useRef(null), Ye = p.useRef(null), de = {
     title: "Rename conversation",
     description: "Choose a name that will be easy to recognize later.",
     inputLabel: "Conversation name",
@@ -6756,7 +6753,7 @@ function zd({
       "div",
       {
         className: r(
-          "flex min-h-0 w-full flex-col gap-3 bg-card text-sm text-card-foreground",
+          "flex min-h-0 w-full flex-col gap-3 bg-card px-2 text-sm text-card-foreground",
           i
         ),
         ...E,
@@ -6774,8 +6771,8 @@ function zd({
               ]
             }
           ),
-          /* @__PURE__ */ a(se, {}),
-          /* @__PURE__ */ a(Fe, { className: "min-h-0 flex-1", children: /* @__PURE__ */ d("div", { className: "grid gap-4 pr-2", children: [
+          /* @__PURE__ */ a(ie, {}),
+          /* @__PURE__ */ a(Fe, { className: "min-h-0 flex-1", children: /* @__PURE__ */ d("div", { className: "grid gap-4", children: [
             /* @__PURE__ */ a(
               Jr,
               {
@@ -6801,13 +6798,13 @@ function zd({
                 title: I
               }
             ),
-            /* @__PURE__ */ a(se, {}),
+            /* @__PURE__ */ a(ie, {}),
             /* @__PURE__ */ d("div", { className: "grid gap-2", children: [
               /* @__PURE__ */ a(
                 dn,
                 {
                   icon: /* @__PURE__ */ a(ka, {}),
-                  title: le
+                  title: se
                 }
               ),
               S.length > 0 ? /* @__PURE__ */ a("div", { className: "grid gap-1", children: S.map((_) => /* @__PURE__ */ a(
@@ -6871,27 +6868,27 @@ function zd({
                 className: "grid gap-4",
                 onSubmit: (_) => {
                   _.preventDefault();
-                  const G = de.trim();
+                  const G = le.trim();
                   !W || !G || (g == null || g(W, G), he());
                 },
                 children: [
                   /* @__PURE__ */ d(Ce, { children: [
-                    /* @__PURE__ */ a(_e, { children: ce.title }),
-                    /* @__PURE__ */ a(Ie, { children: ce.description })
+                    /* @__PURE__ */ a(_e, { children: de.title }),
+                    /* @__PURE__ */ a(Ie, { children: de.description })
                   ] }),
                   /* @__PURE__ */ a(
                     qe,
                     {
-                      "aria-label": ce.inputLabel,
+                      "aria-label": de.inputLabel,
                       onChange: (_) => P(_.target.value),
                       ref: U,
                       required: !0,
-                      value: de
+                      value: le
                     }
                   ),
                   /* @__PURE__ */ d(it, { children: [
-                    /* @__PURE__ */ a(ot, { asChild: !0, children: /* @__PURE__ */ a(k, { type: "button", variant: "outline", children: ce.cancel }) }),
-                    /* @__PURE__ */ a(k, { disabled: !de.trim(), type: "submit", children: ce.confirm })
+                    /* @__PURE__ */ a(ot, { asChild: !0, children: /* @__PURE__ */ a(k, { type: "button", variant: "outline", children: de.cancel }) }),
+                    /* @__PURE__ */ a(k, { disabled: !le.trim(), type: "submit", children: de.confirm })
                   ] })
                 ]
               }
@@ -7026,7 +7023,7 @@ function kd({
       {
         "aria-describedby": void 0,
         className: r(
-          "w-3/4 gap-0 bg-card p-3 pt-14 text-card-foreground sm:max-w-sm",
+          "w-3/4 gap-0 bg-card px-0 py-3 text-card-foreground sm:max-w-sm",
           t
         ),
         contained: i,
@@ -7082,7 +7079,7 @@ function Cd({
       ...l,
       children: [
         /* @__PURE__ */ a(
-          ue.span,
+          ce.span,
           {
             animate: f ? void 0 : { rotate: 360 },
             className: r(
@@ -7104,7 +7101,7 @@ function Cd({
                     transform: `translate(calc(-50% + ${b}px), calc(-50% + ${v}px))`
                   },
                   children: /* @__PURE__ */ a(
-                    ue.span,
+                    ce.span,
                     {
                       animate: f ? void 0 : {
                         opacity: [0.34, 0.92, 0.48],
@@ -7126,7 +7123,7 @@ function Cd({
           }
         ),
         w ? /* @__PURE__ */ a("span", { className: "relative block h-5 min-w-0 overflow-hidden", children: /* @__PURE__ */ a(Ga, { mode: "popLayout", children: /* @__PURE__ */ a(
-          ue.span,
+          ce.span,
           {
             animate: f ? void 0 : { y: 0, opacity: 1 },
             className: r(
@@ -7137,7 +7134,7 @@ function Cd({
             initial: f ? !1 : { y: 10, opacity: 0 },
             transition: f ? void 0 : cn,
             children: /* @__PURE__ */ a(
-              ue.span,
+              ce.span,
               {
                 animate: f ? void 0 : { opacity: [0.62, 1, 0.7] },
                 transition: f ? void 0 : un,
@@ -7201,7 +7198,7 @@ function _d({
                 k,
                 {
                   "aria-label": f.label,
-                  className: "size-8 text-muted-foreground hover:text-foreground",
+                  className: "size-6 text-muted-foreground hover:text-foreground",
                   onClick: f.onClick,
                   size: "icon",
                   type: "button",
@@ -7209,7 +7206,7 @@ function _d({
                   children: f.icon
                 }
               ) }),
-              /* @__PURE__ */ a(Ze, { children: /* @__PURE__ */ a(z, { className: "text-background", variant: "small", children: f.label }) })
+              /* @__PURE__ */ a(Ze, { side: "bottom", children: /* @__PURE__ */ a(z, { className: "text-background", variant: "small", children: f.label }) })
             ] }, f.label))
           }
         ) }) : null
@@ -7313,7 +7310,7 @@ function Id({
             z,
             {
               asChild: !0,
-              className: "truncate text-foreground",
+              className: "truncate leading-tight text-foreground",
               variant: "small",
               children: /* @__PURE__ */ d("h1", { children: [
                 t,
@@ -7346,7 +7343,7 @@ function Sd({
 }) {
   const u = Ct(), m = !t && !(i === "always" || i === "user" && u), f = pn[o];
   return /* @__PURE__ */ a(
-    ue.div,
+    ce.div,
     {
       animate: m ? e ?? f.animate : void 0,
       initial: m ? n ?? f.initial : !1,
@@ -7395,7 +7392,7 @@ function Dd({
     const E = I.indexOf(x), q = E === -1 ? 0 : (E + T + I.length) % I.length;
     A(I[q]);
   }
-  function le(x, T) {
+  function se(x, T) {
     if (x.key === "ArrowRight" || x.key === "ArrowDown") {
       x.preventDefault(), H(T, 1);
       return;
@@ -7454,7 +7451,7 @@ function Dd({
                       disabled: x.disabled,
                       id: E,
                       onClick: () => S(x),
-                      onKeyDown: (F) => le(F, T),
+                      onKeyDown: (F) => se(F, T),
                       ref: (F) => {
                         h.current[T] = F;
                       },
@@ -7758,7 +7755,7 @@ export {
   Sl as SelectSeparator,
   kl as SelectTrigger,
   zl as SelectValue,
-  se as Separator,
+  ie as Separator,
   Dd as SettingsModal,
   Et as Sheet,
   Lr as SheetClose,