@pequity/squirrel 5.2.2 → 5.3.0

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

@@ -55,7 +55,8 @@ const _sfc_main = defineComponent({
     clearSearch() {
       this.query = "";
       requestAnimationFrame(() => {
-        this.$refs.searchInput.$el.querySelector("input").focus();
+        var _a;
+        (_a = this.$refs.searchInput) == null ? void 0 : _a.$el.querySelector("input").focus();
       });
     },
     keydownEnter() {
@@ -106,7 +107,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     _: 1
   }, 16, ["modelValue", "size", "onKeydown"]);
 }
-const PInputSearch = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-7a1e1e82"]]);
+const PInputSearch = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-60b13ffe"]]);
 export {
   PInputSearch as default
 };

package/dist/es/p-loading.js

@@ -1,4 +1,5 @@
 import { defineComponent, ref, watch, toValue, onBeforeUnmount, openBlock, createBlock, Teleport, createVNode, Transition, withCtx, unref, createElementBlock, createElementVNode, normalizeStyle, resolveDynamicComponent, normalizeProps, mergeProps, normalizeClass, toDisplayString, createCommentVNode } from "vue";
+import { i as isComponent } from "./chunks/component.js";
 import { usePLoading } from "./usePLoading.js";
 import { _ as _export_sfc } from "./chunks/_plugin-vue_export-helper.js";
 const _hoisted_1 = {
@@ -32,10 +33,6 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       },
       { flush: "post" }
     );
-    const isComponent = (content2) => {
-      const isComponent2 = typeof content2 === "object" && content2 !== null;
-      return isComponent2;
-    };
     onBeforeUnmount(() => {
       loadingHide();
     });
@@ -57,7 +54,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                   "enter-active-class": "transition duration-500"
                 }, {
                   default: withCtx(() => [
-                    isComponent(unref(content)) ? (openBlock(), createBlock(resolveDynamicComponent(unref(content)), normalizeProps(mergeProps({ key: 0 }, unref(componentProps))), null, 16)) : (openBlock(), createElementBlock("div", {
+                    unref(isComponent)(unref(content)) ? (openBlock(), createBlock(resolveDynamicComponent(unref(content)), normalizeProps(mergeProps({ key: 0 }, unref(componentProps))), null, 16)) : (openBlock(), createElementBlock("div", {
                       key: 1,
                       class: normalizeClass(textDivClass)
                     }, toDisplayString(unref(content)), 1))
@@ -74,7 +71,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             ref_key: "dimsReference",
             ref: dimsReference
           }, [
-            isComponent(unref(content)) ? (openBlock(), createBlock(resolveDynamicComponent(unref(content)), normalizeProps(mergeProps({ key: 0 }, unref(componentProps))), null, 16)) : (openBlock(), createElementBlock("div", {
+            unref(isComponent)(unref(content)) ? (openBlock(), createBlock(resolveDynamicComponent(unref(content)), normalizeProps(mergeProps({ key: 0 }, unref(componentProps))), null, 16)) : (openBlock(), createElementBlock("div", {
               key: 1,
               class: normalizeClass(textDivClass)
             }, toDisplayString(unref(content)), 1))
@@ -84,7 +81,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const pLoading = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-f0f6bdd4"]]);
+const pLoading = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-980d32e1"]]);
 export {
   pLoading as default
 };

package/dist/es/p-modal.js

@@ -110,7 +110,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   ],
   setup(__props, { emit: __emit }) {
     useCssVars((_ctx) => ({
-      "4d751ed2": __props.maxWidth
+      "4046568f": __props.maxWidth
     }));
     let animatingZIndex = 0;
     const emit = __emit;
@@ -194,6 +194,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       }, 0);
     };
     const handleFocus = (wrapper) => {
+      if (!wrapper) {
+        return;
+      }
       const autofocus = wrapper.querySelector("[autofocus]");
       if (autofocus) {
         autofocus.focus();
@@ -364,7 +367,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const pModal = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-fb5dbd9f"]]);
+const pModal = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-7e6a0b8d"]]);
 export {
   pModal as default
 };

package/dist/es/string.js

@@ -1,12 +1,32 @@
-const toString = (value) => {
-  if (typeof value === "number" && (!isFinite(value) || isNaN(value))) {
-    return "";
-  }
-  if (typeof value !== "string" && typeof value !== "number") {
-    return "";
-  }
-  return String(value);
-};
-export {
-  toString
-};
+import { t as toString, i as isString } from "./chunks/string.js";
+describe("toString", () => {
+  it.each(["", /* @__PURE__ */ new Date(), NaN, Infinity, {}, [], true, false, null, void 0])(
+    "returns an empty string if input is %s",
+    (val) => {
+      expect(toString(val)).toBe("");
+    }
+  );
+  it("returns a string when the value is a string", () => {
+    expect(toString("test")).toBe("test");
+  });
+  it("converts the value to a string when the value is a number", () => {
+    expect(toString(290349822e-2)).toBe("2903498.22");
+  });
+});
+describe("isString", () => {
+  it("should return true for a string", () => {
+    expect(isString("hello")).toBe(true);
+  });
+  it.each([
+    [123, false],
+    [{}, false],
+    [[], false],
+    [null, false],
+    [void 0, false],
+    [true, false],
+    [() => {
+    }, false]
+  ])("should return %s for %p", (input, expected) => {
+    expect(isString(input)).toBe(expected);
+  });
+});

package/dist/es/useSelectList.js

@@ -2,7 +2,7 @@ import { ref, computed, watch, onUnmounted, nextTick } from "vue";
 import { setupListKeyboardNavigation } from "./listKeyboardNavigation.js";
 import { cloneDeep, uniqBy } from "lodash-es";
 import { isObject } from "./object.js";
-import { toString } from "./string.js";
+import { t as toString } from "./chunks/string.js";
 import { useVirtualizer } from "@tanstack/vue-virtual";
 const createInternalItems = (items) => {
   let arr = Array.isArray(items) ? items.slice() : [];

package/dist/squirrel/components/p-action-bar/p-action-bar.types.d.ts

@@ -1,10 +1,11 @@
+import { type Component } from 'vue';
 export type PActionBarAction = {
     name?: string;
     label: string;
-    icon?: string;
+    icon?: string | Component;
     subActions?: {
         name: string;
         label: string;
-        icon?: string;
+        icon?: string | Component;
     }[];
 };

package/dist/squirrel/utils/component.d.ts

@@ -0,0 +1,2 @@
+import { type Component } from 'vue';
+export declare const isComponent: (val: unknown) => val is Component;

package/dist/squirrel/utils/component.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/squirrel/utils/string.d.ts

@@ -1 +1,2 @@
+export declare const isString: (val: unknown) => val is string;
 export declare const toString: (value: unknown) => string;

package/dist/squirrel/utils/string.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/style.css

@@ -145,77 +145,77 @@ div[id^=popper_].dropdown .v-popper__inner .dropdown-menu .dropdown-divider {
     border-color: var(--color-p-gray-30);
 
     opacity: 1
-}.icon.clear[data-v-7a1e1e82] {
+}.icon.clear[data-v-60b13ffe] {
   background-image: url("data:image/svg+xml,%3csvg%20width='16'%20height='16'%20viewBox='0%200%2016%2016'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cg%20clip-path='url(%23clip0_1634_880)'%3e%3cpath%20d='M16%208C16%206.41775%2015.5308%204.87104%2014.6518%203.55544C13.7727%202.23985%2012.5233%201.21447%2011.0615%200.608967C9.59966%200.00346629%207.99113%20-0.15496%206.43928%200.153721C4.88743%200.462403%203.46197%201.22433%202.34315%202.34315C1.22433%203.46197%200.462403%204.88743%200.153721%206.43928C-0.15496%207.99113%200.00346629%209.59966%200.608967%2011.0615C1.21447%2012.5233%202.23985%2013.7727%203.55544%2014.6518C4.87104%2015.5308%206.41775%2016%208%2016C10.1217%2016%2012.1566%2015.1571%2013.6569%2013.6569C15.1571%2012.1566%2016%2010.1217%2016%208ZM11.14%2010.1867C11.2642%2010.3116%2011.3339%2010.4805%2011.3339%2010.6567C11.3339%2010.8328%2011.2642%2011.0018%2011.14%2011.1267C11.078%2011.1892%2011.0043%2011.2388%2010.9231%2011.2726C10.8418%2011.3064%2010.7547%2011.3239%2010.6667%2011.3239C10.5787%2011.3239%2010.4915%2011.3064%2010.4103%2011.2726C10.329%2011.2388%2010.2553%2011.1892%2010.1933%2011.1267L8.12%209.05334C8.08809%209.02429%208.04649%209.0082%208.00334%209.0082C7.96019%209.0082%207.91858%209.02429%207.88667%209.05334L5.81334%2011.1267C5.6858%2011.2359%205.52175%2011.293%205.35397%2011.2865C5.18618%2011.28%205.02702%2011.2104%204.90829%2011.0917C4.78957%2010.973%204.72001%2010.8138%204.71353%2010.646C4.70705%2010.4783%204.76412%2010.3142%204.87334%2010.1867L6.94667%208.11334C6.97572%208.08142%206.99181%208.03982%206.99181%207.99667C6.99181%207.95352%206.97572%207.91192%206.94667%207.88L4.87334%205.80667C4.81085%205.7447%204.76126%205.67096%204.72741%205.58972C4.69356%205.50848%204.67614%205.42135%204.67614%205.33334C4.67614%205.24533%204.69356%205.15819%204.72741%205.07695C4.76126%204.99571%204.81085%204.92198%204.87334%204.86C4.99825%204.73584%205.16721%204.66614%205.34334%204.66614C5.51946%204.66614%205.68843%204.73584%205.81334%204.86L7.88667%206.93334C7.90163%206.94928%207.91971%206.96199%207.93977%206.97068C7.95984%206.97936%207.98147%206.98384%208.00334%206.98384C8.0252%206.98384%208.04684%206.97936%208.0669%206.97068C8.08697%206.96199%208.10504%206.94928%208.12%206.93334L10.1933%204.86C10.2555%204.79784%2010.3293%204.74854%2010.4105%204.7149C10.4917%204.68126%2010.5788%204.66394%2010.6667%204.66394C10.7546%204.66394%2010.8416%204.68126%2010.9228%204.7149C11.0041%204.74854%2011.0778%204.79784%2011.14%204.86C11.2022%204.92216%2011.2515%204.99596%2011.2851%205.07717C11.3188%205.15839%2011.3361%205.24543%2011.3361%205.33334C11.3361%205.42124%2011.3188%205.50829%2011.2851%205.5895C11.2515%205.67072%2011.2022%205.74451%2011.14%205.80667L9.06667%207.88C9.05073%207.89497%209.03802%207.91304%209.02933%207.93311C9.02065%207.95317%209.01616%207.97481%209.01616%207.99667C9.01616%208.01854%209.02065%208.04017%209.02933%208.06024C9.03802%208.0803%209.05073%208.09837%209.06667%208.11334L11.14%2010.1867Z'%20fill='%23A0AEC0'/%3e%3c/g%3e%3cdefs%3e%3cclipPath%20id='clip0_1634_880'%3e%3crect%20width='16'%20height='16'%20fill='white'/%3e%3c/clipPath%3e%3c/defs%3e%3c/svg%3e");
   background-position: center center;
   transition: background-image 0.4s;
 }
-.icon.clear-sm[data-v-7a1e1e82] {
+.icon.clear-sm[data-v-60b13ffe] {
   background-size: 0.875rem 0.875rem;
   width: 0.875rem;
   height: 0.875rem;
   bottom: 0.5rem;
   right: 0.375rem;
 }
-.icon.clear-md[data-v-7a1e1e82] {
+.icon.clear-md[data-v-60b13ffe] {
   background-size: 1rem 1rem;
   height: 1rem;
   width: 1rem;
   bottom: 0.75rem;
   right: 0.5rem;
 }
-.icon.clear-lg[data-v-7a1e1e82] {
+.icon.clear-lg[data-v-60b13ffe] {
   background-size: 1rem 1rem;
   height: 1rem;
   width: 1rem;
   bottom: 1rem;
   right: 0.5rem;
 }
-.icon.clear[data-v-7a1e1e82]:hover {
+.icon.clear[data-v-60b13ffe]:hover {
   background-image: url("data:image/svg+xml,%3csvg%20width='16'%20height='16'%20viewBox='0%200%2016%2016'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cg%20clip-path='url(%23clip0_1634_896)'%3e%3cpath%20d='M16%208C16%206.41775%2015.5308%204.87104%2014.6518%203.55544C13.7727%202.23985%2012.5233%201.21447%2011.0615%200.608967C9.59966%200.00346629%207.99113%20-0.15496%206.43928%200.153721C4.88743%200.462403%203.46197%201.22433%202.34315%202.34315C1.22433%203.46197%200.462403%204.88743%200.153721%206.43928C-0.15496%207.99113%200.00346629%209.59966%200.608967%2011.0615C1.21447%2012.5233%202.23985%2013.7727%203.55544%2014.6518C4.87104%2015.5308%206.41775%2016%208%2016C10.1217%2016%2012.1566%2015.1571%2013.6569%2013.6569C15.1571%2012.1566%2016%2010.1217%2016%208ZM11.14%2010.1867C11.2642%2010.3116%2011.3339%2010.4805%2011.3339%2010.6567C11.3339%2010.8328%2011.2642%2011.0018%2011.14%2011.1267C11.078%2011.1892%2011.0043%2011.2388%2010.9231%2011.2726C10.8418%2011.3064%2010.7547%2011.3239%2010.6667%2011.3239C10.5787%2011.3239%2010.4915%2011.3064%2010.4103%2011.2726C10.329%2011.2388%2010.2553%2011.1892%2010.1933%2011.1267L8.12%209.05334C8.08809%209.02429%208.04649%209.0082%208.00334%209.0082C7.96019%209.0082%207.91858%209.02429%207.88667%209.05334L5.81334%2011.1267C5.6858%2011.2359%205.52175%2011.293%205.35397%2011.2865C5.18618%2011.28%205.02702%2011.2104%204.90829%2011.0917C4.78957%2010.973%204.72001%2010.8138%204.71353%2010.646C4.70705%2010.4783%204.76412%2010.3142%204.87334%2010.1867L6.94667%208.11334C6.97572%208.08142%206.99181%208.03982%206.99181%207.99667C6.99181%207.95352%206.97572%207.91192%206.94667%207.88L4.87334%205.80667C4.81085%205.7447%204.76126%205.67096%204.72741%205.58972C4.69356%205.50848%204.67614%205.42135%204.67614%205.33334C4.67614%205.24533%204.69356%205.15819%204.72741%205.07695C4.76126%204.99571%204.81085%204.92198%204.87334%204.86C4.99825%204.73584%205.16721%204.66614%205.34334%204.66614C5.51946%204.66614%205.68843%204.73584%205.81334%204.86L7.88667%206.93334C7.90163%206.94928%207.91971%206.96199%207.93977%206.97068C7.95984%206.97936%207.98147%206.98384%208.00334%206.98384C8.0252%206.98384%208.04684%206.97936%208.0669%206.97068C8.08697%206.96199%208.10504%206.94928%208.12%206.93334L10.1933%204.86C10.2555%204.79784%2010.3293%204.74854%2010.4105%204.7149C10.4917%204.68126%2010.5788%204.66394%2010.6667%204.66394C10.7546%204.66394%2010.8416%204.68126%2010.9228%204.7149C11.0041%204.74854%2011.0778%204.79784%2011.14%204.86C11.2022%204.92216%2011.2515%204.99596%2011.2851%205.07717C11.3188%205.15839%2011.3361%205.24543%2011.3361%205.33334C11.3361%205.42124%2011.3188%205.50829%2011.2851%205.5895C11.2515%205.67072%2011.2022%205.74451%2011.14%205.80667L9.06667%207.88C9.05073%207.89497%209.03802%207.91304%209.02933%207.93311C9.02065%207.95317%209.01616%207.97481%209.01616%207.99667C9.01616%208.01854%209.02065%208.04017%209.02933%208.06024C9.03802%208.0803%209.05073%208.09837%209.06667%208.11334L11.14%2010.1867Z'%20fill='%23424E6E'/%3e%3c/g%3e%3cdefs%3e%3cclipPath%20id='clip0_1634_896'%3e%3crect%20width='16'%20height='16'%20fill='white'/%3e%3c/clipPath%3e%3c/defs%3e%3c/svg%3e");
 }
-.icon.search[data-v-7a1e1e82] {
+.icon.search[data-v-60b13ffe] {
   background-image: url("data:image/svg+xml,%3csvg%20width='12'%20height='12'%20viewBox='0%200%2012%2012'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cg%20clip-path='url(%23clip0_9127_330342)'%3e%3cpath%20d='M11.705%2010.295L9.38501%208.00004C10.0193%207.0497%2010.3178%205.91467%2010.2331%204.77526C10.1484%203.63584%209.68546%202.5574%208.91771%201.71124C8.14996%200.86508%207.12147%200.299735%205.99563%200.105014C4.8698%20-0.0897079%203.71117%200.0973621%202.70383%200.636506C1.69648%201.17565%200.898177%202.03595%200.435738%203.08073C-0.0267015%204.12552%20-0.126757%205.29487%200.151467%206.40303C0.429691%207.51119%201.07024%208.4946%201.97135%209.19704C2.87246%209.89948%203.98246%2010.2807%205.12501%2010.28C6.13901%2010.2811%207.13002%209.97801%207.97001%209.41004L10.295%2011.735C10.4824%2011.9213%2010.7358%2012.0258%2011%2012.0258C11.2642%2012.0258%2011.5176%2011.9213%2011.705%2011.735C11.8018%2011.6418%2011.8788%2011.5299%2011.9314%2011.4062C11.9839%2011.2825%2012.011%2011.1495%2012.011%2011.015C12.011%2010.8806%2011.9839%2010.7476%2011.9314%2010.6239C11.8788%2010.5002%2011.8018%2010.3883%2011.705%2010.295ZM5.12501%201.50004C5.84176%201.50004%206.54241%201.71251%207.13843%202.11061C7.73445%202.50871%208.19908%203.07456%208.47359%203.73666C8.74811%204.39875%208.82019%205.12736%208.68072%205.8304C8.54125%206.53345%208.1965%207.17937%207.69004%207.68653C7.18357%208.19369%206.53813%208.53934%205.83527%208.67977C5.13242%208.82021%204.40371%208.74913%203.74125%208.47553C3.07878%208.20193%202.51228%207.73808%202.11336%207.14261C1.71444%206.54714%201.501%205.84678%201.50001%205.13004C1.50001%204.16817%201.88177%203.24562%202.56145%202.565C3.24112%201.88439%204.16314%201.50136%205.12501%201.50004Z'%20fill='%23718096'/%3e%3c/g%3e%3cdefs%3e%3cclipPath%20id='clip0_9127_330342'%3e%3crect%20width='12'%20height='12'%20fill='white'/%3e%3c/clipPath%3e%3c/defs%3e%3c/svg%3e");
 }
-.icon.search-sm[data-v-7a1e1e82] {
+.icon.search-sm[data-v-60b13ffe] {
   background-size: 0.75rem 0.75rem;
   left: 0.5rem;
   bottom: 0.625rem;
   width: 0.75rem;
   height: 0.75rem;
 }
-.icon.search-md[data-v-7a1e1e82] {
+.icon.search-md[data-v-60b13ffe] {
   background-size: 1rem 1rem;
   width: 1rem;
   height: 1rem;
   left: 0.75rem;
   bottom: 0.75rem;
 }
-.icon.search-lg[data-v-7a1e1e82] {
+.icon.search-lg[data-v-60b13ffe] {
   background-size: 1rem 1rem;
   width: 1rem;
   height: 1rem;
   left: 1.125rem;
   bottom: 1rem;
 }
-.icon.enter[data-v-7a1e1e82] {
+.icon.enter[data-v-60b13ffe] {
   background-image: url("data:image/svg+xml,%3csvg%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cg%20clip-path='url(%23clip0_1627_786)'%3e%3crect%20width='24'%20height='24'%20rx='5'%20fill='%23ECF1FF'/%3e%3cpath%20d='M19.17%201.03744e-05H4.83C4.19619%20-0.00130459%203.56834%200.122398%202.98239%200.364037C2.39645%200.605676%201.86392%200.960506%201.41528%201.40822C0.966641%201.85592%200.610708%202.38772%200.367855%202.97316C0.125002%203.55861%20-1.36406e-06%204.1862%200%204.82001L0%2019.17C0%2020.451%200.508874%2021.6795%201.41467%2022.5853C2.32048%2023.4911%203.549%2024%204.83%2024H19.17C20.4502%2023.9974%2021.6772%2023.4876%2022.5824%2022.5824C23.4876%2021.6772%2023.9974%2020.4502%2024%2019.17V4.82001C23.9974%203.54075%2023.4873%202.31479%2022.5818%201.41115C21.6763%200.507508%2020.4493%207.63258e-06%2019.17%201.03744e-05ZM22%2019.17C22%2019.9206%2021.7018%2020.6404%2021.1711%2021.1711C20.6404%2021.7018%2019.9206%2022%2019.17%2022H4.83C4.07944%2022%203.35962%2021.7018%202.82889%2021.1711C2.29816%2020.6404%202%2019.9206%202%2019.17V4.82001C2.00265%204.07118%202.30197%203.35393%202.83242%202.82536C3.36286%202.29679%204.08117%202.00001%204.83%202.00001H19.17C19.9188%202.00001%2020.6371%202.29679%2021.1676%202.82536C21.698%203.35393%2021.9974%204.07118%2022%204.82001V19.17Z'%20fill='%234750EB'/%3e%3cpath%20d='M17.5%207.5C17.2348%207.5%2016.9804%207.60536%2016.7929%207.79289C16.6054%207.98043%2016.5%208.23478%2016.5%208.5V11.25C16.5%2011.3163%2016.4737%2011.3799%2016.4268%2011.4268C16.3799%2011.4737%2016.3163%2011.5%2016.25%2011.5H10.75C10.6837%2011.5%2010.6201%2011.4737%2010.5732%2011.4268C10.5263%2011.3799%2010.5%2011.3163%2010.5%2011.25V9.5C10.5012%209.30138%2010.4431%209.10691%2010.3333%208.94139C10.2235%208.77587%2010.0669%208.6468%209.88348%208.57063C9.70004%208.49446%209.49807%208.47465%209.30332%208.51372C9.10857%208.55279%208.92987%208.64897%208.79%208.79L5.79%2011.79C5.60375%2011.9774%205.49921%2012.2308%205.49921%2012.495C5.49921%2012.7592%205.60375%2013.0126%205.79%2013.2L8.79%2016.2C8.88261%2016.2945%208.99306%2016.3697%209.11493%2016.4212C9.23681%2016.4727%209.36769%2016.4995%209.5%2016.5C9.76522%2016.5%2010.0196%2016.3946%2010.2071%2016.2071C10.3946%2016.0196%2010.5%2015.7652%2010.5%2015.5V13.75C10.5%2013.6837%2010.5263%2013.6201%2010.5732%2013.5732C10.6201%2013.5263%2010.6837%2013.5%2010.75%2013.5H16.5C17.0304%2013.5%2017.5391%2013.2893%2017.9142%2012.9142C18.2893%2012.5391%2018.5%2012.0304%2018.5%2011.5V8.5C18.5%208.23478%2018.3946%207.98043%2018.2071%207.79289C18.0196%207.60536%2017.7652%207.5%2017.5%207.5Z'%20fill='%234750EB'/%3e%3c/g%3e%3cdefs%3e%3cclipPath%20id='clip0_1627_786'%3e%3crect%20width='24'%20height='24'%20rx='5'%20fill='white'/%3e%3c/clipPath%3e%3c/defs%3e%3c/svg%3e");
 }
-.icon.enter-sm[data-v-7a1e1e82] {
+.icon.enter-sm[data-v-60b13ffe] {
   background-size: 1rem 1rem;
   width: 1rem;
   height: 1rem;
   right: 1.5rem;
   bottom: 0.5rem;
 }
-.icon.enter-md[data-v-7a1e1e82] {
+.icon.enter-md[data-v-60b13ffe] {
   background-size: 1.5rem 1.5rem;
   width: 1.5rem;
   height: 1.5rem;
   right: 2.0625rem;
   bottom: 0.5rem;
 }
-.icon.enter-lg[data-v-7a1e1e82] {
+.icon.enter-lg[data-v-60b13ffe] {
   background-size: 1.5rem 1.5rem;
   width: 1.5rem;
   height: 1.5rem;
@@ -381,12 +381,12 @@ from {
 to {
     opacity: 0;
 }
-}.fadeInDown[data-v-f0f6bdd4] {
+}.fadeInDown[data-v-980d32e1] {
   animation-duration: 0.4s;
   animation-fill-mode: both;
-  animation-name: fadeInDown-f0f6bdd4;
+  animation-name: fadeInDown-980d32e1;
 }
-@keyframes fadeInDown-f0f6bdd4 {
+@keyframes fadeInDown-980d32e1 {
 0% {
     opacity: 0;
     transform: translate3d(0, -100%, 0);
@@ -396,12 +396,12 @@ to {
     transform: none;
 }
 }
-.fadeOutUp[data-v-f0f6bdd4] {
+.fadeOutUp[data-v-980d32e1] {
   animation-duration: 0.25s;
   animation-fill-mode: both;
-  animation-name: fadeOutUp-f0f6bdd4;
+  animation-name: fadeOutUp-980d32e1;
 }
-@keyframes fadeOutUp-f0f6bdd4 {
+@keyframes fadeOutUp-980d32e1 {
 0% {
     opacity: 1;
 }
@@ -409,33 +409,33 @@ to {
     opacity: 0;
     transform: translate3d(0, -100%, 0);
 }
-}.pm[data-v-fb5dbd9f] {
+}.pm[data-v-7e6a0b8d] {
   width: calc(100% - 32px);
   min-width: 110px;
-  max-width: var(--4d751ed2);
+  max-width: var(--4046568f);
   max-height: calc(100vh - 32px);
 }
-.fadeIn[data-v-fb5dbd9f] {
+.fadeIn[data-v-7e6a0b8d] {
   animation-duration: 0.4s;
-  animation-name: fadeInFrames-fb5dbd9f;
+  animation-name: fadeInFrames-7e6a0b8d;
   animation-fill-mode: both;
 }
-.fadeOut[data-v-fb5dbd9f] {
+.fadeOut[data-v-7e6a0b8d] {
   animation-duration: 0.2s;
-  animation-name: fadeOutFrames-fb5dbd9f;
+  animation-name: fadeOutFrames-7e6a0b8d;
   animation-fill-mode: both;
 }
-.slideInTop[data-v-fb5dbd9f] {
+.slideInTop[data-v-7e6a0b8d] {
   animation-duration: 0.4s;
-  animation-name: fadeInFrames-fb5dbd9f,slideInTopFrames-fb5dbd9f;
+  animation-name: fadeInFrames-7e6a0b8d,slideInTopFrames-7e6a0b8d;
   animation-fill-mode: both;
 }
-.slideOutTop[data-v-fb5dbd9f] {
+.slideOutTop[data-v-7e6a0b8d] {
   animation-duration: 0.2s;
-  animation-name: fadeOutFrames-fb5dbd9f,slideOutTopFrames-fb5dbd9f;
+  animation-name: fadeOutFrames-7e6a0b8d,slideOutTopFrames-7e6a0b8d;
   animation-fill-mode: both;
 }
-@keyframes slideInTopFrames-fb5dbd9f {
+@keyframes slideInTopFrames-7e6a0b8d {
 from {
     transform: translate(0, -12px);
     animation-timing-function: cubic-bezier(0, 0, 0, 1);
@@ -444,7 +444,7 @@ to {
     transform: translate(0, 0);
 }
 }
-@keyframes slideOutTopFrames-fb5dbd9f {
+@keyframes slideOutTopFrames-7e6a0b8d {
 from {
     transform: translate(0, 0);
     animation-timing-function: cubic-bezier(0.33, 0, 0.67, 1);
@@ -453,7 +453,7 @@ to {
     transform: translate(0, -12px);
 }
 }
-@keyframes fadeInFrames-fb5dbd9f {
+@keyframes fadeInFrames-7e6a0b8d {
 from {
     opacity: 0;
     animation-timing-function: cubic-bezier(0, 0, 1, 1);
@@ -462,7 +462,7 @@ to {
     opacity: 1;
 }
 }
-@keyframes fadeOutFrames-fb5dbd9f {
+@keyframes fadeOutFrames-7e6a0b8d {
 from {
     opacity: 1;
     animation-timing-function: cubic-bezier(0.33, 0, 0.67, 1);

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@pequity/squirrel",
   "description": "Squirrel component library",
-  "version": "5.2.2",
+  "version": "5.3.0",
   "packageManager": "pnpm@9.11.0",
   "type": "module",
   "scripts": {
@@ -13,8 +13,8 @@
     "preview": "vite preview",
     "lint": "eslint \"**/*.{vue,ts,js}\"",
     "lint-fix": "eslint --fix \"**/*.{vue,ts,js}\"",
-    "test:unit": "TZ=utc jest",
-    "test:unit-coverage": "TZ=utc jest --coverage && make-coverage-badge",
+    "test:unit": "vitest",
+    "test:unit-coverage": "vitest run --coverage && make-coverage-badge",
     "typecheck": "vue-tsc --noEmit",
     "storybook": "storybook dev -p 6006",
     "build-storybook": "storybook build",
@@ -50,8 +50,6 @@
     "vue-toastification": "^2.0.0-rc.5"
   },
   "devDependencies": {
-    "@babel/core": "^7.25.2",
-    "@babel/preset-env": "^7.25.4",
     "@commitlint/cli": "^19.5.0",
     "@commitlint/config-conventional": "^19.5.0",
     "@pequity/eslint-config": "^0.0.13",
@@ -59,29 +57,27 @@
     "@popperjs/core": "2.11.8",
     "@semantic-release/changelog": "^6.0.3",
     "@semantic-release/git": "^10.0.1",
-    "@storybook/addon-a11y": "^8.3.2",
-    "@storybook/addon-actions": "^8.3.2",
-    "@storybook/addon-essentials": "^8.3.2",
-    "@storybook/addon-interactions": "^8.3.2",
-    "@storybook/addon-links": "^8.3.2",
-    "@storybook/blocks": "^8.3.2",
-    "@storybook/manager-api": "^8.3.2",
-    "@storybook/test": "^8.3.2",
+    "@storybook/addon-a11y": "^8.3.3",
+    "@storybook/addon-actions": "^8.3.3",
+    "@storybook/addon-essentials": "^8.3.3",
+    "@storybook/addon-interactions": "^8.3.3",
+    "@storybook/addon-links": "^8.3.3",
+    "@storybook/blocks": "^8.3.3",
+    "@storybook/manager-api": "^8.3.3",
+    "@storybook/test": "^8.3.3",
     "@storybook/test-runner": "^0.19.1",
-    "@storybook/theming": "^8.3.2",
-    "@storybook/vue3": "^8.3.2",
-    "@storybook/vue3-vite": "^8.3.2",
+    "@storybook/theming": "^8.3.3",
+    "@storybook/vue3": "^8.3.3",
+    "@storybook/vue3-vite": "^8.3.3",
     "@tanstack/vue-virtual": "3.10.8",
-    "@types/jest": "^29.5.13",
     "@types/jsdom": "^21.1.7",
     "@types/lodash-es": "^4.17.12",
-    "@types/node": "^22.5.5",
+    "@types/node": "^22.7.2",
     "@vitejs/plugin-vue": "^5.1.4",
+    "@vitest/coverage-v8": "^2.1.1",
     "@vue/compiler-sfc": "3.4.38",
     "@vue/test-utils": "^2.4.6",
-    "@vue/vue3-jest": "^29.2.6",
     "autoprefixer": "^10.4.20",
-    "babel-jest": "^29.7.0",
     "dayjs": "1.11.13",
     "eslint": "^8.57.0",
     "eslint-plugin-storybook": "^0.8.0",
@@ -89,25 +85,24 @@
     "glob": "^11.0.0",
     "husky": "^9.1.6",
     "iconify-icon": "^2.1.0",
-    "jest": "^29.7.0",
-    "jest-environment-jsdom": "^29.7.0",
+    "jsdom": "^25.0.1",
     "lint-staged": "^15.2.10",
     "lodash-es": "4.17.21",
     "make-coverage-badge": "^1.2.0",
     "postcss": "^8.4.47",
     "prettier": "^3.3.3",
-    "prettier-plugin-tailwindcss": "^0.6.6",
+    "prettier-plugin-tailwindcss": "^0.6.8",
     "resolve-tspaths": "^0.8.22",
     "rimraf": "^6.0.1",
     "sass": "^1.79.3",
     "semantic-release": "^24.1.1",
-    "storybook": "^8.3.2",
+    "storybook": "^8.3.3",
     "svgo": "^3.3.2",
-    "tailwindcss": "^3.4.12",
-    "ts-jest": "^29.2.5",
+    "tailwindcss": "^3.4.13",
     "typescript": "5.6.2",
     "v-calendar": "3.1.2",
-    "vite": "^5.4.7",
+    "vite": "^5.4.8",
+    "vitest": "^2.1.1",
     "vue": "3.4.38",
     "vue-currency-input": "3.1.0",
     "vue-router": "4.4.5",

package/squirrel/components/p-action-bar/p-action-bar.spec.js

@@ -1,26 +1,15 @@
 import PActionBar from '@squirrel/components/p-action-bar/p-action-bar.vue';
-import { createWrapperFor } from '@tests/jest.helpers';
+import { createWrapperFor } from '@tests/vitest.helpers';
+import { defineComponent } from 'vue';
 
 const createPDropdownStub = () => {
-  return {
+  return defineComponent({
     name: 'PDropdownStub',
-    template: `
-      <div class="pdropdown-stub">
-        <slot></slot>
-        <div v-if="show" class="pdropdown-stub-popper">
-          <slot name="popper"></slot>
-        </div>
-      </div>`,
     data() {
       return {
         show: false,
       };
     },
-    methods: {
-      toggleShow() {
-        this.show = !this.show;
-      },
-    },
     async mounted() {
       const btn = this.$el.querySelector('button');
 
@@ -31,7 +20,19 @@ const createPDropdownStub = () => {
 
       btn.removeEventListener('click', this.toggleShow);
     },
-  };
+    methods: {
+      toggleShow() {
+        this.show = !this.show;
+      },
+    },
+    template: `
+      <div class="p-dropdown-stub">
+        <slot></slot>
+        <div v-if="show" class="p-dropdown-stub-popper">
+          <slot name="popper"></slot>
+        </div>
+      </div>`,
+  });
 };
 
 const createComponentWrapper = (args = {}) =>
@@ -103,6 +104,37 @@ describe('PActionBar.vue', () => {
     expect(actionBtn.text()).toContain('Say Hi');
   });
 
+  it('renders p-icons', async () => {
+    const wrapper = createComponentWrapper({
+      props: {
+        show: true,
+        label: 'Hello World',
+        actions: [
+          { label: 'Say Hi', name: 'greet', icon: 'test-icon-1' },
+          {
+            label: 'Action menu',
+            icon: 'test-icon-2',
+            subActions: [{ label: 'Say Bye', name: 'bye', icon: 'test-icon-3' }],
+          },
+        ],
+      },
+    });
+
+    const mainDiv = await wrapper.find('.teleport-stub > .fixed.bottom-6');
+
+    await mainDiv.find('.p-dropdown-stub > button').trigger('click');
+
+    await wrapper.vm.$nextTick();
+
+    const icons = mainDiv.findAll('iconify-icon');
+
+    expect(icons.length).toBe(3);
+
+    expect(icons[0].attributes().icon).toBe('test-icon-1');
+    expect(icons[1].attributes().icon).toBe('test-icon-2');
+    expect(icons[2].attributes().icon).toBe('test-icon-3');
+  });
+
   it('attrs fall through ', async () => {
     const wrapper = createComponentWrapper({
       props: {

package/squirrel/components/p-action-bar/p-action-bar.stories.js

@@ -14,6 +14,7 @@ const actionBarActions = [
   },
   {
     label: 'Say Hi',
+    icon: 'delete',
     name: 'greet',
   },
   {
@@ -29,6 +30,11 @@ const actionBarActions = [
         name: 'subaction2',
         icon: PaginateRightIcon,
       },
+      {
+        label: 'Subaction 3',
+        name: 'subaction3',
+        icon: 'ph:android-logo',
+      },
     ],
   },
 ];

package/squirrel/components/p-action-bar/p-action-bar.types.ts

@@ -1,10 +1,12 @@
+import { type Component } from 'vue';
+
 export type PActionBarAction = {
   name?: string;
   label: string;
-  icon?: string;
+  icon?: string | Component;
   subActions?: {
     name: string;
     label: string;
-    icon?: string;
+    icon?: string | Component;
   }[];
 };

package/squirrel/components/p-action-bar/p-action-bar.vue

@@ -16,14 +16,16 @@
               @click="$emit('click:action', actionOrMenu.name)"
             >
               <div class="flex items-center gap-2 px-1 py-0.5">
-                <Component :is="actionOrMenu.icon" v-if="actionOrMenu.icon" class="h-4 w-4" />
+                <Component :is="actionOrMenu.icon" v-if="isComponent(actionOrMenu.icon)" class="h-4 w-4" />
+                <PIcon v-if="isString(actionOrMenu.icon)" :icon="actionOrMenu.icon" width="16px" height="16px" />
                 <div>{{ actionOrMenu.label }}</div>
               </div>
             </PBtn>
             <PDropdown v-else placement="top" strategy="fixed">
               <PBtn size="sm" type="secondary-ghost-dark">
                 <div class="flex items-center gap-2 px-1 py-0.5">
-                  <Component :is="actionOrMenu.icon" v-if="actionOrMenu.icon" class="h-4 w-4" />
+                  <Component :is="actionOrMenu.icon" v-if="isComponent(actionOrMenu.icon)" class="h-4 w-4" />
+                  <PIcon v-if="isString(actionOrMenu.icon)" :icon="actionOrMenu.icon" width="16px" height="16px" />
                   <div>{{ actionOrMenu.label }}</div>
                 </div>
               </PBtn>
@@ -37,7 +39,8 @@
                       @click="$emit('click:action', subaction.name)"
                     >
                       <div class="flex items-center gap-2 px-1 py-0.5">
-                        <Component :is="subaction.icon" v-if="subaction.icon" class="h-4 w-4" />
+                        <Component :is="subaction.icon" v-if="isComponent(subaction.icon)" class="h-4 w-4" />
+                        <PIcon v-if="isString(subaction.icon)" :icon="subaction.icon" width="16px" height="16px" />
                         <div>{{ subaction.label }}</div>
                       </div>
                     </PBtn>
@@ -56,7 +59,10 @@
 import PBtn from '@squirrel/components/p-btn/p-btn.vue';
 import PCloseBtn from '@squirrel/components/p-close-btn/p-close-btn.vue';
 import PDropdown from '@squirrel/components/p-dropdown/p-dropdown.vue';
+import PIcon from '@squirrel/components/p-icon/p-icon.vue';
 import { type PActionBarAction } from '@squirrel/components/p-action-bar/p-action-bar.types';
+import { isComponent } from '@squirrel/utils/component';
+import { isString } from '@squirrel/utils/string';
 
 defineOptions({
   name: 'PActionBar',