@orchidui/core 0.0.1 → 0.2.0

package/dist/OcModal-DdD5VFEN.js

@@ -0,0 +1,187 @@
+import { computed as C, ref as V, watch as S, onUnmounted as $, openBlock as o, createElementBlock as s, createElementVNode as a, normalizeClass as c, renderSlot as u, toDisplayString as v, createCommentVNode as i, createVNode as f, unref as p, mergeProps as b } from "vue";
+import "dayjs";
+import { B as g } from "./OcComplexCalendar.vue_vue_type_style_index_0_lang-CIQPD-6N.js";
+import { _ as z } from "./OcIcon-CJgBICxh.js";
+/* empty css                                                                    */
+import "libphonenumber-js";
+/* empty css                                                                  */
+import "v-calendar";
+/* empty css                                                                  */
+import "./Cropper.js";
+import "vue-draggable-next";
+import "@popperjs/core";
+const O = {
+  key: 0,
+  id: "modal-overlay-wrapper",
+  class: "fixed w-screen z-[1007] top-0 left-0 h-full min-h-screen bg-black/[.45] flex items-center justify-center"
+}, j = { class: "flex flex-col gap-y-1 overflow-hidden" }, P = { class: "text-lg font-medium text-ellipsis overflow-hidden whitespace-nowrap" }, E = {
+  key: 0,
+  class: "text-sm text-oc-text-300 text-ellipsis overflow-hidden whitespace-nowrap"
+}, I = ["id"], J = {
+  __name: "OcModal",
+  props: {
+    isBorderless: Boolean,
+    footerClass: {
+      type: String,
+      default: "justify-end"
+    },
+    modelValue: {
+      type: Boolean,
+      default: !1
+    },
+    title: {
+      type: String,
+      default: ""
+    },
+    description: {
+      type: String,
+      default: ""
+    },
+    persistent: {
+      type: Boolean,
+      default: !1
+    },
+    isCloseIcon: {
+      type: Boolean,
+      default: !0
+    },
+    cancelButtonProps: {
+      type: Object,
+      default: () => ({
+        label: "Cancel",
+        variant: "secondary"
+      })
+    },
+    preventClose: {
+      type: Boolean,
+      default: !1
+    },
+    isHeaderVisible: {
+      type: Boolean,
+      default: !0
+    },
+    isFooterVisible: {
+      type: Boolean,
+      default: !0
+    },
+    modalId: {
+      type: String,
+      default: ""
+    },
+    confirmButtonProps: {
+      type: Object,
+      default: () => ({
+        label: "OK",
+        class: "min-w-[112px]"
+      })
+    },
+    size: {
+      type: String,
+      default: "default",
+      validator: (e) => ["default", "medium", "small"].includes(e)
+    }
+  },
+  emits: [
+    "update:modelValue",
+    "confirm",
+    "cancel",
+    "click:outside",
+    "content-scroll"
+  ],
+  setup(e, { emit: w }) {
+    const r = e, n = w, y = () => {
+      r.preventClose || n("update:modelValue", !1);
+    }, h = async () => {
+      n("click:outside"), !r.persistent && r.modelValue && y();
+    }, B = () => {
+      n("cancel"), y();
+    }, k = C(() => ({
+      default: "max-w-[640px]",
+      medium: "max-w-[480px]",
+      small: "max-w-[320px]"
+    })), d = V(), x = (t) => {
+      var l;
+      (l = d.value) == null || l.click();
+    };
+    return S(
+      () => r.modelValue,
+      () => {
+        setTimeout(() => {
+          var t;
+          (t = d.value) == null || t.addEventListener("scroll", x);
+        }, 100);
+      }
+    ), $(() => {
+      var t;
+      (t = d.value) == null || t.removeEventListener("scroll", x);
+    }), (t, l) => e.modelValue ? (o(), s("div", O, [
+      a("div", {
+        class: "w-full h-full absolute top-0 left-0 z-[1007]",
+        onClick: h
+      }),
+      a("div", {
+        class: c(["z-[1008] shadow-normal w-[calc(100%-40px)] max-h-[96vh] bg-oc-bg-light rounded-xl flex flex-col", k.value[e.size]])
+      }, [
+        e.isHeaderVisible ? (o(), s("div", {
+          key: 0,
+          class: c(["flex bg-inherit border-oc-gray-200 gap-x-9 justify-between p-5 items-start rounded-t-xl", e.isBorderless ? "" : "border-b"])
+        }, [
+          u(t.$slots, "header", {}, () => [
+            a("div", j, [
+              a("span", P, v(e.title), 1),
+              u(t.$slots, "description", {}, () => [
+                e.description ? (o(), s("span", E, v(e.description), 1)) : i("", !0)
+              ])
+            ]),
+            e.isCloseIcon ? (o(), s("div", {
+              key: 0,
+              class: "p-[6px] rounded cursor-pointer text-oc-gray-500 hover:bg-gray-100 hover:text-oc-text",
+              onClick: l[0] || (l[0] = (m) => t.$emit("update:modelValue", !1))
+            }, [
+              f(p(z), {
+                name: "x",
+                width: "20",
+                height: "20"
+              })
+            ])) : i("", !0)
+          ])
+        ], 2)) : i("", !0),
+        a("div", {
+          id: e.modalId,
+          ref_key: "scrollArea",
+          ref: d,
+          class: c(["overflow-y-auto", [e.size === "small" ? "p-5" : "p-7", e.isBorderless ? "py-0" : ""]]),
+          onScroll: l[1] || (l[1] = (m) => n("content-scroll", m))
+        }, [
+          u(t.$slots, "default")
+        ], 42, I),
+        e.isFooterVisible ? (o(), s("div", {
+          key: 1,
+          class: c(["px-5 py-6 border-oc-gray-200 flex gap-x-4", [
+            e.footerClass,
+            {
+              "border-t": !e.isBorderless
+            }
+          ]])
+        }, [
+          u(t.$slots, "footer", {}, () => [
+            f(p(g), b({
+              label: "Cancel",
+              variant: "secondary",
+              class: "min-w-[112px]"
+            }, e.cancelButtonProps, { onClick: B }), null, 16),
+            f(p(g), b({
+              label: "OK",
+              class: "min-w-[112px]"
+            }, e.confirmButtonProps, {
+              onClick: l[2] || (l[2] = (m) => t.$emit("confirm"))
+            }), null, 16)
+          ])
+        ], 2)) : i("", !0)
+      ], 2)
+    ])) : i("", !0);
+  }
+};
+export {
+  J as _
+};

package/dist/OcModalCropper-D2OI2iun.js

@@ -0,0 +1,56 @@
+import { ref as o, openBlock as c, createBlock as f, unref as m, withCtx as g, createVNode as v } from "vue";
+import "dayjs";
+import "./OcComplexCalendar.vue_vue_type_style_index_0_lang-CIQPD-6N.js";
+/* empty css                                                                    */
+import "libphonenumber-js";
+/* empty css                                                                  */
+import "v-calendar";
+/* empty css                                                                  */
+import "./Cropper.js";
+import "vue-draggable-next";
+import { _ as d } from "./OcModal-DdD5VFEN.js";
+import "@popperjs/core";
+import x from "./OcCropper-31Y_S1Ne.js";
+const w = {
+  __name: "OcModalCropper",
+  props: {
+    inputOptions: Array,
+    inputOptionValues: Object,
+    img: String,
+    maxSize: [String, Number]
+  },
+  emits: ["changeImage", "close", "update:input-options"],
+  setup(t, { emit: r }) {
+    const u = t, i = r;
+    o(), o();
+    const s = {
+      onClick: () => i("close")
+    }, e = o(), p = o(u.link), l = o({
+      label: "Save",
+      onClick: () => {
+        p.value && i("update:input-options", p.value), e.value ? i("changeImage", e.value) : i("close");
+      }
+    });
+    return (O, n) => (c(), f(m(d), {
+      title: "Edit Image",
+      "is-close-icon": "",
+      "cancel-button-props": s,
+      "confirm-button-props": l.value
+    }, {
+      default: g(() => [
+        v(m(x), {
+          "input-options": t.inputOptions,
+          "input-option-values": t.inputOptionValues,
+          img: t.img,
+          "max-size": t.maxSize,
+          onChangeImage: n[0] || (n[0] = (a) => e.value = a),
+          "onUpdate:inputOptions": n[1] || (n[1] = (a) => p.value = a)
+        }, null, 8, ["input-options", "input-option-values", "img", "max-size"])
+      ]),
+      _: 1
+    }, 8, ["confirm-button-props"]));
+  }
+};
+export {
+  w as default
+};

package/dist/OcModalPage-BLVa-kcB.js

@@ -0,0 +1,86 @@
+import { openBlock as r, createElementBlock as s, createElementVNode as t, renderSlot as n, normalizeClass as u, createVNode as i, unref as d, createCommentVNode as c } from "vue";
+import "dayjs";
+import { B as f } from "./OcComplexCalendar.vue_vue_type_style_index_0_lang-CIQPD-6N.js";
+import { _ as x } from "./OcIcon-CJgBICxh.js";
+/* empty css                                                                    */
+import "libphonenumber-js";
+/* empty css                                                                  */
+import "v-calendar";
+/* empty css                                                                  */
+import "./Cropper.js";
+import "vue-draggable-next";
+import "@popperjs/core";
+const g = {
+  key: 0,
+  class: "fixed w-screen z-[1007] bg-white top-0 left-0 h-full min-h-screen bg-black/[.45] flex items-center justify-center"
+}, v = { class: "w-[calc(100%-40px)] h-[calc(100%-40px)]" }, y = { class: "modal-body p-9" }, S = {
+  __name: "OcModalPage",
+  props: {
+    modelValue: {
+      type: Boolean,
+      default: !1
+    },
+    persistent: {
+      type: Boolean,
+      default: !1
+    },
+    isCloseIconVisible: {
+      type: Boolean,
+      default: !0
+    },
+    isBackButtonVisible: {
+      type: Boolean,
+      default: !1
+    },
+    preventClose: {
+      type: Boolean,
+      default: !1
+    },
+    contentClass: {
+      type: String,
+      default: ""
+    }
+  },
+  emits: ["update:modelValue", "back", "click:outside"],
+  setup(o, { emit: p }) {
+    const l = p;
+    return (a, e) => o.modelValue ? (r(), s("div", g, [
+      t("div", v, [
+        n(a.$slots, "top"),
+        t("div", {
+          class: u(["relative z-[1008] shadow-normal max-w-[1440px] bg-[linear-gradient(180deg,_rgba(229,_238,_255,_0.5)_0%,_rgba(229,_238,_255,_0)_77.75%)] rounded-xl flex flex-col overflow-y-auto mx-auto", o.contentClass])
+        }, [
+          o.isBackButtonVisible ? (r(), s("div", {
+            key: 0,
+            class: "py-3 px-4 rounded cursor-pointer text-oc-gray-400 hover:bg-gray-100 hover:text-oc-text absolute top-5 left-5",
+            onClick: e[0] || (e[0] = (m) => l("back"))
+          }, [
+            i(d(f), {
+              variant: "secondary",
+              "is-transparent": "",
+              label: "Back",
+              "left-icon": "chevron-left"
+            })
+          ])) : c("", !0),
+          t("div", {
+            class: "flex gap-3 py-3 px-4 rounded cursor-pointer text-oc-gray-400 hover:bg-gray-100 hover:text-oc-text absolute top-5 right-5",
+            onClick: e[1] || (e[1] = (m) => l("update:model-value", !1))
+          }, [
+            i(d(x), {
+              name: "x",
+              width: "18",
+              height: "18"
+            }),
+            e[2] || (e[2] = t("span", null, "Close", -1))
+          ]),
+          t("div", y, [
+            n(a.$slots, "default")
+          ])
+        ], 2)
+      ])
+    ])) : c("", !0);
+  }
+};
+export {
+  S as _
+};