@acorex/components 21.0.1-next.92 → 21.0.2-next.0

package/fesm2022/acorex-components-fab.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"acorex-components-fab.mjs","sources":["../tmp-esm2022/fab/lib/fab.component.js","../tmp-esm2022/fab/lib/fab-item/fab-item.component.js","../tmp-esm2022/fab/acorex-components-fab.js"],"sourcesContent":["import { AXButtonComponent } from '@acorex/components/button';\nimport { AXDecoratorModule } from '@acorex/components/decorators';\nimport { AXPopoverComponent, AXPopoverModule } from '@acorex/components/popover';\nimport { ChangeDetectionStrategy, Component, effect, input, model, output, signal, viewChild, ViewEncapsulation, } from '@angular/core';\nimport * as i0 from \"@angular/core\";\nimport * as i1 from \"@acorex/components/popover\";\nexport class AXFabComponent {\n    constructor() {\n        this.label = input(null, ...(ngDevMode ? [{ debugName: \"label\" }] : []));\n        this.popupStyle = input('bubble', ...(ngDevMode ? [{ debugName: \"popupStyle\" }] : []));\n        this.popupPlacement = model(null, ...(ngDevMode ? [{ debugName: \"popupPlacement\" }] : []));\n        this.size = input('md', ...(ngDevMode ? [{ debugName: \"size\" }] : []));\n        this.popoverRef = viewChild(AXPopoverComponent, ...(ngDevMode ? [{ debugName: \"popoverRef\" }] : []));\n        this.offsetPopover = signal(null, ...(ngDevMode ? [{ debugName: \"offsetPopover\" }] : []));\n        this.#eff = effect(() => {\n            if (this.popupStyle() === 'box') {\n                this.popupPlacement.set('top-end');\n                this.offsetPopover.set(-10);\n            }\n            else {\n                this.popupPlacement.set('top');\n                this.offsetPopover.set(-2);\n            }\n        }, ...(ngDevMode ? [{ debugName: \"#eff\" }] : []));\n        /**\n         *  Fires each time the user clicks the button.\n         *  @event\n         */\n        this.onClick = output();\n        /**\n         * Emits when the popover is opened.\n         * @event\n         */\n        this.onOpened = output();\n        /**\n         * Emits when the popover is closed.\n         * @event\n         */\n        this.onClosed = output();\n    }\n    #eff;\n    addStyleClass() {\n        const fabItemContainer = document.querySelector('.ax-fab-item-container');\n        if (!fabItemContainer)\n            return;\n        if (this.popupStyle() === 'box') {\n            fabItemContainer.classList.add('ax-fab-box-style');\n        }\n        else {\n            fabItemContainer.classList.add('ax-fab-bubble-style');\n        }\n    }\n    openPopover() {\n        this.addStyleClass();\n        this.onOpened.emit({ component: this });\n    }\n    closePopover() {\n        this.onClosed.emit({ component: this });\n    }\n    close() {\n        this.popoverRef().close();\n    }\n    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: \"12.0.0\", version: \"20.3.3\", ngImport: i0, type: AXFabComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }\n    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: \"17.2.0\", version: \"20.3.3\", type: AXFabComponent, isStandalone: true, selector: \"ax-fab\", inputs: { label: { classPropertyName: \"label\", publicName: \"label\", isSignal: true, isRequired: false, transformFunction: null }, popupStyle: { classPropertyName: \"popupStyle\", publicName: \"popupStyle\", isSignal: true, isRequired: false, transformFunction: null }, popupPlacement: { classPropertyName: \"popupPlacement\", publicName: \"popupPlacement\", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: \"size\", publicName: \"size\", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { popupPlacement: \"popupPlacementChange\", onClick: \"onClick\", onOpened: \"onOpened\", onClosed: \"onClosed\" }, viewQueries: [{ propertyName: \"popoverRef\", first: true, predicate: AXPopoverComponent, descendants: true, isSignal: true }], ngImport: i0, template: \"<ax-button class=\\\"ax-{{ size() }}\\\" #btn (onClick)=\\\"onClick.emit($event)\\\" color=\\\"primary\\\" look=\\\"solid\\\" [text]=\\\"label()\\\">\\n  <ng-content select=\\\"ax-icon\\\"> </ng-content>\\n</ax-button>\\n\\n<ax-popover\\n  (onOpened)=\\\"openPopover()\\\"\\n  (onClosed)=\\\"closePopover()\\\"\\n  [disablePanelClass]=\\\"true\\\"\\n  [offsetY]=\\\"offsetPopover()\\\"\\n  [placement]=\\\"popupPlacement()\\\"\\n  [target]=\\\"btn\\\"\\n>\\n  <div class=\\\"ax-fab-item-container\\\">\\n    <ng-content select=\\\"ax-fab-item\\\"> </ng-content>\\n  </div>\\n</ax-popover>\\n\", styles: [\"ax-fab ax-button{border-radius:1000vmax}.ax-fab-item-container{display:flex;flex-direction:column;gap:.25rem;padding-block:.5rem}.ax-fab-item-container.ax-fab-box-style{background-color:rgba(var(--ax-sys-color-lightest-surface));border-radius:var(--ax-sys-border-radius);border:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}.ax-fab-item-container ax-popover{display:none}.ax-fab-item-container ax-button{border-radius:1000vmax}.ax-fab-item-container ax-text{font-weight:500;font-size:.875rem;line-height:1.25rem}.ax-fab-item-container .ax-fab-box{padding:.25rem .875rem;display:flex;align-items:center;gap:.5rem;min-width:10rem}.ax-fab-item-container .ax-fab-box:hover{background-color:rgba(var(--ax-sys-color-surface));cursor:pointer}\\n\"], dependencies: [{ kind: \"component\", type: AXButtonComponent, selector: \"ax-button\", inputs: [\"disabled\", \"size\", \"tabIndex\", \"color\", \"look\", \"text\", \"toggleable\", \"selected\", \"iconOnly\", \"type\", \"loadingText\"], outputs: [\"onBlur\", \"onFocus\", \"onClick\", \"selectedChange\", \"toggleableChange\", \"lookChange\", \"colorChange\", \"disabledChange\", \"loadingTextChange\"] }, { kind: \"ngmodule\", type: AXPopoverModule }, { kind: \"component\", type: i1.AXPopoverComponent, selector: \"ax-popover\", inputs: [\"width\", \"disablePanelClass\", \"disabled\", \"offsetX\", \"offsetY\", \"target\", \"placement\", \"content\", \"openOn\", \"closeOn\", \"hasBackdrop\", \"openAfter\", \"closeAfter\", \"repositionOnScroll\", \"backdropClass\", \"panelClass\", \"adaptivityEnabled\"], outputs: [\"onOpened\", \"onClosed\"] }, { kind: \"ngmodule\", type: AXDecoratorModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }\n}\ni0.ɵɵngDeclareClassMetadata({ minVersion: \"12.0.0\", version: \"20.3.3\", ngImport: i0, type: AXFabComponent, decorators: [{\n            type: Component,\n            args: [{ selector: 'ax-fab', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, imports: [AXButtonComponent, AXPopoverModule, AXDecoratorModule], template: \"<ax-button class=\\\"ax-{{ size() }}\\\" #btn (onClick)=\\\"onClick.emit($event)\\\" color=\\\"primary\\\" look=\\\"solid\\\" [text]=\\\"label()\\\">\\n  <ng-content select=\\\"ax-icon\\\"> </ng-content>\\n</ax-button>\\n\\n<ax-popover\\n  (onOpened)=\\\"openPopover()\\\"\\n  (onClosed)=\\\"closePopover()\\\"\\n  [disablePanelClass]=\\\"true\\\"\\n  [offsetY]=\\\"offsetPopover()\\\"\\n  [placement]=\\\"popupPlacement()\\\"\\n  [target]=\\\"btn\\\"\\n>\\n  <div class=\\\"ax-fab-item-container\\\">\\n    <ng-content select=\\\"ax-fab-item\\\"> </ng-content>\\n  </div>\\n</ax-popover>\\n\", styles: [\"ax-fab ax-button{border-radius:1000vmax}.ax-fab-item-container{display:flex;flex-direction:column;gap:.25rem;padding-block:.5rem}.ax-fab-item-container.ax-fab-box-style{background-color:rgba(var(--ax-sys-color-lightest-surface));border-radius:var(--ax-sys-border-radius);border:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}.ax-fab-item-container ax-popover{display:none}.ax-fab-item-container ax-button{border-radius:1000vmax}.ax-fab-item-container ax-text{font-weight:500;font-size:.875rem;line-height:1.25rem}.ax-fab-item-container .ax-fab-box{padding:.25rem .875rem;display:flex;align-items:center;gap:.5rem;min-width:10rem}.ax-fab-item-container .ax-fab-box:hover{background-color:rgba(var(--ax-sys-color-surface));cursor:pointer}\\n\"] }]\n        }] });\n//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZmFiLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3BhY2thZ2VzL2NvbXBvbmVudHMvZmFiL3NyYy9saWIvZmFiLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL3BhY2thZ2VzL2NvbXBvbmVudHMvZmFiL3NyYy9saWIvZmFiLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUNBLE9BQU8sRUFBRSxpQkFBaUIsRUFBRSxNQUFNLDJCQUEyQixDQUFDO0FBQzlELE9BQU8sRUFBRSxpQkFBaUIsRUFBRSxNQUFNLCtCQUErQixDQUFDO0FBQ2xFLE9BQU8sRUFBRSxrQkFBa0IsRUFBRSxlQUFlLEVBQUUsTUFBTSw0QkFBNEIsQ0FBQztBQUNqRixPQUFPLEVBQ0wsdUJBQXVCLEVBQ3ZCLFNBQVMsRUFDVCxNQUFNLEVBQ04sS0FBSyxFQUNMLEtBQUssRUFDTCxNQUFNLEVBQ04sTUFBTSxFQUNOLFNBQVMsRUFDVCxpQkFBaUIsR0FDbEIsTUFBTSxlQUFlLENBQUM7OztBQVV2QixNQUFNLE9BQU8sY0FBYztJQVIzQjtRQVNFLFVBQUssR0FBRyxLQUFLLENBQVMsSUFBSSxpREFBQyxDQUFDO1FBRTVCLGVBQVUsR0FBRyxLQUFLLENBQW1CLFFBQVEsc0RBQUMsQ0FBQztRQUUvQyxtQkFBYyxHQUFHLEtBQUssQ0FBa0IsSUFBSSwwREFBQyxDQUFDO1FBRTlDLFNBQUksR0FBRyxLQUFLLENBQW1DLElBQUksZ0RBQUMsQ0FBQztRQUUzQyxlQUFVLEdBQUcsU0FBUyxDQUFDLGtCQUFrQixzREFBQyxDQUFDO1FBRTNDLGtCQUFhLEdBQUcsTUFBTSxDQUFTLElBQUkseURBQUMsQ0FBQztRQUUvQyxTQUFJLEdBQUcsTUFBTSxDQUFDLEdBQUcsRUFBRTtZQUNqQixJQUFJLElBQUksQ0FBQyxVQUFVLEVBQUUsS0FBSyxLQUFLLEVBQUUsQ0FBQztnQkFDaEMsSUFBSSxDQUFDLGNBQWMsQ0FBQyxHQUFHLENBQUMsU0FBUyxDQUFDLENBQUM7Z0JBQ25DLElBQUksQ0FBQyxhQUFhLENBQUMsR0FBRyxDQUFDLENBQUMsRUFBRSxDQUFDLENBQUM7WUFDOUIsQ0FBQztpQkFBTSxDQUFDO2dCQUNOLElBQUksQ0FBQyxjQUFjLENBQUMsR0FBRyxDQUFDLEtBQUssQ0FBQyxDQUFDO2dCQUMvQixJQUFJLENBQUMsYUFBYSxDQUFDLEdBQUcsQ0FBQyxDQUFDLENBQUMsQ0FBQyxDQUFDO1lBQzdCLENBQUM7UUFDSCxDQUFDLGdEQUFDLENBQUM7UUFFSDs7O1dBR0c7UUFDSCxZQUFPLEdBQUcsTUFBTSxFQUFnQixDQUFDO1FBRWpDOzs7V0FHRztRQUNILGFBQVEsR0FBRyxNQUFNLEVBQVcsQ0FBQztRQUU3Qjs7O1dBR0c7UUFDSCxhQUFRLEdBQUcsTUFBTSxFQUFXLENBQUM7S0F3QjlCO0lBbERDLElBQUksQ0FRRDtJQW9CSyxhQUFhO1FBQ25CLE1BQU0sZ0JBQWdCLEdBQUcsUUFBUSxDQUFDLGFBQWEsQ0FBQyx3QkFBd0IsQ0FBQyxDQUFDO1FBQzFFLElBQUksQ0FBQyxnQkFBZ0I7WUFBRSxPQUFPO1FBQzlCLElBQUksSUFBSSxDQUFDLFVBQVUsRUFBRSxLQUFLLEtBQUssRUFBRSxDQUFDO1lBQ2hDLGdCQUFnQixDQUFDLFNBQVMsQ0FBQyxHQUFHLENBQUMsa0JBQWtCLENBQUMsQ0FBQztRQUNyRCxDQUFDO2FBQU0sQ0FBQztZQUNOLGdCQUFnQixDQUFDLFNBQVMsQ0FBQyxHQUFHLENBQUMscUJBQXFCLENBQUMsQ0FBQztRQUN4RCxDQUFDO0lBQ0gsQ0FBQztJQUVTLFdBQVc7UUFDbkIsSUFBSSxDQUFDLGFBQWEsRUFBRSxDQUFDO1FBQ3JCLElBQUksQ0FBQyxRQUFRLENBQUMsSUFBSSxDQUFDLEVBQUUsU0FBUyxFQUFFLElBQUksRUFBRSxDQUFDLENBQUM7SUFDMUMsQ0FBQztJQUVTLFlBQVk7UUFDcEIsSUFBSSxDQUFDLFFBQVEsQ0FBQyxJQUFJLENBQUMsRUFBRSxTQUFTLEVBQUUsSUFBSSxFQUFFLENBQUMsQ0FBQztJQUMxQyxDQUFDO0lBRU0sS0FBSztRQUNWLElBQUksQ0FBQyxVQUFVLEVBQUUsQ0FBQyxLQUFLLEVBQUUsQ0FBQztJQUM1QixDQUFDOzhHQTlEVSxjQUFjO2tHQUFkLGNBQWMsc3ZCQVNRLGtCQUFrQixnRUNqQ3JELHlnQkFnQkEseXlCRE1ZLGlCQUFpQiwwVUFBRSxlQUFlLGtZQUFFLGlCQUFpQjs7MkZBRXBELGNBQWM7a0JBUjFCLFNBQVM7K0JBQ0UsUUFBUSxpQkFHSCxpQkFBaUIsQ0FBQyxJQUFJLG1CQUNwQix1QkFBdUIsQ0FBQyxNQUFNLFdBQ3RDLENBQUMsaUJBQWlCLEVBQUUsZUFBZSxFQUFFLGlCQUFpQixDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQVhDbGlja0V2ZW50LCBBWEV2ZW50LCBBWFBsYWNlbWVudFR5cGUgfSBmcm9tICdAYWNvcmV4L2Nkay9jb21tb24nO1xuaW1wb3J0IHsgQVhCdXR0b25Db21wb25lbnQgfSBmcm9tICdAYWNvcmV4L2NvbXBvbmVudHMvYnV0dG9uJztcbmltcG9ydCB7IEFYRGVjb3JhdG9yTW9kdWxlIH0gZnJvbSAnQGFjb3JleC9jb21wb25lbnRzL2RlY29yYXRvcnMnO1xuaW1wb3J0IHsgQVhQb3BvdmVyQ29tcG9uZW50LCBBWFBvcG92ZXJNb2R1bGUgfSBmcm9tICdAYWNvcmV4L2NvbXBvbmVudHMvcG9wb3Zlcic7XG5pbXBvcnQge1xuICBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSxcbiAgQ29tcG9uZW50LFxuICBlZmZlY3QsXG4gIGlucHV0LFxuICBtb2RlbCxcbiAgb3V0cHV0LFxuICBzaWduYWwsXG4gIHZpZXdDaGlsZCxcbiAgVmlld0VuY2Fwc3VsYXRpb24sXG59IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdheC1mYWInLFxuICB0ZW1wbGF0ZVVybDogJy4vZmFiLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vZmFiLmNvbXBvbmVudC5zY3NzJ10sXG4gIGVuY2Fwc3VsYXRpb246IFZpZXdFbmNhcHN1bGF0aW9uLk5vbmUsXG4gIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxuICBpbXBvcnRzOiBbQVhCdXR0b25Db21wb25lbnQsIEFYUG9wb3Zlck1vZHVsZSwgQVhEZWNvcmF0b3JNb2R1bGVdLFxufSlcbmV4cG9ydCBjbGFzcyBBWEZhYkNvbXBvbmVudCB7XG4gIGxhYmVsID0gaW5wdXQ8c3RyaW5nPihudWxsKTtcblxuICBwb3B1cFN0eWxlID0gaW5wdXQ8J2J1YmJsZScgfCAnYm94Jz4oJ2J1YmJsZScpO1xuXG4gIHBvcHVwUGxhY2VtZW50ID0gbW9kZWw8QVhQbGFjZW1lbnRUeXBlPihudWxsKTtcblxuICBzaXplID0gaW5wdXQ8J3hzJyB8ICdzbScgfCAnbWQnIHwgJ2xnJyB8ICd4bCc+KCdtZCcpO1xuXG4gIHByb3RlY3RlZCBwb3BvdmVyUmVmID0gdmlld0NoaWxkKEFYUG9wb3ZlckNvbXBvbmVudCk7XG5cbiAgcHJvdGVjdGVkIG9mZnNldFBvcG92ZXIgPSBzaWduYWw8bnVtYmVyPihudWxsKTtcblxuICAjZWZmID0gZWZmZWN0KCgpID0+IHtcbiAgICBpZiAodGhpcy5wb3B1cFN0eWxlKCkgPT09ICdib3gnKSB7XG4gICAgICB0aGlzLnBvcHVwUGxhY2VtZW50LnNldCgndG9wLWVuZCcpO1xuICAgICAgdGhpcy5vZmZzZXRQb3BvdmVyLnNldCgtMTApO1xuICAgIH0gZWxzZSB7XG4gICAgICB0aGlzLnBvcHVwUGxhY2VtZW50LnNldCgndG9wJyk7XG4gICAgICB0aGlzLm9mZnNldFBvcG92ZXIuc2V0KC0yKTtcbiAgICB9XG4gIH0pO1xuXG4gIC8qKlxuICAgKiAgRmlyZXMgZWFjaCB0aW1lIHRoZSB1c2VyIGNsaWNrcyB0aGUgYnV0dG9uLlxuICAgKiAgQGV2ZW50XG4gICAqL1xuICBvbkNsaWNrID0gb3V0cHV0PEFYQ2xpY2tFdmVudD4oKTtcblxuICAvKipcbiAgICogRW1pdHMgd2hlbiB0aGUgcG9wb3ZlciBpcyBvcGVuZWQuXG4gICAqIEBldmVudFxuICAgKi9cbiAgb25PcGVuZWQgPSBvdXRwdXQ8QVhFdmVudD4oKTtcblxuICAvKipcbiAgICogRW1pdHMgd2hlbiB0aGUgcG9wb3ZlciBpcyBjbG9zZWQuXG4gICAqIEBldmVudFxuICAgKi9cbiAgb25DbG9zZWQgPSBvdXRwdXQ8QVhFdmVudD4oKTtcblxuICBwcml2YXRlIGFkZFN0eWxlQ2xhc3MoKSB7XG4gICAgY29uc3QgZmFiSXRlbUNvbnRhaW5lciA9IGRvY3VtZW50LnF1ZXJ5U2VsZWN0b3IoJy5heC1mYWItaXRlbS1jb250YWluZXInKTtcbiAgICBpZiAoIWZhYkl0ZW1Db250YWluZXIpIHJldHVybjtcbiAgICBpZiAodGhpcy5wb3B1cFN0eWxlKCkgPT09ICdib3gnKSB7XG4gICAgICBmYWJJdGVtQ29udGFpbmVyLmNsYXNzTGlzdC5hZGQoJ2F4LWZhYi1ib3gtc3R5bGUnKTtcbiAgICB9IGVsc2Uge1xuICAgICAgZmFiSXRlbUNvbnRhaW5lci5jbGFzc0xpc3QuYWRkKCdheC1mYWItYnViYmxlLXN0eWxlJyk7XG4gICAgfVxuICB9XG5cbiAgcHJvdGVjdGVkIG9wZW5Qb3BvdmVyKCkge1xuICAgIHRoaXMuYWRkU3R5bGVDbGFzcygpO1xuICAgIHRoaXMub25PcGVuZWQuZW1pdCh7IGNvbXBvbmVudDogdGhpcyB9KTtcbiAgfVxuXG4gIHByb3RlY3RlZCBjbG9zZVBvcG92ZXIoKSB7XG4gICAgdGhpcy5vbkNsb3NlZC5lbWl0KHsgY29tcG9uZW50OiB0aGlzIH0pO1xuICB9XG5cbiAgcHVibGljIGNsb3NlKCkge1xuICAgIHRoaXMucG9wb3ZlclJlZigpLmNsb3NlKCk7XG4gIH1cbn1cbiIsIjxheC1idXR0b24gY2xhc3M9XCJheC17eyBzaXplKCkgfX1cIiAjYnRuIChvbkNsaWNrKT1cIm9uQ2xpY2suZW1pdCgkZXZlbnQpXCIgY29sb3I9XCJwcmltYXJ5XCIgbG9vaz1cInNvbGlkXCIgW3RleHRdPVwibGFiZWwoKVwiPlxuICA8bmctY29udGVudCBzZWxlY3Q9XCJheC1pY29uXCI+IDwvbmctY29udGVudD5cbjwvYXgtYnV0dG9uPlxuXG48YXgtcG9wb3ZlclxuICAob25PcGVuZWQpPVwib3BlblBvcG92ZXIoKVwiXG4gIChvbkNsb3NlZCk9XCJjbG9zZVBvcG92ZXIoKVwiXG4gIFtkaXNhYmxlUGFuZWxDbGFzc109XCJ0cnVlXCJcbiAgW29mZnNldFldPVwib2Zmc2V0UG9wb3ZlcigpXCJcbiAgW3BsYWNlbWVudF09XCJwb3B1cFBsYWNlbWVudCgpXCJcbiAgW3RhcmdldF09XCJidG5cIlxuPlxuICA8ZGl2IGNsYXNzPVwiYXgtZmFiLWl0ZW0tY29udGFpbmVyXCI+XG4gICAgPG5nLWNvbnRlbnQgc2VsZWN0PVwiYXgtZmFiLWl0ZW1cIj4gPC9uZy1jb250ZW50PlxuICA8L2Rpdj5cbjwvYXgtcG9wb3Zlcj5cbiJdfQ==","import { AXButtonComponent } from '@acorex/components/button';\nimport { AXDecoratorModule } from '@acorex/components/decorators';\nimport { NgTemplateOutlet } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, computed, inject, input, output, ViewEncapsulation } from '@angular/core';\nimport { AXFabComponent } from '../fab.component';\nimport * as i0 from \"@angular/core\";\nimport * as i1 from \"@acorex/components/decorators\";\nexport class AXFabItemComponent {\n    constructor() {\n        this.label = input(null, ...(ngDevMode ? [{ debugName: \"label\" }] : []));\n        this.parent = inject(AXFabComponent);\n        this.buttonSize = computed(() => {\n            switch (this.parent.size()) {\n                case 'xl':\n                    return 'lg';\n                case 'lg':\n                    return 'md';\n                case 'md':\n                    return 'sm';\n                case 'sm':\n                    return 'xs';\n                case 'xs':\n                    return 'xs';\n            }\n        }, ...(ngDevMode ? [{ debugName: \"buttonSize\" }] : []));\n        /**\n         *  Fires each time the user clicks the button.\n         *  @event\n         */\n        this.onClick = output();\n    }\n    clickHandler() {\n        this.onClick.emit({ component: this });\n    }\n    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: \"12.0.0\", version: \"20.3.3\", ngImport: i0, type: AXFabItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }\n    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: \"17.0.0\", version: \"20.3.3\", type: AXFabItemComponent, isStandalone: true, selector: \"ax-fab-item\", inputs: { label: { classPropertyName: \"label\", publicName: \"label\", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onClick: \"onClick\" }, ngImport: i0, template: \"<ng-template #iconTpl>\\n  <ng-content select=\\\"ax-icon\\\"></ng-content>\\n</ng-template>\\n\\n@if (parent.popupStyle() === 'bubble') {\\n  <ax-button class=\\\"ax-{{ buttonSize() }}\\\" [text]=\\\"label()\\\" (onClick)=\\\"clickHandler()\\\">\\n    <ng-container *ngTemplateOutlet=\\\"iconTpl\\\"></ng-container>\\n  </ax-button>\\n} @else {\\n  <button (click)=\\\"clickHandler()\\\" class=\\\"ax-fab-box\\\">\\n    <ng-container *ngTemplateOutlet=\\\"iconTpl\\\"></ng-container>\\n    <ax-text> {{ label() }}</ax-text>\\n  </button>\\n}\\n\", dependencies: [{ kind: \"component\", type: AXButtonComponent, selector: \"ax-button\", inputs: [\"disabled\", \"size\", \"tabIndex\", \"color\", \"look\", \"text\", \"toggleable\", \"selected\", \"iconOnly\", \"type\", \"loadingText\"], outputs: [\"onBlur\", \"onFocus\", \"onClick\", \"selectedChange\", \"toggleableChange\", \"lookChange\", \"colorChange\", \"disabledChange\", \"loadingTextChange\"] }, { kind: \"ngmodule\", type: AXDecoratorModule }, { kind: \"component\", type: i1.AXDecoratorGenericComponent, selector: \"ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay\" }, { kind: \"directive\", type: NgTemplateOutlet, selector: \"[ngTemplateOutlet]\", inputs: [\"ngTemplateOutletContext\", \"ngTemplateOutlet\", \"ngTemplateOutletInjector\"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }\n}\ni0.ɵɵngDeclareClassMetadata({ minVersion: \"12.0.0\", version: \"20.3.3\", ngImport: i0, type: AXFabItemComponent, decorators: [{\n            type: Component,\n            args: [{ selector: 'ax-fab-item', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, imports: [AXButtonComponent, AXDecoratorModule, NgTemplateOutlet], template: \"<ng-template #iconTpl>\\n  <ng-content select=\\\"ax-icon\\\"></ng-content>\\n</ng-template>\\n\\n@if (parent.popupStyle() === 'bubble') {\\n  <ax-button class=\\\"ax-{{ buttonSize() }}\\\" [text]=\\\"label()\\\" (onClick)=\\\"clickHandler()\\\">\\n    <ng-container *ngTemplateOutlet=\\\"iconTpl\\\"></ng-container>\\n  </ax-button>\\n} @else {\\n  <button (click)=\\\"clickHandler()\\\" class=\\\"ax-fab-box\\\">\\n    <ng-container *ngTemplateOutlet=\\\"iconTpl\\\"></ng-container>\\n    <ax-text> {{ label() }}</ax-text>\\n  </button>\\n}\\n\" }]\n        }] });\n//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZmFiLWl0ZW0uY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vcGFja2FnZXMvY29tcG9uZW50cy9mYWIvc3JjL2xpYi9mYWItaXRlbS9mYWItaXRlbS5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi8uLi9wYWNrYWdlcy9jb21wb25lbnRzL2ZhYi9zcmMvbGliL2ZhYi1pdGVtL2ZhYi1pdGVtLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUNBLE9BQU8sRUFBRSxpQkFBaUIsRUFBRSxNQUFNLDJCQUEyQixDQUFDO0FBQzlELE9BQU8sRUFBRSxpQkFBaUIsRUFBRSxNQUFNLCtCQUErQixDQUFDO0FBQ2xFLE9BQU8sRUFBRSxnQkFBZ0IsRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQ25ELE9BQU8sRUFBRSx1QkFBdUIsRUFBRSxTQUFTLEVBQUUsUUFBUSxFQUFFLE1BQU0sRUFBRSxLQUFLLEVBQUUsTUFBTSxFQUFFLGlCQUFpQixFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQ3ZILE9BQU8sRUFBRSxjQUFjLEVBQUUsTUFBTSxrQkFBa0IsQ0FBQzs7O0FBU2xELE1BQU0sT0FBTyxrQkFBa0I7SUFQL0I7UUFRRSxVQUFLLEdBQUcsS0FBSyxDQUFTLElBQUksaURBQUMsQ0FBQztRQUVsQixXQUFNLEdBQUcsTUFBTSxDQUFDLGNBQWMsQ0FBQyxDQUFDO1FBRWhDLGVBQVUsR0FBRyxRQUFRLENBQUMsR0FBRyxFQUFFO1lBQ25DLFFBQVEsSUFBSSxDQUFDLE1BQU0sQ0FBQyxJQUFJLEVBQUUsRUFBRSxDQUFDO2dCQUMzQixLQUFLLElBQUk7b0JBQ1AsT0FBTyxJQUFJLENBQUM7Z0JBQ2QsS0FBSyxJQUFJO29CQUNQLE9BQU8sSUFBSSxDQUFDO2dCQUNkLEtBQUssSUFBSTtvQkFDUCxPQUFPLElBQUksQ0FBQztnQkFDZCxLQUFLLElBQUk7b0JBQ1AsT0FBTyxJQUFJLENBQUM7Z0JBQ2QsS0FBSyxJQUFJO29CQUNQLE9BQU8sSUFBSSxDQUFDO1lBQ2hCLENBQUM7UUFDSCxDQUFDLHNEQUFDLENBQUM7UUFFSDs7O1dBR0c7UUFDSCxZQUFPLEdBQUcsTUFBTSxFQUFnQixDQUFDO0tBS2xDO0lBSFcsWUFBWTtRQUNwQixJQUFJLENBQUMsT0FBTyxDQUFDLElBQUksQ0FBQyxFQUFFLFNBQVMsRUFBRSxJQUFJLEVBQUUsQ0FBQyxDQUFDO0lBQ3pDLENBQUM7OEdBNUJVLGtCQUFrQjtrR0FBbEIsa0JBQWtCLDRPQ2QvQixxZkFjQSw0Q0RGWSxpQkFBaUIsMFVBQUUsaUJBQWlCLHNQQUFFLGdCQUFnQjs7MkZBRXJELGtCQUFrQjtrQkFQOUIsU0FBUzsrQkFDRSxhQUFhLGlCQUVSLGlCQUFpQixDQUFDLElBQUksbUJBQ3BCLHVCQUF1QixDQUFDLE1BQU0sV0FDdEMsQ0FBQyxpQkFBaUIsRUFBRSxpQkFBaUIsRUFBRSxnQkFBZ0IsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IEFYQ2xpY2tFdmVudCB9IGZyb20gJ0BhY29yZXgvY2RrL2NvbW1vbic7XG5pbXBvcnQgeyBBWEJ1dHRvbkNvbXBvbmVudCB9IGZyb20gJ0BhY29yZXgvY29tcG9uZW50cy9idXR0b24nO1xuaW1wb3J0IHsgQVhEZWNvcmF0b3JNb2R1bGUgfSBmcm9tICdAYWNvcmV4L2NvbXBvbmVudHMvZGVjb3JhdG9ycyc7XG5pbXBvcnQgeyBOZ1RlbXBsYXRlT3V0bGV0IH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcbmltcG9ydCB7IENoYW5nZURldGVjdGlvblN0cmF0ZWd5LCBDb21wb25lbnQsIGNvbXB1dGVkLCBpbmplY3QsIGlucHV0LCBvdXRwdXQsIFZpZXdFbmNhcHN1bGF0aW9uIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBBWEZhYkNvbXBvbmVudCB9IGZyb20gJy4uL2ZhYi5jb21wb25lbnQnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdheC1mYWItaXRlbScsXG4gIHRlbXBsYXRlVXJsOiAnLi9mYWItaXRlbS5jb21wb25lbnQuaHRtbCcsXG4gIGVuY2Fwc3VsYXRpb246IFZpZXdFbmNhcHN1bGF0aW9uLk5vbmUsXG4gIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxuICBpbXBvcnRzOiBbQVhCdXR0b25Db21wb25lbnQsIEFYRGVjb3JhdG9yTW9kdWxlLCBOZ1RlbXBsYXRlT3V0bGV0XSxcbn0pXG5leHBvcnQgY2xhc3MgQVhGYWJJdGVtQ29tcG9uZW50IHtcbiAgbGFiZWwgPSBpbnB1dDxzdHJpbmc+KG51bGwpO1xuXG4gIHByb3RlY3RlZCBwYXJlbnQgPSBpbmplY3QoQVhGYWJDb21wb25lbnQpO1xuXG4gIHByb3RlY3RlZCBidXR0b25TaXplID0gY29tcHV0ZWQoKCkgPT4ge1xuICAgIHN3aXRjaCAodGhpcy5wYXJlbnQuc2l6ZSgpKSB7XG4gICAgICBjYXNlICd4bCc6XG4gICAgICAgIHJldHVybiAnbGcnO1xuICAgICAgY2FzZSAnbGcnOlxuICAgICAgICByZXR1cm4gJ21kJztcbiAgICAgIGNhc2UgJ21kJzpcbiAgICAgICAgcmV0dXJuICdzbSc7XG4gICAgICBjYXNlICdzbSc6XG4gICAgICAgIHJldHVybiAneHMnO1xuICAgICAgY2FzZSAneHMnOlxuICAgICAgICByZXR1cm4gJ3hzJztcbiAgICB9XG4gIH0pO1xuXG4gIC8qKlxuICAgKiAgRmlyZXMgZWFjaCB0aW1lIHRoZSB1c2VyIGNsaWNrcyB0aGUgYnV0dG9uLlxuICAgKiAgQGV2ZW50XG4gICAqL1xuICBvbkNsaWNrID0gb3V0cHV0PEFYQ2xpY2tFdmVudD4oKTtcblxuICBwcm90ZWN0ZWQgY2xpY2tIYW5kbGVyKCkge1xuICAgIHRoaXMub25DbGljay5lbWl0KHsgY29tcG9uZW50OiB0aGlzIH0pO1xuICB9XG59XG4iLCI8bmctdGVtcGxhdGUgI2ljb25UcGw+XG4gIDxuZy1jb250ZW50IHNlbGVjdD1cImF4LWljb25cIj48L25nLWNvbnRlbnQ+XG48L25nLXRlbXBsYXRlPlxuXG5AaWYgKHBhcmVudC5wb3B1cFN0eWxlKCkgPT09ICdidWJibGUnKSB7XG4gIDxheC1idXR0b24gY2xhc3M9XCJheC17eyBidXR0b25TaXplKCkgfX1cIiBbdGV4dF09XCJsYWJlbCgpXCIgKG9uQ2xpY2spPVwiY2xpY2tIYW5kbGVyKClcIj5cbiAgICA8bmctY29udGFpbmVyICpuZ1RlbXBsYXRlT3V0bGV0PVwiaWNvblRwbFwiPjwvbmctY29udGFpbmVyPlxuICA8L2F4LWJ1dHRvbj5cbn0gQGVsc2Uge1xuICA8YnV0dG9uIChjbGljayk9XCJjbGlja0hhbmRsZXIoKVwiIGNsYXNzPVwiYXgtZmFiLWJveFwiPlxuICAgIDxuZy1jb250YWluZXIgKm5nVGVtcGxhdGVPdXRsZXQ9XCJpY29uVHBsXCI+PC9uZy1jb250YWluZXI+XG4gICAgPGF4LXRleHQ+IHt7IGxhYmVsKCkgfX08L2F4LXRleHQ+XG4gIDwvYnV0dG9uPlxufVxuIl19","/**\n * Generated bundle index. Do not edit.\n */\nexport * from './index';\n//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYWNvcmV4LWNvbXBvbmVudHMtZmFiLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcGFja2FnZXMvY29tcG9uZW50cy9mYWIvc3JjL2Fjb3JleC1jb21wb25lbnRzLWZhYi50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7R0FFRztBQUVILGNBQWMsU0FBUyxDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBHZW5lcmF0ZWQgYnVuZGxlIGluZGV4LiBEbyBub3QgZWRpdC5cbiAqL1xuXG5leHBvcnQgKiBmcm9tICcuL2luZGV4JztcbiJdfQ=="],"names":["i1"],"mappings":"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"}
+{"version":3,"file":"acorex-components-fab.mjs","sources":["../../../../packages/components/fab/src/lib/fab.component.ts","../../../../packages/components/fab/src/lib/fab.component.html","../../../../packages/components/fab/src/lib/fab-item/fab-item.component.ts","../../../../packages/components/fab/src/lib/fab-item/fab-item.component.html","../../../../packages/components/fab/src/acorex-components-fab.ts"],"sourcesContent":["import { AXClickEvent, AXEvent, AXPlacementType } from '@acorex/cdk/common';\nimport { AXButtonComponent } from '@acorex/components/button';\nimport { AXDecoratorModule } from '@acorex/components/decorators';\nimport { AXPopoverComponent, AXPopoverModule } from '@acorex/components/popover';\nimport {\n  ChangeDetectionStrategy,\n  Component,\n  effect,\n  input,\n  model,\n  output,\n  signal,\n  viewChild,\n  ViewEncapsulation,\n} from '@angular/core';\n\n@Component({\n  selector: 'ax-fab',\n  templateUrl: './fab.component.html',\n  styleUrls: ['./fab.component.compiled.css'],\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  imports: [AXButtonComponent, AXPopoverModule, AXDecoratorModule],\n})\nexport class AXFabComponent {\n  label = input<string>(null);\n\n  popupStyle = input<'bubble' | 'box'>('bubble');\n\n  popupPlacement = model<AXPlacementType>(null);\n\n  size = input<'xs' | 'sm' | 'md' | 'lg' | 'xl'>('md');\n\n  protected popoverRef = viewChild(AXPopoverComponent);\n\n  protected offsetPopover = signal<number>(null);\n\n  #eff = effect(() => {\n    if (this.popupStyle() === 'box') {\n      this.popupPlacement.set('top-end');\n      this.offsetPopover.set(-10);\n    } else {\n      this.popupPlacement.set('top');\n      this.offsetPopover.set(-2);\n    }\n  });\n\n  /**\n   *  Fires each time the user clicks the button.\n   *  @event\n   */\n  onClick = output<AXClickEvent>();\n\n  /**\n   * Emits when the popover is opened.\n   * @event\n   */\n  onOpened = output<AXEvent>();\n\n  /**\n   * Emits when the popover is closed.\n   * @event\n   */\n  onClosed = output<AXEvent>();\n\n  private addStyleClass() {\n    const fabItemContainer = document.querySelector('.ax-fab-item-container');\n    if (!fabItemContainer) return;\n    if (this.popupStyle() === 'box') {\n      fabItemContainer.classList.add('ax-fab-box-style');\n    } else {\n      fabItemContainer.classList.add('ax-fab-bubble-style');\n    }\n  }\n\n  protected openPopover() {\n    this.addStyleClass();\n    this.onOpened.emit({ component: this });\n  }\n\n  protected closePopover() {\n    this.onClosed.emit({ component: this });\n  }\n\n  public close() {\n    this.popoverRef().close();\n  }\n}\n","<ax-button class=\"ax-{{ size() }}\" #btn (onClick)=\"onClick.emit($event)\" color=\"primary\" look=\"solid\" [text]=\"label()\">\n  <ng-content select=\"ax-icon\"> </ng-content>\n</ax-button>\n\n<ax-popover\n  (onOpened)=\"openPopover()\"\n  (onClosed)=\"closePopover()\"\n  [disablePanelClass]=\"true\"\n  [offsetY]=\"offsetPopover()\"\n  [placement]=\"popupPlacement()\"\n  [target]=\"btn\"\n>\n  <div class=\"ax-fab-item-container\">\n    <ng-content select=\"ax-fab-item\"> </ng-content>\n  </div>\n</ax-popover>\n","import { AXClickEvent } from '@acorex/cdk/common';\nimport { AXButtonComponent } from '@acorex/components/button';\nimport { AXDecoratorModule } from '@acorex/components/decorators';\nimport { NgTemplateOutlet } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, computed, inject, input, output, ViewEncapsulation } from '@angular/core';\nimport { AXFabComponent } from '../fab.component';\n\n@Component({\n  selector: 'ax-fab-item',\n  templateUrl: './fab-item.component.html',\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  imports: [AXButtonComponent, AXDecoratorModule, NgTemplateOutlet],\n})\nexport class AXFabItemComponent {\n  label = input<string>(null);\n\n  protected parent = inject(AXFabComponent);\n\n  protected buttonSize = computed(() => {\n    switch (this.parent.size()) {\n      case 'xl':\n        return 'lg';\n      case 'lg':\n        return 'md';\n      case 'md':\n        return 'sm';\n      case 'sm':\n        return 'xs';\n      case 'xs':\n        return 'xs';\n    }\n  });\n\n  /**\n   *  Fires each time the user clicks the button.\n   *  @event\n   */\n  onClick = output<AXClickEvent>();\n\n  protected clickHandler() {\n    this.onClick.emit({ component: this });\n  }\n}\n","<ng-template #iconTpl>\n  <ng-content select=\"ax-icon\"></ng-content>\n</ng-template>\n\n@if (parent.popupStyle() === 'bubble') {\n  <ax-button class=\"ax-{{ buttonSize() }}\" [text]=\"label()\" (onClick)=\"clickHandler()\">\n    <ng-container *ngTemplateOutlet=\"iconTpl\"></ng-container>\n  </ax-button>\n} @else {\n  <button (click)=\"clickHandler()\" class=\"ax-fab-box\">\n    <ng-container *ngTemplateOutlet=\"iconTpl\"></ng-container>\n    <ax-text> {{ label() }}</ax-text>\n  </button>\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/acorex-components-flow-chart.mjs

@@ -424,10 +424,10 @@ class AXFlowChartService {
         this.nodesMap.clear();
         this.eventListeners.clear();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXFlowChartService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXFlowChartService }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: AXFlowChartService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: AXFlowChartService }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXFlowChartService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: AXFlowChartService, decorators: [{
             type: Injectable
         }] });
 
@@ -499,12 +499,12 @@ class AXFlowChartCreatorComponent extends NXComponent {
         printWindow.document.write(printContent);
         printWindow.document.close();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXFlowChartCreatorComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.3", type: AXFlowChartCreatorComponent, isStandalone: true, selector: "ax-flow-chart-creator", providers: [{ provide: AXComponent, useExisting: AXFlowChartCreatorComponent }], usesInheritance: true, ngImport: i0, template: "<div class=\"ax-shape-container\">\n  <div\n    [ngClass]=\"{ 'ax-shape-selected': selectedShape() === 'rectangle' }\"\n    (click)=\"selectShapeHandler('rectangle')\"\n    class=\"ax-rectangle\"\n  ></div>\n  <div\n    [ngClass]=\"{ 'ax-shape-selected': selectedShape() === 'circle' }\"\n    (click)=\"selectShapeHandler('circle')\"\n    class=\"ax-circle\"\n  ></div>\n  <div\n    [ngClass]=\"{ 'ax-shape-selected': selectedShape() === 'diamond' }\"\n    (click)=\"selectShapeHandler('diamond')\"\n    class=\"ax-diamond\"\n  ></div>\n</div>\n<ax-text-box class=\"ax-sm\" [(ngModel)]=\"label\" placeholder=\"Label\"> </ax-text-box>\n\n<ax-button class=\"ax-sm\" (onClick)=\"createShapeHandler()\" color=\"primary\" text=\"Create\"></ax-button>\n<ax-button color=\"primary\" text=\"Print\" class=\"ax-sm\" (click)=\"printChart()\"></ax-button>\n", styles: ["ax-flow-chart-creator{display:flex;gap:1rem;align-items:center;padding:1rem}ax-flow-chart-creator .ax-shape-container{display:flex;gap:1rem}ax-flow-chart-creator .ax-shape-container .ax-shape-selected{border:2px solid rgba(var(--ax-sys-color-danger-darker-surface))!important}ax-flow-chart-creator .ax-shape-container .ax-rectangle,ax-flow-chart-creator .ax-shape-container .ax-circle,ax-flow-chart-creator .ax-shape-container .ax-diamond{border:2px solid rgba(var(--ax-sys-color-border-surface));display:flex;justify-content:center;align-items:center;width:30px;height:30px;cursor:pointer}ax-flow-chart-creator .ax-shape-container .ax-circle{border-radius:1000vmax;aspect-ratio:1}ax-flow-chart-creator .ax-shape-container .ax-diamond{transform:rotate(45deg) scale(.75);aspect-ratio:1}\n"], dependencies: [{ kind: "ngmodule", type: AXTextBoxModule }, { kind: "component", type: i1.AXTextBoxComponent, selector: "ax-text-box", inputs: ["disabled", "tabIndex", "readonly", "value", "state", "name", "id", "placeholder", "maxLength", "allowNull", "type", "autoComplete", "look", "maskPattern", "customTokens", "class"], outputs: ["onBlur", "onFocus", "valueChange", "stateChange", "onValueChanged", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress", "onMaskChanged"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i2.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "iconOnly", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: AXFlowChartCreatorComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.3", type: AXFlowChartCreatorComponent, isStandalone: true, selector: "ax-flow-chart-creator", providers: [{ provide: AXComponent, useExisting: AXFlowChartCreatorComponent }], usesInheritance: true, ngImport: i0, template: "<div class=\"ax-shape-container\">\n  <div\n    [ngClass]=\"{ 'ax-shape-selected': selectedShape() === 'rectangle' }\"\n    (click)=\"selectShapeHandler('rectangle')\"\n    class=\"ax-rectangle\"\n  ></div>\n  <div\n    [ngClass]=\"{ 'ax-shape-selected': selectedShape() === 'circle' }\"\n    (click)=\"selectShapeHandler('circle')\"\n    class=\"ax-circle\"\n  ></div>\n  <div\n    [ngClass]=\"{ 'ax-shape-selected': selectedShape() === 'diamond' }\"\n    (click)=\"selectShapeHandler('diamond')\"\n    class=\"ax-diamond\"\n  ></div>\n</div>\n<ax-text-box class=\"ax-sm\" [(ngModel)]=\"label\" placeholder=\"Label\"> </ax-text-box>\n\n<ax-button class=\"ax-sm\" (onClick)=\"createShapeHandler()\" color=\"primary\" text=\"Create\"></ax-button>\n<ax-button color=\"primary\" text=\"Print\" class=\"ax-sm\" (click)=\"printChart()\"></ax-button>\n", styles: ["ax-flow-chart-creator{align-items:center;gap:1rem;padding:1rem;display:flex}ax-flow-chart-creator .ax-shape-container{gap:1rem;display:flex}ax-flow-chart-creator .ax-shape-container .ax-shape-selected{border:2px solid rgba(var(--ax-sys-color-danger-darker-surface))!important}ax-flow-chart-creator .ax-shape-container .ax-rectangle,ax-flow-chart-creator .ax-shape-container .ax-circle,ax-flow-chart-creator .ax-shape-container .ax-diamond{border:2px solid rgba(var(--ax-sys-color-border-surface));cursor:pointer;justify-content:center;align-items:center;width:30px;height:30px;display:flex}ax-flow-chart-creator .ax-shape-container .ax-circle{aspect-ratio:1;border-radius:1000vmax}ax-flow-chart-creator .ax-shape-container .ax-diamond{aspect-ratio:1;transform:rotate(45deg)scale(.75)}\n"], dependencies: [{ kind: "ngmodule", type: AXTextBoxModule }, { kind: "component", type: i1.AXTextBoxComponent, selector: "ax-text-box", inputs: ["disabled", "tabIndex", "readonly", "value", "state", "name", "id", "placeholder", "maxLength", "allowNull", "type", "autoComplete", "look", "maskPattern", "customTokens", "class"], outputs: ["onBlur", "onFocus", "valueChange", "stateChange", "onValueChanged", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress", "onMaskChanged"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i2.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "iconOnly", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXFlowChartCreatorComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: AXFlowChartCreatorComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ax-flow-chart-creator', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [AXTextBoxModule, AXButtonModule, CommonModule, FormsModule], providers: [{ provide: AXComponent, useExisting: AXFlowChartCreatorComponent }], template: "<div class=\"ax-shape-container\">\n  <div\n    [ngClass]=\"{ 'ax-shape-selected': selectedShape() === 'rectangle' }\"\n    (click)=\"selectShapeHandler('rectangle')\"\n    class=\"ax-rectangle\"\n  ></div>\n  <div\n    [ngClass]=\"{ 'ax-shape-selected': selectedShape() === 'circle' }\"\n    (click)=\"selectShapeHandler('circle')\"\n    class=\"ax-circle\"\n  ></div>\n  <div\n    [ngClass]=\"{ 'ax-shape-selected': selectedShape() === 'diamond' }\"\n    (click)=\"selectShapeHandler('diamond')\"\n    class=\"ax-diamond\"\n  ></div>\n</div>\n<ax-text-box class=\"ax-sm\" [(ngModel)]=\"label\" placeholder=\"Label\"> </ax-text-box>\n\n<ax-button class=\"ax-sm\" (onClick)=\"createShapeHandler()\" color=\"primary\" text=\"Create\"></ax-button>\n<ax-button color=\"primary\" text=\"Print\" class=\"ax-sm\" (click)=\"printChart()\"></ax-button>\n", styles: ["ax-flow-chart-creator{display:flex;gap:1rem;align-items:center;padding:1rem}ax-flow-chart-creator .ax-shape-container{display:flex;gap:1rem}ax-flow-chart-creator .ax-shape-container .ax-shape-selected{border:2px solid rgba(var(--ax-sys-color-danger-darker-surface))!important}ax-flow-chart-creator .ax-shape-container .ax-rectangle,ax-flow-chart-creator .ax-shape-container .ax-circle,ax-flow-chart-creator .ax-shape-container .ax-diamond{border:2px solid rgba(var(--ax-sys-color-border-surface));display:flex;justify-content:center;align-items:center;width:30px;height:30px;cursor:pointer}ax-flow-chart-creator .ax-shape-container .ax-circle{border-radius:1000vmax;aspect-ratio:1}ax-flow-chart-creator .ax-shape-container .ax-diamond{transform:rotate(45deg) scale(.75);aspect-ratio:1}\n"] }]
+            args: [{ selector: 'ax-flow-chart-creator', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [AXTextBoxModule, AXButtonModule, CommonModule, FormsModule], providers: [{ provide: AXComponent, useExisting: AXFlowChartCreatorComponent }], template: "<div class=\"ax-shape-container\">\n  <div\n    [ngClass]=\"{ 'ax-shape-selected': selectedShape() === 'rectangle' }\"\n    (click)=\"selectShapeHandler('rectangle')\"\n    class=\"ax-rectangle\"\n  ></div>\n  <div\n    [ngClass]=\"{ 'ax-shape-selected': selectedShape() === 'circle' }\"\n    (click)=\"selectShapeHandler('circle')\"\n    class=\"ax-circle\"\n  ></div>\n  <div\n    [ngClass]=\"{ 'ax-shape-selected': selectedShape() === 'diamond' }\"\n    (click)=\"selectShapeHandler('diamond')\"\n    class=\"ax-diamond\"\n  ></div>\n</div>\n<ax-text-box class=\"ax-sm\" [(ngModel)]=\"label\" placeholder=\"Label\"> </ax-text-box>\n\n<ax-button class=\"ax-sm\" (onClick)=\"createShapeHandler()\" color=\"primary\" text=\"Create\"></ax-button>\n<ax-button color=\"primary\" text=\"Print\" class=\"ax-sm\" (click)=\"printChart()\"></ax-button>\n", styles: ["ax-flow-chart-creator{align-items:center;gap:1rem;padding:1rem;display:flex}ax-flow-chart-creator .ax-shape-container{gap:1rem;display:flex}ax-flow-chart-creator .ax-shape-container .ax-shape-selected{border:2px solid rgba(var(--ax-sys-color-danger-darker-surface))!important}ax-flow-chart-creator .ax-shape-container .ax-rectangle,ax-flow-chart-creator .ax-shape-container .ax-circle,ax-flow-chart-creator .ax-shape-container .ax-diamond{border:2px solid rgba(var(--ax-sys-color-border-surface));cursor:pointer;justify-content:center;align-items:center;width:30px;height:30px;display:flex}ax-flow-chart-creator .ax-shape-container .ax-circle{aspect-ratio:1;border-radius:1000vmax}ax-flow-chart-creator .ax-shape-container .ax-diamond{aspect-ratio:1;transform:rotate(45deg)scale(.75)}\n"] }]
         }] });
 
 class AXFlowChartRendererComponent extends NXComponent {
@@ -588,13 +588,13 @@ class AXFlowChartRendererComponent extends NXComponent {
         this.service.nodeDbClick.unsubscribe();
         this.service.onEdgeUpdate.unsubscribe();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXFlowChartRendererComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.3.3", type: AXFlowChartRendererComponent, isStandalone: true, selector: "ax-flow-chart-renderer", outputs: { onLineClick: "onLineClick", onLineDbClick: "onLineDbClick", onNodeClick: "onNodeClick", onNodeDbClick: "onNodeDbClick", onEdgeUpdate: "onEdgeUpdate", onNodeUpdate: "onNodeUpdate" }, providers: [{ provide: AXComponent, useExisting: AXFlowChartRendererComponent }], viewQueries: [{ propertyName: "canvas", first: true, predicate: ["canvas"], descendants: true, isSignal: true }, { propertyName: "svg", first: true, predicate: ["connections"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div id=\"ax-flow-chart-renderer-canvas\" #canvas>\n  <svg class=\"ax-flow-chart-renderer-svg\" id=\"ax-flow-chart-renderer-connections\" #connections></svg>\n</div>\n", styles: ["ax-flow-chart-renderer{overflow:hidden;width:var(--ax-comp-flow-chart-width, 100%);height:var(--ax-comp-flow-chart-height, 30rem);-webkit-print-color-adjust:exact;print-color-adjust:exact}ax-flow-chart-renderer #ax-flow-chart-renderer-canvas{position:relative;width:100%;height:100%}ax-flow-chart-renderer .ax-flow-chart-node{position:absolute;padding:1rem;background-color:rgba(var(--ax-sys-color-surface));color:rgba(var(--ax-sys-color-on-surface));border:2px solid rgba(var(--ax-sys-color-border-surface));cursor:move;-webkit-user-select:none;user-select:none}ax-flow-chart-renderer .ax-flow-chart-node.selected{border:2px solid rgba(var(--ax-sys-color-danger-darker-surface))}ax-flow-chart-renderer .ax-flow-chart-node .ax-flow-chart-anchor{opacity:0;transition:opacity .5s ease}ax-flow-chart-renderer .ax-flow-chart-node:hover .ax-flow-chart-anchor,ax-flow-chart-renderer .ax-flow-chart-node.selected .ax-flow-chart-anchor{opacity:1}ax-flow-chart-renderer .ax-flow-chart-anchor{position:absolute;width:10px;height:10px;background-color:rgba(var(--ax-sys-color-on-lightest-surface));border-radius:50%;cursor:crosshair;transform:translate(-50%,-50%)}ax-flow-chart-renderer .ax-flow-chart-anchor.selected{background-color:rgba(var(--ax-sys-color-primary-surface))}ax-flow-chart-renderer .ax-flow-chart-anchor.hover{transition:.3s all ease;scale:1.3;background-color:rgba(var(--ax-sys-color-danger-darkest-surface))}ax-flow-chart-renderer .ax-flow-chart-anchor:before{content:\"\";position:absolute;top:-7px;left:-7px;right:-7px;bottom:-7px}ax-flow-chart-renderer .ax-flow-chart-renderer-svg{position:absolute;top:0;left:0;overflow:visible}ax-flow-chart-renderer .ax-flow-chart-line:hover{transition:.3s all ease;stroke:rgba(var(--ax-sys-color-danger-darker-surface));cursor:pointer}ax-flow-chart-renderer .ax-flow-chart-line.selected{stroke:rgba(var(--ax-sys-color-primary-surface))}ax-flow-chart-renderer .ax-rectangle,ax-flow-chart-renderer .ax-circle,ax-flow-chart-renderer .ax-diamond{border:2px solid rgba(var(--ax-sys-color-border-surface));display:flex;justify-content:center;align-items:center;width:auto;height:auto}ax-flow-chart-renderer .ax-circle{border-radius:1000vmax;aspect-ratio:1}ax-flow-chart-renderer .ax-diamond{transform:rotate(45deg) scale(.75);aspect-ratio:1}ax-flow-chart-renderer .ax-diamond p{transform:rotate(-45deg) scale(1.25)}ax-flow-chart-renderer .ax-diamond .ax-flow-chart-anchor{width:14px;height:14px}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: AXFlowChartRendererComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.1.3", type: AXFlowChartRendererComponent, isStandalone: true, selector: "ax-flow-chart-renderer", outputs: { onLineClick: "onLineClick", onLineDbClick: "onLineDbClick", onNodeClick: "onNodeClick", onNodeDbClick: "onNodeDbClick", onEdgeUpdate: "onEdgeUpdate", onNodeUpdate: "onNodeUpdate" }, providers: [{ provide: AXComponent, useExisting: AXFlowChartRendererComponent }], viewQueries: [{ propertyName: "canvas", first: true, predicate: ["canvas"], descendants: true, isSignal: true }, { propertyName: "svg", first: true, predicate: ["connections"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div id=\"ax-flow-chart-renderer-canvas\" #canvas>\n  <svg class=\"ax-flow-chart-renderer-svg\" id=\"ax-flow-chart-renderer-connections\" #connections></svg>\n</div>\n", styles: ["ax-flow-chart-renderer{width:var(--ax-comp-flow-chart-width,100%);height:var(--ax-comp-flow-chart-height,30rem);-webkit-print-color-adjust:exact;print-color-adjust:exact;overflow:hidden}ax-flow-chart-renderer #ax-flow-chart-renderer-canvas{width:100%;height:100%;position:relative}ax-flow-chart-renderer .ax-flow-chart-node{background-color:rgba(var(--ax-sys-color-surface));color:rgba(var(--ax-sys-color-on-surface));border:2px solid rgba(var(--ax-sys-color-border-surface));cursor:move;-webkit-user-select:none;user-select:none;padding:1rem;position:absolute}ax-flow-chart-renderer .ax-flow-chart-node.selected{border:2px solid rgba(var(--ax-sys-color-danger-darker-surface))}ax-flow-chart-renderer .ax-flow-chart-node .ax-flow-chart-anchor{opacity:0;transition:opacity .5s}ax-flow-chart-renderer .ax-flow-chart-node:hover .ax-flow-chart-anchor,ax-flow-chart-renderer .ax-flow-chart-node.selected .ax-flow-chart-anchor{opacity:1}ax-flow-chart-renderer .ax-flow-chart-anchor{background-color:rgba(var(--ax-sys-color-on-lightest-surface));cursor:crosshair;border-radius:50%;width:10px;height:10px;position:absolute;transform:translate(-50%,-50%)}ax-flow-chart-renderer .ax-flow-chart-anchor.selected{background-color:rgba(var(--ax-sys-color-primary-surface))}ax-flow-chart-renderer .ax-flow-chart-anchor.hover{background-color:rgba(var(--ax-sys-color-danger-darkest-surface));transition:all .3s;scale:1.3}ax-flow-chart-renderer .ax-flow-chart-anchor:before{content:\"\";position:absolute;top:-7px;right:-7px;bottom:-7px;left:-7px}ax-flow-chart-renderer .ax-flow-chart-renderer-svg{position:absolute;top:0;left:0;overflow:visible}ax-flow-chart-renderer .ax-flow-chart-line:hover{stroke:rgba(var(--ax-sys-color-danger-darker-surface));cursor:pointer;transition:all .3s}ax-flow-chart-renderer .ax-flow-chart-line.selected{stroke:rgba(var(--ax-sys-color-primary-surface))}ax-flow-chart-renderer .ax-rectangle,ax-flow-chart-renderer .ax-circle,ax-flow-chart-renderer .ax-diamond{border:2px solid rgba(var(--ax-sys-color-border-surface));justify-content:center;align-items:center;width:auto;height:auto;display:flex}ax-flow-chart-renderer .ax-circle{aspect-ratio:1;border-radius:1000vmax}ax-flow-chart-renderer .ax-diamond{aspect-ratio:1;transform:rotate(45deg)scale(.75)}ax-flow-chart-renderer .ax-diamond p{transform:rotate(-45deg)scale(1.25)}ax-flow-chart-renderer .ax-diamond .ax-flow-chart-anchor{width:14px;height:14px}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXFlowChartRendererComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: AXFlowChartRendererComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ax-flow-chart-renderer', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [{ provide: AXComponent, useExisting: AXFlowChartRendererComponent }], template: "<div id=\"ax-flow-chart-renderer-canvas\" #canvas>\n  <svg class=\"ax-flow-chart-renderer-svg\" id=\"ax-flow-chart-renderer-connections\" #connections></svg>\n</div>\n", styles: ["ax-flow-chart-renderer{overflow:hidden;width:var(--ax-comp-flow-chart-width, 100%);height:var(--ax-comp-flow-chart-height, 30rem);-webkit-print-color-adjust:exact;print-color-adjust:exact}ax-flow-chart-renderer #ax-flow-chart-renderer-canvas{position:relative;width:100%;height:100%}ax-flow-chart-renderer .ax-flow-chart-node{position:absolute;padding:1rem;background-color:rgba(var(--ax-sys-color-surface));color:rgba(var(--ax-sys-color-on-surface));border:2px solid rgba(var(--ax-sys-color-border-surface));cursor:move;-webkit-user-select:none;user-select:none}ax-flow-chart-renderer .ax-flow-chart-node.selected{border:2px solid rgba(var(--ax-sys-color-danger-darker-surface))}ax-flow-chart-renderer .ax-flow-chart-node .ax-flow-chart-anchor{opacity:0;transition:opacity .5s ease}ax-flow-chart-renderer .ax-flow-chart-node:hover .ax-flow-chart-anchor,ax-flow-chart-renderer .ax-flow-chart-node.selected .ax-flow-chart-anchor{opacity:1}ax-flow-chart-renderer .ax-flow-chart-anchor{position:absolute;width:10px;height:10px;background-color:rgba(var(--ax-sys-color-on-lightest-surface));border-radius:50%;cursor:crosshair;transform:translate(-50%,-50%)}ax-flow-chart-renderer .ax-flow-chart-anchor.selected{background-color:rgba(var(--ax-sys-color-primary-surface))}ax-flow-chart-renderer .ax-flow-chart-anchor.hover{transition:.3s all ease;scale:1.3;background-color:rgba(var(--ax-sys-color-danger-darkest-surface))}ax-flow-chart-renderer .ax-flow-chart-anchor:before{content:\"\";position:absolute;top:-7px;left:-7px;right:-7px;bottom:-7px}ax-flow-chart-renderer .ax-flow-chart-renderer-svg{position:absolute;top:0;left:0;overflow:visible}ax-flow-chart-renderer .ax-flow-chart-line:hover{transition:.3s all ease;stroke:rgba(var(--ax-sys-color-danger-darker-surface));cursor:pointer}ax-flow-chart-renderer .ax-flow-chart-line.selected{stroke:rgba(var(--ax-sys-color-primary-surface))}ax-flow-chart-renderer .ax-rectangle,ax-flow-chart-renderer .ax-circle,ax-flow-chart-renderer .ax-diamond{border:2px solid rgba(var(--ax-sys-color-border-surface));display:flex;justify-content:center;align-items:center;width:auto;height:auto}ax-flow-chart-renderer .ax-circle{border-radius:1000vmax;aspect-ratio:1}ax-flow-chart-renderer .ax-diamond{transform:rotate(45deg) scale(.75);aspect-ratio:1}ax-flow-chart-renderer .ax-diamond p{transform:rotate(-45deg) scale(1.25)}ax-flow-chart-renderer .ax-diamond .ax-flow-chart-anchor{width:14px;height:14px}\n"] }]
-        }] });
+            args: [{ selector: 'ax-flow-chart-renderer', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [{ provide: AXComponent, useExisting: AXFlowChartRendererComponent }], template: "<div id=\"ax-flow-chart-renderer-canvas\" #canvas>\n  <svg class=\"ax-flow-chart-renderer-svg\" id=\"ax-flow-chart-renderer-connections\" #connections></svg>\n</div>\n", styles: ["ax-flow-chart-renderer{width:var(--ax-comp-flow-chart-width,100%);height:var(--ax-comp-flow-chart-height,30rem);-webkit-print-color-adjust:exact;print-color-adjust:exact;overflow:hidden}ax-flow-chart-renderer #ax-flow-chart-renderer-canvas{width:100%;height:100%;position:relative}ax-flow-chart-renderer .ax-flow-chart-node{background-color:rgba(var(--ax-sys-color-surface));color:rgba(var(--ax-sys-color-on-surface));border:2px solid rgba(var(--ax-sys-color-border-surface));cursor:move;-webkit-user-select:none;user-select:none;padding:1rem;position:absolute}ax-flow-chart-renderer .ax-flow-chart-node.selected{border:2px solid rgba(var(--ax-sys-color-danger-darker-surface))}ax-flow-chart-renderer .ax-flow-chart-node .ax-flow-chart-anchor{opacity:0;transition:opacity .5s}ax-flow-chart-renderer .ax-flow-chart-node:hover .ax-flow-chart-anchor,ax-flow-chart-renderer .ax-flow-chart-node.selected .ax-flow-chart-anchor{opacity:1}ax-flow-chart-renderer .ax-flow-chart-anchor{background-color:rgba(var(--ax-sys-color-on-lightest-surface));cursor:crosshair;border-radius:50%;width:10px;height:10px;position:absolute;transform:translate(-50%,-50%)}ax-flow-chart-renderer .ax-flow-chart-anchor.selected{background-color:rgba(var(--ax-sys-color-primary-surface))}ax-flow-chart-renderer .ax-flow-chart-anchor.hover{background-color:rgba(var(--ax-sys-color-danger-darkest-surface));transition:all .3s;scale:1.3}ax-flow-chart-renderer .ax-flow-chart-anchor:before{content:\"\";position:absolute;top:-7px;right:-7px;bottom:-7px;left:-7px}ax-flow-chart-renderer .ax-flow-chart-renderer-svg{position:absolute;top:0;left:0;overflow:visible}ax-flow-chart-renderer .ax-flow-chart-line:hover{stroke:rgba(var(--ax-sys-color-danger-darker-surface));cursor:pointer;transition:all .3s}ax-flow-chart-renderer .ax-flow-chart-line.selected{stroke:rgba(var(--ax-sys-color-primary-surface))}ax-flow-chart-renderer .ax-rectangle,ax-flow-chart-renderer .ax-circle,ax-flow-chart-renderer .ax-diamond{border:2px solid rgba(var(--ax-sys-color-border-surface));justify-content:center;align-items:center;width:auto;height:auto;display:flex}ax-flow-chart-renderer .ax-circle{aspect-ratio:1;border-radius:1000vmax}ax-flow-chart-renderer .ax-diamond{aspect-ratio:1;transform:rotate(45deg)scale(.75)}ax-flow-chart-renderer .ax-diamond p{transform:rotate(-45deg)scale(1.25)}ax-flow-chart-renderer .ax-diamond .ax-flow-chart-anchor{width:14px;height:14px}\n"] }]
+        }], propDecorators: { canvas: [{ type: i0.ViewChild, args: ['canvas', { isSignal: true }] }], svg: [{ type: i0.ViewChild, args: ['connections', { isSignal: true }] }], onLineClick: [{ type: i0.Output, args: ["onLineClick"] }], onLineDbClick: [{ type: i0.Output, args: ["onLineDbClick"] }], onNodeClick: [{ type: i0.Output, args: ["onNodeClick"] }], onNodeDbClick: [{ type: i0.Output, args: ["onNodeDbClick"] }], onEdgeUpdate: [{ type: i0.Output, args: ["onEdgeUpdate"] }], onNodeUpdate: [{ type: i0.Output, args: ["onNodeUpdate"] }] } });
 
 class AXFlowChartComponent extends NXComponent {
     constructor() {
@@ -658,23 +658,23 @@ class AXFlowChartComponent extends NXComponent {
     removeNode(nodeId) {
         this.flowChartService.removeNode(nodeId);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXFlowChartComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.3", type: AXFlowChartComponent, isStandalone: true, selector: "ax-flow-chart", inputs: { initialFlowChartNode: { classPropertyName: "initialFlowChartNode", publicName: "initialFlowChartNode", isSignal: true, isRequired: true, transformFunction: null }, initialFlowChartEdge: { classPropertyName: "initialFlowChartEdge", publicName: "initialFlowChartEdge", isSignal: true, isRequired: true, transformFunction: null } }, host: { listeners: { "document:keydown": "handleKeyboardEvent($event)" } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: AXFlowChartComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.3", type: AXFlowChartComponent, isStandalone: true, selector: "ax-flow-chart", inputs: { initialFlowChartNode: { classPropertyName: "initialFlowChartNode", publicName: "initialFlowChartNode", isSignal: true, isRequired: true, transformFunction: null }, initialFlowChartEdge: { classPropertyName: "initialFlowChartEdge", publicName: "initialFlowChartEdge", isSignal: true, isRequired: true, transformFunction: null } }, host: { listeners: { "document:keydown": "handleKeyboardEvent($event)" } }, providers: [
             AXFlowChartService,
             { provide: AXComponent, useExisting: AXFlowChartComponent },
             { provide: AXValuableComponent, useExisting: AXFlowChartComponent },
             { provide: AXFocusableComponent, useExisting: AXFlowChartComponent },
-        ], usesInheritance: true, ngImport: i0, template: "<ng-content select=\"ax-header\"></ng-content>\n<ng-content select=\"ax-flow-chart-renderer\"></ng-content>\n<ng-content select=\"ax-footer\"></ng-content>\n", styles: ["ax-flow-chart{display:flex;flex-direction:column;width:100%;height:100%;border:1px solid rgba(var(--ax-sys-color-border-lightest-surface));border-radius:var(--ax-sys-border-radius)}ax-flow-chart ax-header{border-bottom:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-flow-chart ax-footer{border-top:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+        ], usesInheritance: true, ngImport: i0, template: "<ng-content select=\"ax-header\"></ng-content>\n<ng-content select=\"ax-flow-chart-renderer\"></ng-content>\n<ng-content select=\"ax-footer\"></ng-content>\n", styles: ["ax-flow-chart{border:1px solid rgba(var(--ax-sys-color-border-lightest-surface));border-radius:var(--ax-sys-border-radius);flex-direction:column;width:100%;height:100%;display:flex}ax-flow-chart ax-header{border-bottom:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-flow-chart ax-footer{border-top:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXFlowChartComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: AXFlowChartComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ax-flow-chart', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [
                         AXFlowChartService,
                         { provide: AXComponent, useExisting: AXFlowChartComponent },
                         { provide: AXValuableComponent, useExisting: AXFlowChartComponent },
                         { provide: AXFocusableComponent, useExisting: AXFlowChartComponent },
-                    ], template: "<ng-content select=\"ax-header\"></ng-content>\n<ng-content select=\"ax-flow-chart-renderer\"></ng-content>\n<ng-content select=\"ax-footer\"></ng-content>\n", styles: ["ax-flow-chart{display:flex;flex-direction:column;width:100%;height:100%;border:1px solid rgba(var(--ax-sys-color-border-lightest-surface));border-radius:var(--ax-sys-border-radius)}ax-flow-chart ax-header{border-bottom:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-flow-chart ax-footer{border-top:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}\n"] }]
-        }], propDecorators: { handleKeyboardEvent: [{
+                    ], template: "<ng-content select=\"ax-header\"></ng-content>\n<ng-content select=\"ax-flow-chart-renderer\"></ng-content>\n<ng-content select=\"ax-footer\"></ng-content>\n", styles: ["ax-flow-chart{border:1px solid rgba(var(--ax-sys-color-border-lightest-surface));border-radius:var(--ax-sys-border-radius);flex-direction:column;width:100%;height:100%;display:flex}ax-flow-chart ax-header{border-bottom:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-flow-chart ax-footer{border-top:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}\n"] }]
+        }], propDecorators: { initialFlowChartNode: [{ type: i0.Input, args: [{ isSignal: true, alias: "initialFlowChartNode", required: true }] }], initialFlowChartEdge: [{ type: i0.Input, args: [{ isSignal: true, alias: "initialFlowChartEdge", required: true }] }], handleKeyboardEvent: [{
                 type: HostListener,
                 args: ['document:keydown', ['$event']]
             }] } });
@@ -682,11 +682,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImpor
 const COMPONENT = [AXFlowChartRendererComponent, AXFlowChartCreatorComponent, AXFlowChartComponent];
 const MODULES = [CommonModule];
 class AXFlowChartModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXFlowChartModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.3", ngImport: i0, type: AXFlowChartModule, imports: [CommonModule, AXFlowChartRendererComponent, AXFlowChartCreatorComponent, AXFlowChartComponent], exports: [AXFlowChartRendererComponent, AXFlowChartCreatorComponent, AXFlowChartComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXFlowChartModule, imports: [MODULES, AXFlowChartCreatorComponent] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: AXFlowChartModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.1.3", ngImport: i0, type: AXFlowChartModule, imports: [CommonModule, AXFlowChartRendererComponent, AXFlowChartCreatorComponent, AXFlowChartComponent], exports: [AXFlowChartRendererComponent, AXFlowChartCreatorComponent, AXFlowChartComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: AXFlowChartModule, imports: [MODULES, AXFlowChartCreatorComponent] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXFlowChartModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: AXFlowChartModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [...MODULES, ...COMPONENT],