@ui5/webcomponents 0.0.0-d9933bd82 → 0.0.0-da0d3eb88

package/dist/ResponsivePopover.js

@@ -1,192 +1,153 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+var ResponsivePopover_1;
+import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js";
+import property from "@ui5/webcomponents-base/dist/decorators/property.js";
 import { isPhone } from "@ui5/webcomponents-base/dist/Device.js";
-import { getNextZIndex } from "./popup-utils/PopupUtils.js";
+import { getI18nBundle } from "@ui5/webcomponents-base/dist/i18nBundle.js";
+import { RESPONSIVE_POPOVER_CLOSE_DIALOG_BUTTON } from "./generated/i18n/i18n-defaults.js";
 import ResponsivePopoverTemplate from "./generated/templates/ResponsivePopoverTemplate.lit.js";
 import Popover from "./Popover.js";
 import Dialog from "./Dialog.js";
 import Button from "./Button.js";
 import Title from "./Title.js";
-import "@ui5/webcomponents-icons/dist/icons/decline.js";
-
+import "@ui5/webcomponents-icons/dist/decline.js";
 // Styles
 import ResponsivePopoverCss from "./generated/themes/ResponsivePopover.css.js";
-
-const POPOVER_MIN_WIDTH = 100;
-
-/**
- * @public
- */
-const metadata = {
-	tag: "ui5-responsive-popover",
-	properties: /** @lends sap.ui.webcomponents.main.ResponsivePopover.prototype */ {
-
-		/**
-		 * Defines whether the component will stretch to fit its content.
-		 * <br/><b>Note:</b> by default the popover will be as wide as its opener component and will grow if the content is not fitting.
-		 * <br/><b>Note:</b> if set to true, it will take only as much space as it needs.
-		 * @private
-		 */
-		noStretch: {
-			type: Boolean,
-		},
-
-		/**
-		 * Defines if padding would be added around the content.
-		 * @private
-		 */
-		withPadding: {
-			type: Boolean,
-		},
-
-		/**
-		 * Defines if only the content would be displayed (without header and footer) in the popover on Desktop.
-		 * By default both the header and footer would be displayed.
-		 * @private
-		 */
-		contentOnlyOnDesktop: {
-			type: Boolean,
-		},
-
-		/**
-		 * Used internaly for controls which must not have header.
-		 * @private
-		 */
-		_hideHeader: {
-			type: Boolean,
-		},
-	},
-};
-
 /**
  * @class
  *
- * <h3 class="comment-api-title">Overview</h3>
- * The <code>ui5-responsive-popover</code> acts as a Popover on desktop and tablet, while on phone it acts as a Dialog.
+ * ### Overview
+ * The `ui5-responsive-popover` acts as a Popover on desktop and tablet, while on phone it acts as a Dialog.
  * The component improves tremendously the user experience on mobile.
  *
- * <h3>Usage</h3>
+ * ### Usage
  * Use it when you want to make sure that all the content is visible on any device.
  *
+ * ### ES6 Module Import
+ *
+ * `import "@ui5/webcomponents/dist/ResponsivePopover.js";`
  * @constructor
- * @author SAP SE
- * @alias sap.ui.webcomponents.main.ResponsivePopover
  * @extends Popover
- * @tagname ui5-responsive-popover
  * @since 1.0.0-rc.6
  * @public
+ * @csspart header - Used to style the header of the component
+ * @csspart content - Used to style the content of the component
+ * @csspart footer - Used to style the footer of the component
  */
-class ResponsivePopover extends Popover {
-	static get metadata() {
-		return metadata;
-	}
-
-	static get styles() {
-		return [...Popover.styles, ResponsivePopoverCss];
-	}
-
-	static get template() {
-		return ResponsivePopoverTemplate;
-	}
-
-	static async onDefine() {
-		await Promise.all([
-			Button.define(),
-			Dialog.define(),
-			Title.define(),
-		]);
-	}
-
-	/**
-	 * Opens popover on desktop and dialog on mobile.
-	 * @param {HTMLElement} opener the element that the popover is opened by
-	 * @public
-	 */
-	open(opener) {
-		this.style.display = this._isPhone ? "contents" : "";
-
-		if (this.isOpen() || (this._dialog && this._dialog.isOpen())) {
-			return;
-		}
-
-		if (!isPhone()) {
-			// make popover width be >= of the opener's width
-			if (!this.noStretch) {
-				this._minWidth = Math.max(POPOVER_MIN_WIDTH, opener.getBoundingClientRect().width);
-			}
-
-			this.openBy(opener);
-		} else {
-			this.style.zIndex = getNextZIndex();
-			this._dialog.open();
-		}
-	}
-
-	/**
-	 * Closes the popover/dialog.
-	 * @public
-	 */
-	close() {
-		if (!isPhone()) {
-			super.close();
-		} else {
-			this._dialog.close();
-		}
-	}
-
-	toggle(opener) {
-		if (this.isOpen()) {
-			return this.close();
-		}
-
-		this.open(opener);
-	}
-
-	isOpen() {
-		return isPhone() ? this._dialog.isOpen() : super.isOpen();
-	}
-
-	get styles() {
-		const popoverStyles = super.styles;
-
-		popoverStyles.root = {
-			"min-width": `${this._minWidth}px`,
-		};
-
-		return popoverStyles;
-	}
-
-	get _dialog() {
-		return this.shadowRoot.querySelector("ui5-dialog");
-	}
-
-	get _isPhone() {
-		return isPhone();
-	}
-
-	get _displayHeader() {
-		return this._isPhone || !this.contentOnlyOnDesktop;
-	}
-
-	get _displayFooter() {
-		return this._isPhone || !this.contentOnlyOnDesktop;
-	}
-
-	_afterDialogOpen(event) {
-		this.opened = true;
-		this._propagateDialogEvent(event);
-	}
-
-	_afterDialogClose(event) {
-		this.opened = false;
-		this._propagateDialogEvent(event);
-	}
-
-	_propagateDialogEvent(event) {
-		const type = event.type.replace("ui5-", "");
-
-		this.fireEvent(type, event.detail);
-	}
-}
-
+let ResponsivePopover = ResponsivePopover_1 = class ResponsivePopover extends Popover {
+    constructor() {
+        super();
+    }
+    async openPopup() {
+        if (!isPhone()) {
+            await super.openPopup();
+        }
+        else {
+            await this._dialog.openPopup();
+        }
+    }
+    _show() {
+        if (!isPhone()) {
+            super._show();
+        }
+    }
+    /**
+     * Closes the popover/dialog.
+     * @override
+     */
+    closePopup(escPressed = false, preventRegistryUpdate = false, preventFocusRestore = false) {
+        if (!isPhone()) {
+            super.closePopup(escPressed, preventRegistryUpdate, preventFocusRestore);
+        }
+        else {
+            this._dialog?.closePopup(escPressed, preventRegistryUpdate, preventFocusRestore);
+        }
+    }
+    toggle(opener) {
+        if (this.open) {
+            this.closePopup();
+            return;
+        }
+        this.opener = opener;
+        this.open = true;
+    }
+    get classes() {
+        const allClasses = super.classes;
+        allClasses.header = {
+            "ui5-responsive-popover-header": true,
+            "ui5-responsive-popover-header-no-title": !this.headerText,
+        };
+        return allClasses;
+    }
+    get _dialog() {
+        return this.shadowRoot.querySelector("[ui5-dialog]");
+    }
+    get contentDOM() {
+        return isPhone() ? this._dialog.contentDOM : super.contentDOM;
+    }
+    get _isPhone() {
+        return isPhone();
+    }
+    get _displayHeader() {
+        return (isPhone() || !this.contentOnlyOnDesktop) && super._displayHeader;
+    }
+    get _displayFooter() {
+        return isPhone() || !this.contentOnlyOnDesktop;
+    }
+    get _closeDialogAriaLabel() {
+        return ResponsivePopover_1.i18nBundle.getText(RESPONSIVE_POPOVER_CLOSE_DIALOG_BUTTON);
+    }
+    _beforeDialogOpen(e) {
+        this._opened = true;
+        this.open = true;
+        this._propagateDialogEvent(e);
+    }
+    _afterDialogClose(e) {
+        this._opened = false;
+        this.open = false;
+        this._propagateDialogEvent(e);
+    }
+    _propagateDialogEvent(e) {
+        const type = e.type.replace("ui5-", "");
+        this.fireEvent(type, e.detail);
+    }
+    get isModal() {
+        if (!isPhone()) {
+            return super.isModal;
+        }
+        return this._dialog.isModal;
+    }
+    static async onDefine() {
+        ResponsivePopover_1.i18nBundle = await getI18nBundle("@ui5/webcomponents");
+    }
+};
+__decorate([
+    property({ type: Boolean })
+], ResponsivePopover.prototype, "contentOnlyOnDesktop", void 0);
+__decorate([
+    property({ type: Boolean })
+], ResponsivePopover.prototype, "_hideHeader", void 0);
+__decorate([
+    property({ type: Boolean })
+], ResponsivePopover.prototype, "_hideCloseButton", void 0);
+ResponsivePopover = ResponsivePopover_1 = __decorate([
+    customElement({
+        tag: "ui5-responsive-popover",
+        styles: [Popover.styles, ResponsivePopoverCss],
+        template: ResponsivePopoverTemplate,
+        dependencies: [
+            ...Popover.dependencies,
+            Button,
+            Dialog,
+            Title,
+        ],
+    })
+], ResponsivePopover);
 ResponsivePopover.define();
-
 export default ResponsivePopover;
+//# sourceMappingURL=ResponsivePopover.js.map

package/dist/ResponsivePopover.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ResponsivePopover.js","sourceRoot":"","sources":["../src/ResponsivePopover.ts"],"names":[],"mappings":"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","sourcesContent":["import customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport { isPhone } from \"@ui5/webcomponents-base/dist/Device.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport { getI18nBundle } from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\n\nimport { RESPONSIVE_POPOVER_CLOSE_DIALOG_BUTTON } from \"./generated/i18n/i18n-defaults.js\";\n\nimport ResponsivePopoverTemplate from \"./generated/templates/ResponsivePopoverTemplate.lit.js\";\nimport type { PopupBeforeCloseEventDetail } from \"./Popup.js\";\nimport Popover from \"./Popover.js\";\nimport Dialog from \"./Dialog.js\";\nimport Button from \"./Button.js\";\nimport Title from \"./Title.js\";\nimport \"@ui5/webcomponents-icons/dist/decline.js\";\n\n// Styles\nimport ResponsivePopoverCss from \"./generated/themes/ResponsivePopover.css.js\";\n\ntype ResponsivePopoverBeforeCloseEventDetail = PopupBeforeCloseEventDetail;\n\n/**\n * @class\n *\n * ### Overview\n * The `ui5-responsive-popover` acts as a Popover on desktop and tablet, while on phone it acts as a Dialog.\n * The component improves tremendously the user experience on mobile.\n *\n * ### Usage\n * Use it when you want to make sure that all the content is visible on any device.\n *\n * ### ES6 Module Import\n *\n * `import \"@ui5/webcomponents/dist/ResponsivePopover.js\";`\n * @constructor\n * @extends Popover\n * @since 1.0.0-rc.6\n * @public\n * @csspart header - Used to style the header of the component\n * @csspart content - Used to style the content of the component\n * @csspart footer - Used to style the footer of the component\n */\n@customElement({\n\ttag: \"ui5-responsive-popover\",\n\tstyles: [Popover.styles, ResponsivePopoverCss],\n\ttemplate: ResponsivePopoverTemplate,\n\tdependencies: [\n\t\t...Popover.dependencies,\n\t\tButton,\n\t\tDialog,\n\t\tTitle,\n\t],\n})\nclass ResponsivePopover extends Popover {\n\t/**\n\t * Defines if only the content would be displayed (without header and footer) in the popover on Desktop.\n\t * By default both the header and footer would be displayed.\n\t * @private\n\t */\n\t@property({ type: Boolean })\n\tcontentOnlyOnDesktop!: boolean;\n\n\t/**\n\t * Used internaly for controls which must not have header.\n\t * @private\n\t */\n\t@property({ type: Boolean })\n\t_hideHeader!: boolean;\n\n\t/**\n\t * Defines whether a close button will be rendered in the header of the component\n\t * **Note:** If you are using the `header` slot, this property will have no effect\n\t * @private\n\t * @default false\n\t * @since 1.0.0-rc.16\n\t */\n\t@property({ type: Boolean })\n\t_hideCloseButton!: boolean;\n\n\tstatic i18nBundle: I18nBundle;\n\n\tconstructor() {\n\t\tsuper();\n\t}\n\n\tasync openPopup() {\n\t\tif (!isPhone()) {\n\t\t\tawait super.openPopup();\n\t\t} else {\n\t\t\tawait this._dialog.openPopup();\n\t\t}\n\t}\n\n\t_show() {\n\t\tif (!isPhone()) {\n\t\t\tsuper._show();\n\t\t}\n\t}\n\n\t/**\n\t * Closes the popover/dialog.\n\t * @override\n\t */\n\tclosePopup(escPressed = false, preventRegistryUpdate = false, preventFocusRestore = false) : void {\n\t\tif (!isPhone()) {\n\t\t\tsuper.closePopup(escPressed, preventRegistryUpdate, preventFocusRestore);\n\t\t} else {\n\t\t\tthis._dialog?.closePopup(escPressed, preventRegistryUpdate, preventFocusRestore);\n\t\t}\n\t}\n\n\ttoggle(opener: HTMLElement) : void {\n\t\tif (this.open) {\n\t\t\tthis.closePopup();\n\t\t\treturn;\n\t\t}\n\n\t\tthis.opener = opener;\n\t\tthis.open = true;\n\t}\n\n\tget classes() {\n\t\tconst allClasses = super.classes;\n\n\t\tallClasses.header = {\n\t\t\t\"ui5-responsive-popover-header\": true,\n\t\t\t\"ui5-responsive-popover-header-no-title\": !this.headerText,\n\t\t};\n\n\t\treturn allClasses;\n\t}\n\n\tget _dialog() {\n\t\treturn this.shadowRoot!.querySelector<Dialog>(\"[ui5-dialog]\")!;\n\t}\n\n\tget contentDOM() {\n\t\treturn isPhone() ? this._dialog.contentDOM : super.contentDOM;\n\t}\n\n\tget _isPhone() {\n\t\treturn isPhone();\n\t}\n\n\tget _displayHeader() {\n\t\treturn (isPhone() || !this.contentOnlyOnDesktop) && super._displayHeader;\n\t}\n\n\tget _displayFooter() {\n\t\treturn isPhone() || !this.contentOnlyOnDesktop;\n\t}\n\n\tget _closeDialogAriaLabel() {\n\t\treturn ResponsivePopover.i18nBundle.getText(RESPONSIVE_POPOVER_CLOSE_DIALOG_BUTTON);\n\t}\n\n\t_beforeDialogOpen(e: CustomEvent<PopupBeforeCloseEventDetail>) {\n\t\tthis._opened = true;\n\t\tthis.open = true;\n\t\tthis._propagateDialogEvent(e);\n\t}\n\n\t_afterDialogClose(e: CustomEvent) {\n\t\tthis._opened = false;\n\t\tthis.open = false;\n\t\tthis._propagateDialogEvent(e);\n\t}\n\n\t_propagateDialogEvent(e: CustomEvent) {\n\t\tconst type = e.type.replace(\"ui5-\", \"\");\n\n\t\tthis.fireEvent(type, e.detail);\n\t}\n\n\tget isModal() {\n\t\tif (!isPhone()) {\n\t\t\treturn super.isModal;\n\t\t}\n\n\t\treturn this._dialog.isModal;\n\t}\n\n\tstatic async onDefine() {\n\t\tResponsivePopover.i18nBundle = await getI18nBundle(\"@ui5/webcomponents\");\n\t}\n}\n\nResponsivePopover.define();\n\nexport default ResponsivePopover;\nexport type {\n\tResponsivePopoverBeforeCloseEventDetail,\n};\n"]}

package/dist/SegmentedButton.d.ts

@@ -0,0 +1,84 @@
+import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
+import ItemNavigation, { ITabbable } from "@ui5/webcomponents-base/dist/delegate/ItemNavigation.js";
+import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js";
+import SegmentedButtonSelectionMode from "./types/SegmentedButtonSelectionMode.js";
+/**
+ * Interface for components that may be slotted inside `ui5-segmented-button` as items
+ * @public
+ */
+interface ISegmentedButtonItem extends UI5Element, ITabbable {
+    disabled: boolean;
+    selected: boolean;
+}
+type SegmentedButtonSelectionChangeEventDetail = {
+    selectedItems: Array<ISegmentedButtonItem>;
+};
+/**
+ * @class
+ *
+ * ### Overview
+ *
+ * The `ui5-segmented-button` shows a group of items. When the user clicks or taps
+ * one of the items, it stays in a pressed state. It automatically resizes the items
+ * to fit proportionally within the component. When no width is set, the component uses the available width.
+ *
+ *
+ * ### ES6 Module Import
+ *
+ * `import "@ui5/webcomponents/dist/SegmentedButton.js";`
+ * @constructor
+ * @extends UI5Element
+ * @since 1.0.0-rc.6
+ * @public
+ */
+declare class SegmentedButton extends UI5Element {
+    /**
+     * Defines the accessible ARIA name of the component.
+     * @default undefined
+     * @public
+     * @since 1.0.3
+     */
+    accessibleName?: string;
+    /**
+     * Defines the component selection mode.
+     * @default "Single"
+     * @public
+     * @since 1.14.0
+     */
+    selectionMode: `${SegmentedButtonSelectionMode}`;
+    /**
+     * Defines the items of `ui5-segmented-button`.
+     *
+     * **Note:** Multiple items are allowed.
+     *
+     * **Note:** Use the `ui5-segmented-button-item` for the intended design.
+     * @public
+     */
+    items: Array<ISegmentedButtonItem>;
+    static i18nBundle: I18nBundle;
+    _itemNavigation: ItemNavigation;
+    hasPreviouslyFocusedItem: boolean;
+    _selectedItem?: ISegmentedButtonItem;
+    static onDefine(): Promise<void>;
+    constructor();
+    onBeforeRendering(): void;
+    normalizeSelection(): void;
+    _selectItem(e: MouseEvent | KeyboardEvent): this | undefined;
+    _applySingleSelection(item: ISegmentedButtonItem): void;
+    _onclick(e: MouseEvent): void;
+    _onkeydown(e: KeyboardEvent): void;
+    _onkeyup(e: KeyboardEvent): void;
+    _onmousedown(e: MouseEvent): void;
+    _onfocusin(e: FocusEvent): void;
+    /**
+     * Returns an array of the currently selected items.
+     * @since 1.14.0
+     * @public
+     * @default []
+     */
+    get selectedItems(): Array<ISegmentedButtonItem>;
+    get ariaDescribedBy(): string;
+    get ariaDescription(): string;
+}
+export default SegmentedButton;
+export type { SegmentedButtonSelectionChangeEventDetail, ISegmentedButtonItem, };