@elabs-ai/components-ui 4.1.0 → 5.0.0

package/dist/chunk-4E73UAFA.js

@@ -0,0 +1,296 @@
+"use client";
+import {
+  useVirtualListbox
+} from "./chunk-AFJCS2WV.js";
+import {
+  Popover,
+  PopoverContent,
+  PopoverTrigger
+} from "./chunk-D3C3VVCX.js";
+import {
+  Input
+} from "./chunk-XYACSO57.js";
+import {
+  Badge
+} from "./chunk-ECCNRCC4.js";
+import {
+  useLocale
+} from "./chunk-EJQYE4MY.js";
+import {
+  Button
+} from "./chunk-VA2OONPE.js";
+import {
+  cn
+} from "./chunk-KBNWM27Q.js";
+
+// src/components/virtual-select/virtual-select.tsx
+import {
+  forwardRef,
+  useCallback,
+  useEffect,
+  useId,
+  useMemo,
+  useRef,
+  useState
+} from "react";
+import { Check, ChevronsUpDown } from "lucide-react";
+import { useVirtualizer } from "@tanstack/react-virtual";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+function toArray(v) {
+  if (v === void 0) return [];
+  if (Array.isArray(v)) return v;
+  return v === "" ? [] : [v];
+}
+var VirtualSelect = forwardRef(
+  function VirtualSelect2({
+    options,
+    multiple = false,
+    value,
+    defaultValue,
+    onValueChange,
+    placeholder,
+    searchPlaceholder,
+    emptyText,
+    estimateOptionHeight = 32,
+    maxListHeight = "18rem",
+    className,
+    ...props
+  }, ref) {
+    const { t } = useLocale();
+    const resolvedPlaceholder = placeholder ?? t("ui.virtualSelect.placeholder");
+    const resolvedSearchPlaceholder = searchPlaceholder ?? t("ui.virtualSelect.searchPlaceholder");
+    const resolvedEmptyText = emptyText ?? t("noResults");
+    const isControlled = value !== void 0;
+    const [internal, setInternal] = useState(() => toArray(defaultValue));
+    const selected = isControlled ? toArray(value) : internal;
+    const emit = useCallback(
+      (next) => {
+        if (!isControlled) setInternal(next);
+        if (multiple) {
+          onValueChange?.(next);
+        } else {
+          onValueChange?.(next[0] ?? "");
+        }
+      },
+      [isControlled, multiple, onValueChange]
+    );
+    const [open, setOpen] = useState(false);
+    const [query, setQuery] = useState("");
+    const searchRef = useRef(null);
+    useEffect(() => {
+      setQuery("");
+    }, [open]);
+    const filtered = useMemo(
+      () => options.filter((o) => o.label.toLowerCase().includes(query.toLowerCase())),
+      [options, query]
+    );
+    const optionByValue = useMemo(() => {
+      const map = /* @__PURE__ */ new Map();
+      for (const o of options) map.set(o.value, o);
+      return map;
+    }, [options]);
+    const [scrollEl, setScrollEl] = useState(null);
+    const virtualizer = useVirtualizer({
+      count: filtered.length,
+      getScrollElement: () => scrollEl,
+      estimateSize: () => estimateOptionHeight,
+      overscan: 5
+    });
+    const handleSelect = useCallback(
+      (optValue) => {
+        if (multiple) {
+          const next = selected.includes(optValue) ? selected.filter((v) => v !== optValue) : [...selected, optValue];
+          emit(next);
+        } else {
+          emit(selected[0] === optValue ? [] : [optValue]);
+          setOpen(false);
+        }
+      },
+      [multiple, selected, emit]
+    );
+    const { activeIndex, setActiveIndex, onInputKeyDown } = useVirtualListbox({
+      count: filtered.length,
+      filtered,
+      isOpen: open,
+      onSelect: handleSelect,
+      virtualizer
+    });
+    const uid = useId();
+    const listboxId = `${uid}-listbox`;
+    const optionId = (index) => `${uid}-option-${index}`;
+    const focusTimeoutRef = useRef(null);
+    useEffect(
+      () => () => {
+        if (focusTimeoutRef.current != null) clearTimeout(focusTimeoutRef.current);
+      },
+      []
+    );
+    const handleOpenChange = useCallback((next) => {
+      setOpen(next);
+      if (focusTimeoutRef.current != null) {
+        clearTimeout(focusTimeoutRef.current);
+        focusTimeoutRef.current = null;
+      }
+      if (next) {
+        focusTimeoutRef.current = setTimeout(() => {
+          focusTimeoutRef.current = null;
+          searchRef.current?.focus();
+        }, 0);
+      }
+    }, []);
+    const selectedLabels = selected.map((v) => ({
+      value: v,
+      label: optionByValue.get(v)?.label ?? v
+    }));
+    const triggerContent = selectedLabels.length === 0 ? /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: resolvedPlaceholder }) : multiple ? /* @__PURE__ */ jsxs(Fragment, { children: [
+      selectedLabels.slice(0, 2).map((l) => /* @__PURE__ */ jsx(
+        Badge,
+        {
+          variant: "secondary",
+          className: "max-w-[8rem] truncate border-border",
+          children: l.label
+        },
+        l.value
+      )),
+      selectedLabels.length > 2 ? /* @__PURE__ */ jsxs(
+        Badge,
+        {
+          variant: "secondary",
+          "aria-label": `and ${selectedLabels.length - 2} more selected`,
+          children: [
+            "+",
+            selectedLabels.length - 2
+          ]
+        }
+      ) : null
+    ] }) : /* @__PURE__ */ jsx("span", { className: "truncate", children: selectedLabels[0]?.label });
+    const virtualItems = virtualizer.getVirtualItems();
+    const activeMounted = virtualItems.some((v) => v.index === activeIndex);
+    return /* @__PURE__ */ jsxs(Popover, { open, onOpenChange: handleOpenChange, children: [
+      /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
+        Button,
+        {
+          ref,
+          type: "button",
+          variant: "outline",
+          role: "combobox",
+          "aria-expanded": open,
+          "aria-haspopup": "listbox",
+          "aria-controls": listboxId,
+          className: cn("h-auto min-h-9 w-full justify-between font-normal", className),
+          ...props,
+          children: [
+            /* @__PURE__ */ jsx("span", { className: "flex min-w-0 flex-1 flex-wrap items-center gap-1 text-start", children: triggerContent }),
+            /* @__PURE__ */ jsx(ChevronsUpDown, { className: "ms-2 size-4 shrink-0 opacity-50", "aria-hidden": "true" })
+          ]
+        }
+      ) }),
+      /* @__PURE__ */ jsxs(
+        PopoverContent,
+        {
+          className: "w-[var(--radix-popover-trigger-width)] min-w-64 p-0",
+          align: "start",
+          onOpenAutoFocus: (e) => e.preventDefault(),
+          children: [
+            /* @__PURE__ */ jsx("div", { className: "border-b p-1.5", children: /* @__PURE__ */ jsx(
+              Input,
+              {
+                ref: searchRef,
+                type: "text",
+                autoComplete: "off",
+                spellCheck: false,
+                placeholder: resolvedSearchPlaceholder,
+                value: query,
+                onChange: (e) => setQuery(e.target.value),
+                onKeyDown: (e) => onInputKeyDown(e),
+                "aria-label": resolvedSearchPlaceholder,
+                "aria-autocomplete": "list",
+                "aria-controls": listboxId,
+                "aria-activedescendant": activeIndex >= 0 && activeMounted ? optionId(activeIndex) : void 0,
+                className: "h-8 border-0 shadow-none"
+              }
+            ) }),
+            /* @__PURE__ */ jsx(
+              "div",
+              {
+                ref: setScrollEl,
+                id: listboxId,
+                role: "listbox",
+                "aria-multiselectable": multiple || void 0,
+                style: { maxHeight: maxListHeight },
+                className: "overflow-auto p-1",
+                children: filtered.length > 0 ? (
+                  // Spacer gives the virtualizer its full scroll height
+                  /* @__PURE__ */ jsx("div", { style: { height: virtualizer.getTotalSize() }, className: "relative", children: virtualItems.map((virtualRow) => {
+                    const opt = filtered[virtualRow.index];
+                    if (!opt) return null;
+                    const isSelected = selected.includes(opt.value);
+                    const isActive = activeIndex === virtualRow.index;
+                    return /* @__PURE__ */ jsxs(
+                      "div",
+                      {
+                        id: optionId(virtualRow.index),
+                        role: "option",
+                        "aria-selected": isSelected,
+                        "aria-disabled": opt.disabled || void 0,
+                        style: {
+                          position: "absolute",
+                          top: 0,
+                          left: 0,
+                          width: "100%",
+                          height: `${virtualRow.size}px`,
+                          transform: `translateY(${virtualRow.start}px)`
+                        },
+                        className: cn(
+                          "flex cursor-pointer select-none items-center rounded-sm px-2 text-body outline-none",
+                          "transition-colors duration-fast motion-reduce:transition-none",
+                          isActive && "bg-accent text-accent-foreground",
+                          !isActive && "hover:bg-accent hover:text-accent-foreground",
+                          opt.disabled && "pointer-events-none cursor-not-allowed opacity-50"
+                        ),
+                        onClick: () => {
+                          if (!opt.disabled) handleSelect(opt.value);
+                        },
+                        onMouseEnter: () => {
+                          if (!opt.disabled) setActiveIndex(virtualRow.index);
+                        },
+                        children: [
+                          /* @__PURE__ */ jsx(
+                            Check,
+                            {
+                              className: cn(
+                                "me-2 size-4 shrink-0",
+                                isSelected ? "opacity-100" : "opacity-0"
+                              ),
+                              "aria-hidden": "true"
+                            }
+                          ),
+                          /* @__PURE__ */ jsx("span", { className: "truncate", children: opt.label })
+                        ]
+                      },
+                      virtualRow.key
+                    );
+                  }) })
+                ) : null
+              }
+            ),
+            filtered.length === 0 ? /* @__PURE__ */ jsx(
+              "div",
+              {
+                role: "status",
+                "aria-live": "polite",
+                className: "px-2 py-6 text-center text-body text-muted-foreground",
+                children: resolvedEmptyText
+              }
+            ) : null
+          ]
+        }
+      )
+    ] });
+  }
+);
+
+export {
+  VirtualSelect
+};
+//# sourceMappingURL=chunk-4E73UAFA.js.map

package/dist/chunk-4E73UAFA.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/virtual-select/virtual-select.tsx"],"sourcesContent":["// a2ui.exposed: yes\n\"use client\";\n\nimport {\n  forwardRef,\n  useCallback,\n  useEffect,\n  useId,\n  useMemo,\n  useRef,\n  useState,\n  type ButtonHTMLAttributes,\n  type KeyboardEvent,\n} from \"react\";\nimport { Check, ChevronsUpDown } from \"lucide-react\";\nimport { useVirtualizer } from \"@tanstack/react-virtual\";\nimport { cn } from \"../../lib/cn\";\nimport { Badge } from \"../badge\";\nimport { Button } from \"../button\";\nimport { Input } from \"../input\";\nimport { Popover, PopoverContent, PopoverTrigger } from \"../popover\";\nimport { useLocale } from \"../locale-provider\";\nimport { type VirtualSelectOption, useVirtualListbox } from \"./use-virtual-listbox\";\n\nexport type { VirtualSelectOption };\n\nexport interface VirtualSelectProps extends Omit<\n  ButtonHTMLAttributes<HTMLButtonElement>,\n  \"value\" | \"onChange\" | \"defaultValue\"\n> {\n  /** The full option list. Only visible items are rendered in the DOM. */\n  options: VirtualSelectOption[];\n  /** Allow selecting multiple values. Default `false`. */\n  multiple?: boolean;\n  /** Controlled value — `string` in single mode, `string[]` in multiple mode. */\n  value?: string | string[];\n  /** Uncontrolled initial value. */\n  defaultValue?: string | string[];\n  /** Called when the selection changes. Emits `string` (single) or `string[]` (multiple). */\n  onValueChange?: (value: string | string[]) => void;\n  /** Trigger placeholder when nothing is selected. Default \"Select…\" */\n  placeholder?: string;\n  /** Search-input placeholder. Default \"Search…\" */\n  searchPlaceholder?: string;\n  /** Empty-state message when no options match the query. Default \"No results.\" */\n  emptyText?: string;\n  /**\n   * Estimated row height used by the virtualizer (px).\n   * Increase for taller rows (e.g. with descriptions). Default 32.\n   */\n  estimateOptionHeight?: number;\n  /**\n   * CSS max-height for the scrollable listbox. Default \"18rem\".\n   */\n  maxListHeight?: string;\n  className?: string;\n}\n\n// ---------------------------------------------------------------------------\n// Helpers\n// ---------------------------------------------------------------------------\n\nfunction toArray(v: string | string[] | undefined): string[] {\n  if (v === undefined) return [];\n  if (Array.isArray(v)) return v;\n  return v === \"\" ? [] : [v];\n}\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\n\n/**\n * VirtualSelect — a combobox that renders only the visible window of options\n * in the DOM, making it suitable for option lists of 10,000+ items.\n *\n * Uses `@tanstack/react-virtual` for windowed rendering and a purpose-built\n * `aria-activedescendant` keyboard model so focus stays on the search input\n * while navigating the listbox.\n */\nexport const VirtualSelect = forwardRef<HTMLButtonElement, VirtualSelectProps>(\n  function VirtualSelect(\n    {\n      options,\n      multiple = false,\n      value,\n      defaultValue,\n      onValueChange,\n      placeholder,\n      searchPlaceholder,\n      emptyText,\n      estimateOptionHeight = 32,\n      maxListHeight = \"18rem\",\n      className,\n      ...props\n    },\n    ref,\n  ) {\n    const { t } = useLocale();\n    const resolvedPlaceholder = placeholder ?? t(\"ui.virtualSelect.placeholder\");\n    const resolvedSearchPlaceholder = searchPlaceholder ?? t(\"ui.virtualSelect.searchPlaceholder\");\n    const resolvedEmptyText = emptyText ?? t(\"noResults\");\n\n    // ------------------------------------------------------------------\n    // Controlled / uncontrolled\n    // ------------------------------------------------------------------\n    const isControlled = value !== undefined;\n    const [internal, setInternal] = useState<string[]>(() => toArray(defaultValue));\n    const selected: string[] = isControlled ? toArray(value) : internal;\n\n    const emit = useCallback(\n      (next: string[]) => {\n        if (!isControlled) setInternal(next);\n        if (multiple) {\n          onValueChange?.(next);\n        } else {\n          onValueChange?.(next[0] ?? \"\");\n        }\n      },\n      [isControlled, multiple, onValueChange],\n    );\n\n    // ------------------------------------------------------------------\n    // Popover state\n    // ------------------------------------------------------------------\n    const [open, setOpen] = useState(false);\n\n    // ------------------------------------------------------------------\n    // Search / filter\n    // ------------------------------------------------------------------\n    const [query, setQuery] = useState(\"\");\n    const searchRef = useRef<HTMLInputElement>(null);\n\n    // Reset query when popover toggles\n    useEffect(() => {\n      setQuery(\"\");\n    }, [open]);\n\n    const filtered = useMemo(\n      () => options.filter((o) => o.label.toLowerCase().includes(query.toLowerCase())),\n      [options, query],\n    );\n\n    // O(1) label lookup for the trigger's selected chips — `selected.map(find)`\n    // is O(selected.length * options.length) and options lists here can be\n    // large (that's the whole point of virtualizing).\n    const optionByValue = useMemo(() => {\n      const map = new Map<string, VirtualSelectOption>();\n      for (const o of options) map.set(o.value, o);\n      return map;\n    }, [options]);\n\n    // ------------------------------------------------------------------\n    // Virtualizer\n    // ------------------------------------------------------------------\n    // State-backed scroll element (NOT a ref): the listbox mounts only when the\n    // Popover opens, so a plain ref would leave the virtualizer with a null\n    // scroll element and render zero options. A state callback ref forces the\n    // re-render that lets the virtualizer measure once the element appears.\n    const [scrollEl, setScrollEl] = useState<HTMLDivElement | null>(null);\n    const virtualizer = useVirtualizer({\n      count: filtered.length,\n      getScrollElement: () => scrollEl,\n      estimateSize: () => estimateOptionHeight,\n      overscan: 5,\n    });\n\n    // ------------------------------------------------------------------\n    // Keyboard navigation\n    // ------------------------------------------------------------------\n    const handleSelect = useCallback(\n      (optValue: string) => {\n        if (multiple) {\n          const next = selected.includes(optValue)\n            ? selected.filter((v) => v !== optValue)\n            : [...selected, optValue];\n          emit(next);\n          // Keep open in multi mode\n        } else {\n          emit(selected[0] === optValue ? [] : [optValue]);\n          setOpen(false);\n        }\n      },\n      [multiple, selected, emit],\n    );\n\n    const { activeIndex, setActiveIndex, onInputKeyDown } = useVirtualListbox({\n      count: filtered.length,\n      filtered,\n      isOpen: open,\n      onSelect: handleSelect,\n      virtualizer,\n    });\n\n    // ------------------------------------------------------------------\n    // IDs for ARIA wiring\n    // ------------------------------------------------------------------\n    const uid = useId();\n    const listboxId = `${uid}-listbox`;\n    const optionId = (index: number) => `${uid}-option-${index}`;\n\n    // Focus the search input when the popover opens. The timeout id is\n    // tracked so it can be cancelled on unmount (or a rapid re-close) —\n    // otherwise it fires after the component (and `searchRef`'s DOM node)\n    // is gone, or focuses a NEW popover's input on a fast toggle.\n    const focusTimeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n    useEffect(\n      () => () => {\n        if (focusTimeoutRef.current != null) clearTimeout(focusTimeoutRef.current);\n      },\n      [],\n    );\n\n    const handleOpenChange = useCallback((next: boolean) => {\n      setOpen(next);\n      if (focusTimeoutRef.current != null) {\n        clearTimeout(focusTimeoutRef.current);\n        focusTimeoutRef.current = null;\n      }\n      if (next) {\n        // Defer one frame so Radix has mounted the portal\n        focusTimeoutRef.current = setTimeout(() => {\n          focusTimeoutRef.current = null;\n          searchRef.current?.focus();\n        }, 0);\n      }\n    }, []);\n\n    // ------------------------------------------------------------------\n    // Trigger label\n    // ------------------------------------------------------------------\n    const selectedLabels = selected.map((v) => ({\n      value: v,\n      label: optionByValue.get(v)?.label ?? v,\n    }));\n\n    const triggerContent =\n      selectedLabels.length === 0 ? (\n        <span className=\"text-muted-foreground\">{resolvedPlaceholder}</span>\n      ) : multiple ? (\n        <>\n          {selectedLabels.slice(0, 2).map((l) => (\n            <Badge\n              key={l.value}\n              variant=\"secondary\"\n              className=\"max-w-[8rem] truncate border-border\"\n            >\n              {l.label}\n            </Badge>\n          ))}\n          {selectedLabels.length > 2 ? (\n            <Badge\n              variant=\"secondary\"\n              aria-label={`and ${selectedLabels.length - 2} more selected`}\n            >\n              +{selectedLabels.length - 2}\n            </Badge>\n          ) : null}\n        </>\n      ) : (\n        <span className=\"truncate\">{selectedLabels[0]?.label}</span>\n      );\n\n    // ------------------------------------------------------------------\n    // Render\n    // ------------------------------------------------------------------\n    const virtualItems = virtualizer.getVirtualItems();\n    // Only reference the active option from aria-activedescendant when it is\n    // actually mounted in the virtual window (else the id would dangle).\n    const activeMounted = virtualItems.some((v) => v.index === activeIndex);\n\n    return (\n      <Popover open={open} onOpenChange={handleOpenChange}>\n        <PopoverTrigger asChild>\n          <Button\n            ref={ref}\n            type=\"button\"\n            variant=\"outline\"\n            role=\"combobox\"\n            aria-expanded={open}\n            aria-haspopup=\"listbox\"\n            aria-controls={listboxId}\n            className={cn(\"h-auto min-h-9 w-full justify-between font-normal\", className)}\n            {...props}\n          >\n            <span className=\"flex min-w-0 flex-1 flex-wrap items-center gap-1 text-start\">\n              {triggerContent}\n            </span>\n            <ChevronsUpDown className=\"ms-2 size-4 shrink-0 opacity-50\" aria-hidden=\"true\" />\n          </Button>\n        </PopoverTrigger>\n\n        <PopoverContent\n          className=\"w-[var(--radix-popover-trigger-width)] min-w-64 p-0\"\n          align=\"start\"\n          // Prevent Radix from stealing focus so it can go to the input\n          onOpenAutoFocus={(e) => e.preventDefault()}\n        >\n          {/* Search input */}\n          <div className=\"border-b p-1.5\">\n            <Input\n              ref={searchRef}\n              type=\"text\"\n              autoComplete=\"off\"\n              spellCheck={false}\n              placeholder={resolvedSearchPlaceholder}\n              value={query}\n              onChange={(e) => setQuery(e.target.value)}\n              onKeyDown={(e: KeyboardEvent<HTMLInputElement>) => onInputKeyDown(e)}\n              aria-label={resolvedSearchPlaceholder}\n              aria-autocomplete=\"list\"\n              aria-controls={listboxId}\n              aria-activedescendant={\n                activeIndex >= 0 && activeMounted ? optionId(activeIndex) : undefined\n              }\n              // Border/shadow removed (sits inside the popover's own bordered\n              // header strip) but the base `Input` focus-ring is kept — no\n              // compound ring lives elsewhere on this control, so silencing it\n              // would leave a re-focused search box with no visible indicator.\n              className=\"h-8 border-0 shadow-none\"\n            />\n          </div>\n\n          {/* Listbox — always mounted so aria-controls never dangles (even when empty) */}\n          <div\n            ref={setScrollEl}\n            id={listboxId}\n            role=\"listbox\"\n            aria-multiselectable={multiple || undefined}\n            style={{ maxHeight: maxListHeight }}\n            className=\"overflow-auto p-1\"\n          >\n            {filtered.length > 0 ? (\n              // Spacer gives the virtualizer its full scroll height\n              <div style={{ height: virtualizer.getTotalSize() }} className=\"relative\">\n                {virtualItems.map((virtualRow) => {\n                  const opt = filtered[virtualRow.index];\n                  if (!opt) return null;\n                  const isSelected = selected.includes(opt.value);\n                  const isActive = activeIndex === virtualRow.index;\n\n                  return (\n                    <div\n                      key={virtualRow.key}\n                      id={optionId(virtualRow.index)}\n                      role=\"option\"\n                      aria-selected={isSelected}\n                      aria-disabled={opt.disabled || undefined}\n                      style={{\n                        position: \"absolute\",\n                        top: 0,\n                        left: 0,\n                        width: \"100%\",\n                        height: `${virtualRow.size}px`,\n                        transform: `translateY(${virtualRow.start}px)`,\n                      }}\n                      className={cn(\n                        \"flex cursor-pointer select-none items-center rounded-sm px-2 text-body outline-none\",\n                        \"transition-colors duration-fast motion-reduce:transition-none\",\n                        isActive && \"bg-accent text-accent-foreground\",\n                        !isActive && \"hover:bg-accent hover:text-accent-foreground\",\n                        opt.disabled && \"pointer-events-none cursor-not-allowed opacity-50\",\n                      )}\n                      onClick={() => {\n                        if (!opt.disabled) handleSelect(opt.value);\n                      }}\n                      onMouseEnter={() => {\n                        if (!opt.disabled) setActiveIndex(virtualRow.index);\n                      }}\n                    >\n                      <Check\n                        className={cn(\n                          \"me-2 size-4 shrink-0\",\n                          isSelected ? \"opacity-100\" : \"opacity-0\",\n                        )}\n                        aria-hidden=\"true\"\n                      />\n                      <span className=\"truncate\">{opt.label}</span>\n                    </div>\n                  );\n                })}\n              </div>\n            ) : null}\n          </div>\n          {filtered.length === 0 ? (\n            <div\n              role=\"status\"\n              aria-live=\"polite\"\n              className=\"px-2 py-6 text-center text-body text-muted-foreground\"\n            >\n              {resolvedEmptyText}\n            </div>\n          ) : null}\n        </PopoverContent>\n      </Popover>\n    );\n  },\n);\n"],"mappings":"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","names":["VirtualSelect"]}

package/dist/chunk-4GQFIJAE.js

@@ -0,0 +1,197 @@
+"use client";
+import {
+  InputGroup,
+  InputGroupButton,
+  InputGroupInput
+} from "./chunk-UPEMEBWH.js";
+import {
+  useLocale
+} from "./chunk-EJQYE4MY.js";
+
+// src/components/number-input/number-input.tsx
+import { forwardRef, useCallback, useRef, useState } from "react";
+import { Minus, Plus } from "lucide-react";
+import { jsx, jsxs } from "react/jsx-runtime";
+function clampValue(val, min, max) {
+  let result = val;
+  if (min !== void 0) result = Math.max(min, result);
+  if (max !== void 0) result = Math.min(max, result);
+  return result;
+}
+function stepDecimals(step) {
+  if (!isFinite(step) || step === 0) return 0;
+  const s = String(step);
+  const i = s.indexOf(".");
+  return i === -1 ? 0 : s.length - i - 1;
+}
+function roundToStep(value, step) {
+  const decimals = stepDecimals(step);
+  if (decimals === 0) return Math.round(value);
+  const factor = 10 ** decimals;
+  return Math.round(value * factor) / factor;
+}
+function getLocaleSeparators(locale) {
+  const parts = new Intl.NumberFormat(locale).formatToParts(1234.5);
+  const decimal = parts.find((p) => p.type === "decimal")?.value ?? ".";
+  const group = parts.find((p) => p.type === "group")?.value ?? ",";
+  return { decimal, group };
+}
+function parseLocaleNumber(raw, locale) {
+  const { decimal, group } = getLocaleSeparators(locale);
+  let normalized = raw.trim();
+  if (group) normalized = normalized.split(group).join("");
+  if (decimal !== ".") normalized = normalized.split(decimal).join(".");
+  return Number(normalized);
+}
+var NumberInput = forwardRef(function NumberInput2({
+  value: valueProp,
+  defaultValue,
+  onValueChange,
+  min,
+  max,
+  step = 1,
+  clamp = true,
+  formatOptions,
+  placeholder,
+  disabled,
+  readOnly,
+  name,
+  id,
+  "aria-label": ariaLabel,
+  "aria-labelledby": ariaLabelledby,
+  "aria-describedby": ariaDescribedby,
+  "aria-invalid": ariaInvalid,
+  "aria-required": ariaRequired,
+  className,
+  ...props
+}, ref) {
+  const { locale, formatNumber, t } = useLocale();
+  const isControlled = valueProp !== void 0;
+  const formatValue = useCallback(
+    (n) => formatNumber(n, formatOptions),
+    [formatNumber, formatOptions]
+  );
+  const [internalValue, setInternalValue] = useState(
+    defaultValue !== void 0 ? defaultValue : null
+  );
+  const [inputText, setInputText] = useState(() => {
+    const initial = isControlled ? valueProp : defaultValue;
+    return initial != null ? formatValue(initial) : "";
+  });
+  const isEditing = useRef(false);
+  const currentValue = isControlled ? valueProp : internalValue;
+  const commit = useCallback(
+    (next) => {
+      if (!isControlled) setInternalValue(next);
+      onValueChange?.(next);
+    },
+    [isControlled, onValueChange]
+  );
+  const applyStep = useCallback(
+    (delta) => {
+      if (disabled || readOnly) return;
+      const base = currentValue ?? 0;
+      let next = roundToStep(base + delta, step);
+      if (clamp) next = clampValue(next, min, max);
+      setInputText(formatValue(next));
+      commit(next);
+    },
+    [disabled, readOnly, currentValue, step, clamp, min, max, formatValue, commit]
+  );
+  const handleKeyDown = useCallback(
+    (e) => {
+      if (e.key === "ArrowUp" || e.key === "ArrowDown") {
+        e.preventDefault();
+        const multiplier = e.shiftKey ? 10 : 1;
+        const delta = e.key === "ArrowUp" ? step * multiplier : -step * multiplier;
+        applyStep(delta);
+      }
+    },
+    [applyStep, step]
+  );
+  const handleChange = useCallback((e) => {
+    isEditing.current = true;
+    setInputText(e.target.value);
+  }, []);
+  const handleBlur = useCallback(() => {
+    isEditing.current = false;
+    const raw = inputText.trim();
+    if (raw === "") {
+      commit(null);
+      return;
+    }
+    const parsed = parseLocaleNumber(raw, locale);
+    if (isNaN(parsed)) {
+      setInputText(currentValue != null ? formatValue(currentValue) : "");
+      return;
+    }
+    const rounded = roundToStep(parsed, step);
+    const clamped = clamp ? clampValue(rounded, min, max) : rounded;
+    setInputText(formatValue(clamped));
+    commit(clamped);
+  }, [inputText, currentValue, clamp, min, max, step, locale, formatValue, commit]);
+  const prevControlledValue = useRef(valueProp);
+  if (isControlled && valueProp !== prevControlledValue.current && !isEditing.current) {
+    prevControlledValue.current = valueProp;
+    const nextText = valueProp != null ? formatValue(valueProp) : "";
+    if (nextText !== inputText) setInputText(nextText);
+  }
+  const decrementDisabled = disabled || readOnly || min !== void 0 && (currentValue ?? 0) <= min;
+  const incrementDisabled = disabled || readOnly || max !== void 0 && (currentValue ?? 0) >= max;
+  return /* @__PURE__ */ jsxs(InputGroup, { className, ...props, children: [
+    /* @__PURE__ */ jsx(
+      InputGroupButton,
+      {
+        "aria-label": t("ui.numberInput.decrease"),
+        tabIndex: -1,
+        disabled: decrementDisabled,
+        onClick: () => applyStep(-step),
+        className: "rounded-e-none",
+        children: /* @__PURE__ */ jsx(Minus, { "aria-hidden": "true" })
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      InputGroupInput,
+      {
+        ref,
+        type: "text",
+        inputMode: "decimal",
+        role: "spinbutton",
+        "aria-valuenow": currentValue ?? void 0,
+        "aria-valuemin": min,
+        "aria-valuemax": max,
+        id,
+        name,
+        value: inputText,
+        placeholder,
+        disabled,
+        readOnly,
+        "aria-label": ariaLabel,
+        "aria-labelledby": ariaLabelledby,
+        "aria-describedby": ariaDescribedby,
+        "aria-invalid": ariaInvalid,
+        "aria-required": ariaRequired,
+        className: "text-center",
+        onChange: handleChange,
+        onKeyDown: handleKeyDown,
+        onBlur: handleBlur
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      InputGroupButton,
+      {
+        "aria-label": t("ui.numberInput.increase"),
+        tabIndex: -1,
+        disabled: incrementDisabled,
+        onClick: () => applyStep(step),
+        className: "rounded-s-none",
+        children: /* @__PURE__ */ jsx(Plus, { "aria-hidden": "true" })
+      }
+    )
+  ] });
+});
+
+export {
+  NumberInput
+};
+//# sourceMappingURL=chunk-4GQFIJAE.js.map

package/dist/chunk-4GQFIJAE.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/number-input/number-input.tsx"],"sourcesContent":["\"use client\";\n\n// a2ui.exposed: yes\nimport { forwardRef, useCallback, useRef, useState, type HTMLAttributes } from \"react\";\nimport { Minus, Plus } from \"lucide-react\";\nimport { InputGroup, InputGroupButton, InputGroupInput } from \"../input-group\";\nimport { useLocale } from \"../locale-provider\";\n\nexport interface NumberInputProps extends Omit<\n  HTMLAttributes<HTMLDivElement>,\n  \"onChange\" | \"defaultValue\"\n> {\n  /** Controlled value. Pass `null` to represent an empty state. */\n  value?: number | null;\n  /** Uncontrolled default value. */\n  defaultValue?: number | null;\n  /** Called when the numeric value changes. */\n  onValueChange?: (value: number | null) => void;\n  /** Minimum allowed value. */\n  min?: number;\n  /** Maximum allowed value. */\n  max?: number;\n  /** Step increment/decrement amount (default 1). */\n  step?: number;\n  /**\n   * When true (default), the value is clamped to [min, max] on blur.\n   * Clamping does NOT happen per-keystroke — only on blur.\n   */\n  clamp?: boolean;\n  /** Intl.NumberFormat options used to format the displayed value. */\n  formatOptions?: Intl.NumberFormatOptions;\n  /** Placeholder text for the underlying input. */\n  placeholder?: string;\n  /** Whether the input is disabled. */\n  disabled?: boolean;\n  /** Whether the input is read-only. */\n  readOnly?: boolean;\n  /** Name attribute forwarded to the underlying <input>. */\n  name?: string;\n  /** id attribute forwarded to the underlying <input>. */\n  id?: string;\n  /** aria-label forwarded to the underlying <input>. */\n  \"aria-label\"?: string;\n  /** aria-labelledby forwarded to the underlying <input>. */\n  \"aria-labelledby\"?: string;\n  /** aria-describedby forwarded to the underlying <input>. */\n  \"aria-describedby\"?: string;\n  /** aria-invalid forwarded to the underlying <input>. */\n  \"aria-invalid\"?: boolean | \"true\" | \"false\" | \"grammar\" | \"spelling\";\n  /** aria-required forwarded to the underlying <input>. */\n  \"aria-required\"?: boolean | \"true\" | \"false\";\n}\n\nfunction clampValue(val: number, min?: number, max?: number): number {\n  let result = val;\n  if (min !== undefined) result = Math.max(min, result);\n  if (max !== undefined) result = Math.min(max, result);\n  return result;\n}\n\n/** Number of decimal places implied by a step (e.g. 0.1 → 1, 1 → 0). */\nfunction stepDecimals(step: number): number {\n  if (!isFinite(step) || step === 0) return 0;\n  const s = String(step);\n  const i = s.indexOf(\".\");\n  return i === -1 ? 0 : s.length - i - 1;\n}\n\n/** Round `value` to the decimal precision implied by `step`, avoiding fp noise (0.1+0.2). */\nfunction roundToStep(value: number, step: number): number {\n  const decimals = stepDecimals(step);\n  if (decimals === 0) return Math.round(value);\n  const factor = 10 ** decimals;\n  return Math.round(value * factor) / factor;\n}\n\n/** The active locale's decimal and group separator characters (e.g. \",\" / \".\" in de-DE). */\nfunction getLocaleSeparators(locale: string): { decimal: string; group: string } {\n  const parts = new Intl.NumberFormat(locale).formatToParts(1234.5);\n  const decimal = parts.find((p) => p.type === \"decimal\")?.value ?? \".\";\n  const group = parts.find((p) => p.type === \"group\")?.value ?? \",\";\n  return { decimal, group };\n}\n\n/** Parse a locale-formatted numeric string (group + decimal separators) into a number. */\nfunction parseLocaleNumber(raw: string, locale: string): number {\n  const { decimal, group } = getLocaleSeparators(locale);\n  let normalized = raw.trim();\n  if (group) normalized = normalized.split(group).join(\"\");\n  if (decimal !== \".\") normalized = normalized.split(decimal).join(\".\");\n  return Number(normalized);\n}\n\n/**\n * NumberInput — a numeric stepper that composes InputGroup + two step buttons.\n *\n * Controlled via `value`/`onValueChange`; uncontrolled via `defaultValue`.\n * Keyboard ↑/↓ = ±step; Shift+↑/↓ = ±step×10. Clamps on blur (not per keystroke).\n */\nexport const NumberInput = forwardRef<HTMLInputElement, NumberInputProps>(function NumberInput(\n  {\n    value: valueProp,\n    defaultValue,\n    onValueChange,\n    min,\n    max,\n    step = 1,\n    clamp = true,\n    formatOptions,\n    placeholder,\n    disabled,\n    readOnly,\n    name,\n    id,\n    \"aria-label\": ariaLabel,\n    \"aria-labelledby\": ariaLabelledby,\n    \"aria-describedby\": ariaDescribedby,\n    \"aria-invalid\": ariaInvalid,\n    \"aria-required\": ariaRequired,\n    className,\n    ...props\n  },\n  ref,\n) {\n  const { locale, formatNumber, t } = useLocale();\n  const isControlled = valueProp !== undefined;\n\n  const formatValue = useCallback(\n    (n: number) => formatNumber(n, formatOptions),\n    [formatNumber, formatOptions],\n  );\n\n  const [internalValue, setInternalValue] = useState<number | null>(\n    defaultValue !== undefined ? defaultValue : null,\n  );\n  const [inputText, setInputText] = useState<string>(() => {\n    const initial = isControlled ? valueProp : defaultValue;\n    return initial != null ? formatValue(initial) : \"\";\n  });\n  // Track whether the user is actively editing to avoid overwriting their input\n  const isEditing = useRef(false);\n\n  const currentValue = isControlled ? valueProp : internalValue;\n\n  const commit = useCallback(\n    (next: number | null) => {\n      if (!isControlled) setInternalValue(next);\n      onValueChange?.(next);\n    },\n    [isControlled, onValueChange],\n  );\n\n  const applyStep = useCallback(\n    (delta: number) => {\n      if (disabled || readOnly) return;\n      const base = currentValue ?? 0;\n      let next = roundToStep(base + delta, step);\n      if (clamp) next = clampValue(next, min, max);\n      setInputText(formatValue(next));\n      commit(next);\n    },\n    [disabled, readOnly, currentValue, step, clamp, min, max, formatValue, commit],\n  );\n\n  const handleKeyDown = useCallback(\n    (e: React.KeyboardEvent<HTMLInputElement>) => {\n      if (e.key === \"ArrowUp\" || e.key === \"ArrowDown\") {\n        e.preventDefault();\n        const multiplier = e.shiftKey ? 10 : 1;\n        const delta = e.key === \"ArrowUp\" ? step * multiplier : -step * multiplier;\n        applyStep(delta);\n      }\n    },\n    [applyStep, step],\n  );\n\n  const handleChange = useCallback((e: React.ChangeEvent<HTMLInputElement>) => {\n    isEditing.current = true;\n    setInputText(e.target.value);\n  }, []);\n\n  const handleBlur = useCallback(() => {\n    isEditing.current = false;\n    const raw = inputText.trim();\n    if (raw === \"\") {\n      commit(null);\n      return;\n    }\n    const parsed = parseLocaleNumber(raw, locale);\n    if (isNaN(parsed)) {\n      // Revert to last known good value\n      setInputText(currentValue != null ? formatValue(currentValue) : \"\");\n      return;\n    }\n    const rounded = roundToStep(parsed, step);\n    const clamped = clamp ? clampValue(rounded, min, max) : rounded;\n    setInputText(formatValue(clamped));\n    commit(clamped);\n  }, [inputText, currentValue, clamp, min, max, step, locale, formatValue, commit]);\n\n  // Keep display text in sync with controlled value changes (only when not editing)\n  const prevControlledValue = useRef(valueProp);\n  if (isControlled && valueProp !== prevControlledValue.current && !isEditing.current) {\n    prevControlledValue.current = valueProp;\n    const nextText = valueProp != null ? formatValue(valueProp) : \"\";\n    if (nextText !== inputText) setInputText(nextText);\n  }\n\n  const decrementDisabled =\n    disabled || readOnly || (min !== undefined && (currentValue ?? 0) <= min);\n  const incrementDisabled =\n    disabled || readOnly || (max !== undefined && (currentValue ?? 0) >= max);\n\n  return (\n    <InputGroup className={className} {...props}>\n      <InputGroupButton\n        aria-label={t(\"ui.numberInput.decrease\")}\n        tabIndex={-1}\n        disabled={decrementDisabled}\n        onClick={() => applyStep(-step)}\n        className=\"rounded-e-none\"\n      >\n        <Minus aria-hidden=\"true\" />\n      </InputGroupButton>\n      <InputGroupInput\n        ref={ref}\n        type=\"text\"\n        inputMode=\"decimal\"\n        role=\"spinbutton\"\n        aria-valuenow={currentValue ?? undefined}\n        aria-valuemin={min}\n        aria-valuemax={max}\n        id={id}\n        name={name}\n        value={inputText}\n        placeholder={placeholder}\n        disabled={disabled}\n        readOnly={readOnly}\n        aria-label={ariaLabel}\n        aria-labelledby={ariaLabelledby}\n        aria-describedby={ariaDescribedby}\n        aria-invalid={ariaInvalid}\n        aria-required={ariaRequired}\n        className=\"text-center\"\n        onChange={handleChange}\n        onKeyDown={handleKeyDown}\n        onBlur={handleBlur}\n      />\n      <InputGroupButton\n        aria-label={t(\"ui.numberInput.increase\")}\n        tabIndex={-1}\n        disabled={incrementDisabled}\n        onClick={() => applyStep(step)}\n        className=\"rounded-s-none\"\n      >\n        <Plus aria-hidden=\"true\" />\n      </InputGroupButton>\n    </InputGroup>\n  );\n});\n"],"mappings":"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","names":["NumberInput"]}

package/dist/chunk-4HTVJZVG.js

@@ -0,0 +1,2 @@
+"use client";
+//# sourceMappingURL=chunk-4HTVJZVG.js.map

package/dist/chunk-4HTVJZVG.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/chunk-4KDA5MDC.js

@@ -0,0 +1,2 @@
+"use client";
+//# sourceMappingURL=chunk-4KDA5MDC.js.map

package/dist/chunk-4KDA5MDC.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/chunk-4PITSMJ3.js

@@ -0,0 +1,52 @@
+"use client";
+import {
+  cn
+} from "./chunk-KBNWM27Q.js";
+
+// src/components/resizable/resizable.tsx
+import { forwardRef } from "react";
+import { GripVertical } from "lucide-react";
+import * as ResizablePrimitive from "react-resizable-panels";
+import { jsx } from "react/jsx-runtime";
+var ResizablePanelGroup = forwardRef(function ResizablePanelGroup2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsx(
+    ResizablePrimitive.PanelGroup,
+    {
+      ref,
+      className: cn("flex size-full data-[panel-group-direction=vertical]:flex-col", className),
+      ...props
+    }
+  );
+});
+var ResizablePanel = ResizablePrimitive.Panel;
+var DEFAULT_HIT_AREA_MARGINS = {
+  coarse: 15,
+  fine: 8
+};
+function ResizableHandle({
+  withHandle,
+  className,
+  hitAreaMargins,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    ResizablePrimitive.PanelResizeHandle,
+    {
+      hitAreaMargins: hitAreaMargins ?? DEFAULT_HIT_AREA_MARGINS,
+      className: cn(
+        "relative flex w-px items-center justify-center bg-border after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-ring",
+        "data-[panel-group-direction=vertical]:h-px data-[panel-group-direction=vertical]:w-full data-[panel-group-direction=vertical]:after:left-0 data-[panel-group-direction=vertical]:after:h-1 data-[panel-group-direction=vertical]:after:w-full data-[panel-group-direction=vertical]:after:-translate-y-1/2 data-[panel-group-direction=vertical]:after:translate-x-0",
+        className
+      ),
+      ...props,
+      children: withHandle && /* @__PURE__ */ jsx("div", { className: "z-10 flex h-4 w-3 items-center justify-center rounded-sm border bg-border", children: /* @__PURE__ */ jsx(GripVertical, { className: "size-2.5" }) })
+    }
+  );
+}
+
+export {
+  ResizablePanelGroup,
+  ResizablePanel,
+  ResizableHandle
+};
+//# sourceMappingURL=chunk-4PITSMJ3.js.map

package/dist/chunk-4PITSMJ3.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/resizable/resizable.tsx"],"sourcesContent":["import { forwardRef, type ForwardRefExoticComponent, type RefAttributes } from \"react\";\nimport { GripVertical } from \"lucide-react\";\nimport * as ResizablePrimitive from \"react-resizable-panels\";\nimport { cn } from \"../../lib/cn\";\n\nexport const ResizablePanelGroup: ForwardRefExoticComponent<\n  React.ComponentProps<typeof ResizablePrimitive.PanelGroup> &\n    RefAttributes<ResizablePrimitive.ImperativePanelGroupHandle>\n> = forwardRef<\n  ResizablePrimitive.ImperativePanelGroupHandle,\n  React.ComponentProps<typeof ResizablePrimitive.PanelGroup>\n>(function ResizablePanelGroup({ className, ...props }, ref) {\n  return (\n    <ResizablePrimitive.PanelGroup\n      ref={ref}\n      className={cn(\"flex size-full data-[panel-group-direction=vertical]:flex-col\", className)}\n      {...props}\n    />\n  );\n});\n\nexport const ResizablePanel = ResizablePrimitive.Panel;\n\n/**\n * The visible line stays 1px (`w-px`); the DRAG hit area is expanded via the\n * primitive's own `hitAreaMargins` (pointer-distance based, not a CSS trick),\n * so pointer/touch users get a ≥16px target without widening what's drawn.\n * Callers can still override `hitAreaMargins` explicitly.\n */\nconst DEFAULT_HIT_AREA_MARGINS: ResizablePrimitive.PointerHitAreaMargins = {\n  coarse: 15,\n  fine: 8,\n};\n\n/**\n * NOT wrapped in `forwardRef`: `react-resizable-panels`' `PanelResizeHandle`\n * is a plain function component that hardcodes its own internal element ref\n * and does not accept `ref` as a prop at all (neither in its types nor at\n * runtime — verified: a `ref` passed to it resolves to `null`). There is no\n * DOM node here for a wrapper ref to attach to without changing what render\n * onto the actual drag surface, so adding `forwardRef` would be a dead prop.\n */\nexport function ResizableHandle({\n  withHandle,\n  className,\n  hitAreaMargins,\n  ...props\n}: React.ComponentProps<typeof ResizablePrimitive.PanelResizeHandle> & { withHandle?: boolean }) {\n  return (\n    <ResizablePrimitive.PanelResizeHandle\n      hitAreaMargins={hitAreaMargins ?? DEFAULT_HIT_AREA_MARGINS}\n      className={cn(\n        \"relative flex w-px items-center justify-center bg-border after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-ring\",\n        \"data-[panel-group-direction=vertical]:h-px data-[panel-group-direction=vertical]:w-full data-[panel-group-direction=vertical]:after:left-0 data-[panel-group-direction=vertical]:after:h-1 data-[panel-group-direction=vertical]:after:w-full data-[panel-group-direction=vertical]:after:-translate-y-1/2 data-[panel-group-direction=vertical]:after:translate-x-0\",\n        className,\n      )}\n      {...props}\n    >\n      {withHandle && (\n        <div className=\"z-10 flex h-4 w-3 items-center justify-center rounded-sm border bg-border\">\n          <GripVertical className=\"size-2.5\" />\n        </div>\n      )}\n    </ResizablePrimitive.PanelResizeHandle>\n  );\n}\n"],"mappings":";;;;;;AAAA,SAAS,kBAAsE;AAC/E,SAAS,oBAAoB;AAC7B,YAAY,wBAAwB;AAWhC;AARG,IAAM,sBAGT,WAGF,SAASA,qBAAoB,EAAE,WAAW,GAAG,MAAM,GAAG,KAAK;AAC3D,SACE;AAAA,IAAoB;AAAA,IAAnB;AAAA,MACC;AAAA,MACA,WAAW,GAAG,iEAAiE,SAAS;AAAA,MACvF,GAAG;AAAA;AAAA,EACN;AAEJ,CAAC;AAEM,IAAM,iBAAoC;AAQjD,IAAM,2BAAqE;AAAA,EACzE,QAAQ;AAAA,EACR,MAAM;AACR;AAUO,SAAS,gBAAgB;AAAA,EAC9B;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAiG;AAC/F,SACE;AAAA,IAAoB;AAAA,IAAnB;AAAA,MACC,gBAAgB,kBAAkB;AAAA,MAClC,WAAW;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAEH,wBACC,oBAAC,SAAI,WAAU,6EACb,8BAAC,gBAAa,WAAU,YAAW,GACrC;AAAA;AAAA,EAEJ;AAEJ;","names":["ResizablePanelGroup"]}

package/dist/chunk-4PXDZR2W.js

@@ -0,0 +1,2 @@
+"use client";
+//# sourceMappingURL=chunk-4PXDZR2W.js.map

package/dist/chunk-4PXDZR2W.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/chunk-4UWOADYM.js

@@ -0,0 +1,2 @@
+"use client";
+//# sourceMappingURL=chunk-4UWOADYM.js.map

package/dist/chunk-4UWOADYM.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}