@oneb/ui-vue 0.3.32 → 0.4.1

package/dist/useModal-0c73777f.cjs

@@ -1 +0,0 @@
-"use strict";const e=require("vue"),y=require("./_plugin-vue_export-helper-f246444f.cjs"),v={useModal:{required:!0,type:Object},title:{required:!1,type:String},subtitle:{required:!1,type:String,default:""},size:{type:String,default:"medium"},onClose:{type:Function},classModal:{type:Boolean,default:!1},titleCenter:{type:Boolean,default:!1},classTitle:{type:String,default:""},canClose:{type:Function,default:()=>!0},customWidth:{type:String,default:""}},g={"3xs":["max-w-xs"],xs:["max-w-sm"],sm:["max-w-md"],small:["max-w-lg"],md:["max-w-xl"],medium:["max-w-xl"],large:["max-w-2xl"],xl:["max-w-3xl"],"2xl":["max-w-4xl"],"3xl":["max-w-4xl"],"4xl":["max-w-5xl"],"5xl":["max-w-5xl"],"7xl":["max-w-7xl"]},C=(r="medium")=>{const n=[];return n.push(...g[r]??[]),n},h={class:"relative bg-white rounded-lg shadow h-full"},b=e.defineComponent({__name:"OneModal",props:v,emits:["isOpen","closed"],setup(r,{expose:n,emit:i}){const l=r,a=i,m=e.computed(()=>{var s,u;const t=l.useModal;return((s=t==null?void 0:t.isOpened)==null?void 0:s.value)??((u=t==null?void 0:t.isOpen)==null?void 0:u.value)??!1}),p=e.computed(()=>C(l.size)),d=e.computed(()=>l.customWidth?{width:l.customWidth}:{}),o=e.ref(null),f=e.ref(!1);function x(t){f.value=!1,o.value&&!o.value.contains(t.target)&&(f.value=!0)}function w(t){f.value&&o.value&&!o.value.contains(t.target)&&c()}const c=()=>{var s,u;if(l.canClose&&!l.canClose())return;const t=l.useModal;(s=t==null?void 0:t.close)==null||s.call(t),(u=l.onClose)==null||u.call(l),a("closed"),a("isOpen")};return n({open:()=>{var s;const t=l.useModal;(s=t==null?void 0:t.open)==null||s.call(t),a("isOpen")},close:c}),(t,s)=>m.value?(e.openBlock(),e.createElementBlock("div",{key:0,tabindex:"-1",onMousedown:x,onMouseup:w,class:e.normalizeClass(["modal backdrop !m-0",{"modal-mobile":t.classModal}])},[e.createElementVNode("div",{class:e.normalizeClass(["relative w-full max-h-full",p.value,{"fixed bottom-0 left-0 right-0 w-full bg-white rounded-t-xl mobile-modal":t.classModal}]),style:e.normalizeStyle(d.value),ref_key:"modalContent",ref:o},[e.createElementVNode("div",h,[t.title?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass([t.titleCenter?"grid grid-cols-4":"flex items-start justify-between","p-3 border-b rounded-t",t.classTitle])},[e.createElementVNode("div",{class:e.normalizeClass(["flex flex-col min-w-0",t.titleCenter?"col-span-2 col-start-2 items-center":""])},[e.createElementVNode("h3",{class:e.normalizeClass(["text-xl font-semibold text-gray-900 whitespace-nowrap overflow-hidden text-ellipsis max-w-full",t.titleCenter?"text-center":""])},e.toDisplayString(t.title),3),t.$slots.subtitle||t.subtitle?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(["text-sm text-gray-500 mt-0.5 max-w-full",t.titleCenter?"text-center":""])},[e.renderSlot(t.$slots,"subtitle",{},()=>[e.createTextVNode(e.toDisplayString(t.subtitle),1)],!0)],2)):e.createCommentVNode("",!0)],2),e.createElementVNode("button",{type:"button",class:"text-gray-400 bg-transparent hover:bg-gray-200 hover:text-gray-900 rounded-lg text-sm p-1.5 ml-auto inline-flex items-center",onClick:c},[...s[0]||(s[0]=[e.createElementVNode("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24","stroke-width":"1.8",stroke:"currentColor","aria-hidden":"true",class:"w-5 h-5"},[e.createElementVNode("path",{"stroke-linecap":"round","stroke-linejoin":"round",d:"M6 18L18 6M6 6l12 12"})],-1)])])],2)):e.createCommentVNode("",!0),e.renderSlot(t.$slots,"header",{},void 0,!0),e.renderSlot(t.$slots,"body",{},void 0,!0),e.renderSlot(t.$slots,"default",{},void 0,!0),e.renderSlot(t.$slots,"footer",{close:c},void 0,!0)])],6)],34)):e.createCommentVNode("",!0)}});const M=y._export_sfc(b,[["__scopeId","data-v-83c666bc"]]);function k(r=!1){const n=e.ref(r),i=e.ref(void 0);let l=null;const a=()=>{l&&(clearTimeout(l),l=null),n.value=!1,i.value=void 0},m=o=>{i.value=o,n.value=!0},p=o=>{l&&clearTimeout(l),l=setTimeout(a,o*1e3)},d=o=>{o.key==="Escape"&&n.value&&a()};return e.onMounted(()=>{document.addEventListener("keydown",d)}),e.onBeforeUnmount(()=>{document.removeEventListener("keydown",d),l&&clearTimeout(l)}),{isOpened:n,isOpen:n,data:i,open:m,close:a,closeWithDelay:p}}exports.OneModal=M;exports.modalProps=v;exports.useModal=k;

package/dist/useModal-7fe9444b.js

@@ -1,194 +0,0 @@
-import { defineComponent as O, computed as y, ref as p, openBlock as g, createElementBlock as h, normalizeClass as i, createElementVNode as a, normalizeStyle as S, toDisplayString as C, renderSlot as c, createTextVNode as T, createCommentVNode as b, onMounted as z, onBeforeUnmount as B } from "vue";
-import { _ as $ } from "./_plugin-vue_export-helper-dad06003.js";
-const E = {
-  useModal: {
-    required: !0,
-    type: Object
-  },
-  title: {
-    required: !1,
-    type: String
-  },
-  subtitle: {
-    required: !1,
-    type: String,
-    default: ""
-  },
-  size: {
-    type: String,
-    default: "medium"
-  },
-  onClose: {
-    type: Function
-  },
-  classModal: {
-    type: Boolean,
-    default: !1
-  },
-  titleCenter: {
-    type: Boolean,
-    default: !1
-  },
-  classTitle: {
-    type: String,
-    default: ""
-  },
-  canClose: {
-    type: Function,
-    default: () => !0
-  },
-  customWidth: {
-    type: String,
-    default: ""
-  }
-}, L = {
-  "3xs": ["max-w-xs"],
-  xs: ["max-w-sm"],
-  sm: ["max-w-md"],
-  small: ["max-w-lg"],
-  md: ["max-w-xl"],
-  medium: ["max-w-xl"],
-  large: ["max-w-2xl"],
-  xl: ["max-w-3xl"],
-  "2xl": ["max-w-4xl"],
-  "3xl": ["max-w-4xl"],
-  "4xl": ["max-w-5xl"],
-  "5xl": ["max-w-5xl"],
-  "7xl": ["max-w-7xl"]
-}, W = (r = "medium") => {
-  const o = [];
-  return o.push(...L[r] ?? []), o;
-}, D = { class: "relative bg-white rounded-lg shadow h-full" }, _ = /* @__PURE__ */ O({
-  __name: "OneModal",
-  props: E,
-  emits: ["isOpen", "closed"],
-  setup(r, { expose: o, emit: u }) {
-    const t = r, n = u, v = y(() => {
-      var s, d;
-      const e = t.useModal;
-      return ((s = e == null ? void 0 : e.isOpened) == null ? void 0 : s.value) ?? ((d = e == null ? void 0 : e.isOpen) == null ? void 0 : d.value) ?? !1;
-    }), x = y(() => W(t.size)), m = y(() => t.customWidth ? { width: t.customWidth } : {}), l = p(null), w = p(!1);
-    function M(e) {
-      w.value = !1, l.value && !l.value.contains(e.target) && (w.value = !0);
-    }
-    function k(e) {
-      w.value && l.value && !l.value.contains(e.target) && f();
-    }
-    const f = () => {
-      var s, d;
-      if (t.canClose && !t.canClose())
-        return;
-      const e = t.useModal;
-      (s = e == null ? void 0 : e.close) == null || s.call(e), (d = t.onClose) == null || d.call(t), n("closed"), n("isOpen");
-    };
-    return o({
-      open: () => {
-        var s;
-        const e = t.useModal;
-        (s = e == null ? void 0 : e.open) == null || s.call(e), n("isOpen");
-      },
-      close: f
-    }), (e, s) => v.value ? (g(), h("div", {
-      key: 0,
-      tabindex: "-1",
-      onMousedown: M,
-      onMouseup: k,
-      class: i(["modal backdrop !m-0", { "modal-mobile": e.classModal }])
-    }, [
-      a("div", {
-        class: i([
-          "relative w-full max-h-full",
-          x.value,
-          { "fixed bottom-0 left-0 right-0 w-full bg-white rounded-t-xl mobile-modal": e.classModal }
-        ]),
-        style: S(m.value),
-        ref_key: "modalContent",
-        ref: l
-      }, [
-        a("div", D, [
-          e.title ? (g(), h("div", {
-            key: 0,
-            class: i([
-              e.titleCenter ? "grid grid-cols-4" : "flex items-start justify-between",
-              "p-3 border-b rounded-t",
-              e.classTitle
-            ])
-          }, [
-            a("div", {
-              class: i(["flex flex-col min-w-0", e.titleCenter ? "col-span-2 col-start-2 items-center" : ""])
-            }, [
-              a("h3", {
-                class: i(["text-xl font-semibold text-gray-900 whitespace-nowrap overflow-hidden text-ellipsis max-w-full", e.titleCenter ? "text-center" : ""])
-              }, C(e.title), 3),
-              e.$slots.subtitle || e.subtitle ? (g(), h("div", {
-                key: 0,
-                class: i(["text-sm text-gray-500 mt-0.5 max-w-full", e.titleCenter ? "text-center" : ""])
-              }, [
-                c(e.$slots, "subtitle", {}, () => [
-                  T(C(e.subtitle), 1)
-                ], !0)
-              ], 2)) : b("", !0)
-            ], 2),
-            a("button", {
-              type: "button",
-              class: "text-gray-400 bg-transparent hover:bg-gray-200 hover:text-gray-900 rounded-lg text-sm p-1.5 ml-auto inline-flex items-center",
-              onClick: f
-            }, [...s[0] || (s[0] = [
-              a("svg", {
-                xmlns: "http://www.w3.org/2000/svg",
-                fill: "none",
-                viewBox: "0 0 24 24",
-                "stroke-width": "1.8",
-                stroke: "currentColor",
-                "aria-hidden": "true",
-                class: "w-5 h-5"
-              }, [
-                a("path", {
-                  "stroke-linecap": "round",
-                  "stroke-linejoin": "round",
-                  d: "M6 18L18 6M6 6l12 12"
-                })
-              ], -1)
-            ])])
-          ], 2)) : b("", !0),
-          c(e.$slots, "header", {}, void 0, !0),
-          c(e.$slots, "body", {}, void 0, !0),
-          c(e.$slots, "default", {}, void 0, !0),
-          c(e.$slots, "footer", { close: f }, void 0, !0)
-        ])
-      ], 6)
-    ], 34)) : b("", !0);
-  }
-});
-const V = /* @__PURE__ */ $(_, [["__scopeId", "data-v-83c666bc"]]);
-function F(r = !1) {
-  const o = p(r), u = p(void 0);
-  let t = null;
-  const n = () => {
-    t && (clearTimeout(t), t = null), o.value = !1, u.value = void 0;
-  }, v = (l) => {
-    u.value = l, o.value = !0;
-  }, x = (l) => {
-    t && clearTimeout(t), t = setTimeout(n, l * 1e3);
-  }, m = (l) => {
-    l.key === "Escape" && o.value && n();
-  };
-  return z(() => {
-    document.addEventListener("keydown", m);
-  }), B(() => {
-    document.removeEventListener("keydown", m), t && clearTimeout(t);
-  }), {
-    isOpened: o,
-    isOpen: o,
-    // alias for backward compatibility
-    data: u,
-    open: v,
-    close: n,
-    closeWithDelay: x
-  };
-}
-export {
-  V as O,
-  E as m,
-  F as u
-};