npm - @yuuvis/material - Versions diffs - 3.0.1 → 3.2.0 - Mend

@yuuvis/material 3.0.1 → 3.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (11) hide show

package/fesm2022/yuuvis-material-badge.mjs +3 -3
package/fesm2022/yuuvis-material-badge.mjs.map +1 -1
package/fesm2022/yuuvis-material-layout.mjs +16 -16
package/fesm2022/yuuvis-material-layout.mjs.map +1 -1
package/fesm2022/yuuvis-material-panes.mjs +25 -25
package/fesm2022/yuuvis-material-panes.mjs.map +1 -1
package/fesm2022/yuuvis-material.mjs +43 -36
package/fesm2022/yuuvis-material.mjs.map +1 -1
package/package.json +1 -1
package/scss/material-components/_snackbar.scss +37 -6
package/types/yuuvis-material-badge.d.ts +1 -0

package/fesm2022/yuuvis-material-badge.mjs CHANGED Viewed

@@ -45,10 +45,10 @@ class YmtBadge {
     severity = input('neutral', ...(ngDevMode ? [{ debugName: "severity" }] : /* istanbul ignore next */ []));
     outline = input(false, ...(ngDevMode ? [{ debugName: "outline" }] : /* istanbul ignore next */ []));
     aura = input(false, ...(ngDevMode ? [{ debugName: "aura" }] : /* istanbul ignore next */ []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: YmtBadge, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.9", type: YmtBadge, isStandalone: true, selector: "ymt-badge", inputs: { severity: { classPropertyName: "severity", publicName: "severity", isSignal: true, isRequired: false, transformFunction: null }, outline: { classPropertyName: "outline", publicName: "outline", isSignal: true, isRequired: false, transformFunction: null }, aura: { classPropertyName: "aura", publicName: "aura", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.success": "severity() === \"success\"", "class.danger": "severity() === \"danger\"", "class.warning": "severity() === \"warning\"", "class.primary": "severity() === \"primary\"", "class.neutral": "severity() === \"neutral\"", "class.outline": "outline()", "class.aura": "aura()" } }, ngImport: i0, template: '<ng-content/>', isInline: true, styles: [":host{--ymt-badge-corner: var(--ymt-corner-full);--ymt-badge-background: var(--ymt-surface-container-highest);--ymt-badge-on-background: var(--ymt-on-surface);--ymt-badge-outline-color: var(--ymt-text-color-subtle);--ymt-badge-outline-text-color: var(--ymt-text-color-subtle);--ymt-badge-aura-size: 3px;display:inline-flex;background-color:var(--ymt-badge-background);color:var(--ymt-badge-on-background);font:var(--ymt-font-body-subtle);padding:0 var(--ymt-spacing-xs);border-radius:var(--ymt-badge-corner)}:host.aura{--ymt-aura-color: rgb(from var(--ymt-badge-background) r g b / .5);box-shadow:0 0 0 var(--ymt-badge-aura-size) var(--ymt-aura-color)}:host.aura.success{--ymt-badge-background: var(--ymt-success);--ymt-badge-on-background: var(--ymt-on-success)}:host.aura.warning{--ymt-badge-background: var(--ymt-warning);--ymt-badge-on-background: var(--ymt-on-warning)}:host.aura.danger{--ymt-badge-background: var(--ymt-danger);--ymt-badge-on-background: var(--ymt-on-danger)}:host.aura.primary{--ymt-badge-background: var(--ymt-primary);--ymt-badge-on-background: var(--ymt-on-primary)}:host.outline{background-color:transparent;border:1px solid var(--ymt-badge-outline-color);color:var(--ymt-badge-outline-text-color)}:host.aura{--ymt-aura-color: rgb(from var(--ymt-badge-outline-color) r g b / .2)}:host.success{--ymt-badge-background: var(--ymt-success-container);--ymt-badge-on-background: var(--ymt-on-success-container);--ymt-badge-outline-color: var(--ymt-success);--ymt-badge-outline-text-color: var(--ymt-success)}:host.warning{--ymt-badge-background: var(--ymt-warning-container);--ymt-badge-on-background: var(--ymt-on-warning-container);--ymt-badge-outline-color: var(--ymt-warning);--ymt-badge-outline-text-color: var(--ymt-warning)}:host.danger{--ymt-badge-background: var(--ymt-danger-container);--ymt-badge-on-background: var(--ymt-on-danger-container);--ymt-badge-outline-color: var(--ymt-danger);--ymt-badge-outline-text-color: var(--ymt-danger)}:host.primary{--ymt-badge-background: var(--ymt-primary-container);--ymt-badge-on-background: var(--ymt-on-primary-container);--ymt-badge-outline-color: var(--ymt-primary);--ymt-badge-outline-text-color: var(--ymt-primary)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: YmtBadge, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.12", type: YmtBadge, isStandalone: true, selector: "ymt-badge", inputs: { severity: { classPropertyName: "severity", publicName: "severity", isSignal: true, isRequired: false, transformFunction: null }, outline: { classPropertyName: "outline", publicName: "outline", isSignal: true, isRequired: false, transformFunction: null }, aura: { classPropertyName: "aura", publicName: "aura", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.success": "severity() === \"success\"", "class.danger": "severity() === \"danger\"", "class.warning": "severity() === \"warning\"", "class.primary": "severity() === \"primary\"", "class.neutral": "severity() === \"neutral\"", "class.outline": "outline()", "class.aura": "aura()" } }, ngImport: i0, template: '<ng-content/>', isInline: true, styles: [":host{--ymt-badge-corner: var(--ymt-corner-full);--ymt-badge-background: var(--ymt-surface-container-highest);--ymt-badge-on-background: var(--ymt-on-surface);--ymt-badge-outline-color: var(--ymt-text-color-subtle);--ymt-badge-outline-text-color: var(--ymt-text-color-subtle);--ymt-badge-aura-size: 3px;display:inline-flex;background-color:var(--ymt-badge-background);color:var(--ymt-badge-on-background);font:var(--ymt-font-body-subtle);padding:0 var(--ymt-spacing-xs);border-radius:var(--ymt-badge-corner)}:host.aura{--ymt-aura-color: rgb(from var(--ymt-badge-background) r g b / .5);box-shadow:0 0 0 var(--ymt-badge-aura-size) var(--ymt-aura-color)}:host.aura.success{--ymt-badge-background: var(--ymt-success);--ymt-badge-on-background: var(--ymt-on-success)}:host.aura.warning{--ymt-badge-background: var(--ymt-warning);--ymt-badge-on-background: var(--ymt-on-warning)}:host.aura.danger{--ymt-badge-background: var(--ymt-danger);--ymt-badge-on-background: var(--ymt-on-danger)}:host.aura.primary{--ymt-badge-background: var(--ymt-primary);--ymt-badge-on-background: var(--ymt-on-primary)}:host.outline{background-color:transparent;border:1px solid var(--ymt-badge-outline-color);color:var(--ymt-badge-outline-text-color)}:host.aura{--ymt-aura-color: rgb(from var(--ymt-badge-outline-color) r g b / .2)}:host.success{--ymt-badge-background: var(--ymt-success-container);--ymt-badge-on-background: var(--ymt-on-success-container);--ymt-badge-outline-color: var(--ymt-success);--ymt-badge-outline-text-color: var(--ymt-success)}:host.warning{--ymt-badge-background: var(--ymt-warning-container);--ymt-badge-on-background: var(--ymt-on-warning-container);--ymt-badge-outline-color: var(--ymt-warning);--ymt-badge-outline-text-color: var(--ymt-warning)}:host.danger{--ymt-badge-background: var(--ymt-danger-container);--ymt-badge-on-background: var(--ymt-on-danger-container);--ymt-badge-outline-color: var(--ymt-danger);--ymt-badge-outline-text-color: var(--ymt-danger)}:host.primary{--ymt-badge-background: var(--ymt-primary-container);--ymt-badge-on-background: var(--ymt-on-primary-container);--ymt-badge-outline-color: var(--ymt-primary);--ymt-badge-outline-text-color: var(--ymt-primary)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: YmtBadge, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: YmtBadge, decorators: [{
             type: Component,
             args: [{ selector: 'ymt-badge', imports: [], template: '<ng-content/>', host: {
                         '[class.success]': 'severity() === "success"',

package/fesm2022/yuuvis-material-badge.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"yuuvis-material-badge.mjs","sources":["../../../../../libs/yuuvis/material/badge/src/badge.component.ts","../../../../../libs/yuuvis/material/badge/src/yuuvis-material-badge.ts"],"sourcesContent":["\nimport { ChangeDetectionStrategy, Component, input } from '@angular/core';\nimport { Severity } from './model/badge.model';\n\n/*\n Badge component to display a label with different severity levels.\n \n ### Severity\n * Controls the color scheme via the `severity` input. Available values:\n * - `neutral` (default) — uses surface container colors\n * - `success` — green tones for positive/confirmed states\n * - `danger` — red tones for errors or destructive indicators\n * - `warning` — yellow/amber tones for caution states\n * - `primary` — theme primary color for informational or branded badges\n \n ### Variants\n * - Filled (default) — solid background with contrasting text color\n * - Outline — transparent background with a colored border, enabled via the `outline` input\n \n ### Aura\n * When `aura` is enabled, the badge renders a soft glowing box-shadow derived from its\n * severity color. In filled mode the aura uses a stronger, fully saturated background;\n * in outline mode it uses a subtle semi-transparent glow.\n \n ### Theming\n * The component exposes CSS custom properties for fine-grained control:\n * - `--ymt-badge-corner` — border radius (default: `--ymt-corner-full`)\n * - `--ymt-badge-background` — fill color\n * - `--ymt-badge-on-background` — text color\n * - `--ymt-badge-outline-color` — border color in outline variant\n * - `--ymt-badge-outline-text-color` — text color in outline variant\n * - `--ymt-badge-aura-size` — aura spread radius (default: `3px`)\n \n ### Accessibility\n * Color contrast is handled automatically for each severity/variant combination.\n * Add additional ARIA attributes depending on how the badge is used in your application.\n \n @example\n * ```html\n * <ymt-badge severity=\"success\">Approved</ymt-badge>\n * <ymt-badge severity=\"danger\" [outline]=\"true\">Rejected</ymt-badge>\n * <ymt-badge severity=\"warning\" [aura]=\"true\">Pending</ymt-badge>\n * ```\n /\n@Component({\n selector: 'ymt-badge',\n imports: [],\n template: '<ng-content/>',\n styleUrl: './badge.component.scss',\n host: {\n '[class.success]': 'severity() === \"success\"',\n '[class.danger]': 'severity() === \"danger\"',\n '[class.warning]': 'severity() === \"warning\"',\n '[class.primary]': 'severity() === \"primary\"',\n '[class.neutral]': 'severity() === \"neutral\"',\n '[class.outline]': 'outline()',\n '[class.aura]': 'aura()'\n },\n changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class YmtBadge {\n severity = input<Severity>('neutral');\n outline = input<boolean>(false);\n aura = input<boolean>(false);\n}\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":[],"mappings":";;;AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuCG;MAiBU,QAAQ,CAAA;AACnB,IAAA,QAAQ,GAAG,KAAK,CAAW,SAAS,+EAAC;AACrC,IAAA,OAAO,GAAG,KAAK,CAAU,KAAK,8EAAC;AAC/B,IAAA,IAAI,GAAG,KAAK,CAAU,KAAK,2EAAC;~~uGAHjB~~,QAAQ,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAR,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,~~QAAA~~,EAAA,IAAA,EAAA,QAAQ,8vBAbT,eAAe,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,spEAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA;;~~2FAad~~,QAAQ,EAAA,UAAA,EAAA,CAAA;kBAhBpB,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,WAAW,EAAA,OAAA,EACZ,EAAE,EAAA,QAAA,EACD,eAAe,EAAA,IAAA,EAEnB;AACJ,wBAAA,iBAAiB,EAAE,0BAA0B;AAC7C,wBAAA,gBAAgB,EAAE,yBAAyB;AAC3C,wBAAA,iBAAiB,EAAE,0BAA0B;AAC7C,wBAAA,iBAAiB,EAAE,0BAA0B;AAC7C,wBAAA,iBAAiB,EAAE,0BAA0B;AAC7C,wBAAA,iBAAiB,EAAE,WAAW;AAC9B,wBAAA,cAAc,EAAE;qBACjB,EAAA,eAAA,EACgB,uBAAuB,CAAC,MAAM,EAAA,MAAA,EAAA,CAAA,spEAAA,CAAA,EAAA;;;AC1DjD;;AAEG;;;;"}
1	+ {"version":3,"file":"yuuvis-material-badge.mjs","sources":["../../../../../libs/yuuvis/material/badge/src/badge.component.ts","../../../../../libs/yuuvis/material/badge/src/yuuvis-material-badge.ts"],"sourcesContent":["\nimport { ChangeDetectionStrategy, Component, input } from '@angular/core';\nimport { Severity } from './model/badge.model';\n\n/*\n Badge component to display a label with different severity levels.\n \n ### Severity\n * Controls the color scheme via the `severity` input. Available values:\n * - `neutral` (default) — uses surface container colors\n * - `success` — green tones for positive/confirmed states\n * - `danger` — red tones for errors or destructive indicators\n * - `warning` — yellow/amber tones for caution states\n * - `primary` — theme primary color for informational or branded badges\n \n ### Variants\n * - Filled (default) — solid background with contrasting text color\n * - Outline — transparent background with a colored border, enabled via the `outline` input\n \n ### Aura\n * When `aura` is enabled, the badge renders a soft glowing box-shadow derived from its\n * severity color. In filled mode the aura uses a stronger, fully saturated background;\n * in outline mode it uses a subtle semi-transparent glow.\n \n ### Theming\n * The component exposes CSS custom properties for fine-grained control:\n * - `--ymt-badge-corner` — border radius (default: `--ymt-corner-full`)\n * - `--ymt-badge-background` — fill color\n * - `--ymt-badge-on-background` — text color\n * - `--ymt-badge-outline-color` — border color in outline variant\n * - `--ymt-badge-outline-text-color` — text color in outline variant\n * - `--ymt-badge-aura-size` — aura spread radius (default: `3px`)\n \n ### Accessibility\n * Color contrast is handled automatically for each severity/variant combination.\n * Add additional ARIA attributes depending on how the badge is used in your application.\n \n @example\n * ```html\n * <ymt-badge severity=\"success\">Approved</ymt-badge>\n * <ymt-badge severity=\"danger\" [outline]=\"true\">Rejected</ymt-badge>\n * <ymt-badge severity=\"warning\" [aura]=\"true\">Pending</ymt-badge>\n * ```\n /\n@Component({\n selector: 'ymt-badge',\n imports: [],\n template: '<ng-content/>',\n styleUrl: './badge.component.scss',\n host: {\n '[class.success]': 'severity() === \"success\"',\n '[class.danger]': 'severity() === \"danger\"',\n '[class.warning]': 'severity() === \"warning\"',\n '[class.primary]': 'severity() === \"primary\"',\n '[class.neutral]': 'severity() === \"neutral\"',\n '[class.outline]': 'outline()',\n '[class.aura]': 'aura()'\n },\n changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class YmtBadge {\n severity = input<Severity>('neutral');\n outline = input<boolean>(false);\n aura = input<boolean>(false);\n}\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":[],"mappings":";;;AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuCG;MAiBU,QAAQ,CAAA;AACnB,IAAA,QAAQ,GAAG,KAAK,CAAW,SAAS,+EAAC;AACrC,IAAA,OAAO,GAAG,KAAK,CAAU,KAAK,8EAAC;AAC/B,IAAA,IAAI,GAAG,KAAK,CAAU,KAAK,2EAAC;wGAHjB,QAAQ,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAR,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,QAAQ,8vBAbT,eAAe,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,spEAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA;;4FAad,QAAQ,EAAA,UAAA,EAAA,CAAA;kBAhBpB,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,WAAW,EAAA,OAAA,EACZ,EAAE,EAAA,QAAA,EACD,eAAe,EAAA,IAAA,EAEnB;AACJ,wBAAA,iBAAiB,EAAE,0BAA0B;AAC7C,wBAAA,gBAAgB,EAAE,yBAAyB;AAC3C,wBAAA,iBAAiB,EAAE,0BAA0B;AAC7C,wBAAA,iBAAiB,EAAE,0BAA0B;AAC7C,wBAAA,iBAAiB,EAAE,0BAA0B;AAC7C,wBAAA,iBAAiB,EAAE,WAAW;AAC9B,wBAAA,cAAc,EAAE;qBACjB,EAAA,eAAA,EACgB,uBAAuB,CAAC,MAAM,EAAA,MAAA,EAAA,CAAA,spEAAA,CAAA,EAAA;;;AC1DjD;;AAEG;;;;"}

package/fesm2022/yuuvis-material-layout.mjs CHANGED Viewed

@@ -46,10 +46,10 @@ class AreaCoverDirective {
         coverElement.style.inset = '0';
         return coverElement;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AreaCoverDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.9", type: AreaCoverDirective, isStandalone: true, selector: "[yuvSplitAreaCover]", inputs: { yuvSplitAreaCover: { classPropertyName: "yuvSplitAreaCover", publicName: "yuvSplitAreaCover", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: AreaCoverDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.12", type: AreaCoverDirective, isStandalone: true, selector: "[yuvSplitAreaCover]", inputs: { yuvSplitAreaCover: { classPropertyName: "yuvSplitAreaCover", publicName: "yuvSplitAreaCover", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AreaCoverDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: AreaCoverDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[yuvSplitAreaCover]'
@@ -69,10 +69,10 @@ class YmtLayoutPaneDirective {
     updateSettings(settings) {
         this.areaProperties.set({ ...this.areaProperties(), ...settings });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: YmtLayoutPaneDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.9", type: YmtLayoutPaneDirective, isStandalone: true, selector: "[ymtLayoutPane]", inputs: { role: { classPropertyName: "role", publicName: "role", isSignal: true, isRequired: true, transformFunction: null }, topBarActions: { classPropertyName: "topBarActions", publicName: "topBarActions", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: YmtLayoutPaneDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.12", type: YmtLayoutPaneDirective, isStandalone: true, selector: "[ymtLayoutPane]", inputs: { role: { classPropertyName: "role", publicName: "role", isSignal: true, isRequired: true, transformFunction: null }, topBarActions: { classPropertyName: "topBarActions", publicName: "topBarActions", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: YmtLayoutPaneDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: YmtLayoutPaneDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[ymtLayoutPane]'
@@ -119,10 +119,10 @@ class LayoutService {
             }
         });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: LayoutService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: LayoutService, providedIn: 'root' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: LayoutService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: LayoutService, providedIn: 'root' });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: LayoutService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: LayoutService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
@@ -301,10 +301,10 @@ class MasterDetailsLayoutComponent {
             this.applyLayoutSettings(this.#layoutService.getSettings(lsid));
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: MasterDetailsLayoutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: MasterDetailsLayoutComponent, isStandalone: true, selector: "ymt-master-details-layout", inputs: { layoutSettingsID: { classPropertyName: "layoutSettingsID", publicName: "layoutSettingsID", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, direction: { classPropertyName: "direction", publicName: "direction", isSignal: true, isRequired: false, transformFunction: null }, gutterSize: { classPropertyName: "gutterSize", publicName: "gutterSize", isSignal: true, isRequired: false, transformFunction: null }, detailsActive: { classPropertyName: "detailsActive", publicName: "detailsActive", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { detailsActive: "detailsActiveChange" }, queries: [{ propertyName: "panes", predicate: YmtLayoutPaneDirective, isSignal: true }], viewQueries: [{ propertyName: "masterPaneRef", first: true, predicate: ["masterPane"], descendants: true, isSignal: true }, { propertyName: "detailsPaneRef", first: true, predicate: ["detailsPane"], descendants: true, isSignal: true }, { propertyName: "detailsPaneTemplateRef", first: true, predicate: ["tplDetailsPanel"], descendants: true, isSignal: true }], ngImport: i0, template: "@let mp = _panes().master;\n@let dp = _panes().details;\n@if (!smallScreenLayout()) {\n  <as-split\n    [direction]=\"direction()\"\n    unit=\"percent\"\n    [gutterSize]=\"_gutterSize()\"\n    [gutterStep]=\"1\"\n    [useTransition]=\"false\"\n    (dragStart)=\"onDragStart()\"\n    (dragEnd)=\"onDragEnd($event)\"\n  >\n    @if (gutterSize() === 1) {\n      <div *asSplitGutter=\"let isDragged = isDragged\" class=\"shade-gutter\" [class.dragged]=\"isDragged\">\n        <div\n          class=\"shade-gutter-icon\"\n          [class.vertical]=\"direction() === 'vertical'\"\n          [class.horizontal]=\"direction() === 'horizontal'\"\n        ></div>\n      </div>\n    } @else {\n      <div *asSplitGutter class=\"split-gutter\">\n        <div\n          asSplitGutterDragHandle\n          class=\"split-gutter-handle\"\n          [class.vertical]=\"direction() === 'vertical'\"\n          [class.horizontal]=\"direction() === 'horizontal'\"\n        ></div>\n      </div>\n    }\n\n    <!-- master pane -->\n    @if (mp) {\n      <as-split-area\n        [yuvSplitAreaCover]=\"isDragging()\"\n        [maxSize]=\"mp.areaProperties().maxSize\"\n        [minSize]=\"mp.areaProperties().minSize\"\n        [lockSize]=\"mp.areaProperties().lockSize\"\n        [size]=\"mp.areaProperties().size\"\n        [visible]=\"mp.areaProperties().visible\"\n      >\n        <ymt-pane #masterPane [topBarActions]=\"mp.topBarActions()\" [plain]=\"!!options().plainMode\">\n          <ng-template [ngTemplateOutlet]=\"mp.template\"></ng-template>\n        </ymt-pane>\n      </as-split-area>\n    }\n    <!-- details pane -->\n    @if (dp) {\n      <as-split-area\n        [yuvSplitAreaCover]=\"isDragging()\"\n        [maxSize]=\"dp.areaProperties().maxSize\"\n        [minSize]=\"dp.areaProperties().minSize\"\n        [lockSize]=\"dp.areaProperties().lockSize\"\n        [size]=\"dp.areaProperties().size\"\n        [visible]=\"dp.areaProperties().visible\"\n      >\n        <ymt-pane #detailsPane [topBarActions]=\"dp.topBarActions()\" [plain]=\"!!options().plainMode\">\n          <ng-template [ngTemplateOutlet]=\"dp.template\"></ng-template>\n        </ymt-pane>\n      </as-split-area>\n    }\n  </as-split>\n} @else {\n  <ymt-pane #masterPane [topBarActions]=\"mp.topBarActions()\">\n    <ng-template [ngTemplateOutlet]=\"mp.template\"></ng-template>\n  </ymt-pane>\n}\n\n<ng-template #tplDetailsPanel>\n  <ymt-pane #detailsPane class=\"fullscreen\" [topBarActions]=\"detailsBackAction\">\n    <ng-template [ngTemplateOutlet]=\"dp.template\"></ng-template>\n  </ymt-pane>\n</ng-template>\n\n<ng-template #detailsBackAction>\n  <button align=\"start\" ymt-icon-button icon-button-size=\"small\" (click)=\"detailsActive.set(false)\">\n    <mat-icon>arrow_back</mat-icon>\n  </button>\n  @if (dp.topBarActions(); as dta) {\n    <ng-container *ngTemplateOutlet=\"dta\"></ng-container>\n  }\n</ng-template>\n", styles: [":host{--_split-gutter-background-color: var(--split-gutter-background-color, transparent);--_split-gutter-handle-border-radius: var(--split-gutter-handle-border-radius, 2px);--_split-gutter-handle-width: var(--split-gutter-handle-width, 2px);--_split-gutter-handle-height: var(--split-gutter-handle-height, var(--ymt-spacing-3xl));--_split-gutter-shade-background: var(--split-gutter-shade-background, var(--ymt-outline-variant));--_split-gutter-shade-hover-background: var(--split-gutter-shade-hover-background, currentColor);--_split-gutter-shade-size: var(--split-gutter-shade-size, 16px);overflow:hidden}:host as-split{--as-gutter-background-color: var(--_split-gutter-background-color)}:host .split-gutter{width:100%;height:100%}:host .split-gutter .split-gutter-handle{width:100%;height:100%;display:flex;align-items:center;justify-content:center}:host .split-gutter .split-gutter-handle:after{content:\"\";transition:background-color .3s ease-in-out;background-color:rgb(from var(--ymt-text-color) r g b/.2);display:block;width:var(--_split-gutter-handle-width);height:var(--_split-gutter-handle-height);border-radius:var(--_split-gutter-handle-border-radius)}:host .split-gutter .split-gutter-handle.vertical:after{width:var(--_split-gutter-handle-height);height:var(--_split-gutter-handle-width)}:host .split-gutter:hover .split-gutter-handle:after{background-color:rgb(from var(--ymt-text-color) r g b/.9)}:host .shade-gutter{width:100%;height:100%;background-color:var(--_split-gutter-shade-background);position:relative}:host .shade-gutter-icon{height:100%;width:100%;background-color:var(--_split-gutter-shade-hover-background);transition:opacity .3s;opacity:0;position:absolute;z-index:500}.dragged :host .shade-gutter-icon,:host .shade-gutter-icon:hover{opacity:.1}:host .shade-gutter-icon.horizontal{width:calc(var(--_split-gutter-shade-size) + 1px);inset-inline-start:calc(var(--_split-gutter-shade-size) / -2);inset-inline-end:var(--_split-gutter-shade-size)}:host .shade-gutter-icon.vertical{height:calc(var(--_split-gutter-shade-size) + 1px);inset-block-start:calc(var(--_split-gutter-shade-size) / -2);inset-block-end:var(--_split-gutter-shade-size)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: AngularSplitModule }, { kind: "component", type: i2.SplitComponent, selector: "as-split", inputs: ["gutterSize", "gutterStep", "disabled", "gutterClickDeltaPx", "direction", "dir", "unit", "gutterAriaLabel", "restrictMove", "useTransition", "gutterDblClickDuration"], outputs: ["gutterClick", "gutterDblClick", "dragStart", "dragEnd", "transitionEnd"], exportAs: ["asSplit"] }, { kind: "component", type: i2.SplitAreaComponent, selector: "as-split-area", inputs: ["size", "minSize", "maxSize", "lockSize", "visible"], exportAs: ["asSplitArea"] }, { kind: "directive", type: i2.SplitGutterDirective, selector: "[asSplitGutter]" }, { kind: "directive", type: i2.SplitGutterDragHandleDirective, selector: "[asSplitGutterDragHandle]" }, { kind: "ngmodule", type: YmtPanesModule }, { kind: "component", type: i3.YmtPaneComponent, selector: "ymt-pane", inputs: ["topBarActions", "busy", "noAnimation", "plain"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: YmtIconButtonDirective, selector: "button[ymtIconButton],button[ymt-icon-button],a[ymtIconButton],a[ymt-icon-button]", inputs: ["disabled", "disableRipple", "aria-disabled", "disabledInteractive", "icon-button-size"] }, { kind: "directive", type: AreaCoverDirective, selector: "[yuvSplitAreaCover]", inputs: ["yuvSplitAreaCover"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: MasterDetailsLayoutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: MasterDetailsLayoutComponent, isStandalone: true, selector: "ymt-master-details-layout", inputs: { layoutSettingsID: { classPropertyName: "layoutSettingsID", publicName: "layoutSettingsID", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, direction: { classPropertyName: "direction", publicName: "direction", isSignal: true, isRequired: false, transformFunction: null }, gutterSize: { classPropertyName: "gutterSize", publicName: "gutterSize", isSignal: true, isRequired: false, transformFunction: null }, detailsActive: { classPropertyName: "detailsActive", publicName: "detailsActive", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { detailsActive: "detailsActiveChange" }, queries: [{ propertyName: "panes", predicate: YmtLayoutPaneDirective, isSignal: true }], viewQueries: [{ propertyName: "masterPaneRef", first: true, predicate: ["masterPane"], descendants: true, isSignal: true }, { propertyName: "detailsPaneRef", first: true, predicate: ["detailsPane"], descendants: true, isSignal: true }, { propertyName: "detailsPaneTemplateRef", first: true, predicate: ["tplDetailsPanel"], descendants: true, isSignal: true }], ngImport: i0, template: "@let mp = _panes().master;\n@let dp = _panes().details;\n@if (!smallScreenLayout()) {\n  <as-split\n    [direction]=\"direction()\"\n    unit=\"percent\"\n    [gutterSize]=\"_gutterSize()\"\n    [gutterStep]=\"1\"\n    [useTransition]=\"false\"\n    (dragStart)=\"onDragStart()\"\n    (dragEnd)=\"onDragEnd($event)\"\n  >\n    @if (gutterSize() === 1) {\n      <div *asSplitGutter=\"let isDragged = isDragged\" class=\"shade-gutter\" [class.dragged]=\"isDragged\">\n        <div\n          class=\"shade-gutter-icon\"\n          [class.vertical]=\"direction() === 'vertical'\"\n          [class.horizontal]=\"direction() === 'horizontal'\"\n        ></div>\n      </div>\n    } @else {\n      <div *asSplitGutter class=\"split-gutter\">\n        <div\n          asSplitGutterDragHandle\n          class=\"split-gutter-handle\"\n          [class.vertical]=\"direction() === 'vertical'\"\n          [class.horizontal]=\"direction() === 'horizontal'\"\n        ></div>\n      </div>\n    }\n\n    <!-- master pane -->\n    @if (mp) {\n      <as-split-area\n        [yuvSplitAreaCover]=\"isDragging()\"\n        [maxSize]=\"mp.areaProperties().maxSize\"\n        [minSize]=\"mp.areaProperties().minSize\"\n        [lockSize]=\"mp.areaProperties().lockSize\"\n        [size]=\"mp.areaProperties().size\"\n        [visible]=\"mp.areaProperties().visible\"\n      >\n        <ymt-pane #masterPane [topBarActions]=\"mp.topBarActions()\" [plain]=\"!!options().plainMode\">\n          <ng-template [ngTemplateOutlet]=\"mp.template\"></ng-template>\n        </ymt-pane>\n      </as-split-area>\n    }\n    <!-- details pane -->\n    @if (dp) {\n      <as-split-area\n        [yuvSplitAreaCover]=\"isDragging()\"\n        [maxSize]=\"dp.areaProperties().maxSize\"\n        [minSize]=\"dp.areaProperties().minSize\"\n        [lockSize]=\"dp.areaProperties().lockSize\"\n        [size]=\"dp.areaProperties().size\"\n        [visible]=\"dp.areaProperties().visible\"\n      >\n        <ymt-pane #detailsPane [topBarActions]=\"dp.topBarActions()\" [plain]=\"!!options().plainMode\">\n          <ng-template [ngTemplateOutlet]=\"dp.template\"></ng-template>\n        </ymt-pane>\n      </as-split-area>\n    }\n  </as-split>\n} @else {\n  <ymt-pane #masterPane [topBarActions]=\"mp.topBarActions()\">\n    <ng-template [ngTemplateOutlet]=\"mp.template\"></ng-template>\n  </ymt-pane>\n}\n\n<ng-template #tplDetailsPanel>\n  <ymt-pane #detailsPane class=\"fullscreen\" [topBarActions]=\"detailsBackAction\">\n    <ng-template [ngTemplateOutlet]=\"dp.template\"></ng-template>\n  </ymt-pane>\n</ng-template>\n\n<ng-template #detailsBackAction>\n  <button align=\"start\" ymt-icon-button icon-button-size=\"small\" (click)=\"detailsActive.set(false)\">\n    <mat-icon>arrow_back</mat-icon>\n  </button>\n  @if (dp.topBarActions(); as dta) {\n    <ng-container *ngTemplateOutlet=\"dta\"></ng-container>\n  }\n</ng-template>\n", styles: [":host{--_split-gutter-background-color: var(--split-gutter-background-color, transparent);--_split-gutter-handle-border-radius: var(--split-gutter-handle-border-radius, 2px);--_split-gutter-handle-width: var(--split-gutter-handle-width, 2px);--_split-gutter-handle-height: var(--split-gutter-handle-height, var(--ymt-spacing-3xl));--_split-gutter-shade-background: var(--split-gutter-shade-background, var(--ymt-outline-variant));--_split-gutter-shade-hover-background: var(--split-gutter-shade-hover-background, currentColor);--_split-gutter-shade-size: var(--split-gutter-shade-size, 16px);overflow:hidden}:host as-split{--as-gutter-background-color: var(--_split-gutter-background-color)}:host .split-gutter{width:100%;height:100%}:host .split-gutter .split-gutter-handle{width:100%;height:100%;display:flex;align-items:center;justify-content:center}:host .split-gutter .split-gutter-handle:after{content:\"\";transition:background-color .3s ease-in-out;background-color:rgb(from var(--ymt-text-color) r g b/.2);display:block;width:var(--_split-gutter-handle-width);height:var(--_split-gutter-handle-height);border-radius:var(--_split-gutter-handle-border-radius)}:host .split-gutter .split-gutter-handle.vertical:after{width:var(--_split-gutter-handle-height);height:var(--_split-gutter-handle-width)}:host .split-gutter:hover .split-gutter-handle:after{background-color:rgb(from var(--ymt-text-color) r g b/.9)}:host .shade-gutter{width:100%;height:100%;background-color:var(--_split-gutter-shade-background);position:relative}:host .shade-gutter-icon{height:100%;width:100%;background-color:var(--_split-gutter-shade-hover-background);transition:opacity .3s;opacity:0;position:absolute;z-index:500}.dragged :host .shade-gutter-icon,:host .shade-gutter-icon:hover{opacity:.1}:host .shade-gutter-icon.horizontal{width:calc(var(--_split-gutter-shade-size) + 1px);inset-inline-start:calc(var(--_split-gutter-shade-size) / -2);inset-inline-end:var(--_split-gutter-shade-size)}:host .shade-gutter-icon.vertical{height:calc(var(--_split-gutter-shade-size) + 1px);inset-block-start:calc(var(--_split-gutter-shade-size) / -2);inset-block-end:var(--_split-gutter-shade-size)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: AngularSplitModule }, { kind: "component", type: i2.SplitComponent, selector: "as-split", inputs: ["gutterSize", "gutterStep", "disabled", "gutterClickDeltaPx", "direction", "dir", "unit", "gutterAriaLabel", "restrictMove", "useTransition", "gutterDblClickDuration"], outputs: ["gutterClick", "gutterDblClick", "dragStart", "dragEnd", "transitionEnd"], exportAs: ["asSplit"] }, { kind: "component", type: i2.SplitAreaComponent, selector: "as-split-area", inputs: ["size", "minSize", "maxSize", "lockSize", "visible"], exportAs: ["asSplitArea"] }, { kind: "directive", type: i2.SplitGutterDirective, selector: "[asSplitGutter]" }, { kind: "directive", type: i2.SplitGutterDragHandleDirective, selector: "[asSplitGutterDragHandle]" }, { kind: "ngmodule", type: YmtPanesModule }, { kind: "component", type: i3.YmtPaneComponent, selector: "ymt-pane", inputs: ["topBarActions", "busy", "noAnimation", "plain"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: YmtIconButtonDirective, selector: "button[ymtIconButton],button[ymt-icon-button],a[ymtIconButton],a[ymt-icon-button]", inputs: ["disabled", "disableRipple", "aria-disabled", "disabledInteractive", "icon-button-size"] }, { kind: "directive", type: AreaCoverDirective, selector: "[yuvSplitAreaCover]", inputs: ["yuvSplitAreaCover"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: MasterDetailsLayoutComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: MasterDetailsLayoutComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ymt-master-details-layout', imports: [
                         CommonModule,
@@ -321,11 +321,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
 const cmp = [MasterDetailsLayoutComponent, YmtLayoutPaneDirective];
 class YmtLayoutModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: YmtLayoutModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.9", ngImport: i0, type: YmtLayoutModule, imports: [MasterDetailsLayoutComponent, YmtLayoutPaneDirective], exports: [MasterDetailsLayoutComponent, YmtLayoutPaneDirective] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: YmtLayoutModule, imports: [MasterDetailsLayoutComponent] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: YmtLayoutModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.12", ngImport: i0, type: YmtLayoutModule, imports: [MasterDetailsLayoutComponent, YmtLayoutPaneDirective], exports: [MasterDetailsLayoutComponent, YmtLayoutPaneDirective] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: YmtLayoutModule, imports: [MasterDetailsLayoutComponent] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: YmtLayoutModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: YmtLayoutModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: cmp,

package/fesm2022/yuuvis-material-layout.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"yuuvis-material-layout.mjs","sources":["../../../../../libs/yuuvis/material/layout/src/lib/directives/area-cover.directive.ts","../../../../../libs/yuuvis/material/layout/src/lib/directives/layout-pane.directive.ts","../../../../../libs/yuuvis/material/layout/src/lib/services/layout.service.ts","../../../../../libs/yuuvis/material/layout/src/lib/components/master-details-layout/master-details-layout.component.ts","../../../../../libs/yuuvis/material/layout/src/lib/components/master-details-layout/master-details-layout.component.html","../../../../../libs/yuuvis/material/layout/src/lib/layout.module.ts","../../../../../libs/yuuvis/material/layout/src/yuuvis-material-layout.ts"],"sourcesContent":["import { Directive, effect, ElementRef, inject, input } from '@angular/core';\n\n/*\n TODO: This directive is currently used in the MasterDetailsLayoutComponent to add a cover element during dragging of the split area,\n * to prevent iframes in the panes from capturing the drag events.\n * However, this directive is very generic and can be used in any component that needs to add a cover element during dragging.\n * Therefore, it should be moved to @yuuvis/client-components and then replaced with the SplitAreaCoverDirective from the client-framework/split-view library.\n /\n@Directive({\n selector: '[yuvSplitAreaCover]'\n})\nexport class AreaCoverDirective {\n #elRef = inject(ElementRef);\n\n yuvSplitAreaCover = input<boolean>(false);\n #draggingEffect = effect(() => {\n this.#toggleCover(this.yuvSplitAreaCover());\n });\n\n #coverElement?: HTMLElement;\n\n #toggleCover(active: boolean) {\n const el: HTMLElement = this.#elRef.nativeElement as HTMLElement;\n\n if (this.#coverElement) {\n el.style.position = 'initial';\n this.#coverElement.remove();\n this.#coverElement = undefined;\n }\n if (active) {\n el.style.position = 'relative';\n this.#coverElement = this.#createCoverElement();\n el.append(this.#coverElement);\n }\n }\n\n #createCoverElement(): HTMLElement {\n const coverElement = document.createElement('div');\n coverElement.classList.add('yuv-split-area-cover');\n coverElement.style.position = 'absolute';\n coverElement.style.zIndex = '500';\n coverElement.style.inset = '0';\n return coverElement;\n }\n}\n","import { Directive, inject, input, signal, TemplateRef } from '@angular/core';\nimport { LayoutPaneRole, PaneLayoutSettings } from '../layout.interface';\n\n/\n Directive to mark a layout pane.\n /\n@Directive({\n selector: '[ymtLayoutPane]'\n})\nexport class YmtLayoutPaneDirective {\n template = inject(TemplateRef<unknown>);\n // Role the pane takes in the layout\n role = input.required<LayoutPaneRole>();\n // template holding the actions shown in the top bar of the pane\n topBarActions = input<TemplateRef<unknown>>();\n areaProperties = signal<PaneLayoutSettings>({ visible: true });\n\n updateSettings(settings: PaneLayoutSettings): void {\n this.areaProperties.set({ ...this.areaProperties(), ...settings });\n }\n}\n","import { Injectable } from '@angular/core';\n\n/\n Service to store and retrieve layout settings. Those\n * settings are stored on the users device because in\n * general layout settings like panel widths are highly\n * dependent on the current device.\n /\n@Injectable({\n providedIn: 'root'\n})\nexport class LayoutService {\n #STORAGE_PREFIX = 'ymt.layout:';\n\n DEFAULT_SPLIT_VIEW_GUTTER_SIZE = 16;\n\n saveSettings(key: string, settings: unknown): boolean {\n if (typeof settings === 'object') {\n localStorage.setItem(this.#getKey(key), JSON.stringify(settings));\n return true;\n } else return false;\n }\n\n getSettings(key: string): unknown \| undefined {\n try {\n const v = localStorage.getItem(this.#getKey(key));\n return v ? JSON.parse(v) : undefined;\n } catch (e) {\n console.error('Error while parsing layout settings', e);\n return undefined;\n }\n }\n\n #getKey(key: string) {\n return `${this.#STORAGE_PREFIX}${key}`;\n }\n\n /\n Clears all layout settings.\n /\n clearSettings(): void {\n Object.keys(localStorage).forEach((key) => {\n if (key.startsWith(this.#STORAGE_PREFIX)) {\n localStorage.removeItem(key);\n }\n });\n }\n}\n","import { CommonModule } from '@angular/common';\nimport {\n Component,\n computed,\n contentChildren,\n DestroyRef,\n effect,\n ElementRef,\n inject,\n input,\n model,\n signal,\n TemplateRef,\n untracked,\n viewChild\n} from '@angular/core';\nimport { MatDialog, MatDialogRef } from '@angular/material/dialog';\nimport { MatIconModule } from '@angular/material/icon';\nimport { Router } from '@angular/router';\nimport { DeviceService, YmtIconButtonDirective } from '@yuuvis/material';\nimport { YmtPaneComponent, YmtPanesModule } from '@yuuvis/material/panes';\nimport { AngularSplitModule, SplitAreaSize, SplitDirection } from 'angular-split';\nimport { AreaCoverDirective } from '../../directives/area-cover.directive';\nimport { YmtLayoutPaneDirective } from '../../directives/layout-pane.directive';\nimport {\n LayoutOutputData,\n LayoutSettings,\n MasterDetailsPaneLayoutOptions,\n PaneLayoutSettings\n} from '../../layout.interface';\nimport { LayoutService } from '../../services/layout.service';\n\n@Component({\n selector: 'ymt-master-details-layout',\n imports: [\n CommonModule,\n AngularSplitModule,\n YmtPanesModule,\n MatIconModule,\n YmtIconButtonDirective,\n CommonModule,\n AngularSplitModule,\n YmtPanesModule,\n AreaCoverDirective\n ],\n templateUrl: './master-details-layout.component.html',\n styleUrl: './master-details-layout.component.scss'\n})\nexport class MasterDetailsLayoutComponent {\n #elRef = inject(ElementRef);\n #layoutService = inject(LayoutService);\n #dialog = inject(MatDialog);\n #device = inject(DeviceService);\n #router = inject(Router);\n #dRef = inject(DestroyRef);\n\n #DEFAULT_GUTTER_SIZE_PX = 16;\n\n masterPaneRef = viewChild.required<YmtPaneComponent>('masterPane');\n detailsPaneRef = viewChild.required<YmtPaneComponent>('detailsPane');\n\n isDragging = signal(false);\n\n panes = contentChildren<YmtLayoutPaneDirective>(YmtLayoutPaneDirective);\n _panes = computed<{\n master: YmtLayoutPaneDirective;\n details: YmtLayoutPaneDirective;\n }>(() => {\n const _panes = this.panes();\n const _options = this.options();\n untracked(() => {\n _panes.forEach((p) =>\n p.updateSettings({\n size: _options[`${p.role()}Size` as keyof MasterDetailsPaneLayoutOptions] as SplitAreaSize,\n minSize: _options[`${p.role()}MinSize` as keyof MasterDetailsPaneLayoutOptions] as number,\n maxSize: _options[`${p.role()}MaxSize` as keyof MasterDetailsPaneLayoutOptions] as number\n })\n );\n });\n\n const res = {\n master: _panes.find((p) => p.role() === 'master')!,\n details: _panes.find((p) => p.role() === 'details')!\n };\n if (!res.master \|\| !res.details)\n console.error('Both master and details panes are required in MasterDetailsLayoutComponent');\n return res;\n });\n\n #detailsPaneDialogRef: MatDialogRef<any> \| null = null;\n detailsPaneTemplateRef = viewChild.required<TemplateRef<any>>('tplDetailsPanel');\n\n /\n Setting ID for persisting layout settings. If not set, layout settings won't be persisted.\n /\n layoutSettingsID = input<string \| undefined>(undefined);\n\n options = input<MasterDetailsPaneLayoutOptions>({\n resizable: true\n });\n #optionsEffect = computed(() => {\n const o = this.options();\n // if(o.m)\n });\n\n /\n The split views direction. Could be 'horizontal' or 'vertical'. Defaults to 'horizontal'.\n /\n direction = input<SplitDirection>('horizontal');\n\n /\n Size of the gutter in Pixel.\n /\n gutterSize = input<number>(this.#DEFAULT_GUTTER_SIZE_PX);\n _gutterSize = signal<number>(this.#DEFAULT_GUTTER_SIZE_PX);\n #gutterSizeEffect = effect(() => {\n this._gutterSize.set(this.gutterSize());\n });\n\n /\n Enable/disable details pane (also use as two-way-bound variable: [(detailsActive)])\n /\n detailsActive = model<boolean>(false);\n #detailsActiveEffect = effect(() => {\n const da = this.detailsActive();\n untracked(() => {\n if (this.#detailsPaneDialogRef) this.#detailsPaneDialogRef.close();\n if (this.smallScreenLayout() && da) {\n this.#detailsPaneDialogRef = this.#dialog.open(this.detailsPaneTemplateRef(), {\n width: '100vw',\n height: '100vh',\n maxWidth: '100vw',\n panelClass: 'ymt-dialog-fullscreen'\n });\n this.#detailsPaneDialogRef.afterClosed().subscribe((silent: boolean) => {\n if (!silent) {\n this.detailsActive.set(false);\n }\n this.#detailsPaneDialogRef = null;\n });\n }\n });\n });\n\n smallScreenLayout = this.#device.smallScreenLayout;\n #smallScreenLayoutEffect = effect(() => {\n const ssl = this.smallScreenLayout();\n if (this.#detailsPaneDialogRef) this.#detailsPaneDialogRef.close(true);\n untracked(() => {\n const detailsActive = this.detailsActive();\n if (ssl && detailsActive) this.detailsActive.set(false);\n });\n });\n\n onDragStart(): void {\n this.isDragging.set(true);\n }\n\n onDragEnd(event: LayoutOutputData): void {\n this.#updateLayoutSettings(event.sizes);\n this.isDragging.set(false);\n }\n\n hideArea(role: 'master' \| 'details'): void {\n const pane = this._panes()[role];\n pane.updateSettings({ visible: false });\n }\n\n showArea(role: 'master' \| 'details'): void {\n const pane = this._panes()[role];\n pane.updateSettings({ visible: true });\n }\n\n toggleArea(role: 'master' \| 'details'): void {\n const pane = this._panes()[role];\n pane.updateSettings({ visible: !pane.areaProperties().visible });\n }\n\n isAreaVisible(role: 'master' \| 'details'): boolean {\n const pane = this._panes()[role];\n return pane.areaProperties().visible !== false;\n }\n\n toggleFullscreen(role: 'master' \| 'details'): void {\n const pane = role === 'master' ? this.masterPaneRef() : this.detailsPaneRef();\n if (pane) {\n if (pane.fullscreenActive()) {\n pane.exitFullscreen();\n } else {\n pane.enterFullscreen();\n }\n }\n }\n\n fullscreenActive(role: 'master' \| 'details'): boolean {\n const pane = role === 'master' ? this.masterPaneRef() : this.detailsPaneRef();\n return pane ? pane.fullscreenActive() : false;\n }\n\n #updateLayoutSettings(sizes: SplitAreaSize[]): void {\n const layoutSettings: LayoutSettings = {\n areas: this.panes().map((area: YmtLayoutPaneDirective, idx: number) => ({\n visible: area.areaProperties().visible === false ? false : true,\n size: sizes[idx]\n }))\n };\n // save layout settings if persistence is enabled\n const lsid = this.layoutSettingsID();\n if (lsid) {\n this.#layoutService.saveSettings(lsid, layoutSettings);\n }\n }\n\n #calculateGutterSize() {\n const computedStyle = getComputedStyle(this.#elRef.nativeElement);\n const spacing = computedStyle.getPropertyValue('--ymt-spacing-m').trim();\n const fontSize = parseFloat(computedStyle.fontSize.trim());\n const spacingPx = spacing.endsWith('rem')\n ? parseFloat(spacing) fontSize\n : spacing.endsWith('px')\n ? parseFloat(spacing)\n : this.#DEFAULT_GUTTER_SIZE_PX;\n if (this._gutterSize() === this.#DEFAULT_GUTTER_SIZE_PX) this._gutterSize.set(spacingPx);\n }\n\n applyLayoutSettings(settings: LayoutSettings) {\n if (!this.#isLayoutSettingsObject(settings)) return;\n settings.areas.forEach((a: PaneLayoutSettings, index: number) => {\n this.panes()[index].updateSettings(a);\n });\n }\n\n #isLayoutSettingsObject(v: any): boolean {\n return v && 'areas' in v;\n }\n\n ngAfterViewInit(): void {\n this.#calculateGutterSize();\n // try to load layout settings if persistence is enabled\n const lsid = this.layoutSettingsID();\n if (lsid) {\n this.applyLayoutSettings(this.#layoutService.getSettings(lsid) as LayoutSettings);\n }\n }\n}\n","@let mp = _panes().master;\n@let dp = _panes().details;\n@if (!smallScreenLayout()) {\n <as-split\n [direction]=\"direction()\"\n unit=\"percent\"\n [gutterSize]=\"_gutterSize()\"\n [gutterStep]=\"1\"\n [useTransition]=\"false\"\n (dragStart)=\"onDragStart()\"\n (dragEnd)=\"onDragEnd($event)\"\n >\n @if (gutterSize() === 1) {\n <div asSplitGutter=\"let isDragged = isDragged\" class=\"shade-gutter\" [class.dragged]=\"isDragged\">\n <div\n class=\"shade-gutter-icon\"\n [class.vertical]=\"direction() === 'vertical'\"\n [class.horizontal]=\"direction() === 'horizontal'\"\n ></div>\n </div>\n } @else {\n <div asSplitGutter class=\"split-gutter\">\n <div\n asSplitGutterDragHandle\n class=\"split-gutter-handle\"\n [class.vertical]=\"direction() === 'vertical'\"\n [class.horizontal]=\"direction() === 'horizontal'\"\n ></div>\n </div>\n }\n\n <!-- master pane -->\n @if (mp) {\n <as-split-area\n [yuvSplitAreaCover]=\"isDragging()\"\n [maxSize]=\"mp.areaProperties().maxSize\"\n [minSize]=\"mp.areaProperties().minSize\"\n [lockSize]=\"mp.areaProperties().lockSize\"\n [size]=\"mp.areaProperties().size\"\n [visible]=\"mp.areaProperties().visible\"\n >\n <ymt-pane #masterPane [topBarActions]=\"mp.topBarActions()\" [plain]=\"!!options().plainMode\">\n <ng-template [ngTemplateOutlet]=\"mp.template\"></ng-template>\n </ymt-pane>\n </as-split-area>\n }\n <!-- details pane -->\n @if (dp) {\n <as-split-area\n [yuvSplitAreaCover]=\"isDragging()\"\n [maxSize]=\"dp.areaProperties().maxSize\"\n [minSize]=\"dp.areaProperties().minSize\"\n [lockSize]=\"dp.areaProperties().lockSize\"\n [size]=\"dp.areaProperties().size\"\n [visible]=\"dp.areaProperties().visible\"\n >\n <ymt-pane #detailsPane [topBarActions]=\"dp.topBarActions()\" [plain]=\"!!options().plainMode\">\n <ng-template [ngTemplateOutlet]=\"dp.template\"></ng-template>\n </ymt-pane>\n </as-split-area>\n }\n </as-split>\n} @else {\n <ymt-pane #masterPane [topBarActions]=\"mp.topBarActions()\">\n <ng-template [ngTemplateOutlet]=\"mp.template\"></ng-template>\n </ymt-pane>\n}\n\n<ng-template #tplDetailsPanel>\n <ymt-pane #detailsPane class=\"fullscreen\" [topBarActions]=\"detailsBackAction\">\n <ng-template [ngTemplateOutlet]=\"dp.template\"></ng-template>\n </ymt-pane>\n</ng-template>\n\n<ng-template #detailsBackAction>\n <button align=\"start\" ymt-icon-button icon-button-size=\"small\" (click)=\"detailsActive.set(false)\">\n <mat-icon>arrow_back</mat-icon>\n </button>\n @if (dp.topBarActions(); as dta) {\n <ng-container ngTemplateOutlet=\"dta\"></ng-container>\n }\n</ng-template>\n","import { NgModule } from '@angular/core';\nimport { MasterDetailsLayoutComponent } from './components/master-details-layout/master-details-layout.component';\nimport { YmtLayoutPaneDirective } from './directives/layout-pane.directive';\n\nconst cmp = [MasterDetailsLayoutComponent, YmtLayoutPaneDirective]\n\n@NgModule({\n imports: cmp,\n exports: cmp\n})\nexport class YmtLayoutModule {}\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"yuuvis-material-layout.mjs","sources":["../../../../../libs/yuuvis/material/layout/src/lib/directives/area-cover.directive.ts","../../../../../libs/yuuvis/material/layout/src/lib/directives/layout-pane.directive.ts","../../../../../libs/yuuvis/material/layout/src/lib/services/layout.service.ts","../../../../../libs/yuuvis/material/layout/src/lib/components/master-details-layout/master-details-layout.component.ts","../../../../../libs/yuuvis/material/layout/src/lib/components/master-details-layout/master-details-layout.component.html","../../../../../libs/yuuvis/material/layout/src/lib/layout.module.ts","../../../../../libs/yuuvis/material/layout/src/yuuvis-material-layout.ts"],"sourcesContent":["import { Directive, effect, ElementRef, inject, input } from '@angular/core';\n\n/*\n TODO: This directive is currently used in the MasterDetailsLayoutComponent to add a cover element during dragging of the split area,\n * to prevent iframes in the panes from capturing the drag events.\n * However, this directive is very generic and can be used in any component that needs to add a cover element during dragging.\n * Therefore, it should be moved to @yuuvis/client-components and then replaced with the SplitAreaCoverDirective from the client-framework/split-view library.\n /\n@Directive({\n selector: '[yuvSplitAreaCover]'\n})\nexport class AreaCoverDirective {\n #elRef = inject(ElementRef);\n\n yuvSplitAreaCover = input<boolean>(false);\n #draggingEffect = effect(() => {\n this.#toggleCover(this.yuvSplitAreaCover());\n });\n\n #coverElement?: HTMLElement;\n\n #toggleCover(active: boolean) {\n const el: HTMLElement = this.#elRef.nativeElement as HTMLElement;\n\n if (this.#coverElement) {\n el.style.position = 'initial';\n this.#coverElement.remove();\n this.#coverElement = undefined;\n }\n if (active) {\n el.style.position = 'relative';\n this.#coverElement = this.#createCoverElement();\n el.append(this.#coverElement);\n }\n }\n\n #createCoverElement(): HTMLElement {\n const coverElement = document.createElement('div');\n coverElement.classList.add('yuv-split-area-cover');\n coverElement.style.position = 'absolute';\n coverElement.style.zIndex = '500';\n coverElement.style.inset = '0';\n return coverElement;\n }\n}\n","import { Directive, inject, input, signal, TemplateRef } from '@angular/core';\nimport { LayoutPaneRole, PaneLayoutSettings } from '../layout.interface';\n\n/\n Directive to mark a layout pane.\n /\n@Directive({\n selector: '[ymtLayoutPane]'\n})\nexport class YmtLayoutPaneDirective {\n template = inject(TemplateRef<unknown>);\n // Role the pane takes in the layout\n role = input.required<LayoutPaneRole>();\n // template holding the actions shown in the top bar of the pane\n topBarActions = input<TemplateRef<unknown>>();\n areaProperties = signal<PaneLayoutSettings>({ visible: true });\n\n updateSettings(settings: PaneLayoutSettings): void {\n this.areaProperties.set({ ...this.areaProperties(), ...settings });\n }\n}\n","import { Injectable } from '@angular/core';\n\n/\n Service to store and retrieve layout settings. Those\n * settings are stored on the users device because in\n * general layout settings like panel widths are highly\n * dependent on the current device.\n /\n@Injectable({\n providedIn: 'root'\n})\nexport class LayoutService {\n #STORAGE_PREFIX = 'ymt.layout:';\n\n DEFAULT_SPLIT_VIEW_GUTTER_SIZE = 16;\n\n saveSettings(key: string, settings: unknown): boolean {\n if (typeof settings === 'object') {\n localStorage.setItem(this.#getKey(key), JSON.stringify(settings));\n return true;\n } else return false;\n }\n\n getSettings(key: string): unknown \| undefined {\n try {\n const v = localStorage.getItem(this.#getKey(key));\n return v ? JSON.parse(v) : undefined;\n } catch (e) {\n console.error('Error while parsing layout settings', e);\n return undefined;\n }\n }\n\n #getKey(key: string) {\n return `${this.#STORAGE_PREFIX}${key}`;\n }\n\n /\n Clears all layout settings.\n /\n clearSettings(): void {\n Object.keys(localStorage).forEach((key) => {\n if (key.startsWith(this.#STORAGE_PREFIX)) {\n localStorage.removeItem(key);\n }\n });\n }\n}\n","import { CommonModule } from '@angular/common';\nimport {\n Component,\n computed,\n contentChildren,\n DestroyRef,\n effect,\n ElementRef,\n inject,\n input,\n model,\n signal,\n TemplateRef,\n untracked,\n viewChild\n} from '@angular/core';\nimport { MatDialog, MatDialogRef } from '@angular/material/dialog';\nimport { MatIconModule } from '@angular/material/icon';\nimport { Router } from '@angular/router';\nimport { DeviceService, YmtIconButtonDirective } from '@yuuvis/material';\nimport { YmtPaneComponent, YmtPanesModule } from '@yuuvis/material/panes';\nimport { AngularSplitModule, SplitAreaSize, SplitDirection } from 'angular-split';\nimport { AreaCoverDirective } from '../../directives/area-cover.directive';\nimport { YmtLayoutPaneDirective } from '../../directives/layout-pane.directive';\nimport {\n LayoutOutputData,\n LayoutSettings,\n MasterDetailsPaneLayoutOptions,\n PaneLayoutSettings\n} from '../../layout.interface';\nimport { LayoutService } from '../../services/layout.service';\n\n@Component({\n selector: 'ymt-master-details-layout',\n imports: [\n CommonModule,\n AngularSplitModule,\n YmtPanesModule,\n MatIconModule,\n YmtIconButtonDirective,\n CommonModule,\n AngularSplitModule,\n YmtPanesModule,\n AreaCoverDirective\n ],\n templateUrl: './master-details-layout.component.html',\n styleUrl: './master-details-layout.component.scss'\n})\nexport class MasterDetailsLayoutComponent {\n #elRef = inject(ElementRef);\n #layoutService = inject(LayoutService);\n #dialog = inject(MatDialog);\n #device = inject(DeviceService);\n #router = inject(Router);\n #dRef = inject(DestroyRef);\n\n #DEFAULT_GUTTER_SIZE_PX = 16;\n\n masterPaneRef = viewChild.required<YmtPaneComponent>('masterPane');\n detailsPaneRef = viewChild.required<YmtPaneComponent>('detailsPane');\n\n isDragging = signal(false);\n\n panes = contentChildren<YmtLayoutPaneDirective>(YmtLayoutPaneDirective);\n _panes = computed<{\n master: YmtLayoutPaneDirective;\n details: YmtLayoutPaneDirective;\n }>(() => {\n const _panes = this.panes();\n const _options = this.options();\n untracked(() => {\n _panes.forEach((p) =>\n p.updateSettings({\n size: _options[`${p.role()}Size` as keyof MasterDetailsPaneLayoutOptions] as SplitAreaSize,\n minSize: _options[`${p.role()}MinSize` as keyof MasterDetailsPaneLayoutOptions] as number,\n maxSize: _options[`${p.role()}MaxSize` as keyof MasterDetailsPaneLayoutOptions] as number\n })\n );\n });\n\n const res = {\n master: _panes.find((p) => p.role() === 'master')!,\n details: _panes.find((p) => p.role() === 'details')!\n };\n if (!res.master \|\| !res.details)\n console.error('Both master and details panes are required in MasterDetailsLayoutComponent');\n return res;\n });\n\n #detailsPaneDialogRef: MatDialogRef<any> \| null = null;\n detailsPaneTemplateRef = viewChild.required<TemplateRef<any>>('tplDetailsPanel');\n\n /\n Setting ID for persisting layout settings. If not set, layout settings won't be persisted.\n /\n layoutSettingsID = input<string \| undefined>(undefined);\n\n options = input<MasterDetailsPaneLayoutOptions>({\n resizable: true\n });\n #optionsEffect = computed(() => {\n const o = this.options();\n // if(o.m)\n });\n\n /\n The split views direction. Could be 'horizontal' or 'vertical'. Defaults to 'horizontal'.\n /\n direction = input<SplitDirection>('horizontal');\n\n /\n Size of the gutter in Pixel.\n /\n gutterSize = input<number>(this.#DEFAULT_GUTTER_SIZE_PX);\n _gutterSize = signal<number>(this.#DEFAULT_GUTTER_SIZE_PX);\n #gutterSizeEffect = effect(() => {\n this._gutterSize.set(this.gutterSize());\n });\n\n /\n Enable/disable details pane (also use as two-way-bound variable: [(detailsActive)])\n /\n detailsActive = model<boolean>(false);\n #detailsActiveEffect = effect(() => {\n const da = this.detailsActive();\n untracked(() => {\n if (this.#detailsPaneDialogRef) this.#detailsPaneDialogRef.close();\n if (this.smallScreenLayout() && da) {\n this.#detailsPaneDialogRef = this.#dialog.open(this.detailsPaneTemplateRef(), {\n width: '100vw',\n height: '100vh',\n maxWidth: '100vw',\n panelClass: 'ymt-dialog-fullscreen'\n });\n this.#detailsPaneDialogRef.afterClosed().subscribe((silent: boolean) => {\n if (!silent) {\n this.detailsActive.set(false);\n }\n this.#detailsPaneDialogRef = null;\n });\n }\n });\n });\n\n smallScreenLayout = this.#device.smallScreenLayout;\n #smallScreenLayoutEffect = effect(() => {\n const ssl = this.smallScreenLayout();\n if (this.#detailsPaneDialogRef) this.#detailsPaneDialogRef.close(true);\n untracked(() => {\n const detailsActive = this.detailsActive();\n if (ssl && detailsActive) this.detailsActive.set(false);\n });\n });\n\n onDragStart(): void {\n this.isDragging.set(true);\n }\n\n onDragEnd(event: LayoutOutputData): void {\n this.#updateLayoutSettings(event.sizes);\n this.isDragging.set(false);\n }\n\n hideArea(role: 'master' \| 'details'): void {\n const pane = this._panes()[role];\n pane.updateSettings({ visible: false });\n }\n\n showArea(role: 'master' \| 'details'): void {\n const pane = this._panes()[role];\n pane.updateSettings({ visible: true });\n }\n\n toggleArea(role: 'master' \| 'details'): void {\n const pane = this._panes()[role];\n pane.updateSettings({ visible: !pane.areaProperties().visible });\n }\n\n isAreaVisible(role: 'master' \| 'details'): boolean {\n const pane = this._panes()[role];\n return pane.areaProperties().visible !== false;\n }\n\n toggleFullscreen(role: 'master' \| 'details'): void {\n const pane = role === 'master' ? this.masterPaneRef() : this.detailsPaneRef();\n if (pane) {\n if (pane.fullscreenActive()) {\n pane.exitFullscreen();\n } else {\n pane.enterFullscreen();\n }\n }\n }\n\n fullscreenActive(role: 'master' \| 'details'): boolean {\n const pane = role === 'master' ? this.masterPaneRef() : this.detailsPaneRef();\n return pane ? pane.fullscreenActive() : false;\n }\n\n #updateLayoutSettings(sizes: SplitAreaSize[]): void {\n const layoutSettings: LayoutSettings = {\n areas: this.panes().map((area: YmtLayoutPaneDirective, idx: number) => ({\n visible: area.areaProperties().visible === false ? false : true,\n size: sizes[idx]\n }))\n };\n // save layout settings if persistence is enabled\n const lsid = this.layoutSettingsID();\n if (lsid) {\n this.#layoutService.saveSettings(lsid, layoutSettings);\n }\n }\n\n #calculateGutterSize() {\n const computedStyle = getComputedStyle(this.#elRef.nativeElement);\n const spacing = computedStyle.getPropertyValue('--ymt-spacing-m').trim();\n const fontSize = parseFloat(computedStyle.fontSize.trim());\n const spacingPx = spacing.endsWith('rem')\n ? parseFloat(spacing) fontSize\n : spacing.endsWith('px')\n ? parseFloat(spacing)\n : this.#DEFAULT_GUTTER_SIZE_PX;\n if (this._gutterSize() === this.#DEFAULT_GUTTER_SIZE_PX) this._gutterSize.set(spacingPx);\n }\n\n applyLayoutSettings(settings: LayoutSettings) {\n if (!this.#isLayoutSettingsObject(settings)) return;\n settings.areas.forEach((a: PaneLayoutSettings, index: number) => {\n this.panes()[index].updateSettings(a);\n });\n }\n\n #isLayoutSettingsObject(v: any): boolean {\n return v && 'areas' in v;\n }\n\n ngAfterViewInit(): void {\n this.#calculateGutterSize();\n // try to load layout settings if persistence is enabled\n const lsid = this.layoutSettingsID();\n if (lsid) {\n this.applyLayoutSettings(this.#layoutService.getSettings(lsid) as LayoutSettings);\n }\n }\n}\n","@let mp = _panes().master;\n@let dp = _panes().details;\n@if (!smallScreenLayout()) {\n <as-split\n [direction]=\"direction()\"\n unit=\"percent\"\n [gutterSize]=\"_gutterSize()\"\n [gutterStep]=\"1\"\n [useTransition]=\"false\"\n (dragStart)=\"onDragStart()\"\n (dragEnd)=\"onDragEnd($event)\"\n >\n @if (gutterSize() === 1) {\n <div asSplitGutter=\"let isDragged = isDragged\" class=\"shade-gutter\" [class.dragged]=\"isDragged\">\n <div\n class=\"shade-gutter-icon\"\n [class.vertical]=\"direction() === 'vertical'\"\n [class.horizontal]=\"direction() === 'horizontal'\"\n ></div>\n </div>\n } @else {\n <div asSplitGutter class=\"split-gutter\">\n <div\n asSplitGutterDragHandle\n class=\"split-gutter-handle\"\n [class.vertical]=\"direction() === 'vertical'\"\n [class.horizontal]=\"direction() === 'horizontal'\"\n ></div>\n </div>\n }\n\n <!-- master pane -->\n @if (mp) {\n <as-split-area\n [yuvSplitAreaCover]=\"isDragging()\"\n [maxSize]=\"mp.areaProperties().maxSize\"\n [minSize]=\"mp.areaProperties().minSize\"\n [lockSize]=\"mp.areaProperties().lockSize\"\n [size]=\"mp.areaProperties().size\"\n [visible]=\"mp.areaProperties().visible\"\n >\n <ymt-pane #masterPane [topBarActions]=\"mp.topBarActions()\" [plain]=\"!!options().plainMode\">\n <ng-template [ngTemplateOutlet]=\"mp.template\"></ng-template>\n </ymt-pane>\n </as-split-area>\n }\n <!-- details pane -->\n @if (dp) {\n <as-split-area\n [yuvSplitAreaCover]=\"isDragging()\"\n [maxSize]=\"dp.areaProperties().maxSize\"\n [minSize]=\"dp.areaProperties().minSize\"\n [lockSize]=\"dp.areaProperties().lockSize\"\n [size]=\"dp.areaProperties().size\"\n [visible]=\"dp.areaProperties().visible\"\n >\n <ymt-pane #detailsPane [topBarActions]=\"dp.topBarActions()\" [plain]=\"!!options().plainMode\">\n <ng-template [ngTemplateOutlet]=\"dp.template\"></ng-template>\n </ymt-pane>\n </as-split-area>\n }\n </as-split>\n} @else {\n <ymt-pane #masterPane [topBarActions]=\"mp.topBarActions()\">\n <ng-template [ngTemplateOutlet]=\"mp.template\"></ng-template>\n </ymt-pane>\n}\n\n<ng-template #tplDetailsPanel>\n <ymt-pane #detailsPane class=\"fullscreen\" [topBarActions]=\"detailsBackAction\">\n <ng-template [ngTemplateOutlet]=\"dp.template\"></ng-template>\n </ymt-pane>\n</ng-template>\n\n<ng-template #detailsBackAction>\n <button align=\"start\" ymt-icon-button icon-button-size=\"small\" (click)=\"detailsActive.set(false)\">\n <mat-icon>arrow_back</mat-icon>\n </button>\n @if (dp.topBarActions(); as dta) {\n <ng-container ngTemplateOutlet=\"dta\"></ng-container>\n }\n</ng-template>\n","import { NgModule } from '@angular/core';\nimport { MasterDetailsLayoutComponent } from './components/master-details-layout/master-details-layout.component';\nimport { YmtLayoutPaneDirective } from './directives/layout-pane.directive';\n\nconst cmp = [MasterDetailsLayoutComponent, YmtLayoutPaneDirective]\n\n@NgModule({\n imports: cmp,\n exports: cmp\n})\nexport class YmtLayoutModule {}\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":[],"mappings":";;;;;;;;;;;;;;AAEA;;;;;AAKG;MAIU,kBAAkB,CAAA;AAC7B,IAAA,MAAM,GAAG,MAAM,CAAC,UAAU,CAAC;AAE3B,IAAA,iBAAiB,GAAG,KAAK,CAAU,KAAK,wFAAC;AACzC,IAAA,eAAe,GAAG,MAAM,CAAC,MAAK;QAC5B,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,iBAAiB,EAAE,CAAC;AAC7C,IAAA,CAAC,sFAAC;AAEF,IAAA,aAAa;AAEb,IAAA,YAAY,CAAC,MAAe,EAAA;AAC1B,QAAA,MAAM,EAAE,GAAgB,IAAI,CAAC,MAAM,CAAC,aAA4B;AAEhE,QAAA,IAAI,IAAI,CAAC,aAAa,EAAE;AACtB,YAAA,EAAE,CAAC,KAAK,CAAC,QAAQ,GAAG,SAAS;AAC7B,YAAA,IAAI,CAAC,aAAa,CAAC,MAAM,EAAE;AAC3B,YAAA,IAAI,CAAC,aAAa,GAAG,SAAS;QAChC;QACA,IAAI,MAAM,EAAE;AACV,YAAA,EAAE,CAAC,KAAK,CAAC,QAAQ,GAAG,UAAU;AAC9B,YAAA,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,mBAAmB,EAAE;AAC/C,YAAA,EAAE,CAAC,MAAM,CAAC,IAAI,CAAC,aAAa,CAAC;QAC/B;IACF;IAEA,mBAAmB,GAAA;QACjB,MAAM,YAAY,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC;AAClD,QAAA,YAAY,CAAC,SAAS,CAAC,GAAG,CAAC,sBAAsB,CAAC;AAClD,QAAA,YAAY,CAAC,KAAK,CAAC,QAAQ,GAAG,UAAU;AACxC,QAAA,YAAY,CAAC,KAAK,CAAC,MAAM,GAAG,KAAK;AACjC,QAAA,YAAY,CAAC,KAAK,CAAC,KAAK,GAAG,GAAG;AAC9B,QAAA,OAAO,YAAY;IACrB;wGAhCW,kBAAkB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;4FAAlB,kBAAkB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,qBAAA,EAAA,MAAA,EAAA,EAAA,iBAAA,EAAA,EAAA,iBAAA,EAAA,mBAAA,EAAA,UAAA,EAAA,mBAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;4FAAlB,kBAAkB,EAAA,UAAA,EAAA,CAAA;kBAH9B,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE;AACX,iBAAA;;;ACPD;;AAEG;MAIU,sBAAsB,CAAA;AACjC,IAAA,QAAQ,GAAG,MAAM,EAAC,WAAoB,EAAC;;AAEvC,IAAA,IAAI,GAAG,KAAK,CAAC,QAAQ,0EAAkB;;IAEvC,aAAa,GAAG,KAAK,CAAA,IAAA,SAAA,GAAA,CAAA,SAAA,EAAA,EAAA,SAAA,EAAA,eAAA,EAAA,CAAA,8BAAA,EAAA,CAAA,CAAwB;IAC7C,cAAc,GAAG,MAAM,CAAqB,EAAE,OAAO,EAAE,IAAI,EAAE,EAAA,IAAA,SAAA,GAAA,CAAA,EAAA,SAAA,EAAA,gBAAA,EAAA,CAAA,8BAAA,EAAA,CAAA,CAAC;AAE9D,IAAA,cAAc,CAAC,QAA4B,EAAA;AACzC,QAAA,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,EAAE,GAAG,IAAI,CAAC,cAAc,EAAE,EAAE,GAAG,QAAQ,EAAE,CAAC;IACpE;wGAVW,sBAAsB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;4FAAtB,sBAAsB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,EAAA,IAAA,EAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,UAAA,EAAA,MAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,aAAA,EAAA,EAAA,iBAAA,EAAA,eAAA,EAAA,UAAA,EAAA,eAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;4FAAtB,sBAAsB,EAAA,UAAA,EAAA,CAAA;kBAHlC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE;AACX,iBAAA;;;ACND;;;;;AAKG;MAIU,aAAa,CAAA;IACxB,eAAe,GAAG,aAAa;IAE/B,8BAA8B,GAAG,EAAE;IAEnC,YAAY,CAAC,GAAW,EAAE,QAAiB,EAAA;AACzC,QAAA,IAAI,OAAO,QAAQ,KAAK,QAAQ,EAAE;AAChC,YAAA,YAAY,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,EAAE,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC;AACjE,YAAA,OAAO,IAAI;QACb;;AAAO,YAAA,OAAO,KAAK;IACrB;AAEA,IAAA,WAAW,CAAC,GAAW,EAAA;AACrB,QAAA,IAAI;AACF,YAAA,MAAM,CAAC,GAAG,YAAY,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC;AACjD,YAAA,OAAO,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,SAAS;QACtC;QAAE,OAAO,CAAC,EAAE;AACV,YAAA,OAAO,CAAC,KAAK,CAAC,qCAAqC,EAAE,CAAC,CAAC;AACvD,YAAA,OAAO,SAAS;QAClB;IACF;AAEA,IAAA,OAAO,CAAC,GAAW,EAAA;AACjB,QAAA,OAAO,GAAG,IAAI,CAAC,eAAe,CAAA,EAAG,GAAG,EAAE;IACxC;AAEA;;AAEG;IACH,aAAa,GAAA;QACX,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,OAAO,CAAC,CAAC,GAAG,KAAI;YACxC,IAAI,GAAG,CAAC,UAAU,CAAC,IAAI,CAAC,eAAe,CAAC,EAAE;AACxC,gBAAA,YAAY,CAAC,UAAU,CAAC,GAAG,CAAC;YAC9B;AACF,QAAA,CAAC,CAAC;IACJ;wGAnCW,aAAa,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,UAAA,EAAA,CAAA;AAAb,IAAA,OAAA,KAAA,GAAA,EAAA,CAAA,qBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,aAAa,cAFZ,MAAM,EAAA,CAAA;;4FAEP,aAAa,EAAA,UAAA,EAAA,CAAA;kBAHzB,UAAU;AAAC,YAAA,IAAA,EAAA,CAAA;AACV,oBAAA,UAAU,EAAE;AACb,iBAAA;;;MCsCY,4BAA4B,CAAA;AACvC,IAAA,MAAM,GAAG,MAAM,CAAC,UAAU,CAAC;AAC3B,IAAA,cAAc,GAAG,MAAM,CAAC,aAAa,CAAC;AACtC,IAAA,OAAO,GAAG,MAAM,CAAC,SAAS,CAAC;AAC3B,IAAA,OAAO,GAAG,MAAM,CAAC,aAAa,CAAC;AAC/B,IAAA,OAAO,GAAG,MAAM,CAAC,MAAM,CAAC;AACxB,IAAA,KAAK,GAAG,MAAM,CAAC,UAAU,CAAC;IAE1B,uBAAuB,GAAG,EAAE;AAE5B,IAAA,aAAa,GAAG,SAAS,CAAC,QAAQ,CAAmB,YAAY,CAAC;AAClE,IAAA,cAAc,GAAG,SAAS,CAAC,QAAQ,CAAmB,aAAa,CAAC;AAEpE,IAAA,UAAU,GAAG,MAAM,CAAC,KAAK,iFAAC;AAE1B,IAAA,KAAK,GAAG,eAAe,CAAyB,sBAAsB,4EAAC;AACvE,IAAA,MAAM,GAAG,QAAQ,CAGd,MAAK;AACN,QAAA,MAAM,MAAM,GAAG,IAAI,CAAC,KAAK,EAAE;AAC3B,QAAA,MAAM,QAAQ,GAAG,IAAI,CAAC,OAAO,EAAE;QAC/B,SAAS,CAAC,MAAK;YACb,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,KACf,CAAC,CAAC,cAAc,CAAC;gBACf,IAAI,EAAE,QAAQ,CAAC,CAAA,EAAG,CAAC,CAAC,IAAI,EAAE,CAAA,IAAA,CAA8C,CAAkB;gBAC1F,OAAO,EAAE,QAAQ,CAAC,CAAA,EAAG,CAAC,CAAC,IAAI,EAAE,CAAA,OAAA,CAAiD,CAAW;gBACzF,OAAO,EAAE,QAAQ,CAAC,CAAA,EAAG,CAAC,CAAC,IAAI,EAAE,CAAA,OAAA,CAAiD;AAC/E,aAAA,CAAC,CACH;AACH,QAAA,CAAC,CAAC;AAEF,QAAA,MAAM,GAAG,GAAG;AACV,YAAA,MAAM,EAAE,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,IAAI,EAAE,KAAK,QAAQ,CAAE;AAClD,YAAA,OAAO,EAAE,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,IAAI,EAAE,KAAK,SAAS;SACnD;QACD,IAAI,CAAC,GAAG,CAAC,MAAM,IAAI,CAAC,GAAG,CAAC,OAAO;AAC7B,YAAA,OAAO,CAAC,KAAK,CAAC,4EAA4E,CAAC;AAC7F,QAAA,OAAO,GAAG;AACZ,IAAA,CAAC,6EAAC;IAEF,qBAAqB,GAA6B,IAAI;AACtD,IAAA,sBAAsB,GAAG,SAAS,CAAC,QAAQ,CAAmB,iBAAiB,CAAC;AAEhF;;AAEG;AACH,IAAA,gBAAgB,GAAG,KAAK,CAAqB,SAAS,uFAAC;IAEvD,OAAO,GAAG,KAAK,CAAiC;AAC9C,QAAA,SAAS,EAAE;AACZ,KAAA,EAAA,IAAA,SAAA,GAAA,CAAA,EAAA,SAAA,EAAA,SAAA,EAAA,CAAA,8BAAA,EAAA,CAAA,CAAC;AACF,IAAA,cAAc,GAAG,QAAQ,CAAC,MAAK;AAC7B,QAAA,MAAM,CAAC,GAAG,IAAI,CAAC,OAAO,EAAE;;AAE1B,IAAA,CAAC,qFAAC;AAEF;;AAEG;AACH,IAAA,SAAS,GAAG,KAAK,CAAiB,YAAY,gFAAC;AAE/C;;AAEG;AACH,IAAA,UAAU,GAAG,KAAK,CAAS,IAAI,CAAC,uBAAuB,iFAAC;AACxD,IAAA,WAAW,GAAG,MAAM,CAAS,IAAI,CAAC,uBAAuB,kFAAC;AAC1D,IAAA,iBAAiB,GAAG,MAAM,CAAC,MAAK;QAC9B,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,IAAI,CAAC,UAAU,EAAE,CAAC;AACzC,IAAA,CAAC,wFAAC;AAEF;;AAEG;AACH,IAAA,aAAa,GAAG,KAAK,CAAU,KAAK,oFAAC;AACrC,IAAA,oBAAoB,GAAG,MAAM,CAAC,MAAK;AACjC,QAAA,MAAM,EAAE,GAAG,IAAI,CAAC,aAAa,EAAE;QAC/B,SAAS,CAAC,MAAK;YACb,IAAI,IAAI,CAAC,qBAAqB;AAAE,gBAAA,IAAI,CAAC,qBAAqB,CAAC,KAAK,EAAE;AAClE,YAAA,IAAI,IAAI,CAAC,iBAAiB,EAAE,IAAI,EAAE,EAAE;AAClC,gBAAA,IAAI,CAAC,qBAAqB,GAAG,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,sBAAsB,EAAE,EAAE;AAC5E,oBAAA,KAAK,EAAE,OAAO;AACd,oBAAA,MAAM,EAAE,OAAO;AACf,oBAAA,QAAQ,EAAE,OAAO;AACjB,oBAAA,UAAU,EAAE;AACb,iBAAA,CAAC;gBACF,IAAI,CAAC,qBAAqB,CAAC,WAAW,EAAE,CAAC,SAAS,CAAC,CAAC,MAAe,KAAI;oBACrE,IAAI,CAAC,MAAM,EAAE;AACX,wBAAA,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,KAAK,CAAC;oBAC/B;AACA,oBAAA,IAAI,CAAC,qBAAqB,GAAG,IAAI;AACnC,gBAAA,CAAC,CAAC;YACJ;AACF,QAAA,CAAC,CAAC;AACJ,IAAA,CAAC,2FAAC;AAEF,IAAA,iBAAiB,GAAG,IAAI,CAAC,OAAO,CAAC,iBAAiB;AAClD,IAAA,wBAAwB,GAAG,MAAM,CAAC,MAAK;AACrC,QAAA,MAAM,GAAG,GAAG,IAAI,CAAC,iBAAiB,EAAE;QACpC,IAAI,IAAI,CAAC,qBAAqB;AAAE,YAAA,IAAI,CAAC,qBAAqB,CAAC,KAAK,CAAC,IAAI,CAAC;QACtE,SAAS,CAAC,MAAK;AACb,YAAA,MAAM,aAAa,GAAG,IAAI,CAAC,aAAa,EAAE;YAC1C,IAAI,GAAG,IAAI,aAAa;AAAE,gBAAA,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,KAAK,CAAC;AACzD,QAAA,CAAC,CAAC;AACJ,IAAA,CAAC,+FAAC;IAEF,WAAW,GAAA;AACT,QAAA,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,IAAI,CAAC;IAC3B;AAEA,IAAA,SAAS,CAAC,KAAuB,EAAA;AAC/B,QAAA,IAAI,CAAC,qBAAqB,CAAC,KAAK,CAAC,KAAK,CAAC;AACvC,QAAA,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,KAAK,CAAC;IAC5B;AAEA,IAAA,QAAQ,CAAC,IAA0B,EAAA;QACjC,MAAM,IAAI,GAAG,IAAI,CAAC,MAAM,EAAE,CAAC,IAAI,CAAC;QAChC,IAAI,CAAC,cAAc,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC;IACzC;AAEA,IAAA,QAAQ,CAAC,IAA0B,EAAA;QACjC,MAAM,IAAI,GAAG,IAAI,CAAC,MAAM,EAAE,CAAC,IAAI,CAAC;QAChC,IAAI,CAAC,cAAc,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;IACxC;AAEA,IAAA,UAAU,CAAC,IAA0B,EAAA;QACnC,MAAM,IAAI,GAAG,IAAI,CAAC,MAAM,EAAE,CAAC,IAAI,CAAC;AAChC,QAAA,IAAI,CAAC,cAAc,CAAC,EAAE,OAAO,EAAE,CAAC,IAAI,CAAC,cAAc,EAAE,CAAC,OAAO,EAAE,CAAC;IAClE;AAEA,IAAA,aAAa,CAAC,IAA0B,EAAA;QACtC,MAAM,IAAI,GAAG,IAAI,CAAC,MAAM,EAAE,CAAC,IAAI,CAAC;QAChC,OAAO,IAAI,CAAC,cAAc,EAAE,CAAC,OAAO,KAAK,KAAK;IAChD;AAEA,IAAA,gBAAgB,CAAC,IAA0B,EAAA;AACzC,QAAA,MAAM,IAAI,GAAG,IAAI,KAAK,QAAQ,GAAG,IAAI,CAAC,aAAa,EAAE,GAAG,IAAI,CAAC,cAAc,EAAE;QAC7E,IAAI,IAAI,EAAE;AACR,YAAA,IAAI,IAAI,CAAC,gBAAgB,EAAE,EAAE;gBAC3B,IAAI,CAAC,cAAc,EAAE;YACvB;iBAAO;gBACL,IAAI,CAAC,eAAe,EAAE;YACxB;QACF;IACF;AAEA,IAAA,gBAAgB,CAAC,IAA0B,EAAA;AACzC,QAAA,MAAM,IAAI,GAAG,IAAI,KAAK,QAAQ,GAAG,IAAI,CAAC,aAAa,EAAE,GAAG,IAAI,CAAC,cAAc,EAAE;AAC7E,QAAA,OAAO,IAAI,GAAG,IAAI,CAAC,gBAAgB,EAAE,GAAG,KAAK;IAC/C;AAEA,IAAA,qBAAqB,CAAC,KAAsB,EAAA;AAC1C,QAAA,MAAM,cAAc,GAAmB;AACrC,YAAA,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,CAAC,GAAG,CAAC,CAAC,IAA4B,EAAE,GAAW,MAAM;AACtE,gBAAA,OAAO,EAAE,IAAI,CAAC,cAAc,EAAE,CAAC,OAAO,KAAK,KAAK,GAAG,KAAK,GAAG,IAAI;AAC/D,gBAAA,IAAI,EAAE,KAAK,CAAC,GAAG;AAChB,aAAA,CAAC;SACH;;AAED,QAAA,MAAM,IAAI,GAAG,IAAI,CAAC,gBAAgB,EAAE;QACpC,IAAI,IAAI,EAAE;YACR,IAAI,CAAC,cAAc,CAAC,YAAY,CAAC,IAAI,EAAE,cAAc,CAAC;QACxD;IACF;IAEA,oBAAoB,GAAA;QAClB,MAAM,aAAa,GAAG,gBAAgB,CAAC,IAAI,CAAC,MAAM,CAAC,aAAa,CAAC;QACjE,MAAM,OAAO,GAAG,aAAa,CAAC,gBAAgB,CAAC,iBAAiB,CAAC,CAAC,IAAI,EAAE;QACxE,MAAM,QAAQ,GAAG,UAAU,CAAC,aAAa,CAAC,QAAQ,CAAC,IAAI,EAAE,CAAC;AAC1D,QAAA,MAAM,SAAS,GAAG,OAAO,CAAC,QAAQ,CAAC,KAAK;AACtC,cAAE,UAAU,CAAC,OAAO,CAAC,GAAG;AACxB,cAAE,OAAO,CAAC,QAAQ,CAAC,IAAI;AACrB,kBAAE,UAAU,CAAC,OAAO;AACpB,kBAAE,IAAI,CAAC,uBAAuB;AAClC,QAAA,IAAI,IAAI,CAAC,WAAW,EAAE,KAAK,IAAI,CAAC,uBAAuB;AAAE,YAAA,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,SAAS,CAAC;IAC1F;AAEA,IAAA,mBAAmB,CAAC,QAAwB,EAAA;AAC1C,QAAA,IAAI,CAAC,IAAI,CAAC,uBAAuB,CAAC,QAAQ,CAAC;YAAE;QAC7C,QAAQ,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAqB,EAAE,KAAa,KAAI;YAC9D,IAAI,CAAC,KAAK,EAAE,CAAC,KAAK,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC;AACvC,QAAA,CAAC,CAAC;IACJ;AAEA,IAAA,uBAAuB,CAAC,CAAM,EAAA;AAC5B,QAAA,OAAO,CAAC,IAAI,OAAO,IAAI,CAAC;IAC1B;IAEA,eAAe,GAAA;QACb,IAAI,CAAC,oBAAoB,EAAE;;AAE3B,QAAA,MAAM,IAAI,GAAG,IAAI,CAAC,gBAAgB,EAAE;QACpC,IAAI,IAAI,EAAE;AACR,YAAA,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,cAAc,CAAC,WAAW,CAAC,IAAI,CAAmB,CAAC;QACnF;IACF;wGAnMW,4BAA4B,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAA5B,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,4BAA4B,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,2BAAA,EAAA,MAAA,EAAA,EAAA,gBAAA,EAAA,EAAA,iBAAA,EAAA,kBAAA,EAAA,UAAA,EAAA,kBAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,OAAA,EAAA,EAAA,iBAAA,EAAA,SAAA,EAAA,UAAA,EAAA,SAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,UAAA,EAAA,WAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,iBAAA,EAAA,YAAA,EAAA,UAAA,EAAA,YAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,aAAA,EAAA,EAAA,iBAAA,EAAA,eAAA,EAAA,UAAA,EAAA,eAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,OAAA,EAAA,EAAA,aAAA,EAAA,qBAAA,EAAA,EAAA,OAAA,EAAA,CAAA,EAAA,YAAA,EAAA,OAAA,EAAA,SAAA,EAeS,sBAAsB,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,WAAA,EAAA,CAAA,EAAA,YAAA,EAAA,eAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EAAA,CAAA,YAAA,CAAA,EAAA,WAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,EAAA,EAAA,YAAA,EAAA,gBAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EAAA,CAAA,aAAA,CAAA,EAAA,WAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,EAAA,EAAA,YAAA,EAAA,wBAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EAAA,CAAA,iBAAA,CAAA,EAAA,WAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EC/DxE,01FAkFA,srED/CI,YAAY,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,gBAAA,EAAA,QAAA,EAAA,oBAAA,EAAA,MAAA,EAAA,CAAA,yBAAA,EAAA,kBAAA,EAAA,0BAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EACZ,kBAAkB,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,cAAA,EAAA,QAAA,EAAA,UAAA,EAAA,MAAA,EAAA,CAAA,YAAA,EAAA,YAAA,EAAA,UAAA,EAAA,oBAAA,EAAA,WAAA,EAAA,KAAA,EAAA,MAAA,EAAA,iBAAA,EAAA,cAAA,EAAA,eAAA,EAAA,wBAAA,CAAA,EAAA,OAAA,EAAA,CAAA,aAAA,EAAA,gBAAA,EAAA,WAAA,EAAA,SAAA,EAAA,eAAA,CAAA,EAAA,QAAA,EAAA,CAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,kBAAA,EAAA,QAAA,EAAA,eAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,SAAA,EAAA,SAAA,EAAA,UAAA,EAAA,SAAA,CAAA,EAAA,QAAA,EAAA,CAAA,aAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,oBAAA,EAAA,QAAA,EAAA,iBAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,8BAAA,EAAA,QAAA,EAAA,2BAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAClB,cAAc,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,gBAAA,EAAA,QAAA,EAAA,UAAA,EAAA,MAAA,EAAA,CAAA,eAAA,EAAA,MAAA,EAAA,aAAA,EAAA,OAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EACd,aAAa,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,UAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,SAAA,EAAA,SAAA,EAAA,UAAA,CAAA,EAAA,QAAA,EAAA,CAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACb,sBAAsB,iOAItB,kBAAkB,EAAA,QAAA,EAAA,qBAAA,EAAA,MAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,CAAA,EAAA,CAAA;;4FAKT,4BAA4B,EAAA,UAAA,EAAA,CAAA;kBAhBxC,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,2BAA2B,EAAA,OAAA,EAC5B;wBACP,YAAY;wBACZ,kBAAkB;wBAClB,cAAc;wBACd,aAAa;wBACb,sBAAsB;wBACtB,YAAY;wBACZ,kBAAkB;wBAClB,cAAc;wBACd;AACD,qBAAA,EAAA,QAAA,EAAA,01FAAA,EAAA,MAAA,EAAA,CAAA,+nEAAA,CAAA,EAAA;AAcoD,SAAA,CAAA,EAAA,cAAA,EAAA,EAAA,aAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,SAAA,EAAA,IAAA,EAAA,CAAA,YAAY,EAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,CAAA,EAAA,cAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,SAAA,EAAA,IAAA,EAAA,CACX,aAAa,EAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,CAAA,EAAA,KAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,eAAA,EAAA,IAAA,EAAA,CAAA,EAAA,CAAA,UAAA,CAAA,MAInB,sBAAsB,iFA2BR,iBAAiB,EAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,CAAA,EAAA,gBAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,KAAA,EAAA,kBAAA,EAAA,QAAA,EAAA,KAAA,EAAA,CAAA,EAAA,CAAA,EAAA,OAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,KAAA,EAAA,SAAA,EAAA,QAAA,EAAA,KAAA,EAAA,CAAA,EAAA,CAAA,EAAA,SAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,KAAA,EAAA,WAAA,EAAA,QAAA,EAAA,KAAA,EAAA,CAAA,EAAA,CAAA,EAAA,UAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,KAAA,EAAA,YAAA,EAAA,QAAA,EAAA,KAAA,EAAA,CAAA,EAAA,CAAA,EAAA,aAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,KAAA,EAAA,eAAA,EAAA,QAAA,EAAA,KAAA,EAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,CAAA,MAAA,EAAA,IAAA,EAAA,CAAA,qBAAA,CAAA,EAAA,CAAA,EAAA,EAAA,CAAA;;AEtFjF,MAAM,GAAG,GAAG,CAAC,4BAA4B,EAAE,sBAAsB,CAAC;MAMrD,eAAe,CAAA;wGAAf,eAAe,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA;AAAf,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,eAAe,YANf,4BAA4B,EAAE,sBAAsB,CAAA,EAAA,OAAA,EAAA,CAApD,4BAA4B,EAAE,sBAAsB,CAAA,EAAA,CAAA;AAMpD,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,eAAe,YANf,4BAA4B,CAAA,EAAA,CAAA;;4FAM5B,eAAe,EAAA,UAAA,EAAA,CAAA;kBAJ3B,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;AACR,oBAAA,OAAO,EAAE,GAAG;AACZ,oBAAA,OAAO,EAAE;AACV,iBAAA;;;ACTD;;AAEG;;;;"}

package/fesm2022/yuuvis-material-panes.mjs CHANGED Viewed

@@ -6,19 +6,19 @@ import * as i2 from '@angular/material/icon';
 import { MatIconModule } from '@angular/material/icon';
 class YmtPaneAsideComponent {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: YmtPaneAsideComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.9", type: YmtPaneAsideComponent, isStandalone: true, selector: "ymt-pane-aside", ngImport: i0, template: "<p>pane-aside works!</p>\n", styles: [""] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: YmtPaneAsideComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.12", type: YmtPaneAsideComponent, isStandalone: true, selector: "ymt-pane-aside", ngImport: i0, template: "<p>pane-aside works!</p>\n", styles: [""] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: YmtPaneAsideComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: YmtPaneAsideComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ymt-pane-aside', imports: [], template: "<p>pane-aside works!</p>\n" }]
         }] });
 class YmtPaneBodyComponent {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: YmtPaneBodyComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.9", type: YmtPaneBodyComponent, isStandalone: true, selector: "ymt-pane-body", ngImport: i0, template: "<ng-content></ng-content>\n", styles: [":host{display:block}\n"] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: YmtPaneBodyComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.12", type: YmtPaneBodyComponent, isStandalone: true, selector: "ymt-pane-body", ngImport: i0, template: "<ng-content></ng-content>\n", styles: [":host{display:block}\n"] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: YmtPaneBodyComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: YmtPaneBodyComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ymt-pane-body', imports: [], template: "<ng-content></ng-content>\n", styles: [":host{display:block}\n"] }]
         }] });
@@ -92,10 +92,10 @@ class YmtPaneHeaderComponent {
     titleSlot = contentChild('yuvPaneHeaderTitle', ...(ngDevMode ? [{ debugName: "titleSlot" }] : /* istanbul ignore next */ []));
     /** Content child template for rich subtitle content. Takes precedence over the `subtitle` input. */
     subtitleSlot = contentChild('yuvPaneHeaderSubtitle', ...(ngDevMode ? [{ debugName: "subtitleSlot" }] : /* istanbul ignore next */ []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: YmtPaneHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: YmtPaneHeaderComponent, isStandalone: true, selector: "ymt-pane-header", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, subtitle: { classPropertyName: "subtitle", publicName: "subtitle", isSignal: true, isRequired: false, transformFunction: null }, actions: { classPropertyName: "actions", publicName: "actions", isSignal: true, isRequired: false, transformFunction: null }, badges: { classPropertyName: "badges", publicName: "badges", isSignal: true, isRequired: false, transformFunction: null } }, queries: [{ propertyName: "titleSlot", first: true, predicate: ["yuvPaneHeaderTitle"], descendants: true, isSignal: true }, { propertyName: "subtitleSlot", first: true, predicate: ["yuvPaneHeaderSubtitle"], descendants: true, isSignal: true }], ngImport: i0, template: "<header>\n  @if (icon()) {\n    <div class=\"icon\" aria-hidden=\"true\">\n      <mat-icon class=\"pane-icon\">{{ icon() }}</mat-icon>\n    </div>\n  }\n  <!-- top row (title and actions) -->\n  <div class=\"row title-row\">\n    <h2>\n      @let ts = titleSlot();\n      @if (ts) {\n        <ng-container *ngTemplateOutlet=\"ts\" />\n      } @else {\n        {{ title() }}\n      }\n    </h2>\n    @let a = actions();\n    @if (a) {\n      <div class=\"actions\">\n        <ng-container *ngTemplateOutlet=\"a\" />\n      </div>\n    }\n  </div>\n\n  <!-- bottom row (subtitle and badges) -->\n  <div class=\"row subtitle-row\">\n    <small>\n      @let ss = subtitleSlot();\n      @if (ss) {\n        <ng-container *ngTemplateOutlet=\"ss\" />\n      } @else {\n        {{ subtitle() }}\n      }\n    </small>\n    @let b = badges();\n    @if (b) {\n      <div class=\"badges\">\n        <ng-container *ngTemplateOutlet=\"b\" />\n      </div>\n    }\n  </div>\n</header>\n", styles: [":host{--_header-padding: var(--header-padding, var(--ymt-spacing-xl));--_header-background: var(--header-background, transparent);--_header-border-color: var(--header-border-color, transparent);--_header-icon-background: var(--header-icon-background, var(--ymt-surface-container-high));overflow:hidden}:host header{display:grid;align-items:center;grid-template-columns:var(--_header-padding) auto 1fr calc(var(--_header-padding) / 2);grid-template-rows:auto auto var(--_header-padding);grid-template-areas:\". icon titleRow .\" \". icon subtitleRow .\" \". . . .\";flex:0 0 auto;background-color:var(--_header-background);border-block-end:1px solid var(--_header-border-color)}:host header .row{display:flex;flex-flow:row nowrap;align-items:center;min-width:0}:host header .title-row{grid-area:titleRow}:host header .subtitle-row{grid-area:subtitleRow}:host header .icon{grid-area:icon;align-items:center;margin-inline-end:var(--ymt-spacing-m);background-color:var(--_header-icon-background);border-radius:0 0 var(--ymt-corner-s) var(--ymt-corner-s);height:100%;width:var(--ymt-sizing-3xl);display:flex;padding-block-start:calc(var(--_header-padding) + 2px);padding-block-end:var(--ymt-spacing-xs);align-items:start;justify-content:center}:host header h2{flex:1;margin:0;padding:var(--_header-padding) 0 0 0;font:var(--ymt-font-title-large);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-self:end}:host header small{flex:1;font:var(--ymt-font-body-subtle-font);font-weight:var(--ymt-font-body-subtle-weight);color:var(--ymt-on-surface-type-subtle);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-self:start}:host header .actions{grid-area:actions;display:flex;align-items:center;justify-content:end;gap:var(--ymt-spacing-xs)}:host header .badges{grid-area:badges;display:flex;gap:var(--ymt-spacing-xs)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: YmtPaneHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: YmtPaneHeaderComponent, isStandalone: true, selector: "ymt-pane-header", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, subtitle: { classPropertyName: "subtitle", publicName: "subtitle", isSignal: true, isRequired: false, transformFunction: null }, actions: { classPropertyName: "actions", publicName: "actions", isSignal: true, isRequired: false, transformFunction: null }, badges: { classPropertyName: "badges", publicName: "badges", isSignal: true, isRequired: false, transformFunction: null } }, queries: [{ propertyName: "titleSlot", first: true, predicate: ["yuvPaneHeaderTitle"], descendants: true, isSignal: true }, { propertyName: "subtitleSlot", first: true, predicate: ["yuvPaneHeaderSubtitle"], descendants: true, isSignal: true }], ngImport: i0, template: "<header>\n  @if (icon()) {\n    <div class=\"icon\" aria-hidden=\"true\">\n      <mat-icon class=\"pane-icon\">{{ icon() }}</mat-icon>\n    </div>\n  }\n  <!-- top row (title and actions) -->\n  <div class=\"row title-row\">\n    <h2>\n      @let ts = titleSlot();\n      @if (ts) {\n        <ng-container *ngTemplateOutlet=\"ts\" />\n      } @else {\n        {{ title() }}\n      }\n    </h2>\n    @let a = actions();\n    @if (a) {\n      <div class=\"actions\">\n        <ng-container *ngTemplateOutlet=\"a\" />\n      </div>\n    }\n  </div>\n\n  <!-- bottom row (subtitle and badges) -->\n  <div class=\"row subtitle-row\">\n    <small>\n      @let ss = subtitleSlot();\n      @if (ss) {\n        <ng-container *ngTemplateOutlet=\"ss\" />\n      } @else {\n        {{ subtitle() }}\n      }\n    </small>\n    @let b = badges();\n    @if (b) {\n      <div class=\"badges\">\n        <ng-container *ngTemplateOutlet=\"b\" />\n      </div>\n    }\n  </div>\n</header>\n", styles: [":host{--_header-padding: var(--header-padding, var(--ymt-spacing-xl));--_header-background: var(--header-background, transparent);--_header-border-color: var(--header-border-color, transparent);--_header-icon-background: var(--header-icon-background, var(--ymt-surface-container-high));overflow:hidden}:host header{display:grid;align-items:center;grid-template-columns:var(--_header-padding) auto 1fr calc(var(--_header-padding) / 2);grid-template-rows:auto auto var(--_header-padding);grid-template-areas:\". icon titleRow .\" \". icon subtitleRow .\" \". . . .\";flex:0 0 auto;background-color:var(--_header-background);border-block-end:1px solid var(--_header-border-color)}:host header .row{display:flex;flex-flow:row nowrap;align-items:center;min-width:0}:host header .title-row{grid-area:titleRow}:host header .subtitle-row{grid-area:subtitleRow}:host header .icon{grid-area:icon;align-items:center;margin-inline-end:var(--ymt-spacing-m);background-color:var(--_header-icon-background);border-radius:0 0 var(--ymt-corner-s) var(--ymt-corner-s);height:100%;width:var(--ymt-sizing-3xl);display:flex;padding-block-start:calc(var(--_header-padding) + 2px);padding-block-end:var(--ymt-spacing-xs);align-items:start;justify-content:center}:host header h2{flex:1;margin:0;padding:var(--_header-padding) 0 0 0;font:var(--ymt-font-title-large);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-self:end}:host header small{flex:1;font:var(--ymt-font-body-subtle-font);font-weight:var(--ymt-font-body-subtle-weight);color:var(--ymt-on-surface-type-subtle);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-self:start}:host header .actions{grid-area:actions;display:flex;align-items:center;justify-content:end;gap:var(--ymt-spacing-xs)}:host header .badges{grid-area:badges;display:flex;gap:var(--ymt-spacing-xs)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: YmtPaneHeaderComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: YmtPaneHeaderComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ymt-pane-header', imports: [CommonModule, MatIconModule], template: "<header>\n  @if (icon()) {\n    <div class=\"icon\" aria-hidden=\"true\">\n      <mat-icon class=\"pane-icon\">{{ icon() }}</mat-icon>\n    </div>\n  }\n  <!-- top row (title and actions) -->\n  <div class=\"row title-row\">\n    <h2>\n      @let ts = titleSlot();\n      @if (ts) {\n        <ng-container *ngTemplateOutlet=\"ts\" />\n      } @else {\n        {{ title() }}\n      }\n    </h2>\n    @let a = actions();\n    @if (a) {\n      <div class=\"actions\">\n        <ng-container *ngTemplateOutlet=\"a\" />\n      </div>\n    }\n  </div>\n\n  <!-- bottom row (subtitle and badges) -->\n  <div class=\"row subtitle-row\">\n    <small>\n      @let ss = subtitleSlot();\n      @if (ss) {\n        <ng-container *ngTemplateOutlet=\"ss\" />\n      } @else {\n        {{ subtitle() }}\n      }\n    </small>\n    @let b = badges();\n    @if (b) {\n      <div class=\"badges\">\n        <ng-container *ngTemplateOutlet=\"b\" />\n      </div>\n    }\n  </div>\n</header>\n", styles: [":host{--_header-padding: var(--header-padding, var(--ymt-spacing-xl));--_header-background: var(--header-background, transparent);--_header-border-color: var(--header-border-color, transparent);--_header-icon-background: var(--header-icon-background, var(--ymt-surface-container-high));overflow:hidden}:host header{display:grid;align-items:center;grid-template-columns:var(--_header-padding) auto 1fr calc(var(--_header-padding) / 2);grid-template-rows:auto auto var(--_header-padding);grid-template-areas:\". icon titleRow .\" \". icon subtitleRow .\" \". . . .\";flex:0 0 auto;background-color:var(--_header-background);border-block-end:1px solid var(--_header-border-color)}:host header .row{display:flex;flex-flow:row nowrap;align-items:center;min-width:0}:host header .title-row{grid-area:titleRow}:host header .subtitle-row{grid-area:subtitleRow}:host header .icon{grid-area:icon;align-items:center;margin-inline-end:var(--ymt-spacing-m);background-color:var(--_header-icon-background);border-radius:0 0 var(--ymt-corner-s) var(--ymt-corner-s);height:100%;width:var(--ymt-sizing-3xl);display:flex;padding-block-start:calc(var(--_header-padding) + 2px);padding-block-end:var(--ymt-spacing-xs);align-items:start;justify-content:center}:host header h2{flex:1;margin:0;padding:var(--_header-padding) 0 0 0;font:var(--ymt-font-title-large);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-self:end}:host header small{flex:1;font:var(--ymt-font-body-subtle-font);font-weight:var(--ymt-font-body-subtle-weight);color:var(--ymt-on-surface-type-subtle);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-self:start}:host header .actions{grid-area:actions;display:flex;align-items:center;justify-content:end;gap:var(--ymt-spacing-xs)}:host header .badges{grid-area:badges;display:flex;gap:var(--ymt-spacing-xs)}\n"] }]
         }], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], subtitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "subtitle", required: false }] }], actions: [{ type: i0.Input, args: [{ isSignal: true, alias: "actions", required: false }] }], badges: [{ type: i0.Input, args: [{ isSignal: true, alias: "badges", required: false }] }], titleSlot: [{ type: i0.ContentChild, args: ['yuvPaneHeaderTitle', { isSignal: true }] }], subtitleSlot: [{ type: i0.ContentChild, args: ['yuvPaneHeaderSubtitle', { isSignal: true }] }] } });
@@ -241,10 +241,10 @@ class FullscreenDirective {
             this.exit();
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: FullscreenDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.9", type: FullscreenDirective, isStandalone: true, selector: "[yuvFullscreen]", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { fullscreenEnter: "fullscreenEnter", fullscreenExit: "fullscreenExit" }, host: { listeners: { "document:keydown.escape": "onEscape()" }, properties: { "class.yuv-fullscreen-active": "active()" } }, exportAs: ["yuvFullscreen"], ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: FullscreenDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.12", type: FullscreenDirective, isStandalone: true, selector: "[yuvFullscreen]", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { fullscreenEnter: "fullscreenEnter", fullscreenExit: "fullscreenExit" }, host: { listeners: { "document:keydown.escape": "onEscape()" }, properties: { "class.yuv-fullscreen-active": "active()" } }, exportAs: ["yuvFullscreen"], ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: FullscreenDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: FullscreenDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[yuvFullscreen]',
@@ -261,10 +261,10 @@ class YmtPaneTopBarComponent {
      * TemplateRef for actions area in the top bar.
      */
     actions = input(...(ngDevMode ? [undefined, { debugName: "actions" }] : /* istanbul ignore next */ []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: YmtPaneTopBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: YmtPaneTopBarComponent, isStandalone: true, selector: "ymt-pane-top-bar", inputs: { actions: { classPropertyName: "actions", publicName: "actions", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@let ta = actions();\n@if (ta) {\n  <div class=\"top-bar\">\n    <div class=\"actions\">\n      <ng-container *ngTemplateOutlet=\"ta\"></ng-container>\n    </div>\n  </div>\n}\n", styles: [":host{border-block-end:1px solid var(--ymt-outline-variant)}:host .top-bar{flex:0 0 auto;padding:var(--ymt-spacing-2xs) var(--ymt-spacing-xs);display:flex;align-items:center}:host .top-bar .actions{display:flex;flex:1;gap:var(--ymt-spacing-xs);align-items:center;justify-content:end}:host .top-bar .actions ::ng-deep>[align=start]{margin-inline-end:auto}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: YmtPaneTopBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: YmtPaneTopBarComponent, isStandalone: true, selector: "ymt-pane-top-bar", inputs: { actions: { classPropertyName: "actions", publicName: "actions", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@let ta = actions();\n@if (ta) {\n  <div class=\"top-bar\">\n    <div class=\"actions\">\n      <ng-container *ngTemplateOutlet=\"ta\"></ng-container>\n    </div>\n  </div>\n}\n", styles: [":host{border-block-end:1px solid var(--ymt-outline-variant)}:host .top-bar{flex:0 0 auto;padding:var(--ymt-spacing-2xs) var(--ymt-spacing-xs);display:flex;align-items:center}:host .top-bar .actions{display:flex;flex:1;gap:var(--ymt-spacing-xs);align-items:center;justify-content:end}:host .top-bar .actions ::ng-deep>[align=start]{margin-inline-end:auto}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: YmtPaneTopBarComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: YmtPaneTopBarComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ymt-pane-top-bar', imports: [CommonModule], template: "@let ta = actions();\n@if (ta) {\n  <div class=\"top-bar\">\n    <div class=\"actions\">\n      <ng-container *ngTemplateOutlet=\"ta\"></ng-container>\n    </div>\n  </div>\n}\n", styles: [":host{border-block-end:1px solid var(--ymt-outline-variant)}:host .top-bar{flex:0 0 auto;padding:var(--ymt-spacing-2xs) var(--ymt-spacing-xs);display:flex;align-items:center}:host .top-bar .actions{display:flex;flex:1;gap:var(--ymt-spacing-xs);align-items:center;justify-content:end}:host .top-bar .actions ::ng-deep>[align=start]{margin-inline-end:auto}\n"] }]
         }], propDecorators: { actions: [{ type: i0.Input, args: [{ isSignal: true, alias: "actions", required: false }] }] } });
@@ -467,10 +467,10 @@ class YmtPaneComponent {
     exitFullscreen() {
         this.#fullscreen.exit();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: YmtPaneComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: YmtPaneComponent, isStandalone: true, selector: "ymt-pane", inputs: { topBarActions: { classPropertyName: "topBarActions", publicName: "topBarActions", isSignal: true, isRequired: false, transformFunction: null }, busy: { classPropertyName: "busy", publicName: "busy", isSignal: true, isRequired: false, transformFunction: null }, noAnimation: { classPropertyName: "noAnimation", publicName: "noAnimation", isSignal: true, isRequired: false, transformFunction: null }, plain: { classPropertyName: "plain", publicName: "plain", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.plain": "plain()", "class.busy": "busy()", "class.no-animation": "noAnimation()" } }, hostDirectives: [{ directive: FullscreenDirective, outputs: ["fullscreenEnter", "fullscreenEnter", "fullscreenExit", "fullscreenExit"] }], ngImport: i0, template: "@if (topBarActions()) {\n  <ymt-pane-top-bar [actions]=\"topBarActions()\"></ymt-pane-top-bar>\n}\n<ng-content></ng-content>\n", styles: [":host{--_header-area-padding: var(--header-area-padding, var(--ymt-spacing-xl));--_header-area-background: var(--header-area-background, transparent);--_header-area-border-color: var(--header-area-border-color, transparent);--_main-area-padding: var(--main-area-padding, 0);--_pane-background-color: var(--pane-background-color, var(--ymt-surface));--_busy-border-width: var(--busy-border-width, 2px);--_busy-border-color: var(--busy-border-color, var(--ymt-primary));--_enter-animation-duration: var(--enter-animation-duration, .15s);--_enter-animation-delay: var(--enter-animation-delay, 0s);position:relative;background-color:var(--_pane-background-color);color:var(--ymt-on-surface);display:grid;animation:pane-fade-in var(--_enter-animation-duration) ease-out var(--_enter-animation-delay) backwards}:host.no-animation{animation:none}:host{grid-template-rows:auto auto 1fr auto;grid-template-columns:1fr;grid-template-areas:\"top-bar\" \"header\" \"main\" \"footer\";height:100%;overflow:hidden}:host.plain{--pane-background-color: transparent}:host:not(.fullscreen,.plain){border-radius:var(--ymt-corner-m);border:1px solid var(--ymt-outline-variant);transition:border-color .3s ease}:host:not(.fullscreen,.plain):before{content:\"\";position:absolute;inset:0;padding:var(--_busy-border-width);border-radius:calc(var(--ymt-corner-m) - 1px);background:conic-gradient(from var(--busy-angle),var(--ymt-outline-variant),var(--_busy-border-color),var(--ymt-outline-variant));mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;opacity:0;transition:opacity .3s ease}:host:not(.fullscreen,.plain).busy{border-color:transparent}:host:not(.fullscreen,.plain).busy:before{opacity:1;animation:rotate-busy-gradient 2s linear infinite}:host ymt-pane-top-bar{grid-area:top-bar}:host ::ng-deep ymt-pane-header{--header-padding: var(--_header-area-padding);--header-background: var(--_header-area-background);--header-border-color: var(--_header-area-border-color);grid-area:header}:host ::ng-deep ymt-pane-body{grid-area:main;overflow-y:auto;padding:var(--_main-area-padding)}:host ::ng-deep ymt-pane-footer{grid-area:footer}@keyframes pane-fade-in{0%{opacity:0}to{opacity:1}}@keyframes rotate-busy-gradient{to{--busy-angle: 360deg}}\n"], dependencies: [{ kind: "component", type: YmtPaneTopBarComponent, selector: "ymt-pane-top-bar", inputs: ["actions"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: YmtPaneComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: YmtPaneComponent, isStandalone: true, selector: "ymt-pane", inputs: { topBarActions: { classPropertyName: "topBarActions", publicName: "topBarActions", isSignal: true, isRequired: false, transformFunction: null }, busy: { classPropertyName: "busy", publicName: "busy", isSignal: true, isRequired: false, transformFunction: null }, noAnimation: { classPropertyName: "noAnimation", publicName: "noAnimation", isSignal: true, isRequired: false, transformFunction: null }, plain: { classPropertyName: "plain", publicName: "plain", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.plain": "plain()", "class.busy": "busy()", "class.no-animation": "noAnimation()" } }, hostDirectives: [{ directive: FullscreenDirective, outputs: ["fullscreenEnter", "fullscreenEnter", "fullscreenExit", "fullscreenExit"] }], ngImport: i0, template: "@if (topBarActions()) {\n  <ymt-pane-top-bar [actions]=\"topBarActions()\"></ymt-pane-top-bar>\n}\n<ng-content></ng-content>\n", styles: [":host{--_header-area-padding: var(--header-area-padding, var(--ymt-spacing-xl));--_header-area-background: var(--header-area-background, transparent);--_header-area-border-color: var(--header-area-border-color, transparent);--_main-area-padding: var(--main-area-padding, 0);--_pane-background-color: var(--pane-background-color, var(--ymt-surface));--_busy-border-width: var(--busy-border-width, 2px);--_busy-border-color: var(--busy-border-color, var(--ymt-primary));--_enter-animation-duration: var(--enter-animation-duration, .15s);--_enter-animation-delay: var(--enter-animation-delay, 0s);position:relative;background-color:var(--_pane-background-color);color:var(--ymt-on-surface);display:grid;animation:pane-fade-in var(--_enter-animation-duration) ease-out var(--_enter-animation-delay) backwards}:host.no-animation{animation:none}:host{grid-template-rows:auto auto 1fr auto;grid-template-columns:1fr;grid-template-areas:\"top-bar\" \"header\" \"main\" \"footer\";height:100%;overflow:hidden}:host.plain{--pane-background-color: transparent}:host:not(.fullscreen,.plain){border-radius:var(--ymt-corner-m);border:1px solid var(--ymt-outline-variant);transition:border-color .3s ease}:host:not(.fullscreen,.plain):before{content:\"\";position:absolute;inset:0;padding:var(--_busy-border-width);border-radius:calc(var(--ymt-corner-m) - 1px);background:conic-gradient(from var(--busy-angle),var(--ymt-outline-variant),var(--_busy-border-color),var(--ymt-outline-variant));mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;opacity:0;transition:opacity .3s ease}:host:not(.fullscreen,.plain).busy{border-color:transparent}:host:not(.fullscreen,.plain).busy:before{opacity:1;animation:rotate-busy-gradient 2s linear infinite}:host ymt-pane-top-bar{grid-area:top-bar}:host ::ng-deep ymt-pane-header{--header-padding: var(--_header-area-padding);--header-background: var(--_header-area-background);--header-border-color: var(--_header-area-border-color);grid-area:header}:host ::ng-deep ymt-pane-body{grid-area:main;overflow-y:auto;padding:var(--_main-area-padding)}:host ::ng-deep ymt-pane-footer{grid-area:footer}@keyframes pane-fade-in{0%{opacity:0}to{opacity:1}}@keyframes rotate-busy-gradient{to{--busy-angle: 360deg}}\n"], dependencies: [{ kind: "component", type: YmtPaneTopBarComponent, selector: "ymt-pane-top-bar", inputs: ["actions"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: YmtPaneComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: YmtPaneComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ymt-pane', imports: [YmtPaneTopBarComponent], hostDirectives: [
                         {
@@ -485,21 +485,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
         }], propDecorators: { topBarActions: [{ type: i0.Input, args: [{ isSignal: true, alias: "topBarActions", required: false }] }], busy: [{ type: i0.Input, args: [{ isSignal: true, alias: "busy", required: false }] }], noAnimation: [{ type: i0.Input, args: [{ isSignal: true, alias: "noAnimation", required: false }] }], plain: [{ type: i0.Input, args: [{ isSignal: true, alias: "plain", required: false }] }] } });
 class YmtPaneFooterComponent {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: YmtPaneFooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.9", type: YmtPaneFooterComponent, isStandalone: true, selector: "ymt-pane-footer", ngImport: i0, template: "<footer><ng-content></ng-content></footer>\n", styles: [":host{--_footer-inline-padding: var(--footer-inline-padding, var(--ymt-spacing-xl));--_footer-block-padding: var(--footer-block-padding, var(--ymt-spacing-xl));--_footer-border-color: var(--footer-border-color, var(--ymt-outline-variant));--_footer-background: var(--footer-background, var(--ymt-surface-variant))}:host footer{padding:var(--_footer-block-padding) var(--_footer-inline-padding);border-block-start:1px solid var(--_footer-border-color);background-color:var(--_footer-background);display:flex;gap:var(--ymt-spacing-m);justify-content:flex-end}\n"] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: YmtPaneFooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.12", type: YmtPaneFooterComponent, isStandalone: true, selector: "ymt-pane-footer", ngImport: i0, template: "<footer><ng-content></ng-content></footer>\n", styles: [":host{--_footer-inline-padding: var(--footer-inline-padding, var(--ymt-spacing-xl));--_footer-block-padding: var(--footer-block-padding, var(--ymt-spacing-xl));--_footer-border-color: var(--footer-border-color, var(--ymt-outline-variant));--_footer-background: var(--footer-background, var(--ymt-surface-variant))}:host footer{padding:var(--_footer-block-padding) var(--_footer-inline-padding);border-block-start:1px solid var(--_footer-border-color);background-color:var(--_footer-background);display:flex;gap:var(--ymt-spacing-m);justify-content:flex-end}\n"] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: YmtPaneFooterComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: YmtPaneFooterComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ymt-pane-footer', imports: [], template: "<footer><ng-content></ng-content></footer>\n", styles: [":host{--_footer-inline-padding: var(--footer-inline-padding, var(--ymt-spacing-xl));--_footer-block-padding: var(--footer-block-padding, var(--ymt-spacing-xl));--_footer-border-color: var(--footer-border-color, var(--ymt-outline-variant));--_footer-background: var(--footer-background, var(--ymt-surface-variant))}:host footer{padding:var(--_footer-block-padding) var(--_footer-inline-padding);border-block-start:1px solid var(--_footer-border-color);background-color:var(--_footer-background);display:flex;gap:var(--ymt-spacing-m);justify-content:flex-end}\n"] }]
         }] });
 const cmp = [YmtPaneComponent, YmtPaneHeaderComponent, YmtPaneBodyComponent, YmtPaneFooterComponent, YmtPaneAsideComponent];
 class YmtPanesModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: YmtPanesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.9", ngImport: i0, type: YmtPanesModule, imports: [YmtPaneComponent, YmtPaneHeaderComponent, YmtPaneBodyComponent, YmtPaneFooterComponent, YmtPaneAsideComponent], exports: [YmtPaneComponent, YmtPaneHeaderComponent, YmtPaneBodyComponent, YmtPaneFooterComponent, YmtPaneAsideComponent] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: YmtPanesModule, imports: [YmtPaneComponent, YmtPaneHeaderComponent] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: YmtPanesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.12", ngImport: i0, type: YmtPanesModule, imports: [YmtPaneComponent, YmtPaneHeaderComponent, YmtPaneBodyComponent, YmtPaneFooterComponent, YmtPaneAsideComponent], exports: [YmtPaneComponent, YmtPaneHeaderComponent, YmtPaneBodyComponent, YmtPaneFooterComponent, YmtPaneAsideComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: YmtPanesModule, imports: [YmtPaneComponent, YmtPaneHeaderComponent] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: YmtPanesModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: YmtPanesModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: cmp,