@siemens/ix-angular 1.2.0 → 1.3.0-beta.0

package/fesm2020/siemens-ix-angular.mjs

@@ -1,8 +1,8 @@
-import { closeModal, dismissModal, modal, toast } from '@siemens/ix';
+import { closeModal, dismissModal, modal, themeSwitcher, toast } from '@siemens/ix';
 export * from '@siemens/ix';
 import { __decorate } from 'tslib';
 import * as i0 from '@angular/core';
-import { Component, ChangeDetectionStrategy, Directive, Input, Injectable, APP_INITIALIZER, NgZone, NgModule } from '@angular/core';
+import { Component, ChangeDetectionStrategy, Directive, Input, Type, Injector, Injectable, EventEmitter, Output, APP_INITIALIZER, NgZone, NgModule } from '@angular/core';
 import { fromEvent } from 'rxjs';
 import { DOCUMENT } from '@angular/common';
 import { applyPolyfills, defineCustomElements } from '@siemens/ix/loader';
@@ -454,6 +454,30 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
                     inputs: ['adjustDropdownWidthToReferenceWidth', 'adjustDropdownWidthToReferenceWith', 'anchor', 'closeBehavior', 'header', 'placement', 'positioningStrategy', 'show', 'trigger']
                 }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
+let IxDropdownButton = class IxDropdownButton {
+    constructor(c, r, z) {
+        this.z = z;
+        c.detach();
+        this.el = r.nativeElement;
+    }
+};
+/** @nocollapse */ IxDropdownButton.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: IxDropdownButton, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ IxDropdownButton.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: IxDropdownButton, selector: "ix-dropdown-button", inputs: { active: "active", disabled: "disabled", ghost: "ghost", icon: "icon", label: "label", outline: "outline", variant: "variant" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+IxDropdownButton = __decorate([
+    ProxyCmp({
+        defineCustomElementFn: undefined,
+        inputs: ['active', 'disabled', 'ghost', 'icon', 'label', 'outline', 'variant']
+    })
+], IxDropdownButton);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: IxDropdownButton, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ix-dropdown-button',
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    template: '<ng-content></ng-content>',
+                    inputs: ['active', 'disabled', 'ghost', 'icon', 'label', 'outline', 'variant']
+                }]
+        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
 let IxDropdownItem = class IxDropdownItem {
     constructor(c, r, z) {
         this.z = z;
@@ -1243,12 +1267,11 @@ let IxSelectItem = class IxSelectItem {
     }
 };
 /** @nocollapse */ IxSelectItem.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: IxSelectItem, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ IxSelectItem.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: IxSelectItem, selector: "ix-select-item", inputs: { hover: "hover", label: "label", selected: "selected", value: "value" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+/** @nocollapse */ IxSelectItem.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: IxSelectItem, selector: "ix-select-item", inputs: { label: "label", selected: "selected", value: "value" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 IxSelectItem = __decorate([
     ProxyCmp({
         defineCustomElementFn: undefined,
-        inputs: ['hover', 'label', 'selected', 'value'],
-        methods: ['onItemClick']
+        inputs: ['label', 'selected', 'value']
     })
 ], IxSelectItem);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: IxSelectItem, decorators: [{
@@ -1257,7 +1280,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
                     selector: 'ix-select-item',
                     changeDetection: ChangeDetectionStrategy.OnPush,
                     template: '<ng-content></ng-content>',
-                    inputs: ['hover', 'label', 'selected', 'value']
+                    inputs: ['label', 'selected', 'value']
                 }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
 let IxSpinner = class IxSpinner {
@@ -1659,6 +1682,44 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
                 type: Input
             }] } });
 
+/*
+ * SPDX-FileCopyrightText: 2022 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+class IxActiveModal {
+    constructor(modalData) {
+        this.modalData = modalData;
+    }
+    get data() {
+        return this.modalData;
+    }
+    /**
+     * Close the active modal
+     *
+     * @param reason
+     */
+    close(reason) {
+        closeModal(this.modalElement, reason);
+    }
+    /**
+     * Dismiss the active modal
+     *
+     * @param reason
+     */
+    dismiss(reason) {
+        dismissModal(this.modalElement, reason);
+    }
+}
+class InternalIxActiveModal extends IxActiveModal {
+    setModalElement(element) {
+        this.modalElement = element;
+    }
+}
+
 /*
  * SPDX-FileCopyrightText: 2022 Siemens AG
  *
@@ -1668,16 +1729,49 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
  * LICENSE file in the root directory of this source tree.
  */
 class ModalService {
-    constructor() { }
+    constructor(appRef, componentFactoryResolver, injector) {
+        this.appRef = appRef;
+        this.componentFactoryResolver = componentFactoryResolver;
+        this.injector = injector;
+    }
     async open(config) {
         const context = {
             close: null,
             dismiss: null,
             data: config.data,
         };
+        if (config.content instanceof Type) {
+            return this.createContentByComponentType(config, context);
+        }
+        const modalInstance = await this.createContentByTemplateRef(config, context);
+        return modalInstance;
+    }
+    async createContentByComponentType(config, context) {
+        const activeModal = new InternalIxActiveModal(context.data);
+        const modalFactory = this.componentFactoryResolver.resolveComponentFactory(config.content);
+        const modalInjector = Injector.create({
+            providers: [
+                {
+                    provide: IxActiveModal,
+                    useValue: activeModal,
+                },
+            ],
+            parent: this.injector,
+        });
+        const instance = modalFactory.create(modalInjector);
+        this.appRef.attachView(instance.hostView);
+        const embeddedView = instance.hostView;
+        const modalInstance = await this.createModalInstance(context, embeddedView, config);
+        activeModal.setModalElement(modalInstance.htmlElement);
+        return modalInstance;
+    }
+    async createContentByTemplateRef(config, context) {
         const embeddedView = config.content.createEmbeddedView({
             $implicit: context,
         });
+        return await this.createModalInstance(context, embeddedView, config);
+    }
+    async createModalInstance(context, embeddedView, config) {
         const node = embeddedView.rootNodes[0];
         context.close = (result) => {
             closeModal(node, result);
@@ -1700,14 +1794,14 @@ class ModalService {
         return modalInstance;
     }
 }
-/** @nocollapse */ ModalService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: ModalService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+/** @nocollapse */ ModalService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: ModalService, deps: [{ token: i0.ApplicationRef }, { token: i0.ComponentFactoryResolver }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Injectable });
 /** @nocollapse */ ModalService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: ModalService, providedIn: 'root' });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: ModalService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
                 }]
-        }], ctorParameters: function () { return []; } });
+        }], ctorParameters: function () { return [{ type: i0.ApplicationRef }, { type: i0.ComponentFactoryResolver }, { type: i0.Injector }]; } });
 
 /*
  * SPDX-FileCopyrightText: 2022 Siemens AG
@@ -1759,6 +1853,7 @@ const DIRECTIVES = [
     IxDatetimePicker,
     IxDrawer,
     IxDropdown,
+    IxDropdownButton,
     IxDropdownItem,
     IxEventList,
     IxEventListItem,
@@ -1809,6 +1904,47 @@ const DIRECTIVES = [
     IxWorkflowSteps
 ];
 
+/*
+ * SPDX-FileCopyrightText: 2022 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+class ThemeService {
+    constructor() {
+        this.themeChanged = new EventEmitter();
+        this.themeSwitcher = themeSwitcher;
+        this.themeSwitcher.themeChanged.on((theme) => this.themeChanged.emit(theme));
+    }
+    toggleMode() {
+        this.themeSwitcher.toggleMode();
+    }
+    setTheme(themeName) {
+        this.themeSwitcher.setTheme(themeName);
+    }
+}
+/** @nocollapse */ ThemeService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: ThemeService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+/** @nocollapse */ ThemeService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: ThemeService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: ThemeService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }], ctorParameters: function () { return []; }, propDecorators: { themeChanged: [{
+                type: Output
+            }] } });
+
+/*
+ * SPDX-FileCopyrightText: 2022 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
 /*
  * SPDX-FileCopyrightText: 2022 Siemens AG
  *
@@ -1959,13 +2095,14 @@ class IxModule {
                     deps: [DOCUMENT, NgZone],
                 },
                 ModalService,
+                ThemeService,
                 ToastService,
             ],
         };
     }
 }
 /** @nocollapse */ IxModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: IxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-/** @nocollapse */ IxModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: IxModule, declarations: [IxAnimatedTab, IxAnimatedTabs, IxApplicationHeader, IxBasicNavigation, IxBlind, IxBreadcrumb, IxBreadcrumbItem, IxButton, IxCategoryFilter, IxChip, IxCounterPill, IxDatePicker, IxDateTimeCard, IxDatetimePicker, IxDrawer, IxDropdown, IxDropdownItem, IxEventList, IxEventListItem, IxExpandingSearch, IxFilterChip, IxFlipTile, IxFlipTileContent, IxGroup, IxGroupContextMenu, IxGroupDropdownItem, IxGroupItem, IxIcon, IxIconButton, IxInputGroup, IxKpi, IxMapNavigation, IxMapNavigationOverlay, IxMenu, IxMenuAbout, IxMenuAboutItem, IxMenuAboutNews, IxMenuAvatar, IxMenuAvatarItem, IxMenuItem, IxMenuSettings, IxMenuSettingsItem, IxMessageBar, IxModal, IxModalContainer, IxModalExample, IxPill, IxSelect, IxSelectItem, IxSpinner, IxSplitButton, IxSplitButtonItem, IxTabItem, IxTabs, IxTile, IxTimePicker, IxToast, IxToastContainer, IxToggle, IxTreeItem, IxUpload, IxValidationTooltip, IxWorkflowStep, IxWorkflowSteps, IxTree, IxDropdownTriggerDirective], exports: [IxAnimatedTab, IxAnimatedTabs, IxApplicationHeader, IxBasicNavigation, IxBlind, IxBreadcrumb, IxBreadcrumbItem, IxButton, IxCategoryFilter, IxChip, IxCounterPill, IxDatePicker, IxDateTimeCard, IxDatetimePicker, IxDrawer, IxDropdown, IxDropdownItem, IxEventList, IxEventListItem, IxExpandingSearch, IxFilterChip, IxFlipTile, IxFlipTileContent, IxGroup, IxGroupContextMenu, IxGroupDropdownItem, IxGroupItem, IxIcon, IxIconButton, IxInputGroup, IxKpi, IxMapNavigation, IxMapNavigationOverlay, IxMenu, IxMenuAbout, IxMenuAboutItem, IxMenuAboutNews, IxMenuAvatar, IxMenuAvatarItem, IxMenuItem, IxMenuSettings, IxMenuSettingsItem, IxMessageBar, IxModal, IxModalContainer, IxModalExample, IxPill, IxSelect, IxSelectItem, IxSpinner, IxSplitButton, IxSplitButtonItem, IxTabItem, IxTabs, IxTile, IxTimePicker, IxToast, IxToastContainer, IxToggle, IxTreeItem, IxUpload, IxValidationTooltip, IxWorkflowStep, IxWorkflowSteps, IxTree, IxDropdownTriggerDirective] });
+/** @nocollapse */ IxModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: IxModule, declarations: [IxAnimatedTab, IxAnimatedTabs, IxApplicationHeader, IxBasicNavigation, IxBlind, IxBreadcrumb, IxBreadcrumbItem, IxButton, IxCategoryFilter, IxChip, IxCounterPill, IxDatePicker, IxDateTimeCard, IxDatetimePicker, IxDrawer, IxDropdown, IxDropdownButton, IxDropdownItem, IxEventList, IxEventListItem, IxExpandingSearch, IxFilterChip, IxFlipTile, IxFlipTileContent, IxGroup, IxGroupContextMenu, IxGroupDropdownItem, IxGroupItem, IxIcon, IxIconButton, IxInputGroup, IxKpi, IxMapNavigation, IxMapNavigationOverlay, IxMenu, IxMenuAbout, IxMenuAboutItem, IxMenuAboutNews, IxMenuAvatar, IxMenuAvatarItem, IxMenuItem, IxMenuSettings, IxMenuSettingsItem, IxMessageBar, IxModal, IxModalContainer, IxModalExample, IxPill, IxSelect, IxSelectItem, IxSpinner, IxSplitButton, IxSplitButtonItem, IxTabItem, IxTabs, IxTile, IxTimePicker, IxToast, IxToastContainer, IxToggle, IxTreeItem, IxUpload, IxValidationTooltip, IxWorkflowStep, IxWorkflowSteps, IxTree, IxDropdownTriggerDirective], exports: [IxAnimatedTab, IxAnimatedTabs, IxApplicationHeader, IxBasicNavigation, IxBlind, IxBreadcrumb, IxBreadcrumbItem, IxButton, IxCategoryFilter, IxChip, IxCounterPill, IxDatePicker, IxDateTimeCard, IxDatetimePicker, IxDrawer, IxDropdown, IxDropdownButton, IxDropdownItem, IxEventList, IxEventListItem, IxExpandingSearch, IxFilterChip, IxFlipTile, IxFlipTileContent, IxGroup, IxGroupContextMenu, IxGroupDropdownItem, IxGroupItem, IxIcon, IxIconButton, IxInputGroup, IxKpi, IxMapNavigation, IxMapNavigationOverlay, IxMenu, IxMenuAbout, IxMenuAboutItem, IxMenuAboutNews, IxMenuAvatar, IxMenuAvatarItem, IxMenuItem, IxMenuSettings, IxMenuSettingsItem, IxMessageBar, IxModal, IxModalContainer, IxModalExample, IxPill, IxSelect, IxSelectItem, IxSpinner, IxSplitButton, IxSplitButtonItem, IxTabItem, IxTabs, IxTile, IxTimePicker, IxToast, IxToastContainer, IxToggle, IxTreeItem, IxUpload, IxValidationTooltip, IxWorkflowStep, IxWorkflowSteps, IxTree, IxDropdownTriggerDirective] });
 /** @nocollapse */ IxModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: IxModule });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: IxModule, decorators: [{
             type: NgModule,
@@ -1988,5 +2125,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { IxAnimatedTab, IxAnimatedTabs, IxApplicationHeader, IxBasicNavigation, IxBlind, IxBreadcrumb, IxBreadcrumbItem, IxButton, IxCategoryFilter, IxChip, IxCounterPill, IxDatePicker, IxDateTimeCard, IxDatetimePicker, IxDrawer, IxDropdown, IxDropdownItem, IxDropdownTriggerDirective, IxEventList, IxEventListItem, IxExpandingSearch, IxFilterChip, IxFlipTile, IxFlipTileContent, IxGroup, IxGroupContextMenu, IxGroupDropdownItem, IxGroupItem, IxIcon, IxIconButton, IxInputGroup, IxKpi, IxMapNavigation, IxMapNavigationOverlay, IxMenu, IxMenuAbout, IxMenuAboutItem, IxMenuAboutNews, IxMenuAvatar, IxMenuAvatarItem, IxMenuItem, IxMenuSettings, IxMenuSettingsItem, IxMessageBar, IxModal, IxModalContainer, IxModalExample, IxModule, IxPill, IxSelect, IxSelectItem, IxSpinner, IxSplitButton, IxSplitButtonItem, IxTabItem, IxTabs, IxTile, IxTimePicker, IxToast, IxToastContainer, IxToggle, IxTree, IxTreeItem, IxUpload, IxValidationTooltip, IxWorkflowStep, IxWorkflowSteps, ModalService, ToastService };
+export { IxActiveModal, IxAnimatedTab, IxAnimatedTabs, IxApplicationHeader, IxBasicNavigation, IxBlind, IxBreadcrumb, IxBreadcrumbItem, IxButton, IxCategoryFilter, IxChip, IxCounterPill, IxDatePicker, IxDateTimeCard, IxDatetimePicker, IxDrawer, IxDropdown, IxDropdownButton, IxDropdownItem, IxDropdownTriggerDirective, IxEventList, IxEventListItem, IxExpandingSearch, IxFilterChip, IxFlipTile, IxFlipTileContent, IxGroup, IxGroupContextMenu, IxGroupDropdownItem, IxGroupItem, IxIcon, IxIconButton, IxInputGroup, IxKpi, IxMapNavigation, IxMapNavigationOverlay, IxMenu, IxMenuAbout, IxMenuAboutItem, IxMenuAboutNews, IxMenuAvatar, IxMenuAvatarItem, IxMenuItem, IxMenuSettings, IxMenuSettingsItem, IxMessageBar, IxModal, IxModalContainer, IxModalExample, IxModule, IxPill, IxSelect, IxSelectItem, IxSpinner, IxSplitButton, IxSplitButtonItem, IxTabItem, IxTabs, IxTile, IxTimePicker, IxToast, IxToastContainer, IxToggle, IxTree, IxTreeItem, IxUpload, IxValidationTooltip, IxWorkflowStep, IxWorkflowSteps, ModalService, ThemeService, ToastService };
 //# sourceMappingURL=siemens-ix-angular.mjs.map