@devjuliovilla/jv-ui 1.7.1 → 1.8.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.
Files changed (6) hide show
  1. package/README.md +1 -1
  2. package/fesm2022/devjuliovilla-jv-ui.mjs +2392 -866
  3. package/fesm2022/devjuliovilla-jv-ui.mjs.map +1 -1
  4. package/package.json +1 -1
  5. package/styles/jv-theme.css +135 -135
  6. package/types/devjuliovilla-jv-ui.d.ts +289 -23
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@devjuliovilla/jv-ui",
3
- "version": "1.7.1",
3
+ "version": "1.8.0",
4
4
  "description": "Accessibility-first Angular component library — components, forms, data grids, dialogs, layout, services, and i18n infrastructure built with signals and standalone APIs.",
5
5
  "author": "@devjuliovilla",
6
6
  "license": "MIT",
package/styles/jv-theme.css CHANGED
@@ -1,135 +1,135 @@
1
- :root {
2
- --jv-color-primary: #2563eb;
3
- --jv-color-secondary: #475569;
4
- --jv-color-success: #16a34a;
5
- --jv-color-warning: #d97706;
6
- --jv-color-danger: #dc2626;
7
- --jv-color-info: #0891b2;
8
-
9
- --jv-color-background: #f8fafc;
10
- --jv-color-surface: #ffffff;
11
- --jv-color-surface-muted: #f1f5f9;
12
- --jv-color-border: #dbe3ef;
13
- --jv-color-foreground: #0f172a;
14
- --jv-color-foreground-muted: #475569;
15
-
16
- --jv-spacing-xs: 0.25rem;
17
- --jv-spacing-sm: 0.5rem;
18
- --jv-spacing-md: 1rem;
19
- --jv-spacing-lg: 1.5rem;
20
- --jv-spacing-xl: 2rem;
21
-
22
- --jv-radius-sm: 0.375rem;
23
- --jv-radius-md: 0.75rem;
24
- --jv-radius-lg: 1rem;
25
-
26
- --jv-breakpoint-sm: 640px;
27
- --jv-breakpoint-md: 768px;
28
- --jv-breakpoint-lg: 1024px;
29
- --jv-breakpoint-xl: 1280px;
30
-
31
- --jv-shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.08);
32
- --jv-shadow-md: 0 10px 30px rgba(15, 23, 42, 0.08);
33
- --jv-shadow-lg: 0 20px 40px rgba(15, 23, 42, 0.16);
34
-
35
- --jv-density-control-height: 2.5rem;
36
- --jv-density-padding-y: 0.75rem;
37
- --jv-density-font-size: 0.95rem;
38
- }
39
-
40
- html[data-theme='dark'] {
41
- --jv-color-background: #020617;
42
- --jv-color-surface: #0f172a;
43
- --jv-color-surface-muted: #111c31;
44
- --jv-color-border: #243244;
45
- --jv-color-foreground: #e2e8f0;
46
- --jv-color-foreground-muted: #94a3b8;
47
- }
48
-
49
- html[data-theme='high-contrast'] {
50
- --jv-color-primary: #00ffff;
51
- --jv-color-secondary: #ffffff;
52
- --jv-color-success: #00ff00;
53
- --jv-color-warning: #ffff00;
54
- --jv-color-danger: #ff4d4d;
55
- --jv-color-info: #00ffff;
56
- --jv-color-background: #000000;
57
- --jv-color-surface: #000000;
58
- --jv-color-surface-muted: #111111;
59
- --jv-color-border: #ffffff;
60
- --jv-color-foreground: #ffffff;
61
- --jv-color-foreground-muted: #f5f5f5;
62
- }
63
-
64
- html[data-density='compact'] {
65
- --jv-density-control-height: 2rem;
66
- --jv-density-padding-y: 0.5rem;
67
- --jv-density-font-size: 0.875rem;
68
- }
69
-
70
- html[data-density='comfortable'] {
71
- --jv-density-control-height: 3rem;
72
- --jv-density-padding-y: 0.95rem;
73
- --jv-density-font-size: 1rem;
74
- }
75
-
76
- html,
77
- body {
78
- min-height: 100%;
79
- }
80
-
81
- body {
82
- margin: 0;
83
- background: var(--jv-color-background);
84
- color: var(--jv-color-foreground);
85
- font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
86
- font-size: var(--jv-density-font-size);
87
- }
88
-
89
- *,
90
- *::before,
91
- *::after {
92
- box-sizing: border-box;
93
- }
94
-
95
- button,
96
- input,
97
- select,
98
- textarea {
99
- font: inherit;
100
- }
101
-
102
- :focus-visible {
103
- outline: 2px solid var(--jv-color-primary);
104
- outline-offset: 2px;
105
- }
106
-
107
- .sr-only,
108
- .screen-reader-only {
109
- position: absolute;
110
- width: 1px;
111
- height: 1px;
112
- padding: 0;
113
- margin: -1px;
114
- overflow: hidden;
115
- clip: rect(0, 0, 0, 0);
116
- white-space: nowrap;
117
- border: 0;
118
- }
119
-
120
- .jv-icon {
121
- display: inline-block;
122
- vertical-align: middle;
123
- flex: none;
124
- }
125
-
126
- @media (prefers-reduced-motion: reduce) {
127
- *,
128
- *::before,
129
- *::after {
130
- animation-duration: 0.01ms !important;
131
- animation-iteration-count: 1 !important;
132
- scroll-behavior: auto !important;
133
- transition-duration: 0.01ms !important;
134
- }
135
- }
1
+ :root {
2
+ --jv-color-primary: #2563eb;
3
+ --jv-color-secondary: #475569;
4
+ --jv-color-success: #16a34a;
5
+ --jv-color-warning: #d97706;
6
+ --jv-color-danger: #dc2626;
7
+ --jv-color-info: #0891b2;
8
+
9
+ --jv-color-background: #f8fafc;
10
+ --jv-color-surface: #ffffff;
11
+ --jv-color-surface-muted: #f1f5f9;
12
+ --jv-color-border: #dbe3ef;
13
+ --jv-color-foreground: #0f172a;
14
+ --jv-color-foreground-muted: #475569;
15
+
16
+ --jv-spacing-xs: 0.25rem;
17
+ --jv-spacing-sm: 0.5rem;
18
+ --jv-spacing-md: 1rem;
19
+ --jv-spacing-lg: 1.5rem;
20
+ --jv-spacing-xl: 2rem;
21
+
22
+ --jv-radius-sm: 0.375rem;
23
+ --jv-radius-md: 0.75rem;
24
+ --jv-radius-lg: 1rem;
25
+
26
+ --jv-breakpoint-sm: 640px;
27
+ --jv-breakpoint-md: 768px;
28
+ --jv-breakpoint-lg: 1024px;
29
+ --jv-breakpoint-xl: 1280px;
30
+
31
+ --jv-shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.08);
32
+ --jv-shadow-md: 0 10px 30px rgba(15, 23, 42, 0.08);
33
+ --jv-shadow-lg: 0 20px 40px rgba(15, 23, 42, 0.16);
34
+
35
+ --jv-density-control-height: 2.5rem;
36
+ --jv-density-padding-y: 0.75rem;
37
+ --jv-density-font-size: 0.95rem;
38
+ }
39
+
40
+ html[data-theme='dark'] {
41
+ --jv-color-background: #020617;
42
+ --jv-color-surface: #0f172a;
43
+ --jv-color-surface-muted: #111c31;
44
+ --jv-color-border: #243244;
45
+ --jv-color-foreground: #e2e8f0;
46
+ --jv-color-foreground-muted: #94a3b8;
47
+ }
48
+
49
+ html[data-theme='high-contrast'] {
50
+ --jv-color-primary: #00ffff;
51
+ --jv-color-secondary: #ffffff;
52
+ --jv-color-success: #00ff00;
53
+ --jv-color-warning: #ffff00;
54
+ --jv-color-danger: #ff4d4d;
55
+ --jv-color-info: #00ffff;
56
+ --jv-color-background: #000000;
57
+ --jv-color-surface: #000000;
58
+ --jv-color-surface-muted: #111111;
59
+ --jv-color-border: #ffffff;
60
+ --jv-color-foreground: #ffffff;
61
+ --jv-color-foreground-muted: #f5f5f5;
62
+ }
63
+
64
+ html[data-density='compact'] {
65
+ --jv-density-control-height: 2rem;
66
+ --jv-density-padding-y: 0.5rem;
67
+ --jv-density-font-size: 0.875rem;
68
+ }
69
+
70
+ html[data-density='comfortable'] {
71
+ --jv-density-control-height: 3rem;
72
+ --jv-density-padding-y: 0.95rem;
73
+ --jv-density-font-size: 1rem;
74
+ }
75
+
76
+ html,
77
+ body {
78
+ min-height: 100%;
79
+ }
80
+
81
+ body {
82
+ margin: 0;
83
+ background: var(--jv-color-background);
84
+ color: var(--jv-color-foreground);
85
+ font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
86
+ font-size: var(--jv-density-font-size);
87
+ }
88
+
89
+ *,
90
+ *::before,
91
+ *::after {
92
+ box-sizing: border-box;
93
+ }
94
+
95
+ button,
96
+ input,
97
+ select,
98
+ textarea {
99
+ font: inherit;
100
+ }
101
+
102
+ :focus-visible {
103
+ outline: 2px solid var(--jv-color-primary);
104
+ outline-offset: 2px;
105
+ }
106
+
107
+ .sr-only,
108
+ .screen-reader-only {
109
+ position: absolute;
110
+ width: 1px;
111
+ height: 1px;
112
+ padding: 0;
113
+ margin: -1px;
114
+ overflow: hidden;
115
+ clip: rect(0, 0, 0, 0);
116
+ white-space: nowrap;
117
+ border: 0;
118
+ }
119
+
120
+ .jv-icon {
121
+ display: inline-block;
122
+ vertical-align: middle;
123
+ flex: none;
124
+ }
125
+
126
+ @media (prefers-reduced-motion: reduce) {
127
+ *,
128
+ *::before,
129
+ *::after {
130
+ animation-duration: 0.01ms !important;
131
+ animation-iteration-count: 1 !important;
132
+ scroll-behavior: auto !important;
133
+ transition-duration: 0.01ms !important;
134
+ }
135
+ }
package/types/devjuliovilla-jv-ui.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  import * as _angular_core from '@angular/core';
2
- import { InjectionToken } from '@angular/core';
2
+ import { TemplateRef, InjectionToken, AfterViewInit, OnDestroy } from '@angular/core';
3
3
  import * as _angular_forms from '@angular/forms';
4
4
  import { ControlValueAccessor } from '@angular/forms';
5
5
  import * as _devjuliovilla_jv_ui from '@devjuliovilla/jv-ui';
@@ -131,6 +131,70 @@ declare class JvSectionComponent {
131
131
  static ɵcmp: _angular_core.ɵɵComponentDeclaration<JvSectionComponent, "jv-section", never, { "title": { "alias": "title"; "required": false; "isSignal": true; }; "description": { "alias": "description"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
132
132
  }
133
133
 
134
+ declare class JvAccordionPanelDirective {
135
+ readonly templateRef: TemplateRef<unknown>;
136
+ readonly id: _angular_core.InputSignal<string>;
137
+ constructor(templateRef: TemplateRef<unknown>);
138
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<JvAccordionPanelDirective, never>;
139
+ static ɵdir: _angular_core.ɵɵDirectiveDeclaration<JvAccordionPanelDirective, "ng-template[jvAccordionPanel]", never, { "id": { "alias": "jvAccordionPanel"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
140
+ }
141
+
142
+ type JvCollapsiblePanelVariant = 'bordered' | 'filled' | 'minimal';
143
+ declare class JvCollapsiblePanelComponent {
144
+ private readonly announcementService;
145
+ private readonly translation;
146
+ private readonly internalOpen;
147
+ private readonly bodyVisible;
148
+ readonly title: _angular_core.InputSignal<string>;
149
+ readonly subtitle: _angular_core.InputSignal<string>;
150
+ readonly icon: _angular_core.InputSignal<string | null>;
151
+ readonly open: _angular_core.InputSignal<boolean | undefined>;
152
+ readonly defaultOpen: _angular_core.InputSignal<boolean>;
153
+ readonly keepMounted: _angular_core.InputSignal<boolean>;
154
+ readonly disabled: _angular_core.InputSignal<boolean>;
155
+ readonly showIndicator: _angular_core.InputSignal<boolean>;
156
+ readonly variant: _angular_core.InputSignal<JvCollapsiblePanelVariant>;
157
+ readonly openChange: _angular_core.OutputEmitterRef<boolean>;
158
+ protected readonly triggerId: string;
159
+ protected readonly contentId: string;
160
+ protected readonly resolvedOpen: _angular_core.Signal<boolean>;
161
+ protected readonly panelClass: _angular_core.Signal<string>;
162
+ protected readonly shouldRenderBody: _angular_core.Signal<boolean>;
163
+ protected readonly triggerAriaLabel: _angular_core.Signal<string>;
164
+ constructor();
165
+ protected toggle(): void;
166
+ protected handleBodyTransitionEnd(event: TransitionEvent): void;
167
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<JvCollapsiblePanelComponent, never>;
168
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<JvCollapsiblePanelComponent, "jv-collapsible-panel", never, { "title": { "alias": "title"; "required": true; "isSignal": true; }; "subtitle": { "alias": "subtitle"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "open": { "alias": "open"; "required": false; "isSignal": true; }; "defaultOpen": { "alias": "defaultOpen"; "required": false; "isSignal": true; }; "keepMounted": { "alias": "keepMounted"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "showIndicator": { "alias": "showIndicator"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; }, { "openChange": "openChange"; }, never, ["*"], true, never>;
169
+ }
170
+
171
+ interface JvAccordionItem {
172
+ id: string;
173
+ title: string;
174
+ subtitle?: string;
175
+ icon?: string;
176
+ disabled?: boolean;
177
+ }
178
+ declare class JvAccordionComponent {
179
+ private readonly panelTemplates;
180
+ private readonly internalOpenItemIds;
181
+ readonly items: _angular_core.InputSignal<JvAccordionItem[]>;
182
+ readonly openItemIds: _angular_core.InputSignal<string[] | undefined>;
183
+ readonly defaultOpenItemIds: _angular_core.InputSignal<string[]>;
184
+ readonly multiple: _angular_core.InputSignal<boolean>;
185
+ readonly keepMounted: _angular_core.InputSignal<boolean>;
186
+ readonly showIndicator: _angular_core.InputSignal<boolean>;
187
+ readonly variant: _angular_core.InputSignal<JvCollapsiblePanelVariant>;
188
+ readonly openItemIdsChange: _angular_core.OutputEmitterRef<string[]>;
189
+ protected readonly resolvedOpenItemIds: _angular_core.Signal<string[]>;
190
+ constructor();
191
+ protected isItemOpen(itemId: string): boolean;
192
+ protected handleItemOpenChange(itemId: string, nextOpen: boolean): void;
193
+ protected panelTemplate(itemId: string): _angular_core.TemplateRef<unknown> | null;
194
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<JvAccordionComponent, never>;
195
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<JvAccordionComponent, "jv-accordion", never, { "items": { "alias": "items"; "required": false; "isSignal": true; }; "openItemIds": { "alias": "openItemIds"; "required": false; "isSignal": true; }; "defaultOpenItemIds": { "alias": "defaultOpenItemIds"; "required": false; "isSignal": true; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "keepMounted": { "alias": "keepMounted"; "required": false; "isSignal": true; }; "showIndicator": { "alias": "showIndicator"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; }, { "openItemIdsChange": "openItemIdsChange"; }, ["panelTemplates"], never, true, never>;
196
+ }
197
+
134
198
  declare class JvAlertComponent {
135
199
  readonly tone: _angular_core.InputSignal<JvTone>;
136
200
  readonly title: _angular_core.InputSignal<string>;
@@ -275,6 +339,13 @@ interface JvSelectOption<T = string> {
275
339
  value: T;
276
340
  disabled?: boolean;
277
341
  }
342
+ interface JvModalSelectorOption<T = string> {
343
+ label: string;
344
+ value: T;
345
+ description?: string;
346
+ keywords?: string[];
347
+ disabled?: boolean;
348
+ }
278
349
 
279
350
  declare class JvInputComponent implements ControlValueAccessor {
280
351
  readonly type: _angular_core.InputSignal<"number" | "search" | "text" | "email" | "password">;
@@ -297,6 +368,147 @@ declare class JvInputComponent implements ControlValueAccessor {
297
368
  static ɵcmp: _angular_core.ɵɵComponentDeclaration<JvInputComponent, "jv-input", never, { "type": { "alias": "type"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "describedBy": { "alias": "describedBy"; "required": false; "isSignal": true; }; "inputId": { "alias": "inputId"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
298
369
  }
299
370
 
371
+ declare const ES: Record<string, string>;
372
+
373
+ declare const EN: Record<string, string>;
374
+
375
+ type JvLocale = 'es' | 'en';
376
+ declare const JV_LOCALE_DICTIONARIES: Record<JvLocale, Record<string, string>>;
377
+ declare const JV_DEFAULT_LOCALE: JvLocale;
378
+
379
+ declare class JvTranslationService {
380
+ private readonly config;
381
+ readonly locale: _angular_core.WritableSignal<JvLocale>;
382
+ initialize(): void;
383
+ setLocale(locale: JvLocale): void;
384
+ translate(key: string, params?: Record<string, string | number>): string;
385
+ private resolveLocale;
386
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<JvTranslationService, never>;
387
+ static ɵprov: _angular_core.ɵɵInjectableDeclaration<JvTranslationService>;
388
+ }
389
+
390
+ interface JvDatePickerCell {
391
+ date: Date;
392
+ currentMonth: boolean;
393
+ isToday: boolean;
394
+ }
395
+ declare class JvDatePickerComponent implements ControlValueAccessor {
396
+ readonly translation: JvTranslationService;
397
+ private readonly announcementService;
398
+ private readonly instanceId;
399
+ private readonly calendarRootRef;
400
+ private readonly triggerButtonRef;
401
+ readonly label: _angular_core.InputSignal<string>;
402
+ readonly placeholder: _angular_core.InputSignal<string>;
403
+ readonly dialogTitle: _angular_core.InputSignal<string>;
404
+ readonly required: _angular_core.InputSignal<boolean>;
405
+ readonly invalid: _angular_core.InputSignal<boolean>;
406
+ readonly hint: _angular_core.InputSignal<string>;
407
+ readonly error: _angular_core.InputSignal<string>;
408
+ readonly describedBy: _angular_core.InputSignal<string>;
409
+ readonly inputId: _angular_core.InputSignal<string>;
410
+ readonly valueInput: _angular_core.InputSignal<Date | null | undefined>;
411
+ readonly selectionChange: _angular_core.OutputEmitterRef<Date | null>;
412
+ protected readonly dialogOpen: _angular_core.WritableSignal<boolean>;
413
+ protected readonly visibleMonth: _angular_core.WritableSignal<Date>;
414
+ protected readonly focusedDate: _angular_core.WritableSignal<Date>;
415
+ protected readonly dialogId: string;
416
+ protected value: Date | null;
417
+ protected disabled: boolean;
418
+ protected readonly resolvedDialogTitle: _angular_core.Signal<string>;
419
+ protected readonly currentValue: _angular_core.Signal<Date | null | undefined>;
420
+ protected readonly triggerAriaLabel: _angular_core.Signal<string>;
421
+ protected readonly displayValue: _angular_core.Signal<string>;
422
+ protected readonly monthOptions: _angular_core.Signal<JvSelectOption<string>[]>;
423
+ protected readonly yearOptions: _angular_core.Signal<JvSelectOption<string>[]>;
424
+ protected readonly weekdayLabels: _angular_core.Signal<string[]>;
425
+ protected readonly calendarCells: _angular_core.Signal<JvDatePickerCell[]>;
426
+ private onChange;
427
+ private onTouched;
428
+ writeValue(value: Date | null): void;
429
+ registerOnChange(fn: (value: Date | null) => void): void;
430
+ registerOnTouched(fn: () => void): void;
431
+ setDisabledState(isDisabled: boolean): void;
432
+ protected openDialog(): void;
433
+ protected closeDialog(): void;
434
+ protected clearSelection(): void;
435
+ protected shiftMonth(offset: number): void;
436
+ protected handleMonthChange(value: string): void;
437
+ protected handleYearChange(value: string): void;
438
+ protected selectDate(date: Date): void;
439
+ protected handleDayKeydown(event: KeyboardEvent, date: Date): void;
440
+ protected isSelected(date: Date): boolean;
441
+ protected isFocusedDate(date: Date): boolean;
442
+ protected isoDate(date: Date): string;
443
+ protected handleBlur(): void;
444
+ private updateValue;
445
+ private focusDateWithinVisibleMonth;
446
+ private focusDateButton;
447
+ private firstDayOfWeek;
448
+ private displayDateForAnnouncement;
449
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<JvDatePickerComponent, never>;
450
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<JvDatePickerComponent, "jv-date-picker", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "dialogTitle": { "alias": "dialogTitle"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "error": { "alias": "error"; "required": false; "isSignal": true; }; "describedBy": { "alias": "describedBy"; "required": false; "isSignal": true; }; "inputId": { "alias": "inputId"; "required": false; "isSignal": true; }; "valueInput": { "alias": "value"; "required": false; "isSignal": true; }; }, { "selectionChange": "selectionChange"; }, never, never, true, never>;
451
+ }
452
+
453
+ declare class JvModalSelectorComponent implements ControlValueAccessor {
454
+ private readonly announcementService;
455
+ protected readonly translation: JvTranslationService;
456
+ private readonly instanceId;
457
+ private readonly triggerButtonRef;
458
+ private readonly optionElements;
459
+ readonly options: _angular_core.InputSignal<JvModalSelectorOption<string>[]>;
460
+ readonly label: _angular_core.InputSignal<string>;
461
+ readonly placeholder: _angular_core.InputSignal<string>;
462
+ readonly dialogTitle: _angular_core.InputSignal<string>;
463
+ readonly dialogSubtitle: _angular_core.InputSignal<string>;
464
+ readonly searchPlaceholder: _angular_core.InputSignal<string>;
465
+ readonly emptyMessage: _angular_core.InputSignal<string>;
466
+ readonly clearLabel: _angular_core.InputSignal<string>;
467
+ readonly closeLabel: _angular_core.InputSignal<string>;
468
+ readonly showSearch: _angular_core.InputSignal<boolean>;
469
+ readonly required: _angular_core.InputSignal<boolean>;
470
+ readonly invalid: _angular_core.InputSignal<boolean>;
471
+ readonly hint: _angular_core.InputSignal<string>;
472
+ readonly error: _angular_core.InputSignal<string>;
473
+ readonly describedBy: _angular_core.InputSignal<string>;
474
+ readonly inputId: _angular_core.InputSignal<string>;
475
+ readonly valueInput: _angular_core.InputSignal<string | null | undefined>;
476
+ readonly selectionChange: _angular_core.OutputEmitterRef<string | null>;
477
+ protected readonly dialogOpen: _angular_core.WritableSignal<boolean>;
478
+ protected readonly searchQuery: _angular_core.WritableSignal<string>;
479
+ protected readonly dialogId: string;
480
+ protected readonly searchInputId: string;
481
+ protected value: string | null;
482
+ protected disabled: boolean;
483
+ protected readonly resolvedDialogTitle: _angular_core.Signal<string>;
484
+ protected readonly currentValue: _angular_core.Signal<string | null | undefined>;
485
+ protected readonly selectedOption: _angular_core.Signal<JvModalSelectorOption<string> | null>;
486
+ protected readonly resolvedPlaceholder: _angular_core.Signal<string>;
487
+ protected readonly triggerAriaLabel: _angular_core.Signal<string>;
488
+ protected readonly resultsLabel: _angular_core.Signal<string>;
489
+ protected readonly filteredOptions: _angular_core.Signal<JvModalSelectorOption<string>[]>;
490
+ private onChange;
491
+ private onTouched;
492
+ writeValue(value: string | null): void;
493
+ registerOnChange(fn: (value: string | null) => void): void;
494
+ registerOnTouched(fn: () => void): void;
495
+ setDisabledState(isDisabled: boolean): void;
496
+ protected openDialog(): void;
497
+ protected closeDialog(): void;
498
+ protected clearSelection(): void;
499
+ protected selectOption(option: JvModalSelectorOption<string>): void;
500
+ protected isSelected(option: JvModalSelectorOption<string>): boolean;
501
+ protected getOptionTabIndex(option: JvModalSelectorOption<string>, index: number): 0 | -1;
502
+ protected optionId(index: number): string;
503
+ protected handleOptionKeydown(event: KeyboardEvent, index: number, option: JvModalSelectorOption<string>): void;
504
+ protected handleBlur(): void;
505
+ private updateValue;
506
+ private focusRelativeOption;
507
+ private focusOptionByIndex;
508
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<JvModalSelectorComponent, never>;
509
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<JvModalSelectorComponent, "jv-modal-selector", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "dialogTitle": { "alias": "dialogTitle"; "required": false; "isSignal": true; }; "dialogSubtitle": { "alias": "dialogSubtitle"; "required": false; "isSignal": true; }; "searchPlaceholder": { "alias": "searchPlaceholder"; "required": false; "isSignal": true; }; "emptyMessage": { "alias": "emptyMessage"; "required": false; "isSignal": true; }; "clearLabel": { "alias": "clearLabel"; "required": false; "isSignal": true; }; "closeLabel": { "alias": "closeLabel"; "required": false; "isSignal": true; }; "showSearch": { "alias": "showSearch"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "error": { "alias": "error"; "required": false; "isSignal": true; }; "describedBy": { "alias": "describedBy"; "required": false; "isSignal": true; }; "inputId": { "alias": "inputId"; "required": false; "isSignal": true; }; "valueInput": { "alias": "value"; "required": false; "isSignal": true; }; }, { "selectionChange": "selectionChange"; }, never, never, true, never>;
510
+ }
511
+
300
512
  declare class JvRadioComponent implements ControlValueAccessor {
301
513
  readonly name: _angular_core.InputSignal<string>;
302
514
  readonly label: _angular_core.InputSignal<string>;
@@ -596,32 +808,15 @@ declare class JvAnnouncementService {
596
808
  static ɵprov: _angular_core.ɵɵInjectableDeclaration<JvAnnouncementService>;
597
809
  }
598
810
 
599
- declare const ES: Record<string, string>;
600
-
601
- declare const EN: Record<string, string>;
602
-
603
- type JvLocale = 'es' | 'en';
604
- declare const JV_LOCALE_DICTIONARIES: Record<JvLocale, Record<string, string>>;
605
- declare const JV_DEFAULT_LOCALE: JvLocale;
606
-
607
- declare class JvTranslationService {
608
- private readonly config;
609
- readonly locale: _angular_core.WritableSignal<JvLocale>;
610
- initialize(): void;
611
- setLocale(locale: JvLocale): void;
612
- translate(key: string, params?: Record<string, string | number>): string;
613
- private resolveLocale;
614
- static ɵfac: _angular_core.ɵɵFactoryDeclaration<JvTranslationService, never>;
615
- static ɵprov: _angular_core.ɵɵInjectableDeclaration<JvTranslationService>;
616
- }
617
-
618
811
  declare class JvListComponent {
619
812
  readonly role: _angular_core.InputSignal<"list" | "navigation">;
813
+ readonly ariaRole: _angular_core.InputSignal<string | null>;
620
814
  readonly variant: _angular_core.InputSignal<"bordered" | null>;
621
815
  readonly ariaLabel: _angular_core.InputSignal<string>;
622
816
  protected readonly variantClass: _angular_core.Signal<string>;
817
+ protected readonly resolvedRole: _angular_core.Signal<string | null>;
623
818
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<JvListComponent, never>;
624
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<JvListComponent, "jv-list", never, { "role": { "alias": "role"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
819
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<JvListComponent, "jv-list", never, { "role": { "alias": "role"; "required": false; "isSignal": true; }; "ariaRole": { "alias": "ariaRole"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
625
820
  }
626
821
 
627
822
  declare class JvListItemComponent {
@@ -645,6 +840,77 @@ interface JvListItemModel<T = any> {
645
840
  leadingIcon?: string;
646
841
  }
647
842
 
843
+ declare class JvTabPanelDirective {
844
+ readonly templateRef: TemplateRef<unknown>;
845
+ readonly id: _angular_core.InputSignal<string>;
846
+ constructor(templateRef: TemplateRef<unknown>);
847
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<JvTabPanelDirective, never>;
848
+ static ɵdir: _angular_core.ɵɵDirectiveDeclaration<JvTabPanelDirective, "ng-template[jvTabPanel]", never, { "id": { "alias": "jvTabPanel"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
849
+ }
850
+
851
+ interface JvTabItem {
852
+ id: string;
853
+ label: string;
854
+ icon?: string;
855
+ disabled?: boolean;
856
+ }
857
+ declare class JvTabsComponent implements AfterViewInit {
858
+ private readonly instanceId;
859
+ private readonly panelTemplates;
860
+ private readonly tabListRef;
861
+ readonly tabs: _angular_core.InputSignal<JvTabItem[]>;
862
+ readonly activeTabId: _angular_core.InputSignal<string | null>;
863
+ readonly keepMounted: _angular_core.InputSignal<boolean>;
864
+ readonly activeTabChange: _angular_core.OutputEmitterRef<string>;
865
+ protected readonly showScrollLeft: _angular_core.WritableSignal<boolean>;
866
+ protected readonly showScrollRight: _angular_core.WritableSignal<boolean>;
867
+ protected readonly resolvedActiveTabId: _angular_core.Signal<string>;
868
+ constructor();
869
+ ngAfterViewInit(): void;
870
+ protected handleWindowResize(): void;
871
+ protected isActive(tabId: string): boolean;
872
+ protected getTabIndex(tabId: string, disabled: boolean): 0 | -1;
873
+ protected activateTab(tabId: string): void;
874
+ protected handleKeydown(event: KeyboardEvent, currentTabId: string): void;
875
+ protected scrollTabs(direction: -1 | 1): void;
876
+ protected updateScrollControls(): void;
877
+ protected panelTemplate(tabId: string): _angular_core.TemplateRef<unknown> | null;
878
+ protected tabButtonId(tabId: string): string;
879
+ protected panelId(tabId: string): string;
880
+ private activateAndFocus;
881
+ private ensureActiveTabVisible;
882
+ private focusTabButton;
883
+ private getTabButton;
884
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<JvTabsComponent, never>;
885
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<JvTabsComponent, "jv-tabs", never, { "tabs": { "alias": "tabs"; "required": false; "isSignal": true; }; "activeTabId": { "alias": "activeTabId"; "required": false; "isSignal": true; }; "keepMounted": { "alias": "keepMounted"; "required": false; "isSignal": true; }; }, { "activeTabChange": "activeTabChange"; }, ["panelTemplates"], never, true, never>;
886
+ }
887
+
888
+ type JvTooltipPosition = 'top' | 'right' | 'bottom' | 'left';
889
+ declare class JvTooltipDirective implements OnDestroy {
890
+ private readonly document;
891
+ private readonly renderer;
892
+ private readonly hostRef;
893
+ private tooltipElement;
894
+ private showTimeout;
895
+ private hideTimeout;
896
+ private readonly tooltipId;
897
+ readonly text: _angular_core.InputSignal<string>;
898
+ readonly position: _angular_core.InputSignal<JvTooltipPosition>;
899
+ protected show(): void;
900
+ protected hide(): void;
901
+ protected handleDocumentKeydown(event: KeyboardEvent): void;
902
+ protected handleViewportChange(): void;
903
+ ngOnDestroy(): void;
904
+ private renderTooltip;
905
+ private positionTooltip;
906
+ private destroyTooltip;
907
+ private anchorElement;
908
+ private clearShowTimeout;
909
+ private clearHideTimeout;
910
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<JvTooltipDirective, never>;
911
+ static ɵdir: _angular_core.ɵɵDirectiveDeclaration<JvTooltipDirective, "[jvTooltip]", never, { "text": { "alias": "jvTooltip"; "required": true; "isSignal": true; }; "position": { "alias": "jvTooltipPosition"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
912
+ }
913
+
648
914
  type JvGridRowId = string | number;
649
915
  type JvGridTrackBy<T> = keyof T | ((row: T, index: number) => JvGridRowId);
650
916
  type JvGridSortDirection = 'asc' | 'desc' | null;
@@ -906,5 +1172,5 @@ declare class JvPaginationComponent {
906
1172
  static ɵcmp: _angular_core.ɵɵComponentDeclaration<JvPaginationComponent, "jv-pagination", never, { "totalItems": { "alias": "totalItems"; "required": true; "isSignal": true; }; "pageSize": { "alias": "pageSize"; "required": false; "isSignal": true; }; "pageSizeOptions": { "alias": "pageSizeOptions"; "required": false; "isSignal": true; }; "pageIndex": { "alias": "pageIndex"; "required": false; "isSignal": true; }; "maxVisiblePages": { "alias": "maxVisiblePages"; "required": false; "isSignal": true; }; }, { "pageChange": "pageChange"; }, never, never, true, never>;
907
1173
  }
908
1174
 
909
- export { EN, ES, JV_DEFAULT_LOCALE, JV_FALLBACK_ICON_NAME, JV_GRID_DEFAULT_OPTIONS, JV_LOCALE_DICTIONARIES, JV_LUCIDE_ICON_REGISTRY, JV_UI_CONFIG, JV_UI_CONFIG_DEFAULTS, JV_UI_DEFAULT_CONFIG, JvAlertComponent, JvAnnouncementService, JvBadgeComponent, JvBreadcrumbComponent, JvButtonComponent, JvButtonGroupComponent, JvCardComponent, JvChangePasswordPageComponent, JvCheckboxComponent, JvConfirmDialogComponent, JvDashboardShellComponent, JvDialogComponent, JvDialogService, JvDividerComponent, JvForgotPasswordPageComponent, JvFormContainerComponent, JvGridComponent, JvIconButtonComponent, JvIconComponent, JvInputComponent, JvListComponent, JvListItemComponent, JvLoaderComponent, JvLoaderService, JvLoginPageComponent, JvPageComponent, JvPaginationComponent, JvRadioComponent, JvSectionComponent, JvSelectComponent, JvSidebarComponent, JvSwitchComponent, JvTextareaComponent, JvThemeService, JvToastComponent, JvToastService, JvTopbarComponent, JvTranslationService, provideJvUi };
910
- export type { JvActiveConfirmDialog, JvBreadcrumbItem, JvChangePasswordSubmitEvent, JvConfirmOptions, JvDensity, JvForgotPasswordSubmitEvent, JvGridAction, JvGridColumn, JvGridColumnFilter, JvGridColumnReorderEvent, JvGridColumnResizeEvent, JvGridColumnWidth, JvGridFilterOperator, JvGridOptions, JvGridPageEvent, JvGridRowEditEvent, JvGridRowId, JvGridSortDirection, JvGridSortState, JvGridTrackBy, JvIconDefinition, JvIconElement, JvIntent, JvListItemModel, JvLoaderState, JvLocale, JvLoginSubmitEvent, JvNavItem, JvPaginationEvent, JvSelectOption, JvTheme, JvThemeOption, JvToastItem, JvToastPosition, JvToastViewport, JvTone, JvTopbarAction, JvUiConfig };
1175
+ export { EN, ES, JV_DEFAULT_LOCALE, JV_FALLBACK_ICON_NAME, JV_GRID_DEFAULT_OPTIONS, JV_LOCALE_DICTIONARIES, JV_LUCIDE_ICON_REGISTRY, JV_UI_CONFIG, JV_UI_CONFIG_DEFAULTS, JV_UI_DEFAULT_CONFIG, JvAccordionComponent, JvAccordionPanelDirective, JvAlertComponent, JvAnnouncementService, JvBadgeComponent, JvBreadcrumbComponent, JvButtonComponent, JvButtonGroupComponent, JvCardComponent, JvChangePasswordPageComponent, JvCheckboxComponent, JvCollapsiblePanelComponent, JvConfirmDialogComponent, JvDashboardShellComponent, JvDatePickerComponent, JvDialogComponent, JvDialogService, JvDividerComponent, JvForgotPasswordPageComponent, JvFormContainerComponent, JvGridComponent, JvIconButtonComponent, JvIconComponent, JvInputComponent, JvListComponent, JvListItemComponent, JvLoaderComponent, JvLoaderService, JvLoginPageComponent, JvModalSelectorComponent, JvPageComponent, JvPaginationComponent, JvRadioComponent, JvSectionComponent, JvSelectComponent, JvSidebarComponent, JvSwitchComponent, JvTabPanelDirective, JvTabsComponent, JvTextareaComponent, JvThemeService, JvToastComponent, JvToastService, JvTooltipDirective, JvTopbarComponent, JvTranslationService, provideJvUi };
1176
+ export type { JvAccordionItem, JvActiveConfirmDialog, JvBreadcrumbItem, JvChangePasswordSubmitEvent, JvCollapsiblePanelVariant, JvConfirmOptions, JvDensity, JvForgotPasswordSubmitEvent, JvGridAction, JvGridColumn, JvGridColumnFilter, JvGridColumnReorderEvent, JvGridColumnResizeEvent, JvGridColumnWidth, JvGridFilterOperator, JvGridOptions, JvGridPageEvent, JvGridRowEditEvent, JvGridRowId, JvGridSortDirection, JvGridSortState, JvGridTrackBy, JvIconDefinition, JvIconElement, JvIntent, JvListItemModel, JvLoaderState, JvLocale, JvLoginSubmitEvent, JvModalSelectorOption, JvNavItem, JvPaginationEvent, JvSelectOption, JvTabItem, JvTheme, JvThemeOption, JvToastItem, JvToastPosition, JvToastViewport, JvTone, JvTooltipPosition, JvTopbarAction, JvUiConfig };