import * as i0 from '@angular/core';
import { ChangeDetectionStrategy, Component, Directive, input, booleanAttribute, inject, ElementRef, signal, computed, DestroyRef, afterNextRender, ViewEncapsulation, NgModule } from '@angular/core';
import { DomSanitizer } from '@angular/platform-browser';

/**
 * Component representing the actions section of an illustrated message.
 * Typically contains buttons or links for user actions.
 */
class IllustratedMessageActionsComponent {
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: IllustratedMessageActionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.0", type: IllustratedMessageActionsComponent, isStandalone: true, selector: "fd-illustrated-message-actions", host: { classAttribute: "fd-illustrated-message__actions" }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: IllustratedMessageActionsComponent, decorators: [{
            type: Component,
            args: [{
                    selector: 'fd-illustrated-message-actions',
                    template: `<ng-content></ng-content>`,
                    changeDetection: ChangeDetectionStrategy.OnPush,
                    host: {
                        class: 'fd-illustrated-message__actions'
                    }
                }]
        }] });

/**
 * Component representing the figcaption section of an illustrated message.
 * Contains title and text content slots.
 */
class IllustratedMessageFigcaptionComponent {
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: IllustratedMessageFigcaptionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.0", type: IllustratedMessageFigcaptionComponent, isStandalone: true, selector: "[fd-illustrated-message-figcaption]", host: { classAttribute: "fd-illustrated-message__figcaption" }, ngImport: i0, template: `
        <ng-content select="[fd-illustrated-message-title]"></ng-content>
        <ng-content select="[fd-illustrated-message-text]"></ng-content>
    `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: IllustratedMessageFigcaptionComponent, decorators: [{
            type: Component,
            args: [{
                    // eslint-disable-next-line @angular-eslint/component-selector
                    selector: '[fd-illustrated-message-figcaption]',
                    template: `
        <ng-content select="[fd-illustrated-message-title]"></ng-content>
        <ng-content select="[fd-illustrated-message-text]"></ng-content>
    `,
                    changeDetection: ChangeDetectionStrategy.OnPush,
                    host: {
                        class: 'fd-illustrated-message__figcaption'
                    }
                }]
        }] });

/**
 * Directive for the text/description element within an illustrated message figcaption.
 */
class IllustratedMessageTextDirective {
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: IllustratedMessageTextDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.0", type: IllustratedMessageTextDirective, isStandalone: true, selector: "[fd-illustrated-message-text]", host: { classAttribute: "fd-illustrated-message__text" }, ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: IllustratedMessageTextDirective, decorators: [{
            type: Directive,
            args: [{
                    // eslint-disable-next-line @angular-eslint/directive-selector
                    selector: '[fd-illustrated-message-text]',
                    host: {
                        class: 'fd-illustrated-message__text'
                    }
                }]
        }] });

/**
 * Directive for the title element within an illustrated message figcaption.
 */
class IllustratedMessageTitleDirective {
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: IllustratedMessageTitleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.0", type: IllustratedMessageTitleDirective, isStandalone: true, selector: "[fd-illustrated-message-title]", host: { classAttribute: "fd-illustrated-message__title" }, ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: IllustratedMessageTitleDirective, decorators: [{
            type: Directive,
            args: [{
                    // eslint-disable-next-line @angular-eslint/directive-selector
                    selector: '[fd-illustrated-message-title]',
                    host: {
                        class: 'fd-illustrated-message__title'
                    }
                }]
        }] });

/**
 * Enumeration of illustrated message types with their string values.
 */
var IllustratedMessageTypes;
(function (IllustratedMessageTypes) {
    IllustratedMessageTypes["LARGE"] = "large";
    IllustratedMessageTypes["MEDIUM"] = "medium";
    IllustratedMessageTypes["SMALL"] = "small";
    IllustratedMessageTypes["EXTRA_SMALL"] = "xsmall";
    IllustratedMessageTypes["BASE"] = "base";
    /** @deprecated Use LARGE instead */
    IllustratedMessageTypes["SCENE"] = "scene";
    /** @deprecated Use MEDIUM instead */
    IllustratedMessageTypes["DIALOG"] = "dialog";
    /** @deprecated Use SMALL instead */
    IllustratedMessageTypes["SPOT"] = "spot";
    /** @deprecated Use EXTRA_SMALL instead */
    IllustratedMessageTypes["DOT"] = "dot";
})(IllustratedMessageTypes || (IllustratedMessageTypes = {}));
let illustratedMessageUniqueId = 0;
/**
 * Component representing an illustrated message with responsive SVG illustration.
 *
 * The component automatically adjusts its illustration size based on container width:
 * - Large (>= 682px)
 * - Medium (361px - 681px)
 * - Small (261px - 360px)
 * - Extra Small (161px - 260px)
 * - Base (< 161px)
 *
 * Supports both URL-based SVG sprites and inline SVG content.
 *
 * @example
 * ```html
 * <div fd-illustrated-message [svgConfig]="svgConfig">
 *   <figcaption fd-illustrated-message-figcaption>
 *     <h3>No Data Available</h3>
 *     <p>Please check back later</p>
 *   </figcaption>
 * </div>
 * ```
 */
class IllustratedMessageComponent {
    /** @hidden */
    constructor() {
        /**
         * Explicitly set the illustration type. If not provided, type is determined by container width.
         */
        this.type = input(...(ngDevMode ? [undefined, { debugName: "type" }] : []));
        /**
         * Configuration for SVG illustrations at different sizes.
         */
        this.svgConfig = input(...(ngDevMode ? [undefined, { debugName: "svgConfig" }] : []));
        /**
         * Accessible label for the SVG illustration.
         */
        this.svgAriaLabel = input(null, ...(ngDevMode ? [{ debugName: "svgAriaLabel" }] : []));
        /**
         * When true, hides the SVG illustration entirely.
         */
        this.noSvg = input(false, { ...(ngDevMode ? { debugName: "noSvg" } : {}), transform: booleanAttribute });
        /**
         * Unique identifier for the illustrated message component.
         */
        this.id = input(`fd-illustrated-message-${++illustratedMessageUniqueId}`, ...(ngDevMode ? [{ debugName: "id" }] : []));
        /**
         * Reference to the host element.
         */
        this.elementRef = inject(ElementRef);
        /**
         * Signal tracking container width for responsive behavior.
         * @hidden
         */
        this.containerWidth = signal(0, ...(ngDevMode ? [{ debugName: "containerWidth" }] : []));
        /**
         * Normalized illustration type from explicit input or legacy names.
         * @hidden
         */
        this.normalizedInputType = computed(() => {
            const explicitType = this.type();
            return explicitType ? this._normalizeType(explicitType) : undefined;
        }, ...(ngDevMode ? [{ debugName: "normalizedInputType" }] : []));
        /**
         * Current illustration type based on explicit type or container width.
         * @hidden
         */
        this.currentType = computed(() => this.normalizedInputType() || this._determineTypeByWidth(this.containerWidth()), ...(ngDevMode ? [{ debugName: "currentType" }] : []));
        /**
         * Normalized SVG configuration with legacy keys mapped to modern keys.
         * @hidden
         */
        this.normalizedConfig = computed(() => {
            const config = this.svgConfig();
            return config ? this._normalizeSvgConfig(config) : null;
        }, ...(ngDevMode ? [{ debugName: "normalizedConfig" }] : []));
        /**
         * Inline SVG content for the current type.
         * @hidden
         */
        this.inlineSvg = computed(() => {
            const config = this.normalizedConfig();
            const type = this.currentType();
            const inlineSvg = config?.[type]?.file;
            return inlineSvg ? this._sanitizer.bypassSecurityTrustHtml(inlineSvg) : undefined;
        }, ...(ngDevMode ? [{ debugName: "inlineSvg" }] : []));
        /**
         * SVG href attribute for the current type.
         * @hidden
         */
        this.href = computed(() => {
            const config = this.normalizedConfig();
            if (!config) {
                return '';
            }
            return this._getHrefByType(this.currentType(), config);
        }, ...(ngDevMode ? [{ debugName: "href" }] : []));
        /**
         * Computed CSS class string for the component.
         * @hidden
         */
        this.cssClass = computed(() => {
            const classes = ['fd-illustrated-message'];
            const currentTypeValue = this.currentType();
            if (currentTypeValue) {
                classes.push(`fd-illustrated-message--${currentTypeValue}`);
            }
            return classes.join(' ');
        }, ...(ngDevMode ? [{ debugName: "cssClass" }] : []));
        /** @hidden */
        this._sanitizer = inject(DomSanitizer);
        /** @hidden */
        this._destroyRef = inject(DestroyRef);
        afterNextRender(() => {
            const observer = new ResizeObserver(() => {
                this._measureContainerWidth();
            });
            observer.observe(this.elementRef.nativeElement);
            this._destroyRef.onDestroy(() => observer.disconnect());
        });
    }
    /**
     * Measures and updates the container width.
     * @private
     */
    _measureContainerWidth() {
        const width = this.elementRef.nativeElement.offsetWidth;
        if (this.containerWidth() !== width) {
            this.containerWidth.set(width);
        }
    }
    /**
     * Determines the illustration type based on container width.
     * @param width - Container width in pixels
     * @returns Appropriate illustration type
     * @private
     */
    _determineTypeByWidth(width) {
        if (width >= 682) {
            return IllustratedMessageTypes.LARGE;
        }
        else if (width >= 361) {
            return IllustratedMessageTypes.MEDIUM;
        }
        else if (width >= 261) {
            return IllustratedMessageTypes.SMALL;
        }
        else if (width >= 161) {
            return IllustratedMessageTypes.EXTRA_SMALL;
        }
        return IllustratedMessageTypes.BASE;
    }
    /**
     * Normalizes legacy type names to modern equivalents.
     * @param type - Illustration type to normalize
     * @returns Normalized illustration type
     * @private
     */
    _normalizeType(type) {
        switch (type) {
            case 'scene':
                return 'large';
            case 'dialog':
                return 'medium';
            case 'spot':
                return 'small';
            case 'dot':
                return 'xsmall';
            default:
                return type;
        }
    }
    /**
     * Normalizes SVG configuration, mapping legacy keys to modern keys.
     * @param config - SVG configuration to normalize
     * @returns Normalized SVG configuration
     * @private
     */
    _normalizeSvgConfig(config) {
        return {
            large: config.large || config.scene,
            medium: config.medium || config.dialog,
            small: config.small || config.spot,
            xsmall: config.xsmall || config.dot
        };
    }
    /**
     * Constructs the SVG href attribute value for the given type.
     * @param type - Illustration type
     * @param svgConfig - Normalized SVG configuration
     * @returns SVG href string
     * @private
     */
    _getHrefByType(type, svgConfig) {
        switch (type) {
            case 'large':
                return `${svgConfig.large?.url || ''}#${svgConfig.large?.id}`;
            case 'medium':
                return `${svgConfig.medium?.url || ''}#${svgConfig.medium?.id}`;
            case 'small':
                return `${svgConfig.small?.url || ''}#${svgConfig.small?.id}`;
            case 'xsmall':
                return `${svgConfig.xsmall?.url || ''}#${svgConfig.xsmall?.id}`;
            default:
                return '';
        }
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: IllustratedMessageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.0", type: IllustratedMessageComponent, isStandalone: true, selector: "[fd-illustrated-message]", inputs: { type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, svgConfig: { classPropertyName: "svgConfig", publicName: "svgConfig", isSignal: true, isRequired: false, transformFunction: null }, svgAriaLabel: { classPropertyName: "svgAriaLabel", publicName: "svgAriaLabel", isSignal: true, isRequired: false, transformFunction: null }, noSvg: { classPropertyName: "noSvg", publicName: "noSvg", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.id": "id()", "class": "cssClass()" } }, ngImport: i0, template: "<div class=\"fd-illustrated-message__container\">\n    @if (!noSvg()) {\n        <svg\n            class=\"fd-illustrated-message__illustration\"\n            [attr.aria-label]=\"svgAriaLabel()\"\n            preserveAspectRatio=\"xMidYMid meet\"\n        >\n            <use [attr.href]=\"href()\"></use>\n        </svg>\n    }\n    @if (inlineSvg()) {\n        <div [style.display]=\"'none'\" [innerHTML]=\"inlineSvg()\"></div>\n    }\n    <ng-content select=\"[fd-illustrated-message-figcaption]\"></ng-content>\n</div>\n<ng-content select=\"fd-illustrated-message-actions\"></ng-content>\n", styles: [".fd-illustrated-message{--illustratedMessagePadding: 1rem;--actionsMarginBlockStart: .5rem;--illustrationMaxWidth: 20rem;--illustrationMaxHeight: 15rem;--illustrationMarginBlock: 1rem;--illustrationDisplay: flex;--figcaptionMaxWidth: 40.625rem;--titleFontSize: 2rem;--titleMarginBottom: 1rem;--textFontSize: var(--sapFontLargeSize);font-size:var(--sapFontSize);line-height:normal;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-weight:400;-webkit-box-sizing:border-box;box-sizing:border-box;forced-color-adjust:none;padding-inline:0;padding-block:0;margin-inline:0;margin-block:0;border:0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:100%;text-align:center;padding-block:var(--illustratedMessagePadding);padding-inline:var(--illustratedMessagePadding)}.fd-illustrated-message:before,.fd-illustrated-message:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-illustrated-message-responsive-container{font-size:var(--sapFontSize);line-height:normal;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-weight:400;-webkit-box-sizing:border-box;box-sizing:border-box;forced-color-adjust:none;padding-inline:0;padding-block:0;margin-inline:0;margin-block:0;border:0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:100%;min-height:100%;height:100%;container-type:inline-size}.fd-illustrated-message-responsive-container:before,.fd-illustrated-message-responsive-container:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-illustrated-message__container{font-size:var(--sapFontSize);line-height:normal;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-weight:400;-webkit-box-sizing:border-box;box-sizing:border-box;forced-color-adjust:none;padding-inline:0;padding-block:0;margin-inline:0;margin-block:0;border:0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;flex-direction:column;-webkit-box-align:var(--containerFlexAlignment, center);-ms-flex-align:var(--containerFlexAlignment, center);align-items:var(--containerFlexAlignment, center)}.fd-illustrated-message__container:before,.fd-illustrated-message__container:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-illustrated-message__illustration{font-size:var(--sapFontSize);line-height:normal;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-weight:400;-webkit-box-sizing:border-box;box-sizing:border-box;forced-color-adjust:none;padding-inline:0;padding-block:0;margin-inline:0;margin-block:0;border:0;display:var(--illustrationDisplay);width:var(--illustrationMaxWidth);height:var(--illustrationMaxHeight);max-width:var(--illustrationMaxWidth);max-height:var(--illustrationMaxHeight);-webkit-margin-after:var(--illustrationMarginBlock);margin-block-end:var(--illustrationMarginBlock)}.fd-illustrated-message__illustration:before,.fd-illustrated-message__illustration:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-illustrated-message__figcaption{font-size:var(--sapFontSize);line-height:normal;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-weight:400;-webkit-box-sizing:border-box;box-sizing:border-box;forced-color-adjust:none;padding-inline:0;padding-block:0;margin-inline:0;margin-block:0;border:0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;overflow:hidden;max-width:var(--figcaptionMaxWidth)}.fd-illustrated-message__figcaption:before,.fd-illustrated-message__figcaption:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-illustrated-message__title{font-size:var(--sapFontSize);line-height:normal;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-weight:400;-webkit-box-sizing:border-box;box-sizing:border-box;forced-color-adjust:none;padding-inline:0;padding-block:0;margin-inline:0;margin-block:0;border:0;width:100%;text-align:center;font-size:var(--titleFontSize);color:var(--sapGroup_TitleTextColor);font-family:var(--sapFontBoldFamily);-webkit-margin-after:var(--titleMarginBottom);margin-block-end:var(--titleMarginBottom)}.fd-illustrated-message__title:before,.fd-illustrated-message__title:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-illustrated-message__text{font-size:var(--sapFontSize);line-height:normal;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-weight:400;-webkit-box-sizing:border-box;box-sizing:border-box;forced-color-adjust:none;padding-inline:0;padding-block:0;margin-inline:0;margin-block:0;border:0;text-wrap:wrap;text-align:center;font-size:var(--textFontSize)}.fd-illustrated-message__text:before,.fd-illustrated-message__text:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-illustrated-message__actions{font-size:var(--sapFontSize);line-height:normal;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-weight:400;-webkit-box-sizing:border-box;box-sizing:border-box;forced-color-adjust:none;padding-inline:0;padding-block:0;margin-inline:0;margin-block:0;border:0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:.5rem;-webkit-margin-before:var(--actionsMarginBlockStart);margin-block-start:var(--actionsMarginBlockStart)}.fd-illustrated-message__actions:before,.fd-illustrated-message__actions:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-illustrated-message--dialog,.fd-illustrated-message--medium{--illustrationMaxWidth: 10rem;--illustrationMaxHeight: 10rem;--illustrationMarginBlock: .5rem;--titleFontSize: 1.5rem;--titleMarginBottom: .5rem;--textFontSize: var(--sapFontSize);--figcaptionMaxWidth: 19.938rem;--actionsMarginBlockStart: .5rem}.fd-illustrated-message--spot,.fd-illustrated-message--small{--illustratedMessagePadding: .5rem;--illustrationMaxWidth: 8rem;--illustrationMaxHeight: 8rem;--illustrationMarginBlock: .5rem;--titleMarginBottom: .5rem;--titleFontSize: 1.25rem;--textFontSize: var(--sapFontSize);--figcaptionMaxWidth: 10.938rem;--actionsMarginBlockStart: .5rem}.fd-illustrated-message--dot,.fd-illustrated-message--xsmall{--illustratedMessagePadding: .25rem;--illustrationMaxWidth: 2.8125rem;--illustrationMaxHeight: 2.8125rem;--illustrationMarginBlock: .25rem;--figcaptionMaxWidth: 8.438rem;--titleMarginBottom: .25rem;--titleFontSize: 1rem;--textFontSize: var(--sapFontSize);--actionsMarginBlockStart: .25rem}.fd-illustrated-message--base{--illustratedMessagePadding: .25rem;--illustrationDisplay: none;--figcaptionMaxWidth: 8.375rem;--titleMarginBottom: .25rem;--titleFontSize: 1rem;--textFontSize: var(--sapFontSize);--actionsMarginBlockStart: .25rem}@container (width < 22rem){.fd-illustrated-message{--illustrationMaxWidth: 10rem;--illustrationMaxHeight: 10rem;--illustrationMarginBlock: .5rem;--titleFontSize: 1.5rem;--titleMarginBottom: .5rem;--textFontSize: var(--sapFontSize);--figcaptionMaxWidth: 19.938rem;--actionsMarginBlockStart: .5rem}}@container (width < 21.938rem){.fd-illustrated-message{--illustratedMessagePadding: .5rem;--illustrationMaxWidth: 8rem;--illustrationMaxHeight: 8rem;--illustrationMarginBlock: .5rem;--titleMarginBottom: .5rem;--titleFontSize: 1.25rem;--textFontSize: var(--sapFontSize);--figcaptionMaxWidth: 10.938rem;--actionsMarginBlockStart: .5rem}}@container (width < 11.938rem){.fd-illustrated-message{--illustratedMessagePadding: .25rem;--illustrationMaxWidth: 2.8125rem;--illustrationMaxHeight: 2.8125rem;--illustrationMarginBlock: .25rem;--figcaptionMaxWidth: 8.438rem;--titleMarginBottom: .25rem;--titleFontSize: 1rem;--textFontSize: var(--sapFontSize);--actionsMarginBlockStart: .25rem}}@container (width < 8.938rem){.fd-illustrated-message{--illustratedMessagePadding: .25rem;--illustrationDisplay: none;--figcaptionMaxWidth: 8.375rem;--titleMarginBottom: .25rem;--titleFontSize: 1rem;--textFontSize: var(--sapFontSize);--actionsMarginBlockStart: .25rem}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: IllustratedMessageComponent, decorators: [{
            type: Component,
            args: [{ selector: '[fd-illustrated-message]', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, imports: [], host: {
                        '[attr.id]': 'id()',
                        '[class]': 'cssClass()'
                    }, template: "<div class=\"fd-illustrated-message__container\">\n    @if (!noSvg()) {\n        <svg\n            class=\"fd-illustrated-message__illustration\"\n            [attr.aria-label]=\"svgAriaLabel()\"\n            preserveAspectRatio=\"xMidYMid meet\"\n        >\n            <use [attr.href]=\"href()\"></use>\n        </svg>\n    }\n    @if (inlineSvg()) {\n        <div [style.display]=\"'none'\" [innerHTML]=\"inlineSvg()\"></div>\n    }\n    <ng-content select=\"[fd-illustrated-message-figcaption]\"></ng-content>\n</div>\n<ng-content select=\"fd-illustrated-message-actions\"></ng-content>\n", styles: [".fd-illustrated-message{--illustratedMessagePadding: 1rem;--actionsMarginBlockStart: .5rem;--illustrationMaxWidth: 20rem;--illustrationMaxHeight: 15rem;--illustrationMarginBlock: 1rem;--illustrationDisplay: flex;--figcaptionMaxWidth: 40.625rem;--titleFontSize: 2rem;--titleMarginBottom: 1rem;--textFontSize: var(--sapFontLargeSize);font-size:var(--sapFontSize);line-height:normal;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-weight:400;-webkit-box-sizing:border-box;box-sizing:border-box;forced-color-adjust:none;padding-inline:0;padding-block:0;margin-inline:0;margin-block:0;border:0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:100%;text-align:center;padding-block:var(--illustratedMessagePadding);padding-inline:var(--illustratedMessagePadding)}.fd-illustrated-message:before,.fd-illustrated-message:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-illustrated-message-responsive-container{font-size:var(--sapFontSize);line-height:normal;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-weight:400;-webkit-box-sizing:border-box;box-sizing:border-box;forced-color-adjust:none;padding-inline:0;padding-block:0;margin-inline:0;margin-block:0;border:0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:100%;min-height:100%;height:100%;container-type:inline-size}.fd-illustrated-message-responsive-container:before,.fd-illustrated-message-responsive-container:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-illustrated-message__container{font-size:var(--sapFontSize);line-height:normal;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-weight:400;-webkit-box-sizing:border-box;box-sizing:border-box;forced-color-adjust:none;padding-inline:0;padding-block:0;margin-inline:0;margin-block:0;border:0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;flex-direction:column;-webkit-box-align:var(--containerFlexAlignment, center);-ms-flex-align:var(--containerFlexAlignment, center);align-items:var(--containerFlexAlignment, center)}.fd-illustrated-message__container:before,.fd-illustrated-message__container:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-illustrated-message__illustration{font-size:var(--sapFontSize);line-height:normal;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-weight:400;-webkit-box-sizing:border-box;box-sizing:border-box;forced-color-adjust:none;padding-inline:0;padding-block:0;margin-inline:0;margin-block:0;border:0;display:var(--illustrationDisplay);width:var(--illustrationMaxWidth);height:var(--illustrationMaxHeight);max-width:var(--illustrationMaxWidth);max-height:var(--illustrationMaxHeight);-webkit-margin-after:var(--illustrationMarginBlock);margin-block-end:var(--illustrationMarginBlock)}.fd-illustrated-message__illustration:before,.fd-illustrated-message__illustration:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-illustrated-message__figcaption{font-size:var(--sapFontSize);line-height:normal;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-weight:400;-webkit-box-sizing:border-box;box-sizing:border-box;forced-color-adjust:none;padding-inline:0;padding-block:0;margin-inline:0;margin-block:0;border:0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;overflow:hidden;max-width:var(--figcaptionMaxWidth)}.fd-illustrated-message__figcaption:before,.fd-illustrated-message__figcaption:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-illustrated-message__title{font-size:var(--sapFontSize);line-height:normal;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-weight:400;-webkit-box-sizing:border-box;box-sizing:border-box;forced-color-adjust:none;padding-inline:0;padding-block:0;margin-inline:0;margin-block:0;border:0;width:100%;text-align:center;font-size:var(--titleFontSize);color:var(--sapGroup_TitleTextColor);font-family:var(--sapFontBoldFamily);-webkit-margin-after:var(--titleMarginBottom);margin-block-end:var(--titleMarginBottom)}.fd-illustrated-message__title:before,.fd-illustrated-message__title:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-illustrated-message__text{font-size:var(--sapFontSize);line-height:normal;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-weight:400;-webkit-box-sizing:border-box;box-sizing:border-box;forced-color-adjust:none;padding-inline:0;padding-block:0;margin-inline:0;margin-block:0;border:0;text-wrap:wrap;text-align:center;font-size:var(--textFontSize)}.fd-illustrated-message__text:before,.fd-illustrated-message__text:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-illustrated-message__actions{font-size:var(--sapFontSize);line-height:normal;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-weight:400;-webkit-box-sizing:border-box;box-sizing:border-box;forced-color-adjust:none;padding-inline:0;padding-block:0;margin-inline:0;margin-block:0;border:0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:.5rem;-webkit-margin-before:var(--actionsMarginBlockStart);margin-block-start:var(--actionsMarginBlockStart)}.fd-illustrated-message__actions:before,.fd-illustrated-message__actions:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-illustrated-message--dialog,.fd-illustrated-message--medium{--illustrationMaxWidth: 10rem;--illustrationMaxHeight: 10rem;--illustrationMarginBlock: .5rem;--titleFontSize: 1.5rem;--titleMarginBottom: .5rem;--textFontSize: var(--sapFontSize);--figcaptionMaxWidth: 19.938rem;--actionsMarginBlockStart: .5rem}.fd-illustrated-message--spot,.fd-illustrated-message--small{--illustratedMessagePadding: .5rem;--illustrationMaxWidth: 8rem;--illustrationMaxHeight: 8rem;--illustrationMarginBlock: .5rem;--titleMarginBottom: .5rem;--titleFontSize: 1.25rem;--textFontSize: var(--sapFontSize);--figcaptionMaxWidth: 10.938rem;--actionsMarginBlockStart: .5rem}.fd-illustrated-message--dot,.fd-illustrated-message--xsmall{--illustratedMessagePadding: .25rem;--illustrationMaxWidth: 2.8125rem;--illustrationMaxHeight: 2.8125rem;--illustrationMarginBlock: .25rem;--figcaptionMaxWidth: 8.438rem;--titleMarginBottom: .25rem;--titleFontSize: 1rem;--textFontSize: var(--sapFontSize);--actionsMarginBlockStart: .25rem}.fd-illustrated-message--base{--illustratedMessagePadding: .25rem;--illustrationDisplay: none;--figcaptionMaxWidth: 8.375rem;--titleMarginBottom: .25rem;--titleFontSize: 1rem;--textFontSize: var(--sapFontSize);--actionsMarginBlockStart: .25rem}@container (width < 22rem){.fd-illustrated-message{--illustrationMaxWidth: 10rem;--illustrationMaxHeight: 10rem;--illustrationMarginBlock: .5rem;--titleFontSize: 1.5rem;--titleMarginBottom: .5rem;--textFontSize: var(--sapFontSize);--figcaptionMaxWidth: 19.938rem;--actionsMarginBlockStart: .5rem}}@container (width < 21.938rem){.fd-illustrated-message{--illustratedMessagePadding: .5rem;--illustrationMaxWidth: 8rem;--illustrationMaxHeight: 8rem;--illustrationMarginBlock: .5rem;--titleMarginBottom: .5rem;--titleFontSize: 1.25rem;--textFontSize: var(--sapFontSize);--figcaptionMaxWidth: 10.938rem;--actionsMarginBlockStart: .5rem}}@container (width < 11.938rem){.fd-illustrated-message{--illustratedMessagePadding: .25rem;--illustrationMaxWidth: 2.8125rem;--illustrationMaxHeight: 2.8125rem;--illustrationMarginBlock: .25rem;--figcaptionMaxWidth: 8.438rem;--titleMarginBottom: .25rem;--titleFontSize: 1rem;--textFontSize: var(--sapFontSize);--actionsMarginBlockStart: .25rem}}@container (width < 8.938rem){.fd-illustrated-message{--illustratedMessagePadding: .25rem;--illustrationDisplay: none;--figcaptionMaxWidth: 8.375rem;--titleMarginBottom: .25rem;--titleFontSize: 1rem;--textFontSize: var(--sapFontSize);--actionsMarginBlockStart: .25rem}}\n"] }]
        }], ctorParameters: () => [], propDecorators: { type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], svgConfig: [{ type: i0.Input, args: [{ isSignal: true, alias: "svgConfig", required: false }] }], svgAriaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "svgAriaLabel", required: false }] }], noSvg: [{ type: i0.Input, args: [{ isSignal: true, alias: "noSvg", required: false }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }] } });

const components = [
    IllustratedMessageComponent,
    IllustratedMessageActionsComponent,
    IllustratedMessageFigcaptionComponent,
    IllustratedMessageTextDirective,
    IllustratedMessageTitleDirective
];
/**
 * @deprecated
 * Use direct imports of components and directives.
 */
class IllustratedMessageModule {
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: IllustratedMessageModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.1.0", ngImport: i0, type: IllustratedMessageModule, imports: [IllustratedMessageComponent,
            IllustratedMessageActionsComponent,
            IllustratedMessageFigcaptionComponent,
            IllustratedMessageTextDirective,
            IllustratedMessageTitleDirective], exports: [IllustratedMessageComponent,
            IllustratedMessageActionsComponent,
            IllustratedMessageFigcaptionComponent,
            IllustratedMessageTextDirective,
            IllustratedMessageTitleDirective] }); }
    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: IllustratedMessageModule }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: IllustratedMessageModule, decorators: [{
            type: NgModule,
            args: [{
                    imports: [...components],
                    exports: [...components]
                }]
        }] });

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

export { IllustratedMessageActionsComponent, IllustratedMessageComponent, IllustratedMessageFigcaptionComponent, IllustratedMessageModule, IllustratedMessageTextDirective, IllustratedMessageTitleDirective, IllustratedMessageTypes };
//# sourceMappingURL=fundamental-ngx-core-illustrated-message.mjs.map
