@pequity/squirrel 7.0.3 → 7.1.1

package/README.md

@@ -10,7 +10,7 @@ The library is built using [Vue 3](https://vuejs.org/) and [Tailwind CSS](https:
 Install the package and its dependencies using `pnpm`:
 
 ```bash
-pnpm i vue vue-router @pequity/squirrel @tanstack/vue-virtual @vuepic/vue-datepicker dayjs floating-vue lodash-es vue-currency-input vue-toastification@2.0.0-rc.5
+pnpm i vue vue-router @pequity/squirrel @tanstack/vue-virtual @vuepic/vue-datepicker floating-vue lodash-es vue-currency-input vue-toastification@2.0.0-rc.5
 ```
 
 Install Tailwind CSS:

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

@@ -6,8 +6,7 @@ const pRingLoader_vue_vue_type_script_setup_true_lang = require("./p-ring-loader
 const link = require("../link.js");
 const sanitization = require("../sanitization.js");
 const index = require("./index.js");
-const _hoisted_1 = ["href", "disabled", "aria-disabled"];
-const _hoisted_2 = { class: "slot-wrapper empty:hidden" };
+const _hoisted_1 = { class: "slot-wrapper empty:hidden" };
 const btnClasses = {
   slots: {
     button: "relative inline-block whitespace-nowrap rounded font-medium outline-none disabled:pointer-events-none disabled:cursor-default disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:cursor-default aria-disabled:opacity-50",
@@ -47,7 +46,7 @@ const btnClasses = {
       sm: {
         button: "px-3 has-[.slot-wrapper:empty]:px-1.5 py-1.5 text-sm leading-5",
         content: "gap-1",
-        icon: "text-[20px]"
+        icon: "text-base p-0.5"
       },
       md: {
         button: "px-6 has-[.slot-wrapper:empty]:px-2.5 has-[.slot-wrapper:empty]:py-2.5 py-2 text-base",
@@ -72,8 +71,7 @@ const BUTTON_NATIVE_TYPES = ["button", "submit", "reset"];
 const LOADER_SIZES = { sm: 24, md: 30, lg: 40 };
 const _sfc_main = /* @__PURE__ */ vue.defineComponent({
   ...{
-    name: "PBtn",
-    inheritAttrs: false
+    name: "PBtn"
   },
   __name: "p-btn",
   props: {
@@ -142,6 +140,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
     }
   },
   setup(__props) {
+    const attrs = vue.useAttrs();
     const props = __props;
     const classes = vue.computed(() => {
       const { button, content, loader, icon } = btn({
@@ -150,27 +149,24 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
       });
       return { button: button(), content: content(), loader: loader(), icon: icon() };
     });
-    const loaderSize = vue.computed(() => {
-      return Number(`${LOADER_SIZES[props.size]}`);
+    const isExternal = vue.computed(() => link.isExternalLink(String(props.to)));
+    const btnAttrs = vue.computed(() => {
+      const res = {
+        target: isExternal.value ? "_blank" : null,
+        to: !isExternal.value && props.to ? props.to : null,
+        type: props.to ? null : props.nativeType,
+        disabled: attrs.disabled || props.loading ? "" : null,
+        "aria-selected": !isExternal.value ? props.selected : false,
+        "aria-disabled": attrs.disabled || props.loading
+      };
+      if (isExternal.value) {
+        res.href = sanitization.sanitizeUrl(String(props.to));
+      }
+      return res;
     });
     return (_ctx, _cache) => {
-      return typeof __props.to === "string" && vue.unref(link.isExternalLink)(__props.to) ? (vue.openBlock(), vue.createElementBlock("a", vue.mergeProps({ key: 0 }, _ctx.$attrs, {
-        href: vue.unref(sanitization.sanitizeUrl)(__props.to),
-        target: "_blank",
-        class: classes.value.button,
-        disabled: !!_ctx.$attrs.disabled ? true : null,
-        "aria-disabled": !!_ctx.$attrs.disabled
-      }), [
-        vue.renderSlot(_ctx.$slots, "default")
-      ], 16, _hoisted_1)) : (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(__props.to ? "RouterLink" : "button"), vue.mergeProps({
-        key: 1,
-        type: __props.to ? null : __props.nativeType,
-        to: __props.to ? __props.to : null,
-        "aria-selected": __props.selected,
+      return vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(isExternal.value ? "a" : __props.to ? "RouterLink" : "button"), vue.mergeProps(btnAttrs.value, {
         class: classes.value.button
-      }, _ctx.$attrs, {
-        disabled: !!_ctx.$attrs.disabled || __props.loading ? true : null,
-        "aria-disabled": _ctx.$attrs.disabled
       }), {
         default: vue.withCtx(() => [
           vue.createElementVNode("div", {
@@ -181,7 +177,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
               icon: __props.icon,
               class: vue.normalizeClass(classes.value.icon)
             }, null, 8, ["icon", "class"])) : vue.createCommentVNode("", true),
-            vue.createElementVNode("span", _hoisted_2, [
+            vue.createElementVNode("span", _hoisted_1, [
               vue.renderSlot(_ctx.$slots, "default")
             ]),
             __props.iconRight ? (vue.openBlock(), vue.createBlock(pIcon_vue_vue_type_script_setup_true_lang._sfc_main, {
@@ -192,12 +188,12 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
           ], 2),
           __props.loading ? (vue.openBlock(), vue.createBlock(pRingLoader_vue_vue_type_script_setup_true_lang._sfc_main, {
             key: 0,
-            size: loaderSize.value,
+            size: LOADER_SIZES[props.size],
             class: vue.normalizeClass(classes.value.loader)
           }, null, 8, ["size", "class"])) : vue.createCommentVNode("", true)
         ]),
         _: 3
-      }, 16, ["type", "to", "aria-selected", "class", "disabled", "aria-disabled"]));
+      }, 16, ["class"]);
     };
   }
 });

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

@@ -69,7 +69,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
               size: _ctx.size,
               type: "secondary-outline-blue",
               disabled: item.disabled,
-              icon: String(item.icon),
+              icon: item.icon ? String(item.icon) : "",
               class: vue.normalizeClass({
                 "rounded-none": index !== 0 && index !== _ctx.items.length - 1 && _ctx.items.length > 1,
                 "rounded-br-none rounded-tr-none": index === 0 && _ctx.items.length > 1,

package/dist/cjs/p-chips.js

@@ -7,8 +7,7 @@ const _sfc_main = vue.defineComponent({
   props: {
     items: {
       type: Array,
-      default: () => [],
-      required: true
+      default: () => []
     },
     itemText: {
       type: String,
@@ -104,5 +103,5 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     ], 512)
   ], 512);
 }
-const pChips = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-c4e84a46"]]);
+const pChips = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-57d9f151"]]);
 module.exports = pChips;

package/dist/cjs/p-icon.js

@@ -34,6 +34,7 @@ const P_ICON_ALIASES = {
   refresh: "ri:loop-left-line",
   download: "tdesign:download",
   upload: "tdesign:upload",
-  info: "streamline:information-circle"
+  info: "streamline:information-circle",
+  search: "streamline:magnifying-glass-solid"
 };
 exports.P_ICON_ALIASES = P_ICON_ALIASES;

package/dist/cjs/p-input-search.js

@@ -1,14 +1,15 @@
 "use strict";
+const vue = require("vue");
 const pBtn_types = require("./chunks/p-btn.types.js");
+const pIcon_vue_vue_type_script_setup_true_lang = require("./chunks/p-icon.js");
 const pInput_vue_vue_type_script_setup_true_lang = require("./chunks/p-input.js");
-const vue = require("vue");
 const _pluginVue_exportHelper = require("./chunks/_plugin-vue_export-helper.js");
-const _sfc_main = vue.defineComponent({
-  name: "PInputSearch",
-  components: {
-    PInput: pInput_vue_vue_type_script_setup_true_lang._sfc_main
+const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+  ...{
+    name: "PInputSearch",
+    inheritAttrs: false
   },
-  inheritAttrs: false,
+  __name: "p-input-search",
   props: {
     modelValue: {
       type: String,
@@ -27,86 +28,96 @@ const _sfc_main = vue.defineComponent({
     }
   },
   emits: ["update:modelValue", "enter"],
-  data() {
-    return {
-      query: this.modelValue,
-      showEnterIconOnFocus: false
+  setup(__props, { emit: __emit }) {
+    const emit = __emit;
+    const props = __props;
+    const searchIconClasses = {
+      sm: "text-xs top-2.5 left-2",
+      md: "text-base top-3 left-3",
+      lg: "text-lg top-4 left-5"
     };
-  },
-  computed: {
-    searchIconClasses() {
-      return `search search-${this.size}`;
-    },
-    enterIconClasses() {
-      return `enter enter-${this.size}`;
-    },
-    clearIconClasses() {
-      return `clear clear-${this.size}`;
-    }
-  },
-  watch: {
-    modelValue(value) {
-      this.query = value;
-    },
-    query(value) {
-      this.$emit("update:modelValue", value);
-    }
-  },
-  methods: {
-    clearSearch() {
-      this.query = "";
+    const clearIconClasses = {
+      sm: "text-base top-1.5 right-2",
+      md: "text-xl top-2 right-2.5",
+      lg: "text-3xl top-[5px] right-2.5"
+    };
+    const enterIconClasses = {
+      sm: "bg-[length:1rem_1rem] w-[1rem] h-[1rem] right-7 top-2",
+      md: "bg-[length:1.5rem_1.5rem] w-[1.5rem] h-[1.5rem] right-9 top-2",
+      lg: "bg-[length:2rem_2rem] w-[2rem] h-[2rem] right-[46px] top-2"
+    };
+    const showEnterIconOnFocus = vue.ref(false);
+    const searchInput = vue.useTemplateRef("searchInput");
+    const query = vue.ref(props.modelValue);
+    vue.watch(
+      () => props.modelValue,
+      (nV) => {
+        query.value = nV;
+      }
+    );
+    vue.watch(query, (nV) => {
+      emit("update:modelValue", nV);
+    });
+    const clearSearch = () => {
+      query.value = "";
       requestAnimationFrame(() => {
         var _a;
-        (_a = this.$refs.searchInput) == null ? void 0 : _a.$el.querySelector("input").focus();
+        (_a = searchInput.value) == null ? void 0 : _a.$el.querySelector("input").focus();
       });
-    },
-    keydownEnter() {
-      this.$emit("enter", this.query);
-    }
+    };
+    const keydownEnter = () => {
+      emit("enter", query.value);
+    };
+    return (_ctx, _cache) => {
+      const _directive_tooltip = vue.resolveDirective("tooltip");
+      return vue.openBlock(), vue.createBlock(pInput_vue_vue_type_script_setup_true_lang._sfc_main, vue.mergeProps({
+        ref_key: "searchInput",
+        ref: searchInput,
+        modelValue: query.value,
+        "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => query.value = $event),
+        size: __props.size
+      }, _ctx.$attrs, {
+        role: "searchbox",
+        rounded: "",
+        onFocus: _cache[1] || (_cache[1] = ($event) => showEnterIconOnFocus.value = true),
+        onFocusout: _cache[2] || (_cache[2] = ($event) => showEnterIconOnFocus.value = false),
+        onKeydown: vue.withKeys(keydownEnter, ["enter"])
+      }), {
+        prefix: vue.withCtx(() => [
+          vue.createVNode(pIcon_vue_vue_type_script_setup_true_lang._sfc_main, {
+            icon: "search",
+            class: vue.normalizeClass(["absolute text-p-gray-40", searchIconClasses[__props.size]])
+          }, null, 8, ["class"])
+        ]),
+        suffix: vue.withCtx(() => [
+          query.value && __props.showEnterIcon && showEnterIconOnFocus.value ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("i", {
+            key: 0,
+            class: vue.normalizeClass(["enter absolute bg-no-repeat outline-none", enterIconClasses[__props.size]])
+          }, null, 2)), [
+            [
+              _directive_tooltip,
+              { content: "Press enter to search", delay: { show: 100, hide: 0 } },
+              void 0,
+              { bottom: true }
+            ]
+          ]) : vue.createCommentVNode("", true),
+          query.value ? (vue.openBlock(), vue.createElementBlock("button", {
+            key: 1,
+            role: "button",
+            "aria-label": "Clear search input",
+            class: vue.normalizeClass(["absolute cursor-pointer", clearIconClasses[__props.size]]),
+            onClick: clearSearch
+          }, [
+            vue.createVNode(pIcon_vue_vue_type_script_setup_true_lang._sfc_main, {
+              icon: "cancel-circle",
+              class: "text-p-gray-40 hover:text-p-gray-50"
+            })
+          ], 2)) : vue.createCommentVNode("", true)
+        ]),
+        _: 1
+      }, 16, ["modelValue", "size"]);
+    };
   }
 });
-function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_PInput = vue.resolveComponent("PInput");
-  const _directive_tooltip = vue.resolveDirective("tooltip");
-  return vue.openBlock(), vue.createBlock(_component_PInput, vue.mergeProps({
-    ref: "searchInput",
-    modelValue: _ctx.query,
-    "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => _ctx.query = $event),
-    size: _ctx.size
-  }, _ctx.$attrs, {
-    role: "searchbox",
-    rounded: "",
-    onFocus: _cache[2] || (_cache[2] = ($event) => _ctx.showEnterIconOnFocus = true),
-    onFocusout: _cache[3] || (_cache[3] = ($event) => _ctx.showEnterIconOnFocus = false),
-    onKeydown: vue.withKeys(_ctx.keydownEnter, ["enter"])
-  }), {
-    prefix: vue.withCtx(() => [
-      vue.createElementVNode("i", {
-        class: vue.normalizeClass(["icon absolute bg-no-repeat outline-none", _ctx.searchIconClasses])
-      }, null, 2)
-    ]),
-    suffix: vue.withCtx(() => [
-      _ctx.query && _ctx.showEnterIcon && _ctx.showEnterIconOnFocus ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("i", {
-        key: 0,
-        class: vue.normalizeClass(["icon absolute bg-no-repeat outline-none", _ctx.enterIconClasses])
-      }, null, 2)), [
-        [
-          _directive_tooltip,
-          { content: "Press enter to search", delay: { show: 100, hide: 0 } },
-          void 0,
-          { bottom: true }
-        ]
-      ]) : vue.createCommentVNode("", true),
-      _ctx.query ? (vue.openBlock(), vue.createElementBlock("button", {
-        key: 1,
-        role: "button",
-        "aria-label": "Clear search input",
-        class: vue.normalizeClass(["icon absolute cursor-pointer bg-no-repeat", _ctx.clearIconClasses]),
-        onClick: _cache[0] || (_cache[0] = (...args) => _ctx.clearSearch && _ctx.clearSearch(...args))
-      }, null, 2)) : vue.createCommentVNode("", true)
-    ]),
-    _: 1
-  }, 16, ["modelValue", "size", "onKeydown"]);
-}
-const PInputSearch = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-78b7a6f8"]]);
+const PInputSearch = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main, [["__scopeId", "data-v-ebc375ff"]]);
 module.exports = PInputSearch;

package/dist/es/chunks/p-btn.js

@@ -1,12 +1,11 @@
-import { defineComponent, computed, createElementBlock, createBlock, unref, openBlock, mergeProps, renderSlot, resolveDynamicComponent, withCtx, createElementVNode, createCommentVNode, normalizeClass } from "vue";
+import { defineComponent, useAttrs, computed, createBlock, openBlock, resolveDynamicComponent, mergeProps, withCtx, createElementVNode, createCommentVNode, normalizeClass, renderSlot } from "vue";
 import { S as SIZES } from "./p-btn.types.js";
 import { _ as _sfc_main$1 } from "./p-icon.js";
 import { _ as _sfc_main$2 } from "./p-ring-loader.js";
 import { isExternalLink } from "../link.js";
 import { sanitizeUrl } from "../sanitization.js";
 import { c as ce } from "./index.js";
-const _hoisted_1 = ["href", "disabled", "aria-disabled"];
-const _hoisted_2 = { class: "slot-wrapper empty:hidden" };
+const _hoisted_1 = { class: "slot-wrapper empty:hidden" };
 const btnClasses = {
   slots: {
     button: "relative inline-block whitespace-nowrap rounded font-medium outline-none disabled:pointer-events-none disabled:cursor-default disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:cursor-default aria-disabled:opacity-50",
@@ -46,7 +45,7 @@ const btnClasses = {
       sm: {
         button: "px-3 has-[.slot-wrapper:empty]:px-1.5 py-1.5 text-sm leading-5",
         content: "gap-1",
-        icon: "text-[20px]"
+        icon: "text-base p-0.5"
       },
       md: {
         button: "px-6 has-[.slot-wrapper:empty]:px-2.5 has-[.slot-wrapper:empty]:py-2.5 py-2 text-base",
@@ -71,8 +70,7 @@ const BUTTON_NATIVE_TYPES = ["button", "submit", "reset"];
 const LOADER_SIZES = { sm: 24, md: 30, lg: 40 };
 const _sfc_main = /* @__PURE__ */ defineComponent({
   ...{
-    name: "PBtn",
-    inheritAttrs: false
+    name: "PBtn"
   },
   __name: "p-btn",
   props: {
@@ -141,6 +139,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     }
   },
   setup(__props) {
+    const attrs = useAttrs();
     const props = __props;
     const classes = computed(() => {
       const { button, content, loader, icon } = btn({
@@ -149,27 +148,24 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       });
       return { button: button(), content: content(), loader: loader(), icon: icon() };
     });
-    const loaderSize = computed(() => {
-      return Number(`${LOADER_SIZES[props.size]}`);
+    const isExternal = computed(() => isExternalLink(String(props.to)));
+    const btnAttrs = computed(() => {
+      const res = {
+        target: isExternal.value ? "_blank" : null,
+        to: !isExternal.value && props.to ? props.to : null,
+        type: props.to ? null : props.nativeType,
+        disabled: attrs.disabled || props.loading ? "" : null,
+        "aria-selected": !isExternal.value ? props.selected : false,
+        "aria-disabled": attrs.disabled || props.loading
+      };
+      if (isExternal.value) {
+        res.href = sanitizeUrl(String(props.to));
+      }
+      return res;
     });
     return (_ctx, _cache) => {
-      return typeof __props.to === "string" && unref(isExternalLink)(__props.to) ? (openBlock(), createElementBlock("a", mergeProps({ key: 0 }, _ctx.$attrs, {
-        href: unref(sanitizeUrl)(__props.to),
-        target: "_blank",
-        class: classes.value.button,
-        disabled: !!_ctx.$attrs.disabled ? true : null,
-        "aria-disabled": !!_ctx.$attrs.disabled
-      }), [
-        renderSlot(_ctx.$slots, "default")
-      ], 16, _hoisted_1)) : (openBlock(), createBlock(resolveDynamicComponent(__props.to ? "RouterLink" : "button"), mergeProps({
-        key: 1,
-        type: __props.to ? null : __props.nativeType,
-        to: __props.to ? __props.to : null,
-        "aria-selected": __props.selected,
+      return openBlock(), createBlock(resolveDynamicComponent(isExternal.value ? "a" : __props.to ? "RouterLink" : "button"), mergeProps(btnAttrs.value, {
         class: classes.value.button
-      }, _ctx.$attrs, {
-        disabled: !!_ctx.$attrs.disabled || __props.loading ? true : null,
-        "aria-disabled": _ctx.$attrs.disabled
       }), {
         default: withCtx(() => [
           createElementVNode("div", {
@@ -180,7 +176,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               icon: __props.icon,
               class: normalizeClass(classes.value.icon)
             }, null, 8, ["icon", "class"])) : createCommentVNode("", true),
-            createElementVNode("span", _hoisted_2, [
+            createElementVNode("span", _hoisted_1, [
               renderSlot(_ctx.$slots, "default")
             ]),
             __props.iconRight ? (openBlock(), createBlock(_sfc_main$1, {
@@ -191,12 +187,12 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           ], 2),
           __props.loading ? (openBlock(), createBlock(_sfc_main$2, {
             key: 0,
-            size: loaderSize.value,
+            size: LOADER_SIZES[props.size],
             class: normalizeClass(classes.value.loader)
           }, null, 8, ["size", "class"])) : createCommentVNode("", true)
         ]),
         _: 3
-      }, 16, ["type", "to", "aria-selected", "class", "disabled", "aria-disabled"]));
+      }, 16, ["class"]);
     };
   }
 });

package/dist/es/chunks/p-select-btn.js

@@ -68,7 +68,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               size: _ctx.size,
               type: "secondary-outline-blue",
               disabled: item.disabled,
-              icon: String(item.icon),
+              icon: item.icon ? String(item.icon) : "",
               class: normalizeClass({
                 "rounded-none": index !== 0 && index !== _ctx.items.length - 1 && _ctx.items.length > 1,
                 "rounded-br-none rounded-tr-none": index === 0 && _ctx.items.length > 1,

package/dist/es/p-chips.js

@@ -6,8 +6,7 @@ const _sfc_main = defineComponent({
   props: {
     items: {
       type: Array,
-      default: () => [],
-      required: true
+      default: () => []
     },
     itemText: {
       type: String,
@@ -103,7 +102,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     ], 512)
   ], 512);
 }
-const pChips = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-c4e84a46"]]);
+const pChips = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-57d9f151"]]);
 export {
   pChips as default
 };

package/dist/es/p-icon.js

@@ -32,7 +32,8 @@ const P_ICON_ALIASES = {
   refresh: "ri:loop-left-line",
   download: "tdesign:download",
   upload: "tdesign:upload",
-  info: "streamline:information-circle"
+  info: "streamline:information-circle",
+  search: "streamline:magnifying-glass-solid"
 };
 export {
   P_ICON_ALIASES