npm - @siemens/element-ng - Versions diffs - 49.8.0 → 49.9.0 - Mend

@siemens/element-ng 49.8.0 → 49.9.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 (49) hide show

package/fesm2022/siemens-element-ng-datatable.mjs CHANGED Viewed

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { isSignal, inject, input, booleanAttribute, ElementRef, HostListener, HostBinding, Directive, NgModule } from '@angular/core';
+import { isSignal, inject, input, booleanAttribute, ElementRef, Directive, NgModule } from '@angular/core';
 import { DatatableComponent } from '@siemens/ngx-datatable';
 /**
@@ -21,7 +21,6 @@ class SiDatatableInteractionDirective {
      * @defaultValue false
      */
     datatableInteractionAutoSelect = input(false, { ...(ngDevMode ? { debugName: "datatableInteractionAutoSelect" } : {}), transform: booleanAttribute });
-    tabIndex = '0';
     element = inject(ElementRef).nativeElement;
     tableBody;
     autoSelectTimeout;
@@ -100,30 +99,22 @@ class SiDatatableInteractionDirective {
         clearTimeout(this.autoSelectTimeout);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiDatatableInteractionDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.0.8", type: SiDatatableInteractionDirective, isStandalone: true, selector: "ngx-datatable[siDatatableInteraction]", inputs: { datatableInteractionAutoSelect: { classPropertyName: "datatableInteractionAutoSelect", publicName: "datatableInteractionAutoSelect", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "keydown": "onKeydown($event)", "mousedown": "onMousedown($event)", "mouseup": "onMouseup($event)", "focusin": "onFocusin($event)" }, properties: { "attr.tabindex": "this.tabIndex" } }, exportAs: ["si-datatable-interaction"], ngImport: i0 });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.0.8", type: SiDatatableInteractionDirective, isStandalone: true, selector: "ngx-datatable[siDatatableInteraction]", inputs: { datatableInteractionAutoSelect: { classPropertyName: "datatableInteractionAutoSelect", publicName: "datatableInteractionAutoSelect", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "tabindex": "0" }, listeners: { "keydown": "onKeydown($event)", "mousedown": "onMousedown($event)", "mouseup": "onMouseup($event)", "focusin": "onFocusin($event)" } }, exportAs: ["si-datatable-interaction"], ngImport: i0 });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiDatatableInteractionDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'ngx-datatable[siDatatableInteraction]',
+                    host: {
+                        tabindex: '0',
+                        '(keydown)': 'onKeydown($event)',
+                        '(mousedown)': 'onMousedown($event)',
+                        '(mouseup)': 'onMouseup($event)',
+                        '(focusin)': 'onFocusin($event)'
+                    },
                     exportAs: 'si-datatable-interaction'
                 }]
-        }], propDecorators: { datatableInteractionAutoSelect: [{ type: i0.Input, args: [{ isSignal: true, alias: "datatableInteractionAutoSelect", required: false }] }], tabIndex: [{
-                type: HostBinding,
-                args: ['attr.tabindex']
-            }], onKeydown: [{
-                type: HostListener,
-                args: ['keydown', ['$event']]
-            }], onMousedown: [{
-                type: HostListener,
-                args: ['mousedown', ['$event']]
-            }], onMouseup: [{
-                type: HostListener,
-                args: ['mouseup', ['$event']]
-            }], onFocusin: [{
-                type: HostListener,
-                args: ['focusin', ['$event']]
-            }] } });
+        }], propDecorators: { datatableInteractionAutoSelect: [{ type: i0.Input, args: [{ isSignal: true, alias: "datatableInteractionAutoSelect", required: false }] }] } });
 /**
  * Copyright (c) Siemens 2016 - 2026

package/fesm2022/siemens-element-ng-datatable.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"siemens-element-ng-datatable.mjs","sources":["../../../../projects/element-ng/datatable/si-datatable-interaction.directive.ts","../../../../projects/element-ng/datatable/si-datatable.module.ts","../../../../projects/element-ng/datatable/si-datatable-providers.ts","../../../../projects/element-ng/datatable/index.ts","../../../../projects/element-ng/datatable/siemens-element-ng-datatable.ts"],"sourcesContent":["/*\n Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n /\nimport {\n booleanAttribute,\n Directive,\n ElementRef,\n HostBinding,\n HostListener,\n inject,\n input,\n isSignal,\n OnDestroy,\n OnInit,\n Signal\n} from '@angular/core';\nimport { DatatableComponent } from '@siemens/ngx-datatable';\n\nconst unwrapSignalOrValue = <T>(valueOrSignal: T \| Signal<T>): T => {\n if (isSignal(valueOrSignal)) {\n return valueOrSignal();\n }\n return valueOrSignal;\n};\n\n@Directive({\n selector: 'ngx-datatable[siDatatableInteraction]',\n exportAs: 'si-datatable-interaction'\n})\nexport class SiDatatableInteractionDirective implements OnDestroy, OnInit {\n private table = inject(DatatableComponent, { self: true });\n /\n Automatically select every row or cell that is navigated trough.\n * Is ignored unless `selectionType` is `single` or `cell`.\n \n @defaultValue false\n /\n readonly datatableInteractionAutoSelect = input(false, { transform: booleanAttribute });\n\n @HostBinding('attr.tabindex') protected tabIndex = '0';\n\n private element: HTMLElement = inject(ElementRef).nativeElement;\n private tableBody?: HTMLElement;\n\n private autoSelectTimeout: any;\n\n private isMousedown = false;\n\n @HostListener('keydown', ['$event'])\n protected onKeydown(event: KeyboardEvent): void {\n if (event.key === 'ArrowDown') {\n const first =\n unwrapSignalOrValue(this.table.selectionType) === 'cell'\n ? this.element.querySelector(\n '.datatable-row-wrapper > .datatable-body-row .datatable-body-cell'\n )\n : this.element.querySelector('.datatable-row-wrapper > .datatable-body-row');\n if (first) {\n (first as HTMLElement).focus();\n event.preventDefault();\n }\n } else if (event.key === 'ArrowUp') {\n const last =\n unwrapSignalOrValue(this.table.selectionType) === 'cell'\n ? this.element.querySelector(\n '.datatable-row-wrapper:last-child > .datatable-body-row .datatable-body-cell'\n )\n : this.element.querySelector('.datatable-row-wrapper:last-child > .datatable-body-row');\n if (last) {\n (last as HTMLElement).focus();\n event.preventDefault();\n }\n }\n }\n\n @HostListener('mousedown', ['$event'])\n protected onMousedown(event: MouseEvent): void {\n this.isMousedown = true;\n }\n\n @HostListener('mouseup', ['$event'])\n protected onMouseup(event: MouseEvent): void {\n this.isMousedown = false;\n }\n\n @HostListener('focusin', ['$event'])\n protected onFocusin(event: FocusEvent): void {\n const target = event.target as HTMLElement;\n if (!target) {\n return;\n }\n\n clearTimeout(this.autoSelectTimeout);\n // Re-select on every element\n\n const selectionType = unwrapSignalOrValue(this.table.selectionType);\n if (\n !this.isMousedown &&\n this.datatableInteractionAutoSelect() &&\n (selectionType === 'single' \|\| selectionType === 'cell')\n ) {\n const rowOrCell = target.closest(\n selectionType === 'cell' ? 'datatable-body-cell' : 'datatable-body-row'\n );\n if (!rowOrCell) {\n return;\n }\n this.autoSelectTimeout = setTimeout(() => {\n rowOrCell.dispatchEvent(new KeyboardEvent('keydown', { key: 'Enter', keyCode: 13 }));\n }, 100);\n }\n if (unwrapSignalOrValue(this.table.virtualization)) {\n if (this.tableBody) {\n const lastList =\n selectionType === 'cell'\n ? this.tableBody.querySelectorAll(\n '.datatable-row-wrapper:last-child > .datatable-body-row .datatable-body-cell'\n )\n : this.tableBody.querySelectorAll(\n '.datatable-row-wrapper:last-child > .datatable-body-row'\n );\n if (Array.from(lastList).includes(target)) {\n this.tableBody.scrollTop = this.tableBody.scrollTop + lastList[0].clientHeight;\n } else {\n const firstList =\n selectionType === 'cell'\n ? this.tableBody.querySelectorAll(\n '.datatable-row-wrapper:first-child > .datatable-body-row .datatable-body-cell'\n )\n : this.tableBody.querySelectorAll(\n '.datatable-row-wrapper:first-child > .datatable-body-row'\n );\n if (Array.from(firstList).includes(target)) {\n this.tableBody.scrollTop = this.tableBody.scrollTop - firstList[0].clientHeight;\n }\n }\n }\n }\n }\n\n ngOnInit(): void {\n this.tableBody = this.element.querySelector('datatable-body') as HTMLElement;\n if (this.tableBody) {\n this.tableBody.tabIndex = -1;\n }\n }\n\n ngOnDestroy(): void {\n clearTimeout(this.autoSelectTimeout);\n }\n}\n","/\n Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n /\nimport { NgModule } from '@angular/core';\n\nimport { SiDatatableInteractionDirective } from './si-datatable-interaction.directive';\n\n@NgModule({\n imports: [SiDatatableInteractionDirective],\n exports: [SiDatatableInteractionDirective]\n})\nexport class SiDatatableModule {}\n","/\n Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n /\nimport { Provider } from '@angular/core';\n\n// Copy of NgxDatatableConfig from @siemens/ngx-datatable to maintain compatibility\n// with v22 and earlier where `NgxDatatableConfig` is not defined.\n// See https://github.com/siemens/ngx-datatable/blob/main/projects/ngx-datatable/src/lib/ngx-datatable.config.ts#L50.\n/* Interface for messages to override default table texts. /\ninterface NgxDatatableMessages {\n /* Message to show when the array is present but empty /\n emptyMessage: string;\n /* Footer total message /\n totalMessage: string;\n /* Footer selected message /\n selectedMessage: string;\n /* Pager screen reader message for the first page button /\n ariaFirstPageMessage: string;\n /\n Pager screen reader message for the n-th page button.\n * It will be rendered as: `{{ariaPageNMessage}} {{n}}`.\n /\n ariaPageNMessage: string;\n /* Pager screen reader message for the previous page button /\n ariaPreviousPageMessage: string;\n /* Pager screen reader message for the next page button /\n ariaNextPageMessage: string;\n /* Pager screen reader message for the last page button /\n ariaLastPageMessage: string;\n /* Row checkbox aria label /\n ariaRowCheckboxMessage: string;\n /* Header checkbox aria label /\n ariaHeaderCheckboxMessage: string;\n /* Group header checkbox aria label /\n ariaGroupHeaderCheckboxMessage: string;\n}\n/* CSS classes for icons that override the default table icons. /\ninterface NgxDatatableCssClasses {\n sortAscending: string;\n sortDescending: string;\n sortUnset: string;\n pagerLeftArrow: string;\n pagerRightArrow: string;\n pagerPrevious: string;\n pagerNext: string;\n treeStatusLoading: string;\n treeStatusExpanded: string;\n treeStatusCollapsed: string;\n}\n/\n Interface definition for ngx-datatable global configuration\n /\nexport interface NgxDatatableConfig {\n messages?: NgxDatatableMessages;\n cssClasses?: NgxDatatableCssClasses;\n headerHeight?: number;\n footerHeight?: number;\n rowHeight?: number;\n defaultColumnWidth?: number;\n}\n\n/\n @deprecated Use NgxDatatableConfig from \\@siemens/ngx-datatable instead from v23 onward.\n \n Configuration interface for the upstream \\@siemens/ngx-datatable project.\n * See https://github.com/siemens/ngx-datatable/blob/main/projects/ngx-datatable/src/lib/ngx-datatable.config.ts#L50.\n /\n// eslint-disable-next-line @typescript-eslint/no-empty-object-type\nexport interface INgxDatatableConfig extends NgxDatatableConfig {}\n\n/\n Extends the original NgxDatatableConfig with additional properties and makes all fields required to maintain compatibility.\n /\ninterface SiDatatableConfig extends NgxDatatableConfig {\n cssClasses: Exclude<NgxDatatableConfig['cssClasses'], undefined>;\n headerHeight: number;\n footerHeight: number;\n rowHeight: number;\n rowHeightSmall: number;\n rowHeightExtraSmall: number;\n rowHeightTiny: number;\n summaryHeight: number;\n}\n\nexport const SI_DATATABLE_CONFIG: SiDatatableConfig = {\n cssClasses: {\n sortAscending: 'icon element-sort-up text-primary',\n sortDescending: 'icon element-sort-down text-primary',\n pagerLeftArrow: 'icon element-left-2 flip-rtl',\n pagerRightArrow: 'icon element-right-2 flip-rtl',\n pagerPrevious: 'icon element-double-left flip-rtl',\n pagerNext: 'icon element-double-right flip-rtl',\n sortUnset: '',\n treeStatusLoading: '',\n treeStatusExpanded: 'icon element-down-2 flip-rtl',\n treeStatusCollapsed: 'icon element-right-2 flip-rtl'\n },\n headerHeight: 44, // 40px actual-height + 4px border-bottom\n footerHeight: 40,\n rowHeight: 64,\n rowHeightSmall: 48,\n rowHeightExtraSmall: 32,\n rowHeightTiny: 24,\n summaryHeight: 32\n};\n\n/\n Provides element configuration for the \\@siemens/ngx-datatable.\n \n @param configOverrides - overrides that will be merged with the element configuration.\n /\nexport const provideSiDatatableConfig = (configOverrides?: NgxDatatableConfig): Provider => ({\n provide: 'configuration',\n useValue: { ...SI_DATATABLE_CONFIG, ...configOverrides }\n});\n","/\n Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n /\nexport from './si-datatable-interaction.directive';\nexport * from './si-datatable.module';\nexport * from './si-datatable-providers';\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-datatable.mjs","sources":["../../../../projects/element-ng/datatable/si-datatable-interaction.directive.ts","../../../../projects/element-ng/datatable/si-datatable.module.ts","../../../../projects/element-ng/datatable/si-datatable-providers.ts","../../../../projects/element-ng/datatable/index.ts","../../../../projects/element-ng/datatable/siemens-element-ng-datatable.ts"],"sourcesContent":["/*\n Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n /\nimport {\n booleanAttribute,\n Directive,\n ElementRef,\n inject,\n input,\n isSignal,\n OnDestroy,\n OnInit,\n Signal\n} from '@angular/core';\nimport { DatatableComponent } from '@siemens/ngx-datatable';\n\nconst unwrapSignalOrValue = <T>(valueOrSignal: T \| Signal<T>): T => {\n if (isSignal(valueOrSignal)) {\n return valueOrSignal();\n }\n return valueOrSignal;\n};\n\n@Directive({\n selector: 'ngx-datatable[siDatatableInteraction]',\n host: {\n tabindex: '0',\n '(keydown)': 'onKeydown($event)',\n '(mousedown)': 'onMousedown($event)',\n '(mouseup)': 'onMouseup($event)',\n '(focusin)': 'onFocusin($event)'\n },\n exportAs: 'si-datatable-interaction'\n})\nexport class SiDatatableInteractionDirective implements OnDestroy, OnInit {\n private table = inject(DatatableComponent, { self: true });\n /\n Automatically select every row or cell that is navigated trough.\n * Is ignored unless `selectionType` is `single` or `cell`.\n \n @defaultValue false\n /\n readonly datatableInteractionAutoSelect = input(false, { transform: booleanAttribute });\n\n private element: HTMLElement = inject(ElementRef).nativeElement;\n private tableBody?: HTMLElement;\n\n private autoSelectTimeout: any;\n\n private isMousedown = false;\n\n protected onKeydown(event: KeyboardEvent): void {\n if (event.key === 'ArrowDown') {\n const first =\n unwrapSignalOrValue(this.table.selectionType) === 'cell'\n ? this.element.querySelector(\n '.datatable-row-wrapper > .datatable-body-row .datatable-body-cell'\n )\n : this.element.querySelector('.datatable-row-wrapper > .datatable-body-row');\n if (first) {\n (first as HTMLElement).focus();\n event.preventDefault();\n }\n } else if (event.key === 'ArrowUp') {\n const last =\n unwrapSignalOrValue(this.table.selectionType) === 'cell'\n ? this.element.querySelector(\n '.datatable-row-wrapper:last-child > .datatable-body-row .datatable-body-cell'\n )\n : this.element.querySelector('.datatable-row-wrapper:last-child > .datatable-body-row');\n if (last) {\n (last as HTMLElement).focus();\n event.preventDefault();\n }\n }\n }\n\n protected onMousedown(event: MouseEvent): void {\n this.isMousedown = true;\n }\n\n protected onMouseup(event: MouseEvent): void {\n this.isMousedown = false;\n }\n\n protected onFocusin(event: FocusEvent): void {\n const target = event.target as HTMLElement;\n if (!target) {\n return;\n }\n\n clearTimeout(this.autoSelectTimeout);\n // Re-select on every element\n\n const selectionType = unwrapSignalOrValue(this.table.selectionType);\n if (\n !this.isMousedown &&\n this.datatableInteractionAutoSelect() &&\n (selectionType === 'single' \|\| selectionType === 'cell')\n ) {\n const rowOrCell = target.closest(\n selectionType === 'cell' ? 'datatable-body-cell' : 'datatable-body-row'\n );\n if (!rowOrCell) {\n return;\n }\n this.autoSelectTimeout = setTimeout(() => {\n rowOrCell.dispatchEvent(new KeyboardEvent('keydown', { key: 'Enter', keyCode: 13 }));\n }, 100);\n }\n if (unwrapSignalOrValue(this.table.virtualization)) {\n if (this.tableBody) {\n const lastList =\n selectionType === 'cell'\n ? this.tableBody.querySelectorAll(\n '.datatable-row-wrapper:last-child > .datatable-body-row .datatable-body-cell'\n )\n : this.tableBody.querySelectorAll(\n '.datatable-row-wrapper:last-child > .datatable-body-row'\n );\n if (Array.from(lastList).includes(target)) {\n this.tableBody.scrollTop = this.tableBody.scrollTop + lastList[0].clientHeight;\n } else {\n const firstList =\n selectionType === 'cell'\n ? this.tableBody.querySelectorAll(\n '.datatable-row-wrapper:first-child > .datatable-body-row .datatable-body-cell'\n )\n : this.tableBody.querySelectorAll(\n '.datatable-row-wrapper:first-child > .datatable-body-row'\n );\n if (Array.from(firstList).includes(target)) {\n this.tableBody.scrollTop = this.tableBody.scrollTop - firstList[0].clientHeight;\n }\n }\n }\n }\n }\n\n ngOnInit(): void {\n this.tableBody = this.element.querySelector('datatable-body') as HTMLElement;\n if (this.tableBody) {\n this.tableBody.tabIndex = -1;\n }\n }\n\n ngOnDestroy(): void {\n clearTimeout(this.autoSelectTimeout);\n }\n}\n","/\n Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n /\nimport { NgModule } from '@angular/core';\n\nimport { SiDatatableInteractionDirective } from './si-datatable-interaction.directive';\n\n@NgModule({\n imports: [SiDatatableInteractionDirective],\n exports: [SiDatatableInteractionDirective]\n})\nexport class SiDatatableModule {}\n","/\n Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n /\nimport { Provider } from '@angular/core';\n\n// Copy of NgxDatatableConfig from @siemens/ngx-datatable to maintain compatibility\n// with v22 and earlier where `NgxDatatableConfig` is not defined.\n// See https://github.com/siemens/ngx-datatable/blob/main/projects/ngx-datatable/src/lib/ngx-datatable.config.ts#L50.\n/* Interface for messages to override default table texts. /\ninterface NgxDatatableMessages {\n /* Message to show when the array is present but empty /\n emptyMessage: string;\n /* Footer total message /\n totalMessage: string;\n /* Footer selected message /\n selectedMessage: string;\n /* Pager screen reader message for the first page button /\n ariaFirstPageMessage: string;\n /\n Pager screen reader message for the n-th page button.\n * It will be rendered as: `{{ariaPageNMessage}} {{n}}`.\n /\n ariaPageNMessage: string;\n /* Pager screen reader message for the previous page button /\n ariaPreviousPageMessage: string;\n /* Pager screen reader message for the next page button /\n ariaNextPageMessage: string;\n /* Pager screen reader message for the last page button /\n ariaLastPageMessage: string;\n /* Row checkbox aria label /\n ariaRowCheckboxMessage: string;\n /* Header checkbox aria label /\n ariaHeaderCheckboxMessage: string;\n /* Group header checkbox aria label /\n ariaGroupHeaderCheckboxMessage: string;\n}\n/* CSS classes for icons that override the default table icons. /\ninterface NgxDatatableCssClasses {\n sortAscending: string;\n sortDescending: string;\n sortUnset: string;\n pagerLeftArrow: string;\n pagerRightArrow: string;\n pagerPrevious: string;\n pagerNext: string;\n treeStatusLoading: string;\n treeStatusExpanded: string;\n treeStatusCollapsed: string;\n}\n/\n Interface definition for ngx-datatable global configuration\n /\nexport interface NgxDatatableConfig {\n messages?: NgxDatatableMessages;\n cssClasses?: NgxDatatableCssClasses;\n headerHeight?: number;\n footerHeight?: number;\n rowHeight?: number;\n defaultColumnWidth?: number;\n}\n\n/\n @deprecated Use NgxDatatableConfig from \\@siemens/ngx-datatable instead from v23 onward.\n \n Configuration interface for the upstream \\@siemens/ngx-datatable project.\n * See https://github.com/siemens/ngx-datatable/blob/main/projects/ngx-datatable/src/lib/ngx-datatable.config.ts#L50.\n /\n// eslint-disable-next-line @typescript-eslint/no-empty-object-type\nexport interface INgxDatatableConfig extends NgxDatatableConfig {}\n\n/\n Extends the original NgxDatatableConfig with additional properties and makes all fields required to maintain compatibility.\n /\ninterface SiDatatableConfig extends NgxDatatableConfig {\n cssClasses: Exclude<NgxDatatableConfig['cssClasses'], undefined>;\n headerHeight: number;\n footerHeight: number;\n rowHeight: number;\n rowHeightSmall: number;\n rowHeightExtraSmall: number;\n rowHeightTiny: number;\n summaryHeight: number;\n}\n\nexport const SI_DATATABLE_CONFIG: SiDatatableConfig = {\n cssClasses: {\n sortAscending: 'icon element-sort-up text-primary',\n sortDescending: 'icon element-sort-down text-primary',\n pagerLeftArrow: 'icon element-left-2 flip-rtl',\n pagerRightArrow: 'icon element-right-2 flip-rtl',\n pagerPrevious: 'icon element-double-left flip-rtl',\n pagerNext: 'icon element-double-right flip-rtl',\n sortUnset: '',\n treeStatusLoading: '',\n treeStatusExpanded: 'icon element-down-2 flip-rtl',\n treeStatusCollapsed: 'icon element-right-2 flip-rtl'\n },\n headerHeight: 44, // 40px actual-height + 4px border-bottom\n footerHeight: 40,\n rowHeight: 64,\n rowHeightSmall: 48,\n rowHeightExtraSmall: 32,\n rowHeightTiny: 24,\n summaryHeight: 32\n};\n\n/\n Provides element configuration for the \\@siemens/ngx-datatable.\n \n @param configOverrides - overrides that will be merged with the element configuration.\n /\nexport const provideSiDatatableConfig = (configOverrides?: NgxDatatableConfig): Provider => ({\n provide: 'configuration',\n useValue: { ...SI_DATATABLE_CONFIG, ...configOverrides }\n});\n","/\n Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n /\nexport from './si-datatable-interaction.directive';\nexport * from './si-datatable.module';\nexport * from './si-datatable-providers';\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/siemens-element-ng-datepicker.mjs CHANGED Viewed

@@ -1320,11 +1320,11 @@ class SiCalendarDirectionButtonComponent {
         this.clicked.emit();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiCalendarDirectionButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.8", type: SiCalendarDirectionButtonComponent, isStandalone: true, selector: "si-calendar-direction-button", inputs: { ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: true, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, direction: { classPropertyName: "direction", publicName: "direction", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { clicked: "clicked" }, ngImport: i0, template: "<button\n  role=\"button\"\n  type=\"button\"\n  [class]=\"`btn btn-circle btn-tertiary ${buttonClass()}`\"\n  [disabled]=\"disabled() || null\"\n  [attr.aria-label]=\"ariaLabel()\"\n  (click)=\"onClick()\"\n>\n  <si-icon class=\"icon flip-rtl\" [icon]=\"icon()\" />\n</button>\n", dependencies: [{ kind: "component", type: SiIconComponent, selector: "si-icon", inputs: ["icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.8", type: SiCalendarDirectionButtonComponent, isStandalone: true, selector: "si-calendar-direction-button", inputs: { ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: true, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, direction: { classPropertyName: "direction", publicName: "direction", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { clicked: "clicked" }, ngImport: i0, template: "<button\n  type=\"button\"\n  [class]=\"`btn btn-circle btn-tertiary ${buttonClass()}`\"\n  [disabled]=\"disabled() || null\"\n  [attr.aria-label]=\"ariaLabel()\"\n  (click)=\"onClick()\"\n>\n  <si-icon class=\"icon flip-rtl\" [icon]=\"icon()\" />\n</button>\n", dependencies: [{ kind: "component", type: SiIconComponent, selector: "si-icon", inputs: ["icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiCalendarDirectionButtonComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'si-calendar-direction-button', imports: [SiIconComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n  role=\"button\"\n  type=\"button\"\n  [class]=\"`btn btn-circle btn-tertiary ${buttonClass()}`\"\n  [disabled]=\"disabled() || null\"\n  [attr.aria-label]=\"ariaLabel()\"\n  (click)=\"onClick()\"\n>\n  <si-icon class=\"icon flip-rtl\" [icon]=\"icon()\" />\n</button>\n" }]
+            args: [{ selector: 'si-calendar-direction-button', imports: [SiIconComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n  type=\"button\"\n  [class]=\"`btn btn-circle btn-tertiary ${buttonClass()}`\"\n  [disabled]=\"disabled() || null\"\n  [attr.aria-label]=\"ariaLabel()\"\n  (click)=\"onClick()\"\n>\n  <si-icon class=\"icon flip-rtl\" [icon]=\"icon()\" />\n</button>\n" }]
         }], propDecorators: { ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: true }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], direction: [{ type: i0.Input, args: [{ isSignal: true, alias: "direction", required: false }] }], clicked: [{ type: i0.Output, args: ["clicked"] }] } });
 /**
@@ -1592,13 +1592,13 @@ class SiDaySelectionComponent extends SiInitialFocusComponent {
         this.viewChange.emit(view);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiDaySelectionComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: SiDaySelectionComponent, isStandalone: true, selector: "si-day-selection", inputs: { hideWeekNumbers: { classPropertyName: "hideWeekNumbers", publicName: "hideWeekNumbers", isSignal: true, isRequired: false, transformFunction: null }, weekStartDay: { classPropertyName: "weekStartDay", publicName: "weekStartDay", isSignal: true, isRequired: false, transformFunction: null }, focusedDate: { classPropertyName: "focusedDate", publicName: "focusedDate", isSignal: true, isRequired: true, transformFunction: null }, todayLabel: { classPropertyName: "todayLabel", publicName: "todayLabel", isSignal: true, isRequired: false, transformFunction: null }, calendarWeekLabel: { classPropertyName: "calendarWeekLabel", publicName: "calendarWeekLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { focusedDate: "focusedDateChange", activeMonthChange: "activeMonthChange", viewChange: "viewChange" }, host: { classAttribute: "d-flex flex-column gap-6" }, usesInheritance: true, ngImport: i0, template: "<div class=\"header\">\n  <si-calendar-direction-button\n    direction=\"left\"\n    [ariaLabel]=\"previousLabel() | translate\"\n    [disabled]=\"isPreviousButtonDisabled()\"\n    (clicked)=\"setMonthOffset(-1)\"\n  />\n  <div class=\"flex-fill\">\n    <button\n      type=\"button\"\n      class=\"open-month-view flex-fill text-end px-4 btn btn-tertiary calendar-button\"\n      tabindex=\"0\"\n      (click)=\"emitViewChange('month')\"\n    >\n      {{ focusedDate() | date: 'MMMM' }}\n    </button>\n    <button\n      type=\"button\"\n      class=\"open-year-view flex-fill text-start px-4 btn btn-tertiary calendar-button\"\n      tabindex=\"0\"\n      (click)=\"emitViewChange('year')\"\n    >\n      {{ focusedDate() | date: 'yyyy' }}\n    </button>\n  </div>\n  <si-calendar-direction-button\n    direction=\"right\"\n    [ariaLabel]=\"nextLabel() | translate\"\n    [disabled]=\"isNextButtonDisabled()\"\n    (clicked)=\"setMonthOffset(1)\"\n  />\n</div>\n<div class=\"calendar-table\">\n  <table class=\"px-9\" role=\"grid\">\n    <thead class=\"si-calendar-table-header\">\n      <tr>\n        @if (!hideWeekNumbers()) {\n          <th scope=\"col\" class=\"week-num\">\n            <span class=\"visually-hidden\">{{ calendarWeekLabel() | translate }}</span>\n          </th>\n        }\n        @for (day of days(); track $index) {\n          <th scope=\"col\">\n            <span class=\"si-hidden-xs si-hidden-sm\">{{ day }}</span>\n          </th>\n        }\n      </tr>\n    </thead>\n    <tbody\n      si-calendar-body\n      rowLabelCssClasses=\"week-num\"\n      [focusedDate]=\"focusedDate()\"\n      [compareAdapter]=\"compareAdapter\"\n      [startDate]=\"startDate()\"\n      [endDate]=\"endDate()\"\n      [enableRangeSelection]=\"isRangeSelection()\"\n      [previewRange]=\"previewRange()\"\n      [rows]=\"weeks()\"\n      [rowLabels]=\"hideWeekNumbers() ? undefined : weekNumbers()\"\n      [activeHover]=\"activeHover()\"\n      (activeHoverChange)=\"onActiveHoverChange($event)\"\n      (selectedValueChange)=\"emitSelectedValue($event)\"\n      (focusedDateChange)=\"emitActiveDate($event!)\"\n      (keydown)=\"calendarBodyKeyDown($event)\"\n    >\n    </tbody>\n  </table>\n</div>\n<div class=\"footer ps-8 pe-8\">\n  <button\n    type=\"button\"\n    class=\"today-button btn btn-tertiary flex-fill\"\n    [disabled]=\"isTodayButtonDisabled()\"\n    (click)=\"goToToday()\"\n  >\n    {{ today() | translate }}\n  </button>\n</div>\n", dependencies: [{ kind: "component", type: SiCalendarBodyComponent, selector: "[si-calendar-body]", inputs: ["focusedDate", "startDate", "endDate", "rows", "rowLabels", "rowLabelCssClasses", "enableRangeSelection", "previewRange", "activeHover", "compareAdapter"], outputs: ["focusedDateChange", "activeHoverChange", "selectedValueChange"], exportAs: ["siCalendarBody"] }, { kind: "component", type: SiCalendarDirectionButtonComponent, selector: "si-calendar-direction-button", inputs: ["ariaLabel", "disabled", "direction"], outputs: ["clicked"] }, { kind: "pipe", type: DatePipe, name: "date" }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: SiDaySelectionComponent, isStandalone: true, selector: "si-day-selection", inputs: { hideWeekNumbers: { classPropertyName: "hideWeekNumbers", publicName: "hideWeekNumbers", isSignal: true, isRequired: false, transformFunction: null }, weekStartDay: { classPropertyName: "weekStartDay", publicName: "weekStartDay", isSignal: true, isRequired: false, transformFunction: null }, focusedDate: { classPropertyName: "focusedDate", publicName: "focusedDate", isSignal: true, isRequired: true, transformFunction: null }, todayLabel: { classPropertyName: "todayLabel", publicName: "todayLabel", isSignal: true, isRequired: false, transformFunction: null }, calendarWeekLabel: { classPropertyName: "calendarWeekLabel", publicName: "calendarWeekLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { focusedDate: "focusedDateChange", activeMonthChange: "activeMonthChange", viewChange: "viewChange" }, host: { classAttribute: "d-flex flex-column gap-6" }, usesInheritance: true, ngImport: i0, template: "<div class=\"header\">\n  <si-calendar-direction-button\n    direction=\"left\"\n    [ariaLabel]=\"previousLabel() | translate\"\n    [disabled]=\"isPreviousButtonDisabled()\"\n    (clicked)=\"setMonthOffset(-1)\"\n  />\n  <div class=\"flex-fill\">\n    <button\n      type=\"button\"\n      class=\"open-month-view flex-fill text-end px-4 btn btn-tertiary calendar-button\"\n      (click)=\"emitViewChange('month')\"\n    >\n      {{ focusedDate() | date: 'MMMM' }}\n    </button>\n    <button\n      type=\"button\"\n      class=\"open-year-view flex-fill text-start px-4 btn btn-tertiary calendar-button\"\n      (click)=\"emitViewChange('year')\"\n    >\n      {{ focusedDate() | date: 'yyyy' }}\n    </button>\n  </div>\n  <si-calendar-direction-button\n    direction=\"right\"\n    [ariaLabel]=\"nextLabel() | translate\"\n    [disabled]=\"isNextButtonDisabled()\"\n    (clicked)=\"setMonthOffset(1)\"\n  />\n</div>\n<div class=\"calendar-table\">\n  <table class=\"px-9\" role=\"grid\">\n    <thead class=\"si-calendar-table-header\">\n      <tr>\n        @if (!hideWeekNumbers()) {\n          <th scope=\"col\" class=\"week-num\">\n            <span class=\"visually-hidden\">{{ calendarWeekLabel() | translate }}</span>\n          </th>\n        }\n        @for (day of days(); track $index) {\n          <th scope=\"col\">\n            <span class=\"si-hidden-xs si-hidden-sm\">{{ day }}</span>\n          </th>\n        }\n      </tr>\n    </thead>\n    <tbody\n      si-calendar-body\n      rowLabelCssClasses=\"week-num\"\n      [focusedDate]=\"focusedDate()\"\n      [compareAdapter]=\"compareAdapter\"\n      [startDate]=\"startDate()\"\n      [endDate]=\"endDate()\"\n      [enableRangeSelection]=\"isRangeSelection()\"\n      [previewRange]=\"previewRange()\"\n      [rows]=\"weeks()\"\n      [rowLabels]=\"hideWeekNumbers() ? undefined : weekNumbers()\"\n      [activeHover]=\"activeHover()\"\n      (activeHoverChange)=\"onActiveHoverChange($event)\"\n      (selectedValueChange)=\"emitSelectedValue($event)\"\n      (focusedDateChange)=\"emitActiveDate($event!)\"\n      (keydown)=\"calendarBodyKeyDown($event)\"\n    >\n    </tbody>\n  </table>\n</div>\n<div class=\"footer ps-8 pe-8\">\n  <button\n    type=\"button\"\n    class=\"today-button btn btn-tertiary flex-fill\"\n    [disabled]=\"isTodayButtonDisabled()\"\n    (click)=\"goToToday()\"\n  >\n    {{ today() | translate }}\n  </button>\n</div>\n", dependencies: [{ kind: "component", type: SiCalendarBodyComponent, selector: "[si-calendar-body]", inputs: ["focusedDate", "startDate", "endDate", "rows", "rowLabels", "rowLabelCssClasses", "enableRangeSelection", "previewRange", "activeHover", "compareAdapter"], outputs: ["focusedDateChange", "activeHoverChange", "selectedValueChange"], exportAs: ["siCalendarBody"] }, { kind: "component", type: SiCalendarDirectionButtonComponent, selector: "si-calendar-direction-button", inputs: ["ariaLabel", "disabled", "direction"], outputs: ["clicked"] }, { kind: "pipe", type: DatePipe, name: "date" }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiDaySelectionComponent, decorators: [{
             type: Component,
             args: [{ selector: 'si-day-selection', imports: [DatePipe, SiCalendarBodyComponent, SiCalendarDirectionButtonComponent, SiTranslatePipe], changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         class: 'd-flex flex-column gap-6'
-                    }, template: "<div class=\"header\">\n  <si-calendar-direction-button\n    direction=\"left\"\n    [ariaLabel]=\"previousLabel() | translate\"\n    [disabled]=\"isPreviousButtonDisabled()\"\n    (clicked)=\"setMonthOffset(-1)\"\n  />\n  <div class=\"flex-fill\">\n    <button\n      type=\"button\"\n      class=\"open-month-view flex-fill text-end px-4 btn btn-tertiary calendar-button\"\n      tabindex=\"0\"\n      (click)=\"emitViewChange('month')\"\n    >\n      {{ focusedDate() | date: 'MMMM' }}\n    </button>\n    <button\n      type=\"button\"\n      class=\"open-year-view flex-fill text-start px-4 btn btn-tertiary calendar-button\"\n      tabindex=\"0\"\n      (click)=\"emitViewChange('year')\"\n    >\n      {{ focusedDate() | date: 'yyyy' }}\n    </button>\n  </div>\n  <si-calendar-direction-button\n    direction=\"right\"\n    [ariaLabel]=\"nextLabel() | translate\"\n    [disabled]=\"isNextButtonDisabled()\"\n    (clicked)=\"setMonthOffset(1)\"\n  />\n</div>\n<div class=\"calendar-table\">\n  <table class=\"px-9\" role=\"grid\">\n    <thead class=\"si-calendar-table-header\">\n      <tr>\n        @if (!hideWeekNumbers()) {\n          <th scope=\"col\" class=\"week-num\">\n            <span class=\"visually-hidden\">{{ calendarWeekLabel() | translate }}</span>\n          </th>\n        }\n        @for (day of days(); track $index) {\n          <th scope=\"col\">\n            <span class=\"si-hidden-xs si-hidden-sm\">{{ day }}</span>\n          </th>\n        }\n      </tr>\n    </thead>\n    <tbody\n      si-calendar-body\n      rowLabelCssClasses=\"week-num\"\n      [focusedDate]=\"focusedDate()\"\n      [compareAdapter]=\"compareAdapter\"\n      [startDate]=\"startDate()\"\n      [endDate]=\"endDate()\"\n      [enableRangeSelection]=\"isRangeSelection()\"\n      [previewRange]=\"previewRange()\"\n      [rows]=\"weeks()\"\n      [rowLabels]=\"hideWeekNumbers() ? undefined : weekNumbers()\"\n      [activeHover]=\"activeHover()\"\n      (activeHoverChange)=\"onActiveHoverChange($event)\"\n      (selectedValueChange)=\"emitSelectedValue($event)\"\n      (focusedDateChange)=\"emitActiveDate($event!)\"\n      (keydown)=\"calendarBodyKeyDown($event)\"\n    >\n    </tbody>\n  </table>\n</div>\n<div class=\"footer ps-8 pe-8\">\n  <button\n    type=\"button\"\n    class=\"today-button btn btn-tertiary flex-fill\"\n    [disabled]=\"isTodayButtonDisabled()\"\n    (click)=\"goToToday()\"\n  >\n    {{ today() | translate }}\n  </button>\n</div>\n" }]
+                    }, template: "<div class=\"header\">\n  <si-calendar-direction-button\n    direction=\"left\"\n    [ariaLabel]=\"previousLabel() | translate\"\n    [disabled]=\"isPreviousButtonDisabled()\"\n    (clicked)=\"setMonthOffset(-1)\"\n  />\n  <div class=\"flex-fill\">\n    <button\n      type=\"button\"\n      class=\"open-month-view flex-fill text-end px-4 btn btn-tertiary calendar-button\"\n      (click)=\"emitViewChange('month')\"\n    >\n      {{ focusedDate() | date: 'MMMM' }}\n    </button>\n    <button\n      type=\"button\"\n      class=\"open-year-view flex-fill text-start px-4 btn btn-tertiary calendar-button\"\n      (click)=\"emitViewChange('year')\"\n    >\n      {{ focusedDate() | date: 'yyyy' }}\n    </button>\n  </div>\n  <si-calendar-direction-button\n    direction=\"right\"\n    [ariaLabel]=\"nextLabel() | translate\"\n    [disabled]=\"isNextButtonDisabled()\"\n    (clicked)=\"setMonthOffset(1)\"\n  />\n</div>\n<div class=\"calendar-table\">\n  <table class=\"px-9\" role=\"grid\">\n    <thead class=\"si-calendar-table-header\">\n      <tr>\n        @if (!hideWeekNumbers()) {\n          <th scope=\"col\" class=\"week-num\">\n            <span class=\"visually-hidden\">{{ calendarWeekLabel() | translate }}</span>\n          </th>\n        }\n        @for (day of days(); track $index) {\n          <th scope=\"col\">\n            <span class=\"si-hidden-xs si-hidden-sm\">{{ day }}</span>\n          </th>\n        }\n      </tr>\n    </thead>\n    <tbody\n      si-calendar-body\n      rowLabelCssClasses=\"week-num\"\n      [focusedDate]=\"focusedDate()\"\n      [compareAdapter]=\"compareAdapter\"\n      [startDate]=\"startDate()\"\n      [endDate]=\"endDate()\"\n      [enableRangeSelection]=\"isRangeSelection()\"\n      [previewRange]=\"previewRange()\"\n      [rows]=\"weeks()\"\n      [rowLabels]=\"hideWeekNumbers() ? undefined : weekNumbers()\"\n      [activeHover]=\"activeHover()\"\n      (activeHoverChange)=\"onActiveHoverChange($event)\"\n      (selectedValueChange)=\"emitSelectedValue($event)\"\n      (focusedDateChange)=\"emitActiveDate($event!)\"\n      (keydown)=\"calendarBodyKeyDown($event)\"\n    >\n    </tbody>\n  </table>\n</div>\n<div class=\"footer ps-8 pe-8\">\n  <button\n    type=\"button\"\n    class=\"today-button btn btn-tertiary flex-fill\"\n    [disabled]=\"isTodayButtonDisabled()\"\n    (click)=\"goToToday()\"\n  >\n    {{ today() | translate }}\n  </button>\n</div>\n" }]
         }], propDecorators: { hideWeekNumbers: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideWeekNumbers", required: false }] }], weekStartDay: [{ type: i0.Input, args: [{ isSignal: true, alias: "weekStartDay", required: false }] }], focusedDate: [{ type: i0.Input, args: [{ isSignal: true, alias: "focusedDate", required: true }] }, { type: i0.Output, args: ["focusedDateChange"] }], todayLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "todayLabel", required: false }] }], calendarWeekLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "calendarWeekLabel", required: false }] }], activeMonthChange: [{ type: i0.Output, args: ["activeMonthChange"] }], viewChange: [{ type: i0.Output, args: ["viewChange"] }] } });
 /**
@@ -1765,13 +1765,13 @@ class SiMonthSelectionComponent extends SiInitialFocusComponent {
         this.monthCells.push(row);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiMonthSelectionComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.8", type: SiMonthSelectionComponent, isStandalone: true, selector: "si-month-selection", inputs: { months: { classPropertyName: "months", publicName: "months", isSignal: true, isRequired: false, transformFunction: null }, focusedDate: { classPropertyName: "focusedDate", publicName: "focusedDate", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { focusedDate: "focusedDateChange", activeMonthChange: "activeMonthChange", viewChange: "viewChange" }, host: { listeners: { "keydown.Escape": "triggerEsc($event)" }, classAttribute: "d-flex flex-column gap-6" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"header\">\n  <si-calendar-direction-button\n    direction=\"left\"\n    [ariaLabel]=\"previousLabel()\"\n    [disabled]=\"isPreviousButtonDisabled()\"\n    (clicked)=\"setYearOffset(-1)\"\n  />\n  <button\n    type=\"button\"\n    class=\"open-year-view flex-fill mx-4 btn btn-tertiary calendar-button\"\n    tabindex=\"0\"\n    (click)=\"emitViewChange()\"\n  >\n    {{ focusedDate() | date: 'yyyy' }}\n  </button>\n  <si-calendar-direction-button\n    direction=\"right\"\n    [ariaLabel]=\"nextLabel()\"\n    [disabled]=\"isNextButtonDisabled()\"\n    (clicked)=\"setYearOffset(1)\"\n  />\n</div>\n<div class=\"calendar-table\">\n  <table class=\"px-9\" role=\"grid\">\n    <tbody\n      si-calendar-body\n      [focusedDate]=\"focusedDate()\"\n      [compareAdapter]=\"compareAdapter\"\n      [startDate]=\"startDate()\"\n      [endDate]=\"endDate()\"\n      [enableRangeSelection]=\"isRangeSelection()\"\n      [previewRange]=\"previewRange()\"\n      [rows]=\"monthCells\"\n      [activeHover]=\"activeHover()\"\n      (activeHoverChange)=\"onActiveHoverChange($event)\"\n      (selectedValueChange)=\"emitSelectedValue($event)\"\n      (focusedDateChange)=\"emitFocusedDate($event)\"\n      (keydown)=\"calendarBodyKeyDown($event)\"\n    >\n    </tbody>\n  </table>\n</div>\n<div class=\"footer\"></div>\n", dependencies: [{ kind: "component", type: SiCalendarDirectionButtonComponent, selector: "si-calendar-direction-button", inputs: ["ariaLabel", "disabled", "direction"], outputs: ["clicked"] }, { kind: "component", type: SiCalendarBodyComponent, selector: "[si-calendar-body]", inputs: ["focusedDate", "startDate", "endDate", "rows", "rowLabels", "rowLabelCssClasses", "enableRangeSelection", "previewRange", "activeHover", "compareAdapter"], outputs: ["focusedDateChange", "activeHoverChange", "selectedValueChange"], exportAs: ["siCalendarBody"] }, { kind: "pipe", type: DatePipe, name: "date" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.8", type: SiMonthSelectionComponent, isStandalone: true, selector: "si-month-selection", inputs: { months: { classPropertyName: "months", publicName: "months", isSignal: true, isRequired: false, transformFunction: null }, focusedDate: { classPropertyName: "focusedDate", publicName: "focusedDate", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { focusedDate: "focusedDateChange", activeMonthChange: "activeMonthChange", viewChange: "viewChange" }, host: { listeners: { "keydown.Escape": "triggerEsc($event)" }, classAttribute: "d-flex flex-column gap-6" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"header\">\n  <si-calendar-direction-button\n    direction=\"left\"\n    [ariaLabel]=\"previousLabel()\"\n    [disabled]=\"isPreviousButtonDisabled()\"\n    (clicked)=\"setYearOffset(-1)\"\n  />\n  <button\n    type=\"button\"\n    class=\"open-year-view flex-fill mx-4 btn btn-tertiary calendar-button\"\n    (click)=\"emitViewChange()\"\n  >\n    {{ focusedDate() | date: 'yyyy' }}\n  </button>\n  <si-calendar-direction-button\n    direction=\"right\"\n    [ariaLabel]=\"nextLabel()\"\n    [disabled]=\"isNextButtonDisabled()\"\n    (clicked)=\"setYearOffset(1)\"\n  />\n</div>\n<div class=\"calendar-table\">\n  <table class=\"px-9\" role=\"grid\">\n    <tbody\n      si-calendar-body\n      [focusedDate]=\"focusedDate()\"\n      [compareAdapter]=\"compareAdapter\"\n      [startDate]=\"startDate()\"\n      [endDate]=\"endDate()\"\n      [enableRangeSelection]=\"isRangeSelection()\"\n      [previewRange]=\"previewRange()\"\n      [rows]=\"monthCells\"\n      [activeHover]=\"activeHover()\"\n      (activeHoverChange)=\"onActiveHoverChange($event)\"\n      (selectedValueChange)=\"emitSelectedValue($event)\"\n      (focusedDateChange)=\"emitFocusedDate($event)\"\n      (keydown)=\"calendarBodyKeyDown($event)\"\n    >\n    </tbody>\n  </table>\n</div>\n<div class=\"footer\"></div>\n", dependencies: [{ kind: "component", type: SiCalendarDirectionButtonComponent, selector: "si-calendar-direction-button", inputs: ["ariaLabel", "disabled", "direction"], outputs: ["clicked"] }, { kind: "component", type: SiCalendarBodyComponent, selector: "[si-calendar-body]", inputs: ["focusedDate", "startDate", "endDate", "rows", "rowLabels", "rowLabelCssClasses", "enableRangeSelection", "previewRange", "activeHover", "compareAdapter"], outputs: ["focusedDateChange", "activeHoverChange", "selectedValueChange"], exportAs: ["siCalendarBody"] }, { kind: "pipe", type: DatePipe, name: "date" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiMonthSelectionComponent, decorators: [{
             type: Component,
             args: [{ selector: 'si-month-selection', imports: [SiCalendarDirectionButtonComponent, SiCalendarBodyComponent, DatePipe], changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         class: 'd-flex flex-column gap-6'
-                    }, template: "<div class=\"header\">\n  <si-calendar-direction-button\n    direction=\"left\"\n    [ariaLabel]=\"previousLabel()\"\n    [disabled]=\"isPreviousButtonDisabled()\"\n    (clicked)=\"setYearOffset(-1)\"\n  />\n  <button\n    type=\"button\"\n    class=\"open-year-view flex-fill mx-4 btn btn-tertiary calendar-button\"\n    tabindex=\"0\"\n    (click)=\"emitViewChange()\"\n  >\n    {{ focusedDate() | date: 'yyyy' }}\n  </button>\n  <si-calendar-direction-button\n    direction=\"right\"\n    [ariaLabel]=\"nextLabel()\"\n    [disabled]=\"isNextButtonDisabled()\"\n    (clicked)=\"setYearOffset(1)\"\n  />\n</div>\n<div class=\"calendar-table\">\n  <table class=\"px-9\" role=\"grid\">\n    <tbody\n      si-calendar-body\n      [focusedDate]=\"focusedDate()\"\n      [compareAdapter]=\"compareAdapter\"\n      [startDate]=\"startDate()\"\n      [endDate]=\"endDate()\"\n      [enableRangeSelection]=\"isRangeSelection()\"\n      [previewRange]=\"previewRange()\"\n      [rows]=\"monthCells\"\n      [activeHover]=\"activeHover()\"\n      (activeHoverChange)=\"onActiveHoverChange($event)\"\n      (selectedValueChange)=\"emitSelectedValue($event)\"\n      (focusedDateChange)=\"emitFocusedDate($event)\"\n      (keydown)=\"calendarBodyKeyDown($event)\"\n    >\n    </tbody>\n  </table>\n</div>\n<div class=\"footer\"></div>\n" }]
+                    }, template: "<div class=\"header\">\n  <si-calendar-direction-button\n    direction=\"left\"\n    [ariaLabel]=\"previousLabel()\"\n    [disabled]=\"isPreviousButtonDisabled()\"\n    (clicked)=\"setYearOffset(-1)\"\n  />\n  <button\n    type=\"button\"\n    class=\"open-year-view flex-fill mx-4 btn btn-tertiary calendar-button\"\n    (click)=\"emitViewChange()\"\n  >\n    {{ focusedDate() | date: 'yyyy' }}\n  </button>\n  <si-calendar-direction-button\n    direction=\"right\"\n    [ariaLabel]=\"nextLabel()\"\n    [disabled]=\"isNextButtonDisabled()\"\n    (clicked)=\"setYearOffset(1)\"\n  />\n</div>\n<div class=\"calendar-table\">\n  <table class=\"px-9\" role=\"grid\">\n    <tbody\n      si-calendar-body\n      [focusedDate]=\"focusedDate()\"\n      [compareAdapter]=\"compareAdapter\"\n      [startDate]=\"startDate()\"\n      [endDate]=\"endDate()\"\n      [enableRangeSelection]=\"isRangeSelection()\"\n      [previewRange]=\"previewRange()\"\n      [rows]=\"monthCells\"\n      [activeHover]=\"activeHover()\"\n      (activeHoverChange)=\"onActiveHoverChange($event)\"\n      (selectedValueChange)=\"emitSelectedValue($event)\"\n      (focusedDateChange)=\"emitFocusedDate($event)\"\n      (keydown)=\"calendarBodyKeyDown($event)\"\n    >\n    </tbody>\n  </table>\n</div>\n<div class=\"footer\"></div>\n" }]
         }], propDecorators: { months: [{ type: i0.Input, args: [{ isSignal: true, alias: "months", required: false }] }], focusedDate: [{ type: i0.Input, args: [{ isSignal: true, alias: "focusedDate", required: true }] }, { type: i0.Output, args: ["focusedDateChange"] }], activeMonthChange: [{ type: i0.Output, args: ["activeMonthChange"] }], viewChange: [{ type: i0.Output, args: ["viewChange"] }], triggerEsc: [{
                 type: HostListener,
                 args: ['keydown.Escape', ['$event']]