@ui5/webcomponents 0.0.0-037d08c67

package/dist/Dialog.js

@@ -0,0 +1,509 @@
+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 Dialog_1;
+import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js";
+import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js";
+import property from "@ui5/webcomponents-base/dist/decorators/property.js";
+import clamp from "@ui5/webcomponents-base/dist/util/clamp.js";
+import { isUp, isDown, isLeft, isRight, isUpShift, isDownShift, isLeftShift, isRightShift, } from "@ui5/webcomponents-base/dist/Keys.js";
+import ValueState from "@ui5/webcomponents-base/dist/types/ValueState.js";
+import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js";
+import toLowercaseEnumValue from "@ui5/webcomponents-base/dist/util/toLowercaseEnumValue.js";
+import Popup from "./Popup.js";
+import "@ui5/webcomponents-icons/dist/error.js";
+import "@ui5/webcomponents-icons/dist/alert.js";
+import "@ui5/webcomponents-icons/dist/sys-enter-2.js";
+import "@ui5/webcomponents-icons/dist/information.js";
+import { DIALOG_HEADER_ARIA_ROLE_DESCRIPTION, DIALOG_HEADER_ARIA_DESCRIBEDBY_RESIZABLE, DIALOG_HEADER_ARIA_DESCRIBEDBY_DRAGGABLE, DIALOG_HEADER_ARIA_DESCRIBEDBY_DRAGGABLE_RESIZABLE, } from "./generated/i18n/i18n-defaults.js";
+// Template
+import DialogTemplate from "./DialogTemplate.js";
+// Styles
+import PopupsCommonCss from "./generated/themes/PopupsCommon.css.js";
+import dialogCSS from "./generated/themes/Dialog.css.js";
+import PopupAccessibleRole from "./types/PopupAccessibleRole.js";
+/**
+ * Defines the step size at which this component would change by when being dragged or resized with the keyboard.
+ */
+const STEP_SIZE = 16;
+/**
+ * Defines the icons corresponding to the dialog's state.
+ */
+const ICON_PER_STATE = {
+    [ValueState.Negative]: "error",
+    [ValueState.Critical]: "alert",
+    [ValueState.Positive]: "sys-enter-2",
+    [ValueState.Information]: "information",
+};
+/**
+ * @class
+ * ### Overview
+ * The `ui5-dialog` component is used to temporarily display some information in a
+ * size-limited window in front of the regular app screen.
+ * It is used to prompt the user for an action or a confirmation.
+ * The `ui5-dialog` interrupts the current app processing as it is the only focused UI element and
+ * the main screen is dimmed/blocked.
+ * The dialog combines concepts known from other technologies where the windows have
+ * names such as dialog box, dialog window, pop-up, pop-up window, alert box, or message box.
+ *
+ * The `ui5-dialog` is modal, which means that a user action is required before it is possible to return to the parent window.
+ * To open multiple dialogs, each dialog element should be separate in the markup. This will ensure the correct modal behavior. Avoid nesting dialogs within each other.
+ * The content of the `ui5-dialog` is fully customizable.
+ *
+ * ### Structure
+ * A `ui5-dialog` consists of a header, content, and a footer for action buttons.
+ * The `ui5-dialog` is usually displayed at the center of the screen.
+ * Its position can be changed by the user. To enable this, you need to set the property `draggable` accordingly.
+
+ *
+ * ### Responsive Behavior
+ * The `stretch` property can be used to stretch the `ui5-dialog` to full screen. For better usability, it's recommended to stretch the dialog to full screen on phone devices.
+ *
+ * **Note:** When a `ui5-bar` is used in the header or in the footer, you should remove the default dialog's paddings.
+ *
+ * For more information see the sample "Bar in Header/Footer".
+
+ * ### Keyboard Handling
+ *
+ * #### Basic Navigation
+ * When the `ui5-dialog` has the `draggable` property set to `true` and the header is focused, the user can move the dialog
+ * with the following keyboard shortcuts:
+ *
+ * - [Up] or [Down] arrow keys - Move the dialog up/down.
+ * - [Left] or [Right] arrow keys - Move the dialog left/right.
+ *
+ * #### Resizing
+ * When the `ui5-dialog` has the `resizable` property set to `true` and the header is focused, the user can change the size of the dialog
+ * with the following keyboard shortcuts:
+ *
+ * - [Shift] + [Up] or [Down] - Decrease/Increase the height of the dialog.
+ * - [Shift] + [Left] or [Right] - Decrease/Increase the width of the dialog.
+ *
+ * ### ES6 Module Import
+ *
+ * `import "@ui5/webcomponents/dist/Dialog";`
+ *
+ * @constructor
+ * @extends Popup
+ * @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
+ */
+let Dialog = Dialog_1 = class Dialog extends Popup {
+    constructor() {
+        super();
+        /**
+         * Determines if the dialog will be stretched to full screen on mobile. On desktop,
+         * the dialog will be stretched to approximately 90% of the viewport.
+         *
+         * **Note:** For better usability of the component it is recommended to set this property to "true" when the dialog is opened on phone.
+         * @default false
+         * @public
+         */
+        this.stretch = false;
+        /**
+         * Determines whether the component is draggable.
+         * If this property is set to true, the Dialog will be draggable by its header.
+         *
+         * **Note:** The component can be draggable only in desktop mode.
+         *
+         * **Note:** This property overrides the default HTML "draggable" attribute native behavior.
+         * When "draggable" is set to true, the native browser "draggable"
+         * behavior is prevented and only the Dialog custom logic ("draggable by its header") works.
+         * @default false
+         * @since 1.0.0-rc.9
+         * @public
+         */
+        this.draggable = false;
+        /**
+         * Configures the component to be resizable.
+         * If this property is set to true, the Dialog will have a resize handle in its bottom right corner in LTR languages.
+         * In RTL languages, the resize handle will be placed in the bottom left corner.
+         *
+         * **Note:** The component can be resizable only in desktop mode.
+         *
+         * **Note:** Upon resizing, externally defined height and width styling will be ignored.
+         * @default false
+         * @since 1.0.0-rc.10
+         * @public
+         */
+        this.resizable = false;
+        /**
+         * Defines the state of the `Dialog`.
+         *
+         * **Note:** If `"Negative"` and `"Critical"` states is set, it will change the
+         * accessibility role to "alertdialog", if the accessibleRole property is set to `"Dialog"`.
+         * @default "None"
+         * @public
+         * @since 1.0.0-rc.15
+         */
+        this.state = "None";
+        this._draggedOrResized = false;
+        this._dragHandlerRegistered = false;
+        this._revertSize = () => {
+            Object.assign(this.style, {
+                top: "",
+                left: "",
+                width: "",
+                height: "",
+            });
+        };
+        this._screenResizeHandler = this._screenResize.bind(this);
+        this._dragMouseMoveHandler = this._onDragMouseMove.bind(this);
+        this._dragMouseUpHandler = this._onDragMouseUp.bind(this);
+        this._resizeMouseMoveHandler = this._onResizeMouseMove.bind(this);
+        this._resizeMouseUpHandler = this._onResizeMouseUp.bind(this);
+        this._dragStartHandler = this._handleDragStart.bind(this);
+    }
+    static _isHeader(element) {
+        return element.classList.contains("ui5-popup-header-root") || element.getAttribute("slot") === "header";
+    }
+    get isModal() {
+        return true;
+    }
+    get _ariaLabelledBy() {
+        let ariaLabelledById;
+        if (this.headerText && !this._ariaLabel) {
+            ariaLabelledById = "ui5-popup-header-text";
+        }
+        return ariaLabelledById;
+    }
+    get ariaRoleDescriptionHeaderText() {
+        return (this.resizable || this.draggable) ? Dialog_1.i18nBundle.getText(DIALOG_HEADER_ARIA_ROLE_DESCRIPTION) : undefined;
+    }
+    get effectiveAriaDescribedBy() {
+        return (this.resizable || this.draggable) ? `${this._id}-descr` : undefined;
+    }
+    get ariaDescribedByHeaderTextResizable() {
+        return Dialog_1.i18nBundle.getText(DIALOG_HEADER_ARIA_DESCRIBEDBY_RESIZABLE);
+    }
+    get ariaDescribedByHeaderTextDraggable() {
+        return Dialog_1.i18nBundle.getText(DIALOG_HEADER_ARIA_DESCRIBEDBY_DRAGGABLE);
+    }
+    get ariaDescribedByHeaderTextDraggableAndResizable() {
+        return Dialog_1.i18nBundle.getText(DIALOG_HEADER_ARIA_DESCRIBEDBY_DRAGGABLE_RESIZABLE);
+    }
+    /**
+     * Determines if the header should be shown.
+     */
+    get _displayHeader() {
+        return this.header.length || this.headerText || this.draggable || this.resizable;
+    }
+    get _movable() {
+        return !this.stretch && this.onDesktop && (this.draggable || this.resizable);
+    }
+    get _headerTabIndex() {
+        return this._movable ? 0 : undefined;
+    }
+    get _showResizeHandle() {
+        return this.resizable && this.onDesktop;
+    }
+    get _minHeight() {
+        let minHeight = Number.parseInt(window.getComputedStyle(this.contentDOM).minHeight);
+        const header = this._root.querySelector(".ui5-popup-header-root");
+        if (header) {
+            minHeight += header.offsetHeight;
+        }
+        const footer = this._root.querySelector(".ui5-popup-footer-root");
+        if (footer) {
+            minHeight += footer.offsetHeight;
+        }
+        return minHeight;
+    }
+    get hasValueState() {
+        return this.state !== ValueState.None;
+    }
+    get _dialogStateIcon() {
+        return ICON_PER_STATE[this.state];
+    }
+    get _role() {
+        if (this.accessibleRole === PopupAccessibleRole.None) {
+            return undefined;
+        }
+        if (this.state === ValueState.Negative || this.state === ValueState.Critical) {
+            return toLowercaseEnumValue(PopupAccessibleRole.AlertDialog);
+        }
+        return toLowercaseEnumValue(this.accessibleRole);
+    }
+    _show() {
+        super._show();
+        this._center();
+    }
+    onBeforeRendering() {
+        super.onBeforeRendering();
+        this._isRTL = this.effectiveDir === "rtl";
+    }
+    /**
+     * @override
+     */
+    _resize() {
+        super._resize();
+        if (!this._draggedOrResized) {
+            this._center();
+        }
+    }
+    _screenResize() {
+        this._center();
+    }
+    _attachBrowserEvents() {
+        this._attachScreenResizeHandler();
+        this._registerDragHandler();
+    }
+    _detachBrowserEvents() {
+        this._detachScreenResizeHandler();
+        this._deregisterDragHandler();
+    }
+    _attachScreenResizeHandler() {
+        if (!this._screenResizeHandlerAttached) {
+            window.addEventListener("resize", this._screenResizeHandler);
+            this._screenResizeHandlerAttached = true;
+        }
+    }
+    _detachScreenResizeHandler() {
+        if (this._screenResizeHandlerAttached) {
+            window.removeEventListener("resize", this._screenResizeHandler);
+            this._screenResizeHandlerAttached = false; // prevent dialog from repositioning during resizing
+        }
+    }
+    _registerDragHandler() {
+        if (!this._dragHandlerRegistered) {
+            this.addEventListener("dragstart", this._dragStartHandler);
+            this._dragHandlerRegistered = true;
+        }
+    }
+    _deregisterDragHandler() {
+        if (this._dragHandlerRegistered) {
+            this.removeEventListener("dragstart", this._dragStartHandler);
+            this._dragHandlerRegistered = false;
+        }
+    }
+    _center() {
+        const height = window.innerHeight - this.offsetHeight, width = window.innerWidth - this.offsetWidth;
+        Object.assign(this.style, {
+            top: `${Math.round(height / 2)}px`,
+            left: `${Math.round(width / 2)}px`,
+        });
+    }
+    /**
+     * Event handlers
+     */
+    _onDragMouseDown(e) {
+        // allow dragging only on the header
+        if (!this._movable || !this.draggable || !Dialog_1._isHeader(e.target)) {
+            return;
+        }
+        const { top, left, } = this.getBoundingClientRect();
+        const { width, height, } = window.getComputedStyle(this);
+        Object.assign(this.style, {
+            top: `${top}px`,
+            left: `${left}px`,
+            width: `${Math.round(Number.parseFloat(width) * 100) / 100}px`,
+            height: `${Math.round(Number.parseFloat(height) * 100) / 100}px`,
+        });
+        this._x = e.clientX;
+        this._y = e.clientY;
+        this._draggedOrResized = true;
+        this._attachMouseDragHandlers();
+    }
+    _onDragMouseMove(e) {
+        e.preventDefault();
+        const { clientX, clientY } = e;
+        const calcX = this._x - clientX;
+        const calcY = this._y - clientY;
+        const { left, top, } = this.getBoundingClientRect();
+        Object.assign(this.style, {
+            left: `${Math.floor(left - calcX)}px`,
+            top: `${Math.floor(top - calcY)}px`,
+        });
+        this._x = clientX;
+        this._y = clientY;
+    }
+    _onDragMouseUp() {
+        delete this._x;
+        delete this._y;
+        this._detachMouseDragHandlers();
+    }
+    _onDragOrResizeKeyDown(e) {
+        if (!this._movable || !Dialog_1._isHeader(e.target)) {
+            return;
+        }
+        if (this.draggable && [isUp, isDown, isLeft, isRight].some(key => key(e))) {
+            this._dragWithEvent(e);
+            return;
+        }
+        if (this.resizable && [isUpShift, isDownShift, isLeftShift, isRightShift].some(key => key(e))) {
+            this._resizeWithEvent(e);
+        }
+    }
+    _dragWithEvent(e) {
+        const { top, left, width, height, } = this.getBoundingClientRect();
+        let newPos = 0;
+        let posDirection = "top";
+        switch (true) {
+            case isUp(e):
+                newPos = top - STEP_SIZE;
+                posDirection = "top";
+                break;
+            case isDown(e):
+                newPos = top + STEP_SIZE;
+                posDirection = "top";
+                break;
+            case isLeft(e):
+                newPos = left - STEP_SIZE;
+                posDirection = "left";
+                break;
+            case isRight(e):
+                newPos = left + STEP_SIZE;
+                posDirection = "left";
+                break;
+        }
+        newPos = clamp(newPos, 0, posDirection === "left" ? window.innerWidth - width : window.innerHeight - height);
+        this.style[posDirection] = `${newPos}px`;
+    }
+    _resizeWithEvent(e) {
+        this._draggedOrResized = true;
+        this.addEventListener("ui5-before-close", this._revertSize, { once: true });
+        const { top, left } = this.getBoundingClientRect(), style = window.getComputedStyle(this), minWidth = Number.parseFloat(style.minWidth), maxWidth = window.innerWidth - left, maxHeight = window.innerHeight - top;
+        let width = Number.parseFloat(style.width), height = Number.parseFloat(style.height);
+        switch (true) {
+            case isUpShift(e):
+                height -= STEP_SIZE;
+                break;
+            case isDownShift(e):
+                height += STEP_SIZE;
+                break;
+            case isLeftShift(e):
+                width -= STEP_SIZE;
+                break;
+            case isRightShift(e):
+                width += STEP_SIZE;
+                break;
+        }
+        width = clamp(width, minWidth, maxWidth);
+        height = clamp(height, this._minHeight, maxHeight);
+        Object.assign(this.style, {
+            width: `${width}px`,
+            height: `${height}px`,
+        });
+    }
+    _attachMouseDragHandlers() {
+        window.addEventListener("mousemove", this._dragMouseMoveHandler);
+        window.addEventListener("mouseup", this._dragMouseUpHandler);
+    }
+    _detachMouseDragHandlers() {
+        window.removeEventListener("mousemove", this._dragMouseMoveHandler);
+        window.removeEventListener("mouseup", this._dragMouseUpHandler);
+    }
+    _onResizeMouseDown(e) {
+        if (!this._movable || !this.resizable) {
+            return;
+        }
+        e.preventDefault();
+        const { top, left, } = this.getBoundingClientRect();
+        const { width, height, minWidth, } = window.getComputedStyle(this);
+        this._initialX = e.clientX;
+        this._initialY = e.clientY;
+        this._initialWidth = Number.parseFloat(width);
+        this._initialHeight = Number.parseFloat(height);
+        this._initialTop = top;
+        this._initialLeft = left;
+        this._minWidth = Number.parseFloat(minWidth);
+        this._cachedMinHeight = this._minHeight;
+        Object.assign(this.style, {
+            top: `${top}px`,
+            left: `${left}px`,
+        });
+        this._draggedOrResized = true;
+        this._attachMouseResizeHandlers();
+    }
+    _onResizeMouseMove(e) {
+        const { clientX, clientY } = e;
+        let newWidth, newLeft;
+        if (this._isRTL) {
+            newWidth = clamp(this._initialWidth - (clientX - this._initialX), this._minWidth, this._initialLeft + this._initialWidth);
+            // check if width is changed to avoid "left" jumping when max width is reached
+            Object.assign(this.style, {
+                width: `${newWidth}px`,
+            });
+            const deltaWidth = newWidth - this.getBoundingClientRect().width;
+            const rightEdge = this._initialLeft + this._initialWidth + deltaWidth;
+            newLeft = clamp(rightEdge - newWidth, 0, rightEdge - this._minWidth);
+        }
+        else {
+            newWidth = clamp(this._initialWidth + (clientX - this._initialX), this._minWidth, window.innerWidth - this._initialLeft);
+        }
+        const newHeight = clamp(this._initialHeight + (clientY - this._initialY), this._cachedMinHeight, window.innerHeight - this._initialTop);
+        Object.assign(this.style, {
+            height: `${newHeight}px`,
+            width: `${newWidth}px`,
+            left: this._isRTL ? `${newLeft}px` : undefined,
+        });
+    }
+    _onResizeMouseUp() {
+        delete this._initialX;
+        delete this._initialY;
+        delete this._initialWidth;
+        delete this._initialHeight;
+        delete this._initialTop;
+        delete this._initialLeft;
+        delete this._minWidth;
+        delete this._cachedMinHeight;
+        this._detachMouseResizeHandlers();
+    }
+    _handleDragStart(e) {
+        if (this.draggable) {
+            e.preventDefault();
+        }
+    }
+    _attachMouseResizeHandlers() {
+        window.addEventListener("mousemove", this._resizeMouseMoveHandler);
+        window.addEventListener("mouseup", this._resizeMouseUpHandler);
+        this.addEventListener("ui5-before-close", this._revertSize, { once: true });
+    }
+    _detachMouseResizeHandlers() {
+        window.removeEventListener("mousemove", this._resizeMouseMoveHandler);
+        window.removeEventListener("mouseup", this._resizeMouseUpHandler);
+    }
+};
+__decorate([
+    property()
+], Dialog.prototype, "headerText", void 0);
+__decorate([
+    property({ type: Boolean })
+], Dialog.prototype, "stretch", void 0);
+__decorate([
+    property({ type: Boolean })
+], Dialog.prototype, "draggable", void 0);
+__decorate([
+    property({ type: Boolean })
+], Dialog.prototype, "resizable", void 0);
+__decorate([
+    property()
+], Dialog.prototype, "state", void 0);
+__decorate([
+    slot()
+], Dialog.prototype, "header", void 0);
+__decorate([
+    slot()
+], Dialog.prototype, "footer", void 0);
+__decorate([
+    i18n("@ui5/webcomponents")
+], Dialog, "i18nBundle", void 0);
+Dialog = Dialog_1 = __decorate([
+    customElement({
+        tag: "ui5-dialog",
+        template: DialogTemplate,
+        styles: [
+            Popup.styles,
+            PopupsCommonCss,
+            dialogCSS,
+        ],
+    })
+], Dialog);
+Dialog.define();
+export default Dialog;
+//# sourceMappingURL=Dialog.js.map

package/dist/Dialog.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dialog.js","sourceRoot":"","sources":["../src/Dialog.ts"],"names":[],"mappings":"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","sourcesContent":["import type { Slot } from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot-strict.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport clamp from \"@ui5/webcomponents-base/dist/util/clamp.js\";\nimport {\n\tisUp, isDown, isLeft, isRight,\n\tisUpShift, isDownShift, isLeftShift, isRightShift,\n} from \"@ui5/webcomponents-base/dist/Keys.js\";\nimport ValueState from \"@ui5/webcomponents-base/dist/types/ValueState.js\";\nimport i18n from \"@ui5/webcomponents-base/dist/decorators/i18n.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport toLowercaseEnumValue from \"@ui5/webcomponents-base/dist/util/toLowercaseEnumValue.js\";\nimport Popup from \"./Popup.js\";\nimport \"@ui5/webcomponents-icons/dist/error.js\";\nimport \"@ui5/webcomponents-icons/dist/alert.js\";\nimport \"@ui5/webcomponents-icons/dist/sys-enter-2.js\";\nimport \"@ui5/webcomponents-icons/dist/information.js\";\n\nimport {\n\tDIALOG_HEADER_ARIA_ROLE_DESCRIPTION,\n\tDIALOG_HEADER_ARIA_DESCRIBEDBY_RESIZABLE,\n\tDIALOG_HEADER_ARIA_DESCRIBEDBY_DRAGGABLE,\n\tDIALOG_HEADER_ARIA_DESCRIBEDBY_DRAGGABLE_RESIZABLE,\n} from \"./generated/i18n/i18n-defaults.js\";\n\n// Template\nimport DialogTemplate from \"./DialogTemplate.js\";\n// Styles\nimport PopupsCommonCss from \"./generated/themes/PopupsCommon.css.js\";\nimport dialogCSS from \"./generated/themes/Dialog.css.js\";\nimport PopupAccessibleRole from \"./types/PopupAccessibleRole.js\";\n\n/**\n * Defines the step size at which this component would change by when being dragged or resized with the keyboard.\n */\nconst STEP_SIZE = 16;\n\ntype ValueStateWithIcon = ValueState.Negative | ValueState.Critical | ValueState.Positive | ValueState.Information;\n/**\n * Defines the icons corresponding to the dialog's state.\n */\nconst ICON_PER_STATE: Record<ValueStateWithIcon, string> = {\n\t[ValueState.Negative]: \"error\",\n\t[ValueState.Critical]: \"alert\",\n\t[ValueState.Positive]: \"sys-enter-2\",\n\t[ValueState.Information]: \"information\",\n};\n\n/**\n * @class\n * ### Overview\n * The `ui5-dialog` component is used to temporarily display some information in a\n * size-limited window in front of the regular app screen.\n * It is used to prompt the user for an action or a confirmation.\n * The `ui5-dialog` interrupts the current app processing as it is the only focused UI element and\n * the main screen is dimmed/blocked.\n * The dialog combines concepts known from other technologies where the windows have\n * names such as dialog box, dialog window, pop-up, pop-up window, alert box, or message box.\n *\n * The `ui5-dialog` is modal, which means that a user action is required before it is possible to return to the parent window.\n * To open multiple dialogs, each dialog element should be separate in the markup. This will ensure the correct modal behavior. Avoid nesting dialogs within each other.\n * The content of the `ui5-dialog` is fully customizable.\n *\n * ### Structure\n * A `ui5-dialog` consists of a header, content, and a footer for action buttons.\n * The `ui5-dialog` is usually displayed at the center of the screen.\n * Its position can be changed by the user. To enable this, you need to set the property `draggable` accordingly.\n\n *\n * ### Responsive Behavior\n * The `stretch` property can be used to stretch the `ui5-dialog` to full screen. For better usability, it's recommended to stretch the dialog to full screen on phone devices.\n *\n * **Note:** When a `ui5-bar` is used in the header or in the footer, you should remove the default dialog's paddings.\n *\n * For more information see the sample \"Bar in Header/Footer\".\n\n * ### Keyboard Handling\n *\n * #### Basic Navigation\n * When the `ui5-dialog` has the `draggable` property set to `true` and the header is focused, the user can move the dialog\n * with the following keyboard shortcuts:\n *\n * - [Up] or [Down] arrow keys - Move the dialog up/down.\n * - [Left] or [Right] arrow keys - Move the dialog left/right.\n *\n * #### Resizing\n * When the `ui5-dialog` has the `resizable` property set to `true` and the header is focused, the user can change the size of the dialog\n * with the following keyboard shortcuts:\n *\n * - [Shift] + [Up] or [Down] - Decrease/Increase the height of the dialog.\n * - [Shift] + [Left] or [Right] - Decrease/Increase the width of the dialog.\n *\n * ### ES6 Module Import\n *\n * `import \"@ui5/webcomponents/dist/Dialog\";`\n *\n * @constructor\n * @extends Popup\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-dialog\",\n\ttemplate: DialogTemplate,\n\tstyles: [\n\t\tPopup.styles,\n\t\tPopupsCommonCss,\n\t\tdialogCSS,\n\t],\n})\nclass Dialog extends Popup {\n\teventDetails!: Popup[\"eventDetails\"];\n\n\t/**\n\t * Defines the header text.\n\t *\n\t * **Note:** If `header` slot is provided, the `headerText` is ignored.\n\t * @default undefined\n\t * @public\n\t */\n\t@property()\n\theaderText?: string;\n\n\t/**\n\t * Determines if the dialog will be stretched to full screen on mobile. On desktop,\n\t * the dialog will be stretched to approximately 90% of the viewport.\n\t *\n\t * **Note:** For better usability of the component it is recommended to set this property to \"true\" when the dialog is opened on phone.\n\t * @default false\n\t * @public\n\t */\n\t@property({ type: Boolean })\n\tstretch = false;\n\n\t/**\n\t * Determines whether the component is draggable.\n\t * If this property is set to true, the Dialog will be draggable by its header.\n\t *\n\t * **Note:** The component can be draggable only in desktop mode.\n\t *\n\t * **Note:** This property overrides the default HTML \"draggable\" attribute native behavior.\n\t * When \"draggable\" is set to true, the native browser \"draggable\"\n\t * behavior is prevented and only the Dialog custom logic (\"draggable by its header\") works.\n\t * @default false\n\t * @since 1.0.0-rc.9\n\t * @public\n\t */\n\t@property({ type: Boolean })\n\tdraggable = false;\n\n\t/**\n\t * Configures the component to be resizable.\n\t * If this property is set to true, the Dialog will have a resize handle in its bottom right corner in LTR languages.\n\t * In RTL languages, the resize handle will be placed in the bottom left corner.\n\t *\n\t * **Note:** The component can be resizable only in desktop mode.\n\t *\n\t * **Note:** Upon resizing, externally defined height and width styling will be ignored.\n\t * @default false\n\t * @since 1.0.0-rc.10\n\t * @public\n\t */\n\t@property({ type: Boolean })\n\tresizable = false;\n\n\t/**\n\t * Defines the state of the `Dialog`.\n\t *\n\t * **Note:** If `\"Negative\"` and `\"Critical\"` states is set, it will change the\n\t * accessibility role to \"alertdialog\", if the accessibleRole property is set to `\"Dialog\"`.\n\t * @default \"None\"\n\t * @public\n\t * @since 1.0.0-rc.15\n\t */\n\t@property()\n\tstate: `${ValueState}` = \"None\";\n\n\t_screenResizeHandler: () => void;\n\t_dragMouseMoveHandler: (e: MouseEvent) => void;\n\t_dragMouseUpHandler: (e: MouseEvent) => void;\n\t_resizeMouseMoveHandler: (e: MouseEvent) => void;\n\t_resizeMouseUpHandler: (e: MouseEvent) => void;\n\t_dragStartHandler: (e: DragEvent) => void;\n\t_y?: number;\n\t_x?: number;\n\t_isRTL?: boolean;\n\t_screenResizeHandlerAttached?: boolean;\n\t_initialX?: number;\n\t_initialY?: number;\n\t_initialWidth?: number;\n\t_initialHeight?: number;\n\t_initialTop?: number;\n\t_initialLeft?: number;\n\t_minWidth?: number;\n\t_cachedMinHeight?: number;\n\t_draggedOrResized = false;\n\t_dragHandlerRegistered = false;\n\n\t/**\n\t * Defines the header HTML Element.\n\t *\n\t * **Note:** When a `ui5-bar` is used in the header, you should remove the default dialog's paddings.\n\t *\n\t * **Note:** If `header` slot is provided, the labelling of the dialog is a responsibility of the application developer.\n\t * `accessibleName` should be used.\n\t * @public\n\t */\n\t@slot()\n\theader!: Slot<HTMLElement>;\n\n\t/**\n\t * Defines the footer HTML Element.\n\t *\n\t * **Note:** When a `ui5-bar` is used in the footer, you should remove the default dialog's paddings.\n\t * @public\n\t */\n\t@slot()\n\tfooter!: Slot<HTMLElement>;\n\n\t@i18n(\"@ui5/webcomponents\")\n\tstatic i18nBundle: I18nBundle;\n\n\tconstructor() {\n\t\tsuper();\n\n\t\tthis._screenResizeHandler = this._screenResize.bind(this);\n\n\t\tthis._dragMouseMoveHandler = this._onDragMouseMove.bind(this);\n\t\tthis._dragMouseUpHandler = this._onDragMouseUp.bind(this);\n\n\t\tthis._resizeMouseMoveHandler = this._onResizeMouseMove.bind(this);\n\t\tthis._resizeMouseUpHandler = this._onResizeMouseUp.bind(this);\n\n\t\tthis._dragStartHandler = this._handleDragStart.bind(this);\n\t}\n\n\tstatic _isHeader(element: HTMLElement) {\n\t\treturn element.classList.contains(\"ui5-popup-header-root\") || element.getAttribute(\"slot\") === \"header\";\n\t}\n\n\tget isModal() {\n\t\treturn true;\n\t}\n\n\tget _ariaLabelledBy() {\n\t\tlet ariaLabelledById;\n\n\t\tif (this.headerText && !this._ariaLabel) {\n\t\t\tariaLabelledById = \"ui5-popup-header-text\";\n\t\t}\n\n\t\treturn ariaLabelledById;\n\t}\n\n\tget ariaRoleDescriptionHeaderText() {\n\t\treturn (this.resizable || this.draggable) ? Dialog.i18nBundle.getText(DIALOG_HEADER_ARIA_ROLE_DESCRIPTION) : undefined;\n\t}\n\n\tget effectiveAriaDescribedBy() {\n\t\treturn (this.resizable || this.draggable) ? `${this._id}-descr` : undefined;\n\t}\n\n\tget ariaDescribedByHeaderTextResizable() {\n\t\treturn Dialog.i18nBundle.getText(DIALOG_HEADER_ARIA_DESCRIBEDBY_RESIZABLE);\n\t}\n\n\tget ariaDescribedByHeaderTextDraggable() {\n\t\treturn Dialog.i18nBundle.getText(DIALOG_HEADER_ARIA_DESCRIBEDBY_DRAGGABLE);\n\t}\n\n\tget ariaDescribedByHeaderTextDraggableAndResizable() {\n\t\treturn Dialog.i18nBundle.getText(DIALOG_HEADER_ARIA_DESCRIBEDBY_DRAGGABLE_RESIZABLE);\n\t}\n\n\t/**\n\t * Determines if the header should be shown.\n\t */\n\tget _displayHeader() {\n\t\treturn this.header.length || this.headerText || this.draggable || this.resizable;\n\t}\n\n\tget _movable() {\n\t\treturn !this.stretch && this.onDesktop && (this.draggable || this.resizable);\n\t}\n\n\tget _headerTabIndex() {\n\t\treturn this._movable ? 0 : undefined;\n\t}\n\n\tget _showResizeHandle() {\n\t\treturn this.resizable && this.onDesktop;\n\t}\n\n\tget _minHeight() {\n\t\tlet minHeight = Number.parseInt(window.getComputedStyle(this.contentDOM).minHeight);\n\n\t\tconst header = this._root.querySelector<HTMLElement>(\".ui5-popup-header-root\");\n\t\tif (header) {\n\t\t\tminHeight += header.offsetHeight;\n\t\t}\n\n\t\tconst footer = this._root.querySelector<HTMLElement>(\".ui5-popup-footer-root\");\n\t\tif (footer) {\n\t\t\tminHeight += footer.offsetHeight;\n\t\t}\n\n\t\treturn minHeight;\n\t}\n\n\tget hasValueState() {\n\t\treturn this.state !== ValueState.None;\n\t}\n\n\tget _dialogStateIcon() {\n\t\treturn ICON_PER_STATE[this.state as ValueStateWithIcon];\n\t}\n\n\tget _role() {\n\t\tif (this.accessibleRole === PopupAccessibleRole.None) {\n\t\t\treturn undefined;\n\t\t}\n\n\t\tif (this.state === ValueState.Negative || this.state === ValueState.Critical) {\n\t\t\treturn toLowercaseEnumValue(PopupAccessibleRole.AlertDialog);\n\t\t}\n\n\t\treturn toLowercaseEnumValue(this.accessibleRole);\n\t}\n\n\t_show() {\n\t\tsuper._show();\n\t\tthis._center();\n\t}\n\n\tonBeforeRendering() {\n\t\tsuper.onBeforeRendering();\n\n\t\tthis._isRTL = this.effectiveDir === \"rtl\";\n\t}\n\n\t/**\n\t * @override\n\t */\n\t_resize() {\n\t\tsuper._resize();\n\n\t\tif (!this._draggedOrResized) {\n\t\t\tthis._center();\n\t\t}\n\t}\n\n\t_screenResize() {\n\t\tthis._center();\n\t}\n\n\t_attachBrowserEvents() {\n\t\tthis._attachScreenResizeHandler();\n\t\tthis._registerDragHandler();\n\t}\n\n\t_detachBrowserEvents() {\n\t\tthis._detachScreenResizeHandler();\n\t\tthis._deregisterDragHandler();\n\t}\n\n\t_attachScreenResizeHandler() {\n\t\tif (!this._screenResizeHandlerAttached) {\n\t\t\twindow.addEventListener(\"resize\", this._screenResizeHandler);\n\t\t\tthis._screenResizeHandlerAttached = true;\n\t\t}\n\t}\n\n\t_detachScreenResizeHandler() {\n\t\tif (this._screenResizeHandlerAttached) {\n\t\t\twindow.removeEventListener(\"resize\", this._screenResizeHandler);\n\t\t\tthis._screenResizeHandlerAttached = false; // prevent dialog from repositioning during resizing\n\t\t}\n\t}\n\n\t_registerDragHandler() {\n\t\tif (!this._dragHandlerRegistered) {\n\t\t\tthis.addEventListener(\"dragstart\", this._dragStartHandler);\n\t\t\tthis._dragHandlerRegistered = true;\n\t\t}\n\t}\n\n\t_deregisterDragHandler() {\n\t\tif (this._dragHandlerRegistered) {\n\t\t\tthis.removeEventListener(\"dragstart\", this._dragStartHandler);\n\t\t\tthis._dragHandlerRegistered = false;\n\t\t}\n\t}\n\n\t_center() {\n\t\tconst height = window.innerHeight - this.offsetHeight,\n\t\t\twidth = window.innerWidth - this.offsetWidth;\n\n\t\tObject.assign(this.style, {\n\t\t\ttop: `${Math.round(height / 2)}px`,\n\t\t\tleft: `${Math.round(width / 2)}px`,\n\t\t});\n\t}\n\n\t_revertSize = () => {\n\t\tObject.assign(this.style, {\n\t\t\ttop: \"\",\n\t\t\tleft: \"\",\n\t\t\twidth: \"\",\n\t\t\theight: \"\",\n\t\t});\n\t}\n\n\t/**\n\t * Event handlers\n\t */\n\t_onDragMouseDown(e: MouseEvent) {\n\t\t// allow dragging only on the header\n\t\tif (!this._movable || !this.draggable || !Dialog._isHeader(e.target as HTMLElement)) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst {\n\t\t\ttop,\n\t\t\tleft,\n\t\t} = this.getBoundingClientRect();\n\t\tconst {\n\t\t\twidth,\n\t\t\theight,\n\t\t} = window.getComputedStyle(this);\n\n\t\tObject.assign(this.style, {\n\t\t\ttop: `${top}px`,\n\t\t\tleft: `${left}px`,\n\t\t\twidth: `${Math.round(Number.parseFloat(width) * 100) / 100}px`,\n\t\t\theight: `${Math.round(Number.parseFloat(height) * 100) / 100}px`,\n\t\t});\n\n\t\tthis._x = e.clientX;\n\t\tthis._y = e.clientY;\n\n\t\tthis._draggedOrResized = true;\n\t\tthis._attachMouseDragHandlers();\n\t}\n\n\t_onDragMouseMove(e: MouseEvent) {\n\t\te.preventDefault();\n\n\t\tconst { clientX, clientY } = e;\n\t\tconst calcX = this._x! - clientX;\n\t\tconst calcY = this._y! - clientY;\n\t\tconst {\n\t\t\tleft,\n\t\t\ttop,\n\t\t} = this.getBoundingClientRect();\n\n\t\tObject.assign(this.style, {\n\t\t\tleft: `${Math.floor(left - calcX)}px`,\n\t\t\ttop: `${Math.floor(top - calcY)}px`,\n\t\t});\n\n\t\tthis._x = clientX;\n\t\tthis._y = clientY;\n\t}\n\n\t_onDragMouseUp() {\n\t\tdelete this._x;\n\t\tdelete this._y;\n\n\t\tthis._detachMouseDragHandlers();\n\t}\n\n\t_onDragOrResizeKeyDown(e: KeyboardEvent) {\n\t\tif (!this._movable || !Dialog._isHeader(e.target as HTMLElement)) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (this.draggable && [isUp, isDown, isLeft, isRight].some(key => key(e))) {\n\t\t\tthis._dragWithEvent(e);\n\t\t\treturn;\n\t\t}\n\n\t\tif (this.resizable && [isUpShift, isDownShift, isLeftShift, isRightShift].some(key => key(e))) {\n\t\t\tthis._resizeWithEvent(e);\n\t\t}\n\t}\n\n\t_dragWithEvent(e: KeyboardEvent) {\n\t\tconst {\n\t\t\ttop,\n\t\t\tleft,\n\t\t\twidth,\n\t\t\theight,\n\t\t} = this.getBoundingClientRect();\n\n\t\tlet newPos = 0;\n\t\tlet posDirection: \"top\" | \"left\" = \"top\";\n\n\t\tswitch (true) {\n\t\tcase isUp(e):\n\t\t\tnewPos = top - STEP_SIZE;\n\t\t\tposDirection = \"top\";\n\t\t\tbreak;\n\t\tcase isDown(e):\n\t\t\tnewPos = top + STEP_SIZE;\n\t\t\tposDirection = \"top\";\n\t\t\tbreak;\n\t\tcase isLeft(e):\n\t\t\tnewPos = left - STEP_SIZE;\n\t\t\tposDirection = \"left\";\n\t\t\tbreak;\n\t\tcase isRight(e):\n\t\t\tnewPos = left + STEP_SIZE;\n\t\t\tposDirection = \"left\";\n\t\t\tbreak;\n\t\t}\n\n\t\tnewPos = clamp(\n\t\t\tnewPos,\n\t\t\t0,\n\t\t\tposDirection === \"left\" ? window.innerWidth - width : window.innerHeight - height,\n\t\t);\n\n\t\tthis.style[posDirection] = `${newPos}px`;\n\t}\n\n\t_resizeWithEvent(e: KeyboardEvent) {\n\t\tthis._draggedOrResized = true;\n\t\tthis.addEventListener(\"ui5-before-close\", this._revertSize, { once: true });\n\n\t\tconst { top, left } = this.getBoundingClientRect(),\n\t\t\tstyle = window.getComputedStyle(this),\n\t\t\tminWidth = Number.parseFloat(style.minWidth),\n\t\t\tmaxWidth = window.innerWidth - left,\n\t\t\tmaxHeight = window.innerHeight - top;\n\n\t\tlet width = Number.parseFloat(style.width),\n\t\t\theight = Number.parseFloat(style.height);\n\n\t\tswitch (true) {\n\t\tcase isUpShift(e):\n\t\t\theight -= STEP_SIZE;\n\t\t\tbreak;\n\t\tcase isDownShift(e):\n\t\t\theight += STEP_SIZE;\n\t\t\tbreak;\n\t\tcase isLeftShift(e):\n\t\t\twidth -= STEP_SIZE;\n\t\t\tbreak;\n\t\tcase isRightShift(e):\n\t\t\twidth += STEP_SIZE;\n\t\t\tbreak;\n\t\t}\n\n\t\twidth = clamp(width, minWidth, maxWidth);\n\t\theight = clamp(height, this._minHeight, maxHeight);\n\n\t\tObject.assign(this.style, {\n\t\t\twidth: `${width}px`,\n\t\t\theight: `${height}px`,\n\t\t});\n\t}\n\n\t_attachMouseDragHandlers() {\n\t\twindow.addEventListener(\"mousemove\", this._dragMouseMoveHandler);\n\t\twindow.addEventListener(\"mouseup\", this._dragMouseUpHandler);\n\t}\n\n\t_detachMouseDragHandlers() {\n\t\twindow.removeEventListener(\"mousemove\", this._dragMouseMoveHandler);\n\t\twindow.removeEventListener(\"mouseup\", this._dragMouseUpHandler);\n\t}\n\n\t_onResizeMouseDown(e: MouseEvent) {\n\t\tif (!this._movable || !this.resizable) {\n\t\t\treturn;\n\t\t}\n\n\t\te.preventDefault();\n\n\t\tconst {\n\t\t\ttop,\n\t\t\tleft,\n\t\t} = this.getBoundingClientRect();\n\t\tconst {\n\t\t\twidth,\n\t\t\theight,\n\t\t\tminWidth,\n\t\t} = window.getComputedStyle(this);\n\n\t\tthis._initialX = e.clientX;\n\t\tthis._initialY = e.clientY;\n\t\tthis._initialWidth = Number.parseFloat(width);\n\t\tthis._initialHeight = Number.parseFloat(height);\n\t\tthis._initialTop = top;\n\t\tthis._initialLeft = left;\n\t\tthis._minWidth = Number.parseFloat(minWidth);\n\t\tthis._cachedMinHeight = this._minHeight;\n\n\t\tObject.assign(this.style, {\n\t\t\ttop: `${top}px`,\n\t\t\tleft: `${left}px`,\n\t\t});\n\n\t\tthis._draggedOrResized = true;\n\t\tthis._attachMouseResizeHandlers();\n\t}\n\n\t_onResizeMouseMove(e: MouseEvent) {\n\t\tconst { clientX, clientY } = e;\n\n\t\tlet newWidth,\n\t\t\tnewLeft;\n\n\t\tif (this._isRTL) {\n\t\t\tnewWidth = clamp(\n\t\t\t\tthis._initialWidth! - (clientX - this._initialX!),\n\t\t\t\tthis._minWidth!,\n\t\t\t\tthis._initialLeft! + this._initialWidth!,\n\t\t\t);\n\n\t\t\t// check if width is changed to avoid \"left\" jumping when max width is reached\n\t\t\tObject.assign(this.style, {\n\t\t\t\twidth: `${newWidth}px`,\n\t\t\t});\n\n\t\t\tconst deltaWidth = newWidth - this.getBoundingClientRect().width;\n\t\t\tconst rightEdge = this._initialLeft! + this._initialWidth! + deltaWidth;\n\n\t\t\tnewLeft = clamp(\n\t\t\t\trightEdge - newWidth,\n\t\t\t\t0,\n\t\t\t\trightEdge - this._minWidth!,\n\t\t\t);\n\t\t} else {\n\t\t\tnewWidth = clamp(\n\t\t\t\tthis._initialWidth! + (clientX - this._initialX!),\n\t\t\t\tthis._minWidth!,\n\t\t\t\twindow.innerWidth - this._initialLeft!,\n\t\t\t);\n\t\t}\n\n\t\tconst newHeight = clamp(\n\t\t\tthis._initialHeight! + (clientY - this._initialY!),\n\t\t\tthis._cachedMinHeight!,\n\t\t\twindow.innerHeight - this._initialTop!,\n\t\t);\n\n\t\tObject.assign(this.style, {\n\t\t\theight: `${newHeight}px`,\n\t\t\twidth: `${newWidth}px`,\n\t\t\tleft: this._isRTL ? `${newLeft}px` : undefined,\n\t\t});\n\t}\n\n\t_onResizeMouseUp() {\n\t\tdelete this._initialX;\n\t\tdelete this._initialY;\n\t\tdelete this._initialWidth;\n\t\tdelete this._initialHeight;\n\t\tdelete this._initialTop;\n\t\tdelete this._initialLeft;\n\t\tdelete this._minWidth;\n\t\tdelete this._cachedMinHeight;\n\n\t\tthis._detachMouseResizeHandlers();\n\t}\n\n\t_handleDragStart(e: DragEvent) {\n\t\tif (this.draggable) {\n\t\t\te.preventDefault();\n\t\t}\n\t}\n\n\t_attachMouseResizeHandlers() {\n\t\twindow.addEventListener(\"mousemove\", this._resizeMouseMoveHandler);\n\t\twindow.addEventListener(\"mouseup\", this._resizeMouseUpHandler);\n\t\tthis.addEventListener(\"ui5-before-close\", this._revertSize, { once: true });\n\t}\n\n\t_detachMouseResizeHandlers() {\n\t\twindow.removeEventListener(\"mousemove\", this._resizeMouseMoveHandler);\n\t\twindow.removeEventListener(\"mouseup\", this._resizeMouseUpHandler);\n\t}\n}\n\nDialog.define();\n\nexport default Dialog;\n"]}

package/dist/DialogTemplate.d.ts

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

package/dist/DialogTemplate.js

@@ -0,0 +1,32 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "@ui5/webcomponents-base/jsx-runtime";
+import resizeCorner from "@ui5/webcomponents-icons/dist/resize-corner.js";
+import PopupTemplate from "./PopupTemplate.js";
+import Title from "./Title.js";
+import Icon from "./Icon.js";
+export default function DialogTemplate() {
+    return PopupTemplate.call(this, {
+        beforeContent,
+        afterContent,
+    });
+}
+function beforeContent() {
+    return (_jsx(_Fragment, { children: !!this._displayHeader &&
+            _jsx("header", { children: _jsxs("div", { class: "ui5-popup-header-root", id: "ui5-popup-header", role: "group", "aria-describedby": this.effectiveAriaDescribedBy, "aria-roledescription": this.ariaRoleDescriptionHeaderText, tabIndex: this._headerTabIndex, onKeyDown: this._onDragOrResizeKeyDown, onMouseDown: this._onDragMouseDown, part: "header", children: [this.hasValueState &&
+                            _jsx(Icon, { class: "ui5-dialog-value-state-icon", name: this._dialogStateIcon }), this.header.length ?
+                            _jsx("slot", { name: "header" })
+                            :
+                                _jsx(Title, { level: "H1", id: "ui5-popup-header-text", class: "ui5-popup-header-text", children: this.headerText }), this.resizable ?
+                            this.draggable ?
+                                _jsx("span", { id: `${this._id}-descr`, "aria-hidden": "true", class: "ui5-hidden-text", children: this.ariaDescribedByHeaderTextDraggableAndResizable })
+                                :
+                                    _jsx("span", { id: `${this._id}-descr`, "aria-hidden": "true", class: "ui5-hidden-text", children: this.ariaDescribedByHeaderTextResizable })
+                            :
+                                this.draggable &&
+                                    _jsx("span", { id: `${this._id}-descr`, "aria-hidden": "true", class: "ui5-hidden-text", children: this.ariaDescribedByHeaderTextDraggable })] }) }) }));
+}
+function afterContent() {
+    return (_jsxs(_Fragment, { children: [!!this.footer.length &&
+                _jsx("footer", { class: "ui5-popup-footer-root", part: "footer", children: _jsx("slot", { name: "footer" }) }), this._showResizeHandle &&
+                _jsx("div", { class: "ui5-popup-resize-handle", onMouseDown: this._onResizeMouseDown, children: _jsx(Icon, { name: resizeCorner }) })] }));
+}
+//# sourceMappingURL=DialogTemplate.js.map

package/dist/DialogTemplate.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DialogTemplate.js","sourceRoot":"","sources":["../src/DialogTemplate.tsx"],"names":[],"mappings":";AAAA,OAAO,YAAY,MAAM,gDAAgD,CAAC;AAE1E,OAAO,aAAa,MAAM,oBAAoB,CAAC;AAC/C,OAAO,KAAK,MAAM,YAAY,CAAC;AAC/B,OAAO,IAAI,MAAM,WAAW,CAAC;AAE7B,MAAM,CAAC,OAAO,UAAU,cAAc;IACrC,OAAO,aAAa,CAAC,IAAI,CAAC,IAAI,EAAE;QAC/B,aAAa;QACb,YAAY;KACZ,CAAC,CAAC;AACJ,CAAC;AAED,SAAS,aAAa;IACrB,OAAO,CAAC,4BACN,CAAC,CAAC,IAAI,CAAC,cAAc;YACrB,2BACC,eACC,KAAK,EAAC,uBAAuB,EAC7B,EAAE,EAAC,kBAAkB,EACrB,IAAI,EAAC,OAAO,sBACM,IAAI,CAAC,wBAAwB,0BACzB,IAAI,CAAC,6BAA6B,EACxD,QAAQ,EAAE,IAAI,CAAC,eAAe,EAC9B,SAAS,EAAE,IAAI,CAAC,sBAAsB,EACtC,WAAW,EAAE,IAAI,CAAC,gBAAgB,EAClC,IAAI,EAAC,QAAQ,aAGZ,IAAI,CAAC,aAAa;4BAClB,KAAC,IAAI,IAAC,KAAK,EAAC,6BAA6B,EAAC,IAAI,EAAE,IAAI,CAAC,gBAAgB,GAAS,EAE9E,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;4BACpB,eAAM,IAAI,EAAC,QAAQ,GAAQ;4BAC3B,CAAC;gCACD,KAAC,KAAK,IAAC,KAAK,EAAC,IAAI,EAAC,EAAE,EAAC,uBAAuB,EAAC,KAAK,EAAC,uBAAuB,YAAE,IAAI,CAAC,UAAU,GAAS,EAGpG,IAAI,CAAC,SAAS,CAAC,CAAC;4BAChB,IAAI,CAAC,SAAS,CAAC,CAAC;gCACf,eAAM,EAAE,EAAE,GAAG,IAAI,CAAC,GAAG,QAAQ,iBAAc,MAAM,EAAC,KAAK,EAAC,iBAAiB,YAAE,IAAI,CAAC,8CAA8C,GAAQ;gCACtI,CAAC;oCACD,eAAM,EAAE,EAAE,GAAG,IAAI,CAAC,GAAG,QAAQ,iBAAc,MAAM,EAAC,KAAK,EAAC,iBAAiB,YAAE,IAAI,CAAC,kCAAkC,GAAQ;4BAC3H,CAAC;gCACD,IAAI,CAAC,SAAS;oCACb,eAAM,EAAE,EAAE,GAAG,IAAI,CAAC,GAAG,QAAQ,iBAAc,MAAM,EAAC,KAAK,EAAC,iBAAiB,YAAE,IAAI,CAAC,kCAAkC,GAAQ,IAEvH,GACE,GAER,CAAC,CAAC;AACN,CAAC;AAED,SAAS,YAAY;IACpB,OAAO,CAAC,8BACN,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,MAAM;gBACpB,iBAAQ,KAAK,EAAC,uBAAuB,EAAC,IAAI,EAAC,QAAQ,YAClD,eAAM,IAAI,EAAC,QAAQ,GAAQ,GACnB,EAET,IAAI,CAAC,iBAAiB;gBACtB,cACC,KAAK,EAAC,yBAAyB,EAC/B,WAAW,EAAE,IAAI,CAAC,kBAAkB,YAEpC,KAAC,IAAI,IAAC,IAAI,EAAE,YAAY,GAAS,GAC5B,IAEL,CAAC,CAAC;AACN,CAAC","sourcesContent":["import resizeCorner from \"@ui5/webcomponents-icons/dist/resize-corner.js\";\nimport type Dialog from \"./Dialog.js\";\nimport PopupTemplate from \"./PopupTemplate.js\";\nimport Title from \"./Title.js\";\nimport Icon from \"./Icon.js\";\n\nexport default function DialogTemplate(this: Dialog) {\n\treturn PopupTemplate.call(this, {\n\t\tbeforeContent,\n\t\tafterContent,\n\t});\n}\n\nfunction beforeContent(this: Dialog) {\n\treturn (<>\n\t\t{!!this._displayHeader &&\n\t\t\t<header>\n\t\t\t\t<div\n\t\t\t\t\tclass=\"ui5-popup-header-root\"\n\t\t\t\t\tid=\"ui5-popup-header\"\n\t\t\t\t\trole=\"group\"\n\t\t\t\t\taria-describedby={this.effectiveAriaDescribedBy}\n\t\t\t\t\taria-roledescription={this.ariaRoleDescriptionHeaderText}\n\t\t\t\t\ttabIndex={this._headerTabIndex}\n\t\t\t\t\tonKeyDown={this._onDragOrResizeKeyDown}\n\t\t\t\t\tonMouseDown={this._onDragMouseDown}\n\t\t\t\t\tpart=\"header\"\n\t\t\t\t\t// state={this.state}\n\t\t\t\t>\n\t\t\t\t\t{this.hasValueState &&\n\t\t\t\t\t\t<Icon class=\"ui5-dialog-value-state-icon\" name={this._dialogStateIcon}></Icon>\n\t\t\t\t\t}\n\t\t\t\t\t{this.header.length ?\n\t\t\t\t\t\t<slot name=\"header\"></slot>\n\t\t\t\t\t\t:\n\t\t\t\t\t\t<Title level=\"H1\" id=\"ui5-popup-header-text\" class=\"ui5-popup-header-text\">{this.headerText}</Title>\n\t\t\t\t\t}\n\n\t\t\t\t\t{this.resizable ?\n\t\t\t\t\t\tthis.draggable ?\n\t\t\t\t\t\t\t<span id={`${this._id}-descr`} aria-hidden=\"true\" class=\"ui5-hidden-text\">{this.ariaDescribedByHeaderTextDraggableAndResizable}</span>\n\t\t\t\t\t\t\t:\n\t\t\t\t\t\t\t<span id={`${this._id}-descr`} aria-hidden=\"true\" class=\"ui5-hidden-text\">{this.ariaDescribedByHeaderTextResizable}</span>\n\t\t\t\t\t\t:\n\t\t\t\t\t\tthis.draggable &&\n\t\t\t\t\t\t\t<span id={`${this._id}-descr`} aria-hidden=\"true\" class=\"ui5-hidden-text\">{this.ariaDescribedByHeaderTextDraggable}</span>\n\t\t\t\t\t}\n\t\t\t\t</div>\n\t\t\t</header>\n\t\t}\n\t</>);\n}\n\nfunction afterContent(this: Dialog) {\n\treturn (<>\n\t\t{!!this.footer.length &&\n\t\t\t<footer class=\"ui5-popup-footer-root\" part=\"footer\">\n\t\t\t\t<slot name=\"footer\"></slot>\n\t\t\t</footer>\n\t\t}\n\t\t{this._showResizeHandle &&\n\t\t\t<div\n\t\t\t\tclass=\"ui5-popup-resize-handle\"\n\t\t\t\tonMouseDown={this._onResizeMouseDown}\n\t\t\t>\n\t\t\t\t<Icon name={resizeCorner}></Icon>\n\t\t\t</div>\n\t\t}\n\t</>);\n}\n"]}