ablok-components 0.3.104 → 0.3.106

package/dist/components/molecules/image-crop-resize/image-crop-resize.vue.js

@@ -1,120 +0,0 @@
-import { defineComponent as h, ref as f, computed as g, watch as b, onMounted as C, openBlock as l, createElementBlock as m, createElementVNode as o, createBlock as v, withCtx as y, withModifiers as c, toDisplayString as r, createCommentVNode as u, createVNode as V, renderSlot as B } from "vue";
-import z from "../image-resize/image-resize.vue.js";
-import N from "../image-crop/image-crop.vue.js";
-import S from "../../atoms/base-image/base-image.vue.js";
-/* empty css                                     */
-import _ from "../../atoms/svg-icon/svg-icon.vue.js";
-/* empty css                                 */
-const x = {
-  key: 0,
-  class: "image-crop-resize position-relative"
-}, E = { class: "row" }, M = { class: "col" }, R = {
-  key: 3,
-  class: "alert alert-warning mt-4 small p-2"
-}, U = { key: 4 }, W = { class: "row" }, q = { class: "col-12" }, D = { class: "d-flex" }, I = {
-  key: 0,
-  class: "d-flex gap-3"
-}, j = { class: "caption" }, A = { class: "caption" }, F = {
-  key: 1,
-  class: "ms-auto"
-}, Q = /* @__PURE__ */ h({
-  __name: "image-crop-resize",
-  props: {
-    modelValue: {
-      type: String,
-      default: 'data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg"/>',
-      required: !0
-    },
-    spinner: {
-      type: Boolean,
-      default: !1
-    },
-    ready: {
-      type: Boolean,
-      default: !1
-    },
-    aspectRatio: Number
-  },
-  emits: ["update:modelValue"],
-  setup(d, { emit: k }) {
-    const p = d, $ = k, s = f(!1), a = f(!1), i = g({
-      get: () => p.modelValue,
-      set: (t) => $("update:modelValue", t)
-    }), w = g(() => p.modelValue.startsWith("data:image/svg+xml"));
-    return b(() => [s.value, i.value], (t, e) => {
-      t[0] && t[0] === e[0] && (s.value = !1);
-    }), b(() => [a.value, i.value], (t, e) => {
-      t[0] && t[0] === e[0] && (a.value = !1);
-    }), C(() => {
-    }), (t, e) => d.modelValue ? (l(), m("div", x, [
-      o("div", E, [
-        o("div", M, [
-          s.value || a.value ? s.value ? (l(), v(z, {
-            key: 1,
-            modelValue: i.value,
-            "onUpdate:modelValue": e[1] || (e[1] = (n) => i.value = n)
-          }, {
-            actions: y(() => [
-              o("button", {
-                class: "btn btn-outline-ccontrast",
-                onClick: e[0] || (e[0] = c((n) => s.value = !1, ["prevent", "stop"]))
-              }, r(t.$t("common.cancel")), 1)
-            ]),
-            _: 1
-          }, 8, ["modelValue"])) : a.value ? (l(), v(N, {
-            key: 2,
-            modelValue: i.value,
-            "onUpdate:modelValue": e[3] || (e[3] = (n) => i.value = n),
-            "suggested-aspect-ratio": d.aspectRatio
-          }, {
-            actions: y(() => [
-              o("button", {
-                class: "btn btn-sm btn-outline-ccontrast",
-                onClick: e[2] || (e[2] = c((n) => a.value = !1, ["prevent", "stop"]))
-              }, r(t.$t("common.cancel")), 1)
-            ]),
-            _: 1
-          }, 8, ["modelValue", "suggested-aspect-ratio"])) : u("", !0) : (l(), v(S, {
-            key: 0,
-            ref: "targetImage",
-            class: "",
-            animate: !1,
-            src: d.modelValue
-          }, null, 8, ["src"])),
-          w.value ? (l(), m("div", R, r(t.$t("common.svgWarning")), 1)) : u("", !0),
-          !a.value && !s.value ? (l(), m("hr", U)) : u("", !0),
-          o("div", W, [
-            o("div", q, [
-              o("div", D, [
-                !a.value && !s.value ? (l(), m("div", I, [
-                  o("button", {
-                    type: "button",
-                    class: "btn btn-light",
-                    onClick: e[4] || (e[4] = c((n) => a.value = !a.value, ["prevent", "stop"]))
-                  }, [
-                    V(_, { symbol: "crop" }),
-                    o("span", j, r(t.$t("common.crop")), 1)
-                  ]),
-                  o("button", {
-                    type: "button",
-                    class: "btn btn-light",
-                    onClick: e[5] || (e[5] = c((n) => s.value = !s.value, ["prevent", "stop"]))
-                  }, [
-                    V(_, { symbol: "image-upscale" }),
-                    o("span", A, r(t.$t("common.resize")), 1)
-                  ])
-                ])) : u("", !0),
-                !a.value && !s.value ? (l(), m("div", F, [
-                  B(t.$slots, "submit")
-                ])) : u("", !0)
-              ])
-            ])
-          ])
-        ])
-      ])
-    ])) : u("", !0);
-  }
-});
-export {
-  Q as default
-};

package/dist/components/molecules/image-crop-resize/image-crop-resize2.vue.js

@@ -1,4 +0,0 @@
-import f from "./image-crop-resize.vue.js";
-export {
-  f as default
-};

package/dist/components/molecules/image-resize/image-resize.vue.js

@@ -1,143 +0,0 @@
-import { defineComponent as x, useTemplateRef as E, ref as d, watch as v, onMounted as k, openBlock as h, createElementBlock as R, createElementVNode as t, createVNode as p, createBlock as S, createCommentVNode as _, withDirectives as $, vModelText as B, renderSlot as I, withModifiers as N, toDisplayString as z } from "vue";
-import C from "../../../_virtual/debounce.js";
-import { resizeImageElementToDataUrl as U } from "../../../utilities/helpers.js";
-import b from "../../atoms/base-image/base-image.vue.js";
-/* empty css                                     */
-import y from "../../atoms/base-input/base-input.vue.js";
-/* empty css                                     */
-const q = {
-  key: 0,
-  class: "image-editor position-relative"
-}, D = { class: "row mb-3" }, H = { class: "col" }, T = { class: "row gap-2 mb-4" }, W = { class: "col-12" }, A = { class: "input mb-2" }, F = { class: "col" }, L = { class: "input mb-0" }, j = { class: "col" }, G = { class: "input mb-0" }, J = { class: "row" }, K = { class: "col d-flex justify-content-end gap-2" }, O = ["disabled"], ae = /* @__PURE__ */ x({
-  __name: "image-resize",
-  props: {
-    modelValue: {
-      type: String,
-      default: 'data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg"/>',
-      required: !0
-    },
-    spinner: {
-      type: Boolean,
-      default: !1
-    },
-    ready: {
-      type: Boolean,
-      default: !1
-    }
-  },
-  emits: ["update:modelValue"],
-  setup(f, { emit: V }) {
-    const w = V, m = E("image"), n = d(1), l = d(0), i = d(0), r = d(null), s = d(0), u = d(0);
-    function M() {
-      r.value && (w("update:modelValue", r.value), n.value = 1);
-    }
-    const g = () => {
-      if (!s.value || !u.value) return;
-      l.value = Math.round(s.value * n.value);
-      const a = u.value / s.value;
-      i.value = Math.round(l.value * a);
-      const e = m.value?.$el;
-      if (!e) return;
-      const o = e.querySelector("img");
-      o && (r.value = U(o, l.value, i.value, "image/png"));
-    }, c = C(g, 300);
-    return v(n, () => {
-      s.value && (l.value = Math.round(s.value * n.value), c());
-    }), v(l, () => {
-      if (!s.value || l.value === 0) return;
-      const a = l.value / s.value;
-      Math.abs(a - n.value) > 1e-4 && (n.value = Number(a.toFixed(4)));
-      const e = u.value / s.value;
-      i.value = Math.round(l.value * e), c();
-    }), v(i, () => {
-      if (!u.value || i.value === 0) return;
-      const a = i.value / u.value;
-      Math.abs(a - n.value) > 1e-4 && (n.value = Number(a.toFixed(4)));
-      const e = s.value / u.value;
-      l.value = Math.round(i.value * e), c();
-    }), k(() => {
-      const a = m.value?.$el;
-      if (!a) return;
-      const e = a.querySelector("img");
-      if (!e) return;
-      const o = () => {
-        s.value = e.naturalWidth, u.value = e.naturalHeight, g();
-      };
-      e.complete ? o() : e.addEventListener("load", o);
-    }), (a, e) => f.modelValue ? (h(), R("div", q, [
-      t("div", D, [
-        t("div", H, [
-          p(b, {
-            ref_key: "image",
-            ref: m,
-            class: "d-none",
-            src: f.modelValue,
-            animate: !1
-          }, null, 8, ["src"]),
-          r.value ? (h(), S(b, {
-            key: 0,
-            ref: "targetImage",
-            class: "",
-            src: r.value,
-            animate: !1
-          }, null, 8, ["src"])) : _("", !0)
-        ])
-      ]),
-      t("div", T, [
-        t("div", W, [
-          t("div", A, [
-            $(t("input", {
-              type: "range",
-              class: "form-range",
-              id: "scaleRange",
-              "onUpdate:modelValue": e[0] || (e[0] = (o) => n.value = o),
-              min: "0",
-              max: "2",
-              step: "0.0001"
-            }, null, 512), [
-              [B, n.value]
-            ])
-          ])
-        ]),
-        t("div", F, [
-          t("div", L, [
-            p(y, {
-              type: "number",
-              class: "form-input mb-0",
-              id: "targetWidth",
-              modelValue: l.value,
-              "onUpdate:modelValue": e[1] || (e[1] = (o) => l.value = o)
-            }, null, 8, ["modelValue"])
-          ])
-        ]),
-        e[3] || (e[3] = t("div", { class: "col-auto d-flex align-items-center" }, [
-          t("output", null, "×")
-        ], -1)),
-        t("div", j, [
-          t("div", G, [
-            p(y, {
-              type: "number",
-              class: "form-input mb-0",
-              id: "targetHeight",
-              modelValue: i.value,
-              "onUpdate:modelValue": e[2] || (e[2] = (o) => i.value = o)
-            }, null, 8, ["modelValue"])
-          ])
-        ])
-      ]),
-      t("div", J, [
-        t("div", K, [
-          I(a.$slots, "actions"),
-          t("button", {
-            class: "btn btn-sm btn-primary",
-            disabled: !r.value,
-            onClick: N(M, ["prevent", "stop"])
-          }, z(a.$t("common.apply")), 9, O)
-        ])
-      ])
-    ])) : _("", !0);
-  }
-});
-export {
-  ae as default
-};

package/dist/components/molecules/image-resize/image-resize2.vue.js

@@ -1,4 +0,0 @@
-import f from "./image-resize.vue.js";
-export {
-  f as default
-};

package/dist/components/molecules/image-upload/image-upload.vue.js

@@ -1,289 +0,0 @@
-import { defineComponent as P, ref as u, toRef as Q, computed as H, watch as v, onBeforeUnmount as O, openBlock as s, createElementBlock as p, normalizeClass as C, unref as $, Fragment as q, createVNode as d, normalizeStyle as E, createElementVNode as n, withModifiers as h, createCommentVNode as V, renderSlot as j, Transition as A, withCtx as B, createBlock as G, toDisplayString as J } from "vue";
-import K from "../image-crop-resize/image-crop-resize.vue.js";
-import X from "../../atoms/base-image/base-image.vue.js";
-/* empty css                                     */
-import z from "../../atoms/svg-icon/svg-icon.vue.js";
-/* empty css                                 */
-import Y from "../../atoms/input-file/input-file.vue.js";
-import Z from "../../templates/modal-dialog/modal-dialog.vue.js";
-/* empty css                                             */
-import { useDragAndDrop as _ } from "../../../composables/useDragAndDrop.js";
-import { useUploadTransport as ee } from "../../../composables/useUploadTransport.js";
-import { useLocalFileUrl as te } from "../../../composables/useLocalFileUrl.js";
-import { sanitizeHtml as ae } from "../../../composables/useSanitize.js";
-import { resizeImageFileByMaxWidth as le, uniqueId as N, srcToFile as oe } from "../../../utilities/helpers.js";
-const ie = { class: "image-upload__controls" }, ne = { class: "d-flex gap-1 align-items-center" }, re = {
-  key: 1,
-  class: "image-upload__controls"
-}, ue = ["for"], se = ["innerHTML"], de = {
-  key: 0,
-  class: "image-upload__loading-spinner"
-}, ke = /* @__PURE__ */ P({
-  __name: "image-upload",
-  props: {
-    modelValue: {
-      type: Object,
-      default: void 0
-    },
-    src: {
-      type: String
-    },
-    name: {
-      type: String,
-      default: () => N()
-    },
-    id: {
-      type: String,
-      default: () => N()
-    },
-    label: {
-      type: String,
-      default: ""
-    },
-    placeholder: {
-      type: String,
-      default: ""
-    },
-    variant: {
-      type: String,
-      default: ""
-    },
-    disabled: {
-      type: Boolean,
-      default: !1
-    },
-    readOnly: {
-      type: Boolean,
-      default: !1
-    },
-    required: {
-      type: Boolean,
-      default: !1
-    },
-    pattern: {
-      type: String,
-      default: null
-    },
-    accept: {
-      type: String,
-      default: "image/*"
-    },
-    maxFileSize: {
-      type: Number,
-      default: 0
-    },
-    endpoint: {
-      type: String,
-      default: ""
-    },
-    toDataUrl: {
-      type: Boolean,
-      default: !0
-    },
-    authToken: {
-      type: String,
-      default: ""
-    },
-    customFetch: null,
-    baseResponsePath: {
-      type: String,
-      default: "/api/v1/assets"
-    },
-    enablePreview: {
-      type: Boolean,
-      default: !0
-    },
-    previewWidth: {
-      type: Number,
-      default: 0
-    },
-    dropFiles: {
-      type: Boolean,
-      default: !1
-    },
-    enableReview: {
-      type: Boolean,
-      default: !0
-    },
-    maxImageWidth: {
-      type: Number,
-      default: 4096
-    },
-    aspectRatio: Number,
-    localUrlFormat: {
-      type: String,
-      default: "dataUrl"
-    }
-  },
-  emits: ["update:modelValue", "update:src"],
-  setup(a, { emit: T }) {
-    const o = a, y = T, D = u(), f = u([]), b = u(!1), r = u(!1), m = u(null), l = u(null), F = u(null);
-    let c = !1;
-    const { pending: L, uploadFile: R } = ee(o), { toLocalUrl: S, revoke: g } = te(Q(o, "localUrlFormat")), { isDragging: x } = _(D, {
-      enabled: () => o.dropFiles,
-      onDrop: (t) => {
-        f.value = t;
-      }
-    }), w = H(() => o.modelValue ? o.modelValue : o.src ? { type: "", src: o.src } : m.value);
-    function U(t) {
-      g(m.value?.src), m.value = t;
-    }
-    function k() {
-      U(null), f.value = [], b.value = !1, y("update:modelValue", void 0), y("update:src", "");
-    }
-    function W() {
-      k();
-    }
-    v(() => f.value, async (t) => {
-      if (!t || !t.length || !t[0]) return;
-      b.value = !1;
-      const e = await le(t[0], o.maxImageWidth);
-      o.enableReview ? (l.value = {
-        src: await S(e),
-        type: e.type
-      }, c = !0, r.value = !0) : U({
-        src: o.toDataUrl ? await S(e) : await R(e),
-        type: e.type
-      });
-    }), v(() => m.value, (t) => {
-      y("update:modelValue", t || void 0), y("update:src", t?.src || "");
-    }), v(() => F.value, async (t) => {
-      if (t) {
-        try {
-          U({
-            src: o.toDataUrl ? await S(t) : await R(t),
-            type: t.type
-          });
-        } catch (e) {
-          console.error(`Failed to process file "${t.name}"`, e);
-        }
-        F.value = null;
-      }
-    }), v(() => r.value, (t, e) => {
-      !t && e && l.value && (c && g(l.value.src), c = !1, l.value = null, W());
-    }), v(() => o.src, (t) => {
-      !t && m.value && W();
-    });
-    function I(t, e) {
-      c = !1, l.value = { src: t, type: e }, r.value = !0;
-    }
-    async function M() {
-      l.value && (F.value = await oe(
-        l.value.src,
-        "file",
-        l.value.type
-      ), c && g(l.value.src)), c = !1, l.value = null, r.value = !1;
-    }
-    return O(() => {
-      g(m.value?.src);
-    }), (t, e) => (s(), p("div", {
-      ref_key: "root",
-      ref: D,
-      class: C(["image-upload", {
-        "has-dragging": a.dropFiles,
-        "is-dragging": $(x)
-      }])
-    }, [
-      !r.value && w.value ? (s(), p("div", {
-        key: 0,
-        class: C(["mb-2", a.enablePreview ? "image-upload__thumbnail" : "image-upload__reset"])
-      }, [
-        a.enablePreview ? (s(), p(q, { key: 0 }, [
-          d(X, {
-            src: `${w.value.src}${a.previewWidth ? `?width=${a.previewWidth}` : ""}`,
-            class: "img-thumbnail rounded",
-            ready: b.value,
-            "onUpdate:ready": e[0] || (e[0] = (i) => b.value = i),
-            animate: !1,
-            style: E({ maxWidth: a.previewWidth ? `${a.previewWidth}px` : "auto", height: "auto" })
-          }, null, 8, ["src", "ready", "style"]),
-          n("div", ie, [
-            n("div", ne, [
-              n("button", {
-                type: "button",
-                onClick: e[1] || (e[1] = h((i) => I(w.value.src, w.value.type), ["prevent", "stop"])),
-                class: "btn btn--edit btn-sm btn-light"
-              }, [
-                d(z, { symbol: "edit-2" })
-              ]),
-              n("button", {
-                type: "button",
-                onClick: e[2] || (e[2] = h((i) => k(), ["prevent", "stop"])),
-                class: "btn btn--close btn-sm btn-light"
-              }, [
-                d(z, { symbol: "x" })
-              ])
-            ])
-          ])
-        ], 64)) : (s(), p("div", re, [
-          n("button", {
-            onClick: e[3] || (e[3] = h((i) => k(), ["prevent", "stop"])),
-            class: "btn btn--close btn-outline-contrast"
-          }, [
-            d(z, { symbol: "x" })
-          ])
-        ]))
-      ], 2)) : V("", !0),
-      d(Y, {
-        modelValue: f.value,
-        "onUpdate:modelValue": e[4] || (e[4] = (i) => f.value = i),
-        id: a.id,
-        name: a.name,
-        accept: a.accept,
-        "max-file-size": a.maxFileSize,
-        class: "d-none"
-      }, null, 8, ["modelValue", "id", "name", "accept", "max-file-size"]),
-      a.src ? V("", !0) : (s(), p("label", {
-        key: 1,
-        for: a.id,
-        class: "image-upload__label"
-      }, [
-        j(t.$slots, "button", {}, () => [
-          n("span", {
-            class: "btn btn-outline-contrast",
-            innerHTML: $(ae)(a.label || t.$t("common.selectFile"))
-          }, null, 8, se)
-        ]),
-        d(A, { name: "fade" }, {
-          default: B(() => [
-            $(L) ? (s(), p("span", de, [...e[7] || (e[7] = [
-              n("span", {
-                class: "spinner-border",
-                role: "status"
-              }, [
-                n("span", { class: "visually-hidden" }, "Loading...")
-              ], -1)
-            ])])) : V("", !0)
-          ]),
-          _: 1
-        })
-      ], 8, ue)),
-      d(Z, {
-        modelValue: r.value,
-        "onUpdate:modelValue": e[6] || (e[6] = (i) => r.value = i),
-        footer: !1
-      }, {
-        default: B(() => [
-          r.value && l.value ? (s(), G(K, {
-            key: 0,
-            modelValue: l.value.src,
-            "onUpdate:modelValue": e[5] || (e[5] = (i) => l.value.src = i),
-            "aspect-ratio": a.aspectRatio
-          }, {
-            submit: B(() => [
-              n("button", {
-                class: "btn btn-primary",
-                onClick: h(M, ["prevent", "stop"])
-              }, J(t.$t("common.save")), 1)
-            ]),
-            _: 1
-          }, 8, ["modelValue", "aspect-ratio"])) : V("", !0)
-        ]),
-        _: 1
-      }, 8, ["modelValue"])
-    ], 2));
-  }
-});
-export {
-  ke as default
-};

package/dist/components/molecules/image-upload/image-upload3.vue.js

@@ -1,5 +0,0 @@
-import o from "./image-upload.vue.js";
-/* empty css                  */
-export {
-  o as default
-};