@guildofgleks/ui 21.2.4 → 21.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,17 +1,24 @@
1
1
  import * as _angular_core from '@angular/core';
2
- import { TemplateRef, Type, Injector, InjectionToken, OnDestroy, DoCheck, Signal, ModelSignal, ElementRef, Provider } from '@angular/core';
2
+ import { TemplateRef, DoCheck, Signal, ModelSignal, ElementRef, InjectionToken, Type, Injector, OnDestroy, Provider } from '@angular/core';
3
3
  import { ControlValueAccessor } from '@angular/forms';
4
4
  import * as _angular_platform_browser from '@angular/platform-browser';
5
5
  import * as _guildofgleks_ui from '@guildofgleks/ui';
6
6
 
7
7
  type GogSize = 'xsm' | 'sm' | 'md' | 'lg' | 'slg';
8
8
  type GogVariant = 'primary' | 'secondary' | 'outline' | 'ghost';
9
+ /**
10
+ * Which way a component lays its children out. Shared rather than re-declared per component:
11
+ * `gog-radio-group`, `gog-slider`, `gog-divider`, `gog-tabs` and `gog-button-toggle-group` all
12
+ * mean the same thing by it, and `roving-focus.ts` picks its arrow pair from this.
13
+ */
14
+ type GogOrientation = 'horizontal' | 'vertical';
9
15
  type GogSpinnerVariant = 'runic' | 'ring' | 'custom';
10
16
  type GogTagVariant = 'success' | 'danger' | 'warning' | 'info';
11
17
  type GogTagShape = 'rounded' | 'pill';
12
18
  type GogSkeletonShape = 'text' | 'circle' | 'rect';
13
19
  type GogSkeletonAnimation = 'pulse' | 'wave' | 'none';
14
20
  type GogPaginatorRangeMode = 'window' | 'ellipsis';
21
+ type GogSliderOrientation = GogOrientation;
15
22
  type GogScrollAxis = 'vertical' | 'horizontal' | 'both';
16
23
  type GogScrollSize = 'normal' | 'thin';
17
24
  /**
@@ -26,10 +33,63 @@ type GogScrollSize = 'normal' | 'thin';
26
33
  * affordances (rubber-banding, pull-to-refresh) for this instance.
27
34
  */
28
35
  type GogScrollOverscrollBehavior = 'auto' | 'contain' | 'none';
36
+ /**
37
+ * Which side of the trigger the tooltip bubble renders on. `'auto'` (the default) picks
38
+ * whichever of the four sides has room for the bubble, preferring top, then bottom, then
39
+ * right, then left — see `resolveTooltipPlacement` in `tooltip-position.ts`. An explicit
40
+ * side still flips to its opposite if the requested side has no room but the opposite does.
41
+ */
42
+ type GogTooltipPosition = 'auto' | 'top' | 'bottom' | 'left' | 'right';
43
+ /**
44
+ * Where a field's label sits once it "floats" out of its resting position (overlapping the
45
+ * field like a placeholder) on focus or once the field has content. `'none'` (the default)
46
+ * keeps today's static label-above-the-field layout — nothing floats.
47
+ * - `'in'` — floats up but stays fully inside the field's border.
48
+ * - `'on'` — floats up until vertically centered on the top border line.
49
+ * - `'over'` — floats all the way above the field, outside the border.
50
+ */
51
+ type GogFloatLabelVariant = 'none' | 'in' | 'on' | 'over';
52
+ /**
53
+ * Which end of a dropdown panel the search box sticks to. Matches `gog-multiselect`'s
54
+ * `controlsPosition` vocabulary — the same idea applied to its select-all row.
55
+ */
56
+ type GogDropdownFilterPosition = 'top' | 'bottom';
57
+ /** How `gog-divider` paints its rule. */
58
+ type GogDividerVariant = 'solid' | 'dashed' | 'dotted';
59
+ /**
60
+ * Which corner of its host a `gogBadge` sits on. Named by block/inline edge rather than
61
+ * left/right so it follows the writing direction in an RTL layout.
62
+ */
63
+ type GogBadgePosition = 'top-end' | 'top-start' | 'bottom-end' | 'bottom-start';
64
+ /**
65
+ * - `'determinate'` — the bar reflects `value`.
66
+ * - `'indeterminate'` — work of unknown length; the bar animates and reports no value to
67
+ * assistive tech, which is what marks it indeterminate.
68
+ * - `'buffer'` — `value` plus a second, lighter `buffer` level ahead of it (streaming/preload).
69
+ */
70
+ type GogProgressbarMode = 'determinate' | 'indeterminate' | 'buffer';
71
+ /**
72
+ * `gog-progressbar`'s colour. Wider than `GogTagVariant` by one: progress is usually just
73
+ * "the app is working", which is the accent colour rather than any of the four status hues —
74
+ * so `'accent'` is the default and the status names are the exception.
75
+ */
76
+ type GogProgressbarVariant = 'accent' | 'success' | 'danger' | 'warning' | 'info';
77
+ /**
78
+ * - `'joined'` — one segmented control, buttons sharing borders (Material's look).
79
+ * - `'separated'` — discrete buttons with a gap between them.
80
+ */
81
+ type GogButtonToggleAppearance = 'joined' | 'separated';
82
+ /** How the tab headers distribute along the tablist. `'stretch'` makes them share the width. */
83
+ type GogTabsAlign = 'start' | 'center' | 'end' | 'stretch';
84
+ /** Whether `gog-datepicker` picks one day or a start/end pair. */
85
+ type GogDateSelectionMode = 'single' | 'range';
86
+ /** Clock convention for `gog-datepicker`'s time section. */
87
+ type GogHourFormat = '12' | '24';
29
88
 
30
89
  declare class ButtonComponent {
31
90
  variant: _angular_core.InputSignal<GogVariant>;
32
- size: _angular_core.InputSignal<GogSize>;
91
+ /** Unset, falls back to `GOG_CONFIG.control.size`, then to `'md'`. */
92
+ size: _angular_core.InputSignal<GogSize | undefined>;
33
93
  disabled: _angular_core.InputSignal<boolean>;
34
94
  fullWidth: _angular_core.InputSignal<boolean>;
35
95
  type: _angular_core.InputSignal<"button" | "submit" | "reset">;
@@ -56,9 +116,16 @@ declare class ButtonComponent {
56
116
  /** Logically blocked from activating (disabled OR loading), used to guard click handling. */
57
117
  protected isDisabled: _angular_core.Signal<boolean>;
58
118
  private static readonly SPINNER_SIZE_BY_BUTTON_SIZE;
59
- protected spinnerSize: _angular_core.Signal<GogSize>;
60
119
  private readonly globalConfig;
120
+ /** Instance input → `GOG_CONFIG` → the component's own default. See `resolveConfigured`. */
121
+ protected readonly resolvedSize: _angular_core.Signal<GogSize>;
122
+ protected spinnerSize: _angular_core.Signal<GogSize>;
61
123
  protected readonly resolvedDebounce: _angular_core.Signal<number>;
124
+ /**
125
+ * The single size modifier, replacing one `[class.gog-btn--<size>]` binding per size.
126
+ * Always emitted — `gog-btn` has a rule for every size, `md` included.
127
+ */
128
+ protected readonly sizeClass: _angular_core.Signal<string>;
62
129
  private readonly destroyRef;
63
130
  private readonly click$;
64
131
  constructor();
@@ -106,6 +173,12 @@ declare class GogAccordionChevronDirective {
106
173
  declare class AccordionComponent {
107
174
  private static nextUid;
108
175
  readonly items: _angular_core.InputSignal<GogAccordionItem[]>;
176
+ /**
177
+ * The single size modifier, replacing one `[class.gog-accordion--<size>]` binding per size.
178
+ * Empty for `'lg'`: that is this component's default size, and its tokens are what every
179
+ * `--gog-accordion-*` chain bottoms out at, so it has no modifier rule of its own.
180
+ */
181
+ protected readonly sizeClass: _angular_core.Signal<string>;
109
182
  readonly size: _angular_core.InputSignal<GogSize>;
110
183
  readonly expandFirst: _angular_core.InputSignal<boolean>;
111
184
  readonly multi: _angular_core.InputSignal<boolean>;
@@ -125,7 +198,7 @@ declare class AccordionComponent {
125
198
  * Left unset by default since not every accordion instance represents document structure
126
199
  * (e.g. one nested inside a card).
127
200
  */
128
- readonly headingLevel: _angular_core.InputSignal<4 | 3 | 2 | 5 | 6 | undefined>;
201
+ readonly headingLevel: _angular_core.InputSignal<2 | 3 | 4 | 5 | 6 | undefined>;
129
202
  /**
130
203
  * Two-way bindable set of currently open item ids. Exposed as a model so consumers
131
204
  * can drive the accordion externally (e.g. `[(openIds)]="mySet"`) instead of only
@@ -173,11 +246,21 @@ declare class CollapsibleComponent {
173
246
  /** Two-way bindable open state: `[(open)]="signal"`. */
174
247
  readonly open: _angular_core.ModelSignal<boolean>;
175
248
  readonly disabled: _angular_core.InputSignal<boolean>;
249
+ /**
250
+ * Closes the panel once focus leaves both the trigger and the content — e.g. Tabbing past
251
+ * the last focusable element inside, or a click landing somewhere else on the page. Off by
252
+ * default: plenty of consumers (an FAQ list, a settings section someone reads top to bottom)
253
+ * want the panel to stay open regardless of where focus goes next, so this is opt-in rather
254
+ * than baked in.
255
+ */
256
+ readonly collapseOnFocusOut: _angular_core.InputSignal<boolean>;
257
+ private readonly elementRef;
176
258
  private readonly uid;
177
259
  readonly contentId: _angular_core.Signal<string>;
178
260
  toggle(): void;
261
+ protected onFocusOut(event: FocusEvent): void;
179
262
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<CollapsibleComponent, never>;
180
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<CollapsibleComponent, "gog-collapsible", never, { "open": { "alias": "open"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "open": "openChange"; }, never, ["*"], true, never>;
263
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<CollapsibleComponent, "gog-collapsible", never, { "open": { "alias": "open"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "collapseOnFocusOut": { "alias": "collapseOnFocusOut"; "required": false; "isSignal": true; }; }, { "open": "openChange"; }, never, ["*"], true, never>;
181
264
  }
182
265
 
183
266
  /**
@@ -202,22 +285,1513 @@ declare class GogCollapsibleContentDirective {
202
285
  static ɵdir: _angular_core.ɵɵDirectiveDeclaration<GogCollapsibleContentDirective, "[gogCollapsibleContent]", never, {}, {}, never, never, true, never>;
203
286
  }
204
287
 
205
- declare class CheckboxComponent implements ControlValueAccessor {
288
+ type GogDropdownDirection = 'auto' | 'up' | 'down';
289
+ interface GogDropdownPlacement {
290
+ direction: 'up' | 'down';
291
+ top: number;
292
+ left: number;
293
+ width: number;
294
+ maxHeight: number;
295
+ }
296
+
297
+ /**
298
+ * `'manual'` (default): the field shows `errorMessage` for as long as it is non-empty — the
299
+ * consumer decides when to clear it, e.g.
300
+ * `errorMessage="control.invalid && control.touched ? 'Required' : ''"`.
301
+ *
302
+ * `'auto'`: shown once the attached form control has been touched and is invalid — the
303
+ * consumer only supplies the message text, not the timing. Requires a
304
+ * `[formControl]` / `formControlName` on the element; without one this falls back to
305
+ * `'manual'`, since there is no control state to key off.
306
+ */
307
+ type GogErrorDisplay = 'auto' | 'manual';
308
+
309
+ /**
310
+ * How a collection-driven component reads one field off a consumer's own object.
311
+ *
312
+ * A `string` is a property name, or a dot-path into a nested one (`'profile.city'`). A function
313
+ * is anything else. This is what lets `gog-select` / `gog-multiselect` take a consumer's real
314
+ * DTO instead of forcing everything through a `{ id, name }` shape first.
315
+ */
316
+ type GogOptionAccessor<TOption, TResult> = string | ((option: TOption) => TResult);
317
+ /** Resolves `field` against `source`, following dot-paths (e.g. `"address.city"`). */
318
+ declare function getByPath(source: unknown, field: string): unknown;
319
+ /** Applies an accessor — a property path or a function — to one option. */
320
+ declare function readOption<TOption, TResult>(option: TOption, accessor: GogOptionAccessor<TOption, TResult>): TResult;
321
+ /**
322
+ * Whether two resolved option values refer to the same option.
323
+ *
324
+ * Primitives are compared as strings, so a `formControl` holding `'1'` still matches an option
325
+ * whose value is the number `1` — the library behaved this way before option values could be
326
+ * anything, and forms routinely stringify. Objects are compared by identity instead: coercing
327
+ * them would make every plain object equal to every other (`"[object Object]"`).
328
+ */
329
+ declare function isSameOptionValue(a: unknown, b: unknown): boolean;
330
+
331
+ /**
332
+ * Custom markup for the trigger's chevron, on `gog-select` and `gog-multiselect`:
333
+ *
334
+ * ```html
335
+ * <gog-select [options]="opts">
336
+ * <ng-template gogDropdownChevron><gog-icon name="sort" /></ng-template>
337
+ * </gog-select>
338
+ * ```
339
+ */
340
+ declare class GogDropdownChevronDirective {
341
+ readonly templateRef: TemplateRef<unknown>;
342
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<GogDropdownChevronDirective, never>;
343
+ static ɵdir: _angular_core.ɵɵDirectiveDeclaration<GogDropdownChevronDirective, "[gogDropdownChevron]", never, {}, {}, never, never, true, never>;
344
+ }
345
+ /** Context handed to a `gogDropdownOption` template. */
346
+ interface GogDropdownOptionContext<TOption> {
347
+ /** The consumer's own option object, untouched. */
348
+ $implicit: TOption;
349
+ selected: boolean;
350
+ disabled: boolean;
351
+ /** The resolved label, so a custom row can decorate it rather than re-derive it. */
352
+ label: string;
353
+ }
354
+ /**
355
+ * Custom markup for one option row, on `gog-select` and `gog-multiselect`:
356
+ *
357
+ * ```html
358
+ * <gog-select [options]="users" optionLabel="fullName" optionValue="id" [(value)]="userId">
359
+ * <ng-template gogDropdownOption let-user let-selected="selected">
360
+ * <img [src]="user.avatar" alt="" /> {{ user.fullName }}
361
+ * </ng-template>
362
+ * </gog-select>
363
+ * ```
364
+ */
365
+ declare class GogDropdownOptionDirective<TOption = unknown> {
366
+ readonly templateRef: TemplateRef<GogDropdownOptionContext<TOption>>;
367
+ static ngTemplateContextGuard<TOption>(_dir: GogDropdownOptionDirective<TOption>, ctx: unknown): ctx is GogDropdownOptionContext<TOption>;
368
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<GogDropdownOptionDirective<any>, never>;
369
+ static ɵdir: _angular_core.ɵɵDirectiveDeclaration<GogDropdownOptionDirective<any>, "[gogDropdownOption]", never, {}, {}, never, never, true, never>;
370
+ }
371
+ /**
372
+ * The shape the listbox controls assume when their accessor inputs are left at their defaults.
373
+ *
374
+ * It is no longer required: `optionLabel` / `optionValue` / `optionDisabled` accept any property
375
+ * path or function, so a consumer can pass their own DTO straight through. This interface just
376
+ * describes what the *default* accessors (`'name'` / `'id'` / `'disabled'`) expect to find.
377
+ */
378
+ interface GogDropdownOption {
379
+ id: string | number;
380
+ name: string;
381
+ disabled?: boolean;
382
+ }
383
+ /**
384
+ * Shared behaviour for the listbox-style controls: open/close, placement, the
385
+ * append-to-body overlay, click-outside, keyboard navigation and `ControlValueAccessor`
386
+ * plumbing. Subclasses supply only what actually differs — the value type, the panel
387
+ * markup, and the BEM class names used to find the trigger and the options.
388
+ *
389
+ * Exported because it appears in the public type signatures of the components that
390
+ * extend it; it is not meant to be used or subclassed by consumers.
391
+ */
392
+ declare abstract class GogDropdownBase<TValue, TOption = GogDropdownOption> implements ControlValueAccessor, DoCheck {
393
+ private static nextUid;
394
+ readonly label: _angular_core.InputSignal<string>;
395
+ readonly ariaLabel: _angular_core.InputSignal<string>;
396
+ readonly placeholder: _angular_core.InputSignal<string>;
397
+ readonly options: _angular_core.InputSignal<TOption[]>;
398
+ /**
399
+ * How to read an option's visible text — a property path (`'name'`, `'profile.title'`) or a
400
+ * function. Defaults to `'name'`, matching `GogDropdownOption`.
401
+ */
402
+ readonly optionLabel: _angular_core.InputSignal<GogOptionAccessor<TOption, string>>;
403
+ /**
404
+ * How to read the value this control emits for an option. A property path or a function, or
405
+ * `null` to emit **the option object itself** — which is what lets a consumer keep their own
406
+ * DTO end to end instead of mapping ids back to objects on every change.
407
+ *
408
+ * Defaults to `'id'`, matching `GogDropdownOption`, so existing code is unaffected.
409
+ */
410
+ readonly optionValue: _angular_core.InputSignal<GogOptionAccessor<TOption, unknown> | null>;
411
+ /** How to read whether an option is disabled. Defaults to `'disabled'`. */
412
+ readonly optionDisabled: _angular_core.InputSignal<GogOptionAccessor<TOption, boolean>>;
413
+ /**
414
+ * Whether to offer a clear button once something is selected. Unset, falls back to
415
+ * `GOG_CONFIG.control.clearable`, then to the control's own default.
416
+ */
417
+ readonly clearable: _angular_core.InputSignal<boolean | undefined>;
418
+ /** Accessible name for the clear button. */
419
+ readonly clearAriaLabel: _angular_core.InputSignal<string>;
420
+ /**
421
+ * Smallest width the trigger may shrink to, as any CSS length. Only meaningful with
422
+ * `[fullWidth]="false"`, where the trigger otherwise sizes to whatever is currently selected
423
+ * and can collapse to almost nothing on a short option. Left unset it falls back to the
424
+ * `--gog-{select,multiselect}-min-width` token.
425
+ */
426
+ readonly minWidth: _angular_core.InputSignal<string | null>;
427
+ /**
428
+ * Whether the panel shows a search box that narrows the option list. Unset, falls back to
429
+ * `GOG_CONFIG.dropdown.filter`, then to `false`.
430
+ */
431
+ readonly filter: _angular_core.InputSignal<boolean | undefined>;
432
+ readonly filterPlaceholder: _angular_core.InputSignal<string>;
433
+ /**
434
+ * Which end of the panel the search box sticks to. Named to match `gog-multiselect`'s
435
+ * `controlsPosition`, which is the same idea for its select-all row. Unset, falls back to
436
+ * `GOG_CONFIG.dropdown.filterPosition`, then to `'top'`.
437
+ */
438
+ readonly filterPosition: _angular_core.InputSignal<GogDropdownFilterPosition | undefined>;
439
+ /** Shown in place of the list when the query matches nothing. */
440
+ readonly filterEmptyMessage: _angular_core.InputSignal<string>;
441
+ /**
442
+ * How an option is matched against the query. Left null, the resolved `optionLabel` is
443
+ * matched case-insensitively as a substring — pass a function to search other fields, match
444
+ * on a prefix, or plug in your own fuzzy matcher.
445
+ */
446
+ readonly filterMatch: _angular_core.InputSignal<((option: TOption, query: string) => boolean) | null>;
447
+ readonly errorMessage: _angular_core.InputSignal<string>;
448
+ /**
449
+ * See `GogErrorDisplay`. Unset, falls back to `GOG_CONFIG.control.errorDisplay`, then to
450
+ * `'manual'` — matching every other control in the library.
451
+ */
452
+ readonly errorDisplay: _angular_core.InputSignal<GogErrorDisplay | undefined>;
453
+ /** Unset, falls back to `GOG_CONFIG.control.size`, then to `'md'`. */
454
+ readonly size: _angular_core.InputSignal<GogSize | undefined>;
455
+ /** Unset, falls back to `GOG_CONFIG.dropdown.direction`, then to `'auto'`. */
456
+ readonly dropdownDirection: _angular_core.InputSignal<GogDropdownDirection | undefined>;
457
+ /**
458
+ * Explicit stacking order for the panel. Left unset the panel falls back to the
459
+ * stylesheet's `--gog-dropdown-z`, so the default lives in CSS where a consumer can
460
+ * retheme it, rather than being baked into the component.
461
+ */
462
+ readonly dropdownZIndex: _angular_core.InputSignal<number | null>;
463
+ /**
464
+ * Fixed panel width as any CSS length (`'320px'`, `'40ch'`, `'100%'`, …), applied only
465
+ * when `appendToBody` is set. Left unset the panel matches the trigger's width, same as
466
+ * the inline panel already does via CSS.
467
+ */
468
+ readonly dropdownWidth: _angular_core.InputSignal<string | null>;
469
+ /**
470
+ * Fixed panel max-height as any CSS length, applied only when `appendToBody` is set.
471
+ * `px`, `%` and `vh` also feed the up/down placement math (see `resolveCssLengthPx`); any
472
+ * other unit still renders correctly but is invisible to that heuristic, so the panel may
473
+ * pick the "wrong" side close to a viewport edge. Left unset the panel keeps the existing
474
+ * viewport-derived, auto-flipping height.
475
+ */
476
+ readonly dropdownMaxHeight: _angular_core.InputSignal<string | null>;
477
+ /** Unset, falls back to `GOG_CONFIG.dropdown.appendToBody`, then to `false`. */
478
+ readonly appendToBody: _angular_core.InputSignal<boolean | undefined>;
479
+ readonly disabled: _angular_core.InputSignal<boolean>;
480
+ /**
481
+ * @deprecated since 21.3.0 (2026-08-07) — project an `<ng-template gogDropdownChevron>` into
482
+ * the control instead. Removed in 21.5.0.
483
+ */
484
+ readonly chevronTemplate: _angular_core.InputSignal<TemplateRef<unknown> | null>;
485
+ /** Projected `gogDropdownChevron` template; wins over the deprecated `chevronTemplate`. */
486
+ protected readonly chevronSlot: Signal<GogDropdownChevronDirective | undefined>;
487
+ /**
488
+ * Full width of the container by default, matching every other field-style control.
489
+ * Set to `false` to shrink the trigger to fit its selected label instead.
490
+ */
491
+ readonly fullWidth: _angular_core.InputSignal<boolean>;
492
+ /** Unset, falls back to `GOG_CONFIG.floatLabel.variant`, then to `'none'` (off). */
493
+ readonly floatLabel: _angular_core.InputSignal<GogFloatLabelVariant | undefined>;
494
+ /** Unset, falls back to `GOG_CONFIG.floatLabel.showPlaceholder`, then to `false`. */
495
+ readonly floatLabelShowPlaceholder: _angular_core.InputSignal<boolean | undefined>;
496
+ readonly isOpen: _angular_core.WritableSignal<boolean>;
497
+ /** Projected `gogDropdownOption` template, if the consumer supplied one. */
498
+ protected readonly optionSlot: Signal<GogDropdownOptionDirective<any> | undefined>;
499
+ /** An option's visible text, via `optionLabel`. */
500
+ protected labelOf(option: TOption): string;
501
+ /**
502
+ * The value this control emits for an option, via `optionValue` — or the option object
503
+ * itself when `optionValue` is `null`.
504
+ */
505
+ protected valueOf(option: TOption): unknown;
506
+ /** Whether an option is disabled, via `optionDisabled`. Anything falsy counts as enabled. */
507
+ protected isOptionDisabled(option: TOption): boolean;
508
+ /** Context for a projected `gogDropdownOption` row. */
509
+ protected optionContext(option: TOption, selected: boolean): GogDropdownOptionContext<TOption>;
510
+ /** Shared by both controls to match a resolved option value against the current value. */
511
+ protected sameValue(a: unknown, b: unknown): boolean;
512
+ /** The `<ng-template>` holding the panel markup, rendered inline or into `<body>`. */
513
+ protected abstract readonly panelTemplate: Signal<TemplateRef<unknown> | undefined>;
514
+ /** Declared by the subclass so each control keeps its own value type. */
515
+ protected abstract readonly value: ModelSignal<TValue>;
516
+ /** Value applied when a form writes `null` / the control is reset. */
517
+ protected abstract readonly emptyValue: TValue;
518
+ /** BEM class of one option button, used to collect keyboard-navigable elements. */
519
+ protected abstract readonly optionClass: string;
520
+ /** BEM class of the focusable trigger. */
521
+ protected abstract readonly triggerClass: string;
522
+ /**
523
+ * BEM block that carries the size modifier — `.gog-select` vs `.gog-ms-wrapper`. Separate
524
+ * from `triggerClass` because in `gog-multiselect` the two are different elements.
525
+ */
526
+ protected abstract readonly sizeBlockClass: string;
527
+ /** BEM block of the panel, which repeats the size modifier when appended to `<body>`. */
528
+ protected abstract readonly panelBlockClass: string;
529
+ /** Whether the control currently has a selection — drives the float-label "filled" state. */
530
+ protected abstract readonly hasFloatValue: Signal<boolean>;
531
+ /**
532
+ * Spacing tokens feeding the height estimate. Overridable so each control keeps the
533
+ * `--gog-<block>-*` names it already exposes to consumers for theming.
534
+ */
535
+ protected readonly optionGapToken: string;
536
+ protected readonly optionsPaddingToken: string;
537
+ /** Keep in sync with the real `max-height` on the subclass's `__dropdown` block. */
538
+ protected readonly panelMaxHeightToken: string;
539
+ /** Estimated row height fed into the placement math; not a real layout property. */
540
+ protected readonly optionHeightToken: string;
541
+ /** Unique per-instance suffix, so several dropdowns on a page can't collide on DOM ids. */
542
+ protected readonly uid: number;
543
+ protected readonly elRef: ElementRef<any>;
544
+ protected readonly isBrowser: boolean;
545
+ private readonly document;
546
+ private readonly appRef;
547
+ private readonly destroyRef;
548
+ private readonly ngControl;
549
+ private readonly globalConfig;
550
+ private readonly overlay;
551
+ /** Set from `(focus)`/`(blur)` on the trigger — see `onFocusIn`/`onFocusOut`. */
552
+ protected readonly isFocused: _angular_core.WritableSignal<boolean>;
553
+ /** Instance input → `GOG_CONFIG` → the component's own default. See `resolveConfigured`. */
554
+ protected readonly resolvedSize: Signal<GogSize>;
555
+ protected readonly resolvedErrorDisplay: Signal<GogErrorDisplay>;
556
+ protected readonly resolvedAppendToBody: Signal<boolean>;
557
+ protected readonly resolvedDropdownDirection: Signal<GogDropdownDirection>;
558
+ /**
559
+ * The single size modifier for the wrapper, replacing one `[class.<block>--<size>]` binding
560
+ * per size. Empty for `'md'`: that is the default size and has no modifier rule of its own —
561
+ * every `--gog-<block>-size-*` chain bottoms out at the `md` tokens.
562
+ */
563
+ protected readonly sizeClass: Signal<string>;
564
+ /**
565
+ * Same modifier repeated on the panel, but only when it is appended to `<body>` — outside
566
+ * the component's subtree the panel no longer inherits the wrapper's size tokens, so it has
567
+ * to carry them itself. See the `--portal` blocks in the component stylesheets.
568
+ */
569
+ protected readonly panelSizeClass: Signal<string>;
570
+ private readonly cvaDisabled;
571
+ private readonly errorState;
572
+ protected readonly isDisabled: Signal<boolean>;
573
+ protected readonly dropdownDirectionState: _angular_core.WritableSignal<"up" | "down">;
574
+ protected readonly panelPlacement: _angular_core.WritableSignal<GogDropdownPlacement | null>;
575
+ /**
576
+ * Stacking order to write onto the panel, or null to leave it to the stylesheet.
577
+ *
578
+ * Only needed when appending to `<body>`: an inline panel inherits `--gog-dropdown-z` from
579
+ * its surroundings — which is how a dropdown inside a dialog ends up above the dialog —
580
+ * but an appended one sits outside that subtree and inherits nothing, so the value has
581
+ * to be resolved from the trigger and written out explicitly.
582
+ */
583
+ protected readonly panelZIndex: _angular_core.WritableSignal<number | null>;
584
+ /**
585
+ * Explicit panel width, or null to let it size to its own content.
586
+ *
587
+ * The panel used to be pinned to the trigger's width, which broke a trigger narrower than its
588
+ * options: with `[fullWidth]="false"` the trigger shrinks to the *current* selection, so
589
+ * picking a short option cut the longer ones off in the list. It now sizes to its content with
590
+ * the trigger width as a floor — see `resolvedPanelMinWidth`.
591
+ */
592
+ protected readonly resolvedPanelWidth: Signal<string | null>;
593
+ /** The trigger's width, used as the panel's minimum so it never renders narrower than it. */
594
+ protected readonly resolvedPanelMinWidth: Signal<string | null>;
595
+ /** `dropdownMaxHeight`, or the viewport-derived max-height from `panelPlacement`. */
596
+ protected readonly resolvedPanelMaxHeight: Signal<string | null>;
597
+ protected readonly hasError: Signal<boolean>;
598
+ protected readonly visibleError: Signal<string>;
599
+ /**
600
+ * Each control supplies its own default: `gog-multiselect` shipped a clear button before
601
+ * `clearable` existed, so it keeps one; `gog-select` opts in.
602
+ */
603
+ protected abstract readonly clearableByDefault: boolean;
604
+ private readonly clearableState;
605
+ /** Whether to render the clear button right now — see `GogClearableState`. */
606
+ protected readonly showClear: Signal<boolean>;
607
+ protected readonly resolvedFilter: Signal<boolean>;
608
+ protected readonly resolvedFilterPosition: Signal<GogDropdownFilterPosition>;
609
+ /** Current search text. Cleared whenever the panel closes, so reopening starts fresh. */
610
+ protected readonly filterQuery: _angular_core.WritableSignal<string>;
611
+ /**
612
+ * The options actually rendered. Everything downstream — the loops, the keyboard navigation
613
+ * target list, the panel height estimate, and multiselect's select-all — reads this rather
614
+ * than `options()`, so filtering stays consistent instead of only hiding rows visually.
615
+ */
616
+ protected readonly visibleOptions: Signal<TOption[]>;
617
+ protected onFilterInput(event: Event): void;
618
+ /** Resets the control to its empty value and notifies any attached form. */
619
+ protected clearValue(event: Event): void;
620
+ /**
621
+ * `hasFloatValue` is wrapped in a `computed` rather than passed straight through: these
622
+ * field initializers run before the *subclass's* do, so `this.hasFloatValue` is still
623
+ * undefined right here. The arrow defers the read until the signal is first evaluated, by
624
+ * which time the subclass has assigned it.
625
+ */
626
+ private readonly floatLabelState;
627
+ protected readonly resolvedFloatLabel: Signal<GogFloatLabelVariant>;
628
+ protected readonly isFloatLabelActive: Signal<boolean>;
629
+ protected readonly isFloatLabelFloated: Signal<boolean>;
630
+ protected readonly effectivePlaceholder: Signal<string>;
631
+ /** Measured once per open rather than per scroll tick — see `refreshPanelMetrics`. */
632
+ private optionGap;
633
+ private optionsPadding;
634
+ private maxPanelHeight;
635
+ private optionHeight;
636
+ private repositionFrame;
637
+ private onChangeFn;
638
+ private onTouchedFn;
639
+ constructor();
640
+ /**
641
+ * Binds the click-outside and reposition listeners only for as long as the panel is
642
+ * open. Bound permanently — as host listeners were — every dropdown on the page runs a
643
+ * handler on every document click and every scroll frame, whether or not it is showing
644
+ * anything.
645
+ */
646
+ private bindWhileOpen;
647
+ ngDoCheck(): void;
648
+ writeValue(val: TValue | null): void;
649
+ registerOnChange(fn: (val: TValue) => void): void;
650
+ registerOnTouched(fn: () => void): void;
651
+ setDisabledState(isDisabled: boolean): void;
652
+ /** Bound to `(focus)` on the trigger — only drives the float-label floated state. */
653
+ protected onFocusIn(): void;
654
+ /** Bound to `(blur)` on the trigger — only drives the float-label floated state. */
655
+ protected onFocusOut(): void;
656
+ protected toggle(): void;
657
+ protected open(): void;
658
+ protected close(): void;
659
+ /** Writes a new selection out to both the model and the attached form control. */
660
+ protected commitValue(next: TValue): void;
661
+ protected markTouched(): void;
662
+ private closeIfClickedOutside;
663
+ /**
664
+ * Coalesces bursts of scroll/resize events into one reposition per frame. Placement
665
+ * reads layout, so running it per event is what makes a scroll janky.
666
+ */
667
+ private scheduleReposition;
668
+ /** Jumps from the trigger into the option list on ArrowDown/ArrowUp while open. */
669
+ protected onTriggerArrowKeydown(event: Event): void;
670
+ protected onOptionKeydown(event: KeyboardEvent): void;
671
+ protected focusTrigger(): void;
672
+ /** Extra chrome stacked above the options (e.g. a select-all row), in px. */
673
+ protected extraPanelHeight(): number;
674
+ private enabledOptionElements;
675
+ private attachOverlay;
676
+ /**
677
+ * Reads the spacing tokens that feed the height estimate. Done once per open instead of
678
+ * on every scroll tick, because `getComputedStyle` forces a style recalculation and the
679
+ * tokens cannot change while the panel is on screen.
680
+ */
681
+ private refreshPanelMetrics;
682
+ /**
683
+ * Rough height, used only to choose up/down and to cap `max-height` before the panel
684
+ * has been laid out. Deliberately an estimate: measuring would require rendering the
685
+ * panel first, which is what we are trying to position. A resolvable `dropdownMaxHeight`
686
+ * replaces the row-count guess outright, since it is exact rather than estimated.
687
+ */
688
+ private estimatePanelHeight;
689
+ /**
690
+ * The trigger's own rect, not the whole component's — a label above it or an error
691
+ * message below it sit in normal document flow and are not part of what the panel needs
692
+ * to clear. This also keeps `appendToBody` placement consistent with the inline panel,
693
+ * which is already positioned purely relative to the trigger via CSS.
694
+ */
695
+ private triggerRect;
696
+ /** The stacking order the panel would have had if it were still inside the subtree. */
697
+ private resolvePanelZIndex;
698
+ private updatePlacement;
699
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<GogDropdownBase<any, any>, never>;
700
+ static ɵdir: _angular_core.ɵɵDirectiveDeclaration<GogDropdownBase<any, any>, never, never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; "optionLabel": { "alias": "optionLabel"; "required": false; "isSignal": true; }; "optionValue": { "alias": "optionValue"; "required": false; "isSignal": true; }; "optionDisabled": { "alias": "optionDisabled"; "required": false; "isSignal": true; }; "clearable": { "alias": "clearable"; "required": false; "isSignal": true; }; "clearAriaLabel": { "alias": "clearAriaLabel"; "required": false; "isSignal": true; }; "minWidth": { "alias": "minWidth"; "required": false; "isSignal": true; }; "filter": { "alias": "filter"; "required": false; "isSignal": true; }; "filterPlaceholder": { "alias": "filterPlaceholder"; "required": false; "isSignal": true; }; "filterPosition": { "alias": "filterPosition"; "required": false; "isSignal": true; }; "filterEmptyMessage": { "alias": "filterEmptyMessage"; "required": false; "isSignal": true; }; "filterMatch": { "alias": "filterMatch"; "required": false; "isSignal": true; }; "errorMessage": { "alias": "errorMessage"; "required": false; "isSignal": true; }; "errorDisplay": { "alias": "errorDisplay"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "dropdownDirection": { "alias": "dropdownDirection"; "required": false; "isSignal": true; }; "dropdownZIndex": { "alias": "dropdownZIndex"; "required": false; "isSignal": true; }; "dropdownWidth": { "alias": "dropdownWidth"; "required": false; "isSignal": true; }; "dropdownMaxHeight": { "alias": "dropdownMaxHeight"; "required": false; "isSignal": true; }; "appendToBody": { "alias": "appendToBody"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "chevronTemplate": { "alias": "chevronTemplate"; "required": false; "isSignal": true; }; "fullWidth": { "alias": "fullWidth"; "required": false; "isSignal": true; }; "floatLabel": { "alias": "floatLabel"; "required": false; "isSignal": true; }; "floatLabelShowPlaceholder": { "alias": "floatLabelShowPlaceholder"; "required": false; "isSignal": true; }; }, {}, ["chevronSlot", "optionSlot"], never, true, never>;
701
+ }
702
+
703
+ /**
704
+ * A text field that suggests options as you type.
705
+ *
706
+ * ```html
707
+ * <gog-autocomplete
708
+ * [options]="users"
709
+ * optionLabel="profile.fullName"
710
+ * [optionValue]="null"
711
+ * [(value)]="user"
712
+ * (gogSearch)="load($event)"
713
+ * [loading]="loading()"
714
+ * />
715
+ * ```
716
+ *
717
+ * Shares `GogDropdownBase` with `gog-select` — placement, the append-to-body overlay, the
718
+ * option accessors, float label, error state and `ControlValueAccessor` all come from there.
719
+ * What makes it a separate control rather than a mode of `gog-select` is the trigger: here it
720
+ * is a real `<input>`, which changes the ARIA contract completely. The input keeps DOM focus
721
+ * the whole time and the highlighted option is pointed at with `aria-activedescendant`, where
722
+ * a listbox moves focus onto the option itself.
723
+ */
724
+ declare class AutocompleteComponent<TOption = GogDropdownOption, TValue = string | number | null> extends GogDropdownBase<TValue, TOption> {
725
+ readonly inputId: _angular_core.InputSignal<string>;
726
+ /**
727
+ * Two-way bindable selected value: `[(value)]="signal"`. Carries whatever `optionValue`
728
+ * resolves to — an id by default, or the option object itself when `optionValue` is `null`.
729
+ */
730
+ readonly value: _angular_core.ModelSignal<TValue>;
731
+ /**
732
+ * Whether to narrow `options` in the browser as the user types.
733
+ *
734
+ * Leave it on for a list you already hold. Turn it **off** when `gogSearch` fetches an
735
+ * already-filtered list from a server: filtering that answer a second time against the same
736
+ * query is the classic double-filtering bug, and it silently drops rows whose match the
737
+ * server found in a field this component cannot see.
738
+ */
739
+ readonly filterLocal: _angular_core.InputSignal<boolean>;
740
+ /** How many characters before the panel opens at all. */
741
+ readonly minLength: _angular_core.InputSignal<number | undefined>;
742
+ /** Milliseconds of quiet before `gogSearch` fires. `0` emits on every keystroke. */
743
+ readonly searchDebounce: _angular_core.InputSignal<number | undefined>;
744
+ /** Shows a spinner in the trailing slot — for a server-backed source that is still loading. */
745
+ readonly loading: _angular_core.InputSignal<boolean>;
746
+ /** Shown in place of the list when nothing matches. */
747
+ readonly emptyMessage: _angular_core.InputSignal<string>;
748
+ /**
749
+ * Whether free text that matches no option is discarded when the field loses focus.
750
+ *
751
+ * On (the default) the field always ends up reflecting a real selection: editing is treated
752
+ * as transient, so the current `value` survives keystrokes and Escape or blur snaps the text
753
+ * back to it.
754
+ *
755
+ * Off, what the user typed is itself meaningful — a create-as-you-type flow. The text is left
756
+ * alone on blur and `value` is dropped as soon as it stops matching, so the two never
757
+ * disagree. Read the typed text from `gogSearch` rather than from `value`.
758
+ */
759
+ readonly forceSelection: _angular_core.InputSignal<boolean>;
760
+ /** The current query, debounced. Wire a server-side lookup to this. */
761
+ readonly gogSearch: _angular_core.OutputEmitterRef<string>;
762
+ protected readonly panelTemplate: _angular_core.Signal<TemplateRef<unknown> | undefined>;
763
+ /** A cleared autocomplete is `null`, whatever `TValue` the consumer bound. */
764
+ protected readonly emptyValue: TValue;
765
+ protected readonly optionClass = "gog-autocomplete__option";
766
+ protected readonly triggerClass = "gog-autocomplete__control";
767
+ protected readonly sizeBlockClass = "gog-autocomplete";
768
+ protected readonly panelBlockClass = "gog-autocomplete__dropdown";
769
+ /** Opt-in, matching `gog-select` and `gog-inputfield`. */
770
+ protected readonly clearableByDefault = false;
771
+ protected readonly optionGapToken = "--gog-autocomplete-option-gap";
772
+ protected readonly panelMaxHeightToken = "--gog-autocomplete-panel-max-height";
773
+ protected readonly optionHeightToken = "--gog-autocomplete-option-height";
774
+ private readonly config;
775
+ private readonly ownDestroyRef;
776
+ protected readonly triggerId: _angular_core.Signal<string>;
777
+ protected readonly listboxId: _angular_core.Signal<string>;
778
+ protected readonly labelId: _angular_core.Signal<string>;
779
+ protected readonly errorId: _angular_core.Signal<string | null>;
780
+ protected optionId(index: number): string;
781
+ protected readonly resolvedMinLength: _angular_core.Signal<number>;
782
+ private readonly resolvedDebounce;
783
+ /** What is actually in the `<input>`. Not the same thing as the committed `value`. */
784
+ protected readonly query: _angular_core.WritableSignal<string>;
785
+ /**
786
+ * Which option the arrows have highlighted. `-1` means none — Enter then does nothing rather
787
+ * than committing whichever row happened to be first, which is what stops a fast typist from
788
+ * selecting something they never looked at.
789
+ */
790
+ protected readonly activeIndex: _angular_core.WritableSignal<number>;
791
+ protected readonly selectedOption: _angular_core.Signal<NonNullable<TOption> | null>;
792
+ protected readonly selectedLabel: _angular_core.Signal<string>;
793
+ protected readonly hasFloatValue: _angular_core.Signal<boolean>;
794
+ /**
795
+ * Local filtering, replacing the base's panel-filter behaviour: here the query comes from the
796
+ * trigger, not from a search box inside the panel. Overriding this rather than duplicating a
797
+ * second filtered list keeps the keyboard targets, the empty state and the panel height
798
+ * estimate all reading the same set.
799
+ */
800
+ protected readonly visibleOptions: _angular_core.Signal<TOption[]>;
801
+ protected readonly activeOptionId: _angular_core.Signal<string | null>;
802
+ private searchTimer;
803
+ constructor();
804
+ protected isSelected(option: TOption): boolean;
805
+ protected onInput(event: Event): void;
806
+ /**
807
+ * The input owns its arrow keys; the base's option-focusing handlers are deliberately not
808
+ * wired up here. Moving DOM focus into the list would take the caret out of the field, which
809
+ * is exactly what a combobox must not do.
810
+ */
811
+ protected onInputKeydown(event: KeyboardEvent): void;
812
+ protected onOptionClick(option: TOption, event: MouseEvent): void;
813
+ /**
814
+ * Keeps the caret in the field while an option is clicked. Without it the input blurs first,
815
+ * `forceSelection` wipes the text, and the click lands on a list that has already closed.
816
+ */
817
+ protected onOptionMousedown(event: MouseEvent): void;
818
+ protected onInputFocus(): void;
819
+ protected onInputBlur(): void;
820
+ protected close(): void;
821
+ /** Clearing has to empty the *text* as well; the base only knows about the value. */
822
+ protected clearValue(event: Event): void;
823
+ private pick;
824
+ /** Snaps the field back to whatever `value` holds — the empty string when nothing is picked. */
825
+ private restoreSelectedText;
826
+ private moveActive;
827
+ private setActive;
828
+ private scrollActiveIntoView;
829
+ private scheduleSearch;
830
+ private cancelPendingSearch;
831
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<AutocompleteComponent<any, any>, never>;
832
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<AutocompleteComponent<any, any>, "gog-autocomplete", never, { "inputId": { "alias": "inputId"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "filterLocal": { "alias": "filterLocal"; "required": false; "isSignal": true; }; "minLength": { "alias": "minLength"; "required": false; "isSignal": true; }; "searchDebounce": { "alias": "searchDebounce"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "emptyMessage": { "alias": "emptyMessage"; "required": false; "isSignal": true; }; "forceSelection": { "alias": "forceSelection"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "gogSearch": "gogSearch"; }, never, never, true, never>;
833
+ }
834
+
835
+ /**
836
+ * A count or status dot pinned to the corner of another element.
837
+ *
838
+ * ```html
839
+ * <gog-button gogBadge="12" badgeAriaLabel="12 непрочитанных">Входящие</gog-button>
840
+ * <gog-icon name="info" gogBadge badgeDot />
841
+ * ```
842
+ *
843
+ * A **directive, not a component**, because a badge decorates something that already exists —
844
+ * a button, an icon, an avatar. As a component it would have to wrap its host, which changes
845
+ * that host's layout, and it would duplicate `gog-tag` for the sake of one different radius.
846
+ *
847
+ * It renders **nothing at all** when the value is `0`, `null` or empty and `badgeDot` is off:
848
+ * a badge reading "0" is the defining bug of this component class, so it is not reachable.
849
+ */
850
+ declare class GogBadgeDirective {
851
+ /** The badge content. Numbers above `badgeMax` render as `N+`. */
852
+ readonly gogBadge: _angular_core.InputSignal<string | number | null>;
853
+ readonly badgePosition: _angular_core.InputSignal<GogBadgePosition>;
854
+ /** Reuses the library's semantic colour set — the same four names `gog-tag` takes. */
855
+ readonly badgeVariant: _angular_core.InputSignal<GogTagVariant>;
856
+ /** Renders a bare dot with no text: "something changed here", with no count to give. */
857
+ readonly badgeDot: _angular_core.InputSignalWithTransform<boolean, unknown>;
858
+ readonly badgeMax: _angular_core.InputSignal<number>;
859
+ /** Keeps the badge out of the DOM without removing the directive. */
860
+ readonly badgeHidden: _angular_core.InputSignalWithTransform<boolean, unknown>;
861
+ /**
862
+ * What assistive tech should hear instead of the bare number.
863
+ *
864
+ * Left empty, the badge text is announced inline with the host's own label, which reads as
865
+ * "Входящие 12" — acceptable, and what Material does. Set this and the visible badge becomes
866
+ * `aria-hidden` while this wording is announced in its place, so the host reads as
867
+ * "Входящие, 12 непрочитанных" instead.
868
+ */
869
+ readonly badgeAriaLabel: _angular_core.InputSignal<string>;
870
+ private readonly hostRef;
871
+ private readonly renderer;
872
+ private readonly isBrowser;
873
+ private badgeEl;
874
+ private descriptionEl;
875
+ /** `0` and `''` count as "nothing to show" — see the class comment. */
876
+ private readonly hasContent;
877
+ protected readonly visible: _angular_core.Signal<boolean>;
878
+ protected readonly text: _angular_core.Signal<string>;
879
+ private readonly classNames;
880
+ constructor();
881
+ private render;
882
+ private removeDescription;
883
+ private teardown;
884
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<GogBadgeDirective, never>;
885
+ static ɵdir: _angular_core.ɵɵDirectiveDeclaration<GogBadgeDirective, "[gogBadge]", never, { "gogBadge": { "alias": "gogBadge"; "required": false; "isSignal": true; }; "badgePosition": { "alias": "badgePosition"; "required": false; "isSignal": true; }; "badgeVariant": { "alias": "badgeVariant"; "required": false; "isSignal": true; }; "badgeDot": { "alias": "badgeDot"; "required": false; "isSignal": true; }; "badgeMax": { "alias": "badgeMax"; "required": false; "isSignal": true; }; "badgeHidden": { "alias": "badgeHidden"; "required": false; "isSignal": true; }; "badgeAriaLabel": { "alias": "badgeAriaLabel"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
886
+ }
887
+
888
+ type GogIconName = 'check' | 'close' | 'chevron-up' | 'chevron-down' | 'chevron-left' | 'chevron-right' | 'calendar' | 'clock' | 'sort' | 'sort-up' | 'sort-down' | 'success' | 'error' | 'warning' | 'info' | 'checkbox' | 'checkbox-checked' | 'eye' | 'eye-off';
889
+ declare const ICON_DEFS: Record<GogIconName, string>;
890
+
891
+ declare class IconComponent {
892
+ private readonly sanitizer;
893
+ readonly name: _angular_core.InputSignal<GogIconName>;
894
+ readonly template: _angular_core.InputSignal<TemplateRef<unknown> | null>;
895
+ readonly title: _angular_core.InputSignal<string>;
896
+ readonly ariaHidden: _angular_core.InputSignal<boolean>;
897
+ protected readonly ariaLabel: _angular_core.Signal<string | null>;
898
+ protected readonly iconSvg: _angular_core.Signal<_angular_platform_browser.SafeHtml>;
899
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<IconComponent, never>;
900
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<IconComponent, "gog-icon", never, { "name": { "alias": "name"; "required": false; "isSignal": true; }; "template": { "alias": "template"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; "ariaHidden": { "alias": "ariaHidden"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
901
+ }
902
+
903
+ /** Context handed to a `gogButtonToggleOption` template. */
904
+ interface GogButtonToggleOptionContext<TOption> {
905
+ /** The consumer's own option object, untouched. */
906
+ $implicit: TOption;
907
+ selected: boolean;
908
+ disabled: boolean;
909
+ /** The resolved label, so custom markup can decorate it rather than re-derive it. */
910
+ label: string;
911
+ }
912
+ /**
913
+ * Custom markup for one button in the group:
914
+ *
915
+ * ```html
916
+ * <gog-button-toggle-group [options]="views">
917
+ * <ng-template gogButtonToggleOption let-view let-selected="selected">
918
+ * <gog-icon [name]="view.icon" /> {{ view.title }}
919
+ * </ng-template>
920
+ * </gog-button-toggle-group>
921
+ * ```
922
+ */
923
+ declare class GogButtonToggleOptionDirective<TOption = unknown> {
924
+ readonly templateRef: TemplateRef<GogButtonToggleOptionContext<TOption>>;
925
+ static ngTemplateContextGuard<TOption>(_dir: GogButtonToggleOptionDirective<TOption>, ctx: unknown): ctx is GogButtonToggleOptionContext<TOption>;
926
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<GogButtonToggleOptionDirective<any>, never>;
927
+ static ɵdir: _angular_core.ɵɵDirectiveDeclaration<GogButtonToggleOptionDirective<any>, "[gogButtonToggleOption]", never, {}, {}, never, never, true, never>;
928
+ }
929
+ /**
930
+ * A row of buttons where one — or, with `multiple`, several — can be picked.
931
+ *
932
+ * ```html
933
+ * <gog-button-toggle-group [options]="alignments" [(value)]="align" />
934
+ * <gog-button-toggle-group [options]="tools" [multiple]="true" [(value)]="active" />
935
+ * ```
936
+ *
937
+ * Takes the consumer's own objects through `optionLabel` / `optionValue` / `optionDisabled`
938
+ * accessors — the same ones `gog-select` uses — rather than a fixed `{ id, label }` shape.
939
+ *
940
+ * **Single and multiple are different widgets to assistive tech, not a cosmetic switch.**
941
+ * Single mode is a radio group: `role="radiogroup"` / `role="radio"` with `aria-checked`, and
942
+ * the arrow keys move *and* select, because that is what a radio group does. Multiple mode is
943
+ * a toolbar of independent toggles: `role="group"` with `aria-pressed`, arrows only move and
944
+ * Space toggles. Getting this backwards is the usual defect in this component.
945
+ */
946
+ declare class ButtonToggleGroupComponent<TOption = unknown, TValue = unknown> implements ControlValueAccessor {
947
+ readonly options: _angular_core.InputSignal<TOption[]>;
948
+ readonly optionLabel: _angular_core.InputSignal<GogOptionAccessor<TOption, string>>;
949
+ /**
950
+ * How an option turns into the emitted value. `null` emits the **option object itself**,
951
+ * exactly as `gog-select` does, so a consumer's DTO survives the round trip.
952
+ */
953
+ readonly optionValue: _angular_core.InputSignal<GogOptionAccessor<TOption, unknown> | null>;
954
+ readonly optionDisabled: _angular_core.InputSignal<GogOptionAccessor<TOption, boolean>>;
955
+ /** Optional leading icon per option. Unset means no icons anywhere in the group. */
956
+ readonly optionIcon: _angular_core.InputSignal<GogOptionAccessor<TOption, GogIconName | null> | null>;
957
+ /** Whether more than one option can be active at a time. */
958
+ readonly multiple: _angular_core.InputSignal<boolean>;
959
+ readonly appearance: _angular_core.InputSignal<GogButtonToggleAppearance>;
960
+ readonly orientation: _angular_core.InputSignal<GogOrientation>;
961
+ /** Unset, falls back to `GOG_CONFIG.control.size`, then to `'md'`. */
962
+ readonly size: _angular_core.InputSignal<GogSize | undefined>;
963
+ readonly disabled: _angular_core.InputSignal<boolean>;
964
+ readonly fullWidth: _angular_core.InputSignal<boolean>;
965
+ readonly ariaLabel: _angular_core.InputSignal<string>;
966
+ /**
967
+ * Two-way bindable selection: `[(value)]="signal"`. A single value in single mode, an array
968
+ * in `multiple` mode. Also drivable through `formControl` / `formControlName`.
969
+ */
970
+ readonly value: _angular_core.ModelSignal<TValue | TValue[] | null>;
971
+ protected readonly optionSlot: _angular_core.Signal<GogButtonToggleOptionDirective<any> | undefined>;
972
+ private readonly buttonRefs;
973
+ private readonly ngControl;
974
+ private readonly cvaDisabled;
975
+ private readonly globalConfig;
976
+ /** Instance input → `GOG_CONFIG` → the component's own default. See `resolveConfigured`. */
977
+ protected readonly resolvedSize: _angular_core.Signal<GogSize>;
978
+ protected readonly isDisabled: _angular_core.Signal<boolean>;
979
+ /** The current selection as an array, whatever mode the group is in. */
980
+ private readonly selectedValues;
981
+ protected readonly hostClasses: _angular_core.Signal<string>;
982
+ /**
983
+ * A roving tabindex: the group is one tab stop and the arrows move within it. The *selected*
984
+ * option is the one that keeps `tabindex="0"` so Tab returns to where the user left off;
985
+ * with nothing selected, the first enabled option takes it, since a group nobody can Tab
986
+ * into is unreachable by keyboard.
987
+ */
988
+ protected readonly tabStopIndex: _angular_core.Signal<number>;
989
+ private onChange;
990
+ private onTouched;
991
+ constructor();
992
+ writeValue(val: TValue | TValue[] | null): void;
993
+ registerOnChange(fn: (val: TValue | TValue[] | null) => void): void;
994
+ registerOnTouched(fn: () => void): void;
995
+ setDisabledState(isDisabled: boolean): void;
996
+ protected labelOf(option: TOption): string;
997
+ protected iconOf(option: TOption): GogIconName | null;
998
+ protected valueOf(option: TOption): unknown;
999
+ protected isOptionDisabled(option: TOption): boolean;
1000
+ protected isSelected(option: TOption): boolean;
1001
+ protected optionContext(option: TOption): GogButtonToggleOptionContext<TOption>;
1002
+ protected onOptionClick(option: TOption): void;
1003
+ /**
1004
+ * Arrow keys. In single mode moving also selects — that is the radio-group contract, and it
1005
+ * is why `role="radio"` is only used there. In multiple mode the arrows are pure navigation
1006
+ * and Space/Enter (handled natively by the `<button>`) does the toggling.
1007
+ */
1008
+ protected onKeydown(event: KeyboardEvent): void;
1009
+ protected onBlur(): void;
1010
+ private commit;
1011
+ private setValue;
1012
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<ButtonToggleGroupComponent<any, any>, never>;
1013
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<ButtonToggleGroupComponent<any, any>, "gog-button-toggle-group", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; "optionLabel": { "alias": "optionLabel"; "required": false; "isSignal": true; }; "optionValue": { "alias": "optionValue"; "required": false; "isSignal": true; }; "optionDisabled": { "alias": "optionDisabled"; "required": false; "isSignal": true; }; "optionIcon": { "alias": "optionIcon"; "required": false; "isSignal": true; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "appearance": { "alias": "appearance"; "required": false; "isSignal": true; }; "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "fullWidth": { "alias": "fullWidth"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, ["optionSlot"], never, true, never>;
1014
+ }
1015
+
1016
+ /**
1017
+ * Marks a tab's content as **lazy**: it is built the first time the tab is shown, and kept
1018
+ * alive afterwards.
1019
+ *
1020
+ * ```html
1021
+ * <gog-tab label="Отчёт">
1022
+ * <ng-template gogTabContent><app-expensive-report /></ng-template>
1023
+ * </gog-tab>
1024
+ * ```
1025
+ *
1026
+ * Without it, content written directly inside `<gog-tab>` renders immediately and is merely
1027
+ * hidden while inactive — which is what you want for cheap content, because it preserves
1028
+ * scroll position, un-submitted input and any state the DOM is holding. Which behaviour you
1029
+ * get is decided by whether this template is present; there is no `lazy` input to keep in sync.
1030
+ */
1031
+ declare class GogTabContentDirective {
1032
+ readonly templateRef: TemplateRef<unknown>;
1033
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<GogTabContentDirective, never>;
1034
+ static ɵdir: _angular_core.ɵɵDirectiveDeclaration<GogTabContentDirective, "[gogTabContent]", never, {}, {}, never, never, true, never>;
1035
+ }
1036
+ /**
1037
+ * One tab inside a `<gog-tabs>`. Declares its own header text and holds its own content.
1038
+ *
1039
+ * ```html
1040
+ * <gog-tabs>
1041
+ * <gog-tab label="Профиль"><app-profile /></gog-tab>
1042
+ * <gog-tab label="Настройки" iconName="info" [disabled]="!canEdit">…</gog-tab>
1043
+ * </gog-tabs>
1044
+ * ```
1045
+ */
1046
+ declare class TabComponent {
1047
+ private static nextUid;
1048
+ private readonly uid;
1049
+ /** Header text. */
1050
+ readonly label: _angular_core.InputSignal<string>;
1051
+ /** Optional leading icon in the header. */
1052
+ readonly iconName: _angular_core.InputSignal<GogIconName | null>;
1053
+ readonly disabled: _angular_core.InputSignal<boolean>;
1054
+ readonly panelId: string;
1055
+ readonly headerId: string;
1056
+ private readonly tabsState;
1057
+ /** Identity comparison against the group's current tab — no index bookkeeping either side. */
1058
+ readonly active: _angular_core.Signal<boolean>;
1059
+ protected readonly lazySlot: _angular_core.Signal<GogTabContentDirective | undefined>;
1060
+ /**
1061
+ * Latches on first activation and never resets, so a lazy tab pays its build cost once and
1062
+ * then behaves like an eager one — revisiting it does not rebuild the subtree or lose what
1063
+ * the user typed into it.
1064
+ */
1065
+ private readonly everActivated;
1066
+ protected readonly shouldRenderLazy: _angular_core.Signal<boolean>;
1067
+ constructor();
1068
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<TabComponent, never>;
1069
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<TabComponent, "gog-tab", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "iconName": { "alias": "iconName"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, {}, ["lazySlot"], ["*"], true, never>;
1070
+ }
1071
+
1072
+ /**
1073
+ * What a `gog-tab` needs from the `gog-tabs` it sits in: which tab is currently showing.
1074
+ *
1075
+ * A token rather than injecting the component directly, purely to keep the import graph
1076
+ * acyclic — `tabs.component.ts` has to import `TabComponent` for its `contentChildren`, so the
1077
+ * tab cannot import the group back. Both sides depend on this file, which depends on neither.
1078
+ */
1079
+ interface GogTabsState {
1080
+ /** The active tab instance, compared by identity. `null` when the group has no tabs. */
1081
+ readonly activeTab: Signal<unknown | null>;
1082
+ }
1083
+ declare const GOG_TABS_STATE: InjectionToken<GogTabsState>;
1084
+
1085
+ /** Context handed to a `gogTabHeader` template. */
1086
+ interface GogTabHeaderContext {
1087
+ /** The `gog-tab` this header belongs to. */
1088
+ $implicit: TabComponent;
1089
+ active: boolean;
1090
+ disabled: boolean;
1091
+ index: number;
1092
+ }
1093
+ /**
1094
+ * Custom markup for a tab's header button:
1095
+ *
1096
+ * ```html
1097
+ * <gog-tabs>
1098
+ * <ng-template gogTabHeader let-tab let-active="active">
1099
+ * {{ tab.label() }} <gog-tag *ngIf="active">•</gog-tag>
1100
+ * </ng-template>
1101
+ * <gog-tab label="Входящие">…</gog-tab>
1102
+ * </gog-tabs>
1103
+ * ```
1104
+ */
1105
+ declare class GogTabHeaderDirective {
1106
+ readonly templateRef: TemplateRef<GogTabHeaderContext>;
1107
+ static ngTemplateContextGuard(_dir: GogTabHeaderDirective, ctx: unknown): ctx is GogTabHeaderContext;
1108
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<GogTabHeaderDirective, never>;
1109
+ static ɵdir: _angular_core.ɵɵDirectiveDeclaration<GogTabHeaderDirective, "[gogTabHeader]", never, {}, {}, never, never, true, never>;
1110
+ }
1111
+ /**
1112
+ * A tablist over projected `<gog-tab>` children.
1113
+ *
1114
+ * ```html
1115
+ * <gog-tabs [(activeIndex)]="index" align="start">
1116
+ * <gog-tab label="Профиль"><app-profile /></gog-tab>
1117
+ * <gog-tab label="Настройки"><app-settings /></gog-tab>
1118
+ * </gog-tabs>
1119
+ * ```
1120
+ *
1121
+ * The header row is built from each tab's own `label` / `iconName` / `disabled`, so a tab is
1122
+ * declared in exactly one place. Overflowing headers scroll inside a `<gog-scroll>` rather than
1123
+ * a native `overflow-x`, per the library's styling contract — a native scrollbar is the one
1124
+ * piece of chrome no `--gog-*` token can reach.
1125
+ */
1126
+ declare class TabsComponent implements GogTabsState {
1127
+ readonly tabs: _angular_core.Signal<readonly TabComponent[]>;
1128
+ /** Two-way bindable index of the visible tab: `[(activeIndex)]="signal"`. */
1129
+ readonly activeIndex: _angular_core.ModelSignal<number>;
1130
+ readonly align: _angular_core.InputSignal<GogTabsAlign>;
1131
+ readonly orientation: _angular_core.InputSignal<GogOrientation>;
1132
+ readonly size: _angular_core.InputSignal<GogSize>;
1133
+ readonly fullWidth: _angular_core.InputSignal<boolean>;
1134
+ readonly ariaLabel: _angular_core.InputSignal<string>;
1135
+ /** Emits the newly active index whenever it changes, including via keyboard. */
1136
+ readonly gogTabChange: _angular_core.OutputEmitterRef<number>;
1137
+ protected readonly headerSlot: _angular_core.Signal<GogTabHeaderDirective | undefined>;
1138
+ private readonly headerRefs;
1139
+ /**
1140
+ * The index actually shown. Clamped, and never a disabled tab: `activeIndex` is a plain
1141
+ * number a consumer can set to anything, and silently showing nothing would be worse than
1142
+ * falling back to the nearest usable tab.
1143
+ */
1144
+ protected readonly resolvedIndex: _angular_core.Signal<number>;
1145
+ /** Read by each `gog-tab` through `GOG_TABS_STATE`; see `tabs-state.ts`. */
1146
+ readonly activeTab: _angular_core.Signal<TabComponent | null>;
1147
+ protected readonly hostClasses: _angular_core.Signal<string>;
1148
+ protected selectIndex(index: number): void;
1149
+ protected headerContext(tab: TabComponent, index: number): GogTabHeaderContext;
1150
+ /**
1151
+ * Arrows move focus and activate in one step — the "automatic activation" variant of the
1152
+ * ARIA tabs pattern, which suits panels that are already in the DOM. Home/End jump to the
1153
+ * first/last enabled tab.
1154
+ */
1155
+ protected onHeaderKeydown(event: KeyboardEvent): void;
1156
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<TabsComponent, never>;
1157
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<TabsComponent, "gog-tabs", never, { "activeIndex": { "alias": "activeIndex"; "required": false; "isSignal": true; }; "align": { "alias": "align"; "required": false; "isSignal": true; }; "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "fullWidth": { "alias": "fullWidth"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, { "activeIndex": "activeIndexChange"; "gogTabChange": "gogTabChange"; }, ["tabs", "headerSlot"], ["*"], true, never>;
1158
+ }
1159
+
1160
+ /**
1161
+ * Custom markup for the checkbox's tick:
1162
+ *
1163
+ * ```html
1164
+ * <ng-template gogCheckboxIcon><my-icon /></ng-template>
1165
+ * ```
1166
+ */
1167
+ declare class GogCheckboxIconDirective {
1168
+ readonly templateRef: TemplateRef<unknown>;
1169
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<GogCheckboxIconDirective, never>;
1170
+ static ɵdir: _angular_core.ɵɵDirectiveDeclaration<GogCheckboxIconDirective, "[gogCheckboxIcon]", never, {}, {}, never, never, true, never>;
1171
+ }
1172
+ declare class CheckboxComponent implements ControlValueAccessor {
1173
+ readonly label: _angular_core.InputSignal<string>;
1174
+ readonly ariaLabel: _angular_core.InputSignal<string>;
1175
+ /** Unset, falls back to `GOG_CONFIG.control.size`, then to `'md'`. */
1176
+ readonly size: _angular_core.InputSignal<GogSize | undefined>;
1177
+ readonly indeterminate: _angular_core.InputSignal<boolean>;
1178
+ readonly disabled: _angular_core.InputSignal<boolean>;
1179
+ readonly fullWidth: _angular_core.InputSignal<boolean>;
1180
+ /**
1181
+ * @deprecated since 21.3.0 (2026-08-07) — project an `<ng-template gogCheckboxIcon>` into the component instead. Removed in 21.5.0.
1182
+ */
1183
+ readonly checkIconTemplate: _angular_core.InputSignal<TemplateRef<unknown> | null>;
1184
+ /** Projected `gogCheckboxIcon` template; wins over the deprecated `checkIconTemplate` input. */
1185
+ protected readonly checkIconSlot: _angular_core.Signal<GogCheckboxIconDirective | undefined>;
1186
+ /**
1187
+ * Two-way bindable checked state: `[(checked)]="signal"`.
1188
+ * This is the same state Angular Forms drives via `writeValue`/`registerOnChange`
1189
+ * when the component is used with `formControlName`/`[formControl]`.
1190
+ * Don't wire both a form directive AND `[(checked)]` to the same instance —
1191
+ * pick one, otherwise you end up with two competing sources of truth.
1192
+ */
1193
+ readonly checked: _angular_core.ModelSignal<boolean>;
1194
+ private readonly globalConfig;
1195
+ /** Instance input → `GOG_CONFIG` → the component's own default. See `resolveConfigured`. */
1196
+ protected readonly resolvedSize: _angular_core.Signal<GogSize>;
1197
+ protected readonly controlSize: _angular_core.Signal<{
1198
+ readonly boxSize: "var(--gog-control-checkbox-box-size-xsm, 12px)";
1199
+ readonly labelSize: "var(--gog-control-checkbox-label-size-xsm, 0.6875rem)";
1200
+ readonly indicatorSize: "var(--gog-control-checkbox-icon-size-xsm, 10px)";
1201
+ } | {
1202
+ readonly boxSize: "var(--gog-control-checkbox-box-size-sm, 18px)";
1203
+ readonly labelSize: "var(--gog-control-checkbox-label-size-sm, 0.8125rem)";
1204
+ readonly indicatorSize: "var(--gog-control-checkbox-icon-size-sm, 12px)";
1205
+ } | {
1206
+ readonly boxSize: "var(--gog-control-checkbox-box-size-md, 24px)";
1207
+ readonly labelSize: "var(--gog-control-checkbox-label-size-md, 0.9375rem)";
1208
+ readonly indicatorSize: "var(--gog-control-checkbox-icon-size-md, 14px)";
1209
+ } | {
1210
+ readonly boxSize: "var(--gog-control-checkbox-box-size-lg, 32px)";
1211
+ readonly labelSize: "var(--gog-control-checkbox-label-size-lg, 1.0625rem)";
1212
+ readonly indicatorSize: "var(--gog-control-checkbox-icon-size-lg, 18px)";
1213
+ } | {
1214
+ readonly boxSize: "var(--gog-control-checkbox-box-size-slg, 40px)";
1215
+ readonly labelSize: "var(--gog-control-checkbox-label-size-slg, 1.1875rem)";
1216
+ readonly indicatorSize: "var(--gog-control-checkbox-icon-size-slg, 22px)";
1217
+ }>;
1218
+ protected readonly boxSize: _angular_core.Signal<"var(--gog-control-checkbox-box-size-xsm, 12px)" | "var(--gog-control-checkbox-box-size-sm, 18px)" | "var(--gog-control-checkbox-box-size-md, 24px)" | "var(--gog-control-checkbox-box-size-lg, 32px)" | "var(--gog-control-checkbox-box-size-slg, 40px)">;
1219
+ protected readonly checkboxPadding = "var(--gog-control-checkbox-padding, 6px)";
1220
+ protected readonly labelSize: _angular_core.Signal<"var(--gog-control-checkbox-label-size-xsm, 0.6875rem)" | "var(--gog-control-checkbox-label-size-sm, 0.8125rem)" | "var(--gog-control-checkbox-label-size-md, 0.9375rem)" | "var(--gog-control-checkbox-label-size-lg, 1.0625rem)" | "var(--gog-control-checkbox-label-size-slg, 1.1875rem)">;
1221
+ protected readonly iconSize: _angular_core.Signal<"var(--gog-control-checkbox-icon-size-xsm, 10px)" | "var(--gog-control-checkbox-icon-size-sm, 12px)" | "var(--gog-control-checkbox-icon-size-md, 14px)" | "var(--gog-control-checkbox-icon-size-lg, 18px)" | "var(--gog-control-checkbox-icon-size-slg, 22px)">;
1222
+ private readonly ngControl;
1223
+ private readonly cvaDisabled;
1224
+ protected readonly isDisabled: _angular_core.Signal<boolean>;
1225
+ constructor();
1226
+ writeValue(val: boolean): void;
1227
+ registerOnChange(fn: (val: boolean) => void): void;
1228
+ registerOnTouched(fn: () => void): void;
1229
+ setDisabledState(isDisabled: boolean): void;
1230
+ onInputChange(event: Event): void;
1231
+ onBlur(): void;
1232
+ private onCheckedChange;
1233
+ private onTouched;
1234
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<CheckboxComponent, never>;
1235
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<CheckboxComponent, "gog-checkbox", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "indeterminate": { "alias": "indeterminate"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "fullWidth": { "alias": "fullWidth"; "required": false; "isSignal": true; }; "checkIconTemplate": { "alias": "checkIconTemplate"; "required": false; "isSignal": true; }; "checked": { "alias": "checked"; "required": false; "isSignal": true; }; }, { "checked": "checkedChange"; }, ["checkIconSlot"], never, true, never>;
1236
+ }
1237
+
1238
+ /**
1239
+ * Every date calculation `gog-datepicker` and `gog-calendar` do, as pure functions.
1240
+ *
1241
+ * Kept out of the components so the arithmetic is testable without a fixture, and so a range
1242
+ * calculation is written once rather than once per selection mode.
1243
+ *
1244
+ * **Everything here works in local time.** Nothing round-trips through `toISOString()` or
1245
+ * compares `Date` objects directly: an ISO round trip converts to UTC, which moves the date
1246
+ * across midnight for anyone east or west of Greenwich, and two `Date`s for "the same day"
1247
+ * are almost never equal because they carry different times. Comparisons go through
1248
+ * `startOfDay` and `isSameDay` instead. This is the single most common defect in a datepicker.
1249
+ */
1250
+ /** A start/end pair. `end` is null while a range is half-picked. */
1251
+ interface GogDateRange {
1252
+ start: Date | null;
1253
+ end: Date | null;
1254
+ }
1255
+ /** Midnight local time on the same calendar day. */
1256
+ declare function startOfDay(date: Date): Date;
1257
+ /** Whether two dates fall on the same calendar day, ignoring the time of day. */
1258
+ declare function isSameDay(a: Date | null, b: Date | null): boolean;
1259
+ /** Whether two dates fall in the same calendar month. */
1260
+ declare function isSameMonth(a: Date | null, b: Date | null): boolean;
1261
+ declare function addDays(date: Date, days: number): Date;
1262
+ /** Days in a given month. `month` is 0-based, as `Date` uses it. */
1263
+ declare function daysInMonth(year: number, month: number): number;
1264
+ /**
1265
+ * Adds whole months, **clamping the day** to the target month's length: 31 January plus one
1266
+ * month is 28 February, not 3 March. `Date.setMonth` does the latter, which is why this is
1267
+ * not a one-liner.
1268
+ */
1269
+ declare function addMonths(date: Date, months: number): Date;
1270
+ declare function addYears(date: Date, years: number): Date;
1271
+ /** Day-granularity comparison: `a` is strictly before `b`'s day. */
1272
+ declare function isBeforeDay(a: Date, b: Date): boolean;
1273
+ /** Day-granularity comparison: `a` is strictly after `b`'s day. */
1274
+ declare function isAfterDay(a: Date, b: Date): boolean;
1275
+ /** Whether `date`'s day falls within `[min, max]`, either bound optional. */
1276
+ declare function isWithinBounds(date: Date, min: Date | null, max: Date | null): boolean;
1277
+ /** Whether `date`'s day falls inside a range, inclusive of both ends. */
1278
+ declare function isInRange(date: Date, start: Date | null, end: Date | null): boolean;
1279
+ /** Pulls `date` inside `[min, max]`, keeping its time of day. */
1280
+ declare function clampDate(date: Date, min: Date | null, max: Date | null): Date;
1281
+ /** A new date on `day`'s calendar day carrying `time`'s clock. */
1282
+ declare function copyTimeOnto(day: Date, time: Date): Date;
1283
+ /** A new date on the same day with the clock replaced. */
1284
+ declare function withTime(date: Date, hours: number, minutes: number, seconds?: number): Date;
1285
+ /**
1286
+ * The six-week grid a month is drawn on, always 6×7 so the calendar's height never changes as
1287
+ * you page through months — a grid that grows and shrinks pushes the rest of the page around
1288
+ * and moves the button you were about to click.
1289
+ *
1290
+ * `firstDayOfWeek` is 0 (Sunday) to 6 (Saturday). Leading and trailing cells come from the
1291
+ * neighbouring months, as every calendar does.
1292
+ */
1293
+ declare function buildMonthGrid(year: number, month: number, firstDayOfWeek: number): Date[][];
1294
+ /** Weekday names in `locale`, rotated so `firstDayOfWeek` comes first. */
1295
+ declare function weekdayNames(locale: string, firstDayOfWeek: number, style?: 'short' | 'narrow' | 'long'): string[];
1296
+ /** Month names in `locale`. */
1297
+ declare function monthNames(locale: string, style?: 'long' | 'short'): string[];
1298
+ /**
1299
+ * The first day of the week for a locale, from `Intl.Locale.prototype.getWeekInfo` where the
1300
+ * engine has it, falling back to Monday.
1301
+ *
1302
+ * `getWeekInfo` reports 1–7 with 1 = Monday and 7 = Sunday; `Date.getDay()` uses 0 = Sunday.
1303
+ * Converting between the two is exactly the kind of off-by-one that silently shifts a whole
1304
+ * calendar by a day, which is why it happens here once.
1305
+ */
1306
+ declare function localeFirstDayOfWeek(locale: string): number;
1307
+ /**
1308
+ * Formats a date against a token pattern.
1309
+ *
1310
+ * Supported tokens: `yyyy`, `MM`, `dd`, `HH` (24h), `hh` (12h), `mm`, `ss`, `a` (AM/PM).
1311
+ * Anything else is copied through literally.
1312
+ *
1313
+ * Deliberately **not** `Intl.DateTimeFormat`: this pattern is also what `parseDate` reads, and
1314
+ * a formatter whose output cannot be parsed back is how a typed date silently becomes a
1315
+ * different one. `Intl` is still used for month and weekday *names*, which are never parsed.
1316
+ */
1317
+ declare function formatDate(date: Date, pattern: string): string;
1318
+ /**
1319
+ * Reads a date back out of text written in `pattern`. Returns `null` when the text doesn't
1320
+ * match, or matches but isn't a real date (`31.02.2026`).
1321
+ *
1322
+ * The out-of-range check matters: `new Date(2026, 1, 31)` happily rolls over to 3 March, so a
1323
+ * typo would be accepted as a different date rather than rejected.
1324
+ */
1325
+ declare function parseDate(text: string, pattern: string): Date | null;
1326
+
1327
+ /** What `gog-calendar` and `gog-datepicker` carry, depending on `selectionMode`. */
1328
+ type GogDatepickerValue = Date | GogDateRange | null;
1329
+ /** One rendered day cell. Precomputed so the template stays free of logic. */
1330
+ interface GogCalendarDay {
1331
+ date: Date;
1332
+ label: string;
1333
+ outside: boolean;
1334
+ today: boolean;
1335
+ disabled: boolean;
1336
+ selected: boolean;
1337
+ rangeStart: boolean;
1338
+ rangeEnd: boolean;
1339
+ inRange: boolean;
1340
+ }
1341
+ /**
1342
+ * The month grid behind `gog-datepicker`, usable on its own for an always-visible calendar.
1343
+ *
1344
+ * ```html
1345
+ * <gog-calendar [(value)]="date" [min]="today" />
1346
+ * <gog-calendar selectionMode="range" [(value)]="range" [numberOfMonths]="2" />
1347
+ * ```
1348
+ *
1349
+ * Split out from the field deliberately: `gog-datepicker` is three widgets (a date, a range
1350
+ * and a time) behind one selector, and keeping the grid separate is what stops either half
1351
+ * from becoming unreadable. It is also exactly what `inline` mode renders.
1352
+ */
1353
+ declare class CalendarComponent {
1354
+ /** Two-way bindable selection: a `Date` in `'single'` mode, a `GogDateRange` in `'range'`. */
1355
+ readonly value: _angular_core.ModelSignal<GogDatepickerValue>;
1356
+ readonly selectionMode: _angular_core.InputSignal<GogDateSelectionMode>;
1357
+ readonly min: _angular_core.InputSignal<Date | null>;
1358
+ readonly max: _angular_core.InputSignal<Date | null>;
1359
+ /**
1360
+ * Extra exclusions, as a predicate rather than a list: an array cannot express "weekends"
1361
+ * or "public holidays" without the consumer materialising every date in range first.
1362
+ */
1363
+ readonly disabledDates: _angular_core.InputSignal<((date: Date) => boolean) | null>;
1364
+ /** BCP-47 tag driving the month and weekday names. */
1365
+ readonly locale: _angular_core.InputSignal<string>;
1366
+ /** 0 = Sunday … 6 = Saturday. Unset, it comes from the locale. */
1367
+ readonly firstDayOfWeek: _angular_core.InputSignal<number | null>;
1368
+ /** Which month to open on when there is no selection yet. */
1369
+ readonly defaultMonth: _angular_core.InputSignal<Date | null>;
1370
+ /** How many months to show side by side. Two is what makes a range picker usable. */
1371
+ readonly numberOfMonths: _angular_core.InputSignal<number>;
1372
+ readonly showTime: _angular_core.InputSignal<boolean>;
1373
+ readonly hourFormat: _angular_core.InputSignal<GogHourFormat>;
1374
+ readonly minuteStep: _angular_core.InputSignal<number>;
1375
+ readonly showSeconds: _angular_core.InputSignal<boolean>;
1376
+ /**
1377
+ * The "Today" button, which **selects** today's date — the view follows, because the
1378
+ * selection is what the calendar opens on.
1379
+ *
1380
+ * Kept separate from `showThisMonthButton` on purpose: one button that both selected and
1381
+ * navigated read as "jump to today" to anyone who pressed it after paging away, and there is
1382
+ * no wording that makes a single control unambiguous about which of the two it does.
1383
+ */
1384
+ readonly showTodayButton: _angular_core.InputSignal<boolean>;
1385
+ /**
1386
+ * The "This month" button, which only moves the *view* back to the current month and leaves
1387
+ * the selection alone. Off by default — it is for browsing far from today without committing
1388
+ * to anything, which is the rarer of the two needs.
1389
+ */
1390
+ readonly showThisMonthButton: _angular_core.InputSignal<boolean>;
1391
+ readonly size: _angular_core.InputSignal<GogSize>;
1392
+ readonly todayLabel: _angular_core.InputSignal<string>;
1393
+ readonly thisMonthLabel: _angular_core.InputSignal<string>;
1394
+ readonly previousMonthLabel: _angular_core.InputSignal<string>;
1395
+ readonly nextMonthLabel: _angular_core.InputSignal<string>;
1396
+ readonly previousYearLabel: _angular_core.InputSignal<string>;
1397
+ readonly nextYearLabel: _angular_core.InputSignal<string>;
1398
+ /** Emitted when a selection is *complete* — a day in single mode, both ends of a range. */
1399
+ readonly gogDateSelect: _angular_core.OutputEmitterRef<GogDatepickerValue>;
1400
+ private readonly elRef;
1401
+ /** First of the leftmost visible month. */
1402
+ private readonly viewMonth;
1403
+ /** The cell the keyboard is on, and the only one carrying `tabindex="0"`. */
1404
+ protected readonly focusedDate: _angular_core.WritableSignal<Date>;
1405
+ /** Drives the range preview while the second end is still being chosen. */
1406
+ protected readonly hoverDate: _angular_core.WritableSignal<Date | null>;
1407
+ /** Whether a focus move should also pull the DOM focus over — only after a keypress. */
1408
+ private pendingFocus;
1409
+ protected readonly resolvedFirstDayOfWeek: _angular_core.Signal<number>;
1410
+ protected readonly weekdays: _angular_core.Signal<string[]>;
1411
+ private readonly months;
1412
+ private readonly range;
1413
+ private readonly singleDate;
1414
+ /** Start/end as currently *displayed*, including the end the pointer is hovering over. */
1415
+ private readonly previewRange;
1416
+ /** One entry per visible month; each is a 6×7 grid. */
1417
+ protected readonly monthViews: _angular_core.Signal<{
1418
+ label: string;
1419
+ weeks: GogCalendarDay[][];
1420
+ }[]>;
1421
+ protected readonly hostClasses: _angular_core.Signal<string>;
1422
+ /**
1423
+ * Whether today can actually be picked — `min`, `max` or `disabledDates` may rule it out, and
1424
+ * a "Today" button that silently does nothing is worse than one that is visibly unavailable.
1425
+ * The signal reads inside `isDayDisabled` are what make this follow those inputs.
1426
+ */
1427
+ protected readonly isTodaySelectable: _angular_core.Signal<boolean>;
1428
+ protected readonly timeSource: _angular_core.Signal<Date | null>;
1429
+ protected readonly hours: _angular_core.Signal<number>;
1430
+ protected readonly minutes: _angular_core.Signal<number>;
1431
+ protected readonly seconds: _angular_core.Signal<number>;
1432
+ protected readonly isPm: _angular_core.Signal<boolean>;
1433
+ protected readonly maxHour: _angular_core.Signal<12 | 23>;
1434
+ protected readonly minHour: _angular_core.Signal<0 | 1>;
1435
+ constructor();
1436
+ /** Steps the view by whole months or years. */
1437
+ protected shiftView(months: number): void;
1438
+ protected shiftViewYears(years: number): void;
1439
+ protected onDayClick(day: GogCalendarDay): void;
1440
+ protected onDayHover(day: GogCalendarDay): void;
1441
+ protected onGridLeave(): void;
1442
+ /**
1443
+ * Selects today. The view needs no separate nudge: the selection is the anchor the calendar
1444
+ * opens on, so moving it there moves the month too.
1445
+ */
1446
+ protected selectToday(): void;
1447
+ /** Moves the view back to the current month, leaving the selection untouched. */
1448
+ protected goToThisMonth(): void;
1449
+ /**
1450
+ * The ARIA grid pattern's keyboard contract: arrows by day, PageUp/PageDown by month,
1451
+ * Shift + those by year, Home/End to the ends of the week. Movement is clamped into
1452
+ * `[min, max]` so the caret cannot wander into a region nothing can be picked from.
1453
+ */
1454
+ protected onGridKeydown(event: KeyboardEvent): void;
1455
+ protected onHourInput(event: Event): void;
1456
+ protected onMinuteInput(event: Event): void;
1457
+ protected onSecondInput(event: Event): void;
1458
+ protected toggleMeridiem(): void;
1459
+ private selectionAnchor;
1460
+ private isDayDisabled;
1461
+ private buildWeeks;
1462
+ private select;
1463
+ private commit;
1464
+ private applyTime;
1465
+ /**
1466
+ * Moves the DOM focus onto the newly focused cell, but only after a key or button press —
1467
+ * never in response to the selection changing, which would steal focus from whatever the
1468
+ * consumer is doing elsewhere on the page.
1469
+ */
1470
+ private applyPendingFocus;
1471
+ protected isFocusedDay(date: Date): boolean;
1472
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<CalendarComponent, never>;
1473
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<CalendarComponent, "gog-calendar", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "selectionMode": { "alias": "selectionMode"; "required": false; "isSignal": true; }; "min": { "alias": "min"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "disabledDates": { "alias": "disabledDates"; "required": false; "isSignal": true; }; "locale": { "alias": "locale"; "required": false; "isSignal": true; }; "firstDayOfWeek": { "alias": "firstDayOfWeek"; "required": false; "isSignal": true; }; "defaultMonth": { "alias": "defaultMonth"; "required": false; "isSignal": true; }; "numberOfMonths": { "alias": "numberOfMonths"; "required": false; "isSignal": true; }; "showTime": { "alias": "showTime"; "required": false; "isSignal": true; }; "hourFormat": { "alias": "hourFormat"; "required": false; "isSignal": true; }; "minuteStep": { "alias": "minuteStep"; "required": false; "isSignal": true; }; "showSeconds": { "alias": "showSeconds"; "required": false; "isSignal": true; }; "showTodayButton": { "alias": "showTodayButton"; "required": false; "isSignal": true; }; "showThisMonthButton": { "alias": "showThisMonthButton"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "todayLabel": { "alias": "todayLabel"; "required": false; "isSignal": true; }; "thisMonthLabel": { "alias": "thisMonthLabel"; "required": false; "isSignal": true; }; "previousMonthLabel": { "alias": "previousMonthLabel"; "required": false; "isSignal": true; }; "nextMonthLabel": { "alias": "nextMonthLabel"; "required": false; "isSignal": true; }; "previousYearLabel": { "alias": "previousYearLabel"; "required": false; "isSignal": true; }; "nextYearLabel": { "alias": "nextYearLabel"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "gogDateSelect": "gogDateSelect"; }, never, never, true, never>;
1474
+ }
1475
+
1476
+ /**
1477
+ * A date field with a calendar panel.
1478
+ *
1479
+ * ```html
1480
+ * <gog-datepicker [(value)]="date" label="Дата рождения" [max]="today" />
1481
+ * <gog-datepicker selectionMode="range" [(value)]="range" [numberOfMonths]="2" />
1482
+ * <gog-datepicker [showTime]="true" hourFormat="24" [(value)]="when" />
1483
+ * ```
1484
+ *
1485
+ * Native `Date`, no date library and no adapter abstraction: this package has zero runtime
1486
+ * dependencies, and pulling one in for a single component would be the largest dependency
1487
+ * decision it has ever made. `Intl` covers month and weekday names; the display/parse format is
1488
+ * a token pattern (`dd.MM.yyyy`) so what is written can always be read back — see
1489
+ * `date-utils.ts`, which also explains why nothing here goes near `toISOString()`.
1490
+ *
1491
+ * The calendar itself is `gog-calendar`, exported separately and usable on its own. `inline`
1492
+ * mode is literally that component rendered without this field.
1493
+ */
1494
+ declare class DatepickerComponent implements ControlValueAccessor, DoCheck {
1495
+ private static nextUid;
1496
+ protected readonly uid: number;
1497
+ readonly inputId: _angular_core.InputSignal<string>;
1498
+ readonly label: _angular_core.InputSignal<string>;
1499
+ readonly ariaLabel: _angular_core.InputSignal<string>;
1500
+ readonly placeholder: _angular_core.InputSignal<string>;
1501
+ readonly selectionMode: _angular_core.InputSignal<GogDateSelectionMode>;
1502
+ readonly min: _angular_core.InputSignal<Date | null>;
1503
+ readonly max: _angular_core.InputSignal<Date | null>;
1504
+ readonly disabledDates: _angular_core.InputSignal<((date: Date) => boolean) | null>;
1505
+ readonly defaultMonth: _angular_core.InputSignal<Date | null>;
1506
+ readonly numberOfMonths: _angular_core.InputSignal<number>;
1507
+ readonly showTime: _angular_core.InputSignal<boolean>;
1508
+ readonly hourFormat: _angular_core.InputSignal<GogHourFormat>;
1509
+ readonly minuteStep: _angular_core.InputSignal<number>;
1510
+ readonly showSeconds: _angular_core.InputSignal<boolean>;
1511
+ /** The "Today" button in the panel's footer, which **selects** today's date. */
1512
+ readonly showTodayButton: _angular_core.InputSignal<boolean>;
1513
+ /**
1514
+ * A second footer button that only moves the *view* back to the current month, leaving the
1515
+ * selection alone. Off by default; see `gog-calendar` for why the two are separate controls.
1516
+ */
1517
+ readonly showThisMonthButton: _angular_core.InputSignal<boolean>;
1518
+ readonly todayLabel: _angular_core.InputSignal<string>;
1519
+ readonly thisMonthLabel: _angular_core.InputSignal<string>;
1520
+ /**
1521
+ * Display and parse pattern (`dd.MM.yyyy`, `yyyy-MM-dd`, …). Left unset it is derived from
1522
+ * `showTime`, so switching the time section on does not also require restating the format.
1523
+ */
1524
+ readonly format: _angular_core.InputSignal<string | null>;
1525
+ /** Unset, falls back to `GOG_CONFIG.datepicker.locale`, then to `'en-US'`. */
1526
+ readonly locale: _angular_core.InputSignal<string | undefined>;
1527
+ /** Unset, falls back to `GOG_CONFIG.datepicker.firstDayOfWeek`, then to the locale's own. */
1528
+ readonly firstDayOfWeek: _angular_core.InputSignal<number | undefined>;
1529
+ /**
1530
+ * Whether the date can be typed as well as picked. Typed text is parsed against `format`;
1531
+ * text that isn't a real date leaves the value untouched and is reverted on blur, rather
1532
+ * than silently resetting the field.
1533
+ */
1534
+ readonly allowTextInput: _angular_core.InputSignal<boolean>;
1535
+ /** Renders the calendar directly, with no field and no panel. */
1536
+ readonly inline: _angular_core.InputSignal<boolean>;
1537
+ readonly disabled: _angular_core.InputSignal<boolean>;
1538
+ readonly fullWidth: _angular_core.InputSignal<boolean>;
1539
+ readonly clearable: _angular_core.InputSignal<boolean | undefined>;
1540
+ readonly clearAriaLabel: _angular_core.InputSignal<string>;
1541
+ readonly errorMessage: _angular_core.InputSignal<string>;
1542
+ readonly errorDisplay: _angular_core.InputSignal<GogErrorDisplay | undefined>;
1543
+ readonly size: _angular_core.InputSignal<GogSize | undefined>;
1544
+ readonly floatLabel: _angular_core.InputSignal<GogFloatLabelVariant | undefined>;
1545
+ readonly floatLabelShowPlaceholder: _angular_core.InputSignal<boolean | undefined>;
1546
+ readonly appendToBody: _angular_core.InputSignal<boolean | undefined>;
1547
+ readonly dropdownDirection: _angular_core.InputSignal<GogDropdownDirection | undefined>;
1548
+ readonly dropdownZIndex: _angular_core.InputSignal<number | null>;
1549
+ readonly openCalendarLabel: _angular_core.InputSignal<string>;
1550
+ /** Two-way bindable value: a `Date` in `'single'` mode, a `GogDateRange` in `'range'`. */
1551
+ readonly value: _angular_core.ModelSignal<GogDatepickerValue>;
1552
+ readonly isOpen: _angular_core.WritableSignal<boolean>;
1553
+ private readonly elRef;
1554
+ private readonly document;
1555
+ private readonly isBrowser;
1556
+ private readonly destroyRef;
1557
+ private readonly ngControl;
1558
+ private readonly globalConfig;
1559
+ private readonly overlay;
1560
+ protected readonly panelTemplate: _angular_core.Signal<TemplateRef<unknown> | undefined>;
1561
+ private readonly cvaDisabled;
1562
+ protected readonly isFocused: _angular_core.WritableSignal<boolean>;
1563
+ protected readonly panelPlacement: _angular_core.WritableSignal<GogDropdownPlacement | null>;
1564
+ protected readonly directionState: _angular_core.WritableSignal<"up" | "down">;
1565
+ /** What is in the `<input>`; diverges from `value` only while the user is typing. */
1566
+ protected readonly text: _angular_core.WritableSignal<string>;
1567
+ /**
1568
+ * Whether the user is part-way through typing a date.
1569
+ *
1570
+ * Deliberately **not** the same thing as "the field has focus": picking a date from the
1571
+ * calendar hands focus back to the field, and keying the guard on focus meant the text was
1572
+ * then refused — you would pick a date and watch the field stay empty.
1573
+ */
1574
+ private readonly isEditing;
1575
+ protected readonly isDisabled: _angular_core.Signal<boolean>;
1576
+ protected readonly resolvedSize: _angular_core.Signal<GogSize>;
1577
+ protected readonly resolvedErrorDisplay: _angular_core.Signal<GogErrorDisplay>;
1578
+ protected readonly resolvedAppendToBody: _angular_core.Signal<boolean>;
1579
+ protected readonly resolvedDirection: _angular_core.Signal<GogDropdownDirection>;
1580
+ protected readonly resolvedLocale: _angular_core.Signal<string>;
1581
+ protected readonly resolvedFirstDayOfWeek: _angular_core.Signal<number | null>;
1582
+ /** Derived from `showTime` so turning the clock on doesn't also require a new format. */
1583
+ protected readonly resolvedFormat: _angular_core.Signal<string>;
1584
+ private readonly errorState;
1585
+ protected readonly hasError: _angular_core.Signal<boolean>;
1586
+ protected readonly visibleError: _angular_core.Signal<string>;
1587
+ protected readonly hasValue: _angular_core.Signal<boolean>;
1588
+ private readonly clearableState;
1589
+ protected readonly showClear: _angular_core.Signal<boolean>;
1590
+ private readonly floatLabelState;
1591
+ protected readonly resolvedFloatLabel: _angular_core.Signal<GogFloatLabelVariant>;
1592
+ protected readonly isFloatLabelActive: _angular_core.Signal<boolean>;
1593
+ protected readonly isFloatLabelFloated: _angular_core.Signal<boolean>;
1594
+ protected readonly effectivePlaceholder: _angular_core.Signal<string>;
1595
+ protected readonly triggerId: _angular_core.Signal<string>;
1596
+ protected readonly panelId: _angular_core.Signal<string>;
1597
+ protected readonly labelId: _angular_core.Signal<string>;
1598
+ protected readonly errorId: _angular_core.Signal<string | null>;
1599
+ protected readonly sizeClass: _angular_core.Signal<string>;
1600
+ /** How `value` reads in the field. A half-picked range shows only its start. */
1601
+ protected readonly displayText: _angular_core.Signal<string>;
1602
+ private onChangeFn;
1603
+ private onTouchedFn;
1604
+ private repositionFrame;
1605
+ constructor();
1606
+ ngDoCheck(): void;
1607
+ writeValue(val: GogDatepickerValue): void;
1608
+ registerOnChange(fn: (val: GogDatepickerValue) => void): void;
1609
+ registerOnTouched(fn: () => void): void;
1610
+ setDisabledState(isDisabled: boolean): void;
1611
+ protected toggle(): void;
1612
+ protected open(): void;
1613
+ protected close(): void;
1614
+ /** A completed selection closes the panel; a half-picked range leaves it open. */
1615
+ protected onCalendarSelect(next: GogDatepickerValue): void;
1616
+ /** Every calendar change, including the half-picked ones, has to reach the form. */
1617
+ protected onCalendarValue(next: GogDatepickerValue): void;
1618
+ protected onTextInput(event: Event): void;
1619
+ protected onFocus(): void;
1620
+ protected onBlur(): void;
1621
+ protected onTriggerKeydown(event: KeyboardEvent): void;
1622
+ protected clearValue(event: Event): void;
1623
+ protected focusTrigger(): void;
1624
+ private commit;
1625
+ /**
1626
+ * Binds click-outside and reposition listeners only while the panel is open — bound
1627
+ * permanently, every datepicker on the page would run a handler on every document click and
1628
+ * every scroll frame whether or not it is showing anything.
1629
+ */
1630
+ private bindWhileOpen;
1631
+ private closeIfClickedOutside;
1632
+ private scheduleReposition;
1633
+ private updatePlacement;
1634
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<DatepickerComponent, never>;
1635
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<DatepickerComponent, "gog-datepicker", never, { "inputId": { "alias": "inputId"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "selectionMode": { "alias": "selectionMode"; "required": false; "isSignal": true; }; "min": { "alias": "min"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "disabledDates": { "alias": "disabledDates"; "required": false; "isSignal": true; }; "defaultMonth": { "alias": "defaultMonth"; "required": false; "isSignal": true; }; "numberOfMonths": { "alias": "numberOfMonths"; "required": false; "isSignal": true; }; "showTime": { "alias": "showTime"; "required": false; "isSignal": true; }; "hourFormat": { "alias": "hourFormat"; "required": false; "isSignal": true; }; "minuteStep": { "alias": "minuteStep"; "required": false; "isSignal": true; }; "showSeconds": { "alias": "showSeconds"; "required": false; "isSignal": true; }; "showTodayButton": { "alias": "showTodayButton"; "required": false; "isSignal": true; }; "showThisMonthButton": { "alias": "showThisMonthButton"; "required": false; "isSignal": true; }; "todayLabel": { "alias": "todayLabel"; "required": false; "isSignal": true; }; "thisMonthLabel": { "alias": "thisMonthLabel"; "required": false; "isSignal": true; }; "format": { "alias": "format"; "required": false; "isSignal": true; }; "locale": { "alias": "locale"; "required": false; "isSignal": true; }; "firstDayOfWeek": { "alias": "firstDayOfWeek"; "required": false; "isSignal": true; }; "allowTextInput": { "alias": "allowTextInput"; "required": false; "isSignal": true; }; "inline": { "alias": "inline"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "fullWidth": { "alias": "fullWidth"; "required": false; "isSignal": true; }; "clearable": { "alias": "clearable"; "required": false; "isSignal": true; }; "clearAriaLabel": { "alias": "clearAriaLabel"; "required": false; "isSignal": true; }; "errorMessage": { "alias": "errorMessage"; "required": false; "isSignal": true; }; "errorDisplay": { "alias": "errorDisplay"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "floatLabel": { "alias": "floatLabel"; "required": false; "isSignal": true; }; "floatLabelShowPlaceholder": { "alias": "floatLabelShowPlaceholder"; "required": false; "isSignal": true; }; "appendToBody": { "alias": "appendToBody"; "required": false; "isSignal": true; }; "dropdownDirection": { "alias": "dropdownDirection"; "required": false; "isSignal": true; }; "dropdownZIndex": { "alias": "dropdownZIndex"; "required": false; "isSignal": true; }; "openCalendarLabel": { "alias": "openCalendarLabel"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, never>;
1636
+ }
1637
+
1638
+ /**
1639
+ * A rule separating two regions, optionally with a label running through it.
1640
+ *
1641
+ * ```html
1642
+ * <gog-divider />
1643
+ * <gog-divider orientation="vertical" />
1644
+ * <gog-divider>ИЛИ</gog-divider>
1645
+ * ```
1646
+ *
1647
+ * The label is projected content rather than a `label` input: it is markup, so a consumer can
1648
+ * put an icon or a `<gog-tag>` in it without the component growing an input per case. There is
1649
+ * no `hasLabel` input either — the stylesheet keys off whether anything was actually projected,
1650
+ * so the two forms above are the whole API.
1651
+ */
1652
+ declare class DividerComponent {
1653
+ readonly orientation: _angular_core.InputSignal<GogOrientation>;
1654
+ readonly variant: _angular_core.InputSignal<GogDividerVariant>;
1655
+ /**
1656
+ * Indents the rule from the leading edge so it lines up with the *text* of a list whose rows
1657
+ * start with an icon or avatar, instead of cutting across the whole row.
1658
+ */
1659
+ readonly inset: _angular_core.InputSignal<boolean>;
1660
+ protected readonly hostClasses: _angular_core.Signal<string>;
1661
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<DividerComponent, never>;
1662
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<DividerComponent, "gog-divider", never, { "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "inset": { "alias": "inset"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
1663
+ }
1664
+
1665
+ /**
1666
+ * A horizontal progress indicator.
1667
+ *
1668
+ * ```html
1669
+ * <gog-progressbar [value]="42" />
1670
+ * <gog-progressbar mode="indeterminate" ariaLabel="Загрузка" />
1671
+ * <gog-progressbar mode="buffer" [value]="42" [buffer]="70" />
1672
+ * ```
1673
+ *
1674
+ * `value` and `buffer` are percentages and are clamped to 0–100 rather than trusted: a bar
1675
+ * driven straight from `loaded / total` overshoots on the last chunk often enough that
1676
+ * clamping here is worth more than letting the caller find out from a broken layout.
1677
+ */
1678
+ declare class ProgressbarComponent {
1679
+ protected readonly MIN = 0;
1680
+ protected readonly MAX = 100;
1681
+ /** Percentage complete, 0–100. Ignored in `'indeterminate'` mode. */
1682
+ readonly value: _angular_core.InputSignal<number>;
1683
+ /** Secondary level shown behind `value` in `'buffer'` mode — preloaded but not yet played. */
1684
+ readonly buffer: _angular_core.InputSignal<number>;
1685
+ readonly mode: _angular_core.InputSignal<GogProgressbarMode>;
1686
+ readonly variant: _angular_core.InputSignal<GogProgressbarVariant>;
1687
+ readonly size: _angular_core.InputSignal<GogSize>;
1688
+ /** Renders the percentage next to the bar. Off by default — most bars sit under a label. */
1689
+ readonly showValue: _angular_core.InputSignal<boolean>;
1690
+ readonly ariaLabel: _angular_core.InputSignal<string>;
1691
+ protected readonly isIndeterminate: _angular_core.Signal<boolean>;
1692
+ protected readonly clampedValue: _angular_core.Signal<number>;
1693
+ protected readonly clampedBuffer: _angular_core.Signal<number>;
1694
+ protected readonly displayValue: _angular_core.Signal<string>;
1695
+ /** The fill is driven to 100% in indeterminate mode; the animation moves it, not the width. */
1696
+ protected readonly fillPercent: _angular_core.Signal<number>;
1697
+ protected readonly hostClasses: _angular_core.Signal<string>;
1698
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<ProgressbarComponent, never>;
1699
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<ProgressbarComponent, "gog-progressbar", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "buffer": { "alias": "buffer"; "required": false; "isSignal": true; }; "mode": { "alias": "mode"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "showValue": { "alias": "showValue"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
1700
+ }
1701
+
1702
+ /**
1703
+ * An on/off switch.
1704
+ *
1705
+ * ```html
1706
+ * <gog-toggle label="Уведомления" [(checked)]="on" />
1707
+ * <gog-toggle formControlName="darkMode" onLabel="ВКЛ" offLabel="ВЫКЛ" />
1708
+ * ```
1709
+ *
1710
+ * Next to `gog-checkbox` rather than a variant of it, because the two answer different
1711
+ * questions. A checkbox is "is this one of the things you selected"; a switch is "is this
1712
+ * setting on", takes effect immediately, and announces as **"switch, on"** rather than
1713
+ * "checkbox, checked". That announcement comes from `role="switch"` on a native
1714
+ * `<input type="checkbox">`, so keyboard, forms and assistive tech all still come from the
1715
+ * platform — only the painting differs.
1716
+ */
1717
+ declare class ToggleComponent implements ControlValueAccessor {
206
1718
  readonly label: _angular_core.InputSignal<string>;
207
1719
  readonly ariaLabel: _angular_core.InputSignal<string>;
208
- readonly size: _angular_core.InputSignal<GogSize>;
209
- readonly indeterminate: _angular_core.InputSignal<boolean>;
1720
+ /** Unset, falls back to `GOG_CONFIG.control.size`, then to `'md'`. */
1721
+ readonly size: _angular_core.InputSignal<GogSize | undefined>;
210
1722
  readonly disabled: _angular_core.InputSignal<boolean>;
211
1723
  readonly fullWidth: _angular_core.InputSignal<boolean>;
212
- readonly checkIconTemplate: _angular_core.InputSignal<TemplateRef<unknown> | null>;
1724
+ /** Which side of the switch the label sits on. */
1725
+ readonly labelPosition: _angular_core.InputSignal<"start" | "end">;
213
1726
  /**
214
- * Two-way bindable checked state: `[(checked)]="signal"`.
1727
+ * Text rendered *inside* the track — the one thing a checkbox genuinely cannot do, and what
1728
+ * makes a switch readable at a glance in a dense settings list. Both must be short; the
1729
+ * track sizes to the wider of the two.
1730
+ */
1731
+ readonly onLabel: _angular_core.InputSignal<string>;
1732
+ readonly offLabel: _angular_core.InputSignal<string>;
1733
+ /**
1734
+ * Two-way bindable on/off state: `[(checked)]="signal"`.
215
1735
  * This is the same state Angular Forms drives via `writeValue`/`registerOnChange`
216
1736
  * when the component is used with `formControlName`/`[formControl]`.
217
1737
  * Don't wire both a form directive AND `[(checked)]` to the same instance —
218
1738
  * pick one, otherwise you end up with two competing sources of truth.
219
1739
  */
220
1740
  readonly checked: _angular_core.ModelSignal<boolean>;
1741
+ private readonly ngControl;
1742
+ private readonly cvaDisabled;
1743
+ private readonly globalConfig;
1744
+ /** Instance input → `GOG_CONFIG` → the component's own default. See `resolveConfigured`. */
1745
+ protected readonly resolvedSize: _angular_core.Signal<GogSize>;
1746
+ protected readonly isDisabled: _angular_core.Signal<boolean>;
1747
+ protected readonly hasTrackLabels: _angular_core.Signal<boolean>;
1748
+ protected readonly hostClasses: _angular_core.Signal<string>;
1749
+ constructor();
1750
+ writeValue(val: boolean): void;
1751
+ registerOnChange(fn: (val: boolean) => void): void;
1752
+ registerOnTouched(fn: () => void): void;
1753
+ setDisabledState(isDisabled: boolean): void;
1754
+ protected onInputChange(event: Event): void;
1755
+ protected onBlur(): void;
1756
+ private onCheckedChange;
1757
+ private onTouched;
1758
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<ToggleComponent, never>;
1759
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<ToggleComponent, "gog-toggle", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "fullWidth": { "alias": "fullWidth"; "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": { "alias": "checked"; "required": false; "isSignal": true; }; }, { "checked": "checkedChange"; }, never, never, true, never>;
1760
+ }
1761
+
1762
+ /** A single choice in a `gog-radio-group`. */
1763
+ interface GogRadioOption {
1764
+ id: string | number;
1765
+ label: string;
1766
+ disabled?: boolean;
1767
+ }
1768
+ declare class RadioGroupComponent implements ControlValueAccessor {
1769
+ private static nextUid;
1770
+ protected readonly uid: string;
1771
+ readonly options: _angular_core.InputSignal<GogRadioOption[]>;
1772
+ readonly label: _angular_core.InputSignal<string>;
1773
+ readonly ariaLabel: _angular_core.InputSignal<string>;
1774
+ /** Shared `name` for the underlying native radios. Auto-generated per instance if unset. */
1775
+ readonly name: _angular_core.InputSignal<string>;
1776
+ /** Unset, falls back to `GOG_CONFIG.control.size`, then to `'md'`. */
1777
+ readonly size: _angular_core.InputSignal<GogSize | undefined>;
1778
+ readonly disabled: _angular_core.InputSignal<boolean>;
1779
+ readonly orientation: _angular_core.InputSignal<GogOrientation>;
1780
+ readonly errorMessage: _angular_core.InputSignal<string>;
1781
+ /** See `GogErrorDisplay`. Defaults to `'manual'`, matching every other control in the library. */
1782
+ /** Unset, falls back to `GOG_CONFIG.control.errorDisplay`, then to `'manual'`. */
1783
+ readonly errorDisplay: _angular_core.InputSignal<GogErrorDisplay | undefined>;
1784
+ readonly fullWidth: _angular_core.InputSignal<boolean>;
1785
+ /** Two-way bindable selected option id: `[(value)]="signal"`. */
1786
+ readonly value: _angular_core.ModelSignal<string | number | null>;
1787
+ private readonly ngControl;
1788
+ private readonly cvaDisabled;
1789
+ private readonly globalConfig;
1790
+ /** Instance input → `GOG_CONFIG` → the component's own default. See `resolveConfigured`. */
1791
+ protected readonly resolvedSize: _angular_core.Signal<GogSize>;
1792
+ private readonly resolvedErrorDisplay;
1793
+ private readonly errorState;
1794
+ protected readonly isDisabled: _angular_core.Signal<boolean>;
221
1795
  protected readonly controlSize: _angular_core.Signal<{
222
1796
  readonly boxSize: "var(--gog-control-checkbox-box-size-xsm, 12px)";
223
1797
  readonly labelSize: "var(--gog-control-checkbox-label-size-xsm, 0.6875rem)";
@@ -240,23 +1814,26 @@ declare class CheckboxComponent implements ControlValueAccessor {
240
1814
  readonly indicatorSize: "var(--gog-control-checkbox-icon-size-slg, 22px)";
241
1815
  }>;
242
1816
  protected readonly boxSize: _angular_core.Signal<"var(--gog-control-checkbox-box-size-xsm, 12px)" | "var(--gog-control-checkbox-box-size-sm, 18px)" | "var(--gog-control-checkbox-box-size-md, 24px)" | "var(--gog-control-checkbox-box-size-lg, 32px)" | "var(--gog-control-checkbox-box-size-slg, 40px)">;
243
- protected readonly checkboxPadding = "var(--gog-control-checkbox-padding, 6px)";
244
1817
  protected readonly labelSize: _angular_core.Signal<"var(--gog-control-checkbox-label-size-xsm, 0.6875rem)" | "var(--gog-control-checkbox-label-size-sm, 0.8125rem)" | "var(--gog-control-checkbox-label-size-md, 0.9375rem)" | "var(--gog-control-checkbox-label-size-lg, 1.0625rem)" | "var(--gog-control-checkbox-label-size-slg, 1.1875rem)">;
245
- protected readonly iconSize: _angular_core.Signal<"var(--gog-control-checkbox-icon-size-xsm, 10px)" | "var(--gog-control-checkbox-icon-size-sm, 12px)" | "var(--gog-control-checkbox-icon-size-md, 14px)" | "var(--gog-control-checkbox-icon-size-lg, 18px)" | "var(--gog-control-checkbox-icon-size-slg, 22px)">;
246
- private readonly ngControl;
247
- private readonly cvaDisabled;
248
- protected readonly isDisabled: _angular_core.Signal<boolean>;
1818
+ protected readonly radioPadding = "var(--gog-control-checkbox-padding, 6px)";
1819
+ protected readonly groupName: _angular_core.Signal<string>;
1820
+ protected readonly hasError: _angular_core.Signal<boolean>;
1821
+ protected readonly visibleError: _angular_core.Signal<string>;
1822
+ protected readonly errorId: _angular_core.Signal<string | null>;
1823
+ protected readonly labelId: _angular_core.Signal<string | null>;
1824
+ private onChange;
1825
+ private onTouched;
249
1826
  constructor();
250
- writeValue(val: boolean): void;
251
- registerOnChange(fn: (val: boolean) => void): void;
1827
+ writeValue(val: string | number | null): void;
1828
+ registerOnChange(fn: (val: string | number | null) => void): void;
252
1829
  registerOnTouched(fn: () => void): void;
253
1830
  setDisabledState(isDisabled: boolean): void;
254
- onInputChange(event: Event): void;
255
- onBlur(): void;
256
- private onCheckedChange;
257
- private onTouched;
258
- static ɵfac: _angular_core.ɵɵFactoryDeclaration<CheckboxComponent, never>;
259
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<CheckboxComponent, "gog-checkbox", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "indeterminate": { "alias": "indeterminate"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "fullWidth": { "alias": "fullWidth"; "required": false; "isSignal": true; }; "checkIconTemplate": { "alias": "checkIconTemplate"; "required": false; "isSignal": true; }; "checked": { "alias": "checked"; "required": false; "isSignal": true; }; }, { "checked": "checkedChange"; }, never, never, true, never>;
1831
+ protected isOptionDisabled(option: GogRadioOption): boolean;
1832
+ protected isSelected(option: GogRadioOption): boolean;
1833
+ protected onOptionChange(event: Event, option: GogRadioOption): void;
1834
+ protected onBlur(): void;
1835
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<RadioGroupComponent, never>;
1836
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<RadioGroupComponent, "gog-radio-group", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; "errorMessage": { "alias": "errorMessage"; "required": false; "isSignal": true; }; "errorDisplay": { "alias": "errorDisplay"; "required": false; "isSignal": true; }; "fullWidth": { "alias": "fullWidth"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, never>;
260
1837
  }
261
1838
 
262
1839
  interface ConfirmDialogData {
@@ -276,21 +1853,6 @@ declare class ConfirmationDialogComponent {
276
1853
  static ɵcmp: _angular_core.ɵɵComponentDeclaration<ConfirmationDialogComponent, "gog-confirmation-dialog", never, {}, {}, never, never, true, never>;
277
1854
  }
278
1855
 
279
- type GogIconName = 'check' | 'close' | 'chevron-up' | 'chevron-down' | 'sort' | 'sort-up' | 'sort-down' | 'success' | 'error' | 'warning' | 'info' | 'checkbox' | 'checkbox-checked' | 'eye' | 'eye-off';
280
- declare const ICON_DEFS: Record<GogIconName, string>;
281
-
282
- declare class IconComponent {
283
- private readonly sanitizer;
284
- readonly name: _angular_core.InputSignal<GogIconName>;
285
- readonly template: _angular_core.InputSignal<TemplateRef<unknown> | null>;
286
- readonly title: _angular_core.InputSignal<string>;
287
- readonly ariaHidden: _angular_core.InputSignal<boolean>;
288
- protected readonly ariaLabel: _angular_core.Signal<string | null>;
289
- protected readonly iconSvg: _angular_core.Signal<_angular_platform_browser.SafeHtml>;
290
- static ɵfac: _angular_core.ɵɵFactoryDeclaration<IconComponent, never>;
291
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<IconComponent, "gog-icon", never, { "name": { "alias": "name"; "required": false; "isSignal": true; }; "template": { "alias": "template"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; "ariaHidden": { "alias": "ariaHidden"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
292
- }
293
-
294
1856
  interface DialogConfig {
295
1857
  title?: string;
296
1858
  component: Type<unknown>;
@@ -405,6 +1967,11 @@ interface ToastConfig {
405
1967
  }
406
1968
  declare class ToastService {
407
1969
  readonly toasts: _angular_core.WritableSignal<Toast[]>;
1970
+ /**
1971
+ * Read once at construction rather than per `show()` call: this is a root-provided singleton,
1972
+ * so the config it resolves against cannot change over its lifetime anyway.
1973
+ */
1974
+ private readonly globalConfig;
408
1975
  private generateId;
409
1976
  show(config: ToastConfig): string;
410
1977
  dismiss(id: string): void;
@@ -474,17 +2041,39 @@ declare class ToastContainerComponent {
474
2041
  }
475
2042
 
476
2043
  /**
477
- * `'manual'` (default): the field shows `errorMessage` for as long as it is non-empty — the
478
- * consumer decides when to clear it, e.g.
479
- * `errorMessage="control.invalid && control.touched ? 'Required' : ''"`.
2044
+ * Arbitrary markup in the field's leading slot an icon, a button, a prefix label:
480
2045
  *
481
- * `'auto'`: shown once the attached form control has been touched and is invalid — the
482
- * consumer only supplies the message text, not the timing. Requires a
483
- * `[formControl]` / `formControlName` on the element; without one this falls back to
484
- * `'manual'`, since there is no control state to key off.
2046
+ * ```html
2047
+ * <gog-inputfield label="Amount">
2048
+ * <span gogInputAddonStart>€</span>
2049
+ * </gog-inputfield>
2050
+ *
2051
+ * <gog-inputfield label="Search">
2052
+ * <button gogInputAddonStart type="button" aria-label="Search" (click)="run()">
2053
+ * <gog-icon name="check" />
2054
+ * </button>
2055
+ * </gog-inputfield>
2056
+ * ```
2057
+ *
2058
+ * Unlike the deprecated `iconStartTemplate` / `iconStartFn` / `iconStartLabel` trio this
2059
+ * replaces, the projected element is a normal DOM element: it carries its own `aria-label`,
2060
+ * its own click handler, and its own disabled state, so the component needs no input per
2061
+ * capability. `iconStart` — a bare icon name — stays, since that really is the common case.
485
2062
  */
486
- type GogErrorDisplay = 'auto' | 'manual';
487
-
2063
+ declare class GogInputAddonStartDirective {
2064
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<GogInputAddonStartDirective, never>;
2065
+ static ɵdir: _angular_core.ɵɵDirectiveDeclaration<GogInputAddonStartDirective, "[gogInputAddonStart]", never, {}, {}, never, never, true, never>;
2066
+ }
2067
+ /**
2068
+ * Arbitrary markup in the field's trailing slot — see `GogInputAddonStartDirective`.
2069
+ *
2070
+ * On `type="password"` the built-in show/hide toggle owns this slot and a projected end addon
2071
+ * is ignored, so the reveal control can never be accidentally replaced by a decorative one.
2072
+ */
2073
+ declare class GogInputAddonEndDirective {
2074
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<GogInputAddonEndDirective, never>;
2075
+ static ɵdir: _angular_core.ɵɵDirectiveDeclaration<GogInputAddonEndDirective, "[gogInputAddonEnd]", never, {}, {}, never, never, true, never>;
2076
+ }
488
2077
  declare class InputfieldComponent implements ControlValueAccessor, DoCheck {
489
2078
  readonly label: _angular_core.InputSignal<string>;
490
2079
  readonly placeholder: _angular_core.InputSignal<string>;
@@ -498,12 +2087,16 @@ declare class InputfieldComponent implements ControlValueAccessor, DoCheck {
498
2087
  /** Only applied when `type="number"`. */
499
2088
  readonly step: _angular_core.InputSignal<number | null>;
500
2089
  readonly errorMessage: _angular_core.InputSignal<string>;
501
- /** See `GogErrorDisplay`. Defaults to `'manual'`, matching every other control in the library. */
502
- readonly errorDisplay: _angular_core.InputSignal<GogErrorDisplay>;
2090
+ /**
2091
+ * See `GogErrorDisplay`. Unset, falls back to `GOG_CONFIG.control.errorDisplay`, then to
2092
+ * `'manual'` — matching every other control in the library.
2093
+ */
2094
+ readonly errorDisplay: _angular_core.InputSignal<GogErrorDisplay | undefined>;
503
2095
  readonly name: _angular_core.InputSignal<string>;
504
2096
  readonly inputId: _angular_core.InputSignal<string>;
505
2097
  readonly disabled: _angular_core.InputSignal<boolean>;
506
- readonly size: _angular_core.InputSignal<GogSize>;
2098
+ /** Unset, falls back to `GOG_CONFIG.control.size`, then to `'md'`. */
2099
+ readonly size: _angular_core.InputSignal<GogSize | undefined>;
507
2100
  /**
508
2101
  * Full width of the container by default, matching every other field-style control.
509
2102
  * Set to `false` to shrink the field to fit its content instead.
@@ -513,22 +2106,47 @@ declare class InputfieldComponent implements ControlValueAccessor, DoCheck {
513
2106
  readonly iconStart: _angular_core.InputSignal<"" | GogIconName>;
514
2107
  /** Default icon name for the trailing icon. */
515
2108
  readonly iconEnd: _angular_core.InputSignal<"" | GogIconName>;
516
- /** Custom leading icon template. */
2109
+ /**
2110
+ * @deprecated since 21.3.0 (2026-08-07) — project a `<span gogInputAddonStart>` element instead. Removed in 21.5.0.
2111
+ */
517
2112
  readonly iconStartTemplate: _angular_core.InputSignal<TemplateRef<unknown> | null>;
518
- /** Custom trailing icon template. */
2113
+ /**
2114
+ * @deprecated since 21.3.0 (2026-08-07) — project a `<span gogInputAddonEnd>` element instead. Removed in 21.5.0.
2115
+ */
519
2116
  readonly iconEndTemplate: _angular_core.InputSignal<TemplateRef<unknown> | null>;
520
- /** When provided, the start icon becomes a clickable button invoking this fn */
2117
+ /**
2118
+ * @deprecated since 21.3.0 (2026-08-07) — project a `<button gogInputAddonStart>` element instead. Removed in 21.5.0. A projected button carries its own
2119
+ * `(click)` handler, so no input is needed for it.
2120
+ */
521
2121
  readonly iconStartFn: _angular_core.InputSignal<(() => void) | null>;
522
- /** When provided, the end icon becomes a clickable button invoking this fn */
2122
+ /**
2123
+ * @deprecated since 21.3.0 (2026-08-07) — project a `<button gogInputAddonEnd>` element instead. Removed in 21.5.0. A projected button carries its own
2124
+ * `(click)` handler, so no input is needed for it.
2125
+ */
523
2126
  readonly iconEndFn: _angular_core.InputSignal<(() => void) | null>;
524
- /** aria-label for the start icon button (required when iconStartFn is set) */
2127
+ /**
2128
+ * @deprecated since 21.3.0 (2026-08-07) — project a `<button gogInputAddonStart>` element instead. Removed in 21.5.0. Put `aria-label` on that button.
2129
+ */
525
2130
  readonly iconStartLabel: _angular_core.InputSignal<string>;
526
- /** aria-label for the end icon button (required when iconEndFn is set) */
2131
+ /**
2132
+ * @deprecated since 21.3.0 (2026-08-07) — project a `<button gogInputAddonEnd>` element instead. Removed in 21.5.0. Put `aria-label` on that button.
2133
+ */
527
2134
  readonly iconEndLabel: _angular_core.InputSignal<string>;
528
2135
  /** aria-label for the reveal-password button, shown when `type` is `'password'` */
529
2136
  readonly showPasswordLabel: _angular_core.InputSignal<string>;
530
2137
  /** aria-label for the hide-password button, shown once the password is revealed */
531
2138
  readonly hidePasswordLabel: _angular_core.InputSignal<string>;
2139
+ /**
2140
+ * Whether to offer a clear button once the field has text. Unset, falls back to
2141
+ * `GOG_CONFIG.control.clearable`, then to `false`.
2142
+ */
2143
+ readonly clearable: _angular_core.InputSignal<boolean | undefined>;
2144
+ /** Accessible name for the clear button. */
2145
+ readonly clearAriaLabel: _angular_core.InputSignal<string>;
2146
+ /** Unset, falls back to `GOG_CONFIG.floatLabel.variant`, then to `'none'` (off). */
2147
+ readonly floatLabel: _angular_core.InputSignal<GogFloatLabelVariant | undefined>;
2148
+ /** Unset, falls back to `GOG_CONFIG.floatLabel.showPlaceholder`, then to `false`. */
2149
+ readonly floatLabelShowPlaceholder: _angular_core.InputSignal<boolean | undefined>;
532
2150
  /**
533
2151
  * Two-way bindable value: `[(value)]="signal"` or `[value]` / `(valueChange)`.
534
2152
  * Always a string, including for `type="number"` — that field's `formControl`/
@@ -537,9 +2155,20 @@ declare class InputfieldComponent implements ControlValueAccessor, DoCheck {
537
2155
  */
538
2156
  readonly value: _angular_core.ModelSignal<string>;
539
2157
  private readonly ngControl;
2158
+ private readonly globalConfig;
540
2159
  private readonly cvaDisabled;
2160
+ /** Instance input → `GOG_CONFIG` → the component's own default. See `resolveConfigured`. */
2161
+ protected readonly resolvedSize: _angular_core.Signal<GogSize>;
2162
+ private readonly resolvedErrorDisplay;
541
2163
  private readonly errorState;
542
2164
  private readonly passwordVisible;
2165
+ /** Set from `(focus)`/`(blur)` on the `<input>` — see `onFocus`/`onBlur`. */
2166
+ protected readonly isFocused: _angular_core.WritableSignal<boolean>;
2167
+ /**
2168
+ * The single size modifier, replacing one `[class.gog-input-wrapper--<size>]` binding per size.
2169
+ * Empty for `'md'`: that is this component's default size and has no modifier rule of its own — every `gog-input-wrapper--*` chain bottoms out at it.
2170
+ */
2171
+ protected readonly sizeClass: _angular_core.Signal<string>;
543
2172
  protected readonly isDisabled: _angular_core.Signal<boolean>;
544
2173
  protected readonly isPasswordField: _angular_core.Signal<boolean>;
545
2174
  protected readonly isNumberField: _angular_core.Signal<boolean>;
@@ -547,6 +2176,22 @@ declare class InputfieldComponent implements ControlValueAccessor, DoCheck {
547
2176
  protected readonly effectiveAutocomplete: _angular_core.Signal<string>;
548
2177
  protected readonly hasError: _angular_core.Signal<boolean>;
549
2178
  protected readonly visibleError: _angular_core.Signal<string>;
2179
+ private readonly floatLabelState;
2180
+ private readonly clearableState;
2181
+ /** Whether to render the clear button right now — see `GogClearableState`. */
2182
+ protected readonly showClear: _angular_core.Signal<boolean>;
2183
+ protected readonly resolvedFloatLabel: _angular_core.Signal<GogFloatLabelVariant>;
2184
+ protected readonly isFloatLabelActive: _angular_core.Signal<boolean>;
2185
+ protected readonly isFloatLabelFloated: _angular_core.Signal<boolean>;
2186
+ protected readonly effectivePlaceholder: _angular_core.Signal<string>;
2187
+ /** Projected `gogInputAddonStart` element, if any. */
2188
+ protected readonly addonStart: _angular_core.Signal<GogInputAddonStartDirective | undefined>;
2189
+ /** Projected `gogInputAddonEnd` element, if any. */
2190
+ protected readonly addonEnd: _angular_core.Signal<GogInputAddonEndDirective | undefined>;
2191
+ /**
2192
+ * Drives the wrapper's `--icon-start` class, which widens the field's leading gutter. Counts
2193
+ * a projected addon as well as the legacy icon inputs, or the addon would overlap the text.
2194
+ */
550
2195
  protected readonly hasIconStart: _angular_core.Signal<boolean>;
551
2196
  protected readonly hasIconStartAction: _angular_core.Signal<boolean>;
552
2197
  /** For password fields the trailing icon is always the built-in show/hide toggle. */
@@ -566,21 +2211,28 @@ declare class InputfieldComponent implements ControlValueAccessor, DoCheck {
566
2211
  protected onIconStartClick(): void;
567
2212
  protected onIconEndClick(): void;
568
2213
  onInput(event: Event): void;
2214
+ /** Clears the field and notifies any attached form, then returns focus to the input. */
2215
+ protected clearValue(event: Event): void;
2216
+ onFocus(): void;
569
2217
  onBlur(): void;
570
2218
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<InputfieldComponent, never>;
571
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<InputfieldComponent, "gog-inputfield", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "autocomplete": { "alias": "autocomplete"; "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; }; "errorMessage": { "alias": "errorMessage"; "required": false; "isSignal": true; }; "errorDisplay": { "alias": "errorDisplay"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "inputId": { "alias": "inputId"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "fullWidth": { "alias": "fullWidth"; "required": false; "isSignal": true; }; "iconStart": { "alias": "iconStart"; "required": false; "isSignal": true; }; "iconEnd": { "alias": "iconEnd"; "required": false; "isSignal": true; }; "iconStartTemplate": { "alias": "iconStartTemplate"; "required": false; "isSignal": true; }; "iconEndTemplate": { "alias": "iconEndTemplate"; "required": false; "isSignal": true; }; "iconStartFn": { "alias": "iconStartFn"; "required": false; "isSignal": true; }; "iconEndFn": { "alias": "iconEndFn"; "required": false; "isSignal": true; }; "iconStartLabel": { "alias": "iconStartLabel"; "required": false; "isSignal": true; }; "iconEndLabel": { "alias": "iconEndLabel"; "required": false; "isSignal": true; }; "showPasswordLabel": { "alias": "showPasswordLabel"; "required": false; "isSignal": true; }; "hidePasswordLabel": { "alias": "hidePasswordLabel"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, never>;
2219
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<InputfieldComponent, "gog-inputfield", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "autocomplete": { "alias": "autocomplete"; "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; }; "errorMessage": { "alias": "errorMessage"; "required": false; "isSignal": true; }; "errorDisplay": { "alias": "errorDisplay"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "inputId": { "alias": "inputId"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "fullWidth": { "alias": "fullWidth"; "required": false; "isSignal": true; }; "iconStart": { "alias": "iconStart"; "required": false; "isSignal": true; }; "iconEnd": { "alias": "iconEnd"; "required": false; "isSignal": true; }; "iconStartTemplate": { "alias": "iconStartTemplate"; "required": false; "isSignal": true; }; "iconEndTemplate": { "alias": "iconEndTemplate"; "required": false; "isSignal": true; }; "iconStartFn": { "alias": "iconStartFn"; "required": false; "isSignal": true; }; "iconEndFn": { "alias": "iconEndFn"; "required": false; "isSignal": true; }; "iconStartLabel": { "alias": "iconStartLabel"; "required": false; "isSignal": true; }; "iconEndLabel": { "alias": "iconEndLabel"; "required": false; "isSignal": true; }; "showPasswordLabel": { "alias": "showPasswordLabel"; "required": false; "isSignal": true; }; "hidePasswordLabel": { "alias": "hidePasswordLabel"; "required": false; "isSignal": true; }; "clearable": { "alias": "clearable"; "required": false; "isSignal": true; }; "clearAriaLabel": { "alias": "clearAriaLabel"; "required": false; "isSignal": true; }; "floatLabel": { "alias": "floatLabel"; "required": false; "isSignal": true; }; "floatLabelShowPlaceholder": { "alias": "floatLabelShowPlaceholder"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, ["addonStart", "addonEnd"], ["[gogInputAddonStart]", "[gogInputAddonEnd]"], true, never>;
572
2220
  }
573
2221
 
574
2222
  declare class TextareaComponent implements ControlValueAccessor, DoCheck {
575
2223
  readonly label: _angular_core.InputSignal<string>;
576
2224
  readonly placeholder: _angular_core.InputSignal<string>;
577
2225
  readonly errorMessage: _angular_core.InputSignal<string>;
578
- /** See `GogErrorDisplay`. Defaults to `'manual'`, matching every other control in the library. */
579
- readonly errorDisplay: _angular_core.InputSignal<GogErrorDisplay>;
2226
+ /**
2227
+ * See `GogErrorDisplay`. Unset, falls back to `GOG_CONFIG.control.errorDisplay`, then to
2228
+ * `'manual'` — matching every other control in the library.
2229
+ */
2230
+ readonly errorDisplay: _angular_core.InputSignal<GogErrorDisplay | undefined>;
580
2231
  readonly name: _angular_core.InputSignal<string>;
581
2232
  readonly inputId: _angular_core.InputSignal<string>;
582
2233
  readonly disabled: _angular_core.InputSignal<boolean>;
583
- readonly size: _angular_core.InputSignal<GogSize>;
2234
+ /** Unset, falls back to `GOG_CONFIG.control.size`, then to `'md'`. */
2235
+ readonly size: _angular_core.InputSignal<GogSize | undefined>;
584
2236
  /** Native `rows` attribute, controlling the field's initial height. */
585
2237
  readonly rows: _angular_core.InputSignal<number>;
586
2238
  /**
@@ -588,255 +2240,147 @@ declare class TextareaComponent implements ControlValueAccessor, DoCheck {
588
2240
  * Set to `false` to shrink the field to fit its content instead.
589
2241
  */
590
2242
  readonly fullWidth: _angular_core.InputSignal<boolean>;
591
- /** Two-way bindable value: `[(value)]="signal"` or `[value]` / `(valueChange)`. */
592
- readonly value: _angular_core.ModelSignal<string>;
593
- private readonly ngControl;
594
- private readonly cvaDisabled;
595
- private readonly errorState;
596
- protected readonly isDisabled: _angular_core.Signal<boolean>;
597
- protected readonly hasError: _angular_core.Signal<boolean>;
598
- protected readonly visibleError: _angular_core.Signal<string>;
599
- private _onChange;
600
- private _onTouched;
601
- constructor();
602
- ngDoCheck(): void;
603
- writeValue(val: string): void;
604
- registerOnChange(fn: (val: string) => void): void;
605
- registerOnTouched(fn: () => void): void;
606
- setDisabledState(isDisabled: boolean): void;
607
- onInput(event: Event): void;
608
- onBlur(): void;
609
- static ɵfac: _angular_core.ɵɵFactoryDeclaration<TextareaComponent, never>;
610
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<TextareaComponent, "gog-textarea", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "errorMessage": { "alias": "errorMessage"; "required": false; "isSignal": true; }; "errorDisplay": { "alias": "errorDisplay"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "inputId": { "alias": "inputId"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "rows": { "alias": "rows"; "required": false; "isSignal": true; }; "fullWidth": { "alias": "fullWidth"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, never>;
611
- }
612
-
613
- declare class ChipComponent {
614
- readonly size: _angular_core.InputSignal<GogSize>;
615
- readonly shape: _angular_core.InputSignal<GogTagShape>;
616
- readonly disabled: _angular_core.InputSignal<boolean>;
617
- readonly clickable: _angular_core.InputSignal<boolean>;
618
- readonly removable: _angular_core.InputSignal<boolean>;
619
- readonly fullWidth: _angular_core.InputSignal<boolean>;
620
- readonly ariaLabel: _angular_core.InputSignal<string>;
621
- readonly removeAriaLabel: _angular_core.InputSignal<string>;
622
- readonly avatarUrl: _angular_core.InputSignal<string | null>;
623
- readonly avatarAlt: _angular_core.InputSignal<string>;
624
- readonly iconName: _angular_core.InputSignal<GogIconName | null>;
625
- readonly gogClick: _angular_core.OutputEmitterRef<MouseEvent | KeyboardEvent>;
626
- readonly gogRemove: _angular_core.OutputEmitterRef<void>;
627
- protected readonly hostClasses: _angular_core.Signal<string>;
628
- protected readonly isInteractive: _angular_core.Signal<boolean>;
629
- protected onChipClick(event: MouseEvent): void;
630
- protected onKeydown(event: KeyboardEvent): void;
631
- protected onRemoveClick(event: MouseEvent): void;
632
- static ɵfac: _angular_core.ɵɵFactoryDeclaration<ChipComponent, never>;
633
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<ChipComponent, "gog-chip", never, { "size": { "alias": "size"; "required": false; "isSignal": true; }; "shape": { "alias": "shape"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "clickable": { "alias": "clickable"; "required": false; "isSignal": true; }; "removable": { "alias": "removable"; "required": false; "isSignal": true; }; "fullWidth": { "alias": "fullWidth"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "removeAriaLabel": { "alias": "removeAriaLabel"; "required": false; "isSignal": true; }; "avatarUrl": { "alias": "avatarUrl"; "required": false; "isSignal": true; }; "avatarAlt": { "alias": "avatarAlt"; "required": false; "isSignal": true; }; "iconName": { "alias": "iconName"; "required": false; "isSignal": true; }; }, { "gogClick": "gogClick"; "gogRemove": "gogRemove"; }, never, ["*"], true, never>;
634
- }
635
-
636
- declare class TagComponent {
637
- readonly variant: _angular_core.InputSignal<GogTagVariant>;
638
- readonly size: _angular_core.InputSignal<GogSize>;
639
- readonly shape: _angular_core.InputSignal<GogTagShape>;
640
- readonly iconName: _angular_core.InputSignal<GogIconName | null>;
641
- readonly iconTemplate: _angular_core.InputSignal<TemplateRef<unknown> | null>;
642
- readonly fullWidth: _angular_core.InputSignal<boolean>;
643
- protected readonly hasIcon: _angular_core.Signal<boolean>;
644
- protected readonly hostClasses: _angular_core.Signal<string>;
645
- static ɵfac: _angular_core.ɵɵFactoryDeclaration<TagComponent, never>;
646
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<TagComponent, "gog-tag", never, { "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "shape": { "alias": "shape"; "required": false; "isSignal": true; }; "iconName": { "alias": "iconName"; "required": false; "isSignal": true; }; "iconTemplate": { "alias": "iconTemplate"; "required": false; "isSignal": true; }; "fullWidth": { "alias": "fullWidth"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
647
- }
648
-
649
- type GogDropdownDirection = 'auto' | 'up' | 'down';
650
- interface GogDropdownPlacement {
651
- direction: 'up' | 'down';
652
- top: number;
653
- left: number;
654
- width: number;
655
- maxHeight: number;
656
- }
657
-
658
- /** A single choice in any of the listbox-style controls (`gog-select`, `gog-multiselect`). */
659
- interface GogDropdownOption {
660
- id: string | number;
661
- name: string;
662
- disabled?: boolean;
663
- }
664
- /**
665
- * Shared behaviour for the listbox-style controls: open/close, placement, the
666
- * append-to-body overlay, click-outside, keyboard navigation and `ControlValueAccessor`
667
- * plumbing. Subclasses supply only what actually differs — the value type, the panel
668
- * markup, and the BEM class names used to find the trigger and the options.
669
- *
670
- * Exported because it appears in the public type signatures of the components that
671
- * extend it; it is not meant to be used or subclassed by consumers.
672
- */
673
- declare abstract class GogDropdownBase<TValue> implements ControlValueAccessor, DoCheck {
674
- private static nextUid;
675
- readonly label: _angular_core.InputSignal<string>;
676
- readonly ariaLabel: _angular_core.InputSignal<string>;
677
- readonly placeholder: _angular_core.InputSignal<string>;
678
- readonly options: _angular_core.InputSignal<GogDropdownOption[]>;
679
- readonly errorMessage: _angular_core.InputSignal<string>;
680
- /** See `GogErrorDisplay`. Defaults to `'manual'`, matching every other control in the library. */
681
- readonly errorDisplay: _angular_core.InputSignal<GogErrorDisplay>;
682
- readonly size: _angular_core.InputSignal<GogSize>;
683
- readonly dropdownDirection: _angular_core.InputSignal<GogDropdownDirection>;
684
- /**
685
- * Explicit stacking order for the panel. Left unset the panel falls back to the
686
- * stylesheet's `--gog-dropdown-z`, so the default lives in CSS where a consumer can
687
- * retheme it, rather than being baked into the component.
688
- */
689
- readonly dropdownZIndex: _angular_core.InputSignal<number | null>;
690
- /**
691
- * Fixed panel width as any CSS length (`'320px'`, `'40ch'`, `'100%'`, …), applied only
692
- * when `appendToBody` is set. Left unset the panel matches the trigger's width, same as
693
- * the inline panel already does via CSS.
694
- */
695
- readonly dropdownWidth: _angular_core.InputSignal<string | null>;
696
- /**
697
- * Fixed panel max-height as any CSS length, applied only when `appendToBody` is set.
698
- * `px`, `%` and `vh` also feed the up/down placement math (see `resolveCssLengthPx`); any
699
- * other unit still renders correctly but is invisible to that heuristic, so the panel may
700
- * pick the "wrong" side close to a viewport edge. Left unset the panel keeps the existing
701
- * viewport-derived, auto-flipping height.
702
- */
703
- readonly dropdownMaxHeight: _angular_core.InputSignal<string | null>;
704
- readonly appendToBody: _angular_core.InputSignal<boolean>;
705
- readonly disabled: _angular_core.InputSignal<boolean>;
706
- readonly chevronTemplate: _angular_core.InputSignal<TemplateRef<unknown> | null>;
707
- /**
708
- * Full width of the container by default, matching every other field-style control.
709
- * Set to `false` to shrink the trigger to fit its selected label instead.
710
- */
711
- readonly fullWidth: _angular_core.InputSignal<boolean>;
712
- readonly isOpen: _angular_core.WritableSignal<boolean>;
713
- /** The `<ng-template>` holding the panel markup, rendered inline or into `<body>`. */
714
- protected abstract readonly panelTemplate: Signal<TemplateRef<unknown> | undefined>;
715
- /** Declared by the subclass so each control keeps its own value type. */
716
- protected abstract readonly value: ModelSignal<TValue>;
717
- /** Value applied when a form writes `null` / the control is reset. */
718
- protected abstract readonly emptyValue: TValue;
719
- /** BEM class of one option button, used to collect keyboard-navigable elements. */
720
- protected abstract readonly optionClass: string;
721
- /** BEM class of the focusable trigger. */
722
- protected abstract readonly triggerClass: string;
723
- /**
724
- * Spacing tokens feeding the height estimate. Overridable so each control keeps the
725
- * `--gog-<block>-*` names it already exposes to consumers for theming.
2243
+ /**
2244
+ * Whether to offer a clear button once the field has text. Unset, falls back to
2245
+ * `GOG_CONFIG.control.clearable`, then to `false`.
726
2246
  */
727
- protected readonly optionGapToken: string;
728
- protected readonly optionsPaddingToken: string;
729
- /** Keep in sync with the real `max-height` on the subclass's `__dropdown` block. */
730
- protected readonly panelMaxHeightToken: string;
731
- /** Estimated row height fed into the placement math; not a real layout property. */
732
- protected readonly optionHeightToken: string;
733
- /** Unique per-instance suffix, so several dropdowns on a page can't collide on DOM ids. */
734
- protected readonly uid: number;
735
- protected readonly elRef: ElementRef<any>;
736
- protected readonly isBrowser: boolean;
737
- private readonly document;
738
- private readonly appRef;
739
- private readonly destroyRef;
2247
+ readonly clearable: _angular_core.InputSignal<boolean | undefined>;
2248
+ /** Accessible name for the clear button. */
2249
+ readonly clearAriaLabel: _angular_core.InputSignal<string>;
2250
+ /** Unset, falls back to `GOG_CONFIG.floatLabel.variant`, then to `'none'` (off). */
2251
+ readonly floatLabel: _angular_core.InputSignal<GogFloatLabelVariant | undefined>;
2252
+ /** Unset, falls back to `GOG_CONFIG.floatLabel.showPlaceholder`, then to `false`. */
2253
+ readonly floatLabelShowPlaceholder: _angular_core.InputSignal<boolean | undefined>;
2254
+ /** Two-way bindable value: `[(value)]="signal"` or `[value]` / `(valueChange)`. */
2255
+ readonly value: _angular_core.ModelSignal<string>;
740
2256
  private readonly ngControl;
741
- private readonly overlay;
2257
+ private readonly globalConfig;
742
2258
  private readonly cvaDisabled;
2259
+ /** Instance input → `GOG_CONFIG` → the component's own default. See `resolveConfigured`. */
2260
+ protected readonly resolvedSize: _angular_core.Signal<GogSize>;
2261
+ private readonly resolvedErrorDisplay;
743
2262
  private readonly errorState;
744
- protected readonly isDisabled: Signal<boolean>;
745
- protected readonly dropdownDirectionState: _angular_core.WritableSignal<"up" | "down">;
746
- protected readonly panelPlacement: _angular_core.WritableSignal<GogDropdownPlacement | null>;
2263
+ /** Set from `(focus)`/`(blur)` on the `<textarea>` — see `onFocus`/`onBlur`. */
2264
+ protected readonly isFocused: _angular_core.WritableSignal<boolean>;
2265
+ private readonly fieldRef;
747
2266
  /**
748
- * Stacking order to write onto the panel, or null to leave it to the stylesheet.
2267
+ * Width of the textarea's own scrollbar, published so the clear button can clear it.
749
2268
  *
750
- * Only needed when appending to `<body>`: an inline panel inherits `--gog-dropdown-z` from
751
- * its surroundings which is how a dropdown inside a dialog ends up above the dialog —
752
- * but an appended one sits outside that subtree and inherits nothing, so the value has
753
- * to be resolved from the trigger and written out explicitly.
2269
+ * It has to be measured: the width is platform- and settings-dependent (0 on overlay
2270
+ * scrollbars, ~15-19px on classic ones), and it only exists once the content overflows. The
2271
+ * pure-CSS alternative, `scrollbar-gutter: stable`, reserves the gutter even when the field
2272
+ * isn't scrolling, which shifts the resting layout of every textarea.
754
2273
  */
755
- protected readonly panelZIndex: _angular_core.WritableSignal<number | null>;
756
- /** `dropdownWidth`, or the trigger-derived width from `panelPlacement`, as a CSS value. */
757
- protected readonly resolvedPanelWidth: Signal<string | null>;
758
- /** `dropdownMaxHeight`, or the viewport-derived max-height from `panelPlacement`. */
759
- protected readonly resolvedPanelMaxHeight: Signal<string | null>;
760
- protected readonly hasError: Signal<boolean>;
761
- protected readonly visibleError: Signal<string>;
762
- /** Measured once per open rather than per scroll tick — see `refreshPanelMetrics`. */
763
- private optionGap;
764
- private optionsPadding;
765
- private maxPanelHeight;
766
- private optionHeight;
767
- private repositionFrame;
768
- private onChangeFn;
769
- private onTouchedFn;
770
- constructor();
2274
+ protected readonly scrollbarWidth: _angular_core.WritableSignal<number>;
771
2275
  /**
772
- * Binds the click-outside and reposition listeners only for as long as the panel is
773
- * open. Bound permanently as host listeners were — every dropdown on the page runs a
774
- * handler on every document click and every scroll frame, whether or not it is showing
775
- * anything.
2276
+ * The single size modifier, replacing one `[class.gog-input-wrapper--<size>]` binding per size.
2277
+ * Empty for `'md'`: that is this component's default size and has no modifier rule of its own — every `gog-input-wrapper--*` chain bottoms out at it.
776
2278
  */
777
- private bindWhileOpen;
2279
+ protected readonly sizeClass: _angular_core.Signal<string>;
2280
+ protected readonly isDisabled: _angular_core.Signal<boolean>;
2281
+ protected readonly hasError: _angular_core.Signal<boolean>;
2282
+ protected readonly visibleError: _angular_core.Signal<string>;
2283
+ private readonly floatLabelState;
2284
+ private readonly clearableState;
2285
+ /** Whether to render the clear button right now — see `GogClearableState`. */
2286
+ protected readonly showClear: _angular_core.Signal<boolean>;
2287
+ protected readonly resolvedFloatLabel: _angular_core.Signal<GogFloatLabelVariant>;
2288
+ protected readonly isFloatLabelActive: _angular_core.Signal<boolean>;
2289
+ protected readonly isFloatLabelFloated: _angular_core.Signal<boolean>;
2290
+ protected readonly effectivePlaceholder: _angular_core.Signal<string>;
2291
+ private _onChange;
2292
+ private _onTouched;
2293
+ constructor();
778
2294
  ngDoCheck(): void;
779
- writeValue(val: TValue | null): void;
780
- registerOnChange(fn: (val: TValue) => void): void;
2295
+ writeValue(val: string): void;
2296
+ registerOnChange(fn: (val: string) => void): void;
781
2297
  registerOnTouched(fn: () => void): void;
782
2298
  setDisabledState(isDisabled: boolean): void;
783
- protected toggle(): void;
784
- protected open(): void;
785
- protected close(): void;
786
- /** Writes a new selection out to both the model and the attached form control. */
787
- protected commitValue(next: TValue): void;
788
- protected markTouched(): void;
789
- private closeIfClickedOutside;
790
- /**
791
- * Coalesces bursts of scroll/resize events into one reposition per frame. Placement
792
- * reads layout, so running it per event is what makes a scroll janky.
793
- */
794
- private scheduleReposition;
795
- /** Jumps from the trigger into the option list on ArrowDown/ArrowUp while open. */
796
- protected onTriggerArrowKeydown(event: Event): void;
797
- protected onOptionKeydown(event: KeyboardEvent): void;
798
- protected focusTrigger(): void;
799
- /** Extra chrome stacked above the options (e.g. a select-all row), in px. */
800
- protected extraPanelHeight(): number;
801
- private enabledOptionElements;
802
- private attachOverlay;
803
- /**
804
- * Reads the spacing tokens that feed the height estimate. Done once per open instead of
805
- * on every scroll tick, because `getComputedStyle` forces a style recalculation and the
806
- * tokens cannot change while the panel is on screen.
807
- */
808
- private refreshPanelMetrics;
809
- /**
810
- * Rough height, used only to choose up/down and to cap `max-height` before the panel
811
- * has been laid out. Deliberately an estimate: measuring would require rendering the
812
- * panel first, which is what we are trying to position. A resolvable `dropdownMaxHeight`
813
- * replaces the row-count guess outright, since it is exact rather than estimated.
814
- */
815
- private estimatePanelHeight;
2299
+ onInput(event: Event): void;
2300
+ /** Clears the field and notifies any attached form, then returns focus to the input. */
2301
+ protected clearValue(event: Event): void;
2302
+ onFocus(): void;
2303
+ onBlur(): void;
2304
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<TextareaComponent, never>;
2305
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<TextareaComponent, "gog-textarea", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "errorMessage": { "alias": "errorMessage"; "required": false; "isSignal": true; }; "errorDisplay": { "alias": "errorDisplay"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "inputId": { "alias": "inputId"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "rows": { "alias": "rows"; "required": false; "isSignal": true; }; "fullWidth": { "alias": "fullWidth"; "required": false; "isSignal": true; }; "clearable": { "alias": "clearable"; "required": false; "isSignal": true; }; "clearAriaLabel": { "alias": "clearAriaLabel"; "required": false; "isSignal": true; }; "floatLabel": { "alias": "floatLabel"; "required": false; "isSignal": true; }; "floatLabelShowPlaceholder": { "alias": "floatLabelShowPlaceholder"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, never>;
2306
+ }
2307
+
2308
+ declare class ChipComponent {
2309
+ readonly size: _angular_core.InputSignal<GogSize>;
2310
+ readonly shape: _angular_core.InputSignal<GogTagShape>;
2311
+ readonly disabled: _angular_core.InputSignal<boolean>;
2312
+ readonly clickable: _angular_core.InputSignal<boolean>;
2313
+ readonly removable: _angular_core.InputSignal<boolean>;
2314
+ readonly fullWidth: _angular_core.InputSignal<boolean>;
2315
+ readonly ariaLabel: _angular_core.InputSignal<string>;
2316
+ readonly removeAriaLabel: _angular_core.InputSignal<string>;
2317
+ readonly avatarUrl: _angular_core.InputSignal<string | null>;
2318
+ readonly avatarAlt: _angular_core.InputSignal<string>;
2319
+ readonly iconName: _angular_core.InputSignal<GogIconName | null>;
2320
+ readonly gogClick: _angular_core.OutputEmitterRef<MouseEvent | KeyboardEvent>;
2321
+ readonly gogRemove: _angular_core.OutputEmitterRef<void>;
2322
+ protected readonly hostClasses: _angular_core.Signal<string>;
2323
+ protected readonly isInteractive: _angular_core.Signal<boolean>;
2324
+ protected onChipClick(event: MouseEvent): void;
2325
+ protected onKeydown(event: KeyboardEvent): void;
2326
+ protected onRemoveClick(event: MouseEvent): void;
2327
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<ChipComponent, never>;
2328
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<ChipComponent, "gog-chip", never, { "size": { "alias": "size"; "required": false; "isSignal": true; }; "shape": { "alias": "shape"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "clickable": { "alias": "clickable"; "required": false; "isSignal": true; }; "removable": { "alias": "removable"; "required": false; "isSignal": true; }; "fullWidth": { "alias": "fullWidth"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "removeAriaLabel": { "alias": "removeAriaLabel"; "required": false; "isSignal": true; }; "avatarUrl": { "alias": "avatarUrl"; "required": false; "isSignal": true; }; "avatarAlt": { "alias": "avatarAlt"; "required": false; "isSignal": true; }; "iconName": { "alias": "iconName"; "required": false; "isSignal": true; }; }, { "gogClick": "gogClick"; "gogRemove": "gogRemove"; }, never, ["*"], true, never>;
2329
+ }
2330
+
2331
+ /**
2332
+ * Custom markup for the tag's leading icon:
2333
+ *
2334
+ * ```html
2335
+ * <ng-template gogTagIcon><my-icon /></ng-template>
2336
+ * ```
2337
+ */
2338
+ declare class GogTagIconDirective {
2339
+ readonly templateRef: TemplateRef<unknown>;
2340
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<GogTagIconDirective, never>;
2341
+ static ɵdir: _angular_core.ɵɵDirectiveDeclaration<GogTagIconDirective, "[gogTagIcon]", never, {}, {}, never, never, true, never>;
2342
+ }
2343
+ declare class TagComponent {
2344
+ readonly variant: _angular_core.InputSignal<GogTagVariant>;
2345
+ readonly size: _angular_core.InputSignal<GogSize>;
2346
+ readonly shape: _angular_core.InputSignal<GogTagShape>;
2347
+ readonly iconName: _angular_core.InputSignal<GogIconName | null>;
816
2348
  /**
817
- * The trigger's own rect, not the whole component's a label above it or an error
818
- * message below it sit in normal document flow and are not part of what the panel needs
819
- * to clear. This also keeps `appendToBody` placement consistent with the inline panel,
820
- * which is already positioned purely relative to the trigger via CSS.
2349
+ * @deprecated since 21.3.0 (2026-08-07) project an `<ng-template gogTagIcon>` into the component instead. Removed in 21.5.0.
821
2350
  */
822
- private triggerRect;
823
- /** The stacking order the panel would have had if it were still inside the subtree. */
824
- private resolvePanelZIndex;
825
- private updatePlacement;
826
- static ɵfac: _angular_core.ɵɵFactoryDeclaration<GogDropdownBase<any>, never>;
827
- static ɵdir: _angular_core.ɵɵDirectiveDeclaration<GogDropdownBase<any>, never, never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; "errorMessage": { "alias": "errorMessage"; "required": false; "isSignal": true; }; "errorDisplay": { "alias": "errorDisplay"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "dropdownDirection": { "alias": "dropdownDirection"; "required": false; "isSignal": true; }; "dropdownZIndex": { "alias": "dropdownZIndex"; "required": false; "isSignal": true; }; "dropdownWidth": { "alias": "dropdownWidth"; "required": false; "isSignal": true; }; "dropdownMaxHeight": { "alias": "dropdownMaxHeight"; "required": false; "isSignal": true; }; "appendToBody": { "alias": "appendToBody"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "chevronTemplate": { "alias": "chevronTemplate"; "required": false; "isSignal": true; }; "fullWidth": { "alias": "fullWidth"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
2351
+ readonly iconTemplate: _angular_core.InputSignal<TemplateRef<unknown> | null>;
2352
+ /** Projected `gogTagIcon` template; wins over the deprecated `iconTemplate` input. */
2353
+ protected readonly iconSlot: _angular_core.Signal<GogTagIconDirective | undefined>;
2354
+ readonly fullWidth: _angular_core.InputSignal<boolean>;
2355
+ protected readonly hasIcon: _angular_core.Signal<boolean>;
2356
+ protected readonly hostClasses: _angular_core.Signal<string>;
2357
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<TagComponent, never>;
2358
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<TagComponent, "gog-tag", never, { "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "shape": { "alias": "shape"; "required": false; "isSignal": true; }; "iconName": { "alias": "iconName"; "required": false; "isSignal": true; }; "iconTemplate": { "alias": "iconTemplate"; "required": false; "isSignal": true; }; "fullWidth": { "alias": "fullWidth"; "required": false; "isSignal": true; }; }, {}, ["iconSlot"], ["*"], true, never>;
828
2359
  }
829
2360
 
830
- /** @deprecated Prefer `GogDropdownOption`; kept as an alias so existing imports keep working. */
2361
+ /**
2362
+ * @deprecated since 21.2.2 (2026-07-30) — use `GogDropdownOption` instead. Removed in 21.4.0.
2363
+ */
831
2364
  type GogSelectOption = GogDropdownOption;
832
- declare class SelectComponent extends GogDropdownBase<string | number | null> {
2365
+ declare class SelectComponent<TOption = GogDropdownOption, TValue = string | number | null> extends GogDropdownBase<TValue, TOption> {
833
2366
  readonly inputId: _angular_core.InputSignal<string>;
834
- /** Two-way bindable selected value: `[(value)]="signal"`. */
835
- readonly value: _angular_core.ModelSignal<string | number | null>;
2367
+ /**
2368
+ * Two-way bindable selected value: `[(value)]="signal"`.
2369
+ *
2370
+ * Carries whatever `optionValue` resolves to — an id by default, or the option object itself
2371
+ * when `optionValue` is `null`. `TValue` is inferred from the signal you bind, so a
2372
+ * `WritableSignal<string | null>` keeps typing exactly as before.
2373
+ */
2374
+ readonly value: _angular_core.ModelSignal<TValue>;
836
2375
  protected readonly panelTemplate: _angular_core.Signal<TemplateRef<unknown> | undefined>;
837
- protected readonly emptyValue: null;
2376
+ /** A cleared select is `null`, whatever `TValue` the consumer bound. */
2377
+ protected readonly emptyValue: TValue;
838
2378
  protected readonly optionClass = "gog-select__option";
839
2379
  protected readonly triggerClass = "gog-select__control";
2380
+ /** Opt-in: a select had no clear affordance before 21.3.0. */
2381
+ protected readonly clearableByDefault = false;
2382
+ protected readonly sizeBlockClass = "gog-select";
2383
+ protected readonly panelBlockClass = "gog-select__dropdown";
840
2384
  protected readonly optionGapToken = "--gog-select-option-gap";
841
2385
  protected readonly panelMaxHeightToken = "--gog-select-panel-max-height";
842
2386
  protected readonly optionHeightToken = "--gog-select-option-height";
@@ -844,40 +2388,96 @@ declare class SelectComponent extends GogDropdownBase<string | number | null> {
844
2388
  protected readonly listboxId: _angular_core.Signal<string>;
845
2389
  protected readonly labelId: _angular_core.Signal<string>;
846
2390
  protected readonly errorId: _angular_core.Signal<string | null>;
847
- protected readonly selectedOption: _angular_core.Signal<GogDropdownOption | null>;
848
- protected isSelected(id: string | number): boolean;
849
- protected selectOption(option: GogDropdownOption, event: MouseEvent): void;
850
- static ɵfac: _angular_core.ɵɵFactoryDeclaration<SelectComponent, never>;
851
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<SelectComponent, "gog-select", never, { "inputId": { "alias": "inputId"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, never>;
2391
+ protected readonly selectedOption: _angular_core.Signal<NonNullable<TOption> | null>;
2392
+ protected readonly selectedLabel: _angular_core.Signal<string>;
2393
+ protected readonly hasFloatValue: _angular_core.Signal<boolean>;
2394
+ protected isSelected(option: TOption): boolean;
2395
+ protected selectOption(option: TOption, event: MouseEvent): void;
2396
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<SelectComponent<any, any>, never>;
2397
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<SelectComponent<any, any>, "gog-select", never, { "inputId": { "alias": "inputId"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, never>;
852
2398
  }
853
2399
 
854
- /** @deprecated Prefer `GogDropdownOption`; kept as an alias so existing imports keep working. */
2400
+ /**
2401
+ * @deprecated since 21.2.2 (2026-07-30) — use `GogDropdownOption` instead. Removed in 21.4.0.
2402
+ */
855
2403
  type GogMultiselectOption = GogDropdownOption;
856
- declare class MultiselectComponent extends GogDropdownBase<(string | number)[]> {
2404
+ /**
2405
+ * Custom markup for the multiselect's clear button:
2406
+ *
2407
+ * ```html
2408
+ * <ng-template gogMultiselectClearIcon><my-icon /></ng-template>
2409
+ * ```
2410
+ */
2411
+ declare class GogMultiselectClearIconDirective {
2412
+ readonly templateRef: TemplateRef<unknown>;
2413
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<GogMultiselectClearIconDirective, never>;
2414
+ static ɵdir: _angular_core.ɵɵDirectiveDeclaration<GogMultiselectClearIconDirective, "[gogMultiselectClearIcon]", never, {}, {}, never, never, true, never>;
2415
+ }
2416
+ declare class MultiselectComponent<TOption = GogDropdownOption, TValue = string | number> extends GogDropdownBase<TValue[], TOption> {
857
2417
  readonly showControls: _angular_core.InputSignal<boolean>;
858
2418
  /** Where the "select all"/"clear" row sits relative to the option list. Sticky either way. */
859
2419
  readonly controlsPosition: _angular_core.InputSignal<"top" | "bottom">;
2420
+ /**
2421
+ * @deprecated since 21.3.0 (2026-08-07) — project an `<ng-template gogMultiselectClearIcon>` into the component instead. Removed in 21.5.0.
2422
+ */
860
2423
  readonly clearIconTemplate: _angular_core.InputSignal<TemplateRef<unknown> | null>;
861
- /** Two-way bindable selected ids: `[(value)]="signal"`. */
862
- readonly value: _angular_core.ModelSignal<(string | number)[]>;
2424
+ /** Projected `gogMultiselectClearIcon` template; wins over the deprecated `clearIconTemplate` input. */
2425
+ protected readonly clearIconSlot: _angular_core.Signal<GogMultiselectClearIconDirective | undefined>;
2426
+ /**
2427
+ * Two-way bindable selection: `[(value)]="signal"`.
2428
+ *
2429
+ * Each entry is whatever `optionValue` resolves to — an id by default, or the option objects
2430
+ * themselves when `optionValue` is `null`.
2431
+ */
2432
+ readonly value: _angular_core.ModelSignal<TValue[]>;
863
2433
  protected readonly panelTemplate: _angular_core.Signal<TemplateRef<unknown> | undefined>;
864
- protected readonly emptyValue: (string | number)[];
2434
+ protected readonly emptyValue: TValue[];
865
2435
  protected readonly optionClass = "gog-ms__option";
866
2436
  protected readonly triggerClass = "gog-ms";
2437
+ /**
2438
+ * On by default: this control shipped a clear button before `clearable` existed, so the
2439
+ * default preserves it. Set `[clearable]="false"` to drop it.
2440
+ */
2441
+ protected readonly clearableByDefault = true;
2442
+ protected readonly sizeBlockClass = "gog-ms-wrapper";
2443
+ protected readonly panelBlockClass = "gog-ms__dropdown";
867
2444
  protected readonly optionGapToken = "--gog-ms-option-gap";
868
2445
  protected readonly optionsPaddingToken = "--gog-ms-options-padding";
869
2446
  protected readonly panelMaxHeightToken = "--gog-ms-panel-max-height";
870
2447
  protected readonly optionHeightToken = "--gog-ms-option-height";
871
2448
  protected readonly listboxId: _angular_core.Signal<string>;
872
2449
  protected readonly labelId: _angular_core.Signal<string>;
2450
+ /** Labels of the current selection, driven off the selected *options* so it works whatever
2451
+ * `optionValue` resolves to. */
2452
+ readonly selectedLabels: _angular_core.Signal<string[]>;
2453
+ /** Comma-joined selection — the full text, before any overflow trimming. */
873
2454
  readonly selectedNames: _angular_core.Signal<string>;
874
- protected isSelected(id: string | number): boolean;
875
- protected toggleOption(option: GogDropdownOption, event: MouseEvent): void;
2455
+ private readonly valueRef;
2456
+ private readonly resizeDestroyRef;
2457
+ /** Width available to the summary text, tracked so the split recomputes as the field resizes. */
2458
+ private readonly valueWidth;
2459
+ private readonly valueFont;
2460
+ /**
2461
+ * Splits the selection into what fits on one line and a `+N` remainder.
2462
+ *
2463
+ * Measured with `canvas.measureText` rather than by rendering candidates and reading back
2464
+ * layout: the greedy fit is O(n) over the labels and costs no reflow, where a DOM-based probe
2465
+ * would thrash layout on every keystroke-sized change.
2466
+ */
2467
+ protected readonly summary: _angular_core.Signal<{
2468
+ text: string;
2469
+ hidden: number;
2470
+ }>;
2471
+ protected readonly hasFloatValue: _angular_core.Signal<boolean>;
2472
+ protected isSelected(option: TOption): boolean;
2473
+ protected toggleOption(option: TOption, event: MouseEvent): void;
2474
+ /** Acts on the *visible* options, so "select all" under an active filter means what it says. */
876
2475
  protected selectAll(event: MouseEvent): void;
877
2476
  protected clearAll(event: Event): void;
2477
+ constructor();
878
2478
  protected extraPanelHeight(): number;
879
- static ɵfac: _angular_core.ɵɵFactoryDeclaration<MultiselectComponent, never>;
880
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<MultiselectComponent, "gog-multiselect", never, { "showControls": { "alias": "showControls"; "required": false; "isSignal": true; }; "controlsPosition": { "alias": "controlsPosition"; "required": false; "isSignal": true; }; "clearIconTemplate": { "alias": "clearIconTemplate"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, never>;
2479
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<MultiselectComponent<any, any>, never>;
2480
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<MultiselectComponent<any, any>, "gog-multiselect", never, { "showControls": { "alias": "showControls"; "required": false; "isSignal": true; }; "controlsPosition": { "alias": "controlsPosition"; "required": false; "isSignal": true; }; "clearIconTemplate": { "alias": "clearIconTemplate"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, ["clearIconSlot"], never, true, never>;
881
2481
  }
882
2482
 
883
2483
  declare class SliderComponent implements ControlValueAccessor, DoCheck {
@@ -891,7 +2491,8 @@ declare class SliderComponent implements ControlValueAccessor, DoCheck {
891
2491
  readonly showThumb: _angular_core.InputSignal<boolean>;
892
2492
  readonly errorMessage: _angular_core.InputSignal<string>;
893
2493
  /** See `GogErrorDisplay`. Defaults to `'manual'`, matching every other control in the library. */
894
- readonly errorDisplay: _angular_core.InputSignal<GogErrorDisplay>;
2494
+ /** Unset, falls back to `GOG_CONFIG.control.errorDisplay`, then to `'manual'`. */
2495
+ readonly errorDisplay: _angular_core.InputSignal<GogErrorDisplay | undefined>;
895
2496
  readonly ariaLabel: _angular_core.InputSignal<string>;
896
2497
  readonly disabled: _angular_core.InputSignal<boolean>;
897
2498
  /**
@@ -899,18 +2500,34 @@ declare class SliderComponent implements ControlValueAccessor, DoCheck {
899
2500
  * `--gog-slider-auto-width` instead — a slider's track has no content of its own to
900
2501
  * shrink-wrap to, so unlike the other field controls this needs an explicit fallback
901
2502
  * width rather than `fit-content`.
2503
+ *
2504
+ * Ignored when `orientation` is `'vertical'`: a vertical slider's own width is its
2505
+ * thickness, not its length, so it always sizes to fit its content. Its length instead
2506
+ * comes from `--gog-slider-vertical-length` (default `160px`), same idea as
2507
+ * `--gog-slider-auto-width` for the horizontal auto-width case.
902
2508
  */
903
2509
  readonly fullWidth: _angular_core.InputSignal<boolean>;
2510
+ /**
2511
+ * `'horizontal'` (default) or `'vertical'`. The developer picks per instance — there is
2512
+ * no global default for this, since it's a layout decision tied to where the slider sits,
2513
+ * not a house style. Backed by a native `<input type="range">` rotated via `writing-mode`,
2514
+ * so dragging, touch and keyboard (Up/Down as well as Left/Right) all keep working exactly
2515
+ * as they do horizontally.
2516
+ */
2517
+ readonly orientation: _angular_core.InputSignal<_guildofgleks_ui.GogOrientation>;
904
2518
  /** Two-way bindable value: `[(value)]="signal"`. */
905
2519
  readonly value: _angular_core.ModelSignal<number>;
906
2520
  private readonly ngControl;
907
2521
  private readonly cvaDisabled;
2522
+ private readonly globalConfig;
2523
+ private readonly resolvedErrorDisplay;
908
2524
  private readonly errorState;
909
2525
  protected readonly isDisabled: _angular_core.Signal<boolean>;
910
2526
  protected readonly clampedValue: _angular_core.Signal<number>;
911
2527
  protected readonly fillPercent: _angular_core.Signal<number>;
912
2528
  protected readonly thumbPos: _angular_core.Signal<string>;
913
2529
  protected readonly fillScale: _angular_core.Signal<number>;
2530
+ protected readonly isVertical: _angular_core.Signal<boolean>;
914
2531
  protected readonly hasError: _angular_core.Signal<boolean>;
915
2532
  protected readonly visibleError: _angular_core.Signal<string>;
916
2533
  protected readonly errorId: _angular_core.Signal<string | null>;
@@ -925,7 +2542,7 @@ declare class SliderComponent implements ControlValueAccessor, DoCheck {
925
2542
  onInput(event: Event): void;
926
2543
  onBlur(): void;
927
2544
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<SliderComponent, never>;
928
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<SliderComponent, "gog-slider", never, { "label": { "alias": "label"; "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; }; "showThumb": { "alias": "showThumb"; "required": false; "isSignal": true; }; "errorMessage": { "alias": "errorMessage"; "required": false; "isSignal": true; }; "errorDisplay": { "alias": "errorDisplay"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "fullWidth": { "alias": "fullWidth"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, never>;
2545
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<SliderComponent, "gog-slider", never, { "label": { "alias": "label"; "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; }; "showThumb": { "alias": "showThumb"; "required": false; "isSignal": true; }; "errorMessage": { "alias": "errorMessage"; "required": false; "isSignal": true; }; "errorDisplay": { "alias": "errorDisplay"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "fullWidth": { "alias": "fullWidth"; "required": false; "isSignal": true; }; "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, never>;
929
2546
  }
930
2547
 
931
2548
  declare class SkeletonComponent {
@@ -1129,7 +2746,53 @@ declare class SpinnerOverlayComponent {
1129
2746
 
1130
2747
  /** Default comparator: locale-aware for strings via `Intl.Collator`, `<`/`>` otherwise. */
1131
2748
  declare function defaultCompare(a: unknown, b: unknown): number;
1132
- declare class Column {
2749
+ /** Context handed to a `gogColumnBody` template. */
2750
+ interface GogColumnBodyContext<T> {
2751
+ /** The row object. */
2752
+ $implicit: T;
2753
+ /** Alias for `$implicit`, for templates that prefer naming it. */
2754
+ row: T;
2755
+ /** Index within the currently rendered page, not the whole data set. */
2756
+ index: number;
2757
+ /** The already-resolved cell value for this column's `field`. */
2758
+ value: unknown;
2759
+ }
2760
+ /** Context handed to a `gogColumnHeader` template. */
2761
+ interface GogColumnHeaderContext {
2762
+ /** The column's own `header` text, so a custom header can decorate rather than replace it. */
2763
+ $implicit: string;
2764
+ field: string;
2765
+ }
2766
+ /**
2767
+ * Custom cell markup for one column:
2768
+ *
2769
+ * ```html
2770
+ * <gog-column field="status" header="Status">
2771
+ * <ng-template gogColumnBody let-row let-value="value">
2772
+ * <gog-tag [variant]="row.ok ? 'success' : 'danger'">{{ value }}</gog-tag>
2773
+ * </ng-template>
2774
+ * </gog-column>
2775
+ * ```
2776
+ */
2777
+ declare class GogColumnBodyDirective<T = unknown> {
2778
+ readonly templateRef: TemplateRef<GogColumnBodyContext<T>>;
2779
+ static ngTemplateContextGuard<T>(_dir: GogColumnBodyDirective<T>, ctx: unknown): ctx is GogColumnBodyContext<T>;
2780
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<GogColumnBodyDirective<any>, never>;
2781
+ static ɵdir: _angular_core.ɵɵDirectiveDeclaration<GogColumnBodyDirective<any>, "[gogColumnBody]", never, {}, {}, never, never, true, never>;
2782
+ }
2783
+ /** Custom header markup for one column — see `GogColumnBodyDirective` for the shape. */
2784
+ declare class GogColumnHeaderDirective {
2785
+ readonly templateRef: TemplateRef<GogColumnHeaderContext>;
2786
+ static ngTemplateContextGuard(_dir: GogColumnHeaderDirective, ctx: unknown): ctx is GogColumnHeaderContext;
2787
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<GogColumnHeaderDirective, never>;
2788
+ static ɵdir: _angular_core.ɵɵDirectiveDeclaration<GogColumnHeaderDirective, "[gogColumnHeader]", never, {}, {}, never, never, true, never>;
2789
+ }
2790
+ /**
2791
+ * One column of `gog-table`. Cell and header markup are projected as `gogColumnBody` /
2792
+ * `gogColumnHeader` templates inside the column itself, so the column owning them is
2793
+ * structural rather than looked up by a matching string.
2794
+ */
2795
+ declare class GogColumn {
1133
2796
  /** Field name, or a dot-path into a nested property (e.g. `"address.city"`). */
1134
2797
  readonly field: _angular_core.InputSignal<string>;
1135
2798
  readonly header: _angular_core.InputSignal<string>;
@@ -1142,9 +2805,20 @@ declare class Column {
1142
2805
  readonly maxWidth: _angular_core.InputSignal<string>;
1143
2806
  /** Custom sort comparator for this column. Defaults to `defaultCompare`. */
1144
2807
  readonly comparator: _angular_core.InputSignal<((a: unknown, b: unknown) => number) | null>;
1145
- static ɵfac: _angular_core.ɵɵFactoryDeclaration<Column, never>;
1146
- static ɵdir: _angular_core.ɵɵDirectiveDeclaration<Column, "column", never, { "field": { "alias": "field"; "required": true; "isSignal": true; }; "header": { "alias": "header"; "required": false; "isSignal": true; }; "sortable": { "alias": "sortable"; "required": false; "isSignal": true; }; "width": { "alias": "width"; "required": false; "isSignal": true; }; "minWidth": { "alias": "minWidth"; "required": false; "isSignal": true; }; "maxWidth": { "alias": "maxWidth"; "required": false; "isSignal": true; }; "comparator": { "alias": "comparator"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
2808
+ readonly bodyTemplate: _angular_core.Signal<GogColumnBodyDirective<any> | undefined>;
2809
+ readonly headerTemplate: _angular_core.Signal<GogColumnHeaderDirective | undefined>;
2810
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<GogColumn, never>;
2811
+ static ɵdir: _angular_core.ɵɵDirectiveDeclaration<GogColumn, "gog-column, column", never, { "field": { "alias": "field"; "required": true; "isSignal": true; }; "header": { "alias": "header"; "required": false; "isSignal": true; }; "sortable": { "alias": "sortable"; "required": false; "isSignal": true; }; "width": { "alias": "width"; "required": false; "isSignal": true; }; "minWidth": { "alias": "minWidth"; "required": false; "isSignal": true; }; "maxWidth": { "alias": "maxWidth"; "required": false; "isSignal": true; }; "comparator": { "alias": "comparator"; "required": false; "isSignal": true; }; }, {}, ["bodyTemplate", "headerTemplate"], never, true, never>;
1147
2812
  }
2813
+ /**
2814
+ * @deprecated since 21.3.0 (2026-08-07) — use `GogColumn` instead. Removed in 21.5.0.
2815
+ * The same class under its old, unprefixed name.
2816
+ */
2817
+ declare const Column: typeof GogColumn;
2818
+ /**
2819
+ * @deprecated since 21.3.0 (2026-08-07) — use `GogColumn` instead. Removed in 21.5.0.
2820
+ */
2821
+ type Column = GogColumn;
1148
2822
 
1149
2823
  interface GogTableBodyContext<T> {
1150
2824
  $implicit: T;
@@ -1154,11 +2828,29 @@ interface GogTableHeaderContext {
1154
2828
  $implicit: never;
1155
2829
  }
1156
2830
  /**
1157
- * Marks a <ng-template> inside <gog-table> with a field name and optional type.
2831
+ * Marks a `<ng-template>` inside `<gog-table>` with a field name and optional type:
2832
+ *
2833
+ * ```html
2834
+ * <ng-template template="status" type="body" let-row>…</ng-template>
2835
+ * ```
1158
2836
  *
1159
- * Usage:
1160
- * <ng-template template="status" type="body" let-row>...</ng-template>
1161
- * <ng-template template="status" type="header">...</ng-template>
2837
+ * @deprecated since 21.3.0 (2026-08-07) — declare the template inside its own column with
2838
+ * `gogColumnBody` / `gogColumnHeader` instead. Removed in 21.5.0.
2839
+ *
2840
+ * The field name here is a string the compiler cannot check, so a typo silently renders the
2841
+ * default cell rather than failing; the column-scoped directives bind structurally and carry a
2842
+ * typed context. Migration:
2843
+ *
2844
+ * ```html
2845
+ * <!-- before -->
2846
+ * <gog-column field="status" />
2847
+ * <ng-template template="status" type="body" let-row>…</ng-template>
2848
+ *
2849
+ * <!-- after -->
2850
+ * <gog-column field="status">
2851
+ * <ng-template gogColumnBody let-row>…</ng-template>
2852
+ * </gog-column>
2853
+ * ```
1162
2854
  */
1163
2855
  declare class TemplateDirective {
1164
2856
  readonly template: _angular_core.InputSignal<string>;
@@ -1175,6 +2867,11 @@ interface SortState {
1175
2867
  direction: SortDirection;
1176
2868
  }
1177
2869
  declare class TableComponent<T extends object> {
2870
+ /**
2871
+ * The single size modifier, replacing one `[class.gog-table--<size>]` binding per size.
2872
+ * Empty for `'lg'`: that is this component's default size and has no modifier rule of its own — every `gog-table--*` chain bottoms out at it.
2873
+ */
2874
+ protected readonly sizeClass: _angular_core.Signal<string>;
1178
2875
  readonly value: _angular_core.InputSignal<T[]>;
1179
2876
  /**
1180
2877
  * Full width of the container by default. Set to `false` to shrink the table to fit
@@ -1187,7 +2884,7 @@ declare class TableComponent<T extends object> {
1187
2884
  readonly showTotal: _angular_core.InputSignal<boolean>;
1188
2885
  readonly emptyPlaceholder: _angular_core.InputSignal<string>;
1189
2886
  /** Alignment of pagination controls */
1190
- readonly paginatorPosition: _angular_core.InputSignal<"center" | "left" | "right">;
2887
+ readonly paginatorPosition: _angular_core.InputSignal<"left" | "right" | "center">;
1191
2888
  /** Alignment of total count label (only when showTotal=true) */
1192
2889
  readonly totalPosition: _angular_core.InputSignal<"left" | "right" | "opposite">;
1193
2890
  /** Show loading spinner instead of rows */
@@ -1198,7 +2895,7 @@ declare class TableComponent<T extends object> {
1198
2895
  readonly stickyHeader: _angular_core.InputSignal<boolean>;
1199
2896
  /** Row density: lg (default) / md (compact) / sm (dense) */
1200
2897
  readonly size: _angular_core.InputSignal<GogSize>;
1201
- readonly columns: _angular_core.Signal<readonly Column[]>;
2898
+ readonly columns: _angular_core.Signal<readonly GogColumn[]>;
1202
2899
  readonly templates: _angular_core.Signal<readonly TemplateDirective[]>;
1203
2900
  readonly sortState: _angular_core.WritableSignal<SortState>;
1204
2901
  readonly sortedData: _angular_core.Signal<T[]>;
@@ -1214,19 +2911,27 @@ declare class TableComponent<T extends object> {
1214
2911
  readonly visibleRows: _angular_core.Signal<T[]>;
1215
2912
  readonly hasPagination: _angular_core.Signal<boolean>;
1216
2913
  readonly emptyColspan: _angular_core.Signal<number>;
1217
- getBodyTemplate(field: string): TemplateRef<unknown> | null;
1218
- getHeaderTemplate(field: string): TemplateRef<unknown> | null;
1219
- toggleSort(col: Column): void;
2914
+ /**
2915
+ * A `gogColumnBody` template declared inside the column wins; the string-keyed
2916
+ * `<ng-template template="field" type="body">` is the deprecated fallback.
2917
+ */
2918
+ getBodyTemplate(col: GogColumn): TemplateRef<unknown> | null;
2919
+ getHeaderTemplate(col: GogColumn): TemplateRef<unknown> | null;
2920
+ /** Context for a `gogColumnBody` template — see `GogColumnBodyContext`. */
2921
+ bodyContext(row: T, col: GogColumn, index: number): GogColumnBodyContext<T>;
2922
+ /** Context for a `gogColumnHeader` template — see `GogColumnHeaderContext`. */
2923
+ headerContext(col: GogColumn): GogColumnHeaderContext;
2924
+ toggleSort(col: GogColumn): void;
1220
2925
  getSortDirection(field: string): SortDirection;
1221
2926
  getAriaSort(field: string): 'ascending' | 'descending' | null;
1222
- handleSortClick(col: Column): void;
2927
+ handleSortClick(col: GogColumn): void;
1223
2928
  getCellValue(row: T, field: string): unknown;
1224
2929
  formatCellValue(row: T, field: string): string;
1225
2930
  globalRowIndex(localIndex: number): number;
1226
2931
  /** CSS grid-area for the total label: left slot or right slot */
1227
2932
  readonly totalGridArea: _angular_core.Signal<"left" | "right">;
1228
2933
  /** CSS grid-area for the pagination block */
1229
- readonly paginatorGridArea: _angular_core.Signal<"center" | "left" | "right">;
2934
+ readonly paginatorGridArea: _angular_core.Signal<"left" | "right" | "center">;
1230
2935
  private readonly bodyTemplateMap;
1231
2936
  private readonly headerTemplateMap;
1232
2937
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<TableComponent<any>, never>;
@@ -1247,6 +2952,87 @@ declare class SpinnerComponent {
1247
2952
  static ɵcmp: _angular_core.ɵɵComponentDeclaration<SpinnerComponent, "gog-spinner", never, { "size": { "alias": "size"; "required": false; "isSignal": true; }; "overlay": { "alias": "overlay"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
1248
2953
  }
1249
2954
 
2955
+ /**
2956
+ * Adds a hover/focus tooltip to any element — a `gog-*` component's host tag or a plain
2957
+ * native one — without that element needing to know anything about it:
2958
+ * `<button gogTooltip="Save changes">` or `<gog-chip [gogTooltip]="hint">` both just work,
2959
+ * since this only ever reads the host `ElementRef` and never assumes what created it.
2960
+ *
2961
+ * The bubble itself is a separate component (`GogTooltipBubbleComponent`) created on demand
2962
+ * and moved into `document.body` via `GogTooltipOverlay` — see that file for why a portal is
2963
+ * necessary here (clipping/position ancestors) and why it isn't built on `GogDropdownOverlay`.
2964
+ */
2965
+ declare class GogTooltipDirective {
2966
+ /** The hint text, or a `TemplateRef` for richer content. Empty/null shows nothing. */
2967
+ readonly gogTooltip: _angular_core.InputSignal<string | TemplateRef<unknown> | null>;
2968
+ /** Unset, falls back to `GOG_CONFIG.tooltip.position`, then to `'auto'`. */
2969
+ readonly gogTooltipPosition: _angular_core.InputSignal<GogTooltipPosition | undefined>;
2970
+ /** Unset, falls back to `GOG_CONFIG.tooltip.showDelay`, then to `300` (ms). */
2971
+ readonly gogTooltipShowDelay: _angular_core.InputSignal<number | undefined>;
2972
+ /** Unset, falls back to `GOG_CONFIG.tooltip.hideDelay`, then to `100` (ms). */
2973
+ readonly gogTooltipHideDelay: _angular_core.InputSignal<number | undefined>;
2974
+ readonly gogTooltipDisabled: _angular_core.InputSignal<boolean>;
2975
+ /**
2976
+ * Extra class(es) applied to the bubble itself, for restyling one specific tooltip
2977
+ * instance. The bubble is appended to `document.body`, so a `--gog-tooltip-*` override
2978
+ * scoped to an ancestor (anything short of `:root`) never reaches it — a class targeting
2979
+ * the bubble directly, e.g. `.my-tooltip { --gog-tooltip-bg: gold; }`, is what does.
2980
+ */
2981
+ readonly gogTooltipClass: _angular_core.InputSignal<string>;
2982
+ private readonly elRef;
2983
+ private readonly viewContainerRef;
2984
+ private readonly document;
2985
+ private readonly destroyRef;
2986
+ private readonly globalConfig;
2987
+ private readonly isBrowser;
2988
+ private readonly uid;
2989
+ private readonly overlay;
2990
+ private readonly isVisible;
2991
+ protected readonly describedById: _angular_core.Signal<string | null>;
2992
+ private readonly resolvedPosition;
2993
+ private readonly resolvedShowDelay;
2994
+ private readonly resolvedHideDelay;
2995
+ private activeRef;
2996
+ private showTimer;
2997
+ private hideTimer;
2998
+ private repositionFrame;
2999
+ private readonly onReflow;
3000
+ /**
3001
+ * Bound to the bubble itself (see `show()`) so moving the pointer off the trigger and
3002
+ * onto the bubble — to read more of it, or to scroll one tall enough to need it — cancels
3003
+ * the pending hide instead of racing it; leaving the bubble then re-queues the same hide
3004
+ * delay leaving the trigger would. WCAG 2.1 SC 1.4.13 "hoverable" requires exactly this:
3005
+ * hover-triggered content has to stay visible while the pointer is over the content, not
3006
+ * just the trigger.
3007
+ */
3008
+ private readonly onBubbleMouseEnter;
3009
+ private readonly onBubbleMouseLeave;
3010
+ constructor();
3011
+ protected onPointerEnter(): void;
3012
+ protected onPointerLeave(): void;
3013
+ protected onFocusIn(): void;
3014
+ protected onFocusOut(): void;
3015
+ protected onEscape(): void;
3016
+ private queueShow;
3017
+ private queueHide;
3018
+ private cancelTimers;
3019
+ private show;
3020
+ private hide;
3021
+ private scheduleReposition;
3022
+ private applyPlacement;
3023
+ /**
3024
+ * A tooltip appended to `document.body` loses whatever `--gog-tooltip-z` an ancestor
3025
+ * (e.g. a `gog-dialog` panel, which raises it so nested overlays stack above the dialog)
3026
+ * declared, since `body` isn't part of that subtree anymore — same problem
3027
+ * `GogDropdownBase.resolvePanelZIndex` solves for dropdown panels, resolved here from the
3028
+ * trigger while it's still in its real position in the tree, before the bubble moves out.
3029
+ */
3030
+ private resolveZIndex;
3031
+ private cleanup;
3032
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<GogTooltipDirective, never>;
3033
+ static ɵdir: _angular_core.ɵɵDirectiveDeclaration<GogTooltipDirective, "[gogTooltip]", never, { "gogTooltip": { "alias": "gogTooltip"; "required": false; "isSignal": true; }; "gogTooltipPosition": { "alias": "gogTooltipPosition"; "required": false; "isSignal": true; }; "gogTooltipShowDelay": { "alias": "gogTooltipShowDelay"; "required": false; "isSignal": true; }; "gogTooltipHideDelay": { "alias": "gogTooltipHideDelay"; "required": false; "isSignal": true; }; "gogTooltipDisabled": { "alias": "gogTooltipDisabled"; "required": false; "isSignal": true; }; "gogTooltipClass": { "alias": "gogTooltipClass"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
3034
+ }
3035
+
1250
3036
  declare class ThemeService {
1251
3037
  private readonly document;
1252
3038
  private readonly root;
@@ -1285,6 +3071,93 @@ interface GogGlobalConfig {
1285
3071
  button?: {
1286
3072
  debounce?: number;
1287
3073
  };
3074
+ tooltip?: {
3075
+ showDelay?: number;
3076
+ hideDelay?: number;
3077
+ position?: GogTooltipPosition;
3078
+ };
3079
+ /** Applies to `gog-inputfield`, `gog-select`, `gog-multiselect` and `gog-textarea`. */
3080
+ floatLabel?: {
3081
+ variant?: GogFloatLabelVariant;
3082
+ /**
3083
+ * Whether the field's own `placeholder` reappears once its label has floated out of
3084
+ * the way. Defaults to `false` — the placeholder stays hidden the whole time a float
3085
+ * label is active, since the resting label already occupies that space.
3086
+ */
3087
+ showPlaceholder?: boolean;
3088
+ };
3089
+ /**
3090
+ * Defaults for the interactive form controls — the two settings an app otherwise repeats on
3091
+ * literally every one of them: a compact app writes `size="sm"` everywhere, and a
3092
+ * Reactive-Forms app writes `errorDisplay="auto"` on every field.
3093
+ *
3094
+ * - `size` applies to `gog-button`, `gog-inputfield`, `gog-textarea`, `gog-select`,
3095
+ * `gog-multiselect`, `gog-checkbox` and `gog-radio-group`. Deliberately **not** to
3096
+ * `gog-table`, `gog-accordion` or `gog-paginator` (whose `size` means row/layout density
3097
+ * and whose defaults differ), nor to `gog-spinner`, `gog-skeleton`, `gog-tag` or
3098
+ * `gog-chip` (sized to fit whatever they sit next to, not to a form's density).
3099
+ * - `errorDisplay` applies to every control that renders a validation message:
3100
+ * `gog-inputfield`, `gog-textarea`, `gog-select`, `gog-multiselect`, `gog-radio-group`
3101
+ * and `gog-slider`.
3102
+ *
3103
+ * A component's own built-in default still applies when this is unset, so setting `size`
3104
+ * here does not flatten the different defaults those excluded components have.
3105
+ */
3106
+ control?: {
3107
+ size?: GogSize;
3108
+ errorDisplay?: GogErrorDisplay;
3109
+ /**
3110
+ * Whether `gog-inputfield`, `gog-textarea`, `gog-select` and `gog-multiselect` offer a
3111
+ * clear button. The button only ever appears once the control actually has something to
3112
+ * clear, so switching this on app-wide adds no permanent chrome.
3113
+ *
3114
+ * Component defaults are `false`, except `gog-multiselect`, which had a clear button
3115
+ * before this input existed and keeps it.
3116
+ */
3117
+ clearable?: boolean;
3118
+ };
3119
+ /** Applies to `gog-select` and `gog-multiselect`. */
3120
+ dropdown?: {
3121
+ /**
3122
+ * Whether the panel is rendered into `<body>` instead of inline. Worth setting app-wide
3123
+ * for a layout whose dropdowns generally live inside scrollable or overflow-clipped
3124
+ * containers, which is the case this exists for.
3125
+ */
3126
+ appendToBody?: boolean;
3127
+ direction?: GogDropdownDirection;
3128
+ /** Whether the panel shows a search box. Off by default. */
3129
+ filter?: boolean;
3130
+ /** Which end of the panel the search box sticks to. `'top'` by default. */
3131
+ filterPosition?: GogDropdownFilterPosition;
3132
+ };
3133
+ /**
3134
+ * Applies to `gog-datepicker` and `gog-calendar`. Every field here is something an app sets
3135
+ * once rather than per field — a locale and a date format repeated on every date input is
3136
+ * exactly the boilerplate this config exists to remove.
3137
+ */
3138
+ datepicker?: {
3139
+ /** BCP-47 tag driving month and weekday names. */
3140
+ locale?: string;
3141
+ /** 0 = Sunday … 6 = Saturday. Unset, it comes from the locale. */
3142
+ firstDayOfWeek?: number;
3143
+ /** Display and parse pattern (`dd.MM.yyyy`, `yyyy-MM-dd`, …). */
3144
+ format?: string;
3145
+ };
3146
+ /** Applies to `gog-autocomplete`. */
3147
+ autocomplete?: {
3148
+ /**
3149
+ * Milliseconds to wait after the last keystroke before `gogSearch` fires. A whole app
3150
+ * usually wants one answer here, tuned to its backend rather than to each field.
3151
+ */
3152
+ searchDebounce?: number;
3153
+ /** How many characters before the panel opens at all. */
3154
+ minLength?: number;
3155
+ };
3156
+ toast?: {
3157
+ position?: ToastPosition;
3158
+ /** How long a non-sticky toast stays up, in ms. */
3159
+ duration?: number;
3160
+ };
1288
3161
  }
1289
3162
  /**
1290
3163
  * Resolves to `{}` — every field falls through to its component's own hardcoded default —
@@ -1306,12 +3179,102 @@ declare const GOG_CONFIG: InjectionToken<GogGlobalConfig>;
1306
3179
  * ]
1307
3180
  * ```
1308
3181
  *
1309
- * Providing this again further down the injector tree (a route, a single component's own
1310
- * `providers`) replaces the whole object for that subtree rather than merging with the
1311
- * parent's pass everything you want in effect there, not just the one field you're
1312
- * changing.
3182
+ * **Providing this again further down the injector tree layers onto the parent's config
3183
+ * rather than replacing it.** A route that only cares about tooltips can say so, and the
3184
+ * app-wide `button.debounce` stays in effect inside it:
3185
+ *
3186
+ * ```ts
3187
+ * // a route's providers — button.debounce from app.config.ts still applies here
3188
+ * provideGogConfig({ tooltip: { showDelay: 0 } })
3189
+ * ```
3190
+ *
3191
+ * Merging is one level deep, per component key: the nearest provider wins field by field, so
3192
+ * `{ tooltip: { showDelay: 0 } }` overrides only `showDelay` and leaves a parent's
3193
+ * `tooltip.position` alone. To drop an inherited value rather than change it, set it back to
3194
+ * the component's own default explicitly — there is no "unset" marker.
1313
3195
  */
1314
3196
  declare function provideGogConfig(config: GogGlobalConfig): Provider;
3197
+ /**
3198
+ * The library's precedence rule for a configurable input, in one place: an instance's own
3199
+ * input wins, then the app-wide `GOG_CONFIG` value, then the component's built-in default.
3200
+ *
3201
+ * Every configurable input resolves through this rather than repeating the `??` chain, so the
3202
+ * order can't drift between components — a component that accidentally checked the config
3203
+ * first would silently ignore the input on that one control only, which is close to invisible
3204
+ * in review. Kept a plain function (no `inject`) so it works anywhere: inside a `computed`, in
3205
+ * a composition class like `GogFloatLabelState`, and in unit tests without an injector.
3206
+ *
3207
+ * ```ts
3208
+ * private readonly globalConfig = inject(GOG_CONFIG);
3209
+ * protected readonly resolvedDebounce = computed(() =>
3210
+ * resolveConfigured(this.debounce(), this.globalConfig.button?.debounce, DEFAULT_DEBOUNCE),
3211
+ * );
3212
+ * ```
3213
+ */
3214
+ declare function resolveConfigured<T>(instanceValue: T | undefined, configuredValue: T | undefined, fallback: T): T;
3215
+
3216
+ /**
3217
+ * Shared float-label state for the library's field-style controls.
3218
+ *
3219
+ * A plain class rather than a base class or directive, for the same reason as `GogErrorState`:
3220
+ * it has to serve `gog-inputfield` and `gog-textarea`, which share no base class, as well as
3221
+ * `GogDropdownBase`, which is one. Each consumer owns an instance and exposes whichever
3222
+ * members its template needs.
3223
+ *
3224
+ * The one thing each control must supply itself is `hasValue` — "this field has content" means
3225
+ * something different everywhere (a non-empty string, a non-null selection, a non-empty
3226
+ * selection array), which is exactly why this is composed in rather than implemented as a
3227
+ * directive sitting outside the component.
3228
+ */
3229
+ declare class GogFloatLabelState {
3230
+ private readonly variantInput;
3231
+ private readonly showPlaceholderInput;
3232
+ private readonly placeholder;
3233
+ private readonly isFocused;
3234
+ private readonly hasValue;
3235
+ private readonly config;
3236
+ /**
3237
+ * @param variantInput the control's own `floatLabel` input (`undefined` when unset)
3238
+ * @param showPlaceholderInput the control's own `floatLabelShowPlaceholder` input
3239
+ * @param placeholder the control's `placeholder` input
3240
+ * @param isFocused whether the control currently has focus
3241
+ * @param hasValue whether the control has a value — see the class note
3242
+ * @param config the injected `GOG_CONFIG`
3243
+ */
3244
+ constructor(variantInput: Signal<GogFloatLabelVariant | undefined>, showPlaceholderInput: Signal<boolean | undefined>, placeholder: Signal<string>, isFocused: Signal<boolean>, hasValue: Signal<boolean>, config: GogGlobalConfig);
3245
+ /** The resolved variant: instance input, else `GOG_CONFIG.floatLabel.variant`, else `'none'`. */
3246
+ readonly variant: Signal<GogFloatLabelVariant>;
3247
+ readonly showPlaceholder: Signal<boolean>;
3248
+ /** Whether a float label is in effect at all — `false` keeps the static label-above layout. */
3249
+ readonly isActive: Signal<boolean>;
3250
+ /** Whether the label is at its floated target rather than resting like a placeholder. */
3251
+ readonly isFloated: Signal<boolean>;
3252
+ /**
3253
+ * The placeholder the control should actually render. While a float label is active the
3254
+ * resting label already occupies that space, so the placeholder stays hidden unless the
3255
+ * consumer opted into `floatLabelShowPlaceholder` — and even then only once the label has
3256
+ * floated out of the way.
3257
+ */
3258
+ readonly effectivePlaceholder: Signal<string>;
3259
+ }
3260
+
3261
+ /** Every `--gog-*` custom property the library declares or documents as an override point. */
3262
+ type GogTokenName = '--gog-accent-bright' | '--gog-accent-color' | '--gog-accent-dim' | '--gog-accent-pale' | '--gog-accent-text-color' | '--gog-accordion-accent-color' | '--gog-accordion-body-bg' | '--gog-accordion-body-color' | '--gog-accordion-body-font-family' | '--gog-accordion-body-font-size' | '--gog-accordion-body-lift' | '--gog-accordion-body-line-height' | '--gog-accordion-body-padding-bottom' | '--gog-accordion-body-padding-top' | '--gog-accordion-body-radius' | '--gog-accordion-body-transition-duration' | '--gog-accordion-border-color' | '--gog-accordion-border-style' | '--gog-accordion-border-width' | '--gog-accordion-chevron-font-size' | '--gog-accordion-chevron-size' | '--gog-accordion-chevron-transition-duration' | '--gog-accordion-content-gap' | '--gog-accordion-disabled-opacity' | '--gog-accordion-focus-ring-width' | '--gog-accordion-font-family' | '--gog-accordion-font-size' | '--gog-accordion-header-bg' | '--gog-accordion-header-gap' | '--gog-accordion-header-text-transform' | '--gog-accordion-hover-bg' | '--gog-accordion-hover-ring' | '--gog-accordion-letter-spacing' | '--gog-accordion-lg-body-font-size' | '--gog-accordion-lg-body-line-height' | '--gog-accordion-lg-body-padding-bottom' | '--gog-accordion-lg-body-padding-top' | '--gog-accordion-lg-chevron-font-size' | '--gog-accordion-lg-chevron-size' | '--gog-accordion-lg-content-gap' | '--gog-accordion-lg-font-size' | '--gog-accordion-lg-letter-spacing' | '--gog-accordion-lg-padding-x' | '--gog-accordion-lg-padding-y' | '--gog-accordion-md-body-font-size' | '--gog-accordion-md-body-line-height' | '--gog-accordion-md-body-padding-bottom' | '--gog-accordion-md-body-padding-top' | '--gog-accordion-md-chevron-font-size' | '--gog-accordion-md-chevron-size' | '--gog-accordion-md-content-gap' | '--gog-accordion-md-font-size' | '--gog-accordion-md-letter-spacing' | '--gog-accordion-md-padding-x' | '--gog-accordion-md-padding-y' | '--gog-accordion-padding-x' | '--gog-accordion-padding-y' | '--gog-accordion-radius' | '--gog-accordion-slg-body-font-size' | '--gog-accordion-slg-body-line-height' | '--gog-accordion-slg-body-padding-bottom' | '--gog-accordion-slg-body-padding-top' | '--gog-accordion-slg-chevron-font-size' | '--gog-accordion-slg-chevron-size' | '--gog-accordion-slg-content-gap' | '--gog-accordion-slg-font-size' | '--gog-accordion-slg-letter-spacing' | '--gog-accordion-slg-padding-x' | '--gog-accordion-slg-padding-y' | '--gog-accordion-sm-body-font-size' | '--gog-accordion-sm-body-line-height' | '--gog-accordion-sm-body-padding-bottom' | '--gog-accordion-sm-body-padding-top' | '--gog-accordion-sm-chevron-font-size' | '--gog-accordion-sm-chevron-size' | '--gog-accordion-sm-content-gap' | '--gog-accordion-sm-font-size' | '--gog-accordion-sm-letter-spacing' | '--gog-accordion-sm-padding-x' | '--gog-accordion-sm-padding-y' | '--gog-accordion-text-color' | '--gog-accordion-transition-duration' | '--gog-accordion-xsm-body-font-size' | '--gog-accordion-xsm-body-line-height' | '--gog-accordion-xsm-body-padding-bottom' | '--gog-accordion-xsm-body-padding-top' | '--gog-accordion-xsm-chevron-font-size' | '--gog-accordion-xsm-chevron-size' | '--gog-accordion-xsm-content-gap' | '--gog-accordion-xsm-font-size' | '--gog-accordion-xsm-letter-spacing' | '--gog-accordion-xsm-padding-x' | '--gog-accordion-xsm-padding-y' | '--gog-autocomplete-actions-gap' | '--gog-autocomplete-actions-inset' | '--gog-autocomplete-actions-reserve' | '--gog-autocomplete-bg' | '--gog-autocomplete-border-color' | '--gog-autocomplete-border-style' | '--gog-autocomplete-border-width' | '--gog-autocomplete-clear-color' | '--gog-autocomplete-clear-hover-color' | '--gog-autocomplete-clear-icon-ratio' | '--gog-autocomplete-color' | '--gog-autocomplete-disabled-opacity' | '--gog-autocomplete-empty-color' | '--gog-autocomplete-empty-font-size' | '--gog-autocomplete-error-border-color' | '--gog-autocomplete-error-color' | '--gog-autocomplete-error-font-family' | '--gog-autocomplete-error-font-size' | '--gog-autocomplete-field-bg' | '--gog-autocomplete-float-label-in-top' | '--gog-autocomplete-float-label-on-bg' | '--gog-autocomplete-float-label-over-gap' | '--gog-autocomplete-float-label-over-reserve' | '--gog-autocomplete-float-label-reserve' | '--gog-autocomplete-focus-ring-color' | '--gog-autocomplete-focus-ring-offset' | '--gog-autocomplete-focus-ring-width' | '--gog-autocomplete-font-family' | '--gog-autocomplete-font-size' | '--gog-autocomplete-gap' | '--gog-autocomplete-hover-border-color' | '--gog-autocomplete-label-color' | '--gog-autocomplete-label-font-family' | '--gog-autocomplete-label-font-size' | '--gog-autocomplete-label-font-weight' | '--gog-autocomplete-label-letter-spacing' | '--gog-autocomplete-label-text-transform' | '--gog-autocomplete-line-height' | '--gog-autocomplete-min-width' | '--gog-autocomplete-option-color' | '--gog-autocomplete-option-gap' | '--gog-autocomplete-option-height' | '--gog-autocomplete-option-hover-bg' | '--gog-autocomplete-option-hover-color' | '--gog-autocomplete-option-padding' | '--gog-autocomplete-option-radius' | '--gog-autocomplete-option-selected-bg' | '--gog-autocomplete-option-selected-color' | '--gog-autocomplete-options-padding' | '--gog-autocomplete-padding-x' | '--gog-autocomplete-padding-y' | '--gog-autocomplete-panel-bg' | '--gog-autocomplete-panel-border-color' | '--gog-autocomplete-panel-border-style' | '--gog-autocomplete-panel-border-width' | '--gog-autocomplete-panel-gap' | '--gog-autocomplete-panel-max-height' | '--gog-autocomplete-panel-max-width' | '--gog-autocomplete-panel-radius' | '--gog-autocomplete-panel-shadow' | '--gog-autocomplete-placeholder-color' | '--gog-autocomplete-radius' | '--gog-autocomplete-spinner-size' | '--gog-autocomplete-text-color' | '--gog-autocomplete-transition-duration' | '--gog-background-color' | '--gog-badge-bg' | '--gog-badge-border-color' | '--gog-badge-border-style' | '--gog-badge-border-width' | '--gog-badge-color' | '--gog-badge-danger-bg' | '--gog-badge-danger-color' | '--gog-badge-dot-size' | '--gog-badge-font-family' | '--gog-badge-font-size' | '--gog-badge-font-weight' | '--gog-badge-info-bg' | '--gog-badge-info-color' | '--gog-badge-line-height' | '--gog-badge-offset' | '--gog-badge-padding-inline' | '--gog-badge-radius' | '--gog-badge-size' | '--gog-badge-success-bg' | '--gog-badge-success-color' | '--gog-badge-warning-bg' | '--gog-badge-warning-color' | '--gog-badge-z' | '--gog-border-color' | '--gog-btn-active-scale' | '--gog-btn-bg' | '--gog-btn-border' | '--gog-btn-border-style' | '--gog-btn-border-width' | '--gog-btn-color' | '--gog-btn-disabled-opacity' | '--gog-btn-focus-ring-offset' | '--gog-btn-focus-ring-width' | '--gog-btn-font-family' | '--gog-btn-font-weight' | '--gog-btn-gap' | '--gog-btn-ghost-bg' | '--gog-btn-ghost-border' | '--gog-btn-ghost-color' | '--gog-btn-ghost-hover-bg' | '--gog-btn-ghost-hover-color' | '--gog-btn-ghost-hover-shadow' | '--gog-btn-ghost-shadow' | '--gog-btn-ghost-spinner-color' | '--gog-btn-hover-bg' | '--gog-btn-hover-color' | '--gog-btn-hover-shadow' | '--gog-btn-letter-spacing' | '--gog-btn-lg-font-size' | '--gog-btn-lg-padding' | '--gog-btn-line-height' | '--gog-btn-loading-opacity' | '--gog-btn-md-font-size' | '--gog-btn-md-padding' | '--gog-btn-outline-bg' | '--gog-btn-outline-border' | '--gog-btn-outline-color' | '--gog-btn-outline-hover-bg' | '--gog-btn-outline-hover-color' | '--gog-btn-outline-hover-shadow' | '--gog-btn-outline-shadow' | '--gog-btn-outline-spinner-color' | '--gog-btn-primary-bg' | '--gog-btn-primary-border' | '--gog-btn-primary-color' | '--gog-btn-primary-hover-bg' | '--gog-btn-primary-hover-color' | '--gog-btn-primary-hover-shadow' | '--gog-btn-primary-shadow' | '--gog-btn-primary-spinner-color' | '--gog-btn-radius' | '--gog-btn-secondary-bg' | '--gog-btn-secondary-border' | '--gog-btn-secondary-color' | '--gog-btn-secondary-hover-bg' | '--gog-btn-secondary-hover-color' | '--gog-btn-secondary-hover-shadow' | '--gog-btn-secondary-shadow' | '--gog-btn-secondary-spinner-color' | '--gog-btn-shadow' | '--gog-btn-slg-font-size' | '--gog-btn-slg-padding' | '--gog-btn-sm-font-size' | '--gog-btn-sm-padding' | '--gog-btn-spinner-color' | '--gog-btn-spinner-max-size' | '--gog-btn-text-transform' | '--gog-btn-transition-duration' | '--gog-btn-xsm-font-size' | '--gog-btn-xsm-padding' | '--gog-button-toggle-bg' | '--gog-button-toggle-border-color' | '--gog-button-toggle-border-style' | '--gog-button-toggle-border-width' | '--gog-button-toggle-color' | '--gog-button-toggle-disabled-opacity' | '--gog-button-toggle-focus-ring-color' | '--gog-button-toggle-focus-ring-offset' | '--gog-button-toggle-focus-ring-width' | '--gog-button-toggle-font-family' | '--gog-button-toggle-font-size' | '--gog-button-toggle-font-weight' | '--gog-button-toggle-gap' | '--gog-button-toggle-hover-bg' | '--gog-button-toggle-hover-color' | '--gog-button-toggle-icon-size' | '--gog-button-toggle-letter-spacing' | '--gog-button-toggle-line-height' | '--gog-button-toggle-padding' | '--gog-button-toggle-radius' | '--gog-button-toggle-rest-bg' | '--gog-button-toggle-rest-color' | '--gog-button-toggle-selected-bg' | '--gog-button-toggle-selected-border-color' | '--gog-button-toggle-selected-color' | '--gog-button-toggle-separated-gap' | '--gog-button-toggle-text-transform' | '--gog-button-toggle-transition-duration' | '--gog-calendar-action-padding' | '--gog-calendar-color' | '--gog-calendar-day-bg' | '--gog-calendar-day-border-style' | '--gog-calendar-day-border-width' | '--gog-calendar-day-color' | '--gog-calendar-day-hover-bg' | '--gog-calendar-day-outside-color' | '--gog-calendar-day-radius' | '--gog-calendar-day-rest-bg' | '--gog-calendar-day-rest-color' | '--gog-calendar-day-size' | '--gog-calendar-disabled-opacity' | '--gog-calendar-divider-color' | '--gog-calendar-divider-style' | '--gog-calendar-divider-width' | '--gog-calendar-focus-ring-color' | '--gog-calendar-focus-ring-offset' | '--gog-calendar-focus-ring-width' | '--gog-calendar-font-family' | '--gog-calendar-header-gap' | '--gog-calendar-header-margin' | '--gog-calendar-lg-day-size' | '--gog-calendar-lg-font-size' | '--gog-calendar-md-day-size' | '--gog-calendar-md-font-size' | '--gog-calendar-months-gap' | '--gog-calendar-nav-bg' | '--gog-calendar-nav-color' | '--gog-calendar-nav-hover-bg' | '--gog-calendar-nav-hover-color' | '--gog-calendar-nav-icon-overlap' | '--gog-calendar-nav-icon-size' | '--gog-calendar-nav-radius' | '--gog-calendar-nav-size' | '--gog-calendar-padding' | '--gog-calendar-range-bg' | '--gog-calendar-range-color' | '--gog-calendar-selected-bg' | '--gog-calendar-selected-color' | '--gog-calendar-selected-font-weight' | '--gog-calendar-slg-day-size' | '--gog-calendar-slg-font-size' | '--gog-calendar-sm-day-size' | '--gog-calendar-sm-font-size' | '--gog-calendar-time-gap' | '--gog-calendar-time-input-bg' | '--gog-calendar-time-input-padding' | '--gog-calendar-time-input-width' | '--gog-calendar-time-margin' | '--gog-calendar-title-color' | '--gog-calendar-title-font-weight' | '--gog-calendar-today-border-color' | '--gog-calendar-today-font-weight' | '--gog-calendar-transition-duration' | '--gog-calendar-weekday-color' | '--gog-calendar-weekday-font-size' | '--gog-calendar-weekday-font-weight' | '--gog-calendar-weekday-padding' | '--gog-calendar-weekday-text-transform' | '--gog-calendar-xsm-day-size' | '--gog-calendar-xsm-font-size' | '--gog-checkbox-bg' | '--gog-checkbox-border-color' | '--gog-checkbox-border-style' | '--gog-checkbox-border-width' | '--gog-checkbox-box-size' | '--gog-checkbox-checked-bg' | '--gog-checkbox-checked-border' | '--gog-checkbox-dash-height' | '--gog-checkbox-dash-radius' | '--gog-checkbox-dash-width-ratio' | '--gog-checkbox-disabled-opacity' | '--gog-checkbox-focus-ring' | '--gog-checkbox-focus-ring-offset' | '--gog-checkbox-focus-ring-width' | '--gog-checkbox-font-family' | '--gog-checkbox-gap' | '--gog-checkbox-icon-color' | '--gog-checkbox-icon-size' | '--gog-checkbox-label-color' | '--gog-checkbox-label-line-height' | '--gog-checkbox-label-size' | '--gog-checkbox-padding' | '--gog-checkbox-radius' | '--gog-checkbox-transition-duration' | '--gog-chip-avatar-inset-ratio' | '--gog-chip-avatar-size' | '--gog-chip-bg' | '--gog-chip-border' | '--gog-chip-border-style' | '--gog-chip-border-width' | '--gog-chip-color' | '--gog-chip-disabled-opacity' | '--gog-chip-focus-ring-offset' | '--gog-chip-focus-ring-width' | '--gog-chip-font-family' | '--gog-chip-font-size' | '--gog-chip-font-weight' | '--gog-chip-gap' | '--gog-chip-hover-bg' | '--gog-chip-icon-size' | '--gog-chip-lg-avatar-size' | '--gog-chip-lg-font-size' | '--gog-chip-lg-gap' | '--gog-chip-lg-icon-size' | '--gog-chip-lg-padding-block' | '--gog-chip-lg-padding-inline' | '--gog-chip-lg-remove-size' | '--gog-chip-line-height' | '--gog-chip-md-avatar-size' | '--gog-chip-md-font-size' | '--gog-chip-md-gap' | '--gog-chip-md-icon-size' | '--gog-chip-md-padding-block' | '--gog-chip-md-padding-inline' | '--gog-chip-md-remove-size' | '--gog-chip-padding-block' | '--gog-chip-padding-inline' | '--gog-chip-pill-radius' | '--gog-chip-radius' | '--gog-chip-remove-color' | '--gog-chip-remove-hover-color' | '--gog-chip-remove-inset-ratio' | '--gog-chip-remove-scale' | '--gog-chip-remove-size' | '--gog-chip-slg-avatar-size' | '--gog-chip-slg-font-size' | '--gog-chip-slg-gap' | '--gog-chip-slg-icon-size' | '--gog-chip-slg-padding-block' | '--gog-chip-slg-padding-inline' | '--gog-chip-slg-remove-size' | '--gog-chip-sm-avatar-size' | '--gog-chip-sm-font-size' | '--gog-chip-sm-gap' | '--gog-chip-sm-icon-size' | '--gog-chip-sm-padding-block' | '--gog-chip-sm-padding-inline' | '--gog-chip-sm-remove-size' | '--gog-chip-xsm-avatar-size' | '--gog-chip-xsm-font-size' | '--gog-chip-xsm-gap' | '--gog-chip-xsm-icon-size' | '--gog-chip-xsm-padding-block' | '--gog-chip-xsm-padding-inline' | '--gog-chip-xsm-remove-size' | '--gog-collapsible-disabled-opacity' | '--gog-collapsible-max-height' | '--gog-collapsible-transition-duration' | '--gog-confirm-actions-gap' | '--gog-confirm-actions-offset' | '--gog-confirm-color' | '--gog-confirm-description-color' | '--gog-confirm-gap' | '--gog-confirm-max-width' | '--gog-confirm-min-width' | '--gog-control-border-style' | '--gog-control-border-width' | '--gog-control-checkbox-box-size-lg' | '--gog-control-checkbox-box-size-md' | '--gog-control-checkbox-box-size-slg' | '--gog-control-checkbox-box-size-sm' | '--gog-control-checkbox-box-size-xsm' | '--gog-control-checkbox-icon-size-lg' | '--gog-control-checkbox-icon-size-md' | '--gog-control-checkbox-icon-size-slg' | '--gog-control-checkbox-icon-size-sm' | '--gog-control-checkbox-icon-size-xsm' | '--gog-control-checkbox-label-size-lg' | '--gog-control-checkbox-label-size-md' | '--gog-control-checkbox-label-size-slg' | '--gog-control-checkbox-label-size-sm' | '--gog-control-checkbox-label-size-xsm' | '--gog-control-checkbox-padding' | '--gog-control-icon-offset' | '--gog-control-padding-x' | '--gog-control-padding-y' | '--gog-danger-color' | '--gog-datepicker-actions-gap' | '--gog-datepicker-actions-inset' | '--gog-datepicker-actions-reserve' | '--gog-datepicker-bg' | '--gog-datepicker-border-color' | '--gog-datepicker-border-style' | '--gog-datepicker-border-width' | '--gog-datepicker-clear-color' | '--gog-datepicker-clear-icon-ratio' | '--gog-datepicker-color' | '--gog-datepicker-disabled-opacity' | '--gog-datepicker-error-border-color' | '--gog-datepicker-error-color' | '--gog-datepicker-error-font-family' | '--gog-datepicker-error-font-size' | '--gog-datepicker-field-bg' | '--gog-datepicker-float-label-in-top' | '--gog-datepicker-float-label-on-bg' | '--gog-datepicker-float-label-over-gap' | '--gog-datepicker-float-label-over-reserve' | '--gog-datepicker-float-label-reserve' | '--gog-datepicker-focus-ring-color' | '--gog-datepicker-focus-ring-offset' | '--gog-datepicker-focus-ring-width' | '--gog-datepicker-font-family' | '--gog-datepicker-font-size' | '--gog-datepicker-gap' | '--gog-datepicker-hover-border-color' | '--gog-datepicker-icon-color' | '--gog-datepicker-icon-hover-color' | '--gog-datepicker-label-color' | '--gog-datepicker-label-font-family' | '--gog-datepicker-label-font-size' | '--gog-datepicker-label-letter-spacing' | '--gog-datepicker-label-text-transform' | '--gog-datepicker-line-height' | '--gog-datepicker-min-width' | '--gog-datepicker-padding-x' | '--gog-datepicker-padding-y' | '--gog-datepicker-panel-bg' | '--gog-datepicker-panel-border-color' | '--gog-datepicker-panel-border-style' | '--gog-datepicker-panel-border-width' | '--gog-datepicker-panel-gap' | '--gog-datepicker-panel-radius' | '--gog-datepicker-panel-shadow' | '--gog-datepicker-placeholder-color' | '--gog-datepicker-radius' | '--gog-datepicker-text-color' | '--gog-datepicker-toggle-icon-size' | '--gog-datepicker-transition-duration' | '--gog-dialog-backdrop-bg' | '--gog-dialog-backdrop-blur' | '--gog-dialog-backdrop-fade-duration' | '--gog-dialog-backdrop-padding' | '--gog-dialog-bg' | '--gog-dialog-body-max-height' | '--gog-dialog-body-padding' | '--gog-dialog-border' | '--gog-dialog-border-style' | '--gog-dialog-border-width' | '--gog-dialog-close-color' | '--gog-dialog-close-focus-ring' | '--gog-dialog-close-focus-ring-offset' | '--gog-dialog-close-focus-ring-width' | '--gog-dialog-close-font-size' | '--gog-dialog-close-hover-bg' | '--gog-dialog-close-hover-border' | '--gog-dialog-close-hover-color' | '--gog-dialog-close-size' | '--gog-dialog-color' | '--gog-dialog-enter-distance' | '--gog-dialog-enter-duration' | '--gog-dialog-font-family' | '--gog-dialog-header-border-color' | '--gog-dialog-header-gap' | '--gog-dialog-header-padding' | '--gog-dialog-max-height' | '--gog-dialog-min-width' | '--gog-dialog-offset-x' | '--gog-dialog-offset-y' | '--gog-dialog-radius' | '--gog-dialog-shadow' | '--gog-disabled-opacity' | '--gog-divider-block-spacing' | '--gog-divider-color' | '--gog-divider-dashed-style' | '--gog-divider-dotted-style' | '--gog-divider-inline-spacing' | '--gog-divider-inset-size' | '--gog-divider-label-color' | '--gog-divider-label-font-family' | '--gog-divider-label-font-size' | '--gog-divider-label-font-weight' | '--gog-divider-label-gap' | '--gog-divider-label-line-height' | '--gog-divider-line-color' | '--gog-divider-line-thickness' | '--gog-divider-solid-style' | '--gog-divider-spacing' | '--gog-divider-thickness' | '--gog-divider-vertical-length' | '--gog-dropdown-z' | '--gog-duration-base' | '--gog-duration-fast' | '--gog-duration-slow' | '--gog-easing' | '--gog-field-float-label-in-top' | '--gog-field-float-label-over-gap' | '--gog-field-float-label-over-reserve' | '--gog-field-float-label-reserve' | '--gog-field-lg-font-size' | '--gog-field-lg-icon-inset' | '--gog-field-lg-icon-offset' | '--gog-field-lg-padding-x' | '--gog-field-lg-padding-y' | '--gog-field-md-font-size' | '--gog-field-md-icon-inset' | '--gog-field-md-icon-offset' | '--gog-field-md-padding-x' | '--gog-field-md-padding-y' | '--gog-field-slg-font-size' | '--gog-field-slg-icon-inset' | '--gog-field-slg-icon-offset' | '--gog-field-slg-padding-x' | '--gog-field-slg-padding-y' | '--gog-field-sm-font-size' | '--gog-field-sm-icon-inset' | '--gog-field-sm-icon-offset' | '--gog-field-sm-padding-x' | '--gog-field-sm-padding-y' | '--gog-field-xsm-font-size' | '--gog-field-xsm-icon-inset' | '--gog-field-xsm-icon-offset' | '--gog-field-xsm-padding-x' | '--gog-field-xsm-padding-y' | '--gog-focus-ring-offset' | '--gog-focus-ring-width' | '--gog-font-body' | '--gog-font-heading' | '--gog-font-mono' | '--gog-hover-color' | '--gog-icon-fallback-size' | '--gog-icon-size' | '--gog-icon-stroke-width' | '--gog-info-color' | '--gog-input-clear-icon-ratio' | '--gog-input-clear-inset' | '--gog-input-clear-radius' | '--gog-input-disabled-opacity' | '--gog-input-error-color' | '--gog-input-error-font-size' | '--gog-input-error-offset' | '--gog-input-field-bg' | '--gog-input-field-border' | '--gog-input-field-border-style' | '--gog-input-field-border-width' | '--gog-input-field-color' | '--gog-input-float-label-in-top' | '--gog-input-float-label-on-bg' | '--gog-input-float-label-over-gap' | '--gog-input-float-label-over-reserve' | '--gog-input-float-label-reserve' | '--gog-input-focus-border' | '--gog-input-focus-glow' | '--gog-input-focus-ring' | '--gog-input-focus-ring-offset' | '--gog-input-focus-ring-width' | '--gog-input-font' | '--gog-input-font-family' | '--gog-input-gap' | '--gog-input-icon-action-radius' | '--gog-input-icon-color' | '--gog-input-icon-focus-ring-width' | '--gog-input-icon-hover-color' | '--gog-input-label-color' | '--gog-input-label-font-family' | '--gog-input-label-font-size' | '--gog-input-label-letter-spacing' | '--gog-input-label-text-transform' | '--gog-input-padding-x' | '--gog-input-padding-y' | '--gog-input-placeholder-color' | '--gog-input-radius' | '--gog-input-transition-duration' | '--gog-ms-actions-gap' | '--gog-ms-actions-inset' | '--gog-ms-arrow-icon-ratio' | '--gog-ms-arrow-transition-duration' | '--gog-ms-border-color' | '--gog-ms-checkbox-bg' | '--gog-ms-checkbox-border' | '--gog-ms-checkbox-checked-bg' | '--gog-ms-checkbox-checked-color' | '--gog-ms-clear-icon-ratio' | '--gog-ms-clear-radius' | '--gog-ms-controls-gap' | '--gog-ms-controls-padding' | '--gog-ms-disabled-opacity' | '--gog-ms-error-color' | '--gog-ms-error-font-size' | '--gog-ms-error-offset' | '--gog-ms-field-bg' | '--gog-ms-field-border' | '--gog-ms-field-border-style' | '--gog-ms-field-border-width' | '--gog-ms-field-color' | '--gog-ms-filter-border-color' | '--gog-ms-filter-border-style' | '--gog-ms-filter-border-width' | '--gog-ms-filter-empty-color' | '--gog-ms-filter-empty-padding' | '--gog-ms-filter-input-bg' | '--gog-ms-filter-input-border' | '--gog-ms-filter-input-color' | '--gog-ms-filter-input-padding-x' | '--gog-ms-filter-input-padding-y' | '--gog-ms-filter-input-radius' | '--gog-ms-filter-padding' | '--gog-ms-float-label-in-top' | '--gog-ms-float-label-over-gap' | '--gog-ms-float-label-over-reserve' | '--gog-ms-float-label-reserve' | '--gog-ms-focus-border' | '--gog-ms-focus-glow' | '--gog-ms-focus-ring' | '--gog-ms-focus-ring-offset' | '--gog-ms-focus-ring-width' | '--gog-ms-font-family' | '--gog-ms-gap' | '--gog-ms-label-color' | '--gog-ms-label-font-family' | '--gog-ms-label-font-size' | '--gog-ms-label-letter-spacing' | '--gog-ms-label-text-transform' | '--gog-ms-mark-icon-ratio' | '--gog-ms-mark-size-ratio' | '--gog-ms-min-width' | '--gog-ms-option-color' | '--gog-ms-option-disabled-opacity' | '--gog-ms-option-gap' | '--gog-ms-option-gap-inline' | '--gog-ms-option-height' | '--gog-ms-option-hover-bg' | '--gog-ms-option-radius' | '--gog-ms-option-transition-duration' | '--gog-ms-options-padding' | '--gog-ms-overflow-color' | '--gog-ms-overflow-font-size' | '--gog-ms-overflow-gap' | '--gog-ms-panel-bg' | '--gog-ms-panel-border' | '--gog-ms-panel-max-height' | '--gog-ms-panel-max-width' | '--gog-ms-panel-offset' | '--gog-ms-panel-shadow' | '--gog-ms-placeholder-color' | '--gog-ms-radius' | '--gog-ms-transition-duration' | '--gog-ms-value-color' | '--gog-multiselect-actions-gap' | '--gog-multiselect-actions-inset' | '--gog-multiselect-arrow-icon-ratio' | '--gog-multiselect-arrow-transition-duration' | '--gog-multiselect-border-color' | '--gog-multiselect-checkbox-bg' | '--gog-multiselect-checkbox-border' | '--gog-multiselect-checkbox-checked-bg' | '--gog-multiselect-checkbox-checked-color' | '--gog-multiselect-clear-icon-ratio' | '--gog-multiselect-clear-radius' | '--gog-multiselect-controls-gap' | '--gog-multiselect-controls-padding' | '--gog-multiselect-disabled-opacity' | '--gog-multiselect-error-color' | '--gog-multiselect-error-font-size' | '--gog-multiselect-error-offset' | '--gog-multiselect-field-bg' | '--gog-multiselect-field-border' | '--gog-multiselect-field-border-style' | '--gog-multiselect-field-border-width' | '--gog-multiselect-field-color' | '--gog-multiselect-filter-border-color' | '--gog-multiselect-filter-border-style' | '--gog-multiselect-filter-border-width' | '--gog-multiselect-filter-empty-color' | '--gog-multiselect-filter-empty-padding' | '--gog-multiselect-filter-input-bg' | '--gog-multiselect-filter-input-border' | '--gog-multiselect-filter-input-color' | '--gog-multiselect-filter-input-padding-x' | '--gog-multiselect-filter-input-padding-y' | '--gog-multiselect-filter-input-radius' | '--gog-multiselect-filter-padding' | '--gog-multiselect-float-label-in-top' | '--gog-multiselect-float-label-on-bg' | '--gog-multiselect-float-label-over-gap' | '--gog-multiselect-float-label-over-reserve' | '--gog-multiselect-float-label-reserve' | '--gog-multiselect-focus-border' | '--gog-multiselect-focus-glow' | '--gog-multiselect-focus-ring' | '--gog-multiselect-focus-ring-offset' | '--gog-multiselect-focus-ring-width' | '--gog-multiselect-font-family' | '--gog-multiselect-font-size' | '--gog-multiselect-gap' | '--gog-multiselect-label-color' | '--gog-multiselect-label-font-family' | '--gog-multiselect-label-font-size' | '--gog-multiselect-label-letter-spacing' | '--gog-multiselect-label-text-transform' | '--gog-multiselect-mark-icon-ratio' | '--gog-multiselect-mark-size-ratio' | '--gog-multiselect-min-width' | '--gog-multiselect-option-color' | '--gog-multiselect-option-disabled-opacity' | '--gog-multiselect-option-gap' | '--gog-multiselect-option-gap-inline' | '--gog-multiselect-option-height' | '--gog-multiselect-option-hover-bg' | '--gog-multiselect-option-radius' | '--gog-multiselect-option-transition-duration' | '--gog-multiselect-options-padding' | '--gog-multiselect-overflow-color' | '--gog-multiselect-overflow-font-size' | '--gog-multiselect-overflow-gap' | '--gog-multiselect-padding-x' | '--gog-multiselect-padding-y' | '--gog-multiselect-panel-bg' | '--gog-multiselect-panel-border' | '--gog-multiselect-panel-max-height' | '--gog-multiselect-panel-max-width' | '--gog-multiselect-panel-offset' | '--gog-multiselect-panel-shadow' | '--gog-multiselect-placeholder-color' | '--gog-multiselect-radius' | '--gog-multiselect-transition-duration' | '--gog-multiselect-value-color' | '--gog-muted-text-color' | '--gog-paginator-ellipsis-color' | '--gog-paginator-ellipsis-font-family' | '--gog-paginator-ellipsis-font-size' | '--gog-paginator-ellipsis-min-width' | '--gog-paginator-gap' | '--gog-panel-border-style' | '--gog-panel-border-width' | '--gog-panel-radius' | '--gog-panel-shadow' | '--gog-primary-color' | '--gog-progressbar-accent-bg' | '--gog-progressbar-accent-buffer-bg' | '--gog-progressbar-buffer-bg' | '--gog-progressbar-danger-bg' | '--gog-progressbar-danger-buffer-bg' | '--gog-progressbar-fill-bg' | '--gog-progressbar-height' | '--gog-progressbar-indeterminate-duration' | '--gog-progressbar-indeterminate-easing' | '--gog-progressbar-info-bg' | '--gog-progressbar-info-buffer-bg' | '--gog-progressbar-lg-height' | '--gog-progressbar-md-height' | '--gog-progressbar-radius' | '--gog-progressbar-slg-height' | '--gog-progressbar-sm-height' | '--gog-progressbar-stripe-color' | '--gog-progressbar-stripe-size' | '--gog-progressbar-success-bg' | '--gog-progressbar-success-buffer-bg' | '--gog-progressbar-track-base-bg' | '--gog-progressbar-track-bg' | '--gog-progressbar-transition-duration' | '--gog-progressbar-value-color' | '--gog-progressbar-value-font-family' | '--gog-progressbar-value-font-size' | '--gog-progressbar-value-gap' | '--gog-progressbar-value-min-width' | '--gog-progressbar-warning-bg' | '--gog-progressbar-warning-buffer-bg' | '--gog-progressbar-xsm-height' | '--gog-radio-bg' | '--gog-radio-border-color' | '--gog-radio-border-style' | '--gog-radio-border-width' | '--gog-radio-box-size' | '--gog-radio-checked-bg' | '--gog-radio-checked-border' | '--gog-radio-disabled-opacity' | '--gog-radio-dot-color' | '--gog-radio-dot-size-ratio' | '--gog-radio-error-color' | '--gog-radio-error-font-size' | '--gog-radio-focus-ring' | '--gog-radio-focus-ring-offset' | '--gog-radio-focus-ring-width' | '--gog-radio-font-family' | '--gog-radio-gap' | '--gog-radio-group-gap' | '--gog-radio-group-label-color' | '--gog-radio-group-label-size' | '--gog-radio-group-option-gap' | '--gog-radio-group-option-gap-horizontal' | '--gog-radio-label-color' | '--gog-radio-label-line-height' | '--gog-radio-label-size' | '--gog-radio-padding' | '--gog-radio-transition-duration' | '--gog-radius' | '--gog-scroll-corner-bg' | '--gog-scroll-fade-duration' | '--gog-scroll-focus-ring' | '--gog-scroll-focus-ring-width' | '--gog-scroll-normal-thumb-min-size' | '--gog-scroll-normal-track-width' | '--gog-scroll-thin-thumb-min-size' | '--gog-scroll-thin-track-width' | '--gog-scroll-thumb-active-bg' | '--gog-scroll-thumb-bg' | '--gog-scroll-thumb-hover-bg' | '--gog-scroll-thumb-inset' | '--gog-scroll-thumb-radius' | '--gog-scroll-track-bg' | '--gog-scroll-track-radius' | '--gog-secondary-color' | '--gog-select-chevron-color' | '--gog-select-chevron-icon-ratio' | '--gog-select-chevron-inset' | '--gog-select-clear-color' | '--gog-select-clear-gap' | '--gog-select-clear-hover-color' | '--gog-select-clear-icon-ratio' | '--gog-select-clear-radius' | '--gog-select-control-font' | '--gog-select-control-gap' | '--gog-select-control-padding-x' | '--gog-select-control-padding-y' | '--gog-select-disabled-opacity' | '--gog-select-error-color' | '--gog-select-error-font-size' | '--gog-select-field-bg' | '--gog-select-field-border' | '--gog-select-field-border-style' | '--gog-select-field-border-width' | '--gog-select-field-color' | '--gog-select-filter-border-color' | '--gog-select-filter-border-style' | '--gog-select-filter-border-width' | '--gog-select-filter-empty-color' | '--gog-select-filter-empty-padding' | '--gog-select-filter-input-bg' | '--gog-select-filter-input-border' | '--gog-select-filter-input-color' | '--gog-select-filter-input-padding-x' | '--gog-select-filter-input-padding-y' | '--gog-select-filter-input-radius' | '--gog-select-filter-padding' | '--gog-select-float-label-in-top' | '--gog-select-float-label-on-bg' | '--gog-select-float-label-over-gap' | '--gog-select-float-label-over-reserve' | '--gog-select-float-label-reserve' | '--gog-select-focus-border' | '--gog-select-focus-glow' | '--gog-select-focus-ring' | '--gog-select-focus-ring-offset' | '--gog-select-focus-ring-width' | '--gog-select-font-family' | '--gog-select-gap' | '--gog-select-label-color' | '--gog-select-label-font-family' | '--gog-select-label-font-size' | '--gog-select-label-letter-spacing' | '--gog-select-label-text-transform' | '--gog-select-mark-icon-ratio' | '--gog-select-mark-size-ratio' | '--gog-select-min-width' | '--gog-select-option-color' | '--gog-select-option-disabled-opacity' | '--gog-select-option-gap' | '--gog-select-option-height' | '--gog-select-option-hover-bg' | '--gog-select-option-selected-color' | '--gog-select-option-transition-duration' | '--gog-select-panel-bg' | '--gog-select-panel-max-height' | '--gog-select-panel-max-width' | '--gog-select-panel-offset' | '--gog-select-panel-shadow' | '--gog-select-placeholder-color' | '--gog-select-radius' | '--gog-select-transition-duration' | '--gog-skeleton-base' | '--gog-skeleton-circle-size-lg' | '--gog-skeleton-circle-size-md' | '--gog-skeleton-circle-size-slg' | '--gog-skeleton-circle-size-sm' | '--gog-skeleton-circle-size-xsm' | '--gog-skeleton-line-gap' | '--gog-skeleton-line-height-lg' | '--gog-skeleton-line-height-md' | '--gog-skeleton-line-height-slg' | '--gog-skeleton-line-height-sm' | '--gog-skeleton-line-height-xsm' | '--gog-skeleton-line-radius' | '--gog-skeleton-pulse-duration' | '--gog-skeleton-pulse-min-opacity' | '--gog-skeleton-radius' | '--gog-skeleton-rect-height-lg' | '--gog-skeleton-rect-height-md' | '--gog-skeleton-rect-height-slg' | '--gog-skeleton-rect-height-sm' | '--gog-skeleton-rect-height-xsm' | '--gog-skeleton-shine' | '--gog-skeleton-short-line-width' | '--gog-skeleton-square-radius' | '--gog-skeleton-wave-duration' | '--gog-slider-auto-width' | '--gog-slider-disabled-opacity' | '--gog-slider-error-color' | '--gog-slider-error-font-family' | '--gog-slider-error-font-size' | '--gog-slider-fill-bg' | '--gog-slider-focus-ring' | '--gog-slider-focus-ring-width' | '--gog-slider-gap' | '--gog-slider-label-color' | '--gog-slider-label-font-family' | '--gog-slider-label-font-size' | '--gog-slider-label-letter-spacing' | '--gog-slider-label-text-transform' | '--gog-slider-range-color' | '--gog-slider-range-font-size' | '--gog-slider-thumb-bg' | '--gog-slider-thumb-border' | '--gog-slider-thumb-border-width' | '--gog-slider-thumb-glow-size' | '--gog-slider-thumb-radius' | '--gog-slider-thumb-shadow' | '--gog-slider-thumb-size' | '--gog-slider-track-area-height' | '--gog-slider-track-bg' | '--gog-slider-track-border-color' | '--gog-slider-track-border-style' | '--gog-slider-track-border-width' | '--gog-slider-track-height' | '--gog-slider-track-radius' | '--gog-slider-value-color' | '--gog-slider-value-font-family' | '--gog-slider-value-font-size' | '--gog-slider-value-min-width' | '--gog-slider-vertical-length' | '--gog-space-2xl' | '--gog-space-lg' | '--gog-space-md' | '--gog-space-sm' | '--gog-space-xs' | '--gog-spinner-arc-inner-color' | '--gog-spinner-arc-inner-dash' | '--gog-spinner-arc-inner-glow' | '--gog-spinner-arc-inner-opacity' | '--gog-spinner-arc-inner-pulse-opacity' | '--gog-spinner-arc-inner-stroke-compact' | '--gog-spinner-arc-outer-color' | '--gog-spinner-arc-outer-dash' | '--gog-spinner-arc-outer-glow' | '--gog-spinner-arc-outer-pulse-opacity' | '--gog-spinner-diamond-color' | '--gog-spinner-diamond-glow' | '--gog-spinner-diamond-opacity' | '--gog-spinner-glow-color' | '--gog-spinner-overlay-bg' | '--gog-spinner-overlay-blur' | '--gog-spinner-overlay-fade-duration' | '--gog-spinner-overlay-z' | '--gog-spinner-pulse-duration' | '--gog-spinner-ring-duration' | '--gog-spinner-ring-glow' | '--gog-spinner-ring-padding' | '--gog-spinner-rune-color' | '--gog-spinner-rune-font-family' | '--gog-spinner-rune-glow' | '--gog-spinner-rune-pulse-opacity' | '--gog-spinner-rune-size' | '--gog-spinner-size-lg' | '--gog-spinner-size-md' | '--gog-spinner-size-slg' | '--gog-spinner-size-sm' | '--gog-spinner-size-xsm' | '--gog-spinner-spin-duration' | '--gog-spinner-spin-slow-duration' | '--gog-spinner-ticks-duration' | '--gog-spinner-track-color' | '--gog-spinner-track-opacity' | '--gog-success-color' | '--gog-surface-color' | '--gog-table-accent-bright' | '--gog-table-accent-color' | '--gog-table-border-color' | '--gog-table-border-style' | '--gog-table-border-width' | '--gog-table-empty-font-size' | '--gog-table-empty-padding' | '--gog-table-focus-ring' | '--gog-table-focus-ring-width' | '--gog-table-font-family' | '--gog-table-footer-gap' | '--gog-table-footer-min-height' | '--gog-table-gap' | '--gog-table-header-font-family' | '--gog-table-header-letter-spacing' | '--gog-table-header-text-transform' | '--gog-table-hover-bg' | '--gog-table-lg-padding-v' | '--gog-table-lg-td-font-size' | '--gog-table-lg-th-font-size' | '--gog-table-loading-opacity' | '--gog-table-loading-padding' | '--gog-table-md-padding-v' | '--gog-table-md-td-font-size' | '--gog-table-md-th-font-size' | '--gog-table-muted-color' | '--gog-table-num-col-width' | '--gog-table-num-font-size' | '--gog-table-numeric-font-family' | '--gog-table-padding-h' | '--gog-table-row-border-width' | '--gog-table-row-transition-duration' | '--gog-table-slg-padding-v' | '--gog-table-slg-td-font-size' | '--gog-table-slg-th-font-size' | '--gog-table-sm-padding-v' | '--gog-table-sm-td-font-size' | '--gog-table-sm-th-font-size' | '--gog-table-sort-icon-opacity' | '--gog-table-sort-icon-size' | '--gog-table-sort-icon-width' | '--gog-table-surface' | '--gog-table-td-font-size' | '--gog-table-td-padding-v' | '--gog-table-text-color' | '--gog-table-th-font-size' | '--gog-table-th-inner-gap' | '--gog-table-th-padding-v' | '--gog-table-total-font-size' | '--gog-table-total-letter-spacing' | '--gog-table-total-text-transform' | '--gog-table-xsm-padding-v' | '--gog-table-xsm-td-font-size' | '--gog-table-xsm-th-font-size' | '--gog-tabs-active-color' | '--gog-tabs-disabled-opacity' | '--gog-tabs-focus-ring-color' | '--gog-tabs-focus-ring-offset' | '--gog-tabs-focus-ring-width' | '--gog-tabs-font-family' | '--gog-tabs-font-weight' | '--gog-tabs-gap' | '--gog-tabs-header-border-color' | '--gog-tabs-header-border-style' | '--gog-tabs-header-border-width' | '--gog-tabs-hover-color' | '--gog-tabs-icon-size' | '--gog-tabs-indicator-color' | '--gog-tabs-indicator-radius' | '--gog-tabs-indicator-thickness' | '--gog-tabs-letter-spacing' | '--gog-tabs-lg-font-size' | '--gog-tabs-lg-padding' | '--gog-tabs-line-height' | '--gog-tabs-md-font-size' | '--gog-tabs-md-padding' | '--gog-tabs-panel-color' | '--gog-tabs-panel-padding' | '--gog-tabs-rest-bg' | '--gog-tabs-rest-color' | '--gog-tabs-slg-font-size' | '--gog-tabs-slg-padding' | '--gog-tabs-sm-font-size' | '--gog-tabs-sm-padding' | '--gog-tabs-tab-bg' | '--gog-tabs-tab-color' | '--gog-tabs-tab-font-size' | '--gog-tabs-tab-gap' | '--gog-tabs-tab-padding' | '--gog-tabs-text-transform' | '--gog-tabs-transition-duration' | '--gog-tabs-xsm-font-size' | '--gog-tabs-xsm-padding' | '--gog-tag-accent' | '--gog-tag-bg' | '--gog-tag-bg-base' | '--gog-tag-bg-mix' | '--gog-tag-border' | '--gog-tag-border-style' | '--gog-tag-border-width' | '--gog-tag-color' | '--gog-tag-color-base' | '--gog-tag-color-mix' | '--gog-tag-danger-color' | '--gog-tag-default-color' | '--gog-tag-font-family' | '--gog-tag-font-size' | '--gog-tag-font-weight' | '--gog-tag-gap' | '--gog-tag-icon-size' | '--gog-tag-info-color' | '--gog-tag-inner-border-width' | '--gog-tag-lg-font-size' | '--gog-tag-lg-gap' | '--gog-tag-lg-icon-size' | '--gog-tag-lg-padding-block' | '--gog-tag-lg-padding-inline' | '--gog-tag-line-height' | '--gog-tag-md-font-size' | '--gog-tag-md-gap' | '--gog-tag-md-icon-size' | '--gog-tag-md-padding-block' | '--gog-tag-md-padding-inline' | '--gog-tag-padding-block' | '--gog-tag-padding-inline' | '--gog-tag-pill-radius' | '--gog-tag-radius' | '--gog-tag-slg-font-size' | '--gog-tag-slg-gap' | '--gog-tag-slg-icon-size' | '--gog-tag-slg-padding-block' | '--gog-tag-slg-padding-inline' | '--gog-tag-sm-font-size' | '--gog-tag-sm-gap' | '--gog-tag-sm-icon-size' | '--gog-tag-sm-padding-block' | '--gog-tag-sm-padding-inline' | '--gog-tag-success-color' | '--gog-tag-warning-color' | '--gog-tag-xsm-font-size' | '--gog-tag-xsm-gap' | '--gog-tag-xsm-icon-size' | '--gog-tag-xsm-padding-block' | '--gog-tag-xsm-padding-inline' | '--gog-text-2xl' | '--gog-text-3xl' | '--gog-text-color' | '--gog-text-lg' | '--gog-text-md' | '--gog-text-sm' | '--gog-text-xl' | '--gog-text-xs' | '--gog-textarea-clear-icon-ratio' | '--gog-textarea-scrollbar-width' | '--gog-toast-accent-width' | '--gog-toast-action-font-size' | '--gog-toast-action-padding' | '--gog-toast-actions-gap' | '--gog-toast-base-z' | '--gog-toast-bg' | '--gog-toast-border' | '--gog-toast-close-font-size' | '--gog-toast-close-padding' | '--gog-toast-color' | '--gog-toast-content-gap' | '--gog-toast-enter-distance' | '--gog-toast-error-color' | '--gog-toast-font-family' | '--gog-toast-gap' | '--gog-toast-icon-color' | '--gog-toast-icon-line-height' | '--gog-toast-icon-size' | '--gog-toast-info-color' | '--gog-toast-main-gap' | '--gog-toast-max-width' | '--gog-toast-message-font-size' | '--gog-toast-message-line-height' | '--gog-toast-min-width' | '--gog-toast-padding' | '--gog-toast-progress-height' | '--gog-toast-progress-opacity' | '--gog-toast-radius' | '--gog-toast-shadow' | '--gog-toast-stack-expanded-gap' | '--gog-toast-stack-max-depth' | '--gog-toast-stack-min-opacity' | '--gog-toast-stack-opacity-step' | '--gog-toast-stack-padding' | '--gog-toast-stack-peek' | '--gog-toast-stack-scale-step' | '--gog-toast-success-color' | '--gog-toast-transition-duration' | '--gog-toast-warning-color' | '--gog-toast-z-index' | '--gog-toggle-border-color' | '--gog-toggle-border-style' | '--gog-toggle-border-width' | '--gog-toggle-disabled-opacity' | '--gog-toggle-focus-ring-color' | '--gog-toggle-focus-ring-offset' | '--gog-toggle-focus-ring-width' | '--gog-toggle-font-family' | '--gog-toggle-gap' | '--gog-toggle-label-color' | '--gog-toggle-label-line-height' | '--gog-toggle-lg-label-size' | '--gog-toggle-lg-state-font-size' | '--gog-toggle-lg-thumb-size' | '--gog-toggle-lg-track-height' | '--gog-toggle-lg-track-width' | '--gog-toggle-md-label-size' | '--gog-toggle-md-state-font-size' | '--gog-toggle-md-thumb-size' | '--gog-toggle-md-track-height' | '--gog-toggle-md-track-width' | '--gog-toggle-on-border-color' | '--gog-toggle-padding' | '--gog-toggle-radius' | '--gog-toggle-slg-label-size' | '--gog-toggle-slg-state-font-size' | '--gog-toggle-slg-thumb-size' | '--gog-toggle-slg-track-height' | '--gog-toggle-slg-track-width' | '--gog-toggle-sm-label-size' | '--gog-toggle-sm-state-font-size' | '--gog-toggle-sm-thumb-size' | '--gog-toggle-sm-track-height' | '--gog-toggle-sm-track-width' | '--gog-toggle-state-color' | '--gog-toggle-state-font-weight' | '--gog-toggle-state-letter-spacing' | '--gog-toggle-state-offset' | '--gog-toggle-state-padding-inline' | '--gog-toggle-state-thumb-gap' | '--gog-toggle-thumb-bg' | '--gog-toggle-thumb-inset' | '--gog-toggle-thumb-off-bg' | '--gog-toggle-thumb-on-bg' | '--gog-toggle-thumb-shadow' | '--gog-toggle-track-bg' | '--gog-toggle-track-off-bg' | '--gog-toggle-track-on-bg' | '--gog-toggle-transition-duration' | '--gog-toggle-xsm-label-size' | '--gog-toggle-xsm-state-font-size' | '--gog-toggle-xsm-thumb-size' | '--gog-toggle-xsm-track-height' | '--gog-toggle-xsm-track-width' | '--gog-tooltip-arrow-size' | '--gog-tooltip-bg' | '--gog-tooltip-border-color' | '--gog-tooltip-border-style' | '--gog-tooltip-border-width' | '--gog-tooltip-color' | '--gog-tooltip-font-family' | '--gog-tooltip-font-size' | '--gog-tooltip-gap' | '--gog-tooltip-line-height' | '--gog-tooltip-max-height' | '--gog-tooltip-max-width' | '--gog-tooltip-padding' | '--gog-tooltip-radius' | '--gog-tooltip-shadow' | '--gog-tooltip-transition-duration' | '--gog-tooltip-z' | '--gog-warning-color';
3263
+ /** Which of the three layers a token belongs to — see the README's theming section. */
3264
+ type GogTokenLayer = 'foundation' | 'component' | 'instance';
3265
+ interface GogTokenGroup {
3266
+ /** The `── Section ──` heading the token sits under in theme.css. */
3267
+ readonly section: string;
3268
+ readonly layer: GogTokenLayer;
3269
+ readonly tokens: readonly GogTokenName[];
3270
+ }
3271
+ /**
3272
+ * The token catalogue, grouped as theme.css groups it. Exported so a theme editor or docs page
3273
+ * can enumerate the real tokens instead of keeping a hand-copied list that drifts.
3274
+ */
3275
+ declare const GOG_TOKEN_GROUPS: readonly GogTokenGroup[];
3276
+
3277
+ type GogTooltipSide = 'top' | 'bottom' | 'left' | 'right';
1315
3278
 
1316
- export { AccordionComponent, ButtonComponent, CheckboxComponent, ChipComponent, CollapsibleComponent, Column, ConfirmationDialogComponent, DIALOG_DATA, DIALOG_REF, DialogComponent, DialogService, GOG_CONFIG, GogAccordionChevronDirective, GogAccordionContentDirective, GogAccordionHeaderDirective, GogCollapsibleContentDirective, GogCollapsibleTriggerDirective, GogDropdownBase, ICON_DEFS, IconComponent, InputfieldComponent, MultiselectComponent, PaginatorComponent, ScrollComponent, SelectComponent, SkeletonComponent, SliderComponent, SpinnerComponent, SpinnerOverlayComponent, TableComponent, TagComponent, TemplateDirective, TextareaComponent, ThemeService, ToastComponent, ToastContainerComponent, ToastService, defaultCompare, provideGogConfig };
1317
- export type { ConfirmDialogData, DialogConfig, DialogHandle, DialogRef, GogAccordionChevronContext, GogAccordionHeaderContext, GogAccordionItem, GogAccordionToggleEvent, GogDropdownDirection, GogDropdownOption, GogGlobalConfig, GogIconName, GogMultiselectOption, GogPaginatorRangeMode, GogScrollAxis, GogScrollMetrics, GogScrollOverscrollBehavior, GogScrollSize, GogSelectOption, GogSize, GogSkeletonAnimation, GogSkeletonShape, GogSpinnerVariant, GogTableBodyContext, GogTableHeaderContext, GogTagShape, GogTagVariant, GogVariant, OpenDialog, SortDirection, Toast, ToastAction, ToastConfig, ToastPosition, ToastType };
3279
+ export { AccordionComponent, AutocompleteComponent, ButtonComponent, ButtonToggleGroupComponent, CalendarComponent, CheckboxComponent, ChipComponent, CollapsibleComponent, Column, ConfirmationDialogComponent, DIALOG_DATA, DIALOG_REF, DatepickerComponent, DialogComponent, DialogService, DividerComponent, GOG_CONFIG, GOG_TABS_STATE, GOG_TOKEN_GROUPS, GogAccordionChevronDirective, GogAccordionContentDirective, GogAccordionHeaderDirective, GogBadgeDirective, GogButtonToggleOptionDirective, GogCheckboxIconDirective, GogCollapsibleContentDirective, GogCollapsibleTriggerDirective, GogColumn, GogColumnBodyDirective, GogColumnHeaderDirective, GogDropdownBase, GogDropdownChevronDirective, GogDropdownOptionDirective, GogFloatLabelState, GogInputAddonEndDirective, GogInputAddonStartDirective, GogMultiselectClearIconDirective, GogTabContentDirective, GogTabHeaderDirective, GogTagIconDirective, GogTooltipDirective, ICON_DEFS, IconComponent, InputfieldComponent, MultiselectComponent, PaginatorComponent, ProgressbarComponent, RadioGroupComponent, ScrollComponent, SelectComponent, SkeletonComponent, SliderComponent, SpinnerComponent, SpinnerOverlayComponent, TabComponent, TableComponent, TabsComponent, TagComponent, TemplateDirective, TextareaComponent, ThemeService, ToastComponent, ToastContainerComponent, ToastService, ToggleComponent, addDays, addMonths, addYears, buildMonthGrid, clampDate, copyTimeOnto, daysInMonth, defaultCompare, formatDate, getByPath, isAfterDay, isBeforeDay, isInRange, isSameDay, isSameMonth, isSameOptionValue, isWithinBounds, localeFirstDayOfWeek, monthNames, parseDate, provideGogConfig, readOption, resolveConfigured, startOfDay, weekdayNames, withTime };
3280
+ export type { ConfirmDialogData, DialogConfig, DialogHandle, DialogRef, GogAccordionChevronContext, GogAccordionHeaderContext, GogAccordionItem, GogAccordionToggleEvent, GogBadgePosition, GogButtonToggleAppearance, GogButtonToggleOptionContext, GogCalendarDay, GogColumnBodyContext, GogColumnHeaderContext, GogDateRange, GogDateSelectionMode, GogDatepickerValue, GogDividerVariant, GogDropdownDirection, GogDropdownFilterPosition, GogDropdownOption, GogDropdownOptionContext, GogFloatLabelVariant, GogGlobalConfig, GogHourFormat, GogIconName, GogMultiselectOption, GogOptionAccessor, GogOrientation, GogPaginatorRangeMode, GogProgressbarMode, GogProgressbarVariant, GogRadioOption, GogScrollAxis, GogScrollMetrics, GogScrollOverscrollBehavior, GogScrollSize, GogSelectOption, GogSize, GogSkeletonAnimation, GogSkeletonShape, GogSliderOrientation, GogSpinnerVariant, GogTabHeaderContext, GogTableBodyContext, GogTableHeaderContext, GogTabsAlign, GogTabsState, GogTagShape, GogTagVariant, GogTokenGroup, GogTokenLayer, GogTokenName, GogTooltipPosition, GogTooltipSide, GogVariant, OpenDialog, SortDirection, Toast, ToastAction, ToastConfig, ToastPosition, ToastType };