@vc-shell/framework 1.1.0 → 1.1.2

package/dist/assets/ui-form-Cs5ooOo7.js

@@ -0,0 +1,159 @@
+import { createElementBlock, openBlock, renderSlot, createTextVNode, defineComponent, getCurrentInstance, unref, ref, resolveDirective, withDirectives, createCommentVNode, withModifiers, normalizeClass, createVNode, createElementVNode, toDisplayString, withCtx } from 'vue';
+import { b as _export_sfc, V as VcHint } from './ui-helpers-CF-EUlOg.js';
+import { useField } from 'vee-validate';
+import './ui-indicators-mIQeEqha.js';
+import { _ as _sfc_main$2 } from './ui-media-WWYrwmZw.js';
+import { V as VcLink } from './ui-controls-nmDJYLmC.js';
+import './ui-layout-v2XBQky3.js';
+import './ui-navigation-BtHa6ovW.js';
+import './core-composables-DYxpIWyY.js';
+import './ui-app-D31Pr1WY.js';
+import './ui-content-B7SxH8y9.js';
+import { u as useI18n } 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 './shared-modules-CDP-H5ZB.js';
+import './ui-data-Ci3b1ye0.js';
+import './ui-media-advanced-T8ibi153.js';
+
+const _sfc_main$1 = {  };
+
+function _sfc_render(_ctx, _cache) {
+  return (openBlock(), createElementBlock("form", null, [
+    renderSlot(_ctx.$slots, "default", {}, () => [
+      _cache[0] || (_cache[0] = createTextVNode("vc-form"))
+    ])
+  ]))
+}
+const _Form = /*#__PURE__*/_export_sfc(_sfc_main$1, [['render',_sfc_render]]);
+
+const VcForm = _Form;
+
+const _hoisted_1 = { class: "vc-file-upload__container" };
+const _hoisted_2 = { class: "vc-file-upload__text" };
+const _hoisted_3 = ["accept", "multiple", "name"];
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "vc-file-upload",
+  props: {
+    variant: { default: "gallery" },
+    loading: { type: Boolean },
+    accept: { default: ".jpg, .png, .jpeg, .webp, .heic, .svg" },
+    multiple: { type: Boolean },
+    rules: {},
+    name: { default: "Gallery" },
+    icon: { default: "material-cloud_upload" },
+    customText: {}
+  },
+  emits: ["upload"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const { t } = useI18n({ useScope: "global" });
+    const instance = getCurrentInstance();
+    const internalRules = unref(props.rules) || "";
+    const isDragging = ref(false);
+    const { errorMessage, handleChange, validate } = useField(
+      `${props.name === "Gallery" ? instance?.uid : props.name}`,
+      internalRules
+    );
+    const uploader = ref(null);
+    const upload = async (event) => {
+      await handleChange(event.target);
+      const isValid = await validate();
+      if (isValid.valid) {
+        const target = event.target;
+        const fileList = target.files;
+        if (fileList && fileList.length) {
+          emit("upload", fileList);
+        }
+      }
+    };
+    function toggleUploader() {
+      if (uploader.value) {
+        uploader.value.value = "";
+        uploader.value.click();
+      }
+    }
+    function onDrop(event) {
+      dragLeave();
+      const fileList = event.dataTransfer?.files;
+      if (fileList && fileList.length) {
+        emit("upload", fileList);
+      }
+    }
+    function dragOver() {
+      isDragging.value = true;
+    }
+    function dragLeave() {
+      isDragging.value = false;
+    }
+    return (_ctx, _cache) => {
+      const _directive_loading = resolveDirective("loading");
+      return openBlock(), createElementBlock("div", _hoisted_1, [
+        withDirectives((openBlock(), createElementBlock("div", {
+          class: normalizeClass(["vc-file-upload__drop-zone", [
+            `vc-file-upload__drop-zone--${_ctx.variant}`,
+            {
+              "vc-file-upload__drop-zone--dragging": isDragging.value
+            }
+          ]]),
+          onDrop: withModifiers(onDrop, ["stop", "prevent"]),
+          onDrag: _cache[0] || (_cache[0] = withModifiers(() => {
+          }, ["stop", "prevent"])),
+          onDragstart: _cache[1] || (_cache[1] = withModifiers(() => {
+          }, ["stop", "prevent"])),
+          onDragend: _cache[2] || (_cache[2] = withModifiers(() => {
+          }, ["stop", "prevent"])),
+          onDragover: withModifiers(dragOver, ["stop", "prevent"]),
+          onDragenter: _cache[3] || (_cache[3] = withModifiers(() => {
+          }, ["stop", "prevent"])),
+          onDragleave: withModifiers(dragLeave, ["stop", "prevent"])
+        }, [
+          createVNode(unref(_sfc_main$2), {
+            class: "vc-file-upload__icon",
+            icon: _ctx.icon,
+            size: "xxl"
+          }, null, 8, ["icon"]),
+          createElementVNode("div", _hoisted_2, [
+            createElementVNode("span", null, toDisplayString(_ctx.customText?.dragHere || unref(t)("COMPONENTS.MOLECULES.VC_FILE_UPLOAD.DRAG_HERE")), 1),
+            _cache[4] || (_cache[4] = createTextVNode("   ")),
+            _cache[5] || (_cache[5] = createElementVNode("br", null, null, -1)),
+            createVNode(unref(VcLink), {
+              class: "vc-file-upload__link",
+              onClick: toggleUploader
+            }, {
+              default: withCtx(() => [
+                createTextVNode(toDisplayString(_ctx.customText?.browse || unref(t)("COMPONENTS.MOLECULES.VC_FILE_UPLOAD.BROWSE")), 1)
+              ]),
+              _: 1
+            })
+          ]),
+          createElementVNode("input", {
+            ref_key: "uploader",
+            ref: uploader,
+            type: "file",
+            hidden: "",
+            accept: _ctx.accept,
+            multiple: _ctx.multiple,
+            name: _ctx.name,
+            onChange: upload
+          }, null, 40, _hoisted_3)
+        ], 34)), [
+          [_directive_loading, _ctx.loading]
+        ]),
+        unref(errorMessage) ? renderSlot(_ctx.$slots, "error", { key: 0 }, () => [
+          createVNode(unref(VcHint), { class: "vc-file-upload__error" }, {
+            default: withCtx(() => [
+              createTextVNode(toDisplayString(unref(errorMessage)), 1)
+            ]),
+            _: 1
+          })
+        ]) : createCommentVNode("", true)
+      ]);
+    };
+  }
+});
+
+export { VcForm as V, _sfc_main as _ };