@ui5/webcomponents-base 0.0.0-63ca72189 → 0.0.0-6827fdc09

package/dist/decorators/event-strict.js

@@ -0,0 +1,26 @@
+/**
+ * Returns an event class decorator.
+ *
+ * @param { string } name the event name
+ * @param { EventData } data the event data
+ * @returns { ClassDecorator }
+ */
+const event = (name, data = {}) => {
+    return (target) => {
+        if (!Object.prototype.hasOwnProperty.call(target, "metadata")) {
+            target.metadata = {};
+        }
+        const metadata = target.metadata;
+        if (!metadata.events) {
+            metadata.events = {};
+        }
+        const eventsMetadata = metadata.events;
+        if (!eventsMetadata[name]) {
+            data.bubbles = !!data.bubbles;
+            data.cancelable = !!data.cancelable;
+            eventsMetadata[name] = data;
+        }
+    };
+};
+export default event;
+//# sourceMappingURL=event-strict.js.map

package/dist/decorators/event-strict.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"event-strict.js","sourceRoot":"","sources":["../../src/decorators/event-strict.ts"],"names":[],"mappings":"AAKA;;;;;;GAMG;AACH,MAAM,KAAK,GAAG,CAA6D,IAAO,EAAE,OAAoD,EAAE,EAA2B,EAAE;IACtK,OAAO,CAAC,MAAS,EAAE,EAAE;QACpB,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,cAAc,CAAC,IAAI,CAAC,MAAM,EAAE,UAAU,CAAC,EAAE,CAAC;YAC/D,MAAM,CAAC,QAAQ,GAAG,EAAE,CAAC;QACtB,CAAC;QAED,MAAM,QAAQ,GAAG,MAAM,CAAC,QAAQ,CAAC;QACjC,IAAI,CAAC,QAAQ,CAAC,MAAM,EAAE,CAAC;YACtB,QAAQ,CAAC,MAAM,GAAG,EAAE,CAAC;QACtB,CAAC;QAED,MAAM,cAAc,GAAG,QAAQ,CAAC,MAAM,CAAC;QACvC,IAAI,CAAC,cAAc,CAAC,IAAc,CAAC,EAAE,CAAC;YACrC,IAAI,CAAC,OAAO,GAAG,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC;YAC9B,IAAI,CAAC,UAAU,GAAG,CAAC,CAAC,IAAI,CAAC,UAAU,CAAC;YACpC,cAAc,CAAC,IAAc,CAAC,GAAG,IAAI,CAAC;QACvC,CAAC;IACF,CAAC,CAAC;AACH,CAAC,CAAC;AAEF,eAAe,KAAK,CAAC","sourcesContent":["import type UI5Element from \"../UI5Element.js\";\n\ntype EventDetailKeys<T extends typeof UI5Element> = keyof InstanceType<T>[\"eventDetails\"];\ntype ExtractEventKeys<T extends typeof UI5Element> = EventDetailKeys<T> extends never ? \"event name not found in `eventDetails` field\" : EventDetailKeys<T>;\n\n/**\n * Returns an event class decorator.\n *\n * @param { string } name the event name\n * @param { EventData } data the event data\n * @returns { ClassDecorator }\n */\nconst event = <T extends typeof UI5Element, N extends ExtractEventKeys<T>>(name: N, data: { bubbles?: boolean, cancelable?: boolean } = {}): (target: T) => T | void => {\n\treturn (target: T) => {\n\t\tif (!Object.prototype.hasOwnProperty.call(target, \"metadata\")) {\n\t\t\ttarget.metadata = {};\n\t\t}\n\n\t\tconst metadata = target.metadata;\n\t\tif (!metadata.events) {\n\t\t\tmetadata.events = {};\n\t\t}\n\n\t\tconst eventsMetadata = metadata.events;\n\t\tif (!eventsMetadata[name as string]) {\n\t\t\tdata.bubbles = !!data.bubbles;\n\t\t\tdata.cancelable = !!data.cancelable;\n\t\t\teventsMetadata[name as string] = data;\n\t\t}\n\t};\n};\n\nexport default event;\n"]}

package/dist/decorators/event.d.ts

@@ -0,0 +1,16 @@
+/**
+ * Returns an event class decorator.
+ *
+ * @deprecated Use `@ui5/webcomponents-base/dist/decorators/event-strict.js` instead.
+ * @param { string } name the event name
+ * @param { EventData } data the event data
+ * @returns { ClassDecorator }
+ */
+declare const event: <EventDetail>(name: string, data?: {
+    detail?: Record<keyof EventDetail, {
+        type: any;
+    }>;
+    bubbles?: boolean;
+    cancelable?: boolean;
+}) => ClassDecorator;
+export default event;

package/dist/decorators/event.js

@@ -0,0 +1,27 @@
+/**
+ * Returns an event class decorator.
+ *
+ * @deprecated Use `@ui5/webcomponents-base/dist/decorators/event-strict.js` instead.
+ * @param { string } name the event name
+ * @param { EventData } data the event data
+ * @returns { ClassDecorator }
+ */
+const event = (name, data = {}) => {
+    return (target) => {
+        if (!Object.prototype.hasOwnProperty.call(target, "metadata")) {
+            target.metadata = {};
+        }
+        const metadata = target.metadata;
+        if (!metadata.events) {
+            metadata.events = {};
+        }
+        const eventsMetadata = metadata.events;
+        if (!eventsMetadata[name]) {
+            data.bubbles = !!data.bubbles;
+            data.cancelable = !!data.cancelable;
+            eventsMetadata[name] = data;
+        }
+    };
+};
+export default event;
+//# sourceMappingURL=event.js.map

package/dist/decorators/event.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"event.js","sourceRoot":"","sources":["../../src/decorators/event.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AACH,MAAM,KAAK,GAAG,CAAc,IAAY,EAAE,OAAuG,EAAE,EAAkB,EAAE;IACtK,OAAO,CAAC,MAAW,EAAE,EAAE;QACtB,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,cAAc,CAAC,IAAI,CAAC,MAAM,EAAE,UAAU,CAAC,EAAE,CAAC;YAC/D,MAAM,CAAC,QAAQ,GAAG,EAAE,CAAC;QACtB,CAAC;QAED,MAAM,QAAQ,GAAG,MAAM,CAAC,QAAQ,CAAC;QACjC,IAAI,CAAC,QAAQ,CAAC,MAAM,EAAE,CAAC;YACtB,QAAQ,CAAC,MAAM,GAAG,EAAE,CAAC;QACtB,CAAC;QAED,MAAM,cAAc,GAAG,QAAQ,CAAC,MAAM,CAAC;QACvC,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,EAAE,CAAC;YAC3B,IAAI,CAAC,OAAO,GAAG,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC;YAC9B,IAAI,CAAC,UAAU,GAAG,CAAC,CAAC,IAAI,CAAC,UAAU,CAAC;YACpC,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC;QAC7B,CAAC;IACF,CAAC,CAAC;AACH,CAAC,CAAC;AAEF,eAAe,KAAK,CAAC","sourcesContent":["/**\n * Returns an event class decorator.\n *\n * @deprecated Use `@ui5/webcomponents-base/dist/decorators/event-strict.js` instead.\n * @param { string } name the event name\n * @param { EventData } data the event data\n * @returns { ClassDecorator }\n */\nconst event = <EventDetail>(name: string, data: { detail?: Record<keyof EventDetail, { type: any }>, bubbles?: boolean, cancelable?: boolean } = {}): ClassDecorator => {\n\treturn (target: any) => {\n\t\tif (!Object.prototype.hasOwnProperty.call(target, \"metadata\")) {\n\t\t\ttarget.metadata = {};\n\t\t}\n\n\t\tconst metadata = target.metadata;\n\t\tif (!metadata.events) {\n\t\t\tmetadata.events = {};\n\t\t}\n\n\t\tconst eventsMetadata = metadata.events;\n\t\tif (!eventsMetadata[name]) {\n\t\t\tdata.bubbles = !!data.bubbles;\n\t\t\tdata.cancelable = !!data.cancelable;\n\t\t\teventsMetadata[name] = data;\n\t\t}\n\t};\n};\n\nexport default event;\n"]}

package/dist/decorators/i18n.d.ts

@@ -0,0 +1,17 @@
+import type UI5Element from "../UI5Element.js";
+type i18nDecorator = (target: typeof UI5Element, propertyName: string) => void;
+/**
+ * A decorator that converts a static class member into an accessor for the i18n bundle with a specified name
+ *
+ * @param { string } bundleName name of the i18n bundle to load
+ * @returns { i18nDecorator }
+ *
+ * ```ts
+ * class MyComponnet extends UI5Element {
+ *   @i18n('@ui5/webcomponents')
+ *   i18nBundle: I18nBundle;
+ * }
+ * ```
+ */
+declare const i18n: (bundleName: string) => i18nDecorator;
+export default i18n;

package/dist/decorators/i18n.js

@@ -0,0 +1,32 @@
+/**
+ * A decorator that converts a static class member into an accessor for the i18n bundle with a specified name
+ *
+ * @param { string } bundleName name of the i18n bundle to load
+ * @returns { i18nDecorator }
+ *
+ * ```ts
+ * class MyComponnet extends UI5Element {
+ *   @i18n('@ui5/webcomponents')
+ *   i18nBundle: I18nBundle;
+ * }
+ * ```
+ */
+const i18n = (bundleName) => {
+    return (target, propertyName) => {
+        if (!target.metadata.i18n) {
+            target.metadata.i18n = {};
+        }
+        Object.defineProperty(target, propertyName, {
+            get() {
+                return target.i18nBundles[bundleName];
+            },
+            set() { },
+        });
+        target.metadata.i18n[propertyName] = {
+            bundleName,
+            target,
+        };
+    };
+};
+export default i18n;
+//# sourceMappingURL=i18n.js.map

package/dist/decorators/i18n.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"i18n.js","sourceRoot":"","sources":["../../src/decorators/i18n.ts"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AACH,MAAM,IAAI,GAAG,CAAC,UAAkB,EAAiB,EAAE;IAClD,OAAO,CAAC,MAAyB,EAAE,YAAoB,EAAE,EAAE;QAC1D,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,IAAI,EAAE,CAAC;YAC3B,MAAM,CAAC,QAAQ,CAAC,IAAI,GAAG,EAAE,CAAC;QAC3B,CAAC;QAED,MAAM,CAAC,cAAc,CAAC,MAAM,EAAE,YAAY,EAAE;YAC3C,GAAG;gBACF,OAAO,MAAM,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC;YACvC,CAAC;YACD,GAAG,KAAI,CAAC;SACR,CAAC,CAAC;QAEH,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC,YAAY,CAAC,GAAG;YACpC,UAAU;YACV,MAAM;SACN,CAAC;IACH,CAAC,CAAC;AACH,CAAC,CAAC;AAEF,eAAe,IAAI,CAAC","sourcesContent":["import type UI5Element from \"../UI5Element.js\";\n\ntype i18nDecorator = (target: typeof UI5Element, propertyName: string) => void;\n\n/**\n * A decorator that converts a static class member into an accessor for the i18n bundle with a specified name\n *\n * @param { string } bundleName name of the i18n bundle to load\n * @returns { i18nDecorator }\n *\n * ```ts\n * class MyComponnet extends UI5Element {\n *   @i18n('@ui5/webcomponents')\n *   i18nBundle: I18nBundle;\n * }\n * ```\n */\nconst i18n = (bundleName: string): i18nDecorator => {\n\treturn (target: typeof UI5Element, propertyName: string) => {\n\t\tif (!target.metadata.i18n) {\n\t\t\ttarget.metadata.i18n = {};\n\t\t}\n\n\t\tObject.defineProperty(target, propertyName, {\n\t\t\tget() {\n\t\t\t\treturn target.i18nBundles[bundleName];\n\t\t\t},\n\t\t\tset() {},\n\t\t});\n\n\t\ttarget.metadata.i18n[propertyName] = {\n\t\t\tbundleName,\n\t\t\ttarget,\n\t\t};\n\t};\n};\n\nexport default i18n;\n"]}

package/dist/decorators/property.d.ts

@@ -0,0 +1,9 @@
+import type { Property } from "../UI5ElementMetadata.js";
+/**
+ * Returns a property decorator.
+ *
+ * @param { Property } propData
+ * @returns { PropertyDecorator }
+ */
+declare const property: (propData?: Property) => PropertyDecorator;
+export default property;

package/dist/decorators/property.js

@@ -0,0 +1,24 @@
+/**
+ * Returns a property decorator.
+ *
+ * @param { Property } propData
+ * @returns { PropertyDecorator }
+ */
+const property = (propData) => {
+    return (target, propertyKey) => {
+        const ctor = target.constructor;
+        if (!Object.prototype.hasOwnProperty.call(ctor, "metadata")) {
+            ctor.metadata = {};
+        }
+        const metadata = ctor.metadata;
+        if (!metadata.properties) {
+            metadata.properties = {};
+        }
+        const propsMetadata = metadata.properties;
+        if (!propsMetadata[propertyKey]) {
+            propsMetadata[propertyKey] = propData ?? {};
+        }
+    };
+};
+export default property;
+//# sourceMappingURL=property.js.map

package/dist/decorators/property.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"property.js","sourceRoot":"","sources":["../../src/decorators/property.ts"],"names":[],"mappings":"AAGA;;;;;GAKG;AACH,MAAM,QAAQ,GAAG,CAAC,QAAmB,EAAqB,EAAE;IAC3D,OAAO,CAAC,MAAW,EAAE,WAA4B,EAAE,EAAE;QACpD,MAAM,IAAI,GAAG,MAAM,CAAC,WAAgC,CAAC;QAErD,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,EAAE,UAAU,CAAC,EAAE,CAAC;YAC7D,IAAI,CAAC,QAAQ,GAAG,EAAE,CAAC;QACpB,CAAC;QAED,MAAM,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC;QAC/B,IAAI,CAAC,QAAQ,CAAC,UAAU,EAAE,CAAC;YAC1B,QAAQ,CAAC,UAAU,GAAG,EAAE,CAAC;QAC1B,CAAC;QAED,MAAM,aAAa,GAAG,QAAQ,CAAC,UAAU,CAAC;QAC1C,IAAI,CAAC,aAAa,CAAC,WAAqB,CAAC,EAAE,CAAC;YAC3C,aAAa,CAAC,WAAqB,CAAC,GAAG,QAAQ,IAAI,EAAE,CAAC;QACvD,CAAC;IACF,CAAC,CAAC;AACH,CAAC,CAAC;AAEF,eAAe,QAAQ,CAAC","sourcesContent":["import type UI5Element from \"../UI5Element.js\";\nimport type { Property } from \"../UI5ElementMetadata.js\";\n\n/**\n * Returns a property decorator.\n *\n * @param { Property } propData\n * @returns { PropertyDecorator }\n */\nconst property = (propData?: Property): PropertyDecorator => {\n\treturn (target: any, propertyKey: string | symbol) => {\n\t\tconst ctor = target.constructor as typeof UI5Element;\n\n\t\tif (!Object.prototype.hasOwnProperty.call(ctor, \"metadata\")) {\n\t\t\tctor.metadata = {};\n\t\t}\n\n\t\tconst metadata = ctor.metadata;\n\t\tif (!metadata.properties) {\n\t\t\tmetadata.properties = {};\n\t\t}\n\n\t\tconst propsMetadata = metadata.properties;\n\t\tif (!propsMetadata[propertyKey as string]) {\n\t\t\tpropsMetadata[propertyKey as string] = propData ?? {};\n\t\t}\n\t};\n};\n\nexport default property;\n"]}

package/dist/decorators/query.d.ts

@@ -0,0 +1,25 @@
+import type UI5Element from "../UI5Element.js";
+type QueryDecorator = (target: UI5Element, propertyKey: string | symbol) => void;
+/**
+ * A decorator that converts a class member into a getter that
+ * executes a querySelector on the element's shadow DOM.
+ *
+ * @param { string } selector DOM String containing selector to match
+ * @returns { QueryDecorator }
+ *
+ * ```ts
+ * class MyComponnet extends UI5Element {
+ *   @query('.myComponentRoot')
+ *   root?: HTMLElement;
+ *
+ *   render() {
+ *     return html`
+ *       <div class=".root">
+ * 		  </div>
+ *     `;
+ *   }
+ * }
+ * ```
+ */
+declare const query: (selector: string) => QueryDecorator;
+export default query;

package/dist/decorators/query.js

@@ -0,0 +1,32 @@
+/**
+ * A decorator that converts a class member into a getter that
+ * executes a querySelector on the element's shadow DOM.
+ *
+ * @param { string } selector DOM String containing selector to match
+ * @returns { QueryDecorator }
+ *
+ * ```ts
+ * class MyComponnet extends UI5Element {
+ *   @query('.myComponentRoot')
+ *   root?: HTMLElement;
+ *
+ *   render() {
+ *     return html`
+ *       <div class=".root">
+ * 		  </div>
+ *     `;
+ *   }
+ * }
+ * ```
+ */
+const query = (selector) => {
+    return (target, propertyKey) => {
+        Object.defineProperty(target, propertyKey, {
+            get() {
+                return this.shadowRoot?.querySelector(selector);
+            },
+        });
+    };
+};
+export default query;
+//# sourceMappingURL=query.js.map

package/dist/decorators/query.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"query.js","sourceRoot":"","sources":["../../src/decorators/query.ts"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,MAAM,KAAK,GAAG,CAAC,QAAgB,EAAkB,EAAE;IAClD,OAAO,CAAC,MAAW,EAAE,WAA4B,EAAE,EAAE;QACpD,MAAM,CAAC,cAAc,CAAC,MAAM,EAAE,WAAW,EAAE;YAC1C,GAAG;gBACF,OAAO,IAAI,CAAC,UAAU,EAAE,aAAa,CAAC,QAAQ,CAAgB,CAAC;YAChE,CAAC;SACD,CAAC,CAAC;IACJ,CAAC,CAAC;AACH,CAAC,CAAC;AAEF,eAAe,KAAK,CAAC","sourcesContent":["import type UI5Element from \"../UI5Element.js\";\n\ntype QueryDecorator = (target: UI5Element, propertyKey: string | symbol) => void;\n\n/**\n * A decorator that converts a class member into a getter that\n * executes a querySelector on the element's shadow DOM.\n *\n * @param { string } selector DOM String containing selector to match\n * @returns { QueryDecorator }\n *\n * ```ts\n * class MyComponnet extends UI5Element {\n *   @query('.myComponentRoot')\n *   root?: HTMLElement;\n *\n *   render() {\n *     return html`\n *       <div class=\".root\">\n * \t\t  </div>\n *     `;\n *   }\n * }\n * ```\n */\nconst query = (selector: string): QueryDecorator => {\n\treturn (target: any, propertyKey: string | symbol) => {\n\t\tObject.defineProperty(target, propertyKey, {\n\t\t\tget(this: UI5Element) {\n\t\t\t\treturn this.shadowRoot?.querySelector(selector) as HTMLElement;\n\t\t\t},\n\t\t});\n\t};\n};\n\nexport default query;\n"]}

package/dist/decorators/queryAll.d.ts

@@ -0,0 +1,27 @@
+import type UI5Element from "../UI5Element.js";
+type QueryDecorator = (target: UI5Element, propertyKey: string | symbol) => void;
+/**
+ * A decorator that converts a class member into a getter that
+ * executes a querySelectorAll on the element's shadow DOM.
+ *
+ * @param { string } selector DOM String containing selector to match
+ * @returns { QueryDecorator }
+ *
+ * ```ts
+ * class MyComponnet extends UI5Element {
+ *   @queryAll('.item')
+ *   itemsDOM?: HTMLElement;
+ *
+ *   render() {
+ *     return html`
+ * 		 <div>
+ *      	<li class=".item"></li>
+ *       	<li class=".item"></li>
+ * 		 </div>
+ *     `;
+ *   }
+ * }
+ * ```
+ */
+declare const queryAll: (selector: string) => QueryDecorator;
+export default queryAll;

package/dist/decorators/queryAll.js

@@ -0,0 +1,34 @@
+/**
+ * A decorator that converts a class member into a getter that
+ * executes a querySelectorAll on the element's shadow DOM.
+ *
+ * @param { string } selector DOM String containing selector to match
+ * @returns { QueryDecorator }
+ *
+ * ```ts
+ * class MyComponnet extends UI5Element {
+ *   @queryAll('.item')
+ *   itemsDOM?: HTMLElement;
+ *
+ *   render() {
+ *     return html`
+ * 		 <div>
+ *      	<li class=".item"></li>
+ *       	<li class=".item"></li>
+ * 		 </div>
+ *     `;
+ *   }
+ * }
+ * ```
+ */
+const queryAll = (selector) => {
+    return (target, propertyKey) => {
+        Object.defineProperty(target, propertyKey, {
+            get() {
+                return this.shadowRoot?.querySelectorAll(selector);
+            },
+        });
+    };
+};
+export default queryAll;
+//# sourceMappingURL=queryAll.js.map

package/dist/decorators/queryAll.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"queryAll.js","sourceRoot":"","sources":["../../src/decorators/queryAll.ts"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,MAAM,QAAQ,GAAG,CAAC,QAAgB,EAAkB,EAAE;IACrD,OAAO,CAAC,MAAW,EAAE,WAA4B,EAAE,EAAE;QACpD,MAAM,CAAC,cAAc,CAAC,MAAM,EAAE,WAAW,EAAE;YAC1C,GAAG;gBACF,OAAO,IAAI,CAAC,UAAU,EAAE,gBAAgB,CAAC,QAAQ,CAAC,CAAC;YACpD,CAAC;SACD,CAAC,CAAC;IACJ,CAAC,CAAC;AACH,CAAC,CAAC;AAEF,eAAe,QAAQ,CAAC","sourcesContent":["import type UI5Element from \"../UI5Element.js\";\n\ntype QueryDecorator = (target: UI5Element, propertyKey: string | symbol) => void;\n\n/**\n * A decorator that converts a class member into a getter that\n * executes a querySelectorAll on the element's shadow DOM.\n *\n * @param { string } selector DOM String containing selector to match\n * @returns { QueryDecorator }\n *\n * ```ts\n * class MyComponnet extends UI5Element {\n *   @queryAll('.item')\n *   itemsDOM?: HTMLElement;\n *\n *   render() {\n *     return html`\n * \t\t <div>\n *      \t<li class=\".item\"></li>\n *       \t<li class=\".item\"></li>\n * \t\t </div>\n *     `;\n *   }\n * }\n * ```\n */\nconst queryAll = (selector: string): QueryDecorator => {\n\treturn (target: any, propertyKey: string | symbol) => {\n\t\tObject.defineProperty(target, propertyKey, {\n\t\t\tget(this: UI5Element) {\n\t\t\t\treturn this.shadowRoot?.querySelectorAll(selector);\n\t\t\t},\n\t\t});\n\t};\n};\n\nexport default queryAll;\n"]}

package/dist/decorators/slot.d.ts

@@ -0,0 +1,9 @@
+import type { Slot } from "../UI5ElementMetadata.js";
+/**
+ * Returns a slot decorator.
+ *
+ * @param { Slot } slotData
+ * @returns { PropertyDecorator }
+ */
+declare const slot: (slotData?: Slot) => PropertyDecorator;
+export default slot;

package/dist/decorators/slot.js

@@ -0,0 +1,37 @@
+/**
+ * Returns a slot decorator.
+ *
+ * @param { Slot } slotData
+ * @returns { PropertyDecorator }
+ */
+const slot = (slotData) => {
+    return (target, slotKey) => {
+        const ctor = target.constructor;
+        if (!Object.prototype.hasOwnProperty.call(ctor, "metadata")) {
+            ctor.metadata = {};
+        }
+        const metadata = ctor.metadata;
+        if (!metadata.slots) {
+            metadata.slots = {};
+        }
+        const slotMetadata = metadata.slots;
+        if (slotData && slotData.default && slotMetadata.default) {
+            throw new Error("Only one slot can be the default slot.");
+        }
+        const key = slotData && slotData.default ? "default" : slotKey;
+        slotData = slotData || { type: HTMLElement };
+        if (!slotData.type) {
+            slotData.type = HTMLElement;
+        }
+        if (!slotMetadata[key]) {
+            slotMetadata[key] = slotData;
+        }
+        if (slotData.default) {
+            delete slotMetadata.default.default;
+            slotMetadata.default.propertyName = slotKey;
+        }
+        ctor.metadata.managedSlots = true;
+    };
+};
+export default slot;
+//# sourceMappingURL=slot.js.map

package/dist/decorators/slot.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"slot.js","sourceRoot":"","sources":["../../src/decorators/slot.ts"],"names":[],"mappings":"AAGA;;;;;GAKG;AACH,MAAM,IAAI,GAAG,CAAC,QAAe,EAAqB,EAAE;IACnD,OAAO,CAAC,MAAW,EAAE,OAAwB,EAAE,EAAE;QAChD,MAAM,IAAI,GAAG,MAAM,CAAC,WAAgC,CAAC;QAErD,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,EAAE,UAAU,CAAC,EAAE,CAAC;YAC7D,IAAI,CAAC,QAAQ,GAAG,EAAE,CAAC;QACpB,CAAC;QAED,MAAM,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC;QAC/B,IAAI,CAAC,QAAQ,CAAC,KAAK,EAAE,CAAC;YACrB,QAAQ,CAAC,KAAK,GAAG,EAAE,CAAC;QACrB,CAAC;QAED,MAAM,YAAY,GAAG,QAAQ,CAAC,KAAK,CAAC;QAEpC,IAAI,QAAQ,IAAI,QAAQ,CAAC,OAAO,IAAI,YAAY,CAAC,OAAO,EAAE,CAAC;YAC1D,MAAM,IAAI,KAAK,CAAC,wCAAwC,CAAC,CAAC;QAC3D,CAAC;QAED,MAAM,GAAG,GAAG,QAAQ,IAAI,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,OAAiB,CAAC;QACzE,QAAQ,GAAG,QAAQ,IAAI,EAAE,IAAI,EAAE,WAAW,EAAE,CAAC;QAE7C,IAAI,CAAC,QAAQ,CAAC,IAAI,EAAE,CAAC;YACpB,QAAQ,CAAC,IAAI,GAAG,WAAW,CAAC;QAC7B,CAAC;QAED,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC,EAAE,CAAC;YACxB,YAAY,CAAC,GAAG,CAAC,GAAG,QAAQ,CAAC;QAC9B,CAAC;QAED,IAAI,QAAQ,CAAC,OAAO,EAAE,CAAC;YACtB,OAAO,YAAY,CAAC,OAAO,CAAC,OAAO,CAAC;YACpC,YAAY,CAAC,OAAO,CAAC,YAAY,GAAG,OAAiB,CAAC;QACvD,CAAC;QAED,IAAI,CAAC,QAAQ,CAAC,YAAY,GAAG,IAAI,CAAC;IACnC,CAAC,CAAC;AACH,CAAC,CAAC;AAEF,eAAe,IAAI,CAAC","sourcesContent":["import type UI5Element from \"../UI5Element.js\";\nimport type { Slot } from \"../UI5ElementMetadata.js\";\n\n/**\n * Returns a slot decorator.\n *\n * @param { Slot } slotData\n * @returns { PropertyDecorator }\n */\nconst slot = (slotData?: Slot): PropertyDecorator => {\n\treturn (target: any, slotKey: string | symbol) => {\n\t\tconst ctor = target.constructor as typeof UI5Element;\n\n\t\tif (!Object.prototype.hasOwnProperty.call(ctor, \"metadata\")) {\n\t\t\tctor.metadata = {};\n\t\t}\n\n\t\tconst metadata = ctor.metadata;\n\t\tif (!metadata.slots) {\n\t\t\tmetadata.slots = {};\n\t\t}\n\n\t\tconst slotMetadata = metadata.slots;\n\n\t\tif (slotData && slotData.default && slotMetadata.default) {\n\t\t\tthrow new Error(\"Only one slot can be the default slot.\");\n\t\t}\n\n\t\tconst key = slotData && slotData.default ? \"default\" : slotKey as string;\n\t\tslotData = slotData || { type: HTMLElement };\n\n\t\tif (!slotData.type) {\n\t\t\tslotData.type = HTMLElement;\n\t\t}\n\n\t\tif (!slotMetadata[key]) {\n\t\t\tslotMetadata[key] = slotData;\n\t\t}\n\n\t\tif (slotData.default) {\n\t\t\tdelete slotMetadata.default.default;\n\t\t\tslotMetadata.default.propertyName = slotKey as string;\n\t\t}\n\n\t\tctor.metadata.managedSlots = true;\n\t};\n};\n\nexport default slot;\n"]}

package/dist/decorators.d.ts

@@ -0,0 +1,8 @@
+import customElement from "./decorators/customElement.js";
+import event from "./decorators/event.js";
+import eventStrict from "./decorators/event-strict.js";
+import property from "./decorators/property.js";
+import slot from "./decorators/slot.js";
+import bound from "./decorators/bound.js";
+import i18n from "./decorators/i18n.js";
+export { customElement, event, eventStrict, property, slot, bound, i18n, };

package/dist/decorators.js

@@ -0,0 +1,9 @@
+import customElement from "./decorators/customElement.js";
+import event from "./decorators/event.js";
+import eventStrict from "./decorators/event-strict.js";
+import property from "./decorators/property.js";
+import slot from "./decorators/slot.js";
+import bound from "./decorators/bound.js";
+import i18n from "./decorators/i18n.js";
+export { customElement, event, eventStrict, property, slot, bound, i18n, };
+//# sourceMappingURL=decorators.js.map

package/dist/decorators.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"decorators.js","sourceRoot":"","sources":["../src/decorators.ts"],"names":[],"mappings":"AAAA,OAAO,aAAa,MAAM,+BAA+B,CAAC;AAC1D,OAAO,KAAK,MAAM,uBAAuB,CAAC;AAC1C,OAAO,WAAW,MAAM,8BAA8B,CAAC;AACvD,OAAO,QAAQ,MAAM,0BAA0B,CAAC;AAChD,OAAO,IAAI,MAAM,sBAAsB,CAAC;AACxC,OAAO,KAAK,MAAM,uBAAuB,CAAC;AAC1C,OAAO,IAAI,MAAM,sBAAsB,CAAC;AAExC,OAAO,EACN,aAAa,EACb,KAAK,EACL,WAAW,EACX,QAAQ,EACR,IAAI,EACJ,KAAK,EACL,IAAI,GACJ,CAAC","sourcesContent":["import customElement from \"./decorators/customElement.js\";\nimport event from \"./decorators/event.js\";\nimport eventStrict from \"./decorators/event-strict.js\";\nimport property from \"./decorators/property.js\";\nimport slot from \"./decorators/slot.js\";\nimport bound from \"./decorators/bound.js\";\nimport i18n from \"./decorators/i18n.js\";\n\nexport {\n\tcustomElement,\n\tevent,\n\teventStrict,\n\tproperty,\n\tslot,\n\tbound,\n\ti18n,\n};\n"]}

package/dist/delegate/ItemNavigation.d.ts

@@ -0,0 +1,114 @@
+import NavigationMode from "../types/NavigationMode.js";
+import ItemNavigationBehavior from "../types/ItemNavigationBehavior.js";
+import type UI5Element from "../UI5Element.js";
+interface ITabbable {
+    id: string;
+    forcedTabIndex?: string;
+}
+type ItemNavigationOptions = {
+    currentIndex?: number;
+    navigationMode?: NavigationMode;
+    rowSize?: number;
+    skipItemsSize?: number;
+    behavior?: ItemNavigationBehavior;
+    getItemsCallback: () => Array<ITabbable>;
+    affectedPropertiesNames?: Array<string>;
+};
+/**
+ * The ItemNavigation class manages the calculations to determine the correct "tabindex" for a group of related items inside a root component.
+ * Important: ItemNavigation only does the calculations and does not change "tabindex" directly, this is a responsibility of the developer.
+ *
+ * The keys that trigger ItemNavigation are:
+ *  - Up/down
+ *  - Left/right
+ *  - Home/End
+ *
+ * Usage:
+ * 1) Use the "getItemsCallback" constructor property to pass a callback to ItemNavigation, which, whenever called, will return the list of items to navigate among.
+ *
+ * Each item passed to ItemNavigation via "getItemsCallback" must be:
+ *  - A) either a UI5Element with a "forcedTabIndex" property
+ *  - B) or an Object with "id" and "forcedTabIndex" properties which represents a part of the root component's shadow DOM.
+ *    The "id" must be a valid ID within the shadow root of the component ItemNavigation operates on.
+ *    This object must not be a DOM object because, as said, ItemNavigation will not set "tabindex" on it. It must be a representation of a DOM object only
+ *    and the developer has the responsibility to update the "tabindex" in the component's DOM.
+ *  - C) a combination of the above
+ *
+ * Whenever the user navigates with the keyboard, ItemNavigation will modify the "forcedTabIndex" properties of the items.
+ * It is the items' responsibilities to re-render themselves and apply the correct value of "tabindex" (i.e. to map the "forcedTabIndex" ItemNavigation set to them to the "tabindex" property).
+ * If the items of the ItemNavigation are UI5Elements themselves, this can happen naturally since they will be invalidated by their "forcedTabIndex" property.
+ * If the items are Objects with "id" and "forcedTabIndex" however, it is the developer's responsibility to apply these and the easiest way is to have the root component invalidated by ItemNavigation.
+ * To do so, set the "affectedPropertiesNames" constructor property to point to one or more of the root component's properties that need refreshing when "forcedTabIndex" is changed deeply.
+ *
+ * 2) Call the "setCurrentItem" method of ItemNavigation whenever you want to change the current item.
+ * This is most commonly required if the user for example clicks on an item and thus selects it directly.
+ * Pass as the only argument to "setCurrentItem" the item that becomes current (must be one of the items, returned by "getItemsCallback").
+ *
+ * @class
+ * @public
+ */
+declare class ItemNavigation {
+    rootWebComponent: UI5Element;
+    _getItems: () => Array<ITabbable>;
+    _currentIndex: number;
+    _rowSize: number;
+    _behavior: ItemNavigationBehavior;
+    _navigationMode: NavigationMode;
+    _affectedPropertiesNames: Array<string>;
+    _skipItemsSize: number | null;
+    _initBound: () => void;
+    /**
+     *
+     * @param rootWebComponent the component to operate on (component that slots or contains within its shadow root the items the user navigates among)
+     * @param {ItemNavigationOptions} options Object with configuration options:
+     *  - currentIndex: the index of the item that will be initially selected (from which navigation will begin)
+     *  - navigationMode (Auto|Horizontal|Vertical): whether the items are displayed horizontally (Horizontal), vertically (Vertical) or as a matrix (Auto) meaning the user can navigate in both directions (up/down and left/right)
+     *  - rowSize: tells how many items per row there are when the items are not rendered as a flat list but rather as a matrix. Relevant for navigationMode=Auto
+     * 	- skipItemsSize: tells how many items upon PAGE_UP and PAGE_DOWN should be skipped to applying the focus on the next item
+     *  - behavior (Static|Cycling): tells what to do when trying to navigate beyond the first and last items
+     *    Static means that nothing happens if the user tries to navigate beyond the first/last item.
+     *    Cycling means that when the user navigates beyond the last item they go to the first and vice versa.
+     *  - getItemsCallback: function that, when called, returns an array with all items the user can navigate among
+     *  - affectedPropertiesNames: a list of metadata properties on the root component which, upon user navigation, will be reassigned by address thus causing the root component to invalidate
+     */
+    constructor(rootWebComponent: UI5Element, options: ItemNavigationOptions);
+    /**
+     * Call this method to set a new "current" (selected) item in the item navigation
+     * Note: the item passed to this function must be one of the items, returned by the getItemsCallback function
+     *
+     * @public
+     * @param current the new selected item
+     */
+    setCurrentItem(current: ITabbable): void;
+    /**
+     * Call this method to dynamically change the row size
+     *
+     * @public
+     * @param newRowSize
+     */
+    setRowSize(newRowSize: number): void;
+    _init(): void;
+    _onkeydown(event: KeyboardEvent): void;
+    _handleUp(): void;
+    _handleDown(): void;
+    _handleLeft(): void;
+    _handleRight(): void;
+    _handleHome(): void;
+    _handleEnd(): void;
+    _handlePageUp(): void;
+    _handlePageDown(): void;
+    /**
+     * Handles PAGE_UP in a flat list-like structure, both vertically and horizontally.
+     */
+    _handlePageUpFlat(): void;
+    /**
+     * Handles PAGE_DOWN in a flat list-like structure, both vertically and horizontally.
+     */
+    _handlePageDownFlat(): void;
+    _applyTabIndex(): void;
+    _focusCurrentItem(): void;
+    _canNavigate(): boolean | undefined;
+    _getCurrentItem(): HTMLElement | undefined;
+}
+export default ItemNavigation;
+export { ITabbable, };