@testgorilla/tgo-ui 11.22.3 → 12.0.1

package/fesm2022/testgorilla-tgo-ui-components-empty-state.mjs

@@ -1,330 +1,325 @@
-import { AsyncPipe, CommonModule, NgOptimizedImage } from '@angular/common';
-import * as i0 from '@angular/core';
-import { EventEmitter, Output, Input, Optional, Inject, ChangeDetectionStrategy, Component, NgModule } from '@angular/core';
-import { ButtonComponent, ButtonComponentModule } from '@testgorilla/tgo-ui/components/button';
-import { UiTranslatePipe } from '@testgorilla/tgo-ui/components/core';
-import * as i1 from '@testgorilla/tgo-ui/components/icon';
-import { IconComponentModule } from '@testgorilla/tgo-ui/components/icon';
-
-class EmptyStateComponent {
-    constructor(defaultAppTheme) {
-        this.defaultAppTheme = defaultAppTheme;
-        /**
-         * @description If the default image should be displayed.
-         * @type {boolean}
-         * @memberof EmptyStateComponent
-         */
-        this.showIllustration = false;
-        /**
-         * @description If the default image should be displayed.
-         * @type {IllustrationVariant}
-         * @memberof EmptyStateComponent
-         */
-        this.illustrationVariant = 'Empty-search';
-        /**
-         * @description The icon to be displayed in the empty state.
-         * @type {IconName}
-         * @memberof EmptyStateComponent
-         */
-        this.icon = '';
-        /**
-         * @description The empty state variant.
-         * @type {EmptyStateVariant}
-         * @memberof EmptyStateComponent
-         */
-        this.emptyStateVariant = 'desktop';
-        /**
-         * @description The title of the empty state.
-         * @type {string}
-         * @memberof EmptyStateComponent
-         */
-        this.title = '';
-        /**
-         * @description The body text or description of the empty state.
-         * @type {string}
-         * @memberof EmptyStateComponent
-         */
-        this.bodyText = '';
-        /**
-         * @description Displays primary button if passed.
-         * @type {string}
-         * @memberof EmptyStateComponent
-         */
-        this.primaryButtonText = '';
-        /**
-         * Primary button variant - only for new theme.
-         * @type {ButtonVariant}
-         * @memberof EmptyStateComponent
-         */
-        this.primaryButtonVariant = 'pink';
-        /**
-         * General button variation - only for new theme.
-         * @type {ButtonColor}
-         * @memberof EmptyStateComponent
-         */
-        this.generalButtonVariation = 'primary';
-        /**
-         * @description Name of ui-icon for primary button
-         * @type {IconName}
-         * @memberof EmptyStateComponent
-         */
-        this.primaryButtonIconName = '';
-        /**
-         * @description Position of ui-icon for primary button
-         * @type {ButtonIconPosition}
-         * @memberof EmptyStateComponent
-         */
-        this.primaryButtonIconPosition = 'left';
-        /**
-         * @description Displays secondary button if passed.
-         * @type {string}
-         * @memberof EmptyStateComponent
-         */
-        this.secondaryButtonText = '';
-        /**
-         * Secondary button variant - only for new theme.
-         * @type {ButtonVariant}
-         * @memberof EmptyStateComponent
-         */
-        this.secondaryButtonVariant = 'black';
-        /**
-         * @description Name of ui-icon for secondary button
-         * @type {IconName}
-         * @memberof EmptyStateComponent
-         */
-        this.secondaryButtonIconName = '';
-        /**
-         * @description Position of ui-icon for secondary button
-         * @type {ButtonIconPosition}
-         * @memberof EmptyStateComponent
-         */
-        this.secondaryButtonIconPosition = 'left';
-        /**
-         * @description Displays tertiary button if passed.
-         * @type {string}
-         * @memberof EmptyStateComponent
-         */
-        this.tertiaryButtonText = '';
-        /**
-         * Tertiary button variant - only for new theme.
-         * @type {ButtonVariant}
-         * @memberof EmptyStateComponent
-         */
-        this.tertiaryButtonVariant = 'ghost';
-        /**
-         * @description Name of ui-icon for tertiary button
-         * @type {IconName}
-         * @memberof EmptyStateComponent
-         */
-        this.tertiaryButtonIconName = '';
-        /**
-         * @description Position of ui-icon for tertiary button
-         * @type {ButtonIconPosition}
-         * @memberof EmptyStateComponent
-         */
-        this.tertiaryButtonIconPosition = 'left';
-        /**
-         * @description Displays general variation button if passed.
-         * @type {string}
-         * @memberof EmptyStateComponent
-         */
-        this.generalVariationButtonText = '';
-        /**
-         * @description Displays general variation button if passed.
-         * @type {string}
-         * @memberof EmptyStateComponent
-         */
-        this.generalVariationButtonSize = 'big';
-        /**
-         * @description Name of ui-icon for general variation button
-         * @type {IconName}
-         * @memberof EmptyStateComponent
-         */
-        this.generalVariationButtonIconName = '';
-        /**
-         * @description Position of ui-icon for general variation button
-         * @type {ButtonIconPosition}
-         * @memberof EmptyStateComponent
-         */
-        this.generalVariationButtonIconPosition = 'left';
-        /**
-         * @description Disabled state for general variation button
-         * @type {boolean}
-         * @memberof EmptyStateComponent
-         */
-        this.generalVariationButtonDisabled = false;
-        /**
-         *
-         * Defines the application theme
-         *
-         * @type {ApplicationTheme}
-         * @memberof EmptyStateComponent
-         */
-        this.applicationTheme = 'light';
-        /**
-         * Event triggered when the primary button is clicked.
-         * @type {Event}
-         * @event
-         * @memberof TagComponent
-         */
-        this.primaryButtonClick = new EventEmitter();
-        /**
-         * Event triggered when the secondary button is clicked.
-         * @type {Event}
-         * @event
-         * @memberof TagComponent
-         */
-        this.secondaryButtonClick = new EventEmitter();
-        /**
-         * Event triggered when the tertiary button is clicked.
-         * @type {Event}
-         * @event
-         * @memberof TagComponent
-         */
-        this.tertiaryButtonClick = new EventEmitter();
-        /**
-         * Event triggered when the general variation button is clicked.
-         * @type {Event}
-         * @event
-         * @memberof TagComponent
-         */
-        this.generalVariationButtonClick = new EventEmitter();
-        if (defaultAppTheme) {
-            this.applicationTheme = defaultAppTheme;
-        }
-    }
-    ngOnInit() {
-        if (this.applicationTheme !== 'classic') {
-            this.buttonApplicationTheme = this.applicationTheme;
-        }
-    }
-    onPrimaryButtonClick(event) {
-        this.primaryButtonClick.emit(event);
-    }
-    onSecondaryButtonClick(event) {
-        this.secondaryButtonClick.emit(event);
-    }
-    onTertiaryButtonClick(event) {
-        this.tertiaryButtonClick.emit(event);
-    }
-    onGeneralVariationButtonClick(event) {
-        this.generalVariationButtonClick.emit(event);
-    }
-    getVariant(variant) {
-        if (variant === 'pink') {
-            return 'primary';
-        }
-        else if (variant === 'black') {
-            this.buttonApplicationTheme = 'light';
-            return 'secondary';
-        }
-        else {
-            this.buttonApplicationTheme = 'light';
-            return 'ghost';
-        }
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: EmptyStateComponent, deps: [{ token: 'CANOPYUI_DEFAULT_APPLICATION_THEME', optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.25", type: EmptyStateComponent, isStandalone: true, selector: "ui-empty-state", inputs: { showIllustration: "showIllustration", illustrationVariant: "illustrationVariant", icon: "icon", emptyStateVariant: "emptyStateVariant", title: "title", bodyText: "bodyText", primaryButtonText: "primaryButtonText", primaryButtonVariant: "primaryButtonVariant", generalButtonVariation: "generalButtonVariation", primaryButtonIconName: "primaryButtonIconName", primaryButtonIconPosition: "primaryButtonIconPosition", secondaryButtonText: "secondaryButtonText", secondaryButtonVariant: "secondaryButtonVariant", secondaryButtonIconName: "secondaryButtonIconName", secondaryButtonIconPosition: "secondaryButtonIconPosition", tertiaryButtonText: "tertiaryButtonText", tertiaryButtonVariant: "tertiaryButtonVariant", tertiaryButtonIconName: "tertiaryButtonIconName", tertiaryButtonIconPosition: "tertiaryButtonIconPosition", generalVariationButtonText: "generalVariationButtonText", generalVariationButtonSize: "generalVariationButtonSize", generalVariationButtonIconName: "generalVariationButtonIconName", generalVariationButtonIconPosition: "generalVariationButtonIconPosition", generalVariationButtonDisabled: "generalVariationButtonDisabled", applicationTheme: "applicationTheme" }, outputs: { primaryButtonClick: "primaryButtonClick", secondaryButtonClick: "secondaryButtonClick", tertiaryButtonClick: "tertiaryButtonClick", generalVariationButtonClick: "generalVariationButtonClick" }, ngImport: i0, template: "<ng-container>\n  <div class=\"empty-state-container\" [attr.theme]=\"applicationTheme\" [class.mobile]=\"emptyStateVariant === 'mobile'\">\n    @if (showIllustration) {\n      <div class=\"illustration\" [attr.aria-hidden]=\"true\">\n        @if (applicationTheme === 'classic') {\n          <img [attr.src]=\"'/images/empty-state-default.svg'\" [width]=\"160\" [height]=\"160\" alt=\"illustration\" />\n        }\n        @if (applicationTheme !== 'classic') {\n          <img\n            [attr.src]=\"'/icons/rebrand/' + illustrationVariant + '-in-line.svg'\"\n            [width]=\"160\"\n            [height]=\"160\"\n            alt=\"illustration\"\n          />\n        }\n      </div>\n    }\n\n    @if (icon) {\n      <div class=\"icon\">\n        <ui-icon [applicationTheme]=\"applicationTheme\" [name]=\"icon\" size=\"40\"></ui-icon>\n      </div>\n    }\n\n    <div class=\"text-content\">\n      <div class=\"title\">{{ title ? title : ('COMMON.NO_RESULTS' | uiTranslate | async) }}</div>\n      @if (bodyText) {\n        <div class=\"body-text\" [innerHTML]=\"bodyText\"></div>\n      }\n    </div>\n\n    <div class=\"actions\">\n      @if (primaryButtonText) {\n        <ui-button\n          [fullWidth]=\"emptyStateVariant === 'mobile'\"\n          [applicationTheme]=\"buttonApplicationTheme\"\n          class=\"action-button\"\n          [variant]=\"applicationTheme !== 'classic' ? getVariant(primaryButtonVariant) : 'primary'\"\n          [label]=\"primaryButtonText\"\n          [iconName]=\"primaryButtonIconName\"\n          [iconPosition]=\"primaryButtonIconPosition\"\n          (buttonClickEvent)=\"onPrimaryButtonClick($event)\"\n        ></ui-button>\n      }\n      @if (secondaryButtonText) {\n        <ui-button\n          [fullWidth]=\"emptyStateVariant === 'mobile'\"\n          [applicationTheme]=\"buttonApplicationTheme\"\n          class=\"action-button\"\n          [variant]=\"applicationTheme !== 'classic' ? getVariant(secondaryButtonVariant) : 'secondary'\"\n          [label]=\"secondaryButtonText\"\n          [iconName]=\"secondaryButtonIconName\"\n          [iconPosition]=\"secondaryButtonIconPosition\"\n          (buttonClickEvent)=\"onSecondaryButtonClick($event)\"\n        ></ui-button>\n      }\n      @if (tertiaryButtonText) {\n        <ui-button\n          [fullWidth]=\"emptyStateVariant === 'mobile'\"\n          [applicationTheme]=\"buttonApplicationTheme\"\n          class=\"action-button\"\n          [variant]=\"applicationTheme !== 'classic' ? getVariant(tertiaryButtonVariant) : 'tertiary'\"\n          [label]=\"tertiaryButtonText\"\n          [iconName]=\"tertiaryButtonIconName\"\n          [iconPosition]=\"tertiaryButtonIconPosition\"\n          (buttonClickEvent)=\"onTertiaryButtonClick($event)\"\n        ></ui-button>\n      }\n      @if (generalVariationButtonText) {\n        <ui-button\n          class=\"action-button\"\n          [fullWidth]=\"emptyStateVariant === 'mobile'\"\n          [applicationTheme]=\"buttonApplicationTheme\"\n          [variant]=\"generalButtonVariation\"\n          [label]=\"generalVariationButtonText\"\n          [iconName]=\"generalVariationButtonIconName\"\n          [iconPosition]=\"generalVariationButtonIconPosition\"\n          [disabled]=\"generalVariationButtonDisabled\"\n          [size]=\"generalVariationButtonSize\"\n          (buttonClickEvent)=\"onGeneralVariationButtonClick($event)\"\n        ></ui-button>\n      }\n    </div>\n  </div>\n</ng-container>\n", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}.empty-state-container{max-width:480px;margin:0 auto;flex-direction:column;padding:32px}.empty-state-container.mobile{max-width:none;padding:16px}.empty-state-container.mobile .actions{flex-direction:column;width:100%}@media(max-width:600px){.empty-state-container{margin:0;padding:16px}.empty-state-container .actions{flex-direction:column;width:100%}.empty-state-container .actions ui-button{width:100%}.empty-state-container .actions ui-button ::ng-deep .button-wrapper,.empty-state-container .actions ui-button ::ng-deep button{width:100%}}.empty-state-container .text-content{margin:24px 0;flex-direction:column}.empty-state-container .text-content .title{font-weight:700;font-size:20px;line-height:26px;margin-bottom:8px;text-align:center}.empty-state-container .text-content .body-text{font-size:16px;line-height:24px;text-align:center}.empty-state-container .actions{display:flex;flex-wrap:wrap;justify-content:center}.empty-state-container .actions .action-button{margin:8px}.flex-center,.empty-state-container,.empty-state-container .text-content{display:flex;justify-content:center;align-items:center}\n"], dependencies: [{ kind: "ngmodule", type: IconComponentModule }, { kind: "component", type: i1.IconComponent, selector: "ui-icon", inputs: ["size", "cssClass", "name", "color", "filled", "toggleIconStyle", "applicationTheme", "useFullIconName"] }, { kind: "component", type: ButtonComponent, selector: "ui-button", inputs: ["size", "variant", "label", "iconPosition", "justIcon", "iconName", "trailingIconName", "trailingIconFilled", "disabled", "loading", "loadingWithLabel", "fullWidth", "url", "urlTarget", "value", "tooltip", "isPremium", "type", "companyColor", "buttonBadgeConfig", "applicationTheme", "disabledScaleOnClick", "ariaLabel", "ariaExpanded", "ariaControls", "ariaPressed", "ariaRequired", "ariaLabelledby", "ariaDescribedby", "preventDefault", "hasBackground", "tooltipPosition", "role", "iconFilled", "testId"], outputs: ["buttonClickEvent", "buttonHoverEvent"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: UiTranslatePipe, name: "uiTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: EmptyStateComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ui-empty-state', changeDetection: ChangeDetectionStrategy.OnPush, imports: [IconComponentModule, ButtonComponent, AsyncPipe, UiTranslatePipe], template: "<ng-container>\n  <div class=\"empty-state-container\" [attr.theme]=\"applicationTheme\" [class.mobile]=\"emptyStateVariant === 'mobile'\">\n    @if (showIllustration) {\n      <div class=\"illustration\" [attr.aria-hidden]=\"true\">\n        @if (applicationTheme === 'classic') {\n          <img [attr.src]=\"'/images/empty-state-default.svg'\" [width]=\"160\" [height]=\"160\" alt=\"illustration\" />\n        }\n        @if (applicationTheme !== 'classic') {\n          <img\n            [attr.src]=\"'/icons/rebrand/' + illustrationVariant + '-in-line.svg'\"\n            [width]=\"160\"\n            [height]=\"160\"\n            alt=\"illustration\"\n          />\n        }\n      </div>\n    }\n\n    @if (icon) {\n      <div class=\"icon\">\n        <ui-icon [applicationTheme]=\"applicationTheme\" [name]=\"icon\" size=\"40\"></ui-icon>\n      </div>\n    }\n\n    <div class=\"text-content\">\n      <div class=\"title\">{{ title ? title : ('COMMON.NO_RESULTS' | uiTranslate | async) }}</div>\n      @if (bodyText) {\n        <div class=\"body-text\" [innerHTML]=\"bodyText\"></div>\n      }\n    </div>\n\n    <div class=\"actions\">\n      @if (primaryButtonText) {\n        <ui-button\n          [fullWidth]=\"emptyStateVariant === 'mobile'\"\n          [applicationTheme]=\"buttonApplicationTheme\"\n          class=\"action-button\"\n          [variant]=\"applicationTheme !== 'classic' ? getVariant(primaryButtonVariant) : 'primary'\"\n          [label]=\"primaryButtonText\"\n          [iconName]=\"primaryButtonIconName\"\n          [iconPosition]=\"primaryButtonIconPosition\"\n          (buttonClickEvent)=\"onPrimaryButtonClick($event)\"\n        ></ui-button>\n      }\n      @if (secondaryButtonText) {\n        <ui-button\n          [fullWidth]=\"emptyStateVariant === 'mobile'\"\n          [applicationTheme]=\"buttonApplicationTheme\"\n          class=\"action-button\"\n          [variant]=\"applicationTheme !== 'classic' ? getVariant(secondaryButtonVariant) : 'secondary'\"\n          [label]=\"secondaryButtonText\"\n          [iconName]=\"secondaryButtonIconName\"\n          [iconPosition]=\"secondaryButtonIconPosition\"\n          (buttonClickEvent)=\"onSecondaryButtonClick($event)\"\n        ></ui-button>\n      }\n      @if (tertiaryButtonText) {\n        <ui-button\n          [fullWidth]=\"emptyStateVariant === 'mobile'\"\n          [applicationTheme]=\"buttonApplicationTheme\"\n          class=\"action-button\"\n          [variant]=\"applicationTheme !== 'classic' ? getVariant(tertiaryButtonVariant) : 'tertiary'\"\n          [label]=\"tertiaryButtonText\"\n          [iconName]=\"tertiaryButtonIconName\"\n          [iconPosition]=\"tertiaryButtonIconPosition\"\n          (buttonClickEvent)=\"onTertiaryButtonClick($event)\"\n        ></ui-button>\n      }\n      @if (generalVariationButtonText) {\n        <ui-button\n          class=\"action-button\"\n          [fullWidth]=\"emptyStateVariant === 'mobile'\"\n          [applicationTheme]=\"buttonApplicationTheme\"\n          [variant]=\"generalButtonVariation\"\n          [label]=\"generalVariationButtonText\"\n          [iconName]=\"generalVariationButtonIconName\"\n          [iconPosition]=\"generalVariationButtonIconPosition\"\n          [disabled]=\"generalVariationButtonDisabled\"\n          [size]=\"generalVariationButtonSize\"\n          (buttonClickEvent)=\"onGeneralVariationButtonClick($event)\"\n        ></ui-button>\n      }\n    </div>\n  </div>\n</ng-container>\n", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}.empty-state-container{max-width:480px;margin:0 auto;flex-direction:column;padding:32px}.empty-state-container.mobile{max-width:none;padding:16px}.empty-state-container.mobile .actions{flex-direction:column;width:100%}@media(max-width:600px){.empty-state-container{margin:0;padding:16px}.empty-state-container .actions{flex-direction:column;width:100%}.empty-state-container .actions ui-button{width:100%}.empty-state-container .actions ui-button ::ng-deep .button-wrapper,.empty-state-container .actions ui-button ::ng-deep button{width:100%}}.empty-state-container .text-content{margin:24px 0;flex-direction:column}.empty-state-container .text-content .title{font-weight:700;font-size:20px;line-height:26px;margin-bottom:8px;text-align:center}.empty-state-container .text-content .body-text{font-size:16px;line-height:24px;text-align:center}.empty-state-container .actions{display:flex;flex-wrap:wrap;justify-content:center}.empty-state-container .actions .action-button{margin:8px}.flex-center,.empty-state-container,.empty-state-container .text-content{display:flex;justify-content:center;align-items:center}\n"] }]
-        }], ctorParameters: () => [{ type: undefined, decorators: [{
-                    type: Optional
-                }, {
-                    type: Inject,
-                    args: ['CANOPYUI_DEFAULT_APPLICATION_THEME']
-                }] }], propDecorators: { showIllustration: [{
-                type: Input
-            }], illustrationVariant: [{
-                type: Input
-            }], icon: [{
-                type: Input
-            }], emptyStateVariant: [{
-                type: Input
-            }], title: [{
-                type: Input
-            }], bodyText: [{
-                type: Input
-            }], primaryButtonText: [{
-                type: Input
-            }], primaryButtonVariant: [{
-                type: Input
-            }], generalButtonVariation: [{
-                type: Input
-            }], primaryButtonIconName: [{
-                type: Input
-            }], primaryButtonIconPosition: [{
-                type: Input
-            }], secondaryButtonText: [{
-                type: Input
-            }], secondaryButtonVariant: [{
-                type: Input
-            }], secondaryButtonIconName: [{
-                type: Input
-            }], secondaryButtonIconPosition: [{
-                type: Input
-            }], tertiaryButtonText: [{
-                type: Input
-            }], tertiaryButtonVariant: [{
-                type: Input
-            }], tertiaryButtonIconName: [{
-                type: Input
-            }], tertiaryButtonIconPosition: [{
-                type: Input
-            }], generalVariationButtonText: [{
-                type: Input
-            }], generalVariationButtonSize: [{
-                type: Input
-            }], generalVariationButtonIconName: [{
-                type: Input
-            }], generalVariationButtonIconPosition: [{
-                type: Input
-            }], generalVariationButtonDisabled: [{
-                type: Input
-            }], applicationTheme: [{
-                type: Input
-            }], primaryButtonClick: [{
-                type: Output
-            }], secondaryButtonClick: [{
-                type: Output
-            }], tertiaryButtonClick: [{
-                type: Output
-            }], generalVariationButtonClick: [{
-                type: Output
-            }] } });
-
-class EmptyStateComponentModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: EmptyStateComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.25", ngImport: i0, type: EmptyStateComponentModule, imports: [CommonModule,
-            IconComponentModule,
-            NgOptimizedImage,
-            ButtonComponentModule,
-            UiTranslatePipe,
-            EmptyStateComponent], exports: [EmptyStateComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: EmptyStateComponentModule, imports: [CommonModule,
-            IconComponentModule,
-            ButtonComponentModule,
-            EmptyStateComponent] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: EmptyStateComponentModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    imports: [
-                        CommonModule,
-                        IconComponentModule,
-                        NgOptimizedImage,
-                        ButtonComponentModule,
-                        UiTranslatePipe,
-                        EmptyStateComponent,
-                    ],
-                    exports: [EmptyStateComponent],
-                }]
-        }] });
-
-/**
- * Generated bundle index. Do not edit.
- */
-
+import { AsyncPipe, CommonModule, NgOptimizedImage } from "@angular/common";
+import * as i0 from "@angular/core";
+import { ChangeDetectionStrategy, Component, EventEmitter, Inject, Input, NgModule, Optional, Output } from "@angular/core";
+import { ButtonComponent, ButtonComponentModule } from "@testgorilla/tgo-ui/components/button";
+import { UiTranslatePipe } from "@testgorilla/tgo-ui/components/core";
+import * as i1 from "@testgorilla/tgo-ui/components/icon";
+import { IconComponentModule } from "@testgorilla/tgo-ui/components/icon";
+var EmptyStateComponent = class EmptyStateComponent {
+	constructor(defaultAppTheme) {
+		this.defaultAppTheme = defaultAppTheme;
+		this.showIllustration = false;
+		this.illustrationVariant = "Empty-search";
+		this.icon = "";
+		this.emptyStateVariant = "desktop";
+		this.title = "";
+		this.bodyText = "";
+		this.primaryButtonText = "";
+		this.primaryButtonVariant = "pink";
+		this.generalButtonVariation = "primary";
+		this.primaryButtonIconName = "";
+		this.primaryButtonIconPosition = "left";
+		this.secondaryButtonText = "";
+		this.secondaryButtonVariant = "black";
+		this.secondaryButtonIconName = "";
+		this.secondaryButtonIconPosition = "left";
+		this.tertiaryButtonText = "";
+		this.tertiaryButtonVariant = "ghost";
+		this.tertiaryButtonIconName = "";
+		this.tertiaryButtonIconPosition = "left";
+		this.generalVariationButtonText = "";
+		this.generalVariationButtonSize = "big";
+		this.generalVariationButtonIconName = "";
+		this.generalVariationButtonIconPosition = "left";
+		this.generalVariationButtonDisabled = false;
+		this.applicationTheme = "light";
+		this.primaryButtonClick = new EventEmitter();
+		this.secondaryButtonClick = new EventEmitter();
+		this.tertiaryButtonClick = new EventEmitter();
+		this.generalVariationButtonClick = new EventEmitter();
+		if (defaultAppTheme) this.applicationTheme = defaultAppTheme;
+	}
+	ngOnInit() {
+		if (this.applicationTheme !== "classic") this.buttonApplicationTheme = this.applicationTheme;
+	}
+	onPrimaryButtonClick(event) {
+		this.primaryButtonClick.emit(event);
+	}
+	onSecondaryButtonClick(event) {
+		this.secondaryButtonClick.emit(event);
+	}
+	onTertiaryButtonClick(event) {
+		this.tertiaryButtonClick.emit(event);
+	}
+	onGeneralVariationButtonClick(event) {
+		this.generalVariationButtonClick.emit(event);
+	}
+	getVariant(variant) {
+		if (variant === "pink") return "primary";
+		else if (variant === "black") {
+			this.buttonApplicationTheme = "light";
+			return "secondary";
+		} else {
+			this.buttonApplicationTheme = "light";
+			return "ghost";
+		}
+	}
+	static {
+		this.ɵfac = i0.ɵɵngDeclareFactory({
+			minVersion: "12.0.0",
+			version: "22.2.4",
+			ngImport: i0,
+			type: EmptyStateComponent,
+			deps: [{
+				token: "CANOPYUI_DEFAULT_APPLICATION_THEME",
+				optional: true
+			}],
+			target: i0.ɵɵFactoryTarget.Component
+		});
+	}
+	static {
+		this.ɵcmp = i0.ɵɵngDeclareComponent({
+			minVersion: "17.0.0",
+			version: "22.2.4",
+			type: EmptyStateComponent,
+			isStandalone: true,
+			selector: "ui-empty-state",
+			inputs: {
+				showIllustration: "showIllustration",
+				illustrationVariant: "illustrationVariant",
+				icon: "icon",
+				emptyStateVariant: "emptyStateVariant",
+				title: "title",
+				bodyText: "bodyText",
+				primaryButtonText: "primaryButtonText",
+				primaryButtonVariant: "primaryButtonVariant",
+				generalButtonVariation: "generalButtonVariation",
+				primaryButtonIconName: "primaryButtonIconName",
+				primaryButtonIconPosition: "primaryButtonIconPosition",
+				secondaryButtonText: "secondaryButtonText",
+				secondaryButtonVariant: "secondaryButtonVariant",
+				secondaryButtonIconName: "secondaryButtonIconName",
+				secondaryButtonIconPosition: "secondaryButtonIconPosition",
+				tertiaryButtonText: "tertiaryButtonText",
+				tertiaryButtonVariant: "tertiaryButtonVariant",
+				tertiaryButtonIconName: "tertiaryButtonIconName",
+				tertiaryButtonIconPosition: "tertiaryButtonIconPosition",
+				generalVariationButtonText: "generalVariationButtonText",
+				generalVariationButtonSize: "generalVariationButtonSize",
+				generalVariationButtonIconName: "generalVariationButtonIconName",
+				generalVariationButtonIconPosition: "generalVariationButtonIconPosition",
+				generalVariationButtonDisabled: "generalVariationButtonDisabled",
+				applicationTheme: "applicationTheme"
+			},
+			outputs: {
+				primaryButtonClick: "primaryButtonClick",
+				secondaryButtonClick: "secondaryButtonClick",
+				tertiaryButtonClick: "tertiaryButtonClick",
+				generalVariationButtonClick: "generalVariationButtonClick"
+			},
+			ngImport: i0,
+			template: "<ng-container>\n  <div class=\"empty-state-container\" [attr.theme]=\"applicationTheme\" [class.mobile]=\"emptyStateVariant === 'mobile'\">\n    @if (showIllustration) {\n      <div class=\"illustration\" [attr.aria-hidden]=\"true\">\n        @if (applicationTheme === 'classic') {\n          <img [attr.src]=\"'/images/empty-state-default.svg'\" [width]=\"160\" [height]=\"160\" alt=\"illustration\" />\n        }\n        @if (applicationTheme !== 'classic') {\n          <img\n            [attr.src]=\"'/icons/rebrand/' + illustrationVariant + '-in-line.svg'\"\n            [width]=\"160\"\n            [height]=\"160\"\n            alt=\"illustration\"\n          />\n        }\n      </div>\n    }\n\n    @if (icon) {\n      <div class=\"icon\">\n        <ui-icon [applicationTheme]=\"applicationTheme\" [name]=\"icon\" size=\"40\"></ui-icon>\n      </div>\n    }\n\n    <div class=\"text-content\">\n      <div class=\"title\">{{ title ? title : ('COMMON.NO_RESULTS' | uiTranslate | async) }}</div>\n      @if (bodyText) {\n        <div class=\"body-text\" [innerHTML]=\"bodyText\"></div>\n      }\n    </div>\n\n    <div class=\"actions\">\n      @if (primaryButtonText) {\n        <ui-button\n          [fullWidth]=\"emptyStateVariant === 'mobile'\"\n          [applicationTheme]=\"buttonApplicationTheme\"\n          class=\"action-button\"\n          [variant]=\"applicationTheme !== 'classic' ? getVariant(primaryButtonVariant) : 'primary'\"\n          [label]=\"primaryButtonText\"\n          [iconName]=\"primaryButtonIconName\"\n          [iconPosition]=\"primaryButtonIconPosition\"\n          (buttonClickEvent)=\"onPrimaryButtonClick($event)\"\n        ></ui-button>\n      }\n      @if (secondaryButtonText) {\n        <ui-button\n          [fullWidth]=\"emptyStateVariant === 'mobile'\"\n          [applicationTheme]=\"buttonApplicationTheme\"\n          class=\"action-button\"\n          [variant]=\"applicationTheme !== 'classic' ? getVariant(secondaryButtonVariant) : 'secondary'\"\n          [label]=\"secondaryButtonText\"\n          [iconName]=\"secondaryButtonIconName\"\n          [iconPosition]=\"secondaryButtonIconPosition\"\n          (buttonClickEvent)=\"onSecondaryButtonClick($event)\"\n        ></ui-button>\n      }\n      @if (tertiaryButtonText) {\n        <ui-button\n          [fullWidth]=\"emptyStateVariant === 'mobile'\"\n          [applicationTheme]=\"buttonApplicationTheme\"\n          class=\"action-button\"\n          [variant]=\"applicationTheme !== 'classic' ? getVariant(tertiaryButtonVariant) : 'tertiary'\"\n          [label]=\"tertiaryButtonText\"\n          [iconName]=\"tertiaryButtonIconName\"\n          [iconPosition]=\"tertiaryButtonIconPosition\"\n          (buttonClickEvent)=\"onTertiaryButtonClick($event)\"\n        ></ui-button>\n      }\n      @if (generalVariationButtonText) {\n        <ui-button\n          class=\"action-button\"\n          [fullWidth]=\"emptyStateVariant === 'mobile'\"\n          [applicationTheme]=\"buttonApplicationTheme\"\n          [variant]=\"generalButtonVariation\"\n          [label]=\"generalVariationButtonText\"\n          [iconName]=\"generalVariationButtonIconName\"\n          [iconPosition]=\"generalVariationButtonIconPosition\"\n          [disabled]=\"generalVariationButtonDisabled\"\n          [size]=\"generalVariationButtonSize\"\n          (buttonClickEvent)=\"onGeneralVariationButtonClick($event)\"\n        ></ui-button>\n      }\n    </div>\n  </div>\n</ng-container>\n",
+			styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}.empty-state-container{max-width:480px;margin:0 auto;flex-direction:column;padding:32px}.empty-state-container.mobile{max-width:none;padding:16px}.empty-state-container.mobile .actions{flex-direction:column;width:100%}@media(max-width:600px){.empty-state-container{margin:0;padding:16px}.empty-state-container .actions{flex-direction:column;width:100%}.empty-state-container .actions ui-button{width:100%}.empty-state-container .actions ui-button ::ng-deep .button-wrapper,.empty-state-container .actions ui-button ::ng-deep button{width:100%}}.empty-state-container .text-content{margin:24px 0;flex-direction:column}.empty-state-container .text-content .title{font-weight:700;font-size:20px;line-height:26px;margin-bottom:8px;text-align:center}.empty-state-container .text-content .body-text{font-size:16px;line-height:24px;text-align:center}.empty-state-container .actions{display:flex;flex-wrap:wrap;justify-content:center}.empty-state-container .actions .action-button{margin:8px}.flex-center,.empty-state-container,.empty-state-container .text-content{display:flex;justify-content:center;align-items:center}\n"],
+			dependencies: [
+				{
+					kind: "ngmodule",
+					type: IconComponentModule
+				},
+				{
+					kind: "component",
+					type: i1.IconComponent,
+					selector: "ui-icon",
+					inputs: [
+						"size",
+						"cssClass",
+						"name",
+						"color",
+						"filled",
+						"toggleIconStyle",
+						"applicationTheme",
+						"useFullIconName"
+					]
+				},
+				{
+					kind: "component",
+					type: ButtonComponent,
+					selector: "ui-button",
+					inputs: [
+						"size",
+						"variant",
+						"label",
+						"iconPosition",
+						"justIcon",
+						"iconName",
+						"trailingIconName",
+						"trailingIconFilled",
+						"disabled",
+						"loading",
+						"loadingWithLabel",
+						"fullWidth",
+						"url",
+						"urlTarget",
+						"value",
+						"tooltip",
+						"isPremium",
+						"type",
+						"companyColor",
+						"buttonBadgeConfig",
+						"applicationTheme",
+						"disabledScaleOnClick",
+						"ariaLabel",
+						"ariaExpanded",
+						"ariaControls",
+						"ariaPressed",
+						"ariaRequired",
+						"ariaLabelledby",
+						"ariaDescribedby",
+						"preventDefault",
+						"hasBackground",
+						"tooltipPosition",
+						"role",
+						"iconFilled",
+						"testId"
+					],
+					outputs: ["buttonClickEvent", "buttonHoverEvent"]
+				},
+				{
+					kind: "pipe",
+					type: AsyncPipe,
+					name: "async"
+				},
+				{
+					kind: "pipe",
+					type: UiTranslatePipe,
+					name: "uiTranslate"
+				}
+			],
+			changeDetection: i0.ChangeDetectionStrategy.OnPush
+		});
+	}
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.4",
+	ngImport: i0,
+	type: EmptyStateComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "ui-empty-state",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			imports: [
+				IconComponentModule,
+				ButtonComponent,
+				AsyncPipe,
+				UiTranslatePipe
+			],
+			template: "<ng-container>\n  <div class=\"empty-state-container\" [attr.theme]=\"applicationTheme\" [class.mobile]=\"emptyStateVariant === 'mobile'\">\n    @if (showIllustration) {\n      <div class=\"illustration\" [attr.aria-hidden]=\"true\">\n        @if (applicationTheme === 'classic') {\n          <img [attr.src]=\"'/images/empty-state-default.svg'\" [width]=\"160\" [height]=\"160\" alt=\"illustration\" />\n        }\n        @if (applicationTheme !== 'classic') {\n          <img\n            [attr.src]=\"'/icons/rebrand/' + illustrationVariant + '-in-line.svg'\"\n            [width]=\"160\"\n            [height]=\"160\"\n            alt=\"illustration\"\n          />\n        }\n      </div>\n    }\n\n    @if (icon) {\n      <div class=\"icon\">\n        <ui-icon [applicationTheme]=\"applicationTheme\" [name]=\"icon\" size=\"40\"></ui-icon>\n      </div>\n    }\n\n    <div class=\"text-content\">\n      <div class=\"title\">{{ title ? title : ('COMMON.NO_RESULTS' | uiTranslate | async) }}</div>\n      @if (bodyText) {\n        <div class=\"body-text\" [innerHTML]=\"bodyText\"></div>\n      }\n    </div>\n\n    <div class=\"actions\">\n      @if (primaryButtonText) {\n        <ui-button\n          [fullWidth]=\"emptyStateVariant === 'mobile'\"\n          [applicationTheme]=\"buttonApplicationTheme\"\n          class=\"action-button\"\n          [variant]=\"applicationTheme !== 'classic' ? getVariant(primaryButtonVariant) : 'primary'\"\n          [label]=\"primaryButtonText\"\n          [iconName]=\"primaryButtonIconName\"\n          [iconPosition]=\"primaryButtonIconPosition\"\n          (buttonClickEvent)=\"onPrimaryButtonClick($event)\"\n        ></ui-button>\n      }\n      @if (secondaryButtonText) {\n        <ui-button\n          [fullWidth]=\"emptyStateVariant === 'mobile'\"\n          [applicationTheme]=\"buttonApplicationTheme\"\n          class=\"action-button\"\n          [variant]=\"applicationTheme !== 'classic' ? getVariant(secondaryButtonVariant) : 'secondary'\"\n          [label]=\"secondaryButtonText\"\n          [iconName]=\"secondaryButtonIconName\"\n          [iconPosition]=\"secondaryButtonIconPosition\"\n          (buttonClickEvent)=\"onSecondaryButtonClick($event)\"\n        ></ui-button>\n      }\n      @if (tertiaryButtonText) {\n        <ui-button\n          [fullWidth]=\"emptyStateVariant === 'mobile'\"\n          [applicationTheme]=\"buttonApplicationTheme\"\n          class=\"action-button\"\n          [variant]=\"applicationTheme !== 'classic' ? getVariant(tertiaryButtonVariant) : 'tertiary'\"\n          [label]=\"tertiaryButtonText\"\n          [iconName]=\"tertiaryButtonIconName\"\n          [iconPosition]=\"tertiaryButtonIconPosition\"\n          (buttonClickEvent)=\"onTertiaryButtonClick($event)\"\n        ></ui-button>\n      }\n      @if (generalVariationButtonText) {\n        <ui-button\n          class=\"action-button\"\n          [fullWidth]=\"emptyStateVariant === 'mobile'\"\n          [applicationTheme]=\"buttonApplicationTheme\"\n          [variant]=\"generalButtonVariation\"\n          [label]=\"generalVariationButtonText\"\n          [iconName]=\"generalVariationButtonIconName\"\n          [iconPosition]=\"generalVariationButtonIconPosition\"\n          [disabled]=\"generalVariationButtonDisabled\"\n          [size]=\"generalVariationButtonSize\"\n          (buttonClickEvent)=\"onGeneralVariationButtonClick($event)\"\n        ></ui-button>\n      }\n    </div>\n  </div>\n</ng-container>\n",
+			styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}.empty-state-container{max-width:480px;margin:0 auto;flex-direction:column;padding:32px}.empty-state-container.mobile{max-width:none;padding:16px}.empty-state-container.mobile .actions{flex-direction:column;width:100%}@media(max-width:600px){.empty-state-container{margin:0;padding:16px}.empty-state-container .actions{flex-direction:column;width:100%}.empty-state-container .actions ui-button{width:100%}.empty-state-container .actions ui-button ::ng-deep .button-wrapper,.empty-state-container .actions ui-button ::ng-deep button{width:100%}}.empty-state-container .text-content{margin:24px 0;flex-direction:column}.empty-state-container .text-content .title{font-weight:700;font-size:20px;line-height:26px;margin-bottom:8px;text-align:center}.empty-state-container .text-content .body-text{font-size:16px;line-height:24px;text-align:center}.empty-state-container .actions{display:flex;flex-wrap:wrap;justify-content:center}.empty-state-container .actions .action-button{margin:8px}.flex-center,.empty-state-container,.empty-state-container .text-content{display:flex;justify-content:center;align-items:center}\n"]
+		}]
+	}],
+	ctorParameters: () => [{
+		type: void 0,
+		decorators: [{ type: Optional }, {
+			type: Inject,
+			args: ["CANOPYUI_DEFAULT_APPLICATION_THEME"]
+		}]
+	}],
+	propDecorators: {
+		showIllustration: [{ type: Input }],
+		illustrationVariant: [{ type: Input }],
+		icon: [{ type: Input }],
+		emptyStateVariant: [{ type: Input }],
+		title: [{ type: Input }],
+		bodyText: [{ type: Input }],
+		primaryButtonText: [{ type: Input }],
+		primaryButtonVariant: [{ type: Input }],
+		generalButtonVariation: [{ type: Input }],
+		primaryButtonIconName: [{ type: Input }],
+		primaryButtonIconPosition: [{ type: Input }],
+		secondaryButtonText: [{ type: Input }],
+		secondaryButtonVariant: [{ type: Input }],
+		secondaryButtonIconName: [{ type: Input }],
+		secondaryButtonIconPosition: [{ type: Input }],
+		tertiaryButtonText: [{ type: Input }],
+		tertiaryButtonVariant: [{ type: Input }],
+		tertiaryButtonIconName: [{ type: Input }],
+		tertiaryButtonIconPosition: [{ type: Input }],
+		generalVariationButtonText: [{ type: Input }],
+		generalVariationButtonSize: [{ type: Input }],
+		generalVariationButtonIconName: [{ type: Input }],
+		generalVariationButtonIconPosition: [{ type: Input }],
+		generalVariationButtonDisabled: [{ type: Input }],
+		applicationTheme: [{ type: Input }],
+		primaryButtonClick: [{ type: Output }],
+		secondaryButtonClick: [{ type: Output }],
+		tertiaryButtonClick: [{ type: Output }],
+		generalVariationButtonClick: [{ type: Output }]
+	}
+});
+var EmptyStateComponentModule = class EmptyStateComponentModule {
+	static {
+		this.ɵfac = i0.ɵɵngDeclareFactory({
+			minVersion: "12.0.0",
+			version: "22.2.4",
+			ngImport: i0,
+			type: EmptyStateComponentModule,
+			deps: [],
+			target: i0.ɵɵFactoryTarget.NgModule
+		});
+	}
+	static {
+		this.ɵmod = i0.ɵɵngDeclareNgModule({
+			minVersion: "14.0.0",
+			version: "22.2.4",
+			ngImport: i0,
+			type: EmptyStateComponentModule,
+			imports: [
+				CommonModule,
+				IconComponentModule,
+				NgOptimizedImage,
+				ButtonComponentModule,
+				UiTranslatePipe,
+				EmptyStateComponent
+			],
+			exports: [EmptyStateComponent]
+		});
+	}
+	static {
+		this.ɵinj = i0.ɵɵngDeclareInjector({
+			minVersion: "12.0.0",
+			version: "22.2.4",
+			ngImport: i0,
+			type: EmptyStateComponentModule,
+			imports: [
+				CommonModule,
+				IconComponentModule,
+				ButtonComponentModule,
+				EmptyStateComponent
+			]
+		});
+	}
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.4",
+	ngImport: i0,
+	type: EmptyStateComponentModule,
+	decorators: [{
+		type: NgModule,
+		args: [{
+			imports: [
+				CommonModule,
+				IconComponentModule,
+				NgOptimizedImage,
+				ButtonComponentModule,
+				UiTranslatePipe,
+				EmptyStateComponent
+			],
+			exports: [EmptyStateComponent]
+		}]
+	}]
+});
 export { EmptyStateComponent, EmptyStateComponentModule };
-//# sourceMappingURL=testgorilla-tgo-ui-components-empty-state.mjs.map
+
+//# sourceMappingURL=testgorilla-tgo-ui-components-empty-state.mjs.map