@fundamental-ngx/ui5-webcomponents-fiori 0.63.2-rc.7 → 0.63.2
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.
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-barcode-scanner-dialog.mjs +4 -9
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-barcode-scanner-dialog.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-dynamic-page-header-actions.mjs +3 -3
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-dynamic-page-header.mjs +4 -10
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-dynamic-page-header.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-dynamic-page-title.mjs +3 -3
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-dynamic-page.mjs +8 -14
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-dynamic-page.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-dynamic-side-content.mjs +10 -19
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-dynamic-side-content.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-filter-item-option.mjs +5 -11
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-filter-item-option.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-filter-item.mjs +5 -12
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-filter-item.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-flexible-column-layout.mjs +15 -31
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-flexible-column-layout.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-group-item.mjs +5 -11
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-group-item.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-hero-banner.mjs +8 -18
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-hero-banner.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-illustrated-message.mjs +9 -19
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-illustrated-message.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-media-gallery-item.mjs +6 -12
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-media-gallery-item.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-media-gallery.mjs +8 -16
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-media-gallery.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-navigation-layout.mjs +4 -10
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-navigation-layout.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-navigation-menu-item.mjs +20 -37
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-navigation-menu-item.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-navigation-menu.mjs +10 -20
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-navigation-menu.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-notification-list-group-item.mjs +9 -17
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-notification-list-group-item.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-notification-list-group-list.mjs +20 -39
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-notification-list-group-list.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-notification-list-internal.mjs +20 -39
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-notification-list-internal.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-notification-list-item.mjs +11 -21
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-notification-list-item.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-notification-list.mjs +4 -10
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-notification-list.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-page.mjs +7 -13
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-page.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-product-switch-item.mjs +8 -18
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-product-switch-item.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-product-switch.mjs +3 -3
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-search-field.mjs +10 -20
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-search-field.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-search-item-group.mjs +6 -14
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-search-item-group.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-search-item-show-more.mjs +5 -11
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-search-item-show-more.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-search-item.mjs +9 -18
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-search-item.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-search-message-area.mjs +5 -12
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-search-message-area.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-search-scope.mjs +5 -12
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-search-scope.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-search.mjs +13 -23
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-search.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-shell-bar-branding.mjs +6 -14
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-shell-bar-branding.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-shell-bar-item.mjs +7 -16
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-shell-bar-item.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-shell-bar-search.mjs +14 -24
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-shell-bar-search.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-shell-bar-spacer.mjs +3 -3
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-shell-bar.mjs +12 -21
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-shell-bar.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-side-navigation-group.mjs +8 -16
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-side-navigation-group.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-side-navigation-item.mjs +15 -28
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-side-navigation-item.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-side-navigation-sub-item.mjs +14 -27
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-side-navigation-sub-item.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-side-navigation.mjs +5 -11
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-side-navigation.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-sort-item.mjs +5 -11
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-sort-item.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-theming.mjs +3 -3
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-timeline-group-item.mjs +5 -11
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-timeline-group-item.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-timeline-item.mjs +10 -21
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-timeline-item.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-timeline.mjs +9 -18
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-timeline.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-upload-collection-item.mjs +19 -33
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-upload-collection-item.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-upload-collection.mjs +9 -19
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-upload-collection.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-user-menu-account.mjs +12 -24
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-user-menu-account.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-user-menu-item-group.mjs +4 -10
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-user-menu-item-group.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-user-menu-item.mjs +19 -34
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-user-menu-item.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-user-menu.mjs +10 -16
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-user-menu.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-user-settings-account-view.mjs +7 -13
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-user-settings-account-view.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-user-settings-appearance-view-group.mjs +6 -14
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-user-settings-appearance-view-group.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-user-settings-appearance-view-item.mjs +16 -31
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-user-settings-appearance-view-item.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-user-settings-appearance-view.mjs +6 -12
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-user-settings-appearance-view.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-user-settings-dialog.mjs +6 -12
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-user-settings-dialog.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-user-settings-item.mjs +12 -23
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-user-settings-item.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-user-settings-view.mjs +6 -12
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-user-settings-view.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-utils.mjs +3 -3
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-view-settings-dialog-custom-tab.mjs +6 -14
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-view-settings-dialog-custom-tab.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-view-settings-dialog.mjs +7 -12
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-view-settings-dialog.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-wizard-step.mjs +9 -17
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-wizard-step.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-wizard-tab.mjs +3 -3
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-wizard.mjs +4 -10
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori-wizard.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori.mjs +542 -1061
- package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori.mjs.map +1 -1
- package/package.json +12 -13
|
@@ -8,7 +8,7 @@ class BarcodeScannerDialog {
|
|
|
8
8
|
/**
|
|
9
9
|
* Indicates whether the dialog is open.
|
|
10
10
|
*/
|
|
11
|
-
this.open = input(false, { ...(ngDevMode ? { debugName: "open" } :
|
|
11
|
+
this.open = input(false, { ...(ngDevMode ? { debugName: "open" } : {}), transform: booleanAttribute }); // className is now passed
|
|
12
12
|
/**
|
|
13
13
|
* Fired when the user closes the component.
|
|
14
14
|
*/
|
|
@@ -91,11 +91,6 @@ class BarcodeScannerDialog {
|
|
|
91
91
|
// Read the signal value
|
|
92
92
|
const value = this[signalName]();
|
|
93
93
|
if (wcElement) {
|
|
94
|
-
// Skip writes when the signal is undefined and the property is already truthy
|
|
95
|
-
// This prevents clobbering imperatively-set values (e.g., from RouterLink)
|
|
96
|
-
if (value === undefined && wcElement[inputName]) {
|
|
97
|
-
return;
|
|
98
|
-
}
|
|
99
94
|
// Write the value to the Web Component's property
|
|
100
95
|
wcElement[inputName] = value;
|
|
101
96
|
}
|
|
@@ -121,14 +116,14 @@ class BarcodeScannerDialog {
|
|
|
121
116
|
}
|
|
122
117
|
}
|
|
123
118
|
}
|
|
124
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
125
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "
|
|
119
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: BarcodeScannerDialog, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
120
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.0", type: BarcodeScannerDialog, isStandalone: true, selector: "ui5-barcode-scanner-dialog, [ui5-barcode-scanner-dialog]", inputs: { open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ui5Close: "ui5Close", ui5ScanError: "ui5ScanError", ui5ScanSuccess: "ui5ScanSuccess" }, providers: [
|
|
126
121
|
contentDensityObserverProviders({
|
|
127
122
|
supportedContentDensity: [ContentDensityMode.COMPACT, ContentDensityMode.COZY]
|
|
128
123
|
})
|
|
129
124
|
], exportAs: ["ui5BarcodeScannerDialog"], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
130
125
|
}
|
|
131
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
126
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: BarcodeScannerDialog, decorators: [{
|
|
132
127
|
type: Component,
|
|
133
128
|
args: [{
|
|
134
129
|
standalone: true,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"fundamental-ngx-ui5-webcomponents-fiori-barcode-scanner-dialog.mjs","sources":["../../../../libs/ui5-webcomponents-fiori/barcode-scanner-dialog/index.ts","../../../../libs/ui5-webcomponents-fiori/barcode-scanner-dialog/fundamental-ngx-ui5-webcomponents-fiori-barcode-scanner-dialog.ts"],"sourcesContent":["\nimport {\n ChangeDetectionStrategy,\n Component,\n ElementRef,\n input,\n output,\n AfterViewInit,\n effect,\n runInInjectionContext,\n inject,\n Injector,\n booleanAttribute,\n computed,\n signal\n} from '@angular/core';\nimport '@ui5/webcomponents-fiori/dist/BarcodeScannerDialog.js';\nimport { default as _BarcodeScannerDialog } from '@ui5/webcomponents-fiori/dist/BarcodeScannerDialog.js';\nimport { UI5CustomEvent } from '@ui5/webcomponents-base';\nimport {\n ContentDensityObserver,\n contentDensityObserverProviders,\n ContentDensityMode\n} from '@fundamental-ngx/core/content-density';\n\n\n\n@Component({\n standalone: true,\n selector: 'ui5-barcode-scanner-dialog, [ui5-barcode-scanner-dialog]',\n template: '<ng-content></ng-content>',\n exportAs: 'ui5BarcodeScannerDialog',\n providers: [\n contentDensityObserverProviders({\n supportedContentDensity: [ContentDensityMode.COMPACT, ContentDensityMode.COZY]\n })\n ],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class BarcodeScannerDialog implements AfterViewInit {\n\n /**\n * Indicates whether the dialog is open.\n */\n open = input(false, { transform: booleanAttribute }); // className is now passed\n\n\n\n /**\n * Fired when the user closes the component.\n */\n ui5Close = output<UI5CustomEvent<_BarcodeScannerDialog, 'close'>>();\n\n /**\n * Fires when the scan fails with error.\n */\n ui5ScanError = output<UI5CustomEvent<_BarcodeScannerDialog, 'scan-error'>>();\n\n /**\n * Fires when the scan is completed successfully.\n */\n ui5ScanSuccess = output<UI5CustomEvent<_BarcodeScannerDialog, 'scan-success'>>();\n\n /**\n * Available slots for content projection in this component.\n *\n * Slots allow you to insert custom content into predefined areas of the web component.\n * Use the `slot` attribute on child elements to target specific slots.\n *\n * - **footer**: Defines the footer HTML Element.\n\n**Note:** When you provide custom content for the `footer` slot, the default close button is not rendered.\nThis means you need to include your own mechanism within the custom `footer` to close the dialog,\nsuch as a button with an event listener that closes the dialog.\n\n**Note:** If the `footer` slot is not provided, a default footer with a close button is rendered automatically,\nallowing users to close the dialog without any additional implementation.\n * - **header**: Defines the header HTML Element.\n\n**Note:** If `header` slot is provided, the labelling of the dialog is a responsibility of the application developer.\n`accessibleName` should be used.\n *\n * @example\n * ```html\n * <ui5-barcode-scanner-dialog>\n * <div slot=\"header\">Custom header content</div>\n * <p>Default slot content</p>\n * </ui5-barcode-scanner-dialog>\n * ```\n *\n * @readonly\n * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}\n */\n readonly slots = [\n {\n \"name\": \"footer\",\n \"description\": \"Defines the footer HTML Element.\\n\\n**Note:** When you provide custom content for the `footer` slot, the default close button is not rendered.\\nThis means you need to include your own mechanism within the custom `footer` to close the dialog,\\nsuch as a button with an event listener that closes the dialog.\\n\\n**Note:** If the `footer` slot is not provided, a default footer with a close button is rendered automatically,\\nallowing users to close the dialog without any additional implementation.\",\n \"since\": \"2.4.0\"\n },\n {\n \"name\": \"header\",\n \"description\": \"Defines the header HTML Element.\\n\\n**Note:** If `header` slot is provided, the labelling of the dialog is a responsibility of the application developer.\\n`accessibleName` should be used.\",\n \"since\": \"2.4.0\"\n }\n ];\n\n\n public elementRef: ElementRef<_BarcodeScannerDialog> = inject(ElementRef);\n public injector = inject(Injector);\n\n /**\n * Content density observer is injected to activate automatic CSS class and\n * UI5 attribute application. The observer self-initializes, no explicit subscribe() needed.\n * @private\n */\n private readonly _contentDensityObserver = inject(ContentDensityObserver);\n\n get element(): _BarcodeScannerDialog {\n return this.elementRef.nativeElement;\n }\n\n ngAfterViewInit(): void {\n const wcElement = this.element;\n \n const inputsToSync = [\n 'open',\n ];\n \n // Synchronize inputs (properties)\n for (const inputName of inputsToSync) {\n // Find the corresponding camelCase signal property on the Angular component\n const signalName = inputName.replace(/-./g, (x: string) => x[1].toUpperCase());\n\n // Use the Injector to run the effect in the correct context\n if (this[signalName] && typeof this[signalName] === 'function') {\n runInInjectionContext(this.injector, () => {\n effect(() => {\n // Read the signal value\n const value = this[signalName]();\n if (wcElement) {\n // Skip writes when the signal is undefined and the property is already truthy\n // This prevents clobbering imperatively-set values (e.g., from RouterLink)\n if (value === undefined && wcElement[inputName]) {\n return;\n }\n // Write the value to the Web Component's property\n wcElement[inputName] = value;\n }\n });\n });\n }\n }\n \n \n const outputsToSync = [\n 'ui5Close',\n 'ui5ScanError',\n 'ui5ScanSuccess',\n ];\n \n // Synchronize outputs (events)\n for (const outputName of outputsToSync) {\n // Map Angular output name to UI5 web component event name\n const eventName = outputName.replace('ui5', '').replace(/([A-Z])/g, '-$1').toLowerCase().substring(1);\n // Ensure the output property exists and has an emit function before adding listener\n if (this[outputName] && typeof this[outputName].emit === 'function' && wcElement.addEventListener) {\n // Cast the listener to the correct type to satisfy TypeScript\n wcElement.addEventListener(eventName, (e) => {\n\n this[outputName].emit(e as CustomEvent<any>);\n });\n }\n }\n \n\n }\n}\n\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"fundamental-ngx-ui5-webcomponents-fiori-barcode-scanner-dialog.mjs","sources":["../../../../libs/ui5-webcomponents-fiori/barcode-scanner-dialog/index.ts","../../../../libs/ui5-webcomponents-fiori/barcode-scanner-dialog/fundamental-ngx-ui5-webcomponents-fiori-barcode-scanner-dialog.ts"],"sourcesContent":["\nimport {\n ChangeDetectionStrategy,\n Component,\n ElementRef,\n input,\n output,\n AfterViewInit,\n effect,\n runInInjectionContext,\n inject,\n Injector,\n booleanAttribute,\n computed,\n signal\n} from '@angular/core';\nimport '@ui5/webcomponents-fiori/dist/BarcodeScannerDialog.js';\nimport { default as _BarcodeScannerDialog } from '@ui5/webcomponents-fiori/dist/BarcodeScannerDialog.js';\nimport { UI5CustomEvent } from '@ui5/webcomponents-base';\nimport {\n ContentDensityObserver,\n contentDensityObserverProviders,\n ContentDensityMode\n} from '@fundamental-ngx/core/content-density';\n\n\n\n@Component({\n standalone: true,\n selector: 'ui5-barcode-scanner-dialog, [ui5-barcode-scanner-dialog]',\n template: '<ng-content></ng-content>',\n exportAs: 'ui5BarcodeScannerDialog',\n providers: [\n contentDensityObserverProviders({\n supportedContentDensity: [ContentDensityMode.COMPACT, ContentDensityMode.COZY]\n })\n ],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class BarcodeScannerDialog implements AfterViewInit {\n\n /**\n * Indicates whether the dialog is open.\n */\n open = input(false, { transform: booleanAttribute }); // className is now passed\n\n\n\n /**\n * Fired when the user closes the component.\n */\n ui5Close = output<UI5CustomEvent<_BarcodeScannerDialog, 'close'>>();\n\n /**\n * Fires when the scan fails with error.\n */\n ui5ScanError = output<UI5CustomEvent<_BarcodeScannerDialog, 'scan-error'>>();\n\n /**\n * Fires when the scan is completed successfully.\n */\n ui5ScanSuccess = output<UI5CustomEvent<_BarcodeScannerDialog, 'scan-success'>>();\n\n /**\n * Available slots for content projection in this component.\n *\n * Slots allow you to insert custom content into predefined areas of the web component.\n * Use the `slot` attribute on child elements to target specific slots.\n *\n * - **footer**: Defines the footer HTML Element.\n\n**Note:** When you provide custom content for the `footer` slot, the default close button is not rendered.\nThis means you need to include your own mechanism within the custom `footer` to close the dialog,\nsuch as a button with an event listener that closes the dialog.\n\n**Note:** If the `footer` slot is not provided, a default footer with a close button is rendered automatically,\nallowing users to close the dialog without any additional implementation.\n * - **header**: Defines the header HTML Element.\n\n**Note:** If `header` slot is provided, the labelling of the dialog is a responsibility of the application developer.\n`accessibleName` should be used.\n *\n * @example\n * ```html\n * <ui5-barcode-scanner-dialog>\n * <div slot=\"header\">Custom header content</div>\n * <p>Default slot content</p>\n * </ui5-barcode-scanner-dialog>\n * ```\n *\n * @readonly\n * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}\n */\n readonly slots = [\n {\n \"name\": \"footer\",\n \"description\": \"Defines the footer HTML Element.\\n\\n**Note:** When you provide custom content for the `footer` slot, the default close button is not rendered.\\nThis means you need to include your own mechanism within the custom `footer` to close the dialog,\\nsuch as a button with an event listener that closes the dialog.\\n\\n**Note:** If the `footer` slot is not provided, a default footer with a close button is rendered automatically,\\nallowing users to close the dialog without any additional implementation.\",\n \"since\": \"2.4.0\"\n },\n {\n \"name\": \"header\",\n \"description\": \"Defines the header HTML Element.\\n\\n**Note:** If `header` slot is provided, the labelling of the dialog is a responsibility of the application developer.\\n`accessibleName` should be used.\",\n \"since\": \"2.4.0\"\n }\n ];\n\n\n public elementRef: ElementRef<_BarcodeScannerDialog> = inject(ElementRef);\n public injector = inject(Injector);\n\n /**\n * Content density observer is injected to activate automatic CSS class and\n * UI5 attribute application. The observer self-initializes, no explicit subscribe() needed.\n * @private\n */\n private readonly _contentDensityObserver = inject(ContentDensityObserver);\n\n get element(): _BarcodeScannerDialog {\n return this.elementRef.nativeElement;\n }\n\n ngAfterViewInit(): void {\n const wcElement = this.element;\n \n const inputsToSync = [\n 'open',\n ];\n \n // Synchronize inputs (properties)\n for (const inputName of inputsToSync) {\n // Find the corresponding camelCase signal property on the Angular component\n const signalName = inputName.replace(/-./g, (x: string) => x[1].toUpperCase());\n\n // Use the Injector to run the effect in the correct context\n if (this[signalName] && typeof this[signalName] === 'function') {\n runInInjectionContext(this.injector, () => {\n effect(() => {\n // Read the signal value\n const value = this[signalName]();\n if (wcElement) {\n // Write the value to the Web Component's property\n wcElement[inputName] = value;\n }\n });\n });\n }\n }\n \n \n const outputsToSync = [\n 'ui5Close',\n 'ui5ScanError',\n 'ui5ScanSuccess',\n ];\n \n // Synchronize outputs (events)\n for (const outputName of outputsToSync) {\n // Map Angular output name to UI5 web component event name\n const eventName = outputName.replace('ui5', '').replace(/([A-Z])/g, '-$1').toLowerCase().substring(1);\n // Ensure the output property exists and has an emit function before adding listener\n if (this[outputName] && typeof this[outputName].emit === 'function' && wcElement.addEventListener) {\n // Cast the listener to the correct type to satisfy TypeScript\n wcElement.addEventListener(eventName, (e) => {\n\n this[outputName].emit(e as CustomEvent<any>);\n });\n }\n }\n \n\n }\n}\n\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
@@ -21,14 +21,14 @@ class DynamicPageHeaderActions {
|
|
|
21
21
|
ngAfterViewInit() {
|
|
22
22
|
const wcElement = this.element;
|
|
23
23
|
}
|
|
24
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
25
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
24
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: DynamicPageHeaderActions, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
25
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.0", type: DynamicPageHeaderActions, isStandalone: true, selector: "ui5-dynamic-page-header-actions, [ui5-dynamic-page-header-actions]", providers: [
|
|
26
26
|
contentDensityObserverProviders({
|
|
27
27
|
supportedContentDensity: [ContentDensityMode.COMPACT, ContentDensityMode.COZY]
|
|
28
28
|
})
|
|
29
29
|
], exportAs: ["ui5DynamicPageHeaderActions"], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
30
30
|
}
|
|
31
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
31
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: DynamicPageHeaderActions, decorators: [{
|
|
32
32
|
type: Component,
|
|
33
33
|
args: [{
|
|
34
34
|
standalone: true,
|
|
@@ -9,8 +9,7 @@ class DynamicPageHeader {
|
|
|
9
9
|
* Defines the accessible ARIA label for the header region.
|
|
10
10
|
Overrides the default "Header Expanded" / "Header Snapped" text.
|
|
11
11
|
*/
|
|
12
|
-
this.accessibleName = input(
|
|
13
|
-
...(ngDevMode ? [undefined, { debugName: "accessibleName" }] : /* istanbul ignore next */ [])); // className is now passed
|
|
12
|
+
this.accessibleName = input(...(ngDevMode ? [undefined, { debugName: "accessibleName" }] : [])); // className is now passed
|
|
14
13
|
/**
|
|
15
14
|
* Available slots for content projection in this component.
|
|
16
15
|
*
|
|
@@ -64,11 +63,6 @@ class DynamicPageHeader {
|
|
|
64
63
|
// Read the signal value
|
|
65
64
|
const value = this[signalName]();
|
|
66
65
|
if (wcElement) {
|
|
67
|
-
// Skip writes when the signal is undefined and the property is already truthy
|
|
68
|
-
// This prevents clobbering imperatively-set values (e.g., from RouterLink)
|
|
69
|
-
if (value === undefined && wcElement[inputName]) {
|
|
70
|
-
return;
|
|
71
|
-
}
|
|
72
66
|
// Write the value to the Web Component's property
|
|
73
67
|
wcElement[inputName] = value;
|
|
74
68
|
}
|
|
@@ -77,14 +71,14 @@ class DynamicPageHeader {
|
|
|
77
71
|
}
|
|
78
72
|
}
|
|
79
73
|
}
|
|
80
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
81
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "
|
|
74
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: DynamicPageHeader, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
75
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.0", type: DynamicPageHeader, isStandalone: true, selector: "ui5-dynamic-page-header, [ui5-dynamic-page-header]", inputs: { accessibleName: { classPropertyName: "accessibleName", publicName: "accessibleName", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
|
|
82
76
|
contentDensityObserverProviders({
|
|
83
77
|
supportedContentDensity: [ContentDensityMode.COMPACT, ContentDensityMode.COZY]
|
|
84
78
|
})
|
|
85
79
|
], exportAs: ["ui5DynamicPageHeader"], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
86
80
|
}
|
|
87
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
81
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: DynamicPageHeader, decorators: [{
|
|
88
82
|
type: Component,
|
|
89
83
|
args: [{
|
|
90
84
|
standalone: true,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"fundamental-ngx-ui5-webcomponents-fiori-dynamic-page-header.mjs","sources":["../../../../libs/ui5-webcomponents-fiori/dynamic-page-header/index.ts","../../../../libs/ui5-webcomponents-fiori/dynamic-page-header/fundamental-ngx-ui5-webcomponents-fiori-dynamic-page-header.ts"],"sourcesContent":["\nimport {\n ChangeDetectionStrategy,\n Component,\n ElementRef,\n input,\n output,\n AfterViewInit,\n effect,\n runInInjectionContext,\n inject,\n Injector,\n booleanAttribute,\n computed,\n signal\n} from '@angular/core';\nimport '@ui5/webcomponents-fiori/dist/DynamicPageHeader.js';\nimport { default as _DynamicPageHeader } from '@ui5/webcomponents-fiori/dist/DynamicPageHeader.js';\nimport { UI5CustomEvent } from '@ui5/webcomponents-base';\nimport {\n ContentDensityObserver,\n contentDensityObserverProviders,\n ContentDensityMode\n} from '@fundamental-ngx/core/content-density';\n\n\n\n@Component({\n standalone: true,\n selector: 'ui5-dynamic-page-header, [ui5-dynamic-page-header]',\n template: '<ng-content></ng-content>',\n exportAs: 'ui5DynamicPageHeader',\n providers: [\n contentDensityObserverProviders({\n supportedContentDensity: [ContentDensityMode.COMPACT, ContentDensityMode.COZY]\n })\n ],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class DynamicPageHeader implements AfterViewInit {\n\n /**\n * Defines the accessible ARIA label for the header region.\nOverrides the default \"Header Expanded\" / \"Header Snapped\" text.\n */\n accessibleName = input<typeof _DynamicPageHeader.prototype.accessibleName | undefined>(); // className is now passed\n\n\n\n\n /**\n * Available slots for content projection in this component.\n *\n * Slots allow you to insert custom content into predefined areas of the web component.\n * Use the `slot` attribute on child elements to target specific slots.\n *\n * - **(default)**: Defines the content of the Dynamic Page Header.\n *\n * @example\n * ```html\n * <ui5-dynamic-page-header>\n * <div slot=\"header\">Custom header content</div>\n * <p>Default slot content</p>\n * </ui5-dynamic-page-header>\n * ```\n *\n * @readonly\n * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}\n */\n readonly slots = [\n {\n \"name\": \"default\",\n \"description\": \"Defines the content of the Dynamic Page Header.\"\n }\n ];\n\n\n public elementRef: ElementRef<_DynamicPageHeader> = inject(ElementRef);\n public injector = inject(Injector);\n\n /**\n * Content density observer is injected to activate automatic CSS class and\n * UI5 attribute application. The observer self-initializes, no explicit subscribe() needed.\n * @private\n */\n private readonly _contentDensityObserver = inject(ContentDensityObserver);\n\n get element(): _DynamicPageHeader {\n return this.elementRef.nativeElement;\n }\n\n ngAfterViewInit(): void {\n const wcElement = this.element;\n \n const inputsToSync = [\n 'accessibleName',\n ];\n \n // Synchronize inputs (properties)\n for (const inputName of inputsToSync) {\n // Find the corresponding camelCase signal property on the Angular component\n const signalName = inputName.replace(/-./g, (x: string) => x[1].toUpperCase());\n\n // Use the Injector to run the effect in the correct context\n if (this[signalName] && typeof this[signalName] === 'function') {\n runInInjectionContext(this.injector, () => {\n effect(() => {\n // Read the signal value\n const value = this[signalName]();\n if (wcElement) {\n //
|
|
1
|
+
{"version":3,"file":"fundamental-ngx-ui5-webcomponents-fiori-dynamic-page-header.mjs","sources":["../../../../libs/ui5-webcomponents-fiori/dynamic-page-header/index.ts","../../../../libs/ui5-webcomponents-fiori/dynamic-page-header/fundamental-ngx-ui5-webcomponents-fiori-dynamic-page-header.ts"],"sourcesContent":["\nimport {\n ChangeDetectionStrategy,\n Component,\n ElementRef,\n input,\n output,\n AfterViewInit,\n effect,\n runInInjectionContext,\n inject,\n Injector,\n booleanAttribute,\n computed,\n signal\n} from '@angular/core';\nimport '@ui5/webcomponents-fiori/dist/DynamicPageHeader.js';\nimport { default as _DynamicPageHeader } from '@ui5/webcomponents-fiori/dist/DynamicPageHeader.js';\nimport { UI5CustomEvent } from '@ui5/webcomponents-base';\nimport {\n ContentDensityObserver,\n contentDensityObserverProviders,\n ContentDensityMode\n} from '@fundamental-ngx/core/content-density';\n\n\n\n@Component({\n standalone: true,\n selector: 'ui5-dynamic-page-header, [ui5-dynamic-page-header]',\n template: '<ng-content></ng-content>',\n exportAs: 'ui5DynamicPageHeader',\n providers: [\n contentDensityObserverProviders({\n supportedContentDensity: [ContentDensityMode.COMPACT, ContentDensityMode.COZY]\n })\n ],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class DynamicPageHeader implements AfterViewInit {\n\n /**\n * Defines the accessible ARIA label for the header region.\nOverrides the default \"Header Expanded\" / \"Header Snapped\" text.\n */\n accessibleName = input<typeof _DynamicPageHeader.prototype.accessibleName | undefined>(); // className is now passed\n\n\n\n\n /**\n * Available slots for content projection in this component.\n *\n * Slots allow you to insert custom content into predefined areas of the web component.\n * Use the `slot` attribute on child elements to target specific slots.\n *\n * - **(default)**: Defines the content of the Dynamic Page Header.\n *\n * @example\n * ```html\n * <ui5-dynamic-page-header>\n * <div slot=\"header\">Custom header content</div>\n * <p>Default slot content</p>\n * </ui5-dynamic-page-header>\n * ```\n *\n * @readonly\n * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}\n */\n readonly slots = [\n {\n \"name\": \"default\",\n \"description\": \"Defines the content of the Dynamic Page Header.\"\n }\n ];\n\n\n public elementRef: ElementRef<_DynamicPageHeader> = inject(ElementRef);\n public injector = inject(Injector);\n\n /**\n * Content density observer is injected to activate automatic CSS class and\n * UI5 attribute application. The observer self-initializes, no explicit subscribe() needed.\n * @private\n */\n private readonly _contentDensityObserver = inject(ContentDensityObserver);\n\n get element(): _DynamicPageHeader {\n return this.elementRef.nativeElement;\n }\n\n ngAfterViewInit(): void {\n const wcElement = this.element;\n \n const inputsToSync = [\n 'accessibleName',\n ];\n \n // Synchronize inputs (properties)\n for (const inputName of inputsToSync) {\n // Find the corresponding camelCase signal property on the Angular component\n const signalName = inputName.replace(/-./g, (x: string) => x[1].toUpperCase());\n\n // Use the Injector to run the effect in the correct context\n if (this[signalName] && typeof this[signalName] === 'function') {\n runInInjectionContext(this.injector, () => {\n effect(() => {\n // Read the signal value\n const value = this[signalName]();\n if (wcElement) {\n // Write the value to the Web Component's property\n wcElement[inputName] = value;\n }\n });\n });\n }\n }\n \n \n \n\n }\n}\n\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
@@ -100,14 +100,14 @@ class DynamicPageTitle {
|
|
|
100
100
|
ngAfterViewInit() {
|
|
101
101
|
const wcElement = this.element;
|
|
102
102
|
}
|
|
103
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
104
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
103
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: DynamicPageTitle, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
104
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.0", type: DynamicPageTitle, isStandalone: true, selector: "ui5-dynamic-page-title, [ui5-dynamic-page-title]", providers: [
|
|
105
105
|
contentDensityObserverProviders({
|
|
106
106
|
supportedContentDensity: [ContentDensityMode.COMPACT, ContentDensityMode.COZY]
|
|
107
107
|
})
|
|
108
108
|
], exportAs: ["ui5DynamicPageTitle"], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
109
109
|
}
|
|
110
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
110
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: DynamicPageTitle, decorators: [{
|
|
111
111
|
type: Component,
|
|
112
112
|
args: [{
|
|
113
113
|
standalone: true,
|
|
@@ -28,24 +28,23 @@ class DynamicPage {
|
|
|
28
28
|
- **name**: Defines the accessible ARIA name of the area.
|
|
29
29
|
Accepts any string.
|
|
30
30
|
*/
|
|
31
|
-
this.accessibilityAttributes = input({},
|
|
32
|
-
...(ngDevMode ? [{ debugName: "accessibilityAttributes" }] : /* istanbul ignore next */ []));
|
|
31
|
+
this.accessibilityAttributes = input({}, ...(ngDevMode ? [{ debugName: "accessibilityAttributes" }] : []));
|
|
33
32
|
/**
|
|
34
33
|
* Defines if the header is pinned.
|
|
35
34
|
*/
|
|
36
|
-
this.headerPinned = input(false, { ...(ngDevMode ? { debugName: "headerPinned" } :
|
|
35
|
+
this.headerPinned = input(false, { ...(ngDevMode ? { debugName: "headerPinned" } : {}), transform: booleanAttribute });
|
|
37
36
|
/**
|
|
38
37
|
* Defines if the header is snapped.
|
|
39
38
|
*/
|
|
40
|
-
this.headerSnapped = input(false, { ...(ngDevMode ? { debugName: "headerSnapped" } :
|
|
39
|
+
this.headerSnapped = input(false, { ...(ngDevMode ? { debugName: "headerSnapped" } : {}), transform: booleanAttribute });
|
|
41
40
|
/**
|
|
42
41
|
* Defines if the pin button is hidden.
|
|
43
42
|
*/
|
|
44
|
-
this.hidePinButton = input(false, { ...(ngDevMode ? { debugName: "hidePinButton" } :
|
|
43
|
+
this.hidePinButton = input(false, { ...(ngDevMode ? { debugName: "hidePinButton" } : {}), transform: booleanAttribute });
|
|
45
44
|
/**
|
|
46
45
|
* Defines if the footer is shown.
|
|
47
46
|
*/
|
|
48
|
-
this.showFooter = input(false, { ...(ngDevMode ? { debugName: "showFooter" } :
|
|
47
|
+
this.showFooter = input(false, { ...(ngDevMode ? { debugName: "showFooter" } : {}), transform: booleanAttribute }); // className is now passed
|
|
49
48
|
/**
|
|
50
49
|
* Fired when the pin header button is toggled.
|
|
51
50
|
*/
|
|
@@ -126,11 +125,6 @@ class DynamicPage {
|
|
|
126
125
|
// Read the signal value
|
|
127
126
|
const value = this[signalName]();
|
|
128
127
|
if (wcElement) {
|
|
129
|
-
// Skip writes when the signal is undefined and the property is already truthy
|
|
130
|
-
// This prevents clobbering imperatively-set values (e.g., from RouterLink)
|
|
131
|
-
if (value === undefined && wcElement[inputName]) {
|
|
132
|
-
return;
|
|
133
|
-
}
|
|
134
128
|
// Write the value to the Web Component's property
|
|
135
129
|
wcElement[inputName] = value;
|
|
136
130
|
}
|
|
@@ -155,14 +149,14 @@ class DynamicPage {
|
|
|
155
149
|
}
|
|
156
150
|
}
|
|
157
151
|
}
|
|
158
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
159
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "
|
|
152
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: DynamicPage, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
153
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.0", type: DynamicPage, isStandalone: true, selector: "ui5-dynamic-page, [ui5-dynamic-page]", inputs: { accessibilityAttributes: { classPropertyName: "accessibilityAttributes", publicName: "accessibilityAttributes", isSignal: true, isRequired: false, transformFunction: null }, headerPinned: { classPropertyName: "headerPinned", publicName: "headerPinned", isSignal: true, isRequired: false, transformFunction: null }, headerSnapped: { classPropertyName: "headerSnapped", publicName: "headerSnapped", isSignal: true, isRequired: false, transformFunction: null }, hidePinButton: { classPropertyName: "hidePinButton", publicName: "hidePinButton", isSignal: true, isRequired: false, transformFunction: null }, showFooter: { classPropertyName: "showFooter", publicName: "showFooter", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ui5PinButtonToggle: "ui5PinButtonToggle", ui5TitleToggle: "ui5TitleToggle" }, providers: [
|
|
160
154
|
contentDensityObserverProviders({
|
|
161
155
|
supportedContentDensity: [ContentDensityMode.COMPACT, ContentDensityMode.COZY]
|
|
162
156
|
})
|
|
163
157
|
], exportAs: ["ui5DynamicPage"], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
164
158
|
}
|
|
165
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
159
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: DynamicPage, decorators: [{
|
|
166
160
|
type: Component,
|
|
167
161
|
args: [{
|
|
168
162
|
standalone: true,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"fundamental-ngx-ui5-webcomponents-fiori-dynamic-page.mjs","sources":["../../../../libs/ui5-webcomponents-fiori/dynamic-page/index.ts","../../../../libs/ui5-webcomponents-fiori/dynamic-page/fundamental-ngx-ui5-webcomponents-fiori-dynamic-page.ts"],"sourcesContent":["\nimport {\n ChangeDetectionStrategy,\n Component,\n ElementRef,\n input,\n output,\n AfterViewInit,\n effect,\n runInInjectionContext,\n inject,\n Injector,\n booleanAttribute,\n computed,\n signal\n} from '@angular/core';\nimport '@ui5/webcomponents-fiori/dist/DynamicPage.js';\nimport { default as _DynamicPage } from '@ui5/webcomponents-fiori/dist/DynamicPage.js';\nimport { UI5CustomEvent } from '@ui5/webcomponents-base';\nimport {\n ContentDensityObserver,\n contentDensityObserverProviders,\n ContentDensityMode\n} from '@fundamental-ngx/core/content-density';\n\nimport { DynamicPageAccessibilityAttributes } from '@ui5/webcomponents-fiori/dist/DynamicPage.js';\n\n@Component({\n standalone: true,\n selector: 'ui5-dynamic-page, [ui5-dynamic-page]',\n template: '<ng-content></ng-content>',\n exportAs: 'ui5DynamicPage',\n providers: [\n contentDensityObserverProviders({\n supportedContentDensity: [ContentDensityMode.COMPACT, ContentDensityMode.COZY]\n })\n ],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class DynamicPage implements AfterViewInit {\n\n /**\n * Defines additional accessibility attributes on different areas of the component.\n\nThe accessibilityAttributes object has the following fields,\nwhere each field is an object supporting one or more accessibility attributes:\n\n - **root**: `root.role` and `root.name`.\n - **header**: `header.role` and `header.name`.\n - **content**: `content.role` and `content.name`.\n - **footer**: `footer.role` and `footer.name`.\n\nThe accessibility attributes support the following values:\n\n- **role**: Defines the accessible ARIA landmark role of the area.\nAccepts the following values per section:\n`root` — `none`, `main`, `region`;\n`header` — `none`, `banner`, `region`;\n`content` — `none`, `main`, `region`, `form`;\n`footer` — `none`, `contentinfo`, `region`.\n\n- **name**: Defines the accessible ARIA name of the area.\nAccepts any string.\n */\n accessibilityAttributes = input<typeof _DynamicPage.prototype.accessibilityAttributes | undefined>({});\n\n /**\n * Defines if the header is pinned.\n */\n headerPinned = input(false, { transform: booleanAttribute });\n\n /**\n * Defines if the header is snapped.\n */\n headerSnapped = input(false, { transform: booleanAttribute });\n\n /**\n * Defines if the pin button is hidden.\n */\n hidePinButton = input(false, { transform: booleanAttribute });\n\n /**\n * Defines if the footer is shown.\n */\n showFooter = input(false, { transform: booleanAttribute }); // className is now passed\n\n\n\n /**\n * Fired when the pin header button is toggled.\n */\n ui5PinButtonToggle = output<UI5CustomEvent<_DynamicPage, 'pin-button-toggle'>>();\n\n /**\n * Fired when the expand/collapse area of the title is toggled.\n */\n ui5TitleToggle = output<UI5CustomEvent<_DynamicPage, 'title-toggle'>>();\n\n /**\n * Available slots for content projection in this component.\n *\n * Slots allow you to insert custom content into predefined areas of the web component.\n * Use the `slot` attribute on child elements to target specific slots.\n *\n * - **(default)**: Defines the content of the Dynamic Page.\n * - **footerArea**: Defines the footer HTML Element.\n * - **headerArea**: Defines the header HTML Element.\n * - **titleArea**: Defines the title HTML Element.\n *\n * @example\n * ```html\n * <ui5-dynamic-page>\n * <div slot=\"header\">Custom header content</div>\n * <p>Default slot content</p>\n * </ui5-dynamic-page>\n * ```\n *\n * @readonly\n * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}\n */\n readonly slots = [\n {\n \"name\": \"default\",\n \"description\": \"Defines the content of the Dynamic Page.\"\n },\n {\n \"name\": \"footerArea\",\n \"description\": \"Defines the footer HTML Element.\"\n },\n {\n \"name\": \"headerArea\",\n \"description\": \"Defines the header HTML Element.\"\n },\n {\n \"name\": \"titleArea\",\n \"description\": \"Defines the title HTML Element.\"\n }\n ];\n\n\n public elementRef: ElementRef<_DynamicPage> = inject(ElementRef);\n public injector = inject(Injector);\n\n /**\n * Content density observer is injected to activate automatic CSS class and\n * UI5 attribute application. The observer self-initializes, no explicit subscribe() needed.\n * @private\n */\n private readonly _contentDensityObserver = inject(ContentDensityObserver);\n\n get element(): _DynamicPage {\n return this.elementRef.nativeElement;\n }\n\n ngAfterViewInit(): void {\n const wcElement = this.element;\n \n const inputsToSync = [\n 'accessibilityAttributes',\n 'headerPinned',\n 'headerSnapped',\n 'hidePinButton',\n 'showFooter',\n ];\n \n // Synchronize inputs (properties)\n for (const inputName of inputsToSync) {\n // Find the corresponding camelCase signal property on the Angular component\n const signalName = inputName.replace(/-./g, (x: string) => x[1].toUpperCase());\n\n // Use the Injector to run the effect in the correct context\n if (this[signalName] && typeof this[signalName] === 'function') {\n runInInjectionContext(this.injector, () => {\n effect(() => {\n // Read the signal value\n const value = this[signalName]();\n if (wcElement) {\n // Skip writes when the signal is undefined and the property is already truthy\n // This prevents clobbering imperatively-set values (e.g., from RouterLink)\n if (value === undefined && wcElement[inputName]) {\n return;\n }\n // Write the value to the Web Component's property\n wcElement[inputName] = value;\n }\n });\n });\n }\n }\n \n \n const outputsToSync = [\n 'ui5PinButtonToggle',\n 'ui5TitleToggle',\n ];\n \n // Synchronize outputs (events)\n for (const outputName of outputsToSync) {\n // Map Angular output name to UI5 web component event name\n const eventName = outputName.replace('ui5', '').replace(/([A-Z])/g, '-$1').toLowerCase().substring(1);\n // Ensure the output property exists and has an emit function before adding listener\n if (this[outputName] && typeof this[outputName].emit === 'function' && wcElement.addEventListener) {\n // Cast the listener to the correct type to satisfy TypeScript\n wcElement.addEventListener(eventName, (e) => {\n\n this[outputName].emit(e as CustomEvent<any>);\n });\n }\n }\n \n\n }\n}\n\n// Re-export types for convenience\nexport { DynamicPageAccessibilityAttributes } from '@ui5/webcomponents-fiori/dist/DynamicPage.js';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"fundamental-ngx-ui5-webcomponents-fiori-dynamic-page.mjs","sources":["../../../../libs/ui5-webcomponents-fiori/dynamic-page/index.ts","../../../../libs/ui5-webcomponents-fiori/dynamic-page/fundamental-ngx-ui5-webcomponents-fiori-dynamic-page.ts"],"sourcesContent":["\nimport {\n ChangeDetectionStrategy,\n Component,\n ElementRef,\n input,\n output,\n AfterViewInit,\n effect,\n runInInjectionContext,\n inject,\n Injector,\n booleanAttribute,\n computed,\n signal\n} from '@angular/core';\nimport '@ui5/webcomponents-fiori/dist/DynamicPage.js';\nimport { default as _DynamicPage } from '@ui5/webcomponents-fiori/dist/DynamicPage.js';\nimport { UI5CustomEvent } from '@ui5/webcomponents-base';\nimport {\n ContentDensityObserver,\n contentDensityObserverProviders,\n ContentDensityMode\n} from '@fundamental-ngx/core/content-density';\n\nimport { DynamicPageAccessibilityAttributes } from '@ui5/webcomponents-fiori/dist/DynamicPage.js';\n\n@Component({\n standalone: true,\n selector: 'ui5-dynamic-page, [ui5-dynamic-page]',\n template: '<ng-content></ng-content>',\n exportAs: 'ui5DynamicPage',\n providers: [\n contentDensityObserverProviders({\n supportedContentDensity: [ContentDensityMode.COMPACT, ContentDensityMode.COZY]\n })\n ],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class DynamicPage implements AfterViewInit {\n\n /**\n * Defines additional accessibility attributes on different areas of the component.\n\nThe accessibilityAttributes object has the following fields,\nwhere each field is an object supporting one or more accessibility attributes:\n\n - **root**: `root.role` and `root.name`.\n - **header**: `header.role` and `header.name`.\n - **content**: `content.role` and `content.name`.\n - **footer**: `footer.role` and `footer.name`.\n\nThe accessibility attributes support the following values:\n\n- **role**: Defines the accessible ARIA landmark role of the area.\nAccepts the following values per section:\n`root` — `none`, `main`, `region`;\n`header` — `none`, `banner`, `region`;\n`content` — `none`, `main`, `region`, `form`;\n`footer` — `none`, `contentinfo`, `region`.\n\n- **name**: Defines the accessible ARIA name of the area.\nAccepts any string.\n */\n accessibilityAttributes = input<typeof _DynamicPage.prototype.accessibilityAttributes | undefined>({});\n\n /**\n * Defines if the header is pinned.\n */\n headerPinned = input(false, { transform: booleanAttribute });\n\n /**\n * Defines if the header is snapped.\n */\n headerSnapped = input(false, { transform: booleanAttribute });\n\n /**\n * Defines if the pin button is hidden.\n */\n hidePinButton = input(false, { transform: booleanAttribute });\n\n /**\n * Defines if the footer is shown.\n */\n showFooter = input(false, { transform: booleanAttribute }); // className is now passed\n\n\n\n /**\n * Fired when the pin header button is toggled.\n */\n ui5PinButtonToggle = output<UI5CustomEvent<_DynamicPage, 'pin-button-toggle'>>();\n\n /**\n * Fired when the expand/collapse area of the title is toggled.\n */\n ui5TitleToggle = output<UI5CustomEvent<_DynamicPage, 'title-toggle'>>();\n\n /**\n * Available slots for content projection in this component.\n *\n * Slots allow you to insert custom content into predefined areas of the web component.\n * Use the `slot` attribute on child elements to target specific slots.\n *\n * - **(default)**: Defines the content of the Dynamic Page.\n * - **footerArea**: Defines the footer HTML Element.\n * - **headerArea**: Defines the header HTML Element.\n * - **titleArea**: Defines the title HTML Element.\n *\n * @example\n * ```html\n * <ui5-dynamic-page>\n * <div slot=\"header\">Custom header content</div>\n * <p>Default slot content</p>\n * </ui5-dynamic-page>\n * ```\n *\n * @readonly\n * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}\n */\n readonly slots = [\n {\n \"name\": \"default\",\n \"description\": \"Defines the content of the Dynamic Page.\"\n },\n {\n \"name\": \"footerArea\",\n \"description\": \"Defines the footer HTML Element.\"\n },\n {\n \"name\": \"headerArea\",\n \"description\": \"Defines the header HTML Element.\"\n },\n {\n \"name\": \"titleArea\",\n \"description\": \"Defines the title HTML Element.\"\n }\n ];\n\n\n public elementRef: ElementRef<_DynamicPage> = inject(ElementRef);\n public injector = inject(Injector);\n\n /**\n * Content density observer is injected to activate automatic CSS class and\n * UI5 attribute application. The observer self-initializes, no explicit subscribe() needed.\n * @private\n */\n private readonly _contentDensityObserver = inject(ContentDensityObserver);\n\n get element(): _DynamicPage {\n return this.elementRef.nativeElement;\n }\n\n ngAfterViewInit(): void {\n const wcElement = this.element;\n \n const inputsToSync = [\n 'accessibilityAttributes',\n 'headerPinned',\n 'headerSnapped',\n 'hidePinButton',\n 'showFooter',\n ];\n \n // Synchronize inputs (properties)\n for (const inputName of inputsToSync) {\n // Find the corresponding camelCase signal property on the Angular component\n const signalName = inputName.replace(/-./g, (x: string) => x[1].toUpperCase());\n\n // Use the Injector to run the effect in the correct context\n if (this[signalName] && typeof this[signalName] === 'function') {\n runInInjectionContext(this.injector, () => {\n effect(() => {\n // Read the signal value\n const value = this[signalName]();\n if (wcElement) {\n // Write the value to the Web Component's property\n wcElement[inputName] = value;\n }\n });\n });\n }\n }\n \n \n const outputsToSync = [\n 'ui5PinButtonToggle',\n 'ui5TitleToggle',\n ];\n \n // Synchronize outputs (events)\n for (const outputName of outputsToSync) {\n // Map Angular output name to UI5 web component event name\n const eventName = outputName.replace('ui5', '').replace(/([A-Z])/g, '-$1').toLowerCase().substring(1);\n // Ensure the output property exists and has an emit function before adding listener\n if (this[outputName] && typeof this[outputName].emit === 'function' && wcElement.addEventListener) {\n // Cast the listener to the correct type to satisfy TypeScript\n wcElement.addEventListener(eventName, (e) => {\n\n this[outputName].emit(e as CustomEvent<any>);\n });\n }\n }\n \n\n }\n}\n\n// Re-export types for convenience\nexport { DynamicPageAccessibilityAttributes } from '@ui5/webcomponents-fiori/dist/DynamicPage.js';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
@@ -18,39 +18,35 @@ class DynamicSideContent {
|
|
|
18
18
|
- **ariaLabel**: defines the aria-label of the side content area. Accepts any string.
|
|
19
19
|
- **role**: defines the role of the side content area. When not set, defaults to `"complementary"`. Set to `undefined` to remove the role attribute.
|
|
20
20
|
*/
|
|
21
|
-
this.accessibilityAttributes = input({},
|
|
22
|
-
...(ngDevMode ? [{ debugName: "accessibilityAttributes" }] : /* istanbul ignore next */ []));
|
|
21
|
+
this.accessibilityAttributes = input({}, ...(ngDevMode ? [{ debugName: "accessibilityAttributes" }] : []));
|
|
23
22
|
/**
|
|
24
23
|
* Defines whether the component is in equal split mode. In this mode, the side and
|
|
25
24
|
the main content take 50:50 percent of the container on all screen sizes
|
|
26
25
|
except for phone, where the main and side contents are switching visibility
|
|
27
26
|
using the toggle method.
|
|
28
27
|
*/
|
|
29
|
-
this.equalSplit = input(false, { ...(ngDevMode ? { debugName: "equalSplit" } :
|
|
28
|
+
this.equalSplit = input(false, { ...(ngDevMode ? { debugName: "equalSplit" } : {}), transform: booleanAttribute });
|
|
30
29
|
/**
|
|
31
30
|
* Defines the visibility of the main content.
|
|
32
31
|
*/
|
|
33
|
-
this.hideMainContent = input(false, { ...(ngDevMode ? { debugName: "hideMainContent" } :
|
|
32
|
+
this.hideMainContent = input(false, { ...(ngDevMode ? { debugName: "hideMainContent" } : {}), transform: booleanAttribute });
|
|
34
33
|
/**
|
|
35
34
|
* Defines the visibility of the side content.
|
|
36
35
|
*/
|
|
37
|
-
this.hideSideContent = input(false, { ...(ngDevMode ? { debugName: "hideSideContent" } :
|
|
36
|
+
this.hideSideContent = input(false, { ...(ngDevMode ? { debugName: "hideSideContent" } : {}), transform: booleanAttribute });
|
|
38
37
|
/**
|
|
39
38
|
* Defines on which breakpoints the side content falls down below the main content.
|
|
40
39
|
*/
|
|
41
|
-
this.sideContentFallDown = input("OnMinimumWidth",
|
|
42
|
-
...(ngDevMode ? [{ debugName: "sideContentFallDown" }] : /* istanbul ignore next */ []));
|
|
40
|
+
this.sideContentFallDown = input("OnMinimumWidth", ...(ngDevMode ? [{ debugName: "sideContentFallDown" }] : []));
|
|
43
41
|
/**
|
|
44
42
|
* Defines whether the side content is positioned before the main content (left side
|
|
45
43
|
in LTR mode), or after the the main content (right side in LTR mode).
|
|
46
44
|
*/
|
|
47
|
-
this.sideContentPosition = input("End",
|
|
48
|
-
...(ngDevMode ? [{ debugName: "sideContentPosition" }] : /* istanbul ignore next */ []));
|
|
45
|
+
this.sideContentPosition = input("End", ...(ngDevMode ? [{ debugName: "sideContentPosition" }] : []));
|
|
49
46
|
/**
|
|
50
47
|
* Defines on which breakpoints the side content is visible.
|
|
51
48
|
*/
|
|
52
|
-
this.sideContentVisibility = input("ShowAboveS",
|
|
53
|
-
...(ngDevMode ? [{ debugName: "sideContentVisibility" }] : /* istanbul ignore next */ [])); // className is now passed
|
|
49
|
+
this.sideContentVisibility = input("ShowAboveS", ...(ngDevMode ? [{ debugName: "sideContentVisibility" }] : [])); // className is now passed
|
|
54
50
|
/**
|
|
55
51
|
* Fires when the current breakpoint has been changed.
|
|
56
52
|
*/
|
|
@@ -119,11 +115,6 @@ class DynamicSideContent {
|
|
|
119
115
|
// Read the signal value
|
|
120
116
|
const value = this[signalName]();
|
|
121
117
|
if (wcElement) {
|
|
122
|
-
// Skip writes when the signal is undefined and the property is already truthy
|
|
123
|
-
// This prevents clobbering imperatively-set values (e.g., from RouterLink)
|
|
124
|
-
if (value === undefined && wcElement[inputName]) {
|
|
125
|
-
return;
|
|
126
|
-
}
|
|
127
118
|
// Write the value to the Web Component's property
|
|
128
119
|
wcElement[inputName] = value;
|
|
129
120
|
}
|
|
@@ -147,14 +138,14 @@ class DynamicSideContent {
|
|
|
147
138
|
}
|
|
148
139
|
}
|
|
149
140
|
}
|
|
150
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
151
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "
|
|
141
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: DynamicSideContent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
142
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.0", type: DynamicSideContent, isStandalone: true, selector: "ui5-dynamic-side-content, [ui5-dynamic-side-content]", inputs: { accessibilityAttributes: { classPropertyName: "accessibilityAttributes", publicName: "accessibilityAttributes", isSignal: true, isRequired: false, transformFunction: null }, equalSplit: { classPropertyName: "equalSplit", publicName: "equalSplit", isSignal: true, isRequired: false, transformFunction: null }, hideMainContent: { classPropertyName: "hideMainContent", publicName: "hideMainContent", isSignal: true, isRequired: false, transformFunction: null }, hideSideContent: { classPropertyName: "hideSideContent", publicName: "hideSideContent", isSignal: true, isRequired: false, transformFunction: null }, sideContentFallDown: { classPropertyName: "sideContentFallDown", publicName: "sideContentFallDown", isSignal: true, isRequired: false, transformFunction: null }, sideContentPosition: { classPropertyName: "sideContentPosition", publicName: "sideContentPosition", isSignal: true, isRequired: false, transformFunction: null }, sideContentVisibility: { classPropertyName: "sideContentVisibility", publicName: "sideContentVisibility", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ui5LayoutChange: "ui5LayoutChange" }, providers: [
|
|
152
143
|
contentDensityObserverProviders({
|
|
153
144
|
supportedContentDensity: [ContentDensityMode.COMPACT, ContentDensityMode.COZY]
|
|
154
145
|
})
|
|
155
146
|
], exportAs: ["ui5DynamicSideContent"], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
156
147
|
}
|
|
157
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
148
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: DynamicSideContent, decorators: [{
|
|
158
149
|
type: Component,
|
|
159
150
|
args: [{
|
|
160
151
|
standalone: true,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"fundamental-ngx-ui5-webcomponents-fiori-dynamic-side-content.mjs","sources":["../../../../libs/ui5-webcomponents-fiori/dynamic-side-content/index.ts","../../../../libs/ui5-webcomponents-fiori/dynamic-side-content/fundamental-ngx-ui5-webcomponents-fiori-dynamic-side-content.ts"],"sourcesContent":["\nimport {\n ChangeDetectionStrategy,\n Component,\n ElementRef,\n input,\n output,\n AfterViewInit,\n effect,\n runInInjectionContext,\n inject,\n Injector,\n booleanAttribute,\n computed,\n signal\n} from '@angular/core';\nimport '@ui5/webcomponents-fiori/dist/DynamicSideContent.js';\nimport { default as _DynamicSideContent } from '@ui5/webcomponents-fiori/dist/DynamicSideContent.js';\nimport { UI5CustomEvent } from '@ui5/webcomponents-base';\nimport {\n ContentDensityObserver,\n contentDensityObserverProviders,\n ContentDensityMode\n} from '@fundamental-ngx/core/content-density';\n\nimport { DynamicSideContentAccessibilityAttributes } from '@ui5/webcomponents-fiori/dist/DynamicSideContent.js';\nimport { default as SideContentFallDown } from '@ui5/webcomponents-fiori/dist/types/SideContentFallDown.js';\nimport { default as SideContentPosition } from '@ui5/webcomponents-fiori/dist/types/SideContentPosition.js';\nimport { default as SideContentVisibility } from '@ui5/webcomponents-fiori/dist/types/SideContentVisibility.js';\n\n@Component({\n standalone: true,\n selector: 'ui5-dynamic-side-content, [ui5-dynamic-side-content]',\n template: '<ng-content></ng-content>',\n exportAs: 'ui5DynamicSideContent',\n providers: [\n contentDensityObserverProviders({\n supportedContentDensity: [ContentDensityMode.COMPACT, ContentDensityMode.COZY]\n })\n ],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class DynamicSideContent implements AfterViewInit {\n\n /**\n * Defines additional accessibility attributes on different areas of the component.\n\nThe accessibilityAttributes object has the following fields:\n\n- **mainContent**:\n - **ariaLabel**: defines the aria-label of the main content area. Accepts any string.\n - **role**: defines the role of the main content area. When not set, defaults to `\"main\"`. Set to `undefined` to remove the role attribute.\n\n- **sideContent**:\n - **ariaLabel**: defines the aria-label of the side content area. Accepts any string.\n - **role**: defines the role of the side content area. When not set, defaults to `\"complementary\"`. Set to `undefined` to remove the role attribute.\n */\n accessibilityAttributes = input<typeof _DynamicSideContent.prototype.accessibilityAttributes | undefined>({});\n\n /**\n * Defines whether the component is in equal split mode. In this mode, the side and\nthe main content take 50:50 percent of the container on all screen sizes\nexcept for phone, where the main and side contents are switching visibility\nusing the toggle method.\n */\n equalSplit = input(false, { transform: booleanAttribute });\n\n /**\n * Defines the visibility of the main content.\n */\n hideMainContent = input(false, { transform: booleanAttribute });\n\n /**\n * Defines the visibility of the side content.\n */\n hideSideContent = input(false, { transform: booleanAttribute });\n\n /**\n * Defines on which breakpoints the side content falls down below the main content.\n */\n sideContentFallDown = input<typeof _DynamicSideContent.prototype.sideContentFallDown | undefined>(\"OnMinimumWidth\");\n\n /**\n * Defines whether the side content is positioned before the main content (left side\nin LTR mode), or after the the main content (right side in LTR mode).\n */\n sideContentPosition = input<typeof _DynamicSideContent.prototype.sideContentPosition | undefined>(\"End\");\n\n /**\n * Defines on which breakpoints the side content is visible.\n */\n sideContentVisibility = input<typeof _DynamicSideContent.prototype.sideContentVisibility | undefined>(\"ShowAboveS\"); // className is now passed\n\n\n\n /**\n * Fires when the current breakpoint has been changed.\n */\n ui5LayoutChange = output<UI5CustomEvent<_DynamicSideContent, 'layout-change'>>();\n\n /**\n * Available slots for content projection in this component.\n *\n * Slots allow you to insert custom content into predefined areas of the web component.\n * Use the `slot` attribute on child elements to target specific slots.\n *\n * - **(default)**: Defines the main content.\n * - **sideContent**: Defines the side content.\n *\n * @example\n * ```html\n * <ui5-dynamic-side-content>\n * <div slot=\"header\">Custom header content</div>\n * <p>Default slot content</p>\n * </ui5-dynamic-side-content>\n * ```\n *\n * @readonly\n * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}\n */\n readonly slots = [\n {\n \"name\": \"default\",\n \"description\": \"Defines the main content.\"\n },\n {\n \"name\": \"sideContent\",\n \"description\": \"Defines the side content.\"\n }\n ];\n\n\n public elementRef: ElementRef<_DynamicSideContent> = inject(ElementRef);\n public injector = inject(Injector);\n\n /**\n * Content density observer is injected to activate automatic CSS class and\n * UI5 attribute application. The observer self-initializes, no explicit subscribe() needed.\n * @private\n */\n private readonly _contentDensityObserver = inject(ContentDensityObserver);\n\n get element(): _DynamicSideContent {\n return this.elementRef.nativeElement;\n }\n\n ngAfterViewInit(): void {\n const wcElement = this.element;\n \n const inputsToSync = [\n 'accessibilityAttributes',\n 'equalSplit',\n 'hideMainContent',\n 'hideSideContent',\n 'sideContentFallDown',\n 'sideContentPosition',\n 'sideContentVisibility',\n ];\n \n // Synchronize inputs (properties)\n for (const inputName of inputsToSync) {\n // Find the corresponding camelCase signal property on the Angular component\n const signalName = inputName.replace(/-./g, (x: string) => x[1].toUpperCase());\n\n // Use the Injector to run the effect in the correct context\n if (this[signalName] && typeof this[signalName] === 'function') {\n runInInjectionContext(this.injector, () => {\n effect(() => {\n // Read the signal value\n const value = this[signalName]();\n if (wcElement) {\n // Skip writes when the signal is undefined and the property is already truthy\n // This prevents clobbering imperatively-set values (e.g., from RouterLink)\n if (value === undefined && wcElement[inputName]) {\n return;\n }\n // Write the value to the Web Component's property\n wcElement[inputName] = value;\n }\n });\n });\n }\n }\n \n \n const outputsToSync = [\n 'ui5LayoutChange',\n ];\n \n // Synchronize outputs (events)\n for (const outputName of outputsToSync) {\n // Map Angular output name to UI5 web component event name\n const eventName = outputName.replace('ui5', '').replace(/([A-Z])/g, '-$1').toLowerCase().substring(1);\n // Ensure the output property exists and has an emit function before adding listener\n if (this[outputName] && typeof this[outputName].emit === 'function' && wcElement.addEventListener) {\n // Cast the listener to the correct type to satisfy TypeScript\n wcElement.addEventListener(eventName, (e) => {\n\n this[outputName].emit(e as CustomEvent<any>);\n });\n }\n }\n \n\n }\n}\n\n// Re-export types for convenience\nexport { DynamicSideContentAccessibilityAttributes } from '@ui5/webcomponents-fiori/dist/DynamicSideContent.js';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"fundamental-ngx-ui5-webcomponents-fiori-dynamic-side-content.mjs","sources":["../../../../libs/ui5-webcomponents-fiori/dynamic-side-content/index.ts","../../../../libs/ui5-webcomponents-fiori/dynamic-side-content/fundamental-ngx-ui5-webcomponents-fiori-dynamic-side-content.ts"],"sourcesContent":["\nimport {\n ChangeDetectionStrategy,\n Component,\n ElementRef,\n input,\n output,\n AfterViewInit,\n effect,\n runInInjectionContext,\n inject,\n Injector,\n booleanAttribute,\n computed,\n signal\n} from '@angular/core';\nimport '@ui5/webcomponents-fiori/dist/DynamicSideContent.js';\nimport { default as _DynamicSideContent } from '@ui5/webcomponents-fiori/dist/DynamicSideContent.js';\nimport { UI5CustomEvent } from '@ui5/webcomponents-base';\nimport {\n ContentDensityObserver,\n contentDensityObserverProviders,\n ContentDensityMode\n} from '@fundamental-ngx/core/content-density';\n\nimport { DynamicSideContentAccessibilityAttributes } from '@ui5/webcomponents-fiori/dist/DynamicSideContent.js';\nimport { default as SideContentFallDown } from '@ui5/webcomponents-fiori/dist/types/SideContentFallDown.js';\nimport { default as SideContentPosition } from '@ui5/webcomponents-fiori/dist/types/SideContentPosition.js';\nimport { default as SideContentVisibility } from '@ui5/webcomponents-fiori/dist/types/SideContentVisibility.js';\n\n@Component({\n standalone: true,\n selector: 'ui5-dynamic-side-content, [ui5-dynamic-side-content]',\n template: '<ng-content></ng-content>',\n exportAs: 'ui5DynamicSideContent',\n providers: [\n contentDensityObserverProviders({\n supportedContentDensity: [ContentDensityMode.COMPACT, ContentDensityMode.COZY]\n })\n ],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class DynamicSideContent implements AfterViewInit {\n\n /**\n * Defines additional accessibility attributes on different areas of the component.\n\nThe accessibilityAttributes object has the following fields:\n\n- **mainContent**:\n - **ariaLabel**: defines the aria-label of the main content area. Accepts any string.\n - **role**: defines the role of the main content area. When not set, defaults to `\"main\"`. Set to `undefined` to remove the role attribute.\n\n- **sideContent**:\n - **ariaLabel**: defines the aria-label of the side content area. Accepts any string.\n - **role**: defines the role of the side content area. When not set, defaults to `\"complementary\"`. Set to `undefined` to remove the role attribute.\n */\n accessibilityAttributes = input<typeof _DynamicSideContent.prototype.accessibilityAttributes | undefined>({});\n\n /**\n * Defines whether the component is in equal split mode. In this mode, the side and\nthe main content take 50:50 percent of the container on all screen sizes\nexcept for phone, where the main and side contents are switching visibility\nusing the toggle method.\n */\n equalSplit = input(false, { transform: booleanAttribute });\n\n /**\n * Defines the visibility of the main content.\n */\n hideMainContent = input(false, { transform: booleanAttribute });\n\n /**\n * Defines the visibility of the side content.\n */\n hideSideContent = input(false, { transform: booleanAttribute });\n\n /**\n * Defines on which breakpoints the side content falls down below the main content.\n */\n sideContentFallDown = input<typeof _DynamicSideContent.prototype.sideContentFallDown | undefined>(\"OnMinimumWidth\");\n\n /**\n * Defines whether the side content is positioned before the main content (left side\nin LTR mode), or after the the main content (right side in LTR mode).\n */\n sideContentPosition = input<typeof _DynamicSideContent.prototype.sideContentPosition | undefined>(\"End\");\n\n /**\n * Defines on which breakpoints the side content is visible.\n */\n sideContentVisibility = input<typeof _DynamicSideContent.prototype.sideContentVisibility | undefined>(\"ShowAboveS\"); // className is now passed\n\n\n\n /**\n * Fires when the current breakpoint has been changed.\n */\n ui5LayoutChange = output<UI5CustomEvent<_DynamicSideContent, 'layout-change'>>();\n\n /**\n * Available slots for content projection in this component.\n *\n * Slots allow you to insert custom content into predefined areas of the web component.\n * Use the `slot` attribute on child elements to target specific slots.\n *\n * - **(default)**: Defines the main content.\n * - **sideContent**: Defines the side content.\n *\n * @example\n * ```html\n * <ui5-dynamic-side-content>\n * <div slot=\"header\">Custom header content</div>\n * <p>Default slot content</p>\n * </ui5-dynamic-side-content>\n * ```\n *\n * @readonly\n * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}\n */\n readonly slots = [\n {\n \"name\": \"default\",\n \"description\": \"Defines the main content.\"\n },\n {\n \"name\": \"sideContent\",\n \"description\": \"Defines the side content.\"\n }\n ];\n\n\n public elementRef: ElementRef<_DynamicSideContent> = inject(ElementRef);\n public injector = inject(Injector);\n\n /**\n * Content density observer is injected to activate automatic CSS class and\n * UI5 attribute application. The observer self-initializes, no explicit subscribe() needed.\n * @private\n */\n private readonly _contentDensityObserver = inject(ContentDensityObserver);\n\n get element(): _DynamicSideContent {\n return this.elementRef.nativeElement;\n }\n\n ngAfterViewInit(): void {\n const wcElement = this.element;\n \n const inputsToSync = [\n 'accessibilityAttributes',\n 'equalSplit',\n 'hideMainContent',\n 'hideSideContent',\n 'sideContentFallDown',\n 'sideContentPosition',\n 'sideContentVisibility',\n ];\n \n // Synchronize inputs (properties)\n for (const inputName of inputsToSync) {\n // Find the corresponding camelCase signal property on the Angular component\n const signalName = inputName.replace(/-./g, (x: string) => x[1].toUpperCase());\n\n // Use the Injector to run the effect in the correct context\n if (this[signalName] && typeof this[signalName] === 'function') {\n runInInjectionContext(this.injector, () => {\n effect(() => {\n // Read the signal value\n const value = this[signalName]();\n if (wcElement) {\n // Write the value to the Web Component's property\n wcElement[inputName] = value;\n }\n });\n });\n }\n }\n \n \n const outputsToSync = [\n 'ui5LayoutChange',\n ];\n \n // Synchronize outputs (events)\n for (const outputName of outputsToSync) {\n // Map Angular output name to UI5 web component event name\n const eventName = outputName.replace('ui5', '').replace(/([A-Z])/g, '-$1').toLowerCase().substring(1);\n // Ensure the output property exists and has an emit function before adding listener\n if (this[outputName] && typeof this[outputName].emit === 'function' && wcElement.addEventListener) {\n // Cast the listener to the correct type to satisfy TypeScript\n wcElement.addEventListener(eventName, (e) => {\n\n this[outputName].emit(e as CustomEvent<any>);\n });\n }\n }\n \n\n }\n}\n\n// Re-export types for convenience\nexport { DynamicSideContentAccessibilityAttributes } from '@ui5/webcomponents-fiori/dist/DynamicSideContent.js';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
@@ -8,12 +8,11 @@ class FilterItemOption {
|
|
|
8
8
|
/**
|
|
9
9
|
* Defines if the filter option is selected.
|
|
10
10
|
*/
|
|
11
|
-
this.selected = input(false, { ...(ngDevMode ? { debugName: "selected" } :
|
|
11
|
+
this.selected = input(false, { ...(ngDevMode ? { debugName: "selected" } : {}), transform: booleanAttribute });
|
|
12
12
|
/**
|
|
13
13
|
* Defines the text of the filter option.
|
|
14
14
|
*/
|
|
15
|
-
this.text = input(
|
|
16
|
-
...(ngDevMode ? [undefined, { debugName: "text" }] : /* istanbul ignore next */ [])); // className is now passed
|
|
15
|
+
this.text = input(...(ngDevMode ? [undefined, { debugName: "text" }] : [])); // className is now passed
|
|
17
16
|
this.elementRef = inject(ElementRef);
|
|
18
17
|
this.injector = inject(Injector);
|
|
19
18
|
/**
|
|
@@ -43,11 +42,6 @@ class FilterItemOption {
|
|
|
43
42
|
// Read the signal value
|
|
44
43
|
const value = this[signalName]();
|
|
45
44
|
if (wcElement) {
|
|
46
|
-
// Skip writes when the signal is undefined and the property is already truthy
|
|
47
|
-
// This prevents clobbering imperatively-set values (e.g., from RouterLink)
|
|
48
|
-
if (value === undefined && wcElement[inputName]) {
|
|
49
|
-
return;
|
|
50
|
-
}
|
|
51
45
|
// Write the value to the Web Component's property
|
|
52
46
|
wcElement[inputName] = value;
|
|
53
47
|
}
|
|
@@ -56,14 +50,14 @@ class FilterItemOption {
|
|
|
56
50
|
}
|
|
57
51
|
}
|
|
58
52
|
}
|
|
59
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
60
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "
|
|
53
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: FilterItemOption, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
54
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.0", type: FilterItemOption, isStandalone: true, selector: "ui5-filter-item-option, [ui5-filter-item-option]", inputs: { selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null }, text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
|
|
61
55
|
contentDensityObserverProviders({
|
|
62
56
|
supportedContentDensity: [ContentDensityMode.COMPACT, ContentDensityMode.COZY]
|
|
63
57
|
})
|
|
64
58
|
], exportAs: ["ui5FilterItemOption"], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
65
59
|
}
|
|
66
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
60
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: FilterItemOption, decorators: [{
|
|
67
61
|
type: Component,
|
|
68
62
|
args: [{
|
|
69
63
|
standalone: true,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"fundamental-ngx-ui5-webcomponents-fiori-filter-item-option.mjs","sources":["../../../../libs/ui5-webcomponents-fiori/filter-item-option/index.ts","../../../../libs/ui5-webcomponents-fiori/filter-item-option/fundamental-ngx-ui5-webcomponents-fiori-filter-item-option.ts"],"sourcesContent":["\nimport {\n ChangeDetectionStrategy,\n Component,\n ElementRef,\n input,\n output,\n AfterViewInit,\n effect,\n runInInjectionContext,\n inject,\n Injector,\n booleanAttribute,\n computed,\n signal\n} from '@angular/core';\nimport '@ui5/webcomponents-fiori/dist/FilterItemOption.js';\nimport { default as _FilterItemOption } from '@ui5/webcomponents-fiori/dist/FilterItemOption.js';\nimport { UI5CustomEvent } from '@ui5/webcomponents-base';\nimport {\n ContentDensityObserver,\n contentDensityObserverProviders,\n ContentDensityMode\n} from '@fundamental-ngx/core/content-density';\n\n\n\n@Component({\n standalone: true,\n selector: 'ui5-filter-item-option, [ui5-filter-item-option]',\n template: '<ng-content></ng-content>',\n exportAs: 'ui5FilterItemOption',\n providers: [\n contentDensityObserverProviders({\n supportedContentDensity: [ContentDensityMode.COMPACT, ContentDensityMode.COZY]\n })\n ],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class FilterItemOption implements AfterViewInit {\n\n /**\n * Defines if the filter option is selected.\n */\n selected = input(false, { transform: booleanAttribute });\n\n /**\n * Defines the text of the filter option.\n */\n text = input<typeof _FilterItemOption.prototype.text | undefined>(); // className is now passed\n\n\n\n\n\n public elementRef: ElementRef<_FilterItemOption> = inject(ElementRef);\n public injector = inject(Injector);\n\n /**\n * Content density observer is injected to activate automatic CSS class and\n * UI5 attribute application. The observer self-initializes, no explicit subscribe() needed.\n * @private\n */\n private readonly _contentDensityObserver = inject(ContentDensityObserver);\n\n get element(): _FilterItemOption {\n return this.elementRef.nativeElement;\n }\n\n ngAfterViewInit(): void {\n const wcElement = this.element;\n \n const inputsToSync = [\n 'selected',\n 'text',\n ];\n \n // Synchronize inputs (properties)\n for (const inputName of inputsToSync) {\n // Find the corresponding camelCase signal property on the Angular component\n const signalName = inputName.replace(/-./g, (x: string) => x[1].toUpperCase());\n\n // Use the Injector to run the effect in the correct context\n if (this[signalName] && typeof this[signalName] === 'function') {\n runInInjectionContext(this.injector, () => {\n effect(() => {\n // Read the signal value\n const value = this[signalName]();\n if (wcElement) {\n //
|
|
1
|
+
{"version":3,"file":"fundamental-ngx-ui5-webcomponents-fiori-filter-item-option.mjs","sources":["../../../../libs/ui5-webcomponents-fiori/filter-item-option/index.ts","../../../../libs/ui5-webcomponents-fiori/filter-item-option/fundamental-ngx-ui5-webcomponents-fiori-filter-item-option.ts"],"sourcesContent":["\nimport {\n ChangeDetectionStrategy,\n Component,\n ElementRef,\n input,\n output,\n AfterViewInit,\n effect,\n runInInjectionContext,\n inject,\n Injector,\n booleanAttribute,\n computed,\n signal\n} from '@angular/core';\nimport '@ui5/webcomponents-fiori/dist/FilterItemOption.js';\nimport { default as _FilterItemOption } from '@ui5/webcomponents-fiori/dist/FilterItemOption.js';\nimport { UI5CustomEvent } from '@ui5/webcomponents-base';\nimport {\n ContentDensityObserver,\n contentDensityObserverProviders,\n ContentDensityMode\n} from '@fundamental-ngx/core/content-density';\n\n\n\n@Component({\n standalone: true,\n selector: 'ui5-filter-item-option, [ui5-filter-item-option]',\n template: '<ng-content></ng-content>',\n exportAs: 'ui5FilterItemOption',\n providers: [\n contentDensityObserverProviders({\n supportedContentDensity: [ContentDensityMode.COMPACT, ContentDensityMode.COZY]\n })\n ],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class FilterItemOption implements AfterViewInit {\n\n /**\n * Defines if the filter option is selected.\n */\n selected = input(false, { transform: booleanAttribute });\n\n /**\n * Defines the text of the filter option.\n */\n text = input<typeof _FilterItemOption.prototype.text | undefined>(); // className is now passed\n\n\n\n\n\n public elementRef: ElementRef<_FilterItemOption> = inject(ElementRef);\n public injector = inject(Injector);\n\n /**\n * Content density observer is injected to activate automatic CSS class and\n * UI5 attribute application. The observer self-initializes, no explicit subscribe() needed.\n * @private\n */\n private readonly _contentDensityObserver = inject(ContentDensityObserver);\n\n get element(): _FilterItemOption {\n return this.elementRef.nativeElement;\n }\n\n ngAfterViewInit(): void {\n const wcElement = this.element;\n \n const inputsToSync = [\n 'selected',\n 'text',\n ];\n \n // Synchronize inputs (properties)\n for (const inputName of inputsToSync) {\n // Find the corresponding camelCase signal property on the Angular component\n const signalName = inputName.replace(/-./g, (x: string) => x[1].toUpperCase());\n\n // Use the Injector to run the effect in the correct context\n if (this[signalName] && typeof this[signalName] === 'function') {\n runInInjectionContext(this.injector, () => {\n effect(() => {\n // Read the signal value\n const value = this[signalName]();\n if (wcElement) {\n // Write the value to the Web Component's property\n wcElement[inputName] = value;\n }\n });\n });\n }\n }\n \n \n \n\n }\n}\n\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|