From 9a80b8f8b5d8fae9598f221025529dd15227a92c Mon Sep 17 00:00:00 2001 From: ilhan007 Date: Wed, 25 Jun 2025 13:34:55 +0300 Subject: [PATCH 1/4] docs: mark compat/Table as deprecated --- packages/compat/README.md | 9 ++++++--- packages/compat/src/Table.ts | 1 + packages/compat/src/TableCell.ts | 1 + packages/compat/src/TableRow.ts | 1 + .../docs/_components_pages/compat/Table/Table.mdx | 8 ++++---- 5 files changed, 13 insertions(+), 7 deletions(-) diff --git a/packages/compat/README.md b/packages/compat/README.md index 6ae49b8295a1..312d1faae30f 100644 --- a/packages/compat/README.md +++ b/packages/compat/README.md @@ -2,13 +2,16 @@ [![npm Package Version](https://badge.fury.io/js/%40ui5%2Fwebcomponents.svg)](https://www.npmjs.com/package/@ui5/webcomponents) -Provides Table web component for compatibility (previously part of the "@ui5/webcomponents" package), while brand new Table web component is being developed and will replace it in the "@ui5/webcomponents" package. +**DEPRECATED SINCE 2.12.0:** The `@ui5/webcomponents-compat` package has been deprecated as of version `2.12.0`. +Please use the Table from `@ui5/webcomponents` package instead. +While `@ui5/webcomponents-compat` will remain available for compatibility purposes (until the next major release), +migration is strongly recommended, as new development and enhancements will be focused on `@ui5/webcomponents/Table`. -**Note:** The package is available since 2.0 and will be available until the next major release (3.0) when it will be removed as the Table "@ui5/webcomponents" will finally replace it. +## Provided components +The package provides Table web component and several subcomopnents as descrived below. -## Provided components | Web Component | Tag name | Module import | |--------------------------|-----------------------------|------------------------------------------------------------| diff --git a/packages/compat/src/Table.ts b/packages/compat/src/Table.ts index 21b927f97e71..bc8ecbb248ef 100644 --- a/packages/compat/src/Table.ts +++ b/packages/compat/src/Table.ts @@ -168,6 +168,7 @@ enum TableFocusTargetElement { * @constructor * @extends UI5Element * @public + * @deprecated since 2.12.0, use `@ui5/webcomponents/dist/Table.js` instead */ @customElement({ tag: "ui5-table", diff --git a/packages/compat/src/TableCell.ts b/packages/compat/src/TableCell.ts index 4447244b10df..b3c22d6d0281 100644 --- a/packages/compat/src/TableCell.ts +++ b/packages/compat/src/TableCell.ts @@ -25,6 +25,7 @@ import { * @extends UI5Element * @public * @csspart cell - Used to style the native `td` element + * @deprecated since 2.12.0, use `@ui5/webcomponents/dist/TableCell.js` instead */ @customElement({ tag: "ui5-table-cell", diff --git a/packages/compat/src/TableRow.ts b/packages/compat/src/TableRow.ts index ded01076b7be..2deb059bd16b 100644 --- a/packages/compat/src/TableRow.ts +++ b/packages/compat/src/TableRow.ts @@ -62,6 +62,7 @@ type TableRowF7PressEventDetail = { * @public * @csspart row - Used to style the native `tr` element * @csspart popin-row - Used to style the `tr` element when a row pops in + * @deprecated since 2.12.0, use `@ui5/webcomponents/dist/TableRow.js` instead */ @customElement({ tag: "ui5-table-row", diff --git a/packages/website/docs/_components_pages/compat/Table/Table.mdx b/packages/website/docs/_components_pages/compat/Table/Table.mdx index f5e151f3353c..108233d426ec 100644 --- a/packages/website/docs/_components_pages/compat/Table/Table.mdx +++ b/packages/website/docs/_components_pages/compat/Table/Table.mdx @@ -14,10 +14,10 @@ import MultipleSelection from "../../../_samples/compat/Table/MultipleSelection/ import StickyHeader from "../../../_samples/compat/Table/StickyHeader/StickyHeader.md"; :::info -The **@ui5/webcomponents-compat** package is introduced since 2.0 and includes the Table web component -that was previously part of the main **@ui5/webcomponents** package in version 1.x. -It has been replaced by brand new Table web component implementation, availabe since 2.0 in **@ui5/webcomponents** package. -The current one, in **@ui5/webcomponents-compat**, is kept for compatibility. +The **@ui5/webcomponents-compat/Table** web component has been deprecated as of version 2.12.0. +Please use the **@ui5/webcomponents/Table** instead. +While **@ui5/webcomponents-compat/Table** will remain available for compatibility purposes, +migration is strongly recommended, as new development and enhancements will be focused on **@ui5/webcomponents/Table**. ::: <%COMPONENT_OVERVIEW%> From 80feb6f7fdfe8d7aaaff0e7b984e7c6b74781707 Mon Sep 17 00:00:00 2001 From: ilhan007 Date: Fri, 27 Jun 2025 11:00:05 +0300 Subject: [PATCH 2/4] chore: update --- packages/compat/src/Table.ts | 2 +- packages/compat/src/TableCell.ts | 2 +- packages/compat/src/TableColumn.ts | 1 + packages/compat/src/TableGroupRow.ts | 1 + packages/compat/src/TableRow.ts | 2 +- .../website/docs/_components_pages/compat/Table/Table.mdx | 7 ------- 6 files changed, 5 insertions(+), 10 deletions(-) diff --git a/packages/compat/src/Table.ts b/packages/compat/src/Table.ts index bc8ecbb248ef..7a40c4da55d2 100644 --- a/packages/compat/src/Table.ts +++ b/packages/compat/src/Table.ts @@ -168,7 +168,7 @@ enum TableFocusTargetElement { * @constructor * @extends UI5Element * @public - * @deprecated since 2.12.0, use `@ui5/webcomponents/dist/Table.js` instead + * @deprecated deprecated since 2.12.0, it's recommended to use `@ui5/webcomponents/dist/Table.js`, please use `@ui5/webcomponents/dist/Table.js` instead. All future development will focus on this module. */ @customElement({ tag: "ui5-table", diff --git a/packages/compat/src/TableCell.ts b/packages/compat/src/TableCell.ts index b3c22d6d0281..c500c83108fb 100644 --- a/packages/compat/src/TableCell.ts +++ b/packages/compat/src/TableCell.ts @@ -25,7 +25,7 @@ import { * @extends UI5Element * @public * @csspart cell - Used to style the native `td` element - * @deprecated since 2.12.0, use `@ui5/webcomponents/dist/TableCell.js` instead + * @deprecated deprecated since 2.12.0, use `@ui5/webcomponents/dist/TableCell.js` instead */ @customElement({ tag: "ui5-table-cell", diff --git a/packages/compat/src/TableColumn.ts b/packages/compat/src/TableColumn.ts index f036090564f8..4c93f472c774 100644 --- a/packages/compat/src/TableColumn.ts +++ b/packages/compat/src/TableColumn.ts @@ -20,6 +20,7 @@ import tableColumnStyles from "./generated/themes/TableColumn.css.js"; * @public * @slot {Node[]} default - Defines the content of the column header * @csspart column - Used to style the native `th` element + * @deprecated deprecated since 2.12.0, use `@ui5/webcomponents/dist/Table.js` instead */ @customElement({ tag: "ui5-table-column", diff --git a/packages/compat/src/TableGroupRow.ts b/packages/compat/src/TableGroupRow.ts index f66743dd318b..83d25a530970 100644 --- a/packages/compat/src/TableGroupRow.ts +++ b/packages/compat/src/TableGroupRow.ts @@ -32,6 +32,7 @@ import tableGroupRowStyles from "./generated/themes/TableGroupRow.css.js"; * * **Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design. * @csspart group-row - Used to style the native `tr` element + * @deprecated deprecated since 2.12.0, use `@ui5/webcomponents/dist/Table.js` instead */ @customElement({ tag: "ui5-table-group-row", diff --git a/packages/compat/src/TableRow.ts b/packages/compat/src/TableRow.ts index 2deb059bd16b..269119524076 100644 --- a/packages/compat/src/TableRow.ts +++ b/packages/compat/src/TableRow.ts @@ -62,7 +62,7 @@ type TableRowF7PressEventDetail = { * @public * @csspart row - Used to style the native `tr` element * @csspart popin-row - Used to style the `tr` element when a row pops in - * @deprecated since 2.12.0, use `@ui5/webcomponents/dist/TableRow.js` instead + * @deprecated deprecated since 2.12.0, use `@ui5/webcomponents/dist/TableRow.js` instead */ @customElement({ tag: "ui5-table-row", diff --git a/packages/website/docs/_components_pages/compat/Table/Table.mdx b/packages/website/docs/_components_pages/compat/Table/Table.mdx index 108233d426ec..f2ee2ecb6abb 100644 --- a/packages/website/docs/_components_pages/compat/Table/Table.mdx +++ b/packages/website/docs/_components_pages/compat/Table/Table.mdx @@ -13,13 +13,6 @@ import SingleSelection from "../../../_samples/compat/Table/SingleSelection/Sing import MultipleSelection from "../../../_samples/compat/Table/MultipleSelection/MultipleSelection.md"; import StickyHeader from "../../../_samples/compat/Table/StickyHeader/StickyHeader.md"; -:::info -The **@ui5/webcomponents-compat/Table** web component has been deprecated as of version 2.12.0. -Please use the **@ui5/webcomponents/Table** instead. -While **@ui5/webcomponents-compat/Table** will remain available for compatibility purposes, -migration is strongly recommended, as new development and enhancements will be focused on **@ui5/webcomponents/Table**. -::: - <%COMPONENT_OVERVIEW%> ## Basic Sample From 6a211fff716d4b9918f534890a1f4dbd00a589da Mon Sep 17 00:00:00 2001 From: ilhan007 Date: Fri, 27 Jun 2025 12:25:10 +0300 Subject: [PATCH 3/4] chore: update --- packages/compat/src/Table.ts | 2 +- packages/compat/src/TableCell.ts | 2 +- packages/compat/src/TableColumn.ts | 2 +- packages/compat/src/TableGroupRow.ts | 2 +- packages/compat/src/TableRow.ts | 2 +- 5 files changed, 5 insertions(+), 5 deletions(-) diff --git a/packages/compat/src/Table.ts b/packages/compat/src/Table.ts index 7a40c4da55d2..2e62f3c8808d 100644 --- a/packages/compat/src/Table.ts +++ b/packages/compat/src/Table.ts @@ -168,7 +168,7 @@ enum TableFocusTargetElement { * @constructor * @extends UI5Element * @public - * @deprecated deprecated since 2.12.0, it's recommended to use `@ui5/webcomponents/dist/Table.js`, please use `@ui5/webcomponents/dist/Table.js` instead. All future development will focus on this module. + * @deprecated Deprecated as of version 2.12.0, use `@ui5/webcomponents/dist/Table.js` instead. */ @customElement({ tag: "ui5-table", diff --git a/packages/compat/src/TableCell.ts b/packages/compat/src/TableCell.ts index c500c83108fb..c95ec0d61638 100644 --- a/packages/compat/src/TableCell.ts +++ b/packages/compat/src/TableCell.ts @@ -25,7 +25,7 @@ import { * @extends UI5Element * @public * @csspart cell - Used to style the native `td` element - * @deprecated deprecated since 2.12.0, use `@ui5/webcomponents/dist/TableCell.js` instead + * @deprecated Deprecated as of version 2.12.0, use `@ui5/webcomponents/dist/TableCell.js` instead. */ @customElement({ tag: "ui5-table-cell", diff --git a/packages/compat/src/TableColumn.ts b/packages/compat/src/TableColumn.ts index 4c93f472c774..b048b41c95dd 100644 --- a/packages/compat/src/TableColumn.ts +++ b/packages/compat/src/TableColumn.ts @@ -20,7 +20,7 @@ import tableColumnStyles from "./generated/themes/TableColumn.css.js"; * @public * @slot {Node[]} default - Defines the content of the column header * @csspart column - Used to style the native `th` element - * @deprecated deprecated since 2.12.0, use `@ui5/webcomponents/dist/Table.js` instead + * @deprecated Deprecated as of version 2.12.0, use `@ui5/webcomponents/dist/Table.js` instead. */ @customElement({ tag: "ui5-table-column", diff --git a/packages/compat/src/TableGroupRow.ts b/packages/compat/src/TableGroupRow.ts index 83d25a530970..37d1ed77aa02 100644 --- a/packages/compat/src/TableGroupRow.ts +++ b/packages/compat/src/TableGroupRow.ts @@ -32,7 +32,7 @@ import tableGroupRowStyles from "./generated/themes/TableGroupRow.css.js"; * * **Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design. * @csspart group-row - Used to style the native `tr` element - * @deprecated deprecated since 2.12.0, use `@ui5/webcomponents/dist/Table.js` instead + * @deprecated Deprecated as of version since 2.12.0, use `@ui5/webcomponents/dist/Table.js` instead. */ @customElement({ tag: "ui5-table-group-row", diff --git a/packages/compat/src/TableRow.ts b/packages/compat/src/TableRow.ts index 269119524076..57b91d0b5d2f 100644 --- a/packages/compat/src/TableRow.ts +++ b/packages/compat/src/TableRow.ts @@ -62,7 +62,7 @@ type TableRowF7PressEventDetail = { * @public * @csspart row - Used to style the native `tr` element * @csspart popin-row - Used to style the `tr` element when a row pops in - * @deprecated deprecated since 2.12.0, use `@ui5/webcomponents/dist/TableRow.js` instead + * @deprecated Deprecated as of version 2.12.0, use `@ui5/webcomponents/dist/TableRow.js` instead. */ @customElement({ tag: "ui5-table-row", From cea3d2efec401e7cf65306c04e3e12d55ade5685 Mon Sep 17 00:00:00 2001 From: ilhan007 Date: Fri, 27 Jun 2025 15:14:57 +0300 Subject: [PATCH 4/4] chore: update jsdoc --- packages/compat/src/TableGroupRow.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/compat/src/TableGroupRow.ts b/packages/compat/src/TableGroupRow.ts index 37d1ed77aa02..17427419a830 100644 --- a/packages/compat/src/TableGroupRow.ts +++ b/packages/compat/src/TableGroupRow.ts @@ -32,7 +32,7 @@ import tableGroupRowStyles from "./generated/themes/TableGroupRow.css.js"; * * **Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design. * @csspart group-row - Used to style the native `tr` element - * @deprecated Deprecated as of version since 2.12.0, use `@ui5/webcomponents/dist/Table.js` instead. + * @deprecated Deprecated as of version 2.12.0, use `@ui5/webcomponents/dist/Table.js` instead. */ @customElement({ tag: "ui5-table-group-row",