@pequity/squirrel 8.4.4 → 8.4.5

package/dist/es/p-dropdown.js

@@ -23,6 +23,7 @@ const _sfc_main = defineComponent({
     },
     /**
      * Enables closing the dropdown with the Escape key.
+     * When true, pressing Escape will close the dropdown.
      */
     enableCloseOnEsc: {
       type: Boolean,
@@ -30,7 +31,7 @@ const _sfc_main = defineComponent({
     },
     /**
      * v-tooltip wraps the popper trigger with a div that has `display: inline-block` set by default.
-     * This prop is used to override the CSS style of that wrapper div
+     * This prop is used to override the CSS style of that wrapper div.
      */
     triggerStyle: {
       type: Object,

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

@@ -10,10 +10,18 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   },
   __name: "p-input-search",
   props: {
+    /**
+     * The search query value (v-model).
+     * Controls the input field content and visibility of the clear button.
+     */
     modelValue: {
       type: String,
       default: ""
     },
+    /**
+     * The size of the search input.
+     * Affects the overall dimensions and icon positioning.
+     */
     size: {
       type: String,
       default: "md",
@@ -21,6 +29,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         return SIZES.includes(value);
       }
     },
+    /**
+     * Whether to show the enter key icon when the input is focused.
+     * Provides visual feedback that pressing enter will trigger a search.
+     */
     showEnterIcon: {
       type: Boolean,
       default: false
@@ -114,7 +126,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const PInputSearch = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-0e51ff56"]]);
+const PInputSearch = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-ce44730a"]]);
 export {
   PInputSearch as default
 };

package/dist/es/p-loading.js

@@ -115,7 +115,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const pLoading = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-9ad56d4f"]]);
+const pLoading = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-7e116004"]]);
 export {
   pLoading as default
 };

package/dist/es/p-modal.js

@@ -25,82 +25,162 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   },
   __name: "p-modal",
   props: {
+    /**
+     * Unique name for the modal when using the modal service.
+     * Used for programmatic control of the modal.
+     */
     name: {
       type: String,
       default: ""
     },
+    /**
+     * Title displayed in the modal header.
+     * Used for accessibility and visual identification.
+     */
     title: {
       type: String,
       default: ""
     },
+    /**
+     * Base z-index for the modal.
+     * Higher values ensure the modal appears above other content.
+     */
     baseZindex: {
       type: Number,
       default: 1051
     },
+    /**
+     * CSS classes for the backdrop element.
+     * Controls the appearance of the modal overlay.
+     */
     bgClass: {
       type: [String, Object, Array],
       default: "fixed bottom-0 left-0 right-0 top-0 bg-black/20"
     },
+    /**
+     * CSS classes for the modal wrapper element.
+     * Controls the positioning and layout of the modal container.
+     */
     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"
     },
+    /**
+     * Base CSS classes for the modal content.
+     * Controls the appearance of the modal dialog itself.
+     */
     modalBaseClass: {
       type: [String, Object, Array],
       default: "pm relative flex flex-col rounded-2xl pb-6 cursor-default bg-surface shadow-xl"
     },
+    /**
+     * Additional CSS classes for the modal content.
+     * Merged with modalBaseClass for custom styling.
+     */
     modalClass: {
       type: [String, Object, Array],
       default: ""
     },
+    /**
+     * Inline styles for the modal content.
+     * Applied directly to the modal element.
+     */
     modalStyle: {
       type: [String, Object, Array],
       default: ""
     },
+    /**
+     * CSS class for the modal entrance animation.
+     * Controls how the modal appears.
+     */
     inClass: {
       type: String,
       default: "slideInTop"
     },
+    /**
+     * CSS class for the modal exit animation.
+     * Controls how the modal disappears.
+     */
     outClass: {
       type: String,
       default: "slideOutTop"
     },
+    /**
+     * CSS class for the backdrop entrance animation.
+     * Controls how the backdrop appears.
+     */
     bgInClass: {
       type: String,
       default: "fadeIn"
     },
+    /**
+     * CSS class for the backdrop exit animation.
+     * Controls how the backdrop disappears.
+     */
     bgOutClass: {
       type: String,
       default: "fadeOut"
     },
+    /**
+     * Target element to append the modal to.
+     * Usually 'body' for proper z-index stacking.
+     */
     appendTo: {
       type: String,
       default: "body"
     },
+    /**
+     * Whether the modal should be mounted immediately.
+     * Useful for modals that are always present in the DOM.
+     */
     live: {
       type: Boolean,
       default: false
     },
+    /**
+     * Whether the modal can be closed by user interaction.
+     * Controls close button visibility and backdrop click behavior.
+     */
     enableClose: {
       type: Boolean,
       default: true
     },
+    /**
+     * Controls the visibility of the modal (v-model).
+     * Supports two-way binding for modal state.
+     */
     modelValue: {
       type: Boolean,
       default: false
     },
+    /**
+     * Accessibility label for the close button.
+     * Used by screen readers for better accessibility.
+     */
     closeLabel: {
       type: String,
       default: "Close"
     },
+    /**
+     * Whether the modal content is disabled.
+     * Prevents user interaction with modal content.
+     */
     disabled: {
       type: Boolean,
       default: false
     },
+    /**
+     * Error message to display in the modal.
+     * Shows an error alert above the modal content.
+     */
     errorMsg: {
       type: String,
       default: ""
     },
+    /**
+     * Maximum width of the modal.
+     * Controls the responsive behavior of the modal.
+     */
     maxWidth: {
       type: String,
       default: "500px"
@@ -109,7 +189,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   emits: ["before-open", "opening", "opened", "before-close", "closing", "closed", "update:modelValue", "click:overlay"],
   setup(__props, { emit: __emit }) {
     useCssVars((_ctx) => ({
-      "29225c6f": __props.maxWidth
+      "5951a2a6": __props.maxWidth
     }));
     let animatingZIndex = 0;
     const emit = __emit;
@@ -364,7 +444,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const pModal = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-a511ac01"]]);
+const pModal = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-bb3daa48"]]);
 export {
   pModal as default
 };

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

@@ -14,26 +14,51 @@ const getOffsetValues = (container) => {
 const _sfc_main = defineComponent({
   name: "PSelectPill",
   props: {
+    /**
+     * The currently selected value (v-model).
+     * Should match one of the item values in the items array.
+     */
     modelValue: {
       type: [String, Number],
       default: ""
     },
+    /**
+     * Array of options to display as pills.
+     * Each option should have text, value, and optional subtext and disabled properties.
+     */
     items: {
       type: Array,
       default: () => []
     },
+    /**
+     * Property name to use as the item display text.
+     * Used for button label content.
+     */
     itemText: {
       type: String,
       default: "text"
     },
+    /**
+     * Property name to use as the item subtext.
+     * Displayed below the main text when provided.
+     */
     itemSubtext: {
       type: String,
       default: "subtext"
     },
+    /**
+     * Property name to use as the item value.
+     * Used for selection comparison and v-model binding.
+     */
     itemValue: {
       type: [String, Number],
       default: "value"
     },
+    /**
+     * The size of the pill buttons.
+     * Valid values: 'sm', 'md', 'lg'
+     * @values sm, md, lg
+     */
     size: {
       type: String,
       default: "md",
@@ -42,7 +67,13 @@ const _sfc_main = defineComponent({
       }
     }
   },
-  emits: ["update:modelValue"],
+  emits: {
+    /**
+     * Emitted when the selected value changes.
+     * @param {string | number} value - The new selected value
+     */
+    "update:modelValue": (value) => true
+  },
   data() {
     return {
       SIZES,
@@ -69,7 +100,10 @@ const _sfc_main = defineComponent({
   methods: {
     click(e, option) {
       if (!option.disabled) {
-        this.$emit("update:modelValue", option[this.itemValue]);
+        const value = option[this.itemValue];
+        if (typeof value === "string" || typeof value === "number") {
+          this.$emit("update:modelValue", value);
+        }
       }
     },
     setPillStyle() {

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

@@ -17,6 +17,10 @@ const hexToRgb = (hex) => `${hex.match(/\w\w/g)?.map((x) => +`0x${x}`)}`;
 const _sfc_main = defineComponent({
   name: "PSkeletonLoader",
   props: {
+    /**
+     * The shape type of the skeleton loader.
+     * Determines the border radius and overall appearance.
+     */
     type: {
       type: String,
       default: LOADER_TYPES.rectangle,
@@ -24,14 +28,26 @@ const _sfc_main = defineComponent({
         return Object.values(LOADER_TYPES).includes(value);
       }
     },
+    /**
+     * The background CSS class for the skeleton loader.
+     * Controls the base color of the loading placeholder.
+     */
     bgClass: {
       type: String,
       default: "bg-p-gray-30"
     },
+    /**
+     * Additional CSS classes to apply to the loader.
+     * Allows for custom styling beyond the default type-based classes.
+     */
     cssClass: {
       type: String,
       default: ""
     },
+    /**
+     * The color of the shimmer effect in hex format.
+     * Controls the color of the animated shimmer overlay.
+     */
     shimmerColor: {
       type: String,
       default: SHIMMER_COLOR
@@ -65,7 +81,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     renderSlot(_ctx.$slots, "default", {}, void 0, true)
   ], 2);
 }
-const PSkeletonLoader = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-3d77f34f"]]);
+const PSkeletonLoader = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-1beaf57b"]]);
 export {
   PSkeletonLoader as default
 };

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

@@ -7,6 +7,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   },
   __name: "p-table-filter-icon",
   props: {
+    /**
+     * Whether the filter icon is active (filtered state).
+     */
     active: {
       type: Boolean,
       default: false
@@ -20,7 +23,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const PTableFilterIcon = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-84864117"]]);
+const PTableFilterIcon = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-5c047926"]]);
 export {
   PTableFilterIcon as default
 };

package/dist/es/p-table-header-cell.js

@@ -10,31 +10,60 @@ const _sfc_main = defineComponent({
     PInfoIcon: _sfc_main$1
   },
   props: {
+    /**
+     * The text content to display in the header cell.
+     * Also used as the title attribute for accessibility.
+     */
     text: {
       type: String,
       default: ""
     },
+    /**
+     * CSS classes to apply to the text element.
+     * Can be a string, object, or array for flexible styling.
+     */
     textClass: {
       type: [String, Object, Array],
       default: "text-left"
     },
+    /**
+     * Whether the filter icon is in an active state.
+     * Controls the visual appearance of the filter icon and text color.
+     */
     filterActive: {
       type: Boolean,
       default: false
     },
+    /**
+     * Whether to show the filter icon.
+     * When false, the filter icon is hidden regardless of other states.
+     */
     showFilterIcon: {
       type: Boolean,
       default: false
     },
+    /**
+     * Tooltip text to display when hovering over the info icon.
+     * When provided, shows an info icon with the tooltip content.
+     */
     tooltipText: {
       type: String,
       default: ""
     },
+    /**
+     * Custom text color to apply to the header text.
+     * Overrides the default text color when provided.
+     */
     textColor: {
       type: String,
       default: ""
     }
   },
+  /**
+   * Emitted when the filter icon is clicked.
+   * @param {Event} event - The click event
+   * @param {boolean} filterActive - The current filter active state
+   */
   emits: ["click-filter-icon"],
   data() {
     return {

package/dist/es/p-table-td.js

@@ -81,7 +81,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const PTableTd = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-c9978e26"]]);
+const PTableTd = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-9a0c95c7"]]);
 export {
   PTableTd as default
 };

package/dist/es/p-toggle.js

@@ -34,22 +34,43 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   },
   __name: "p-toggle",
   props: {
+    /**
+     * The current toggle state (v-model).
+     * Supports two-way binding for form inputs.
+     */
     modelValue: {
       type: Boolean,
       default: false
     },
+    /**
+     * Text label for the toggle switch.
+     * If not provided, you can use the label slot instead.
+     */
     label: {
       type: String,
       default: ""
     },
+    /**
+     * Error message to display below the toggle.
+     * When provided, the toggle will show error styling.
+     */
     errorMsg: {
       type: String,
       default: ""
     },
+    /**
+     * Whether the toggle is required.
+     * Adds required attribute and visual indicator.
+     */
     required: {
       type: Boolean,
       default: false
     },
+    /**
+     * The size of the toggle switch.
+     * Valid values: 'sm', 'md', 'lg'
+     * @values sm, md, lg
+     */
     size: {
       type: String,
       default: "md",
@@ -122,7 +143,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const pToggle = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-c544a8a9"]]);
+const pToggle = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-af725f56"]]);
 export {
   pToggle as default
 };

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

@@ -1,14 +1,26 @@
 import { type PActionBarAction } from './p-action-bar.types';
 type Props = {
+    /**
+     * Controls visibility of the action bar.
+     * When true, the action bar is displayed at the bottom of the screen.
+     */
     show: boolean;
+    /**
+     * The main text displayed in the action bar.
+     * Provides context for the available actions.
+     */
     label: string;
+    /**
+     * Array of action objects to be rendered as buttons or dropdowns.
+     * Each action can have an icon, label, and optional sub-actions.
+     */
     actions: PActionBarAction[];
 };
 declare const _default: import("vue").DefineComponent<Props, void, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "click:dismiss": () => any;
-    "click:action": (args_0: string | undefined) => any;
+    "click:action": (name: string | undefined) => any;
 }, string, import("vue").PublicProps, Readonly<Props> & Readonly<{
     "onClick:dismiss"?: (() => any) | undefined;
-    "onClick:action"?: ((args_0: string | undefined) => any) | undefined;
+    "onClick:action"?: ((name: string | undefined) => any) | undefined;
 }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 export default _default;

package/dist/squirrel/components/p-alert/p-alert.vue.d.ts

@@ -18,12 +18,18 @@ declare const ALERT_TYPES: {
     };
 };
 declare const _default: __VLS_WithSlots<import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    /**
+     * The type of the alert which determines its appearance and icon
+     */
     type: {
         type: PropType<keyof typeof ALERT_TYPES>;
         default: string;
         validator(value: keyof typeof ALERT_TYPES): boolean;
     };
 }>, void, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    /**
+     * The type of the alert which determines its appearance and icon
+     */
     type: {
         type: PropType<keyof typeof ALERT_TYPES>;
         default: string;
@@ -32,9 +38,16 @@ declare const _default: __VLS_WithSlots<import("vue").DefineComponent<import("vu
 }>> & Readonly<{}>, {
     type: "info" | "error" | "success" | "warning";
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>, {
-    icon?: (props: {}) => any;
-} & {
-    default?: (props: {}) => any;
+    /**
+     * Custom icon slot - use this to override the default alert type icon.
+     * If not provided, a default icon will be shown based on the alert type.
+     */
+    icon?: () => unknown;
+    /**
+     * Default slot - the main content of the alert message.
+     * This should contain the text or HTML to display in the alert.
+     */
+    default?: () => unknown;
 }>;
 export default _default;
 type __VLS_WithSlots<T, S> = T & {

package/dist/squirrel/components/p-avatar/p-avatar.vue.d.ts

@@ -1,46 +1,81 @@
 import { type PropType } from 'vue';
+/**
+ * Available avatar shapes
+ */
 declare const SHAPES: readonly ["rectangle", "circle"];
 type Shape = (typeof SHAPES)[number];
 declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    /**
+     * The shape of the avatar
+     */
     shape: {
         type: PropType<Shape>;
         default: string;
         validator: (value: Shape) => boolean;
     };
+    /**
+     * URL of the image to display
+     */
     imageSrc: {
         type: StringConstructor;
         default: string;
     };
+    /**
+     * Text to display when image is not available
+     * Also used as the alt text for the image
+     */
     label: {
         type: StringConstructor;
         required: true;
     };
+    /**
+     * Additional CSS classes to apply to the image
+     */
     imageClass: {
         type: StringConstructor;
         default: string;
     };
+    /**
+     * Additional CSS classes to apply to the label container
+     */
     labelClass: {
         type: StringConstructor;
         default: string;
     };
 }>, void, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    /**
+     * The shape of the avatar
+     */
     shape: {
         type: PropType<Shape>;
         default: string;
         validator: (value: Shape) => boolean;
     };
+    /**
+     * URL of the image to display
+     */
     imageSrc: {
         type: StringConstructor;
         default: string;
     };
+    /**
+     * Text to display when image is not available
+     * Also used as the alt text for the image
+     */
     label: {
         type: StringConstructor;
         required: true;
     };
+    /**
+     * Additional CSS classes to apply to the image
+     */
     imageClass: {
         type: StringConstructor;
         default: string;
     };
+    /**
+     * Additional CSS classes to apply to the label container
+     */
     labelClass: {
         type: StringConstructor;
         default: string;