@btst/plugin-form-builder 0.0.0-stage → 1.0.0-beta.0

package/dist/ui/src/components/accordion.mjs

@@ -0,0 +1,62 @@
+'use client';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import * as AccordionPrimitive from '@radix-ui/react-accordion';
+import { ChevronDownIcon } from 'lucide-react';
+import { cn } from '../lib/utils.mjs';
+
+function Accordion({
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(AccordionPrimitive.Root, { "data-slot": "accordion", ...props });
+}
+function AccordionItem({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    AccordionPrimitive.Item,
+    {
+      "data-slot": "accordion-item",
+      className: cn("border-b last:border-b-0", className),
+      ...props
+    }
+  );
+}
+function AccordionTrigger({
+  className,
+  children,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(AccordionPrimitive.Header, { className: "flex", children: /* @__PURE__ */ jsxs(
+    AccordionPrimitive.Trigger,
+    {
+      "data-slot": "accordion-trigger",
+      className: cn(
+        "focus-visible:border-ring focus-visible:ring-ring/50 flex flex-1 items-start justify-between gap-4 rounded-md py-4 text-left text-sm font-medium transition-all outline-none hover:underline focus-visible:ring-[3px] disabled:pointer-events-none disabled:opacity-50 [&[data-state=open]>svg]:rotate-180",
+        className
+      ),
+      ...props,
+      children: [
+        children,
+        /* @__PURE__ */ jsx(ChevronDownIcon, { className: "text-muted-foreground pointer-events-none size-4 shrink-0 translate-y-0.5 transition-transform duration-200" })
+      ]
+    }
+  ) });
+}
+function AccordionContent({
+  className,
+  children,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    AccordionPrimitive.Content,
+    {
+      "data-slot": "accordion-content",
+      className: "data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down overflow-hidden text-sm",
+      ...props,
+      children: /* @__PURE__ */ jsx("div", { className: cn("pt-0 pb-4", className), children })
+    }
+  );
+}
+
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger };

package/dist/ui/src/components/alert-dialog.cjs

@@ -0,0 +1,157 @@
+'use client';
+'use strict';
+
+const jsxRuntime = require('react/jsx-runtime');
+const AlertDialogPrimitive = require('@radix-ui/react-alert-dialog');
+const utils = require('../lib/utils.cjs');
+const button = require('./button.cjs');
+
+function _interopNamespaceCompat(e) {
+  if (e && typeof e === 'object' && 'default' in e) return e;
+  const n = Object.create(null);
+  if (e) {
+    for (const k in e) {
+      n[k] = e[k];
+    }
+  }
+  n.default = e;
+  return n;
+}
+
+const AlertDialogPrimitive__namespace = /*#__PURE__*/_interopNamespaceCompat(AlertDialogPrimitive);
+
+function AlertDialog({
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(AlertDialogPrimitive__namespace.Root, { "data-slot": "alert-dialog", ...props });
+}
+function AlertDialogPortal({
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(AlertDialogPrimitive__namespace.Portal, { "data-slot": "alert-dialog-portal", ...props });
+}
+function AlertDialogOverlay({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    AlertDialogPrimitive__namespace.Overlay,
+    {
+      "data-slot": "alert-dialog-overlay",
+      className: utils.cn(
+        "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function AlertDialogContent({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(AlertDialogPortal, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(AlertDialogOverlay, {}),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      AlertDialogPrimitive__namespace.Content,
+      {
+        "data-slot": "alert-dialog-content",
+        className: utils.cn(
+          "bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 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 p-6 shadow-lg duration-200 sm:max-w-lg",
+          className
+        ),
+        ...props
+      }
+    )
+  ] });
+}
+function AlertDialogHeader({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "data-slot": "alert-dialog-header",
+      className: utils.cn("flex flex-col gap-2 text-center sm:text-left", className),
+      ...props
+    }
+  );
+}
+function AlertDialogFooter({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "data-slot": "alert-dialog-footer",
+      className: utils.cn(
+        "flex flex-col-reverse gap-2 sm:flex-row sm:justify-end",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function AlertDialogTitle({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    AlertDialogPrimitive__namespace.Title,
+    {
+      "data-slot": "alert-dialog-title",
+      className: utils.cn("text-lg font-semibold", className),
+      ...props
+    }
+  );
+}
+function AlertDialogDescription({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    AlertDialogPrimitive__namespace.Description,
+    {
+      "data-slot": "alert-dialog-description",
+      className: utils.cn("text-muted-foreground text-sm", className),
+      ...props
+    }
+  );
+}
+function AlertDialogAction({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    AlertDialogPrimitive__namespace.Action,
+    {
+      className: utils.cn(button.buttonVariants(), className),
+      ...props
+    }
+  );
+}
+function AlertDialogCancel({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    AlertDialogPrimitive__namespace.Cancel,
+    {
+      className: utils.cn(button.buttonVariants({ variant: "outline" }), className),
+      ...props
+    }
+  );
+}
+
+exports.AlertDialog = AlertDialog;
+exports.AlertDialogAction = AlertDialogAction;
+exports.AlertDialogCancel = AlertDialogCancel;
+exports.AlertDialogContent = AlertDialogContent;
+exports.AlertDialogDescription = AlertDialogDescription;
+exports.AlertDialogFooter = AlertDialogFooter;
+exports.AlertDialogHeader = AlertDialogHeader;
+exports.AlertDialogOverlay = AlertDialogOverlay;
+exports.AlertDialogPortal = AlertDialogPortal;
+exports.AlertDialogTitle = AlertDialogTitle;

package/dist/ui/src/components/alert-dialog.mjs

@@ -0,0 +1,132 @@
+'use client';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import * as AlertDialogPrimitive from '@radix-ui/react-alert-dialog';
+import { cn } from '../lib/utils.mjs';
+import { buttonVariants } from './button.mjs';
+
+function AlertDialog({
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(AlertDialogPrimitive.Root, { "data-slot": "alert-dialog", ...props });
+}
+function AlertDialogPortal({
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(AlertDialogPrimitive.Portal, { "data-slot": "alert-dialog-portal", ...props });
+}
+function AlertDialogOverlay({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    AlertDialogPrimitive.Overlay,
+    {
+      "data-slot": "alert-dialog-overlay",
+      className: cn(
+        "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function AlertDialogContent({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs(AlertDialogPortal, { children: [
+    /* @__PURE__ */ jsx(AlertDialogOverlay, {}),
+    /* @__PURE__ */ jsx(
+      AlertDialogPrimitive.Content,
+      {
+        "data-slot": "alert-dialog-content",
+        className: cn(
+          "bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 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 p-6 shadow-lg duration-200 sm:max-w-lg",
+          className
+        ),
+        ...props
+      }
+    )
+  ] });
+}
+function AlertDialogHeader({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "alert-dialog-header",
+      className: cn("flex flex-col gap-2 text-center sm:text-left", className),
+      ...props
+    }
+  );
+}
+function AlertDialogFooter({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "alert-dialog-footer",
+      className: cn(
+        "flex flex-col-reverse gap-2 sm:flex-row sm:justify-end",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function AlertDialogTitle({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    AlertDialogPrimitive.Title,
+    {
+      "data-slot": "alert-dialog-title",
+      className: cn("text-lg font-semibold", className),
+      ...props
+    }
+  );
+}
+function AlertDialogDescription({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    AlertDialogPrimitive.Description,
+    {
+      "data-slot": "alert-dialog-description",
+      className: cn("text-muted-foreground text-sm", className),
+      ...props
+    }
+  );
+}
+function AlertDialogAction({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    AlertDialogPrimitive.Action,
+    {
+      className: cn(buttonVariants(), className),
+      ...props
+    }
+  );
+}
+function AlertDialogCancel({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    AlertDialogPrimitive.Cancel,
+    {
+      className: cn(buttonVariants({ variant: "outline" }), className),
+      ...props
+    }
+  );
+}
+
+export { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle };

package/dist/ui/src/components/auto-form/common/label.cjs

@@ -0,0 +1,18 @@
+'use strict';
+
+const jsxRuntime = require('react/jsx-runtime');
+const form = require('../../form.cjs');
+const utils = require('../../../lib/utils.cjs');
+
+function AutoFormLabel({
+  label,
+  isRequired,
+  className
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: /* @__PURE__ */ jsxRuntime.jsxs(form.FormLabel, { className: utils.cn(className), children: [
+    label,
+    isRequired && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-destructive", children: " *" })
+  ] }) });
+}
+
+module.exports = AutoFormLabel;

package/dist/ui/src/components/auto-form/common/label.mjs

@@ -0,0 +1,16 @@
+import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
+import { FormLabel } from '../../form.mjs';
+import { cn } from '../../../lib/utils.mjs';
+
+function AutoFormLabel({
+  label,
+  isRequired,
+  className
+}) {
+  return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs(FormLabel, { className: cn(className), children: [
+    label,
+    isRequired && /* @__PURE__ */ jsx("span", { className: "text-destructive", children: " *" })
+  ] }) });
+}
+
+export { AutoFormLabel as default };

package/dist/ui/src/components/auto-form/common/tooltip.cjs

@@ -0,0 +1,9 @@
+'use strict';
+
+const jsxRuntime = require('react/jsx-runtime');
+
+function AutoFormTooltip({ fieldConfigItem }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: fieldConfigItem?.description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-gray-500 dark:text-white", children: fieldConfigItem.description }) });
+}
+
+module.exports = AutoFormTooltip;

package/dist/ui/src/components/auto-form/common/tooltip.mjs

@@ -0,0 +1,7 @@
+import { jsx, Fragment } from 'react/jsx-runtime';
+
+function AutoFormTooltip({ fieldConfigItem }) {
+  return /* @__PURE__ */ jsx(Fragment, { children: fieldConfigItem?.description && /* @__PURE__ */ jsx("p", { className: "text-sm text-gray-500 dark:text-white", children: fieldConfigItem.description }) });
+}
+
+export { AutoFormTooltip as default };

package/dist/ui/src/components/auto-form/config.cjs

@@ -0,0 +1,40 @@
+'use strict';
+
+const checkbox = require('./fields/checkbox.cjs');
+const date = require('./fields/date.cjs');
+const _enum = require('./fields/enum.cjs');
+const input = require('./fields/input.cjs');
+const number = require('./fields/number.cjs');
+const radioGroup = require('./fields/radio-group.cjs');
+const _switch = require('./fields/switch.cjs');
+const textarea = require('./fields/textarea.cjs');
+
+const INPUT_COMPONENTS = {
+  checkbox: checkbox,
+  date: date,
+  select: _enum,
+  radio: radioGroup,
+  switch: _switch,
+  textarea: textarea,
+  number: number,
+  fallback: input
+};
+const DEFAULT_ZOD_HANDLERS = {
+  // Zod v3 style type names
+  ZodBoolean: "checkbox",
+  ZodDate: "date",
+  ZodEnum: "select",
+  ZodNativeEnum: "select",
+  ZodNumber: "number",
+  // Zod v4 style type names (lowercase, no "Zod" prefix)
+  boolean: "checkbox",
+  date: "date",
+  enum: "select",
+  nativeEnum: "select",
+  number: "number",
+  int: "number",
+  float: "number"
+};
+
+exports.DEFAULT_ZOD_HANDLERS = DEFAULT_ZOD_HANDLERS;
+exports.INPUT_COMPONENTS = INPUT_COMPONENTS;

package/dist/ui/src/components/auto-form/config.mjs

@@ -0,0 +1,37 @@
+import AutoFormCheckbox from './fields/checkbox.mjs';
+import AutoFormDate from './fields/date.mjs';
+import AutoFormEnum from './fields/enum.mjs';
+import AutoFormInput from './fields/input.mjs';
+import AutoFormNumber from './fields/number.mjs';
+import AutoFormRadioGroup from './fields/radio-group.mjs';
+import AutoFormSwitch from './fields/switch.mjs';
+import AutoFormTextarea from './fields/textarea.mjs';
+
+const INPUT_COMPONENTS = {
+  checkbox: AutoFormCheckbox,
+  date: AutoFormDate,
+  select: AutoFormEnum,
+  radio: AutoFormRadioGroup,
+  switch: AutoFormSwitch,
+  textarea: AutoFormTextarea,
+  number: AutoFormNumber,
+  fallback: AutoFormInput
+};
+const DEFAULT_ZOD_HANDLERS = {
+  // Zod v3 style type names
+  ZodBoolean: "checkbox",
+  ZodDate: "date",
+  ZodEnum: "select",
+  ZodNativeEnum: "select",
+  ZodNumber: "number",
+  // Zod v4 style type names (lowercase, no "Zod" prefix)
+  boolean: "checkbox",
+  date: "date",
+  enum: "select",
+  nativeEnum: "select",
+  number: "number",
+  int: "number",
+  float: "number"
+};
+
+export { DEFAULT_ZOD_HANDLERS, INPUT_COMPONENTS };

package/dist/ui/src/components/auto-form/dependencies.cjs

@@ -0,0 +1,48 @@
+'use strict';
+
+const types = require('./types.cjs');
+
+function resolveDependencies(dependencies, currentFieldName, watch) {
+  let isDisabled = false;
+  let isHidden = false;
+  let isRequired = false;
+  let overrideOptions;
+  const currentFieldValue = watch(currentFieldName);
+  const currentFieldDependencies = dependencies.filter(
+    (dependency) => dependency.targetField === currentFieldName
+  );
+  for (const dependency of currentFieldDependencies) {
+    const watchedValue = watch(dependency.sourceField);
+    const conditionMet = dependency.when(watchedValue, currentFieldValue);
+    switch (dependency.type) {
+      case types.DependencyType.DISABLES:
+        if (conditionMet) {
+          isDisabled = true;
+        }
+        break;
+      case types.DependencyType.REQUIRES:
+        if (conditionMet) {
+          isRequired = true;
+        }
+        break;
+      case types.DependencyType.HIDES:
+        if (conditionMet) {
+          isHidden = true;
+        }
+        break;
+      case types.DependencyType.SETS_OPTIONS:
+        if (conditionMet) {
+          overrideOptions = dependency.options;
+        }
+        break;
+    }
+  }
+  return {
+    isDisabled,
+    isHidden,
+    isRequired,
+    overrideOptions
+  };
+}
+
+module.exports = resolveDependencies;

package/dist/ui/src/components/auto-form/dependencies.mjs

@@ -0,0 +1,46 @@
+import { DependencyType } from './types.mjs';
+
+function resolveDependencies(dependencies, currentFieldName, watch) {
+  let isDisabled = false;
+  let isHidden = false;
+  let isRequired = false;
+  let overrideOptions;
+  const currentFieldValue = watch(currentFieldName);
+  const currentFieldDependencies = dependencies.filter(
+    (dependency) => dependency.targetField === currentFieldName
+  );
+  for (const dependency of currentFieldDependencies) {
+    const watchedValue = watch(dependency.sourceField);
+    const conditionMet = dependency.when(watchedValue, currentFieldValue);
+    switch (dependency.type) {
+      case DependencyType.DISABLES:
+        if (conditionMet) {
+          isDisabled = true;
+        }
+        break;
+      case DependencyType.REQUIRES:
+        if (conditionMet) {
+          isRequired = true;
+        }
+        break;
+      case DependencyType.HIDES:
+        if (conditionMet) {
+          isHidden = true;
+        }
+        break;
+      case DependencyType.SETS_OPTIONS:
+        if (conditionMet) {
+          overrideOptions = dependency.options;
+        }
+        break;
+    }
+  }
+  return {
+    isDisabled,
+    isHidden,
+    isRequired,
+    overrideOptions
+  };
+}
+
+export { resolveDependencies as default };