@acorex/components 21.0.2-next.23 → 21.0.2-next.25

package/collapse/index.d.ts

@@ -1,174 +0,0 @@
-import * as polytype from 'polytype';
-import { MXBaseComponent, MXLookComponent, AXClickEvent, MXInteractiveComponent } from '@acorex/cdk/common';
-import * as i0 from '@angular/core';
-import { AfterViewInit, OnDestroy, EventEmitter, TemplateRef } from '@angular/core';
-
-declare const AXCollapseGroupComponent_base: polytype.Polytype.ClusteredConstructor<[typeof MXBaseComponent, typeof MXLookComponent]>;
-/**
- * Container for collapsible items with configurable styling.
- *
- * @category Components
- */
-declare class AXCollapseGroupComponent extends AXCollapseGroupComponent_base implements AfterViewInit, OnDestroy {
-    /**
-     * Emitted when the accordion state changes.
-     *
-     * @event
-     */
-    accordionChange: EventEmitter<boolean>;
-    /**
-     *  @ignore
-     */
-    private _accordion?;
-    /**
-     *  Enables accordion behavior, allowing only one collapsible item to be expanded at a time
-     */
-    get accordion(): boolean | undefined;
-    set accordion(value: boolean);
-    /**
-     * Emits when the active index changes.
-     * @event
-     */
-    activeIndexChange: EventEmitter<number>;
-    /**
-     *  @ignore
-     */
-    private _activeIndex;
-    /**
-     *  Index of the currently active item within the group
-     */
-    get activeIndex(): number;
-    set activeIndex(value: number);
-    private _items;
-    /**
-     *  @ignore
-     */
-    private _subs;
-    /**
-     *  @ignore
-     */
-    ngAfterViewInit(): void;
-    /**
-     *  @ignore
-     */
-    private applyAccordion;
-    /**
-     *  @ignore
-     */
-    private removeAccordion;
-    /**
-     *  @ignore
-     */
-    ngOnDestroy(): void;
-    /**
-     *  @ignore
-     */
-    private get __hostClass();
-    static ɵfac: i0.ɵɵFactoryDeclaration<AXCollapseGroupComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<AXCollapseGroupComponent, "ax-collapse-group", never, { "look": { "alias": "look"; "required": false; }; "accordion": { "alias": "accordion"; "required": false; }; "activeIndex": { "alias": "activeIndex"; "required": false; }; }, { "accordionChange": "accordionChange"; "activeIndexChange": "activeIndexChange"; }, ["_items"], ["ax-collapse"], true, never>;
-}
-
-declare class AXCollapseClickEvent extends AXClickEvent {
-    handled: boolean;
-}
-declare const AXCollapseComponent_base: polytype.Polytype.ClusteredConstructor<[typeof MXInteractiveComponent, typeof MXLookComponent]>;
-/**
- * A component that provides a collapsible section with animated transitions.
- *
- * @category Components
- */
-declare class AXCollapseComponent extends AXCollapseComponent_base {
-    private parent;
-    /**
-     *  Fires each time the user clicks the panel header.
-     *  @event
-     */
-    onClick: EventEmitter<AXCollapseClickEvent>;
-    /**
-     * Fires an event when the collapse state changes.
-     *
-     * @event
-     */
-    isCollapsedChange: EventEmitter<any>;
-    /**
-     *  @ignore
-     */
-    private _isCollapsed;
-    /**
-     *  Providing a boolean value for its collapse state
-     */
-    get isCollapsed(): boolean;
-    set isCollapsed(v: boolean);
-    /**
-     *  @ignore
-     */
-    private _showHeader;
-    /**
-     *  Providing a boolean value for show or hide header
-     */
-    get showHeader(): boolean;
-    set showHeader(v: boolean);
-    /**
-     * Sets the caption for the collapse component.
-     *
-     * @defaultValue ''
-     */
-    caption: string;
-    /**
-     * Specifies the icon to display in the collapse component.
-     *
-     * @defaultValue ''
-     */
-    icon: string;
-    /**
-     *  @ignore
-     */
-    private _isLoading;
-    /**
-     *  Providing a boolean value for its collapse state
-     */
-    get isLoading(): boolean;
-    set isLoading(v: boolean);
-    /**
-     * Template used for the collapse component's header.
-     */
-    headerTemplate: TemplateRef<any>;
-    /**
-     * Handles header clicks, emitting a click event and toggling collapse state if not handled.
-     *
-     * @param e - The native mouse event.
-     */
-    handleHeaderClick(e: MouseEvent): void;
-    /**
-     * Expands the collapse component.
-     *
-     * @returns void - No return value. Sets `isCollapsed` to false and expands the body.
-     */
-    open(): void;
-    /**
-     * Collapses the collapse component.
-     *
-     * @returns void - No return value. Sets `isCollapsed` to true and hides the body.
-     */
-    close(): void;
-    /**
-     * Toggles the collapse state between expanded and collapsed.
-     *
-     * @returns void - No return value. Flips the `isCollapsed` state.
-     */
-    toggle(): void;
-    /**
-     *  @ignore
-     */
-    get __hostClass(): string[];
-    static ɵfac: i0.ɵɵFactoryDeclaration<AXCollapseComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<AXCollapseComponent, "ax-collapse", never, { "disabled": { "alias": "disabled"; "required": false; }; "look": { "alias": "look"; "required": false; }; "isCollapsed": { "alias": "isCollapsed"; "required": false; }; "showHeader": { "alias": "showHeader"; "required": false; }; "caption": { "alias": "caption"; "required": false; }; "icon": { "alias": "icon"; "required": false; }; "isLoading": { "alias": "isLoading"; "required": false; }; "headerTemplate": { "alias": "headerTemplate"; "required": false; }; }, { "onClick": "onClick"; "isCollapsedChange": "isCollapsedChange"; }, never, ["*"], true, never>;
-}
-
-declare class AXCollapseModule {
-    static ɵfac: i0.ɵɵFactoryDeclaration<AXCollapseModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<AXCollapseModule, never, [typeof AXCollapseComponent, typeof AXCollapseGroupComponent], [typeof AXCollapseComponent, typeof AXCollapseGroupComponent]>;
-    static ɵinj: i0.ɵɵInjectorDeclaration<AXCollapseModule>;
-}
-
-export { AXCollapseClickEvent, AXCollapseComponent, AXCollapseGroupComponent, AXCollapseModule };

package/drawer-legacy/README.md

@@ -1,3 +0,0 @@
-# @acorex/components/drawer
-
-Secondary entry point of `@acorex/components`. It can be used by importing from `@acorex/components/drawer`.

package/drawer-legacy/index.d.ts

@@ -1,86 +0,0 @@
-import { MXBaseComponent } from '@acorex/cdk/common';
-import * as i0 from '@angular/core';
-import { AfterContentInit, DoCheck } from '@angular/core';
-import * as i1 from '@angular/common';
-
-/**
- * A container component that organizes and positions drawer components.
- * @category component
- */
-declare class AXDrawerLegacyContainerComponent extends MXBaseComponent {
-    private service;
-    constructor();
-    static ɵfac: i0.ɵɵFactoryDeclaration<AXDrawerLegacyContainerComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<AXDrawerLegacyContainerComponent, "ax-drawer-legacy-container", never, {}, {}, never, ["ax-drawer", "ax-content"], true, never>;
-}
-
-type AXDrawerMode = 'push' | 'overlay';
-type AXDrawerLocation = 'start' | 'end';
-/**
- * A component that represents a drawer with header and content sections.
- *
- * @category Components
- */
-declare class AXDrawerLegacyComponent extends MXBaseComponent implements AfterContentInit, DoCheck {
-    #private;
-    location: i0.ModelSignal<AXDrawerLocation>;
-    showBackdrop: i0.InputSignal<boolean>;
-    mode: i0.ModelSignal<AXDrawerMode>;
-    closeOthers: i0.InputSignal<boolean>;
-    collapsed: i0.ModelSignal<boolean>;
-    private backdropElement;
-    protected loaded: i0.WritableSignal<boolean>;
-    private service;
-    private _zone;
-    private document;
-    private platformID;
-    /**
-     *
-     *  @ignore
-     */
-    ngAfterContentInit(): void;
-    /**
-     *  @ignore
-     */
-    ngDoCheck(): void;
-    /**
-     *  @ignore
-     */
-    private _detectBoundingSize;
-    /**
-     * Toggles the collapsed state of the drawer.
-     */
-    toggle(): void;
-    /**
-     * Collapses the drawer.
-     * @ignore
-     */
-    close(): void;
-    /**
-     * Expands the drawer.
-     */
-    open(): void;
-    /**
-     *  @ignore
-     */
-    private _addBackdrop;
-    /**
-     *  @ignore
-     */
-    private _removeBackdrop;
-    /**
-     *  @ignore
-     */
-    private get __hostClass();
-    static ɵfac: i0.ɵɵFactoryDeclaration<AXDrawerLegacyComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<AXDrawerLegacyComponent, "ax-drawer-legacy", never, { "location": { "alias": "location"; "required": false; "isSignal": true; }; "showBackdrop": { "alias": "showBackdrop"; "required": false; "isSignal": true; }; "mode": { "alias": "mode"; "required": false; "isSignal": true; }; "closeOthers": { "alias": "closeOthers"; "required": false; "isSignal": true; }; "collapsed": { "alias": "collapsed"; "required": false; "isSignal": true; }; }, { "location": "locationChange"; "mode": "modeChange"; "collapsed": "collapsedChange"; }, never, ["ax-header", "ax-content"], true, never>;
-}
-
-declare class AXDrawerLegacyModule {
-    static ɵfac: i0.ɵɵFactoryDeclaration<AXDrawerLegacyModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<AXDrawerLegacyModule, never, [typeof i1.CommonModule, typeof AXDrawerLegacyComponent, typeof AXDrawerLegacyContainerComponent], [typeof AXDrawerLegacyComponent, typeof AXDrawerLegacyContainerComponent]>;
-    static ɵinj: i0.ɵɵInjectorDeclaration<AXDrawerLegacyModule>;
-}
-
-export { AXDrawerLegacyComponent, AXDrawerLegacyContainerComponent, AXDrawerLegacyModule };
-export type { AXDrawerLocation, AXDrawerMode };

package/fesm2022/acorex-components-collapse.mjs

@@ -1,366 +0,0 @@
-import { AXClickEvent, MXInteractiveComponent, MXLookComponent, MXLookableComponent, AXComponent, MXBaseComponent } from '@acorex/cdk/common';
-import * as i0 from '@angular/core';
-import { inject, EventEmitter, HostBinding, Input, Output, ViewEncapsulation, ChangeDetectionStrategy, Component, ContentChildren, NgModule } from '@angular/core';
-import { classes } from 'polytype';
-import { AXLoadingComponent } from '@acorex/components/loading';
-import { NgTemplateOutlet, NgClass } from '@angular/common';
-
-class AXCollapseClickEvent extends AXClickEvent {
-    constructor() {
-        super(...arguments);
-        this.handled = false;
-    }
-}
-/**
- * A component that provides a collapsible section with animated transitions.
- *
- * @category Components
- */
-class AXCollapseComponent extends classes(MXInteractiveComponent, MXLookComponent) {
-    constructor() {
-        super(...arguments);
-        this.parent = inject(MXLookableComponent, { optional: true, host: true });
-        /**
-         *  Fires each time the user clicks the panel header.
-         *  @event
-         */
-        this.onClick = new EventEmitter();
-        /**
-         * Fires an event when the collapse state changes.
-         *
-         * @event
-         */
-        this.isCollapsedChange = new EventEmitter();
-        /**
-         *  @ignore
-         */
-        this._isCollapsed = false;
-        /**
-         *  @ignore
-         */
-        this._showHeader = true;
-        /**
-         * Sets the caption for the collapse component.
-         *
-         * @defaultValue ''
-         */
-        this.caption = '';
-        /**
-         * Specifies the icon to display in the collapse component.
-         *
-         * @defaultValue ''
-         */
-        this.icon = '';
-        /**
-         *  @ignore
-         */
-        this._isLoading = false;
-    }
-    /**
-     *  Providing a boolean value for its collapse state
-     */
-    get isCollapsed() {
-        return this._isCollapsed;
-    }
-    set isCollapsed(v) {
-        this.setOption({
-            name: 'isCollapsed',
-            value: v,
-            afterCallback: () => {
-                this.cdr.detectChanges();
-            },
-        });
-    }
-    /**
-     *  Providing a boolean value for show or hide header
-     */
-    get showHeader() {
-        return this._showHeader;
-    }
-    set showHeader(v) {
-        this.setOption({
-            name: 'showHeader',
-            value: v,
-            afterCallback: () => {
-                this.cdr.detectChanges();
-            },
-        });
-    }
-    /**
-     *  Providing a boolean value for its collapse state
-     */
-    get isLoading() {
-        return this._isLoading;
-    }
-    set isLoading(v) {
-        this.setOption({
-            name: 'isLoading',
-            value: v,
-            afterCallback: () => {
-                this.cdr.detectChanges();
-            },
-        });
-    }
-    /**
-     * Handles header clicks, emitting a click event and toggling collapse state if not handled.
-     *
-     * @param e - The native mouse event.
-     */
-    handleHeaderClick(e) {
-        if (this.disabled || this.isLoading)
-            return;
-        const event = {
-            component: this,
-            htmlElement: this.getHostElement(),
-            nativeEvent: e,
-            handled: false,
-        };
-        this.onClick.emit(event);
-        if (!event.handled) {
-            this.toggle();
-        }
-    }
-    /**
-     * Expands the collapse component.
-     *
-     * @returns void - No return value. Sets `isCollapsed` to false and expands the body.
-     */
-    open() {
-        this.isCollapsed = false;
-    }
-    /**
-     * Collapses the collapse component.
-     *
-     * @returns void - No return value. Sets `isCollapsed` to true and hides the body.
-     */
-    close() {
-        this.isCollapsed = true;
-    }
-    /**
-     * Toggles the collapse state between expanded and collapsed.
-     *
-     * @returns void - No return value. Flips the `isCollapsed` state.
-     */
-    toggle() {
-        this.isCollapsed = !this.isCollapsed;
-    }
-    /**
-     *  @ignore
-     */
-    get __hostClass() {
-        return [`${this.disabled ? 'ax-state-disabled' : ''}`, `ax-${this.look ?? this.parent?.look}`];
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXCollapseComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.3", type: AXCollapseComponent, isStandalone: true, selector: "ax-collapse", inputs: { disabled: "disabled", look: "look", isCollapsed: "isCollapsed", showHeader: "showHeader", caption: "caption", icon: "icon", isLoading: "isLoading", headerTemplate: "headerTemplate" }, outputs: { onClick: "onClick", isCollapsedChange: "isCollapsedChange" }, host: { properties: { "class": "this.__hostClass" } }, providers: [{ provide: AXComponent, useExisting: AXCollapseComponent }], usesInheritance: true, ngImport: i0, template: "@if (showHeader) {\n  <div class=\"ax-collapse-header\" [class.ax-state-collapsed]=\"isCollapsed\" (click)=\"handleHeaderClick($event)\">\n    @if (headerTemplate) {\n      <div class=\"ax-collapse-custom-header-container\">\n        <ng-container\n          [ngTemplateOutlet]=\"headerTemplate\"\n          [ngTemplateOutletContext]=\"{ $implicit: { caption, isCollapsed } }\"\n        ></ng-container>\n      </div>\n    } @else {\n      <div class=\"ax-collapse-header-container\">\n        <div class=\"ax-collapse-header-start\">\n          <span class=\"ax-collapse-header-icon\" [class]=\"icon\"> </span>\n          <span>\n            {{ caption }}\n          </span>\n        </div>\n        <div class=\"ax-collapse-header-end\">\n          @if (isLoading) {\n            <ax-loading></ax-loading>\n          } @else {\n            <span\n              class=\"ax-icon ax-icon-chevron-left ax-collapse-arrow\"\n              [ngClass]=\"{ '-rotation-90': isCollapsed, 'rotation-90': !isCollapsed }\"\n            ></span>\n          }\n        </div>\n      </div>\n    }\n  </div>\n}\n@if (!isCollapsed) {\n  <div animate.enter=\"ax-fade-slide-in\" animate.leave=\"ax-fade-slide-out\" class=\"ax-collapse-body\">\n    <div class=\"ax-collapse-body-content\">\n      <ng-content></ng-content>\n    </div>\n  </div>\n}\n", styles: ["ax-collapse-group ax-collapse.ax-solid{--ax-comp-collapse-bg-color: var(--ax-sys-color-lightest-surface);--ax-comp-collapse-border-color: var(--ax-sys-color-border-lightest-surface);--ax-comp-collapse-border-width: 1px}.ax-dark ax-collapse-group ax-collapse.ax-solid{--ax-comp-collapse-bg-color: var(--ax-sys-color-darkest-surface);--ax-comp-collapse-border-color: var(--ax-sys-color-border-darkest-surface)}ax-collapse-group ax-collapse.ax-fill{--ax-comp-collapse-bg-color: var(--ax-sys-color-surface)}ax-collapse-group ax-collapse.ax-flat{--ax-comp-collapse-border-color: var(--ax-sys-color-border-lightest-surface);--ax-comp-collapse-border-width: 1px}ax-collapse-group ax-collapse.ax-outline{--ax-comp-collapse-border-color: var(--ax-sys-color-border-surface);--ax-comp-collapse-border-width: 1px}ax-collapse-group ax-collapse{--ax-comp-collapse-margin: .5rem}ax-collapse,ax-collapse-group{display:block;width:100%;overflow:hidden;font-size:1rem;line-height:1.5rem}@keyframes fadeSlideIn{0%{opacity:0;max-height:0}to{opacity:1;max-height:1500px}}@keyframes fadeSlideOut{0%{opacity:1;max-height:1500px}to{opacity:0;max-height:0}}ax-collapse .ax-fade-slide-in,ax-collapse-group .ax-fade-slide-in{animation:fadeSlideIn var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function)}ax-collapse .ax-fade-slide-out,ax-collapse-group .ax-fade-slide-out{animation:fadeSlideOut var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function)}ax-collapse-group ax-collapse{margin-bottom:var(--ax-comp-collapse-margin)}ax-collapse-group ax-collapse.ax-solid{border-radius:var(--ax-sys-border-radius);border-width:var(--ax-comp-collapse-border-width);border-color:rgba(var(--ax-comp-collapse-border-color))}ax-collapse-group ax-collapse.ax-solid .ax-collapse-header{background-color:rgba(var(--ax-comp-collapse-bg-color))}ax-collapse-group ax-collapse.ax-fill .ax-collapse-header{border-radius:var(--ax-sys-border-radius);background-color:rgba(var(--ax-comp-collapse-bg-color))}ax-collapse-group ax-collapse.ax-outline{border-radius:var(--ax-sys-border-radius);border-width:var(--ax-comp-collapse-border-width);border-color:rgba(var(--ax-comp-collapse-border-color))}ax-collapse-group ax-collapse.ax-outline .ax-collapse-header{background-color:transparent}ax-collapse-group ax-collapse.ax-flat{border-bottom-width:var(--ax-comp-collapse-border-width);border-color:rgba(var(--ax-comp-collapse-border-color))}ax-collapse-group ax-collapse.ax-flat .ax-collapse-header{background-color:transparent}ax-collapse.ax-state-disabled{cursor:not-allowed;opacity:.5}ax-collapse .ax-collapse-header,ax-collapse .ax-collapse-body{font-size:.875rem;line-height:1.25rem;color:rgba(var(--ax-sys-color-on-surface-high))!important}ax-collapse .ax-collapse-header{cursor:pointer;-webkit-user-select:none;user-select:none;padding:.75rem}ax-collapse .ax-collapse-header .ax-collapse-header-container{display:flex;justify-content:space-between}ax-collapse .ax-collapse-header .ax-collapse-header-container .ax-collapse-header-start{display:flex;align-items:center}ax-collapse .ax-collapse-header .ax-collapse-header-container .ax-collapse-header-start:not(:empty) .ax-collapse-header-icon{padding-inline-end:.5rem}ax-collapse .ax-collapse-header .ax-collapse-header-container .ax-collapse-header-end{display:flex;height:1.5rem;width:1.5rem;align-items:center;justify-content:center}ax-collapse .ax-collapse-header .ax-collapse-header-container .ax-collapse-header-end .ax-collapse-arrow{transition-property:all;transition-duration:var(--ax-sys-transition-duration);transition-timing-function:var(--ax-sys-transition-timing-function);display:block}ax-collapse .ax-collapse-header .ax-collapse-header-container .ax-collapse-header-end .ax-collapse-arrow.-rotation-90{transform:rotate(-90deg)}ax-collapse .ax-collapse-header .ax-collapse-header-container .ax-collapse-header-end .ax-collapse-arrow.rotation-90{transform:rotate(90deg)}ax-collapse .ax-collapse-body .ax-collapse-body-content{padding:1rem;padding-inline-end:1rem;padding-inline-start:1.25rem}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXCollapseComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ax-collapse', inputs: ['disabled', 'look'], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [NgTemplateOutlet, AXLoadingComponent, NgClass], providers: [{ provide: AXComponent, useExisting: AXCollapseComponent }], template: "@if (showHeader) {\n  <div class=\"ax-collapse-header\" [class.ax-state-collapsed]=\"isCollapsed\" (click)=\"handleHeaderClick($event)\">\n    @if (headerTemplate) {\n      <div class=\"ax-collapse-custom-header-container\">\n        <ng-container\n          [ngTemplateOutlet]=\"headerTemplate\"\n          [ngTemplateOutletContext]=\"{ $implicit: { caption, isCollapsed } }\"\n        ></ng-container>\n      </div>\n    } @else {\n      <div class=\"ax-collapse-header-container\">\n        <div class=\"ax-collapse-header-start\">\n          <span class=\"ax-collapse-header-icon\" [class]=\"icon\"> </span>\n          <span>\n            {{ caption }}\n          </span>\n        </div>\n        <div class=\"ax-collapse-header-end\">\n          @if (isLoading) {\n            <ax-loading></ax-loading>\n          } @else {\n            <span\n              class=\"ax-icon ax-icon-chevron-left ax-collapse-arrow\"\n              [ngClass]=\"{ '-rotation-90': isCollapsed, 'rotation-90': !isCollapsed }\"\n            ></span>\n          }\n        </div>\n      </div>\n    }\n  </div>\n}\n@if (!isCollapsed) {\n  <div animate.enter=\"ax-fade-slide-in\" animate.leave=\"ax-fade-slide-out\" class=\"ax-collapse-body\">\n    <div class=\"ax-collapse-body-content\">\n      <ng-content></ng-content>\n    </div>\n  </div>\n}\n", styles: ["ax-collapse-group ax-collapse.ax-solid{--ax-comp-collapse-bg-color: var(--ax-sys-color-lightest-surface);--ax-comp-collapse-border-color: var(--ax-sys-color-border-lightest-surface);--ax-comp-collapse-border-width: 1px}.ax-dark ax-collapse-group ax-collapse.ax-solid{--ax-comp-collapse-bg-color: var(--ax-sys-color-darkest-surface);--ax-comp-collapse-border-color: var(--ax-sys-color-border-darkest-surface)}ax-collapse-group ax-collapse.ax-fill{--ax-comp-collapse-bg-color: var(--ax-sys-color-surface)}ax-collapse-group ax-collapse.ax-flat{--ax-comp-collapse-border-color: var(--ax-sys-color-border-lightest-surface);--ax-comp-collapse-border-width: 1px}ax-collapse-group ax-collapse.ax-outline{--ax-comp-collapse-border-color: var(--ax-sys-color-border-surface);--ax-comp-collapse-border-width: 1px}ax-collapse-group ax-collapse{--ax-comp-collapse-margin: .5rem}ax-collapse,ax-collapse-group{display:block;width:100%;overflow:hidden;font-size:1rem;line-height:1.5rem}@keyframes fadeSlideIn{0%{opacity:0;max-height:0}to{opacity:1;max-height:1500px}}@keyframes fadeSlideOut{0%{opacity:1;max-height:1500px}to{opacity:0;max-height:0}}ax-collapse .ax-fade-slide-in,ax-collapse-group .ax-fade-slide-in{animation:fadeSlideIn var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function)}ax-collapse .ax-fade-slide-out,ax-collapse-group .ax-fade-slide-out{animation:fadeSlideOut var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function)}ax-collapse-group ax-collapse{margin-bottom:var(--ax-comp-collapse-margin)}ax-collapse-group ax-collapse.ax-solid{border-radius:var(--ax-sys-border-radius);border-width:var(--ax-comp-collapse-border-width);border-color:rgba(var(--ax-comp-collapse-border-color))}ax-collapse-group ax-collapse.ax-solid .ax-collapse-header{background-color:rgba(var(--ax-comp-collapse-bg-color))}ax-collapse-group ax-collapse.ax-fill .ax-collapse-header{border-radius:var(--ax-sys-border-radius);background-color:rgba(var(--ax-comp-collapse-bg-color))}ax-collapse-group ax-collapse.ax-outline{border-radius:var(--ax-sys-border-radius);border-width:var(--ax-comp-collapse-border-width);border-color:rgba(var(--ax-comp-collapse-border-color))}ax-collapse-group ax-collapse.ax-outline .ax-collapse-header{background-color:transparent}ax-collapse-group ax-collapse.ax-flat{border-bottom-width:var(--ax-comp-collapse-border-width);border-color:rgba(var(--ax-comp-collapse-border-color))}ax-collapse-group ax-collapse.ax-flat .ax-collapse-header{background-color:transparent}ax-collapse.ax-state-disabled{cursor:not-allowed;opacity:.5}ax-collapse .ax-collapse-header,ax-collapse .ax-collapse-body{font-size:.875rem;line-height:1.25rem;color:rgba(var(--ax-sys-color-on-surface-high))!important}ax-collapse .ax-collapse-header{cursor:pointer;-webkit-user-select:none;user-select:none;padding:.75rem}ax-collapse .ax-collapse-header .ax-collapse-header-container{display:flex;justify-content:space-between}ax-collapse .ax-collapse-header .ax-collapse-header-container .ax-collapse-header-start{display:flex;align-items:center}ax-collapse .ax-collapse-header .ax-collapse-header-container .ax-collapse-header-start:not(:empty) .ax-collapse-header-icon{padding-inline-end:.5rem}ax-collapse .ax-collapse-header .ax-collapse-header-container .ax-collapse-header-end{display:flex;height:1.5rem;width:1.5rem;align-items:center;justify-content:center}ax-collapse .ax-collapse-header .ax-collapse-header-container .ax-collapse-header-end .ax-collapse-arrow{transition-property:all;transition-duration:var(--ax-sys-transition-duration);transition-timing-function:var(--ax-sys-transition-timing-function);display:block}ax-collapse .ax-collapse-header .ax-collapse-header-container .ax-collapse-header-end .ax-collapse-arrow.-rotation-90{transform:rotate(-90deg)}ax-collapse .ax-collapse-header .ax-collapse-header-container .ax-collapse-header-end .ax-collapse-arrow.rotation-90{transform:rotate(90deg)}ax-collapse .ax-collapse-body .ax-collapse-body-content{padding:1rem;padding-inline-end:1rem;padding-inline-start:1.25rem}\n"] }]
-        }], propDecorators: { onClick: [{
-                type: Output
-            }], isCollapsedChange: [{
-                type: Output
-            }], isCollapsed: [{
-                type: Input
-            }], showHeader: [{
-                type: Input
-            }], caption: [{
-                type: Input
-            }], icon: [{
-                type: Input
-            }], isLoading: [{
-                type: Input
-            }], headerTemplate: [{
-                type: Input
-            }], __hostClass: [{
-                type: HostBinding,
-                args: ['class']
-            }] } });
-
-/**
- * Container for collapsible items with configurable styling.
- *
- * @category Components
- */
-class AXCollapseGroupComponent extends classes(MXBaseComponent, MXLookComponent) {
-    constructor() {
-        super(...arguments);
-        /**
-         * Emitted when the accordion state changes.
-         *
-         * @event
-         */
-        this.accordionChange = new EventEmitter();
-        /**
-         *  @ignore
-         */
-        this._accordion = false;
-        /**
-         * Emits when the active index changes.
-         * @event
-         */
-        this.activeIndexChange = new EventEmitter();
-        /**
-         *  @ignore
-         */
-        this._activeIndex = 0;
-        /**
-         *  @ignore
-         */
-        this._subs = [];
-    }
-    /**
-     *  Enables accordion behavior, allowing only one collapsible item to be expanded at a time
-     */
-    get accordion() {
-        return this._accordion;
-    }
-    set accordion(value) {
-        this.setOption({
-            name: 'accordion',
-            value,
-            afterCallback: (oldValue, newValue) => {
-                if (newValue) {
-                    this.applyAccordion();
-                }
-                else {
-                    this.removeAccordion();
-                }
-            },
-        });
-    }
-    /**
-     *  Index of the currently active item within the group
-     */
-    get activeIndex() {
-        return this._activeIndex;
-    }
-    set activeIndex(value) {
-        this.setOption({
-            name: 'activeIndex',
-            value,
-            beforeCallback: (oldValue, newValue) => {
-                const len = this._items?.length || 0;
-                if (newValue < 0)
-                    newValue = 0;
-                if (len > 0 && newValue >= len) {
-                    newValue = len - 1;
-                }
-                return newValue;
-            },
-            afterCallback: () => {
-                this.applyAccordion();
-            },
-        });
-    }
-    /**
-     *  @ignore
-     */
-    ngAfterViewInit() {
-        if (this.accordion) {
-            this.applyAccordion();
-        }
-    }
-    /**
-     *  @ignore
-     */
-    applyAccordion() {
-        if (!this.look)
-            return;
-        if (this._items && this._items.length > 1) {
-            const activeIndex = this._items.get(this.activeIndex) || this._items.get(0);
-            this._items.forEach((c) => (c.isCollapsed = true));
-            if (activeIndex)
-                activeIndex.isCollapsed = false;
-            this._items.forEach((c1) => {
-                const list = this._items.toArray();
-                this._subs.push(
-                // TODO: add and use a new event for status changes
-                c1.onClick.subscribe((e) => {
-                    if (!e.handled) {
-                        this._activeIndex = list.indexOf(c1);
-                        list.filter((c2) => c2 != c1).forEach((c) => (c.isCollapsed = true));
-                    }
-                }));
-            });
-        }
-    }
-    /**
-     *  @ignore
-     */
-    removeAccordion() {
-        this._subs.forEach((s) => s.unsubscribe());
-        this._subs = [];
-    }
-    /**
-     *  @ignore
-     */
-    ngOnDestroy() {
-        this.removeAccordion();
-    }
-    /**
-     *  @ignore
-     */
-    get __hostClass() {
-        return ['ax-collapse-group', `ax-${this.look}`];
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXCollapseGroupComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.3", type: AXCollapseGroupComponent, isStandalone: true, selector: "ax-collapse-group", inputs: { look: "look", accordion: "accordion", activeIndex: "activeIndex" }, outputs: { accordionChange: "accordionChange", activeIndexChange: "activeIndexChange" }, host: { properties: { "class": "this.__hostClass" } }, providers: [
-            {
-                provide: MXLookableComponent,
-                useExisting: AXCollapseGroupComponent,
-            },
-            { provide: AXComponent, useExisting: AXCollapseGroupComponent },
-        ], queries: [{ propertyName: "_items", predicate: AXCollapseComponent }], usesInheritance: true, ngImport: i0, template: `<ng-content select="ax-collapse"></ng-content>`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXCollapseGroupComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ax-collapse-group',
-                    inputs: ['look'],
-                    template: `<ng-content select="ax-collapse"></ng-content>`,
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    encapsulation: ViewEncapsulation.None,
-                    providers: [
-                        {
-                            provide: MXLookableComponent,
-                            useExisting: AXCollapseGroupComponent,
-                        },
-                        { provide: AXComponent, useExisting: AXCollapseGroupComponent },
-                    ],
-                }]
-        }], propDecorators: { accordionChange: [{
-                type: Output
-            }], accordion: [{
-                type: Input
-            }], activeIndexChange: [{
-                type: Output
-            }], activeIndex: [{
-                type: Input
-            }], _items: [{
-                type: ContentChildren,
-                args: [AXCollapseComponent]
-            }], __hostClass: [{
-                type: HostBinding,
-                args: ['class']
-            }] } });
-
-class AXCollapseModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXCollapseModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.3", ngImport: i0, type: AXCollapseModule, imports: [AXCollapseComponent, AXCollapseGroupComponent], exports: [AXCollapseComponent, AXCollapseGroupComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXCollapseModule, imports: [AXCollapseComponent] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXCollapseModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    imports: [AXCollapseComponent, AXCollapseGroupComponent],
-                    exports: [AXCollapseComponent, AXCollapseGroupComponent],
-                }]
-        }] });
-
-/**
- * Generated bundle index. Do not edit.
- */
-
-export { AXCollapseClickEvent, AXCollapseComponent, AXCollapseGroupComponent, AXCollapseModule };
-//# sourceMappingURL=acorex-components-collapse.mjs.map