@pequity/squirrel 8.4.4 → 8.4.5

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

@@ -15,26 +15,51 @@ const getOffsetValues = (container) => {
 const _sfc_main = vue.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",
@@ -43,7 +68,13 @@ const _sfc_main = vue.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,
@@ -70,7 +101,10 @@ const _sfc_main = vue.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/cjs/p-skeleton-loader.js

@@ -18,6 +18,10 @@ const hexToRgb = (hex) => `${hex.match(/\w\w/g)?.map((x) => +`0x${x}`)}`;
 const _sfc_main = vue.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,
@@ -25,14 +29,26 @@ const _sfc_main = vue.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
@@ -66,5 +82,5 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     vue.renderSlot(_ctx.$slots, "default", {}, void 0, true)
   ], 2);
 }
-const PSkeletonLoader = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-3d77f34f"]]);
+const PSkeletonLoader = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-1beaf57b"]]);
 module.exports = PSkeletonLoader;

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

@@ -8,6 +8,9 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
   },
   __name: "p-table-filter-icon",
   props: {
+    /**
+     * Whether the filter icon is active (filtered state).
+     */
     active: {
       type: Boolean,
       default: false
@@ -21,5 +24,5 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const PTableFilterIcon = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main, [["__scopeId", "data-v-84864117"]]);
+const PTableFilterIcon = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main, [["__scopeId", "data-v-5c047926"]]);
 module.exports = PTableFilterIcon;

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

@@ -11,31 +11,60 @@ const _sfc_main = vue.defineComponent({
     PInfoIcon: pInfoIcon_vue_vue_type_script_setup_true_lang._sfc_main
   },
   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/cjs/p-table-td.js

@@ -82,5 +82,5 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const PTableTd = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main, [["__scopeId", "data-v-c9978e26"]]);
+const PTableTd = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main, [["__scopeId", "data-v-9a0c95c7"]]);
 module.exports = PTableTd;

package/dist/cjs/p-toggle.js

@@ -35,22 +35,43 @@ const _sfc_main = /* @__PURE__ */ vue.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",
@@ -123,5 +144,5 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const pToggle = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main, [["__scopeId", "data-v-c544a8a9"]]);
+const pToggle = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main, [["__scopeId", "data-v-af725f56"]]);
 module.exports = pToggle;

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

@@ -14,6 +14,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   },
   __name: "p-alert",
   props: {
+    /**
+     * The type of the alert which determines its appearance and icon
+     */
     type: {
       type: String,
       default: "info",

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

@@ -11,23 +11,39 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   },
   __name: "p-avatar",
   props: {
+    /**
+     * The shape of the avatar
+     */
     shape: {
       type: String,
       default: "circle",
       validator: (value) => SHAPES.includes(value)
     },
+    /**
+     * URL of the image to display
+     */
     imageSrc: {
       type: String,
       default: ""
     },
+    /**
+     * Text to display when image is not available
+     * Also used as the alt text for the image
+     */
     label: {
       type: String,
       required: true
     },
+    /**
+     * Additional CSS classes to apply to the image
+     */
     imageClass: {
       type: String,
       default: ""
     },
+    /**
+     * Additional CSS classes to apply to the label container
+     */
     labelClass: {
       type: String,
       default: ""

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

@@ -137,6 +137,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       type: String,
       default: ""
     },
+    /**
+     * The icon to display on the right side of the button
+     */
     iconRight: {
       type: String,
       default: ""

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

@@ -5,6 +5,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   ...{ name: "PCard" },
   __name: "p-card",
   props: {
+    /**
+     * The title of the card - displayed at the top
+     * If not provided, you can use the title slot instead
+     */
     title: {
       type: String,
       default: ""

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

@@ -48,6 +48,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   },
   __name: "p-dropdown-select",
   props: {
+    /**
+     * The selected value(s) for the dropdown (v-model).
+     * Can be a single value or array of values depending on multiple prop.
+     */
     modelValue: {
       type: [String, Number, Boolean, Array, Object],
       default: null
@@ -69,18 +73,30 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       type: Array,
       default: () => []
     },
+    /**
+     * Label text displayed above the dropdown.
+     */
     label: {
       type: String,
       default: ""
     },
+    /**
+     * Error message to display below the dropdown.
+     */
     errorMsg: {
       type: String,
       default: ""
     },
+    /**
+     * Whether the field is required.
+     */
     required: {
       type: Boolean,
       default: false
     },
+    /**
+     * The size of the dropdown component.
+     */
     size: {
       type: String,
       default: "md",
@@ -117,26 +133,44 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       type: Number,
       default: 7
     },
+    /**
+     * Additional attributes to apply to the dropdown menu.
+     */
     dropdownMenuAttrs: {
       type: Object,
       default: () => ({})
     },
+    /**
+     * CSS classes to apply to the dropdown menu.
+     */
     dropdownMenuClass: {
       type: String,
       default: "overflow-x-hidden"
     },
+    /**
+     * Inline styles to apply to the dropdown menu.
+     */
     dropdownMenuStyle: {
       type: Object,
       default: () => ({})
     },
+    /**
+     * Props to pass to the underlying PDropdown component.
+     */
     pDropdownProps: {
       type: Object,
       default: () => ({})
     },
+    /**
+     * Whether to enable search functionality within the dropdown.
+     */
     searchable: {
       type: Boolean,
       default: false
     },
+    /**
+     * Whether to show a clear button when items are selected.
+     */
     clearable: {
       type: Boolean,
       default: false

package/dist/es/chunks/p-input-number.js

@@ -16,22 +16,42 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   },
   __name: "p-input-number",
   props: {
+    /**
+     * The current numeric value of the input (v-model).
+     * Supports two-way binding for form inputs.
+     */
     modelValue: {
       type: [Number, String],
       default: null
     },
+    /**
+     * Text label for the input field.
+     * If not provided, you can use the label slot instead.
+     */
     label: {
       type: String,
       default: ""
     },
+    /**
+     * Error message to display below the input.
+     * When provided, the input will show error styling.
+     */
     errorMsg: {
       type: String,
       default: ""
     },
+    /**
+     * Whether the input is required.
+     * Adds required attribute and visual indicator.
+     */
     required: {
       type: Boolean,
       default: false
     },
+    /**
+     * The size of the input - affects padding, font size, and spacing.
+     * Valid values: 'sm', 'md', 'lg'
+     */
     size: {
       type: String,
       default: "md",
@@ -39,14 +59,26 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         return SIZES.includes(value);
       }
     },
+    /**
+     * Whether to select all text when the input receives focus.
+     * Provides better UX for number input fields.
+     */
     selectOnClick: {
       type: Boolean,
       default: true
     },
+    /**
+     * Text for the info tooltip displayed next to the label.
+     * Uses PInfoIcon component for consistent tooltip styling.
+     */
     tooltipText: {
       type: String,
       default: ""
     },
+    /**
+     * String to display as prefix in the input field.
+     * Can be overridden by the prefix slot for custom content.
+     */
     prefixString: {
       type: String,
       default: ""

package/dist/es/chunks/p-input-percent.js

@@ -1,5 +1,6 @@
 import { defineComponent, computed, createBlock, openBlock, withCtx, createElementVNode, normalizeClass } from "vue";
 import { _ as _sfc_main$1 } from "./p-input-number.js";
+import { toNumberOrNull } from "../number.js";
 import { isNumber } from "lodash-es";
 const _sfc_main = /* @__PURE__ */ defineComponent({
   ...{
@@ -7,10 +8,20 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   },
   __name: "p-input-percent",
   props: {
+    /**
+     * The current value (v-model).
+     * Stored as a decimal (0.5 = 50%) but displayed as a percentage.
+     * Supports two-way binding for form inputs.
+     */
     modelValue: {
       type: [Number, String],
       default: null
     },
+    /**
+     * The size of the input field.
+     * Valid values: 'sm', 'md', 'lg'
+     * @values sm, md, lg
+     */
     size: {
       type: String,
       default: "md"
@@ -26,8 +37,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const props = __props;
     const emit = __emit;
     const convertedValue = computed({
-      get: () => isNumber(props.modelValue) ? props.modelValue * 100 : props.modelValue,
-      set: (nV) => emit("update:modelValue", isNumber(nV) ? nV / 100 : nV)
+      get: () => isNumber(props.modelValue) ? props.modelValue * 100 : toNumberOrNull(props.modelValue),
+      set: (nV) => emit("update:modelValue", isNumber(nV) ? nV / 100 : toNumberOrNull(nV))
     });
     return (_ctx, _cache) => {
       return openBlock(), createBlock(_sfc_main$1, {

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

@@ -14,10 +14,18 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   },
   __name: "p-input",
   props: {
+    /**
+     * The current value of the input (v-model).
+     * Supports two-way binding for form inputs.
+     */
     modelValue: {
       type: [String, Number, Boolean, null],
       default: ""
     },
+    /**
+     * The type of the input field.
+     * Valid values: 'text', 'password'
+     */
     type: {
       type: String,
       default: INPUT_TYPES.TEXT,
@@ -25,18 +33,34 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         return Object.values(INPUT_TYPES).includes(value);
       }
     },
+    /**
+     * Text label for the input field.
+     * If not provided, you can use the label slot instead.
+     */
     label: {
       type: String,
       default: ""
     },
+    /**
+     * Error message to display below the input.
+     * When provided, the input will show error styling.
+     */
     errorMsg: {
       type: String,
       default: ""
     },
+    /**
+     * Whether the input is required.
+     * Adds required attribute and visual indicator.
+     */
     required: {
       type: Boolean,
       default: false
     },
+    /**
+     * The size of the input - affects padding, font size, and spacing.
+     * Valid values: 'sm', 'md', 'lg'
+     */
     size: {
       type: String,
       default: "md",
@@ -44,6 +68,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         return SIZES.includes(value);
       }
     },
+    /**
+     * Whether the input has rounded corners.
+     * Applies rounded styling to the input field.
+     */
     rounded: {
       type: Boolean,
       default: false

package/dist/es/chunks/p-pagination-info.js

@@ -9,28 +9,32 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "p-pagination-info",
   props: {
     /**
-     * The current page.
+     * The current page number (1-based).
+     * Used to calculate the starting item number in the display range.
      */
     currentPage: {
       type: Number,
       default: 0
     },
     /**
-     * The amount of data pagination iterates through.
+     * The total number of items across all pages.
+     * Used to calculate the total count and ending item number.
      */
     count: {
       type: Number,
       default: 0
     },
     /**
-     * The amount of data to be displayed at 1 page. Used to calculate the `from` and `to` limits.
+     * The number of items displayed per page.
+     * Used to calculate the `from` and `to` limits for the current page.
      */
     pageSize: {
       type: Number,
       default: 0
     },
     /**
-     * Whether the pagination is loading.
+     * Whether the pagination data is loading.
+     * When true, shows a skeleton loader instead of the info text.
      */
     loading: {
       type: Boolean,
@@ -56,7 +60,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         __props.count ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
           createTextVNode("Showing " + toDisplayString(from.value) + " to " + toDisplayString(to.value) + " of " + toDisplayString(__props.count) + " results", 1)
         ], 64)) : renderSlot(_ctx.$slots, "no-results", { key: 1 }, () => [
-          _cache[0] || (_cache[0] = createTextVNode("No results found"))
+          _cache[0] || (_cache[0] = createTextVNode("No results found", -1))
         ])
       ]));
     };