@ui5/webcomponents-fiori 1.9.2 → 1.10.0

package/dist/ProductSwitch.js

@@ -1,55 +1,26 @@
+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 ProductSwitch_1;
 import { getI18nBundle } from "@ui5/webcomponents-base/dist/i18nBundle.js";
-
 import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
 import ItemNavigation from "@ui5/webcomponents-base/dist/delegate/ItemNavigation.js";
+import property from "@ui5/webcomponents-base/dist/decorators/property.js";
+import slot from "@ui5/webcomponents-base/dist/decorators/slot.js";
+import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js";
 import ResizeHandler from "@ui5/webcomponents-base/dist/delegate/ResizeHandler.js";
 import Integer from "@ui5/webcomponents-base/dist/types/Integer.js";
 import litRender from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
-
-import {
-	isDown,
-	isUp,
-} from "@ui5/webcomponents-base/dist/Keys.js";
-
+import { isDown, isUp, } from "@ui5/webcomponents-base/dist/Keys.js";
 import ProductSwitchTemplate from "./generated/templates/ProductSwitchTemplate.lit.js";
-
-import {
-	PRODUCT_SWITCH_CONTAINER_LABEL,
-} from "./generated/i18n/i18n-defaults.js";
-
+import { PRODUCT_SWITCH_CONTAINER_LABEL,
+// @ts-ignore
+ } from "./generated/i18n/i18n-defaults.js";
 // Styles
 import ProductSwitchCss from "./generated/themes/ProductSwitch.css.js";
-
-/**
- * @public
- */
-const metadata = {
-	tag: "ui5-product-switch",
-	properties: /** @lends sap.ui.webcomponents.fiori.ProductSwitch.prototype */ {
-		/**
-		 * Indicates how many columns are displayed.
-		 * @private
-		 */
-		desktopColumns: {
-			type: Integer,
-		},
-	},
-	managedSlots: true,
-	slots: /** @lends sap.ui.webcomponents.fiori.ProductSwitch.prototype */ {
-		/**
-		 * Defines the items of the <code>ui5-product-switch</code>.
-		 *
-		 * @type {sap.ui.webcomponents.fiori.IProductSwitchItem[]}
-		 * @slot items
-		 * @public
-		 */
-		"default": {
-			propertyName: "items",
-			type: HTMLElement,
-		},
-	},
-};
-
 /**
  * @class
  * <h3 class="comment-api-title">Overview</h3>
@@ -77,122 +48,108 @@ const metadata = {
  * <code>import "@ui5/webcomponents-fiori/dist/ProductSwitchItem.js";</code> (for <code>ui5-product-switch-item</code>)
  * @constructor
  * @author SAP SE
- * @alias sap.ui.webcomponents.fiori.ProductSwitch
- * @extends sap.ui.webcomponents.base.UI5Element
+ * @alias sap.ui.webc.fiori.ProductSwitch
+ * @extends sap.ui.webc.base.UI5Element
  * @tagname ui5-product-switch
  * @appenddocs ProductSwitchItem
  * @public
  * @since 1.0.0-rc.5
  */
-class ProductSwitch extends UI5Element {
-	constructor() {
-		super();
-
-		this._currentIndex = 0;
-		this._rowSize = 4;
-
-		this._itemNavigation = new ItemNavigation(this, {
-			rowSize: this._rowSize,
-			getItemsCallback: () => this.items,
-		});
-	}
-
-	static get metadata() {
-		return metadata;
-	}
-
-	static get render() {
-		return litRender;
-	}
-
-	static get styles() {
-		return ProductSwitchCss;
-	}
-
-	static get template() {
-		return ProductSwitchTemplate;
-	}
-
-	static get ROW_MIN_WIDTH() {
-		return {
-			ONE_COLUMN: 600,
-			THREE_COLUMN: 900,
-		};
-	}
-
-	static async onDefine() {
-		ProductSwitch.i18nBundle = await getI18nBundle("@ui5/webcomponents-fiori");
-	}
-
-	get _ariaLabelText() {
-		return ProductSwitch.i18nBundle.getText(PRODUCT_SWITCH_CONTAINER_LABEL);
-	}
-
-	onEnterDOM() {
-		this._handleResizeBound = this._handleResize.bind(this);
-
-		ResizeHandler.register(document.body, this._handleResizeBound);
-	}
-
-	onExitDOM() {
-		ResizeHandler.deregister(document.body, this._handleResizeBound);
-	}
-
-	onBeforeRendering() {
-		this.desktopColumns = this.items.length > 6 ? 4 : 3;
-	}
-
-	_handleResize() {
-		const documentWidth = document.body.clientWidth;
-
-		if (documentWidth <= this.constructor.ROW_MIN_WIDTH.ONE_COLUMN) {
-			this._setRowSize(1);
-		} else if (documentWidth <= this.constructor.ROW_MIN_WIDTH.THREE_COLUMN || this.items.length <= 6) {
-			this._setRowSize(3);
-		} else {
-			this._setRowSize(4);
-		}
-	}
-
-	handleProductSwitchItemClick(event) {
-		this.items.forEach(item => { item.selected = false; });
-		event.target.selected = true;
-	}
-
-	_onfocusin(event) {
-		const target = event.target;
-
-		this._itemNavigation.setCurrentItem(target);
-		this._currentIndex = this.items.indexOf(target);
-	}
-
-	_setRowSize(size) {
-		this._rowSize = size;
-		this._itemNavigation.setRowSize(size);
-	}
-
-	_onkeydown(event) {
-		if (isDown(event)) {
-			this._handleDown(event);
-		} else if (isUp(event)) {
-			this._handleUp(event);
-		}
-	}
-
-	_handleDown(event) {
-		const itemsLength = this.items.length;
-		if (this._currentIndex + this._rowSize > itemsLength) { // border reached, do nothing
-			event.stopPropagation();
-		}
-	}
-
-	_handleUp(event) {
-		if (this._currentIndex - this._rowSize < 0) { // border reached, do nothing
-			event.stopPropagation();
-		}
-	}
-}
-
+let ProductSwitch = ProductSwitch_1 = class ProductSwitch extends UI5Element {
+    constructor() {
+        super();
+        this._currentIndex = 0;
+        this._rowSize = 4;
+        this._itemNavigation = new ItemNavigation(this, {
+            rowSize: this._rowSize,
+            getItemsCallback: () => this.items,
+        });
+        this._handleResizeBound = this._handleResize.bind(this);
+    }
+    static get render() {
+        return litRender;
+    }
+    static get styles() {
+        return ProductSwitchCss;
+    }
+    static get template() {
+        return ProductSwitchTemplate;
+    }
+    static get ROW_MIN_WIDTH() {
+        return {
+            ONE_COLUMN: 600,
+            THREE_COLUMN: 900,
+        };
+    }
+    static async onDefine() {
+        ProductSwitch_1.i18nBundle = await getI18nBundle("@ui5/webcomponents-fiori");
+    }
+    get _ariaLabelText() {
+        return ProductSwitch_1.i18nBundle.getText(PRODUCT_SWITCH_CONTAINER_LABEL);
+    }
+    onEnterDOM() {
+        ResizeHandler.register(document.body, this._handleResizeBound);
+    }
+    onExitDOM() {
+        ResizeHandler.deregister(document.body, this._handleResizeBound);
+    }
+    onBeforeRendering() {
+        this.desktopColumns = this.items.length > 6 ? 4 : 3;
+    }
+    _handleResize() {
+        const documentWidth = document.body.clientWidth;
+        if (documentWidth <= this.constructor.ROW_MIN_WIDTH.ONE_COLUMN) {
+            this._setRowSize(1);
+        }
+        else if (documentWidth <= this.constructor.ROW_MIN_WIDTH.THREE_COLUMN || this.items.length <= 6) {
+            this._setRowSize(3);
+        }
+        else {
+            this._setRowSize(4);
+        }
+    }
+    handleProductSwitchItemClick(e) {
+        this.items.forEach(item => { item.selected = false; });
+        e.target.selected = true;
+    }
+    _onfocusin(e) {
+        const target = e.target;
+        this._itemNavigation.setCurrentItem(target);
+        this._currentIndex = this.items.indexOf(target);
+    }
+    _setRowSize(size) {
+        this._rowSize = size;
+        this._itemNavigation.setRowSize(size);
+    }
+    _onkeydown(e) {
+        if (isDown(e)) {
+            this._handleDown(e);
+        }
+        else if (isUp(e)) {
+            this._handleUp(e);
+        }
+    }
+    _handleDown(e) {
+        const itemsLength = this.items.length;
+        if (this._currentIndex + this._rowSize > itemsLength) { // border reached, do nothing
+            e.stopPropagation();
+        }
+    }
+    _handleUp(e) {
+        if (this._currentIndex - this._rowSize < 0) { // border reached, do nothing
+            e.stopPropagation();
+        }
+    }
+};
+__decorate([
+    property({ validator: Integer })
+], ProductSwitch.prototype, "desktopColumns", void 0);
+__decorate([
+    slot({ type: HTMLElement, "default": true })
+], ProductSwitch.prototype, "items", void 0);
+ProductSwitch = ProductSwitch_1 = __decorate([
+    customElement("ui5-product-switch")
+], ProductSwitch);
 ProductSwitch.define();
-
 export default ProductSwitch;
+//# sourceMappingURL=ProductSwitch.js.map

package/dist/ProductSwitch.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ProductSwitch.js","sourceRoot":"","sources":["../src/ProductSwitch.ts"],"names":[],"mappings":";;;;;;;AAEA,OAAO,EAAE,aAAa,EAAE,MAAM,4CAA4C,CAAC;AAC3E,OAAO,UAAU,MAAM,4CAA4C,CAAC;AACpE,OAAO,cAAc,MAAM,yDAAyD,CAAC;AACrF,OAAO,QAAQ,MAAM,qDAAqD,CAAC;AAC3E,OAAO,IAAI,MAAM,iDAAiD,CAAC;AACnE,OAAO,aAAa,MAAM,0DAA0D,CAAC;AACrF,OAAO,aAAa,MAAM,wDAAwD,CAAC;AACnF,OAAO,OAAO,MAAM,+CAA+C,CAAC;AACpE,OAAO,SAAS,MAAM,sDAAsD,CAAC;AAE7E,OAAO,EACN,MAAM,EACN,IAAI,GACJ,MAAM,sCAAsC,CAAC;AAE9C,OAAO,qBAAqB,MAAM,oDAAoD,CAAC;AAEvF,OAAO,EACN,8BAA8B;AAC9B,aAAa;EACb,MAAM,mCAAmC,CAAC;AAE3C,SAAS;AACT,OAAO,gBAAgB,MAAM,yCAAyC,CAAC;AAGvE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiCG;AAEH,IAAM,aAAa,qBAAnB,MAAM,aAAc,SAAQ,UAAU;IACrC;QACC,KAAK,EAAE,CAAC;QAER,IAAI,CAAC,aAAa,GAAG,CAAC,CAAC;QACvB,IAAI,CAAC,QAAQ,GAAG,CAAC,CAAC;QAElB,IAAI,CAAC,eAAe,GAAG,IAAI,cAAc,CAAC,IAAI,EAAE;YAC/C,OAAO,EAAE,IAAI,CAAC,QAAQ;YACtB,gBAAgB,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,KAAK;SAClC,CAAC,CAAC;QAEH,IAAI,CAAC,kBAAkB,GAAG,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACzD,CAAC;IA2BD,MAAM,KAAK,MAAM;QAChB,OAAO,SAAS,CAAC;IAClB,CAAC;IAED,MAAM,KAAK,MAAM;QAChB,OAAO,gBAAgB,CAAC;IACzB,CAAC;IAED,MAAM,KAAK,QAAQ;QAClB,OAAO,qBAAqB,CAAC;IAC9B,CAAC;IAED,MAAM,KAAK,aAAa;QACvB,OAAO;YACN,UAAU,EAAE,GAAG;YACf,YAAY,EAAE,GAAG;SACjB,CAAC;IACH,CAAC;IAED,MAAM,CAAC,KAAK,CAAC,QAAQ;QACpB,eAAa,CAAC,UAAU,GAAG,MAAM,aAAa,CAAC,0BAA0B,CAAC,CAAC;IAC5E,CAAC;IAED,IAAI,cAAc;QACjB,OAAO,eAAa,CAAC,UAAU,CAAC,OAAO,CAAC,8BAA0C,CAAC,CAAC;IACrF,CAAC;IAED,UAAU;QACT,aAAa,CAAC,QAAQ,CAAC,QAAQ,CAAC,IAAI,EAAE,IAAI,CAAC,kBAAkB,CAAC,CAAC;IAChE,CAAC;IAED,SAAS;QACR,aAAa,CAAC,UAAU,CAAC,QAAQ,CAAC,IAAI,EAAE,IAAI,CAAC,kBAAkB,CAAC,CAAC;IAClE,CAAC;IAED,iBAAiB;QAChB,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;IACrD,CAAC;IAED,aAAa;QACZ,MAAM,aAAa,GAAG,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC;QAEhD,IAAI,aAAa,IAAK,IAAI,CAAC,WAAoC,CAAC,aAAa,CAAC,UAAU,EAAE;YACzF,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC;SACpB;aAAM,IAAI,aAAa,IAAK,IAAI,CAAC,WAAoC,CAAC,aAAa,CAAC,YAAY,IAAI,IAAI,CAAC,KAAK,CAAC,MAAM,IAAI,CAAC,EAAE;YAC5H,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC;SACpB;aAAM;YACN,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC;SACpB;IACF,CAAC;IAED,4BAA4B,CAAC,CAAa;QACzC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,GAAG,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;QACtD,CAAC,CAAC,MAA4B,CAAC,QAAQ,GAAG,IAAI,CAAC;IACjD,CAAC;IAED,UAAU,CAAC,CAAa;QACvB,MAAM,MAAM,GAAG,CAAC,CAAC,MAA2B,CAAC;QAE7C,IAAI,CAAC,eAAe,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC;QAC5C,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC;IACjD,CAAC;IAED,WAAW,CAAC,IAAY;QACvB,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;QACrB,IAAI,CAAC,eAAe,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;IACvC,CAAC;IAED,UAAU,CAAC,CAAgB;QAC1B,IAAI,MAAM,CAAC,CAAC,CAAC,EAAE;YACd,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC;SACpB;aAAM,IAAI,IAAI,CAAC,CAAC,CAAC,EAAE;YACnB,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC;SAClB;IACF,CAAC;IAED,WAAW,CAAC,CAAgB;QAC3B,MAAM,WAAW,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC;QACtC,IAAI,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,QAAQ,GAAG,WAAW,EAAE,EAAE,6BAA6B;YACpF,CAAC,CAAC,eAAe,EAAE,CAAC;SACpB;IACF,CAAC;IAED,SAAS,CAAC,CAAgB;QACzB,IAAI,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,QAAQ,GAAG,CAAC,EAAE,EAAE,6BAA6B;YAC1E,CAAC,CAAC,eAAe,EAAE,CAAC;SACpB;IACF,CAAC;CACD,CAAA;AA5GA;IADC,QAAQ,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC;qDACT;AAWxB;IADC,IAAI,CAAC,EAAE,IAAI,EAAE,WAAW,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;4CACb;AA/B3B,aAAa;IADlB,aAAa,CAAC,oBAAoB,CAAC;GAC9B,aAAa,CAgIlB;AAED,aAAa,CAAC,MAAM,EAAE,CAAC;AAEvB,eAAe,aAAa,CAAC"}

package/dist/ProductSwitchItem.d.ts

@@ -0,0 +1,127 @@
+import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
+import Icon from "@ui5/webcomponents/dist/Icon.js";
+import { ITabbable } from "@ui5/webcomponents-base/dist/delegate/ItemNavigation.js";
+/**
+ * @class
+ * <h3 class="comment-api-title">Overview</h3>
+ * The <code>ui5-product-switch-item</code> web component represents the items displayed in the
+ * <code>ui5-product-switch</code> web component.
+ * <br><br>
+ * <b>Note:</b> <code>ui5-product-switch-item</code> is not supported when used outside of <code>ui5-product-switch</code>.
+ * <br><br>
+ *
+ * <h3>Keyboard Handling</h3>
+ * The <code>ui5-product-switch</code> provides advanced keyboard handling.
+ * When focused, the user can use the following keyboard
+ * shortcuts in order to perform a navigation:
+ * <br>
+ * <ul>
+ * <li>[SPACE/ENTER/RETURN] - Trigger <code>ui5-click</code> event</li>
+ * </ul>
+ *
+ * <h3>ES6 Module Import</h3>
+ * <code>import "@ui5/webcomponents-fiori/dist/ProductSwitchItem.js";</code>
+ *
+ * @constructor
+ * @author SAP SE
+ * @alias sap.ui.webc.fiori.ProductSwitchItem
+ * @extends sap.ui.webc.base.UI5Element
+ * @tagname ui5-product-switch-item
+ * @public
+ * @implements sap.ui.webc.fiori.IProductSwitchItem
+ * @since 1.0.0-rc.5
+ */
+declare class ProductSwitchItem extends UI5Element implements ITabbable {
+    constructor();
+    /**
+     * Defines the title of the component.
+     * @type {string}
+     * @name sap.ui.webc.fiori.ProductSwitchItem.prototype.titleText
+     * @defaultvalue ""
+     * @since 1.0.0-rc.15
+     * @public
+     */
+    titleText: string;
+    /**
+     * Defines the subtitle of the component.
+     * @type {string}
+     * @name sap.ui.webc.fiori.ProductSwitchItem.prototype.subtitleText
+     * @defaultvalue ""
+     * @since 1.0.0-rc.15
+     * @public
+     */
+    subtitleText: string;
+    /**
+     * Defines the icon to be displayed as a graphical element within the component.
+     * <br><br>
+     * Example:
+     * <br>
+     * <pre>ui5-product-switch-item icon="palette"</pre>
+     *
+     * See all the available icons in the <ui5-link target="_blank" href="https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html" class="api-table-content-cell-link">Icon Explorer</ui5-link>.
+     *
+     * @type {string}
+     * @name sap.ui.webc.fiori.ProductSwitchItem.prototype.icon
+     * @defaultvalue ""
+     * @public
+     */
+    icon: string;
+    /**
+     * Defines a target where the <code>targetSrc</code> content must be open.
+     * <br><br>
+     * Available options are:
+     * <ul>
+     * <li><code>_self</code></li>
+     * <li><code>_top</code></li>
+     * <li><code>_blank</code></li>
+     * <li><code>_parent</code></li>
+     * <li><code>_search</code></li>
+     * </ul>
+     *
+     * @type {string}
+     * @name sap.ui.webc.fiori.ProductSwitchItem.prototype.target
+     * @public
+     */
+    target: string;
+    /**
+     * Defines the component target URI. Supports standard hyperlink behavior.
+     * @type {string}
+     * @name sap.ui.webc.fiori.ProductSwitchItem.prototype.targetSrc
+     * @defaultvalue ""
+     * @public
+     */
+    targetSrc: string;
+    /**
+     * Used to switch the active state (pressed or not) of the component.
+     * @private
+     */
+    private active;
+    /**
+     * Indicates whether the element is focused.
+     * @private
+     */
+    private focused;
+    /**
+     * Used to set the selected state of the component. Only one selected in a sequence.
+     * <b>Note:</b> Set by the <code>ProductSwitch</code>
+     */
+    selected: boolean;
+    /**
+     * Defines the component tabindex.
+     */
+    _tabIndex: string;
+    _deactivate: () => void;
+    static get render(): (templateResult: object, container: HTMLElement | DocumentFragment, styleStrOrHrefsArr: string | string[] | undefined, forStaticArea: boolean, options: import("lit-html").RenderOptions) => void;
+    static get styles(): import("@ui5/webcomponents-base/src/types.js").StyleData;
+    static get template(): import("@ui5/webcomponents-base/src/renderer/executeTemplate.js").TemplateFunction;
+    onEnterDOM(): void;
+    onExitDOM(): void;
+    _onmousedown(): void;
+    _onkeydown(e: KeyboardEvent): void;
+    _onkeyup(e: KeyboardEvent): void;
+    _onfocusout(): void;
+    _onfocusin(e: FocusEvent): void;
+    _fireItemClick(): void;
+    static get dependencies(): (typeof Icon)[];
+}
+export default ProductSwitchItem;