@rt-tools/ui-kit-v2 0.33.0 → 0.34.0

package/fesm2022/rt-tools-ui-kit-v2-toast.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"rt-tools-ui-kit-v2-toast.mjs","names":["BEM_BLOCK"],"sources":["../../../projects/ui-kit-v2/src/lib/components/toast/rt-toaster.model.ts","../../../projects/ui-kit-v2/src/lib/components/toast/rt-toast.component.ts","../../../projects/ui-kit-v2/src/lib/components/toast/rt-toast.component.html","../../../projects/ui-kit-v2/src/lib/components/toast/rt-toaster.component.ts","../../../projects/ui-kit-v2/src/lib/components/toast/rt-toaster.component.html"],"sourcesContent":["import { InjectionToken } from '@angular/core';\n\nimport { INotification } from '@rt-tools/ui-kit-v2/core';\n\nimport { IRtIcon } from '@rt-tools/ui-kit-v2/core';\n\nexport const RT_TOASTER_GAP_PX: number = 14;\n\n/**\n * Значки severity у тоста. Приложение подменяет карту целиком — например, на имена\n * Material, — а тост со своим `icon` берёт свой значок мимо карты.\n */\nexport const RT_TOAST_SEVERITY_ICONS: InjectionToken<Readonly<Record<INotification.Severity, IRtIcon.Name>>> = new InjectionToken<\n    Readonly<Record<INotification.Severity, IRtIcon.Name>>\n>('RT_TOAST_SEVERITY_ICONS', {\n    providedIn: 'root',\n    factory: (): Readonly<Record<INotification.Severity, IRtIcon.Name>> => ({\n        info: 'info-circle',\n        success: 'check-circle',\n        warning: 'exclamation-circle',\n        danger: 'times-circle',\n    }),\n});\n\nexport namespace IRtToaster {\n    export type Position = 'top-left' | 'top-center' | 'top-right' | 'bottom-left' | 'bottom-center' | 'bottom-right';\n\n    export type PositionY = 'top' | 'bottom';\n\n    export type PositionX = 'left' | 'center' | 'right';\n\n    /** `stack` копит тосты стопкой; `replace` — новый тост уводит прежние. */\n    export type Mode = 'stack' | 'replace';\n\n    export interface Toast {\n        readonly id: number;\n        readonly severity: INotification.Severity;\n        readonly message: string;\n        readonly description?: string;\n        readonly meta?: string;\n        readonly action?: INotification.Action;\n        readonly secondaryAction?: INotification.Action;\n        readonly filled?: boolean;\n        readonly duration?: number | null;\n        readonly progress?: boolean;\n        readonly icon?: IRtIcon.Name | null;\n        readonly onDismiss?: (reason: INotification.DismissReason) => void;\n        /** Тост вытеснен новым в режиме `replace` и уходит своей анимацией. */\n        readonly replaced?: boolean;\n    }\n\n    export interface Height {\n        readonly toastId: number;\n        readonly height: number;\n    }\n}\n","import { BooleanInput } from '@angular/cdk/coercion';\nimport {\n    AfterViewInit,\n    booleanAttribute,\n    ChangeDetectionStrategy,\n    Component,\n    computed,\n    effect,\n    ElementRef,\n    HostBinding,\n    inject,\n    input,\n    InputSignal,\n    InputSignalWithTransform,\n    OnDestroy,\n    output,\n    OutputEmitterRef,\n    signal,\n    Signal,\n    ViewEncapsulation,\n    WritableSignal,\n} from '@angular/core';\n\nimport { BlockDirective, ElemDirective } from '@rt-tools/core';\n\nimport { RT_KIT_LABELS, TRtKitLabelMap } from '@rt-tools/ui-kit-v2/core';\nimport { INotification } from '@rt-tools/ui-kit-v2/core';\n\nimport { RtButtonDirective } from '@rt-tools/ui-kit-v2/button';\nimport { RtIconButtonComponent } from '@rt-tools/ui-kit-v2/icon-button';\nimport { RtIconComponent } from '@rt-tools/ui-kit-v2/icon';\nimport { IRtIcon } from '@rt-tools/ui-kit-v2/core';\nimport { RT_TOAST_SEVERITY_ICONS, RT_TOASTER_GAP_PX, IRtToaster } from './rt-toaster.model';\n\nconst BEM_BLOCK: string = 'rt-toast';\n\nconst UNMOUNT_DELAY_MS: number = 200;\n\n@Component({\n    selector: 'rt-toast',\n    templateUrl: './rt-toast.component.html',\n    styleUrl: './rt-toast.component.scss',\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    encapsulation: ViewEncapsulation.None,\n    imports: [RtButtonDirective, RtIconComponent, RtIconButtonComponent, BlockDirective, ElemDirective],\n    host: {\n        class: BEM_BLOCK,\n        role: 'status',\n        'aria-atomic': 'true',\n    },\n})\nexport class RtToastComponent implements AfterViewInit, OnDestroy {\n    readonly #host: ElementRef<HTMLElement> = inject(ElementRef);\n\n    readonly #severityIcons: Readonly<Record<INotification.Severity, IRtIcon.Name>> = inject(RT_TOAST_SEVERITY_ICONS);\n\n    readonly #mounted: WritableSignal<boolean> = signal<boolean>(false);\n\n    readonly #removed: WritableSignal<boolean> = signal<boolean>(false);\n\n    readonly #offsetBeforeRemove: WritableSignal<number> = signal<number>(0);\n\n    readonly #initialHeight: WritableSignal<number> = signal<number>(0);\n\n    readonly #heightIndex: Signal<number> = computed((): number =>\n        this.heights().findIndex((item: IRtToaster.Height): boolean => item.toastId === this.toast().id)\n    );\n\n    readonly #heightBefore: Signal<number> = computed((): number =>\n        this.heights().reduce(\n            (total: number, item: IRtToaster.Height, itemIndex: number): number =>\n                itemIndex >= this.#heightIndex() ? total : total + item.height,\n            0\n        )\n    );\n\n    readonly #offset: Signal<number> = computed((): number => Math.round(this.#heightIndex() * RT_TOASTER_GAP_PX + this.#heightBefore()));\n\n    readonly #positionY: Signal<IRtToaster.PositionY> = computed((): IRtToaster.PositionY =>\n        this.position().startsWith('top') ? 'top' : 'bottom'\n    );\n\n    #timeoutId: ReturnType<typeof setTimeout> | undefined;\n\n    #unmountTimeoutId: ReturnType<typeof setTimeout> | undefined;\n\n    #remainingTimeMs: number = 0;\n\n    #closeTimerStartedAt: number = 0;\n\n    #closeTimerPausedAt: number = 0;\n\n    protected readonly t: Signal<TRtKitLabelMap> = inject(RT_KIT_LABELS);\n\n    /** Свой значок тоста важнее карты severity; `null` у тоста значок снимает. */\n    protected readonly icon: Signal<IRtIcon.Name | null> = computed((): IRtIcon.Name | null => {\n        const icon: IRtIcon.Name | null | undefined = this.toast().icon;\n        return icon === undefined ? this.#severityIcons[this.toast().severity] : icon;\n    });\n\n    /** Срок жизни тоста: свой, если задан, иначе тостера; `null` — таймера нет. */\n    protected readonly lifetime: Signal<number | null> = computed((): number | null => {\n        const duration: number | null | undefined = this.toast().duration;\n        return duration === undefined ? this.duration() : duration;\n    });\n\n    protected readonly showProgress: Signal<boolean> = computed((): boolean => this.toast().progress === true && this.lifetime() !== null);\n\n    /** Таймер и полоса срока встают от одного признака, чтобы не разойтись. */\n    protected readonly paused: Signal<boolean> = computed((): boolean => this.expanded() || this.interacting());\n\n    public readonly toast: InputSignal<IRtToaster.Toast> = input.required<IRtToaster.Toast>();\n\n    public readonly index: InputSignal<number> = input.required<number>();\n\n    public readonly totalToasts: InputSignal<number> = input.required<number>();\n\n    public readonly heights: InputSignal<IRtToaster.Height[]> = input.required<IRtToaster.Height[]>();\n\n    public readonly expanded: InputSignalWithTransform<boolean, BooleanInput> = input.required<boolean, BooleanInput>({\n        transform: booleanAttribute,\n    });\n\n    public readonly expandByDefault: InputSignalWithTransform<boolean, BooleanInput> = input<boolean, BooleanInput>(false, {\n        transform: booleanAttribute,\n    });\n\n    public readonly interacting: InputSignalWithTransform<boolean, BooleanInput> = input<boolean, BooleanInput>(false, {\n        transform: booleanAttribute,\n    });\n\n    public readonly position: InputSignal<IRtToaster.Position> = input<IRtToaster.Position>('bottom-right');\n\n    public readonly visibleToasts: InputSignal<number> = input<number>(3);\n\n    public readonly duration: InputSignal<number> = input<number>(4000);\n\n    public readonly heightAdded: OutputEmitterRef<IRtToaster.Height> = output<IRtToaster.Height>();\n\n    public readonly heightRemoved: OutputEmitterRef<number> = output<number>();\n\n    public readonly dismissed: OutputEmitterRef<number> = output<number>();\n\n    @HostBinding('class')\n    public get hostModifierClasses(): Record<string, boolean> {\n        return {\n            [`${BEM_BLOCK}--severity--${this.toast().severity}`]: true,\n            [`${BEM_BLOCK}--filled`]: this.toast().filled === true,\n            [`${BEM_BLOCK}--y--${this.#positionY()}`]: true,\n            [`${BEM_BLOCK}--mounted`]: this.#mounted(),\n            [`${BEM_BLOCK}--removed`]: this.#removed(),\n            [`${BEM_BLOCK}--front`]: this.index() === 0,\n            [`${BEM_BLOCK}--hidden`]: this.index() + 1 > this.visibleToasts(),\n            [`${BEM_BLOCK}--expanded`]: this.expanded() || (this.expandByDefault() && this.#mounted()),\n            [`${BEM_BLOCK}--paused`]: this.paused(),\n        };\n    }\n\n    @HostBinding('style')\n    public get hostStackStyles(): Record<string, string> {\n        return {\n            '--index': `${this.index()}`,\n            '--toasts-before': `${this.index()}`,\n            '--z-index': `${this.totalToasts() - this.index()}`,\n            '--offset': `${this.#removed() ? this.#offsetBeforeRemove() : this.#offset()}px`,\n            '--initial-height': this.expandByDefault() ? 'auto' : `${this.#initialHeight()}px`,\n            '--lifetime': `${this.lifetime() ?? 0}ms`,\n        };\n    }\n\n    constructor() {\n        effect((onCleanup: (cleanup: () => void) => void): void => {\n            if (!this.#mounted() || this.#removed() || this.lifetime() === null) {\n                return;\n            }\n\n            if (this.paused()) {\n                this.#pauseTimer();\n            } else {\n                this.#startTimer();\n            }\n\n            onCleanup((): void => clearTimeout(this.#timeoutId));\n        });\n\n        // Вытесненный в режиме `replace` уходит тем же путём, что и закрытый крестиком.\n        effect((): void => {\n            if (this.#mounted() && this.toast().replaced === true) {\n                this.#deleteToast('replaced');\n            }\n        });\n    }\n\n    public ngAfterViewInit(): void {\n        this.#remainingTimeMs = this.lifetime() ?? 0;\n\n        const height: number = this.#host.nativeElement.getBoundingClientRect().height;\n        this.#initialHeight.set(height);\n        this.heightAdded.emit({ toastId: this.toast().id, height });\n\n        this.#mounted.set(true);\n    }\n\n    public ngOnDestroy(): void {\n        clearTimeout(this.#timeoutId);\n        clearTimeout(this.#unmountTimeoutId);\n    }\n\n    protected onAction(): void {\n        this.toast().action?.handler();\n        this.#deleteToast(null);\n    }\n\n    protected onSecondaryAction(): void {\n        this.toast().secondaryAction?.handler();\n        this.#deleteToast(null);\n    }\n\n    protected onClose(): void {\n        this.#deleteToast('close');\n    }\n\n    /** Уход тоста. Причина — для колбэка приложения; ушедший по действию её не сообщает: `null`. */\n    #deleteToast(reason: INotification.DismissReason | null): void {\n        if (this.#removed()) {\n            return;\n        }\n\n        this.#removed.set(true);\n\n        if (reason !== null) {\n            this.toast().onDismiss?.(reason);\n        }\n\n        this.#offsetBeforeRemove.set(this.#offset());\n        this.heightRemoved.emit(this.toast().id);\n\n        this.#unmountTimeoutId = setTimeout((): void => this.dismissed.emit(this.toast().id), UNMOUNT_DELAY_MS);\n    }\n\n    #startTimer(): void {\n        this.#closeTimerStartedAt = Date.now();\n        this.#timeoutId = setTimeout((): void => this.#deleteToast('timeout'), this.#remainingTimeMs);\n    }\n\n    #pauseTimer(): void {\n        if (this.#closeTimerPausedAt < this.#closeTimerStartedAt) {\n            const elapsedMs: number = Date.now() - this.#closeTimerStartedAt;\n            this.#remainingTimeMs = this.#remainingTimeMs - elapsedMs;\n        }\n\n        this.#closeTimerPausedAt = Date.now();\n    }\n}\n","<ng-container rtBlock=\"rt-toast\">\n    @if (icon(); as icon) {\n        <rt-icon rtElem=\"icon\" qa-dataid=\"toast-icon\" size=\"sm\" [name]=\"icon\" />\n    }\n    <div rtElem=\"content\" qa-dataid=\"toast-content\">\n        @if (toast().meta; as meta) {\n            <span rtElem=\"meta\" qa-dataid=\"toast-meta\">{{ meta }}</span>\n        }\n        <span rtElem=\"message\" qa-dataid=\"toast-message\">{{ toast().message }}</span>\n        @if (toast().description; as description) {\n            <span rtElem=\"description\" qa-dataid=\"toast-description\">{{ description }}</span>\n        }\n        @if (toast().action || toast().secondaryAction) {\n            <div rtElem=\"actions\">\n                @if (toast().action; as action) {\n                    <button rtButton rtElem=\"action\" qa-dataid=\"toast-action\" size=\"sm\" type=\"button\" (click)=\"onAction()\">\n                        {{ action.label }}\n                    </button>\n                }\n                @if (toast().secondaryAction; as secondaryAction) {\n                    <button\n                        rtButton\n                        rtElem=\"action\"\n                        qa-dataid=\"toast-secondary-action\"\n                        size=\"sm\"\n                        theme=\"secondary\"\n                        appearance=\"text\"\n                        type=\"button\"\n                        (click)=\"onSecondaryAction()\">\n                        {{ secondaryAction.label }}\n                    </button>\n                }\n            </div>\n        }\n    </div>\n    <rt-icon-button\n        rtElem=\"close\"\n        qa-dataid=\"toast-close\"\n        icon=\"ico-close\"\n        variant=\"ghost\"\n        size=\"sm\"\n        [ariaLabel]=\"t().uiClose\"\n        (clicked)=\"onClose()\" />\n    @if (showProgress()) {\n        <span rtElem=\"progress\" qa-dataid=\"toast-progress\" aria-hidden=\"true\"></span>\n    }\n</ng-container>\n","import {\n    ChangeDetectionStrategy,\n    Component,\n    HostBinding,\n    InputSignal,\n    InputSignalWithTransform,\n    Signal,\n    ViewEncapsulation,\n    WritableSignal,\n    booleanAttribute,\n    computed,\n    inject,\n    input,\n    linkedSignal,\n    numberAttribute,\n    signal,\n} from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\n\nimport { rtKitLabel } from '@rt-tools/ui-kit-v2/core';\nimport { INotification, NotificationBus } from '@rt-tools/ui-kit-v2/core';\n\nimport { RtToastComponent } from './rt-toast.component';\nimport { RT_TOASTER_GAP_PX, IRtToaster } from './rt-toaster.model';\n\nconst BEM_BLOCK: string = 'rt-toaster';\n\nconst DEFAULT_DURATION_MS: number = 4000;\n\nconst DEFAULT_VISIBLE_TOASTS: number = 3;\n\n@Component({\n    selector: 'rt-toaster',\n    templateUrl: './rt-toaster.component.html',\n    styleUrl: './rt-toaster.component.scss',\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    encapsulation: ViewEncapsulation.None,\n    imports: [RtToastComponent],\n    host: {\n        class: BEM_BLOCK,\n        role: 'region',\n        '[attr.aria-label]': 'ariaLabel()',\n        '(mouseenter)': 'onStackEnter()',\n        '(mousemove)': 'onStackEnter()',\n        '(mouseleave)': 'onStackLeave()',\n        '(pointerdown)': 'onStackPointerDown()',\n        '(pointerup)': 'onStackPointerUp()',\n    },\n})\nexport class RtToasterComponent {\n    readonly #notificationBus: NotificationBus = inject(NotificationBus);\n\n    protected readonly ariaLabel: Signal<string> = rtKitLabel('uiNotifications');\n\n    #toastCounter: number = 0;\n\n    protected readonly toasts: WritableSignal<IRtToaster.Toast[]> = signal<IRtToaster.Toast[]>([]);\n\n    protected readonly heights: WritableSignal<IRtToaster.Height[]> = signal<IRtToaster.Height[]>([]);\n\n    protected readonly expanded: WritableSignal<boolean> = linkedSignal<IRtToaster.Toast[], boolean>({\n        source: this.toasts,\n        computation: (toasts: IRtToaster.Toast[]): boolean => toasts.length < 1,\n    });\n\n    protected readonly interacting: WritableSignal<boolean> = signal<boolean>(false);\n\n    protected readonly positionY: Signal<IRtToaster.PositionY> = computed((): IRtToaster.PositionY =>\n        this.position().startsWith('top') ? 'top' : 'bottom'\n    );\n\n    protected readonly positionX: Signal<IRtToaster.PositionX> = computed((): IRtToaster.PositionX => {\n        if (this.position().endsWith('left')) {\n            return 'left';\n        }\n        return this.position().endsWith('center') ? 'center' : 'right';\n    });\n\n    public readonly position: InputSignal<IRtToaster.Position> = input<IRtToaster.Position>('bottom-right');\n\n    public readonly duration: InputSignalWithTransform<number, number | string> = input<number, number | string>(DEFAULT_DURATION_MS, {\n        transform: numberAttribute,\n    });\n\n    public readonly visibleToasts: InputSignalWithTransform<number, number | string> = input<number, number | string>(\n        DEFAULT_VISIBLE_TOASTS,\n        { transform: numberAttribute }\n    );\n\n    /** `replace` — новый тост уводит прежние их же анимацией ухода, а не копится стопкой. */\n    public readonly mode: InputSignal<IRtToaster.Mode> = input<IRtToaster.Mode>('stack');\n\n    public readonly expand: InputSignalWithTransform<boolean, boolean | string> = input<boolean, boolean | string>(false, {\n        transform: booleanAttribute,\n    });\n\n    @HostBinding('class')\n    public get hostModifierClasses(): Record<string, boolean> {\n        return {\n            [`${BEM_BLOCK}--y--${this.positionY()}`]: true,\n            [`${BEM_BLOCK}--x--${this.positionX()}`]: true,\n        };\n    }\n\n    @HostBinding('style')\n    public get hostStackStyles(): Record<string, string> {\n        return {\n            '--front-toast-height': `${this.heights()[0]?.height ?? 0}px`,\n            '--gap': `${RT_TOASTER_GAP_PX}px`,\n        };\n    }\n\n    constructor() {\n        this.#notificationBus\n            .onEmit()\n            .pipe(takeUntilDestroyed())\n            .subscribe((event: INotification.Event): void => this.#addToast(event));\n    }\n\n    protected onStackEnter(): void {\n        if (this.toasts().length > 0) {\n            this.expanded.set(true);\n        }\n    }\n\n    protected onStackLeave(): void {\n        if (!this.interacting()) {\n            this.expanded.set(false);\n        }\n    }\n\n    protected onStackPointerDown(): void {\n        this.interacting.set(true);\n    }\n\n    protected onStackPointerUp(): void {\n        this.interacting.set(false);\n    }\n\n    protected onHeightAdded(height: IRtToaster.Height): void {\n        this.heights.update((items: IRtToaster.Height[]): IRtToaster.Height[] =>\n            this.#sortHeights([height, ...items.filter((item: IRtToaster.Height): boolean => item.toastId !== height.toastId)])\n        );\n    }\n\n    protected onHeightRemoved(toastId: number): void {\n        this.heights.update((items: IRtToaster.Height[]): IRtToaster.Height[] =>\n            items.filter((item: IRtToaster.Height): boolean => item.toastId !== toastId)\n        );\n    }\n\n    protected onDismissed(toastId: number): void {\n        this.onHeightRemoved(toastId);\n        this.toasts.update((items: IRtToaster.Toast[]): IRtToaster.Toast[] =>\n            items.filter((item: IRtToaster.Toast): boolean => item.id !== toastId)\n        );\n    }\n\n    #addToast(event: INotification.Event): void {\n        this.#toastCounter += 1;\n        const toast: IRtToaster.Toast = {\n            id: this.#toastCounter,\n            severity: event.payload.severity,\n            message: event.payload.message,\n            description: event.payload.description,\n            meta: event.payload.meta,\n            action: event.payload.action,\n            secondaryAction: event.payload.secondaryAction,\n            filled: event.payload.filled,\n            duration: event.payload.duration,\n            progress: event.payload.progress,\n            icon: event.payload.icon,\n            onDismiss: event.payload.onDismiss,\n        };\n        this.toasts.update((items: IRtToaster.Toast[]): IRtToaster.Toast[] => [\n            toast,\n            ...(this.mode() === 'replace' ? items.map((item: IRtToaster.Toast): IRtToaster.Toast => this.#replaced(item)) : items),\n        ]);\n    }\n\n    #replaced(toast: IRtToaster.Toast): IRtToaster.Toast {\n        return toast.replaced ? toast : { ...toast, replaced: true };\n    }\n\n    #sortHeights(items: IRtToaster.Height[]): IRtToaster.Height[] {\n        const order: number[] = this.toasts().map((toast: IRtToaster.Toast): number => toast.id);\n        return [...items].sort(\n            (left: IRtToaster.Height, right: IRtToaster.Height): number => order.indexOf(left.toastId) - order.indexOf(right.toastId)\n        );\n    }\n}\n","@for (item of toasts(); track item.id) {\n    <rt-toast\n        qa-dataid=\"toast\"\n        [toast]=\"item\"\n        [index]=\"$index\"\n        [totalToasts]=\"toasts().length\"\n        [heights]=\"heights()\"\n        [expanded]=\"expanded()\"\n        [expandByDefault]=\"expand()\"\n        [interacting]=\"interacting()\"\n        [position]=\"position()\"\n        [visibleToasts]=\"visibleToasts()\"\n        [duration]=\"duration()\"\n        (heightAdded)=\"onHeightAdded($event)\"\n        (heightRemoved)=\"onHeightRemoved($event)\"\n        (dismissed)=\"onDismissed($event)\" />\n}\n"],"mappings":"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"}
+{"version":3,"file":"rt-tools-ui-kit-v2-toast.mjs","names":["BEM_BLOCK"],"sources":["../../../projects/ui-kit-v2/src/lib/components/toast/rt-toaster.model.ts","../../../projects/ui-kit-v2/src/lib/components/toast/rt-toast.component.ts","../../../projects/ui-kit-v2/src/lib/components/toast/rt-toast.component.html","../../../projects/ui-kit-v2/src/lib/components/toast/rt-toaster.component.ts","../../../projects/ui-kit-v2/src/lib/components/toast/rt-toaster.component.html"],"sourcesContent":["import { InjectionToken, Type } from '@angular/core';\n\nimport { INotification, NotificationRef } from '@rt-tools/ui-kit-v2/core';\n\nimport { IRtIcon } from '@rt-tools/ui-kit-v2/core';\n\nexport const RT_TOASTER_GAP_PX: number = 14;\n\n/**\n * Значки severity у тоста. Приложение подменяет карту целиком — например, на имена\n * Material, — а тост со своим `icon` берёт свой значок мимо карты.\n */\nexport const RT_TOAST_SEVERITY_ICONS: InjectionToken<Readonly<Record<INotification.Severity, IRtIcon.Name>>> = new InjectionToken<\n    Readonly<Record<INotification.Severity, IRtIcon.Name>>\n>('RT_TOAST_SEVERITY_ICONS', {\n    providedIn: 'root',\n    factory: (): Readonly<Record<INotification.Severity, IRtIcon.Name>> => ({\n        info: 'info-circle',\n        success: 'check-circle',\n        warning: 'exclamation-circle',\n        danger: 'times-circle',\n    }),\n});\n\n/** Данные своего компонента тоста — то, что приложение передало в `openFromComponent`. */\nexport const RT_TOAST_DATA: InjectionToken<unknown> = new InjectionToken<unknown>('RT_TOAST_DATA');\n\nexport namespace IRtToaster {\n    export type Position = 'top-left' | 'top-center' | 'top-right' | 'bottom-left' | 'bottom-center' | 'bottom-right';\n\n    export type PositionY = 'top' | 'bottom';\n\n    export type PositionX = 'left' | 'center' | 'right';\n\n    /** `stack` копит тосты стопкой; `replace` — новый тост уводит прежние. */\n    export type Mode = 'stack' | 'replace';\n\n    export interface Toast {\n        readonly id: number;\n        readonly severity: INotification.Severity;\n        readonly message: string;\n        readonly description?: string;\n        readonly meta?: string;\n        readonly action?: INotification.Action;\n        readonly secondaryAction?: INotification.Action;\n        readonly filled?: boolean;\n        readonly duration?: number | null;\n        readonly progress?: boolean;\n        readonly icon?: IRtIcon.Name | null;\n        readonly onDismiss?: (reason: INotification.DismissReason) => void;\n        /** Тост вытеснен новым в режиме `replace` и уходит своей анимацией. */\n        readonly replaced?: boolean;\n        readonly progressValue?: number | null;\n        readonly details?: string;\n        readonly component?: Type<unknown>;\n        readonly data?: unknown;\n        /** Голый тост: оболочки нет, свой компонент рисует карточку сам. */\n        readonly bare?: boolean;\n        /** Ручка тоста: тост сообщает ей, почему ушёл. */\n        readonly ref?: NotificationRef;\n        /** Приложение закрыло тост ручкой: он уходит своей анимацией, как вытесненный. */\n        readonly dismissRequested?: boolean;\n    }\n\n    /** Изменение показанного тоста от его ручки. */\n    export interface Change {\n        readonly toastId: number;\n        readonly patch: INotification.Update & Pick<Toast, 'dismissRequested'>;\n    }\n\n    export interface Height {\n        readonly toastId: number;\n        readonly height: number;\n    }\n}\n","import { BooleanInput } from '@angular/cdk/coercion';\nimport { NgComponentOutlet } from '@angular/common';\nimport {\n    afterNextRender,\n    AfterViewInit,\n    booleanAttribute,\n    ChangeDetectionStrategy,\n    Component,\n    computed,\n    effect,\n    ElementRef,\n    HostBinding,\n    inject,\n    Injector,\n    input,\n    InputSignal,\n    InputSignalWithTransform,\n    OnDestroy,\n    output,\n    OutputEmitterRef,\n    signal,\n    Signal,\n    ViewEncapsulation,\n    WritableSignal,\n} from '@angular/core';\n\nimport { BlockDirective, ElemDirective } from '@rt-tools/core';\n\nimport { RT_KIT_LABELS, TRtKitLabelMap } from '@rt-tools/ui-kit-v2/core';\nimport { INotification, NotificationRef } from '@rt-tools/ui-kit-v2/core';\n\nimport { RtButtonDirective } from '@rt-tools/ui-kit-v2/button';\nimport { RtCopyValueComponent } from '@rt-tools/ui-kit-v2/copy-value';\nimport { RtProgressBarComponent } from '@rt-tools/ui-kit-v2/progress-bar';\nimport { RtIconButtonComponent } from '@rt-tools/ui-kit-v2/icon-button';\nimport { RtIconComponent } from '@rt-tools/ui-kit-v2/icon';\nimport { IRtIcon } from '@rt-tools/ui-kit-v2/core';\nimport { RT_TOAST_DATA, RT_TOAST_SEVERITY_ICONS, RT_TOASTER_GAP_PX, IRtToaster } from './rt-toaster.model';\n\n/** Что нужно своему компоненту тоста: данные и ручка. Меняются они реже прочих полей тоста. */\ninterface IToastComponentInputs {\n    readonly data: unknown;\n    readonly ref: NotificationRef | undefined;\n}\n\nconst BEM_BLOCK: string = 'rt-toast';\n\nconst UNMOUNT_DELAY_MS: number = 200;\n\n@Component({\n    selector: 'rt-toast',\n    templateUrl: './rt-toast.component.html',\n    styleUrl: './rt-toast.component.scss',\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    encapsulation: ViewEncapsulation.None,\n    imports: [\n        NgComponentOutlet,\n        RtButtonDirective,\n        RtCopyValueComponent,\n        RtIconComponent,\n        RtIconButtonComponent,\n        RtProgressBarComponent,\n        BlockDirective,\n        ElemDirective,\n    ],\n    host: {\n        class: BEM_BLOCK,\n        role: 'status',\n        'aria-atomic': 'true',\n    },\n})\nexport class RtToastComponent implements AfterViewInit, OnDestroy {\n    readonly #host: ElementRef<HTMLElement> = inject(ElementRef);\n\n    readonly #injector: Injector = inject(Injector);\n\n    /**\n     * Данные и ручка своего компонента — отдельным сигналом с равенством по ним: живая доля\n     * меняет тост на каждом тике, и без этого компонент создавался бы заново вместе с инжектором.\n     */\n    readonly #componentInputs: Signal<IToastComponentInputs> = computed(\n        (): IToastComponentInputs => ({ data: this.toast().data, ref: this.toast().ref }),\n        {\n            equal: (left: IToastComponentInputs, right: IToastComponentInputs): boolean =>\n                left.data === right.data && left.ref === right.ref,\n        }\n    );\n\n    readonly #severityIcons: Readonly<Record<INotification.Severity, IRtIcon.Name>> = inject(RT_TOAST_SEVERITY_ICONS);\n\n    readonly #mounted: WritableSignal<boolean> = signal<boolean>(false);\n\n    readonly #removed: WritableSignal<boolean> = signal<boolean>(false);\n\n    readonly #offsetBeforeRemove: WritableSignal<number> = signal<number>(0);\n\n    readonly #initialHeight: WritableSignal<number> = signal<number>(0);\n\n    readonly #heightIndex: Signal<number> = computed((): number =>\n        this.heights().findIndex((item: IRtToaster.Height): boolean => item.toastId === this.toast().id)\n    );\n\n    readonly #heightBefore: Signal<number> = computed((): number =>\n        this.heights().reduce(\n            (total: number, item: IRtToaster.Height, itemIndex: number): number =>\n                itemIndex >= this.#heightIndex() ? total : total + item.height,\n            0\n        )\n    );\n\n    readonly #offset: Signal<number> = computed((): number => Math.round(this.#heightIndex() * RT_TOASTER_GAP_PX + this.#heightBefore()));\n\n    readonly #positionY: Signal<IRtToaster.PositionY> = computed((): IRtToaster.PositionY =>\n        this.position().startsWith('top') ? 'top' : 'bottom'\n    );\n\n    #timeoutId: ReturnType<typeof setTimeout> | undefined;\n\n    #unmountTimeoutId: ReturnType<typeof setTimeout> | undefined;\n\n    #remainingTimeMs: number = 0;\n\n    #closeTimerStartedAt: number = 0;\n\n    #closeTimerPausedAt: number = 0;\n\n    protected readonly t: Signal<TRtKitLabelMap> = inject(RT_KIT_LABELS);\n\n    /** Свой значок тоста важнее карты severity; `null` у тоста значок снимает. */\n    protected readonly icon: Signal<IRtIcon.Name | null> = computed((): IRtIcon.Name | null => {\n        const icon: IRtIcon.Name | null | undefined = this.toast().icon;\n        return icon === undefined ? this.#severityIcons[this.toast().severity] : icon;\n    });\n\n    /** Срок жизни тоста: свой, если задан, иначе тостера; `null` — таймера нет. */\n    protected readonly lifetime: Signal<number | null> = computed((): number | null => {\n        const duration: number | null | undefined = this.toast().duration;\n        return duration === undefined ? this.duration() : duration;\n    });\n\n    /** Инжектор своего компонента: данные токеном `RT_TOAST_DATA` и ручка `NotificationRef`. */\n    protected readonly componentInjector: Signal<Injector> = computed((): Injector => {\n        const inputs: IToastComponentInputs = this.#componentInputs();\n\n        return Injector.create({\n            providers: [\n                { provide: RT_TOAST_DATA, useValue: inputs.data },\n                { provide: NotificationRef, useValue: inputs.ref ?? null },\n            ],\n            parent: this.#injector,\n        });\n    });\n\n    /** Живая доля задачи: число 0–100 — полоса стоит, `null` и пусто — её нет. */\n    protected readonly progressValue: Signal<number | null> = computed((): number | null => this.toast().progressValue ?? null);\n\n    /** Подробности раскрыты. */\n    protected readonly detailsOpen: WritableSignal<boolean> = signal<boolean>(false);\n\n    /** Голый тост: значка, крестика и полосы срока нет, оболочку снимает модификатор. */\n    protected readonly bare: Signal<boolean> = computed((): boolean => this.toast().bare === true);\n\n    protected readonly showProgress: Signal<boolean> = computed(\n        (): boolean => !this.bare() && this.toast().progress === true && this.lifetime() !== null\n    );\n\n    /** Таймер и полоса срока встают от одного признака, чтобы не разойтись. */\n    protected readonly paused: Signal<boolean> = computed((): boolean => this.expanded() || this.interacting());\n\n    public readonly toast: InputSignal<IRtToaster.Toast> = input.required<IRtToaster.Toast>();\n\n    public readonly index: InputSignal<number> = input.required<number>();\n\n    public readonly totalToasts: InputSignal<number> = input.required<number>();\n\n    public readonly heights: InputSignal<IRtToaster.Height[]> = input.required<IRtToaster.Height[]>();\n\n    public readonly expanded: InputSignalWithTransform<boolean, BooleanInput> = input.required<boolean, BooleanInput>({\n        transform: booleanAttribute,\n    });\n\n    public readonly expandByDefault: InputSignalWithTransform<boolean, BooleanInput> = input<boolean, BooleanInput>(false, {\n        transform: booleanAttribute,\n    });\n\n    public readonly interacting: InputSignalWithTransform<boolean, BooleanInput> = input<boolean, BooleanInput>(false, {\n        transform: booleanAttribute,\n    });\n\n    public readonly position: InputSignal<IRtToaster.Position> = input<IRtToaster.Position>('bottom-right');\n\n    public readonly visibleToasts: InputSignal<number> = input<number>(3);\n\n    public readonly duration: InputSignal<number> = input<number>(4000);\n\n    public readonly heightAdded: OutputEmitterRef<IRtToaster.Height> = output<IRtToaster.Height>();\n\n    public readonly heightRemoved: OutputEmitterRef<number> = output<number>();\n\n    public readonly dismissed: OutputEmitterRef<number> = output<number>();\n\n    @HostBinding('class')\n    public get hostModifierClasses(): Record<string, boolean> {\n        return {\n            [`${BEM_BLOCK}--severity--${this.toast().severity}`]: true,\n            [`${BEM_BLOCK}--filled`]: this.toast().filled === true,\n            [`${BEM_BLOCK}--bare`]: this.bare(),\n            [`${BEM_BLOCK}--y--${this.#positionY()}`]: true,\n            [`${BEM_BLOCK}--mounted`]: this.#mounted(),\n            [`${BEM_BLOCK}--removed`]: this.#removed(),\n            [`${BEM_BLOCK}--front`]: this.index() === 0,\n            [`${BEM_BLOCK}--hidden`]: this.index() + 1 > this.visibleToasts(),\n            [`${BEM_BLOCK}--expanded`]: this.expanded() || (this.expandByDefault() && this.#mounted()),\n            [`${BEM_BLOCK}--paused`]: this.paused(),\n        };\n    }\n\n    @HostBinding('style')\n    public get hostStackStyles(): Record<string, string> {\n        return {\n            '--index': `${this.index()}`,\n            '--toasts-before': `${this.index()}`,\n            '--z-index': `${this.totalToasts() - this.index()}`,\n            '--offset': `${this.#removed() ? this.#offsetBeforeRemove() : this.#offset()}px`,\n            '--initial-height': this.expandByDefault() ? 'auto' : `${this.#initialHeight()}px`,\n            '--lifetime': `${this.lifetime() ?? 0}ms`,\n        };\n    }\n\n    constructor() {\n        effect((onCleanup: (cleanup: () => void) => void): void => {\n            if (!this.#mounted() || this.#removed() || this.lifetime() === null) {\n                return;\n            }\n\n            if (this.paused()) {\n                this.#pauseTimer();\n            } else {\n                this.#startTimer();\n            }\n\n            onCleanup((): void => clearTimeout(this.#timeoutId));\n        });\n\n        // Вытесненный в режиме `replace` уходит тем же путём, что и закрытый крестиком.\n        effect((): void => {\n            if (this.#mounted() && this.toast().replaced === true) {\n                this.#deleteToast('replaced');\n            }\n        });\n\n        // Закрытый ручкой приложения — тоже.\n        effect((): void => {\n            if (this.#mounted() && this.toast().dismissRequested === true) {\n                this.#deleteToast('dismiss');\n            }\n        });\n\n        // Новый текст, доля или раскрытые подробности меняют высоту: стопка пересчитывает сдвиги.\n        effect((): void => {\n            const toast: IRtToaster.Toast = this.toast();\n            this.detailsOpen();\n            if (!this.#mounted() || toast.replaced === true) {\n                return;\n            }\n            afterNextRender((): void => this.#remeasure(), { injector: this.#injector });\n        });\n    }\n\n    public ngAfterViewInit(): void {\n        this.#remainingTimeMs = this.lifetime() ?? 0;\n\n        const height: number = this.#host.nativeElement.getBoundingClientRect().height;\n        this.#initialHeight.set(height);\n        this.heightAdded.emit({ toastId: this.toast().id, height });\n\n        this.#mounted.set(true);\n    }\n\n    public ngOnDestroy(): void {\n        clearTimeout(this.#timeoutId);\n        clearTimeout(this.#unmountTimeoutId);\n        // Тост ушёл не своим путём — вместе с тостером. Ушедший своим путём ручку уже закрыл, и\n        // повторная отметка ничего не делает.\n        this.toast().ref?.markClosed('destroyed');\n    }\n\n    protected onAction(): void {\n        this.toast().action?.handler();\n        this.#deleteToast(null);\n    }\n\n    protected onSecondaryAction(): void {\n        this.toast().secondaryAction?.handler();\n        this.#deleteToast(null);\n    }\n\n    protected onClose(): void {\n        this.#deleteToast('close');\n    }\n\n    protected toggleDetails(): void {\n        this.detailsOpen.update((open: boolean): boolean => !open);\n    }\n\n    /**\n     * Уход тоста. Причину получает ручка; колбэк приложения — только уход без действия и без\n     * `dismiss()`: действие уже вызвало свой обработчик, а закрыло тост само приложение.\n     */\n    #deleteToast(reason: INotification.CloseReason | null): void {\n        if (this.#removed()) {\n            return;\n        }\n\n        this.#removed.set(true);\n\n        if (reason !== null && reason !== 'action' && reason !== 'dismiss' && reason !== 'destroyed') {\n            this.toast().onDismiss?.(reason);\n        }\n\n        this.toast().ref?.markClosed(reason ?? 'action');\n\n        this.#offsetBeforeRemove.set(this.#offset());\n        this.heightRemoved.emit(this.toast().id);\n\n        this.#unmountTimeoutId = setTimeout((): void => this.dismissed.emit(this.toast().id), UNMOUNT_DELAY_MS);\n    }\n\n    /** Высота по содержимому: своя высота стопки на время замера снимается. */\n    #remeasure(): void {\n        if (this.#removed()) {\n            return;\n        }\n\n        const host: HTMLElement = this.#host.nativeElement;\n        host.style.height = 'auto';\n        const height: number = host.offsetHeight;\n        host.style.height = '';\n\n        if (height !== this.#initialHeight()) {\n            this.#initialHeight.set(height);\n            this.heightAdded.emit({ toastId: this.toast().id, height });\n        }\n    }\n\n    #startTimer(): void {\n        this.#closeTimerStartedAt = Date.now();\n        this.#timeoutId = setTimeout((): void => this.#deleteToast('timeout'), this.#remainingTimeMs);\n    }\n\n    #pauseTimer(): void {\n        if (this.#closeTimerPausedAt < this.#closeTimerStartedAt) {\n            const elapsedMs: number = Date.now() - this.#closeTimerStartedAt;\n            this.#remainingTimeMs = this.#remainingTimeMs - elapsedMs;\n        }\n\n        this.#closeTimerPausedAt = Date.now();\n    }\n}\n","<ng-container rtBlock=\"rt-toast\">\n    @if (!bare() && icon(); as icon) {\n        <rt-icon rtElem=\"icon\" qa-dataid=\"toast-icon\" size=\"sm\" [name]=\"icon\" />\n    }\n    <div rtElem=\"content\" qa-dataid=\"toast-content\">\n        @if (toast().meta; as meta) {\n            <span rtElem=\"meta\" qa-dataid=\"toast-meta\">{{ meta }}</span>\n        }\n        @if (toast().component; as component) {\n            <!-- Свой компонент встаёт на место сообщения; сообщение остаётся именем для чтения с экрана. -->\n            @if (toast().message) {\n                <span rtElem=\"sr-message\">{{ toast().message }}</span>\n            }\n            <div rtElem=\"custom\" qa-dataid=\"toast-custom\">\n                <ng-container [ngComponentOutlet]=\"component\" [ngComponentOutletInjector]=\"componentInjector()\" />\n            </div>\n        } @else {\n            <span rtElem=\"message\" qa-dataid=\"toast-message\">{{ toast().message }}</span>\n            @if (toast().description; as description) {\n                <span rtElem=\"description\" qa-dataid=\"toast-description\">{{ description }}</span>\n            }\n        }\n        @if (progressValue() !== null) {\n            <rt-progress-bar rtElem=\"value\" qa-dataid=\"toast-progress-value\" [value]=\"progressValue() ?? 0\" [ariaLabel]=\"toast().message\" />\n        }\n        @if (toast().details; as details) {\n            <button\n                rtButton\n                rtElem=\"details-toggle\"\n                qa-dataid=\"toast-details-toggle\"\n                size=\"sm\"\n                theme=\"secondary\"\n                appearance=\"text\"\n                type=\"button\"\n                [attr.aria-expanded]=\"detailsOpen()\"\n                (click)=\"toggleDetails()\">\n                {{ detailsOpen() ? t().uiHide : t().uiDetails }}\n            </button>\n            @if (detailsOpen()) {\n                <rt-copy-value rtElem=\"details\" qa-dataid=\"toast-details\" wrap [value]=\"details\" />\n            }\n        }\n        @if (toast().action || toast().secondaryAction) {\n            <div rtElem=\"actions\">\n                @if (toast().action; as action) {\n                    <button rtButton rtElem=\"action\" qa-dataid=\"toast-action\" size=\"sm\" type=\"button\" (click)=\"onAction()\">\n                        {{ action.label }}\n                    </button>\n                }\n                @if (toast().secondaryAction; as secondaryAction) {\n                    <button\n                        rtButton\n                        rtElem=\"action\"\n                        qa-dataid=\"toast-secondary-action\"\n                        size=\"sm\"\n                        theme=\"secondary\"\n                        appearance=\"text\"\n                        type=\"button\"\n                        (click)=\"onSecondaryAction()\">\n                        {{ secondaryAction.label }}\n                    </button>\n                }\n            </div>\n        }\n    </div>\n    @if (!bare()) {\n        <rt-icon-button\n            rtElem=\"close\"\n            qa-dataid=\"toast-close\"\n            icon=\"ico-close\"\n            variant=\"ghost\"\n            size=\"sm\"\n            [ariaLabel]=\"t().uiClose\"\n            (clicked)=\"onClose()\" />\n    }\n    @if (showProgress()) {\n        <span rtElem=\"progress\" qa-dataid=\"toast-progress\" aria-hidden=\"true\"></span>\n    }\n</ng-container>\n","import {\n    ChangeDetectionStrategy,\n    Component,\n    HostBinding,\n    InputSignal,\n    InputSignalWithTransform,\n    Signal,\n    ViewEncapsulation,\n    WritableSignal,\n    booleanAttribute,\n    computed,\n    inject,\n    input,\n    linkedSignal,\n    numberAttribute,\n    signal,\n} from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\n\nimport { EMPTY, filter, map, merge, mergeMap, Observable } from 'rxjs';\n\nimport { rtKitLabel } from '@rt-tools/ui-kit-v2/core';\nimport { INotification, NotificationBus, NotificationRef } from '@rt-tools/ui-kit-v2/core';\n\nimport { RtToastComponent } from './rt-toast.component';\nimport { RT_TOASTER_GAP_PX, IRtToaster } from './rt-toaster.model';\n\nconst BEM_BLOCK: string = 'rt-toaster';\n\nconst DEFAULT_DURATION_MS: number = 4000;\n\nconst DEFAULT_VISIBLE_TOASTS: number = 3;\n\n/** Канал события без своего `channel` и тостера без входа: один тостер по-прежнему получает всё. */\nconst DEFAULT_CHANNEL: string = 'default';\n\n@Component({\n    selector: 'rt-toaster',\n    templateUrl: './rt-toaster.component.html',\n    styleUrl: './rt-toaster.component.scss',\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    encapsulation: ViewEncapsulation.None,\n    imports: [RtToastComponent],\n    host: {\n        class: BEM_BLOCK,\n        role: 'region',\n        '[attr.aria-label]': 'ariaLabel()',\n        '(mouseenter)': 'onStackEnter()',\n        '(mousemove)': 'onStackEnter()',\n        '(mouseleave)': 'onStackLeave()',\n        '(pointerdown)': 'onStackPointerDown()',\n        '(pointerup)': 'onStackPointerUp()',\n    },\n})\nexport class RtToasterComponent {\n    readonly #notificationBus: NotificationBus = inject(NotificationBus);\n\n    protected readonly ariaLabel: Signal<string> = rtKitLabel('uiNotifications');\n\n    #toastCounter: number = 0;\n\n    protected readonly toasts: WritableSignal<IRtToaster.Toast[]> = signal<IRtToaster.Toast[]>([]);\n\n    protected readonly heights: WritableSignal<IRtToaster.Height[]> = signal<IRtToaster.Height[]>([]);\n\n    protected readonly expanded: WritableSignal<boolean> = linkedSignal<IRtToaster.Toast[], boolean>({\n        source: this.toasts,\n        computation: (toasts: IRtToaster.Toast[]): boolean => toasts.length < 1,\n    });\n\n    protected readonly interacting: WritableSignal<boolean> = signal<boolean>(false);\n\n    protected readonly positionY: Signal<IRtToaster.PositionY> = computed((): IRtToaster.PositionY =>\n        this.position().startsWith('top') ? 'top' : 'bottom'\n    );\n\n    protected readonly positionX: Signal<IRtToaster.PositionX> = computed((): IRtToaster.PositionX => {\n        if (this.position().endsWith('left')) {\n            return 'left';\n        }\n        return this.position().endsWith('center') ? 'center' : 'right';\n    });\n\n    public readonly position: InputSignal<IRtToaster.Position> = input<IRtToaster.Position>('bottom-right');\n\n    public readonly duration: InputSignalWithTransform<number, number | string> = input<number, number | string>(DEFAULT_DURATION_MS, {\n        transform: numberAttribute,\n    });\n\n    public readonly visibleToasts: InputSignalWithTransform<number, number | string> = input<number, number | string>(\n        DEFAULT_VISIBLE_TOASTS,\n        { transform: numberAttribute }\n    );\n\n    /** `replace` — новый тост уводит прежние их же анимацией ухода, а не копится стопкой. */\n    public readonly mode: InputSignal<IRtToaster.Mode> = input<IRtToaster.Mode>('stack');\n\n    public readonly expand: InputSignalWithTransform<boolean, boolean | string> = input<boolean, boolean | string>(false, {\n        transform: booleanAttribute,\n    });\n\n    /**\n     * Канал тостера: он показывает только события с этим `channel`. Второй тостер со своим каналом\n     * держит закреплённые тосты в своём углу и своей стопке.\n     */\n    public readonly channel: InputSignal<string> = input<string>(DEFAULT_CHANNEL);\n\n    @HostBinding('class')\n    public get hostModifierClasses(): Record<string, boolean> {\n        return {\n            [`${BEM_BLOCK}--y--${this.positionY()}`]: true,\n            [`${BEM_BLOCK}--x--${this.positionX()}`]: true,\n        };\n    }\n\n    @HostBinding('style')\n    public get hostStackStyles(): Record<string, string> {\n        return {\n            '--front-toast-height': `${this.heights()[0]?.height ?? 0}px`,\n            '--gap': `${RT_TOASTER_GAP_PX}px`,\n        };\n    }\n\n    constructor() {\n        // Ручка тоста слушается до его ухода: `markClosed` завершает её потоки, и подписка уходит сама.\n        this.#notificationBus\n            .onEmit()\n            .pipe(\n                filter((event: INotification.Event): boolean => (event.payload.channel ?? DEFAULT_CHANNEL) === this.channel()),\n                map((event: INotification.Event): IRtToaster.Toast => this.#addToast(event)),\n                mergeMap((toast: IRtToaster.Toast): Observable<IRtToaster.Change> => this.#changesOf(toast)),\n                takeUntilDestroyed()\n            )\n            .subscribe((change: IRtToaster.Change): void => this.#applyChange(change));\n    }\n\n    protected onStackEnter(): void {\n        if (this.toasts().length > 0) {\n            this.expanded.set(true);\n        }\n    }\n\n    protected onStackLeave(): void {\n        if (!this.interacting()) {\n            this.expanded.set(false);\n        }\n    }\n\n    protected onStackPointerDown(): void {\n        this.interacting.set(true);\n    }\n\n    protected onStackPointerUp(): void {\n        this.interacting.set(false);\n    }\n\n    protected onHeightAdded(height: IRtToaster.Height): void {\n        this.heights.update((items: IRtToaster.Height[]): IRtToaster.Height[] =>\n            this.#sortHeights([height, ...items.filter((item: IRtToaster.Height): boolean => item.toastId !== height.toastId)])\n        );\n    }\n\n    protected onHeightRemoved(toastId: number): void {\n        this.heights.update((items: IRtToaster.Height[]): IRtToaster.Height[] =>\n            items.filter((item: IRtToaster.Height): boolean => item.toastId !== toastId)\n        );\n    }\n\n    protected onDismissed(toastId: number): void {\n        this.onHeightRemoved(toastId);\n        this.toasts.update((items: IRtToaster.Toast[]): IRtToaster.Toast[] =>\n            items.filter((item: IRtToaster.Toast): boolean => item.id !== toastId)\n        );\n    }\n\n    #addToast(event: INotification.Event): IRtToaster.Toast {\n        this.#toastCounter += 1;\n        const toast: IRtToaster.Toast = {\n            id: this.#toastCounter,\n            severity: event.payload.severity,\n            message: event.payload.message,\n            description: event.payload.description,\n            meta: event.payload.meta,\n            action: event.payload.action,\n            secondaryAction: event.payload.secondaryAction,\n            filled: event.payload.filled,\n            duration: event.payload.duration,\n            progress: event.payload.progress,\n            icon: event.payload.icon,\n            onDismiss: event.payload.onDismiss,\n            progressValue: event.payload.progressValue,\n            details: event.payload.details,\n            component: event.payload.component,\n            data: event.payload.data,\n            bare: event.payload.bare,\n            ref: event.ref instanceof NotificationRef ? event.ref : undefined,\n        };\n        this.toasts.update((items: IRtToaster.Toast[]): IRtToaster.Toast[] => [\n            toast,\n            ...(this.mode() === 'replace' ? items.map((item: IRtToaster.Toast): IRtToaster.Toast => this.#replaced(item)) : items),\n        ]);\n\n        return toast;\n    }\n\n    /** Изменения тоста от его ручки: обновление полей и просьба закрыть. Без ручки — ничего. */\n    #changesOf(toast: IRtToaster.Toast): Observable<IRtToaster.Change> {\n        const ref: NotificationRef | undefined = toast.ref;\n\n        if (ref === undefined) {\n            return EMPTY;\n        }\n\n        return merge(\n            ref.onUpdate().pipe(map((patch: INotification.Update): IRtToaster.Change => ({ toastId: toast.id, patch }))),\n            ref.onDismissRequest().pipe(map((): IRtToaster.Change => ({ toastId: toast.id, patch: { dismissRequested: true } })))\n        );\n    }\n\n    #applyChange(change: IRtToaster.Change): void {\n        this.toasts.update((items: IRtToaster.Toast[]): IRtToaster.Toast[] =>\n            items.map((item: IRtToaster.Toast): IRtToaster.Toast => (item.id === change.toastId ? { ...item, ...change.patch } : item))\n        );\n    }\n\n    #replaced(toast: IRtToaster.Toast): IRtToaster.Toast {\n        return toast.replaced ? toast : { ...toast, replaced: true };\n    }\n\n    #sortHeights(items: IRtToaster.Height[]): IRtToaster.Height[] {\n        const order: number[] = this.toasts().map((toast: IRtToaster.Toast): number => toast.id);\n        return [...items].sort(\n            (left: IRtToaster.Height, right: IRtToaster.Height): number => order.indexOf(left.toastId) - order.indexOf(right.toastId)\n        );\n    }\n}\n","@for (item of toasts(); track item.id) {\n    <rt-toast\n        qa-dataid=\"toast\"\n        [toast]=\"item\"\n        [index]=\"$index\"\n        [totalToasts]=\"toasts().length\"\n        [heights]=\"heights()\"\n        [expanded]=\"expanded()\"\n        [expandByDefault]=\"expand()\"\n        [interacting]=\"interacting()\"\n        [position]=\"position()\"\n        [visibleToasts]=\"visibleToasts()\"\n        [duration]=\"duration()\"\n        (heightAdded)=\"onHeightAdded($event)\"\n        (heightRemoved)=\"onHeightRemoved($event)\"\n        (dismissed)=\"onDismissed($event)\" />\n}\n"],"mappings":";;;;;;;;;;;;AAMA,MAAa,oBAA4B;AAMzC,MAAa,0BAAkG,IAAI,eAEjH,2BAA2B;CACzB,YAAY;CACZ,gBAAwE;EACpE,MAAM;EACN,SAAS;EACT,SAAS;EACT,QAAQ;CACX;AACJ,CAAA;AAGD,MAAa,gBAAyC,IAAI,eAAwB,eAAe;ACoBjG,MAAMA,cAAoB;AAE1B,MAAM,mBAA2B;AAwBjC,IAAa,mBAAb,MAAa,iBAAgB;CAChB;CAEA;CAMA;CAQA;CAEA;CAEA;CAEA;CAEA;CAEA;CAIA;CAQA;CAEA;CAIT;CAEA;CAEA;CAEA;CAEA;CA6EA,IACW,sBAAmB;EAC1B,OAAO;IACF,GAAGA,YAAS,cAAe,KAAK,MAAK,CAAE,CAAC,aAAa;IACrD,GAAGA,YAAS,YAAa,KAAK,MAAK,CAAE,CAAC,WAAW;IACjD,GAAGA,YAAS,UAAW,KAAK,KAAI;IAChC,GAAGA,YAAS,OAAQ,KAAK,WAAU,MAAO;IAC1C,GAAGA,YAAS,aAAc,KAAK,SAAQ;IACvC,GAAGA,YAAS,aAAc,KAAK,SAAQ;IACvC,GAAGA,YAAS,WAAY,KAAK,MAAK,MAAO;IACzC,GAAGA,YAAS,YAAa,KAAK,MAAK,IAAK,IAAI,KAAK,cAAa;IAC9D,GAAGA,YAAS,cAAe,KAAK,SAAQ,KAAO,KAAK,gBAAe,KAAM,KAAK,SAAQ;IACtF,GAAGA,YAAS,YAAa,KAAK,OAAM;EACxC;CACL;CAEA,IACW,kBAAe;EACtB,OAAO;GACH,WAAW,GAAG,KAAK,MAAK;GACxB,mBAAmB,GAAG,KAAK,MAAK;GAChC,aAAa,GAAG,KAAK,YAAW,IAAK,KAAK,MAAK;GAC/C,YAAY,GAAG,KAAK,SAAQ,IAAK,KAAK,oBAAmB,IAAK,KAAK,QAAO,EAAE;GAC5E,oBAAoB,KAAK,gBAAe,IAAK,SAAS,GAAG,KAAK,eAAc,EAAE;GAC9E,cAAc,GAAG,KAAK,SAAQ,KAAM,EAAC;EACxC;CACL;CAEA,cAAA;EA7JS,KAAA,QAAiC,OAAO,UAAU;EAElD,KAAA,YAAsB,OAAO,QAAQ;EAMrC,KAAA,mBAAkD,gBACzB;GAAE,MAAM,KAAK,MAAK,CAAE,CAAC;GAAM,KAAK,KAAK,MAAK,CAAE,CAAC;EAAG,IAAG;GAAA,GAAA,YAAA,EAAA,WAAA,mBAAA,+BAAA,CAAA;GAE7E,QAAQ,MAA6B,UACjC,KAAK,SAAS,MAAM,QAAQ,KAAK,QAAQ,MAAM;EAAG,CAAA;EAIrD,KAAA,iBAAyE,OAAO,uBAAuB;EAEvG,KAAA,WAAoC,OAAgB,OAAM,GAAA,YAAA,CAAA,EAAA,WAAA,WAAA,CAAA,+BAAA,CAAA,CAAA;EAE1D,KAAA,WAAoC,OAAgB,OAAM,GAAA,YAAA,CAAA,EAAA,WAAA,WAAA,CAAA,+BAAA,CAAA,CAAA;EAE1D,KAAA,sBAA8C,OAAe,GAAE,GAAA,YAAA,CAAA,EAAA,WAAA,sBAAA,CAAA,+BAAA,CAAA,CAAA;EAE/D,KAAA,iBAAyC,OAAe,GAAE,GAAA,YAAA,CAAA,EAAA,WAAA,iBAAA,CAAA,+BAAA,CAAA,CAAA;EAE1D,KAAA,eAA+B,eACpC,KAAK,QAAO,CAAE,CAAC,WAAW,SAAqC,KAAK,YAAY,KAAK,MAAK,CAAE,CAAC,EAAE,GAClG,GAAA,YAAA,CAAA,EAAA,WAAA,eAAA,CAAA,+BAAA,CAAA,CAAA;EAEQ,KAAA,gBAAgC,eACrC,KAAK,QAAO,CAAE,CAAC,QACV,OAAe,MAAyB,cACrC,aAAa,KAAK,aAAY,IAAK,QAAQ,QAAQ,KAAK,QAC5D,CAAC,GAER,GAAA,YAAA,CAAA,EAAA,WAAA,gBAAA,CAAA,+BAAA,CAAA,CAAA;EAEQ,KAAA,UAA0B,eAAuB,KAAK,MAAM,KAAK,aAAY,IAAA,KAAyB,KAAK,cAAa,CAAE,GAAE,GAAA,YAAA,CAAA,EAAA,WAAA,UAAA,CAAA,+BAAA,CAAA,CAAA;EAE5H,KAAA,aAA2C,eAChD,KAAK,SAAQ,CAAE,CAAC,WAAW,KAAK,IAAI,QAAQ,UAC/C,GAAA,YAAA,CAAA,EAAA,WAAA,aAAA,CAAA,+BAAA,CAAA,CAAA;EAMD,KAAA,mBAA2B;EAE3B,KAAA,uBAA+B;EAE/B,KAAA,sBAA8B;EAEX,KAAA,IAA4B,OAAO,aAAa;EAGhD,KAAA,OAAoC,eAAmC;GACtF,MAAM,OAAwC,KAAK,MAAK,CAAE,CAAC;GAC3D,OAAO,SAAS,SAAY,KAAK,eAAe,KAAK,MAAK,CAAE,CAAC,YAAY;EAC7E,GAAE,GAAA,YAAA,CAAA,EAAA,WAAA,OAAA,CAAA,+BAAA,CAAA,CAAA;EAGiB,KAAA,WAAkC,eAA6B;GAC9E,MAAM,WAAsC,KAAK,MAAK,CAAE,CAAC;GACzD,OAAO,aAAa,SAAY,KAAK,SAAQ,IAAK;EACtD,GAAE,GAAA,YAAA,CAAA,EAAA,WAAA,WAAA,CAAA,+BAAA,CAAA,CAAA;EAGiB,KAAA,oBAAsC,eAAwB;GAC7E,MAAM,SAAgC,KAAK,iBAAgB;GAE3D,OAAO,SAAS,OAAO;IACnB,WAAW,CACP;KAAE,SAAS;KAAe,UAAU,OAAO;IAAI,GAC/C;KAAE,SAAS;KAAiB,UAAU,OAAO,OAAO;IAAI,CAC3D;IACD,QAAQ,KAAK;GAChB,CAAA;EACL,GAAE,GAAA,YAAA,CAAA,EAAA,WAAA,oBAAA,CAAA,+BAAA,CAAA,CAAA;EAGiB,KAAA,gBAAuC,eAA8B,KAAK,MAAK,CAAE,CAAC,iBAAiB,MAAK,GAAA,YAAA,CAAA,EAAA,WAAA,gBAAA,CAAA,+BAAA,CAAA,CAAA;EAGxG,KAAA,cAAuC,OAAgB,OAAM,GAAA,YAAA,CAAA,EAAA,WAAA,cAAA,CAAA,+BAAA,CAAA,CAAA;EAG7D,KAAA,OAAwB,eAAwB,KAAK,MAAK,CAAE,CAAC,SAAS,MAAK,GAAA,YAAA,CAAA,EAAA,WAAA,OAAA,CAAA,+BAAA,CAAA,CAAA;EAE3E,KAAA,eAAgC,eAChC,CAAC,KAAK,KAAI,KAAM,KAAK,MAAK,CAAE,CAAC,aAAa,QAAQ,KAAK,SAAQ,MAAO,MACxF,GAAA,YAAA,CAAA,EAAA,WAAA,eAAA,CAAA,+BAAA,CAAA,CAAA;EAGkB,KAAA,SAA0B,eAAwB,KAAK,SAAQ,KAAM,KAAK,YAAW,GAAG,GAAA,YAAA,CAAA,EAAA,WAAA,SAAA,CAAA,+BAAA,CAAA,CAAA;EAE3F,KAAA,QAAuC,MAAM,SAA4B,GAAA,YAAA,CAAA,EAAA,WAAA,QAAA,CAAA,+BAAA,CAAA,CAAA;EAEzE,KAAA,QAA6B,MAAM,SAAkB,GAAA,YAAA,CAAA,EAAA,WAAA,QAAA,CAAA,+BAAA,CAAA,CAAA;EAErD,KAAA,cAAmC,MAAM,SAAkB,GAAA,YAAA,CAAA,EAAA,WAAA,cAAA,CAAA,+BAAA,CAAA,CAAA;EAE3D,KAAA,UAA4C,MAAM,SAA+B,GAAA,YAAA,CAAA,EAAA,WAAA,UAAA,CAAA,+BAAA,CAAA,CAAA;EAEjF,KAAA,WAA4D,MAAM,SAAQ;GAAA,GAAA,YAAA,EAAA,WAAA,WAAA,+BAAA,CAAA;GACtF,WAAW;EAAgB,CAAA;EAGf,KAAA,kBAAmE,MAA6B,OAAK;GAAA,GAAA,YAAA,EAAA,WAAA,kBAAA,+BAAA,CAAA;GACjH,WAAW;EAAgB,CAAA;EAGf,KAAA,cAA+D,MAA6B,OAAK;GAAA,GAAA,YAAA,EAAA,WAAA,cAAA,+BAAA,CAAA;GAC7G,WAAW;EAAgB,CAAA;EAGf,KAAA,WAA6C,MAA2B,gBAAe,GAAA,YAAA,CAAA,EAAA,WAAA,WAAA,CAAA,+BAAA,CAAA,CAAA;EAEvF,KAAA,gBAAqC,MAAc,GAAE,GAAA,YAAA,CAAA,EAAA,WAAA,gBAAA,CAAA,+BAAA,CAAA,CAAA;EAErD,KAAA,WAAgC,MAAc,KAAK,GAAA,YAAA,CAAA,EAAA,WAAA,WAAA,CAAA,+BAAA,CAAA,CAAA;EAEnD,KAAA,cAAmD,OAAM;EAEzD,KAAA,gBAA0C,OAAM;EAEhD,KAAA,YAAsC,OAAM;EA+BxD,QAAQ,cAAkD;GACtD,IAAI,CAAC,KAAK,SAAQ,KAAM,KAAK,SAAQ,KAAM,KAAK,SAAQ,MAAO,MAC3D;GAGJ,IAAI,KAAK,OAAM,GACX,KAAK,YAAW;QAEhB,KAAK,YAAW;GAGpB,gBAAsB,aAAa,KAAK,UAAU,CAAC;EACvD,CAAC;EAGD,aAAkB;GACd,IAAI,KAAK,SAAQ,KAAM,KAAK,MAAK,CAAE,CAAC,aAAa,MAC7C,KAAK,aAAa,UAAU;EAEpC,CAAC;EAGD,aAAkB;GACd,IAAI,KAAK,SAAQ,KAAM,KAAK,MAAK,CAAE,CAAC,qBAAqB,MACrD,KAAK,aAAa,SAAS;EAEnC,CAAC;EAGD,aAAkB;GACd,MAAM,QAA0B,KAAK,MAAK;GAC1C,KAAK,YAAW;GAChB,IAAI,CAAC,KAAK,SAAQ,KAAM,MAAM,aAAa,MACvC;GAEJ,sBAA4B,KAAK,WAAU,GAAI,EAAE,UAAU,KAAK,UAAS,CAAE;EAC/E,CAAC;CACL;CAEO,kBAAe;EAClB,KAAK,mBAAmB,KAAK,SAAQ,KAAM;EAE3C,MAAM,SAAiB,KAAK,MAAM,cAAc,sBAAqB,CAAE,CAAC;EACxE,KAAK,eAAe,IAAI,MAAM;EAC9B,KAAK,YAAY,KAAK;GAAE,SAAS,KAAK,MAAK,CAAE,CAAC;GAAI;EAAM,CAAE;EAE1D,KAAK,SAAS,IAAI,IAAI;CAC1B;CAEO,cAAW;EACd,aAAa,KAAK,UAAU;EAC5B,aAAa,KAAK,iBAAiB;EAGnC,KAAK,MAAK,CAAE,CAAC,KAAK,WAAW,WAAW;CAC5C;CAEU,WAAQ;EACd,KAAK,MAAK,CAAE,CAAC,QAAQ,QAAO;EAC5B,KAAK,aAAa,IAAI;CAC1B;CAEU,oBAAiB;EACvB,KAAK,MAAK,CAAE,CAAC,iBAAiB,QAAO;EACrC,KAAK,aAAa,IAAI;CAC1B;CAEU,UAAO;EACb,KAAK,aAAa,OAAO;CAC7B;CAEU,gBAAa;EACnB,KAAK,YAAY,QAAQ,SAA2B,CAAC,IAAI;CAC7D;CAMA,aAAa,QAAwC;EACjD,IAAI,KAAK,SAAQ,GACb;EAGJ,KAAK,SAAS,IAAI,IAAI;EAEtB,IAAI,WAAW,QAAQ,WAAW,YAAY,WAAW,aAAa,WAAW,aAC7E,KAAK,MAAK,CAAE,CAAC,YAAY,MAAM;EAGnC,KAAK,MAAK,CAAE,CAAC,KAAK,WAAW,UAAU,QAAQ;EAE/C,KAAK,oBAAoB,IAAI,KAAK,QAAO,CAAE;EAC3C,KAAK,cAAc,KAAK,KAAK,MAAK,CAAE,CAAC,EAAE;EAEvC,KAAK,oBAAoB,iBAAuB,KAAK,UAAU,KAAK,KAAK,MAAK,CAAE,CAAC,EAAE,GAAG,gBAAgB;CAC1G;CAGA,aAAU;EACN,IAAI,KAAK,SAAQ,GACb;EAGJ,MAAM,OAAoB,KAAK,MAAM;EACrC,KAAK,MAAM,SAAS;EACpB,MAAM,SAAiB,KAAK;EAC5B,KAAK,MAAM,SAAS;EAEpB,IAAI,WAAW,KAAK,eAAc,GAAI;GAClC,KAAK,eAAe,IAAI,MAAM;GAC9B,KAAK,YAAY,KAAK;IAAE,SAAS,KAAK,MAAK,CAAE,CAAC;IAAI;GAAM,CAAE;EAC9D;CACJ;CAEA,cAAW;EACP,KAAK,uBAAuB,KAAK,IAAG;EACpC,KAAK,aAAa,iBAAuB,KAAK,aAAa,SAAS,GAAG,KAAK,gBAAgB;CAChG;CAEA,cAAW;EACP,IAAI,KAAK,sBAAsB,KAAK,sBAAsB;GACtD,MAAM,YAAoB,KAAK,IAAG,IAAK,KAAK;GAC5C,KAAK,mBAAmB,KAAK,mBAAmB;EACpD;EAEA,KAAK,sBAAsB,KAAK,IAAG;CACvC;CA9RS;EAAA,KAAA,OAAA,GAAA,mBAAA;GAAA,YAAA;GAAA,SAAA;GAAA,UAAA;GAAA,MAAA;GAAgB,MAAA,CAAA;GAAA,QAAA,GAAA,gBAAA;EAAA,CAAA;CAAA;CAAhB;EAAA,KAAA,OAAA,GAAA,qBAAA;GAAA,YAAA;GAAA,SAAA;GAAA,MAAA;GAAgB,cAAA;GAAA,UAAA;GAAA,QAAA;IAAA,OAAA;KAAA,mBAAA;KAAA,YAAA;KAAA,UAAA;KAAA,YAAA;KAAA,mBAAA;IAAA;IAAA,OAAA;KAAA,mBAAA;KAAA,YAAA;KAAA,UAAA;KAAA,YAAA;KAAA,mBAAA;IAAA;IAAA,aAAA;KAAA,mBAAA;KAAA,YAAA;KAAA,UAAA;KAAA,YAAA;KAAA,mBAAA;IAAA;IAAA,SAAA;KAAA,mBAAA;KAAA,YAAA;KAAA,UAAA;KAAA,YAAA;KAAA,mBAAA;IAAA;IAAA,UAAA;KAAA,mBAAA;KAAA,YAAA;KAAA,UAAA;KAAA,YAAA;KAAA,mBAAA;IAAA;IAAA,iBAAA;KAAA,mBAAA;KAAA,YAAA;KAAA,UAAA;KAAA,YAAA;KAAA,mBAAA;IAAA;IAAA,aAAA;KAAA,mBAAA;KAAA,YAAA;KAAA,UAAA;KAAA,YAAA;KAAA,mBAAA;IAAA;IAAA,UAAA;KAAA,mBAAA;KAAA,YAAA;KAAA,UAAA;KAAA,YAAA;KAAA,mBAAA;IAAA;IAAA,eAAA;KAAA,mBAAA;KAAA,YAAA;KAAA,UAAA;KAAA,YAAA;KAAA,mBAAA;IAAA;IAAA,UAAA;KAAA,mBAAA;KAAA,YAAA;KAAA,UAAA;KAAA,YAAA;KAAA,mBAAA;IAAA;GAAA;GAAA,SAAA;IAAA,aAAA;IAAA,eAAA;IAAA,WAAA;GAAA;GAAA,MAAA;IAAA,YAAA;KAAA,QAAA;KAAA,eAAA;IAAA;IAAA,YAAA;KAAA,SAAA;KAAA,SAAA;IAAA;IAAA,gBAAA;GAAA;GAAA,UAAA;GAAA,UCvE7B;GA+EA,QAAA,CAAA,yoMAAA;GAAA,cAAA;IAAA;KAAA,MAAA;KAAA,MDvBQ;KAAiB,UAAA;KAAA,QAAA;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;KAAA;KAAA,UAAA,CAAA,mBAAA;IAAA;IAAA;KAAA,MAAA;KAAA,MACjB;KAAiB,UAAA;KAAA,QAAA;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;KAAA;IAAA;IAAA;KAAA,MAAA;KAAA,MACjB;KAAoB,UAAA;KAAA,QAAA;MAAA;MAAA;MAAA;MAAA;KAAA;KAAA,SAAA,CAAA,aAAA;IAAA;IAAA;KAAA,MAAA;KAAA,MACpB;KAAe,UAAA;KAAA,QAAA;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;KAAA;IAAA;IAAA;KAAA,MAAA;KAAA,MACf;KAAqB,UAAA;KAAA,QAAA;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;KAAA;KAAA,SAAA,CAAA,SAAA;IAAA;IAAA;KAAA,MAAA;KAAA,MACrB;KAAsB,UAAA;KAAA,QAAA;MAAA;MAAA;MAAA;MAAA;KAAA;IAAA;IAAA;KAAA,MAAA;KAAA,MACtB;KAAc,UAAA;KAAA,QAAA,CAAA,OAAA;IAAA;IAAA;KAAA,MAAA;KAAA,MACd;KAAa,UAAA;KAAA,QAAA,CAAA,OAAA;IAAA;GAAA;GAAA,iBAAA,GAAA,wBAAA;GAAA,eAAA,GAAA,kBAAA;EAAA,CAAA;CAAA;;AAQR,GAAA,yBAAA;CAAA,YAAA;CAAA,SAAA;CAAA,UAAA;CAAA,MAAA;CAAgB,YAAA,CAAA;EAtB5B,MAAA;EACa,MAAA,CAAA;GAAA,UAAA;GAAU,iBAGH,wBAAwB;GAAM,eAChC,kBAAkB;GAAI,SAC5B;IACL;IACA;IACA;IACA;IACA;IACA;IACA;IACA;GACH;GAAA,MACK;IACF,OAAOA;IACP,MAAM;IACN,eAAe;GAClB;GAAA,UAAA;GAAA,QAAA,CAAA,yoMAAA;EAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoIA,MAAA;GAAY,MAAA,CAAA,OAAO;;;GAgBnB,MAAA;GAAY,MAAA,CAAA,OAAO;;;;AE9LxB,MAAM,YAAoB;AAE1B,MAAM,sBAA8B;AAEpC,MAAM,yBAAiC;AAGvC,MAAM,kBAA0B;AAoBhC,IAAa,qBAAb,MAAa,mBAAkB;CAClB;CAIT;CAgDA,IACW,sBAAmB;EAC1B,OAAO;IACF,GAAG,UAAS,OAAQ,KAAK,UAAS,MAAO;IACzC,GAAG,UAAS,OAAQ,KAAK,UAAS,MAAO;EAC7C;CACL;CAEA,IACW,kBAAe;EACtB,OAAO;GACH,wBAAwB,GAAG,KAAK,QAAO,CAAE,CAAC,EAAE,EAAE,UAAU,EAAC;GACzD,SAAS;EACZ;CACL;CAEA,cAAA;EApES,KAAA,mBAAoC,OAAO,eAAe;EAEhD,KAAA,YAA4B,WAAW,iBAAiB;EAE3E,KAAA,gBAAwB;EAEL,KAAA,SAA6C,OAA2B,CAAA,GAAG,GAAA,YAAA,CAAA,EAAA,WAAA,SAAA,CAAA,+BAAA,CAAA,CAAA;EAE3E,KAAA,UAA+C,OAA4B,CAAA,GAAG,GAAA,YAAA,CAAA,EAAA,WAAA,UAAA,CAAA,+BAAA,CAAA,CAAA;EAE9E,KAAA,WAAoC,aAAY;GAAA,GAAA,YAAA,EAAA,WAAA,WAAA,+BAAA,CAAA;GAC/D,QAAQ,KAAK;GACb,cAAc,WAAwC,OAAO,SAAS;EAAC,CAAA;EAGxD,KAAA,cAAuC,OAAgB,OAAM,GAAA,YAAA,CAAA,EAAA,WAAA,cAAA,CAAA,+BAAA,CAAA,CAAA;EAE7D,KAAA,YAA0C,eACzD,KAAK,SAAQ,CAAE,CAAC,WAAW,KAAK,IAAI,QAAQ,UAC/C,GAAA,YAAA,CAAA,EAAA,WAAA,YAAA,CAAA,+BAAA,CAAA,CAAA;EAEkB,KAAA,YAA0C,eAAoC;GAC7F,IAAI,KAAK,SAAQ,CAAE,CAAC,SAAS,MAAM,GAC/B,OAAO;GAEX,OAAO,KAAK,SAAQ,CAAE,CAAC,SAAS,QAAQ,IAAI,WAAW;EAC3D,GAAE,GAAA,YAAA,CAAA,EAAA,WAAA,YAAA,CAAA,+BAAA,CAAA,CAAA;EAEc,KAAA,WAA6C,MAA2B,gBAAe,GAAA,YAAA,CAAA,EAAA,WAAA,WAAA,CAAA,+BAAA,CAAA,CAAA;EAEvF,KAAA,WAA8D,MAA+B,qBAAmB;GAAA,GAAA,YAAA,EAAA,WAAA,WAAA,+BAAA,CAAA;GAC5H,WAAW;EAAe,CAAA;EAGd,KAAA,gBAAmE,MAC/E,wBAAsB;GAAA,GAAA,YAAA,EAAA,WAAA,gBAAA,+BAAA,CAAA;GACpB,WAAW;EAAe,CAAA;EAIhB,KAAA,OAAqC,MAAuB,SAAQ,GAAA,YAAA,CAAA,EAAA,WAAA,OAAA,CAAA,+BAAA,CAAA,CAAA;EAEpE,KAAA,SAA8D,MAAiC,OAAK;GAAA,GAAA,YAAA,EAAA,WAAA,SAAA,+BAAA,CAAA;GAChH,WAAW;EAAgB,CAAA;EAOf,KAAA,UAA+B,MAAc,iBAAgB,GAAA,YAAA,CAAA,EAAA,WAAA,UAAA,CAAA,+BAAA,CAAA,CAAA;EAoBzE,KAAK,iBACA,OAAM,CAAE,CACR,KACG,QAAQ,WAAyC,MAAM,QAAQ,WAAW,qBAAqB,KAAK,QAAO,CAAE,GAC7G,KAAK,UAAiD,KAAK,UAAU,KAAK,CAAC,GAC3E,UAAU,UAA2D,KAAK,WAAW,KAAK,CAAC,GAC3F,mBAAkB,CAAE,CACvB,CACA,WAAW,WAAoC,KAAK,aAAa,MAAM,CAAC;CACjF;CAEU,eAAY;EAClB,IAAI,KAAK,OAAM,CAAE,CAAC,SAAS,GACvB,KAAK,SAAS,IAAI,IAAI;CAE9B;CAEU,eAAY;EAClB,IAAI,CAAC,KAAK,YAAW,GACjB,KAAK,SAAS,IAAI,KAAK;CAE/B;CAEU,qBAAkB;EACxB,KAAK,YAAY,IAAI,IAAI;CAC7B;CAEU,mBAAgB;EACtB,KAAK,YAAY,IAAI,KAAK;CAC9B;CAEU,cAAc,QAAyB;EAC7C,KAAK,QAAQ,QAAQ,UACjB,KAAK,aAAa,CAAC,QAAQ,GAAG,MAAM,QAAQ,SAAqC,KAAK,YAAY,OAAO,OAAO,CAAC,CAAC,CAAC;CAE3H;CAEU,gBAAgB,SAAe;EACrC,KAAK,QAAQ,QAAQ,UACjB,MAAM,QAAQ,SAAqC,KAAK,YAAY,OAAO,CAAC;CAEpF;CAEU,YAAY,SAAe;EACjC,KAAK,gBAAgB,OAAO;EAC5B,KAAK,OAAO,QAAQ,UAChB,MAAM,QAAQ,SAAoC,KAAK,OAAO,OAAO,CAAC;CAE9E;CAEA,UAAU,OAA0B;EAChC,KAAK,iBAAiB;EACtB,MAAM,QAA0B;GAC5B,IAAI,KAAK;GACT,UAAU,MAAM,QAAQ;GACxB,SAAS,MAAM,QAAQ;GACvB,aAAa,MAAM,QAAQ;GAC3B,MAAM,MAAM,QAAQ;GACpB,QAAQ,MAAM,QAAQ;GACtB,iBAAiB,MAAM,QAAQ;GAC/B,QAAQ,MAAM,QAAQ;GACtB,UAAU,MAAM,QAAQ;GACxB,UAAU,MAAM,QAAQ;GACxB,MAAM,MAAM,QAAQ;GACpB,WAAW,MAAM,QAAQ;GACzB,eAAe,MAAM,QAAQ;GAC7B,SAAS,MAAM,QAAQ;GACvB,WAAW,MAAM,QAAQ;GACzB,MAAM,MAAM,QAAQ;GACpB,MAAM,MAAM,QAAQ;GACpB,KAAK,MAAM,eAAe,kBAAkB,MAAM,MAAM;EAC3D;EACD,KAAK,OAAO,QAAQ,UAAkD,CAClE,OACA,GAAI,KAAK,KAAI,MAAO,YAAY,MAAM,KAAK,SAA6C,KAAK,UAAU,IAAI,CAAC,IAAI,KACnH,CAAA;EAED,OAAO;CACX;CAGA,WAAW,OAAuB;EAC9B,MAAM,MAAmC,MAAM;EAE/C,IAAI,QAAQ,QACR,OAAO;EAGX,OAAO,MACH,IAAI,SAAQ,CAAE,CAAC,KAAK,KAAK,WAAoD;GAAE,SAAS,MAAM;GAAI;EAAK,EAAG,CAAC,GAC3G,IAAI,iBAAgB,CAAE,CAAC,KAAK,WAA8B;GAAE,SAAS,MAAM;GAAI,OAAO,EAAE,kBAAkB,KAAI;EAAE,EAAG,CAAC,CAAC;CAE7H;CAEA,aAAa,QAAyB;EAClC,KAAK,OAAO,QAAQ,UAChB,MAAM,KAAK,SAA8C,KAAK,OAAO,OAAO,UAAU;GAAE,GAAG;GAAM,GAAG,OAAO;EAAK,IAAK,IAAK,CAAC;CAEnI;CAEA,UAAU,OAAuB;EAC7B,OAAO,MAAM,WAAW,QAAQ;GAAE,GAAG;GAAO,UAAU;EAAI;CAC9D;CAEA,aAAa,OAA0B;EACnC,MAAM,QAAkB,KAAK,OAAM,CAAE,CAAC,KAAK,UAAoC,MAAM,EAAE;EACvF,OAAO,CAAC,GAAG,KAAK,CAAC,CAAC,MACb,MAAyB,UAAqC,MAAM,QAAQ,KAAK,OAAO,IAAI,MAAM,QAAQ,MAAM,OAAO,CAAC;CAEjI;CApLS;EAAA,KAAA,OAAA,GAAA,mBAAA;GAAA,YAAA;GAAA,SAAA;GAAA,UAAA;GAAA,MAAA;GAAkB,MAAA,CAAA;GAAA,QAAA,GAAA,gBAAA;EAAA,CAAA;CAAA;CAAlB;EAAA,KAAA,OAAA,GAAA,qBAAA;GAAA,YAAA;GAAA,SAAA;GAAA,MAAA;GAAkB,cAAA;GAAA,UAAA;GAAA,QAAA;IAAA,UAAA;KAAA,mBAAA;KAAA,YAAA;KAAA,UAAA;KAAA,YAAA;KAAA,mBAAA;IAAA;IAAA,UAAA;KAAA,mBAAA;KAAA,YAAA;KAAA,UAAA;KAAA,YAAA;KAAA,mBAAA;IAAA;IAAA,eAAA;KAAA,mBAAA;KAAA,YAAA;KAAA,UAAA;KAAA,YAAA;KAAA,mBAAA;IAAA;IAAA,MAAA;KAAA,mBAAA;KAAA,YAAA;KAAA,UAAA;KAAA,YAAA;KAAA,mBAAA;IAAA;IAAA,QAAA;KAAA,mBAAA;KAAA,YAAA;KAAA,UAAA;KAAA,YAAA;KAAA,mBAAA;IAAA;IAAA,SAAA;KAAA,mBAAA;KAAA,YAAA;KAAA,UAAA;KAAA,YAAA;KAAA,mBAAA;IAAA;GAAA;GAAA,MAAA;IAAA,YAAA,EAAA,QAAA,SAAA;IAAA,WAAA;KAAA,cAAA;KAAA,aAAA;KAAA,cAAA;KAAA,eAAA;KAAA,aAAA;IAAA;IAAA,YAAA;KAAA,mBAAA;KAAA,SAAA;KAAA,SAAA;IAAA;IAAA,gBAAA;GAAA;GAAA,UAAA;GAAA,UCtD/B;GAiBA,QAAA,CAAA,myBAAA;GAAA,cAAA,CAAA;IAAA,MAAA;IAAA,MDyBc;IAAgB,UAAA;IAAA,QAAA;KAAA;KAAA;KAAA;KAAA;KAAA;KAAA;KAAA;KAAA;KAAA;KAAA;IAAA;IAAA,SAAA;KAAA;KAAA;KAAA;IAAA;GAAA,CAAA;GAAA,iBAAA,GAAA,wBAAA;GAAA,eAAA,GAAA,kBAAA;EAAA,CAAA;CAAA;;AAYjB,GAAA,yBAAA;CAAA,YAAA;CAAA,SAAA;CAAA,UAAA;CAAA,MAAA;CAAkB,YAAA,CAAA;EAlB9B,MAAA;EACa,MAAA,CAAA;GAAA,UAAA;GAAY,iBAGL,wBAAwB;GAAM,eAChC,kBAAkB;GAAI,SAC5B,CAAC,gBAAgB;GAAC,MACrB;IACF,OAAO;IACP,MAAM;IACN,qBAAqB;IACrB,gBAAgB;IAChB,eAAe;IACf,gBAAgB;IAChB,iBAAiB;IACjB,eAAe;GAClB;GAAA,UAAA;GAAA,QAAA,CAAA,myBAAA;EAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuDA,MAAA;GAAY,MAAA,CAAA,OAAO;;;GAQnB,MAAA;GAAY,MAAA,CAAA,OAAO"}

package/fesm2022/rt-tools-ui-kit-v2-toggle-button-group.mjs

@@ -1,29 +1,93 @@
+import { NgTemplateOutlet } from "@angular/common";
 import * as i0 from "@angular/core";
-import { ChangeDetectionStrategy, Component, ViewEncapsulation, booleanAttribute, computed, input, output } from "@angular/core";
+import { ChangeDetectionStrategy, Component, Directive, TemplateRef, ViewEncapsulation, booleanAttribute, computed, contentChild, forwardRef, inject, input, output, signal } from "@angular/core";
+import { NG_VALUE_ACCESSOR } from "@angular/forms";
 import { BlockDirective, ElemDirective, ModDirective } from "@rt-tools/core";
 import { RtIconComponent } from "@rt-tools/ui-kit-v2/icon";
 import * as i1 from "@rt-tools/ui-kit-v2/radius";
 import { RtRadiusDirective } from "@rt-tools/ui-kit-v2/radius";
 import { RtTooltipDirective } from "@rt-tools/ui-kit-v2/tooltip";
+var RtToggleButtonOptionDirective = class RtToggleButtonOptionDirective {
+	constructor() {
+		this.templateRef = inject(TemplateRef);
+	}
+	static {
+		this.ɵfac = i0.ɵɵngDeclareFactory({
+			minVersion: "12.0.0",
+			version: "22.2.2",
+			ngImport: i0,
+			type: RtToggleButtonOptionDirective,
+			deps: [],
+			target: i0.ɵɵFactoryTarget.Directive
+		});
+	}
+	static {
+		this.ɵdir = i0.ɵɵngDeclareDirective({
+			minVersion: "14.0.0",
+			version: "22.2.2",
+			type: RtToggleButtonOptionDirective,
+			isStandalone: true,
+			selector: "[rtToggleButtonOption]",
+			ngImport: i0
+		});
+	}
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.2",
+	ngImport: i0,
+	type: RtToggleButtonOptionDirective,
+	decorators: [{
+		type: Directive,
+		args: [{ selector: "[rtToggleButtonOption]" }]
+	}]
+});
 const BEM_BLOCK = "rt-toggle-button-group";
 const ICON_SIZE_BY_SIZE = Object.freeze({
 	sm: "xs",
 	md: "sm",
 	lg: "sm"
 });
+function isMany(value) {
+	return Array.isArray(value);
+}
 var RtToggleButtonGroupComponent = class RtToggleButtonGroupComponent {
 	constructor() {
+		this.#onChange = () => void 0;
+		this.#onTouched = () => void 0;
+		this.#bound = false;
+		this.#formValue = signal(void 0, ...ngDevMode ? [{ debugName: "#formValue" }] : /* istanbul ignore next */ []);
+		this.#disabledByForm = signal(false, ...ngDevMode ? [{ debugName: "#disabledByForm" }] : /* istanbul ignore next */ []);
+		this.#single = computed(() => {
+			const written = this.#formValue();
+			if (written === void 0) return this.value();
+			return isMany(written.value) ? void 0 : written.value ?? void 0;
+		}, ...ngDevMode ? [{ debugName: "#single" }] : /* istanbul ignore next */ []);
+		this.#many = computed(() => {
+			const written = this.#formValue();
+			if (written === void 0) return this.values();
+			return isMany(written.value) ? written.value : [];
+		}, ...ngDevMode ? [{ debugName: "#many" }] : /* istanbul ignore next */ []);
+		this.isDisabled = computed(() => this.disabled() || this.#disabledByForm(), ...ngDevMode ? [{ debugName: "isDisabled" }] : /* istanbul ignore next */ []);
+		this.optionTpl = contentChild(RtToggleButtonOptionDirective, ...ngDevMode ? [{ debugName: "optionTpl" }] : /* istanbul ignore next */ []);
 		this.iconSize = computed(() => ICON_SIZE_BY_SIZE[this.size()], ...ngDevMode ? [{ debugName: "iconSize" }] : /* istanbul ignore next */ []);
 		this.items = computed(() => {
 			const multiple = this.multiple();
-			const chosen = this.values();
-			const single = this.value();
-			const groupDisabled = this.disabled();
-			return this.options().map((option) => ({
-				option,
-				active: multiple ? chosen.includes(option.value) : single === option.value,
-				disabled: groupDisabled || !!option.disabled
-			}));
+			const chosen = this.#many();
+			const single = this.#single();
+			const groupDisabled = this.isDisabled();
+			return this.options().map((option) => {
+				const active = multiple ? chosen.includes(option.value) : single === option.value;
+				return {
+					option,
+					active,
+					disabled: groupDisabled || !!option.disabled,
+					context: {
+						$implicit: option,
+						active
+					}
+				};
+			});
 		}, ...ngDevMode ? [{ debugName: "items" }] : /* istanbul ignore next */ []);
 		this.options = input.required(...ngDevMode ? [{ debugName: "options" }] : /* istanbul ignore next */ []);
 		this.value = input(void 0, ...ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []);
@@ -42,20 +106,54 @@ var RtToggleButtonGroupComponent = class RtToggleButtonGroupComponent {
 			...ngDevMode ? { debugName: "fullWidth" } : /* istanbul ignore next */ {},
 			transform: booleanAttribute
 		});
+		this.layout = input("row", ...ngDevMode ? [{ debugName: "layout" }] : /* istanbul ignore next */ []);
+		this.appearance = input("segmented", ...ngDevMode ? [{ debugName: "appearance" }] : /* istanbul ignore next */ []);
+		this.checkmark = input(false, {
+			...ngDevMode ? { debugName: "checkmark" } : /* istanbul ignore next */ {},
+			transform: booleanAttribute
+		});
 		this.valueChange = output();
 		this.valuesChange = output();
 	}
+	#onChange;
+	#onTouched;
+	#bound;
+	#formValue;
+	#disabledByForm;
+	#single;
+	#many;
+	writeValue(value) {
+		this.#formValue.set({ value });
+	}
+	registerOnChange(fn) {
+		this.#bound = true;
+		this.#onChange = fn;
+	}
+	registerOnTouched(fn) {
+		this.#onTouched = fn;
+	}
+	setDisabledState(disabled) {
+		this.#disabledByForm.set(disabled);
+	}
 	onOptionClick(item) {
 		if (item.disabled) return;
 		const option = item.option;
 		if (!this.multiple()) {
+			this.#commit(option.value);
 			this.valueChange.emit(option.value);
 			return;
 		}
-		const chosen = this.values();
+		const chosen = this.#many();
 		const next = chosen.includes(option.value) ? chosen.filter((one) => one !== option.value) : [...chosen, option.value];
+		this.#commit(next);
 		this.valuesChange.emit(next);
 	}
+	#commit(value) {
+		if (!this.#bound) return;
+		this.#formValue.set({ value });
+		this.#onChange(value);
+		this.#onTouched();
+	}
 	static {
 		this.ɵfac = i0.ɵɵngDeclareFactory({
 			minVersion: "12.0.0",
@@ -129,6 +227,27 @@ var RtToggleButtonGroupComponent = class RtToggleButtonGroupComponent {
 					isSignal: true,
 					isRequired: false,
 					transformFunction: null
+				},
+				layout: {
+					classPropertyName: "layout",
+					publicName: "layout",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
+				appearance: {
+					classPropertyName: "appearance",
+					publicName: "appearance",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
+				checkmark: {
+					classPropertyName: "checkmark",
+					publicName: "checkmark",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
 				}
 			},
 			outputs: {
@@ -138,19 +257,44 @@ var RtToggleButtonGroupComponent = class RtToggleButtonGroupComponent {
 			host: {
 				properties: {
 					"class.rt-toggle-button-group--full-width": "fullWidth()",
+					"class.rt-toggle-button-group--wrap": "layout() === 'wrap'",
+					"class.rt-toggle-button-group--column": "layout() === 'column'",
 					"class.rt-toggle-button-group--md": "size() === 'md'",
-					"class.rt-toggle-button-group--lg": "size() === 'lg'"
+					"class.rt-toggle-button-group--lg": "size() === 'lg'",
+					"class.rt-toggle-button-group--chips": "appearance() === 'chips'"
 				},
 				classAttribute: "rt-toggle-button-group"
 			},
+			providers: [{
+				provide: NG_VALUE_ACCESSOR,
+				useExisting: forwardRef(() => RtToggleButtonGroupComponent),
+				multi: true
+			}],
+			queries: [{
+				propertyName: "optionTpl",
+				first: true,
+				predicate: RtToggleButtonOptionDirective,
+				descendants: true,
+				isSignal: true
+			}],
 			hostDirectives: [{
 				directive: i1.RtRadiusDirective,
 				inputs: ["radius", "radius"]
 			}],
 			ngImport: i0,
-			template: "<div\n    rtBlock=\"rt-toggle-button-group\"\n    role=\"group\"\n    [rtMod]=\"{\n        sm: size() === 'sm',\n        md: size() === 'md',\n        lg: size() === 'lg',\n        disabled: disabled(),\n    }\"\n    [attr.aria-label]=\"ariaLabel()\">\n    @for (item of items(); track item.option.value) {\n        <button\n            type=\"button\"\n            rtElem=\"button\"\n            qa-dataid=\"toggle-button-group-option\"\n            [attr.data-value]=\"item.option.value\"\n            [rtMod]=\"{\n                active: item.active,\n                first: $first,\n                last: $last,\n            }\"\n            [disabled]=\"item.disabled\"\n            [attr.aria-pressed]=\"item.active ? 'true' : 'false'\"\n            [rtTooltip]=\"item.option.title ?? ''\"\n            (click)=\"onOptionClick(item)\">\n            @if (item.option.icon || item.option.glyph) {\n                <rt-icon\n                    rtElem=\"icon\"\n                    color=\"current\"\n                    [name]=\"item.option.icon ?? null\"\n                    [glyph]=\"item.option.glyph ?? null\"\n                    [size]=\"iconSize()\" />\n            }\n            <span rtElem=\"label\">{{ item.option.label }}</span>\n        </button>\n    }\n</div>\n",
-			styles: ["@charset \"UTF-8\";@layer rt-kit.components{rt-toggle-button-group{--rt-toggle-button-group-track-bg: var(--rt-color-bg-surface-subtle);--rt-toggle-button-group-active-bg: var(--rt-color-bg-surface);--rt-toggle-button-group-height: 30px;--rt-toggle-button-group-transition-duration: var(--rt-duration-fast);--rt-toggle-button-group-focus-shadow: var(--rt-shadow-focus-ring);--rt-toggle-button-group-track-padding: 4px;--rt-toggle-button-group-track-radius: var(--rt-radius-md);--rt-toggle-button-group-btn-padding: 0 8px;--rt-toggle-button-group-btn-radius: var(--rt-radius-ms);--rt-toggle-button-group-btn-gap: 4px;--rt-toggle-button-group-btn-font-size: 12px;--rt-toggle-button-group-btn-line-height: 14px;display:inline-flex}rt-toggle-button-group.rt-toggle-button-group--md{--rt-toggle-button-group-height: 40px;--rt-toggle-button-group-btn-padding: 0 14px;--rt-toggle-button-group-btn-gap: 6px;--rt-toggle-button-group-btn-font-size: 14px;--rt-toggle-button-group-btn-line-height: 16px}rt-toggle-button-group.rt-toggle-button-group--lg{--rt-toggle-button-group-height: 50px;--rt-toggle-button-group-btn-padding: 0 20px;--rt-toggle-button-group-btn-gap: 8px;--rt-toggle-button-group-btn-font-size: 16px;--rt-toggle-button-group-btn-line-height: 18px}rt-toggle-button-group .rt-toggle-button-group{display:inline-flex;height:var(--rt-toggle-button-group-height);box-sizing:border-box;align-items:stretch;padding:var(--rt-toggle-button-group-track-padding);border-radius:var(--rt-toggle-button-group-track-radius);background-color:var(--rt-toggle-button-group-track-bg);gap:0}rt-toggle-button-group .rt-toggle-button-group__button{display:inline-flex;align-items:center;justify-content:center;padding:var(--rt-toggle-button-group-btn-padding);border:0;border-radius:var(--rt-toggle-button-group-btn-radius);background-color:transparent;color:var(--rt-color-text-muted);cursor:pointer;font-family:inherit;font-size:var(--rt-toggle-button-group-btn-font-size);font-weight:var(--rt-font-weight-semibold);gap:var(--rt-toggle-button-group-btn-gap);line-height:var(--rt-toggle-button-group-btn-line-height);transition:background-color var(--rt-toggle-button-group-transition-duration) ease,color var(--rt-toggle-button-group-transition-duration) ease}rt-toggle-button-group .rt-toggle-button-group__button:hover:not(:disabled,rt-toggle-button-group .rt-toggle-button-group__button--active){color:var(--rt-color-text-primary)}rt-toggle-button-group .rt-toggle-button-group__button--active{background-color:var(--rt-toggle-button-group-active-bg);color:var(--rt-color-text-primary)}rt-toggle-button-group .rt-toggle-button-group__button:focus-visible{position:relative;z-index:1;box-shadow:var(--rt-toggle-button-group-focus-shadow);outline:2px solid transparent;outline-offset:1px}rt-toggle-button-group .rt-toggle-button-group__button:disabled{cursor:not-allowed}rt-toggle-button-group .rt-toggle-button-group__label{display:inline-block;white-space:nowrap}rt-toggle-button-group .rt-toggle-button-group__icon{flex-shrink:0}rt-toggle-button-group .rt-toggle-button-group--disabled{opacity:.5}rt-toggle-button-group[data-rt-radius=none]{--rt-toggle-button-group-track-radius: var(--rt-radius-none)}rt-toggle-button-group[data-rt-radius=xs]{--rt-toggle-button-group-track-radius: var(--rt-radius-xs)}rt-toggle-button-group[data-rt-radius=sm]{--rt-toggle-button-group-track-radius: var(--rt-radius-sm)}rt-toggle-button-group[data-rt-radius=ms]{--rt-toggle-button-group-track-radius: var(--rt-radius-ms)}rt-toggle-button-group[data-rt-radius=md]{--rt-toggle-button-group-track-radius: var(--rt-radius-md)}rt-toggle-button-group[data-rt-radius=lg]{--rt-toggle-button-group-track-radius: var(--rt-radius-lg)}rt-toggle-button-group[data-rt-radius=xl]{--rt-toggle-button-group-track-radius: var(--rt-radius-xl)}rt-toggle-button-group[data-rt-radius=\"2xl\"]{--rt-toggle-button-group-track-radius: var(--rt-radius-2xl)}rt-toggle-button-group[data-rt-radius=full]{--rt-toggle-button-group-track-radius: var(--rt-radius-full)}rt-toggle-button-group.rt-toggle-button-group--full-width{display:flex;width:100%}rt-toggle-button-group.rt-toggle-button-group--full-width .rt-toggle-button-group{display:flex;width:100%;flex:1 1 auto}rt-toggle-button-group.rt-toggle-button-group--full-width .rt-toggle-button-group .rt-toggle-button-group__button{flex:1 1 0}:root[data-theme=dark] rt-toggle-button-group,html.rt-theme-dark rt-toggle-button-group{--rt-toggle-button-group-track-bg: var(--rt-neutral-900)}}\n"],
+			template: "<div\n    rtBlock=\"rt-toggle-button-group\"\n    role=\"group\"\n    [rtMod]=\"{\n        sm: size() === 'sm',\n        md: size() === 'md',\n        lg: size() === 'lg',\n        disabled: isDisabled(),\n        wrap: layout() === 'wrap',\n        column: layout() === 'column',\n        chips: appearance() === 'chips',\n    }\"\n    [attr.aria-label]=\"ariaLabel()\">\n    @for (item of items(); track item.option.value) {\n        <button\n            type=\"button\"\n            rtElem=\"button\"\n            qa-dataid=\"toggle-button-group-option\"\n            [attr.data-value]=\"item.option.value\"\n            [rtMod]=\"{\n                active: item.active,\n                first: $first,\n                last: $last,\n                checked: checkmark() && item.active,\n            }\"\n            [disabled]=\"item.disabled\"\n            [attr.aria-pressed]=\"item.active ? 'true' : 'false'\"\n            [rtTooltip]=\"item.option.title ?? ''\"\n            (click)=\"onOptionClick(item)\">\n            @if (checkmark() && item.active) {\n                <span rtElem=\"check\" aria-hidden=\"true\">\n                    <svg rtElem=\"check-svg\" viewBox=\"-2 -3 30 30\" focusable=\"false\">\n                        <path fill=\"none\" stroke=\"currentColor\" d=\"M1.73,12.91 8.1,19.28 22.79,4.59\" />\n                    </svg>\n                </span>\n            }\n            @if (optionTpl(); as tpl) {\n                <ng-container [ngTemplateOutlet]=\"tpl.templateRef\" [ngTemplateOutletContext]=\"item.context\" />\n            } @else {\n                @if (item.option.icon || item.option.glyph) {\n                    <rt-icon\n                        rtElem=\"icon\"\n                        color=\"current\"\n                        [name]=\"item.option.icon ?? null\"\n                        [glyph]=\"item.option.glyph ?? null\"\n                        [size]=\"iconSize()\" />\n                }\n                <span rtElem=\"label\">{{ item.option.label }}</span>\n            }\n        </button>\n    }\n</div>\n",
+			styles: ["@charset \"UTF-8\";@layer rt-kit.components{rt-toggle-button-group{--rt-toggle-button-group-track-bg: var(--rt-color-bg-surface-subtle);--rt-toggle-button-group-active-bg: var(--rt-color-bg-surface);--rt-toggle-button-group-height: 30px;--rt-toggle-button-group-transition-duration: var(--rt-duration-fast);--rt-toggle-button-group-focus-shadow: var(--rt-shadow-focus-ring);--rt-toggle-button-group-track-padding: 4px;--rt-toggle-button-group-track-radius: var(--rt-radius-md);--rt-toggle-button-group-btn-padding: 0 8px;--rt-toggle-button-group-btn-radius: var(--rt-radius-ms);--rt-toggle-button-group-btn-gap: 4px;--rt-toggle-button-group-btn-font-size: 12px;--rt-toggle-button-group-btn-line-height: 14px;display:inline-flex}rt-toggle-button-group.rt-toggle-button-group--md{--rt-toggle-button-group-height: 40px;--rt-toggle-button-group-btn-padding: 0 14px;--rt-toggle-button-group-btn-gap: 6px;--rt-toggle-button-group-btn-font-size: 14px;--rt-toggle-button-group-btn-line-height: 16px}rt-toggle-button-group.rt-toggle-button-group--lg{--rt-toggle-button-group-height: 50px;--rt-toggle-button-group-btn-padding: 0 20px;--rt-toggle-button-group-btn-gap: 8px;--rt-toggle-button-group-btn-font-size: 16px;--rt-toggle-button-group-btn-line-height: 18px}rt-toggle-button-group .rt-toggle-button-group{display:inline-flex;height:var(--rt-toggle-button-group-height);box-sizing:border-box;align-items:stretch;padding:var(--rt-toggle-button-group-track-padding);border-radius:var(--rt-toggle-button-group-track-radius);background-color:var(--rt-toggle-button-group-track-bg);gap:0}rt-toggle-button-group .rt-toggle-button-group__button{display:inline-flex;align-items:center;justify-content:center;padding:var(--rt-toggle-button-group-btn-padding);border:0;border-radius:var(--rt-toggle-button-group-btn-radius);background-color:transparent;color:var(--rt-color-text-muted);cursor:pointer;font-family:inherit;font-size:var(--rt-toggle-button-group-btn-font-size);font-weight:var(--rt-font-weight-semibold);gap:var(--rt-toggle-button-group-btn-gap);line-height:var(--rt-toggle-button-group-btn-line-height);transition:background-color var(--rt-toggle-button-group-transition-duration) ease,color var(--rt-toggle-button-group-transition-duration) ease}rt-toggle-button-group .rt-toggle-button-group__button:hover:not(:disabled,rt-toggle-button-group .rt-toggle-button-group__button--active){color:var(--rt-color-text-primary)}rt-toggle-button-group .rt-toggle-button-group__button--active{background-color:var(--rt-toggle-button-group-active-bg);color:var(--rt-color-text-primary)}rt-toggle-button-group .rt-toggle-button-group__button:focus-visible{position:relative;z-index:1;box-shadow:var(--rt-toggle-button-group-focus-shadow);outline:2px solid transparent;outline-offset:1px}rt-toggle-button-group .rt-toggle-button-group__button:disabled{cursor:not-allowed}rt-toggle-button-group .rt-toggle-button-group__label{display:inline-block;white-space:nowrap}rt-toggle-button-group .rt-toggle-button-group__icon{flex-shrink:0}rt-toggle-button-group .rt-toggle-button-group--disabled{opacity:.5}rt-toggle-button-group .rt-toggle-button-group--wrap,rt-toggle-button-group .rt-toggle-button-group--column{height:auto;gap:var(--rt-toggle-button-group-track-padding)}rt-toggle-button-group .rt-toggle-button-group--wrap .rt-toggle-button-group__button,rt-toggle-button-group .rt-toggle-button-group--column .rt-toggle-button-group__button{min-height:calc(var(--rt-toggle-button-group-height) - 2 * var(--rt-toggle-button-group-track-padding))}rt-toggle-button-group .rt-toggle-button-group--wrap{flex-wrap:wrap}rt-toggle-button-group .rt-toggle-button-group--column{flex-direction:column}rt-toggle-button-group .rt-toggle-button-group--column .rt-toggle-button-group__button{justify-content:flex-start}rt-toggle-button-group[data-rt-radius=none]{--rt-toggle-button-group-track-radius: var(--rt-radius-none)}rt-toggle-button-group[data-rt-radius=xs]{--rt-toggle-button-group-track-radius: var(--rt-radius-xs)}rt-toggle-button-group[data-rt-radius=sm]{--rt-toggle-button-group-track-radius: var(--rt-radius-sm)}rt-toggle-button-group[data-rt-radius=ms]{--rt-toggle-button-group-track-radius: var(--rt-radius-ms)}rt-toggle-button-group[data-rt-radius=md]{--rt-toggle-button-group-track-radius: var(--rt-radius-md)}rt-toggle-button-group[data-rt-radius=lg]{--rt-toggle-button-group-track-radius: var(--rt-radius-lg)}rt-toggle-button-group[data-rt-radius=xl]{--rt-toggle-button-group-track-radius: var(--rt-radius-xl)}rt-toggle-button-group[data-rt-radius=\"2xl\"]{--rt-toggle-button-group-track-radius: var(--rt-radius-2xl)}rt-toggle-button-group[data-rt-radius=full]{--rt-toggle-button-group-track-radius: var(--rt-radius-full)}rt-toggle-button-group.rt-toggle-button-group--wrap{display:flex}rt-toggle-button-group.rt-toggle-button-group--wrap .rt-toggle-button-group{min-width:0;flex:0 1 auto}rt-toggle-button-group.rt-toggle-button-group--full-width{display:flex;width:100%}rt-toggle-button-group.rt-toggle-button-group--full-width .rt-toggle-button-group{display:flex;width:100%;flex:1 1 auto}rt-toggle-button-group.rt-toggle-button-group--full-width .rt-toggle-button-group .rt-toggle-button-group__button{flex:1 1 0}:root[data-theme=dark] rt-toggle-button-group,html.rt-theme-dark rt-toggle-button-group{--rt-toggle-button-group-track-bg: var(--rt-neutral-900)}}\n", "@charset \"UTF-8\";@layer rt-kit.components{rt-toggle-button-group .rt-toggle-button-group__check{display:inline-flex;flex:none;align-items:center;justify-content:center;block-size:var(--rt-size-4);inline-size:var(--rt-size-4)}rt-toggle-button-group .rt-toggle-button-group__check-svg{display:block;block-size:100%;inline-size:100%;stroke-width:2px}rt-toggle-button-group.rt-toggle-button-group--chips .rt-toggle-button-group{height:auto;padding:0;border-radius:0;background-color:transparent;gap:var(--rt-space-2);opacity:1}rt-toggle-button-group.rt-toggle-button-group--chips.rt-toggle-button-group--column{display:flex;flex:1 1 auto}rt-toggle-button-group.rt-toggle-button-group--chips.rt-toggle-button-group--column .rt-toggle-button-group{flex:1 1 auto}rt-toggle-button-group.rt-toggle-button-group--chips.rt-toggle-button-group--column .rt-toggle-button-group__button{flex:none}rt-toggle-button-group.rt-toggle-button-group--chips .rt-toggle-button-group__button{--rt-toggle-chip-edge: var(--rt-toggle-chip-color-border);--rt-toggle-chip-outline: inset 0 0 0 var(--rt-border-width-thin) var(--rt-toggle-chip-edge);height:var(--rt-toggle-button-group-height);min-height:0;box-sizing:border-box;border-radius:var(--rt-toggle-button-group-track-radius);background-color:transparent;box-shadow:var(--rt-toggle-chip-outline);color:var(--rt-toggle-chip-color-text)}rt-toggle-button-group.rt-toggle-button-group--chips .rt-toggle-button-group__button:hover:not(:disabled){--rt-toggle-chip-hover: color-mix(in srgb, currentcolor 8%, transparent);background-image:linear-gradient(var(--rt-toggle-chip-hover),var(--rt-toggle-chip-hover))}rt-toggle-button-group.rt-toggle-button-group--chips .rt-toggle-button-group__button:hover:not(:disabled,.rt-toggle-button-group__button--active){color:var(--rt-toggle-chip-color-text)}rt-toggle-button-group.rt-toggle-button-group--chips .rt-toggle-button-group__button.rt-toggle-button-group__button--active{background-color:var(--rt-toggle-chip-color-bg-selected);color:var(--rt-color-action-primary-on-surface)}rt-toggle-button-group.rt-toggle-button-group--chips .rt-toggle-button-group__button:focus-visible{--rt-toggle-chip-focus: var(--rt-toggle-chip-outline), var(--rt-toggle-button-group-focus-shadow);box-shadow:var(--rt-toggle-chip-focus)}rt-toggle-button-group.rt-toggle-button-group--chips .rt-toggle-button-group__button:disabled{--rt-toggle-chip-edge: color-mix(in srgb, currentcolor 32%, transparent);color:var(--rt-color-text-disabled)}rt-toggle-button-group.rt-toggle-button-group--chips:is(.rt-preset-material *,[data-preset=material] *,.rt-preset-material,[data-preset=material]) .rt-toggle-button-group{padding-block:var(--rt-space-2);row-gap:var(--rt-space-4)}rt-toggle-button-group.rt-toggle-button-group--chips:is(.rt-preset-material *,[data-preset=material] *,.rt-preset-material,[data-preset=material]) .rt-toggle-button-group__button{height:28px;padding:0 calc(3 * var(--rt-space-1));font-size:var(--rt-text-sm);font-weight:var(--rt-font-weight-medium);letter-spacing:.1px;line-height:var(--rt-size-5)}rt-toggle-button-group.rt-toggle-button-group--chips:is(.rt-preset-material *,[data-preset=material] *,.rt-preset-material,[data-preset=material]) .rt-toggle-button-group__button--active:not(:disabled){--rt-toggle-chip-edge: transparent;color:var(--rt-sys-on-secondary-container, var(--rt-color-text-primary))}rt-toggle-button-group.rt-toggle-button-group--chips:is(.rt-preset-material *,[data-preset=material] *,.rt-preset-material,[data-preset=material]) .rt-toggle-button-group__check{block-size:var(--rt-size-6);inline-size:var(--rt-size-6);margin-inline:calc(-1.5 * var(--rt-space-1)) calc(1.5 * var(--rt-space-1) - var(--rt-toggle-button-group-btn-gap))}rt-toggle-button-group.rt-toggle-button-group--chips:is(.rt-preset-material *,[data-preset=material] *,.rt-preset-material,[data-preset=material]) .rt-toggle-button-group__check-svg{block-size:var(--rt-size-5);inline-size:var(--rt-size-5)}rt-toggle-button-group:is(.rt-preset-material *,[data-preset=material] *,.rt-preset-material,[data-preset=material]):not(.rt-toggle-button-group--chips) .rt-toggle-button-group:not(.rt-toggle-button-group--disabled) .rt-toggle-button-group__button:disabled{color:var(--rt-color-text-disabled)}}\n"],
 			dependencies: [
+				{
+					kind: "directive",
+					type: NgTemplateOutlet,
+					selector: "[ngTemplateOutlet]",
+					inputs: [
+						"ngTemplateOutletContext",
+						"ngTemplateOutlet",
+						"ngTemplateOutletInjector"
+					]
+				},
 				{
 					kind: "component",
 					type: RtIconComponent,
@@ -173,6 +317,7 @@ var RtToggleButtonGroupComponent = class RtToggleButtonGroupComponent {
 					inputs: [
 						"rtTooltip",
 						"rtTooltipPlacement",
+						"rtTooltipShowDelay",
 						"rtTooltipWhenTruncated",
 						"rtTooltipHideOnClick"
 					],
@@ -213,12 +358,18 @@ i0.ɵɵngDeclareClassMetadata({
 			changeDetection: ChangeDetectionStrategy.OnPush,
 			encapsulation: ViewEncapsulation.None,
 			imports: [
+				NgTemplateOutlet,
 				RtIconComponent,
 				RtTooltipDirective,
 				BlockDirective,
 				ElemDirective,
 				ModDirective
 			],
+			providers: [{
+				provide: NG_VALUE_ACCESSOR,
+				useExisting: forwardRef(() => RtToggleButtonGroupComponent),
+				multi: true
+			}],
 			hostDirectives: [{
 				directive: RtRadiusDirective,
 				inputs: ["radius"]
@@ -226,14 +377,21 @@ i0.ɵɵngDeclareClassMetadata({
 			host: {
 				class: BEM_BLOCK,
 				"[class.rt-toggle-button-group--full-width]": "fullWidth()",
+				"[class.rt-toggle-button-group--wrap]": "layout() === 'wrap'",
+				"[class.rt-toggle-button-group--column]": "layout() === 'column'",
 				"[class.rt-toggle-button-group--md]": "size() === 'md'",
-				"[class.rt-toggle-button-group--lg]": "size() === 'lg'"
+				"[class.rt-toggle-button-group--lg]": "size() === 'lg'",
+				"[class.rt-toggle-button-group--chips]": "appearance() === 'chips'"
 			},
-			template: "<div\n    rtBlock=\"rt-toggle-button-group\"\n    role=\"group\"\n    [rtMod]=\"{\n        sm: size() === 'sm',\n        md: size() === 'md',\n        lg: size() === 'lg',\n        disabled: disabled(),\n    }\"\n    [attr.aria-label]=\"ariaLabel()\">\n    @for (item of items(); track item.option.value) {\n        <button\n            type=\"button\"\n            rtElem=\"button\"\n            qa-dataid=\"toggle-button-group-option\"\n            [attr.data-value]=\"item.option.value\"\n            [rtMod]=\"{\n                active: item.active,\n                first: $first,\n                last: $last,\n            }\"\n            [disabled]=\"item.disabled\"\n            [attr.aria-pressed]=\"item.active ? 'true' : 'false'\"\n            [rtTooltip]=\"item.option.title ?? ''\"\n            (click)=\"onOptionClick(item)\">\n            @if (item.option.icon || item.option.glyph) {\n                <rt-icon\n                    rtElem=\"icon\"\n                    color=\"current\"\n                    [name]=\"item.option.icon ?? null\"\n                    [glyph]=\"item.option.glyph ?? null\"\n                    [size]=\"iconSize()\" />\n            }\n            <span rtElem=\"label\">{{ item.option.label }}</span>\n        </button>\n    }\n</div>\n",
-			styles: ["@charset \"UTF-8\";@layer rt-kit.components{rt-toggle-button-group{--rt-toggle-button-group-track-bg: var(--rt-color-bg-surface-subtle);--rt-toggle-button-group-active-bg: var(--rt-color-bg-surface);--rt-toggle-button-group-height: 30px;--rt-toggle-button-group-transition-duration: var(--rt-duration-fast);--rt-toggle-button-group-focus-shadow: var(--rt-shadow-focus-ring);--rt-toggle-button-group-track-padding: 4px;--rt-toggle-button-group-track-radius: var(--rt-radius-md);--rt-toggle-button-group-btn-padding: 0 8px;--rt-toggle-button-group-btn-radius: var(--rt-radius-ms);--rt-toggle-button-group-btn-gap: 4px;--rt-toggle-button-group-btn-font-size: 12px;--rt-toggle-button-group-btn-line-height: 14px;display:inline-flex}rt-toggle-button-group.rt-toggle-button-group--md{--rt-toggle-button-group-height: 40px;--rt-toggle-button-group-btn-padding: 0 14px;--rt-toggle-button-group-btn-gap: 6px;--rt-toggle-button-group-btn-font-size: 14px;--rt-toggle-button-group-btn-line-height: 16px}rt-toggle-button-group.rt-toggle-button-group--lg{--rt-toggle-button-group-height: 50px;--rt-toggle-button-group-btn-padding: 0 20px;--rt-toggle-button-group-btn-gap: 8px;--rt-toggle-button-group-btn-font-size: 16px;--rt-toggle-button-group-btn-line-height: 18px}rt-toggle-button-group .rt-toggle-button-group{display:inline-flex;height:var(--rt-toggle-button-group-height);box-sizing:border-box;align-items:stretch;padding:var(--rt-toggle-button-group-track-padding);border-radius:var(--rt-toggle-button-group-track-radius);background-color:var(--rt-toggle-button-group-track-bg);gap:0}rt-toggle-button-group .rt-toggle-button-group__button{display:inline-flex;align-items:center;justify-content:center;padding:var(--rt-toggle-button-group-btn-padding);border:0;border-radius:var(--rt-toggle-button-group-btn-radius);background-color:transparent;color:var(--rt-color-text-muted);cursor:pointer;font-family:inherit;font-size:var(--rt-toggle-button-group-btn-font-size);font-weight:var(--rt-font-weight-semibold);gap:var(--rt-toggle-button-group-btn-gap);line-height:var(--rt-toggle-button-group-btn-line-height);transition:background-color var(--rt-toggle-button-group-transition-duration) ease,color var(--rt-toggle-button-group-transition-duration) ease}rt-toggle-button-group .rt-toggle-button-group__button:hover:not(:disabled,rt-toggle-button-group .rt-toggle-button-group__button--active){color:var(--rt-color-text-primary)}rt-toggle-button-group .rt-toggle-button-group__button--active{background-color:var(--rt-toggle-button-group-active-bg);color:var(--rt-color-text-primary)}rt-toggle-button-group .rt-toggle-button-group__button:focus-visible{position:relative;z-index:1;box-shadow:var(--rt-toggle-button-group-focus-shadow);outline:2px solid transparent;outline-offset:1px}rt-toggle-button-group .rt-toggle-button-group__button:disabled{cursor:not-allowed}rt-toggle-button-group .rt-toggle-button-group__label{display:inline-block;white-space:nowrap}rt-toggle-button-group .rt-toggle-button-group__icon{flex-shrink:0}rt-toggle-button-group .rt-toggle-button-group--disabled{opacity:.5}rt-toggle-button-group[data-rt-radius=none]{--rt-toggle-button-group-track-radius: var(--rt-radius-none)}rt-toggle-button-group[data-rt-radius=xs]{--rt-toggle-button-group-track-radius: var(--rt-radius-xs)}rt-toggle-button-group[data-rt-radius=sm]{--rt-toggle-button-group-track-radius: var(--rt-radius-sm)}rt-toggle-button-group[data-rt-radius=ms]{--rt-toggle-button-group-track-radius: var(--rt-radius-ms)}rt-toggle-button-group[data-rt-radius=md]{--rt-toggle-button-group-track-radius: var(--rt-radius-md)}rt-toggle-button-group[data-rt-radius=lg]{--rt-toggle-button-group-track-radius: var(--rt-radius-lg)}rt-toggle-button-group[data-rt-radius=xl]{--rt-toggle-button-group-track-radius: var(--rt-radius-xl)}rt-toggle-button-group[data-rt-radius=\"2xl\"]{--rt-toggle-button-group-track-radius: var(--rt-radius-2xl)}rt-toggle-button-group[data-rt-radius=full]{--rt-toggle-button-group-track-radius: var(--rt-radius-full)}rt-toggle-button-group.rt-toggle-button-group--full-width{display:flex;width:100%}rt-toggle-button-group.rt-toggle-button-group--full-width .rt-toggle-button-group{display:flex;width:100%;flex:1 1 auto}rt-toggle-button-group.rt-toggle-button-group--full-width .rt-toggle-button-group .rt-toggle-button-group__button{flex:1 1 0}:root[data-theme=dark] rt-toggle-button-group,html.rt-theme-dark rt-toggle-button-group{--rt-toggle-button-group-track-bg: var(--rt-neutral-900)}}\n"]
+			template: "<div\n    rtBlock=\"rt-toggle-button-group\"\n    role=\"group\"\n    [rtMod]=\"{\n        sm: size() === 'sm',\n        md: size() === 'md',\n        lg: size() === 'lg',\n        disabled: isDisabled(),\n        wrap: layout() === 'wrap',\n        column: layout() === 'column',\n        chips: appearance() === 'chips',\n    }\"\n    [attr.aria-label]=\"ariaLabel()\">\n    @for (item of items(); track item.option.value) {\n        <button\n            type=\"button\"\n            rtElem=\"button\"\n            qa-dataid=\"toggle-button-group-option\"\n            [attr.data-value]=\"item.option.value\"\n            [rtMod]=\"{\n                active: item.active,\n                first: $first,\n                last: $last,\n                checked: checkmark() && item.active,\n            }\"\n            [disabled]=\"item.disabled\"\n            [attr.aria-pressed]=\"item.active ? 'true' : 'false'\"\n            [rtTooltip]=\"item.option.title ?? ''\"\n            (click)=\"onOptionClick(item)\">\n            @if (checkmark() && item.active) {\n                <span rtElem=\"check\" aria-hidden=\"true\">\n                    <svg rtElem=\"check-svg\" viewBox=\"-2 -3 30 30\" focusable=\"false\">\n                        <path fill=\"none\" stroke=\"currentColor\" d=\"M1.73,12.91 8.1,19.28 22.79,4.59\" />\n                    </svg>\n                </span>\n            }\n            @if (optionTpl(); as tpl) {\n                <ng-container [ngTemplateOutlet]=\"tpl.templateRef\" [ngTemplateOutletContext]=\"item.context\" />\n            } @else {\n                @if (item.option.icon || item.option.glyph) {\n                    <rt-icon\n                        rtElem=\"icon\"\n                        color=\"current\"\n                        [name]=\"item.option.icon ?? null\"\n                        [glyph]=\"item.option.glyph ?? null\"\n                        [size]=\"iconSize()\" />\n                }\n                <span rtElem=\"label\">{{ item.option.label }}</span>\n            }\n        </button>\n    }\n</div>\n",
+			styles: ["@charset \"UTF-8\";@layer rt-kit.components{rt-toggle-button-group{--rt-toggle-button-group-track-bg: var(--rt-color-bg-surface-subtle);--rt-toggle-button-group-active-bg: var(--rt-color-bg-surface);--rt-toggle-button-group-height: 30px;--rt-toggle-button-group-transition-duration: var(--rt-duration-fast);--rt-toggle-button-group-focus-shadow: var(--rt-shadow-focus-ring);--rt-toggle-button-group-track-padding: 4px;--rt-toggle-button-group-track-radius: var(--rt-radius-md);--rt-toggle-button-group-btn-padding: 0 8px;--rt-toggle-button-group-btn-radius: var(--rt-radius-ms);--rt-toggle-button-group-btn-gap: 4px;--rt-toggle-button-group-btn-font-size: 12px;--rt-toggle-button-group-btn-line-height: 14px;display:inline-flex}rt-toggle-button-group.rt-toggle-button-group--md{--rt-toggle-button-group-height: 40px;--rt-toggle-button-group-btn-padding: 0 14px;--rt-toggle-button-group-btn-gap: 6px;--rt-toggle-button-group-btn-font-size: 14px;--rt-toggle-button-group-btn-line-height: 16px}rt-toggle-button-group.rt-toggle-button-group--lg{--rt-toggle-button-group-height: 50px;--rt-toggle-button-group-btn-padding: 0 20px;--rt-toggle-button-group-btn-gap: 8px;--rt-toggle-button-group-btn-font-size: 16px;--rt-toggle-button-group-btn-line-height: 18px}rt-toggle-button-group .rt-toggle-button-group{display:inline-flex;height:var(--rt-toggle-button-group-height);box-sizing:border-box;align-items:stretch;padding:var(--rt-toggle-button-group-track-padding);border-radius:var(--rt-toggle-button-group-track-radius);background-color:var(--rt-toggle-button-group-track-bg);gap:0}rt-toggle-button-group .rt-toggle-button-group__button{display:inline-flex;align-items:center;justify-content:center;padding:var(--rt-toggle-button-group-btn-padding);border:0;border-radius:var(--rt-toggle-button-group-btn-radius);background-color:transparent;color:var(--rt-color-text-muted);cursor:pointer;font-family:inherit;font-size:var(--rt-toggle-button-group-btn-font-size);font-weight:var(--rt-font-weight-semibold);gap:var(--rt-toggle-button-group-btn-gap);line-height:var(--rt-toggle-button-group-btn-line-height);transition:background-color var(--rt-toggle-button-group-transition-duration) ease,color var(--rt-toggle-button-group-transition-duration) ease}rt-toggle-button-group .rt-toggle-button-group__button:hover:not(:disabled,rt-toggle-button-group .rt-toggle-button-group__button--active){color:var(--rt-color-text-primary)}rt-toggle-button-group .rt-toggle-button-group__button--active{background-color:var(--rt-toggle-button-group-active-bg);color:var(--rt-color-text-primary)}rt-toggle-button-group .rt-toggle-button-group__button:focus-visible{position:relative;z-index:1;box-shadow:var(--rt-toggle-button-group-focus-shadow);outline:2px solid transparent;outline-offset:1px}rt-toggle-button-group .rt-toggle-button-group__button:disabled{cursor:not-allowed}rt-toggle-button-group .rt-toggle-button-group__label{display:inline-block;white-space:nowrap}rt-toggle-button-group .rt-toggle-button-group__icon{flex-shrink:0}rt-toggle-button-group .rt-toggle-button-group--disabled{opacity:.5}rt-toggle-button-group .rt-toggle-button-group--wrap,rt-toggle-button-group .rt-toggle-button-group--column{height:auto;gap:var(--rt-toggle-button-group-track-padding)}rt-toggle-button-group .rt-toggle-button-group--wrap .rt-toggle-button-group__button,rt-toggle-button-group .rt-toggle-button-group--column .rt-toggle-button-group__button{min-height:calc(var(--rt-toggle-button-group-height) - 2 * var(--rt-toggle-button-group-track-padding))}rt-toggle-button-group .rt-toggle-button-group--wrap{flex-wrap:wrap}rt-toggle-button-group .rt-toggle-button-group--column{flex-direction:column}rt-toggle-button-group .rt-toggle-button-group--column .rt-toggle-button-group__button{justify-content:flex-start}rt-toggle-button-group[data-rt-radius=none]{--rt-toggle-button-group-track-radius: var(--rt-radius-none)}rt-toggle-button-group[data-rt-radius=xs]{--rt-toggle-button-group-track-radius: var(--rt-radius-xs)}rt-toggle-button-group[data-rt-radius=sm]{--rt-toggle-button-group-track-radius: var(--rt-radius-sm)}rt-toggle-button-group[data-rt-radius=ms]{--rt-toggle-button-group-track-radius: var(--rt-radius-ms)}rt-toggle-button-group[data-rt-radius=md]{--rt-toggle-button-group-track-radius: var(--rt-radius-md)}rt-toggle-button-group[data-rt-radius=lg]{--rt-toggle-button-group-track-radius: var(--rt-radius-lg)}rt-toggle-button-group[data-rt-radius=xl]{--rt-toggle-button-group-track-radius: var(--rt-radius-xl)}rt-toggle-button-group[data-rt-radius=\"2xl\"]{--rt-toggle-button-group-track-radius: var(--rt-radius-2xl)}rt-toggle-button-group[data-rt-radius=full]{--rt-toggle-button-group-track-radius: var(--rt-radius-full)}rt-toggle-button-group.rt-toggle-button-group--wrap{display:flex}rt-toggle-button-group.rt-toggle-button-group--wrap .rt-toggle-button-group{min-width:0;flex:0 1 auto}rt-toggle-button-group.rt-toggle-button-group--full-width{display:flex;width:100%}rt-toggle-button-group.rt-toggle-button-group--full-width .rt-toggle-button-group{display:flex;width:100%;flex:1 1 auto}rt-toggle-button-group.rt-toggle-button-group--full-width .rt-toggle-button-group .rt-toggle-button-group__button{flex:1 1 0}:root[data-theme=dark] rt-toggle-button-group,html.rt-theme-dark rt-toggle-button-group{--rt-toggle-button-group-track-bg: var(--rt-neutral-900)}}\n", "@charset \"UTF-8\";@layer rt-kit.components{rt-toggle-button-group .rt-toggle-button-group__check{display:inline-flex;flex:none;align-items:center;justify-content:center;block-size:var(--rt-size-4);inline-size:var(--rt-size-4)}rt-toggle-button-group .rt-toggle-button-group__check-svg{display:block;block-size:100%;inline-size:100%;stroke-width:2px}rt-toggle-button-group.rt-toggle-button-group--chips .rt-toggle-button-group{height:auto;padding:0;border-radius:0;background-color:transparent;gap:var(--rt-space-2);opacity:1}rt-toggle-button-group.rt-toggle-button-group--chips.rt-toggle-button-group--column{display:flex;flex:1 1 auto}rt-toggle-button-group.rt-toggle-button-group--chips.rt-toggle-button-group--column .rt-toggle-button-group{flex:1 1 auto}rt-toggle-button-group.rt-toggle-button-group--chips.rt-toggle-button-group--column .rt-toggle-button-group__button{flex:none}rt-toggle-button-group.rt-toggle-button-group--chips .rt-toggle-button-group__button{--rt-toggle-chip-edge: var(--rt-toggle-chip-color-border);--rt-toggle-chip-outline: inset 0 0 0 var(--rt-border-width-thin) var(--rt-toggle-chip-edge);height:var(--rt-toggle-button-group-height);min-height:0;box-sizing:border-box;border-radius:var(--rt-toggle-button-group-track-radius);background-color:transparent;box-shadow:var(--rt-toggle-chip-outline);color:var(--rt-toggle-chip-color-text)}rt-toggle-button-group.rt-toggle-button-group--chips .rt-toggle-button-group__button:hover:not(:disabled){--rt-toggle-chip-hover: color-mix(in srgb, currentcolor 8%, transparent);background-image:linear-gradient(var(--rt-toggle-chip-hover),var(--rt-toggle-chip-hover))}rt-toggle-button-group.rt-toggle-button-group--chips .rt-toggle-button-group__button:hover:not(:disabled,.rt-toggle-button-group__button--active){color:var(--rt-toggle-chip-color-text)}rt-toggle-button-group.rt-toggle-button-group--chips .rt-toggle-button-group__button.rt-toggle-button-group__button--active{background-color:var(--rt-toggle-chip-color-bg-selected);color:var(--rt-color-action-primary-on-surface)}rt-toggle-button-group.rt-toggle-button-group--chips .rt-toggle-button-group__button:focus-visible{--rt-toggle-chip-focus: var(--rt-toggle-chip-outline), var(--rt-toggle-button-group-focus-shadow);box-shadow:var(--rt-toggle-chip-focus)}rt-toggle-button-group.rt-toggle-button-group--chips .rt-toggle-button-group__button:disabled{--rt-toggle-chip-edge: color-mix(in srgb, currentcolor 32%, transparent);color:var(--rt-color-text-disabled)}rt-toggle-button-group.rt-toggle-button-group--chips:is(.rt-preset-material *,[data-preset=material] *,.rt-preset-material,[data-preset=material]) .rt-toggle-button-group{padding-block:var(--rt-space-2);row-gap:var(--rt-space-4)}rt-toggle-button-group.rt-toggle-button-group--chips:is(.rt-preset-material *,[data-preset=material] *,.rt-preset-material,[data-preset=material]) .rt-toggle-button-group__button{height:28px;padding:0 calc(3 * var(--rt-space-1));font-size:var(--rt-text-sm);font-weight:var(--rt-font-weight-medium);letter-spacing:.1px;line-height:var(--rt-size-5)}rt-toggle-button-group.rt-toggle-button-group--chips:is(.rt-preset-material *,[data-preset=material] *,.rt-preset-material,[data-preset=material]) .rt-toggle-button-group__button--active:not(:disabled){--rt-toggle-chip-edge: transparent;color:var(--rt-sys-on-secondary-container, var(--rt-color-text-primary))}rt-toggle-button-group.rt-toggle-button-group--chips:is(.rt-preset-material *,[data-preset=material] *,.rt-preset-material,[data-preset=material]) .rt-toggle-button-group__check{block-size:var(--rt-size-6);inline-size:var(--rt-size-6);margin-inline:calc(-1.5 * var(--rt-space-1)) calc(1.5 * var(--rt-space-1) - var(--rt-toggle-button-group-btn-gap))}rt-toggle-button-group.rt-toggle-button-group--chips:is(.rt-preset-material *,[data-preset=material] *,.rt-preset-material,[data-preset=material]) .rt-toggle-button-group__check-svg{block-size:var(--rt-size-5);inline-size:var(--rt-size-5)}rt-toggle-button-group:is(.rt-preset-material *,[data-preset=material] *,.rt-preset-material,[data-preset=material]):not(.rt-toggle-button-group--chips) .rt-toggle-button-group:not(.rt-toggle-button-group--disabled) .rt-toggle-button-group__button:disabled{color:var(--rt-color-text-disabled)}}\n"]
 		}]
 	}],
 	propDecorators: {
+		optionTpl: [{
+			type: i0.ContentChild,
+			args: [i0.forwardRef(() => RtToggleButtonOptionDirective), { isSignal: true }]
+		}],
 		options: [{
 			type: i0.Input,
 			args: [{
@@ -298,6 +456,30 @@ i0.ɵɵngDeclareClassMetadata({
 				required: false
 			}]
 		}],
+		layout: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "layout",
+				required: false
+			}]
+		}],
+		appearance: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "appearance",
+				required: false
+			}]
+		}],
+		checkmark: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "checkmark",
+				required: false
+			}]
+		}],
 		valueChange: [{
 			type: i0.Output,
 			args: ["valueChange"]
@@ -308,6 +490,6 @@ i0.ɵɵngDeclareClassMetadata({
 		}]
 	}
 });
-export { RtToggleButtonGroupComponent };
+export { RtToggleButtonGroupComponent, RtToggleButtonOptionDirective };
 
 //# sourceMappingURL=rt-tools-ui-kit-v2-toggle-button-group.mjs.map