ablok-components 0.3.83 → 0.3.85

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

@@ -1,10 +1,10 @@
-import { defineComponent as w, computed as T, ref as _, resolveComponent as b, openBlock as r, createElementBlock as d, createElementVNode as o, toDisplayString as U, createCommentVNode as H, createVNode as u, withCtx as h, withDirectives as L, vModelText as N, withModifiers as y, nextTick as S } from "vue";
-import x from "../file-upload/file-upload.vue.js";
+import { defineComponent as w, computed as T, ref as v, resolveComponent as y, openBlock as p, createElementBlock as _, createElementVNode as o, toDisplayString as x, createCommentVNode as U, createVNode as d, withCtx as g, withDirectives as H, vModelText as I, withModifiers as V, nextTick as L } from "vue";
+import N from "../file-upload/file-upload.vue.js";
 /* empty css                              */
-const A = { class: "container" }, B = { class: "row" }, E = { class: "col-12" }, I = {
+const S = { class: "container" }, A = { class: "row" }, B = { class: "col-12" }, E = {
   key: 0,
   class: "grid place-items-center text-center text-muted py-5 border border-bottom-0"
-}, D = { class: "m-0" }, F = { class: "preview-item border-bottom p-3" }, j = { class: "d-flex gap-3" }, q = { class: "col-2" }, z = { class: "col" }, G = ["onUpdate:modelValue", "id"], J = ["innerHTML"], K = { class: "col-auto d-flex flex-column gap-2" }, O = ["onClick"], P = ["onClick"], Q = { class: "d-flex align-items-end p-3" }, R = ["innerHTML"], Z = /* @__PURE__ */ w({
+}, z = { class: "m-0" }, D = { class: "preview-item border-bottom p-3" }, F = { class: "d-flex gap-3" }, j = { class: "col-2" }, q = { class: "col" }, R = ["onUpdate:modelValue", "id"], G = ["innerHTML"], J = { class: "col-auto d-flex flex-column gap-2" }, K = ["onClick"], O = ["onClick"], P = { class: "d-flex align-items-end p-3" }, Q = { class: "btn btn-primary btn-sm ms-auto d-flex align-items-center gap-2" }, W = ["innerHTML"], ee = /* @__PURE__ */ w({
   __name: "bulk-upload",
   props: {
     storeId: String,
@@ -25,99 +25,108 @@ const A = { class: "container" }, B = { class: "row" }, E = { class: "col-12" },
     }
   },
   emits: ["update:modelValue"],
-  setup(g, { emit: k }) {
-    const V = g, C = k, s = T({
+  setup(k, { emit: M }) {
+    const f = k, b = M, n = T({
       get: () => {
-        const e = V.modelValue || [];
-        return a.value = e.map((t) => t.caption || ""), e.map((t) => ({ type: t.type, src: t.src }));
+        const e = f.modelValue || [];
+        return c.value = e.map((t) => t.caption || ""), e.map((t) => ({ type: t.type, src: t.src }));
       },
       set: (e) => {
-        const t = s.value || [], c = Array.isArray(e) ? e : [];
-        m([...t, ...c]);
+        const t = n.value || [], s = Array.isArray(e) ? e : [], i = s.length <= t.length && s.every((r) => t.some((l) => l.src === r.src));
+        u(i ? s : [...t, ...s]);
       }
-    }), v = _(null), n = _({}), a = _({});
-    async function M(e) {
-      n.value[e] = !n.value[e], n.value[e] || m(), await S(), v.value?.querySelector(`#caption-${e}`)?.focus();
+    }), h = v(null), a = v({}), c = v({});
+    function C(e) {
+      const t = [...f.modelValue || []];
+      t.splice(e, 1), b("update:modelValue", t);
     }
-    function m(e) {
-      C("update:modelValue", (e || s.value).map((t, c) => ({
+    async function $(e) {
+      a.value[e] = !a.value[e], a.value[e] || u(), await L(), h.value?.querySelector(`#caption-${e}`)?.focus();
+    }
+    function u(e) {
+      b("update:modelValue", (e || n.value).map((t, s) => ({
         ...t,
-        caption: a.value[c] || ""
+        caption: c.value[s] || ""
       })));
     }
     return (e, t) => {
-      const c = b("base-image"), f = b("svg-icon");
-      return r(), d("div", {
+      const s = y("base-image"), i = y("svg-icon");
+      return p(), _("div", {
         class: "bulk-upload",
         ref_key: "root",
-        ref: v
+        ref: h
       }, [
-        o("div", A, [
-          o("div", B, [
-            o("div", E, [
-              s.value.length ? H("", !0) : (r(), d("div", I, [
-                o("p", D, U(e.$t("fileInput.noFilesSelected")), 1)
+        o("div", S, [
+          o("div", A, [
+            o("div", B, [
+              n.value.length ? U("", !0) : (p(), _("div", E, [
+                o("p", z, x(e.$t("fileInput.noFilesSelected")), 1)
               ])),
-              u(x, {
-                modelValue: s.value,
-                "onUpdate:modelValue": t[1] || (t[1] = (p) => s.value = p),
+              d(N, {
+                modelValue: n.value,
+                "onUpdate:modelValue": t[1] || (t[1] = (r) => n.value = r),
                 multiple: !0,
                 accept: "image/*",
                 "drop-files": !0,
                 "to-data-url": !0,
                 "local-url-format": "objectUrl",
-                class: "d-flex flex-column align-items-end border"
+                class: "d-flex flex-column border"
               }, {
-                "preview-item": h(({ bind: { item: p, index: l }, on: { removeFile: $ } }) => [
-                  o("div", F, [
-                    o("div", j, [
-                      o("div", q, [
-                        u(c, {
-                          src: p.src,
+                "preview-item": g(({ bind: { item: r, index: l } }) => [
+                  o("div", D, [
+                    o("div", F, [
+                      o("div", j, [
+                        d(s, {
+                          src: r.src,
                           alt: "",
                           class: "img-thumbnail"
                         }, null, 8, ["src"])
                       ]),
-                      o("div", z, [
-                        n.value[l] ? L((r(), d("textarea", {
+                      o("div", q, [
+                        a.value[l] ? H((p(), _("textarea", {
                           key: 0,
-                          "onUpdate:modelValue": (i) => a.value[l] = i,
+                          "onUpdate:modelValue": (m) => c.value[l] = m,
                           id: `caption-${l}`,
                           class: "form-control rounded-0 h-100",
-                          onChangeCapture: t[0] || (t[0] = (i) => m())
-                        }, null, 40, G)), [
-                          [N, a.value[l]]
-                        ]) : (r(), d("p", {
+                          onChangeCapture: t[0] || (t[0] = (m) => u())
+                        }, null, 40, R)), [
+                          [I, c.value[l]]
+                        ]) : (p(), _("p", {
                           key: 1,
                           class: "m-0",
-                          innerHTML: a.value[l] || `<small>${e.$t("fileInput.noCaption")}</small>`
-                        }, null, 8, J))
+                          innerHTML: c.value[l] || `<small>${e.$t("fileInput.noCaption")}</small>`
+                        }, null, 8, G))
                       ]),
-                      o("div", K, [
+                      o("div", J, [
                         o("button", {
-                          onClick: y((i) => $(l), ["prevent"]),
+                          onClick: V((m) => C(l), ["prevent"]),
                           class: "btn btn--close"
                         }, [
-                          u(f, { symbol: "x" })
-                        ], 8, O),
+                          d(i, { symbol: "x" })
+                        ], 8, K),
                         o("button", {
-                          onClick: y((i) => M(l), ["prevent"]),
+                          onClick: V((m) => $(l), ["prevent"]),
                           class: "btn btn--close"
                         }, [
-                          u(f, {
-                            symbol: n.value[l] ? "check" : "edit-3"
+                          d(i, {
+                            symbol: a.value[l] ? "check" : "edit-3"
                           }, null, 8, ["symbol"])
-                        ], 8, P)
+                        ], 8, O)
                       ])
                     ])
                   ])
                 ]),
-                button: h(() => [
-                  o("span", Q, [
-                    o("span", {
-                      class: "btn btn-primary btn-sm",
-                      innerHTML: e.$t("common.selectFile")
-                    }, null, 8, R)
+                button: g(() => [
+                  o("span", P, [
+                    o("span", Q, [
+                      d(i, {
+                        symbol: "upload",
+                        size: "small"
+                      }),
+                      o("span", {
+                        innerHTML: e.$t("common.selectFile")
+                      }, null, 8, W)
+                    ])
                   ])
                 ]),
                 _: 1
@@ -130,5 +139,5 @@ const A = { class: "container" }, B = { class: "row" }, E = { class: "col-12" },
   }
 });
 export {
-  Z as default
+  ee as default
 };

package/package.json

@@ -1,23 +1,7 @@
 {
   "name": "ablok-components",
   "private": false,
-  "version": "0.3.83",
-  "scripts": {
-    "dev": "vite --host",
-    "story:dev": "histoire dev",
-    "story:build": "histoire build",
-    "story:preview": "histoire preview",
-    "build": "vue-tsc --noEmit --project tsconfig.build.json && vite build",
-    "build:watch": "vue-tsc --noEmit --watch --project tsconfig.build.json & vite build --watch",
-    "preview": "vite preview",
-    "build-lib-bak": "vite build && vue-tsc --emitDeclarationOnly && mv dist/src dist/types",
-    "build-lib": "vite build && vue-tsc --emitDeclarationOnly",
-    "release": "bash ./scripts/release.sh",
-    "postrelease": "bash ./scripts/publish.sh",
-    "test": "vitest run",
-    "test:watch": "vitest",
-    "test:ui": "vitest --ui"
-  },
+  "version": "0.3.85",
   "dependencies": {
     "date-fns": "^3.0.0",
     "dompurify": "^3.3.1",
@@ -136,5 +120,21 @@
     "./package.json": "./package.json"
   },
   "types": "./dist/index.d.ts",
-  "sideEffects": false
-}
+  "sideEffects": false,
+  "scripts": {
+    "dev": "vite --host",
+    "story:dev": "histoire dev",
+    "story:build": "histoire build",
+    "story:preview": "histoire preview",
+    "build": "vue-tsc --noEmit --project tsconfig.build.json && vite build",
+    "build:watch": "vue-tsc --noEmit --watch --project tsconfig.build.json & vite build --watch",
+    "preview": "vite preview",
+    "build-lib-bak": "vite build && vue-tsc --emitDeclarationOnly && mv dist/src dist/types",
+    "build-lib": "vite build && vue-tsc --emitDeclarationOnly",
+    "release": "bash ./scripts/release.sh",
+    "postrelease": "bash ./scripts/publish.sh",
+    "test": "vitest run",
+    "test:watch": "vitest",
+    "test:ui": "vitest --ui"
+  }
+}