@pequity/squirrel 8.4.4 → 8.4.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (151) hide show
  1. package/README.md +2 -1
  2. package/dist/cjs/chunks/p-alert.js +3 -0
  3. package/dist/cjs/chunks/p-avatar.js +16 -0
  4. package/dist/cjs/chunks/p-btn.js +3 -0
  5. package/dist/cjs/chunks/p-card.js +4 -0
  6. package/dist/cjs/chunks/p-dropdown-select.js +34 -0
  7. package/dist/cjs/chunks/p-input-number.js +32 -0
  8. package/dist/cjs/chunks/p-input-percent.js +13 -2
  9. package/dist/cjs/chunks/p-input.js +28 -0
  10. package/dist/cjs/chunks/p-pagination-info.js +9 -5
  11. package/dist/cjs/chunks/p-pagination.js +23 -13
  12. package/dist/cjs/chunks/p-select-btn.js +2 -1
  13. package/dist/cjs/chunks/p-select.js +33 -0
  14. package/dist/cjs/chunks/p-table-loader.js +20 -0
  15. package/dist/cjs/chunks/p-tabs.js +12 -0
  16. package/dist/cjs/chunks/p-textarea.js +20 -0
  17. package/dist/cjs/index.js +40 -3
  18. package/dist/cjs/p-checkbox.js +8 -1
  19. package/dist/cjs/p-chips.js +17 -1
  20. package/dist/cjs/p-close-btn.js +6 -1
  21. package/dist/cjs/p-drawer.js +90 -2
  22. package/dist/cjs/p-dropdown.js +2 -1
  23. package/dist/cjs/p-input-search.js +13 -1
  24. package/dist/cjs/p-loading.js +1 -1
  25. package/dist/cjs/p-modal.js +82 -2
  26. package/dist/cjs/p-select-pill.js +36 -2
  27. package/dist/cjs/p-skeleton-loader.js +17 -1
  28. package/dist/cjs/p-table-filter-icon.js +4 -1
  29. package/dist/cjs/p-table-header-cell.js +29 -0
  30. package/dist/cjs/p-table-td.js +1 -1
  31. package/dist/cjs/p-toggle.js +22 -1
  32. package/dist/es/chunks/p-alert.js +3 -0
  33. package/dist/es/chunks/p-avatar.js +16 -0
  34. package/dist/es/chunks/p-btn.js +3 -0
  35. package/dist/es/chunks/p-card.js +4 -0
  36. package/dist/es/chunks/p-dropdown-select.js +34 -0
  37. package/dist/es/chunks/p-input-number.js +32 -0
  38. package/dist/es/chunks/p-input-percent.js +13 -2
  39. package/dist/es/chunks/p-input.js +28 -0
  40. package/dist/es/chunks/p-pagination-info.js +9 -5
  41. package/dist/es/chunks/p-pagination.js +24 -14
  42. package/dist/es/chunks/p-select-btn.js +2 -1
  43. package/dist/es/chunks/p-select.js +33 -0
  44. package/dist/es/chunks/p-table-loader.js +20 -0
  45. package/dist/es/chunks/p-tabs.js +12 -0
  46. package/dist/es/chunks/p-textarea.js +20 -0
  47. package/dist/es/index.js +40 -3
  48. package/dist/es/p-checkbox.js +8 -1
  49. package/dist/es/p-chips.js +17 -1
  50. package/dist/es/p-close-btn.js +6 -1
  51. package/dist/es/p-drawer.js +90 -2
  52. package/dist/es/p-dropdown.js +2 -1
  53. package/dist/es/p-input-search.js +13 -1
  54. package/dist/es/p-loading.js +1 -1
  55. package/dist/es/p-modal.js +82 -2
  56. package/dist/es/p-select-pill.js +36 -2
  57. package/dist/es/p-skeleton-loader.js +17 -1
  58. package/dist/es/p-table-filter-icon.js +4 -1
  59. package/dist/es/p-table-header-cell.js +29 -0
  60. package/dist/es/p-table-td.js +1 -1
  61. package/dist/es/p-toggle.js +22 -1
  62. package/dist/squirrel/components/p-action-bar/p-action-bar.vue.d.ts +14 -2
  63. package/dist/squirrel/components/p-alert/p-alert.vue.d.ts +16 -3
  64. package/dist/squirrel/components/p-avatar/p-avatar.vue.d.ts +35 -0
  65. package/dist/squirrel/components/p-btn/p-btn.vue.d.ts +18 -2
  66. package/dist/squirrel/components/p-card/p-card.vue.d.ts +20 -7
  67. package/dist/squirrel/components/p-checkbox/p-checkbox.vue.d.ts +25 -7
  68. package/dist/squirrel/components/p-chips/p-chips.vue.d.ts +24 -0
  69. package/dist/squirrel/components/p-close-btn/p-close-btn.vue.d.ts +13 -0
  70. package/dist/squirrel/components/p-date-picker/p-date-picker.vue.d.ts +16 -0
  71. package/dist/squirrel/components/p-drawer/p-drawer.vue.d.ts +141 -3
  72. package/dist/squirrel/components/p-dropdown/p-dropdown.vue.d.ts +11 -2
  73. package/dist/squirrel/components/p-dropdown-select/p-dropdown-select.vue.d.ts +69 -1
  74. package/dist/squirrel/components/p-file-upload/p-file-upload.vue.d.ts +70 -6
  75. package/dist/squirrel/components/p-icon/p-icon.vue.d.ts +4 -0
  76. package/dist/squirrel/components/p-info-icon/p-info-icon.vue.d.ts +11 -4
  77. package/dist/squirrel/components/p-inline-date-picker/p-inline-date-picker.vue.d.ts +27 -7
  78. package/dist/squirrel/components/p-input/p-input.vue.d.ts +73 -8
  79. package/dist/squirrel/components/p-input-number/p-input-number.vue.d.ts +83 -12
  80. package/dist/squirrel/components/p-input-percent/p-input-percent.vue.d.ts +22 -2
  81. package/dist/squirrel/components/p-input-search/p-input-search.vue.d.ts +24 -0
  82. package/dist/squirrel/components/p-modal/p-modal.vue.d.ts +185 -15
  83. package/dist/squirrel/components/p-pagination/p-pagination.vue.d.ts +22 -12
  84. package/dist/squirrel/components/p-pagination-info/p-pagination-info.vue.d.ts +16 -8
  85. package/dist/squirrel/components/p-progress-bar/p-progress-bar.vue.d.ts +20 -0
  86. package/dist/squirrel/components/p-ring-loader/p-ring-loader.vue.d.ts +10 -0
  87. package/dist/squirrel/components/p-select/p-select.vue.d.ts +76 -6
  88. package/dist/squirrel/components/p-select-btn/p-select-btn.vue.d.ts +67 -10
  89. package/dist/squirrel/components/p-select-list/p-select-list.vue.d.ts +1 -1
  90. package/dist/squirrel/components/p-select-pill/p-select-pill.vue.d.ts +72 -2
  91. package/dist/squirrel/components/p-skeleton-loader/p-skeleton-loader.vue.d.ts +40 -0
  92. package/dist/squirrel/components/p-steps/p-steps.vue.d.ts +12 -0
  93. package/dist/squirrel/components/p-table/p-table.vue.d.ts +32 -0
  94. package/dist/squirrel/components/p-table-header-cell/p-table-filter-icon.vue.d.ts +6 -0
  95. package/dist/squirrel/components/p-table-header-cell/p-table-header-cell.vue.d.ts +56 -1
  96. package/dist/squirrel/components/p-table-loader/p-table-loader.vue.d.ts +40 -0
  97. package/dist/squirrel/components/p-table-sort/p-table-sort.vue.d.ts +12 -2
  98. package/dist/squirrel/components/p-table-td/p-table-td.vue.d.ts +12 -0
  99. package/dist/squirrel/components/p-tabs/p-tabs.vue.d.ts +33 -2
  100. package/dist/squirrel/components/p-tabs-pills/p-tabs-pills.vue.d.ts +22 -0
  101. package/dist/squirrel/components/p-textarea/p-textarea.vue.d.ts +52 -8
  102. package/dist/squirrel/components/p-toggle/p-toggle.vue.d.ts +50 -3
  103. package/dist/squirrel.css +68 -68
  104. package/package.json +15 -15
  105. package/squirrel/components/p-action-bar/p-action-bar.stories.js +5 -5
  106. package/squirrel/components/p-action-bar/p-action-bar.vue +30 -3
  107. package/squirrel/components/p-alert/p-alert.vue +24 -0
  108. package/squirrel/components/p-avatar/p-avatar.vue +28 -0
  109. package/squirrel/components/p-btn/p-btn.vue +35 -0
  110. package/squirrel/components/p-card/p-card.vue +24 -1
  111. package/squirrel/components/p-checkbox/p-checkbox.vue +23 -1
  112. package/squirrel/components/p-chips/p-chips.vue +24 -0
  113. package/squirrel/components/p-close-btn/p-close-btn.vue +15 -0
  114. package/squirrel/components/p-date-picker/p-date-picker.vue +23 -1
  115. package/squirrel/components/p-drawer/p-drawer.vue +95 -0
  116. package/squirrel/components/p-dropdown/p-dropdown.vue +12 -1
  117. package/squirrel/components/p-dropdown-select/p-dropdown-select.vue +41 -0
  118. package/squirrel/components/p-file-upload/p-file-upload.vue +58 -3
  119. package/squirrel/components/p-icon/p-icon.vue +16 -0
  120. package/squirrel/components/p-info-icon/p-info-icon.vue +19 -0
  121. package/squirrel/components/p-inline-date-picker/p-inline-date-picker.vue +32 -0
  122. package/squirrel/components/p-input/p-input.vue +61 -1
  123. package/squirrel/components/p-input-number/p-input-number.vue +78 -1
  124. package/squirrel/components/p-input-percent/p-input-percent.vue +27 -3
  125. package/squirrel/components/p-input-search/p-input-search.vue +30 -2
  126. package/squirrel/components/p-link/p-link.vue +13 -0
  127. package/squirrel/components/p-loading/p-loading.vue +9 -2
  128. package/squirrel/components/p-modal/p-modal.vue +138 -2
  129. package/squirrel/components/p-pagination/p-pagination.vue +28 -8
  130. package/squirrel/components/p-pagination-info/p-pagination-info.vue +16 -4
  131. package/squirrel/components/p-progress-bar/p-progress-bar.vue +31 -4
  132. package/squirrel/components/p-ring-loader/p-ring-loader.vue +17 -0
  133. package/squirrel/components/p-select/p-select.vue +50 -1
  134. package/squirrel/components/p-select-btn/p-select-btn.vue +90 -2
  135. package/squirrel/components/p-select-list/p-select-list.vue +7 -0
  136. package/squirrel/components/p-select-pill/p-select-pill.vue +52 -2
  137. package/squirrel/components/p-skeleton-loader/p-skeleton-loader.vue +24 -0
  138. package/squirrel/components/p-steps/p-steps.vue +25 -0
  139. package/squirrel/components/p-table/p-table.vue +39 -0
  140. package/squirrel/components/p-table-header-cell/p-table-filter-icon.vue +9 -0
  141. package/squirrel/components/p-table-header-cell/p-table-header-cell.vue +36 -0
  142. package/squirrel/components/p-table-loader/p-table-loader.vue +28 -0
  143. package/squirrel/components/p-table-sort/p-table-sort.vue +19 -1
  144. package/squirrel/components/p-table-td/p-table-td.vue +20 -0
  145. package/squirrel/components/p-tabs/p-tabs.stories.js +2 -2
  146. package/squirrel/components/p-tabs/p-tabs.vue +33 -1
  147. package/squirrel/components/p-tabs-pills/p-tabs-pills.vue +33 -0
  148. package/squirrel/components/p-textarea/p-textarea.vue +43 -1
  149. package/squirrel/components/p-toggle/p-toggle.vue +44 -1
  150. package/squirrel/assets/pagination-left-icon.svg +0 -5
  151. package/squirrel/assets/pagination-right-icon.svg +0 -5
@@ -1,80 +1,90 @@
1
1
  import { type PropType } from 'vue';
2
2
  declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
3
3
  /**
4
- * The current page.
4
+ * The current page number (v-model).
5
+ * Controls which page is visually active and navigable.
5
6
  */
6
7
  modelValue: {
7
8
  type: PropType<number | null>;
8
9
  default: null;
9
10
  };
10
11
  /**
11
- * The amount of data pagination should iterate through.
12
+ * The total amount of items to paginate through.
13
+ * Used to calculate the total number of pages.
12
14
  */
13
15
  count: {
14
16
  type: NumberConstructor;
15
17
  default: number;
16
18
  };
17
19
  /**
18
- * The amount of data to be displayed at 1 page. Used to calculate the length of pagination.
20
+ * The number of items to display per page.
21
+ * Used to calculate the total number of pages.
19
22
  */
20
23
  pageSize: {
21
24
  type: NumberConstructor;
22
25
  default: number;
23
26
  };
24
27
  /**
25
- * The amount of pages to be displayed before and after the current page.
28
+ * The number of pages to show before and after the current page.
29
+ * Controls the range of page numbers displayed around the current page.
26
30
  */
27
31
  pageOffset: {
28
32
  type: NumberConstructor;
29
33
  default: number;
30
34
  };
31
35
  /**
32
- * Whether the pagination is loading.
36
+ * Whether the pagination is in a loading state.
37
+ * When true, shows a skeleton loader instead of the pagination controls.
33
38
  */
34
39
  loading: {
35
40
  type: BooleanConstructor;
36
41
  default: boolean;
37
42
  };
38
43
  }>, void, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
39
- "update:modelValue": (...args: any[]) => void;
44
+ "update:modelValue": (value: number) => any;
40
45
  }, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
41
46
  /**
42
- * The current page.
47
+ * The current page number (v-model).
48
+ * Controls which page is visually active and navigable.
43
49
  */
44
50
  modelValue: {
45
51
  type: PropType<number | null>;
46
52
  default: null;
47
53
  };
48
54
  /**
49
- * The amount of data pagination should iterate through.
55
+ * The total amount of items to paginate through.
56
+ * Used to calculate the total number of pages.
50
57
  */
51
58
  count: {
52
59
  type: NumberConstructor;
53
60
  default: number;
54
61
  };
55
62
  /**
56
- * The amount of data to be displayed at 1 page. Used to calculate the length of pagination.
63
+ * The number of items to display per page.
64
+ * Used to calculate the total number of pages.
57
65
  */
58
66
  pageSize: {
59
67
  type: NumberConstructor;
60
68
  default: number;
61
69
  };
62
70
  /**
63
- * The amount of pages to be displayed before and after the current page.
71
+ * The number of pages to show before and after the current page.
72
+ * Controls the range of page numbers displayed around the current page.
64
73
  */
65
74
  pageOffset: {
66
75
  type: NumberConstructor;
67
76
  default: number;
68
77
  };
69
78
  /**
70
- * Whether the pagination is loading.
79
+ * Whether the pagination is in a loading state.
80
+ * When true, shows a skeleton loader instead of the pagination controls.
71
81
  */
72
82
  loading: {
73
83
  type: BooleanConstructor;
74
84
  default: boolean;
75
85
  };
76
86
  }>> & Readonly<{
77
- "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
87
+ "onUpdate:modelValue"?: ((value: number) => any) | undefined;
78
88
  }>, {
79
89
  loading: boolean;
80
90
  modelValue: number | null;
@@ -4,28 +4,32 @@ type __VLS_Slots = {} & {
4
4
  };
5
5
  declare const __VLS_component: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
6
6
  /**
7
- * The current page.
7
+ * The current page number (1-based).
8
+ * Used to calculate the starting item number in the display range.
8
9
  */
9
10
  currentPage: {
10
11
  type: NumberConstructor;
11
12
  default: number;
12
13
  };
13
14
  /**
14
- * The amount of data pagination iterates through.
15
+ * The total number of items across all pages.
16
+ * Used to calculate the total count and ending item number.
15
17
  */
16
18
  count: {
17
19
  type: NumberConstructor;
18
20
  default: number;
19
21
  };
20
22
  /**
21
- * The amount of data to be displayed at 1 page. Used to calculate the `from` and `to` limits.
23
+ * The number of items displayed per page.
24
+ * Used to calculate the `from` and `to` limits for the current page.
22
25
  */
23
26
  pageSize: {
24
27
  type: NumberConstructor;
25
28
  default: number;
26
29
  };
27
30
  /**
28
- * Whether the pagination is loading.
31
+ * Whether the pagination data is loading.
32
+ * When true, shows a skeleton loader instead of the info text.
29
33
  */
30
34
  loading: {
31
35
  type: BooleanConstructor;
@@ -33,28 +37,32 @@ declare const __VLS_component: import("vue").DefineComponent<import("vue").Extra
33
37
  };
34
38
  }>, void, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
35
39
  /**
36
- * The current page.
40
+ * The current page number (1-based).
41
+ * Used to calculate the starting item number in the display range.
37
42
  */
38
43
  currentPage: {
39
44
  type: NumberConstructor;
40
45
  default: number;
41
46
  };
42
47
  /**
43
- * The amount of data pagination iterates through.
48
+ * The total number of items across all pages.
49
+ * Used to calculate the total count and ending item number.
44
50
  */
45
51
  count: {
46
52
  type: NumberConstructor;
47
53
  default: number;
48
54
  };
49
55
  /**
50
- * The amount of data to be displayed at 1 page. Used to calculate the `from` and `to` limits.
56
+ * The number of items displayed per page.
57
+ * Used to calculate the `from` and `to` limits for the current page.
51
58
  */
52
59
  pageSize: {
53
60
  type: NumberConstructor;
54
61
  default: number;
55
62
  };
56
63
  /**
57
- * Whether the pagination is loading.
64
+ * Whether the pagination data is loading.
65
+ * When true, shows a skeleton loader instead of the info text.
58
66
  */
59
67
  loading: {
60
68
  type: BooleanConstructor;
@@ -1,10 +1,30 @@
1
+ /**
2
+ * Represents a single progress segment with its value, color, and optional label.
3
+ */
1
4
  export type ProgressItem = {
5
+ /**
6
+ * The numeric value of this progress segment.
7
+ */
2
8
  value: number;
9
+ /**
10
+ * The background color for this progress segment.
11
+ */
3
12
  color: string;
13
+ /**
14
+ * Optional label to display on hover tooltip.
15
+ */
4
16
  label?: string;
5
17
  };
6
18
  type Props = {
19
+ /**
20
+ * The total value used to calculate percentage widths.
21
+ * All segment values should sum to this total for accurate representation.
22
+ */
7
23
  total: number;
24
+ /**
25
+ * Array of progress segments to display.
26
+ * Each item represents a portion of the total progress.
27
+ */
8
28
  items: ProgressItem[];
9
29
  };
10
30
  declare const _default: import("vue").DefineComponent<Props, void, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
@@ -1,5 +1,15 @@
1
1
  type Props = {
2
+ /**
3
+ * The size of the ring loader in pixels.
4
+ * Controls the overall dimensions of the spinner.
5
+ * Default: 80px
6
+ */
2
7
  size?: number;
8
+ /**
9
+ * Custom color for the ring loader.
10
+ * Overrides the default blue color when provided.
11
+ * Can be any valid CSS color value.
12
+ */
3
13
  color?: string;
4
14
  };
5
15
  declare const _default: import("vue").DefineComponent<Props, void, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{}>, {
@@ -1,42 +1,79 @@
1
1
  import { type Size } from '../p-btn/p-btn.types';
2
2
  import { type PropType } from 'vue';
3
- declare var __VLS_1: {
4
- label: string;
5
- labelClasses: string;
6
- };
7
- type __VLS_Slots = {} & {
8
- label?: (props: typeof __VLS_1) => any;
3
+ type __VLS_Slots = {
4
+ /**
5
+ * Custom label content - overrides the label prop.
6
+ * @param {string} label - The label text
7
+ * @param {string} label-classes - CSS classes for the label
8
+ */
9
+ label?: (props: {
10
+ label: string;
11
+ labelClasses: string;
12
+ }) => unknown;
9
13
  };
10
14
  declare const __VLS_component: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
15
+ /**
16
+ * The current selected value (v-model).
17
+ * Supports two-way binding for form inputs.
18
+ */
11
19
  modelValue: {
12
20
  type: PropType<string | number | boolean | null>;
13
21
  default: string;
14
22
  };
23
+ /**
24
+ * Array of objects representing the select options.
25
+ * Each object should have properties specified by itemText and itemValue.
26
+ * @example [{ text: 'Option 1', value: 1 }, { text: 'Option 2', value: 2 }]
27
+ */
15
28
  items: {
16
29
  type: PropType<Record<string, unknown>[]>;
17
30
  default: () => never[];
18
31
  };
32
+ /**
33
+ * Text label for the select field.
34
+ * If not provided, you can use the label slot instead.
35
+ */
19
36
  label: {
20
37
  type: StringConstructor;
21
38
  default: string;
22
39
  };
40
+ /**
41
+ * Error message to display below the select.
42
+ * When provided, the select will show error styling.
43
+ */
23
44
  errorMsg: {
24
45
  type: StringConstructor;
25
46
  default: string;
26
47
  };
48
+ /**
49
+ * Whether the select is required.
50
+ * Adds required attribute and visual indicator.
51
+ */
27
52
  required: {
28
53
  type: BooleanConstructor;
29
54
  default: boolean;
30
55
  };
56
+ /**
57
+ * The size of the select - affects padding, font size, and spacing.
58
+ * Valid values: 'sm', 'md', 'lg'
59
+ */
31
60
  size: {
32
61
  type: PropType<Size>;
33
62
  default: string;
34
63
  validator(value: Size): boolean;
35
64
  };
65
+ /**
66
+ * Property name to use as the display text for each option.
67
+ * Defaults to 'text' - each item should have this property.
68
+ */
36
69
  itemText: {
37
70
  type: StringConstructor;
38
71
  default: string;
39
72
  };
73
+ /**
74
+ * Property name to use as the value for each option.
75
+ * Defaults to 'value' - each item should have this property.
76
+ */
40
77
  itemValue: {
41
78
  type: PropType<string | number | boolean | null>;
42
79
  default: string;
@@ -44,35 +81,68 @@ declare const __VLS_component: import("vue").DefineComponent<import("vue").Extra
44
81
  }>, void, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
45
82
  "update:modelValue": (...args: any[]) => void;
46
83
  }, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
84
+ /**
85
+ * The current selected value (v-model).
86
+ * Supports two-way binding for form inputs.
87
+ */
47
88
  modelValue: {
48
89
  type: PropType<string | number | boolean | null>;
49
90
  default: string;
50
91
  };
92
+ /**
93
+ * Array of objects representing the select options.
94
+ * Each object should have properties specified by itemText and itemValue.
95
+ * @example [{ text: 'Option 1', value: 1 }, { text: 'Option 2', value: 2 }]
96
+ */
51
97
  items: {
52
98
  type: PropType<Record<string, unknown>[]>;
53
99
  default: () => never[];
54
100
  };
101
+ /**
102
+ * Text label for the select field.
103
+ * If not provided, you can use the label slot instead.
104
+ */
55
105
  label: {
56
106
  type: StringConstructor;
57
107
  default: string;
58
108
  };
109
+ /**
110
+ * Error message to display below the select.
111
+ * When provided, the select will show error styling.
112
+ */
59
113
  errorMsg: {
60
114
  type: StringConstructor;
61
115
  default: string;
62
116
  };
117
+ /**
118
+ * Whether the select is required.
119
+ * Adds required attribute and visual indicator.
120
+ */
63
121
  required: {
64
122
  type: BooleanConstructor;
65
123
  default: boolean;
66
124
  };
125
+ /**
126
+ * The size of the select - affects padding, font size, and spacing.
127
+ * Valid values: 'sm', 'md', 'lg'
128
+ */
67
129
  size: {
68
130
  type: PropType<Size>;
69
131
  default: string;
70
132
  validator(value: Size): boolean;
71
133
  };
134
+ /**
135
+ * Property name to use as the display text for each option.
136
+ * Defaults to 'text' - each item should have this property.
137
+ */
72
138
  itemText: {
73
139
  type: StringConstructor;
74
140
  default: string;
75
141
  };
142
+ /**
143
+ * Property name to use as the value for each option.
144
+ * Defaults to 'value' - each item should have this property.
145
+ */
76
146
  itemValue: {
77
147
  type: PropType<string | number | boolean | null>;
78
148
  default: string;
@@ -1,32 +1,89 @@
1
1
  import { type Size } from '../p-btn/p-btn.types';
2
+ /**
3
+ * A select button group component that displays multiple buttons as a connected group.
4
+ * Provides a button-based selection interface with support for single/multiple selection,
5
+ * custom styling, tooltips, and flexible item structure.
6
+ *
7
+ * @displayName PSelectBtn
8
+ */
2
9
  type BtnGroupItem = Record<string, string | number | boolean>;
3
10
  type Props = {
4
- modelValue?: string | number | null | BtnGroupItem[];
11
+ /**
12
+ * The current selected value(s) (v-model).
13
+ * For single selection: string, number, boolean, or null
14
+ * For multiple selection: array of BtnGroupItem objects
15
+ */
16
+ modelValue?: string | number | boolean | null | BtnGroupItem[];
17
+ /**
18
+ * Array of items to display as buttons.
19
+ * Each item should have properties matching itemValue, itemText, and itemTooltipText.
20
+ */
5
21
  items?: BtnGroupItem[] | readonly BtnGroupItem[];
22
+ /**
23
+ * Property name to use as the item value.
24
+ * Used for selection comparison and v-model binding.
25
+ */
6
26
  itemValue?: string | number;
27
+ /**
28
+ * Property name to use as the item display text.
29
+ * Used for button label content.
30
+ */
7
31
  itemText?: string;
32
+ /**
33
+ * Property name to use as the item tooltip text.
34
+ * Used when showTooltip is enabled.
35
+ */
8
36
  itemTooltipText?: string;
37
+ /**
38
+ * The size of the buttons in the group.
39
+ * Valid values: 'sm', 'md', 'lg'
40
+ */
9
41
  size?: Size;
42
+ /**
43
+ * Whether to show tooltips on button hover.
44
+ * Uses the itemTooltipText property for tooltip content.
45
+ */
10
46
  showTooltip?: boolean;
47
+ /**
48
+ * Whether to highlight selected buttons visually.
49
+ * Applies selected styling to chosen buttons.
50
+ */
11
51
  highlightSelected?: boolean;
52
+ /**
53
+ * Whether buttons should grow to fill available space.
54
+ * Makes all buttons equal width within the container.
55
+ */
12
56
  grow?: boolean;
57
+ /**
58
+ * Whether multiple items can be selected simultaneously.
59
+ * When true, modelValue becomes an array of selected items.
60
+ */
13
61
  multiple?: boolean;
62
+ /**
63
+ * Whether to remove padding from button containers.
64
+ * Useful for custom spacing control.
65
+ */
14
66
  noPadding?: boolean;
15
67
  };
16
- declare var __VLS_9: `btn-${number}`, __VLS_10: {
17
- item: BtnGroupItem;
18
- isSelected: boolean | undefined;
19
- };
20
- type __VLS_Slots = {} & {
21
- [K in NonNullable<typeof __VLS_9>]?: (props: typeof __VLS_10) => any;
68
+ type __VLS_Slots = {
69
+ /**
70
+ * Custom content for each button in the group.
71
+ * Overrides the default item text display.
72
+ * @param {BtnGroupItem} item - The current item data
73
+ * @param {boolean} isSelected - Whether the current item is selected
74
+ */
75
+ [key: `btn-${number}`]: (props: {
76
+ item: BtnGroupItem;
77
+ isSelected: boolean;
78
+ }) => unknown;
22
79
  };
23
80
  declare const __VLS_component: import("vue").DefineComponent<Props, void, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
24
- "update:modelValue": (...args: any[]) => void;
81
+ "update:modelValue": (value: string | number | boolean | BtnGroupItem[] | null) => any;
25
82
  }, string, import("vue").PublicProps, Readonly<Props> & Readonly<{
26
- "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
83
+ "onUpdate:modelValue"?: ((value: string | number | boolean | BtnGroupItem[] | null) => any) | undefined;
27
84
  }>, {
28
85
  size: Size;
29
- modelValue: string | number | null | BtnGroupItem[];
86
+ modelValue: string | number | boolean | null | BtnGroupItem[];
30
87
  items: BtnGroupItem[] | readonly BtnGroupItem[];
31
88
  itemText: string;
32
89
  itemValue: string | number;
@@ -263,13 +263,13 @@ declare const __VLS_component: import("vue").DefineComponent<import("vue").Extra
263
263
  "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
264
264
  }>, {
265
265
  size: "sm" | "md" | "lg";
266
+ placeholder: string;
266
267
  label: string;
267
268
  required: boolean;
268
269
  modelValue: ModelValue;
269
270
  items: AnyValue[] | AnyObject[];
270
271
  itemText: string;
271
272
  errorMsg: string;
272
- placeholder: string;
273
273
  valueIsObject: boolean;
274
274
  itemValue: string | number;
275
275
  itemSize: number;
@@ -1,8 +1,15 @@
1
1
  import { type PropType } from 'vue';
2
+ /**
3
+ * Represents a single option in the select pill component.
4
+ */
2
5
  type Option = Record<string, unknown> & {
6
+ /** Display text for the option */
3
7
  text: string;
8
+ /** Optional subtext displayed below the main text */
4
9
  subtext?: string;
10
+ /** Unique value identifier for the option */
5
11
  value: string | number;
12
+ /** Whether the option is disabled and cannot be selected */
6
13
  disabled?: boolean;
7
14
  };
8
15
  declare const SIZES: {
@@ -11,27 +18,59 @@ declare const SIZES: {
11
18
  lg: string;
12
19
  };
13
20
  type Size = keyof typeof SIZES;
21
+ /**
22
+ * A select pill component that displays options as connected buttons with a sliding indicator.
23
+ * Provides a pill-style selection interface with smooth animations and visual feedback.
24
+ * The active option is highlighted with a sliding background indicator.
25
+ *
26
+ * @displayName PSelectPill
27
+ */
14
28
  declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
29
+ /**
30
+ * The currently selected value (v-model).
31
+ * Should match one of the item values in the items array.
32
+ */
15
33
  modelValue: {
16
34
  type: (StringConstructor | NumberConstructor)[];
17
35
  default: string;
18
36
  };
37
+ /**
38
+ * Array of options to display as pills.
39
+ * Each option should have text, value, and optional subtext and disabled properties.
40
+ */
19
41
  items: {
20
42
  type: PropType<Option[] | [] | undefined | null>;
21
43
  default: () => never[];
22
44
  };
45
+ /**
46
+ * Property name to use as the item display text.
47
+ * Used for button label content.
48
+ */
23
49
  itemText: {
24
50
  type: StringConstructor;
25
51
  default: string;
26
52
  };
53
+ /**
54
+ * Property name to use as the item subtext.
55
+ * Displayed below the main text when provided.
56
+ */
27
57
  itemSubtext: {
28
58
  type: StringConstructor;
29
59
  default: string;
30
60
  };
61
+ /**
62
+ * Property name to use as the item value.
63
+ * Used for selection comparison and v-model binding.
64
+ */
31
65
  itemValue: {
32
66
  type: (StringConstructor | NumberConstructor)[];
33
67
  default: string;
34
68
  };
69
+ /**
70
+ * The size of the pill buttons.
71
+ * Valid values: 'sm', 'md', 'lg'
72
+ * @values sm, md, lg
73
+ */
35
74
  size: {
36
75
  type: PropType<Size>;
37
76
  default: string;
@@ -47,34 +86,65 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
47
86
  }, {}, {
48
87
  click(e: Event, option: Option): void;
49
88
  setPillStyle(): void;
50
- }, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "update:modelValue"[], "update:modelValue", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
89
+ }, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
90
+ /**
91
+ * Emitted when the selected value changes.
92
+ * @param {string | number} value - The new selected value
93
+ */
94
+ 'update:modelValue': (value: string | number) => true;
95
+ }, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
96
+ /**
97
+ * The currently selected value (v-model).
98
+ * Should match one of the item values in the items array.
99
+ */
51
100
  modelValue: {
52
101
  type: (StringConstructor | NumberConstructor)[];
53
102
  default: string;
54
103
  };
104
+ /**
105
+ * Array of options to display as pills.
106
+ * Each option should have text, value, and optional subtext and disabled properties.
107
+ */
55
108
  items: {
56
109
  type: PropType<Option[] | [] | undefined | null>;
57
110
  default: () => never[];
58
111
  };
112
+ /**
113
+ * Property name to use as the item display text.
114
+ * Used for button label content.
115
+ */
59
116
  itemText: {
60
117
  type: StringConstructor;
61
118
  default: string;
62
119
  };
120
+ /**
121
+ * Property name to use as the item subtext.
122
+ * Displayed below the main text when provided.
123
+ */
63
124
  itemSubtext: {
64
125
  type: StringConstructor;
65
126
  default: string;
66
127
  };
128
+ /**
129
+ * Property name to use as the item value.
130
+ * Used for selection comparison and v-model binding.
131
+ */
67
132
  itemValue: {
68
133
  type: (StringConstructor | NumberConstructor)[];
69
134
  default: string;
70
135
  };
136
+ /**
137
+ * The size of the pill buttons.
138
+ * Valid values: 'sm', 'md', 'lg'
139
+ * @values sm, md, lg
140
+ */
71
141
  size: {
72
142
  type: PropType<Size>;
73
143
  default: string;
74
144
  validator(value: Size): boolean;
75
145
  };
76
146
  }>> & Readonly<{
77
- "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
147
+ "onUpdate:modelValue"?: ((value: string | number) => any) | undefined;
78
148
  }>, {
79
149
  size: "sm" | "md" | "lg";
80
150
  modelValue: string | number;