npm - @ui5/webcomponents-fiori - Versions diffs - 1.14.0-rc.1 → 1.14.0 - Mend

@ui5/webcomponents-fiori 1.14.0-rc.1 → 1.14.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 (369) hide show

package/CHANGELOG.md CHANGED Viewed

@@ -3,6 +3,25 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
+# [1.14.0](https://github.com/SAP/ui5-webcomponents/compare/v1.14.0-rc.2...v1.14.0) (2023-06-01)
+**Note:** Version bump only for package @ui5/webcomponents-fiori
+# [1.14.0-rc.2](https://github.com/SAP/ui5-webcomponents/compare/v1.14.0-rc.1...v1.14.0-rc.2) (2023-06-01)
+### Features
+* **ui5-wizard:** introduce contentLayout property ([#7006](https://github.com/SAP/ui5-webcomponents/issues/7006)) ([66e9c3d](https://github.com/SAP/ui5-webcomponents/commit/66e9c3d83a945ae80e32d8614084b732cabd2bea))
 # [1.14.0-rc.1](https://github.com/SAP/ui5-webcomponents/compare/v1.14.0-rc.0...v1.14.0-rc.1) (2023-05-25)
 **Note:** Version bump only for package @ui5/webcomponents-fiori

package/dist/DynamicSideContent.d.ts CHANGED Viewed

@@ -4,6 +4,12 @@ import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js";
 import SideContentPosition from "./types/SideContentPosition.js";
 import SideContentVisibility from "./types/SideContentVisibility.js";
 import SideContentFallDown from "./types/SideContentFallDown.js";
+type DynamicSideContentLayoutChangeEventDetail = {
+    currentBreakpoint: string;
+    previousBreakpoint: string;
+    mainContentVisible: boolean;
+    sideContentVisible: boolean;
+};
 /**
  * @class
  *
@@ -257,3 +263,4 @@ declare class DynamicSideContent extends UI5Element {
     _setSpanSizes(mainSize: string, sideSize: string): void;
 }
 export default DynamicSideContent;
+export type { DynamicSideContentLayoutChangeEventDetail, };

package/dist/DynamicSideContent.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DynamicSideContent.js","sourceRoot":"","sources":["../src/DynamicSideContent.ts"],"names":[],"mappings":"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","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot.js\";\nimport type { ClassMap } from \"@ui5/webcomponents-base/dist/types.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport { getI18nBundle } from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport litRender from \"@ui5/webcomponents-base/dist/renderer/LitRenderer.js\";\nimport ResizeHandler from \"@ui5/webcomponents-base/dist/delegate/ResizeHandler.js\";\nimport SideContentPosition from \"./types/SideContentPosition.js\";\nimport SideContentVisibility from \"./types/SideContentVisibility.js\";\nimport SideContentFallDown from \"./types/SideContentFallDown.js\";\nimport DynamicSideContentTemplate from \"./generated/templates/DynamicSideContentTemplate.lit.js\";\n\n// Styles\nimport DynamicSideContentCss from \"./generated/themes/DynamicSideContent.css.js\";\n\n// Texts\nimport {\n\tDSC_SIDE_ARIA_LABEL,\n} from \"./generated/i18n/i18n-defaults.js\";\n\n// Breakpoint-related constants\nconst S_M_BREAKPOINT = 720,\t// Breakpoint between S and M screen sizes\n\tM_L_BREAKPOINT = 1024, // Breakpoint between M and L screen sizes\n\tL_XL_BREAKPOINT = 1440, // Breakpoint between L and XL screen sizes\n\tMINIMUM_WIDTH_BREAKPOINT = 960; // Minimum width of the control where main and side contents are side by side\n\n/*\n @class\n \n <h3 class=\"comment-api-title\">Overview</h3>\n \n The DynamicSideContent (<code>ui5-dynamic-side-content</code>) is a layout component that allows additional content\n * to be displayed in a way that flexibly adapts to different screen sizes. The side\n * content appears in a container next to or directly below the main content\n * (it doesn't overlay). When the side content is triggered, the main content becomes\n * narrower (if appearing side-by-side). The side content contains a separate scrollbar\n * when appearing next to the main content.\n \n \n * <h3>Usage</h3>\n \n <i>When to use?</i>\n \n Use this component if you want to display relevant information that is not critical\n * for users to complete a task. Users should have access to all the key functions and\n * critical information in the app even if they do not see the side content. This is\n * important because on smaller screen sizes it may be difficult to display the side\n * content in a way that is easily accessible for the user.\n \n <i>When not to use?</i>\n \n Don't use it if you want to display navigation or critical information that prevents\n * users from completing a task when they have no access to the side content.\n \n \n * <h3>Responsive Behavior</h3>\n \n Screen width > 1440px\n \n <ul><li>Main vs. side content ratio is 75 vs. 25 percent (with a minimum of 320px\n * each).</li>\n * <li>If the application defines a trigger, the side content can be hidden.</li></ul>\n \n Screen width <= 1440px and > 1024px\n \n <ul><li>Main vs. side content ratio is 66.666 vs. 33.333 percent (with a minimum of\n * 320px each). If the side content width falls below 320 px, it automatically slides\n * under the main content, unless the app development team specifies that it should\n * disappear.</li></ul>\n \n Screen width <= 1024px and > 720px\n \n <ul><li>The side content ratio is fixed to 340px, and the main content takes the rest\n * of the width. Only if the <code>sideContentFallDown</code> is set to <code>OnMinimumWidth</code>\n * and screen width is <= 960px and > 720px the side content falls below the main content.</li></ul>\n \n Screen width <= 720px (for example on a mobile device)\n \n <ul><li>In this case, the side content automatically disappears from the screen (unless\n * specified to stay under the content by setting of <code>sideContentVisibility</code>\n * property to <code>AlwaysShow</code>) and can be triggered from a pre-set trigger\n * (specified within the app). When the side content is triggered, it replaces the main\n * content. We recommend that you always place the trigger for the side content in the\n * same location, such as in the app footer.</li></ul>\n \n A special case allows switching the comparison mode between the main and side content.\n * In this case, the screen is split into 50:50 percent for main vs. side content. The\n * responsive behavior of the equal split is the same as in the standard view - the\n * side content disappears on screen widths of less than 720 px and can only be\n * viewed by triggering it.\n \n <h3>ES6 Module Import</h3>\n \n <code>import \"@ui5/webcomponents-fiori/dist/DynamicSideContent\";</code>\n \n @constructor\n * @author SAP SE\n * @alias sap.ui.webc.fiori.DynamicSideContent\n * @extends sap.ui.webc.base.UI5Element\n * @tagname ui5-dynamic-side-content\n * @public\n * @since 1.1.0\n /\n@customElement({\n\ttag: \"ui5-dynamic-side-content\",\n\trenderer: litRender,\n\tstyles: DynamicSideContentCss,\n\ttemplate: DynamicSideContentTemplate,\n})\n/\n Fires when the current breakpoint has been changed.\n * @event sap.ui.webc.fiori.DynamicSideContent#layout-change\n * @param {string} currentBreakpoint the current breakpoint.\n * @param {string} previousBreakpoint the breakpoint that was active before change to current breakpoint.\n * @param {boolean} mainContentVisible visibility of the main content.\n * @param {boolean} sideContentVisible visibility of the side content.\n * @public\n /\n@event(\"layout-change\", {\n\tdetail: {\n\t\tcurrentBreakpoint: {\n\t\t\ttype: String,\n\t\t},\n\t\tpreviousBreakpoint: {\n\t\t\ttype: String,\n\t\t},\n\t\tmainContentVisible: {\n\t\t\ttype: Boolean,\n\t\t},\n\t\tsideContentVisible: {\n\t\t\ttype: Boolean,\n\t\t},\n\t},\n})\nclass DynamicSideContent extends UI5Element {\n\t/\n\t Defines the visibility of the main content.\n\t \n\t @type {boolean}\n\t * @name sap.ui.webc.fiori.DynamicSideContent.prototype.hideMainContent\n\t * @defaultvalue false\n\t * @public\n\t \n\t /\n\t@property({ type: Boolean })\n\thideMainContent!: boolean;\n\n\t/*\n\t Defines the visibility of the side content.\n\t \n\t @type {boolean}\n\t * @name sap.ui.webc.fiori.DynamicSideContent.prototype.hideSideContent\n\t * @defaultvalue false\n\t * @public\n\t \n\t /\n\t@property({ type: Boolean })\n\thideSideContent!: boolean;\n\n\t/*\n\t Defines whether the side content is positioned before the main content (left side\n\t * in LTR mode), or after the the main content (right side in LTR mode).\n\t \n\t <br><br>\n\t * <b>The available values are:</b>\n\t \n\t <ul>\n\t * <li><code>Start</code></li>\n\t * <li><code>End</code></li>\n\t * </ul>\n\t \n\t @type {sap.ui.webc.fiori.types.SideContentPosition}\n\t * @name sap.ui.webc.fiori.DynamicSideContent.prototype.sideContentPosition\n\t * @defaultvalue \"End\"\n\t * @public\n\t \n\t /\n\t@property({ type: SideContentPosition, defaultValue: SideContentPosition.End })\n\tsideContentPosition!: `${SideContentPosition}`;\n\n\t/*\n\t Defines on which breakpoints the side content is visible.\n\t \n\t <br><br>\n\t * <b>The available values are:</b>\n\t \n\t <ul>\n\t * <li><code>AlwaysShow</code></li>\n\t * <li><code>ShowAboveL</code></li>\n\t * <li><code>ShowAboveM</code></li>\n\t * <li><code>ShowAboveS</code></li>\n\t * <li><code>NeverShow</code></li>\n\t * </ul>\n\t \n\t @type {sap.ui.webc.fiori.types.SideContentVisibility}\n\t * @name sap.ui.webc.fiori.DynamicSideContent.prototype.sideContentVisibility\n\t * @defaultvalue \"ShowAboveS\"\n\t * @public\n\t \n\t /\n\t@property({ type: SideContentVisibility, defaultValue: SideContentVisibility.ShowAboveS })\n\tsideContentVisibility!: `${SideContentVisibility}`;\n\n\t/*\n\t Defines on which breakpoints the side content falls down below the main content.\n\t \n\t <br><br>\n\t * <b>The available values are:</b>\n\t \n\t <ul>\n\t * <li><code>BelowXL</code></li>\n\t * <li><code>BelowL</code></li>\n\t * <li><code>BelowM</code></li>\n\t * <li><code>OnMinimumWidth</code></li>\n\t * </ul>\n\t \n\t @type {sap.ui.webc.fiori.types.SideContentFallDown}\n\t * @name sap.ui.webc.fiori.DynamicSideContent.prototype.sideContentFallDown\n\t * @defaultvalue \"OnMinimumWidth\"\n\t * @public\n\t \n\t /\n\t@property({ type: SideContentFallDown, defaultValue: SideContentFallDown.OnMinimumWidth })\n\tsideContentFallDown!: `${SideContentFallDown}`;\n\n\t/*\n\t Defines whether the component is in equal split mode. In this mode, the side and\n\t * the main content take 50:50 percent of the container on all screen sizes\n\t * except for phone, where the main and side contents are switching visibility\n\t * using the toggle method.\n\t \n\t @type {boolean}]\n\t * @name sap.ui.webc.fiori.DynamicSideContent.prototype.equalSplit\n\t * @defaultvalue false\n\t * @public\n\t \n\t /\n\t@property({ type: Boolean })\n\tequalSplit!: boolean;\n\n\t/*\n\t @private\n\t /\n\t@property({ defaultValue: \"0\", noAttribute: true })\n\t_mcSpan!: string;\n\n\t/\n\t @private\n\t /\n\t@property({ defaultValue: \"0\", noAttribute: true })\n\t_scSpan!: string;\n\n\t/\n\t @private\n\t /\n\t@property({ type: Boolean, noAttribute: true })\n\t_toggled!: boolean;\n\n\t/\n\t @private\n\t /\n\t@property({ noAttribute: true })\n\t_currentBreakpoint!: string;\n\n\t/\n\t Defines the main content.\n\t \n\t @type {HTMLElement[]}\n\t * @name sap.ui.webc.fiori.DynamicSideContent.prototype.default\n\t * @slot\n\t * @public\n\t /\n\n\t/\n\t Defines the side content.\n\t \n\t @type {HTMLElement[]}\n\t * @name sap.ui.webc.fiori.DynamicSideContent.prototype.sideContent\n\t * @slot\n\t * @public\n\t /\n\t@slot()\n\tsideContent!: Array<HTMLElement>;\n\n\tconstructor() {\n\t\tsuper();\n\t\tthis._handleResizeBound = this.handleResize.bind(this);\n\t}\n\n\t_handleResizeBound: () => void;\n\n\tstatic i18nBundle: I18nBundle;\n\n\tstatic async onDefine() {\n\t\tDynamicSideContent.i18nBundle = await getI18nBundle(\"@ui5/webcomponents-fiori\");\n\t}\n\n\tonAfterRendering() {\n\t\tthis._resizeContents();\n\t}\n\n\tonEnterDOM() {\n\t\tResizeHandler.register(this, this._handleResizeBound);\n\t}\n\n\tonExitDOM() {\n\t\tResizeHandler.deregister(this, this._handleResizeBound);\n\t}\n\n\t/\n\t Toggles visibility of main and side contents on S screen size (mobile device).\n\t * @public\n\t * @method\n\t * @name sap.ui.webc.fiori.DynamicSideContent#toggleContents\n\t */\n\ttoggleContents() {\n\t\tif (this.breakpoint === this.sizeS && this.sideContentVisibility !== SideContentVisibility.AlwaysShow) {\n\t\t\tthis._toggled = !this._toggled;\n\t\t}\n\t}\n\n\tget classes(): ClassMap {\n\t\tconst gridPrefix = \"ui5-dsc-span\",\n\t\t\tmcSpan = this._toggled ? this._scSpan : this._mcSpan,\n\t\t\tscSpan = this._toggled ? this._mcSpan : this._scSpan,\n\t\t\tclasses: ClassMap = {\n\t\t\t\tmain: {\n\t\t\t\t\t\"ui5-dsc-main\": true,\n\t\t\t\t},\n\t\t\t\tside: {\n\t\t\t\t\t\"ui5-dsc-side\": true,\n\t\t\t\t},\n\t\t\t};\n\n\t\tclasses.main[`${gridPrefix}-${mcSpan}`] = true;\n\t\tclasses.side[`${gridPrefix}-${scSpan}`] = true;\n\n\t\treturn classes;\n\t}\n\n\tget styles() {\n\t\tconst isToggled = this.breakpoint === this.sizeS && this._toggled,\n\t\t\tmcSpan = isToggled ? this._scSpan : this._mcSpan,\n\t\t\tscSpan = isToggled ? this._mcSpan : this._scSpan,\n\t\t\tcontentHeight = this.breakpoint === this.sizeS && this.sideContentVisibility !== SideContentVisibility.AlwaysShow ? \"100%\" : \"auto\";\n\n\t\treturn {\n\t\t\troot: {\n\t\t\t\t\"flex-wrap\": this._mcSpan === \"12\" ? \"wrap\" : \"nowrap\",\n\t\t\t},\n\t\t\tmain: {\n\t\t\t\t\"height\": mcSpan === this.span12 ? contentHeight : \"100%\",\n\t\t\t},\n\t\t\tside: {\n\t\t\t\t\"height\": scSpan === this.span12 ? contentHeight : \"100%\",\n\t\t\t},\n\t\t};\n\t}\n\n\tget accInfo() {\n\t\treturn {\n\t\t\t\"label\": DynamicSideContent.i18nBundle.getText(DSC_SIDE_ARIA_LABEL),\n\t\t};\n\t}\n\n\tget sizeS() {\n\t\treturn \"S\";\n\t}\n\n\tget sizeM() {\n\t\treturn \"M\";\n\t}\n\n\tget sizeL() {\n\t\treturn \"L\";\n\t}\n\n\tget sizeXL() {\n\t\treturn \"XL\";\n\t}\n\n\tget span0() {\n\t\treturn \"0\";\n\t}\n\n\tget span3() {\n\t\treturn \"3\";\n\t}\n\n\tget span4() {\n\t\treturn \"4\";\n\t}\n\n\tget span6() {\n\t\treturn \"6\";\n\t}\n\n\tget span8() {\n\t\treturn \"8\";\n\t}\n\n\tget span9() {\n\t\treturn \"9\";\n\t}\n\n\tget span12() {\n\t\treturn \"12\";\n\t}\n\n\tget spanFixed() {\n\t\treturn \"fixed\";\n\t}\n\n\tget containerWidth() {\n\t\treturn (this.parentElement as HTMLElement).clientWidth;\n\t}\n\n\tget breakpoint() {\n\t\tlet size;\n\n\t\tif (this.containerWidth <= S_M_BREAKPOINT) {\n\t\t\tsize = this.sizeS;\n\t\t} else if (this.containerWidth > S_M_BREAKPOINT && this.containerWidth <= M_L_BREAKPOINT) {\n\t\t\tsize = this.sizeM;\n\t\t} else if (this.containerWidth > M_L_BREAKPOINT && this.containerWidth <= L_XL_BREAKPOINT) {\n\t\t\tsize = this.sizeL;\n\t\t} else {\n\t\t\tsize = this.sizeXL;\n\t\t}\n\n\t\treturn size;\n\t}\n\n\tget _isSideContentFirst() {\n\t\treturn this.sideContentPosition === SideContentPosition.Start;\n\t}\n\n\thandleResize() {\n\t\tthis._resizeContents();\n\t}\n\n\t_resizeContents() {\n\t\tlet mainSize!: string,\n\t\t\tsideSize!: string,\n\t\t\tsideVisible!: boolean;\n\n\t\t// initial set contents sizes\n\t\tswitch (this.breakpoint) {\n\t\tcase this.sizeS:\n\t\t\tmainSize = this.span12;\n\t\t\tsideSize = this.span12;\n\t\t\tbreak;\n\t\tcase this.sizeM:\n\t\t\tif (this.sideContentFallDown === SideContentFallDown.BelowXL\n\t\t\t\t\|\| this.sideContentFallDown === SideContentFallDown.BelowL\n\t\t\t\t\|\| (this.containerWidth <= MINIMUM_WIDTH_BREAKPOINT && this.sideContentFallDown === SideContentFallDown.OnMinimumWidth)) {\n\t\t\t\tmainSize = this.span12;\n\t\t\t\tsideSize = this.span12;\n\t\t\t} else {\n\t\t\t\tmainSize = this.equalSplit ? this.span6 : this.spanFixed;\n\t\t\t\tsideSize = this.equalSplit ? this.span6 : this.spanFixed;\n\t\t\t}\n\t\t\tsideVisible = this.sideContentVisibility === SideContentVisibility.ShowAboveS\n\t\t\t\t\|\| this.sideContentVisibility === SideContentVisibility.AlwaysShow;\n\t\t\tbreak;\n\t\tcase this.sizeL:\n\t\t\tif (this.sideContentFallDown === SideContentFallDown.BelowXL) {\n\t\t\t\tmainSize = this.span12;\n\t\t\t\tsideSize = this.span12;\n\t\t\t} else {\n\t\t\t\tmainSize = this.equalSplit ? this.span6 : this.span8;\n\t\t\t\tsideSize = this.equalSplit ? this.span6 : this.span4;\n\t\t\t}\n\t\t\tsideVisible = this.sideContentVisibility === SideContentVisibility.ShowAboveS\n\t\t\t\t\|\| this.sideContentVisibility === SideContentVisibility.ShowAboveM\n\t\t\t\t\|\| this.sideContentVisibility === SideContentVisibility.AlwaysShow;\n\t\t\tbreak;\n\t\tcase this.sizeXL:\n\t\t\tmainSize = this.equalSplit ? this.span6 : this.span9;\n\t\t\tsideSize = this.equalSplit ? this.span6 : this.span3;\n\t\t\tsideVisible = this.sideContentVisibility !== SideContentVisibility.NeverShow;\n\t\t}\n\n\t\tif (this.sideContentVisibility === SideContentVisibility.AlwaysShow) {\n\t\t\tsideVisible = true;\n\t\t}\n\n\t\t// modify sizes of the contents depending on hideMainContent and hideSideContent properties\n\t\tif (this.hideSideContent) {\n\t\t\tmainSize = this.hideMainContent ? this.span0 : this.span12;\n\t\t\tsideSize = this.span0;\n\t\t\tsideVisible = false;\n\t\t}\n\n\t\tif (this.hideMainContent) {\n\t\t\tmainSize = this.span0;\n\t\t\tsideSize = this.hideSideContent ? this.span0 : this.span12;\n\t\t\tsideVisible = true;\n\t\t}\n\n\t\t// set final sizes of the contents\n\t\tif (!sideVisible) {\n\t\t\tmainSize = this.span12;\n\t\t\tsideSize = this.span0;\n\t\t}\n\n\t\t// fire \"layout-change\" event\n\t\tif (this._currentBreakpoint !== this.breakpoint) {\n\t\t\tconst eventParams = {\n\t\t\t\tcurrentBreakpoint: this.breakpoint,\n\t\t\t\tpreviousBreakpoint: this._currentBreakpoint,\n\t\t\t\tmainContentVisible: mainSize !== this.span0,\n\t\t\t\tsideContentVisible: sideSize !== this.span0,\n\t\t\t};\n\t\t\tthis.fireEvent(\"layout-change\", eventParams);\n\t\t\tthis._currentBreakpoint = this.breakpoint;\n\t\t}\n\n\t\t// update contents sizes\n\t\tthis._setSpanSizes(mainSize, sideSize);\n\t}\n\n\t_setSpanSizes(mainSize: string, sideSize: string) {\n\t\tthis._mcSpan = mainSize;\n\t\tthis._scSpan = sideSize;\n\t\tif (this.breakpoint !== this.sizeS) {\n\t\t\tthis._toggled = false;\n\t\t}\n\t}\n}\n\nDynamicSideContent.define();\n\nexport default DynamicSideContent;\n"]}
1	+ {"version":3,"file":"DynamicSideContent.js","sourceRoot":"","sources":["../src/DynamicSideContent.ts"],"names":[],"mappings":"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","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot.js\";\nimport type { ClassMap } from \"@ui5/webcomponents-base/dist/types.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport { getI18nBundle } from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport litRender from \"@ui5/webcomponents-base/dist/renderer/LitRenderer.js\";\nimport ResizeHandler from \"@ui5/webcomponents-base/dist/delegate/ResizeHandler.js\";\nimport SideContentPosition from \"./types/SideContentPosition.js\";\nimport SideContentVisibility from \"./types/SideContentVisibility.js\";\nimport SideContentFallDown from \"./types/SideContentFallDown.js\";\nimport DynamicSideContentTemplate from \"./generated/templates/DynamicSideContentTemplate.lit.js\";\n\n// Styles\nimport DynamicSideContentCss from \"./generated/themes/DynamicSideContent.css.js\";\n\n// Texts\nimport {\n\tDSC_SIDE_ARIA_LABEL,\n} from \"./generated/i18n/i18n-defaults.js\";\n\n// Breakpoint-related constants\nconst S_M_BREAKPOINT = 720,\t// Breakpoint between S and M screen sizes\n\tM_L_BREAKPOINT = 1024, // Breakpoint between M and L screen sizes\n\tL_XL_BREAKPOINT = 1440, // Breakpoint between L and XL screen sizes\n\tMINIMUM_WIDTH_BREAKPOINT = 960; // Minimum width of the control where main and side contents are side by side\n\ntype DynamicSideContentLayoutChangeEventDetail = {\n\tcurrentBreakpoint: string,\n\tpreviousBreakpoint: string,\n\tmainContentVisible: boolean,\n\tsideContentVisible: boolean,\n}\n\n/*\n @class\n \n <h3 class=\"comment-api-title\">Overview</h3>\n \n The DynamicSideContent (<code>ui5-dynamic-side-content</code>) is a layout component that allows additional content\n * to be displayed in a way that flexibly adapts to different screen sizes. The side\n * content appears in a container next to or directly below the main content\n * (it doesn't overlay). When the side content is triggered, the main content becomes\n * narrower (if appearing side-by-side). The side content contains a separate scrollbar\n * when appearing next to the main content.\n \n \n * <h3>Usage</h3>\n \n <i>When to use?</i>\n \n Use this component if you want to display relevant information that is not critical\n * for users to complete a task. Users should have access to all the key functions and\n * critical information in the app even if they do not see the side content. This is\n * important because on smaller screen sizes it may be difficult to display the side\n * content in a way that is easily accessible for the user.\n \n <i>When not to use?</i>\n \n Don't use it if you want to display navigation or critical information that prevents\n * users from completing a task when they have no access to the side content.\n \n \n * <h3>Responsive Behavior</h3>\n \n Screen width > 1440px\n \n <ul><li>Main vs. side content ratio is 75 vs. 25 percent (with a minimum of 320px\n * each).</li>\n * <li>If the application defines a trigger, the side content can be hidden.</li></ul>\n \n Screen width <= 1440px and > 1024px\n \n <ul><li>Main vs. side content ratio is 66.666 vs. 33.333 percent (with a minimum of\n * 320px each). If the side content width falls below 320 px, it automatically slides\n * under the main content, unless the app development team specifies that it should\n * disappear.</li></ul>\n \n Screen width <= 1024px and > 720px\n \n <ul><li>The side content ratio is fixed to 340px, and the main content takes the rest\n * of the width. Only if the <code>sideContentFallDown</code> is set to <code>OnMinimumWidth</code>\n * and screen width is <= 960px and > 720px the side content falls below the main content.</li></ul>\n \n Screen width <= 720px (for example on a mobile device)\n \n <ul><li>In this case, the side content automatically disappears from the screen (unless\n * specified to stay under the content by setting of <code>sideContentVisibility</code>\n * property to <code>AlwaysShow</code>) and can be triggered from a pre-set trigger\n * (specified within the app). When the side content is triggered, it replaces the main\n * content. We recommend that you always place the trigger for the side content in the\n * same location, such as in the app footer.</li></ul>\n \n A special case allows switching the comparison mode between the main and side content.\n * In this case, the screen is split into 50:50 percent for main vs. side content. The\n * responsive behavior of the equal split is the same as in the standard view - the\n * side content disappears on screen widths of less than 720 px and can only be\n * viewed by triggering it.\n \n <h3>ES6 Module Import</h3>\n \n <code>import \"@ui5/webcomponents-fiori/dist/DynamicSideContent\";</code>\n \n @constructor\n * @author SAP SE\n * @alias sap.ui.webc.fiori.DynamicSideContent\n * @extends sap.ui.webc.base.UI5Element\n * @tagname ui5-dynamic-side-content\n * @public\n * @since 1.1.0\n /\n@customElement({\n\ttag: \"ui5-dynamic-side-content\",\n\trenderer: litRender,\n\tstyles: DynamicSideContentCss,\n\ttemplate: DynamicSideContentTemplate,\n})\n/\n Fires when the current breakpoint has been changed.\n * @event sap.ui.webc.fiori.DynamicSideContent#layout-change\n * @param {string} currentBreakpoint the current breakpoint.\n * @param {string} previousBreakpoint the breakpoint that was active before change to current breakpoint.\n * @param {boolean} mainContentVisible visibility of the main content.\n * @param {boolean} sideContentVisible visibility of the side content.\n * @public\n /\n@event(\"layout-change\", {\n\tdetail: {\n\t\tcurrentBreakpoint: {\n\t\t\ttype: String,\n\t\t},\n\t\tpreviousBreakpoint: {\n\t\t\ttype: String,\n\t\t},\n\t\tmainContentVisible: {\n\t\t\ttype: Boolean,\n\t\t},\n\t\tsideContentVisible: {\n\t\t\ttype: Boolean,\n\t\t},\n\t},\n})\nclass DynamicSideContent extends UI5Element {\n\t/\n\t Defines the visibility of the main content.\n\t \n\t @type {boolean}\n\t * @name sap.ui.webc.fiori.DynamicSideContent.prototype.hideMainContent\n\t * @defaultvalue false\n\t * @public\n\t \n\t /\n\t@property({ type: Boolean })\n\thideMainContent!: boolean;\n\n\t/*\n\t Defines the visibility of the side content.\n\t \n\t @type {boolean}\n\t * @name sap.ui.webc.fiori.DynamicSideContent.prototype.hideSideContent\n\t * @defaultvalue false\n\t * @public\n\t \n\t /\n\t@property({ type: Boolean })\n\thideSideContent!: boolean;\n\n\t/*\n\t Defines whether the side content is positioned before the main content (left side\n\t * in LTR mode), or after the the main content (right side in LTR mode).\n\t \n\t <br><br>\n\t * <b>The available values are:</b>\n\t \n\t <ul>\n\t * <li><code>Start</code></li>\n\t * <li><code>End</code></li>\n\t * </ul>\n\t \n\t @type {sap.ui.webc.fiori.types.SideContentPosition}\n\t * @name sap.ui.webc.fiori.DynamicSideContent.prototype.sideContentPosition\n\t * @defaultvalue \"End\"\n\t * @public\n\t \n\t /\n\t@property({ type: SideContentPosition, defaultValue: SideContentPosition.End })\n\tsideContentPosition!: `${SideContentPosition}`;\n\n\t/*\n\t Defines on which breakpoints the side content is visible.\n\t \n\t <br><br>\n\t * <b>The available values are:</b>\n\t \n\t <ul>\n\t * <li><code>AlwaysShow</code></li>\n\t * <li><code>ShowAboveL</code></li>\n\t * <li><code>ShowAboveM</code></li>\n\t * <li><code>ShowAboveS</code></li>\n\t * <li><code>NeverShow</code></li>\n\t * </ul>\n\t \n\t @type {sap.ui.webc.fiori.types.SideContentVisibility}\n\t * @name sap.ui.webc.fiori.DynamicSideContent.prototype.sideContentVisibility\n\t * @defaultvalue \"ShowAboveS\"\n\t * @public\n\t \n\t /\n\t@property({ type: SideContentVisibility, defaultValue: SideContentVisibility.ShowAboveS })\n\tsideContentVisibility!: `${SideContentVisibility}`;\n\n\t/*\n\t Defines on which breakpoints the side content falls down below the main content.\n\t \n\t <br><br>\n\t * <b>The available values are:</b>\n\t \n\t <ul>\n\t * <li><code>BelowXL</code></li>\n\t * <li><code>BelowL</code></li>\n\t * <li><code>BelowM</code></li>\n\t * <li><code>OnMinimumWidth</code></li>\n\t * </ul>\n\t \n\t @type {sap.ui.webc.fiori.types.SideContentFallDown}\n\t * @name sap.ui.webc.fiori.DynamicSideContent.prototype.sideContentFallDown\n\t * @defaultvalue \"OnMinimumWidth\"\n\t * @public\n\t \n\t /\n\t@property({ type: SideContentFallDown, defaultValue: SideContentFallDown.OnMinimumWidth })\n\tsideContentFallDown!: `${SideContentFallDown}`;\n\n\t/*\n\t Defines whether the component is in equal split mode. In this mode, the side and\n\t * the main content take 50:50 percent of the container on all screen sizes\n\t * except for phone, where the main and side contents are switching visibility\n\t * using the toggle method.\n\t \n\t @type {boolean}]\n\t * @name sap.ui.webc.fiori.DynamicSideContent.prototype.equalSplit\n\t * @defaultvalue false\n\t * @public\n\t \n\t /\n\t@property({ type: Boolean })\n\tequalSplit!: boolean;\n\n\t/*\n\t @private\n\t /\n\t@property({ defaultValue: \"0\", noAttribute: true })\n\t_mcSpan!: string;\n\n\t/\n\t @private\n\t /\n\t@property({ defaultValue: \"0\", noAttribute: true })\n\t_scSpan!: string;\n\n\t/\n\t @private\n\t /\n\t@property({ type: Boolean, noAttribute: true })\n\t_toggled!: boolean;\n\n\t/\n\t @private\n\t /\n\t@property({ noAttribute: true })\n\t_currentBreakpoint!: string;\n\n\t/\n\t Defines the main content.\n\t \n\t @type {HTMLElement[]}\n\t * @name sap.ui.webc.fiori.DynamicSideContent.prototype.default\n\t * @slot\n\t * @public\n\t /\n\n\t/\n\t Defines the side content.\n\t \n\t @type {HTMLElement[]}\n\t * @name sap.ui.webc.fiori.DynamicSideContent.prototype.sideContent\n\t * @slot\n\t * @public\n\t /\n\t@slot()\n\tsideContent!: Array<HTMLElement>;\n\n\tconstructor() {\n\t\tsuper();\n\t\tthis._handleResizeBound = this.handleResize.bind(this);\n\t}\n\n\t_handleResizeBound: () => void;\n\n\tstatic i18nBundle: I18nBundle;\n\n\tstatic async onDefine() {\n\t\tDynamicSideContent.i18nBundle = await getI18nBundle(\"@ui5/webcomponents-fiori\");\n\t}\n\n\tonAfterRendering() {\n\t\tthis._resizeContents();\n\t}\n\n\tonEnterDOM() {\n\t\tResizeHandler.register(this, this._handleResizeBound);\n\t}\n\n\tonExitDOM() {\n\t\tResizeHandler.deregister(this, this._handleResizeBound);\n\t}\n\n\t/\n\t Toggles visibility of main and side contents on S screen size (mobile device).\n\t * @public\n\t * @method\n\t * @name sap.ui.webc.fiori.DynamicSideContent#toggleContents\n\t */\n\ttoggleContents() {\n\t\tif (this.breakpoint === this.sizeS && this.sideContentVisibility !== SideContentVisibility.AlwaysShow) {\n\t\t\tthis._toggled = !this._toggled;\n\t\t}\n\t}\n\n\tget classes(): ClassMap {\n\t\tconst gridPrefix = \"ui5-dsc-span\",\n\t\t\tmcSpan = this._toggled ? this._scSpan : this._mcSpan,\n\t\t\tscSpan = this._toggled ? this._mcSpan : this._scSpan,\n\t\t\tclasses: ClassMap = {\n\t\t\t\tmain: {\n\t\t\t\t\t\"ui5-dsc-main\": true,\n\t\t\t\t},\n\t\t\t\tside: {\n\t\t\t\t\t\"ui5-dsc-side\": true,\n\t\t\t\t},\n\t\t\t};\n\n\t\tclasses.main[`${gridPrefix}-${mcSpan}`] = true;\n\t\tclasses.side[`${gridPrefix}-${scSpan}`] = true;\n\n\t\treturn classes;\n\t}\n\n\tget styles() {\n\t\tconst isToggled = this.breakpoint === this.sizeS && this._toggled,\n\t\t\tmcSpan = isToggled ? this._scSpan : this._mcSpan,\n\t\t\tscSpan = isToggled ? this._mcSpan : this._scSpan,\n\t\t\tcontentHeight = this.breakpoint === this.sizeS && this.sideContentVisibility !== SideContentVisibility.AlwaysShow ? \"100%\" : \"auto\";\n\n\t\treturn {\n\t\t\troot: {\n\t\t\t\t\"flex-wrap\": this._mcSpan === \"12\" ? \"wrap\" : \"nowrap\",\n\t\t\t},\n\t\t\tmain: {\n\t\t\t\t\"height\": mcSpan === this.span12 ? contentHeight : \"100%\",\n\t\t\t},\n\t\t\tside: {\n\t\t\t\t\"height\": scSpan === this.span12 ? contentHeight : \"100%\",\n\t\t\t},\n\t\t};\n\t}\n\n\tget accInfo() {\n\t\treturn {\n\t\t\t\"label\": DynamicSideContent.i18nBundle.getText(DSC_SIDE_ARIA_LABEL),\n\t\t};\n\t}\n\n\tget sizeS() {\n\t\treturn \"S\";\n\t}\n\n\tget sizeM() {\n\t\treturn \"M\";\n\t}\n\n\tget sizeL() {\n\t\treturn \"L\";\n\t}\n\n\tget sizeXL() {\n\t\treturn \"XL\";\n\t}\n\n\tget span0() {\n\t\treturn \"0\";\n\t}\n\n\tget span3() {\n\t\treturn \"3\";\n\t}\n\n\tget span4() {\n\t\treturn \"4\";\n\t}\n\n\tget span6() {\n\t\treturn \"6\";\n\t}\n\n\tget span8() {\n\t\treturn \"8\";\n\t}\n\n\tget span9() {\n\t\treturn \"9\";\n\t}\n\n\tget span12() {\n\t\treturn \"12\";\n\t}\n\n\tget spanFixed() {\n\t\treturn \"fixed\";\n\t}\n\n\tget containerWidth() {\n\t\treturn (this.parentElement as HTMLElement).clientWidth;\n\t}\n\n\tget breakpoint() {\n\t\tlet size;\n\n\t\tif (this.containerWidth <= S_M_BREAKPOINT) {\n\t\t\tsize = this.sizeS;\n\t\t} else if (this.containerWidth > S_M_BREAKPOINT && this.containerWidth <= M_L_BREAKPOINT) {\n\t\t\tsize = this.sizeM;\n\t\t} else if (this.containerWidth > M_L_BREAKPOINT && this.containerWidth <= L_XL_BREAKPOINT) {\n\t\t\tsize = this.sizeL;\n\t\t} else {\n\t\t\tsize = this.sizeXL;\n\t\t}\n\n\t\treturn size;\n\t}\n\n\tget _isSideContentFirst() {\n\t\treturn this.sideContentPosition === SideContentPosition.Start;\n\t}\n\n\thandleResize() {\n\t\tthis._resizeContents();\n\t}\n\n\t_resizeContents() {\n\t\tlet mainSize!: string,\n\t\t\tsideSize!: string,\n\t\t\tsideVisible!: boolean;\n\n\t\t// initial set contents sizes\n\t\tswitch (this.breakpoint) {\n\t\tcase this.sizeS:\n\t\t\tmainSize = this.span12;\n\t\t\tsideSize = this.span12;\n\t\t\tbreak;\n\t\tcase this.sizeM:\n\t\t\tif (this.sideContentFallDown === SideContentFallDown.BelowXL\n\t\t\t\t\|\| this.sideContentFallDown === SideContentFallDown.BelowL\n\t\t\t\t\|\| (this.containerWidth <= MINIMUM_WIDTH_BREAKPOINT && this.sideContentFallDown === SideContentFallDown.OnMinimumWidth)) {\n\t\t\t\tmainSize = this.span12;\n\t\t\t\tsideSize = this.span12;\n\t\t\t} else {\n\t\t\t\tmainSize = this.equalSplit ? this.span6 : this.spanFixed;\n\t\t\t\tsideSize = this.equalSplit ? this.span6 : this.spanFixed;\n\t\t\t}\n\t\t\tsideVisible = this.sideContentVisibility === SideContentVisibility.ShowAboveS\n\t\t\t\t\|\| this.sideContentVisibility === SideContentVisibility.AlwaysShow;\n\t\t\tbreak;\n\t\tcase this.sizeL:\n\t\t\tif (this.sideContentFallDown === SideContentFallDown.BelowXL) {\n\t\t\t\tmainSize = this.span12;\n\t\t\t\tsideSize = this.span12;\n\t\t\t} else {\n\t\t\t\tmainSize = this.equalSplit ? this.span6 : this.span8;\n\t\t\t\tsideSize = this.equalSplit ? this.span6 : this.span4;\n\t\t\t}\n\t\t\tsideVisible = this.sideContentVisibility === SideContentVisibility.ShowAboveS\n\t\t\t\t\|\| this.sideContentVisibility === SideContentVisibility.ShowAboveM\n\t\t\t\t\|\| this.sideContentVisibility === SideContentVisibility.AlwaysShow;\n\t\t\tbreak;\n\t\tcase this.sizeXL:\n\t\t\tmainSize = this.equalSplit ? this.span6 : this.span9;\n\t\t\tsideSize = this.equalSplit ? this.span6 : this.span3;\n\t\t\tsideVisible = this.sideContentVisibility !== SideContentVisibility.NeverShow;\n\t\t}\n\n\t\tif (this.sideContentVisibility === SideContentVisibility.AlwaysShow) {\n\t\t\tsideVisible = true;\n\t\t}\n\n\t\t// modify sizes of the contents depending on hideMainContent and hideSideContent properties\n\t\tif (this.hideSideContent) {\n\t\t\tmainSize = this.hideMainContent ? this.span0 : this.span12;\n\t\t\tsideSize = this.span0;\n\t\t\tsideVisible = false;\n\t\t}\n\n\t\tif (this.hideMainContent) {\n\t\t\tmainSize = this.span0;\n\t\t\tsideSize = this.hideSideContent ? this.span0 : this.span12;\n\t\t\tsideVisible = true;\n\t\t}\n\n\t\t// set final sizes of the contents\n\t\tif (!sideVisible) {\n\t\t\tmainSize = this.span12;\n\t\t\tsideSize = this.span0;\n\t\t}\n\n\t\t// fire \"layout-change\" event\n\t\tif (this._currentBreakpoint !== this.breakpoint) {\n\t\t\tconst eventParams = {\n\t\t\t\tcurrentBreakpoint: this.breakpoint,\n\t\t\t\tpreviousBreakpoint: this._currentBreakpoint,\n\t\t\t\tmainContentVisible: mainSize !== this.span0,\n\t\t\t\tsideContentVisible: sideSize !== this.span0,\n\t\t\t};\n\t\t\tthis.fireEvent<DynamicSideContentLayoutChangeEventDetail>(\"layout-change\", eventParams);\n\t\t\tthis._currentBreakpoint = this.breakpoint;\n\t\t}\n\n\t\t// update contents sizes\n\t\tthis._setSpanSizes(mainSize, sideSize);\n\t}\n\n\t_setSpanSizes(mainSize: string, sideSize: string) {\n\t\tthis._mcSpan = mainSize;\n\t\tthis._scSpan = sideSize;\n\t\tif (this.breakpoint !== this.sizeS) {\n\t\t\tthis._toggled = false;\n\t\t}\n\t}\n}\n\nDynamicSideContent.define();\n\nexport default DynamicSideContent;\nexport type {\n\tDynamicSideContentLayoutChangeEventDetail,\n};\n"]}

package/dist/FlexibleColumnLayout.d.ts CHANGED Viewed

@@ -11,6 +11,16 @@ declare enum MEDIA {
     DESKTOP = "desktop"
 }
 type ColumnLayout = Array<string | number>;
+type FlexibleColumnLayoutLayoutChangeEventDetail = {
+    layout: `${FCLLayout}`;
+    columnLayout: ColumnLayout;
+    startColumnVisible: boolean;
+    midColumnVisible: boolean;
+    endColumnVisible: boolean;
+    arrowUsed: boolean;
+    arrowsUsed: boolean;
+    resize: boolean;
+};
 type AccessiblilityTexts = {
     startColumnAccessibleName?: I18nText;
     startArrowContainerAccessibleName?: I18nText;
@@ -386,4 +396,4 @@ declare class FlexibleColumnLayout extends UI5Element {
     get accEndArrowText(): string | I18nText;
 }
 export default FlexibleColumnLayout;
-export type { MEDIA };
+export type { MEDIA, FlexibleColumnLayoutLayoutChangeEventDetail, };

package/dist/FlexibleColumnLayout.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FlexibleColumnLayout.js","sourceRoot":"","sources":["../src/FlexibleColumnLayout.ts"],"names":[],"mappings":"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","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event.js\";\nimport litRender from \"@ui5/webcomponents-base/dist/renderer/LitRenderer.js\";\nimport ResizeHandler from \"@ui5/webcomponents-base/dist/delegate/ResizeHandler.js\";\nimport Float from \"@ui5/webcomponents-base/dist/types/Float.js\";\nimport Integer from \"@ui5/webcomponents-base/dist/types/Integer.js\";\nimport { getI18nBundle } from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport type { I18nText } from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport AnimationMode from \"@ui5/webcomponents-base/dist/types/AnimationMode.js\";\nimport { getAnimationMode } from \"@ui5/webcomponents-base/dist/config/AnimationMode.js\";\nimport Button from \"@ui5/webcomponents/dist/Button.js\";\nimport \"@ui5/webcomponents-icons/dist/slim-arrow-left.js\";\nimport \"@ui5/webcomponents-icons/dist/slim-arrow-right.js\";\nimport FCLLayout from \"./types/FCLLayout.js\";\nimport type { LayoutConfiguration } from \"./fcl-utils/FCLLayout.js\";\nimport {\n\tgetLayoutsByMedia,\n\tgetNextLayoutByStartArrow,\n\tgetNextLayoutByEndArrow,\n} from \"./fcl-utils/FCLLayout.js\";\n\n// Texts\nimport {\n\tFCL_START_COLUMN_TXT,\n\tFCL_MIDDLE_COLUMN_TXT,\n\tFCL_END_COLUMN_TXT,\n\tFCL_START_COLUMN_EXPAND_BUTTON_TOOLTIP,\n\tFCL_START_COLUMN_COLLAPSE_BUTTON_TOOLTIP,\n\tFCL_END_COLUMN_EXPAND_BUTTON_TOOLTIP,\n\tFCL_END_COLUMN_COLLAPSE_BUTTON_TOOLTIP,\n} from \"./generated/i18n/i18n-defaults.js\";\n\n// Template\nimport FlexibleColumnLayoutTemplate from \"./generated/templates/FlexibleColumnLayoutTemplate.lit.js\";\n\n// Styles\nimport FlexibleColumnLayoutCss from \"./generated/themes/FlexibleColumnLayout.css.js\";\n\nenum MEDIA {\n\tPHONE = \"phone\",\n\tTABLET = \"tablet\",\n\tDESKTOP = \"desktop\",\n}\n\nenum BREAKPOINTS {\n\t\"PHONE\" = 599,\n\t\"TABLET\" = 1023,\n}\n\ntype ColumnLayout = Array<string \| number>;\n\ntype FCLLayoutChangeEventDetail = {\n\tlayout: `${FCLLayout}`,\n\tcolumnLayout: ColumnLayout,\n\tstartColumnVisible: boolean,\n\tmidColumnVisible: boolean,\n\tendColumnVisible: boolean,\n\tarrowUsed: boolean,\n\tarrowsUsed: boolean,\n\tresize: boolean,\n};\n\ntype AccessiblilityTexts = {\n\tstartColumnAccessibleName?: I18nText;\n\tstartArrowContainerAccessibleName?: I18nText;\n\tstartArrowLeftText?: I18nText;\n\tstartArrowRightText?: I18nText;\n\tmidColumnAccessibleName?: I18nText;\n\tendColumnAccessibleName?: I18nText;\n\tendArrowContainerAccessibleName?: I18nText;\n\tendArrowRightText?: I18nText;\n\tendArrowLeftText?: I18nText;\n};\n\ntype AccessibilityRoles = {\n\tstartColumnRole?: I18nText;\n\tmidColumnRole?: I18nText;\n\tendColumnRole?: I18nText;\n\tstartArrowContainerRole?: I18nText;\n\tendArrowContainerRole?: I18nText;\n};\n\n/*\n @class\n \n <h3 class=\"comment-api-title\">Overview</h3>\n \n The <code>FlexibleColumnLayout</code> implements the list-detail-detail paradigm by displaying up to three pages in separate columns.\n * There are several possible layouts that can be changed either with the component API, or by pressing the arrows, displayed between the columns.\n \n <h3>Usage</h3>\n \n Use this component for applications that need to display several logical levels of related information side by side (e.g. list of items, item, sub-item, etc.).\n * The Component is flexible in a sense that the application can focus the user's attention on one particular column.\n \n <h3>Responsive Behavior</h3>\n \n The <code>FlexibleColumnLayout</code> automatically displays the maximum possible number of columns based on <code>layout</code> property and the window size.\n * The component would display 1 column for window size smaller than 599px, up to two columns between 599px and 1023px,\n * and 3 columns for sizes bigger than 1023px.\n \n <br><br>\n * <h3>Keyboard Handling</h3>\n \n <h4>Basic Navigation</h4>\n * <ul>\n * <li>[SPACE, ENTER, RETURN] - If focus is on the layout toggle button (arrow button), once activated, it triggers the associated action (such as expand/collapse the column).</li>\n * <li>This component provides a build in fast navigation group which can be used via <code>F6 / Shift + F6</code> or <code> Ctrl + Alt(Option) + Down / Ctrl + Alt(Option) + Up</code>.\n * In order to use this functionality, you need to import the following module:\n * <code>import \"@ui5/webcomponents-base/dist/features/F6Navigation.js\"</code></li>\n * </ul>\n \n <h4>Fast Navigation</h4>\n * This component provides a build in fast navigation group which can be used via <code>F6 / Shift + F6</code> or <code> Ctrl + Alt(Option) + Down / Ctrl + Alt(Option) + Up</code>.\n * In order to use this functionality, you need to import the following module:\n * <code>import \"@ui5/webcomponents-base/dist/features/F6Navigation.js\"</code>\n * <br><br>\n \n <h3>ES6 Module Import</h3>\n \n <code>import \"@ui5/webcomponents-fiori/dist/FlexibleColumnLayout.js\";</code>\n \n @constructor\n * @author SAP SE\n * @alias sap.ui.webc.fiori.FlexibleColumnLayout\n * @extends sap.ui.webc.base.UI5Element\n * @tagname ui5-flexible-column-layout\n * @public\n * @since 1.0.0-rc.8\n /\n@customElement({\n\ttag: \"ui5-flexible-column-layout\",\n\tfastNavigation: true,\n\trenderer: litRender,\n\tstyles: FlexibleColumnLayoutCss,\n\ttemplate: FlexibleColumnLayoutTemplate,\n\tdependencies: [Button],\n})\n\n/\n Fired when the layout changes via user interaction by clicking the arrows\n * or by changing the component size due to resizing.\n \n @param {sap.ui.webc.fiori.types.FCLLayout} layout The current layout\n * @param {array} columnLayout The effective column layout, f.e [67%, 33%, 0]\n * @param {boolean} startColumnVisible Indicates if the start column is currently visible\n * @param {boolean} midColumnVisible Indicates if the middle column is currently visible\n * @param {boolean} endColumnVisible Indicates if the end column is currently visible\n * @param {boolean} arrowsUsed Indicates if the layout is changed via the arrows\n * @param {boolean} resize Indicates if the layout is changed via resizing\n * @event sap.ui.webc.fiori.FlexibleColumnLayout#layout-change\n * @public\n /\n@event(\"layout-change\", {\n\tdetail: {\n\t\tlayout: { type: FCLLayout },\n\t\tcolumnLayout: { type: Array },\n\t\tstartColumnVisible: { type: Boolean },\n\t\tmidColumnVisible: { type: Boolean },\n\t\tendColumnVisible: { type: Boolean },\n\t\tarrowsUsed: { type: Boolean },\n\t\tresize: { type: Boolean },\n\t},\n})\nclass FlexibleColumnLayout extends UI5Element {\n\t/\n\t Defines the columns layout and their proportion.\n\t* <br><br>\n\t* <b>Note:</b> The layout also depends on the screen size - one column for screens smaller than 599px,\n\t* two columns between 599px and 1023px and three columns for sizes bigger than 1023px.\n\t* <br><br>\n\t* Available options are:\n\t* <ul>\n\t* <li><code>OneColumn</code></li>\n\t* <li><code>TwoColumnsStartExpanded</code></li>\n\t* <li><code>TwoColumnsMidExpanded</code></li>\n\t* <li><code>ThreeColumnsMidExpanded</code></li>\n\t* <li><code>ThreeColumnsEndExpanded</code></li>\n\t* <li><code>ThreeColumnsStartExpandedEndHidden</code></li>\n\t* <li><code>ThreeColumnsMidExpandedEndHidden</code></li>\n\t* <li><code>MidColumnFullScreen</code></li>\n\t* <li><code>EndColumnFullScreen</code></li>\n\t* </ul>\n\t* <br><br>\n\t* <b>For example:</b> layout=<code>TwoColumnsStartExpanded</code> means the layout will display up to two columns\n\t* in 67%/33% proportion.\n\t* @type {sap.ui.webc.fiori.types.FCLLayout}\n\t* @defaultvalue \"OneColumn\"\n\t* @name sap.ui.webc.fiori.FlexibleColumnLayout.prototype.layout\n\t* @public\n\t/\n\t@property({ type: FCLLayout, defaultValue: FCLLayout.OneColumn })\n\tlayout!: `${FCLLayout}`;\n\n\t/\n\t Defines the visibility of the arrows,\n\t* used for expanding and shrinking the columns.\n\t\n\t @type {boolean}\n\t* @defaultvalue false\n\t* @name sap.ui.webc.fiori.FlexibleColumnLayout.prototype.hideArrows\n\t* @public\n\t* @since 1.0.0-rc.15\n\t/\n\t@property({ type: Boolean })\n\thideArrows!: boolean;\n\n\t/\n\t An object of strings that defines several additional accessibility texts for even further customization.\n\t\n\t It supports the following fields:\n\t* - <code>startColumnAccessibleName</code>: the accessibility name for the <code>startColumn</code> region\n\t* - <code>midColumnAccessibleName</code>: the accessibility name for the <code>midColumn</code> region\n\t* - <code>endColumnAccessibleName</code>: the accessibility name for the <code>endColumn</code> region\n\t* - <code>startArrowLeftText</code>: the text that the first arrow (between the <code>begin</code> and <code>mid</code> columns) will have when pointing to the left\n\t* - <code>startArrowRightText</code>: the text that the first arrow (between the <code>begin</code> and <code>mid</code> columns) will have when pointing to the right\n\t* - <code>endArrowLeftText</code>: the text that the second arrow (between the <code>mid</code> and <code>end</code> columns) will have when pointing to the left\n\t* - <code>endArrowRightText</code>: the text that the second arrow (between the <code>mid</code> and <code>end</code> columns) will have when pointing to the right\n\t* - <code>startArrowContainerAccessibleName</code>: the text that the first arrow container (between the <code>begin</code> and <code>mid</code> columns) will have as <code>aria-label</code>\n\t* - <code>endArrowContainerAccessibleName</code>: the text that the second arrow container (between the <code>mid</code> and <code>end</code> columns) will have as <code>aria-label</code>\n\t\n\t @type {object}\n\t* @name sap.ui.webc.fiori.FlexibleColumnLayout.prototype.accessibilityTexts\n\t* @public\n\t* @since 1.0.0-rc.11\n\t/\n\t@property({ type: Object })\n\taccessibilityTexts!: AccessiblilityTexts;\n\n\t/\n\t An object of strings that defines additional accessibility roles for further customization.\n\t\n\t It supports the following fields:\n\t* - <code>startColumnRole</code>: the accessibility role for the <code>startColumn</code>\n\t* - <code>startArrowContainerRole</code>: the accessibility role for the first arrow container (between the <code>begin</code> and <code>mid</code> columns)\n\t* - <code>midColumnRole</code>: the accessibility role for the <code>midColumn</code>\n\t* - <code>endArrowContainerRole</code>: the accessibility role for the second arrow container (between the <code>mid</code> and <code>end</code> columns)\n\t* - <code>endColumnRole</code>: the accessibility role for the <code>endColumn</code>\n\t\n\t @type {object}\n\t* @public\n\t* @name sap.ui.webc.fiori.FlexibleColumnLayout.prototype.accessibilityRoles\n\t* @since 1.1.0\n\t/\n\t@property({ type: Object })\n\taccessibilityRoles!: AccessibilityRoles;\n\n\t/\n\t Defines the component width in px.\n\t\n\t @type {sap.ui.webc.base.types.Float}\n\t* @defaultvalue 0\n\t* @private\n\t/\n\t@property({ validator: Float, defaultValue: 0 })\n\t_width!: number;\n\n\t/\n\t Defines the effective columns layout,\n\t* based on both the <code>layout</code> property and the screen size.\n\t* Example: [67%, 33%, 0], [25%, 50%, 25%], etc.\n\t\n\t @type {object}\n\t* @defaultvalue undefined\n\t* @private\n\t/\n\t@property({ type: Object, defaultValue: undefined })\n\t_columnLayout?: ColumnLayout;\n\n\t/\n\t Defines the visible columns count - 1, 2 or 3.\n\t\n\t @type {sap.ui.webc.base.types.Integer}\n\t* @defaultvalue 1\n\t* @private\n\t/\n\t@property({ validator: Integer, defaultValue: 0 })\n\t_visibleColumns!: number;\n\n\t/\n\t Allows the user to replace the whole layouts configuration\n\t\n\t @type {object}\n\t* @private\n\t* @sap-restricted\n\t/\n\t@property({ type: Object, defaultValue: undefined })\n\t_layoutsConfiguration?: LayoutConfiguration;\n\n\t/\n\t Defines the content in the start column.\n\t* @type {HTMLElement}\n\t* @slot\n\t* @name sap.ui.webc.fiori.FlexibleColumnLayout.prototype.startColumn\n\t* @public\n\t/\n\t@slot()\n\tstartColumn!: Array<HTMLElement>;\n\n\t/\n\t Defines the content in the middle column.\n\t* @type {HTMLElement}\n\t* @slot\n\t* @name sap.ui.webc.fiori.FlexibleColumnLayout.prototype.midColumn\n\t* @public\n\t/\n\t@slot()\n\tmidColumn!: Array<HTMLElement>;\n\n\t/\n\t Defines the content in the end column.\n\t* @type {HTMLElement}\n\t* @slot\n\t* @name sap.ui.webc.fiori.FlexibleColumnLayout.prototype.endColumn\n\t* @public\n\t/\n\t@slot()\n\tendColumn!: Array<HTMLElement>;\n\n\tinitialRendering: boolean;\n\t_handleResize: () => void;\n\tstatic i18nBundle: I18nBundle;\n\t_prevLayout: `${FCLLayout}` \| null;\n\n\tconstructor() {\n\t\tsuper();\n\n\t\tthis._prevLayout = null;\n\t\tthis.initialRendering = true;\n\t\tthis._handleResize = this.handleResize.bind(this);\n\t}\n\n\tstatic async onDefine() {\n\t\tFlexibleColumnLayout.i18nBundle = await getI18nBundle(\"@ui5/webcomponents-fiori\");\n\t}\n\n\tstatic get ANIMATION_DURATION() {\n\t\treturn getAnimationMode() !== AnimationMode.None ? 560 : 0;\n\t}\n\n\tonEnterDOM() {\n\t\tResizeHandler.register(this, this._handleResize.bind(this));\n\t}\n\n\tonExitDOM() {\n\t\tResizeHandler.deregister(this, this._handleResize);\n\t}\n\n\tonAfterRendering() {\n\t\tif (this.initialRendering) {\n\t\t\tthis.handleInitialRendering();\n\t\t\treturn;\n\t\t}\n\n\t\tthis.syncLayout();\n\t}\n\n\thandleInitialRendering() {\n\t\tthis._prevLayout = this.layout;\n\t\tthis.updateLayout();\n\t\tthis.initialRendering = false;\n\t}\n\n\thandleResize() {\n\t\tif (this.initialRendering) {\n\t\t\treturn;\n\t\t}\n\n\t\t// store the previous layout\n\t\tconst prevLayoutHash = this.columnLayout!.join();\n\n\t\t// update the column layout, based on the current width\n\t\tthis.updateLayout();\n\n\t\t// fire layout-change if the column layout changed\n\t\tif (prevLayoutHash !== this.columnLayout!.join()) {\n\t\t\tthis.fireLayoutChange(false, true);\n\t\t}\n\t}\n\n\tstartArrowClick() {\n\t\tthis.arrowClick({ start: true, end: false });\n\t}\n\n\tendArrowClick() {\n\t\tthis.arrowClick({ start: false, end: true });\n\t}\n\n\tarrowClick(options: { start: boolean, end: boolean }) {\n\t\t// update public property\n\t\tthis.layout = this.nextLayout(this.layout, { start: options.start, end: options.end })!;\n\n\t\t// update layout\n\t\tthis.updateLayout();\n\n\t\t// fire layout-change\n\t\tthis.fireLayoutChange(true, false);\n\t}\n\n\tupdateLayout() {\n\t\tthis._width = this.widthDOM;\n\t\tthis._columnLayout = this.nextColumnLayout(this.layout);\n\t\tthis._visibleColumns = this.calcVisibleColumns(this._columnLayout);\n\t\tthis.toggleColumns();\n\t}\n\n\tsyncLayout() {\n\t\tif (this._prevLayout !== this.layout) {\n\t\t\tthis.updateLayout();\n\t\t\tthis._prevLayout = this.layout;\n\t\t}\n\t}\n\n\ttoggleColumns() {\n\t\tthis.toggleColumn(\"start\");\n\t\tthis.toggleColumn(\"mid\");\n\t\tthis.toggleColumn(\"end\");\n\t}\n\n\ttoggleColumn(column: string) {\n\t\tlet columnWidth;\n\t\tlet columnDOM;\n\n\t\tif (column === \"start\") {\n\t\t\tcolumnWidth = this.startColumnWidth;\n\t\t\tcolumnDOM = this.startColumnDOM;\n\t\t} else if (column === \"mid\") {\n\t\t\tcolumnWidth = this.midColumnWidth;\n\t\t\tcolumnDOM = this.midColumnDOM;\n\t\t} else {\n\t\t\tcolumnWidth = this.endColumnWidth;\n\t\t\tcolumnDOM = this.endColumnDOM;\n\t\t}\n\n\t\tconst currentlyHidden = this._isColumnHidden(columnWidth);\n\t\tconst previouslyHidden = this._isColumnHidden(columnDOM.style.width);\n\n\t\t// no change\n\t\tif (currentlyHidden && previouslyHidden) {\n\t\t\treturn;\n\t\t}\n\n\t\t// column resizing: from 33% to 67%, from 25% to 50%, etc.\n\t\tif (!currentlyHidden && !previouslyHidden) {\n\t\t\tcolumnDOM.style.width = typeof columnWidth === \"number\" ? `${columnWidth}px` : columnWidth;\n\t\t\treturn;\n\t\t}\n\n\t\t// hide column: 33% to 0, 25% to 0, etc .\n\t\tif (currentlyHidden) {\n\t\t\t// animate the width\n\t\t\tcolumnDOM.style.width = typeof columnWidth === \"number\" ? `${columnWidth}px` : columnWidth;\n\n\t\t\t// hide column with delay to allow the animation runs entirely\n\t\t\tcolumnDOM.addEventListener(\"transitionend\", this.columnResizeHandler);\n\n\t\t\treturn;\n\t\t}\n\n\t\t// show column: from 0 to 33%, from 0 to 25%, etc.\n\t\tif (previouslyHidden) {\n\t\t\tcolumnDOM.removeEventListener(\"transitionend\", this.columnResizeHandler);\n\t\t\tcolumnDOM.classList.remove(\"ui5-fcl-column--hidden\");\n\t\t\tcolumnDOM.style.width = typeof columnWidth === \"number\" ? `${columnWidth}px` : columnWidth;\n\t\t}\n\t}\n\n\tcolumnResizeHandler = (e: Event) => {\n\t\t(e.target as HTMLElement).classList.add(\"ui5-fcl-column--hidden\");\n\t}\n\n\tnextLayout(layout: `${FCLLayout}`, arrowsInfo: { start: boolean, end: boolean }) {\n\t\tif (!arrowsInfo) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (arrowsInfo.start) {\n\t\t\treturn getNextLayoutByStartArrow()[layout as keyof typeof getNextLayoutByStartArrow];\n\t\t}\n\n\t\tif (arrowsInfo.end) {\n\t\t\treturn getNextLayoutByEndArrow()[layout as keyof typeof getNextLayoutByEndArrow];\n\t\t}\n\t}\n\n\tnextColumnLayout(layout: `${FCLLayout}`) {\n\t\treturn this._effectiveLayoutsByMedia[this.media][layout].layout;\n\t}\n\n\tcalcVisibleColumns(colLayout: ColumnLayout) {\n\t\treturn colLayout.filter(colWidth => !this._isColumnHidden(colWidth)).length;\n\t}\n\n\tfireLayoutChange(arrowUsed: boolean, resize: boolean) {\n\t\tthis.fireEvent<FCLLayoutChangeEventDetail>(\"layout-change\", {\n\t\t\tlayout: this.layout,\n\t\t\tcolumnLayout: this._columnLayout!,\n\t\t\tstartColumnVisible: this.startColumnVisible,\n\t\t\tmidColumnVisible: this.midColumnVisible,\n\t\t\tendColumnVisible: this.endColumnVisible,\n\t\t\tarrowUsed, // for backwards compatibility\n\t\t\tarrowsUsed: arrowUsed, // as documented\n\t\t\tresize,\n\t\t});\n\t}\n\n\t/\n\t Checks if a column is hidden based on its width.\n\t /\n\tprivate _isColumnHidden(columnWidth: number \| string): boolean {\n\t\treturn columnWidth === 0 \|\| columnWidth === \"0px\";\n\t}\n\n\t/\n\t Returns the current column layout, based on both the <code>layout</code> property and the screen size.\n\t* <br><br>\n\t* <b>For example:</b> [\"67%\", \"33%\", 0], [\"100%\", 0, 0], [\"25%\", \"50%\", \"25%\"], etc,\n\t* where the numbers represents the width of the start, middle and end columns.\n\t* @readonly\n\t* @type {array}\n\t* @defaultvalue [\"100%\", 0, 0]\n\t* @name sap.ui.webc.fiori.FlexibleColumnLayout.prototype.columnLayout\n\t* @public\n\t/\n\tget columnLayout(): ColumnLayout \| undefined {\n\t\treturn this._columnLayout;\n\t}\n\n\t/\n\t Returns if the <code>start</code> column is visible.\n\t* @readonly\n\t* @defaultvalue true\n\t* @type {boolean}\n\t* @name sap.ui.webc.fiori.FlexibleColumnLayout.prototype.startColumnVisible\n\t* @public\n\t/\n\tget startColumnVisible(): boolean {\n\t\tif (this._columnLayout) {\n\t\t\treturn !this._isColumnHidden(this._columnLayout[0]);\n\t\t}\n\n\t\treturn false;\n\t}\n\n\t/\n\t Returns if the <code>middle</code> column is visible.\n\t* @readonly\n\t* @type {boolean}\n\t* @defaultvalue false\n\t* @name sap.ui.webc.fiori.FlexibleColumnLayout.prototype.midColumnVisible\n\t* @public\n\t/\n\tget midColumnVisible(): boolean {\n\t\tif (this._columnLayout) {\n\t\t\treturn !this._isColumnHidden(this._columnLayout[1]);\n\t\t}\n\n\t\treturn false;\n\t}\n\n\t/\n\t Returns if the <code>end</code> column is visible.\n\t* @readonly\n\t* @type {boolean}\n\t* @defaultvalue false\n\t* @name sap.ui.webc.fiori.FlexibleColumnLayout.prototype.endColumnVisible\n\t* @public\n\t/\n\tget endColumnVisible(): boolean {\n\t\tif (this._columnLayout) {\n\t\t\treturn !this._isColumnHidden(this._columnLayout[2]);\n\t\t}\n\n\t\treturn false;\n\t}\n\n\t/\n\t Returns the number of currently visible columns.\n\t* @readonly\n\t* @type {sap.ui.webc.base.types.Integer}\n\t* @defaultvalue 1\n\t* @name sap.ui.webc.fiori.FlexibleColumnLayout.prototype.visibleColumns\n\t* @public\n\t*/\n\tget visibleColumns(): number {\n\t\treturn this._visibleColumns;\n\t}\n\n\tget classes() {\n\t\tconst hasAnimation = getAnimationMode() !== AnimationMode.None;\n\n\t\treturn {\n\t\t\troot: {\n\t\t\t\t\"ui5-fcl-root\": true,\n\t\t\t},\n\t\t\tcolumns: {\n\t\t\t\tstart: {\n\t\t\t\t\t\"ui5-fcl-column\": true,\n\t\t\t\t\t\"ui5-fcl-column-animation\": hasAnimation,\n\t\t\t\t\t\"ui5-fcl-column--start\": true,\n\t\t\t\t},\n\t\t\t\tmiddle: {\n\t\t\t\t\t\"ui5-fcl-column\": true,\n\t\t\t\t\t\"ui5-fcl-column-animation\": hasAnimation,\n\t\t\t\t\t\"ui5-fcl-column--middle\": true,\n\t\t\t\t},\n\t\t\t\tend: {\n\t\t\t\t\t\"ui5-fcl-column\": true,\n\t\t\t\t\t\"ui5-fcl-column-animation\": hasAnimation,\n\t\t\t\t\t\"ui5-fcl-column--end\": true,\n\t\t\t\t},\n\t\t\t},\n\t\t};\n\t}\n\n\tget styles() {\n\t\treturn {\n\t\t\tarrowsContainer: {\n\t\t\t\tstart: {\n\t\t\t\t\tdisplay: this.showStartSeparator ? \"flex\" : \"none\",\n\t\t\t\t},\n\t\t\t\tend: {\n\t\t\t\t\tdisplay: this.showEndSeparator ? \"flex\" : \"none\",\n\t\t\t\t},\n\t\t\t},\n\t\t\tarrows: {\n\t\t\t\tstart: {\n\t\t\t\t\tdisplay: this.showStartArrow ? \"inline-block\" : \"none\",\n\t\t\t\t\ttransform: this.startArrowDirection === \"mirror\" ? \"rotate(180deg)\" : \"\",\n\t\t\t\t},\n\t\t\t\tend: {\n\t\t\t\t\tdisplay: this.showEndArrow ? \"inline-block\" : \"none\",\n\t\t\t\t\ttransform: this.endArrowDirection === \"mirror\" ? \"rotate(180deg)\" : \"\",\n\t\t\t\t},\n\t\t\t},\n\t\t};\n\t}\n\n\tget startColumnWidth() {\n\t\treturn this._columnLayout ? this._columnLayout[0] : \"100%\";\n\t}\n\n\tget midColumnWidth() {\n\t\treturn this._columnLayout ? this._columnLayout[1] : \"0px\";\n\t}\n\n\tget endColumnWidth() {\n\t\treturn this._columnLayout ? this._columnLayout[2] : \"0px\";\n\t}\n\n\tget showStartSeparator() {\n\t\treturn this.effectiveArrowsInfo[0].separator \|\| this.startArrowVisibility;\n\t}\n\n\tget showEndSeparator() {\n\t\treturn this.effectiveArrowsInfo[1].separator \|\| this.endArrowVisibility;\n\t}\n\n\tget showStartArrow() {\n\t\treturn this.hideArrows ? false : this.startArrowVisibility;\n\t}\n\n\tget showEndArrow() {\n\t\treturn this.hideArrows ? false : this.endArrowVisibility;\n\t}\n\n\tget startArrowVisibility() {\n\t\treturn this.effectiveArrowsInfo[0].visible;\n\t}\n\n\tget endArrowVisibility() {\n\t\treturn this.effectiveArrowsInfo[1].visible;\n\t}\n\n\tget startArrowDirection() {\n\t\treturn this.effectiveArrowsInfo[0].dir;\n\t}\n\n\tget endArrowDirection() {\n\t\treturn this.effectiveArrowsInfo[1].dir;\n\t}\n\n\tget effectiveArrowsInfo() {\n\t\treturn this._effectiveLayoutsByMedia[this.media][this.layout].arrows;\n\t}\n\n\tget media() {\n\t\tif (this._width <= BREAKPOINTS.PHONE) {\n\t\t\treturn MEDIA.PHONE;\n\t\t}\n\n\t\tif (this._width <= BREAKPOINTS.TABLET) {\n\t\t\treturn MEDIA.TABLET;\n\t\t}\n\n\t\treturn MEDIA.DESKTOP;\n\t}\n\n\tget widthDOM() {\n\t\treturn this.getBoundingClientRect().width;\n\t}\n\n\tget startColumnDOM() {\n\t\treturn this.shadowRoot!.querySelector<HTMLElement>(\".ui5-fcl-column--start\")!;\n\t}\n\n\tget midColumnDOM() {\n\t\treturn this.shadowRoot!.querySelector<HTMLElement>(\".ui5-fcl-column--middle\")!;\n\t}\n\n\tget endColumnDOM() {\n\t\treturn this.shadowRoot!.querySelector<HTMLElement>(\".ui5-fcl-column--end\")!;\n\t}\n\n\tget accStartColumnText() {\n\t\treturn this.accessibilityTexts.startColumnAccessibleName \|\| FlexibleColumnLayout.i18nBundle.getText(FCL_START_COLUMN_TXT);\n\t}\n\n\tget accMiddleColumnText() {\n\t\treturn this.accessibilityTexts.midColumnAccessibleName \|\| FlexibleColumnLayout.i18nBundle.getText(FCL_MIDDLE_COLUMN_TXT);\n\t}\n\n\tget accEndColumnText() {\n\t\treturn this.accessibilityTexts.endColumnAccessibleName \|\| FlexibleColumnLayout.i18nBundle.getText(FCL_END_COLUMN_TXT);\n\t}\n\n\tget accStartArrowContainerText() {\n\t\treturn this.accessibilityTexts.startArrowContainerAccessibleName \|\| undefined;\n\t}\n\n\tget accEndArrowContainerText() {\n\t\treturn this.accessibilityTexts.endArrowContainerAccessibleName \|\| undefined;\n\t}\n\n\tget accStartColumnRole() {\n\t\tif (this.startColumnVisible) {\n\t\t\treturn this.accessibilityRoles.startColumnRole \|\| \"region\";\n\t\t}\n\t\treturn undefined;\n\t}\n\n\tget accMiddleColumnRole() {\n\t\tif (this.midColumnVisible) {\n\t\t\treturn this.accessibilityRoles.midColumnRole \|\| \"region\";\n\t\t}\n\t\treturn undefined;\n\t}\n\n\tget accEndColumnRole() {\n\t\tif (this.endColumnVisible) {\n\t\t\treturn this.accessibilityRoles.endColumnRole \|\| \"region\";\n\t\t}\n\t\treturn undefined;\n\t}\n\n\tget accStartArrowContainerRole() {\n\t\treturn this.accessibilityRoles.startArrowContainerRole \|\| undefined;\n\t}\n\n\tget accEndArrowContainerRole() {\n\t\treturn this.accessibilityRoles.endArrowContainerRole \|\| undefined;\n\t}\n\n\tget _effectiveLayoutsByMedia() {\n\t\treturn this._layoutsConfiguration \|\| getLayoutsByMedia();\n\t}\n\n\tget _accAttributes() {\n\t\treturn {\n\t\t\tcolumns: {\n\t\t\t\tstart: {\n\t\t\t\t\trole: this.accStartColumnRole,\n\t\t\t\t\tariaHidden: !this.startColumnVisible \|\| undefined,\n\t\t\t\t},\n\t\t\t\tmiddle: {\n\t\t\t\t\trole: this.accMiddleColumnRole,\n\t\t\t\t\tariaHidden: !this.midColumnVisible \|\| undefined,\n\t\t\t\t},\n\t\t\t\tend: {\n\t\t\t\t\trole: this.accEndColumnRole,\n\t\t\t\t\tariaHidden: !this.endColumnVisible \|\| undefined,\n\t\t\t\t},\n\t\t\t},\n\t\t};\n\t}\n\n\tget accStartArrowText() {\n\t\tconst customTexts = this.accessibilityTexts;\n\n\t\tif (this.startArrowDirection === \"mirror\") {\n\t\t\treturn customTexts.startArrowLeftText \|\| FlexibleColumnLayout.i18nBundle.getText(FCL_START_COLUMN_COLLAPSE_BUTTON_TOOLTIP);\n\t\t}\n\n\t\treturn customTexts.startArrowRightText \|\| FlexibleColumnLayout.i18nBundle.getText(FCL_START_COLUMN_EXPAND_BUTTON_TOOLTIP);\n\t}\n\n\tget accEndArrowText() {\n\t\tconst customTexts = this.accessibilityTexts;\n\n\t\tif (this.endArrowDirection === \"mirror\") {\n\t\t\treturn customTexts.endArrowRightText \|\| FlexibleColumnLayout.i18nBundle.getText(FCL_END_COLUMN_COLLAPSE_BUTTON_TOOLTIP);\n\t\t}\n\n\t\treturn customTexts.endArrowLeftText \|\| FlexibleColumnLayout.i18nBundle.getText(FCL_END_COLUMN_EXPAND_BUTTON_TOOLTIP);\n\t}\n}\n\nFlexibleColumnLayout.define();\n\nexport default FlexibleColumnLayout;\n\nexport type { MEDIA };\n"]}
1	+ {"version":3,"file":"FlexibleColumnLayout.js","sourceRoot":"","sources":["../src/FlexibleColumnLayout.ts"],"names":[],"mappings":"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","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event.js\";\nimport litRender from \"@ui5/webcomponents-base/dist/renderer/LitRenderer.js\";\nimport ResizeHandler from \"@ui5/webcomponents-base/dist/delegate/ResizeHandler.js\";\nimport Float from \"@ui5/webcomponents-base/dist/types/Float.js\";\nimport Integer from \"@ui5/webcomponents-base/dist/types/Integer.js\";\nimport { getI18nBundle } from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport type { I18nText } from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport AnimationMode from \"@ui5/webcomponents-base/dist/types/AnimationMode.js\";\nimport { getAnimationMode } from \"@ui5/webcomponents-base/dist/config/AnimationMode.js\";\nimport Button from \"@ui5/webcomponents/dist/Button.js\";\nimport \"@ui5/webcomponents-icons/dist/slim-arrow-left.js\";\nimport \"@ui5/webcomponents-icons/dist/slim-arrow-right.js\";\nimport FCLLayout from \"./types/FCLLayout.js\";\nimport type { LayoutConfiguration } from \"./fcl-utils/FCLLayout.js\";\nimport {\n\tgetLayoutsByMedia,\n\tgetNextLayoutByStartArrow,\n\tgetNextLayoutByEndArrow,\n} from \"./fcl-utils/FCLLayout.js\";\n\n// Texts\nimport {\n\tFCL_START_COLUMN_TXT,\n\tFCL_MIDDLE_COLUMN_TXT,\n\tFCL_END_COLUMN_TXT,\n\tFCL_START_COLUMN_EXPAND_BUTTON_TOOLTIP,\n\tFCL_START_COLUMN_COLLAPSE_BUTTON_TOOLTIP,\n\tFCL_END_COLUMN_EXPAND_BUTTON_TOOLTIP,\n\tFCL_END_COLUMN_COLLAPSE_BUTTON_TOOLTIP,\n} from \"./generated/i18n/i18n-defaults.js\";\n\n// Template\nimport FlexibleColumnLayoutTemplate from \"./generated/templates/FlexibleColumnLayoutTemplate.lit.js\";\n\n// Styles\nimport FlexibleColumnLayoutCss from \"./generated/themes/FlexibleColumnLayout.css.js\";\n\nenum MEDIA {\n\tPHONE = \"phone\",\n\tTABLET = \"tablet\",\n\tDESKTOP = \"desktop\",\n}\n\nenum BREAKPOINTS {\n\t\"PHONE\" = 599,\n\t\"TABLET\" = 1023,\n}\n\ntype ColumnLayout = Array<string \| number>;\n\ntype FlexibleColumnLayoutLayoutChangeEventDetail = {\n\tlayout: `${FCLLayout}`,\n\tcolumnLayout: ColumnLayout,\n\tstartColumnVisible: boolean,\n\tmidColumnVisible: boolean,\n\tendColumnVisible: boolean,\n\tarrowUsed: boolean,\n\tarrowsUsed: boolean,\n\tresize: boolean,\n};\n\ntype AccessiblilityTexts = {\n\tstartColumnAccessibleName?: I18nText;\n\tstartArrowContainerAccessibleName?: I18nText;\n\tstartArrowLeftText?: I18nText;\n\tstartArrowRightText?: I18nText;\n\tmidColumnAccessibleName?: I18nText;\n\tendColumnAccessibleName?: I18nText;\n\tendArrowContainerAccessibleName?: I18nText;\n\tendArrowRightText?: I18nText;\n\tendArrowLeftText?: I18nText;\n};\n\ntype AccessibilityRoles = {\n\tstartColumnRole?: I18nText;\n\tmidColumnRole?: I18nText;\n\tendColumnRole?: I18nText;\n\tstartArrowContainerRole?: I18nText;\n\tendArrowContainerRole?: I18nText;\n};\n\n/*\n @class\n \n <h3 class=\"comment-api-title\">Overview</h3>\n \n The <code>FlexibleColumnLayout</code> implements the list-detail-detail paradigm by displaying up to three pages in separate columns.\n * There are several possible layouts that can be changed either with the component API, or by pressing the arrows, displayed between the columns.\n \n <h3>Usage</h3>\n \n Use this component for applications that need to display several logical levels of related information side by side (e.g. list of items, item, sub-item, etc.).\n * The Component is flexible in a sense that the application can focus the user's attention on one particular column.\n \n <h3>Responsive Behavior</h3>\n \n The <code>FlexibleColumnLayout</code> automatically displays the maximum possible number of columns based on <code>layout</code> property and the window size.\n * The component would display 1 column for window size smaller than 599px, up to two columns between 599px and 1023px,\n * and 3 columns for sizes bigger than 1023px.\n \n <br><br>\n * <h3>Keyboard Handling</h3>\n \n <h4>Basic Navigation</h4>\n * <ul>\n * <li>[SPACE, ENTER, RETURN] - If focus is on the layout toggle button (arrow button), once activated, it triggers the associated action (such as expand/collapse the column).</li>\n * <li>This component provides a build in fast navigation group which can be used via <code>F6 / Shift + F6</code> or <code> Ctrl + Alt(Option) + Down / Ctrl + Alt(Option) + Up</code>.\n * In order to use this functionality, you need to import the following module:\n * <code>import \"@ui5/webcomponents-base/dist/features/F6Navigation.js\"</code></li>\n * </ul>\n \n <h4>Fast Navigation</h4>\n * This component provides a build in fast navigation group which can be used via <code>F6 / Shift + F6</code> or <code> Ctrl + Alt(Option) + Down / Ctrl + Alt(Option) + Up</code>.\n * In order to use this functionality, you need to import the following module:\n * <code>import \"@ui5/webcomponents-base/dist/features/F6Navigation.js\"</code>\n * <br><br>\n \n <h3>ES6 Module Import</h3>\n \n <code>import \"@ui5/webcomponents-fiori/dist/FlexibleColumnLayout.js\";</code>\n \n @constructor\n * @author SAP SE\n * @alias sap.ui.webc.fiori.FlexibleColumnLayout\n * @extends sap.ui.webc.base.UI5Element\n * @tagname ui5-flexible-column-layout\n * @public\n * @since 1.0.0-rc.8\n /\n@customElement({\n\ttag: \"ui5-flexible-column-layout\",\n\tfastNavigation: true,\n\trenderer: litRender,\n\tstyles: FlexibleColumnLayoutCss,\n\ttemplate: FlexibleColumnLayoutTemplate,\n\tdependencies: [Button],\n})\n\n/\n Fired when the layout changes via user interaction by clicking the arrows\n * or by changing the component size due to resizing.\n \n @param {sap.ui.webc.fiori.types.FCLLayout} layout The current layout\n * @param {array} columnLayout The effective column layout, f.e [67%, 33%, 0]\n * @param {boolean} startColumnVisible Indicates if the start column is currently visible\n * @param {boolean} midColumnVisible Indicates if the middle column is currently visible\n * @param {boolean} endColumnVisible Indicates if the end column is currently visible\n * @param {boolean} arrowsUsed Indicates if the layout is changed via the arrows\n * @param {boolean} resize Indicates if the layout is changed via resizing\n * @event sap.ui.webc.fiori.FlexibleColumnLayout#layout-change\n * @public\n /\n@event(\"layout-change\", {\n\tdetail: {\n\t\tlayout: { type: FCLLayout },\n\t\tcolumnLayout: { type: Array },\n\t\tstartColumnVisible: { type: Boolean },\n\t\tmidColumnVisible: { type: Boolean },\n\t\tendColumnVisible: { type: Boolean },\n\t\tarrowsUsed: { type: Boolean },\n\t\tresize: { type: Boolean },\n\t},\n})\nclass FlexibleColumnLayout extends UI5Element {\n\t/\n\t Defines the columns layout and their proportion.\n\t* <br><br>\n\t* <b>Note:</b> The layout also depends on the screen size - one column for screens smaller than 599px,\n\t* two columns between 599px and 1023px and three columns for sizes bigger than 1023px.\n\t* <br><br>\n\t* Available options are:\n\t* <ul>\n\t* <li><code>OneColumn</code></li>\n\t* <li><code>TwoColumnsStartExpanded</code></li>\n\t* <li><code>TwoColumnsMidExpanded</code></li>\n\t* <li><code>ThreeColumnsMidExpanded</code></li>\n\t* <li><code>ThreeColumnsEndExpanded</code></li>\n\t* <li><code>ThreeColumnsStartExpandedEndHidden</code></li>\n\t* <li><code>ThreeColumnsMidExpandedEndHidden</code></li>\n\t* <li><code>MidColumnFullScreen</code></li>\n\t* <li><code>EndColumnFullScreen</code></li>\n\t* </ul>\n\t* <br><br>\n\t* <b>For example:</b> layout=<code>TwoColumnsStartExpanded</code> means the layout will display up to two columns\n\t* in 67%/33% proportion.\n\t* @type {sap.ui.webc.fiori.types.FCLLayout}\n\t* @defaultvalue \"OneColumn\"\n\t* @name sap.ui.webc.fiori.FlexibleColumnLayout.prototype.layout\n\t* @public\n\t/\n\t@property({ type: FCLLayout, defaultValue: FCLLayout.OneColumn })\n\tlayout!: `${FCLLayout}`;\n\n\t/\n\t Defines the visibility of the arrows,\n\t* used for expanding and shrinking the columns.\n\t\n\t @type {boolean}\n\t* @defaultvalue false\n\t* @name sap.ui.webc.fiori.FlexibleColumnLayout.prototype.hideArrows\n\t* @public\n\t* @since 1.0.0-rc.15\n\t/\n\t@property({ type: Boolean })\n\thideArrows!: boolean;\n\n\t/\n\t An object of strings that defines several additional accessibility texts for even further customization.\n\t\n\t It supports the following fields:\n\t* - <code>startColumnAccessibleName</code>: the accessibility name for the <code>startColumn</code> region\n\t* - <code>midColumnAccessibleName</code>: the accessibility name for the <code>midColumn</code> region\n\t* - <code>endColumnAccessibleName</code>: the accessibility name for the <code>endColumn</code> region\n\t* - <code>startArrowLeftText</code>: the text that the first arrow (between the <code>begin</code> and <code>mid</code> columns) will have when pointing to the left\n\t* - <code>startArrowRightText</code>: the text that the first arrow (between the <code>begin</code> and <code>mid</code> columns) will have when pointing to the right\n\t* - <code>endArrowLeftText</code>: the text that the second arrow (between the <code>mid</code> and <code>end</code> columns) will have when pointing to the left\n\t* - <code>endArrowRightText</code>: the text that the second arrow (between the <code>mid</code> and <code>end</code> columns) will have when pointing to the right\n\t* - <code>startArrowContainerAccessibleName</code>: the text that the first arrow container (between the <code>begin</code> and <code>mid</code> columns) will have as <code>aria-label</code>\n\t* - <code>endArrowContainerAccessibleName</code>: the text that the second arrow container (between the <code>mid</code> and <code>end</code> columns) will have as <code>aria-label</code>\n\t\n\t @type {object}\n\t* @name sap.ui.webc.fiori.FlexibleColumnLayout.prototype.accessibilityTexts\n\t* @public\n\t* @since 1.0.0-rc.11\n\t/\n\t@property({ type: Object })\n\taccessibilityTexts!: AccessiblilityTexts;\n\n\t/\n\t An object of strings that defines additional accessibility roles for further customization.\n\t\n\t It supports the following fields:\n\t* - <code>startColumnRole</code>: the accessibility role for the <code>startColumn</code>\n\t* - <code>startArrowContainerRole</code>: the accessibility role for the first arrow container (between the <code>begin</code> and <code>mid</code> columns)\n\t* - <code>midColumnRole</code>: the accessibility role for the <code>midColumn</code>\n\t* - <code>endArrowContainerRole</code>: the accessibility role for the second arrow container (between the <code>mid</code> and <code>end</code> columns)\n\t* - <code>endColumnRole</code>: the accessibility role for the <code>endColumn</code>\n\t\n\t @type {object}\n\t* @public\n\t* @name sap.ui.webc.fiori.FlexibleColumnLayout.prototype.accessibilityRoles\n\t* @since 1.1.0\n\t/\n\t@property({ type: Object })\n\taccessibilityRoles!: AccessibilityRoles;\n\n\t/\n\t Defines the component width in px.\n\t\n\t @type {sap.ui.webc.base.types.Float}\n\t* @defaultvalue 0\n\t* @private\n\t/\n\t@property({ validator: Float, defaultValue: 0 })\n\t_width!: number;\n\n\t/\n\t Defines the effective columns layout,\n\t* based on both the <code>layout</code> property and the screen size.\n\t* Example: [67%, 33%, 0], [25%, 50%, 25%], etc.\n\t\n\t @type {object}\n\t* @defaultvalue undefined\n\t* @private\n\t/\n\t@property({ type: Object, defaultValue: undefined })\n\t_columnLayout?: ColumnLayout;\n\n\t/\n\t Defines the visible columns count - 1, 2 or 3.\n\t\n\t @type {sap.ui.webc.base.types.Integer}\n\t* @defaultvalue 1\n\t* @private\n\t/\n\t@property({ validator: Integer, defaultValue: 0 })\n\t_visibleColumns!: number;\n\n\t/\n\t Allows the user to replace the whole layouts configuration\n\t\n\t @type {object}\n\t* @private\n\t* @sap-restricted\n\t/\n\t@property({ type: Object, defaultValue: undefined })\n\t_layoutsConfiguration?: LayoutConfiguration;\n\n\t/\n\t Defines the content in the start column.\n\t* @type {HTMLElement}\n\t* @slot\n\t* @name sap.ui.webc.fiori.FlexibleColumnLayout.prototype.startColumn\n\t* @public\n\t/\n\t@slot()\n\tstartColumn!: Array<HTMLElement>;\n\n\t/\n\t Defines the content in the middle column.\n\t* @type {HTMLElement}\n\t* @slot\n\t* @name sap.ui.webc.fiori.FlexibleColumnLayout.prototype.midColumn\n\t* @public\n\t/\n\t@slot()\n\tmidColumn!: Array<HTMLElement>;\n\n\t/\n\t Defines the content in the end column.\n\t* @type {HTMLElement}\n\t* @slot\n\t* @name sap.ui.webc.fiori.FlexibleColumnLayout.prototype.endColumn\n\t* @public\n\t/\n\t@slot()\n\tendColumn!: Array<HTMLElement>;\n\n\tinitialRendering: boolean;\n\t_handleResize: () => void;\n\tstatic i18nBundle: I18nBundle;\n\t_prevLayout: `${FCLLayout}` \| null;\n\n\tconstructor() {\n\t\tsuper();\n\n\t\tthis._prevLayout = null;\n\t\tthis.initialRendering = true;\n\t\tthis._handleResize = this.handleResize.bind(this);\n\t}\n\n\tstatic async onDefine() {\n\t\tFlexibleColumnLayout.i18nBundle = await getI18nBundle(\"@ui5/webcomponents-fiori\");\n\t}\n\n\tstatic get ANIMATION_DURATION() {\n\t\treturn getAnimationMode() !== AnimationMode.None ? 560 : 0;\n\t}\n\n\tonEnterDOM() {\n\t\tResizeHandler.register(this, this._handleResize.bind(this));\n\t}\n\n\tonExitDOM() {\n\t\tResizeHandler.deregister(this, this._handleResize);\n\t}\n\n\tonAfterRendering() {\n\t\tif (this.initialRendering) {\n\t\t\tthis.handleInitialRendering();\n\t\t\treturn;\n\t\t}\n\n\t\tthis.syncLayout();\n\t}\n\n\thandleInitialRendering() {\n\t\tthis._prevLayout = this.layout;\n\t\tthis.updateLayout();\n\t\tthis.initialRendering = false;\n\t}\n\n\thandleResize() {\n\t\tif (this.initialRendering) {\n\t\t\treturn;\n\t\t}\n\n\t\t// store the previous layout\n\t\tconst prevLayoutHash = this.columnLayout!.join();\n\n\t\t// update the column layout, based on the current width\n\t\tthis.updateLayout();\n\n\t\t// fire layout-change if the column layout changed\n\t\tif (prevLayoutHash !== this.columnLayout!.join()) {\n\t\t\tthis.fireLayoutChange(false, true);\n\t\t}\n\t}\n\n\tstartArrowClick() {\n\t\tthis.arrowClick({ start: true, end: false });\n\t}\n\n\tendArrowClick() {\n\t\tthis.arrowClick({ start: false, end: true });\n\t}\n\n\tarrowClick(options: { start: boolean, end: boolean }) {\n\t\t// update public property\n\t\tthis.layout = this.nextLayout(this.layout, { start: options.start, end: options.end })!;\n\n\t\t// update layout\n\t\tthis.updateLayout();\n\n\t\t// fire layout-change\n\t\tthis.fireLayoutChange(true, false);\n\t}\n\n\tupdateLayout() {\n\t\tthis._width = this.widthDOM;\n\t\tthis._columnLayout = this.nextColumnLayout(this.layout);\n\t\tthis._visibleColumns = this.calcVisibleColumns(this._columnLayout);\n\t\tthis.toggleColumns();\n\t}\n\n\tsyncLayout() {\n\t\tif (this._prevLayout !== this.layout) {\n\t\t\tthis.updateLayout();\n\t\t\tthis._prevLayout = this.layout;\n\t\t}\n\t}\n\n\ttoggleColumns() {\n\t\tthis.toggleColumn(\"start\");\n\t\tthis.toggleColumn(\"mid\");\n\t\tthis.toggleColumn(\"end\");\n\t}\n\n\ttoggleColumn(column: string) {\n\t\tlet columnWidth;\n\t\tlet columnDOM;\n\n\t\tif (column === \"start\") {\n\t\t\tcolumnWidth = this.startColumnWidth;\n\t\t\tcolumnDOM = this.startColumnDOM;\n\t\t} else if (column === \"mid\") {\n\t\t\tcolumnWidth = this.midColumnWidth;\n\t\t\tcolumnDOM = this.midColumnDOM;\n\t\t} else {\n\t\t\tcolumnWidth = this.endColumnWidth;\n\t\t\tcolumnDOM = this.endColumnDOM;\n\t\t}\n\n\t\tconst currentlyHidden = this._isColumnHidden(columnWidth);\n\t\tconst previouslyHidden = this._isColumnHidden(columnDOM.style.width);\n\n\t\t// no change\n\t\tif (currentlyHidden && previouslyHidden) {\n\t\t\treturn;\n\t\t}\n\n\t\t// column resizing: from 33% to 67%, from 25% to 50%, etc.\n\t\tif (!currentlyHidden && !previouslyHidden) {\n\t\t\tcolumnDOM.style.width = typeof columnWidth === \"number\" ? `${columnWidth}px` : columnWidth;\n\t\t\treturn;\n\t\t}\n\n\t\t// hide column: 33% to 0, 25% to 0, etc .\n\t\tif (currentlyHidden) {\n\t\t\t// animate the width\n\t\t\tcolumnDOM.style.width = typeof columnWidth === \"number\" ? `${columnWidth}px` : columnWidth;\n\n\t\t\t// hide column with delay to allow the animation runs entirely\n\t\t\tcolumnDOM.addEventListener(\"transitionend\", this.columnResizeHandler);\n\n\t\t\treturn;\n\t\t}\n\n\t\t// show column: from 0 to 33%, from 0 to 25%, etc.\n\t\tif (previouslyHidden) {\n\t\t\tcolumnDOM.removeEventListener(\"transitionend\", this.columnResizeHandler);\n\t\t\tcolumnDOM.classList.remove(\"ui5-fcl-column--hidden\");\n\t\t\tcolumnDOM.style.width = typeof columnWidth === \"number\" ? `${columnWidth}px` : columnWidth;\n\t\t}\n\t}\n\n\tcolumnResizeHandler = (e: Event) => {\n\t\t(e.target as HTMLElement).classList.add(\"ui5-fcl-column--hidden\");\n\t}\n\n\tnextLayout(layout: `${FCLLayout}`, arrowsInfo: { start: boolean, end: boolean }) {\n\t\tif (!arrowsInfo) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (arrowsInfo.start) {\n\t\t\treturn getNextLayoutByStartArrow()[layout as keyof typeof getNextLayoutByStartArrow];\n\t\t}\n\n\t\tif (arrowsInfo.end) {\n\t\t\treturn getNextLayoutByEndArrow()[layout as keyof typeof getNextLayoutByEndArrow];\n\t\t}\n\t}\n\n\tnextColumnLayout(layout: `${FCLLayout}`) {\n\t\treturn this._effectiveLayoutsByMedia[this.media][layout].layout;\n\t}\n\n\tcalcVisibleColumns(colLayout: ColumnLayout) {\n\t\treturn colLayout.filter(colWidth => !this._isColumnHidden(colWidth)).length;\n\t}\n\n\tfireLayoutChange(arrowUsed: boolean, resize: boolean) {\n\t\tthis.fireEvent<FlexibleColumnLayoutLayoutChangeEventDetail>(\"layout-change\", {\n\t\t\tlayout: this.layout,\n\t\t\tcolumnLayout: this._columnLayout!,\n\t\t\tstartColumnVisible: this.startColumnVisible,\n\t\t\tmidColumnVisible: this.midColumnVisible,\n\t\t\tendColumnVisible: this.endColumnVisible,\n\t\t\tarrowUsed, // for backwards compatibility\n\t\t\tarrowsUsed: arrowUsed, // as documented\n\t\t\tresize,\n\t\t});\n\t}\n\n\t/\n\t Checks if a column is hidden based on its width.\n\t /\n\tprivate _isColumnHidden(columnWidth: number \| string): boolean {\n\t\treturn columnWidth === 0 \|\| columnWidth === \"0px\";\n\t}\n\n\t/\n\t Returns the current column layout, based on both the <code>layout</code> property and the screen size.\n\t* <br><br>\n\t* <b>For example:</b> [\"67%\", \"33%\", 0], [\"100%\", 0, 0], [\"25%\", \"50%\", \"25%\"], etc,\n\t* where the numbers represents the width of the start, middle and end columns.\n\t* @readonly\n\t* @type {array}\n\t* @defaultvalue [\"100%\", 0, 0]\n\t* @name sap.ui.webc.fiori.FlexibleColumnLayout.prototype.columnLayout\n\t* @public\n\t/\n\tget columnLayout(): ColumnLayout \| undefined {\n\t\treturn this._columnLayout;\n\t}\n\n\t/\n\t Returns if the <code>start</code> column is visible.\n\t* @readonly\n\t* @defaultvalue true\n\t* @type {boolean}\n\t* @name sap.ui.webc.fiori.FlexibleColumnLayout.prototype.startColumnVisible\n\t* @public\n\t/\n\tget startColumnVisible(): boolean {\n\t\tif (this._columnLayout) {\n\t\t\treturn !this._isColumnHidden(this._columnLayout[0]);\n\t\t}\n\n\t\treturn false;\n\t}\n\n\t/\n\t Returns if the <code>middle</code> column is visible.\n\t* @readonly\n\t* @type {boolean}\n\t* @defaultvalue false\n\t* @name sap.ui.webc.fiori.FlexibleColumnLayout.prototype.midColumnVisible\n\t* @public\n\t/\n\tget midColumnVisible(): boolean {\n\t\tif (this._columnLayout) {\n\t\t\treturn !this._isColumnHidden(this._columnLayout[1]);\n\t\t}\n\n\t\treturn false;\n\t}\n\n\t/\n\t Returns if the <code>end</code> column is visible.\n\t* @readonly\n\t* @type {boolean}\n\t* @defaultvalue false\n\t* @name sap.ui.webc.fiori.FlexibleColumnLayout.prototype.endColumnVisible\n\t* @public\n\t/\n\tget endColumnVisible(): boolean {\n\t\tif (this._columnLayout) {\n\t\t\treturn !this._isColumnHidden(this._columnLayout[2]);\n\t\t}\n\n\t\treturn false;\n\t}\n\n\t/\n\t Returns the number of currently visible columns.\n\t* @readonly\n\t* @type {sap.ui.webc.base.types.Integer}\n\t* @defaultvalue 1\n\t* @name sap.ui.webc.fiori.FlexibleColumnLayout.prototype.visibleColumns\n\t* @public\n\t*/\n\tget visibleColumns(): number {\n\t\treturn this._visibleColumns;\n\t}\n\n\tget classes() {\n\t\tconst hasAnimation = getAnimationMode() !== AnimationMode.None;\n\n\t\treturn {\n\t\t\troot: {\n\t\t\t\t\"ui5-fcl-root\": true,\n\t\t\t},\n\t\t\tcolumns: {\n\t\t\t\tstart: {\n\t\t\t\t\t\"ui5-fcl-column\": true,\n\t\t\t\t\t\"ui5-fcl-column-animation\": hasAnimation,\n\t\t\t\t\t\"ui5-fcl-column--start\": true,\n\t\t\t\t},\n\t\t\t\tmiddle: {\n\t\t\t\t\t\"ui5-fcl-column\": true,\n\t\t\t\t\t\"ui5-fcl-column-animation\": hasAnimation,\n\t\t\t\t\t\"ui5-fcl-column--middle\": true,\n\t\t\t\t},\n\t\t\t\tend: {\n\t\t\t\t\t\"ui5-fcl-column\": true,\n\t\t\t\t\t\"ui5-fcl-column-animation\": hasAnimation,\n\t\t\t\t\t\"ui5-fcl-column--end\": true,\n\t\t\t\t},\n\t\t\t},\n\t\t};\n\t}\n\n\tget styles() {\n\t\treturn {\n\t\t\tarrowsContainer: {\n\t\t\t\tstart: {\n\t\t\t\t\tdisplay: this.showStartSeparator ? \"flex\" : \"none\",\n\t\t\t\t},\n\t\t\t\tend: {\n\t\t\t\t\tdisplay: this.showEndSeparator ? \"flex\" : \"none\",\n\t\t\t\t},\n\t\t\t},\n\t\t\tarrows: {\n\t\t\t\tstart: {\n\t\t\t\t\tdisplay: this.showStartArrow ? \"inline-block\" : \"none\",\n\t\t\t\t\ttransform: this.startArrowDirection === \"mirror\" ? \"rotate(180deg)\" : \"\",\n\t\t\t\t},\n\t\t\t\tend: {\n\t\t\t\t\tdisplay: this.showEndArrow ? \"inline-block\" : \"none\",\n\t\t\t\t\ttransform: this.endArrowDirection === \"mirror\" ? \"rotate(180deg)\" : \"\",\n\t\t\t\t},\n\t\t\t},\n\t\t};\n\t}\n\n\tget startColumnWidth() {\n\t\treturn this._columnLayout ? this._columnLayout[0] : \"100%\";\n\t}\n\n\tget midColumnWidth() {\n\t\treturn this._columnLayout ? this._columnLayout[1] : \"0px\";\n\t}\n\n\tget endColumnWidth() {\n\t\treturn this._columnLayout ? this._columnLayout[2] : \"0px\";\n\t}\n\n\tget showStartSeparator() {\n\t\treturn this.effectiveArrowsInfo[0].separator \|\| this.startArrowVisibility;\n\t}\n\n\tget showEndSeparator() {\n\t\treturn this.effectiveArrowsInfo[1].separator \|\| this.endArrowVisibility;\n\t}\n\n\tget showStartArrow() {\n\t\treturn this.hideArrows ? false : this.startArrowVisibility;\n\t}\n\n\tget showEndArrow() {\n\t\treturn this.hideArrows ? false : this.endArrowVisibility;\n\t}\n\n\tget startArrowVisibility() {\n\t\treturn this.effectiveArrowsInfo[0].visible;\n\t}\n\n\tget endArrowVisibility() {\n\t\treturn this.effectiveArrowsInfo[1].visible;\n\t}\n\n\tget startArrowDirection() {\n\t\treturn this.effectiveArrowsInfo[0].dir;\n\t}\n\n\tget endArrowDirection() {\n\t\treturn this.effectiveArrowsInfo[1].dir;\n\t}\n\n\tget effectiveArrowsInfo() {\n\t\treturn this._effectiveLayoutsByMedia[this.media][this.layout].arrows;\n\t}\n\n\tget media() {\n\t\tif (this._width <= BREAKPOINTS.PHONE) {\n\t\t\treturn MEDIA.PHONE;\n\t\t}\n\n\t\tif (this._width <= BREAKPOINTS.TABLET) {\n\t\t\treturn MEDIA.TABLET;\n\t\t}\n\n\t\treturn MEDIA.DESKTOP;\n\t}\n\n\tget widthDOM() {\n\t\treturn this.getBoundingClientRect().width;\n\t}\n\n\tget startColumnDOM() {\n\t\treturn this.shadowRoot!.querySelector<HTMLElement>(\".ui5-fcl-column--start\")!;\n\t}\n\n\tget midColumnDOM() {\n\t\treturn this.shadowRoot!.querySelector<HTMLElement>(\".ui5-fcl-column--middle\")!;\n\t}\n\n\tget endColumnDOM() {\n\t\treturn this.shadowRoot!.querySelector<HTMLElement>(\".ui5-fcl-column--end\")!;\n\t}\n\n\tget accStartColumnText() {\n\t\treturn this.accessibilityTexts.startColumnAccessibleName \|\| FlexibleColumnLayout.i18nBundle.getText(FCL_START_COLUMN_TXT);\n\t}\n\n\tget accMiddleColumnText() {\n\t\treturn this.accessibilityTexts.midColumnAccessibleName \|\| FlexibleColumnLayout.i18nBundle.getText(FCL_MIDDLE_COLUMN_TXT);\n\t}\n\n\tget accEndColumnText() {\n\t\treturn this.accessibilityTexts.endColumnAccessibleName \|\| FlexibleColumnLayout.i18nBundle.getText(FCL_END_COLUMN_TXT);\n\t}\n\n\tget accStartArrowContainerText() {\n\t\treturn this.accessibilityTexts.startArrowContainerAccessibleName \|\| undefined;\n\t}\n\n\tget accEndArrowContainerText() {\n\t\treturn this.accessibilityTexts.endArrowContainerAccessibleName \|\| undefined;\n\t}\n\n\tget accStartColumnRole() {\n\t\tif (this.startColumnVisible) {\n\t\t\treturn this.accessibilityRoles.startColumnRole \|\| \"region\";\n\t\t}\n\t\treturn undefined;\n\t}\n\n\tget accMiddleColumnRole() {\n\t\tif (this.midColumnVisible) {\n\t\t\treturn this.accessibilityRoles.midColumnRole \|\| \"region\";\n\t\t}\n\t\treturn undefined;\n\t}\n\n\tget accEndColumnRole() {\n\t\tif (this.endColumnVisible) {\n\t\t\treturn this.accessibilityRoles.endColumnRole \|\| \"region\";\n\t\t}\n\t\treturn undefined;\n\t}\n\n\tget accStartArrowContainerRole() {\n\t\treturn this.accessibilityRoles.startArrowContainerRole \|\| undefined;\n\t}\n\n\tget accEndArrowContainerRole() {\n\t\treturn this.accessibilityRoles.endArrowContainerRole \|\| undefined;\n\t}\n\n\tget _effectiveLayoutsByMedia() {\n\t\treturn this._layoutsConfiguration \|\| getLayoutsByMedia();\n\t}\n\n\tget _accAttributes() {\n\t\treturn {\n\t\t\tcolumns: {\n\t\t\t\tstart: {\n\t\t\t\t\trole: this.accStartColumnRole,\n\t\t\t\t\tariaHidden: !this.startColumnVisible \|\| undefined,\n\t\t\t\t},\n\t\t\t\tmiddle: {\n\t\t\t\t\trole: this.accMiddleColumnRole,\n\t\t\t\t\tariaHidden: !this.midColumnVisible \|\| undefined,\n\t\t\t\t},\n\t\t\t\tend: {\n\t\t\t\t\trole: this.accEndColumnRole,\n\t\t\t\t\tariaHidden: !this.endColumnVisible \|\| undefined,\n\t\t\t\t},\n\t\t\t},\n\t\t};\n\t}\n\n\tget accStartArrowText() {\n\t\tconst customTexts = this.accessibilityTexts;\n\n\t\tif (this.startArrowDirection === \"mirror\") {\n\t\t\treturn customTexts.startArrowLeftText \|\| FlexibleColumnLayout.i18nBundle.getText(FCL_START_COLUMN_COLLAPSE_BUTTON_TOOLTIP);\n\t\t}\n\n\t\treturn customTexts.startArrowRightText \|\| FlexibleColumnLayout.i18nBundle.getText(FCL_START_COLUMN_EXPAND_BUTTON_TOOLTIP);\n\t}\n\n\tget accEndArrowText() {\n\t\tconst customTexts = this.accessibilityTexts;\n\n\t\tif (this.endArrowDirection === \"mirror\") {\n\t\t\treturn customTexts.endArrowRightText \|\| FlexibleColumnLayout.i18nBundle.getText(FCL_END_COLUMN_COLLAPSE_BUTTON_TOOLTIP);\n\t\t}\n\n\t\treturn customTexts.endArrowLeftText \|\| FlexibleColumnLayout.i18nBundle.getText(FCL_END_COLUMN_EXPAND_BUTTON_TOOLTIP);\n\t}\n}\n\nFlexibleColumnLayout.define();\n\nexport default FlexibleColumnLayout;\n\nexport type {\n\tMEDIA,\n\tFlexibleColumnLayoutLayoutChangeEventDetail,\n};\n"]}

package/dist/NotificationListGroupItem.d.ts CHANGED Viewed

@@ -3,6 +3,10 @@ import type NotificationListItem from "./NotificationListItem.js";
 import "@ui5/webcomponents-icons/dist/navigation-right-arrow.js";
 import "@ui5/webcomponents-icons/dist/overflow.js";
 import "@ui5/webcomponents-icons/dist/decline.js";
+import type { NotificationListItemBaseCloseEventDetail as NotificationListGroupItemCloseEventDetail } from "./NotificationListItemBase.js";
+type NotificationListGroupItemToggleEventDetail = {
+    item: NotificationListGroupItem;
+};
 /**
  * @class
  *
@@ -98,3 +102,4 @@ declare class NotificationListGroupItem extends NotificationListItemBase {
     _onBtnToggleClick(): void;
 }
 export default NotificationListGroupItem;
+export type { NotificationListGroupItemToggleEventDetail, NotificationListGroupItemCloseEventDetail, };

package/dist/NotificationListGroupItem.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NotificationListGroupItem.js","sourceRoot":"","sources":["../src/NotificationListGroupItem.ts"],"names":[],"mappings":"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","sourcesContent":["import Priority from \"@ui5/webcomponents/dist/types/Priority.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event.js\";\nimport List from \"@ui5/webcomponents/dist/List.js\";\nimport Button from \"@ui5/webcomponents/dist/Button.js\";\nimport BusyIndicator from \"@ui5/webcomponents/dist/BusyIndicator.js\";\nimport Icon from \"@ui5/webcomponents/dist/Icon.js\";\nimport Popover from \"@ui5/webcomponents/dist/Popover.js\";\nimport NotificationListItemBase from \"./NotificationListItemBase.js\";\nimport type NotificationListItem from \"./NotificationListItem.js\";\n\n// Icons\nimport \"@ui5/webcomponents-icons/dist/navigation-right-arrow.js\";\nimport \"@ui5/webcomponents-icons/dist/overflow.js\";\nimport \"@ui5/webcomponents-icons/dist/decline.js\";\n\n// Texts\nimport {\n\tNOTIFICATION_LIST_GROUP_ITEM_TXT,\n\tNOTIFICATION_LIST_GROUP_ITEM_COUNTER_TXT,\n\tNOTIFICATION_LIST_ITEM_READ,\n\tNOTIFICATION_LIST_ITEM_UNREAD,\n\tNOTIFICATION_LIST_ITEM_HIGH_PRIORITY_TXT,\n\tNOTIFICATION_LIST_ITEM_MEDIUM_PRIORITY_TXT,\n\tNOTIFICATION_LIST_ITEM_LOW_PRIORITY_TXT,\n\tNOTIFICATION_LIST_ITEM_OVERLOW_BTN_TITLE,\n\tNOTIFICATION_LIST_GROUP_ITEM_CLOSE_BTN_TITLE,\n\tNOTIFICATION_LIST_GROUP_ITEM_TOGGLE_BTN_COLLAPSE_TITLE,\n\tNOTIFICATION_LIST_GROUP_ITEM_TOGGLE_BTN_EXPAND_TITLE,\n} from \"./generated/i18n/i18n-defaults.js\";\n\n// Templates\nimport NotificationListGroupItemTemplate from \"./generated/templates/NotificationListGroupItemTemplate.lit.js\";\n\n// Styles\nimport NotificationListGroupItemCss from \"./generated/themes/NotificationListGroupItem.css.js\";\n\ntype NotificationListGroupItemToggleEventDetail = {\n\titem: NotificationListGroupItem,\n};\n\n/*\n @class\n \n <h3 class=\"comment-api-title\">Overview</h3>\n * The <code>ui5-li-notification-group</code> is a special type of list item,\n * that unlike others can group items within self, usually <code>ui5-li-notification</code> items.\n * <br>\n \n The component consists of:\n * <ul>\n * <li><code>Toggle</code> button to expand and collapse the group</li>\n * <li><code>Priority</code> icon to display the priority of the group</li>\n * <li><code>TitleText</code> to entitle the group</li>\n * <li>Custom actions - with the use of <code>ui5-notification-action</code></li>\n * <li>Items of the group</li>\n * </ul>\n \n <h3>Usage</h3>\n * The component can be used in a standard <code>ui5-list</code>.\n \n <h3>CSS Shadow Parts</h3>\n \n <ui5-link target=\"_blank\" href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/::part\">CSS Shadow Parts</ui5-link> allow developers to style elements inside the Shadow DOM.\n * <br>\n * The <code>ui5-li-notification-group</code> exposes the following CSS Shadow Parts:\n * <ul>\n * <li>title-text - Used to style the titleText of the notification list group item</li>\n * </ul>\n \n <h3>ES6 Module Import</h3>\n \n <code>import \"@ui5/webcomponents/dist/NotificationListGroupItem.js\";</code>\n * <br>\n * <code>import \"@ui5/webcomponents/dist/NotificationAction.js\";</code> (optional)\n * @constructor\n * @author SAP SE\n * @alias sap.ui.webc.fiori.NotificationListGroupItem\n * @extends sap.ui.webc.fiori.NotificationListItemBase\n * @tagname ui5-li-notification-group\n * @since 1.0.0-rc.8\n * @appenddocs sap.ui.webc.fiori.NotificationAction\n * @implements sap.ui.webc.main.IListItem\n * @public\n /\n@customElement({\n\ttag: \"ui5-li-notification-group\",\n\tlanguageAware: true,\n\tstyles: NotificationListGroupItemCss,\n\ttemplate: NotificationListGroupItemTemplate,\n\tdependencies: [\n\t\tList,\n\t\tButton,\n\t\tIcon,\n\t\tBusyIndicator,\n\t\tPopover,\n\t],\n})\n\n/\n Fired when the <code>ui5-li-notification-group</code> is expanded/collapsed by user interaction.\n \n @public\n * @event sap.ui.webc.fiori.NotificationListGroupItem#toggle\n /\n@event(\"toggle\")\nclass NotificationListGroupItem extends NotificationListItemBase {\n\t/\n\t Defines if the group is collapsed or expanded.\n\t * @type {boolean}\n\t * @defaultvalue false\n\t * @name sap.ui.webc.fiori.NotificationListGroupItem.prototype.collapsed\n\t * @public\n\t /\n\t@property({ type: Boolean })\n\tcollapsed!: boolean;\n\n\t/\n\t Defines if the items <code>counter</code> would be displayed.\n\t * @type {boolean}\n\t * @defaultvalue false\n\t * @name sap.ui.webc.fiori.NotificationListGroupItem.prototype.showCounter\n\t * @public\n\t /\n\t@property({ type: Boolean })\n\tshowCounter!: boolean;\n\n\t/\n\t Defines the items of the <code>ui5-li-notification-group</code>,\n\t * usually <code>ui5-li-notification</code> items.\n\t \n\t @type {sap.ui.webc.fiori.INotificationListItem[]}\n\t * @slot items\n\t * @name sap.ui.webc.fiori.NotificationListGroupItem.prototype.default\n\t * @public\n\t /\n\t@slot({ type: HTMLElement, \"default\": true })\n\titems!: Array<NotificationListItem>\n\n\tonBeforeRendering() {\n\t\tif (this.busy) {\n\t\t\tthis.clearChildBusyIndicator();\n\t\t}\n\t}\n\n\t/\n\t Clears child items busy state to show a single busy over the entire group,\n\t * instead of multiple BusyIndicator instances\n\t /\n\tclearChildBusyIndicator() {\n\t\tthis.items.forEach(item => {\n\t\t\titem.busy = false;\n\t\t});\n\t}\n\n\tget itemsCount() {\n\t\treturn this.items.length;\n\t}\n\n\tget overflowBtnAccessibleName() {\n\t\treturn NotificationListGroupItem.i18nFioriBundle.getText(NOTIFICATION_LIST_ITEM_OVERLOW_BTN_TITLE);\n\t}\n\n\tget closeBtnAccessibleName() {\n\t\treturn NotificationListGroupItem.i18nFioriBundle.getText(NOTIFICATION_LIST_GROUP_ITEM_CLOSE_BTN_TITLE);\n\t}\n\n\tget toggleBtnAccessibleName() {\n\t\tif (this.collapsed) {\n\t\t\treturn NotificationListGroupItem.i18nFioriBundle.getText(NOTIFICATION_LIST_GROUP_ITEM_TOGGLE_BTN_EXPAND_TITLE);\n\t\t}\n\n\t\treturn NotificationListGroupItem.i18nFioriBundle.getText(NOTIFICATION_LIST_GROUP_ITEM_TOGGLE_BTN_COLLAPSE_TITLE);\n\t}\n\n\tget priorityText() {\n\t\tif (this.priority === Priority.High) {\n\t\t\treturn NotificationListGroupItem.i18nFioriBundle.getText(NOTIFICATION_LIST_ITEM_HIGH_PRIORITY_TXT);\n\t\t}\n\n\t\tif (this.priority === Priority.Medium) {\n\t\t\treturn NotificationListGroupItem.i18nFioriBundle.getText(NOTIFICATION_LIST_ITEM_MEDIUM_PRIORITY_TXT);\n\t\t}\n\n\t\tif (this.priority === Priority.Low) {\n\t\t\treturn NotificationListGroupItem.i18nFioriBundle.getText(NOTIFICATION_LIST_ITEM_LOW_PRIORITY_TXT);\n\t\t}\n\n\t\treturn \"\";\n\t}\n\n\tget accInvisibleText() {\n\t\treturn `${this.groupText} ${this.readText} ${this.priorityText} ${this.counterText}`;\n\t}\n\n\tget readText() {\n\t\tif (this.read) {\n\t\t\treturn NotificationListGroupItem.i18nFioriBundle.getText(NOTIFICATION_LIST_ITEM_READ);\n\t\t}\n\n\t\treturn NotificationListGroupItem.i18nFioriBundle.getText(NOTIFICATION_LIST_ITEM_UNREAD);\n\t}\n\n\tget groupText() {\n\t\treturn NotificationListGroupItem.i18nFioriBundle.getText(NOTIFICATION_LIST_GROUP_ITEM_TXT);\n\t}\n\n\tget counterText() {\n\t\tconst text = NotificationListGroupItem.i18nFioriBundle.getText(NOTIFICATION_LIST_GROUP_ITEM_COUNTER_TXT);\n\t\treturn this.showCounter ? `${text} ${this.itemsCount}` : \"\";\n\t}\n\n\tget ariaLabelledBy() {\n\t\tconst id = this._id;\n\t\tconst ids = [];\n\n\t\tif (this.hasTitleText) {\n\t\t\tids.push(`${id}-title-text`);\n\t\t}\n\n\t\tids.push(`${id}-invisibleText`);\n\t\treturn ids.join(\" \");\n\t}\n\n\tget _ariaExpanded() {\n\t\treturn !this.collapsed;\n\t}\n\n\t/\n\t Event handlers\n\t \n\t /\n\t_onBtnToggleClick() {\n\t\tthis.collapsed = !this.collapsed;\n\t\tthis.fireEvent<NotificationListGroupItemToggleEventDetail>(\"toggle\", { item: this });\n\t}\n}\n\nNotificationListGroupItem.define();\n\nexport default NotificationListGroupItem;\n"]}
1	+ {"version":3,"file":"NotificationListGroupItem.js","sourceRoot":"","sources":["../src/NotificationListGroupItem.ts"],"names":[],"mappings":";;;;;;;AAAA,OAAO,QAAQ,MAAM,2CAA2C,CAAC;AACjE,OAAO,aAAa,MAAM,0DAA0D,CAAC;AACrF,OAAO,QAAQ,MAAM,qDAAqD,CAAC;AAC3E,OAAO,IAAI,MAAM,iDAAiD,CAAC;AACnE,OAAO,KAAK,MAAM,kDAAkD,CAAC;AACrE,OAAO,IAAI,MAAM,iCAAiC,CAAC;AACnD,OAAO,MAAM,MAAM,mCAAmC,CAAC;AACvD,OAAO,aAAa,MAAM,0CAA0C,CAAC;AACrE,OAAO,IAAI,MAAM,iCAAiC,CAAC;AACnD,OAAO,OAAO,MAAM,oCAAoC,CAAC;AACzD,OAAO,wBAAwB,MAAM,+BAA+B,CAAC;AAGrE,QAAQ;AACR,OAAO,yDAAyD,CAAC;AACjE,OAAO,2CAA2C,CAAC;AACnD,OAAO,0CAA0C,CAAC;AAElD,QAAQ;AACR,OAAO,EACN,gCAAgC,EAChC,wCAAwC,EACxC,2BAA2B,EAC3B,6BAA6B,EAC7B,wCAAwC,EACxC,0CAA0C,EAC1C,uCAAuC,EACvC,wCAAwC,EACxC,4CAA4C,EAC5C,sDAAsD,EACtD,oDAAoD,GACpD,MAAM,mCAAmC,CAAC;AAE3C,YAAY;AACZ,OAAO,iCAAiC,MAAM,gEAAgE,CAAC;AAE/G,SAAS;AACT,OAAO,4BAA4B,MAAM,qDAAqD,CAAC;AAQ/F;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2CG;AAsBH,IAAM,yBAAyB,iCAA/B,MAAM,yBAA0B,SAAQ,wBAAwB;IAiC/D,iBAAiB;QAChB,IAAI,IAAI,CAAC,IAAI,EAAE;YACd,IAAI,CAAC,uBAAuB,EAAE,CAAC;SAC/B;IACF,CAAC;IAED;;;OAGG;IACH,uBAAuB;QACtB,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE;YACzB,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;QACnB,CAAC,CAAC,CAAC;IACJ,CAAC;IAED,IAAI,UAAU;QACb,OAAO,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC;IAC1B,CAAC;IAED,IAAI,yBAAyB;QAC5B,OAAO,2BAAyB,CAAC,eAAe,CAAC,OAAO,CAAC,wCAAwC,CAAC,CAAC;IACpG,CAAC;IAED,IAAI,sBAAsB;QACzB,OAAO,2BAAyB,CAAC,eAAe,CAAC,OAAO,CAAC,4CAA4C,CAAC,CAAC;IACxG,CAAC;IAED,IAAI,uBAAuB;QAC1B,IAAI,IAAI,CAAC,SAAS,EAAE;YACnB,OAAO,2BAAyB,CAAC,eAAe,CAAC,OAAO,CAAC,oDAAoD,CAAC,CAAC;SAC/G;QAED,OAAO,2BAAyB,CAAC,eAAe,CAAC,OAAO,CAAC,sDAAsD,CAAC,CAAC;IAClH,CAAC;IAED,IAAI,YAAY;QACf,IAAI,IAAI,CAAC,QAAQ,KAAK,QAAQ,CAAC,IAAI,EAAE;YACpC,OAAO,2BAAyB,CAAC,eAAe,CAAC,OAAO,CAAC,wCAAwC,CAAC,CAAC;SACnG;QAED,IAAI,IAAI,CAAC,QAAQ,KAAK,QAAQ,CAAC,MAAM,EAAE;YACtC,OAAO,2BAAyB,CAAC,eAAe,CAAC,OAAO,CAAC,0CAA0C,CAAC,CAAC;SACrG;QAED,IAAI,IAAI,CAAC,QAAQ,KAAK,QAAQ,CAAC,GAAG,EAAE;YACnC,OAAO,2BAAyB,CAAC,eAAe,CAAC,OAAO,CAAC,uCAAuC,CAAC,CAAC;SAClG;QAED,OAAO,EAAE,CAAC;IACX,CAAC;IAED,IAAI,gBAAgB;QACnB,OAAO,GAAG,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,YAAY,IAAI,IAAI,CAAC,WAAW,EAAE,CAAC;IACtF,CAAC;IAED,IAAI,QAAQ;QACX,IAAI,IAAI,CAAC,IAAI,EAAE;YACd,OAAO,2BAAyB,CAAC,eAAe,CAAC,OAAO,CAAC,2BAA2B,CAAC,CAAC;SACtF;QAED,OAAO,2BAAyB,CAAC,eAAe,CAAC,OAAO,CAAC,6BAA6B,CAAC,CAAC;IACzF,CAAC;IAED,IAAI,SAAS;QACZ,OAAO,2BAAyB,CAAC,eAAe,CAAC,OAAO,CAAC,gCAAgC,CAAC,CAAC;IAC5F,CAAC;IAED,IAAI,WAAW;QACd,MAAM,IAAI,GAAG,2BAAyB,CAAC,eAAe,CAAC,OAAO,CAAC,wCAAwC,CAAC,CAAC;QACzG,OAAO,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,GAAG,IAAI,IAAI,IAAI,CAAC,UAAU,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;IAC7D,CAAC;IAED,IAAI,cAAc;QACjB,MAAM,EAAE,GAAG,IAAI,CAAC,GAAG,CAAC;QACpB,MAAM,GAAG,GAAG,EAAE,CAAC;QAEf,IAAI,IAAI,CAAC,YAAY,EAAE;YACtB,GAAG,CAAC,IAAI,CAAC,GAAG,EAAE,aAAa,CAAC,CAAC;SAC7B;QAED,GAAG,CAAC,IAAI,CAAC,GAAG,EAAE,gBAAgB,CAAC,CAAC;QAChC,OAAO,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IACtB,CAAC;IAED,IAAI,aAAa;QAChB,OAAO,CAAC,IAAI,CAAC,SAAS,CAAC;IACxB,CAAC;IAED;;;OAGG;IACH,iBAAiB;QAChB,IAAI,CAAC,SAAS,GAAG,CAAC,IAAI,CAAC,SAAS,CAAC;QACjC,IAAI,CAAC,SAAS,CAA6C,QAAQ,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,CAAC;IACtF,CAAC;CACD,CAAA;AAzHA;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;4DACR;AAUpB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;8DACN;AAYtB;IADC,IAAI,CAAC,EAAE,IAAI,EAAE,WAAW,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;wDACV;AA/B9B,yBAAyB;IArB9B,aAAa,CAAC;QACd,GAAG,EAAE,2BAA2B;QAChC,aAAa,EAAE,IAAI;QACnB,MAAM,EAAE,4BAA4B;QACpC,QAAQ,EAAE,iCAAiC;QAC3C,YAAY,EAAE;YACb,IAAI;YACJ,MAAM;YACN,IAAI;YACJ,aAAa;YACb,OAAO;SACP;KACD,CAAC;IAEF;;;;;OAKG;;IACF,KAAK,CAAC,QAAQ,CAAC;GACV,yBAAyB,CAkI9B;AAED,yBAAyB,CAAC,MAAM,EAAE,CAAC;AAEnC,eAAe,yBAAyB,CAAC","sourcesContent":["import Priority from \"@ui5/webcomponents/dist/types/Priority.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event.js\";\nimport List from \"@ui5/webcomponents/dist/List.js\";\nimport Button from \"@ui5/webcomponents/dist/Button.js\";\nimport BusyIndicator from \"@ui5/webcomponents/dist/BusyIndicator.js\";\nimport Icon from \"@ui5/webcomponents/dist/Icon.js\";\nimport Popover from \"@ui5/webcomponents/dist/Popover.js\";\nimport NotificationListItemBase from \"./NotificationListItemBase.js\";\nimport type NotificationListItem from \"./NotificationListItem.js\";\n\n// Icons\nimport \"@ui5/webcomponents-icons/dist/navigation-right-arrow.js\";\nimport \"@ui5/webcomponents-icons/dist/overflow.js\";\nimport \"@ui5/webcomponents-icons/dist/decline.js\";\n\n// Texts\nimport {\n\tNOTIFICATION_LIST_GROUP_ITEM_TXT,\n\tNOTIFICATION_LIST_GROUP_ITEM_COUNTER_TXT,\n\tNOTIFICATION_LIST_ITEM_READ,\n\tNOTIFICATION_LIST_ITEM_UNREAD,\n\tNOTIFICATION_LIST_ITEM_HIGH_PRIORITY_TXT,\n\tNOTIFICATION_LIST_ITEM_MEDIUM_PRIORITY_TXT,\n\tNOTIFICATION_LIST_ITEM_LOW_PRIORITY_TXT,\n\tNOTIFICATION_LIST_ITEM_OVERLOW_BTN_TITLE,\n\tNOTIFICATION_LIST_GROUP_ITEM_CLOSE_BTN_TITLE,\n\tNOTIFICATION_LIST_GROUP_ITEM_TOGGLE_BTN_COLLAPSE_TITLE,\n\tNOTIFICATION_LIST_GROUP_ITEM_TOGGLE_BTN_EXPAND_TITLE,\n} from \"./generated/i18n/i18n-defaults.js\";\n\n// Templates\nimport NotificationListGroupItemTemplate from \"./generated/templates/NotificationListGroupItemTemplate.lit.js\";\n\n// Styles\nimport NotificationListGroupItemCss from \"./generated/themes/NotificationListGroupItem.css.js\";\n\nimport type { NotificationListItemBaseCloseEventDetail as NotificationListGroupItemCloseEventDetail } from \"./NotificationListItemBase.js\";\n\ntype NotificationListGroupItemToggleEventDetail = {\n\titem: NotificationListGroupItem,\n};\n\n/*\n @class\n \n <h3 class=\"comment-api-title\">Overview</h3>\n * The <code>ui5-li-notification-group</code> is a special type of list item,\n * that unlike others can group items within self, usually <code>ui5-li-notification</code> items.\n * <br>\n \n The component consists of:\n * <ul>\n * <li><code>Toggle</code> button to expand and collapse the group</li>\n * <li><code>Priority</code> icon to display the priority of the group</li>\n * <li><code>TitleText</code> to entitle the group</li>\n * <li>Custom actions - with the use of <code>ui5-notification-action</code></li>\n * <li>Items of the group</li>\n * </ul>\n \n <h3>Usage</h3>\n * The component can be used in a standard <code>ui5-list</code>.\n \n <h3>CSS Shadow Parts</h3>\n \n <ui5-link target=\"_blank\" href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/::part\">CSS Shadow Parts</ui5-link> allow developers to style elements inside the Shadow DOM.\n * <br>\n * The <code>ui5-li-notification-group</code> exposes the following CSS Shadow Parts:\n * <ul>\n * <li>title-text - Used to style the titleText of the notification list group item</li>\n * </ul>\n \n <h3>ES6 Module Import</h3>\n \n <code>import \"@ui5/webcomponents/dist/NotificationListGroupItem.js\";</code>\n * <br>\n * <code>import \"@ui5/webcomponents/dist/NotificationAction.js\";</code> (optional)\n * @constructor\n * @author SAP SE\n * @alias sap.ui.webc.fiori.NotificationListGroupItem\n * @extends sap.ui.webc.fiori.NotificationListItemBase\n * @tagname ui5-li-notification-group\n * @since 1.0.0-rc.8\n * @appenddocs sap.ui.webc.fiori.NotificationAction\n * @implements sap.ui.webc.main.IListItem\n * @public\n /\n@customElement({\n\ttag: \"ui5-li-notification-group\",\n\tlanguageAware: true,\n\tstyles: NotificationListGroupItemCss,\n\ttemplate: NotificationListGroupItemTemplate,\n\tdependencies: [\n\t\tList,\n\t\tButton,\n\t\tIcon,\n\t\tBusyIndicator,\n\t\tPopover,\n\t],\n})\n\n/\n Fired when the <code>ui5-li-notification-group</code> is expanded/collapsed by user interaction.\n \n @public\n * @event sap.ui.webc.fiori.NotificationListGroupItem#toggle\n /\n@event(\"toggle\")\nclass NotificationListGroupItem extends NotificationListItemBase {\n\t/\n\t Defines if the group is collapsed or expanded.\n\t * @type {boolean}\n\t * @defaultvalue false\n\t * @name sap.ui.webc.fiori.NotificationListGroupItem.prototype.collapsed\n\t * @public\n\t /\n\t@property({ type: Boolean })\n\tcollapsed!: boolean;\n\n\t/\n\t Defines if the items <code>counter</code> would be displayed.\n\t * @type {boolean}\n\t * @defaultvalue false\n\t * @name sap.ui.webc.fiori.NotificationListGroupItem.prototype.showCounter\n\t * @public\n\t /\n\t@property({ type: Boolean })\n\tshowCounter!: boolean;\n\n\t/\n\t Defines the items of the <code>ui5-li-notification-group</code>,\n\t * usually <code>ui5-li-notification</code> items.\n\t \n\t @type {sap.ui.webc.fiori.INotificationListItem[]}\n\t * @slot items\n\t * @name sap.ui.webc.fiori.NotificationListGroupItem.prototype.default\n\t * @public\n\t /\n\t@slot({ type: HTMLElement, \"default\": true })\n\titems!: Array<NotificationListItem>\n\n\tonBeforeRendering() {\n\t\tif (this.busy) {\n\t\t\tthis.clearChildBusyIndicator();\n\t\t}\n\t}\n\n\t/\n\t Clears child items busy state to show a single busy over the entire group,\n\t * instead of multiple BusyIndicator instances\n\t /\n\tclearChildBusyIndicator() {\n\t\tthis.items.forEach(item => {\n\t\t\titem.busy = false;\n\t\t});\n\t}\n\n\tget itemsCount() {\n\t\treturn this.items.length;\n\t}\n\n\tget overflowBtnAccessibleName() {\n\t\treturn NotificationListGroupItem.i18nFioriBundle.getText(NOTIFICATION_LIST_ITEM_OVERLOW_BTN_TITLE);\n\t}\n\n\tget closeBtnAccessibleName() {\n\t\treturn NotificationListGroupItem.i18nFioriBundle.getText(NOTIFICATION_LIST_GROUP_ITEM_CLOSE_BTN_TITLE);\n\t}\n\n\tget toggleBtnAccessibleName() {\n\t\tif (this.collapsed) {\n\t\t\treturn NotificationListGroupItem.i18nFioriBundle.getText(NOTIFICATION_LIST_GROUP_ITEM_TOGGLE_BTN_EXPAND_TITLE);\n\t\t}\n\n\t\treturn NotificationListGroupItem.i18nFioriBundle.getText(NOTIFICATION_LIST_GROUP_ITEM_TOGGLE_BTN_COLLAPSE_TITLE);\n\t}\n\n\tget priorityText() {\n\t\tif (this.priority === Priority.High) {\n\t\t\treturn NotificationListGroupItem.i18nFioriBundle.getText(NOTIFICATION_LIST_ITEM_HIGH_PRIORITY_TXT);\n\t\t}\n\n\t\tif (this.priority === Priority.Medium) {\n\t\t\treturn NotificationListGroupItem.i18nFioriBundle.getText(NOTIFICATION_LIST_ITEM_MEDIUM_PRIORITY_TXT);\n\t\t}\n\n\t\tif (this.priority === Priority.Low) {\n\t\t\treturn NotificationListGroupItem.i18nFioriBundle.getText(NOTIFICATION_LIST_ITEM_LOW_PRIORITY_TXT);\n\t\t}\n\n\t\treturn \"\";\n\t}\n\n\tget accInvisibleText() {\n\t\treturn `${this.groupText} ${this.readText} ${this.priorityText} ${this.counterText}`;\n\t}\n\n\tget readText() {\n\t\tif (this.read) {\n\t\t\treturn NotificationListGroupItem.i18nFioriBundle.getText(NOTIFICATION_LIST_ITEM_READ);\n\t\t}\n\n\t\treturn NotificationListGroupItem.i18nFioriBundle.getText(NOTIFICATION_LIST_ITEM_UNREAD);\n\t}\n\n\tget groupText() {\n\t\treturn NotificationListGroupItem.i18nFioriBundle.getText(NOTIFICATION_LIST_GROUP_ITEM_TXT);\n\t}\n\n\tget counterText() {\n\t\tconst text = NotificationListGroupItem.i18nFioriBundle.getText(NOTIFICATION_LIST_GROUP_ITEM_COUNTER_TXT);\n\t\treturn this.showCounter ? `${text} ${this.itemsCount}` : \"\";\n\t}\n\n\tget ariaLabelledBy() {\n\t\tconst id = this._id;\n\t\tconst ids = [];\n\n\t\tif (this.hasTitleText) {\n\t\t\tids.push(`${id}-title-text`);\n\t\t}\n\n\t\tids.push(`${id}-invisibleText`);\n\t\treturn ids.join(\" \");\n\t}\n\n\tget _ariaExpanded() {\n\t\treturn !this.collapsed;\n\t}\n\n\t/\n\t Event handlers\n\t \n\t /\n\t_onBtnToggleClick() {\n\t\tthis.collapsed = !this.collapsed;\n\t\tthis.fireEvent<NotificationListGroupItemToggleEventDetail>(\"toggle\", { item: this });\n\t}\n}\n\nNotificationListGroupItem.define();\n\nexport default NotificationListGroupItem;\nexport type {\n\tNotificationListGroupItemToggleEventDetail,\n\tNotificationListGroupItemCloseEventDetail,\n};\n"]}

package/dist/NotificationListItem.d.ts CHANGED Viewed

@@ -3,6 +3,10 @@ import WrappingType from "@ui5/webcomponents/dist/types/WrappingType.js";
 import NotificationListItemBase from "./NotificationListItemBase.js";
 import "@ui5/webcomponents-icons/dist/overflow.js";
 import "@ui5/webcomponents-icons/dist/decline.js";
+import type { NotificationListItemBaseCloseEventDetail as NotificationListItemCloseEventDetail } from "./NotificationListItemBase.js";
+type NotificationListItemPressEventDetail = {
+    item: NotificationListItem;
+};
 /**
  * @class
  *
@@ -151,3 +155,4 @@ declare class NotificationListItem extends NotificationListItemBase {
     onResize(): void;
 }
 export default NotificationListItem;
+export type { NotificationListItemPressEventDetail, NotificationListItemCloseEventDetail, };

package/dist/NotificationListItem.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NotificationListItem.js","sourceRoot":"","sources":["../src/NotificationListItem.ts"],"names":[],"mappings":"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","sourcesContent":["import { isSpace, isEnter } from \"@ui5/webcomponents-base/dist/Keys.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event.js\";\nimport ResizeHandler from \"@ui5/webcomponents-base/dist/delegate/ResizeHandler.js\";\nimport type { ResizeObserverCallback } from \"@ui5/webcomponents-base/dist/delegate/ResizeHandler.js\";\nimport { getEventMark } from \"@ui5/webcomponents-base/dist/MarkedEvents.js\";\nimport Priority from \"@ui5/webcomponents/dist/types/Priority.js\";\nimport Button from \"@ui5/webcomponents/dist/Button.js\";\nimport BusyIndicator from \"@ui5/webcomponents/dist/BusyIndicator.js\";\nimport Link from \"@ui5/webcomponents/dist/Link.js\";\nimport Icon from \"@ui5/webcomponents/dist/Icon.js\";\nimport Popover from \"@ui5/webcomponents/dist/Popover.js\";\nimport WrappingType from \"@ui5/webcomponents/dist/types/WrappingType.js\";\nimport NotificationListItemBase from \"./NotificationListItemBase.js\";\n\n// Icons\nimport \"@ui5/webcomponents-icons/dist/overflow.js\";\nimport \"@ui5/webcomponents-icons/dist/decline.js\";\n\n// Texts\nimport {\n\tNOTIFICATION_LIST_ITEM_TXT,\n\tNOTIFICATION_LIST_ITEM_READ,\n\tNOTIFICATION_LIST_ITEM_UNREAD,\n\tNOTIFICATION_LIST_ITEM_SHOW_MORE,\n\tNOTIFICATION_LIST_ITEM_SHOW_LESS,\n\tNOTIFICATION_LIST_ITEM_HIGH_PRIORITY_TXT,\n\tNOTIFICATION_LIST_ITEM_MEDIUM_PRIORITY_TXT,\n\tNOTIFICATION_LIST_ITEM_LOW_PRIORITY_TXT,\n\tNOTIFICATION_LIST_ITEM_OVERLOW_BTN_TITLE,\n\tNOTIFICATION_LIST_ITEM_CLOSE_BTN_TITLE,\n} from \"./generated/i18n/i18n-defaults.js\";\n\n// Templates\nimport NotificationListItemTemplate from \"./generated/templates/NotificationListItemTemplate.lit.js\";\n\n// Styles\nimport NotificationListItemCss from \"./generated/themes/NotificationListItem.css.js\";\n\ntype NotificationListItemPressEventDetail = {\n\titem: NotificationListItem,\n};\n\ntype Footnote = Record<string, any>;\n\n/*\n @class\n \n <h3 class=\"comment-api-title\">Overview</h3>\n * The <code>ui5-li-notification</code> is a type of list item, meant to display notifications.\n * <br>\n \n The component has a rich set of various properties that allows the user to set <code>avatar</code>, <code>titleText</code>, descriptive <code>content</code>\n * and <code>footnotes</code> to fully describe a notification.\n * <br>\n \n The user can:\n * <ul>\n * <li>display a <code>Close</code> button</li>\n * <li>can control whether the <code>titleText</code> and <code>description</code> should wrap or truncate\n * and display a <code>ShowMore</code> button to switch between less and more information</li>\n * <li>add custom actions by using the <code>ui5-notification-action</code> component</li>\n * </ul>\n \n <h3>Usage</h3>\n * The component can be used in a standard <code>ui5-list</code>.\n \n <h3>CSS Shadow Parts</h3>\n \n <ui5-link target=\"_blank\" href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/::part\">CSS Shadow Parts</ui5-link> allow developers to style elements inside the Shadow DOM.\n * <br>\n * The <code>ui5-li-notification</code> exposes the following CSS Shadow Parts:\n * <ul>\n * <li>title-text - Used to style the titleText of the notification list item</li>\n * </ul>\n \n <h3>ES6 Module Import</h3>\n \n <code>import \"@ui5/webcomponents/dist/NotificationListItem.js\";</code>\n * <br>\n * <code>import \"@ui5/webcomponents/dist/NotificationAction.js\";</code> (optional)\n * @constructor\n * @author SAP SE\n * @alias sap.ui.webc.fiori.NotificationListItem\n * @extends sap.ui.webc.fiori.NotificationListItemBase\n * @tagname ui5-li-notification\n * @appenddocs sap.ui.webc.fiori.NotificationAction\n * @since 1.0.0-rc.8\n * @implements sap.ui.webc.fiori.INotificationListItem, sap.ui.webc.main.IListItem\n * @public\n /\n@customElement({\n\ttag: \"ui5-li-notification\",\n\tlanguageAware: true,\n\tstyles: NotificationListItemCss,\n\ttemplate: NotificationListItemTemplate,\n\tdependencies: [\n\t\tButton,\n\t\tIcon,\n\t\tBusyIndicator,\n\t\tLink,\n\t\tPopover,\n\t],\n})\n\n@event(\"_press\")\nclass NotificationListItem extends NotificationListItemBase {\n\t/\n\t Defines if the <code>titleText</code> and <code>description</code> should wrap,\n\t* they truncate by default.\n\t\n\t <br><br>\n\t* <b>Note:</b> by default the <code>titleText</code> and <code>description</code>,\n\t* and a <code>ShowMore/Less</code> button would be displayed.\n\t* @type {sap.ui.webc.main.types.WrappingType}\n\t* @defaultvalue \"None\"\n\t* @public\n\t* @name sap.ui.webc.fiori.NotificationListItem.prototype.wrappingType\n\t* @since 1.0.0-rc.15\n\t/\n\t@property({ type: WrappingType, defaultValue: WrappingType.None })\n\twrappingType!: `${WrappingType}`;\n\n\t/\n\t Defines the state of the <code>titleText</code> and <code>description</code>,\n\t* if less or more information is displayed.\n\t* @private\n\t/\n\t@property({ type: Boolean })\n\t_showMorePressed!: boolean;\n\n\t/\n\t Defines the visibility of the <code>showMore</code> button.\n\t* @private\n\t/\n\t@property({ type: Boolean })\n\t_showMore!: boolean;\n\n\t/\n\t Defines the avatar, displayed in the <code>ui5-li-notification</code>.\n\t\n\t <br><br>\n\t* <b>Note:</b> Consider using the <code>ui5-avatar</code> to display icons, initials or images.\n\t* <br>\n\t* <b>Note:</b>In order to be complaint with the UX guidlines and for best experience,\n\t* we recommend using avatars with 2rem X 2rem in size (32px X 32px). In case you are using the <code>ui5-avatar</code>\n\t* you can set its <code>size</code> property to <code>XS</code> to get the required size - <code><ui5-avatar size=\"XS\"></ui5-avatar></code>.\n\t\n\t @type {sap.ui.webc.main.IAvatar}\n\t* @slot\n\t* @public\n\t* @name sap.ui.webc.fiori.NotificationListItem.prototype.avatar\n\t/\n\t@slot()\n\tavatar!: Array<HTMLElement>;\n\n\t/\n\t Defines the elements, displayed in the footer of the of the component.\n\t* @type {HTMLElement[]}\n\t* @slot\n\t* @public\n\t* @name sap.ui.webc.fiori.NotificationListItem.prototype.footnotes\n\t/\n\t@slot({ type: HTMLElement, individualSlots: true })\n\tfootnotes!: Array<HTMLElement>;\n\n\t/\n\t Defines the content of the <code>ui5-li-notification</code>,\n\t* usually a description of the notification.\n\t\n\t <br><br>\n\t* <b>Note:</b> Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.\n\t\n\t @type {Node[]}\n\t* @slot description\n\t* @public\n\t* @name sap.ui.webc.fiori.NotificationListItem.prototype.default\n\t/\n\t@slot({ type: Node, \"default\": true })\n\tdescription!: Array<Node>;\n\n\t_titleTextOverflowHeight: number;\n\t_descOverflowHeight: number;\n\t_onResizeBound: ResizeObserverCallback;\n\n\tconstructor() {\n\t\tsuper();\n\n\t\t// the titleText overflow height\n\t\tthis._titleTextOverflowHeight = 0;\n\n\t\t// the description overflow height\n\t\tthis._descOverflowHeight = 0;\n\n\t\t// the resize handler\n\t\tthis._onResizeBound = this.onResize.bind(this);\n\t}\n\n\tonEnterDOM() {\n\t\tResizeHandler.register(this, this._onResizeBound);\n\t}\n\n\tonExitDOM() {\n\t\tResizeHandler.deregister(this, this._onResizeBound);\n\t}\n\n\tget hasDesc() {\n\t\treturn !!this.description.length;\n\t}\n\n\tget hasFootNotes() {\n\t\treturn !!this.footnotes.length;\n\t}\n\n\tget showMoreText() {\n\t\tif (this._showMorePressed) {\n\t\t\treturn NotificationListItem.i18nFioriBundle.getText(NOTIFICATION_LIST_ITEM_SHOW_LESS);\n\t\t}\n\n\t\treturn NotificationListItem.i18nFioriBundle.getText(NOTIFICATION_LIST_ITEM_SHOW_MORE);\n\t}\n\n\tget overflowBtnAccessibleName() {\n\t\treturn NotificationListItem.i18nFioriBundle.getText(NOTIFICATION_LIST_ITEM_OVERLOW_BTN_TITLE);\n\t}\n\n\tget closeBtnAccessibleName() {\n\t\treturn NotificationListItem.i18nFioriBundle.getText(NOTIFICATION_LIST_ITEM_CLOSE_BTN_TITLE);\n\t}\n\n\tget hideShowMore() {\n\t\tif (this.wrappingType === WrappingType.None && this._showMore) {\n\t\t\treturn undefined;\n\t\t}\n\n\t\treturn true;\n\t}\n\n\tget descriptionDOM() {\n\t\treturn this.shadowRoot!.querySelector<HTMLElement>(\".ui5-nli-description\");\n\t}\n\n\tget titleTextDOM() {\n\t\treturn this.shadowRoot!.querySelector<HTMLElement>(\".ui5-nli-title-text\");\n\t}\n\n\tget titleTextHeight() {\n\t\treturn (this.titleTextDOM as HTMLElement).offsetHeight;\n\t}\n\n\tget descriptionHeight() {\n\t\treturn (this.descriptionDOM as HTMLElement).offsetHeight;\n\t}\n\n\tget titleTextOverflows() {\n\t\tconst titleText = this.titleTextDOM;\n\n\t\tif (!titleText) {\n\t\t\treturn false;\n\t\t}\n\n\t\treturn titleText.offsetHeight < titleText.scrollHeight;\n\t}\n\n\tget descriptionOverflows() {\n\t\tconst description = this.descriptionDOM;\n\n\t\tif (!description) {\n\t\t\treturn false;\n\t\t}\n\n\t\treturn description.offsetHeight < description.scrollHeight;\n\t}\n\n\tget footerItems() {\n\t\treturn this.footnotes.map((el, idx, arr) => {\n\t\t\treturn {\n\t\t\t\tslotName: (el as Footnote)._individualSlot,\n\t\t\t\tshowDivider: idx !== arr.length - 1,\n\t\t\t};\n\t\t});\n\t}\n\n\tget ariaLabelledBy() {\n\t\tconst id = this._id;\n\t\tconst ids = [];\n\n\t\tif (this.hasTitleText) {\n\t\t\tids.push(`${id}-title-text`);\n\t\t}\n\t\tif (this.hasDesc) {\n\t\t\tids.push(`${id}-description`);\n\t\t}\n\n\t\tif (this.hasFootNotes) {\n\t\t\tids.push(`${id}-footer`);\n\t\t}\n\n\t\tids.push(`${id}-invisibleText`);\n\n\t\treturn ids.join(\" \");\n\t}\n\n\tget priorityText() {\n\t\tif (this.priority === Priority.High) {\n\t\t\treturn NotificationListItem.i18nFioriBundle.getText(NOTIFICATION_LIST_ITEM_HIGH_PRIORITY_TXT);\n\t\t}\n\n\t\tif (this.priority === Priority.Medium) {\n\t\t\treturn NotificationListItem.i18nFioriBundle.getText(NOTIFICATION_LIST_ITEM_MEDIUM_PRIORITY_TXT);\n\t\t}\n\n\t\tif (this.priority === Priority.Low) {\n\t\t\treturn NotificationListItem.i18nFioriBundle.getText(NOTIFICATION_LIST_ITEM_LOW_PRIORITY_TXT);\n\t\t}\n\n\t\treturn \"\";\n\t}\n\n\tget accInvisibleText() {\n\t\tconst notificationText = NotificationListItem.i18nFioriBundle.getText(NOTIFICATION_LIST_ITEM_TXT);\n\t\tconst readText = this.read ? NotificationListItem.i18nFioriBundle.getText(NOTIFICATION_LIST_ITEM_READ) : NotificationListItem.i18nFioriBundle.getText(NOTIFICATION_LIST_ITEM_UNREAD);\n\t\tconst priorityText = this.priorityText;\n\n\t\treturn `${notificationText} ${readText} ${priorityText}`;\n\t}\n\n\t/\n\t Event handlers\n\t /\n\t_onclick(e: MouseEvent) {\n\t\tthis.fireItemPress(e);\n\t}\n\n\t_onShowMoreClick(e: MouseEvent) {\n\t\te.preventDefault();\n\t\tthis._showMorePressed = !this._showMorePressed;\n\t}\n\n\t_onkeydown(e: KeyboardEvent) {\n\t\tsuper._onkeydown(e);\n\n\t\tif (isEnter(e)) {\n\t\t\tthis.fireItemPress(e);\n\t\t}\n\t}\n\n\t_onkeyup(e: KeyboardEvent) {\n\t\tsuper._onkeyup(e);\n\n\t\tconst space = isSpace(e);\n\n\t\tif (space && getEventMark(e) === \"link\") {\n\t\t\tthis._onShowMoreClick(e as unknown as MouseEvent);\n\t\t\treturn;\n\t\t}\n\n\t\tif (space) {\n\t\t\tthis.fireItemPress(e);\n\t\t}\n\t}\n\n\t/\n\t Private\n\t */\n\tfireItemPress(e: Event) {\n\t\tif (getEventMark(e) === \"button\" \|\| getEventMark(e) === \"link\") {\n\t\t\treturn;\n\t\t}\n\n\t\tthis.fireEvent<NotificationListItemPressEventDetail>(\"_press\", { item: this });\n\t}\n\n\tonResize() {\n\t\tif (this.wrappingType === WrappingType.Normal) {\n\t\t\tthis._showMore = false;\n\t\t\treturn;\n\t\t}\n\n\t\tconst titleTextWouldOverflow = this.titleTextHeight > this._titleTextOverflowHeight;\n\t\tconst descWouldOverflow = this.hasDesc && this.descriptionHeight > this._descOverflowHeight;\n\t\tconst overflows = titleTextWouldOverflow \|\| descWouldOverflow;\n\n\t\tif (this._showMorePressed && overflows) {\n\t\t\tthis._showMore = true;\n\t\t\treturn;\n\t\t}\n\n\t\tif (this.titleTextOverflows \|\| this.descriptionOverflows) {\n\t\t\tthis._titleTextOverflowHeight = this.titleTextHeight;\n\t\t\tthis._descOverflowHeight = this.hasDesc ? this.descriptionHeight : 0;\n\t\t\tthis._showMore = true;\n\t\t\treturn;\n\t\t}\n\n\t\tthis._showMore = false;\n\t}\n}\n\nNotificationListItem.define();\n\nexport default NotificationListItem;\n"]}
1	+ {"version":3,"file":"NotificationListItem.js","sourceRoot":"","sources":["../src/NotificationListItem.ts"],"names":[],"mappings":"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","sourcesContent":["import { isSpace, isEnter } from \"@ui5/webcomponents-base/dist/Keys.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event.js\";\nimport ResizeHandler from \"@ui5/webcomponents-base/dist/delegate/ResizeHandler.js\";\nimport type { ResizeObserverCallback } from \"@ui5/webcomponents-base/dist/delegate/ResizeHandler.js\";\nimport { getEventMark } from \"@ui5/webcomponents-base/dist/MarkedEvents.js\";\nimport Priority from \"@ui5/webcomponents/dist/types/Priority.js\";\nimport Button from \"@ui5/webcomponents/dist/Button.js\";\nimport BusyIndicator from \"@ui5/webcomponents/dist/BusyIndicator.js\";\nimport Link from \"@ui5/webcomponents/dist/Link.js\";\nimport Icon from \"@ui5/webcomponents/dist/Icon.js\";\nimport Popover from \"@ui5/webcomponents/dist/Popover.js\";\nimport WrappingType from \"@ui5/webcomponents/dist/types/WrappingType.js\";\nimport NotificationListItemBase from \"./NotificationListItemBase.js\";\n\n// Icons\nimport \"@ui5/webcomponents-icons/dist/overflow.js\";\nimport \"@ui5/webcomponents-icons/dist/decline.js\";\n\n// Texts\nimport {\n\tNOTIFICATION_LIST_ITEM_TXT,\n\tNOTIFICATION_LIST_ITEM_READ,\n\tNOTIFICATION_LIST_ITEM_UNREAD,\n\tNOTIFICATION_LIST_ITEM_SHOW_MORE,\n\tNOTIFICATION_LIST_ITEM_SHOW_LESS,\n\tNOTIFICATION_LIST_ITEM_HIGH_PRIORITY_TXT,\n\tNOTIFICATION_LIST_ITEM_MEDIUM_PRIORITY_TXT,\n\tNOTIFICATION_LIST_ITEM_LOW_PRIORITY_TXT,\n\tNOTIFICATION_LIST_ITEM_OVERLOW_BTN_TITLE,\n\tNOTIFICATION_LIST_ITEM_CLOSE_BTN_TITLE,\n} from \"./generated/i18n/i18n-defaults.js\";\n\n// Templates\nimport NotificationListItemTemplate from \"./generated/templates/NotificationListItemTemplate.lit.js\";\n\n// Styles\nimport NotificationListItemCss from \"./generated/themes/NotificationListItem.css.js\";\n\nimport type { NotificationListItemBaseCloseEventDetail as NotificationListItemCloseEventDetail } from \"./NotificationListItemBase.js\";\n\ntype NotificationListItemPressEventDetail = {\n\titem: NotificationListItem,\n};\n\ntype Footnote = Record<string, any>;\n\n/*\n @class\n \n <h3 class=\"comment-api-title\">Overview</h3>\n * The <code>ui5-li-notification</code> is a type of list item, meant to display notifications.\n * <br>\n \n The component has a rich set of various properties that allows the user to set <code>avatar</code>, <code>titleText</code>, descriptive <code>content</code>\n * and <code>footnotes</code> to fully describe a notification.\n * <br>\n \n The user can:\n * <ul>\n * <li>display a <code>Close</code> button</li>\n * <li>can control whether the <code>titleText</code> and <code>description</code> should wrap or truncate\n * and display a <code>ShowMore</code> button to switch between less and more information</li>\n * <li>add custom actions by using the <code>ui5-notification-action</code> component</li>\n * </ul>\n \n <h3>Usage</h3>\n * The component can be used in a standard <code>ui5-list</code>.\n \n <h3>CSS Shadow Parts</h3>\n \n <ui5-link target=\"_blank\" href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/::part\">CSS Shadow Parts</ui5-link> allow developers to style elements inside the Shadow DOM.\n * <br>\n * The <code>ui5-li-notification</code> exposes the following CSS Shadow Parts:\n * <ul>\n * <li>title-text - Used to style the titleText of the notification list item</li>\n * </ul>\n \n <h3>ES6 Module Import</h3>\n \n <code>import \"@ui5/webcomponents/dist/NotificationListItem.js\";</code>\n * <br>\n * <code>import \"@ui5/webcomponents/dist/NotificationAction.js\";</code> (optional)\n * @constructor\n * @author SAP SE\n * @alias sap.ui.webc.fiori.NotificationListItem\n * @extends sap.ui.webc.fiori.NotificationListItemBase\n * @tagname ui5-li-notification\n * @appenddocs sap.ui.webc.fiori.NotificationAction\n * @since 1.0.0-rc.8\n * @implements sap.ui.webc.fiori.INotificationListItem, sap.ui.webc.main.IListItem\n * @public\n /\n@customElement({\n\ttag: \"ui5-li-notification\",\n\tlanguageAware: true,\n\tstyles: NotificationListItemCss,\n\ttemplate: NotificationListItemTemplate,\n\tdependencies: [\n\t\tButton,\n\t\tIcon,\n\t\tBusyIndicator,\n\t\tLink,\n\t\tPopover,\n\t],\n})\n\n@event(\"_press\")\nclass NotificationListItem extends NotificationListItemBase {\n\t/\n\t Defines if the <code>titleText</code> and <code>description</code> should wrap,\n\t* they truncate by default.\n\t\n\t <br><br>\n\t* <b>Note:</b> by default the <code>titleText</code> and <code>description</code>,\n\t* and a <code>ShowMore/Less</code> button would be displayed.\n\t* @type {sap.ui.webc.main.types.WrappingType}\n\t* @defaultvalue \"None\"\n\t* @public\n\t* @name sap.ui.webc.fiori.NotificationListItem.prototype.wrappingType\n\t* @since 1.0.0-rc.15\n\t/\n\t@property({ type: WrappingType, defaultValue: WrappingType.None })\n\twrappingType!: `${WrappingType}`;\n\n\t/\n\t Defines the state of the <code>titleText</code> and <code>description</code>,\n\t* if less or more information is displayed.\n\t* @private\n\t/\n\t@property({ type: Boolean })\n\t_showMorePressed!: boolean;\n\n\t/\n\t Defines the visibility of the <code>showMore</code> button.\n\t* @private\n\t/\n\t@property({ type: Boolean })\n\t_showMore!: boolean;\n\n\t/\n\t Defines the avatar, displayed in the <code>ui5-li-notification</code>.\n\t\n\t <br><br>\n\t* <b>Note:</b> Consider using the <code>ui5-avatar</code> to display icons, initials or images.\n\t* <br>\n\t* <b>Note:</b>In order to be complaint with the UX guidlines and for best experience,\n\t* we recommend using avatars with 2rem X 2rem in size (32px X 32px). In case you are using the <code>ui5-avatar</code>\n\t* you can set its <code>size</code> property to <code>XS</code> to get the required size - <code><ui5-avatar size=\"XS\"></ui5-avatar></code>.\n\t\n\t @type {sap.ui.webc.main.IAvatar}\n\t* @slot\n\t* @public\n\t* @name sap.ui.webc.fiori.NotificationListItem.prototype.avatar\n\t/\n\t@slot()\n\tavatar!: Array<HTMLElement>;\n\n\t/\n\t Defines the elements, displayed in the footer of the of the component.\n\t* @type {HTMLElement[]}\n\t* @slot\n\t* @public\n\t* @name sap.ui.webc.fiori.NotificationListItem.prototype.footnotes\n\t/\n\t@slot({ type: HTMLElement, individualSlots: true })\n\tfootnotes!: Array<HTMLElement>;\n\n\t/\n\t Defines the content of the <code>ui5-li-notification</code>,\n\t* usually a description of the notification.\n\t\n\t <br><br>\n\t* <b>Note:</b> Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.\n\t\n\t @type {Node[]}\n\t* @slot description\n\t* @public\n\t* @name sap.ui.webc.fiori.NotificationListItem.prototype.default\n\t/\n\t@slot({ type: Node, \"default\": true })\n\tdescription!: Array<Node>;\n\n\t_titleTextOverflowHeight: number;\n\t_descOverflowHeight: number;\n\t_onResizeBound: ResizeObserverCallback;\n\n\tconstructor() {\n\t\tsuper();\n\n\t\t// the titleText overflow height\n\t\tthis._titleTextOverflowHeight = 0;\n\n\t\t// the description overflow height\n\t\tthis._descOverflowHeight = 0;\n\n\t\t// the resize handler\n\t\tthis._onResizeBound = this.onResize.bind(this);\n\t}\n\n\tonEnterDOM() {\n\t\tResizeHandler.register(this, this._onResizeBound);\n\t}\n\n\tonExitDOM() {\n\t\tResizeHandler.deregister(this, this._onResizeBound);\n\t}\n\n\tget hasDesc() {\n\t\treturn !!this.description.length;\n\t}\n\n\tget hasFootNotes() {\n\t\treturn !!this.footnotes.length;\n\t}\n\n\tget showMoreText() {\n\t\tif (this._showMorePressed) {\n\t\t\treturn NotificationListItem.i18nFioriBundle.getText(NOTIFICATION_LIST_ITEM_SHOW_LESS);\n\t\t}\n\n\t\treturn NotificationListItem.i18nFioriBundle.getText(NOTIFICATION_LIST_ITEM_SHOW_MORE);\n\t}\n\n\tget overflowBtnAccessibleName() {\n\t\treturn NotificationListItem.i18nFioriBundle.getText(NOTIFICATION_LIST_ITEM_OVERLOW_BTN_TITLE);\n\t}\n\n\tget closeBtnAccessibleName() {\n\t\treturn NotificationListItem.i18nFioriBundle.getText(NOTIFICATION_LIST_ITEM_CLOSE_BTN_TITLE);\n\t}\n\n\tget hideShowMore() {\n\t\tif (this.wrappingType === WrappingType.None && this._showMore) {\n\t\t\treturn undefined;\n\t\t}\n\n\t\treturn true;\n\t}\n\n\tget descriptionDOM() {\n\t\treturn this.shadowRoot!.querySelector<HTMLElement>(\".ui5-nli-description\");\n\t}\n\n\tget titleTextDOM() {\n\t\treturn this.shadowRoot!.querySelector<HTMLElement>(\".ui5-nli-title-text\");\n\t}\n\n\tget titleTextHeight() {\n\t\treturn (this.titleTextDOM as HTMLElement).offsetHeight;\n\t}\n\n\tget descriptionHeight() {\n\t\treturn (this.descriptionDOM as HTMLElement).offsetHeight;\n\t}\n\n\tget titleTextOverflows() {\n\t\tconst titleText = this.titleTextDOM;\n\n\t\tif (!titleText) {\n\t\t\treturn false;\n\t\t}\n\n\t\treturn titleText.offsetHeight < titleText.scrollHeight;\n\t}\n\n\tget descriptionOverflows() {\n\t\tconst description = this.descriptionDOM;\n\n\t\tif (!description) {\n\t\t\treturn false;\n\t\t}\n\n\t\treturn description.offsetHeight < description.scrollHeight;\n\t}\n\n\tget footerItems() {\n\t\treturn this.footnotes.map((el, idx, arr) => {\n\t\t\treturn {\n\t\t\t\tslotName: (el as Footnote)._individualSlot,\n\t\t\t\tshowDivider: idx !== arr.length - 1,\n\t\t\t};\n\t\t});\n\t}\n\n\tget ariaLabelledBy() {\n\t\tconst id = this._id;\n\t\tconst ids = [];\n\n\t\tif (this.hasTitleText) {\n\t\t\tids.push(`${id}-title-text`);\n\t\t}\n\t\tif (this.hasDesc) {\n\t\t\tids.push(`${id}-description`);\n\t\t}\n\n\t\tif (this.hasFootNotes) {\n\t\t\tids.push(`${id}-footer`);\n\t\t}\n\n\t\tids.push(`${id}-invisibleText`);\n\n\t\treturn ids.join(\" \");\n\t}\n\n\tget priorityText() {\n\t\tif (this.priority === Priority.High) {\n\t\t\treturn NotificationListItem.i18nFioriBundle.getText(NOTIFICATION_LIST_ITEM_HIGH_PRIORITY_TXT);\n\t\t}\n\n\t\tif (this.priority === Priority.Medium) {\n\t\t\treturn NotificationListItem.i18nFioriBundle.getText(NOTIFICATION_LIST_ITEM_MEDIUM_PRIORITY_TXT);\n\t\t}\n\n\t\tif (this.priority === Priority.Low) {\n\t\t\treturn NotificationListItem.i18nFioriBundle.getText(NOTIFICATION_LIST_ITEM_LOW_PRIORITY_TXT);\n\t\t}\n\n\t\treturn \"\";\n\t}\n\n\tget accInvisibleText() {\n\t\tconst notificationText = NotificationListItem.i18nFioriBundle.getText(NOTIFICATION_LIST_ITEM_TXT);\n\t\tconst readText = this.read ? NotificationListItem.i18nFioriBundle.getText(NOTIFICATION_LIST_ITEM_READ) : NotificationListItem.i18nFioriBundle.getText(NOTIFICATION_LIST_ITEM_UNREAD);\n\t\tconst priorityText = this.priorityText;\n\n\t\treturn `${notificationText} ${readText} ${priorityText}`;\n\t}\n\n\t/\n\t Event handlers\n\t /\n\t_onclick(e: MouseEvent) {\n\t\tthis.fireItemPress(e);\n\t}\n\n\t_onShowMoreClick(e: MouseEvent) {\n\t\te.preventDefault();\n\t\tthis._showMorePressed = !this._showMorePressed;\n\t}\n\n\t_onkeydown(e: KeyboardEvent) {\n\t\tsuper._onkeydown(e);\n\n\t\tif (isEnter(e)) {\n\t\t\tthis.fireItemPress(e);\n\t\t}\n\t}\n\n\t_onkeyup(e: KeyboardEvent) {\n\t\tsuper._onkeyup(e);\n\n\t\tconst space = isSpace(e);\n\n\t\tif (space && getEventMark(e) === \"link\") {\n\t\t\tthis._onShowMoreClick(e as unknown as MouseEvent);\n\t\t\treturn;\n\t\t}\n\n\t\tif (space) {\n\t\t\tthis.fireItemPress(e);\n\t\t}\n\t}\n\n\t/\n\t Private\n\t */\n\tfireItemPress(e: Event) {\n\t\tif (getEventMark(e) === \"button\" \|\| getEventMark(e) === \"link\") {\n\t\t\treturn;\n\t\t}\n\n\t\tthis.fireEvent<NotificationListItemPressEventDetail>(\"_press\", { item: this });\n\t}\n\n\tonResize() {\n\t\tif (this.wrappingType === WrappingType.Normal) {\n\t\t\tthis._showMore = false;\n\t\t\treturn;\n\t\t}\n\n\t\tconst titleTextWouldOverflow = this.titleTextHeight > this._titleTextOverflowHeight;\n\t\tconst descWouldOverflow = this.hasDesc && this.descriptionHeight > this._descOverflowHeight;\n\t\tconst overflows = titleTextWouldOverflow \|\| descWouldOverflow;\n\n\t\tif (this._showMorePressed && overflows) {\n\t\t\tthis._showMore = true;\n\t\t\treturn;\n\t\t}\n\n\t\tif (this.titleTextOverflows \|\| this.descriptionOverflows) {\n\t\t\tthis._titleTextOverflowHeight = this.titleTextHeight;\n\t\t\tthis._descOverflowHeight = this.hasDesc ? this.descriptionHeight : 0;\n\t\t\tthis._showMore = true;\n\t\t\treturn;\n\t\t}\n\n\t\tthis._showMore = false;\n\t}\n}\n\nNotificationListItem.define();\n\nexport default NotificationListItem;\nexport type {\n\tNotificationListItemPressEventDetail,\n\tNotificationListItemCloseEventDetail,\n};\n"]}