jsonforms-nuxt-ui-renderers 0.1.1

package/dist/index.cjs

@@ -0,0 +1,896 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.ts
+var index_exports = {};
+__export(index_exports, {
+  nuxtUiRenderers: () => nuxtUiRenderers
+});
+module.exports = __toCommonJS(index_exports);
+
+// src/nuxtUiRenderers.ts
+var import_core3 = require("@jsonforms/core");
+var import_vue30 = require("vue");
+
+// src/renderers/complex/NuxtUiArrayListRenderer.ts
+var import_core = require("@jsonforms/core");
+var import_vue2 = require("@jsonforms/vue");
+var import_vue3 = require("vue");
+
+// src/renderers/util.ts
+var import_vue = require("vue");
+function trimmedOrUndefined(input) {
+  const v = input?.trim();
+  return v ? v : void 0;
+}
+
+// src/renderers/complex/NuxtUiArrayListRenderer.ts
+var NuxtUiArrayListRenderer = (0, import_vue3.defineComponent)({
+  name: "NuxtUiArrayListRenderer",
+  components: { DispatchRenderer: import_vue2.DispatchRenderer },
+  props: (0, import_vue2.rendererProps)(),
+  setup(props) {
+    const { control, addItem, removeItems, moveUp, moveDown } = (0, import_vue2.useJsonFormsArrayControl)(
+      props
+    );
+    const errorMessage = (0, import_vue3.computed)(() => trimmedOrUndefined(control.value.errors));
+    const items = (0, import_vue3.computed)(
+      () => Array.isArray(control.value.data) ? control.value.data : []
+    );
+    const arraySchema = (0, import_vue3.computed)(() => {
+      try {
+        return import_core.Resolve.schema(
+          props.schema,
+          control.value.uischema.scope,
+          control.value.rootSchema
+        );
+      } catch {
+        return void 0;
+      }
+    });
+    const maxItemsReached = (0, import_vue3.computed)(() => {
+      const max = arraySchema.value?.maxItems;
+      return typeof max === "number" ? items.value.length >= max : false;
+    });
+    const minItemsReached = (0, import_vue3.computed)(() => {
+      const min = arraySchema.value?.minItems;
+      return typeof min === "number" ? items.value.length <= min : false;
+    });
+    const childUiSchema = (0, import_vue3.computed)(
+      () => (0, import_core.findUISchema)(
+        control.value.uischemas,
+        control.value.schema,
+        control.value.uischema.scope,
+        control.value.path,
+        void 0,
+        control.value.uischema,
+        control.value.rootSchema
+      )
+    );
+    function childLabelForIndex(index) {
+      const childLabelProp = getChildLabelPropFromUiSchemaOptions(control.value.uischema.options) ?? (0, import_core.getFirstPrimitiveProp)(control.value.schema);
+      if (!childLabelProp) return `${index}`;
+      const labelValue = import_core.Resolve.data(
+        control.value.data,
+        (0, import_core.composePaths)(`${index}`, childLabelProp)
+      );
+      if (labelValue === void 0 || labelValue === null || Number.isNaN(labelValue)) {
+        return "";
+      }
+      return String(labelValue);
+    }
+    function getChildLabelPropFromUiSchemaOptions(options) {
+      if (!options || typeof options !== "object") return void 0;
+      const value = options.childLabelProp;
+      return typeof value === "string" ? value : void 0;
+    }
+    function addButtonClick() {
+      addItem(
+        control.value.path,
+        (0, import_core.createDefaultValue)(control.value.schema, control.value.rootSchema)
+      )();
+    }
+    return () => {
+      if (!control.value.visible) return null;
+      const UFormField = (0, import_vue3.resolveComponent)("UFormField");
+      const UButton = (0, import_vue3.resolveComponent)("UButton");
+      return (0, import_vue3.h)(
+        "div",
+        {},
+        (0, import_vue3.h)(
+          UFormField,
+          {
+            label: control.value.label,
+            description: control.value.description,
+            required: control.value.required,
+            error: errorMessage.value
+          },
+          {
+            default: () => (0, import_vue3.h)("div", { class: "flex flex-col gap-3" }, [
+              (0, import_vue3.h)("div", { class: "flex items-center justify-between gap-3" }, [
+                (0, import_vue3.h)(
+                  "div",
+                  { class: "text-xs text-gray-500" },
+                  `${items.value.length} items`
+                ),
+                (0, import_vue3.h)(
+                  UButton,
+                  {
+                    type: "button",
+                    size: "xs",
+                    variant: "soft",
+                    color: "neutral",
+                    disabled: !control.value.enabled || maxItemsReached.value,
+                    onClick: addButtonClick
+                  },
+                  { default: () => "Add" }
+                )
+              ]),
+              items.value.length === 0 ? (0, import_vue3.h)(
+                "div",
+                { class: "text-sm text-gray-500" },
+                "No items."
+              ) : null,
+              ...items.value.map(
+                (_item, index) => (0, import_vue3.h)(
+                  "div",
+                  { key: `${control.value.path}-${index}`, class: "rounded border p-3" },
+                  [
+                    (0, import_vue3.h)(
+                      "div",
+                      { class: "mb-3 flex items-start justify-between gap-3" },
+                      [
+                        (0, import_vue3.h)("div", { class: "min-w-0" }, [
+                          (0, import_vue3.h)(
+                            "div",
+                            {
+                              class: "text-xs font-semibold text-gray-700 dark:text-gray-200"
+                            },
+                            [
+                              `Item ${index + 1}`,
+                              childLabelForIndex(index) ? (0, import_vue3.h)(
+                                "span",
+                                {
+                                  class: "font-normal text-gray-500"
+                                },
+                                ` \u2014 ${childLabelForIndex(index)}`
+                              ) : null
+                            ]
+                          )
+                        ]),
+                        (0, import_vue3.h)("div", { class: "flex flex-none items-center gap-1" }, [
+                          (0, import_vue3.h)(
+                            UButton,
+                            {
+                              type: "button",
+                              size: "xs",
+                              variant: "ghost",
+                              color: "neutral",
+                              disabled: !control.value.enabled || index === 0,
+                              onClick: () => moveUp?.(control.value.path, index)()
+                            },
+                            { default: () => "Up" }
+                          ),
+                          (0, import_vue3.h)(
+                            UButton,
+                            {
+                              type: "button",
+                              size: "xs",
+                              variant: "ghost",
+                              color: "neutral",
+                              disabled: !control.value.enabled || index >= items.value.length - 1,
+                              onClick: () => moveDown?.(control.value.path, index)()
+                            },
+                            { default: () => "Down" }
+                          ),
+                          (0, import_vue3.h)(
+                            UButton,
+                            {
+                              type: "button",
+                              size: "xs",
+                              variant: "ghost",
+                              color: "error",
+                              disabled: !control.value.enabled || minItemsReached.value,
+                              onClick: () => removeItems?.(control.value.path, [index])()
+                            },
+                            { default: () => "Remove" }
+                          )
+                        ])
+                      ]
+                    ),
+                    (0, import_vue3.h)(import_vue2.DispatchRenderer, {
+                      schema: control.value.schema,
+                      uischema: childUiSchema.value,
+                      path: (0, import_core.composePaths)(control.value.path, `${index}`),
+                      enabled: control.value.enabled,
+                      renderers: control.value.renderers,
+                      cells: control.value.cells
+                    })
+                  ]
+                )
+              )
+            ])
+          }
+        )
+      );
+    };
+  }
+});
+
+// src/renderers/complex/NuxtUiObjectRenderer.ts
+var import_core2 = require("@jsonforms/core");
+var import_vue4 = require("@jsonforms/vue");
+var import_vue5 = require("vue");
+var NuxtUiObjectRenderer = (0, import_vue5.defineComponent)({
+  name: "NuxtUiObjectRenderer",
+  components: { DispatchRenderer: import_vue4.DispatchRenderer },
+  props: (0, import_vue4.rendererProps)(),
+  setup(props) {
+    const { control } = (0, import_vue4.useJsonFormsControlWithDetail)(
+      props
+    );
+    const detailUiSchema = (0, import_vue5.computed)(() => {
+      const uiSchemaGenerator = () => {
+        const uiSchema = import_core2.Generate.uiSchema(
+          control.value.schema,
+          "Group",
+          void 0,
+          control.value.rootSchema
+        );
+        if (!control.value.path) {
+          uiSchema.type = "VerticalLayout";
+        } else {
+          ;
+          uiSchema.label = control.value.label;
+        }
+        return uiSchema;
+      };
+      return (0, import_core2.findUISchema)(
+        control.value.uischemas,
+        control.value.schema,
+        control.value.uischema.scope,
+        control.value.path,
+        uiSchemaGenerator,
+        control.value.uischema,
+        control.value.rootSchema
+      );
+    });
+    return () => {
+      if (!control.value.visible) return null;
+      return (0, import_vue5.h)(import_vue4.DispatchRenderer, {
+        visible: control.value.visible,
+        enabled: control.value.enabled,
+        schema: control.value.schema,
+        uischema: detailUiSchema.value,
+        path: control.value.path,
+        renderers: control.value.renderers,
+        cells: control.value.cells
+      });
+    };
+  }
+});
+
+// src/renderers/controls/NuxtUiBooleanControl.ts
+var import_vue6 = require("@jsonforms/vue");
+var import_vue7 = require("vue");
+var NuxtUiBooleanControl = (0, import_vue7.defineComponent)({
+  name: "NuxtUiBooleanControl",
+  props: (0, import_vue6.rendererProps)(),
+  setup(props) {
+    const { control, handleChange } = (0, import_vue6.useJsonFormsControl)(
+      props
+    );
+    const errorMessage = (0, import_vue7.computed)(() => trimmedOrUndefined(control.value.errors));
+    const modelValue = (0, import_vue7.computed)({
+      get: () => Boolean(control.value.data),
+      set: (v) => handleChange(control.value.path, v)
+    });
+    return () => {
+      if (!control.value.visible) return null;
+      const UFormField = (0, import_vue7.resolveComponent)("UFormField");
+      const USwitch = (0, import_vue7.resolveComponent)("USwitch");
+      return (0, import_vue7.h)(
+        "div",
+        {},
+        (0, import_vue7.h)(
+          UFormField,
+          {
+            label: control.value.label,
+            description: control.value.description,
+            required: control.value.required,
+            error: errorMessage.value
+          },
+          {
+            default: () => (0, import_vue7.h)(
+              "div",
+              { class: "flex items-center justify-between gap-3" },
+              (0, import_vue7.h)(USwitch, {
+                modelValue: modelValue.value,
+                disabled: !control.value.enabled,
+                "aria-invalid": Boolean(errorMessage.value),
+                "onUpdate:modelValue": (v) => {
+                  modelValue.value = v;
+                }
+              })
+            )
+          }
+        )
+      );
+    };
+  }
+});
+
+// src/renderers/controls/NuxtUiEnumControl.ts
+var import_vue8 = require("@jsonforms/vue");
+var import_vue9 = require("vue");
+function schemaEnumOptions(schema) {
+  if (!schema) return [];
+  if (Array.isArray(schema.enum)) {
+    return schema.enum.map((v) => ({ label: String(v), value: v }));
+  }
+  const oneOf = schema.oneOf;
+  if (!Array.isArray(oneOf)) return [];
+  const out = [];
+  for (const entry of oneOf) {
+    if (typeof entry !== "object" || entry === null) continue;
+    const maybe = entry;
+    if (!("const" in maybe)) continue;
+    out.push({
+      value: maybe.const,
+      label: typeof maybe.title === "string" && maybe.title.trim() ? maybe.title : String(maybe.const)
+    });
+  }
+  return out;
+}
+var NuxtUiEnumControl = (0, import_vue9.defineComponent)({
+  name: "NuxtUiEnumControl",
+  props: (0, import_vue8.rendererProps)(),
+  setup(props) {
+    const { control, handleChange } = (0, import_vue8.useJsonFormsControl)(
+      props
+    );
+    const errorMessage = (0, import_vue9.computed)(() => trimmedOrUndefined(control.value.errors));
+    const options = (0, import_vue9.computed)(() => schemaEnumOptions(control.value.schema));
+    const selectedValue = (0, import_vue9.computed)({
+      get: () => control.value.data,
+      set: (v) => handleChange(control.value.path, v)
+    });
+    return () => {
+      if (!control.value.visible) return null;
+      const UFormField = (0, import_vue9.resolveComponent)("UFormField");
+      const USelectMenu = (0, import_vue9.resolveComponent)("USelectMenu");
+      return (0, import_vue9.h)(
+        "div",
+        {},
+        (0, import_vue9.h)(
+          UFormField,
+          {
+            label: control.value.label,
+            description: control.value.description,
+            required: control.value.required,
+            error: errorMessage.value
+          },
+          {
+            default: () => (0, import_vue9.h)(USelectMenu, {
+              modelValue: selectedValue.value,
+              items: options.value,
+              valueKey: "value",
+              labelKey: "label",
+              disabled: !control.value.enabled,
+              color: errorMessage.value ? "error" : void 0,
+              "aria-invalid": Boolean(errorMessage.value),
+              placeholder: "Select...",
+              "onUpdate:modelValue": (v) => {
+                selectedValue.value = v;
+              }
+            })
+          }
+        )
+      );
+    };
+  }
+});
+
+// src/renderers/controls/NuxtUiIntegerControl.ts
+var import_vue10 = require("@jsonforms/vue");
+var import_vue11 = require("vue");
+var NuxtUiIntegerControl = (0, import_vue11.defineComponent)({
+  name: "NuxtUiIntegerControl",
+  props: (0, import_vue10.rendererProps)(),
+  setup(props) {
+    const { control, handleChange } = (0, import_vue10.useJsonFormsControl)(
+      props
+    );
+    const errorMessage = (0, import_vue11.computed)(() => trimmedOrUndefined(control.value.errors));
+    const modelValue = (0, import_vue11.computed)(() => {
+      const v = control.value.data;
+      return v === null || v === void 0 ? "" : String(v);
+    });
+    function onUpdate(raw) {
+      const trimmed = raw.trim();
+      if (trimmed === "") {
+        handleChange(control.value.path, void 0);
+        return;
+      }
+      const parsed = Number.parseInt(trimmed, 10);
+      handleChange(control.value.path, Number.isFinite(parsed) ? parsed : void 0);
+    }
+    return () => {
+      if (!control.value.visible) return null;
+      const UFormField = (0, import_vue11.resolveComponent)("UFormField");
+      const UInput = (0, import_vue11.resolveComponent)("UInput");
+      return (0, import_vue11.h)(
+        "div",
+        {},
+        (0, import_vue11.h)(
+          UFormField,
+          {
+            label: control.value.label,
+            description: control.value.description,
+            required: control.value.required,
+            error: errorMessage.value
+          },
+          {
+            default: () => (0, import_vue11.h)(UInput, {
+              type: "number",
+              inputmode: "numeric",
+              step: "1",
+              modelValue: modelValue.value,
+              disabled: !control.value.enabled,
+              color: errorMessage.value ? "error" : void 0,
+              "aria-invalid": Boolean(errorMessage.value),
+              "onUpdate:modelValue": onUpdate
+            })
+          }
+        )
+      );
+    };
+  }
+});
+
+// src/renderers/controls/NuxtUiNumberControl.ts
+var import_vue12 = require("@jsonforms/vue");
+var import_vue13 = require("vue");
+var NuxtUiNumberControl = (0, import_vue13.defineComponent)({
+  name: "NuxtUiNumberControl",
+  props: (0, import_vue12.rendererProps)(),
+  setup(props) {
+    const { control, handleChange } = (0, import_vue12.useJsonFormsControl)(
+      props
+    );
+    const errorMessage = (0, import_vue13.computed)(() => trimmedOrUndefined(control.value.errors));
+    const modelValue = (0, import_vue13.computed)(() => {
+      const v = control.value.data;
+      return v === null || v === void 0 ? "" : String(v);
+    });
+    function onUpdate(raw) {
+      const trimmed = raw.trim();
+      if (trimmed === "") {
+        handleChange(control.value.path, void 0);
+        return;
+      }
+      const parsed = Number(trimmed);
+      handleChange(control.value.path, Number.isFinite(parsed) ? parsed : void 0);
+    }
+    return () => {
+      if (!control.value.visible) return null;
+      const UFormField = (0, import_vue13.resolveComponent)("UFormField");
+      const UInput = (0, import_vue13.resolveComponent)("UInput");
+      return (0, import_vue13.h)(
+        "div",
+        {},
+        (0, import_vue13.h)(
+          UFormField,
+          {
+            label: control.value.label,
+            description: control.value.description,
+            required: control.value.required,
+            error: errorMessage.value
+          },
+          {
+            default: () => (0, import_vue13.h)(UInput, {
+              type: "number",
+              inputmode: "decimal",
+              modelValue: modelValue.value,
+              disabled: !control.value.enabled,
+              color: errorMessage.value ? "error" : void 0,
+              "aria-invalid": Boolean(errorMessage.value),
+              "onUpdate:modelValue": onUpdate
+            })
+          }
+        )
+      );
+    };
+  }
+});
+
+// src/renderers/controls/NuxtUiStringControl.ts
+var import_vue14 = require("@jsonforms/vue");
+var import_vue15 = require("vue");
+var NuxtUiStringControl = (0, import_vue15.defineComponent)({
+  name: "NuxtUiStringControl",
+  props: (0, import_vue14.rendererProps)(),
+  setup(props) {
+    const { control, handleChange } = (0, import_vue14.useJsonFormsControl)(
+      props
+    );
+    const errorMessage = (0, import_vue15.computed)(() => trimmedOrUndefined(control.value.errors));
+    return () => {
+      if (!control.value.visible) return null;
+      const UFormField = (0, import_vue15.resolveComponent)("UFormField");
+      const UInput = (0, import_vue15.resolveComponent)("UInput");
+      return (0, import_vue15.h)(
+        "div",
+        {},
+        (0, import_vue15.h)(
+          UFormField,
+          {
+            label: control.value.label,
+            description: control.value.description,
+            required: control.value.required,
+            error: errorMessage.value
+          },
+          {
+            default: () => (0, import_vue15.h)(UInput, {
+              modelValue: control.value.data ?? "",
+              class: "w-full",
+              disabled: !control.value.enabled,
+              color: errorMessage.value ? "error" : void 0,
+              "aria-invalid": Boolean(errorMessage.value),
+              "onUpdate:modelValue": (v) => handleChange(control.value.path, v)
+            })
+          }
+        )
+      );
+    };
+  }
+});
+
+// src/renderers/controls/NuxtUiTextareaControl.ts
+var import_vue16 = require("@jsonforms/vue");
+var import_vue17 = require("vue");
+var NuxtUiTextareaControl = (0, import_vue17.defineComponent)({
+  name: "NuxtUiTextareaControl",
+  props: (0, import_vue16.rendererProps)(),
+  setup(props) {
+    const { control, handleChange } = (0, import_vue16.useJsonFormsControl)(
+      props
+    );
+    const errorMessage = (0, import_vue17.computed)(() => trimmedOrUndefined(control.value.errors));
+    return () => {
+      if (!control.value.visible) return null;
+      const UFormField = (0, import_vue17.resolveComponent)("UFormField");
+      const UTextarea = (0, import_vue17.resolveComponent)("UTextarea");
+      return (0, import_vue17.h)(
+        "div",
+        {},
+        (0, import_vue17.h)(
+          UFormField,
+          {
+            label: control.value.label,
+            description: control.value.description,
+            required: control.value.required,
+            error: errorMessage.value
+          },
+          {
+            default: () => (0, import_vue17.h)(UTextarea, {
+              modelValue: control.value.data ?? "",
+              class: "w-full",
+              disabled: !control.value.enabled,
+              color: errorMessage.value ? "error" : void 0,
+              "aria-invalid": Boolean(errorMessage.value),
+              rows: 5,
+              "onUpdate:modelValue": (v) => handleChange(control.value.path, v)
+            })
+          }
+        )
+      );
+    };
+  }
+});
+
+// src/renderers/layouts/NuxtUiCategorizationRenderer.ts
+var import_vue18 = require("@jsonforms/vue");
+var import_vue19 = require("vue");
+var NuxtUiCategorizationRenderer = (0, import_vue19.defineComponent)({
+  name: "NuxtUiCategorizationRenderer",
+  components: { DispatchRenderer: import_vue18.DispatchRenderer },
+  props: (0, import_vue18.rendererProps)(),
+  setup(props) {
+    const { layout, categories } = (0, import_vue18.useJsonFormsCategorization)(
+      props
+    );
+    return () => {
+      if (!layout.value.visible) return null;
+      return (0, import_vue19.h)(
+        "div",
+        { class: "flex flex-col gap-6" },
+        categories.map((categoryRef, catIndex) => {
+          const category = categoryRef.value;
+          const elements = category.uischema.elements ?? [];
+          return (0, import_vue19.h)(
+            "div",
+            { key: `${layout.value.path}-cat-${catIndex}`, class: "flex flex-col gap-3" },
+            [
+              category.label ? (0, import_vue19.h)("div", { class: "text-sm font-semibold" }, category.label) : null,
+              (0, import_vue19.h)(
+                "div",
+                { class: "flex flex-col gap-3" },
+                elements.map(
+                  (element, index) => (0, import_vue19.h)(
+                    "div",
+                    { key: `${category.path}-${index}` },
+                    (0, import_vue19.h)(import_vue18.DispatchRenderer, {
+                      schema: category.schema,
+                      uischema: element,
+                      path: category.path,
+                      enabled: category.enabled,
+                      renderers: category.renderers,
+                      cells: category.cells
+                    })
+                  )
+                )
+              )
+            ]
+          );
+        })
+      );
+    };
+  }
+});
+
+// src/renderers/layouts/NuxtUiCategoryRenderer.ts
+var import_vue20 = require("@jsonforms/vue");
+var import_vue21 = require("vue");
+var NuxtUiCategoryRenderer = (0, import_vue21.defineComponent)({
+  name: "NuxtUiCategoryRenderer",
+  components: { DispatchRenderer: import_vue20.DispatchRenderer },
+  props: (0, import_vue20.rendererProps)(),
+  setup(props) {
+    const { layout } = (0, import_vue20.useJsonFormsLayout)(
+      props
+    );
+    return () => {
+      if (!layout.value.visible) return null;
+      const elements = layout.value.uischema.elements ?? [];
+      return (0, import_vue21.h)("div", { class: "flex flex-col gap-3" }, [
+        layout.value.label ? (0, import_vue21.h)("div", { class: "text-sm font-semibold" }, layout.value.label) : null,
+        (0, import_vue21.h)(
+          "div",
+          { class: "flex flex-col gap-3" },
+          elements.map(
+            (element, index) => (0, import_vue21.h)(
+              "div",
+              { key: `${layout.value.path}-${index}` },
+              (0, import_vue21.h)(import_vue20.DispatchRenderer, {
+                schema: layout.value.schema,
+                uischema: element,
+                path: layout.value.path,
+                enabled: layout.value.enabled,
+                renderers: layout.value.renderers,
+                cells: layout.value.cells
+              })
+            )
+          )
+        )
+      ]);
+    };
+  }
+});
+
+// src/renderers/layouts/NuxtUiGroupRenderer.ts
+var import_vue22 = require("@jsonforms/vue");
+var import_vue23 = require("vue");
+var NuxtUiGroupRenderer = (0, import_vue23.defineComponent)({
+  name: "NuxtUiGroupRenderer",
+  components: { DispatchRenderer: import_vue22.DispatchRenderer },
+  props: (0, import_vue22.rendererProps)(),
+  setup(props) {
+    const { layout } = (0, import_vue22.useJsonFormsLayout)(
+      props
+    );
+    return () => {
+      if (!layout.value.visible) return null;
+      const elements = layout.value.uischema.elements ?? [];
+      return (0, import_vue23.h)("div", { class: "rounded border p-3" }, [
+        layout.value.label ? (0, import_vue23.h)("div", { class: "mb-3 text-sm font-semibold" }, layout.value.label) : null,
+        (0, import_vue23.h)(
+          "div",
+          { class: "flex flex-col gap-3" },
+          elements.map(
+            (element, index) => (0, import_vue23.h)(
+              "div",
+              { key: `${layout.value.path}-${index}` },
+              (0, import_vue23.h)(import_vue22.DispatchRenderer, {
+                schema: layout.value.schema,
+                uischema: element,
+                path: layout.value.path,
+                enabled: layout.value.enabled,
+                renderers: layout.value.renderers,
+                cells: layout.value.cells
+              })
+            )
+          )
+        )
+      ]);
+    };
+  }
+});
+
+// src/renderers/layouts/NuxtUiHorizontalLayoutRenderer.ts
+var import_vue24 = require("@jsonforms/vue");
+var import_vue25 = require("vue");
+var NuxtUiHorizontalLayoutRenderer = (0, import_vue25.defineComponent)({
+  name: "NuxtUiHorizontalLayoutRenderer",
+  components: { DispatchRenderer: import_vue24.DispatchRenderer },
+  props: (0, import_vue24.rendererProps)(),
+  setup(props) {
+    const { layout } = (0, import_vue24.useJsonFormsLayout)(
+      props
+    );
+    return () => {
+      if (!layout.value.visible) return null;
+      const elements = layout.value.uischema.elements ?? [];
+      return (0, import_vue25.h)(
+        "div",
+        { class: "flex flex-col gap-3 md:flex-row md:flex-wrap" },
+        elements.map(
+          (element, index) => (0, import_vue25.h)(
+            "div",
+            { key: `${layout.value.path}-${index}`, class: "min-w-0 flex-1" },
+            (0, import_vue25.h)(import_vue24.DispatchRenderer, {
+              schema: layout.value.schema,
+              uischema: element,
+              path: layout.value.path,
+              enabled: layout.value.enabled,
+              renderers: layout.value.renderers,
+              cells: layout.value.cells
+            })
+          )
+        )
+      );
+    };
+  }
+});
+
+// src/renderers/layouts/NuxtUiLabelRenderer.ts
+var import_vue26 = require("@jsonforms/vue");
+var import_vue27 = require("vue");
+var NuxtUiLabelRenderer = (0, import_vue27.defineComponent)({
+  name: "NuxtUiLabelRenderer",
+  props: (0, import_vue26.rendererProps)(),
+  setup(props) {
+    const { label } = (0, import_vue26.useJsonFormsLabel)(
+      props
+    );
+    return () => {
+      if (!label.value.visible) return null;
+      return (0, import_vue27.h)(
+        "div",
+        { class: "text-sm text-gray-600 dark:text-gray-300" },
+        label.value.text
+      );
+    };
+  }
+});
+
+// src/renderers/layouts/NuxtUiVerticalLayoutRenderer.ts
+var import_vue28 = require("@jsonforms/vue");
+var import_vue29 = require("vue");
+var NuxtUiVerticalLayoutRenderer = (0, import_vue29.defineComponent)({
+  name: "NuxtUiVerticalLayoutRenderer",
+  components: { DispatchRenderer: import_vue28.DispatchRenderer },
+  props: (0, import_vue28.rendererProps)(),
+  setup(props) {
+    const { layout } = (0, import_vue28.useJsonFormsLayout)(
+      props
+    );
+    return () => {
+      if (!layout.value.visible) return null;
+      const elements = layout.value.uischema.elements ?? [];
+      return (0, import_vue29.h)(
+        "div",
+        { class: "flex flex-col gap-3" },
+        elements.map(
+          (element, index) => (0, import_vue29.h)(
+            "div",
+            { key: `${layout.value.path}-${index}` },
+            (0, import_vue29.h)(import_vue28.DispatchRenderer, {
+              schema: layout.value.schema,
+              uischema: element,
+              path: layout.value.path,
+              enabled: layout.value.enabled,
+              renderers: layout.value.renderers,
+              cells: layout.value.cells
+            })
+          )
+        )
+      );
+    };
+  }
+});
+
+// src/nuxtUiRenderers.ts
+var RANK = 10;
+var nuxtUiRenderers = [
+  // Layouts
+  {
+    tester: (0, import_core3.rankWith)(RANK, (0, import_core3.uiTypeIs)("VerticalLayout")),
+    renderer: (0, import_vue30.markRaw)(NuxtUiVerticalLayoutRenderer)
+  },
+  {
+    tester: (0, import_core3.rankWith)(RANK, (0, import_core3.uiTypeIs)("HorizontalLayout")),
+    renderer: (0, import_vue30.markRaw)(NuxtUiHorizontalLayoutRenderer)
+  },
+  {
+    tester: (0, import_core3.rankWith)(RANK, (0, import_core3.uiTypeIs)("Group")),
+    renderer: (0, import_vue30.markRaw)(NuxtUiGroupRenderer)
+  },
+  {
+    tester: (0, import_core3.rankWith)(RANK, (0, import_core3.uiTypeIs)("Categorization")),
+    renderer: (0, import_vue30.markRaw)(NuxtUiCategorizationRenderer)
+  },
+  {
+    tester: (0, import_core3.rankWith)(RANK, (0, import_core3.uiTypeIs)("Category")),
+    renderer: (0, import_vue30.markRaw)(NuxtUiCategoryRenderer)
+  },
+  {
+    tester: (0, import_core3.rankWith)(RANK, (0, import_core3.uiTypeIs)("Label")),
+    renderer: (0, import_vue30.markRaw)(NuxtUiLabelRenderer)
+  },
+  // Complex schemas
+  {
+    tester: (0, import_core3.rankWith)(RANK, (0, import_core3.schemaTypeIs)("array")),
+    renderer: (0, import_vue30.markRaw)(NuxtUiArrayListRenderer)
+  },
+  {
+    tester: (0, import_core3.rankWith)(RANK, import_core3.isObjectControl),
+    renderer: (0, import_vue30.markRaw)(NuxtUiObjectRenderer)
+  },
+  // Primitive controls
+  {
+    tester: (0, import_core3.rankWith)(RANK, import_core3.isMultiLineControl),
+    renderer: (0, import_vue30.markRaw)(NuxtUiTextareaControl)
+  },
+  {
+    tester: (0, import_core3.rankWith)(RANK, import_core3.isStringControl),
+    renderer: (0, import_vue30.markRaw)(NuxtUiStringControl)
+  },
+  {
+    tester: (0, import_core3.rankWith)(RANK, import_core3.isNumberControl),
+    renderer: (0, import_vue30.markRaw)(NuxtUiNumberControl)
+  },
+  {
+    tester: (0, import_core3.rankWith)(RANK, import_core3.isIntegerControl),
+    renderer: (0, import_vue30.markRaw)(NuxtUiIntegerControl)
+  },
+  {
+    tester: (0, import_core3.rankWith)(RANK, import_core3.isBooleanControl),
+    renderer: (0, import_vue30.markRaw)(NuxtUiBooleanControl)
+  },
+  {
+    tester: (0, import_core3.rankWith)(RANK, import_core3.isEnumControl),
+    renderer: (0, import_vue30.markRaw)(NuxtUiEnumControl)
+  }
+];
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  nuxtUiRenderers
+});
+//# sourceMappingURL=index.cjs.map