@siemens/element-ng 51.0.0-rc.8 → 51.0.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 (105) hide show
  1. package/fesm2022/siemens-element-ng-ag-grid.mjs +17 -25
  2. package/fesm2022/siemens-element-ng-ag-grid.mjs.map +1 -1
  3. package/fesm2022/siemens-element-ng-application-header.mjs +2 -2
  4. package/fesm2022/siemens-element-ng-application-header.mjs.map +1 -1
  5. package/fesm2022/siemens-element-ng-avatar.mjs +3 -3
  6. package/fesm2022/siemens-element-ng-avatar.mjs.map +1 -1
  7. package/fesm2022/siemens-element-ng-chat-messages.mjs +123 -23
  8. package/fesm2022/siemens-element-ng-chat-messages.mjs.map +1 -1
  9. package/fesm2022/siemens-element-ng-color-picker.mjs +18 -18
  10. package/fesm2022/siemens-element-ng-color-picker.mjs.map +1 -1
  11. package/fesm2022/siemens-element-ng-column-selection-dialog.mjs +2 -2
  12. package/fesm2022/siemens-element-ng-column-selection-dialog.mjs.map +1 -1
  13. package/fesm2022/siemens-element-ng-dashboard.mjs +4 -4
  14. package/fesm2022/siemens-element-ng-dashboard.mjs.map +1 -1
  15. package/fesm2022/siemens-element-ng-date-range-filter.mjs +2 -2
  16. package/fesm2022/siemens-element-ng-date-range-filter.mjs.map +1 -1
  17. package/fesm2022/siemens-element-ng-datepicker.mjs +4 -4
  18. package/fesm2022/siemens-element-ng-datepicker.mjs.map +1 -1
  19. package/fesm2022/siemens-element-ng-file-uploader.mjs +2 -2
  20. package/fesm2022/siemens-element-ng-file-uploader.mjs.map +1 -1
  21. package/fesm2022/siemens-element-ng-filtered-search.mjs +2 -2
  22. package/fesm2022/siemens-element-ng-filtered-search.mjs.map +1 -1
  23. package/fesm2022/siemens-element-ng-form.mjs +19 -6
  24. package/fesm2022/siemens-element-ng-form.mjs.map +1 -1
  25. package/fesm2022/siemens-element-ng-formly.mjs +4 -4
  26. package/fesm2022/siemens-element-ng-formly.mjs.map +1 -1
  27. package/fesm2022/siemens-element-ng-icon.mjs +1 -1
  28. package/fesm2022/siemens-element-ng-icon.mjs.map +1 -1
  29. package/fesm2022/siemens-element-ng-info-page.mjs +2 -2
  30. package/fesm2022/siemens-element-ng-info-page.mjs.map +1 -1
  31. package/fesm2022/siemens-element-ng-landing-page.mjs +4 -4
  32. package/fesm2022/siemens-element-ng-landing-page.mjs.map +1 -1
  33. package/fesm2022/siemens-element-ng-list-details.mjs +62 -16
  34. package/fesm2022/siemens-element-ng-list-details.mjs.map +1 -1
  35. package/fesm2022/siemens-element-ng-main-detail-container.mjs +72 -24
  36. package/fesm2022/siemens-element-ng-main-detail-container.mjs.map +1 -1
  37. package/fesm2022/siemens-element-ng-maplibre.mjs +282 -6
  38. package/fesm2022/siemens-element-ng-maplibre.mjs.map +1 -1
  39. package/fesm2022/siemens-element-ng-markdown-hightlighter-highlightjs.mjs +2 -2
  40. package/fesm2022/siemens-element-ng-markdown-hightlighter-highlightjs.mjs.map +1 -1
  41. package/fesm2022/siemens-element-ng-menu.mjs +6 -6
  42. package/fesm2022/siemens-element-ng-menu.mjs.map +1 -1
  43. package/fesm2022/siemens-element-ng-navbar-vertical-next.mjs +6 -6
  44. package/fesm2022/siemens-element-ng-navbar-vertical-next.mjs.map +1 -1
  45. package/fesm2022/siemens-element-ng-navbar-vertical.mjs +4 -4
  46. package/fesm2022/siemens-element-ng-navbar-vertical.mjs.map +1 -1
  47. package/fesm2022/siemens-element-ng-result-details-list.mjs +2 -2
  48. package/fesm2022/siemens-element-ng-result-details-list.mjs.map +1 -1
  49. package/fesm2022/siemens-element-ng-select.mjs +44 -5
  50. package/fesm2022/siemens-element-ng-select.mjs.map +1 -1
  51. package/fesm2022/siemens-element-ng-side-panel.mjs +48 -13
  52. package/fesm2022/siemens-element-ng-side-panel.mjs.map +1 -1
  53. package/fesm2022/siemens-element-ng-slider.mjs +2 -2
  54. package/fesm2022/siemens-element-ng-slider.mjs.map +1 -1
  55. package/fesm2022/siemens-element-ng-source-chip.mjs +2 -2
  56. package/fesm2022/siemens-element-ng-source-chip.mjs.map +1 -1
  57. package/fesm2022/siemens-element-ng-split.mjs +18 -16
  58. package/fesm2022/siemens-element-ng-split.mjs.map +1 -1
  59. package/fesm2022/siemens-element-ng-status-bar.mjs +2 -2
  60. package/fesm2022/siemens-element-ng-status-bar.mjs.map +1 -1
  61. package/fesm2022/siemens-element-ng-status-toggle.mjs +2 -2
  62. package/fesm2022/siemens-element-ng-status-toggle.mjs.map +1 -1
  63. package/fesm2022/siemens-element-ng-summary-chip.mjs +2 -2
  64. package/fesm2022/siemens-element-ng-summary-chip.mjs.map +1 -1
  65. package/fesm2022/siemens-element-ng-summary-widget.mjs +2 -2
  66. package/fesm2022/siemens-element-ng-summary-widget.mjs.map +1 -1
  67. package/fesm2022/siemens-element-ng-system-banner.mjs +5 -5
  68. package/fesm2022/siemens-element-ng-system-banner.mjs.map +1 -1
  69. package/fesm2022/siemens-element-ng-tabs.mjs +93 -71
  70. package/fesm2022/siemens-element-ng-tabs.mjs.map +1 -1
  71. package/fesm2022/siemens-element-ng-toast-notification.mjs +2 -2
  72. package/fesm2022/siemens-element-ng-toast-notification.mjs.map +1 -1
  73. package/fesm2022/siemens-element-ng-tour.mjs +2 -2
  74. package/fesm2022/siemens-element-ng-tour.mjs.map +1 -1
  75. package/fesm2022/siemens-element-ng-translate.mjs.map +1 -1
  76. package/fesm2022/siemens-element-ng-tree-view.mjs +4 -4
  77. package/fesm2022/siemens-element-ng-tree-view.mjs.map +1 -1
  78. package/package.json +4 -4
  79. package/schematics/collection.json +5 -0
  80. package/schematics/migrate-tabs-legacy/index.js +5 -0
  81. package/schematics/migrate-tabs-legacy/migrate-tabs-legacy-rule.js +675 -0
  82. package/schematics/migrate-tabs-legacy/schema.json +14 -0
  83. package/schematics/migrations/data/css-custom-properties.js +67 -1
  84. package/schematics/migrations/data/element-class-changes.js +31 -12
  85. package/schematics/ng-update/migrate-list-details-units.js +86 -0
  86. package/schematics/ng-update/migrate-main-detail-units.js +89 -0
  87. package/schematics/ng-update/migrate-split-collapse.js +1 -32
  88. package/schematics/ng-update/migrate-split-scale.js +524 -0
  89. package/schematics/ng-update/migrate-split-sizes.js +5 -3
  90. package/schematics/ng-update/migrate-to-v51.js +6 -0
  91. package/schematics/utils/index.js +1 -0
  92. package/schematics/utils/template-edit-utils.js +35 -0
  93. package/schematics/utils/template-utils.js +31 -45
  94. package/template-i18n.json +1 -0
  95. package/types/siemens-element-ng-avatar.d.ts +1 -1
  96. package/types/siemens-element-ng-chat-messages.d.ts +81 -17
  97. package/types/siemens-element-ng-form.d.ts +3 -0
  98. package/types/siemens-element-ng-list-details.d.ts +25 -3
  99. package/types/siemens-element-ng-main-detail-container.d.ts +23 -3
  100. package/types/siemens-element-ng-maplibre.d.ts +131 -7
  101. package/types/siemens-element-ng-select.d.ts +31 -4
  102. package/types/siemens-element-ng-side-panel.d.ts +17 -3
  103. package/types/siemens-element-ng-split.d.ts +3 -10
  104. package/types/siemens-element-ng-system-banner.d.ts +2 -2
  105. package/types/siemens-element-ng-translate.d.ts +1 -0
@@ -45,7 +45,7 @@ class SiSourceChipComponent {
45
45
  addIcons({ elementGlobal });
46
46
  }
47
47
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: SiSourceChipComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
48
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: SiSourceChipComponent, isStandalone: true, selector: "si-source-chip", inputs: { showIcon: { classPropertyName: "showIcon", publicName: "showIcon", isSignal: true, isRequired: false, transformFunction: null }, showLabel: { classPropertyName: "showLabel", publicName: "showLabel", isSignal: true, isRequired: false, transformFunction: null }, sources: { classPropertyName: "sources", publicName: "sources", isSignal: true, isRequired: true, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { sourceClicked: "sourceClicked" }, host: { properties: { "class.lh-1": "compact()" }, classAttribute: "px-2" }, ngImport: i0, template: "@let dis = disabled();\n@let src = sources();\n<button\n type=\"button\"\n class=\"chip\"\n siPopoverContainerClass=\"si-source-chip-popover\"\n [attr.tabindex]=\"dis ? '' : '0'\"\n [attr.aria-disabled]=\"dis\"\n [class.disabled]=\"dis\"\n [class.compact]=\"compact()\"\n [class.full-size]=\"!compact()\"\n [siPopover]=\"sourcePopover\"\n>\n @if (showIcon()) {\n <si-icon icon=\"element-global\" />\n }\n @if (showLabel() || !src.length) {\n {{ labelSources | translate }}\n } @else {\n {{ label() }}\n\n @if (src.length > 2) {\n +{{ src.length - 1 }}\n }\n }\n</button>\n\n<ng-template #sourcePopover>\n <si-popover-title class=\"visually-hidden\">\n {{ labelSources | translate }}\n </si-popover-title>\n <si-popover-body class=\"p-2 sources\">\n <ul class=\"list-unstyled mb-0\">\n @for (source of src; track $index) {\n <li>\n <button\n type=\"button\"\n class=\"list-item list-item-action p-4\"\n (click)=\"sourceClicked.emit(source)\"\n >\n <div class=\"list-item-title pt-0\">{{ source.name }}</div>\n @if (source.quote ?? source.description; as description) {\n <p class=\"list-item-description mb-0\">{{ description }}</p>\n }\n </button>\n </li>\n }\n </ul>\n </si-popover-body>\n</ng-template>\n", styles: [".chip{display:inline-flex;align-items:center;justify-content:center;min-inline-size:calc(1lh + 2 * var(--si-sys-sizing-spacing-x-40));border:1px solid var(--si-sys-border-neutral);border-radius:1lh;padding-block:0;padding-inline:var(--si-sys-sizing-spacing-x-40);gap:var(--si-sys-sizing-spacing-y-20) var(--si-sys-sizing-spacing-x-20);background:var(--si-sys-background-0)}.chip:not(.disabled){cursor:pointer}.chip:not(.disabled):not(.selected):hover{background:var(--si-sys-background-hover)}.chip[aria-expanded=true]{background:var(--si-sys-background-selected)}.compact{font-size:var(--si-sys-typography-font-size-body-sm);block-size:1rem}.full-size{block-size:calc(1lh + 2 * var(--si-sys-sizing-spacing-y-40))}.disabled{opacity:var(--element-action-disabled-opacity)}.sources{max-block-size:400px;overflow-y:auto}.sources li:first-child .list-item{border-start-start-radius:var(--element-radius-1);border-start-end-radius:var(--element-radius-1)}.sources li:last-child .list-item{border-end-start-radius:var(--element-radius-1);border-end-end-radius:var(--element-radius-1)}.sources li:not(:first-child){margin-block-start:var(--si-sys-sizing-spacing-y-40)}::ng-deep .si-source-chip-popover{min-inline-size:230px;max-inline-size:400px}\n"], dependencies: [{ kind: "component", type: SiIconComponent, selector: "si-icon", inputs: ["icon"] }, { kind: "directive", type: SiPopoverTitleDirective, selector: "si-popover-title" }, { kind: "directive", type: SiPopoverBodyDirective, selector: "si-popover-body" }, { kind: "directive", type: SiPopoverDirective, selector: "[siPopover]", inputs: ["siPopover", "siPopoverPlacement", "siPopoverTitle", "siPopoverContainerClass", "siPopoverIcon", "siPopoverContext", "siPopoverScrollStrategy"], outputs: ["siPopoverVisibilityChange"], exportAs: ["si-popover"] }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }] });
48
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: SiSourceChipComponent, isStandalone: true, selector: "si-source-chip", inputs: { showIcon: { classPropertyName: "showIcon", publicName: "showIcon", isSignal: true, isRequired: false, transformFunction: null }, showLabel: { classPropertyName: "showLabel", publicName: "showLabel", isSignal: true, isRequired: false, transformFunction: null }, sources: { classPropertyName: "sources", publicName: "sources", isSignal: true, isRequired: true, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { sourceClicked: "sourceClicked" }, host: { properties: { "class.lh-1": "compact()" }, classAttribute: "px-2" }, ngImport: i0, template: "@let dis = disabled();\n@let src = sources();\n<button\n type=\"button\"\n class=\"chip\"\n siPopoverContainerClass=\"si-source-chip-popover\"\n [attr.tabindex]=\"dis ? '' : '0'\"\n [attr.aria-disabled]=\"dis\"\n [class.disabled]=\"dis\"\n [class.compact]=\"compact()\"\n [class.full-size]=\"!compact()\"\n [siPopover]=\"sourcePopover\"\n>\n @if (showIcon()) {\n <si-icon icon=\"element-global\" />\n }\n @if (showLabel() || !src.length) {\n {{ labelSources | translate }}\n } @else {\n {{ label() }}\n\n @if (src.length > 2) {\n +{{ src.length - 1 }}\n }\n }\n</button>\n\n<ng-template #sourcePopover>\n <si-popover-title class=\"visually-hidden\">\n {{ labelSources | translate }}\n </si-popover-title>\n <si-popover-body class=\"p-2 sources\">\n <ul class=\"list-unstyled mb-0\">\n @for (source of src; track $index) {\n <li>\n <button\n type=\"button\"\n class=\"list-item list-item-action p-4\"\n (click)=\"sourceClicked.emit(source)\"\n >\n <div class=\"list-item-title pt-0\">{{ source.name }}</div>\n @if (source.quote ?? source.description; as description) {\n <p class=\"list-item-description mb-0\">{{ description }}</p>\n }\n </button>\n </li>\n }\n </ul>\n </si-popover-body>\n</ng-template>\n", styles: [".chip{display:inline-flex;align-items:center;justify-content:center;min-inline-size:calc(1lh + 2 * var(--si-sys-sizing-spacing-x-40));border:1px solid var(--si-sys-border-neutral);border-radius:1lh;padding-block:0;padding-inline:var(--si-sys-sizing-spacing-x-40);gap:var(--si-sys-sizing-spacing-y-20) var(--si-sys-sizing-spacing-x-20);background:var(--si-sys-background-0)}.chip:not(.disabled){cursor:pointer}.chip:not(.disabled):not(.selected):hover{background:var(--si-sys-background-hover)}.chip[aria-expanded=true]{background:var(--si-sys-background-active)}.compact{font-size:var(--si-sys-typography-font-size-body-sm);block-size:1rem}.full-size{block-size:calc(1lh + 2 * var(--si-sys-sizing-spacing-y-40))}.disabled{opacity:var(--element-action-disabled-opacity)}.sources{max-block-size:400px;overflow-y:auto}.sources li:first-child .list-item{border-start-start-radius:var(--element-radius-1);border-start-end-radius:var(--element-radius-1)}.sources li:last-child .list-item{border-end-start-radius:var(--element-radius-1);border-end-end-radius:var(--element-radius-1)}.sources li:not(:first-child){margin-block-start:var(--si-sys-sizing-spacing-y-40)}::ng-deep .si-source-chip-popover{min-inline-size:230px;max-inline-size:400px}\n"], dependencies: [{ kind: "component", type: SiIconComponent, selector: "si-icon", inputs: ["icon"] }, { kind: "directive", type: SiPopoverTitleDirective, selector: "si-popover-title" }, { kind: "directive", type: SiPopoverBodyDirective, selector: "si-popover-body" }, { kind: "directive", type: SiPopoverDirective, selector: "[siPopover]", inputs: ["siPopover", "siPopoverPlacement", "siPopoverTitle", "siPopoverContainerClass", "siPopoverIcon", "siPopoverContext", "siPopoverScrollStrategy"], outputs: ["siPopoverVisibilityChange"], exportAs: ["si-popover"] }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }] });
49
49
  }
50
50
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: SiSourceChipComponent, decorators: [{
51
51
  type: Component,
@@ -58,7 +58,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
58
58
  ], host: {
59
59
  class: 'px-2',
60
60
  '[class.lh-1]': 'compact()'
61
- }, template: "@let dis = disabled();\n@let src = sources();\n<button\n type=\"button\"\n class=\"chip\"\n siPopoverContainerClass=\"si-source-chip-popover\"\n [attr.tabindex]=\"dis ? '' : '0'\"\n [attr.aria-disabled]=\"dis\"\n [class.disabled]=\"dis\"\n [class.compact]=\"compact()\"\n [class.full-size]=\"!compact()\"\n [siPopover]=\"sourcePopover\"\n>\n @if (showIcon()) {\n <si-icon icon=\"element-global\" />\n }\n @if (showLabel() || !src.length) {\n {{ labelSources | translate }}\n } @else {\n {{ label() }}\n\n @if (src.length > 2) {\n +{{ src.length - 1 }}\n }\n }\n</button>\n\n<ng-template #sourcePopover>\n <si-popover-title class=\"visually-hidden\">\n {{ labelSources | translate }}\n </si-popover-title>\n <si-popover-body class=\"p-2 sources\">\n <ul class=\"list-unstyled mb-0\">\n @for (source of src; track $index) {\n <li>\n <button\n type=\"button\"\n class=\"list-item list-item-action p-4\"\n (click)=\"sourceClicked.emit(source)\"\n >\n <div class=\"list-item-title pt-0\">{{ source.name }}</div>\n @if (source.quote ?? source.description; as description) {\n <p class=\"list-item-description mb-0\">{{ description }}</p>\n }\n </button>\n </li>\n }\n </ul>\n </si-popover-body>\n</ng-template>\n", styles: [".chip{display:inline-flex;align-items:center;justify-content:center;min-inline-size:calc(1lh + 2 * var(--si-sys-sizing-spacing-x-40));border:1px solid var(--si-sys-border-neutral);border-radius:1lh;padding-block:0;padding-inline:var(--si-sys-sizing-spacing-x-40);gap:var(--si-sys-sizing-spacing-y-20) var(--si-sys-sizing-spacing-x-20);background:var(--si-sys-background-0)}.chip:not(.disabled){cursor:pointer}.chip:not(.disabled):not(.selected):hover{background:var(--si-sys-background-hover)}.chip[aria-expanded=true]{background:var(--si-sys-background-selected)}.compact{font-size:var(--si-sys-typography-font-size-body-sm);block-size:1rem}.full-size{block-size:calc(1lh + 2 * var(--si-sys-sizing-spacing-y-40))}.disabled{opacity:var(--element-action-disabled-opacity)}.sources{max-block-size:400px;overflow-y:auto}.sources li:first-child .list-item{border-start-start-radius:var(--element-radius-1);border-start-end-radius:var(--element-radius-1)}.sources li:last-child .list-item{border-end-start-radius:var(--element-radius-1);border-end-end-radius:var(--element-radius-1)}.sources li:not(:first-child){margin-block-start:var(--si-sys-sizing-spacing-y-40)}::ng-deep .si-source-chip-popover{min-inline-size:230px;max-inline-size:400px}\n"] }]
61
+ }, template: "@let dis = disabled();\n@let src = sources();\n<button\n type=\"button\"\n class=\"chip\"\n siPopoverContainerClass=\"si-source-chip-popover\"\n [attr.tabindex]=\"dis ? '' : '0'\"\n [attr.aria-disabled]=\"dis\"\n [class.disabled]=\"dis\"\n [class.compact]=\"compact()\"\n [class.full-size]=\"!compact()\"\n [siPopover]=\"sourcePopover\"\n>\n @if (showIcon()) {\n <si-icon icon=\"element-global\" />\n }\n @if (showLabel() || !src.length) {\n {{ labelSources | translate }}\n } @else {\n {{ label() }}\n\n @if (src.length > 2) {\n +{{ src.length - 1 }}\n }\n }\n</button>\n\n<ng-template #sourcePopover>\n <si-popover-title class=\"visually-hidden\">\n {{ labelSources | translate }}\n </si-popover-title>\n <si-popover-body class=\"p-2 sources\">\n <ul class=\"list-unstyled mb-0\">\n @for (source of src; track $index) {\n <li>\n <button\n type=\"button\"\n class=\"list-item list-item-action p-4\"\n (click)=\"sourceClicked.emit(source)\"\n >\n <div class=\"list-item-title pt-0\">{{ source.name }}</div>\n @if (source.quote ?? source.description; as description) {\n <p class=\"list-item-description mb-0\">{{ description }}</p>\n }\n </button>\n </li>\n }\n </ul>\n </si-popover-body>\n</ng-template>\n", styles: [".chip{display:inline-flex;align-items:center;justify-content:center;min-inline-size:calc(1lh + 2 * var(--si-sys-sizing-spacing-x-40));border:1px solid var(--si-sys-border-neutral);border-radius:1lh;padding-block:0;padding-inline:var(--si-sys-sizing-spacing-x-40);gap:var(--si-sys-sizing-spacing-y-20) var(--si-sys-sizing-spacing-x-20);background:var(--si-sys-background-0)}.chip:not(.disabled){cursor:pointer}.chip:not(.disabled):not(.selected):hover{background:var(--si-sys-background-hover)}.chip[aria-expanded=true]{background:var(--si-sys-background-active)}.compact{font-size:var(--si-sys-typography-font-size-body-sm);block-size:1rem}.full-size{block-size:calc(1lh + 2 * var(--si-sys-sizing-spacing-y-40))}.disabled{opacity:var(--element-action-disabled-opacity)}.sources{max-block-size:400px;overflow-y:auto}.sources li:first-child .list-item{border-start-start-radius:var(--element-radius-1);border-start-end-radius:var(--element-radius-1)}.sources li:last-child .list-item{border-end-start-radius:var(--element-radius-1);border-end-end-radius:var(--element-radius-1)}.sources li:not(:first-child){margin-block-start:var(--si-sys-sizing-spacing-y-40)}::ng-deep .si-source-chip-popover{min-inline-size:230px;max-inline-size:400px}\n"] }]
62
62
  }], ctorParameters: () => [], propDecorators: { showIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "showIcon", required: false }] }], showLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "showLabel", required: false }] }], sources: [{ type: i0.Input, args: [{ isSignal: true, alias: "sources", required: true }] }], compact: [{ type: i0.Input, args: [{ isSignal: true, alias: "compact", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], sourceClicked: [{ type: i0.Output, args: ["sourceClicked"] }] } });
63
63
 
64
64
  /**
@@ -1 +1 @@
1
- {"version":3,"file":"siemens-element-ng-source-chip.mjs","sources":["../../../../projects/element-ng/source-chip/si-source-chip.component.ts","../../../../projects/element-ng/source-chip/si-source-chip.component.html","../../../../projects/element-ng/source-chip/si-source-chip.model.ts","../../../../projects/element-ng/source-chip/index.ts","../../../../projects/element-ng/source-chip/siemens-element-ng-source-chip.ts"],"sourcesContent":["/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport { booleanAttribute, Component, computed, input, output } from '@angular/core';\nimport { elementGlobal } from '@siemens/element-icons';\nimport { addIcons, SiIconComponent } from '@siemens/element-ng/icon';\nimport {\n SiPopoverTitleDirective,\n SiPopoverBodyDirective,\n SiPopoverDirective\n} from '@siemens/element-ng/popover';\nimport { SiTranslatePipe, t } from '@siemens/element-translate-ng/translate';\n\nimport { SourceReference } from './si-source-chip.model';\n\n@Component({\n selector: 'si-source-chip',\n imports: [\n SiIconComponent,\n SiTranslatePipe,\n SiPopoverTitleDirective,\n SiPopoverBodyDirective,\n SiPopoverDirective\n ],\n templateUrl: './si-source-chip.component.html',\n styleUrl: './si-source-chip.component.scss',\n host: {\n class: 'px-2',\n '[class.lh-1]': 'compact()'\n }\n})\nexport class SiSourceChipComponent {\n /**\n * Wether to show the glob icon.\n * @defaultValue false\n */\n readonly showIcon = input(false, { transform: booleanAttribute });\n /**\n * Wether to show a 'sources' label\n * @defaultValue false\n */\n readonly showLabel = input(false, { transform: booleanAttribute });\n /** The sources. */\n readonly sources = input.required<SourceReference[]>();\n /**\n * Compact mode for inline use.\n * @defaultValue false\n */\n readonly compact = input(false, { transform: booleanAttribute });\n /**\n * Disabled state.\n * @defaultValue false\n */\n readonly disabled = input(false, { transform: booleanAttribute });\n\n /** Emitted when a source has been clicked. */\n readonly sourceClicked = output<SourceReference>();\n\n protected readonly labelSources = t(() => $localize`:@@SI_SOURCE_CHIP.SOURCES:Sources`);\n\n protected readonly label = computed(() => {\n const name = this.sources()[0].name;\n return name.length > 24 ? name.slice(0, 24) + '…' : name;\n });\n\n constructor() {\n addIcons({ elementGlobal });\n }\n}\n","@let dis = disabled();\n@let src = sources();\n<button\n type=\"button\"\n class=\"chip\"\n siPopoverContainerClass=\"si-source-chip-popover\"\n [attr.tabindex]=\"dis ? '' : '0'\"\n [attr.aria-disabled]=\"dis\"\n [class.disabled]=\"dis\"\n [class.compact]=\"compact()\"\n [class.full-size]=\"!compact()\"\n [siPopover]=\"sourcePopover\"\n>\n @if (showIcon()) {\n <si-icon icon=\"element-global\" />\n }\n @if (showLabel() || !src.length) {\n {{ labelSources | translate }}\n } @else {\n {{ label() }}\n\n @if (src.length > 2) {\n +{{ src.length - 1 }}\n }\n }\n</button>\n\n<ng-template #sourcePopover>\n <si-popover-title class=\"visually-hidden\">\n {{ labelSources | translate }}\n </si-popover-title>\n <si-popover-body class=\"p-2 sources\">\n <ul class=\"list-unstyled mb-0\">\n @for (source of src; track $index) {\n <li>\n <button\n type=\"button\"\n class=\"list-item list-item-action p-4\"\n (click)=\"sourceClicked.emit(source)\"\n >\n <div class=\"list-item-title pt-0\">{{ source.name }}</div>\n @if (source.quote ?? source.description; as description) {\n <p class=\"list-item-description mb-0\">{{ description }}</p>\n }\n </button>\n </li>\n }\n </ul>\n </si-popover-body>\n</ng-template>\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\n\n/** Definition of a single source */\nexport interface SourceReference {\n /** Source name displayed to the user. */\n name: string;\n /** Source URL. */\n url: string;\n /** Optional source description. */\n description?: string;\n /** Optional source quote. Takes precedence over {@link description}. */\n quote?: string;\n}\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nexport * from './si-source-chip.component';\nexport * from './si-source-chip.model';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"siemens-element-ng-source-chip.mjs","sources":["../../../../projects/element-ng/source-chip/si-source-chip.component.ts","../../../../projects/element-ng/source-chip/si-source-chip.component.html","../../../../projects/element-ng/source-chip/si-source-chip.model.ts","../../../../projects/element-ng/source-chip/index.ts","../../../../projects/element-ng/source-chip/siemens-element-ng-source-chip.ts"],"sourcesContent":["/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport { booleanAttribute, Component, computed, input, output } from '@angular/core';\nimport { elementGlobal } from '@siemens/element-icons';\nimport { addIcons, SiIconComponent } from '@siemens/element-ng/icon';\nimport {\n SiPopoverTitleDirective,\n SiPopoverBodyDirective,\n SiPopoverDirective\n} from '@siemens/element-ng/popover';\nimport { SiTranslatePipe, t } from '@siemens/element-translate-ng/translate';\n\nimport { SourceReference } from './si-source-chip.model';\n\n@Component({\n selector: 'si-source-chip',\n imports: [\n SiIconComponent,\n SiTranslatePipe,\n SiPopoverTitleDirective,\n SiPopoverBodyDirective,\n SiPopoverDirective\n ],\n templateUrl: './si-source-chip.component.html',\n styleUrl: './si-source-chip.component.scss',\n host: {\n class: 'px-2',\n '[class.lh-1]': 'compact()'\n }\n})\nexport class SiSourceChipComponent {\n /**\n * Wether to show the glob icon.\n * @defaultValue false\n */\n readonly showIcon = input(false, { transform: booleanAttribute });\n /**\n * Wether to show a 'sources' label\n * @defaultValue false\n */\n readonly showLabel = input(false, { transform: booleanAttribute });\n /** The sources. */\n readonly sources = input.required<SourceReference[]>();\n /**\n * Compact mode for inline use.\n * @defaultValue false\n */\n readonly compact = input(false, { transform: booleanAttribute });\n /**\n * Disabled state.\n * @defaultValue false\n */\n readonly disabled = input(false, { transform: booleanAttribute });\n\n /** Emitted when a source has been clicked. */\n readonly sourceClicked = output<SourceReference>();\n\n protected readonly labelSources = t(() => $localize`:@@SI_SOURCE_CHIP.SOURCES:Sources`);\n\n protected readonly label = computed(() => {\n const name = this.sources()[0].name;\n return name.length > 24 ? name.slice(0, 24) + '…' : name;\n });\n\n constructor() {\n addIcons({ elementGlobal });\n }\n}\n","@let dis = disabled();\n@let src = sources();\n<button\n type=\"button\"\n class=\"chip\"\n siPopoverContainerClass=\"si-source-chip-popover\"\n [attr.tabindex]=\"dis ? '' : '0'\"\n [attr.aria-disabled]=\"dis\"\n [class.disabled]=\"dis\"\n [class.compact]=\"compact()\"\n [class.full-size]=\"!compact()\"\n [siPopover]=\"sourcePopover\"\n>\n @if (showIcon()) {\n <si-icon icon=\"element-global\" />\n }\n @if (showLabel() || !src.length) {\n {{ labelSources | translate }}\n } @else {\n {{ label() }}\n\n @if (src.length > 2) {\n +{{ src.length - 1 }}\n }\n }\n</button>\n\n<ng-template #sourcePopover>\n <si-popover-title class=\"visually-hidden\">\n {{ labelSources | translate }}\n </si-popover-title>\n <si-popover-body class=\"p-2 sources\">\n <ul class=\"list-unstyled mb-0\">\n @for (source of src; track $index) {\n <li>\n <button\n type=\"button\"\n class=\"list-item list-item-action p-4\"\n (click)=\"sourceClicked.emit(source)\"\n >\n <div class=\"list-item-title pt-0\">{{ source.name }}</div>\n @if (source.quote ?? source.description; as description) {\n <p class=\"list-item-description mb-0\">{{ description }}</p>\n }\n </button>\n </li>\n }\n </ul>\n </si-popover-body>\n</ng-template>\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\n\n/** Definition of a single source */\nexport interface SourceReference {\n /** Source name displayed to the user. */\n name: string;\n /** Source URL. */\n url: string;\n /** Optional source description. */\n description?: string;\n /** Optional source quote. Takes precedence over {@link description}. */\n quote?: string;\n}\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nexport * from './si-source-chip.component';\nexport * from './si-source-chip.model';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
@@ -68,14 +68,6 @@ class SiSplitPartComponent {
68
68
  * @defaultValue false
69
69
  */
70
70
  removeContentOnCollapse = input(false, { ...(ngDevMode ? { debugName: "removeContentOnCollapse" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
71
- /**
72
- * Defines the behavior of the split part during scaling.
73
- * E.g. when set to `none`, the spit part will keep its current size even when the parent container grows or shrinks.
74
- *
75
- * @defaultValue 'auto'
76
- */
77
- scale = input('auto', /* @ts-ignore */
78
- ...(ngDevMode ? [{ debugName: "scale" }] : /* istanbul ignore next */ []));
79
71
  /**
80
72
  * Defines if the header of the split part is visible. Default is true.
81
73
  *
@@ -244,7 +236,7 @@ class SiSplitPartComponent {
244
236
  }
245
237
  }
246
238
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: SiSplitPartComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
247
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: SiSplitPartComponent, isStandalone: true, selector: "si-split-part", inputs: { actions: { classPropertyName: "actions", publicName: "actions", isSignal: true, isRequired: false, transformFunction: null }, collapsible: { classPropertyName: "collapsible", publicName: "collapsible", isSignal: true, isRequired: false, transformFunction: null }, collapseIconClass: { classPropertyName: "collapseIconClass", publicName: "collapseIconClass", isSignal: true, isRequired: false, transformFunction: null }, collapseToMinSize: { classPropertyName: "collapseToMinSize", publicName: "collapseToMinSize", isSignal: true, isRequired: false, transformFunction: null }, headerTemplate: { classPropertyName: "headerTemplate", publicName: "headerTemplate", isSignal: true, isRequired: false, transformFunction: null }, heading: { classPropertyName: "heading", publicName: "heading", isSignal: true, isRequired: false, transformFunction: null }, minSize: { classPropertyName: "minSize", publicName: "minSize", isSignal: true, isRequired: false, transformFunction: null }, removeContentOnCollapse: { classPropertyName: "removeContentOnCollapse", publicName: "removeContentOnCollapse", isSignal: true, isRequired: false, transformFunction: null }, scale: { classPropertyName: "scale", publicName: "scale", isSignal: true, isRequired: false, transformFunction: null }, showHeader: { classPropertyName: "showHeader", publicName: "showHeader", isSignal: true, isRequired: false, transformFunction: null }, collapseLabel: { classPropertyName: "collapseLabel", publicName: "collapseLabel", isSignal: true, isRequired: false, transformFunction: null }, stateId: { classPropertyName: "stateId", publicName: "stateId", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: true, transformFunction: null }, unit: { classPropertyName: "unit", publicName: "unit", isSignal: true, isRequired: true, transformFunction: null }, collapseOthers: { classPropertyName: "collapseOthers", publicName: "collapseOthers", isSignal: true, isRequired: false, transformFunction: null }, expanded: { classPropertyName: "expanded", publicName: "expanded", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { collapseChanged: "collapseChanged", stateChange: "stateChange" }, host: { properties: { "class.is-collapsed": "collapsedState()", "class.collapse-start": "collapseDirectionState() === \"to-start\"", "style.grid-area": "\"p-\" + this.index" } }, ngImport: i0, template: "@if (!headerTemplate() && showHeader()) {\n <div class=\"si-split-part-header\" [class.is-collapsed]=\"collapsedState()\">\n <div class=\"si-split-part-title text-truncate\">\n {{ heading() | translate }}\n </div>\n @if (!collapsedState()) {\n <div class=\"si-split-part-actions\">\n @for (action of actions(); track $index) {\n <button\n type=\"button\"\n class=\"btn btn-icon btn-tertiary-ghost si-split-button\"\n [title]=\"action.tooltip || ''\"\n [attr.aria-label]=\"action.tooltip\"\n (click)=\"action.click($event)\"\n >\n <si-icon [icon]=\"action.iconClass\" />\n </button>\n }\n </div>\n }\n @if (collapsible()) {\n <div class=\"si-split-part-collapse-button\">\n <button\n type=\"button\"\n class=\"btn btn-icon btn-tertiary-ghost si-split-button\"\n [attr.aria-label]=\"collapseLabel() | translate\"\n (click)=\"toggleCollapse()\"\n >\n <si-icon class=\"collapse-icon\" [icon]=\"collapseIconClass() ?? icons.elementDoubleRight\" />\n </button>\n </div>\n }\n </div>\n}\n\n@if (headerTemplate(); as headerTemplate) {\n <ng-container *ngTemplateOutlet=\"headerTemplate; context: headerContext\" />\n}\n\n<div\n class=\"si-split-part-content\"\n [class.d-none]=\"!removeContentOnCollapse() && collapsedState() && !collapseToMinSize()\"\n>\n @if (!removeContentOnCollapse() || !collapsedState()) {\n <ng-content />\n }\n</div>\n", styles: [":host{display:flex;flex-direction:column;overflow:hidden}.si-split-part-content{flex:1 1 auto;display:flex;overflow:hidden;flex-direction:column}.si-split-part-header{display:flex;flex-direction:row;flex:none;align-items:center;padding:var(--si-sys-sizing-spacing-y-30) var(--si-sys-sizing-spacing-x-30);background:var(--si-sys-background-0);block-size:40px}:host-context(.horizontal)>:host(.is-collapsed) .si-split-part-header{flex:auto;flex-direction:column;max-block-size:100%;padding:var(--si-sys-sizing-spacing-y-30) var(--si-sys-sizing-spacing-x-30)}:host-context(.horizontal)>:host(.is-collapsed) .si-split-part-header .si-split-part-title{inline-size:100%;writing-mode:vertical-rl;transform:rotate(180deg)}:host-context(.horizontal)>:host(.is-collapsed) .si-split-part-header .si-split-part-collapse-button{order:-1}.si-split-part-title{font-weight:600;flex:1}.si-split-part-actions{padding-inline:var(--si-sys-sizing-spacing-x-40);flex:0 0 auto}:host-context(.vertical)>:host .si-split-button{--orientation-rotate: rotate(90deg)}[dir=rtl] :host-context(.horizontal)>:host .si-split-button{--orientation-rtl: scaleX(-1)}:dir(rtl) :host-context(.horizontal)>:host .si-split-button{--orientation-rtl: scaleX(-1)}:host(.is-collapsed) .si-split-button{--collapse-rotate: rotate(180deg)}:host(.collapse-start) .si-split-button{--collapse-direction: rotate(180deg)}.si-split-button .collapse-icon{transform:var(--orientation-rotate, rotate(0)) var(--collapse-rotate, rotate(0)) var(--collapse-direction, rotate(0)) var(--orientation-rtl, scaleX(1))}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SiIconComponent, selector: "si-icon", inputs: ["icon"] }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }] });
239
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: SiSplitPartComponent, isStandalone: true, selector: "si-split-part", inputs: { actions: { classPropertyName: "actions", publicName: "actions", isSignal: true, isRequired: false, transformFunction: null }, collapsible: { classPropertyName: "collapsible", publicName: "collapsible", isSignal: true, isRequired: false, transformFunction: null }, collapseIconClass: { classPropertyName: "collapseIconClass", publicName: "collapseIconClass", isSignal: true, isRequired: false, transformFunction: null }, collapseToMinSize: { classPropertyName: "collapseToMinSize", publicName: "collapseToMinSize", isSignal: true, isRequired: false, transformFunction: null }, headerTemplate: { classPropertyName: "headerTemplate", publicName: "headerTemplate", isSignal: true, isRequired: false, transformFunction: null }, heading: { classPropertyName: "heading", publicName: "heading", isSignal: true, isRequired: false, transformFunction: null }, minSize: { classPropertyName: "minSize", publicName: "minSize", isSignal: true, isRequired: false, transformFunction: null }, removeContentOnCollapse: { classPropertyName: "removeContentOnCollapse", publicName: "removeContentOnCollapse", isSignal: true, isRequired: false, transformFunction: null }, showHeader: { classPropertyName: "showHeader", publicName: "showHeader", isSignal: true, isRequired: false, transformFunction: null }, collapseLabel: { classPropertyName: "collapseLabel", publicName: "collapseLabel", isSignal: true, isRequired: false, transformFunction: null }, stateId: { classPropertyName: "stateId", publicName: "stateId", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: true, transformFunction: null }, unit: { classPropertyName: "unit", publicName: "unit", isSignal: true, isRequired: true, transformFunction: null }, collapseOthers: { classPropertyName: "collapseOthers", publicName: "collapseOthers", isSignal: true, isRequired: false, transformFunction: null }, expanded: { classPropertyName: "expanded", publicName: "expanded", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { collapseChanged: "collapseChanged", stateChange: "stateChange" }, host: { properties: { "class.is-collapsed": "collapsedState()", "class.collapse-start": "collapseDirectionState() === \"to-start\"", "style.grid-area": "\"p-\" + this.index" } }, ngImport: i0, template: "@if (!headerTemplate() && showHeader()) {\n <div class=\"si-split-part-header\" [class.is-collapsed]=\"collapsedState()\">\n <div class=\"si-split-part-title text-truncate\">\n {{ heading() | translate }}\n </div>\n @if (!collapsedState()) {\n <div class=\"si-split-part-actions\">\n @for (action of actions(); track $index) {\n <button\n type=\"button\"\n class=\"btn btn-icon btn-tertiary-ghost si-split-button\"\n [title]=\"action.tooltip || ''\"\n [attr.aria-label]=\"action.tooltip\"\n (click)=\"action.click($event)\"\n >\n <si-icon [icon]=\"action.iconClass\" />\n </button>\n }\n </div>\n }\n @if (collapsible()) {\n <div class=\"si-split-part-collapse-button\">\n <button\n type=\"button\"\n class=\"btn btn-icon btn-tertiary-ghost si-split-button\"\n [attr.aria-label]=\"collapseLabel() | translate\"\n (click)=\"toggleCollapse()\"\n >\n <si-icon class=\"collapse-icon\" [icon]=\"collapseIconClass() ?? icons.elementDoubleRight\" />\n </button>\n </div>\n }\n </div>\n}\n\n@if (headerTemplate(); as headerTemplate) {\n <ng-container *ngTemplateOutlet=\"headerTemplate; context: headerContext\" />\n}\n\n<div\n class=\"si-split-part-content\"\n [class.d-none]=\"!removeContentOnCollapse() && collapsedState() && !collapseToMinSize()\"\n>\n @if (!removeContentOnCollapse() || !collapsedState()) {\n <ng-content />\n }\n</div>\n", styles: [":host{display:flex;flex-direction:column;overflow:hidden}.si-split-part-content{flex:1 1 auto;display:flex;overflow:hidden;flex-direction:column}.si-split-part-header{display:flex;flex-direction:row;flex:none;align-items:center;padding:var(--si-sys-sizing-spacing-y-30) var(--si-sys-sizing-spacing-x-30);background:var(--si-sys-background-0);block-size:40px}:host-context(.horizontal)>:host(.is-collapsed) .si-split-part-header{flex:auto;flex-direction:column;max-block-size:100%;padding:var(--si-sys-sizing-spacing-y-30) var(--si-sys-sizing-spacing-x-30)}:host-context(.horizontal)>:host(.is-collapsed) .si-split-part-header .si-split-part-title{inline-size:100%;writing-mode:vertical-rl;transform:rotate(180deg)}:host-context(.horizontal)>:host(.is-collapsed) .si-split-part-header .si-split-part-collapse-button{order:-1}.si-split-part-title{font-weight:600;flex:1}.si-split-part-actions{padding-inline:var(--si-sys-sizing-spacing-x-40);flex:0 0 auto}:host-context(.vertical)>:host .si-split-button{--orientation-rotate: rotate(90deg)}[dir=rtl] :host-context(.horizontal)>:host .si-split-button{--orientation-rtl: scaleX(-1)}:dir(rtl) :host-context(.horizontal)>:host .si-split-button{--orientation-rtl: scaleX(-1)}:host(.is-collapsed) .si-split-button{--collapse-rotate: rotate(180deg)}:host(.collapse-start) .si-split-button{--collapse-direction: rotate(180deg)}.si-split-button .collapse-icon{transform:var(--orientation-rotate, rotate(0)) var(--collapse-rotate, rotate(0)) var(--collapse-direction, rotate(0)) var(--orientation-rtl, scaleX(1))}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SiIconComponent, selector: "si-icon", inputs: ["icon"] }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }] });
248
240
  }
249
241
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: SiSplitPartComponent, decorators: [{
250
242
  type: Component,
@@ -253,7 +245,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
253
245
  '[class.collapse-start]': 'collapseDirectionState() === "to-start"',
254
246
  '[style.grid-area]': '"p-" + this.index'
255
247
  }, template: "@if (!headerTemplate() && showHeader()) {\n <div class=\"si-split-part-header\" [class.is-collapsed]=\"collapsedState()\">\n <div class=\"si-split-part-title text-truncate\">\n {{ heading() | translate }}\n </div>\n @if (!collapsedState()) {\n <div class=\"si-split-part-actions\">\n @for (action of actions(); track $index) {\n <button\n type=\"button\"\n class=\"btn btn-icon btn-tertiary-ghost si-split-button\"\n [title]=\"action.tooltip || ''\"\n [attr.aria-label]=\"action.tooltip\"\n (click)=\"action.click($event)\"\n >\n <si-icon [icon]=\"action.iconClass\" />\n </button>\n }\n </div>\n }\n @if (collapsible()) {\n <div class=\"si-split-part-collapse-button\">\n <button\n type=\"button\"\n class=\"btn btn-icon btn-tertiary-ghost si-split-button\"\n [attr.aria-label]=\"collapseLabel() | translate\"\n (click)=\"toggleCollapse()\"\n >\n <si-icon class=\"collapse-icon\" [icon]=\"collapseIconClass() ?? icons.elementDoubleRight\" />\n </button>\n </div>\n }\n </div>\n}\n\n@if (headerTemplate(); as headerTemplate) {\n <ng-container *ngTemplateOutlet=\"headerTemplate; context: headerContext\" />\n}\n\n<div\n class=\"si-split-part-content\"\n [class.d-none]=\"!removeContentOnCollapse() && collapsedState() && !collapseToMinSize()\"\n>\n @if (!removeContentOnCollapse() || !collapsedState()) {\n <ng-content />\n }\n</div>\n", styles: [":host{display:flex;flex-direction:column;overflow:hidden}.si-split-part-content{flex:1 1 auto;display:flex;overflow:hidden;flex-direction:column}.si-split-part-header{display:flex;flex-direction:row;flex:none;align-items:center;padding:var(--si-sys-sizing-spacing-y-30) var(--si-sys-sizing-spacing-x-30);background:var(--si-sys-background-0);block-size:40px}:host-context(.horizontal)>:host(.is-collapsed) .si-split-part-header{flex:auto;flex-direction:column;max-block-size:100%;padding:var(--si-sys-sizing-spacing-y-30) var(--si-sys-sizing-spacing-x-30)}:host-context(.horizontal)>:host(.is-collapsed) .si-split-part-header .si-split-part-title{inline-size:100%;writing-mode:vertical-rl;transform:rotate(180deg)}:host-context(.horizontal)>:host(.is-collapsed) .si-split-part-header .si-split-part-collapse-button{order:-1}.si-split-part-title{font-weight:600;flex:1}.si-split-part-actions{padding-inline:var(--si-sys-sizing-spacing-x-40);flex:0 0 auto}:host-context(.vertical)>:host .si-split-button{--orientation-rotate: rotate(90deg)}[dir=rtl] :host-context(.horizontal)>:host .si-split-button{--orientation-rtl: scaleX(-1)}:dir(rtl) :host-context(.horizontal)>:host .si-split-button{--orientation-rtl: scaleX(-1)}:host(.is-collapsed) .si-split-button{--collapse-rotate: rotate(180deg)}:host(.collapse-start) .si-split-button{--collapse-direction: rotate(180deg)}.si-split-button .collapse-icon{transform:var(--orientation-rotate, rotate(0)) var(--collapse-rotate, rotate(0)) var(--collapse-direction, rotate(0)) var(--orientation-rtl, scaleX(1))}\n"] }]
256
- }], ctorParameters: () => [], propDecorators: { actions: [{ type: i0.Input, args: [{ isSignal: true, alias: "actions", required: false }] }], collapsible: [{ type: i0.Input, args: [{ isSignal: true, alias: "collapsible", required: false }] }], collapseIconClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "collapseIconClass", required: false }] }], collapseToMinSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "collapseToMinSize", required: false }] }], headerTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "headerTemplate", required: false }] }], heading: [{ type: i0.Input, args: [{ isSignal: true, alias: "heading", required: false }] }], minSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "minSize", required: false }] }], removeContentOnCollapse: [{ type: i0.Input, args: [{ isSignal: true, alias: "removeContentOnCollapse", required: false }] }], scale: [{ type: i0.Input, args: [{ isSignal: true, alias: "scale", required: false }] }], showHeader: [{ type: i0.Input, args: [{ isSignal: true, alias: "showHeader", required: false }] }], collapseLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "collapseLabel", required: false }] }], stateId: [{ type: i0.Input, args: [{ isSignal: true, alias: "stateId", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: true }] }], unit: [{ type: i0.Input, args: [{ isSignal: true, alias: "unit", required: true }] }], collapseOthers: [{ type: i0.Input, args: [{ isSignal: true, alias: "collapseOthers", required: false }] }], expanded: [{ type: i0.Input, args: [{ isSignal: true, alias: "expanded", required: false }] }], collapseChanged: [{ type: i0.Output, args: ["collapseChanged"] }], stateChange: [{ type: i0.Output, args: ["stateChange"] }] } });
248
+ }], ctorParameters: () => [], propDecorators: { actions: [{ type: i0.Input, args: [{ isSignal: true, alias: "actions", required: false }] }], collapsible: [{ type: i0.Input, args: [{ isSignal: true, alias: "collapsible", required: false }] }], collapseIconClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "collapseIconClass", required: false }] }], collapseToMinSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "collapseToMinSize", required: false }] }], headerTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "headerTemplate", required: false }] }], heading: [{ type: i0.Input, args: [{ isSignal: true, alias: "heading", required: false }] }], minSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "minSize", required: false }] }], removeContentOnCollapse: [{ type: i0.Input, args: [{ isSignal: true, alias: "removeContentOnCollapse", required: false }] }], showHeader: [{ type: i0.Input, args: [{ isSignal: true, alias: "showHeader", required: false }] }], collapseLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "collapseLabel", required: false }] }], stateId: [{ type: i0.Input, args: [{ isSignal: true, alias: "stateId", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: true }] }], unit: [{ type: i0.Input, args: [{ isSignal: true, alias: "unit", required: true }] }], collapseOthers: [{ type: i0.Input, args: [{ isSignal: true, alias: "collapseOthers", required: false }] }], expanded: [{ type: i0.Input, args: [{ isSignal: true, alias: "expanded", required: false }] }], collapseChanged: [{ type: i0.Output, args: ["collapseChanged"] }], stateChange: [{ type: i0.Output, args: ["stateChange"] }] } });
257
249
 
258
250
  class SiSplitComponent {
259
251
  /**
@@ -388,7 +380,6 @@ class SiSplitComponent {
388
380
  const startPosition = this.getPosition(event);
389
381
  const minDelta = -1 * (beforeSize - gutter.before.minSize());
390
382
  const maxDelta = afterSize - afterPart.minSize();
391
- const containerSize = this.measureContainerSize();
392
383
  event.preventDefault(); // prevents text-selection
393
384
  this.ngZone.runOutsideAngular(() => {
394
385
  merge(fromEvent(this.document, 'mousemove'), fromEvent(this.document, 'touchmove'))
@@ -426,12 +417,18 @@ class SiSplitComponent {
426
417
  else {
427
418
  this.elementRef.nativeElement.style.setProperty('grid-template-columns', this.gridTemplateColumns());
428
419
  }
429
- this.ngZone.run(() => this.sizesChange.emit(this.parts().map(part => (part.actualSize() * 100) / containerSize)));
420
+ this.emitSizesChange();
430
421
  },
431
422
  complete: () => this.saveUIState()
432
423
  });
433
424
  });
434
425
  }
426
+ emitSizesChange() {
427
+ const containerSize = this.measureContainerSize();
428
+ if (containerSize > 0) {
429
+ this.ngZone.run(() => this.sizesChange.emit(this.parts().map(part => (part.actualSize() * 100) / containerSize)));
430
+ }
431
+ }
435
432
  measureContainerSize() {
436
433
  const rect = this.elementRef.nativeElement.getBoundingClientRect();
437
434
  if (this.orientation() === 'vertical') {
@@ -476,13 +473,13 @@ class SiSplitComponent {
476
473
  if (!uiState) {
477
474
  return;
478
475
  }
476
+ let restored = false;
479
477
  this.parts()
480
478
  .filter(part => part.stateId())
481
479
  .map(part => ({ part, state: uiState[part.stateId()] }))
482
- .filter((item) => !!item.state &&
483
- item.state.initialSize === item.part.size() &&
484
- item.state.initialUnit === item.part.unit())
480
+ .filter((item) => !!item.state && item.state.initialUnit === item.part.unit())
485
481
  .forEach(({ part, state }) => {
482
+ restored = true;
486
483
  if (part.unit() === 'px') {
487
484
  part.expandedSize.set(state.size);
488
485
  }
@@ -491,7 +488,12 @@ class SiSplitComponent {
491
488
  }
492
489
  part.collapsedState.set(!state.expanded);
493
490
  });
494
- setTimeout(() => this.refreshAllPartSizes());
491
+ setTimeout(() => {
492
+ this.refreshAllPartSizes();
493
+ if (restored) {
494
+ this.emitSizesChange();
495
+ }
496
+ });
495
497
  });
496
498
  }
497
499
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: SiSplitComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
@@ -1 +1 @@
1
- {"version":3,"file":"siemens-element-ng-split.mjs","sources":["../../../../projects/element-ng/split/si-split-part.component.ts","../../../../projects/element-ng/split/si-split-part.component.html","../../../../projects/element-ng/split/si-split.component.ts","../../../../projects/element-ng/split/si-split.component.html","../../../../projects/element-ng/split/si-split.module.ts","../../../../projects/element-ng/split/index.ts","../../../../projects/element-ng/split/siemens-element-ng-split.ts"],"sourcesContent":["/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport { NgTemplateOutlet } from '@angular/common';\nimport {\n booleanAttribute,\n Component,\n computed,\n effect,\n ElementRef,\n inject,\n input,\n linkedSignal,\n numberAttribute,\n output,\n signal,\n TemplateRef,\n untracked\n} from '@angular/core';\nimport { elementDoubleRight } from '@siemens/element-icons';\nimport { addIcons, SiIconComponent } from '@siemens/element-ng/icon';\nimport { SiTranslatePipe, t, TranslatableString } from '@siemens/element-translate-ng/translate';\n\nimport {\n Action,\n CollapseTo,\n PartState,\n Scale,\n SplitOrientation,\n SplitUnit\n} from './si-split.interfaces';\n\n@Component({\n selector: 'si-split-part',\n imports: [NgTemplateOutlet, SiIconComponent, SiTranslatePipe],\n templateUrl: './si-split-part.component.html',\n styleUrl: './si-split-part.component.scss',\n host: {\n '[class.is-collapsed]': 'collapsedState()',\n '[class.collapse-start]': 'collapseDirectionState() === \"to-start\"',\n '[style.grid-area]': '\"p-\" + this.index'\n }\n})\nexport class SiSplitPartComponent {\n protected readonly icons = addIcons({ elementDoubleRight });\n /**\n * Action buttons displayed in the split part header.\n *\n * @defaultValue []\n */\n readonly actions = input<Action[]>([]);\n /**\n * Defines whether and in which direction the split part can collapse.\n * When unset, the collapse button is hidden.\n *\n * @defaultValue undefined\n */\n readonly collapsible = input<CollapseTo>();\n\n /**\n * Sets the icon class that is used in the buttons of split parts to\n * collapse and uncollapse the parts.\n */\n readonly collapseIconClass = input<string | undefined>();\n\n /**\n * Collapse only to the given min size.\n *\n * @defaultValue false\n */\n readonly collapseToMinSize = input(false, { transform: booleanAttribute });\n\n /**\n * Custom template for the split part header. The template receives the component instance as implicit context.\n */\n readonly headerTemplate = input<TemplateRef<{ $implicit: SiSplitPartComponent }>>();\n\n /**\n * Sets the title of the split part header.\n */\n readonly heading = input<TranslatableString>();\n\n /**\n * Minimum size in px.\n *\n * @defaultValue 0\n */\n readonly minSize = input(0, { transform: numberAttribute });\n\n /**\n * When a split part is collapsed, the content gets hidden but it will\n * still remain within the DOM. If you want to remove and destroy the component\n * in collapsed mode and recreate it on un-collapse, set this property to\n * true.\n *\n * @defaultValue false\n */\n readonly removeContentOnCollapse = input(false, { transform: booleanAttribute });\n\n /**\n * Defines the behavior of the split part during scaling.\n * E.g. when set to `none`, the spit part will keep its current size even when the parent container grows or shrinks.\n *\n * @defaultValue 'auto'\n */\n readonly scale = input<Scale>('auto');\n\n /**\n * Defines if the header of the split part is visible. Default is true.\n *\n * @defaultValue true\n */\n readonly showHeader = input(true, { transform: booleanAttribute });\n /**\n * Aria label for collapse button. Needed for a11y\n *\n * @defaultValue\n * ```\n * t(() => $localize`:@@SI_SPLIT.COLLAPSE_LABEL:Collapse`)\n * ```\n */\n readonly collapseLabel = input<TranslatableString>(\n t(() => $localize`:@@SI_SPLIT.COLLAPSE_LABEL:Collapse`)\n );\n /**\n * An optional stateId to uniquely identify a component instance.\n * Required for persistence of ui state.\n */\n readonly stateId = input<string>();\n\n /**\n * Expanded size.\n */\n readonly size = input.required<number, number | string>({ transform: numberAttribute });\n\n /**\n * Unit for the configured {@link size}.\n */\n readonly unit = input.required<SplitUnit>();\n\n /**\n * This toggles the behavior when collapsing this split part.\n * If enabled, all split parts between this one and the end of the split in the respective direction will be collapsed if this part is collapsed.\n * If disabled, only this split part will be collapsed.\n *\n * @defaultValue false\n */\n readonly collapseOthers = input(false, { transform: booleanAttribute });\n\n /**\n * Sets the initial expanded or collapsed state of the split part.\n *\n * @defaultValue true\n */\n readonly expanded = input(true, { transform: booleanAttribute });\n\n /**\n * Emits when the part is collapsed or expanded.\n */\n readonly collapseChanged = output<boolean>();\n /**\n * Emits the part's expanded state and size after it is toggled.\n */\n readonly stateChange = output<PartState>();\n\n /** @internal */\n index = 0;\n /** @internal */\n readonly before = signal<SiSplitPartComponent | undefined>(undefined);\n /** @internal */\n readonly after = signal<SiSplitPartComponent | undefined>(undefined);\n\n /** @internal */\n readonly fractionalSize = linkedSignal(() => (this.unit() === 'fr' ? this.size() : undefined));\n\n /** @internal */\n readonly collapsedSize = computed(() => (this.collapseToMinSize() ? (this.minSize() ?? 40) : 40));\n\n /**\n * Internal, mutable collapsed state. Initialized from the {@link expanded} input but can be\n * overwritten while toggling, cascading to sibling parts or restoring the persisted ui state.\n * @internal\n */\n readonly collapsedState = linkedSignal(() => !this.expanded());\n\n /**\n * Internal, mutable collapse direction. Initialized from the {@link collapsible}\n * input but can be overwritten while cascading collapse state to sibling parts.\n * @internal\n */\n readonly collapseDirectionState = linkedSignal(() => this.collapsible());\n\n /**\n * Get collapsed state.\n * @returns True if the split part is collapsed, false is expanded.\n */\n get collapsed(): boolean {\n return this.collapsedState();\n }\n\n /** @internal */\n readonly expandedSize = linkedSignal({\n source: () => ({ size: this.size(), unit: this.unit() }),\n computation: source => (source.unit === 'fr' ? undefined : source.size)\n });\n\n /** @internal */\n readonly actualSize = computed(() => {\n if (this.collapsedState()) {\n return this.collapsedSize();\n }\n return this.expandedSize() ?? 0;\n });\n\n /** @internal */\n saveUIState!: () => void;\n\n /** @internal */\n readonly nextExpandedAfter = computed(() => {\n if (!this.collapsedState()) {\n return this as SiSplitPartComponent;\n }\n const after = this.after();\n const nextExpanded: SiSplitPartComponent = after ? after.nextExpandedAfter() : this;\n\n return nextExpanded;\n });\n\n private readonly elementRef = inject<ElementRef<HTMLElement>>(ElementRef);\n\n protected headerContext: { $implicit: SiSplitPartComponent } = {\n $implicit: this\n };\n\n constructor() {\n effect(() => {\n this.expanded();\n untracked(() => {\n if (this.collapseOthers()) {\n this.before()?.refreshCollapseToStart();\n this.after()?.refreshCollapsedToEnd();\n }\n });\n });\n }\n\n /** @internal */\n refreshSizePx(orientation: SplitOrientation): void {\n if (!this.collapsedState()) {\n const rect = this.elementRef.nativeElement.getBoundingClientRect();\n if (orientation === 'vertical') {\n this.expandedSize.set(rect.height);\n } else {\n this.expandedSize.set(rect.width);\n }\n }\n }\n\n /**\n * Toggles the collapsed or expanded state.\n */\n toggleCollapse(): void {\n this.collapsedState.update(v => !v);\n if (this.collapseOthers()) {\n this.before()?.refreshCollapseToStart();\n this.after()?.refreshCollapsedToEnd();\n }\n this.collapseChanged.emit(this.collapsedState());\n this.stateChange.emit({ expanded: !this.collapsedState(), size: this.actualSize() });\n this.saveUIState();\n }\n\n private refreshCollapsedToEnd(): void {\n const before = this.before();\n if (before?.collapsedState() && before.collapseDirectionState() === 'to-end') {\n this.collapsedState.set(true);\n this.collapseDirectionState.set('to-end');\n this.after()?.refreshCollapsedToEnd();\n }\n }\n\n private refreshCollapseToStart(): void {\n const after = this.after();\n if (after?.collapsedState() && after.collapseDirectionState() === 'to-start') {\n this.collapsedState.set(true);\n this.collapseDirectionState.set('to-start');\n this.before()?.refreshCollapseToStart();\n }\n }\n}\n","@if (!headerTemplate() && showHeader()) {\n <div class=\"si-split-part-header\" [class.is-collapsed]=\"collapsedState()\">\n <div class=\"si-split-part-title text-truncate\">\n {{ heading() | translate }}\n </div>\n @if (!collapsedState()) {\n <div class=\"si-split-part-actions\">\n @for (action of actions(); track $index) {\n <button\n type=\"button\"\n class=\"btn btn-icon btn-tertiary-ghost si-split-button\"\n [title]=\"action.tooltip || ''\"\n [attr.aria-label]=\"action.tooltip\"\n (click)=\"action.click($event)\"\n >\n <si-icon [icon]=\"action.iconClass\" />\n </button>\n }\n </div>\n }\n @if (collapsible()) {\n <div class=\"si-split-part-collapse-button\">\n <button\n type=\"button\"\n class=\"btn btn-icon btn-tertiary-ghost si-split-button\"\n [attr.aria-label]=\"collapseLabel() | translate\"\n (click)=\"toggleCollapse()\"\n >\n <si-icon class=\"collapse-icon\" [icon]=\"collapseIconClass() ?? icons.elementDoubleRight\" />\n </button>\n </div>\n }\n </div>\n}\n\n@if (headerTemplate(); as headerTemplate) {\n <ng-container *ngTemplateOutlet=\"headerTemplate; context: headerContext\" />\n}\n\n<div\n class=\"si-split-part-content\"\n [class.d-none]=\"!removeContentOnCollapse() && collapsedState() && !collapseToMinSize()\"\n>\n @if (!removeContentOnCollapse() || !collapsedState()) {\n <ng-content />\n }\n</div>\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport {\n ChangeDetectorRef,\n Component,\n computed,\n contentChildren,\n ElementRef,\n inject,\n input,\n NgZone,\n signal,\n Signal,\n DOCUMENT,\n DestroyRef,\n output\n} from '@angular/core';\nimport { takeUntilDestroyed, toObservable } from '@angular/core/rxjs-interop';\nimport {\n isRTL,\n SI_UI_STATE_SERVICE,\n WebComponentContentChildren\n} from '@siemens/element-ng/common';\nimport { asapScheduler, fromEvent, merge } from 'rxjs';\nimport { observeOn, takeUntil } from 'rxjs/operators';\n\nimport { SiSplitPartComponent } from './si-split-part.component';\nimport { SplitOrientation, SplitUnit } from './si-split.interfaces';\n\ninterface Gutter {\n before: SiSplitPartComponent;\n after: SiSplitPartComponent;\n visible: Signal<boolean>;\n}\n\ninterface SplitPartState {\n size: number;\n initialSize: number;\n initialUnit: SplitUnit;\n expanded: boolean;\n}\n\n@Component({\n selector: 'si-split',\n templateUrl: './si-split.component.html',\n styleUrl: './si-split.component.scss',\n host: {\n '[class]': 'orientation()',\n '[style.grid-template-rows]': 'gridTemplateRows()',\n '[style.grid-template-columns]': 'gridTemplateColumns()',\n '[style.grid-template-areas]': 'gridTemplateAreas()'\n }\n})\nexport class SiSplitComponent {\n /**\n * Size of the gutter (divider) between split parts in pixels.\n *\n * @defaultValue 16\n */\n readonly gutterSize = input(16);\n\n /**\n * Defines the split layout direction.\n *\n * @defaultValue 'horizontal'\n */\n readonly orientation = input<SplitOrientation>('horizontal');\n\n /**\n * An optional stateId to uniquely identify a component instance.\n * Required for persistence of ui state.\n */\n readonly stateId = input<string>();\n\n /**\n * Emits the sizes of all parts as percentages when the user resizes a gutter.\n */\n readonly sizesChange = output<number[]>();\n\n @WebComponentContentChildren(SiSplitPartComponent)\n protected readonly parts = contentChildren(SiSplitPartComponent);\n protected readonly gutters = signal<Gutter[]>([]);\n\n private readonly gridTemplate = computed(() => {\n if (!this.initialized()) {\n return '';\n }\n return this.parts()\n .map(part =>\n part.collapsedState()\n ? part.collapseToMinSize()\n ? `${part.minSize()}px`\n : 'min-content'\n : part.unit() === 'px'\n ? `minmax(${part.minSize()}px, ${part.expandedSize() ?? part.size()}px)`\n : `minmax(${part.minSize()}px, ${\n part.expandedSize() === undefined\n ? part.fractionalSize()! * this.fractionalSizeToExpandedSizeFactor()\n : part.fractionalSize()!\n }fr)`\n )\n .join(' min-content ');\n });\n\n protected readonly gridTemplateRows = computed(() =>\n this.orientation() === 'vertical' ? this.gridTemplate() : '1fr'\n );\n\n protected readonly gridTemplateColumns = computed(() =>\n this.orientation() === 'horizontal' ? this.gridTemplate() : '1fr'\n );\n\n protected readonly gridTemplateAreas = computed(() => {\n if (!this.initialized()) {\n return '';\n }\n const areaNames = this.parts()\n .map((part, index) => [`p-${index}`, part.after() ? `g-${index}` : []])\n .flat(2) as string[];\n\n if (this.orientation() === 'horizontal') {\n return `\"${areaNames.join(' ')}\"`;\n } else {\n return `\"${areaNames.join('\" \"')}\"`;\n }\n });\n\n private readonly elementRef = inject(ElementRef<HTMLElement>);\n private readonly ngZone = inject(NgZone);\n private readonly changeDetectorRef = inject(ChangeDetectorRef);\n private readonly document = inject(DOCUMENT);\n private readonly uiStateService = inject(SI_UI_STATE_SERVICE, { optional: true });\n private readonly destroyRef = inject(DestroyRef);\n // Existing fr parts are measured in pixels after layout or dragging, so their fr weights become\n // pixel-derived. A newly added fr part has not been measured yet and still has its configured\n // weight. This factor converts that configured weight into the same scale until it is measured.\n // It is the ratio of measured expanded sizes to configured weights of visible measured fr parts.\n private readonly fractionalSizeToExpandedSizeFactor = computed(() => {\n const measuredParts = this.parts().filter(\n part => !part.collapsedState() && part.unit() === 'fr' && part.expandedSize() !== undefined\n );\n const configuredSizeSum = measuredParts.reduce((sum, part) => sum + part.size(), 0);\n const expandedSizeSum = measuredParts.reduce((sum, part) => sum + part.expandedSize()!, 0);\n\n return configuredSizeSum ? expandedSizeSum / configuredSizeSum : 1;\n });\n private readonly initialized = signal(false);\n\n constructor() {\n toObservable(this.parts)\n .pipe(observeOn(asapScheduler), takeUntilDestroyed())\n .subscribe(() => this.setupParts());\n }\n\n private setupParts(): void {\n this.initialized.set(true);\n const gutters: Gutter[] = [];\n\n const parts = this.parts();\n for (let index = 0; index < parts.length; index++) {\n const component = parts[index];\n component.index = index;\n component.after.set(parts[index + 1]);\n component.before.set(parts[index - 1]);\n component.saveUIState = () => this.saveUIState();\n\n if (component.after()) {\n gutters.push({\n before: component,\n after: parts[index + 1]!,\n visible: computed(() => {\n const afterPart = component.after()!.nextExpandedAfter();\n return !afterPart.collapsedState() && !component.collapsedState();\n })\n });\n }\n }\n this.gutters.set(gutters);\n\n this.restoreFromUIState();\n setTimeout(() => this.refreshAllPartSizes());\n }\n\n private refreshAllPartSizes(): void {\n this.parts().forEach(part => {\n part.refreshSizePx(this.orientation());\n if (!part.collapsedState() && part.unit() === 'fr') {\n part.fractionalSize.set(part.expandedSize()!);\n }\n });\n }\n\n protected resizeStart(gutter: Gutter, event: Event): void {\n this.refreshAllPartSizes();\n this.changeDetectorRef.detectChanges();\n const afterPart = gutter.after.nextExpandedAfter();\n let beforeSize = gutter.before.expandedSize()!;\n let afterSize = afterPart.expandedSize()!;\n let appliedDelta = 0;\n const rtl = isRTL();\n const startPosition = this.getPosition(event);\n const minDelta = -1 * (beforeSize - gutter.before.minSize());\n const maxDelta = afterSize - afterPart.minSize();\n const containerSize = this.measureContainerSize();\n event.preventDefault(); // prevents text-selection\n\n this.ngZone.runOutsideAngular(() => {\n merge(fromEvent(this.document, 'mousemove'), fromEvent(this.document, 'touchmove'))\n .pipe(\n takeUntil(\n merge(fromEvent(this.document, 'mouseup'), fromEvent(this.document, 'touchend'))\n ),\n takeUntilDestroyed(this.destroyRef)\n )\n .subscribe({\n next: move => {\n let delta = this.getPosition(move) - startPosition;\n if (rtl && this.orientation() === 'horizontal') {\n delta *= -1;\n }\n\n delta -= appliedDelta;\n if (maxDelta < appliedDelta + delta) {\n delta = maxDelta - appliedDelta;\n } else if (minDelta > appliedDelta + delta) {\n delta = minDelta - appliedDelta;\n }\n\n if (delta === 0) {\n return;\n }\n\n beforeSize += delta;\n afterSize -= delta;\n appliedDelta += delta;\n gutter.before.expandedSize.set(beforeSize);\n afterPart.expandedSize.set(afterSize);\n if (gutter.before.unit() === 'fr') {\n gutter.before.fractionalSize.set(beforeSize);\n }\n if (afterPart.unit() === 'fr') {\n afterPart.fractionalSize.set(afterSize);\n }\n if (this.orientation() === 'vertical') {\n this.elementRef.nativeElement.style.setProperty(\n 'grid-template-rows',\n this.gridTemplateRows()\n );\n } else {\n this.elementRef.nativeElement.style.setProperty(\n 'grid-template-columns',\n this.gridTemplateColumns()\n );\n }\n this.ngZone.run(() =>\n this.sizesChange.emit(\n this.parts().map(part => (part.actualSize() * 100) / containerSize)\n )\n );\n },\n complete: () => this.saveUIState()\n });\n });\n }\n\n private measureContainerSize(): number {\n const rect = this.elementRef.nativeElement.getBoundingClientRect();\n if (this.orientation() === 'vertical') {\n return rect.height;\n } else {\n return rect.width;\n }\n }\n\n private getPosition(event: Event): number {\n const positionObject = (event as TouchEvent).touches?.[0] ?? (event as MouseEvent);\n return this.orientation() === 'horizontal'\n ? (positionObject.clientX ?? 0)\n : (positionObject.clientY ?? 0);\n }\n\n private saveUIState(): void {\n const stateId = this.stateId();\n if (!stateId || !this.uiStateService) {\n return;\n }\n\n const state = this.parts().reduce(\n (partState, part) => {\n const partStateId = part.stateId();\n if (partStateId) {\n const unit = part.unit();\n partState[partStateId] = {\n size: unit === 'px' ? part.expandedSize()! : part.fractionalSize()!,\n initialSize: part.size(),\n initialUnit: unit,\n expanded: !part.collapsedState()\n };\n }\n return partState;\n },\n {} as Record<string, SplitPartState>\n );\n\n this.uiStateService.save(stateId, state);\n }\n\n private restoreFromUIState(): void {\n const stateId = this.stateId();\n if (!stateId || !this.uiStateService) {\n return;\n }\n\n this.uiStateService.load<Record<string, SplitPartState>>(stateId).then(uiState => {\n if (!uiState) {\n return;\n }\n\n this.parts()\n .filter(part => part.stateId())\n .map(part => ({ part, state: uiState[part.stateId()!] }))\n .filter(\n (item): item is { part: SiSplitPartComponent; state: SplitPartState } =>\n !!item.state &&\n item.state.initialSize === item.part.size() &&\n item.state.initialUnit === item.part.unit()\n )\n .forEach(({ part, state }) => {\n if (part.unit() === 'px') {\n part.expandedSize.set(state.size);\n } else {\n part.fractionalSize.set(state.size);\n }\n part.collapsedState.set(!state.expanded);\n });\n setTimeout(() => this.refreshAllPartSizes());\n });\n }\n}\n","<ng-content />\n\n@for (gutter of gutters(); track $index) {\n @if ($index < parts().length - 1) {\n <div\n class=\"si-split-gutter\"\n [class.d-none]=\"!gutter.visible()\"\n [style.grid-area]=\"'g-' + $index\"\n [style.width.px]=\"orientation() === 'horizontal' ? gutterSize() : null\"\n [style.height.px]=\"orientation() === 'vertical' ? gutterSize() : null\"\n (mousedown)=\"resizeStart(gutter, $event)\"\n (touchstart)=\"resizeStart(gutter, $event)\"\n ></div>\n }\n}\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport { NgModule } from '@angular/core';\n\nimport { SiSplitPartComponent } from './si-split-part.component';\nimport { SiSplitComponent } from './si-split.component';\n\n@NgModule({\n imports: [SiSplitComponent, SiSplitPartComponent],\n exports: [SiSplitComponent, SiSplitPartComponent]\n})\nexport class SiSplitModule {}\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nexport * from './si-split.module';\nexport * from './si-split-part.component';\nexport * from './si-split.component';\nexport * from './si-split.interfaces';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"siemens-element-ng-split.mjs","sources":["../../../../projects/element-ng/split/si-split-part.component.ts","../../../../projects/element-ng/split/si-split-part.component.html","../../../../projects/element-ng/split/si-split.component.ts","../../../../projects/element-ng/split/si-split.component.html","../../../../projects/element-ng/split/si-split.module.ts","../../../../projects/element-ng/split/index.ts","../../../../projects/element-ng/split/siemens-element-ng-split.ts"],"sourcesContent":["/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport { NgTemplateOutlet } from '@angular/common';\nimport {\n booleanAttribute,\n Component,\n computed,\n effect,\n ElementRef,\n inject,\n input,\n linkedSignal,\n numberAttribute,\n output,\n signal,\n TemplateRef,\n untracked\n} from '@angular/core';\nimport { elementDoubleRight } from '@siemens/element-icons';\nimport { addIcons, SiIconComponent } from '@siemens/element-ng/icon';\nimport { SiTranslatePipe, t, TranslatableString } from '@siemens/element-translate-ng/translate';\n\nimport { Action, CollapseTo, PartState, SplitOrientation, SplitUnit } from './si-split.interfaces';\n\n@Component({\n selector: 'si-split-part',\n imports: [NgTemplateOutlet, SiIconComponent, SiTranslatePipe],\n templateUrl: './si-split-part.component.html',\n styleUrl: './si-split-part.component.scss',\n host: {\n '[class.is-collapsed]': 'collapsedState()',\n '[class.collapse-start]': 'collapseDirectionState() === \"to-start\"',\n '[style.grid-area]': '\"p-\" + this.index'\n }\n})\nexport class SiSplitPartComponent {\n protected readonly icons = addIcons({ elementDoubleRight });\n /**\n * Action buttons displayed in the split part header.\n *\n * @defaultValue []\n */\n readonly actions = input<Action[]>([]);\n /**\n * Defines whether and in which direction the split part can collapse.\n * When unset, the collapse button is hidden.\n *\n * @defaultValue undefined\n */\n readonly collapsible = input<CollapseTo>();\n\n /**\n * Sets the icon class that is used in the buttons of split parts to\n * collapse and uncollapse the parts.\n */\n readonly collapseIconClass = input<string | undefined>();\n\n /**\n * Collapse only to the given min size.\n *\n * @defaultValue false\n */\n readonly collapseToMinSize = input(false, { transform: booleanAttribute });\n\n /**\n * Custom template for the split part header. The template receives the component instance as implicit context.\n */\n readonly headerTemplate = input<TemplateRef<{ $implicit: SiSplitPartComponent }>>();\n\n /**\n * Sets the title of the split part header.\n */\n readonly heading = input<TranslatableString>();\n\n /**\n * Minimum size in px.\n *\n * @defaultValue 0\n */\n readonly minSize = input(0, { transform: numberAttribute });\n\n /**\n * When a split part is collapsed, the content gets hidden but it will\n * still remain within the DOM. If you want to remove and destroy the component\n * in collapsed mode and recreate it on un-collapse, set this property to\n * true.\n *\n * @defaultValue false\n */\n readonly removeContentOnCollapse = input(false, { transform: booleanAttribute });\n\n /**\n * Defines if the header of the split part is visible. Default is true.\n *\n * @defaultValue true\n */\n readonly showHeader = input(true, { transform: booleanAttribute });\n /**\n * Aria label for collapse button. Needed for a11y\n *\n * @defaultValue\n * ```\n * t(() => $localize`:@@SI_SPLIT.COLLAPSE_LABEL:Collapse`)\n * ```\n */\n readonly collapseLabel = input<TranslatableString>(\n t(() => $localize`:@@SI_SPLIT.COLLAPSE_LABEL:Collapse`)\n );\n /**\n * An optional stateId to uniquely identify a component instance.\n * Required for persistence of ui state.\n */\n readonly stateId = input<string>();\n\n /**\n * Expanded size.\n */\n readonly size = input.required<number, number | string>({ transform: numberAttribute });\n\n /**\n * Unit for the configured {@link size}.\n */\n readonly unit = input.required<SplitUnit>();\n\n /**\n * This toggles the behavior when collapsing this split part.\n * If enabled, all split parts between this one and the end of the split in the respective direction will be collapsed if this part is collapsed.\n * If disabled, only this split part will be collapsed.\n *\n * @defaultValue false\n */\n readonly collapseOthers = input(false, { transform: booleanAttribute });\n\n /**\n * Sets the initial expanded or collapsed state of the split part.\n *\n * @defaultValue true\n */\n readonly expanded = input(true, { transform: booleanAttribute });\n\n /**\n * Emits when the part is collapsed or expanded.\n */\n readonly collapseChanged = output<boolean>();\n /**\n * Emits the part's expanded state and size after it is toggled.\n */\n readonly stateChange = output<PartState>();\n\n /** @internal */\n index = 0;\n /** @internal */\n readonly before = signal<SiSplitPartComponent | undefined>(undefined);\n /** @internal */\n readonly after = signal<SiSplitPartComponent | undefined>(undefined);\n\n /** @internal */\n readonly fractionalSize = linkedSignal(() => (this.unit() === 'fr' ? this.size() : undefined));\n\n /** @internal */\n readonly collapsedSize = computed(() => (this.collapseToMinSize() ? (this.minSize() ?? 40) : 40));\n\n /**\n * Internal, mutable collapsed state. Initialized from the {@link expanded} input but can be\n * overwritten while toggling, cascading to sibling parts or restoring the persisted ui state.\n * @internal\n */\n readonly collapsedState = linkedSignal(() => !this.expanded());\n\n /**\n * Internal, mutable collapse direction. Initialized from the {@link collapsible}\n * input but can be overwritten while cascading collapse state to sibling parts.\n * @internal\n */\n readonly collapseDirectionState = linkedSignal(() => this.collapsible());\n\n /**\n * Get collapsed state.\n * @returns True if the split part is collapsed, false is expanded.\n */\n get collapsed(): boolean {\n return this.collapsedState();\n }\n\n /** @internal */\n readonly expandedSize = linkedSignal({\n source: () => ({ size: this.size(), unit: this.unit() }),\n computation: source => (source.unit === 'fr' ? undefined : source.size)\n });\n\n /** @internal */\n readonly actualSize = computed(() => {\n if (this.collapsedState()) {\n return this.collapsedSize();\n }\n return this.expandedSize() ?? 0;\n });\n\n /** @internal */\n saveUIState!: () => void;\n\n /** @internal */\n readonly nextExpandedAfter = computed(() => {\n if (!this.collapsedState()) {\n return this as SiSplitPartComponent;\n }\n const after = this.after();\n const nextExpanded: SiSplitPartComponent = after ? after.nextExpandedAfter() : this;\n\n return nextExpanded;\n });\n\n private readonly elementRef = inject<ElementRef<HTMLElement>>(ElementRef);\n\n protected headerContext: { $implicit: SiSplitPartComponent } = {\n $implicit: this\n };\n\n constructor() {\n effect(() => {\n this.expanded();\n untracked(() => {\n if (this.collapseOthers()) {\n this.before()?.refreshCollapseToStart();\n this.after()?.refreshCollapsedToEnd();\n }\n });\n });\n }\n\n /** @internal */\n refreshSizePx(orientation: SplitOrientation): void {\n if (!this.collapsedState()) {\n const rect = this.elementRef.nativeElement.getBoundingClientRect();\n if (orientation === 'vertical') {\n this.expandedSize.set(rect.height);\n } else {\n this.expandedSize.set(rect.width);\n }\n }\n }\n\n /**\n * Toggles the collapsed or expanded state.\n */\n toggleCollapse(): void {\n this.collapsedState.update(v => !v);\n if (this.collapseOthers()) {\n this.before()?.refreshCollapseToStart();\n this.after()?.refreshCollapsedToEnd();\n }\n this.collapseChanged.emit(this.collapsedState());\n this.stateChange.emit({ expanded: !this.collapsedState(), size: this.actualSize() });\n this.saveUIState();\n }\n\n private refreshCollapsedToEnd(): void {\n const before = this.before();\n if (before?.collapsedState() && before.collapseDirectionState() === 'to-end') {\n this.collapsedState.set(true);\n this.collapseDirectionState.set('to-end');\n this.after()?.refreshCollapsedToEnd();\n }\n }\n\n private refreshCollapseToStart(): void {\n const after = this.after();\n if (after?.collapsedState() && after.collapseDirectionState() === 'to-start') {\n this.collapsedState.set(true);\n this.collapseDirectionState.set('to-start');\n this.before()?.refreshCollapseToStart();\n }\n }\n}\n","@if (!headerTemplate() && showHeader()) {\n <div class=\"si-split-part-header\" [class.is-collapsed]=\"collapsedState()\">\n <div class=\"si-split-part-title text-truncate\">\n {{ heading() | translate }}\n </div>\n @if (!collapsedState()) {\n <div class=\"si-split-part-actions\">\n @for (action of actions(); track $index) {\n <button\n type=\"button\"\n class=\"btn btn-icon btn-tertiary-ghost si-split-button\"\n [title]=\"action.tooltip || ''\"\n [attr.aria-label]=\"action.tooltip\"\n (click)=\"action.click($event)\"\n >\n <si-icon [icon]=\"action.iconClass\" />\n </button>\n }\n </div>\n }\n @if (collapsible()) {\n <div class=\"si-split-part-collapse-button\">\n <button\n type=\"button\"\n class=\"btn btn-icon btn-tertiary-ghost si-split-button\"\n [attr.aria-label]=\"collapseLabel() | translate\"\n (click)=\"toggleCollapse()\"\n >\n <si-icon class=\"collapse-icon\" [icon]=\"collapseIconClass() ?? icons.elementDoubleRight\" />\n </button>\n </div>\n }\n </div>\n}\n\n@if (headerTemplate(); as headerTemplate) {\n <ng-container *ngTemplateOutlet=\"headerTemplate; context: headerContext\" />\n}\n\n<div\n class=\"si-split-part-content\"\n [class.d-none]=\"!removeContentOnCollapse() && collapsedState() && !collapseToMinSize()\"\n>\n @if (!removeContentOnCollapse() || !collapsedState()) {\n <ng-content />\n }\n</div>\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport {\n ChangeDetectorRef,\n Component,\n computed,\n contentChildren,\n ElementRef,\n inject,\n input,\n NgZone,\n signal,\n Signal,\n DOCUMENT,\n DestroyRef,\n output\n} from '@angular/core';\nimport { takeUntilDestroyed, toObservable } from '@angular/core/rxjs-interop';\nimport {\n isRTL,\n SI_UI_STATE_SERVICE,\n WebComponentContentChildren\n} from '@siemens/element-ng/common';\nimport { asapScheduler, fromEvent, merge } from 'rxjs';\nimport { observeOn, takeUntil } from 'rxjs/operators';\n\nimport { SiSplitPartComponent } from './si-split-part.component';\nimport { SplitOrientation, SplitUnit } from './si-split.interfaces';\n\ninterface Gutter {\n before: SiSplitPartComponent;\n after: SiSplitPartComponent;\n visible: Signal<boolean>;\n}\n\ninterface SplitPartState {\n size: number;\n initialSize: number;\n initialUnit: SplitUnit;\n expanded: boolean;\n}\n\n@Component({\n selector: 'si-split',\n templateUrl: './si-split.component.html',\n styleUrl: './si-split.component.scss',\n host: {\n '[class]': 'orientation()',\n '[style.grid-template-rows]': 'gridTemplateRows()',\n '[style.grid-template-columns]': 'gridTemplateColumns()',\n '[style.grid-template-areas]': 'gridTemplateAreas()'\n }\n})\nexport class SiSplitComponent {\n /**\n * Size of the gutter (divider) between split parts in pixels.\n *\n * @defaultValue 16\n */\n readonly gutterSize = input(16);\n\n /**\n * Defines the split layout direction.\n *\n * @defaultValue 'horizontal'\n */\n readonly orientation = input<SplitOrientation>('horizontal');\n\n /**\n * An optional stateId to uniquely identify a component instance.\n * Required for persistence of ui state.\n */\n readonly stateId = input<string>();\n\n /**\n * Emits the sizes of all parts as percentages when the user resizes a gutter.\n */\n readonly sizesChange = output<number[]>();\n\n @WebComponentContentChildren(SiSplitPartComponent)\n protected readonly parts = contentChildren(SiSplitPartComponent);\n protected readonly gutters = signal<Gutter[]>([]);\n\n private readonly gridTemplate = computed(() => {\n if (!this.initialized()) {\n return '';\n }\n return this.parts()\n .map(part =>\n part.collapsedState()\n ? part.collapseToMinSize()\n ? `${part.minSize()}px`\n : 'min-content'\n : part.unit() === 'px'\n ? `minmax(${part.minSize()}px, ${part.expandedSize() ?? part.size()}px)`\n : `minmax(${part.minSize()}px, ${\n part.expandedSize() === undefined\n ? part.fractionalSize()! * this.fractionalSizeToExpandedSizeFactor()\n : part.fractionalSize()!\n }fr)`\n )\n .join(' min-content ');\n });\n\n protected readonly gridTemplateRows = computed(() =>\n this.orientation() === 'vertical' ? this.gridTemplate() : '1fr'\n );\n\n protected readonly gridTemplateColumns = computed(() =>\n this.orientation() === 'horizontal' ? this.gridTemplate() : '1fr'\n );\n\n protected readonly gridTemplateAreas = computed(() => {\n if (!this.initialized()) {\n return '';\n }\n const areaNames = this.parts()\n .map((part, index) => [`p-${index}`, part.after() ? `g-${index}` : []])\n .flat(2) as string[];\n\n if (this.orientation() === 'horizontal') {\n return `\"${areaNames.join(' ')}\"`;\n } else {\n return `\"${areaNames.join('\" \"')}\"`;\n }\n });\n\n private readonly elementRef = inject(ElementRef<HTMLElement>);\n private readonly ngZone = inject(NgZone);\n private readonly changeDetectorRef = inject(ChangeDetectorRef);\n private readonly document = inject(DOCUMENT);\n private readonly uiStateService = inject(SI_UI_STATE_SERVICE, { optional: true });\n private readonly destroyRef = inject(DestroyRef);\n // Existing fr parts are measured in pixels after layout or dragging, so their fr weights become\n // pixel-derived. A newly added fr part has not been measured yet and still has its configured\n // weight. This factor converts that configured weight into the same scale until it is measured.\n // It is the ratio of measured expanded sizes to configured weights of visible measured fr parts.\n private readonly fractionalSizeToExpandedSizeFactor = computed(() => {\n const measuredParts = this.parts().filter(\n part => !part.collapsedState() && part.unit() === 'fr' && part.expandedSize() !== undefined\n );\n const configuredSizeSum = measuredParts.reduce((sum, part) => sum + part.size(), 0);\n const expandedSizeSum = measuredParts.reduce((sum, part) => sum + part.expandedSize()!, 0);\n\n return configuredSizeSum ? expandedSizeSum / configuredSizeSum : 1;\n });\n private readonly initialized = signal(false);\n\n constructor() {\n toObservable(this.parts)\n .pipe(observeOn(asapScheduler), takeUntilDestroyed())\n .subscribe(() => this.setupParts());\n }\n\n private setupParts(): void {\n this.initialized.set(true);\n const gutters: Gutter[] = [];\n\n const parts = this.parts();\n for (let index = 0; index < parts.length; index++) {\n const component = parts[index];\n component.index = index;\n component.after.set(parts[index + 1]);\n component.before.set(parts[index - 1]);\n component.saveUIState = () => this.saveUIState();\n\n if (component.after()) {\n gutters.push({\n before: component,\n after: parts[index + 1]!,\n visible: computed(() => {\n const afterPart = component.after()!.nextExpandedAfter();\n return !afterPart.collapsedState() && !component.collapsedState();\n })\n });\n }\n }\n this.gutters.set(gutters);\n\n this.restoreFromUIState();\n setTimeout(() => this.refreshAllPartSizes());\n }\n\n private refreshAllPartSizes(): void {\n this.parts().forEach(part => {\n part.refreshSizePx(this.orientation());\n if (!part.collapsedState() && part.unit() === 'fr') {\n part.fractionalSize.set(part.expandedSize()!);\n }\n });\n }\n\n protected resizeStart(gutter: Gutter, event: Event): void {\n this.refreshAllPartSizes();\n this.changeDetectorRef.detectChanges();\n const afterPart = gutter.after.nextExpandedAfter();\n let beforeSize = gutter.before.expandedSize()!;\n let afterSize = afterPart.expandedSize()!;\n let appliedDelta = 0;\n const rtl = isRTL();\n const startPosition = this.getPosition(event);\n const minDelta = -1 * (beforeSize - gutter.before.minSize());\n const maxDelta = afterSize - afterPart.minSize();\n event.preventDefault(); // prevents text-selection\n\n this.ngZone.runOutsideAngular(() => {\n merge(fromEvent(this.document, 'mousemove'), fromEvent(this.document, 'touchmove'))\n .pipe(\n takeUntil(\n merge(fromEvent(this.document, 'mouseup'), fromEvent(this.document, 'touchend'))\n ),\n takeUntilDestroyed(this.destroyRef)\n )\n .subscribe({\n next: move => {\n let delta = this.getPosition(move) - startPosition;\n if (rtl && this.orientation() === 'horizontal') {\n delta *= -1;\n }\n\n delta -= appliedDelta;\n if (maxDelta < appliedDelta + delta) {\n delta = maxDelta - appliedDelta;\n } else if (minDelta > appliedDelta + delta) {\n delta = minDelta - appliedDelta;\n }\n\n if (delta === 0) {\n return;\n }\n\n beforeSize += delta;\n afterSize -= delta;\n appliedDelta += delta;\n gutter.before.expandedSize.set(beforeSize);\n afterPart.expandedSize.set(afterSize);\n if (gutter.before.unit() === 'fr') {\n gutter.before.fractionalSize.set(beforeSize);\n }\n if (afterPart.unit() === 'fr') {\n afterPart.fractionalSize.set(afterSize);\n }\n if (this.orientation() === 'vertical') {\n this.elementRef.nativeElement.style.setProperty(\n 'grid-template-rows',\n this.gridTemplateRows()\n );\n } else {\n this.elementRef.nativeElement.style.setProperty(\n 'grid-template-columns',\n this.gridTemplateColumns()\n );\n }\n this.emitSizesChange();\n },\n complete: () => this.saveUIState()\n });\n });\n }\n\n private emitSizesChange(): void {\n const containerSize = this.measureContainerSize();\n if (containerSize > 0) {\n this.ngZone.run(() =>\n this.sizesChange.emit(this.parts().map(part => (part.actualSize() * 100) / containerSize))\n );\n }\n }\n\n private measureContainerSize(): number {\n const rect = this.elementRef.nativeElement.getBoundingClientRect();\n if (this.orientation() === 'vertical') {\n return rect.height;\n } else {\n return rect.width;\n }\n }\n\n private getPosition(event: Event): number {\n const positionObject = (event as TouchEvent).touches?.[0] ?? (event as MouseEvent);\n return this.orientation() === 'horizontal'\n ? (positionObject.clientX ?? 0)\n : (positionObject.clientY ?? 0);\n }\n\n private saveUIState(): void {\n const stateId = this.stateId();\n if (!stateId || !this.uiStateService) {\n return;\n }\n\n const state = this.parts().reduce(\n (partState, part) => {\n const partStateId = part.stateId();\n if (partStateId) {\n const unit = part.unit();\n partState[partStateId] = {\n size: unit === 'px' ? part.expandedSize()! : part.fractionalSize()!,\n initialSize: part.size(),\n initialUnit: unit,\n expanded: !part.collapsedState()\n };\n }\n return partState;\n },\n {} as Record<string, SplitPartState>\n );\n\n this.uiStateService.save(stateId, state);\n }\n\n private restoreFromUIState(): void {\n const stateId = this.stateId();\n if (!stateId || !this.uiStateService) {\n return;\n }\n\n this.uiStateService.load<Record<string, SplitPartState>>(stateId).then(uiState => {\n if (!uiState) {\n return;\n }\n\n let restored = false;\n this.parts()\n .filter(part => part.stateId())\n .map(part => ({ part, state: uiState[part.stateId()!] }))\n .filter(\n (item): item is { part: SiSplitPartComponent; state: SplitPartState } =>\n !!item.state && item.state.initialUnit === item.part.unit()\n )\n .forEach(({ part, state }) => {\n restored = true;\n if (part.unit() === 'px') {\n part.expandedSize.set(state.size);\n } else {\n part.fractionalSize.set(state.size);\n }\n part.collapsedState.set(!state.expanded);\n });\n setTimeout(() => {\n this.refreshAllPartSizes();\n if (restored) {\n this.emitSizesChange();\n }\n });\n });\n }\n}\n","<ng-content />\n\n@for (gutter of gutters(); track $index) {\n @if ($index < parts().length - 1) {\n <div\n class=\"si-split-gutter\"\n [class.d-none]=\"!gutter.visible()\"\n [style.grid-area]=\"'g-' + $index\"\n [style.width.px]=\"orientation() === 'horizontal' ? gutterSize() : null\"\n [style.height.px]=\"orientation() === 'vertical' ? gutterSize() : null\"\n (mousedown)=\"resizeStart(gutter, $event)\"\n (touchstart)=\"resizeStart(gutter, $event)\"\n ></div>\n }\n}\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport { NgModule } from '@angular/core';\n\nimport { SiSplitPartComponent } from './si-split-part.component';\nimport { SiSplitComponent } from './si-split.component';\n\n@NgModule({\n imports: [SiSplitComponent, SiSplitPartComponent],\n exports: [SiSplitComponent, SiSplitPartComponent]\n})\nexport class SiSplitModule {}\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nexport * from './si-split.module';\nexport * from './si-split-part.component';\nexport * from './si-split.component';\nexport * from './si-split.interfaces';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;;;;;;AAAA;;;AAGG;MAkCU,oBAAoB,CAAA;AACZ,IAAA,KAAK,GAAG,QAAQ,CAAC,EAAE,kBAAkB,EAAE,CAAC;AAC3D;;;;AAIG;IACM,OAAO,GAAG,KAAK,CAAW,EAAE;gFAAC;AACtC;;;;;AAKG;AACM,IAAA,WAAW,GAAG,KAAK;+FAAc;AAE1C;;;AAGG;AACM,IAAA,iBAAiB,GAAG,KAAK;qGAAsB;AAExD;;;;AAIG;IACM,iBAAiB,GAAG,KAAK,CAAC,KAAK,yFAAI,SAAS,EAAE,gBAAgB,EAAA,CAAG;AAE1E;;AAEG;AACM,IAAA,cAAc,GAAG,KAAK;kGAAoD;AAEnF;;AAEG;AACM,IAAA,OAAO,GAAG,KAAK;2FAAsB;AAE9C;;;;AAIG;IACM,OAAO,GAAG,KAAK,CAAC,CAAC,+EAAI,SAAS,EAAE,eAAe,EAAA,CAAG;AAE3D;;;;;;;AAOG;IACM,uBAAuB,GAAG,KAAK,CAAC,KAAK,+FAAI,SAAS,EAAE,gBAAgB,EAAA,CAAG;AAEhF;;;;AAIG;IACM,UAAU,GAAG,KAAK,CAAC,IAAI,kFAAI,SAAS,EAAE,gBAAgB,EAAA,CAAG;AAClE;;;;;;;AAOG;IACM,aAAa,GAAG,KAAK,CAC5B,CAAC,CAAC,MAAM,SAAS,CAAA,CAAA,mCAAA,CAAqC,CAAC;sFACxD;AACD;;;AAGG;AACM,IAAA,OAAO,GAAG,KAAK;2FAAU;AAElC;;AAEG;IACM,IAAI,GAAG,KAAK,CAAC,QAAQ,2EAA4B,SAAS,EAAE,eAAe,EAAA,CAAG;AAEvF;;AAEG;IACM,IAAI,GAAG,KAAK,CAAC,QAAQ;6EAAa;AAE3C;;;;;;AAMG;IACM,cAAc,GAAG,KAAK,CAAC,KAAK,sFAAI,SAAS,EAAE,gBAAgB,EAAA,CAAG;AAEvE;;;;AAIG;IACM,QAAQ,GAAG,KAAK,CAAC,IAAI,gFAAI,SAAS,EAAE,gBAAgB,EAAA,CAAG;AAEhE;;AAEG;IACM,eAAe,GAAG,MAAM,EAAW;AAC5C;;AAEG;IACM,WAAW,GAAG,MAAM,EAAa;;IAG1C,KAAK,GAAG,CAAC;;IAEA,MAAM,GAAG,MAAM,CAAmC,SAAS;+EAAC;;IAE5D,KAAK,GAAG,MAAM,CAAmC,SAAS;8EAAC;;IAG3D,cAAc,GAAG,YAAY,CAAC,OAAO,IAAI,CAAC,IAAI,EAAE,KAAK,IAAI,GAAG,IAAI,CAAC,IAAI,EAAE,GAAG,SAAS,CAAC;uFAAC;;IAGrF,aAAa,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,iBAAiB,EAAE,IAAI,IAAI,CAAC,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC;sFAAC;AAEjG;;;;AAIG;IACM,cAAc,GAAG,YAAY,CAAC,MAAM,CAAC,IAAI,CAAC,QAAQ,EAAE;uFAAC;AAE9D;;;;AAIG;IACM,sBAAsB,GAAG,YAAY,CAAC,MAAM,IAAI,CAAC,WAAW,EAAE;+FAAC;AAExE;;;AAGG;AACH,IAAA,IAAI,SAAS,GAAA;AACX,QAAA,OAAO,IAAI,CAAC,cAAc,EAAE;IAC9B;;IAGS,YAAY,GAAG,YAAY,CAAA,EAAA,IAAA,SAAA,GAAA,EAAA,SAAA,EAAA,cAAA,EAAA,8BAAA,EAAA,CAAA,EAClC,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,EAAE,CAAC;QACxD,WAAW,EAAE,MAAM,KAAK,MAAM,CAAC,IAAI,KAAK,IAAI,GAAG,SAAS,GAAG,MAAM,CAAC,IAAI,CAAC,EAAA,CACvE;;AAGO,IAAA,UAAU,GAAG,QAAQ,CAAC,MAAK;AAClC,QAAA,IAAI,IAAI,CAAC,cAAc,EAAE,EAAE;AACzB,YAAA,OAAO,IAAI,CAAC,aAAa,EAAE;QAC7B;AACA,QAAA,OAAO,IAAI,CAAC,YAAY,EAAE,IAAI,CAAC;IACjC,CAAC;mFAAC;;AAGF,IAAA,WAAW;;AAGF,IAAA,iBAAiB,GAAG,QAAQ,CAAC,MAAK;AACzC,QAAA,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE,EAAE;AAC1B,YAAA,OAAO,IAA4B;QACrC;AACA,QAAA,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,EAAE;AAC1B,QAAA,MAAM,YAAY,GAAyB,KAAK,GAAG,KAAK,CAAC,iBAAiB,EAAE,GAAG,IAAI;AAEnF,QAAA,OAAO,YAAY;IACrB,CAAC;0FAAC;AAEe,IAAA,UAAU,GAAG,MAAM,CAA0B,UAAU,CAAC;AAE/D,IAAA,aAAa,GAAwC;AAC7D,QAAA,SAAS,EAAE;KACZ;AAED,IAAA,WAAA,GAAA;QACE,MAAM,CAAC,MAAK;YACV,IAAI,CAAC,QAAQ,EAAE;YACf,SAAS,CAAC,MAAK;AACb,gBAAA,IAAI,IAAI,CAAC,cAAc,EAAE,EAAE;AACzB,oBAAA,IAAI,CAAC,MAAM,EAAE,EAAE,sBAAsB,EAAE;AACvC,oBAAA,IAAI,CAAC,KAAK,EAAE,EAAE,qBAAqB,EAAE;gBACvC;AACF,YAAA,CAAC,CAAC;AACJ,QAAA,CAAC,CAAC;IACJ;;AAGA,IAAA,aAAa,CAAC,WAA6B,EAAA;AACzC,QAAA,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE,EAAE;YAC1B,MAAM,IAAI,GAAG,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,qBAAqB,EAAE;AAClE,YAAA,IAAI,WAAW,KAAK,UAAU,EAAE;gBAC9B,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC,IAAI,CAAC,MAAM,CAAC;YACpC;iBAAO;gBACL,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC;YACnC;QACF;IACF;AAEA;;AAEG;IACH,cAAc,GAAA;AACZ,QAAA,IAAI,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC;AACnC,QAAA,IAAI,IAAI,CAAC,cAAc,EAAE,EAAE;AACzB,YAAA,IAAI,CAAC,MAAM,EAAE,EAAE,sBAAsB,EAAE;AACvC,YAAA,IAAI,CAAC,KAAK,EAAE,EAAE,qBAAqB,EAAE;QACvC;QACA,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE,CAAC;QAChD,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,EAAE,QAAQ,EAAE,CAAC,IAAI,CAAC,cAAc,EAAE,EAAE,IAAI,EAAE,IAAI,CAAC,UAAU,EAAE,EAAE,CAAC;QACpF,IAAI,CAAC,WAAW,EAAE;IACpB;IAEQ,qBAAqB,GAAA;AAC3B,QAAA,MAAM,MAAM,GAAG,IAAI,CAAC,MAAM,EAAE;AAC5B,QAAA,IAAI,MAAM,EAAE,cAAc,EAAE,IAAI,MAAM,CAAC,sBAAsB,EAAE,KAAK,QAAQ,EAAE;AAC5E,YAAA,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,IAAI,CAAC;AAC7B,YAAA,IAAI,CAAC,sBAAsB,CAAC,GAAG,CAAC,QAAQ,CAAC;AACzC,YAAA,IAAI,CAAC,KAAK,EAAE,EAAE,qBAAqB,EAAE;QACvC;IACF;IAEQ,sBAAsB,GAAA;AAC5B,QAAA,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,EAAE;AAC1B,QAAA,IAAI,KAAK,EAAE,cAAc,EAAE,IAAI,KAAK,CAAC,sBAAsB,EAAE,KAAK,UAAU,EAAE;AAC5E,YAAA,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,IAAI,CAAC;AAC7B,YAAA,IAAI,CAAC,sBAAsB,CAAC,GAAG,CAAC,UAAU,CAAC;AAC3C,YAAA,IAAI,CAAC,MAAM,EAAE,EAAE,sBAAsB,EAAE;QACzC;IACF;uGA7OW,oBAAoB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAApB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,oBAAoB,m2ECrCjC,2hDA+CA,EAAA,MAAA,EAAA,CAAA,mhDAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EDnBY,gBAAgB,EAAA,QAAA,EAAA,oBAAA,EAAA,MAAA,EAAA,CAAA,yBAAA,EAAA,kBAAA,EAAA,0BAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAE,eAAe,iEAAE,eAAe,EAAA,IAAA,EAAA,WAAA,EAAA,CAAA,EAAA,CAAA;;2FASjD,oBAAoB,EAAA,UAAA,EAAA,CAAA;kBAXhC,SAAS;+BACE,eAAe,EAAA,OAAA,EAChB,CAAC,gBAAgB,EAAE,eAAe,EAAE,eAAe,CAAC,EAAA,IAAA,EAGvD;AACJ,wBAAA,sBAAsB,EAAE,kBAAkB;AAC1C,wBAAA,wBAAwB,EAAE,yCAAyC;AACnE,wBAAA,mBAAmB,EAAE;AACtB,qBAAA,EAAA,QAAA,EAAA,2hDAAA,EAAA,MAAA,EAAA,CAAA,mhDAAA,CAAA,EAAA;;;MEoBU,gBAAgB,CAAA;AAC3B;;;;AAIG;IACM,UAAU,GAAG,KAAK,CAAC,EAAE;mFAAC;AAE/B;;;;AAIG;IACM,WAAW,GAAG,KAAK,CAAmB,YAAY;oFAAC;AAE5D;;;AAGG;AACM,IAAA,OAAO,GAAG,KAAK;2FAAU;AAElC;;AAEG;IACM,WAAW,GAAG,MAAM,EAAY;IAGtB,KAAK,GAAG,eAAe,CAAC,oBAAoB;8EAAC;IAC7C,OAAO,GAAG,MAAM,CAAW,EAAE;gFAAC;AAEhC,IAAA,YAAY,GAAG,QAAQ,CAAC,MAAK;AAC5C,QAAA,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE,EAAE;AACvB,YAAA,OAAO,EAAE;QACX;QACA,OAAO,IAAI,CAAC,KAAK;aACd,GAAG,CAAC,IAAI,IACP,IAAI,CAAC,cAAc;AACjB,cAAE,IAAI,CAAC,iBAAiB;AACtB,kBAAE,CAAA,EAAG,IAAI,CAAC,OAAO,EAAE,CAAA,EAAA;AACnB,kBAAE;AACJ,cAAE,IAAI,CAAC,IAAI,EAAE,KAAK;AAChB,kBAAE,CAAA,OAAA,EAAU,IAAI,CAAC,OAAO,EAAE,CAAA,IAAA,EAAO,IAAI,CAAC,YAAY,EAAE,IAAI,IAAI,CAAC,IAAI,EAAE,CAAA,GAAA;AACnE,kBAAE,CAAA,OAAA,EAAU,IAAI,CAAC,OAAO,EAAE,CAAA,IAAA,EACtB,IAAI,CAAC,YAAY,EAAE,KAAK;sBACpB,IAAI,CAAC,cAAc,EAAG,GAAG,IAAI,CAAC,kCAAkC;AAClE,sBAAE,IAAI,CAAC,cAAc,EACzB,KAAK;aAEZ,IAAI,CAAC,eAAe,CAAC;IAC1B,CAAC;qFAAC;IAEiB,gBAAgB,GAAG,QAAQ,CAAC,MAC7C,IAAI,CAAC,WAAW,EAAE,KAAK,UAAU,GAAG,IAAI,CAAC,YAAY,EAAE,GAAG,KAAK;yFAChE;IAEkB,mBAAmB,GAAG,QAAQ,CAAC,MAChD,IAAI,CAAC,WAAW,EAAE,KAAK,YAAY,GAAG,IAAI,CAAC,YAAY,EAAE,GAAG,KAAK;4FAClE;AAEkB,IAAA,iBAAiB,GAAG,QAAQ,CAAC,MAAK;AACnD,QAAA,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE,EAAE;AACvB,YAAA,OAAO,EAAE;QACX;AACA,QAAA,MAAM,SAAS,GAAG,IAAI,CAAC,KAAK;AACzB,aAAA,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,KAAK,CAAC,CAAA,EAAA,EAAK,KAAK,CAAA,CAAE,EAAE,IAAI,CAAC,KAAK,EAAE,GAAG,CAAA,EAAA,EAAK,KAAK,CAAA,CAAE,GAAG,EAAE,CAAC;aACrE,IAAI,CAAC,CAAC,CAAa;AAEtB,QAAA,IAAI,IAAI,CAAC,WAAW,EAAE,KAAK,YAAY,EAAE;YACvC,OAAO,CAAA,CAAA,EAAI,SAAS,CAAC,IAAI,CAAC,GAAG,CAAC,GAAG;QACnC;aAAO;YACL,OAAO,CAAA,CAAA,EAAI,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG;QACrC;IACF,CAAC;0FAAC;AAEe,IAAA,UAAU,GAAG,MAAM,EAAC,UAAuB,EAAC;AAC5C,IAAA,MAAM,GAAG,MAAM,CAAC,MAAM,CAAC;AACvB,IAAA,iBAAiB,GAAG,MAAM,CAAC,iBAAiB,CAAC;AAC7C,IAAA,QAAQ,GAAG,MAAM,CAAC,QAAQ,CAAC;IAC3B,cAAc,GAAG,MAAM,CAAC,mBAAmB,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC;AAChE,IAAA,UAAU,GAAG,MAAM,CAAC,UAAU,CAAC;;;;;AAK/B,IAAA,kCAAkC,GAAG,QAAQ,CAAC,MAAK;AAClE,QAAA,MAAM,aAAa,GAAG,IAAI,CAAC,KAAK,EAAE,CAAC,MAAM,CACvC,IAAI,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE,IAAI,IAAI,CAAC,IAAI,EAAE,KAAK,IAAI,IAAI,IAAI,CAAC,YAAY,EAAE,KAAK,SAAS,CAC5F;QACD,MAAM,iBAAiB,GAAG,aAAa,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,IAAI,KAAK,GAAG,GAAG,IAAI,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;QACnF,MAAM,eAAe,GAAG,aAAa,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,IAAI,KAAK,GAAG,GAAG,IAAI,CAAC,YAAY,EAAG,EAAE,CAAC,CAAC;QAE1F,OAAO,iBAAiB,GAAG,eAAe,GAAG,iBAAiB,GAAG,CAAC;IACpE,CAAC;2GAAC;IACe,WAAW,GAAG,MAAM,CAAC,KAAK;oFAAC;AAE5C,IAAA,WAAA,GAAA;AACE,QAAA,YAAY,CAAC,IAAI,CAAC,KAAK;aACpB,IAAI,CAAC,SAAS,CAAC,aAAa,CAAC,EAAE,kBAAkB,EAAE;aACnD,SAAS,CAAC,MAAM,IAAI,CAAC,UAAU,EAAE,CAAC;IACvC;IAEQ,UAAU,GAAA;AAChB,QAAA,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,IAAI,CAAC;QAC1B,MAAM,OAAO,GAAa,EAAE;AAE5B,QAAA,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,EAAE;AAC1B,QAAA,KAAK,IAAI,KAAK,GAAG,CAAC,EAAE,KAAK,GAAG,KAAK,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE;AACjD,YAAA,MAAM,SAAS,GAAG,KAAK,CAAC,KAAK,CAAC;AAC9B,YAAA,SAAS,CAAC,KAAK,GAAG,KAAK;AACvB,YAAA,SAAS,CAAC,KAAK,CAAC,GAAG,CAAC,KAAK,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC;AACrC,YAAA,SAAS,CAAC,MAAM,CAAC,GAAG,CAAC,KAAK,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC;YACtC,SAAS,CAAC,WAAW,GAAG,MAAM,IAAI,CAAC,WAAW,EAAE;AAEhD,YAAA,IAAI,SAAS,CAAC,KAAK,EAAE,EAAE;gBACrB,OAAO,CAAC,IAAI,CAAC;AACX,oBAAA,MAAM,EAAE,SAAS;AACjB,oBAAA,KAAK,EAAE,KAAK,CAAC,KAAK,GAAG,CAAC,CAAE;AACxB,oBAAA,OAAO,EAAE,QAAQ,CAAC,MAAK;wBACrB,MAAM,SAAS,GAAG,SAAS,CAAC,KAAK,EAAG,CAAC,iBAAiB,EAAE;wBACxD,OAAO,CAAC,SAAS,CAAC,cAAc,EAAE,IAAI,CAAC,SAAS,CAAC,cAAc,EAAE;AACnE,oBAAA,CAAC;AACF,iBAAA,CAAC;YACJ;QACF;AACA,QAAA,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,OAAO,CAAC;QAEzB,IAAI,CAAC,kBAAkB,EAAE;QACzB,UAAU,CAAC,MAAM,IAAI,CAAC,mBAAmB,EAAE,CAAC;IAC9C;IAEQ,mBAAmB,GAAA;QACzB,IAAI,CAAC,KAAK,EAAE,CAAC,OAAO,CAAC,IAAI,IAAG;YAC1B,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC;AACtC,YAAA,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE,IAAI,IAAI,CAAC,IAAI,EAAE,KAAK,IAAI,EAAE;gBAClD,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,IAAI,CAAC,YAAY,EAAG,CAAC;YAC/C;AACF,QAAA,CAAC,CAAC;IACJ;IAEU,WAAW,CAAC,MAAc,EAAE,KAAY,EAAA;QAChD,IAAI,CAAC,mBAAmB,EAAE;AAC1B,QAAA,IAAI,CAAC,iBAAiB,CAAC,aAAa,EAAE;QACtC,MAAM,SAAS,GAAG,MAAM,CAAC,KAAK,CAAC,iBAAiB,EAAE;QAClD,IAAI,UAAU,GAAG,MAAM,CAAC,MAAM,CAAC,YAAY,EAAG;AAC9C,QAAA,IAAI,SAAS,GAAG,SAAS,CAAC,YAAY,EAAG;QACzC,IAAI,YAAY,GAAG,CAAC;AACpB,QAAA,MAAM,GAAG,GAAG,KAAK,EAAE;QACnB,MAAM,aAAa,GAAG,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC;AAC7C,QAAA,MAAM,QAAQ,GAAG,CAAC,CAAC,IAAI,UAAU,GAAG,MAAM,CAAC,MAAM,CAAC,OAAO,EAAE,CAAC;QAC5D,MAAM,QAAQ,GAAG,SAAS,GAAG,SAAS,CAAC,OAAO,EAAE;AAChD,QAAA,KAAK,CAAC,cAAc,EAAE,CAAC;AAEvB,QAAA,IAAI,CAAC,MAAM,CAAC,iBAAiB,CAAC,MAAK;AACjC,YAAA,KAAK,CAAC,SAAS,CAAC,IAAI,CAAC,QAAQ,EAAE,WAAW,CAAC,EAAE,SAAS,CAAC,IAAI,CAAC,QAAQ,EAAE,WAAW,CAAC;AAC/E,iBAAA,IAAI,CACH,SAAS,CACP,KAAK,CAAC,SAAS,CAAC,IAAI,CAAC,QAAQ,EAAE,SAAS,CAAC,EAAE,SAAS,CAAC,IAAI,CAAC,QAAQ,EAAE,UAAU,CAAC,CAAC,CACjF,EACD,kBAAkB,CAAC,IAAI,CAAC,UAAU,CAAC;AAEpC,iBAAA,SAAS,CAAC;gBACT,IAAI,EAAE,IAAI,IAAG;oBACX,IAAI,KAAK,GAAG,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,GAAG,aAAa;oBAClD,IAAI,GAAG,IAAI,IAAI,CAAC,WAAW,EAAE,KAAK,YAAY,EAAE;wBAC9C,KAAK,IAAI,CAAC,CAAC;oBACb;oBAEA,KAAK,IAAI,YAAY;AACrB,oBAAA,IAAI,QAAQ,GAAG,YAAY,GAAG,KAAK,EAAE;AACnC,wBAAA,KAAK,GAAG,QAAQ,GAAG,YAAY;oBACjC;AAAO,yBAAA,IAAI,QAAQ,GAAG,YAAY,GAAG,KAAK,EAAE;AAC1C,wBAAA,KAAK,GAAG,QAAQ,GAAG,YAAY;oBACjC;AAEA,oBAAA,IAAI,KAAK,KAAK,CAAC,EAAE;wBACf;oBACF;oBAEA,UAAU,IAAI,KAAK;oBACnB,SAAS,IAAI,KAAK;oBAClB,YAAY,IAAI,KAAK;oBACrB,MAAM,CAAC,MAAM,CAAC,YAAY,CAAC,GAAG,CAAC,UAAU,CAAC;AAC1C,oBAAA,SAAS,CAAC,YAAY,CAAC,GAAG,CAAC,SAAS,CAAC;oBACrC,IAAI,MAAM,CAAC,MAAM,CAAC,IAAI,EAAE,KAAK,IAAI,EAAE;wBACjC,MAAM,CAAC,MAAM,CAAC,cAAc,CAAC,GAAG,CAAC,UAAU,CAAC;oBAC9C;AACA,oBAAA,IAAI,SAAS,CAAC,IAAI,EAAE,KAAK,IAAI,EAAE;AAC7B,wBAAA,SAAS,CAAC,cAAc,CAAC,GAAG,CAAC,SAAS,CAAC;oBACzC;AACA,oBAAA,IAAI,IAAI,CAAC,WAAW,EAAE,KAAK,UAAU,EAAE;AACrC,wBAAA,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,KAAK,CAAC,WAAW,CAC7C,oBAAoB,EACpB,IAAI,CAAC,gBAAgB,EAAE,CACxB;oBACH;yBAAO;AACL,wBAAA,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,KAAK,CAAC,WAAW,CAC7C,uBAAuB,EACvB,IAAI,CAAC,mBAAmB,EAAE,CAC3B;oBACH;oBACA,IAAI,CAAC,eAAe,EAAE;gBACxB,CAAC;AACD,gBAAA,QAAQ,EAAE,MAAM,IAAI,CAAC,WAAW;AACjC,aAAA,CAAC;AACN,QAAA,CAAC,CAAC;IACJ;IAEQ,eAAe,GAAA;AACrB,QAAA,MAAM,aAAa,GAAG,IAAI,CAAC,oBAAoB,EAAE;AACjD,QAAA,IAAI,aAAa,GAAG,CAAC,EAAE;AACrB,YAAA,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,MACd,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC,GAAG,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,UAAU,EAAE,GAAG,GAAG,IAAI,aAAa,CAAC,CAAC,CAC3F;QACH;IACF;IAEQ,oBAAoB,GAAA;QAC1B,MAAM,IAAI,GAAG,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,qBAAqB,EAAE;AAClE,QAAA,IAAI,IAAI,CAAC,WAAW,EAAE,KAAK,UAAU,EAAE;YACrC,OAAO,IAAI,CAAC,MAAM;QACpB;aAAO;YACL,OAAO,IAAI,CAAC,KAAK;QACnB;IACF;AAEQ,IAAA,WAAW,CAAC,KAAY,EAAA;QAC9B,MAAM,cAAc,GAAI,KAAoB,CAAC,OAAO,GAAG,CAAC,CAAC,IAAK,KAAoB;AAClF,QAAA,OAAO,IAAI,CAAC,WAAW,EAAE,KAAK;AAC5B,eAAG,cAAc,CAAC,OAAO,IAAI,CAAC;eAC3B,cAAc,CAAC,OAAO,IAAI,CAAC,CAAC;IACnC;IAEQ,WAAW,GAAA;AACjB,QAAA,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,EAAE;QAC9B,IAAI,CAAC,OAAO,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE;YACpC;QACF;AAEA,QAAA,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,EAAE,CAAC,MAAM,CAC/B,CAAC,SAAS,EAAE,IAAI,KAAI;AAClB,YAAA,MAAM,WAAW,GAAG,IAAI,CAAC,OAAO,EAAE;YAClC,IAAI,WAAW,EAAE;AACf,gBAAA,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,EAAE;gBACxB,SAAS,CAAC,WAAW,CAAC,GAAG;AACvB,oBAAA,IAAI,EAAE,IAAI,KAAK,IAAI,GAAG,IAAI,CAAC,YAAY,EAAG,GAAG,IAAI,CAAC,cAAc,EAAG;AACnE,oBAAA,WAAW,EAAE,IAAI,CAAC,IAAI,EAAE;AACxB,oBAAA,WAAW,EAAE,IAAI;AACjB,oBAAA,QAAQ,EAAE,CAAC,IAAI,CAAC,cAAc;iBAC/B;YACH;AACA,YAAA,OAAO,SAAS;QAClB,CAAC,EACD,EAAoC,CACrC;QAED,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,OAAO,EAAE,KAAK,CAAC;IAC1C;IAEQ,kBAAkB,GAAA;AACxB,QAAA,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,EAAE;QAC9B,IAAI,CAAC,OAAO,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE;YACpC;QACF;AAEA,QAAA,IAAI,CAAC,cAAc,CAAC,IAAI,CAAiC,OAAO,CAAC,CAAC,IAAI,CAAC,OAAO,IAAG;YAC/E,IAAI,CAAC,OAAO,EAAE;gBACZ;YACF;YAEA,IAAI,QAAQ,GAAG,KAAK;YACpB,IAAI,CAAC,KAAK;iBACP,MAAM,CAAC,IAAI,IAAI,IAAI,CAAC,OAAO,EAAE;iBAC7B,GAAG,CAAC,IAAI,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,OAAO,CAAC,IAAI,CAAC,OAAO,EAAG,CAAC,EAAE,CAAC;iBACvD,MAAM,CACL,CAAC,IAAI,KACH,CAAC,CAAC,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,CAAC,WAAW,KAAK,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE;iBAE9D,OAAO,CAAC,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,KAAI;gBAC3B,QAAQ,GAAG,IAAI;AACf,gBAAA,IAAI,IAAI,CAAC,IAAI,EAAE,KAAK,IAAI,EAAE;oBACxB,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC,KAAK,CAAC,IAAI,CAAC;gBACnC;qBAAO;oBACL,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,KAAK,CAAC,IAAI,CAAC;gBACrC;gBACA,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,CAAC,KAAK,CAAC,QAAQ,CAAC;AAC1C,YAAA,CAAC,CAAC;YACJ,UAAU,CAAC,MAAK;gBACd,IAAI,CAAC,mBAAmB,EAAE;gBAC1B,IAAI,QAAQ,EAAE;oBACZ,IAAI,CAAC,eAAe,EAAE;gBACxB;AACF,YAAA,CAAC,CAAC;AACJ,QAAA,CAAC,CAAC;IACJ;uGArSW,gBAAgB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;2FAAhB,gBAAgB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,UAAA,EAAA,MAAA,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,WAAA,EAAA,EAAA,iBAAA,EAAA,aAAA,EAAA,UAAA,EAAA,aAAA,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,EAAA,OAAA,EAAA,EAAA,WAAA,EAAA,aAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,OAAA,EAAA,eAAA,EAAA,0BAAA,EAAA,oBAAA,EAAA,6BAAA,EAAA,uBAAA,EAAA,2BAAA,EAAA,qBAAA,EAAA,EAAA,EAAA,OAAA,EAAA,CAAA,EAAA,YAAA,EAAA,OAAA,EAAA,SAAA,EA2BgB,oBAAoB,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EClFjE,sgBAeA,EAAA,MAAA,EAAA,CAAA,mpBAAA,CAAA,EAAA,CAAA;;ADmEqB,UAAA,CAAA;IADlB,2BAA2B,CAAC,oBAAoB;AACgB,CAAA,EAAA,gBAAA,CAAA,SAAA,EAAA,OAAA,EAAA,KAAA,CAAA,CAAA;2FA3BtD,gBAAgB,EAAA,UAAA,EAAA,CAAA;kBAX5B,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,UAAU,EAAA,IAAA,EAGd;AACJ,wBAAA,SAAS,EAAE,eAAe;AAC1B,wBAAA,4BAA4B,EAAE,oBAAoB;AAClD,wBAAA,+BAA+B,EAAE,uBAAuB;AACxD,wBAAA,6BAA6B,EAAE;AAChC,qBAAA,EAAA,QAAA,EAAA,sgBAAA,EAAA,MAAA,EAAA,CAAA,mpBAAA,CAAA,EAAA;;;AErDH;;;AAGG;MAUU,aAAa,CAAA;uGAAb,aAAa,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA;AAAb,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,aAAa,YAHd,gBAAgB,EAAE,oBAAoB,CAAA,EAAA,OAAA,EAAA,CACtC,gBAAgB,EAAE,oBAAoB,CAAA,EAAA,CAAA;AAErC,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,aAAa,YAHI,oBAAoB,CAAA,EAAA,CAAA;;2FAGrC,aAAa,EAAA,UAAA,EAAA,CAAA;kBAJzB,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;AACR,oBAAA,OAAO,EAAE,CAAC,gBAAgB,EAAE,oBAAoB,CAAC;AACjD,oBAAA,OAAO,EAAE,CAAC,gBAAgB,EAAE,oBAAoB;AACjD,iBAAA;;;ACZD;;;AAGG;;ACHH;;AAEG;;;;"}
@@ -378,7 +378,7 @@ class SiStatusBarComponent {
378
378
  return textWidth + SiStatusBarComponent.itemPadding + indicatorWidth;
379
379
  }
380
380
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: SiStatusBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
381
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: SiStatusBarComponent, isStandalone: true, selector: "si-status-bar", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: true, transformFunction: null }, blink: { classPropertyName: "blink", publicName: "blink", isSignal: true, isRequired: false, transformFunction: null }, muteButton: { classPropertyName: "muteButton", publicName: "muteButton", isSignal: true, isRequired: false, transformFunction: null }, muteButtonText: { classPropertyName: "muteButtonText", publicName: "muteButtonText", isSignal: true, isRequired: false, transformFunction: null }, allOkText: { classPropertyName: "allOkText", publicName: "allOkText", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, blinkPulse: { classPropertyName: "blinkPulse", publicName: "blinkPulse", isSignal: true, isRequired: false, transformFunction: null }, toggleButtonText: { classPropertyName: "toggleButtonText", publicName: "toggleButtonText", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { muteToggle: "muteToggle" }, viewQueries: [{ propertyName: "theBar", first: true, predicate: ["thebar"], descendants: true, isSignal: true }, { propertyName: "content", first: true, predicate: ["content"], descendants: true, isSignal: true }, { propertyName: "custom", first: true, predicate: ["custom"], descendants: true, isSignal: true }], usesOnChanges: true, ngImport: i0, template: "<div\n class=\"expand-placeholder\"\n [class.expanded]=\"expanded()\"\n [style.height.px]=\"placeholderHeight()\"\n></div>\n<div\n #thebar\n aria-busy=\"true\"\n [class]=\"responsiveMode ? `responsive-${responsiveMode}` : ''\"\n [class.responsive]=\"responsiveMode\"\n [class.expanded]=\"expanded()\"\n [class.compact]=\"responsiveMode || compact()\"\n [class.pulse-off]=\"blinkOnOff() === false\"\n [class.pulse-on]=\"blinkOnOff()\"\n>\n <div\n class=\"status-bar-wrapper rounded-2\"\n [class.elevation-2]=\"expanded()\"\n [class.pe-2]=\"muteButton() !== undefined\"\n >\n @if (responsiveMode) {\n <div class=\"align-items-center overflow-hidden\">\n <div class=\"d-flex flex-fill position-relative\">\n @let items = responsiveItems();\n @let responsiveCols = items.length < responsiveMode ? items.length : responsiveMode;\n @for (item of responsiveItems(); track $index) {\n <si-status-bar-item\n class=\"bar-item compact\"\n [value]=\"item.value\"\n [heading]=\"item.title\"\n [status]=\"item.status\"\n [color]=\"item.color\"\n [blink]=\"item.blink !== false && blink() && !expanded()\"\n [clickable]=\"!!item.action\"\n [class.mute-padding]=\"item.mutePadding && muteButton() !== undefined\"\n [style.flex-basis.%]=\"100 / responsiveCols\"\n [valueOnly]=\"item.isSpecial\"\n (click)=\"onItemClicked(item)\"\n (keydown.enter)=\"onItemClicked(item)\"\n />\n }\n </div>\n @if (muteButton() !== undefined) {\n <div class=\"mobile-mute\">\n <ng-container *ngTemplateOutlet=\"muteButtonTemplate\" />\n </div>\n }\n </div>\n }\n <div\n #content\n class=\"main-content align-items-center overflow-hidden\"\n [style.max-height.px]=\"contentHeight()\"\n >\n @if (responsiveMode) {\n <div class=\"mobile-spacer\"></div>\n }\n <div\n class=\"d-flex flex-fill position-relative\"\n [id]=\"statusId\"\n [class.d-none]=\"responsiveMode && !expanded()\"\n [class.flex-wrap]=\"responsiveMode\"\n >\n @for (item of items(); track $index) {\n <si-status-bar-item\n class=\"bar-item\"\n [class.compact]=\"responsiveMode || compact()\"\n [value]=\"item.value\"\n [heading]=\"item.title\"\n [status]=\"item.status\"\n [color]=\"item.color\"\n [blink]=\"item.blink !== false && blink()\"\n [clickable]=\"!!item.action\"\n [style.flex-basis.%]=\"responsiveMode ? 100 / responsiveMode : null\"\n (significanceChange)=\"significanceChanged()\"\n (click)=\"onItemClicked(item)\"\n (keydown.enter)=\"onItemClicked(item)\"\n />\n }\n </div>\n <div class=\"custom-content bar-item d-flex\">\n <div #custom [class.pb-2]=\"responsiveMode && expanded\" (siResizeObserver)=\"resizeHandler()\">\n <ng-content />\n </div>\n </div>\n @if (muteButton() !== undefined && !responsiveMode) {\n <ng-container *ngTemplateOutlet=\"muteButtonTemplate\" />\n }\n </div>\n </div>\n @if (responsiveMode) {\n <div class=\"d-flex align-items-center justify-content-center\">\n <button\n type=\"button\"\n class=\"collapse-expand text-center p-0 focus-force\"\n [attr.aria-label]=\"toggleButtonText() | translate\"\n [attr.aria-expanded]=\"!!expanded()\"\n [attr.aria-controls]=\"statusId\"\n [class.expanded]=\"expanded() === 2\"\n (click)=\"toggleExpand()\"\n >\n <si-icon class=\"icon\" [icon]=\"icons.elementDown2\" />\n </button>\n </div>\n }\n</div>\n\n<ng-template #muteButtonTemplate>\n <button\n type=\"button\"\n class=\"bar-item mute-button btn btn-icon btn-tertiary ms-5\"\n [attr.aria-label]=\"muteButtonText() | translate\"\n (click)=\"muteToggle.emit()\"\n >\n <si-icon class=\"icon\" [icon]=\"muteButton() ? icons.elementSoundOn : icons.elementSoundMute\" />\n </button>\n</ng-template>\n", styles: [":host{display:block;position:relative}:host ::ng-deep .blink{transition:color calc(.5s * var(--element-animations-enabled, 1))}:host ::ng-deep .bg{transition:opacity calc(.5s * var(--element-animations-enabled, 1))}.pulse-off ::ng-deep .bg{opacity:.1!important}.status-bar-wrapper{padding-inline:var(--si-sys-sizing-spacing-x-40);background-color:var(--si-sys-background-1)}.status-bar-wrapper>*{display:flex}.mobile-spacer{margin-block:var(--si-sys-sizing-spacing-y-20);margin-inline:0;background:var(--si-sys-background-0);block-size:1px}.bar-item{margin-block:var(--si-sys-sizing-spacing-y-40)}.custom-content{margin-inline-start:auto}.clickable{cursor:pointer}.mute-padding{padding-inline-end:calc(1lh + 2 * var(--si-sys-sizing-spacing-x-50) + var(--si-sys-sizing-spacing-x-30))}.mobile-mute{position:absolute;inset-inline-end:var(--si-sys-sizing-spacing-x-40)}.main-content .mute-button{margin-inline-end:var(--si-sys-sizing-spacing-x-20)}.collapse-expand{background-color:var(--si-sys-background-1);border:0;border-end-start-radius:2rem;border-end-end-radius:2rem;inline-size:calc(1.5rem + 2 * var(--si-sys-sizing-spacing-x-40));color:var(--si-sys-text-accent);cursor:pointer}.collapse-expand.expanded{box-shadow:0 8px 8px var(--element-box-shadow-color-2)}.collapse-expand.expanded si-icon{transform:rotate(180deg)}.collapse-expand si-icon{margin-block-start:0;transition:transform calc(.4s * var(--element-animations-enabled, 1))}.compact .bar-item{margin-block:var(--si-sys-sizing-spacing-y-10)}.responsive si-status-bar-item{--__si-status-bar-item-min-width: 0;overflow:hidden;flex-shrink:1}.responsive.expanded{position:absolute;inset-block-start:0;inset-inline:0;z-index:1028}.responsive .status-bar-wrapper>.main-content{display:block;transition:max-block-size calc(.5s * var(--element-animations-enabled, 1))}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SiIconComponent, selector: "si-icon", inputs: ["icon"] }, { kind: "component", type: SiStatusBarItemComponent, selector: "si-status-bar-item", inputs: ["status", "value", "heading", "color", "blink", "valueOnly", "clickable"], outputs: ["significanceChange"] }, { kind: "directive", type: SiResizeObserverDirective, selector: "[siResizeObserver]", inputs: ["resizeThrottle", "emitInitial"], outputs: ["siResizeObserver"] }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }] });
381
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: SiStatusBarComponent, isStandalone: true, selector: "si-status-bar", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: true, transformFunction: null }, blink: { classPropertyName: "blink", publicName: "blink", isSignal: true, isRequired: false, transformFunction: null }, muteButton: { classPropertyName: "muteButton", publicName: "muteButton", isSignal: true, isRequired: false, transformFunction: null }, muteButtonText: { classPropertyName: "muteButtonText", publicName: "muteButtonText", isSignal: true, isRequired: false, transformFunction: null }, allOkText: { classPropertyName: "allOkText", publicName: "allOkText", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, blinkPulse: { classPropertyName: "blinkPulse", publicName: "blinkPulse", isSignal: true, isRequired: false, transformFunction: null }, toggleButtonText: { classPropertyName: "toggleButtonText", publicName: "toggleButtonText", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { muteToggle: "muteToggle" }, viewQueries: [{ propertyName: "theBar", first: true, predicate: ["thebar"], descendants: true, isSignal: true }, { propertyName: "content", first: true, predicate: ["content"], descendants: true, isSignal: true }, { propertyName: "custom", first: true, predicate: ["custom"], descendants: true, isSignal: true }], usesOnChanges: true, ngImport: i0, template: "<div\n class=\"expand-placeholder\"\n [class.expanded]=\"expanded()\"\n [style.height.px]=\"placeholderHeight()\"\n></div>\n<div\n #thebar\n aria-busy=\"true\"\n [class]=\"responsiveMode ? `responsive-${responsiveMode}` : ''\"\n [class.responsive]=\"responsiveMode\"\n [class.expanded]=\"expanded()\"\n [class.compact]=\"responsiveMode || compact()\"\n [class.pulse-off]=\"blinkOnOff() === false\"\n [class.pulse-on]=\"blinkOnOff()\"\n>\n <div\n class=\"status-bar-wrapper rounded-2\"\n [class.shadow-3]=\"expanded()\"\n [class.pe-2]=\"muteButton() !== undefined\"\n >\n @if (responsiveMode) {\n <div class=\"align-items-center overflow-hidden\">\n <div class=\"d-flex flex-fill position-relative\">\n @let items = responsiveItems();\n @let responsiveCols = items.length < responsiveMode ? items.length : responsiveMode;\n @for (item of responsiveItems(); track $index) {\n <si-status-bar-item\n class=\"bar-item compact\"\n [value]=\"item.value\"\n [heading]=\"item.title\"\n [status]=\"item.status\"\n [color]=\"item.color\"\n [blink]=\"item.blink !== false && blink() && !expanded()\"\n [clickable]=\"!!item.action\"\n [class.mute-padding]=\"item.mutePadding && muteButton() !== undefined\"\n [style.flex-basis.%]=\"100 / responsiveCols\"\n [valueOnly]=\"item.isSpecial\"\n (click)=\"onItemClicked(item)\"\n (keydown.enter)=\"onItemClicked(item)\"\n />\n }\n </div>\n @if (muteButton() !== undefined) {\n <div class=\"mobile-mute\">\n <ng-container *ngTemplateOutlet=\"muteButtonTemplate\" />\n </div>\n }\n </div>\n }\n <div\n #content\n class=\"main-content align-items-center overflow-hidden\"\n [style.max-height.px]=\"contentHeight()\"\n >\n @if (responsiveMode) {\n <div class=\"mobile-spacer\"></div>\n }\n <div\n class=\"d-flex flex-fill position-relative\"\n [id]=\"statusId\"\n [class.d-none]=\"responsiveMode && !expanded()\"\n [class.flex-wrap]=\"responsiveMode\"\n >\n @for (item of items(); track $index) {\n <si-status-bar-item\n class=\"bar-item\"\n [class.compact]=\"responsiveMode || compact()\"\n [value]=\"item.value\"\n [heading]=\"item.title\"\n [status]=\"item.status\"\n [color]=\"item.color\"\n [blink]=\"item.blink !== false && blink()\"\n [clickable]=\"!!item.action\"\n [style.flex-basis.%]=\"responsiveMode ? 100 / responsiveMode : null\"\n (significanceChange)=\"significanceChanged()\"\n (click)=\"onItemClicked(item)\"\n (keydown.enter)=\"onItemClicked(item)\"\n />\n }\n </div>\n <div class=\"custom-content bar-item d-flex\">\n <div #custom [class.pb-2]=\"responsiveMode && expanded\" (siResizeObserver)=\"resizeHandler()\">\n <ng-content />\n </div>\n </div>\n @if (muteButton() !== undefined && !responsiveMode) {\n <ng-container *ngTemplateOutlet=\"muteButtonTemplate\" />\n }\n </div>\n </div>\n @if (responsiveMode) {\n <div class=\"d-flex align-items-center justify-content-center\">\n <button\n type=\"button\"\n class=\"collapse-expand text-center p-0 focus-force\"\n [attr.aria-label]=\"toggleButtonText() | translate\"\n [attr.aria-expanded]=\"!!expanded()\"\n [attr.aria-controls]=\"statusId\"\n [class.expanded]=\"expanded() === 2\"\n (click)=\"toggleExpand()\"\n >\n <si-icon class=\"icon\" [icon]=\"icons.elementDown2\" />\n </button>\n </div>\n }\n</div>\n\n<ng-template #muteButtonTemplate>\n <button\n type=\"button\"\n class=\"bar-item mute-button btn btn-icon btn-tertiary ms-5\"\n [attr.aria-label]=\"muteButtonText() | translate\"\n (click)=\"muteToggle.emit()\"\n >\n <si-icon class=\"icon\" [icon]=\"muteButton() ? icons.elementSoundOn : icons.elementSoundMute\" />\n </button>\n</ng-template>\n", styles: [":host{display:block;position:relative}:host ::ng-deep .blink{transition:color calc(.5s * var(--element-animations-enabled, 1))}:host ::ng-deep .bg{transition:opacity calc(.5s * var(--element-animations-enabled, 1))}.pulse-off ::ng-deep .bg{opacity:.1!important}.status-bar-wrapper{padding-inline:var(--si-sys-sizing-spacing-x-40);background-color:var(--si-sys-background-1)}.status-bar-wrapper>*{display:flex}.mobile-spacer{margin-block:var(--si-sys-sizing-spacing-y-20);margin-inline:0;background:var(--si-sys-background-0);block-size:1px}.bar-item{margin-block:var(--si-sys-sizing-spacing-y-40)}.custom-content{margin-inline-start:auto}.clickable{cursor:pointer}.mute-padding{padding-inline-end:calc(1lh + 2 * var(--si-sys-sizing-spacing-x-50) + var(--si-sys-sizing-spacing-x-30))}.mobile-mute{position:absolute;inset-inline-end:var(--si-sys-sizing-spacing-x-40)}.main-content .mute-button{margin-inline-end:var(--si-sys-sizing-spacing-x-20)}.collapse-expand{background-color:var(--si-sys-background-1);border:0;border-end-start-radius:2rem;border-end-end-radius:2rem;inline-size:calc(1.5rem + 2 * var(--si-sys-sizing-spacing-x-40));color:var(--si-sys-text-accent);cursor:pointer}.collapse-expand.expanded{box-shadow:var(--si-sys-effects-shadow-2)}.collapse-expand.expanded si-icon{transform:rotate(180deg)}.collapse-expand si-icon{margin-block-start:0;transition:transform calc(.4s * var(--element-animations-enabled, 1))}.compact .bar-item{margin-block:var(--si-sys-sizing-spacing-y-10)}.responsive si-status-bar-item{--__si-status-bar-item-min-width: 0;overflow:hidden;flex-shrink:1}.responsive.expanded{position:absolute;inset-block-start:0;inset-inline:0;z-index:1028}.responsive .status-bar-wrapper>.main-content{display:block;transition:max-block-size calc(.5s * var(--element-animations-enabled, 1))}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SiIconComponent, selector: "si-icon", inputs: ["icon"] }, { kind: "component", type: SiStatusBarItemComponent, selector: "si-status-bar-item", inputs: ["status", "value", "heading", "color", "blink", "valueOnly", "clickable"], outputs: ["significanceChange"] }, { kind: "directive", type: SiResizeObserverDirective, selector: "[siResizeObserver]", inputs: ["resizeThrottle", "emitInitial"], outputs: ["siResizeObserver"] }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }] });
382
382
  }
383
383
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: SiStatusBarComponent, decorators: [{
384
384
  type: Component,
@@ -388,7 +388,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
388
388
  SiStatusBarItemComponent,
389
389
  SiResizeObserverDirective,
390
390
  SiTranslatePipe
391
- ], template: "<div\n class=\"expand-placeholder\"\n [class.expanded]=\"expanded()\"\n [style.height.px]=\"placeholderHeight()\"\n></div>\n<div\n #thebar\n aria-busy=\"true\"\n [class]=\"responsiveMode ? `responsive-${responsiveMode}` : ''\"\n [class.responsive]=\"responsiveMode\"\n [class.expanded]=\"expanded()\"\n [class.compact]=\"responsiveMode || compact()\"\n [class.pulse-off]=\"blinkOnOff() === false\"\n [class.pulse-on]=\"blinkOnOff()\"\n>\n <div\n class=\"status-bar-wrapper rounded-2\"\n [class.elevation-2]=\"expanded()\"\n [class.pe-2]=\"muteButton() !== undefined\"\n >\n @if (responsiveMode) {\n <div class=\"align-items-center overflow-hidden\">\n <div class=\"d-flex flex-fill position-relative\">\n @let items = responsiveItems();\n @let responsiveCols = items.length < responsiveMode ? items.length : responsiveMode;\n @for (item of responsiveItems(); track $index) {\n <si-status-bar-item\n class=\"bar-item compact\"\n [value]=\"item.value\"\n [heading]=\"item.title\"\n [status]=\"item.status\"\n [color]=\"item.color\"\n [blink]=\"item.blink !== false && blink() && !expanded()\"\n [clickable]=\"!!item.action\"\n [class.mute-padding]=\"item.mutePadding && muteButton() !== undefined\"\n [style.flex-basis.%]=\"100 / responsiveCols\"\n [valueOnly]=\"item.isSpecial\"\n (click)=\"onItemClicked(item)\"\n (keydown.enter)=\"onItemClicked(item)\"\n />\n }\n </div>\n @if (muteButton() !== undefined) {\n <div class=\"mobile-mute\">\n <ng-container *ngTemplateOutlet=\"muteButtonTemplate\" />\n </div>\n }\n </div>\n }\n <div\n #content\n class=\"main-content align-items-center overflow-hidden\"\n [style.max-height.px]=\"contentHeight()\"\n >\n @if (responsiveMode) {\n <div class=\"mobile-spacer\"></div>\n }\n <div\n class=\"d-flex flex-fill position-relative\"\n [id]=\"statusId\"\n [class.d-none]=\"responsiveMode && !expanded()\"\n [class.flex-wrap]=\"responsiveMode\"\n >\n @for (item of items(); track $index) {\n <si-status-bar-item\n class=\"bar-item\"\n [class.compact]=\"responsiveMode || compact()\"\n [value]=\"item.value\"\n [heading]=\"item.title\"\n [status]=\"item.status\"\n [color]=\"item.color\"\n [blink]=\"item.blink !== false && blink()\"\n [clickable]=\"!!item.action\"\n [style.flex-basis.%]=\"responsiveMode ? 100 / responsiveMode : null\"\n (significanceChange)=\"significanceChanged()\"\n (click)=\"onItemClicked(item)\"\n (keydown.enter)=\"onItemClicked(item)\"\n />\n }\n </div>\n <div class=\"custom-content bar-item d-flex\">\n <div #custom [class.pb-2]=\"responsiveMode && expanded\" (siResizeObserver)=\"resizeHandler()\">\n <ng-content />\n </div>\n </div>\n @if (muteButton() !== undefined && !responsiveMode) {\n <ng-container *ngTemplateOutlet=\"muteButtonTemplate\" />\n }\n </div>\n </div>\n @if (responsiveMode) {\n <div class=\"d-flex align-items-center justify-content-center\">\n <button\n type=\"button\"\n class=\"collapse-expand text-center p-0 focus-force\"\n [attr.aria-label]=\"toggleButtonText() | translate\"\n [attr.aria-expanded]=\"!!expanded()\"\n [attr.aria-controls]=\"statusId\"\n [class.expanded]=\"expanded() === 2\"\n (click)=\"toggleExpand()\"\n >\n <si-icon class=\"icon\" [icon]=\"icons.elementDown2\" />\n </button>\n </div>\n }\n</div>\n\n<ng-template #muteButtonTemplate>\n <button\n type=\"button\"\n class=\"bar-item mute-button btn btn-icon btn-tertiary ms-5\"\n [attr.aria-label]=\"muteButtonText() | translate\"\n (click)=\"muteToggle.emit()\"\n >\n <si-icon class=\"icon\" [icon]=\"muteButton() ? icons.elementSoundOn : icons.elementSoundMute\" />\n </button>\n</ng-template>\n", styles: [":host{display:block;position:relative}:host ::ng-deep .blink{transition:color calc(.5s * var(--element-animations-enabled, 1))}:host ::ng-deep .bg{transition:opacity calc(.5s * var(--element-animations-enabled, 1))}.pulse-off ::ng-deep .bg{opacity:.1!important}.status-bar-wrapper{padding-inline:var(--si-sys-sizing-spacing-x-40);background-color:var(--si-sys-background-1)}.status-bar-wrapper>*{display:flex}.mobile-spacer{margin-block:var(--si-sys-sizing-spacing-y-20);margin-inline:0;background:var(--si-sys-background-0);block-size:1px}.bar-item{margin-block:var(--si-sys-sizing-spacing-y-40)}.custom-content{margin-inline-start:auto}.clickable{cursor:pointer}.mute-padding{padding-inline-end:calc(1lh + 2 * var(--si-sys-sizing-spacing-x-50) + var(--si-sys-sizing-spacing-x-30))}.mobile-mute{position:absolute;inset-inline-end:var(--si-sys-sizing-spacing-x-40)}.main-content .mute-button{margin-inline-end:var(--si-sys-sizing-spacing-x-20)}.collapse-expand{background-color:var(--si-sys-background-1);border:0;border-end-start-radius:2rem;border-end-end-radius:2rem;inline-size:calc(1.5rem + 2 * var(--si-sys-sizing-spacing-x-40));color:var(--si-sys-text-accent);cursor:pointer}.collapse-expand.expanded{box-shadow:0 8px 8px var(--element-box-shadow-color-2)}.collapse-expand.expanded si-icon{transform:rotate(180deg)}.collapse-expand si-icon{margin-block-start:0;transition:transform calc(.4s * var(--element-animations-enabled, 1))}.compact .bar-item{margin-block:var(--si-sys-sizing-spacing-y-10)}.responsive si-status-bar-item{--__si-status-bar-item-min-width: 0;overflow:hidden;flex-shrink:1}.responsive.expanded{position:absolute;inset-block-start:0;inset-inline:0;z-index:1028}.responsive .status-bar-wrapper>.main-content{display:block;transition:max-block-size calc(.5s * var(--element-animations-enabled, 1))}\n"] }]
391
+ ], template: "<div\n class=\"expand-placeholder\"\n [class.expanded]=\"expanded()\"\n [style.height.px]=\"placeholderHeight()\"\n></div>\n<div\n #thebar\n aria-busy=\"true\"\n [class]=\"responsiveMode ? `responsive-${responsiveMode}` : ''\"\n [class.responsive]=\"responsiveMode\"\n [class.expanded]=\"expanded()\"\n [class.compact]=\"responsiveMode || compact()\"\n [class.pulse-off]=\"blinkOnOff() === false\"\n [class.pulse-on]=\"blinkOnOff()\"\n>\n <div\n class=\"status-bar-wrapper rounded-2\"\n [class.shadow-3]=\"expanded()\"\n [class.pe-2]=\"muteButton() !== undefined\"\n >\n @if (responsiveMode) {\n <div class=\"align-items-center overflow-hidden\">\n <div class=\"d-flex flex-fill position-relative\">\n @let items = responsiveItems();\n @let responsiveCols = items.length < responsiveMode ? items.length : responsiveMode;\n @for (item of responsiveItems(); track $index) {\n <si-status-bar-item\n class=\"bar-item compact\"\n [value]=\"item.value\"\n [heading]=\"item.title\"\n [status]=\"item.status\"\n [color]=\"item.color\"\n [blink]=\"item.blink !== false && blink() && !expanded()\"\n [clickable]=\"!!item.action\"\n [class.mute-padding]=\"item.mutePadding && muteButton() !== undefined\"\n [style.flex-basis.%]=\"100 / responsiveCols\"\n [valueOnly]=\"item.isSpecial\"\n (click)=\"onItemClicked(item)\"\n (keydown.enter)=\"onItemClicked(item)\"\n />\n }\n </div>\n @if (muteButton() !== undefined) {\n <div class=\"mobile-mute\">\n <ng-container *ngTemplateOutlet=\"muteButtonTemplate\" />\n </div>\n }\n </div>\n }\n <div\n #content\n class=\"main-content align-items-center overflow-hidden\"\n [style.max-height.px]=\"contentHeight()\"\n >\n @if (responsiveMode) {\n <div class=\"mobile-spacer\"></div>\n }\n <div\n class=\"d-flex flex-fill position-relative\"\n [id]=\"statusId\"\n [class.d-none]=\"responsiveMode && !expanded()\"\n [class.flex-wrap]=\"responsiveMode\"\n >\n @for (item of items(); track $index) {\n <si-status-bar-item\n class=\"bar-item\"\n [class.compact]=\"responsiveMode || compact()\"\n [value]=\"item.value\"\n [heading]=\"item.title\"\n [status]=\"item.status\"\n [color]=\"item.color\"\n [blink]=\"item.blink !== false && blink()\"\n [clickable]=\"!!item.action\"\n [style.flex-basis.%]=\"responsiveMode ? 100 / responsiveMode : null\"\n (significanceChange)=\"significanceChanged()\"\n (click)=\"onItemClicked(item)\"\n (keydown.enter)=\"onItemClicked(item)\"\n />\n }\n </div>\n <div class=\"custom-content bar-item d-flex\">\n <div #custom [class.pb-2]=\"responsiveMode && expanded\" (siResizeObserver)=\"resizeHandler()\">\n <ng-content />\n </div>\n </div>\n @if (muteButton() !== undefined && !responsiveMode) {\n <ng-container *ngTemplateOutlet=\"muteButtonTemplate\" />\n }\n </div>\n </div>\n @if (responsiveMode) {\n <div class=\"d-flex align-items-center justify-content-center\">\n <button\n type=\"button\"\n class=\"collapse-expand text-center p-0 focus-force\"\n [attr.aria-label]=\"toggleButtonText() | translate\"\n [attr.aria-expanded]=\"!!expanded()\"\n [attr.aria-controls]=\"statusId\"\n [class.expanded]=\"expanded() === 2\"\n (click)=\"toggleExpand()\"\n >\n <si-icon class=\"icon\" [icon]=\"icons.elementDown2\" />\n </button>\n </div>\n }\n</div>\n\n<ng-template #muteButtonTemplate>\n <button\n type=\"button\"\n class=\"bar-item mute-button btn btn-icon btn-tertiary ms-5\"\n [attr.aria-label]=\"muteButtonText() | translate\"\n (click)=\"muteToggle.emit()\"\n >\n <si-icon class=\"icon\" [icon]=\"muteButton() ? icons.elementSoundOn : icons.elementSoundMute\" />\n </button>\n</ng-template>\n", styles: [":host{display:block;position:relative}:host ::ng-deep .blink{transition:color calc(.5s * var(--element-animations-enabled, 1))}:host ::ng-deep .bg{transition:opacity calc(.5s * var(--element-animations-enabled, 1))}.pulse-off ::ng-deep .bg{opacity:.1!important}.status-bar-wrapper{padding-inline:var(--si-sys-sizing-spacing-x-40);background-color:var(--si-sys-background-1)}.status-bar-wrapper>*{display:flex}.mobile-spacer{margin-block:var(--si-sys-sizing-spacing-y-20);margin-inline:0;background:var(--si-sys-background-0);block-size:1px}.bar-item{margin-block:var(--si-sys-sizing-spacing-y-40)}.custom-content{margin-inline-start:auto}.clickable{cursor:pointer}.mute-padding{padding-inline-end:calc(1lh + 2 * var(--si-sys-sizing-spacing-x-50) + var(--si-sys-sizing-spacing-x-30))}.mobile-mute{position:absolute;inset-inline-end:var(--si-sys-sizing-spacing-x-40)}.main-content .mute-button{margin-inline-end:var(--si-sys-sizing-spacing-x-20)}.collapse-expand{background-color:var(--si-sys-background-1);border:0;border-end-start-radius:2rem;border-end-end-radius:2rem;inline-size:calc(1.5rem + 2 * var(--si-sys-sizing-spacing-x-40));color:var(--si-sys-text-accent);cursor:pointer}.collapse-expand.expanded{box-shadow:var(--si-sys-effects-shadow-2)}.collapse-expand.expanded si-icon{transform:rotate(180deg)}.collapse-expand si-icon{margin-block-start:0;transition:transform calc(.4s * var(--element-animations-enabled, 1))}.compact .bar-item{margin-block:var(--si-sys-sizing-spacing-y-10)}.responsive si-status-bar-item{--__si-status-bar-item-min-width: 0;overflow:hidden;flex-shrink:1}.responsive.expanded{position:absolute;inset-block-start:0;inset-inline:0;z-index:1028}.responsive .status-bar-wrapper>.main-content{display:block;transition:max-block-size calc(.5s * var(--element-animations-enabled, 1))}\n"] }]
392
392
  }], ctorParameters: () => [], propDecorators: { items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: true }] }], blink: [{ type: i0.Input, args: [{ isSignal: true, alias: "blink", required: false }] }], muteButton: [{ type: i0.Input, args: [{ isSignal: true, alias: "muteButton", required: false }] }], muteButtonText: [{ type: i0.Input, args: [{ isSignal: true, alias: "muteButtonText", required: false }] }], allOkText: [{ type: i0.Input, args: [{ isSignal: true, alias: "allOkText", required: false }] }], compact: [{ type: i0.Input, args: [{ isSignal: true, alias: "compact", required: false }] }], blinkPulse: [{ type: i0.Input, args: [{ isSignal: true, alias: "blinkPulse", required: false }] }], toggleButtonText: [{ type: i0.Input, args: [{ isSignal: true, alias: "toggleButtonText", required: false }] }], muteToggle: [{ type: i0.Output, args: ["muteToggle"] }], theBar: [{ type: i0.ViewChild, args: ['thebar', { isSignal: true }] }], content: [{ type: i0.ViewChild, args: ['content', { isSignal: true }] }], custom: [{ type: i0.ViewChild, args: ['custom', { isSignal: true }] }] } });
393
393
 
394
394
  /**