@koobiq/components 20.4.1 → 21.0.0

package/{breadcrumbs/index.d.ts → types/koobiq-components-breadcrumbs.d.ts}

@@ -1,8 +1,9 @@
+import * as _koobiq_components_core from '@koobiq/components/core';
+import { KbqDefaultSizes, KbqComponentColors, PopUpPlacements } from '@koobiq/components/core';
 import * as _angular_core from '@angular/core';
-import { OnInit, OnDestroy, InjectionToken, TemplateRef, Provider } from '@angular/core';
+import { OnChanges, SimpleChanges, OnDestroy, InjectionToken, OnInit, TemplateRef, Provider } from '@angular/core';
 import { RouterLink } from '@angular/router';
-import { KbqButtonStyles } from '@koobiq/components/button';
-import { KbqDefaultSizes, KbqComponentColors, PopUpPlacements } from '@koobiq/components/core';
+import { Direction } from '@angular/cdk/bidi';
 
 type KbqBreadcrumbsWrapMode = 'auto' | 'wrap' | 'none';
 type KbqBreadcrumbsConfiguration = {
@@ -26,14 +27,33 @@ type KbqBreadcrumbsConfiguration = {
     wrapMode: KbqBreadcrumbsWrapMode;
 };
 
-type Orientation = 'horizontal' | 'vertical';
-type Direction = 'ltr' | 'rtl';
+/** Axis a roving-focus group navigates along. */
+type KbqRovingFocusOrientation = 'horizontal' | 'vertical';
 
-declare class RdxRovingFocusGroupDirective {
-    private readonly ngZone;
+/**
+ * Moves the focus between the items of `KbqBreadcrumbs` with the arrow keys, keeping one of them in the tab
+ * order. The breadcrumbs apply it themselves, as a host directive.
+ *
+ * @docs-private
+ */
+declare class RdxRovingFocusGroupDirective implements OnChanges {
     private readonly elementRef;
-    orientation: Orientation | undefined;
-    readonly dir: _angular_core.InputSignal<Direction>;
+    private readonly directionality;
+    /** @docs-private */
+    readonly orientationInput: _angular_core.InputSignal<KbqRovingFocusOrientation | undefined>;
+    /**
+     * Axis the arrow keys navigate along. A plain field the input feeds: the host component also writes it
+     * directly, once, from its own constructor.
+     */
+    orientation: KbqRovingFocusOrientation | undefined;
+    ngOnChanges(changes: SimpleChanges): void;
+    /**
+     * Reading direction the arrow keys are mapped against, written onto the host as `dir`. Left unset,
+     * no attribute is emitted — the element inherits the document direction, and the key mapping follows
+     * the ambient CDK `Directionality`.
+     */
+    readonly dir: _angular_core.InputSignal<Direction | null>;
+    /** Whether the arrow keys wrap around, from the last item to the first and back. */
     readonly loop: _angular_core.InputSignalWithTransform<boolean, unknown>;
     readonly preventScrollOnEntryFocus: _angular_core.InputSignalWithTransform<boolean, unknown>;
     readonly entryFocus: _angular_core.OutputEmitterRef<Event>;
@@ -42,65 +62,84 @@ declare class RdxRovingFocusGroupDirective {
     readonly currentTabStopId: _angular_core.WritableSignal<string | null>;
     /** @docs-private */
     readonly focusableItems: _angular_core.WritableSignal<HTMLElement[]>;
-    private readonly isClickFocus;
+    /** Tab stop id of each registered element, so the current tab stop can be resolved back to its node. */
+    private readonly itemIds;
     private readonly isTabbingBackOut;
-    private readonly focusableItemsCount;
+    /**
+     * Reading direction the arrow keys are actually mapped against: the input when it is set, the
+     * ambient `Directionality` otherwise.
+     *
+     * @docs-private
+     */
+    readonly resolvedDir: _angular_core.Signal<Direction>;
     /** @docs-private */
-    get dataOrientation(): Orientation;
+    get dataOrientation(): KbqRovingFocusOrientation;
     /** @docs-private */
     get tabIndex(): 0 | -1;
     /** @docs-private */
     handleBlur(): void;
     /** @docs-private */
-    handleMouseUp(): void;
-    /** @docs-private */
     handleFocus(event: FocusEvent): void;
     /** @docs-private */
-    handleMouseDown(): void;
-    /** @docs-private */
     onItemFocus(tabStopId: string): void;
     /** @docs-private */
     onItemShiftTab(): void;
-    /** @docs-private */
-    onFocusableItemAdd(): void;
-    /** @docs-private */
-    onFocusableItemRemove(): void;
-    /** @docs-private */
-    registerItem(item: HTMLElement): void;
+    private syncTabIndex;
+    /**
+     * Registers `item` as a focusable member of the group, ignoring one that is not actually a
+     * descendant of the group's own host. A `TemplateRef` declared inside the group (a `kbqBreadcrumbView`,
+     * say) keeps resolving an injected group through its declaration-site injector even when something
+     * outside the group's DOM subtree — a dropdown replaying a hidden item's template, for instance —
+     * instantiates it a second time via `ngTemplateOutlet`. That copy is not reachable by this group's
+     * arrow keys and must not register, or the trail ends up with a phantom, unfocusable duplicate.
+     *
+     * @docs-private
+     */
+    registerItem(item: HTMLElement, tabStopId?: string): void;
     /** @docs-private */
     unregisterItem(item: HTMLElement): void;
     /** @docs-private */
     getFocusableItemsCount(): number;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxRovingFocusGroupDirective, never>;
-    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxRovingFocusGroupDirective, "[rdxRovingFocusGroup]", never, { "orientation": { "alias": "orientation"; "required": false; }; "dir": { "alias": "dir"; "required": false; "isSignal": true; }; "loop": { "alias": "loop"; "required": false; "isSignal": true; }; "preventScrollOnEntryFocus": { "alias": "preventScrollOnEntryFocus"; "required": false; "isSignal": true; }; }, { "entryFocus": "entryFocus"; "currentTabStopIdChange": "currentTabStopIdChange"; }, never, never, true, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxRovingFocusGroupDirective, "[rdxRovingFocusGroup]", never, { "orientationInput": { "alias": "orientation"; "required": false; "isSignal": true; }; "dir": { "alias": "dir"; "required": false; "isSignal": true; }; "loop": { "alias": "loop"; "required": false; "isSignal": true; }; "preventScrollOnEntryFocus": { "alias": "preventScrollOnEntryFocus"; "required": false; "isSignal": true; }; }, { "entryFocus": "entryFocus"; "currentTabStopIdChange": "currentTabStopIdChange"; }, never, never, true, never>;
 }
 
-declare class RdxRovingFocusItemDirective implements OnInit, OnDestroy {
+/**
+ * An item of the roving focus of `KbqBreadcrumbs`. `KbqBreadcrumbButton` applies it itself, as a host directive.
+ *
+ * @docs-private
+ */
+declare class RdxRovingFocusItemDirective implements OnDestroy {
     private readonly elementRef;
     private readonly ngZone;
     protected readonly parent: RdxRovingFocusGroupDirective;
+    /**
+     * Whether the item takes part in the roving focus. The arrow keys skip an item that does not, and a click
+     * does not focus it.
+     */
     readonly focusable: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /**
+     * Whether the item is the one focus returns to when the group is re-entered. Defaults to `false`, so
+     * that `data-active` discriminates: with every item active the lookup degenerates to the first one.
+     */
     readonly active: _angular_core.InputSignalWithTransform<boolean, unknown>;
     readonly tabStopId: _angular_core.InputSignal<string>;
     readonly allowShiftKey: _angular_core.InputSignalWithTransform<boolean, unknown>;
     private readonly id;
     /** @docs-private */
     readonly isCurrentTabStop: _angular_core.Signal<boolean>;
-    /**
-     * Lifecycle hook triggered on initialization.
-     * Registers the element with the parent roving focus group if it is focusable.
-     * @docs-private
-     */
-    ngOnInit(): void;
+    constructor();
     /**
      * Lifecycle hook triggered on destruction.
-     * Unregisters the element from the parent roving focus group if it is focusable.
+     * Unregisters the element from the parent roving focus group.
+     *
      * @docs-private
      */
     ngOnDestroy(): void;
     /**
      * Determines the `tabIndex` of the element.
      * Returns `0` if the element is the current tab stop; otherwise, returns `-1`.
+     *
      * @docs-private
      */
     get tabIndex(): 0 | -1;
@@ -113,6 +152,7 @@ declare class RdxRovingFocusItemDirective implements OnInit, OnDestroy {
      * Supports navigation based on orientation and direction, and focuses appropriate elements.
      *
      * @param event The `KeyboardEvent` object.
+     *
      * @docs-private
      */
     handleKeydown(event: KeyboardEvent): void;
@@ -125,13 +165,13 @@ declare const KBQ_BREADCRUMBS_CONFIGURATION: InjectionToken<KbqBreadcrumbsConfig
 /** Utility provider for `KBQ_BREADCRUMBS_CONFIGURATION`. */
 declare const kbqBreadcrumbsConfigurationProvider: (configuration: Partial<KbqBreadcrumbsConfiguration>) => Provider;
 declare class KbqBreadcrumbsSeparator {
-    readonly templateRef: TemplateRef<any>;
+    readonly templateRef: TemplateRef<unknown>;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<KbqBreadcrumbsSeparator, never>;
     static ɵdir: _angular_core.ɵɵDirectiveDeclaration<KbqBreadcrumbsSeparator, "ng-template[kbqBreadcrumbsSeparator]", never, {}, {}, never, never, true, never>;
 }
 /**
  * Directive to style and configure buttons used as breadcrumb items.
- * - Inherits focus management behavior from `RdxRovingFocusItemDirective`.
+ * - Takes part in the roving focus of `KbqBreadcrumbs`: the arrow keys move between the items.
  * - Optionally injects `KbqButton` to customize its style for breadcrumb usage.
  * - Sets `type="button"` on a `<button>` host, so a breadcrumb never submits a surrounding form.
  */
@@ -147,7 +187,7 @@ declare class KbqBreadcrumbButton implements OnInit {
  *
  */
 declare class KbqBreadcrumbView {
-    readonly templateRef: TemplateRef<any>;
+    readonly templateRef: TemplateRef<unknown>;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<KbqBreadcrumbView, never>;
     static ɵdir: _angular_core.ɵɵDirectiveDeclaration<KbqBreadcrumbView, "[kbqBreadcrumbView]", never, {}, {}, never, never, true, never>;
 }
@@ -165,15 +205,15 @@ declare class KbqBreadcrumbItem {
      */
     readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
     /**
-     * Indicates whether the breadcrumb item is the current/active item.
-     * Defaults to `false`.
+     * Indicates whether the breadcrumb item is the current/active item, which the trail exposes as
+     * `aria-current="page"`. The last item of a trail is current regardless of this input.
      */
     readonly current: _angular_core.InputSignalWithTransform<boolean, unknown>;
     /**
      * A reference to a custom template provided for the breadcrumb item content.
      * The template can be used to override the default appearance of the breadcrumb.
      */
-    readonly customTemplateRef: _angular_core.Signal<TemplateRef<any> | undefined>;
+    readonly customTemplateRef: _angular_core.Signal<TemplateRef<unknown> | undefined>;
     /**
      * An optional `RouterLink` instance for navigating to a specific route.
      * Injected from the host element, if available and projecting to the hidden breadcrumb item in dropdown.
@@ -184,10 +224,16 @@ declare class KbqBreadcrumbItem {
 }
 declare class KbqBreadcrumbs {
     protected readonly configuration: KbqBreadcrumbsConfiguration;
+    /** Accessible names of the landmark itself and of the icon-only button revealing the collapsed items. */
+    protected readonly a11yLocaleConfiguration: _angular_core.Signal<_koobiq_components_core.KbqA11yLocaleConfiguration>;
     /**
-     * Determines if a negative margin should be applied to the first breadcrumb item.
-     *
-     * @see KbqBreadcrumbsConfiguration
+     * Accessible name of the navigation landmark. Set it whenever a page renders more than one trail, so
+     * assistive technology can tell them apart. Left unset, the name comes from the active locale.
+     */
+    readonly ariaLabel: _angular_core.InputSignal<string | null>;
+    /**
+     * Determines if a negative margin should be applied to the first breadcrumb item. The default comes from
+     * {@link KbqBreadcrumbsConfiguration}.
      */
     readonly firstItemNegativeMargin: _angular_core.InputSignalWithTransform<boolean, unknown>;
     /**
@@ -203,16 +249,15 @@ declare class KbqBreadcrumbs {
     readonly max: _angular_core.InputSignal<number | null>;
     /**
      * Indicates whether the breadcrumbs are disabled.
-     * When disabled, user interactions are blocked.
+     * When disabled, every item and the expand button stop navigating and leave the tab order.
      */
     readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
     /**
      * Wrapping behavior of the breadcrumb items.
      */
     readonly wrapMode: _angular_core.InputSignal<KbqBreadcrumbsWrapMode>;
-    protected readonly separator?: TemplateRef<any>;
+    protected readonly separator: _angular_core.Signal<TemplateRef<unknown> | undefined>;
     protected readonly items: _angular_core.Signal<readonly KbqBreadcrumbItem[]>;
-    private readonly breadcrumbsResult;
     private readonly resultDropdownTrigger;
     private readonly result;
     private readonly overflowItems;
@@ -222,8 +267,14 @@ declare class KbqBreadcrumbs {
      */
     protected readonly minVisibleItems = 2;
     protected readonly KbqComponentColors: typeof KbqComponentColors;
-    protected readonly KbqButtonStyles: typeof KbqButtonStyles;
     protected readonly PopUpPlacements: typeof PopUpPlacements;
+    /**
+     * `<nav>` is a landmark already, so the role is written only onto the other host forms. Resolved once:
+     * the tag name of a host element never changes.
+     */
+    protected readonly hostRole: string | null;
+    /** Consumer-authored name of the landmark, falling back to the active locale. */
+    protected readonly resolvedAriaLabel: _angular_core.Signal<string>;
     /** @docs-private */
     protected readonly itemsExcludingEdges: _angular_core.Signal<KbqBreadcrumbItem[]>;
     protected readonly hiddenItemIDs: _angular_core.Signal<Set<unknown>>;
@@ -233,7 +284,7 @@ declare class KbqBreadcrumbs {
     constructor();
     private enforceMaxVisible;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<KbqBreadcrumbs, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<KbqBreadcrumbs, "kbq-breadcrumbs,[kbq-breadcrumbs]", never, { "firstItemNegativeMargin": { "alias": "firstItemNegativeMargin"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "wrapMode": { "alias": "wrapMode"; "required": false; "isSignal": true; }; }, {}, ["items", "separator"], never, true, [{ directive: typeof RdxRovingFocusGroupDirective; inputs: {}; outputs: {}; }]>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<KbqBreadcrumbs, "kbq-breadcrumbs,[kbq-breadcrumbs]", never, { "ariaLabel": { "alias": "aria-label"; "required": false; "isSignal": true; }; "firstItemNegativeMargin": { "alias": "firstItemNegativeMargin"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "wrapMode": { "alias": "wrapMode"; "required": false; "isSignal": true; }; }, {}, ["separator", "items"], never, true, [{ directive: typeof RdxRovingFocusGroupDirective; inputs: { "dir": "dir"; "loop": "loop"; }; outputs: {}; }, { directive: typeof _koobiq_components_core.KbqLocaleOverridesDirective; inputs: { "kbqLocaleOverrides": "localeOverrides"; }; outputs: {}; }]>;
 }
 
 declare class KbqBreadcrumbsModule {
@@ -243,4 +294,4 @@ declare class KbqBreadcrumbsModule {
 }
 
 export { KBQ_BREADCRUMBS_CONFIGURATION, KbqBreadcrumbButton, KbqBreadcrumbItem, KbqBreadcrumbView, KbqBreadcrumbs, KbqBreadcrumbsModule, KbqBreadcrumbsSeparator, RdxRovingFocusGroupDirective, RdxRovingFocusItemDirective, kbqBreadcrumbsConfigurationProvider };
-export type { KbqBreadcrumbsConfiguration, KbqBreadcrumbsWrapMode };
+export type { KbqBreadcrumbsConfiguration, KbqBreadcrumbsWrapMode, KbqRovingFocusOrientation };

package/types/koobiq-components-button-toggle.d.ts

@@ -0,0 +1,340 @@
+import * as _angular_core from '@angular/core';
+import { Provider, OnChanges, OnInit, AfterContentInit, AfterViewInit, OnDestroy, SimpleChanges } from '@angular/core';
+import { ControlValueAccessor } from '@angular/forms';
+import * as i1 from '@koobiq/components/button';
+import * as i2 from '@koobiq/components/title';
+
+/** Acceptable types for a button toggle. */
+type ToggleType = 'checkbox' | 'radio';
+/**
+ * Provider Expression that allows kbq-button-toggle-group to register as a ControlValueAccessor.
+ * This allows it to support [(ngModel)].
+ *
+ * @docs-private
+ */
+declare const KBQ_BUTTON_TOGGLE_GROUP_VALUE_ACCESSOR: Provider;
+/** Change event object emitted by KbqButtonToggle. */
+declare class KbqButtonToggleChange {
+    /** The KbqButtonToggle that emits the event. */
+    source: KbqButtonToggle;
+    /** The value assigned to the KbqButtonToggle. */
+    value: any;
+    constructor(
+    /** The KbqButtonToggle that emits the event. */
+    source: KbqButtonToggle, 
+    /** The value assigned to the KbqButtonToggle. */
+    value: any);
+}
+/**
+ * Selection group for `KbqButtonToggle`.
+ *
+ * By default it behaves like a radio-button group — one toggle at a time, announced as a
+ * `radiogroup` and walked with the arrow keys. With `multiple` the toggles become independent
+ * toggle buttons and the group is announced as a plain `group`.
+ *
+ * Name it with a plain `aria-label`/`aria-labelledby` attribute. The host is the very element the
+ * consumer writes, so an input aliased to the same name would only write back what is already
+ * there — and would wipe an `[attr.aria-label]` binding, which never reaches the input.
+ */
+declare class KbqButtonToggleGroup implements OnChanges, ControlValueAccessor, OnInit, OnDestroy {
+    /** Whether the toggle group is vertical. */
+    readonly vertical: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /** Whether the toggle group stretches to fill its container width, with toggles sharing equal space. */
+    readonly stretched: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /** Whether multiple button toggles can be selected. */
+    readonly multiple: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /**
+     * Value of the toggle group: an array in multiple-selection mode, a single value otherwise.
+     *
+     * An accessor rather than a `model()`: writing it walks the toggles to find the ones that match,
+     * and reading it reports the selection. `[(value)]` works all the same.
+     *
+     * An assigned value that corresponds to no toggle is kept and reported as is, so that it applies
+     * to a toggle rendered later — the same contract as `KbqRadioGroup`. It follows that `value` can
+     * name a toggle `selected` does not hold: `selected` only ever reports toggles that exist.
+     */
+    get value(): any;
+    set value(newValue: any);
+    /** Body of the `value` setter. */
+    private assignValue;
+    /**
+     * Selected button toggles in the group: an array in multiple-selection mode, one toggle otherwise.
+     * Only toggles that exist, so a `value` waiting for its toggle is not represented here.
+     */
+    get selected(): KbqButtonToggle | KbqButtonToggle[] | null;
+    /** Child button toggle buttons. */
+    readonly buttonToggles: _angular_core.Signal<readonly KbqButtonToggle[]>;
+    /** Whether the whole button toggle group is disabled. */
+    get disabled(): boolean;
+    set disabled(value: boolean);
+    /**
+     * Event that emits whenever the value of the group changes.
+     * Used to facilitate two-way data binding.
+     *
+     * @docs-private
+     */
+    readonly valueChange: _angular_core.OutputEmitterRef<any>;
+    /** Event emitted when the group's value changes. */
+    readonly change: _angular_core.OutputEmitterRef<KbqButtonToggleChange>;
+    private readonly _disabled;
+    private selectionModel;
+    /**
+     * Selection of `selectionModel`, mirrored into a signal. It is what makes a toggle's `checked`
+     * state reactive: a toggle derives its own state from here instead of being told, one by one,
+     * to check itself again.
+     */
+    private readonly selectedToggles;
+    /** Value the selection alone describes, with nothing said about an assignment waiting for its toggle. */
+    private readonly selectedValue;
+    /**
+     * Computed once per selection change, so a repeated read hands back the same array reference.
+     *
+     * The selection is authoritative for the toggles it holds; whatever the assignment names beyond
+     * them is appended, because those toggles may still be rendered. Reporting the empty selection
+     * instead would push `undefined` back through a `[(value)]` binding and leave `NG0100` behind.
+     */
+    private readonly currentValue;
+    private readonly currentSelection;
+    /** ARIA role of the group: a radio group in single-selection mode, a plain grouping otherwise. */
+    protected readonly role: _angular_core.Signal<"group" | "radiogroup">;
+    /**
+     * Layout of the group, announced alongside its role so that the arrow-key affordance a screen
+     * reader describes matches the direction the toggles actually run in.
+     *
+     * A radio group is the only mode that has one: `role="group"` does not support `aria-orientation`
+     * (AXE `aria-allowed-attr`), and with `multiple` there are no arrow keys to describe anyway.
+     */
+    protected readonly ariaOrientation: _angular_core.Signal<"vertical" | "horizontal" | null>;
+    /**
+     * Whether the group has been destroyed. A selected toggle schedules its own removal from the
+     * selection on a microtask, which outlives a teardown of the whole group.
+     */
+    private destroyed;
+    /**
+     * Value the consumer assigned, kept for as long as it is not represented by the selection: the
+     * toggle it names may be created later — behind an `@if`, or simply after the assignment, which
+     * always lands before `ngOnInit` and so before there is a selection model to apply it to.
+     *
+     * An interaction replaces it, so a value the user has moved off cannot resurface on a toggle
+     * rendered afterwards.
+     */
+    private readonly rawValue;
+    /** Value last reported through `valueChange`, so that an echo of it stays silent. */
+    private reportedValue;
+    /**
+     * Called when the value changes. Needed to properly implement `ControlValueAccessor`.
+     * `ngModel` binding is not supported in multiple selection mode.
+     *
+     * @docs-private
+     */
+    controlValueAccessorChangeFn: (value: any) => void;
+    /**
+     * Called when the control is blurred. Needed to properly implement `ControlValueAccessor`.
+     *
+     * @docs-private
+     */
+    onTouched: () => void;
+    /** @docs-private */
+    readonly valueInput: _angular_core.InputSignal<{} | null | undefined>;
+    /** @docs-private */
+    readonly disabledInput: _angular_core.InputSignalWithTransform<boolean | undefined, string | boolean | null | undefined>;
+    ngOnChanges(changes: SimpleChanges): void;
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    /**
+     * Sets the model value. Implemented as part of ControlValueAccessor.
+     *
+     * @param value Value to be set to the model.
+     */
+    writeValue(value: any): void;
+    /**
+     * Registers the callback that reports a value change to the form model.
+     * Implemented as part of ControlValueAccessor.
+     */
+    registerOnChange(fn: (value: any) => void): void;
+    /**
+     * Registers the callback that marks the form control as touched.
+     * Implemented as part of ControlValueAccessor.
+     */
+    registerOnTouched(fn: () => void): void;
+    /**
+     * Disables the group from the form model.
+     * Implemented as part of ControlValueAccessor.
+     */
+    setDisabledState(isDisabled: boolean): void;
+    /**
+     * Dispatches a change event for the group value.
+     *
+     * @param source Toggle the change originated from. Taken from the interaction rather than from the
+     * selection, which is empty whenever the last selected toggle of a multiple-selection group is
+     * unchecked — there is no "last selected" toggle left to report then.
+     */
+    emitChangeEvent(source: KbqButtonToggle): void;
+    /**
+     * Syncs a button toggle's selected state with the model value.
+     *
+     * @param toggle Toggle to be synced.
+     * @param select Whether the toggle should be selected.
+     * @param isUserInput Whether the change was a result of a user interaction.
+     */
+    syncButtonToggle(toggle: KbqButtonToggle, select: boolean, isUserInput?: boolean): void;
+    /** Body of `syncButtonToggle()`. */
+    private applyToggleSelection;
+    /** Checks whether a button toggle is selected. */
+    isSelected(toggle: KbqButtonToggle): boolean;
+    /** Determines whether a button toggle should be checked on init, from the value waiting for it. */
+    isPrechecked(toggle: KbqButtonToggle): boolean;
+    /** Mirrors the selection model into the signal the toggles derive their state from. */
+    private publishSelection;
+    /**
+     * Forgets a value that a toggle has just stopped representing. A value only waits for a toggle
+     * until one takes it: a toggle leaving the selection — destroyed, or unchecked from code —
+     * answers it, and keeping it would make it resurface on the next toggle rendered with it.
+     */
+    private dropPendingValue;
+    /** Follows a selected toggle whose value changed in the assignment, which would hold the old value otherwise. */
+    private renamePendingValue;
+    /** Announces the current value, unless it is the one already reported. */
+    private emitValueChange;
+    /**
+     * Updates the selection state of the toggles in the group based on a value. Resolved in one pass:
+     * walking the toggles one by one would publish an intermediate empty selection and announce it.
+     */
+    private setSelectionByValue;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<KbqButtonToggleGroup, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<KbqButtonToggleGroup, "kbq-button-toggle-group", ["kbqButtonToggleGroup"], { "vertical": { "alias": "vertical"; "required": false; "isSignal": true; }; "stretched": { "alias": "stretched"; "required": false; "isSignal": true; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "valueInput": { "alias": "value"; "required": false; "isSignal": true; }; "disabledInput": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "valueChange": "valueChange"; "change": "change"; }, ["buttonToggles"], never, true, never>;
+}
+/** Single button inside of a toggle group. */
+declare class KbqButtonToggle implements OnChanges, OnInit, AfterContentInit, AfterViewInit, OnDestroy {
+    /** Group the toggle belongs to, or `null` for a standalone toggle. */
+    protected readonly buttonToggleGroup: KbqButtonToggleGroup | null;
+    private changeDetectorRef;
+    private focusMonitor;
+    private element;
+    private readonly directionality;
+    private readonly icons;
+    private readonly button;
+    /** Whether the button is checked. */
+    get checked(): boolean;
+    set checked(value: boolean);
+    /**
+     * Whether the toggle acts as a radio button (a single-selection group) or as a checkbox
+     * (a multiple-selection group, or a standalone toggle).
+     */
+    get type(): ToggleType;
+    /**
+     * Whether the toggle holds icons only (`-icon`), icons beside a label (`-icon-text`) or no icon
+     * at all (`''`). Rendered as the `.kbq-button-toggle-icon`/`.kbq-button-toggle-icon-text` host
+     * class, which is the only signal a stylesheet gets: CSS cannot see text nodes, so a selector can
+     * never tell an icon-only toggle from a label that happens to contain an icon.
+     */
+    get iconType(): string;
+    /** Value of the toggle. The value of a selected toggle is the value of its group. */
+    get value(): any;
+    set value(value: any);
+    /** Tabindex for the toggle. `null` leaves the toggle at its default position in the tab order. */
+    readonly tabIndex: _angular_core.InputSignal<number | null>;
+    /** Accessible name of the toggle. Required when the toggle projects nothing but icons. */
+    readonly ariaLabel: _angular_core.InputSignal<string | null>;
+    /** Id of the element that labels the toggle. */
+    readonly ariaLabelledby: _angular_core.InputSignal<string | null>;
+    /** Whether the toggle is disabled. A toggle inside a disabled group is disabled as well. */
+    get disabled(): boolean;
+    set disabled(value: boolean);
+    /** Event emitted when the group value changes. */
+    readonly change: _angular_core.OutputEmitterRef<KbqButtonToggleChange>;
+    private readonly _value;
+    private readonly _checked;
+    private readonly _disabled;
+    private readonly _iconType;
+    /** Whether the missing-accessible-name warning has already been emitted for this toggle. */
+    private accessibleNameWarned;
+    /** Whether the toggle behaves like a radio button, i.e. sits in a single-selection group. */
+    private readonly isSingleSelector;
+    private readonly checkedState;
+    private readonly disabledState;
+    /**
+     * A radio group is a single tab stop: Tab reaches the selected toggle — or the first enabled one
+     * while nothing is selected — and the arrow keys move within the group from there. A
+     * multiple-selection group is a set of independent toggle buttons, so every one of them stays in
+     * the tab order.
+     */
+    protected readonly tabIndexValue: _angular_core.Signal<number>;
+    /**
+     * A toggle in a single-selection group is a radio button; anywhere else it is a toggle button,
+     * which is what a native `<button>` already is — it only needs its pressed state.
+     */
+    protected readonly role: _angular_core.Signal<"radio" | null>;
+    /** Selected state of a radio; `null` outside a single-selection group, where `aria-pressed` says it. */
+    protected readonly ariaChecked: _angular_core.Signal<boolean | null>;
+    /** Pressed state of a toggle button; `null` in a single-selection group, where `aria-checked` says it. */
+    protected readonly ariaPressed: _angular_core.Signal<boolean | null>;
+    /** @docs-private */
+    readonly valueInput: _angular_core.InputSignal<{} | null | undefined>;
+    /** @docs-private */
+    readonly checkedInput: _angular_core.InputSignalWithTransform<boolean | undefined, string | boolean | null | undefined>;
+    /** @docs-private */
+    readonly disabledInput: _angular_core.InputSignalWithTransform<boolean | undefined, string | boolean | null | undefined>;
+    ngOnChanges(changes: SimpleChanges): void;
+    constructor();
+    ngOnInit(): void;
+    ngAfterContentInit(): void;
+    /**
+     * Refreshes `iconType`, which tells whether the toggle holds icons only or icons beside a label.
+     *
+     * No selector can work this out: CSS cannot see text nodes, so it can never tell an icon-only
+     * toggle from a label that happens to contain an icon.
+     *
+     * @docs-private
+     */
+    updateIconType(): void;
+    ngAfterViewInit(): void;
+    ngOnDestroy(): void;
+    /** Focuses the button. */
+    focus(): void;
+    /** Focuses the button as if the user had reached it with the keyboard, showing the focus ring. */
+    focusViaKeyboard(): void;
+    /** Checks the button toggle due to an interaction with the underlying native button. */
+    onToggleClick(): void;
+    /** Body of `onToggleClick()`. */
+    private toggleByUser;
+    /**
+     * Marks the button toggle as needing checking for change detection.
+     *
+     * Kept for back-compatibility. A toggle now derives `checked` and `disabled` from signals owned
+     * by its group, so it re-renders on its own and nothing in the library calls this any more.
+     */
+    markForCheck(): void;
+    /**
+     * Walks a radio group with the arrow keys, moving focus and selection together, as the WAI-ARIA
+     * radiogroup pattern expects. A multiple-selection group is a set of independent toggle buttons
+     * that Tab reaches one by one, so it needs no key handling of its own.
+     */
+    protected onKeydown(event: KeyboardEvent): void;
+    /**
+     * `KbqIcon` renders a decorative glyph, so an icon-only toggle carries no text. Without an
+     * `aria-label`/`aria-labelledby` its button has no accessible name at all (AXE `button-name`).
+     * `KbqButtonCssStyler` cannot warn about it here: a toggle projects its icons through its own
+     * wrapper, so the button's own content query never sees them.
+     *
+     * A `title` on the host is deliberately not accepted as a name: the host is not the element the
+     * accessible name is computed for — the inner button is — and the attribute never reaches it.
+     */
+    private warnIfIconOnlyHasNoAccessibleName;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<KbqButtonToggle, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<KbqButtonToggle, "kbq-button-toggle", ["kbqButtonToggle"], { "tabIndex": { "alias": "tabIndex"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "aria-label"; "required": false; "isSignal": true; }; "ariaLabelledby": { "alias": "aria-labelledby"; "required": false; "isSignal": true; }; "valueInput": { "alias": "value"; "required": false; "isSignal": true; }; "checkedInput": { "alias": "checked"; "required": false; "isSignal": true; }; "disabledInput": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "change": "change"; }, ["icons"], ["[kbqButtonPrefix]", "*", "[kbqButtonSuffix]"], true, never>;
+}
+
+/**
+ * Entry point for `KbqButtonToggleGroup`/`KbqButtonToggle`. Both are standalone, so a bare
+ * `imports: [KbqButtonToggle]` works; this module is the convenience bundle that also pulls in
+ * `KbqButtonModule`/`KbqTitleModule` and re-exports the slot markers.
+ */
+declare class KbqButtonToggleModule {
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<KbqButtonToggleModule, never>;
+    static ɵmod: _angular_core.ɵɵNgModuleDeclaration<KbqButtonToggleModule, never, [typeof i1.KbqButtonModule, typeof i2.KbqTitleModule, typeof KbqButtonToggleGroup, typeof KbqButtonToggle], [typeof KbqButtonToggleGroup, typeof KbqButtonToggle, typeof i1.KbqButtonPrefix, typeof i1.KbqButtonSuffix]>;
+    static ɵinj: _angular_core.ɵɵInjectorDeclaration<KbqButtonToggleModule>;
+}
+
+export { KBQ_BUTTON_TOGGLE_GROUP_VALUE_ACCESSOR, KbqButtonToggle, KbqButtonToggleChange, KbqButtonToggleGroup, KbqButtonToggleModule };
+export type { ToggleType };