@koobiq/components 19.8.3 → 20.1.0

package/accordion/accordion-trigger.component.scss

@@ -3,10 +3,6 @@
     flex-direction: row;
     align-items: center;
 
-    background: transparent;
-    border: none;
-    outline: none;
-
     & .kbq-accordion-trigger__icon {
         box-sizing: initial;
 
@@ -28,14 +24,6 @@
         margin-bottom: calc(-1 * #{var(--kbq-size-3xs)});
     }
 
-    &:hover:not([data-disabled='true']) {
-        cursor: pointer;
-
-        & .kbq-accordion-trigger__icon {
-            color: var(--kbq-accordion-item-states-hover-icon-color);
-        }
-    }
-
     &.kbq-accordion-trigger_fill {
         padding: var(--kbq-accordion-size-item-header-variant-fill-padding);
 
@@ -65,12 +53,6 @@
             transform: rotate(-180deg);
         }
     }
-
-    &[data-disabled='true'] {
-        & .kbq-accordion-trigger__icon {
-            color: var(--kbq-accordion-item-states-disabled-icon-color) !important;
-        }
-    }
 }
 
 button.kbq-accordion-trigger {

package/accordion/accordion.component.scss

@@ -29,14 +29,21 @@
     }
 
     &[data-state='open'] {
-        transition: 300ms ease-out;
+        transition: height 300ms ease-out;
         height: var(--radix-accordion-content-height);
     }
 
     &[data-state='closed'] {
-        transition: 300ms ease-out;
+        transition: height 300ms ease-out;
         height: 0;
     }
+
+    @media (prefers-reduced-motion: reduce) {
+        &[data-state='open'],
+        &[data-state='closed'] {
+            transition: none;
+        }
+    }
 }
 
 @include kbq-accordion-theme();

package/accordion/index.d.ts

@@ -1 +1,238 @@
-export * from './public-api';
+import * as i0 from '@angular/core';
+import { OnDestroy, AfterViewInit, AfterContentInit, ElementRef, ChangeDetectorRef, EventEmitter } from '@angular/core';
+import { UniqueSelectionDispatcher } from '@angular/cdk/collections';
+import * as i1 from '@koobiq/components/icon';
+import { KbqIcon } from '@koobiq/components/icon';
+import { FocusMonitor, FocusKeyManager } from '@angular/cdk/a11y';
+import { Directionality } from '@angular/cdk/bidi';
+import { Subject } from 'rxjs';
+
+declare enum KbqAccordionVariant {
+    fill = "fill",
+    hug = "hug",
+    hugSpaceBetween = "hugSpaceBetween"
+}
+type KbqAccordionType = 'single' | 'multiple';
+type KbqAccordionOrientation = 'horizontal' | 'vertical';
+declare class KbqAccordion implements OnDestroy, AfterViewInit, AfterContentInit {
+    private readonly isBrowser;
+    private readonly localStorage;
+    /** @docs-private */
+    protected readonly focusMonitor: FocusMonitor;
+    /** @docs-private */
+    protected readonly elementRef: ElementRef<any>;
+    /** @docs-private */
+    protected readonly changeDetectorRef: ChangeDetectorRef;
+    /** @docs-private */
+    protected readonly selectionDispatcher: UniqueSelectionDispatcher;
+    /** @docs-private */
+    protected readonly dir: Directionality | null;
+    /** @docs-private */
+    protected keyManager: FocusKeyManager<KbqAccordionItem>;
+    /** @docs-private */
+    readonly openCloseAllActions: Subject<boolean>;
+    /**  @docs-private */
+    readonly items: i0.Signal<readonly any[]>;
+    /** Specifies whether the accordion saves its states. Default is false */
+    useStateSaving: boolean;
+    readonly variant: i0.InputSignal<string>;
+    /** Whether the Accordion is disabled. */
+    readonly disabled: i0.InputSignalWithTransform<boolean, unknown>;
+    /** The orientation of the accordion. */
+    readonly orientation: i0.InputSignal<KbqAccordionOrientation>;
+    /**
+     * The value of the item to expand when initially rendered and type is "single". Use when you do not need to control the state of the items.
+     */
+    get defaultValue(): string[] | string;
+    set defaultValue(value: string[] | string);
+    /** Determines whether one or multiple items can be opened at the same time. */
+    readonly type: i0.InputSignal<KbqAccordionType>;
+    readonly collapsible: i0.InputSignal<boolean>;
+    /** The controlled value of the item to expand */
+    get value(): string[] | string;
+    set value(value: string[] | string);
+    readonly onValueChange: i0.OutputEmitterRef<void>;
+    get id(): string;
+    get isMultiple(): boolean;
+    get hasSavedState(): boolean;
+    private _value?;
+    private _defaultValue;
+    private onValueChangeSubscription;
+    private _id;
+    private state;
+    constructor();
+    ngAfterContentInit(): void;
+    ngAfterViewInit(): void;
+    ngOnDestroy(): void;
+    /** @docs-private */
+    keydownHandler(event: KeyboardEvent): void;
+    /** Opens all enabled accordion items in an accordion where multi is enabled. */
+    openAll(): void;
+    /** Closes all enabled accordion items. */
+    closeAll(): void;
+    /** @docs-private */
+    setActiveItem(item: KbqAccordionItem): void;
+    /** @docs-private */
+    saveItemState(item: KbqAccordionItem, force?: boolean): void;
+    private getSavedState;
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqAccordion, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<KbqAccordion, "kbq-accordion, [kbq-accordion]", never, { "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; "defaultValue": { "alias": "defaultValue"; "required": false; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "collapsible": { "alias": "collapsible"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; }; }, { "onValueChange": "onValueChange"; }, ["items"], ["*"], true, never>;
+}
+
+declare class KbqAccordionTriggerDirective {
+    /** @docs-private */
+    protected readonly nativeElement: HTMLElement;
+    /** @docs-private */
+    protected readonly accordion: KbqAccordion;
+    /** @docs-private */
+    protected readonly item: KbqAccordionItem;
+    /** @docs-private */
+    get triggerId(): string;
+    /** @docs-private */
+    get contentId(): string;
+    /** Fires when trigger clicked */
+    onClick(): void;
+    /** @docs-private */
+    focus(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqAccordionTriggerDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<KbqAccordionTriggerDirective, "[kbqAccordionTrigger]", never, {}, {}, never, never, true, never>;
+}
+
+declare class KbqAccordionTrigger implements AfterViewInit {
+    /** @docs-private */
+    protected readonly nativeElement: HTMLElement;
+    /** @docs-private */
+    protected readonly accordion: KbqAccordion;
+    /** @docs-private */
+    readonly icon: i0.Signal<KbqIcon>;
+    private savedTransition;
+    private readonly afterRenderRef?;
+    get isFill(): boolean;
+    get isHug(): boolean;
+    get isHugSpaceBetween(): boolean;
+    constructor();
+    ngAfterViewInit(): void;
+    disableAnimation(): void;
+    enableAnimation(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqAccordionTrigger, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<KbqAccordionTrigger, "kbq-accordion-trigger, [kbq-accordion-trigger]", never, {}, {}, never, ["*"], true, [{ directive: typeof KbqAccordionTriggerDirective; inputs: {}; outputs: {}; }]>;
+}
+
+type KbqAccordionItemState = 'open' | 'closed';
+declare class KbqAccordionItem implements OnDestroy {
+    /** @docs-private */
+    protected readonly accordion: KbqAccordion;
+    /** @docs-private */
+    protected readonly changeDetectorRef: ChangeDetectorRef;
+    /** @docs-private */
+    protected readonly expansionDispatcher: UniqueSelectionDispatcher;
+    /** @docs-private */
+    readonly trigger: i0.Signal<KbqAccordionTriggerDirective | undefined>;
+    /** @docs-private */
+    readonly triggerComponent: i0.Signal<KbqAccordionTrigger | undefined>;
+    /** @docs-private */
+    readonly content: i0.Signal<any>;
+    /** The unique AccordionItem id. */
+    get id(): string;
+    private _id;
+    get dataState(): KbqAccordionItemState;
+    get orientation(): KbqAccordionOrientation;
+    /** Whether the AccordionItem is expanded. */
+    get expanded(): boolean;
+    set expanded(expanded: boolean);
+    private _expanded;
+    set value(value: string);
+    get value(): string;
+    private _value?;
+    /** Whether the AccordionItem is disabled. */
+    get disabled(): boolean;
+    set disabled(value: boolean);
+    private _disabled;
+    /** Event emitted every time the AccordionItem is closed. */
+    readonly closed: i0.OutputEmitterRef<void>;
+    /** Event emitted every time the AccordionItem is opened. */
+    readonly opened: i0.OutputEmitterRef<void>;
+    /**
+     * Event emitted when the AccordionItem is destroyed.
+     * @docs-private
+     */
+    readonly destroyed: EventEmitter<void>;
+    /**
+     * Emits whenever the expanded state of the accordion changes.
+     * Primarily used to facilitate two-way binding.
+     * @docs-private
+     */
+    readonly expandedChange: i0.OutputEmitterRef<boolean>;
+    /** Unregister function for expansionDispatcher. */
+    private removeUniqueSelectionListener;
+    /** Subscription to openAll/closeAll events. */
+    private openCloseAllSubscription;
+    constructor();
+    /** Emits an event for the accordion item being destroyed. */
+    ngOnDestroy(): void;
+    focus(): void;
+    /** Toggles the expanded state of the accordion item. */
+    toggle(): void;
+    /** Sets the expanded state of the accordion item to false. */
+    close(): void;
+    /** Sets the expanded state of the accordion item to true. */
+    open(): void;
+    getState(): any;
+    disableAnimation(): void;
+    enableAnimation(): void;
+    private subscribeToOpenCloseAllActions;
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqAccordionItem, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<KbqAccordionItem, "kbq-accordion-item, [kbq-accordion-item]", never, { "expanded": { "alias": "expanded"; "required": false; }; "value": { "alias": "value"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; }, { "closed": "closed"; "opened": "opened"; "expandedChange": "expandedChange"; }, ["trigger", "triggerComponent", "content"], never, true, never>;
+    static ngAcceptInputType_expanded: unknown;
+    static ngAcceptInputType_disabled: unknown;
+}
+
+declare class KbqAccordionContentDirective implements AfterContentInit, AfterViewInit {
+    private readonly renderer;
+    private readonly platform;
+    /** @docs-private */
+    protected readonly nativeElement: HTMLElement;
+    /** @docs-private */
+    protected readonly item: KbqAccordionItem;
+    /** @docs-private */
+    get contentId(): string;
+    /** @docs-private */
+    get triggerId(): string;
+    /** @docs-private */
+    protected readonly hidden: i0.WritableSignal<boolean>;
+    private savedTransition;
+    private readonly afterRenderRef?;
+    constructor();
+    ngAfterViewInit(): void;
+    ngAfterContentInit(): void;
+    toggle(): void;
+    disableAnimation(): void;
+    enableAnimation(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqAccordionContentDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<KbqAccordionContentDirective, "[kbqAccordionContent]", ["kbqAccordionContent"], {}, {}, never, never, true, never>;
+}
+
+declare class KbqAccordionContent {
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqAccordionContent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<KbqAccordionContent, "kbq-accordion-content, [kbq-accordion-content]", never, {}, {}, never, ["*"], true, [{ directive: typeof KbqAccordionContentDirective; inputs: {}; outputs: {}; }]>;
+}
+
+declare class KbqAccordionHeaderDirective {
+    protected readonly item: KbqAccordionItem;
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqAccordionHeaderDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<KbqAccordionHeaderDirective, "[kbqAccordionHeader]", never, {}, {}, never, never, true, never>;
+}
+
+declare class KbqAccordionHeader {
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqAccordionHeader, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<KbqAccordionHeader, "kbq-accordion-header, [kbq-accordion-header]", never, {}, {}, never, never, true, [{ directive: typeof KbqAccordionHeaderDirective; inputs: {}; outputs: {}; }]>;
+}
+
+declare class KbqAccordionModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqAccordionModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<KbqAccordionModule, never, [typeof i1.KbqIcon, typeof KbqAccordion, typeof KbqAccordionContent, typeof KbqAccordionHeader, typeof KbqAccordionItem, typeof KbqAccordionTrigger], [typeof KbqAccordion, typeof KbqAccordionContent, typeof KbqAccordionHeader, typeof KbqAccordionItem, typeof KbqAccordionTrigger]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<KbqAccordionModule>;
+}
+
+export { KbqAccordion, KbqAccordionContent, KbqAccordionContentDirective, KbqAccordionHeader, KbqAccordionHeaderDirective, KbqAccordionItem, KbqAccordionModule, KbqAccordionTrigger, KbqAccordionTriggerDirective, KbqAccordionVariant };
+export type { KbqAccordionItemState, KbqAccordionOrientation, KbqAccordionType };

package/actions-panel/index.d.ts

@@ -1,5 +1,304 @@
-export * from './actions-panel';
-export * from './actions-panel-config';
-export * from './actions-panel-container';
-export * from './actions-panel-ref';
-export * from './module';
+import { Overlay, ScrollStrategy, OverlayRef, ComponentType } from '@angular/cdk/overlay';
+import * as i0 from '@angular/core';
+import { Injector, ElementRef, InjectionToken, Provider, OnDestroy, EventEmitter, TemplateRef } from '@angular/core';
+import { Direction } from '@angular/cdk/bidi';
+import { CdkDialogContainer, DialogRef } from '@angular/cdk/dialog';
+import { Observable } from 'rxjs';
+import { AnimationEvent } from '@angular/animations';
+import { KbqActionsPanelLocaleConfiguration } from '@koobiq/components/core';
+
+/** Injection token that can be used to specify default actions panel config. */
+declare const KBQ_ACTIONS_PANEL_DEFAULT_CONFIG: InjectionToken<KbqActionsPanelConfig<unknown>>;
+/**
+ * Utility for providing default actions panel config.
+ *
+ * @see `KBQ_ACTIONS_PANEL_DEFAULT_CONFIG`
+ */
+declare const kbqActionsPanelDefaultConfigProvider: <D>(config: KbqActionsPanelConfig<D>) => Provider;
+/**
+ * Configuration for opened actions panel.
+ * Based on cdk `DialogConfig`.
+ *
+ * @see `DialogConfig`
+ *
+ */
+declare class KbqActionsPanelConfig<D = unknown> {
+    /**
+     * Injector used for the instantiation of the component to be attached.
+     */
+    injector?: Injector;
+    /**
+     * Data being injected into the child component.
+     *
+     * @see `KBQ_ACTIONS_PANEL_DATA`
+     */
+    data?: D | null;
+    /** Extra CSS classes to be added to the actions panel container. */
+    containerClass?: string | string[];
+    /**
+     * Whether the actions panel should be closed of when the user goes backwards/forwards in history.
+     * NOTE! This does not apply to router navigation.
+     *
+     * @default true
+     */
+    closeOnNavigation?: boolean;
+    /**
+     * Element in which the actions panel overlay will be connected to.
+     */
+    overlayContainer?: ElementRef<HTMLElement>;
+    /**
+     * Extra CSS classes to be added to the overlay panel.
+     */
+    overlayPanelClass?: string | string[];
+    /**
+     * Width of the actions panel.
+     */
+    width?: string;
+    /**
+     * Min-width of the actions panel.
+     * If a number is provided, assumes pixel units.
+     */
+    minWidth?: number | string;
+    /**
+     * Max-width of the actions panel.
+     * If a number is provided, assumes pixel units.
+     *
+     * NOTE: this property is ignored if the `overlayContainer` property is provided, and will be calculated based on
+     * the width of the `overlayContainer`.
+     */
+    maxWidth?: number | string;
+    /**
+     * Direction of the text in the actions panel.
+     *
+     * @default 'ltr'
+     */
+    direction?: Direction;
+    /**
+     * Scroll strategy to be used for the actions panel.
+     *
+     * @default `RepositionScrollStrategy`
+     */
+    scrollStrategy?: (overlay: Overlay) => ScrollStrategy;
+    /**
+     * Whether the user can use ESC or click on close button to close the actions panel.
+     *
+     * @default false
+     */
+    disableClose?: boolean;
+}
+
+/** Localization configuration provider. */
+declare const KBQ_ACTIONS_PANEL_LOCALE_CONFIGURATION: InjectionToken<KbqActionsPanelLocaleConfiguration>;
+/** Utility provider for `KBQ_ACTIONS_PANEL_LOCALE_CONFIGURATION`. */
+declare const kbqActionsPanelLocaleConfigurationProvider: (configuration: KbqActionsPanelLocaleConfiguration) => Provider;
+/**
+ * Internal component that wraps user-provided actions panel content.
+ *
+ * @docs-private
+ */
+declare class KbqActionsPanelContainer extends CdkDialogContainer implements OnDestroy {
+    /**
+     * The state of the actions panel animations.
+     *
+     * @docs-private
+     */
+    protected animationState: 'void' | 'visible' | 'hidden';
+    /**
+     * Emits whenever the state of the animation changes.
+     *
+     * @docs-private
+     */
+    readonly animationStateChanged: EventEmitter<AnimationEvent>;
+    /** Whether the actions panel container has been destroyed. */
+    private destroyed;
+    /**
+     * Actions panel configuration.
+     *
+     * @docs-private
+     */
+    protected readonly config: KbqActionsPanelConfig<any>;
+    private readonly actionsPanel;
+    private readonly renderer;
+    private readonly localeService;
+    /**
+     * Actions panel locale configuration.
+     *
+     * @docs-private
+     */
+    protected readonly localeConfiguration: i0.Signal<KbqActionsPanelLocaleConfiguration | undefined>;
+    ngOnDestroy(): void;
+    /**
+     * Close the actions panel.
+     *
+     * @docs-private
+     */
+    protected close(): void;
+    /**
+     * Start animation of the actions panel entrance into view.
+     *
+     * @docs-private
+     */
+    startOpenAnimation(): void;
+    /**
+     * Start animation of the actions panel exiting from view.
+     *
+     * @docs-private
+     */
+    startCloseAnimation(): void;
+    /**
+     * Handles animation done events.
+     *
+     * @docs-private
+     */
+    protected onAnimationDone(event: AnimationEvent): void;
+    /**
+     * Handles animation start events.
+     *
+     * @docs-private
+     */
+    protected onAnimationStart(event: AnimationEvent): void;
+    /**
+     * Handles escape key events.
+     *
+     * @docs-private
+     */
+    protected handleEscape(event: KeyboardEvent): void;
+    /**
+     * @docs-private
+     */
+    protected _contentAttached(): void;
+    private applyContainerClass;
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqActionsPanelContainer, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<KbqActionsPanelContainer, "kbq-actions-panel-container", never, {}, {}, never, never, true, never>;
+}
+
+/**
+ * Reference to actions panel opened by `KbqActionsPanel` service.
+ */
+declare class KbqActionsPanelRef<I = unknown, R = unknown> {
+    private readonly dialogRef;
+    /**
+     * Instance of the component into which the actions panel content is projected.
+     *
+     * @docs-private
+     */
+    containerInstance: KbqActionsPanelContainer;
+    /** Gets an observable that is notified when the actions panel is finished closing. */
+    get afterClosed(): Observable<R | undefined>;
+    /** Gets an observable that emits when keydown events are targeted on the overlay. */
+    get keydownEvents(): Observable<KeyboardEvent>;
+    /** Gets an observable that is notified when the actions panel has opened and appeared. */
+    get afterOpened(): Observable<void>;
+    /**
+     * Gets the overlay reference for the actions panel.
+     *
+     * @docs-private
+     */
+    get overlayRef(): OverlayRef;
+    /**
+     * Gets the ID of the actions panel.
+     *
+     * @docs-private
+     */
+    get id(): string;
+    private readonly _afterOpened;
+    /** Result to be passed down to the `afterClosed` stream. */
+    private result;
+    /** Handle to the timeout that's running as a fallback in case the close animation doesn't fire. */
+    private closeAnimationFallbackTimeout;
+    constructor(dialogRef: DialogRef<R, I>, containerInstance: KbqActionsPanelContainer);
+    /** Closes the actions panel. */
+    close(result?: R): void;
+    private handleAnimation;
+    private handleOverlayDetachments;
+}
+
+/** Injection token that can be used to access the data that was passed in to actions panel. */
+declare const KBQ_ACTIONS_PANEL_DATA: InjectionToken<unknown>;
+/**
+ * Context for actions panel template.
+ */
+type KbqActionsPanelTemplateContext<T = unknown, D = unknown, R = unknown> = {
+    /**
+     * Data passed to actions panel.
+     *
+     * Example:
+     *
+     * ```html
+     * <ng-template #actionsPanel let-data>{{ data.KEY }}</ng-template>
+     * ````
+     */
+    $implicit?: D | null;
+    /**
+     * Data passed to actions panel.
+     *
+     * Example:
+     *
+     * ```html
+     * <ng-template #actionsPanel let-data="data">{{ data.KEY }}</ng-template>
+     * ````
+     */
+    data?: D | null;
+    /**
+     * Opened actions panel reference.
+     *
+     * Example:
+     *
+     * ```html
+     * <ng-template #actionsPanel let-actionsPanelRef="actionsPanelRef">
+     *   <button (click)="actionsPanelRef.close()">close</button>
+     * </ng-template>
+     * ````
+     */
+    actionsPanelRef: KbqActionsPanelRef<T, R>;
+};
+/**
+ * Selector for actions panel overlay.
+ *
+ * @docs-private
+ */
+declare const KBQ_ACTIONS_PANEL_OVERLAY_SELECTOR = "kbq-actions-panel-overlay";
+/**
+ * Service for opening actions panel.
+ */
+declare class KbqActionsPanel implements OnDestroy {
+    private readonly injector;
+    private readonly overlay;
+    private readonly dialog;
+    private readonly defaultConfig;
+    private readonly resizeObserver;
+    /** The reference to the currently opened actions panel. */
+    private openedActionsPanelRef;
+    ngOnDestroy(): void;
+    /**
+     * Opens actions panel.
+     *
+     * @param componentOrTemplateRef Component to be opened into the actions panel.
+     * @param config Additional configuration options for the actions panel.
+     * @returns A reference to the opened actions panel.
+     */
+    open<T, D = unknown, R = unknown>(component: ComponentType<T>, config?: KbqActionsPanelConfig<D>): KbqActionsPanelRef<T, R>;
+    /**
+     * Opens actions panel.
+     *
+     * @param template TemplateRef to be used as the content.
+     * @param config Additional configuration options for the actions panel.
+     * @returns A reference to the opened actions panel.
+     */
+    open<T, D = unknown, R = unknown>(template: TemplateRef<T>, config?: KbqActionsPanelConfig<D>): KbqActionsPanelRef<T, R>;
+    /** Closes the currently opened actions panel. */
+    close<R>(result?: R): void;
+    private openDialog;
+    private syncOverlayMaxWidth;
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqActionsPanel, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<KbqActionsPanel>;
+}
+
+declare class KbqActionsPanelModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqActionsPanelModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<KbqActionsPanelModule, never, [typeof KbqActionsPanelContainer], [typeof KbqActionsPanelContainer]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<KbqActionsPanelModule>;
+}
+
+export { KBQ_ACTIONS_PANEL_DATA, KBQ_ACTIONS_PANEL_DEFAULT_CONFIG, KBQ_ACTIONS_PANEL_LOCALE_CONFIGURATION, KBQ_ACTIONS_PANEL_OVERLAY_SELECTOR, KbqActionsPanel, KbqActionsPanelConfig, KbqActionsPanelContainer, KbqActionsPanelModule, KbqActionsPanelRef, kbqActionsPanelDefaultConfigProvider, kbqActionsPanelLocaleConfigurationProvider };
+export type { KbqActionsPanelTemplateContext };

package/alert/_alert-theme.scss

@@ -13,10 +13,6 @@
 }
 
 @mixin kbq-alert-theme() {
-    .kbq-alert__close:focus {
-        outline: none;
-    }
-
     .kbq-alert.kbq-alert_default {
         &.kbq-alert_error {
             @include kbq-alert-style(default, error);

package/alert/alert-tokens.scss

@@ -40,16 +40,16 @@
     --kbq-alert-size-compact-no-title-icon-margin-top: var(--kbq-size-m);
     --kbq-alert-size-compact-no-title-icon-padding-top: var(--kbq-size-3xs);
     /* THEME TOKENS */
-    --kbq-alert-default-error-container-background: var(--kbq-background-contrast-fade);
+    --kbq-alert-default-error-container-background: var(--kbq-background-contrast-less);
     --kbq-alert-default-error-container-title: var(--kbq-foreground-contrast);
     --kbq-alert-default-error-container-text: var(--kbq-foreground-contrast);
-    --kbq-alert-default-warning-container-background: var(--kbq-background-contrast-fade);
+    --kbq-alert-default-warning-container-background: var(--kbq-background-contrast-less);
     --kbq-alert-default-warning-container-title: var(--kbq-foreground-contrast);
     --kbq-alert-default-warning-container-text: var(--kbq-foreground-contrast);
-    --kbq-alert-default-success-container-background: var(--kbq-background-contrast-fade);
+    --kbq-alert-default-success-container-background: var(--kbq-background-contrast-less);
     --kbq-alert-default-success-container-title: var(--kbq-foreground-contrast);
     --kbq-alert-default-success-container-text: var(--kbq-foreground-contrast);
-    --kbq-alert-default-info-container-background: var(--kbq-background-contrast-fade);
+    --kbq-alert-default-info-container-background: var(--kbq-background-contrast-less);
     --kbq-alert-default-info-container-title: var(--kbq-foreground-contrast);
     --kbq-alert-default-info-container-text: var(--kbq-foreground-contrast);
     --kbq-alert-colored-error-container-background: var(--kbq-background-error-less);