yukit-web 0.0.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.
- package/.npm/_logs/2026-08-20T08_40_55_706Z-debug-0.log +38 -0
- package/.npm/_logs/2026-08-20T08_40_56_280Z-debug-0.log +14 -0
- package/README.md +1465 -0
- package/fesm2022/yukit-web-helm-accordion.mjs +141 -0
- package/fesm2022/yukit-web-helm-accordion.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-alert-dialog.mjs +250 -0
- package/fesm2022/yukit-web-helm-alert-dialog.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-alert.mjs +94 -0
- package/fesm2022/yukit-web-helm-alert.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-aspect-ratio.mjs +47 -0
- package/fesm2022/yukit-web-helm-aspect-ratio.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-attachment.mjs +211 -0
- package/fesm2022/yukit-web-helm-attachment.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-autocomplete.mjs +361 -0
- package/fesm2022/yukit-web-helm-autocomplete.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-avatar.mjs +152 -0
- package/fesm2022/yukit-web-helm-avatar.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-badge.mjs +47 -0
- package/fesm2022/yukit-web-helm-badge.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-breadcrumb.mjs +196 -0
- package/fesm2022/yukit-web-helm-breadcrumb.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-bubble.mjs +121 -0
- package/fesm2022/yukit-web-helm-bubble.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-button-group.mjs +86 -0
- package/fesm2022/yukit-web-helm-button-group.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-button.mjs +77 -0
- package/fesm2022/yukit-web-helm-button.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-calendar.mjs +937 -0
- package/fesm2022/yukit-web-helm-calendar.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-card.mjs +141 -0
- package/fesm2022/yukit-web-helm-card.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-carousel.mjs +270 -0
- package/fesm2022/yukit-web-helm-carousel.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-checkbox.mjs +147 -0
- package/fesm2022/yukit-web-helm-checkbox.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-collapsible.mjs +62 -0
- package/fesm2022/yukit-web-helm-collapsible.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-combobox.mjs +624 -0
- package/fesm2022/yukit-web-helm-combobox.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-command.mjs +315 -0
- package/fesm2022/yukit-web-helm-command.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-context-menu.mjs +71 -0
- package/fesm2022/yukit-web-helm-context-menu.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-date-picker.mjs +1517 -0
- package/fesm2022/yukit-web-helm-date-picker.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-dialog.mjs +271 -0
- package/fesm2022/yukit-web-helm-dialog.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-drawer.mjs +233 -0
- package/fesm2022/yukit-web-helm-drawer.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-dropdown-menu.mjs +508 -0
- package/fesm2022/yukit-web-helm-dropdown-menu.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-empty.mjs +125 -0
- package/fesm2022/yukit-web-helm-empty.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-field.mjs +325 -0
- package/fesm2022/yukit-web-helm-field.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-hover-card.mjs +102 -0
- package/fesm2022/yukit-web-helm-hover-card.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-input-group.mjs +171 -0
- package/fesm2022/yukit-web-helm-input-group.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-input-otp.mjs +127 -0
- package/fesm2022/yukit-web-helm-input-otp.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-input.mjs +32 -0
- package/fesm2022/yukit-web-helm-input.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-item.mjs +242 -0
- package/fesm2022/yukit-web-helm-item.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-kbd.mjs +46 -0
- package/fesm2022/yukit-web-helm-kbd.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-label.mjs +30 -0
- package/fesm2022/yukit-web-helm-label.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-marker.mjs +77 -0
- package/fesm2022/yukit-web-helm-marker.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-menubar.mjs +90 -0
- package/fesm2022/yukit-web-helm-menubar.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-message.mjs +115 -0
- package/fesm2022/yukit-web-helm-message.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-native-select.mjs +180 -0
- package/fesm2022/yukit-web-helm-native-select.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-navigation-menu.mjs +173 -0
- package/fesm2022/yukit-web-helm-navigation-menu.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-pagination.mjs +745 -0
- package/fesm2022/yukit-web-helm-pagination.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-popover.mjs +136 -0
- package/fesm2022/yukit-web-helm-popover.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-progress.mjs +60 -0
- package/fesm2022/yukit-web-helm-progress.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-radio-group.mjs +185 -0
- package/fesm2022/yukit-web-helm-radio-group.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-resizable.mjs +98 -0
- package/fesm2022/yukit-web-helm-resizable.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-scroll-area.mjs +36 -0
- package/fesm2022/yukit-web-helm-scroll-area.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-select.mjs +412 -0
- package/fesm2022/yukit-web-helm-select.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-separator.mjs +33 -0
- package/fesm2022/yukit-web-helm-separator.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-sheet.mjs +254 -0
- package/fesm2022/yukit-web-helm-sheet.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-sidebar.mjs +857 -0
- package/fesm2022/yukit-web-helm-sidebar.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-skeleton.mjs +29 -0
- package/fesm2022/yukit-web-helm-skeleton.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-slider.mjs +123 -0
- package/fesm2022/yukit-web-helm-slider.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-sonner.mjs +126 -0
- package/fesm2022/yukit-web-helm-sonner.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-spinner.mjs +48 -0
- package/fesm2022/yukit-web-helm-spinner.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-switch.mjs +126 -0
- package/fesm2022/yukit-web-helm-switch.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-table.mjs +180 -0
- package/fesm2022/yukit-web-helm-table.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-tabs.mjs +251 -0
- package/fesm2022/yukit-web-helm-tabs.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-textarea.mjs +32 -0
- package/fesm2022/yukit-web-helm-textarea.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-toggle-group.mjs +95 -0
- package/fesm2022/yukit-web-helm-toggle-group.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-toggle.mjs +61 -0
- package/fesm2022/yukit-web-helm-toggle.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-tooltip.mjs +57 -0
- package/fesm2022/yukit-web-helm-tooltip.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-typography.mjs +205 -0
- package/fesm2022/yukit-web-helm-typography.mjs.map +1 -0
- package/fesm2022/yukit-web-helm-utils.mjs +272 -0
- package/fesm2022/yukit-web-helm-utils.mjs.map +1 -0
- package/fesm2022/yukit-web.mjs +3592 -0
- package/fesm2022/yukit-web.mjs.map +1 -0
- package/package.json +291 -0
- package/src/lib/theme/spartan-overwrites/accordion.css +4 -0
- package/src/lib/theme/theme.css +161 -0
- package/src/lib/theme/tokens/color.css +356 -0
- package/src/lib/theme/tokens/component-colors.css +167 -0
- package/src/lib/theme/tokens/radius.css +18 -0
- package/src/lib/theme/tokens/typography.css +201 -0
- package/types/yukit-web-helm-accordion.d.ts +32 -0
- package/types/yukit-web-helm-alert-dialog.d.ts +85 -0
- package/types/yukit-web-helm-alert.d.ts +37 -0
- package/types/yukit-web-helm-aspect-ratio.d.ts +16 -0
- package/types/yukit-web-helm-attachment.d.ts +80 -0
- package/types/yukit-web-helm-autocomplete.d.ts +91 -0
- package/types/yukit-web-helm-avatar.d.ts +45 -0
- package/types/yukit-web-helm-badge.d.ts +19 -0
- package/types/yukit-web-helm-breadcrumb.d.ts +52 -0
- package/types/yukit-web-helm-bubble.d.ts +46 -0
- package/types/yukit-web-helm-button-group.d.ts +25 -0
- package/types/yukit-web-helm-button.d.ts +33 -0
- package/types/yukit-web-helm-calendar.d.ts +89 -0
- package/types/yukit-web-helm-card.d.ts +49 -0
- package/types/yukit-web-helm-carousel.d.ts +79 -0
- package/types/yukit-web-helm-checkbox.d.ts +60 -0
- package/types/yukit-web-helm-collapsible.d.ts +22 -0
- package/types/yukit-web-helm-combobox.d.ts +150 -0
- package/types/yukit-web-helm-command.d.ts +84 -0
- package/types/yukit-web-helm-context-menu.d.ts +29 -0
- package/types/yukit-web-helm-date-picker.d.ts +574 -0
- package/types/yukit-web-helm-dialog.d.ts +90 -0
- package/types/yukit-web-helm-drawer.d.ts +71 -0
- package/types/yukit-web-helm-dropdown-menu.d.ts +171 -0
- package/types/yukit-web-helm-empty.d.ts +49 -0
- package/types/yukit-web-helm-field.d.ts +102 -0
- package/types/yukit-web-helm-hover-card.d.ts +31 -0
- package/types/yukit-web-helm-input-group.d.ts +47 -0
- package/types/yukit-web-helm-input-otp.d.ts +40 -0
- package/types/yukit-web-helm-input.d.ts +13 -0
- package/types/yukit-web-helm-item.d.ts +96 -0
- package/types/yukit-web-helm-kbd.d.ts +17 -0
- package/types/yukit-web-helm-label.d.ts +12 -0
- package/types/yukit-web-helm-marker.d.ts +31 -0
- package/types/yukit-web-helm-menubar.d.ts +35 -0
- package/types/yukit-web-helm-message.d.ts +44 -0
- package/types/yukit-web-helm-native-select.d.ts +65 -0
- package/types/yukit-web-helm-navigation-menu.d.ts +49 -0
- package/types/yukit-web-helm-pagination.d.ts +187 -0
- package/types/yukit-web-helm-popover.d.ts +49 -0
- package/types/yukit-web-helm-progress.d.ts +22 -0
- package/types/yukit-web-helm-radio-group.d.ts +66 -0
- package/types/yukit-web-helm-resizable.d.ts +27 -0
- package/types/yukit-web-helm-scroll-area.d.ts +11 -0
- package/types/yukit-web-helm-select.d.ts +114 -0
- package/types/yukit-web-helm-separator.d.ts +13 -0
- package/types/yukit-web-helm-sheet.d.ts +75 -0
- package/types/yukit-web-helm-sidebar.d.ts +232 -0
- package/types/yukit-web-helm-skeleton.d.ts +11 -0
- package/types/yukit-web-helm-slider.d.ts +14 -0
- package/types/yukit-web-helm-sonner.d.ts +52 -0
- package/types/yukit-web-helm-spinner.d.ts +18 -0
- package/types/yukit-web-helm-switch.d.ts +54 -0
- package/types/yukit-web-helm-table.d.ts +82 -0
- package/types/yukit-web-helm-tabs.d.ts +66 -0
- package/types/yukit-web-helm-textarea.d.ts +13 -0
- package/types/yukit-web-helm-toggle-group.d.ts +34 -0
- package/types/yukit-web-helm-toggle.d.ts +22 -0
- package/types/yukit-web-helm-tooltip.d.ts +17 -0
- package/types/yukit-web-helm-typography.d.ts +89 -0
- package/types/yukit-web-helm-utils.d.ts +44 -0
- package/types/yukit-web.d.ts +2426 -0
|
@@ -0,0 +1,2426 @@
|
|
|
1
|
+
import { ClassValue } from 'clsx';
|
|
2
|
+
import * as _angular_core from '@angular/core';
|
|
3
|
+
import { ModelSignal, Type, Provider, InputSignal, InputSignalWithTransform, TemplateRef, OnInit } from '@angular/core';
|
|
4
|
+
import { ControlValueAccessor } from '@angular/forms';
|
|
5
|
+
import { ButtonVariants } from 'yukit-web/helm/button';
|
|
6
|
+
import * as i1 from 'yukit-web/helm/badge';
|
|
7
|
+
import * as yukit_web from 'yukit-web';
|
|
8
|
+
import { HlmAccordion, HlmAccordionItem } from 'yukit-web/helm/accordion';
|
|
9
|
+
import { HlmLabel } from 'yukit-web/helm/label';
|
|
10
|
+
import * as i1$1 from 'yukit-web/helm/skeleton';
|
|
11
|
+
import * as i1$2 from 'yukit-web/helm/card';
|
|
12
|
+
import * as i1$3 from 'yukit-web/helm/empty';
|
|
13
|
+
import * as i1$4 from 'yukit-web/helm/context-menu';
|
|
14
|
+
import * as i2 from 'yukit-web/helm/dropdown-menu';
|
|
15
|
+
import * as i1$5 from 'yukit-web/helm/table';
|
|
16
|
+
import * as _tanstack_angular_table from '@tanstack/angular-table';
|
|
17
|
+
import { columnFilteringFeature, columnVisibilityFeature, rowPaginationFeature, rowSelectionFeature, rowSortingFeature, RowData, ColumnDef, SortingState, ColumnFiltersState, ColumnVisibilityState, RowSelectionState, PaginationState } from '@tanstack/table-core';
|
|
18
|
+
import * as i1$6 from 'yukit-web/helm/item';
|
|
19
|
+
import { HlmItemSeparator } from 'yukit-web/helm/item';
|
|
20
|
+
import * as i1$7 from '@spartan-ng/brain/tooltip';
|
|
21
|
+
import { ToastOptions } from '@spartan-ng/brain/sonner';
|
|
22
|
+
export { toast as yuwToast } from '@spartan-ng/brain/sonner';
|
|
23
|
+
import * as i1$8 from 'yukit-web/helm/attachment';
|
|
24
|
+
import { HlmAttachmentAction } from 'yukit-web/helm/attachment';
|
|
25
|
+
import * as i1$9 from 'yukit-web/helm/sidebar';
|
|
26
|
+
export { HlmSidebarConfig as YuwSidebarConfigDto, HlmSidebarService as YuwSidebarService, SidebarVariant as YuwSidebarServiceVariantDto, provideHlmSidebarConfig as provideYuwSidebarConfig } from 'yukit-web/helm/sidebar';
|
|
27
|
+
|
|
28
|
+
/**
|
|
29
|
+
* Merges class lists the shadcn/Spartan way: `clsx` resolves conditionals/arrays, `twMerge`
|
|
30
|
+
* then drops earlier Tailwind classes that a later one overrides (e.g. `px-3 ... px-4` keeps
|
|
31
|
+
* only `px-4`) instead of shipping both to the DOM.
|
|
32
|
+
*
|
|
33
|
+
* Every yukit-web component's variant classes are combined through this, so a consumer's own
|
|
34
|
+
* `class` input always wins over the component's defaults without fighting specificity.
|
|
35
|
+
*/
|
|
36
|
+
declare function cn(...inputs: ClassValue[]): string;
|
|
37
|
+
|
|
38
|
+
/**
|
|
39
|
+
* Registers a component as a form control, so `formControlName`/`formControl`/`ngModel` bind to it.
|
|
40
|
+
*
|
|
41
|
+
* Spartan's own controls mostly don't need this: `hlmInput` and `hlmTextarea` are *directives on a
|
|
42
|
+
* native element*, so Angular's built-in `DefaultValueAccessor` already applies to the same host.
|
|
43
|
+
* The moment we wrap that native element inside a component template, the host a consumer writes
|
|
44
|
+
* `formControlName` on is no longer the `<input>` — Angular finds no accessor there and throws
|
|
45
|
+
* `NG01203`. This restores what the wrapping cost us.
|
|
46
|
+
*
|
|
47
|
+
* Kept as a `useExisting` + `forwardRef` provider because the class is referenced in its own
|
|
48
|
+
* decorator metadata, before the class binding is initialized.
|
|
49
|
+
*/
|
|
50
|
+
declare function provideValueAccessor(component: Type<unknown>): Provider;
|
|
51
|
+
/**
|
|
52
|
+
* Shared `ControlValueAccessor` for the library's text-entry controls.
|
|
53
|
+
*
|
|
54
|
+
* Exists so the five text components don't each carry a near-identical copy of the same CVA
|
|
55
|
+
* plumbing — the single-responsibility and DRY concerns in `agents.md`. Subclasses supply nothing;
|
|
56
|
+
* they just extend it, add the provider, and bind `value`/`_onBlur()` in their template.
|
|
57
|
+
*
|
|
58
|
+
* ## Why `disabled` needs care
|
|
59
|
+
*
|
|
60
|
+
* `disabled` has two sources that don't know about each other: our own `disabled` input, and the
|
|
61
|
+
* forms API calling `setDisabledState()` (which is what `new FormControl({value, disabled: true})`
|
|
62
|
+
* and `control.disable()` go through). Letting either one own a single signal means the last
|
|
63
|
+
* writer wins and the other is silently ignored — the classic bug in hand-rolled accessors.
|
|
64
|
+
*
|
|
65
|
+
* They're kept as two separate signals and OR'd together in `disabledState`: disabled by *either*
|
|
66
|
+
* source means disabled. That's the only combination that never drops a caller's intent.
|
|
67
|
+
*/
|
|
68
|
+
declare abstract class YuwValueAccessorBase<T> implements ControlValueAccessor {
|
|
69
|
+
abstract readonly value: ModelSignal<T>;
|
|
70
|
+
protected abstract _emptyValue(): T;
|
|
71
|
+
protected readonly _formDisabled: _angular_core.WritableSignal<boolean>;
|
|
72
|
+
private _onChange;
|
|
73
|
+
private _onTouched;
|
|
74
|
+
protected _isDisabled(ownDisabled: boolean): boolean;
|
|
75
|
+
protected _commit(next: T): void;
|
|
76
|
+
protected _onBlur(): void;
|
|
77
|
+
writeValue(value: T | null | undefined): void;
|
|
78
|
+
registerOnChange(fn: (value: T) => void): void;
|
|
79
|
+
registerOnTouched(fn: () => void): void;
|
|
80
|
+
setDisabledState(isDisabled: boolean): void;
|
|
81
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwValueAccessorBase<any>, never>;
|
|
82
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwValueAccessorBase<any>, never, never, {}, {}, never, never, true, never>;
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
type YuwInputTypeDto = 'text' | 'email' | 'tel' | 'url' | 'number';
|
|
86
|
+
type YuwInputModeDto = 'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url';
|
|
87
|
+
interface YuwTextFieldContract {
|
|
88
|
+
readonly value: ModelSignal<string>;
|
|
89
|
+
readonly inputId: InputSignal<string | undefined>;
|
|
90
|
+
readonly placeholder: InputSignal<string | undefined>;
|
|
91
|
+
readonly disabled: InputSignalWithTransform<boolean, unknown>;
|
|
92
|
+
readonly readonly: InputSignalWithTransform<boolean, unknown>;
|
|
93
|
+
readonly required: InputSignalWithTransform<boolean, unknown>;
|
|
94
|
+
readonly invalid: InputSignalWithTransform<boolean, unknown>;
|
|
95
|
+
readonly name: InputSignal<string | undefined>;
|
|
96
|
+
readonly autocomplete: InputSignal<string | undefined>;
|
|
97
|
+
}
|
|
98
|
+
|
|
99
|
+
type YuwColorDto = 'primary' | 'secondary' | 'destructive' | 'success' | 'warning' | 'info' | 'muted' | 'violet';
|
|
100
|
+
|
|
101
|
+
/**
|
|
102
|
+
* A single entry in `<yuw-button>`'s `buttons` input, which turns it into a welded button group.
|
|
103
|
+
*
|
|
104
|
+
* variant`, `size` and `color` are optional and fall back to the component-level inputs of the
|
|
105
|
+
* same name, so a uniform row stays `{id, label}` entries plus one `variant`, and only the odd
|
|
106
|
+
* one out carries its own.
|
|
107
|
+
*
|
|
108
|
+
* `label` is data the parent supplies, not a component-owned default — the same i18n rule
|
|
109
|
+
* `YuwBreadcrumbItemDto` and `YuwSelectOptionDto` follow.
|
|
110
|
+
*/
|
|
111
|
+
interface YuwButtonGroupItemDto {
|
|
112
|
+
id: string;
|
|
113
|
+
label: string;
|
|
114
|
+
variant?: ButtonVariants['variant'];
|
|
115
|
+
size?: ButtonVariants['size'];
|
|
116
|
+
color?: YuwColorDto;
|
|
117
|
+
disabled?: boolean;
|
|
118
|
+
href?: string;
|
|
119
|
+
target?: string;
|
|
120
|
+
type?: 'button' | 'submit' | 'reset';
|
|
121
|
+
ariaLabel?: string;
|
|
122
|
+
yuwDropdownMenuTrigger?: TemplateRef<unknown> | undefined;
|
|
123
|
+
transparent?: boolean;
|
|
124
|
+
}
|
|
125
|
+
/** What `<yuw-button>` emits from `buttonClicked` in the group form. */
|
|
126
|
+
interface YuwButtonGroupClickDto {
|
|
127
|
+
id: string;
|
|
128
|
+
event: MouseEvent;
|
|
129
|
+
}
|
|
130
|
+
|
|
131
|
+
/**
|
|
132
|
+
* Button component supporting single action button or grouped button options.
|
|
133
|
+
*
|
|
134
|
+
* Inputs:
|
|
135
|
+
* - `variant`: Button style variant (`'default'`, `'secondary'`, `'outline'`, `'destructive'`, `'ghost'`, `'link'`). Default is `'default'`.
|
|
136
|
+
* - `size`: Button size (`'default'`, `'sm'`, `'lg'`, `'icon'`, etc.). Default is `'default'`.
|
|
137
|
+
* - `color`: Brand color theme (any `YuwColorDto` value). Default is `'secondary'`.
|
|
138
|
+
* - `disabled`: Disables button interactions.
|
|
139
|
+
* - `type`: HTML button type (`'button'`, `'submit'`, `'reset'`). Default is `'button'`.
|
|
140
|
+
* - `href`: Renders button as an anchor tag navigating to specified URL.
|
|
141
|
+
* - `target`: Target attribute for link button (e.g. `'_blank'`).
|
|
142
|
+
* - `transparent`: Removes background and border styling.
|
|
143
|
+
* - `class`: Extra CSS classes merged onto the inner button/anchor (single and link mode); merged last, so they win over the component's own classes.
|
|
144
|
+
* - `yuwDropdownMenuTrigger`: Optional dropdown menu template reference to trigger.
|
|
145
|
+
* - `ariaLabel`: Accessible label for screen readers.
|
|
146
|
+
* - `buttons`: Array of button items (`YuwButtonGroupItemDto[]`) to render as a welded button group.
|
|
147
|
+
* - `orientation`: Group layout orientation (`'horizontal'` or `'vertical'`). Default is `'horizontal'`.
|
|
148
|
+
* - `groupAriaLabel`: Accessible name for button group container.
|
|
149
|
+
*
|
|
150
|
+
* Outputs:
|
|
151
|
+
* - `clicked`: Emits MouseEvent on single button click.
|
|
152
|
+
* - `buttonClicked`: Emits object containing clicked button `id` and `event` in group mode.
|
|
153
|
+
*
|
|
154
|
+
* Single Button Usage:
|
|
155
|
+
* ```html
|
|
156
|
+
* <yuw-button variant="outline" color="primary" (clicked)="onSave()">Save</yuw-button>
|
|
157
|
+
* <yuw-button href="/dashboard">Navigate</yuw-button>
|
|
158
|
+
* ```
|
|
159
|
+
*
|
|
160
|
+
* Button Group Usage:
|
|
161
|
+
* ```html
|
|
162
|
+
* <yuw-button [buttons]="actionList" (buttonClicked)="onAction($event)" />
|
|
163
|
+
* ```
|
|
164
|
+
*/
|
|
165
|
+
declare class YuwButtonComponent {
|
|
166
|
+
readonly variant: _angular_core.InputSignal<"secondary" | "destructive" | "default" | "outline" | "ghost" | "link" | null | undefined>;
|
|
167
|
+
readonly size: _angular_core.InputSignal<"default" | "xs" | "sm" | "lg" | "icon" | "icon-xs" | "icon-sm" | "icon-lg" | null | undefined>;
|
|
168
|
+
readonly color: _angular_core.InputSignal<YuwColorDto>;
|
|
169
|
+
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
170
|
+
readonly type: _angular_core.InputSignal<"button" | "submit" | "reset">;
|
|
171
|
+
readonly href: _angular_core.InputSignal<string | undefined>;
|
|
172
|
+
readonly target: _angular_core.InputSignal<string | undefined>;
|
|
173
|
+
readonly transparent: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
174
|
+
readonly yuwDropdownMenuTrigger: _angular_core.InputSignal<TemplateRef<unknown> | undefined>;
|
|
175
|
+
readonly ariaLabel: _angular_core.InputSignal<string | undefined>;
|
|
176
|
+
readonly buttons: _angular_core.InputSignal<YuwButtonGroupItemDto[] | undefined>;
|
|
177
|
+
readonly orientation: _angular_core.InputSignal<"horizontal" | "vertical">;
|
|
178
|
+
readonly groupAriaLabel: _angular_core.InputSignal<string | undefined>;
|
|
179
|
+
/**
|
|
180
|
+
* Consumer CSS classes for the inner button/anchor (single and link mode). Merged last with
|
|
181
|
+
* `cn`, so they win over the component's own variant/transparent classes.
|
|
182
|
+
*/
|
|
183
|
+
readonly userClass: _angular_core.InputSignal<string>;
|
|
184
|
+
readonly clicked: _angular_core.OutputEmitterRef<MouseEvent>;
|
|
185
|
+
readonly buttonClicked: _angular_core.OutputEmitterRef<YuwButtonGroupClickDto>;
|
|
186
|
+
protected readonly _isGroup: _angular_core.Signal<boolean>;
|
|
187
|
+
/** Classes for the single-mode button/anchor: our variant layer + the consumer's `class`, which goes last so it wins. */
|
|
188
|
+
protected readonly _btnClass: _angular_core.Signal<string>;
|
|
189
|
+
protected readonly _resolved: _angular_core.Signal<{
|
|
190
|
+
variant: "secondary" | "destructive" | "default" | "outline" | "ghost" | "link" | null | undefined;
|
|
191
|
+
size: "default" | "xs" | "sm" | "lg" | "icon" | "icon-xs" | "icon-sm" | "icon-lg" | null | undefined;
|
|
192
|
+
color: YuwColorDto;
|
|
193
|
+
disabled: boolean;
|
|
194
|
+
type: "button" | "submit" | "reset";
|
|
195
|
+
class: string;
|
|
196
|
+
id: string;
|
|
197
|
+
label: string;
|
|
198
|
+
href?: string;
|
|
199
|
+
target?: string;
|
|
200
|
+
ariaLabel?: string;
|
|
201
|
+
yuwDropdownMenuTrigger?: TemplateRef<unknown> | undefined;
|
|
202
|
+
transparent?: boolean;
|
|
203
|
+
}[]>;
|
|
204
|
+
protected onClick(event: MouseEvent): void;
|
|
205
|
+
protected onGroupClick(button: YuwButtonGroupItemDto, event: MouseEvent): void;
|
|
206
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwButtonComponent, never>;
|
|
207
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<YuwButtonComponent, "yuw-button", never, { "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "href": { "alias": "href"; "required": false; "isSignal": true; }; "target": { "alias": "target"; "required": false; "isSignal": true; }; "transparent": { "alias": "transparent"; "required": false; "isSignal": true; }; "yuwDropdownMenuTrigger": { "alias": "yuwDropdownMenuTrigger"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "buttons": { "alias": "buttons"; "required": false; "isSignal": true; }; "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; "groupAriaLabel": { "alias": "groupAriaLabel"; "required": false; "isSignal": true; }; "userClass": { "alias": "class"; "required": false; "isSignal": true; }; }, { "clicked": "clicked"; "buttonClicked": "buttonClicked"; }, never, ["[yuwButtonIcon]", "*", "[yuwButtonIcon]", "*"], true, never>;
|
|
208
|
+
}
|
|
209
|
+
|
|
210
|
+
/**
|
|
211
|
+
* Renders a small badge or tag component for status indicators, counts, and category labels.
|
|
212
|
+
*
|
|
213
|
+
* Supports the shared color vocabulary (`color`, any `YuwColorDto` value), variant styles
|
|
214
|
+
* (`variant`), dismissible action (`removeLabel` / `removed`), and a compact dot mode (`dot`)
|
|
215
|
+
* that renders no content at all.
|
|
216
|
+
*
|
|
217
|
+
* Usage:
|
|
218
|
+
* ```html
|
|
219
|
+
* <yuw-badge color="primary">New</yuw-badge>
|
|
220
|
+
* <yuw-badge removeLabel="Remove tag" (removed)="onRemove()">Category</yuw-badge>
|
|
221
|
+
* <yuw-badge dot color="success" />
|
|
222
|
+
* ```
|
|
223
|
+
*/
|
|
224
|
+
declare class YuwBadgeComponent {
|
|
225
|
+
readonly color: _angular_core.InputSignal<YuwColorDto>;
|
|
226
|
+
readonly removeLabel: _angular_core.InputSignal<string | undefined>;
|
|
227
|
+
readonly dot: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
228
|
+
readonly removed: _angular_core.OutputEmitterRef<void>;
|
|
229
|
+
protected readonly dotClass: _angular_core.Signal<"" | "size-4 p-0">;
|
|
230
|
+
protected onRemoveClick(event: Event): void;
|
|
231
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwBadgeComponent, never>;
|
|
232
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<YuwBadgeComponent, "yuw-badge", never, { "color": { "alias": "color"; "required": false; "isSignal": true; }; "removeLabel": { "alias": "removeLabel"; "required": false; "isSignal": true; }; "dot": { "alias": "dot"; "required": false; "isSignal": true; }; }, { "removed": "removed"; }, never, ["[yuwBadgeIcon]", "*"], true, [{ directive: typeof i1.HlmBadge; inputs: { "variant": "variant"; }; outputs: {}; }]>;
|
|
233
|
+
}
|
|
234
|
+
|
|
235
|
+
/** A single crumb in `<yuw-breadcrumb>`'s `items` input. */
|
|
236
|
+
interface YuwBreadcrumbItemDto {
|
|
237
|
+
label: string;
|
|
238
|
+
href?: string;
|
|
239
|
+
}
|
|
240
|
+
|
|
241
|
+
/**
|
|
242
|
+
* Navigation breadcrumb bar displaying page hierarchy and links.
|
|
243
|
+
*
|
|
244
|
+
* Accepts an array of item objects (`items`), custom separator text (`separator`), and a required
|
|
245
|
+
* accessible label (`ariaLabel`). The last item is announced as the current page
|
|
246
|
+
* (`aria-current="page"`); intermediate items render as links when they have an `href` and as
|
|
247
|
+
* plain text otherwise.
|
|
248
|
+
*
|
|
249
|
+
* Usage:
|
|
250
|
+
* ```html
|
|
251
|
+
* <yuw-breadcrumb
|
|
252
|
+
* [items]="[{ label: 'Inicio', href: '/' }, { label: 'Ajustes' }]"
|
|
253
|
+
* ariaLabel="Ruta de navegación"
|
|
254
|
+
* />
|
|
255
|
+
* ```
|
|
256
|
+
*/
|
|
257
|
+
declare class YuwBreadcrumbComponent {
|
|
258
|
+
readonly items: _angular_core.InputSignal<YuwBreadcrumbItemDto[]>;
|
|
259
|
+
readonly separator: _angular_core.InputSignal<string>;
|
|
260
|
+
readonly ariaLabel: _angular_core.InputSignal<string>;
|
|
261
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwBreadcrumbComponent, never>;
|
|
262
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<YuwBreadcrumbComponent, "yuw-breadcrumb", never, { "items": { "alias": "items"; "required": true; "isSignal": true; }; "separator": { "alias": "separator"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
263
|
+
}
|
|
264
|
+
|
|
265
|
+
/**
|
|
266
|
+
* Sizes accepted by `<yuw-pagination>`'s `size` input. Mirrors the helm button sizes so the
|
|
267
|
+
* public API doesn't leak the helm's `ButtonVariants` type.
|
|
268
|
+
*/
|
|
269
|
+
type YuwPaginationSizeDto = 'default' | 'xs' | 'sm' | 'lg' | 'icon' | 'icon-xs' | 'icon-sm' | 'icon-lg';
|
|
270
|
+
/**
|
|
271
|
+
* Pagination navigation bar for navigating multi-page content datasets.
|
|
272
|
+
*
|
|
273
|
+
* Controls two-way active page state `[(page)]`, accepts total pages (`totalPages`), accessible
|
|
274
|
+
* previous/next/ellipsis labels, size and color theme.
|
|
275
|
+
*
|
|
276
|
+
* Usage:
|
|
277
|
+
* ```html
|
|
278
|
+
* <yuw-pagination
|
|
279
|
+
* [(page)]="currentPage"
|
|
280
|
+
* [totalPages]="10"
|
|
281
|
+
* previousLabel="Página anterior"
|
|
282
|
+
* nextLabel="Página siguiente"
|
|
283
|
+
* ellipsisSrText="Más páginas"
|
|
284
|
+
* />
|
|
285
|
+
* ```
|
|
286
|
+
*/
|
|
287
|
+
declare class YuwPaginationComponent {
|
|
288
|
+
readonly page: _angular_core.ModelSignal<number>;
|
|
289
|
+
readonly totalPages: _angular_core.InputSignal<number>;
|
|
290
|
+
readonly previousLabel: _angular_core.InputSignal<string>;
|
|
291
|
+
readonly nextLabel: _angular_core.InputSignal<string>;
|
|
292
|
+
readonly ellipsisSrText: _angular_core.InputSignal<string>;
|
|
293
|
+
readonly size: _angular_core.InputSignal<YuwPaginationSizeDto>;
|
|
294
|
+
readonly color: _angular_core.InputSignal<YuwColorDto>;
|
|
295
|
+
readonly ariaLabel: _angular_core.InputSignal<string>;
|
|
296
|
+
protected readonly range: _angular_core.Signal<yukit_web.YuwPaginationRangeItem[]>;
|
|
297
|
+
protected goTo(target: number): void;
|
|
298
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwPaginationComponent, never>;
|
|
299
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<YuwPaginationComponent, "yuw-pagination", never, { "page": { "alias": "page"; "required": true; "isSignal": true; }; "totalPages": { "alias": "totalPages"; "required": true; "isSignal": true; }; "previousLabel": { "alias": "previousLabel"; "required": true; "isSignal": true; }; "nextLabel": { "alias": "nextLabel"; "required": true; "isSignal": true; }; "ellipsisSrText": { "alias": "ellipsisSrText"; "required": true; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": true; "isSignal": true; }; }, { "page": "pageChange"; }, never, never, true, never>;
|
|
300
|
+
}
|
|
301
|
+
|
|
302
|
+
type YuwPaginationRangeItem = number | 'ellipsis';
|
|
303
|
+
/**
|
|
304
|
+
* Pure function on purpose: the page-range math has nothing to do with Angular, so it's testable
|
|
305
|
+
* in isolation and keeps `pagination.component.ts` limited to wiring inputs/outputs.
|
|
306
|
+
*
|
|
307
|
+
* Always shows page 1 and the last page, plus the current page and its immediate neighbors,
|
|
308
|
+
* collapsing any gap into a single `'ellipsis'` entry.
|
|
309
|
+
*/
|
|
310
|
+
declare function getPaginationRange(page: number, totalPages: number): YuwPaginationRangeItem[];
|
|
311
|
+
|
|
312
|
+
/**
|
|
313
|
+
* A single entry in `<yuw-combobox>`'s `options` input.
|
|
314
|
+
*
|
|
315
|
+
* `label` is data the parent supplies, not a component-owned default — the same rule
|
|
316
|
+
* `YuwSelectOptionDto` and `YuwBreadcrumbItemDto` follow. It doubles as the text the search
|
|
317
|
+
* filters on and the text shown in the trigger/chip once selected, so it must be the
|
|
318
|
+
* already-translated string.
|
|
319
|
+
*
|
|
320
|
+
* `data` carries whatever the consumer needs when rendering a custom item template
|
|
321
|
+
* (`*yuwComboboxItem`) — an avatar URL, a count, a nested entity. The component itself never
|
|
322
|
+
* reads it.
|
|
323
|
+
*/
|
|
324
|
+
interface YuwComboboxOptionDto<TData = unknown> {
|
|
325
|
+
value: string;
|
|
326
|
+
label: string;
|
|
327
|
+
disabled?: boolean;
|
|
328
|
+
data?: TData;
|
|
329
|
+
}
|
|
330
|
+
|
|
331
|
+
/** The `let-` context of a `*yuwComboboxItem` template. `$implicit` is the option itself, so
|
|
332
|
+
* `let-option` works; `selected` is passed alongside because an item that renders its own
|
|
333
|
+
* markup loses the default check glyph and often needs to show that state some other way. */
|
|
334
|
+
interface YuwComboboxItemContext<TData = unknown> {
|
|
335
|
+
$implicit: YuwComboboxOptionDto<TData>;
|
|
336
|
+
option: YuwComboboxOptionDto<TData>;
|
|
337
|
+
selected: boolean;
|
|
338
|
+
}
|
|
339
|
+
/**
|
|
340
|
+
* Structural directive for custom option item templates in `yuw-combobox`.
|
|
341
|
+
*
|
|
342
|
+
* Exposes the option object (`let-option`) and selection state (`let-selected="selected"`).
|
|
343
|
+
*
|
|
344
|
+
* Usage:
|
|
345
|
+
* ```html
|
|
346
|
+
* <yuw-combobox [options]="users" [(value)]="userId">
|
|
347
|
+
* <ng-template yuwComboboxItem let-option let-selected="selected">
|
|
348
|
+
* <img [src]="option.data.avatar" /> {{ option.label }}
|
|
349
|
+
* </ng-template>
|
|
350
|
+
* </yuw-combobox>
|
|
351
|
+
* ```
|
|
352
|
+
*/
|
|
353
|
+
declare class YuwComboboxItemDirective<TData = unknown> {
|
|
354
|
+
readonly templateRef: TemplateRef<YuwComboboxItemContext<TData>>;
|
|
355
|
+
readonly typeOf: _angular_core.InputSignal<YuwComboboxOptionDto<TData>[] | undefined>;
|
|
356
|
+
static ngTemplateContextGuard<TData>(_directive: YuwComboboxItemDirective<TData>, _context: unknown): _context is YuwComboboxItemContext<TData>;
|
|
357
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwComboboxItemDirective<any>, never>;
|
|
358
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwComboboxItemDirective<any>, "[yuwComboboxItem]", never, { "typeOf": { "alias": "yuwComboboxItemTypeOf"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
359
|
+
}
|
|
360
|
+
|
|
361
|
+
type YuwComboboxValue = string | string[] | undefined;
|
|
362
|
+
/**
|
|
363
|
+
* Searchable select combobox component supporting single or multiple selections, search filtering, and custom option rendering.
|
|
364
|
+
*
|
|
365
|
+
* Inputs / Models:
|
|
366
|
+
* - `options`: Required array of option items (`YuwComboboxOptionDto<TData>[]`).
|
|
367
|
+
* - `value`: Two-way selected value(s) (`string` for single mode, `string[]` for multiple mode).
|
|
368
|
+
* Emits `valueChange` on every selection change.
|
|
369
|
+
* - `multiple`: Enables multi-selection mode with removable tags/chips.
|
|
370
|
+
* - `disabled`: Disables combobox interaction.
|
|
371
|
+
* - `placeholder`: Placeholder text when no option is selected.
|
|
372
|
+
* - `searchPlaceholder`: Placeholder text inside the search field popover.
|
|
373
|
+
* - `emptyText`: Message text displayed when search yields no matching options.
|
|
374
|
+
* - `search`: Two-way search filter query string.
|
|
375
|
+
* - `triggerAriaLabel`: Required accessible name for the icon-only popover trigger (the chevron
|
|
376
|
+
* button). User-facing text — the consuming app is responsible for providing it translated.
|
|
377
|
+
* Only rendered by the single-select input shape, but required in every mode so switching
|
|
378
|
+
* modes never silently drops the label.
|
|
379
|
+
* - `clearAriaLabel`: When set, the clear button is shown on the single-selection control and
|
|
380
|
+
* this is its accessible name; when absent, there is no clear button. One input, one source of
|
|
381
|
+
* truth. User-facing text — the consuming app is responsible for providing it translated.
|
|
382
|
+
* - `inputId`: HTML `id` for the focusable control (the search input, or the trigger button when
|
|
383
|
+
* `readonlyTrigger` is set), enabling external `<label for="...">` association.
|
|
384
|
+
* - `readonlyTrigger`: Renders control as a button showing selected label, placing search input inside popover.
|
|
385
|
+
* - `invalid`: Forces invalid styling.
|
|
386
|
+
*
|
|
387
|
+
* `multiple` takes precedence over `readonlyTrigger`: when both are set the multi-select
|
|
388
|
+
* chips shape renders and `readonlyTrigger` is ignored.
|
|
389
|
+
*
|
|
390
|
+
* Usage:
|
|
391
|
+
* ```html
|
|
392
|
+
* <yuw-combobox [options]="userOptions" [(value)]="selectedUser" placeholder="Select user..."
|
|
393
|
+
* triggerAriaLabel="Toggle options" clearAriaLabel="Clear selection" />
|
|
394
|
+
* <yuw-combobox [options]="categoryOptions" [(value)]="selectedCategories" multiple
|
|
395
|
+
* triggerAriaLabel="Toggle options" />
|
|
396
|
+
* ```
|
|
397
|
+
*/
|
|
398
|
+
declare class YuwComboboxComponent<TData = unknown> extends YuwValueAccessorBase<YuwComboboxValue> {
|
|
399
|
+
readonly options: _angular_core.InputSignal<YuwComboboxOptionDto<TData>[]>;
|
|
400
|
+
readonly value: _angular_core.ModelSignal<YuwComboboxValue>;
|
|
401
|
+
readonly multiple: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
402
|
+
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
403
|
+
readonly placeholder: _angular_core.InputSignal<string | undefined>;
|
|
404
|
+
readonly searchPlaceholder: _angular_core.InputSignal<string | undefined>;
|
|
405
|
+
readonly emptyText: _angular_core.InputSignal<string | undefined>;
|
|
406
|
+
readonly search: _angular_core.ModelSignal<string>;
|
|
407
|
+
readonly triggerAriaLabel: _angular_core.InputSignal<string>;
|
|
408
|
+
readonly clearAriaLabel: _angular_core.InputSignal<string | undefined>;
|
|
409
|
+
readonly inputId: _angular_core.InputSignal<string | undefined>;
|
|
410
|
+
readonly readonlyTrigger: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
411
|
+
readonly invalid: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
412
|
+
protected readonly itemTemplate: _angular_core.Signal<YuwComboboxItemDirective<TData> | undefined>;
|
|
413
|
+
private readonly _panel;
|
|
414
|
+
protected readonly _disabled: _angular_core.Signal<boolean>;
|
|
415
|
+
protected readonly _clearVisible: _angular_core.Signal<boolean>;
|
|
416
|
+
private readonly _generatedId;
|
|
417
|
+
protected readonly _controlId: _angular_core.Signal<string>;
|
|
418
|
+
protected readonly _singleValue: _angular_core.Signal<string | undefined>;
|
|
419
|
+
protected readonly _multipleValue: _angular_core.Signal<string[]>;
|
|
420
|
+
private readonly _labelByValue;
|
|
421
|
+
protected readonly _selectedChips: _angular_core.Signal<{
|
|
422
|
+
value: string;
|
|
423
|
+
label: string;
|
|
424
|
+
}[]>;
|
|
425
|
+
protected readonly _selectedValues: _angular_core.Signal<Set<string>>;
|
|
426
|
+
protected readonly _itemToString: (value: string) => string;
|
|
427
|
+
protected _emptyValue(): YuwComboboxValue;
|
|
428
|
+
protected onValueChange(next: YuwComboboxValue | null): void;
|
|
429
|
+
protected _onFocusOut(event: FocusEvent): void;
|
|
430
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwComboboxComponent<any>, never>;
|
|
431
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<YuwComboboxComponent<any>, "yuw-combobox", never, { "options": { "alias": "options"; "required": true; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "searchPlaceholder": { "alias": "searchPlaceholder"; "required": false; "isSignal": true; }; "emptyText": { "alias": "emptyText"; "required": false; "isSignal": true; }; "search": { "alias": "search"; "required": false; "isSignal": true; }; "triggerAriaLabel": { "alias": "triggerAriaLabel"; "required": true; "isSignal": true; }; "clearAriaLabel": { "alias": "clearAriaLabel"; "required": false; "isSignal": true; }; "inputId": { "alias": "inputId"; "required": false; "isSignal": true; }; "readonlyTrigger": { "alias": "readonlyTrigger"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "search": "searchChange"; }, ["itemTemplate"], never, true, never>;
|
|
432
|
+
}
|
|
433
|
+
|
|
434
|
+
/**
|
|
435
|
+
* Container directive for collapsible accordion items.
|
|
436
|
+
*
|
|
437
|
+
* Renders a full-width flexible vertical container for `yuw-accordion-item` elements.
|
|
438
|
+
* Supports single (`type="single"`) or multiple (`type="multiple"`) expandable items,
|
|
439
|
+
* as well as vertical or horizontal orientation (`orientation`).
|
|
440
|
+
*
|
|
441
|
+
* Direct child items (`yuw-accordion-item`) can be declared statically or rendered dynamically
|
|
442
|
+
* using `@for`.
|
|
443
|
+
*
|
|
444
|
+
* Extends `HlmAccordion` (instead of re-applying `BrnAccordion` and copying the helm's classes
|
|
445
|
+
* by hand) so the helm's `data-slot`, classes and its `BrnAccordion` host directive — including
|
|
446
|
+
* the forwarded `type`/`orientation` inputs — are all inherited. Forwarding those inputs through
|
|
447
|
+
* a `hostDirectives` entry on `HlmAccordion` is not possible: Angular only allows exposing
|
|
448
|
+
* inputs a host directive declares itself, and the helm exposes them transitively from
|
|
449
|
+
* `BrnAccordion`.
|
|
450
|
+
*/
|
|
451
|
+
declare class YuwAccordion extends HlmAccordion {
|
|
452
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwAccordion, never>;
|
|
453
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwAccordion, "yuw-accordion", never, {}, {}, never, never, true, never>;
|
|
454
|
+
}
|
|
455
|
+
|
|
456
|
+
/**
|
|
457
|
+
* Directive representing an individual section/item within a `yuw-accordion`.
|
|
458
|
+
*
|
|
459
|
+
* Encloses a `yuw-accordion-trigger` button and a `yuw-accordion-content` panel.
|
|
460
|
+
* Accepts `isOpened` (boolean) to control open state and `disabled` (boolean) to disable
|
|
461
|
+
* interaction. Emits `openedChange` when the item is expanded or collapsed.
|
|
462
|
+
*
|
|
463
|
+
* Extends `HlmAccordionItem` (instead of re-applying `BrnAccordionItem` and copying the helm's
|
|
464
|
+
* classes by hand) so the helm's `data-slot`, classes and its `BrnAccordionItem` host directive —
|
|
465
|
+
* including the forwarded `isOpened`/`disabled` inputs and `openedChange` output — are all
|
|
466
|
+
* inherited. Forwarding those through a `hostDirectives` entry on `HlmAccordionItem` is not
|
|
467
|
+
* possible: Angular only allows exposing inputs/outputs a host directive declares itself, and
|
|
468
|
+
* the helm exposes them transitively from `BrnAccordionItem`.
|
|
469
|
+
*/
|
|
470
|
+
declare class YuwAccordionItem extends HlmAccordionItem {
|
|
471
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwAccordionItem, never>;
|
|
472
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwAccordionItem, "yuw-accordion-item", never, {}, {}, never, never, true, never>;
|
|
473
|
+
}
|
|
474
|
+
|
|
475
|
+
/**
|
|
476
|
+
* Interactive header button for expanding or collapsing a `yuw-accordion-item`.
|
|
477
|
+
*
|
|
478
|
+
* Project content inside to serve as the trigger label (text, icons, badges, or custom markup).
|
|
479
|
+
*
|
|
480
|
+
* Inputs:
|
|
481
|
+
* - `triggerClass`: Extra classes for the inner trigger `<button>`; the helm merges them last
|
|
482
|
+
* (via tailwind-merge), so they win over its defaults.
|
|
483
|
+
*/
|
|
484
|
+
declare class YuwAccordionTriggerComponent {
|
|
485
|
+
readonly triggerClass: _angular_core.InputSignal<string>;
|
|
486
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwAccordionTriggerComponent, never>;
|
|
487
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<YuwAccordionTriggerComponent, "yuw-accordion-trigger", never, { "triggerClass": { "alias": "triggerClass"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
|
|
488
|
+
}
|
|
489
|
+
|
|
490
|
+
/**
|
|
491
|
+
* Collapsible panel container for a `yuw-accordion-item`.
|
|
492
|
+
*
|
|
493
|
+
* Projects body content revealed when the item is expanded (supports text, custom markup, or nested components).
|
|
494
|
+
*/
|
|
495
|
+
declare class YuwAccordionContentComponent {
|
|
496
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwAccordionContentComponent, never>;
|
|
497
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<YuwAccordionContentComponent, "yuw-accordion-content", never, {}, {}, never, ["*"], true, never>;
|
|
498
|
+
}
|
|
499
|
+
|
|
500
|
+
/** Bundle for consumers who want every `yuw-accordion-*` piece in one `imports: [...]` entry —
|
|
501
|
+
* same shape as Spartan's own `HlmAccordionImports`. Each piece is still exported and importable
|
|
502
|
+
* on its own for consumers who only need a subset. */
|
|
503
|
+
declare const YuwAccordionImports: readonly [typeof YuwAccordion, typeof YuwAccordionItem, typeof YuwAccordionTriggerComponent, typeof YuwAccordionContentComponent];
|
|
504
|
+
|
|
505
|
+
/**
|
|
506
|
+
* Single-line text input control supporting two-way value binding, form controls (`formControlName`, `ngModel`),
|
|
507
|
+
* validation styling, and left/right addon slots.
|
|
508
|
+
*
|
|
509
|
+
* Inputs / Models:
|
|
510
|
+
* - `value`: Two-way text string.
|
|
511
|
+
* - `inputId`: `id` applied to the native input, for external `<label for>` association.
|
|
512
|
+
* - `type`: HTML input type (`'text'`, `'email'`, `'number'`, etc.). Default is `'text'`.
|
|
513
|
+
* - `inputmode`: Virtual keyboard hint (e.g. `'numeric'`).
|
|
514
|
+
* - `disabled`: Disables input interaction.
|
|
515
|
+
* - `readonly`: Makes the field read-only.
|
|
516
|
+
* - `required`: Marks the field as required.
|
|
517
|
+
* - `invalid`: Forces invalid styling.
|
|
518
|
+
* - `name`: HTML `name` attribute.
|
|
519
|
+
* - `autocomplete`: Native `autocomplete` attribute.
|
|
520
|
+
* - `maxlength`: Hard cap on character count, enforced natively by the browser.
|
|
521
|
+
* - `placeholder`: Hint text shown inside the empty field.
|
|
522
|
+
* - `class`: Extra classes merged onto the visual root (the input, or the input group when addons are present).
|
|
523
|
+
*
|
|
524
|
+
* Outputs:
|
|
525
|
+
* - `committed`: Emits the current value on the native `change` event (blur/enter).
|
|
526
|
+
*
|
|
527
|
+
* Usage:
|
|
528
|
+
* ```html
|
|
529
|
+
* <yuw-input [(value)]="username" placeholder="Enter username..." />
|
|
530
|
+
*
|
|
531
|
+
* <yuw-input formControlName="email" type="email">
|
|
532
|
+
* <yuw-left-addon><ng-icon name="lucideMail" /></yuw-left-addon>
|
|
533
|
+
* </yuw-input>
|
|
534
|
+
* ```
|
|
535
|
+
*/
|
|
536
|
+
declare class YuwInputComponent extends YuwValueAccessorBase<string> implements YuwTextFieldContract {
|
|
537
|
+
readonly value: _angular_core.ModelSignal<string>;
|
|
538
|
+
readonly inputId: _angular_core.InputSignal<string | undefined>;
|
|
539
|
+
readonly type: _angular_core.InputSignal<YuwInputTypeDto>;
|
|
540
|
+
readonly inputmode: _angular_core.InputSignal<YuwInputModeDto | undefined>;
|
|
541
|
+
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
542
|
+
readonly readonly: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
543
|
+
readonly required: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
544
|
+
readonly invalid: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
545
|
+
readonly name: _angular_core.InputSignal<string | undefined>;
|
|
546
|
+
readonly autocomplete: _angular_core.InputSignal<string | undefined>;
|
|
547
|
+
readonly maxlength: _angular_core.InputSignal<number | undefined>;
|
|
548
|
+
readonly placeholder: _angular_core.InputSignal<string | undefined>;
|
|
549
|
+
readonly userClass: _angular_core.InputSignal<string>;
|
|
550
|
+
readonly committed: _angular_core.OutputEmitterRef<string>;
|
|
551
|
+
protected readonly _autoId: string;
|
|
552
|
+
protected readonly _inputId: _angular_core.Signal<string>;
|
|
553
|
+
protected readonly _classes: _angular_core.Signal<string>;
|
|
554
|
+
protected readonly _disabled: _angular_core.Signal<boolean>;
|
|
555
|
+
private readonly _leftAddons;
|
|
556
|
+
private readonly _rightAddons;
|
|
557
|
+
protected readonly _hasLeftAddon: _angular_core.Signal<boolean>;
|
|
558
|
+
protected readonly _hasRightAddon: _angular_core.Signal<boolean>;
|
|
559
|
+
protected readonly _hasAddons: _angular_core.Signal<boolean>;
|
|
560
|
+
protected onInput(event: Event): void;
|
|
561
|
+
protected _emptyValue(): string;
|
|
562
|
+
protected onChange(): void;
|
|
563
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwInputComponent, never>;
|
|
564
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<YuwInputComponent, "yuw-input", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "inputId": { "alias": "inputId"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "inputmode": { "alias": "inputmode"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "autocomplete": { "alias": "autocomplete"; "required": false; "isSignal": true; }; "maxlength": { "alias": "maxlength"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "userClass": { "alias": "class"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "committed": "committed"; }, ["_leftAddons", "_rightAddons"], ["yuw-left-addon", "yuw-right-addon"], true, never>;
|
|
565
|
+
}
|
|
566
|
+
|
|
567
|
+
/**
|
|
568
|
+
* Slot directive for adding content (icons, text prefixes) on the left side of a `yuw-input` or `yuw-textarea`.
|
|
569
|
+
*/
|
|
570
|
+
declare class YuwLeftAddonDirective {
|
|
571
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwLeftAddonDirective, never>;
|
|
572
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwLeftAddonDirective, "yuw-left-addon", never, {}, {}, never, never, true, never>;
|
|
573
|
+
}
|
|
574
|
+
/**
|
|
575
|
+
* Slot directive for adding content (icons, text suffixes, action buttons) on the right side of a `yuw-input` or `yuw-textarea`.
|
|
576
|
+
*/
|
|
577
|
+
declare class YuwRightAddonDirective {
|
|
578
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwRightAddonDirective, never>;
|
|
579
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwRightAddonDirective, "yuw-right-addon", never, {}, {}, never, never, true, never>;
|
|
580
|
+
}
|
|
581
|
+
declare const YuwInputAddonImports: readonly [typeof YuwLeftAddonDirective, typeof YuwRightAddonDirective];
|
|
582
|
+
|
|
583
|
+
/**
|
|
584
|
+
* Multi-line text input control supporting auto-growing content, character limits, row count, and form integration (`ngModel`, `formControlName`).
|
|
585
|
+
*
|
|
586
|
+
* Inputs / Models:
|
|
587
|
+
* - `value`: Two-way text string.
|
|
588
|
+
* - `inputId`: `id` applied to the native textarea, for external `<label for>` association.
|
|
589
|
+
* - `disabled`: Disables input interaction.
|
|
590
|
+
* - `readonly`: Makes the field read-only.
|
|
591
|
+
* - `required`: Marks the field as required.
|
|
592
|
+
* - `invalid`: Forces invalid styling.
|
|
593
|
+
* - `name`: HTML `name` attribute.
|
|
594
|
+
* - `autocomplete`: Native `autocomplete` attribute.
|
|
595
|
+
* - `rows`: Fallback visible height in lines where `field-sizing` is unsupported; ignored otherwise.
|
|
596
|
+
* - `maxlength`: Hard cap on character count, enforced natively by the browser.
|
|
597
|
+
* - `placeholder`: Hint text shown inside the empty field.
|
|
598
|
+
* - `class`: Extra classes merged onto the visual root (the textarea, or the input group when addons are present).
|
|
599
|
+
*
|
|
600
|
+
* Outputs:
|
|
601
|
+
* - `committed`: Emits the current value on the native `change` event (blur/enter).
|
|
602
|
+
*
|
|
603
|
+
* Usage:
|
|
604
|
+
* ```html
|
|
605
|
+
* <yuw-textarea [(value)]="bio" placeholder="Write your biography..." [rows]="4" />
|
|
606
|
+
* <yuw-textarea formControlName="comments" [maxlength]="500" />
|
|
607
|
+
* ```
|
|
608
|
+
*/
|
|
609
|
+
declare class YuwTextareaComponent extends YuwValueAccessorBase<string> implements YuwTextFieldContract {
|
|
610
|
+
readonly value: _angular_core.ModelSignal<string>;
|
|
611
|
+
readonly inputId: _angular_core.InputSignal<string | undefined>;
|
|
612
|
+
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
613
|
+
readonly readonly: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
614
|
+
readonly required: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
615
|
+
readonly invalid: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
616
|
+
readonly name: _angular_core.InputSignal<string | undefined>;
|
|
617
|
+
readonly autocomplete: _angular_core.InputSignal<string | undefined>;
|
|
618
|
+
readonly rows: _angular_core.InputSignal<number | undefined>;
|
|
619
|
+
readonly maxlength: _angular_core.InputSignal<number | undefined>;
|
|
620
|
+
readonly placeholder: _angular_core.InputSignal<string | undefined>;
|
|
621
|
+
readonly userClass: _angular_core.InputSignal<string>;
|
|
622
|
+
readonly committed: _angular_core.OutputEmitterRef<string>;
|
|
623
|
+
protected readonly _autoId: string;
|
|
624
|
+
protected readonly _inputId: _angular_core.Signal<string>;
|
|
625
|
+
protected readonly _classes: _angular_core.Signal<string>;
|
|
626
|
+
protected readonly _disabled: _angular_core.Signal<boolean>;
|
|
627
|
+
private readonly _leftAddons;
|
|
628
|
+
private readonly _rightAddons;
|
|
629
|
+
protected readonly _hasLeftAddon: _angular_core.Signal<boolean>;
|
|
630
|
+
protected readonly _hasRightAddon: _angular_core.Signal<boolean>;
|
|
631
|
+
protected readonly _hasAddons: _angular_core.Signal<boolean>;
|
|
632
|
+
protected onInput(event: Event): void;
|
|
633
|
+
protected _emptyValue(): string;
|
|
634
|
+
protected onChange(): void;
|
|
635
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwTextareaComponent, never>;
|
|
636
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<YuwTextareaComponent, "yuw-textarea", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "inputId": { "alias": "inputId"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "autocomplete": { "alias": "autocomplete"; "required": false; "isSignal": true; }; "rows": { "alias": "rows"; "required": false; "isSignal": true; }; "maxlength": { "alias": "maxlength"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "userClass": { "alias": "class"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "committed": "committed"; }, ["_leftAddons", "_rightAddons"], ["yuw-left-addon", "yuw-right-addon"], true, never>;
|
|
637
|
+
}
|
|
638
|
+
|
|
639
|
+
/**
|
|
640
|
+
* Search input control featuring a leading search icon, optional clear button, and form integration (`ngModel`, `formControlName`).
|
|
641
|
+
*
|
|
642
|
+
* Inputs / Models:
|
|
643
|
+
* - `value`: Two-way search query string.
|
|
644
|
+
* - `inputId`: `id` applied to the native input, for external `<label for>` association.
|
|
645
|
+
* - `disabled`: Disables input interaction.
|
|
646
|
+
* - `readonly`: Makes the field read-only.
|
|
647
|
+
* - `required`: Marks the field as required.
|
|
648
|
+
* - `invalid`: Forces invalid styling.
|
|
649
|
+
* - `name`: HTML `name` attribute.
|
|
650
|
+
* - `autocomplete`: Native `autocomplete` attribute.
|
|
651
|
+
* - `placeholder`: Hint text shown inside the empty field.
|
|
652
|
+
* - `clearAriaLabel`: Accessible name for the clear button. Supplying it enables the clear button; omit to hide it.
|
|
653
|
+
* - `class`: Extra classes merged onto the input group.
|
|
654
|
+
*
|
|
655
|
+
* Outputs:
|
|
656
|
+
* - `searched`: Emits the current query string on every keystroke.
|
|
657
|
+
* - `committed`: Emits the current query string when the user presses Enter — for searches that
|
|
658
|
+
* hit a server on explicit submit rather than on every keystroke.
|
|
659
|
+
*
|
|
660
|
+
* Usage:
|
|
661
|
+
* ```html
|
|
662
|
+
* <yuw-search-input [(value)]="query" placeholder="Search items..." clearAriaLabel="Clear search" (searched)="onSearch($event)" />
|
|
663
|
+
* ```
|
|
664
|
+
*/
|
|
665
|
+
declare class YuwSearchInputComponent extends YuwValueAccessorBase<string> implements YuwTextFieldContract {
|
|
666
|
+
readonly value: _angular_core.ModelSignal<string>;
|
|
667
|
+
readonly inputId: _angular_core.InputSignal<string | undefined>;
|
|
668
|
+
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
669
|
+
readonly readonly: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
670
|
+
readonly required: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
671
|
+
readonly invalid: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
672
|
+
readonly name: _angular_core.InputSignal<string | undefined>;
|
|
673
|
+
readonly autocomplete: _angular_core.InputSignal<string | undefined>;
|
|
674
|
+
readonly placeholder: _angular_core.InputSignal<string | undefined>;
|
|
675
|
+
readonly clearAriaLabel: _angular_core.InputSignal<string | undefined>;
|
|
676
|
+
readonly userClass: _angular_core.InputSignal<string>;
|
|
677
|
+
readonly searched: _angular_core.OutputEmitterRef<string>;
|
|
678
|
+
readonly committed: _angular_core.OutputEmitterRef<string>;
|
|
679
|
+
protected readonly _autoId: string;
|
|
680
|
+
protected readonly _inputId: _angular_core.Signal<string>;
|
|
681
|
+
protected readonly _classes: _angular_core.Signal<string>;
|
|
682
|
+
protected readonly _disabled: _angular_core.Signal<boolean>;
|
|
683
|
+
protected readonly _showClear: _angular_core.Signal<boolean>;
|
|
684
|
+
private readonly _input;
|
|
685
|
+
protected _emptyValue(): string;
|
|
686
|
+
protected onInput(event: Event): void;
|
|
687
|
+
protected onEnter(): void;
|
|
688
|
+
protected onClear(): void;
|
|
689
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwSearchInputComponent, never>;
|
|
690
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<YuwSearchInputComponent, "yuw-search-input", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "inputId": { "alias": "inputId"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "autocomplete": { "alias": "autocomplete"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "clearAriaLabel": { "alias": "clearAriaLabel"; "required": false; "isSignal": true; }; "userClass": { "alias": "class"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "searched": "searched"; "committed": "committed"; }, never, never, true, never>;
|
|
691
|
+
}
|
|
692
|
+
|
|
693
|
+
/**
|
|
694
|
+
* Password input field with optional visibility toggle button and form integration (`ngModel`, `formControlName`).
|
|
695
|
+
*
|
|
696
|
+
* Inputs / Models:
|
|
697
|
+
* - `value`: Two-way password string.
|
|
698
|
+
* - `inputId`: `id` applied to the native input, for external `<label for>` association.
|
|
699
|
+
* - `disabled`: Disables input interaction.
|
|
700
|
+
* - `readonly`: Makes the field read-only.
|
|
701
|
+
* - `required`: Marks the field as required.
|
|
702
|
+
* - `invalid`: Forces invalid styling.
|
|
703
|
+
* - `name`: HTML `name` attribute.
|
|
704
|
+
* - `autocomplete`: Native `autocomplete` attribute (e.g. `'current-password'`, `'new-password'`).
|
|
705
|
+
* - `placeholder`: Hint text shown inside the empty field.
|
|
706
|
+
* - `revealAriaLabel`: Accessible name for the reveal toggle button. Supplying it enables the toggle; omit to hide it.
|
|
707
|
+
* - `masked`: Two-way boolean controlling whether the value is masked. Default is `true` (masked). A parent can reset it (e.g. re-mask after a failed submit).
|
|
708
|
+
* - `class`: Extra classes merged onto the input group.
|
|
709
|
+
*
|
|
710
|
+
* Outputs:
|
|
711
|
+
* - `committed`: Emits the current value on the native `change` event (blur/enter).
|
|
712
|
+
*
|
|
713
|
+
* Usage:
|
|
714
|
+
* ```html
|
|
715
|
+
* <yuw-password-input [(value)]="password" revealAriaLabel="Toggle password visibility" />
|
|
716
|
+
* <yuw-password-input formControlName="password" autocomplete="current-password" />
|
|
717
|
+
* ```
|
|
718
|
+
*/
|
|
719
|
+
declare class YuwPasswordInputComponent extends YuwValueAccessorBase<string> implements YuwTextFieldContract {
|
|
720
|
+
readonly value: _angular_core.ModelSignal<string>;
|
|
721
|
+
readonly inputId: _angular_core.InputSignal<string | undefined>;
|
|
722
|
+
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
723
|
+
readonly readonly: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
724
|
+
readonly required: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
725
|
+
readonly invalid: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
726
|
+
readonly name: _angular_core.InputSignal<string | undefined>;
|
|
727
|
+
readonly autocomplete: _angular_core.InputSignal<string | undefined>;
|
|
728
|
+
readonly placeholder: _angular_core.InputSignal<string | undefined>;
|
|
729
|
+
readonly revealAriaLabel: _angular_core.InputSignal<string | undefined>;
|
|
730
|
+
readonly userClass: _angular_core.InputSignal<string>;
|
|
731
|
+
readonly committed: _angular_core.OutputEmitterRef<string>;
|
|
732
|
+
readonly masked: _angular_core.ModelSignal<boolean>;
|
|
733
|
+
protected readonly _autoId: string;
|
|
734
|
+
protected readonly _inputId: _angular_core.Signal<string>;
|
|
735
|
+
protected readonly _classes: _angular_core.Signal<string>;
|
|
736
|
+
protected readonly _disabled: _angular_core.Signal<boolean>;
|
|
737
|
+
protected readonly _reveal: _angular_core.Signal<yukit_web.YuwPasswordRevealStateDto>;
|
|
738
|
+
protected _emptyValue(): string;
|
|
739
|
+
protected onInput(event: Event): void;
|
|
740
|
+
protected onChange(): void;
|
|
741
|
+
protected onToggleReveal(): void;
|
|
742
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwPasswordInputComponent, never>;
|
|
743
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<YuwPasswordInputComponent, "yuw-password-input", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "inputId": { "alias": "inputId"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "autocomplete": { "alias": "autocomplete"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "revealAriaLabel": { "alias": "revealAriaLabel"; "required": false; "isSignal": true; }; "userClass": { "alias": "class"; "required": false; "isSignal": true; }; "masked": { "alias": "masked"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "committed": "committed"; "masked": "maskedChange"; }, never, never, true, never>;
|
|
744
|
+
}
|
|
745
|
+
|
|
746
|
+
/**
|
|
747
|
+
* The reveal toggle's two states, as data rather than control flow — `agents.md` bans `switch`
|
|
748
|
+
* over a mode, and a `[type]="masked() ? 'password' : 'text'"` chain in the template would be the
|
|
749
|
+
* same branch smeared across three separate bindings that can drift out of sync.
|
|
750
|
+
*
|
|
751
|
+
* Keyed by "is the value currently masked", so the component reads one boolean signal and gets
|
|
752
|
+
* the matching input type and icon together, always consistent.
|
|
753
|
+
*/
|
|
754
|
+
interface YuwPasswordRevealStateDto {
|
|
755
|
+
inputType: 'password' | 'text';
|
|
756
|
+
icon: 'lucideEye' | 'lucideEyeOff';
|
|
757
|
+
struck: boolean;
|
|
758
|
+
}
|
|
759
|
+
/** Lookup replacing the branch, keyed by `` `${boolean}` `` so a boolean signal indexes it
|
|
760
|
+
* directly (`STATES[`${masked()}`]`) with no ternary. Adding a third state (a "peek while held"
|
|
761
|
+
* mode, say) means adding an entry here — open for extension, closed for modification. */
|
|
762
|
+
declare const YUW_PASSWORD_REVEAL_STATES: Record<`${boolean}`, YuwPasswordRevealStateDto>;
|
|
763
|
+
|
|
764
|
+
type YuwInputOtpModeDto = 'numeric' | 'text';
|
|
765
|
+
/**
|
|
766
|
+
* One-time password / verification code input component rendering grouped digit or text slots.
|
|
767
|
+
*
|
|
768
|
+
* Inputs / Models:
|
|
769
|
+
* - `value`: Two-way OTP code string.
|
|
770
|
+
* - `inputId`: `id` applied to the hidden native input, for external `<label for>` association.
|
|
771
|
+
* - `groupSizes`: Slot counts per visual group (`number[]`). A separator renders between groups, e.g. `[3, 3]` gives `000-000`. Default is `[6]`.
|
|
772
|
+
* - `mode`: Virtual-keyboard hint (`'numeric'`, `'text'`). Default is `'numeric'`.
|
|
773
|
+
* - `disabled`: Disables input interaction.
|
|
774
|
+
* - `invalid`: Forces invalid styling.
|
|
775
|
+
* - `autofocus`: Focuses the field on init. Appropriate on dedicated verification screens.
|
|
776
|
+
* - `transformPaste`: Normalizes pasted text before it fills the slots.
|
|
777
|
+
* - `class`: Extra classes merged onto the OTP container.
|
|
778
|
+
*
|
|
779
|
+
* Outputs:
|
|
780
|
+
* - `completed`: Emits the full code string once the final slot is filled (by typing or paste).
|
|
781
|
+
*
|
|
782
|
+
* Usage:
|
|
783
|
+
* ```html
|
|
784
|
+
* <yuw-input-otp [(value)]="code" [groupSizes]="[3, 3]" (completed)="verifyCode($event)" />
|
|
785
|
+
* <yuw-input-otp formControlName="otpCode" [groupSizes]="[6]" mode="numeric" />
|
|
786
|
+
* ```
|
|
787
|
+
*/
|
|
788
|
+
declare class YuwInputOtpComponent extends YuwValueAccessorBase<string> {
|
|
789
|
+
readonly value: _angular_core.ModelSignal<string>;
|
|
790
|
+
readonly inputId: _angular_core.InputSignal<string | undefined>;
|
|
791
|
+
readonly groupSizes: _angular_core.InputSignal<readonly number[]>;
|
|
792
|
+
readonly mode: _angular_core.InputSignal<YuwInputOtpModeDto>;
|
|
793
|
+
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
794
|
+
readonly invalid: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
795
|
+
readonly autofocus: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
796
|
+
readonly transformPaste: _angular_core.InputSignal<(pastedText: string, length: number) => string>;
|
|
797
|
+
readonly userClass: _angular_core.InputSignal<string>;
|
|
798
|
+
readonly completed: _angular_core.OutputEmitterRef<string>;
|
|
799
|
+
protected readonly _autoId: string;
|
|
800
|
+
protected readonly _inputId: _angular_core.Signal<string>;
|
|
801
|
+
protected readonly _classes: _angular_core.Signal<string>;
|
|
802
|
+
protected readonly _groups: _angular_core.Signal<yukit_web.YuwInputOtpGroupDto[]>;
|
|
803
|
+
protected readonly _length: _angular_core.Signal<number>;
|
|
804
|
+
protected readonly _disabled: _angular_core.Signal<boolean>;
|
|
805
|
+
protected _emptyValue(): string;
|
|
806
|
+
protected onValueChange(next: string): void;
|
|
807
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwInputOtpComponent, never>;
|
|
808
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<YuwInputOtpComponent, "yuw-input-otp", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "inputId": { "alias": "inputId"; "required": false; "isSignal": true; }; "groupSizes": { "alias": "groupSizes"; "required": false; "isSignal": true; }; "mode": { "alias": "mode"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "autofocus": { "alias": "autofocus"; "required": false; "isSignal": true; }; "transformPaste": { "alias": "transformPaste"; "required": false; "isSignal": true; }; "userClass": { "alias": "class"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "completed": "completed"; }, never, never, true, never>;
|
|
809
|
+
}
|
|
810
|
+
|
|
811
|
+
/**
|
|
812
|
+
* One rendered group of OTP slots, with the absolute slot indices it contains.
|
|
813
|
+
*
|
|
814
|
+
* `HlmInputOtpSlot` needs an explicit `[index]` per slot, and those indices are absolute across
|
|
815
|
+
* the whole input — the second group of a `3-3` layout holds slots 3,4,5, not 0,1,2. Precomputing
|
|
816
|
+
* them here keeps the template to two plain `@for`s with no arithmetic and no method calls.
|
|
817
|
+
*/
|
|
818
|
+
interface YuwInputOtpGroupDto {
|
|
819
|
+
indices: number[];
|
|
820
|
+
precededBySeparator: boolean;
|
|
821
|
+
}
|
|
822
|
+
/**
|
|
823
|
+
* Expands a list of group sizes (`[3, 3]`) into the groups the template renders, assigning
|
|
824
|
+
* absolute indices as it goes.
|
|
825
|
+
*
|
|
826
|
+
* Lives in its own file rather than inline in the component because `agents.md` wants the
|
|
827
|
+
* component file to read as inputs, outputs, a couple of `computed()`s, done — and because this
|
|
828
|
+
* is the one piece of real logic here, so it's the piece worth being able to test on its own.
|
|
829
|
+
*
|
|
830
|
+
* Sizes that are zero or negative are dropped: they'd contribute no slots but would still emit a
|
|
831
|
+
* stray separator, so a typo like `[3, 0, 3]` would render a dangling dash between two groups.
|
|
832
|
+
*/
|
|
833
|
+
declare function buildInputOtpGroups(groupSizes: readonly number[]): YuwInputOtpGroupDto[];
|
|
834
|
+
/** Total slot count across every group — what `BrnInputOtp`'s own `length` input expects. Derived
|
|
835
|
+
* from the same source as the groups so the two can never disagree, which is the bug you get from
|
|
836
|
+
* accepting `length` and `groupSizes` as two independent inputs. */
|
|
837
|
+
declare function totalInputOtpLength(groupSizes: readonly number[]): number;
|
|
838
|
+
|
|
839
|
+
/**
|
|
840
|
+
* Form label directive applied directly to a native `<label>` element.
|
|
841
|
+
*
|
|
842
|
+
* Provides label styling and pairs with form controls using standard `for` attribute.
|
|
843
|
+
*
|
|
844
|
+
* Extends `HlmLabel` (instead of composing it via `hostDirectives`) because `id`/`for` are
|
|
845
|
+
* inputs `HlmLabel` itself re-exposes from `BrnLabel` through its own `hostDirectives`, and
|
|
846
|
+
* Angular's host-directive forwarding is not transitive (NG2017) — they can't be re-listed at
|
|
847
|
+
* this level. Class inheritance carries the whole surface over unchanged: a static `for`/`id`
|
|
848
|
+
* on the `<label>` reaches `BrnLabel` as an initial input, whose `[attr.for]` host binding then
|
|
849
|
+
* re-writes the same value.
|
|
850
|
+
*
|
|
851
|
+
* Usage:
|
|
852
|
+
* ```html
|
|
853
|
+
* <label yuwLabel for="username">Username</label>
|
|
854
|
+
* <yuw-input inputId="username" [(value)]="username" />
|
|
855
|
+
* ```
|
|
856
|
+
*/
|
|
857
|
+
declare class YuwLabel extends HlmLabel {
|
|
858
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwLabel, never>;
|
|
859
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwLabel, "label[yuwLabel]", never, {}, {}, never, never, true, never>;
|
|
860
|
+
}
|
|
861
|
+
|
|
862
|
+
/**
|
|
863
|
+
* Checkbox control supporting two-way boolean binding, form integration (`ngModel`, `formControlName`),
|
|
864
|
+
* indeterminate state, and secondary styling variant.
|
|
865
|
+
*
|
|
866
|
+
* Projected content becomes the checkbox's clickable label: the control is wrapped in a `<label>`,
|
|
867
|
+
* so clicking the text toggles it and the text is announced as the accessible name. Without
|
|
868
|
+
* projected content, pair it with an external `<label [for]>` via `inputId` or set `ariaLabel`.
|
|
869
|
+
*
|
|
870
|
+
* Inputs / Models:
|
|
871
|
+
* - `value` / `checked`: Two-way boolean state of the checkbox. Default is `false`.
|
|
872
|
+
* - `indeterminate`: Two-way boolean state for mixed/indeterminate checkbox appearance. Default is `false`.
|
|
873
|
+
* - `disabled`: Disables checkbox interaction.
|
|
874
|
+
* - `required`: Marks checkbox as required.
|
|
875
|
+
* - `invalid`: Forces invalid styling.
|
|
876
|
+
* - `name`: Form input name attribute.
|
|
877
|
+
* - `inputId`: ID set on the native input element for `<label [for]>` matching.
|
|
878
|
+
* - `ariaLabel`: Accessible name for screen readers when there's no visible label.
|
|
879
|
+
* - `ariaLabelledby`: ID of an external element that labels the checkbox.
|
|
880
|
+
* - `ariaDescribedby`: ID of an external element that describes the checkbox (hints, errors).
|
|
881
|
+
* - `secondary`: Enables secondary color variant styling.
|
|
882
|
+
*
|
|
883
|
+
* Usage:
|
|
884
|
+
* ```html
|
|
885
|
+
* <yuw-checkbox [(checked)]="acceptedTerms">Accept terms</yuw-checkbox>
|
|
886
|
+
* <yuw-checkbox [(indeterminate)]="isMixed" [(checked)]="allSelected" />
|
|
887
|
+
* <yuw-checkbox formControlName="rememberMe" />
|
|
888
|
+
* ```
|
|
889
|
+
*/
|
|
890
|
+
declare class YuwCheckboxComponent extends YuwValueAccessorBase<boolean> {
|
|
891
|
+
readonly value: _angular_core.ModelSignal<boolean>;
|
|
892
|
+
readonly indeterminate: _angular_core.ModelSignal<boolean>;
|
|
893
|
+
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
894
|
+
readonly required: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
895
|
+
readonly invalid: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
896
|
+
readonly name: _angular_core.InputSignal<string | undefined>;
|
|
897
|
+
readonly inputId: _angular_core.InputSignal<string | undefined>;
|
|
898
|
+
readonly ariaLabel: _angular_core.InputSignal<string | undefined>;
|
|
899
|
+
readonly ariaLabelledby: _angular_core.InputSignal<string | undefined>;
|
|
900
|
+
readonly ariaDescribedby: _angular_core.InputSignal<string | undefined>;
|
|
901
|
+
readonly secondary: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
902
|
+
protected readonly _disabled: _angular_core.Signal<boolean>;
|
|
903
|
+
protected readonly _class: _angular_core.Signal<string>;
|
|
904
|
+
protected _emptyValue(): boolean;
|
|
905
|
+
protected onCheckedChange(checked: boolean): void;
|
|
906
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwCheckboxComponent, never>;
|
|
907
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<YuwCheckboxComponent, "yuw-checkbox", never, { "value": { "alias": "checked"; "required": false; "isSignal": true; }; "indeterminate": { "alias": "indeterminate"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "inputId": { "alias": "inputId"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "ariaLabelledby": { "alias": "ariaLabelledby"; "required": false; "isSignal": true; }; "ariaDescribedby": { "alias": "ariaDescribedby"; "required": false; "isSignal": true; }; "secondary": { "alias": "secondary"; "required": false; "isSignal": true; }; }, { "value": "checkedChange"; "indeterminate": "indeterminateChange"; }, never, ["*"], true, never>;
|
|
908
|
+
}
|
|
909
|
+
|
|
910
|
+
type YuwSwitchSizeDto = 'default' | 'sm';
|
|
911
|
+
/**
|
|
912
|
+
* Toggle switch control for binary settings and immediate state changes.
|
|
913
|
+
*
|
|
914
|
+
* Projected content becomes the switch's clickable label: the control is wrapped in a `<label>`,
|
|
915
|
+
* so clicking the text toggles it and the text is announced as the accessible name. Without
|
|
916
|
+
* projected content, pair it with an external `<label [for]>` via `inputId` or set `ariaLabel`.
|
|
917
|
+
*
|
|
918
|
+
* Inputs / Models:
|
|
919
|
+
* - `checked` (alias for `value`): Two-way boolean on/off state. Bind as `[(checked)]`.
|
|
920
|
+
* - `size`: Track size variant (`'default'`, `'sm'`). Default is `'default'`.
|
|
921
|
+
* - `disabled`: Disables switch interaction.
|
|
922
|
+
* - `inputId`: HTML `id` for the underlying control, enabling external `<label for="...">` association.
|
|
923
|
+
* - `ariaLabel`: Accessible name for switches with no visible adjacent label.
|
|
924
|
+
*
|
|
925
|
+
* Usage:
|
|
926
|
+
* ```html
|
|
927
|
+
* <yuw-switch [(checked)]="notificationsEnabled">Enable Notifications</yuw-switch>
|
|
928
|
+
* <yuw-switch formControlName="darkMode" size="sm" />
|
|
929
|
+
* ```
|
|
930
|
+
*/
|
|
931
|
+
declare class YuwSwitchComponent extends YuwValueAccessorBase<boolean> {
|
|
932
|
+
readonly value: _angular_core.ModelSignal<boolean>;
|
|
933
|
+
readonly size: _angular_core.InputSignal<YuwSwitchSizeDto>;
|
|
934
|
+
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
935
|
+
readonly inputId: _angular_core.InputSignal<string | undefined>;
|
|
936
|
+
readonly ariaLabel: _angular_core.InputSignal<string | undefined>;
|
|
937
|
+
readonly ariaLabelledby: _angular_core.InputSignal<string | undefined>;
|
|
938
|
+
readonly ariaDescribedby: _angular_core.InputSignal<string | undefined>;
|
|
939
|
+
protected readonly _disabled: _angular_core.Signal<boolean>;
|
|
940
|
+
protected _emptyValue(): boolean;
|
|
941
|
+
protected onCheckedChange(checked: boolean): void;
|
|
942
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwSwitchComponent, never>;
|
|
943
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<YuwSwitchComponent, "yuw-switch", never, { "value": { "alias": "checked"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "inputId": { "alias": "inputId"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "ariaLabelledby": { "alias": "ariaLabelledby"; "required": false; "isSignal": true; }; "ariaDescribedby": { "alias": "ariaDescribedby"; "required": false; "isSignal": true; }; }, { "value": "checkedChange"; }, never, ["*"], true, never>;
|
|
944
|
+
}
|
|
945
|
+
|
|
946
|
+
/**
|
|
947
|
+
* A single option in `<yuw-radio-group>`'s `options` input.
|
|
948
|
+
*
|
|
949
|
+
* `label` is data the parent supplies, not a component-owned default — the same rule
|
|
950
|
+
* `YuwSelectOptionDto` and `YuwBreadcrumbItemDto` follow, and what keeps translatable copy in the
|
|
951
|
+
* consuming app.
|
|
952
|
+
*
|
|
953
|
+
* `disabled` is per-option because a group can legitimately offer a choice that's currently
|
|
954
|
+
* unavailable while the rest stay selectable; disabling the whole group is the group's own input.
|
|
955
|
+
*/
|
|
956
|
+
interface YuwRadioOptionDto {
|
|
957
|
+
value: string;
|
|
958
|
+
label: string;
|
|
959
|
+
disabled?: boolean;
|
|
960
|
+
}
|
|
961
|
+
|
|
962
|
+
/**
|
|
963
|
+
* Radio button group component for selecting a single option from a list.
|
|
964
|
+
*
|
|
965
|
+
* Inputs / Models:
|
|
966
|
+
* - `value`: Two-way selected option value (`string | undefined`). `undefined` means nothing is selected.
|
|
967
|
+
* - `options`: Required array of radio options (`YuwRadioOptionDto[]`).
|
|
968
|
+
* - `disabled`: Disables all radio options.
|
|
969
|
+
* - `required`: Marks the group as required.
|
|
970
|
+
* - `name`: Shared HTML `name` attribute for all radios, making them mutually exclusive in native
|
|
971
|
+
* form submission. When omitted, a unique per-instance name is generated.
|
|
972
|
+
* - `ariaLabel`: Accessible name for the `role="radiogroup"` element. User-facing text — the
|
|
973
|
+
* consuming app is responsible for providing it translated.
|
|
974
|
+
* - `ariaLabelledby`: ID of an external element (e.g. a visible heading) that labels the group.
|
|
975
|
+
* - `class`: Extra classes merged onto the group container (layout tweaks like
|
|
976
|
+
* `grid-cols-2` or `flex-row`). The `gap-3` base stays unless overridden.
|
|
977
|
+
*
|
|
978
|
+
* Usage:
|
|
979
|
+
* ```html
|
|
980
|
+
* <yuw-radio-group [options]="planOptions" [(value)]="selectedPlan" ariaLabel="Plan" />
|
|
981
|
+
* <yuw-radio-group [options]="genderOptions" formControlName="gender" ariaLabelledby="gender-heading" />
|
|
982
|
+
* ```
|
|
983
|
+
*/
|
|
984
|
+
declare class YuwRadioGroupComponent extends YuwValueAccessorBase<string | undefined> {
|
|
985
|
+
readonly value: _angular_core.ModelSignal<string | undefined>;
|
|
986
|
+
readonly options: _angular_core.InputSignal<readonly YuwRadioOptionDto[]>;
|
|
987
|
+
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
988
|
+
readonly required: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
989
|
+
readonly name: _angular_core.InputSignal<string | undefined>;
|
|
990
|
+
readonly ariaLabel: _angular_core.InputSignal<string | undefined>;
|
|
991
|
+
readonly ariaLabelledby: _angular_core.InputSignal<string | undefined>;
|
|
992
|
+
readonly userClass: _angular_core.InputSignal<string>;
|
|
993
|
+
protected readonly _disabled: _angular_core.Signal<boolean>;
|
|
994
|
+
private readonly _generatedName;
|
|
995
|
+
protected readonly _name: _angular_core.Signal<string>;
|
|
996
|
+
protected readonly _groupClass: _angular_core.Signal<string>;
|
|
997
|
+
protected _emptyValue(): string | undefined;
|
|
998
|
+
protected onValueChange(next: string): void;
|
|
999
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwRadioGroupComponent, never>;
|
|
1000
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<YuwRadioGroupComponent, "yuw-radio-group", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": true; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "ariaLabelledby": { "alias": "ariaLabelledby"; "required": false; "isSignal": true; }; "userClass": { "alias": "class"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, never>;
|
|
1001
|
+
}
|
|
1002
|
+
|
|
1003
|
+
/**
|
|
1004
|
+
* Loading skeleton placeholder directive with pulse animation effect.
|
|
1005
|
+
*
|
|
1006
|
+
* Sized using standard CSS height and width classes on the host element.
|
|
1007
|
+
*
|
|
1008
|
+
* Usage:
|
|
1009
|
+
* ```html
|
|
1010
|
+
* <div yuwSkeleton class="h-4 w-32 rounded"></div>
|
|
1011
|
+
* <div yuwSkeleton class="size-10 rounded-full"></div>
|
|
1012
|
+
* ```
|
|
1013
|
+
*/
|
|
1014
|
+
declare class YuwSkeletonDirective {
|
|
1015
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwSkeletonDirective, never>;
|
|
1016
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwSkeletonDirective, "[yuwSkeleton]", never, {}, {}, never, never, true, [{ directive: typeof i1$1.HlmSkeleton; inputs: {}; outputs: {}; }]>;
|
|
1017
|
+
}
|
|
1018
|
+
|
|
1019
|
+
/**
|
|
1020
|
+
* Container directive for card components.
|
|
1021
|
+
* Accepts optional `size` input (e.g. `'default'` or `'sm'`).
|
|
1022
|
+
*
|
|
1023
|
+
* Usage:
|
|
1024
|
+
* ```html
|
|
1025
|
+
* <div yuwCard>
|
|
1026
|
+
* <div yuwCardHeader>
|
|
1027
|
+
* <h3 yuwCardTitle>Title</h3>
|
|
1028
|
+
* <p yuwCardDescription>Description text</p>
|
|
1029
|
+
* </div>
|
|
1030
|
+
* <div yuwCardContent>Main content</div>
|
|
1031
|
+
* <div yuwCardFooter>Footer content</div>
|
|
1032
|
+
* </div>
|
|
1033
|
+
* ```
|
|
1034
|
+
*/
|
|
1035
|
+
declare class YuwCardDirective {
|
|
1036
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwCardDirective, never>;
|
|
1037
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwCardDirective, "[yuwCard]", never, {}, {}, never, never, true, [{ directive: typeof i1$2.HlmCard; inputs: { "size": "size"; }; outputs: {}; }]>;
|
|
1038
|
+
}
|
|
1039
|
+
/** Header container directive for a card. */
|
|
1040
|
+
declare class YuwCardHeaderDirective {
|
|
1041
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwCardHeaderDirective, never>;
|
|
1042
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwCardHeaderDirective, "[yuwCardHeader]", never, {}, {}, never, never, true, [{ directive: typeof i1$2.HlmCardHeader; inputs: {}; outputs: {}; }]>;
|
|
1043
|
+
}
|
|
1044
|
+
/** Heading directive for card title text. */
|
|
1045
|
+
declare class YuwCardTitleDirective {
|
|
1046
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwCardTitleDirective, never>;
|
|
1047
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwCardTitleDirective, "[yuwCardTitle]", never, {}, {}, never, never, true, [{ directive: typeof i1$2.HlmCardTitle; inputs: {}; outputs: {}; }]>;
|
|
1048
|
+
}
|
|
1049
|
+
/** Subtitle or description directive for card text. */
|
|
1050
|
+
declare class YuwCardDescriptionDirective {
|
|
1051
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwCardDescriptionDirective, never>;
|
|
1052
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwCardDescriptionDirective, "[yuwCardDescription]", never, {}, {}, never, never, true, [{ directive: typeof i1$2.HlmCardDescription; inputs: {}; outputs: {}; }]>;
|
|
1053
|
+
}
|
|
1054
|
+
/** Header action directive for placing top-right controls (e.g. menu button or status badge). */
|
|
1055
|
+
declare class YuwCardActionDirective {
|
|
1056
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwCardActionDirective, never>;
|
|
1057
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwCardActionDirective, "[yuwCardAction]", never, {}, {}, never, never, true, [{ directive: typeof i1$2.HlmCardAction; inputs: {}; outputs: {}; }]>;
|
|
1058
|
+
}
|
|
1059
|
+
/** Main body container directive for card content. */
|
|
1060
|
+
declare class YuwCardContentDirective {
|
|
1061
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwCardContentDirective, never>;
|
|
1062
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwCardContentDirective, "[yuwCardContent]", never, {}, {}, never, never, true, [{ directive: typeof i1$2.HlmCardContent; inputs: {}; outputs: {}; }]>;
|
|
1063
|
+
}
|
|
1064
|
+
/** Footer container directive for card action buttons or summary info. */
|
|
1065
|
+
declare class YuwCardFooterDirective {
|
|
1066
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwCardFooterDirective, never>;
|
|
1067
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwCardFooterDirective, "[yuwCardFooter]", never, {}, {}, never, never, true, [{ directive: typeof i1$2.HlmCardFooter; inputs: {}; outputs: {}; }]>;
|
|
1068
|
+
}
|
|
1069
|
+
/** Every card part, for a consumer's `imports`. */
|
|
1070
|
+
declare const YuwCardImports: readonly [typeof YuwCardDirective, typeof YuwCardHeaderDirective, typeof YuwCardTitleDirective, typeof YuwCardDescriptionDirective, typeof YuwCardActionDirective, typeof YuwCardContentDirective, typeof YuwCardFooterDirective];
|
|
1071
|
+
|
|
1072
|
+
/**
|
|
1073
|
+
* Container directive for empty-state layout panels (e.g., "No search results", "Inbox empty").
|
|
1074
|
+
*
|
|
1075
|
+
* Usage:
|
|
1076
|
+
* ```html
|
|
1077
|
+
* <div yuwEmpty>
|
|
1078
|
+
* <div yuwEmptyHeader>
|
|
1079
|
+
* <div yuwEmptyMedia>
|
|
1080
|
+
* <ng-icon name="lucideFolderOpen" />
|
|
1081
|
+
* </div>
|
|
1082
|
+
* <h3 yuwEmptyTitle>No files found</h3>
|
|
1083
|
+
* <p yuwEmptyDescription>Try uploading a file or changing your query.</p>
|
|
1084
|
+
* </div>
|
|
1085
|
+
* <div yuwEmptyContent>
|
|
1086
|
+
* <yuw-button>Upload File</yuw-button>
|
|
1087
|
+
* </div>
|
|
1088
|
+
* </div>
|
|
1089
|
+
* ```
|
|
1090
|
+
*/
|
|
1091
|
+
declare class YuwEmptyDirective {
|
|
1092
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwEmptyDirective, never>;
|
|
1093
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwEmptyDirective, "[yuwEmpty]", never, {}, {}, never, never, true, [{ directive: typeof i1$3.HlmEmpty; inputs: {}; outputs: {}; }]>;
|
|
1094
|
+
}
|
|
1095
|
+
/** Header container directive for empty-state title and media. */
|
|
1096
|
+
declare class YuwEmptyHeaderDirective {
|
|
1097
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwEmptyHeaderDirective, never>;
|
|
1098
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwEmptyHeaderDirective, "[yuwEmptyHeader]", never, {}, {}, never, never, true, [{ directive: typeof i1$3.HlmEmptyHeader; inputs: {}; outputs: {}; }]>;
|
|
1099
|
+
}
|
|
1100
|
+
/** Slot directive for empty-state icons or illustrations. Supports `variant` input. */
|
|
1101
|
+
declare class YuwEmptyMediaDirective {
|
|
1102
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwEmptyMediaDirective, never>;
|
|
1103
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwEmptyMediaDirective, "[yuwEmptyMedia]", never, {}, {}, never, never, true, [{ directive: typeof i1$3.HlmEmptyMedia; inputs: { "variant": "variant"; }; outputs: {}; }]>;
|
|
1104
|
+
}
|
|
1105
|
+
/** Title heading directive for empty state message. */
|
|
1106
|
+
declare class YuwEmptyTitleDirective {
|
|
1107
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwEmptyTitleDirective, never>;
|
|
1108
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwEmptyTitleDirective, "[yuwEmptyTitle]", never, {}, {}, never, never, true, [{ directive: typeof i1$3.HlmEmptyTitle; inputs: {}; outputs: {}; }]>;
|
|
1109
|
+
}
|
|
1110
|
+
/** Description paragraph directive explaining the empty state. */
|
|
1111
|
+
declare class YuwEmptyDescriptionDirective {
|
|
1112
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwEmptyDescriptionDirective, never>;
|
|
1113
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwEmptyDescriptionDirective, "[yuwEmptyDescription]", never, {}, {}, never, never, true, [{ directive: typeof i1$3.HlmEmptyDescription; inputs: {}; outputs: {}; }]>;
|
|
1114
|
+
}
|
|
1115
|
+
/** Content slot directive for action buttons or call-to-action controls in an empty state. */
|
|
1116
|
+
declare class YuwEmptyContentDirective {
|
|
1117
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwEmptyContentDirective, never>;
|
|
1118
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwEmptyContentDirective, "[yuwEmptyContent]", never, {}, {}, never, never, true, [{ directive: typeof i1$3.HlmEmptyContent; inputs: {}; outputs: {}; }]>;
|
|
1119
|
+
}
|
|
1120
|
+
/** Every empty-state part, for a consumer's `imports`. */
|
|
1121
|
+
declare const YuwEmptyImports: readonly [typeof YuwEmptyDirective, typeof YuwEmptyHeaderDirective, typeof YuwEmptyMediaDirective, typeof YuwEmptyTitleDirective, typeof YuwEmptyDescriptionDirective, typeof YuwEmptyContentDirective];
|
|
1122
|
+
|
|
1123
|
+
/**
|
|
1124
|
+
* Checkmark shown at the trailing edge of a `[yuwContextMenuCheckbox]` item while it is checked.
|
|
1125
|
+
*
|
|
1126
|
+
* Place it inside the checkbox item; the helm indicator positions itself absolutely against the
|
|
1127
|
+
* item and only becomes visible when the item carries `data-checked`.
|
|
1128
|
+
*
|
|
1129
|
+
* Usage:
|
|
1130
|
+
* ```html
|
|
1131
|
+
* <button yuwContextMenuCheckbox [checked]="showArchived()" (triggered)="toggleArchived()">
|
|
1132
|
+
* Show archived
|
|
1133
|
+
* <yuw-context-menu-checkbox-indicator />
|
|
1134
|
+
* </button>
|
|
1135
|
+
* ```
|
|
1136
|
+
*/
|
|
1137
|
+
declare class YuwContextMenuCheckboxIndicatorComponent {
|
|
1138
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwContextMenuCheckboxIndicatorComponent, never>;
|
|
1139
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<YuwContextMenuCheckboxIndicatorComponent, "yuw-context-menu-checkbox-indicator", never, {}, {}, never, never, true, never>;
|
|
1140
|
+
}
|
|
1141
|
+
|
|
1142
|
+
/**
|
|
1143
|
+
* Mark shown at the trailing edge of a `[yuwContextMenuRadio]` item while it is selected.
|
|
1144
|
+
*
|
|
1145
|
+
* Place it inside the radio item; the helm indicator positions itself absolutely against the
|
|
1146
|
+
* item and only becomes visible when the item carries `data-checked`.
|
|
1147
|
+
*
|
|
1148
|
+
* Usage:
|
|
1149
|
+
* ```html
|
|
1150
|
+
* <button yuwContextMenuRadio [checked]="order() === 'asc'" (triggered)="setOrder('asc')">
|
|
1151
|
+
* Ascending
|
|
1152
|
+
* <yuw-context-menu-radio-indicator />
|
|
1153
|
+
* </button>
|
|
1154
|
+
* ```
|
|
1155
|
+
*/
|
|
1156
|
+
declare class YuwContextMenuRadioIndicatorComponent {
|
|
1157
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwContextMenuRadioIndicatorComponent, never>;
|
|
1158
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<YuwContextMenuRadioIndicatorComponent, "yuw-context-menu-radio-indicator", never, {}, {}, never, never, true, never>;
|
|
1159
|
+
}
|
|
1160
|
+
|
|
1161
|
+
/**
|
|
1162
|
+
* Trailing chevron for a `[yuwContextMenuSubTrigger]` item, signalling that it opens a nested
|
|
1163
|
+
* sub-menu. Flips automatically in RTL layouts.
|
|
1164
|
+
*
|
|
1165
|
+
* Usage:
|
|
1166
|
+
* ```html
|
|
1167
|
+
* <button [yuwContextMenuSubTrigger]="subMenu">
|
|
1168
|
+
* More tools
|
|
1169
|
+
* <yuw-context-menu-sub-indicator />
|
|
1170
|
+
* </button>
|
|
1171
|
+
* ```
|
|
1172
|
+
*/
|
|
1173
|
+
declare class YuwContextMenuSubIndicatorComponent {
|
|
1174
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwContextMenuSubIndicatorComponent, never>;
|
|
1175
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<YuwContextMenuSubIndicatorComponent, "yuw-context-menu-sub-indicator", never, {}, {}, never, never, true, never>;
|
|
1176
|
+
}
|
|
1177
|
+
|
|
1178
|
+
/**
|
|
1179
|
+
* Context menu directives suite based on right-click actions and panel controls.
|
|
1180
|
+
*
|
|
1181
|
+
* Why some inputs/outputs below are bridged imperatively instead of forwarded via
|
|
1182
|
+
* `hostDirectives`: Angular only lets a wrapper re-expose a host directive's *own* (or
|
|
1183
|
+
* class-inherited) inputs/outputs. Names the helm layer itself only *exposes* from its own host
|
|
1184
|
+
* directives (`hlmContextMenuTrigger`, `hlmContextMenuOpened`/`hlmContextMenuClosed`, the items'
|
|
1185
|
+
* `checked`/`disabled`/`keepOpen`/`triggered`) are not re-exposable one level further — the
|
|
1186
|
+
* compiler rejects the mapping with NG2017 ("does not have an input with a public name of …"),
|
|
1187
|
+
* and the runtime's `validateMappings` enforces the same rule. Verified against Angular 21.2
|
|
1188
|
+
* (`validateHostDirectiveMappings` in the compiler, `validateMappings` in core) and reproduced
|
|
1189
|
+
* with an isolated `ngc` compile. Own inputs of the helm classes (`disabled`/`align`/`side` on
|
|
1190
|
+
* the trigger, `inset`/`variant` on items, `sideOffset` on the panel) *are* forwarded
|
|
1191
|
+
* declaratively.
|
|
1192
|
+
*/
|
|
1193
|
+
/**
|
|
1194
|
+
* Attach to an element to open a context menu upon right-clicking.
|
|
1195
|
+
*
|
|
1196
|
+
* Usage:
|
|
1197
|
+
* ```html
|
|
1198
|
+
* <div [yuwContextMenuTrigger]="menu">Right-click me</div>
|
|
1199
|
+
*
|
|
1200
|
+
* <ng-template #menu>
|
|
1201
|
+
* <div yuwContextMenu>
|
|
1202
|
+
* <button yuwContextMenuItem (triggered)="onEdit()">Edit</button>
|
|
1203
|
+
* <button yuwContextMenuItem variant="destructive" (triggered)="onDelete()">Delete</button>
|
|
1204
|
+
* </div>
|
|
1205
|
+
* </ng-template>
|
|
1206
|
+
* ```
|
|
1207
|
+
*/
|
|
1208
|
+
declare class YuwContextMenuTriggerDirective {
|
|
1209
|
+
private readonly _trigger;
|
|
1210
|
+
readonly menu: _angular_core.InputSignal<TemplateRef<unknown>>;
|
|
1211
|
+
readonly menuData: _angular_core.InputSignal<unknown>;
|
|
1212
|
+
readonly opened: _angular_core.OutputRef<void>;
|
|
1213
|
+
readonly closed: _angular_core.OutputRef<void>;
|
|
1214
|
+
constructor();
|
|
1215
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwContextMenuTriggerDirective, never>;
|
|
1216
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwContextMenuTriggerDirective, "[yuwContextMenuTrigger]", never, { "menu": { "alias": "yuwContextMenuTrigger"; "required": true; "isSignal": true; }; "menuData": { "alias": "yuwContextMenuTriggerData"; "required": false; "isSignal": true; }; }, { "opened": "opened"; "closed": "closed"; }, never, never, true, [{ directive: typeof i1$4.HlmContextMenuTrigger; inputs: { "disabled": "disabled"; "align": "align"; "side": "side"; }; outputs: {}; }]>;
|
|
1217
|
+
}
|
|
1218
|
+
/** Container directive for context menu options, placed inside the context menu template. */
|
|
1219
|
+
declare class YuwContextMenuDirective {
|
|
1220
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwContextMenuDirective, never>;
|
|
1221
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwContextMenuDirective, "[yuwContextMenu]", never, {}, {}, never, never, true, [{ directive: typeof i2.HlmDropdownMenu; inputs: { "sideOffset": "sideOffset"; }; outputs: {}; }]>;
|
|
1222
|
+
}
|
|
1223
|
+
/** Interactive action item within a context menu. Place on a `<button>` element. */
|
|
1224
|
+
declare class YuwContextMenuItemDirective {
|
|
1225
|
+
private readonly _item;
|
|
1226
|
+
readonly triggered: _angular_core.OutputRef<void>;
|
|
1227
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwContextMenuItemDirective, never>;
|
|
1228
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwContextMenuItemDirective, "[yuwContextMenuItem]", never, {}, { "triggered": "triggered"; }, never, never, true, [{ directive: typeof i2.HlmDropdownMenuItem; inputs: { "disabled": "disabled"; "variant": "variant"; "inset": "inset"; }; outputs: {}; }]>;
|
|
1229
|
+
}
|
|
1230
|
+
/**
|
|
1231
|
+
* Checkable action item within a context menu. Place on a `<button>` element and project a
|
|
1232
|
+
* `<yuw-context-menu-checkbox-indicator />` to show the checkmark while checked.
|
|
1233
|
+
*
|
|
1234
|
+
* Toggling keeps the menu open (the helm default). The `checked` input drives the state; listen
|
|
1235
|
+
* to `triggered` to flip it in the consumer.
|
|
1236
|
+
*
|
|
1237
|
+
* Usage:
|
|
1238
|
+
* ```html
|
|
1239
|
+
* <button yuwContextMenuCheckbox [checked]="showArchived()" (triggered)="toggleArchived()">
|
|
1240
|
+
* Show archived
|
|
1241
|
+
* <yuw-context-menu-checkbox-indicator />
|
|
1242
|
+
* </button>
|
|
1243
|
+
* ```
|
|
1244
|
+
*/
|
|
1245
|
+
declare class YuwContextMenuCheckboxDirective {
|
|
1246
|
+
private readonly _item;
|
|
1247
|
+
readonly checked: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1248
|
+
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1249
|
+
readonly triggered: _angular_core.OutputRef<void>;
|
|
1250
|
+
constructor();
|
|
1251
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwContextMenuCheckboxDirective, never>;
|
|
1252
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwContextMenuCheckboxDirective, "[yuwContextMenuCheckbox]", never, { "checked": { "alias": "checked"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "triggered": "triggered"; }, never, never, true, [{ directive: typeof i2.HlmDropdownMenuCheckbox; inputs: { "inset": "inset"; }; outputs: {}; }]>;
|
|
1253
|
+
}
|
|
1254
|
+
/**
|
|
1255
|
+
* Single-select (radio) item within a context menu. Place on a `<button>` element inside a
|
|
1256
|
+
* `[yuwContextMenuGroup]` and project a `<yuw-context-menu-radio-indicator />` to show the mark
|
|
1257
|
+
* while selected.
|
|
1258
|
+
*
|
|
1259
|
+
* Selecting keeps the menu open (the helm default). The `checked` input drives the state; listen
|
|
1260
|
+
* to `triggered` to set it in the consumer.
|
|
1261
|
+
*
|
|
1262
|
+
* Usage:
|
|
1263
|
+
* ```html
|
|
1264
|
+
* <div yuwContextMenuGroup>
|
|
1265
|
+
* <button yuwContextMenuRadio [checked]="order() === 'asc'" (triggered)="setOrder('asc')">
|
|
1266
|
+
* Ascending
|
|
1267
|
+
* <yuw-context-menu-radio-indicator />
|
|
1268
|
+
* </button>
|
|
1269
|
+
* </div>
|
|
1270
|
+
* ```
|
|
1271
|
+
*/
|
|
1272
|
+
declare class YuwContextMenuRadioDirective {
|
|
1273
|
+
private readonly _item;
|
|
1274
|
+
readonly checked: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1275
|
+
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1276
|
+
readonly triggered: _angular_core.OutputRef<void>;
|
|
1277
|
+
constructor();
|
|
1278
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwContextMenuRadioDirective, never>;
|
|
1279
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwContextMenuRadioDirective, "[yuwContextMenuRadio]", never, { "checked": { "alias": "checked"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "triggered": "triggered"; }, never, never, true, [{ directive: typeof i2.HlmDropdownMenuRadio; inputs: {}; outputs: {}; }]>;
|
|
1280
|
+
}
|
|
1281
|
+
/** Section heading/label within a context menu. */
|
|
1282
|
+
declare class YuwContextMenuLabelDirective {
|
|
1283
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwContextMenuLabelDirective, never>;
|
|
1284
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwContextMenuLabelDirective, "[yuwContextMenuLabel]", never, {}, {}, never, never, true, [{ directive: typeof i2.HlmDropdownMenuLabel; inputs: { "inset": "inset"; }; outputs: {}; }]>;
|
|
1285
|
+
}
|
|
1286
|
+
/** Group container for grouping context menu items (required around `[yuwContextMenuRadio]` sets). */
|
|
1287
|
+
declare class YuwContextMenuGroupDirective {
|
|
1288
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwContextMenuGroupDirective, never>;
|
|
1289
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwContextMenuGroupDirective, "[yuwContextMenuGroup]", never, {}, {}, never, never, true, [{ directive: typeof i2.HlmDropdownMenuGroup; inputs: {}; outputs: {}; }]>;
|
|
1290
|
+
}
|
|
1291
|
+
/** Visual divider line between context menu items. */
|
|
1292
|
+
declare class YuwContextMenuSeparatorDirective {
|
|
1293
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwContextMenuSeparatorDirective, never>;
|
|
1294
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwContextMenuSeparatorDirective, "[yuwContextMenuSeparator]", never, {}, {}, never, never, true, [{ directive: typeof i2.HlmDropdownMenuSeparator; inputs: {}; outputs: {}; }]>;
|
|
1295
|
+
}
|
|
1296
|
+
/** Text hint for a keyboard shortcut displayed alongside a context menu item. */
|
|
1297
|
+
declare class YuwContextMenuShortcutDirective {
|
|
1298
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwContextMenuShortcutDirective, never>;
|
|
1299
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwContextMenuShortcutDirective, "[yuwContextMenuShortcut]", never, {}, {}, never, never, true, [{ directive: typeof i2.HlmDropdownMenuShortcut; inputs: {}; outputs: {}; }]>;
|
|
1300
|
+
}
|
|
1301
|
+
/** Container directive for nesting a sub-level context menu. */
|
|
1302
|
+
declare class YuwContextMenuSubDirective {
|
|
1303
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwContextMenuSubDirective, never>;
|
|
1304
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwContextMenuSubDirective, "[yuwContextMenuSub]", never, {}, {}, never, never, true, [{ directive: typeof i2.HlmDropdownMenuSub; inputs: {}; outputs: {}; }]>;
|
|
1305
|
+
}
|
|
1306
|
+
/**
|
|
1307
|
+
* Trigger item for expanding a nested sub-context menu.
|
|
1308
|
+
*
|
|
1309
|
+
* Usage:
|
|
1310
|
+
* ```html
|
|
1311
|
+
* <button [yuwContextMenuSubTrigger]="subMenu">
|
|
1312
|
+
* More tools
|
|
1313
|
+
* <yuw-context-menu-sub-indicator />
|
|
1314
|
+
* </button>
|
|
1315
|
+
* ```
|
|
1316
|
+
*/
|
|
1317
|
+
declare class YuwContextMenuSubTriggerDirective {
|
|
1318
|
+
private readonly _trigger;
|
|
1319
|
+
readonly menu: _angular_core.InputSignal<TemplateRef<unknown>>;
|
|
1320
|
+
constructor();
|
|
1321
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwContextMenuSubTriggerDirective, never>;
|
|
1322
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwContextMenuSubTriggerDirective, "[yuwContextMenuSubTrigger]", never, { "menu": { "alias": "yuwContextMenuSubTrigger"; "required": true; "isSignal": true; }; }, {}, never, never, true, [{ directive: typeof i2.HlmDropdownMenuSubTrigger; inputs: { "align": "align"; "side": "side"; }; outputs: {}; }]>;
|
|
1323
|
+
}
|
|
1324
|
+
/** Every context-menu part, for a consumer's `imports`. */
|
|
1325
|
+
declare const YuwContextMenuImports: readonly [typeof YuwContextMenuTriggerDirective, typeof YuwContextMenuDirective, typeof YuwContextMenuItemDirective, typeof YuwContextMenuCheckboxDirective, typeof YuwContextMenuCheckboxIndicatorComponent, typeof YuwContextMenuRadioDirective, typeof YuwContextMenuRadioIndicatorComponent, typeof YuwContextMenuLabelDirective, typeof YuwContextMenuGroupDirective, typeof YuwContextMenuSeparatorDirective, typeof YuwContextMenuShortcutDirective, typeof YuwContextMenuSubDirective, typeof YuwContextMenuSubTriggerDirective, typeof YuwContextMenuSubIndicatorComponent];
|
|
1326
|
+
|
|
1327
|
+
type YuwDatepickerValue = Date | [Date, Date] | Date[] | null;
|
|
1328
|
+
type YuwDatepickerModeDto = 'single' | 'range' | 'multiple' | 'monthYear';
|
|
1329
|
+
/**
|
|
1330
|
+
* Date picker control supporting single date, date range, multiple dates, or month/year pick modes.
|
|
1331
|
+
*
|
|
1332
|
+
* Inputs / Models:
|
|
1333
|
+
* - `mode`: Selection mode (`'single'`, `'range'`, `'multiple'`, `'monthYear'`). Default is `'single'`.
|
|
1334
|
+
* - `value`: Two-way selected date(s) (`YuwDatepickerValue`). Shape follows `mode`. Emits
|
|
1335
|
+
* `valueChange` on every selection change.
|
|
1336
|
+
* - `disabled`: Disables the control.
|
|
1337
|
+
* - `placeholder`: Text shown on the trigger while nothing is selected.
|
|
1338
|
+
* - `minDate`: Earliest selectable date.
|
|
1339
|
+
* - `maxDate`: Latest selectable date.
|
|
1340
|
+
* - `captionLayout`: Calendar caption mode — `'dropdown'` adds month/year dropdowns for faster year navigation. Default is `'label'`.
|
|
1341
|
+
* Ignored in `monthYear` mode: that picker renders its own month/year grid and has no calendar caption.
|
|
1342
|
+
* - `align`: Popover alignment relative to trigger (`'start'`, `'center'`, `'end'`). Default is `'start'`.
|
|
1343
|
+
* - `buttonId`: HTML `id` for the trigger button, enabling external `<label for="...">`
|
|
1344
|
+
* association. When omitted, a unique per-instance id is generated.
|
|
1345
|
+
* - `class`: Extra classes merged onto the trigger button (e.g. a width), consumer classes win.
|
|
1346
|
+
* - `invalid`: Forces invalid styling.
|
|
1347
|
+
* - `formatDate`: Custom date formatter function `(date: Date) => string` for the trigger label.
|
|
1348
|
+
* In `range`/`multiple` modes it formats each date, joined with `' - '` / `', '`.
|
|
1349
|
+
*
|
|
1350
|
+
* Usage:
|
|
1351
|
+
* ```html
|
|
1352
|
+
* <yuw-datepicker [(value)]="selectedDate" placeholder="Select date..." />
|
|
1353
|
+
* <yuw-datepicker mode="range" [(value)]="dateRange" />
|
|
1354
|
+
* <yuw-datepicker mode="monthYear" [(value)]="selectedMonth" />
|
|
1355
|
+
* ```
|
|
1356
|
+
*/
|
|
1357
|
+
declare class YuwDatepickerComponent extends YuwValueAccessorBase<YuwDatepickerValue> {
|
|
1358
|
+
readonly mode: _angular_core.InputSignal<YuwDatepickerModeDto>;
|
|
1359
|
+
readonly value: _angular_core.ModelSignal<YuwDatepickerValue>;
|
|
1360
|
+
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1361
|
+
readonly placeholder: _angular_core.InputSignal<string | undefined>;
|
|
1362
|
+
readonly minDate: _angular_core.InputSignal<Date | undefined>;
|
|
1363
|
+
readonly maxDate: _angular_core.InputSignal<Date | undefined>;
|
|
1364
|
+
readonly captionLayout: _angular_core.InputSignal<"dropdown" | "label" | "dropdown-months" | "dropdown-years">;
|
|
1365
|
+
readonly align: _angular_core.InputSignal<"start" | "center" | "end">;
|
|
1366
|
+
readonly buttonId: _angular_core.InputSignal<string | undefined>;
|
|
1367
|
+
readonly userClass: _angular_core.InputSignal<string>;
|
|
1368
|
+
readonly invalid: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1369
|
+
readonly formatDate: _angular_core.InputSignal<((date: Date) => string) | undefined>;
|
|
1370
|
+
protected readonly _disabled: _angular_core.Signal<boolean>;
|
|
1371
|
+
private readonly _generatedButtonId;
|
|
1372
|
+
protected readonly _buttonId: _angular_core.Signal<string>;
|
|
1373
|
+
private readonly _singleConfig;
|
|
1374
|
+
private readonly _rangeConfig;
|
|
1375
|
+
private readonly _multiConfig;
|
|
1376
|
+
private readonly _monthYearConfig;
|
|
1377
|
+
protected readonly _formatSingle: _angular_core.Signal<(date: Date) => string>;
|
|
1378
|
+
protected readonly _formatMonthYear: _angular_core.Signal<(date: Date) => string>;
|
|
1379
|
+
protected readonly _formatRange: _angular_core.Signal<(dates: [Date | null, Date | null]) => string>;
|
|
1380
|
+
protected readonly _formatMulti: _angular_core.Signal<(dates: Date[]) => string>;
|
|
1381
|
+
protected readonly _singleValue: _angular_core.Signal<Date | undefined>;
|
|
1382
|
+
protected readonly _rangeValue: _angular_core.Signal<[Date, Date] | undefined>;
|
|
1383
|
+
protected readonly _multipleValue: _angular_core.Signal<Date[]>;
|
|
1384
|
+
protected _emptyValue(): YuwDatepickerValue;
|
|
1385
|
+
protected onValueChange(next: YuwDatepickerValue): void;
|
|
1386
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwDatepickerComponent, never>;
|
|
1387
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<YuwDatepickerComponent, "yuw-datepicker", never, { "mode": { "alias": "mode"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "minDate": { "alias": "minDate"; "required": false; "isSignal": true; }; "maxDate": { "alias": "maxDate"; "required": false; "isSignal": true; }; "captionLayout": { "alias": "captionLayout"; "required": false; "isSignal": true; }; "align": { "alias": "align"; "required": false; "isSignal": true; }; "buttonId": { "alias": "buttonId"; "required": false; "isSignal": true; }; "userClass": { "alias": "class"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "formatDate": { "alias": "formatDate"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, never>;
|
|
1388
|
+
}
|
|
1389
|
+
|
|
1390
|
+
/**
|
|
1391
|
+
* Outer wrapper container directive for responsive HTML table scroll container.
|
|
1392
|
+
*
|
|
1393
|
+
* Usage:
|
|
1394
|
+
* ```html
|
|
1395
|
+
* <div yuwTableContainer>
|
|
1396
|
+
* <table yuwTable>
|
|
1397
|
+
* <thead yuwTHead>
|
|
1398
|
+
* <tr yuwTr><th yuwTh>Header</th></tr>
|
|
1399
|
+
* </thead>
|
|
1400
|
+
* <tbody yuwTBody>
|
|
1401
|
+
* <tr yuwTr><td yuwTd>Data cell</td></tr>
|
|
1402
|
+
* </tbody>
|
|
1403
|
+
* </table>
|
|
1404
|
+
* </div>
|
|
1405
|
+
* ```
|
|
1406
|
+
*/
|
|
1407
|
+
declare class YuwTableContainerDirective {
|
|
1408
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwTableContainerDirective, never>;
|
|
1409
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwTableContainerDirective, "[yuwTableContainer]", never, {}, {}, never, never, true, [{ directive: typeof i1$5.HlmTableContainer; inputs: {}; outputs: {}; }]>;
|
|
1410
|
+
}
|
|
1411
|
+
/** Table element styling directive applied to native `<table>`. */
|
|
1412
|
+
declare class YuwTableDirective {
|
|
1413
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwTableDirective, never>;
|
|
1414
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwTableDirective, "[yuwTable]", never, {}, {}, never, never, true, [{ directive: typeof i1$5.HlmTable; inputs: {}; outputs: {}; }]>;
|
|
1415
|
+
}
|
|
1416
|
+
/** Table header container directive applied to native `<thead>`. */
|
|
1417
|
+
declare class YuwTHeadDirective {
|
|
1418
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwTHeadDirective, never>;
|
|
1419
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwTHeadDirective, "[yuwTHead]", never, {}, {}, never, never, true, [{ directive: typeof i1$5.HlmTHead; inputs: {}; outputs: {}; }]>;
|
|
1420
|
+
}
|
|
1421
|
+
/** Table body container directive applied to native `<tbody>`. */
|
|
1422
|
+
declare class YuwTBodyDirective {
|
|
1423
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwTBodyDirective, never>;
|
|
1424
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwTBodyDirective, "[yuwTBody]", never, {}, {}, never, never, true, [{ directive: typeof i1$5.HlmTBody; inputs: {}; outputs: {}; }]>;
|
|
1425
|
+
}
|
|
1426
|
+
/** Table footer container directive applied to native `<tfoot>`. */
|
|
1427
|
+
declare class YuwTFootDirective {
|
|
1428
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwTFootDirective, never>;
|
|
1429
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwTFootDirective, "[yuwTFoot]", never, {}, {}, never, never, true, [{ directive: typeof i1$5.HlmTFoot; inputs: {}; outputs: {}; }]>;
|
|
1430
|
+
}
|
|
1431
|
+
/** Table row directive applied to native `<tr>`. */
|
|
1432
|
+
declare class YuwTrDirective {
|
|
1433
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwTrDirective, never>;
|
|
1434
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwTrDirective, "[yuwTr]", never, {}, {}, never, never, true, [{ directive: typeof i1$5.HlmTr; inputs: {}; outputs: {}; }]>;
|
|
1435
|
+
}
|
|
1436
|
+
/** Table header cell directive applied to native `<th>`. */
|
|
1437
|
+
declare class YuwThDirective {
|
|
1438
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwThDirective, never>;
|
|
1439
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwThDirective, "[yuwTh]", never, {}, {}, never, never, true, [{ directive: typeof i1$5.HlmTh; inputs: {}; outputs: {}; }]>;
|
|
1440
|
+
}
|
|
1441
|
+
/** Table data cell directive applied to native `<td>`. */
|
|
1442
|
+
declare class YuwTdDirective {
|
|
1443
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwTdDirective, never>;
|
|
1444
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwTdDirective, "[yuwTd]", never, {}, {}, never, never, true, [{ directive: typeof i1$5.HlmTd; inputs: {}; outputs: {}; }]>;
|
|
1445
|
+
}
|
|
1446
|
+
/** Table caption directive applied to native `<caption>`. */
|
|
1447
|
+
declare class YuwCaptionDirective {
|
|
1448
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwCaptionDirective, never>;
|
|
1449
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwCaptionDirective, "[yuwCaption]", never, {}, {}, never, never, true, [{ directive: typeof i1$5.HlmCaption; inputs: {}; outputs: {}; }]>;
|
|
1450
|
+
}
|
|
1451
|
+
/** Every table part, for a consumer's `imports`. */
|
|
1452
|
+
declare const YuwTableImports: readonly [typeof YuwTableContainerDirective, typeof YuwTableDirective, typeof YuwTHeadDirective, typeof YuwTBodyDirective, typeof YuwTFootDirective, typeof YuwTrDirective, typeof YuwThDirective, typeof YuwTdDirective, typeof YuwCaptionDirective];
|
|
1453
|
+
|
|
1454
|
+
/**
|
|
1455
|
+
* The feature set `yuw-datatable` enables.
|
|
1456
|
+
*
|
|
1457
|
+
* Declared as an interface keyed by feature name rather than `typeof` an object literal: TanStack
|
|
1458
|
+
* v9 types every feature constant as a bare `TableFeature`, and carries the *capabilities* on the
|
|
1459
|
+
* key names instead (see its own `StockFeatures`). A `typeof` would therefore widen every entry to
|
|
1460
|
+
* `TableFeature` and lose which features are actually on, leaving the table's own methods
|
|
1461
|
+
* (`getState`, `getCanNextPage`, …) missing from the instance type.
|
|
1462
|
+
*/
|
|
1463
|
+
interface YuwDatatableFeatures {
|
|
1464
|
+
columnFilteringFeature: typeof columnFilteringFeature;
|
|
1465
|
+
columnVisibilityFeature: typeof columnVisibilityFeature;
|
|
1466
|
+
rowPaginationFeature: typeof rowPaginationFeature;
|
|
1467
|
+
rowSelectionFeature: typeof rowSelectionFeature;
|
|
1468
|
+
rowSortingFeature: typeof rowSortingFeature;
|
|
1469
|
+
}
|
|
1470
|
+
declare const YUW_DATATABLE_FEATURES: YuwDatatableFeatures;
|
|
1471
|
+
type YuwDatatableColumnDef<TData extends RowData> = ColumnDef<YuwDatatableFeatures, TData>;
|
|
1472
|
+
/**
|
|
1473
|
+
* Full-featured data table component supporting sorting, filtering, pagination, row selection,
|
|
1474
|
+
* loading skeleton state, and column visibility.
|
|
1475
|
+
*
|
|
1476
|
+
* Inputs / Models:
|
|
1477
|
+
* - `columns`: Column definitions array (`YuwDatatableColumnDef<TData>[]`). Default is `[]`.
|
|
1478
|
+
* - `data`: Row data array (`TData[]`). Default is `[]`.
|
|
1479
|
+
* - `sortable`: Enables click-to-sort on headers whose column allows it.
|
|
1480
|
+
* - `paginated`: Enables the pagination row model and renders footer controls.
|
|
1481
|
+
* - `selectable`: Enables the row-selection state. The checkbox column itself is *not* rendered
|
|
1482
|
+
* by the datatable — the consumer provides it as a display column (`id: 'select'`,
|
|
1483
|
+
* `flexRenderComponent(...)` header/cell that call TanStack's own toggle handlers), as in the
|
|
1484
|
+
* demo's data page.
|
|
1485
|
+
* - `emptyText`: Message shown when data is empty or filtered to nothing. User-facing text the
|
|
1486
|
+
* consuming app is responsible for translating.
|
|
1487
|
+
* - `loading`: Renders skeleton rows instead of data. The pagination footer stays visible (with
|
|
1488
|
+
* its buttons disabled) so the layout doesn't jump.
|
|
1489
|
+
* - `loadingRows`: Number of skeleton rows to show while `loading`. Default is `5`.
|
|
1490
|
+
* - `previousPageLabel` (required): Accessible name for the footer's previous-page button.
|
|
1491
|
+
* User-facing text the consuming app is responsible for translating.
|
|
1492
|
+
* - `nextPageLabel` (required): Accessible name for the footer's next-page button. User-facing
|
|
1493
|
+
* text the consuming app is responsible for translating.
|
|
1494
|
+
* - `caption`: Optional `<caption>` text for the table. User-facing text the consuming app is
|
|
1495
|
+
* responsible for translating; when absent, no caption is rendered.
|
|
1496
|
+
* - `tableClass`: Extra classes merged onto the inner `<table>` element. The host is
|
|
1497
|
+
* `display: contents`, so a plain `class` on `<yuw-datatable>` would never reach the table.
|
|
1498
|
+
* - `sorting`: Two-way sorting state (`SortingState`).
|
|
1499
|
+
* - `columnFilters`: Two-way column filters state (`ColumnFiltersState`).
|
|
1500
|
+
* - `columnVisibility`: Two-way column visibility state (`ColumnVisibilityState`).
|
|
1501
|
+
* - `rowSelection`: Two-way row selection state (`RowSelectionState`).
|
|
1502
|
+
* - `pagination`: Two-way pagination state (`PaginationState`). Default is `{ pageIndex: 0, pageSize: 10 }`.
|
|
1503
|
+
*
|
|
1504
|
+
* Outputs:
|
|
1505
|
+
* - `selectedRowsChange`: Emits the selected row objects (`TData[]`) on selection changes. The
|
|
1506
|
+
* initial state does not emit — only actual changes after mount.
|
|
1507
|
+
*
|
|
1508
|
+
* Usage:
|
|
1509
|
+
* ```html
|
|
1510
|
+
* <yuw-datatable
|
|
1511
|
+
* [columns]="columns"
|
|
1512
|
+
* [data]="users"
|
|
1513
|
+
* [(sorting)]="sorting"
|
|
1514
|
+
* paginated
|
|
1515
|
+
* selectable
|
|
1516
|
+
* previousPageLabel="Página anterior"
|
|
1517
|
+
* nextPageLabel="Página siguiente"
|
|
1518
|
+
* (selectedRowsChange)="onSelect($event)"
|
|
1519
|
+
* />
|
|
1520
|
+
* ```
|
|
1521
|
+
*/
|
|
1522
|
+
declare class YuwDatatableComponent<TData extends RowData> implements OnInit {
|
|
1523
|
+
readonly columns: _angular_core.InputSignal<YuwDatatableColumnDef<TData>[]>;
|
|
1524
|
+
readonly data: _angular_core.InputSignal<TData[]>;
|
|
1525
|
+
readonly sortable: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1526
|
+
readonly paginated: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1527
|
+
readonly selectable: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1528
|
+
readonly emptyText: _angular_core.InputSignal<string | undefined>;
|
|
1529
|
+
readonly loading: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1530
|
+
readonly loadingRows: _angular_core.InputSignalWithTransform<number, unknown>;
|
|
1531
|
+
readonly previousPageLabel: _angular_core.InputSignal<string>;
|
|
1532
|
+
readonly nextPageLabel: _angular_core.InputSignal<string>;
|
|
1533
|
+
readonly caption: _angular_core.InputSignal<string | undefined>;
|
|
1534
|
+
readonly tableClass: _angular_core.InputSignal<string | undefined>;
|
|
1535
|
+
readonly sorting: _angular_core.ModelSignal<SortingState>;
|
|
1536
|
+
readonly columnFilters: _angular_core.ModelSignal<ColumnFiltersState>;
|
|
1537
|
+
readonly columnVisibility: _angular_core.ModelSignal<ColumnVisibilityState>;
|
|
1538
|
+
readonly rowSelection: _angular_core.ModelSignal<RowSelectionState>;
|
|
1539
|
+
readonly pagination: _angular_core.ModelSignal<PaginationState>;
|
|
1540
|
+
private readonly _options;
|
|
1541
|
+
protected readonly table: _tanstack_angular_table.AngularTable<YuwDatatableFeatures, TData>;
|
|
1542
|
+
private readonly _selectedRows;
|
|
1543
|
+
readonly selectedRowsChange: _angular_core.OutputRef<TData[]>;
|
|
1544
|
+
/**
|
|
1545
|
+
* Applies the real options once, after inputs are set.
|
|
1546
|
+
*
|
|
1547
|
+
* `injectTable` constructs the table from a `queueMicrotask` that can fire before Angular has
|
|
1548
|
+
* assigned any input, so it captures `columns: []`/`data: []`. Its own options effect then
|
|
1549
|
+
* *skips its first run* (an `isMount` guard inside the library) — and that skipped run is
|
|
1550
|
+
* exactly the one carrying the real values. Without this the table stays permanently empty no
|
|
1551
|
+
* matter what is bound.
|
|
1552
|
+
*
|
|
1553
|
+
* This runs in `ngOnInit` rather than a constructor `effect` because the effect fires in the
|
|
1554
|
+
* same too-early window and re-applies the same empty options; `ngOnInit` is the first point
|
|
1555
|
+
* where inputs are guaranteed present. Later changes are handled by the library's own effect,
|
|
1556
|
+
* which by then is past its mount guard.
|
|
1557
|
+
*/
|
|
1558
|
+
ngOnInit(): void;
|
|
1559
|
+
protected readonly _isEmpty: _angular_core.Signal<boolean>;
|
|
1560
|
+
protected readonly _columnCount: _angular_core.Signal<number>;
|
|
1561
|
+
protected readonly _skeletonRows: _angular_core.Signal<number[]>;
|
|
1562
|
+
protected readonly _tableClass: _angular_core.Signal<string>;
|
|
1563
|
+
protected readonly _ariaSort: Record<'asc' | 'desc', 'ascending' | 'descending'>;
|
|
1564
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwDatatableComponent<any>, never>;
|
|
1565
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<YuwDatatableComponent<any>, "yuw-datatable", never, { "columns": { "alias": "columns"; "required": false; "isSignal": true; }; "data": { "alias": "data"; "required": false; "isSignal": true; }; "sortable": { "alias": "sortable"; "required": false; "isSignal": true; }; "paginated": { "alias": "paginated"; "required": false; "isSignal": true; }; "selectable": { "alias": "selectable"; "required": false; "isSignal": true; }; "emptyText": { "alias": "emptyText"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "loadingRows": { "alias": "loadingRows"; "required": false; "isSignal": true; }; "previousPageLabel": { "alias": "previousPageLabel"; "required": true; "isSignal": true; }; "nextPageLabel": { "alias": "nextPageLabel"; "required": true; "isSignal": true; }; "caption": { "alias": "caption"; "required": false; "isSignal": true; }; "tableClass": { "alias": "tableClass"; "required": false; "isSignal": true; }; "sorting": { "alias": "sorting"; "required": false; "isSignal": true; }; "columnFilters": { "alias": "columnFilters"; "required": false; "isSignal": true; }; "columnVisibility": { "alias": "columnVisibility"; "required": false; "isSignal": true; }; "rowSelection": { "alias": "rowSelection"; "required": false; "isSignal": true; }; "pagination": { "alias": "pagination"; "required": false; "isSignal": true; }; }, { "sorting": "sortingChange"; "columnFilters": "columnFiltersChange"; "columnVisibility": "columnVisibilityChange"; "rowSelection": "rowSelectionChange"; "pagination": "paginationChange"; "selectedRowsChange": "selectedRowsChange"; }, never, never, true, never>;
|
|
1566
|
+
}
|
|
1567
|
+
|
|
1568
|
+
/** A single entry in `<yuw-avatar>`'s `group` input, which turns it into a stack of overlapping avatars. */
|
|
1569
|
+
interface YuwAvatarGroupItemDto {
|
|
1570
|
+
alt: string;
|
|
1571
|
+
src?: string;
|
|
1572
|
+
fallback: string;
|
|
1573
|
+
}
|
|
1574
|
+
|
|
1575
|
+
/** The size vocabulary of `<yuw-avatar>`. */
|
|
1576
|
+
type YuwAvatarSizeDto = 'default' | 'sm' | 'lg';
|
|
1577
|
+
/**
|
|
1578
|
+
* Displays a user or entity avatar with optional image, fallback text/initials, status badge, or overlapping group layout.
|
|
1579
|
+
*
|
|
1580
|
+
* Inputs:
|
|
1581
|
+
* - `size`: Avatar size (`'default'`, `'sm'`, `'lg'`). Default is `'default'`.
|
|
1582
|
+
* - `src`: Image URL for single-avatar mode. Omit to display fallback text.
|
|
1583
|
+
* - `alt`: Required. Accessible label for single-avatar mode and fallback text. User-facing text —
|
|
1584
|
+
* the consuming app is responsible for providing (and translating) it.
|
|
1585
|
+
* - `fallback`: Fallback text or initials shown when image is loading, unprovided, or fails to load.
|
|
1586
|
+
* - `badge`: Renders a status badge marker on the bottom-right corner (single-avatar mode).
|
|
1587
|
+
* - `group`: Array of item DTOs (`YuwAvatarGroupItemDto[]`) to render as an overlapping avatar group stack.
|
|
1588
|
+
* - `groupCount`: Overflow label string (e.g. `"+5"`) displayed at the end of an avatar group stack.
|
|
1589
|
+
* - `class`: Extra CSS classes merged onto the inner `hlm-avatar` element(s); merged last, so they win.
|
|
1590
|
+
*
|
|
1591
|
+
* Single Avatar Usage:
|
|
1592
|
+
* ```html
|
|
1593
|
+
* <yuw-avatar src="/path/to/user.png" alt="Jane Doe" fallback="JD" />
|
|
1594
|
+
* <yuw-avatar alt="Jane Doe" fallback="JD" badge />
|
|
1595
|
+
* ```
|
|
1596
|
+
*
|
|
1597
|
+
* Avatar Group Usage:
|
|
1598
|
+
* ```html
|
|
1599
|
+
* <yuw-avatar [group]="teamMembers" alt="Team" groupCount="+5" />
|
|
1600
|
+
* ```
|
|
1601
|
+
*/
|
|
1602
|
+
declare class YuwAvatarComponent {
|
|
1603
|
+
readonly size: _angular_core.InputSignal<YuwAvatarSizeDto>;
|
|
1604
|
+
readonly src: _angular_core.InputSignal<string | undefined>;
|
|
1605
|
+
readonly alt: _angular_core.InputSignal<string>;
|
|
1606
|
+
readonly fallback: _angular_core.InputSignal<string | undefined>;
|
|
1607
|
+
readonly badge: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1608
|
+
readonly group: _angular_core.InputSignal<YuwAvatarGroupItemDto[] | undefined>;
|
|
1609
|
+
readonly groupCount: _angular_core.InputSignal<string | undefined>;
|
|
1610
|
+
readonly userClass: _angular_core.InputSignal<string>;
|
|
1611
|
+
protected readonly _isGroup: _angular_core.Signal<boolean>;
|
|
1612
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwAvatarComponent, never>;
|
|
1613
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<YuwAvatarComponent, "yuw-avatar", never, { "size": { "alias": "size"; "required": false; "isSignal": true; }; "src": { "alias": "src"; "required": false; "isSignal": true; }; "alt": { "alias": "alt"; "required": true; "isSignal": true; }; "fallback": { "alias": "fallback"; "required": false; "isSignal": true; }; "badge": { "alias": "badge"; "required": false; "isSignal": true; }; "group": { "alias": "group"; "required": false; "isSignal": true; }; "groupCount": { "alias": "groupCount"; "required": false; "isSignal": true; }; "userClass": { "alias": "class"; "required": false; "isSignal": true; }; }, {}, never, ["[yuwAvatarBadgeIcon]"], true, never>;
|
|
1614
|
+
}
|
|
1615
|
+
|
|
1616
|
+
/**
|
|
1617
|
+
* Container directive for list/row item layout structures.
|
|
1618
|
+
* Accepts optional `variant` and `size` inputs.
|
|
1619
|
+
*
|
|
1620
|
+
* Usage:
|
|
1621
|
+
* ```html
|
|
1622
|
+
* <div yuwItem>
|
|
1623
|
+
* <div yuwItemMedia><yuw-avatar fallback="JD" alt="John Doe" /></div>
|
|
1624
|
+
* <div yuwItemContent>
|
|
1625
|
+
* <h4 yuwItemTitle>John Doe</h4>
|
|
1626
|
+
* <p yuwItemDescription>Software Engineer</p>
|
|
1627
|
+
* </div>
|
|
1628
|
+
* <div yuwItemActions><yuw-button size="sm">Follow</yuw-button></div>
|
|
1629
|
+
* </div>
|
|
1630
|
+
* ```
|
|
1631
|
+
*/
|
|
1632
|
+
declare class YuwItemDirective {
|
|
1633
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwItemDirective, never>;
|
|
1634
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwItemDirective, "[yuwItem], yuw-item", never, {}, {}, never, never, true, [{ directive: typeof i1$6.HlmItem; inputs: { "variant": "variant"; "size": "size"; }; outputs: {}; }]>;
|
|
1635
|
+
}
|
|
1636
|
+
/** Header slot directive for an item container. */
|
|
1637
|
+
declare class YuwItemHeaderDirective {
|
|
1638
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwItemHeaderDirective, never>;
|
|
1639
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwItemHeaderDirective, "[yuwItemHeader], yuw-item-header", never, {}, {}, never, never, true, [{ directive: typeof i1$6.HlmItemHeader; inputs: {}; outputs: {}; }]>;
|
|
1640
|
+
}
|
|
1641
|
+
/** Leading media slot directive (for icons, avatars, or images) at the start of an item. Supports `variant` (`'default'`, `'icon'`, `'image'`). */
|
|
1642
|
+
declare class YuwItemMediaDirective {
|
|
1643
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwItemMediaDirective, never>;
|
|
1644
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwItemMediaDirective, "[yuwItemMedia], yuw-item-media", never, {}, {}, never, never, true, [{ directive: typeof i1$6.HlmItemMedia; inputs: { "variant": "variant"; }; outputs: {}; }]>;
|
|
1645
|
+
}
|
|
1646
|
+
/** Main text content container directive for an item. */
|
|
1647
|
+
declare class YuwItemContentDirective {
|
|
1648
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwItemContentDirective, never>;
|
|
1649
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwItemContentDirective, "[yuwItemContent], yuw-item-content", never, {}, {}, never, never, true, [{ directive: typeof i1$6.HlmItemContent; inputs: {}; outputs: {}; }]>;
|
|
1650
|
+
}
|
|
1651
|
+
/** Title heading directive for an item. */
|
|
1652
|
+
declare class YuwItemTitleDirective {
|
|
1653
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwItemTitleDirective, never>;
|
|
1654
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwItemTitleDirective, "[yuwItemTitle], yuw-item-title", never, {}, {}, never, never, true, [{ directive: typeof i1$6.HlmItemTitle; inputs: {}; outputs: {}; }]>;
|
|
1655
|
+
}
|
|
1656
|
+
/** Subtitle or description paragraph directive for an item. */
|
|
1657
|
+
declare class YuwItemDescriptionDirective {
|
|
1658
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwItemDescriptionDirective, never>;
|
|
1659
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwItemDescriptionDirective, "[yuwItemDescription], yuw-item-description", never, {}, {}, never, never, true, [{ directive: typeof i1$6.HlmItemDescription; inputs: {}; outputs: {}; }]>;
|
|
1660
|
+
}
|
|
1661
|
+
/** Trailing action controls slot directive (for buttons, switches, or menu triggers) at the end of an item. */
|
|
1662
|
+
declare class YuwItemActionsDirective {
|
|
1663
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwItemActionsDirective, never>;
|
|
1664
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwItemActionsDirective, "[yuwItemActions], yuw-item-actions", never, {}, {}, never, never, true, [{ directive: typeof i1$6.HlmItemActions; inputs: {}; outputs: {}; }]>;
|
|
1665
|
+
}
|
|
1666
|
+
/** Footer slot directive for an item. */
|
|
1667
|
+
declare class YuwItemFooterDirective {
|
|
1668
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwItemFooterDirective, never>;
|
|
1669
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwItemFooterDirective, "[yuwItemFooter], yuw-item-footer", never, {}, {}, never, never, true, [{ directive: typeof i1$6.HlmItemFooter; inputs: {}; outputs: {}; }]>;
|
|
1670
|
+
}
|
|
1671
|
+
/** Container directive for grouping multiple item rows together into a list card or bordered group. */
|
|
1672
|
+
declare class YuwItemGroupDirective {
|
|
1673
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwItemGroupDirective, never>;
|
|
1674
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwItemGroupDirective, "[yuwItemGroup], yuw-item-group", never, {}, {}, never, never, true, [{ directive: typeof i1$6.HlmItemGroup; inputs: {}; outputs: {}; }]>;
|
|
1675
|
+
}
|
|
1676
|
+
/**
|
|
1677
|
+
* Visual separator line between items inside a group. Accepts `orientation` (`'horizontal'` or
|
|
1678
|
+
* `'vertical'`), reaching the underlying `BrnSeparator`, which owns the `role`,
|
|
1679
|
+
* `aria-orientation` and `data-orientation` attributes. Extends `HlmItemSeparator` (instead of
|
|
1680
|
+
* composing it via `hostDirectives`) because `orientation` is re-exposed by the helm from
|
|
1681
|
+
* `BrnSeparator` through its own `hostDirectives`, and host-directive forwarding is not
|
|
1682
|
+
* transitive (NG2017).
|
|
1683
|
+
*/
|
|
1684
|
+
declare class YuwItemSeparatorDirective extends HlmItemSeparator {
|
|
1685
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwItemSeparatorDirective, never>;
|
|
1686
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwItemSeparatorDirective, "[yuwItemSeparator], yuw-item-separator", never, {}, {}, never, never, true, never>;
|
|
1687
|
+
}
|
|
1688
|
+
/** Every item part, for a consumer's `imports`. */
|
|
1689
|
+
declare const YuwItemImports: readonly [typeof YuwItemDirective, typeof YuwItemHeaderDirective, typeof YuwItemMediaDirective, typeof YuwItemContentDirective, typeof YuwItemTitleDirective, typeof YuwItemDescriptionDirective, typeof YuwItemActionsDirective, typeof YuwItemFooterDirective, typeof YuwItemGroupDirective, typeof YuwItemSeparatorDirective];
|
|
1690
|
+
|
|
1691
|
+
/**
|
|
1692
|
+
* Marks an element as the sheet's footer content, projected into the footer slot.
|
|
1693
|
+
* Its presence is also what makes the footer render at all — without it the sheet
|
|
1694
|
+
* shows no empty footer strip.
|
|
1695
|
+
*/
|
|
1696
|
+
declare class YuwSheetFooterDirective {
|
|
1697
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwSheetFooterDirective, never>;
|
|
1698
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwSheetFooterDirective, "[yuwSheetFooter]", never, {}, {}, never, never, true, never>;
|
|
1699
|
+
}
|
|
1700
|
+
|
|
1701
|
+
type YuwSheetSideDto = 'top' | 'bottom' | 'left' | 'right';
|
|
1702
|
+
/**
|
|
1703
|
+
* Slide-in sheet overlay panel component for side drawers, dialogs, and detail views.
|
|
1704
|
+
*
|
|
1705
|
+
* Accessibility: provide either `title` or `ariaLabel` — a modal panel without an accessible name
|
|
1706
|
+
* is announced as an anonymous dialog by screen readers.
|
|
1707
|
+
*
|
|
1708
|
+
* Inputs / Models:
|
|
1709
|
+
* - `open`: Two-way open/closed state (`boolean`). Drive directly via `[(open)]` to open/close programmatically.
|
|
1710
|
+
* - `showTrigger`: Whether to render the trigger button. Set `false` when opening only via `[(open)]`.
|
|
1711
|
+
* - `side`: Edge of the screen the panel slides in from (`'top'`, `'bottom'`, `'left'`, `'right'`). Default is `'right'`.
|
|
1712
|
+
* - `title`: Optional header title text. User-facing text the consuming app is responsible for translating.
|
|
1713
|
+
* - `description`: Optional header description text. User-facing text the consuming app is responsible for translating.
|
|
1714
|
+
* - `ariaLabel`: Accessible name for the sheet when no visible `title` is rendered. User-facing
|
|
1715
|
+
* text the consuming app is responsible for translating.
|
|
1716
|
+
* - `closeLabel`: Accessible label of the corner close (×) button. When set, the close button
|
|
1717
|
+
* renders and screen readers read this label; when absent there is no close button. User-facing
|
|
1718
|
+
* text the consuming app is responsible for translating.
|
|
1719
|
+
* - `panelClass`: Extra classes merged onto the sheet panel (e.g. `sm:max-w-lg` to widen it).
|
|
1720
|
+
* They win over the library defaults via `twMerge`.
|
|
1721
|
+
* - `triggerVariant`: Button style variant for the trigger button.
|
|
1722
|
+
* - `triggerSize`: Button size for the trigger button.
|
|
1723
|
+
*
|
|
1724
|
+
* Usage:
|
|
1725
|
+
* ```html
|
|
1726
|
+
* <yuw-sheet [(open)]="isOpen" side="right" title="Edit Profile" description="Update your account details." closeLabel="Close">
|
|
1727
|
+
* <ng-container yuwSheetTrigger>Edit Profile</ng-container>
|
|
1728
|
+
*
|
|
1729
|
+
* <p>Sheet form content goes here.</p>
|
|
1730
|
+
*
|
|
1731
|
+
* <div yuwSheetFooter>
|
|
1732
|
+
* <yuw-button (clicked)="save()">Save Changes</yuw-button>
|
|
1733
|
+
* </div>
|
|
1734
|
+
* </yuw-sheet>
|
|
1735
|
+
* ```
|
|
1736
|
+
*/
|
|
1737
|
+
declare class YuwSheetComponent {
|
|
1738
|
+
readonly open: _angular_core.ModelSignal<boolean>;
|
|
1739
|
+
readonly showTrigger: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1740
|
+
readonly side: _angular_core.InputSignal<YuwSheetSideDto>;
|
|
1741
|
+
readonly title: _angular_core.InputSignal<string | undefined>;
|
|
1742
|
+
readonly description: _angular_core.InputSignal<string | undefined>;
|
|
1743
|
+
readonly ariaLabel: _angular_core.InputSignal<string | undefined>;
|
|
1744
|
+
readonly closeLabel: _angular_core.InputSignal<string | undefined>;
|
|
1745
|
+
readonly panelClass: _angular_core.InputSignal<string | undefined>;
|
|
1746
|
+
readonly triggerVariant: _angular_core.InputSignal<"secondary" | "destructive" | "default" | "outline" | "ghost" | "link" | null | undefined>;
|
|
1747
|
+
readonly triggerSize: _angular_core.InputSignal<"default" | "xs" | "sm" | "lg" | "icon" | "icon-xs" | "icon-sm" | "icon-lg" | null | undefined>;
|
|
1748
|
+
protected readonly hasFooter: _angular_core.Signal<YuwSheetFooterDirective | undefined>;
|
|
1749
|
+
protected readonly _sheetState: _angular_core.Signal<"open" | "closed">;
|
|
1750
|
+
protected onStateChanged(state: 'open' | 'closed'): void;
|
|
1751
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwSheetComponent, never>;
|
|
1752
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<YuwSheetComponent, "yuw-sheet", never, { "open": { "alias": "open"; "required": false; "isSignal": true; }; "showTrigger": { "alias": "showTrigger"; "required": false; "isSignal": true; }; "side": { "alias": "side"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; "description": { "alias": "description"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "closeLabel": { "alias": "closeLabel"; "required": false; "isSignal": true; }; "panelClass": { "alias": "panelClass"; "required": false; "isSignal": true; }; "triggerVariant": { "alias": "triggerVariant"; "required": false; "isSignal": true; }; "triggerSize": { "alias": "triggerSize"; "required": false; "isSignal": true; }; }, { "open": "openChange"; }, ["hasFooter"], ["[yuwSheetTrigger]", "*", "[yuwSheetFooter]"], true, never>;
|
|
1753
|
+
}
|
|
1754
|
+
declare const YuwSheetImports: readonly [typeof YuwSheetComponent, typeof YuwSheetFooterDirective];
|
|
1755
|
+
|
|
1756
|
+
type YuwPopoverAlignDto = 'start' | 'center' | 'end';
|
|
1757
|
+
/**
|
|
1758
|
+
* Popover component for displaying anchored floating overlay panels.
|
|
1759
|
+
*
|
|
1760
|
+
* Inputs / Models:
|
|
1761
|
+
* - `open`: Two-way open/closed state (`boolean`). Drive directly via `[(open)]` to open/close programmatically.
|
|
1762
|
+
* - `showTrigger`: Whether to render the trigger button. Set `false` when opening only via `[(open)]`.
|
|
1763
|
+
* - `align`: Panel alignment relative to trigger (`'start'`, `'center'`, `'end'`). Default is `'center'`.
|
|
1764
|
+
* - `sideOffset`: Pixel offset between the trigger and the panel. Default is `4`.
|
|
1765
|
+
* - `title`: Optional header title text. User-facing text the consuming app is responsible for translating.
|
|
1766
|
+
* - `description`: Optional header description text. User-facing text the consuming app is responsible for translating.
|
|
1767
|
+
* - `panelClass`: Extra classes merged onto the popover panel (e.g. `w-80` to widen it). They win
|
|
1768
|
+
* over the library defaults via `twMerge`.
|
|
1769
|
+
* - `triggerVariant`: Button style variant for the trigger button.
|
|
1770
|
+
* - `triggerSize`: Button size for the trigger button.
|
|
1771
|
+
*
|
|
1772
|
+
* Usage:
|
|
1773
|
+
* ```html
|
|
1774
|
+
* <yuw-popover [(open)]="isOpen" title="Notifications" description="You're all caught up.">
|
|
1775
|
+
* <ng-container yuwPopoverTrigger>View Notifications</ng-container>
|
|
1776
|
+
*
|
|
1777
|
+
* <p>Popover content body goes here.</p>
|
|
1778
|
+
* </yuw-popover>
|
|
1779
|
+
* ```
|
|
1780
|
+
*/
|
|
1781
|
+
declare class YuwPopoverComponent {
|
|
1782
|
+
readonly open: _angular_core.ModelSignal<boolean>;
|
|
1783
|
+
readonly showTrigger: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1784
|
+
readonly align: _angular_core.InputSignal<YuwPopoverAlignDto>;
|
|
1785
|
+
readonly sideOffset: _angular_core.InputSignal<number>;
|
|
1786
|
+
readonly title: _angular_core.InputSignal<string | undefined>;
|
|
1787
|
+
readonly description: _angular_core.InputSignal<string | undefined>;
|
|
1788
|
+
readonly panelClass: _angular_core.InputSignal<string | undefined>;
|
|
1789
|
+
readonly triggerVariant: _angular_core.InputSignal<"secondary" | "destructive" | "default" | "outline" | "ghost" | "link" | null | undefined>;
|
|
1790
|
+
readonly triggerSize: _angular_core.InputSignal<"default" | "xs" | "sm" | "lg" | "icon" | "icon-xs" | "icon-sm" | "icon-lg" | null | undefined>;
|
|
1791
|
+
protected readonly _popoverState: _angular_core.Signal<"open" | "closed">;
|
|
1792
|
+
protected onOpenChange(state: 'open' | 'closed'): void;
|
|
1793
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwPopoverComponent, never>;
|
|
1794
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<YuwPopoverComponent, "yuw-popover", never, { "open": { "alias": "open"; "required": false; "isSignal": true; }; "showTrigger": { "alias": "showTrigger"; "required": false; "isSignal": true; }; "align": { "alias": "align"; "required": false; "isSignal": true; }; "sideOffset": { "alias": "sideOffset"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; "description": { "alias": "description"; "required": false; "isSignal": true; }; "panelClass": { "alias": "panelClass"; "required": false; "isSignal": true; }; "triggerVariant": { "alias": "triggerVariant"; "required": false; "isSignal": true; }; "triggerSize": { "alias": "triggerSize"; "required": false; "isSignal": true; }; }, { "open": "openChange"; }, never, ["[yuwPopoverTrigger]", "*"], true, never>;
|
|
1795
|
+
}
|
|
1796
|
+
|
|
1797
|
+
type YuwTooltipPositionDto = 'top' | 'bottom' | 'left' | 'right';
|
|
1798
|
+
/**
|
|
1799
|
+
* Tooltip directive applied directly to the element that should show a hint on hover/focus.
|
|
1800
|
+
*
|
|
1801
|
+
* Inputs:
|
|
1802
|
+
* - `yuwTooltip`: Tooltip text (or `TemplateRef`) to display. User-facing text the consuming app
|
|
1803
|
+
* is responsible for translating.
|
|
1804
|
+
* - `position`: Side the tooltip opens on (`'top'`, `'bottom'`, `'left'`, `'right'`). Default is `'top'`.
|
|
1805
|
+
* - `showDelay`: Milliseconds before the tooltip opens on hover. Defaults to the Brain tooltip
|
|
1806
|
+
* config default (`150`).
|
|
1807
|
+
* - `hideDelay`: Milliseconds before the tooltip closes after the pointer leaves. Defaults to the
|
|
1808
|
+
* Brain tooltip config default (`100`).
|
|
1809
|
+
* - `tooltipDisabled`: Disables the tooltip entirely.
|
|
1810
|
+
*
|
|
1811
|
+
* Usage:
|
|
1812
|
+
* ```html
|
|
1813
|
+
* <button yuwTooltip="Save changes" hlmBtn>Save</button>
|
|
1814
|
+
* <yuw-button [yuwTooltip]="helpText" position="right">Help</yuw-button>
|
|
1815
|
+
* ```
|
|
1816
|
+
*/
|
|
1817
|
+
declare class YuwTooltipDirective {
|
|
1818
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwTooltipDirective, never>;
|
|
1819
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwTooltipDirective, "[yuwTooltip]", never, {}, {}, never, never, true, [{ directive: typeof i1$7.BrnTooltip; inputs: { "brnTooltip": "yuwTooltip"; "position": "position"; "hideDelay": "hideDelay"; "showDelay": "showDelay"; "tooltipDisabled": "tooltipDisabled"; }; outputs: {}; }]>;
|
|
1820
|
+
}
|
|
1821
|
+
|
|
1822
|
+
/**
|
|
1823
|
+
* Indeterminate loading spinner.
|
|
1824
|
+
*
|
|
1825
|
+
* Inputs:
|
|
1826
|
+
* - `label`: Accessible label announced by screen readers. User-facing text the consuming app is
|
|
1827
|
+
* responsible for translating.
|
|
1828
|
+
* - `icon`: Name of a registered icon to spin instead of the default loader.
|
|
1829
|
+
*
|
|
1830
|
+
* Usage:
|
|
1831
|
+
* ```html
|
|
1832
|
+
* <yuw-spinner label="Cargando" />
|
|
1833
|
+
* ```
|
|
1834
|
+
*/
|
|
1835
|
+
declare class YuwSpinnerComponent {
|
|
1836
|
+
readonly label: _angular_core.InputSignal<string>;
|
|
1837
|
+
readonly icon: _angular_core.InputSignal<string>;
|
|
1838
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwSpinnerComponent, never>;
|
|
1839
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<YuwSpinnerComponent, "yuw-spinner", never, { "label": { "alias": "label"; "required": true; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
1840
|
+
}
|
|
1841
|
+
|
|
1842
|
+
type YuwToasterPositionDto = 'top-left' | 'top-center' | 'top-right' | 'bottom-left' | 'bottom-center' | 'bottom-right';
|
|
1843
|
+
type YuwToasterThemeDto = 'light' | 'dark' | 'system';
|
|
1844
|
+
/**
|
|
1845
|
+
* Global toast host. Mount once near the application root; individual toasts are dispatched
|
|
1846
|
+
* through the `toast` API from `@spartan-ng/brain/sonner`.
|
|
1847
|
+
*
|
|
1848
|
+
* Inputs:
|
|
1849
|
+
* - `richColors`: Enables per-type colored toasts (success, error, warning, info). Enabled by
|
|
1850
|
+
* default — a deliberate deviation from the spartan default (`false`).
|
|
1851
|
+
* - `theme`: Toast color theme (`'light'`, `'dark'`, `'system'`). Default is `'light'` (the helm
|
|
1852
|
+
* default) — apps rendering in dark mode must pass `'dark'` (or `'system'`) explicitly.
|
|
1853
|
+
* - `toastOptions`: Default options applied to every toast (classes, styles, etc.), passed
|
|
1854
|
+
* through to the underlying sonner toaster.
|
|
1855
|
+
* - `position`: Screen corner the stack renders in. Default is `'bottom-right'`.
|
|
1856
|
+
* - `duration`: Milliseconds a toast stays visible. Default is `4000`.
|
|
1857
|
+
* - `visibleToasts`: Maximum simultaneously visible toasts. Default is `3`.
|
|
1858
|
+
* - `closeButton`: Renders a dismiss button on each toast.
|
|
1859
|
+
* - `expand`: Keeps the stack expanded instead of collapsed.
|
|
1860
|
+
*
|
|
1861
|
+
* Usage:
|
|
1862
|
+
* ```html
|
|
1863
|
+
* <yuw-toaster />
|
|
1864
|
+
* ```
|
|
1865
|
+
*/
|
|
1866
|
+
declare class YuwToasterComponent {
|
|
1867
|
+
readonly richColors: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1868
|
+
readonly theme: _angular_core.InputSignal<YuwToasterThemeDto>;
|
|
1869
|
+
readonly toastOptions: _angular_core.InputSignal<ToastOptions>;
|
|
1870
|
+
readonly position: _angular_core.InputSignal<YuwToasterPositionDto>;
|
|
1871
|
+
readonly duration: _angular_core.InputSignalWithTransform<number, unknown>;
|
|
1872
|
+
readonly visibleToasts: _angular_core.InputSignalWithTransform<number, unknown>;
|
|
1873
|
+
readonly closeButton: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1874
|
+
readonly expand: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1875
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwToasterComponent, never>;
|
|
1876
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<YuwToasterComponent, "yuw-toaster", never, { "richColors": { "alias": "richColors"; "required": false; "isSignal": true; }; "theme": { "alias": "theme"; "required": false; "isSignal": true; }; "toastOptions": { "alias": "toastOptions"; "required": false; "isSignal": true; }; "position": { "alias": "position"; "required": false; "isSignal": true; }; "duration": { "alias": "duration"; "required": false; "isSignal": true; }; "visibleToasts": { "alias": "visibleToasts"; "required": false; "isSignal": true; }; "closeButton": { "alias": "closeButton"; "required": false; "isSignal": true; }; "expand": { "alias": "expand"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
1877
|
+
}
|
|
1878
|
+
|
|
1879
|
+
/**
|
|
1880
|
+
* Marks a projected element as the trailing action of a `<yuw-alert>`, which pins it to the
|
|
1881
|
+
* top-right corner of the alert.
|
|
1882
|
+
*/
|
|
1883
|
+
declare class YuwAlertActionDirective {
|
|
1884
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwAlertActionDirective, never>;
|
|
1885
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwAlertActionDirective, "[yuwAlertAction]", never, {}, {}, never, never, true, never>;
|
|
1886
|
+
}
|
|
1887
|
+
|
|
1888
|
+
/**
|
|
1889
|
+
* Marks projected rich content (links, `<strong>`, …) as the description of a `<yuw-alert>`.
|
|
1890
|
+
*
|
|
1891
|
+
* When present, the alert projects this content into its description slot instead of rendering
|
|
1892
|
+
* the `description` string input. The content lands inside the element carrying the helm
|
|
1893
|
+
* `alert-description` data-slot, so the alert's grid keeps positioning it correctly.
|
|
1894
|
+
*/
|
|
1895
|
+
declare class YuwAlertDescriptionDirective {
|
|
1896
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwAlertDescriptionDirective, never>;
|
|
1897
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwAlertDescriptionDirective, "[yuwAlertDescription]", never, {}, {}, never, never, true, never>;
|
|
1898
|
+
}
|
|
1899
|
+
|
|
1900
|
+
/**
|
|
1901
|
+
* Marks projected rich content (links, `<strong>`, …) as the title of a `<yuw-alert>`.
|
|
1902
|
+
*
|
|
1903
|
+
* When present, the alert projects this content into its title slot instead of rendering the
|
|
1904
|
+
* `title` string input. The content lands inside the element carrying the helm `alert-title`
|
|
1905
|
+
* data-slot, so the alert's grid keeps positioning it correctly.
|
|
1906
|
+
*/
|
|
1907
|
+
declare class YuwAlertTitleDirective {
|
|
1908
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwAlertTitleDirective, never>;
|
|
1909
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwAlertTitleDirective, "[yuwAlertTitle]", never, {}, {}, never, never, true, never>;
|
|
1910
|
+
}
|
|
1911
|
+
|
|
1912
|
+
type YuwAlertVariantDto = 'default' | 'destructive';
|
|
1913
|
+
/**
|
|
1914
|
+
* Inline, non-blocking message panel for status and validation feedback.
|
|
1915
|
+
*
|
|
1916
|
+
* Inputs:
|
|
1917
|
+
* - `variant`: Visual tone (`'default'`, `'destructive'`). Default is `'default'`.
|
|
1918
|
+
* - `title`: Heading text. User-facing text the consuming app is responsible for translating.
|
|
1919
|
+
* Ignored when a `[yuwAlertTitle]` slot is projected.
|
|
1920
|
+
* - `description`: Body text. User-facing text the consuming app is responsible for translating.
|
|
1921
|
+
* Ignored when a `[yuwAlertDescription]` slot is projected.
|
|
1922
|
+
* - `class`: Classes forwarded to the inner `hlm-alert` panel (the host is `display: contents`,
|
|
1923
|
+
* so they would otherwise never reach the rendered element). The consumer's classes win over
|
|
1924
|
+
* the alert's own styling.
|
|
1925
|
+
*
|
|
1926
|
+
* Content slots:
|
|
1927
|
+
* - `[yuwAlertIcon]`: Leading icon.
|
|
1928
|
+
* - `[yuwAlertTitle]`: Rich title content (links, `<strong>`, …). Replaces the `title` input.
|
|
1929
|
+
* - `[yuwAlertDescription]`: Rich description content. Replaces the `description` input.
|
|
1930
|
+
* - `[yuwAlertAction]`: Trailing action control, pinned to the top-right corner.
|
|
1931
|
+
*
|
|
1932
|
+
* Usage:
|
|
1933
|
+
* ```html
|
|
1934
|
+
* <yuw-alert variant="destructive" title="Pago rechazado" description="Revisa los datos de la tarjeta.">
|
|
1935
|
+
* <ng-icon yuwAlertIcon name="lucideTriangleAlert" />
|
|
1936
|
+
* <yuw-button yuwAlertAction size="sm" variant="ghost">Reintentar</yuw-button>
|
|
1937
|
+
* </yuw-alert>
|
|
1938
|
+
*
|
|
1939
|
+
* <yuw-alert>
|
|
1940
|
+
* <span yuwAlertTitle>Condiciones <strong>actualizadas</strong></span>
|
|
1941
|
+
* <span yuwAlertDescription>Consulta los <a href="/cambios">cambios</a> antes de continuar.</span>
|
|
1942
|
+
* </yuw-alert>
|
|
1943
|
+
* ```
|
|
1944
|
+
*/
|
|
1945
|
+
declare class YuwAlertComponent {
|
|
1946
|
+
readonly variant: _angular_core.InputSignal<YuwAlertVariantDto>;
|
|
1947
|
+
readonly title: _angular_core.InputSignal<string | undefined>;
|
|
1948
|
+
readonly description: _angular_core.InputSignal<string | undefined>;
|
|
1949
|
+
readonly userClass: _angular_core.InputSignal<string>;
|
|
1950
|
+
protected readonly hasAction: _angular_core.Signal<YuwAlertActionDirective | undefined>;
|
|
1951
|
+
protected readonly titleSlot: _angular_core.Signal<YuwAlertTitleDirective | undefined>;
|
|
1952
|
+
protected readonly descriptionSlot: _angular_core.Signal<YuwAlertDescriptionDirective | undefined>;
|
|
1953
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwAlertComponent, never>;
|
|
1954
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<YuwAlertComponent, "yuw-alert", never, { "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; "description": { "alias": "description"; "required": false; "isSignal": true; }; "userClass": { "alias": "class"; "required": false; "isSignal": true; }; }, {}, ["hasAction", "titleSlot", "descriptionSlot"], ["[yuwAlertIcon]", "[yuwAlertTitle]", "[yuwAlertDescription]", "*", "[yuwAlertAction]"], true, never>;
|
|
1955
|
+
}
|
|
1956
|
+
declare const YuwAlertImports: readonly [typeof YuwAlertComponent, typeof YuwAlertActionDirective, typeof YuwAlertTitleDirective, typeof YuwAlertDescriptionDirective];
|
|
1957
|
+
|
|
1958
|
+
/**
|
|
1959
|
+
* Marks an element as the dialog's footer content, projected into the footer slot.
|
|
1960
|
+
* Its presence is also what makes the footer render at all — without it the dialog
|
|
1961
|
+
* shows no empty footer strip.
|
|
1962
|
+
*/
|
|
1963
|
+
declare class YuwDialogFooterDirective {
|
|
1964
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwDialogFooterDirective, never>;
|
|
1965
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwDialogFooterDirective, "[yuwDialogFooter]", never, {}, {}, never, never, true, never>;
|
|
1966
|
+
}
|
|
1967
|
+
|
|
1968
|
+
/**
|
|
1969
|
+
* Modal dialog overlay for focused tasks and forms.
|
|
1970
|
+
*
|
|
1971
|
+
* Accessibility: provide either `title` or `ariaLabel` — a modal without an accessible name is
|
|
1972
|
+
* announced as an anonymous dialog by screen readers.
|
|
1973
|
+
*
|
|
1974
|
+
* Inputs / Models:
|
|
1975
|
+
* - `open`: Two-way open/closed state. Drive via `[(open)]` to control it programmatically.
|
|
1976
|
+
* - `showTrigger`: Whether to render the trigger button. Set `false` when opening only via `[(open)]`.
|
|
1977
|
+
* - `title`: Header title text. User-facing text the consuming app is responsible for translating.
|
|
1978
|
+
* - `description`: Header description text. User-facing text the consuming app is responsible for translating.
|
|
1979
|
+
* - `ariaLabel`: Accessible name for the dialog when no visible `title` is rendered. User-facing
|
|
1980
|
+
* text the consuming app is responsible for translating.
|
|
1981
|
+
* - `closeLabel`: Accessible label of the corner close (×) button. When set, the close button
|
|
1982
|
+
* renders and screen readers read this label; when absent there is no close button. User-facing
|
|
1983
|
+
* text the consuming app is responsible for translating.
|
|
1984
|
+
* - `panelClass`: Extra classes merged onto the dialog panel (e.g. `sm:max-w-lg` to widen it).
|
|
1985
|
+
* They win over the library defaults via `twMerge`.
|
|
1986
|
+
* - `triggerVariant`: Button style variant for the trigger button. Default is `'outline'`.
|
|
1987
|
+
* - `triggerSize`: Button size for the trigger button.
|
|
1988
|
+
*
|
|
1989
|
+
* Content slots:
|
|
1990
|
+
* - `[yuwDialogTrigger]`: Trigger button content.
|
|
1991
|
+
* - `[yuwDialogFooter]`: Footer actions (`YuwDialogFooterDirective`). The footer only renders when
|
|
1992
|
+
* this slot is filled.
|
|
1993
|
+
*
|
|
1994
|
+
* The projected body scrolls internally when it is taller than the viewport, like `<yuw-sheet>`.
|
|
1995
|
+
*
|
|
1996
|
+
* Usage:
|
|
1997
|
+
* ```html
|
|
1998
|
+
* <yuw-dialog [(open)]="isOpen" title="Crear proyecto" description="Asigna un nombre para empezar." closeLabel="Cerrar">
|
|
1999
|
+
* <ng-container yuwDialogTrigger>Crear proyecto</ng-container>
|
|
2000
|
+
*
|
|
2001
|
+
* <yuw-input [(value)]="name" label="Nombre" />
|
|
2002
|
+
*
|
|
2003
|
+
* <div yuwDialogFooter>
|
|
2004
|
+
* <yuw-button (clicked)="save()">Guardar</yuw-button>
|
|
2005
|
+
* </div>
|
|
2006
|
+
* </yuw-dialog>
|
|
2007
|
+
* ```
|
|
2008
|
+
*/
|
|
2009
|
+
declare class YuwDialogComponent {
|
|
2010
|
+
readonly open: _angular_core.ModelSignal<boolean>;
|
|
2011
|
+
readonly showTrigger: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
2012
|
+
readonly title: _angular_core.InputSignal<string | undefined>;
|
|
2013
|
+
readonly description: _angular_core.InputSignal<string | undefined>;
|
|
2014
|
+
readonly ariaLabel: _angular_core.InputSignal<string | undefined>;
|
|
2015
|
+
readonly closeLabel: _angular_core.InputSignal<string | undefined>;
|
|
2016
|
+
readonly panelClass: _angular_core.InputSignal<string | undefined>;
|
|
2017
|
+
readonly triggerVariant: _angular_core.InputSignal<"secondary" | "destructive" | "default" | "outline" | "ghost" | "link" | null | undefined>;
|
|
2018
|
+
readonly triggerSize: _angular_core.InputSignal<"default" | "xs" | "sm" | "lg" | "icon" | "icon-xs" | "icon-sm" | "icon-lg" | null | undefined>;
|
|
2019
|
+
protected readonly hasFooter: _angular_core.Signal<YuwDialogFooterDirective | undefined>;
|
|
2020
|
+
protected readonly _dialogState: _angular_core.Signal<"open" | "closed">;
|
|
2021
|
+
protected onStateChanged(state: 'open' | 'closed'): void;
|
|
2022
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwDialogComponent, never>;
|
|
2023
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<YuwDialogComponent, "yuw-dialog", never, { "open": { "alias": "open"; "required": false; "isSignal": true; }; "showTrigger": { "alias": "showTrigger"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; "description": { "alias": "description"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "closeLabel": { "alias": "closeLabel"; "required": false; "isSignal": true; }; "panelClass": { "alias": "panelClass"; "required": false; "isSignal": true; }; "triggerVariant": { "alias": "triggerVariant"; "required": false; "isSignal": true; }; "triggerSize": { "alias": "triggerSize"; "required": false; "isSignal": true; }; }, { "open": "openChange"; }, ["hasFooter"], ["[yuwDialogTrigger]", "*", "[yuwDialogFooter]"], true, never>;
|
|
2024
|
+
}
|
|
2025
|
+
declare const YuwDialogImports: readonly [typeof YuwDialogComponent, typeof YuwDialogFooterDirective];
|
|
2026
|
+
|
|
2027
|
+
/**
|
|
2028
|
+
* Marks a projected element as the leading media of a `<yuw-alert-dialog>`, rendered in a
|
|
2029
|
+
* highlighted square above or beside the title.
|
|
2030
|
+
*/
|
|
2031
|
+
declare class YuwAlertDialogMediaDirective {
|
|
2032
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwAlertDialogMediaDirective, never>;
|
|
2033
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwAlertDialogMediaDirective, "[yuwAlertDialogMedia]", never, {}, {}, never, never, true, never>;
|
|
2034
|
+
}
|
|
2035
|
+
|
|
2036
|
+
type YuwAlertDialogSizeDto = 'sm' | 'default';
|
|
2037
|
+
/**
|
|
2038
|
+
* Blocking confirmation dialog for destructive or irreversible actions. Unlike `<yuw-dialog>` it
|
|
2039
|
+
* cannot be dismissed by clicking the backdrop, so the user must pick one of the two actions.
|
|
2040
|
+
*
|
|
2041
|
+
* Inputs / Models:
|
|
2042
|
+
* - `open`: Two-way open/closed state. Drive via `[(open)]` to control it programmatically.
|
|
2043
|
+
* - `showTrigger`: Whether to render the trigger button. Set `false` when opening only via `[(open)]`.
|
|
2044
|
+
* - `title`: Header title text. User-facing text the consuming app is responsible for translating.
|
|
2045
|
+
* - `description`: Header description text. User-facing text the consuming app is responsible for translating.
|
|
2046
|
+
* - `confirmLabel`: Label of the confirm action. User-facing text the consuming app is responsible for translating.
|
|
2047
|
+
* - `cancelLabel`: Label of the cancel action. User-facing text the consuming app is responsible for translating.
|
|
2048
|
+
* - `confirmVariant`: Button style variant for the confirm action. Use `'destructive'` for deletions.
|
|
2049
|
+
* - `size`: Content width (`'sm'`, `'default'`). Default is `'default'`.
|
|
2050
|
+
* - `triggerVariant`: Button style variant for the trigger button.
|
|
2051
|
+
* - `triggerSize`: Button size for the trigger button.
|
|
2052
|
+
*
|
|
2053
|
+
* Outputs:
|
|
2054
|
+
* - `confirmed`: Emitted when the confirm action is activated.
|
|
2055
|
+
* - `cancelled`: Emitted only when the cancel button is activated — programmatic closes (setting
|
|
2056
|
+
* `open` to `false`) do not emit it.
|
|
2057
|
+
*
|
|
2058
|
+
* Content slots:
|
|
2059
|
+
* - `[yuwAlertDialogTrigger]`: Trigger button content.
|
|
2060
|
+
* - `[yuwAlertDialogMedia]`: Leading media/icon shown above or beside the title.
|
|
2061
|
+
*
|
|
2062
|
+
* Usage:
|
|
2063
|
+
* ```html
|
|
2064
|
+
* <yuw-alert-dialog
|
|
2065
|
+
* [(open)]="isOpen"
|
|
2066
|
+
* title="¿Eliminar factura?"
|
|
2067
|
+
* description="Esta acción no se puede deshacer."
|
|
2068
|
+
* confirmLabel="Eliminar"
|
|
2069
|
+
* cancelLabel="Cancelar"
|
|
2070
|
+
* confirmVariant="destructive"
|
|
2071
|
+
* (confirmed)="delete()" />
|
|
2072
|
+
* ```
|
|
2073
|
+
*/
|
|
2074
|
+
declare class YuwAlertDialogComponent {
|
|
2075
|
+
readonly open: _angular_core.ModelSignal<boolean>;
|
|
2076
|
+
readonly showTrigger: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
2077
|
+
readonly title: _angular_core.InputSignal<string>;
|
|
2078
|
+
readonly description: _angular_core.InputSignal<string | undefined>;
|
|
2079
|
+
readonly confirmLabel: _angular_core.InputSignal<string>;
|
|
2080
|
+
readonly cancelLabel: _angular_core.InputSignal<string>;
|
|
2081
|
+
readonly confirmVariant: _angular_core.InputSignal<"secondary" | "destructive" | "default" | "outline" | "ghost" | "link" | null | undefined>;
|
|
2082
|
+
readonly size: _angular_core.InputSignal<YuwAlertDialogSizeDto>;
|
|
2083
|
+
readonly triggerVariant: _angular_core.InputSignal<"secondary" | "destructive" | "default" | "outline" | "ghost" | "link" | null | undefined>;
|
|
2084
|
+
readonly triggerSize: _angular_core.InputSignal<"default" | "xs" | "sm" | "lg" | "icon" | "icon-xs" | "icon-sm" | "icon-lg" | null | undefined>;
|
|
2085
|
+
readonly confirmed: _angular_core.OutputEmitterRef<void>;
|
|
2086
|
+
readonly cancelled: _angular_core.OutputEmitterRef<void>;
|
|
2087
|
+
protected readonly hasMedia: _angular_core.Signal<YuwAlertDialogMediaDirective | undefined>;
|
|
2088
|
+
protected readonly _dialogState: _angular_core.Signal<"open" | "closed">;
|
|
2089
|
+
protected onStateChanged(state: 'open' | 'closed'): void;
|
|
2090
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwAlertDialogComponent, never>;
|
|
2091
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<YuwAlertDialogComponent, "yuw-alert-dialog", never, { "open": { "alias": "open"; "required": false; "isSignal": true; }; "showTrigger": { "alias": "showTrigger"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": true; "isSignal": true; }; "description": { "alias": "description"; "required": false; "isSignal": true; }; "confirmLabel": { "alias": "confirmLabel"; "required": true; "isSignal": true; }; "cancelLabel": { "alias": "cancelLabel"; "required": true; "isSignal": true; }; "confirmVariant": { "alias": "confirmVariant"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "triggerVariant": { "alias": "triggerVariant"; "required": false; "isSignal": true; }; "triggerSize": { "alias": "triggerSize"; "required": false; "isSignal": true; }; }, { "open": "openChange"; "confirmed": "confirmed"; "cancelled": "cancelled"; }, ["hasMedia"], ["[yuwAlertDialogTrigger]", "[yuwAlertDialogMedia]", "*"], true, never>;
|
|
2092
|
+
}
|
|
2093
|
+
|
|
2094
|
+
/** A single tab in `<yuw-tabs>`, pairing the trigger label with the id used to match its content. */
|
|
2095
|
+
interface YuwTabItemDto {
|
|
2096
|
+
id: string;
|
|
2097
|
+
label: string;
|
|
2098
|
+
disabled?: boolean;
|
|
2099
|
+
}
|
|
2100
|
+
|
|
2101
|
+
/**
|
|
2102
|
+
* Declares the content of a single `<yuw-tabs>` panel. Apply it to an `<ng-template>` and pass the
|
|
2103
|
+
* id of the tab it belongs to, matching an entry in the `tabs` input.
|
|
2104
|
+
*
|
|
2105
|
+
* Usage:
|
|
2106
|
+
* ```html
|
|
2107
|
+
* <ng-template yuwTabPanel="billing">Contenido de facturación</ng-template>
|
|
2108
|
+
* ```
|
|
2109
|
+
*/
|
|
2110
|
+
declare class YuwTabPanelDirective {
|
|
2111
|
+
readonly tabId: _angular_core.InputSignal<string>;
|
|
2112
|
+
readonly templateRef: TemplateRef<unknown>;
|
|
2113
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwTabPanelDirective, never>;
|
|
2114
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwTabPanelDirective, "ng-template[yuwTabPanel]", never, { "tabId": { "alias": "yuwTabPanel"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
2115
|
+
}
|
|
2116
|
+
|
|
2117
|
+
type YuwTabsVariantDto = 'default' | 'line';
|
|
2118
|
+
type YuwTabsOrientationDto = 'horizontal' | 'vertical';
|
|
2119
|
+
type YuwTabsActivationModeDto = 'automatic' | 'manual';
|
|
2120
|
+
/**
|
|
2121
|
+
* Tabbed navigation between sibling panels.
|
|
2122
|
+
*
|
|
2123
|
+
* Triggers come from the `tabs` input; each panel's content is declared by the consumer as an
|
|
2124
|
+
* `<ng-template yuwTabPanel="<id>">` whose id matches a tab. Panels are lazy: a panel's content
|
|
2125
|
+
* is only instantiated the first time its tab becomes active (and stays alive, hidden, after
|
|
2126
|
+
* switching away).
|
|
2127
|
+
*
|
|
2128
|
+
* Inputs / Models:
|
|
2129
|
+
* - `tabs`: The tab definitions (`YuwTabItemDto[]`) rendered as triggers, in order.
|
|
2130
|
+
* - `activeTab`: Two-way id of the selected tab. Drive via `[(activeTab)]` to control it
|
|
2131
|
+
* programmatically; listen to `activeTabChange` to react to activations.
|
|
2132
|
+
* - `variant`: Trigger list style (`'default'` filled, `'line'` underlined). Default is `'default'`.
|
|
2133
|
+
* - `orientation`: Layout direction (`'horizontal'`, `'vertical'`). Default is `'horizontal'`.
|
|
2134
|
+
* - `activationMode`: How keyboard focus activates tabs (`'automatic'` activates on focus,
|
|
2135
|
+
* `'manual'` requires Enter/Space). Default is `'automatic'`.
|
|
2136
|
+
*
|
|
2137
|
+
* Usage:
|
|
2138
|
+
* ```html
|
|
2139
|
+
* <yuw-tabs [tabs]="tabs" [(activeTab)]="selected">
|
|
2140
|
+
* <ng-template yuwTabPanel="general">Contenido general</ng-template>
|
|
2141
|
+
* <ng-template yuwTabPanel="billing">Contenido de facturación</ng-template>
|
|
2142
|
+
* </yuw-tabs>
|
|
2143
|
+
* ```
|
|
2144
|
+
*/
|
|
2145
|
+
declare class YuwTabsComponent {
|
|
2146
|
+
readonly tabs: _angular_core.InputSignal<YuwTabItemDto[]>;
|
|
2147
|
+
readonly activeTab: _angular_core.ModelSignal<string>;
|
|
2148
|
+
readonly variant: _angular_core.InputSignal<YuwTabsVariantDto>;
|
|
2149
|
+
readonly orientation: _angular_core.InputSignal<YuwTabsOrientationDto>;
|
|
2150
|
+
readonly activationMode: _angular_core.InputSignal<YuwTabsActivationModeDto>;
|
|
2151
|
+
protected readonly panels: _angular_core.Signal<readonly YuwTabPanelDirective[]>;
|
|
2152
|
+
protected onTabActivated(tabId: string): void;
|
|
2153
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwTabsComponent, never>;
|
|
2154
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<YuwTabsComponent, "yuw-tabs", never, { "tabs": { "alias": "tabs"; "required": true; "isSignal": true; }; "activeTab": { "alias": "activeTab"; "required": true; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; "activationMode": { "alias": "activationMode"; "required": false; "isSignal": true; }; }, { "activeTab": "activeTabChange"; }, ["panels"], never, true, never>;
|
|
2155
|
+
}
|
|
2156
|
+
|
|
2157
|
+
/**
|
|
2158
|
+
* Container directive for a single file attachment card.
|
|
2159
|
+
*
|
|
2160
|
+
* Accepts `state` (`'idle'`, `'uploading'`, `'processing'`, `'error'`, `'done'`), `size`
|
|
2161
|
+
* (`'default'`, `'sm'`, `'xs'`) and `orientation` (`'horizontal'`, `'vertical'`), which drive the
|
|
2162
|
+
* styling of every nested slot.
|
|
2163
|
+
*
|
|
2164
|
+
* Usage:
|
|
2165
|
+
* ```html
|
|
2166
|
+
* <div yuwAttachment state="uploading">
|
|
2167
|
+
* <div yuwAttachmentMedia><ng-icon name="lucideFileText" /></div>
|
|
2168
|
+
* <div yuwAttachmentContent>
|
|
2169
|
+
* <span yuwAttachmentTitle>informe.pdf</span>
|
|
2170
|
+
* <span yuwAttachmentDescription>2,4 MB</span>
|
|
2171
|
+
* </div>
|
|
2172
|
+
* <div yuwAttachmentActions>
|
|
2173
|
+
* <button yuwAttachmentAction><ng-icon name="lucideX" /></button>
|
|
2174
|
+
* </div>
|
|
2175
|
+
* </div>
|
|
2176
|
+
* ```
|
|
2177
|
+
*/
|
|
2178
|
+
declare class YuwAttachmentDirective {
|
|
2179
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwAttachmentDirective, never>;
|
|
2180
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwAttachmentDirective, "[yuwAttachment], yuw-attachment", never, {}, {}, never, never, true, [{ directive: typeof i1$8.HlmAttachment; inputs: { "state": "state"; "size": "size"; "orientation": "orientation"; }; outputs: {}; }]>;
|
|
2181
|
+
}
|
|
2182
|
+
/** Scrollable, snapping row that lays out several attachment cards. */
|
|
2183
|
+
declare class YuwAttachmentGroupDirective {
|
|
2184
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwAttachmentGroupDirective, never>;
|
|
2185
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwAttachmentGroupDirective, "[yuwAttachmentGroup], yuw-attachment-group", never, {}, {}, never, never, true, [{ directive: typeof i1$8.HlmAttachmentGroup; inputs: {}; outputs: {}; }]>;
|
|
2186
|
+
}
|
|
2187
|
+
/** Leading media slot of an attachment, for a file-type icon or an image preview. Supports `variant` (`'icon'`, `'image'`). */
|
|
2188
|
+
declare class YuwAttachmentMediaDirective {
|
|
2189
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwAttachmentMediaDirective, never>;
|
|
2190
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwAttachmentMediaDirective, "[yuwAttachmentMedia], yuw-attachment-media", never, {}, {}, never, never, true, [{ directive: typeof i1$8.HlmAttachmentMedia; inputs: { "variant": "variant"; }; outputs: {}; }]>;
|
|
2191
|
+
}
|
|
2192
|
+
/** Text content container of an attachment, holding its title and description. */
|
|
2193
|
+
declare class YuwAttachmentContentDirective {
|
|
2194
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwAttachmentContentDirective, never>;
|
|
2195
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwAttachmentContentDirective, "[yuwAttachmentContent], yuw-attachment-content", never, {}, {}, never, never, true, [{ directive: typeof i1$8.HlmAttachmentContent; inputs: {}; outputs: {}; }]>;
|
|
2196
|
+
}
|
|
2197
|
+
/** File name of an attachment. Truncates and shimmers while the attachment is uploading or processing. */
|
|
2198
|
+
declare class YuwAttachmentTitleDirective {
|
|
2199
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwAttachmentTitleDirective, never>;
|
|
2200
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwAttachmentTitleDirective, "[yuwAttachmentTitle], yuw-attachment-title", never, {}, {}, never, never, true, [{ directive: typeof i1$8.HlmAttachmentTitle; inputs: {}; outputs: {}; }]>;
|
|
2201
|
+
}
|
|
2202
|
+
/** Secondary line of an attachment, for file size, progress, or an error message. */
|
|
2203
|
+
declare class YuwAttachmentDescriptionDirective {
|
|
2204
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwAttachmentDescriptionDirective, never>;
|
|
2205
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwAttachmentDescriptionDirective, "[yuwAttachmentDescription], yuw-attachment-description", never, {}, {}, never, never, true, [{ directive: typeof i1$8.HlmAttachmentDescription; inputs: {}; outputs: {}; }]>;
|
|
2206
|
+
}
|
|
2207
|
+
/** Trailing container for an attachment's action buttons. */
|
|
2208
|
+
declare class YuwAttachmentActionsDirective {
|
|
2209
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwAttachmentActionsDirective, never>;
|
|
2210
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwAttachmentActionsDirective, "[yuwAttachmentActions], yuw-attachment-actions", never, {}, {}, never, never, true, [{ directive: typeof i1$8.HlmAttachmentActions; inputs: {}; outputs: {}; }]>;
|
|
2211
|
+
}
|
|
2212
|
+
/**
|
|
2213
|
+
* Icon-sized action button inside an attachment, such as remove or retry.
|
|
2214
|
+
*
|
|
2215
|
+
* Besides `type`, accepts the button `variant` and `size` (defaults `'ghost'` / `'icon-xs'`).
|
|
2216
|
+
* Extends `HlmAttachmentAction` (instead of composing it via `hostDirectives`) because
|
|
2217
|
+
* `variant`/`size` are inputs the helm only exposes from its own `HlmButton` host directive, and
|
|
2218
|
+
* host-directive forwarding is not transitive (NG2017) — inheritance carries the whole surface
|
|
2219
|
+
* over as real `HlmButton` inputs, so the cva variants resolve natively instead of being layered
|
|
2220
|
+
* on top of the defaults. Angular does not inherit `providers`, so the helm's
|
|
2221
|
+
* `provideBrnButtonConfig` defaults are mirrored here; keep them in sync with
|
|
2222
|
+
* `helm/attachment/src/lib/hlm-attachment-action.ts` if the helm is regenerated.
|
|
2223
|
+
*/
|
|
2224
|
+
declare class YuwAttachmentActionDirective extends HlmAttachmentAction {
|
|
2225
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwAttachmentActionDirective, never>;
|
|
2226
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwAttachmentActionDirective, "button[yuwAttachmentAction]", never, {}, {}, never, never, true, never>;
|
|
2227
|
+
}
|
|
2228
|
+
/** Turns the whole attachment card into a single clickable target, layered under its actions. */
|
|
2229
|
+
declare class YuwAttachmentTriggerDirective {
|
|
2230
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwAttachmentTriggerDirective, never>;
|
|
2231
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwAttachmentTriggerDirective, "button[yuwAttachmentTrigger], a[yuwAttachmentTrigger]", never, {}, {}, never, never, true, [{ directive: typeof i1$8.HlmAttachmentTrigger; inputs: { "type": "type"; }; outputs: {}; }]>;
|
|
2232
|
+
}
|
|
2233
|
+
|
|
2234
|
+
type YuwSidebarSideDto = 'left' | 'right';
|
|
2235
|
+
type YuwSidebarVariantDto = 'sidebar' | 'floating' | 'inset';
|
|
2236
|
+
type YuwSidebarCollapsibleDto = 'offcanvas' | 'icon' | 'none';
|
|
2237
|
+
/**
|
|
2238
|
+
* Collapsible navigation sidebar. Renders as a fixed panel on desktop and as a slide-in sheet on
|
|
2239
|
+
* mobile, and reads its colors from the `--sidebar-*` theme tokens.
|
|
2240
|
+
*
|
|
2241
|
+
* Place it inside a `[yuwSidebarWrapper]` alongside a `<main yuwSidebarInset>`, and compose its
|
|
2242
|
+
* inner structure with the `yuwSidebar*` directives. Open state is shared through
|
|
2243
|
+
* `YuwSidebarService`, so `<yuw-sidebar-trigger>` works from anywhere in the page.
|
|
2244
|
+
*
|
|
2245
|
+
* Inputs:
|
|
2246
|
+
* - `side`: Edge the sidebar is docked to (`'left'`, `'right'`). Default is `'left'`.
|
|
2247
|
+
* - `variant`: Panel treatment (`'sidebar'` flush, `'floating'` card, `'inset'` inset page). Default is `'sidebar'`.
|
|
2248
|
+
* - `collapsible`: Collapse behaviour (`'offcanvas'` slides away, `'icon'` shrinks to icons, `'none'` always open). Default is `'offcanvas'`.
|
|
2249
|
+
* - `sidebarWidthMobile`: Width of the mobile slide-in sheet (any CSS length). Defaults to the helm sidebar config (`18rem`).
|
|
2250
|
+
* - `sidebarContainerClass`: Extra classes merged onto the desktop fixed container (the helm merges them last, so they win).
|
|
2251
|
+
*
|
|
2252
|
+
* Deliberately not exposed from the helm sidebar (add a wrapper only when a real consumer needs
|
|
2253
|
+
* them): `HlmSidebarMenuAction`, `HlmSidebarMenuSkeleton`, `HlmSidebarInput` and
|
|
2254
|
+
* `HlmSidebarGroupAction`.
|
|
2255
|
+
*
|
|
2256
|
+
* Usage:
|
|
2257
|
+
* ```html
|
|
2258
|
+
* <yuw-sidebar collapsible="icon">
|
|
2259
|
+
* <div yuwSidebarHeader>Yurest</div>
|
|
2260
|
+
* <div yuwSidebarContent>
|
|
2261
|
+
* <ul yuwSidebarMenu>
|
|
2262
|
+
* <li yuwSidebarMenuItem><a yuwSidebarMenuButton isActive tooltip="Pedidos">Pedidos</a></li>
|
|
2263
|
+
* </ul>
|
|
2264
|
+
* </div>
|
|
2265
|
+
* </yuw-sidebar>
|
|
2266
|
+
* ```
|
|
2267
|
+
*/
|
|
2268
|
+
declare class YuwSidebarComponent {
|
|
2269
|
+
private readonly config;
|
|
2270
|
+
readonly side: _angular_core.InputSignal<YuwSidebarSideDto>;
|
|
2271
|
+
readonly variant: _angular_core.InputSignal<YuwSidebarVariantDto>;
|
|
2272
|
+
readonly collapsible: _angular_core.InputSignal<YuwSidebarCollapsibleDto>;
|
|
2273
|
+
readonly sidebarWidthMobile: _angular_core.InputSignal<string>;
|
|
2274
|
+
readonly sidebarContainerClass: _angular_core.InputSignal<string>;
|
|
2275
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwSidebarComponent, never>;
|
|
2276
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<YuwSidebarComponent, "yuw-sidebar", never, { "side": { "alias": "side"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "collapsible": { "alias": "collapsible"; "required": false; "isSignal": true; }; "sidebarWidthMobile": { "alias": "sidebarWidthMobile"; "required": false; "isSignal": true; }; "sidebarContainerClass": { "alias": "sidebarContainerClass"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
|
|
2277
|
+
}
|
|
2278
|
+
|
|
2279
|
+
/**
|
|
2280
|
+
* Icon button that toggles the sidebar open or collapsed. Works anywhere on the page, including
|
|
2281
|
+
* inside `<main yuwSidebarInset>`, since the open state lives in `YuwSidebarService`.
|
|
2282
|
+
*
|
|
2283
|
+
* Inputs:
|
|
2284
|
+
* - `label`: Screen-reader-only label for the button. User-facing text the consuming app is
|
|
2285
|
+
* responsible for translating.
|
|
2286
|
+
*
|
|
2287
|
+
* Usage:
|
|
2288
|
+
* ```html
|
|
2289
|
+
* <yuw-sidebar-trigger label="Alternar menú" />
|
|
2290
|
+
* ```
|
|
2291
|
+
*/
|
|
2292
|
+
declare class YuwSidebarTriggerComponent {
|
|
2293
|
+
readonly label: _angular_core.InputSignal<string>;
|
|
2294
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwSidebarTriggerComponent, never>;
|
|
2295
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<YuwSidebarTriggerComponent, "yuw-sidebar-trigger", never, { "label": { "alias": "label"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
2296
|
+
}
|
|
2297
|
+
|
|
2298
|
+
/**
|
|
2299
|
+
* Outermost layout directive for a sidebar page. Wraps the sidebar and the main content, and owns
|
|
2300
|
+
* the `--sidebar-width` / `--sidebar-width-icon` custom properties via its `sidebarWidth` and
|
|
2301
|
+
* `sidebarWidthIcon` inputs.
|
|
2302
|
+
*
|
|
2303
|
+
* Usage:
|
|
2304
|
+
* ```html
|
|
2305
|
+
* <div yuwSidebarWrapper>
|
|
2306
|
+
* <yuw-sidebar collapsible="icon">
|
|
2307
|
+
* <div yuwSidebarHeader>Yurest</div>
|
|
2308
|
+
* <div yuwSidebarContent>
|
|
2309
|
+
* <div yuwSidebarGroup>
|
|
2310
|
+
* <div yuwSidebarGroupLabel>Gestión</div>
|
|
2311
|
+
* <div yuwSidebarGroupContent>
|
|
2312
|
+
* <ul yuwSidebarMenu>
|
|
2313
|
+
* <li yuwSidebarMenuItem>
|
|
2314
|
+
* <a yuwSidebarMenuButton isActive tooltip="Pedidos">Pedidos</a>
|
|
2315
|
+
* </li>
|
|
2316
|
+
* </ul>
|
|
2317
|
+
* </div>
|
|
2318
|
+
* </div>
|
|
2319
|
+
* </div>
|
|
2320
|
+
* </yuw-sidebar>
|
|
2321
|
+
*
|
|
2322
|
+
* <main yuwSidebarInset>
|
|
2323
|
+
* <button yuw-sidebar-trigger></button>
|
|
2324
|
+
* </main>
|
|
2325
|
+
* </div>
|
|
2326
|
+
* ```
|
|
2327
|
+
*/
|
|
2328
|
+
declare class YuwSidebarWrapperDirective {
|
|
2329
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwSidebarWrapperDirective, never>;
|
|
2330
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwSidebarWrapperDirective, "[yuwSidebarWrapper], yuw-sidebar-wrapper", never, {}, {}, never, never, true, [{ directive: typeof i1$9.HlmSidebarWrapper; inputs: { "sidebarWidth": "sidebarWidth"; "sidebarWidthIcon": "sidebarWidthIcon"; }; outputs: {}; }]>;
|
|
2331
|
+
}
|
|
2332
|
+
/** Top area of the sidebar, above the scrollable content. */
|
|
2333
|
+
declare class YuwSidebarHeaderDirective {
|
|
2334
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwSidebarHeaderDirective, never>;
|
|
2335
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwSidebarHeaderDirective, "[yuwSidebarHeader], yuw-sidebar-header", never, {}, {}, never, never, true, [{ directive: typeof i1$9.HlmSidebarHeader; inputs: {}; outputs: {}; }]>;
|
|
2336
|
+
}
|
|
2337
|
+
/** Scrollable middle area of the sidebar that holds the navigation groups. */
|
|
2338
|
+
declare class YuwSidebarContentDirective {
|
|
2339
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwSidebarContentDirective, never>;
|
|
2340
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwSidebarContentDirective, "[yuwSidebarContent], yuw-sidebar-content", never, {}, {}, never, never, true, [{ directive: typeof i1$9.HlmSidebarContent; inputs: {}; outputs: {}; }]>;
|
|
2341
|
+
}
|
|
2342
|
+
/** Bottom area of the sidebar, below the scrollable content. */
|
|
2343
|
+
declare class YuwSidebarFooterDirective {
|
|
2344
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwSidebarFooterDirective, never>;
|
|
2345
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwSidebarFooterDirective, "[yuwSidebarFooter], yuw-sidebar-footer", never, {}, {}, never, never, true, [{ directive: typeof i1$9.HlmSidebarFooter; inputs: {}; outputs: {}; }]>;
|
|
2346
|
+
}
|
|
2347
|
+
/** A titled section of the sidebar. */
|
|
2348
|
+
declare class YuwSidebarGroupDirective {
|
|
2349
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwSidebarGroupDirective, never>;
|
|
2350
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwSidebarGroupDirective, "[yuwSidebarGroup], yuw-sidebar-group", never, {}, {}, never, never, true, [{ directive: typeof i1$9.HlmSidebarGroup; inputs: {}; outputs: {}; }]>;
|
|
2351
|
+
}
|
|
2352
|
+
/** Heading of a sidebar group. Fades out when the sidebar collapses to icons. */
|
|
2353
|
+
declare class YuwSidebarGroupLabelDirective {
|
|
2354
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwSidebarGroupLabelDirective, never>;
|
|
2355
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwSidebarGroupLabelDirective, "div[yuwSidebarGroupLabel], button[yuwSidebarGroupLabel]", never, {}, {}, never, never, true, [{ directive: typeof i1$9.HlmSidebarGroupLabel; inputs: {}; outputs: {}; }]>;
|
|
2356
|
+
}
|
|
2357
|
+
/** Body of a sidebar group, wrapping its menu. */
|
|
2358
|
+
declare class YuwSidebarGroupContentDirective {
|
|
2359
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwSidebarGroupContentDirective, never>;
|
|
2360
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwSidebarGroupContentDirective, "div[yuwSidebarGroupContent]", never, {}, {}, never, never, true, [{ directive: typeof i1$9.HlmSidebarGroupContent; inputs: {}; outputs: {}; }]>;
|
|
2361
|
+
}
|
|
2362
|
+
/** Navigation list of a sidebar group. Apply to a `<ul>`. */
|
|
2363
|
+
declare class YuwSidebarMenuDirective {
|
|
2364
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwSidebarMenuDirective, never>;
|
|
2365
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwSidebarMenuDirective, "ul[yuwSidebarMenu]", never, {}, {}, never, never, true, [{ directive: typeof i1$9.HlmSidebarMenu; inputs: {}; outputs: {}; }]>;
|
|
2366
|
+
}
|
|
2367
|
+
/** A single entry of a sidebar menu. Apply to an `<li>`. */
|
|
2368
|
+
declare class YuwSidebarMenuItemDirective {
|
|
2369
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwSidebarMenuItemDirective, never>;
|
|
2370
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwSidebarMenuItemDirective, "li[yuwSidebarMenuItem]", never, {}, {}, never, never, true, [{ directive: typeof i1$9.HlmSidebarMenuItem; inputs: {}; outputs: {}; }]>;
|
|
2371
|
+
}
|
|
2372
|
+
/**
|
|
2373
|
+
* Interactive control of a sidebar menu item. Accepts `variant` (`'default'`, `'outline'`), `size`
|
|
2374
|
+
* (`'default'`, `'sm'`, `'lg'`) and `isActive`.
|
|
2375
|
+
*
|
|
2376
|
+
* To label the item while the sidebar is collapsed to icons, add Spartan's `tooltip` input
|
|
2377
|
+
* alongside this directive — it comes from the underlying menu-button primitive and is only shown
|
|
2378
|
+
* in the collapsed state.
|
|
2379
|
+
*/
|
|
2380
|
+
declare class YuwSidebarMenuButtonDirective {
|
|
2381
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwSidebarMenuButtonDirective, never>;
|
|
2382
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwSidebarMenuButtonDirective, "button[yuwSidebarMenuButton], a[yuwSidebarMenuButton]", never, {}, {}, never, never, true, [{ directive: typeof i1$9.HlmSidebarMenuButton; inputs: { "variant": "variant"; "size": "size"; "isActive": "isActive"; "closeMobileSidebarOnClick": "closeMobileSidebarOnClick"; }; outputs: {}; }]>;
|
|
2383
|
+
}
|
|
2384
|
+
/** Trailing count or status badge of a sidebar menu item. */
|
|
2385
|
+
declare class YuwSidebarMenuBadgeDirective {
|
|
2386
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwSidebarMenuBadgeDirective, never>;
|
|
2387
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwSidebarMenuBadgeDirective, "[yuwSidebarMenuBadge], yuw-sidebar-menu-badge", never, {}, {}, never, never, true, [{ directive: typeof i1$9.HlmSidebarMenuBadge; inputs: {}; outputs: {}; }]>;
|
|
2388
|
+
}
|
|
2389
|
+
/** Nested submenu list of a sidebar menu item. Apply to a `<ul>`. */
|
|
2390
|
+
declare class YuwSidebarMenuSubDirective {
|
|
2391
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwSidebarMenuSubDirective, never>;
|
|
2392
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwSidebarMenuSubDirective, "ul[yuwSidebarMenuSub]", never, {}, {}, never, never, true, [{ directive: typeof i1$9.HlmSidebarMenuSub; inputs: {}; outputs: {}; }]>;
|
|
2393
|
+
}
|
|
2394
|
+
/** A single entry of a sidebar submenu. Apply to an `<li>`. */
|
|
2395
|
+
declare class YuwSidebarMenuSubItemDirective {
|
|
2396
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwSidebarMenuSubItemDirective, never>;
|
|
2397
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwSidebarMenuSubItemDirective, "li[yuwSidebarMenuSubItem]", never, {}, {}, never, never, true, [{ directive: typeof i1$9.HlmSidebarMenuSubItem; inputs: {}; outputs: {}; }]>;
|
|
2398
|
+
}
|
|
2399
|
+
/** Interactive control of a sidebar submenu item. Accepts `size` (`'sm'`, `'md'`) and `isActive`. */
|
|
2400
|
+
declare class YuwSidebarMenuSubButtonDirective {
|
|
2401
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwSidebarMenuSubButtonDirective, never>;
|
|
2402
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwSidebarMenuSubButtonDirective, "a[yuwSidebarMenuSubButton], button[yuwSidebarMenuSubButton]", never, {}, {}, never, never, true, [{ directive: typeof i1$9.HlmSidebarMenuSubButton; inputs: { "size": "size"; "isActive": "isActive"; "closeMobileSidebarOnClick": "closeMobileSidebarOnClick"; }; outputs: {}; }]>;
|
|
2403
|
+
}
|
|
2404
|
+
/** Divider between sidebar sections. */
|
|
2405
|
+
declare class YuwSidebarSeparatorDirective {
|
|
2406
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwSidebarSeparatorDirective, never>;
|
|
2407
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwSidebarSeparatorDirective, "[yuwSidebarSeparator], yuw-sidebar-separator", never, {}, {}, never, never, true, [{ directive: typeof i1$9.HlmSidebarSeparator; inputs: {}; outputs: {}; }]>;
|
|
2408
|
+
}
|
|
2409
|
+
/** Thin draggable edge that toggles the sidebar. Apply to a `<button>`. */
|
|
2410
|
+
declare class YuwSidebarRailDirective {
|
|
2411
|
+
/**
|
|
2412
|
+
* Accessible label of the rail button (it has no visible text). User-facing text — the
|
|
2413
|
+
* consuming app is responsible for providing it already translated.
|
|
2414
|
+
*/
|
|
2415
|
+
readonly label: _angular_core.InputSignal<string>;
|
|
2416
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwSidebarRailDirective, never>;
|
|
2417
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwSidebarRailDirective, "button[yuwSidebarRail]", never, { "label": { "alias": "label"; "required": true; "isSignal": true; }; }, {}, never, never, true, [{ directive: typeof i1$9.HlmSidebarRail; inputs: {}; outputs: {}; }]>;
|
|
2418
|
+
}
|
|
2419
|
+
/** Main content region beside the sidebar. Apply to a `<main>`. */
|
|
2420
|
+
declare class YuwSidebarInsetDirective {
|
|
2421
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuwSidebarInsetDirective, never>;
|
|
2422
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<YuwSidebarInsetDirective, "main[yuwSidebarInset]", never, {}, {}, never, never, true, [{ directive: typeof i1$9.HlmSidebarInset; inputs: {}; outputs: {}; }]>;
|
|
2423
|
+
}
|
|
2424
|
+
|
|
2425
|
+
export { YUW_DATATABLE_FEATURES, YUW_PASSWORD_REVEAL_STATES, YuwAccordion, YuwAccordionContentComponent, YuwAccordionImports, YuwAccordionItem, YuwAccordionTriggerComponent, YuwAlertActionDirective, YuwAlertComponent, YuwAlertDescriptionDirective, YuwAlertDialogComponent, YuwAlertDialogMediaDirective, YuwAlertImports, YuwAlertTitleDirective, YuwAttachmentActionDirective, YuwAttachmentActionsDirective, YuwAttachmentContentDirective, YuwAttachmentDescriptionDirective, YuwAttachmentDirective, YuwAttachmentGroupDirective, YuwAttachmentMediaDirective, YuwAttachmentTitleDirective, YuwAttachmentTriggerDirective, YuwAvatarComponent, YuwBadgeComponent, YuwBreadcrumbComponent, YuwButtonComponent, YuwCaptionDirective, YuwCardActionDirective, YuwCardContentDirective, YuwCardDescriptionDirective, YuwCardDirective, YuwCardFooterDirective, YuwCardHeaderDirective, YuwCardImports, YuwCardTitleDirective, YuwCheckboxComponent, YuwComboboxComponent, YuwComboboxItemDirective, YuwContextMenuCheckboxDirective, YuwContextMenuCheckboxIndicatorComponent, YuwContextMenuDirective, YuwContextMenuGroupDirective, YuwContextMenuImports, YuwContextMenuItemDirective, YuwContextMenuLabelDirective, YuwContextMenuRadioDirective, YuwContextMenuRadioIndicatorComponent, YuwContextMenuSeparatorDirective, YuwContextMenuShortcutDirective, YuwContextMenuSubDirective, YuwContextMenuSubIndicatorComponent, YuwContextMenuSubTriggerDirective, YuwContextMenuTriggerDirective, YuwDatatableComponent, YuwDatepickerComponent, YuwDialogComponent, YuwDialogFooterDirective, YuwDialogImports, YuwEmptyContentDirective, YuwEmptyDescriptionDirective, YuwEmptyDirective, YuwEmptyHeaderDirective, YuwEmptyImports, YuwEmptyMediaDirective, YuwEmptyTitleDirective, YuwInputAddonImports, YuwInputComponent, YuwInputOtpComponent, YuwItemActionsDirective, YuwItemContentDirective, YuwItemDescriptionDirective, YuwItemDirective, YuwItemFooterDirective, YuwItemGroupDirective, YuwItemHeaderDirective, YuwItemImports, YuwItemMediaDirective, YuwItemSeparatorDirective, YuwItemTitleDirective, YuwLabel, YuwLeftAddonDirective, YuwPaginationComponent, YuwPasswordInputComponent, YuwPopoverComponent, YuwRadioGroupComponent, YuwRightAddonDirective, YuwSearchInputComponent, YuwSheetComponent, YuwSheetFooterDirective, YuwSheetImports, YuwSidebarComponent, YuwSidebarContentDirective, YuwSidebarFooterDirective, YuwSidebarGroupContentDirective, YuwSidebarGroupDirective, YuwSidebarGroupLabelDirective, YuwSidebarHeaderDirective, YuwSidebarInsetDirective, YuwSidebarMenuBadgeDirective, YuwSidebarMenuButtonDirective, YuwSidebarMenuDirective, YuwSidebarMenuItemDirective, YuwSidebarMenuSubButtonDirective, YuwSidebarMenuSubDirective, YuwSidebarMenuSubItemDirective, YuwSidebarRailDirective, YuwSidebarSeparatorDirective, YuwSidebarTriggerComponent, YuwSidebarWrapperDirective, YuwSkeletonDirective, YuwSpinnerComponent, YuwSwitchComponent, YuwTBodyDirective, YuwTFootDirective, YuwTHeadDirective, YuwTabPanelDirective, YuwTableContainerDirective, YuwTableDirective, YuwTableImports, YuwTabsComponent, YuwTdDirective, YuwTextareaComponent, YuwThDirective, YuwToasterComponent, YuwTooltipDirective, YuwTrDirective, YuwValueAccessorBase, buildInputOtpGroups, cn, getPaginationRange, provideValueAccessor, totalInputOtpLength };
|
|
2426
|
+
export type { YuwAlertDialogSizeDto, YuwAlertVariantDto, YuwAvatarGroupItemDto, YuwAvatarSizeDto, YuwBreadcrumbItemDto, YuwButtonGroupClickDto, YuwButtonGroupItemDto, YuwColorDto, YuwComboboxItemContext, YuwComboboxOptionDto, YuwComboboxValue, YuwDatatableColumnDef, YuwDatatableFeatures, YuwDatepickerModeDto, YuwDatepickerValue, YuwInputModeDto, YuwInputOtpGroupDto, YuwInputOtpModeDto, YuwInputTypeDto, YuwPaginationRangeItem, YuwPaginationSizeDto, YuwPasswordRevealStateDto, YuwPopoverAlignDto, YuwRadioOptionDto, YuwSheetSideDto, YuwSidebarCollapsibleDto, YuwSidebarSideDto, YuwSidebarVariantDto, YuwSwitchSizeDto, YuwTabItemDto, YuwTabsActivationModeDto, YuwTabsOrientationDto, YuwTabsVariantDto, YuwTextFieldContract, YuwToasterPositionDto, YuwToasterThemeDto, YuwTooltipPositionDto };
|