@ghentcdh/json-forms-vue 0.6.6 → 0.6.8

package/index.mjs

@@ -1,13 +1,13 @@
-import { useApi } from "@ghentcdh/tools-vue";
-import { NotificationService, ControlWrapper, Markdown, Autocomplete, IconEnum, Btn, BtnBadge, TextCell, Table, hasCustomEventListener, Card, ModalService, myStyles, Color, Modal } from "@ghentcdh/ui";
-import { rankWith, isBooleanControl, isIntegerControl, uiTypeIs, isNumberControl, createDefaultValue, composePaths, getArrayTranslations, defaultJsonFormsI18nState, arrayDefaultTranslations } from "@jsonforms/core";
-import { useJsonFormsControl, rendererProps, DispatchRenderer, useJsonFormsArrayControl, JsonForms } from "@jsonforms/vue";
-import { ref, computed, defineComponent, resolveComponent, openBlock, createElementBlock, createVNode, mergeProps, withCtx, createElementVNode, normalizeClass, toDisplayString, createBlock, inject, createCommentVNode, Fragment, renderList, createTextVNode, watch, unref, useModel, provide, mergeModels, renderSlot } from "vue";
+import { useApi, Debugger } from "@ghentcdh/tools-vue";
+import { NotificationService, Checkbox, InputNumber, Markdown, Input, Textarea, Autocomplete, IconEnum, Btn, Collapse, BtnBadge, TextCell, Table, hasCustomEventListener, Card, ModalService, myStyles, Alert, Color, Modal } from "@ghentcdh/ui";
+import { uiTypeIs, rankWith, isNumberControl, isIntegerControl, isBooleanControl, createDefaultValue, composePaths } from "@jsonforms/core";
+import { ref, computed, defineComponent, openBlock, createBlock, unref, mergeProps, createElementBlock, createElementVNode, normalizeClass, Fragment, renderList, createVNode, createCommentVNode, withCtx, createTextVNode, watch, toDisplayString, useModel, provide, mergeModels, renderSlot } from "vue";
+import { useJsonFormsControl, rendererProps, useJsonFormsArrayControl, DispatchRenderer, useJsonFormsLayout, JsonForms } from "@jsonforms/vue";
 import { useVanillaControl, useVanillaArrayControl, vanillaRenderers } from "@jsonforms/vue-vanilla";
+import { omit, isArray } from "lodash-es";
 import { and, optionIs, or, schemaTypeIs } from "@jsonforms/core/src/testers/testers";
-import { ControlType, RequestSchema, extractFilters, findColumnDef } from "@ghentcdh/json-forms-core";
+import { ControlType, LayoutTypes, RequestSchema, extractFilters, findColumnDef } from "@ghentcdh/json-forms-core";
 import { useRouter, useRoute } from "vue-router";
-import { isArray } from "lodash-es";
 import { computedAsync } from "@vueuse/core";
 class FormStore {
   constructor(schema) {
@@ -46,158 +46,169 @@ const useVanillaControlCustom = (input, adaptTarget = (v) => v.value) => {
     isTouched.value = true;
     isFocused.value = false;
   };
-  const controlWrapper2 = computed(() => {
+  const controlWrapper = computed(() => {
     return {
       ...vanillaControl.controlWrapper.value,
+      ...omit(vanillaControl.appliedOptions.value, "styles"),
       isFocused: isFocused.value,
       isTouched: isTouched.value
     };
   });
   return {
     ...vanillaControl,
-    controlWrapper: controlWrapper2,
+    controlWrapper,
     isFocused,
     isTouched,
     onFocus,
     onBlur
+    // handleChange,
   };
 };
-const controlRenderer$8 = defineComponent({
-  name: "BooleanControlRenderer",
-  components: {
-    ControlWrapper
-  },
-  props: {
-    ...rendererProps()
-  },
-  setup(props) {
-    const control = useVanillaControlCustom(
+const _sfc_main$g = /* @__PURE__ */ defineComponent({
+  __name: "BooleanControlRenderer",
+  props: { ...rendererProps() },
+  setup(__props) {
+    const props = __props;
+    const { control, onChange, appliedOptions, onFocus, onBlur, controlWrapper } = useVanillaControlCustom(useJsonFormsControl(props), (target) => {
+      return Boolean(target.value) ?? false;
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(Checkbox), mergeProps(unref(controlWrapper), {
+        modelValue: unref(control).data,
+        "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => unref(control).data = $event),
+        enabled: unref(control).enabled,
+        config: unref(appliedOptions),
+        onChange: unref(onChange),
+        onFocus: unref(onFocus),
+        onBlur: unref(onBlur)
+      }), null, 16, ["modelValue", "enabled", "config", "onChange", "onFocus", "onBlur"]);
+    };
+  }
+});
+const _sfc_main$f = /* @__PURE__ */ defineComponent({
+  __name: "IntegerControlRenderer",
+  props: { ...rendererProps() },
+  setup(__props) {
+    const props = __props;
+    const { control, onChange, appliedOptions, onFocus, onBlur, controlWrapper } = useVanillaControlCustom(
       useJsonFormsControl(props),
-      (target) => {
-        return Boolean(target.value) ?? false;
-      }
+      (target) => target.value === "" ? void 0 : Number(target.value)
     );
-    if (control.control.value.data === void 0) {
-      control.handleChange(control.control.value.path, false);
-    }
-    return control;
-  },
-  computed: {
-    controlWrapper() {
-      return controlWrapper;
-    }
+    const steps = computed(() => appliedOptions.value.steps ?? 1);
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(InputNumber), mergeProps(unref(controlWrapper), {
+        modelValue: unref(control).data,
+        "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => unref(control).data = $event),
+        enabled: unref(control).enabled,
+        config: unref(appliedOptions),
+        steps: steps.value,
+        onChange: unref(onChange),
+        onFocus: unref(onFocus),
+        onBlur: unref(onBlur)
+      }), null, 16, ["modelValue", "enabled", "config", "steps", "onChange", "onFocus", "onBlur"]);
+    };
   }
 });
-const entry$8 = {
-  renderer: controlRenderer$8,
-  tester: rankWith(1, isBooleanControl)
-};
-const _export_sfc = (sfc, props) => {
-  const target = sfc.__vccOpts || sfc;
-  for (const [key, val] of props) {
-    target[key] = val;
+const _sfc_main$e = /* @__PURE__ */ defineComponent({
+  __name: "MarkdownControlRenderer",
+  props: { ...rendererProps() },
+  setup(__props) {
+    const props = __props;
+    const {
+      control,
+      handleChange,
+      appliedOptions,
+      onFocus,
+      onBlur,
+      controlWrapper
+    } = useVanillaControlCustom(useJsonFormsControl(props));
+    const changeValue = (value) => {
+      handleChange(control.value.path, value);
+    };
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(Markdown), mergeProps(unref(controlWrapper), {
+        modelValue: unref(control).data,
+        "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => unref(control).data = $event),
+        enabled: unref(control).enabled,
+        config: unref(appliedOptions),
+        onChange: changeValue,
+        onFocus: unref(onFocus),
+        onBlur: unref(onBlur)
+      }), null, 16, ["modelValue", "enabled", "config", "onFocus", "onBlur"]);
+    };
   }
-  return target;
-};
-const _hoisted_1$a = { class: "flex justify-around flex-col h-full" };
-const _hoisted_2$3 = { class: "fieldset-label" };
-const _hoisted_3$3 = ["id", "checked", "disabled", "autofocus", "placeholder"];
-const _hoisted_4$2 = { class: "font-bold text-gray-500 text-sm" };
-function _sfc_render$7(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_control_wrapper = resolveComponent("control-wrapper");
-  return openBlock(), createElementBlock("div", _hoisted_1$a, [
-    createVNode(_component_control_wrapper, mergeProps(_ctx.controlWrapper, {
-      styles: _ctx.styles,
-      "hide-label": true
-    }), {
-      default: withCtx(() => [
-        createElementVNode("label", _hoisted_2$3, [
-          createElementVNode("input", {
-            id: _ctx.control.id + "-input",
-            type: "checkbox",
-            class: normalizeClass(["checkbox"]),
-            checked: _ctx.control.data,
-            disabled: !_ctx.control.enabled,
-            autofocus: _ctx.appliedOptions.focus,
-            placeholder: _ctx.appliedOptions.placeholder,
-            onChange: _cache[0] || (_cache[0] = (...args) => _ctx.onChange && _ctx.onChange(...args)),
-            onFocus: _cache[1] || (_cache[1] = (...args) => _ctx.onFocus && _ctx.onFocus(...args)),
-            onBlur: _cache[2] || (_cache[2] = (...args) => _ctx.onBlur && _ctx.onBlur(...args))
-          }, null, 40, _hoisted_3$3),
-          createElementVNode("span", _hoisted_4$2, toDisplayString(_ctx.control.label), 1)
-        ])
-      ]),
-      _: 1
-    }, 16, ["styles"])
-  ]);
-}
-const BooleanControlRenderer = /* @__PURE__ */ _export_sfc(controlRenderer$8, [["render", _sfc_render$7]]);
-const showErrors = (isTouched, isFocused, errors) => {
-  return !!(isTouched && errors);
-};
-const inputClasses = (styles, isFocused, isTouched, errors) => {
-  return [
-    styles?.control.input,
-    { "input-error": showErrors(isTouched, isFocused, errors) }
-  ];
-};
-const controlRenderer$7 = defineComponent({
-  name: "IntegerControlRenderer",
-  components: {
-    ControlWrapper
-  },
-  props: {
-    ...rendererProps()
-  },
-  setup(props) {
-    return useVanillaControlCustom(
+});
+const _sfc_main$d = /* @__PURE__ */ defineComponent({
+  __name: "NumberControlRenderer",
+  props: { ...rendererProps() },
+  setup(__props) {
+    const props = __props;
+    const { control, onChange, appliedOptions, onFocus, onBlur, controlWrapper } = useVanillaControlCustom(
       useJsonFormsControl(props),
       (target) => target.value === "" ? void 0 : Number(target.value)
     );
-  },
-  computed: {
-    step() {
-      const options = this.appliedOptions;
-      return options.step ?? 1;
-    },
-    inputClass() {
-      return inputClasses(
-        this.styles,
-        this.isFocused,
-        this.isTouched,
-        this.controlWrapper?.errors
-      );
-    }
+    const steps = computed(() => appliedOptions.value.steps ?? 0.01);
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(InputNumber), mergeProps(unref(controlWrapper), {
+        modelValue: unref(control).data,
+        "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => unref(control).data = $event),
+        enabled: unref(control).enabled,
+        config: unref(appliedOptions),
+        steps: steps.value,
+        onChange: unref(onChange),
+        onFocus: unref(onFocus),
+        onBlur: unref(onBlur)
+      }), null, 16, ["modelValue", "enabled", "config", "steps", "onChange", "onFocus", "onBlur"]);
+    };
+  }
+});
+const _sfc_main$c = /* @__PURE__ */ defineComponent({
+  __name: "StringControlRenderer",
+  props: { ...rendererProps() },
+  setup(__props) {
+    const props = __props;
+    const {
+      control,
+      onChange,
+      appliedOptions,
+      onFocus,
+      onBlur,
+      controlWrapper,
+      styles
+    } = useVanillaControlCustom(useJsonFormsControl(props));
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(Input), mergeProps(unref(controlWrapper), {
+        modelValue: unref(control).data,
+        "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => unref(control).data = $event),
+        enabled: unref(control).enabled,
+        config: unref(appliedOptions),
+        styles: unref(styles),
+        onChange: unref(onChange),
+        onFocus: unref(onFocus),
+        onBlur: unref(onBlur)
+      }), null, 16, ["modelValue", "enabled", "config", "styles", "onChange", "onFocus", "onBlur"]);
+    };
+  }
+});
+const _sfc_main$b = /* @__PURE__ */ defineComponent({
+  __name: "TextAreaControlRenderer",
+  props: { ...rendererProps() },
+  setup(__props) {
+    const props = __props;
+    const { control, onChange, appliedOptions, onFocus, onBlur, controlWrapper } = useVanillaControlCustom(useJsonFormsControl(props));
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(Textarea), mergeProps(unref(controlWrapper), {
+        modelValue: unref(control).data,
+        "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => unref(control).data = $event),
+        enabled: unref(control).enabled,
+        config: unref(appliedOptions),
+        onChange: unref(onChange),
+        onFocus: unref(onFocus),
+        onBlur: unref(onBlur)
+      }), null, 16, ["modelValue", "enabled", "config", "onChange", "onFocus", "onBlur"]);
+    };
   }
 });
-const entry$7 = {
-  renderer: controlRenderer$7,
-  tester: rankWith(1, isIntegerControl)
-};
-const _hoisted_1$9 = ["id", "step", "value", "disabled", "autofocus", "placeholder"];
-function _sfc_render$6(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_control_wrapper = resolveComponent("control-wrapper");
-  return openBlock(), createBlock(_component_control_wrapper, mergeProps(_ctx.controlWrapper, { styles: _ctx.styles }), {
-    default: withCtx(() => [
-      createElementVNode("input", {
-        id: _ctx.control.id + "-input",
-        autocomplete: "off",
-        type: "number",
-        step: _ctx.step,
-        class: normalizeClass(_ctx.inputClass),
-        value: _ctx.control.data,
-        disabled: !_ctx.control.enabled,
-        autofocus: _ctx.appliedOptions.focus,
-        placeholder: _ctx.appliedOptions.placeholder,
-        onChange: _cache[0] || (_cache[0] = (...args) => _ctx.onChange && _ctx.onChange(...args)),
-        onFocus: _cache[1] || (_cache[1] = (...args) => _ctx.onFocus && _ctx.onFocus(...args)),
-        onBlur: _cache[2] || (_cache[2] = (...args) => _ctx.onBlur && _ctx.onBlur(...args))
-      }, null, 42, _hoisted_1$9)
-    ]),
-    _: 1
-  }, 16, ["styles"]);
-}
-const IntegerControlRenderer = /* @__PURE__ */ _export_sfc(controlRenderer$7, [["render", _sfc_render$6]]);
 const isAutoCompleteControl = and(
   // uiTypeIs('Control'),
   optionIs("format", ControlType.autocomplete)
@@ -214,10 +225,6 @@ const isMarkdownControl = and(
   uiTypeIs("Control"),
   optionIs("format", ControlType.markdown)
 );
-const isFixedArray = and(
-  schemaTypeIs("array"),
-  optionIs("format", ControlType.fixedArray)
-);
 const isArrayRenderer = and(
   schemaTypeIs("array")
   // optionIs('format', ControlType.array),
@@ -228,228 +235,61 @@ const isCustomControl = (customType) => {
     optionIs("type", customType)
   );
 };
-const controlRenderer$6 = defineComponent({
-  name: "MarkdownControlRenderer",
-  components: {
-    Markdown
-  },
-  props: {
-    ...rendererProps()
-  },
-  setup(props) {
-    const control = useVanillaControlCustom(
-      useJsonFormsControl(props),
-      (target) => target.value ?? void 0
-    );
-    const field = control.appliedOptions.value.field;
+const _sfc_main$a = /* @__PURE__ */ defineComponent({
+  __name: "AutocompleteControlRenderer",
+  props: { ...rendererProps() },
+  setup(__props) {
+    const props = __props;
+    const {
+      control,
+      handleChange: _handleChange,
+      appliedOptions,
+      onFocus,
+      onBlur,
+      controlWrapper
+    } = useVanillaControlCustom(useJsonFormsControl(props));
+    const field = computed(() => appliedOptions.value.field);
     const handleChange = (result) => {
-      const { path } = control.control.value;
-      control.handleChange(path, result);
+      const { path } = control.value;
+      _handleChange(path, result);
     };
-    return { ...control, field, handleChange };
-  }
-});
-const entry$6 = {
-  renderer: controlRenderer$6,
-  tester: rankWith(1, isMarkdownControl)
-};
-function _sfc_render$5(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_Markdown = resolveComponent("Markdown");
-  return openBlock(), createBlock(_component_Markdown, mergeProps(_ctx.controlWrapper, {
-    modelValue: _ctx.control.data,
-    "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.control.data = $event),
-    enabled: _ctx.control.enabled,
-    config: _ctx.appliedOptions,
-    onChange: _ctx.handleChange,
-    onFocus: _ctx.onFocus,
-    onBlur: _ctx.onBlur
-  }), null, 16, ["modelValue", "enabled", "config", "onChange", "onFocus", "onBlur"]);
-}
-const MarkdownControlRenderer = /* @__PURE__ */ _export_sfc(controlRenderer$6, [["render", _sfc_render$5]]);
-const controlRenderer$5 = defineComponent({
-  name: "NumberControlRenderer",
-  components: {
-    ControlWrapper
-  },
-  props: {
-    ...rendererProps()
-  },
-  setup(props) {
-    return useVanillaControlCustom(
-      useJsonFormsControl(props),
-      (target) => target.value === "" ? void 0 : Number(target.value)
-    );
-  },
-  computed: {
-    step() {
-      const options = this.appliedOptions;
-      return options.step ?? 0.1;
-    },
-    inputClass() {
-      return inputClasses(
-        this.styles,
-        this.isFocused,
-        this.isTouched,
-        this.controlWrapper?.errors
-      );
-    }
-  }
-});
-const entry$5 = {
-  renderer: controlRenderer$5,
-  tester: rankWith(1, isNumberControl)
-};
-const _hoisted_1$8 = ["id", "step", "value", "disabled", "autofocus", "placeholder"];
-function _sfc_render$4(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_control_wrapper = resolveComponent("control-wrapper");
-  return openBlock(), createBlock(_component_control_wrapper, mergeProps(_ctx.controlWrapper, { styles: _ctx.styles }), {
-    default: withCtx(() => [
-      createElementVNode("input", {
-        id: _ctx.control.id + "-input",
-        autocomplete: "off",
-        type: "number",
-        step: _ctx.step,
-        class: normalizeClass(_ctx.inputClass),
-        value: _ctx.control.data,
-        disabled: !_ctx.control.enabled,
-        autofocus: _ctx.appliedOptions.focus,
-        placeholder: _ctx.appliedOptions.placeholder,
-        onChange: _cache[0] || (_cache[0] = (...args) => _ctx.onChange && _ctx.onChange(...args)),
-        onFocus: _cache[1] || (_cache[1] = (...args) => _ctx.onFocus && _ctx.onFocus(...args)),
-        onBlur: _cache[2] || (_cache[2] = (...args) => _ctx.onBlur && _ctx.onBlur(...args))
-      }, null, 42, _hoisted_1$8)
-    ]),
-    _: 1
-  }, 16, ["styles"]);
-}
-const NumberControlRenderer = /* @__PURE__ */ _export_sfc(controlRenderer$5, [["render", _sfc_render$4]]);
-const controlRenderer$4 = defineComponent({
-  name: "StringControlRenderer",
-  components: {
-    ControlWrapper
-  },
-  props: {
-    ...rendererProps()
-  },
-  setup(props) {
-    return useVanillaControlCustom(
-      useJsonFormsControl(props),
-      (target) => target.value ?? void 0
-    );
-  },
-  computed: {
-    inputClass() {
-      return inputClasses(
-        this.styles,
-        this.isFocused,
-        this.isTouched,
-        this.controlWrapper?.errors
-      );
-    }
-  }
-});
-const entry$4 = {
-  renderer: controlRenderer$4,
-  tester: rankWith(1, isStringFormat)
-};
-const _hoisted_1$7 = ["id", "value", "disabled", "autofocus", "placeholder"];
-function _sfc_render$3(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_ControlWrapper = resolveComponent("ControlWrapper");
-  return openBlock(), createBlock(_component_ControlWrapper, mergeProps(_ctx.controlWrapper, { styles: _ctx.styles }), {
-    default: withCtx(() => [
-      createElementVNode("input", {
-        id: _ctx.control.id + "-input",
-        type: "text",
-        class: normalizeClass(_ctx.inputClass),
-        value: _ctx.control.data,
-        disabled: !_ctx.control.enabled,
-        autofocus: _ctx.appliedOptions.focus,
-        placeholder: _ctx.appliedOptions.placeholder,
-        autocomplete: "off",
-        onChange: _cache[0] || (_cache[0] = (...args) => _ctx.onChange && _ctx.onChange(...args)),
-        onFocus: _cache[1] || (_cache[1] = (...args) => _ctx.onFocus && _ctx.onFocus(...args)),
-        onBlur: _cache[2] || (_cache[2] = (...args) => _ctx.onBlur && _ctx.onBlur(...args))
-      }, null, 42, _hoisted_1$7)
-    ]),
-    _: 1
-  }, 16, ["styles"]);
-}
-const StringControlRenderer = /* @__PURE__ */ _export_sfc(controlRenderer$4, [["render", _sfc_render$3]]);
-const controlRenderer$3 = defineComponent({
-  name: "TextAreaControlRenderer",
-  components: {
-    ControlWrapper
-  },
-  props: {
-    ...rendererProps()
-  },
-  setup(props) {
-    return useVanillaControlCustom(
-      useJsonFormsControl(props),
-      (target) => target.value ?? void 0
-    );
-  }
-});
-const entry$3 = {
-  renderer: controlRenderer$3,
-  tester: rankWith(1, isTextAreaControl)
-};
-const controlRenderer$2 = defineComponent({
-  name: "AutocompleteControlRenderer",
-  components: {
-    Autocomplete
-  },
-  props: {
-    ...rendererProps()
-  },
-  setup(props) {
-    const control = useVanillaControlCustom(
-      useJsonFormsControl(props),
-      (target) => target.value ?? void 0
-    );
-    const field = control.appliedOptions.value.field;
-    const handleChange = (result) => {
-      const { path } = control.control.value;
-      control.handleChange(path, result);
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(Autocomplete), mergeProps(unref(controlWrapper), {
+        modelValue: unref(control).data,
+        "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => unref(control).data = $event),
+        enabled: unref(control).enabled,
+        config: unref(appliedOptions),
+        "label-key": field.value?.label,
+        "value-key": field.value?.id,
+        onChange: handleChange,
+        onFocus: unref(onFocus),
+        onBlur: unref(onBlur)
+      }), null, 16, ["modelValue", "enabled", "config", "label-key", "value-key", "onFocus", "onBlur"]);
     };
-    return { ...control, field, handleChange };
   }
 });
-const entry$2 = {
-  renderer: controlRenderer$2,
-  tester: rankWith(1, isAutoCompleteControl)
-};
-function _sfc_render$2(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_Autocomplete = resolveComponent("Autocomplete");
-  return openBlock(), createBlock(_component_Autocomplete, mergeProps(_ctx.controlWrapper, {
-    modelValue: _ctx.control.data,
-    "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.control.data = $event),
-    enabled: _ctx.control.enabled,
-    config: _ctx.appliedOptions,
-    "label-key": _ctx.field?.label,
-    "value-key": _ctx.field?.id,
-    onChange: _ctx.handleChange,
-    onFocus: _ctx.onFocus,
-    onBlur: _ctx.onBlur
-  }), null, 16, ["modelValue", "enabled", "config", "label-key", "value-key", "onChange", "onFocus", "onBlur"]);
-}
-const AutocompleteControlRenderer = /* @__PURE__ */ _export_sfc(controlRenderer$2, [["render", _sfc_render$2]]);
 const controlRenderers = [
   // First custom renderers on format
-  entry$6,
-  entry$2,
-  entry$3,
-  // multiStringControlRendererEntry,
-  // enumControlRendererEntry,
-  // oneOfEnumControlRendererEntry,
-  // dateControlRendererEntry,
-  // dateTimeControlRendererEntry,
-  // timeControlRendererEntry,
-  entry$8,
+  {
+    tester: rankWith(10, isMarkdownControl),
+    renderer: _sfc_main$e
+  },
+  {
+    tester: rankWith(10, isAutoCompleteControl),
+    renderer: _sfc_main$a
+  },
+  {
+    tester: rankWith(10, isTextAreaControl),
+    renderer: _sfc_main$b
+  },
   // Renderers based on type if no format is provided
-  entry$4,
-  entry$5,
-  entry$7
+  { tester: rankWith(10, isStringFormat), renderer: _sfc_main$c },
+  { tester: rankWith(10, isNumberControl), renderer: _sfc_main$d },
+  {
+    tester: rankWith(10, isIntegerControl),
+    renderer: _sfc_main$f
+  },
+  { tester: rankWith(10, isBooleanControl), renderer: _sfc_main$g }
 ];
 const actionMap = {
   edit: (router, action) => ({
@@ -484,255 +324,233 @@ class FormState {
 const useFormState = (form) => {
   return FormState.getInstance();
 };
-const controlRenderer$1 = defineComponent({
-  name: "ArrayListRenderer",
-  components: {
-    DispatchRenderer,
-    Btn
-  },
-  props: {
-    ...rendererProps()
-  },
-  setup(props) {
+const _hoisted_1$8 = ["title"];
+const _hoisted_2$2 = { key: 0 };
+const _hoisted_3$1 = {
+  key: 1,
+  class: "list-row"
+};
+const _sfc_main$9 = /* @__PURE__ */ defineComponent({
+  __name: "ArrayRenderer",
+  props: { ...rendererProps() },
+  setup(__props) {
+    const props = __props;
     const vanillaArrayControl = useVanillaArrayControl(
       useJsonFormsArrayControl(props)
     );
-    const control = vanillaArrayControl.control.value;
-    if (!control.data || control.data.length < 1) {
+    const { styles, childUiSchema, control, appliedOptions } = vanillaArrayControl;
+    if (!control.value.data || control.value.data.length < 1) {
       vanillaArrayControl.addItem(
-        control.path,
-        createDefaultValue(control.schema, control.rootSchema)
+        control.value.path,
+        createDefaultValue(control.value.schema, control.value.rootSchema)
       )();
     }
-    return vanillaArrayControl;
-  },
-  computed: {
-    IconEnum() {
-      return IconEnum;
-    },
-    noData() {
-      return !this.control.data || this.control.data.length === 0;
-    },
-    actions() {
-      const actions = this.uischema.options?.actions ?? [];
-      return mapArrayActions(useRouter(), actions);
-    },
-    showDelete() {
-      return this.control.data?.length > 1;
-    },
-    translations() {
-      const jsonforms = inject("jsonforms");
-      return getArrayTranslations(
-        jsonforms?.i18n?.translate ?? defaultJsonFormsI18nState.translate,
-        arrayDefaultTranslations,
-        this.control.i18nKeyPrefix,
-        this.control.label
-      );
-    },
-    labelKey() {
-      const key = this.uischema?.options?.labelKey;
+    const noData = computed(
+      () => !control.value.data || control.value.data.length === 0
+    );
+    const actions = computed(() => {
+      const actions2 = props.uischema.options?.actions ?? [];
+      return mapArrayActions(useRouter(), actions2);
+    });
+    const showDelete = computed(() => control.value.data?.length > 1);
+    computed(() => {
+      const key = control.value.uischema?.options?.labelKey;
       if (!key) return null;
       return key;
-    }
-  },
-  methods: {
-    composePaths,
-    createDefaultValue,
-    deleteButtonClick(index) {
-      this.removeItems(this.control.path, [index])();
-    },
-    dispatchEvent: (event, data) => {
+    });
+    const deleteButtonClick = (index) => {
+      vanillaArrayControl.removeItems(control.value.path, [index])();
+    };
+    const dispatchEvent = (event, data) => {
       const form_id = "";
       useFormState().dispatchEvent(form_id, event, data);
-    },
-    addButtonClick() {
-      this.addItem(
-        this.control.path,
-        createDefaultValue(this.control.schema, this.control.rootSchema)
+    };
+    const addButtonClick = () => {
+      vanillaArrayControl.addItem(
+        control.value.path,
+        createDefaultValue(control.value.schema, control.value.rootSchema)
       )();
-    }
+    };
+    const showActions = computed(() => {
+      return !appliedOptions.value.hideActions;
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        title: unref(control).label
+      }, [
+        createElementVNode("div", {
+          class: normalizeClass([
+            "flex gap-2",
+            unref(appliedOptions)?.layout === "row" ? "flex-row items-center" : "flex-col"
+          ])
+        }, [
+          (openBlock(true), createElementBlock(Fragment, null, renderList(unref(control).data, (element, index) => {
+            return openBlock(), createElementBlock("div", {
+              key: `${unref(control).path}-${index}`,
+              class: "flex-1"
+            }, [
+              createElementVNode("div", {
+                class: normalizeClass([
+                  "flex gap-2",
+                  unref(appliedOptions)?.layout === "row" ? "flex-col" : "flex-row items-center"
+                ])
+              }, [
+                createElementVNode("div", null, [
+                  createVNode(unref(DispatchRenderer), {
+                    schema: unref(control).schema,
+                    uischema: unref(childUiSchema),
+                    path: unref(composePaths)(unref(control).path, `${index}`),
+                    enabled: unref(control).enabled,
+                    renderers: unref(control).renderers,
+                    cells: unref(control).cells
+                  }, null, 8, ["schema", "uischema", "path", "enabled", "renderers", "cells"])
+                ]),
+                showActions.value ? (openBlock(), createElementBlock("div", _hoisted_2$2, [
+                  (openBlock(true), createElementBlock(Fragment, null, renderList(actions.value, (action) => {
+                    return openBlock(), createElementBlock(Fragment, null, [
+                      action.show(element) ? (openBlock(), createBlock(unref(Btn), {
+                        key: action.label,
+                        icon: action.icon,
+                        outline: true,
+                        onClick: ($event) => dispatchEvent(action.label, element)
+                      }, null, 8, ["icon", "onClick"])) : createCommentVNode("", true)
+                    ], 64);
+                  }), 256)),
+                  showDelete.value ? (openBlock(), createBlock(unref(Btn), {
+                    key: 0,
+                    icon: unref(IconEnum).Delete,
+                    outline: true,
+                    onClick: ($event) => deleteButtonClick(index)
+                  }, null, 8, ["icon", "onClick"])) : createCommentVNode("", true)
+                ])) : createCommentVNode("", true)
+              ], 2)
+            ]);
+          }), 128)),
+          noData.value ? (openBlock(), createElementBlock("div", {
+            key: 0,
+            class: normalizeClass(["list-row", unref(styles).arrayList.noData])
+          }, " No data ", 2)) : createCommentVNode("", true),
+          showActions.value ? (openBlock(), createElementBlock("div", _hoisted_3$1, [
+            createVNode(unref(Btn), {
+              icon: unref(IconEnum).Plus,
+              outline: true,
+              onClick: addButtonClick
+            }, {
+              default: withCtx(() => [..._cache[0] || (_cache[0] = [
+                createTextVNode(" Add ", -1)
+              ])]),
+              _: 1
+            }, 8, ["icon"])
+          ])) : createCommentVNode("", true)
+        ], 2)
+      ], 8, _hoisted_1$8);
+    };
   }
 });
-const entry$1 = {
-  renderer: controlRenderer$1,
-  tester: rankWith(2, isArrayRenderer)
-};
-const _hoisted_1$6 = { class: "fieldset" };
-const _hoisted_2$2 = { class: "flex gap-2 items-center" };
-const _hoisted_3$2 = { class: "mt-3 flex gap-2" };
-const _hoisted_4$1 = { class: "py-2" };
-function _sfc_render$1(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_dispatch_renderer = resolveComponent("dispatch-renderer");
-  const _component_Btn = resolveComponent("Btn");
-  return _ctx.control.visible ? (openBlock(), createElementBlock("fieldset", {
-    key: 0,
-    class: normalizeClass(_ctx.styles.arrayList.root)
-  }, [
-    !_ctx.labelKey ? (openBlock(), createElementBlock("legend", {
-      key: 0,
-      class: normalizeClass(_ctx.styles.arrayList.legend)
-    }, [
-      createElementVNode("label", {
-        class: normalizeClass(_ctx.styles.arrayList.label)
-      }, toDisplayString(_ctx.control.label), 3)
-    ], 2)) : createCommentVNode("", true),
-    createElementVNode("div", null, [
-      (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.control.data, (element, index) => {
-        return openBlock(), createElementBlock("div", {
-          key: `${_ctx.control.path}-${index}`
-        }, [
-          createElementVNode("fieldset", _hoisted_1$6, [
-            _ctx.labelKey ? (openBlock(), createElementBlock("legend", {
-              key: 0,
-              class: normalizeClass(_ctx.styles.arrayList.legend)
-            }, toDisplayString(element[_ctx.labelKey]?.toLowerCase()), 3)) : createCommentVNode("", true),
-            createElementVNode("div", _hoisted_2$2, [
-              createVNode(_component_dispatch_renderer, {
-                schema: _ctx.control.schema,
-                uischema: _ctx.childUiSchema,
-                path: _ctx.composePaths(_ctx.control.path, `${index}`),
-                enabled: _ctx.control.enabled,
-                renderers: _ctx.control.renderers,
-                cells: _ctx.control.cells
-              }, null, 8, ["schema", "uischema", "path", "enabled", "renderers", "cells"]),
-              createElementVNode("div", _hoisted_3$2, [
-                (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.actions, (action) => {
-                  return openBlock(), createElementBlock(Fragment, null, [
-                    action.show(element) ? (openBlock(), createBlock(_component_Btn, {
-                      key: action.label,
-                      icon: action.icon,
-                      outline: true,
-                      onClick: ($event) => _ctx.dispatchEvent(action.label, element)
-                    }, null, 8, ["icon", "onClick"])) : createCommentVNode("", true)
-                  ], 64);
-                }), 256)),
-                _ctx.showDelete ? (openBlock(), createBlock(_component_Btn, {
-                  key: 0,
-                  icon: _ctx.IconEnum.Delete,
-                  outline: true,
-                  onClick: ($event) => _ctx.deleteButtonClick(index)
-                }, null, 8, ["icon", "onClick"])) : createCommentVNode("", true)
-              ])
-            ])
+const arrayRenderers = [
+  {
+    tester: rankWith(12, isArrayRenderer),
+    renderer: _sfc_main$9
+  }
+];
+const _hoisted_1$7 = { class: "flex flex-col gap-4" };
+const _sfc_main$8 = /* @__PURE__ */ defineComponent({
+  __name: "CollapseLayout",
+  props: { ...rendererProps() },
+  setup(__props) {
+    const props = __props;
+    const jsonLayout = useJsonFormsLayout(props);
+    const { layout, renderers, cells } = jsonLayout;
+    const title = computed(() => {
+      const { titleKey, title: title2 } = layout?.value.uischema?.options ?? {};
+      if (title2) return title2;
+      if (titleKey) return layout?.value.data[titleKey];
+      return layout?.value.uischema?.options?.titleKey;
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(Collapse), { title: title.value }, {
+        default: withCtx(() => [
+          createElementVNode("div", _hoisted_1$7, [
+            (openBlock(true), createElementBlock(Fragment, null, renderList(unref(layout).uischema.elements, (element, index) => {
+              return openBlock(), createBlock(unref(DispatchRenderer), {
+                key: index,
+                schema: unref(layout).schema,
+                uischema: element,
+                path: unref(layout).path,
+                renderers: unref(renderers),
+                cells: unref(cells)
+              }, null, 8, ["schema", "uischema", "path", "renderers", "cells"]);
+            }), 128))
           ])
-        ]);
-      }), 128))
-    ]),
-    createElementVNode("div", _hoisted_4$1, [
-      createVNode(_component_Btn, {
-        icon: _ctx.IconEnum.Plus,
-        outline: true,
-        onClick: _ctx.addButtonClick
-      }, {
-        default: withCtx(() => [..._cache[0] || (_cache[0] = [
-          createTextVNode(" Add ", -1)
-        ])]),
+        ]),
         _: 1
-      }, 8, ["icon", "onClick"])
-    ]),
-    _ctx.noData ? (openBlock(), createElementBlock("div", {
-      key: 1,
-      class: normalizeClass(_ctx.styles.arrayList.noData)
-    }, toDisplayString(_ctx.translations.noDataMessage), 3)) : createCommentVNode("", true)
-  ], 2)) : createCommentVNode("", true);
-}
-const ArrayRenderer = /* @__PURE__ */ _export_sfc(controlRenderer$1, [["render", _sfc_render$1]]);
-const controlRenderer = defineComponent({
-  name: "FixedArrayListRenderer",
-  components: {
-    DispatchRenderer
-  },
-  props: {
-    ...rendererProps()
-  },
-  setup(props) {
-    return useVanillaArrayControl(useJsonFormsArrayControl(props));
-  },
-  computed: {
-    noData() {
-      return !this.control.data || this.control.data.length === 0;
-    },
-    translations() {
-      const jsonforms = inject("jsonforms");
-      return getArrayTranslations(
-        jsonforms?.i18n?.translate ?? defaultJsonFormsI18nState.translate,
-        arrayDefaultTranslations,
-        this.control.i18nKeyPrefix,
-        this.control.label
-      );
-    },
-    labelKey() {
-      const key = this.uischema?.options?.labelKey;
-      if (!key) return null;
-      return key;
-    }
-  },
-  methods: {
-    composePaths,
-    createDefaultValue
+      }, 8, ["title"]);
+    };
+  }
+});
+const _hoisted_1$6 = { class: "flex flex-row gap-4 items-center" };
+const _sfc_main$7 = /* @__PURE__ */ defineComponent({
+  __name: "HorizontalLayout",
+  props: { ...rendererProps() },
+  setup(__props) {
+    const props = __props;
+    const { layout, renderers, cells } = useJsonFormsLayout(props);
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1$6, [
+        (openBlock(true), createElementBlock(Fragment, null, renderList(unref(layout).uischema.elements, (element, index) => {
+          return openBlock(), createBlock(unref(DispatchRenderer), {
+            key: index,
+            schema: unref(layout).schema,
+            uischema: element,
+            path: unref(layout).path,
+            renderers: unref(renderers),
+            cells: unref(cells)
+          }, null, 8, ["schema", "uischema", "path", "renderers", "cells"]);
+        }), 128))
+      ]);
+    };
+  }
+});
+const _hoisted_1$5 = { class: "flex flex-col gap-4" };
+const _sfc_main$6 = /* @__PURE__ */ defineComponent({
+  __name: "VerticalLayout",
+  props: { ...rendererProps() },
+  setup(__props) {
+    const props = __props;
+    const { layout, renderers, cells } = useJsonFormsLayout(props);
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1$5, [
+        (openBlock(true), createElementBlock(Fragment, null, renderList(unref(layout).uischema.elements, (element, index) => {
+          return openBlock(), createBlock(unref(DispatchRenderer), {
+            key: index,
+            schema: unref(layout).schema,
+            uischema: element,
+            path: unref(layout).path,
+            renderers: unref(renderers),
+            cells: unref(cells)
+          }, null, 8, ["schema", "uischema", "path", "renderers", "cells"]);
+        }), 128))
+      ]);
+    };
   }
 });
-const entry = {
-  renderer: controlRenderer,
-  tester: rankWith(2, isFixedArray)
-};
-const _hoisted_1$5 = { class: "fieldset" };
-function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_dispatch_renderer = resolveComponent("dispatch-renderer");
-  return _ctx.control.visible ? (openBlock(), createElementBlock("fieldset", {
-    key: 0,
-    class: normalizeClass(_ctx.styles.arrayList.root)
-  }, [
-    !_ctx.labelKey ? (openBlock(), createElementBlock("legend", {
-      key: 0,
-      class: normalizeClass(_ctx.styles.arrayList.legend)
-    }, [
-      createElementVNode("label", {
-        class: normalizeClass(_ctx.styles.arrayList.label)
-      }, toDisplayString(_ctx.control.label), 3)
-    ], 2)) : createCommentVNode("", true),
-    createElementVNode("div", {
-      class: normalizeClass(_ctx.styles.fixedArrayList.root)
-    }, [
-      (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.control.data, (element, index) => {
-        return openBlock(), createElementBlock("div", {
-          key: `${_ctx.control.path}-${index}`,
-          class: normalizeClass(_ctx.styles.fixedArrayList.item)
-        }, [
-          createElementVNode("fieldset", _hoisted_1$5, [
-            _ctx.labelKey ? (openBlock(), createElementBlock("legend", {
-              key: 0,
-              class: normalizeClass(_ctx.styles.arrayList.legend)
-            }, toDisplayString(element[_ctx.labelKey]?.toLowerCase()), 3)) : createCommentVNode("", true),
-            createVNode(_component_dispatch_renderer, {
-              schema: _ctx.control.schema,
-              uischema: _ctx.childUiSchema,
-              path: _ctx.composePaths(_ctx.control.path, `${index}`),
-              enabled: _ctx.control.enabled,
-              renderers: _ctx.control.renderers,
-              cells: _ctx.control.cells
-            }, null, 8, ["schema", "uischema", "path", "enabled", "renderers", "cells"])
-          ])
-        ], 2);
-      }), 128))
-    ], 2),
-    _ctx.noData ? (openBlock(), createElementBlock("div", {
-      key: 1,
-      class: normalizeClass(_ctx.styles.arrayList.noData)
-    }, toDisplayString(_ctx.translations.noDataMessage), 3)) : createCommentVNode("", true)
-  ], 2)) : createCommentVNode("", true);
-}
-const FixedArrayRenderer = /* @__PURE__ */ _export_sfc(controlRenderer, [["render", _sfc_render]]);
-const arrayRenderers = [
-  entry,
-  entry$1
-];
 const layoutRenderers = [
-  //  LayoutRenderer
+  {
+    tester: rankWith(10, uiTypeIs(LayoutTypes.VerticalLayout)),
+    renderer: _sfc_main$6
+  },
+  {
+    tester: rankWith(10, uiTypeIs(LayoutTypes.HorizontalLayout)),
+    renderer: _sfc_main$7
+  },
+  {
+    tester: rankWith(10, uiTypeIs(LayoutTypes.CollapseLayout)),
+    renderer: _sfc_main$8
+  }
 ];
 const _hoisted_1$4 = { class: "" };
 const _hoisted_2$1 = { class: "flex gap-2 items-center mb-2" };
-const _hoisted_3$1 = { class: "flex gap-2" };
+const _hoisted_3 = { class: "flex gap-2" };
 const _sfc_main$5 = /* @__PURE__ */ defineComponent({
   __name: "table-filter",
   props: {
@@ -776,7 +594,7 @@ const _sfc_main$5 = /* @__PURE__ */ defineComponent({
             _: 1
           })) : createCommentVNode("", true)
         ]),
-        createElementVNode("div", _hoisted_3$1, [
+        createElementVNode("div", _hoisted_3, [
           (openBlock(true), createElementBlock(Fragment, null, renderList(__props.filters, (filter) => {
             return openBlock(), createBlock(unref(BtnBadge), {
               key: filter.key,
@@ -1106,12 +924,12 @@ const customRenderers = [
 const customRenderesName = customRenderers.map((c) => {
   return c.renderer.name;
 });
-const useVanillaRenderers = vanillaRenderers.filter(
+vanillaRenderers.filter(
   (v) => !customRenderesName.includes(v.renderer.name)
 );
 const tailwindRenderers = [
-  ...customRenderers,
-  ...useVanillaRenderers
+  ...vanillaRenderers,
+  ...customRenderers
 ];
 const _hoisted_1$1 = ["id"];
 const _sfc_main$2 = /* @__PURE__ */ defineComponent({
@@ -1127,7 +945,7 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
     "modelValue": {},
     "modelModifiers": {}
   }),
-  emits: /* @__PURE__ */ mergeModels(["valid", "change", "submit"], ["update:modelValue"]),
+  emits: /* @__PURE__ */ mergeModels(["valid", "change", "submit", "errors"], ["update:modelValue"]),
   setup(__props, { emit: __emit }) {
     const properties = __props;
     const _JSON_FORM_ID = `json-form-${Date.now()}`;
@@ -1140,6 +958,8 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
       valid.value = event.errors.length === 0;
       emits("valid", valid.value);
       emits("change", event.data);
+      emits("errors", event.errors);
+      Debugger.debug(event.errors);
     };
     const onSubmit = (event) => {
       event.preventDefault();
@@ -1180,10 +1000,8 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1 = { class: "card w-full shadow border-2" };
-const _hoisted_2 = { class: "card-body" };
-const _hoisted_3 = { class: "card-title" };
-const _hoisted_4 = { class: "card-actions flex justify-end" };
+const _hoisted_1 = { class: "card-actions flex justify-between" };
+const _hoisted_2 = { class: "flex justify-end gap-2" };
 const _sfc_main$1 = /* @__PURE__ */ defineComponent({
   __name: "form-with-actions.component",
   props: /* @__PURE__ */ mergeModels({
@@ -1200,23 +1018,33 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
     const properties = __props;
     const valid = ref(false);
     const formData = useModel(__props, "modelValue");
+    const submitted = ref(false);
     const store = new FormStore(properties.formSchema);
     const emits = __emit;
     const save = () => {
+      submitted.value = true;
+      if (!valid.value) {
+        return;
+      }
       store.save(formData.value.id, formData.value).then(() => {
         emits("success");
       });
     };
     const clear = () => {
       formData.value = { id: null };
+      submitted.value = false;
     };
     const onValid = (v) => {
+      submitted.value = false;
       valid.value = v;
     };
+    const title = computed(() => {
+      if (!properties.updateTitle) return properties.createTitle;
+      return formData.value?.id ? properties.updateTitle : properties.createTitle;
+    });
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1, [
-        createElementVNode("div", _hoisted_2, [
-          createElementVNode("h1", _hoisted_3, toDisplayString(formData.value?.id ? __props.updateTitle : __props.createTitle), 1),
+      return openBlock(), createBlock(unref(Collapse), { title: title.value }, {
+        default: withCtx(() => [
           createVNode(_sfc_main$2, {
             id: `form_${properties.id}`,
             modelValue: formData.value,
@@ -1226,29 +1054,41 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
             onValid: _cache[1] || (_cache[1] = ($event) => onValid($event)),
             onSubmit: save
           }, null, 8, ["id", "modelValue", "schema", "uischema"]),
-          createElementVNode("div", _hoisted_4, [
-            createVNode(unref(Btn), {
-              outline: true,
-              onClick: clear
-            }, {
-              default: withCtx(() => [..._cache[2] || (_cache[2] = [
-                createTextVNode(" Clear ", -1)
-              ])]),
-              _: 1
-            }),
-            createVNode(unref(Btn), {
-              color: unref(Color).primary,
-              disabled: !valid.value,
-              onClick: save
-            }, {
-              default: withCtx(() => [..._cache[3] || (_cache[3] = [
-                createTextVNode(" Save ", -1)
-              ])]),
-              _: 1
-            }, 8, ["color", "disabled"])
+          createElementVNode("div", _hoisted_1, [
+            createElementVNode("div", null, [
+              !valid.value && submitted.value ? (openBlock(), createBlock(unref(Alert), {
+                key: 0,
+                message: "The form is not valid",
+                type: "error"
+              })) : createCommentVNode("", true)
+            ]),
+            createElementVNode("div", _hoisted_2, [
+              renderSlot(_ctx.$slots, "actions"),
+              !formData.value.id ? (openBlock(), createBlock(unref(Btn), {
+                key: 0,
+                outline: true,
+                onClick: clear
+              }, {
+                default: withCtx(() => [..._cache[2] || (_cache[2] = [
+                  createTextVNode(" Clear ", -1)
+                ])]),
+                _: 1
+              })) : createCommentVNode("", true),
+              createVNode(unref(Btn), {
+                color: unref(Color).primary,
+                disabled: submitted.value,
+                onClick: save
+              }, {
+                default: withCtx(() => [..._cache[3] || (_cache[3] = [
+                  createTextVNode(" Save ", -1)
+                ])]),
+                _: 1
+              }, 8, ["color", "disabled"])
+            ])
           ])
-        ])
-      ]);
+        ]),
+        _: 3
+      }, 8, ["title"]);
     };
   }
 });
@@ -1373,7 +1213,7 @@ const createRepository = (formSchemaModel, httpRequest, options = {}) => {
   const create = (object, options2) => {
     return httpRequest.post(getDataUri(), object, options2).then((response) => {
       handleSuccess(`Created ${notificationEntity}`);
-      return response;
+      return response.data;
     }).catch((response) => {
       handleError(response, `Failed to create ${notificationEntity}`);
     });
@@ -1381,13 +1221,17 @@ const createRepository = (formSchemaModel, httpRequest, options = {}) => {
   const patch = (id, object, options2) => {
     return httpRequest.patch(getDataUri(id), object, options2).then((response) => {
       handleSuccess(`Saved ${notificationEntity}`);
-      return response;
+      return response.data;
     }).catch((response) => {
       handleError(response, `Failed to save ${notificationEntity}`);
     });
   };
   const get = (id, options2) => {
-    return httpRequest.get(getDataUri(id), options2);
+    return httpRequest.get(getDataUri(id), options2).then((response) => {
+      return response.data;
+    }).catch((response) => {
+      handleError(response, `Failed to load data`);
+    });
   };
   const _delete = (id, options2) => {
     return httpRequest.delete(getDataUri(id), options2).then((response) => {
@@ -1402,7 +1246,7 @@ const createRepository = (formSchemaModel, httpRequest, options = {}) => {
       objects.map((object) => httpRequest.post(getDataUri(), object, options2))
     ).then((response) => {
       handleSuccess(`Created ${notificationEntity}`);
-      return response;
+      return response.data;
     }).catch((response) => {
       handleError(response, `Failed to save ${notificationEntity}`);
     });
@@ -1410,19 +1254,18 @@ const createRepository = (formSchemaModel, httpRequest, options = {}) => {
   return { create, patch, createMulti, delete: _delete, get };
 };
 export {
-  ArrayRenderer,
-  AutocompleteControlRenderer,
-  BooleanControlRenderer,
-  FixedArrayRenderer,
+  _sfc_main$9 as ArrayRenderer,
+  _sfc_main$a as AutocompleteControlRenderer,
+  _sfc_main$g as BooleanControlRenderer,
   _sfc_main$2 as FormComponent,
   _sfc_main as FormModal,
   FormModalService,
   FormStore,
   _sfc_main$1 as FormWithActions,
   _sfc_main$3 as FormWithTableComponent,
-  IntegerControlRenderer,
-  NumberControlRenderer,
-  StringControlRenderer,
+  _sfc_main$f as IntegerControlRenderer,
+  _sfc_main$d as NumberControlRenderer,
+  _sfc_main$c as StringControlRenderer,
   _sfc_main$4 as TableComponent,
   arrayRenderers,
   controlRenderers,
@@ -1430,11 +1273,10 @@ export {
   isArrayRenderer,
   isAutoCompleteControl,
   isCustomControl,
-  isFixedArray,
   isMarkdownControl,
   isStringFormat,
   isTextAreaControl,
   layoutRenderers,
-  MarkdownControlRenderer as markdownControlRenderer,
+  _sfc_main$e as markdownControlRenderer,
   useFormState
 };