@vc-shell/framework 1.1.2 → 1.1.4

package/dist/assets/shared-modules-CDP-H5ZB.js

@@ -1,3588 +0,0 @@
-import { markRaw, ref, computed, watchPostEffect, unref, toValue, readonly, h, reactive, resolveComponent, shallowRef, getCurrentInstance, watch, onMounted, onUnmounted, defineComponent, inject, onBeforeMount, provide, toRefs, createBlock, createCommentVNode, openBlock, withCtx, createElementBlock, createVNode, mergeProps, createSlots, resolveDynamicComponent, createElementVNode, toDisplayString, createTextVNode, renderList, isRef, useSlots, onUpdated, onBeforeUnmount, resolveDirective, withDirectives, Fragment, nextTick } from 'vue';
-import { b as _sfc_main$b } from './ui-indicators-mIQeEqha.js';
-import { A as _sfc_main$8, B as _sfc_main$9, _ as _sfc_main$n } from './ui-media-WWYrwmZw.js';
-import { a as _sfc_main$5, b as _sfc_main$c, _ as _sfc_main$l } from './ui-controls-nmDJYLmC.js';
-import { V as VcCard, a as VcContainer, b as _sfc_main$j, _ as _sfc_main$k } from './ui-layout-v2XBQky3.js';
-import { V as VcHint } from './ui-helpers-CF-EUlOg.js';
-import { b as usePopup, u as useWidgets, d as useBladeNavigation, t as _sfc_main$m, c as usePermissions, i as i18n, n as notification, k as createAppModule } from './ui-navigation-BtHa6ovW.js';
-import { i as useFunctions, f as useLanguages, u as useNotifications, n as useBeforeUnload, j as useAsync, l as useLoading } from './core-composables-DYxpIWyY.js';
-import './ui-app-D31Pr1WY.js';
-import { Field, useForm, useIsFormValid } from 'vee-validate';
-import { a as _sfc_main$e, i as _sfc_main$o } from './ui-content-B7SxH8y9.js';
-import './ui-form-Cs5ooOo7.js';
-import { d as _sfc_main$2, e as _sfc_main$3, c as _sfc_main$6, h as _sfc_main$7, _ as _sfc_main$a, V as VcCheckbox, b as _sfc_main$f, a as _sfc_main$g, f as _sfc_main$h, u as useI18n, J as isEmpty, C as omit, n as merge, K as chunk, l as get, L as has, M as set, j as isEqual, i as cloneDeep, N as findIndex, P as unset, Q as update, R as compact, r as uniqueId, S as findKey, T as every } from './ui-form-fields-DFQi31jT.js';
-import './shared-composables-v9NkNuAe.js';
-import './core-plugins-wv2bDZ0l.js';
-import 'vue-router';
-import './shared-components-CfAt2hC6.js';
-import { a as _sfc_main$4, _ as _sfc_main$i, b as BladeInstance } from './ui-data-Ci3b1ye0.js';
-import { _ as _sfc_main$d } from './ui-media-advanced-T8ibi153.js';
-import { C as toReactive, y as createUnrefFn, t as toValue$1, D as useMounted, r as reactiveComputed, E as reactify, F as toRefs$1 } from './vueuse-CTQm4Zh0.js';
-import { k as kebabToPascal } from './core-utilities-BTktq_a-.js';
-
-const ControlBaseProps = ({
-  rules = void 0,
-  label = void 0,
-  placeholder = void 0,
-  disabled = false,
-  required = false,
-  name = void 0,
-  tooltip = void 0,
-  key = void 0,
-  classNames = void 0,
-  ...rest
-}) => ({
-  key,
-  rules,
-  label,
-  placeholder,
-  disabled,
-  required,
-  name,
-  tooltip,
-  classNames,
-  ...rest
-});
-const MultivalueField$1 = ({ props, slots }) => ({
-  component: markRaw(_sfc_main$6),
-  props: {
-    ...ControlBaseProps(props),
-    ...props
-  },
-  slots
-});
-const SelectField$1 = ({ props, slots }) => ({
-  component: markRaw(_sfc_main$h),
-  props: {
-    ...ControlBaseProps(props),
-    ...props
-  },
-  slots
-});
-const StatusField$1 = ({ props, slots }) => ({
-  component: markRaw(_sfc_main$b),
-  props: {
-    ...ControlBaseProps(props),
-    ...props
-  },
-  slots
-});
-const InputField$1 = ({ props, slots }) => ({
-  component: markRaw(_sfc_main$g),
-  props: {
-    ...ControlBaseProps(props),
-    ...props
-  },
-  slots
-});
-const TextareaField$1 = ({ props }) => ({
-  component: markRaw(_sfc_main$7),
-  props: {
-    ...ControlBaseProps(props),
-    ...props
-  }
-});
-const ContentField$1 = ({ props }) => ({
-  component: markRaw(_sfc_main$a),
-  props: {
-    ...ControlBaseProps(props),
-    ...props
-  }
-});
-const ImageField$1 = ({ props }) => ({
-  component: markRaw(_sfc_main$8),
-  props: {
-    ...ControlBaseProps(props),
-    ...props
-  }
-});
-const VideoField$1 = ({ props }) => ({
-  component: markRaw(_sfc_main$9),
-  props: {
-    ...ControlBaseProps(props),
-    ...props
-  }
-});
-const InputCurrency$1 = ({ props }) => ({
-  component: markRaw(_sfc_main$f),
-  props: {
-    ...ControlBaseProps(props),
-    ...props
-  }
-});
-const CardCollection = ({ props, slots }) => ({
-  component: markRaw(VcCard),
-  props: {
-    ...props,
-    ...ControlBaseProps(props)
-  },
-  slots
-});
-const DynamicProperties = ({ props }) => ({
-  component: markRaw(_sfc_main$i),
-  props: {
-    ...props,
-    ...ControlBaseProps(props)
-  }
-});
-const EditorField$1 = ({ props }) => ({
-  component: markRaw(_sfc_main$e),
-  props: {
-    ...ControlBaseProps(props),
-    ...props
-  }
-});
-const Gallery = ({ props }) => ({
-  component: markRaw(_sfc_main$d),
-  props: {
-    ...ControlBaseProps(props),
-    ...props
-  }
-});
-const Checkbox$1 = ({ props, slots }) => ({
-  component: markRaw(VcCheckbox),
-  props: {
-    ...ControlBaseProps(props),
-    ...props
-  },
-  slots
-});
-const RadioButton = ({ props }) => ({
-  component: markRaw(_sfc_main$2),
-  props: {
-    ...ControlBaseProps(props),
-    ...props
-  }
-});
-const Button$1 = ({ props, slots }) => ({
-  component: markRaw(_sfc_main$c),
-  props: {
-    ...ControlBaseProps(props),
-    ...props
-  },
-  slots
-});
-const Switch = ({ props }) => ({
-  component: markRaw(_sfc_main$5),
-  props: {
-    ...ControlBaseProps(props),
-    ...props
-  }
-});
-const Table$1 = ({ props, slots }) => ({
-  component: markRaw(_sfc_main$4),
-  props: {
-    ...ControlBaseProps(props),
-    ...props
-  },
-  slots
-});
-const Rating = ({ props }) => ({
-  component: markRaw(_sfc_main$3),
-  props: {
-    ...ControlBaseProps(props),
-    ...props
-  }
-});
-
-const useFilterBuilder = (args) => {
-  const _search = args.load;
-  const _data = args.data;
-  const isFilterVisible = ref(true);
-  const filter = ref({});
-  const { t } = useI18n({ useScope: "global" });
-  const controls = ref([]);
-  const appliedFilter = ref({});
-  const activeFilterCount = computed(() => Object.values(appliedFilter.value).filter((item) => !!item).length);
-  const isDisabled = createUnrefFn((filterObj) => {
-    const filterKeys = Object.keys(filterObj);
-    return filterKeys.length === 0 || filterKeys.every((key) => !filterObj[key]);
-  });
-  watchPostEffect(() => {
-    createFilterControls();
-  });
-  function isItemSelected(value, field) {
-    const item = filter.value[field];
-    if (Array.isArray(item) && typeof item !== "string") {
-      return item.some((x) => x === value);
-    } else {
-      return item === value;
-    }
-  }
-  function selectFilterItem(e, value, field, multiple = true) {
-    if (multiple) {
-      filter.value[field] = e ? [...filter.value[field] || [], value] : (filter.value[field] || []).filter((x) => x !== value);
-      if (!filter.value[field].length) filter.value[field] = void 0;
-    } else {
-      filter.value[field] = e ? value : void 0;
-    }
-  }
-  function createFilterControls() {
-    if (!_data?.columns) {
-      isFilterVisible.value = false;
-      return;
-    }
-    controls.value = _data.columns.map((item) => {
-      const ctr = item.controls.reduce(
-        (obj, control) => {
-          if (control.component === "vc-checkbox") {
-            const filterData = control.data;
-            const filterDataFromScope = unref(args.scope)?.[filterData] ?? [];
-            const fields = createCheckboxFromData(filterDataFromScope, control);
-            if (fields) {
-              obj[control.field] = {
-                fields,
-                label: computed(() => t(control.label ?? "")),
-                tooltip: computed(() => t(control.tooltip ?? ""))
-              };
-            }
-          }
-          if (control.component === "vc-input") {
-            obj[control.field] = {
-              fields: {
-                [control.field]: createInput(control)
-              }
-            };
-          }
-          if (control.component === "vc-switch") {
-            const filterData = control.data;
-            const filterDataFromScope = unref(args.scope)?.[filterData] ?? [];
-            const fields = createSwitchFromData(filterDataFromScope, control);
-            if (fields) {
-              obj[control.field] = {
-                fields
-              };
-            }
-          }
-          if (control.component === "vc-select") {
-            const filterData = control.data;
-            const filterDataFromScope = unref(args.scope)?.[filterData] ?? [];
-            const fields = createSelectFromData(filterDataFromScope, control);
-            if (fields) {
-              obj[control.field] = {
-                fields
-              };
-            }
-          }
-          if (control.component === "vc-radio-button-group") {
-            const filterData = control.data;
-            const filterDataFromScope = unref(args.scope)?.[filterData] ?? [];
-            const fields = createRadioButtonGroupFromData(filterDataFromScope, control);
-            if (fields) {
-              obj[control.field] = {
-                fields,
-                label: computed(() => t(control.label ?? "")),
-                tooltip: computed(() => t(control.tooltip ?? ""))
-              };
-            }
-          }
-          return obj;
-        },
-        {}
-      );
-      return {
-        title: item.title ?? "",
-        fields: ctr
-      };
-    });
-  }
-  function createRadioButtonGroupFromData(data, control) {
-    if (!(toValue(data) && toValue(data).length)) return;
-    return toValue(data).reduce(
-      (obj, currC) => {
-        obj[currC[control.optionValue]] = {
-          ...RadioButton({
-            props: {
-              class: "tw-mb-2",
-              value: currC[control.optionValue],
-              label: currC[control.optionLabel],
-              modelValue: computed(() => filter.value[control.field]),
-              "onUpdate:modelValue": (e) => {
-                filter.value[control.field] = e;
-              }
-            }
-          })
-        };
-        return obj;
-      },
-      {}
-    );
-  }
-  function createSelectFromData(data, control) {
-    if (!(toValue(data) && toValue(data).length)) return;
-    return {
-      [control.field]: SelectField$1({
-        props: {
-          class: "tw-mb-2",
-          label: computed(() => t(control.label ?? "")),
-          tooltip: computed(() => t(control.tooltip ?? "")),
-          options: toValue(data),
-          multiple: control.multiple,
-          optionLabel: control.optionLabel,
-          optionValue: control.optionValue,
-          clearable: false,
-          modelValue: computed(() => filter.value[control.field]),
-          "onUpdate:modelValue": (e) => {
-            if (Array.isArray(e) && e.length === 0) {
-              filter.value[control.field] = void 0;
-              return;
-            }
-            filter.value[control.field] = e;
-          }
-        }
-      })
-    };
-  }
-  function createSwitchFromData(data, control) {
-    if (!(toValue(data) && toValue(data).length)) return;
-    return toValue(data).reduce(
-      (obj, currC) => {
-        obj[currC[control.optionValue]] = Switch({
-          props: {
-            class: "tw-mb-2",
-            label: toValue(currC[control.optionLabel]),
-            tooltip: computed(() => t(control.tooltip ?? "")),
-            modelValue: computed(() => isItemSelected(currC[control.optionValue], control.field)),
-            "onUpdate:modelValue": (e) => selectFilterItem(e, currC[control.optionValue], control.field, control.multiple)
-          }
-        });
-        return obj;
-      },
-      {}
-    );
-  }
-  function createCheckboxFromData(data, control) {
-    if (!(toValue(data) && toValue(data).length)) return;
-    return toValue(data).reduce(
-      (obj, currC) => {
-        obj[currC[control.optionValue]] = {
-          ...Checkbox$1({
-            props: {
-              class: "tw-mb-2",
-              modelValue: computed(() => isItemSelected(currC[control.optionValue], control.field)),
-              "onUpdate:modelValue": (e) => selectFilterItem(e, currC[control.optionValue], control.field, control.multiple)
-            },
-            slots: {
-              default: () => toValue(currC[control.optionLabel])
-            }
-          })
-        };
-        return obj;
-      },
-      {}
-    );
-  }
-  function createInput(control) {
-    return InputField$1({
-      props: {
-        type: "date",
-        class: "tw-mb-3",
-        label: toValue(computed(() => t(control.label ?? ""))),
-        tooltip: toValue(computed(() => t(control.tooltip ?? ""))),
-        modelValue: computed(() => filter.value[control.field]),
-        "onUpdate:modelValue": (e) => filter.value[control.field] = e
-      }
-    });
-  }
-  async function applyFilters(filterHandlerFn) {
-    appliedFilter.value = {
-      ...filter.value
-    };
-    filterHandlerFn();
-    await _search({
-      ...omit(unref(args.query), "skip"),
-      ...filter.value
-    });
-  }
-  async function resetFilters(filterHandlerFn) {
-    filterHandlerFn();
-    await reset();
-    await _search({
-      ...unref(args.query),
-      ...filter.value
-    });
-  }
-  function render(slotMethods) {
-    if (isEmpty(controls.value)) return;
-    return h(
-      VcContainer,
-      {
-        noPadding: true,
-        onVnodeBeforeMount: () => {
-          filter.value = { ...appliedFilter.value };
-        }
-      },
-      () => [
-        h(
-          _sfc_main$j,
-          () => Object.values(controls.value).map(({ title, fields }) => {
-            return h(_sfc_main$k, { class: "tw-px-5 tw-py-[10px]" }, () => [
-              title ? h(
-                "div",
-                { class: "tw-mb-4 tw-text-[color:var(--secondary-500)] tw-font-bold tw-text-[17px]" },
-                unref(computed(() => t(title)))
-              ) : void 0,
-              Object.values(fields)?.map((items) => {
-                return items.label ? h(
-                  _sfc_main$l,
-                  {
-                    class: "tw-mb-2"
-                  },
-                  {
-                    default: () => items.label,
-                    tooltip: items.tooltip ? () => items.tooltip : void 0
-                  }
-                ) : void 0;
-              }),
-              Object.values(fields)?.map((items) => {
-                return Object.values(items.fields).map((item) => {
-                  if ("component" in item && item.component) {
-                    return [
-                      h(
-                        item.component,
-                        { ...item.props, class: item.props.class },
-                        "slots" in item && item.slots ? { ...item.slots } : {}
-                      )
-                    ];
-                  } else {
-                    return item;
-                  }
-                });
-              })
-            ]);
-          })
-        ),
-        h(
-          _sfc_main$j,
-          () => h(
-            _sfc_main$k,
-            {
-              class: "tw-px-5 tw-py-[10px] !tw-flex-auto tw-border-t tw-border-solid tw-border-[var(--neutrals-200)]"
-            },
-            () => h("div", { class: "tw-flex tw-justify-start" }, [
-              h(
-                _sfc_main$c,
-                {
-                  class: "tw-mr-4",
-                  small: true,
-                  disabled: isDisabled(filter),
-                  onClick: () => applyFilters(slotMethods.close)
-                },
-                () => t("COMPONENTS.FILTERS.APPLY")
-              ),
-              h(
-                _sfc_main$c,
-                {
-                  outline: true,
-                  small: true,
-                  disabled: isDisabled(appliedFilter),
-                  onClick: () => resetFilters(slotMethods.close)
-                },
-                () => t("COMPONENTS.FILTERS.RESET")
-              )
-            ])
-          )
-        )
-      ]
-    );
-  }
-  async function reset() {
-    Object.keys(filter.value).forEach((key) => filter.value[key] = void 0);
-    appliedFilter.value = {};
-  }
-  return {
-    filterComponent: render,
-    activeFilterCount,
-    filter: readonly(toReactive(filter)),
-    isFilterVisible: computed(() => isFilterVisible.value),
-    reset
-  };
-};
-
-const useTableTemplates = (tableSchema) => {
-  const tableTemplates = reactive({
-    templateOverrideComponents: templateOverrideComponents(),
-    mobileView: resolveTemplateComponent("mobileTemplate"),
-    notFound: resolveTemplateComponent("notFoundTemplate"),
-    empty: resolveTemplateComponent("emptyTemplate"),
-    footer: resolveTemplateComponent("footerTemplate"),
-    header: resolveTemplateComponent("headerTemplate")
-  });
-  function resolveTemplateComponent(name) {
-    if (!toValue(tableSchema)) return;
-    const value = toValue(tableSchema)?.[name];
-    if (value && typeof value === "object" && "component" in value) {
-      const componentName = value.component;
-      if (componentName) {
-        const component = resolveComponent(componentName);
-        if (component && typeof component !== "string") return shallowRef(component);
-      }
-    }
-  }
-  function templateOverrideComponents() {
-    return {
-      ...toValue(tableSchema)?.columns?.reduce(
-        (acc, curr) => {
-          if ("customTemplate" in curr && curr.customTemplate) {
-            if (!("component" in curr.customTemplate)) {
-              throw new Error(
-                `Component name must be provided in 'customTemplate' property, column: ${JSON.stringify(curr)}`
-              );
-            } else if ("component" in curr.customTemplate && curr.customTemplate.component) {
-              const component = resolveComponent(curr.customTemplate.component);
-              if (typeof component !== "string") {
-                acc[curr.id] = shallowRef(component);
-              }
-            }
-          }
-          return acc;
-        },
-        {}
-      )
-    };
-  }
-  return {
-    tableTemplates
-  };
-};
-
-const useToolbarReducer = (args) => {
-  if (!args) return;
-  const { t } = useI18n({ useScope: "global" });
-  const toolbarMethodsMerge = merge(
-    ref({}),
-    ref(args.defaultToolbarBindings),
-    ref(toValue$1(args.customToolbarConfig))
-  );
-  return computed(() => {
-    if (args.defaultToolbarSchema?.length !== 0) {
-      return args.defaultToolbarSchema?.reduce((acc, curr) => {
-        const toolbarItemCtx = toolbarMethodsMerge.value[curr.method];
-        if (toolbarItemCtx && Array.isArray(toolbarItemCtx)) {
-          return acc.concat(
-            toolbarItemCtx.map((item) => {
-              return {
-                ...curr,
-                ...item,
-                title: t(curr.title || unref(item.title ?? ""))
-              };
-            })
-          );
-        }
-        if (toolbarItemCtx && typeof toolbarItemCtx === "object") {
-          const context = typeof toolbarItemCtx === "function" ? {
-            clickHandler: async () => await toolbarItemCtx(args.context)
-          } : {
-            ...toolbarItemCtx,
-            clickHandler() {
-              return toolbarItemCtx.clickHandler?.call(null, args.context);
-            }
-          };
-          acc.push({
-            ...curr,
-            ...context,
-            icon: curr.icon || toolbarItemCtx.icon,
-            title: t(curr.title || unref(toolbarItemCtx.title ?? ""))
-          });
-        }
-        return acc;
-      }, []);
-    }
-    return [];
-  });
-};
-
-const index = () => {
-  const instance = getCurrentInstance();
-  function getBladeExposedData() {
-    const reactiveBlade = ref(null);
-    const blade = ref(instance?.vnode);
-    let unwatch = null;
-    const updateReactiveBlade = () => {
-      if (blade.value && blade.value.props?.navigation?.instance) {
-        reactiveBlade.value = blade.value.props.navigation.instance;
-      }
-    };
-    unwatch = watch(blade, updateReactiveBlade, { immediate: true, deep: true });
-    onMounted(() => {
-      updateReactiveBlade();
-    });
-    onUnmounted(() => {
-      if (unwatch) {
-        unwatch();
-      }
-    });
-    return reactiveBlade;
-  }
-  return {
-    getBladeExposedData
-  };
-};
-
-function safeIn(key, obj) {
-  return key in obj;
-}
-
-const _hoisted_1$1 = {
-  key: 0,
-  class: "tw-p-4"
-};
-const _hoisted_2$1 = {
-  key: 1,
-  class: "tw-w-full tw-h-full tw-box-border tw-flex tw-flex-col tw-items-center tw-justify-center"
-};
-const _hoisted_3$1 = { class: "tw-m-4 tw-text-xl tw-font-medium" };
-const _hoisted_4$1 = {
-  key: 1,
-  class: "tw-w-full tw-h-full tw-box-border tw-flex tw-flex-col tw-items-center tw-justify-center"
-};
-const _hoisted_5 = { class: "tw-m-4 tw-text-xl tw-font-medium" };
-const _sfc_main$1 = /* @__PURE__ */ defineComponent({
-  __name: "dynamic-blade-list",
-  props: {
-    expanded: { type: Boolean, default: true },
-    closable: { type: Boolean, default: true },
-    param: { default: void 0 },
-    options: {},
-    model: {},
-    composables: {},
-    mixinFn: {}
-  },
-  emits: ["parent:call", "close:blade", "collapse:blade", "expand:blade", "close:children"],
-  setup(__props, { expose: __expose, emit: __emit }) {
-    const props = __props;
-    const { t } = useI18n({ useScope: "global" });
-    const { showConfirmation } = usePopup();
-    const { debounce } = useFunctions();
-    const widgetService = useWidgets();
-    const emit = __emit;
-    const settings = computed(() => props.model?.settings);
-    const localizationPrefix = computed(() => settings.value?.localizationPrefix.trim().toUpperCase());
-    const title = computed(() => t(settings.value?.titleTemplate));
-    const allSelected = ref(false);
-    const searchValue = ref();
-    const selectedItemId = shallowRef();
-    const sort = shallowRef();
-    const selectedIds = shallowRef([]);
-    const itemsProxy = ref();
-    const isMixinReady = ref(false);
-    inject(BladeInstance);
-    const { setNavigationQuery, getNavigationQuery } = useBladeNavigation();
-    const tableData = props.composables && computed(() => props.model?.content.find((type) => type.component === "vc-table"));
-    const tableColsWithLocales = tableData?.value?.columns?.map((col) => ({
-      ...col,
-      title: computed(() => t(col.title))
-    }));
-    const stateKey = props.composables && computed(() => {
-      if (tableData?.value?.id) {
-        return tableData.value?.id;
-      }
-      throw new Error('Table id is not defined. Please provide "id" property in table schema');
-    });
-    if (typeof props.composables?.[props.model?.settings?.composable ?? ""] === "undefined") {
-      throw new Error(`Composable ( ${props.model?.settings?.composable} ) is not defined`);
-    }
-    let { load, remove, items, loading, pagination, query, scope } = props.composables ? props.composables?.[props.model?.settings?.composable ?? ""]({
-      emit,
-      props,
-      mounted: useMounted()
-    }) : {
-      load: ref(true),
-      remove: void 0,
-      items: void 0,
-      loading: void 0,
-      pagination: void 0,
-      query: void 0,
-      scope: void 0
-    };
-    if (props.mixinFn?.length) {
-      const mixinResults = props.mixinFn?.map((mixin) => mixin({ loading, items, scope, load, remove, query }));
-      const mergedResults = mixinResults.reduce((acc, result) => {
-        return {
-          ...acc,
-          ...result
-        };
-      }, {});
-      loading = mergedResults.loading ?? loading;
-      items = mergedResults.items ?? items;
-      scope = mergedResults.scope ?? scope;
-      load = mergedResults.load ?? load;
-      remove = mergedResults.remove ?? remove;
-      query = mergedResults.query ?? query;
-      isMixinReady.value = true;
-    } else {
-      isMixinReady.value = true;
-    }
-    const isBladeEditable = computed(
-      () => "disabled" in toValue(scope || {}) ? !toValue(toValue(scope || {})?.disabled) : false
-    );
-    const selection = computed(() => {
-      const tableConfig2 = toValue(scope)?.tableConfigComputed;
-      if (tableConfig2 && "selectedIds" in tableConfig2) {
-        return items.value?.filter((item) => tableConfig2.selectedIds?.includes(item.id)) || [];
-      }
-      return [];
-    });
-    sort.value = query.value.sort ?? "createdDate:DESC";
-    const unreffedScope = reactiveComputed(() => toValue(scope) ?? {});
-    const filterDisable = computed(() => {
-      if (tableData?.value?.filter?.disabled?.method) {
-        const disableFilterMethod = toValue(unreffedScope)?.[tableData?.value?.filter?.disabled.method];
-        if (disableFilterMethod && typeof disableFilterMethod === "function") {
-          return disableFilterMethod();
-        } else {
-          return toValue(disableFilterMethod);
-        }
-      }
-      return false;
-    });
-    const { tableTemplates } = useTableTemplates(tableData);
-    const calculateColumns = (columns) => {
-      const result = columns?.map((column) => {
-        if (typeof column.visible !== "boolean" && column.visible?.method) {
-          const result2 = typeof scope?.value[column.visible?.method] === "function" ? scope?.value[column.visible?.method]() : scope?.value[column.visible?.method];
-          column.visible = result2;
-        }
-        return column;
-      });
-      return result;
-    };
-    const table = props.composables && computed(() => {
-      const tableScope = {
-        columns: calculateColumns(tableData?.value?.columns)
-      };
-      return tableScope;
-    });
-    const bladeOptions = reactive({
-      tableData,
-      table
-    });
-    const {
-      filterComponent,
-      activeFilterCount,
-      isFilterVisible,
-      reset: resetFilters,
-      filter
-    } = useFilterBuilder({
-      data: bladeOptions.tableData?.filter,
-      query,
-      load,
-      scope
-    });
-    const bladeContext = ref({
-      load,
-      remove,
-      items: computed(() => itemsProxy.value ?? []),
-      loading,
-      pagination,
-      query,
-      scope,
-      selectedIds: computed(() => selectedIds.value),
-      settings
-    });
-    const toolbarComputed = (props.composables && useToolbarReducer({
-      defaultToolbarSchema: settings.value?.toolbar ?? [],
-      defaultToolbarBindings: {
-        openAddBlade: {
-          async clickHandler() {
-            if (scope && "openDetailsBlade" in toValue(unreffedScope) && toValue(unreffedScope).openDetailsBlade && typeof toValue(unreffedScope).openDetailsBlade === "function") {
-              toValue(unreffedScope).openDetailsBlade?.();
-            } else throw new Error("openDetailsBlade method is not defined in scope");
-          }
-        },
-        refresh: {
-          async clickHandler() {
-            await reload();
-          }
-        },
-        removeItems: {
-          async clickHandler() {
-            await removeItems();
-          },
-          disabled: computed(() => !selectedIds.value?.length)
-          // isVisible: computed(() => isDesktop.value),
-        }
-      },
-      customToolbarConfig: toValue(unreffedScope)?.toolbarOverrides,
-      context: bladeContext.value
-    })) ?? [];
-    onBeforeMount(async () => {
-      if (props.composables && isMixinReady.value)
-        await load({
-          sort: sort.value,
-          ...query.value,
-          ...getNavigationQuery()
-        });
-    });
-    watch(
-      () => toValue(toValue(scope)?.tableConfigComputed)?.searchValue,
-      (newVal) => {
-        searchValue.value = newVal;
-      },
-      {
-        immediate: true
-      }
-    );
-    watch(
-      () => props.param,
-      async (newVal) => {
-        selectedItemId.value = unref(newVal);
-      },
-      { immediate: true }
-    );
-    watch(sort, async (value) => {
-      await load({ ...query.value, sort: value });
-    });
-    watch(items, (newVal) => {
-      itemsProxy.value = newVal;
-    });
-    const onEditComplete = (data) => {
-      const item = itemsProxy.value?.[data.index];
-      if (item) {
-        item[data.event.field] = data.event.value;
-      }
-    };
-    const onCellBlur = async (data) => {
-      const column = tableData?.value?.columns?.find((col) => col.id === data.field);
-      if (column && column.onCellBlur && column.onCellBlur.method) {
-        if (scope && toValue(unreffedScope)?.[column.onCellBlur.method] && typeof toValue(unreffedScope)[column.onCellBlur.method] === "function") {
-          await toValue(unreffedScope)[column.onCellBlur.method](data);
-        }
-      }
-    };
-    const openDetailsBlade = async () => {
-      if (scope && "openDetailsBlade" in toValue(unreffedScope) && toValue(unreffedScope).openDetailsBlade && typeof toValue(unreffedScope).openDetailsBlade === "function") {
-        await toValue(unreffedScope).openDetailsBlade?.();
-      }
-    };
-    const onItemClick = (item) => {
-      if (scope && safeIn("onListItemClick", toValue(unreffedScope)) && typeof toValue(unreffedScope).onListItemClick === "function") {
-        toValue(unreffedScope).onListItemClick?.({
-          item,
-          onOpen() {
-            selectedItemId.value = item.id;
-          },
-          onClose() {
-            selectedItemId.value = void 0;
-          }
-        });
-      } else if (scope && safeIn("openDetailsBlade", toValue(unreffedScope)) && typeof toValue(unreffedScope).openDetailsBlade === "function") {
-        toValue(unreffedScope).openDetailsBlade?.({
-          param: item.id,
-          onOpen() {
-            selectedItemId.value = item.id;
-          },
-          onClose() {
-            selectedItemId.value = void 0;
-          }
-        });
-      }
-    };
-    const onSelectionChanged = (i) => {
-      const item = unref(i).map((item2) => item2.id).filter((x) => x !== null);
-      selectedIds.value = item;
-    };
-    async function removeItems() {
-      if (await showConfirmation(
-        t(
-          `${settings.value?.localizationPrefix.trim().toUpperCase()}.PAGES.ALERTS.DELETE_SELECTED_CONFIRMATION.MESSAGE`,
-          {
-            count: allSelected.value ? t(
-              `${settings.value?.localizationPrefix.trim().toUpperCase()}.PAGES.ALERTS.DELETE_SELECTED_CONFIRMATION.ALL`,
-              {
-                totalCount: pagination.value.totalCount
-              }
-            ) : selectedIds.value.length
-          }
-        )
-      )) {
-        emit("close:children");
-        if (remove) await remove({ allSelected: allSelected.value, ids: selectedIds.value });
-        if (query.value.skip && query.value.take) {
-          if (query.value.skip >= query.value.take) {
-            if (allSelected.value) {
-              query.value.skip = 0;
-            } else {
-              query.value.skip -= query.value.take;
-            }
-          }
-        }
-        widgetService.updateActiveWidget();
-        await reload();
-      }
-    }
-    const reload = async () => {
-      selectedIds.value = [];
-      if (query.value.take) {
-        await load({
-          ...query.value,
-          skip: (pagination.value.currentPage - 1) * query.value.take,
-          sort: sort.value
-        });
-      }
-    };
-    const onPaginationClick = async (page) => {
-      if (query.value.take) {
-        if (scope && safeIn("onPaginationClick", toValue(unreffedScope)) && typeof toValue(unreffedScope).onPaginationClick === "function") {
-          toValue(unreffedScope).onPaginationClick?.({
-            ...query.value,
-            skip: (page - 1) * query.value.take
-          });
-          return;
-        }
-        const queryObj = {
-          ...query.value,
-          skip: (page - 1) * query.value.take
-        };
-        setNavigationQuery(queryObj);
-        await load(queryObj);
-      }
-    };
-    const onHeaderClick = (item) => {
-      const sortOptions = ["DESC", "ASC", ""];
-      if (item.sortable) {
-        if (sort.value.split(":")[0] === item.id) {
-          const index = sortOptions.findIndex((x) => {
-            const sorting = sort.value.split(":")[1];
-            if (sorting) {
-              return x === sorting;
-            } else {
-              return x === "";
-            }
-          });
-          if (index !== -1) {
-            const newSort = sortOptions[(index + 1) % sortOptions.length];
-            if (newSort === "") {
-              sort.value = `${item.id}`;
-            } else {
-              sort.value = `${item.id}:${newSort}`;
-            }
-          }
-        } else {
-          sort.value = `${item.id}:${sortOptions[0]}`;
-        }
-      }
-    };
-    const onSearchList = debounce(async (keyword) => {
-      searchValue.value = keyword;
-      await load({
-        ...query.value,
-        keyword
-      });
-    }, 1e3);
-    async function resetSearch() {
-      searchValue.value = "";
-      await resetFilters();
-      await load({
-        ...query.value,
-        ...filter,
-        keyword: ""
-      });
-    }
-    function sortRows(event) {
-      if (event.dragIndex !== event.dropIndex) {
-        const sorted = event.value.map((item, index) => {
-          item.sortOrder = index;
-          return item;
-        });
-        itemsProxy.value = sorted;
-      }
-    }
-    async function handleSelectAllItems(all) {
-      allSelected.value = all;
-    }
-    function disabledActionHandler(disabled, item) {
-      if (!disabled) return false;
-      if (typeof disabled === "boolean") return disabled;
-      else if (disabled.method && typeof toValue(unreffedScope)?.[disabled.method] === "function")
-        return toValue(unreffedScope)?.[disabled.method]({ item });
-      else if (disabled.method && toValue(unreffedScope)?.[disabled.method])
-        return toValue(unreffedScope)?.[disabled.method];
-      return false;
-    }
-    function actionBuilder(item) {
-      const result = tableData?.value?.actions?.reduce((arr, action) => {
-        const isDisabled = disabledActionHandler(action?.disabled ?? false, item);
-        if (!toValue(isDisabled)) {
-          arr.push({
-            icon: action.icon,
-            title: computed(() => t(action.title)),
-            type: action.type,
-            clickHandler: async (itemVal) => {
-              try {
-                if (isRef(toolbarComputed) && toolbarComputed.value && toolbarComputed.value.length > 0) {
-                  const toolbarItem = toolbarComputed.value.find(
-                    (x) => ("method" in x && x.method === action.method) ?? false
-                  );
-                  selectedIds.value = [itemVal.id];
-                  if (toolbarItem) {
-                    await toolbarItem.clickHandler?.();
-                  } else {
-                    await toValue(unreffedScope)?.[action.method]?.(itemVal);
-                    selectedIds.value = [];
-                  }
-                }
-              } catch (error) {
-                throw new Error(`Method ${action.method} is not defined in scope or toolbarOverrides`);
-              }
-            }
-          });
-        }
-        return arr;
-      }, []);
-      return result;
-    }
-    const tableConfig = computed(() => {
-      return {
-        loading: loading.value,
-        columns: tableColsWithLocales ?? [],
-        stateKey: stateKey?.value ?? "",
-        items: itemsProxy.value ?? [],
-        multiselect: tableData?.value?.multiselect,
-        header: tableData?.value?.header,
-        itemActionBuilder: actionBuilder,
-        editing: isBladeEditable.value,
-        enableItemActions: !!tableData?.value?.actions,
-        footer: tableData?.value?.footer,
-        sort: sort.value,
-        pages: pagination.value?.pages,
-        currentPage: pagination.value?.currentPage,
-        searchValue: searchValue.value,
-        selectedItemId: selectedItemId.value,
-        totalCount: pagination.value?.totalCount,
-        reorderableRows: tableData?.value?.reorderableRows,
-        pullToReload: true,
-        selectAll: tableData?.value?.selectAll,
-        paginationVariant: tableData?.value?.paginationVariant,
-        selectionItems: selection.value,
-        onItemClick,
-        onPaginationClick,
-        onSelectionChanged,
-        onHeaderClick,
-        "onScroll:ptr": reload,
-        "onSearch:change": onSearchList,
-        "onRow:reorder": sortRows,
-        "onSelect:all": handleSelectAllItems,
-        onEditComplete,
-        onCellBlur,
-        noHeaderCheckbox: tableData?.value?.noHeaderCheckbox
-      };
-    });
-    const tableConfigComputed = computed(() => {
-      if (scope && "tableConfig" in toValue(scope) && typeof toValue(scope)?.tableConfig === "function") {
-        const initialTableConfig = toReactive(tableConfig.value);
-        const scopeTableConfig = toValue(scope)?.tableConfig?.(initialTableConfig);
-        const res = {
-          ...initialTableConfig,
-          ...scopeTableConfig
-        };
-        if (scopeTableConfig?.columns?.length) {
-          res.columns = scopeTableConfig.columns;
-        }
-        return res;
-      }
-      return tableConfig.value;
-    });
-    provide("bladeContext", toReactive(bladeContext));
-    provide("isBladeEditable", isBladeEditable);
-    __expose({
-      reload,
-      title,
-      // updateActiveWidgetCount,
-      ...toRefs(toValue(unreffedScope) ?? {}),
-      selectedIds,
-      settings: toValue(settings)
-    });
-    return (_ctx, _cache) => {
-      const _component_VcBreadcrumbs = resolveComponent("VcBreadcrumbs");
-      const _component_VcButton = resolveComponent("VcButton");
-      const _component_VcTable = resolveComponent("VcTable");
-      const _component_VcBlade = resolveComponent("VcBlade");
-      return !_ctx.composables ? (openBlock(), createBlock(_component_VcBlade, {
-        key: 0,
-        expanded: _ctx.expanded,
-        closable: _ctx.closable,
-        width: settings.value?.width || "50%",
-        "toolbar-items": unref(toolbarComputed),
-        title: title.value,
-        modified: unref(unreffedScope)?.modified,
-        onClose: _cache[0] || (_cache[0] = ($event) => _ctx.$emit("close:blade")),
-        onExpand: _cache[1] || (_cache[1] = ($event) => _ctx.$emit("expand:blade")),
-        onCollapse: _cache[2] || (_cache[2] = ($event) => _ctx.$emit("collapse:blade"))
-      }, {
-        default: withCtx(() => [
-          toValue(unref(scope)?.breadcrumbs)?.length ? (openBlock(), createElementBlock("div", _hoisted_1$1, [
-            createVNode(_component_VcBreadcrumbs, {
-              items: toValue(unref(scope)?.breadcrumbs),
-              variant: "light",
-              separated: ""
-            }, null, 8, ["items"])
-          ])) : createCommentVNode("", true),
-          createVNode(_component_VcTable, mergeProps({ class: "tw-grow tw-basis-0" }, tableConfigComputed.value, {
-            expanded: _ctx.expanded,
-            "total-label": _ctx.$t(`${localizationPrefix.value}.PAGES.LIST.TABLE.TOTALS`),
-            "active-filter-count": unref(activeFilterCount),
-            "disable-filter": filterDisable.value
-          }), createSlots({
-            notfound: withCtx(() => [
-              unref(tableTemplates)?.notFound ? (openBlock(), createBlock(resolveDynamicComponent(unref(tableTemplates).notFound), {
-                key: 0,
-                context: bladeContext.value,
-                onReset: resetSearch
-              }, null, 40, ["context"])) : (openBlock(), createElementBlock("div", _hoisted_2$1, [
-                createElementVNode("div", _hoisted_3$1, toDisplayString(_ctx.$t(`${localizationPrefix.value}.PAGES.LIST.NOT_FOUND.EMPTY`)), 1),
-                unref(isFilterVisible) ? (openBlock(), createBlock(_component_VcButton, {
-                  key: 0,
-                  onClick: resetSearch
-                }, {
-                  default: withCtx(() => [
-                    createTextVNode(toDisplayString(_ctx.$t(`${localizationPrefix.value}.PAGES.LIST.NOT_FOUND.RESET`)), 1)
-                  ]),
-                  _: 1
-                })) : createCommentVNode("", true)
-              ]))
-            ]),
-            empty: withCtx(() => [
-              unref(tableTemplates)?.empty ? (openBlock(), createBlock(resolveDynamicComponent(unref(tableTemplates).empty), {
-                key: 0,
-                context: bladeContext.value,
-                onAdd: openDetailsBlade
-              }, null, 40, ["context"])) : (openBlock(), createElementBlock("div", _hoisted_4$1, [
-                createElementVNode("div", _hoisted_5, toDisplayString(_ctx.$t(`${localizationPrefix.value}.PAGES.LIST.EMPTY.NO_ITEMS`)), 1)
-              ]))
-            ]),
-            _: 2
-          }, [
-            unref(isFilterVisible) && bladeOptions.tableData?.filter ? {
-              name: "filters",
-              fn: withCtx(({ closePanel }) => [
-                createVNode(unref(filterComponent), { close: closePanel }, null, 8, ["close"])
-              ]),
-              key: "0"
-            } : void 0,
-            renderList(unref(tableTemplates)?.templateOverrideComponents, (component, key, index) => {
-              return {
-                name: `item_${key}`,
-                fn: withCtx((itemData) => [
-                  (openBlock(), createBlock(resolveDynamicComponent(component), {
-                    context: itemData,
-                    "blade-context": bladeContext.value
-                  }, null, 8, ["context", "blade-context"]))
-                ])
-              };
-            }),
-            unref(tableTemplates)?.header ? {
-              name: "header",
-              fn: withCtx((headerData) => [
-                (openBlock(), createBlock(resolveDynamicComponent(unref(tableTemplates).header), {
-                  context: headerData,
-                  "blade-context": bladeContext.value
-                }, null, 8, ["context", "blade-context"]))
-              ]),
-              key: "1"
-            } : void 0,
-            unref(tableTemplates)?.footer ? {
-              name: "footer",
-              fn: withCtx((footerData) => [
-                (openBlock(), createBlock(resolveDynamicComponent(unref(tableTemplates).footer), {
-                  context: footerData,
-                  "blade-context": bladeContext.value
-                }, null, 8, ["context", "blade-context"]))
-              ]),
-              key: "2"
-            } : void 0,
-            unref(tableTemplates)?.mobileView ? {
-              name: "mobile-item",
-              fn: withCtx((itemData) => [
-                (openBlock(), createBlock(resolveDynamicComponent(unref(tableTemplates).mobileView), {
-                  context: itemData,
-                  "blade-context": bladeContext.value
-                }, null, 8, ["context", "blade-context"]))
-              ]),
-              key: "3"
-            } : void 0
-          ]), 1040, ["expanded", "total-label", "active-filter-count", "disable-filter"])
-        ]),
-        _: 1
-      }, 8, ["expanded", "closable", "width", "toolbar-items", "title", "modified"])) : createCommentVNode("", true);
-    };
-  }
-});
-
-const componentProps = {
-  baseProps: {
-    type: Object,
-    default: () => ({})
-  },
-  element: {
-    type: Object,
-    default: () => ({})
-  },
-  bladeContext: {
-    type: Object,
-    default: () => ({})
-  },
-  fields: {
-    type: Object,
-    default: () => ({})
-  },
-  formData: {
-    type: Object,
-    default: () => ({})
-  },
-  fieldContext: {
-    type: Object
-  },
-  currentLocale: {
-    type: String
-  },
-  elIndex: {
-    type: Number
-  },
-  rows: {
-    type: Number
-  }
-};
-
-const validationFieldProps = {
-  props: Object,
-  index: Number,
-  rows: Number
-};
-const ValidationField = defineComponent({
-  name: "ValidationField",
-  props: validationFieldProps,
-  setup(props) {
-    const slots = useSlots();
-    const fieldKey = computed(
-      () => unref(props.props)?.multilanguage ? `${String(props.props?.key)}_${unref(props.props?.currentLanguage)}` : String(props.props?.key)
-    );
-    const fieldNameLang = reactify((name) => {
-      return props.props?.multilanguage ? name + "_" + props.props.currentLanguage : name;
-    });
-    return () => h(
-      Field,
-      {
-        rules: props.props?.rules,
-        modelValue: props.props?.modelValue,
-        label: props.props?.label,
-        key: fieldKey.value,
-        name: fieldNameLang(
-          (props.rows ?? 1) > 1 && (props.index ?? 0) >= 0 ? props.props?.name + "_" + props.index : props.props?.name
-        ).value
-      },
-      {
-        default: ({ errorMessage, errors }) => {
-          return slots.default?.().map(
-            (slot) => h(slot, {
-              ...props.props,
-              error: !!errors.length,
-              errorMessage,
-              key: fieldKey.value + "_control"
-            })
-          );
-        }
-      }
-    );
-  }
-});
-
-function unrefNested(field) {
-  const unreffedProps = {};
-  if (field) {
-    Object.keys(field).forEach((key) => {
-      unreffedProps[key] = unref(field[key]);
-    });
-    return unreffedProps;
-  }
-  return field;
-}
-
-const SelectField = {
-  name: "SelectField",
-  props: componentProps,
-  setup(props) {
-    return () => {
-      const field = SelectField$1({
-        props: Object.assign(
-          {},
-          {
-            optionValue: props.element.optionValue,
-            optionLabel: props.element.optionLabel,
-            emitValue: props.element.emitValue,
-            mapOptions: props.element.mapOptions,
-            options: props.bladeContext.scope?.[props.element.optionsMethod],
-            currentLanguage: props.currentLocale,
-            clearable: props.element.clearable || false,
-            searchable: props.element.searchable || false,
-            multiple: props.element.multiple || false
-          },
-          unrefNested(props.baseProps),
-          {
-            class: unrefNested(props.baseProps).classNames ?? ""
-          }
-        ),
-        slots: props.element.customTemplate && ["selected-item", "option"].reduce(
-          (obj, slot) => {
-            obj[slot] = (scope) => h(resolveComponent(props.element.customTemplate?.component), {
-              context: scope,
-              slotName: slot
-            });
-            return obj;
-          },
-          {}
-        )
-      });
-      const render = h(field.component, field.props, field.slots);
-      if (field.props.rules) {
-        return h(
-          ValidationField,
-          {
-            props: field.props,
-            index: props.elIndex,
-            rows: props.rows,
-            key: `${String(field.props.key)}_validation`
-          },
-          () => render
-        );
-      } else {
-        return render;
-      }
-    };
-  }
-};
-
-const Card = {
-  name: "CardEl",
-  props: componentProps,
-  setup(props) {
-    const hasNoComment = ref(true);
-    onMounted(() => {
-      hasNoComment.value = hasNoCommentNodes(toValue(props.fields));
-    });
-    onUpdated(() => {
-      hasNoComment.value = hasNoCommentNodes(toValue(props.fields));
-    });
-    const hasNoCommentNodes = (components) => {
-      const vnodeIterable = Array.isArray(components) ? components : [components];
-      const commentCounter = ref(0);
-      for (const component of vnodeIterable) {
-        if (Array.isArray(component) && component.length > 0) {
-          if (!hasNoCommentNodes(component)) {
-            commentCounter.value++;
-            break;
-          }
-        } else if (component && typeof component === "object" && !Array.isArray(component)) {
-          if (Array.isArray(component.children) && component.children.length > 0) {
-            if (!hasNoCommentNodes(component.children)) {
-              commentCounter.value++;
-              break;
-            }
-          }
-          if (component.el && component.el.nodeType === Node.COMMENT_NODE) {
-            commentCounter.value++;
-            break;
-          }
-        }
-      }
-      return commentCounter.value !== vnodeIterable.length;
-    };
-    return () => {
-      const field = CardCollection({
-        props: Object.assign(
-          {},
-          {
-            variant: props.element.variant,
-            header: toValue(props.baseProps.label),
-            isCollapsable: props.element.collapsible,
-            isCollapsed: restoreCollapsed(props.element.id) || props.element.collapsed,
-            "onState:collapsed": (e) => handleCollapsed(props.element.id, e)
-          },
-          unrefNested(props.baseProps),
-          {
-            class: unrefNested(props.baseProps).classNames ?? ""
-          }
-        ),
-        slots: {
-          default: () => h(
-            "div",
-            {
-              class: {
-                "tw-flex": true,
-                "tw-flex-col": true,
-                "tw-p-4": !props.element.removePadding,
-                "tw-gap-4": true
-              }
-            },
-            toValue(props.fields)
-          ),
-          actions: () => {
-            if (props.element.action) {
-              const elem = nodeBuilder({
-                controlSchema: props.element.action,
-                parentId: `${props.element.id}`,
-                internalContext: props.fieldContext ?? {},
-                bladeContext: props.bladeContext,
-                currentLocale: props.currentLocale ?? "en",
-                formData: props.formData
-              });
-              return elem;
-            }
-          }
-        }
-      });
-      function handleCollapsed(key, value) {
-        localStorage?.setItem(key, `${value}`);
-      }
-      function restoreCollapsed(key) {
-        return localStorage?.getItem(key) === "true";
-      }
-      return hasNoComment.value ? h(field.component, field.props, field.slots) : null;
-    };
-  }
-};
-
-const methodHandler = (visibility, fieldContext, schema) => {
-  if (visibility === void 0) {
-    return true;
-  }
-  if (typeof visibility === "function") {
-    return visibility(schema, fieldContext);
-  }
-  return toValue(visibility);
-};
-
-const slotsMap = {
-  append: "append",
-  prepend: "prepend",
-  appendInner: "append-inner",
-  prependInner: "prepend-inner"
-};
-const InputField = {
-  name: "InputField",
-  props: componentProps,
-  setup(props) {
-    return () => {
-      const field = InputField$1({
-        props: Object.assign(
-          {},
-          {
-            type: props.element.variant,
-            currentLanguage: props.currentLocale,
-            clearable: props.element.clearable || false,
-            maxlength: props.element.maxlength,
-            datePickerOptions: props.element.datePickerOptions,
-            loading: props.element.loading?.method ? methodHandler(
-              toValue(props.bladeContext?.scope)?.[props.element.loading?.method],
-              props.fieldContext,
-              props.element
-            ) : false
-          },
-          unrefNested(props.baseProps),
-          {
-            class: unrefNested(props.baseProps).classNames ?? ""
-          }
-        ),
-        slots: Object.entries(slotsMap).reduce(
-          (acc, [key, value]) => {
-            if (props.element[key]) {
-              acc[value] = () => nodeBuilder({
-                controlSchema: props.element[key],
-                parentId: `${props.element[key].id}`,
-                internalContext: props.fieldContext ?? {},
-                bladeContext: props.bladeContext,
-                currentLocale: props.currentLocale ?? "en-US",
-                formData: props.formData
-              });
-            }
-            return acc;
-          },
-          {}
-        )
-      });
-      const render = h(field.component, field.props, field.slots);
-      if (field.props.rules) {
-        return h(
-          ValidationField,
-          {
-            props: field.props,
-            index: props.elIndex,
-            rows: props.rows,
-            key: `${String(field.props.key)}_validation`
-          },
-          () => render
-        );
-      } else {
-        return render;
-      }
-    };
-  }
-};
-
-const Fieldset = {
-  name: "Fieldset",
-  props: componentProps,
-  setup(props) {
-    const { fields: fieldsetFields } = toRefs(props);
-    return () => toValue(fieldsetFields.value)?.map((fields, index, arr) => {
-      const divideByCols = chunk(fields, props.element.columns || 1) ?? [];
-      return h(
-        "div",
-        {
-          class: `tw-flex tw-row tw-relative ${unrefNested(props.baseProps).classNames ?? ""}`,
-          key: `fieldset-${index}`
-        },
-        [
-          h("div", { class: "tw-flex-1 tw-gap-4 tw-flex tw-flex-col tw-min-w-0" }, [
-            divideByCols.map((itemsArr, colIndex) => {
-              return h(
-                _sfc_main$j,
-                {
-                  key: `col-${colIndex}-${index}`,
-                  class: {
-                    "tw-relative": true,
-                    "tw-gap-4": true,
-                    "!tw-flex-wrap": true,
-                    "!tw-flex !tw-flex-row": !!props.element.aspectRatio
-                  }
-                },
-                () => [
-                  ...itemsArr.map((item, itemIndex) => {
-                    return h(
-                      _sfc_main$k,
-                      {
-                        key: `col-${itemIndex}-${colIndex}-${index}`,
-                        size: "aspectRatio" in props.element ? props.element.aspectRatio?.[itemIndex] : 1
-                      },
-                      () => {
-                        if (typeof item === "object") {
-                          return h(item, {
-                            elIndex: index,
-                            rows: arr.length,
-                            key: `item-${itemIndex}-${colIndex}-${index}`
-                          });
-                        }
-                      }
-                    );
-                  })
-                ]
-              );
-            })
-          ])
-        ]
-      );
-    });
-  }
-};
-
-const getModel = (property, context) => {
-  if (property && context) {
-    if (typeof context[property] === "function") {
-      return context[property]();
-    }
-    return get(context, property);
-  }
-  return null;
-};
-
-function setModel(args) {
-  const { property, value, option, context, scope } = args;
-  if (scope && has(scope, property)) {
-    if (typeof scope[property] === "function") {
-      scope[property](value);
-    } else {
-      set(scope, property, value);
-    }
-    return;
-  }
-  set(context, property, option ? value[option] : value);
-}
-
-const InputCurrency = {
-  name: "InputCurrency",
-  props: componentProps,
-  setup(props) {
-    return () => {
-      const options = (safeIn("options", props.element) && props.element.options && (toValue$1(getModel(props.element.options, props.fieldContext ?? {})) || toValue$1(unref(props.bladeContext.scope)?.[props.element.options]))) ?? void 0;
-      const contextProperty = safeIn("optionProperty", props.element) && props.element.optionProperty && getModel(props.element.optionProperty, props.fieldContext ?? {});
-      const scopedProperty = safeIn("optionProperty", props.element) && props.element.optionProperty && props.bladeContext.scope && getModel(props.element.optionProperty, props.bladeContext.scope);
-      const field = InputCurrency$1({
-        props: Object.assign(
-          {},
-          {
-            precision: props.element.precision,
-            option: toValue$1(scopedProperty ?? contextProperty),
-            currencyDisplay: props.element.currencyDisplay,
-            optionLabel: props.element.optionLabel,
-            optionValue: props.element.optionValue,
-            options,
-            "onUpdate:option": (e) => {
-              setModel({
-                value: e,
-                property: props.element.optionProperty,
-                context: props.fieldContext ?? {},
-                scope: props.bladeContext.scope
-              });
-            },
-            clearable: props.element.clearable || false
-          },
-          unrefNested(props.baseProps),
-          {
-            class: unrefNested(props.baseProps).classNames ?? ""
-          }
-        )
-      });
-      const render = h(field.component, field.props);
-      if (field.props.rules) {
-        return h(
-          ValidationField,
-          {
-            props: field.props,
-            index: props.elIndex,
-            rows: props.rows,
-            key: `${String(field.props.key)}_validation`
-          },
-          () => render
-        );
-      } else {
-        return render;
-      }
-    };
-  }
-};
-
-function unwrapInterpolation(property, context) {
-  const pattern = /{(.*)}/g;
-  const match = property.match(pattern);
-  if (match !== null) {
-    return getModel(property.replace(/{|}/g, ""), context);
-  }
-  return property;
-}
-
-const Checkbox = {
-  name: "Checkbox",
-  props: componentProps,
-  setup(props) {
-    const { t } = useI18n({ useScope: "global" });
-    return () => {
-      const field = Checkbox$1({
-        props: Object.assign(
-          {},
-          {
-            trueValue: props.element.trueValue,
-            falseValue: props.element.falseValue
-          },
-          unrefNested(props.baseProps),
-          {
-            class: unrefNested(props.baseProps).classNames ?? ""
-          }
-        ),
-        slots: {
-          default: () => unref(computed(() => t(unwrapInterpolation(props.element.content, toValue$1(props.fieldContext)))))
-        }
-      });
-      const render = h(field.component, field.props, field.slots);
-      if (field.props.rules) {
-        return h(
-          ValidationField,
-          {
-            props: field.props,
-            slots: field.slots,
-            index: props.elIndex,
-            rows: props.rows
-          },
-          () => render
-        );
-      } else {
-        return render;
-      }
-    };
-  }
-};
-
-const DynamicProperty = {
-  name: "DynamicProperty",
-  props: componentProps,
-  emits: ["setModelData"],
-  setup(props) {
-    if (!props.bladeContext.scope?.dynamicProperties) {
-      throw new Error(
-        `There is no DynamicProperties config provided in blade scope: ${JSON.stringify(
-          props.bladeContext.scope,
-          null,
-          2
-        )}`
-      );
-    }
-    const internalModel = ref();
-    watch(
-      () => props.baseProps?.modelValue,
-      (newVal) => {
-        if (!isEqual(toValue(newVal), internalModel.value)) {
-          internalModel.value = cloneDeep(toValue(newVal));
-        }
-      },
-      { deep: true, immediate: true }
-    );
-    const filteredProps = reactify(
-      (prop, { include, exclude }) => {
-        if (prop) {
-          return prop.filter((x) => {
-            if (include) return include?.includes(x.type);
-            if (exclude) return !exclude?.includes(x.type);
-            else return true;
-          });
-        }
-        return null;
-      }
-    );
-    const dynamicProps = filteredProps(internalModel, {
-      include: props.element?.include,
-      exclude: props.element?.exclude
-    });
-    const initialProps = cloneDeep(dynamicProps.value);
-    const properties = reactiveComputed(() => {
-      return (dynamicProps.value || [])?.map(
-        (prop) => DynamicProperties({
-          props: {
-            disabled: props.bladeContext.scope && "disabled" in props.bladeContext.scope && props.bladeContext.scope.disabled,
-            property: prop,
-            modelValue: computed(
-              () => props.bladeContext.scope?.dynamicProperties?.getPropertyValue(
-                prop,
-                toValue(props.currentLocale ?? "en-US")
-              )
-            ),
-            optionsGetter: props.bladeContext.scope?.dynamicProperties?.loadDictionaries,
-            "onUpdate:model-value": (args) => {
-              props.bladeContext.scope?.dynamicProperties?.setPropertyValue({
-                property: prop,
-                value: args.value,
-                dictionary: args.dictionary,
-                locale: args.locale,
-                initialProp: cloneDeep(initialProps?.find((x) => x.id === prop.id))
-              });
-              if (props.fieldContext) {
-                setModel({ context: props.fieldContext, property: props.element.property, value: internalModel.value });
-              }
-            },
-            required: prop.required,
-            multivalue: prop.multivalue,
-            multilanguage: prop.multilanguage,
-            valueType: prop.valueType,
-            dictionary: prop.dictionary,
-            name: prop.name,
-            rules: {
-              min: prop.validationRule?.charCountMin,
-              max: prop.validationRule?.charCountMax,
-              regex: prop.validationRule?.regExp
-            },
-            displayNames: prop.displayNames,
-            key: prop.multilanguage ? prop.name + "_" + prop.id + "_" + props.currentLocale : prop.name + "_" + prop.id,
-            currentLanguage: props.currentLocale
-          }
-        })
-      );
-    });
-    return () => {
-      return properties && properties.length ? properties.map(
-        (field) => h(field.component, {
-          ...unrefNested(field.props),
-          class: unrefNested(props.baseProps).classNames ?? "",
-          key: field.props.key
-        })
-      ) : null;
-    };
-  }
-};
-
-const EditorField = {
-  name: "EditorField",
-  props: componentProps,
-  setup(props) {
-    return () => {
-      const field = EditorField$1({
-        props: Object.assign(
-          {},
-          {
-            currentLanguage: props.currentLocale,
-            assetsFolder: props.element.assetsFolder,
-            maxlength: props.element.maxlength
-          },
-          unrefNested(props.baseProps),
-          {
-            class: unrefNested(props.baseProps).classNames ?? ""
-          }
-        )
-      });
-      const render = h(field.component, field.props);
-      if (field.props.rules) {
-        return h(
-          ValidationField,
-          {
-            props: field.props,
-            index: props.elIndex,
-            rows: props.rows,
-            key: `${String(field.props.key)}_validation`
-          },
-          () => render
-        );
-      } else {
-        return render;
-      }
-    };
-  }
-};
-
-const GalleryField = {
-  name: "GalleryField",
-  props: componentProps,
-  setup(props) {
-    if (!(safeIn("bladeContext", props) && props.bladeContext && safeIn("scope", props.bladeContext) && props.bladeContext.scope && props.bladeContext.scope.assetsHandler?.images)) {
-      throw new Error(
-        `There is no assetsHandler.images config provided in blade scope: ${JSON.stringify(
-          props.bladeContext.scope,
-          null,
-          2
-        )}`
-      );
-    }
-    const { showConfirmation } = usePopup();
-    const { t } = useI18n({ useScope: "global" });
-    const { openBlade } = useBladeNavigation();
-    const imagesHandler = toRefs(props.bladeContext.scope?.assetsHandler?.images);
-    const internalModel = ref();
-    watch(
-      () => props.fieldContext,
-      (newVal) => {
-        if (!isEqual(internalModel.value, newVal)) {
-          internalModel.value = cloneDeep(newVal);
-        }
-      },
-      { deep: true, immediate: true }
-    );
-    return () => {
-      const imageHandlers = {
-        loading: imagesHandler.loading ?? false,
-        async edit(image) {
-          if (!imagesHandler.edit?.value) throw new Error("Edit handler is not provided");
-          const edited = await imagesHandler.edit?.value?.([image]);
-          await editImages(edited);
-        },
-        async upload(files, lastSortOrder) {
-          if (!imagesHandler.upload?.value) throw new Error("Upload handler is not provided");
-          if (files) {
-            const uploaded = await imagesHandler.upload?.value?.(files, lastSortOrder);
-            let addToExisting;
-            if (Array.isArray(uploaded) && Array.isArray(internalModel.value[props.element.property])) {
-              addToExisting = internalModel.value[props.element.property].concat(uploaded);
-            } else {
-              addToExisting = uploaded;
-            }
-            files = null;
-            await editImages(addToExisting);
-          }
-        },
-        async remove(image) {
-          if (!imagesHandler.remove?.value) throw new Error("Remove handler is not provided");
-          if (imagesHandler.noRemoveConfirmation || await showConfirmation(
-            computed(
-              () => t(
-                `${props.bladeContext?.settings?.localizationPrefix.trim().toUpperCase()}.PAGES.ALERTS.IMAGE_DELETE_CONFIRMATION`
-              )
-            )
-          )) {
-            const edited = await imagesHandler.remove?.value?.([image]);
-            await editImages(edited);
-          }
-        }
-      };
-      function onGalleryItemEdit(item) {
-        openBlade({
-          blade: markRaw(_sfc_main$m),
-          options: {
-            asset: item,
-            assetEditHandler: imageHandlers.edit,
-            assetRemoveHandler: imageHandlers.remove
-          }
-        });
-      }
-      async function editImages(args) {
-        if (props.fieldContext) {
-          internalModel.value[props.element.property] = args;
-          setModel({
-            property: props.element.property,
-            value: args,
-            context: props.fieldContext,
-            scope: props.bladeContext.scope
-          });
-          if (props.bladeContext.validationState) {
-            await props.bladeContext.validationState.setFieldValue(props.element.id, args);
-          }
-        }
-      }
-      const field = Gallery({
-        props: Object.assign(
-          {},
-          {
-            customText: {
-              dragHere: typeof props.element.customText?.dragHere !== "undefined" ? unref(computed(() => t(props.element.customText.dragHere))) : void 0,
-              browse: typeof props.element.customText?.browse !== "undefined" ? unref(computed(() => t(props.element.customText.browse))) : void 0
-            },
-            uploadIcon: props.element.uploadIcon,
-            loading: imageHandlers.loading,
-            images: toValue(props.baseProps.modelValue),
-            multiple: props.element.multiple,
-            variant: props.element.variant,
-            itemActions: props.element.actions,
-            onUpload: imageHandlers.upload,
-            onRemove: imageHandlers.remove,
-            onEdit: onGalleryItemEdit,
-            onSort: editImages,
-            hideAfterUpload: props.element.hideAfterUpload
-          },
-          unrefNested(props.baseProps),
-          {
-            class: unrefNested(props.baseProps).classNames ?? ""
-          }
-        )
-      });
-      return h(field.component, Object.assign(unrefNested(field.props), { class: "tw-flex-auto" }));
-    };
-  }
-};
-
-const Button = {
-  name: "ButtonEl",
-  props: componentProps,
-  setup(props) {
-    const { t } = useI18n({ useScope: "global" });
-    return () => {
-      const field = Button$1({
-        props: Object.assign(
-          {},
-          {
-            small: props.element.small,
-            icon: props.element?.icon,
-            iconSize: props.element?.iconSize,
-            text: props.element?.text,
-            variant: props.element?.variant,
-            raised: props.element?.raised,
-            outline: props.element?.outline,
-            onClick: () => {
-              unref(props.bladeContext.scope)?.[props.element.method]();
-            }
-          },
-          unrefNested(props.baseProps),
-          {
-            class: unrefNested(props.baseProps).classNames ?? ""
-          }
-        ),
-        slots: props.element.content ? {
-          default: () => unref(computed(() => (props.element.content && t(props.element.content)) ?? void 0))
-        } : void 0
-      });
-      return h(field.component, mergeProps(field.props, { class: "tw-self-start" }), field.slots);
-    };
-  }
-};
-
-const StatusField = {
-  name: "StatusField",
-  props: componentProps,
-  setup(props) {
-    const { t } = useI18n({ useScope: "global" });
-    const hasOverflow = ref(false);
-    const isExpanded = ref(false);
-    const contentRef = ref(null);
-    const toggle = () => {
-      isExpanded.value = !isExpanded.value;
-    };
-    const checkOverflow = () => {
-      if (contentRef.value) {
-        hasOverflow.value = contentRef.value.scrollHeight > 100;
-      }
-    };
-    onMounted(() => {
-      checkOverflow();
-    });
-    return () => {
-      const slotContent = computed(() => {
-        if (props.element.content && typeof props.element.content === "string") {
-          return t(props.element.content);
-        } else if (typeof props.element.content === "object" && "method" in props.element.content && props.element.content?.method) {
-          const method = unref(props.bladeContext.scope)?.[props.element.content?.method];
-          if (typeof method === "function") {
-            return method();
-          } else {
-            return method;
-          }
-        }
-        return null;
-      });
-      const field = StatusField$1({
-        props: Object.assign(
-          {
-            variant: props.element.variant,
-            outline: props.element.outline,
-            extend: props.element.extend
-          },
-          unrefNested(props.baseProps),
-          {
-            class: unrefNested(props.baseProps).classNames ?? ""
-          }
-        ),
-        slots: {
-          default: () => {
-            return h("div", { class: "tw-flex tw-flex-row tw-items-center" }, [
-              props.element.icon ? h(_sfc_main$n, {
-                icon: props.element.icon,
-                size: props.element.iconSize,
-                variant: props.element.iconVariant,
-                class: "tw-mr-3"
-              }) : void 0,
-              h("div", { class: "tw-flex tw-flex-col", style: "text-align: start;" }, [
-                h("div", { class: "tw-font-bold" }, computed(() => t(props.element.title ?? "")).value),
-                h(
-                  "div",
-                  {
-                    class: {
-                      "tw-overflow-hidden": true,
-                      "tw-max-h-[100px] tw-line-clamp-4": !isExpanded.value,
-                      "tw-max-h-[100%]": isExpanded.value
-                    },
-                    ref: contentRef
-                  },
-                  slotContent.value
-                ),
-                hasOverflow.value ? h(
-                  _sfc_main$c,
-                  { text: true, class: "tw-self-end", onClick: toggle },
-                  () => isExpanded.value ? t("COMPONENTS.ATOMS.VC_STATUS.SHOW_LESS") : t("COMPONENTS.ATOMS.VC_STATUS.SHOW_MORE")
-                ) : void 0
-              ])
-            ]);
-          }
-        }
-      });
-      return h(
-        field.component,
-        { ...field.props, class: props.element.extend ? "tw-w-full tw-box-border" : "tw-flex tw-self-start" },
-        field.slots
-      );
-    };
-  }
-};
-
-const ContentField = {
-  name: "ContentField",
-  props: componentProps,
-  setup(props) {
-    return () => {
-      const field = ContentField$1({
-        props: Object.assign(
-          {},
-          {
-            type: props.element.variant,
-            copyable: props.element.copyable || false,
-            orientation: props.element.orientation,
-            aspectRatio: props.element.aspectRatio
-          },
-          unrefNested(props.baseProps),
-          {
-            class: unrefNested(props.baseProps).classNames ?? ""
-          }
-        )
-      });
-      const render = h(field.component, field.props);
-      return render;
-    };
-  }
-};
-
-const VideoField = {
-  name: "VideoField",
-  props: componentProps,
-  setup(props) {
-    return () => {
-      const field = VideoField$1({
-        props: Object.assign(
-          {},
-          {
-            source: toValue(props.baseProps.modelValue)
-          },
-          unrefNested(props.baseProps),
-          {
-            class: unrefNested(props.baseProps).classNames ?? ""
-          }
-        )
-      });
-      const render = h(field.component, field.props);
-      return render;
-    };
-  }
-};
-
-const ImageField = {
-  name: "ImageField",
-  props: componentProps,
-  setup(props) {
-    return () => {
-      const field = ImageField$1({
-        props: Object.assign(
-          {},
-          {
-            src: toValue(props.baseProps.modelValue),
-            aspect: props.element.aspect,
-            rounded: props.element.rounded,
-            bordered: props.element.bordered,
-            size: props.element.size,
-            background: props.element.background
-          },
-          unrefNested(props.baseProps),
-          {
-            class: unrefNested(props.baseProps).classNames ?? ""
-          }
-        )
-      });
-      const render = h(field.component, field.props);
-      return render;
-    };
-  }
-};
-
-const TextareaField = {
-  name: "TextareaField",
-  props: componentProps,
-  setup(props) {
-    return () => {
-      const field = TextareaField$1({
-        props: Object.assign(
-          {},
-          {
-            currentLanguage: props.currentLocale,
-            clearable: props.element.clearable || false,
-            maxlength: props.element.maxlength
-          },
-          unrefNested(props.baseProps),
-          {
-            class: unrefNested(props.baseProps).classNames ?? ""
-          }
-        )
-      });
-      const render = h(field.component, field.props);
-      if (field.props.rules) {
-        return h(
-          ValidationField,
-          {
-            props: field.props,
-            index: props.elIndex,
-            rows: props.rows,
-            key: `${String(field.props.key)}_validation`
-          },
-          () => render
-        );
-      } else {
-        return render;
-      }
-    };
-  }
-};
-
-const MultivalueField = {
-  name: "MultivalueField",
-  props: componentProps,
-  setup(props) {
-    return () => {
-      const field = MultivalueField$1({
-        props: Object.assign(
-          {},
-          {
-            multivalue: props.element.multivalue,
-            type: props.element.variant,
-            optionValue: props.element.optionValue,
-            optionLabel: props.element.optionLabel,
-            options: props.element.options ? props.bladeContext.scope?.[props.element.options] : void 0,
-            currentLanguage: props.currentLocale
-          },
-          unrefNested(props.baseProps),
-          {
-            class: unrefNested(props.baseProps).classNames ?? ""
-          }
-        ),
-        slots: props.element.customTemplate && ["option", "selected-item"].reduce(
-          (obj, slot) => {
-            obj[slot] = (scope) => h(resolveComponent(props.element.customTemplate?.component), {
-              context: scope,
-              slotName: slot
-            });
-            return obj;
-          },
-          {}
-        )
-      });
-      const render = h(field.component, field.props, field.slots);
-      if (field.props.rules) {
-        return h(
-          ValidationField,
-          {
-            props: field.props,
-            index: props.elIndex,
-            rows: props.rows,
-            key: `${String(field.props.key)}_validation`
-          },
-          () => render
-        );
-      } else {
-        return render;
-      }
-    };
-  }
-};
-
-const SwitchField = {
-  name: "SwitchEl",
-  props: componentProps,
-  setup(props) {
-    return () => {
-      const field = Switch({
-        props: Object.assign(
-          {},
-          {
-            trueValue: props.element.trueValue,
-            falseValue: props.element.falseValue
-          },
-          unrefNested(props.baseProps),
-          {
-            class: unrefNested(props.baseProps).classNames ?? ""
-          }
-        )
-      });
-      return h(field.component, field.props);
-    };
-  }
-};
-
-const Table = {
-  name: "TableEl",
-  props: componentProps,
-  setup(props) {
-    const { tableTemplates } = useTableTemplates(props.element);
-    const { t } = useI18n({ useScope: "global" });
-    const enableEdit = inject("isBladeEditable", false);
-    const enableEditComputed = computed(() => unref(enableEdit));
-    unrefNested(props.baseProps).modelValue ?? [];
-    function disabledActionHandler(disabled, item) {
-      if (!disabled) return false;
-      if (typeof disabled === "boolean") return disabled;
-      else if (disabled.method && typeof toValue(props.bladeContext.scope)?.[disabled.method] === "function")
-        return toValue(props.bladeContext.scope)?.[disabled.method]({ item });
-      else if (disabled.method && toValue(props.bladeContext.scope)?.[disabled.method])
-        return toValue(props.bladeContext.scope)?.[disabled.method];
-      return false;
-    }
-    function actionBuilder(item) {
-      const result = props.element?.actions?.reduce((arr, action) => {
-        const isDisabled = disabledActionHandler(action?.disabled ?? false, item);
-        if (!toValue(isDisabled)) {
-          arr.push({
-            icon: action.icon,
-            title: computed(() => t(action.title)),
-            type: action.type,
-            clickHandler: async (itemVal, index) => {
-              try {
-                await toValue(props.bladeContext.scope)?.[action.method]?.(itemVal, index);
-              } catch (error) {
-                throw new Error(`Method ${action.method} is not defined in scope or toolbarOverrides`);
-              }
-            }
-          });
-        }
-        return arr;
-      }, []);
-      return result;
-    }
-    return () => {
-      const field = Table$1({
-        props: Object.assign(
-          {},
-          {
-            addNewRowButton: props.element.addNewRowButton ? {
-              title: computed(() => t(props.element.addNewRowButton?.title ?? "")),
-              show: props.element.addNewRowButton.show
-            } : void 0,
-            header: !!props.element.header,
-            footer: !!props.element.footer,
-            multiselect: !!props.element.multiselect,
-            columns: props.element.columns?.map((col) => ({ ...col, title: computed(() => t(col.title)) })),
-            items: unrefNested(props.baseProps).modelValue ?? [],
-            stateKey: props.element.id,
-            class: `!tw-flex-auto ${unrefNested(props.baseProps).classNames ?? ""}`,
-            editing: enableEditComputed.value,
-            enableItemActions: !!props.element.actions,
-            itemActionBuilder: actionBuilder,
-            get selectedItemId() {
-              if (props.element.selectedItemId?.method && props.bladeContext.scope?.[props.element.selectedItemId?.method]) {
-                if (typeof props.bladeContext.scope?.[props.element.selectedItemId?.method] === "function") {
-                  return props.bladeContext.scope?.[props.element.selectedItemId?.method]?.();
-                } else {
-                  return props.bladeContext.scope?.[props.element.selectedItemId?.method];
-                }
-              }
-            },
-            get selectedItems() {
-              if (props.element.selectedIds?.method && props.bladeContext.scope?.[props.element.selectedIds?.method] && typeof props.bladeContext.scope?.[props.element.selectedIds?.method] === "function") {
-                return props.bladeContext.scope?.[props.element.selectedIds?.method]?.();
-              }
-              return [];
-            },
-            onItemClick: (item) => {
-              if (props.element.onItemClick?.method && props.bladeContext.scope?.[props.element.onItemClick?.method] && typeof props.bladeContext.scope?.[props.element.onItemClick?.method] === "function") {
-                props.bladeContext.scope?.[props.element.onItemClick?.method](item);
-              }
-            },
-            onOnEditComplete: (data) => {
-              if (props.fieldContext) {
-                setModel({
-                  context: props.fieldContext,
-                  property: `${props.element.property}.${data.index}.${data.event.field}`,
-                  value: data.event.value
-                });
-              }
-            },
-            onOnAddNewRow: () => {
-              if (props.element.addNewRowButton?.method && props.bladeContext.scope?.[props.element.addNewRowButton?.method] && typeof props.bladeContext.scope?.[props.element.addNewRowButton?.method] === "function") {
-                props.bladeContext.scope?.[props.element.addNewRowButton?.method]?.();
-              }
-            },
-            onOnCellBlur: async (data) => {
-              if (props.element.columns) {
-                const column = props.element.columns.find((col) => col.id === data.field);
-                if (column && column.onCellBlur && column.onCellBlur.method) {
-                  if (props.bladeContext.scope?.[column.onCellBlur.method] && typeof props.bladeContext.scope[column.onCellBlur.method] === "function") {
-                    await props.bladeContext.scope[column.onCellBlur.method](data);
-                  }
-                }
-              }
-            }
-          },
-          unrefNested(props.baseProps)
-        ),
-        slots: {
-          ...Object.entries(tableTemplates.templateOverrideComponents).reduce(
-            (obj, [key, value], index) => {
-              obj[`item_${key}`] = (itemData) => {
-                return h(unref(value), {
-                  index: itemData.index,
-                  context: itemData,
-                  key: `template_override_${props.element.id}_${index}`,
-                  bladeContext: props.bladeContext,
-                  onEditComplete: (data) => {
-                    if (props.fieldContext) {
-                      setModel({
-                        context: props.fieldContext,
-                        property: `${props.element.property}.${itemData.index}.${key}`,
-                        value: data
-                      });
-                    }
-                  }
-                });
-              };
-              return obj;
-            },
-            {}
-          ),
-          notfound: tableTemplates?.notFound ? () => h(tableTemplates.notFound, { context: props.bladeContext }) : void 0,
-          "mobile-item": tableTemplates?.mobileView ? (itemData) => h(tableTemplates.mobileView, { context: itemData, bladeContext: props.bladeContext }) : void 0,
-          empty: tableTemplates?.empty ? () => h(tableTemplates.empty, { context: props.bladeContext }) : void 0,
-          footer: tableTemplates?.footer ? () => h(tableTemplates.footer, { context: props.bladeContext }) : void 0
-        }
-      });
-      return h(field.component, field.props, field.slots);
-    };
-  }
-};
-
-const CustomComponent = {
-  name: "CustomComponentRenderer",
-  props: componentProps,
-  setup(props) {
-    return () => {
-      const component = resolveComponent(props.element?.name);
-      return typeof component === "object" ? h(
-        component,
-        Object.assign(
-          {},
-          {
-            context: props.bladeContext
-          },
-          {
-            class: unrefNested(props.baseProps).classNames ?? ""
-          }
-        )
-      ) : null;
-    };
-  }
-};
-
-const RatingField = {
-  name: "RatingEl",
-  props: componentProps,
-  setup(props) {
-    return () => {
-      const field = Rating({
-        props: Object.assign(
-          {},
-          {
-            variant: props.element.type
-          },
-          unrefNested(props.baseProps),
-          {
-            class: unrefNested(props.baseProps).classNames ?? ""
-          }
-        )
-      });
-      return h(field.component, field.props);
-    };
-  }
-};
-
-const RadioButtonGroup = {
-  name: "RadioButtonGroup",
-  props: componentProps,
-  setup(props) {
-    return () => {
-      const label = unrefNested(props.baseProps).label;
-      const options = toValue(getModel(props.element.options, props.fieldContext ?? {})) || toValue(unref(props.bladeContext.scope)?.[props.element.options]);
-      const fields = options.map(
-        (opt) => RadioButton({
-          props: Object.assign(
-            {},
-            {
-              value: props.element.optionValue ? toValue(getModel(props.element.optionValue, opt ?? {})) : opt,
-              binary: props.element.binary,
-              label: props.element.optionLabel ? toValue(getModel(props.element.optionLabel, opt ?? {})) : opt
-            },
-            omit(unrefNested(props.baseProps), "label"),
-            {
-              class: unrefNested(props.baseProps).classNames ?? ""
-            }
-          )
-        })
-      );
-      const render = [
-        label ? h(
-          _sfc_main$l,
-          { required: props.element.rules?.required },
-          {
-            default: () => label,
-            tooltip: unrefNested(props.baseProps).tooltip ? () => unrefNested(props.baseProps).tooltip : void 0
-          }
-        ) : void 0,
-        fields.map((field) => h(field.component, field.props)),
-        h({
-          props: ["error", "errorMessage"],
-          components: { VcHint },
-          template: `
-            <VcHint v-if="error" class="vc-textarea__error">
-              {{ errorMessage }}
-            </VcHint>
-            `
-        })
-      ];
-      if (props.element.rules) {
-        return h(
-          ValidationField,
-          {
-            props: {
-              rules: props.element.rules,
-              modelValue: unrefNested(props.baseProps).modelValue,
-              label: unrefNested(props.baseProps).label,
-              name: unrefNested(props.baseProps).name
-            },
-            index: props.elIndex,
-            rows: props.rows
-          },
-          () => render
-        );
-      } else {
-        return render;
-      }
-    };
-  }
-};
-
-const FIELD_MAP = {
-  "vc-select": SelectField,
-  "vc-card": Card,
-  "vc-input": InputField,
-  "vc-fieldset": Fieldset,
-  "vc-input-currency": InputCurrency,
-  "vc-checkbox": Checkbox,
-  "vc-dynamic-properties": DynamicProperty,
-  "vc-editor": EditorField,
-  "vc-gallery": GalleryField,
-  "vc-button": Button,
-  "vc-status": StatusField,
-  "vc-field": ContentField,
-  "vc-video": VideoField,
-  "vc-image": ImageField,
-  "vc-textarea": TextareaField,
-  "vc-multivalue": MultivalueField,
-  "vc-switch": SwitchField,
-  "vc-table": Table,
-  "vc-custom": CustomComponent,
-  "vc-rating": RatingField,
-  "vc-radio-button-group": RadioButtonGroup
-};
-
-const { hasAccess } = usePermissions();
-function disabledHandler(disabled, context) {
-  if (!disabled) return false;
-  if (typeof disabled === "boolean") return disabled;
-  else if (disabled.method && typeof context.scope?.[disabled.method] === "function")
-    return context.scope[disabled.method]();
-  else if (disabled.method && context.scope?.[disabled.method]) return context.scope[disabled.method];
-  return false;
-}
-function nodeBuilder({
-  controlSchema,
-  parentId,
-  internalContext,
-  bladeContext,
-  currentLocale,
-  formData,
-  updateFormData
-}) {
-  if (!controlSchema) throw new Error("There is no controlSchema provided");
-  const { t } = i18n.global;
-  const name = controlSchema.id;
-  const rules = safeIn("rules", controlSchema) && controlSchema.rules || void 0;
-  const placeholder = safeIn("placeholder", controlSchema) && controlSchema.placeholder || void 0;
-  const required = safeIn("rules", controlSchema) && controlSchema.rules?.required;
-  const contextProperty = safeIn("property", controlSchema) && controlSchema.property && getModel(controlSchema.property, internalContext);
-  const scopedProperty = safeIn("property", controlSchema) && controlSchema.property && bladeContext.scope && getModel(controlSchema.property, bladeContext.scope);
-  const modelValue = scopedProperty ?? contextProperty ?? void 0;
-  const tooltip = safeIn("tooltip", controlSchema) && controlSchema.tooltip || void 0;
-  const multilanguage = safeIn("multilanguage", controlSchema) && controlSchema.multilanguage;
-  const label = safeIn("label", controlSchema) && controlSchema.label ? unref(unwrapInterpolation(controlSchema.label, internalContext)) : void 0;
-  const hint = safeIn("hint", controlSchema) && controlSchema.hint ? (bladeContext.scope && unref(unwrapInterpolation(controlSchema.hint, bladeContext.scope))) ?? unref(unwrapInterpolation(controlSchema.hint, internalContext)) ?? void 0 : void 0;
-  const disabled = bladeContext.scope && safeIn("disabled", bladeContext.scope) && bladeContext.scope.disabled || safeIn("disabled", controlSchema) && controlSchema.disabled && disabledHandler(controlSchema.disabled, bladeContext);
-  const onBlur = (event) => {
-    if (safeIn("onBlur", controlSchema) && controlSchema.onBlur) {
-      const method = controlSchema.onBlur.method;
-      if (method && bladeContext.scope?.[method] && typeof bladeContext.scope[method] === "function") {
-        bladeContext.scope[method]({
-          event,
-          property: controlSchema.property,
-          context: unrefNested(internalContext)
-        });
-      }
-    }
-  };
-  const onUpdateModelValue = async (e) => {
-    if (safeIn("property", controlSchema) && controlSchema.property) {
-      setModel({
-        property: controlSchema.property,
-        value: e,
-        context: internalContext,
-        scope: bladeContext.scope
-      });
-      updateFormData?.(formData);
-      if (safeIn("update", controlSchema) && controlSchema.update && safeIn("method", controlSchema.update) && bladeContext.scope) {
-        const updateMethod = controlSchema.update.method;
-        if (safeIn(updateMethod, bladeContext.scope) && typeof bladeContext.scope[updateMethod] === "function") {
-          await bladeContext.scope[updateMethod](e, controlSchema.property, unrefNested(internalContext));
-        }
-      }
-    }
-  };
-  const baseProps = reactive({
-    key: `${parentId}`,
-    label: computed(() => typeof label !== "undefined" ? t(label) : void 0),
-    hint: computed(() => typeof hint !== "undefined" ? t(hint) : void 0),
-    disabled,
-    onBlur,
-    name,
-    rules,
-    placeholder: computed(() => typeof placeholder !== "undefined" ? t(placeholder) : void 0),
-    required,
-    modelValue,
-    "onUpdate:modelValue": onUpdateModelValue,
-    tooltip: computed(() => typeof tooltip !== "undefined" ? t(tooltip) : void 0),
-    multilanguage,
-    "data-test-id": controlSchema.id,
-    classNames: "horizontalSeparator" in controlSchema && controlSchema.horizontalSeparator ? "tw-border-b tw-border-solid tw-border-b-[var(--neutrals-200)] tw-mb-[5px] tw-pb-[21px]" : ""
-  });
-  const component = FIELD_MAP[controlSchema.component];
-  const fieldsHandler = computed(() => {
-    if (!("fields" in controlSchema)) return null;
-    const contextFieldModel = safeIn("property", controlSchema) && controlSchema.property && getModel(controlSchema.property, internalContext);
-    const scopedFieldModel = safeIn("property", controlSchema) && controlSchema.property && getModel(controlSchema.property, toValue(bladeContext.scope ?? {}));
-    const model = scopedFieldModel || contextFieldModel;
-    if (toValue(model) && Array.isArray(toValue(model))) {
-      return toValue(model).map((modelItem) => {
-        return controlSchema.fields.reduce((arr, fieldItem) => {
-          if (safeIn("permissions", fieldItem) && !hasAccess(fieldItem.permissions)) {
-            return arr;
-          }
-          if (safeIn("visibility", fieldItem) && fieldItem.visibility?.method && !methodHandler(bladeContext.scope?.[fieldItem.visibility?.method], modelItem, fieldItem)) {
-            return arr;
-          }
-          return [
-            ...arr,
-            nodeBuilder({
-              controlSchema: fieldItem,
-              parentId: `fieldset-${fieldItem.id}-${modelItem.id}`,
-              internalContext: modelItem,
-              bladeContext,
-              currentLocale,
-              formData,
-              updateFormData
-            })
-          ];
-        }, []);
-      });
-    }
-    return [
-      controlSchema.fields.reduce((arr, field) => {
-        if (safeIn("permissions", field) && !hasAccess(field.permissions)) {
-          return arr;
-        }
-        if (safeIn("visibility", field) && field.visibility?.method && !methodHandler(bladeContext.scope?.[field.visibility?.method], internalContext, field)) {
-          return arr;
-        }
-        return [
-          ...arr,
-          nodeBuilder({
-            controlSchema: field,
-            parentId: `fieldset-${parentId}-${field.id}`,
-            internalContext,
-            bladeContext,
-            currentLocale,
-            formData,
-            updateFormData
-          })
-        ];
-      }, [])
-    ];
-  });
-  const elProps = {
-    baseProps: toRefs$1(baseProps),
-    bladeContext,
-    element: controlSchema,
-    currentLocale: unref(currentLocale),
-    fields: fieldsHandler,
-    formData,
-    fieldContext: internalContext
-  };
-  return h(component, elProps);
-}
-
-const schemeRenderProps = {
-  context: {
-    type: Object,
-    default: () => ({})
-  },
-  modelValue: {
-    type: Object,
-    required: true,
-    default: () => ({})
-  },
-  uiSchema: {
-    type: Array,
-    required: true,
-    default: () => []
-  },
-  currentLocale: {
-    type: String,
-    default: ""
-  }
-};
-const SchemaRender = defineComponent({
-  name: "SchemaRender",
-  props: schemeRenderProps,
-  emits: ["update:modelValue"],
-  setup(props, ctx) {
-    const { currentLocale } = toRefs(props);
-    const internalFormData = reactive({});
-    const { hasAccess } = usePermissions();
-    watch(
-      () => props.modelValue,
-      (newVal) => {
-        if (!isEqual(internalFormData, toRefs(newVal))) {
-          Object.assign(internalFormData, toRefs(newVal));
-        }
-      },
-      { deep: true, immediate: true }
-    );
-    function updateFormData(newVal) {
-      if (!isEqual(toRefs(newVal), internalFormData)) {
-        ctx.emit("update:modelValue", unrefNested(newVal));
-      }
-    }
-    return () => h(
-      "div",
-      { class: "tw-flex tw-flex-col tw-gap-4" },
-      props.uiSchema.reduce((arr, field) => {
-        if (safeIn("permissions", field) && !hasAccess(field.permissions)) {
-          return arr;
-        }
-        if (safeIn("visibility", field) && field.visibility?.method && !methodHandler(toValue$1(props.context?.scope)?.[field.visibility.method], props.context, field)) {
-          return arr;
-        }
-        return [
-          ...arr,
-          nodeBuilder({
-            controlSchema: field,
-            parentId: field.id,
-            internalContext: internalFormData,
-            bladeContext: props.context,
-            currentLocale,
-            formData: internalFormData,
-            updateFormData
-          })
-        ];
-      }, [])
-    );
-  }
-});
-
-const _hoisted_1 = { class: "blade-content-wrapper" };
-const _hoisted_2 = {
-  key: 0,
-  class: "language-selector-container"
-};
-const _hoisted_3 = {
-  key: 0,
-  class: "item-details__inner"
-};
-const _hoisted_4 = { class: "item-details__content" };
-const _sfc_main = /* @__PURE__ */ defineComponent({
-  __name: "dynamic-blade-form",
-  props: {
-    expanded: { type: Boolean, default: true },
-    closable: { type: Boolean, default: true },
-    param: {},
-    model: {},
-    options: {},
-    composables: {},
-    mixinFn: {}
-  },
-  emits: ["parent:call", "close:blade", "collapse:blade", "expand:blade"],
-  setup(__props, { expose: __expose, emit: __emit }) {
-    const props = __props;
-    const emit = __emit;
-    const { t } = useI18n({ useScope: "global" });
-    const { showConfirmation } = usePopup();
-    const { getFlag } = useLanguages();
-    const isMixinReady = ref(false);
-    const blade = inject(BladeInstance);
-    if (typeof props.composables?.[props.model?.settings?.composable ?? ""] === "undefined") {
-      throw new Error(`Composable ( ${props.model?.settings?.composable} ) is not defined`);
-    }
-    const settings = computed(() => props.model?.settings);
-    let { loading, item, validationState, scope, load, remove, saveChanges, bladeTitle } = props.composables ? props.composables?.[props.model?.settings?.composable ?? ""]({ emit, props, mounted: useMounted() }) : {
-      loading: true,
-      item: void 0,
-      validationState: void 0,
-      scope: void 0,
-      load: void 0,
-      remove: void 0,
-      saveChanges: void 0,
-      bladeTitle: void 0
-    };
-    if (props.mixinFn?.length) {
-      const mixinResults = props.mixinFn?.map(
-        (mixin) => mixin({ loading, item, validationState, scope, load, remove, saveChanges, bladeTitle })
-      );
-      const mergedResults = mixinResults.reduce((acc, result) => {
-        return {
-          ...acc,
-          ...result
-        };
-      }, {});
-      loading = mergedResults.loading ?? loading;
-      item = mergedResults.item ?? item;
-      validationState = mergedResults.validationState ?? validationState;
-      scope = mergedResults.scope ?? scope;
-      load = mergedResults.load ?? load;
-      remove = mergedResults.remove ?? remove;
-      saveChanges = mergedResults.saveChanges ?? saveChanges;
-      bladeTitle = mergedResults.bladeTitle ?? bladeTitle;
-      isMixinReady.value = true;
-    } else {
-      isMixinReady.value = true;
-    }
-    const widgetService = useWidgets();
-    const { onBeforeClose } = useBladeNavigation();
-    const title = ref();
-    const isReady = ref(false);
-    const activeWidgetExposed = ref();
-    const isBladeEditable = computed(() => !toValue("disabled" in toValue(scope || {}) && toValue(scope || {}).disabled));
-    const unreffedScope = reactiveComputed(() => toValue(scope) ?? {});
-    const { moduleNotifications, markAsRead } = useNotifications(settings.value?.pushNotificationType);
-    watch(
-      moduleNotifications,
-      (newVal) => {
-        newVal.forEach((message) => {
-          if (message.title && props.composables) {
-            notification.success(message.title, {
-              onClose() {
-                markAsRead(message);
-              }
-            });
-          }
-        });
-      },
-      { deep: true }
-    );
-    watch(
-      () => unref(bladeTitle),
-      (newVal) => {
-        if (newVal && props.composables) {
-          title.value = newVal;
-        }
-      },
-      { immediate: true }
-    );
-    const isFormModified = computed(() => validationState.value.modified);
-    useBeforeUnload(isFormModified);
-    const form = computed(
-      () => props.model?.content.find((x) => x?.component === "vc-form")
-    );
-    const widgets = computed(() => props.model?.content.find((x) => x?.component === "vc-widgets"));
-    const bladeContext = ref({
-      loading,
-      item,
-      validationState,
-      scope,
-      load,
-      remove,
-      saveChanges,
-      bladeTitle,
-      settings
-    });
-    const bladeStatus = computed(() => {
-      if (props.model && "status" in props.model.settings && props.model.settings.status) {
-        if (!("component" in props.model.settings.status))
-          throw new Error(`Component is required in status: ${props.model.settings.status}`);
-        return reactive(h(resolveComponent(props.model.settings.status.component), { context: bladeContext.value }));
-      }
-      return null;
-    });
-    const localeOptions = ref();
-    watch(
-      () => toValue(unreffedScope).multilanguage?.localesOptions,
-      (newVal) => {
-        localeOptions.value = newVal;
-      },
-      { immediate: true, deep: true }
-    );
-    watch(
-      () => localeOptions.value,
-      async (newVal) => {
-        for (const lang of newVal) {
-          lang.flag = await getFlag(lang.value);
-        }
-      },
-      { deep: true }
-    );
-    const bladeMultilanguage = reactiveComputed(() => {
-      if (scope && toValue(unreffedScope) && "multilanguage" in toValue(unreffedScope) && toValue(unreffedScope).multilanguage) {
-        const isOpened = ref(false);
-        return {
-          component: () => {
-            return h(
-              _sfc_main$o,
-              {
-                opened: isOpened.value,
-                items: localeOptions.value || [],
-                floating: true,
-                placement: "bottom-end",
-                offset: {
-                  mainAxis: 10,
-                  crossAxis: -15
-                },
-                variant: "secondary",
-                emptyText: t("COMMON.NO_OPTIONS"),
-                itemText: (item2) => item2.label,
-                isItemActive: (item2) => item2.value === toValue(unreffedScope).multilanguage?.currentLocale,
-                onItemClick: (item2) => {
-                  isOpened.value = false;
-                  toValue(unreffedScope).multilanguage?.setLocale(item2.value);
-                },
-                "onUpdate:opened": (state) => {
-                  isOpened.value = state;
-                }
-              },
-              {
-                trigger: () => {
-                  const currentLocale = localeOptions.value?.find(
-                    (locale) => locale.value === toValue(unreffedScope).multilanguage?.currentLocale
-                  );
-                  return h(
-                    "div",
-                    {
-                      onClick: () => {
-                        if ("disabled" in toValue(unreffedScope) && toValue(unreffedScope).disabled) return;
-                        isOpened.value = !isOpened.value;
-                      },
-                      class: "tw-flex tw-items-center tw-justify-center tw-bg-[--primary-100] tw-w-8 tw-h-8 tw-rounded-full tw-mr-1 hover:tw-bg-[--primary-200]"
-                    },
-                    [h(_sfc_main$8, { src: currentLocale?.flag, class: "tw-w-6 tw-h-6", emptyIcon: "" })]
-                  );
-                },
-                item: (props2) => {
-                  return h("div", { class: "tw-flex tw-items-center tw-gap-2 tw-p-2" }, [
-                    h(_sfc_main$8, { src: props2.item.flag, class: "tw-w-6 tw-h-6", emptyIcon: "" }),
-                    h("span", { class: "tw-text-sm" }, props2.item.label)
-                  ]);
-                },
-                empty: () => h("div", {}, t("COMMON.NO_OPTIONS"))
-              }
-            );
-          },
-          currentLocale: toValue(unreffedScope).multilanguage?.currentLocale
-        };
-      }
-      return {};
-    });
-    const bladeOptions = reactive({
-      status: bladeStatus,
-      backButton: computed(() => {
-        if (toValue(unreffedScope)?.backButton) {
-          return toValue(unreffedScope).backButton;
-        }
-        return void 0;
-      })
-    });
-    const multilanguage = reactive({
-      multilanguage: bladeMultilanguage.component
-    });
-    const toolbarComputed = (props.composables && useToolbarReducer({
-      defaultToolbarSchema: settings.value?.toolbar ?? [],
-      defaultToolbarBindings: {
-        saveChanges: {
-          async clickHandler() {
-            if (item.value) {
-              await saveChanges(item.value);
-              validationState.value.resetValidationState();
-              emit("parent:call", {
-                method: "reload"
-              });
-              emit("parent:call", {
-                method: "updateActiveWidgetCount"
-              });
-              widgetService.updateActiveWidget();
-              if (!unref(props.param)) {
-                emit("close:blade");
-              }
-            }
-          },
-          disabled: computed(() => !validationState.value.modified)
-        },
-        remove: {
-          async clickHandler() {
-            if (await showConfirmation(
-              computed(() => t(`${settings.value?.localizationPrefix.trim().toUpperCase()}.PAGES.ALERTS.DELETE`))
-            )) {
-              if (props.param) {
-                await remove?.({ id: unref(props.param) });
-              } else {
-                await remove?.({ item: item.value });
-              }
-              emit("parent:call", {
-                method: "reload"
-              });
-              emit("parent:call", {
-                method: "updateActiveWidgetCount"
-              });
-              widgetService.updateActiveWidget();
-              emit("close:blade");
-            }
-          },
-          disabled: computed(() => toValue(toValue(unreffedScope)?.disabled))
-        }
-      },
-      customToolbarConfig: toValue(unreffedScope)?.toolbarOverrides,
-      context: bladeContext.value
-    })) ?? [];
-    onMounted(() => {
-      if (blade?.value.id && widgets.value?.children) {
-        widgets.value.children.forEach((widgetComponent) => {
-          const isObjectWidget = typeof widgetComponent === "object" && "id" in widgetComponent;
-          const widgetId = isObjectWidget ? widgetComponent.id : "";
-          const visibilityMethod = isObjectWidget && "visibility" in widgetComponent && widgetComponent.visibility?.method;
-          const component = isObjectWidget ? resolveComponent(widgetId) : typeof widgetComponent === "string" ? resolveComponent(widgetComponent) : widgetComponent;
-          if (!component) {
-            console.error(`Failed to resolve widget component: ${isObjectWidget ? widgetId : widgetComponent}`);
-            return;
-          }
-          const finalWidgetId = isObjectWidget ? widgetId : typeof component === "object" && "__name" in component ? component.__name : `widget-${Date.now()}`;
-          if (finalWidgetId) {
-            widgetService.registerWidget(
-              {
-                id: finalWidgetId,
-                component: markRaw(component),
-                props: {
-                  modelValue: bladeContext
-                },
-                events: {
-                  "update:modelValue": (val) => {
-                    bladeContext.value = val;
-                  }
-                },
-                isVisible: visibilityMethod ? computed(() => bladeContext.value.scope?.[visibilityMethod]) : true
-              },
-              blade.value.id
-            );
-          }
-        });
-      }
-    });
-    onBeforeUnmount(() => {
-      if (blade?.value.id) {
-        widgetService.clearBladeWidgets(blade.value.id);
-      }
-    });
-    async function updateActiveWidgetCount() {
-      if (activeWidgetExposed.value?.updateActiveWidgetCount && typeof activeWidgetExposed.value?.updateActiveWidgetCount === "function") {
-        await activeWidgetExposed.value.updateActiveWidgetCount();
-      }
-    }
-    async function init() {
-      await load({ id: unref(props.param) });
-      await nextTick(() => {
-        isReady.value = true;
-      });
-    }
-    onBeforeMount(async () => {
-      if (props.composables && isMixinReady.value) await init();
-    });
-    onBeforeClose(async () => {
-      if (unref(isFormModified)) {
-        return await showConfirmation(
-          unref(
-            computed(() => t(`${settings.value?.localizationPrefix.trim().toUpperCase()}.PAGES.ALERTS.CLOSE_CONFIRMATION`))
-          )
-        );
-      }
-    });
-    provide("bladeContext", toReactive(bladeContext));
-    provide("isBladeEditable", isBladeEditable);
-    computed(() => {
-      return widgets.value?.children?.map((x) => {
-        if (typeof x === "string") return resolveComponent(x);
-        else throw new Error(`Component is required in widget: ${x}`);
-      });
-    });
-    __expose({
-      title: bladeTitle ?? "",
-      updateActiveWidgetCount,
-      ...toRefs(toValue(unreffedScope) ?? {}),
-      settings: toValue(settings),
-      item,
-      validationState
-    });
-    return (_ctx, _cache) => {
-      const _component_VcForm = resolveComponent("VcForm");
-      const _component_VcContainer = resolveComponent("VcContainer");
-      const _component_VcBlade = resolveComponent("VcBlade");
-      const _directive_loading = resolveDirective("loading");
-      return !_ctx.composables ? withDirectives((openBlock(), createBlock(_component_VcBlade, {
-        key: 0,
-        expanded: _ctx.expanded,
-        closable: _ctx.closable,
-        width: settings.value?.width || "50%",
-        "toolbar-items": unref(toolbarComputed),
-        title: title.value,
-        modified: isBladeEditable.value ? isFormModified.value : void 0,
-        onClose: _cache[1] || (_cache[1] = ($event) => _ctx.$emit("close:blade")),
-        onExpand: _cache[2] || (_cache[2] = ($event) => _ctx.$emit("expand:blade")),
-        onCollapse: _cache[3] || (_cache[3] = ($event) => _ctx.$emit("collapse:blade"))
-      }, createSlots({
-        default: withCtx(() => [
-          createElementVNode("div", _hoisted_1, [
-            multilanguage.multilanguage ? (openBlock(), createElementBlock("div", _hoisted_2, [
-              (openBlock(true), createElementBlock(Fragment, null, renderList(multilanguage, (value, key, index) => {
-                return openBlock(), createBlock(resolveDynamicComponent(value), {
-                  key: `blade-multilanguage-slot-${key}-${index}`
-                });
-              }), 128))
-            ])) : createCommentVNode("", true),
-            createVNode(_component_VcContainer, { "no-padding": true }, {
-              default: withCtx(() => [
-                isReady.value && unref(item) && Object.keys(unref(item)) ? (openBlock(), createElementBlock("div", _hoisted_3, [
-                  createElementVNode("div", _hoisted_4, [
-                    createVNode(_component_VcForm, {
-                      ref: "formItem",
-                      class: "tw-grow tw-p-4"
-                    }, {
-                      default: withCtx(() => [
-                        createVNode(unref(SchemaRender), {
-                          modelValue: unref(item),
-                          "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => isRef(item) ? item.value = $event : item = $event),
-                          "ui-schema": form.value.children,
-                          context: bladeContext.value,
-                          "current-locale": toValue(unref(unreffedScope))?.multilanguage?.currentLocale
-                        }, null, 8, ["modelValue", "ui-schema", "context", "current-locale"])
-                      ]),
-                      _: 1
-                    }, 512)
-                  ])
-                ])) : createCommentVNode("", true)
-              ]),
-              _: 1
-            })
-          ])
-        ]),
-        _: 2
-      }, [
-        bladeOptions ? {
-          name: "actions",
-          fn: withCtx(() => [
-            (openBlock(true), createElementBlock(Fragment, null, renderList(bladeOptions, (value, key, index) => {
-              return openBlock(), createBlock(resolveDynamicComponent(value), {
-                key: `blade-actions-slot-${key}-${index}`
-              });
-            }), 128))
-          ]),
-          key: "0"
-        } : void 0
-      ]), 1032, ["expanded", "closable", "width", "toolbar-items", "title", "modified"])), [
-        [_directive_loading, unref(loading), "1000"]
-      ]) : createCommentVNode("", true);
-    };
-  }
-});
-
-const pages = /*#__PURE__*/Object.freeze(/*#__PURE__*/Object.defineProperty({
-  __proto__: null,
-  DynamicBladeForm: _sfc_main,
-  DynamicBladeList: _sfc_main$1
-}, Symbol.toStringTag, { value: 'Module' }));
-
-const handleOverrides = (overrides, schemaCopy) => {
-  let schema = cloneDeep(schemaCopy);
-  if (overrides.remove && overrides.remove.length > 0) {
-    schema = removeHelper(overrides, schema);
-  }
-  if (overrides.upsert && overrides.upsert.length > 0) {
-    schema = upsertHelper(overrides, schema);
-  }
-  return schema;
-};
-const upsertHelper = (overrides, schemaCopy) => {
-  return Object.entries(schemaCopy).reduce(
-    (obj, [, schema]) => {
-      const clonedSchema = cloneDeep(schema);
-      overrides.upsert?.filter((x) => clonedSchema.settings.id === x.id).forEach((args) => {
-        let valueByPath = get(clonedSchema, args.path);
-        let currentPath = args.path;
-        if (!valueByPath) {
-          const pathParts = args.path.split(".");
-          let current = clonedSchema;
-          const generatedPath = [];
-          for (const part of pathParts) {
-            if (Array.isArray(current)) {
-              const currentCopy = [...current];
-              current = current.find((x) => Object.entries(x).some(([key, value]) => key === part || value === part));
-              const fountElIndex = currentCopy.findIndex((x) => x === current);
-              generatedPath.push(fountElIndex);
-            } else {
-              if (current) {
-                current = current[part];
-                generatedPath.push(part);
-              }
-            }
-          }
-          currentPath = generatedPath;
-          valueByPath = current;
-        }
-        if (Array.isArray(valueByPath) && valueByPath.length && typeof args.value === "object" && !Array.isArray(args.value)) {
-          const findIndex$1 = findIndex(valueByPath, { id: args.value.id });
-          const spliced = valueByPath.toSpliced(findIndex$1 >= 0 ? findIndex$1 : args.index ?? 0, findIndex$1 >= 0 ? 1 : 0, args.value);
-          set(clonedSchema, currentPath, spliced);
-        } else if (Array.isArray(valueByPath) && valueByPath.length) {
-          set(clonedSchema, currentPath, [...valueByPath, args.value]);
-        } else {
-          set(clonedSchema, currentPath, args.value);
-        }
-      });
-      const newId = clonedSchema.settings.id;
-      if (newId !== schema.settings.id) {
-        obj[newId] = clonedSchema;
-      } else {
-        obj[schema.settings.id] = clonedSchema;
-      }
-      return obj;
-    },
-    {}
-  );
-};
-const removeHelper = (overrides, schemaCopy) => {
-  return Object.entries(schemaCopy).reduce(
-    (obj, [name, schema]) => {
-      const clonedSchema = cloneDeep(schema);
-      sortByMaxIndexPath(overrides.remove?.filter((x) => schema.settings.id === x.id)).forEach(({ path }) => {
-        if (path) {
-          removePath(clonedSchema, path);
-        }
-      });
-      obj[name] = clonedSchema;
-      return obj;
-    },
-    {}
-  );
-};
-function removePath(obj, path) {
-  const removeItem = get(obj, path);
-  if (removeItem) {
-    const parentPath = path.slice(0, path.lastIndexOf("["));
-    unset(obj, path);
-    update(obj, parentPath, compact);
-  } else {
-    const pathParts = path.split(".");
-    let current = obj;
-    const generatedPath = [];
-    for (const part of pathParts) {
-      if (Array.isArray(current)) {
-        const currentCopy = [...current];
-        current = current.find((x) => Object.entries(x).some(([key, value]) => key === part || value === part));
-        const foundElIndex = currentCopy.findIndex((x) => x === current);
-        generatedPath.push(foundElIndex);
-      } else {
-        if (current) {
-          current = current[part];
-          generatedPath.push(part);
-        }
-      }
-    }
-    unset(obj, generatedPath);
-    update(obj, generatedPath, compact);
-  }
-}
-function sortByMaxIndexPath(items) {
-  return (items || []).sort((a, b) => getMaxIndexFromPath(b.path) - getMaxIndexFromPath(a.path));
-}
-function getMaxIndexFromPath(path) {
-  const matches = path.match(/\[(\d+)\]/g);
-  if (matches) {
-    const indexes = matches.map((match) => parseInt(match.slice(1, -1), 10));
-    return Math.max(...indexes);
-  }
-  return Infinity;
-}
-
-const useDetailsFactory = (factoryParams) => {
-  return function useDetails() {
-    const { setFieldError, setErrors, validate, setFieldValue, setValues, errorBag } = useForm({
-      validateOnMount: false
-    });
-    const item = ref();
-    const itemTemp = ref();
-    const isModified = ref(false);
-    const isFormValid = useIsFormValid();
-    const isDisabled = computed(() => !isModified.value || !isFormValid.value);
-    const { loading: itemLoading, action: load } = useAsync(async (args) => {
-      const res = await factoryParams.load(args);
-      if (res) {
-        item.value = res;
-        item.value && resetModified(item.value);
-      }
-    });
-    const { loading: manageLoading, action: saveChanges } = useAsync(async (itemToSave) => {
-      if (validationState.value.valid) {
-        const res = await factoryParams.saveChanges?.(itemToSave);
-        isModified.value = false;
-        const id = itemToSave?.id ?? res?.id;
-        if (id) {
-          await load({ id });
-        }
-        if (res) return res;
-      } else throw new Error("Form is not valid");
-    });
-    const { loading: removeLoading, action: remove } = useAsync(async (args) => {
-      await factoryParams.remove?.(args);
-    });
-    const loading = useLoading(itemLoading, manageLoading, removeLoading);
-    const validationState = computed(
-      () => ({
-        /**
-         * @deprecated `dirty` - use `modified` instead
-         */
-        dirty: isModified.value,
-        valid: isFormValid.value,
-        modified: isModified.value,
-        disabled: isDisabled.value,
-        validated: !isDisabled.value && isModified.value,
-        cachedValue: itemTemp.value,
-        errorBag: errorBag.value,
-        setFieldError,
-        setErrors,
-        setFieldValue,
-        setValues,
-        resetModified,
-        resetValidationState,
-        validate,
-        setModifiedState
-      })
-    );
-    function setModifiedState(value) {
-      isModified.value = value;
-    }
-    function normalizeData(data) {
-      if (data === null || data === void 0 || data === "" || Array.isArray(data) && data.length === 0 || typeof data === "object" && data !== null && Object.keys(data).length === 0) {
-        return void 0;
-      }
-      if (Array.isArray(data)) {
-        return data.map((item2) => normalizeData(item2));
-      }
-      if (typeof data === "object") {
-        const normalizedObj = {};
-        for (const key in data) {
-          if (Object.prototype.hasOwnProperty.call(data, key)) {
-            normalizedObj[key] = normalizeData(data[key]);
-          }
-        }
-        return normalizedObj;
-      }
-      return data;
-    }
-    watch(
-      [() => item.value, () => itemTemp.value],
-      ([state, stateCopy]) => {
-        const normalizedState = normalizeData(state);
-        const normalizedStateCopy = normalizeData(stateCopy);
-        isModified.value = !isEqual(normalizedState, normalizedStateCopy);
-      },
-      { deep: true }
-    );
-    const resetModified = createUnrefFn((data, updateInitial = false) => {
-      if (updateInitial) {
-        item.value = data;
-        resetValidationState();
-      }
-      itemTemp.value = cloneDeep(data);
-    });
-    const resetValidationState = () => {
-      isModified.value = false;
-    };
-    return {
-      load,
-      saveChanges,
-      remove,
-      loading,
-      item,
-      validationState
-    };
-  };
-};
-
-const useListFactory = (factoryParams) => {
-  return function useList(options) {
-    const pageSize = options?.pageSize || 20;
-    const searchResult = ref();
-    const searchQuery = ref({
-      take: pageSize,
-      sort: options?.sort
-    });
-    const { loading: itemsLoading, action: load } = useAsync(async (query, ...rest) => {
-      searchQuery.value = { ...searchQuery.value, ...query };
-      searchResult.value = await factoryParams.load?.(query, ...rest);
-    });
-    const { loading: itemsDelete, action: remove } = useAsync(async (customQuery, ...rest) => {
-      await factoryParams.remove?.(searchQuery.value, customQuery, ...rest);
-    });
-    const loading = useLoading(itemsLoading, itemsDelete);
-    const pagination = computed(() => ({
-      currentPage: (searchQuery.value?.skip || 0) / Math.max(1, searchQuery?.value.take || 20) + 1,
-      totalCount: searchResult.value?.totalCount || 0,
-      pageSize,
-      get pages() {
-        return Math.ceil(this.totalCount / this.pageSize);
-      }
-    }));
-    return {
-      items: computed(() => searchResult.value?.results),
-      query: searchQuery,
-      loading,
-      pagination,
-      load,
-      remove
-    };
-  };
-};
-
-const registeredModules = {};
-const installedBladeIds = /* @__PURE__ */ new Set();
-const registeredSchemas = {};
-const createAppModuleWrapper = (args) => {
-  const { bladeName, bladeComponent, appModuleContent } = args;
-  return createAppModule(
-    { [bladeName]: bladeComponent },
-    appModuleContent?.locales,
-    appModuleContent?.notificationTemplates,
-    appModuleContent?.moduleComponents
-  );
-};
-const createBladeInstanceConstructor = (bladeComponent, bladeName, json, args, existingComposables, existingMixins) => {
-  if (json.settings.url) {
-    const rawUrl = json.settings.url;
-    bladeComponent.url = rawUrl;
-  }
-  if (json.settings.permissions) {
-    bladeComponent.permissions = json.settings.permissions;
-  }
-  return defineComponent({
-    ...bladeComponent,
-    name: bladeName,
-    isWorkspace: "isWorkspace" in json.settings && json.settings.isWorkspace,
-    menuItem: ("menuItem" in json.settings && json.settings.menuItem) ?? void 0,
-    moduleUid: args.moduleUid,
-    routable: json.settings.routable ?? true,
-    notifyType: json.settings.pushNotificationType,
-    composables: existingComposables ? { ...existingComposables, ...args.composables } : args.composables,
-    setup: (props, ctx) => (bladeComponent?.setup && bladeComponent.setup(
-      reactiveComputed(
-        () => Object.assign({}, props, {
-          model: json,
-          composables: existingComposables ? { ...existingComposables, ...args.composables } : args.composables,
-          mixinFn: existingMixins ? [...existingMixins, ...args.mixin || []] : args.mixin?.length ? args.mixin : void 0
-        })
-      ),
-      ctx
-    )) ?? {}
-  });
-};
-const register = (args, appModuleContent) => {
-  const { app, component, json, options } = args;
-  const bladeId = json.settings.id;
-  const bladeName = kebabToPascal(bladeId);
-  if (registeredModules[bladeName]) {
-    updateBlade(bladeName, json, args, appModuleContent);
-    return registeredModules[bladeName];
-  }
-  const bladeComponent = cloneDeep(component);
-  const BladeInstanceConstructor2 = createBladeInstanceConstructor(bladeComponent, bladeName, json, args);
-  const module = createAppModuleWrapper({
-    bladeName,
-    bladeComponent: BladeInstanceConstructor2,
-    appModuleContent
-  });
-  module.install(app, options);
-  const newModule = {
-    component: BladeInstanceConstructor2,
-    name: bladeName,
-    model: json,
-    composables: { ...args.composables },
-    mixin: args.mixin
-    // Set mixin directly
-  };
-  registeredModules[bladeName] = newModule;
-  return newModule;
-};
-const handleError = (errorKey, schemas, text) => {
-  return console.error(
-    `Module initialization aborted. Key '${errorKey}' not found in schemas: ${Object.keys(schemas).join(
-      ", "
-    )}. Key '${errorKey}' ${text}`
-  );
-};
-const updateBlade = (moduleName, newSchema, args, appModuleContent) => {
-  const existingModule = registeredModules[moduleName];
-  if (existingModule) {
-    existingModule.model = newSchema;
-    const bladeComponent = cloneDeep(args.component);
-    const BladeInstanceConstructor2 = createBladeInstanceConstructor(
-      bladeComponent,
-      moduleName,
-      newSchema,
-      args,
-      existingModule.composables,
-      existingModule.mixin
-    );
-    const module = createAppModuleWrapper({
-      bladeName: moduleName,
-      bladeComponent: BladeInstanceConstructor2,
-      appModuleContent
-    });
-    module.install(args.app, args.options);
-    existingModule.component = BladeInstanceConstructor2;
-    existingModule.mixin = existingModule.mixin ? [...existingModule.mixin, ...args.mixin || []] : args.mixin;
-  }
-};
-function createDynamicAppModule(args) {
-  let schemaCopy = {};
-  if (args.schema && Object.keys(args.schema).length > 0) {
-    const moduleUid = uniqueId("module_");
-    Object.entries(args.schema).forEach(([, schema]) => {
-      if (schema.settings && schema.settings.id) {
-        schemaCopy[schema.settings.id] = { ...cloneDeep(schema), moduleUid };
-        registeredSchemas[schema.settings.id] = schemaCopy[schema.settings.id];
-      }
-    });
-  } else {
-    schemaCopy = cloneDeep({ ...registeredSchemas });
-  }
-  if (args.overrides) {
-    schemaCopy = handleOverrides(args.overrides, schemaCopy);
-    const newUid = uniqueId("module_");
-    const newSchemas = Object.entries(schemaCopy).reduce(
-      (acc, [key, schema]) => {
-        acc[key] = { ...schema, moduleUid: newUid };
-        return acc;
-      },
-      {}
-    );
-    Object.assign(registeredSchemas, newSchemas);
-  }
-  const moduleInitializer = findKey(schemaCopy, (o) => o.settings.isWorkspace);
-  const everyHasTemplate = every(Object.values(schemaCopy), (o) => o?.settings?.component);
-  if (!everyHasTemplate) handleError("component", schemaCopy, "must be included in 'settings' of each file");
-  if (!moduleInitializer)
-    handleError("isWorkspace", schemaCopy, "must be included in one of the files to initialize the module workspace");
-  return {
-    install(app, options) {
-      const bladePages = { ...pages };
-      const appModuleContent = {
-        locales: args?.locales,
-        notificationTemplates: args?.notificationTemplates,
-        moduleComponents: args?.moduleComponents
-      };
-      const getComposables = (bladeId) => {
-        const composable = schemaCopy[bladeId]?.settings.composable;
-        const composableFn = Object.values(registeredModules).find((module) => {
-          return module.composables?.[composable];
-        });
-        if (!composableFn) {
-          return args.composables;
-        }
-        return composableFn?.composables;
-      };
-      Object.entries(schemaCopy).forEach(([, JsonSchema], index) => {
-        const bladeId = JsonSchema.settings.id;
-        const mixin = args.mixin?.[bladeId];
-        const registerArgs = {
-          app,
-          component: bladePages[JsonSchema.settings.component],
-          composables: getComposables(JsonSchema.settings.id),
-          mixin,
-          json: JsonSchema,
-          options,
-          moduleUid: JsonSchema.moduleUid
-        };
-        if (installedBladeIds.has(bladeId)) {
-          updateBlade(kebabToPascal(bladeId), JsonSchema, registerArgs, index === 0 ? appModuleContent : void 0);
-          return;
-        }
-        installedBladeIds.add(bladeId);
-        register(registerArgs, index === 0 ? appModuleContent : void 0);
-      });
-    }
-  };
-}
-
-export { _sfc_main as _, _sfc_main$1 as a, useListFactory as b, createDynamicAppModule as c, index as i, useDetailsFactory as u };