@opengis/cms 0.0.57 → 0.0.59

package/dist/vs-form-custom-datatable-BDZo48w3.js

@@ -0,0 +1,317 @@
+import { mergeModels as _, defineAsyncComponent as E, useModel as A, ref as y, watch as S, openBlock as a, createElementBlock as s, createElementVNode as r, createVNode as h, unref as k, withCtx as C, toDisplayString as x, createTextVNode as U, onMounted as z, Fragment as D, renderList as $, normalizeClass as B, createCommentVNode as j } from "vue";
+import { Pencil as O, Trash2 as P, Plus as G, GripVertical as R } from "lucide-vue-next";
+import { VsModal as I, confirm as X, notify as q } from "@opengis/core";
+import { useI18n as H } from "vue-i18n";
+const Y = { class: "flex items-center justify-end gap-2" }, Z = { class: "flex justify-end p-[20px] gap-[10px] border-t w-full" }, J = {
+  __name: "vs-form-custom-datatable-controls",
+  props: /* @__PURE__ */ _({
+    item: {
+      type: Object,
+      required: !0
+    },
+    colModel: {
+      type: Array,
+      required: !0
+    }
+  }, {
+    modelValue: {
+      type: Array,
+      required: !0
+    },
+    modelModifiers: {}
+  }),
+  emits: ["update:modelValue"],
+  setup(b) {
+    const { t: n } = H(), w = E(() => import("@opengis/form")), c = b, d = A(b, "modelValue"), m = y(!1), p = y({}), V = y({}), v = () => {
+      X({
+        title: n("cms.builder.deleteTitle"),
+        message: n("cms.builder.deleteField"),
+        type: "error",
+        onConfirm: () => {
+          u();
+        }
+      });
+    }, u = () => {
+      d.value = d.value.filter((g) => g.id !== c.item.id);
+    }, f = async () => {
+      if (await V.value.validate()) {
+        q({
+          type: "warning",
+          title: n("cms.common.actions.warning"),
+          message: n("cms.builder.editFieldFailed")
+        });
+        return;
+      }
+      d.value = d.value.map(
+        (i) => i.id === c.item.id ? p.value : i
+      ), m.value = !1;
+    };
+    return S(m, (g) => {
+      g && (p.value = c.item);
+    }), (g, i) => (a(), s("div", Y, [
+      r("button", {
+        class: "inline-flex items-center justify-center whitespace-nowrap font-medium focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 border rounded-md text-xs h-8 w-8 p-0 border-slate-300 dark:border-slate-600 bg-white dark:bg-slate-700 hover:bg-blue-50 dark:hover:bg-slate-600 hover:border-blue-300 dark:hover:border-slate-500 hover:text-blue-600 dark:hover:text-slate-200 transition-all duration-200 shadow-sm",
+        onClick: i[0] || (i[0] = (t) => m.value = !0)
+      }, [
+        h(k(O), { class: "w-4 h-4" })
+      ]),
+      r("button", {
+        onClick: v,
+        class: "inline-flex items-center justify-center whitespace-nowrap font-medium focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 border rounded-md text-xs h-8 w-8 p-0 border-slate-300 dark:border-slate-600 bg-white dark:bg-slate-700 hover:bg-red-50 dark:hover:bg-slate-600 hover:border-red-300 dark:hover:border-slate-500 hover:text-red-600 dark:hover:text-slate-200 transition-all duration-200 shadow-sm"
+      }, [
+        h(k(P), { class: "w-4 h-4" })
+      ]),
+      h(k(I), {
+        teleport: "#modal",
+        title: g.$t("cms.builder.editField"),
+        visible: m.value,
+        onClose: i[4] || (i[4] = (t) => m.value = !1)
+      }, {
+        footer: C(() => [
+          r("div", Z, [
+            r("button", {
+              class: "py-2 px-3 inline-flex items-center gap-x-2 text-sm whitespace-nowrap text-white bg-blue-500 rounded-lg !border-gray-200 hover:bg-blue-700 duration-300",
+              onClick: i[3] || (i[3] = (t) => m.value = !1)
+            }, x(g.$t("cms.common.actions.cancel")), 1),
+            r("button", {
+              onClick: f,
+              class: "py-2 px-3 inline-flex items-center gap-x-2 text-sm whitespace-nowrap text-white bg-blue-500 rounded-lg !border-gray-200 hover:bg-blue-700 duration-300"
+            }, x(g.$t("cms.common.actions.save")), 1)
+          ])
+        ]),
+        default: C(() => [
+          h(k(w), {
+            form: V.value,
+            "onUpdate:form": i[1] || (i[1] = (t) => V.value = t),
+            schema: b.colModel,
+            modelValue: p.value,
+            "onUpdate:modelValue": i[2] || (i[2] = (t) => p.value = t)
+          }, null, 8, ["form", "schema", "modelValue"])
+        ]),
+        _: 1
+      }, 8, ["title", "visible"])
+    ]));
+  }
+}, K = { class: "p-6 border-t border-slate-200 dark:border-slate-700 bg-slate-50/30 dark:bg-slate-700/30" }, Q = { class: "flex justify-end p-[20px] gap-[10px] border-t w-full" }, W = {
+  __name: "vs-form-custom-datatable-add",
+  props: /* @__PURE__ */ _({
+    colModel: {
+      type: Array,
+      required: !0
+    }
+  }, {
+    modelValue: {
+      type: Array,
+      required: !0
+    },
+    modelModifiers: {}
+  }),
+  emits: ["update:modelValue"],
+  setup(b) {
+    const { t: n } = H(), w = E(() => import("@opengis/form")), c = A(b, "modelValue"), d = y(!1), m = y({}), p = y({}), V = async () => {
+      try {
+        if (await p.value.validate()) {
+          q({
+            type: "warning",
+            title: n("cms.common.actions.warning"),
+            message: n("cms.builder.editFieldFailed")
+          });
+          return;
+        }
+        c.value = [
+          ...c.value || [],
+          { ...m.value, id: Math.random().toString(36).substring(2, 15) }
+        ], d.value = !1, m.value = {};
+      } catch (v) {
+        console.log(v);
+      }
+    };
+    return (v, u) => (a(), s("div", K, [
+      r("button", {
+        class: "inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 shadow-sm h-9 px-4 w-full border-2 border-dashed border-slate-300 dark:border-slate-600 bg-white dark:bg-slate-700 hover:bg-slate-50 dark:hover:bg-slate-600 hover:border-blue-400 dark:hover:border-blue-500 text-slate-600 dark:text-slate-300 hover:text-blue-600 dark:hover:text-blue-400 py-3 transition-all duration-200",
+        onClick: u[0] || (u[0] = (f) => d.value = !0)
+      }, [
+        h(k(G), { class: "w-4 h-4 mr-2" }),
+        U(" " + x(v.$t("cms.common.actions.add")), 1)
+      ]),
+      h(k(I), {
+        teleport: "#modal",
+        title: v.$t("cms.common.actions.add"),
+        visible: d.value,
+        onClose: u[4] || (u[4] = (f) => d.value = !1)
+      }, {
+        footer: C(() => [
+          r("div", Q, [
+            r("button", {
+              class: "inline-flex items-center px-3 py-2 text-sm text-black duration-300 border border-gray-200 rounded-lg gap-x-2 whitespace-nowrap hover:bg-gray-100",
+              onClick: u[3] || (u[3] = (f) => d.value = !1)
+            }, x(v.$t("cms.common.actions.cancel")), 1),
+            r("button", {
+              onClick: V,
+              class: "py-2 px-3 inline-flex items-center gap-x-2 text-sm whitespace-nowrap text-white bg-blue-500 rounded-lg !border-gray-200 hover:bg-blue-700 duration-300"
+            }, x(v.$t("cms.common.actions.save")), 1)
+          ])
+        ]),
+        default: C(() => [
+          h(k(w), {
+            form: p.value,
+            "onUpdate:form": u[1] || (u[1] = (f) => p.value = f),
+            schema: b.colModel,
+            modelValue: m.value,
+            "onUpdate:modelValue": u[2] || (u[2] = (f) => m.value = f)
+          }, null, 8, ["form", "schema", "modelValue"])
+        ]),
+        _: 1
+      }, 8, ["title", "visible"])
+    ]));
+  }
+}, ee = { class: "p-0 shadow w-full" }, te = { class: "overflow-x-auto" }, le = { class: "relative w-full overflow-auto" }, re = { class: "w-full caption-bottom text-sm" }, oe = { class: "[&_tr]:border-b" }, ae = { class: "border-b data-[state=selected]:bg-muted bg-slate-50/50 dark:bg-slate-700/50 hover:bg-slate-50/80 dark:hover:bg-slate-700/80 transition-colors" }, se = { class: "h-10 px-2 align-middle [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px] font-semibold text-slate-700 dark:text-slate-300 text-end" }, ne = { class: "[&_tr:last-child]:border-0" }, de = ["onDragstart", "onDragover", "onDrop", "onDragenter"], ie = { class: "p-2 align-middle [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px] text-center" }, ue = { class: "flex items-center justify-center text-slate-400" }, ce = ["innerHTML"], me = {
+  key: 1,
+  class: "flex items-center gap-2"
+}, be = {
+  key: 0,
+  class: "flex items-center gap-1"
+}, ve = ["src", "alt"], ge = {
+  key: 0,
+  class: "text-xs text-gray-500 dark:text-gray-400 ml-1"
+}, pe = {
+  key: 1,
+  class: "w-8 h-8 rounded bg-gray-100 dark:bg-gray-700 flex items-center justify-center"
+}, fe = { key: 2 }, he = { class: "p-2 align-middle [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]" }, xe = {
+  key: 0,
+  class: "h-2 bg-blue-200 dark:bg-blue-800 transition-all duration-200"
+}, T = 3, Me = {
+  __name: "vs-form-custom-datatable",
+  props: /* @__PURE__ */ _({
+    colModel: {
+      type: Array,
+      required: !0
+    }
+  }, {
+    modelValue: {
+      type: Array,
+      required: !0
+    },
+    modelModifiers: {}
+  }),
+  emits: ["update:modelValue"],
+  setup(b) {
+    const n = A(b, "modelValue"), w = y(null), c = y(-1), d = y(!1), m = (t, l, e) => {
+      w.value = l, c.value = e, t.dataTransfer.effectAllowed = "move", t.dataTransfer.setData("text/html", "");
+    }, p = (t, l) => {
+      t.preventDefault(), t.dataTransfer.dropEffect = "move";
+    }, V = (t, l) => {
+      c.value !== l && (d.value = !0);
+    }, v = (t) => {
+      t.currentTarget.contains(t.relatedTarget) || (d.value = !1);
+    }, u = (t, l) => {
+      if (t.preventDefault(), d.value = !1, c.value === -1 || c.value === l)
+        return;
+      const e = [...n.value], [M] = e.splice(c.value, 1);
+      e.splice(l, 0, M), n.value = e, w.value = null, c.value = -1;
+    }, f = (t) => Array.isArray(t) ? t.slice(0, T) : [], g = (t) => Array.isArray(t) ? Math.max(0, t.length - T) : 0, i = (t) => {
+      const l = t.target;
+      l.style.display = "none";
+      const e = document.createElement("cms.div");
+      e.className = "w-full h-full flex items-center justify-center bg-gray-200 dark:bg-gray-600", e.innerHTML = `
+    <svg class="w-4 h-4 text-gray-400" fill="currentColor" viewBox="0 0 20 20">
+      <path fill-rule="evenodd" d="M4 3a2 2 0 00-2 2v10a2 2 0 002 2h12a2 2 0 002-2V5a2 2 0 00-2-2H4zm12 12H4l4-8 3 6 2-4 3 6z" clip-rule="evenodd" />
+    </svg>
+  `, l.parentNode.appendChild(e);
+    };
+    return z(() => {
+      var t, l;
+      (l = (t = n.value) == null ? void 0 : t.filter((e) => typeof e == "object")) == null || l.forEach(
+        (e) => e.id ? e.id : e.id = Math.random().toString(36).substring(2, 15)
+      );
+    }), (t, l) => (a(), s("div", ee, [
+      r("div", te, [
+        r("div", le, [
+          r("table", re, [
+            r("thead", oe, [
+              r("tr", ae, [
+                l[4] || (l[4] = r("th", { class: "h-10 px-2 align-middle font-medium text-muted-foreground [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px] w-12 text-center" }, null, -1)),
+                (a(!0), s(D, null, $(b.colModel, (e) => (a(), s("th", {
+                  key: e.name,
+                  class: "h-10 px-2 text-left align-middle [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px] font-semibold text-slate-700 dark:text-slate-300 min-w-[150px]"
+                }, x(e.label || e.title || e.name), 1))), 128)),
+                r("th", se, x(t.$t("cms.table.actions")), 1)
+              ])
+            ]),
+            r("tbody", ne, [
+              (a(!0), s(D, null, $(n.value, (e, M) => (a(), s("tr", {
+                key: e == null ? void 0 : e.id,
+                class: B(["border-b data-[state=selected]:bg-muted transition-all duration-200 hover:bg-slate-50/60 dark:hover:bg-slate-700/60 cursor-move", { "opacity-50": w.value === e }]),
+                draggable: "true",
+                onDragstart: (o) => m(o, e, M),
+                onDragover: (o) => p(o),
+                onDrop: (o) => u(o, M),
+                onDragenter: (o) => V(o, M),
+                onDragleave: l[2] || (l[2] = (o) => v(o))
+              }, [
+                r("td", ie, [
+                  r("div", ue, [
+                    h(k(R))
+                  ])
+                ]),
+                (a(!0), s(D, null, $(b.colModel, (o) => (a(), s("td", {
+                  key: o.name,
+                  class: "p-2 align-middle [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px] text-slate-600 dark:text-slate-400 text-sm"
+                }, [
+                  o.type === "Texteditor" ? (a(), s("span", {
+                    key: 0,
+                    innerHTML: e[o.key] || "-"
+                  }, null, 8, ce)) : o.type === "File" ? (a(), s("div", me, [
+                    Array.isArray(e[o.key]) && e[o.key].length > 0 ? (a(), s("div", be, [
+                      (a(!0), s(D, null, $(f(e[o.key]), (L, F) => (a(), s("div", {
+                        key: F,
+                        class: "relative w-8 h-8 rounded overflow-hidden bg-gray-100 dark:bg-gray-700 flex-shrink-0"
+                      }, [
+                        r("img", {
+                          src: L,
+                          alt: `Image ${F + 1}`,
+                          class: "w-full h-full object-cover",
+                          onError: l[0] || (l[0] = (N) => i(N))
+                        }, null, 40, ve)
+                      ]))), 128)),
+                      g(e[o.key]) > 0 ? (a(), s("span", ge, " +" + x(g(e[o.key])), 1)) : j("", !0)
+                    ])) : (a(), s("div", pe, [...l[5] || (l[5] = [
+                      r("svg", {
+                        class: "w-4 h-4 text-gray-400",
+                        fill: "currentColor",
+                        viewBox: "0 0 20 20"
+                      }, [
+                        r("path", {
+                          "fill-rule": "evenodd",
+                          d: "M4 3a2 2 0 00-2 2v10a2 2 0 002 2h12a2 2 0 002-2V5a2 2 0 00-2-2H4zm12 12H4l4-8 3 6 2-4 3 6z",
+                          "clip-rule": "evenodd"
+                        })
+                      ], -1)
+                    ])]))
+                  ])) : (a(), s("span", fe, x(e[o.key] || "-"), 1))
+                ]))), 128)),
+                r("td", he, [
+                  h(J, {
+                    item: e,
+                    colModel: b.colModel,
+                    modelValue: n.value,
+                    "onUpdate:modelValue": l[1] || (l[1] = (o) => n.value = o)
+                  }, null, 8, ["item", "colModel", "modelValue"])
+                ])
+              ], 42, de))), 128)),
+              d.value ? (a(), s("tr", xe)) : j("", !0)
+            ])
+          ])
+        ])
+      ]),
+      h(W, {
+        colModel: b.colModel,
+        modelValue: n.value,
+        "onUpdate:modelValue": l[3] || (l[3] = (e) => n.value = e)
+      }, null, 8, ["colModel", "modelValue"])
+    ]));
+  }
+};
+export {
+  Me as default
+};

package/dist/vs-form-integer-BZ855R3g.js

@@ -0,0 +1,61 @@
+import { openBlock as r, createElementBlock as n, renderSlot as d, normalizeProps as o, guardReactiveProps as s, withDirectives as p, createElementVNode as m, normalizeClass as f, vModelText as h } from "vue";
+import { _ as b } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+const c = {
+  props: {
+    min: { type: Number },
+    step: { type: Number, default: () => 1 },
+    max: { type: Number, default: () => 1 / 0 },
+    modelValue: { type: Number, default: () => null },
+    label: { type: String, default: () => "" },
+    placeholder: { type: String, default: () => "0" },
+    disabled: { type: Boolean, default: () => !1 }
+  },
+  data() {
+    return {
+      id: `input-number-${Math.floor(Math.random() * 1e3)}`,
+      inputValue: this.modelValue
+    };
+  },
+  watch: {
+    modelValue(e) {
+      this.inputValue = e;
+    },
+    inputValue(e) {
+      this.$emit("update:modelValue", e);
+    }
+  },
+  methods: {
+    validateInput(e) {
+      (e.key === "+" || e.key === "," || e.key === "." || e.key === "-" && this.inputValue && this.inputValue.toString().length > 0) && e.preventDefault();
+    },
+    handleBlur() {
+      let e = parseFloat(this.inputValue);
+      this.$emit("blur"), isNaN(e) ? e = this.min : e > this.max ? e = this.max : e < this.min && (e = this.min), this.inputValue = e, this.$emit("update:modelValue", this.inputValue);
+    }
+  }
+}, x = { class: "p-0" }, V = ["step", "min", "max", "id", "placeholder", "disabled"];
+function y(e, t, l, k, i, u) {
+  return r(), n("div", x, [
+    d(e.$slots, "label", o(s({ id: i.id }))),
+    p(m("input", {
+      "onUpdate:modelValue": t[0] || (t[0] = (a) => i.inputValue = a),
+      type: "number",
+      onKeydown: t[1] || (t[1] = (...a) => u.validateInput && u.validateInput(...a)),
+      onBlur: t[2] || (t[2] = (...a) => u.handleBlur && u.handleBlur(...a)),
+      step: l.step,
+      min: l.min,
+      max: l.max,
+      id: i.id,
+      "aria-describedby": "helper-text-explanation",
+      class: f(["vs-number__input py-2 px-3 block w-full h-[38px] border border-solid border-stone-200 rounded-lg text-sm text-stone-800 placeholder:text-stone-500 focus:z-10 focus:border-1 focus:outline-none focus:border-blue-600 dark:bg-neutral-800 dark:border-neutral-700 dark:text-neutral-200 dark:placeholder:text-neutral-500 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-neutral-600", { "cursor-not-allowed": l.disabled }]),
+      placeholder: l.placeholder,
+      disabled: l.disabled
+    }, null, 42, V), [
+      [h, i.inputValue]
+    ])
+  ]);
+}
+const B = /* @__PURE__ */ b(c, [["render", y]]);
+export {
+  B as default
+};