@pequity/squirrel 1.0.20-beta.2 → 1.0.20-beta.3

package/dist/cjs/p-modal.js

@@ -1 +1,369 @@
-"use strict";const e=require("vue"),A=require("./p-alert.js"),O=require("./p-close-btn.js"),M=require("./usePModal.js"),q=require("./chunks/_plugin-vue_export-helper.js"),$=["data-pm-backdrop-id"],L=["data-pm-wrapper-id","aria-label","aria-describedby","aria-labelledby"],W=["data-pm-id"],D={class:"flex pb-4 pl-8 pr-4 pt-4"},Z=["id"],j={class:"ml-auto"},F={key:0,class:"mb-4 px-8"},P=["id"],H={class:"mt-6 px-8 pt-6"},S='a[href], area[href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), button:not([disabled]), [tabindex]:not([tabindex="-1"])',K=e.defineComponent({name:"PModal",__name:"p-modal",props:{name:{type:String,default:""},title:{type:String,default:""},baseZindex:{type:Number,default:1051},bgClass:{type:[String,Object,Array],default:"fixed bottom-0 left-0 right-0 top-0 bg-black bg-opacity-20"},wrapperClass:{type:[String,Object,Array],default:"fixed bottom-0 left-0 right-0 top-0 flex flex-col items-center justify-center overflow-y-auto overflow-x-hidden outline-none"},modalClass:{type:[String,Object,Array],default:"pm relative flex flex-col rounded-2xl pb-6 cursor-default bg-surface shadow-xl"},modalStyle:{type:[String,Object,Array],default:""},inClass:{type:String,default:"slideInTop"},outClass:{type:String,default:"slideOutTop"},bgInClass:{type:String,default:"fadeIn"},bgOutClass:{type:String,default:"fadeOut"},appendTo:{type:String,default:"body"},live:{type:Boolean,default:!1},enableClose:{type:Boolean,default:!0},modelValue:{type:Boolean,default:!1},closeLabel:{type:String,default:"Close"},disabled:{type:Boolean,default:!1},errorMsg:{type:String,default:""},maxWidth:{type:String,default:"500px"}},emits:["before-open","opening","opened","before-close","closing","closed","update:modelValue"],setup(l,{emit:w}){e.useCssVars(t=>({"8a536574":l.maxWidth}));let f=0;const r=w,n=l,v=M.usePModal(),i=e.ref(0),s=e.ref(""),m=e.ref(!1),p=e.ref(!1),d=e.ref(null),u=e.ref(null);e.onBeforeMount(()=>{n.live&&(p.value=!0)}),e.onMounted(()=>{var a;s.value="pm-"+((a=e.getCurrentInstance())==null?void 0:a.uid);const t=n.name?()=>v.state.modals[n.name]:()=>n.modelValue;e.watch(t,o=>{o?(p.value=!0,e.nextTick(()=>{m.value=!0})):m.value=!1},{immediate:!0})}),e.onBeforeUnmount(()=>{d.value=null,n.name&&v.hide(n.name)});const b=()=>{n.enableClose===!0&&(r("update:modelValue",!1),n.name&&v.hide(n.name))},k=t=>{t.target===u.value&&b()},V=t=>{var a;if((t.which===27||t.keyCode===27)&&b(),t.which===9||t.keyCode===9){const o=[].slice.call((a=u.value)==null?void 0:a.querySelectorAll(S)).filter(function(c){return!!(c.offsetWidth||c.offsetHeight||c.getClientRects().length)});t.shiftKey?(t.target===o[0]||t.target===u.value)&&(t.preventDefault(),o[o.length-1].focus()):t.target===o[o.length-1]&&(t.preventDefault(),o[0].focus())}},C=()=>[].slice.call(document.querySelectorAll("[data-pm-wrapper-id]")).filter(t=>t.style.display!=="none"),h=()=>C().reduce((t,a)=>parseInt(a.style.zIndex)>t?parseInt(a.style.zIndex):t,0),x=t=>{const a=t.querySelector("[autofocus]");if(a)a.focus();else{const o=t.querySelectorAll(S);o.length?o[0].focus():t.focus()}},B=()=>{d.value=document.activeElement;const t=h();f?i.value=f+2:i.value=t===0?n.baseZindex:t+2,f=i.value,r("before-open")},N=()=>{r("opening")},E=()=>{x(u.value),r("opened")},I=()=>{r("before-close")},T=()=>{r("closing")},z=()=>{i.value=0,n.live||(p.value=!1),e.nextTick(()=>{window.requestAnimationFrame(()=>{var a,o;const t=h();if(t>0){const c=C();for(let y=0;y<c.length;y++){const g=c[y];if(parseInt(g.style.zIndex)===t){g.contains(d.value)?(a=d.value)==null||a.focus():x(g);break}}}else document.body.contains(d.value)&&((o=d.value)==null||o.focus());f=0,r("closed")})})};return(t,a)=>p.value?(e.openBlock(),e.createBlock(e.Teleport,{key:0,to:l.appendTo},[e.createVNode(e.Transition,{name:"pm-backdrop-transition","enter-active-class":l.bgInClass,"leave-active-class":l.bgOutClass},{default:e.withCtx(()=>[e.withDirectives(e.createElementVNode("div",{"data-pm-backdrop-id":s.value,class:e.normalizeClass(l.bgClass),style:e.normalizeStyle({"z-index":i.value-1})},null,14,$),[[e.vShow,m.value]])]),_:1},8,["enter-active-class","leave-active-class"]),e.createVNode(e.Transition,{name:"pm-transition","enter-active-class":l.inClass,"leave-active-class":l.outClass,onBeforeEnter:B,onEnter:N,onAfterEnter:E,onBeforeLeave:I,onLeave:T,onAfterLeave:z},{default:e.withCtx(()=>[e.withDirectives(e.createElementVNode("div",{ref_key:"pmWrapper",ref:u,"data-pm-wrapper-id":s.value,tabindex:"-1",class:e.normalizeClass(l.wrapperClass),style:e.normalizeStyle({"z-index":i.value,cursor:l.enableClose?"pointer":"default"}),role:"dialog","aria-label":l.title,"aria-modal":"true","aria-describedby":`${s.value}-content`,"aria-labelledby":`${s.value}-title`,onClick:a[0]||(a[0]=o=>k(o)),onKeydown:a[1]||(a[1]=o=>V(o))},[e.createElementVNode("div",{ref:"pm","data-pm-id":s.value,class:e.normalizeClass(l.modalClass),style:e.normalizeStyle(l.modalStyle)},[e.renderSlot(t.$slots,"title-wrapper",{},()=>[e.createElementVNode("div",D,[l.title?(e.openBlock(),e.createElementBlock("h3",{key:0,id:`${s.value}-title`,class:"mr-auto pt-4 text-xl font-semibold"},e.toDisplayString(l.title),9,Z)):e.createCommentVNode("",!0),e.createElementVNode("div",j,[l.enableClose?(e.openBlock(),e.createBlock(O,{key:0,disabled:l.disabled,"aria-label":l.closeLabel,onClick:e.withModifiers(b,["prevent"])},null,8,["disabled","aria-label"])):e.createCommentVNode("",!0)])])],!0),l.errorMsg?(e.openBlock(),e.createElementBlock("div",F,[e.createVNode(A,{type:"error"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(l.errorMsg),1)]),_:1})])):e.createCommentVNode("",!0),e.renderSlot(t.$slots,"content-wrapper",{},()=>[e.createElementVNode("div",{id:`${s.value}-content`,class:e.normalizeClass(["relative grow overflow-y-auto overflow-x-hidden px-8",{"pointer-events-none opacity-50":l.disabled}])},[e.renderSlot(t.$slots,"default",{},void 0,!0)],10,P)],!0),t.$slots.footer?e.renderSlot(t.$slots,"footer-wrapper",{key:1},()=>[e.createElementVNode("div",H,[e.renderSlot(t.$slots,"footer",{},void 0,!0)])],!0):e.createCommentVNode("",!0)],14,W)],46,L),[[e.vShow,m.value]])]),_:3},8,["enter-active-class","leave-active-class"])],8,["to"])):e.createCommentVNode("",!0)}}),U=q._export_sfc(K,[["__scopeId","data-v-ee599a02"]]);module.exports=U;
+"use strict";
+const vue = require("vue");
+const pAlert = require("./p-alert.js");
+const pCloseBtn = require("./p-close-btn.js");
+const usePModal = require("./usePModal.js");
+const _pluginVue_exportHelper = require("./chunks/_plugin-vue_export-helper.js");
+const _hoisted_1 = ["data-pm-backdrop-id"];
+const _hoisted_2 = ["data-pm-wrapper-id", "aria-label", "aria-describedby", "aria-labelledby"];
+const _hoisted_3 = ["data-pm-id"];
+const _hoisted_4 = { class: "flex pb-4 pl-8 pr-4 pt-4" };
+const _hoisted_5 = ["id"];
+const _hoisted_6 = { class: "ml-auto" };
+const _hoisted_7 = {
+  key: 0,
+  class: "mb-4 px-8"
+};
+const _hoisted_8 = ["id"];
+const _hoisted_9 = { class: "mt-6 px-8 pt-6" };
+const FOCUSABLE_ELEMENTS = 'a[href], area[href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), button:not([disabled]), [tabindex]:not([tabindex="-1"])';
+const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+  ...{
+    name: "PModal"
+  },
+  __name: "p-modal",
+  props: {
+    name: {
+      type: String,
+      default: ""
+    },
+    title: {
+      type: String,
+      default: ""
+    },
+    baseZindex: {
+      type: Number,
+      default: 1051
+    },
+    bgClass: {
+      type: [String, Object, Array],
+      default: "fixed bottom-0 left-0 right-0 top-0 bg-black bg-opacity-20"
+    },
+    wrapperClass: {
+      type: [String, Object, Array],
+      default: "fixed bottom-0 left-0 right-0 top-0 flex flex-col items-center justify-center overflow-y-auto overflow-x-hidden outline-none"
+    },
+    modalClass: {
+      type: [String, Object, Array],
+      default: "pm relative flex flex-col rounded-2xl pb-6 cursor-default bg-surface shadow-xl"
+    },
+    modalStyle: {
+      type: [String, Object, Array],
+      default: ""
+    },
+    inClass: {
+      type: String,
+      default: "slideInTop"
+    },
+    outClass: {
+      type: String,
+      default: "slideOutTop"
+    },
+    bgInClass: {
+      type: String,
+      default: "fadeIn"
+    },
+    bgOutClass: {
+      type: String,
+      default: "fadeOut"
+    },
+    appendTo: {
+      type: String,
+      default: "body"
+    },
+    live: {
+      type: Boolean,
+      default: false
+    },
+    enableClose: {
+      type: Boolean,
+      default: true
+    },
+    modelValue: {
+      type: Boolean,
+      default: false
+    },
+    closeLabel: {
+      type: String,
+      default: "Close"
+    },
+    disabled: {
+      type: Boolean,
+      default: false
+    },
+    errorMsg: {
+      type: String,
+      default: ""
+    },
+    maxWidth: {
+      type: String,
+      default: "500px"
+    }
+  },
+  emits: [
+    "before-open",
+    "opening",
+    "opened",
+    "before-close",
+    "closing",
+    "closed",
+    "update:modelValue"
+  ],
+  setup(__props, { emit: __emit }) {
+    vue.useCssVars((_ctx) => ({
+      "8a536574": __props.maxWidth
+    }));
+    let animatingZIndex = 0;
+    const emit = __emit;
+    const props = __props;
+    const modal = usePModal.usePModal();
+    const zIndex = vue.ref(0);
+    const id = vue.ref("");
+    const show = vue.ref(false);
+    const mount = vue.ref(false);
+    const elToFocus = vue.ref(null);
+    const pmWrapper = vue.ref(null);
+    vue.onBeforeMount(() => {
+      if (props.live) {
+        mount.value = true;
+      }
+    });
+    vue.onMounted(() => {
+      var _a;
+      id.value = "pm-" + ((_a = vue.getCurrentInstance()) == null ? void 0 : _a.uid);
+      const valueToWatch = !props.name ? () => props.modelValue : () => modal.state.modals[props.name];
+      vue.watch(
+        valueToWatch,
+        (newVal) => {
+          if (newVal) {
+            mount.value = true;
+            vue.nextTick(() => {
+              show.value = true;
+            });
+          } else {
+            show.value = false;
+          }
+        },
+        {
+          immediate: true
+        }
+      );
+    });
+    vue.onBeforeUnmount(() => {
+      elToFocus.value = null;
+      props.name && modal.hide(props.name);
+    });
+    const close = () => {
+      if (props.enableClose === true) {
+        emit("update:modelValue", false);
+        props.name && modal.hide(props.name);
+      }
+    };
+    const clickOutside = (e) => {
+      if (e.target === pmWrapper.value) {
+        close();
+      }
+    };
+    const keydown = (e) => {
+      var _a;
+      if (e.which === 27 || e.keyCode === 27) {
+        close();
+      }
+      if (e.which === 9 || e.keyCode === 9) {
+        const all = [].slice.call((_a = pmWrapper.value) == null ? void 0 : _a.querySelectorAll(FOCUSABLE_ELEMENTS)).filter(function(el) {
+          return !!(el.offsetWidth || el.offsetHeight || el.getClientRects().length);
+        });
+        if (e.shiftKey) {
+          if (e.target === all[0] || e.target === pmWrapper.value) {
+            e.preventDefault();
+            all[all.length - 1].focus();
+          }
+        } else {
+          if (e.target === all[all.length - 1]) {
+            e.preventDefault();
+            all[0].focus();
+          }
+        }
+      }
+    };
+    const getAllVisibleWrappers = () => {
+      return [].slice.call(document.querySelectorAll("[data-pm-wrapper-id]")).filter((w) => w.style.display !== "none");
+    };
+    const getTopZindex = () => {
+      return getAllVisibleWrappers().reduce((acc, curr) => {
+        return parseInt(curr.style.zIndex) > acc ? parseInt(curr.style.zIndex) : acc;
+      }, 0);
+    };
+    const handleFocus = (wrapper) => {
+      const autofocus = wrapper.querySelector("[autofocus]");
+      if (autofocus) {
+        autofocus.focus();
+      } else {
+        const focusable = wrapper.querySelectorAll(FOCUSABLE_ELEMENTS);
+        focusable.length ? focusable[0].focus() : wrapper.focus();
+      }
+    };
+    const beforeOpen = () => {
+      elToFocus.value = document.activeElement;
+      const lastZindex = getTopZindex();
+      if (animatingZIndex) {
+        zIndex.value = animatingZIndex + 2;
+      } else {
+        zIndex.value = lastZindex === 0 ? props.baseZindex : lastZindex + 2;
+      }
+      animatingZIndex = zIndex.value;
+      emit("before-open");
+    };
+    const opening = () => {
+      emit("opening");
+    };
+    const afterOpen = () => {
+      handleFocus(pmWrapper.value);
+      emit("opened");
+    };
+    const beforeClose = () => {
+      emit("before-close");
+    };
+    const closing = () => {
+      emit("closing");
+    };
+    const afterClose = () => {
+      zIndex.value = 0;
+      if (!props.live) {
+        mount.value = false;
+      }
+      vue.nextTick(() => {
+        window.requestAnimationFrame(() => {
+          var _a, _b;
+          const lastZindex = getTopZindex();
+          if (lastZindex > 0) {
+            const all = getAllVisibleWrappers();
+            for (let i = 0; i < all.length; i++) {
+              const wrapper = all[i];
+              if (parseInt(wrapper.style.zIndex) === lastZindex) {
+                if (wrapper.contains(elToFocus.value)) {
+                  (_a = elToFocus.value) == null ? void 0 : _a.focus();
+                } else {
+                  handleFocus(wrapper);
+                }
+                break;
+              }
+            }
+          } else {
+            if (document.body.contains(elToFocus.value)) {
+              (_b = elToFocus.value) == null ? void 0 : _b.focus();
+            }
+          }
+          animatingZIndex = 0;
+          emit("closed");
+        });
+      });
+    };
+    return (_ctx, _cache) => {
+      return mount.value ? (vue.openBlock(), vue.createBlock(vue.Teleport, {
+        key: 0,
+        to: __props.appendTo
+      }, [
+        vue.createVNode(vue.Transition, {
+          name: "pm-backdrop-transition",
+          "enter-active-class": __props.bgInClass,
+          "leave-active-class": __props.bgOutClass
+        }, {
+          default: vue.withCtx(() => [
+            vue.withDirectives(vue.createElementVNode("div", {
+              "data-pm-backdrop-id": id.value,
+              class: vue.normalizeClass(__props.bgClass),
+              style: vue.normalizeStyle({ "z-index": zIndex.value - 1 })
+            }, null, 14, _hoisted_1), [
+              [vue.vShow, show.value]
+            ])
+          ]),
+          _: 1
+        }, 8, ["enter-active-class", "leave-active-class"]),
+        vue.createVNode(vue.Transition, {
+          name: "pm-transition",
+          "enter-active-class": __props.inClass,
+          "leave-active-class": __props.outClass,
+          onBeforeEnter: beforeOpen,
+          onEnter: opening,
+          onAfterEnter: afterOpen,
+          onBeforeLeave: beforeClose,
+          onLeave: closing,
+          onAfterLeave: afterClose
+        }, {
+          default: vue.withCtx(() => [
+            vue.withDirectives(vue.createElementVNode("div", {
+              ref_key: "pmWrapper",
+              ref: pmWrapper,
+              "data-pm-wrapper-id": id.value,
+              tabindex: "-1",
+              class: vue.normalizeClass(__props.wrapperClass),
+              style: vue.normalizeStyle({ "z-index": zIndex.value, cursor: __props.enableClose ? "pointer" : "default" }),
+              role: "dialog",
+              "aria-label": __props.title,
+              "aria-modal": "true",
+              "aria-describedby": `${id.value}-content`,
+              "aria-labelledby": `${id.value}-title`,
+              onClick: _cache[0] || (_cache[0] = ($event) => clickOutside($event)),
+              onKeydown: _cache[1] || (_cache[1] = ($event) => keydown($event))
+            }, [
+              vue.createElementVNode("div", {
+                ref: "pm",
+                "data-pm-id": id.value,
+                class: vue.normalizeClass(__props.modalClass),
+                style: vue.normalizeStyle(__props.modalStyle)
+              }, [
+                vue.renderSlot(_ctx.$slots, "title-wrapper", {}, () => [
+                  vue.createElementVNode("div", _hoisted_4, [
+                    __props.title ? (vue.openBlock(), vue.createElementBlock("h3", {
+                      key: 0,
+                      id: `${id.value}-title`,
+                      class: "mr-auto pt-4 text-xl font-semibold"
+                    }, vue.toDisplayString(__props.title), 9, _hoisted_5)) : vue.createCommentVNode("", true),
+                    vue.createElementVNode("div", _hoisted_6, [
+                      __props.enableClose ? (vue.openBlock(), vue.createBlock(pCloseBtn, {
+                        key: 0,
+                        disabled: __props.disabled,
+                        "aria-label": __props.closeLabel,
+                        onClick: vue.withModifiers(close, ["prevent"])
+                      }, null, 8, ["disabled", "aria-label"])) : vue.createCommentVNode("", true)
+                    ])
+                  ])
+                ], true),
+                __props.errorMsg ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_7, [
+                  vue.createVNode(pAlert, { type: "error" }, {
+                    default: vue.withCtx(() => [
+                      vue.createTextVNode(vue.toDisplayString(__props.errorMsg), 1)
+                    ]),
+                    _: 1
+                  })
+                ])) : vue.createCommentVNode("", true),
+                vue.renderSlot(_ctx.$slots, "content-wrapper", {}, () => [
+                  vue.createElementVNode("div", {
+                    id: `${id.value}-content`,
+                    class: vue.normalizeClass([
+                      "relative grow overflow-y-auto overflow-x-hidden px-8",
+                      { "pointer-events-none opacity-50": __props.disabled }
+                    ])
+                  }, [
+                    vue.renderSlot(_ctx.$slots, "default", {}, void 0, true)
+                  ], 10, _hoisted_8)
+                ], true),
+                _ctx.$slots["footer"] ? vue.renderSlot(_ctx.$slots, "footer-wrapper", { key: 1 }, () => [
+                  vue.createElementVNode("div", _hoisted_9, [
+                    vue.renderSlot(_ctx.$slots, "footer", {}, void 0, true)
+                  ])
+                ], true) : vue.createCommentVNode("", true)
+              ], 14, _hoisted_3)
+            ], 46, _hoisted_2), [
+              [vue.vShow, show.value]
+            ])
+          ]),
+          _: 3
+        }, 8, ["enter-active-class", "leave-active-class"])
+      ], 8, ["to"])) : vue.createCommentVNode("", true);
+    };
+  }
+});
+const pModal = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main, [["__scopeId", "data-v-ee599a02"]]);
+module.exports = pModal;

package/dist/cjs/p-pagination-info.js

@@ -1 +1,3 @@
-"use strict";const e=require("./chunks/p-pagination-info.js");module.exports=e._sfc_main;
+"use strict";
+const pPaginationInfo_vue_vue_type_script_setup_true_lang = require("./chunks/p-pagination-info.js");
+module.exports = pPaginationInfo_vue_vue_type_script_setup_true_lang._sfc_main;

package/dist/cjs/p-pagination.js

@@ -1 +1,3 @@
-"use strict";const e=require("./chunks/p-pagination.js");module.exports=e._sfc_main;
+"use strict";
+const pPagination_vue_vue_type_script_setup_true_lang = require("./chunks/p-pagination.js");
+module.exports = pPagination_vue_vue_type_script_setup_true_lang._sfc_main;

package/dist/cjs/p-progress-bar.js

@@ -1 +1,41 @@
-"use strict";const e=require("vue"),l=require("./chunks/_plugin-vue_export-helper.js"),s=e.defineComponent({name:"PProgressBar",props:{total:{type:Number,required:!0},items:{type:Array,required:!0}}}),n={class:"flex justify-start overflow-hidden rounded bg-p-blue-20",role:"progressbar"};function c(t,u,p,a,d,_){const o=e.resolveDirective("tooltip");return e.openBlock(),e.createElementBlock("div",n,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.items,r=>e.withDirectives((e.openBlock(),e.createElementBlock("div",{key:`progress-value-${r.color}`,class:"h-full",style:e.normalizeStyle({width:`${r.value/t.total*100}%`,background:r.color})},null,4)),[[o,r.label,void 0,{top:!0}]])),128))])}const i=l._export_sfc(s,[["render",c]]);module.exports=i;
+"use strict";
+const vue = require("vue");
+const _pluginVue_exportHelper = require("./chunks/_plugin-vue_export-helper.js");
+const _sfc_main = vue.defineComponent({
+  name: "PProgressBar",
+  props: {
+    total: {
+      type: Number,
+      required: true
+    },
+    items: {
+      type: Array,
+      required: true
+    }
+  }
+});
+const _hoisted_1 = {
+  class: "flex justify-start overflow-hidden rounded bg-p-blue-20",
+  role: "progressbar"
+};
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _directive_tooltip = vue.resolveDirective("tooltip");
+  return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
+    (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.items, (item) => {
+      return vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", {
+        key: `progress-value-${item.color}`,
+        class: "h-full",
+        style: vue.normalizeStyle({ width: `${item.value / _ctx.total * 100}%`, background: item.color })
+      }, null, 4)), [
+        [
+          _directive_tooltip,
+          item.label,
+          void 0,
+          { top: true }
+        ]
+      ]);
+    }), 128))
+  ]);
+}
+const pProgressBar = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main, [["render", _sfc_render]]);
+module.exports = pProgressBar;

package/dist/cjs/p-ring-loader.js

@@ -1 +1,3 @@
-"use strict";const e=require("./chunks/p-ring-loader.js");module.exports=e._sfc_main;
+"use strict";
+const pRingLoader_vue_vue_type_script_setup_true_lang = require("./chunks/p-ring-loader.js");
+module.exports = pRingLoader_vue_vue_type_script_setup_true_lang._sfc_main;

package/dist/cjs/p-select-btn.js

@@ -1 +1,3 @@
-"use strict";const e=require("./chunks/p-select-btn.js");module.exports=e._sfc_main;
+"use strict";
+const pSelectBtn_vue_vue_type_script_setup_true_lang = require("./chunks/p-select-btn.js");
+module.exports = pSelectBtn_vue_vue_type_script_setup_true_lang._sfc_main;

package/dist/cjs/p-select-list.js

@@ -1 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t={sm:"h-8 text-sm",md:"h-10 text-base",lg:"h-12 text-lg"};exports.SIZES=t;
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const SIZES = { sm: `h-8 text-sm`, md: `h-10 text-base`, lg: `h-12 text-lg` };
+exports.SIZES = SIZES;

package/dist/cjs/p-select-pill.js

@@ -1 +1,111 @@
-"use strict";const t=require("vue"),a=require("./chunks/_plugin-vue_export-helper.js"),n={sm:"h-7 px-4 text-xs",md:"h-9 px-5 text-sm",lg:"h-11 px-7 text-base"},o="text-p-purple-60",u=e=>{const l=e.cloneNode(!0);l.style.visibility="hidden",document.body.appendChild(l);const s=l.querySelector(`button.${o}`),r={width:`${s.offsetWidth}px`,left:`${s.offsetLeft}px`};return document.body.removeChild(l),r},c=t.defineComponent({props:{modelValue:{type:[String,Number],default:""},items:{type:Array,default:()=>[]},itemText:{type:String,default:"text"},itemSubtext:{type:String,default:"subtext"},itemValue:{type:[String,Number],default:"value"},size:{type:String,default:"md",validator(e){return Object.keys(n).includes(e)}}},emits:["update:modelValue"],data(){return{SIZES:n,ACTIVE_CLASS:o}},watch:{modelValue:{handler(){setTimeout(()=>this.setPillStyle(),60)},immediate:!0}},methods:{click(e,l){l.disabled||this.$emit("update:modelValue",l[this.itemValue])},setPillStyle(){const e=this.$el.querySelector(`button.${o}`);if(!e)return;const l=e.offsetWidth!==0?{left:`${e.offsetLeft}px`,width:`${e.offsetWidth}px`}:u(this.$el);this.$refs.pill.style.left=l.left,this.$refs.pill.style.width=l.width}}}),p={class:"relative inline-flex rounded-full border-2 border-p-gray-30 bg-p-gray-30 text-center font-semibold text-p-gray-50"},m={ref:"pill",class:"absolute left-0 top-0 inline-block h-full rounded-full bg-surface duration-200 ease-in-out"},f=["disabled","onClick"],h={class:"flex"},y={key:0,class:"pl-1 opacity-50"};function b(e,l,s,r,x,g){return t.openBlock(),t.createElementBlock("div",p,[t.createElementVNode("div",m,null,512),(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(e.items,i=>(t.openBlock(),t.createElementBlock("button",{key:i[e.itemValue],disabled:i.disabled,class:t.normalizeClass(["z-10 duration-700",[e.SIZES[e.size],e.modelValue===i[e.itemValue]?`${e.ACTIVE_CLASS} hover:text-p-purple-70`:"hover:text-p-gray-60",{"opacity-25":i.disabled}]]),onClick:d=>e.click(d,i)},[t.createElementVNode("div",h,[t.createElementVNode("div",null,t.toDisplayString(i[e.itemText]),1),i[e.itemSubtext]?(t.openBlock(),t.createElementBlock("div",y,t.toDisplayString(i[e.itemSubtext]),1)):t.createCommentVNode("",!0)])],10,f))),128))])}const S=a._export_sfc(c,[["render",b]]);module.exports=S;
+"use strict";
+const vue = require("vue");
+const _pluginVue_exportHelper = require("./chunks/_plugin-vue_export-helper.js");
+const SIZES = { sm: "h-7 px-4 text-xs", md: "h-9 px-5 text-sm", lg: "h-11 px-7 text-base" };
+const ACTIVE_CLASS = "text-p-purple-60";
+const getOffsetValues = (container) => {
+  const el = container.cloneNode(true);
+  el.style.visibility = "hidden";
+  document.body.appendChild(el);
+  const activeBtn = el.querySelector(`button.${ACTIVE_CLASS}`);
+  const res = { width: `${activeBtn.offsetWidth}px`, left: `${activeBtn.offsetLeft}px` };
+  document.body.removeChild(el);
+  return res;
+};
+const _sfc_main = vue.defineComponent({
+  props: {
+    modelValue: {
+      type: [String, Number],
+      default: ""
+    },
+    items: {
+      type: Array,
+      default: () => []
+    },
+    itemText: {
+      type: String,
+      default: "text"
+    },
+    itemSubtext: {
+      type: String,
+      default: "subtext"
+    },
+    itemValue: {
+      type: [String, Number],
+      default: "value"
+    },
+    size: {
+      type: String,
+      default: "md",
+      validator(value) {
+        return Object.keys(SIZES).includes(value);
+      }
+    }
+  },
+  emits: ["update:modelValue"],
+  data() {
+    return {
+      SIZES,
+      ACTIVE_CLASS
+    };
+  },
+  watch: {
+    modelValue: {
+      handler() {
+        setTimeout(() => this.setPillStyle(), 60);
+      },
+      immediate: true
+    }
+  },
+  methods: {
+    click(e, option) {
+      if (!option.disabled) {
+        this.$emit("update:modelValue", option[this.itemValue]);
+      }
+    },
+    setPillStyle() {
+      const el = this.$el.querySelector(`button.${ACTIVE_CLASS}`);
+      if (!el) {
+        return;
+      }
+      const dimensions = el.offsetWidth !== 0 ? { left: `${el.offsetLeft}px`, width: `${el.offsetWidth}px` } : getOffsetValues(this.$el);
+      this.$refs.pill.style.left = dimensions.left;
+      this.$refs.pill.style.width = dimensions.width;
+    }
+  }
+});
+const _hoisted_1 = { class: "relative inline-flex rounded-full border-2 border-p-gray-30 bg-p-gray-30 text-center font-semibold text-p-gray-50" };
+const _hoisted_2 = {
+  ref: "pill",
+  class: "absolute left-0 top-0 inline-block h-full rounded-full bg-surface duration-200 ease-in-out"
+};
+const _hoisted_3 = ["disabled", "onClick"];
+const _hoisted_4 = { class: "flex" };
+const _hoisted_5 = {
+  key: 0,
+  class: "pl-1 opacity-50"
+};
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
+    vue.createElementVNode("div", _hoisted_2, null, 512),
+    (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.items, (o) => {
+      return vue.openBlock(), vue.createElementBlock("button", {
+        key: o[_ctx.itemValue],
+        disabled: o.disabled,
+        class: vue.normalizeClass(["z-10 duration-700", [
+          _ctx.SIZES[_ctx.size],
+          _ctx.modelValue === o[_ctx.itemValue] ? `${_ctx.ACTIVE_CLASS} hover:text-p-purple-70` : "hover:text-p-gray-60",
+          { "opacity-25": o.disabled }
+        ]]),
+        onClick: ($event) => _ctx.click($event, o)
+      }, [
+        vue.createElementVNode("div", _hoisted_4, [
+          vue.createElementVNode("div", null, vue.toDisplayString(o[_ctx.itemText]), 1),
+          o[_ctx.itemSubtext] ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_5, vue.toDisplayString(o[_ctx.itemSubtext]), 1)) : vue.createCommentVNode("", true)
+        ])
+      ], 10, _hoisted_3);
+    }), 128))
+  ]);
+}
+const pSelectPill = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main, [["render", _sfc_render]]);
+module.exports = pSelectPill;

package/dist/cjs/p-select.js

@@ -1 +1,3 @@
-"use strict";const e=require("./chunks/p-select.js");module.exports=e._sfc_main;
+"use strict";
+const pSelect_vue_vue_type_script_setup_true_lang = require("./chunks/p-select.js");
+module.exports = pSelect_vue_vue_type_script_setup_true_lang._sfc_main;

package/dist/cjs/p-skeleton-loader.js

@@ -1 +1,73 @@
-"use strict";const t=require("vue"),n=require("./chunks/_plugin-vue_export-helper.js"),s={rectangle:"rectangle",circle:"circle"},o={[s.rectangle]:"rounded",[s.circle]:"rounded-full"},a="#ffffff",c=e=>{const r=e.replace("#","");return typeof e=="string"&&e.startsWith("#")&&r.length===6&&!isNaN(+("0x"+r))},i=e=>{var r;return`${(r=e.match(/\w\w/g))==null?void 0:r.map(l=>+`0x${l}`)}`},d=t.defineComponent({name:"PSkeletonLoader",props:{type:{type:String,default:s.rectangle,validator(e){return Object.values(s).includes(e)}},bgClass:{type:String,default:"bg-p-gray-30"},cssClass:{type:String,default:""},shimmerColor:{type:String,default:a}},data(){return{LOADER_TYPES:s}},computed:{shimmerStyle(){const e=c(this.shimmerColor)?i(this.shimmerColor):a;return{backgroundImage:`linear-gradient(90deg, rgba(${e}, 0) 0%, rgba(${e}, 0.2) 20%, rgba(${e}, 0.5) 60%, rgba(${e}, 0))`}},loaderClass(){return this.cssClass?this.cssClass:o[this.type]}}});function u(e,r,l,p,m,f){return t.openBlock(),t.createElementBlock("div",{class:t.normalizeClass([e.bgClass,e.loaderClass,"relative overflow-hidden"])},[t.createElementVNode("div",{class:"shimmer absolute bottom-0 left-0 right-0 top-0",style:t.normalizeStyle(e.shimmerStyle)},null,4),t.renderSlot(e.$slots,"default",{},void 0,!0)],2)}const g=n._export_sfc(d,[["render",u],["__scopeId","data-v-53e537dc"]]);module.exports=g;
+"use strict";
+const vue = require("vue");
+const _pluginVue_exportHelper = require("./chunks/_plugin-vue_export-helper.js");
+const LOADER_TYPES = {
+  rectangle: "rectangle",
+  circle: "circle"
+};
+const LOADER_CSS_CLASSES = {
+  [LOADER_TYPES.rectangle]: "rounded",
+  [LOADER_TYPES.circle]: "rounded-full"
+};
+const SHIMMER_COLOR = "#ffffff";
+const isHexColor = (hexColor) => {
+  const hex = hexColor.replace("#", "");
+  return typeof hexColor === "string" && hexColor.startsWith("#") && hex.length === 6 && !isNaN(Number("0x" + hex));
+};
+const hexToRgb = (hex) => {
+  var _a;
+  return `${(_a = hex.match(/\w\w/g)) == null ? void 0 : _a.map((x) => +`0x${x}`)}`;
+};
+const _sfc_main = vue.defineComponent({
+  name: "PSkeletonLoader",
+  props: {
+    type: {
+      type: String,
+      default: LOADER_TYPES.rectangle,
+      validator(value) {
+        return Object.values(LOADER_TYPES).includes(value);
+      }
+    },
+    bgClass: {
+      type: String,
+      default: "bg-p-gray-30"
+    },
+    cssClass: {
+      type: String,
+      default: ""
+    },
+    shimmerColor: {
+      type: String,
+      default: SHIMMER_COLOR
+    }
+  },
+  data() {
+    return {
+      LOADER_TYPES
+    };
+  },
+  computed: {
+    shimmerStyle() {
+      const rgb = isHexColor(this.shimmerColor) ? hexToRgb(this.shimmerColor) : SHIMMER_COLOR;
+      return {
+        backgroundImage: `linear-gradient(90deg, rgba(${rgb}, 0) 0%, rgba(${rgb}, 0.2) 20%, rgba(${rgb}, 0.5) 60%, rgba(${rgb}, 0))`
+      };
+    },
+    loaderClass() {
+      return this.cssClass ? this.cssClass : LOADER_CSS_CLASSES[this.type];
+    }
+  }
+});
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  return vue.openBlock(), vue.createElementBlock("div", {
+    class: vue.normalizeClass([_ctx.bgClass, _ctx.loaderClass, "relative overflow-hidden"])
+  }, [
+    vue.createElementVNode("div", {
+      class: "shimmer absolute bottom-0 left-0 right-0 top-0",
+      style: vue.normalizeStyle(_ctx.shimmerStyle)
+    }, null, 4),
+    vue.renderSlot(_ctx.$slots, "default", {}, void 0, true)
+  ], 2);
+}
+const PSkeletonLoader = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-53e537dc"]]);
+module.exports = PSkeletonLoader;

package/dist/cjs/p-table-filter-icon.js

@@ -1 +1,20 @@
-"use strict";const e=require("vue"),r=require("./chunks/_plugin-vue_export-helper.js"),n=e.defineComponent({name:"PTableFilterIcon",inheritAttrs:!1,props:{active:{type:Boolean,default:!1}}});function o(t,c,a,i,l,p){return e.openBlock(),e.createElementBlock("div",e.mergeProps({class:["h-5 w-5 shrink-0 cursor-pointer filter",{active:t.active}]},t.$attrs),null,16)}const s=r._export_sfc(n,[["render",o],["__scopeId","data-v-cbac2434"]]);module.exports=s;
+"use strict";
+const vue = require("vue");
+const _pluginVue_exportHelper = require("./chunks/_plugin-vue_export-helper.js");
+const _sfc_main = vue.defineComponent({
+  name: "PTableFilterIcon",
+  inheritAttrs: false,
+  props: {
+    active: {
+      type: Boolean,
+      default: false
+    }
+  }
+});
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  return vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
+    class: ["h-5 w-5 shrink-0 cursor-pointer filter", { active: _ctx.active }]
+  }, _ctx.$attrs), null, 16);
+}
+const PTableFilterIcon = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-cbac2434"]]);
+module.exports = PTableFilterIcon;