import * as i0 from '@angular/core';
import { InjectionToken, EventEmitter, Component, ChangeDetectionStrategy, ViewEncapsulation, Inject, ViewChild, TemplateRef, Injector, Injectable, Optional, SkipSelf, Directive, Input, booleanAttribute, NgModule } from '@angular/core';
import * as i2 from '@angular/cdk/portal';
import { BasePortalOutlet, CdkPortalOutlet, TemplatePortal, ComponentPortal, PortalModule } from '@angular/cdk/portal';
import { Subject, merge } from 'rxjs';
import { trigger, state, style, transition, animate } from '@angular/animations';
import { AnimationCurves } from '@koobiq/components/core';
import * as i3 from '@angular/cdk/a11y';
import { A11yModule, FocusTrapFactory, ConfigurableFocusTrapFactory } from '@angular/cdk/a11y';
import { ESCAPE } from '@koobiq/cdk/keycodes';
import { filter, take } from 'rxjs/operators';
import * as i1 from '@angular/cdk/overlay';
import { OverlayConfig, OverlayModule } from '@angular/cdk/overlay';
import * as i3$1 from '@koobiq/components/button';
import { KbqButtonModule } from '@koobiq/components/button';
import * as i4 from '@koobiq/components/icon';
import { KbqIconModule } from '@koobiq/components/icon';
import * as i5 from '@koobiq/components/title';
import { KbqTitleModule } from '@koobiq/components/title';

/** Injection token that can be used to access the data that was passed in to a sidepanel. */
const KBQ_SIDEPANEL_DATA = new InjectionToken('KbqSidepanelData');
var KbqSidepanelPosition;
(function (KbqSidepanelPosition) {
    KbqSidepanelPosition["Right"] = "right";
    KbqSidepanelPosition["Left"] = "left";
    KbqSidepanelPosition["Top"] = "top";
    KbqSidepanelPosition["Bottom"] = "bottom";
})(KbqSidepanelPosition || (KbqSidepanelPosition = {}));
var KbqSidepanelSize;
(function (KbqSidepanelSize) {
    KbqSidepanelSize["Small"] = "small";
    KbqSidepanelSize["Medium"] = "medium";
    KbqSidepanelSize["Large"] = "large";
})(KbqSidepanelSize || (KbqSidepanelSize = {}));
class KbqSidepanelConfig {
    constructor() {
        /** Data being injected into the child component. */
        this.data = null;
        this.position = KbqSidepanelPosition.Right;
        this.size = KbqSidepanelSize.Medium;
        /** Whether the sidepanel has a backdrop. */
        this.hasBackdrop = true;
        /** When we open multiple sidepanels, backdrop appears only once, except cases then this flag is true. */
        this.requiredBackdrop = false;
        /** Whether the user can use escape or clicking outside to close the sidepanel. */
        this.disableClose = false;
        /** Custom class for the overlay pane. */
        this.overlayPanelClass = '';
    }
}

var KbqSidepanelAnimationState;
(function (KbqSidepanelAnimationState) {
    KbqSidepanelAnimationState["Void"] = "void";
    KbqSidepanelAnimationState["Visible"] = "visible";
    KbqSidepanelAnimationState["Hidden"] = "hidden";
})(KbqSidepanelAnimationState || (KbqSidepanelAnimationState = {}));
// TODO Find a way to use dynamic keys and avoid error "Expression form not supported."
const kbqSidepanelTransformAnimation = {
    right: { in: 'translateX(100%)', out: 'translateX(0%)' },
    left: { in: 'translateX(-100%)', out: 'translateX(0%)' },
    top: { in: 'translateY(-100%)', out: 'translateY(0%)' },
    bottom: { in: 'translateY(100%)', out: 'translateY(0%)' }
};
const kbqSidepanelAnimations = {
    sidepanelState: trigger('state', [
        state('hidden', style({ transform: '{{transformIn}}' }), {
            params: { transformIn: kbqSidepanelTransformAnimation[KbqSidepanelPosition.Right].in }
        }),
        state('visible', style({ transform: '{{transformOut}}' }), {
            params: { transformOut: kbqSidepanelTransformAnimation[KbqSidepanelPosition.Right].out }
        }),
        transition('visible => void, visible => hidden', animate(`200ms ${AnimationCurves.AccelerationCurve}`)),
        transition('void => visible', animate(`200ms ${AnimationCurves.DecelerationCurve}`))
    ])
};

const KBQ_SIDEPANEL_WITH_INDENT = new InjectionToken('kbq-sidepanel-with-indent');
const KBQ_SIDEPANEL_WITH_SHADOW = new InjectionToken('kbq-sidepanel-with-shadow');
class KbqSidepanelContainerComponent extends BasePortalOutlet {
    get size() {
        return `kbq-sidepanel_${this.sidepanelConfig.size}`;
    }
    get trapFocusAutoCapture() {
        return this.sidepanelConfig.trapFocusAutoCapture ?? !!this.sidepanelConfig.hasBackdrop;
    }
    get trapFocus() {
        return this.sidepanelConfig.trapFocus ?? !!this.sidepanelConfig.hasBackdrop;
    }
    constructor(elementRef, changeDetectorRef, sidepanelConfig, withIndent, withShadow) {
        super();
        this.elementRef = elementRef;
        this.changeDetectorRef = changeDetectorRef;
        this.sidepanelConfig = sidepanelConfig;
        this.withIndent = withIndent;
        this.withShadow = withShadow;
        /** The state of the sidepanel animations. */
        this.animationState = KbqSidepanelAnimationState.Void;
        /** Emits whenever the state of the animation changes. */
        this.animationStateChanged = new EventEmitter();
        /** @docs-private */
        this.indentClickEmitter = new Subject();
    }
    ngOnDestroy() {
        this.destroyed = true;
    }
    /**
     * Gets an observable that emits when the indent has been clicked.
     *
     * @docs-private
     */
    indentClick() {
        return this.indentClickEmitter.asObservable();
    }
    /** Attach a component portal as content to this sidepanel container. */
    attachComponentPortal(portal) {
        this.validatePortalAttached();
        this.setAnimation();
        this.setPanelClass();
        return this.portalOutlet.attachComponentPortal(portal);
    }
    /** Attach a template portal as content to this sidepanel container. */
    attachTemplatePortal(portal) {
        this.validatePortalAttached();
        this.setAnimation();
        this.setPanelClass();
        return this.portalOutlet.attachTemplatePortal(portal);
    }
    /** Begin animation of the sidepanel entrance into view. */
    enter() {
        if (this.destroyed) {
            return;
        }
        this.animationState = KbqSidepanelAnimationState.Visible;
        this.changeDetectorRef.detectChanges();
    }
    /** Begin animation of the sidepanel exiting from view. */
    exit() {
        if (this.destroyed) {
            return;
        }
        this.animationState = KbqSidepanelAnimationState.Hidden;
        this.changeDetectorRef.markForCheck();
    }
    onAnimation(event) {
        this.animationStateChanged.emit(event);
    }
    setAnimation() {
        const position = this.sidepanelConfig.position;
        this.animationTransform = {
            transformIn: kbqSidepanelTransformAnimation[position].in,
            transformOut: kbqSidepanelTransformAnimation[position].out
        };
    }
    setPanelClass() {
        const element = this.elementRef.nativeElement;
        const position = this.sidepanelConfig.position;
        element.classList.add(`kbq-sidepanel-container_${position}`);
    }
    validatePortalAttached() {
        if (this.portalOutlet.hasAttached()) {
            throw Error('Attempting to attach sidepanel content after content is already attached');
        }
    }
    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: KbqSidepanelContainerComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: KbqSidepanelConfig }, { token: KBQ_SIDEPANEL_WITH_INDENT }, { token: KBQ_SIDEPANEL_WITH_SHADOW }], target: i0.ɵɵFactoryTarget.Component }); }
    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: KbqSidepanelContainerComponent, selector: "kbq-sidepanel-container", host: { listeners: { "@state.start": "onAnimation($event)", "@state.done": "onAnimation($event)" }, properties: { "class": "size", "class.kbq-sidepanel_nested": "withIndent", "class.kbq-sidepanel-container_shadowed": "withShadow", "attr.id": "id", "attr.tabindex": "-1", "@state": "{\n            value: animationState,\n            params: animationTransform\n        }" }, classAttribute: "kbq-sidepanel-container" }, viewQueries: [{ propertyName: "portalOutlet", first: true, predicate: CdkPortalOutlet, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"kbq-sidepanel-wrapper\">\n    @if (withIndent) {\n        <div class=\"kbq-sidepanel-indent\" (click)=\"indentClickEmitter.next($event)\"></div>\n    }\n\n    <div class=\"kbq-sidepanel-content\" [cdkTrapFocus]=\"trapFocus\" [cdkTrapFocusAutoCapture]=\"trapFocusAutoCapture\">\n        <ng-template cdkPortalOutlet />\n    </div>\n</div>\n", styles: ["@keyframes kbq-progress{0%{background-position:0 0}to{background-position:64px 0}}.kbq-progress{position:relative}.kbq-progress:after{content:\"\";position:absolute;border-radius:inherit;inset:0;background:linear-gradient(135deg,#0000000a 12px,#ffffff1a 12px 22px,#0000000a 22px 34px,#ffffff1a 34px) repeat;background-size:32px 32px;animation:kbq-progress 1s linear infinite}.kbq-group{display:flex;flex-direction:row}.kbq-group .kbq-group_justified>.kbq-group-item{width:100%}.kbq-group .kbq-group-item+.kbq-group-item{margin-left:calc(-1 * var(--kbq-size-border-width))}.kbq-group>.kbq-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-top-right-radius:0}.kbq-group>.kbq-group-item:first-child:not(:last-child)>.kbq-form-field__container{border-bottom-right-radius:0;border-top-right-radius:0}.kbq-group>.kbq-group-item:last-child:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0}.kbq-group>.kbq-group-item:last-child:not(:first-child)>.kbq-form-field__container{border-bottom-left-radius:0;border-top-left-radius:0}.kbq-group>.kbq-group-item:not(:first-child):not(:last-child){border-radius:0}.kbq-group>.kbq-group-item:not(:first-child):not(:last-child)>.kbq-form-field__container{border-radius:0}.kbq-vertical-group{display:flex;flex-direction:column}.kbq-vertical-group>.kbq-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-bottom-left-radius:0;border-top-right-radius:var(--kbq-size-border-radius)}.kbq-vertical-group>.kbq-group-item:first-child:not(:last-child)>.kbq-form-field__container{border-bottom-right-radius:0;border-bottom-left-radius:0}.kbq-vertical-group>.kbq-group-item:last-child:not(:first-child){border-top-right-radius:0;border-top-left-radius:0;border-bottom-left-radius:var(--kbq-size-border-radius)}.kbq-vertical-group>.kbq-group-item:last-child:not(:first-child)>.kbq-form-field__container{border-top-right-radius:0;border-top-left-radius:0}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child){border-radius:0}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child)>.kbq-form-field__container{border-radius:0}.kbq-vertical-group .kbq-group-item+.kbq-group-item{margin-top:calc(-1 * var(--kbq-size-border-width))}.kbq-truncate-line{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kbq-no-select{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.kbq-sidepanel-container_top,.kbq-sidepanel-container_bottom{flex-direction:column;height:33%;min-height:400px;width:100%;left:0}.kbq-sidepanel-container_top .kbq-sidepanel-indent,.kbq-sidepanel-container_bottom .kbq-sidepanel-indent{height:16px;width:100%}.kbq-sidepanel-container{outline:none;display:flex;flex:1;position:fixed;min-height:0}.kbq-sidepanel-container .flex{min-height:0}.kbq-sidepanel-container.kbq-sidepanel-container_left,.kbq-sidepanel-container.kbq-sidepanel-container_right{height:100%;top:0;max-width:100%}.kbq-sidepanel-container.kbq-sidepanel-container_left.kbq-sidepanel_small,.kbq-sidepanel-container.kbq-sidepanel-container_right.kbq-sidepanel_small{width:var(--kbq-sidepanel-size-small-width);max-width:var(--kbq-sidepanel-size-small-width)}.kbq-sidepanel-container.kbq-sidepanel-container_left.kbq-sidepanel_medium,.kbq-sidepanel-container.kbq-sidepanel-container_right.kbq-sidepanel_medium{width:var(--kbq-sidepanel-size-medium-width);max-width:var(--kbq-sidepanel-size-medium-width)}.kbq-sidepanel-container.kbq-sidepanel-container_left.kbq-sidepanel_large,.kbq-sidepanel-container.kbq-sidepanel-container_right.kbq-sidepanel_large{width:var(--kbq-sidepanel-size-large-width)}.kbq-sidepanel-container.kbq-sidepanel-container_left .kbq-sidepanel-indent,.kbq-sidepanel-container.kbq-sidepanel-container_right .kbq-sidepanel-indent{width:16px;height:100%}.kbq-sidepanel-container_right{right:0;transform:translate(100%)}.kbq-sidepanel-container_right .kbq-sidepanel-wrapper{flex-direction:row}.kbq-sidepanel-container_left{left:0;transform:translate(-100%)}.kbq-sidepanel-container_left .kbq-sidepanel-wrapper{flex-direction:row-reverse}.kbq-sidepanel-container_top{top:0;transform:translateY(-100%)}.kbq-sidepanel-container_top .kbq-sidepanel-wrapper{flex-direction:column-reverse}.kbq-sidepanel-container_bottom{bottom:0;transform:translateY(100%)}.kbq-sidepanel-container_bottom .kbq-sidepanel-wrapper{flex-direction:column}.kbq-sidepanel-wrapper{display:flex;flex:1;min-height:0;width:100%}.kbq-sidepanel-indent{display:flex;flex:0 0 auto}.kbq-sidepanel-content{display:flex;flex-direction:column;flex:1;min-height:0;min-width:0;width:100%}.kbq-sidepanel-header{display:flex;align-items:baseline;justify-content:space-between;flex-flow:row nowrap;flex:0 0 auto;padding:var(--kbq-sidepanel-size-header-padding-vertical) var(--kbq-sidepanel-size-header-padding-right) var(--kbq-sidepanel-size-header-padding-vertical) var(--kbq-sidepanel-size-header-padding-left)}.kbq-sidepanel-header .kbq-sidepanel-close{margin-left:var(--kbq-sidepanel-size-close-button-margin-left)}.kbq-sidepanel-header.kbq-sidepanel-header_truncate-text{align-items:center}.kbq-sidepanel-header.kbq-sidepanel-header_truncate-text .kbq-sidepanel-title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kbq-sidepanel-title{flex:1}.kbq-sidepanel-body{overflow-y:auto;display:flex;flex:1;flex-direction:column;min-height:0;padding-top:var(--kbq-sidepanel-size-content-padding-top);padding-right:var(--kbq-sidepanel-size-content-padding-horizontal);padding-left:var(--kbq-sidepanel-size-content-padding-horizontal);padding-bottom:var(--kbq-sidepanel-size-content-padding-bottom)}.kbq-sidepanel-footer{display:flex;align-items:center;justify-content:space-between;flex-flow:row nowrap;flex:0 0 auto;padding:var(--kbq-sidepanel-size-footer-padding-top) var(--kbq-sidepanel-size-footer-padding-horizontal) var(--kbq-sidepanel-size-footer-padding-bottom)}.kbq-sidepanel-footer .kbq-sidepanel-actions{display:flex;align-items:center;flex-direction:row;flex:1;gap:var(--kbq-sidepanel-size-footer-content-gap-horizontal)}.kbq-sidepanel-footer .kbq-sidepanel-actions[align=left]{justify-content:start}.kbq-sidepanel-footer .kbq-sidepanel-actions[align=right]{justify-content:flex-end}.kbq-sidepanel-title{color:var(--kbq-sidepanel-header-text-color)}.kbq-sidepanel-content{background-color:var(--kbq-sidepanel-container-background);color:var(--kbq-sidepanel-content-text-color)}.kbq-sidepanel-container_shadowed .kbq-sidepanel-content{box-shadow:var(--kbq-sidepanel-container-shadow)}.kbq-sidepanel-title{font-size:var(--kbq-typography-title-font-size);font-style:var(--kbq-typography-title-font-style);font-weight:var(--kbq-typography-title-font-weight);line-height:var(--kbq-typography-title-line-height);font-family:var(--kbq-typography-title-font-family);text-transform:var(--kbq-typography-title-text-transform);font-feature-settings:var(--kbq-typography-title-font-feature-settings);letter-spacing:var(--kbq-typography-title-letter-spacing)}.kbq-sidepanel-container,.kbq-sidepanel-footer{font-size:var(--kbq-typography-text-normal-font-size);font-style:var(--kbq-typography-text-normal-font-style);font-weight:var(--kbq-typography-text-normal-font-weight);line-height:var(--kbq-typography-text-normal-line-height);font-family:var(--kbq-typography-text-normal-font-family);text-transform:var(--kbq-typography-text-normal-text-transform);font-feature-settings:var(--kbq-typography-text-normal-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-letter-spacing)}\n", ".kbq-sidepanel-container{--kbq-sidepanel-size-small-width: 400px;--kbq-sidepanel-size-medium-width: 640px;--kbq-sidepanel-size-large-width: 960px;--kbq-sidepanel-size-header-padding-vertical: var(--kbq-size-l);--kbq-sidepanel-size-header-padding-left: var(--kbq-size-xxl);--kbq-sidepanel-size-header-padding-right: var(--kbq-size-l);--kbq-sidepanel-size-close-button-margin-left: var(--kbq-size-s);--kbq-sidepanel-size-content-padding-horizontal: var(--kbq-size-xxl);--kbq-sidepanel-size-content-padding-bottom: var(--kbq-size-xxl);--kbq-sidepanel-size-content-padding-top: 1px;--kbq-sidepanel-size-footer-padding-top: var(--kbq-size-s);--kbq-sidepanel-size-footer-padding-bottom: var(--kbq-size-3xl);--kbq-sidepanel-size-footer-padding-horizontal: var(--kbq-size-xxl);--kbq-sidepanel-size-footer-content-gap-horizontal: var(--kbq-size-l);--kbq-sidepanel-overlay-background: var(--kbq-background-overlay);--kbq-sidepanel-container-background: var(--kbq-background-card);--kbq-sidepanel-container-shadow: var(--kbq-shadow-overlay);--kbq-sidepanel-header-text-color: var(--kbq-foreground-contrast);--kbq-sidepanel-content-text-color: var(--kbq-foreground-contrast)}\n"], dependencies: [{ kind: "directive", type: i2.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { kind: "directive", type: i3.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }], animations: [kbqSidepanelAnimations.sidepanelState], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: KbqSidepanelContainerComponent, decorators: [{
            type: Component,
            args: [{ selector: 'kbq-sidepanel-container', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, animations: [kbqSidepanelAnimations.sidepanelState], host: {
                        class: 'kbq-sidepanel-container',
                        '[class]': 'size',
                        '[class.kbq-sidepanel_nested]': 'withIndent',
                        '[class.kbq-sidepanel-container_shadowed]': 'withShadow',
                        '[attr.id]': 'id',
                        '[attr.tabindex]': '-1',
                        '[@state]': `{
            value: animationState,
            params: animationTransform
        }`,
                        '(@state.start)': 'onAnimation($event)',
                        '(@state.done)': 'onAnimation($event)'
                    }, template: "<div class=\"kbq-sidepanel-wrapper\">\n    @if (withIndent) {\n        <div class=\"kbq-sidepanel-indent\" (click)=\"indentClickEmitter.next($event)\"></div>\n    }\n\n    <div class=\"kbq-sidepanel-content\" [cdkTrapFocus]=\"trapFocus\" [cdkTrapFocusAutoCapture]=\"trapFocusAutoCapture\">\n        <ng-template cdkPortalOutlet />\n    </div>\n</div>\n", styles: ["@keyframes kbq-progress{0%{background-position:0 0}to{background-position:64px 0}}.kbq-progress{position:relative}.kbq-progress:after{content:\"\";position:absolute;border-radius:inherit;inset:0;background:linear-gradient(135deg,#0000000a 12px,#ffffff1a 12px 22px,#0000000a 22px 34px,#ffffff1a 34px) repeat;background-size:32px 32px;animation:kbq-progress 1s linear infinite}.kbq-group{display:flex;flex-direction:row}.kbq-group .kbq-group_justified>.kbq-group-item{width:100%}.kbq-group .kbq-group-item+.kbq-group-item{margin-left:calc(-1 * var(--kbq-size-border-width))}.kbq-group>.kbq-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-top-right-radius:0}.kbq-group>.kbq-group-item:first-child:not(:last-child)>.kbq-form-field__container{border-bottom-right-radius:0;border-top-right-radius:0}.kbq-group>.kbq-group-item:last-child:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0}.kbq-group>.kbq-group-item:last-child:not(:first-child)>.kbq-form-field__container{border-bottom-left-radius:0;border-top-left-radius:0}.kbq-group>.kbq-group-item:not(:first-child):not(:last-child){border-radius:0}.kbq-group>.kbq-group-item:not(:first-child):not(:last-child)>.kbq-form-field__container{border-radius:0}.kbq-vertical-group{display:flex;flex-direction:column}.kbq-vertical-group>.kbq-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-bottom-left-radius:0;border-top-right-radius:var(--kbq-size-border-radius)}.kbq-vertical-group>.kbq-group-item:first-child:not(:last-child)>.kbq-form-field__container{border-bottom-right-radius:0;border-bottom-left-radius:0}.kbq-vertical-group>.kbq-group-item:last-child:not(:first-child){border-top-right-radius:0;border-top-left-radius:0;border-bottom-left-radius:var(--kbq-size-border-radius)}.kbq-vertical-group>.kbq-group-item:last-child:not(:first-child)>.kbq-form-field__container{border-top-right-radius:0;border-top-left-radius:0}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child){border-radius:0}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child)>.kbq-form-field__container{border-radius:0}.kbq-vertical-group .kbq-group-item+.kbq-group-item{margin-top:calc(-1 * var(--kbq-size-border-width))}.kbq-truncate-line{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kbq-no-select{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.kbq-sidepanel-container_top,.kbq-sidepanel-container_bottom{flex-direction:column;height:33%;min-height:400px;width:100%;left:0}.kbq-sidepanel-container_top .kbq-sidepanel-indent,.kbq-sidepanel-container_bottom .kbq-sidepanel-indent{height:16px;width:100%}.kbq-sidepanel-container{outline:none;display:flex;flex:1;position:fixed;min-height:0}.kbq-sidepanel-container .flex{min-height:0}.kbq-sidepanel-container.kbq-sidepanel-container_left,.kbq-sidepanel-container.kbq-sidepanel-container_right{height:100%;top:0;max-width:100%}.kbq-sidepanel-container.kbq-sidepanel-container_left.kbq-sidepanel_small,.kbq-sidepanel-container.kbq-sidepanel-container_right.kbq-sidepanel_small{width:var(--kbq-sidepanel-size-small-width);max-width:var(--kbq-sidepanel-size-small-width)}.kbq-sidepanel-container.kbq-sidepanel-container_left.kbq-sidepanel_medium,.kbq-sidepanel-container.kbq-sidepanel-container_right.kbq-sidepanel_medium{width:var(--kbq-sidepanel-size-medium-width);max-width:var(--kbq-sidepanel-size-medium-width)}.kbq-sidepanel-container.kbq-sidepanel-container_left.kbq-sidepanel_large,.kbq-sidepanel-container.kbq-sidepanel-container_right.kbq-sidepanel_large{width:var(--kbq-sidepanel-size-large-width)}.kbq-sidepanel-container.kbq-sidepanel-container_left .kbq-sidepanel-indent,.kbq-sidepanel-container.kbq-sidepanel-container_right .kbq-sidepanel-indent{width:16px;height:100%}.kbq-sidepanel-container_right{right:0;transform:translate(100%)}.kbq-sidepanel-container_right .kbq-sidepanel-wrapper{flex-direction:row}.kbq-sidepanel-container_left{left:0;transform:translate(-100%)}.kbq-sidepanel-container_left .kbq-sidepanel-wrapper{flex-direction:row-reverse}.kbq-sidepanel-container_top{top:0;transform:translateY(-100%)}.kbq-sidepanel-container_top .kbq-sidepanel-wrapper{flex-direction:column-reverse}.kbq-sidepanel-container_bottom{bottom:0;transform:translateY(100%)}.kbq-sidepanel-container_bottom .kbq-sidepanel-wrapper{flex-direction:column}.kbq-sidepanel-wrapper{display:flex;flex:1;min-height:0;width:100%}.kbq-sidepanel-indent{display:flex;flex:0 0 auto}.kbq-sidepanel-content{display:flex;flex-direction:column;flex:1;min-height:0;min-width:0;width:100%}.kbq-sidepanel-header{display:flex;align-items:baseline;justify-content:space-between;flex-flow:row nowrap;flex:0 0 auto;padding:var(--kbq-sidepanel-size-header-padding-vertical) var(--kbq-sidepanel-size-header-padding-right) var(--kbq-sidepanel-size-header-padding-vertical) var(--kbq-sidepanel-size-header-padding-left)}.kbq-sidepanel-header .kbq-sidepanel-close{margin-left:var(--kbq-sidepanel-size-close-button-margin-left)}.kbq-sidepanel-header.kbq-sidepanel-header_truncate-text{align-items:center}.kbq-sidepanel-header.kbq-sidepanel-header_truncate-text .kbq-sidepanel-title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kbq-sidepanel-title{flex:1}.kbq-sidepanel-body{overflow-y:auto;display:flex;flex:1;flex-direction:column;min-height:0;padding-top:var(--kbq-sidepanel-size-content-padding-top);padding-right:var(--kbq-sidepanel-size-content-padding-horizontal);padding-left:var(--kbq-sidepanel-size-content-padding-horizontal);padding-bottom:var(--kbq-sidepanel-size-content-padding-bottom)}.kbq-sidepanel-footer{display:flex;align-items:center;justify-content:space-between;flex-flow:row nowrap;flex:0 0 auto;padding:var(--kbq-sidepanel-size-footer-padding-top) var(--kbq-sidepanel-size-footer-padding-horizontal) var(--kbq-sidepanel-size-footer-padding-bottom)}.kbq-sidepanel-footer .kbq-sidepanel-actions{display:flex;align-items:center;flex-direction:row;flex:1;gap:var(--kbq-sidepanel-size-footer-content-gap-horizontal)}.kbq-sidepanel-footer .kbq-sidepanel-actions[align=left]{justify-content:start}.kbq-sidepanel-footer .kbq-sidepanel-actions[align=right]{justify-content:flex-end}.kbq-sidepanel-title{color:var(--kbq-sidepanel-header-text-color)}.kbq-sidepanel-content{background-color:var(--kbq-sidepanel-container-background);color:var(--kbq-sidepanel-content-text-color)}.kbq-sidepanel-container_shadowed .kbq-sidepanel-content{box-shadow:var(--kbq-sidepanel-container-shadow)}.kbq-sidepanel-title{font-size:var(--kbq-typography-title-font-size);font-style:var(--kbq-typography-title-font-style);font-weight:var(--kbq-typography-title-font-weight);line-height:var(--kbq-typography-title-line-height);font-family:var(--kbq-typography-title-font-family);text-transform:var(--kbq-typography-title-text-transform);font-feature-settings:var(--kbq-typography-title-font-feature-settings);letter-spacing:var(--kbq-typography-title-letter-spacing)}.kbq-sidepanel-container,.kbq-sidepanel-footer{font-size:var(--kbq-typography-text-normal-font-size);font-style:var(--kbq-typography-text-normal-font-style);font-weight:var(--kbq-typography-text-normal-font-weight);line-height:var(--kbq-typography-text-normal-line-height);font-family:var(--kbq-typography-text-normal-font-family);text-transform:var(--kbq-typography-text-normal-text-transform);font-feature-settings:var(--kbq-typography-text-normal-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-letter-spacing)}\n", ".kbq-sidepanel-container{--kbq-sidepanel-size-small-width: 400px;--kbq-sidepanel-size-medium-width: 640px;--kbq-sidepanel-size-large-width: 960px;--kbq-sidepanel-size-header-padding-vertical: var(--kbq-size-l);--kbq-sidepanel-size-header-padding-left: var(--kbq-size-xxl);--kbq-sidepanel-size-header-padding-right: var(--kbq-size-l);--kbq-sidepanel-size-close-button-margin-left: var(--kbq-size-s);--kbq-sidepanel-size-content-padding-horizontal: var(--kbq-size-xxl);--kbq-sidepanel-size-content-padding-bottom: var(--kbq-size-xxl);--kbq-sidepanel-size-content-padding-top: 1px;--kbq-sidepanel-size-footer-padding-top: var(--kbq-size-s);--kbq-sidepanel-size-footer-padding-bottom: var(--kbq-size-3xl);--kbq-sidepanel-size-footer-padding-horizontal: var(--kbq-size-xxl);--kbq-sidepanel-size-footer-content-gap-horizontal: var(--kbq-size-l);--kbq-sidepanel-overlay-background: var(--kbq-background-overlay);--kbq-sidepanel-container-background: var(--kbq-background-card);--kbq-sidepanel-container-shadow: var(--kbq-shadow-overlay);--kbq-sidepanel-header-text-color: var(--kbq-foreground-contrast);--kbq-sidepanel-content-text-color: var(--kbq-foreground-contrast)}\n"] }]
        }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: KbqSidepanelConfig }, { type: undefined, decorators: [{
                    type: Inject,
                    args: [KBQ_SIDEPANEL_WITH_INDENT]
                }] }, { type: undefined, decorators: [{
                    type: Inject,
                    args: [KBQ_SIDEPANEL_WITH_SHADOW]
                }] }], propDecorators: { portalOutlet: [{
                type: ViewChild,
                args: [CdkPortalOutlet, { static: true }]
            }] } });

// Counter for unique sidepanel ids.
let uniqueId = 0;
class KbqSidepanelRef {
    constructor(containerInstance, overlayRef, config) {
        this.containerInstance = containerInstance;
        this.overlayRef = overlayRef;
        this.config = config;
        /** Subject for notifying the user that the sidepanel has been closed and dismissed. */
        this.afterClosed$ = new Subject();
        /** Subject for notifying the user that the sidepanel has opened and appeared. */
        this.afterOpened$ = new Subject();
        this.id = this.config.id || `kbq-sidepanel-${uniqueId++}`;
        this.containerInstance.id = this.id;
        // Emit when opening animation completes
        containerInstance.animationStateChanged
            .pipe(filter((event) => event.phaseName === 'done' && event.toState === KbqSidepanelAnimationState.Visible), take(1))
            .subscribe(() => {
            this.afterOpened$.next();
            this.afterOpened$.complete();
        });
        // Dispose overlay when closing animation is complete
        containerInstance.animationStateChanged
            .pipe(filter((event) => event.phaseName === 'done' && event.toState === KbqSidepanelAnimationState.Hidden), take(1))
            .subscribe(() => {
            overlayRef.dispose();
            this.afterClosed$.next(this.result);
            this.afterClosed$.complete();
        });
        merge(overlayRef.backdropClick(), overlayRef.keydownEvents().pipe(
        // keyCode is deprecated, but IE11 and Edge don't support code property, which we need use instead
        filter((event) => event.keyCode === ESCAPE)), this.containerInstance.indentClick()).subscribe(() => {
            if (this.config.disableClose)
                return;
            this.close();
        });
    }
    close(result) {
        if (!this.afterClosed$.closed) {
            // Transition the backdrop in parallel to the sidepanel.
            this.containerInstance.animationStateChanged
                .pipe(filter((event) => event.phaseName === 'done'), take(1))
                .subscribe(() => this.overlayRef.detachBackdrop());
            this.result = result;
            this.containerInstance.exit();
        }
    }
    /** Gets an observable that is notified when the sidepanel is finished closing. */
    afterClosed() {
        return this.afterClosed$.asObservable();
    }
    /** Gets an observable that is notified when the sidepanel has opened and appeared. */
    afterOpened() {
        return this.afterOpened$.asObservable();
    }
}

/** Injection token that can be used to specify default sidepanel options. */
const KBQ_SIDEPANEL_DEFAULT_OPTIONS = new InjectionToken('kbq-sidepanel-default-options');
class KbqSidepanelService {
    /** Keeps track of the currently-open sidepanels. */
    get openedSidepanels() {
        return this.parentSidepanelService
            ? this.parentSidepanelService.openedSidepanels
            : this.openedSidepanelsAtThisLevel;
    }
    constructor(overlay, injector, defaultOptions, parentSidepanelService) {
        this.overlay = overlay;
        this.injector = injector;
        this.defaultOptions = defaultOptions;
        this.parentSidepanelService = parentSidepanelService;
        this.openedSidepanelsAtThisLevel = [];
    }
    ngOnDestroy() {
        // Only close the sidepanels at this level on destroy
        // since the parent service may still be active.
        this.closeSidepanels(this.openedSidepanelsAtThisLevel);
    }
    open(componentOrTemplateRef, config) {
        const fullConfig = {
            ...(this.defaultOptions || new KbqSidepanelConfig()),
            ...config
        };
        if (fullConfig.id && this.getSidepanelById(fullConfig.id)) {
            throw Error(`Sidepanel with id "${fullConfig.id}" exists already. The sidepanel id must be unique.`);
        }
        const overlayRef = this.createOverlay(fullConfig);
        overlayRef.hostElement.classList.add('kbq-sidepanel-overlay');
        const container = this.attachContainer(overlayRef, fullConfig);
        const ref = new KbqSidepanelRef(container, overlayRef, fullConfig);
        if (componentOrTemplateRef instanceof TemplateRef) {
            container.attachTemplatePortal(new TemplatePortal(componentOrTemplateRef, null, {
                $implicit: fullConfig.data,
                sidepanelRef: ref
            }));
        }
        else {
            const portal = new ComponentPortal(componentOrTemplateRef, undefined, this.createInjector(fullConfig, ref, container));
            const contentRef = container.attachComponentPortal(portal);
            ref.instance = contentRef.instance;
        }
        this.openedSidepanels.push(ref);
        ref.afterClosed().subscribe(() => this.removeOpenSidepanel(ref));
        container.enter();
        return ref;
    }
    /**
     * Closes all of the currently-open sidepanels.
     */
    closeAll() {
        this.closeSidepanels(this.openedSidepanels);
    }
    /**
     * Finds an open sidepanel by its id.
     * @param id ID to use when looking up the sidepanel.
     */
    getSidepanelById(id) {
        return this.openedSidepanels.find((sidepanel) => sidepanel.id === id);
    }
    /**
     * Attaches the sidepanel container component to the overlay.
     */
    attachContainer(overlayRef, config) {
        const openedSidepanelsWithSamePosition = this.getOpenedSidepanelsWithSamePosition(config);
        const injector = Injector.create({
            parent: this.injector,
            providers: [
                { provide: KbqSidepanelConfig, useValue: config },
                { provide: KBQ_SIDEPANEL_WITH_INDENT, useValue: openedSidepanelsWithSamePosition.length >= 1 },
                { provide: KBQ_SIDEPANEL_WITH_SHADOW, useValue: openedSidepanelsWithSamePosition.length < 2 }
            ]
        });
        const containerPortal = new ComponentPortal(KbqSidepanelContainerComponent, undefined, injector);
        const containerRef = overlayRef.attach(containerPortal);
        return containerRef.instance;
    }
    /**
     * Creates a custom injector to be used inside the sidepanel. This allows a component loaded inside
     * of a sidepanel to close itself and, optionally, to return a value.
     * @param config Config object that is used to construct the sidepanel.
     * @param sidepanelRef Reference to the sidepanel.
     * @param sidepanelContainer Sidepanel container element that wraps all of the contents.
     * @returns The custom injector that can be used inside the sidepanel.
     */
    createInjector(config, sidepanelRef, sidepanelContainer) {
        // The KbqSidepanelContainerComponent is injected in the portal as the KbqSidepanelContainerComponent and
        // the sidepanel's content are created out of the same ViewContainerRef and as such, are siblings for injector
        // purposes. To allow the hierarchy that is expected, the KbqSidepanelContainerComponent is explicitly
        // added to the injection tokens.
        return Injector.create({
            parent: this.injector,
            providers: [
                { provide: KbqSidepanelContainerComponent, useValue: sidepanelContainer },
                { provide: KBQ_SIDEPANEL_DATA, useValue: config.data },
                { provide: KbqSidepanelRef, useValue: sidepanelRef }
            ]
        });
    }
    /**
     * Creates a new overlay and places it in the correct location.
     * @param config The user-specified sidepanel config.
     */
    createOverlay(config) {
        const overlayConfig = new OverlayConfig({
            hasBackdrop: config.hasBackdrop,
            backdropClass: this.getBackdropClass(config),
            maxWidth: '100%',
            panelClass: config.overlayPanelClass,
            scrollStrategy: this.overlay.scrollStrategies.block(),
            positionStrategy: this.overlay.position().global()
        });
        return this.overlay.create(overlayConfig);
    }
    closeSidepanels(sidepanels) {
        const reversedOpenedSidepanels = [...sidepanels.reverse()];
        reversedOpenedSidepanels.forEach((sidepanelRef) => sidepanelRef.close());
    }
    getBackdropClass(config) {
        if (config.hasBackdrop && config.backdropClass) {
            return config.backdropClass;
        }
        const hasOpenedSidepanelWithBackdrop = this.openedSidepanels.some((sidepanelRef) => sidepanelRef.config.hasBackdrop);
        return config.requiredBackdrop || !hasOpenedSidepanelWithBackdrop
            ? 'cdk-overlay-dark-backdrop'
            : 'cdk-overlay-transparent-backdrop';
    }
    getOpenedSidepanelsWithSamePosition(config) {
        return this.openedSidepanels.filter((sidepanelRef) => sidepanelRef.config.position === config.position);
    }
    /**
     * Removes a sidepanel from the array of open sidepanels.
     * @param sidepanelRef Sidepanel to be removed.
     */
    removeOpenSidepanel(sidepanelRef) {
        const index = this.openedSidepanels.indexOf(sidepanelRef);
        if (index > -1) {
            this.openedSidepanels.splice(index, 1);
        }
    }
    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: KbqSidepanelService, deps: [{ token: i1.Overlay }, { token: i0.Injector }, { token: KBQ_SIDEPANEL_DEFAULT_OPTIONS, optional: true }, { token: KbqSidepanelService, optional: true, skipSelf: true }], target: i0.ɵɵFactoryTarget.Injectable }); }
    /** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: KbqSidepanelService }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: KbqSidepanelService, decorators: [{
            type: Injectable
        }], ctorParameters: () => [{ type: i1.Overlay }, { type: i0.Injector }, { type: KbqSidepanelConfig, decorators: [{
                    type: Optional
                }, {
                    type: Inject,
                    args: [KBQ_SIDEPANEL_DEFAULT_OPTIONS]
                }] }, { type: KbqSidepanelService, decorators: [{
                    type: Optional
                }, {
                    type: SkipSelf
                }] }] });

/**
 * Button that will close the current sidepanel.
 */
class KbqSidepanelClose {
    constructor(sidepanelRef, elementRef, sidepanelService) {
        this.sidepanelRef = sidepanelRef;
        this.elementRef = elementRef;
        this.sidepanelService = sidepanelService;
    }
    ngOnInit() {
        if (!this.sidepanelRef) {
            // When this directive is included in a sidepanel via TemplateRef (rather than being
            // in a Component), the SidepanelRef isn't available via injection because embedded
            // views cannot be given a custom injector. Instead, we look up the SidepanelRef by
            // ID.
            // This must occur in `onInit`, as the ID binding for the sidepanel container won't
            // be resolved at constructor time. We use setTimeout by same reason.
            setTimeout(() => {
                this.sidepanelRef = getClosestSidepanel(this.elementRef, this.sidepanelService.openedSidepanels);
            });
        }
    }
    ngOnChanges(changes) {
        const proxiedChange = changes.kbqSidepanelClose || changes.sidepanelResult;
        if (proxiedChange) {
            this.sidepanelResult = proxiedChange.currentValue;
        }
    }
    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: KbqSidepanelClose, deps: [{ token: KbqSidepanelRef, optional: true }, { token: i0.ElementRef }, { token: KbqSidepanelService }], target: i0.ɵɵFactoryTarget.Directive }); }
    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: KbqSidepanelClose, selector: "button[kbq-sidepanel-close], button[kbqSidepanelClose]", inputs: { sidepanelResult: ["kbq-sidepanel-close", "sidepanelResult"], kbqSidepanelClose: "kbqSidepanelClose" }, host: { listeners: { "click": "sidepanelRef.close(sidepanelResult)" }, classAttribute: "kbq-sidepanel-close" }, usesOnChanges: true, ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: KbqSidepanelClose, decorators: [{
            type: Directive,
            args: [{
                    selector: 'button[kbq-sidepanel-close], button[kbqSidepanelClose]',
                    host: {
                        '(click)': 'sidepanelRef.close(sidepanelResult)',
                        class: 'kbq-sidepanel-close'
                    }
                }]
        }], ctorParameters: () => [{ type: KbqSidepanelRef, decorators: [{
                    type: Optional
                }] }, { type: i0.ElementRef }, { type: KbqSidepanelService }], propDecorators: { sidepanelResult: [{
                type: Input,
                args: ['kbq-sidepanel-close']
            }], kbqSidepanelClose: [{
                type: Input
            }] } });
/**
 * Header of a sidepanel.
 */
class KbqSidepanelHeader {
    constructor() {
        /** Add button for close sidepanel. Default false */
        this.closeable = false;
        /** Enables text truncation. Default true */
        this.truncateText = true;
    }
    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: KbqSidepanelHeader, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: KbqSidepanelHeader, selector: "kbq-sidepanel-header", inputs: { closeable: ["closeable", "closeable", booleanAttribute], truncateText: ["truncateText", "truncateText", booleanAttribute] }, host: { properties: { "class.kbq-sidepanel-header_truncate-text": "truncateText" }, classAttribute: "kbq-sidepanel-header" }, ngImport: i0, template: `
        <div class="kbq-sidepanel-title" kbq-title>
            <ng-content />
        </div>

        @if (closeable) {
            <button kbq-button kbq-sidepanel-close [color]="'contrast'" [kbqStyle]="'transparent'">
                <i kbq-icon="kbq-xmark_16" [color]="'contrast'"></i>
            </button>
        }
    `, isInline: true, dependencies: [{ kind: "component", type: i3$1.KbqButton, selector: "[kbq-button]", inputs: ["kbqStyle", "disabled", "tabIndex"] }, { kind: "directive", type: i3$1.KbqButtonCssStyler, selector: "[kbq-button]" }, { kind: "component", type: i4.KbqIcon, selector: "[kbq-icon]", inputs: ["small", "autoColor", "kbq-icon"] }, { kind: "directive", type: i5.KbqTitleDirective, selector: "[kbq-title]", exportAs: ["kbqTitle"] }, { kind: "directive", type: KbqSidepanelClose, selector: "button[kbq-sidepanel-close], button[kbqSidepanelClose]", inputs: ["kbq-sidepanel-close", "kbqSidepanelClose"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: KbqSidepanelHeader, decorators: [{
            type: Component,
            args: [{
                    selector: 'kbq-sidepanel-header',
                    template: `
        <div class="kbq-sidepanel-title" kbq-title>
            <ng-content />
        </div>

        @if (closeable) {
            <button kbq-button kbq-sidepanel-close [color]="'contrast'" [kbqStyle]="'transparent'">
                <i kbq-icon="kbq-xmark_16" [color]="'contrast'"></i>
            </button>
        }
    `,
                    host: {
                        class: 'kbq-sidepanel-header',
                        '[class.kbq-sidepanel-header_truncate-text]': 'truncateText'
                    }
                }]
        }], propDecorators: { closeable: [{
                type: Input,
                args: [{ transform: booleanAttribute }]
            }], truncateText: [{
                type: Input,
                args: [{ transform: booleanAttribute }]
            }] } });
/**
 * Scrollable content container of a sidepanel.
 */
class KbqSidepanelBody {
    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: KbqSidepanelBody, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: KbqSidepanelBody, selector: "kbq-sidepanel-body, [kbq-sidepanel-body], kbqSidepanelBody", host: { classAttribute: "kbq-sidepanel-body kbq-scrollbar" }, ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: KbqSidepanelBody, decorators: [{
            type: Directive,
            args: [{
                    selector: 'kbq-sidepanel-body, [kbq-sidepanel-body], kbqSidepanelBody',
                    host: {
                        class: 'kbq-sidepanel-body kbq-scrollbar'
                    }
                }]
        }] });
/**
 * Footer of a sidepanel.
 */
class KbqSidepanelFooter {
    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: KbqSidepanelFooter, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: KbqSidepanelFooter, selector: "kbq-sidepanel-footer, [kbq-sidepanel-footer], kbqSidepanelFooter", host: { classAttribute: "kbq-sidepanel-footer" }, ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: KbqSidepanelFooter, decorators: [{
            type: Directive,
            args: [{
                    selector: 'kbq-sidepanel-footer, [kbq-sidepanel-footer], kbqSidepanelFooter',
                    host: {
                        class: 'kbq-sidepanel-footer'
                    }
                }]
        }] });
/**
 * Actions block of a sidepanel footer.
 */
class KbqSidepanelActions {
    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: KbqSidepanelActions, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: KbqSidepanelActions, selector: "kbq-sidepanel-actions, [kbq-sidepanel-actions], kbqSidepanelActions", host: { classAttribute: "kbq-sidepanel-actions" }, ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: KbqSidepanelActions, decorators: [{
            type: Directive,
            args: [{
                    selector: 'kbq-sidepanel-actions, [kbq-sidepanel-actions], kbqSidepanelActions',
                    host: {
                        class: 'kbq-sidepanel-actions'
                    }
                }]
        }] });
/**
 * Finds the closest KbqSidepanelRef to an element by looking at the DOM.
 * @param element Element relative to which to look for a sidepanel.
 * @param openSidepanels References to the currently-open sidepanels.
 */
function getClosestSidepanel(element, openSidepanels) {
    let parent = element.nativeElement.parentElement;
    while (parent && !parent.classList.contains('kbq-sidepanel-container')) {
        parent = parent.parentElement;
    }
    return parent ? openSidepanels.find((sidepanel) => sidepanel.id === parent.id) : null;
}

class KbqSidepanelModule {
    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: KbqSidepanelModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.14", ngImport: i0, type: KbqSidepanelModule, declarations: [KbqSidepanelContainerComponent,
            KbqSidepanelClose,
            KbqSidepanelHeader,
            KbqSidepanelBody,
            KbqSidepanelFooter,
            KbqSidepanelActions], imports: [OverlayModule,
            PortalModule,
            KbqButtonModule,
            KbqIconModule,
            KbqTitleModule,
            A11yModule], exports: [KbqSidepanelContainerComponent,
            KbqSidepanelClose,
            KbqSidepanelHeader,
            KbqSidepanelBody,
            KbqSidepanelFooter,
            KbqSidepanelActions] }); }
    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: KbqSidepanelModule, providers: [
            KbqSidepanelService,
            { provide: FocusTrapFactory, useClass: ConfigurableFocusTrapFactory }
        ], imports: [OverlayModule,
            PortalModule,
            KbqButtonModule,
            KbqIconModule,
            KbqTitleModule,
            A11yModule] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: KbqSidepanelModule, decorators: [{
            type: NgModule,
            args: [{
                    imports: [
                        OverlayModule,
                        PortalModule,
                        KbqButtonModule,
                        KbqIconModule,
                        KbqTitleModule,
                        A11yModule
                    ],
                    providers: [
                        KbqSidepanelService,
                        { provide: FocusTrapFactory, useClass: ConfigurableFocusTrapFactory }
                    ],
                    declarations: [
                        KbqSidepanelContainerComponent,
                        KbqSidepanelClose,
                        KbqSidepanelHeader,
                        KbqSidepanelBody,
                        KbqSidepanelFooter,
                        KbqSidepanelActions
                    ],
                    exports: [
                        KbqSidepanelContainerComponent,
                        KbqSidepanelClose,
                        KbqSidepanelHeader,
                        KbqSidepanelBody,
                        KbqSidepanelFooter,
                        KbqSidepanelActions
                    ]
                }]
        }] });

/**
 * Generated bundle index. Do not edit.
 */

export { KBQ_SIDEPANEL_DATA, KBQ_SIDEPANEL_DEFAULT_OPTIONS, KBQ_SIDEPANEL_WITH_INDENT, KBQ_SIDEPANEL_WITH_SHADOW, KbqSidepanelActions, KbqSidepanelBody, KbqSidepanelClose, KbqSidepanelConfig, KbqSidepanelContainerComponent, KbqSidepanelFooter, KbqSidepanelHeader, KbqSidepanelModule, KbqSidepanelPosition, KbqSidepanelRef, KbqSidepanelService, KbqSidepanelSize };
//# sourceMappingURL=koobiq-components-sidepanel.mjs.map
