@ui5/webcomponents 0.0.0-d9b978d1d → 0.0.0-da0d3eb88

package/dist/BreadcrumbsItem.js

@@ -8,27 +8,26 @@ import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
 import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js";
 import property from "@ui5/webcomponents-base/dist/decorators/property.js";
 import slot from "@ui5/webcomponents-base/dist/decorators/slot.js";
+import LinkDesign from "./types/LinkDesign.js";
 /**
  * @class
  *
- * <h3 class="comment-api-title">Overview</h3>
- *
- * The <code>ui5-breadcrumbs-item</code> component defines the content of an item in <code>ui5-breadcrumbs</code>.
+ * ### Overview
  *
+ * The `ui5-breadcrumbs-item` component defines the content of an item in `ui5-breadcrumbs`.
  * @constructor
- * @author SAP SE
- * @alias sap.ui.webc.main.BreadcrumbsItem
- * @extends sap.ui.webc.base.UI5Element
- * @abstract
- * @tagname ui5-breadcrumbs-item
- * @implements sap.ui.webc.main.IBreadcrumbsItem
+ * @extends UI5Element
  * @public
  * @since 1.0.0-rc.15
+ * @abstract
  */
 let BreadcrumbsItem = class BreadcrumbsItem extends UI5Element {
     get stableDomRef() {
         return this.getAttribute("stable-dom-ref") || `${this._id}-stable-dom-ref`;
     }
+    get _linkDesign() {
+        return this._isCurrentPageItem ? LinkDesign.Emphasized : LinkDesign.Default;
+    }
 };
 __decorate([
     property()

package/dist/BreadcrumbsItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"BreadcrumbsItem.js","sourceRoot":"","sources":["../src/BreadcrumbsItem.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,UAAU,MAAM,4CAA4C,CAAC;AACpE,OAAO,aAAa,MAAM,0DAA0D,CAAC;AACrF,OAAO,QAAQ,MAAM,qDAAqD,CAAC;AAC3E,OAAO,IAAI,MAAM,iDAAiD,CAAC;AAEnE;;;;;;;;;;;;;;;;GAgBG;AAEH,IAAM,eAAe,GAArB,MAAM,eAAgB,SAAQ,UAAU;IA8DvC,IAAI,YAAY;QACf,OAAO,IAAI,CAAC,YAAY,CAAC,gBAAgB,CAAC,IAAI,GAAG,IAAI,CAAC,GAAG,iBAAiB,CAAC;IAC5E,CAAC;CACD,CAAA;AArDA;IADC,QAAQ,EAAE;6CACG;AAsBd;IADC,QAAQ,CAAC,EAAE,YAAY,EAAE,SAAS,EAAE,CAAC;+CACtB;AAWhB;IADC,QAAQ,EAAE;uDACY;AAavB;IADC,IAAI,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;6CACnB;AA1Dd,eAAe;IADpB,aAAa,CAAC,sBAAsB,CAAC;GAChC,eAAe,CAiEpB;AAED,eAAe,CAAC,MAAM,EAAE,CAAC;AAEzB,eAAe,eAAe,CAAC","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot.js\";\n\n/**\n * @class\n *\n * <h3 class=\"comment-api-title\">Overview</h3>\n *\n * The <code>ui5-breadcrumbs-item</code> component defines the content of an item in <code>ui5-breadcrumbs</code>.\n *\n * @constructor\n * @author SAP SE\n * @alias sap.ui.webc.main.BreadcrumbsItem\n * @extends sap.ui.webc.base.UI5Element\n * @abstract\n * @tagname ui5-breadcrumbs-item\n * @implements sap.ui.webc.main.IBreadcrumbsItem\n * @public\n * @since 1.0.0-rc.15\n */\n@customElement(\"ui5-breadcrumbs-item\")\nclass BreadcrumbsItem extends UI5Element {\n\t/**\n\t * Defines the link href.\n\t * <br><br>\n\t * <b>Note:</b> Standard hyperlink behavior is supported.\n\t *\n\t * @type {string}\n\t * @name sap.ui.webc.main.BreadcrumbsItem.prototype.href\n\t * @defaultvalue \"\"\n\t * @public\n\t */\n\t@property()\n\thref!: string;\n\n\t/**\n\t * Defines the link target.\n\t * <br><br>\n\t * Available options are:\n\t * <ul>\n\t * <li><code>_self</code></li>\n\t * <li><code>_top</code></li>\n\t * <li><code>_blank</code></li>\n\t * <li><code>_parent</code></li>\n\t * <li><code>_search</code></li>\n\t * </ul>\n\t * <br><br>\n\t * <b>Note:<b> This property must only be used when the <code>href</code> property is set.\n\t *\n\t * @type {string}\n\t * @name sap.ui.webc.main.BreadcrumbsItem.prototype.target\n\t * @defaultvalue undefined\n\t * @public\n\t */\n\t@property({ defaultValue: undefined })\n\ttarget?: string;\n\n\t/**\n\t * Defines the accessible ARIA name of the item.\n\t *\n\t * @type {string}\n\t * @name sap.ui.webc.main.BreadcrumbsItem.prototype.accessibleName\n\t * @defaultvalue undefined\n\t * @public\n\t */\n\t@property()\n\taccessibleName!: string\n\n\t/**\n\t * Defines the text of the component.\n\t * <br><br>\n\t * <b>Note:</b> Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.\n\t *\n\t * @type {Node[]}\n\t * @name sap.ui.webc.main.BreadcrumbsItem.prototype.default\n\t * @slot\n\t * @public\n\t */\n\t@slot({ type: Node, \"default\": true })\n\ttext!: Array<Node>;\n\n\t_accessibleNameText?: string;\n\n\tget stableDomRef() {\n\t\treturn this.getAttribute(\"stable-dom-ref\") || `${this._id}-stable-dom-ref`;\n\t}\n}\n\nBreadcrumbsItem.define();\n\nexport default BreadcrumbsItem;\n"]}
+{"version":3,"file":"BreadcrumbsItem.js","sourceRoot":"","sources":["../src/BreadcrumbsItem.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,UAAU,MAAM,4CAA4C,CAAC;AACpE,OAAO,aAAa,MAAM,0DAA0D,CAAC;AACrF,OAAO,QAAQ,MAAM,qDAAqD,CAAC;AAC3E,OAAO,IAAI,MAAM,iDAAiD,CAAC;AACnE,OAAO,UAAU,MAAM,uBAAuB,CAAC;AAE/C;;;;;;;;;;;GAWG;AAEH,IAAM,eAAe,GAArB,MAAM,eAAgB,SAAQ,UAAU;IAiDvC,IAAI,YAAY;QACf,OAAO,IAAI,CAAC,YAAY,CAAC,gBAAgB,CAAC,IAAI,GAAG,IAAI,CAAC,GAAG,iBAAiB,CAAC;IAC5E,CAAC;IAED,IAAI,WAAW;QACd,OAAO,IAAI,CAAC,kBAAkB,CAAC,CAAC,CAAC,UAAU,CAAC,UAAU,CAAC,CAAC,CAAC,UAAU,CAAC,OAAO,CAAC;IAC7E,CAAC;CACD,CAAA;AA/CA;IADC,QAAQ,EAAE;6CACG;AAkBd;IADC,QAAQ,CAAC,EAAE,YAAY,EAAE,SAAS,EAAE,CAAC;+CACtB;AAQhB;IADC,QAAQ,EAAE;uDACY;AASvB;IADC,IAAI,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;6CACnB;AA5Cd,eAAe;IADpB,aAAa,CAAC,sBAAsB,CAAC;GAChC,eAAe,CAwDpB;AAED,eAAe,CAAC,MAAM,EAAE,CAAC;AAEzB,eAAe,eAAe,CAAC","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot.js\";\nimport LinkDesign from \"./types/LinkDesign.js\";\n\n/**\n * @class\n *\n * ### Overview\n *\n * The `ui5-breadcrumbs-item` component defines the content of an item in `ui5-breadcrumbs`.\n * @constructor\n * @extends UI5Element\n * @public\n * @since 1.0.0-rc.15\n * @abstract\n */\n@customElement(\"ui5-breadcrumbs-item\")\nclass BreadcrumbsItem extends UI5Element {\n\t/**\n\t * Defines the link href.\n\t *\n\t * **Note:** Standard hyperlink behavior is supported.\n\t * @default \"\"\n\t * @public\n\t */\n\t@property()\n\thref!: string;\n\n\t/**\n\t * Defines the link target.\n\t *\n\t * Available options are:\n\t *\n\t * - `_self`\n\t * - `_top`\n\t * - `_blank`\n\t * - `_parent`\n\t * - `_search`\n\t *\n\t * **Note:** This property must only be used when the `href` property is set.\n\t * @default undefined\n\t * @public\n\t */\n\t@property({ defaultValue: undefined })\n\ttarget?: string;\n\n\t/**\n\t * Defines the accessible ARIA name of the item.\n\t * @default undefined\n\t * @public\n\t */\n\t@property()\n\taccessibleName!: string\n\n\t/**\n\t * Defines the text of the component.\n\t *\n\t * **Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.\n\t * @public\n\t */\n\t@slot({ type: Node, \"default\": true })\n\ttext!: Array<Node>;\n\n\t_accessibleNameText?: string;\n\t_isCurrentPageItem?: boolean;\n\n\tget stableDomRef() {\n\t\treturn this.getAttribute(\"stable-dom-ref\") || `${this._id}-stable-dom-ref`;\n\t}\n\n\tget _linkDesign() {\n\t\treturn this._isCurrentPageItem ? LinkDesign.Emphasized : LinkDesign.Default;\n\t}\n}\n\nBreadcrumbsItem.define();\n\nexport default BreadcrumbsItem;\n"]}

package/dist/BusyIndicator.d.ts

@@ -2,99 +2,83 @@ import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
 import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js";
 import type { Timeout } from "@ui5/webcomponents-base/dist/types.js";
 import BusyIndicatorSize from "./types/BusyIndicatorSize.js";
+import BusyIndicatorTextPlacement from "./types/BusyIndicatorTextPlacement.js";
 /**
  * @class
  *
- * <h3 class="comment-api-title">Overview</h3>
+ * ### Overview
  *
- * The <code>ui5-busy-indicator</code> signals that some operation is going on and that the
+ * The `ui5-busy-indicator` signals that some operation is going on and that the
  * user must wait. It does not block the current UI screen so other operations could be triggered in parallel.
  * It displays 3 dots and each dot expands and shrinks at a different rate, resulting in a cascading flow of animation.
  *
- * <h3>Usage</h3>
- * For the <code>ui5-busy-indicator</code> you can define the size, the text and whether it is shown or hidden.
+ * ### Usage
+ * For the `ui5-busy-indicator` you can define the size, the text and whether it is shown or hidden.
  * In order to hide it, use the "active" property.
- * <br><br>
- * In order to show busy state over an HTML element, simply nest the HTML element in a <code>ui5-busy-indicator</code> instance.
- * <br>
- * <b>Note:</b> Since <code>ui5-busy-indicator</code> has <code>display: inline-block;</code> by default and no width of its own,
- * whenever you need to wrap a block-level element, you should set <code>display: block</code> to the busy indicator as well.
  *
- * <h4>When to use:</h4>
- * <ul>
- * <li>The user needs to be able to cancel the operation.</li>
- * <li>Only part of the application or a particular component is affected.</li>
- * </ul>
+ * In order to show busy state over an HTML element, simply nest the HTML element in a `ui5-busy-indicator` instance.
  *
- * <h4>When not to use:</h4>
- * <ul>
- * <li>The operation takes less than one second.</li>
- * <li>You need to block the screen and prevent the user from starting another activity.</li>
- * <li>Do not show multiple busy indicators at once.</li>
- * </ul>
+ * **Note:** Since `ui5-busy-indicator` has `display: inline-block;` by default and no width of its own,
+ * whenever you need to wrap a block-level element, you should set `display: block` to the busy indicator as well.
  *
- * <h3>ES6 Module Import</h3>
+ * #### When to use:
  *
- * <code>import "@ui5/webcomponents/dist/BusyIndicator";</code>
+ * - The user needs to be able to cancel the operation.
+ * - Only part of the application or a particular component is affected.
  *
+ * #### When not to use:
+ *
+ * - The operation takes less than one second.
+ * - You need to block the screen and prevent the user from starting another activity.
+ * - Do not show multiple busy indicators at once.
+ *
+ * ### ES6 Module Import
+ *
+ * `import "@ui5/webcomponents/dist/BusyIndicator.js";`
  * @constructor
- * @author SAP SE
- * @alias sap.ui.webc.main.BusyIndicator
- * @extends sap.ui.webc.base.UI5Element
- * @tagname ui5-busy-indicator
+ * @extends UI5Element
  * @public
+ * @slot {Array<Node>} default - Determines the content over which the component will appear.
  * @since 0.12.0
  */
 declare class BusyIndicator extends UI5Element {
     /**
      * Defines text to be displayed below the component. It can be used to inform the user of the current operation.
-     * @type {string}
-     * @name sap.ui.webc.main.BusyIndicator.prototype.text
      * @public
-     * @defaultvalue ""
+     * @default ""
      * @since 1.0.0-rc.7
      */
     text: string;
     /**
      * Defines the size of the component.
-     *
-     * @type {sap.ui.webc.main.types.BusyIndicatorSize}
-     * @name sap.ui.webc.main.BusyIndicator.prototype.size
-     * @defaultvalue "Medium"
+     * @default "M"
      * @public
      */
     size: `${BusyIndicatorSize}`;
     /**
      * Defines if the busy indicator is visible on the screen. By default it is not.
-     *
-     * @type {boolean}
-     * @name sap.ui.webc.main.BusyIndicator.prototype.active
-     * @defaultvalue false
+     * @default false
      * @public
      */
     active: boolean;
     /**
      * Defines the delay in milliseconds, after which the busy indicator will be visible on the screen.
-     *
-     * @type {sap.ui.webc.base.types.Integer}
-     * @name sap.ui.webc.main.BusyIndicator.prototype.delay
-     * @defaultValue 1000
+     * @default 1000
      * @public
      */
     delay: number;
+    /**
+     * Defines the placement of the text.
+     *
+     * @default "Bottom"
+     * @public
+     */
+    textPlacement: `${BusyIndicatorTextPlacement}`;
     /**
      * Defines if the component is currently in busy state.
      * @private
      */
     _isBusy: boolean;
-    /**
-     * Determines the content over which the component will appear.
-     *
-     * @type {Node[]}
-     * @name sap.ui.webc.main.BusyIndicator.prototype.default
-     * @slot
-     * @public
-     */
     _keydownHandler: (e: KeyboardEvent) => void;
     _preventEventHandler: (e: KeyboardEvent) => void;
     _busyTimeoutId?: Timeout;
@@ -111,6 +95,10 @@ declare class BusyIndicator extends UI5Element {
             "ui5-busy-indicator-root": boolean;
         };
     };
+    get textPosition(): {
+        top: boolean | "";
+        bottom: boolean | "";
+    };
     onBeforeRendering(): void;
     _handleKeydown(e: KeyboardEvent): void;
     _preventEvent(e: KeyboardEvent): void;

package/dist/BusyIndicator.js

@@ -12,7 +12,9 @@ import litRender from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
 import { getI18nBundle } from "@ui5/webcomponents-base/dist/i18nBundle.js";
 import { isTabNext } from "@ui5/webcomponents-base/dist/Keys.js";
 import Integer from "@ui5/webcomponents-base/dist/types/Integer.js";
+import { isDesktop, } from "@ui5/webcomponents-base/dist/Device.js";
 import BusyIndicatorSize from "./types/BusyIndicatorSize.js";
+import BusyIndicatorTextPlacement from "./types/BusyIndicatorTextPlacement.js";
 import Label from "./Label.js";
 // Template
 import BusyIndicatorTemplate from "./generated/templates/BusyIndicatorTemplate.lit.js";
@@ -22,44 +24,39 @@ import busyIndicatorCss from "./generated/themes/BusyIndicator.css.js";
 /**
  * @class
  *
- * <h3 class="comment-api-title">Overview</h3>
+ * ### Overview
  *
- * The <code>ui5-busy-indicator</code> signals that some operation is going on and that the
+ * The `ui5-busy-indicator` signals that some operation is going on and that the
  * user must wait. It does not block the current UI screen so other operations could be triggered in parallel.
  * It displays 3 dots and each dot expands and shrinks at a different rate, resulting in a cascading flow of animation.
  *
- * <h3>Usage</h3>
- * For the <code>ui5-busy-indicator</code> you can define the size, the text and whether it is shown or hidden.
+ * ### Usage
+ * For the `ui5-busy-indicator` you can define the size, the text and whether it is shown or hidden.
  * In order to hide it, use the "active" property.
- * <br><br>
- * In order to show busy state over an HTML element, simply nest the HTML element in a <code>ui5-busy-indicator</code> instance.
- * <br>
- * <b>Note:</b> Since <code>ui5-busy-indicator</code> has <code>display: inline-block;</code> by default and no width of its own,
- * whenever you need to wrap a block-level element, you should set <code>display: block</code> to the busy indicator as well.
  *
- * <h4>When to use:</h4>
- * <ul>
- * <li>The user needs to be able to cancel the operation.</li>
- * <li>Only part of the application or a particular component is affected.</li>
- * </ul>
+ * In order to show busy state over an HTML element, simply nest the HTML element in a `ui5-busy-indicator` instance.
  *
- * <h4>When not to use:</h4>
- * <ul>
- * <li>The operation takes less than one second.</li>
- * <li>You need to block the screen and prevent the user from starting another activity.</li>
- * <li>Do not show multiple busy indicators at once.</li>
- * </ul>
+ * **Note:** Since `ui5-busy-indicator` has `display: inline-block;` by default and no width of its own,
+ * whenever you need to wrap a block-level element, you should set `display: block` to the busy indicator as well.
  *
- * <h3>ES6 Module Import</h3>
+ * #### When to use:
  *
- * <code>import "@ui5/webcomponents/dist/BusyIndicator";</code>
+ * - The user needs to be able to cancel the operation.
+ * - Only part of the application or a particular component is affected.
  *
+ * #### When not to use:
+ *
+ * - The operation takes less than one second.
+ * - You need to block the screen and prevent the user from starting another activity.
+ * - Do not show multiple busy indicators at once.
+ *
+ * ### ES6 Module Import
+ *
+ * `import "@ui5/webcomponents/dist/BusyIndicator.js";`
  * @constructor
- * @author SAP SE
- * @alias sap.ui.webc.main.BusyIndicator
- * @extends sap.ui.webc.base.UI5Element
- * @tagname ui5-busy-indicator
+ * @extends UI5Element
  * @public
+ * @slot {Array<Node>} default - Determines the content over which the component will appear.
  * @since 0.12.0
  */
 let BusyIndicator = BusyIndicator_1 = class BusyIndicator extends UI5Element {
@@ -75,6 +72,9 @@ let BusyIndicator = BusyIndicator_1 = class BusyIndicator extends UI5Element {
         this.addEventListener("keyup", this._preventEventHandler, {
             capture: true,
         });
+        if (isDesktop()) {
+            this.setAttribute("desktop", "");
+        }
     }
     onExitDOM() {
         if (this._busyTimeoutId) {
@@ -100,6 +100,12 @@ let BusyIndicator = BusyIndicator_1 = class BusyIndicator extends UI5Element {
             },
         };
     }
+    get textPosition() {
+        return {
+            top: this.text && this.textPlacement === BusyIndicatorTextPlacement.Top,
+            bottom: this.text && this.textPlacement === BusyIndicatorTextPlacement.Bottom,
+        };
+    }
     onBeforeRendering() {
         if (this.active) {
             if (!this._isBusy && !this._busyTimeoutId) {
@@ -149,7 +155,7 @@ __decorate([
     property()
 ], BusyIndicator.prototype, "text", void 0);
 __decorate([
-    property({ type: BusyIndicatorSize, defaultValue: BusyIndicatorSize.Medium })
+    property({ type: BusyIndicatorSize, defaultValue: BusyIndicatorSize.M })
 ], BusyIndicator.prototype, "size", void 0);
 __decorate([
     property({ type: Boolean })
@@ -157,6 +163,9 @@ __decorate([
 __decorate([
     property({ validator: Integer, defaultValue: 1000 })
 ], BusyIndicator.prototype, "delay", void 0);
+__decorate([
+    property({ type: BusyIndicatorTextPlacement, defaultValue: BusyIndicatorTextPlacement.Bottom })
+], BusyIndicator.prototype, "textPlacement", void 0);
 __decorate([
     property({ type: Boolean })
 ], BusyIndicator.prototype, "_isBusy", void 0);

package/dist/BusyIndicator.js.map

@@ -1 +1 @@
-{"version":3,"file":"BusyIndicator.js","sourceRoot":"","sources":["../src/BusyIndicator.ts"],"names":[],"mappings":";;;;;;;AAAA,OAAO,UAAU,MAAM,4CAA4C,CAAC;AACpE,OAAO,aAAa,MAAM,0DAA0D,CAAC;AACrF,OAAO,QAAQ,MAAM,qDAAqD,CAAC;AAC3E,OAAO,SAAS,MAAM,sDAAsD,CAAC;AAC7E,OAAO,EAAE,aAAa,EAAE,MAAM,4CAA4C,CAAC;AAE3E,OAAO,EAAE,SAAS,EAAE,MAAM,sCAAsC,CAAC;AACjE,OAAO,OAAO,MAAM,+CAA+C,CAAC;AAEpE,OAAO,iBAAiB,MAAM,8BAA8B,CAAC;AAC7D,OAAO,KAAK,MAAM,YAAY,CAAC;AAE/B,WAAW;AACX,OAAO,qBAAqB,MAAM,oDAAoD,CAAC;AAEvF,OAAO,EAAE,oBAAoB,EAAE,MAAM,mCAAmC,CAAC;AAEzE,SAAS;AACT,OAAO,gBAAgB,MAAM,yCAAyC,CAAC;AAEvE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA0CG;AASH,IAAM,aAAa,qBAAnB,MAAM,aAAc,SAAQ,UAAU;IAoErC;QACC,KAAK,EAAE,CAAC;QACR,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QACtD,IAAI,CAAC,oBAAoB,GAAG,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAC3D,CAAC;IAED,UAAU;QACT,IAAI,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,eAAe,EAAE;YACtD,OAAO,EAAE,IAAI;SACb,CAAC,CAAC;QACH,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,oBAAoB,EAAE;YACzD,OAAO,EAAE,IAAI;SACb,CAAC,CAAC;IACJ,CAAC;IAED,SAAS;QACR,IAAI,IAAI,CAAC,cAAc,EAAE;YACxB,YAAY,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;YAClC,OAAO,IAAI,CAAC,cAAc,CAAC;SAC3B;QAED,IAAI,CAAC,mBAAmB,CAAC,SAAS,EAAE,IAAI,CAAC,eAAe,EAAE,IAAI,CAAC,CAAC;QAChE,IAAI,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,oBAAoB,EAAE,IAAI,CAAC,CAAC;IACpE,CAAC;IAED,MAAM,CAAC,KAAK,CAAC,QAAQ;QACpB,eAAa,CAAC,UAAU,GAAG,MAAM,aAAa,CAAC,oBAAoB,CAAC,CAAC;IACtE,CAAC;IAED,IAAI,SAAS;QACZ,OAAO,eAAa,CAAC,UAAU,CAAC,OAAO,CAAC,oBAAoB,CAAC,CAAC;IAC/D,CAAC;IAED,IAAI,OAAO;QACV,OAAO,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC;IACpD,CAAC;IAED,IAAI,OAAO;QACV,OAAO;YACN,IAAI,EAAE;gBACL,yBAAyB,EAAE,IAAI;aAC/B;SACD,CAAC;IACH,CAAC;IAED,iBAAiB;QAChB,IAAI,IAAI,CAAC,MAAM,EAAE;YAChB,IAAI,CAAC,IAAI,CAAC,OAAO,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE;gBAC1C,IAAI,CAAC,cAAc,GAAG,UAAU,CAAC,GAAG,EAAE;oBACrC,OAAO,IAAI,CAAC,cAAc,CAAC;oBAC3B,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;gBACrB,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC;aAC5B;SACD;aAAM;YACN,IAAI,IAAI,CAAC,cAAc,EAAE;gBACxB,YAAY,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;gBAClC,OAAO,IAAI,CAAC,cAAc,CAAC;aAC3B;YACD,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;SACrB;IACF,CAAC;IAED,cAAc,CAAC,CAAgB;QAC9B,IAAI,CAAC,IAAI,CAAC,OAAO,EAAE;YAClB,OAAO;SACP;QAED,CAAC,CAAC,wBAAwB,EAAE,CAAC;QAE7B,oGAAoG;QACpG,IAAI,SAAS,CAAC,CAAC,CAAC,EAAE;YACjB,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC;YACzB,IAAI,CAAC,UAAW,CAAC,aAAa,CAAc,2BAA2B,CAAE,CAAC,KAAK,EAAE,CAAC;YAClF,IAAI,CAAC,YAAY,GAAG,KAAK,CAAC;SAC1B;IACF,CAAC;IAED,aAAa,CAAC,CAAgB;QAC7B,IAAI,IAAI,CAAC,OAAO,EAAE;YACjB,CAAC,CAAC,wBAAwB,EAAE,CAAC;SAC7B;IACF,CAAC;IAED;;OAEG;IACH,cAAc,CAAC,CAAa;QAC3B,IAAI,IAAI,CAAC,YAAY,EAAE;YACtB,OAAO;SACP;QAED,CAAC,CAAC,cAAc,EAAE,CAAC;QACnB,IAAI,CAAC,UAAW,CAAC,aAAa,CAAc,+BAA+B,CAAE,CAAC,KAAK,EAAE,CAAC;IACvF,CAAC;CACD,CAAA;AAxJA;IADC,QAAQ,EAAE;2CACG;AAWd;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,iBAAiB,EAAE,YAAY,EAAE,iBAAiB,CAAC,MAAM,EAAE,CAAC;2CAChD;AAW9B;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;6CACX;AAWjB;IADC,QAAQ,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,YAAY,EAAE,IAAI,EAAE,CAAC;4CACtC;AAOf;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;8CACV;AAlDb,aAAa;IARlB,aAAa,CAAC;QACd,GAAG,EAAE,oBAAoB;QACzB,aAAa,EAAE,IAAI;QACnB,MAAM,EAAE,gBAAgB;QACxB,QAAQ,EAAE,SAAS;QACnB,QAAQ,EAAE,qBAAqB;QAC/B,YAAY,EAAE,CAAC,KAAK,CAAC;KACrB,CAAC;GACI,aAAa,CAkKlB;AAED,aAAa,CAAC,MAAM,EAAE,CAAC;AAEvB,eAAe,aAAa,CAAC","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport litRender from \"@ui5/webcomponents-base/dist/renderer/LitRenderer.js\";\nimport { getI18nBundle } from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport { isTabNext } from \"@ui5/webcomponents-base/dist/Keys.js\";\nimport Integer from \"@ui5/webcomponents-base/dist/types/Integer.js\";\nimport type { Timeout } from \"@ui5/webcomponents-base/dist/types.js\";\nimport BusyIndicatorSize from \"./types/BusyIndicatorSize.js\";\nimport Label from \"./Label.js\";\n\n// Template\nimport BusyIndicatorTemplate from \"./generated/templates/BusyIndicatorTemplate.lit.js\";\n\nimport { BUSY_INDICATOR_TITLE } from \"./generated/i18n/i18n-defaults.js\";\n\n// Styles\nimport busyIndicatorCss from \"./generated/themes/BusyIndicator.css.js\";\n\n/**\n * @class\n *\n * <h3 class=\"comment-api-title\">Overview</h3>\n *\n * The <code>ui5-busy-indicator</code> signals that some operation is going on and that the\n * user must wait. It does not block the current UI screen so other operations could be triggered in parallel.\n * It displays 3 dots and each dot expands and shrinks at a different rate, resulting in a cascading flow of animation.\n *\n * <h3>Usage</h3>\n * For the <code>ui5-busy-indicator</code> you can define the size, the text and whether it is shown or hidden.\n * In order to hide it, use the \"active\" property.\n * <br><br>\n * In order to show busy state over an HTML element, simply nest the HTML element in a <code>ui5-busy-indicator</code> instance.\n * <br>\n * <b>Note:</b> Since <code>ui5-busy-indicator</code> has <code>display: inline-block;</code> by default and no width of its own,\n * whenever you need to wrap a block-level element, you should set <code>display: block</code> to the busy indicator as well.\n *\n * <h4>When to use:</h4>\n * <ul>\n * <li>The user needs to be able to cancel the operation.</li>\n * <li>Only part of the application or a particular component is affected.</li>\n * </ul>\n *\n * <h4>When not to use:</h4>\n * <ul>\n * <li>The operation takes less than one second.</li>\n * <li>You need to block the screen and prevent the user from starting another activity.</li>\n * <li>Do not show multiple busy indicators at once.</li>\n * </ul>\n *\n * <h3>ES6 Module Import</h3>\n *\n * <code>import \"@ui5/webcomponents/dist/BusyIndicator\";</code>\n *\n * @constructor\n * @author SAP SE\n * @alias sap.ui.webc.main.BusyIndicator\n * @extends sap.ui.webc.base.UI5Element\n * @tagname ui5-busy-indicator\n * @public\n * @since 0.12.0\n */\n@customElement({\n\ttag: \"ui5-busy-indicator\",\n\tlanguageAware: true,\n\tstyles: busyIndicatorCss,\n\trenderer: litRender,\n\ttemplate: BusyIndicatorTemplate,\n\tdependencies: [Label],\n})\nclass BusyIndicator extends UI5Element {\n\t/**\n\t * Defines text to be displayed below the component. It can be used to inform the user of the current operation.\n\t * @type {string}\n\t * @name sap.ui.webc.main.BusyIndicator.prototype.text\n\t * @public\n\t * @defaultvalue \"\"\n\t * @since 1.0.0-rc.7\n\t */\n\t@property()\n\ttext!: string;\n\n\t/**\n\t * Defines the size of the component.\n\t *\n\t * @type {sap.ui.webc.main.types.BusyIndicatorSize}\n\t * @name sap.ui.webc.main.BusyIndicator.prototype.size\n\t * @defaultvalue \"Medium\"\n\t * @public\n\t */\n\t@property({ type: BusyIndicatorSize, defaultValue: BusyIndicatorSize.Medium })\n\tsize!: `${BusyIndicatorSize}`;\n\n\t/**\n\t * Defines if the busy indicator is visible on the screen. By default it is not.\n\t *\n\t * @type {boolean}\n\t * @name sap.ui.webc.main.BusyIndicator.prototype.active\n\t * @defaultvalue false\n\t * @public\n\t */\n\t@property({ type: Boolean })\n\tactive!: boolean;\n\n\t/**\n\t * Defines the delay in milliseconds, after which the busy indicator will be visible on the screen.\n\t *\n\t * @type {sap.ui.webc.base.types.Integer}\n\t * @name sap.ui.webc.main.BusyIndicator.prototype.delay\n\t * @defaultValue 1000\n\t * @public\n\t */\n\t@property({ validator: Integer, defaultValue: 1000 })\n\tdelay!: number;\n\n\t/**\n\t * Defines if the component is currently in busy state.\n\t * @private\n\t */\n\t@property({ type: Boolean })\n\t_isBusy!: boolean;\n\n\t/**\n\t * Determines the content over which the component will appear.\n\t *\n\t * @type {Node[]}\n\t * @name sap.ui.webc.main.BusyIndicator.prototype.default\n\t * @slot\n\t * @public\n\t */\n\n\t_keydownHandler: (e: KeyboardEvent) => void;\n\t_preventEventHandler: (e: KeyboardEvent) => void;\n\t_busyTimeoutId?: Timeout;\n\tfocusForward?: boolean;\n\n\tstatic i18nBundle: I18nBundle;\n\n\tconstructor() {\n\t\tsuper();\n\t\tthis._keydownHandler = this._handleKeydown.bind(this);\n\t\tthis._preventEventHandler = this._preventEvent.bind(this);\n\t}\n\n\tonEnterDOM() {\n\t\tthis.addEventListener(\"keydown\", this._keydownHandler, {\n\t\t\tcapture: true,\n\t\t});\n\t\tthis.addEventListener(\"keyup\", this._preventEventHandler, {\n\t\t\tcapture: true,\n\t\t});\n\t}\n\n\tonExitDOM() {\n\t\tif (this._busyTimeoutId) {\n\t\t\tclearTimeout(this._busyTimeoutId);\n\t\t\tdelete this._busyTimeoutId;\n\t\t}\n\n\t\tthis.removeEventListener(\"keydown\", this._keydownHandler, true);\n\t\tthis.removeEventListener(\"keyup\", this._preventEventHandler, true);\n\t}\n\n\tstatic async onDefine() {\n\t\tBusyIndicator.i18nBundle = await getI18nBundle(\"@ui5/webcomponents\");\n\t}\n\n\tget ariaTitle() {\n\t\treturn BusyIndicator.i18nBundle.getText(BUSY_INDICATOR_TITLE);\n\t}\n\n\tget labelId() {\n\t\treturn this.text ? `${this._id}-label` : undefined;\n\t}\n\n\tget classes() {\n\t\treturn {\n\t\t\troot: {\n\t\t\t\t\"ui5-busy-indicator-root\": true,\n\t\t\t},\n\t\t};\n\t}\n\n\tonBeforeRendering() {\n\t\tif (this.active) {\n\t\t\tif (!this._isBusy && !this._busyTimeoutId) {\n\t\t\t\tthis._busyTimeoutId = setTimeout(() => {\n\t\t\t\t\tdelete this._busyTimeoutId;\n\t\t\t\t\tthis._isBusy = true;\n\t\t\t\t}, Math.max(0, this.delay));\n\t\t\t}\n\t\t} else {\n\t\t\tif (this._busyTimeoutId) {\n\t\t\t\tclearTimeout(this._busyTimeoutId);\n\t\t\t\tdelete this._busyTimeoutId;\n\t\t\t}\n\t\t\tthis._isBusy = false;\n\t\t}\n\t}\n\n\t_handleKeydown(e: KeyboardEvent) {\n\t\tif (!this._isBusy) {\n\t\t\treturn;\n\t\t}\n\n\t\te.stopImmediatePropagation();\n\n\t\t// move the focus to the last element in this DOM and let TAB continue to the next focusable element\n\t\tif (isTabNext(e)) {\n\t\t\tthis.focusForward = true;\n\t\t\tthis.shadowRoot!.querySelector<HTMLElement>(\"[data-ui5-focus-redirect]\")!.focus();\n\t\t\tthis.focusForward = false;\n\t\t}\n\t}\n\n\t_preventEvent(e: KeyboardEvent) {\n\t\tif (this._isBusy) {\n\t\t\te.stopImmediatePropagation();\n\t\t}\n\t}\n\n\t/**\n\t * Moves the focus to busy area when coming with SHIFT + TAB\n\t */\n\t_redirectFocus(e: FocusEvent) {\n\t\tif (this.focusForward) {\n\t\t\treturn;\n\t\t}\n\n\t\te.preventDefault();\n\t\tthis.shadowRoot!.querySelector<HTMLElement>(\".ui5-busy-indicator-busy-area\")!.focus();\n\t}\n}\n\nBusyIndicator.define();\n\nexport default BusyIndicator;\n"]}
+{"version":3,"file":"BusyIndicator.js","sourceRoot":"","sources":["../src/BusyIndicator.ts"],"names":[],"mappings":"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","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport litRender from \"@ui5/webcomponents-base/dist/renderer/LitRenderer.js\";\nimport { getI18nBundle } from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport { isTabNext } from \"@ui5/webcomponents-base/dist/Keys.js\";\nimport Integer from \"@ui5/webcomponents-base/dist/types/Integer.js\";\nimport type { Timeout } from \"@ui5/webcomponents-base/dist/types.js\";\nimport {\n\tisDesktop,\n} from \"@ui5/webcomponents-base/dist/Device.js\";\nimport BusyIndicatorSize from \"./types/BusyIndicatorSize.js\";\nimport BusyIndicatorTextPlacement from \"./types/BusyIndicatorTextPlacement.js\";\nimport Label from \"./Label.js\";\n\n// Template\nimport BusyIndicatorTemplate from \"./generated/templates/BusyIndicatorTemplate.lit.js\";\n\nimport { BUSY_INDICATOR_TITLE } from \"./generated/i18n/i18n-defaults.js\";\n\n// Styles\nimport busyIndicatorCss from \"./generated/themes/BusyIndicator.css.js\";\n\n/**\n * @class\n *\n * ### Overview\n *\n * The `ui5-busy-indicator` signals that some operation is going on and that the\n * user must wait. It does not block the current UI screen so other operations could be triggered in parallel.\n * It displays 3 dots and each dot expands and shrinks at a different rate, resulting in a cascading flow of animation.\n *\n * ### Usage\n * For the `ui5-busy-indicator` you can define the size, the text and whether it is shown or hidden.\n * In order to hide it, use the \"active\" property.\n *\n * In order to show busy state over an HTML element, simply nest the HTML element in a `ui5-busy-indicator` instance.\n *\n * **Note:** Since `ui5-busy-indicator` has `display: inline-block;` by default and no width of its own,\n * whenever you need to wrap a block-level element, you should set `display: block` to the busy indicator as well.\n *\n * #### When to use:\n *\n * - The user needs to be able to cancel the operation.\n * - Only part of the application or a particular component is affected.\n *\n * #### When not to use:\n *\n * - The operation takes less than one second.\n * - You need to block the screen and prevent the user from starting another activity.\n * - Do not show multiple busy indicators at once.\n *\n * ### ES6 Module Import\n *\n * `import \"@ui5/webcomponents/dist/BusyIndicator.js\";`\n * @constructor\n * @extends UI5Element\n * @public\n * @slot {Array<Node>} default - Determines the content over which the component will appear.\n * @since 0.12.0\n */\n@customElement({\n\ttag: \"ui5-busy-indicator\",\n\tlanguageAware: true,\n\tstyles: busyIndicatorCss,\n\trenderer: litRender,\n\ttemplate: BusyIndicatorTemplate,\n\tdependencies: [Label],\n})\nclass BusyIndicator extends UI5Element {\n\t/**\n\t * Defines text to be displayed below the component. It can be used to inform the user of the current operation.\n\t * @public\n\t * @default \"\"\n\t * @since 1.0.0-rc.7\n\t */\n\t@property()\n\ttext!: string;\n\n\t/**\n\t * Defines the size of the component.\n\t * @default \"M\"\n\t * @public\n\t */\n\t@property({ type: BusyIndicatorSize, defaultValue: BusyIndicatorSize.M })\n\tsize!: `${BusyIndicatorSize}`;\n\n\t/**\n\t * Defines if the busy indicator is visible on the screen. By default it is not.\n\t * @default false\n\t * @public\n\t */\n\t@property({ type: Boolean })\n\tactive!: boolean;\n\n\t/**\n\t * Defines the delay in milliseconds, after which the busy indicator will be visible on the screen.\n\t * @default 1000\n\t * @public\n\t */\n\t@property({ validator: Integer, defaultValue: 1000 })\n\tdelay!: number;\n\n\t/**\n\t * Defines the placement of the text.\n\t *\n\t * @default \"Bottom\"\n\t * @public\n\t */\n\t@property({ type: BusyIndicatorTextPlacement, defaultValue: BusyIndicatorTextPlacement.Bottom })\n\ttextPlacement!: `${BusyIndicatorTextPlacement}`;\n\n\t/**\n\t * Defines if the component is currently in busy state.\n\t * @private\n\t */\n\t@property({ type: Boolean })\n\t_isBusy!: boolean;\n\n\t_keydownHandler: (e: KeyboardEvent) => void;\n\t_preventEventHandler: (e: KeyboardEvent) => void;\n\t_busyTimeoutId?: Timeout;\n\tfocusForward?: boolean;\n\n\tstatic i18nBundle: I18nBundle;\n\n\tconstructor() {\n\t\tsuper();\n\t\tthis._keydownHandler = this._handleKeydown.bind(this);\n\t\tthis._preventEventHandler = this._preventEvent.bind(this);\n\t}\n\n\tonEnterDOM() {\n\t\tthis.addEventListener(\"keydown\", this._keydownHandler, {\n\t\t\tcapture: true,\n\t\t});\n\t\tthis.addEventListener(\"keyup\", this._preventEventHandler, {\n\t\t\tcapture: true,\n\t\t});\n\t\tif (isDesktop()) {\n\t\t\tthis.setAttribute(\"desktop\", \"\");\n\t\t}\n\t}\n\n\tonExitDOM() {\n\t\tif (this._busyTimeoutId) {\n\t\t\tclearTimeout(this._busyTimeoutId);\n\t\t\tdelete this._busyTimeoutId;\n\t\t}\n\n\t\tthis.removeEventListener(\"keydown\", this._keydownHandler, true);\n\t\tthis.removeEventListener(\"keyup\", this._preventEventHandler, true);\n\t}\n\n\tstatic async onDefine() {\n\t\tBusyIndicator.i18nBundle = await getI18nBundle(\"@ui5/webcomponents\");\n\t}\n\n\tget ariaTitle() {\n\t\treturn BusyIndicator.i18nBundle.getText(BUSY_INDICATOR_TITLE);\n\t}\n\n\tget labelId() {\n\t\treturn this.text ? `${this._id}-label` : undefined;\n\t}\n\n\tget classes() {\n\t\treturn {\n\t\t\troot: {\n\t\t\t\t\"ui5-busy-indicator-root\": true,\n\t\t\t},\n\t\t};\n\t}\n\tget textPosition() {\n\t\treturn {\n\t\t\ttop: this.text && this.textPlacement === BusyIndicatorTextPlacement.Top,\n\t\t\tbottom: this.text && this.textPlacement === BusyIndicatorTextPlacement.Bottom,\n\t\t};\n\t}\n\n\tonBeforeRendering() {\n\t\tif (this.active) {\n\t\t\tif (!this._isBusy && !this._busyTimeoutId) {\n\t\t\t\tthis._busyTimeoutId = setTimeout(() => {\n\t\t\t\t\tdelete this._busyTimeoutId;\n\t\t\t\t\tthis._isBusy = true;\n\t\t\t\t}, Math.max(0, this.delay));\n\t\t\t}\n\t\t} else {\n\t\t\tif (this._busyTimeoutId) {\n\t\t\t\tclearTimeout(this._busyTimeoutId);\n\t\t\t\tdelete this._busyTimeoutId;\n\t\t\t}\n\t\t\tthis._isBusy = false;\n\t\t}\n\t}\n\n\t_handleKeydown(e: KeyboardEvent) {\n\t\tif (!this._isBusy) {\n\t\t\treturn;\n\t\t}\n\n\t\te.stopImmediatePropagation();\n\n\t\t// move the focus to the last element in this DOM and let TAB continue to the next focusable element\n\t\tif (isTabNext(e)) {\n\t\t\tthis.focusForward = true;\n\t\t\tthis.shadowRoot!.querySelector<HTMLElement>(\"[data-ui5-focus-redirect]\")!.focus();\n\t\t\tthis.focusForward = false;\n\t\t}\n\t}\n\n\t_preventEvent(e: KeyboardEvent) {\n\t\tif (this._isBusy) {\n\t\t\te.stopImmediatePropagation();\n\t\t}\n\t}\n\n\t/**\n\t * Moves the focus to busy area when coming with SHIFT + TAB\n\t */\n\t_redirectFocus(e: FocusEvent) {\n\t\tif (this.focusForward) {\n\t\t\treturn;\n\t\t}\n\n\t\te.preventDefault();\n\t\tthis.shadowRoot!.querySelector<HTMLElement>(\".ui5-busy-indicator-busy-area\")!.focus();\n\t}\n}\n\nBusyIndicator.define();\n\nexport default BusyIndicator;\n"]}