@cognite/aura 0.2.0 → 0.3.1

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

@@ -0,0 +1,99 @@
+import { jsx as t, jsxs as A } from "react/jsx-runtime";
+import { forwardRef as D, useState as f, useRef as H, useImperativeHandle as R } from "react";
+import { IconSearch as M, IconCircleXFilled as U } from "@tabler/icons-react";
+import { cn as m } from "../../../../lib/utils.js";
+import { InputGroup as W, InputGroupAddon as g, InputGroupInput as L, InputGroupButton as O } from "../input-group/input-group.js";
+const s = (n) => typeof n == "string" ? n.length > 0 : typeof n == "number" ? Number.isFinite(n) : Array.isArray(n) ? n.length > 0 : !1, P = D(
+  ({
+    className: n,
+    inputClassName: I,
+    clearLabel: b = "Clear search",
+    onClear: i,
+    value: o,
+    defaultValue: c,
+    onChange: C,
+    onInput: w,
+    onFocus: F,
+    onBlur: N,
+    disabled: l,
+    readOnly: u,
+    ...y
+  }, T) => {
+    const [x, p] = f(!1), [E, d] = f(() => s(o ?? c)), a = H(null), r = o != null, k = r ? s(o) : E;
+    R(T, () => a.current, []);
+    const v = () => {
+      p(!0);
+    }, B = (e) => {
+      e.relatedTarget instanceof Node && e.currentTarget.contains(e.relatedTarget) || p(!1);
+    }, G = () => {
+      const e = a.current;
+      e != null && (i?.(), !r && e.value !== "" && (Object.getOwnPropertyDescriptor(
+        HTMLInputElement.prototype,
+        "value"
+      )?.set?.call(e, ""), e.dispatchEvent(new Event("input", { bubbles: !0 })), e.dispatchEvent(new Event("change", { bubbles: !0 }))), e.focus());
+    }, S = (e) => {
+      r || d(s(e.currentTarget.value)), w?.(e);
+    }, j = (e) => {
+      r || d(s(e.currentTarget.value)), C?.(e);
+    }, z = !r || i != null, h = x && k && !l && !u && z;
+    return /* @__PURE__ */ t(
+      "div",
+      {
+        "data-slot": "search",
+        className: m("w-full cursor-text", n),
+        onFocusCapture: v,
+        onBlurCapture: B,
+        onClick: () => a.current?.focus(),
+        children: /* @__PURE__ */ A(W, { className: "w-full transition-none", children: [
+          /* @__PURE__ */ t(g, { align: "inline-start", children: /* @__PURE__ */ t(M, { className: "size-4", "aria-hidden": !0 }) }),
+          /* @__PURE__ */ t(
+            L,
+            {
+              ...y,
+              ref: a,
+              type: "search",
+              value: o,
+              defaultValue: c,
+              disabled: l,
+              readOnly: u,
+              onInput: S,
+              onChange: j,
+              onFocus: F,
+              onBlur: N,
+              className: m(
+                "placeholder:text-muted-foreground [&::-webkit-search-cancel-button]:appearance-none [&::-webkit-search-decoration]:appearance-none",
+                I
+              )
+            }
+          ),
+          /* @__PURE__ */ t(
+            g,
+            {
+              align: "inline-end",
+              "aria-hidden": h ? void 0 : !0,
+              className: h ? void 0 : "invisible pointer-events-none",
+              children: /* @__PURE__ */ t(
+                O,
+                {
+                  type: "button",
+                  variant: "ghost",
+                  size: "icon-sm",
+                  "aria-label": b,
+                  onMouseDown: (e) => {
+                    e.preventDefault();
+                  },
+                  onClick: G,
+                  children: /* @__PURE__ */ t(U, { className: "size-4", "aria-hidden": !0 })
+                }
+              )
+            }
+          )
+        ] })
+      }
+    );
+  }
+);
+P.displayName = "Search";
+export {
+  P as Search
+};

package/dist/components/ui/core/segmented-control/segmented-control.d.ts

@@ -1,16 +1,20 @@
+import { ReactNode } from 'react';
 import { Tabs as TabsPrimitive } from '@base-ui/react/tabs';
 import { VariantProps } from 'class-variance-authority';
-declare function SegmentedControl({ className, ...props }: TabsPrimitive.Root.Props): import("react/jsx-runtime").JSX.Element;
-declare const segmentedControlListVariants: (props?: ({
-    size?: "default" | "small" | null | undefined;
-} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+import { ClassProp } from 'class-variance-authority/types';
+declare function SegmentedControl({ className, ...props }: TabsPrimitive.Root.Props): ReactNode;
+interface SegmentedControlListVariantProps {
+    size?: 'small' | 'default' | null;
+}
+declare const segmentedControlListVariants: (props?: (SegmentedControlListVariantProps & ClassProp) | undefined) => string;
 type SegmentedControlListProps = TabsPrimitive.List.Props & VariantProps<typeof segmentedControlListVariants>;
-declare function SegmentedControlList({ className, size, children, ...props }: SegmentedControlListProps): import("react/jsx-runtime").JSX.Element;
-declare const segmentedControlButtonVariants: (props?: ({
-    size?: "default" | "small" | null | undefined;
-    tabContent?: "icon-label" | "label-only" | "icon-only" | null | undefined;
-} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+declare function SegmentedControlList({ className, size, children, ...props }: SegmentedControlListProps): ReactNode;
+interface SegmentedControlButtonVariantProps {
+    size?: 'small' | 'default' | null;
+    tabContent?: 'icon-label' | 'label-only' | 'icon-only' | null;
+}
+declare const segmentedControlButtonVariants: (props?: (SegmentedControlButtonVariantProps & ClassProp) | undefined) => string;
 type SegmentedControlButtonProps = TabsPrimitive.Tab.Props & VariantProps<typeof segmentedControlButtonVariants>;
-declare function SegmentedControlButton({ className, size, tabContent, ...props }: SegmentedControlButtonProps): import("react/jsx-runtime").JSX.Element;
-declare function SegmentedControlContent({ className, ...props }: TabsPrimitive.Panel.Props): import("react/jsx-runtime").JSX.Element;
+declare function SegmentedControlButton({ className, size, tabContent, ...props }: SegmentedControlButtonProps): ReactNode;
+declare function SegmentedControlContent({ className, ...props }: TabsPrimitive.Panel.Props): ReactNode;
 export { SegmentedControl, SegmentedControlButton, SegmentedControlContent, SegmentedControlList, segmentedControlButtonVariants, segmentedControlListVariants, };

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

@@ -3,7 +3,10 @@ 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";
-function N({ className: t, ...e }) {
+function N({
+  className: t,
+  ...e
+}) {
   return /* @__PURE__ */ n(
     a.Root,
     {

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

@@ -1,5 +1,5 @@
-import { ReactNode } from 'react';
-import { Select as SelectPrimitive } from '@base-ui/react/select';
+import { ForwardRefExoticComponent, RefAttributes, ReactNode } from 'react';
+import { SelectTriggerProps, Select as SelectPrimitive } from '@base-ui/react/select';
 type SelectPropsBase = Omit<SelectPrimitive.Root.Props<string>, 'open' | 'defaultOpen' | 'onOpenChange' | 'value' | 'defaultValue' | 'onValueChange' | 'multiple'> & {
     open?: boolean;
     defaultOpen?: boolean;
@@ -19,26 +19,27 @@ type SelectPropsMultiple = SelectPropsBase & {
 };
 declare function Select(props: SelectPropsSingle): ReactNode;
 declare function Select(props: SelectPropsMultiple): ReactNode;
-declare function SelectGroup({ className, ...props }: SelectPrimitive.Group.Props): import("react/jsx-runtime").JSX.Element;
+declare function SelectGroup({ className, ...props }: SelectPrimitive.Group.Props): ReactNode;
 declare function SelectValue({ icon, ...props }: SelectPrimitive.Value.Props & {
     icon?: ReactNode;
-}): import("react/jsx-runtime").JSX.Element;
-declare const SelectTrigger: import('react').ForwardRefExoticComponent<Omit<import('@base-ui/react').SelectTriggerProps & {
-    size?: "sm" | "default";
+}): ReactNode;
+declare const SelectTrigger: ForwardRefExoticComponent<Omit<SelectTriggerProps & {
+    size?: 'sm' | 'default';
     errorMessage?: string;
-}, "ref"> & import('react').RefAttributes<HTMLButtonElement>>;
+}, 'ref'> & RefAttributes<HTMLButtonElement>>;
 declare function SelectContent({ className, children, position: _position, align, alignOffset, side, sideOffset, ...props }: SelectPrimitive.Popup.Props & {
     position?: 'popper' | 'item-aligned';
     align?: SelectPrimitive.Positioner.Props['align'];
     alignOffset?: SelectPrimitive.Positioner.Props['alignOffset'];
     side?: SelectPrimitive.Positioner.Props['side'];
     sideOffset?: SelectPrimitive.Positioner.Props['sideOffset'];
-}): import("react/jsx-runtime").JSX.Element;
-declare function SelectLabel({ className, ...props }: SelectPrimitive.GroupLabel.Props): import("react/jsx-runtime").JSX.Element;
-declare function SelectItem({ className, children, icon, ...props }: SelectPrimitive.Item.Props & {
+}): ReactNode;
+declare function SelectLabel({ className, ...props }: SelectPrimitive.GroupLabel.Props): ReactNode;
+declare function SelectItem({ className, children, icon, suffix, ...props }: SelectPrimitive.Item.Props & {
     icon?: ReactNode;
-}): import("react/jsx-runtime").JSX.Element;
-declare function SelectSeparator({ className, ...props }: SelectPrimitive.Separator.Props): import("react/jsx-runtime").JSX.Element;
-declare function SelectScrollUpButton({ className, ...props }: SelectPrimitive.ScrollUpArrow.Props): import("react/jsx-runtime").JSX.Element;
-declare function SelectScrollDownButton({ className, ...props }: SelectPrimitive.ScrollDownArrow.Props): import("react/jsx-runtime").JSX.Element;
+    suffix?: ReactNode;
+}): ReactNode;
+declare function SelectSeparator({ className, ...props }: SelectPrimitive.Separator.Props): ReactNode;
+declare function SelectScrollUpButton({ className, ...props }: SelectPrimitive.ScrollUpArrow.Props): ReactNode;
+declare function SelectScrollDownButton({ className, ...props }: SelectPrimitive.ScrollDownArrow.Props): ReactNode;
 export { Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, };

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

@@ -1,117 +1,134 @@
-import { jsxs as u, Fragment as C, jsx as t } from "react/jsx-runtime";
-import { createContext as N, forwardRef as y, useId as z, useContext as I, useMemo as V } from "react";
-import { Select as o } from "@base-ui/react/select";
-import { IconChevronDown as h, IconExclamationCircle as k, IconCheck as _, IconChevronUp 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 = N(null), R = () => {
-  const e = I(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 = V(() => ({ 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 }) {
+function Z({
+  className: e,
+  ...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"
                   )
                 }
               )
@@ -120,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(k, { 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 })
         ]
       }
@@ -136,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, {})
           ]
         }
@@ -177,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(_, { 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,
+      ...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" })
     }
   );
 }
@@ -267,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/separator/separator.d.ts

@@ -1,6 +1,4 @@
+import { ReactNode } from 'react';
 import { Separator as SeparatorPrimitive } from '@base-ui/react/separator';
-declare function Separator({ className, orientation, ...props }: SeparatorPrimitive.Props): import("react/jsx-runtime").JSX.Element;
-declare namespace Separator {
-    var displayName: string;
-}
+declare function Separator({ className, orientation, ...props }: SeparatorPrimitive.Props): ReactNode;
 export { Separator };

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

@@ -1,7 +1,7 @@
 import { jsx as o } from "react/jsx-runtime";
 import { Separator as i } from "@base-ui/react/separator";
-import { cn as e } from "../../../../lib/utils.js";
-function n({
+import { cn as n } from "../../../../lib/utils.js";
+function m({
   className: a,
   orientation: r = "horizontal",
   ...t
@@ -11,7 +11,7 @@ function n({
     {
       "data-slot": "separator",
       orientation: r,
-      className: e(
+      className: n(
         "bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px",
         a
       ),
@@ -19,7 +19,6 @@ function n({
     }
   );
 }
-n.displayName = "Separator";
 export {
-  n as Separator
+  m as Separator
 };