@allsrvsonline/vue-component-library 0.1.2 → 0.3.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/dist/index.d.ts CHANGED
@@ -22,6 +22,15 @@ elevated: boolean;
22
22
  padding: boolean;
23
23
  }, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
24
24
 
25
+ declare const __VLS_component_3: DefineComponent<CollapsibleCardProps_2, {
26
+ toggle: () => void;
27
+ isCollapsed: Ref<boolean, boolean>;
28
+ }, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<CollapsibleCardProps_2> & Readonly<{}>, {
29
+ elevated: boolean;
30
+ padding: boolean;
31
+ initiallyCollapsed: boolean;
32
+ }, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
33
+
25
34
  /**
26
35
  * BaseButton - A versatile button component with multiple variants and sizes
27
36
  *
@@ -56,10 +65,23 @@ declare function __VLS_template_2(): {
56
65
  rootEl: HTMLDivElement;
57
66
  };
58
67
 
68
+ declare function __VLS_template_3(): {
69
+ attrs: Partial<{}>;
70
+ slots: {
71
+ header?(_: {}): any;
72
+ default?(_: {}): any;
73
+ footer?(_: {}): any;
74
+ };
75
+ refs: {};
76
+ rootEl: HTMLDivElement;
77
+ };
78
+
59
79
  declare type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
60
80
 
61
81
  declare type __VLS_TemplateResult_2 = ReturnType<typeof __VLS_template_2>;
62
82
 
83
+ declare type __VLS_TemplateResult_3 = ReturnType<typeof __VLS_template_3>;
84
+
63
85
  declare type __VLS_WithTemplateSlots<T, S> = T & {
64
86
  new (): {
65
87
  $slots: S;
@@ -72,17 +94,23 @@ declare type __VLS_WithTemplateSlots_2<T, S> = T & {
72
94
  };
73
95
  };
74
96
 
97
+ declare type __VLS_WithTemplateSlots_3<T, S> = T & {
98
+ new (): {
99
+ $slots: S;
100
+ };
101
+ };
102
+
75
103
  export declare const BaseButton: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
76
104
 
77
105
  /**
78
106
  * Events emitted by BaseButton
79
107
  */
80
- export declare interface BaseButtonEmits {
108
+ export declare type BaseButtonEmits = {
81
109
  /**
82
110
  * Emitted when button is clicked
83
111
  */
84
112
  (e: 'click', event: MouseEvent): void;
85
- }
113
+ };
86
114
 
87
115
  /**
88
116
  * Props for BaseButton component
@@ -165,7 +193,7 @@ required: boolean;
165
193
  /**
166
194
  * Events emitted by BaseInput
167
195
  */
168
- export declare interface BaseInputEmits {
196
+ export declare type BaseInputEmits = {
169
197
  /**
170
198
  * Emitted when value changes (v-model)
171
199
  */
@@ -178,7 +206,7 @@ export declare interface BaseInputEmits {
178
206
  * Emitted when input loses focus
179
207
  */
180
208
  (e: 'blur', event: FocusEvent): void;
181
- }
209
+ };
182
210
 
183
211
  /**
184
212
  * Props for BaseInput component
@@ -217,6 +245,87 @@ export declare interface BaseInputProps {
217
245
  error?: string;
218
246
  }
219
247
 
248
+ export declare const BaseSelect: DefineComponent<BaseSelectProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
249
+ "update:modelValue": (value: string) => any;
250
+ focus: (event: FocusEvent) => any;
251
+ blur: (event: FocusEvent) => any;
252
+ }, string, PublicProps, Readonly<BaseSelectProps> & Readonly<{
253
+ "onUpdate:modelValue"?: ((value: string) => any) | undefined;
254
+ onFocus?: ((event: FocusEvent) => any) | undefined;
255
+ onBlur?: ((event: FocusEvent) => any) | undefined;
256
+ }>, {
257
+ disabled: boolean;
258
+ modelValue: string | number;
259
+ required: boolean;
260
+ options: SelectOption[];
261
+ labelField: string;
262
+ valueField: string;
263
+ }, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
264
+
265
+ /**
266
+ * Events emitted by BaseSelect
267
+ */
268
+ export declare type BaseSelectEmits = {
269
+ /**
270
+ * Emitted when value changes (v-model)
271
+ */
272
+ (e: 'update:modelValue', value: string): void;
273
+ /**
274
+ * Emitted when select is focused
275
+ */
276
+ (e: 'focus', event: FocusEvent): void;
277
+ /**
278
+ * Emitted when select loses focus
279
+ */
280
+ (e: 'blur', event: FocusEvent): void;
281
+ };
282
+
283
+ /**
284
+ * Props for BaseSelect component
285
+ */
286
+ export declare interface BaseSelectProps {
287
+ /**
288
+ * The select value (v-model)
289
+ */
290
+ modelValue?: string | number;
291
+ /**
292
+ * Array of options to display
293
+ */
294
+ options?: SelectOption[];
295
+ /**
296
+ * Placeholder text
297
+ */
298
+ placeholder?: string;
299
+ /**
300
+ * Whether the select is disabled
301
+ * @default false
302
+ */
303
+ disabled?: boolean;
304
+ /**
305
+ * Whether the select is required
306
+ * @default false
307
+ */
308
+ required?: boolean;
309
+ /**
310
+ * Select label
311
+ */
312
+ label?: string;
313
+ /**
314
+ * Error message to display
315
+ */
316
+ error?: string;
317
+ /**
318
+ * Field name to use as the label when options are objects
319
+ * @default 'label'
320
+ */
321
+ labelField?: string;
322
+ /**
323
+ * Field name to use as the value when options are objects
324
+ * @default 'value'
325
+ */
326
+ valueField?: string;
327
+ }
328
+
220
329
  /**
221
330
  * Button size types
222
331
  */
@@ -247,6 +356,65 @@ export declare type ButtonVariant = 'primary' | 'secondary' | 'success' | 'dange
247
356
  */
248
357
  export declare function cn(...classes: (string | false | null | undefined)[]): string;
249
358
 
359
+ export declare const CollapsibleCard: __VLS_WithTemplateSlots_3<typeof __VLS_component_3, __VLS_TemplateResult_3["slots"]>;
360
+
361
+ /**
362
+ * Props for CollapsibleCard component
363
+ */
364
+ export declare interface CollapsibleCardProps {
365
+ /**
366
+ * Card title
367
+ */
368
+ title?: string;
369
+ /**
370
+ * Whether the card has elevated shadow
371
+ * @default false
372
+ */
373
+ elevated?: boolean;
374
+ /**
375
+ * Whether the card has padding
376
+ * @default true
377
+ */
378
+ padding?: boolean;
379
+ /**
380
+ * Initial collapsed state
381
+ * @default true
382
+ */
383
+ initiallyCollapsed?: boolean;
384
+ }
385
+
386
+ /**
387
+ * CollapsibleCard - A card component that can be collapsed and expanded
388
+ *
389
+ * @example
390
+ * ```vue
391
+ * <CollapsibleCard title="Click to expand" :initiallyCollapsed="false">
392
+ * <p>This content can be toggled</p>
393
+ * </CollapsibleCard>
394
+ * ```
395
+ */
396
+ declare interface CollapsibleCardProps_2 {
397
+ /**
398
+ * Card title
399
+ */
400
+ title?: string;
401
+ /**
402
+ * Whether the card has elevated shadow
403
+ * @default false
404
+ */
405
+ elevated?: boolean;
406
+ /**
407
+ * Whether the card has padding
408
+ * @default true
409
+ */
410
+ padding?: boolean;
411
+ /**
412
+ * Initial collapsed state
413
+ * @default true
414
+ */
415
+ initiallyCollapsed?: boolean;
416
+ }
417
+
250
418
  /**
251
419
  * Debounces a function call
252
420
  *
@@ -264,6 +432,14 @@ export declare function debounce<T extends (...args: unknown[]) => void>(fn: T,
264
432
  */
265
433
  export declare function generateId(prefix?: string): string;
266
434
 
435
+ /**
436
+ * Select option type - can be a simple value or an object with value and label
437
+ */
438
+ export declare type SelectOption = string | number | {
439
+ value: string | number;
440
+ label: string;
441
+ } | Record<string, unknown>;
442
+
267
443
  /**
268
444
  * Composable for detecting clicks outside an element
269
445
  *
@@ -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-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)}
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,20 +1,20 @@
1
- import { defineComponent as m, computed as p, createElementBlock as l, openBlock as o, normalizeClass as b, createCommentVNode as i, createElementVNode as f, renderSlot as c, unref as g, createTextVNode as C, toDisplayString as v, ref as $, onMounted as I, onUnmounted as V } from "vue";
2
- function _(...e) {
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) {
3
3
  return e.filter(Boolean).join(" ");
4
4
  }
5
- function A(e, s) {
6
- let t;
7
- return function(...a) {
8
- clearTimeout(t), t = setTimeout(() => e.apply(this, a), s);
5
+ function ue(e, o) {
6
+ let l;
7
+ return function(...t) {
8
+ clearTimeout(l), l = setTimeout(() => e.apply(this, t), o);
9
9
  };
10
10
  }
11
- function q(e = "id") {
11
+ function S(e = "id") {
12
12
  return `${e}-${Math.random().toString(36).substr(2, 9)}`;
13
13
  }
14
- const E = ["disabled", "type"], z = {
14
+ const O = ["disabled", "type"], M = {
15
15
  key: 0,
16
16
  class: "base-button__spinner"
17
- }, N = /* @__PURE__ */ m({
17
+ }, N = /* @__PURE__ */ $({
18
18
  __name: "BaseButton",
19
19
  props: {
20
20
  variant: { default: "primary" },
@@ -25,45 +25,45 @@ const E = ["disabled", "type"], z = {
25
25
  type: { default: "button" }
26
26
  },
27
27
  emits: ["click"],
28
- setup(e, { emit: s }) {
29
- const t = e, a = s, n = p(
30
- () => _(
28
+ setup(e, { emit: o }) {
29
+ const l = e, t = o, d = y(
30
+ () => B(
31
31
  "base-button",
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"
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"
37
37
  )
38
- ), r = (d) => {
39
- !t.disabled && !t.loading && a("click", d);
38
+ ), b = (n) => {
39
+ !l.disabled && !l.loading && t("click", n);
40
40
  };
41
- return (d, y) => (o(), l("button", {
42
- class: b(n.value),
41
+ return (n, _) => (s(), a("button", {
42
+ class: h(d.value),
43
43
  disabled: e.disabled || e.loading,
44
44
  type: e.type,
45
- onClick: r
45
+ onClick: b
46
46
  }, [
47
- e.loading ? (o(), l("span", z)) : i("", !0),
48
- f("span", {
49
- class: b({ "base-button__content--loading": e.loading })
47
+ e.loading ? (s(), a("span", M)) : c("", !0),
48
+ r("span", {
49
+ class: h({ "base-button__content--loading": e.loading })
50
50
  }, [
51
- c(d.$slots, "default", {}, void 0, !0)
51
+ p(n.$slots, "default", {}, void 0, !0)
52
52
  ], 2)
53
- ], 10, E));
53
+ ], 10, O));
54
54
  }
55
- }), h = (e, s) => {
56
- const t = e.__vccOpts || e;
57
- for (const [a, n] of s)
58
- t[a] = n;
59
- return t;
60
- }, G = /* @__PURE__ */ h(N, [["__scopeId", "data-v-a4a5350a"]]), S = { class: "base-input" }, T = ["for"], F = {
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 = {
61
61
  key: 0,
62
62
  class: "base-input__required"
63
- }, L = ["id", "value", "type", "placeholder", "disabled", "required"], M = {
63
+ }, U = ["id", "value", "type", "placeholder", "disabled", "required"], A = {
64
64
  key: 1,
65
65
  class: "base-input__error"
66
- }, O = /* @__PURE__ */ m({
66
+ }, G = /* @__PURE__ */ $({
67
67
  __name: "BaseInput",
68
68
  props: {
69
69
  modelValue: { default: "" },
@@ -75,52 +75,131 @@ const E = ["disabled", "type"], z = {
75
75
  error: {}
76
76
  },
77
77
  emits: ["update:modelValue", "focus", "blur"],
78
- setup(e, { emit: s }) {
79
- const t = e, a = s, n = q("base-input"), r = p(
80
- () => _(
78
+ setup(e, { emit: o }) {
79
+ const l = e, t = o, d = S("base-input"), b = y(
80
+ () => B(
81
81
  "base-input__field",
82
- t.error && "base-input__field--error",
83
- t.disabled && "base-input__field--disabled"
82
+ l.error && "base-input__field--error",
83
+ l.disabled && "base-input__field--disabled"
84
84
  )
85
- ), d = (u) => {
86
- const B = u.target;
87
- a("update:modelValue", B.value);
88
- }, y = (u) => {
89
- a("focus", u);
90
- }, k = (u) => {
91
- a("blur", u);
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);
92
92
  };
93
- return (u, B) => (o(), l("div", S, [
94
- e.label ? (o(), l("label", {
93
+ return (f, k) => (s(), a("div", T, [
94
+ e.label ? (s(), a("label", {
95
95
  key: 0,
96
- for: g(n),
96
+ for: V(d),
97
97
  class: "base-input__label"
98
98
  }, [
99
- C(v(e.label) + " ", 1),
100
- e.required ? (o(), l("span", F, "*")) : i("", !0)
101
- ], 8, T)) : i("", !0),
102
- f("input", {
103
- id: g(n),
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),
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: b(r.value),
110
- onInput: d,
111
- onFocus: y,
109
+ class: h(b.value),
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)
115
+ ]));
116
+ }
117
+ }), fe = /* @__PURE__ */ C(G, [["__scopeId", "data-v-52f8a6e5"]]), H = { class: "base-select" }, J = ["for"], K = {
118
+ key: 0,
119
+ class: "base-select__required"
120
+ }, P = ["id", "value", "disabled", "required"], Q = {
121
+ key: 0,
122
+ value: "",
123
+ disabled: ""
124
+ }, X = ["value"], Y = {
125
+ key: 1,
126
+ class: "base-select__error"
127
+ }, Z = /* @__PURE__ */ $({
128
+ __name: "BaseSelect",
129
+ props: {
130
+ modelValue: { default: "" },
131
+ options: { default: () => [] },
132
+ placeholder: {},
133
+ disabled: { type: Boolean, default: !1 },
134
+ required: { type: Boolean, default: !1 },
135
+ label: {},
136
+ error: {},
137
+ labelField: { default: "label" },
138
+ valueField: { default: "value" }
139
+ },
140
+ emits: ["update:modelValue", "focus", "blur"],
141
+ setup(e, { emit: o }) {
142
+ const l = e, t = o, d = S("base-select"), b = y(
143
+ () => B(
144
+ "base-select__field",
145
+ l.error && "base-select__field--error",
146
+ l.disabled && "base-select__field--disabled"
147
+ )
148
+ ), n = (i) => {
149
+ if (typeof i == "object") {
150
+ const m = l.valueField || "value", u = i, g = u[m];
151
+ return g !== void 0 ? g : u.value ?? "";
152
+ }
153
+ return i;
154
+ }, _ = (i) => {
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 ?? "");
158
+ }
159
+ return String(i);
160
+ }, I = (i) => {
161
+ const m = i.target;
162
+ t("update:modelValue", m.value);
163
+ }, f = (i) => {
164
+ t("focus", i);
165
+ }, k = (i) => {
166
+ t("blur", i);
167
+ };
168
+ return (i, m) => (s(), a("div", H, [
169
+ e.label ? (s(), a("label", {
170
+ key: 0,
171
+ for: V(d),
172
+ class: "base-select__label"
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),
179
+ value: e.modelValue,
180
+ disabled: e.disabled,
181
+ required: e.required,
182
+ class: h(b.value),
183
+ onChange: I,
184
+ onFocus: f,
112
185
  onBlur: k
113
- }, null, 42, L),
114
- e.error ? (o(), l("span", M, v(e.error), 1)) : i("", !0)
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)
115
194
  ]));
116
195
  }
117
- }), H = /* @__PURE__ */ h(O, [["__scopeId", "data-v-52f8a6e5"]]), W = {
196
+ }), ve = /* @__PURE__ */ C(Z, [["__scopeId", "data-v-4d5c982a"]]), R = {
118
197
  key: 0,
119
198
  class: "base-card__header"
120
- }, j = { class: "base-card__title" }, w = { class: "base-card__body" }, x = {
199
+ }, ee = { class: "base-card__title" }, te = { class: "base-card__body" }, le = {
121
200
  key: 1,
122
201
  class: "base-card__footer"
123
- }, D = /* @__PURE__ */ m({
202
+ }, ae = /* @__PURE__ */ $({
124
203
  __name: "BaseCard",
125
204
  props: {
126
205
  title: {},
@@ -128,55 +207,123 @@ const E = ["disabled", "type"], z = {
128
207
  padding: { type: Boolean, default: !0 }
129
208
  },
130
209
  setup(e) {
131
- const s = e, t = p(
132
- () => _(s.elevated && "base-card--elevated", !s.padding && "base-card--no-padding")
210
+ const o = e, l = y(
211
+ () => B(o.elevated && "base-card--elevated", !o.padding && "base-card--no-padding")
133
212
  );
134
- return (a, n) => (o(), l("div", {
135
- class: b(["base-card", t.value])
213
+ return (t, d) => (s(), a("div", {
214
+ class: h(["base-card", l.value])
136
215
  }, [
137
- a.$slots.header || e.title ? (o(), l("div", W, [
138
- c(a.$slots, "header", {}, () => [
139
- f("h3", j, v(e.title), 1)
216
+ t.$slots.header || e.title ? (s(), a("div", R, [
217
+ p(t.$slots, "header", {}, () => [
218
+ r("h3", ee, v(e.title), 1)
140
219
  ], !0)
141
- ])) : i("", !0),
142
- f("div", w, [
143
- c(a.$slots, "default", {}, void 0, !0)
220
+ ])) : c("", !0),
221
+ r("div", te, [
222
+ p(t.$slots, "default", {}, void 0, !0)
223
+ ]),
224
+ t.$slots.footer ? (s(), a("div", le, [
225
+ p(t.$slots, "footer", {}, void 0, !0)
226
+ ])) : c("", !0)
227
+ ], 2));
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 = {
230
+ key: 0,
231
+ class: "collapsible-card__footer"
232
+ }, re = /* @__PURE__ */ $({
233
+ __name: "CollapsibleCard",
234
+ props: {
235
+ title: {},
236
+ elevated: { type: Boolean, default: !1 },
237
+ padding: { type: Boolean, default: !0 },
238
+ initiallyCollapsed: { type: Boolean, default: !0 }
239
+ },
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"
247
+ )
248
+ );
249
+ return o({
250
+ toggle: d,
251
+ isCollapsed: t
252
+ }), (n, _) => (s(), a("div", {
253
+ class: h(["collapsible-card", b.value])
254
+ }, [
255
+ r("div", {
256
+ class: "collapsible-card__header",
257
+ onClick: d
258
+ }, [
259
+ r("div", se, [
260
+ p(n.$slots, "header", {}, () => [
261
+ r("h3", oe, v(e.title), 1)
262
+ ], !0)
263
+ ]),
264
+ r("button", {
265
+ type: "button",
266
+ class: "collapsible-card__toggle",
267
+ "aria-label": t.value ? "Expand" : "Collapse",
268
+ "aria-expanded": !t.value
269
+ }, [
270
+ (s(), a("svg", {
271
+ class: h(["collapsible-card__icon", { "collapsible-card__icon--collapsed": t.value }]),
272
+ width: "20",
273
+ height: "20",
274
+ viewBox: "0 0 20 20",
275
+ fill: "currentColor"
276
+ }, [..._[0] || (_[0] = [
277
+ r("path", {
278
+ "fill-rule": "evenodd",
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
+ "clip-rule": "evenodd"
281
+ }, null, -1)
282
+ ])], 2))
283
+ ], 8, de)
284
+ ]),
285
+ w(r("div", ne, [
286
+ p(n.$slots, "default", {}, void 0, !0)
287
+ ], 512), [
288
+ [E, !t.value]
144
289
  ]),
145
- a.$slots.footer ? (o(), l("div", x, [
146
- c(a.$slots, "footer", {}, void 0, !0)
147
- ])) : i("", !0)
290
+ n.$slots.footer && !t.value ? (s(), a("div", ie, [
291
+ p(n.$slots, "footer", {}, void 0, !0)
292
+ ])) : c("", !0)
148
293
  ], 2));
149
294
  }
150
- }), J = /* @__PURE__ */ h(D, [["__scopeId", "data-v-80b8fdda"]]);
151
- function K(e, s) {
152
- const t = $(e), a = $(null), n = p(() => a.value === null);
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);
153
298
  return {
154
- value: t,
155
- error: a,
156
- isValid: n,
157
- validate: () => (a.value = s(t.value), n.value),
299
+ value: l,
300
+ error: t,
301
+ isValid: d,
302
+ validate: () => (t.value = o(l.value), d.value),
158
303
  reset: () => {
159
- t.value = e, a.value = null;
304
+ l.value = e, t.value = null;
160
305
  }
161
306
  };
162
307
  }
163
- function P(e, s) {
164
- const t = (a) => {
165
- e.value && !e.value.contains(a.target) && s();
308
+ function me(e, o) {
309
+ const l = (t) => {
310
+ e.value && !e.value.contains(t.target) && o();
166
311
  };
167
- I(() => {
168
- document.addEventListener("click", t);
169
- }), V(() => {
170
- document.removeEventListener("click", t);
312
+ x(() => {
313
+ document.addEventListener("click", l);
314
+ }), z(() => {
315
+ document.removeEventListener("click", l);
171
316
  });
172
317
  }
173
318
  export {
174
- G as BaseButton,
175
- J as BaseCard,
176
- H as BaseInput,
177
- _ as cn,
178
- A as debounce,
179
- q as generateId,
180
- P as useClickOutside,
181
- K as useValidation
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
182
329
  };
@@ -1 +1 @@
1
- (function(o,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(o=typeof globalThis<"u"?globalThis:o||self,e(o.VueComponentLibrary={},o.Vue))})(this,(function(o,e){"use strict";function i(...t){return t.filter(Boolean).join(" ")}function p(t,l){let a;return function(...n){clearTimeout(a),a=setTimeout(()=>t.apply(this,n),l)}}function f(t="id"){return`${t}-${Math.random().toString(36).substr(2,9)}`}const B=["disabled","type"],_={key:0,class:"base-button__spinner"},h=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:l}){const a=t,n=l,s=e.computed(()=>i("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")),r=d=>{!a.disabled&&!a.loading&&n("click",d)};return(d,m)=>(e.openBlock(),e.createElementBlock("button",{class:e.normalizeClass(s.value),disabled:t.disabled||t.loading,type:t.type,onClick:r},[t.loading?(e.openBlock(),e.createElementBlock("span",_)):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,B))}}),u=(t,l)=>{const a=t.__vccOpts||t;for(const[n,s]of l)a[n]=s;return a},k=u(h,[["__scopeId","data-v-a4a5350a"]]),y={class:"base-input"},C=["for"],g={key:0,class:"base-input__required"},V=["id","value","type","placeholder","disabled","required"],$={key:1,class:"base-input__error"},E=u(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:l}){const a=t,n=l,s=f("base-input"),r=e.computed(()=>i("base-input__field",a.error&&"base-input__field--error",a.disabled&&"base-input__field--disabled")),d=c=>{const b=c.target;n("update:modelValue",b.value)},m=c=>{n("focus",c)},j=c=>{n("blur",c)};return(c,b)=>(e.openBlock(),e.createElementBlock("div",y,[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",g,"*")):e.createCommentVNode("",!0)],8,C)):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(r.value),onInput:d,onFocus:m,onBlur:j},null,42,V),t.error?(e.openBlock(),e.createElementBlock("span",$,e.toDisplayString(t.error),1)):e.createCommentVNode("",!0)]))}}),[["__scopeId","data-v-52f8a6e5"]]),I={key:0,class:"base-card__header"},N={class:"base-card__title"},S={class:"base-card__body"},q={key:1,class:"base-card__footer"},z=u(e.defineComponent({__name:"BaseCard",props:{title:{},elevated:{type:Boolean,default:!1},padding:{type:Boolean,default:!0}},setup(t){const l=t,a=e.computed(()=>i(l.elevated&&"base-card--elevated",!l.padding&&"base-card--no-padding"));return(n,s)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["base-card",a.value])},[n.$slots.header||t.title?(e.openBlock(),e.createElementBlock("div",I,[e.renderSlot(n.$slots,"header",{},()=>[e.createElementVNode("h3",N,e.toDisplayString(t.title),1)],!0)])):e.createCommentVNode("",!0),e.createElementVNode("div",S,[e.renderSlot(n.$slots,"default",{},void 0,!0)]),n.$slots.footer?(e.openBlock(),e.createElementBlock("div",q,[e.renderSlot(n.$slots,"footer",{},void 0,!0)])):e.createCommentVNode("",!0)],2))}}),[["__scopeId","data-v-80b8fdda"]]);function T(t,l){const a=e.ref(t),n=e.ref(null),s=e.computed(()=>n.value===null);return{value:a,error:n,isValid:s,validate:()=>(n.value=l(a.value),s.value),reset:()=>{a.value=t,n.value=null}}}function O(t,l){const a=n=>{t.value&&!t.value.contains(n.target)&&l()};e.onMounted(()=>{document.addEventListener("click",a)}),e.onUnmounted(()=>{document.removeEventListener("click",a)})}o.BaseButton=k,o.BaseCard=z,o.BaseInput=E,o.cn=i,o.debounce=p,o.generateId=f,o.useClickOutside=O,o.useValidation=T,Object.defineProperty(o,Symbol.toStringTag,{value:"Module"})}));
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"})}));
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@allsrvsonline/vue-component-library",
3
- "version": "0.1.2",
3
+ "version": "0.3.0",
4
4
  "type": "module",
5
5
  "main": "./dist/vue-component-library.umd.js",
6
6
  "module": "./dist/vue-component-library.es.js",
@@ -30,12 +30,20 @@
30
30
  "format": "prettier --write \"src/**/*.{ts,tsx,vue,json}\"",
31
31
  "test": "vitest",
32
32
  "test:ui": "vitest --ui",
33
- "type-check": "vue-tsc --noEmit"
33
+ "type-check": "vue-tsc --noEmit",
34
+ "tag": "git tag v%npm_package_version% && git push origin v%npm_package_version%",
35
+ "release": "standard-version",
36
+ "release:patch": "standard-version --release-as patch",
37
+ "release:minor": "standard-version --release-as minor",
38
+ "release:major": "standard-version --release-as major",
39
+ "release:dry-run": "standard-version --dry-run"
34
40
  },
35
41
  "dependencies": {
36
42
  "vue": "^3.5.24"
37
43
  },
38
44
  "devDependencies": {
45
+ "@commitlint/cli": "^20.3.0",
46
+ "@commitlint/config-conventional": "^20.3.0",
39
47
  "@types/node": "^24.10.1",
40
48
  "@typescript-eslint/eslint-plugin": "^8.51.0",
41
49
  "@typescript-eslint/parser": "^8.51.0",
@@ -48,6 +56,7 @@
48
56
  "eslint-plugin-vue": "^10.6.2",
49
57
  "happy-dom": "^20.0.11",
50
58
  "prettier": "^3.7.4",
59
+ "standard-version": "^9.5.0",
51
60
  "typescript": "~5.9.3",
52
61
  "vite": "^7.2.4",
53
62
  "vite-plugin-dts": "^4.5.4",