@htlkg/components 0.0.3 → 0.0.4

package/dist/Alert.vue_vue_type_script_setup_true_lang-DxPCS-Hx.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Alert.vue_vue_type_script_setup_true_lang-DxPCS-Hx.js","sources":["../src/overlays/Modal.vue","../src/overlays/Drawer.vue","../src/overlays/Notification.vue","../src/overlays/Alert.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue';\nimport { uiModal as UiModal, type UiModalInterface } from '@hotelinking/ui';\n\ninterface Props {\n  open?: boolean;\n  title?: string;\n  content?: string;\n  modalName?: string;\n  actions?: UiModalInterface['actions'];\n  size?: 'small' | 'medium' | 'large';\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n  open: false,\n  title: '',\n  content: '',\n  modalName: 'modal',\n  actions: () => [],\n  size: 'medium'\n});\n\nconst emit = defineEmits<{\n  'update:open': [value: boolean];\n  'close': [];\n  'action': [action: any];\n}>();\n\n// Internal state synced with v-model\nconst isOpen = computed({\n  get: () => props.open,\n  set: (value: boolean) => {\n    emit('update:open', value);\n    if (!value) {\n      emit('close');\n    }\n  }\n});\n\n// Convert to uiModal format\nconst modalConfig = computed<UiModalInterface>(() => ({\n  title: props.title,\n  content: props.content,\n  modalName: props.modalName,\n  open: isOpen.value,\n  actions: props.actions\n}));\n\n// Handle modal actions from uiModal\n// uiModal emits: { modal: string, action: string }\nfunction handleModalAction(data: { modal: string; action: string }) {\n  emit('action', data);\n  \n  // Close modal when clicking X, clicking outside, or any action\n  // This matches uiModal behavior where any action closes the modal\n  isOpen.value = false;\n}\n\n// Expose methods for parent components\ndefineExpose({\n  open: () => { isOpen.value = true; },\n  close: () => { isOpen.value = false; },\n  toggle: () => { isOpen.value = !isOpen.value; }\n});\n</script>\n\n<template>\n  <UiModal\n    :title=\"modalConfig.title\"\n    :content=\"modalConfig.content\"\n    :modalName=\"modalConfig.modalName\"\n    :open=\"modalConfig.open\"\n    :actions=\"modalConfig.actions\"\n    @modalAction=\"handleModalAction\"\n  >\n    <template v-if=\"$slots.default\" #default>\n      <slot />\n    </template>\n    <template v-if=\"$slots.header\" #header>\n      <slot name=\"header\" />\n    </template>\n    <template v-if=\"$slots.footer\" #footer>\n      <slot name=\"footer\" />\n    </template>\n  </UiModal>\n</template>\n","<script setup lang=\"ts\">\nimport { computed } from 'vue';\n\ninterface Props {\n  open?: boolean;\n  position?: 'left' | 'right' | 'top' | 'bottom';\n  title?: string;\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n  open: false,\n  position: 'right',\n  title: ''\n});\n\nconst emit = defineEmits<{\n  'update:open': [value: boolean];\n  'close': [];\n}>();\n\nconst isOpen = computed({\n  get: () => props.open,\n  set: (value: boolean) => {\n    emit('update:open', value);\n    if (!value) emit('close');\n  }\n});\n\nfunction close() {\n  isOpen.value = false;\n}\n\n// Expose methods for parent components\ndefineExpose({\n  open: () => { isOpen.value = true; },\n  close: () => { isOpen.value = false; },\n  toggle: () => { isOpen.value = !isOpen.value; }\n});\n</script>\n\n<template>\n  <!-- Overlay -->\n  <div\n    v-if=\"isOpen\"\n    class=\"fixed inset-0 bg-black bg-opacity-50 z-50\"\n    @click=\"close\"\n  >\n    <!-- Drawer -->\n    <div\n      class=\"fixed bg-white shadow-xl z-51\"\n      :class=\"{\n        'top-0 right-0 bottom-0 w-96 max-w-[90vw]': position === 'right',\n        'top-0 left-0 bottom-0 w-96 max-w-[90vw]': position === 'left',\n        'top-0 left-0 right-0 h-96 max-h-[90vh]': position === 'top',\n        'bottom-0 left-0 right-0 h-96 max-h-[90vh]': position === 'bottom'\n      }\"\n      @click.stop\n    >\n      <!-- Header -->\n      <div class=\"flex justify-between items-center p-4 border-b border-gray-200\">\n        <h3 class=\"text-lg font-medium\">{{ title }}</h3>\n        <button\n          @click=\"close\"\n          class=\"text-2xl text-gray-500 hover:text-gray-700 bg-transparent border-none cursor-pointer\"\n        >\n          ×\n        </button>\n      </div>\n      \n      <!-- Content -->\n      <div class=\"p-4 overflow-auto\">\n        <slot />\n      </div>\n    </div>\n  </div>\n</template>\n","<script setup lang=\"ts\">\nimport { computed } from 'vue';\nimport { uiNotification } from '@hotelinking/ui';\n\ninterface Props {\n  title: string;\n  message?: string;\n  type?: 'info' | 'success' | 'warning' | 'danger';\n  show?: boolean;\n  fixed?: boolean;\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n  message: '',\n  type: 'info',\n  show: false,\n  fixed: true\n});\n\nconst emit = defineEmits<{\n  'update:show': [value: boolean];\n  'close': [];\n}>();\n\n// Internal state synced with v-model\nconst isVisible = computed({\n  get: () => props.show,\n  set: (value: boolean) => {\n    emit('update:show', value);\n    if (!value) {\n      emit('close');\n    }\n  }\n});\n\n// Handle notification close\nfunction handleClose() {\n  isVisible.value = false;\n}\n\n// Expose methods for parent components\ndefineExpose({\n  show: () => { isVisible.value = true; },\n  hide: () => { isVisible.value = false; },\n  toggle: () => { isVisible.value = !isVisible.value; }\n});\n</script>\n\n<template>\n  <uiNotification\n    :show=\"isVisible\"\n    :type=\"type\"\n    :title=\"title\"\n    :message=\"message\"\n    :fixed=\"fixed\"\n    @close-notification=\"handleClose\"\n  />\n</template>\n","<script setup lang=\"ts\">\nimport { computed } from 'vue';\nimport { uiAlert, type UiAlertInterface } from '@hotelinking/ui';\n\ninterface Props {\n  title: string;\n  type?: UiAlertInterface['type'];\n  actions?: UiAlertInterface['actions'];\n  loading?: boolean;\n  show?: boolean;\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n  type: 'info',\n  actions: () => [],\n  loading: false,\n  show: true\n});\n\nconst emit = defineEmits<{\n  'update:show': [value: boolean];\n  'alertEvent': [event: string];\n  'close': [];\n}>();\n\n// Internal state synced with v-model\nconst isVisible = computed({\n  get: () => props.show,\n  set: (value: boolean) => {\n    emit('update:show', value);\n    if (!value) {\n      emit('close');\n    }\n  }\n});\n\n// Convert to uiAlert format\nconst alertConfig = computed<UiAlertInterface>(() => ({\n  title: props.title,\n  type: props.type,\n  actions: props.actions,\n  loading: props.loading\n}));\n\n// Handle alert action events from uiAlert\nfunction handleAlertEvent(event: string) {\n  emit('alertEvent', event);\n}\n\n// Expose methods for parent components\ndefineExpose({\n  show: () => { isVisible.value = true; },\n  hide: () => { isVisible.value = false; },\n  toggle: () => { isVisible.value = !isVisible.value; }\n});\n</script>\n\n<template>\n  <div v-if=\"isVisible\">\n    <uiAlert\n      :title=\"alertConfig.title\"\n      :type=\"alertConfig.type\"\n      :actions=\"alertConfig.actions\"\n      :loading=\"alertConfig.loading\"\n      @alert-event=\"handleAlertEvent\"\n    >\n      <slot />\n    </uiAlert>\n  </div>\n</template>\n"],"names":["_createBlock","_unref","UiModal","$slots","_renderSlot","_createElementBlock","_createElementVNode","_hoisted_1","_toDisplayString","_createVNode"],"mappings":"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"}

package/dist/DateRange.vue_vue_type_script_setup_true_lang-BLVg1Hah.js

@@ -0,0 +1,580 @@
+import { defineComponent, computed, ref, createElementBlock, openBlock, createCommentVNode, createElementVNode, toDisplayString, Fragment, renderList, createBlock, unref, createTextVNode, renderSlot, createVNode, withCtx, watch } from "vue";
+import _Ajv from "ajv";
+import addFormats from "ajv-formats";
+import { uiInput, uiTextArea, uiSelect, uiToggle, uiRangeSlider, uiButton, uiDateRange } from "@hotelinking/ui";
+const _hoisted_1 = {
+  key: 0,
+  class: "mb-6"
+};
+const _hoisted_2 = {
+  key: 0,
+  class: "text-2xl font-bold text-gray-900 mb-2"
+};
+const _hoisted_3 = {
+  key: 1,
+  class: "text-gray-600"
+};
+const _hoisted_4 = {
+  key: 1,
+  class: "space-y-6"
+};
+const _hoisted_5 = {
+  key: 5,
+  class: "flex items-start"
+};
+const _hoisted_6 = ["id", "checked", "disabled", "onChange"];
+const _hoisted_7 = ["for"];
+const _hoisted_8 = { class: "text-sm font-medium text-gray-700" };
+const _hoisted_9 = {
+  key: 0,
+  class: "text-red-500"
+};
+const _hoisted_10 = {
+  key: 0,
+  class: "text-sm text-gray-500"
+};
+const _hoisted_11 = {
+  key: 7,
+  class: "space-y-2"
+};
+const _hoisted_12 = { class: "block text-sm font-medium text-gray-700" };
+const _hoisted_13 = {
+  key: 0,
+  class: "text-red-500"
+};
+const _hoisted_14 = {
+  key: 0,
+  class: "text-sm text-gray-500 mb-2"
+};
+const _hoisted_15 = {
+  key: 1,
+  class: "text-sm text-red-600 mb-2"
+};
+const _hoisted_16 = { class: "space-y-2" };
+const _hoisted_17 = ["value", "disabled", "onInput"];
+const _hoisted_18 = ["onClick", "disabled"];
+const _hoisted_19 = ["onClick", "disabled"];
+const _hoisted_20 = {
+  key: 8,
+  class: "border border-gray-200 rounded-lg p-4 space-y-4"
+};
+const _hoisted_21 = { class: "text-lg font-semibold text-gray-900 mb-1" };
+const _hoisted_22 = {
+  key: 0,
+  class: "text-sm text-gray-600 mb-4"
+};
+const _hoisted_23 = { class: "space-y-4 pl-4 border-l-2 border-gray-200" };
+const _hoisted_24 = { class: "text-sm text-gray-500" };
+const _hoisted_25 = { class: "flex justify-end gap-3 pt-6 border-t" };
+const _sfc_main$1 = /* @__PURE__ */ defineComponent({
+  __name: "JsonSchemaForm",
+  props: {
+    schema: {},
+    modelValue: { default: () => ({}) },
+    uiSchema: { default: () => ({}) },
+    loading: { type: Boolean, default: false }
+  },
+  emits: ["update:modelValue", "validation-error", "submit"],
+  setup(__props, { expose: __expose, emit: __emit }) {
+    const Ajv = _Ajv.default ?? _Ajv;
+    const ajv = new Ajv({ allErrors: true });
+    addFormats(ajv);
+    const props = __props;
+    const emit = __emit;
+    const formData = computed({
+      get: () => props.modelValue,
+      set: (value) => {
+        emit("update:modelValue", value);
+      }
+    });
+    const errors = ref({});
+    const touched = ref({});
+    function getWidget(fieldName) {
+      var _a;
+      const uiSchemaField = props.uiSchema[fieldName];
+      if (uiSchemaField == null ? void 0 : uiSchemaField["ui:widget"]) {
+        return uiSchemaField["ui:widget"];
+      }
+      const fieldSchema = (_a = props.schema.properties) == null ? void 0 : _a[fieldName];
+      if (!fieldSchema) return "text";
+      if (fieldSchema.type === "boolean") return "toggle";
+      if (fieldSchema.type === "number" || fieldSchema.type === "integer") {
+        return "number";
+      }
+      if (fieldSchema.type === "string") {
+        if (fieldSchema.enum) return "select";
+        if (fieldSchema.format === "email") return "email";
+        if (fieldSchema.format === "uri") return "url";
+        if (fieldSchema.minLength && fieldSchema.minLength > 100) return "textarea";
+      }
+      if (fieldSchema.type === "array") return "array";
+      if (fieldSchema.type === "object") return "object";
+      return "text";
+    }
+    function getInputType(fieldName) {
+      const widget = getWidget(fieldName);
+      if (widget === "password") return "password";
+      if (widget === "email") return "email";
+      if (widget === "number") return "number";
+      if (widget === "date") return "date";
+      if (widget === "datetime-local") return "datetime-local";
+      return "text";
+    }
+    function getFieldColor(fieldName) {
+      if (errors.value[fieldName]) return "red";
+      if (touched.value[fieldName]) {
+        const value = formData.value[fieldName];
+        if (isRequired(fieldName) && value !== void 0 && value !== null && value !== "") {
+          return "green";
+        }
+      }
+      return "gray";
+    }
+    function isRequired(fieldName) {
+      var _a;
+      return ((_a = props.schema.required) == null ? void 0 : _a.includes(fieldName)) ?? false;
+    }
+    function getFieldLabel(fieldName) {
+      var _a;
+      const fieldSchema = (_a = props.schema.properties) == null ? void 0 : _a[fieldName];
+      return (fieldSchema == null ? void 0 : fieldSchema.title) || fieldName;
+    }
+    function getFieldDescription(fieldName) {
+      var _a;
+      const fieldSchema = (_a = props.schema.properties) == null ? void 0 : _a[fieldName];
+      return (fieldSchema == null ? void 0 : fieldSchema.description) || "";
+    }
+    function getPlaceholder(fieldName) {
+      var _a;
+      return ((_a = props.uiSchema[fieldName]) == null ? void 0 : _a["ui:placeholder"]) || "";
+    }
+    function validate() {
+      const validationErrors = [];
+      errors.value = {};
+      const validateFn = ajv.compile(props.schema);
+      const valid = validateFn(formData.value);
+      if (!valid && validateFn.errors) {
+        for (const error of validateFn.errors) {
+          const field = error.instancePath.replace(/^\//, "") || error.params.missingProperty || "form";
+          let message = "";
+          if (error.keyword === "required") {
+            const missingField = error.params.missingProperty;
+            message = `${getFieldLabel(missingField)} is required`;
+            errors.value[missingField] = message;
+            validationErrors.push({ field: missingField, message });
+          } else if (error.keyword === "type") {
+            message = `${getFieldLabel(field)} must be a ${error.params.type}`;
+            errors.value[field] = message;
+            validationErrors.push({ field, message });
+          } else if (error.keyword === "minimum") {
+            message = `${getFieldLabel(field)} must be at least ${error.params.limit}`;
+            errors.value[field] = message;
+            validationErrors.push({ field, message });
+          } else if (error.keyword === "maximum") {
+            message = `${getFieldLabel(field)} must be at most ${error.params.limit}`;
+            errors.value[field] = message;
+            validationErrors.push({ field, message });
+          } else if (error.keyword === "minLength") {
+            message = `${getFieldLabel(field)} must be at least ${error.params.limit} characters`;
+            errors.value[field] = message;
+            validationErrors.push({ field, message });
+          } else if (error.keyword === "maxLength") {
+            message = `${getFieldLabel(field)} must be at most ${error.params.limit} characters`;
+            errors.value[field] = message;
+            validationErrors.push({ field, message });
+          } else if (error.keyword === "format") {
+            message = `${getFieldLabel(field)} must be a valid ${error.params.format}`;
+            errors.value[field] = message;
+            validationErrors.push({ field, message });
+          } else if (error.keyword === "enum") {
+            message = `${getFieldLabel(field)} must be one of: ${error.params.allowedValues.join(", ")}`;
+            errors.value[field] = message;
+            validationErrors.push({ field, message });
+          } else {
+            message = error.message || "Invalid value";
+            errors.value[field] = message;
+            validationErrors.push({ field, message });
+          }
+        }
+      }
+      return validationErrors;
+    }
+    function handleSubmit(event) {
+      event.preventDefault();
+      const validationErrors = validate();
+      if (validationErrors.length > 0) {
+        emit("validation-error", validationErrors);
+        return;
+      }
+      emit("submit", formData.value);
+    }
+    function updateField(field, value) {
+      touched.value[field] = true;
+      const newData = {
+        ...formData.value,
+        [field]: value
+      };
+      emit("update:modelValue", newData);
+      validateFieldWithValue(field, value);
+    }
+    function validateField(fieldName) {
+      validateFieldWithValue(fieldName, formData.value[fieldName]);
+    }
+    function validateFieldWithValue(fieldName, fieldValue) {
+      var _a;
+      const fieldSchema = (_a = props.schema.properties) == null ? void 0 : _a[fieldName];
+      if (!fieldSchema) return;
+      delete errors.value[fieldName];
+      if (isRequired(fieldName) && (fieldValue === void 0 || fieldValue === null || fieldValue === "")) {
+        errors.value[fieldName] = `${getFieldLabel(fieldName)} is required`;
+        return;
+      }
+      if (fieldValue === void 0 || fieldValue === null || fieldValue === "") {
+        return;
+      }
+      const singleFieldSchema = {
+        type: "object",
+        properties: {
+          [fieldName]: fieldSchema
+        }
+      };
+      const validateFn = ajv.compile(singleFieldSchema);
+      const valid = validateFn({ [fieldName]: fieldValue });
+      if (!valid && validateFn.errors) {
+        for (const error of validateFn.errors) {
+          let message = "";
+          if (error.keyword === "type") {
+            message = `${getFieldLabel(fieldName)} must be a ${error.params.type}`;
+          } else if (error.keyword === "minimum") {
+            message = `${getFieldLabel(fieldName)} must be at least ${error.params.limit}`;
+          } else if (error.keyword === "maximum") {
+            message = `${getFieldLabel(fieldName)} must be at most ${error.params.limit}`;
+          } else if (error.keyword === "minLength") {
+            message = `${getFieldLabel(fieldName)} must be at least ${error.params.limit} characters`;
+          } else if (error.keyword === "maxLength") {
+            message = `${getFieldLabel(fieldName)} must be at most ${error.params.limit} characters`;
+          } else if (error.keyword === "format") {
+            message = `${getFieldLabel(fieldName)} must be a valid ${error.params.format}`;
+          } else if (error.keyword === "enum") {
+            message = `${getFieldLabel(fieldName)} must be one of: ${error.params.allowedValues.join(", ")}`;
+          } else {
+            message = error.message || "Invalid value";
+          }
+          errors.value[fieldName] = message;
+          break;
+        }
+      }
+    }
+    function getSelectOptions(fieldName) {
+      var _a;
+      const fieldSchema = (_a = props.schema.properties) == null ? void 0 : _a[fieldName];
+      if (!(fieldSchema == null ? void 0 : fieldSchema.enum)) return [];
+      return fieldSchema.enum.map((value) => ({
+        id: String(value),
+        name: String(value),
+        label: String(value)
+      }));
+    }
+    function getSelectedOption(fieldName) {
+      const value = formData.value[fieldName];
+      if (!value) {
+        const options = getSelectOptions(fieldName);
+        return options.length > 0 ? options[0] : { id: "", name: "", label: "" };
+      }
+      return {
+        id: String(value),
+        name: String(value),
+        label: String(value)
+      };
+    }
+    function addArrayItem(fieldName) {
+      const currentArray = formData.value[fieldName] || [];
+      updateField(fieldName, [...currentArray, ""]);
+    }
+    function removeArrayItem(fieldName, index) {
+      const currentArray = formData.value[fieldName] || [];
+      const newArray = currentArray.filter((_, i) => i !== index);
+      updateField(fieldName, newArray);
+    }
+    function updateArrayItem(fieldName, index, value) {
+      const currentArray = formData.value[fieldName] || [];
+      const newArray = [...currentArray];
+      newArray[index] = value;
+      updateField(fieldName, newArray);
+    }
+    __expose({
+      validate,
+      validateField,
+      reset: () => {
+        emit("update:modelValue", {});
+        errors.value = {};
+        touched.value = {};
+      },
+      // Expose internal state for testing
+      formData,
+      errors,
+      touched,
+      // Expose helper methods for testing
+      getFieldLabel,
+      getFieldDescription,
+      isRequired,
+      getWidget,
+      getInputType,
+      getFieldColor,
+      getPlaceholder,
+      getSelectOptions,
+      getSelectedOption,
+      updateField
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("form", {
+        onSubmit: handleSubmit,
+        class: "space-y-6"
+      }, [
+        __props.schema.title || __props.schema.description ? (openBlock(), createElementBlock("div", _hoisted_1, [
+          __props.schema.title ? (openBlock(), createElementBlock("h2", _hoisted_2, toDisplayString(__props.schema.title), 1)) : createCommentVNode("", true),
+          __props.schema.description ? (openBlock(), createElementBlock("p", _hoisted_3, toDisplayString(__props.schema.description), 1)) : createCommentVNode("", true)
+        ])) : createCommentVNode("", true),
+        __props.schema.properties ? (openBlock(), createElementBlock("div", _hoisted_4, [
+          (openBlock(true), createElementBlock(Fragment, null, renderList(__props.schema.properties, (fieldSchema, fieldName) => {
+            var _a, _b, _c, _d;
+            return openBlock(), createElementBlock("div", { key: fieldName }, [
+              ["text", "email", "url", "password"].includes(getWidget(fieldName)) ? (openBlock(), createBlock(unref(uiInput), {
+                key: 0,
+                name: fieldName,
+                label: getFieldLabel(fieldName),
+                type: getInputType(fieldName),
+                value: formData.value[fieldName] || "",
+                placeholder: getPlaceholder(fieldName),
+                error: errors.value[fieldName],
+                color: getFieldColor(fieldName),
+                loading: __props.loading,
+                "required-text": isRequired(fieldName) ? "*" : void 0,
+                onInputChanged: ($event) => updateField(fieldName, $event.value)
+              }, null, 8, ["name", "label", "type", "value", "placeholder", "error", "color", "loading", "required-text", "onInputChanged"])) : getWidget(fieldName) === "number" ? (openBlock(), createBlock(unref(uiInput), {
+                key: 1,
+                name: fieldName,
+                label: getFieldLabel(fieldName),
+                type: "number",
+                value: String(formData.value[fieldName] ?? ""),
+                placeholder: getPlaceholder(fieldName),
+                error: errors.value[fieldName],
+                color: getFieldColor(fieldName),
+                loading: __props.loading,
+                "required-text": isRequired(fieldName) ? "*" : void 0,
+                min: (_b = (_a = __props.schema.properties) == null ? void 0 : _a[fieldName]) == null ? void 0 : _b.minimum,
+                max: (_d = (_c = __props.schema.properties) == null ? void 0 : _c[fieldName]) == null ? void 0 : _d.maximum,
+                onInputChanged: ($event) => updateField(fieldName, $event.value === "" ? null : Number($event.value))
+              }, null, 8, ["name", "label", "value", "placeholder", "error", "color", "loading", "required-text", "min", "max", "onInputChanged"])) : getWidget(fieldName) === "textarea" ? (openBlock(), createBlock(unref(uiTextArea), {
+                key: 2,
+                name: fieldName,
+                label: getFieldLabel(fieldName),
+                value: formData.value[fieldName] || "",
+                placeholder: getPlaceholder(fieldName),
+                error: errors.value[fieldName],
+                color: getFieldColor(fieldName),
+                loading: __props.loading,
+                "required-text": isRequired(fieldName) ? "*" : void 0,
+                rows: 4,
+                onInputChanged: ($event) => updateField(fieldName, $event.value)
+              }, null, 8, ["name", "label", "value", "placeholder", "error", "color", "loading", "required-text", "onInputChanged"])) : getWidget(fieldName) === "select" ? (openBlock(), createBlock(unref(uiSelect), {
+                key: 3,
+                label: getFieldLabel(fieldName),
+                items: getSelectOptions(fieldName),
+                select: getSelectedOption(fieldName),
+                placeholder: getPlaceholder(fieldName) || "Select an option",
+                error: errors.value[fieldName],
+                color: getFieldColor(fieldName),
+                loading: __props.loading,
+                "required-text": isRequired(fieldName) ? "*" : void 0,
+                onSelectChanged: (item) => updateField(fieldName, item.id)
+              }, null, 8, ["label", "items", "select", "placeholder", "error", "color", "loading", "required-text", "onSelectChanged"])) : getWidget(fieldName) === "toggle" ? (openBlock(), createBlock(unref(uiToggle), {
+                key: 4,
+                item: {
+                  title: getFieldLabel(fieldName),
+                  subtitle: getFieldDescription(fieldName),
+                  action: fieldName
+                },
+                checked: formData.value[fieldName],
+                loading: __props.loading,
+                onToggleChanged: ($event) => updateField(fieldName, $event.active)
+              }, null, 8, ["item", "checked", "loading", "onToggleChanged"])) : getWidget(fieldName) === "checkbox" ? (openBlock(), createElementBlock("div", _hoisted_5, [
+                createElementVNode("input", {
+                  id: fieldName,
+                  type: "checkbox",
+                  checked: formData.value[fieldName],
+                  disabled: __props.loading,
+                  onChange: ($event) => updateField(fieldName, $event.target.checked),
+                  class: "h-4 w-4 text-blue-600 focus:ring-blue-500 border-gray-300 rounded mt-1"
+                }, null, 40, _hoisted_6),
+                createElementVNode("label", {
+                  for: fieldName,
+                  class: "ml-2 block"
+                }, [
+                  createElementVNode("span", _hoisted_8, [
+                    createTextVNode(toDisplayString(getFieldLabel(fieldName)) + " ", 1),
+                    isRequired(fieldName) ? (openBlock(), createElementBlock("span", _hoisted_9, "*")) : createCommentVNode("", true)
+                  ]),
+                  getFieldDescription(fieldName) ? (openBlock(), createElementBlock("p", _hoisted_10, toDisplayString(getFieldDescription(fieldName)), 1)) : createCommentVNode("", true)
+                ], 8, _hoisted_7)
+              ])) : getWidget(fieldName) === "slider" ? (openBlock(), createBlock(unref(uiRangeSlider), {
+                key: 6,
+                label: getFieldLabel(fieldName),
+                min: __props.schema.properties[fieldName].minimum ?? 0,
+                max: __props.schema.properties[fieldName].maximum ?? 100,
+                "slider-value": formData.value[fieldName] ?? __props.schema.properties[fieldName].minimum ?? 0,
+                loading: __props.loading,
+                "required-text": isRequired(fieldName) ? "*" : void 0,
+                onSliderUpdated: ($event) => updateField(fieldName, $event)
+              }, null, 8, ["label", "min", "max", "slider-value", "loading", "required-text", "onSliderUpdated"])) : getWidget(fieldName) === "array" ? (openBlock(), createElementBlock("div", _hoisted_11, [
+                createElementVNode("label", _hoisted_12, [
+                  createTextVNode(toDisplayString(getFieldLabel(fieldName)) + " ", 1),
+                  isRequired(fieldName) ? (openBlock(), createElementBlock("span", _hoisted_13, "*")) : createCommentVNode("", true)
+                ]),
+                getFieldDescription(fieldName) ? (openBlock(), createElementBlock("p", _hoisted_14, toDisplayString(getFieldDescription(fieldName)), 1)) : createCommentVNode("", true),
+                errors.value[fieldName] ? (openBlock(), createElementBlock("div", _hoisted_15, toDisplayString(errors.value[fieldName]), 1)) : createCommentVNode("", true),
+                createElementVNode("div", _hoisted_16, [
+                  (openBlock(true), createElementBlock(Fragment, null, renderList(formData.value[fieldName] || [], (item, index) => {
+                    return openBlock(), createElementBlock("div", {
+                      key: index,
+                      class: "flex gap-2"
+                    }, [
+                      createElementVNode("input", {
+                        type: "text",
+                        value: item,
+                        disabled: __props.loading,
+                        onInput: ($event) => updateArrayItem(fieldName, index, $event.target.value),
+                        class: "flex-1 px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
+                      }, null, 40, _hoisted_17),
+                      createElementVNode("button", {
+                        type: "button",
+                        onClick: ($event) => removeArrayItem(fieldName, index),
+                        disabled: __props.loading,
+                        class: "px-3 py-2 text-red-600 hover:text-red-800 border border-red-300 rounded-md"
+                      }, " Remove ", 8, _hoisted_18)
+                    ]);
+                  }), 128))
+                ]),
+                createElementVNode("button", {
+                  type: "button",
+                  onClick: ($event) => addArrayItem(fieldName),
+                  disabled: __props.loading,
+                  class: "mt-2 px-4 py-2 text-sm text-blue-600 hover:text-blue-800 border border-blue-300 rounded-md"
+                }, " + Add Item ", 8, _hoisted_19)
+              ])) : getWidget(fieldName) === "object" || getWidget(fieldName) === "card" ? (openBlock(), createElementBlock("div", _hoisted_20, [
+                createElementVNode("div", null, [
+                  createElementVNode("h3", _hoisted_21, toDisplayString(getFieldLabel(fieldName)), 1),
+                  getFieldDescription(fieldName) ? (openBlock(), createElementBlock("p", _hoisted_22, toDisplayString(getFieldDescription(fieldName)), 1)) : createCommentVNode("", true)
+                ]),
+                createElementVNode("div", _hoisted_23, [
+                  (openBlock(true), createElementBlock(Fragment, null, renderList(fieldSchema.properties, (subSchema, subName) => {
+                    return openBlock(), createElementBlock("div", { key: subName }, [
+                      createElementVNode("p", _hoisted_24, " Nested field: " + toDisplayString(subName) + " (type: " + toDisplayString(subSchema.type) + ") ", 1)
+                    ]);
+                  }), 128))
+                ])
+              ])) : createCommentVNode("", true)
+            ]);
+          }), 128))
+        ])) : createCommentVNode("", true),
+        createElementVNode("div", _hoisted_25, [
+          renderSlot(_ctx.$slots, "actions", {}, () => [
+            createVNode(unref(uiButton), {
+              type: "submit",
+              color: "primary",
+              loading: __props.loading
+            }, {
+              default: withCtx(() => [..._cache[0] || (_cache[0] = [
+                createTextVNode(" Submit ", -1)
+              ])]),
+              _: 1
+            }, 8, ["loading"])
+          ])
+        ])
+      ], 32);
+    };
+  }
+});
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "DateRange",
+  props: {
+    id: { default: () => `date-range-${Math.random().toString(36).substr(2, 9)}` },
+    modelValue: { default: () => ({
+      from: "",
+      to: (/* @__PURE__ */ new Date()).toISOString().slice(0, 16)
+    }) },
+    literals: { default: () => ({
+      from: "From",
+      to: "To",
+      search: "Search"
+    }) },
+    loading: { type: Boolean, default: false },
+    color: {},
+    error: {},
+    disabled: { type: Boolean },
+    label: {},
+    placeholder: {}
+  },
+  emits: ["update:modelValue", "search", "change"],
+  setup(__props, { expose: __expose, emit: __emit }) {
+    var _a, _b;
+    const props = __props;
+    const emit = __emit;
+    const internalValues = ref({
+      from: ((_a = props.modelValue) == null ? void 0 : _a.from) || "",
+      to: ((_b = props.modelValue) == null ? void 0 : _b.to) || (/* @__PURE__ */ new Date()).toISOString().slice(0, 16)
+    });
+    watch(() => props.modelValue, (newValue) => {
+      if (newValue) {
+        internalValues.value = {
+          from: newValue.from || "",
+          to: newValue.to || (/* @__PURE__ */ new Date()).toISOString().slice(0, 16)
+        };
+      }
+    }, { deep: true });
+    function handleSearch(dates) {
+      emit("update:modelValue", dates);
+      emit("search", dates);
+      emit("change", dates);
+    }
+    function reset() {
+      const resetValue = {
+        from: "",
+        to: (/* @__PURE__ */ new Date()).toISOString().slice(0, 16)
+      };
+      internalValues.value = resetValue;
+      emit("update:modelValue", resetValue);
+    }
+    function getValue() {
+      return internalValues.value;
+    }
+    function setValue(value) {
+      internalValues.value = value;
+      emit("update:modelValue", value);
+    }
+    __expose({
+      reset,
+      getValue,
+      setValue
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(uiDateRange), {
+        id: __props.id,
+        loading: __props.loading,
+        literals: __props.literals,
+        values: internalValues.value,
+        color: __props.color,
+        error: __props.error,
+        disabled: __props.disabled,
+        label: __props.label,
+        placeholder: __props.placeholder,
+        onUiDateRangeButtonClicked: handleSearch
+      }, null, 8, ["id", "loading", "literals", "values", "color", "error", "disabled", "label", "placeholder"]);
+    };
+  }
+});
+export {
+  _sfc_main$1 as _,
+  _sfc_main as a
+};
+//# sourceMappingURL=DateRange.vue_vue_type_script_setup_true_lang-BLVg1Hah.js.map