@arqel-dev/ui 0.11.0 → 0.13.0

package/dist/action.js

@@ -1,1092 +1,8 @@
-import { useState, useMemo, useEffect, useId, useRef } from 'react';
-import { cva } from 'class-variance-authority';
-import { Slot, Dialog as Dialog$1, DropdownMenu as DropdownMenu$1 } from 'radix-ui';
-import { clsx } from 'clsx';
-import { twMerge } from 'tailwind-merge';
-import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import { isFieldEntry, isLayoutEntry } from '@arqel-dev/types/forms';
-import { XIcon } from 'lucide-react';
-
-// src/action/ActionButton.tsx
-function cn(...inputs) {
-  return twMerge(clsx(inputs));
-}
-var buttonVariants = cva(
-  "inline-flex shrink-0 items-center justify-center gap-2 rounded-md text-sm font-medium whitespace-nowrap transition-all outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
-  {
-    variants: {
-      variant: {
-        default: "bg-primary text-primary-foreground hover:bg-primary/90",
-        destructive: "bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:bg-destructive/60 dark:focus-visible:ring-destructive/40",
-        outline: "border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:border-input dark:bg-input/30 dark:hover:bg-input/50",
-        secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
-        ghost: "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
-        link: "text-primary underline-offset-4 hover:underline"
-      },
-      size: {
-        default: "h-9 px-4 py-2 has-[>svg]:px-3",
-        xs: "h-6 gap-1 rounded-md px-2 text-xs has-[>svg]:px-1.5 [&_svg:not([class*='size-'])]:size-3",
-        sm: "h-8 gap-1.5 rounded-md px-3 has-[>svg]:px-2.5",
-        lg: "h-10 rounded-md px-6 has-[>svg]:px-4",
-        icon: "size-9",
-        "icon-xs": "size-6 rounded-md [&_svg:not([class*='size-'])]:size-3",
-        "icon-sm": "size-8",
-        "icon-lg": "size-10"
-      }
-    },
-    defaultVariants: {
-      variant: "default",
-      size: "default"
-    }
-  }
-);
-function Button({
-  className,
-  variant = "default",
-  size = "default",
-  asChild = false,
-  ...props
-}) {
-  const Comp = asChild ? Slot.Root : "button";
-  return /* @__PURE__ */ jsx(
-    Comp,
-    {
-      "data-slot": "button",
-      "data-variant": variant,
-      "data-size": size,
-      className: cn(buttonVariants({ variant, size, className })),
-      ...props
-    }
-  );
-}
-function FormActions({
-  submitLabel = "Save",
-  cancelLabel = "Cancel",
-  onCancel,
-  processing = false,
-  disabled = false,
-  extra,
-  className
-}) {
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      className: cn(
-        "flex flex-wrap items-center justify-end gap-2 border-t border-border pt-4",
-        className
-      ),
-      children: [
-        extra && /* @__PURE__ */ jsx("div", { className: "mr-auto", children: extra }),
-        onCancel && /* @__PURE__ */ jsx(Button, { type: "button", variant: "ghost", onClick: onCancel, disabled: processing, children: cancelLabel }),
-        /* @__PURE__ */ jsx(Button, { type: "submit", disabled: processing || disabled, children: processing ? "Saving\u2026" : submitLabel })
-      ]
-    }
-  );
-}
-
-// src/form/FieldRegistry.tsx
-var registry = /* @__PURE__ */ new Map();
-function getFieldComponent(name) {
-  return registry.get(name);
-}
-var inputClasses = cn(
-  "h-9 rounded-sm border border-[var(--input)]",
-  "bg-background px-3 text-sm",
-  "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
-  "disabled:cursor-not-allowed disabled:opacity-50"
-);
-function NativeFieldInput(props) {
-  const { field } = props;
-  switch (field.type) {
-    case "text":
-    case "email":
-    case "url":
-    case "password":
-    case "slug":
-      return /* @__PURE__ */ jsx(TextLike, { ...props, field });
-    case "textarea":
-      return /* @__PURE__ */ jsx(Textarea, { ...props, field });
-    case "number":
-    case "currency":
-      return /* @__PURE__ */ jsx(NumericInput, { ...props, field });
-    case "boolean":
-    case "toggle":
-      return /* @__PURE__ */ jsx(Checkbox, { ...props, field });
-    case "select":
-      return /* @__PURE__ */ jsx(SelectInput, { ...props, field });
-    case "multiSelect":
-    case "hasMany":
-      return /* @__PURE__ */ jsx(MultiSelectInput, { ...props, field });
-    case "radio":
-      return /* @__PURE__ */ jsx(RadioGroup, { ...props, field });
-    case "belongsTo":
-      return /* @__PURE__ */ jsx(BelongsToInput, { ...props, field });
-    case "date":
-    case "dateTime":
-      return /* @__PURE__ */ jsx(DateInput, { ...props, field });
-    case "file":
-    case "image":
-      return /* @__PURE__ */ jsx(FileInput, { ...props });
-    default:
-      return null;
-  }
-}
-function TextLike({
-  field,
-  value,
-  onChange,
-  disabled,
-  inputId,
-  describedBy
-}) {
-  const htmlType = field.type === "email" ? "email" : field.type === "password" ? "password" : field.type === "url" ? "url" : "text";
-  const isDisabled = disabled || field.disabled || field.readonly;
-  return /* @__PURE__ */ jsx(
-    "input",
-    {
-      id: inputId,
-      type: htmlType,
-      className: inputClasses,
-      value: typeof value === "string" ? value : (value ?? "")?.toString() ?? "",
-      placeholder: field.placeholder ?? void 0,
-      disabled: isDisabled,
-      readOnly: field.readonly === true,
-      required: field.required === true,
-      "aria-describedby": describedBy,
-      onChange: (e) => onChange(e.target.value)
-    }
-  );
-}
-function Textarea({
-  field,
-  value,
-  onChange,
-  disabled,
-  inputId,
-  describedBy
-}) {
-  return /* @__PURE__ */ jsx(
-    "textarea",
-    {
-      id: inputId,
-      className: cn(inputClasses, "h-auto min-h-[5rem] py-2"),
-      value: typeof value === "string" ? value : "",
-      placeholder: field.placeholder ?? void 0,
-      disabled: disabled || field.disabled || field.readonly,
-      readOnly: field.readonly === true,
-      required: field.required === true,
-      rows: 4,
-      "aria-describedby": describedBy,
-      onChange: (e) => onChange(e.target.value)
-    }
-  );
-}
-function NumericInput({
-  field,
-  value,
-  onChange,
-  disabled,
-  inputId,
-  describedBy
-}) {
-  return /* @__PURE__ */ jsx(
-    "input",
-    {
-      id: inputId,
-      type: "number",
-      className: inputClasses,
-      value: value === null || value === void 0 ? "" : String(value),
-      placeholder: field.placeholder ?? void 0,
-      disabled: disabled || field.disabled || field.readonly,
-      readOnly: field.readonly === true,
-      required: field.required === true,
-      "aria-describedby": describedBy,
-      onChange: (e) => {
-        const raw = e.target.value;
-        if (raw === "") {
-          onChange(null);
-          return;
-        }
-        const num = Number(raw);
-        onChange(Number.isNaN(num) ? null : num);
-      }
-    }
-  );
-}
-function Checkbox({
-  field,
-  value,
-  onChange,
-  disabled,
-  inputId,
-  describedBy
-}) {
-  return /* @__PURE__ */ jsx(
-    "input",
-    {
-      id: inputId,
-      type: "checkbox",
-      className: "h-4 w-4 rounded border-[var(--input)]",
-      checked: value === true,
-      disabled: disabled || field.disabled || field.readonly,
-      "aria-describedby": describedBy,
-      onChange: (e) => onChange(e.target.checked)
-    }
-  );
-}
-function normaliseOptions(options) {
-  if (!options) return [];
-  if (Array.isArray(options)) return options;
-  return Object.entries(options).map(([value, label]) => ({ value, label }));
-}
-function SelectInput({
-  field,
-  value,
-  onChange,
-  disabled,
-  inputId,
-  describedBy
-}) {
-  const options = normaliseOptions(field.props.options);
-  return /* @__PURE__ */ jsxs(
-    "select",
-    {
-      id: inputId,
-      className: inputClasses,
-      value: value === null || value === void 0 ? "" : String(value),
-      disabled: disabled || field.disabled || field.readonly,
-      required: field.required === true,
-      "aria-describedby": describedBy,
-      onChange: (e) => onChange(e.target.value === "" ? null : e.target.value),
-      children: [
-        field.placeholder && /* @__PURE__ */ jsx("option", { value: "", children: field.placeholder }),
-        options.map((opt) => /* @__PURE__ */ jsx("option", { value: opt.value, children: opt.label }, opt.value))
-      ]
-    }
-  );
-}
-function MultiSelectInput({
-  field,
-  value,
-  onChange,
-  disabled,
-  inputId,
-  describedBy
-}) {
-  const arr = Array.isArray(value) ? value : [];
-  const options = field.type === "multiSelect" ? normaliseOptions(field.props.options) : [];
-  return /* @__PURE__ */ jsx(
-    "select",
-    {
-      id: inputId,
-      multiple: true,
-      className: cn(inputClasses, "h-auto min-h-[6rem] py-1"),
-      value: arr.map(String),
-      disabled: disabled || field.disabled || field.readonly,
-      "aria-describedby": describedBy,
-      onChange: (e) => {
-        const next = Array.from(e.target.selectedOptions, (o) => o.value);
-        onChange(next);
-      },
-      children: options.map((opt) => /* @__PURE__ */ jsx("option", { value: opt.value, children: opt.label }, opt.value))
-    }
-  );
-}
-function RadioGroup({
-  field,
-  value,
-  onChange,
-  disabled,
-  inputId,
-  describedBy
-}) {
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      id: inputId,
-      className: "flex flex-col gap-1",
-      "aria-describedby": describedBy,
-      role: "radiogroup",
-      children: (field.props.options ?? []).map((opt) => /* @__PURE__ */ jsxs("label", { className: "inline-flex items-center gap-2 text-sm", children: [
-        /* @__PURE__ */ jsx(
-          "input",
-          {
-            type: "radio",
-            name: field.name,
-            value: String(opt.value),
-            checked: String(value ?? "") === String(opt.value),
-            disabled: disabled || field.disabled || field.readonly,
-            onChange: () => onChange(opt.value)
-          }
-        ),
-        opt.label
-      ] }, opt.value))
-    }
-  );
-}
-function BelongsToInput({
-  field,
-  value,
-  onChange,
-  disabled,
-  inputId,
-  describedBy
-}) {
-  return /* @__PURE__ */ jsx(
-    "input",
-    {
-      id: inputId,
-      type: "text",
-      className: inputClasses,
-      value: value === null || value === void 0 ? "" : String(value),
-      placeholder: field.placeholder ?? `Search ${field.props.relatedResource}\u2026`,
-      disabled: disabled || field.disabled || field.readonly,
-      readOnly: field.readonly === true,
-      "aria-describedby": describedBy,
-      onChange: (e) => onChange(e.target.value === "" ? null : e.target.value)
-    }
-  );
-}
-function DateInput({
-  field,
-  value,
-  onChange,
-  disabled,
-  inputId,
-  describedBy
-}) {
-  return /* @__PURE__ */ jsx(
-    "input",
-    {
-      id: inputId,
-      type: field.type === "dateTime" ? "datetime-local" : "date",
-      className: inputClasses,
-      value: typeof value === "string" ? value : "",
-      disabled: disabled || field.disabled || field.readonly,
-      readOnly: field.readonly === true,
-      required: field.required === true,
-      "aria-describedby": describedBy,
-      onChange: (e) => onChange(e.target.value === "" ? null : e.target.value)
-    }
-  );
-}
-function FileInput({
-  field,
-  onChange,
-  disabled,
-  inputId,
-  describedBy
-}) {
-  return /* @__PURE__ */ jsx(
-    "input",
-    {
-      id: inputId,
-      type: "file",
-      className: "text-sm",
-      disabled: disabled || field.disabled || field.readonly,
-      "aria-describedby": describedBy,
-      onChange: (e) => onChange(e.target.files?.[0] ?? null)
-    }
-  );
-}
-function FieldRenderer(props) {
-  const { field, errors, className } = props;
-  const id = useId();
-  const errorId = `${id}-error`;
-  const helperId = `${id}-helper`;
-  const hasError = errors && errors.length > 0;
-  const Custom = field.component ? getFieldComponent(field.component) : void 0;
-  const Input = Custom ?? NativeFieldInput;
-  const describedBy = [field.helperText ? helperId : null, hasError ? errorId : null].filter(Boolean).join(" ");
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      "data-arqel-field": field.name,
-      "data-field-type": field.type,
-      className: cn("flex flex-col gap-1", className),
-      children: [
-        field.label !== null && field.label !== "" && /* @__PURE__ */ jsxs("label", { htmlFor: id, className: "text-sm font-medium", children: [
-          field.label,
-          field.required && /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: "ml-0.5 text-destructive", children: "*" })
-        ] }),
-        /* @__PURE__ */ jsx(Input, { ...props, inputId: id, describedBy: describedBy || void 0 }),
-        field.helperText && !hasError && /* @__PURE__ */ jsx("p", { id: helperId, className: "text-xs text-muted-foreground", children: field.helperText }),
-        hasError && /* @__PURE__ */ jsx("p", { id: errorId, role: "alert", className: "text-xs text-destructive", children: errors[0] })
-      ]
-    }
-  );
-}
-function FormFieldset({ config, children, className }) {
-  return /* @__PURE__ */ jsxs("fieldset", { className: cn("rounded-md border border-border p-4", className), children: [
-    /* @__PURE__ */ jsx("legend", { className: "px-1 text-sm font-medium", children: config.legend }),
-    /* @__PURE__ */ jsx(
-      "div",
-      {
-        className: "grid gap-4",
-        style: { gridTemplateColumns: `repeat(${config.columns ?? 1}, minmax(0, 1fr))` },
-        children
-      }
-    )
-  ] });
-}
-function FormGrid({ config, children, className }) {
-  const columns = typeof config.columns === "number" ? config.columns : config.columns["md"] ?? 1;
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      className: cn("grid", className),
-      style: {
-        gridTemplateColumns: `repeat(${columns}, minmax(0, 1fr))`,
-        gap: config.gap ?? "1rem"
-      },
-      children
-    }
-  );
-}
-function FormSection({ config, children, className }) {
-  const [open, setOpen] = useState(!config.collapsed);
-  const collapsible = config.collapsible === true;
-  const heading = /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-2", children: [
-    /* @__PURE__ */ jsxs("div", { className: "flex-1", children: [
-      /* @__PURE__ */ jsx("h3", { className: "text-sm font-semibold", children: config.heading }),
-      config.description && /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: config.description })
-    ] }),
-    collapsible && /* @__PURE__ */ jsx(
-      "button",
-      {
-        type: "button",
-        "aria-expanded": open,
-        onClick: () => setOpen((v) => !v),
-        className: "text-sm text-muted-foreground hover:underline",
-        children: open ? "Hide" : "Show"
-      }
-    )
-  ] });
-  const body = open && /* @__PURE__ */ jsx(
-    "div",
-    {
-      className: "grid gap-4",
-      style: { gridTemplateColumns: `repeat(${config.columns ?? 1}, minmax(0, 1fr))` },
-      children
-    }
-  );
-  return /* @__PURE__ */ jsx(
-    "section",
-    {
-      "data-arqel-section": "",
-      className: cn(
-        "rounded-md border border-border bg-background",
-        config.compact ? "p-3" : "p-4",
-        className
-      ),
-      children: config.aside ? /* @__PURE__ */ jsxs("div", { className: "grid gap-4 md:grid-cols-[16rem_1fr]", children: [
-        /* @__PURE__ */ jsx("div", { children: heading }),
-        /* @__PURE__ */ jsx("div", { children: body })
-      ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
-        /* @__PURE__ */ jsx("div", { className: "mb-3", children: heading }),
-        body
-      ] })
-    }
-  );
-}
-function FormTabs({ config, tabs, className }) {
-  const [active, setActive] = useState(config.defaultTab ?? tabs[0]?.id ?? null);
-  const baseId = useId();
-  const refs = useRef([]);
-  if (tabs.length === 0 || active === null) return null;
-  const activeIndex = Math.max(
-    0,
-    tabs.findIndex((t) => t.id === active)
-  );
-  const activeTab = tabs[activeIndex];
-  if (!activeTab) return null;
-  const focus = (i) => {
-    const target = tabs[i];
-    if (!target) return;
-    setActive(target.id);
-    refs.current[i]?.focus();
-  };
-  const onKeyDown = (e) => {
-    if (e.key === "ArrowRight") {
-      e.preventDefault();
-      focus((activeIndex + 1) % tabs.length);
-    } else if (e.key === "ArrowLeft") {
-      e.preventDefault();
-      focus((activeIndex - 1 + tabs.length) % tabs.length);
-    } else if (e.key === "Home") {
-      e.preventDefault();
-      focus(0);
-    } else if (e.key === "End") {
-      e.preventDefault();
-      focus(tabs.length - 1);
-    }
-  };
-  return /* @__PURE__ */ jsxs("div", { className, children: [
-    /* @__PURE__ */ jsx(
-      "div",
-      {
-        role: "tablist",
-        "aria-orientation": config.orientation,
-        className: "flex gap-1 border-b border-border",
-        children: tabs.map((tab, i) => {
-          const selected = tab.id === active;
-          return /* @__PURE__ */ jsxs(
-            "button",
-            {
-              ref: (el) => {
-                refs.current[i] = el;
-              },
-              type: "button",
-              role: "tab",
-              id: `${baseId}-tab-${tab.id}`,
-              "aria-controls": `${baseId}-panel-${tab.id}`,
-              "aria-selected": selected,
-              tabIndex: selected ? 0 : -1,
-              onClick: () => setActive(tab.id),
-              onKeyDown,
-              className: cn(
-                "-mb-px border-b-2 px-3 py-2 text-sm transition-colors",
-                selected ? "border-primary font-medium text-foreground" : "border-transparent text-muted-foreground hover:text-foreground"
-              ),
-              children: [
-                tab.label,
-                tab.badge !== void 0 && tab.badge !== null && /* @__PURE__ */ jsx("span", { className: "ml-1 rounded-full bg-muted px-1.5 text-xs", children: tab.badge })
-              ]
-            },
-            tab.id
-          );
-        })
-      }
-    ),
-    /* @__PURE__ */ jsx(
-      "div",
-      {
-        role: "tabpanel",
-        id: `${baseId}-panel-${activeTab.id}`,
-        "aria-labelledby": `${baseId}-tab-${activeTab.id}`,
-        className: "pt-4",
-        children: activeTab.content
-      }
-    )
-  ] });
-}
-function FormRenderer({
-  schema,
-  fields,
-  values,
-  errors = {},
-  onChange,
-  disabled = false,
-  className
-}) {
-  const fieldsByName = new Map(fields.map((f) => [f.name, f]));
-  const renderEntry = (entry, key) => {
-    if (isFieldEntry(entry)) {
-      return renderFieldEntry(entry, key);
-    }
-    if (isLayoutEntry(entry)) {
-      return renderLayoutEntry(entry, key);
-    }
-    return null;
-  };
-  const renderFieldEntry = (entry, key) => {
-    const field = fieldsByName.get(entry.name);
-    if (!field) return null;
-    return /* @__PURE__ */ jsx(
-      FieldRenderer,
-      {
-        field,
-        value: values[entry.name],
-        errors: errors[entry.name],
-        disabled: disabled || schema.disabled === true,
-        onChange: (value) => onChange(entry.name, value)
-      },
-      key
-    );
-  };
-  const renderChildren = (entries) => {
-    if (!entries) return null;
-    return entries.map((child, i) => renderEntry(child, `${i}`));
-  };
-  const renderLayoutEntry = (entry, key) => {
-    switch (entry.type) {
-      case "section":
-        return /* @__PURE__ */ jsx(FormSection, { config: entry.props, children: renderChildren(entry.schema) }, key);
-      case "fieldset":
-        return /* @__PURE__ */ jsx(FormFieldset, { config: entry.props, children: renderChildren(entry.schema) }, key);
-      case "grid":
-      case "columns":
-        return /* @__PURE__ */ jsx(
-          FormGrid,
-          {
-            config: entry.type === "columns" ? { columns: entry.props.columns } : entry.props,
-            children: renderChildren(entry.schema)
-          },
-          key
-        );
-      case "group":
-        return /* @__PURE__ */ jsx(
-          "div",
-          {
-            className: cn(
-              "flex gap-4",
-              entry.props.orientation === "vertical" ? "flex-col" : "flex-row"
-            ),
-            children: renderChildren(entry.schema)
-          },
-          key
-        );
-      case "tabs": {
-        const tabs = (entry.schema ?? []).filter((c) => isLayoutEntry(c) && c.type === "tab").map((tab) => ({
-          id: tab.props.id,
-          label: tab.props.label,
-          badge: tab.props.badge,
-          content: renderChildren(tab.schema) ?? /* @__PURE__ */ jsx("span", {}, `tab-${tab.props.id}-empty`)
-        }));
-        return /* @__PURE__ */ jsx(FormTabs, { config: entry.props, tabs }, key);
-      }
-      case "tab":
-        return null;
-    }
-  };
-  const columns = schema.columns ?? 1;
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      "data-arqel-form": "",
-      className: cn("grid gap-4", className),
-      style: columns > 1 ? { gridTemplateColumns: `repeat(${columns}, minmax(0, 1fr))` } : void 0,
-      children: schema.schema.map((entry, i) => renderEntry(entry, `${i}`))
-    }
-  );
-}
-function Dialog({
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(Dialog$1.Root, { "data-slot": "dialog", ...props });
-}
-function DialogPortal({
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(Dialog$1.Portal, { "data-slot": "dialog-portal", ...props });
-}
-function DialogClose({
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(Dialog$1.Close, { "data-slot": "dialog-close", ...props });
-}
-function DialogOverlay({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(
-    Dialog$1.Overlay,
-    {
-      "data-slot": "dialog-overlay",
-      className: cn(
-        "fixed inset-0 z-50 bg-black/50 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:animate-in data-[state=open]:fade-in-0",
-        className
-      ),
-      ...props
-    }
-  );
-}
-function DialogContent({
-  className,
-  children,
-  showCloseButton = true,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxs(DialogPortal, { "data-slot": "dialog-portal", children: [
-    /* @__PURE__ */ jsx(DialogOverlay, {}),
-    /* @__PURE__ */ jsxs(
-      Dialog$1.Content,
-      {
-        "data-slot": "dialog-content",
-        className: cn(
-          "fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border bg-background p-6 shadow-lg duration-200 outline-none data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 sm:max-w-lg",
-          className
-        ),
-        ...props,
-        children: [
-          children,
-          showCloseButton && /* @__PURE__ */ jsxs(
-            Dialog$1.Close,
-            {
-              "data-slot": "dialog-close",
-              className: "absolute top-4 right-4 rounded-xs opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:ring-2 focus:ring-ring focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
-              children: [
-                /* @__PURE__ */ jsx(XIcon, {}),
-                /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" })
-              ]
-            }
-          )
-        ]
-      }
-    )
-  ] });
-}
-function DialogHeader({ className, ...props }) {
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      "data-slot": "dialog-header",
-      className: cn("flex flex-col gap-2 text-center sm:text-left", className),
-      ...props
-    }
-  );
-}
-function DialogFooter({
-  className,
-  showCloseButton = false,
-  children,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      "data-slot": "dialog-footer",
-      className: cn(
-        "flex flex-col-reverse gap-2 sm:flex-row sm:justify-end",
-        className
-      ),
-      ...props,
-      children: [
-        children,
-        showCloseButton && /* @__PURE__ */ jsx(Dialog$1.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { variant: "outline", children: "Close" }) })
-      ]
-    }
-  );
-}
-function DialogTitle({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(
-    Dialog$1.Title,
-    {
-      "data-slot": "dialog-title",
-      className: cn("text-lg leading-none font-semibold", className),
-      ...props
-    }
-  );
-}
-function DialogDescription({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(
-    Dialog$1.Description,
-    {
-      "data-slot": "dialog-description",
-      className: cn("text-sm text-muted-foreground", className),
-      ...props
-    }
-  );
-}
-var SIZE_CLASSES = {
-  sm: "sm:max-w-[24rem]",
-  md: "sm:max-w-[32rem]",
-  lg: "sm:max-w-[44rem]",
-  xl: "sm:max-w-[56rem]",
-  full: "sm:max-w-[90vw] h-[90vh]"
-};
-function ActionFormModal({
-  open,
-  onOpenChange,
-  action,
-  fields,
-  onSubmit,
-  processing = false,
-  errors = {},
-  initialValues = {}
-}) {
-  const [values, setValues] = useState(initialValues);
-  const size = action.modalSize ?? "md";
-  const schema = useMemo(
-    () => ({
-      schema: (action.form ?? []).map((entry) => ({
-        kind: "field",
-        name: entry.name,
-        type: entry.type
-      })),
-      columns: 1,
-      model: null,
-      inline: false,
-      disabled: false
-    }),
-    [action.form]
-  );
-  return /* @__PURE__ */ jsx(Dialog, { open, onOpenChange: (next) => onOpenChange(next), children: /* @__PURE__ */ jsxs(DialogContent, { className: cn("overflow-auto", SIZE_CLASSES[size]), children: [
-    /* @__PURE__ */ jsx(DialogHeader, { children: /* @__PURE__ */ jsx(DialogTitle, { children: action.label }) }),
-    /* @__PURE__ */ jsxs(
-      "form",
-      {
-        className: "flex flex-col gap-4",
-        onSubmit: (e) => {
-          e.preventDefault();
-          onSubmit(values);
-        },
-        children: [
-          /* @__PURE__ */ jsx(
-            FormRenderer,
-            {
-              schema,
-              fields,
-              values,
-              errors,
-              onChange: (name, value) => setValues((prev) => ({ ...prev, [name]: value })),
-              disabled: processing
-            }
-          ),
-          /* @__PURE__ */ jsx(
-            FormActions,
-            {
-              processing,
-              submitLabel: action.label,
-              extra: /* @__PURE__ */ jsx(DialogClose, { asChild: true, children: /* @__PURE__ */ jsx(Button, { type: "button", variant: "ghost", disabled: processing, children: "Cancel" }) })
-            }
-          )
-        ]
-      }
-    )
-  ] }) });
-}
-var COLOR_VARIANT = {
-  destructive: "destructive",
-  warning: "default",
-  info: "default"
-};
-function ConfirmDialog({
-  open,
-  onOpenChange,
-  config,
-  onConfirm,
-  processing = false
-}) {
-  const [typed, setTyped] = useState("");
-  useEffect(() => {
-    if (!open) setTyped("");
-  }, [open]);
-  const requiresText = config?.requiresText;
-  const submitDisabled = processing || requiresText !== void 0 && typed !== requiresText;
-  const variant = COLOR_VARIANT[config?.color ?? "destructive"];
-  const submitLabel = config?.submitLabel ?? (config?.color === "info" ? "Confirm" : "Delete");
-  const cancelLabel = config?.cancelLabel ?? "Cancel";
-  return /* @__PURE__ */ jsx(Dialog, { open, onOpenChange: (next) => onOpenChange(next), children: /* @__PURE__ */ jsxs(DialogContent, { className: "sm:max-w-[28rem]", showCloseButton: false, children: [
-    /* @__PURE__ */ jsxs(DialogHeader, { children: [
-      /* @__PURE__ */ jsx(DialogTitle, { children: config?.heading ?? "Are you sure?" }),
-      config?.description && /* @__PURE__ */ jsx(DialogDescription, { children: config.description })
-    ] }),
-    requiresText !== void 0 && /* @__PURE__ */ jsxs("label", { className: "flex flex-col gap-1 text-xs text-muted-foreground", children: [
-      /* @__PURE__ */ jsxs("span", { children: [
-        "Type ",
-        /* @__PURE__ */ jsx("code", { className: "font-mono text-foreground", children: requiresText }),
-        " to confirm"
-      ] }),
-      /* @__PURE__ */ jsx(
-        "input",
-        {
-          type: "text",
-          ref: (el) => el?.focus(),
-          value: typed,
-          onChange: (e) => setTyped(e.target.value),
-          onKeyDown: (e) => {
-            if (e.key === "Enter" && !submitDisabled) {
-              e.preventDefault();
-              onConfirm();
-            }
-          },
-          className: "h-9 rounded-md border border-input bg-background px-3 text-sm focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
-        }
-      )
-    ] }),
-    /* @__PURE__ */ jsxs(DialogFooter, { children: [
-      /* @__PURE__ */ jsx(DialogClose, { asChild: true, children: /* @__PURE__ */ jsx(Button, { type: "button", variant: "ghost", disabled: processing, children: cancelLabel }) }),
-      /* @__PURE__ */ jsx(Button, { type: "button", variant, disabled: submitDisabled, onClick: onConfirm, children: processing ? "Working\u2026" : submitLabel })
-    ] })
-  ] }) });
-}
-var COLOR_TO_VARIANT = {
-  primary: "default",
-  secondary: "outline",
-  destructive: "destructive",
-  success: "default",
-  warning: "default",
-  info: "default"
-};
-var VARIANT_OVERRIDE = {
-  default: "default",
-  outline: "outline",
-  ghost: "ghost",
-  destructive: "destructive"
-};
-function ActionButton({
-  action,
-  formFields = [],
-  onInvoke,
-  processing = false,
-  errors,
-  size = "default",
-  className
-}) {
-  const [confirmOpen, setConfirmOpen] = useState(false);
-  const [formOpen, setFormOpen] = useState(false);
-  const variant = VARIANT_OVERRIDE[action.variant] ?? COLOR_TO_VARIANT[action.color];
-  const handleClick = () => {
-    if (action.disabled) return;
-    if (action.requiresConfirmation) {
-      setConfirmOpen(true);
-    } else if (action.form && action.form.length > 0) {
-      setFormOpen(true);
-    } else {
-      onInvoke();
-    }
-  };
-  const handleConfirm = () => {
-    setConfirmOpen(false);
-    if (action.form && action.form.length > 0) {
-      setFormOpen(true);
-    } else {
-      onInvoke();
-    }
-  };
-  const handleFormSubmit = (values) => {
-    onInvoke(values);
-    setFormOpen(false);
-  };
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(
-      Button,
-      {
-        variant,
-        size,
-        disabled: action.disabled === true || processing,
-        title: action.tooltip,
-        onClick: handleClick,
-        className,
-        children: action.label
-      }
-    ),
-    action.requiresConfirmation && /* @__PURE__ */ jsx(
-      ConfirmDialog,
-      {
-        open: confirmOpen,
-        onOpenChange: setConfirmOpen,
-        config: action.confirmation,
-        onConfirm: handleConfirm,
-        processing
-      }
-    ),
-    action.form && action.form.length > 0 && /* @__PURE__ */ jsx(
-      ActionFormModal,
-      {
-        open: formOpen,
-        onOpenChange: setFormOpen,
-        action,
-        fields: formFields,
-        onSubmit: handleFormSubmit,
-        processing,
-        errors
-      }
-    )
-  ] });
-}
-function DropdownMenu({
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(DropdownMenu$1.Root, { "data-slot": "dropdown-menu", ...props });
-}
-function DropdownMenuTrigger({
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(
-    DropdownMenu$1.Trigger,
-    {
-      "data-slot": "dropdown-menu-trigger",
-      ...props
-    }
-  );
-}
-function DropdownMenuContent({
-  className,
-  sideOffset = 4,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(DropdownMenu$1.Portal, { children: /* @__PURE__ */ jsx(
-    DropdownMenu$1.Content,
-    {
-      "data-slot": "dropdown-menu-content",
-      sideOffset,
-      className: cn(
-        "z-50 max-h-(--radix-dropdown-menu-content-available-height) min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border bg-popover p-1 text-popover-foreground shadow-md 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 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95",
-        className
-      ),
-      ...props
-    }
-  ) });
-}
-function DropdownMenuItem({
-  className,
-  inset,
-  variant = "default",
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(
-    DropdownMenu$1.Item,
-    {
-      "data-slot": "dropdown-menu-item",
-      "data-inset": inset,
-      "data-variant": variant,
-      className: cn(
-        "relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 data-[variant=destructive]:focus:text-destructive dark:data-[variant=destructive]:focus:bg-destructive/20 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground data-[variant=destructive]:*:[svg]:text-destructive!",
-        className
-      ),
-      ...props
-    }
-  );
-}
-function ActionMenu({
-  actions,
-  formFieldsByAction = {},
-  onInvoke,
-  inlineThreshold = 3,
-  processing = false,
-  trigger,
-  className
-}) {
-  if (actions.length === 0) return null;
-  if (actions.length <= inlineThreshold) {
-    return /* @__PURE__ */ jsx("div", { className: cn("flex flex-wrap items-center gap-1", className), children: actions.map((action) => /* @__PURE__ */ jsx(
-      ActionButton,
-      {
-        action,
-        formFields: formFieldsByAction[action.name] ?? [],
-        onInvoke: (values) => onInvoke(action, values),
-        processing,
-        size: "sm"
-      },
-      action.name
-    )) });
-  }
-  return /* @__PURE__ */ jsxs(DropdownMenu, { children: [
-    /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: trigger ?? /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "icon", "aria-label": "Actions", children: "\u22EF" }) }),
-    /* @__PURE__ */ jsx(DropdownMenuContent, { align: "end", sideOffset: 6, className: cn("min-w-[12rem]", className), children: actions.map((action) => /* @__PURE__ */ jsx(
-      DropdownMenuItem,
-      {
-        disabled: action.disabled === true,
-        variant: action.color === "destructive" ? "destructive" : "default",
-        onSelect: () => {
-          if (action.disabled) return;
-          onInvoke(action);
-        },
-        children: action.label
-      },
-      action.name
-    )) })
-  ] });
-}
-
-export { ActionButton, ActionFormModal, ActionMenu, Button, ConfirmDialog, buttonVariants };
+export { ActionButton, ActionFormModal, ActionMenu, ConfirmDialog } from './chunk-TNJEHYRF.js';
+import './chunk-EYAUPJ6J.js';
+import './chunk-MTZJDFQ6.js';
+import './chunk-MSRTGCTJ.js';
+export { Button, buttonVariants } from './chunk-FHRQ7PWE.js';
+import './chunk-B7ULUJVO.js';
 //# sourceMappingURL=action.js.map
 //# sourceMappingURL=action.js.map