@minidev.fun/ui 1.0.1

package/dist/components/ui/src/components/ui/progress.js

@@ -0,0 +1,74 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { cn } from "../../../../../lib/utils.js";
+import { ProgressRoot } from "../../../../../node_modules/@base-ui/react/esm/progress/root/ProgressRoot.js";
+import { ProgressIndicator as ProgressIndicator$1 } from "../../../../../node_modules/@base-ui/react/esm/progress/indicator/ProgressIndicator.js";
+import { ProgressLabel as ProgressLabel$1 } from "../../../../../node_modules/@base-ui/react/esm/progress/label/ProgressLabel.js";
+import { ProgressTrack as ProgressTrack$1 } from "../../../../../node_modules/@base-ui/react/esm/progress/track/ProgressTrack.js";
+import { ProgressValue as ProgressValue$1 } from "../../../../../node_modules/@base-ui/react/esm/progress/value/ProgressValue.js";
+function Progress({ className, children, value, ...props }) {
+  return /* @__PURE__ */ jsx(
+    ProgressRoot,
+    {
+      value,
+      "data-slot": "progress",
+      className: cn("flex flex-wrap gap-3", className),
+      ...props,
+      children
+    }
+  );
+}
+function ProgressTrack({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    ProgressTrack$1,
+    {
+      className: cn(
+        "bg-muted h-1.5 rounded-full relative flex w-full items-center overflow-x-hidden",
+        className
+      ),
+      "data-slot": "progress-track",
+      ...props
+    }
+  );
+}
+function ProgressIndicator({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    ProgressIndicator$1,
+    {
+      "data-slot": "progress-indicator",
+      className: cn("bg-primary h-full transition-all", className),
+      ...props
+    }
+  );
+}
+function ProgressLabel({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    ProgressLabel$1,
+    {
+      className: cn("text-sm font-medium", className),
+      "data-slot": "progress-label",
+      ...props
+    }
+  );
+}
+function ProgressValue({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    ProgressValue$1,
+    {
+      className: cn(
+        "text-muted-foreground ml-auto text-sm tabular-nums",
+        className
+      ),
+      "data-slot": "progress-value",
+      ...props
+    }
+  );
+}
+export {
+  Progress,
+  ProgressIndicator,
+  ProgressLabel,
+  ProgressTrack,
+  ProgressValue
+};
+//# sourceMappingURL=progress.js.map

package/dist/components/ui/src/components/ui/progress.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"progress.js","sources":["../../../../../../src/components/ui/progress.tsx"],"sourcesContent":["\"use client\";\n\nimport { Progress as ProgressPrimitive } from \"@base-ui/react/progress\";\n\nimport { cn } from \"@/lib/utils\";\n\ntype ProgressProps = ProgressPrimitive.Root.Props;\n\n/**\n * Root container for progress bar with label and value support.\n * Automatically includes track and indicator. Use `value={null}` for indeterminate state.\n */\nfunction Progress({ className, children, value, ...props }: ProgressProps) {\n  return (\n    <ProgressPrimitive.Root\n      value={value}\n      data-slot=\"progress\"\n      className={cn(\"flex flex-wrap gap-3\", className)}\n      {...props}\n    >\n      {children}\n    </ProgressPrimitive.Root>\n  );\n}\n\ntype ProgressTrackProps = ProgressPrimitive.Track.Props;\n\n/**\n * Container for the progress indicator. Customize height with className (e.g., `h-2`, `h-3`).\n */\nfunction ProgressTrack({ className, ...props }: ProgressTrackProps) {\n  return (\n    <ProgressPrimitive.Track\n      className={cn(\n        \"bg-muted h-1.5 rounded-full relative flex w-full items-center overflow-x-hidden\",\n        className,\n      )}\n      data-slot=\"progress-track\"\n      {...props}\n    />\n  );\n}\n\ntype ProgressIndicatorProps = ProgressPrimitive.Indicator.Props;\n\n/**\n * Visual indicator showing progress completion. Customize color with className\n * (e.g., `bg-green-500`, `bg-red-500` for semantic states).\n */\nfunction ProgressIndicator({ className, ...props }: ProgressIndicatorProps) {\n  return (\n    <ProgressPrimitive.Indicator\n      data-slot=\"progress-indicator\"\n      className={cn(\"bg-primary h-full transition-all\", className)}\n      {...props}\n    />\n  );\n}\n\ntype ProgressLabelProps = ProgressPrimitive.Label.Props;\n\n/**\n * Text label describing the progress task.\n */\nfunction ProgressLabel({ className, ...props }: ProgressLabelProps) {\n  return (\n    <ProgressPrimitive.Label\n      className={cn(\"text-sm font-medium\", className)}\n      data-slot=\"progress-label\"\n      {...props}\n    />\n  );\n}\n\ntype ProgressValueProps = ProgressPrimitive.Value.Props;\n\n/**\n * Displays formatted progress value (e.g., \"65%\"). Auto-positioned to right via `ml-auto`.\n */\nfunction ProgressValue({ className, ...props }: ProgressValueProps) {\n  return (\n    <ProgressPrimitive.Value\n      className={cn(\n        \"text-muted-foreground ml-auto text-sm tabular-nums\",\n        className,\n      )}\n      data-slot=\"progress-value\"\n      {...props}\n    />\n  );\n}\n\nexport {\n  Progress,\n  ProgressTrack,\n  ProgressIndicator,\n  ProgressLabel,\n  ProgressValue,\n  type ProgressProps,\n  type ProgressTrackProps,\n  type ProgressIndicatorProps,\n  type ProgressLabelProps,\n  type ProgressValueProps,\n};\n"],"names":["ProgressPrimitive.Root","ProgressPrimitive.Track","ProgressPrimitive.Indicator","ProgressPrimitive.Label","ProgressPrimitive.Value"],"mappings":";;;;;;;;AAYA;AACE;AACE;AAACA;AAAA;AACC;AACU;AACqC;AAC3C;AAEH;AAAA;AAGP;AAOA;AACE;AACE;AAACC;AAAA;AACY;AACT;AACA;AAAA;AAEQ;AACN;AAAA;AAGV;AAQA;AACE;AACE;AAACC;AAAA;AACW;AACiD;AACvD;AAAA;AAGV;AAOA;AACE;AACE;AAACC;AAAA;AAC+C;AACpC;AACN;AAAA;AAGV;AAOA;AACE;AACE;AAACC;AAAA;AACY;AACT;AACA;AAAA;AAEQ;AACN;AAAA;AAGV;;;;;;;;"}

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

@@ -0,0 +1,42 @@
+import { jsx } from "react/jsx-runtime";
+import { cn } from "../../../../../lib/utils.js";
+import { RadioGroup as RadioGroup$1 } from "../../../../../node_modules/@base-ui/react/esm/radio-group/RadioGroup.js";
+import Circle from "../../../../../node_modules/lucide-react/dist/esm/icons/circle.js";
+import { RadioRoot } from "../../../../../node_modules/@base-ui/react/esm/radio/root/RadioRoot.js";
+import { RadioIndicator } from "../../../../../node_modules/@base-ui/react/esm/radio/indicator/RadioIndicator.js";
+function RadioGroup({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    RadioGroup$1,
+    {
+      "data-slot": "radio-group",
+      className: cn("grid gap-3 w-full", className),
+      ...props
+    }
+  );
+}
+function RadioGroupItem({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    RadioRoot,
+    {
+      "data-slot": "radio-group-item",
+      className: cn(
+        "border-input text-primary dark:bg-input/30 focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 flex size-4 rounded-full shadow-xs focus-visible:ring-[3px] aria-invalid:ring-[3px] group/radio-group-item peer relative aspect-square shrink-0 border outline-none after:absolute after:-inset-x-3 after:-inset-y-2 disabled:cursor-not-allowed disabled:opacity-50",
+        className
+      ),
+      ...props,
+      children: /* @__PURE__ */ jsx(
+        RadioIndicator,
+        {
+          "data-slot": "radio-group-indicator",
+          className: "group-aria-invalid/radio-group-item:text-destructive text-primary flex size-4 items-center justify-center",
+          children: /* @__PURE__ */ jsx(Circle, { className: "absolute top-1/2 left-1/2 size-2 -translate-x-1/2 -translate-y-1/2 fill-current" })
+        }
+      )
+    }
+  );
+}
+export {
+  RadioGroup,
+  RadioGroupItem
+};
+//# sourceMappingURL=radio-group.js.map

package/dist/components/ui/src/components/ui/radio-group.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"radio-group.js","sources":["../../../../../../src/components/ui/radio-group.tsx"],"sourcesContent":["import { Radio as RadioPrimitive } from \"@base-ui/react/radio\";\nimport { RadioGroup as RadioGroupPrimitive } from \"@base-ui/react/radio-group\";\n\nimport { cn } from \"@/lib/utils\";\nimport { CircleIcon } from \"lucide-react\";\n\ntype RadioGroupProps = RadioGroupPrimitive.Props;\n\n/**\n * Container for radio button items. Manages shared state and ensures only one option can be selected.\n * Supports controlled and uncontrolled usage.\n */\nfunction RadioGroup({ className, ...props }: RadioGroupProps) {\n  return (\n    <RadioGroupPrimitive\n      data-slot=\"radio-group\"\n      className={cn(\"grid gap-3 w-full\", className)}\n      {...props}\n    />\n  );\n}\n\ntype RadioGroupItemProps = RadioPrimitive.Root.Props;\n\n/**\n * Individual radio button item. Use with RadioGroup to create mutually exclusive selections.\n * Automatically renders an indicator when checked.\n */\nfunction RadioGroupItem({ className, ...props }: RadioGroupItemProps) {\n  return (\n    <RadioPrimitive.Root\n      data-slot=\"radio-group-item\"\n      className={cn(\n        \"border-input text-primary dark:bg-input/30 focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 flex size-4 rounded-full shadow-xs focus-visible:ring-[3px] aria-invalid:ring-[3px] group/radio-group-item peer relative aspect-square shrink-0 border outline-none after:absolute after:-inset-x-3 after:-inset-y-2 disabled:cursor-not-allowed disabled:opacity-50\",\n        className,\n      )}\n      {...props}\n    >\n      <RadioPrimitive.Indicator\n        data-slot=\"radio-group-indicator\"\n        className=\"group-aria-invalid/radio-group-item:text-destructive text-primary flex size-4 items-center justify-center\"\n      >\n        <CircleIcon className=\"absolute top-1/2 left-1/2 size-2 -translate-x-1/2 -translate-y-1/2 fill-current\" />\n      </RadioPrimitive.Indicator>\n    </RadioPrimitive.Root>\n  );\n}\n\nexport {\n  RadioGroup,\n  RadioGroupItem,\n  type RadioGroupProps,\n  type RadioGroupItemProps,\n};\n"],"names":["RadioGroupPrimitive","RadioPrimitive.Root","RadioPrimitive.Indicator","CircleIcon"],"mappings":";;;;;;AAYA,SAAS,WAAW,EAAE,WAAW,GAAG,SAA0B;AAC5D,SACE;AAAA,IAACA;AAAAA,IAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,qBAAqB,SAAS;AAAA,MAC3C,GAAG;AAAA,IAAA;AAAA,EAAA;AAGV;AAQA,SAAS,eAAe,EAAE,WAAW,GAAG,SAA8B;AACpE,SACE;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MAAA;AAAA,MAED,GAAG;AAAA,MAEJ,UAAA;AAAA,QAACC;AAAAA,QAAA;AAAA,UACC,aAAU;AAAA,UACV,WAAU;AAAA,UAEV,UAAA,oBAACC,QAAA,EAAW,WAAU,kFAAA,CAAkF;AAAA,QAAA;AAAA,MAAA;AAAA,IAC1G;AAAA,EAAA;AAGN;"}

package/dist/components/ui/src/components/ui/resizable.js

@@ -0,0 +1,122 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { Separator as Ht, Panel as $t, Group as Tt } from "../../../../../node_modules/react-resizable-panels/dist/react-resizable-panels.js";
+import { cn } from "../../../../../lib/utils.js";
+const DEFAULT_DURATION = 400;
+const DEFAULT_EASING = "cubic-bezier(0.16, 1, 0.3, 1)";
+function getTransitionStyle(durationMs, easing) {
+  const seconds = durationMs / 1e3;
+  return `flex-grow ${seconds}s ${easing}, flex-basis ${seconds}s ${easing}`;
+}
+function ResizablePanelGroup({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    Tt,
+    {
+      "data-slot": "resizable-panel-group",
+      className: cn(
+        "flex h-full w-full aria-[orientation=vertical]:flex-col",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function ResizablePanel({
+  className,
+  animated,
+  collapsed,
+  duration = DEFAULT_DURATION,
+  ...props
+}) {
+  const panelRef = React.useRef(null);
+  const elementRef = React.useRef(null);
+  const animatedRef = React.useRef(animated);
+  const durationRef = React.useRef(duration);
+  const prevCollapsedRef = React.useRef(void 0);
+  React.useEffect(() => {
+    animatedRef.current = animated;
+    durationRef.current = duration;
+  }, [animated, duration]);
+  const withTransition = React.useCallback(
+    (action, skipAnimation = false) => {
+      const panelEl = elementRef.current?.closest(
+        '[data-panel][data-slot="resizable-panel"]'
+      );
+      if (animatedRef.current && panelEl && !skipAnimation) {
+        const ms = durationRef.current;
+        const easing = getComputedStyle(panelEl).getPropertyValue("--resizable-easing").trim() || DEFAULT_EASING;
+        panelEl.style.transition = getTransitionStyle(ms, easing);
+        action();
+        setTimeout(() => {
+          panelEl.style.transition = "";
+        }, ms);
+      } else {
+        action();
+      }
+    },
+    []
+  );
+  React.useEffect(() => {
+    if (collapsed === void 0) return;
+    const isFirstSync = prevCollapsedRef.current === void 0;
+    const hasChanged = collapsed !== prevCollapsedRef.current;
+    prevCollapsedRef.current = collapsed;
+    if (!hasChanged && !isFirstSync) return;
+    const syncState = () => {
+      try {
+        const isCurrentlyCollapsed = panelRef.current?.isCollapsed() ?? false;
+        if (collapsed === isCurrentlyCollapsed) return;
+        if (collapsed) {
+          if (isFirstSync) {
+            panelRef.current?.collapse();
+          } else {
+            withTransition(() => panelRef.current?.collapse());
+          }
+        } else {
+          withTransition(() => panelRef.current?.expand());
+        }
+      } catch {
+        setTimeout(syncState, 0);
+      }
+    };
+    setTimeout(syncState, 0);
+  }, [collapsed, withTransition]);
+  return /* @__PURE__ */ jsx(
+    $t,
+    {
+      "data-slot": "resizable-panel",
+      panelRef,
+      elementRef,
+      className: cn(className),
+      ...props
+    }
+  );
+}
+function ResizableHandle({
+  withHandle,
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    Ht,
+    {
+      "data-slot": "resizable-handle",
+      className: cn(
+        "group bg-border focus-visible:ring-primary/50 focus-visible:bg-primary/50 relative flex w-px items-center justify-center after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:ring-1 focus-visible:ring-offset-1 focus-visible:ring-offset-background focus-visible:outline-hidden data-[resize-handle-state=hover]:bg-primary/50 data-[resize-handle-state=drag]:bg-primary/50 data-[resize-handle-state=active]:bg-primary/50 aria-[orientation=horizontal]:h-px aria-[orientation=horizontal]:w-full aria-[orientation=horizontal]:after:left-0 aria-[orientation=horizontal]:after:h-1 aria-[orientation=horizontal]:after:w-full aria-[orientation=horizontal]:after:translate-x-0 aria-[orientation=horizontal]:after:-translate-y-1/2 [&[aria-orientation=horizontal]>div]:rotate-90",
+        className
+      ),
+      ...props,
+      children: withHandle && /* @__PURE__ */ jsx("div", { className: "bg-border group-focus-visible:bg-primary/50 group-data-[resize-handle-state=hover]:bg-primary/50 group-data-[resize-handle-state=drag]:bg-primary/50 group-data-[resize-handle-state=active]:bg-primary/50 h-6 w-1 rounded-lg z-10 flex shrink-0" })
+    }
+  );
+}
+export {
+  ResizableHandle,
+  ResizablePanel,
+  ResizablePanelGroup
+};
+//# sourceMappingURL=resizable.js.map

package/dist/components/ui/src/components/ui/resizable.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"resizable.js","sources":["../../../../../../src/components/ui/resizable.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport {\n  Group as PanelGroup,\n  Panel,\n  Separator as PanelResizeHandle,\n  type PanelImperativeHandle,\n} from \"react-resizable-panels\";\n\nimport { cn } from \"@/lib/utils\";\n\n/** Default duration of the collapse/expand animation in milliseconds. */\nconst DEFAULT_DURATION = 400;\n\n/** Default easing function for collapse/expand animations. */\nconst DEFAULT_EASING = \"cubic-bezier(0.16, 1, 0.3, 1)\";\n\n/** Generate CSS transition value for animated collapse/expand. */\nfunction getTransitionStyle(durationMs: number, easing: string): string {\n  const seconds = durationMs / 1000;\n  return `flex-grow ${seconds}s ${easing}, flex-basis ${seconds}s ${easing}`;\n}\n\ntype ResizablePanelGroupProps = React.ComponentProps<typeof PanelGroup>;\n\n/**\n * Container for resizable panels. Manages layout orientation and panel resizing behavior.\n * Supports both horizontal and vertical layouts with optional persistence via `id` prop.\n */\nfunction ResizablePanelGroup({\n  className,\n  ...props\n}: ResizablePanelGroupProps) {\n  return (\n    <PanelGroup\n      data-slot=\"resizable-panel-group\"\n      className={cn(\n        \"flex h-full w-full aria-[orientation=vertical]:flex-col\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\ntype ResizablePanelProps = Omit<\n  React.ComponentProps<typeof Panel>,\n  \"panelRef\"\n> & {\n  /** Enable smooth CSS transition for collapse/expand. Drag resizing stays instant. @default false */\n  animated?: boolean;\n  /** Controlled collapsed state. When provided, the panel syncs to this value. */\n  collapsed?: boolean;\n  /** Animation duration in milliseconds. Only applies when `animated` is true. @default 400 */\n  duration?: number;\n};\n\n/**\n * Individual resizable panel within a ResizablePanelGroup.\n * Supports size constraints (minSize, maxSize), default sizing, and collapse behavior.\n *\n * Control collapse state declaratively via the `collapsed` prop.\n * When `animated` is true, collapse/expand transitions are smooth.\n *\n * @example\n * <ResizablePanel collapsed={isCollapsed} animated collapsible>\n */\nfunction ResizablePanel({\n  className,\n  animated,\n  collapsed,\n  duration = DEFAULT_DURATION,\n  ...props\n}: ResizablePanelProps) {\n  const panelRef = React.useRef<PanelImperativeHandle>(null);\n  const elementRef = React.useRef<HTMLDivElement>(null);\n  const animatedRef = React.useRef(animated);\n  const durationRef = React.useRef(duration);\n  const prevCollapsedRef = React.useRef<boolean | undefined>(undefined);\n\n  // Keep the refs in sync with prop changes\n  React.useEffect(() => {\n    animatedRef.current = animated;\n    durationRef.current = duration;\n  }, [animated, duration]);\n\n  /** Apply transition, call action, then remove transition after duration */\n  const withTransition = React.useCallback(\n    (action: () => void, skipAnimation = false) => {\n      const panelEl = elementRef.current?.closest(\n        '[data-panel][data-slot=\"resizable-panel\"]',\n      ) as HTMLElement | null;\n\n      if (animatedRef.current && panelEl && !skipAnimation) {\n        const ms = durationRef.current;\n        // Read easing from CSS variable, fallback to default\n        const easing =\n          getComputedStyle(panelEl)\n            .getPropertyValue(\"--resizable-easing\")\n            .trim() || DEFAULT_EASING;\n        panelEl.style.transition = getTransitionStyle(ms, easing);\n        action();\n        setTimeout(() => {\n          panelEl.style.transition = \"\";\n        }, ms);\n      } else {\n        action();\n      }\n    },\n    [],\n  );\n\n  // Sync collapsed prop to panel state\n  React.useEffect(() => {\n    if (collapsed === undefined) return;\n\n    const isFirstSync = prevCollapsedRef.current === undefined;\n    const hasChanged = collapsed !== prevCollapsedRef.current;\n    prevCollapsedRef.current = collapsed;\n\n    if (!hasChanged && !isFirstSync) return;\n\n    // Helper to safely call collapse/expand with retry logic\n    const syncState = () => {\n      try {\n        const isCurrentlyCollapsed = panelRef.current?.isCollapsed() ?? false;\n        if (collapsed === isCurrentlyCollapsed) return;\n\n        if (collapsed) {\n          if (isFirstSync) {\n            // First sync: no animation\n            panelRef.current?.collapse();\n          } else {\n            withTransition(() => panelRef.current?.collapse());\n          }\n        } else {\n          withTransition(() => panelRef.current?.expand());\n        }\n      } catch {\n        // Panel not ready yet, retry after a tick\n        setTimeout(syncState, 0);\n      }\n    };\n\n    // Use setTimeout(0) to ensure we're after the panel group's layout effects\n    setTimeout(syncState, 0);\n  }, [collapsed, withTransition]);\n\n  return (\n    <Panel\n      data-slot=\"resizable-panel\"\n      panelRef={panelRef}\n      elementRef={elementRef}\n      className={cn(className)}\n      {...props}\n    />\n  );\n}\n\ntype ResizableHandleProps = React.ComponentProps<typeof PanelResizeHandle> & {\n  /** Display a visible grip indicator on the resize handle. @default false */\n  withHandle?: boolean;\n};\n\n/**\n * Resize handle between panels. Appears as a thin line with optional visible grip indicator.\n * Supports keyboard navigation and focus states.\n */\nfunction ResizableHandle({\n  withHandle,\n  className,\n  ...props\n}: ResizableHandleProps) {\n  return (\n    <PanelResizeHandle\n      data-slot=\"resizable-handle\"\n      className={cn(\n        \"group bg-border focus-visible:ring-primary/50 focus-visible:bg-primary/50 relative flex w-px items-center justify-center after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:ring-1 focus-visible:ring-offset-1 focus-visible:ring-offset-background focus-visible:outline-hidden data-[resize-handle-state=hover]:bg-primary/50 data-[resize-handle-state=drag]:bg-primary/50 data-[resize-handle-state=active]:bg-primary/50 aria-[orientation=horizontal]:h-px aria-[orientation=horizontal]:w-full aria-[orientation=horizontal]:after:left-0 aria-[orientation=horizontal]:after:h-1 aria-[orientation=horizontal]:after:w-full aria-[orientation=horizontal]:after:translate-x-0 aria-[orientation=horizontal]:after:-translate-y-1/2 [&[aria-orientation=horizontal]>div]:rotate-90\",\n        className,\n      )}\n      {...props}\n    >\n      {withHandle && (\n        <div className=\"bg-border group-focus-visible:bg-primary/50 group-data-[resize-handle-state=hover]:bg-primary/50 group-data-[resize-handle-state=drag]:bg-primary/50 group-data-[resize-handle-state=active]:bg-primary/50 h-6 w-1 rounded-lg z-10 flex shrink-0\" />\n      )}\n    </PanelResizeHandle>\n  );\n}\n\nexport {\n  ResizablePanelGroup,\n  ResizablePanel,\n  ResizableHandle,\n  type ResizablePanelGroupProps,\n  type ResizablePanelProps,\n  type ResizableHandleProps,\n};\n"],"names":["PanelGroup","Panel","PanelResizeHandle"],"mappings":";;;;;AAaA;AAGA;AAGA;AACE;AACA;AACF;AAQA;AAA6B;AAC3B;AAEF;AACE;AACE;AAACA;AAAA;AACW;AACC;AACT;AACA;AAAA;AAEE;AAAA;AAGV;AAwBA;AAAwB;AACtB;AACA;AACA;AACW;AAEb;AACE;AACA;AACA;AACA;AACA;AAGA;AACE;AACA;AAAsB;AAIxB;AAA6B;AAEzB;AAAoC;AAClC;AAGF;AACE;AAEA;AAIA;AACA;AACA;AACE;AAA2B;AACxB;AAEL;AAAA;AACF;AACF;AACA;AAIF;AACE;AAEA;AACA;AACA;AAEA;AAGA;AACE;AACE;AACA;AAEA;AACE;AAEE;AAAkB;AAElB;AAAiD;AACnD;AAEA;AAA+C;AACjD;AAGA;AAAuB;AACzB;AAIF;AAAuB;AAGzB;AACE;AAACC;AAAA;AACW;AACV;AACA;AACuB;AACnB;AAAA;AAGV;AAWA;AAAyB;AACvB;AACA;AAEF;AACE;AACE;AAACC;AAAA;AACW;AACC;AACT;AACA;AAAA;AAEE;AAGgQ;AAAA;AAI1Q;;;;;;"}

package/dist/components/ui/src/components/ui/scroll-area.js

@@ -0,0 +1,61 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import "react";
+import { cn } from "../../../../../lib/utils.js";
+import { ScrollAreaRoot } from "../../../../../node_modules/@base-ui/react/esm/scroll-area/root/ScrollAreaRoot.js";
+import { ScrollAreaViewport } from "../../../../../node_modules/@base-ui/react/esm/scroll-area/viewport/ScrollAreaViewport.js";
+import { ScrollAreaCorner } from "../../../../../node_modules/@base-ui/react/esm/scroll-area/corner/ScrollAreaCorner.js";
+import { ScrollAreaScrollbar } from "../../../../../node_modules/@base-ui/react/esm/scroll-area/scrollbar/ScrollAreaScrollbar.js";
+import { ScrollAreaThumb } from "../../../../../node_modules/@base-ui/react/esm/scroll-area/thumb/ScrollAreaThumb.js";
+function ScrollArea({ className, children, ...props }) {
+  return /* @__PURE__ */ jsxs(
+    ScrollAreaRoot,
+    {
+      "data-slot": "scroll-area",
+      className: cn("relative", className),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx(
+          ScrollAreaViewport,
+          {
+            "data-slot": "scroll-area-viewport",
+            className: "focus-visible:ring-ring/50 size-full rounded-[inherit] transition-[color,box-shadow] outline-none focus-visible:ring-[3px] focus-visible:outline-1",
+            children
+          }
+        ),
+        /* @__PURE__ */ jsx(ScrollBar, {}),
+        /* @__PURE__ */ jsx(ScrollAreaCorner, {})
+      ]
+    }
+  );
+}
+function ScrollBar({
+  className,
+  orientation = "vertical",
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    ScrollAreaScrollbar,
+    {
+      "data-slot": "scroll-area-scrollbar",
+      "data-orientation": orientation,
+      orientation,
+      className: cn(
+        "data-horizontal:h-2.5 data-horizontal:flex-col data-horizontal:border-t data-horizontal:border-t-transparent data-vertical:h-full data-vertical:w-2.5 data-vertical:border-l data-vertical:border-l-transparent flex touch-none p-px transition-colors select-none",
+        className
+      ),
+      ...props,
+      children: /* @__PURE__ */ jsx(
+        ScrollAreaThumb,
+        {
+          "data-slot": "scroll-area-thumb",
+          className: "rounded-full bg-border relative flex-1"
+        }
+      )
+    }
+  );
+}
+export {
+  ScrollArea,
+  ScrollBar
+};
+//# sourceMappingURL=scroll-area.js.map

package/dist/components/ui/src/components/ui/scroll-area.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"scroll-area.js","sources":["../../../../../../src/components/ui/scroll-area.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { ScrollArea as ScrollAreaPrimitive } from \"@base-ui/react/scroll-area\";\n\nimport { cn } from \"@/lib/utils\";\n\n/**\n * Props for the ScrollArea component\n * @property {string} className - Additional CSS classes to apply\n * @property {React.ReactNode} children - Content to be rendered within the scrollable area\n */\nexport type ScrollAreaProps = ScrollAreaPrimitive.Root.Props;\n\n/**\n * ScrollArea component that provides a customizable scrollable container with styled scrollbars.\n * Built on Base UI's ScrollArea primitive with automatic overflow detection and custom scrollbar styling.\n *\n * @component\n * @example\n * ```tsx\n * <ScrollArea className=\"h-72 w-48 rounded-md border p-4\">\n *   <div>Long content that needs scrolling...</div>\n * </ScrollArea>\n * ```\n *\n * @example\n * ```tsx\n * // With horizontal scrolling\n * <ScrollArea className=\"w-96 whitespace-nowrap rounded-md border\">\n *   <div className=\"flex gap-4 p-4\">\n *     <div>Item 1</div>\n *     <div>Item 2</div>\n *     <div>Item 3</div>\n *   </div>\n * </ScrollArea>\n * ```\n *\n * @param {ScrollAreaProps} props - Component props extending Base UI ScrollArea.Root.Props\n * @returns {React.ReactElement} A styled scrollable container with custom scrollbars\n */\nfunction ScrollArea({ className, children, ...props }: ScrollAreaProps) {\n  return (\n    <ScrollAreaPrimitive.Root\n      data-slot=\"scroll-area\"\n      className={cn(\"relative\", className)}\n      {...props}\n    >\n      <ScrollAreaPrimitive.Viewport\n        data-slot=\"scroll-area-viewport\"\n        className=\"focus-visible:ring-ring/50 size-full rounded-[inherit] transition-[color,box-shadow] outline-none focus-visible:ring-[3px] focus-visible:outline-1\"\n      >\n        {children}\n      </ScrollAreaPrimitive.Viewport>\n      <ScrollBar />\n      <ScrollAreaPrimitive.Corner />\n    </ScrollAreaPrimitive.Root>\n  );\n}\n\n/**\n * Props for the ScrollBar component\n * @property {string} className - Additional CSS classes to apply\n * @property {\"vertical\" | \"horizontal\"} orientation - Scrollbar orientation (default: \"vertical\")\n */\nexport type ScrollBarProps = ScrollAreaPrimitive.Scrollbar.Props;\n\n/**\n * ScrollBar component that renders a custom-styled scrollbar for the ScrollArea.\n * Automatically positions itself based on orientation and includes a draggable thumb.\n * Typically used internally by ScrollArea but can be used independently for custom layouts.\n *\n * @component\n * @example\n * ```tsx\n * // Custom ScrollArea with horizontal scrollbar only\n * <ScrollAreaPrimitive.Root>\n *   <ScrollAreaPrimitive.Viewport>\n *     {children}\n *   </ScrollAreaPrimitive.Viewport>\n *   <ScrollBar orientation=\"horizontal\" />\n * </ScrollAreaPrimitive.Root>\n * ```\n *\n * @param {ScrollBarProps} props - Component props extending Base UI ScrollArea.Scrollbar.Props\n * @returns {React.ReactElement} A styled scrollbar with draggable thumb\n */\nfunction ScrollBar({\n  className,\n  orientation = \"vertical\",\n  ...props\n}: ScrollBarProps) {\n  return (\n    <ScrollAreaPrimitive.Scrollbar\n      data-slot=\"scroll-area-scrollbar\"\n      data-orientation={orientation}\n      orientation={orientation}\n      className={cn(\n        \"data-horizontal:h-2.5 data-horizontal:flex-col data-horizontal:border-t data-horizontal:border-t-transparent data-vertical:h-full data-vertical:w-2.5 data-vertical:border-l data-vertical:border-l-transparent flex touch-none p-px transition-colors select-none\",\n        className,\n      )}\n      {...props}\n    >\n      <ScrollAreaPrimitive.Thumb\n        data-slot=\"scroll-area-thumb\"\n        className=\"rounded-full bg-border relative flex-1\"\n      />\n    </ScrollAreaPrimitive.Scrollbar>\n  );\n}\n\nexport { ScrollArea, ScrollBar };\n"],"names":["ScrollAreaPrimitive.Root","ScrollAreaPrimitive.Viewport","ScrollAreaPrimitive.Corner","ScrollAreaPrimitive.Scrollbar","ScrollAreaPrimitive.Thumb"],"mappings":";;;;;;;;AAuCA,SAAS,WAAW,EAAE,WAAW,UAAU,GAAG,SAA0B;AACtE,SACE;AAAA,IAACA;AAAAA,IAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,YAAY,SAAS;AAAA,MAClC,GAAG;AAAA,MAEJ,UAAA;AAAA,QAAA;AAAA,UAACC;AAAAA,UAAA;AAAA,YACC,aAAU;AAAA,YACV,WAAU;AAAA,YAET;AAAA,UAAA;AAAA,QAAA;AAAA,4BAEF,WAAA,EAAU;AAAA,QACX,oBAACC,kBAAA,CAAA,CAA2B;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGlC;AA6BA,SAAS,UAAU;AAAA,EACjB;AAAA,EACA,cAAc;AAAA,EACd,GAAG;AACL,GAAmB;AACjB,SACE;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,aAAU;AAAA,MACV,oBAAkB;AAAA,MAClB;AAAA,MACA,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MAAA;AAAA,MAED,GAAG;AAAA,MAEJ,UAAA;AAAA,QAACC;AAAAA,QAAA;AAAA,UACC,aAAU;AAAA,UACV,WAAU;AAAA,QAAA;AAAA,MAAA;AAAA,IACZ;AAAA,EAAA;AAGN;"}

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

@@ -0,0 +1,200 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import "react";
+import { cn } from "../../../../../lib/utils.js";
+import Check from "../../../../../node_modules/lucide-react/dist/esm/icons/check.js";
+import ChevronDown from "../../../../../node_modules/lucide-react/dist/esm/icons/chevron-down.js";
+import ChevronUp from "../../../../../node_modules/lucide-react/dist/esm/icons/chevron-up.js";
+import { SelectRoot } from "../../../../../node_modules/@base-ui/react/esm/select/root/SelectRoot.js";
+import { SelectPortal } from "../../../../../node_modules/@base-ui/react/esm/select/portal/SelectPortal.js";
+import { SelectPositioner } from "../../../../../node_modules/@base-ui/react/esm/select/positioner/SelectPositioner.js";
+import { SelectPopup } from "../../../../../node_modules/@base-ui/react/esm/select/popup/SelectPopup.js";
+import { SelectList } from "../../../../../node_modules/@base-ui/react/esm/select/list/SelectList.js";
+import { SelectGroup as SelectGroup$1 } from "../../../../../node_modules/@base-ui/react/esm/select/group/SelectGroup.js";
+import { SelectItem as SelectItem$1 } from "../../../../../node_modules/@base-ui/react/esm/select/item/SelectItem.js";
+import { SelectItemText } from "../../../../../node_modules/@base-ui/react/esm/select/item-text/SelectItemText.js";
+import { SelectItemIndicator } from "../../../../../node_modules/@base-ui/react/esm/select/item-indicator/SelectItemIndicator.js";
+import { SelectGroupLabel } from "../../../../../node_modules/@base-ui/react/esm/select/group-label/SelectGroupLabel.js";
+import { SelectScrollDownArrow } from "../../../../../node_modules/@base-ui/react/esm/select/scroll-down-arrow/SelectScrollDownArrow.js";
+import { SelectScrollUpArrow } from "../../../../../node_modules/@base-ui/react/esm/select/scroll-up-arrow/SelectScrollUpArrow.js";
+import { Separator } from "../../../../../node_modules/@base-ui/react/esm/separator/Separator.js";
+import { SelectTrigger as SelectTrigger$1 } from "../../../../../node_modules/@base-ui/react/esm/select/trigger/SelectTrigger.js";
+import { SelectIcon } from "../../../../../node_modules/@base-ui/react/esm/select/icon/SelectIcon.js";
+import { SelectValue as SelectValue$1 } from "../../../../../node_modules/@base-ui/react/esm/select/value/SelectValue.js";
+const Select = SelectRoot;
+function SelectGroup({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    SelectGroup$1,
+    {
+      "data-slot": "select-group",
+      className: cn("scroll-my-1 p-1", className),
+      ...props
+    }
+  );
+}
+function SelectValue({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    SelectValue$1,
+    {
+      "data-slot": "select-value",
+      className: cn("flex flex-1 text-left", className),
+      ...props
+    }
+  );
+}
+function SelectTrigger({
+  className,
+  size = "default",
+  children,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs(
+    SelectTrigger$1,
+    {
+      "data-slot": "select-trigger",
+      "data-size": size,
+      className: cn(
+        "border-input data-[placeholder]:text-muted-foreground dark:bg-input/30 dark:hover:bg-input/50 focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 gap-1.5 rounded-lg border bg-transparent py-2 pr-2 pl-2.5 text-sm shadow-xs transition-[color,box-shadow] focus-visible:ring-[3px] aria-invalid:ring-[3px] data-[size=default]:h-9 data-[size=sm]:h-8 *:data-[slot=select-value]:flex *:data-[slot=select-value]:gap-1.5 [&_svg:not([class*='size-'])]:size-4 flex w-fit items-center justify-between whitespace-nowrap outline-none disabled:cursor-not-allowed disabled:opacity-50 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center [&_svg]:pointer-events-none [&_svg]:shrink-0",
+        className
+      ),
+      ...props,
+      children: [
+        children,
+        /* @__PURE__ */ jsx(
+          SelectIcon,
+          {
+            render: /* @__PURE__ */ jsx(ChevronDown, { className: "text-muted-foreground size-4 pointer-events-none" })
+          }
+        )
+      ]
+    }
+  );
+}
+function SelectContent({
+  className,
+  children,
+  side = "bottom",
+  sideOffset = 4,
+  align = "start",
+  alignOffset = 0,
+  alignItemWithTrigger = false,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(SelectPortal, { children: /* @__PURE__ */ jsx(
+    SelectPositioner,
+    {
+      side,
+      sideOffset,
+      align,
+      alignOffset,
+      alignItemWithTrigger,
+      className: "isolate z-50",
+      children: /* @__PURE__ */ jsxs(
+        SelectPopup,
+        {
+          "data-slot": "select-content",
+          className: cn(
+            "bg-popover text-popover-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 ring-foreground/10 min-w-36 rounded-4xl p-2 shadow-md ring-1 duration-100 relative isolate z-50 max-h-(--available-height) w-(--anchor-width) origin-(--transform-origin) overflow-x-hidden overflow-y-auto",
+            className
+          ),
+          ...props,
+          children: [
+            /* @__PURE__ */ jsx(SelectScrollUpButton, {}),
+            /* @__PURE__ */ jsx(SelectList, { children }),
+            /* @__PURE__ */ jsx(SelectScrollDownButton, {})
+          ]
+        }
+      )
+    }
+  ) });
+}
+function SelectLabel({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    SelectGroupLabel,
+    {
+      "data-slot": "select-label",
+      className: cn("text-muted-foreground px-2 py-1.5 text-xs", className),
+      ...props
+    }
+  );
+}
+function SelectItem({ className, children, ...props }) {
+  return /* @__PURE__ */ jsxs(
+    SelectItem$1,
+    {
+      "data-slot": "select-item",
+      className: cn(
+        "focus:bg-accent focus:text-accent-foreground not-data-[variant=destructive]:focus:**:text-accent-foreground gap-2 rounded-full py-1.5 pr-8 pl-2 text-sm [&_svg:not([class*='size-'])]:size-4 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2 relative flex w-full cursor-default items-center outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0",
+        className
+      ),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx(SelectItemText, { className: "flex flex-1 gap-2 shrink-0 whitespace-nowrap", children }),
+        /* @__PURE__ */ jsx(
+          SelectItemIndicator,
+          {
+            render: /* @__PURE__ */ jsx("span", { className: "pointer-events-none absolute right-2 flex size-4 items-center justify-center" }),
+            children: /* @__PURE__ */ jsx(Check, { className: "pointer-events-none" })
+          }
+        )
+      ]
+    }
+  );
+}
+function SelectSeparator({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    Separator,
+    {
+      "data-slot": "select-separator",
+      className: cn("bg-border -mx-1 my-1 h-px pointer-events-none", className),
+      ...props
+    }
+  );
+}
+function SelectScrollUpButton({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    SelectScrollUpArrow,
+    {
+      "data-slot": "select-scroll-up-button",
+      className: cn(
+        "bg-popover z-10 flex cursor-default items-center justify-center py-1 [&_svg:not([class*='size-'])]:size-4 top-0 w-full",
+        className
+      ),
+      ...props,
+      children: /* @__PURE__ */ jsx(ChevronUp, {})
+    }
+  );
+}
+function SelectScrollDownButton({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    SelectScrollDownArrow,
+    {
+      "data-slot": "select-scroll-down-button",
+      className: cn(
+        "bg-popover z-10 flex cursor-default items-center justify-center py-1 [&_svg:not([class*='size-'])]:size-4 bottom-0 w-full",
+        className
+      ),
+      ...props,
+      children: /* @__PURE__ */ jsx(ChevronDown, {})
+    }
+  );
+}
+export {
+  Select,
+  SelectContent,
+  SelectGroup,
+  SelectItem,
+  SelectLabel,
+  SelectScrollDownButton,
+  SelectScrollUpButton,
+  SelectSeparator,
+  SelectTrigger,
+  SelectValue
+};
+//# sourceMappingURL=select.js.map

package/dist/components/ui/src/components/ui/select.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"select.js","sources":["../../../../../../src/components/ui/select.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { Select as SelectPrimitive } from \"@base-ui/react/select\";\n\nimport { cn } from \"@/lib/utils\";\nimport { ChevronDownIcon, CheckIcon, ChevronUpIcon } from \"lucide-react\";\n\ntype SelectProps<T = unknown> = SelectPrimitive.Root.Props<T>;\n\n/**\n * Select root component. Manages select state and provides context to children.\n * Use with SelectTrigger, SelectContent, SelectItem, and SelectValue.\n */\nconst Select = SelectPrimitive.Root;\n\ntype SelectGroupProps = SelectPrimitive.Group.Props;\n\n/**\n * Groups related select items with a label.\n */\nfunction SelectGroup({ className, ...props }: SelectGroupProps) {\n  return (\n    <SelectPrimitive.Group\n      data-slot=\"select-group\"\n      className={cn(\"scroll-my-1 p-1\", className)}\n      {...props}\n    />\n  );\n}\n\ntype SelectValueProps = SelectPrimitive.Value.Props;\n\n/**\n * Displays the selected item's value or placeholder text.\n */\nfunction SelectValue({ className, ...props }: SelectValueProps) {\n  return (\n    <SelectPrimitive.Value\n      data-slot=\"select-value\"\n      className={cn(\"flex flex-1 text-left\", className)}\n      {...props}\n    />\n  );\n}\n\ntype SelectTriggerProps = SelectPrimitive.Trigger.Props & {\n  /** Select trigger size. @default \"default\" */\n  size?: \"sm\" | \"default\";\n};\n\n/**\n * Button that opens the select dropdown. Automatically includes chevron icon.\n */\nfunction SelectTrigger({\n  className,\n  size = \"default\",\n  children,\n  ...props\n}: SelectTriggerProps) {\n  return (\n    <SelectPrimitive.Trigger\n      data-slot=\"select-trigger\"\n      data-size={size}\n      className={cn(\n        \"border-input data-[placeholder]:text-muted-foreground dark:bg-input/30 dark:hover:bg-input/50 focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 gap-1.5 rounded-lg border bg-transparent py-2 pr-2 pl-2.5 text-sm shadow-xs transition-[color,box-shadow] focus-visible:ring-[3px] aria-invalid:ring-[3px] data-[size=default]:h-9 data-[size=sm]:h-8 *:data-[slot=select-value]:flex *:data-[slot=select-value]:gap-1.5 [&_svg:not([class*='size-'])]:size-4 flex w-fit items-center justify-between whitespace-nowrap outline-none disabled:cursor-not-allowed disabled:opacity-50 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center [&_svg]:pointer-events-none [&_svg]:shrink-0\",\n        className,\n      )}\n      {...props}\n    >\n      {children}\n      <SelectPrimitive.Icon\n        render={\n          <ChevronDownIcon className=\"text-muted-foreground size-4 pointer-events-none\" />\n        }\n      />\n    </SelectPrimitive.Trigger>\n  );\n}\n\ntype SelectContentProps = SelectPrimitive.Popup.Props &\n  Pick<\n    SelectPrimitive.Positioner.Props,\n    \"align\" | \"alignOffset\" | \"side\" | \"sideOffset\" | \"alignItemWithTrigger\"\n  >;\n\n/**\n * Select dropdown content. Automatically renders in a portal with positioning and scroll buttons.\n */\nfunction SelectContent({\n  className,\n  children,\n  side = \"bottom\",\n  sideOffset = 4,\n  align = \"start\",\n  alignOffset = 0,\n  alignItemWithTrigger = false,\n  ...props\n}: SelectContentProps) {\n  return (\n    <SelectPrimitive.Portal>\n      <SelectPrimitive.Positioner\n        side={side}\n        sideOffset={sideOffset}\n        align={align}\n        alignOffset={alignOffset}\n        alignItemWithTrigger={alignItemWithTrigger}\n        className=\"isolate z-50\"\n      >\n        <SelectPrimitive.Popup\n          data-slot=\"select-content\"\n          className={cn(\n            \"bg-popover text-popover-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 ring-foreground/10 min-w-36 rounded-4xl p-2 shadow-md ring-1 duration-100 relative isolate z-50 max-h-(--available-height) w-(--anchor-width) origin-(--transform-origin) overflow-x-hidden overflow-y-auto\",\n            className,\n          )}\n          {...props}\n        >\n          <SelectScrollUpButton />\n          <SelectPrimitive.List>{children}</SelectPrimitive.List>\n          <SelectScrollDownButton />\n        </SelectPrimitive.Popup>\n      </SelectPrimitive.Positioner>\n    </SelectPrimitive.Portal>\n  );\n}\n\ntype SelectLabelProps = SelectPrimitive.GroupLabel.Props;\n\n/**\n * Label for a group of select items.\n */\nfunction SelectLabel({ className, ...props }: SelectLabelProps) {\n  return (\n    <SelectPrimitive.GroupLabel\n      data-slot=\"select-label\"\n      className={cn(\"text-muted-foreground px-2 py-1.5 text-xs\", className)}\n      {...props}\n    />\n  );\n}\n\ntype SelectItemProps = SelectPrimitive.Item.Props;\n\n/**\n * Individual selectable item. Automatically shows check icon when selected.\n */\nfunction SelectItem({ className, children, ...props }: SelectItemProps) {\n  return (\n    <SelectPrimitive.Item\n      data-slot=\"select-item\"\n      className={cn(\n        \"focus:bg-accent focus:text-accent-foreground not-data-[variant=destructive]:focus:**:text-accent-foreground gap-2 rounded-full py-1.5 pr-8 pl-2 text-sm [&_svg:not([class*='size-'])]:size-4 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2 relative flex w-full cursor-default items-center outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0\",\n        className,\n      )}\n      {...props}\n    >\n      <SelectPrimitive.ItemText className=\"flex flex-1 gap-2 shrink-0 whitespace-nowrap\">\n        {children}\n      </SelectPrimitive.ItemText>\n      <SelectPrimitive.ItemIndicator\n        render={\n          <span className=\"pointer-events-none absolute right-2 flex size-4 items-center justify-center\" />\n        }\n      >\n        <CheckIcon className=\"pointer-events-none\" />\n      </SelectPrimitive.ItemIndicator>\n    </SelectPrimitive.Item>\n  );\n}\n\ntype SelectSeparatorProps = SelectPrimitive.Separator.Props;\n\n/**\n * Visual separator between select groups.\n */\nfunction SelectSeparator({ className, ...props }: SelectSeparatorProps) {\n  return (\n    <SelectPrimitive.Separator\n      data-slot=\"select-separator\"\n      className={cn(\"bg-border -mx-1 my-1 h-px pointer-events-none\", className)}\n      {...props}\n    />\n  );\n}\n\ntype SelectScrollUpButtonProps = React.ComponentProps<\n  typeof SelectPrimitive.ScrollUpArrow\n>;\n\n/**\n * Scroll indicator button at the top of scrollable content.\n */\nfunction SelectScrollUpButton({\n  className,\n  ...props\n}: SelectScrollUpButtonProps) {\n  return (\n    <SelectPrimitive.ScrollUpArrow\n      data-slot=\"select-scroll-up-button\"\n      className={cn(\n        \"bg-popover z-10 flex cursor-default items-center justify-center py-1 [&_svg:not([class*='size-'])]:size-4 top-0 w-full\",\n        className,\n      )}\n      {...props}\n    >\n      <ChevronUpIcon />\n    </SelectPrimitive.ScrollUpArrow>\n  );\n}\n\ntype SelectScrollDownButtonProps = React.ComponentProps<\n  typeof SelectPrimitive.ScrollDownArrow\n>;\n\n/**\n * Scroll indicator button at the bottom of scrollable content.\n */\nfunction SelectScrollDownButton({\n  className,\n  ...props\n}: SelectScrollDownButtonProps) {\n  return (\n    <SelectPrimitive.ScrollDownArrow\n      data-slot=\"select-scroll-down-button\"\n      className={cn(\n        \"bg-popover z-10 flex cursor-default items-center justify-center py-1 [&_svg:not([class*='size-'])]:size-4 bottom-0 w-full\",\n        className,\n      )}\n      {...props}\n    >\n      <ChevronDownIcon />\n    </SelectPrimitive.ScrollDownArrow>\n  );\n}\n\nexport {\n  Select,\n  SelectContent,\n  SelectGroup,\n  SelectItem,\n  SelectLabel,\n  SelectScrollDownButton,\n  SelectScrollUpButton,\n  SelectSeparator,\n  SelectTrigger,\n  SelectValue,\n  type SelectProps,\n  type SelectContentProps,\n  type SelectGroupProps,\n  type SelectItemProps,\n  type SelectLabelProps,\n  type SelectScrollDownButtonProps,\n  type SelectScrollUpButtonProps,\n  type SelectSeparatorProps,\n  type SelectTriggerProps,\n  type SelectValueProps,\n};\n"],"names":["SelectPrimitive.Group","SelectPrimitive.Value","SelectPrimitive.Trigger","SelectPrimitive.Icon","SelectPrimitive.Positioner","SelectPrimitive.Popup","SelectPrimitive.GroupLabel","SelectPrimitive.Item","SelectPrimitive.ItemIndicator","SelectPrimitive.Separator","SelectPrimitive.ScrollUpArrow","SelectPrimitive.ScrollDownArrow"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAcA;AAOA;AACE;AACE;AAACA;AAAA;AACW;AACgC;AACtC;AAAA;AAGV;AAOA;AACE;AACE;AAACC;AAAA;AACW;AACsC;AAC5C;AAAA;AAGV;AAUA;AAAuB;AACrB;AACO;AACP;AAEF;AACE;AACE;AAACC;AAAA;AACW;AACC;AACA;AACT;AACA;AAAA;AAEE;AAEH;AAAA;AACD;AAACC;AAAA;AAEiF;AAAA;AAAA;AAElF;AAAA;AAGN;AAWA;AAAuB;AACrB;AACA;AACO;AACM;AACL;AACM;AACS;AAEzB;AACE;AAEI;AAACC;AAAA;AACC;AACA;AACA;AACA;AACA;AACU;AAEV;AAACC;AAAA;AACW;AACC;AACT;AACA;AAAA;AAEE;AAEJ;AAAsB;AACU;AACR;AAAA;AAAA;AAAA;AAC1B;AAIR;AAOA;AACE;AACE;AAACC;AAAA;AACW;AAC0D;AAChE;AAAA;AAGV;AAOA;AACE;AACE;AAACC;AAAA;AACW;AACC;AACT;AACA;AAAA;AAEE;AAEJ;AAEA;AACA;AAACC;AAAA;AAEkG;AAGtD;AAAA;AAAA;AAC7C;AAAA;AAGN;AAOA;AACE;AACE;AAACC;AAAA;AACW;AAC8D;AACpE;AAAA;AAGV;AASA;AAA8B;AAC5B;AAEF;AACE;AACE;AAACC;AAAA;AACW;AACC;AACT;AACA;AAAA;AAEE;AAEW;AAAA;AAGrB;AASA;AAAgC;AAC9B;AAEF;AACE;AACE;AAACC;AAAA;AACW;AACC;AACT;AACA;AAAA;AAEE;AAEa;AAAA;AAGvB;;;;;;;;;;;;;"}

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

@@ -0,0 +1,25 @@
+import { jsx } from "react/jsx-runtime";
+import { cn } from "../../../../../lib/utils.js";
+import { Separator as Separator$1 } from "../../../../../node_modules/@base-ui/react/esm/separator/Separator.js";
+function Separator({
+  className,
+  orientation = "horizontal",
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    Separator$1,
+    {
+      "data-slot": "separator",
+      orientation,
+      className: cn(
+        "bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:w-px data-[orientation=vertical]:self-stretch",
+        className
+      ),
+      ...props
+    }
+  );
+}
+export {
+  Separator
+};
+//# sourceMappingURL=separator.js.map

package/dist/components/ui/src/components/ui/separator.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"separator.js","sources":["../../../../../../src/components/ui/separator.tsx"],"sourcesContent":["import { Separator as SeparatorPrimitive } from \"@base-ui/react/separator\";\n\nimport { cn } from \"@/lib/utils\";\n\ntype SeparatorProps = SeparatorPrimitive.Props;\n\n/**\n * Visual divider for separating content sections.\n * Supports both horizontal (default) and vertical orientations.\n */\nfunction Separator({\n  className,\n  orientation = \"horizontal\",\n  ...props\n}: SeparatorProps) {\n  return (\n    <SeparatorPrimitive\n      data-slot=\"separator\"\n      orientation={orientation}\n      className={cn(\n        \"bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:w-px data-[orientation=vertical]:self-stretch\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nexport { Separator, type SeparatorProps };\n"],"names":["SeparatorPrimitive"],"mappings":";;;AAUA,SAAS,UAAU;AAAA,EACjB;AAAA,EACA,cAAc;AAAA,EACd,GAAG;AACL,GAAmB;AACjB,SACE;AAAA,IAACA;AAAAA,IAAA;AAAA,MACC,aAAU;AAAA,MACV;AAAA,MACA,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MAAA;AAAA,MAED,GAAG;AAAA,IAAA;AAAA,EAAA;AAGV;"}