@allsrvsonline/vue-component-library 0.3.3 → 0.5.0

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.
package/README.md CHANGED
@@ -23,7 +23,14 @@ npm install @your-org/vue-component-library
23
23
  ### Importing Components
24
24
 
25
25
  ```typescript
26
- import { BaseButton, BaseInput, BaseCard } from '@your-org/vue-component-library'
26
+ import {
27
+ BaseButton,
28
+ BaseInput,
29
+ BaseSelect,
30
+ BaseCard,
31
+ CollapsibleCard,
32
+ BaseDeleteButton
33
+ } from '@your-org/vue-component-library'
27
34
  import '@your-org/vue-component-library/style.css'
28
35
  ```
29
36
 
@@ -86,6 +93,50 @@ const emailError = ref('')
86
93
  - `disabled`: `boolean` (default: `false`)
87
94
  - `required`: `boolean` (default: `false`)
88
95
 
96
+ #### BaseSelect
97
+
98
+ ```vue
99
+ <template>
100
+ <BaseSelect
101
+ v-model="selectedFruit"
102
+ label="Favorite Fruit"
103
+ placeholder="Choose a fruit"
104
+ :options="['Apple', 'Banana', 'Orange']"
105
+ />
106
+
107
+ <BaseSelect
108
+ v-model="selectedCountry"
109
+ label="Country"
110
+ :options="[
111
+ { value: 'us', label: 'United States' },
112
+ { value: 'ca', label: 'Canada' }
113
+ ]"
114
+ :error="countryError"
115
+ />
116
+ </template>
117
+
118
+ <script setup lang="ts">
119
+ import { ref } from 'vue'
120
+ import { BaseSelect } from '@your-org/vue-component-library'
121
+
122
+ const selectedFruit = ref('')
123
+ const selectedCountry = ref('')
124
+ const countryError = ref('')
125
+ </script>
126
+ ```
127
+
128
+ **Props:**
129
+
130
+ - `modelValue`: `string | number` - The select value (v-model)
131
+ - `options`: `SelectOption[]` - Array of options to display
132
+ - `placeholder`: `string` - Placeholder text
133
+ - `disabled`: `boolean` (default: `false`)
134
+ - `required`: `boolean` (default: `false`)
135
+ - `label`: `string` - Select label
136
+ - `error`: `string` - Error message to display
137
+ - `labelField`: `string` (default: `'label'`) - Field name for label when options are objects
138
+ - `valueField`: `string` (default: `'value'`) - Field name for value when options are objects
139
+
89
140
  #### BaseCard
90
141
 
91
142
  ```vue
@@ -104,6 +155,58 @@ import { BaseCard, BaseButton } from '@your-org/vue-component-library'
104
155
  </script>
105
156
  ```
106
157
 
158
+ #### CollapsibleCard
159
+
160
+ ```vue
161
+ <template>
162
+ <CollapsibleCard title="Click to expand" :initiallyCollapsed="false" elevated>
163
+ <p>This content can be toggled</p>
164
+
165
+ <template #footer>
166
+ <BaseButton variant="primary">Action</BaseButton>
167
+ </template>
168
+ </CollapsibleCard>
169
+ </template>
170
+
171
+ <script setup lang="ts">
172
+ import { CollapsibleCard, BaseButton } from '@your-org/vue-component-library'
173
+ </script>
174
+ ```
175
+
176
+ **Props:**
177
+
178
+ - `title`: `string` - Card title
179
+ - `elevated`: `boolean` (default: `false`) - Whether the card has elevated shadow
180
+ - `padding`: `boolean` (default: `true`) - Whether the card has padding
181
+ - `initiallyCollapsed`: `boolean` (default: `true`) - Initial collapsed state
182
+
183
+ #### BaseDeleteButton
184
+
185
+ ```vue
186
+ <template>
187
+ <BaseDeleteButton @click="handleDelete" />
188
+ <BaseDeleteButton size="small" @click="handleDelete" />
189
+ <BaseDeleteButton :disabled="true" @click="handleDelete" />
190
+ </template>
191
+
192
+ <script setup lang="ts">
193
+ import { BaseDeleteButton } from '@your-org/vue-component-library'
194
+
195
+ const handleDelete = () => {
196
+ // Handle delete action
197
+ }
198
+ </script>
199
+ ```
200
+
201
+ **Props:**
202
+
203
+ - `size`: `'small' | 'medium' | 'large'` (default: `'medium'`)
204
+ - `disabled`: `boolean` (default: `false`)
205
+ - `loading`: `boolean` (default: `false`)
206
+ - `fullWidth`: `boolean` (default: `false`)
207
+ - `type`: `'button' | 'submit' | 'reset'` (default: `'button'`)
208
+ - `ariaLabel`: `string` - Accessibility label (default: `'Delete'`)
209
+
107
210
  ### Using Composables
108
211
 
109
212
  ```typescript
@@ -180,7 +283,14 @@ src/
180
283
  │ ├── BaseButton.spec.ts
181
284
  │ ├── BaseInput.vue
182
285
  │ ├── BaseInput.spec.ts
183
- └── BaseCard.vue
286
+ ├── BaseSelect.vue
287
+ │ ├── BaseSelect.spec.ts
288
+ │ ├── BaseCard.vue
289
+ │ ├── BaseCard.spec.ts
290
+ │ ├── CollapsibleCard.vue
291
+ │ ├── CollapsibleCard.spec.ts
292
+ │ ├── BaseDeleteButton.vue
293
+ │ └── BaseDeleteButton.spec.ts
184
294
  ├── composables/ # Composable functions
185
295
  │ ├── useValidation.ts
186
296
  │ └── useClickOutside.ts
package/dist/index.d.ts CHANGED
@@ -4,7 +4,7 @@ import { DefineComponent } from 'vue';
4
4
  import { PublicProps } from 'vue';
5
5
  import { Ref } from 'vue';
6
6
 
7
- declare const __VLS_component: DefineComponent<__VLS_Props, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
7
+ declare const __VLS_component: DefineComponent<__VLS_Props, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
8
8
  click: (event: MouseEvent) => any;
9
9
  }, string, PublicProps, Readonly<__VLS_Props> & Readonly<{
10
10
  onClick?: ((event: MouseEvent) => any) | undefined;
@@ -105,12 +105,12 @@ export declare const BaseButton: __VLS_WithTemplateSlots<typeof __VLS_component,
105
105
  /**
106
106
  * Events emitted by BaseButton
107
107
  */
108
- export declare type BaseButtonEmits = {
108
+ export declare interface BaseButtonEmits {
109
109
  /**
110
110
  * Emitted when button is clicked
111
111
  */
112
- (e: 'click', event: MouseEvent): void;
113
- };
112
+ click: [event: MouseEvent];
113
+ }
114
114
 
115
115
  /**
116
116
  * Props for BaseButton component
@@ -175,7 +175,59 @@ declare interface BaseCardProps {
175
175
  padding?: boolean;
176
176
  }
177
177
 
178
- export declare const BaseInput: DefineComponent<BaseInputProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
178
+ export declare const BaseDeleteButton: DefineComponent<BaseDeleteButtonProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
179
+ click: (event: Event) => any;
180
+ }, string, PublicProps, Readonly<BaseDeleteButtonProps> & Readonly<{
181
+ onClick?: ((event: Event) => any) | undefined;
182
+ }>, {
183
+ size: ButtonSize;
184
+ disabled: boolean;
185
+ fullWidth: boolean;
186
+ loading: boolean;
187
+ type: "button" | "submit" | "reset";
188
+ }, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLButtonElement>;
189
+
190
+ /**
191
+ * BaseDeleteButton - A specialized delete button with trash icon
192
+ *
193
+ * @example
194
+ * ```vue
195
+ * <BaseDeleteButton @click="handleDelete" />
196
+ * ```
197
+ */
198
+ declare interface BaseDeleteButtonProps {
199
+ /**
200
+ * The size of the button
201
+ * @default 'medium'
202
+ */
203
+ size?: ButtonSize;
204
+ /**
205
+ * Whether the button is disabled
206
+ * @default false
207
+ */
208
+ disabled?: boolean;
209
+ /**
210
+ * Whether the button is in loading state
211
+ * @default false
212
+ */
213
+ loading?: boolean;
214
+ /**
215
+ * Whether the button should take full width
216
+ * @default false
217
+ */
218
+ fullWidth?: boolean;
219
+ /**
220
+ * The button type
221
+ * @default 'button'
222
+ */
223
+ type?: 'button' | 'submit' | 'reset';
224
+ /**
225
+ * Accessibility label for screen readers
226
+ */
227
+ ariaLabel?: string;
228
+ }
229
+
230
+ export declare const BaseInput: DefineComponent<BaseInputProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
179
231
  "update:modelValue": (value: string) => any;
180
232
  focus: (event: FocusEvent) => any;
181
233
  blur: (event: FocusEvent) => any;
@@ -193,20 +245,20 @@ required: boolean;
193
245
  /**
194
246
  * Events emitted by BaseInput
195
247
  */
196
- export declare type BaseInputEmits = {
248
+ export declare interface BaseInputEmits {
197
249
  /**
198
250
  * Emitted when value changes (v-model)
199
251
  */
200
- (e: 'update:modelValue', value: string): void;
252
+ 'update:modelValue': [value: string];
201
253
  /**
202
254
  * Emitted when input is focused
203
255
  */
204
- (e: 'focus', event: FocusEvent): void;
256
+ focus: [event: FocusEvent];
205
257
  /**
206
258
  * Emitted when input loses focus
207
259
  */
208
- (e: 'blur', event: FocusEvent): void;
209
- };
260
+ blur: [event: FocusEvent];
261
+ }
210
262
 
211
263
  /**
212
264
  * Props for BaseInput component
@@ -245,7 +297,7 @@ export declare interface BaseInputProps {
245
297
  error?: string;
246
298
  }
247
299
 
248
- export declare const BaseSelect: DefineComponent<BaseSelectProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
300
+ export declare const BaseSelect: DefineComponent<BaseSelectProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
249
301
  "update:modelValue": (value: string) => any;
250
302
  focus: (event: FocusEvent) => any;
251
303
  blur: (event: FocusEvent) => any;
@@ -265,20 +317,20 @@ valueField: string;
265
317
  /**
266
318
  * Events emitted by BaseSelect
267
319
  */
268
- export declare type BaseSelectEmits = {
320
+ export declare interface BaseSelectEmits {
269
321
  /**
270
322
  * Emitted when value changes (v-model)
271
323
  */
272
- (e: 'update:modelValue', value: string): void;
324
+ 'update:modelValue': [value: string];
273
325
  /**
274
326
  * Emitted when select is focused
275
327
  */
276
- (e: 'focus', event: FocusEvent): void;
328
+ focus: [event: FocusEvent];
277
329
  /**
278
330
  * Emitted when select loses focus
279
331
  */
280
- (e: 'blur', event: FocusEvent): void;
281
- };
332
+ blur: [event: FocusEvent];
333
+ }
282
334
 
283
335
  /**
284
336
  * Props for BaseSelect component
@@ -1 +1 @@
1
- :root{--base-button-primary-bg: #3b82f6;--base-button-primary-bg-hover: #2563eb;--base-button-primary-text: white;--base-button-secondary-bg: #6b7280;--base-button-secondary-bg-hover: #4b5563;--base-button-secondary-text: white;--base-button-success-bg: #10b981;--base-button-success-bg-hover: #059669;--base-button-success-text: white;--base-button-danger-bg: #ef4444;--base-button-danger-bg-hover: #dc2626;--base-button-danger-text: white;--base-button-warning-bg: #f59e0b;--base-button-warning-bg-hover: #d97706;--base-button-warning-text: white;--base-button-disabled-opacity: .6;--base-button-loading-opacity: .7}.base-button[data-v-a4a5350a]{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border:none;border-radius:.375rem;font-weight:500;cursor:pointer;transition:all .2s ease-in-out;font-family:inherit;position:relative}.base-button[data-v-a4a5350a]:focus-visible{outline:2px solid currentColor;outline-offset:2px}.base-button--small[data-v-a4a5350a]{padding:.375rem .75rem;font-size:.875rem}.base-button--medium[data-v-a4a5350a]{padding:.5rem 1rem;font-size:1rem}.base-button--large[data-v-a4a5350a]{padding:.75rem 1.5rem;font-size:1.125rem}.base-button--primary[data-v-a4a5350a]{background-color:var(--base-button-primary-bg);color:var(--base-button-primary-text)}.base-button--primary[data-v-a4a5350a]:hover:not(:disabled){background-color:var(--base-button-primary-bg-hover)}.base-button--secondary[data-v-a4a5350a]{background-color:var(--base-button-secondary-bg);color:var(--base-button-secondary-text)}.base-button--secondary[data-v-a4a5350a]:hover:not(:disabled){background-color:var(--base-button-secondary-bg-hover)}.base-button--success[data-v-a4a5350a]{background-color:var(--base-button-success-bg);color:var(--base-button-success-text)}.base-button--success[data-v-a4a5350a]:hover:not(:disabled){background-color:var(--base-button-success-bg-hover)}.base-button--danger[data-v-a4a5350a]{background-color:var(--base-button-danger-bg);color:var(--base-button-danger-text)}.base-button--danger[data-v-a4a5350a]:hover:not(:disabled){background-color:var(--base-button-danger-bg-hover)}.base-button--warning[data-v-a4a5350a]{background-color:var(--base-button-warning-bg);color:var(--base-button-warning-text)}.base-button--warning[data-v-a4a5350a]:hover:not(:disabled){background-color:var(--base-button-warning-bg-hover)}.base-button--full-width[data-v-a4a5350a]{width:100%}.base-button--disabled[data-v-a4a5350a],.base-button[data-v-a4a5350a]:disabled{opacity:var(--base-button-disabled-opacity);cursor:not-allowed}.base-button--loading[data-v-a4a5350a]{cursor:wait}.base-button__spinner[data-v-a4a5350a]{width:1em;height:1em;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:spin-a4a5350a .6s linear infinite}.base-button__content--loading[data-v-a4a5350a]{opacity:var(--base-button-loading-opacity)}@keyframes spin-a4a5350a{to{transform:rotate(360deg)}}:root{--base-input-label-color: #374151;--base-input-required-color: #ef4444;--base-input-border: #d1d5db;--base-input-border-focus: #3b82f6;--base-input-border-error: #ef4444;--base-input-bg-disabled: #f3f4f6;--base-input-placeholder-color: #9ca3af;--base-input-focus-shadow: 0 0 0 3px rgba(59, 130, 246, .1);--base-input-error-focus-shadow: 0 0 0 3px rgba(239, 68, 68, .1);--base-input-error-color: #ef4444;--base-input-disabled-opacity: .6}.base-input[data-v-52f8a6e5]{display:flex;flex-direction:column;gap:.375rem}.base-input__label[data-v-52f8a6e5]{font-size:.875rem;font-weight:500;color:var(--base-input-label-color)}.base-input__required[data-v-52f8a6e5]{color:var(--base-input-required-color)}.base-input__field[data-v-52f8a6e5]{padding:.5rem .75rem;font-size:1rem;border:1px solid var(--base-input-border);border-radius:.375rem;transition:all .2s ease-in-out;font-family:inherit}.base-input__field[data-v-52f8a6e5]:focus{outline:none;border-color:var(--base-input-border-focus);box-shadow:var(--base-input-focus-shadow)}.base-input__field[data-v-52f8a6e5]::placeholder{color:var(--base-input-placeholder-color)}.base-input__field--error[data-v-52f8a6e5]{border-color:var(--base-input-border-error)}.base-input__field--error[data-v-52f8a6e5]:focus{border-color:var(--base-input-border-error);box-shadow:var(--base-input-error-focus-shadow)}.base-input__field--disabled[data-v-52f8a6e5],.base-input__field[data-v-52f8a6e5]:disabled{background-color:var(--base-input-bg-disabled);cursor:not-allowed;opacity:var(--base-input-disabled-opacity)}.base-input__error[data-v-52f8a6e5]{font-size:.875rem;color:var(--base-input-error-color)}:root{--base-select-label-color: #374151;--base-select-required-color: #ef4444;--base-select-border: #d1d5db;--base-select-border-focus: #3b82f6;--base-select-border-error: #ef4444;--base-select-bg: #ffffff;--base-select-bg-disabled: #f3f4f6;--base-select-arrow: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e");--base-select-focus-shadow: 0 0 0 3px rgba(59, 130, 246, .1);--base-select-error-focus-shadow: 0 0 0 3px rgba(239, 68, 68, .1);--base-select-error-color: #ef4444;--base-select-disabled-opacity: .6}.base-select[data-v-4d5c982a]{display:flex;flex-direction:column;gap:.375rem}.base-select__label[data-v-4d5c982a]{font-size:.875rem;font-weight:500;color:var(--base-select-label-color)}.base-select__required[data-v-4d5c982a]{color:var(--base-select-required-color)}.base-select__field[data-v-4d5c982a]{padding:.5rem 2rem .5rem .75rem;font-size:1rem;border:1px solid var(--base-select-border);border-radius:.375rem;transition:all .2s ease-in-out;font-family:inherit;background-color:var(--base-select-bg);background-image:var(--base-select-arrow);background-position:right .5rem center;background-repeat:no-repeat;background-size:1.25rem;appearance:none;cursor:pointer}.base-select__field[data-v-4d5c982a]:focus{outline:none;border-color:var(--base-select-border-focus);box-shadow:var(--base-select-focus-shadow)}.base-select__field--error[data-v-4d5c982a]{border-color:var(--base-select-border-error)}.base-select__field--error[data-v-4d5c982a]:focus{border-color:var(--base-select-border-error);box-shadow:var(--base-select-error-focus-shadow)}.base-select__field--disabled[data-v-4d5c982a],.base-select__field[data-v-4d5c982a]:disabled{background-color:var(--base-select-bg-disabled);cursor:not-allowed;opacity:var(--base-select-disabled-opacity)}.base-select__error[data-v-4d5c982a]{font-size:.875rem;color:var(--base-select-error-color)}:root{--base-card-bg: white;--base-card-footer-bg: #f9fafb;--base-card-border: #e5e7eb;--base-card-title-color: #111827;--base-card-shadow: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -1px rgba(0, 0, 0, .06)}.base-card[data-v-80b8fdda]{background-color:var(--base-card-bg);border-radius:.5rem;border:1px solid var(--base-card-border);overflow:hidden}.base-card--elevated[data-v-80b8fdda]{box-shadow:var(--base-card-shadow);border:none}.base-card__header[data-v-80b8fdda]{padding:1rem 1.5rem;border-bottom:1px solid var(--base-card-border)}.base-card__title[data-v-80b8fdda]{margin:0;font-size:1.125rem;font-weight:600;color:var(--base-card-title-color)}.base-card__body[data-v-80b8fdda]{padding:1.5rem}.base-card--no-padding .base-card__body[data-v-80b8fdda]{padding:0}.base-card__footer[data-v-80b8fdda]{padding:1rem 1.5rem;border-top:1px solid var(--base-card-border);background-color:var(--base-card-footer-bg)}:root{--collapsible-card-bg: white;--collapsible-card-footer-bg: #f9fafb;--collapsible-card-header-hover-bg: #f9fafb;--collapsible-card-toggle-hover-bg: #e5e7eb;--collapsible-card-border: #e5e7eb;--collapsible-card-title-color: #111827;--collapsible-card-icon-color: #6b7280;--collapsible-card-focus-ring: #3b82f6;--collapsible-card-shadow: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -1px rgba(0, 0, 0, .06)}.collapsible-card[data-v-14982384]{background-color:var(--collapsible-card-bg);border-radius:.5rem;border:1px solid var(--collapsible-card-border);overflow:hidden}.collapsible-card--elevated[data-v-14982384]{box-shadow:var(--collapsible-card-shadow);border:none}.collapsible-card__header[data-v-14982384]{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.5rem;border-bottom:1px solid var(--collapsible-card-border);cursor:pointer;-webkit-user-select:none;user-select:none;transition:background-color .2s ease}.collapsible-card__header[data-v-14982384]:hover{background-color:var(--collapsible-card-header-hover-bg)}.collapsible-card__header-content[data-v-14982384]{flex:1}.collapsible-card__title[data-v-14982384]{margin:0;font-size:1.125rem;font-weight:600;color:var(--collapsible-card-title-color)}.collapsible-card__toggle[data-v-14982384]{background:none;border:none;padding:.25rem;cursor:pointer;color:var(--collapsible-card-icon-color);display:flex;align-items:center;justify-content:center;border-radius:.25rem;transition:background-color .2s ease}.collapsible-card__toggle[data-v-14982384]:hover{background-color:var(--collapsible-card-toggle-hover-bg)}.collapsible-card__toggle[data-v-14982384]:focus{outline:2px solid var(--collapsible-card-focus-ring);outline-offset:2px}.collapsible-card__icon[data-v-14982384]{transition:transform .2s ease}.collapsible-card__icon--collapsed[data-v-14982384]{transform:rotate(-90deg)}.collapsible-card__body[data-v-14982384]{padding:1.5rem}.collapsible-card--no-padding .collapsible-card__body[data-v-14982384]{padding:0}.collapsible-card__footer[data-v-14982384]{padding:1rem 1.5rem;border-top:1px solid var(--collapsible-card-border);background-color:var(--collapsible-card-footer-bg)}
1
+ :root{--base-button-primary-bg: var(--color-primary);--base-button-primary-bg-hover: var(--color-primary-hover);--base-button-primary-text: var(--color-primary-text);--base-button-secondary-bg: var(--color-secondary);--base-button-secondary-bg-hover: var(--color-secondary-hover);--base-button-secondary-text: var(--color-secondary-text);--base-button-success-bg: var(--color-success);--base-button-success-bg-hover: var(--color-success-hover);--base-button-success-text: var(--color-success-text);--base-button-danger-bg: var(--color-danger);--base-button-danger-bg-hover: var(--color-danger-hover);--base-button-danger-text: var(--color-danger-text);--base-button-warning-bg: var(--color-warning);--base-button-warning-bg-hover: var(--color-warning-hover);--base-button-warning-text: var(--color-warning-text);--base-button-disabled-opacity: var(--opacity-disabled);--base-button-loading-opacity: var(--opacity-loading)}.base-button[data-v-a4a5350a]{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border:none;border-radius:.375rem;font-weight:500;cursor:pointer;transition:all .2s ease-in-out;font-family:inherit;position:relative}.base-button[data-v-a4a5350a]:focus-visible{outline:2px solid currentColor;outline-offset:2px}.base-button--small[data-v-a4a5350a]{padding:.375rem .75rem;font-size:.875rem}.base-button--medium[data-v-a4a5350a]{padding:.5rem 1rem;font-size:1rem}.base-button--large[data-v-a4a5350a]{padding:.75rem 1.5rem;font-size:1.125rem}.base-button--primary[data-v-a4a5350a]{background-color:var(--base-button-primary-bg);color:var(--base-button-primary-text)}.base-button--primary[data-v-a4a5350a]:hover:not(:disabled){background-color:var(--base-button-primary-bg-hover)}.base-button--secondary[data-v-a4a5350a]{background-color:var(--base-button-secondary-bg);color:var(--base-button-secondary-text)}.base-button--secondary[data-v-a4a5350a]:hover:not(:disabled){background-color:var(--base-button-secondary-bg-hover)}.base-button--success[data-v-a4a5350a]{background-color:var(--base-button-success-bg);color:var(--base-button-success-text)}.base-button--success[data-v-a4a5350a]:hover:not(:disabled){background-color:var(--base-button-success-bg-hover)}.base-button--danger[data-v-a4a5350a]{background-color:var(--base-button-danger-bg);color:var(--base-button-danger-text)}.base-button--danger[data-v-a4a5350a]:hover:not(:disabled){background-color:var(--base-button-danger-bg-hover)}.base-button--warning[data-v-a4a5350a]{background-color:var(--base-button-warning-bg);color:var(--base-button-warning-text)}.base-button--warning[data-v-a4a5350a]:hover:not(:disabled){background-color:var(--base-button-warning-bg-hover)}.base-button--full-width[data-v-a4a5350a]{width:100%}.base-button--disabled[data-v-a4a5350a],.base-button[data-v-a4a5350a]:disabled{opacity:var(--base-button-disabled-opacity);cursor:not-allowed}.base-button--loading[data-v-a4a5350a]{cursor:wait}.base-button__spinner[data-v-a4a5350a]{width:1em;height:1em;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:spin-a4a5350a .6s linear infinite}.base-button__content--loading[data-v-a4a5350a]{opacity:var(--base-button-loading-opacity)}@keyframes spin-a4a5350a{to{transform:rotate(360deg)}}:root{--base-input-label-color: var(--input-label-color);--base-input-required-color: var(--input-required-color);--base-input-border: var(--input-border);--base-input-border-focus: var(--input-border-focus);--base-input-border-error: var(--input-border-error);--base-input-bg: var(--input-bg);--base-input-bg-disabled: var(--input-bg-disabled);--base-input-placeholder-color: var(--input-placeholder-color);--base-input-focus-shadow: var(--input-focus-shadow);--base-input-error-focus-shadow: var(--input-error-focus-shadow);--base-input-error-color: var(--input-error-color);--base-input-disabled-opacity: var(--input-disabled-opacity)}.base-input[data-v-eff0ecb9]{display:flex;flex-direction:column;gap:.375rem}.base-input__label[data-v-eff0ecb9]{font-size:.875rem;font-weight:500;color:var(--base-input-label-color)}.base-input__required[data-v-eff0ecb9]{color:var(--base-input-required-color)}.base-input__field[data-v-eff0ecb9]{padding:.5rem .75rem;font-size:1rem;border:1px solid var(--base-input-border);border-radius:.375rem;background-color:var(--base-input-bg);transition:all .2s ease-in-out;font-family:inherit}.base-input__field[data-v-eff0ecb9]:focus{outline:none;border-color:var(--base-input-border-focus);box-shadow:var(--base-input-focus-shadow)}.base-input__field[data-v-eff0ecb9]::placeholder{color:var(--base-input-placeholder-color)}.base-input__field--error[data-v-eff0ecb9]{border-color:var(--base-input-border-error)}.base-input__field--error[data-v-eff0ecb9]:focus{border-color:var(--base-input-border-error);box-shadow:var(--base-input-error-focus-shadow)}.base-input__field--disabled[data-v-eff0ecb9],.base-input__field[data-v-eff0ecb9]:disabled{background-color:var(--base-input-bg-disabled);cursor:not-allowed;opacity:var(--base-input-disabled-opacity)}.base-input__error[data-v-eff0ecb9]{font-size:.875rem;color:var(--base-input-error-color)}:root{--input-label-color: var(--color-text-primary);--input-required-color: var(--color-danger);--input-border: var(--color-border);--input-border-focus: var(--color-border-focus);--input-border-error: var(--color-border-error);--input-bg: var(--color-background);--input-bg-disabled: var(--color-background-disabled);--input-placeholder-color: var(--color-text-muted);--input-focus-shadow: var(--color-focus-shadow);--input-error-focus-shadow: var(--color-error-focus-shadow);--input-error-color: var(--color-danger);--input-disabled-opacity: var(--opacity-disabled)}:root{--base-select-label-color: var(--input-label-color);--base-select-required-color: var(--input-required-color);--base-select-border: var(--input-border);--base-select-border-focus: var(--input-border-focus);--base-select-border-error: var(--input-border-error);--base-select-bg: var(--input-bg);--base-select-bg-disabled: var(--input-bg-disabled);--base-select-focus-shadow: var(--input-focus-shadow);--base-select-error-focus-shadow: var(--input-error-focus-shadow);--base-select-error-color: var(--input-error-color);--base-select-disabled-opacity: var(--input-disabled-opacity)}.base-select[data-v-8a0c8926]{display:flex;flex-direction:column;gap:.375rem}.base-select__label[data-v-8a0c8926]{font-size:.875rem;font-weight:500;color:var(--base-select-label-color)}.base-select__required[data-v-8a0c8926]{color:var(--base-select-required-color)}.base-select__field[data-v-8a0c8926]{padding:.5rem 2rem .5rem .75rem;font-size:1rem;border:1px solid var(--base-select-border);border-radius:.375rem;transition:all .2s ease-in-out;font-family:inherit;background-color:var(--base-select-bg);appearance:none;cursor:pointer;position:relative}.base-select__field[data-v-8a0c8926]:after{content:"";position:absolute;top:50%;right:.75rem;transform:translateY(-50%);width:0;height:0;border-left:.25rem solid transparent;border-right:.25rem solid transparent;border-top:.375rem solid var(--color-arrow);pointer-events:none}.base-select__field[data-v-8a0c8926]:focus{outline:none;border-color:var(--base-select-border-focus);box-shadow:var(--base-select-focus-shadow)}.base-select__field--error[data-v-8a0c8926]{border-color:var(--base-select-border-error)}.base-select__field--error[data-v-8a0c8926]:focus{border-color:var(--base-select-border-error);box-shadow:var(--base-select-error-focus-shadow)}.base-select__field--disabled[data-v-8a0c8926],.base-select__field[data-v-8a0c8926]:disabled{background-color:var(--base-select-bg-disabled);cursor:not-allowed;opacity:var(--base-select-disabled-opacity)}.base-select__error[data-v-8a0c8926]{font-size:.875rem;color:var(--base-select-error-color)}:root{--base-card-bg: var(--color-background);--base-card-footer-bg: var(--color-background-secondary);--base-card-border: var(--color-border);--base-card-title-color: var(--color-text-primary);--base-card-shadow: var(--shadow-md)}.base-card[data-v-80b8fdda]{background-color:var(--base-card-bg);border-radius:.5rem;border:1px solid var(--base-card-border);overflow:hidden}.base-card--elevated[data-v-80b8fdda]{box-shadow:var(--base-card-shadow);border:none}.base-card__header[data-v-80b8fdda]{padding:1rem 1.5rem;border-bottom:1px solid var(--base-card-border)}.base-card__title[data-v-80b8fdda]{margin:0;font-size:1.125rem;font-weight:600;color:var(--base-card-title-color)}.base-card__body[data-v-80b8fdda]{padding:1.5rem}.base-card--no-padding .base-card__body[data-v-80b8fdda]{padding:0}.base-card__footer[data-v-80b8fdda]{padding:1rem 1.5rem;border-top:1px solid var(--base-card-border);background-color:var(--base-card-footer-bg)}:root{--collapsible-card-bg: var(--color-background);--collapsible-card-footer-bg: var(--color-background-secondary);--collapsible-card-header-hover-bg: var(--color-background-secondary);--collapsible-card-toggle-hover-bg: var(--color-gray-200);--collapsible-card-border: var(--color-border);--collapsible-card-title-color: var(--color-text-primary);--collapsible-card-icon-color: var(--color-text-secondary);--collapsible-card-focus-ring: var(--color-focus-ring);--collapsible-card-shadow: var(--shadow-md)}.collapsible-card[data-v-14982384]{background-color:var(--collapsible-card-bg);border-radius:.5rem;border:1px solid var(--collapsible-card-border);overflow:hidden}.collapsible-card--elevated[data-v-14982384]{box-shadow:var(--collapsible-card-shadow);border:none}.collapsible-card__header[data-v-14982384]{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.5rem;border-bottom:1px solid var(--collapsible-card-border);cursor:pointer;-webkit-user-select:none;user-select:none;transition:background-color .2s ease}.collapsible-card__header[data-v-14982384]:hover{background-color:var(--collapsible-card-header-hover-bg)}.collapsible-card__header-content[data-v-14982384]{flex:1}.collapsible-card__title[data-v-14982384]{margin:0;font-size:1.125rem;font-weight:600;color:var(--collapsible-card-title-color)}.collapsible-card__toggle[data-v-14982384]{background:none;border:none;padding:.25rem;cursor:pointer;color:var(--collapsible-card-icon-color);display:flex;align-items:center;justify-content:center;border-radius:.25rem;transition:background-color .2s ease}.collapsible-card__toggle[data-v-14982384]:hover{background-color:var(--collapsible-card-toggle-hover-bg)}.collapsible-card__toggle[data-v-14982384]:focus{outline:2px solid var(--collapsible-card-focus-ring);outline-offset:2px}.collapsible-card__icon[data-v-14982384]{transition:transform .2s ease}.collapsible-card__icon--collapsed[data-v-14982384]{transform:rotate(-90deg)}.collapsible-card__body[data-v-14982384]{padding:1.5rem}.collapsible-card--no-padding .collapsible-card__body[data-v-14982384]{padding:0}.collapsible-card__footer[data-v-14982384]{padding:1rem 1.5rem;border-top:1px solid var(--collapsible-card-border);background-color:var(--collapsible-card-footer-bg)}.base-delete-button[data-v-413ae3e1]{padding:.5rem;min-width:auto;aspect-ratio:1;display:inline-flex;align-items:center;justify-content:center}.base-delete-button__icon[data-v-413ae3e1]{flex-shrink:0}
@@ -1,20 +1,20 @@
1
- import { defineComponent as $, computed as y, createElementBlock as a, openBlock as s, normalizeClass as h, createCommentVNode as c, createElementVNode as r, renderSlot as p, unref as V, createTextVNode as F, toDisplayString as v, Fragment as L, renderList as j, ref as q, withDirectives as w, vShow as E, onMounted as x, onUnmounted as z } from "vue";
2
- function B(...e) {
1
+ import { defineComponent as g, computed as m, createElementBlock as d, openBlock as s, normalizeClass as _, createCommentVNode as r, createElementVNode as u, renderSlot as p, unref as w, createTextVNode as q, toDisplayString as v, Fragment as z, renderList as S, ref as I, withDirectives as L, vShow as x, createBlock as M, withCtx as j, onMounted as D, onUnmounted as E } from "vue";
2
+ function k(...e) {
3
3
  return e.filter(Boolean).join(" ");
4
4
  }
5
- function ue(e, o) {
6
- let l;
7
- return function(...t) {
8
- clearTimeout(l), l = setTimeout(() => e.apply(this, t), o);
5
+ function pe(e, o) {
6
+ let t;
7
+ return function(...l) {
8
+ clearTimeout(t), t = setTimeout(() => e.apply(this, l), o);
9
9
  };
10
10
  }
11
- function S(e = "id") {
11
+ function F(e = "id") {
12
12
  return `${e}-${Math.random().toString(36).substr(2, 9)}`;
13
13
  }
14
- const O = ["disabled", "type"], M = {
14
+ const O = ["disabled", "type"], W = {
15
15
  key: 0,
16
16
  class: "base-button__spinner"
17
- }, N = /* @__PURE__ */ $({
17
+ }, N = /* @__PURE__ */ g({
18
18
  __name: "BaseButton",
19
19
  props: {
20
20
  variant: { default: "primary" },
@@ -26,44 +26,44 @@ const O = ["disabled", "type"], M = {
26
26
  },
27
27
  emits: ["click"],
28
28
  setup(e, { emit: o }) {
29
- const l = e, t = o, d = y(
30
- () => B(
29
+ const t = e, l = o, a = m(
30
+ () => k(
31
31
  "base-button",
32
- `base-button--${l.variant}`,
33
- `base-button--${l.size}`,
34
- l.fullWidth && "base-button--full-width",
35
- l.loading && "base-button--loading",
36
- l.disabled && "base-button--disabled"
32
+ `base-button--${t.variant}`,
33
+ `base-button--${t.size}`,
34
+ t.fullWidth && "base-button--full-width",
35
+ t.loading && "base-button--loading",
36
+ t.disabled && "base-button--disabled"
37
37
  )
38
- ), b = (n) => {
39
- !l.disabled && !l.loading && t("click", n);
38
+ ), c = (n) => {
39
+ !t.disabled && !t.loading && l("click", n);
40
40
  };
41
- return (n, _) => (s(), a("button", {
42
- class: h(d.value),
41
+ return (n, h) => (s(), d("button", {
42
+ class: _(a.value),
43
43
  disabled: e.disabled || e.loading,
44
44
  type: e.type,
45
- onClick: b
45
+ onClick: c
46
46
  }, [
47
- e.loading ? (s(), a("span", M)) : c("", !0),
48
- r("span", {
49
- class: h({ "base-button__content--loading": e.loading })
47
+ e.loading ? (s(), d("span", W)) : r("", !0),
48
+ u("span", {
49
+ class: _({ "base-button__content--loading": e.loading })
50
50
  }, [
51
51
  p(n.$slots, "default", {}, void 0, !0)
52
52
  ], 2)
53
53
  ], 10, O));
54
54
  }
55
- }), C = (e, o) => {
56
- const l = e.__vccOpts || e;
57
- for (const [t, d] of o)
58
- l[t] = d;
59
- return l;
60
- }, be = /* @__PURE__ */ C(N, [["__scopeId", "data-v-a4a5350a"]]), T = { class: "base-input" }, D = ["for"], W = {
55
+ }), B = (e, o) => {
56
+ const t = e.__vccOpts || e;
57
+ for (const [l, a] of o)
58
+ t[l] = a;
59
+ return t;
60
+ }, T = /* @__PURE__ */ B(N, [["__scopeId", "data-v-a4a5350a"]]), H = { class: "base-input" }, U = ["for"], A = {
61
61
  key: 0,
62
62
  class: "base-input__required"
63
- }, U = ["id", "value", "type", "placeholder", "disabled", "required"], A = {
63
+ }, G = ["id", "value", "type", "placeholder", "disabled", "required"], J = {
64
64
  key: 1,
65
65
  class: "base-input__error"
66
- }, G = /* @__PURE__ */ $({
66
+ }, K = /* @__PURE__ */ g({
67
67
  __name: "BaseInput",
68
68
  props: {
69
69
  modelValue: { default: "" },
@@ -76,55 +76,55 @@ const O = ["disabled", "type"], M = {
76
76
  },
77
77
  emits: ["update:modelValue", "focus", "blur"],
78
78
  setup(e, { emit: o }) {
79
- const l = e, t = o, d = S("base-input"), b = y(
80
- () => B(
79
+ const t = e, l = o, a = F("base-input"), c = m(
80
+ () => k(
81
81
  "base-input__field",
82
- l.error && "base-input__field--error",
83
- l.disabled && "base-input__field--disabled"
82
+ t.error && "base-input__field--error",
83
+ t.disabled && "base-input__field--disabled"
84
84
  )
85
85
  ), n = (f) => {
86
- const k = f.target;
87
- t("update:modelValue", k.value);
88
- }, _ = (f) => {
89
- t("focus", f);
90
- }, I = (f) => {
91
- t("blur", f);
86
+ const C = f.target;
87
+ l("update:modelValue", C.value);
88
+ }, h = (f) => {
89
+ l("focus", f);
90
+ }, V = (f) => {
91
+ l("blur", f);
92
92
  };
93
- return (f, k) => (s(), a("div", T, [
94
- e.label ? (s(), a("label", {
93
+ return (f, C) => (s(), d("div", H, [
94
+ e.label ? (s(), d("label", {
95
95
  key: 0,
96
- for: V(d),
96
+ for: w(a),
97
97
  class: "base-input__label"
98
98
  }, [
99
- F(v(e.label) + " ", 1),
100
- e.required ? (s(), a("span", W, "*")) : c("", !0)
101
- ], 8, D)) : c("", !0),
102
- r("input", {
103
- id: V(d),
99
+ q(v(e.label) + " ", 1),
100
+ e.required ? (s(), d("span", A, "*")) : r("", !0)
101
+ ], 8, U)) : r("", !0),
102
+ u("input", {
103
+ id: w(a),
104
104
  value: e.modelValue,
105
105
  type: e.type,
106
106
  placeholder: e.placeholder,
107
107
  disabled: e.disabled,
108
108
  required: e.required,
109
- class: h(b.value),
109
+ class: _(c.value),
110
110
  onInput: n,
111
- onFocus: _,
112
- onBlur: I
113
- }, null, 42, U),
114
- e.error ? (s(), a("span", A, v(e.error), 1)) : c("", !0)
111
+ onFocus: h,
112
+ onBlur: V
113
+ }, null, 42, G),
114
+ e.error ? (s(), d("span", J, v(e.error), 1)) : r("", !0)
115
115
  ]));
116
116
  }
117
- }), fe = /* @__PURE__ */ C(G, [["__scopeId", "data-v-52f8a6e5"]]), H = { class: "base-select" }, J = ["for"], K = {
117
+ }), _e = /* @__PURE__ */ B(K, [["__scopeId", "data-v-eff0ecb9"]]), P = { class: "base-select" }, Q = ["for"], X = {
118
118
  key: 0,
119
119
  class: "base-select__required"
120
- }, P = ["id", "value", "disabled", "required"], Q = {
120
+ }, Y = ["id", "value", "disabled", "required"], Z = {
121
121
  key: 0,
122
122
  value: "",
123
123
  disabled: ""
124
- }, X = ["value"], Y = {
124
+ }, R = ["value"], ee = {
125
125
  key: 1,
126
126
  class: "base-select__error"
127
- }, Z = /* @__PURE__ */ $({
127
+ }, te = /* @__PURE__ */ g({
128
128
  __name: "BaseSelect",
129
129
  props: {
130
130
  modelValue: { default: "" },
@@ -139,67 +139,67 @@ const O = ["disabled", "type"], M = {
139
139
  },
140
140
  emits: ["update:modelValue", "focus", "blur"],
141
141
  setup(e, { emit: o }) {
142
- const l = e, t = o, d = S("base-select"), b = y(
143
- () => B(
142
+ const t = e, l = o, a = F("base-select"), c = m(
143
+ () => k(
144
144
  "base-select__field",
145
- l.error && "base-select__field--error",
146
- l.disabled && "base-select__field--disabled"
145
+ t.error && "base-select__field--error",
146
+ t.disabled && "base-select__field--disabled"
147
147
  )
148
148
  ), n = (i) => {
149
149
  if (typeof i == "object") {
150
- const m = l.valueField || "value", u = i, g = u[m];
151
- return g !== void 0 ? g : u.value ?? "";
150
+ const y = t.valueField || "value", b = i, $ = b[y];
151
+ return $ !== void 0 ? $ : b.value ?? "";
152
152
  }
153
153
  return i;
154
- }, _ = (i) => {
154
+ }, h = (i) => {
155
155
  if (typeof i == "object") {
156
- const m = l.labelField || "label", u = i, g = u[m];
157
- return String(g !== void 0 ? g : u.label ?? "");
156
+ const y = t.labelField || "label", b = i, $ = b[y];
157
+ return String($ !== void 0 ? $ : b.label ?? "");
158
158
  }
159
159
  return String(i);
160
- }, I = (i) => {
161
- const m = i.target;
162
- t("update:modelValue", m.value);
160
+ }, V = (i) => {
161
+ const y = i.target;
162
+ l("update:modelValue", y.value);
163
163
  }, f = (i) => {
164
- t("focus", i);
165
- }, k = (i) => {
166
- t("blur", i);
164
+ l("focus", i);
165
+ }, C = (i) => {
166
+ l("blur", i);
167
167
  };
168
- return (i, m) => (s(), a("div", H, [
169
- e.label ? (s(), a("label", {
168
+ return (i, y) => (s(), d("div", P, [
169
+ e.label ? (s(), d("label", {
170
170
  key: 0,
171
- for: V(d),
171
+ for: w(a),
172
172
  class: "base-select__label"
173
173
  }, [
174
- F(v(e.label) + " ", 1),
175
- e.required ? (s(), a("span", K, "*")) : c("", !0)
176
- ], 8, J)) : c("", !0),
177
- r("select", {
178
- id: V(d),
174
+ q(v(e.label) + " ", 1),
175
+ e.required ? (s(), d("span", X, "*")) : r("", !0)
176
+ ], 8, Q)) : r("", !0),
177
+ u("select", {
178
+ id: w(a),
179
179
  value: e.modelValue,
180
180
  disabled: e.disabled,
181
181
  required: e.required,
182
- class: h(b.value),
183
- onChange: I,
182
+ class: _(c.value),
183
+ onChange: V,
184
184
  onFocus: f,
185
- onBlur: k
185
+ onBlur: C
186
186
  }, [
187
- e.placeholder ? (s(), a("option", Q, v(e.placeholder), 1)) : c("", !0),
188
- (s(!0), a(L, null, j(e.options, (u) => (s(), a("option", {
189
- key: n(u),
190
- value: n(u)
191
- }, v(_(u)), 9, X))), 128))
192
- ], 42, P),
193
- e.error ? (s(), a("span", Y, v(e.error), 1)) : c("", !0)
187
+ e.placeholder ? (s(), d("option", Z, v(e.placeholder), 1)) : r("", !0),
188
+ (s(!0), d(z, null, S(e.options, (b) => (s(), d("option", {
189
+ key: n(b),
190
+ value: n(b)
191
+ }, v(h(b)), 9, R))), 128))
192
+ ], 42, Y),
193
+ e.error ? (s(), d("span", ee, v(e.error), 1)) : r("", !0)
194
194
  ]));
195
195
  }
196
- }), ve = /* @__PURE__ */ C(Z, [["__scopeId", "data-v-4d5c982a"]]), R = {
196
+ }), me = /* @__PURE__ */ B(te, [["__scopeId", "data-v-8a0c8926"]]), le = {
197
197
  key: 0,
198
198
  class: "base-card__header"
199
- }, ee = { class: "base-card__title" }, te = { class: "base-card__body" }, le = {
199
+ }, ae = { class: "base-card__title" }, se = { class: "base-card__body" }, oe = {
200
200
  key: 1,
201
201
  class: "base-card__footer"
202
- }, ae = /* @__PURE__ */ $({
202
+ }, de = /* @__PURE__ */ g({
203
203
  __name: "BaseCard",
204
204
  props: {
205
205
  title: {},
@@ -207,29 +207,29 @@ const O = ["disabled", "type"], M = {
207
207
  padding: { type: Boolean, default: !0 }
208
208
  },
209
209
  setup(e) {
210
- const o = e, l = y(
211
- () => B(o.elevated && "base-card--elevated", !o.padding && "base-card--no-padding")
210
+ const o = e, t = m(
211
+ () => k(o.elevated && "base-card--elevated", !o.padding && "base-card--no-padding")
212
212
  );
213
- return (t, d) => (s(), a("div", {
214
- class: h(["base-card", l.value])
213
+ return (l, a) => (s(), d("div", {
214
+ class: _(["base-card", t.value])
215
215
  }, [
216
- t.$slots.header || e.title ? (s(), a("div", R, [
217
- p(t.$slots, "header", {}, () => [
218
- r("h3", ee, v(e.title), 1)
216
+ l.$slots.header || e.title ? (s(), d("div", le, [
217
+ p(l.$slots, "header", {}, () => [
218
+ u("h3", ae, v(e.title), 1)
219
219
  ], !0)
220
- ])) : c("", !0),
221
- r("div", te, [
222
- p(t.$slots, "default", {}, void 0, !0)
220
+ ])) : r("", !0),
221
+ u("div", se, [
222
+ p(l.$slots, "default", {}, void 0, !0)
223
223
  ]),
224
- t.$slots.footer ? (s(), a("div", le, [
225
- p(t.$slots, "footer", {}, void 0, !0)
226
- ])) : c("", !0)
224
+ l.$slots.footer ? (s(), d("div", oe, [
225
+ p(l.$slots, "footer", {}, void 0, !0)
226
+ ])) : r("", !0)
227
227
  ], 2));
228
228
  }
229
- }), _e = /* @__PURE__ */ C(ae, [["__scopeId", "data-v-80b8fdda"]]), se = { class: "collapsible-card__header-content" }, oe = { class: "collapsible-card__title" }, de = ["aria-label", "aria-expanded"], ne = { class: "collapsible-card__body" }, ie = {
229
+ }), ye = /* @__PURE__ */ B(de, [["__scopeId", "data-v-80b8fdda"]]), ne = { class: "collapsible-card__header-content" }, ie = { class: "collapsible-card__title" }, ue = ["aria-label", "aria-expanded"], re = { class: "collapsible-card__body" }, ce = {
230
230
  key: 0,
231
231
  class: "collapsible-card__footer"
232
- }, re = /* @__PURE__ */ $({
232
+ }, be = /* @__PURE__ */ g({
233
233
  __name: "CollapsibleCard",
234
234
  props: {
235
235
  title: {},
@@ -238,92 +238,147 @@ const O = ["disabled", "type"], M = {
238
238
  initiallyCollapsed: { type: Boolean, default: !0 }
239
239
  },
240
240
  setup(e, { expose: o }) {
241
- const l = e, t = q(l.initiallyCollapsed), d = () => {
242
- t.value = !t.value;
243
- }, b = y(
244
- () => B(
245
- l.elevated && "collapsible-card--elevated",
246
- !l.padding && "collapsible-card--no-padding"
241
+ const t = e, l = I(t.initiallyCollapsed), a = () => {
242
+ l.value = !l.value;
243
+ }, c = m(
244
+ () => k(
245
+ t.elevated && "collapsible-card--elevated",
246
+ !t.padding && "collapsible-card--no-padding"
247
247
  )
248
248
  );
249
249
  return o({
250
- toggle: d,
251
- isCollapsed: t
252
- }), (n, _) => (s(), a("div", {
253
- class: h(["collapsible-card", b.value])
250
+ toggle: a,
251
+ isCollapsed: l
252
+ }), (n, h) => (s(), d("div", {
253
+ class: _(["collapsible-card", c.value])
254
254
  }, [
255
- r("div", {
255
+ u("div", {
256
256
  class: "collapsible-card__header",
257
- onClick: d
257
+ onClick: a
258
258
  }, [
259
- r("div", se, [
259
+ u("div", ne, [
260
260
  p(n.$slots, "header", {}, () => [
261
- r("h3", oe, v(e.title), 1)
261
+ u("h3", ie, v(e.title), 1)
262
262
  ], !0)
263
263
  ]),
264
- r("button", {
264
+ u("button", {
265
265
  type: "button",
266
266
  class: "collapsible-card__toggle",
267
- "aria-label": t.value ? "Expand" : "Collapse",
268
- "aria-expanded": !t.value
267
+ "aria-label": l.value ? "Expand" : "Collapse",
268
+ "aria-expanded": !l.value
269
269
  }, [
270
- (s(), a("svg", {
271
- class: h(["collapsible-card__icon", { "collapsible-card__icon--collapsed": t.value }]),
270
+ (s(), d("svg", {
271
+ class: _(["collapsible-card__icon", { "collapsible-card__icon--collapsed": l.value }]),
272
272
  width: "20",
273
273
  height: "20",
274
274
  viewBox: "0 0 20 20",
275
275
  fill: "currentColor"
276
- }, [..._[0] || (_[0] = [
277
- r("path", {
276
+ }, [...h[0] || (h[0] = [
277
+ u("path", {
278
278
  "fill-rule": "evenodd",
279
279
  d: "M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z",
280
280
  "clip-rule": "evenodd"
281
281
  }, null, -1)
282
282
  ])], 2))
283
- ], 8, de)
283
+ ], 8, ue)
284
284
  ]),
285
- w(r("div", ne, [
285
+ L(u("div", re, [
286
286
  p(n.$slots, "default", {}, void 0, !0)
287
287
  ], 512), [
288
- [E, !t.value]
288
+ [x, !l.value]
289
289
  ]),
290
- n.$slots.footer && !t.value ? (s(), a("div", ie, [
290
+ n.$slots.footer && !l.value ? (s(), d("div", ce, [
291
291
  p(n.$slots, "footer", {}, void 0, !0)
292
- ])) : c("", !0)
292
+ ])) : r("", !0)
293
293
  ], 2));
294
294
  }
295
- }), pe = /* @__PURE__ */ C(re, [["__scopeId", "data-v-14982384"]]);
296
- function he(e, o) {
297
- const l = q(e), t = q(null), d = y(() => t.value === null);
295
+ }), ge = /* @__PURE__ */ B(be, [["__scopeId", "data-v-14982384"]]), fe = ["width", "height"], ve = /* @__PURE__ */ g({
296
+ __name: "BaseDeleteButton",
297
+ props: {
298
+ size: { default: "medium" },
299
+ disabled: { type: Boolean, default: !1 },
300
+ loading: { type: Boolean, default: !1 },
301
+ fullWidth: { type: Boolean, default: !1 },
302
+ type: { default: "button" },
303
+ ariaLabel: {}
304
+ },
305
+ emits: ["click"],
306
+ setup(e) {
307
+ const o = e, t = m(() => {
308
+ switch (o.size) {
309
+ case "small":
310
+ return 16;
311
+ case "large":
312
+ return 24;
313
+ default:
314
+ return 20;
315
+ }
316
+ });
317
+ return (l, a) => (s(), M(T, {
318
+ variant: "danger",
319
+ size: e.size,
320
+ disabled: e.disabled,
321
+ loading: e.loading,
322
+ "full-width": e.fullWidth,
323
+ type: e.type,
324
+ onClick: a[0] || (a[0] = (c) => l.$emit("click", c)),
325
+ class: "base-delete-button",
326
+ "aria-label": e.ariaLabel || "Delete"
327
+ }, {
328
+ default: j(() => [
329
+ (s(), d("svg", {
330
+ class: "base-delete-button__icon",
331
+ viewBox: "0 0 24 24",
332
+ fill: "none",
333
+ xmlns: "http://www.w3.org/2000/svg",
334
+ width: t.value,
335
+ height: t.value
336
+ }, [...a[1] || (a[1] = [
337
+ u("path", {
338
+ d: "M3 6h18M19 6v14a2 2 0 01-2 2H7a2 2 0 01-2-2V6m3 0V4a2 2 0 012-2h4a2 2 0 012 2v2M10 11v6M14 11v6",
339
+ stroke: "currentColor",
340
+ "stroke-width": "2",
341
+ "stroke-linecap": "round",
342
+ "stroke-linejoin": "round"
343
+ }, null, -1)
344
+ ])], 8, fe))
345
+ ]),
346
+ _: 1
347
+ }, 8, ["size", "disabled", "loading", "full-width", "type", "aria-label"]));
348
+ }
349
+ }), Be = /* @__PURE__ */ B(ve, [["__scopeId", "data-v-413ae3e1"]]);
350
+ function $e(e, o) {
351
+ const t = I(e), l = I(null), a = m(() => l.value === null);
298
352
  return {
299
- value: l,
300
- error: t,
301
- isValid: d,
302
- validate: () => (t.value = o(l.value), d.value),
353
+ value: t,
354
+ error: l,
355
+ isValid: a,
356
+ validate: () => (l.value = o(t.value), a.value),
303
357
  reset: () => {
304
- l.value = e, t.value = null;
358
+ t.value = e, l.value = null;
305
359
  }
306
360
  };
307
361
  }
308
- function me(e, o) {
309
- const l = (t) => {
310
- e.value && !e.value.contains(t.target) && o();
362
+ function ke(e, o) {
363
+ const t = (l) => {
364
+ e.value && !e.value.contains(l.target) && o();
311
365
  };
312
- x(() => {
313
- document.addEventListener("click", l);
314
- }), z(() => {
315
- document.removeEventListener("click", l);
366
+ D(() => {
367
+ document.addEventListener("click", t);
368
+ }), E(() => {
369
+ document.removeEventListener("click", t);
316
370
  });
317
371
  }
318
372
  export {
319
- be as BaseButton,
320
- _e as BaseCard,
321
- fe as BaseInput,
322
- ve as BaseSelect,
323
- pe as CollapsibleCard,
324
- B as cn,
325
- ue as debounce,
326
- S as generateId,
327
- me as useClickOutside,
328
- he as useValidation
373
+ T as BaseButton,
374
+ ye as BaseCard,
375
+ Be as BaseDeleteButton,
376
+ _e as BaseInput,
377
+ me as BaseSelect,
378
+ ge as CollapsibleCard,
379
+ k as cn,
380
+ pe as debounce,
381
+ F as generateId,
382
+ ke as useClickOutside,
383
+ $e as useValidation
329
384
  };
@@ -1 +1 @@
1
- (function(n,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(n=typeof globalThis<"u"?globalThis:n||self,e(n.VueComponentLibrary={},n.Vue))})(this,(function(n,e){"use strict";function b(...t){return t.filter(Boolean).join(" ")}function y(t,o){let a;return function(...l){clearTimeout(a),a=setTimeout(()=>t.apply(this,l),o)}}function h(t="id"){return`${t}-${Math.random().toString(36).substr(2,9)}`}const C=["disabled","type"],g={key:0,class:"base-button__spinner"},V=e.defineComponent({__name:"BaseButton",props:{variant:{default:"primary"},size:{default:"medium"},disabled:{type:Boolean,default:!1},fullWidth:{type:Boolean,default:!1},loading:{type:Boolean,default:!1},type:{default:"button"}},emits:["click"],setup(t,{emit:o}){const a=t,l=o,s=e.computed(()=>b("base-button",`base-button--${a.variant}`,`base-button--${a.size}`,a.fullWidth&&"base-button--full-width",a.loading&&"base-button--loading",a.disabled&&"base-button--disabled")),i=d=>{!a.disabled&&!a.loading&&l("click",d)};return(d,m)=>(e.openBlock(),e.createElementBlock("button",{class:e.normalizeClass(s.value),disabled:t.disabled||t.loading,type:t.type,onClick:i},[t.loading?(e.openBlock(),e.createElementBlock("span",g)):e.createCommentVNode("",!0),e.createElementVNode("span",{class:e.normalizeClass({"base-button__content--loading":t.loading})},[e.renderSlot(d.$slots,"default",{},void 0,!0)],2)],10,C))}}),p=(t,o)=>{const a=t.__vccOpts||t;for(const[l,s]of o)a[l]=s;return a},$=p(V,[["__scopeId","data-v-a4a5350a"]]),E={class:"base-input"},S=["for"],N={key:0,class:"base-input__required"},I=["id","value","type","placeholder","disabled","required"],q={key:1,class:"base-input__error"},F=p(e.defineComponent({__name:"BaseInput",props:{modelValue:{default:""},type:{default:"text"},placeholder:{},disabled:{type:Boolean,default:!1},required:{type:Boolean,default:!1},label:{},error:{}},emits:["update:modelValue","focus","blur"],setup(t,{emit:o}){const a=t,l=o,s=h("base-input"),i=e.computed(()=>b("base-input__field",a.error&&"base-input__field--error",a.disabled&&"base-input__field--disabled")),d=u=>{const B=u.target;l("update:modelValue",B.value)},m=u=>{l("focus",u)},k=u=>{l("blur",u)};return(u,B)=>(e.openBlock(),e.createElementBlock("div",E,[t.label?(e.openBlock(),e.createElementBlock("label",{key:0,for:e.unref(s),class:"base-input__label"},[e.createTextVNode(e.toDisplayString(t.label)+" ",1),t.required?(e.openBlock(),e.createElementBlock("span",N,"*")):e.createCommentVNode("",!0)],8,S)):e.createCommentVNode("",!0),e.createElementVNode("input",{id:e.unref(s),value:t.modelValue,type:t.type,placeholder:t.placeholder,disabled:t.disabled,required:t.required,class:e.normalizeClass(i.value),onInput:d,onFocus:m,onBlur:k},null,42,I),t.error?(e.openBlock(),e.createElementBlock("span",q,e.toDisplayString(t.error),1)):e.createCommentVNode("",!0)]))}}),[["__scopeId","data-v-52f8a6e5"]]),z={class:"base-select"},D=["for"],j={key:0,class:"base-select__required"},L=["id","value","disabled","required"],T={key:0,value:"",disabled:""},O=["value"],w={key:1,class:"base-select__error"},M=p(e.defineComponent({__name:"BaseSelect",props:{modelValue:{default:""},options:{default:()=>[]},placeholder:{},disabled:{type:Boolean,default:!1},required:{type:Boolean,default:!1},label:{},error:{},labelField:{default:"label"},valueField:{default:"value"}},emits:["update:modelValue","focus","blur"],setup(t,{emit:o}){const a=t,l=o,s=h("base-select"),i=e.computed(()=>b("base-select__field",a.error&&"base-select__field--error",a.disabled&&"base-select__field--disabled")),d=c=>{if(typeof c=="object"){const f=a.valueField||"value",r=c,_=r[f];return _!==void 0?_:r.value??""}return c},m=c=>{if(typeof c=="object"){const f=a.labelField||"label",r=c,_=r[f];return String(_!==void 0?_:r.label??"")}return String(c)},k=c=>{const f=c.target;l("update:modelValue",f.value)},u=c=>{l("focus",c)},B=c=>{l("blur",c)};return(c,f)=>(e.openBlock(),e.createElementBlock("div",z,[t.label?(e.openBlock(),e.createElementBlock("label",{key:0,for:e.unref(s),class:"base-select__label"},[e.createTextVNode(e.toDisplayString(t.label)+" ",1),t.required?(e.openBlock(),e.createElementBlock("span",j,"*")):e.createCommentVNode("",!0)],8,D)):e.createCommentVNode("",!0),e.createElementVNode("select",{id:e.unref(s),value:t.modelValue,disabled:t.disabled,required:t.required,class:e.normalizeClass(i.value),onChange:k,onFocus:u,onBlur:B},[t.placeholder?(e.openBlock(),e.createElementBlock("option",T,e.toDisplayString(t.placeholder),1)):e.createCommentVNode("",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.options,r=>(e.openBlock(),e.createElementBlock("option",{key:d(r),value:d(r)},e.toDisplayString(m(r)),9,O))),128))],42,L),t.error?(e.openBlock(),e.createElementBlock("span",w,e.toDisplayString(t.error),1)):e.createCommentVNode("",!0)]))}}),[["__scopeId","data-v-4d5c982a"]]),W={key:0,class:"base-card__header"},P={class:"base-card__title"},U={class:"base-card__body"},A={key:1,class:"base-card__footer"},G=p(e.defineComponent({__name:"BaseCard",props:{title:{},elevated:{type:Boolean,default:!1},padding:{type:Boolean,default:!0}},setup(t){const o=t,a=e.computed(()=>b(o.elevated&&"base-card--elevated",!o.padding&&"base-card--no-padding"));return(l,s)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["base-card",a.value])},[l.$slots.header||t.title?(e.openBlock(),e.createElementBlock("div",W,[e.renderSlot(l.$slots,"header",{},()=>[e.createElementVNode("h3",P,e.toDisplayString(t.title),1)],!0)])):e.createCommentVNode("",!0),e.createElementVNode("div",U,[e.renderSlot(l.$slots,"default",{},void 0,!0)]),l.$slots.footer?(e.openBlock(),e.createElementBlock("div",A,[e.renderSlot(l.$slots,"footer",{},void 0,!0)])):e.createCommentVNode("",!0)],2))}}),[["__scopeId","data-v-80b8fdda"]]),H={class:"collapsible-card__header-content"},J={class:"collapsible-card__title"},K=["aria-label","aria-expanded"],Q={class:"collapsible-card__body"},X={key:0,class:"collapsible-card__footer"},Y=p(e.defineComponent({__name:"CollapsibleCard",props:{title:{},elevated:{type:Boolean,default:!1},padding:{type:Boolean,default:!0},initiallyCollapsed:{type:Boolean,default:!0}},setup(t,{expose:o}){const a=t,l=e.ref(a.initiallyCollapsed),s=()=>{l.value=!l.value},i=e.computed(()=>b(a.elevated&&"collapsible-card--elevated",!a.padding&&"collapsible-card--no-padding"));return o({toggle:s,isCollapsed:l}),(d,m)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["collapsible-card",i.value])},[e.createElementVNode("div",{class:"collapsible-card__header",onClick:s},[e.createElementVNode("div",H,[e.renderSlot(d.$slots,"header",{},()=>[e.createElementVNode("h3",J,e.toDisplayString(t.title),1)],!0)]),e.createElementVNode("button",{type:"button",class:"collapsible-card__toggle","aria-label":l.value?"Expand":"Collapse","aria-expanded":!l.value},[(e.openBlock(),e.createElementBlock("svg",{class:e.normalizeClass(["collapsible-card__icon",{"collapsible-card__icon--collapsed":l.value}]),width:"20",height:"20",viewBox:"0 0 20 20",fill:"currentColor"},[...m[0]||(m[0]=[e.createElementVNode("path",{"fill-rule":"evenodd",d:"M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z","clip-rule":"evenodd"},null,-1)])],2))],8,K)]),e.withDirectives(e.createElementVNode("div",Q,[e.renderSlot(d.$slots,"default",{},void 0,!0)],512),[[e.vShow,!l.value]]),d.$slots.footer&&!l.value?(e.openBlock(),e.createElementBlock("div",X,[e.renderSlot(d.$slots,"footer",{},void 0,!0)])):e.createCommentVNode("",!0)],2))}}),[["__scopeId","data-v-14982384"]]);function Z(t,o){const a=e.ref(t),l=e.ref(null),s=e.computed(()=>l.value===null);return{value:a,error:l,isValid:s,validate:()=>(l.value=o(a.value),s.value),reset:()=>{a.value=t,l.value=null}}}function R(t,o){const a=l=>{t.value&&!t.value.contains(l.target)&&o()};e.onMounted(()=>{document.addEventListener("click",a)}),e.onUnmounted(()=>{document.removeEventListener("click",a)})}n.BaseButton=$,n.BaseCard=G,n.BaseInput=F,n.BaseSelect=M,n.CollapsibleCard=Y,n.cn=b,n.debounce=y,n.generateId=h,n.useClickOutside=R,n.useValidation=Z,Object.defineProperty(n,Symbol.toStringTag,{value:"Module"})}));
1
+ (function(s,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(s=typeof globalThis<"u"?globalThis:s||self,e(s.VueComponentLibrary={},s.Vue))})(this,(function(s,e){"use strict";function b(...t){return t.filter(Boolean).join(" ")}function g(t,n){let l;return function(...a){clearTimeout(l),l=setTimeout(()=>t.apply(this,a),n)}}function _(t="id"){return`${t}-${Math.random().toString(36).substr(2,9)}`}const C=["disabled","type"],V={key:0,class:"base-button__spinner"},$=e.defineComponent({__name:"BaseButton",props:{variant:{default:"primary"},size:{default:"medium"},disabled:{type:Boolean,default:!1},fullWidth:{type:Boolean,default:!1},loading:{type:Boolean,default:!1},type:{default:"button"}},emits:["click"],setup(t,{emit:n}){const l=t,a=n,o=e.computed(()=>b("base-button",`base-button--${l.variant}`,`base-button--${l.size}`,l.fullWidth&&"base-button--full-width",l.loading&&"base-button--loading",l.disabled&&"base-button--disabled")),i=d=>{!l.disabled&&!l.loading&&a("click",d)};return(d,m)=>(e.openBlock(),e.createElementBlock("button",{class:e.normalizeClass(o.value),disabled:t.disabled||t.loading,type:t.type,onClick:i},[t.loading?(e.openBlock(),e.createElementBlock("span",V)):e.createCommentVNode("",!0),e.createElementVNode("span",{class:e.normalizeClass({"base-button__content--loading":t.loading})},[e.renderSlot(d.$slots,"default",{},void 0,!0)],2)],10,C))}}),f=(t,n)=>{const l=t.__vccOpts||t;for(const[a,o]of n)l[a]=o;return l},y=f($,[["__scopeId","data-v-a4a5350a"]]),E={class:"base-input"},S=["for"],N={key:0,class:"base-input__required"},w=["id","value","type","placeholder","disabled","required"],z={key:1,class:"base-input__error"},I=f(e.defineComponent({__name:"BaseInput",props:{modelValue:{default:""},type:{default:"text"},placeholder:{},disabled:{type:Boolean,default:!1},required:{type:Boolean,default:!1},label:{},error:{}},emits:["update:modelValue","focus","blur"],setup(t,{emit:n}){const l=t,a=n,o=_("base-input"),i=e.computed(()=>b("base-input__field",l.error&&"base-input__field--error",l.disabled&&"base-input__field--disabled")),d=u=>{const h=u.target;a("update:modelValue",h.value)},m=u=>{a("focus",u)},k=u=>{a("blur",u)};return(u,h)=>(e.openBlock(),e.createElementBlock("div",E,[t.label?(e.openBlock(),e.createElementBlock("label",{key:0,for:e.unref(o),class:"base-input__label"},[e.createTextVNode(e.toDisplayString(t.label)+" ",1),t.required?(e.openBlock(),e.createElementBlock("span",N,"*")):e.createCommentVNode("",!0)],8,S)):e.createCommentVNode("",!0),e.createElementVNode("input",{id:e.unref(o),value:t.modelValue,type:t.type,placeholder:t.placeholder,disabled:t.disabled,required:t.required,class:e.normalizeClass(i.value),onInput:d,onFocus:m,onBlur:k},null,42,w),t.error?(e.openBlock(),e.createElementBlock("span",z,e.toDisplayString(t.error),1)):e.createCommentVNode("",!0)]))}}),[["__scopeId","data-v-eff0ecb9"]]),q={class:"base-select"},D=["for"],F={key:0,class:"base-select__required"},L=["id","value","disabled","required"],j={key:0,value:"",disabled:""},M=["value"],T={key:1,class:"base-select__error"},O=f(e.defineComponent({__name:"BaseSelect",props:{modelValue:{default:""},options:{default:()=>[]},placeholder:{},disabled:{type:Boolean,default:!1},required:{type:Boolean,default:!1},label:{},error:{},labelField:{default:"label"},valueField:{default:"value"}},emits:["update:modelValue","focus","blur"],setup(t,{emit:n}){const l=t,a=n,o=_("base-select"),i=e.computed(()=>b("base-select__field",l.error&&"base-select__field--error",l.disabled&&"base-select__field--disabled")),d=c=>{if(typeof c=="object"){const p=l.valueField||"value",r=c,B=r[p];return B!==void 0?B:r.value??""}return c},m=c=>{if(typeof c=="object"){const p=l.labelField||"label",r=c,B=r[p];return String(B!==void 0?B:r.label??"")}return String(c)},k=c=>{const p=c.target;a("update:modelValue",p.value)},u=c=>{a("focus",c)},h=c=>{a("blur",c)};return(c,p)=>(e.openBlock(),e.createElementBlock("div",q,[t.label?(e.openBlock(),e.createElementBlock("label",{key:0,for:e.unref(o),class:"base-select__label"},[e.createTextVNode(e.toDisplayString(t.label)+" ",1),t.required?(e.openBlock(),e.createElementBlock("span",F,"*")):e.createCommentVNode("",!0)],8,D)):e.createCommentVNode("",!0),e.createElementVNode("select",{id:e.unref(o),value:t.modelValue,disabled:t.disabled,required:t.required,class:e.normalizeClass(i.value),onChange:k,onFocus:u,onBlur:h},[t.placeholder?(e.openBlock(),e.createElementBlock("option",j,e.toDisplayString(t.placeholder),1)):e.createCommentVNode("",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.options,r=>(e.openBlock(),e.createElementBlock("option",{key:d(r),value:d(r)},e.toDisplayString(m(r)),9,M))),128))],42,L),t.error?(e.openBlock(),e.createElementBlock("span",T,e.toDisplayString(t.error),1)):e.createCommentVNode("",!0)]))}}),[["__scopeId","data-v-8a0c8926"]]),W={key:0,class:"base-card__header"},H={class:"base-card__title"},P={class:"base-card__body"},U={key:1,class:"base-card__footer"},A=f(e.defineComponent({__name:"BaseCard",props:{title:{},elevated:{type:Boolean,default:!1},padding:{type:Boolean,default:!0}},setup(t){const n=t,l=e.computed(()=>b(n.elevated&&"base-card--elevated",!n.padding&&"base-card--no-padding"));return(a,o)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["base-card",l.value])},[a.$slots.header||t.title?(e.openBlock(),e.createElementBlock("div",W,[e.renderSlot(a.$slots,"header",{},()=>[e.createElementVNode("h3",H,e.toDisplayString(t.title),1)],!0)])):e.createCommentVNode("",!0),e.createElementVNode("div",P,[e.renderSlot(a.$slots,"default",{},void 0,!0)]),a.$slots.footer?(e.openBlock(),e.createElementBlock("div",U,[e.renderSlot(a.$slots,"footer",{},void 0,!0)])):e.createCommentVNode("",!0)],2))}}),[["__scopeId","data-v-80b8fdda"]]),G={class:"collapsible-card__header-content"},J={class:"collapsible-card__title"},K=["aria-label","aria-expanded"],Q={class:"collapsible-card__body"},X={key:0,class:"collapsible-card__footer"},Y=f(e.defineComponent({__name:"CollapsibleCard",props:{title:{},elevated:{type:Boolean,default:!1},padding:{type:Boolean,default:!0},initiallyCollapsed:{type:Boolean,default:!0}},setup(t,{expose:n}){const l=t,a=e.ref(l.initiallyCollapsed),o=()=>{a.value=!a.value},i=e.computed(()=>b(l.elevated&&"collapsible-card--elevated",!l.padding&&"collapsible-card--no-padding"));return n({toggle:o,isCollapsed:a}),(d,m)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["collapsible-card",i.value])},[e.createElementVNode("div",{class:"collapsible-card__header",onClick:o},[e.createElementVNode("div",G,[e.renderSlot(d.$slots,"header",{},()=>[e.createElementVNode("h3",J,e.toDisplayString(t.title),1)],!0)]),e.createElementVNode("button",{type:"button",class:"collapsible-card__toggle","aria-label":a.value?"Expand":"Collapse","aria-expanded":!a.value},[(e.openBlock(),e.createElementBlock("svg",{class:e.normalizeClass(["collapsible-card__icon",{"collapsible-card__icon--collapsed":a.value}]),width:"20",height:"20",viewBox:"0 0 20 20",fill:"currentColor"},[...m[0]||(m[0]=[e.createElementVNode("path",{"fill-rule":"evenodd",d:"M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z","clip-rule":"evenodd"},null,-1)])],2))],8,K)]),e.withDirectives(e.createElementVNode("div",Q,[e.renderSlot(d.$slots,"default",{},void 0,!0)],512),[[e.vShow,!a.value]]),d.$slots.footer&&!a.value?(e.openBlock(),e.createElementBlock("div",X,[e.renderSlot(d.$slots,"footer",{},void 0,!0)])):e.createCommentVNode("",!0)],2))}}),[["__scopeId","data-v-14982384"]]),Z=["width","height"],x=f(e.defineComponent({__name:"BaseDeleteButton",props:{size:{default:"medium"},disabled:{type:Boolean,default:!1},loading:{type:Boolean,default:!1},fullWidth:{type:Boolean,default:!1},type:{default:"button"},ariaLabel:{}},emits:["click"],setup(t){const n=t,l=e.computed(()=>{switch(n.size){case"small":return 16;case"large":return 24;default:return 20}});return(a,o)=>(e.openBlock(),e.createBlock(y,{variant:"danger",size:t.size,disabled:t.disabled,loading:t.loading,"full-width":t.fullWidth,type:t.type,onClick:o[0]||(o[0]=i=>a.$emit("click",i)),class:"base-delete-button","aria-label":t.ariaLabel||"Delete"},{default:e.withCtx(()=>[(e.openBlock(),e.createElementBlock("svg",{class:"base-delete-button__icon",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",width:l.value,height:l.value},[...o[1]||(o[1]=[e.createElementVNode("path",{d:"M3 6h18M19 6v14a2 2 0 01-2 2H7a2 2 0 01-2-2V6m3 0V4a2 2 0 012-2h4a2 2 0 012 2v2M10 11v6M14 11v6",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"},null,-1)])],8,Z))]),_:1},8,["size","disabled","loading","full-width","type","aria-label"]))}}),[["__scopeId","data-v-413ae3e1"]]);function R(t,n){const l=e.ref(t),a=e.ref(null),o=e.computed(()=>a.value===null);return{value:l,error:a,isValid:o,validate:()=>(a.value=n(l.value),o.value),reset:()=>{l.value=t,a.value=null}}}function v(t,n){const l=a=>{t.value&&!t.value.contains(a.target)&&n()};e.onMounted(()=>{document.addEventListener("click",l)}),e.onUnmounted(()=>{document.removeEventListener("click",l)})}s.BaseButton=y,s.BaseCard=A,s.BaseDeleteButton=x,s.BaseInput=I,s.BaseSelect=O,s.CollapsibleCard=Y,s.cn=b,s.debounce=g,s.generateId=_,s.useClickOutside=v,s.useValidation=R,Object.defineProperty(s,Symbol.toStringTag,{value:"Module"})}));
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@allsrvsonline/vue-component-library",
3
- "version": "0.3.3",
3
+ "version": "0.5.0",
4
4
  "type": "module",
5
5
  "main": "./dist/vue-component-library.umd.js",
6
6
  "module": "./dist/vue-component-library.es.js",