@ui5/webcomponents 2.0.0-rc.4 → 2.0.0-rc.6

package/dist/FormGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"FormGroup.js","sourceRoot":"","sources":["../src/FormGroup.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,UAAU,MAAM,4CAA4C,CAAC;AACpE,OAAO,OAAO,MAAM,+CAA+C,CAAC;AACpE,OAAO,aAAa,MAAM,0DAA0D,CAAC;AACrF,OAAO,QAAQ,MAAM,qDAAqD,CAAC;AAC3E,OAAO,IAAI,MAAM,iDAAiD,CAAC;AAInE,OAAO,eAAe,MAAM,4BAA4B,CAAC;AAEzD;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AAEH,IAAM,SAAS,GAAf,MAAM,SAAU,SAAQ,UAAU;IAmDjC,iBAAiB;QAChB,IAAI,CAAC,gBAAgB,EAAE,CAAC;IACzB,CAAC;IAED,gBAAgB;QACf,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,IAAc,EAAE,EAAE;YACrC,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,SAAS,CAAC;YAChC,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,WAAW,CAAC;QACrC,CAAC,CAAC,CAAC;IACJ,CAAC;IAED,IAAI,OAAO;QACV,OAAO,IAAI,CAAC;IACb,CAAC;CACD,CAAA;AAzDA;IADC,QAAQ,EAAE;6CACS;AAUpB;IADC,QAAQ,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,YAAY,EAAE,SAAS,EAAE,CAAC;6CACtC;AAUpB;IAJC,IAAI,CAAC;QACL,IAAI,EAAE,WAAW;QACjB,SAAS,EAAE,IAAI;KACf,CAAC;wCACsB;AAMxB;IADC,QAAQ,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,YAAY,EAAE,CAAC,EAAE,CAAC;wCACnC;AAGf;IADC,QAAQ,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,YAAY,EAAE,CAAC,EAAE,CAAC;wCACnC;AAGf;IADC,QAAQ,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,YAAY,EAAE,CAAC,EAAE,CAAC;wCACnC;AAGf;IADC,QAAQ,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,YAAY,EAAE,CAAC,EAAE,CAAC;yCAClC;AAGhB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,eAAe,EAAE,YAAY,EAAE,eAAe,CAAC,MAAM,EAAE,CAAC;8CACvC;AAGnC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,YAAY,EAAE,eAAe,EAAE,CAAC;4CACvC;AAjDd,SAAS;IADd,aAAa,CAAC,gBAAgB,CAAC;GAC1B,SAAS,CAiEd;AAED,SAAS,CAAC,MAAM,EAAE,CAAC;AAEnB,eAAe,SAAS,CAAC","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport Integer from \"@ui5/webcomponents-base/dist/types/Integer.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\nimport type FormItem from \"./FormItem.js\";\nimport type { IFormItem } from \"./Form.js\";\nimport FormItemSpacing from \"./types/FormItemSpacing.js\";\n\n/**\n * @class\n *\n * ### Overview\n *\n * The FormGroup (ui5-form-group) represents a group inside the Form (ui5-form) component\n * and it consists of FormItem (ui5-form-item) components.\n *\n * The layout of the FormGroup is mostly defined and controlled by the overarching Form (ui5-form) component.\n * Still, one can influence the layout via the FormGroup's `columnSpan` property,\n * that defines how many columns the group should expand to.\n *\n * ### Usage\n *\n * Тhe FormGroup (ui5-form-group) allows to split a Form into groups,\n * e.g to group FormItems that logically belong together.\n *\n * ### ES6 Module Import\n *\n * - import @ui5/webcomponents/dist/FormGroup.js\";\n *\n * @public\n * @since 2.0.0\n */\n@customElement(\"ui5-form-group\")\nclass FormGroup extends UI5Element implements IFormItem {\n\t/**\n\t * Defines header text of the component.\n\t *\n\t * @default \"\"\n\t * @public\n\t */\n\t@property()\n\theaderText!: string;\n\n\t/**\n\t * Defines column span of the component,\n\t * e.g how many columns the group should span to.\n\t *\n\t * @default undefined\n\t * @public\n\t */\n\t@property({ validator: Integer, defaultValue: undefined })\n\tcolumnSpan?: number;\n\n\t/**\n\t * Defines the items of the component.\n\t * @public\n\t */\n\t@slot({\n\t\ttype: HTMLElement,\n\t\t\"default\": true,\n\t})\n\titems!: Array<FormItem>;\n\n\t/**\n\t * @private\n\t */\n\t@property({ validator: Integer, defaultValue: 1 })\n\tcolsS!: number;\n\n\t@property({ validator: Integer, defaultValue: 1 })\n\tcolsM!: number;\n\n\t@property({ validator: Integer, defaultValue: 1 })\n\tcolsL!: number;\n\n\t@property({ validator: Integer, defaultValue: 1 })\n\tcolsXl!: number;\n\n\t@property({ type: FormItemSpacing, defaultValue: FormItemSpacing.Normal })\n\titemSpacing!: `${FormItemSpacing}`;\n\n\t@property({ type: String, defaultValue: \"S12 M4 L4 XL4\" })\n\tlabelSpan!: string;\n\n\tonBeforeRendering() {\n\t\tthis.processFormItems();\n\t}\n\n\tprocessFormItems() {\n\t\tthis.items.forEach((item: FormItem) => {\n\t\t\titem.labelSpan = this.labelSpan;\n\t\t\titem.itemSpacing = this.itemSpacing;\n\t\t});\n\t}\n\n\tget isGroup() {\n\t\treturn true;\n\t}\n}\n\nFormGroup.define();\n\nexport default FormGroup;\n"]}
+{"version":3,"file":"FormGroup.js","sourceRoot":"","sources":["../src/FormGroup.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,UAAU,MAAM,4CAA4C,CAAC;AACpE,OAAO,OAAO,MAAM,+CAA+C,CAAC;AACpE,OAAO,aAAa,MAAM,0DAA0D,CAAC;AACrF,OAAO,QAAQ,MAAM,qDAAqD,CAAC;AAC3E,OAAO,IAAI,MAAM,iDAAiD,CAAC;AAInE,OAAO,eAAe,MAAM,4BAA4B,CAAC;AAEzD;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AAEH,IAAM,SAAS,GAAf,MAAM,SAAU,SAAQ,UAAU;IAmDjC,iBAAiB;QAChB,IAAI,CAAC,gBAAgB,EAAE,CAAC;IACzB,CAAC;IAED,gBAAgB;QACf,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,IAAc,EAAE,EAAE;YACrC,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,SAAS,CAAC;YAChC,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,WAAW,CAAC;QACrC,CAAC,CAAC,CAAC;IACJ,CAAC;IAED,IAAI,OAAO;QACV,OAAO,IAAI,CAAC;IACb,CAAC;CACD,CAAA;AAzDA;IADC,QAAQ,EAAE;6CACS;AAUpB;IADC,QAAQ,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,YAAY,EAAE,SAAS,EAAE,CAAC;6CACtC;AAUpB;IAJC,IAAI,CAAC;QACL,IAAI,EAAE,WAAW;QACjB,SAAS,EAAE,IAAI;KACf,CAAC;wCACsB;AAMxB;IADC,QAAQ,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,YAAY,EAAE,CAAC,EAAE,CAAC;wCACnC;AAGf;IADC,QAAQ,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,YAAY,EAAE,CAAC,EAAE,CAAC;wCACnC;AAGf;IADC,QAAQ,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,YAAY,EAAE,CAAC,EAAE,CAAC;wCACnC;AAGf;IADC,QAAQ,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,YAAY,EAAE,CAAC,EAAE,CAAC;yCAClC;AAGhB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,eAAe,EAAE,YAAY,EAAE,eAAe,CAAC,MAAM,EAAE,CAAC;8CACvC;AAGnC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,YAAY,EAAE,eAAe,EAAE,CAAC;4CACvC;AAjDd,SAAS;IADd,aAAa,CAAC,gBAAgB,CAAC;GAC1B,SAAS,CAiEd;AAED,SAAS,CAAC,MAAM,EAAE,CAAC;AAEnB,eAAe,SAAS,CAAC","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport Integer from \"@ui5/webcomponents-base/dist/types/Integer.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\nimport type FormItem from \"./FormItem.js\";\nimport type { IFormItem } from \"./Form.js\";\nimport FormItemSpacing from \"./types/FormItemSpacing.js\";\n\n/**\n * @class\n *\n * ### Overview\n *\n * The FormGroup (ui5-form-group) represents a group inside the Form (ui5-form) component\n * and it consists of FormItem (ui5-form-item) components.\n *\n * The layout of the FormGroup is mostly defined and controlled by the overarching Form (ui5-form) component.\n * Still, one can influence the layout via the FormGroup's `columnSpan` property,\n * that defines how many columns the group should expand to.\n *\n * ### Usage\n *\n * Тhe FormGroup (ui5-form-group) allows to split a Form into groups,\n * e.g to group FormItems that logically belong together.\n *\n * ### ES6 Module Import\n *\n * - import @ui5/webcomponents/dist/FormGroup.js\";\n *\n * @public\n * @implements {IFormItem}\n * @since 2.0.0\n * @extends UI5Element\n */\n@customElement(\"ui5-form-group\")\nclass FormGroup extends UI5Element implements IFormItem {\n\t/**\n\t * Defines header text of the component.\n\t *\n\t * @default \"\"\n\t * @public\n\t */\n\t@property()\n\theaderText!: string;\n\n\t/**\n\t * Defines column span of the component,\n\t * e.g how many columns the group should span to.\n\t *\n\t * @default undefined\n\t * @public\n\t */\n\t@property({ validator: Integer, defaultValue: undefined })\n\tcolumnSpan?: number;\n\n\t/**\n\t * Defines the items of the component.\n\t * @public\n\t */\n\t@slot({\n\t\ttype: HTMLElement,\n\t\t\"default\": true,\n\t})\n\titems!: Array<FormItem>;\n\n\t/**\n\t * @private\n\t */\n\t@property({ validator: Integer, defaultValue: 1 })\n\tcolsS!: number;\n\n\t@property({ validator: Integer, defaultValue: 1 })\n\tcolsM!: number;\n\n\t@property({ validator: Integer, defaultValue: 1 })\n\tcolsL!: number;\n\n\t@property({ validator: Integer, defaultValue: 1 })\n\tcolsXl!: number;\n\n\t@property({ type: FormItemSpacing, defaultValue: FormItemSpacing.Normal })\n\titemSpacing!: `${FormItemSpacing}`;\n\n\t@property({ type: String, defaultValue: \"S12 M4 L4 XL4\" })\n\tlabelSpan!: string;\n\n\tonBeforeRendering() {\n\t\tthis.processFormItems();\n\t}\n\n\tprocessFormItems() {\n\t\tthis.items.forEach((item: FormItem) => {\n\t\t\titem.labelSpan = this.labelSpan;\n\t\t\titem.itemSpacing = this.itemSpacing;\n\t\t});\n\t}\n\n\tget isGroup() {\n\t\treturn true;\n\t}\n}\n\nFormGroup.define();\n\nexport default FormGroup;\n"]}

package/dist/FormItem.d.ts

@@ -22,8 +22,10 @@ import FormItemSpacing from "./types/FormItemSpacing.js";
  * @csspart content - Used to style the content part of the form item.
  *
  * @constructor
+ * @implements {IFormItem}
  * @public
  * @since 2.0.0
+ * @extends UI5Element
  */
 declare class FormItem extends UI5Element implements IFormItem {
     /**

package/dist/FormItem.js

@@ -36,8 +36,10 @@ import FormItemSpacing from "./types/FormItemSpacing.js";
  * @csspart content - Used to style the content part of the form item.
  *
  * @constructor
+ * @implements {IFormItem}
  * @public
  * @since 2.0.0
+ * @extends UI5Element
  */
 let FormItem = class FormItem extends UI5Element {
     get isGroup() {

package/dist/FormItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"FormItem.js","sourceRoot":"","sources":["../src/FormItem.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,UAAU,MAAM,4CAA4C,CAAC;AACpE,OAAO,QAAQ,MAAM,qDAAqD,CAAC;AAC3E,OAAO,aAAa,MAAM,0DAA0D,CAAC;AACrF,OAAO,SAAS,MAAM,sDAAsD,CAAC;AAC7E,OAAO,IAAI,MAAM,iDAAiD,CAAC;AACnE,OAAO,OAAO,MAAM,+CAA+C,CAAC;AAEpE,WAAW;AACX,OAAO,gBAAgB,MAAM,+CAA+C,CAAC;AAE7E,SAAS;AACT,OAAO,WAAW,MAAM,oCAAoC,CAAC;AAG7D,OAAO,eAAe,MAAM,4BAA4B,CAAC;AAEzD;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AAOH,IAAM,QAAQ,GAAd,MAAM,QAAS,SAAQ,UAAU;IA8ChC,IAAI,OAAO;QACV,OAAO,KAAK,CAAC;IACd,CAAC;CACD,CAAA;AApCA;IADC,QAAQ,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,YAAY,EAAE,SAAS,EAAE,CAAC;4CACtC;AAOpB;IADC,IAAI,EAAE;8CAC2B;AAYlC;IALC,IAAI,CAAC;QACL,IAAI,EAAE,WAAW;QACjB,SAAS,EAAE,IAAI;QACf,eAAe,EAAE,IAAI;KACrB,CAAC;yCAC2B;AAM7B;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,YAAY,EAAE,eAAe,EAAE,CAAC;2CACvC;AAMnB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,eAAe,EAAE,YAAY,EAAE,eAAe,CAAC,MAAM,EAAE,CAAC;6CACvC;AA5C9B,QAAQ;IANb,aAAa,CAAC;QACd,GAAG,EAAE,eAAe;QACpB,QAAQ,EAAE,SAAS;QACnB,MAAM,EAAE,WAAW;QACnB,QAAQ,EAAE,gBAAgB;KAC1B,CAAC;GACI,QAAQ,CAiDb;AAED,QAAQ,CAAC,MAAM,EAAE,CAAC;AAElB,eAAe,QAAQ,CAAC","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport litRender from \"@ui5/webcomponents-base/dist/renderer/LitRenderer.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot.js\";\nimport Integer from \"@ui5/webcomponents-base/dist/types/Integer.js\";\n\n// Template\nimport FormItemTemplate from \"./generated/templates/FormItemTemplate.lit.js\";\n\n// Styles\nimport FormItemCss from \"./generated/themes/FormItem.css.js\";\n\nimport type { IFormItem } from \"./Form.js\";\nimport FormItemSpacing from \"./types/FormItemSpacing.js\";\n\n/**\n * @class\n *\n * ### Overview\n *\n * The FormItem (ui5-form-item) represents pair of a label and\n * one or more components (text or text fields), associated to it.\n *\n * ### Usage\n *\n * The FormItem is being used in FormGroup (ui5-form-group) or directly in Form (ui5-form).\n *\n * ### ES6 Module Import\n *\n * - import @ui5/webcomponents/dist/FormItem.js\";\n *\n * @csspart layout - Used to style the parent element of the label and content parts.\n * @csspart label - Used to style the label part of the form item.\n * @csspart content - Used to style the content part of the form item.\n *\n * @constructor\n * @public\n * @since 2.0.0\n */\n@customElement({\n\ttag: \"ui5-form-item\",\n\trenderer: litRender,\n\tstyles: FormItemCss,\n\ttemplate: FormItemTemplate,\n})\nclass FormItem extends UI5Element implements IFormItem {\n\t/**\n\t * Defines the column span of the component,\n\t * e.g how many columns the component should span to.\n\t *\n\t * **Note:** The column span should be a number between 1 and the available columns of the FormGroup (when items are placed in a group)\n\t * or the Form. The available columns can be affected by the FormGroup#columnSpan and/or the Form#layout.\n\t * A number bigger than the available columns won't take effect.\n\t *\n\t * @default undefined\n\t * @public\n\t */\n\t@property({ validator: Integer, defaultValue: undefined })\n\tcolumnSpan?: number;\n\n\t/**\n\t * Defines the label of the component.\n\t * @public\n\t */\n\t@slot()\n\tlabelContent!: Array<HTMLElement>;\n\n\t/**\n\t * Defines the content of the component,\n\t * associated to `labelContent`.\n\t * @public\n\t */\n\t@slot({\n\t\ttype: HTMLElement,\n\t\t\"default\": true,\n\t\tindividualSlots: true,\n\t})\n\tcontent!: Array<HTMLElement>;\n\n\t/**\n\t * @private\n\t */\n\t@property({ type: String, defaultValue: \"S12 M4 L4 XL4\" })\n\tlabelSpan!: string;\n\n\t/**\n\t * @private\n\t */\n\t@property({ type: FormItemSpacing, defaultValue: FormItemSpacing.Normal })\n\titemSpacing!: `${FormItemSpacing}`;\n\n\tget isGroup() {\n\t\treturn false;\n\t}\n}\n\nFormItem.define();\n\nexport default FormItem;\n"]}
+{"version":3,"file":"FormItem.js","sourceRoot":"","sources":["../src/FormItem.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,UAAU,MAAM,4CAA4C,CAAC;AACpE,OAAO,QAAQ,MAAM,qDAAqD,CAAC;AAC3E,OAAO,aAAa,MAAM,0DAA0D,CAAC;AACrF,OAAO,SAAS,MAAM,sDAAsD,CAAC;AAC7E,OAAO,IAAI,MAAM,iDAAiD,CAAC;AACnE,OAAO,OAAO,MAAM,+CAA+C,CAAC;AAEpE,WAAW;AACX,OAAO,gBAAgB,MAAM,+CAA+C,CAAC;AAE7E,SAAS;AACT,OAAO,WAAW,MAAM,oCAAoC,CAAC;AAG7D,OAAO,eAAe,MAAM,4BAA4B,CAAC;AAEzD;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AAOH,IAAM,QAAQ,GAAd,MAAM,QAAS,SAAQ,UAAU;IA8ChC,IAAI,OAAO;QACV,OAAO,KAAK,CAAC;IACd,CAAC;CACD,CAAA;AApCA;IADC,QAAQ,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,YAAY,EAAE,SAAS,EAAE,CAAC;4CACtC;AAOpB;IADC,IAAI,EAAE;8CAC2B;AAYlC;IALC,IAAI,CAAC;QACL,IAAI,EAAE,WAAW;QACjB,SAAS,EAAE,IAAI;QACf,eAAe,EAAE,IAAI;KACrB,CAAC;yCAC2B;AAM7B;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,YAAY,EAAE,eAAe,EAAE,CAAC;2CACvC;AAMnB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,eAAe,EAAE,YAAY,EAAE,eAAe,CAAC,MAAM,EAAE,CAAC;6CACvC;AA5C9B,QAAQ;IANb,aAAa,CAAC;QACd,GAAG,EAAE,eAAe;QACpB,QAAQ,EAAE,SAAS;QACnB,MAAM,EAAE,WAAW;QACnB,QAAQ,EAAE,gBAAgB;KAC1B,CAAC;GACI,QAAQ,CAiDb;AAED,QAAQ,CAAC,MAAM,EAAE,CAAC;AAElB,eAAe,QAAQ,CAAC","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport litRender from \"@ui5/webcomponents-base/dist/renderer/LitRenderer.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot.js\";\nimport Integer from \"@ui5/webcomponents-base/dist/types/Integer.js\";\n\n// Template\nimport FormItemTemplate from \"./generated/templates/FormItemTemplate.lit.js\";\n\n// Styles\nimport FormItemCss from \"./generated/themes/FormItem.css.js\";\n\nimport type { IFormItem } from \"./Form.js\";\nimport FormItemSpacing from \"./types/FormItemSpacing.js\";\n\n/**\n * @class\n *\n * ### Overview\n *\n * The FormItem (ui5-form-item) represents pair of a label and\n * one or more components (text or text fields), associated to it.\n *\n * ### Usage\n *\n * The FormItem is being used in FormGroup (ui5-form-group) or directly in Form (ui5-form).\n *\n * ### ES6 Module Import\n *\n * - import @ui5/webcomponents/dist/FormItem.js\";\n *\n * @csspart layout - Used to style the parent element of the label and content parts.\n * @csspart label - Used to style the label part of the form item.\n * @csspart content - Used to style the content part of the form item.\n *\n * @constructor\n * @implements {IFormItem}\n * @public\n * @since 2.0.0\n * @extends UI5Element\n */\n@customElement({\n\ttag: \"ui5-form-item\",\n\trenderer: litRender,\n\tstyles: FormItemCss,\n\ttemplate: FormItemTemplate,\n})\nclass FormItem extends UI5Element implements IFormItem {\n\t/**\n\t * Defines the column span of the component,\n\t * e.g how many columns the component should span to.\n\t *\n\t * **Note:** The column span should be a number between 1 and the available columns of the FormGroup (when items are placed in a group)\n\t * or the Form. The available columns can be affected by the FormGroup#columnSpan and/or the Form#layout.\n\t * A number bigger than the available columns won't take effect.\n\t *\n\t * @default undefined\n\t * @public\n\t */\n\t@property({ validator: Integer, defaultValue: undefined })\n\tcolumnSpan?: number;\n\n\t/**\n\t * Defines the label of the component.\n\t * @public\n\t */\n\t@slot()\n\tlabelContent!: Array<HTMLElement>;\n\n\t/**\n\t * Defines the content of the component,\n\t * associated to `labelContent`.\n\t * @public\n\t */\n\t@slot({\n\t\ttype: HTMLElement,\n\t\t\"default\": true,\n\t\tindividualSlots: true,\n\t})\n\tcontent!: Array<HTMLElement>;\n\n\t/**\n\t * @private\n\t */\n\t@property({ type: String, defaultValue: \"S12 M4 L4 XL4\" })\n\tlabelSpan!: string;\n\n\t/**\n\t * @private\n\t */\n\t@property({ type: FormItemSpacing, defaultValue: FormItemSpacing.Normal })\n\titemSpacing!: `${FormItemSpacing}`;\n\n\tget isGroup() {\n\t\treturn false;\n\t}\n}\n\nFormItem.define();\n\nexport default FormItem;\n"]}

package/dist/GridWalker.d.ts

@@ -0,0 +1,35 @@
+/**
+ * The GridWalker object represents the elements of a two-dimensional grid system and a position within them.
+ *
+ * @class
+ * @private
+ */
+declare class GridWalker {
+    grid: unknown[][];
+    rowPos: number;
+    colPos: number;
+    pageSize: number;
+    firstRowPos: number;
+    lastRowPos: number;
+    constructor(grid?: unknown[][]);
+    left(): void;
+    right(): void;
+    up(): void;
+    down(): void;
+    pageup(): void;
+    pagedown(): void;
+    home(): void;
+    end(): void;
+    setGrid(grid: unknown[][]): void;
+    getCurrent(): unknown;
+    setCurrent(current: unknown): void;
+    setRowPos(rowPos: number): void;
+    getRowPos(): number;
+    setColPos(colPos: number): void;
+    getColPos(): number;
+    setFirstRowPos(firstRowPos: number): void;
+    getFirstRowPos(): number;
+    setLastRowPos(lastRowPos: number): void;
+    getLastRowPos(): number;
+}
+export default GridWalker;

package/dist/GridWalker.js

@@ -0,0 +1,103 @@
+/**
+ * The GridWalker object represents the elements of a two-dimensional grid system and a position within them.
+ *
+ * @class
+ * @private
+ */
+class GridWalker {
+    constructor(grid = [[]]) {
+        this.rowPos = 0;
+        this.colPos = 0;
+        this.pageSize = 20;
+        this.firstRowPos = 0;
+        this.lastRowPos = 0;
+        this.grid = grid;
+    }
+    left() {
+        this.colPos = Math.max(this.getColPos() - 1, 0);
+    }
+    right() {
+        this.colPos = Math.min(this.getColPos() + 1, this.grid[this.getRowPos()].length - 1);
+    }
+    up() {
+        this.rowPos = Math.max(this.getRowPos() - 1, 0);
+    }
+    down() {
+        this.rowPos = Math.min(this.getRowPos() + 1, this.grid.length - 1);
+    }
+    pageup() {
+        this.colPos = this.getColPos();
+        const rowPos = this.getRowPos();
+        this.rowPos = Math.max(rowPos > this.firstRowPos ? this.firstRowPos : 0, rowPos - this.pageSize);
+    }
+    pagedown() {
+        this.colPos = this.getColPos();
+        const rowPos = this.getRowPos();
+        const endRowPos = this.grid.length - 1;
+        const lastRowPos = endRowPos + this.lastRowPos;
+        this.rowPos = Math.min(rowPos < lastRowPos ? lastRowPos : endRowPos, rowPos + this.pageSize);
+    }
+    home() {
+        this.colPos = this.getColPos();
+        if (this.colPos === 0) {
+            this.rowPos = (this.rowPos > this.firstRowPos) ? this.firstRowPos : 0;
+        }
+        else {
+            this.colPos = (this.colPos > 1) ? 1 : 0;
+        }
+    }
+    end() {
+        this.colPos = this.getColPos();
+        if (this.colPos === 0) {
+            const endRowPos = this.grid.length - 1;
+            const lastRowPos = endRowPos + this.lastRowPos;
+            this.rowPos = (this.rowPos < lastRowPos) ? lastRowPos : endRowPos;
+        }
+        else {
+            const lastColPos = this.grid[this.rowPos].length - 1;
+            this.colPos = (this.colPos < lastColPos) ? lastColPos : 0;
+        }
+    }
+    setGrid(grid) {
+        this.grid = grid;
+    }
+    getCurrent() {
+        return this.grid[this.getRowPos()][this.getColPos()];
+    }
+    setCurrent(current) {
+        this.grid.forEach((row, rowIndex) => {
+            row.forEach((cell, colIndex) => {
+                if (cell === current) {
+                    this.rowPos = rowIndex;
+                    this.colPos = colIndex;
+                }
+            });
+        });
+    }
+    setRowPos(rowPos) {
+        this.rowPos = rowPos;
+    }
+    getRowPos() {
+        return Math.min(this.rowPos, this.grid.length - 1);
+    }
+    setColPos(colPos) {
+        this.colPos = colPos;
+    }
+    getColPos() {
+        return Math.min(this.colPos, this.grid[this.getRowPos()].length - 1);
+    }
+    setFirstRowPos(firstRowPos) {
+        this.firstRowPos = firstRowPos;
+    }
+    getFirstRowPos() {
+        return this.firstRowPos;
+    }
+    setLastRowPos(lastRowPos) {
+        this.lastRowPos = lastRowPos;
+    }
+    getLastRowPos() {
+        return this.lastRowPos;
+    }
+}
+export default GridWalker;
+//# sourceMappingURL=GridWalker.js.map

package/dist/GridWalker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GridWalker.js","sourceRoot":"","sources":["../src/GridWalker.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * The GridWalker object represents the elements of a two-dimensional grid system and a position within them.\n *\n * @class\n * @private\n */\nclass GridWalker {\n\tgrid: unknown[][];\n\trowPos: number = 0;\n\tcolPos: number = 0;\n\tpageSize: number = 20;\n\tfirstRowPos: number = 0;\n\tlastRowPos: number = 0;\n\n\tconstructor(grid: unknown[][] = [[]]) {\n\t\tthis.grid = grid;\n\t}\n\n\tleft() {\n\t\tthis.colPos = Math.max(this.getColPos() - 1, 0);\n\t}\n\n\tright() {\n\t\tthis.colPos = Math.min(this.getColPos() + 1, this.grid[this.getRowPos()].length - 1);\n\t}\n\n\tup() {\n\t\tthis.rowPos = Math.max(this.getRowPos() - 1, 0);\n\t}\n\n\tdown() {\n\t\tthis.rowPos = Math.min(this.getRowPos() + 1, this.grid.length - 1);\n\t}\n\n\tpageup() {\n\t\tthis.colPos = this.getColPos();\n\t\tconst rowPos = this.getRowPos();\n\t\tthis.rowPos = Math.max(rowPos > this.firstRowPos ? this.firstRowPos : 0, rowPos - this.pageSize);\n\t}\n\n\tpagedown() {\n\t\tthis.colPos = this.getColPos();\n\t\tconst rowPos = this.getRowPos();\n\t\tconst endRowPos = this.grid.length - 1;\n\t\tconst lastRowPos = endRowPos + this.lastRowPos;\n\t\tthis.rowPos = Math.min(rowPos < lastRowPos ? lastRowPos : endRowPos, rowPos + this.pageSize);\n\t}\n\n\thome() {\n\t\tthis.colPos = this.getColPos();\n\t\tif (this.colPos === 0) {\n\t\t\tthis.rowPos = (this.rowPos > this.firstRowPos) ? this.firstRowPos : 0;\n\t\t} else {\n\t\t\tthis.colPos = (this.colPos > 1) ? 1 : 0;\n\t\t}\n\t}\n\n\tend() {\n\t\tthis.colPos = this.getColPos();\n\t\tif (this.colPos === 0) {\n\t\t\tconst endRowPos = this.grid.length - 1;\n\t\t\tconst lastRowPos = endRowPos + this.lastRowPos;\n\t\t\tthis.rowPos = (this.rowPos < lastRowPos) ? lastRowPos : endRowPos;\n\t\t} else {\n\t\t\tconst lastColPos = this.grid[this.rowPos].length - 1;\n\t\t\tthis.colPos = (this.colPos < lastColPos) ? lastColPos : 0;\n\t\t}\n\t}\n\n\tsetGrid(grid: unknown[][]) {\n\t\tthis.grid = grid;\n\t}\n\n\tgetCurrent() {\n\t\treturn this.grid[this.getRowPos()][this.getColPos()];\n\t}\n\n\tsetCurrent(current: unknown) {\n\t\tthis.grid.forEach((row, rowIndex) => {\n\t\t\trow.forEach((cell, colIndex) => {\n\t\t\t\tif (cell === current) {\n\t\t\t\t\tthis.rowPos = rowIndex;\n\t\t\t\t\tthis.colPos = colIndex;\n\t\t\t\t}\n\t\t\t});\n\t\t});\n\t}\n\n\tsetRowPos(rowPos: number) {\n\t\tthis.rowPos = rowPos;\n\t}\n\n\tgetRowPos() {\n\t\treturn Math.min(this.rowPos, this.grid.length - 1);\n\t}\n\n\tsetColPos(colPos: number) {\n\t\tthis.colPos = colPos;\n\t}\n\n\tgetColPos() {\n\t\treturn Math.min(this.colPos, this.grid[this.getRowPos()].length - 1);\n\t}\n\n\tsetFirstRowPos(firstRowPos: number) {\n\t\tthis.firstRowPos = firstRowPos;\n\t}\n\n\tgetFirstRowPos() {\n\t\treturn this.firstRowPos;\n\t}\n\n\tsetLastRowPos(lastRowPos: number) {\n\t\tthis.lastRowPos = lastRowPos;\n\t}\n\n\tgetLastRowPos() {\n\t\treturn this.lastRowPos;\n\t}\n}\n\nexport default GridWalker;\n"]}

package/dist/Icon.js.map

@@ -1 +1 @@
-{"version":3,"file":"Icon.js","sourceRoot":"","sources":["../src/Icon.ts"],"names":[],"mappings":"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","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport litRender from \"@ui5/webcomponents-base/dist/renderer/LitRenderer.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport { getIconData, getIconDataSync, IconData } from \"@ui5/webcomponents-base/dist/asset-registries/Icons.js\";\nimport { getI18nBundle } from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport type { I18nText } from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport { isDesktop } from \"@ui5/webcomponents-base/dist/Device.js\";\nimport { isSpace, isEnter } from \"@ui5/webcomponents-base/dist/Keys.js\";\nimport executeTemplate from \"@ui5/webcomponents-base/dist/renderer/executeTemplate.js\";\nimport IconTemplate from \"./generated/templates/IconTemplate.lit.js\";\nimport IconDesign from \"./types/IconDesign.js\";\nimport IconMode from \"./types/IconMode.js\";\n\n// Styles\nimport iconCss from \"./generated/themes/Icon.css.js\";\n\n/**\n * Interface for components that represent an icon, usable in numerous higher-order components\n * @public\n */\ninterface IIcon extends HTMLElement { }\n\nconst ICON_NOT_FOUND = \"ICON_NOT_FOUND\";\n\n/**\n * @class\n * ### Overview\n *\n * The `ui5-icon` component represents an SVG icon.\n * There are two main scenarios how the `ui5-icon` component is used:\n * as a purely decorative element,\n * or as an interactive element that can be focused and clicked.\n *\n * ### Usage\n *\n * 1. **Get familiar with the icons collections.**\n *\n * Before displaying an icon, you need to explore the icons collections to find and import the desired icon.\n *\n * Currently there are 3 icons collection, available as 3 npm packages:\n *\n * - [@ui5/webcomponents-icons](https://www.npmjs.com/package/@ui5/webcomponents-icons) represents the \"SAP-icons\" collection and includes the following\n * [icons](https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html#/overview/SAP-icons).\n * - [@ui5/webcomponents-icons-tnt](https://www.npmjs.com/package/@ui5/webcomponents-icons-tnt) represents the \"tnt\" collection and includes the following\n * [icons](https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html#/overview/SAP-icons-TNT).\n * - [@ui5/webcomponents-icons-icons-business-suite](https://www.npmjs.com/package/@ui5/webcomponents-icons-business-suite) represents the \"business-suite\" collection and includes the following\n * [icons](https://ui5.sap.com/test-resources/sap/m/demokit/iconExplorer/webapp/index.html#/overview/BusinessSuiteInAppSymbols).\n *\n * 2. **After exploring the icons collections, add one or more of the packages as dependencies to your project.**\n *\n * `npm i @ui5/webcomponents-icons`\n * `npm i @ui5/webcomponents-icons-tnt`\n * `npm i @ui5/webcomponents-icons-business-suite`\n *\n * 3. **Then, import the desired icon**.\n *\n * `import \"@ui5/\\{package_name\\}/dist/\\{icon_name\\}.js\";`\n *\n * **For Example**:\n *\n * For the standard \"SAP-icons\" icon collection, import an icon from the `@ui5/webcomponents-icons` package:\n *\n * `import \"@ui5/webcomponents-icons/dist/employee.js\";`\n *\n * For the \"tnt\" (SAP Fiori Tools) icon collection, import an icon from the `@ui5/webcomponents-icons-tnt` package:\n *\n * `import \"@ui5/webcomponents-icons-tnt/dist/antenna.js\";`\n *\n * For the \"business-suite\" (SAP Business Suite) icon collection, import an icon from the `@ui5/webcomponents-icons-business-suite` package:\n *\n * `import \"@ui5/webcomponents-icons-business-suite/dist/ab-testing.js\";`\n *\n * 4. **Display the icon using the `ui5-icon` web component.**\n * Set the icon collection (\"SAP-icons\", \"tnt\" or \"business-suite\" - \"SAP-icons\" is the default icon collection and can be skipped)\n * and the icon name to the `name` property.\n *\n * `<ui5-icon name=\"employee\"></ui5-icon>`\n * `<ui5-icon name=\"tnt/antenna\"></ui5-icon>`\n * `<ui5-icon name=\"business-suite/ab-testing\"></ui5-icon>`\n *\n * ### Keyboard Handling\n *\n * - [Space] / [Enter] or [Return] - Fires the `click` event if the `mode` property is set to `Interactive`.\n * - [Shift] - If [Space] / [Enter] or [Return] is pressed, pressing [Shift] releases the ui5-icon without triggering the click event.\n *\n * ### ES6 Module Import\n *\n * `import \"@ui5/webcomponents/dist/Icon.js\";`\n * @csspart root - Used to style the outermost wrapper of the `ui5-icon`.\n * @constructor\n * @extends UI5Element\n * @implements {IIcon}\n * @public\n */\n@customElement({\n\ttag: \"ui5-icon\",\n\tlanguageAware: true,\n\tthemeAware: true,\n\trenderer: litRender,\n\ttemplate: IconTemplate,\n\tstyles: iconCss,\n})\n/**\n * Fired on mouseup, `SPACE` and `ENTER`.\n * - on mouse click, the icon fires native `click` event\n * - on `SPACE` and `ENTER`, the icon fires custom `click` event\n * @private\n * @since 1.0.0-rc.8\n */\n@event(\"click\")\nclass Icon extends UI5Element implements IIcon {\n\t/**\n\t * Defines the component semantic design.\n\t * @default \"Default\"\n\t * @public\n\t * @since 1.9.2\n\t */\n\t@property({ type: IconDesign, defaultValue: IconDesign.Default })\n\tdesign!: `${IconDesign}`;\n\n\t/**\n\t * Defines the unique identifier (icon name) of the component.\n\t *\n\t * To browse all available icons, see the\n\t * [SAP Icons](https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html),\n\t * [SAP Fiori Tools](https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html#/overview/SAP-icons-TNT) and\n\t * [SAP Business Suite](https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html)\n\t *\n\t * Example:\n\t * `name='add'`, `name='delete'`, `name='employee'`.\n\t *\n\t * **Note:** To use the SAP Fiori Tools icons,\n\t * you need to set the `tnt` prefix in front of the icon's name.\n\t *\n\t * Example:\n\t * `name='tnt/antenna'`, `name='tnt/actor'`, `name='tnt/api'`.\n\t *\n\t * **Note:** To use the SAP Business Suite icons,\n\t * you need to set the `business-suite` prefix in front of the icon's name.\n\t *\n\t * Example:\n\t * `name='business-suite/3d'`, `name='business-suite/1x2-grid-layout'`, `name='business-suite/4x4-grid-layout'`.\n\t * @default \"\"\n\t * @public\n\t */\n\t@property()\n\tname!: string;\n\n\t/**\n\t * Defines the text alternative of the component.\n\t * If not provided a default text alternative will be set, if present.\n\t *\n\t * **Note:** Every icon should have a text alternative in order to\n\t * calculate its accessible name.\n\t * @default \"\"\n\t * @public\n\t */\n\t@property()\n\taccessibleName!: string;\n\n\t/**\n\t * Defines whether the component should have a tooltip.\n\t *\n\t * **Note:** The tooltip text should be provided via the `accessible-name` property.\n\t * @default false\n\t * @public\n\t */\n\t@property({ type: Boolean })\n\tshowTooltip!: boolean;\n\n\t/**\n\t * Defines the mode of the component.\n\t * @default \"Image\"\n\t * @public\n\t * @since 2.0.0\n\t */\n\t@property({ type: IconMode, defaultValue: IconMode.Image })\n\tmode!: `${IconMode}`;\n\n\t/**\n\t * @private\n\t */\n\t@property({ multiple: true })\n\tpathData!: Array<string>;\n\n\t/**\n\t * @private\n\t */\n\t@property({ type: Object, defaultValue: undefined, noAttribute: true })\n\taccData?: I18nText;\n\n\t/**\n\t* @private\n\t*/\n\t@property({ type: Boolean })\n\tinvalid!: boolean;\n\n\t/**\n\t * @private\n\t */\n\t@property({ noAttribute: true, defaultValue: undefined })\n\teffectiveAccessibleName?: string;\n\n\tltr?: boolean;\n\tpackageName?: string;\n\tviewBox?: string;\n\tcustomSvg?: object;\n\n\t_onkeydown(e: KeyboardEvent) {\n\t\tif (this.mode !== IconMode.Interactive) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (isEnter(e)) {\n\t\t\tthis.fireEvent(\"click\");\n\t\t}\n\n\t\tif (isSpace(e)) {\n\t\t\te.preventDefault(); // prevent scrolling\n\t\t}\n\t}\n\n\t_onkeyup(e: KeyboardEvent) {\n\t\tif (this.mode === IconMode.Interactive && isSpace(e)) {\n\t\t\tthis.fireEvent(\"click\");\n\t\t}\n\t}\n\n\t/**\n\t* Enforce \"ltr\" direction, based on the icons collection metadata.\n\t*/\n\tget _dir() {\n\t\treturn this.ltr ? \"ltr\" : undefined;\n\t}\n\n\tget effectiveAriaHidden() {\n\t\treturn this.mode === IconMode.Decorative ? \"true\" : undefined;\n\t}\n\n\tget _tabIndex() {\n\t\treturn this.mode === IconMode.Interactive ? \"0\" : undefined;\n\t}\n\n\tget effectiveAccessibleRole() {\n\t\tswitch (this.mode) {\n\t\tcase IconMode.Interactive:\n\t\t\treturn \"button\";\n\t\tcase IconMode.Decorative:\n\t\t\treturn \"presentation\";\n\t\tdefault:\n\t\t\treturn \"img\";\n\t\t}\n\t}\n\n\tonEnterDOM() {\n\t\tif (isDesktop()) {\n\t\t\tthis.setAttribute(\"desktop\", \"\");\n\t\t}\n\t}\n\n\tasync onBeforeRendering() {\n\t\tconst name = this.name;\n\t\tif (!name) {\n\t\t\t/* eslint-disable-next-line */\n\t\t\treturn console.warn(\"Icon name property is required\", this);\n\t\t}\n\n\t\tlet iconData: typeof ICON_NOT_FOUND | IconData | undefined = getIconDataSync(name);\n\t\tif (!iconData) {\n\t\t\ticonData = await getIconData(name);\n\t\t}\n\n\t\tif (!iconData) {\n\t\t\tthis.invalid = true;\n\t\t\t/* eslint-disable-next-line */\n\t\t\treturn console.warn(`Required icon is not registered. Invalid icon name: ${this.name}`);\n\t\t}\n\n\t\tif (iconData === ICON_NOT_FOUND) {\n\t\t\tthis.invalid = true;\n\t\t\t/* eslint-disable-next-line */\n\t\t\treturn console.warn(`Required icon is not registered. You can either import the icon as a module in order to use it e.g. \"@ui5/webcomponents-icons/dist/${name.replace(\"sap-icon://\", \"\")}.js\", or setup a JSON build step and import \"@ui5/webcomponents-icons/dist/AllIcons.js\".`);\n\t\t}\n\n\t\tthis.viewBox = iconData.viewBox || \"0 0 512 512\";\n\n\t\tif (iconData.customTemplate) {\n\t\t\ticonData.pathData = [];\n\t\t\tthis.customSvg = executeTemplate(iconData.customTemplate, this);\n\t\t}\n\n\t\t// in case a new valid name is set, show the icon\n\t\tthis.invalid = false;\n\t\tthis.pathData = Array.isArray(iconData.pathData) ? iconData.pathData : [iconData.pathData];\n\t\tthis.accData = iconData.accData;\n\t\tthis.ltr = iconData.ltr;\n\t\tthis.packageName = iconData.packageName;\n\n\t\tif (this.accessibleName) {\n\t\t\tthis.effectiveAccessibleName = this.accessibleName;\n\t\t} else if (this.accData) {\n\t\t\tconst i18nBundle = await getI18nBundle(this.packageName);\n\t\t\tthis.effectiveAccessibleName = i18nBundle.getText(this.accData) || undefined;\n\t\t} else {\n\t\t\tthis.effectiveAccessibleName = undefined;\n\t\t}\n\t}\n\n\tget hasIconTooltip() {\n\t\treturn this.showTooltip && this.effectiveAccessibleName;\n\t}\n}\n\nIcon.define();\n\nexport default Icon;\nexport type {\n\tIIcon,\n};\n"]}
+{"version":3,"file":"Icon.js","sourceRoot":"","sources":["../src/Icon.ts"],"names":[],"mappings":"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","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport litRender from \"@ui5/webcomponents-base/dist/renderer/LitRenderer.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport type { IconData } from \"@ui5/webcomponents-base/dist/asset-registries/Icons.js\";\nimport { getIconData, getIconDataSync } from \"@ui5/webcomponents-base/dist/asset-registries/Icons.js\";\nimport { getI18nBundle } from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport type { I18nText } from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport { isDesktop } from \"@ui5/webcomponents-base/dist/Device.js\";\nimport { isSpace, isEnter } from \"@ui5/webcomponents-base/dist/Keys.js\";\nimport executeTemplate from \"@ui5/webcomponents-base/dist/renderer/executeTemplate.js\";\nimport IconTemplate from \"./generated/templates/IconTemplate.lit.js\";\nimport IconDesign from \"./types/IconDesign.js\";\nimport IconMode from \"./types/IconMode.js\";\n\n// Styles\nimport iconCss from \"./generated/themes/Icon.css.js\";\n\n/**\n * Interface for components that represent an icon, usable in numerous higher-order components\n * @public\n */\ninterface IIcon extends HTMLElement { }\n\nconst ICON_NOT_FOUND = \"ICON_NOT_FOUND\";\n\n/**\n * @class\n * ### Overview\n *\n * The `ui5-icon` component represents an SVG icon.\n * There are two main scenarios how the `ui5-icon` component is used:\n * as a purely decorative element,\n * or as an interactive element that can be focused and clicked.\n *\n * ### Usage\n *\n * 1. **Get familiar with the icons collections.**\n *\n * Before displaying an icon, you need to explore the icons collections to find and import the desired icon.\n *\n * Currently there are 3 icons collection, available as 3 npm packages:\n *\n * - [@ui5/webcomponents-icons](https://www.npmjs.com/package/@ui5/webcomponents-icons) represents the \"SAP-icons\" collection and includes the following\n * [icons](https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html#/overview/SAP-icons).\n * - [@ui5/webcomponents-icons-tnt](https://www.npmjs.com/package/@ui5/webcomponents-icons-tnt) represents the \"tnt\" collection and includes the following\n * [icons](https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html#/overview/SAP-icons-TNT).\n * - [@ui5/webcomponents-icons-icons-business-suite](https://www.npmjs.com/package/@ui5/webcomponents-icons-business-suite) represents the \"business-suite\" collection and includes the following\n * [icons](https://ui5.sap.com/test-resources/sap/m/demokit/iconExplorer/webapp/index.html#/overview/BusinessSuiteInAppSymbols).\n *\n * 2. **After exploring the icons collections, add one or more of the packages as dependencies to your project.**\n *\n * `npm i @ui5/webcomponents-icons`\n * `npm i @ui5/webcomponents-icons-tnt`\n * `npm i @ui5/webcomponents-icons-business-suite`\n *\n * 3. **Then, import the desired icon**.\n *\n * `import \"@ui5/\\{package_name\\}/dist/\\{icon_name\\}.js\";`\n *\n * **For Example**:\n *\n * For the standard \"SAP-icons\" icon collection, import an icon from the `@ui5/webcomponents-icons` package:\n *\n * `import \"@ui5/webcomponents-icons/dist/employee.js\";`\n *\n * For the \"tnt\" (SAP Fiori Tools) icon collection, import an icon from the `@ui5/webcomponents-icons-tnt` package:\n *\n * `import \"@ui5/webcomponents-icons-tnt/dist/antenna.js\";`\n *\n * For the \"business-suite\" (SAP Business Suite) icon collection, import an icon from the `@ui5/webcomponents-icons-business-suite` package:\n *\n * `import \"@ui5/webcomponents-icons-business-suite/dist/ab-testing.js\";`\n *\n * 4. **Display the icon using the `ui5-icon` web component.**\n * Set the icon collection (\"SAP-icons\", \"tnt\" or \"business-suite\" - \"SAP-icons\" is the default icon collection and can be skipped)\n * and the icon name to the `name` property.\n *\n * `<ui5-icon name=\"employee\"></ui5-icon>`\n * `<ui5-icon name=\"tnt/antenna\"></ui5-icon>`\n * `<ui5-icon name=\"business-suite/ab-testing\"></ui5-icon>`\n *\n * ### Keyboard Handling\n *\n * - [Space] / [Enter] or [Return] - Fires the `click` event if the `mode` property is set to `Interactive`.\n * - [Shift] - If [Space] / [Enter] or [Return] is pressed, pressing [Shift] releases the ui5-icon without triggering the click event.\n *\n * ### ES6 Module Import\n *\n * `import \"@ui5/webcomponents/dist/Icon.js\";`\n * @csspart root - Used to style the outermost wrapper of the `ui5-icon`.\n * @constructor\n * @extends UI5Element\n * @implements {IIcon}\n * @public\n */\n@customElement({\n\ttag: \"ui5-icon\",\n\tlanguageAware: true,\n\tthemeAware: true,\n\trenderer: litRender,\n\ttemplate: IconTemplate,\n\tstyles: iconCss,\n})\n/**\n * Fired on mouseup, `SPACE` and `ENTER`.\n * - on mouse click, the icon fires native `click` event\n * - on `SPACE` and `ENTER`, the icon fires custom `click` event\n * @private\n * @since 1.0.0-rc.8\n */\n@event(\"click\")\nclass Icon extends UI5Element implements IIcon {\n\t/**\n\t * Defines the component semantic design.\n\t * @default \"Default\"\n\t * @public\n\t * @since 1.9.2\n\t */\n\t@property({ type: IconDesign, defaultValue: IconDesign.Default })\n\tdesign!: `${IconDesign}`;\n\n\t/**\n\t * Defines the unique identifier (icon name) of the component.\n\t *\n\t * To browse all available icons, see the\n\t * [SAP Icons](https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html),\n\t * [SAP Fiori Tools](https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html#/overview/SAP-icons-TNT) and\n\t * [SAP Business Suite](https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html)\n\t *\n\t * Example:\n\t * `name='add'`, `name='delete'`, `name='employee'`.\n\t *\n\t * **Note:** To use the SAP Fiori Tools icons,\n\t * you need to set the `tnt` prefix in front of the icon's name.\n\t *\n\t * Example:\n\t * `name='tnt/antenna'`, `name='tnt/actor'`, `name='tnt/api'`.\n\t *\n\t * **Note:** To use the SAP Business Suite icons,\n\t * you need to set the `business-suite` prefix in front of the icon's name.\n\t *\n\t * Example:\n\t * `name='business-suite/3d'`, `name='business-suite/1x2-grid-layout'`, `name='business-suite/4x4-grid-layout'`.\n\t * @default \"\"\n\t * @public\n\t */\n\t@property()\n\tname!: string;\n\n\t/**\n\t * Defines the text alternative of the component.\n\t * If not provided a default text alternative will be set, if present.\n\t *\n\t * **Note:** Every icon should have a text alternative in order to\n\t * calculate its accessible name.\n\t * @default \"\"\n\t * @public\n\t */\n\t@property()\n\taccessibleName!: string;\n\n\t/**\n\t * Defines whether the component should have a tooltip.\n\t *\n\t * **Note:** The tooltip text should be provided via the `accessible-name` property.\n\t * @default false\n\t * @public\n\t */\n\t@property({ type: Boolean })\n\tshowTooltip!: boolean;\n\n\t/**\n\t * Defines the mode of the component.\n\t * @default \"Image\"\n\t * @public\n\t * @since 2.0.0\n\t */\n\t@property({ type: IconMode, defaultValue: IconMode.Image })\n\tmode!: `${IconMode}`;\n\n\t/**\n\t * @private\n\t */\n\t@property({ multiple: true })\n\tpathData!: Array<string>;\n\n\t/**\n\t * @private\n\t */\n\t@property({ type: Object, defaultValue: undefined, noAttribute: true })\n\taccData?: I18nText;\n\n\t/**\n\t* @private\n\t*/\n\t@property({ type: Boolean })\n\tinvalid!: boolean;\n\n\t/**\n\t * @private\n\t */\n\t@property({ noAttribute: true, defaultValue: undefined })\n\teffectiveAccessibleName?: string;\n\n\tltr?: boolean;\n\tpackageName?: string;\n\tviewBox?: string;\n\tcustomSvg?: object;\n\n\t_onkeydown(e: KeyboardEvent) {\n\t\tif (this.mode !== IconMode.Interactive) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (isEnter(e)) {\n\t\t\tthis.fireEvent(\"click\");\n\t\t}\n\n\t\tif (isSpace(e)) {\n\t\t\te.preventDefault(); // prevent scrolling\n\t\t}\n\t}\n\n\t_onkeyup(e: KeyboardEvent) {\n\t\tif (this.mode === IconMode.Interactive && isSpace(e)) {\n\t\t\tthis.fireEvent(\"click\");\n\t\t}\n\t}\n\n\t/**\n\t* Enforce \"ltr\" direction, based on the icons collection metadata.\n\t*/\n\tget _dir() {\n\t\treturn this.ltr ? \"ltr\" : undefined;\n\t}\n\n\tget effectiveAriaHidden() {\n\t\treturn this.mode === IconMode.Decorative ? \"true\" : undefined;\n\t}\n\n\tget _tabIndex() {\n\t\treturn this.mode === IconMode.Interactive ? \"0\" : undefined;\n\t}\n\n\tget effectiveAccessibleRole() {\n\t\tswitch (this.mode) {\n\t\tcase IconMode.Interactive:\n\t\t\treturn \"button\";\n\t\tcase IconMode.Decorative:\n\t\t\treturn \"presentation\";\n\t\tdefault:\n\t\t\treturn \"img\";\n\t\t}\n\t}\n\n\tonEnterDOM() {\n\t\tif (isDesktop()) {\n\t\t\tthis.setAttribute(\"desktop\", \"\");\n\t\t}\n\t}\n\n\tasync onBeforeRendering() {\n\t\tconst name = this.name;\n\t\tif (!name) {\n\t\t\t/* eslint-disable-next-line */\n\t\t\treturn console.warn(\"Icon name property is required\", this);\n\t\t}\n\n\t\tlet iconData: typeof ICON_NOT_FOUND | IconData | undefined = getIconDataSync(name);\n\t\tif (!iconData) {\n\t\t\ticonData = await getIconData(name);\n\t\t}\n\n\t\tif (!iconData) {\n\t\t\tthis.invalid = true;\n\t\t\t/* eslint-disable-next-line */\n\t\t\treturn console.warn(`Required icon is not registered. Invalid icon name: ${this.name}`);\n\t\t}\n\n\t\tif (iconData === ICON_NOT_FOUND) {\n\t\t\tthis.invalid = true;\n\t\t\t/* eslint-disable-next-line */\n\t\t\treturn console.warn(`Required icon is not registered. You can either import the icon as a module in order to use it e.g. \"@ui5/webcomponents-icons/dist/${name.replace(\"sap-icon://\", \"\")}.js\", or setup a JSON build step and import \"@ui5/webcomponents-icons/dist/AllIcons.js\".`);\n\t\t}\n\n\t\tthis.viewBox = iconData.viewBox || \"0 0 512 512\";\n\n\t\tif (iconData.customTemplate) {\n\t\t\ticonData.pathData = [];\n\t\t\tthis.customSvg = executeTemplate(iconData.customTemplate, this);\n\t\t}\n\n\t\t// in case a new valid name is set, show the icon\n\t\tthis.invalid = false;\n\t\tthis.pathData = Array.isArray(iconData.pathData) ? iconData.pathData : [iconData.pathData];\n\t\tthis.accData = iconData.accData;\n\t\tthis.ltr = iconData.ltr;\n\t\tthis.packageName = iconData.packageName;\n\n\t\tif (this.accessibleName) {\n\t\t\tthis.effectiveAccessibleName = this.accessibleName;\n\t\t} else if (this.accData) {\n\t\t\tconst i18nBundle = await getI18nBundle(this.packageName);\n\t\t\tthis.effectiveAccessibleName = i18nBundle.getText(this.accData) || undefined;\n\t\t} else {\n\t\t\tthis.effectiveAccessibleName = undefined;\n\t\t}\n\t}\n\n\tget hasIconTooltip() {\n\t\treturn this.showTooltip && this.effectiveAccessibleName;\n\t}\n}\n\nIcon.define();\n\nexport default Icon;\nexport type {\n\tIIcon,\n};\n"]}

package/dist/Input.d.ts

@@ -19,7 +19,7 @@ import InputType from "./types/InputType.js";
 import Popover from "./Popover.js";
 import type { IIcon } from "./Icon.js";
 import type ListItemType from "./types/ListItemType.js";
-import PopoverHorizontalAlign from "./types/PopoverHorizontalAlign.js";
+import type PopoverHorizontalAlign from "./types/PopoverHorizontalAlign.js";
 import type { ListItemClickEventDetail, ListSelectionChangeEventDetail } from "./List.js";
 /**
  * Interface for components that represent a suggestion item, usable in `ui5-input`

package/dist/Input.js

@@ -32,7 +32,6 @@ import "@ui5/webcomponents-icons/dist/information.js";
 import InputType from "./types/InputType.js";
 import Popover from "./Popover.js";
 import Icon from "./Icon.js";
-import "./types/PopoverHorizontalAlign.js";
 // Templates
 import InputTemplate from "./generated/templates/InputTemplate.lit.js";
 import { StartsWith } from "./Filters.js";