@pequity/squirrel 8.4.4 → 8.4.5

package/squirrel/components/p-textarea/p-textarea.vue

@@ -15,30 +15,72 @@ import { type Size, SIZES } from '@squirrel/components/p-btn/p-btn.types';
 import { useInputClasses } from '@squirrel/composables/useInputClasses';
 import { computed, type PropType, type StyleValue, useAttrs } from 'vue';
 
+/**
+ * A textarea component for multi-line text input.
+ * Provides consistent styling and behavior with other form components.
+ * Supports custom labels, error states, and various sizes.
+ *
+ * @displayName PTextarea
+ */
 defineOptions({
   name: 'PTextarea',
   inheritAttrs: false,
 });
 
-const emit = defineEmits(['update:modelValue']);
+const emit = defineEmits<{
+  /**
+   * Emitted when the textarea value changes.
+   * @param {string} value - The new textarea value
+   */
+  'update:modelValue': [value: string];
+}>();
+
+defineSlots<{
+  /**
+   * Custom label content - overrides the label prop.
+   * @param {string} label - The label text
+   * @param {string} label-classes - CSS classes for the label
+   */
+  label?: (props: { label: string; labelClasses: string }) => unknown;
+}>();
 
 const props = defineProps({
+  /**
+   * The current value of the textarea (v-model).
+   * Supports two-way binding for form inputs.
+   */
   modelValue: {
     type: [String, Number, null] as PropType<string | number | null>,
     default: '',
   },
+  /**
+   * Text label for the textarea field.
+   * If not provided, you can use the label slot instead.
+   */
   label: {
     type: String,
     default: '',
   },
+  /**
+   * Error message to display below the textarea.
+   * When provided, the textarea will show error styling.
+   */
   errorMsg: {
     type: String,
     default: '',
   },
+  /**
+   * Whether the textarea is required.
+   * Adds required attribute and visual indicator.
+   */
   required: {
     type: Boolean,
     default: false,
   },
+  /**
+   * The size of the textarea - affects padding, font size, and spacing.
+   * Valid values: 'sm', 'md', 'lg'
+   */
   size: {
     type: String as PropType<Size>,
     default: 'md',

package/squirrel/components/p-toggle/p-toggle.vue

@@ -56,30 +56,73 @@ const TOGGLE_CLASSES = [
 </script>
 
 <script setup lang="ts">
+/**
+ * A toggle switch component that provides a modern switch interface.
+ * Supports different sizes, labels, error states, and accessibility features.
+ * Uses a checkbox input with custom styling for the toggle appearance.
+ *
+ * @displayName PToggle
+ */
 defineOptions({
   name: 'PToggle',
   inheritAttrs: false,
 });
 
-const emit = defineEmits(['update:modelValue']);
+defineSlots<{
+  /**
+   * Custom label content - overrides the label prop.
+   * @param {string} label - The label text
+   * @param {string} label-classes - CSS classes for the label
+   */
+  label?: (props: { label: string; labelClasses: string }) => unknown;
+}>();
+
+const emit = defineEmits<{
+  /**
+   * Emitted when the toggle state changes.
+   * @param {boolean} value - The new toggle state
+   */
+  'update:modelValue': [value: boolean];
+}>();
 
 const props = defineProps({
+  /**
+   * 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 as PropType<Size>,
     default: 'md',

package/squirrel/assets/pagination-left-icon.svg

@@ -1,5 +0,0 @@
-<svg width="8" height="12" viewBox="0 0 8 12" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <path
-    d="M0.25 5.99968C0.25 5.64968 0.4 5.34968 0.65 5.14968L6.25 0.249681C6.65 -0.100319 7.2 -0.0503187 7.55 0.349681C7.85 0.749681 7.85 1.29968 7.45 1.59968L2.55 5.89968C2.5 5.94968 2.5 5.99968 2.55 6.04968L7.45 10.3497C7.85 10.6997 7.9 11.2497 7.55 11.6497C7.2 12.0497 6.65 12.0997 6.25 11.7497C6.25 11.7497 6.25 11.7497 6.2 11.6997L0.65 6.84968C0.4 6.64968 0.25 6.29968 0.25 5.99968Z"
-    fill="#918da1" />
-</svg>

package/squirrel/assets/pagination-right-icon.svg

@@ -1,5 +0,0 @@
-<svg width="8" height="14" viewBox="0 0 8 14" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <path
-    d="M7.75695 6.98136C7.75695 7.33136 7.60695 7.63136 7.35695 7.83136L1.75695 12.7814C1.35695 13.1314 0.756947 13.0814 0.456947 12.6814C0.156947 12.2814 0.156947 11.7314 0.556947 11.3814L5.45695 7.08136C5.50695 7.03136 5.50695 6.98136 5.45695 6.88136L0.556947 2.58136C0.156947 2.23136 0.156947 1.63136 0.506947 1.28136C0.856947 0.931361 1.40695 0.881361 1.80695 1.18136L7.40695 6.08136C7.60695 6.33136 7.75695 6.63136 7.75695 6.98136Z"
-    fill="#918da1" />
-</svg>