npm - @ui5/webcomponents-fiori - Versions diffs - 2.26.0-rc.0 → 2.26.0 - Mend

@ui5/webcomponents-fiori 2.26.0-rc.0 → 2.26.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 (112) hide show

package/dist/SearchField.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SearchField.js","sourceRoot":"","sources":["../src/SearchField.ts"],"names":[],"mappings":"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","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport type { Slot } from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot-strict.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event-strict.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport i18n from \"@ui5/webcomponents-base/dist/decorators/i18n.js\";\nimport SearchFieldTemplate from \"./SearchFieldTemplate.js\";\nimport SearchFieldCss from \"./generated/themes/SearchField.css.js\";\nimport type Button from \"@ui5/webcomponents/dist/Button.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport type { IOption, SelectChangeEventDetail } from \"@ui5/webcomponents/dist/Select.js\";\n\nimport {\n\tisEnter,\n} from \"@ui5/webcomponents-base/dist/Keys.js\";\nimport jsxRenderer from \"@ui5/webcomponents-base/dist/renderer/JsxRenderer.js\";\n\nimport {\n\tSEARCH_FIELD_SCOPE_SELECT_LABEL,\n\tSEARCH_FIELD_CLEAR_ICON,\n\tSEARCH_FIELD_SEARCH_ICON,\n\tSEARCH_FIELD_LABEL,\n} from \"./generated/i18n/i18n-defaults.js\";\n\n/*\n Interface for components that may be slotted inside a `ui5-search`\n * @public\n /\ninterface ISearchScope extends UI5Element {\n\ttext?: string,\n\tvalue?: string,\n\tstableDomRef: string,\n}\n\ntype SearchFieldScopeSelectionChangeDetails = {\n\tscope: ISearchScope \| undefined;\n}\n\n/\n @class\n \n ### Overview\n \n A `ui5-search-field` is an input field, used for user search.\n \n The `ui5-search-field` consists of several elements parts:\n * - Scope - displays a select in the beggining of the component, used for filtering results by their scope.\n * - Input field - for user input value\n * - Clear button - gives the possibility for deleting the entered value\n * - Search button - a primary button for performing search, when the user has entered a search term\n \n ### ES6 Module Import\n \n `import \"@ui5/webcomponents-fiori/dist/SearchField.js\";`\n \n @constructor\n * @extends UI5Element\n * @private\n /\n@customElement({\n\ttag: \"ui5-search-field\",\n\tlanguageAware: true,\n\trenderer: jsxRenderer,\n\ttemplate: SearchFieldTemplate,\n\tstyles: [\n\t\tSearchFieldCss,\n\t],\n})\n\n/\n Fired when typing in input or clear icon is pressed.\n \n @public\n /\n@event(\"input\", {\n\tbubbles: true,\n})\n\n/\n Fired when the scope has changed.\n * @public\n * @param {HTMLElement} scope The newly selected scope\n /\n@event(\"scope-change\", {\n\tbubbles: true,\n})\n\n/\n Fired when the user has triggered search with Enter key or Search Button press.\n * @public\n /\n@event(\"search\", {\n\tbubbles: true,\n\tcancelable: true,\n})\n\nclass SearchField extends UI5Element {\n\teventDetails!: {\n\t\tsearch: object,\n\t\tinput: void,\n\t\t\"scope-change\": SearchFieldScopeSelectionChangeDetails,\n\t}\n\n\t/\n\t Indicates whether a loading indicator should be shown in the input field.\n\t * @default false\n\t * @since 2.19.0\n\t * @public\n\t /\n\t@property({ type: Boolean })\n\tfieldLoading = false\n\n\t/\n\t Defines whether the clear icon of the search will be shown.\n\t * @default false\n\t * @public\n\t /\n\t@property({ type: Boolean })\n\tshowClearIcon = false;\n\n\t/\n\t Defines whether the component is collapsed.\n\t \n\t @default false\n\t * @private\n\t /\n\t@property({ type: Boolean })\n\tcollapsed = false;\n\n\t/\n\t Defines the value of the component.\n\t \n\t Note: The property is updated upon typing.\n\t * @default \"\"\n\t * @public\n\t /\n\t@property()\n\tvalue = \"\";\n\n\t/\n\t Defines a short hint intended to aid the user with data entry when the\n\t * component has no value.\n\t * @default undefined\n\t * @public\n\t /\n\t@property()\n\tplaceholder?: string;\n\n\t/\n\t Defines the accessible ARIA name of the component.\n\t * @public\n\t * @default undefined\n\t /\n\t@property()\n\taccessibleName?: string;\n\n\t/\n\t Defines the accessible ARIA description of the field.\n\t * @public\n\t * @default undefined\n\t /\n\t@property()\n\taccessibleDescription?: string;\n\n\t/\n\t Defines the value of the component:\n\t \n\t Applications are responsible for setting the correct scope value.\n\t \n\t Note: If the given value does not match any existing scopes,\n\t * no scope will be selected and the SearchField scope component will be displayed as empty.\n\t * @public\n\t * @default \"\"\n\t * @since 2.18.0\n\t /\n\t@property()\n\tscopeValue?: string;\n\n\t/\n\t Defines the component scope options.\n\t * @public\n\t /\n\t@slot({ type: HTMLElement, individualSlots: true, invalidateOnChildChange: true })\n\tscopes!: Slot<ISearchScope>;\n\n\t/\n\t Defines the filter button slot, used to display an additional filtering button.\n\t * This slot is intended for passing a `ui5-button` with a filter icon to provide extended filtering options.\n\t \n\t Note: Scope button and Filter button are mutually exclusive.\n\t * @public\n\t * @since 2.11.0\n\t /\n\t@slot()\n\tfilterButton!: Slot<Button>;\n\n\t/\n\t @private\n\t /\n\t@property({ type: Boolean })\n\tfocusedInnerInput = false;\n\n\t/\n\t @private\n\t */\n\t@property({ type: Boolean })\n\t_effectiveShowClearIcon = false;\n\n\t@i18n(\"@ui5/webcomponents-fiori\")\n\tstatic i18nBundle: I18nBundle;\n\n\tonBeforeRendering() {\n\t\tthis._effectiveShowClearIcon = (this.showClearIcon && !!this.value);\n\t}\n\n\t_onkeydown(e:KeyboardEvent) {\n\t\tif (isEnter(e)) {\n\t\t\treturn this._handleEnter();\n\t\t}\n\t}\n\n\t_onfocusin() {\n\t\tthis.focusedInnerInput = true;\n\t}\n\n\t_onfocusout() {\n\t\tthis.focusedInnerInput = false;\n\t}\n\n\t_onFocusOutSearch(e: FocusEvent) {} // eslint-disable-line\n\n\t_handleEnter() {\n\t\tif (this.value.length) {\n\t\t\tthis._handleSearchEvent();\n\t\t}\n\t}\n\n\t_handleInnerClick() {} // eslint-disable-line\n\n\t_handleSearchIconPress() {\n\t\tthis._handleSearchEvent();\n\n\t\tsetTimeout(() => {\n\t\t\tthis.focus();\n\t\t}, 0);\n\t}\n\n\t_handleSearchEvent() {\n\t\tthis.fireDecoratorEvent(\"search\");\n\t}\n\n\t_handleInput(e: InputEvent) {\n\t\tthis.value = (e.target as HTMLInputElement).value;\n\n\t\tthis.fireDecoratorEvent(\"input\");\n\t}\n\n\t_handleClear() {\n\t\tthis.value = \"\";\n\t\tthis.fireDecoratorEvent(\"input\");\n\n\t\tthis.focus();\n\t}\n\n\t_handleScopeChange(e: CustomEvent<SelectChangeEventDetail>) {\n\t\tconst item = e.detail.selectedOption as IOption & { scopeOption: ISearchScope };\n\n\t\t// Set the scopeValue property if the selected scope has a value defined\n\t\tif (item.value) {\n\t\t\tthis.scopeValue = item.value;\n\t\t}\n\n\t\tthis.fireDecoratorEvent(\"scope-change\", {\n\t\t\tscope: item.scopeOption,\n\t\t});\n\t}\n\n\tget _isSearchIcon() {\n\t\treturn this.value.length && this.focusedInnerInput;\n\t}\n\n\tget _searchButtonAccessibilityAttributes() {\n\t\treturn {\n\t\t\texpanded: !this.collapsed,\n\t\t};\n\t}\n\n\tget _translations() {\n\t\treturn {\n\t\t\tscope: SearchField.i18nBundle.getText(SEARCH_FIELD_SCOPE_SELECT_LABEL),\n\t\t\tsearchIcon: SearchField.i18nBundle.getText(SEARCH_FIELD_SEARCH_ICON),\n\t\t\tclearIcon: SearchField.i18nBundle.getText(SEARCH_FIELD_CLEAR_ICON),\n\t\t\tsearchFieldAriaLabel: SearchField.i18nBundle.getText(SEARCH_FIELD_LABEL),\n\t\t};\n\t}\n\n\tget _effectiveIconTooltip() {\n\t\treturn this._translations.searchIcon;\n\t}\n\n\tcaptureRef(ref: HTMLElement & { scopeOption?: UI5Element} \| null) {\n\t\tif (ref) {\n\t\t\tref.scopeOption = this;\n\t\t}\n\t}\n}\n\nSearchField.define();\n\nexport default SearchField;\n\nexport type { ISearchScope, SearchFieldScopeSelectionChangeDetails };\n"]}
1	+ {"version":3,"file":"SearchField.js","sourceRoot":"","sources":["../src/SearchField.ts"],"names":[],"mappings":"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","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport type { Slot } from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot-strict.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event-strict.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport i18n from \"@ui5/webcomponents-base/dist/decorators/i18n.js\";\nimport SearchFieldTemplate from \"./SearchFieldTemplate.js\";\nimport SearchFieldCss from \"./generated/themes/SearchField.css.js\";\nimport type Button from \"@ui5/webcomponents/dist/Button.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport type { IOption, SelectChangeEventDetail } from \"@ui5/webcomponents/dist/Select.js\";\nimport { isPhone } from \"@ui5/webcomponents-base/dist/Device.js\";\nimport type { ListItemClickEventDetail } from \"@ui5/webcomponents/dist/List.js\";\n\nimport {\n\tisEnter,\n} from \"@ui5/webcomponents-base/dist/Keys.js\";\nimport jsxRenderer from \"@ui5/webcomponents-base/dist/renderer/JsxRenderer.js\";\n\nimport {\n\tSEARCH_FIELD_SCOPE_SELECT_LABEL,\n\tSEARCH_FIELD_CLEAR_ICON,\n\tSEARCH_FIELD_SEARCH_ICON,\n\tSEARCH_FIELD_LABEL,\n\tSEARCH_FIELD_PLACEHOLDER_WITH_SCOPE,\n} from \"./generated/i18n/i18n-defaults.js\";\n\nconst SCREEN_WIDTH_BREAKPOINT = 450;\n\n/*\n Interface for components that may be slotted inside a `ui5-search`\n * @public\n /\ninterface ISearchScope extends UI5Element {\n\ttext?: string,\n\tvalue?: string,\n\tstableDomRef: string,\n}\n\ntype SearchFieldScopeSelectionChangeDetails = {\n\tscope: ISearchScope \| undefined;\n}\n\n/\n @class\n \n ### Overview\n \n A `ui5-search-field` is an input field, used for user search.\n \n The `ui5-search-field` consists of several elements parts:\n * - Scope - displays a select in the beggining of the component, used for filtering results by their scope.\n * - Input field - for user input value\n * - Clear button - gives the possibility for deleting the entered value\n * - Search button - a primary button for performing search, when the user has entered a search term\n \n ### ES6 Module Import\n \n `import \"@ui5/webcomponents-fiori/dist/SearchField.js\";`\n \n @constructor\n * @extends UI5Element\n * @private\n /\n@customElement({\n\ttag: \"ui5-search-field\",\n\tlanguageAware: true,\n\trenderer: jsxRenderer,\n\ttemplate: SearchFieldTemplate,\n\tstyles: [\n\t\tSearchFieldCss,\n\t],\n})\n\n/\n Fired when typing in input or clear icon is pressed.\n \n @public\n /\n@event(\"input\", {\n\tbubbles: true,\n})\n\n/\n Fired when the scope has changed.\n * @public\n * @param {HTMLElement} scope The newly selected scope\n /\n@event(\"scope-change\", {\n\tbubbles: true,\n})\n\n/\n Fired when the user has triggered search with Enter key or Search Button press.\n * @public\n /\n@event(\"search\", {\n\tbubbles: true,\n\tcancelable: true,\n})\n\nclass SearchField extends UI5Element {\n\teventDetails!: {\n\t\tsearch: object,\n\t\tinput: void,\n\t\t\"scope-change\": SearchFieldScopeSelectionChangeDetails,\n\t}\n\n\t/\n\t Indicates whether a loading indicator should be shown in the input field.\n\t * @default false\n\t * @since 2.19.0\n\t * @public\n\t /\n\t@property({ type: Boolean })\n\tfieldLoading = false\n\n\t/\n\t Defines whether the clear icon of the search will be shown.\n\t * @default false\n\t * @public\n\t /\n\t@property({ type: Boolean })\n\tshowClearIcon = false;\n\n\t/\n\t Defines whether the component is collapsed.\n\t \n\t @default false\n\t * @private\n\t /\n\t@property({ type: Boolean })\n\tcollapsed = false;\n\n\t/\n\t Defines the value of the component.\n\t \n\t Note: The property is updated upon typing.\n\t * @default \"\"\n\t * @public\n\t /\n\t@property()\n\tvalue = \"\";\n\n\t/\n\t Defines a short hint intended to aid the user with data entry when the\n\t * component has no value.\n\t \n\t Note: When `scopes` are defined and no custom placeholder is provided,\n\t * the placeholder automatically displays \"Search in: \\{selected scope name\\}\".\n\t * Setting a custom placeholder will override this automatic behavior.\n\t \n\t @default undefined\n\t * @public\n\t /\n\t@property()\n\tplaceholder?: string;\n\n\t/\n\t Defines the accessible ARIA name of the component.\n\t * @public\n\t * @default undefined\n\t /\n\t@property()\n\taccessibleName?: string;\n\n\t/\n\t Defines the accessible ARIA description of the field.\n\t * @public\n\t * @default undefined\n\t /\n\t@property()\n\taccessibleDescription?: string;\n\n\t/\n\t Defines the value of the component:\n\t \n\t Applications are responsible for setting the correct scope value.\n\t \n\t Note: If the given value does not match any existing scopes,\n\t * no scope will be selected and the SearchField scope component will be displayed as empty.\n\t * @public\n\t * @default \"\"\n\t * @since 2.18.0\n\t /\n\t@property()\n\tscopeValue?: string;\n\n\t/\n\t Defines the component scope options.\n\t * @public\n\t /\n\t@slot({ type: HTMLElement, individualSlots: true, invalidateOnChildChange: true })\n\tscopes!: Slot<ISearchScope>;\n\n\t/\n\t Defines the filter button slot, used to display an additional filtering button.\n\t * This slot is intended for passing a `ui5-button` with a filter icon to provide extended filtering options.\n\t \n\t Note: Scope button and Filter button are mutually exclusive.\n\t * @public\n\t * @since 2.11.0\n\t /\n\t@slot()\n\tfilterButton!: Slot<Button>;\n\n\t/\n\t @private\n\t /\n\t@property({ type: Boolean })\n\tfocusedInnerInput = false;\n\n\t/\n\t @private\n\t /\n\t@property({ type: Boolean })\n\t_effectiveShowClearIcon = false;\n\n\t/\n\t Indicates whether the component renders on a small screen (mobile).\n\t * @private\n\t /\n\t@property({ type: Boolean })\n\t_isMobileView = false;\n\n\t/\n\t Indicates whether the scope selection popover is open on mobile.\n\t * @private\n\t */\n\t@property({ type: Boolean })\n\t_scopePopoverOpen = false;\n\n\t_scopeIconButton?: HTMLElement;\n\t_resizeHandler?: () => void;\n\n\t@i18n(\"@ui5/webcomponents-fiori\")\n\tstatic i18nBundle: I18nBundle;\n\n\tonEnterDOM() {\n\t\tthis._resizeHandler = this._handleResize.bind(this);\n\t\twindow.addEventListener(\"resize\", this._resizeHandler);\n\t\tthis._isMobileView = this._isSmallScreen();\n\t}\n\n\tonExitDOM() {\n\t\tif (this._resizeHandler) {\n\t\t\twindow.removeEventListener(\"resize\", this._resizeHandler);\n\t\t}\n\t}\n\n\tonBeforeRendering() {\n\t\tthis._effectiveShowClearIcon = (this.showClearIcon && !!this.value);\n\t}\n\n\tprivate _isSmallScreen(): boolean {\n\t\treturn isPhone() \|\| window.innerWidth < SCREEN_WIDTH_BREAKPOINT;\n\t}\n\n\tprivate _handleResize() {\n\t\tconst newMobileView = this._isSmallScreen();\n\t\tif (this._isMobileView !== newMobileView) {\n\t\t\tthis._isMobileView = newMobileView;\n\t\t\t// Close popover when switching modes to prevent state issues\n\t\t\tif (this._scopePopoverOpen) {\n\t\t\t\tthis._scopePopoverOpen = false;\n\t\t\t}\n\t\t}\n\t}\n\n\t_onkeydown(e:KeyboardEvent) {\n\t\tif (isEnter(e)) {\n\t\t\treturn this._handleEnter();\n\t\t}\n\t}\n\n\t_onfocusin() {\n\t\tthis.focusedInnerInput = true;\n\t}\n\n\t_onfocusout() {\n\t\tthis.focusedInnerInput = false;\n\t}\n\n\t_onFocusOutSearch(e: FocusEvent) {} // eslint-disable-line\n\n\t_handleEnter() {\n\t\tif (this.value.length) {\n\t\t\tthis._handleSearchEvent();\n\t\t}\n\t}\n\n\t_handleInnerClick() {} // eslint-disable-line\n\n\t_handleSearchIconPress() {\n\t\tthis._handleSearchEvent();\n\n\t\tsetTimeout(() => {\n\t\t\tthis.focus();\n\t\t}, 0);\n\t}\n\n\t_handleSearchEvent() {\n\t\tthis.fireDecoratorEvent(\"search\");\n\t}\n\n\t_handleInput(e: InputEvent) {\n\t\tthis.value = (e.target as HTMLInputElement).value;\n\n\t\tthis.fireDecoratorEvent(\"input\");\n\t}\n\n\t_handleClear() {\n\t\tthis.value = \"\";\n\t\tthis.fireDecoratorEvent(\"input\");\n\n\t\tthis.focus();\n\t}\n\n\t_handleScopeChange(e: CustomEvent<SelectChangeEventDetail>) {\n\t\tconst item = e.detail.selectedOption as IOption & { scopeOption: ISearchScope };\n\n\t\t// Set the scopeValue property if the selected scope has a value defined\n\t\tif (item.value) {\n\t\t\tthis.scopeValue = item.value;\n\t\t}\n\n\t\tthis.fireDecoratorEvent(\"scope-change\", {\n\t\t\tscope: item.scopeOption,\n\t\t});\n\t}\n\n\t_handleScopeIconPress() {\n\t\tif (!this.scopes?.length) {\n\t\t\treturn;\n\t\t}\n\t\tthis._scopePopoverOpen = !this._scopePopoverOpen;\n\t}\n\n\t_handleScopePopoverClose() {\n\t\tthis._scopePopoverOpen = false;\n\t}\n\n\t_handleScopeItemClick(e: CustomEvent<ListItemClickEventDetail>) {\n\t\tconst listItem = e.detail.item;\n\t\tif (!listItem) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst scopeValue = listItem.getAttribute(\"data-scope-value\");\n\t\tconst scopeItem = this.scopes.find((scope: ISearchScope) => scope.value === scopeValue);\n\n\t\tif (scopeItem) {\n\t\t\tthis.scopeValue = scopeItem.value;\n\t\t\tthis.fireDecoratorEvent(\"scope-change\", {\n\t\t\t\tscope: scopeItem,\n\t\t\t});\n\t\t}\n\n\t\tthis._scopePopoverOpen = false;\n\t}\n\n\tget _isSearchIcon() {\n\t\treturn this.value.length && this.focusedInnerInput;\n\t}\n\n\tget _searchButtonAccessibilityAttributes() {\n\t\treturn {\n\t\t\texpanded: !this.collapsed,\n\t\t};\n\t}\n\n\tget _translations() {\n\t\treturn {\n\t\t\tscope: SearchField.i18nBundle.getText(SEARCH_FIELD_SCOPE_SELECT_LABEL),\n\t\t\tsearchIcon: SearchField.i18nBundle.getText(SEARCH_FIELD_SEARCH_ICON),\n\t\t\tclearIcon: SearchField.i18nBundle.getText(SEARCH_FIELD_CLEAR_ICON),\n\t\t\tsearchFieldAriaLabel: SearchField.i18nBundle.getText(SEARCH_FIELD_LABEL),\n\t\t\tplaceholderWithScope: SearchField.i18nBundle.getText(SEARCH_FIELD_PLACEHOLDER_WITH_SCOPE),\n\t\t};\n\t}\n\n\tget _effectivePlaceholder(): string \| undefined {\n\t\t// If scopes exist and no user-defined placeholder, show \"Search in: {SCOPE}\"\n\t\tif (this.scopes?.length && !this.placeholder && this.scopeValue) {\n\t\t\tconst selectedScope = this.scopes.find((scope: ISearchScope) => scope.value === this.scopeValue);\n\t\t\tif (selectedScope?.text) {\n\t\t\t\treturn String(SearchField.i18nBundle.getText(SEARCH_FIELD_PLACEHOLDER_WITH_SCOPE, String(selectedScope.text)));\n\t\t\t}\n\t\t}\n\t\treturn this.placeholder;\n\t}\n\n\tget _scopeIconAccessibleName(): string {\n\t\tconst selectedScope = this.scopes.find((scope: ISearchScope) => scope.value === this.scopeValue);\n\n\t\treturn selectedScope\n\t\t\t? `${this._translations.scope}, ${selectedScope.text}`\n\t\t\t: this._translations.scope;\n\t}\n\n\tget _effectiveIconTooltip() {\n\t\treturn this._translations.searchIcon;\n\t}\n\n\tcaptureRef(ref: HTMLElement & { scopeOption?: UI5Element} \| null) {\n\t\tif (ref) {\n\t\t\tref.scopeOption = this;\n\t\t}\n\t}\n\n\tcaptureScopeIconRef(ref: HTMLElement \| null) {\n\t\tif (ref) {\n\t\t\tthis._scopeIconButton = ref;\n\t\t}\n\t}\n}\n\nSearchField.define();\n\nexport default SearchField;\n\nexport type { ISearchScope, SearchFieldScopeSelectionChangeDetails };\n"]}

package/dist/SearchFieldScopePopoverTemplate.d.ts ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import type SearchField from "./SearchField.js";
2	+ export default function SearchFieldScopePopoverTemplate(this: SearchField): import("@ui5/webcomponents-base/jsx-runtime").JSX.Element;

package/dist/SearchFieldScopePopoverTemplate.js ADDED Viewed

@@ -0,0 +1,11 @@
+import { jsx as _jsx } from "@ui5/webcomponents-base/jsx-runtime";
+import ResponsivePopover from "@ui5/webcomponents/dist/ResponsivePopover.js";
+import List from "@ui5/webcomponents/dist/List.js";
+import ListItemStandard from "@ui5/webcomponents/dist/ListItemStandard.js";
+import ListSeparator from "@ui5/webcomponents/dist/types/ListSeparator.js";
+import PopoverPlacement from "@ui5/webcomponents/dist/types/PopoverPlacement.js";
+import PopoverHorizontalAlign from "@ui5/webcomponents/dist/types/PopoverHorizontalAlign.js";
+export default function SearchFieldScopePopoverTemplate() {
+    return (_jsx(ResponsivePopover, { id: `${this._id}-scope-popover`, class: "ui5-search-field-scope-popover", hideArrow: true, modal: false, placement: PopoverPlacement.Bottom, horizontalAlign: PopoverHorizontalAlign.Start, open: this._scopePopoverOpen, opener: this._scopeIconButton || this, onClose: this._handleScopePopoverClose, children: _jsx(List, { separators: ListSeparator.None, onItemClick: this._handleScopeItemClick.bind(this), children: this.scopes.map(scopeOption => (_jsx(ListItemStandard, { "data-scope-value": scopeOption.value, selected: scopeOption.value === this.scopeValue, children: scopeOption.text }))) }) }));
+}
+//# sourceMappingURL=SearchFieldScopePopoverTemplate.js.map

package/dist/SearchFieldScopePopoverTemplate.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"SearchFieldScopePopoverTemplate.js","sourceRoot":"","sources":["../src/SearchFieldScopePopoverTemplate.tsx"],"names":[],"mappings":";AAAA,OAAO,iBAAiB,MAAM,8CAA8C,CAAC;AAC7E,OAAO,IAAI,MAAM,iCAAiC,CAAC;AACnD,OAAO,gBAAgB,MAAM,6CAA6C,CAAC;AAC3E,OAAO,aAAa,MAAM,gDAAgD,CAAC;AAC3E,OAAO,gBAAgB,MAAM,mDAAmD,CAAC;AACjF,OAAO,sBAAsB,MAAM,yDAAyD,CAAC;AAG7F,MAAM,CAAC,OAAO,UAAU,+BAA+B;IACtD,OAAO,CACN,KAAC,iBAAiB,IACjB,EAAE,EAAE,GAAG,IAAI,CAAC,GAAG,gBAAgB,EAC/B,KAAK,EAAC,gCAAgC,EACtC,SAAS,EAAE,IAAI,EACf,KAAK,EAAE,KAAK,EACZ,SAAS,EAAE,gBAAgB,CAAC,MAAM,EAClC,eAAe,EAAE,sBAAsB,CAAC,KAAK,EAC7C,IAAI,EAAE,IAAI,CAAC,iBAAiB,EAC5B,MAAM,EAAE,IAAI,CAAC,gBAAgB,IAAI,IAAI,EACrC,OAAO,EAAE,IAAI,CAAC,wBAAwB,YAEtC,KAAC,IAAI,IACJ,UAAU,EAAE,aAAa,CAAC,IAAI,EAC9B,WAAW,EAAE,IAAI,CAAC,qBAAqB,CAAC,IAAI,CAAC,IAAI,CAAC,YAEjD,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,WAAW,CAAC,EAAE,CAAC,CAC/B,KAAC,gBAAgB,wBACE,WAAW,CAAC,KAAK,EACnC,QAAQ,EAAE,WAAW,CAAC,KAAK,KAAK,IAAI,CAAC,UAAU,YAE9C,WAAW,CAAC,IAAI,GACC,CACnB,CAAC,GACI,GACY,CACpB,CAAC;AACH,CAAC","sourcesContent":["import ResponsivePopover from \"@ui5/webcomponents/dist/ResponsivePopover.js\";\nimport List from \"@ui5/webcomponents/dist/List.js\";\nimport ListItemStandard from \"@ui5/webcomponents/dist/ListItemStandard.js\";\nimport ListSeparator from \"@ui5/webcomponents/dist/types/ListSeparator.js\";\nimport PopoverPlacement from \"@ui5/webcomponents/dist/types/PopoverPlacement.js\";\nimport PopoverHorizontalAlign from \"@ui5/webcomponents/dist/types/PopoverHorizontalAlign.js\";\nimport type SearchField from \"./SearchField.js\";\n\nexport default function SearchFieldScopePopoverTemplate(this: SearchField) {\n\treturn (\n\t\t<ResponsivePopover\n\t\t\tid={`${this._id}-scope-popover`}\n\t\t\tclass=\"ui5-search-field-scope-popover\"\n\t\t\thideArrow={true}\n\t\t\tmodal={false}\n\t\t\tplacement={PopoverPlacement.Bottom}\n\t\t\thorizontalAlign={PopoverHorizontalAlign.Start}\n\t\t\topen={this._scopePopoverOpen}\n\t\t\topener={this._scopeIconButton || this}\n\t\t\tonClose={this._handleScopePopoverClose}\n\t\t>\n\t\t\t<List\n\t\t\t\tseparators={ListSeparator.None}\n\t\t\t\tonItemClick={this._handleScopeItemClick.bind(this)}\n\t\t\t>\n\t\t\t\t{this.scopes.map(scopeOption => (\n\t\t\t\t\t<ListItemStandard\n\t\t\t\t\t\tdata-scope-value={scopeOption.value}\n\t\t\t\t\t\tselected={scopeOption.value === this.scopeValue}\n\t\t\t\t\t>\n\t\t\t\t\t\t{scopeOption.text}\n\t\t\t\t\t</ListItemStandard>\n\t\t\t\t))}\n\t\t\t</List>\n\t\t</ResponsivePopover>\n\t);\n}\n"]}

package/dist/SearchFieldTemplate.js CHANGED Viewed

@@ -5,13 +5,22 @@ import Option from "@ui5/webcomponents/dist/Option.js";
 import Select from "@ui5/webcomponents/dist/Select.js";
 import decline from "@ui5/webcomponents-icons/dist/decline.js";
 import search from "@ui5/webcomponents-icons/dist/search.js";
+import slimArrowDown from "@ui5/webcomponents-icons/dist/slim-arrow-down.js";
 import ButtonDesign from "@ui5/webcomponents/dist/types/ButtonDesign.js";
 import BusyIndicator from "@ui5/webcomponents/dist/BusyIndicator.js";
+import SearchFieldScopePopoverTemplate from "./SearchFieldScopePopoverTemplate.js";
 export default function SearchFieldTemplate(options) {
-    return (!options?.forceExpanded && this.collapsed ? (_jsx(Button, { class: "ui5-shell-search-field-button", icon: search, design: ButtonDesign.Transparent, "data-sap-focus-ref": true, loading: this.fieldLoading, onClick: this._handleSearchIconPress, tooltip: this._effectiveIconTooltip, accessibleName: this._effectiveIconTooltip, accessibilityAttributes: this._searchButtonAccessibilityAttributes })) : (_jsx(BusyIndicator, { class: "ui5-search-field-busy-indicator", active: this.fieldLoading, children: _jsx("div", { class: "ui5-search-field-root", role: "search", onFocusOut: this._onFocusOutSearch, children: _jsxs("div", { class: "ui5-search-field-content", children: [this.scopes?.length ? (_jsxs(_Fragment, { children: [_jsx(Select, { onChange: this._handleScopeChange, class: "ui5-search-field-select", accessibleName: this._translations.scope, tooltip: this._translations.scope, value: this.scopeValue, children: this.scopes.map(scopeOption => (_jsx(Option, { value: scopeOption.value, "data-ui5-stable": scopeOption.stableDomRef, ref: this.captureRef.bind(scopeOption), children: scopeOption.text }))) }), _jsx("div", { class: "ui5-search-field-separator" })] })) : this.filterButton?.length ? (_jsxs(_Fragment, { children: [_jsx("div", { class: "ui5-filter-wrapper", style: "display: contents", children: _jsx("slot", { name: "filterButton" }) }), _jsx("div", { class: "ui5-search-field-separator" })] })) : null, _jsx("input", { class: "ui5-search-field-inner-input", role: "searchbox", "aria-description": this.accessibleDescription, "aria-label": this.accessibleName || this._translations.searchFieldAriaLabel, "aria-autocomplete": "both", "aria-controls": "ui5-search-list", value: this.value, placeholder: this.placeholder, "data-sap-focus-ref": true, onInput: this._handleInput, onFocusIn: this._onfocusin, onFocusOut: this._onfocusout, onKeyDown: this._onkeydown, onClick: this._handleInnerClick }), this._effectiveShowClearIcon &&
-                        _jsx(Icon, { class: "ui5-shell-search-field-icon", name: decline, showTooltip: true, accessibleName: this._translations.clearIcon, onClick: this._handleClear }), _jsx(Icon, { class: {
-                            "ui5-shell-search-field-icon": true,
-                            "ui5-shell-search-field-search-icon": this._isSearchIcon,
-                        }, name: search, showTooltip: true, accessibleName: this._effectiveIconTooltip, onClick: this._handleSearchIconPress })] }) }) })));
+    return (!options?.forceExpanded && this.collapsed ? (_jsx(Button, { class: "ui5-shell-search-field-button", icon: search, design: ButtonDesign.Transparent, "data-sap-focus-ref": true, loading: this.fieldLoading, onClick: this._handleSearchIconPress, tooltip: this._effectiveIconTooltip, accessibleName: this._effectiveIconTooltip, accessibilityAttributes: this._searchButtonAccessibilityAttributes })) : (_jsxs(BusyIndicator, { class: "ui5-search-field-busy-indicator", active: this.fieldLoading, children: [_jsx("div", { class: "ui5-search-field-root", role: "search", onFocusOut: this._onFocusOutSearch, children: _jsxs("div", { class: "ui5-search-field-content", children: [this.scopes?.length ? (_jsx(_Fragment, { children: !this._isMobileView ? (
+                            // Desktop/Tablet: Show full Select component
+                            _jsxs(_Fragment, { children: [_jsx(Select, { onChange: this._handleScopeChange, class: "ui5-search-field-select", accessibleName: this._translations.scope, tooltip: this._translations.scope, value: this.scopeValue, exportparts: "label:scope-label", children: this.scopes.map(scopeOption => (_jsx(Option, { value: scopeOption.value, "data-ui5-stable": scopeOption.stableDomRef, ref: this.captureRef.bind(scopeOption), children: scopeOption.text }))) }), _jsx("div", { class: "ui5-search-field-separator" })] })) : (
+                            // Mobile/Phone: Show icon button only
+                            _jsxs(_Fragment, { children: [_jsx(Button, { ref: this.captureScopeIconRef.bind(this), class: "ui5-search-field-scope-button", icon: slimArrowDown, design: ButtonDesign.Transparent, onClick: this._handleScopeIconPress, tooltip: this._scopeIconAccessibleName, accessibleName: this._scopeIconAccessibleName, accessibilityAttributes: {
+                                            hasPopup: "dialog",
+                                            expanded: this._scopePopoverOpen,
+                                        } }), _jsx("div", { class: "ui5-search-field-separator" })] })) })) : this.filterButton?.length ? (_jsxs(_Fragment, { children: [_jsx("div", { class: "ui5-filter-wrapper", style: "display: contents", children: _jsx("slot", { name: "filterButton" }) }), _jsx("div", { class: "ui5-search-field-separator" })] })) : null, _jsx("input", { class: "ui5-search-field-inner-input", role: "searchbox", "aria-description": this.accessibleDescription, "aria-label": this.accessibleName || this._translations.searchFieldAriaLabel, "aria-autocomplete": "both", "aria-controls": "ui5-search-list", value: this.value, placeholder: this._effectivePlaceholder, "data-sap-focus-ref": true, onInput: this._handleInput, onFocusIn: this._onfocusin, onFocusOut: this._onfocusout, onKeyDown: this._onkeydown, onClick: this._handleInnerClick }), this._effectiveShowClearIcon &&
+                            _jsx(Icon, { class: "ui5-shell-search-field-icon", name: decline, showTooltip: true, accessibleName: this._translations.clearIcon, onClick: this._handleClear }), _jsx(Icon, { class: {
+                                "ui5-shell-search-field-icon": true,
+                                "ui5-shell-search-field-search-icon": this._isSearchIcon,
+                            }, name: search, showTooltip: true, accessibleName: this._effectiveIconTooltip, onClick: this._handleSearchIconPress })] }) }), SearchFieldScopePopoverTemplate.call(this)] })));
 }
 //# sourceMappingURL=SearchFieldTemplate.js.map

package/dist/SearchFieldTemplate.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SearchFieldTemplate.js","sourceRoot":"","sources":["../src/SearchFieldTemplate.tsx"],"names":[],"mappings":";AAAA,OAAO,MAAM,MAAM,mCAAmC,CAAC;AACvD,OAAO,IAAI,MAAM,iCAAiC,CAAC;AACnD,OAAO,MAAM,MAAM,mCAAmC,CAAC;AACvD,OAAO,MAAM,MAAM,mCAAmC,CAAC;AAEvD,OAAO,OAAO,MAAM,0CAA0C,CAAC;AAC/D,OAAO,MAAM,MAAM,yCAAyC,CAAC;AAC7D,OAAO,YAAY,MAAM,+CAA+C,CAAC;AACzE,OAAO,aAAa,MAAM,0CAA0C,CAAC;~~AASrE~~,MAAM,CAAC,OAAO,UAAU,mBAAmB,CAAoB,OAAoC;IAClG,OAAO,CACN,CAAC,OAAO,EAAE,aAAa,IAAI,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,CAC3C,KAAC,MAAM,IACN,KAAK,EAAC,+BAA+B,EACrC,IAAI,EAAE,MAAM,EACZ,MAAM,EAAE,YAAY,CAAC,WAAW,8BAEhC,OAAO,EAAE,IAAI,CAAC,YAAY,EAC1B,OAAO,EAAE,IAAI,CAAC,sBAAsB,EACpC,OAAO,EAAE,IAAI,CAAC,qBAAqB,EACnC,cAAc,EAAE,IAAI,CAAC,qBAAqB,EAC1C,uBAAuB,EAAE,IAAI,CAAC,oCAAoC,GACzD,CACV,CAAC,CAAC,CAAC,CACH,~~KAAC~~,aAAa,IAAC,KAAK,EAAC,iCAAiC,EAAC,MAAM,EAAE,IAAI,CAAC,YAAY,~~YAC~~/E,cAAK,KAAK,EAAC,uBAAuB,EAAC,IAAI,EAAC,QAAQ,EAAC,UAAU,EAAE,IAAI,CAAC,iBAAiB,YAClF,eAAK,KAAK,EAAC,0BAA0B,aACnC,IAAI,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,CAAC,CACtB,8BACC,KAAC,MAAM,IACN,QAAQ,EAAE,IAAI,CAAC,kBAAkB,EACjC,KAAK,EAAC,yBAAyB,EAC/B,cAAc,EAAE,IAAI,CAAC,aAAa,CAAC,KAAK,EACxC,OAAO,EAAE,IAAI,CAAC,aAAa,CAAC,KAAK,EACjC,KAAK,EAAE,IAAI,CAAC,UAAU,~~YAErB~~,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,WAAW,CAAC,EAAE,CAAC,CAC/B,KAAC,MAAM,IACN,KAAK,EAAE,WAAW,CAAC,KAAK,qBACP,WAAW,CAAC,YAAY,EACzC,GAAG,EAAE,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,WAAW,CAAC,YACrC,WAAW,CAAC,IAAI,GACT,CACT,CAAC,GACM,EACT,cAAK,KAAK,EAAC,4BAA4B,GAAO,IAC5C,CACH,CAAC,CAAC,CAAC,IAAI,CAAC,YAAY,EAAE,MAAM,CAAC,CAAC,CAAC,CAC/B,8BACC,cAAK,KAAK,EAAC,oBAAoB,EAAC,KAAK,EAAC,mBAAmB,YACxD,eAAM,IAAI,EAAC,cAAc,GAAQ,GAC5B,EACN,cAAK,KAAK,EAAC,4BAA4B,GAAO,IAC5C,CACH,CAAC,CAAC,CAAC,IAAI,EAER,gBACC,KAAK,EAAC,8BAA8B,EACpC,IAAI,EAAC,WAAW,sBACE,IAAI,CAAC,qBAAqB,gBAChC,IAAI,CAAC,cAAc,IAAI,IAAI,CAAC,aAAa,CAAC,oBAAoB,uBACxD,MAAM,mBACV,iBAAiB,EAC/B,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,WAAW,EAAE,IAAI,CAAC,~~WAAW~~,~~8BAE7B~~,OAAO,EAAE,IAAI,CAAC,YAAY,EAC1B,SAAS,EAAE,IAAI,CAAC,UAAU,EAC1B,UAAU,EAAE,IAAI,CAAC,WAAW,EAC5B,SAAS,EAAE,IAAI,CAAC,UAAU,EAC1B,OAAO,EAAE,IAAI,CAAC,iBAAiB,GAAI,EAEnC,IAAI,CAAC,uBAAuB;~~wBAC5B~~,KAAC,IAAI,IACJ,KAAK,EAAC,6BAA6B,EACnC,IAAI,EAAE,OAAO,EACb,WAAW,EAAE,IAAI,EACjB,cAAc,EAAE,IAAI,CAAC,aAAa,CAAC,SAAS,EAC5C,OAAO,EAAE,IAAI,CAAC,YAAY,GACnB,EAGT,KAAC,IAAI,IACJ,KAAK,EAAE;~~4BACN~~,6BAA6B,EAAE,IAAI;~~4BACnC~~,oCAAoC,EAAE,IAAI,CAAC,aAAa;~~yBACxD~~,EACD,IAAI,EAAE,MAAM,EACZ,WAAW,EAAE,IAAI,EACjB,cAAc,EAAE,IAAI,CAAC,qBAAqB,EAC1C,OAAO,EAAE,IAAI,CAAC,sBAAsB,GAC7B,IACH,GACD,~~GACS~~,CAChB,CACD,CAAC;AACH,CAAC","sourcesContent":["import Button from \"@ui5/webcomponents/dist/Button.js\";\nimport Icon from \"@ui5/webcomponents/dist/Icon.js\";\nimport Option from \"@ui5/webcomponents/dist/Option.js\";\nimport Select from \"@ui5/webcomponents/dist/Select.js\";\nimport type SearchField from \"./SearchField.js\";\nimport decline from \"@ui5/webcomponents-icons/dist/decline.js\";\nimport search from \"@ui5/webcomponents-icons/dist/search.js\";\nimport ButtonDesign from \"@ui5/webcomponents/dist/types/ButtonDesign.js\";\nimport BusyIndicator from \"@ui5/webcomponents/dist/BusyIndicator.js\";\n\nexport type SearchFieldTemplateOptions = {\n\t/*\n\t If set to true, the search field will be expanded.\n\t */\n\tforceExpanded?: boolean;\n};\n\nexport default function SearchFieldTemplate(this: SearchField, options?: SearchFieldTemplateOptions) {\n\treturn (\n\t\t!options?.forceExpanded && this.collapsed ? (\n\t\t\t<Button\n\t\t\t\tclass=\"ui5-shell-search-field-button\"\n\t\t\t\ticon={search}\n\t\t\t\tdesign={ButtonDesign.Transparent}\n\t\t\t\tdata-sap-focus-ref\n\t\t\t\tloading={this.fieldLoading}\n\t\t\t\tonClick={this._handleSearchIconPress}\n\t\t\t\ttooltip={this._effectiveIconTooltip}\n\t\t\t\taccessibleName={this._effectiveIconTooltip}\n\t\t\t\taccessibilityAttributes={this._searchButtonAccessibilityAttributes}\n\t\t\t></Button>\n\t\t) : (\n\t\t\t<BusyIndicator class=\"ui5-search-field-busy-indicator\" active={this.fieldLoading}>\n\t\t\t\t<div class=\"ui5-search-field-root\" role=\"search\" onFocusOut={this._onFocusOutSearch}>\n\t\t\t\t\t<div class=\"ui5-search-field-content\">\n\t\t\t\t\t\t{this.scopes?.length ? (\n\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t<Select\n\t\t\t\t\t\t\t\t\tonChange={this._handleScopeChange}\n\t\t\t\t\t\t\t\t\tclass=\"ui5-search-field-select\"\n\t\t\t\t\t\t\t\t\taccessibleName={this._translations.scope}\n\t\t\t\t\t\t\t\t\ttooltip={this._translations.scope}\n\t\t\t\t\t\t\t\t\tvalue={this.scopeValue}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{this.scopes.map(scopeOption => (\n\t\t\t\t\t\t\t\t\t\t<Option\n\t\t\t\t\t\t\t\t\t\t\tvalue={scopeOption.value}\n\t\t\t\t\t\t\t\t\t\t\tdata-ui5-stable={scopeOption.stableDomRef}\n\t\t\t\t\t\t\t\t\t\t\tref={this.captureRef.bind(scopeOption)}\n\t\t\t\t\t\t\t\t\t\t>{scopeOption.text}\n\t\t\t\t\t\t\t\t\t\t</Option>\n\t\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t\t</Select>\n\t\t\t\t\t\t\t\t<div class=\"ui5-search-field-separator\"></div>\n\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t) : this.filterButton?.length ? (\n\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t<div class=\"ui5-filter-wrapper\" style=\"display: contents\">\n\t\t\t\t\t\t\t\t\t<slot name=\"filterButton\"></slot>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t<div class=\"ui5-search-field-separator\"></div>\n\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t) : null}\n\n\t\t\t\t\t\t<input\n\t\t\t\t\t\t\tclass=\"ui5-search-field-inner-input\"\n\t\t\t\t\t\t\trole=\"searchbox\"\n\t\t\t\t\t\t\taria-description={this.accessibleDescription}\n\t\t\t\t\t\t\taria-label={this.accessibleName \|\| this._translations.searchFieldAriaLabel}\n\t\t\t\t\t\t\taria-autocomplete=\"both\"\n\t\t\t\t\t\t\taria-controls=\"ui5-search-list\"\n\t\t\t\t\t\t\tvalue={this.value}\n\t\t\t\t\t\t\tplaceholder={this.~~placeholder~~}\n\t\t\t\t\t\t\tdata-sap-focus-ref\n\t\t\t\t\t\t\tonInput={this._handleInput}\n\t\t\t\t\t\t\tonFocusIn={this._onfocusin}\n\t\t\t\t\t\t\tonFocusOut={this._onfocusout}\n\t\t\t\t\t\t\tonKeyDown={this._onkeydown}\n\t\t\t\t\t\t\tonClick={this._handleInnerClick} />\n\n\t\t\t\t\t\t{this._effectiveShowClearIcon &&\n\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\tclass=\"ui5-shell-search-field-icon\"\n\t\t\t\t\t\t\t\tname={decline}\n\t\t\t\t\t\t\t\tshowTooltip={true}\n\t\t\t\t\t\t\t\taccessibleName={this._translations.clearIcon}\n\t\t\t\t\t\t\t\tonClick={this._handleClear}\n\t\t\t\t\t\t\t></Icon>\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\tclass={{\n\t\t\t\t\t\t\t\t\"ui5-shell-search-field-icon\": true,\n\t\t\t\t\t\t\t\t\"ui5-shell-search-field-search-icon\": this._isSearchIcon,\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tname={search}\n\t\t\t\t\t\t\tshowTooltip={true}\n\t\t\t\t\t\t\taccessibleName={this._effectiveIconTooltip}\n\t\t\t\t\t\t\tonClick={this._handleSearchIconPress}\n\t\t\t\t\t\t></Icon>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</BusyIndicator>\n\t\t)\n\t);\n}\n"]}
1	+ {"version":3,"file":"SearchFieldTemplate.js","sourceRoot":"","sources":["../src/SearchFieldTemplate.tsx"],"names":[],"mappings":"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","sourcesContent":["import Button from \"@ui5/webcomponents/dist/Button.js\";\nimport Icon from \"@ui5/webcomponents/dist/Icon.js\";\nimport Option from \"@ui5/webcomponents/dist/Option.js\";\nimport Select from \"@ui5/webcomponents/dist/Select.js\";\nimport type SearchField from \"./SearchField.js\";\nimport decline from \"@ui5/webcomponents-icons/dist/decline.js\";\nimport search from \"@ui5/webcomponents-icons/dist/search.js\";\nimport slimArrowDown from \"@ui5/webcomponents-icons/dist/slim-arrow-down.js\";\nimport ButtonDesign from \"@ui5/webcomponents/dist/types/ButtonDesign.js\";\nimport BusyIndicator from \"@ui5/webcomponents/dist/BusyIndicator.js\";\nimport SearchFieldScopePopoverTemplate from \"./SearchFieldScopePopoverTemplate.js\";\n\nexport type SearchFieldTemplateOptions = {\n\t/*\n\t If set to true, the search field will be expanded.\n\t */\n\tforceExpanded?: boolean;\n};\n\nexport default function SearchFieldTemplate(this: SearchField, options?: SearchFieldTemplateOptions) {\n\treturn (\n\t\t!options?.forceExpanded && this.collapsed ? (\n\t\t\t<Button\n\t\t\t\tclass=\"ui5-shell-search-field-button\"\n\t\t\t\ticon={search}\n\t\t\t\tdesign={ButtonDesign.Transparent}\n\t\t\t\tdata-sap-focus-ref\n\t\t\t\tloading={this.fieldLoading}\n\t\t\t\tonClick={this._handleSearchIconPress}\n\t\t\t\ttooltip={this._effectiveIconTooltip}\n\t\t\t\taccessibleName={this._effectiveIconTooltip}\n\t\t\t\taccessibilityAttributes={this._searchButtonAccessibilityAttributes}\n\t\t\t></Button>\n\t\t) : (\n\t\t\t<BusyIndicator class=\"ui5-search-field-busy-indicator\" active={this.fieldLoading}>\n\t\t\t\t<div class=\"ui5-search-field-root\" role=\"search\" onFocusOut={this._onFocusOutSearch}>\n\t\t\t\t\t<div class=\"ui5-search-field-content\">\n\t\t\t\t\t\t{this.scopes?.length ? (\n\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t{!this._isMobileView ? (\n\t\t\t\t\t\t\t\t\t// Desktop/Tablet: Show full Select component\n\t\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t\t<Select\n\t\t\t\t\t\t\t\t\t\t\tonChange={this._handleScopeChange}\n\t\t\t\t\t\t\t\t\t\t\tclass=\"ui5-search-field-select\"\n\t\t\t\t\t\t\t\t\t\t\taccessibleName={this._translations.scope}\n\t\t\t\t\t\t\t\t\t\t\ttooltip={this._translations.scope}\n\t\t\t\t\t\t\t\t\t\t\tvalue={this.scopeValue}\n\t\t\t\t\t\t\t\t\t\t\texportparts=\"label:scope-label\"\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{this.scopes.map(scopeOption => (\n\t\t\t\t\t\t\t\t\t\t\t\t<Option\n\t\t\t\t\t\t\t\t\t\t\t\t\tvalue={scopeOption.value}\n\t\t\t\t\t\t\t\t\t\t\t\t\tdata-ui5-stable={scopeOption.stableDomRef}\n\t\t\t\t\t\t\t\t\t\t\t\t\tref={this.captureRef.bind(scopeOption)}\n\t\t\t\t\t\t\t\t\t\t\t\t>{scopeOption.text}\n\t\t\t\t\t\t\t\t\t\t\t\t</Option>\n\t\t\t\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t\t\t\t</Select>\n\t\t\t\t\t\t\t\t\t\t<div class=\"ui5-search-field-separator\"></div>\n\t\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t// Mobile/Phone: Show icon button only\n\t\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\t\tref={this.captureScopeIconRef.bind(this)}\n\t\t\t\t\t\t\t\t\t\t\tclass=\"ui5-search-field-scope-button\"\n\t\t\t\t\t\t\t\t\t\t\ticon={slimArrowDown}\n\t\t\t\t\t\t\t\t\t\t\tdesign={ButtonDesign.Transparent}\n\t\t\t\t\t\t\t\t\t\t\tonClick={this._handleScopeIconPress}\n\t\t\t\t\t\t\t\t\t\t\ttooltip={this._scopeIconAccessibleName}\n\t\t\t\t\t\t\t\t\t\t\taccessibleName={this._scopeIconAccessibleName}\n\t\t\t\t\t\t\t\t\t\t\taccessibilityAttributes={{\n\t\t\t\t\t\t\t\t\t\t\t\thasPopup: \"dialog\",\n\t\t\t\t\t\t\t\t\t\t\t\texpanded: this._scopePopoverOpen,\n\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t<div class=\"ui5-search-field-separator\"></div>\n\t\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t) : this.filterButton?.length ? (\n\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t<div class=\"ui5-filter-wrapper\" style=\"display: contents\">\n\t\t\t\t\t\t\t\t\t<slot name=\"filterButton\"></slot>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t<div class=\"ui5-search-field-separator\"></div>\n\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t) : null}\n\n\t\t\t\t\t\t<input\n\t\t\t\t\t\t\tclass=\"ui5-search-field-inner-input\"\n\t\t\t\t\t\t\trole=\"searchbox\"\n\t\t\t\t\t\t\taria-description={this.accessibleDescription}\n\t\t\t\t\t\t\taria-label={this.accessibleName \|\| this._translations.searchFieldAriaLabel}\n\t\t\t\t\t\t\taria-autocomplete=\"both\"\n\t\t\t\t\t\t\taria-controls=\"ui5-search-list\"\n\t\t\t\t\t\t\tvalue={this.value}\n\t\t\t\t\t\t\tplaceholder={this._effectivePlaceholder}\n\t\t\t\t\t\t\tdata-sap-focus-ref\n\t\t\t\t\t\t\tonInput={this._handleInput}\n\t\t\t\t\t\t\tonFocusIn={this._onfocusin}\n\t\t\t\t\t\t\tonFocusOut={this._onfocusout}\n\t\t\t\t\t\t\tonKeyDown={this._onkeydown}\n\t\t\t\t\t\t\tonClick={this._handleInnerClick} />\n\n\t\t\t\t\t\t{this._effectiveShowClearIcon &&\n\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\tclass=\"ui5-shell-search-field-icon\"\n\t\t\t\t\t\t\t\tname={decline}\n\t\t\t\t\t\t\t\tshowTooltip={true}\n\t\t\t\t\t\t\t\taccessibleName={this._translations.clearIcon}\n\t\t\t\t\t\t\t\tonClick={this._handleClear}\n\t\t\t\t\t\t\t></Icon>\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\tclass={{\n\t\t\t\t\t\t\t\t\"ui5-shell-search-field-icon\": true,\n\t\t\t\t\t\t\t\t\"ui5-shell-search-field-search-icon\": this._isSearchIcon,\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tname={search}\n\t\t\t\t\t\t\tshowTooltip={true}\n\t\t\t\t\t\t\taccessibleName={this._effectiveIconTooltip}\n\t\t\t\t\t\t\tonClick={this._handleSearchIconPress}\n\t\t\t\t\t\t></Icon>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t\t{SearchFieldScopePopoverTemplate.call(this)}\n\t\t\t</BusyIndicator>\n\t\t)\n\t);\n}\n"]}

package/dist/UserMenuTemplate.js CHANGED Viewed

@@ -42,7 +42,7 @@ function headerContent() {
                         _jsx(Button, { id: "selected-account-manage-btn", icon: userSettings, class: "ui5-user-menu-manage-account-btn", onClick: this._handleManageAccountClick, children: this._manageAccountButtonText })] }) }));
 }
 function otherAccountsContent() {
-    return (_jsx(_Fragment, { children: _jsxs(Panel, { collapsed: true, class: "ui5-user-menu-other-accounts", children: [_jsxs("div", { slot: "header", class: "ui5-user-menu-account-header", children: [_jsxs(Title, { slot: "header", level: "H4", "wrapping-type": "None", children: [this._otherAccountsButtonText, " (", this._otherAccounts.length, ")"] }), this.showEditAccounts &&
+    return (_jsx(_Fragment, { children: _jsxs(Panel, { collapsed: true, class: "ui5-user-menu-other-accounts", accessibleName: `${this._otherAccountsButtonText} (${this._otherAccounts.length})`, children: [_jsxs("div", { slot: "header", class: "ui5-user-menu-account-header", children: [_jsxs(Title, { slot: "header", level: "H4", "wrapping-type": "None", children: [this._otherAccountsButtonText, " (", this._otherAccounts.length, ")"] }), this.showEditAccounts &&
                             _jsx(Button, { slot: "header", class: "ui5-user-menu-add-account-btn", design: "Transparent", icon: userEdit, onClick: this._handleEditAccountsClick, tooltip: this._editAccountsTooltip })] }), this._otherAccounts.length > 0 &&
                     _jsx(_Fragment, { children: otherAccountsList.call(this) })] }) }));
 }

package/dist/UserMenuTemplate.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"UserMenuTemplate.js","sourceRoot":"","sources":["../src/UserMenuTemplate.tsx"],"names":[],"mappings":"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","sourcesContent":["import type UserMenu from \"./UserMenu.js\";\nimport Avatar from \"@ui5/webcomponents/dist/Avatar.js\";\nimport Button from \"@ui5/webcomponents/dist/Button.js\";\nimport Icon from \"@ui5/webcomponents/dist/Icon.js\";\nimport AvatarBadge from \"@ui5/webcomponents/dist/AvatarBadge.js\";\nimport Title from \"@ui5/webcomponents/dist/Title.js\";\nimport Text from \"@ui5/webcomponents/dist/Text.js\";\nimport Label from \"@ui5/webcomponents/dist/Label.js\";\nimport List from \"@ui5/webcomponents/dist/List.js\";\nimport ListItemCustom from \"@ui5/webcomponents/dist/ListItemCustom.js\";\nimport Panel from \"@ui5/webcomponents/dist/Panel.js\";\nimport Bar from \"@ui5/webcomponents/dist/Bar.js\";\nimport ResponsivePopover from \"@ui5/webcomponents/dist/ResponsivePopover.js\";\nimport edit from \"@ui5/webcomponents-icons/dist/edit.js\";\nimport personPlaceholder from \"@ui5/webcomponents-icons/dist/person-placeholder.js\";\nimport userSettings from \"@ui5/webcomponents-icons/dist/user-settings.js\";\nimport log from \"@ui5/webcomponents-icons/dist/log.js\";\nimport decline from \"@ui5/webcomponents-icons/dist/decline.js\";\nimport userEdit from \"@ui5/webcomponents-icons/dist/user-edit.js\";\nimport selectedAccount from \"@ui5/webcomponents-icons/dist/sys-enter-2.js\";\n\nexport default function UserMenuTemplate(this: UserMenu) {\n\treturn (\n\t\t<ResponsivePopover\n\t\t\tid=\"user-menu-rp\"\n\t\t\tclass=\"ui5-user-menu-rp\"\n\t\t\tplacement=\"Bottom\"\n\t\t\tverticalAlign=\"Bottom\"\n\t\t\thorizontalAlign=\"End\"\n\t\t\ttabindex={-1}\n\t\t\taccessibleName={this.accessibleNameText}\n\t\t\taria-label={this.accessibleNameText}\n\t\t\topen={this.open}\n\t\t\topener={this.opener}\n\t\t\tonClose={this._handlePopoverAfterClose}\n\t\t\tonOpen={this._handlePopoverAfterOpen}\n\t\t\tonScroll={this._handleScroll}\n\t\t>\n\t\t\t<>\n\t\t\t\t<Bar class={{\n\t\t\t\t\t\"ui5-user-menu-fixed-header\": true,\n\t\t\t\t\t\"ui5-user-menu-rp-scrolled\": this._isScrolled \|\| this._titleMovedToHeader\n\t\t\t\t}} slot=\"header\">\n\t\t\t\t\t{this._titleMovedToHeader &&\n\t\t\t\t\t\t<Title\n\t\t\t\t\t\t\tlevel=\"H1\"\n\t\t\t\t\t\t\twrappingType=\"None\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{this._selectedAccount.titleText}\n\t\t\t\t\t\t</Title>\n\t\t\t\t\t}\n\n\t\t\t\t\t{this._isPhone && <Button\n\t\t\t\t\t\ticon={decline}\n\t\t\t\t\t\tdesign=\"Transparent\"\n\t\t\t\t\t\taccessibleName={this._closeDialogAriaLabel}\n\t\t\t\t\t\tonClick={this._closeUserMenu}\n\t\t\t\t\t\tslot=\"endContent\"\n\t\t\t\t\t />}\n\t\t\t\t</Bar>\n\n\t\t\t\t<div class=\"ui5-user-menu-header\">\n\t\t\t\t\t{headerContent.call(this)}\n\t\t\t\t</div>\n\t\t\t</>\n\n\t\t\t{this.showOtherAccounts &&\n\t\t\t\t<>\n\t\t\t\t\t{otherAccountsContent.call(this)}\n\t\t\t\t</>\n\t\t\t}\n\n\t\t\t{this.menuItems.length > 0 &&\n\t\t\t\t\t<List\n\t\t\t\t\t\tid=\"ui5-user-menu-list\"\n\t\t\t\t\t\tclass=\"ui5-user-menu-list\"\n\t\t\t\t\t\tselectionMode=\"None\"\n\t\t\t\t\t\tseparators=\"None\"\n\t\t\t\t\t\taccessibleRole=\"Menu\"\n\t\t\t\t\t\taccessibleName={this._ariaLabelledByActions}\n\t\t\t\t\t\tonItemClick={this._handleMenuItemClick}\n\t\t\t\t\t\tonMouseOver={this._itemMouseOver}\n\t\t\t\t\t\tonui5-close-menu={this._handleMenuItemClose}\n\t\t\t\t\t>\n\t\t\t\t\t\t<slot></slot>\n\t\t\t\t\t</List>\n\t\t\t}\n\n\t\t\t{this._hasCustomFooter &&\n\t\t\t\t<div slot=\"footer\" class=\"ui5-user-menu-footer\">\n\t\t\t\t\t<slot name=\"footer\"></slot>\n\t\t\t\t</div>\n\t\t\t}\n\n\t\t\t{this._showDefaultFooter &&\n\t\t\t\t<div slot=\"footer\" class=\"ui5-user-menu-footer\">\n\t\t\t\t\t<Button class=\"ui5-user-menu-sign-out-btn\" design=\"Transparent\" icon={log} onClick={this._handleSignOutClick}>{this._signOutButtonText}</Button>\n\t\t\t\t</div>\n\t\t\t}\n\t\t</ResponsivePopover>\n\t);\n}\n\nfunction headerContent(this: UserMenu) {\n\treturn (<>\n\t\t{this._selectedAccount &&\n\t\t\t<div class=\"ui5-user-menu-selected-account\" aria-label={this._ariaLabelledByAccountInformationText}>\n\t\t\t\t<span title={this.showEditButton ? this._editAvatarTooltip : undefined}>\n\t\t\t\t\t<Avatar size=\"L\" onClick={this._isAvatarInteractive ? this._handleAvatarClick : undefined} initials={this._selectedAccount._initials} colorScheme={this._selectedAccount.avatarColorScheme} fallbackIcon={personPlaceholder} class=\"ui5-user-menu-selected-account-avatar\" mode={this._isAvatarInteractive ? \"Interactive\" : \"Image\"}>\n\t\t\t\t\t\t{this._selectedAccount.avatarSrc &&\n\t\t\t\t\t\t\t<img src={this._selectedAccount.avatarSrc}/>\n\t\t\t\t\t\t}\n\t\t\t\t\t\t{this.showEditButton &&\n\t\t\t\t\t\t<AvatarBadge slot=\"badge\" icon={edit}></AvatarBadge>\n\t\t\t\t\t\t}\n\t\t\t\t\t</Avatar>\n\t\t\t\t</span>\n\t\t\t\t{this._selectedAccount.titleText &&\n\t\t\t\t\t<Text id=\"selected-account-title\" class=\"ui5-user-menu-selected-account-title\">{this._selectedAccount.titleText}</Text>\n\t\t\t\t}\n\n\t\t\t\t{this._selectedAccount.subtitleText &&\n\t\t\t\t\t<Text class=\"ui5-user-menu-selected-account-subtitleText\">{this._selectedAccount.subtitleText}</Text>\n\t\t\t\t}\n\t\t\t\t{this._selectedAccount.description &&\n\t\t\t\t\t<Text class=\"ui5-user-menu-selected-account-description\">{this._selectedAccount.description}</Text>\n\t\t\t\t}\n\t\t\t\t{this._selectedAccount.additionalInfo &&\n\t\t\t\t\t<Text class=\"ui5-user-menu-selected-account-additional-info\">{this._selectedAccount.additionalInfo}</Text>\n\t\t\t\t}\n\n\t\t\t\t{this._hasInfoArea &&\n\t\t\t\t\t<div class=\"ui5-user-menu-info-area\">\n\t\t\t\t\t\t<slot name=\"infoArea\"></slot>\n\t\t\t\t\t</div>\n\t\t\t\t}\n\n\t\t\t\t{this.showManageAccount &&\n\t\t\t\t\t<Button id=\"selected-account-manage-btn\" icon={userSettings} class=\"ui5-user-menu-manage-account-btn\" onClick={this._handleManageAccountClick}>{this._manageAccountButtonText}</Button>\n\t\t\t\t}\n\t\t\t</div>\n\t\t}\n\t</>);\n}\n\nfunction otherAccountsContent(this: UserMenu) {\n\treturn (<>\n\t\t<Panel collapsed={true} class=\"ui5-user-menu-other-accounts\">\n\t\t\t<div slot=\"header\" class=\"ui5-user-menu-account-header\">\n\t\t\t\t<Title slot=\"header\" level=\"H4\" wrapping-type=\"None\">{this._otherAccountsButtonText} ({this._otherAccounts.length})</Title>\n\t\t\t\t{this.showEditAccounts &&\n\t\t\t\t\t<Button slot=\"header\" class=\"ui5-user-menu-add-account-btn\" design=\"Transparent\" icon={userEdit} onClick={this._handleEditAccountsClick} tooltip={this._editAccountsTooltip}/>\n\t\t\t\t}\n\t\t\t</div>\n\t\t\t{this._otherAccounts.length > 0 &&\n\t\t\t\t<>\n\t\t\t\t\t{otherAccountsList.call(this)}\n\t\t\t\t</>\n\t\t\t}\n\t\t</Panel>\n\t</>);\n}\n\nfunction otherAccountsList(this: UserMenu) {\n\treturn (<>\n\t\t<List onItemClick={this._handleAccountSwitch} loadingDelay={0}\n\t\t\taccessibleName={`${this._otherAccountsButtonText} (${this._otherAccounts.length})`}\n\t\t\t loading={this._otherAccounts.some(account => account.loading === true)}>\n\t\t\t{this._otherAccounts.map((account, index) =>\n\t\t\t\t<ListItemCustom\n\t\t\t\t\tref={this.captureRef.bind(account)}\n\t\t\t\t\taccessibilityAttributes={{\n\t\t\t\t\t\t\"ariaPosinset\": index + 1,\n\t\t\t\t\t\t\"ariaSetsize\": this._otherAccounts.length\n\t\t\t\t\t}}\n\t\t\t\t\taccessibleName={this.getAccountDescriptionText(account)}\n\t\t\t\t>\n\t\t\t\t\t<div class=\"ui5-user-menu-other-accounts-content\">\n\t\t\t\t\t\t<Avatar slot=\"image\" size=\"S\" initials={account._initials} fallbackIcon={personPlaceholder} colorScheme={account.avatarColorScheme}>\n\t\t\t\t\t\t\t{account.avatarSrc &&\n\t\t\t\t\t\t\t\t<img src={account.avatarSrc}/>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t</Avatar>\n\t\t\t\t\t\t<div class=\"ui5-user-menu-other-accounts-info\">\n\t\t\t\t\t\t\t{account.titleText &&\n\t\t\t\t\t\t\t\t<Title class=\"ui5-user-menu-other-accounts-title\">{account.titleText}</Title>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t{account.subtitleText &&\n\t\t\t\t\t\t\t\t<Label class=\"ui5-user-menu-other-accounts-additional-info\">{account.subtitleText}</Label>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t{account.description &&\n\t\t\t\t\t\t\t\t<Label class=\"ui5-user-menu-other-accounts-additional-info\">{account.description}</Label>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t{account.selected &&\n\t\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\t\tpart=\"icon\"\n\t\t\t\t\t\t\t\t\tname={selectedAccount}\n\t\t\t\t\t\t\t\t\tclass=\"ui5-user-menu-selected-account-icon\"\n\t\t\t\t\t\t\t\t\tmode=\"Decorative\" />\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t</div>\n\n\t\t\t\t\t</div>\n\t\t\t\t</ListItemCustom>\n\t\t\t)}\n\t\t</List>\n\t</>);\n}\n"]}
1	+ {"version":3,"file":"UserMenuTemplate.js","sourceRoot":"","sources":["../src/UserMenuTemplate.tsx"],"names":[],"mappings":"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","sourcesContent":["import type UserMenu from \"./UserMenu.js\";\nimport Avatar from \"@ui5/webcomponents/dist/Avatar.js\";\nimport Button from \"@ui5/webcomponents/dist/Button.js\";\nimport Icon from \"@ui5/webcomponents/dist/Icon.js\";\nimport AvatarBadge from \"@ui5/webcomponents/dist/AvatarBadge.js\";\nimport Title from \"@ui5/webcomponents/dist/Title.js\";\nimport Text from \"@ui5/webcomponents/dist/Text.js\";\nimport Label from \"@ui5/webcomponents/dist/Label.js\";\nimport List from \"@ui5/webcomponents/dist/List.js\";\nimport ListItemCustom from \"@ui5/webcomponents/dist/ListItemCustom.js\";\nimport Panel from \"@ui5/webcomponents/dist/Panel.js\";\nimport Bar from \"@ui5/webcomponents/dist/Bar.js\";\nimport ResponsivePopover from \"@ui5/webcomponents/dist/ResponsivePopover.js\";\nimport edit from \"@ui5/webcomponents-icons/dist/edit.js\";\nimport personPlaceholder from \"@ui5/webcomponents-icons/dist/person-placeholder.js\";\nimport userSettings from \"@ui5/webcomponents-icons/dist/user-settings.js\";\nimport log from \"@ui5/webcomponents-icons/dist/log.js\";\nimport decline from \"@ui5/webcomponents-icons/dist/decline.js\";\nimport userEdit from \"@ui5/webcomponents-icons/dist/user-edit.js\";\nimport selectedAccount from \"@ui5/webcomponents-icons/dist/sys-enter-2.js\";\n\nexport default function UserMenuTemplate(this: UserMenu) {\n\treturn (\n\t\t<ResponsivePopover\n\t\t\tid=\"user-menu-rp\"\n\t\t\tclass=\"ui5-user-menu-rp\"\n\t\t\tplacement=\"Bottom\"\n\t\t\tverticalAlign=\"Bottom\"\n\t\t\thorizontalAlign=\"End\"\n\t\t\ttabindex={-1}\n\t\t\taccessibleName={this.accessibleNameText}\n\t\t\taria-label={this.accessibleNameText}\n\t\t\topen={this.open}\n\t\t\topener={this.opener}\n\t\t\tonClose={this._handlePopoverAfterClose}\n\t\t\tonOpen={this._handlePopoverAfterOpen}\n\t\t\tonScroll={this._handleScroll}\n\t\t>\n\t\t\t<>\n\t\t\t\t<Bar class={{\n\t\t\t\t\t\"ui5-user-menu-fixed-header\": true,\n\t\t\t\t\t\"ui5-user-menu-rp-scrolled\": this._isScrolled \|\| this._titleMovedToHeader\n\t\t\t\t}} slot=\"header\">\n\t\t\t\t\t{this._titleMovedToHeader &&\n\t\t\t\t\t\t<Title\n\t\t\t\t\t\t\tlevel=\"H1\"\n\t\t\t\t\t\t\twrappingType=\"None\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{this._selectedAccount.titleText}\n\t\t\t\t\t\t</Title>\n\t\t\t\t\t}\n\n\t\t\t\t\t{this._isPhone && <Button\n\t\t\t\t\t\ticon={decline}\n\t\t\t\t\t\tdesign=\"Transparent\"\n\t\t\t\t\t\taccessibleName={this._closeDialogAriaLabel}\n\t\t\t\t\t\tonClick={this._closeUserMenu}\n\t\t\t\t\t\tslot=\"endContent\"\n\t\t\t\t\t />}\n\t\t\t\t</Bar>\n\n\t\t\t\t<div class=\"ui5-user-menu-header\">\n\t\t\t\t\t{headerContent.call(this)}\n\t\t\t\t</div>\n\t\t\t</>\n\n\t\t\t{this.showOtherAccounts &&\n\t\t\t\t<>\n\t\t\t\t\t{otherAccountsContent.call(this)}\n\t\t\t\t</>\n\t\t\t}\n\n\t\t\t{this.menuItems.length > 0 &&\n\t\t\t\t\t<List\n\t\t\t\t\t\tid=\"ui5-user-menu-list\"\n\t\t\t\t\t\tclass=\"ui5-user-menu-list\"\n\t\t\t\t\t\tselectionMode=\"None\"\n\t\t\t\t\t\tseparators=\"None\"\n\t\t\t\t\t\taccessibleRole=\"Menu\"\n\t\t\t\t\t\taccessibleName={this._ariaLabelledByActions}\n\t\t\t\t\t\tonItemClick={this._handleMenuItemClick}\n\t\t\t\t\t\tonMouseOver={this._itemMouseOver}\n\t\t\t\t\t\tonui5-close-menu={this._handleMenuItemClose}\n\t\t\t\t\t>\n\t\t\t\t\t\t<slot></slot>\n\t\t\t\t\t</List>\n\t\t\t}\n\n\t\t\t{this._hasCustomFooter &&\n\t\t\t\t<div slot=\"footer\" class=\"ui5-user-menu-footer\">\n\t\t\t\t\t<slot name=\"footer\"></slot>\n\t\t\t\t</div>\n\t\t\t}\n\n\t\t\t{this._showDefaultFooter &&\n\t\t\t\t<div slot=\"footer\" class=\"ui5-user-menu-footer\">\n\t\t\t\t\t<Button class=\"ui5-user-menu-sign-out-btn\" design=\"Transparent\" icon={log} onClick={this._handleSignOutClick}>{this._signOutButtonText}</Button>\n\t\t\t\t</div>\n\t\t\t}\n\t\t</ResponsivePopover>\n\t);\n}\n\nfunction headerContent(this: UserMenu) {\n\treturn (<>\n\t\t{this._selectedAccount &&\n\t\t\t<div class=\"ui5-user-menu-selected-account\" aria-label={this._ariaLabelledByAccountInformationText}>\n\t\t\t\t<span title={this.showEditButton ? this._editAvatarTooltip : undefined}>\n\t\t\t\t\t<Avatar size=\"L\" onClick={this._isAvatarInteractive ? this._handleAvatarClick : undefined} initials={this._selectedAccount._initials} colorScheme={this._selectedAccount.avatarColorScheme} fallbackIcon={personPlaceholder} class=\"ui5-user-menu-selected-account-avatar\" mode={this._isAvatarInteractive ? \"Interactive\" : \"Image\"}>\n\t\t\t\t\t\t{this._selectedAccount.avatarSrc &&\n\t\t\t\t\t\t\t<img src={this._selectedAccount.avatarSrc}/>\n\t\t\t\t\t\t}\n\t\t\t\t\t\t{this.showEditButton &&\n\t\t\t\t\t\t<AvatarBadge slot=\"badge\" icon={edit}></AvatarBadge>\n\t\t\t\t\t\t}\n\t\t\t\t\t</Avatar>\n\t\t\t\t</span>\n\t\t\t\t{this._selectedAccount.titleText &&\n\t\t\t\t\t<Text id=\"selected-account-title\" class=\"ui5-user-menu-selected-account-title\">{this._selectedAccount.titleText}</Text>\n\t\t\t\t}\n\n\t\t\t\t{this._selectedAccount.subtitleText &&\n\t\t\t\t\t<Text class=\"ui5-user-menu-selected-account-subtitleText\">{this._selectedAccount.subtitleText}</Text>\n\t\t\t\t}\n\t\t\t\t{this._selectedAccount.description &&\n\t\t\t\t\t<Text class=\"ui5-user-menu-selected-account-description\">{this._selectedAccount.description}</Text>\n\t\t\t\t}\n\t\t\t\t{this._selectedAccount.additionalInfo &&\n\t\t\t\t\t<Text class=\"ui5-user-menu-selected-account-additional-info\">{this._selectedAccount.additionalInfo}</Text>\n\t\t\t\t}\n\n\t\t\t\t{this._hasInfoArea &&\n\t\t\t\t\t<div class=\"ui5-user-menu-info-area\">\n\t\t\t\t\t\t<slot name=\"infoArea\"></slot>\n\t\t\t\t\t</div>\n\t\t\t\t}\n\n\t\t\t\t{this.showManageAccount &&\n\t\t\t\t\t<Button id=\"selected-account-manage-btn\" icon={userSettings} class=\"ui5-user-menu-manage-account-btn\" onClick={this._handleManageAccountClick}>{this._manageAccountButtonText}</Button>\n\t\t\t\t}\n\t\t\t</div>\n\t\t}\n\t</>);\n}\n\nfunction otherAccountsContent(this: UserMenu) {\n\treturn (<>\n\t\t<Panel collapsed={true} class=\"ui5-user-menu-other-accounts\" accessibleName={`${this._otherAccountsButtonText} (${this._otherAccounts.length})`}>\n\t\t\t<div slot=\"header\" class=\"ui5-user-menu-account-header\">\n\t\t\t\t<Title slot=\"header\" level=\"H4\" wrapping-type=\"None\">{this._otherAccountsButtonText} ({this._otherAccounts.length})</Title>\n\t\t\t\t{this.showEditAccounts &&\n\t\t\t\t\t<Button slot=\"header\" class=\"ui5-user-menu-add-account-btn\" design=\"Transparent\" icon={userEdit} onClick={this._handleEditAccountsClick} tooltip={this._editAccountsTooltip}/>\n\t\t\t\t}\n\t\t\t</div>\n\t\t\t{this._otherAccounts.length > 0 &&\n\t\t\t\t<>\n\t\t\t\t\t{otherAccountsList.call(this)}\n\t\t\t\t</>\n\t\t\t}\n\t\t</Panel>\n\t</>);\n}\n\nfunction otherAccountsList(this: UserMenu) {\n\treturn (<>\n\t\t<List onItemClick={this._handleAccountSwitch} loadingDelay={0}\n\t\t\taccessibleName={`${this._otherAccountsButtonText} (${this._otherAccounts.length})`}\n\t\t\t loading={this._otherAccounts.some(account => account.loading === true)}>\n\t\t\t{this._otherAccounts.map((account, index) =>\n\t\t\t\t<ListItemCustom\n\t\t\t\t\tref={this.captureRef.bind(account)}\n\t\t\t\t\taccessibilityAttributes={{\n\t\t\t\t\t\t\"ariaPosinset\": index + 1,\n\t\t\t\t\t\t\"ariaSetsize\": this._otherAccounts.length\n\t\t\t\t\t}}\n\t\t\t\t\taccessibleName={this.getAccountDescriptionText(account)}\n\t\t\t\t>\n\t\t\t\t\t<div class=\"ui5-user-menu-other-accounts-content\">\n\t\t\t\t\t\t<Avatar slot=\"image\" size=\"S\" initials={account._initials} fallbackIcon={personPlaceholder} colorScheme={account.avatarColorScheme}>\n\t\t\t\t\t\t\t{account.avatarSrc &&\n\t\t\t\t\t\t\t\t<img src={account.avatarSrc}/>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t</Avatar>\n\t\t\t\t\t\t<div class=\"ui5-user-menu-other-accounts-info\">\n\t\t\t\t\t\t\t{account.titleText &&\n\t\t\t\t\t\t\t\t<Title class=\"ui5-user-menu-other-accounts-title\">{account.titleText}</Title>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t{account.subtitleText &&\n\t\t\t\t\t\t\t\t<Label class=\"ui5-user-menu-other-accounts-additional-info\">{account.subtitleText}</Label>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t{account.description &&\n\t\t\t\t\t\t\t\t<Label class=\"ui5-user-menu-other-accounts-additional-info\">{account.description}</Label>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t{account.selected &&\n\t\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\t\tpart=\"icon\"\n\t\t\t\t\t\t\t\t\tname={selectedAccount}\n\t\t\t\t\t\t\t\t\tclass=\"ui5-user-menu-selected-account-icon\"\n\t\t\t\t\t\t\t\t\tmode=\"Decorative\" />\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t</div>\n\n\t\t\t\t\t</div>\n\t\t\t\t</ListItemCustom>\n\t\t\t)}\n\t\t</List>\n\t</>);\n}\n"]}

package/dist/UserSettingsDialog.d.ts CHANGED Viewed

@@ -105,6 +105,12 @@ declare class UserSettingsDialog extends UI5Element {
      * @private
      */
     _showNoSearchResult: boolean;
+    /**
+     * Indicates that the user changed the search value and the search
+     * results should be announced on the next rendering.
+     * @private
+     */
+    _announceSearchResults: boolean;
     /**
      * Defines the current media query size.
      * @private
@@ -112,7 +118,7 @@ declare class UserSettingsDialog extends UI5Element {
     _mediaRange?: any;
     onEnterDOM(): void;
     onBeforeRendering(): void;
-    _handleItemClick(e: CustomEvent<ListItemClickEventDetail>): void;
+    _handleItemClick(e: CustomEvent<ListItemClickEventDetail>): Promise<void>;
     _handleDialogAfterOpen(): void;
     _handleDialogBeforeClose(e: CustomEvent<PopupBeforeCloseEventDetail>): void;
     _handleDialogAfterClose(): void;
@@ -122,12 +128,13 @@ declare class UserSettingsDialog extends UI5Element {
     get saveButtonText(): string;
     get cancelButtonText(): string;
     get noSearchResultsText(): string;
+    get _searchResultsText(): string;
     get _selectedItemSlotName(): string | undefined;
     get _showSettingWithNavigation(): boolean;
     _handleCloseButtonClick(): void;
     _handleSaveButtonClick(): void;
     _handleCancelButtonClick(): void;
-    _handleCollapseClick(): void;
+    _handleCollapseClick(): Promise<void>;
     _handleInput(e: CustomEvent<InputEventDetail>): void;
     captureRef(ref: HTMLElement & {
         associatedSettingItem?: UI5Element;

package/dist/UserSettingsDialog.js CHANGED Viewed

@@ -10,11 +10,14 @@ import { customElement, property, slotStrict as slot, eventStrict as event, } fr
 import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js";
 import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js";
 import { isPhone, isTablet, isCombi } from "@ui5/webcomponents-base/dist/Device.js";
+import { renderFinished } from "@ui5/webcomponents-base/dist/Render.js";
 import MediaRange from "@ui5/webcomponents-base/dist/MediaRange.js";
+import announce from "@ui5/webcomponents-base/dist/util/InvisibleMessage.js";
+import InvisibleMessageMode from "@ui5/webcomponents-base/dist/types/InvisibleMessageMode.js";
 import UserSettingsDialogTemplate from "./UserSettingsDialogTemplate.js";
 import UserSettingsDialogCss from "./generated/themes/UserSettingsDialog.css.js";
 // Texts
-import { USER_SETTINGS_DIALOG_ACCESSIBLE_NAME, USER_SETTINGS_LIST_ARIA_ROLE_DESC, USER_SETTINGS_DIALOG_CLOSE_BUTTON_TEXT, USER_SETTINGS_DIALOG_SAVE_BUTTON_TEXT, USER_SETTINGS_DIALOG_CANCEL_BUTTON_TEXT, USER_SETTINGS_DIALOG_NO_SEARCH_RESULTS_TEXT, } from "./generated/i18n/i18n-defaults.js";
+import { USER_SETTINGS_DIALOG_ACCESSIBLE_NAME, USER_SETTINGS_LIST_ARIA_ROLE_DESC, USER_SETTINGS_DIALOG_CLOSE_BUTTON_TEXT, USER_SETTINGS_DIALOG_SAVE_BUTTON_TEXT, USER_SETTINGS_DIALOG_CANCEL_BUTTON_TEXT, USER_SETTINGS_DIALOG_NO_SEARCH_RESULTS_TEXT, USER_SETTINGS_DIALOG_SEARCH_NO_RESULTS, USER_SETTINGS_DIALOG_SEARCH_ONE_RESULT, USER_SETTINGS_DIALOG_SEARCH_MORE_RESULTS, } from "./generated/i18n/i18n-defaults.js";
 /**
  * @class
  * ### Overview
@@ -80,6 +83,12 @@ let UserSettingsDialog = UserSettingsDialog_1 = class UserSettingsDialog extends
          * @private
          */
         this._showNoSearchResult = false;
+        /**
+         * Indicates that the user changed the search value and the search
+         * results should be announced on the next rendering.
+         * @private
+         */
+        this._announceSearchResults = false;
     }
     onEnterDOM() {
         this.setAttribute("data-sap-ui-fastnavgroup-container", "true");
@@ -115,6 +124,10 @@ let UserSettingsDialog = UserSettingsDialog_1 = class UserSettingsDialog extends
         else {
             this._showNoSearchResult = false;
         }
+        if (this._announceSearchResults) {
+            this._announceSearchResults = false;
+            announce(this._searchResultsText, InvisibleMessageMode.Polite);
+        }
         if (!this._selectedSetting) {
             this._selectedSetting = this.items[0] || this.fixedItems[0];
         }
@@ -128,12 +141,13 @@ let UserSettingsDialog = UserSettingsDialog_1 = class UserSettingsDialog extends
             }
         });
     }
-    _handleItemClick(e) {
+    async _handleItemClick(e) {
         const setting = e.detail.item;
         const settingItem = setting.associatedSettingItem;
         const eventPrevented = !this.fireDecoratorEvent("selection-change", {
             item: settingItem,
         });
+        const shouldNavigate = this._showSettingWithNavigation;
         this._collapsed = true;
         if (!eventPrevented) {
             this.items.forEach(item => {
@@ -144,6 +158,12 @@ let UserSettingsDialog = UserSettingsDialog_1 = class UserSettingsDialog extends
             });
             settingItem.selected = true;
         }
+        // In navigation (single-column) mode the content replaces the list, so move the
+        // focus to the first interactive element of the content instead of losing it.
+        if (shouldNavigate) {
+            await renderFinished();
+            this._selectedSetting?.focusFirstContentElement();
+        }
     }
     _handleDialogAfterOpen() {
         this.fireDecoratorEvent("open");
@@ -179,6 +199,17 @@ let UserSettingsDialog = UserSettingsDialog_1 = class UserSettingsDialog extends
     get noSearchResultsText() {
         return UserSettingsDialog_1.i18nBundle.getText(USER_SETTINGS_DIALOG_NO_SEARCH_RESULTS_TEXT);
     }
+    get _searchResultsText() {
+        const resultsCount = this._filteredItems.length + this._filteredFixedItems.length;
+        switch (resultsCount) {
+            case 0:
+                return UserSettingsDialog_1.i18nBundle.getText(USER_SETTINGS_DIALOG_SEARCH_NO_RESULTS);
+            case 1:
+                return UserSettingsDialog_1.i18nBundle.getText(USER_SETTINGS_DIALOG_SEARCH_ONE_RESULT);
+            default:
+                return UserSettingsDialog_1.i18nBundle.getText(USER_SETTINGS_DIALOG_SEARCH_MORE_RESULTS, resultsCount);
+        }
+    }
     get _selectedItemSlotName() {
         return this._selectedSetting ? this._selectedSetting._individualSlot : "";
     }
@@ -197,11 +228,19 @@ let UserSettingsDialog = UserSettingsDialog_1 = class UserSettingsDialog extends
     _handleCancelButtonClick() {
         this.fireDecoratorEvent("cancel");
     }
-    _handleCollapseClick() {
+    async _handleCollapseClick() {
         this._collapsed = false;
+        // The side list replaces the content, so return the focus to the
+        // user settings item that was selected instead of losing it.
+        await renderFinished();
+        const selectedListItem = this._selectedSetting
+            ? this.shadowRoot.querySelector(`#setting-${this._selectedSetting._id}`)
+            : null;
+        selectedListItem?.focus();
     }
     _handleInput(e) {
         this._searchValue = e.target.value;
+        this._announceSearchResults = true;
     }
     captureRef(ref) {
         if (ref) {

package/dist/UserSettingsDialog.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"UserSettingsDialog.js","sourceRoot":"","sources":["../src/UserSettingsDialog.ts"],"names":[],"mappings":"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","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport type { Slot, DefaultSlot } from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport {\n\tcustomElement, property, slotStrict as slot, eventStrict as event,\n} from \"@ui5/webcomponents-base/dist/decorators.js\";\nimport jsxRenderer from \"@ui5/webcomponents-base/dist/renderer/JsxRenderer.js\";\nimport type Input from \"@ui5/webcomponents/dist/Input.js\";\nimport type { InputEventDetail } from \"@ui5/webcomponents/dist/Input.js\";\nimport type { ListItemClickEventDetail } from \"@ui5/webcomponents/dist/List.js\";\nimport i18n from \"@ui5/webcomponents-base/dist/decorators/i18n.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport type ListItemBase from \"@ui5/webcomponents/dist/ListItemBase.js\";\nimport type { PopupBeforeCloseEventDetail } from \"@ui5/webcomponents/dist/Popup.js\";\nimport { isPhone, isTablet, isCombi } from \"@ui5/webcomponents-base/dist/Device.js\";\nimport MediaRange from \"@ui5/webcomponents-base/dist/MediaRange.js\";\nimport UserSettingsDialogTemplate from \"./UserSettingsDialogTemplate.js\";\nimport type UserSettingsItem from \"./UserSettingsItem.js\";\nimport UserSettingsDialogCss from \"./generated/themes/UserSettingsDialog.css.js\";\n\n// Texts\nimport {\n\tUSER_SETTINGS_DIALOG_ACCESSIBLE_NAME,\n\tUSER_SETTINGS_LIST_ARIA_ROLE_DESC,\n\tUSER_SETTINGS_DIALOG_CLOSE_BUTTON_TEXT,\n\tUSER_SETTINGS_DIALOG_SAVE_BUTTON_TEXT,\n\tUSER_SETTINGS_DIALOG_CANCEL_BUTTON_TEXT,\n\tUSER_SETTINGS_DIALOG_NO_SEARCH_RESULTS_TEXT,\n} from \"./generated/i18n/i18n-defaults.js\";\n\ntype UserSettingsItemSelectEventDetail = {\n\titem: UserSettingsItem;\n}\n\ntype UserSettingsBeforeCloseEventDetail = PopupBeforeCloseEventDetail;\n\n/*\n @class\n * ### Overview\n \n The `ui5-user-settings-dialog` is an SAP Fiori-specific web component used in the `ui5-user-menu`.\n * It allows the user to easily view information and settings for an account.\n \n ### ES6 Module Import\n * `import \"@ui5/webcomponents-fiori/dist/UserSettingsDialog.js\";`\n \n @constructor\n * @extends UI5Element\n * @public\n * @since 2.8.0\n /\n@customElement({\n\ttag: \"ui5-user-settings-dialog\",\n\trenderer: jsxRenderer,\n\ttemplate: UserSettingsDialogTemplate,\n\tstyles: [UserSettingsDialogCss],\n})\n\n/\n Fired when an item is selected.\n * @param {UserSettingsItem} item The selected `user settings item`.\n * @public\n /\n@event(\"selection-change\", {\n\tcancelable: true,\n})\n\n/\n Fired when the settings dialog is opened.\n * @public\n /\n@event(\"open\")\n\n/\n Fired before the settings dialog is closed.\n \n Note: This event is cancelable via `preventDefault()`, allowing the application to keep the\n * dialog open — for example, to prompt the user about unsaved changes before dismissal.\n * @public\n /\n@event(\"before-close\", {\n\tcancelable: true,\n})\n\n/\n Fired when the settings dialog is closed.\n * @public\n /\n@event(\"close\")\n\n/\n Fired when the Save button in the footer is clicked.\n * The dialog does not close automatically — the application is responsible\n * for closing it after persisting the changes.\n * @public\n /\n@event(\"save\")\n\n/\n Fired when the Cancel button in the footer is clicked.\n * The dialog does not close automatically — the application is responsible\n * for closing it after discarding the changes.\n * @public\n /\n@event(\"cancel\")\n\nclass UserSettingsDialog extends UI5Element {\n\teventDetails!: {\n\t\t\"selection-change\": UserSettingsItemSelectEventDetail,\n\t\t\"open\": void,\n\t\t\"before-close\": UserSettingsBeforeCloseEventDetail,\n\t\t\"close\": void,\n\t\t\"save\": void,\n\t\t\"cancel\": void,\n\t};\n\t/\n\t Defines, if the User Settings Dialog is opened.\n\t \n\t @default false\n\t * @public\n\t /\n\t@property({ type: Boolean })\n\topen = false;\n\n\t/\n\t Defines the headerText of the item.\n\t \n\t @public\n\t * @default undefined\n\t /\n\t@property({ type: String })\n\theaderText?: string;\n\n\t/\n\t Defines if the Search Field would be displayed.\n\t \n\t Note: By default the Search Field is not displayed.\n\t * @default false\n\t * @public\n\t /\n\t@property({ type: Boolean })\n\tshowSearchField = false;\n\n\t/\n\t Defines whether the dialog offers Save and Cancel actions in its footer.\n\t \n\t When true, the footer renders a Save (Emphasized) and a Cancel button\n\t * instead of the default Close button. Save and Cancel each fire a\n\t * corresponding event; the application is responsible for closing the\n\t * dialog (typically after persisting or discarding the changes).\n\t \n\t @default false\n\t * @public\n\t /\n\t@property({ type: Boolean })\n\tsaveMode = false;\n\n\t/\n\t Defines the user settings items.\n\t \n\t Note: If no setting item is set as `selected`, the first one will be selected.\n\t * @public\n\t /\n\t@slot({\n\t\t\"default\": true,\n\t\ttype: HTMLElement,\n\t\tindividualSlots: true,\n\t\tinvalidateOnChildChange: {\n\t\t\tproperties: true,\n\t\t\tslots: true,\n\t\t},\n\t})\n\titems!: DefaultSlot<UserSettingsItem>;\n\n\t/\n\t Defines the fixed user settings items.\n\t \n\t @public\n\t /\n\t@slot({\n\t\ttype: HTMLElement,\n\t\tindividualSlots: true,\n\t\tinvalidateOnChildChange: {\n\t\t\tproperties: true,\n\t\t\tslots: true,\n\t\t},\n\t})\n\tfixedItems!: Slot<UserSettingsItem>;\n\n\t@i18n(\"@ui5/webcomponents-fiori\")\n\tstatic i18nBundle: I18nBundle;\n\n\t/\n\t @private\n\t /\n\t@property({ type: String })\n\t_searchValue = \"\";\n\n\t/\n\t @private\n\t /\n\t@property({ type: Boolean })\n\t_collapsed = false;\n\n\t/\n\t @private\n\t /\n\t@property({ type: Object })\n\t_selectedSetting?: UserSettingsItem;\n\n\t/\n\t @private\n\t /\n\t_filteredItems: Array<UserSettingsItem> = [];\n\n\t/\n\t @private\n\t /\n\t_filteredFixedItems: Array<UserSettingsItem> = [];\n\n\t/\n\t @private\n\t /\n\t@property({ type: Boolean })\n\t_showNoSearchResult = false;\n\n\t/\n\t Defines the current media query size.\n\t * @private\n\t */\n\t@property({ type: String })\n\t_mediaRange?: any;\n\n\tonEnterDOM() {\n\t\tthis.setAttribute(\"data-sap-ui-fastnavgroup-container\", \"true\");\n\t}\n\n\tonBeforeRendering() {\n\t\tthis._mediaRange = MediaRange.getCurrentRange(MediaRange.RANGESETS.RANGE_4STEPS);\n\t\tconst searchValue = this._searchValue.toLowerCase();\n\t\tthis._filteredItems = [];\n\t\tthis._filteredFixedItems = [];\n\t\tconst siblingsWithIcon = this.items.some(item => !!item.icon);\n\t\tthis.items.forEach(item => {\n\t\t\tif (item.text.toLowerCase().includes(searchValue)) {\n\t\t\t\tthis._filteredItems.push(item);\n\t\t\t}\n\n\t\t\tif (item.selected) {\n\t\t\t\tthis._selectedSetting = item;\n\t\t\t}\n\t\t\titem._siblingsWithIcon = siblingsWithIcon;\n\t\t\titem._inMobileView = this._showSettingWithNavigation;\n\t\t});\n\n\t\tthis.fixedItems.forEach(item => {\n\t\t\tif (item.text.toLowerCase().includes(searchValue)) {\n\t\t\t\tthis._filteredFixedItems.push(item);\n\t\t\t}\n\n\t\t\tif (item.selected) {\n\t\t\t\tthis._selectedSetting = item;\n\t\t\t}\n\t\t\titem._inMobileView = this._showSettingWithNavigation;\n\t\t});\n\n\t\tif (this._filteredItems.length === 0 && this._filteredFixedItems.length === 0) {\n\t\t\tthis._showNoSearchResult = true;\n\t\t} else {\n\t\t\tthis._showNoSearchResult = false;\n\t\t}\n\n\t\tif (!this._selectedSetting) {\n\t\t\tthis._selectedSetting = this.items[0] \|\| this.fixedItems[0];\n\t\t}\n\n\t\tconst allItems = [...this.items, ...this.fixedItems];\n\t\tallItems.forEach(item => {\n\t\t\tif (item === this._selectedSetting) {\n\t\t\t\titem.setAttribute(\"data-sap-ui-fastnavgroup\", \"true\");\n\t\t\t} else {\n\t\t\t\titem.removeAttribute(\"data-sap-ui-fastnavgroup\");\n\t\t\t}\n\t\t});\n\t}\n\n\t_handleItemClick(e: CustomEvent<ListItemClickEventDetail>) {\n\t\tconst setting = e.detail.item as ListItemBase & { associatedSettingItem: UserSettingsItem };\n\t\tconst settingItem = setting.associatedSettingItem;\n\t\tconst eventPrevented = !this.fireDecoratorEvent(\"selection-change\", {\n\t\t\titem: settingItem,\n\t\t});\n\t\tthis._collapsed = true;\n\n\t\tif (!eventPrevented) {\n\t\t\tthis.items.forEach(item => {\n\t\t\t\titem.selected = false;\n\t\t\t});\n\t\t\tthis.fixedItems.forEach(item => {\n\t\t\t\titem.selected = false;\n\t\t\t});\n\t\t\tsettingItem.selected = true;\n\t\t}\n\t}\n\n\t_handleDialogAfterOpen() {\n\t\tthis.fireDecoratorEvent(\"open\");\n\t}\n\n\t_handleDialogBeforeClose(e: CustomEvent<PopupBeforeCloseEventDetail>) {\n\t\tif (!e.detail.escPressed) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst eventPrevented = !this.fireDecoratorEvent(\"before-close\", e.detail);\n\n\t\tif (eventPrevented) {\n\t\t\te.preventDefault();\n\t\t}\n\t}\n\n\t_handleDialogAfterClose() {\n\t\tthis.open = false;\n\t\tthis.fireDecoratorEvent(\"close\");\n\t}\n\n\tget accessibleNameText() {\n\t\treturn UserSettingsDialog.i18nBundle.getText(USER_SETTINGS_DIALOG_ACCESSIBLE_NAME);\n\t}\n\n\tget ariaRoleDescList() {\n\t\treturn UserSettingsDialog.i18nBundle.getText(USER_SETTINGS_LIST_ARIA_ROLE_DESC);\n\t}\n\n\tget closeButtonText() {\n\t\treturn UserSettingsDialog.i18nBundle.getText(USER_SETTINGS_DIALOG_CLOSE_BUTTON_TEXT);\n\t}\n\tget saveButtonText() {\n\t\treturn UserSettingsDialog.i18nBundle.getText(USER_SETTINGS_DIALOG_SAVE_BUTTON_TEXT);\n\t}\n\tget cancelButtonText() {\n\t\treturn UserSettingsDialog.i18nBundle.getText(USER_SETTINGS_DIALOG_CANCEL_BUTTON_TEXT);\n\t}\n\tget noSearchResultsText() {\n\t\treturn UserSettingsDialog.i18nBundle.getText(USER_SETTINGS_DIALOG_NO_SEARCH_RESULTS_TEXT);\n\t}\n\n\tget _selectedItemSlotName() {\n\t\treturn this._selectedSetting ? this._selectedSetting._individualSlot : \"\";\n\t}\n\n\tget _showSettingWithNavigation() {\n\t\treturn (isPhone() \|\| (isTablet() && !isCombi())) \|\| (this._mediaRange === \"S\" \|\| this._mediaRange === \"M\");\n\t}\n\n\t_handleCloseButtonClick() {\n\t\tconst eventPrevented = !this.fireDecoratorEvent(\"before-close\", { escPressed: false });\n\n\t\tif (!eventPrevented) {\n\t\t\tthis.open = false;\n\t\t}\n\t}\n\n\t_handleSaveButtonClick() {\n\t\tthis.fireDecoratorEvent(\"save\");\n\t}\n\n\t_handleCancelButtonClick() {\n\t\tthis.fireDecoratorEvent(\"cancel\");\n\t}\n\n\t_handleCollapseClick() {\n\t\tthis._collapsed = false;\n\t}\n\n\t_handleInput(e: CustomEvent<InputEventDetail>) {\n\t\tthis._searchValue = (e.target as Input).value;\n\t}\n\n\tcaptureRef(ref: HTMLElement & { associatedSettingItem?: UI5Element} \| null) {\n\t\tif (ref) {\n\t\t\tref.associatedSettingItem = this;\n\t\t}\n\t}\n}\n\nUserSettingsDialog.define();\n\nexport default UserSettingsDialog;\nexport type {\n\tUserSettingsItemSelectEventDetail,\n\tUserSettingsBeforeCloseEventDetail,\n};\n"]}
1	+ {"version":3,"file":"UserSettingsDialog.js","sourceRoot":"","sources":["../src/UserSettingsDialog.ts"],"names":[],"mappings":"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","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport type { Slot, DefaultSlot } from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport {\n\tcustomElement, property, slotStrict as slot, eventStrict as event,\n} from \"@ui5/webcomponents-base/dist/decorators.js\";\nimport jsxRenderer from \"@ui5/webcomponents-base/dist/renderer/JsxRenderer.js\";\nimport type Input from \"@ui5/webcomponents/dist/Input.js\";\nimport type { InputEventDetail } from \"@ui5/webcomponents/dist/Input.js\";\nimport type { ListItemClickEventDetail } from \"@ui5/webcomponents/dist/List.js\";\nimport i18n from \"@ui5/webcomponents-base/dist/decorators/i18n.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport type ListItemBase from \"@ui5/webcomponents/dist/ListItemBase.js\";\nimport type { PopupBeforeCloseEventDetail } from \"@ui5/webcomponents/dist/Popup.js\";\nimport { isPhone, isTablet, isCombi } from \"@ui5/webcomponents-base/dist/Device.js\";\nimport { renderFinished } from \"@ui5/webcomponents-base/dist/Render.js\";\nimport MediaRange from \"@ui5/webcomponents-base/dist/MediaRange.js\";\nimport announce from \"@ui5/webcomponents-base/dist/util/InvisibleMessage.js\";\nimport InvisibleMessageMode from \"@ui5/webcomponents-base/dist/types/InvisibleMessageMode.js\";\nimport UserSettingsDialogTemplate from \"./UserSettingsDialogTemplate.js\";\nimport type UserSettingsItem from \"./UserSettingsItem.js\";\nimport UserSettingsDialogCss from \"./generated/themes/UserSettingsDialog.css.js\";\n\n// Texts\nimport {\n\tUSER_SETTINGS_DIALOG_ACCESSIBLE_NAME,\n\tUSER_SETTINGS_LIST_ARIA_ROLE_DESC,\n\tUSER_SETTINGS_DIALOG_CLOSE_BUTTON_TEXT,\n\tUSER_SETTINGS_DIALOG_SAVE_BUTTON_TEXT,\n\tUSER_SETTINGS_DIALOG_CANCEL_BUTTON_TEXT,\n\tUSER_SETTINGS_DIALOG_NO_SEARCH_RESULTS_TEXT,\n\tUSER_SETTINGS_DIALOG_SEARCH_NO_RESULTS,\n\tUSER_SETTINGS_DIALOG_SEARCH_ONE_RESULT,\n\tUSER_SETTINGS_DIALOG_SEARCH_MORE_RESULTS,\n} from \"./generated/i18n/i18n-defaults.js\";\n\ntype UserSettingsItemSelectEventDetail = {\n\titem: UserSettingsItem;\n}\n\ntype UserSettingsBeforeCloseEventDetail = PopupBeforeCloseEventDetail;\n\n/*\n @class\n * ### Overview\n \n The `ui5-user-settings-dialog` is an SAP Fiori-specific web component used in the `ui5-user-menu`.\n * It allows the user to easily view information and settings for an account.\n \n ### ES6 Module Import\n * `import \"@ui5/webcomponents-fiori/dist/UserSettingsDialog.js\";`\n \n @constructor\n * @extends UI5Element\n * @public\n * @since 2.8.0\n /\n@customElement({\n\ttag: \"ui5-user-settings-dialog\",\n\trenderer: jsxRenderer,\n\ttemplate: UserSettingsDialogTemplate,\n\tstyles: [UserSettingsDialogCss],\n})\n\n/\n Fired when an item is selected.\n * @param {UserSettingsItem} item The selected `user settings item`.\n * @public\n /\n@event(\"selection-change\", {\n\tcancelable: true,\n})\n\n/\n Fired when the settings dialog is opened.\n * @public\n /\n@event(\"open\")\n\n/\n Fired before the settings dialog is closed.\n \n Note: This event is cancelable via `preventDefault()`, allowing the application to keep the\n * dialog open — for example, to prompt the user about unsaved changes before dismissal.\n * @public\n /\n@event(\"before-close\", {\n\tcancelable: true,\n})\n\n/\n Fired when the settings dialog is closed.\n * @public\n /\n@event(\"close\")\n\n/\n Fired when the Save button in the footer is clicked.\n * The dialog does not close automatically — the application is responsible\n * for closing it after persisting the changes.\n * @public\n /\n@event(\"save\")\n\n/\n Fired when the Cancel button in the footer is clicked.\n * The dialog does not close automatically — the application is responsible\n * for closing it after discarding the changes.\n * @public\n /\n@event(\"cancel\")\n\nclass UserSettingsDialog extends UI5Element {\n\teventDetails!: {\n\t\t\"selection-change\": UserSettingsItemSelectEventDetail,\n\t\t\"open\": void,\n\t\t\"before-close\": UserSettingsBeforeCloseEventDetail,\n\t\t\"close\": void,\n\t\t\"save\": void,\n\t\t\"cancel\": void,\n\t};\n\t/\n\t Defines, if the User Settings Dialog is opened.\n\t \n\t @default false\n\t * @public\n\t /\n\t@property({ type: Boolean })\n\topen = false;\n\n\t/\n\t Defines the headerText of the item.\n\t \n\t @public\n\t * @default undefined\n\t /\n\t@property({ type: String })\n\theaderText?: string;\n\n\t/\n\t Defines if the Search Field would be displayed.\n\t \n\t Note: By default the Search Field is not displayed.\n\t * @default false\n\t * @public\n\t /\n\t@property({ type: Boolean })\n\tshowSearchField = false;\n\n\t/\n\t Defines whether the dialog offers Save and Cancel actions in its footer.\n\t \n\t When true, the footer renders a Save (Emphasized) and a Cancel button\n\t * instead of the default Close button. Save and Cancel each fire a\n\t * corresponding event; the application is responsible for closing the\n\t * dialog (typically after persisting or discarding the changes).\n\t \n\t @default false\n\t * @public\n\t /\n\t@property({ type: Boolean })\n\tsaveMode = false;\n\n\t/\n\t Defines the user settings items.\n\t \n\t Note: If no setting item is set as `selected`, the first one will be selected.\n\t * @public\n\t /\n\t@slot({\n\t\t\"default\": true,\n\t\ttype: HTMLElement,\n\t\tindividualSlots: true,\n\t\tinvalidateOnChildChange: {\n\t\t\tproperties: true,\n\t\t\tslots: true,\n\t\t},\n\t})\n\titems!: DefaultSlot<UserSettingsItem>;\n\n\t/\n\t Defines the fixed user settings items.\n\t \n\t @public\n\t /\n\t@slot({\n\t\ttype: HTMLElement,\n\t\tindividualSlots: true,\n\t\tinvalidateOnChildChange: {\n\t\t\tproperties: true,\n\t\t\tslots: true,\n\t\t},\n\t})\n\tfixedItems!: Slot<UserSettingsItem>;\n\n\t@i18n(\"@ui5/webcomponents-fiori\")\n\tstatic i18nBundle: I18nBundle;\n\n\t/\n\t @private\n\t /\n\t@property({ type: String })\n\t_searchValue = \"\";\n\n\t/\n\t @private\n\t /\n\t@property({ type: Boolean })\n\t_collapsed = false;\n\n\t/\n\t @private\n\t /\n\t@property({ type: Object })\n\t_selectedSetting?: UserSettingsItem;\n\n\t/\n\t @private\n\t /\n\t_filteredItems: Array<UserSettingsItem> = [];\n\n\t/\n\t @private\n\t /\n\t_filteredFixedItems: Array<UserSettingsItem> = [];\n\n\t/\n\t @private\n\t /\n\t@property({ type: Boolean })\n\t_showNoSearchResult = false;\n\n\t/\n\t Indicates that the user changed the search value and the search\n\t * results should be announced on the next rendering.\n\t * @private\n\t /\n\t_announceSearchResults = false;\n\n\t/\n\t Defines the current media query size.\n\t * @private\n\t */\n\t@property({ type: String })\n\t_mediaRange?: any;\n\n\tonEnterDOM() {\n\t\tthis.setAttribute(\"data-sap-ui-fastnavgroup-container\", \"true\");\n\t}\n\n\tonBeforeRendering() {\n\t\tthis._mediaRange = MediaRange.getCurrentRange(MediaRange.RANGESETS.RANGE_4STEPS);\n\t\tconst searchValue = this._searchValue.toLowerCase();\n\t\tthis._filteredItems = [];\n\t\tthis._filteredFixedItems = [];\n\t\tconst siblingsWithIcon = this.items.some(item => !!item.icon);\n\t\tthis.items.forEach(item => {\n\t\t\tif (item.text.toLowerCase().includes(searchValue)) {\n\t\t\t\tthis._filteredItems.push(item);\n\t\t\t}\n\n\t\t\tif (item.selected) {\n\t\t\t\tthis._selectedSetting = item;\n\t\t\t}\n\t\t\titem._siblingsWithIcon = siblingsWithIcon;\n\t\t\titem._inMobileView = this._showSettingWithNavigation;\n\t\t});\n\n\t\tthis.fixedItems.forEach(item => {\n\t\t\tif (item.text.toLowerCase().includes(searchValue)) {\n\t\t\t\tthis._filteredFixedItems.push(item);\n\t\t\t}\n\n\t\t\tif (item.selected) {\n\t\t\t\tthis._selectedSetting = item;\n\t\t\t}\n\t\t\titem._inMobileView = this._showSettingWithNavigation;\n\t\t});\n\n\t\tif (this._filteredItems.length === 0 && this._filteredFixedItems.length === 0) {\n\t\t\tthis._showNoSearchResult = true;\n\t\t} else {\n\t\t\tthis._showNoSearchResult = false;\n\t\t}\n\n\t\tif (this._announceSearchResults) {\n\t\t\tthis._announceSearchResults = false;\n\t\t\tannounce(this._searchResultsText, InvisibleMessageMode.Polite);\n\t\t}\n\n\t\tif (!this._selectedSetting) {\n\t\t\tthis._selectedSetting = this.items[0] \|\| this.fixedItems[0];\n\t\t}\n\n\t\tconst allItems = [...this.items, ...this.fixedItems];\n\t\tallItems.forEach(item => {\n\t\t\tif (item === this._selectedSetting) {\n\t\t\t\titem.setAttribute(\"data-sap-ui-fastnavgroup\", \"true\");\n\t\t\t} else {\n\t\t\t\titem.removeAttribute(\"data-sap-ui-fastnavgroup\");\n\t\t\t}\n\t\t});\n\t}\n\n\tasync _handleItemClick(e: CustomEvent<ListItemClickEventDetail>) {\n\t\tconst setting = e.detail.item as ListItemBase & { associatedSettingItem: UserSettingsItem };\n\t\tconst settingItem = setting.associatedSettingItem;\n\t\tconst eventPrevented = !this.fireDecoratorEvent(\"selection-change\", {\n\t\t\titem: settingItem,\n\t\t});\n\t\tconst shouldNavigate = this._showSettingWithNavigation;\n\t\tthis._collapsed = true;\n\n\t\tif (!eventPrevented) {\n\t\t\tthis.items.forEach(item => {\n\t\t\t\titem.selected = false;\n\t\t\t});\n\t\t\tthis.fixedItems.forEach(item => {\n\t\t\t\titem.selected = false;\n\t\t\t});\n\t\t\tsettingItem.selected = true;\n\t\t}\n\n\t\t// In navigation (single-column) mode the content replaces the list, so move the\n\t\t// focus to the first interactive element of the content instead of losing it.\n\t\tif (shouldNavigate) {\n\t\t\tawait renderFinished();\n\t\t\tthis._selectedSetting?.focusFirstContentElement();\n\t\t}\n\t}\n\n\t_handleDialogAfterOpen() {\n\t\tthis.fireDecoratorEvent(\"open\");\n\t}\n\n\t_handleDialogBeforeClose(e: CustomEvent<PopupBeforeCloseEventDetail>) {\n\t\tif (!e.detail.escPressed) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst eventPrevented = !this.fireDecoratorEvent(\"before-close\", e.detail);\n\n\t\tif (eventPrevented) {\n\t\t\te.preventDefault();\n\t\t}\n\t}\n\n\t_handleDialogAfterClose() {\n\t\tthis.open = false;\n\t\tthis.fireDecoratorEvent(\"close\");\n\t}\n\n\tget accessibleNameText() {\n\t\treturn UserSettingsDialog.i18nBundle.getText(USER_SETTINGS_DIALOG_ACCESSIBLE_NAME);\n\t}\n\n\tget ariaRoleDescList() {\n\t\treturn UserSettingsDialog.i18nBundle.getText(USER_SETTINGS_LIST_ARIA_ROLE_DESC);\n\t}\n\n\tget closeButtonText() {\n\t\treturn UserSettingsDialog.i18nBundle.getText(USER_SETTINGS_DIALOG_CLOSE_BUTTON_TEXT);\n\t}\n\tget saveButtonText() {\n\t\treturn UserSettingsDialog.i18nBundle.getText(USER_SETTINGS_DIALOG_SAVE_BUTTON_TEXT);\n\t}\n\tget cancelButtonText() {\n\t\treturn UserSettingsDialog.i18nBundle.getText(USER_SETTINGS_DIALOG_CANCEL_BUTTON_TEXT);\n\t}\n\tget noSearchResultsText() {\n\t\treturn UserSettingsDialog.i18nBundle.getText(USER_SETTINGS_DIALOG_NO_SEARCH_RESULTS_TEXT);\n\t}\n\n\tget _searchResultsText() {\n\t\tconst resultsCount = this._filteredItems.length + this._filteredFixedItems.length;\n\n\t\tswitch (resultsCount) {\n\t\tcase 0:\n\t\t\treturn UserSettingsDialog.i18nBundle.getText(USER_SETTINGS_DIALOG_SEARCH_NO_RESULTS);\n\t\tcase 1:\n\t\t\treturn UserSettingsDialog.i18nBundle.getText(USER_SETTINGS_DIALOG_SEARCH_ONE_RESULT);\n\t\tdefault:\n\t\t\treturn UserSettingsDialog.i18nBundle.getText(USER_SETTINGS_DIALOG_SEARCH_MORE_RESULTS, resultsCount);\n\t\t}\n\t}\n\n\tget _selectedItemSlotName() {\n\t\treturn this._selectedSetting ? this._selectedSetting._individualSlot : \"\";\n\t}\n\n\tget _showSettingWithNavigation() {\n\t\treturn (isPhone() \|\| (isTablet() && !isCombi())) \|\| (this._mediaRange === \"S\" \|\| this._mediaRange === \"M\");\n\t}\n\n\t_handleCloseButtonClick() {\n\t\tconst eventPrevented = !this.fireDecoratorEvent(\"before-close\", { escPressed: false });\n\n\t\tif (!eventPrevented) {\n\t\t\tthis.open = false;\n\t\t}\n\t}\n\n\t_handleSaveButtonClick() {\n\t\tthis.fireDecoratorEvent(\"save\");\n\t}\n\n\t_handleCancelButtonClick() {\n\t\tthis.fireDecoratorEvent(\"cancel\");\n\t}\n\n\tasync _handleCollapseClick() {\n\t\tthis._collapsed = false;\n\n\t\t// The side list replaces the content, so return the focus to the\n\t\t// user settings item that was selected instead of losing it.\n\t\tawait renderFinished();\n\t\tconst selectedListItem = this._selectedSetting\n\t\t\t? this.shadowRoot!.querySelector<HTMLElement>(`#setting-${this._selectedSetting._id}`)\n\t\t\t: null;\n\t\tselectedListItem?.focus();\n\t}\n\n\t_handleInput(e: CustomEvent<InputEventDetail>) {\n\t\tthis._searchValue = (e.target as Input).value;\n\t\tthis._announceSearchResults = true;\n\t}\n\n\tcaptureRef(ref: HTMLElement & { associatedSettingItem?: UI5Element} \| null) {\n\t\tif (ref) {\n\t\t\tref.associatedSettingItem = this;\n\t\t}\n\t}\n}\n\nUserSettingsDialog.define();\n\nexport default UserSettingsDialog;\nexport type {\n\tUserSettingsItemSelectEventDetail,\n\tUserSettingsBeforeCloseEventDetail,\n};\n"]}

package/dist/UserSettingsDialogTemplate.js CHANGED Viewed

@@ -15,9 +15,9 @@ export default function UserSettingsDialogTemplate() {
                                         _jsx(Input, { placeholder: "Search", type: "Search", class: "ui5-user-settings-side-search", onInput: this._handleInput, children: _jsx(Icon, { id: "searchFieldIcon", slot: "icon", name: search, showTooltip: true }) })] }), this._showNoSearchResult ?
                                 _jsx("div", { class: "ui5-user-settings-side-search", children: _jsx(Text, { children: this.noSearchResultsText }) })
                                 :
-                                    renderList.call(this, this._filteredItems, "ui5-user-settings-side-items"), this._filteredFixedItems.length > 0 && renderList.call(this, this._filteredFixedItems, "ui5-user-settings-side-fixedItems")] }), _jsx("div", { class: "ui5-user-settings-content", children: _jsx("slot", { name: this._selectedItemSlotName }) })] }), _jsx(Toolbar, { slot: "footer", design: "Transparent", "data-sap-ui-fastnavgroup": "true", children: this.saveMode ? (_jsxs(_Fragment, { children: [_jsx(ToolbarButton, { design: "Emphasized", text: this.saveButtonText, onClick: this._handleSaveButtonClick }), _jsx(ToolbarButton, { design: "Transparent", text: this.cancelButtonText, onClick: this._handleCancelButtonClick })] })) : (_jsx(ToolbarButton, { design: "Transparent", text: this.closeButtonText, onClick: this._handleCloseButtonClick })) })] }));
+                                    renderList.call(this, this._filteredItems, "ui5-user-settings-side-items"), this._filteredFixedItems.length > 0 && renderList.call(this, this._filteredFixedItems, "ui5-user-settings-side-fixedItems")] }), _jsx("div", { class: "ui5-user-settings-content", children: _jsx("slot", { name: this._selectedItemSlotName }) })] }), _jsx(Toolbar, { slot: "footer", design: "Transparent", "data-sap-ui-fastnavgroup": "true", children: this.saveMode ? (_jsxs(_Fragment, { children: [_jsx(ToolbarButton, { id: `${this._id}-save-btn`, design: "Emphasized", text: this.saveButtonText, onClick: this._handleSaveButtonClick }), _jsx(ToolbarButton, { id: `${this._id}-cancel-btn`, design: "Transparent", text: this.cancelButtonText, onClick: this._handleCancelButtonClick })] })) : (_jsx(ToolbarButton, { id: `${this._id}-close-btn`, design: "Transparent", text: this.closeButtonText, onClick: this._handleCloseButtonClick })) })] }));
 }
 function renderList(items = [], classes) {
-    return _jsx(List, { accessibleRole: "Menu", onItemClick: this._handleItemClick, class: classes, separators: "None", "data-sap-ui-fastnavgroup": "false", children: items.map(item => (_jsx(ListItemStandard, { class: !item._icon && item._siblingsWithIcon ? "ui5-user-settings-item-no-icon" : "", id: `setting-${item._id}`, icon: !item._icon && item._siblingsWithIcon ? undefined : item._icon, tooltip: item._tooltip, ref: this.captureRef.bind(item), selected: item.selected, disabled: item.disabled, accessibleName: item.ariaLabelledByText, type: this._showSettingWithNavigation ? "Navigation" : "Active", children: item.text }))) });
+    return _jsx(List, { onItemClick: this._handleItemClick, class: classes, separators: "None", "data-sap-ui-fastnavgroup": "false", children: items.map(item => (_jsx(ListItemStandard, { class: !item._icon && item._siblingsWithIcon ? "ui5-user-settings-item-no-icon" : "", id: `setting-${item._id}`, icon: !item._icon && item._siblingsWithIcon ? undefined : item._icon, tooltip: item._tooltip, ref: this.captureRef.bind(item), selected: item.selected, disabled: item.disabled, accessibleName: item.ariaLabelledByText, type: this._showSettingWithNavigation ? "Navigation" : "Active", children: item.text }))) });
 }
 //# sourceMappingURL=UserSettingsDialogTemplate.js.map

package/dist/UserSettingsDialogTemplate.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"UserSettingsDialogTemplate.js","sourceRoot":"","sources":["../src/UserSettingsDialogTemplate.tsx"],"names":[],"mappings":";AACA,OAAO,MAAM,MAAM,mCAAmC,CAAC;AACvD,OAAO,KAAK,MAAM,kCAAkC,CAAC;AACrD,OAAO,KAAK,MAAM,kCAAkC,CAAC;AACrD,OAAO,IAAI,MAAM,iCAAiC,CAAC;AACnD,OAAO,IAAI,MAAM,iCAAiC,CAAC;AACnD,OAAO,IAAI,MAAM,iCAAiC,CAAC;AACnD,OAAO,gBAAgB,MAAM,6CAA6C,CAAC;AAC3E,OAAO,aAAa,MAAM,0CAA0C,CAAC;AACrE,OAAO,OAAO,MAAM,oCAAoC,CAAC;AACzD,OAAO,MAAM,MAAM,yCAAyC,CAAC;AAG7D,MAAM,CAAC,OAAO,UAAU,0BAA0B;IACjD,OAAO,CAEN,MAAC,MAAM,IAAC,KAAK,EAAC,0BAA0B,EACvC,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,OAAO,QACP,cAAc,EAAE,IAAI,CAAC,kBAAkB,qBACtB,IAAI,CAAC,oBAAoB,EAC1C,MAAM,EAAE,IAAI,CAAC,sBAAsB,EACnC,aAAa,EAAE,IAAI,CAAC,wBAAwB,EAC5C,OAAO,EAAE,IAAI,CAAC,uBAAuB,EACrC,YAAY,EAAE,WAAW,IAAI,CAAC,gBAAgB,EAAE,GAAG,EAAE,aAErD,eAAK,KAAK,EAAC,wBAAwB,aAClC,eAAK,KAAK,EAAC,wBAAwB,8BAA0B,MAAM,0BAAuB,IAAI,CAAC,gBAAgB,aAC9G,eAAK,KAAK,EAAC,+BAA+B,aACxC,IAAI,CAAC,UAAU;wCACf,KAAC,KAAK,IAAC,KAAK,EAAC,IAAI,EAAC,IAAI,EAAC,IAAI,YAAE,IAAI,CAAC,UAAU,GAAS,EAErD,IAAI,CAAC,eAAe;wCACpB,KAAC,KAAK,IAAC,WAAW,EAAC,QAAQ,EAAC,IAAI,EAAC,QAAQ,EAAC,KAAK,EAAC,+BAA+B,EAC3E,OAAO,EAAE,IAAI,CAAC,YAAY,YAC7B,KAAC,IAAI,IAAC,EAAE,EAAC,iBAAiB,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAE,MAAM,EAAE,WAAW,SAAQ,GACjE,IAEJ,EACL,IAAI,CAAC,mBAAmB,CAAC,CAAC;gCAC1B,cAAK,KAAK,EAAC,+BAA+B,YACzC,KAAC,IAAI,cAAE,IAAI,CAAC,mBAAmB,GAAQ,GAClC;gCACN,CAAC;oCACD,UAAU,CAAC,IAAI,CAAC,IAAI,EAAE,IAAI,CAAC,cAAc,EAAE,8BAA8B,CAAC,EAE1E,IAAI,CAAC,mBAAmB,CAAC,MAAM,GAAG,CAAC,IAAI,UAAU,CAAC,IAAI,CAAC,IAAI,EAAE,IAAI,CAAC,mBAAmB,EAAE,mCAAmC,CAAC,IACvH,EAEN,cAAK,KAAK,EAAC,2BAA2B,YACrC,eAAM,IAAI,EAAE,IAAI,CAAC,qBAAqB,GAAS,GAC1C,IACD,EAEN,KAAC,OAAO,IAAC,IAAI,EAAC,QAAQ,EAAC,MAAM,EAAC,aAAa,8BAA0B,MAAM,YACzE,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAChB,8BACC,KAAC,aAAa,IAAC,MAAM,EAAC,YAAY,EAAC,IAAI,EAAE,IAAI,CAAC,cAAc,EAAE,OAAO,EAAE,IAAI,CAAC,sBAAsB,GAAI,~~EACtG~~,KAAC,aAAa,IAAC,MAAM,EAAC,aAAa,EAAC,IAAI,EAAE,IAAI,CAAC,gBAAgB,EAAE,OAAO,EAAE,IAAI,CAAC,wBAAwB,GAAI,~~IACzG~~,CACH,CAAC,CAAC,CAAC,CACH,KAAC,aAAa,IAAC,MAAM,EAAC,aAAa,EAAC,IAAI,EAAE,IAAI,CAAC,eAAe,EAAE,OAAO,EAAE,IAAI,CAAC,uBAAuB,GAAI,~~CACzG~~,GACQ,IACF,CACT,CAAC;AACH,CAAC;AAED,SAAS,UAAU,CAA2B,QAAiC,EAAE,EAAE,OAAe;IACjG,OAAO,KAAC,IAAI,IAAC,~~cAAc,EAAC,MAAM,EAAC,~~WAAW,EAAE,IAAI,CAAC,gBAAgB,EAAE,KAAK,EAAE,OAAO,EAAE,UAAU,EAAC,MAAM,8BAA0B,OAAO,~~YACvI~~,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,CAClB,KAAC,gBAAgB,IAChB,KAAK,EAAE,CAAC,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC,gCAAgC,CAAC,CAAC,CAAC,EAAE,EACpF,EAAE,EAAE,WAAW,IAAI,CAAC,GAAG,EAAE,EACzB,IAAI,EAAE,CAAC,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,EACpE,OAAO,EAAE,IAAI,CAAC,QAAQ,EACtB,GAAG,EAAE,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,EAC/B,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,cAAc,EAAE,IAAI,CAAC,kBAAkB,EACvC,IAAI,EAAE,IAAI,CAAC,0BAA0B,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,QAAQ,YAE9D,IAAI,CAAC,IAAI,GACQ,CACnB,CAAC,GACI,CAAC;AACT,CAAC","sourcesContent":["import type UserSettingsDialog from \"./UserSettingsDialog.js\";\nimport Dialog from \"@ui5/webcomponents/dist/Dialog.js\";\nimport Title from \"@ui5/webcomponents/dist/Title.js\";\nimport Input from \"@ui5/webcomponents/dist/Input.js\";\nimport Text from \"@ui5/webcomponents/dist/Text.js\";\nimport Icon from \"@ui5/webcomponents/dist/Icon.js\";\nimport List from \"@ui5/webcomponents/dist/List.js\";\nimport ListItemStandard from \"@ui5/webcomponents/dist/ListItemStandard.js\";\nimport ToolbarButton from \"@ui5/webcomponents/dist/ToolbarButton.js\";\nimport Toolbar from \"@ui5/webcomponents/dist/Toolbar.js\";\nimport search from \"@ui5/webcomponents-icons/dist/search.js\";\nimport type UserSettingsItem from \"./UserSettingsItem.js\";\n\nexport default function UserSettingsDialogTemplate(this: UserSettingsDialog) {\n\treturn (\n\n\t\t<Dialog class=\"ui5-user-settings-dialog\"\n\t\t\topen={this.open}\n\t\t\tstretch\n\t\t\taccessibleName={this.accessibleNameText}\n\t\t\tonui5-_collapse={this._handleCollapseClick}\n\t\t\tonOpen={this._handleDialogAfterOpen}\n\t\t\tonBeforeClose={this._handleDialogBeforeClose}\n\t\t\tonClose={this._handleDialogAfterClose}\n\t\t\tinitialFocus={`setting-${this._selectedSetting?._id}`}\n\t\t>\n\t\t\t<div class=\"ui5-user-settings-root\">\n\t\t\t\t<div class=\"ui5-user-settings-side\" data-sap-ui-fastnavgroup=\"true\" aria-roledescription={this.ariaRoleDescList}>\n\t\t\t\t\t<div class=\"ui5-user-settings-side-header\">\n\t\t\t\t\t\t{this.headerText &&\n\t\t\t\t\t\t\t<Title level=\"H1\" size=\"H5\">{this.headerText}</Title>\n\t\t\t\t\t\t}\n\t\t\t\t\t\t{this.showSearchField &&\n\t\t\t\t\t\t\t<Input placeholder=\"Search\" type=\"Search\" class=\"ui5-user-settings-side-search\"\n\t\t\t\t\t\t\t\t onInput={this._handleInput}>\n\t\t\t\t\t\t\t\t<Icon id=\"searchFieldIcon\" slot=\"icon\" name={search} showTooltip></Icon>\n\t\t\t\t\t\t\t</Input>\n\t\t\t\t\t\t}\n\t\t\t\t\t</div>\n\t\t\t\t\t{this._showNoSearchResult ?\n\t\t\t\t\t\t<div class=\"ui5-user-settings-side-search\">\n\t\t\t\t\t\t\t<Text>{this.noSearchResultsText}</Text>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t:\n\t\t\t\t\t\trenderList.call(this, this._filteredItems, \"ui5-user-settings-side-items\")}\n\n\t\t\t\t\t{this._filteredFixedItems.length > 0 && renderList.call(this, this._filteredFixedItems, \"ui5-user-settings-side-fixedItems\")}\n\t\t\t\t</div>\n\n\t\t\t\t<div class=\"ui5-user-settings-content\">\n\t\t\t\t\t<slot name={this._selectedItemSlotName}></slot>\n\t\t\t\t</div>\n\t\t\t</div>\n\n\t\t\t<Toolbar slot=\"footer\" design=\"Transparent\" data-sap-ui-fastnavgroup=\"true\">\n\t\t\t\t{this.saveMode ? (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<ToolbarButton design=\"Emphasized\" text={this.saveButtonText} onClick={this._handleSaveButtonClick} />\n\t\t\t\t\t\t<ToolbarButton design=\"Transparent\" text={this.cancelButtonText} onClick={this._handleCancelButtonClick} />\n\t\t\t\t\t</>\n\t\t\t\t) : (\n\t\t\t\t\t<ToolbarButton design=\"Transparent\" text={this.closeButtonText} onClick={this._handleCloseButtonClick} />\n\t\t\t\t)}\n\t\t\t</Toolbar>\n\t\t</Dialog>\n\t);\n}\n\nfunction renderList(this: UserSettingsDialog, items: Array<UserSettingsItem> = [], classes: string) {\n\treturn <List ~~accessibleRole=\"Menu\"~~ onItemClick={this._handleItemClick} class={classes} separators=\"None\" data-sap-ui-fastnavgroup=\"false\">\n\t\t{items.map(item => (\n\t\t\t<ListItemStandard\n\t\t\t\tclass={!item._icon && item._siblingsWithIcon ? \"ui5-user-settings-item-no-icon\" : \"\"}\n\t\t\t\tid={`setting-${item._id}`}\n\t\t\t\ticon={!item._icon && item._siblingsWithIcon ? undefined : item._icon}\n\t\t\t\ttooltip={item._tooltip}\n\t\t\t\tref={this.captureRef.bind(item)}\n\t\t\t\tselected={item.selected}\n\t\t\t\tdisabled={item.disabled}\n\t\t\t\taccessibleName={item.ariaLabelledByText}\n\t\t\t\ttype={this._showSettingWithNavigation ? \"Navigation\" : \"Active\"}\n\t\t\t>\n\t\t\t\t{item.text}\n\t\t\t</ListItemStandard>\n\t\t))}\n\t</List>;\n}\n"]}
1	+ {"version":3,"file":"UserSettingsDialogTemplate.js","sourceRoot":"","sources":["../src/UserSettingsDialogTemplate.tsx"],"names":[],"mappings":"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","sourcesContent":["import type UserSettingsDialog from \"./UserSettingsDialog.js\";\nimport Dialog from \"@ui5/webcomponents/dist/Dialog.js\";\nimport Title from \"@ui5/webcomponents/dist/Title.js\";\nimport Input from \"@ui5/webcomponents/dist/Input.js\";\nimport Text from \"@ui5/webcomponents/dist/Text.js\";\nimport Icon from \"@ui5/webcomponents/dist/Icon.js\";\nimport List from \"@ui5/webcomponents/dist/List.js\";\nimport ListItemStandard from \"@ui5/webcomponents/dist/ListItemStandard.js\";\nimport ToolbarButton from \"@ui5/webcomponents/dist/ToolbarButton.js\";\nimport Toolbar from \"@ui5/webcomponents/dist/Toolbar.js\";\nimport search from \"@ui5/webcomponents-icons/dist/search.js\";\nimport type UserSettingsItem from \"./UserSettingsItem.js\";\n\nexport default function UserSettingsDialogTemplate(this: UserSettingsDialog) {\n\treturn (\n\n\t\t<Dialog class=\"ui5-user-settings-dialog\"\n\t\t\topen={this.open}\n\t\t\tstretch\n\t\t\taccessibleName={this.accessibleNameText}\n\t\t\tonui5-_collapse={this._handleCollapseClick}\n\t\t\tonOpen={this._handleDialogAfterOpen}\n\t\t\tonBeforeClose={this._handleDialogBeforeClose}\n\t\t\tonClose={this._handleDialogAfterClose}\n\t\t\tinitialFocus={`setting-${this._selectedSetting?._id}`}\n\t\t>\n\t\t\t<div class=\"ui5-user-settings-root\">\n\t\t\t\t<div class=\"ui5-user-settings-side\" data-sap-ui-fastnavgroup=\"true\" aria-roledescription={this.ariaRoleDescList}>\n\t\t\t\t\t<div class=\"ui5-user-settings-side-header\">\n\t\t\t\t\t\t{this.headerText &&\n\t\t\t\t\t\t\t<Title level=\"H1\" size=\"H5\">{this.headerText}</Title>\n\t\t\t\t\t\t}\n\t\t\t\t\t\t{this.showSearchField &&\n\t\t\t\t\t\t\t<Input placeholder=\"Search\" type=\"Search\" class=\"ui5-user-settings-side-search\"\n\t\t\t\t\t\t\t\t onInput={this._handleInput}>\n\t\t\t\t\t\t\t\t<Icon id=\"searchFieldIcon\" slot=\"icon\" name={search} showTooltip></Icon>\n\t\t\t\t\t\t\t</Input>\n\t\t\t\t\t\t}\n\t\t\t\t\t</div>\n\t\t\t\t\t{this._showNoSearchResult ?\n\t\t\t\t\t\t<div class=\"ui5-user-settings-side-search\">\n\t\t\t\t\t\t\t<Text>{this.noSearchResultsText}</Text>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t:\n\t\t\t\t\t\trenderList.call(this, this._filteredItems, \"ui5-user-settings-side-items\")}\n\n\t\t\t\t\t{this._filteredFixedItems.length > 0 && renderList.call(this, this._filteredFixedItems, \"ui5-user-settings-side-fixedItems\")}\n\t\t\t\t</div>\n\n\t\t\t\t<div class=\"ui5-user-settings-content\">\n\t\t\t\t\t<slot name={this._selectedItemSlotName}></slot>\n\t\t\t\t</div>\n\t\t\t</div>\n\n\t\t\t<Toolbar slot=\"footer\" design=\"Transparent\" data-sap-ui-fastnavgroup=\"true\">\n\t\t\t\t{this.saveMode ? (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<ToolbarButton id={`${this._id}-save-btn`} design=\"Emphasized\" text={this.saveButtonText} onClick={this._handleSaveButtonClick} />\n\t\t\t\t\t\t<ToolbarButton id={`${this._id}-cancel-btn`} design=\"Transparent\" text={this.cancelButtonText} onClick={this._handleCancelButtonClick} />\n\t\t\t\t\t</>\n\t\t\t\t) : (\n\t\t\t\t\t<ToolbarButton id={`${this._id}-close-btn`} design=\"Transparent\" text={this.closeButtonText} onClick={this._handleCloseButtonClick} />\n\t\t\t\t)}\n\t\t\t</Toolbar>\n\t\t</Dialog>\n\t);\n}\n\nfunction renderList(this: UserSettingsDialog, items: Array<UserSettingsItem> = [], classes: string) {\n\treturn <List onItemClick={this._handleItemClick} class={classes} separators=\"None\" data-sap-ui-fastnavgroup=\"false\">\n\t\t{items.map(item => (\n\t\t\t<ListItemStandard\n\t\t\t\tclass={!item._icon && item._siblingsWithIcon ? \"ui5-user-settings-item-no-icon\" : \"\"}\n\t\t\t\tid={`setting-${item._id}`}\n\t\t\t\ticon={!item._icon && item._siblingsWithIcon ? undefined : item._icon}\n\t\t\t\ttooltip={item._tooltip}\n\t\t\t\tref={this.captureRef.bind(item)}\n\t\t\t\tselected={item.selected}\n\t\t\t\tdisabled={item.disabled}\n\t\t\t\taccessibleName={item.ariaLabelledByText}\n\t\t\t\ttype={this._showSettingWithNavigation ? \"Navigation\" : \"Active\"}\n\t\t\t>\n\t\t\t\t{item.text}\n\t\t\t</ListItemStandard>\n\t\t))}\n\t</List>;\n}\n"]}