@allsrvsonline/vue-component-library 0.3.2 → 0.4.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/dist/index.d.ts +16 -16
  2. package/dist/vue-component-library.css +1 -1
  3. package/dist/vue-component-library.es.js +27 -27
  4. package/dist/vue-component-library.umd.js +1 -1
  5. package/package.json +1 -1
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,7 @@ declare interface BaseCardProps {
175
175
  padding?: boolean;
176
176
  }
177
177
 
178
- export declare const BaseInput: DefineComponent<BaseInputProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
178
+ export declare const BaseInput: DefineComponent<BaseInputProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
179
179
  "update:modelValue": (value: string) => any;
180
180
  focus: (event: FocusEvent) => any;
181
181
  blur: (event: FocusEvent) => any;
@@ -193,20 +193,20 @@ required: boolean;
193
193
  /**
194
194
  * Events emitted by BaseInput
195
195
  */
196
- export declare type BaseInputEmits = {
196
+ export declare interface BaseInputEmits {
197
197
  /**
198
198
  * Emitted when value changes (v-model)
199
199
  */
200
- (e: 'update:modelValue', value: string): void;
200
+ 'update:modelValue': [value: string];
201
201
  /**
202
202
  * Emitted when input is focused
203
203
  */
204
- (e: 'focus', event: FocusEvent): void;
204
+ focus: [event: FocusEvent];
205
205
  /**
206
206
  * Emitted when input loses focus
207
207
  */
208
- (e: 'blur', event: FocusEvent): void;
209
- };
208
+ blur: [event: FocusEvent];
209
+ }
210
210
 
211
211
  /**
212
212
  * Props for BaseInput component
@@ -245,7 +245,7 @@ export declare interface BaseInputProps {
245
245
  error?: string;
246
246
  }
247
247
 
248
- export declare const BaseSelect: DefineComponent<BaseSelectProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
248
+ export declare const BaseSelect: DefineComponent<BaseSelectProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
249
249
  "update:modelValue": (value: string) => any;
250
250
  focus: (event: FocusEvent) => any;
251
251
  blur: (event: FocusEvent) => any;
@@ -265,20 +265,20 @@ valueField: string;
265
265
  /**
266
266
  * Events emitted by BaseSelect
267
267
  */
268
- export declare type BaseSelectEmits = {
268
+ export declare interface BaseSelectEmits {
269
269
  /**
270
270
  * Emitted when value changes (v-model)
271
271
  */
272
- (e: 'update:modelValue', value: string): void;
272
+ 'update:modelValue': [value: string];
273
273
  /**
274
274
  * Emitted when select is focused
275
275
  */
276
- (e: 'focus', event: FocusEvent): void;
276
+ focus: [event: FocusEvent];
277
277
  /**
278
278
  * Emitted when select loses focus
279
279
  */
280
- (e: 'blur', event: FocusEvent): void;
281
- };
280
+ blur: [event: FocusEvent];
281
+ }
282
282
 
283
283
  /**
284
284
  * Props for BaseSelect component
package/dist/vue-component-library.css CHANGED
@@ -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)}
package/dist/vue-component-library.es.js CHANGED
@@ -1,4 +1,4 @@
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";
1
+ import { defineComponent as $, computed as y, createElementBlock as a, openBlock as s, normalizeClass as h, createCommentVNode as r, createElementVNode as c, 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
2
  function B(...e) {
3
3
  return e.filter(Boolean).join(" ");
4
4
  }
@@ -44,8 +44,8 @@ const O = ["disabled", "type"], M = {
44
44
  type: e.type,
45
45
  onClick: b
46
46
  }, [
47
- e.loading ? (s(), a("span", M)) : c("", !0),
48
- r("span", {
47
+ e.loading ? (s(), a("span", M)) : r("", !0),
48
+ c("span", {
49
49
  class: h({ "base-button__content--loading": e.loading })
50
50
  }, [
51
51
  p(n.$slots, "default", {}, void 0, !0)
@@ -97,9 +97,9 @@ const O = ["disabled", "type"], M = {
97
97
  class: "base-input__label"
98
98
  }, [
99
99
  F(v(e.label) + " ", 1),
100
- e.required ? (s(), a("span", W, "*")) : c("", !0)
101
- ], 8, D)) : c("", !0),
102
- r("input", {
100
+ e.required ? (s(), a("span", W, "*")) : r("", !0)
101
+ ], 8, D)) : r("", !0),
102
+ c("input", {
103
103
  id: V(d),
104
104
  value: e.modelValue,
105
105
  type: e.type,
@@ -111,10 +111,10 @@ const O = ["disabled", "type"], M = {
111
111
  onFocus: _,
112
112
  onBlur: I
113
113
  }, null, 42, U),
114
- e.error ? (s(), a("span", A, v(e.error), 1)) : c("", !0)
114
+ e.error ? (s(), a("span", A, 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
+ }), fe = /* @__PURE__ */ C(G, [["__scopeId", "data-v-eff0ecb9"]]), H = { class: "base-select" }, J = ["for"], K = {
118
118
  key: 0,
119
119
  class: "base-select__required"
120
120
  }, P = ["id", "value", "disabled", "required"], Q = {
@@ -172,9 +172,9 @@ const O = ["disabled", "type"], M = {
172
172
  class: "base-select__label"
173
173
  }, [
174
174
  F(v(e.label) + " ", 1),
175
- e.required ? (s(), a("span", K, "*")) : c("", !0)
176
- ], 8, J)) : c("", !0),
177
- r("select", {
175
+ e.required ? (s(), a("span", K, "*")) : r("", !0)
176
+ ], 8, J)) : r("", !0),
177
+ c("select", {
178
178
  id: V(d),
179
179
  value: e.modelValue,
180
180
  disabled: e.disabled,
@@ -184,16 +184,16 @@ const O = ["disabled", "type"], M = {
184
184
  onFocus: f,
185
185
  onBlur: k
186
186
  }, [
187
- e.placeholder ? (s(), a("option", Q, v(e.placeholder), 1)) : c("", !0),
187
+ e.placeholder ? (s(), a("option", Q, v(e.placeholder), 1)) : r("", !0),
188
188
  (s(!0), a(L, null, j(e.options, (u) => (s(), a("option", {
189
189
  key: n(u),
190
190
  value: n(u)
191
191
  }, v(_(u)), 9, X))), 128))
192
192
  ], 42, P),
193
- e.error ? (s(), a("span", Y, v(e.error), 1)) : c("", !0)
193
+ e.error ? (s(), a("span", Y, v(e.error), 1)) : r("", !0)
194
194
  ]));
195
195
  }
196
- }), ve = /* @__PURE__ */ C(Z, [["__scopeId", "data-v-4d5c982a"]]), R = {
196
+ }), ve = /* @__PURE__ */ C(Z, [["__scopeId", "data-v-8a0c8926"]]), R = {
197
197
  key: 0,
198
198
  class: "base-card__header"
199
199
  }, ee = { class: "base-card__title" }, te = { class: "base-card__body" }, le = {
@@ -215,21 +215,21 @@ const O = ["disabled", "type"], M = {
215
215
  }, [
216
216
  t.$slots.header || e.title ? (s(), a("div", R, [
217
217
  p(t.$slots, "header", {}, () => [
218
- r("h3", ee, v(e.title), 1)
218
+ c("h3", ee, v(e.title), 1)
219
219
  ], !0)
220
- ])) : c("", !0),
221
- r("div", te, [
220
+ ])) : r("", !0),
221
+ c("div", te, [
222
222
  p(t.$slots, "default", {}, void 0, !0)
223
223
  ]),
224
224
  t.$slots.footer ? (s(), a("div", le, [
225
225
  p(t.$slots, "footer", {}, void 0, !0)
226
- ])) : c("", !0)
226
+ ])) : r("", !0)
227
227
  ], 2));
228
228
  }
229
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
230
  key: 0,
231
231
  class: "collapsible-card__footer"
232
- }, re = /* @__PURE__ */ $({
232
+ }, ce = /* @__PURE__ */ $({
233
233
  __name: "CollapsibleCard",
234
234
  props: {
235
235
  title: {},
@@ -252,16 +252,16 @@ const O = ["disabled", "type"], M = {
252
252
  }), (n, _) => (s(), a("div", {
253
253
  class: h(["collapsible-card", b.value])
254
254
  }, [
255
- r("div", {
255
+ c("div", {
256
256
  class: "collapsible-card__header",
257
257
  onClick: d
258
258
  }, [
259
- r("div", se, [
259
+ c("div", se, [
260
260
  p(n.$slots, "header", {}, () => [
261
- r("h3", oe, v(e.title), 1)
261
+ c("h3", oe, v(e.title), 1)
262
262
  ], !0)
263
263
  ]),
264
- r("button", {
264
+ c("button", {
265
265
  type: "button",
266
266
  class: "collapsible-card__toggle",
267
267
  "aria-label": t.value ? "Expand" : "Collapse",
@@ -274,7 +274,7 @@ const O = ["disabled", "type"], M = {
274
274
  viewBox: "0 0 20 20",
275
275
  fill: "currentColor"
276
276
  }, [..._[0] || (_[0] = [
277
- r("path", {
277
+ c("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"
@@ -282,17 +282,17 @@ const O = ["disabled", "type"], M = {
282
282
  ])], 2))
283
283
  ], 8, de)
284
284
  ]),
285
- w(r("div", ne, [
285
+ w(c("div", ne, [
286
286
  p(n.$slots, "default", {}, void 0, !0)
287
287
  ], 512), [
288
288
  [E, !t.value]
289
289
  ]),
290
290
  n.$slots.footer && !t.value ? (s(), a("div", ie, [
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"]]);
295
+ }), pe = /* @__PURE__ */ C(ce, [["__scopeId", "data-v-14982384"]]);
296
296
  function he(e, o) {
297
297
  const l = q(e), t = q(null), d = y(() => t.value === null);
298
298
  return {
package/dist/vue-component-library.umd.js CHANGED
@@ -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(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-eff0ecb9"]]),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-8a0c8926"]]),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.3.2",
3
+ "version": "0.4.1",
4
4
  "type": "module",
5
5
  "main": "./dist/vue-component-library.umd.js",
6
6
  "module": "./dist/vue-component-library.es.js",