@cognite/aura 0.3.0 → 0.3.2

package/dist/components/ui/core/prompt-input/prompt-input.js

@@ -1,14 +1,14 @@
-import { jsxs as w, jsx as o } from "react/jsx-runtime";
-import { useState as y, forwardRef as s, useCallback as H, useMemo as k, useContext as C, createContext as A } from "react";
-import { IconPlus as E, IconInfoCircle as D, IconSend as z, IconLoader2 as B, IconSquare as L, IconX as G } from "@tabler/icons-react";
+import { jsx as o, jsxs as w } from "react/jsx-runtime";
+import { createContext as H, forwardRef as s, useState as y, useContext as C, useCallback as k, useMemo as A } from "react";
+import { IconSend as E, IconLoader2 as D, IconSquare as z, IconX as B, IconPlus as L, IconInfoCircle as G } from "@tabler/icons-react";
 import { cn as r } from "../../../../lib/utils.js";
 import { Command as F, CommandEmpty as j, CommandGroup as K, CommandInput as V, CommandItem as q, CommandList as R, CommandSeparator as O } from "../command/command.js";
 import { DropdownMenu as W, DropdownMenuContent as X, DropdownMenuItem as J, DropdownMenuTrigger as Q } from "../dropdown-menu/dropdown-menu.js";
 import { HelperText as f } from "../helper-text/helper-text.js";
 import { HoverCard as U, HoverCardContent as Y, HoverCardTrigger as Z } from "../hover-card/hover-card.js";
-import { InputGroup as _, InputGroupButton as x, InputGroupAddon as h, InputGroupTextarea as $ } from "../input-group/input-group.js";
+import { InputGroupTextarea as _, InputGroupAddon as x, InputGroupButton as h, InputGroup as $ } from "../input-group/input-group.js";
 import { Select as tt, SelectContent as et, SelectItem as ot, SelectTrigger as nt, SelectValue as rt } from "../select/select.js";
-const N = A(
+const N = H(
   null
 ), Xt = () => {
   const t = C(N);
@@ -22,7 +22,7 @@ function Jt({
   initialInput: t = "",
   children: e
 }) {
-  const [n, a] = y(t), l = H(() => a(""), []), p = k(
+  const [n, a] = y(t), l = k(() => a(""), []), p = A(
     () => ({
       textInput: {
         value: n,
@@ -63,7 +63,7 @@ const at = ({
         d instanceof Error ? d.message : "Failed to submit. Please try again."
       );
     }
-  }, S = n === !1 ? null : n ?? /* @__PURE__ */ o(f, { size: "xs", icon: /* @__PURE__ */ o(D, {}), children: "AI doesn't always get it right. Be sure to check results" });
+  }, S = n === !1 ? null : n ?? /* @__PURE__ */ o(f, { size: "xs", icon: /* @__PURE__ */ o(G, {}), children: "AI doesn't always get it right. Be sure to check results" });
   return /* @__PURE__ */ w("div", { className: "w-full flex flex-col gap-2", children: [
     /* @__PURE__ */ o(
       "form",
@@ -72,7 +72,7 @@ const at = ({
         className: r("w-full", t),
         onSubmit: P,
         ...p,
-        children: /* @__PURE__ */ o(_, { className: "shadow-none rounded-xl has-[[data-slot=input-group-control]:is(:read-only,[aria-disabled=true])]:border-muted-background has-[[data-slot=input-group-control]:is(:read-only,[aria-disabled=true])]:bg-muted-background hover:has-[[data-slot=input-group-control]:is(:read-only,[aria-disabled=true])]:border-muted-background hover:has-[[data-slot=input-group-control]:is(:read-only,[aria-disabled=true])]:bg-muted-background hover:has-[[data-slot=input-group-control]:is(:read-only,[aria-disabled=true])]:text-muted-foreground", children: l })
+        children: /* @__PURE__ */ o($, { className: "shadow-none rounded-xl has-[[data-slot=input-group-control]:is(:read-only,[aria-disabled=true])]:border-muted-background has-[[data-slot=input-group-control]:is(:read-only,[aria-disabled=true])]:bg-muted-background hover:has-[[data-slot=input-group-control]:is(:read-only,[aria-disabled=true])]:border-muted-background hover:has-[[data-slot=input-group-control]:is(:read-only,[aria-disabled=true])]:bg-muted-background hover:has-[[data-slot=input-group-control]:is(:read-only,[aria-disabled=true])]:text-muted-foreground", children: l })
       }
     ),
     a || u ? /* @__PURE__ */ o(f, { size: "xs", isError: !0, children: a || u }) : S
@@ -108,7 +108,7 @@ const pt = s(
       onChange: t
     };
     return /* @__PURE__ */ o(
-      $,
+      _,
       {
         ref: l,
         className: r(
@@ -129,7 +129,7 @@ const pt = s(
 pt.displayName = "PromptInputTextarea";
 const mt = s(
   ({ className: t, ...e }, n) => /* @__PURE__ */ o(
-    h,
+    x,
     {
       ref: n,
       align: "block-end",
@@ -141,7 +141,7 @@ const mt = s(
 mt.displayName = "PromptInputHeader";
 const lt = s(
   ({ className: t, ...e }, n) => /* @__PURE__ */ o(
-    h,
+    x,
     {
       ref: n,
       align: "block-end",
@@ -167,7 +167,7 @@ const T = s(
   ({ variant: t = "ghost", className: e, size: n, ...a }, l) => {
     const p = a.children === void 0 || a.children === null ? 0 : Array.isArray(a.children) ? a.children.length : 1, m = n ?? (p > 1 ? "sm" : "icon-sm");
     return /* @__PURE__ */ o(
-      x,
+      h,
       {
         ref: l,
         className: r(e),
@@ -189,7 +189,7 @@ const dt = ({
 }) => /* @__PURE__ */ o(
   Q,
   {
-    render: /* @__PURE__ */ o(T, { className: t, ...n, children: e ?? /* @__PURE__ */ o(E, { className: "size-4" }) })
+    render: /* @__PURE__ */ o(T, { className: t, ...n, children: e ?? /* @__PURE__ */ o(L, { className: "size-4" }) })
   }
 );
 dt.displayName = "PromptInputActionMenuTrigger";
@@ -212,9 +212,9 @@ const Pt = s(
     children: l,
     ...p
   }, m) => {
-    let u = /* @__PURE__ */ o(z, { className: "size-4" });
-    return a === "submitted" ? u = /* @__PURE__ */ o(B, { className: "size-4 animate-spin" }) : a === "streaming" ? u = /* @__PURE__ */ o(L, { className: "size-4" }) : a === "error" && (u = /* @__PURE__ */ o(G, { className: "size-4" })), /* @__PURE__ */ o(
-      x,
+    let u = /* @__PURE__ */ o(E, { className: "size-4" });
+    return a === "submitted" ? u = /* @__PURE__ */ o(D, { className: "size-4 animate-spin" }) : a === "streaming" ? u = /* @__PURE__ */ o(z, { className: "size-4" }) : a === "error" && (u = /* @__PURE__ */ o(B, { className: "size-4" })), /* @__PURE__ */ o(
+      h,
       {
         ref: m,
         "aria-label": "Submit",

package/dist/components/ui/core/radio-group/radio-group.js

@@ -3,7 +3,7 @@ import { forwardRef as t } from "react";
 import { Radio as s } from "@base-ui/react/radio";
 import { RadioGroup as n } from "@base-ui/react/radio-group";
 import { cva as u } from "class-variance-authority";
-import { cn as d, focusState as b, selectionItemDescription as l, selectionItemLabel as c, selectionItemBase as p, selectionItemCard as f, selectionItemDefault as g } from "../../../../lib/utils.js";
+import { cn as d, selectionItemBase as b, selectionItemCard as l, selectionItemDefault as c, focusState as p, selectionItemLabel as f, selectionItemDescription as g } from "../../../../lib/utils.js";
 const m = t(
   ({ className: r, orientation: e = "vertical", ...o }, i) => /* @__PURE__ */ a(
     n,
@@ -21,11 +21,11 @@ const m = t(
   )
 );
 m.displayName = "RadioGroup";
-const h = u(d("group/radio-group-item", p), {
+const h = u(d("group/radio-group-item", b), {
   variants: {
     variant: {
-      default: g,
-      card: f
+      default: c,
+      card: l
     }
   },
   defaultVariants: {
@@ -56,7 +56,7 @@ const I = t(({ className: r, ...e }, o) => /* @__PURE__ */ a(
       "data-[checked]:hover:before:border-border-active data-[checked]:hover:before:bg-accent-background",
       "data-[checked]:group-hover/radio-group-item:before:border-border-active data-[checked]:group-hover/radio-group-item:before:bg-accent-background",
       "data-[disabled]:before:border-disabled-foreground data-[disabled]:before:bg-disabled-background data-[disabled]:hover:before:border-disabled-foreground data-[disabled]:group-hover/radio-group-item:before:border-disabled-foreground data-[disabled]:group-hover/radio-group-item:before:bg-disabled-background",
-      b,
+      p,
       r
     ),
     ...e,
@@ -78,7 +78,7 @@ const R = t(
       ref: o,
       "data-slot": "radio-group-item-label",
       className: d(
-        c,
+        f,
         "group-has-[[data-checked]]/radio-group-item:text-foreground",
         "group-has-[[data-disabled]]/radio-group-item:text-disabled-foreground",
         r
@@ -95,7 +95,7 @@ const k = t(
       ref: o,
       "data-slot": "radio-group-item-description",
       className: d(
-        l,
+        g,
         "group-has-[[data-disabled]]/radio-group-item:text-disabled-foreground",
         r
       ),

package/dist/components/ui/core/reasoning/reasoning.js

@@ -1,5 +1,5 @@
 import { jsx as n, jsxs as d } from "react/jsx-runtime";
-import { forwardRef as s, createContext as g, useContext as c } from "react";
+import { createContext as g, forwardRef as s, useContext as c } from "react";
 import { IconBrain as m } from "@tabler/icons-react";
 import { cn as i } from "../../../../lib/utils.js";
 const l = g(!0), p = () => c(l), b = s(

package/dist/components/ui/core/segmented-control/segmented-control.js

@@ -1,5 +1,5 @@
 import { jsx as n, jsxs as u } from "react/jsx-runtime";
-import { useContext as m, createContext as f } from "react";
+import { createContext as m, useContext as f } from "react";
 import { Tabs as a } from "@base-ui/react/tabs";
 import { cva as l } from "class-variance-authority";
 import { cn as i } from "../../../../lib/utils.js";
@@ -29,7 +29,7 @@ const g = l(
       size: "default"
     }
   }
-), d = f(void 0);
+), d = m(void 0);
 function S({
   className: t,
   size: e,
@@ -136,7 +136,7 @@ function w({
   tabContent: o,
   ...r
 }) {
-  const s = m(d), c = e ?? s;
+  const s = f(d), c = e ?? s;
   return /* @__PURE__ */ n(
     a.Tab,
     {

package/dist/components/ui/core/select/select.d.ts

@@ -35,8 +35,9 @@ declare function SelectContent({ className, children, position: _position, align
     sideOffset?: SelectPrimitive.Positioner.Props['sideOffset'];
 }): ReactNode;
 declare function SelectLabel({ className, ...props }: SelectPrimitive.GroupLabel.Props): ReactNode;
-declare function SelectItem({ className, children, icon, ...props }: SelectPrimitive.Item.Props & {
+declare function SelectItem({ className, children, icon, suffix, ...props }: SelectPrimitive.Item.Props & {
     icon?: ReactNode;
+    suffix?: ReactNode;
 }): ReactNode;
 declare function SelectSeparator({ className, ...props }: SelectPrimitive.Separator.Props): ReactNode;
 declare function SelectScrollUpButton({ className, ...props }: SelectPrimitive.ScrollUpArrow.Props): ReactNode;

package/dist/components/ui/core/select/select.js

@@ -1,120 +1,134 @@
-import { jsx as t, jsxs as u, Fragment as C } from "react/jsx-runtime";
-import { useMemo as N, forwardRef as y, useId as z, createContext as I, useContext as V } from "react";
-import { Select as o } from "@base-ui/react/select";
-import { IconCheck as k, IconChevronDown as h, IconChevronUp as _, IconExclamationCircle as O } from "@tabler/icons-react";
+import { jsxs as m, Fragment as N, jsx as t } from "react/jsx-runtime";
+import { createContext as C, forwardRef as y, useId as z, useContext as k, useMemo as I } from "react";
+import { Select as a } from "@base-ui/react/select";
+import { IconChevronDown as v, IconExclamationCircle as V, IconCheck as _, IconChevronUp as O } from "@tabler/icons-react";
 import { usePortalContainer as P } from "../../../../lib/portal-container-context.js";
 import { useControllableState as j } from "../../../../lib/use-controllable-state.js";
-import { cn as r, disabledState as T, invalidState as D, focusState as B, filledState as E, hoverState as G, formElementBase as L } from "../../../../lib/utils.js";
-const g = I(null), R = () => {
-  const e = V(g);
+import { cn as i, disabledState as T, invalidState as D, focusState as B, filledState as E, hoverState as G, formElementBase as L } from "../../../../lib/utils.js";
+const g = C(null), R = () => {
+  const e = k(g);
   if (!e)
     throw new Error("Select components must be used within Select");
   return e;
 };
 function Y(e) {
-  const [a, l] = j({
+  const [o, r] = j({
     prop: e.open,
     defaultProp: e.defaultOpen ?? !1,
     onChange: e.onOpenChange
-  }), n = N(() => ({ isOpen: a ?? !1 }), [a]);
+  }), n = I(() => ({ isOpen: o ?? !1 }), [o]);
   if (e.multiple) {
     const {
-      multiple: p,
-      value: v,
+      multiple: f,
+      value: h,
       defaultValue: b,
-      onValueChange: S,
-      ...w
+      onValueChange: w,
+      ...S
     } = e;
     return /* @__PURE__ */ t(g.Provider, { value: n, children: /* @__PURE__ */ t(
-      o.Root,
+      a.Root,
       {
         "data-slot": "select",
-        open: a,
-        onOpenChange: (f) => l(f),
-        value: v,
+        open: o,
+        onOpenChange: (p) => r(p),
+        value: h,
         defaultValue: b,
-        onValueChange: (f, W) => {
-          S?.(f ?? []);
+        onValueChange: (p, W) => {
+          w?.(p ?? []);
         },
         multiple: !0,
-        ...w
+        ...S
       }
     ) });
   }
-  const { value: s, defaultValue: i, onValueChange: m, ...c } = e, d = s === void 0 ? void 0 : s === "" ? null : s, x = i === void 0 ? void 0 : i === "" ? null : i;
+  const { value: l, defaultValue: s, onValueChange: c, ...d } = e, u = l === void 0 ? void 0 : l === "" ? null : l, x = s === void 0 ? void 0 : s === "" ? null : s;
   return /* @__PURE__ */ t(g.Provider, { value: n, children: /* @__PURE__ */ t(
-    o.Root,
+    a.Root,
     {
       "data-slot": "select",
-      open: a,
-      onOpenChange: (p) => l(p),
-      value: d,
+      open: o,
+      onOpenChange: (f) => r(f),
+      value: u,
       defaultValue: x,
-      onValueChange: (p, v) => {
-        m?.(typeof p == "string" ? p : "");
+      onValueChange: (f, h) => {
+        c?.(typeof f == "string" ? f : "");
       },
-      ...c
+      ...d
     }
   ) });
 }
 function Z({
   className: e,
-  ...a
+  ...o
 }) {
   return /* @__PURE__ */ t(
-    o.Group,
+    a.Group,
     {
       "data-slot": "select-group",
-      className: r("scroll-my-1 p-1", e),
-      ...a
+      className: i("scroll-my-1 p-1", e),
+      ...o
     }
   );
 }
 function M({
   icon: e,
-  ...a
+  ...o
 }) {
-  return e ? /* @__PURE__ */ u("span", { className: "flex items-center gap-2", children: [
+  return e ? /* @__PURE__ */ m("span", { className: "flex flex-1 items-center gap-2 min-w-0 overflow-hidden", children: [
     e,
-    /* @__PURE__ */ t(o.Value, { "data-slot": "select-value", ...a })
-  ] }) : /* @__PURE__ */ t(o.Value, { "data-slot": "select-value", ...a });
+    /* @__PURE__ */ t(
+      a.Value,
+      {
+        "data-slot": "select-value",
+        className: "flex-1 truncate min-w-0",
+        ...o
+      }
+    )
+  ] }) : /* @__PURE__ */ t(
+    a.Value,
+    {
+      "data-slot": "select-value",
+      className: "flex-1 truncate min-w-0",
+      ...o
+    }
+  );
 }
-const U = y(({ className: e, size: a = "default", children: l, errorMessage: n, ...s }, i) => {
-  const { isOpen: m } = R(), c = !!n, d = z();
-  return /* @__PURE__ */ u(C, { children: [
-    /* @__PURE__ */ u(
-      o.Trigger,
+const U = y(({ className: e, size: o = "default", children: r, errorMessage: n, ...l }, s) => {
+  const { isOpen: c } = R(), d = !!n, u = z();
+  return /* @__PURE__ */ m(N, { children: [
+    /* @__PURE__ */ m(
+      a.Trigger,
       {
-        ref: i,
+        ref: s,
         "data-slot": "select-trigger",
-        "data-size": a,
-        "aria-invalid": c ? !0 : void 0,
-        "aria-describedby": c ? d : void 0,
-        className: r(
-          "w-fit min-w-50 min-h-9 flex items-center justify-between gap-2 whitespace-nowrap transition-[color,box-shadow] cursor-pointer",
+        "data-size": o,
+        "aria-invalid": d ? !0 : void 0,
+        "aria-describedby": d ? u : void 0,
+        className: i(
+          "w-full min-w-50 h-9 max-w-[min(100%,420px)] flex items-center justify-between gap-2 text-left overflow-hidden transition-[color,box-shadow] cursor-pointer",
           L,
           G,
           E,
           B,
+          c && "shadow-focus-ring bg-background border-transparent focus:border-transparent hover:border-transparent text-foreground",
           D,
           T,
           "dark:bg-muted-background/30 dark:text-muted-foreground dark:hover:bg-accent-background",
           "[&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground",
-          "*:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2",
           e
         ),
-        ...s,
+        ...l,
         children: [
-          l,
+          r,
           /* @__PURE__ */ t(
-            o.Icon,
+            a.Icon,
             {
               render: /* @__PURE__ */ t(
-                h,
+                v,
                 {
-                  className: r(
+                  className: i(
                     "size-4 opacity-50 transition-transform",
-                    m ? "rotate-180" : "rotate-0"
+                    c ? "rotate-180" : "rotate-0"
                   )
                 }
               )
@@ -123,13 +137,13 @@ const U = y(({ className: e, size: a = "default", children: l, errorMessage: n,
         ]
       }
     ),
-    n && /* @__PURE__ */ u(
+    n && /* @__PURE__ */ m(
       "div",
       {
-        id: d,
+        id: u,
         className: "flex flex-row gap-1 justify-start items-center p-1",
         children: [
-          /* @__PURE__ */ t(O, { className: "text-destructive-foreground text-sm size-4" }),
+          /* @__PURE__ */ t(V, { className: "text-destructive-foreground text-sm size-4" }),
           /* @__PURE__ */ t("span", { className: "text-destructive-foreground text-sm", children: n })
         ]
       }
@@ -139,38 +153,38 @@ const U = y(({ className: e, size: a = "default", children: l, errorMessage: n,
 U.displayName = "SelectTrigger";
 function ee({
   className: e,
-  children: a,
-  position: l = "popper",
+  children: o,
+  position: r = "popper",
   align: n = "start",
-  alignOffset: s = 0,
-  side: i = "bottom",
-  sideOffset: m = 4,
-  ...c
+  alignOffset: l = 0,
+  side: s = "bottom",
+  sideOffset: c = 4,
+  ...d
 }) {
-  const d = P();
-  return /* @__PURE__ */ t(o.Portal, { container: d, children: /* @__PURE__ */ t(
-    o.Positioner,
+  const u = P();
+  return /* @__PURE__ */ t(a.Portal, { container: u, children: /* @__PURE__ */ t(
+    a.Positioner,
     {
       alignItemWithTrigger: !1,
       align: n,
-      alignOffset: s,
-      side: i,
-      sideOffset: m,
+      alignOffset: l,
+      side: s,
+      sideOffset: c,
       collisionPadding: 10,
       className: "isolate z-50",
-      children: /* @__PURE__ */ u(
-        o.Popup,
+      children: /* @__PURE__ */ m(
+        a.Popup,
         {
           "data-slot": "select-content",
-          className: r(
-            "bg-popover-background text-foreground data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-95 data-open:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 relative z-50 max-h-(--available-height) min-w-32 origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-md border shadow-md outline-none",
-            l === "popper" && "data-[side=bottom]:translate-y-1",
+          className: i(
+            "bg-popover-background text-foreground data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-95 data-open:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 relative z-50 max-h-(--available-height) max-w-[min(100%,420px)] min-w-(--anchor-width) origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-md border shadow-md outline-none",
+            r === "popper" && "data-[side=bottom]:translate-y-1",
             e
           ),
-          ...c,
+          ...d,
           children: [
             /* @__PURE__ */ t(A, {}),
-            /* @__PURE__ */ t(o.List, { children: a }),
+            /* @__PURE__ */ t(a.List, { children: o }),
             /* @__PURE__ */ t(F, {})
           ]
         }
@@ -180,89 +194,99 @@ function ee({
 }
 function te({
   className: e,
-  ...a
+  ...o
 }) {
   return /* @__PURE__ */ t(
-    o.GroupLabel,
+    a.GroupLabel,
     {
       "data-slot": "select-label",
-      className: r("text-muted-foreground px-2 py-1.5 text-xs", e),
-      ...a
+      className: i("text-muted-foreground px-2 py-1.5 text-xs", e),
+      ...o
     }
   );
 }
-function ae({
+function oe({
   className: e,
-  children: a,
-  icon: l,
-  ...n
+  children: o,
+  icon: r,
+  suffix: n,
+  ...l
 }) {
-  return /* @__PURE__ */ u(
-    o.Item,
+  const s = typeof o == "string" ? o : void 0;
+  return /* @__PURE__ */ m(
+    a.Item,
     {
       "data-slot": "select-item",
-      className: r(
-        "relative flex w-full min-h-9 cursor-default items-center gap-2 rounded-sm py-1.5 pr-8 pl-2 text-base leading-5 tracking-tightest outline-hidden select-none focus:bg-accent-background focus:text-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2",
+      className: i(
+        "relative flex w-full min-h-9 cursor-default items-center gap-2 rounded-sm py-1.5 pr-8 pl-2 text-base leading-5 tracking-tightest outline-hidden select-none focus:bg-accent-background focus:text-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground",
         e
       ),
-      ...n,
+      ...l,
       children: [
         /* @__PURE__ */ t(
-          o.ItemIndicator,
+          a.ItemIndicator,
           {
-            render: /* @__PURE__ */ t("span", { className: "absolute right-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ t(k, { className: "size-4 text-foreground" }) })
+            render: /* @__PURE__ */ t("span", { className: "absolute right-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ t(_, { className: "size-4 text-foreground" }) })
           }
         ),
-        l && /* @__PURE__ */ t("span", { className: "flex items-center gap-2 mr-1", children: l }),
-        /* @__PURE__ */ t(o.ItemText, { children: a })
+        r && /* @__PURE__ */ t("span", { className: "flex items-center gap-2 mr-1", children: r }),
+        /* @__PURE__ */ t(
+          a.ItemText,
+          {
+            className: "flex-1 truncate min-w-0",
+            title: s,
+            children: o
+          }
+        ),
+        n && /* @__PURE__ */ t("span", { className: "shrink-0 ml-auto", children: n })
       ]
     }
   );
 }
-function oe({
+function ae({
   className: e,
-  ...a
+  ...o
 }) {
   return /* @__PURE__ */ t(
-    o.Separator,
+    a.Separator,
     {
       "data-slot": "select-separator",
-      className: r("bg-border pointer-events-none -mx-1 my-1 h-px", e),
-      ...a
+      className: i("bg-border pointer-events-none -mx-1 my-1 h-px", e),
+      ...o
     }
   );
 }
 function A({
   className: e,
-  ...a
+  ...o
 }) {
   return /* @__PURE__ */ t(
-    o.ScrollUpArrow,
+    a.ScrollUpArrow,
     {
       "data-slot": "select-scroll-up-button",
-      className: r(
+      className: i(
         "bg-popover-background z-10 flex cursor-default items-center justify-center py-1 top-0 w-full",
         e
       ),
-      ...a,
-      children: /* @__PURE__ */ t(_, { className: "size-4" })
+      ...o,
+      children: /* @__PURE__ */ t(O, { className: "size-4" })
     }
   );
 }
 function F({
   className: e,
-  ...a
+  ...o
 }) {
   return /* @__PURE__ */ t(
-    o.ScrollDownArrow,
+    a.ScrollDownArrow,
     {
       "data-slot": "select-scroll-down-button",
-      className: r(
+      className: i(
         "bg-popover-background z-10 flex cursor-default items-center justify-center py-1 bottom-0 w-full",
         e
       ),
-      ...a,
-      children: /* @__PURE__ */ t(h, { className: "size-4" })
+      ...o,
+      children: /* @__PURE__ */ t(v, { className: "size-4" })
     }
   );
 }
@@ -270,11 +294,11 @@ export {
   Y as Select,
   ee as SelectContent,
   Z as SelectGroup,
-  ae as SelectItem,
+  oe as SelectItem,
   te as SelectLabel,
   F as SelectScrollDownButton,
   A as SelectScrollUpButton,
-  oe as SelectSeparator,
+  ae as SelectSeparator,
   U as SelectTrigger,
   M as SelectValue
 };

package/dist/components/ui/core/shimmer/shimmer.d.ts

@@ -1,12 +1,14 @@
 import { MemoExoticComponent, ReactNode } from 'react';
 type TextShimmerProps = {
     children: string;
+    /** SVG URL or data URI used as a CSS mask. Not a React component which would require runtime SVG serialization. */
+    iconUrl?: string;
     as?: 'p' | 'span' | 'div' | 'h1' | 'h2' | 'h3';
     className?: string;
     duration?: number;
     spread?: number;
     variant?: 'default' | 'nordic' | 'aurora' | 'dusk' | 'equinox' | 'summer' | 'spring' | 'fall';
 };
-declare function ShimmerComponent({ children, as: Component, className, duration, spread, variant, }: TextShimmerProps): ReactNode;
+declare function ShimmerComponent({ children, iconUrl, as: Tag, className, duration, spread, variant, }: TextShimmerProps): ReactNode;
 declare const MemoizedShimmer: MemoExoticComponent<typeof ShimmerComponent>;
 export { MemoizedShimmer as Shimmer };