@konce-pt/angular 0.9.1 → 0.10.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +307 -0
- package/fesm2022/konce-pt-angular.mjs +5429 -1758
- package/fesm2022/konce-pt-angular.mjs.map +1 -1
- package/package.json +11 -11
- package/src/lib/accordion/llms.txt +6 -0
- package/src/lib/alert/llms.txt +7 -0
- package/src/lib/app-shell/llms.txt +4 -3
- package/src/lib/autocomplete/llms.txt +13 -0
- package/src/lib/avatar/llms.txt +6 -3
- package/src/lib/avatar-group/llms.txt +6 -0
- package/src/lib/badge/llms.txt +11 -2
- package/src/lib/bottom-sheet/llms.txt +8 -1
- package/src/lib/breadcrumb/llms.txt +5 -0
- package/src/lib/button/llms.txt +3 -0
- package/src/lib/card/llms.txt +8 -0
- package/src/lib/carousel/llms.txt +13 -1
- package/src/lib/checkbox/llms.txt +10 -0
- package/src/lib/chip/llms.txt +6 -0
- package/src/lib/chips-input/llms.txt +12 -0
- package/src/lib/color-picker/llms.txt +14 -0
- package/src/lib/confirm/llms.txt +5 -0
- package/src/lib/context-menu/llms.txt +8 -0
- package/src/lib/data-table/llms.txt +5 -4
- package/src/lib/date-range/llms.txt +24 -2
- package/src/lib/datepicker/llms.txt +25 -5
- package/src/lib/dialog/llms.txt +18 -0
- package/src/lib/drawer/llms.txt +7 -1
- package/src/lib/empty/llms.txt +6 -0
- package/src/lib/fab/llms.txt +5 -2
- package/src/lib/file-upload/llms.txt +12 -1
- package/src/lib/form-field/llms.txt +24 -4
- package/src/lib/galleria/llms.txt +13 -1
- package/src/lib/i18n/llms.txt +2 -2
- package/src/lib/icon/llms.txt +9 -1
- package/src/lib/icon-button/llms.txt +3 -1
- package/src/lib/image/llms.txt +10 -1
- package/src/lib/input/llms.txt +6 -0
- package/src/lib/input-mask/llms.txt +11 -0
- package/src/lib/input-number/llms.txt +18 -0
- package/src/lib/input-otp/llms.txt +14 -0
- package/src/lib/knob/llms.txt +8 -0
- package/src/lib/listbox/llms.txt +16 -1
- package/src/lib/megamenu/llms.txt +21 -1
- package/src/lib/menu/llms.txt +14 -4
- package/src/lib/menubar/llms.txt +21 -0
- package/src/lib/meter-group/llms.txt +10 -0
- package/src/lib/order-list/llms.txt +11 -2
- package/src/lib/panel/llms.txt +7 -0
- package/src/lib/password/llms.txt +9 -1
- package/src/lib/pick-list/llms.txt +12 -2
- package/src/lib/popover/llms.txt +11 -0
- package/src/lib/radio-group/llms.txt +11 -0
- package/src/lib/rating/llms.txt +18 -4
- package/src/lib/rich-text/llms.txt +18 -0
- package/src/lib/scroll-top/llms.txt +12 -0
- package/src/lib/select/llms.txt +23 -5
- package/src/lib/sidenav/llms.txt +6 -0
- package/src/lib/skeleton/llms.txt +2 -1
- package/src/lib/slider/llms.txt +13 -0
- package/src/lib/speed-dial/llms.txt +8 -0
- package/src/lib/spinner/llms.txt +10 -1
- package/src/lib/split-button/llms.txt +11 -2
- package/src/lib/splitter/llms.txt +10 -1
- package/src/lib/stepper/llms.txt +8 -0
- package/src/lib/switch/llms.txt +11 -0
- package/src/lib/switch-group/llms.txt +11 -0
- package/src/lib/tabs/llms.txt +7 -0
- package/src/lib/textarea/llms.txt +12 -0
- package/src/lib/toast/llms.txt +19 -1
- package/src/lib/tooltip/llms.txt +12 -0
- package/src/lib/tree/llms.txt +21 -0
- package/types/konce-pt-angular.d.ts +1047 -73
- package/types/konce-pt-angular.d.ts.map +1 -1
|
@@ -7,6 +7,7 @@ import { KptLocale, KptMessages, DeepPartial, KptI18nConfig } from '@konce-pt/i1
|
|
|
7
7
|
export { DeepPartial, KPT_MESSAGES_EN, KPT_MESSAGES_PL, KptI18nConfig, KptLocale, KptMessages } from '@konce-pt/i18n';
|
|
8
8
|
import { KptIconInput, KptIconName } from '@konce-pt/icons';
|
|
9
9
|
export { KptIconDef, KptIconInput, KptIconName, renderKptIconSvg } from '@konce-pt/icons';
|
|
10
|
+
import * as _konce_pt_angular from '@konce-pt/angular';
|
|
10
11
|
import { KptDateSelectionMode, KptCalendarView, KptDayCell, KptGridCell, KptClockMark, KptDateRangeValue, KptDateRangeMode, KptMonthPanel, KptRangeDayCell } from '@konce-pt/datetime';
|
|
11
12
|
export { KptDateRangeValue } from '@konce-pt/datetime';
|
|
12
13
|
import { KptMentionItem, KptMentionSegment } from '@konce-pt/mention';
|
|
@@ -15,7 +16,6 @@ import { KptBackdropEffect, KptBackdropAnchor, KptBackdropInk } from '@konce-pt/
|
|
|
15
16
|
export { KPT_SIGNAL_GRID_CELL, KPT_SIGNAL_GRID_DENSITY, KPT_SIGNAL_GRID_FALLOFF, KPT_SIGNAL_GRID_GAP, KPT_WAVE_AMPLITUDE, KPT_WAVE_BAND, KPT_WAVE_RESOLUTION, KPT_WAVE_ROTATION, KptBackdropAnchor, KptBackdropEffect, KptBackdropRenderOptions, KptBackdropRenderer, KptOklab, KptRgb, KptSignalGridCell, KptSignalGridFrame, KptSignalGridOptions, KptWaveOptions, KptWaveSettings, buildSignalGrid, createBackdropRenderer, mixOklch, readCssColor, resolveWave, shiftHue, signalGridAlpha, signalGridDensity, waveIntensity, waveRamp } from '@konce-pt/backdrop';
|
|
16
17
|
import { KptColumnFilter, KptColumnSummary } from '@konce-pt/table';
|
|
17
18
|
export { KptColumnFilter, KptColumnFilterType, KptColumnSummary, KptSummaryFn } from '@konce-pt/table';
|
|
18
|
-
import * as _konce_pt_angular from '@konce-pt/angular';
|
|
19
19
|
|
|
20
20
|
type KptButtonVariant = 'filled' | 'elevated' | 'tonal' | 'outline' | 'text' | 'link' | 'danger' | 'success' | 'warning' | 'info';
|
|
21
21
|
type KptButtonSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
|
|
@@ -47,6 +47,12 @@ declare class KptButton {
|
|
|
47
47
|
/** Klasa dokładana do ikony wiodącej; obok stałego haka `.kpt-button__icon`. */
|
|
48
48
|
readonly iconClass: _angular_core.InputSignal<string | undefined>;
|
|
49
49
|
readonly iconEndClass: _angular_core.InputSignal<string | undefined>;
|
|
50
|
+
/**
|
|
51
|
+
* Dostępna nazwa, gdy przycisk nie ma tekstu (sama ikona). Trafia na wewnętrzny `<button>`/`<a>`
|
|
52
|
+
* — `[attr.aria-label]` na `<kpt-button>` wylądowałoby na hoście bez roli przycisku i czytnik
|
|
53
|
+
* ogłosiłby przycisk bez nazwy. `null` (domyślnie) nie wypisuje atrybutu.
|
|
54
|
+
*/
|
|
55
|
+
readonly ariaLabel: _angular_core.InputSignal<string | null>;
|
|
50
56
|
/** Podany adres zamienia `<button>` na `<a>`. */
|
|
51
57
|
readonly href: _angular_core.InputSignal<string | undefined>;
|
|
52
58
|
readonly target: _angular_core.InputSignal<string | undefined>;
|
|
@@ -60,7 +66,7 @@ declare class KptButton {
|
|
|
60
66
|
protected readonly effectiveRel: _angular_core.Signal<string | null>;
|
|
61
67
|
private iconClasses;
|
|
62
68
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptButton, never>;
|
|
63
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptButton, "kpt-button", never, { "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "fullWidth": { "alias": "fullWidth"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "iconEnd": { "alias": "iconEnd"; "required": false; "isSignal": true; }; "iconClass": { "alias": "iconClass"; "required": false; "isSignal": true; }; "iconEndClass": { "alias": "iconEndClass"; "required": false; "isSignal": true; }; "href": { "alias": "href"; "required": false; "isSignal": true; }; "target": { "alias": "target"; "required": false; "isSignal": true; }; "rel": { "alias": "rel"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
|
|
69
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptButton, "kpt-button", never, { "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "fullWidth": { "alias": "fullWidth"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "iconEnd": { "alias": "iconEnd"; "required": false; "isSignal": true; }; "iconClass": { "alias": "iconClass"; "required": false; "isSignal": true; }; "iconEndClass": { "alias": "iconEndClass"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "href": { "alias": "href"; "required": false; "isSignal": true; }; "target": { "alias": "target"; "required": false; "isSignal": true; }; "rel": { "alias": "rel"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
|
|
64
70
|
}
|
|
65
71
|
|
|
66
72
|
/**
|
|
@@ -147,8 +153,16 @@ declare class KptFab {
|
|
|
147
153
|
readonly type: _angular_core.InputSignal<"button" | "submit" | "reset">;
|
|
148
154
|
/** Wymagane dla wariantu okrągłego (bez tekstu). */
|
|
149
155
|
readonly ariaLabel: _angular_core.InputSignal<string>;
|
|
156
|
+
/**
|
|
157
|
+
* Stan rozwinięcia, gdy FAB otwiera panel (np. `kpt-speed-dial`). Musi zjechać na wewnętrzny
|
|
158
|
+
* `<button>` — host nie ma roli przycisku, więc atrybut postawiony na nim nic by nie znaczył.
|
|
159
|
+
* `null` (domyślnie) nie wypisuje atrybutu.
|
|
160
|
+
*/
|
|
161
|
+
readonly ariaExpanded: _angular_core.InputSignal<boolean | null>;
|
|
162
|
+
/** Id elementu, który FAB rozwija — para dla `ariaExpanded`. */
|
|
163
|
+
readonly ariaControls: _angular_core.InputSignal<string | null>;
|
|
150
164
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptFab, never>;
|
|
151
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptFab, "kpt-fab", never, { "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "extended": { "alias": "extended"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
|
|
165
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptFab, "kpt-fab", never, { "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "extended": { "alias": "extended"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "ariaExpanded": { "alias": "ariaExpanded"; "required": false; "isSignal": true; }; "ariaControls": { "alias": "ariaControls"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
|
|
152
166
|
}
|
|
153
167
|
|
|
154
168
|
/**
|
|
@@ -206,9 +220,17 @@ declare class KptBadge {
|
|
|
206
220
|
readonly dot: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
207
221
|
readonly overlay: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
208
222
|
readonly max: _angular_core.InputSignal<number>;
|
|
223
|
+
/**
|
|
224
|
+
* Znaczenie plakietki dla czytnika ekranu, np. „3 nieprzeczytane”. Sama liczba („3”) albo kropka
|
|
225
|
+
* nic nie mówią; z `label` widoczny tekst jest ukryty przed czytnikiem, a odczytywana jest etykieta.
|
|
226
|
+
*/
|
|
227
|
+
readonly label: _angular_core.InputSignal<string>;
|
|
228
|
+
/** Chowa plakietkę, gdy `value` to `0` albo `null` (nie dotyczy `dot`). */
|
|
229
|
+
readonly hideZero: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
230
|
+
protected readonly hiddenZero: _angular_core.Signal<boolean>;
|
|
209
231
|
protected readonly display: _angular_core.Signal<string | number>;
|
|
210
232
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptBadge, never>;
|
|
211
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptBadge, "kpt-badge", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "dot": { "alias": "dot"; "required": false; "isSignal": true; }; "overlay": { "alias": "overlay"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
|
|
233
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptBadge, "kpt-badge", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "dot": { "alias": "dot"; "required": false; "isSignal": true; }; "overlay": { "alias": "overlay"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "hideZero": { "alias": "hideZero"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
|
|
212
234
|
}
|
|
213
235
|
|
|
214
236
|
/** Awatar wiersza nagłówkowego — te same dane, które przyjmuje `kpt-avatar`. */
|
|
@@ -261,15 +283,32 @@ declare class KptMenu<T = unknown> {
|
|
|
261
283
|
*/
|
|
262
284
|
readonly open: _angular_core.ModelSignal<boolean>;
|
|
263
285
|
private readonly host;
|
|
286
|
+
private readonly injector;
|
|
287
|
+
private readonly panel;
|
|
288
|
+
protected readonly panelId: string;
|
|
289
|
+
/** Którą pozycję skupić po otwarciu — strzałka w górę na wyzwalaczu otwiera „od końca”. */
|
|
290
|
+
private focusEdge;
|
|
264
291
|
protected readonly positions: ConnectedPosition[];
|
|
265
292
|
constructor();
|
|
266
293
|
protected toggle(): void;
|
|
267
294
|
protected close(): void;
|
|
295
|
+
/** Strzałki na wyzwalaczu otwierają menu (albo przenoszą do niego fokus, gdy już jest otwarte). */
|
|
296
|
+
protected onTriggerKeydown(event: KeyboardEvent): void;
|
|
297
|
+
/** Panel istnieje w DOM-ie dopiero po podpięciu overlaya — fokus po najbliższym renderze. */
|
|
298
|
+
protected onAttach(): void;
|
|
299
|
+
protected onPanelKeydown(event: KeyboardEvent): void;
|
|
268
300
|
protected pick(item: KptMenuItem<T>): void;
|
|
301
|
+
private focusPanelEdge;
|
|
302
|
+
/** Fokus wraca na kontrolkę w slocie — inaczej po zniknięciu panelu spadłby na `<body>`. */
|
|
303
|
+
private closeAndRestoreFocus;
|
|
304
|
+
/** Prawdziwa kontrolka w rzutowanej treści — tam idą ARIA i powrót fokusu. */
|
|
305
|
+
private control;
|
|
269
306
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptMenu<any>, never>;
|
|
270
307
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptMenu<any>, "kpt-menu", never, { "items": { "alias": "items"; "required": false; "isSignal": true; }; "open": { "alias": "open"; "required": false; "isSignal": true; }; }, { "selected": "selected"; "open": "openChange"; }, never, ["*"], true, never>;
|
|
271
308
|
}
|
|
272
309
|
|
|
310
|
+
/** Warianty, które mają styl — podzbiór `KptButtonVariant`. */
|
|
311
|
+
type KptSplitButtonVariant = Extract<KptButtonVariant, 'filled' | 'tonal' | 'outline' | 'text'>;
|
|
273
312
|
/**
|
|
274
313
|
* Przycisk dzielony (split button) — akcja główna + rozwijane menu dodatkowych akcji.
|
|
275
314
|
* Wymaga `import '@angular/cdk/overlay-prebuilt.css';`
|
|
@@ -278,15 +317,30 @@ declare class KptMenu<T = unknown> {
|
|
|
278
317
|
* <kpt-split-button [items]="items" (primaryClick)="save()" (selected)="onItem($event)">Zapisz</kpt-split-button>
|
|
279
318
|
*/
|
|
280
319
|
declare class KptSplitButton<T = unknown> {
|
|
281
|
-
readonly variant: _angular_core.InputSignal<
|
|
320
|
+
readonly variant: _angular_core.InputSignal<KptSplitButtonVariant>;
|
|
282
321
|
readonly items: _angular_core.InputSignal<readonly KptMenuItem<T>[]>;
|
|
283
322
|
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
284
323
|
readonly primaryClick: _angular_core.OutputEmitterRef<void>;
|
|
285
324
|
readonly selected: _angular_core.OutputEmitterRef<KptMenuItem<T>>;
|
|
286
325
|
protected readonly i18n: KptI18n;
|
|
287
326
|
protected readonly open: _angular_core.WritableSignal<boolean>;
|
|
327
|
+
protected readonly panelId: string;
|
|
328
|
+
private readonly injector;
|
|
329
|
+
private readonly toggleBtn;
|
|
330
|
+
private readonly panel;
|
|
331
|
+
/** Którą pozycję skupić po otwarciu — strzałka w górę na przycisku otwiera „od końca”. */
|
|
332
|
+
private focusEdge;
|
|
288
333
|
protected readonly positions: ConnectedPosition[];
|
|
334
|
+
protected toggle(): void;
|
|
335
|
+
/** Strzałki na przycisku otwierają menu (albo przenoszą do niego fokus, gdy już jest otwarte). */
|
|
336
|
+
protected onToggleKeydown(event: KeyboardEvent): void;
|
|
337
|
+
/** Panel istnieje w DOM-ie dopiero po podpięciu overlaya — fokus po najbliższym renderze. */
|
|
338
|
+
protected onAttach(): void;
|
|
339
|
+
protected onPanelKeydown(event: KeyboardEvent): void;
|
|
289
340
|
protected pick(item: KptMenuItem<T>): void;
|
|
341
|
+
private focusPanelEdge;
|
|
342
|
+
/** Fokus wraca na strzałkę — inaczej po zniknięciu panelu spadłby na `<body>`. */
|
|
343
|
+
private closeAndRestoreFocus;
|
|
290
344
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptSplitButton<any>, never>;
|
|
291
345
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptSplitButton<any>, "kpt-split-button", never, { "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "items": { "alias": "items"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "primaryClick": "primaryClick"; "selected": "selected"; }, never, ["*"], true, never>;
|
|
292
346
|
}
|
|
@@ -297,6 +351,10 @@ declare class KptSplitButton<T = unknown> {
|
|
|
297
351
|
* ([[KptIconRegistry]]) — wbudowany zestaw działa od razu, pełny zestaw dodaje
|
|
298
352
|
* `provideKptTablerIcons()` z `@konce-pt/angular/icons`.
|
|
299
353
|
*
|
|
354
|
+
* Domyślnie ikona jest dekoracją (`aria-hidden`). Ikona niosąca znaczenie sama, bez tekstu obok
|
|
355
|
+
* (znacznik statusu w komórce), dostaje `label` — wtedy jest `role="img"` z tą nazwą. W trybie
|
|
356
|
+
* deweloperskim nieznana nazwa daje jedno ostrzeżenie w konsoli zamiast cichej pustki.
|
|
357
|
+
*
|
|
300
358
|
* @example
|
|
301
359
|
* <kpt-icon name="menu" />
|
|
302
360
|
* <kpt-icon name="check" size="1.25rem" />
|
|
@@ -306,11 +364,13 @@ declare class KptIcon {
|
|
|
306
364
|
readonly name: _angular_core.InputSignal<string>;
|
|
307
365
|
/** Rozmiar jako długość CSS (np. '1.25rem'); domyślnie dziedziczy z font-size. */
|
|
308
366
|
readonly size: _angular_core.InputSignal<string>;
|
|
367
|
+
/** Nazwa dla czytnika ekranu — tylko gdy ikona niesie znaczenie bez tekstu obok. */
|
|
368
|
+
readonly label: _angular_core.InputSignal<string>;
|
|
309
369
|
private readonly host;
|
|
310
370
|
private readonly registry;
|
|
311
371
|
constructor();
|
|
312
372
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptIcon, never>;
|
|
313
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptIcon, "kpt-icon", never, { "name": { "alias": "name"; "required": true; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
373
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptIcon, "kpt-icon", never, { "name": { "alias": "name"; "required": true; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
314
374
|
}
|
|
315
375
|
|
|
316
376
|
/**
|
|
@@ -447,6 +507,11 @@ declare class KptChip {
|
|
|
447
507
|
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
448
508
|
readonly removed: _angular_core.OutputEmitterRef<void>;
|
|
449
509
|
protected readonly i18n: KptI18n;
|
|
510
|
+
private readonly uid;
|
|
511
|
+
protected readonly labelId: string;
|
|
512
|
+
protected readonly removeId: string;
|
|
513
|
+
/** `Backspace` i `Delete` na przycisku usuwania działają jak kliknięcie — jak w polach tagów. */
|
|
514
|
+
protected onRemoveKeydown(event: KeyboardEvent): void;
|
|
450
515
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptChip, never>;
|
|
451
516
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptChip, "kpt-chip", never, { "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "textTransform": { "alias": "textTransform"; "required": false; "isSignal": true; }; "removable": { "alias": "removable"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "removed": "removed"; }, never, ["*"], true, never>;
|
|
452
517
|
}
|
|
@@ -461,6 +526,9 @@ type KptAvatarShape = 'circle' | 'square';
|
|
|
461
526
|
* a same inicjały są `aria-hidden`, żeby czytnik nie przeczytał „AK" litera po literze.
|
|
462
527
|
* Przy `src` etykietę niesie już `alt` obrazu — nie dublujemy jej.
|
|
463
528
|
*
|
|
529
|
+
* Gdy zdjęcie się nie wczyta, awatar wraca do inicjałów (albo ikony). `decorative` ukrywa go przed
|
|
530
|
+
* czytnikiem — dla awatara stojącego obok napisanego imienia, które inaczej byłoby czytane dwa razy.
|
|
531
|
+
*
|
|
464
532
|
* @example
|
|
465
533
|
* <kpt-avatar src="/u/anna.jpg" />
|
|
466
534
|
* <kpt-avatar name="Anna Kowalska" size="lg" />
|
|
@@ -472,14 +540,23 @@ declare class KptAvatar {
|
|
|
472
540
|
readonly icon: _angular_core.InputSignal<string | null>;
|
|
473
541
|
readonly size: _angular_core.InputSignal<KptAvatarSize>;
|
|
474
542
|
readonly shape: _angular_core.InputSignal<KptAvatarShape>;
|
|
543
|
+
/** Ukrywa awatar przed czytnikiem ekranu, gdy imię jest już napisane obok. */
|
|
544
|
+
readonly decorative: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
545
|
+
/** Zdjęcie się nie wczytało — wraca do `false` przy każdej zmianie `src`. */
|
|
546
|
+
protected readonly broken: _angular_core.WritableSignal<boolean>;
|
|
547
|
+
protected readonly showImage: _angular_core.Signal<boolean>;
|
|
548
|
+
protected readonly labelled: _angular_core.Signal<boolean>;
|
|
475
549
|
protected readonly initials: _angular_core.Signal<string>;
|
|
476
550
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptAvatar, never>;
|
|
477
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptAvatar, "kpt-avatar", never, { "src": { "alias": "src"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "shape": { "alias": "shape"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
551
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptAvatar, "kpt-avatar", never, { "src": { "alias": "src"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "shape": { "alias": "shape"; "required": false; "isSignal": true; }; "decorative": { "alias": "decorative"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
478
552
|
}
|
|
479
553
|
|
|
480
554
|
/**
|
|
481
555
|
* Wskaźnik ładowania (spinner). Kolor z `currentColor`.
|
|
482
556
|
*
|
|
557
|
+
* Pierścień jest dekoracją (`aria-hidden`); dla czytnika jest osobny, wizualnie ukryty region
|
|
558
|
+
* `role="status"` z etykietą, więc pojawienie się spinnera zostaje ogłoszone.
|
|
559
|
+
*
|
|
483
560
|
* @example
|
|
484
561
|
* <kpt-spinner />
|
|
485
562
|
* <kpt-spinner size="2rem" label="Wczytywanie danych" />
|
|
@@ -490,6 +567,13 @@ declare class KptSpinner {
|
|
|
490
567
|
readonly label: _angular_core.InputSignal<string | undefined>;
|
|
491
568
|
private readonly i18n;
|
|
492
569
|
protected readonly effectiveLabel: _angular_core.Signal<string>;
|
|
570
|
+
/**
|
|
571
|
+
* Tekst regionu statusu wpisujemy klatkę po pojawieniu się spinnera: region, który powstaje
|
|
572
|
+
* od razu z treścią, większość czytników przemilcza — ogłaszają dopiero zmianę.
|
|
573
|
+
*/
|
|
574
|
+
private readonly ready;
|
|
575
|
+
protected readonly announced: _angular_core.Signal<string>;
|
|
576
|
+
constructor();
|
|
493
577
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptSpinner, never>;
|
|
494
578
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptSpinner, "kpt-spinner", never, { "size": { "alias": "size"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
495
579
|
}
|
|
@@ -576,6 +660,48 @@ declare class KptSkeleton {
|
|
|
576
660
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptSkeleton, "kpt-skeleton", never, { "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "width": { "alias": "width"; "required": false; "isSignal": true; }; "height": { "alias": "height"; "required": false; "isSignal": true; }; "lines": { "alias": "lines"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
577
661
|
}
|
|
578
662
|
|
|
663
|
+
/**
|
|
664
|
+
* Kontekst, który `kpt-form-field` daje kontrolce w środku — odwrotny kierunek niż
|
|
665
|
+
* `KPT_FORM_FIELD_CONTROL` (tam kontrolka zgłasza wrapperowi wypełnienie). Dzięki niemu etykieta,
|
|
666
|
+
* podpowiedź i błąd wrappera są powiązane z kontrolką bez ręcznego `controlId`.
|
|
667
|
+
*
|
|
668
|
+
* Port React ma bliźniaczy kontekst `form-field/form-field-context.ts` — zmiana kontraktu w obu.
|
|
669
|
+
*/
|
|
670
|
+
interface KptFormFieldContext {
|
|
671
|
+
/** `controlId` podany jawnie na wrapperze (pusty napis, gdy go nie ma). */
|
|
672
|
+
readonly explicitId: Signal<string>;
|
|
673
|
+
/** Id elementu etykiety albo `null`, gdy wrapper jej nie pokazuje. */
|
|
674
|
+
readonly labelId: Signal<string | null>;
|
|
675
|
+
/** Id widocznego komunikatu (błąd albo podpowiedź) albo `null`. */
|
|
676
|
+
readonly describedBy: Signal<string | null>;
|
|
677
|
+
/** Kontrolka zgłasza swoje `id` — na nie wskaże `label[for]`. Zwraca funkcję wyrejestrowania. */
|
|
678
|
+
registerControl(id: Signal<string>): () => void;
|
|
679
|
+
}
|
|
680
|
+
/** Token DI kontekstu pola — dostarcza go `kpt-form-field` swojej zawartości. */
|
|
681
|
+
declare const KPT_FORM_FIELD: InjectionToken<KptFormFieldContext>;
|
|
682
|
+
/** To, czego kontrolka potrzebuje, żeby wrapper ją nazwał i opisał. */
|
|
683
|
+
interface KptFieldA11y {
|
|
684
|
+
/** Id elementu fokusowalnego: własny input `id`, potem `controlId` wrappera, potem wygenerowany. */
|
|
685
|
+
readonly id: Signal<string>;
|
|
686
|
+
/**
|
|
687
|
+
* Id etykiety wrappera — dla kontrolek na elemencie, którego `label[for]` nie nazywa
|
|
688
|
+
* (`div` z rolą, `contenteditable`). Natywne `input`/`textarea` nazywa już samo `for`.
|
|
689
|
+
*/
|
|
690
|
+
readonly labelledBy: Signal<string | null>;
|
|
691
|
+
/** Id podpowiedzi albo błędu wrappera — do `aria-describedby`. */
|
|
692
|
+
readonly describedBy: Signal<string | null>;
|
|
693
|
+
}
|
|
694
|
+
/**
|
|
695
|
+
* Wiąże kontrolkę z otaczającym `kpt-form-field`. Wołać w kontekście wstrzykiwania (pole klasy
|
|
696
|
+
* komponentu). Poza wrapperem zwraca samo `id` (własne albo wygenerowane) i puste powiązania.
|
|
697
|
+
*
|
|
698
|
+
* @example
|
|
699
|
+
* readonly id = input<string | null>(null);
|
|
700
|
+
* protected readonly field = kptFieldA11y(this.id, 'kpt-textarea');
|
|
701
|
+
* // szablon: [id]="field.id()" [attr.aria-describedby]="field.describedBy()"
|
|
702
|
+
*/
|
|
703
|
+
declare function kptFieldA11y(ownId: () => string | null | undefined, prefix: string): KptFieldA11y;
|
|
704
|
+
|
|
579
705
|
/**
|
|
580
706
|
* Wrapper pola formularza: etykieta, podpowiedź i komunikat błędu wokół dowolnej
|
|
581
707
|
* kontrolki (np. `kpt-input`). Prezentacyjny — stan błędu przekazuje się przez `error`
|
|
@@ -588,6 +714,10 @@ declare class KptSkeleton {
|
|
|
588
714
|
* oraz wartości początkowej) — bez wymogu placeholdera na kontrolce. Kontrolki bez natywnego
|
|
589
715
|
* `input`/`textarea` (np. `kpt-select`) zgłaszają wypełnienie tokenem `KPT_FORM_FIELD_CONTROL`.
|
|
590
716
|
*
|
|
717
|
+
* Kontrolki biblioteki same się z wrapperem wiążą (token `KPT_FORM_FIELD`): `label[for]` wskazuje
|
|
718
|
+
* `id` kontrolki bez ręcznego `controlId`, kontrolki na `div` z rolą dostają `aria-labelledby`
|
|
719
|
+
* na etykietę, a podpowiedź i błąd trafiają do `aria-describedby`.
|
|
720
|
+
*
|
|
591
721
|
* @example
|
|
592
722
|
* <kpt-form-field label="E-mail" [error]="emailError()" hint="Firmowy adres">
|
|
593
723
|
* <kpt-input [formField]="f.email" type="email" />
|
|
@@ -598,7 +728,7 @@ declare class KptSkeleton {
|
|
|
598
728
|
* <kpt-input />
|
|
599
729
|
* </kpt-form-field>
|
|
600
730
|
*/
|
|
601
|
-
declare class KptFormField {
|
|
731
|
+
declare class KptFormField implements KptFormFieldContext {
|
|
602
732
|
/** Tekst etykiety. */
|
|
603
733
|
readonly label: _angular_core.InputSignal<string>;
|
|
604
734
|
/** Podpowiedź pod kontrolką (ukrywana, gdy jest błąd). */
|
|
@@ -607,7 +737,10 @@ declare class KptFormField {
|
|
|
607
737
|
readonly error: _angular_core.InputSignal<string | null>;
|
|
608
738
|
/** Oznacz pole jako wymagane (gwiazdka przy etykiecie). */
|
|
609
739
|
readonly required: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
610
|
-
/**
|
|
740
|
+
/**
|
|
741
|
+
* Id kontrolki dla powiązania `label[for]`. Zwykle zbędny: kontrolki biblioteki zgłaszają swoje
|
|
742
|
+
* `id` same. Podany jawnie wygrywa — i trafia też do kontrolki, która nie ma własnego `id`.
|
|
743
|
+
*/
|
|
611
744
|
readonly controlId: _angular_core.InputSignal<string>;
|
|
612
745
|
/**
|
|
613
746
|
* Wariant etykiety: `fixed` (domyślnie, statyczna nad kontrolką) lub Float Label —
|
|
@@ -616,6 +749,16 @@ declare class KptFormField {
|
|
|
616
749
|
*/
|
|
617
750
|
readonly labelType: _angular_core.InputSignal<"fixed" | "over" | "in" | "on">;
|
|
618
751
|
private readonly host;
|
|
752
|
+
private readonly uid;
|
|
753
|
+
protected readonly labelElId: string;
|
|
754
|
+
protected readonly messageId: string;
|
|
755
|
+
private readonly registry;
|
|
756
|
+
readonly explicitId: _angular_core.Signal<string>;
|
|
757
|
+
readonly labelId: _angular_core.Signal<string | null>;
|
|
758
|
+
readonly describedBy: _angular_core.Signal<string | null>;
|
|
759
|
+
registerControl(id: Parameters<KptFormFieldContext['registerControl']>[0]): () => void;
|
|
760
|
+
/** Cel `label[for]`: jawny `controlId`, a bez niego `id` zgłoszone przez kontrolkę. */
|
|
761
|
+
protected readonly labelFor: _angular_core.Signal<string | null>;
|
|
619
762
|
/**
|
|
620
763
|
* Kontrolka bez natywnego `input`/`textarea` (np. `kpt-select`) zgłasza wypełnienie sama,
|
|
621
764
|
* przez token `KPT_FORM_FIELD_CONTROL` — jej wartość nie da się odczytać z DOM.
|
|
@@ -676,10 +819,12 @@ declare class KptInput implements FormValueControl<string> {
|
|
|
676
819
|
readonly touch: _angular_core.OutputEmitterRef<void>;
|
|
677
820
|
readonly type: _angular_core.InputSignal<KptInputType>;
|
|
678
821
|
readonly placeholder: _angular_core.InputSignal<string>;
|
|
679
|
-
|
|
822
|
+
/** Id natywnego pola; bez niego generowane (w `kpt-form-field` — `controlId` wrappera). */
|
|
823
|
+
readonly id: _angular_core.InputSignal<string | null>;
|
|
680
824
|
readonly ariaLabel: _angular_core.InputSignal<string | null>;
|
|
681
825
|
/** Podpowiedź autouzupełniania dla przeglądarki i menedżera haseł (np. 'email', 'current-password'). */
|
|
682
826
|
readonly autocomplete: _angular_core.InputSignal<string | null>;
|
|
827
|
+
protected readonly field: _konce_pt_angular.KptFieldA11y;
|
|
683
828
|
protected onInput(event: Event): void;
|
|
684
829
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptInput, never>;
|
|
685
830
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptInput, "kpt-input", never, { "value": { "alias": "value"; "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; }; "errors": { "alias": "errors"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "autocomplete": { "alias": "autocomplete"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "touch": "touch"; }, never, never, true, never>;
|
|
@@ -692,16 +837,28 @@ declare class KptInput implements FormValueControl<string> {
|
|
|
692
837
|
declare class KptCheckbox implements FormCheckboxControl {
|
|
693
838
|
/** Zaznaczenie (wymagane przez kontrakt FormCheckboxControl). */
|
|
694
839
|
readonly checked: _angular_core.ModelSignal<boolean>;
|
|
840
|
+
/**
|
|
841
|
+
* Stan pośredni („część zaznaczona”) — dla pola „zaznacz wszystko” nad listą. Czytnik ogłasza
|
|
842
|
+
* go jako „częściowo zaznaczone”; kliknięcie zdejmuje go i ustawia `checked`.
|
|
843
|
+
*/
|
|
844
|
+
readonly indeterminate: _angular_core.ModelSignal<boolean>;
|
|
695
845
|
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
846
|
+
readonly required: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
847
|
+
/** Id elementu fokusowalnego; bez niego generowane (w `kpt-form-field` — `controlId` wrappera). */
|
|
848
|
+
readonly id: _angular_core.InputSignal<string | null>;
|
|
849
|
+
/** Nazwa dostępna, gdy kontrolki nie opisuje etykieta (`<label for>` albo `kpt-form-field`). */
|
|
850
|
+
readonly ariaLabel: _angular_core.InputSignal<string | null>;
|
|
696
851
|
readonly invalid: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
697
852
|
readonly touched: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
698
853
|
/** Stan nieprawidłowy pokazujemy dopiero po dotknięciu pola — jak natywne `:user-invalid`. */
|
|
699
854
|
protected readonly showInvalid: _angular_core.Signal<boolean>;
|
|
700
855
|
readonly touch: _angular_core.OutputEmitterRef<void>;
|
|
856
|
+
protected readonly field: _konce_pt_angular.KptFieldA11y;
|
|
701
857
|
/** Etykieta obok pola. */
|
|
702
858
|
readonly label: _angular_core.InputSignal<string>;
|
|
859
|
+
protected onChange(checked: boolean): void;
|
|
703
860
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptCheckbox, never>;
|
|
704
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptCheckbox, "kpt-checkbox", never, { "checked": { "alias": "checked"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; }, { "checked": "checkedChange"; "touch": "touch"; }, never, ["*"], true, never>;
|
|
861
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptCheckbox, "kpt-checkbox", never, { "checked": { "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; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; }, { "checked": "checkedChange"; "indeterminate": "indeterminateChange"; "touch": "touch"; }, never, ["*"], true, never>;
|
|
705
862
|
}
|
|
706
863
|
|
|
707
864
|
/**
|
|
@@ -715,11 +872,16 @@ declare class KptCheckbox implements FormCheckboxControl {
|
|
|
715
872
|
declare class KptSwitch implements FormCheckboxControl {
|
|
716
873
|
readonly checked: _angular_core.ModelSignal<boolean>;
|
|
717
874
|
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
875
|
+
/** Id elementu fokusowalnego; bez niego generowane (w `kpt-form-field` — `controlId` wrappera). */
|
|
876
|
+
readonly id: _angular_core.InputSignal<string | null>;
|
|
877
|
+
/** Nazwa dostępna, gdy kontrolki nie opisuje etykieta (`<label for>` albo `kpt-form-field`). */
|
|
878
|
+
readonly ariaLabel: _angular_core.InputSignal<string | null>;
|
|
718
879
|
readonly invalid: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
719
880
|
readonly touched: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
720
881
|
/** Stan nieprawidłowy pokazujemy dopiero po dotknięciu pola — jak natywne `:user-invalid`. */
|
|
721
882
|
protected readonly showInvalid: _angular_core.Signal<boolean>;
|
|
722
883
|
readonly touch: _angular_core.OutputEmitterRef<void>;
|
|
884
|
+
protected readonly field: _konce_pt_angular.KptFieldA11y;
|
|
723
885
|
readonly label: _angular_core.InputSignal<string>;
|
|
724
886
|
/** Pozycja etykiety `label` względem przełącznika: 'end' (prawo, domyślnie) lub 'start' (lewo). */
|
|
725
887
|
readonly labelPosition: _angular_core.InputSignal<"start" | "end">;
|
|
@@ -731,7 +893,7 @@ declare class KptSwitch implements FormCheckboxControl {
|
|
|
731
893
|
/** Tekst zależny od stanu przełącznika. */
|
|
732
894
|
protected readonly stateLabel: _angular_core.Signal<string>;
|
|
733
895
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptSwitch, never>;
|
|
734
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptSwitch, "kpt-switch", never, { "checked": { "alias": "checked"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "labelPosition": { "alias": "labelPosition"; "required": false; "isSignal": true; }; "onLabel": { "alias": "onLabel"; "required": false; "isSignal": true; }; "offLabel": { "alias": "offLabel"; "required": false; "isSignal": true; }; }, { "checked": "checkedChange"; "touch": "touch"; }, never, ["*"], true, never>;
|
|
896
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptSwitch, "kpt-switch", never, { "checked": { "alias": "checked"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "labelPosition": { "alias": "labelPosition"; "required": false; "isSignal": true; }; "onLabel": { "alias": "onLabel"; "required": false; "isSignal": true; }; "offLabel": { "alias": "offLabel"; "required": false; "isSignal": true; }; }, { "checked": "checkedChange"; "touch": "touch"; }, never, ["*"], true, never>;
|
|
735
897
|
}
|
|
736
898
|
|
|
737
899
|
/**
|
|
@@ -748,11 +910,17 @@ declare class KptSwitchGroup<T = unknown> implements FormValueControl<unknown> {
|
|
|
748
910
|
readonly value: _angular_core.ModelSignal<unknown>;
|
|
749
911
|
readonly options: _angular_core.InputSignal<readonly KptOption<T>[]>;
|
|
750
912
|
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
913
|
+
/** Id elementu fokusowalnego; bez niego generowane (w `kpt-form-field` — `controlId` wrappera). */
|
|
914
|
+
readonly id: _angular_core.InputSignal<string | null>;
|
|
915
|
+
/** Nazwa dostępna, gdy kontrolki nie opisuje etykieta (`<label for>` albo `kpt-form-field`). */
|
|
916
|
+
readonly ariaLabel: _angular_core.InputSignal<string | null>;
|
|
751
917
|
readonly invalid: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
752
918
|
readonly touched: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
753
919
|
/** Stan nieprawidłowy pokazujemy dopiero po dotknięciu pola — jak natywne `:user-invalid`. */
|
|
754
920
|
protected readonly showInvalid: _angular_core.Signal<boolean>;
|
|
755
921
|
readonly touch: _angular_core.OutputEmitterRef<void>;
|
|
922
|
+
/** Grupa nie dostaje nazwy z `label[for]` — stąd `aria-labelledby` na etykietę wrappera. */
|
|
923
|
+
protected readonly field: _konce_pt_angular.KptFieldA11y;
|
|
756
924
|
/** Układ: 'vertical' (domyślnie) lub 'horizontal'. */
|
|
757
925
|
readonly orientation: _angular_core.InputSignal<"vertical" | "horizontal">;
|
|
758
926
|
/** Tryb wielokrotnego wyboru — wartość to tablica `T[]` zaznaczonych opcji. Domyślnie false (pojedynczy wybór). */
|
|
@@ -767,7 +935,7 @@ declare class KptSwitchGroup<T = unknown> implements FormValueControl<unknown> {
|
|
|
767
935
|
protected isChecked(optValue: T): boolean;
|
|
768
936
|
protected onToggle(opt: KptOption<T>, checked: boolean): void;
|
|
769
937
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptSwitchGroup<any>, never>;
|
|
770
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptSwitchGroup<any>, "kpt-switch-group", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "allowDeselect": { "alias": "allowDeselect"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "touch": "touch"; }, never, never, true, never>;
|
|
938
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptSwitchGroup<any>, "kpt-switch-group", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "allowDeselect": { "alias": "allowDeselect"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "touch": "touch"; }, never, never, true, never>;
|
|
771
939
|
}
|
|
772
940
|
|
|
773
941
|
/**
|
|
@@ -778,20 +946,36 @@ declare class KptRadioGroup<T = unknown> implements FormValueControl<T> {
|
|
|
778
946
|
readonly value: _angular_core.ModelSignal<T>;
|
|
779
947
|
readonly options: _angular_core.InputSignal<readonly KptOption<T>[]>;
|
|
780
948
|
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
949
|
+
readonly required: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
950
|
+
/** Układ opcji: pod sobą (domyślnie) albo w rzędzie, z zawijaniem. */
|
|
951
|
+
readonly orientation: _angular_core.InputSignal<"vertical" | "horizontal">;
|
|
952
|
+
/** Id elementu fokusowalnego; bez niego generowane (w `kpt-form-field` — `controlId` wrappera). */
|
|
953
|
+
readonly id: _angular_core.InputSignal<string | null>;
|
|
954
|
+
/** Nazwa dostępna, gdy kontrolki nie opisuje etykieta (`<label for>` albo `kpt-form-field`). */
|
|
955
|
+
readonly ariaLabel: _angular_core.InputSignal<string | null>;
|
|
781
956
|
readonly invalid: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
782
957
|
readonly touched: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
783
958
|
/** Stan nieprawidłowy pokazujemy dopiero po dotknięciu pola — jak natywne `:user-invalid`. */
|
|
784
959
|
protected readonly showInvalid: _angular_core.Signal<boolean>;
|
|
785
960
|
readonly touch: _angular_core.OutputEmitterRef<void>;
|
|
961
|
+
/** Grupa nie dostaje nazwy z `label[for]` — stąd `aria-labelledby` na etykietę wrappera. */
|
|
962
|
+
protected readonly field: _konce_pt_angular.KptFieldA11y;
|
|
786
963
|
readonly name: _angular_core.InputSignal<string>;
|
|
787
964
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptRadioGroup<any>, never>;
|
|
788
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptRadioGroup<any>, "kpt-radio-group", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "touch": "touch"; }, never, never, true, never>;
|
|
965
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptRadioGroup<any>, "kpt-radio-group", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "touch": "touch"; }, never, never, true, never>;
|
|
789
966
|
}
|
|
790
967
|
|
|
791
968
|
/**
|
|
792
969
|
* Lista wyboru (select) na własnym panelu (CDK Overlay), zintegrowana z Signal Forms.
|
|
793
970
|
* Warianty: pojedynczy, z wyszukiwarką (`filter`) i wielokrotny (`multiple`, chipy).
|
|
794
971
|
*
|
|
972
|
+
* Klawiatura według wzorca WAI-ARIA „select-only combobox”: fokus zostaje na polu, a aktywna opcja
|
|
973
|
+
* idzie przez `aria-activedescendant`. `↓`/`↑`/`Enter`/`Spacja` otwierają listę na wybranej opcji,
|
|
974
|
+
* strzałki, `Home`/`End`, `PageUp`/`PageDown` chodzą po opcjach (z pominięciem wyłączonych),
|
|
975
|
+
* wpisywane litery skaczą do pasującej opcji (bez polskich znaków), `Enter` wybiera, `Escape`
|
|
976
|
+
* zamyka. Z `filter` fokus przechodzi do pola wyszukiwania, które obsługuje te same klawisze.
|
|
977
|
+
* W trybie `multiple` `Backspace` na zamkniętym polu usuwa ostatni wybór.
|
|
978
|
+
*
|
|
795
979
|
* @example
|
|
796
980
|
* <kpt-select [formField]="f.role" [options]="roles" placeholder="Wybierz…" />
|
|
797
981
|
* <kpt-select [formField]="f.city" [options]="cities" filter placeholder="Szukaj miasta…" />
|
|
@@ -805,11 +989,18 @@ declare class KptSelect<T = unknown> implements FormValueControl<unknown>, KptFo
|
|
|
805
989
|
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
806
990
|
readonly invalid: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
807
991
|
readonly touched: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
992
|
+
/** Nazwa pola dla czytnika, gdy nie opisuje go etykieta. */
|
|
993
|
+
readonly ariaLabel: _angular_core.InputSignal<string | null>;
|
|
994
|
+
/** Id elementu fokusowalnego; bez niego generowane (w `kpt-form-field` — `controlId` wrappera). */
|
|
995
|
+
readonly id: _angular_core.InputSignal<string | null>;
|
|
996
|
+
readonly required: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
808
997
|
/** Stan nieprawidłowy pokazujemy dopiero po dotknięciu pola — jak natywne `:user-invalid`. */
|
|
809
998
|
protected readonly showInvalid: _angular_core.Signal<boolean>;
|
|
810
999
|
/** Wartość: pojedyncza (T) lub tablica (T[]) w trybie multiple. */
|
|
811
1000
|
readonly value: _angular_core.ModelSignal<unknown>;
|
|
812
1001
|
readonly touch: _angular_core.OutputEmitterRef<void>;
|
|
1002
|
+
/** `div` z rolą nie dostaje nazwy z `label[for]` — stąd `aria-labelledby` na etykietę wrappera. */
|
|
1003
|
+
protected readonly field: _konce_pt_angular.KptFieldA11y;
|
|
813
1004
|
protected readonly i18n: KptI18n;
|
|
814
1005
|
/**
|
|
815
1006
|
* Stan panelu (dwukierunkowy). Pozwala otworzyć listę z zewnątrz i — co ważniejsze — wiedzieć,
|
|
@@ -818,8 +1009,17 @@ declare class KptSelect<T = unknown> implements FormValueControl<unknown>, KptFo
|
|
|
818
1009
|
readonly open: _angular_core.ModelSignal<boolean>;
|
|
819
1010
|
protected readonly filterText: _angular_core.WritableSignal<string>;
|
|
820
1011
|
protected readonly activeIndex: _angular_core.WritableSignal<number>;
|
|
1012
|
+
private readonly uid;
|
|
1013
|
+
protected readonly listId: string;
|
|
1014
|
+
private readonly triggerEl;
|
|
1015
|
+
private readonly searchEl;
|
|
1016
|
+
private readonly injector;
|
|
1017
|
+
private readonly typeahead;
|
|
821
1018
|
protected readonly positions: ConnectedPosition[];
|
|
822
1019
|
constructor();
|
|
1020
|
+
protected optionId(i: number): string;
|
|
1021
|
+
protected readonly activeOptionId: _angular_core.Signal<string | null>;
|
|
1022
|
+
private readonly disabledMap;
|
|
823
1023
|
private readonly selectedValues;
|
|
824
1024
|
protected readonly selectedOptions: _angular_core.Signal<KptOption<T>[]>;
|
|
825
1025
|
protected readonly filteredOptions: _angular_core.Signal<readonly KptOption<T>[]>;
|
|
@@ -832,13 +1032,18 @@ declare class KptSelect<T = unknown> implements FormValueControl<unknown>, KptFo
|
|
|
832
1032
|
protected isSelected(opt: KptOption<T>): boolean;
|
|
833
1033
|
protected toggleOpen(): void;
|
|
834
1034
|
protected close(): void;
|
|
1035
|
+
/** Zamknięcie z powrotem fokusu na pole — po wyborze z klawiatury, `Escape`, `Tab` w wyszukiwarce. */
|
|
1036
|
+
private closeAndFocus;
|
|
1037
|
+
/** Z `filter` fokus idzie do pola wyszukiwania — panel istnieje dopiero po podpięciu overlaya. */
|
|
1038
|
+
protected onAttach(): void;
|
|
835
1039
|
protected pick(opt: KptOption<T>): void;
|
|
836
1040
|
protected removeChip(opt: KptOption<T>, event: Event): void;
|
|
837
1041
|
protected onFilterInput(event: Event): void;
|
|
838
|
-
|
|
839
|
-
protected
|
|
1042
|
+
/** Jeden obsługiwacz dla pola i dla wyszukiwarki w panelu — różnią się tylko `Spacją` i `Tab`. */
|
|
1043
|
+
protected onKeydown(event: KeyboardEvent, source: 'trigger' | 'search'): void;
|
|
1044
|
+
private jumpTo;
|
|
840
1045
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptSelect<any>, never>;
|
|
841
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptSelect<any>, "kpt-select", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "filter": { "alias": "filter"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "open": { "alias": "open"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "touch": "touch"; "open": "openChange"; }, never, never, true, never>;
|
|
1046
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptSelect<any>, "kpt-select", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "filter": { "alias": "filter"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "open": { "alias": "open"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "touch": "touch"; "open": "openChange"; }, never, never, true, never>;
|
|
842
1047
|
}
|
|
843
1048
|
|
|
844
1049
|
/**
|
|
@@ -858,6 +1063,13 @@ type KptDatepickerView = KptCalendarView;
|
|
|
858
1063
|
* / 'RRRR-MM-DDTHH:mm' (datetime) / 'HH:mm' (time). Czas przechowywany zawsze 24h.
|
|
859
1064
|
* Wymaga stylów overlay CDK: `import '@angular/cdk/overlay-prebuilt.css';`
|
|
860
1065
|
*
|
|
1066
|
+
* Klawiatura według wzorca WAI-ARIA „date picker dialog”: `Enter`/`Spacja`/`↓` na polu otwierają
|
|
1067
|
+
* kalendarz i przenoszą fokus na wybrany (albo dzisiejszy) dzień. W siatce dni strzałki chodzą
|
|
1068
|
+
* o dzień i tydzień, `Home`/`End` na początek i koniec tygodnia, `PageUp`/`PageDown` o miesiąc
|
|
1069
|
+
* (z `Shift` — o rok); w siatkach miesięcy, lat i dekad strzałki chodzą po komórkach. `Tab` krąży
|
|
1070
|
+
* w panelu, `Escape` zamyka go, a wybór i zamknięcie oddają fokus polu. `Delete`/`Backspace` na polu
|
|
1071
|
+
* czyści wartość.
|
|
1072
|
+
*
|
|
861
1073
|
* @example
|
|
862
1074
|
* <kpt-datepicker [formField]="f.birthDate" startView="decade" minDate="1900-01-01" />
|
|
863
1075
|
* <kpt-datepicker selectionMode="datetime" [hourFormat]="12" [(value)]="meetingAt" />
|
|
@@ -871,9 +1083,13 @@ declare class KptDatepicker implements FormValueControl<string> {
|
|
|
871
1083
|
/** Stan nieprawidłowy pokazujemy dopiero po dotknięciu pola — jak natywne `:user-invalid`. */
|
|
872
1084
|
protected readonly showInvalid: _angular_core.Signal<boolean>;
|
|
873
1085
|
readonly touch: _angular_core.OutputEmitterRef<void>;
|
|
1086
|
+
/** `div` z rolą nie dostaje nazwy z `label[for]` — stąd `aria-labelledby` na etykietę wrappera. */
|
|
1087
|
+
protected readonly field: _konce_pt_angular.KptFieldA11y;
|
|
874
1088
|
readonly placeholder: _angular_core.InputSignal<string>;
|
|
875
1089
|
/** Nazwa dostępna, gdy pola nie opisuje `<label for>` (np. dwa pola w jednym wierszu). */
|
|
876
1090
|
readonly ariaLabel: _angular_core.InputSignal<string | null>;
|
|
1091
|
+
/** Id elementu fokusowalnego; bez niego generowane (w `kpt-form-field` — `controlId` wrappera). */
|
|
1092
|
+
readonly id: _angular_core.InputSignal<string | null>;
|
|
877
1093
|
readonly displayFormat: _angular_core.InputSignal<"pl" | "iso">;
|
|
878
1094
|
/** Granulacja wyboru. */
|
|
879
1095
|
readonly selectionMode: _angular_core.InputSignal<KptDateSelectionMode>;
|
|
@@ -902,6 +1118,19 @@ declare class KptDatepicker implements FormValueControl<string> {
|
|
|
902
1118
|
*/
|
|
903
1119
|
readonly open: _angular_core.ModelSignal<boolean>;
|
|
904
1120
|
private readonly today;
|
|
1121
|
+
private readonly todayIso;
|
|
1122
|
+
private readonly uid;
|
|
1123
|
+
protected readonly panelId: string;
|
|
1124
|
+
private readonly triggerEl;
|
|
1125
|
+
private readonly injector;
|
|
1126
|
+
/** Dzień z fokusem w siatce dni — jedyny przystanek Tab siatki (roving tabindex). */
|
|
1127
|
+
protected readonly focusIso: _angular_core.WritableSignal<string>;
|
|
1128
|
+
/** Komórka z fokusem w siatkach miesięcy, lat i dekad. */
|
|
1129
|
+
protected readonly focusCell: _angular_core.WritableSignal<number>;
|
|
1130
|
+
/** Kierunek pisania panelu — w RTL strzałki w poziomie są odwrócone. */
|
|
1131
|
+
private rtl;
|
|
1132
|
+
/** Pełna nazwa dnia dla czytnika („czwartek, 8 października 2026”) — sama liczba nic nie mówi. */
|
|
1133
|
+
protected readonly dayName: _angular_core.Signal<(iso: string) => string>;
|
|
905
1134
|
private readonly view;
|
|
906
1135
|
/** Aktualny poziom stosu widoków panelu. */
|
|
907
1136
|
protected readonly panelView: _angular_core.WritableSignal<KptCalendarView>;
|
|
@@ -915,6 +1144,20 @@ declare class KptDatepicker implements FormValueControl<string> {
|
|
|
915
1144
|
protected readonly hasFooter: _angular_core.Signal<boolean>;
|
|
916
1145
|
protected readonly positions: ConnectedPosition[];
|
|
917
1146
|
constructor();
|
|
1147
|
+
/** Dzień i komórka, na które trafi fokus po otwarciu albo zmianie poziomu. */
|
|
1148
|
+
private resetFocusTargets;
|
|
1149
|
+
private defaultCellIndex;
|
|
1150
|
+
/** Panel istnieje w DOM-ie dopiero po podpięciu overlaya — fokus po najbliższym renderze. */
|
|
1151
|
+
protected onAttach(): void;
|
|
1152
|
+
/** Fokus na skupiony dzień, skupioną komórkę albo — przy zegarze — pierwszy element panelu. */
|
|
1153
|
+
private focusActive;
|
|
1154
|
+
private focusAfterRender;
|
|
1155
|
+
protected onTriggerKeydown(event: KeyboardEvent): void;
|
|
1156
|
+
protected onPanelKeydown(event: KeyboardEvent): void;
|
|
1157
|
+
protected onDayKeydown(event: KeyboardEvent): void;
|
|
1158
|
+
protected onCellKeydown(event: KeyboardEvent): void;
|
|
1159
|
+
/** Zamknięcie z powrotem fokusu na pole — po wyborze z klawiatury, `Escape`. */
|
|
1160
|
+
private closeAndFocus;
|
|
918
1161
|
protected readonly viewYear: _angular_core.Signal<number>;
|
|
919
1162
|
protected readonly monthName: _angular_core.Signal<string>;
|
|
920
1163
|
protected readonly yearRangeLabel: _angular_core.Signal<string>;
|
|
@@ -969,7 +1212,7 @@ declare class KptDatepicker implements FormValueControl<string> {
|
|
|
969
1212
|
protected pageNext(): void;
|
|
970
1213
|
protected clear(event: Event): void;
|
|
971
1214
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptDatepicker, never>;
|
|
972
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptDatepicker, "kpt-datepicker", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "displayFormat": { "alias": "displayFormat"; "required": false; "isSignal": true; }; "selectionMode": { "alias": "selectionMode"; "required": false; "isSignal": true; }; "startView": { "alias": "startView"; "required": false; "isSignal": true; }; "monthDisplay": { "alias": "monthDisplay"; "required": false; "isSignal": true; }; "hourFormat": { "alias": "hourFormat"; "required": false; "isSignal": true; }; "minuteStep": { "alias": "minuteStep"; "required": false; "isSignal": true; }; "minDate": { "alias": "minDate"; "required": false; "isSignal": true; }; "maxDate": { "alias": "maxDate"; "required": false; "isSignal": true; }; "open": { "alias": "open"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "touch": "touch"; "open": "openChange"; }, never, never, true, never>;
|
|
1215
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptDatepicker, "kpt-datepicker", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "displayFormat": { "alias": "displayFormat"; "required": false; "isSignal": true; }; "selectionMode": { "alias": "selectionMode"; "required": false; "isSignal": true; }; "startView": { "alias": "startView"; "required": false; "isSignal": true; }; "monthDisplay": { "alias": "monthDisplay"; "required": false; "isSignal": true; }; "hourFormat": { "alias": "hourFormat"; "required": false; "isSignal": true; }; "minuteStep": { "alias": "minuteStep"; "required": false; "isSignal": true; }; "minDate": { "alias": "minDate"; "required": false; "isSignal": true; }; "maxDate": { "alias": "maxDate"; "required": false; "isSignal": true; }; "open": { "alias": "open"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "touch": "touch"; "open": "openChange"; }, never, never, true, never>;
|
|
973
1216
|
}
|
|
974
1217
|
|
|
975
1218
|
/**
|
|
@@ -1010,6 +1253,7 @@ declare class KptClock {
|
|
|
1010
1253
|
|
|
1011
1254
|
/**
|
|
1012
1255
|
* Pole wieloliniowe (textarea) na Signal Forms, z opcjonalnym auto-resize.
|
|
1256
|
+
* W `kpt-form-field` wiąże się z etykietą i komunikatem samo (`id`, `aria-describedby`).
|
|
1013
1257
|
*
|
|
1014
1258
|
* @example
|
|
1015
1259
|
* <kpt-textarea [formField]="f.notes" placeholder="Notatki…" autoResize />
|
|
@@ -1021,22 +1265,78 @@ declare class KptTextarea implements FormValueControl<string> {
|
|
|
1021
1265
|
readonly autoResize: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1022
1266
|
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1023
1267
|
readonly readonly: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1268
|
+
readonly required: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1269
|
+
/** Id natywnego pola; bez niego generowane (w `kpt-form-field` — `controlId` wrappera). */
|
|
1270
|
+
readonly id: _angular_core.InputSignal<string | null>;
|
|
1271
|
+
/** Nazwa dostępna, gdy pola nie opisuje `<label for>`. */
|
|
1272
|
+
readonly ariaLabel: _angular_core.InputSignal<string | null>;
|
|
1273
|
+
/** Limit znaków (natywne `maxlength`); pod `[formField]` wiąże go `maxLength()` ze schematu. */
|
|
1274
|
+
readonly maxLength: _angular_core.InputSignal<number | undefined>;
|
|
1275
|
+
/** Licznik „12 / 280” pod polem (wymaga `maxLength`), czytany razem z polem przez `aria-describedby`. */
|
|
1276
|
+
readonly counter: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1024
1277
|
readonly invalid: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1025
1278
|
readonly touched: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1026
1279
|
/** Stan nieprawidłowy pokazujemy dopiero po dotknięciu pola — jak natywne `:user-invalid`. */
|
|
1027
1280
|
protected readonly showInvalid: _angular_core.Signal<boolean>;
|
|
1028
1281
|
readonly touch: _angular_core.OutputEmitterRef<void>;
|
|
1282
|
+
protected readonly field: _konce_pt_angular.KptFieldA11y;
|
|
1283
|
+
protected readonly counterId: _angular_core.Signal<string>;
|
|
1284
|
+
protected readonly describedBy: _angular_core.Signal<string | null>;
|
|
1029
1285
|
private readonly ta;
|
|
1030
1286
|
constructor();
|
|
1031
1287
|
protected onInput(event: Event): void;
|
|
1032
1288
|
private resize;
|
|
1033
1289
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptTextarea, never>;
|
|
1034
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptTextarea, "kpt-textarea", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "rows": { "alias": "rows"; "required": false; "isSignal": true; }; "autoResize": { "alias": "autoResize"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "touch": "touch"; }, never, never, true, never>;
|
|
1290
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptTextarea, "kpt-textarea", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "rows": { "alias": "rows"; "required": false; "isSignal": true; }; "autoResize": { "alias": "autoResize"; "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; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "maxLength": { "alias": "maxLength"; "required": false; "isSignal": true; }; "counter": { "alias": "counter"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "touch": "touch"; }, never, never, true, never>;
|
|
1035
1291
|
}
|
|
1036
1292
|
|
|
1037
1293
|
type KptRichTool = 'copy' | 'paste' | 'pasteText' | 'heading' | 'bold' | 'italic' | 'underline' | 'strike' | 'ul' | 'ol' | 'indent' | 'outdent' | 'foreColor' | 'backColor' | 'alignLeft' | 'alignCenter' | 'alignRight' | 'alignJustify' | 'link' | 'table' | 'clear' | 'html';
|
|
1038
1294
|
/** Pasek: płaska lista narzędzi lub grupy (sekcje rozdzielone separatorem). */
|
|
1039
1295
|
type KptRichToolbar = readonly KptRichTool[] | readonly (readonly KptRichTool[])[];
|
|
1296
|
+
/** Paleta kolorów z nazwami (`richText.swatches.*`) — sam kod szesnastkowy nic czytnikowi nie mówi. */
|
|
1297
|
+
declare const SWATCHES: readonly [{
|
|
1298
|
+
readonly color: "#000000";
|
|
1299
|
+
readonly name: "black";
|
|
1300
|
+
}, {
|
|
1301
|
+
readonly color: "#434343";
|
|
1302
|
+
readonly name: "darkGray";
|
|
1303
|
+
}, {
|
|
1304
|
+
readonly color: "#666666";
|
|
1305
|
+
readonly name: "gray";
|
|
1306
|
+
}, {
|
|
1307
|
+
readonly color: "#999999";
|
|
1308
|
+
readonly name: "midGray";
|
|
1309
|
+
}, {
|
|
1310
|
+
readonly color: "#b7b7b7";
|
|
1311
|
+
readonly name: "silver";
|
|
1312
|
+
}, {
|
|
1313
|
+
readonly color: "#cccccc";
|
|
1314
|
+
readonly name: "lightGray";
|
|
1315
|
+
}, {
|
|
1316
|
+
readonly color: "#ffffff";
|
|
1317
|
+
readonly name: "white";
|
|
1318
|
+
}, {
|
|
1319
|
+
readonly color: "#e11d48";
|
|
1320
|
+
readonly name: "red";
|
|
1321
|
+
}, {
|
|
1322
|
+
readonly color: "#ea580c";
|
|
1323
|
+
readonly name: "orange";
|
|
1324
|
+
}, {
|
|
1325
|
+
readonly color: "#ca8a04";
|
|
1326
|
+
readonly name: "yellow";
|
|
1327
|
+
}, {
|
|
1328
|
+
readonly color: "#16a34a";
|
|
1329
|
+
readonly name: "green";
|
|
1330
|
+
}, {
|
|
1331
|
+
readonly color: "#0891b2";
|
|
1332
|
+
readonly name: "cyan";
|
|
1333
|
+
}, {
|
|
1334
|
+
readonly color: "#2563eb";
|
|
1335
|
+
readonly name: "blue";
|
|
1336
|
+
}, {
|
|
1337
|
+
readonly color: "#7c3aed";
|
|
1338
|
+
readonly name: "violet";
|
|
1339
|
+
}];
|
|
1040
1340
|
/**
|
|
1041
1341
|
* Lekki edytor tekstu sformatowanego (contenteditable) z konfigurowalnym paskiem sekcji.
|
|
1042
1342
|
* Narzędzia: schowek (kopiuj / wklej / wklej bez formatowania), styl (nagłówki H1–H6 / paragraf),
|
|
@@ -1055,6 +1355,11 @@ declare class KptRichText implements FormValueControl<string> {
|
|
|
1055
1355
|
/** Maksymalna głębokość zagnieżdżenia list (Tab / „Dodaj wcięcie"). */
|
|
1056
1356
|
readonly maxListLevel: _angular_core.InputSignalWithTransform<number, unknown>;
|
|
1057
1357
|
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1358
|
+
readonly required: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1359
|
+
/** Id elementu fokusowalnego; bez niego generowane (w `kpt-form-field` — `controlId` wrappera). */
|
|
1360
|
+
readonly id: _angular_core.InputSignal<string | null>;
|
|
1361
|
+
/** Nazwa dostępna, gdy kontrolki nie opisuje etykieta (`<label for>` albo `kpt-form-field`). */
|
|
1362
|
+
readonly ariaLabel: _angular_core.InputSignal<string | null>;
|
|
1058
1363
|
readonly invalid: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1059
1364
|
readonly touched: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1060
1365
|
/** Stan nieprawidłowy pokazujemy dopiero po dotknięciu pola — jak natywne `:user-invalid`. */
|
|
@@ -1067,11 +1372,56 @@ declare class KptRichText implements FormValueControl<string> {
|
|
|
1067
1372
|
/** Ile podpowiedzi naraz. */
|
|
1068
1373
|
readonly mentionLimit: _angular_core.InputSignalWithTransform<number, unknown>;
|
|
1069
1374
|
readonly touch: _angular_core.OutputEmitterRef<void>;
|
|
1375
|
+
/** `contenteditable` nie dostaje nazwy z `label[for]` — stąd `aria-labelledby` na etykietę wrappera. */
|
|
1376
|
+
protected readonly field: _konce_pt_angular.KptFieldA11y;
|
|
1070
1377
|
/** Wstawiona wzmianka — moment na powiadomienie osoby albo dopięcie powiązania. */
|
|
1071
1378
|
readonly mentioned: _angular_core.OutputEmitterRef<KptMentionItem<unknown>>;
|
|
1072
1379
|
protected readonly i18n: KptI18n;
|
|
1073
|
-
protected readonly swatches:
|
|
1380
|
+
protected readonly swatches: readonly [{
|
|
1381
|
+
readonly color: "#000000";
|
|
1382
|
+
readonly name: "black";
|
|
1383
|
+
}, {
|
|
1384
|
+
readonly color: "#434343";
|
|
1385
|
+
readonly name: "darkGray";
|
|
1386
|
+
}, {
|
|
1387
|
+
readonly color: "#666666";
|
|
1388
|
+
readonly name: "gray";
|
|
1389
|
+
}, {
|
|
1390
|
+
readonly color: "#999999";
|
|
1391
|
+
readonly name: "midGray";
|
|
1392
|
+
}, {
|
|
1393
|
+
readonly color: "#b7b7b7";
|
|
1394
|
+
readonly name: "silver";
|
|
1395
|
+
}, {
|
|
1396
|
+
readonly color: "#cccccc";
|
|
1397
|
+
readonly name: "lightGray";
|
|
1398
|
+
}, {
|
|
1399
|
+
readonly color: "#ffffff";
|
|
1400
|
+
readonly name: "white";
|
|
1401
|
+
}, {
|
|
1402
|
+
readonly color: "#e11d48";
|
|
1403
|
+
readonly name: "red";
|
|
1404
|
+
}, {
|
|
1405
|
+
readonly color: "#ea580c";
|
|
1406
|
+
readonly name: "orange";
|
|
1407
|
+
}, {
|
|
1408
|
+
readonly color: "#ca8a04";
|
|
1409
|
+
readonly name: "yellow";
|
|
1410
|
+
}, {
|
|
1411
|
+
readonly color: "#16a34a";
|
|
1412
|
+
readonly name: "green";
|
|
1413
|
+
}, {
|
|
1414
|
+
readonly color: "#0891b2";
|
|
1415
|
+
readonly name: "cyan";
|
|
1416
|
+
}, {
|
|
1417
|
+
readonly color: "#2563eb";
|
|
1418
|
+
readonly name: "blue";
|
|
1419
|
+
}, {
|
|
1420
|
+
readonly color: "#7c3aed";
|
|
1421
|
+
readonly name: "violet";
|
|
1422
|
+
}];
|
|
1074
1423
|
private readonly editor;
|
|
1424
|
+
private readonly injector;
|
|
1075
1425
|
private savedRange;
|
|
1076
1426
|
protected readonly mentionOpen: _angular_core.WritableSignal<boolean>;
|
|
1077
1427
|
protected readonly mentionMatches: _angular_core.WritableSignal<readonly KptMentionItem<unknown>[]>;
|
|
@@ -1093,6 +1443,9 @@ declare class KptRichText implements FormValueControl<string> {
|
|
|
1093
1443
|
protected readonly gridRows: number[];
|
|
1094
1444
|
protected readonly gridCols: number[];
|
|
1095
1445
|
protected readonly menuOpen: _angular_core.WritableSignal<boolean>;
|
|
1446
|
+
protected readonly linkOpen: _angular_core.WritableSignal<boolean>;
|
|
1447
|
+
protected readonly linkDraft: _angular_core.WritableSignal<string>;
|
|
1448
|
+
protected readonly linkInputId: _angular_core.Signal<string>;
|
|
1096
1449
|
protected readonly menuPoint: _angular_core.WritableSignal<{
|
|
1097
1450
|
x: number;
|
|
1098
1451
|
y: number;
|
|
@@ -1120,6 +1473,15 @@ declare class KptRichText implements FormValueControl<string> {
|
|
|
1120
1473
|
protected readonly sections: _angular_core.Signal<KptRichTool[][]>;
|
|
1121
1474
|
constructor();
|
|
1122
1475
|
protected icon(item: KptRichTool): KptIconName;
|
|
1476
|
+
/**
|
|
1477
|
+
* Przystanek Tab paska: ostatnio użyte narzędzie, a gdy jest wyłączone albo go nie ma —
|
|
1478
|
+
* pierwsze dostępne. Dzięki temu `Tab` z paska idzie od razu do edytora, a nie przez kilkanaście
|
|
1479
|
+
* przycisków.
|
|
1480
|
+
*/
|
|
1481
|
+
private readonly lastTool;
|
|
1482
|
+
protected readonly toolStop: _angular_core.Signal<KptRichTool | null>;
|
|
1483
|
+
/** Strzałki po pasku (w RTL odwrócone), `Home`/`End` — skrajne; wyłączone narzędzia są pomijane. */
|
|
1484
|
+
protected onToolbarKeydown(event: KeyboardEvent): void;
|
|
1123
1485
|
protected aria(item: KptRichTool): string;
|
|
1124
1486
|
protected isActive(item: KptRichTool): boolean;
|
|
1125
1487
|
/** `aria-pressed` tylko dla przełączników — wcięcia są akcjami, nie stanem. */
|
|
@@ -1191,6 +1553,18 @@ declare class KptRichText implements FormValueControl<string> {
|
|
|
1191
1553
|
protected insertTable(rows: number, cols: number): void;
|
|
1192
1554
|
protected onContextMenu(event: MouseEvent): void;
|
|
1193
1555
|
protected closeMenu(): void;
|
|
1556
|
+
/** Klawiatura menu kontekstowego: strzałki, `Home`/`End`; `Escape`/`Tab` zamykają i wracają do tekstu. */
|
|
1557
|
+
protected onMenuKeydown(event: KeyboardEvent): void;
|
|
1558
|
+
/** Zamknięcie menu z powrotem fokusu (i kursora) do komórki, z której je otwarto. */
|
|
1559
|
+
private closeMenuToEditor;
|
|
1560
|
+
/** Menu tabeli z klawiatury: klawisz menu albo `Shift+F10` w komórce — jak natywne menu kontekstowe. */
|
|
1561
|
+
private openMenuFromKeyboard;
|
|
1562
|
+
protected swatchName(name: (typeof SWATCHES)[number]['name']): string;
|
|
1563
|
+
/** Okienko adresu zamiast `window.prompt()` — nazwane pole, `Enter` wstawia, `Escape` wraca do tekstu. */
|
|
1564
|
+
protected openLink(): void;
|
|
1565
|
+
protected onLinkAttach(): void;
|
|
1566
|
+
protected applyLink(): void;
|
|
1567
|
+
protected closeLink(refocus: boolean): void;
|
|
1194
1568
|
private ctxTable;
|
|
1195
1569
|
private afterTableOp;
|
|
1196
1570
|
protected insertColumn(dir: 'left' | 'right'): void;
|
|
@@ -1267,7 +1641,7 @@ declare class KptRichText implements FormValueControl<string> {
|
|
|
1267
1641
|
/** Deklaracje `style` z allowlisty; `null`, gdy nie zostaje nic. */
|
|
1268
1642
|
private sanitizeStyleAttr;
|
|
1269
1643
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptRichText, never>;
|
|
1270
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptRichText, "kpt-rich-text", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "toolbar": { "alias": "toolbar"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "maxListLevel": { "alias": "maxListLevel"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "mentions": { "alias": "mentions"; "required": false; "isSignal": true; }; "mentionLimit": { "alias": "mentionLimit"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "touch": "touch"; "mentioned": "mentioned"; }, never, never, true, never>;
|
|
1644
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptRichText, "kpt-rich-text", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "toolbar": { "alias": "toolbar"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "maxListLevel": { "alias": "maxListLevel"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "mentions": { "alias": "mentions"; "required": false; "isSignal": true; }; "mentionLimit": { "alias": "mentionLimit"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "touch": "touch"; "mentioned": "mentioned"; }, never, never, true, never>;
|
|
1271
1645
|
}
|
|
1272
1646
|
|
|
1273
1647
|
/** Wartość suwaka: pojedyncza liczba lub para `[min, max]` w trybie `range`. */
|
|
@@ -1293,10 +1667,24 @@ declare class KptSlider implements FormValueControl<KptSliderValue> {
|
|
|
1293
1667
|
readonly max: _angular_core.InputSignal<KptSliderValue | undefined>;
|
|
1294
1668
|
readonly step: _angular_core.InputSignal<number>;
|
|
1295
1669
|
readonly showValue: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1670
|
+
/** Jednostka za liczbą („ zł”, „%”, „ km”) — w pokazanej wartości i w `aria-valuetext`. */
|
|
1671
|
+
readonly suffix: _angular_core.InputSignal<string>;
|
|
1296
1672
|
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1673
|
+
/** Id elementu fokusowalnego; bez niego generowane (w `kpt-form-field` — `controlId` wrappera). */
|
|
1674
|
+
readonly id: _angular_core.InputSignal<string | null>;
|
|
1675
|
+
/** Nazwa dostępna, gdy kontrolki nie opisuje etykieta (`<label for>` albo `kpt-form-field`). */
|
|
1676
|
+
readonly ariaLabel: _angular_core.InputSignal<string | null>;
|
|
1297
1677
|
readonly invalid: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1298
1678
|
readonly touched: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1679
|
+
/** Stan nieprawidłowy pokazujemy dopiero po dotknięciu — jak natywne `:user-invalid`. */
|
|
1680
|
+
protected readonly showInvalid: _angular_core.Signal<boolean>;
|
|
1299
1681
|
readonly touch: _angular_core.OutputEmitterRef<void>;
|
|
1682
|
+
protected readonly i18n: KptI18n;
|
|
1683
|
+
protected readonly field: _konce_pt_angular.KptFieldA11y;
|
|
1684
|
+
/** Uchwyt zakresu bez etykiety pola: „Cena, Minimum” z `ariaLabel` albo samo „Minimum”. */
|
|
1685
|
+
protected thumbLabel(end: 'min' | 'max'): string | null;
|
|
1686
|
+
/** Uchwyt zakresu w `kpt-form-field`: etykieta pola + nazwa uchwytu. */
|
|
1687
|
+
protected thumbLabelledBy(end: 'min' | 'max'): string | null;
|
|
1300
1688
|
private toNum;
|
|
1301
1689
|
protected readonly minN: _angular_core.Signal<number>;
|
|
1302
1690
|
protected readonly maxN: _angular_core.Signal<number>;
|
|
@@ -1311,35 +1699,84 @@ declare class KptSlider implements FormValueControl<KptSliderValue> {
|
|
|
1311
1699
|
protected readonly lowPct: _angular_core.Signal<number>;
|
|
1312
1700
|
protected readonly highPct: _angular_core.Signal<number>;
|
|
1313
1701
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptSlider, never>;
|
|
1314
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptSlider, "kpt-slider", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "range": { "alias": "range"; "required": false; "isSignal": true; }; "min": { "alias": "min"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "step": { "alias": "step"; "required": false; "isSignal": true; }; "showValue": { "alias": "showValue"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "touch": "touch"; }, never, never, true, never>;
|
|
1702
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptSlider, "kpt-slider", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "range": { "alias": "range"; "required": false; "isSignal": true; }; "min": { "alias": "min"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "step": { "alias": "step"; "required": false; "isSignal": true; }; "showValue": { "alias": "showValue"; "required": false; "isSignal": true; }; "suffix": { "alias": "suffix"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "touch": "touch"; }, never, never, true, never>;
|
|
1315
1703
|
}
|
|
1316
1704
|
|
|
1705
|
+
/** Wypełnienie jednej gwiazdki. */
|
|
1706
|
+
type KptStarFill = 'full' | 'half' | 'empty';
|
|
1317
1707
|
/**
|
|
1318
1708
|
* Ocena gwiazdkami (rating) na Signal Forms.
|
|
1319
1709
|
*
|
|
1710
|
+
* Do edycji to grupa radiowa (`role="radiogroup"`, gwiazdki jako `role="radio"`): jeden przystanek
|
|
1711
|
+
* Tab, strzałki zmieniają ocenę o krok (w RTL odwrócone w poziomie), `Home`/`End` ustawiają
|
|
1712
|
+
* skrajne, `Delete`/`Backspace` zeruje. Klik w wybraną gwiazdkę też zeruje. Z `allowHalf` każda
|
|
1713
|
+
* gwiazdka ma dwie połówki — dwa osobne `radio` („3,5 z 5”), a krok strzałek to 0,5.
|
|
1714
|
+
* Tylko do odczytu (`readonly`) to obrazek z nazwą „4,3 z 5” — bez przycisków, które czytnik
|
|
1715
|
+
* ogłaszałby jako wyłączone; gwiazdki pokazują wartość zaokrągloną do połówki.
|
|
1716
|
+
*
|
|
1320
1717
|
* @example
|
|
1321
|
-
* <kpt-rating [formField]="f.score" [count]="5" />
|
|
1322
|
-
* <kpt-rating [value]="
|
|
1718
|
+
* <kpt-rating [formField]="f.score" [count]="5" ariaLabel="Ocena" />
|
|
1719
|
+
* <kpt-rating [(value)]="score" allowHalf ariaLabel="Ocena" />
|
|
1720
|
+
* <kpt-rating [value]="4.3" readonly />
|
|
1323
1721
|
*/
|
|
1324
1722
|
declare class KptRating implements FormValueControl<number> {
|
|
1325
1723
|
readonly value: _angular_core.ModelSignal<number>;
|
|
1326
1724
|
/** Liczba gwiazdek. */
|
|
1327
1725
|
readonly count: _angular_core.InputSignal<number>;
|
|
1726
|
+
/** Połówki gwiazdek: wartość co 0,5, każda połówka to osobne `radio`. */
|
|
1727
|
+
readonly allowHalf: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1328
1728
|
readonly readonly: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1329
1729
|
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1730
|
+
readonly required: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1731
|
+
readonly invalid: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1732
|
+
/** Id grupy; bez niego generowane (w `kpt-form-field` — `controlId` wrappera). */
|
|
1733
|
+
readonly id: _angular_core.InputSignal<string | null>;
|
|
1734
|
+
/** Nazwa dostępna grupy, gdy nie opisuje jej etykieta (`kpt-form-field`). */
|
|
1735
|
+
readonly ariaLabel: _angular_core.InputSignal<string | null>;
|
|
1330
1736
|
readonly touched: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1331
1737
|
readonly touch: _angular_core.OutputEmitterRef<void>;
|
|
1738
|
+
/** Stan nieprawidłowy pokazujemy dopiero po dotknięciu — jak natywne `:user-invalid`. */
|
|
1739
|
+
protected readonly showInvalid: _angular_core.Signal<boolean>;
|
|
1740
|
+
protected readonly field: _konce_pt_angular.KptFieldA11y;
|
|
1332
1741
|
protected readonly i18n: KptI18n;
|
|
1742
|
+
private readonly host;
|
|
1743
|
+
private readonly injector;
|
|
1333
1744
|
protected readonly hover: _angular_core.WritableSignal<number>;
|
|
1334
1745
|
protected readonly stars: _angular_core.Signal<number[]>;
|
|
1335
|
-
|
|
1746
|
+
private readonly step;
|
|
1747
|
+
/** Przystanek Tab: wybrana wartość, a bez oceny — pierwsza możliwa. */
|
|
1748
|
+
protected readonly tabStop: _angular_core.Signal<number>;
|
|
1749
|
+
/** Liczba w zapisie języka strony („3,5” po polsku). */
|
|
1750
|
+
private readonly numberFormat;
|
|
1751
|
+
/** Wartość tylko do odczytu na gwiazdkach — zaokrąglona do połówki (4,3 → 4,5 gwiazdki). */
|
|
1752
|
+
protected readonly displayValue: _angular_core.Signal<number>;
|
|
1753
|
+
/** Nazwa oceny tylko do odczytu, np. „4,3 z 5”; własne `ariaLabel` idzie przed nią. */
|
|
1754
|
+
protected readonly readonlyLabel: _angular_core.Signal<string>;
|
|
1755
|
+
protected starLabel(value: number): string;
|
|
1756
|
+
protected fillOf(star: number, shown: number): KptStarFill;
|
|
1757
|
+
/** Pola wyboru jednej gwiazdki: całość albo — z `allowHalf` — dwie połówki. */
|
|
1758
|
+
protected optionsOf(star: number): {
|
|
1759
|
+
value: number;
|
|
1760
|
+
part: 'full' | 'start' | 'end';
|
|
1761
|
+
}[];
|
|
1762
|
+
protected pick(value: number): void;
|
|
1763
|
+
protected onKeydown(event: KeyboardEvent): void;
|
|
1764
|
+
/** „Dotknięcie” dopiero przy wyjściu fokusu z całej grupy, nie przy przejściu między gwiazdkami. */
|
|
1765
|
+
protected onFocusOut(event: FocusEvent): void;
|
|
1336
1766
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptRating, never>;
|
|
1337
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptRating, "kpt-rating", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "count": { "alias": "count"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "touch": "touch"; }, never, never, true, never>;
|
|
1767
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptRating, "kpt-rating", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "count": { "alias": "count"; "required": false; "isSignal": true; }; "allowHalf": { "alias": "allowHalf"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "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; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "touch": "touch"; }, never, never, true, never>;
|
|
1338
1768
|
}
|
|
1339
1769
|
|
|
1770
|
+
/** Ikona pozycji listy: obrazek dla plików graficznych, spinacz dla pozostałych. */
|
|
1771
|
+
declare function fileIcon(file: File): string;
|
|
1340
1772
|
/**
|
|
1341
1773
|
* Wgrywanie plików (drag-drop + wybór). Wartość = File[]. Signal Forms.
|
|
1342
1774
|
*
|
|
1775
|
+
* Strefa to `role="button"` z jednym przystankiem Tab: `Enter` i spacja otwierają okno wyboru,
|
|
1776
|
+
* tak jak kliknięcie. Natywne `<input type="file">` jest ukryte, więc bez tego użytkownik
|
|
1777
|
+
* klawiatury nie miałby jak wybrać pliku. `disabled` wyjmuje strefę z kolejności Tab
|
|
1778
|
+
* i blokuje wybór; stan błędu widać dopiero po dotknięciu (`invalid && touched`).
|
|
1779
|
+
*
|
|
1343
1780
|
* @example
|
|
1344
1781
|
* <kpt-file-upload [formField]="f.files" accept="image/*" multiple />
|
|
1345
1782
|
*/
|
|
@@ -1353,6 +1790,12 @@ declare class KptFileUpload implements FormValueControl<File[]> {
|
|
|
1353
1790
|
readonly touch: _angular_core.OutputEmitterRef<void>;
|
|
1354
1791
|
protected readonly i18n: KptI18n;
|
|
1355
1792
|
protected readonly dragover: _angular_core.WritableSignal<boolean>;
|
|
1793
|
+
/** Błąd pokazujemy po dotknięciu — bramka żyje w prezentacji, nie w walidatorze. */
|
|
1794
|
+
protected readonly showError: _angular_core.Signal<boolean>;
|
|
1795
|
+
protected readonly iconOf: typeof fileIcon;
|
|
1796
|
+
protected open(input: HTMLInputElement): void;
|
|
1797
|
+
/** `Enter` / spacja na strefie — spacja bez `preventDefault` przewinęłaby stronę. */
|
|
1798
|
+
protected onKey(event: Event, input: HTMLInputElement): void;
|
|
1356
1799
|
protected onSelect(event: Event): void;
|
|
1357
1800
|
protected onDragOver(event: DragEvent): void;
|
|
1358
1801
|
protected onDrop(event: DragEvent): void;
|
|
@@ -1363,6 +1806,11 @@ declare class KptFileUpload implements FormValueControl<File[]> {
|
|
|
1363
1806
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptFileUpload, "kpt-file-upload", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "accept": { "alias": "accept"; "required": false; "isSignal": true; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "touch": "touch"; }, never, never, true, never>;
|
|
1364
1807
|
}
|
|
1365
1808
|
|
|
1809
|
+
/** Gotowy kolor z nazwą — nazwa trafia do `aria-label` próbki. */
|
|
1810
|
+
interface KptColorPreset {
|
|
1811
|
+
value: string;
|
|
1812
|
+
label: string;
|
|
1813
|
+
}
|
|
1366
1814
|
/**
|
|
1367
1815
|
* Wybór koloru (swatch + hex + presety) na Signal Forms. Wartość = hex, np. '#3b82f6'.
|
|
1368
1816
|
*
|
|
@@ -1371,14 +1819,37 @@ declare class KptFileUpload implements FormValueControl<File[]> {
|
|
|
1371
1819
|
*/
|
|
1372
1820
|
declare class KptColorPicker implements FormValueControl<string> {
|
|
1373
1821
|
readonly value: _angular_core.ModelSignal<string>;
|
|
1374
|
-
|
|
1822
|
+
/**
|
|
1823
|
+
* Paleta szybkiego wyboru: kody albo `{ value, label }`. Kod sam w sobie niewiele mówi
|
|
1824
|
+
* czytnikowi („#3b82f6”), więc własną paletę warto nazwać; domyślne kolory mają nazwy z i18n.
|
|
1825
|
+
*/
|
|
1826
|
+
readonly presets: _angular_core.InputSignal<readonly (string | KptColorPreset)[]>;
|
|
1375
1827
|
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1828
|
+
/** Id elementu fokusowalnego; bez niego generowane (w `kpt-form-field` — `controlId` wrappera). */
|
|
1829
|
+
readonly id: _angular_core.InputSignal<string | null>;
|
|
1830
|
+
/** Nazwa dostępna, gdy kontrolki nie opisuje etykieta (`<label for>` albo `kpt-form-field`). */
|
|
1831
|
+
readonly ariaLabel: _angular_core.InputSignal<string | null>;
|
|
1376
1832
|
readonly invalid: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1377
1833
|
readonly touched: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1834
|
+
/** Stan nieprawidłowy pokazujemy dopiero po dotknięciu — jak natywne `:user-invalid`. */
|
|
1835
|
+
protected readonly showInvalid: _angular_core.Signal<boolean>;
|
|
1378
1836
|
readonly touch: _angular_core.OutputEmitterRef<void>;
|
|
1837
|
+
protected readonly i18n: KptI18n;
|
|
1838
|
+
protected readonly field: _konce_pt_angular.KptFieldA11y;
|
|
1839
|
+
/** Tekst w polu hex, dopóki nie jest poprawnym kodem — wartość zmienia się dopiero na `#rrggbb`. */
|
|
1840
|
+
protected readonly hexDraft: _angular_core.WritableSignal<string | null>;
|
|
1841
|
+
protected readonly hexInvalid: _angular_core.Signal<boolean>;
|
|
1842
|
+
protected readonly presetList: _angular_core.Signal<{
|
|
1843
|
+
value: string;
|
|
1844
|
+
label: string;
|
|
1845
|
+
}[]>;
|
|
1846
|
+
protected isActive(color: string): boolean;
|
|
1847
|
+
protected pickPreset(color: string): void;
|
|
1379
1848
|
protected onHex(event: Event): void;
|
|
1849
|
+
/** Wyjście z pola z niepełnym kodem zostawia go widocznym i oznaczonym `aria-invalid`. */
|
|
1850
|
+
protected onHexBlur(): void;
|
|
1380
1851
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptColorPicker, never>;
|
|
1381
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptColorPicker, "kpt-color-picker", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "presets": { "alias": "presets"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "touch": "touch"; }, never, never, true, never>;
|
|
1852
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptColorPicker, "kpt-color-picker", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "presets": { "alias": "presets"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "touch": "touch"; }, never, never, true, never>;
|
|
1382
1853
|
}
|
|
1383
1854
|
|
|
1384
1855
|
/**
|
|
@@ -1389,6 +1860,11 @@ declare class KptColorPicker implements FormValueControl<string> {
|
|
|
1389
1860
|
* Wartość: `{ start, end }` — daty 'RRRR-MM-DD', datetime 'RRRR-MM-DDTHH:mm', godziny 'HH:mm'.
|
|
1390
1861
|
* Wymaga `import '@angular/cdk/overlay-prebuilt.css';`
|
|
1391
1862
|
*
|
|
1863
|
+
* Klawiatura jak w `kpt-datepicker`: `Enter`/`Spacja`/`↓` otwierają panel z fokusem na początku
|
|
1864
|
+
* zakresu (albo dziś), strzałki, `Home`/`End` i `PageUp`/`PageDown` (z `Shift` — rok) chodzą po
|
|
1865
|
+
* dniach przez wszystkie panele, `Tab` krąży w panelu, `Escape` i wybór końca oddają fokus polu.
|
|
1866
|
+
* Krańce i środek zakresu są w nazwie dnia („…, początek zakresu”), a wybór ogłasza region `polite`.
|
|
1867
|
+
*
|
|
1392
1868
|
* @example
|
|
1393
1869
|
* <kpt-date-range [formField]="f.period" />
|
|
1394
1870
|
* <kpt-date-range [visibleMonths]="2" [(value)]="period" />
|
|
@@ -1403,6 +1879,8 @@ declare class KptDateRange implements FormValueControl<KptDateRangeValue> {
|
|
|
1403
1879
|
/** Stan nieprawidłowy pokazujemy dopiero po dotknięciu pola — jak natywne `:user-invalid`. */
|
|
1404
1880
|
protected readonly showInvalid: _angular_core.Signal<boolean>;
|
|
1405
1881
|
readonly touch: _angular_core.OutputEmitterRef<void>;
|
|
1882
|
+
/** `div` z rolą nie dostaje nazwy z `label[for]` — stąd `aria-labelledby` na etykietę wrappera. */
|
|
1883
|
+
protected readonly field: _konce_pt_angular.KptFieldA11y;
|
|
1406
1884
|
/** Placeholder; bez wartości używa i18n (`dateRange.placeholder`). */
|
|
1407
1885
|
readonly placeholder: _angular_core.InputSignal<string | undefined>;
|
|
1408
1886
|
readonly displayFormat: _angular_core.InputSignal<"pl" | "iso">;
|
|
@@ -1411,6 +1889,14 @@ declare class KptDateRange implements FormValueControl<KptDateRangeValue> {
|
|
|
1411
1889
|
readonly visibleMonths: _angular_core.InputSignalWithTransform<number, unknown>;
|
|
1412
1890
|
readonly hourFormat: _angular_core.InputSignalWithTransform<number, unknown>;
|
|
1413
1891
|
readonly minuteStep: _angular_core.InputSignalWithTransform<number, unknown>;
|
|
1892
|
+
/** Najwcześniejsza dozwolona data 'RRRR-MM-DD' (włącznie). */
|
|
1893
|
+
readonly minDate: _angular_core.InputSignal<string | null>;
|
|
1894
|
+
/** Najpóźniejsza dozwolona data 'RRRR-MM-DD' (włącznie). */
|
|
1895
|
+
readonly maxDate: _angular_core.InputSignal<string | null>;
|
|
1896
|
+
/** Nazwa dostępna pola, gdy nie opisuje go `<label for>`. */
|
|
1897
|
+
readonly ariaLabel: _angular_core.InputSignal<string | null>;
|
|
1898
|
+
/** Id elementu fokusowalnego; bez niego generowane (w `kpt-form-field` — `controlId` wrappera). */
|
|
1899
|
+
readonly id: _angular_core.InputSignal<string | null>;
|
|
1414
1900
|
protected readonly i18n: KptI18n;
|
|
1415
1901
|
protected readonly weekdays: _angular_core.Signal<string[]>;
|
|
1416
1902
|
private readonly months;
|
|
@@ -1418,6 +1904,16 @@ declare class KptDateRange implements FormValueControl<KptDateRangeValue> {
|
|
|
1418
1904
|
protected readonly open: _angular_core.WritableSignal<boolean>;
|
|
1419
1905
|
private readonly today;
|
|
1420
1906
|
private readonly view;
|
|
1907
|
+
private readonly uid;
|
|
1908
|
+
protected readonly panelId: string;
|
|
1909
|
+
private readonly triggerEl;
|
|
1910
|
+
private readonly injector;
|
|
1911
|
+
/** Dzień z fokusem — jedyny przystanek Tab siatek dni (roving tabindex przez wszystkie panele). */
|
|
1912
|
+
protected readonly focusIso: _angular_core.WritableSignal<string>;
|
|
1913
|
+
/** Komunikat regionu `polite` po wyborze początku i całego zakresu. */
|
|
1914
|
+
protected readonly announcement: _angular_core.WritableSignal<string>;
|
|
1915
|
+
private rtl;
|
|
1916
|
+
private readonly dayFormat;
|
|
1421
1917
|
protected readonly startTime: _angular_core.WritableSignal<string>;
|
|
1422
1918
|
protected readonly endTime: _angular_core.WritableSignal<string>;
|
|
1423
1919
|
protected readonly timeEnd: _angular_core.WritableSignal<"start" | "end">;
|
|
@@ -1435,15 +1931,28 @@ declare class KptDateRange implements FormValueControl<KptDateRangeValue> {
|
|
|
1435
1931
|
* w drugim) i pasmo zakresu malowałoby się w obu miejscach.
|
|
1436
1932
|
*/
|
|
1437
1933
|
protected readonly panels: _angular_core.Signal<KptMonthPanel[]>;
|
|
1934
|
+
/** Pełna nazwa dnia z rolą w zakresie — kolor pasma nie jest jedynym nośnikiem informacji. */
|
|
1935
|
+
protected dayLabel(cell: KptRangeDayCell): string;
|
|
1936
|
+
protected onTriggerKeydown(event: KeyboardEvent): void;
|
|
1937
|
+
protected onAttach(): void;
|
|
1938
|
+
private focusActive;
|
|
1939
|
+
protected onPanelKeydown(event: KeyboardEvent): void;
|
|
1940
|
+
protected onDayKeydown(event: KeyboardEvent): void;
|
|
1941
|
+
/** Przesuwa okno paneli tak, żeby miesiąc dnia `iso` był widoczny — z najmniejszym skokiem. */
|
|
1942
|
+
private revealMonth;
|
|
1943
|
+
private closeAndFocus;
|
|
1438
1944
|
protected toggleOpen(): void;
|
|
1439
1945
|
protected close(): void;
|
|
1440
1946
|
protected selectDay(cell: KptRangeDayCell): void;
|
|
1947
|
+
private announce;
|
|
1441
1948
|
protected commit(): void;
|
|
1442
1949
|
protected prevMonth(): void;
|
|
1443
1950
|
protected nextMonth(): void;
|
|
1951
|
+
/** Strzałki ‹ ›: fokus zostaje na strzałce, ale przystanek siatki idzie za stroną. */
|
|
1952
|
+
private followPage;
|
|
1444
1953
|
protected clear(event: Event): void;
|
|
1445
1954
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptDateRange, never>;
|
|
1446
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptDateRange, "kpt-date-range", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "displayFormat": { "alias": "displayFormat"; "required": false; "isSignal": true; }; "mode": { "alias": "mode"; "required": false; "isSignal": true; }; "visibleMonths": { "alias": "visibleMonths"; "required": false; "isSignal": true; }; "hourFormat": { "alias": "hourFormat"; "required": false; "isSignal": true; }; "minuteStep": { "alias": "minuteStep"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "touch": "touch"; }, never, never, true, never>;
|
|
1955
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptDateRange, "kpt-date-range", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "displayFormat": { "alias": "displayFormat"; "required": false; "isSignal": true; }; "mode": { "alias": "mode"; "required": false; "isSignal": true; }; "visibleMonths": { "alias": "visibleMonths"; "required": false; "isSignal": true; }; "hourFormat": { "alias": "hourFormat"; "required": false; "isSignal": true; }; "minuteStep": { "alias": "minuteStep"; "required": false; "isSignal": true; }; "minDate": { "alias": "minDate"; "required": false; "isSignal": true; }; "maxDate": { "alias": "maxDate"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "touch": "touch"; }, never, never, true, never>;
|
|
1447
1956
|
}
|
|
1448
1957
|
|
|
1449
1958
|
/**
|
|
@@ -1451,6 +1960,12 @@ declare class KptDateRange implements FormValueControl<KptDateRangeValue> {
|
|
|
1451
1960
|
* `showButtons="false"` chowa strzałki — wariant do zakresów „od–do", gdzie krokowanie
|
|
1452
1961
|
* nie ma sensu, a pole ma wyglądać jak zwykłe `kpt-input` obok.
|
|
1453
1962
|
*
|
|
1963
|
+
* Pole to `role="spinbutton"` (z `aria-valuemin`/`max`/`now`, a przy `suffix` — `aria-valuetext`):
|
|
1964
|
+
* `↑`/`↓` zmieniają wartość o `step`, `PageUp`/`PageDown` o dziesięć kroków. Wpisywana liczba nie
|
|
1965
|
+
* jest przycinana w trakcie pisania (inaczej „150” przy `max` 99 stawało się „99”, zanim user skończył) —
|
|
1966
|
+
* granice działają przy krokowaniu i na `blur`. Przyciski `−`/`+` stoją poza kolejnością Tab i nie
|
|
1967
|
+
* zabierają fokusu polu.
|
|
1968
|
+
*
|
|
1454
1969
|
* Pod `[formField]` granic NIE bindujemy w szablonie — `[min]`/`[max]` obok `[formField]`
|
|
1455
1970
|
* to błąd kompilacji. Deklaruje je schemat (`min(path.qty, 0)`, `max(path.qty, 99)`),
|
|
1456
1971
|
* a dyrektywa `FormField` sama wstrzykuje je w wejścia `min`/`max`.
|
|
@@ -1470,20 +1985,37 @@ declare class KptInputNumber implements FormValueControl<number | null> {
|
|
|
1470
1985
|
/** Pokaż przyciski krokowania. `false` daje samo pole — wariant do zakresów „od–do". */
|
|
1471
1986
|
readonly showButtons: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1472
1987
|
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1988
|
+
readonly required: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1989
|
+
/** Id natywnego pola; bez niego generowane (w `kpt-form-field` — `controlId` wrappera). */
|
|
1990
|
+
readonly id: _angular_core.InputSignal<string | null>;
|
|
1991
|
+
/** Nazwa dostępna, gdy pola nie opisuje `<label for>`. */
|
|
1992
|
+
readonly ariaLabel: _angular_core.InputSignal<string | null>;
|
|
1473
1993
|
readonly invalid: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1474
1994
|
readonly touched: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1475
1995
|
/** Stan nieprawidłowy pokazujemy dopiero po dotknięciu pola — jak natywne `:user-invalid`. */
|
|
1476
1996
|
protected readonly showInvalid: _angular_core.Signal<boolean>;
|
|
1477
1997
|
readonly touch: _angular_core.OutputEmitterRef<void>;
|
|
1998
|
+
protected readonly field: _konce_pt_angular.KptFieldA11y;
|
|
1478
1999
|
protected readonly i18n: KptI18n;
|
|
2000
|
+
/**
|
|
2001
|
+
* Zapis liczby wg aktywnego języka (PL: `12,5`), bez separatorów tysięcy — pole przyjmuje i kropkę,
|
|
2002
|
+
* i przecinek, a grupowanie cyfr rozjechałoby się z tym, co user wpisuje.
|
|
2003
|
+
*/
|
|
2004
|
+
private readonly format;
|
|
1479
2005
|
protected readonly display: _angular_core.Signal<string>;
|
|
1480
2006
|
protected readonly canInc: _angular_core.Signal<boolean>;
|
|
1481
2007
|
protected readonly canDec: _angular_core.Signal<boolean>;
|
|
2008
|
+
/** Tekst w trakcie pisania — dopóki jest, pole pokazuje go zamiast sformatowanej wartości. */
|
|
2009
|
+
protected readonly draft: _angular_core.WritableSignal<string | null>;
|
|
1482
2010
|
protected onInput(event: Event): void;
|
|
2011
|
+
protected onKeydown(event: KeyboardEvent): void;
|
|
2012
|
+
/** Wyjście z pola: przycięcie do granic i sformatowany zapis. */
|
|
2013
|
+
protected onBlur(): void;
|
|
1483
2014
|
protected step_(dir: 1 | -1): void;
|
|
2015
|
+
private stepBy;
|
|
1484
2016
|
private clamp;
|
|
1485
2017
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptInputNumber, never>;
|
|
1486
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptInputNumber, "kpt-input-number", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "min": { "alias": "min"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "step": { "alias": "step"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "suffix": { "alias": "suffix"; "required": false; "isSignal": true; }; "showButtons": { "alias": "showButtons"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "touch": "touch"; }, never, never, true, never>;
|
|
2018
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptInputNumber, "kpt-input-number", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "min": { "alias": "min"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "step": { "alias": "step"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "suffix": { "alias": "suffix"; "required": false; "isSignal": true; }; "showButtons": { "alias": "showButtons"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "touch": "touch"; }, never, never, true, never>;
|
|
1487
2019
|
}
|
|
1488
2020
|
|
|
1489
2021
|
interface Strength {
|
|
@@ -1500,7 +2032,10 @@ declare class KptPassword implements FormValueControl<string> {
|
|
|
1500
2032
|
readonly value: _angular_core.ModelSignal<string>;
|
|
1501
2033
|
readonly placeholder: _angular_core.InputSignal<string>;
|
|
1502
2034
|
/** Id natywnego pola — pozwala związać etykietę przez `kpt-form-field [controlId]`. */
|
|
1503
|
-
|
|
2035
|
+
/** Id natywnego pola; bez niego generowane (w `kpt-form-field` — `controlId` wrappera). */
|
|
2036
|
+
readonly id: _angular_core.InputSignal<string | null>;
|
|
2037
|
+
/** Nazwa dostępna, gdy pola nie opisuje `<label for>`. */
|
|
2038
|
+
readonly ariaLabel: _angular_core.InputSignal<string | null>;
|
|
1504
2039
|
/**
|
|
1505
2040
|
* Podpowiedź autouzupełniania. Rejestracja i reset hasła wymagają `new-password` — inaczej
|
|
1506
2041
|
* menedżer haseł podstawia stare hasło zamiast zaproponować nowe.
|
|
@@ -1508,6 +2043,8 @@ declare class KptPassword implements FormValueControl<string> {
|
|
|
1508
2043
|
readonly autocomplete: _angular_core.InputSignal<string | null>;
|
|
1509
2044
|
readonly feedback: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1510
2045
|
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
2046
|
+
readonly readonly: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
2047
|
+
readonly required: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1511
2048
|
readonly invalid: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1512
2049
|
readonly touched: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1513
2050
|
/** Stan nieprawidłowy pokazujemy dopiero po dotknięciu pola — jak natywne `:user-invalid`. */
|
|
@@ -1515,9 +2052,13 @@ declare class KptPassword implements FormValueControl<string> {
|
|
|
1515
2052
|
readonly touch: _angular_core.OutputEmitterRef<void>;
|
|
1516
2053
|
protected readonly i18n: KptI18n;
|
|
1517
2054
|
protected readonly visible: _angular_core.WritableSignal<boolean>;
|
|
2055
|
+
protected readonly field: _konce_pt_angular.KptFieldA11y;
|
|
2056
|
+
protected readonly meterId: _angular_core.Signal<string>;
|
|
2057
|
+
/** Komunikat wrappera i — przy `feedback` — ocena siły, czytana razem z polem. */
|
|
2058
|
+
protected readonly describedBy: _angular_core.Signal<string | null>;
|
|
1518
2059
|
protected readonly strength: _angular_core.Signal<Strength>;
|
|
1519
2060
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptPassword, never>;
|
|
1520
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptPassword, "kpt-password", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "autocomplete": { "alias": "autocomplete"; "required": false; "isSignal": true; }; "feedback": { "alias": "feedback"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "touch": "touch"; }, never, never, true, never>;
|
|
2061
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptPassword, "kpt-password", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "autocomplete": { "alias": "autocomplete"; "required": false; "isSignal": true; }; "feedback": { "alias": "feedback"; "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; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "touch": "touch"; }, never, never, true, never>;
|
|
1521
2062
|
}
|
|
1522
2063
|
|
|
1523
2064
|
/**
|
|
@@ -1532,20 +2073,30 @@ declare class KptInputOtp implements FormValueControl<string> {
|
|
|
1532
2073
|
readonly length: _angular_core.InputSignal<number>;
|
|
1533
2074
|
readonly integerOnly: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1534
2075
|
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
2076
|
+
/** Id elementu fokusowalnego; bez niego generowane (w `kpt-form-field` — `controlId` wrappera). */
|
|
2077
|
+
readonly id: _angular_core.InputSignal<string | null>;
|
|
2078
|
+
/** Nazwa dostępna, gdy kontrolki nie opisuje etykieta (`<label for>` albo `kpt-form-field`). */
|
|
2079
|
+
readonly ariaLabel: _angular_core.InputSignal<string | null>;
|
|
1535
2080
|
readonly invalid: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1536
2081
|
readonly touched: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1537
2082
|
/** Stan nieprawidłowy pokazujemy dopiero po dotknięciu pola — jak natywne `:user-invalid`. */
|
|
1538
2083
|
protected readonly showInvalid: _angular_core.Signal<boolean>;
|
|
1539
2084
|
readonly touch: _angular_core.OutputEmitterRef<void>;
|
|
2085
|
+
protected readonly i18n: KptI18n;
|
|
2086
|
+
protected readonly field: _konce_pt_angular.KptFieldA11y;
|
|
1540
2087
|
protected readonly slots: _angular_core.Signal<number[]>;
|
|
1541
2088
|
protected charAt(i: number): string;
|
|
1542
2089
|
protected onInput(i: number, event: Event): void;
|
|
1543
2090
|
protected onKeydown(i: number, event: KeyboardEvent): void;
|
|
1544
2091
|
protected onPaste(event: ClipboardEvent): void;
|
|
2092
|
+
/** „Dotknięcie” dopiero przy wyjściu fokusu z całej grupy, nie przy przejściu między komórkami. */
|
|
2093
|
+
protected onFocusOut(event: FocusEvent): void;
|
|
2094
|
+
/** Wpisuje `text` od komórki `start` (bez spacji i — przy `integerOnly` — bez nie-cyfr). */
|
|
2095
|
+
private fillFrom;
|
|
1545
2096
|
private setChar;
|
|
1546
2097
|
private focusSibling;
|
|
1547
2098
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptInputOtp, never>;
|
|
1548
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptInputOtp, "kpt-input-otp", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "length": { "alias": "length"; "required": false; "isSignal": true; }; "integerOnly": { "alias": "integerOnly"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "touch": "touch"; }, never, never, true, never>;
|
|
2099
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptInputOtp, "kpt-input-otp", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "length": { "alias": "length"; "required": false; "isSignal": true; }; "integerOnly": { "alias": "integerOnly"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "touch": "touch"; }, never, never, true, never>;
|
|
1549
2100
|
}
|
|
1550
2101
|
|
|
1551
2102
|
/**
|
|
@@ -1561,18 +2112,26 @@ declare class KptChipsInput implements FormValueControl<string[]> {
|
|
|
1561
2112
|
readonly placeholder: _angular_core.InputSignal<string | undefined>;
|
|
1562
2113
|
readonly allowDuplicates: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1563
2114
|
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
2115
|
+
readonly required: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
2116
|
+
/** Id natywnego pola; bez niego generowane (w `kpt-form-field` — `controlId` wrappera). */
|
|
2117
|
+
readonly id: _angular_core.InputSignal<string | null>;
|
|
2118
|
+
/** Nazwa dostępna, gdy pola nie opisuje `<label for>`. */
|
|
2119
|
+
readonly ariaLabel: _angular_core.InputSignal<string | null>;
|
|
1564
2120
|
readonly invalid: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1565
2121
|
readonly touched: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1566
2122
|
/** Stan nieprawidłowy pokazujemy dopiero po dotknięciu pola — jak natywne `:user-invalid`. */
|
|
1567
2123
|
protected readonly showInvalid: _angular_core.Signal<boolean>;
|
|
1568
2124
|
readonly touch: _angular_core.OutputEmitterRef<void>;
|
|
2125
|
+
protected readonly field: _konce_pt_angular.KptFieldA11y;
|
|
1569
2126
|
protected readonly i18n: KptI18n;
|
|
1570
2127
|
protected readonly effectivePlaceholder: _angular_core.Signal<string>;
|
|
2128
|
+
/** Komunikat regionu `polite`: dodanie, usunięcie albo odrzucony duplikat. */
|
|
2129
|
+
protected readonly announcement: _angular_core.WritableSignal<string>;
|
|
1571
2130
|
protected onKeydown(event: KeyboardEvent): void;
|
|
1572
2131
|
protected commit(el: HTMLInputElement): void;
|
|
1573
2132
|
protected removeAt(index: number): void;
|
|
1574
2133
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptChipsInput, never>;
|
|
1575
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptChipsInput, "kpt-chips-input", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "allowDuplicates": { "alias": "allowDuplicates"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "touch": "touch"; }, never, never, true, never>;
|
|
2134
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptChipsInput, "kpt-chips-input", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "allowDuplicates": { "alias": "allowDuplicates"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "touch": "touch"; }, never, never, true, never>;
|
|
1576
2135
|
}
|
|
1577
2136
|
|
|
1578
2137
|
/**
|
|
@@ -1586,22 +2145,42 @@ declare class KptInputMask implements FormValueControl<string> {
|
|
|
1586
2145
|
readonly value: _angular_core.ModelSignal<string>;
|
|
1587
2146
|
readonly mask: _angular_core.InputSignal<string>;
|
|
1588
2147
|
readonly placeholder: _angular_core.InputSignal<string>;
|
|
2148
|
+
/**
|
|
2149
|
+
* Klawiatura ekranowa. Bez wartości wynika z maski: same tokeny `9` → `numeric`
|
|
2150
|
+
* (telefon, kod pocztowy, PESEL), inaczej `text`.
|
|
2151
|
+
*/
|
|
2152
|
+
readonly inputMode: _angular_core.InputSignal<string | null>;
|
|
2153
|
+
/** Podpowiedź autouzupełniania (`tel`, `postal-code`, `cc-number`…), żeby przeglądarka mogła wypełnić pole. */
|
|
2154
|
+
readonly autocomplete: _angular_core.InputSignal<string | null>;
|
|
1589
2155
|
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
2156
|
+
readonly required: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
2157
|
+
/** Id natywnego pola; bez niego generowane (w `kpt-form-field` — `controlId` wrappera). */
|
|
2158
|
+
readonly id: _angular_core.InputSignal<string | null>;
|
|
2159
|
+
/** Nazwa dostępna, gdy pola nie opisuje `<label for>`. */
|
|
2160
|
+
readonly ariaLabel: _angular_core.InputSignal<string | null>;
|
|
1590
2161
|
readonly invalid: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1591
2162
|
readonly touched: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1592
2163
|
/** Stan nieprawidłowy pokazujemy dopiero po dotknięciu pola — jak natywne `:user-invalid`. */
|
|
1593
2164
|
protected readonly showInvalid: _angular_core.Signal<boolean>;
|
|
1594
2165
|
readonly touch: _angular_core.OutputEmitterRef<void>;
|
|
2166
|
+
protected readonly field: _konce_pt_angular.KptFieldA11y;
|
|
2167
|
+
protected readonly effectiveInputMode: _angular_core.Signal<string | null>;
|
|
1595
2168
|
protected onInput(event: Event): void;
|
|
1596
2169
|
private applyMask;
|
|
1597
2170
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptInputMask, never>;
|
|
1598
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptInputMask, "kpt-input-mask", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "mask": { "alias": "mask"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "touch": "touch"; }, never, never, true, never>;
|
|
2171
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptInputMask, "kpt-input-mask", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "mask": { "alias": "mask"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "inputMode": { "alias": "inputMode"; "required": false; "isSignal": true; }; "autocomplete": { "alias": "autocomplete"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "touch": "touch"; }, never, never, true, never>;
|
|
1599
2172
|
}
|
|
1600
2173
|
|
|
1601
2174
|
/**
|
|
1602
2175
|
* Lista wyboru (listbox) na Signal Forms. Pojedynczy lub wielokrotny wybór, opcjonalny filtr.
|
|
1603
2176
|
* Wartość: `T` (single) lub `T[]` (multiple).
|
|
1604
2177
|
*
|
|
2178
|
+
* Klawiatura według wzorca WAI-ARIA „listbox”: lista to jeden przystanek Tab, a aktywną opcję
|
|
2179
|
+
* ogłasza `aria-activedescendant`. Strzałki, `Home`/`End`, `PageUp`/`PageDown` przesuwają aktywną
|
|
2180
|
+
* opcję (wyłączone są pomijane), pisanie liter skacze do kolejnej pasującej (bez względu na
|
|
2181
|
+
* diakrytyki), `Spacja`/`Enter` wybiera, a w trybie wielokrotnym `Ctrl`/`⌘`+`A` zaznacza wszystkie
|
|
2182
|
+
* widoczne. Pole filtra stoi przed listą; `↓` przenosi z niego fokus do listy.
|
|
2183
|
+
*
|
|
1605
2184
|
* @example
|
|
1606
2185
|
* <kpt-listbox [formField]="f.role" [options]="roles" filter />
|
|
1607
2186
|
* <kpt-listbox [(value)]="tags" [options]="tagOptions" multiple />
|
|
@@ -1612,18 +2191,39 @@ declare class KptListbox<T = unknown> implements FormValueControl<T | T[] | null
|
|
|
1612
2191
|
readonly multiple: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1613
2192
|
readonly filter: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1614
2193
|
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
2194
|
+
readonly required: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
2195
|
+
/** Id listy; bez niego generowane (w `kpt-form-field` — `controlId` wrappera). */
|
|
2196
|
+
readonly id: _angular_core.InputSignal<string | null>;
|
|
2197
|
+
/** Nazwa dostępna listy, gdy nie opisuje jej etykieta (`kpt-form-field`). */
|
|
2198
|
+
readonly ariaLabel: _angular_core.InputSignal<string | null>;
|
|
1615
2199
|
readonly invalid: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1616
2200
|
readonly touched: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1617
2201
|
/** Stan nieprawidłowy pokazujemy dopiero po dotknięciu pola — jak natywne `:user-invalid`. */
|
|
1618
2202
|
protected readonly showInvalid: _angular_core.Signal<boolean>;
|
|
1619
2203
|
readonly touch: _angular_core.OutputEmitterRef<void>;
|
|
2204
|
+
/** `div` z rolą nie dostaje nazwy z `label[for]` — stąd `aria-labelledby` na etykietę wrappera. */
|
|
2205
|
+
protected readonly field: _konce_pt_angular.KptFieldA11y;
|
|
1620
2206
|
protected readonly i18n: KptI18n;
|
|
1621
2207
|
protected readonly query: _angular_core.WritableSignal<string>;
|
|
2208
|
+
/** Filtr bez względu na wielkość liter i diakrytyki („lodz” znajduje „Łódź”). */
|
|
1622
2209
|
protected readonly visible: _angular_core.Signal<readonly KptOption<T>[]>;
|
|
2210
|
+
/** Aktywna opcja (indeks w `visible()`); `-1` = żadna. */
|
|
2211
|
+
protected readonly activeIndex: _angular_core.WritableSignal<number>;
|
|
2212
|
+
protected readonly activeOptionId: _angular_core.Signal<string | null>;
|
|
2213
|
+
private readonly disabledMap;
|
|
2214
|
+
private readonly typeahead;
|
|
2215
|
+
constructor();
|
|
2216
|
+
protected optionId(index: number): string;
|
|
1623
2217
|
protected isSelected(v: T): boolean;
|
|
1624
2218
|
protected toggle(v: T): void;
|
|
2219
|
+
protected pick(index: number): void;
|
|
2220
|
+
/** Wejście fokusem: aktywna zostaje wybrana opcja, a bez niej pierwsza dozwolona. */
|
|
2221
|
+
protected onFocus(): void;
|
|
2222
|
+
protected onQuery(text: string): void;
|
|
2223
|
+
protected onFilterKeydown(event: KeyboardEvent): void;
|
|
2224
|
+
protected onKeydown(event: KeyboardEvent): void;
|
|
1625
2225
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptListbox<any>, never>;
|
|
1626
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptListbox<any>, "kpt-listbox", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "filter": { "alias": "filter"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "touch": "touch"; }, never, never, true, never>;
|
|
2226
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptListbox<any>, "kpt-listbox", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "filter": { "alias": "filter"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "touch": "touch"; }, never, never, true, never>;
|
|
1627
2227
|
}
|
|
1628
2228
|
|
|
1629
2229
|
/**
|
|
@@ -1647,9 +2247,16 @@ declare class KptKnob implements FormValueControl<number> {
|
|
|
1647
2247
|
readonly suffix: _angular_core.InputSignal<string>;
|
|
1648
2248
|
readonly showValue: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1649
2249
|
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
2250
|
+
/** Id elementu fokusowalnego; bez niego generowane (w `kpt-form-field` — `controlId` wrappera). */
|
|
2251
|
+
readonly id: _angular_core.InputSignal<string | null>;
|
|
2252
|
+
/** Nazwa dostępna, gdy kontrolki nie opisuje etykieta (`<label for>` albo `kpt-form-field`). */
|
|
2253
|
+
readonly ariaLabel: _angular_core.InputSignal<string | null>;
|
|
1650
2254
|
readonly invalid: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1651
2255
|
readonly touched: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
2256
|
+
/** Stan nieprawidłowy pokazujemy dopiero po dotknięciu — jak natywne `:user-invalid`. */
|
|
2257
|
+
protected readonly showInvalid: _angular_core.Signal<boolean>;
|
|
1652
2258
|
readonly touch: _angular_core.OutputEmitterRef<void>;
|
|
2259
|
+
protected readonly field: _konce_pt_angular.KptFieldA11y;
|
|
1653
2260
|
private readonly startAngle;
|
|
1654
2261
|
private readonly sweep;
|
|
1655
2262
|
protected readonly rangePath: _angular_core.Signal<string>;
|
|
@@ -1661,10 +2268,12 @@ declare class KptKnob implements FormValueControl<number> {
|
|
|
1661
2268
|
private applyRatio;
|
|
1662
2269
|
protected onKeydown(event: KeyboardEvent): void;
|
|
1663
2270
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptKnob, never>;
|
|
1664
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptKnob, "kpt-knob", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "min": { "alias": "min"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "step": { "alias": "step"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "stroke": { "alias": "stroke"; "required": false; "isSignal": true; }; "suffix": { "alias": "suffix"; "required": false; "isSignal": true; }; "showValue": { "alias": "showValue"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "touch": "touch"; }, never, never, true, never>;
|
|
2271
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptKnob, "kpt-knob", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "min": { "alias": "min"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "step": { "alias": "step"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "stroke": { "alias": "stroke"; "required": false; "isSignal": true; }; "suffix": { "alias": "suffix"; "required": false; "isSignal": true; }; "showValue": { "alias": "showValue"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "touch": "touch"; }, never, never, true, never>;
|
|
1665
2272
|
}
|
|
1666
2273
|
|
|
1667
2274
|
type KptCardVariant = 'elevated' | 'outlined';
|
|
2275
|
+
/** Poziom nagłówka karty w strukturze strony. */
|
|
2276
|
+
type KptCardHeadingLevel = 1 | 2 | 3 | 4 | 5 | 6;
|
|
1668
2277
|
/**
|
|
1669
2278
|
* Karta Koncept UI — powierzchnia z wyniesieniem (elevated) lub obramowaniem (outlined).
|
|
1670
2279
|
* Opcjonalny nagłówek przez `header`; treść przez projekcję. Stopkę wstaw z atrybutem
|
|
@@ -1683,10 +2292,16 @@ declare class KptCard {
|
|
|
1683
2292
|
readonly variant: _angular_core.InputSignal<KptCardVariant>;
|
|
1684
2293
|
/** Opcjonalny tekst nagłówka. */
|
|
1685
2294
|
readonly header: _angular_core.InputSignal<string>;
|
|
2295
|
+
/**
|
|
2296
|
+
* Robi z `header` nagłówek strony (`role="heading"` z `aria-level`), żeby karta pojawiła się
|
|
2297
|
+
* w strukturze dokumentu. Bez tego `header` to sam tekst — część kart (np. kafelki statystyk)
|
|
2298
|
+
* nie powinna zaśmiecać spisu nagłówków.
|
|
2299
|
+
*/
|
|
2300
|
+
readonly headingLevel: _angular_core.InputSignal<KptCardHeadingLevel | null>;
|
|
1686
2301
|
/** Body bez wewnętrznego paddingu — dla układów zarządzających własnymi sekcjami. */
|
|
1687
2302
|
readonly flush: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1688
2303
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptCard, never>;
|
|
1689
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptCard, "kpt-card", never, { "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "header": { "alias": "header"; "required": false; "isSignal": true; }; "flush": { "alias": "flush"; "required": false; "isSignal": true; }; }, {}, never, ["*", "[kptCardFooter]"], true, never>;
|
|
2304
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptCard, "kpt-card", never, { "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "header": { "alias": "header"; "required": false; "isSignal": true; }; "headingLevel": { "alias": "headingLevel"; "required": false; "isSignal": true; }; "flush": { "alias": "flush"; "required": false; "isSignal": true; }; }, {}, never, ["*", "[kptCardFooter]"], true, never>;
|
|
1690
2305
|
}
|
|
1691
2306
|
|
|
1692
2307
|
type KptDividerOrientation = 'horizontal' | 'vertical';
|
|
@@ -1789,6 +2404,11 @@ declare class KptAppShell {
|
|
|
1789
2404
|
private static nextId;
|
|
1790
2405
|
private readonly breakpoints;
|
|
1791
2406
|
private readonly i18n;
|
|
2407
|
+
private readonly host;
|
|
2408
|
+
/** Element, który miał fokus przed otwarciem nakładki — zwykle przycisk menu. */
|
|
2409
|
+
private returnFocusTo;
|
|
2410
|
+
/** Stan nakładki z poprzedniego renderu; `null` przed pierwszym — wtedy fokusu nie ruszamy. */
|
|
2411
|
+
private overlayWasOpen;
|
|
1792
2412
|
/** Czy panel jest otwarty w układzie zadokowanym (oraz w wymuszonym trybie `over`). */
|
|
1793
2413
|
readonly sidenavOpen: _angular_core.ModelSignal<boolean>;
|
|
1794
2414
|
/**
|
|
@@ -2225,6 +2845,9 @@ declare class KptPanel {
|
|
|
2225
2845
|
readonly animated: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
2226
2846
|
readonly animationDuration: _angular_core.InputSignal<number>;
|
|
2227
2847
|
protected readonly i18n: KptI18n;
|
|
2848
|
+
protected readonly bodyId: string;
|
|
2849
|
+
/** Z nagłówkiem etykieta mówi, który panel zwija — na stronie z kilkoma panelami to jedyna wskazówka. */
|
|
2850
|
+
protected readonly toggleLabel: _angular_core.Signal<string>;
|
|
2228
2851
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptPanel, never>;
|
|
2229
2852
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptPanel, "kpt-panel", never, { "header": { "alias": "header"; "required": false; "isSignal": true; }; "toggleable": { "alias": "toggleable"; "required": false; "isSignal": true; }; "collapsed": { "alias": "collapsed"; "required": false; "isSignal": true; }; "animated": { "alias": "animated"; "required": false; "isSignal": true; }; "animationDuration": { "alias": "animationDuration"; "required": false; "isSignal": true; }; }, { "collapsed": "collapsedChange"; }, never, ["[kptPanelActions]", "*"], true, never>;
|
|
2230
2853
|
}
|
|
@@ -2250,6 +2873,10 @@ type KptSplitterOrientation = 'horizontal' | 'vertical';
|
|
|
2250
2873
|
* Splitter — dwa panele z przeciąganym uchwytem. Panele przez sloty `[kptSplitStart]` i `[kptSplitEnd]`.
|
|
2251
2874
|
* `horizontal` = panele obok siebie, `vertical` = jeden pod drugim.
|
|
2252
2875
|
*
|
|
2876
|
+
* Uchwyt to `role="separator"` z wartością (wzorzec WAI-ARIA „window splitter”): strzałki
|
|
2877
|
+
* przesuwają go o 2%, `Home`/`End` dosuwają do minimum i maksimum. `aria-orientation` opisuje
|
|
2878
|
+
* linię uchwytu, nie układ — przy panelach obok siebie linia jest pionowa.
|
|
2879
|
+
*
|
|
2253
2880
|
* @example
|
|
2254
2881
|
* <kpt-splitter orientation="horizontal" [(startSize)]="size">
|
|
2255
2882
|
* <div kptSplitStart>Lewy</div>
|
|
@@ -2262,12 +2889,16 @@ declare class KptSplitter {
|
|
|
2262
2889
|
/** Rozmiar pierwszego panelu w procentach (0–100). */
|
|
2263
2890
|
readonly startSize: _angular_core.ModelSignal<number>;
|
|
2264
2891
|
readonly minSize: _angular_core.InputSignal<number>;
|
|
2892
|
+
/** Nazwa uchwytu dla czytników ekranu; domyślnie `splitter.resize` ze słownika. */
|
|
2893
|
+
readonly ariaLabel: _angular_core.InputSignal<string>;
|
|
2894
|
+
protected readonly i18n: KptI18n;
|
|
2895
|
+
protected readonly startId: string;
|
|
2265
2896
|
protected readonly endSize: _angular_core.Signal<number>;
|
|
2266
2897
|
protected onPointer(event: PointerEvent): void;
|
|
2267
2898
|
protected onKeydown(event: KeyboardEvent): void;
|
|
2268
2899
|
private setSize;
|
|
2269
2900
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptSplitter, never>;
|
|
2270
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptSplitter, "kpt-splitter", never, { "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; "startSize": { "alias": "startSize"; "required": false; "isSignal": true; }; "minSize": { "alias": "minSize"; "required": false; "isSignal": true; }; }, { "startSize": "startSizeChange"; }, never, ["[kptSplitStart]", "[kptSplitEnd]"], true, never>;
|
|
2901
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptSplitter, "kpt-splitter", never, { "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; "startSize": { "alias": "startSize"; "required": false; "isSignal": true; }; "minSize": { "alias": "minSize"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, { "startSize": "startSizeChange"; }, never, ["[kptSplitStart]", "[kptSplitEnd]"], true, never>;
|
|
2271
2902
|
}
|
|
2272
2903
|
|
|
2273
2904
|
/**
|
|
@@ -2285,6 +2916,7 @@ declare class KptScrollTop {
|
|
|
2285
2916
|
private scroller;
|
|
2286
2917
|
constructor();
|
|
2287
2918
|
private currentTop;
|
|
2919
|
+
/** Przy `prefers-reduced-motion` skok zamiast płynnego przewijania. */
|
|
2288
2920
|
protected scrollUp(): void;
|
|
2289
2921
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptScrollTop, never>;
|
|
2290
2922
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptScrollTop, "kpt-scroll-top", never, { "threshold": { "alias": "threshold"; "required": false; "isSignal": true; }; "target": { "alias": "target"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
@@ -2293,6 +2925,11 @@ declare class KptScrollTop {
|
|
|
2293
2925
|
/**
|
|
2294
2926
|
* Obraz z opcjonalnym podglądem pełnoekranowym (zoom).
|
|
2295
2927
|
*
|
|
2928
|
+
* Z `preview` miniatura jest przyciskiem (osiągalnym z klawiatury), a podgląd otwiera się na
|
|
2929
|
+
* natywnym `<dialog>` przez `showModal()`: przeglądarka daje pułapkę fokusu, `Escape`, bezwładną
|
|
2930
|
+
* stronę i górną warstwę, więc podgląd nie gubi się w przodku z `transform`. Na czas podglądu
|
|
2931
|
+
* blokujemy przewijanie dokumentu, a po zamknięciu fokus wraca na miniaturę.
|
|
2932
|
+
*
|
|
2296
2933
|
* @example
|
|
2297
2934
|
* <kpt-image src="/foto.jpg" alt="Zdjęcie" preview width="240px" />
|
|
2298
2935
|
*/
|
|
@@ -2303,8 +2940,21 @@ declare class KptImage {
|
|
|
2303
2940
|
readonly preview: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
2304
2941
|
protected readonly i18n: KptI18n;
|
|
2305
2942
|
protected readonly open: _angular_core.WritableSignal<boolean>;
|
|
2943
|
+
private readonly dialog;
|
|
2944
|
+
private readonly trigger;
|
|
2945
|
+
/** Wartość `overflow` dokumentu sprzed otwarcia — oddajemy ją po zamknięciu. */
|
|
2946
|
+
private savedOverflow;
|
|
2947
|
+
/** Miniatura z `alt` mówi, co powiększa; bez niego — samą czynność. */
|
|
2948
|
+
protected readonly triggerLabel: _angular_core.Signal<string>;
|
|
2949
|
+
constructor();
|
|
2306
2950
|
protected openPreview(): void;
|
|
2307
2951
|
protected close(): void;
|
|
2952
|
+
/** `close` przychodzi z każdej drogi: `×`, `Escape`, tło. */
|
|
2953
|
+
protected onClosed(): void;
|
|
2954
|
+
/** Okno wypełnia cały ekran, więc kliknięcie w nie samo (a nie w zdjęcie) to kliknięcie w tło. */
|
|
2955
|
+
protected onDialogClick(event: MouseEvent): void;
|
|
2956
|
+
private lockScroll;
|
|
2957
|
+
private unlockScroll;
|
|
2308
2958
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptImage, never>;
|
|
2309
2959
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptImage, "kpt-image", never, { "src": { "alias": "src"; "required": true; "isSignal": true; }; "alt": { "alias": "alt"; "required": false; "isSignal": true; }; "width": { "alias": "width"; "required": false; "isSignal": true; }; "preview": { "alias": "preview"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
2310
2960
|
}
|
|
@@ -2325,14 +2975,24 @@ declare class KptMeterGroup {
|
|
|
2325
2975
|
/** Suma odniesienia; domyślnie suma wartości (100%). */
|
|
2326
2976
|
readonly max: _angular_core.InputSignal<number | undefined>;
|
|
2327
2977
|
readonly showLegend: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
2978
|
+
/** Nazwa paska dla czytników ekranu, np. „Miejsce na dysku”; domyślnie `meterGroup.label`. */
|
|
2979
|
+
readonly label: _angular_core.InputSignal<string>;
|
|
2980
|
+
/** Co pokazuje legenda przy etykiecie: udział procentowy albo samą wartość (z `unit`). */
|
|
2981
|
+
readonly legendValue: _angular_core.InputSignal<"percent" | "value">;
|
|
2982
|
+
/** Jednostka dopisywana do wartości — w legendzie (`legendValue="value"`) i w `aria-valuetext`. */
|
|
2983
|
+
readonly unit: _angular_core.InputSignal<string>;
|
|
2984
|
+
protected readonly i18n: KptI18n;
|
|
2985
|
+
/** Podział dla czytnika („Zdjęcia 42 GB, Filmy 28 GB…”) — sam `aria-valuenow` mówi tylko sumę. */
|
|
2986
|
+
protected readonly valueText: _angular_core.Signal<string>;
|
|
2328
2987
|
private readonly palette;
|
|
2329
2988
|
protected readonly sum: _angular_core.Signal<number>;
|
|
2330
2989
|
protected total(): number;
|
|
2331
2990
|
protected percent(item: KptMeterItem): number;
|
|
2332
2991
|
protected fallback(i: number): string;
|
|
2333
|
-
protected
|
|
2992
|
+
protected legendText(item: KptMeterItem): string;
|
|
2993
|
+
private withUnit;
|
|
2334
2994
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptMeterGroup, never>;
|
|
2335
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptMeterGroup, "kpt-meter-group", never, { "values": { "alias": "values"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "showLegend": { "alias": "showLegend"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
2995
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptMeterGroup, "kpt-meter-group", never, { "values": { "alias": "values"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "showLegend": { "alias": "showLegend"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "legendValue": { "alias": "legendValue"; "required": false; "isSignal": true; }; "unit": { "alias": "unit"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
2336
2996
|
}
|
|
2337
2997
|
|
|
2338
2998
|
interface KptAvatarItem {
|
|
@@ -2343,6 +3003,9 @@ interface KptAvatarItem {
|
|
|
2343
3003
|
/**
|
|
2344
3004
|
* Grupa nakładających się awatarów z licznikiem „+N". Buduje na `kpt-avatar`.
|
|
2345
3005
|
*
|
|
3006
|
+
* Z `label` grupa jest `role="group"` z nazwą („Członkowie projektu”), a licznik „+N” ma nazwę
|
|
3007
|
+
* „i 2 więcej” i podpowiedź z imionami ukrytych osób — sam „+2” nic czytnikowi nie mówi.
|
|
3008
|
+
*
|
|
2346
3009
|
* @example
|
|
2347
3010
|
* <kpt-avatar-group [avatars]="team" [max]="4" />
|
|
2348
3011
|
*/
|
|
@@ -2350,10 +3013,14 @@ declare class KptAvatarGroup {
|
|
|
2350
3013
|
readonly avatars: _angular_core.InputSignal<readonly KptAvatarItem[]>;
|
|
2351
3014
|
readonly max: _angular_core.InputSignal<number>;
|
|
2352
3015
|
readonly size: _angular_core.InputSignal<KptAvatarSize>;
|
|
3016
|
+
/** Nazwa grupy dla czytników ekranu, np. „Członkowie projektu”; bez niej grupa nie ma roli. */
|
|
3017
|
+
readonly label: _angular_core.InputSignal<string>;
|
|
3018
|
+
protected readonly i18n: KptI18n;
|
|
3019
|
+
protected readonly hiddenNames: _angular_core.Signal<string>;
|
|
2353
3020
|
protected readonly shown: _angular_core.Signal<KptAvatarItem[]>;
|
|
2354
3021
|
protected readonly overflow: _angular_core.Signal<number>;
|
|
2355
3022
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptAvatarGroup, never>;
|
|
2356
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptAvatarGroup, "kpt-avatar-group", never, { "avatars": { "alias": "avatars"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
3023
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptAvatarGroup, "kpt-avatar-group", never, { "avatars": { "alias": "avatars"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
2357
3024
|
}
|
|
2358
3025
|
|
|
2359
3026
|
/**
|
|
@@ -2368,8 +3035,13 @@ declare class KptEmpty {
|
|
|
2368
3035
|
readonly icon: _angular_core.InputSignal<string | null>;
|
|
2369
3036
|
readonly title: _angular_core.InputSignal<string>;
|
|
2370
3037
|
readonly description: _angular_core.InputSignal<string>;
|
|
3038
|
+
/**
|
|
3039
|
+
* Robi z tytułu nagłówek strony (`role="heading"` z `aria-level`), żeby pusty stan pojawił się
|
|
3040
|
+
* w strukturze dokumentu — np. gdy zastępuje całą sekcję. Bez tego tytuł to sam tekst.
|
|
3041
|
+
*/
|
|
3042
|
+
readonly headingLevel: _angular_core.InputSignal<2 | 1 | 4 | 3 | 5 | 6 | null>;
|
|
2371
3043
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptEmpty, never>;
|
|
2372
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptEmpty, "kpt-empty", never, { "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; "description": { "alias": "description"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
|
|
3044
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptEmpty, "kpt-empty", never, { "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; "description": { "alias": "description"; "required": false; "isSignal": true; }; "headingLevel": { "alias": "headingLevel"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
|
|
2373
3045
|
}
|
|
2374
3046
|
|
|
2375
3047
|
/**
|
|
@@ -2389,6 +3061,10 @@ declare class KptTab {
|
|
|
2389
3061
|
/**
|
|
2390
3062
|
* Zakładki (tabs) — przełączanie widoków. Treść zakładek renderowana leniwie.
|
|
2391
3063
|
*
|
|
3064
|
+
* Klawiatura według wzorca WAI-ARIA „tabs”: rząd zakładek to jeden przystanek Tab, strzałki
|
|
3065
|
+
* w lewo/prawo oraz `Home`/`End` przechodzą po zakładkach (z pominięciem wyłączonych) i od razu je
|
|
3066
|
+
* aktywują, a kolejny `Tab` prowadzi do panelu.
|
|
3067
|
+
*
|
|
2392
3068
|
* @example
|
|
2393
3069
|
* <kpt-tabs [(activeIndex)]="tab">
|
|
2394
3070
|
* <kpt-tab label="Ogólne">…</kpt-tab>
|
|
@@ -2404,10 +3080,16 @@ declare class KptTabs {
|
|
|
2404
3080
|
protected readonly inkX: _angular_core.WritableSignal<number>;
|
|
2405
3081
|
protected readonly inkW: _angular_core.WritableSignal<number>;
|
|
2406
3082
|
protected readonly direction: _angular_core.WritableSignal<number>;
|
|
3083
|
+
protected readonly baseId: string;
|
|
3084
|
+
/** Disabled każdej zakładki — wejście dla nawigacji strzałkami. */
|
|
3085
|
+
private readonly disabledMap;
|
|
3086
|
+
/** Jedyna zakładka w kolejności Tab: aktywna, a gdy ta jest wyłączona — pierwsza dostępna. */
|
|
3087
|
+
protected readonly tabStop: _angular_core.Signal<number>;
|
|
2407
3088
|
protected readonly activeTab: _angular_core.Signal<KptTab>;
|
|
2408
3089
|
protected readonly activePanels: _angular_core.Signal<KptTab[]>;
|
|
2409
3090
|
constructor();
|
|
2410
3091
|
protected measureInk(): void;
|
|
3092
|
+
protected onKeydown(event: KeyboardEvent): void;
|
|
2411
3093
|
protected select(index: number): void;
|
|
2412
3094
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptTabs, never>;
|
|
2413
3095
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptTabs, "kpt-tabs", never, { "activeIndex": { "alias": "activeIndex"; "required": false; "isSignal": true; }; "animated": { "alias": "animated"; "required": false; "isSignal": true; }; "animationDuration": { "alias": "animationDuration"; "required": false; "isSignal": true; }; }, { "activeIndex": "activeIndexChange"; }, ["tabs"], never, true, never>;
|
|
@@ -2415,12 +3097,18 @@ declare class KptTabs {
|
|
|
2415
3097
|
|
|
2416
3098
|
/**
|
|
2417
3099
|
* Panel akordeonu. Umieszczaj w `kpt-accordion`. Stan `expanded` jest dwukierunkowy.
|
|
3100
|
+
*
|
|
3101
|
+
* Nagłówek wskazuje treść przez `aria-controls`, a treść to `role="region"` nazwany nagłówkiem —
|
|
3102
|
+
* czytnik ogłasza wtedy nie tylko stan, ale i to, czego dotyczy.
|
|
2418
3103
|
*/
|
|
2419
3104
|
declare class KptAccordionPanel {
|
|
2420
3105
|
readonly title: _angular_core.InputSignal<string>;
|
|
2421
3106
|
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
2422
3107
|
readonly expanded: _angular_core.ModelSignal<boolean>;
|
|
2423
3108
|
private readonly accordion;
|
|
3109
|
+
private readonly uid;
|
|
3110
|
+
protected readonly headerId: string;
|
|
3111
|
+
protected readonly bodyId: string;
|
|
2424
3112
|
protected readonly animMs: _angular_core.Signal<string>;
|
|
2425
3113
|
protected toggle(): void;
|
|
2426
3114
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptAccordionPanel, never>;
|
|
@@ -2492,6 +3180,7 @@ declare class KptStepper {
|
|
|
2492
3180
|
readonly activeIndex: _angular_core.ModelSignal<number>;
|
|
2493
3181
|
readonly animated: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
2494
3182
|
readonly animationDuration: _angular_core.InputSignal<number>;
|
|
3183
|
+
protected readonly i18n: KptI18n;
|
|
2495
3184
|
protected readonly direction: _angular_core.WritableSignal<number>;
|
|
2496
3185
|
protected readonly activeStep: _angular_core.Signal<KptStep>;
|
|
2497
3186
|
protected readonly activePanels: _angular_core.Signal<KptStep[]>;
|
|
@@ -2878,12 +3567,21 @@ interface KptTreeNode<T = unknown> {
|
|
|
2878
3567
|
value?: T;
|
|
2879
3568
|
icon?: string;
|
|
2880
3569
|
children?: readonly KptTreeNode<T>[];
|
|
3570
|
+
/** Stan początkowy gałęzi; dalej rozwijaniem steruje już komponent. */
|
|
2881
3571
|
expanded?: boolean;
|
|
2882
3572
|
disabled?: boolean;
|
|
2883
3573
|
}
|
|
2884
3574
|
/**
|
|
2885
3575
|
* Drzewo hierarchiczne (rozwijanie, zaznaczanie, ikony). Dane przez `nodes`.
|
|
2886
3576
|
*
|
|
3577
|
+
* Klawiatura według wzorca WAI-ARIA „tree view”: jeden przystanek Tab na całe drzewo (roving
|
|
3578
|
+
* tabindex), strzałki po widocznych wierszach, → / ← rozwijają i zwijają, `Enter` / spacja
|
|
3579
|
+
* działają jak kliknięcie. Logika klawiszy siedzi w czystej funkcji `treeKeyAction`.
|
|
3580
|
+
*
|
|
3581
|
+
* Stan rozwinięcia trzyma komponent, a `expanded` z danych jest wyłącznie stanem początkowym —
|
|
3582
|
+
* komponent nie pisze do obiektów aplikacji (wcześniej to robił, przez co dwa drzewa na tych
|
|
3583
|
+
* samych węzłach rozwijały się razem). Port React robi to samo.
|
|
3584
|
+
*
|
|
2887
3585
|
* @example
|
|
2888
3586
|
* <kpt-tree [nodes]="tree" selectable [(selected)]="node" (nodeClick)="open($event)" />
|
|
2889
3587
|
*/
|
|
@@ -2892,13 +3590,30 @@ declare class KptTree<T = unknown> {
|
|
|
2892
3590
|
readonly selectable: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
2893
3591
|
readonly selected: _angular_core.ModelSignal<KptTreeNode<T> | null>;
|
|
2894
3592
|
readonly nodeClick: _angular_core.OutputEmitterRef<KptTreeNode<T>>;
|
|
2895
|
-
|
|
2896
|
-
private readonly
|
|
3593
|
+
private readonly host;
|
|
3594
|
+
private readonly injector;
|
|
3595
|
+
/**
|
|
3596
|
+
* Gałęzie przełączone przez użytkownika (węzeł → otwarta?). Węzeł spoza mapy ma stan
|
|
3597
|
+
* z `expanded` w danych — dzięki temu nowa tablica `nodes` przychodzi z własnym stanem początkowym.
|
|
3598
|
+
*/
|
|
3599
|
+
private readonly toggled;
|
|
3600
|
+
/** Wiersz, który ostatnio miał fokus — on jest przystankiem Tab. */
|
|
3601
|
+
protected readonly focused: _angular_core.WritableSignal<KptTreeNode<T> | null>;
|
|
3602
|
+
/** Widoczne wiersze w kolejności DOM — tyle widzi klawiatura. */
|
|
3603
|
+
private readonly rows;
|
|
3604
|
+
/**
|
|
3605
|
+
* Jedyny wiersz z `tabindex="0"`: ostatnio skupiony, a gdy go nie widać (zwinięty rodzic, nowe
|
|
3606
|
+
* dane) — zaznaczony, a w ostateczności pierwszy.
|
|
3607
|
+
*/
|
|
3608
|
+
protected readonly tabStop: _angular_core.Signal<KptTreeNode<T>>;
|
|
2897
3609
|
protected has(node: KptTreeNode<T>): boolean;
|
|
2898
3610
|
protected isOpen(node: KptTreeNode<T>): boolean;
|
|
2899
3611
|
protected isSelected(node: KptTreeNode<T>): boolean;
|
|
2900
|
-
protected toggle(node: KptTreeNode<T>, event
|
|
3612
|
+
protected toggle(node: KptTreeNode<T>, event?: Event): void;
|
|
2901
3613
|
protected onRow(node: KptTreeNode<T>): void;
|
|
3614
|
+
protected onKeydown(node: KptTreeNode<T>, event: KeyboardEvent): void;
|
|
3615
|
+
/** Fokus na wiersz po renderze — `tabindex` musi już wskazywać nowy przystanek. */
|
|
3616
|
+
private moveFocus;
|
|
2902
3617
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptTree<any>, never>;
|
|
2903
3618
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptTree<any>, "kpt-tree", never, { "nodes": { "alias": "nodes"; "required": false; "isSignal": true; }; "selectable": { "alias": "selectable"; "required": false; "isSignal": true; }; "selected": { "alias": "selected"; "required": false; "isSignal": true; }; }, { "selected": "selectedChange"; "nodeClick": "nodeClick"; }, never, never, true, never>;
|
|
2904
3619
|
}
|
|
@@ -2925,6 +3640,11 @@ declare class KptTimeline {
|
|
|
2925
3640
|
/**
|
|
2926
3641
|
* Karuzela slajdów. Dane przez `items`, szablon slajdu przez projekcję `<ng-template let-item>`.
|
|
2927
3642
|
*
|
|
3643
|
+
* Semantyka według wzorca WAI-ARIA „carousel” (bez autoodtwarzania): region z
|
|
3644
|
+
* `aria-roledescription="karuzela"`, każdy slajd to grupa „Slajd 2 z 4”, a slajdy poza widokiem są
|
|
3645
|
+
* `inert` — `Tab` i czytnik ich nie widzą. Zmiana slajdu jest ogłaszana uprzejmie (`aria-live`
|
|
3646
|
+
* na torze). Strzałki na końcach dostają `aria-disabled` zamiast `disabled`, żeby nie zgubić fokusu.
|
|
3647
|
+
*
|
|
2928
3648
|
* @example
|
|
2929
3649
|
* <kpt-carousel [items]="photos">
|
|
2930
3650
|
* <ng-template let-photo><img [src]="photo" style="width:100%" /></ng-template>
|
|
@@ -2933,13 +3653,17 @@ declare class KptTimeline {
|
|
|
2933
3653
|
declare class KptCarousel<T = unknown> {
|
|
2934
3654
|
readonly items: _angular_core.InputSignal<readonly T[]>;
|
|
2935
3655
|
readonly activeIndex: _angular_core.ModelSignal<number>;
|
|
3656
|
+
/** Nazwa regionu dla czytników ekranu, np. „Nowości”; domyślnie `carousel.label`. */
|
|
3657
|
+
readonly label: _angular_core.InputSignal<string>;
|
|
2936
3658
|
protected readonly i18n: KptI18n;
|
|
2937
3659
|
protected readonly slideTpl: _angular_core.Signal<TemplateRef<any>>;
|
|
3660
|
+
protected readonly atStart: _angular_core.Signal<boolean>;
|
|
3661
|
+
protected readonly atEnd: _angular_core.Signal<boolean>;
|
|
2938
3662
|
next(): void;
|
|
2939
3663
|
prev(): void;
|
|
2940
3664
|
goTo(index: number): void;
|
|
2941
3665
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptCarousel<any>, never>;
|
|
2942
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptCarousel<any>, "kpt-carousel", never, { "items": { "alias": "items"; "required": false; "isSignal": true; }; "activeIndex": { "alias": "activeIndex"; "required": false; "isSignal": true; }; }, { "activeIndex": "activeIndexChange"; }, ["slideTpl"], never, true, never>;
|
|
3666
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptCarousel<any>, "kpt-carousel", never, { "items": { "alias": "items"; "required": false; "isSignal": true; }; "activeIndex": { "alias": "activeIndex"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; }, { "activeIndex": "activeIndexChange"; }, ["slideTpl"], never, true, never>;
|
|
2943
3667
|
}
|
|
2944
3668
|
|
|
2945
3669
|
/**
|
|
@@ -2994,6 +3718,10 @@ type KptPickListSide = 'source' | 'target';
|
|
|
2994
3718
|
* Dwuklik przerzuca pojedynczy element na drugą stronę; z `dragdrop` dochodzi przeciąganie
|
|
2995
3719
|
* (porządkowanie wewnątrz panelu i przenoszenie na konkretną pozycję drugiego panelu).
|
|
2996
3720
|
*
|
|
3721
|
+
* Każda lista to `listbox` z wielokrotnym wyborem i jednym przystankiem Tab (roving tabindex):
|
|
3722
|
+
* strzałki / `Home` / `End` przechodzą po pozycjach, spacja zaznacza, `Enter` przenosi pozycję
|
|
3723
|
+
* na drugą stronę (jak dwuklik). Przyciski przenoszenia działają na tym samym zaznaczeniu.
|
|
3724
|
+
*
|
|
2997
3725
|
* @example
|
|
2998
3726
|
* <kpt-pick-list [(source)]="available" [(target)]="selected" sourceHeader="Dostępne" targetHeader="Wybrane" dragdrop>
|
|
2999
3727
|
* <ng-template let-item>{{ item.name }}</ng-template>
|
|
@@ -3014,6 +3742,11 @@ declare class KptPickList<T = unknown> {
|
|
|
3014
3742
|
protected readonly effectiveTargetHeader: _angular_core.Signal<string>;
|
|
3015
3743
|
protected readonly selSource: WritableSignal<Set<T>>;
|
|
3016
3744
|
protected readonly selTarget: WritableSignal<Set<T>>;
|
|
3745
|
+
private readonly host;
|
|
3746
|
+
private readonly injector;
|
|
3747
|
+
/** Pozycja, która ostatnio miała fokus w każdej liście — ona jest przystankiem Tab. */
|
|
3748
|
+
private readonly focusSource;
|
|
3749
|
+
private readonly focusTarget;
|
|
3017
3750
|
/** Przeciągany element — strona i pozycja w jej tablicy. */
|
|
3018
3751
|
protected readonly drag: WritableSignal<{
|
|
3019
3752
|
side: KptPickListSide;
|
|
@@ -3031,6 +3764,12 @@ declare class KptPickList<T = unknown> {
|
|
|
3031
3764
|
protected headerOf(side: KptPickListSide): string;
|
|
3032
3765
|
protected isDragging(side: KptPickListSide, index: number): boolean;
|
|
3033
3766
|
protected isOver(side: KptPickListSide, index: number): boolean;
|
|
3767
|
+
/** Przystanek Tab listy — ostatnio skupiona pozycja, przycięta do długości listy. */
|
|
3768
|
+
protected tabIndexOf(side: KptPickListSide): number;
|
|
3769
|
+
protected focusOf(side: KptPickListSide): WritableSignal<number>;
|
|
3770
|
+
protected onItemKeydown(side: KptPickListSide, index: number, item: T, event: KeyboardEvent): void;
|
|
3771
|
+
/** Fokus na pozycję po renderze — `tabindex` musi już wskazywać nowy przystanek. */
|
|
3772
|
+
private focusItem;
|
|
3034
3773
|
private modelOf;
|
|
3035
3774
|
private selectionSignal;
|
|
3036
3775
|
private other;
|
|
@@ -3055,6 +3794,10 @@ declare class KptPickList<T = unknown> {
|
|
|
3055
3794
|
* Szablon elementu przez projekcję `<ng-template let-item>`.
|
|
3056
3795
|
* Z `dragdrop` pozycje przestawia się także przeciąganiem.
|
|
3057
3796
|
*
|
|
3797
|
+
* Lista to `listbox` z jednym przystankiem Tab (roving tabindex), w którym zaznaczenie idzie
|
|
3798
|
+
* za fokusem: strzałki / `Home` / `End` wybierają pozycję, `Alt`+↑/↓ przestawia ją o jedno
|
|
3799
|
+
* miejsce (fokus jedzie razem z nią). Przyciski w górę / w dół działają jak dotąd.
|
|
3800
|
+
*
|
|
3058
3801
|
* @example
|
|
3059
3802
|
* <kpt-order-list [(items)]="tasks" header="Kolejność" dragdrop>
|
|
3060
3803
|
* <ng-template let-item>{{ item.name }}</ng-template>
|
|
@@ -3068,6 +3811,13 @@ declare class KptOrderList<T = unknown> {
|
|
|
3068
3811
|
protected readonly i18n: KptI18n;
|
|
3069
3812
|
protected readonly itemTpl: _angular_core.Signal<TemplateRef<any>>;
|
|
3070
3813
|
protected readonly selected: _angular_core.WritableSignal<number | null>;
|
|
3814
|
+
private readonly host;
|
|
3815
|
+
private readonly injector;
|
|
3816
|
+
/** Przystanek Tab: zaznaczona pozycja albo pierwsza. */
|
|
3817
|
+
protected tabStop(): number;
|
|
3818
|
+
protected onItemKeydown(index: number, event: KeyboardEvent): void;
|
|
3819
|
+
/** Fokus na pozycję po renderze — `tabindex` musi już wskazywać nowy przystanek. */
|
|
3820
|
+
private focusItem;
|
|
3071
3821
|
/** Indeks przeciąganej pozycji; `null` gdy nic nie jest przeciągane. */
|
|
3072
3822
|
protected readonly dragIndex: _angular_core.WritableSignal<number | null>;
|
|
3073
3823
|
/** Indeks pozycji pod kursorem — rysuje wskaźnik miejsca upuszczenia. */
|
|
@@ -3093,6 +3843,11 @@ interface KptGalleriaItem {
|
|
|
3093
3843
|
/**
|
|
3094
3844
|
* Galleria — duży podgląd obrazu z paskiem miniatur i nawigacją.
|
|
3095
3845
|
*
|
|
3846
|
+
* Klawiatura: na całej galerii strzałki w lewo/prawo przechodzą do sąsiedniego obrazu (w RTL
|
|
3847
|
+
* odwrotnie), `Home`/`End` — do pierwszego/ostatniego; gdy fokus stoi na miniaturze, idzie za
|
|
3848
|
+
* aktywną. Miniatura ma nazwę z `alt` obrazu i `aria-current` na aktywnej, a zmiana obrazu jest
|
|
3849
|
+
* ogłaszana uprzejmie („Obraz 2 z 4: …”) — dopiero po działaniu użytkownika, nie przy starcie.
|
|
3850
|
+
*
|
|
3096
3851
|
* @example
|
|
3097
3852
|
* <kpt-galleria [items]="photos" [(activeIndex)]="idx" />
|
|
3098
3853
|
*/
|
|
@@ -3102,8 +3857,15 @@ declare class KptGalleria {
|
|
|
3102
3857
|
readonly showThumbnails: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
3103
3858
|
protected readonly i18n: KptI18n;
|
|
3104
3859
|
protected readonly current: _angular_core.Signal<KptGalleriaItem>;
|
|
3860
|
+
private readonly host;
|
|
3861
|
+
private readonly thumbs;
|
|
3862
|
+
/** Ogłoszenie dopiero po działaniu użytkownika — przy starcie region ma milczeć. */
|
|
3863
|
+
private readonly userMoved;
|
|
3864
|
+
protected readonly announcement: _angular_core.Signal<string>;
|
|
3105
3865
|
protected next(): void;
|
|
3106
3866
|
protected prev(): void;
|
|
3867
|
+
protected select(index: number): void;
|
|
3868
|
+
protected onKeydown(event: KeyboardEvent): void;
|
|
3107
3869
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptGalleria, never>;
|
|
3108
3870
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptGalleria, "kpt-galleria", never, { "items": { "alias": "items"; "required": false; "isSignal": true; }; "activeIndex": { "alias": "activeIndex"; "required": false; "isSignal": true; }; "showThumbnails": { "alias": "showThumbnails"; "required": false; "isSignal": true; }; }, { "activeIndex": "activeIndexChange"; }, never, never, true, never>;
|
|
3109
3871
|
}
|
|
@@ -3112,6 +3874,10 @@ type KptAlertVariant = 'info' | 'success' | 'warning' | 'danger';
|
|
|
3112
3874
|
/**
|
|
3113
3875
|
* Komunikat inline (alert). Warianty info/success/warning/danger, opcjonalny tytuł i zamykanie.
|
|
3114
3876
|
*
|
|
3877
|
+
* Rola idzie za wagą komunikatu: `info` i `success` to `role="status"` (czytnik ogłosi je uprzejmie,
|
|
3878
|
+
* nie przerywając), `warning` i `danger` — `role="alert"` (natychmiast). `visible` to model
|
|
3879
|
+
* dwukierunkowy, więc zamknięty alert da się pokazać ponownie bez odtwarzania go pod `@if`.
|
|
3880
|
+
*
|
|
3115
3881
|
* @example
|
|
3116
3882
|
* <kpt-alert variant="success" title="Zapisano">Zmiany zostały zapisane.</kpt-alert>
|
|
3117
3883
|
*/
|
|
@@ -3119,13 +3885,15 @@ declare class KptAlert {
|
|
|
3119
3885
|
readonly variant: _angular_core.InputSignal<KptAlertVariant>;
|
|
3120
3886
|
readonly title: _angular_core.InputSignal<string>;
|
|
3121
3887
|
readonly dismissible: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
3888
|
+
/** Widoczność, dwukierunkowo — `×` ustawia `false`, aplikacja może przywrócić `true`. */
|
|
3889
|
+
readonly visible: _angular_core.ModelSignal<boolean>;
|
|
3122
3890
|
readonly closed: _angular_core.OutputEmitterRef<void>;
|
|
3123
3891
|
protected readonly i18n: KptI18n;
|
|
3124
|
-
protected
|
|
3892
|
+
protected role(): 'status' | 'alert';
|
|
3125
3893
|
protected iconName(): KptIconName;
|
|
3126
3894
|
protected dismiss(): void;
|
|
3127
3895
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptAlert, never>;
|
|
3128
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptAlert, "kpt-alert", never, { "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; "dismissible": { "alias": "dismissible"; "required": false; "isSignal": true; }; }, { "closed": "closed"; }, never, ["*"], true, never>;
|
|
3896
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptAlert, "kpt-alert", never, { "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; "dismissible": { "alias": "dismissible"; "required": false; "isSignal": true; }; "visible": { "alias": "visible"; "required": false; "isSignal": true; }; }, { "visible": "visibleChange"; "closed": "closed"; }, never, ["*"], true, never>;
|
|
3129
3897
|
}
|
|
3130
3898
|
|
|
3131
3899
|
/** Szerokość okna. `md` to wartość domyślna i zarazem jedyna, jaką okno miało wcześniej. */
|
|
@@ -3155,6 +3923,16 @@ declare class KptDialog {
|
|
|
3155
3923
|
readonly size: _angular_core.InputSignal<KptDialogSize>;
|
|
3156
3924
|
/** Pozwala zamknąć klawiszem Esc / przyciskiem ×. */
|
|
3157
3925
|
readonly dismissible: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
3926
|
+
/** Nazwa okna bez `header` — z nagłówkiem nazwą jest sam nagłówek (`aria-labelledby`). */
|
|
3927
|
+
readonly ariaLabel: _angular_core.InputSignal<string>;
|
|
3928
|
+
/** `id` elementu z opisem okna (`aria-describedby`), np. treści pytania. */
|
|
3929
|
+
readonly ariaDescribedby: _angular_core.InputSignal<string | null>;
|
|
3930
|
+
/**
|
|
3931
|
+
* `role="alertdialog"` — dla okna, które przerywa pracę i wymaga odpowiedzi (potwierdzenie,
|
|
3932
|
+
* ostrzeżenie). Czytnik od razu odczytuje wtedy opis z `ariaDescribedby`.
|
|
3933
|
+
*/
|
|
3934
|
+
readonly alert: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
3935
|
+
protected readonly titleId: string;
|
|
3158
3936
|
protected readonly i18n: KptI18n;
|
|
3159
3937
|
private readonly dialogRef;
|
|
3160
3938
|
private readonly overlayContainer;
|
|
@@ -3173,9 +3951,14 @@ declare class KptDialog {
|
|
|
3173
3951
|
private releaseOverlayContainer;
|
|
3174
3952
|
protected onCancel(event: Event): void;
|
|
3175
3953
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptDialog, never>;
|
|
3176
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptDialog, "kpt-dialog", never, { "open": { "alias": "open"; "required": false; "isSignal": true; }; "header": { "alias": "header"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "dismissible": { "alias": "dismissible"; "required": false; "isSignal": true; }; }, { "open": "openChange"; }, never, ["*", "[kptDialogFooter]"], true, never>;
|
|
3954
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptDialog, "kpt-dialog", never, { "open": { "alias": "open"; "required": false; "isSignal": true; }; "header": { "alias": "header"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "dismissible": { "alias": "dismissible"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "ariaDescribedby": { "alias": "ariaDescribedby"; "required": false; "isSignal": true; }; "alert": { "alias": "alert"; "required": false; "isSignal": true; }; }, { "open": "openChange"; }, never, ["*", "[kptDialogFooter]"], true, never>;
|
|
3177
3955
|
}
|
|
3178
3956
|
|
|
3957
|
+
/** Przycisk akcji w toaście, np. „Cofnij”. Kliknięcie uruchamia `run` i zamyka toast. */
|
|
3958
|
+
interface KptToastAction {
|
|
3959
|
+
label: string;
|
|
3960
|
+
run: () => void;
|
|
3961
|
+
}
|
|
3179
3962
|
interface KptToast {
|
|
3180
3963
|
id: number;
|
|
3181
3964
|
message: string;
|
|
@@ -3183,16 +3966,23 @@ interface KptToast {
|
|
|
3183
3966
|
variant: KptAlertVariant;
|
|
3184
3967
|
/** Czas życia w ms; 0 = bez auto-zamykania. */
|
|
3185
3968
|
duration: number;
|
|
3969
|
+
action?: KptToastAction;
|
|
3186
3970
|
}
|
|
3187
3971
|
type KptToastOptions = Partial<Omit<KptToast, 'id' | 'message'>>;
|
|
3188
3972
|
/**
|
|
3189
3973
|
* Serwis powiadomień (toastów). Wstrzyknij i wywołuj `show`/`success`/`error`/...;
|
|
3190
3974
|
* umieść `<kpt-toast-container />` raz w aplikacji, aby je renderować.
|
|
3975
|
+
*
|
|
3976
|
+
* Liczniki da się wstrzymać (`pause()`) i wznowić (`resume()`) — kontener robi to, gdy wskaźnik
|
|
3977
|
+
* albo fokus jest na toastach, żeby nikt nie musiał ścigać znikającego komunikatu (WCAG 2.2.1).
|
|
3978
|
+
* Wznowienie odlicza tylko pozostały czas, nie cały od nowa.
|
|
3191
3979
|
*/
|
|
3192
3980
|
declare class KptToastService {
|
|
3193
3981
|
private readonly _toasts;
|
|
3194
3982
|
readonly toasts: _angular_core.Signal<KptToast[]>;
|
|
3195
3983
|
private seq;
|
|
3984
|
+
private readonly timers;
|
|
3985
|
+
private paused;
|
|
3196
3986
|
show(message: string, options?: KptToastOptions): number;
|
|
3197
3987
|
info(message: string, options?: KptToastOptions): number;
|
|
3198
3988
|
success(message: string, options?: KptToastOptions): number;
|
|
@@ -3200,6 +3990,11 @@ declare class KptToastService {
|
|
|
3200
3990
|
error(message: string, options?: KptToastOptions): number;
|
|
3201
3991
|
dismiss(id: number): void;
|
|
3202
3992
|
clear(): void;
|
|
3993
|
+
/** Wstrzymuje wszystkie liczniki; toasty dodane w tym czasie też czekają. */
|
|
3994
|
+
pause(): void;
|
|
3995
|
+
/** Wznawia liczniki od pozostałego czasu. */
|
|
3996
|
+
resume(): void;
|
|
3997
|
+
private start;
|
|
3203
3998
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptToastService, never>;
|
|
3204
3999
|
static ɵprov: _angular_core.ɵɵInjectableDeclaration<KptToastService>;
|
|
3205
4000
|
}
|
|
@@ -3207,13 +4002,34 @@ declare class KptToastService {
|
|
|
3207
4002
|
/**
|
|
3208
4003
|
* Kontener renderujący toasty z `KptToastService`. Umieść raz w aplikacji
|
|
3209
4004
|
* (np. w komponencie głównym): `<kpt-toast-container />`.
|
|
4005
|
+
*
|
|
4006
|
+
* Ogłaszanie idzie przez dwa stałe, niewidoczne regiony na żywo — uprzejmy dla zwykłych toastów
|
|
4007
|
+
* i natychmiastowy dla błędów — a nie przez same toasty: region musi istnieć, zanim pojawi się
|
|
4008
|
+
* w nim treść, a zagnieżdżone regiony część czytników ogłasza dwa razy. Gdy wskaźnik albo fokus
|
|
4009
|
+
* jest na toastach, liczniki stoją, więc komunikat nie znika w trakcie czytania.
|
|
3210
4010
|
*/
|
|
3211
4011
|
declare class KptToastContainer {
|
|
3212
4012
|
private readonly service;
|
|
3213
4013
|
protected readonly i18n: KptI18n;
|
|
3214
|
-
protected readonly toasts: _angular_core.Signal<
|
|
4014
|
+
protected readonly toasts: _angular_core.Signal<KptToast[]>;
|
|
4015
|
+
protected readonly politeText: _angular_core.WritableSignal<string>;
|
|
4016
|
+
protected readonly alertText: _angular_core.WritableSignal<string>;
|
|
4017
|
+
/** Ostatni ogłoszony toast — zamknięcie nowszego nie może ponownie ogłosić starszego. */
|
|
4018
|
+
private lastAnnounced;
|
|
4019
|
+
/** Powody wstrzymania liczników: wskaźnik nad toastami i fokus w nich. */
|
|
4020
|
+
private readonly holds;
|
|
4021
|
+
constructor();
|
|
3215
4022
|
protected dismiss(id: number): void;
|
|
4023
|
+
protected runAction(id: number, run: () => void): void;
|
|
4024
|
+
protected hold(reason: 'pointer' | 'focus', on: boolean): void;
|
|
4025
|
+
/** Fokus przechodzący między przyciskami toastów nie wznawia liczników. */
|
|
4026
|
+
protected onFocusOut(event: FocusEvent): void;
|
|
3216
4027
|
protected icon(variant: KptAlertVariant): KptIconName;
|
|
4028
|
+
/**
|
|
4029
|
+
* Treść trafia do regionu po wyczyszczeniu go w poprzedniej klatce — ten sam tekst wpisany
|
|
4030
|
+
* drugi raz (dwa razy „Zapisano”) inaczej nie zostałby ogłoszony.
|
|
4031
|
+
*/
|
|
4032
|
+
private announce;
|
|
3217
4033
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptToastContainer, never>;
|
|
3218
4034
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptToastContainer, "kpt-toast-container", never, {}, {}, never, never, true, never>;
|
|
3219
4035
|
}
|
|
@@ -3223,6 +4039,15 @@ type KptTooltipPosition = 'top' | 'bottom' | 'left' | 'right';
|
|
|
3223
4039
|
* Dymek podpowiedzi (tooltip) pokazywany na hover/focus hosta. Lekki — element dodawany
|
|
3224
4040
|
* do `body` i pozycjonowany względem hosta (działa w trybie zoneless).
|
|
3225
4041
|
*
|
|
4042
|
+
* Dostępność:
|
|
4043
|
+
* - fokus łapiemy przez `focusin`/`focusout`, bo `focus`/`blur` nie bąbelkują — na
|
|
4044
|
+
* `kpt-button` czy `kpt-icon-button` fokus dostaje wewnętrzny `<button>`, nie host;
|
|
4045
|
+
* - tekst trafia do czytników przez trwały, ukryty opis powiązany `aria-describedby`
|
|
4046
|
+
* z elementem, który faktycznie przyjmuje fokus (sam dymek powstaje dopiero przy pokazaniu,
|
|
4047
|
+
* więc nie da się go wskazać wcześniej). Opisu nie dodajemy, gdy powtarzałby nazwę elementu
|
|
4048
|
+
* albo przy `kptTooltipOnlyWhenTruncated` — tam dymek pokazuje tekst, który i tak jest w DOM-ie;
|
|
4049
|
+
* - `Escape` zamyka dymek, a wskaźnik może na niego przejść bez zniknięcia (WCAG 1.4.13).
|
|
4050
|
+
*
|
|
3226
4051
|
* @example
|
|
3227
4052
|
* <kpt-button kptTooltip="Zapisz zmiany" kptTooltipPosition="bottom">Zapisz</kpt-button>
|
|
3228
4053
|
*
|
|
@@ -3232,23 +4057,30 @@ type KptTooltipPosition = 'top' | 'bottom' | 'left' | 'right';
|
|
|
3232
4057
|
declare class KptTooltip implements OnDestroy {
|
|
3233
4058
|
readonly text: _angular_core.InputSignal<string>;
|
|
3234
4059
|
readonly position: _angular_core.InputSignal<KptTooltipPosition>;
|
|
3235
|
-
/**
|
|
3236
|
-
* Pokazuj dymek tylko wtedy, gdy treść nie mieści się w elemencie (jest ucięta
|
|
3237
|
-
* wielokropkiem). Dzięki temu podpowiedź nie powtarza tekstu, który i tak widać.
|
|
3238
|
-
*/
|
|
3239
4060
|
readonly onlyWhenTruncated: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
3240
4061
|
private readonly host;
|
|
4062
|
+
private readonly descId;
|
|
3241
4063
|
private tip?;
|
|
3242
|
-
/**
|
|
4064
|
+
/** Ukryty opis dla czytników — żyje tak długo jak dyrektywa, niezależnie od dymka. */
|
|
4065
|
+
private desc?;
|
|
4066
|
+
/** Element, któremu dopisaliśmy `aria-describedby` — żeby go potem zdjąć. */
|
|
4067
|
+
private describedEl?;
|
|
4068
|
+
private hideTimer?;
|
|
3243
4069
|
private readonly follow;
|
|
4070
|
+
private readonly onKeydown;
|
|
4071
|
+
constructor();
|
|
3244
4072
|
protected show(): void;
|
|
4073
|
+
/** Fokus przeszedł do innego elementu w obrębie hosta — dymek zostaje. */
|
|
4074
|
+
protected onFocusOut(event: FocusEvent): void;
|
|
4075
|
+
protected scheduleHide(): void;
|
|
4076
|
+
private cancelHide;
|
|
3245
4077
|
protected hide(): void;
|
|
3246
|
-
/**
|
|
3247
|
-
|
|
3248
|
-
|
|
3249
|
-
|
|
3250
|
-
|
|
3251
|
-
|
|
4078
|
+
/** Trwały opis dla czytników albo jego usunięcie, gdy nie jest potrzebny. */
|
|
4079
|
+
private syncDescription;
|
|
4080
|
+
private removeDescription;
|
|
4081
|
+
private unlink;
|
|
4082
|
+
/** Host, jeśli sam przyjmuje fokus, inaczej pierwsza kontrolka w środku, a w ostateczności host. */
|
|
4083
|
+
private focusTarget;
|
|
3252
4084
|
private isTruncated;
|
|
3253
4085
|
private reposition;
|
|
3254
4086
|
ngOnDestroy(): void;
|
|
@@ -3261,6 +4093,11 @@ declare class KptTooltip implements OnDestroy {
|
|
|
3261
4093
|
* atrybut `kptPopoverTrigger`; reszta treści trafia do panelu.
|
|
3262
4094
|
* Wymaga stylów overlay CDK: `import '@angular/cdk/overlay-prebuilt.css';`
|
|
3263
4095
|
*
|
|
4096
|
+
* Dostępność: kontrolka w slocie wyzwalacza dostaje `aria-haspopup="dialog"`, aktualne
|
|
4097
|
+
* `aria-expanded` i `aria-controls` (na prawdziwy `<button>`, nie na opakowanie — jak w
|
|
4098
|
+
* `kpt-menu`). Po otwarciu fokus przechodzi do pierwszego interaktywnego elementu dymka,
|
|
4099
|
+
* a po zamknięciu (`Escape`, kliknięcie obok, `open = false`) wraca na wyzwalacz.
|
|
4100
|
+
*
|
|
3264
4101
|
* @example
|
|
3265
4102
|
* <kpt-popover>
|
|
3266
4103
|
* <kpt-button kptPopoverTrigger variant="outline">Szczegóły</kpt-button>
|
|
@@ -3268,13 +4105,23 @@ declare class KptTooltip implements OnDestroy {
|
|
|
3268
4105
|
* </kpt-popover>
|
|
3269
4106
|
*/
|
|
3270
4107
|
declare class KptPopover {
|
|
4108
|
+
/** Preferowana strona dymka; gdy brakuje miejsca, CDK przerzuca go na drugą. */
|
|
3271
4109
|
readonly placement: _angular_core.InputSignal<"bottom" | "top">;
|
|
3272
|
-
|
|
3273
|
-
|
|
4110
|
+
/** Czy dymek jest otwarty (dwukierunkowe) — aplikacja może go zamknąć z kodu. */
|
|
4111
|
+
readonly open: _angular_core.ModelSignal<boolean>;
|
|
4112
|
+
private readonly host;
|
|
4113
|
+
private readonly injector;
|
|
4114
|
+
private readonly panel;
|
|
4115
|
+
protected readonly panelId: string;
|
|
4116
|
+
protected readonly positions: _angular_core.Signal<ConnectedPosition[]>;
|
|
4117
|
+
constructor();
|
|
3274
4118
|
protected toggle(): void;
|
|
3275
4119
|
protected close(): void;
|
|
4120
|
+
/** Dymek istnieje w DOM-ie dopiero po podpięciu overlaya — fokus po najbliższym renderze. */
|
|
4121
|
+
protected onAttach(): void;
|
|
4122
|
+
private control;
|
|
3276
4123
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptPopover, never>;
|
|
3277
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptPopover, "kpt-popover", never, { "placement": { "alias": "placement"; "required": false; "isSignal": true; }; }, {}, never, ["[kptPopoverTrigger]", "*"], true, never>;
|
|
4124
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptPopover, "kpt-popover", never, { "placement": { "alias": "placement"; "required": false; "isSignal": true; }; "open": { "alias": "open"; "required": false; "isSignal": true; }; }, { "open": "openChange"; }, never, ["[kptPopoverTrigger]", "*"], true, never>;
|
|
3278
4125
|
}
|
|
3279
4126
|
|
|
3280
4127
|
/** Z której strony triggera wychodzi karta. */
|
|
@@ -3436,6 +4283,10 @@ declare class KptMentions<T = unknown> {
|
|
|
3436
4283
|
* Pole z podpowiedziami (autocomplete) na CDK Overlay, Signal Forms. Wartość = wpisany tekst.
|
|
3437
4284
|
* Wymaga stylów overlay CDK: `import '@angular/cdk/overlay-prebuilt.css';`
|
|
3438
4285
|
*
|
|
4286
|
+
* Wzorzec WAI-ARIA „combobox z listą”: fokus zostaje w polu, aktywną podpowiedź ogłasza
|
|
4287
|
+
* `aria-activedescendant`, a liczbę podpowiedzi (albo ich brak) — region `polite`. Dopasowanie
|
|
4288
|
+
* pomija wielkość liter i diakrytyki („lodz” znajduje „Łódź”).
|
|
4289
|
+
*
|
|
3439
4290
|
* @example
|
|
3440
4291
|
* <kpt-autocomplete [formField]="f.city" [options]="cities" placeholder="Miasto…" />
|
|
3441
4292
|
*/
|
|
@@ -3444,22 +4295,37 @@ declare class KptAutocomplete implements FormValueControl<string> {
|
|
|
3444
4295
|
readonly options: _angular_core.InputSignal<readonly string[]>;
|
|
3445
4296
|
readonly placeholder: _angular_core.InputSignal<string>;
|
|
3446
4297
|
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
4298
|
+
readonly required: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
4299
|
+
/** Id natywnego pola; bez niego generowane (w `kpt-form-field` — `controlId` wrappera). */
|
|
4300
|
+
readonly id: _angular_core.InputSignal<string | null>;
|
|
4301
|
+
/** Nazwa dostępna, gdy pola nie opisuje `<label for>`. */
|
|
4302
|
+
readonly ariaLabel: _angular_core.InputSignal<string | null>;
|
|
3447
4303
|
readonly invalid: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
3448
4304
|
readonly touched: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
3449
4305
|
/** Stan nieprawidłowy pokazujemy dopiero po dotknięciu pola — jak natywne `:user-invalid`. */
|
|
3450
4306
|
protected readonly showInvalid: _angular_core.Signal<boolean>;
|
|
3451
4307
|
readonly touch: _angular_core.OutputEmitterRef<void>;
|
|
4308
|
+
protected readonly field: _konce_pt_angular.KptFieldA11y;
|
|
3452
4309
|
protected readonly open: _angular_core.WritableSignal<boolean>;
|
|
3453
4310
|
protected readonly activeIndex: _angular_core.WritableSignal<number>;
|
|
3454
4311
|
protected readonly positions: ConnectedPosition[];
|
|
4312
|
+
protected readonly i18n: KptI18n;
|
|
3455
4313
|
protected readonly filtered: _angular_core.Signal<readonly string[]>;
|
|
4314
|
+
protected readonly panelOpen: _angular_core.Signal<boolean>;
|
|
4315
|
+
protected readonly listId: _angular_core.Signal<string>;
|
|
4316
|
+
protected readonly activeOptionId: _angular_core.Signal<string | null>;
|
|
4317
|
+
/** Wpisano coś od ostatniego otwarcia — dopiero wtedy ogłaszamy liczbę podpowiedzi. */
|
|
4318
|
+
private readonly typed;
|
|
4319
|
+
protected readonly announcement: _angular_core.Signal<string>;
|
|
4320
|
+
constructor();
|
|
4321
|
+
protected optionId(index: number): string;
|
|
3456
4322
|
protected onInput(event: Event): void;
|
|
3457
4323
|
protected onFocus(): void;
|
|
3458
4324
|
protected onBlur(): void;
|
|
3459
4325
|
protected pick(opt: string): void;
|
|
3460
4326
|
protected onKeydown(event: KeyboardEvent): void;
|
|
3461
4327
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptAutocomplete, never>;
|
|
3462
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptAutocomplete, "kpt-autocomplete", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "touch": "touch"; }, never, never, true, never>;
|
|
4328
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptAutocomplete, "kpt-autocomplete", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "touch": "touch"; }, never, never, true, never>;
|
|
3463
4329
|
}
|
|
3464
4330
|
|
|
3465
4331
|
type KptDrawerPosition = 'left' | 'right' | 'top' | 'bottom';
|
|
@@ -3478,6 +4344,12 @@ declare class KptDrawer {
|
|
|
3478
4344
|
readonly dismissible: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
3479
4345
|
readonly closeOnBackdrop: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
3480
4346
|
protected readonly i18n: KptI18n;
|
|
4347
|
+
protected readonly titleId: string;
|
|
4348
|
+
private readonly panel;
|
|
4349
|
+
private readonly modalFocus;
|
|
4350
|
+
constructor();
|
|
4351
|
+
/** `Escape` zamyka tylko panel, który da się zamknąć — jak `×`. */
|
|
4352
|
+
protected onEscape(): void;
|
|
3481
4353
|
protected onBackdrop(): void;
|
|
3482
4354
|
protected close(): void;
|
|
3483
4355
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptDrawer, never>;
|
|
@@ -3487,6 +4359,12 @@ declare class KptDrawer {
|
|
|
3487
4359
|
/**
|
|
3488
4360
|
* Menu kontekstowe (PPM) na obszarze projekcji. Panel pozycjonowany do kursora.
|
|
3489
4361
|
*
|
|
4362
|
+
* Klawiatura jak w `kpt-menu` (wspólne `menu-keys.ts`): po otwarciu fokus na pierwszej pozycji,
|
|
4363
|
+
* strzałki / `Home` / `End` chodzą po pozycjach, `Escape` i `Tab` zamykają, a fokus wraca tam,
|
|
4364
|
+
* gdzie był. `Shift+F10` i klawisz Menu na skupionym elemencie obszaru też otwierają menu —
|
|
4365
|
+
* przeglądarka wysyła wtedy `contextmenu` bez współrzędnych myszy, więc panel staje przy
|
|
4366
|
+
* skupionym elemencie. Panel jest dociskany do krawędzi okna.
|
|
4367
|
+
*
|
|
3490
4368
|
* @example
|
|
3491
4369
|
* <kpt-context-menu [items]="items" (selected)="onSelect($event)">
|
|
3492
4370
|
* <div class="obszar">Kliknij prawym przyciskiem</div>
|
|
@@ -3498,55 +4376,136 @@ declare class KptContextMenu<T = unknown> {
|
|
|
3498
4376
|
protected readonly open: _angular_core.WritableSignal<boolean>;
|
|
3499
4377
|
protected readonly x: _angular_core.WritableSignal<number>;
|
|
3500
4378
|
protected readonly y: _angular_core.WritableSignal<number>;
|
|
4379
|
+
private readonly injector;
|
|
4380
|
+
private readonly panel;
|
|
4381
|
+
/** Element, który miał fokus przed otwarciem — tam fokus wraca po zamknięciu. */
|
|
4382
|
+
private returnTo;
|
|
3501
4383
|
protected onContext(event: MouseEvent): void;
|
|
4384
|
+
protected onPanelKeydown(event: KeyboardEvent): void;
|
|
3502
4385
|
protected close(): void;
|
|
3503
4386
|
protected pick(item: KptMenuItem<T>): void;
|
|
4387
|
+
/** Dociśnięcie do okna (panel przy prawej / dolnej krawędzi wychodził poza nie) i fokus. */
|
|
4388
|
+
private placeAndFocus;
|
|
3504
4389
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptContextMenu<any>, never>;
|
|
3505
4390
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptContextMenu<any>, "kpt-context-menu", never, { "items": { "alias": "items"; "required": false; "isSignal": true; }; }, { "selected": "selected"; }, never, ["*"], true, never>;
|
|
3506
4391
|
}
|
|
3507
4392
|
|
|
3508
4393
|
/**
|
|
3509
|
-
* Pozioma belka menu z rozwijanymi pod-menu. Pozycje bez `items` działają jak akcje
|
|
4394
|
+
* Pozioma belka menu z rozwijanymi pod-menu. Pozycje bez `items` działają jak akcje, a z `url` —
|
|
4395
|
+
* jak odnośniki (`<a href>`).
|
|
3510
4396
|
* Pod-menu renderowane przez CDK Overlay (doczepiane do `body`), więc nie są przycinane
|
|
3511
4397
|
* przez rodzica z `overflow: hidden`. Wymaga stylów overlay CDK:
|
|
3512
4398
|
* `import '@angular/cdk/overlay-prebuilt.css';`
|
|
3513
4399
|
*
|
|
4400
|
+
* Klawiatura według wzorca WAI-ARIA „menubar”: belka to jeden przystanek Tab, strzałki w lewo/prawo
|
|
4401
|
+
* i `Home`/`End` chodzą po pozycjach górnych, strzałka w dół (albo `Enter`/spacja) otwiera
|
|
4402
|
+
* pod-menu z fokusem na pierwszej pozycji, w górę — na ostatniej. W otwartym pod-menu strzałki
|
|
4403
|
+
* w lewo/prawo przechodzą do sąsiedniego, a `Escape` zamyka je i oddaje fokus belce.
|
|
4404
|
+
*
|
|
3514
4405
|
* @example
|
|
3515
4406
|
* <kpt-menubar [items]="items" (selected)="onSelect($event)" />
|
|
3516
4407
|
*/
|
|
3517
4408
|
declare class KptMenubar<T = unknown> {
|
|
3518
4409
|
readonly items: _angular_core.InputSignal<readonly KptMenuItem<T>[]>;
|
|
4410
|
+
/** Nazwa belki dla czytników ekranu, np. „Menu edytora”. */
|
|
4411
|
+
readonly ariaLabel: _angular_core.InputSignal<string>;
|
|
3519
4412
|
readonly selected: _angular_core.OutputEmitterRef<KptMenuItem<T>>;
|
|
3520
4413
|
protected readonly openIndex: _angular_core.WritableSignal<number | null>;
|
|
4414
|
+
/** Ostatnio skupiona pozycja górna — ona jest przystankiem Tab belki. */
|
|
4415
|
+
protected readonly focusIndex: _angular_core.WritableSignal<number>;
|
|
4416
|
+
private readonly disabledMap;
|
|
4417
|
+
protected readonly tabStop: _angular_core.Signal<number>;
|
|
4418
|
+
private readonly tops;
|
|
4419
|
+
private readonly injector;
|
|
4420
|
+
private readonly baseId;
|
|
4421
|
+
/** Którą pozycję pod-menu skupić po otwarciu — strzałka w górę otwiera „od końca”. */
|
|
4422
|
+
private focusEdge;
|
|
3521
4423
|
protected readonly positions: ConnectedPosition[];
|
|
4424
|
+
/**
|
|
4425
|
+
* Pozycja z `url` (bez pod-menu, niewyłączona) renderuje się jako `<a href>` — nawigację robi
|
|
4426
|
+
* przeglądarka, więc działa otwieranie w nowej karcie i podgląd adresu. `selected` i tak leci.
|
|
4427
|
+
*/
|
|
4428
|
+
protected isLink(item: KptMenuItem<T>): boolean;
|
|
4429
|
+
protected panelId(i: number): string;
|
|
3522
4430
|
protected toggle(i: number, item: KptMenuItem<T>): void;
|
|
3523
|
-
protected pick(item: KptMenuItem<T
|
|
4431
|
+
protected pick(item: KptMenuItem<T>, i: number): void;
|
|
3524
4432
|
protected closeAll(): void;
|
|
4433
|
+
protected onTopKeydown(event: KeyboardEvent, i: number): void;
|
|
4434
|
+
/** Panel istnieje w DOM-ie dopiero po podpięciu overlaya — fokus po najbliższym renderze. */
|
|
4435
|
+
protected onAttach(i: number): void;
|
|
4436
|
+
/**
|
|
4437
|
+
* Overlay odpina się także wtedy, gdy strzałka przenosi otwarcie na sąsiada — wtedy `openIndex`
|
|
4438
|
+
* wskazuje już nową pozycję i nie wolno go zerować.
|
|
4439
|
+
*/
|
|
4440
|
+
protected onDetach(i: number): void;
|
|
4441
|
+
protected onPanelKeydown(event: KeyboardEvent, i: number): void;
|
|
4442
|
+
/** Skupia pozycję górną `i` i otwiera jej pod-menu, jeśli je ma (inaczej zamyka otwarte). */
|
|
4443
|
+
private openAt;
|
|
4444
|
+
private focusTop;
|
|
4445
|
+
/** Fokus wraca na pozycję górną — inaczej po zniknięciu pod-menu spadłby na `<body>`. */
|
|
4446
|
+
private closeAndFocusTop;
|
|
3525
4447
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptMenubar<any>, never>;
|
|
3526
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptMenubar<any>, "kpt-menubar", never, { "items": { "alias": "items"; "required": false; "isSignal": true; }; }, { "selected": "selected"; }, never, never, true, never>;
|
|
4448
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptMenubar<any>, "kpt-menubar", never, { "items": { "alias": "items"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, { "selected": "selected"; }, never, never, true, never>;
|
|
3527
4449
|
}
|
|
3528
4450
|
|
|
3529
4451
|
/**
|
|
3530
4452
|
* Mega-menu — pozioma belka z szerokim, wielokolumnowym panelem.
|
|
3531
4453
|
* Struktura: pozycja górna → `items` (kolumny) → każda kolumna `items` (odnośniki).
|
|
4454
|
+
* Pozycja górna bez kolumn działa jak akcja — emituje `selected` zamiast otwierać pusty panel.
|
|
4455
|
+
* Pozycje z `url` (górne bez kolumn i odnośniki w kolumnach) to prawdziwe `<a href>`.
|
|
3532
4456
|
* Panel renderowany przez CDK Overlay (doczepiony do `body`), więc nie jest przycinany
|
|
3533
4457
|
* przez rodzica z `overflow: hidden`. Wymaga stylów overlay CDK:
|
|
3534
4458
|
* `import '@angular/cdk/overlay-prebuilt.css';`
|
|
3535
4459
|
*
|
|
4460
|
+
* Klawiatura jak w `kpt-menubar`: belka to jeden przystanek Tab, strzałki w lewo/prawo
|
|
4461
|
+
* i `Home`/`End` chodzą po pozycjach górnych, strzałka w dół (albo `Enter`/spacja) otwiera panel
|
|
4462
|
+
* z fokusem na pierwszym odnośniku. W panelu strzałki w górę/dół przechodzą po wszystkich
|
|
4463
|
+
* odnośnikach kolumna po kolumnie, w lewo/prawo — do panelu sąsiedniej pozycji, a `Escape`
|
|
4464
|
+
* zamyka panel i oddaje fokus belce.
|
|
4465
|
+
*
|
|
3536
4466
|
* @example
|
|
3537
4467
|
* <kpt-megamenu [items]="items" (selected)="onSelect($event)" />
|
|
3538
4468
|
*/
|
|
3539
4469
|
declare class KptMegamenu<T = unknown> {
|
|
3540
4470
|
readonly items: _angular_core.InputSignal<readonly KptMenuItem<T>[]>;
|
|
4471
|
+
/** Nazwa belki dla czytników ekranu, np. „Menu główne”. */
|
|
4472
|
+
readonly ariaLabel: _angular_core.InputSignal<string>;
|
|
3541
4473
|
readonly selected: _angular_core.OutputEmitterRef<KptMenuItem<T>>;
|
|
3542
4474
|
protected readonly openIndex: _angular_core.WritableSignal<number | null>;
|
|
4475
|
+
/** Ostatnio skupiona pozycja górna — ona jest przystankiem Tab belki. */
|
|
4476
|
+
protected readonly focusIndex: _angular_core.WritableSignal<number>;
|
|
4477
|
+
private readonly disabledMap;
|
|
4478
|
+
protected readonly tabStop: _angular_core.Signal<number>;
|
|
4479
|
+
protected readonly activeLabel: _angular_core.Signal<string | null>;
|
|
4480
|
+
private readonly tops;
|
|
4481
|
+
private readonly panel;
|
|
4482
|
+
private readonly injector;
|
|
4483
|
+
protected readonly panelId: string;
|
|
4484
|
+
/** Który odnośnik skupić po otwarciu — strzałka w górę otwiera „od końca”. */
|
|
4485
|
+
private focusEdge;
|
|
3543
4486
|
protected readonly positions: ConnectedPosition[];
|
|
4487
|
+
/**
|
|
4488
|
+
* Pozycja z `url` (bez kolumn, niewyłączona) renderuje się jako `<a href>` — nawigację robi
|
|
4489
|
+
* przeglądarka, więc działa otwieranie w nowej karcie i podgląd adresu. `selected` i tak leci.
|
|
4490
|
+
*/
|
|
4491
|
+
protected isLink(item: KptMenuItem<T>): boolean;
|
|
3544
4492
|
protected activeColumns(): readonly KptMenuItem<T>[];
|
|
3545
|
-
protected toggle(i: number): void;
|
|
4493
|
+
protected toggle(i: number, item: KptMenuItem<T>): void;
|
|
3546
4494
|
protected pick(link: KptMenuItem<T>): void;
|
|
3547
4495
|
protected closeAll(): void;
|
|
4496
|
+
protected onTopKeydown(event: KeyboardEvent, i: number): void;
|
|
4497
|
+
protected onPanelKeydown(event: KeyboardEvent): void;
|
|
4498
|
+
/** Panel istnieje w DOM-ie dopiero po podpięciu overlaya — fokus po najbliższym renderze. */
|
|
4499
|
+
protected focusPanelEdge(): void;
|
|
4500
|
+
/**
|
|
4501
|
+
* Skupia pozycję górną `i` i pokazuje jej panel, jeśli ma kolumny (inaczej zamyka otwarty).
|
|
4502
|
+
* Overlay jest jeden, więc przy zmianie pozycji nie podpina się ponownie — fokus w panelu
|
|
4503
|
+
* trzeba wtedy ustawić samemu.
|
|
4504
|
+
*/
|
|
4505
|
+
private openAt;
|
|
4506
|
+
private focusTop;
|
|
3548
4507
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptMegamenu<any>, never>;
|
|
3549
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptMegamenu<any>, "kpt-megamenu", never, { "items": { "alias": "items"; "required": false; "isSignal": true; }; }, { "selected": "selected"; }, never, never, true, never>;
|
|
4508
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptMegamenu<any>, "kpt-megamenu", never, { "items": { "alias": "items"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, { "selected": "selected"; }, never, never, true, never>;
|
|
3550
4509
|
}
|
|
3551
4510
|
|
|
3552
4511
|
interface KptConfirmOptions {
|
|
@@ -3583,12 +4542,19 @@ declare class KptConfirmService {
|
|
|
3583
4542
|
/**
|
|
3584
4543
|
* Kontener potwierdzeń — renderuje aktywne żądanie z `KptConfirmService` na `kpt-dialog`.
|
|
3585
4544
|
* Umieść raz w aplikacji (np. obok `<kpt-toast-container />`).
|
|
4545
|
+
*
|
|
4546
|
+
* Okno to `role="alertdialog"` z treścią pytania w `aria-describedby`, więc czytnik odczytuje
|
|
4547
|
+
* je od razu po otwarciu. Fokus startuje na przycisku odmowy — bezpieczniejszej odpowiedzi,
|
|
4548
|
+
* której przypadkowy `Enter` niczego nie usunie.
|
|
3586
4549
|
*/
|
|
3587
4550
|
declare class KptConfirmContainer {
|
|
3588
4551
|
protected readonly i18n: KptI18n;
|
|
3589
4552
|
protected readonly service: KptConfirmService;
|
|
3590
4553
|
protected readonly req: _angular_core.Signal<_konce_pt_angular.KptConfirmRequest | null>;
|
|
3591
4554
|
protected readonly isOpen: _angular_core.Signal<boolean>;
|
|
4555
|
+
protected readonly messageId: string;
|
|
4556
|
+
private readonly host;
|
|
4557
|
+
constructor();
|
|
3592
4558
|
protected onOpenChange(open: boolean): void;
|
|
3593
4559
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptConfirmContainer, never>;
|
|
3594
4560
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptConfirmContainer, "kpt-confirm-container", never, {}, {}, never, never, true, never>;
|
|
@@ -3607,6 +4573,10 @@ declare class KptBottomSheet {
|
|
|
3607
4573
|
readonly header: _angular_core.InputSignal<string>;
|
|
3608
4574
|
readonly closeOnBackdrop: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
3609
4575
|
protected readonly i18n: KptI18n;
|
|
4576
|
+
protected readonly titleId: string;
|
|
4577
|
+
private readonly panel;
|
|
4578
|
+
private readonly modalFocus;
|
|
4579
|
+
constructor();
|
|
3610
4580
|
protected onBackdrop(): void;
|
|
3611
4581
|
protected close(): void;
|
|
3612
4582
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptBottomSheet, never>;
|
|
@@ -3630,13 +4600,17 @@ declare class KptSpeedDial<T = unknown> {
|
|
|
3630
4600
|
protected readonly i18n: KptI18n;
|
|
3631
4601
|
protected readonly effectiveAriaLabel: _angular_core.Signal<string>;
|
|
3632
4602
|
protected readonly open: _angular_core.WritableSignal<boolean>;
|
|
4603
|
+
protected readonly actionsId: string;
|
|
4604
|
+
private readonly host;
|
|
3633
4605
|
protected toggle(): void;
|
|
3634
4606
|
protected close(): void;
|
|
3635
4607
|
protected pick(item: KptMenuItem<T>): void;
|
|
4608
|
+
/** Escape z dowolnego miejsca w wachlarzu: zamyka i zwraca fokus na główny przycisk. */
|
|
4609
|
+
protected closeAndRestoreFocus(): void;
|
|
3636
4610
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<KptSpeedDial<any>, never>;
|
|
3637
4611
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<KptSpeedDial<any>, "kpt-speed-dial", never, { "items": { "alias": "items"; "required": false; "isSignal": true; }; "direction": { "alias": "direction"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, { "selected": "selected"; }, never, never, true, never>;
|
|
3638
4612
|
}
|
|
3639
4613
|
|
|
3640
|
-
export { KPT_BREAKPOINTS, KPT_FORM_FIELD_CONTROL, KPT_I18N_CONFIG, KptAccordion, KptAccordionPanel, KptAlert, KptAppShell, KptAuth, KptAuthProviderDef, KptAutocomplete, KptAvatar, KptAvatarGroup, KptBackdrop, KptBadge, KptBottomSheet, KptBreadcrumb, KptBreakpointObserver, KptButton, KptButtonGroup, KptCard, KptCarousel, KptCellDef, KptCellEditDef, KptCheckbox, KptChip, KptChipsInput, KptClock, KptColorPicker, KptConfirmContainer, KptConfirmService, KptContextMenu, KptDataTable, KptDataView, KptDateRange, KptDatepicker, KptDialog, KptDivider, KptDrawer, KptEmpty, KptFab, KptFieldset, KptFileUpload, KptFormField, KptGalleria, KptI18n, KptIcon, KptIconButton, KptIconRegistry, KptImage, KptInput, KptInputMask, KptInputNumber, KptInputOtp, KptKnob, KptListbox, KptMegamenu, KptMention, KptMentions, KptMenu, KptMenubar, KptMeterGroup, KptOrderList, KptPaginator, KptPanel, KptPassword, KptPeek, KptPeekTrigger, KptPickList, KptPopover, KptProgress, KptRadioGroup, KptRating, KptRichText, KptRowDetailDef, KptScrollTop, KptSelect, KptShellNavToggle, KptSidenav, KptSkeleton, KptSlider, KptSpeedDial, KptSpinner, KptSplitButton, KptSplitter, KptStep, KptStepper, KptSwitch, KptSwitchGroup, KptTab, KptTabs, KptTextarea, KptTimeline, KptToastContainer, KptToastService, KptToolbar, KptTooltip, KptTree, provideKptI18n, provideKptIcons };
|
|
3641
|
-
export type { KptAlertVariant, KptAuthLayout, KptAuthMode, KptAuthProvider, KptAuthProviderLayout, KptAuthResetValue, KptAuthSignInValue, KptAuthSignUpValue, KptAvatarItem, KptAvatarShape, KptAvatarSize, KptBadgeSize, KptBadgeVariant, KptBreadcrumbItem, KptBreakpoint, KptButtonSize, KptButtonVariant, KptCardVariant, KptCellEditEvent, KptChipTextTransform, KptChipVariant, KptColumn, KptColumnEdit, KptColumnEditType, KptConfirmOptions, KptConfirmRequest, KptDatepickerMode, KptDatepickerView, KptDialogSize, KptDividerOrientation, KptDrawerPosition, KptFormFieldControl, KptGalleriaItem, KptInputType, KptMenuItem, KptMeterItem, KptOption, KptPeekPlacement, KptProgressLabelPosition, KptProgressSize, KptProgressType, KptProgressValueFormat, KptProgressVariant, KptRichTool, KptRichToolbar, KptSidenavMode, KptSkeletonVariant, KptSliderValue, KptSpeedDialDirection, KptSplitterOrientation, KptTableLazyState, KptTimelineItem, KptToast, KptToastOptions, KptTooltipPosition, KptTreeNode };
|
|
4614
|
+
export { KPT_BREAKPOINTS, KPT_FORM_FIELD, KPT_FORM_FIELD_CONTROL, KPT_I18N_CONFIG, KptAccordion, KptAccordionPanel, KptAlert, KptAppShell, KptAuth, KptAuthProviderDef, KptAutocomplete, KptAvatar, KptAvatarGroup, KptBackdrop, KptBadge, KptBottomSheet, KptBreadcrumb, KptBreakpointObserver, KptButton, KptButtonGroup, KptCard, KptCarousel, KptCellDef, KptCellEditDef, KptCheckbox, KptChip, KptChipsInput, KptClock, KptColorPicker, KptConfirmContainer, KptConfirmService, KptContextMenu, KptDataTable, KptDataView, KptDateRange, KptDatepicker, KptDialog, KptDivider, KptDrawer, KptEmpty, KptFab, KptFieldset, KptFileUpload, KptFormField, KptGalleria, KptI18n, KptIcon, KptIconButton, KptIconRegistry, KptImage, KptInput, KptInputMask, KptInputNumber, KptInputOtp, KptKnob, KptListbox, KptMegamenu, KptMention, KptMentions, KptMenu, KptMenubar, KptMeterGroup, KptOrderList, KptPaginator, KptPanel, KptPassword, KptPeek, KptPeekTrigger, KptPickList, KptPopover, KptProgress, KptRadioGroup, KptRating, KptRichText, KptRowDetailDef, KptScrollTop, KptSelect, KptShellNavToggle, KptSidenav, KptSkeleton, KptSlider, KptSpeedDial, KptSpinner, KptSplitButton, KptSplitter, KptStep, KptStepper, KptSwitch, KptSwitchGroup, KptTab, KptTabs, KptTextarea, KptTimeline, KptToastContainer, KptToastService, KptToolbar, KptTooltip, KptTree, kptFieldA11y, provideKptI18n, provideKptIcons };
|
|
4615
|
+
export type { KptAlertVariant, KptAuthLayout, KptAuthMode, KptAuthProvider, KptAuthProviderLayout, KptAuthResetValue, KptAuthSignInValue, KptAuthSignUpValue, KptAvatarItem, KptAvatarShape, KptAvatarSize, KptBadgeSize, KptBadgeVariant, KptBreadcrumbItem, KptBreakpoint, KptButtonSize, KptButtonVariant, KptCardHeadingLevel, KptCardVariant, KptCellEditEvent, KptChipTextTransform, KptChipVariant, KptColorPreset, KptColumn, KptColumnEdit, KptColumnEditType, KptConfirmOptions, KptConfirmRequest, KptDatepickerMode, KptDatepickerView, KptDialogSize, KptDividerOrientation, KptDrawerPosition, KptFieldA11y, KptFormFieldContext, KptFormFieldControl, KptGalleriaItem, KptInputType, KptMenuItem, KptMeterItem, KptOption, KptPeekPlacement, KptProgressLabelPosition, KptProgressSize, KptProgressType, KptProgressValueFormat, KptProgressVariant, KptRichTool, KptRichToolbar, KptSidenavMode, KptSkeletonVariant, KptSliderValue, KptSpeedDialDirection, KptSplitButtonVariant, KptSplitterOrientation, KptTableLazyState, KptTimelineItem, KptToast, KptToastAction, KptToastOptions, KptTooltipPosition, KptTreeNode };
|
|
3642
4616
|
//# sourceMappingURL=konce-pt-angular.d.ts.map
|