@ui5/webcomponents-fiori 1.17.0 → 1.18.0-rc.1

package/CHANGELOG.md

@@ -3,6 +3,30 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [1.18.0-rc.1](https://github.com/SAP/ui5-webcomponents/compare/v1.18.0-rc.0...v1.18.0-rc.1) (2023-09-21)
+
+
+### Bug Fixes
+
+* **ui5-dialog:** fix background and shadow of slotted ui5-bar ([#7421](https://github.com/SAP/ui5-webcomponents/issues/7421)) ([2746460](https://github.com/SAP/ui5-webcomponents/commit/2746460ebd0d6517e8eedadde30b74e424c17a85)), closes [#7418](https://github.com/SAP/ui5-webcomponents/issues/7418)
+* **ui5-upload-collection-item:** align thumbnail to top ([#7582](https://github.com/SAP/ui5-webcomponents/issues/7582)) ([edeab49](https://github.com/SAP/ui5-webcomponents/commit/edeab49e3f7b63b3aee358983ea1fb9ff586ea3c)), closes [#7551](https://github.com/SAP/ui5-webcomponents/issues/7551)
+* **ui5-upload-collеction:** align buttons to avoid extra space when size is small ([#7491](https://github.com/SAP/ui5-webcomponents/issues/7491)) ([6594cd5](https://github.com/SAP/ui5-webcomponents/commit/6594cd5df91f31f31efc740846670df4a1c1933d))
+
+
+
+
+
+# [1.18.0-rc.0](https://github.com/SAP/ui5-webcomponents/compare/v1.17.0...v1.18.0-rc.0) (2023-09-07)
+
+
+### Bug Fixes
+
+* **ui5-shellbar:** align notification counter ([#7490](https://github.com/SAP/ui5-webcomponents/issues/7490)) ([f8975a6](https://github.com/SAP/ui5-webcomponents/commit/f8975a67f81b62d90db1e508a85c3c894e995e95)), closes [#7208](https://github.com/SAP/ui5-webcomponents/issues/7208)
+
+
+
+
+
 # [1.17.0](https://github.com/SAP/ui5-webcomponents/compare/v1.17.0-rc.2...v1.17.0) (2023-09-01)
 
 **Note:** Version bump only for package @ui5/webcomponents-fiori

package/dist/Bar.d.ts

@@ -52,16 +52,6 @@ declare class Bar extends UI5Element {
     /**
      * Defines the component's design.
      *
-     * <br><br>
-     * <b>Note:</b>
-     * Available options are:
-     * <ul>
-     * <li><code>Header</code></li>
-     * <li><code>Subheader</code></li>
-     * <li><code>Footer</code></li>
-     * <li><code>FloatingFooter</code></li>
-     * </ul>
-     *
      * @type {sap.ui.webc.fiori.types.BarDesign}
      * @name sap.ui.webc.fiori.Bar.prototype.design
      * @defaultvalue "Header"
@@ -69,7 +59,7 @@ declare class Bar extends UI5Element {
      */
     design: `${BarDesign}`;
     /**
-    * Defines the content at the start of the bar
+    * Defines the content at the start of the bar.
     * @type {HTMLElement[]}
     * @name sap.ui.webc.fiori.Bar.prototype.startContent
     * @slot
@@ -77,7 +67,7 @@ declare class Bar extends UI5Element {
     */
     startContent: Array<HTMLElement>;
     /**
-    * Defines the content in the middle of the bar
+    * Defines the content in the middle of the bar.
     * @type {HTMLElement[]}
     * @name sap.ui.webc.fiori.Bar.prototype.default
     * @slot middleContent
@@ -85,7 +75,7 @@ declare class Bar extends UI5Element {
     */
     middleContent: Array<HTMLElement>;
     /**
-    * Defines the content at the end of the bar
+    * Defines the content at the end of the bar.
     * @type {HTMLElement[]}
     * @name sap.ui.webc.fiori.Bar.prototype.endContent
     * @slot

package/dist/Bar.js.map

@@ -1 +1 @@
-{"version":3,"file":"Bar.js","sourceRoot":"","sources":["../src/Bar.ts"],"names":[],"mappings":"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","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot.js\";\nimport litRender from \"@ui5/webcomponents-base/dist/renderer/LitRenderer.js\";\nimport ResizeHandler from \"@ui5/webcomponents-base/dist/delegate/ResizeHandler.js\";\nimport BarDesign from \"./types/BarDesign.js\";\n\n// Template\nimport BarTemplate from \"./generated/templates/BarTemplate.lit.js\";\n\n// Styles\nimport BarCss from \"./generated/themes/Bar.css.js\";\n\n/**\n * @class\n *\n * <h3 class=\"comment-api-title\">Overview</h3>\n * The Bar is a container which is primarily used to hold titles, buttons and input elements\n * and its design and functionality is the basis for page headers and footers.\n * The component consists of three areas to hold its content - startContent slot, default slot and endContent slot.\n * It has the capability to center content, such as a title, while having other components on the left and right side.\n *\n * <h3>Usage</h3>\n * With the use of the design property, you can set the style of the Bar to appear designed like a Header, Subheader, Footer and FloatingFooter.\n * <br>\n * <b>Note:</b> Do not place a Bar inside another Bar or inside any bar-like component. Doing so may cause unpredictable behavior.\n *\n * <h3>Responsive Behavior</h3>\n * The default slot will be centered in the available space between the startContent and the endContent areas,\n * therefore it might not always be centered in the entire bar.\n *\n * <h3>CSS Shadow Parts</h3>\n *\n * <ui5-link target=\"_blank\" href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/::part\">CSS Shadow Parts</ui5-link> allow developers to style elements inside the Shadow DOM.\n * <br>\n * The <code>ui5-bar</code> exposes the following CSS Shadow Parts:\n * <ul>\n * <li>bar - Used to style the wrapper of the content of the component</li>\n * </ul>\n *\n * <h3>Keyboard Handling</h3>\n *\n * <h4>Fast Navigation</h4>\n * This component provides a build in fast navigation group which can be used via <code>F6 / Shift + F6</code> or <code> Ctrl + Alt(Option) + Down /  Ctrl + Alt(Option) + Up</code>.\n * In order to use this functionality, you need to import the following module:\n * <code>import \"@ui5/webcomponents-base/dist/features/F6Navigation.js\"</code>\n * <br><br>\n *\n * <h3>ES6 Module Import</h3>\n *\n * <code>import \"@ui5/webcomponents-fiori/dist/Bar.js\";</code>\n *\n * @constructor\n * @author SAP SE\n * @alias sap.ui.webc.fiori.Bar\n * @implements sap.ui.webc.fiori.IBar\n * @extends sap.ui.webc.base.UI5Element\n * @tagname ui5-bar\n * @public\n * @since 1.0.0-rc.11\n */\n@customElement({\n\ttag: \"ui5-bar\",\n\tfastNavigation: true,\n\trenderer: litRender,\n\tstyles: BarCss,\n\ttemplate: BarTemplate,\n})\nclass Bar extends UI5Element {\n\t/**\n\t * Defines the component's design.\n\t *\n\t * <br><br>\n\t * <b>Note:</b>\n\t * Available options are:\n\t * <ul>\n\t * <li><code>Header</code></li>\n\t * <li><code>Subheader</code></li>\n\t * <li><code>Footer</code></li>\n\t * <li><code>FloatingFooter</code></li>\n\t * </ul>\n\t *\n\t * @type {sap.ui.webc.fiori.types.BarDesign}\n\t * @name sap.ui.webc.fiori.Bar.prototype.design\n\t * @defaultvalue \"Header\"\n\t * @public\n\t */\n\t@property({ type: BarDesign, defaultValue: BarDesign.Header })\n\tdesign!: `${BarDesign}`\n\n\t/**\n\t* Defines the content at the start of the bar\n\t* @type {HTMLElement[]}\n\t* @name sap.ui.webc.fiori.Bar.prototype.startContent\n\t* @slot\n\t* @public\n\t*/\n\t@slot({ type: HTMLElement })\n\tstartContent!: Array<HTMLElement>;\n\n\t/**\n\t* Defines the content in the middle of the bar\n\t* @type {HTMLElement[]}\n\t* @name sap.ui.webc.fiori.Bar.prototype.default\n\t* @slot middleContent\n\t* @public\n\t*/\n\t@slot({ type: HTMLElement, \"default\": true })\n\tmiddleContent!: Array<HTMLElement>\n\n\t/**\n\t* Defines the content at the end of the bar\n\t* @type {HTMLElement[]}\n\t* @name sap.ui.webc.fiori.Bar.prototype.endContent\n\t* @slot\n\t* @public\n\t*/\n\t@slot({ type: HTMLElement })\n\tendContent!: Array<HTMLElement>\n\n\t_handleResizeBound: () => void;\n\n\tget accInfo() {\n\t\treturn {\n\t\t\t\"label\": this.design,\n\t\t};\n\t}\n\n\tconstructor() {\n\t\tsuper();\n\n\t\tthis._handleResizeBound = this.handleResize.bind(this);\n\t}\n\n\thandleResize() {\n\t\tconst bar = this.getDomRef()!;\n\t\tconst barWidth = bar.offsetWidth;\n\t\tconst needShrinked = Array.from(bar.children).some(child => {\n\t\t\treturn (child as HTMLElement).offsetWidth > barWidth / 3;\n\t\t});\n\n\t\tbar.classList.toggle(\"ui5-bar-root-shrinked\", needShrinked);\n\t}\n\n\tget classes() {\n\t\treturn {\n\t\t\troot: {\n\t\t\t\t\"ui5-bar-root\": true,\n\t\t\t},\n\t\t};\n\t}\n\n\tonEnterDOM() {\n\t\tResizeHandler.register(this, this._handleResizeBound);\n\n\t\tthis.getDomRef()!.querySelectorAll(\".ui5-bar-content-container\").forEach(child => {\n\t\t\tResizeHandler.register(child as HTMLElement, this._handleResizeBound);\n\t\t}, this);\n\t}\n\n\tonExitDOM() {\n\t\tResizeHandler.deregister(this, this._handleResizeBound);\n\n\t\tthis.getDomRef()!.querySelectorAll(\".ui5-bar-content-container\").forEach(child => {\n\t\t\tResizeHandler.deregister(child as HTMLElement, this._handleResizeBound);\n\t\t}, this);\n\t }\n}\n\nBar.define();\n\nexport default Bar;\n"]}
+{"version":3,"file":"Bar.js","sourceRoot":"","sources":["../src/Bar.ts"],"names":[],"mappings":"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","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot.js\";\nimport litRender from \"@ui5/webcomponents-base/dist/renderer/LitRenderer.js\";\nimport ResizeHandler from \"@ui5/webcomponents-base/dist/delegate/ResizeHandler.js\";\nimport BarDesign from \"./types/BarDesign.js\";\n\n// Template\nimport BarTemplate from \"./generated/templates/BarTemplate.lit.js\";\n\n// Styles\nimport BarCss from \"./generated/themes/Bar.css.js\";\n\n/**\n * @class\n *\n * <h3 class=\"comment-api-title\">Overview</h3>\n * The Bar is a container which is primarily used to hold titles, buttons and input elements\n * and its design and functionality is the basis for page headers and footers.\n * The component consists of three areas to hold its content - startContent slot, default slot and endContent slot.\n * It has the capability to center content, such as a title, while having other components on the left and right side.\n *\n * <h3>Usage</h3>\n * With the use of the design property, you can set the style of the Bar to appear designed like a Header, Subheader, Footer and FloatingFooter.\n * <br>\n * <b>Note:</b> Do not place a Bar inside another Bar or inside any bar-like component. Doing so may cause unpredictable behavior.\n *\n * <h3>Responsive Behavior</h3>\n * The default slot will be centered in the available space between the startContent and the endContent areas,\n * therefore it might not always be centered in the entire bar.\n *\n * <h3>CSS Shadow Parts</h3>\n *\n * <ui5-link target=\"_blank\" href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/::part\">CSS Shadow Parts</ui5-link> allow developers to style elements inside the Shadow DOM.\n * <br>\n * The <code>ui5-bar</code> exposes the following CSS Shadow Parts:\n * <ul>\n * <li>bar - Used to style the wrapper of the content of the component</li>\n * </ul>\n *\n * <h3>Keyboard Handling</h3>\n *\n * <h4>Fast Navigation</h4>\n * This component provides a build in fast navigation group which can be used via <code>F6 / Shift + F6</code> or <code> Ctrl + Alt(Option) + Down /  Ctrl + Alt(Option) + Up</code>.\n * In order to use this functionality, you need to import the following module:\n * <code>import \"@ui5/webcomponents-base/dist/features/F6Navigation.js\"</code>\n * <br><br>\n *\n * <h3>ES6 Module Import</h3>\n *\n * <code>import \"@ui5/webcomponents-fiori/dist/Bar.js\";</code>\n *\n * @constructor\n * @author SAP SE\n * @alias sap.ui.webc.fiori.Bar\n * @implements sap.ui.webc.fiori.IBar\n * @extends sap.ui.webc.base.UI5Element\n * @tagname ui5-bar\n * @public\n * @since 1.0.0-rc.11\n */\n@customElement({\n\ttag: \"ui5-bar\",\n\tfastNavigation: true,\n\trenderer: litRender,\n\tstyles: BarCss,\n\ttemplate: BarTemplate,\n})\nclass Bar extends UI5Element {\n\t/**\n\t * Defines the component's design.\n\t *\n\t * @type {sap.ui.webc.fiori.types.BarDesign}\n\t * @name sap.ui.webc.fiori.Bar.prototype.design\n\t * @defaultvalue \"Header\"\n\t * @public\n\t */\n\t@property({ type: BarDesign, defaultValue: BarDesign.Header })\n\tdesign!: `${BarDesign}`\n\n\t/**\n\t* Defines the content at the start of the bar.\n\t* @type {HTMLElement[]}\n\t* @name sap.ui.webc.fiori.Bar.prototype.startContent\n\t* @slot\n\t* @public\n\t*/\n\t@slot({ type: HTMLElement })\n\tstartContent!: Array<HTMLElement>;\n\n\t/**\n\t* Defines the content in the middle of the bar.\n\t* @type {HTMLElement[]}\n\t* @name sap.ui.webc.fiori.Bar.prototype.default\n\t* @slot middleContent\n\t* @public\n\t*/\n\t@slot({ type: HTMLElement, \"default\": true })\n\tmiddleContent!: Array<HTMLElement>\n\n\t/**\n\t* Defines the content at the end of the bar.\n\t* @type {HTMLElement[]}\n\t* @name sap.ui.webc.fiori.Bar.prototype.endContent\n\t* @slot\n\t* @public\n\t*/\n\t@slot({ type: HTMLElement })\n\tendContent!: Array<HTMLElement>\n\n\t_handleResizeBound: () => void;\n\n\tget accInfo() {\n\t\treturn {\n\t\t\t\"label\": this.design,\n\t\t};\n\t}\n\n\tconstructor() {\n\t\tsuper();\n\n\t\tthis._handleResizeBound = this.handleResize.bind(this);\n\t}\n\n\thandleResize() {\n\t\tconst bar = this.getDomRef()!;\n\t\tconst barWidth = bar.offsetWidth;\n\t\tconst needShrinked = Array.from(bar.children).some(child => {\n\t\t\treturn (child as HTMLElement).offsetWidth > barWidth / 3;\n\t\t});\n\n\t\tbar.classList.toggle(\"ui5-bar-root-shrinked\", needShrinked);\n\t}\n\n\tget classes() {\n\t\treturn {\n\t\t\troot: {\n\t\t\t\t\"ui5-bar-root\": true,\n\t\t\t},\n\t\t};\n\t}\n\n\tonEnterDOM() {\n\t\tResizeHandler.register(this, this._handleResizeBound);\n\n\t\tthis.getDomRef()!.querySelectorAll(\".ui5-bar-content-container\").forEach(child => {\n\t\t\tResizeHandler.register(child as HTMLElement, this._handleResizeBound);\n\t\t}, this);\n\t}\n\n\tonExitDOM() {\n\t\tResizeHandler.deregister(this, this._handleResizeBound);\n\n\t\tthis.getDomRef()!.querySelectorAll(\".ui5-bar-content-container\").forEach(child => {\n\t\t\tResizeHandler.deregister(child as HTMLElement, this._handleResizeBound);\n\t\t}, this);\n\t }\n}\n\nBar.define();\n\nexport default Bar;\n"]}