From fe2dfe3a298c880268f9e840dee4e040087a6b65 Mon Sep 17 00:00:00 2001 From: Nayden Naydenov Date: Wed, 26 Aug 2026 11:44:14 +0300 Subject: [PATCH 1/5] chore: replace rc in since tags --- packages/ai/src/ToolbarLabel.ts | 2 +- packages/fiori/src/BarcodeScannerDialog.ts | 2 +- packages/fiori/src/FilterItem.ts | 2 +- packages/fiori/src/FilterItemOption.ts | 2 +- packages/fiori/src/FlexibleColumnLayout.ts | 2 +- packages/fiori/src/IllustratedMessage.ts | 4 +-- .../fiori/src/NotificationListGroupItem.ts | 2 +- packages/fiori/src/NotificationListItem.ts | 4 +-- .../fiori/src/NotificationListItemBase.ts | 4 +-- packages/fiori/src/Page.ts | 2 +- packages/fiori/src/ProductSwitch.ts | 2 +- packages/fiori/src/ProductSwitchItem.ts | 6 ++-- packages/fiori/src/ShellBar.ts | 22 +++++++-------- packages/fiori/src/ShellBarItem.ts | 2 +- packages/fiori/src/SideNavigation.ts | 4 +-- packages/fiori/src/SideNavigationItem.ts | 2 +- packages/fiori/src/SideNavigationSubItem.ts | 2 +- packages/fiori/src/SortItem.ts | 2 +- packages/fiori/src/Timeline.ts | 4 +-- packages/fiori/src/UploadCollection.ts | 4 +-- packages/fiori/src/UploadCollectionItem.ts | 4 +-- packages/fiori/src/ViewSettingsDialog.ts | 6 ++-- packages/fiori/src/Wizard.ts | 4 +-- packages/fiori/src/WizardStep.ts | 6 ++-- packages/fiori/src/WizardTab.ts | 4 +-- .../fiori/src/types/ViewSettingsDialogMode.ts | 4 +-- packages/main/src/Avatar.ts | 8 +++--- packages/main/src/AvatarGroup.ts | 8 +++--- packages/main/src/Bar.ts | 2 +- packages/main/src/Breadcrumbs.ts | 2 +- packages/main/src/BreadcrumbsItem.ts | 2 +- packages/main/src/BusyIndicator.ts | 4 +-- packages/main/src/Button.ts | 6 ++-- packages/main/src/Calendar.ts | 2 +- packages/main/src/Card.ts | 6 ++-- packages/main/src/CardHeader.ts | 2 +- packages/main/src/Carousel.ts | 28 +++++++++---------- packages/main/src/CheckBox.ts | 2 +- packages/main/src/ColorPalette.ts | 12 ++++---- packages/main/src/ColorPaletteItem.ts | 4 +-- packages/main/src/ColorPalettePopover.ts | 4 +-- packages/main/src/ColorPicker.ts | 2 +- packages/main/src/ComboBox.ts | 10 +++---- packages/main/src/ComboBoxItem.ts | 2 +- packages/main/src/ComboBoxItemGroup.ts | 2 +- packages/main/src/DateComponentBase.ts | 6 ++-- packages/main/src/DatePicker.ts | 10 +++---- packages/main/src/DateRangePicker.ts | 2 +- packages/main/src/DateTimePicker.ts | 2 +- packages/main/src/DayPicker.ts | 2 +- packages/main/src/Dialog.ts | 6 ++-- packages/main/src/FileUploader.ts | 4 +-- packages/main/src/Input.ts | 14 +++++----- packages/main/src/Link.ts | 2 +- packages/main/src/List.ts | 18 ++++++------ packages/main/src/ListItem.ts | 2 +- packages/main/src/ListItemBase.ts | 2 +- packages/main/src/ListItemCustom.ts | 2 +- packages/main/src/ListItemStandard.ts | 8 +++--- packages/main/src/MessageStrip.ts | 6 ++-- packages/main/src/MonthPicker.ts | 2 +- packages/main/src/MultiComboBox.ts | 8 +++--- packages/main/src/MultiInput.ts | 2 +- packages/main/src/Option.ts | 2 +- packages/main/src/Panel.ts | 6 ++-- packages/main/src/Popover.ts | 4 +-- packages/main/src/Popup.ts | 4 +-- packages/main/src/ProgressIndicator.ts | 2 +- packages/main/src/RadioButton.ts | 4 +-- packages/main/src/RangeSlider.ts | 2 +- packages/main/src/RatingIndicator.ts | 10 +++---- packages/main/src/ResponsivePopover.ts | 4 +-- packages/main/src/SegmentedButton.ts | 2 +- packages/main/src/SegmentedButtonItem.ts | 2 +- packages/main/src/Select.ts | 8 +++--- packages/main/src/Slider.ts | 2 +- packages/main/src/StepInput.ts | 6 ++-- packages/main/src/SuggestionItem.ts | 2 +- packages/main/src/SuggestionListItem.ts | 2 +- packages/main/src/Switch.ts | 2 +- packages/main/src/Tab.ts | 2 +- packages/main/src/TabContainer.ts | 4 +-- packages/main/src/Table.ts | 2 +- packages/main/src/TableSelectionBase.ts | 2 +- packages/main/src/TableSelectionMulti.ts | 2 +- packages/main/src/TextArea.ts | 12 ++++---- packages/main/src/TimePicker.ts | 4 +-- packages/main/src/Toast.ts | 2 +- packages/main/src/Token.ts | 4 +-- packages/main/src/Tree.ts | 6 ++-- packages/main/src/TreeItem.ts | 4 +-- packages/main/src/TreeItemBase.ts | 6 ++-- packages/main/src/YearPicker.ts | 2 +- .../main/src/types/ButtonAccessibleRole.ts | 2 +- .../main/src/types/TableSelectionBehavior.ts | 2 +- .../TableSelectionMultiHeaderSelector.ts | 2 +- 96 files changed, 216 insertions(+), 216 deletions(-) diff --git a/packages/ai/src/ToolbarLabel.ts b/packages/ai/src/ToolbarLabel.ts index d1224c71bc548..ef70fe307c10f 100644 --- a/packages/ai/src/ToolbarLabel.ts +++ b/packages/ai/src/ToolbarLabel.ts @@ -17,7 +17,7 @@ import ToolbarLabelTemplate from "./ToolbarLabelTemplate.js"; * @constructor * @extends ToolbarItem * @private - * @since 1.0.0-rc.1 + * @since 1.0.0 */ @customElement({ tag: "ui5-ai-toolbar-label", diff --git a/packages/fiori/src/BarcodeScannerDialog.ts b/packages/fiori/src/BarcodeScannerDialog.ts index 0acd3dc3da288..dadbb11438e76 100644 --- a/packages/fiori/src/BarcodeScannerDialog.ts +++ b/packages/fiori/src/BarcodeScannerDialog.ts @@ -73,7 +73,7 @@ type BarcodeScannerDialogScanErrorEventDetail = { * @constructor * @extends UI5Element * @public - * @since 1.0.0-rc.15 + * @since 1.0.0 */ @customElement({ tag: "ui5-barcode-scanner-dialog", diff --git a/packages/fiori/src/FilterItem.ts b/packages/fiori/src/FilterItem.ts index e035fb9b8d4e3..ae826fb451447 100644 --- a/packages/fiori/src/FilterItem.ts +++ b/packages/fiori/src/FilterItem.ts @@ -23,7 +23,7 @@ import type FilterItemOption from "./FilterItemOption.js"; * @constructor * @extends UI5Element * @abstract - * @since 1.0.0-rc.16 + * @since 1.0.0 * @public */ @customElement("ui5-filter-item") diff --git a/packages/fiori/src/FilterItemOption.ts b/packages/fiori/src/FilterItemOption.ts index 67d516c9f2d48..d57749f818b2a 100644 --- a/packages/fiori/src/FilterItemOption.ts +++ b/packages/fiori/src/FilterItemOption.ts @@ -21,7 +21,7 @@ import customElement from "@ui5/webcomponents-base/dist/decorators/customElement * @constructor * @extends UI5Element * @abstract - * @since 1.0.0-rc.16 + * @since 1.0.0 * @public */ @customElement("ui5-filter-item-option") diff --git a/packages/fiori/src/FlexibleColumnLayout.ts b/packages/fiori/src/FlexibleColumnLayout.ts index 5ac03a61d396d..4732ca7be1930 100644 --- a/packages/fiori/src/FlexibleColumnLayout.ts +++ b/packages/fiori/src/FlexibleColumnLayout.ts @@ -179,7 +179,7 @@ type FCLAccessibilityAttributes = { * @constructor * @extends UI5Element * @public - * @since 1.0.0-rc.8 + * @since 1.0.0 */ @customElement({ tag: "ui5-flexible-column-layout", diff --git a/packages/fiori/src/IllustratedMessage.ts b/packages/fiori/src/IllustratedMessage.ts index 9453c84c6c1ee..2594034e0e0e1 100644 --- a/packages/fiori/src/IllustratedMessage.ts +++ b/packages/fiori/src/IllustratedMessage.ts @@ -75,7 +75,7 @@ const getEffectiveIllustrationName = (name: string): string => { * @constructor * @extends UI5Element * @public - * @since 1.0.0-rc.15 + * @since 1.0.0 */ @customElement({ @@ -257,7 +257,7 @@ class IllustratedMessage extends UI5Element { * * **Note:** Using this slot, the default subtitle text of illustration and the value of `subtitleText` property will be overwritten. * @public - * @since 1.0.0-rc.16 + * @since 1.0.0 */ @slot({ type: HTMLElement }) subtitle!: Slot; diff --git a/packages/fiori/src/NotificationListGroupItem.ts b/packages/fiori/src/NotificationListGroupItem.ts index cad99a7c58ffb..24cbb9cbf3bfa 100644 --- a/packages/fiori/src/NotificationListGroupItem.ts +++ b/packages/fiori/src/NotificationListGroupItem.ts @@ -65,7 +65,7 @@ type NotificationListGroupItemToggleEventDetail = { * `import "@ui5/webcomponents-fiori/dist/NotificationListGroupItem.js";` * @constructor * @extends NotificationListItemBase - * @since 1.0.0-rc.8 + * @since 1.0.0 * @public */ @customElement({ diff --git a/packages/fiori/src/NotificationListItem.ts b/packages/fiori/src/NotificationListItem.ts index d41f736804163..48bc15b55b081 100644 --- a/packages/fiori/src/NotificationListItem.ts +++ b/packages/fiori/src/NotificationListItem.ts @@ -127,7 +127,7 @@ const ICON_PER_STATUS_DESIGN = { * * @constructor * @extends NotificationListItemBase - * @since 1.0.0-rc.8 + * @since 1.0.0 * @public * @csspart title-text - Used to style the titleText of the notification list item */ @@ -187,7 +187,7 @@ class NotificationListItem extends NotificationListItemBase { * and a `ShowMore/Less` button would be displayed. * @default "None" * @public - * @since 1.0.0-rc.15 + * @since 1.0.0 */ @property() wrappingType: `${WrappingType}` = "None"; diff --git a/packages/fiori/src/NotificationListItemBase.ts b/packages/fiori/src/NotificationListItemBase.ts index a01f5bdf52df4..a765cc5dfd7a3 100644 --- a/packages/fiori/src/NotificationListItemBase.ts +++ b/packages/fiori/src/NotificationListItemBase.ts @@ -19,7 +19,7 @@ import { * The base class of the `NotificationListItem` and `NotificationListGroupItem`. * @constructor * @extends ListItemBase - * @since 1.0.0-rc.8 + * @since 1.0.0 * @public */ @customElement({}) @@ -48,7 +48,7 @@ class NotificationListItemBase extends ListItemBase { * Defines if a busy indicator would be displayed over the item. * @default false * @public - * @since 1.0.0-rc.8 + * @since 1.0.0 */ @property({ type: Boolean }) loading = false; diff --git a/packages/fiori/src/Page.ts b/packages/fiori/src/Page.ts index ded8dec4026d2..31f6fcab7078a 100644 --- a/packages/fiori/src/Page.ts +++ b/packages/fiori/src/Page.ts @@ -39,7 +39,7 @@ import PageCss from "./generated/themes/Page.css.js"; * `import "@ui5/webcomponents-fiori/dist/Page.js";` * @constructor * @extends UI5Element - * @since 1.0.0-rc.12 + * @since 1.0.0 * @public * @csspart content - Used to style the content section of the component */ diff --git a/packages/fiori/src/ProductSwitch.ts b/packages/fiori/src/ProductSwitch.ts index a84ae46ab27e9..d5b9fc853b1ca 100644 --- a/packages/fiori/src/ProductSwitch.ts +++ b/packages/fiori/src/ProductSwitch.ts @@ -61,7 +61,7 @@ interface IProductSwitchItem extends HTMLElement, ITabbable { * @constructor * @extends UI5Element * @public - * @since 1.0.0-rc.5 + * @since 1.0.0 */ @customElement({ tag: "ui5-product-switch", diff --git a/packages/fiori/src/ProductSwitchItem.ts b/packages/fiori/src/ProductSwitchItem.ts index 0d1d79dd34bde..e6ea75d08781e 100644 --- a/packages/fiori/src/ProductSwitchItem.ts +++ b/packages/fiori/src/ProductSwitchItem.ts @@ -34,7 +34,7 @@ import ProductSwitchItemCss from "./generated/themes/ProductSwitchItem.css.js"; * @extends UI5Element * @public * @implements {IProductSwitchItem} - * @since 1.0.0-rc.5 + * @since 1.0.0 */ @customElement({ tag: "ui5-product-switch-item", @@ -61,7 +61,7 @@ class ProductSwitchItem extends UI5Element implements IProductSwitchItem { /** * Defines the title of the component. * @default undefined - * @since 1.0.0-rc.15 + * @since 1.0.0 * @public */ @property() @@ -70,7 +70,7 @@ class ProductSwitchItem extends UI5Element implements IProductSwitchItem { /** * Defines the subtitle of the component. * @default undefined - * @since 1.0.0-rc.15 + * @since 1.0.0 * @public */ @property() diff --git a/packages/fiori/src/ShellBar.ts b/packages/fiori/src/ShellBar.ts index 3bf8a17ac653a..b54e795a65bb6 100644 --- a/packages/fiori/src/ShellBar.ts +++ b/packages/fiori/src/ShellBar.ts @@ -178,7 +178,7 @@ type ShellBarSearchFieldClearEventDetail = { * @constructor * @extends UI5Element * @public - * @since 0.8.0 + * @since 1.0.0 */ @customElement({ @@ -236,7 +236,7 @@ type ShellBarSearchFieldClearEventDetail = { /** * Fired, when the logo is activated. * @param {HTMLElement} targetRef dom ref of the activated element - * @since 0.10 + * @since 1.0.0 * @public */ @event("logo-click", { @@ -248,7 +248,7 @@ type ShellBarSearchFieldClearEventDetail = { * * **Note:** You can prevent closing of overflow popover by calling `event.preventDefault()`. * @param {HTMLElement} item DOM ref of the activated list item - * @since 0.10 + * @since 1.0.0 * @public */ @event("menu-item-click", { @@ -387,7 +387,7 @@ class ShellBar extends UI5Element { * * **Note:** We recommend not using the `size` attribute of `ui5-avatar` because * it should have specific size by design in the context of `ui5-shellbar` profile. - * @since 1.0.0-rc.6 + * @since 1.0.0 * @public */ @slot() @@ -601,7 +601,7 @@ class ShellBar extends UI5Element { /** * Defines the logo of the `ui5-shellbar`. * For example, you can use `ui5-avatar` or `img` elements as logo. - * @since 1.0.0-rc.8 + * @since 1.0.0 * @public */ @slot() @@ -611,7 +611,7 @@ class ShellBar extends UI5Element { * Defines the items displayed in menu after a click on a start button. * * **Note:** You can use the `` and its ancestors. - * @since 0.10 + * @since 1.0.0 * @public */ @slot() @@ -1131,7 +1131,7 @@ class ShellBar extends UI5Element { * Returns the `logo` DOM ref. * @public * @default null - * @since 1.0.0-rc.16 + * @since 1.0.0 */ get logoDomRef(): HTMLElement | null { return this.shadowRoot!.querySelector(`*[data-ui5-stable="logo"]`); @@ -1141,7 +1141,7 @@ class ShellBar extends UI5Element { * Returns the `notifications` icon DOM ref. * @public * @default null - * @since 1.0.0-rc.16 + * @since 1.0.0 */ get notificationsDomRef(): HTMLElement | null { if (this.isHidden(ShellBarActions.Notifications)) { @@ -1154,7 +1154,7 @@ class ShellBar extends UI5Element { * Returns the `overflow` icon DOM ref. * @public * @default null - * @since 1.0.0-rc.16 + * @since 1.0.0 */ get overflowDomRef(): HTMLElement | null { return this.shadowRoot!.querySelector(`*[data-ui5-stable="overflow"]`); @@ -1164,7 +1164,7 @@ class ShellBar extends UI5Element { * Returns the `profile` icon DOM ref. * @public * @default null - * @since 1.0.0-rc.16 + * @since 1.0.0 */ get profileDomRef(): HTMLElement | null { return this.shadowRoot!.querySelector(`*[data-ui5-stable="profile"]`); @@ -1174,7 +1174,7 @@ class ShellBar extends UI5Element { * Returns the `product-switch` icon DOM ref. * @public * @default null - * @since 1.0.0-rc.16 + * @since 1.0.0 */ get productSwitchDomRef(): HTMLElement | null { return this.shadowRoot!.querySelector(`*[data-ui5-stable="product-switch"]`); diff --git a/packages/fiori/src/ShellBarItem.ts b/packages/fiori/src/ShellBarItem.ts index 0707b2141b2b3..6480c8d0797d5 100644 --- a/packages/fiori/src/ShellBarItem.ts +++ b/packages/fiori/src/ShellBarItem.ts @@ -69,7 +69,7 @@ class ShellBarItem extends UI5Element { /** * Defines the count displayed in badge. * @default undefined - * @since 1.0.0-rc.6 + * @since 1.0.0 * @public */ @property() diff --git a/packages/fiori/src/SideNavigation.ts b/packages/fiori/src/SideNavigation.ts index 56c2c82ce824c..9538387870876 100644 --- a/packages/fiori/src/SideNavigation.ts +++ b/packages/fiori/src/SideNavigation.ts @@ -107,7 +107,7 @@ type PopupSideNavigationItem = SideNavigationItem & { associatedItem: SideNaviga * `import "@ui5/webcomponents-fiori/dist/SideNavigationSubItem.js";` (for `ui5-side-navigation-sub-item`) * @constructor * @extends UI5Element - * @since 1.0.0-rc.8 + * @since 1.0.0 * @public */ @@ -214,7 +214,7 @@ class SideNavigation extends UI5Element { * **Note:** The header is displayed when the component is expanded - the property `collapsed` is false; * * @public - * @since 1.0.0-rc.11 + * @since 1.0.0 */ @slot() header!: Slot; diff --git a/packages/fiori/src/SideNavigationItem.ts b/packages/fiori/src/SideNavigationItem.ts index 078b11afe063e..74c99df666af6 100644 --- a/packages/fiori/src/SideNavigationItem.ts +++ b/packages/fiori/src/SideNavigationItem.ts @@ -46,7 +46,7 @@ import createInstanceChecker from "@ui5/webcomponents-base/dist/util/createInsta * @extends SideNavigationSelectableItemBase * @abstract * @public - * @since 1.0.0-rc.8 + * @since 1.0.0 */ @customElement({ tag: "ui5-side-navigation-item", diff --git a/packages/fiori/src/SideNavigationSubItem.ts b/packages/fiori/src/SideNavigationSubItem.ts index eb33f39ef86d7..b3430c49dfd72 100644 --- a/packages/fiori/src/SideNavigationSubItem.ts +++ b/packages/fiori/src/SideNavigationSubItem.ts @@ -24,7 +24,7 @@ import SideNavigationSubItemCss from "./generated/themes/SideNavigationSubItem.c * @extends SideNavigationSelectableItemBase * @public * @abstract - * @since 1.0.0-rc.8 + * @since 1.0.0 */ @customElement({ tag: "ui5-side-navigation-sub-item", diff --git a/packages/fiori/src/SortItem.ts b/packages/fiori/src/SortItem.ts index d9d04f6768014..75ed73ba22bd0 100644 --- a/packages/fiori/src/SortItem.ts +++ b/packages/fiori/src/SortItem.ts @@ -21,7 +21,7 @@ import customElement from "@ui5/webcomponents-base/dist/decorators/customElement * @constructor * @extends UI5Element * @abstract - * @since 1.0.0-rc.16 + * @since 1.0.0 * @public */ @customElement("ui5-sort-item") diff --git a/packages/fiori/src/Timeline.ts b/packages/fiori/src/Timeline.ts index 11b23a24aeea9..710dfae2a19d6 100644 --- a/packages/fiori/src/Timeline.ts +++ b/packages/fiori/src/Timeline.ts @@ -90,7 +90,7 @@ const GROWING_WITH_SCROLL_DEBOUNCE_RATE = 250; // ms * @constructor * @extends UI5Element * @public - * @since 0.8.0 + * @since 1.0.0 */ @customElement({ tag: "ui5-timeline", @@ -118,7 +118,7 @@ class Timeline extends UI5Element { /** * Defines the items orientation. * @default "Vertical" - * @since 1.0.0-rc.15 + * @since 1.0.0 * @public */ @property() diff --git a/packages/fiori/src/UploadCollection.ts b/packages/fiori/src/UploadCollection.ts index 24b0704e80641..ad31cd1ac5893 100644 --- a/packages/fiori/src/UploadCollection.ts +++ b/packages/fiori/src/UploadCollection.ts @@ -56,7 +56,7 @@ type UploadCollectionItemDeleteEventDetail = { * @constructor * @extends UI5Element * @public - * @since 1.0.0-rc.7 + * @since 1.0.0 */ @customElement({ tag: "ui5-upload-collection", @@ -150,7 +150,7 @@ class UploadCollection extends UI5Element { * Defines the accessible ARIA name of the component. * @default undefined * @public - * @since 1.0.0-rc.16 + * @since 1.0.0 */ @property() accessibleName?: string; diff --git a/packages/fiori/src/UploadCollectionItem.ts b/packages/fiori/src/UploadCollectionItem.ts index e1393b6d1ca5b..b05d35d5ee7cf 100644 --- a/packages/fiori/src/UploadCollectionItem.ts +++ b/packages/fiori/src/UploadCollectionItem.ts @@ -54,7 +54,7 @@ import type { Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; * @extends ListItem * @public * @slot {Node[]} default - Hold the description of the `ui5-upload-collection-item`. Will be shown below the file name. - * @since 1.0.0-rc.7 + * @since 1.0.0 */ @customElement({ tag: "ui5-upload-collection-item", @@ -106,7 +106,7 @@ import type { Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; }) /** - * @since 1.0.0-rc.8 + * @since 1.0.0 * @private */ @event("focus-requested", { diff --git a/packages/fiori/src/ViewSettingsDialog.ts b/packages/fiori/src/ViewSettingsDialog.ts index 7f4d5f7f90d90..197230c43a10d 100644 --- a/packages/fiori/src/ViewSettingsDialog.ts +++ b/packages/fiori/src/ViewSettingsDialog.ts @@ -119,7 +119,7 @@ type ViewSettingsDialogInternalMode = `${ViewSettingsDialogMode}` | ViewSettings * `import "@ui5/webcomponents-fiori/dist/ViewSettingsDialog.js";` * @constructor * @extends UI5Element - * @since 1.0.0-rc.16 + * @since 1.0.0 * @public * @csspart header - Used to style the header. */ @@ -292,7 +292,7 @@ class ViewSettingsDialog extends UI5Element { /** * Defnies the current mode of the component. - * @since 1.0.0-rc.16 + * @since 1.0.0 * @private */ @property({ noAttribute: true }) @@ -300,7 +300,7 @@ class ViewSettingsDialog extends UI5Element { /** * When in Filter By mode, defines whether we need to show the list of keys, or the list with values. - * @since 1.0.0-rc.16 + * @since 1.0.0 * @private */ @property({ type: Boolean, noAttribute: true }) diff --git a/packages/fiori/src/Wizard.ts b/packages/fiori/src/Wizard.ts index af7dd5a0377ce..79eb517a548d1 100644 --- a/packages/fiori/src/Wizard.ts +++ b/packages/fiori/src/Wizard.ts @@ -169,7 +169,7 @@ type StepInfo = { * `import "@ui5/webcomponents-fiori/dist/Wizard.js";` (includes ) * @constructor * @extends UI5Element - * @since 1.0.0-rc.10 + * @since 1.0.0 * @public * @csspart navigator - Used to style the progress navigator of the `ui5-wizard`. * @csspart step-content - Used to style a `ui5-wizard-step` container. @@ -248,7 +248,7 @@ class Wizard extends UI5Element { * and values out of the range will be normalized to 0.5 and 1 respectively. * @private * @default 0.7 - * @since 1.0.0-rc.13 + * @since 1.0.0 */ @property({ type: Number }) stepSwitchThreshold = STEP_SWITCH_THRESHOLDS.DEFAULT; diff --git a/packages/fiori/src/WizardStep.ts b/packages/fiori/src/WizardStep.ts index 8864dde061d56..6ebd3c6fb2706 100644 --- a/packages/fiori/src/WizardStep.ts +++ b/packages/fiori/src/WizardStep.ts @@ -23,7 +23,7 @@ import property from "@ui5/webcomponents-base/dist/decorators/property.js"; * @constructor * @extends UI5Element * @abstract - * @since 1.0.0-rc.10 + * @since 1.0.0 * @public * @slot {Node[]} default - Defines the step content. */ @@ -36,7 +36,7 @@ class WizardStep extends UI5Element { * **Note:** The text is displayed in the `ui5-wizard` navigation header. * @default undefined * @public - * @since 1.0.0-rc.15 + * @since 1.0.0 */ @property() titleText?: string @@ -47,7 +47,7 @@ class WizardStep extends UI5Element { * **Note:** the text is displayed in the `ui5-wizard` navigation header. * @default undefined * @public - * @since 1.0.0-rc.15 + * @since 1.0.0 */ @property() subtitleText?: string diff --git a/packages/fiori/src/WizardTab.ts b/packages/fiori/src/WizardTab.ts index 784570b03465d..d26c229dd5a24 100644 --- a/packages/fiori/src/WizardTab.ts +++ b/packages/fiori/src/WizardTab.ts @@ -66,7 +66,7 @@ class WizardTab extends UI5Element implements ITabbable { * Defines the `titleText` of the step. * @default undefined * @private - * @since 1.0.0-rc.15 + * @since 1.0.0 */ @property() titleText?: string @@ -75,7 +75,7 @@ class WizardTab extends UI5Element implements ITabbable { * Defines the `subtitleText` of the step. * @default undefined * @private - * @since 1.0.0-rc.15 + * @since 1.0.0 */ @property() subtitleText?: string diff --git a/packages/fiori/src/types/ViewSettingsDialogMode.ts b/packages/fiori/src/types/ViewSettingsDialogMode.ts index 5631bc97a6d9c..ef34f2fdd0cc4 100644 --- a/packages/fiori/src/types/ViewSettingsDialogMode.ts +++ b/packages/fiori/src/types/ViewSettingsDialogMode.ts @@ -5,14 +5,14 @@ enum ViewSettingsDialogMode { /** * Default type - * @since 1.0.0-rc.16 + * @since 1.0.0 * @public */ Sort = "Sort", /** * Filter type - * @since 1.0.0-rc.16 + * @since 1.0.0 * @public */ Filter = "Filter", diff --git a/packages/main/src/Avatar.ts b/packages/main/src/Avatar.ts index 07c62f72ed79b..6d4d2192968d7 100644 --- a/packages/main/src/Avatar.ts +++ b/packages/main/src/Avatar.ts @@ -57,7 +57,7 @@ type AvatarAccessibilityAttributes = Pick; * `import "@ui5/webcomponents/dist/Avatar.js";` * @constructor * @extends UI5Element - * @since 1.0.0-rc.6 + * @since 1.0.0 * @implements {IAvatarGroupItem} * @public */ @@ -120,7 +120,7 @@ class Avatar extends UI5Element implements ITabbable, IAvatarGroupItem { * In that case, the avatar will always be rendered as interactive. * @default "Image" * @public - * @since 2.20 + * @since 2.20.0 */ @property() mode: `${AvatarMode}` = "Image"; @@ -214,7 +214,7 @@ class Avatar extends UI5Element implements ITabbable, IAvatarGroupItem { * If not provided a default text alternative will be set, if present. * @default undefined * @public - * @since 1.0.0-rc.7 + * @since 1.0.0 */ @property() accessibleName?: string; @@ -256,7 +256,7 @@ class Avatar extends UI5Element implements ITabbable, IAvatarGroupItem { *     `visibility: hidden;`
* `}` * @public - * @since 1.0.0-rc.15 + * @since 1.0.0 */ @slot({ type: HTMLElement, "default": true }) image!: DefaultSlot; diff --git a/packages/main/src/AvatarGroup.ts b/packages/main/src/AvatarGroup.ts index 7804a6d60844f..0f55a91300476 100644 --- a/packages/main/src/AvatarGroup.ts +++ b/packages/main/src/AvatarGroup.ts @@ -142,7 +142,7 @@ type AvatarGroupClickEventDetail = { * - [Space] / [Enter] or [Return] - Trigger `ui5-click` event * @constructor * @extends UI5Element - * @since 1.0.0-rc.11 + * @since 1.0.0 * @public */ @@ -158,7 +158,7 @@ type AvatarGroupClickEventDetail = { * @param {HTMLElement} targetRef The DOM ref of the clicked item. * @param {boolean} overflowButtonClicked indicates if the overflow button is clicked * @public - * @since 1.0.0-rc.11 + * @since 1.0.0 */ @event("click") @@ -166,7 +166,7 @@ type AvatarGroupClickEventDetail = { * Fired when the count of visible `ui5-avatar` elements in the * component has changed * @public - * @since 1.0.0-rc.13 + * @since 1.0.0 */ @event("overflow") class AvatarGroup extends UI5Element { @@ -247,7 +247,7 @@ class AvatarGroup extends UI5Element { * * **Note:** If this slot is not used, the component will display the built-in overflow button. * @public - * @since 1.0.0-rc.13 + * @since 1.0.0 */ @slot() overflowButton!: Slot; diff --git a/packages/main/src/Bar.ts b/packages/main/src/Bar.ts index fc6b293e5fd1b..1f7607c81d061 100644 --- a/packages/main/src/Bar.ts +++ b/packages/main/src/Bar.ts @@ -51,7 +51,7 @@ import type { AriaRole } from "@ui5/webcomponents-base/dist/types.js"; * @constructor * @extends UI5Element * @public - * @since 1.0.0-rc.11 + * @since 1.0.0 */ @customElement({ tag: "ui5-bar", diff --git a/packages/main/src/Breadcrumbs.ts b/packages/main/src/Breadcrumbs.ts index b92bd2bb08a72..778ebc858c34b 100644 --- a/packages/main/src/Breadcrumbs.ts +++ b/packages/main/src/Breadcrumbs.ts @@ -87,7 +87,7 @@ type FocusAdaptor = ITabbable & { * @extends UI5Element * @implements {IToolbarItemContent} * @public - * @since 1.0.0-rc.15 + * @since 1.0.0 */ @customElement({ tag: "ui5-breadcrumbs", diff --git a/packages/main/src/BreadcrumbsItem.ts b/packages/main/src/BreadcrumbsItem.ts index 9cccf9dd35fa0..dbe102a841fcc 100644 --- a/packages/main/src/BreadcrumbsItem.ts +++ b/packages/main/src/BreadcrumbsItem.ts @@ -23,7 +23,7 @@ type BreadcrumbsItemClickEventDetail = { * @constructor * @extends UI5Element * @public - * @since 1.0.0-rc.15 + * @since 1.0.0 * @abstract */ @customElement("ui5-breadcrumbs-item") diff --git a/packages/main/src/BusyIndicator.ts b/packages/main/src/BusyIndicator.ts index 736e3e925d77c..8b7db454861e1 100644 --- a/packages/main/src/BusyIndicator.ts +++ b/packages/main/src/BusyIndicator.ts @@ -57,7 +57,7 @@ import busyIndicatorCss from "./generated/themes/BusyIndicator.css.js"; * @extends UI5Element * @public * @slot {Array} default - Determines the content over which the component will appear. - * @since 0.12.0 + * @since 1.0.0 */ @customElement({ tag: "ui5-busy-indicator", @@ -71,7 +71,7 @@ class BusyIndicator extends UI5Element { * Defines text to be displayed below the component. It can be used to inform the user of the current operation. * @public * @default undefined - * @since 1.0.0-rc.7 + * @since 1.0.0 */ @property() text?: string; diff --git a/packages/main/src/Button.ts b/packages/main/src/Button.ts index e880b19bc5ad8..7d8a2ab07e0a1 100644 --- a/packages/main/src/Button.ts +++ b/packages/main/src/Button.ts @@ -232,7 +232,7 @@ class Button extends UI5Element implements IButton { * Defines the accessible ARIA name of the component. * @default undefined * @public - * @since 1.0.0-rc.15 + * @since 1.0.0 */ @property() accessibleName?: string; @@ -298,7 +298,7 @@ class Button extends UI5Element implements IButton { * * @default "Button" * @public - * @since 1.23 + * @since 1.23.0 */ @property() accessibleRole: `${ButtonAccessibleRole}` = "Button"; @@ -380,7 +380,7 @@ class Button extends UI5Element implements IButton { forcedTabIndex = "0"; /** - * @since 1.0.0-rc.13 + * @since 1.0.0 * @private */ @property({ type: Boolean }) diff --git a/packages/main/src/Calendar.ts b/packages/main/src/Calendar.ts index 06cd361ae13e0..c27f7d6141fb3 100644 --- a/packages/main/src/Calendar.ts +++ b/packages/main/src/Calendar.ts @@ -224,7 +224,7 @@ type DisabledDateRangeT = { * @csspart year-range-picker-root - Used to style the year range picker root container. * @csspart calendar-header-middle-button - Used to style the calendar header middle buttons (month/year/year-range buttons). * @csspart calendar-header-arrow-button - Used to style the calendar header navigation arrow buttons (previous/next buttons). - * @since 1.0.0-rc.11 + * @since 1.0.0 */ @customElement({ tag: "ui5-calendar", diff --git a/packages/main/src/Card.ts b/packages/main/src/Card.ts index b5b40de43ad17..292e6b165f1fe 100644 --- a/packages/main/src/Card.ts +++ b/packages/main/src/Card.ts @@ -54,7 +54,7 @@ class Card extends UI5Element { * **Note:** `accessibleName` should be always set, unless `accessibleNameRef` is set. * @default undefined * @public - * @since 1.0.0-rc.16 + * @since 1.0.0 */ @property() accessibleName?: string; @@ -63,7 +63,7 @@ class Card extends UI5Element { * Defines the IDs of the elements that label the component. * @default undefined * @public - * @since 1.0.0-rc.16 + * @since 1.0.0 */ @property() accessibleNameRef?: string; @@ -79,7 +79,7 @@ class Card extends UI5Element { * Defines the header of the component. * * **Note:** Use `ui5-card-header` for the intended design. - * @since 1.0.0-rc.15 + * @since 1.0.0 * @public */ @slot({ type: HTMLElement, invalidateOnChildChange: true }) diff --git a/packages/main/src/CardHeader.ts b/packages/main/src/CardHeader.ts index dea46d4467f5f..7261f1781ac47 100644 --- a/packages/main/src/CardHeader.ts +++ b/packages/main/src/CardHeader.ts @@ -37,7 +37,7 @@ import cardHeaderCss from "./generated/themes/CardHeader.css.js"; * @constructor * @extends UI5Element * @public - * @since 1.0.0-rc.15 + * @since 1.0.0 * @csspart root - Used to style the root DOM element of the CardHeader * @csspart title - Used to style the title of the CardHeader * @csspart subtitle - Used to style the subtitle of the CardHeader diff --git a/packages/main/src/Carousel.ts b/packages/main/src/Carousel.ts index 261cba06d25a0..296a570ba174b 100644 --- a/packages/main/src/Carousel.ts +++ b/packages/main/src/Carousel.ts @@ -117,7 +117,7 @@ type ItemsInfo = { * `import "@ui5/webcomponents/dist/Carousel.js";` * @constructor * @extends UI5Element - * @since 1.0.0-rc.6 + * @since 1.0.0 * @public * @csspart content - Used to style the content of the component */ @@ -135,7 +135,7 @@ type ItemsInfo = { * based on the `items-per-page` property. * @param {Integer} selectedIndex the current selected index * @public - * @since 1.0.0-rc.7 + * @since 1.0.0 */ @event("navigate", { bubbles: true, @@ -149,7 +149,7 @@ class Carousel extends UI5Element { * Defines the accessible name of the component. * @default undefined * @public - * @since 1.24 + * @since 1.24.0 */ @property() accessibleName?: string; @@ -158,7 +158,7 @@ class Carousel extends UI5Element { * Defines the IDs of the elements that label the input. * @default undefined * @public - * @since 1.24 + * @since 1.24.0 */ @property() accessibleNameRef?: string; @@ -190,7 +190,7 @@ class Carousel extends UI5Element { * Defines the visibility of the navigation arrows. * If set to true the navigation arrows will be hidden. * - * @since 1.0.0-rc.15 + * @since 1.0.0 * @default false * @public */ @@ -200,7 +200,7 @@ class Carousel extends UI5Element { /** * Defines the visibility of the page indicator. * If set to true the page indicator will be hidden. - * @since 1.0.0-rc.15 + * @since 1.0.0 * @default false * @public */ @@ -213,7 +213,7 @@ class Carousel extends UI5Element { * * - `Default` - The page indicator will be visualized as dots if there are fewer than 9 pages. If there are more pages, the page indicator will switch to displaying the current page and the total number of pages. (e.g. X of Y) * - `Numeric` - The page indicator will display the current page and the total number of pages. (e.g. X of Y) - * @since 1.10 + * @since 1.10.0 * @default "Default" * @public */ @@ -222,7 +222,7 @@ class Carousel extends UI5Element { /** * Defines the carousel's background design. - * @since 1.14 + * @since 1.14.0 * @default "Translucent" * @public */ @@ -231,7 +231,7 @@ class Carousel extends UI5Element { /** * Defines the page indicator background design. - * @since 1.14 + * @since 1.14.0 * @default "Solid" * @public */ @@ -240,7 +240,7 @@ class Carousel extends UI5Element { /** * Defines the page indicator border design. - * @since 1.14 + * @since 1.14.0 * @default "Solid" * @public */ @@ -285,7 +285,7 @@ class Carousel extends UI5Element { /** * If set to true navigation arrows are shown. * @private - * @since 1.0.0-rc.15 + * @since 1.0.0 */ @property({ type: Boolean, noAttribute: true }) _visibleNavigationArrows = false; @@ -301,7 +301,7 @@ class Carousel extends UI5Element { /** * Defines the current page index, which determines the first visible item. * @private - * @since 2.16.0-r.c1 + * @since 2.16.0 */ @property({ type: Number, noAttribute: true }) _currentPageIndex: number = 0; @@ -675,7 +675,7 @@ class Carousel extends UI5Element { /** * Changes the currently displayed page. * @param itemIndex The index of the target item - * @since 1.0.0-rc.15 + * @since 1.0.0 * @public */ navigateTo(itemIndex: number): void { @@ -725,7 +725,7 @@ class Carousel extends UI5Element { /** * The indices of the currently visible items of the component. * @public - * @since 1.0.0-rc.15 + * @since 1.0.0 * @default [] */ get visibleItemsIndices() : Array { diff --git a/packages/main/src/CheckBox.ts b/packages/main/src/CheckBox.ts index 0938c24e047a1..86c29c9805831 100644 --- a/packages/main/src/CheckBox.ts +++ b/packages/main/src/CheckBox.ts @@ -194,7 +194,7 @@ class CheckBox extends UI5Element implements IFormInputElement { * - If the component is not checked, it will be displayed as not checked regardless value of the indeterminate attribute * @default false * @public - * @since 1.0.0-rc.15 + * @since 1.0.0 */ @property({ type: Boolean }) indeterminate = false; diff --git a/packages/main/src/ColorPalette.ts b/packages/main/src/ColorPalette.ts index a6e2254d26b97..9549c0a40e815 100644 --- a/packages/main/src/ColorPalette.ts +++ b/packages/main/src/ColorPalette.ts @@ -76,7 +76,7 @@ type ColorPaletteItemClickEventDetail = { * `import "@ui5/webcomponents/dist/ColorPalette.js";` * @constructor * @extends UI5Element - * @since 1.0.0-rc.12 + * @since 1.0.0 * @public */ @customElement({ @@ -89,7 +89,7 @@ type ColorPaletteItemClickEventDetail = { /** * Fired when the user selects a color. * @public - * @since 1.0.0-rc.15 + * @since 1.0.0 * @param {string} color the selected color */ @event("item-click") @@ -101,7 +101,7 @@ class ColorPalette extends UI5Element { /** * Defines whether the user can see the last used colors in the bottom of the component * @private - * @since 1.0.0-rc.15 + * @since 1.0.0 */ @property({ type: Boolean }) showRecentColors = false; @@ -110,7 +110,7 @@ class ColorPalette extends UI5Element { * Defines whether the user can choose a custom color from a color picker * * @private - * @since 1.0.0-rc.15 + * @since 1.0.0 */ @property({ type: Boolean }) showMoreColors = false; @@ -119,7 +119,7 @@ class ColorPalette extends UI5Element { * Defines whether the user can choose the default color from a button. * @default false * @private - * @since 1.0.0-rc.16 + * @since 1.0.0 */ @property({ type: Boolean }) showDefaultColor = false; @@ -129,7 +129,7 @@ class ColorPalette extends UI5Element { * * **Note:** The default color should be a part of the ColorPalette colors` * @private - * @since 1.0.0-rc.16 + * @since 1.0.0 */ @property() defaultColor?: string; diff --git a/packages/main/src/ColorPaletteItem.ts b/packages/main/src/ColorPaletteItem.ts index 055558794e3d5..f90060a44097b 100644 --- a/packages/main/src/ColorPaletteItem.ts +++ b/packages/main/src/ColorPaletteItem.ts @@ -27,7 +27,7 @@ type ColorPaletteItemNativeClickEventDetail = { * The `ui5-color-palette-item` component represents a color in the the `ui5-color-palette`. * @constructor * @extends UI5Element - * @since 1.0.0-rc.12 + * @since 1.0.0 * @implements { IColorPaletteItem } * @public */ @@ -112,7 +112,7 @@ class ColorPaletteItem extends UI5Element implements IColorPaletteItem { /** * @private - * @since 1.0.0-rc.15 + * @since 1.0.0 */ @property({ type: Boolean }) _disabled = false; diff --git a/packages/main/src/ColorPalettePopover.ts b/packages/main/src/ColorPalettePopover.ts index 0b4d18ceee759..9a11af077c51e 100644 --- a/packages/main/src/ColorPalettePopover.ts +++ b/packages/main/src/ColorPalettePopover.ts @@ -49,7 +49,7 @@ type ColorPalettePopoverItemClickEventDetail = ColorPaletteItemClickEventDetail; * @constructor * @extends UI5Element * @public - * @since 1.0.0-rc.16 + * @since 1.0.0 */ @customElement({ tag: "ui5-color-palette-popover", @@ -225,7 +225,7 @@ class ColorPalettePopover extends UI5Element { /** * Returns if the component is opened. * @protected - * @since 1.0.0-rc.16 + * @since 1.0.0 */ isOpen() { return this.open; diff --git a/packages/main/src/ColorPicker.ts b/packages/main/src/ColorPicker.ts index de337073b2e64..1caf642fb90c9 100644 --- a/packages/main/src/ColorPicker.ts +++ b/packages/main/src/ColorPicker.ts @@ -85,7 +85,7 @@ type ColorChannelInput = { * * `import "@ui5/webcomponents/dist/ColorPicker.js";` * @constructor - * @since 1.0.0-rc.12 + * @since 1.0.0 * @extends UI5Element * @public */ diff --git a/packages/main/src/ComboBox.ts b/packages/main/src/ComboBox.ts index 9674c08eab19f..b876abc884a00 100644 --- a/packages/main/src/ComboBox.ts +++ b/packages/main/src/ComboBox.ts @@ -198,7 +198,7 @@ type ComboBoxSelectionChangeEventDetail = { * @constructor * @extends UI5Element * @public - * @since 1.0.0-rc.6 + * @since 1.0.0 */ @customElement({ tag: "ui5-combobox", @@ -412,7 +412,7 @@ class ComboBox extends UI5Element implements IFormInputElement { * Defines the accessible ARIA name of the component. * @default undefined * @public - * @since 1.0.0-rc.15 + * @since 1.0.0 */ @property() accessibleName?: string; @@ -421,7 +421,7 @@ class ComboBox extends UI5Element implements IFormInputElement { * Receives id(or many ids) of the elements that label the component * @default undefined * @public - * @since 1.0.0-rc.15 + * @since 1.0.0 */ @property() accessibleNameRef?: string; @@ -497,7 +497,7 @@ class ComboBox extends UI5Element implements IFormInputElement { * * **Note:** The `valueStateMessage` would be displayed, * when the `ui5-combobox` is in `Information`, `Critical` or `Negative` value state. - * @since 1.0.0-rc.9 + * @since 1.0.0 * @public */ @slot() @@ -506,7 +506,7 @@ class ComboBox extends UI5Element implements IFormInputElement { /** * Defines the icon to be displayed in the input field. * @public - * @since 1.0.0-rc.9 + * @since 1.0.0 */ @slot() icon!: Slot; diff --git a/packages/main/src/ComboBoxItem.ts b/packages/main/src/ComboBoxItem.ts index c8331934b8f1e..2a39d90c12f5a 100644 --- a/packages/main/src/ComboBoxItem.ts +++ b/packages/main/src/ComboBoxItem.ts @@ -32,7 +32,7 @@ class ComboBoxItem extends ListItemBase implements IComboBoxItem { /** * Defines the additional text of the component. * @default undefined - * @since 1.0.0-rc.11 + * @since 1.0.0 * @public */ @property() diff --git a/packages/main/src/ComboBoxItemGroup.ts b/packages/main/src/ComboBoxItemGroup.ts index f00c8846fa952..b17cfdbf9a94d 100644 --- a/packages/main/src/ComboBoxItemGroup.ts +++ b/packages/main/src/ComboBoxItemGroup.ts @@ -16,7 +16,7 @@ import ComboBoxItemGroupTemplate from "./ComboBoxItemGroupTemplate.js"; * @abstract * @public * @implements {IComboBoxItem} - * @since 1.0.0-rc.15 + * @since 1.0.0 */ @customElement({ tag: "ui5-cb-item-group", diff --git a/packages/main/src/DateComponentBase.ts b/packages/main/src/DateComponentBase.ts index 91be57d5c0a45..edf1ca43b70ff 100644 --- a/packages/main/src/DateComponentBase.ts +++ b/packages/main/src/DateComponentBase.ts @@ -45,7 +45,7 @@ class DateComponentBase extends UI5Element { /** * Defines the secondary calendar type. * If not set, the calendar will only show the primary calendar type. - * @since 1.0.0-rc.16 + * @since 1.0.0 * @default undefined * @public */ @@ -84,7 +84,7 @@ class DateComponentBase extends UI5Element { * * **Note:** If the formatPattern property is not set, the minDate value must be provided in the ISO date format (yyyy-MM-dd). * @default "" - * @since 1.0.0-rc.6 + * @since 1.0.0 * @public */ @property() @@ -95,7 +95,7 @@ class DateComponentBase extends UI5Element { * * **Note:** If the formatPattern property is not set, the maxDate value must be provided in the ISO date format (yyyy-MM-dd). * @default "" - * @since 1.0.0-rc.6 + * @since 1.0.0 * @public */ @property() diff --git a/packages/main/src/DatePicker.ts b/packages/main/src/DatePicker.ts index a94c801877365..73b3d0029ac00 100644 --- a/packages/main/src/DatePicker.ts +++ b/packages/main/src/DatePicker.ts @@ -265,7 +265,7 @@ class DatePicker extends DateComponentBase implements IFormInputElement { /** * Defines whether the component is required. - * @since 1.0.0-rc.9 + * @since 1.0.0 * @default false * @public */ @@ -317,7 +317,7 @@ class DatePicker extends DateComponentBase implements IFormInputElement { * the week numbers are not displayed regardless of what is set. * @default false * @public - * @since 1.0.0-rc.8 + * @since 1.0.0 */ @property({ type: Boolean }) hideWeekNumbers = false; @@ -335,7 +335,7 @@ class DatePicker extends DateComponentBase implements IFormInputElement { * Defines the aria-label attribute for the component. * @default undefined * @public - * @since 1.0.0-rc.15 + * @since 1.0.0 */ @property() accessibleName?: string; @@ -344,7 +344,7 @@ class DatePicker extends DateComponentBase implements IFormInputElement { * Receives id(or many ids) of the elements that label the component. * @default undefined * @public - * @since 1.0.0-rc.15 + * @since 1.0.0 */ @property() accessibleNameRef?: string; @@ -393,7 +393,7 @@ class DatePicker extends DateComponentBase implements IFormInputElement { * * **Note:** The `valueStateMessage` would be displayed, * when the component is in `Information`, `Critical` or `Negative` value state. - * @since 1.0.0-rc.7 + * @since 1.0.0 * @public */ @slot() diff --git a/packages/main/src/DateRangePicker.ts b/packages/main/src/DateRangePicker.ts index 6e7d2fa97b75e..a61623f4e28e8 100644 --- a/packages/main/src/DateRangePicker.ts +++ b/packages/main/src/DateRangePicker.ts @@ -66,7 +66,7 @@ const DEFAULT_DELIMITER = "-"; * - [Shift] + [Ctrl] + [Page Up] - Increments the corresponding year by one * @constructor * @extends DatePicker - * @since 1.0.0-rc.8 + * @since 1.0.0 * @public */ @customElement({ diff --git a/packages/main/src/DateTimePicker.ts b/packages/main/src/DateTimePicker.ts index 80ba6da635d8b..536bc855ed11c 100644 --- a/packages/main/src/DateTimePicker.ts +++ b/packages/main/src/DateTimePicker.ts @@ -112,7 +112,7 @@ type PreviewValues = { * `import "@ui5/webcomponents/dist/DateTimePicker.js";` * @constructor * @extends DatePicker - * @since 1.0.0-rc.7 + * @since 1.0.0 * @public */ @customElement({ diff --git a/packages/main/src/DayPicker.ts b/packages/main/src/DayPicker.ts index 0ac016216fd44..f2f72e01c763d 100644 --- a/packages/main/src/DayPicker.ts +++ b/packages/main/src/DayPicker.ts @@ -163,7 +163,7 @@ class DayPicker extends CalendarPart implements ICalendarPicker { * **Note:** For calendars other than Gregorian, * the week numbers are not displayed regardless of what is set. * @default false - * @since 1.0.0-rc.8 + * @since 1.0.0 */ @property({ type: Boolean }) hideWeekNumbers = false; diff --git a/packages/main/src/Dialog.ts b/packages/main/src/Dialog.ts index be6f4111cebea..1e5f7f41373c8 100644 --- a/packages/main/src/Dialog.ts +++ b/packages/main/src/Dialog.ts @@ -170,7 +170,7 @@ class Dialog extends Popup { * When "draggable" is set to true, the native browser "draggable" * behavior is prevented and only the Dialog custom logic ("draggable by its header") works. * @default false - * @since 1.0.0-rc.9 + * @since 1.0.0 * @public */ @property({ type: Boolean }) @@ -185,7 +185,7 @@ class Dialog extends Popup { * * **Note:** Upon resizing, externally defined height and width styling will be ignored. * @default false - * @since 1.0.0-rc.10 + * @since 1.0.0 * @public */ @property({ type: Boolean }) @@ -213,7 +213,7 @@ class Dialog extends Popup { * accessibility role to "alertdialog", if the accessibleRole property is set to `"Dialog"`. * @default "None" * @public - * @since 1.0.0-rc.15 + * @since 1.0.0 */ @property() state: `${ValueState}` = "None"; diff --git a/packages/main/src/FileUploader.ts b/packages/main/src/FileUploader.ts index 20491c83a9cce..66f14fd615f87 100644 --- a/packages/main/src/FileUploader.ts +++ b/packages/main/src/FileUploader.ts @@ -94,7 +94,7 @@ type FileUploaderChangeEventDetail = { * * `import "@ui5/webcomponents/dist/FileUploader.js";` * @constructor - * @since 1.0.0-rc.6 + * @since 1.0.0 * @extends UI5Element * @public */ @@ -287,7 +287,7 @@ class FileUploader extends UI5Element implements IFormInputElement { * * **Note:** The `valueStateMessage` would be displayed, * when the component is in `Information`, `Critical` or `Negative` value state. - * @since 1.0.0-rc.9 + * @since 1.0.0 * @public */ @slot() diff --git a/packages/main/src/Input.ts b/packages/main/src/Input.ts index 9379a44bc5a4d..60602089a8b28 100644 --- a/packages/main/src/Input.ts +++ b/packages/main/src/Input.ts @@ -278,7 +278,7 @@ type InputSuggestionScrollEventDetail = { * @param {Integer} scrollTop The current scroll position. * @param {HTMLElement} scrollContainer The scroll container. * @protected - * @since 1.0.0-rc.8 + * @since 1.0.0 */ @event("suggestion-scroll", { bubbles: true, @@ -329,7 +329,7 @@ class Input extends UI5Element implements SuggestionComponent, IFormInputElement * **Note:** takes effect when `showSuggestions` is set to `true` * @default false * @private - * @since 1.0.0-rc.8 + * @since 1.0.0 */ @property({ type: Boolean }) highlight = false; @@ -358,7 +358,7 @@ class Input extends UI5Element implements SuggestionComponent, IFormInputElement * Defines whether the component is required. * @default false * @public - * @since 1.0.0-rc.3 + * @since 1.0.0 */ @property({ type: Boolean }) required = false; @@ -432,7 +432,7 @@ class Input extends UI5Element implements SuggestionComponent, IFormInputElement * * **Note:** This property is not compatible with the ui5-input type InputType.Number. If the ui5-input type is set to Number, the maxlength value is ignored. * @default undefined - * @since 1.0.0-rc.5 + * @since 1.0.0 * @public */ @property({ type: Number }) @@ -442,7 +442,7 @@ class Input extends UI5Element implements SuggestionComponent, IFormInputElement * Defines the accessible ARIA name of the component. * @default undefined * @public - * @since 1.0.0-rc.15 + * @since 1.0.0 */ @property() accessibleName?: string; @@ -451,7 +451,7 @@ class Input extends UI5Element implements SuggestionComponent, IFormInputElement * Receives id(or many ids) of the elements that label the input. * @default undefined * @public - * @since 1.0.0-rc.15 + * @since 1.0.0 */ @property() accessibleNameRef?: string; @@ -619,7 +619,7 @@ class Input extends UI5Element implements SuggestionComponent, IFormInputElement * * **Note:** If the component has `suggestionItems`, * the `valueStateMessage` would be displayed as part of the same popover, if used on desktop, or dialog - on phone. - * @since 1.0.0-rc.6 + * @since 1.0.0 * @public */ @slot({ diff --git a/packages/main/src/Link.ts b/packages/main/src/Link.ts index 7b11102b66828..5208a2bd25d2a 100644 --- a/packages/main/src/Link.ts +++ b/packages/main/src/Link.ts @@ -194,7 +194,7 @@ class Link extends UI5Element implements ITabbable { * Receives id(or many ids) of the elements that label the input * @default undefined * @public - * @since 1.0.0-rc.15 + * @since 1.0.0 */ @property() accessibleNameRef?: string; diff --git a/packages/main/src/List.ts b/packages/main/src/List.ts index d03c8979c0253..6b3b3fcc31294 100644 --- a/packages/main/src/List.ts +++ b/packages/main/src/List.ts @@ -245,7 +245,7 @@ type ListAccessibilityAttributes = { * not to be confused with `item-delete`. * @param {HTMLElement} item the item about to be closed. * @public - * @since 1.0.0-rc.8 + * @since 1.0.0 */ @event("item-close", { bubbles: true, @@ -257,7 +257,7 @@ type ListAccessibilityAttributes = { * **Note:** This event is only applicable to list items that can be toggled (such as notification group list items). * @param {HTMLElement} item the toggled item. * @public - * @since 1.0.0-rc.8 + * @since 1.0.0 */ @event("item-toggle", { bubbles: true, @@ -292,7 +292,7 @@ type ListAccessibilityAttributes = { * * **Note:** The event is fired when the `growing='Scroll'` property is enabled. * @public - * @since 1.0.0-rc.6 + * @since 1.0.0 */ @event("load-more", { bubbles: true, @@ -400,7 +400,7 @@ class List extends UI5Element { * **Restrictions:** `growing="Scroll"` is not supported for Internet Explorer, * on IE the component will fallback to `growing="Button"`. * @default "None" - * @since 1.0.0-rc.13 + * @since 1.0.0 * @public */ @property() @@ -413,7 +413,7 @@ class List extends UI5Element { * * **Note:** This property takes effect if the `growing` property is set to the `Button`. * @default undefined - * @since 1.24 + * @since 1.24.0 * @public */ @property() @@ -423,7 +423,7 @@ class List extends UI5Element { * Defines if the component would display a loading indicator over the list. * @default false * @public - * @since 1.0.0-rc.6 + * @since 1.0.0 */ @property({ type: Boolean }) loading = false; @@ -451,7 +451,7 @@ class List extends UI5Element { * Defines the accessible name of the component. * @default undefined * @public - * @since 1.0.0-rc.15 + * @since 1.0.0 */ @property() accessibleName?: string; @@ -483,7 +483,7 @@ class List extends UI5Element { * Defines the IDs of the elements that label the component. * @default undefined * @public - * @since 1.0.0-rc.15 + * @since 1.0.0 */ @property() accessibleNameRef?: string; @@ -524,7 +524,7 @@ class List extends UI5Element { * Defines the accessible role of the component. * @public * @default "List" - * @since 1.0.0-rc.15 + * @since 1.0.0 */ @property() accessibleRole: `${ListAccessibleRole}` = "List"; diff --git a/packages/main/src/ListItem.ts b/packages/main/src/ListItem.ts index 7004bba656e0d..b785230c1deef 100644 --- a/packages/main/src/ListItem.ts +++ b/packages/main/src/ListItem.ts @@ -168,7 +168,7 @@ abstract class ListItem extends ListItemBase { * Available options are: `"None"` (by default), `"Positive"`, `"Critical"`, `"Information"` and `"Negative"`. * @default "None" * @public - * @since 1.24 + * @since 1.24.0 */ @property() highlight: `${Highlight}` = "None"; diff --git a/packages/main/src/ListItemBase.ts b/packages/main/src/ListItemBase.ts index 47df8f56a4e68..5492bc526c5cd 100644 --- a/packages/main/src/ListItemBase.ts +++ b/packages/main/src/ListItemBase.ts @@ -114,7 +114,7 @@ class ListItemBase extends UI5Element implements ITabbable { * **Note:** A disabled `ui5-li` is noninteractive. * @default false * @protected - * @since 1.0.0-rc.12 + * @since 1.0.0 */ @property({ type: Boolean }) disabled = false; diff --git a/packages/main/src/ListItemCustom.ts b/packages/main/src/ListItemCustom.ts index 169af11258e61..09e1fd988acca 100644 --- a/packages/main/src/ListItemCustom.ts +++ b/packages/main/src/ListItemCustom.ts @@ -87,7 +87,7 @@ class ListItemCustom extends ListItem { * **Note**: If not provided a default text alternative will be set, if present. * @default undefined * @public - * @since 1.0.0-rc.15 + * @since 1.0.0 */ @property() accessibleName?: string; diff --git a/packages/main/src/ListItemStandard.ts b/packages/main/src/ListItemStandard.ts index 5cb370644fd4f..8ce128a361e9d 100644 --- a/packages/main/src/ListItemStandard.ts +++ b/packages/main/src/ListItemStandard.ts @@ -67,7 +67,7 @@ class ListItemStandard extends ListItem implements IAccessibleListItem { * Defines the description displayed right under the item text, if such is present. * @default undefined * @public - * @since 0.8.0 + * @since 1.0.0 */ @property() description?: string; @@ -97,7 +97,7 @@ class ListItemStandard extends ListItem implements IAccessibleListItem { * Defines the `additionalText`, displayed in the end of the list item. * @default undefined * @public - * @since 1.0.0-rc.15 + * @since 1.0.0 */ @property() additionalText?: string; @@ -108,7 +108,7 @@ class ListItemStandard extends ListItem implements IAccessibleListItem { * Available options are: `"None"` (by default), `"Positive"`, `"Critical"`, `"Information"` and `"Negative"`. * @default "None" * @public - * @since 1.0.0-rc.15 + * @since 1.0.0 */ @property() additionalTextState: `${ValueState}` = "None"; @@ -127,7 +127,7 @@ class ListItemStandard extends ListItem implements IAccessibleListItem { * Note: If not provided a default text alternative will be set, if present. * @default undefined * @public - * @since 1.0.0-rc.15 + * @since 1.0.0 */ @property() declare accessibleName?: string; diff --git a/packages/main/src/MessageStrip.ts b/packages/main/src/MessageStrip.ts index bc2ddfb1b018b..3772059be477b 100644 --- a/packages/main/src/MessageStrip.ts +++ b/packages/main/src/MessageStrip.ts @@ -70,7 +70,7 @@ type DesignCloseButtonTooltip = Record; * @constructor * @extends UI5Element * @public - * @since 0.9.0 + * @since 1.0.0 * @slot {Array} default * Defines the text of the component. * @@ -99,7 +99,7 @@ class MessageStrip extends UI5Element { * Defines the component type. * @default "Information" * @public - * @since 1.0.0-rc.15 + * @since 1.0.0 */ @property() design: `${MessageStripDesign}` = "Information"; @@ -124,7 +124,7 @@ class MessageStrip extends UI5Element { * * @default false * @public - * @since 1.0.0-rc.15 + * @since 1.0.0 */ @property({ type: Boolean }) hideIcon = false diff --git a/packages/main/src/MonthPicker.ts b/packages/main/src/MonthPicker.ts index 63a514d75b27c..e86401679ea96 100644 --- a/packages/main/src/MonthPicker.ts +++ b/packages/main/src/MonthPicker.ts @@ -86,7 +86,7 @@ type MonthPickerNavigateEventDetail = { }) /** * Fired when the timestamp changes - the user navigates with the keyboard or clicks with the mouse. - * @since 1.0.0-rc.9 + * @since 1.0.0 */ @event("navigate", { bubbles: true, diff --git a/packages/main/src/MultiComboBox.ts b/packages/main/src/MultiComboBox.ts index 8d3755cb4a212..f0e376bfff6f5 100644 --- a/packages/main/src/MultiComboBox.ts +++ b/packages/main/src/MultiComboBox.ts @@ -189,7 +189,7 @@ type MultiComboBoxValueStateChangeEventDetail = { * @constructor * @extends UI5Element * @public - * @since 0.11.0 + * @since 1.0.0 * @csspart token-\{index\} - Used to style each token(where `token-0` corresponds to the first item) */ @customElement({ @@ -388,7 +388,7 @@ class MultiComboBox extends UI5Element implements IFormInputElement { * Defines whether the component is required. * @default false * @public - * @since 1.0.0-rc.5 + * @since 1.0.0 */ @property({ type: Boolean }) required = false; @@ -555,7 +555,7 @@ class MultiComboBox extends UI5Element implements IFormInputElement { /** * Defines the icon to be displayed in the component. * @public - * @since 1.0.0-rc.9 + * @since 1.0.0 */ @slot() icon!: Slot; @@ -568,7 +568,7 @@ class MultiComboBox extends UI5Element implements IFormInputElement { * * **Note:** The `valueStateMessage` would be displayed, * when the component is in `Information`, `Critical` or `Negative` value state. - * @since 1.0.0-rc.9 + * @since 1.0.0 * @public */ @slot() diff --git a/packages/main/src/MultiInput.ts b/packages/main/src/MultiInput.ts index 5986cef4abe9c..eee001ebf93f5 100644 --- a/packages/main/src/MultiInput.ts +++ b/packages/main/src/MultiInput.ts @@ -67,7 +67,7 @@ type MultiInputTokenDeleteEventDetail = { * `import "@ui5/webcomponents/dist/MultiInput.js";` * @constructor * @extends Input - * @since 1.0.0-rc.9 + * @since 1.0.0 * @public */ @customElement({ diff --git a/packages/main/src/Option.ts b/packages/main/src/Option.ts index e9f3c8a0d94df..cb40a78476634 100644 --- a/packages/main/src/Option.ts +++ b/packages/main/src/Option.ts @@ -75,7 +75,7 @@ class Option extends ListItemBase implements IOption { * Defines the `additionalText`, displayed in the end of the option. * @default undefined * @public - * @since 1.0.0-rc.15 + * @since 1.0.0 */ @property() additionalText?: string; diff --git a/packages/main/src/Panel.ts b/packages/main/src/Panel.ts index de8eafbd93b2f..ef018d517e921 100644 --- a/packages/main/src/Panel.ts +++ b/packages/main/src/Panel.ts @@ -131,7 +131,7 @@ class Panel extends UI5Element { * Indicates whether the transition between the expanded and the collapsed state of the component is animated. By default the animation is enabled. * @default false * @public - * @since 1.0.0-rc.16 + * @since 1.0.0 */ @property({ type: Boolean }) noAnimation = false; @@ -159,7 +159,7 @@ class Panel extends UI5Element { * Defines the accessible ARIA name of the component. * @default undefined * @public - * @since 1.0.0-rc.15 + * @since 1.0.0 */ @property() accessibleName?: string; @@ -171,7 +171,7 @@ class Panel extends UI5Element { * a solid color will be used for its design. * @default false * @public - * @since 1.16.0-rc.1 + * @since 1.16.0 */ @property({ type: Boolean }) stickyHeader = false; diff --git a/packages/main/src/Popover.ts b/packages/main/src/Popover.ts index 1c4a667034a0e..e51b9ac637199 100644 --- a/packages/main/src/Popover.ts +++ b/packages/main/src/Popover.ts @@ -86,7 +86,7 @@ type CalculatedPlacement = { * * @constructor * @extends Popup - * @since 1.0.0-rc.6 + * @since 1.0.0 * @public * @csspart header - Used to style the header of the component * @csspart content - Used to style the content of the component @@ -151,7 +151,7 @@ class Popover extends Popup { * Determines whether the component arrow is hidden. * @default false * @public - * @since 1.0.0-rc.15 + * @since 1.0.0 */ @property({ type: Boolean }) hideArrow = false; diff --git a/packages/main/src/Popup.ts b/packages/main/src/Popup.ts index 9242b3d5a8472..a2bca3412dc8b 100644 --- a/packages/main/src/Popup.ts +++ b/packages/main/src/Popup.ts @@ -145,7 +145,7 @@ abstract class Popup extends UI5Element { * when the popup closes. * @default false * @public - * @since 1.0.0-rc.8 + * @since 1.0.0 */ @property({ type: Boolean }) preventFocusRestore = false; @@ -154,7 +154,7 @@ abstract class Popup extends UI5Element { * Defines the accessible name of the component. * @default undefined * @public - * @since 1.0.0-rc.15 + * @since 1.0.0 */ @property() accessibleName?: string; diff --git a/packages/main/src/ProgressIndicator.ts b/packages/main/src/ProgressIndicator.ts index 5ff2c459dc970..fbe2091792171 100644 --- a/packages/main/src/ProgressIndicator.ts +++ b/packages/main/src/ProgressIndicator.ts @@ -38,7 +38,7 @@ import ProgressIndicatorCss from "./generated/themes/ProgressIndicator.css.js"; * @constructor * @extends UI5Element * @public - * @since 1.0.0-rc.8 + * @since 1.0.0 */ @customElement({ tag: "ui5-progress-indicator", diff --git a/packages/main/src/RadioButton.ts b/packages/main/src/RadioButton.ts index 6ea02e02069ac..19076cba5a03e 100644 --- a/packages/main/src/RadioButton.ts +++ b/packages/main/src/RadioButton.ts @@ -81,7 +81,7 @@ let activeRadio: RadioButton; /** * Fired when the component checked state changes. * @public - * @since 1.0.0-rc.15 + * @since 1.0.0 */ @event("change", { bubbles: true, @@ -134,7 +134,7 @@ class RadioButton extends UI5Element implements IFormInputElement { * @formEvents change * @formProperty * @public - * @since 1.0.0-rc.15 + * @since 1.0.0 */ @property({ type: Boolean }) checked = false; diff --git a/packages/main/src/RangeSlider.ts b/packages/main/src/RangeSlider.ts index e40b62d1a719d..d295a94e1d2a1 100644 --- a/packages/main/src/RangeSlider.ts +++ b/packages/main/src/RangeSlider.ts @@ -83,7 +83,7 @@ type AffectedValue = "startValue" | "endValue"; * `import "@ui5/webcomponents/dist/RangeSlider.js";` * @constructor * @extends SliderBase - * @since 1.0.0-rc.11 + * @since 1.0.0 * @public * @csspart progress-container - Used to style the progress container, the horizontal bar that visually represents the range between the minimum and maximum values, of the `ui5-range-slider`. * @csspart progress-bar - Used to style the progress bar, which shows the progress of the `ui5-range-slider`. diff --git a/packages/main/src/RatingIndicator.ts b/packages/main/src/RatingIndicator.ts index b10656b7ff24b..4992786a2696e 100644 --- a/packages/main/src/RatingIndicator.ts +++ b/packages/main/src/RatingIndicator.ts @@ -68,7 +68,7 @@ type Star = { * @constructor * @extends UI5Element * @public - * @since 1.0.0-rc.8 + * @since 1.0.0 */ @customElement({ @@ -108,7 +108,7 @@ class RatingIndicator extends UI5Element { * The number of displayed rating symbols. * @default 5 * @public - * @since 1.0.0-rc.15 + * @since 1.0.0 */ @property({ type: Number }) max: number = 5; @@ -159,7 +159,7 @@ class RatingIndicator extends UI5Element { * Defines the accessible ARIA name of the component. * @default undefined * @public - * @since 1.0.0-rc.15 + * @since 1.0.0 */ @property() accessibleName?: string; @@ -196,7 +196,7 @@ class RatingIndicator extends UI5Element { * * @default "favorite" * @public - * @since 2.20 + * @since 2.20.0 */ @property() ratedIcon = "favorite"; @@ -205,7 +205,7 @@ class RatingIndicator extends UI5Element { * Defines the icon to be displayed for the unselected (empty) rating symbol. * @default "unfavorite" * @public - * @since 2.20 + * @since 2.20.0 */ @property() unratedIcon = "unfavorite"; diff --git a/packages/main/src/ResponsivePopover.ts b/packages/main/src/ResponsivePopover.ts index 3c062864d2a52..3844c60c8d57d 100644 --- a/packages/main/src/ResponsivePopover.ts +++ b/packages/main/src/ResponsivePopover.ts @@ -29,7 +29,7 @@ import type { PopupBeforeCloseEventDetail } from "./Popup.js"; * `import "@ui5/webcomponents/dist/ResponsivePopover.js";` * @constructor * @extends Popover - * @since 1.0.0-rc.6 + * @since 1.0.0 * @public * @csspart header - Used to style the header of the component * @csspart content - Used to style the content of the component @@ -63,7 +63,7 @@ class ResponsivePopover extends Popover { * **Note:** If you are using the `header` slot, this property will have no effect * @private * @default false - * @since 1.0.0-rc.16 + * @since 1.0.0 */ @property({ type: Boolean }) _hideCloseButton = false; diff --git a/packages/main/src/SegmentedButton.ts b/packages/main/src/SegmentedButton.ts index 1511864375e7d..ce2273fcebeb0 100644 --- a/packages/main/src/SegmentedButton.ts +++ b/packages/main/src/SegmentedButton.ts @@ -62,7 +62,7 @@ type SegmentedButtonSelectionChangeEventDetail = { * `import "@ui5/webcomponents/dist/SegmentedButton.js";` * @constructor * @extends UI5Element - * @since 1.0.0-rc.6 + * @since 1.0.0 * @public */ @customElement({ diff --git a/packages/main/src/SegmentedButtonItem.ts b/packages/main/src/SegmentedButtonItem.ts index cba42e93a8635..c41bb5b0282ee 100644 --- a/packages/main/src/SegmentedButtonItem.ts +++ b/packages/main/src/SegmentedButtonItem.ts @@ -106,7 +106,7 @@ class SegmentedButtonItem extends UI5Element implements IButton, ISegmentedButto * Defines the accessible ARIA name of the component. * @default undefined * @public - * @since 1.0.0-rc.15 + * @since 1.0.0 */ @property() accessibleName?: string; diff --git a/packages/main/src/Select.ts b/packages/main/src/Select.ts index 5b5f722dd313f..5cbeaf38dd057 100644 --- a/packages/main/src/Select.ts +++ b/packages/main/src/Select.ts @@ -167,7 +167,7 @@ const isPrintableCharacter = (e: KeyboardEvent) => { * @extends UI5Element * @public * @csspart popover - Used to style the popover element - * @since 0.8.0 + * @since 1.0.0 */ @customElement({ tag: "ui5-select", @@ -297,7 +297,7 @@ class Select extends UI5Element implements IFormInputElement { /** * Defines whether the component is required. - * @since 1.0.0-rc.9 + * @since 1.0.0 * @default false * @public */ @@ -318,7 +318,7 @@ class Select extends UI5Element implements IFormInputElement { /** * Defines the accessible ARIA name of the component. - * @since 1.0.0-rc.9 + * @since 1.0.0 * @public * @default undefined */ @@ -329,7 +329,7 @@ class Select extends UI5Element implements IFormInputElement { * Receives id(or many ids) of the elements that label the select. * @default undefined * @public - * @since 1.0.0-rc.15 + * @since 1.0.0 */ @property() accessibleNameRef?: string; diff --git a/packages/main/src/Slider.ts b/packages/main/src/Slider.ts index 13b9e1277290f..013a5e2fe01bf 100644 --- a/packages/main/src/Slider.ts +++ b/packages/main/src/Slider.ts @@ -68,7 +68,7 @@ import { * `import "@ui5/webcomponents/dist/Slider.js";` * @constructor * @extends SliderBase - * @since 1.0.0-rc.11 + * @since 1.0.0 * @public * @csspart progress-container - Used to style the progress container, the horizontal bar that visually represents the range between the minimum and maximum values, of the `ui5-slider`. * @csspart progress-bar - Used to style the progress bar, which shows the progress of the `ui5-slider`. diff --git a/packages/main/src/StepInput.ts b/packages/main/src/StepInput.ts index e125e14433e85..84587b052b37d 100644 --- a/packages/main/src/StepInput.ts +++ b/packages/main/src/StepInput.ts @@ -98,7 +98,7 @@ type StepInputValueStateChangeEventDetail = { * `import "@ui5/webcomponents/dist/StepInput.js";` * @constructor * @extends UI5Element - * @since 1.0.0-rc.13 + * @since 1.0.0 * @public */ @customElement({ @@ -244,7 +244,7 @@ class StepInput extends UI5Element implements IFormInputElement { * Defines the accessible ARIA name of the component. * @default undefined * @public - * @since 1.0.0-rc.15 + * @since 1.0.0 */ @property() accessibleName?: string; @@ -253,7 +253,7 @@ class StepInput extends UI5Element implements IFormInputElement { * Receives id(or many ids) of the elements that label the component. * @default undefined * @public - * @since 1.0.0-rc.15 + * @since 1.0.0 */ @property() accessibleNameRef?: string; diff --git a/packages/main/src/SuggestionItem.ts b/packages/main/src/SuggestionItem.ts index 55f6084211c06..e5d64c13e23d8 100644 --- a/packages/main/src/SuggestionItem.ts +++ b/packages/main/src/SuggestionItem.ts @@ -36,7 +36,7 @@ class SuggestionItem extends ListItemBase implements IInputSuggestionItemSelecta /** * Defines the `additionalText`, displayed in the end of the item. * @default undefined - * @since 1.0.0-rc.15 + * @since 1.0.0 * @public */ @property() diff --git a/packages/main/src/SuggestionListItem.ts b/packages/main/src/SuggestionListItem.ts index c8db0e49e0723..5527560376a09 100644 --- a/packages/main/src/SuggestionListItem.ts +++ b/packages/main/src/SuggestionListItem.ts @@ -24,7 +24,7 @@ class SuggestionListItem extends ListItemStandard { /** * Defines a description that can contain HTML. * **Note:** If not specified, the `description` property will be used. - * @since 1.0.0-rc.8 + * @since 1.0.0 * @public */ @slot() diff --git a/packages/main/src/Switch.ts b/packages/main/src/Switch.ts index e5896da647288..8857eb2f8d3b8 100644 --- a/packages/main/src/Switch.ts +++ b/packages/main/src/Switch.ts @@ -50,7 +50,7 @@ import switchCss from "./generated/themes/Switch.css.js"; * @constructor * @extends UI5Element * @public - * @since 0.8.0 + * @since 1.0.0 * @csspart slider - Used to style the track, where the handle is being slid * @csspart text-on - Used to style the `textOn` property text * @csspart text-off - Used to style the `textOff` property text diff --git a/packages/main/src/Tab.ts b/packages/main/src/Tab.ts index eb733c542dcc8..dcc5a6ea8bc02 100644 --- a/packages/main/src/Tab.ts +++ b/packages/main/src/Tab.ts @@ -301,7 +301,7 @@ class Tab extends UI5Element implements ITabbable, ITab { * * **Note:** If you need a DOM ref to the tab content please use the `getDomRef` method. * @public - * @since 1.0.0-rc.16 + * @since 1.0.0 */ getDomRefInStrip(): HTMLElement | undefined { return this._getElementInStrip?.(); diff --git a/packages/main/src/TabContainer.ts b/packages/main/src/TabContainer.ts index 5f71485ea7203..30c79241f66dc 100644 --- a/packages/main/src/TabContainer.ts +++ b/packages/main/src/TabContainer.ts @@ -267,7 +267,7 @@ class TabContainer extends UI5Element { * layout for most scenarios. Set to `Bottom` only when the component is at the * bottom of the page and you want the tab strip to act as a menu. * @default "Top" - * @since 1.0.0-rc.7 + * @since 1.0.0 * @private */ @property() @@ -336,7 +336,7 @@ class TabContainer extends UI5Element { * Defines the button which will open the overflow menu. If nothing is provided to this slot, * the default button will be used. * @public - * @since 1.0.0-rc.9 + * @since 1.0.0 */ @slot() overflowButton!: Slot; diff --git a/packages/main/src/Table.ts b/packages/main/src/Table.ts index 7a05fd73a7214..9fcc3bf18e3c1 100644 --- a/packages/main/src/Table.ts +++ b/packages/main/src/Table.ts @@ -383,7 +383,7 @@ class Table extends UI5Element { * Determines whether the table rows are displayed with alternating background colors. * * @default false - * @since 2.17 + * @since 2.17.0 * @public */ @property({ type: Boolean }) diff --git a/packages/main/src/TableSelectionBase.ts b/packages/main/src/TableSelectionBase.ts index 7578210a1c2d5..a9c0801fadf17 100644 --- a/packages/main/src/TableSelectionBase.ts +++ b/packages/main/src/TableSelectionBase.ts @@ -54,7 +54,7 @@ abstract class TableSelectionBase extends UI5Element implements ITableFeature { * * @default "RowSelector" * @public - * @since 2.11 + * @since 2.11.0 */ @property() behavior: `${TableSelectionBehavior}` = "RowSelector"; diff --git a/packages/main/src/TableSelectionMulti.ts b/packages/main/src/TableSelectionMulti.ts index 34e46b5377d82..8a890c1bedd91 100644 --- a/packages/main/src/TableSelectionMulti.ts +++ b/packages/main/src/TableSelectionMulti.ts @@ -61,7 +61,7 @@ class TableSelectionMulti extends TableSelectionBase { * * @default "SelectAll" * @public - * @since 2.12 + * @since 2.12.0 */ @property() headerSelector: `${TableSelectionMultiHeaderSelector}` = "SelectAll"; diff --git a/packages/main/src/TextArea.ts b/packages/main/src/TextArea.ts index d42797eeba134..9507ad3199550 100644 --- a/packages/main/src/TextArea.ts +++ b/packages/main/src/TextArea.ts @@ -104,7 +104,7 @@ type TextAreaInputEventDetail = { /** * Fired when the value of the component changes at each keystroke or when * something is pasted. - * @since 1.0.0-rc.5 + * @since 1.0.0 * @param {boolean} escapePressed Indicates whether the Escape key was pressed, which triggers a revert to the previous value * @public */ @@ -173,7 +173,7 @@ class TextArea extends UI5Element implements IFormInputElement { * Defines whether the component is required. * @default false * @public - * @since 1.0.0-rc.3 + * @since 1.0.0 */ @property({ type: Boolean }) required = false; @@ -193,7 +193,7 @@ class TextArea extends UI5Element implements IFormInputElement { * the component turns into "Critical" state once the characters exceeds the limit. * In this case, only the "Negative" state is considered and can be applied. * @default "None" - * @since 1.0.0-rc.7 + * @since 1.0.0 * @public */ @property() @@ -265,7 +265,7 @@ class TextArea extends UI5Element implements IFormInputElement { * Defines the accessible ARIA name of the component. * @default undefined * @public - * @since 1.0.0-rc.15 + * @since 1.0.0 */ @property() accessibleName?: string; @@ -274,7 +274,7 @@ class TextArea extends UI5Element implements IFormInputElement { * Receives id(or many ids) of the elements that label the textarea. * @default undefined * @public - * @since 1.0.0-rc.15 + * @since 1.0.0 */ @property() accessibleNameRef?: string; @@ -343,7 +343,7 @@ class TextArea extends UI5Element implements IFormInputElement { * * **Note:** The `valueStateMessage` would be displayed if the component has * `valueState` of type `Information`, `Critical` or `Negative`. - * @since 1.0.0-rc.7 + * @since 1.0.0 * @public */ @slot() diff --git a/packages/main/src/TimePicker.ts b/packages/main/src/TimePicker.ts index 66fe80902621c..8c5ba75f227a9 100644 --- a/packages/main/src/TimePicker.ts +++ b/packages/main/src/TimePicker.ts @@ -142,7 +142,7 @@ const DEFAULT_ISO_FORMAT = "HH:mm:ss"; * @constructor * @extends UI5Element * @public - * @since 1.0.0-rc.6 + * @since 1.0.0 * @csspart input - Used to style the input element. This part is forwarded to the underlying ui5-input element. */ @customElement({ @@ -356,7 +356,7 @@ class TimePicker extends UI5Element implements IFormInputElement { * * **Note:** The `valueStateMessage` would be displayed, * when the `ui5-time-picker` is in `Information`, `Critical` or `Negative` value state. - * @since 1.0.0-rc.8 + * @since 1.0.0 * @public */ @slot() diff --git a/packages/main/src/Toast.ts b/packages/main/src/Toast.ts index 565a21688666c..95875bb7019a7 100644 --- a/packages/main/src/Toast.ts +++ b/packages/main/src/Toast.ts @@ -72,7 +72,7 @@ const handleGlobalKeydown = (e: KeyboardEvent) => { * @constructor * @extends UI5Element * @public - * @since 1.0.0-rc.6 + * @since 1.0.0 * @slot {Array} default * Defines the text of the component. * diff --git a/packages/main/src/Token.ts b/packages/main/src/Token.ts index 2c3f2a88431cb..8c739ac83f5a8 100644 --- a/packages/main/src/Token.ts +++ b/packages/main/src/Token.ts @@ -39,7 +39,7 @@ type TokenDeleteEventDetail = { * `import "@ui5/webcomponents/dist/Token.js";` * @constructor * @extends UI5Element - * @since 1.0.0-rc.9 + * @since 1.0.0 * @implements {IToken} * @public */ @@ -146,7 +146,7 @@ class Token extends UI5Element implements IToken { * Defines the close icon for the token. If nothing is provided to this slot, the default close icon will be used. * Accepts `ui5-icon`. * @public - * @since 1.0.0-rc.9 + * @since 1.0.0 */ @slot() closeIcon!: Slot; diff --git a/packages/main/src/Tree.ts b/packages/main/src/Tree.ts index 480fc1d7846a3..5277f1b95c3ce 100644 --- a/packages/main/src/Tree.ts +++ b/packages/main/src/Tree.ts @@ -100,7 +100,7 @@ type WalkCallback = (item: TreeItemBase, level: number, index: number) => void; * @constructor * @extends UI5Element * @public - * @since 1.0.0-rc.8 + * @since 1.0.0 */ @customElement({ tag: "ui5-tree", @@ -124,7 +124,7 @@ type WalkCallback = (item: TreeItemBase, level: number, index: number) => void; /** * Fired when the mouse cursor enters the tree item borders. * @param {HTMLElement} item the hovered item. - * @since 1.0.0-rc.16 + * @since 1.0.0 * @public */ @event("item-mouseover", { @@ -133,7 +133,7 @@ type WalkCallback = (item: TreeItemBase, level: number, index: number) => void; /** * Fired when the mouse cursor leaves the tree item borders. * @param {HTMLElement} item the hovered item. - * @since 1.0.0-rc.16 + * @since 1.0.0 * @public */ @event("item-mouseout", { diff --git a/packages/main/src/TreeItem.ts b/packages/main/src/TreeItem.ts index aaf63b5b3bd31..2e228398c92a1 100644 --- a/packages/main/src/TreeItem.ts +++ b/packages/main/src/TreeItem.ts @@ -24,7 +24,7 @@ import treeItemCss from "./generated/themes/TreeItem.css.js"; * @constructor * @extends TreeItemBase * @public - * @since 1.0.0-rc.8 + * @since 1.0.0 */ @customElement({ renderer: jsxRenderer, @@ -45,7 +45,7 @@ class TreeItem extends TreeItemBase { * Defines the `additionalText`, displayed in the end of the tree item. * @default undefined * @public - * @since 1.0.0-rc.15 + * @since 1.0.0 */ @property() additionalText?: string; diff --git a/packages/main/src/TreeItemBase.ts b/packages/main/src/TreeItemBase.ts index 89ac62617f060..0b314d51827a1 100644 --- a/packages/main/src/TreeItemBase.ts +++ b/packages/main/src/TreeItemBase.ts @@ -159,7 +159,7 @@ class TreeItemBase extends ListItem { * Available options are: `"None"` (by default), `"Positive"`, `"Critical"`, `"Information"` and `"Negative"`. * @default "None" * @public - * @since 1.0.0-rc.15 + * @since 1.0.0 */ @property() additionalTextState: `${ValueState}` = "None"; @@ -175,14 +175,14 @@ class TreeItemBase extends ListItem { /** * @private - * @since 1.0.0-rc.11 + * @since 1.0.0 */ @property({ type: Number, noAttribute: true }) forcedSetsize = 1; /** * @private - * @since 1.0.0-rc.11 + * @since 1.0.0 */ @property({ type: Number, noAttribute: true }) forcedPosinset = 1; diff --git a/packages/main/src/YearPicker.ts b/packages/main/src/YearPicker.ts index 4780c867b0c4f..2c67d4d60cafd 100644 --- a/packages/main/src/YearPicker.ts +++ b/packages/main/src/YearPicker.ts @@ -79,7 +79,7 @@ type YearPickerNavigateEventDetail = { }) /** * Fired when the timestamp changes - the user navigates with the keyboard or clicks with the mouse. - * @since 1.0.0-rc.9 + * @since 1.0.0 */ @event("navigate", { bubbles: true, diff --git a/packages/main/src/types/ButtonAccessibleRole.ts b/packages/main/src/types/ButtonAccessibleRole.ts index c5fb3b9e75ec8..7c2651fd2e4fd 100644 --- a/packages/main/src/types/ButtonAccessibleRole.ts +++ b/packages/main/src/types/ButtonAccessibleRole.ts @@ -2,7 +2,7 @@ * Button accessible roles. * * @public - * @since 1.23 + * @since 1.23.0 */ enum ButtonAccessibleRole { diff --git a/packages/main/src/types/TableSelectionBehavior.ts b/packages/main/src/types/TableSelectionBehavior.ts index ec17cacb2b8d2..f860df9606786 100644 --- a/packages/main/src/types/TableSelectionBehavior.ts +++ b/packages/main/src/types/TableSelectionBehavior.ts @@ -2,7 +2,7 @@ * Selection behavior of the `ui5-table` selection components. * * @public - * @since 2.11 + * @since 2.11.0 */ enum TableSelectionBehavior { /** diff --git a/packages/main/src/types/TableSelectionMultiHeaderSelector.ts b/packages/main/src/types/TableSelectionMultiHeaderSelector.ts index 94c2f427a4c87..259592ecc3f40 100644 --- a/packages/main/src/types/TableSelectionMultiHeaderSelector.ts +++ b/packages/main/src/types/TableSelectionMultiHeaderSelector.ts @@ -2,7 +2,7 @@ * Selectors of the table header row in multi-selection scenarios. * * @public - * @since 2.12 + * @since 2.12.0 */ enum TableSelectionMultiHeaderSelector { /** From 1f0da8f6431c17c4704db2f4249833e5101e624c Mon Sep 17 00:00:00 2001 From: Nayden Naydenov Date: Wed, 26 Aug 2026 12:04:55 +0300 Subject: [PATCH 2/5] chore: add new jsdoc tag to the components. --- packages/ai/src/Button.ts | 1 + packages/compat/src/Table.ts | 4 ++++ packages/fiori/src/DynamicPage.ts | 2 ++ packages/fiori/src/MediaGallery.ts | 1 + packages/fiori/src/NotificationList.ts | 2 ++ packages/fiori/src/ProductSwitch.ts | 1 + packages/fiori/src/Search.ts | 5 +++++ packages/fiori/src/ShellBar.ts | 4 ++++ packages/fiori/src/SideNavigation.ts | 3 +++ packages/fiori/src/Timeline.ts | 2 ++ packages/fiori/src/UploadCollection.ts | 1 + packages/fiori/src/UserMenu.ts | 3 +++ packages/fiori/src/UserSettingsDialog.ts | 6 ++++++ packages/fiori/src/ViewSettingsDialog.ts | 5 +++++ packages/fiori/src/Wizard.ts | 1 + packages/main/src/Avatar.ts | 1 + packages/main/src/Breadcrumbs.ts | 1 + packages/main/src/Button.ts | 1 + packages/main/src/Calendar.ts | 3 +++ packages/main/src/CalendarLegend.ts | 1 + packages/main/src/Card.ts | 1 + packages/main/src/ColorPalette.ts | 1 + packages/main/src/ComboBox.ts | 3 +++ packages/main/src/Form.ts | 2 ++ packages/main/src/Input.ts | 4 ++++ packages/main/src/List.ts | 3 +++ packages/main/src/Menu.ts | 3 +++ packages/main/src/MultiComboBox.ts | 3 +++ packages/main/src/SegmentedButton.ts | 1 + packages/main/src/Select.ts | 3 +++ packages/main/src/TabContainer.ts | 2 ++ packages/main/src/Table.ts | 13 +++++++++++++ packages/main/src/Toolbar.ts | 6 ++++++ packages/main/src/Tree.ts | 2 ++ 34 files changed, 95 insertions(+) diff --git a/packages/ai/src/Button.ts b/packages/ai/src/Button.ts index aaa897fde48b4..833f96a59bac6 100644 --- a/packages/ai/src/Button.ts +++ b/packages/ai/src/Button.ts @@ -60,6 +60,7 @@ type AIButtonAccessibilityAttributes = { root?: AIButtonRootAccessibilityAttribu * @public * @experimental The **@ui5/webcomponents-ai** package (including Button and ButtonState) is under active development and considered experimental. Component APIs are subject to change. * Furthermore, the package supports **Horizon** themes only. + * @ui5subcomponent ButtonState */ @customElement({ diff --git a/packages/compat/src/Table.ts b/packages/compat/src/Table.ts index 7f7def495ae8a..13f547e6a2b16 100644 --- a/packages/compat/src/Table.ts +++ b/packages/compat/src/Table.ts @@ -170,6 +170,10 @@ enum TableFocusTargetElement { * @extends UI5Element * @public * @deprecated Deprecated as of version 2.12.0, use `@ui5/webcomponents/dist/Table.js` instead. + * @ui5subcomponent TableCell + * @ui5subcomponent TableColumn + * @ui5subcomponent TableGroupRow + * @ui5subcomponent TableRow */ @customElement({ tag: "ui5-table", diff --git a/packages/fiori/src/DynamicPage.ts b/packages/fiori/src/DynamicPage.ts index 05c203029d215..9f8966407c663 100644 --- a/packages/fiori/src/DynamicPage.ts +++ b/packages/fiori/src/DynamicPage.ts @@ -118,6 +118,8 @@ const SCROLL_THRESHOLD = 10; // px * @csspart content - Used to style the content of the component * @csspart fit-content - Used to style the fit content container of the component. * @csspart footer - Used to style the footer of the component + * @ui5subcomponent DynamicPageHeader + * @ui5subcomponent DynamicPageTitle */ @customElement({ tag: "ui5-dynamic-page", diff --git a/packages/fiori/src/MediaGallery.ts b/packages/fiori/src/MediaGallery.ts index 1c41ef2f396ef..8acb8d1171864 100644 --- a/packages/fiori/src/MediaGallery.ts +++ b/packages/fiori/src/MediaGallery.ts @@ -84,6 +84,7 @@ const COLUMNS_COUNT: Record = { * @extends UI5Element * @public * @since 1.1.0 + * @ui5subcomponent MediaGalleryItem */ @customElement({ tag: "ui5-media-gallery", diff --git a/packages/fiori/src/NotificationList.ts b/packages/fiori/src/NotificationList.ts index 4b4e35d61131a..b2232a211f4b4 100644 --- a/packages/fiori/src/NotificationList.ts +++ b/packages/fiori/src/NotificationList.ts @@ -64,6 +64,8 @@ type NotificationItemCloseEventDetail = NotificationItemEventDetail; * @extends UI5Element * @since 2.0.0 * @public + * @ui5subcomponent NotificationListGroupItem + * @ui5subcomponent NotificationListItem */ @customElement({ tag: "ui5-notification-list", diff --git a/packages/fiori/src/ProductSwitch.ts b/packages/fiori/src/ProductSwitch.ts index d5b9fc853b1ca..a448ee018f916 100644 --- a/packages/fiori/src/ProductSwitch.ts +++ b/packages/fiori/src/ProductSwitch.ts @@ -62,6 +62,7 @@ interface IProductSwitchItem extends HTMLElement, ITabbable { * @extends UI5Element * @public * @since 1.0.0 + * @ui5subcomponent ProductSwitchItem */ @customElement({ tag: "ui5-product-switch", diff --git a/packages/fiori/src/Search.ts b/packages/fiori/src/Search.ts index 2cf15fa3563c6..b42199bb7538b 100755 --- a/packages/fiori/src/Search.ts +++ b/packages/fiori/src/Search.ts @@ -77,6 +77,11 @@ type SearchEventDetails = { * @experimental * @csspart popover - Used to style the suggestions popup * @since 2.24.0 + * @ui5subcomponent SearchItem + * @ui5subcomponent SearchItemGroup + * @ui5subcomponent SearchItemShowMore + * @ui5subcomponent SearchMessageArea + * @ui5subcomponent SearchScope */ @customElement({ tag: "ui5-search", diff --git a/packages/fiori/src/ShellBar.ts b/packages/fiori/src/ShellBar.ts index b54e795a65bb6..b95e264fbdfc4 100644 --- a/packages/fiori/src/ShellBar.ts +++ b/packages/fiori/src/ShellBar.ts @@ -179,6 +179,10 @@ type ShellBarSearchFieldClearEventDetail = { * @extends UI5Element * @public * @since 1.0.0 + * @ui5subcomponent ShellBarBranding + * @ui5subcomponent ShellBarItem + * @ui5subcomponent ShellBarSearch + * @ui5subcomponent ShellBarSpacer */ @customElement({ diff --git a/packages/fiori/src/SideNavigation.ts b/packages/fiori/src/SideNavigation.ts index 9538387870876..8976eddf024cd 100644 --- a/packages/fiori/src/SideNavigation.ts +++ b/packages/fiori/src/SideNavigation.ts @@ -109,6 +109,9 @@ type PopupSideNavigationItem = SideNavigationItem & { associatedItem: SideNaviga * @extends UI5Element * @since 1.0.0 * @public + * @ui5subcomponent SideNavigationGroup + * @ui5subcomponent SideNavigationItem + * @ui5subcomponent SideNavigationSubItem */ @customElement({ diff --git a/packages/fiori/src/Timeline.ts b/packages/fiori/src/Timeline.ts index 710dfae2a19d6..874820d44d7e0 100644 --- a/packages/fiori/src/Timeline.ts +++ b/packages/fiori/src/Timeline.ts @@ -91,6 +91,8 @@ const GROWING_WITH_SCROLL_DEBOUNCE_RATE = 250; // ms * @extends UI5Element * @public * @since 1.0.0 + * @ui5subcomponent TimelineGroupItem + * @ui5subcomponent TimelineItem */ @customElement({ tag: "ui5-timeline", diff --git a/packages/fiori/src/UploadCollection.ts b/packages/fiori/src/UploadCollection.ts index ad31cd1ac5893..a4a3e896887a9 100644 --- a/packages/fiori/src/UploadCollection.ts +++ b/packages/fiori/src/UploadCollection.ts @@ -57,6 +57,7 @@ type UploadCollectionItemDeleteEventDetail = { * @extends UI5Element * @public * @since 1.0.0 + * @ui5subcomponent UploadCollectionItem */ @customElement({ tag: "ui5-upload-collection", diff --git a/packages/fiori/src/UserMenu.ts b/packages/fiori/src/UserMenu.ts index e8b26d0be842a..61ff34b297cd8 100644 --- a/packages/fiori/src/UserMenu.ts +++ b/packages/fiori/src/UserMenu.ts @@ -63,6 +63,9 @@ type UserMenuOtherAccountClickEventDetail = { * @extends UI5Element * @public * @since 2.5.0 + * @ui5subcomponent UserMenuAccount + * @ui5subcomponent UserMenuItem + * @ui5subcomponent UserMenuItemGroup */ @customElement({ diff --git a/packages/fiori/src/UserSettingsDialog.ts b/packages/fiori/src/UserSettingsDialog.ts index ca76e4b50f819..2a10d5459ca1b 100644 --- a/packages/fiori/src/UserSettingsDialog.ts +++ b/packages/fiori/src/UserSettingsDialog.ts @@ -53,6 +53,12 @@ type UserSettingsBeforeCloseEventDetail = PopupBeforeCloseEventDetail; * @extends UI5Element * @public * @since 2.8.0 + * @ui5subcomponent UserSettingsAccountView + * @ui5subcomponent UserSettingsAppearanceView + * @ui5subcomponent UserSettingsAppearanceViewGroup + * @ui5subcomponent UserSettingsAppearanceViewItem + * @ui5subcomponent UserSettingsItem + * @ui5subcomponent UserSettingsView */ @customElement({ tag: "ui5-user-settings-dialog", diff --git a/packages/fiori/src/ViewSettingsDialog.ts b/packages/fiori/src/ViewSettingsDialog.ts index 197230c43a10d..b303b2f7850f5 100644 --- a/packages/fiori/src/ViewSettingsDialog.ts +++ b/packages/fiori/src/ViewSettingsDialog.ts @@ -122,6 +122,11 @@ type ViewSettingsDialogInternalMode = `${ViewSettingsDialogMode}` | ViewSettings * @since 1.0.0 * @public * @csspart header - Used to style the header. + * @ui5subcomponent FilterItem + * @ui5subcomponent FilterItemOption + * @ui5subcomponent GroupItem + * @ui5subcomponent SortItem + * @ui5subcomponent ViewSettingsDialogCustomTab */ @customElement({ tag: "ui5-view-settings-dialog", diff --git a/packages/fiori/src/Wizard.ts b/packages/fiori/src/Wizard.ts index 79eb517a548d1..68100cc0de027 100644 --- a/packages/fiori/src/Wizard.ts +++ b/packages/fiori/src/Wizard.ts @@ -173,6 +173,7 @@ type StepInfo = { * @public * @csspart navigator - Used to style the progress navigator of the `ui5-wizard`. * @csspart step-content - Used to style a `ui5-wizard-step` container. + * @ui5subcomponent WizardStep */ @customElement({ tag: "ui5-wizard", diff --git a/packages/main/src/Avatar.ts b/packages/main/src/Avatar.ts index 6d4d2192968d7..bb9d7fd161cc8 100644 --- a/packages/main/src/Avatar.ts +++ b/packages/main/src/Avatar.ts @@ -60,6 +60,7 @@ type AvatarAccessibilityAttributes = Pick; * @since 1.0.0 * @implements {IAvatarGroupItem} * @public + * @ui5subcomponent AvatarBadge */ @customElement({ tag: "ui5-avatar", diff --git a/packages/main/src/Breadcrumbs.ts b/packages/main/src/Breadcrumbs.ts index 778ebc858c34b..c616bf0797d9b 100644 --- a/packages/main/src/Breadcrumbs.ts +++ b/packages/main/src/Breadcrumbs.ts @@ -88,6 +88,7 @@ type FocusAdaptor = ITabbable & { * @implements {IToolbarItemContent} * @public * @since 1.0.0 + * @ui5subcomponent BreadcrumbsItem */ @customElement({ tag: "ui5-breadcrumbs", diff --git a/packages/main/src/Button.ts b/packages/main/src/Button.ts index 7d8a2ab07e0a1..173e6fe68e9b4 100644 --- a/packages/main/src/Button.ts +++ b/packages/main/src/Button.ts @@ -105,6 +105,7 @@ type ButtonClickEventDetail = { * @extends UI5Element * @implements { IButton } * @public + * @ui5subcomponent ButtonBadge */ @customElement({ tag: "ui5-button", diff --git a/packages/main/src/Calendar.ts b/packages/main/src/Calendar.ts index c27f7d6141fb3..4b701b39dae58 100644 --- a/packages/main/src/Calendar.ts +++ b/packages/main/src/Calendar.ts @@ -225,6 +225,9 @@ type DisabledDateRangeT = { * @csspart calendar-header-middle-button - Used to style the calendar header middle buttons (month/year/year-range buttons). * @csspart calendar-header-arrow-button - Used to style the calendar header navigation arrow buttons (previous/next buttons). * @since 1.0.0 + * @ui5subcomponent CalendarDate + * @ui5subcomponent CalendarDateRange + * @ui5subcomponent SpecialCalendarDate */ @customElement({ tag: "ui5-calendar", diff --git a/packages/main/src/CalendarLegend.ts b/packages/main/src/CalendarLegend.ts index cde10c6f05e6b..2fb38df3638ec 100644 --- a/packages/main/src/CalendarLegend.ts +++ b/packages/main/src/CalendarLegend.ts @@ -43,6 +43,7 @@ type CalendarLegendItemSelectionChangeEventDetail = { * @extends UI5Element * @public * @since 1.23.0 + * @ui5subcomponent CalendarLegendItem */ @customElement({ tag: "ui5-calendar-legend", diff --git a/packages/main/src/Card.ts b/packages/main/src/Card.ts index 292e6b165f1fe..e61f8e55bc3ae 100644 --- a/packages/main/src/Card.ts +++ b/packages/main/src/Card.ts @@ -39,6 +39,7 @@ import cardCss from "./generated/themes/Card.css.js"; * @public * @csspart root - Used to style the root DOM element of the card component * @csspart content - Used to style the content of the card + * @ui5subcomponent CardHeader */ @customElement({ tag: "ui5-card", diff --git a/packages/main/src/ColorPalette.ts b/packages/main/src/ColorPalette.ts index 9549c0a40e815..e239adf29a6c2 100644 --- a/packages/main/src/ColorPalette.ts +++ b/packages/main/src/ColorPalette.ts @@ -78,6 +78,7 @@ type ColorPaletteItemClickEventDetail = { * @extends UI5Element * @since 1.0.0 * @public + * @ui5subcomponent ColorPaletteItem */ @customElement({ tag: "ui5-color-palette", diff --git a/packages/main/src/ComboBox.ts b/packages/main/src/ComboBox.ts index b876abc884a00..33ff26be1ee42 100644 --- a/packages/main/src/ComboBox.ts +++ b/packages/main/src/ComboBox.ts @@ -199,6 +199,9 @@ type ComboBoxSelectionChangeEventDetail = { * @extends UI5Element * @public * @since 1.0.0 + * @ui5subcomponent ComboBoxItem + * @ui5subcomponent ComboBoxItemCustom + * @ui5subcomponent ComboBoxItemGroup */ @customElement({ tag: "ui5-combobox", diff --git a/packages/main/src/Form.ts b/packages/main/src/Form.ts index e099040b1fb9a..32764f98a05b1 100644 --- a/packages/main/src/Form.ts +++ b/packages/main/src/Form.ts @@ -188,6 +188,8 @@ type ItemsInfo = { * @public * @since 2.0.0 * @extends UI5Element + * @ui5subcomponent FormGroup + * @ui5subcomponent FormItem */ @customElement({ tag: "ui5-form", diff --git a/packages/main/src/Input.ts b/packages/main/src/Input.ts index 60602089a8b28..4e8b519385590 100644 --- a/packages/main/src/Input.ts +++ b/packages/main/src/Input.ts @@ -206,6 +206,10 @@ type InputSuggestionScrollEventDetail = { * @csspart root - Used to style the root DOM element of the Input component * @csspart input - Used to style the native input element * @csspart clear-icon - Used to style the clear icon, which can be pressed to clear user input text + * @ui5subcomponent InputIcon + * @ui5subcomponent SuggestionItem + * @ui5subcomponent SuggestionItemCustom + * @ui5subcomponent SuggestionItemGroup */ @customElement({ tag: "ui5-input", diff --git a/packages/main/src/List.ts b/packages/main/src/List.ts index 6b3b3fcc31294..d78e51f6fba1c 100644 --- a/packages/main/src/List.ts +++ b/packages/main/src/List.ts @@ -213,6 +213,9 @@ type ListAccessibilityAttributes = { * @public * @csspart growing-button - Used to style the button, that is used for growing of the component * @csspart growing-button-inner - Used to style the button inner element + * @ui5subcomponent ListItemCustom + * @ui5subcomponent ListItemGroup + * @ui5subcomponent ListItemStandard */ @customElement({ tag: "ui5-list", diff --git a/packages/main/src/Menu.ts b/packages/main/src/Menu.ts index 39b8fb5927e91..615a9ab7e07ea 100644 --- a/packages/main/src/Menu.ts +++ b/packages/main/src/Menu.ts @@ -115,6 +115,9 @@ type MenuBeforeCloseEventDetail = { escPressed: boolean }; * @extends UI5Element * @since 1.3.0 * @public + * @ui5subcomponent MenuItem + * @ui5subcomponent MenuItemGroup + * @ui5subcomponent MenuSeparator */ @customElement({ tag: "ui5-menu", diff --git a/packages/main/src/MultiComboBox.ts b/packages/main/src/MultiComboBox.ts index f0e376bfff6f5..47eb1819954e2 100644 --- a/packages/main/src/MultiComboBox.ts +++ b/packages/main/src/MultiComboBox.ts @@ -191,6 +191,9 @@ type MultiComboBoxValueStateChangeEventDetail = { * @public * @since 1.0.0 * @csspart token-\{index\} - Used to style each token(where `token-0` corresponds to the first item) + * @ui5subcomponent MultiComboBoxItem + * @ui5subcomponent MultiComboBoxItemCustom + * @ui5subcomponent MultiComboBoxItemGroup */ @customElement({ tag: "ui5-multi-combobox", diff --git a/packages/main/src/SegmentedButton.ts b/packages/main/src/SegmentedButton.ts index ce2273fcebeb0..c98f272984ebe 100644 --- a/packages/main/src/SegmentedButton.ts +++ b/packages/main/src/SegmentedButton.ts @@ -64,6 +64,7 @@ type SegmentedButtonSelectionChangeEventDetail = { * @extends UI5Element * @since 1.0.0 * @public + * @ui5subcomponent SegmentedButtonItem */ @customElement({ tag: "ui5-segmented-button", diff --git a/packages/main/src/Select.ts b/packages/main/src/Select.ts index 5cbeaf38dd057..0d6cae9354c63 100644 --- a/packages/main/src/Select.ts +++ b/packages/main/src/Select.ts @@ -168,6 +168,9 @@ const isPrintableCharacter = (e: KeyboardEvent) => { * @public * @csspart popover - Used to style the popover element * @since 1.0.0 + * @ui5subcomponent Option + * @ui5subcomponent OptionCustom + * @ui5subcomponent OptionGroup */ @customElement({ tag: "ui5-select", diff --git a/packages/main/src/TabContainer.ts b/packages/main/src/TabContainer.ts index 30c79241f66dc..a8846a4f2f861 100644 --- a/packages/main/src/TabContainer.ts +++ b/packages/main/src/TabContainer.ts @@ -154,6 +154,8 @@ interface ITab extends UI5Element { * @public * @csspart content - Used to style the content of the component * @csspart tabstrip - Used to style the tabstrip of the component + * @ui5subcomponent Tab + * @ui5subcomponent TabSeparator */ @customElement({ tag: "ui5-tabcontainer", diff --git a/packages/main/src/Table.ts b/packages/main/src/Table.ts index 9fcc3bf18e3c1..06ffee8ee2c40 100644 --- a/packages/main/src/Table.ts +++ b/packages/main/src/Table.ts @@ -184,6 +184,19 @@ type TableRowActionClickEventDetail = { * @extends UI5Element * @since 2.0.0 * @public + * @ui5subcomponent TableCell + * @ui5subcomponent TableGroupRow + * @ui5subcomponent TableGrowing + * @ui5subcomponent TableHeaderCell + * @ui5subcomponent TableHeaderCellActionAI + * @ui5subcomponent TableHeaderRow + * @ui5subcomponent TableRow + * @ui5subcomponent TableRowAction + * @ui5subcomponent TableRowActionNavigation + * @ui5subcomponent TableSelection + * @ui5subcomponent TableSelectionMulti + * @ui5subcomponent TableSelectionSingle + * @ui5subcomponent TableVirtualizer */ @customElement({ tag: "ui5-table", diff --git a/packages/main/src/Toolbar.ts b/packages/main/src/Toolbar.ts index 977fbab7554ed..84e5d866698ac 100644 --- a/packages/main/src/Toolbar.ts +++ b/packages/main/src/Toolbar.ts @@ -75,6 +75,12 @@ function parsePxValue(styleSet: CSSStyleDeclaration, propertyName: string): numb * @extends UI5Element * @public * @since 1.17.0 + * @ui5subcomponent ToolbarButton + * @ui5subcomponent ToolbarItem + * @ui5subcomponent ToolbarSelect + * @ui5subcomponent ToolbarSelectOption + * @ui5subcomponent ToolbarSeparator + * @ui5subcomponent ToolbarSpacer */ @customElement({ tag: "ui5-toolbar", diff --git a/packages/main/src/Tree.ts b/packages/main/src/Tree.ts index 5277f1b95c3ce..fdba1bde01481 100644 --- a/packages/main/src/Tree.ts +++ b/packages/main/src/Tree.ts @@ -101,6 +101,8 @@ type WalkCallback = (item: TreeItemBase, level: number, index: number) => void; * @extends UI5Element * @public * @since 1.0.0 + * @ui5subcomponent TreeItem + * @ui5subcomponent TreeItemCustom */ @customElement({ tag: "ui5-tree", From 864f0f70939e2521474a6a0c59e9cd03cfa05ef4 Mon Sep 17 00:00:00 2001 From: Nayden Naydenov Date: Wed, 26 Aug 2026 12:05:10 +0300 Subject: [PATCH 3/5] chore: enable the jsdoc tag --- .../cem/custom-elements-manifest.config.mjs | 33 +++++++++++++++---- packages/tools/lib/cem/schema-internal.json | 7 ++++ packages/tools/lib/cem/types-internal.d.ts | 4 +++ packages/tools/lib/cem/utils.mjs | 31 +++++++++++++---- 4 files changed, 62 insertions(+), 13 deletions(-) diff --git a/packages/tools/lib/cem/custom-elements-manifest.config.mjs b/packages/tools/lib/cem/custom-elements-manifest.config.mjs index 071178d9b3fba..1d6a186b7aa55 100644 --- a/packages/tools/lib/cem/custom-elements-manifest.config.mjs +++ b/packages/tools/lib/cem/custom-elements-manifest.config.mjs @@ -6,6 +6,7 @@ import { getDeprecatedStatus, getExperimentalStatus, getSinceStatus, + getSubcomponentStatus, getPrivacyStatus, getReference, validateJSDocComment, @@ -105,9 +106,10 @@ function processClass(ts, classNode, moduleDoc) { currClass.kind = "class"; currClass.deprecated = getDeprecatedStatus(classParsedJsDoc); currClass._ui5experimental = getExperimentalStatus(classParsedJsDoc); - currClass._ui5since = getSinceStatus(classParsedJsDoc); + currClass._ui5since = getSinceStatus(classParsedJsDoc, moduleDoc.path); currClass._ui5privacy = getPrivacyStatus(classParsedJsDoc); currClass._ui5abstract = hasTag(classParsedJsDoc, "abstract") ? true : undefined; + currClass._ui5subcomponents = getSubcomponentStatus(classParsedJsDoc); currClass.description = normalizeDescription(classParsedJsDoc.description || findTag(classParsedJsDoc, "class")?.description); currClass._ui5implements = findAllTags(classParsedJsDoc, "implements") .map(tag => { @@ -210,7 +212,7 @@ function processClass(ts, classNode, moduleDoc) { const memberParsedJsDoc = parse(classNodeMemberJSdoc?.getText())[0]; - member._ui5since = getSinceStatus(memberParsedJsDoc); + member._ui5since = getSinceStatus(memberParsedJsDoc, moduleDoc.path); member.deprecated === "true" && (member.deprecated = true) // Slots with accessors are treated like fields by the tool, so we have to convert them into slots. @@ -386,7 +388,7 @@ function processInterface(ts, interfaceNode, moduleDoc) { description: normalizeDescription(interfaceParsedJsDoc?.description), _ui5experimental: getExperimentalStatus(interfaceParsedJsDoc), _ui5privacy: getPrivacyStatus(interfaceParsedJsDoc), - _ui5since: getSinceStatus(interfaceParsedJsDoc), + _ui5since: getSinceStatus(interfaceParsedJsDoc, moduleDoc.path), deprecated: getDeprecatedStatus(interfaceParsedJsDoc), }); } @@ -407,7 +409,7 @@ function processEnum(ts, enumNode, moduleDoc) { description: normalizeDescription(enumJSdoc?.comment), _ui5experimental: getExperimentalStatus(enumParsedJsDoc), _ui5privacy: getPrivacyStatus(enumParsedJsDoc), - _ui5since: getSinceStatus(enumParsedJsDoc), + _ui5since: getSinceStatus(enumParsedJsDoc, moduleDoc.path), deprecated: getDeprecatedStatus(enumParsedJsDoc) || undefined, members: (enumNode?.members || []).map(member => { const memberJSdoc = member?.jsDoc?.[0]; @@ -422,7 +424,7 @@ function processEnum(ts, enumNode, moduleDoc) { kind: "field", static: true, privacy: getPrivacyStatus(memberParsedJsDoc), - _ui5since: getSinceStatus(memberParsedJsDoc), + _ui5since: getSinceStatus(memberParsedJsDoc, moduleDoc.path), description: memberJSdoc?.comment, default: member.initializer?.text, deprecated: getDeprecatedStatus(memberParsedJsDoc), @@ -447,7 +449,7 @@ const processPublicAPI = object => { if (((key === "privacy" && object[key] !== "public") || (key === "_ui5privacy" && object[key] !== "public")) && !object.customElement) { return true; } else if (typeof object[key] === "object") { - if (key === "cssParts" || key === "cssStates" || key === "attributes" || key === "_ui5implements") { + if (key === "cssParts" || key === "cssStates" || key === "attributes" || key === "_ui5implements" || key === "_ui5subcomponents") { continue; } @@ -591,6 +593,25 @@ export default { }) }); + const publicCustomElements = new Set( + customElementsManifest.modules.flatMap(m => m.declarations) + .filter(d => d.customElement && d.tagName && d._ui5privacy === "public") + .map(d => d.name) + ); + + customElementsManifest.modules.forEach(moduleDoc => { + moduleDoc.declarations.forEach(declaration => { + declaration._ui5subcomponents?.forEach(name => { + if (!publicCustomElements.has(name)) { + logDocumentationError( + moduleDoc.path?.replace(/^dist/, "src").replace(/\.js$/, ".ts"), + `@ui5subcomponent '${name}' is not a public custom element with a tag name in this package.` + ); + } + }); + }); + }); + if (devMode) { displayDocumentationErrors(); } diff --git a/packages/tools/lib/cem/schema-internal.json b/packages/tools/lib/cem/schema-internal.json index 1ab912130e20c..b9906639c0f64 100644 --- a/packages/tools/lib/cem/schema-internal.json +++ b/packages/tools/lib/cem/schema-internal.json @@ -523,6 +523,13 @@ "_ui5abstract": { "type": "boolean" }, + "_ui5subcomponents": { + "description": "Names of sub-components that belong to this component's documentation group", + "items": { + "type": "string" + }, + "type": "array" + }, "_ui5privacy": { "$ref": "#/definitions/Privacy" }, diff --git a/packages/tools/lib/cem/types-internal.d.ts b/packages/tools/lib/cem/types-internal.d.ts index eba21ddfc22db..1bd2890522d80 100644 --- a/packages/tools/lib/cem/types-internal.d.ts +++ b/packages/tools/lib/cem/types-internal.d.ts @@ -224,6 +224,10 @@ export interface CustomElementDeclaration * Marks when the field was introduced */ _ui5since?: string + /** + * Names of sub-components that belong to this component's documentation group + */ + _ui5subcomponents?: string[] } /** diff --git a/packages/tools/lib/cem/utils.mjs b/packages/tools/lib/cem/utils.mjs index 95e57ca59729a..f87cbc087aadc 100644 --- a/packages/tools/lib/cem/utils.mjs +++ b/packages/tools/lib/cem/utils.mjs @@ -67,13 +67,27 @@ const getTypeRefs = (ts, node, member) => { return typeRefs?.length ? typeRefs : undefined; }; -const getSinceStatus = (jsdocComment) => { +const sinceVersionRegExp = /^\d+\.\d+\.\d+$/; + +const getSinceStatus = (jsdocComment, modulePath) => { const sinceTag = findTag(jsdocComment, "since"); - return sinceTag - ? sinceTag.description - ? `${sinceTag.name} ${sinceTag.description}` - : sinceTag.name - : undefined; + if (!sinceTag) return undefined; + + const value = sinceTag.description + ? `${sinceTag.name} ${sinceTag.description}` + : sinceTag.name; + + if (modulePath && !sinceVersionRegExp.test(value)) { + logDocumentationError(modulePath, `@since value "${value}" must follow the pattern number.number.number (e.g. 2.0.0)`); + } + + return value; +}; + +const getSubcomponentStatus = (jsdocComment) => { + const tags = findAllTags(jsdocComment, "ui5subcomponent"); + if (!tags.length) return undefined; + return tags.map(tag => tag.name).filter(Boolean); }; const getPrivacyStatus = (jsdocComment) => { @@ -240,7 +254,7 @@ const allowedTags = { event: [...commonTags, "param", "native", "allowPreventDefault"], eventParam: [...commonTags], method: [...commonTags, "param", "returns", "override"], - class: [...commonTags, "constructor", "class", "abstract", "experimental", "implements", "extends", "slot", "csspart", "cssstate", "cssState"], + class: [...commonTags, "constructor", "class", "abstract", "experimental", "implements", "extends", "slot", "csspart", "cssstate", "cssState", "ui5subcomponent"], enum: [...commonTags, "experimental",], enumMember: [...commonTags, "experimental",], interface: [...commonTags, "experimental",], @@ -335,6 +349,8 @@ const validateJSDocTag = (tag) => { return !tag.type && tag.name && tag.description; case "since": return !tag.type && tag.name; + case "ui5subcomponent": + return !tag.type && tag.name && !tag.description; case "returns": return !tag.type && tag.name; case "default": @@ -411,6 +427,7 @@ const formatSlotTypes = (typeText) => { export { getPrivacyStatus, getSinceStatus, + getSubcomponentStatus, getDeprecatedStatus, getExperimentalStatus, getType, From 98714aaacb2007995d719462cb55a8aaa5178408 Mon Sep 17 00:00:00 2001 From: Nayden Naydenov Date: Wed, 26 Aug 2026 13:04:39 +0300 Subject: [PATCH 4/5] chore: generate component pages --- packages/website/.gitignore | 12 +- .../component-file.mjs | 31 + .../api-reference-generation/components.mjs | 163 +- .../build-scripts/clean-components.mjs | 15 + .../Basic/Basic.md | 0 .../Basic/main.js | 0 .../Basic/sample.html | 0 .../Basic/sample.tsx | 0 .../GroupItems/{Basic.md => GroupItems.md} | 0 .../ScrollMode/{Scroll.md => ScrollMode.md} | 0 .../MultiLine/{Basic.md => MultiLine.md} | 0 .../website/docs/components/ai/samples.json | 48 + .../docs/components/compat/samples.json | 46 + .../docs/components/fiori/samples.json | 414 +++++ .../website/docs/components/main/samples.json | 1571 +++++++++++++++++ packages/website/package.json | 2 +- 16 files changed, 2258 insertions(+), 44 deletions(-) create mode 100644 packages/website/build-scripts/clean-components.mjs rename packages/website/docs/_samples/fiori/{BardcodeScannerDialog => BarcodeScannerDialog}/Basic/Basic.md (100%) rename packages/website/docs/_samples/fiori/{BardcodeScannerDialog => BarcodeScannerDialog}/Basic/main.js (100%) rename packages/website/docs/_samples/fiori/{BardcodeScannerDialog => BarcodeScannerDialog}/Basic/sample.html (100%) rename packages/website/docs/_samples/fiori/{BardcodeScannerDialog => BarcodeScannerDialog}/Basic/sample.tsx (100%) rename packages/website/docs/_samples/fiori/NotificationList/GroupItems/{Basic.md => GroupItems.md} (100%) rename packages/website/docs/_samples/main/Table/ScrollMode/{Scroll.md => ScrollMode.md} (100%) rename packages/website/docs/_samples/main/Tokenizer/MultiLine/{Basic.md => MultiLine.md} (100%) create mode 100644 packages/website/docs/components/ai/samples.json create mode 100644 packages/website/docs/components/compat/samples.json create mode 100644 packages/website/docs/components/fiori/samples.json create mode 100644 packages/website/docs/components/main/samples.json diff --git a/packages/website/.gitignore b/packages/website/.gitignore index 43c90ad6e9dcd..d144590d5eba1 100644 --- a/packages/website/.gitignore +++ b/packages/website/.gitignore @@ -6,10 +6,14 @@ src/components/Editor/ui5-autocomplete.json # Production /build -/docs/components/fiori -/docs/components/main -/docs/components/compat -/docs/components/ai +/docs/components/fiori/* +!/docs/components/fiori/samples.json +/docs/components/main/* +!/docs/components/main/samples.json +/docs/components/compat/* +!/docs/components/compat/samples.json +/docs/components/ai/* +!/docs/components/ai/samples.json /docs/docs/ /docs/samples/**/*.mdx /local-cdn diff --git a/packages/website/build-scripts/api-reference-generation/component-file.mjs b/packages/website/build-scripts/api-reference-generation/component-file.mjs index 9ba5c22899497..72174decd9ccc 100644 --- a/packages/website/build-scripts/api-reference-generation/component-file.mjs +++ b/packages/website/build-scripts/api-reference-generation/component-file.mjs @@ -1,3 +1,30 @@ +import { readFileSync } from "fs"; +import { resolve } from "path"; + +const { version: currentVersion } = JSON.parse(readFileSync(resolve("./package.json"), { encoding: "utf-8" })); + +const newComponentCssClass = "newComponentBadge"; + +// Returns true if sinceVersion is within the last minorWindow minor releases of currentVersion. +const isNewComponent = (sinceVersion, minorWindow = 6) => { + if (!sinceVersion) return false; + const parse = v => { + const [major, minor] = v.replace(/-.*$/, "").split(".").map(Number); + return { major, minor }; + }; + const current = parse(currentVersion); + const since = parse(sinceVersion); + if (since.major !== current.major) return false; + return current.minor - since.minor < minorWindow; +}; + +const addNewComponentClassName = (fileContent, declaration) => { + if (!isNewComponent(declaration._ui5since)) { + return fileContent; + } + return enhanceFrontMatter(fileContent, "sidebar_class_name", newComponentCssClass); +}; + const parseDeclarationDescription = (description) => { if (!description) { return ""; @@ -423,6 +450,10 @@ ${parseDeclarationDescription(declaration.description)}`) fileContent = fileContent.replace("<%COMPONENT_OVERVIEW%>", parseDeclarationDescription(declaration.description)) } + if (!declaration.deprecated) { + fileContent = addNewComponentClassName(fileContent, declaration); + } + const metadataSections = [ "field", "slot", diff --git a/packages/website/build-scripts/api-reference-generation/components.mjs b/packages/website/build-scripts/api-reference-generation/components.mjs index bc03a7f344276..90e32fb444756 100644 --- a/packages/website/build-scripts/api-reference-generation/components.mjs +++ b/packages/website/build-scripts/api-reference-generation/components.mjs @@ -1,58 +1,143 @@ import fs from "fs" import path from "path" import { parseComponentDeclaration } from "./component-file.mjs" -import { removeFileExtension } from "./utils.mjs"; -import { findDeclaration, realPackagesName } from "./manifest.mjs"; +import { findDeclaration, realPackagesName } from "./manifest.mjs" const packages = ["main", "fiori", "compat", "ai"]; -const generateComponents = (source = "./docs/_components_pages", level = 1) => { - const sourcePath = path.resolve(source); - const targetPath = source.replace("_components_pages", "components"); +const samplesCache = new Map(); - if (!fs.existsSync(targetPath)) { - fs.mkdirSync(targetPath, { recursive: true }); +const getSamples = (packageName) => { + if (!samplesCache.has(packageName)) { + const jsonPath = path.resolve(`./docs/components/${packageName}/samples.json`); + try { + samplesCache.set(packageName, JSON.parse(fs.readFileSync(jsonPath, { encoding: "utf-8" }))); + } catch { + samplesCache.set(packageName, {}); + } } + return samplesCache.get(packageName); +}; - const folderFiles = fs.readdirSync(sourcePath); +const buildSamplesImports = (packageName, componentName, samples, samplesPrefix) => { + return samples + .map(s => { + const importName = s.name.replace(/[^a-zA-Z0-9]/g, "_"); + return `import ${importName} from "${samplesPrefix}_samples/${packageName}/${componentName}/${s.name}/${s.name}.md";`; + }) + .join("\n"); +}; - for (let file of folderFiles) { - const isDirectory = fs.lstatSync(path.join(sourcePath, file)).isDirectory(); - const fileName = removeFileExtension(file); +const buildSamplesContent = (samples) => { + const basicSample = samples.find(s => s.isBasic); + const moreSamples = samples.filter(s => !s.isBasic); - if (isDirectory) { - if (!packages.includes(file)) { - fs.mkdirSync(path.join(targetPath, file), { recursive: true }); - fs.writeFileSync(path.join(targetPath, file, "_category_.json"), `{ - "label": "${fileName}", - "link": null -}`) - } + let content = ""; - generateComponents(path.join(sourcePath, file), level + 1); - } else { - let packageName; - - if (sourcePath.includes("main")) { - packageName = "main" - } else if (sourcePath.includes("fiori")) { - packageName = "fiori"; - } else if (sourcePath.includes("compat")) { - packageName = "compat"; - } else if (sourcePath.includes("ai")) { - packageName = "ai"; - } + if (basicSample) { + const importName = basicSample.name.replace(/[^a-zA-Z0-9]/g, "_"); + content += `\n## Basic Sample\n<${importName} />\n`; + } - if (packageName) { - const fileContent = fs.readFileSync(path.join(sourcePath, file), { encoding: "utf-8" }); - const declaration = findDeclaration({ package: realPackagesName(packageName), name: fileName }) + content += "\n<%COMPONENT_METADATA%>"; - fs.writeFileSync(path.join(targetPath, `${fileName}.mdx`), parseComponentDeclaration(declaration, fileContent)) + if (moreSamples.length) { + content += "\n\n## More Samples\n"; + moreSamples.forEach(s => { + const importName = s.name.replace(/[^a-zA-Z0-9]/g, "_"); + const title = s.title || s.name; + content += `\n### ${title}\n`; + if (s.description) { + content += `${s.description}\n\n`; } - } + content += `<${importName} />\n`; + }); } -} + + return content; +}; + +const buildParentMdx = (packageName, componentName, samplesPrefix) => { + const allSamples = getSamples(packageName); + const componentSamples = allSamples[componentName]?.samples; + + let fileContent = ``; + + if (componentSamples?.length) { + fileContent += buildSamplesImports(packageName, componentName, componentSamples, samplesPrefix); + fileContent += "\n\n<%COMPONENT_OVERVIEW%>\n"; + fileContent += buildSamplesContent(componentSamples); + } else { + fileContent += "<%COMPONENT_OVERVIEW%>\n\n<%COMPONENT_METADATA%>"; + } + + return fileContent; +}; + +const buildSubcomponentMdx = () => { + return `<%COMPONENT_OVERVIEW%>\n\n<%COMPONENT_METADATA%>`; +}; + +const generateComponents = () => { + packages.forEach(packageName => { + const packageFullName = realPackagesName(packageName); + const outputDir = `./docs/components/${packageName}`; + + const allSubcomponents = new Set(); + const parentDeclarations = []; + const allDeclarations = []; + + const manifest = JSON.parse( + fs.readFileSync(path.resolve(`./../${packageName}/dist/custom-elements-internal.json`), { encoding: "utf-8" }) + ); + + manifest.modules.forEach(module => { + module.declarations.forEach(declaration => { + if (declaration._ui5privacy === "public" && declaration.customElement && declaration.tagName) { + allDeclarations.push(declaration.name); + if (declaration._ui5subcomponents?.length) { + declaration._ui5subcomponents.forEach(name => allSubcomponents.add(name)); + parentDeclarations.push(declaration.name); + } + } + }); + }); + + allDeclarations.forEach(componentName => { + const declaration = findDeclaration({ package: packageFullName, name: componentName }); + if (!declaration) return; + + const isParent = parentDeclarations.includes(componentName); + const isSubcomponent = allSubcomponents.has(componentName); + + if (isParent) { + const folderPath = path.join(outputDir, componentName); + fs.mkdirSync(folderPath, { recursive: true }); + + fs.writeFileSync(path.join(folderPath, "_category_.json"), JSON.stringify({ label: componentName, link: null }, null, 4)); + + const parentMdx = buildParentMdx(packageName, componentName, "../../../"); + const parentContent = parseComponentDeclaration(declaration, parentMdx); + fs.writeFileSync(path.join(folderPath, `${componentName}.mdx`), parentContent); + + declaration._ui5subcomponents.forEach(subName => { + const subDeclaration = findDeclaration({ package: packageFullName, name: subName }); + if (!subDeclaration) return; + + const subMdx = buildSubcomponentMdx(); + const subContent = parseComponentDeclaration(subDeclaration, subMdx); + fs.writeFileSync(path.join(folderPath, `${subName}.mdx`), subContent); + }); + + } else if (!isSubcomponent) { + const flatMdx = buildParentMdx(packageName, componentName, "../../"); + const flatContent = parseComponentDeclaration(declaration, flatMdx); + fs.writeFileSync(path.join(outputDir, `${componentName}.mdx`), flatContent); + } + }); + }); +}; export { generateComponents -} \ No newline at end of file +} diff --git a/packages/website/build-scripts/clean-components.mjs b/packages/website/build-scripts/clean-components.mjs new file mode 100644 index 0000000000000..bb4f9d156d54a --- /dev/null +++ b/packages/website/build-scripts/clean-components.mjs @@ -0,0 +1,15 @@ +/** + * Deletes all generated files from docs/components/{package} folders + * while preserving the hand-authored samples.json files. + */ +import { rimraf } from "rimraf"; +import { readdirSync } from "fs"; +import path from "path"; + +const packages = ["fiori", "main", "compat", "ai"]; + +for (const pkg of packages) { + const dir = `./docs/components/${pkg}`; + const entries = readdirSync(dir).filter(f => f !== "samples.json"); + await rimraf(entries.map(f => path.join(dir, f))); +} diff --git a/packages/website/docs/_samples/fiori/BardcodeScannerDialog/Basic/Basic.md b/packages/website/docs/_samples/fiori/BarcodeScannerDialog/Basic/Basic.md similarity index 100% rename from packages/website/docs/_samples/fiori/BardcodeScannerDialog/Basic/Basic.md rename to packages/website/docs/_samples/fiori/BarcodeScannerDialog/Basic/Basic.md diff --git a/packages/website/docs/_samples/fiori/BardcodeScannerDialog/Basic/main.js b/packages/website/docs/_samples/fiori/BarcodeScannerDialog/Basic/main.js similarity index 100% rename from packages/website/docs/_samples/fiori/BardcodeScannerDialog/Basic/main.js rename to packages/website/docs/_samples/fiori/BarcodeScannerDialog/Basic/main.js diff --git a/packages/website/docs/_samples/fiori/BardcodeScannerDialog/Basic/sample.html b/packages/website/docs/_samples/fiori/BarcodeScannerDialog/Basic/sample.html similarity index 100% rename from packages/website/docs/_samples/fiori/BardcodeScannerDialog/Basic/sample.html rename to packages/website/docs/_samples/fiori/BarcodeScannerDialog/Basic/sample.html diff --git a/packages/website/docs/_samples/fiori/BardcodeScannerDialog/Basic/sample.tsx b/packages/website/docs/_samples/fiori/BarcodeScannerDialog/Basic/sample.tsx similarity index 100% rename from packages/website/docs/_samples/fiori/BardcodeScannerDialog/Basic/sample.tsx rename to packages/website/docs/_samples/fiori/BarcodeScannerDialog/Basic/sample.tsx diff --git a/packages/website/docs/_samples/fiori/NotificationList/GroupItems/Basic.md b/packages/website/docs/_samples/fiori/NotificationList/GroupItems/GroupItems.md similarity index 100% rename from packages/website/docs/_samples/fiori/NotificationList/GroupItems/Basic.md rename to packages/website/docs/_samples/fiori/NotificationList/GroupItems/GroupItems.md diff --git a/packages/website/docs/_samples/main/Table/ScrollMode/Scroll.md b/packages/website/docs/_samples/main/Table/ScrollMode/ScrollMode.md similarity index 100% rename from packages/website/docs/_samples/main/Table/ScrollMode/Scroll.md rename to packages/website/docs/_samples/main/Table/ScrollMode/ScrollMode.md diff --git a/packages/website/docs/_samples/main/Tokenizer/MultiLine/Basic.md b/packages/website/docs/_samples/main/Tokenizer/MultiLine/MultiLine.md similarity index 100% rename from packages/website/docs/_samples/main/Tokenizer/MultiLine/Basic.md rename to packages/website/docs/_samples/main/Tokenizer/MultiLine/MultiLine.md diff --git a/packages/website/docs/components/ai/samples.json b/packages/website/docs/components/ai/samples.json new file mode 100644 index 0000000000000..6e4a4a1e80ba8 --- /dev/null +++ b/packages/website/docs/components/ai/samples.json @@ -0,0 +1,48 @@ +{ + "Button": { + "samples": [ + { + "name": "ButtonMenu", + "title": "AI Button With Menu", + "isBasic": true + }, + { + "name": "ButtonSplitMenu", + "title": "AI Button With Split Mode State" + }, + { + "name": "IconOnlyButton", + "title": "Icon-only AI Button With Menu" + } + ] + }, + "Input": { + "samples": [ + { + "name": "Basic", + "isBasic": true + } + ] + }, + "PromptInput": { + "samples": [ + { + "name": "Basic", + "isBasic": true + } + ] + }, + "TextArea": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "Extended", + "title": "Extended Sample", + "description": "This extended sample showcases advanced AI TextArea features including multiple AI actions and version management." + } + ] + } +} diff --git a/packages/website/docs/components/compat/samples.json b/packages/website/docs/components/compat/samples.json new file mode 100644 index 0000000000000..32cc0e87e6de2 --- /dev/null +++ b/packages/website/docs/components/compat/samples.json @@ -0,0 +1,46 @@ +{ + "Table": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "ActiveRows", + "title": "Active Rows" + }, + { + "name": "Popin", + "title": "Columns Popin" + }, + { + "name": "SingleSelection", + "title": "Single Selection" + }, + { + "name": "MultipleSelection", + "title": "Multiple Selection" + }, + { + "name": "Grouping", + "title": "Grouping" + }, + { + "name": "GrowingOnButtonPress", + "title": "Growing on Button Press" + }, + { + "name": "GrowingOnScroll", + "title": "Growing on Scroll" + }, + { + "name": "NoData", + "title": "No Data" + }, + { + "name": "StickyHeader", + "title": "Sticky Header" + } + ] + } +} diff --git a/packages/website/docs/components/fiori/samples.json b/packages/website/docs/components/fiori/samples.json new file mode 100644 index 0000000000000..d253065ba3f30 --- /dev/null +++ b/packages/website/docs/components/fiori/samples.json @@ -0,0 +1,414 @@ +{ + "BarcodeScannerDialog": { + "samples": [ + { + "name": "Basic", + "isBasic": true + } + ] + }, + "DynamicPage": { + "samples": [ + { + "name": "Basic", + "title": "Basic Usage", + "isBasic": true + } + ] + }, + "DynamicSideContent": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "SideContentPosition", + "title": "Side Content Position", + "description": "The side content can be placed at the \"Start\" or at the \"End\" via the `sideContentPosition` property." + }, + { + "name": "EqualSplit", + "title": "Equal Split", + "description": "When `equalSplit` property is set, the main and side contents take equal space." + } + ] + }, + "FlexibleColumnLayout": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "LayoutsConfiguration", + "title": "Layouts Configuration", + "description": "The FlexibleColumnLayout supports customization of the column sizes within the limits of the current layout." + } + ] + }, + "HeroBanner": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "ColumnsRatio", + "title": "Columns Ratio" + }, + { + "name": "HeaderBlockAndActionsPlacement", + "title": "Header Block and Actions Placement" + }, + { + "name": "BackgroundImage", + "title": "Custom Background Image" + }, + { + "name": "UseCases", + "title": "Different Use Cases" + } + ] + }, + "IllustratedMessage": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "CustomTitle", + "title": "Custom Title", + "description": "By default the IllustratedMessage displays built-in title, but a custom title can be also set." + }, + { + "name": "WithDialog", + "title": "IllustratedMessage in Dialog", + "description": "In general IllustratedMessage can be displayed in many places and cases - one of them is inside Dialog." + } + ] + }, + "MediaGallery": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "Vertical", + "title": "Vertical Layout", + "description": "The thumbnails and selected item are vertically placed. To enable this layout - set `layout=\"Vertical\"`." + }, + { + "name": "Horizontal", + "title": "Horizontal Layout", + "description": "The thumbnails and selected item are horizontally placed. To enable this layout - set `layout=\"Horizontal\"`. You can also define on which side of the selected item to place the thumbnails." + }, + { + "name": "ThumbnailCustom", + "title": "Custom Thumbnail", + "description": "By default the image passed to the MediaGalleryItem is reused as a thumbnail. You can display another image as thumbnail via the `thumbnail` slot of the `MediaGalleryItem`." + }, + { + "name": "WithSelectedItem", + "title": "Selected Item", + "description": "You can predefine the selected item." + }, + { + "name": "WithDisabledItem", + "title": "Disabled Item", + "description": "The MediaGallery can show disabled items as well." + }, + { + "name": "Interactive", + "title": "Interactive Display Area", + "description": "Setting `interactiveDisplayArea` property makes the display area interactive, e.g. clickable." + }, + { + "name": "VideoContent", + "title": "Show Video Content" + } + ] + }, + "NavigationLayout": { + "samples": [ + { + "name": "Basic", + "isBasic": true + } + ] + }, + "NotificationList": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "GroupItems", + "title": "Notification List with Group Items" + }, + { + "name": "InShellBar", + "title": "Notifications in ShellBar", + "description": "The main usage of the Notifications is in the ShellBar. Press the \"notifications\" icon on the right side of the ShellBar to show the Notifications." + } + ] + }, + "Page": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "FixedFooter", + "title": "Fixed Footer" + } + ] + }, + "ProductSwitch": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "WithShellBar", + "title": "ProductSwitch in ShellBar", + "description": "Press the \"grid\" on the right-most part of the ShellBar to show the ProductSwitch." + }, + { + "name": "WithImageSlot", + "title": "ProductSwitchItem with \"image\" slot" + } + ] + }, + "Search": { + "samples": [ + { + "name": "Basic", + "title": "Basic Sample", + "description": "A Search component with enabled scope and items and filtering by scope.", + "isBasic": true + }, + { + "name": "Advanced", + "title": "Filtering", + "description": "The examples show the search message area, the search action, filtering per user input, typeahead and highlighting suggestions per user input." + }, + { + "name": "AdvancedFilter", + "title": "Advanced Filtering Button", + "description": "This example shows how to use a custom advanced filtering button via the `filterButton` slot." + }, + { + "name": "Byline", + "title": "Byline items", + "description": "The example shows how to display byline items with an image and description." + }, + { + "name": "ShowMore", + "title": "Show More Item", + "description": "This example shows how to use a Show More Item." + }, + { + "name": "Actions", + "title": "Actions", + "description": "This example shows how to use interactive elements in search items." + }, + { + "name": "Loading", + "title": "Loading State", + "description": "This example shows the loading indicator during async search operations." + } + ] + }, + "ShellBar": { + "samples": [ + { + "name": "Basic", + "title": "Basic Sample", + "description": "The ShellBar includes Back button, Logo, Title and Profile image.", + "isBasic": true + }, + { + "name": "Advanced", + "title": "All Features", + "description": "A comprehensive ShellBar demonstrating all available features including notifications, search, content items, and profile." + }, + { + "name": "EmbeddedBackNavigation", + "title": "Embedded Back Navigation", + "description": "ShellBar with embedded back navigation button in the start area." + }, + { + "name": "TrialExample", + "title": "Trial Example", + "description": "ShellBar configured for trial environments with trial tags and remaining days indicator." + }, + { + "name": "MultipleProductiveInstances", + "title": "Multiple Productive Instances", + "description": "ShellBar setup for multiple productive system instances with region indicators." + }, + { + "name": "MultipleNonProductiveInstances", + "title": "Multiple Non-Productive Instances", + "description": "ShellBar setup for multiple non-productive system instances with system and region tags." + }, + { + "name": "Overflow", + "title": "Application-Level Overflow", + "description": "This sample demonstrates how applications can implement custom overflow handling for content items." + } + ] + }, + "SideNavigation": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "UnselectableParentItems", + "title": "Unselectable Parent Items", + "description": "When a parent item is selected, it will expand or collapse the list of child items, instead of the parent being selected itself." + }, + { + "name": "QuickAction", + "title": "Quick Action", + "description": "Quick action items allow for providing access to frequent functionality." + }, + { + "name": "OverlayMode", + "title": "Overlay Mode", + "description": "SideNavigation is enabled to be used inside a responsive popover. This example shows how to achieve overlay mode with correct design and interaction." + }, + { + "name": "CustomWidth", + "title": "Defining Custom Width", + "description": "The width of the side navigation panel can be customized using CSS. The panel must be at least 16 rem wide to maintain readability and layout stability." + }, + { + "name": "Tags", + "title": "Indication Tags", + "description": "Navigation items can display indication tags to highlight status or phases such as \"New\", \"Beta\", or \"Deprecated\"." + } + ] + }, + "Timeline": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "Horizontal", + "title": "Horizontal layout" + }, + { + "name": "WithState", + "title": "Timeline with State" + }, + { + "name": "InCard", + "title": "Timeline in Card" + }, + { + "name": "WithGroups", + "title": "Timeline with Groups" + }, + { + "name": "WithGrowing", + "title": "Timeline with Growing" + }, + { + "name": "WithHeader", + "title": "Timeline with Header and Info Bar" + }, + { + "name": "WithFilter", + "title": "Timeline with Filter" + }, + { + "name": "StickyInPage", + "title": "Sticky in Page" + } + ] + }, + "UploadCollection": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "RenamingFiles", + "title": "Renaming Files" + }, + { + "name": "VariousUploadStates", + "title": "Upload States" + }, + { + "name": "DragAndDrop", + "title": "Drag and Drop" + } + ] + }, + "UserMenu": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "Advanced", + "title": "Advanced" + } + ] + }, + "UserSettingsDialog": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "SaveMode", + "title": "Save Mode", + "description": "By default the dialog shows a single **Close** button and follows an implicit-save flow. Setting `saveMode` replaces the footer with **Save** and **Cancel** buttons." + } + ] + }, + "ViewSettingsDialog": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "CustomTabs", + "title": "Custom Tabs", + "description": "The ViewSettingsDialog supports custom tabs alongside the built-in Sort, Filter, and Group tabs." + } + ] + }, + "Wizard": { + "samples": [ + { + "name": "Basic", + "title": "Basic Sample", + "description": "By default the navigation to another step happens with scrolling or pressing the given step in the Wizard header.", + "isBasic": true + }, + { + "name": "PageMode", + "title": "Page Mode", + "description": "Instead of scrolling each step is shown as a separate page." + } + ] + } +} diff --git a/packages/website/docs/components/main/samples.json b/packages/website/docs/components/main/samples.json new file mode 100644 index 0000000000000..5b81bf7ba3389 --- /dev/null +++ b/packages/website/docs/components/main/samples.json @@ -0,0 +1,1571 @@ +{ + "Avatar": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "Shapes", + "title": "Shapes", + "description": "The Avatar comes in two shapes (Square and Circle)." + }, + { + "name": "Sizes", + "title": "Sizes", + "description": "The Avatar comes in several sizes (S to XL)." + }, + { + "name": "Interactive", + "title": "Interactive Mode", + "description": "The Avatar can be made interactive via `mode=\"Interactive\"` or the `interactive` property." + }, + { + "name": "Decorative", + "title": "Decorative Mode", + "description": "The Avatar can be set to decorative mode with `mode=\"Decorative\"`, making it purely visual without semantic content." + }, + { + "name": "ColorSchemes", + "title": "Color Schemes", + "description": "The Avatar can be displayed in multiple color schemes." + }, + { + "name": "WithIcon", + "title": "With Icon", + "description": "The Avatar can show icons." + }, + { + "name": "WithImage", + "title": "With Image", + "description": "The Avatar can show images." + }, + { + "name": "WithBadge", + "title": "With Badge", + "description": "The Avatar supports visual affordance through badges using the `ui5-avatar-badge` component." + }, + { + "name": "Variants", + "title": "All Variants", + "description": "A comprehensive overview of all Avatar variants with their recommended use cases and accessibility annotations." + }, + { + "name": "Styles", + "title": "Custom Styling", + "description": "The Avatar allows customization with pure CSS on tag level." + } + ] + }, + "AvatarGroup": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "TypesAndSizes", + "title": "Types And Sizes" + }, + { + "name": "IndividualWithPopover", + "title": "Individual" + }, + { + "name": "GroupWithPopover", + "title": "Grouping" + } + ] + }, + "Bar": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "AccessibleRole", + "title": "Bar with accessible role" + } + ] + }, + "Breadcrumbs": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "BreadcrumbsOverflow", + "title": "Overflow", + "description": "When the links don't fit the available space, they overflow." + }, + { + "name": "BreadcrumbsStyles", + "title": "Separator Styles", + "description": "Separator between the links can be easily changed." + }, + { + "name": "NoCurrentPage", + "title": "Current Page Appearance", + "description": "The Breadcrumbs supports two visual appearances for the last BreadcrumbsItem - as \"current page\" and as a regular link." + }, + { + "name": "ClickEvent", + "title": "Item Click Event", + "description": "Each `ui5-breadcrumbs-item` fires its own `click` event, allowing framework consumers to attach handlers directly on the item." + } + ] + }, + "BusyIndicator": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "Sizes", + "title": "Sizes", + "description": "The BusyIndicator comes in several sizes - S, M and L." + }, + { + "name": "TextPlacement", + "title": "Text Placement with display text", + "description": "The BusyIndicator can display text either above (via `text-placement=\"Top\"`) or below the animated dots (by default)." + }, + { + "name": "WithComponent", + "title": "Busy component", + "description": "The BusyIndicator can be placed over another web component." + } + ] + }, + "Button": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "Design", + "title": "Design", + "description": "The Button supports several designs to indicate the priority or the nature of the action." + }, + { + "name": "IconOnly", + "title": "Icon Only" + }, + { + "name": "TextAndIcon", + "title": "Text and Icon" + }, + { + "name": "EndIcon", + "title": "Icon at the End", + "description": "Button allows adding of second Icon at the end." + }, + { + "name": "CustomStyling", + "title": "Custom Styling", + "description": "To some extent, the Button allows customization with pure CSS as shown in the sample." + }, + { + "name": "MenuButton", + "title": "Menu Button", + "description": "Achieve Menu Button functionality." + }, + { + "name": "ButtonBadge", + "title": "Button with badge", + "description": "Add a badge to the button." + }, + { + "name": "Loading", + "title": "Button with Loading" + } + ] + }, + "Calendar": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "SelectionModes", + "title": "Selection Modes", + "description": "The Calendar supports **Single**, **Multiple** and **Range** selection." + }, + { + "name": "Bounds", + "title": "Min and Max Dates", + "description": "Define min and max date boundaries to constrain user choice." + }, + { + "name": "CalendarTypes", + "title": "Calendar Types", + "description": "Several calendars are supported: Gregorian, Islamic, Persian and Japanese." + }, + { + "name": "CalendarWithLegend", + "title": "Calendar with Legend", + "description": "You can use the CalendarLegend component in addition to the Calendar to highlight specific days." + }, + { + "name": "CalendarInDifferentTimezone", + "title": "Timezones", + "description": "You can set to the configuration the preferred time zone, such as: Asia/Tokyo, Pacific/Apia, Asia/Kolkata, Europe/Sofia and etc." + }, + { + "name": "CalendarWeekNumbering", + "title": "CalendarWeekNumbering", + "description": "You can use the component, the preferred week numbering and first day of week." + }, + { + "name": "CalendarWithDisabledDates", + "title": "Calendar with Disabled Dates", + "description": "Define disabled dates." + } + ] + }, + "CalendarLegend": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "ItemTypes", + "title": "CalendarLegendItem Types" + }, + { + "name": "HideToday", + "title": "Hide CalendarLegendItems", + "description": "By default, the CalendarLegend shows **Today**, **SelectedDay**, **WorkingDay** and **NonWorkingDay** items. However, you can hide them as shown in the sample." + } + ] + }, + "Card": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "WithList", + "title": "List Card" + }, + { + "name": "WithTable", + "title": "Table Card" + }, + { + "name": "WithTimeline", + "title": "Timeline Card" + }, + { + "name": "MoreCards", + "title": "Object Card" + } + ] + }, + "Carousel": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "Cyclic", + "title": "Cyclic", + "description": "When the last page is reached, pressing \"Forward\" will navigate to the start." + }, + { + "name": "ArrowsPlacement", + "title": "Arrows Placement", + "description": "When `arrowsPlacement` is set to \"Content\", the arrows are placed on the sides of the current page. When set to \"Navigation\", the arrows are placed on the sides of the page indicator." + }, + { + "name": "PageIndicatorType", + "title": "Page Indicator", + "description": "When `pageIndicatorType` is set to \"Default\", the page indicator appear as dots. When set to \"Numeric\" - as numbers." + }, + { + "name": "MultipleItemsPerPage", + "title": "Multiple Items per Page", + "description": "The `items-per-page` property defines the number of items per page for given breakpoint." + }, + { + "name": "AccessibleName", + "title": "Accessible name", + "description": "Use the `accessibleName` or the `accessibleNameRef` properties to label the Carousel and improve its accessibility." + }, + { + "name": "CardsWithHidden", + "title": "Carousel with Hidden Items", + "description": "A Carousel containing cards where some are hidden using the `hidden` attribute. Hidden items will not be included in the carousel navigation." + } + ] + }, + "CheckBox": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "Indeterminate", + "title": "Indeterminate", + "description": "The CheckBox can also display an indeterminate state. It's useful to indicate that not all tasks/items are done/checked." + }, + { + "name": "States", + "title": "States", + "description": "CheckBox supports several semantic value states, readonly, disabled, etc." + }, + { + "name": "TextWrapping", + "title": "Text Truncation and Wrapping", + "description": "The CheckBox text wraps by default. To make it truncate - set `wrapping-type=\"None\"`." + }, + { + "name": "Group", + "title": "Group of Checkboxes in a Form", + "description": "Checkboxes can be logically grouped using the same `name` attribute to create a multi-selection form field." + } + ] + }, + "ColorPalette": { + "samples": [ + { + "name": "Basic", + "isBasic": true + } + ] + }, + "ColorPalettePopover": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "DefaultColor", + "title": "Show Default Color" + }, + { + "name": "MoreColors", + "title": "Show More & Recent Colors", + "description": "Recent colors shows the last five colors that have been selected. More colors opens a dialog to manually choose a color from a ColorPicker." + } + ] + }, + "ColorPicker": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "Simplified", + "title": "Simplified Picker" + } + ] + }, + "ComboBox": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "ClearIcon", + "title": "Clear Icon", + "description": "The ComboBox can show a clear icon, visible when there is a value typed by the user." + }, + { + "name": "Filters", + "title": "Filters", + "description": "You can choose a Filter that the items will be matched against on user input (StartsWith, Contains, etc.)" + }, + { + "name": "TwoColumnsLayout", + "title": "Items with additional text", + "description": "The ComboBox items can show additional text." + }, + { + "name": "Grouping", + "title": "Items Grouping", + "description": "Grouping of items can be implemented via the `ui5-cb-group-item` web component." + }, + { + "name": "SuggestionsWrapping", + "title": "Items Text Wrapping", + "description": "The sample demonstrates how the text of the items wrap when too long." + }, + { + "name": "SelectedValue", + "title": "Selected Value", + "description": "Use the `value` property on items and `selected-value` on the ComboBox to decouple the display text from the underlying selection value." + }, + { + "name": "SameTextDifferentValues", + "title": "Items with Same Text but Different Values", + "description": "When you have multiple items with identical display text, use the `value` property to uniquely identify each item." + }, + { + "name": "CustomItems", + "title": "Custom Items with Rich Content", + "description": "Use `ui5-cb-item-custom` to create custom item templates with complex layouts, multiple icons, images, or any HTML content." + } + ] + }, + "DatePicker": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "State", + "title": "States" + }, + { + "name": "MinMax", + "title": "Min and Max Dates", + "description": "Define min and max date boundaries to constrain user choice." + }, + { + "name": "CalendarTypes", + "title": "Calendar Types", + "description": "You can set the preferred calendar, such as: Gregorian, Islamic, Japanese and Persian." + }, + { + "name": "DatePickerInDifferentTimezone", + "title": "Timezones", + "description": "You can set to the configuration the preferred time zone, such as: Asia/Tokyo, Pacific/Apia, Asia/Kolkata, Europe/Sofia and etc." + }, + { + "name": "CalendarWeekNumbering", + "title": "CalendarWeekNumbering", + "description": "You can use the component, the preferred week numbering and first day of week." + }, + { + "name": "CustomFormatting", + "title": "CustomFormatting", + "description": "You can have custom formatting for the display value and the value property. Supported format options are pattern-based on Unicode LDML Date Format notation." + }, + { + "name": "ClearIcon", + "title": "Clear Icon", + "description": "This sample demonstrates the component with the `show-clear-icon` property enabled, which displays a clear button to reset the selected date." + } + ] + }, + "DateRangePicker": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "DateFormat", + "title": "Date Formats" + }, + { + "name": "MinMax", + "title": "Min and Max Dates", + "description": "Define min and max date boundaries to constrain user choice." + }, + { + "name": "CustomFormatting", + "title": "CustomFormatting", + "description": "You can have custom formatting for the display value and the value property." + }, + { + "name": "ClearIcon", + "title": "Clear Icon", + "description": "This sample demonstrates the component with the `show-clear-icon` property enabled." + }, + { + "name": "ShowTwoMonths", + "title": "Show Two Months", + "description": "This sample demonstrates the component with the `show-two-months` property enabled, which displays two consecutive months." + } + ] + }, + "DateTimePicker": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "MinMax", + "title": "Min and Max Dates", + "description": "Define min and max date-time boundaries to constrain user choice." + }, + { + "name": "DateTimePickerInDifferentTimezone", + "title": "Timezones", + "description": "You can set to the configuration the preferred time zone." + }, + { + "name": "CustomFormatting", + "title": "CustomFormatting", + "description": "You can have custom formatting for the display value and the value property." + }, + { + "name": "ClearIcon", + "title": "Clear Icon", + "description": "This sample demonstrates the component with the `show-clear-icon` property enabled." + } + ] + }, + "Dialog": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "DraggableAndResizable", + "title": "Draggable and Resizable" + }, + { + "name": "Fullscreen", + "title": "Fullscreen", + "description": "Users can toggle between standard and full screen size. The full screen button is positioned top-right in the dialog's title bar." + }, + { + "name": "BarInDialog", + "title": "Usage of Bar as header/footer", + "description": "The Bar component can be used as header and/or footer of the Dialog." + }, + { + "name": "WithState", + "title": "States", + "description": "The Dialog supports \"Positive\", \"Critical\", \"Negative\" and \"None\" states via the \"state\" property." + } + ] + }, + "DynamicDateRange": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "DynamicDateRangeValueSample", + "title": "DynamicDateRangeValueSample" + } + ] + }, + "ExpandableText": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "OverflowModePopover", + "title": "Overflow Mode Popover" + } + ] + }, + "FileUploader": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "MultipleFiles", + "title": "Upload Multiple Files", + "description": "By default, only one file can be selected. To allow multiple files to be uploaded - set the `multiple` property." + }, + { + "name": "FilesFilter", + "title": "Files Filter", + "description": "You can define the files allowed for uploading via the `accept` property." + }, + { + "name": "FileSizeLimit", + "title": "File Size Upload Limit", + "description": "You can define the maximum file size the uploader will accept." + }, + { + "name": "WithoutInput", + "title": "Button Only", + "description": "You can hide the input part via the `hide-input` property." + } + ] + }, + "Form": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "Layout", + "title": "Layout", + "description": "Use the Form `layout` property to define the number of columns to distribute the form content by breakpoint." + }, + { + "name": "Groups", + "title": "Groups", + "description": "You can define groups via the `ui5-form-group` web component." + }, + { + "name": "LabelSpan", + "title": "Label Span", + "description": "Use the `labelSpan` property to define the width proportion of the labels and fields of a FormItem by breakpoint." + }, + { + "name": "EmptySpan", + "title": "Empty Span", + "description": "Use the `emptySpan` property to define the empty space at the FormItem's end." + }, + { + "name": "LabelsOnTop", + "title": "Labels On Top", + "description": "Force labels always on top with `Form#labelSpan=S12 M12 L12 XL12`." + }, + { + "name": "Edit", + "title": "Edit", + "description": "The Form has no built-in functionality to transform texts into inputs to implement editable forms. This is delegated to the consumers as shown in the sample." + }, + { + "name": "GroupColumnSpan", + "title": "Column Span", + "description": "The `FormGroup#columnSpan` and `FormItem#columnSpan` properties define how many columns the form group or item should expand to." + }, + { + "name": "HeaderTextWrapping", + "title": "Header Text Wrapping", + "description": "The Form header text **is wrapping** when it doesn't fit the available space." + }, + { + "name": "CustomHeader", + "title": "Custom Header", + "description": "The Form provides a `header` slot that allows the usage of custom form header." + }, + { + "name": "FreeStyleForm", + "title": "Freestyle Form" + } + ] + }, + "Icon": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "Design", + "title": "Design", + "description": "The Icon supports multiple designs." + }, + { + "name": "CustomStyling", + "title": "Custom Styling", + "description": "The Icon allows style customization via pure CSS, applied on the tag." + }, + { + "name": "Interactive", + "title": "Interactive", + "description": "The Icon can be interactive - clickable and focusable." + }, + { + "name": "TntIcons", + "title": "SAP Fiori Tools Icons", + "description": "The SAP Fiori Tools Icons are available in the `@ui5/webcomponents-icons-tnt` package." + }, + { + "name": "BSIcons", + "title": "SAP Business Suite Icons", + "description": "The SAP Business Suite Icons are available in the `@ui5/webcomponents-icons-business-suite` package." + } + ] + }, + "Input": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "ClearIcon", + "title": "Clear Icon", + "description": "The Input can show a clear icon, visible when there is a value typed by the user." + }, + { + "name": "InteractiveIcons", + "title": "Interactive Icons", + "description": "The Input can display interactive icons that users can click. Use the `ui5-input-icon` component for interactive icons with hover, focus, and active states." + }, + { + "name": "Suggestions", + "title": "Input with Suggestions", + "description": "The Input can show a dropdown with suggestions upon user input - see the `showSuggestions` property for more information." + }, + { + "name": "SuggestionsWrapping", + "title": "Suggestions Wrapping", + "description": "The sample demonstrates how the text of the suggestions wrap when too long." + }, + { + "name": "DynamicSuggestions", + "title": "Dynamic Suggestion Control", + "description": "This sample demonstrates how applications can control when suggestions appear by dynamically toggling the `showSuggestions` property." + }, + { + "name": "Label", + "title": "Input and Label" + }, + { + "name": "ValueStateMessage", + "title": "Value State Message" + }, + { + "name": "ValueHelpDialog", + "title": "Value-help Dialog" + }, + { + "name": "CustomSuggestions", + "title": "Custom Suggestions" + }, + { + "name": "CustomStyling", + "title": "Custom Styling", + "description": "To some extent, the Input allows customization with pure CSS as shown in the sample." + }, + { + "name": "BuiltInFiltering", + "title": "Built-in Filtering", + "description": "This input has built-in filtering of type Contains." + } + ] + }, + "Label": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "TextWrapping", + "title": "Text Truncation and Wrapping", + "description": "The `ui5-label` wraps by default. To truncate it - set `wrapping-type=\"None\"`." + }, + { + "name": "UsageWithInputs", + "title": "Label with Input", + "description": "The labels `for`, `required` and `showColon` properties can be used to reference inputs." + }, + { + "name": "CustomStyling", + "title": "Custom Styling", + "description": "The labels can be customized with pure CSS, applied on the tag." + } + ] + }, + "Link": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "Design", + "title": "Design", + "description": "The Link supports **Default**, **Subtle** and **Emphasized** designs." + }, + { + "name": "TextWrapping", + "title": "Text Truncation and Wrapping", + "description": "The `ui5-link` wraps by default. To truncate it - set `wrapping-type=\"None\"`." + }, + { + "name": "CustomStyling", + "title": "Custom Styling", + "description": "The links can be customized with pure CSS, applied on the tag." + }, + { + "name": "WithIcons", + "title": "Icons", + "description": "You can add icons to the Link." + } + ] + }, + "List": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "Growing", + "title": "Growing On Scroll", + "description": "The List fires a `load-more` event when the user scrolls to the bottom. The event can be used for loading more data (items) as shown in the sample." + }, + { + "name": "GrowingOnButtonPress", + "title": "Growing On Button Press", + "description": "The List fires a `load-more` event when the user clicks to the \"Load More\" button at the bottom." + }, + { + "name": "Modes", + "title": "Selection Modes", + "description": "The List supports several selection modes: **None**, **Single**, **SingleStart**, **SingleEnd**, **SingleAuto**, **Multiple** and **Delete**." + }, + { + "name": "NoData", + "title": "No data", + "description": "You can show a text when there aren't items (data) via the `noDataText` property." + }, + { + "name": "GroupHeaders", + "title": "Grouping", + "description": "The `ListItemGroup` can be used to start a group section and implement grouping." + }, + { + "name": "GroupHeaderStyling", + "title": "Styling Group Headers", + "description": "You can customize the appearance of group headers using CSS Shadow Parts." + }, + { + "name": "SeparationTypes", + "title": "Separators", + "description": "The `separators` options (**All**, **Inner**, **None**) allows the outer lines (Inner) or all the lines (None) to be hidden." + }, + { + "name": "DragAndDrop", + "title": "Drag And Drop", + "description": "The list items are draggable through the use of the `movable` property on `ListItem`." + }, + { + "name": "MultipleDrag", + "title": "Multiple Item Drag", + "description": "You can select and drag multiple items at once when using `selection-mode=\"Multiple\"`." + }, + { + "name": "WrappingBehavior", + "title": "Wrapping Behavior", + "description": "The standard list item and the list item group support text wrapping through the `wrappingType` property." + }, + { + "name": "StickyHeader", + "title": "Sticky Header", + "description": "Use the `stickyHeader` property to keep the header visible during scrolling." + }, + { + "name": "AccessibleRole", + "title": "Accessible Role", + "description": "Use the `accessibleRole` property on `ui5-list` to set the ARIA role of the list element." + }, + { + "name": "KeyboardHandling", + "title": "Keyboard Handling", + "description": "The `ui5-list` implements the SAP Fiori **Intentional Edit Pattern**. Interactive elements inside a list item are not reached by Tab from outside the list." + } + ] + }, + "Menu": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "SubMenu", + "title": "Sub-menu", + "description": "You can nest menu items to create sub menus." + }, + { + "name": "AditionalText", + "title": "Menu Item with Additional Text" + }, + { + "name": "MenuEndContent", + "title": "Menu Item with End Content" + }, + { + "name": "DynamicallyAddedItems", + "title": "Handling focus behaviour when adding items dynamically" + }, + { + "name": "ItemGroups", + "title": "Item Groups with Checkable Menu Items" + } + ] + }, + "MessageStrip": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "Design", + "title": "Design" + }, + { + "name": "HideIconAndButton", + "title": "Hide Icon and Close Button", + "description": "Use `hideIcon` and `hideCloseButton` properties to hide some parts of the MessageStrip." + }, + { + "name": "Custom", + "title": "Custom Icon" + }, + { + "name": "CustomColors", + "title": "Custom visualisation" + } + ] + }, + "MultiComboBox": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "SelectedValues", + "title": "Programmatic Selection with selectedValues", + "description": "Use the `selectedValues` property to pre-select items by their `value` attribute." + }, + { + "name": "SelectedValuesDynamic", + "title": "Dynamic Selection Manipulation", + "description": "The `selectedValues` property can be updated programmatically to change the selection." + }, + { + "name": "ClearIcon", + "title": "Clear Icon", + "description": "The MultiComboBox can show a clear icon, visible when there is a value typed by the user." + }, + { + "name": "MultiComboBoxCustomValue", + "title": "Custom values", + "description": "Use `noValidation` to allow typing values that are not present as items." + }, + { + "name": "MultiComboBoxSelectAll", + "title": "Select All Items", + "description": "When `showSelectAll` is enabled, a \"Select All\" checkbox is displayed to allow users to select all items at once." + }, + { + "name": "MultiComboBoxGrouping", + "title": "Items Grouping", + "description": "The `ui5-mcb-item-group` can be used to implement grouping." + }, + { + "name": "SuggestionsWrapping", + "title": "Items Text Wrapping", + "description": "The sample demonstrates how the text of the items wrap when too long." + }, + { + "name": "CustomItems", + "title": "Custom Items with Rich Content", + "description": "Use `ui5-mcb-item-custom` to create custom item templates with complex layouts, multiple icons, images, or any HTML content." + } + ] + }, + "MultiInput": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "TokenCreation", + "title": "Add/Remove Tokens" + }, + { + "name": "SuggestionsWrapping", + "title": "Items Text Wrapping", + "description": "The sample demonstrates how the text of the items wrap when too long." + } + ] + }, + "Panel": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "Fixed", + "title": "Fixed Panel", + "description": "The fixed panel can't be collapsed when expanded, and can't be expanded if collapsed." + }, + { + "name": "StickyHeader", + "title": "Sticky Header", + "description": "The header remains visible upon scrolling the Panel's content." + }, + { + "name": "CustomHeader", + "title": "Custom Header", + "description": "You can replace the built-in header using the `header` slot." + } + ] + }, + "Popover": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "Placement", + "title": "Placement", + "description": "You can influence the placement of the popup. Note: if there is not enough space for the popup on the defined side, it will open on the side with enough space." + }, + { + "name": "Resizable", + "title": "Resizable", + "description": "The Resizable sample demonstrates how the Popover component can be resized by dragging its edges." + } + ] + }, + "ProgressIndicator": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "DisplayValue", + "title": "Display Value", + "description": "Use the `displayValue` property to define an alternative of the value, that is actually displayed." + }, + { + "name": "States", + "title": "States", + "description": "ProgressIndicator supports several semantic value states." + } + ] + }, + "RadioButton": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "States", + "title": "States", + "description": "The RadioButton supports several semantic value states, readonly, disabled, etc." + }, + { + "name": "TextWrapping", + "title": "Text Truncation and Wrapping", + "description": "The RadioButton text wraps by default. To make it truncate - set `wrapping-type=\"None\"`." + } + ] + }, + "RangeSlider": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "ShowTickmarks", + "title": "Show Tickmarks", + "description": "Tickmarks, marking the step can be displayed on the Range Slider. In addition, labels with the given step can be displayed." + }, + { + "name": "ShowTooltip", + "title": "Show Tooltips", + "description": "Tooltip with the current value can be displayed upon handles hover." + }, + { + "name": "CustomTickmarks", + "title": "Custom Tickmarks", + "description": "Custom tickmarks with labels can be displayed at specific positions on the Range Slider scale." + } + ] + }, + "RatingIndicator": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "Sizes", + "title": "Sizes", + "description": "The RatingIndicator supports several sizes of the Icons (S, M and L)." + }, + { + "name": "CustomIcons", + "title": "Custom Icons", + "description": "The RatingIndicator supports custom icons for both selected and unselected states using the `rated-icon` and `unrated-icon` properties." + } + ] + }, + "ResponsivePopover": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "Placement", + "title": "Placement", + "description": "You can influence the placement of the popup. Note: if there is not enough space for the popup on the defined side, it will open on the side with enough space." + } + ] + }, + "SegmentedButton": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "SelectionModes", + "title": "Selection Modes", + "description": "You can define if single or multiple buttons can be pressed." + }, + { + "name": "ItemsFitContent", + "title": "Items Fit Content", + "description": "You can define a property that allows each item to be sized according to its content." + } + ] + }, + "Select": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "Selection", + "title": "Selection", + "description": "Use the `value` property on the Select component to control which option is selected. The value should match the `value` attribute of the desired Option or Option's text." + }, + { + "name": "States", + "title": "States", + "description": "Select supports several semantic value states, readonly, disabled, etc." + }, + { + "name": "AdditionalText", + "title": "Options with additional text", + "description": "Options can display additional text." + }, + { + "name": "OptionGroups", + "title": "Grouped Options", + "description": "Use the `ui5-option-group` component to group options inside a Select." + }, + { + "name": "CustomOptions", + "title": "Custom Options", + "description": "You can define completely custom options via the `ui5-option-custom` component." + } + ] + }, + "Slider": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "ShowTickmarks", + "title": "Show Tickmarks", + "description": "Tickmarks, marking the step can be displayed on the slider. In addition, labels with the given step can be displayed." + }, + { + "name": "ShowTooltip", + "title": "Show Tooltip", + "description": "Tooltip with the current value can be displayed upon handle hover." + }, + { + "name": "CustomTickmarks", + "title": "Custom Tickmarks", + "description": "Custom tickmarks with labels can be displayed at specific positions on the slider scale." + } + ] + }, + "SplitButton": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "Design", + "title": "Design", + "description": "The SplitButton supports several designs to indicate the priority or the nature of the action." + }, + { + "name": "OpeningMenu", + "title": "Opening Menu", + "description": "The main use-case of SplitButton is to open a menu by clicking the arrow." + } + ] + }, + "StepInput": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "MinMax", + "title": "Min Max" + }, + { + "name": "ValuePrecision", + "title": "Value Precision" + }, + { + "name": "States", + "title": "States", + "description": "StepInput supports several semantic value states, readonly, disabled, etc." + } + ] + }, + "Switch": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "Design", + "title": "Design" + } + ] + }, + "TabContainer": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "TabLayout", + "title": "Tab Layout", + "description": "The `tabLayout` is \"Standard\" by default and can be switched to \"Inline\"." + }, + { + "name": "TextOnlyTabs", + "title": "Text-only Tabs" + }, + { + "name": "NestedTabs", + "title": "Nested Tabs" + }, + { + "name": "OverflowMode", + "title": "Tabs Overflow Mode", + "description": "The `overflowMode` is \"End\" by default and can be switched to \"StartAndEnd\"." + }, + { + "name": "ReorderTabs", + "title": "Reorder Tabs" + }, + { + "name": "ReorderTabsMaxNestingLevel", + "title": "Reorder Tabs with Max Nesting Level" + }, + { + "name": "ReorderTabsFixedTabs", + "title": "Reorder Tabs with Fixed Tabs" + }, + { + "name": "TransparentDesign", + "title": "Transparent design", + "description": "The inner TabContainer has `headerBackgroundDesign` and `contentBackgroundDesign` set to \"Transparent\"." + } + ] + }, + "Table": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "ScrollMode", + "title": "Overflow Mode - Scroll", + "description": "The table provides two horizontal overflow modes: Scroll (default) or Popin." + }, + { + "name": "Popin", + "title": "Overflow Mode - Popin" + }, + { + "name": "StickyHeader", + "title": "Sticky Header Row", + "description": "Enable a sticky header by utilizing the `sticky` and `sticky-top` properties of the `ui5-table-header-row`." + }, + { + "name": "NoDataSlot", + "title": "No Data", + "description": "You can provide an illustration or a custom text that is shown when the table has no data using the `noData` slot." + }, + { + "name": "Interactive", + "title": "Interactive Rows", + "description": "Create an interactive table by marking `ui5-table-row` components as `interactive`. Pressing on an interactive row will fire the `row-click` event." + }, + { + "name": "DragAndDrop", + "title": "Drag and Drop", + "description": "Enable Drag and Drop by using the `move-over` and `move` events in combination with the `movable` property on the `ui5-table-row`." + }, + { + "name": "Grouping", + "title": "Row Grouping", + "description": "Use `ui5-table-group-row` to visually group rows." + } + ] + }, + "Tag": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "Designs", + "title": "Designs" + }, + { + "name": "Interactive", + "title": "Interactive Tag", + "description": "An Interactive tag responds to focus, hover and press." + }, + { + "name": "WrappingTypes", + "title": "Text Wrapping" + }, + { + "name": "Set1", + "title": "Color Scheme Set 1", + "description": "You can use color schemes from different sets, here is the set \"1\"." + }, + { + "name": "Set2", + "title": "Color Scheme Set 2", + "description": "You can use color schemes from different sets, here is the set \"2\"." + }, + { + "name": "Size", + "title": "Size" + } + ] + }, + "Text": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "MaxLines", + "title": "Max Lines", + "description": "The `maxLines` property defines the number of lines the text would wrap before start truncating." + }, + { + "name": "EmptyIndicatorMode", + "title": "Empty Indicator Mode", + "description": "The `emptyIndicatorMode` property specifies if an empty indicator should be displayed when there is no text." + }, + { + "name": "CustomStyling", + "title": "Custom Styling", + "description": "The text can be customized with pure CSS, applied on the tag." + }, + { + "name": "RenderWhiteSpace", + "title": "Render white space with custom styling", + "description": "Handle white spaces in the text with standard CSS, applied on the tag." + }, + { + "name": "Hyphenation", + "title": "Hyphenation with custom styling", + "description": "The text hyphenation can be customized with pure CSS, applied on the tag." + } + ] + }, + "TextArea": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "Growing", + "title": "Growing", + "description": "The TextArea can grow when entering new lines." + }, + { + "name": "MaxLength", + "title": "Max Length", + "description": "You can use the `maxlength` and `showExceededText` properties to define a characters limit and to indicate how many characters are remaining before or exceeding the limit." + }, + { + "name": "States", + "title": "States", + "description": "TextArea supports several semantic value states, readonly, disabled, etc." + } + ] + }, + "TimePicker": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "CustomFormatting", + "title": "CustomFormatting", + "description": "You can have custom formatting for the display value and the value property. Supported format options are pattern-based on Unicode LDML Date Format notation." + }, + { + "name": "States", + "title": "States", + "description": "TimePicker supports several semantic value states, readonly, disabled, etc." + }, + { + "name": "TimePickerInDifferentTimezone", + "title": "Timezones", + "description": "You can set to the configuration the preferred time zone." + } + ] + }, + "Title": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "WrappingType", + "title": "WrappingType" + } + ] + }, + "Toast": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "Duration", + "title": "Duration" + }, + { + "name": "Placement", + "title": "Placement" + } + ] + }, + "ToggleButton": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "Design", + "title": "Design", + "description": "Toggle Buttons have a `design` property with several options that defines their visual appearance." + }, + { + "name": "IconOnly", + "title": "Icon Only" + } + ] + }, + "Token": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "TokenInMultiInput", + "title": "Token in MultiInput", + "description": "You can remove tokens by clicking the \"X\" button and add tokens by typing something in the input field, followed by \"ENTER\"." + } + ] + }, + "Tokenizer": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "MultiLine", + "title": "Multi-line and Clear All", + "description": "With `multiLine` enabled, tokens are displayed across multiple lines. The `showClearAll` option adds a \"Clear All\" button, allowing users to remove all tokens at once." + } + ] + }, + "Toolbar": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "AlwaysOverflowingItems", + "title": "Always Overflowing Items", + "description": "To force items into the overflow, set `overflow-priority='AlwaysOverflow'` on the Toolbar items." + }, + { + "name": "NeverOverflowingItems", + "title": "Never Overflowing Items", + "description": "To force items staying always visible and never overflow, set `overflow-priority='NeverOverflow'` on the Toolbar items." + }, + { + "name": "SpacerAndSeparator", + "title": "Spacers and Separators" + }, + { + "name": "ItemsAlignment", + "title": "Items Alignment", + "description": "You can align items to the Start, or to the End via the `align-content` property." + }, + { + "name": "ToolbarItem", + "title": "ToolbarItem", + "description": "ToolbarItem wrapper used to add any component to Toolbar." + } + ] + }, + "Tree": { + "samples": [ + { + "name": "Basic", + "isBasic": true + }, + { + "name": "CustomTreeItems", + "title": "Custom Tree Items" + }, + { + "name": "DragAndDrop", + "title": "Drag And Drop", + "description": "The tree items are draggable through the use of the `movable` property on `TreeItem`." + } + ] + } +} diff --git a/packages/website/package.json b/packages/website/package.json index 45d223711f24a..808587a9c3623 100644 --- a/packages/website/package.json +++ b/packages/website/package.json @@ -4,7 +4,7 @@ "private": true, "scripts": { "generate-local-cdn": "rimraf ./local-cdn && node ./build-scripts/local-cdn.mjs", - "generate-api-reference": "rimraf ./docs/components/fiori && rimraf ./docs/components/main && rimraf ./docs/components/compat && rimraf ./docs/components/ai && node ./build-scripts/api-reference-generation/index.mjs", + "generate-api-reference": "node ./build-scripts/clean-components.mjs && node ./build-scripts/api-reference-generation/index.mjs", "generate-documentation": "rimraf ./docs/docs && node ./build-scripts/documentation-generation/index.mjs", "generate-icons": "rimraf ./icons && rimraf ./icons-tnt && rimraf ./icons-business-suite && node ./build-scripts/icons-generation/index.mjs", "generate-illustrations": "rimraf ./illustrations && rimraf ./illustrations-tnt && node ./build-scripts/illustrations-generation/index.mjs", From baae46285b286ec5d1a3298b7c9db270d7344bc6 Mon Sep 17 00:00:00 2001 From: Nayden Naydenov Date: Wed, 26 Aug 2026 13:09:30 +0300 Subject: [PATCH 5/5] chore: remove predefined pages --- .../_components_pages/ai/Button/Button.mdx | 22 ---- .../ai/Button/ButtonState.mdx | 7 - .../docs/_components_pages/ai/Input.mdx | 9 -- .../docs/_components_pages/ai/PromptInput.mdx | 8 -- .../docs/_components_pages/ai/TextArea.mdx | 13 -- .../_components_pages/compat/Table/Table.mdx | 50 -------- .../compat/Table/TableCell.mdx | 7 - .../compat/Table/TableColumn.mdx | 7 - .../compat/Table/TableGroupRow.mdx | 7 - .../compat/Table/TableRow.mdx | 7 - .../fiori/BarcodeScannerDialog.mdx | 8 -- .../fiori/DynamicPage/DynamicPage.mdx | 12 -- .../fiori/DynamicPage/DynamicPageHeader.mdx | 7 - .../fiori/DynamicPage/DynamicPageTitle.mdx | 7 - .../fiori/DynamicSideContent.mdx | 22 ---- .../fiori/FlexibleColumnLayout.mdx | 16 --- .../_components_pages/fiori/HeroBanner.mdx | 37 ------ .../fiori/IllustratedMessage.mdx | 22 ---- .../fiori/MediaGallery/MediaGallery.mdx | 54 -------- .../fiori/MediaGallery/MediaGalleryItem.mdx | 7 - .../fiori/NavigationLayout.mdx | 8 -- .../NotificationList/NotificationList.mdx | 20 --- .../NotificationListGroupItem.mdx | 7 - .../NotificationList/NotificationListItem.mdx | 7 - .../docs/_components_pages/fiori/Page.mdx | 15 --- .../fiori/ProductSwitch/ProductSwitch.mdx | 21 --- .../fiori/ProductSwitch/ProductSwitchItem.mdx | 7 - .../_components_pages/fiori/Search/Search.mdx | 49 ------- .../fiori/Search/SearchItem.mdx | 7 - .../fiori/Search/SearchItemGroup.mdx | 7 - .../fiori/Search/SearchItemShowMore.mdx | 4 - .../fiori/Search/SearchMessageArea.mdx | 7 - .../fiori/Search/SearchScope.mdx | 7 - .../fiori/ShellBar/ShellBar.mdx | 48 ------- .../fiori/ShellBar/ShellBarBranding.mdx | 7 - .../fiori/ShellBar/ShellBarItem.mdx | 7 - .../fiori/ShellBar/ShellBarSearch.mdx | 7 - .../fiori/ShellBar/ShellBarSpacer.mdx | 7 - .../fiori/SideNavigation/SideNavigation.mdx | 44 ------- .../SideNavigation/SideNavigationGroup.mdx | 7 - .../SideNavigation/SideNavigationItem.mdx | 7 - .../SideNavigation/SideNavigationSubItem.mdx | 7 - .../fiori/Timeline/Timeline.mdx | 61 --------- .../fiori/Timeline/TimelineGroupItem.mdx | 7 - .../fiori/Timeline/TimelineItem.mdx | 7 - .../UploadCollection/UploadCollection.mdx | 22 ---- .../UploadCollection/UploadCollectionItem.mdx | 7 - .../fiori/UserMenu/UserMenu.mdx | 17 --- .../fiori/UserMenu/UserMenuAccount.mdx | 7 - .../fiori/UserMenu/UserMenuItem.mdx | 7 - .../fiori/UserMenu/UserMenuItemGroup.mdx | 7 - .../UserSettingsAccountView.mdx | 7 - .../UserSettingsAppearanceView.mdx | 7 - .../UserSettingsAppearanceViewGroup.mdx | 7 - .../UserSettingsAppearanceViewItem.mdx | 7 - .../UserSettingsDialog/UserSettingsDialog.mdx | 22 ---- .../UserSettingsDialog/UserSettingsItem.mdx | 7 - .../UserSettingsDialog/UserSettingsView.mdx | 7 - .../fiori/ViewSettingsDialog/FilterItem.mdx | 7 - .../ViewSettingsDialog/FilterItemOption.mdx | 7 - .../fiori/ViewSettingsDialog/GroupItem.mdx | 7 - .../fiori/ViewSettingsDialog/SortItem.mdx | 7 - .../ViewSettingsDialog/ViewSettingsDialog.mdx | 15 --- .../ViewSettingsDialogCustomTab.mdx | 7 - .../_components_pages/fiori/Wizard/Wizard.mdx | 20 --- .../fiori/Wizard/WizardStep.mdx | 7 - .../_components_pages/main/Avatar/Avatar.mdx | 80 ------------ .../main/Avatar/AvatarBadge.mdx | 20 --- .../_components_pages/main/AvatarGroup.mdx | 26 ---- .../docs/_components_pages/main/Bar.mdx | 12 -- .../main/Breadcrumbs/Breadcrumbs.mdx | 40 ------ .../main/Breadcrumbs/BreadcrumbsItem.mdx | 7 - .../_components_pages/main/BusyIndicator.mdx | 33 ----- .../_components_pages/main/Button/Button.mdx | 56 -------- .../main/Button/ButtonBadge.mdx | 7 - .../main/Calendar/Calendar.mdx | 58 --------- .../main/Calendar/CalendarDate.mdx | 7 - .../main/Calendar/CalendarDateRange.mdx | 7 - .../main/Calendar/SpecialCalendarDate.mdx | 7 - .../main/CalendarLegend/CalendarLegend.mdx | 25 ---- .../CalendarLegend/CalendarLegendItem.mdx | 7 - .../docs/_components_pages/main/Card/Card.mdx | 30 ----- .../main/Card/CardHeader.mdx | 7 - .../docs/_components_pages/main/Carousel.mdx | 54 -------- .../docs/_components_pages/main/CheckBox.mdx | 39 ------ .../main/ColorPalette/ColorPalette.mdx | 12 -- .../main/ColorPalette/ColorPaletteItem.mdx | 7 - .../main/ColorPalettePopover.mdx | 25 ---- .../_components_pages/main/ColorPicker.mdx | 18 --- .../main/ComboBox/ComboBox.mdx | 66 ---------- .../main/ComboBox/ComboBoxItem.mdx | 7 - .../main/ComboBox/ComboBoxItemCustom.mdx | 7 - .../main/ComboBox/ComboBoxItemGroup.mdx | 7 - .../_components_pages/main/DatePicker.mdx | 52 -------- .../main/DateRangePicker.mdx | 45 ------- .../_components_pages/main/DateTimePicker.mdx | 41 ------ .../docs/_components_pages/main/Dialog.mdx | 34 ----- .../main/DynamicDateRange.mdx | 14 -- .../_components_pages/main/ExpandableText.mdx | 19 --- .../_components_pages/main/FileUploader.mdx | 42 ------ .../docs/_components_pages/main/Form/Form.mdx | 112 ---------------- .../_components_pages/main/Form/FormGroup.mdx | 7 - .../_components_pages/main/Form/FormItem.mdx | 7 - .../docs/_components_pages/main/Icon.mdx | 50 -------- .../_components_pages/main/Input/Input.mdx | 74 ----------- .../main/Input/InputIcon.mdx | 8 -- .../main/Input/SuggestionItem.mdx | 7 - .../main/Input/SuggestionItemCustom.mdx | 7 - .../main/Input/SuggestionItemGroup.mdx | 7 - .../docs/_components_pages/main/Label.mdx | 32 ----- .../docs/_components_pages/main/Link.mdx | 38 ------ .../docs/_components_pages/main/List/List.mdx | 120 ------------------ .../main/List/ListItemCustom.mdx | 7 - .../main/List/ListItemGroup.mdx | 7 - .../main/List/ListItemStandard.mdx | 7 - .../docs/_components_pages/main/Menu/Menu.mdx | 40 ------ .../_components_pages/main/Menu/MenuItem.mdx | 7 - .../main/Menu/MenuItemGroup.mdx | 7 - .../main/Menu/MenuSeparator.mdx | 7 - .../_components_pages/main/MessageStrip.mdx | 32 ----- .../main/MultiComboBox/MultiComboBox.mdx | 67 ---------- .../main/MultiComboBox/MultiComboBoxItem.mdx | 7 - .../MultiComboBox/MultiComboBoxItemCustom.mdx | 7 - .../MultiComboBox/MultiComboBoxItemGroup.mdx | 7 - .../_components_pages/main/MultiInput.mdx | 24 ---- .../docs/_components_pages/main/Panel.mdx | 34 ----- .../docs/_components_pages/main/Popover.mdx | 28 ---- .../main/ProgressIndicator.mdx | 26 ---- .../_components_pages/main/RadioButton.mdx | 26 ---- .../_components_pages/main/RangeSlider.mdx | 32 ----- .../main/RatingIndicator.mdx | 26 ---- .../main/ResponsivePopover.mdx | 21 --- .../main/SegmentedButton/SegmentedButton.mdx | 25 ---- .../SegmentedButton/SegmentedButtonItem.mdx | 7 - .../_components_pages/main/Select/Option.mdx | 7 - .../main/Select/OptionCustom.mdx | 7 - .../_components_pages/main/Select/Select.mdx | 48 ------- .../docs/_components_pages/main/Slider.mdx | 37 ------ .../_components_pages/main/SplitButton.mdx | 27 ---- .../docs/_components_pages/main/StepInput.mdx | 28 ---- .../docs/_components_pages/main/Switch.mdx | 18 --- .../main/TabContainer/Tab.mdx | 7 - .../main/TabContainer/TabContainer.mdx | 60 --------- .../main/TabContainer/TabSeparator.mdx | 7 - .../_components_pages/main/Table/Table.mdx | 72 ----------- .../main/Table/TableCell.mdx | 39 ------ .../main/Table/TableGroupRow.mdx | 12 -- .../main/Table/TableGrowing.mdx | 18 --- .../main/Table/TableHeaderCell.mdx | 33 ----- .../main/Table/TableHeaderCellActionAI.mdx | 13 -- .../main/Table/TableHeaderRow.mdx | 22 ---- .../_components_pages/main/Table/TableRow.mdx | 23 ---- .../main/Table/TableRowAction.mdx | 13 -- .../main/Table/TableRowActionNavigation.mdx | 13 -- .../main/Table/TableSelection.mdx | 13 -- .../main/Table/TableSelectionMulti.mdx | 13 -- .../main/Table/TableSelectionSingle.mdx | 13 -- .../main/Table/TableVirtualizer.mdx | 13 -- .../docs/_components_pages/main/Tag.mdx | 46 ------- .../docs/_components_pages/main/Text.mdx | 44 ------- .../docs/_components_pages/main/TextArea.mdx | 33 ----- .../_components_pages/main/TimePicker.mdx | 33 ----- .../docs/_components_pages/main/Title.mdx | 19 --- .../docs/_components_pages/main/Toast.mdx | 22 ---- .../_components_pages/main/ToggleButton.mdx | 24 ---- .../docs/_components_pages/main/Token.mdx | 21 --- .../docs/_components_pages/main/Tokenizer.mdx | 21 --- .../main/Toolbar/Toolbar.mdx | 41 ------ .../main/Toolbar/ToolbarButton.mdx | 7 - .../main/Toolbar/ToolbarItem.mdx | 7 - .../main/Toolbar/ToolbarSelect.mdx | 7 - .../main/Toolbar/ToolbarSelectOption.mdx | 7 - .../main/Toolbar/ToolbarSeparator.mdx | 7 - .../main/Toolbar/ToolbarSpacer.mdx | 7 - .../docs/_components_pages/main/Tree/Tree.mdx | 24 ---- .../_components_pages/main/Tree/TreeItem.mdx | 7 - .../main/Tree/TreeItemCustom.mdx | 7 - 177 files changed, 3697 deletions(-) delete mode 100644 packages/website/docs/_components_pages/ai/Button/Button.mdx delete mode 100644 packages/website/docs/_components_pages/ai/Button/ButtonState.mdx delete mode 100644 packages/website/docs/_components_pages/ai/Input.mdx delete mode 100644 packages/website/docs/_components_pages/ai/PromptInput.mdx delete mode 100644 packages/website/docs/_components_pages/ai/TextArea.mdx delete mode 100644 packages/website/docs/_components_pages/compat/Table/Table.mdx delete mode 100644 packages/website/docs/_components_pages/compat/Table/TableCell.mdx delete mode 100644 packages/website/docs/_components_pages/compat/Table/TableColumn.mdx delete mode 100644 packages/website/docs/_components_pages/compat/Table/TableGroupRow.mdx delete mode 100644 packages/website/docs/_components_pages/compat/Table/TableRow.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/BarcodeScannerDialog.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/DynamicPage/DynamicPage.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/DynamicPage/DynamicPageHeader.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/DynamicPage/DynamicPageTitle.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/DynamicSideContent.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/FlexibleColumnLayout.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/HeroBanner.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/IllustratedMessage.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/MediaGallery/MediaGallery.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/MediaGallery/MediaGalleryItem.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/NavigationLayout.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/NotificationList/NotificationList.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/NotificationList/NotificationListGroupItem.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/NotificationList/NotificationListItem.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/Page.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/ProductSwitch/ProductSwitch.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/ProductSwitch/ProductSwitchItem.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/Search/Search.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/Search/SearchItem.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/Search/SearchItemGroup.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/Search/SearchItemShowMore.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/Search/SearchMessageArea.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/Search/SearchScope.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/ShellBar/ShellBar.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/ShellBar/ShellBarBranding.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/ShellBar/ShellBarItem.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/ShellBar/ShellBarSearch.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/ShellBar/ShellBarSpacer.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/SideNavigation/SideNavigation.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/SideNavigation/SideNavigationGroup.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/SideNavigation/SideNavigationItem.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/SideNavigation/SideNavigationSubItem.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/Timeline/Timeline.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/Timeline/TimelineGroupItem.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/Timeline/TimelineItem.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/UploadCollection/UploadCollection.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/UploadCollection/UploadCollectionItem.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/UserMenu/UserMenu.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/UserMenu/UserMenuAccount.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/UserMenu/UserMenuItem.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/UserMenu/UserMenuItemGroup.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/UserSettingsDialog/UserSettingsAccountView.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/UserSettingsDialog/UserSettingsAppearanceView.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/UserSettingsDialog/UserSettingsAppearanceViewGroup.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/UserSettingsDialog/UserSettingsAppearanceViewItem.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/UserSettingsDialog/UserSettingsDialog.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/UserSettingsDialog/UserSettingsItem.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/UserSettingsDialog/UserSettingsView.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/ViewSettingsDialog/FilterItem.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/ViewSettingsDialog/FilterItemOption.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/ViewSettingsDialog/GroupItem.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/ViewSettingsDialog/SortItem.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/ViewSettingsDialog/ViewSettingsDialog.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/ViewSettingsDialog/ViewSettingsDialogCustomTab.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/Wizard/Wizard.mdx delete mode 100644 packages/website/docs/_components_pages/fiori/Wizard/WizardStep.mdx delete mode 100644 packages/website/docs/_components_pages/main/Avatar/Avatar.mdx delete mode 100644 packages/website/docs/_components_pages/main/Avatar/AvatarBadge.mdx delete mode 100644 packages/website/docs/_components_pages/main/AvatarGroup.mdx delete mode 100644 packages/website/docs/_components_pages/main/Bar.mdx delete mode 100644 packages/website/docs/_components_pages/main/Breadcrumbs/Breadcrumbs.mdx delete mode 100644 packages/website/docs/_components_pages/main/Breadcrumbs/BreadcrumbsItem.mdx delete mode 100644 packages/website/docs/_components_pages/main/BusyIndicator.mdx delete mode 100644 packages/website/docs/_components_pages/main/Button/Button.mdx delete mode 100644 packages/website/docs/_components_pages/main/Button/ButtonBadge.mdx delete mode 100644 packages/website/docs/_components_pages/main/Calendar/Calendar.mdx delete mode 100644 packages/website/docs/_components_pages/main/Calendar/CalendarDate.mdx delete mode 100644 packages/website/docs/_components_pages/main/Calendar/CalendarDateRange.mdx delete mode 100644 packages/website/docs/_components_pages/main/Calendar/SpecialCalendarDate.mdx delete mode 100644 packages/website/docs/_components_pages/main/CalendarLegend/CalendarLegend.mdx delete mode 100644 packages/website/docs/_components_pages/main/CalendarLegend/CalendarLegendItem.mdx delete mode 100644 packages/website/docs/_components_pages/main/Card/Card.mdx delete mode 100644 packages/website/docs/_components_pages/main/Card/CardHeader.mdx delete mode 100644 packages/website/docs/_components_pages/main/Carousel.mdx delete mode 100644 packages/website/docs/_components_pages/main/CheckBox.mdx delete mode 100644 packages/website/docs/_components_pages/main/ColorPalette/ColorPalette.mdx delete mode 100644 packages/website/docs/_components_pages/main/ColorPalette/ColorPaletteItem.mdx delete mode 100644 packages/website/docs/_components_pages/main/ColorPalettePopover.mdx delete mode 100644 packages/website/docs/_components_pages/main/ColorPicker.mdx delete mode 100644 packages/website/docs/_components_pages/main/ComboBox/ComboBox.mdx delete mode 100644 packages/website/docs/_components_pages/main/ComboBox/ComboBoxItem.mdx delete mode 100644 packages/website/docs/_components_pages/main/ComboBox/ComboBoxItemCustom.mdx delete mode 100644 packages/website/docs/_components_pages/main/ComboBox/ComboBoxItemGroup.mdx delete mode 100644 packages/website/docs/_components_pages/main/DatePicker.mdx delete mode 100644 packages/website/docs/_components_pages/main/DateRangePicker.mdx delete mode 100644 packages/website/docs/_components_pages/main/DateTimePicker.mdx delete mode 100644 packages/website/docs/_components_pages/main/Dialog.mdx delete mode 100644 packages/website/docs/_components_pages/main/DynamicDateRange.mdx delete mode 100644 packages/website/docs/_components_pages/main/ExpandableText.mdx delete mode 100644 packages/website/docs/_components_pages/main/FileUploader.mdx delete mode 100644 packages/website/docs/_components_pages/main/Form/Form.mdx delete mode 100644 packages/website/docs/_components_pages/main/Form/FormGroup.mdx delete mode 100644 packages/website/docs/_components_pages/main/Form/FormItem.mdx delete mode 100644 packages/website/docs/_components_pages/main/Icon.mdx delete mode 100644 packages/website/docs/_components_pages/main/Input/Input.mdx delete mode 100644 packages/website/docs/_components_pages/main/Input/InputIcon.mdx delete mode 100644 packages/website/docs/_components_pages/main/Input/SuggestionItem.mdx delete mode 100644 packages/website/docs/_components_pages/main/Input/SuggestionItemCustom.mdx delete mode 100644 packages/website/docs/_components_pages/main/Input/SuggestionItemGroup.mdx delete mode 100644 packages/website/docs/_components_pages/main/Label.mdx delete mode 100644 packages/website/docs/_components_pages/main/Link.mdx delete mode 100644 packages/website/docs/_components_pages/main/List/List.mdx delete mode 100644 packages/website/docs/_components_pages/main/List/ListItemCustom.mdx delete mode 100644 packages/website/docs/_components_pages/main/List/ListItemGroup.mdx delete mode 100644 packages/website/docs/_components_pages/main/List/ListItemStandard.mdx delete mode 100644 packages/website/docs/_components_pages/main/Menu/Menu.mdx delete mode 100644 packages/website/docs/_components_pages/main/Menu/MenuItem.mdx delete mode 100644 packages/website/docs/_components_pages/main/Menu/MenuItemGroup.mdx delete mode 100644 packages/website/docs/_components_pages/main/Menu/MenuSeparator.mdx delete mode 100644 packages/website/docs/_components_pages/main/MessageStrip.mdx delete mode 100644 packages/website/docs/_components_pages/main/MultiComboBox/MultiComboBox.mdx delete mode 100644 packages/website/docs/_components_pages/main/MultiComboBox/MultiComboBoxItem.mdx delete mode 100644 packages/website/docs/_components_pages/main/MultiComboBox/MultiComboBoxItemCustom.mdx delete mode 100644 packages/website/docs/_components_pages/main/MultiComboBox/MultiComboBoxItemGroup.mdx delete mode 100644 packages/website/docs/_components_pages/main/MultiInput.mdx delete mode 100644 packages/website/docs/_components_pages/main/Panel.mdx delete mode 100644 packages/website/docs/_components_pages/main/Popover.mdx delete mode 100644 packages/website/docs/_components_pages/main/ProgressIndicator.mdx delete mode 100644 packages/website/docs/_components_pages/main/RadioButton.mdx delete mode 100644 packages/website/docs/_components_pages/main/RangeSlider.mdx delete mode 100644 packages/website/docs/_components_pages/main/RatingIndicator.mdx delete mode 100644 packages/website/docs/_components_pages/main/ResponsivePopover.mdx delete mode 100644 packages/website/docs/_components_pages/main/SegmentedButton/SegmentedButton.mdx delete mode 100644 packages/website/docs/_components_pages/main/SegmentedButton/SegmentedButtonItem.mdx delete mode 100644 packages/website/docs/_components_pages/main/Select/Option.mdx delete mode 100644 packages/website/docs/_components_pages/main/Select/OptionCustom.mdx delete mode 100644 packages/website/docs/_components_pages/main/Select/Select.mdx delete mode 100644 packages/website/docs/_components_pages/main/Slider.mdx delete mode 100644 packages/website/docs/_components_pages/main/SplitButton.mdx delete mode 100644 packages/website/docs/_components_pages/main/StepInput.mdx delete mode 100644 packages/website/docs/_components_pages/main/Switch.mdx delete mode 100644 packages/website/docs/_components_pages/main/TabContainer/Tab.mdx delete mode 100644 packages/website/docs/_components_pages/main/TabContainer/TabContainer.mdx delete mode 100644 packages/website/docs/_components_pages/main/TabContainer/TabSeparator.mdx delete mode 100644 packages/website/docs/_components_pages/main/Table/Table.mdx delete mode 100644 packages/website/docs/_components_pages/main/Table/TableCell.mdx delete mode 100644 packages/website/docs/_components_pages/main/Table/TableGroupRow.mdx delete mode 100644 packages/website/docs/_components_pages/main/Table/TableGrowing.mdx delete mode 100644 packages/website/docs/_components_pages/main/Table/TableHeaderCell.mdx delete mode 100644 packages/website/docs/_components_pages/main/Table/TableHeaderCellActionAI.mdx delete mode 100644 packages/website/docs/_components_pages/main/Table/TableHeaderRow.mdx delete mode 100644 packages/website/docs/_components_pages/main/Table/TableRow.mdx delete mode 100644 packages/website/docs/_components_pages/main/Table/TableRowAction.mdx delete mode 100644 packages/website/docs/_components_pages/main/Table/TableRowActionNavigation.mdx delete mode 100644 packages/website/docs/_components_pages/main/Table/TableSelection.mdx delete mode 100644 packages/website/docs/_components_pages/main/Table/TableSelectionMulti.mdx delete mode 100644 packages/website/docs/_components_pages/main/Table/TableSelectionSingle.mdx delete mode 100644 packages/website/docs/_components_pages/main/Table/TableVirtualizer.mdx delete mode 100644 packages/website/docs/_components_pages/main/Tag.mdx delete mode 100644 packages/website/docs/_components_pages/main/Text.mdx delete mode 100644 packages/website/docs/_components_pages/main/TextArea.mdx delete mode 100644 packages/website/docs/_components_pages/main/TimePicker.mdx delete mode 100644 packages/website/docs/_components_pages/main/Title.mdx delete mode 100644 packages/website/docs/_components_pages/main/Toast.mdx delete mode 100644 packages/website/docs/_components_pages/main/ToggleButton.mdx delete mode 100644 packages/website/docs/_components_pages/main/Token.mdx delete mode 100644 packages/website/docs/_components_pages/main/Tokenizer.mdx delete mode 100644 packages/website/docs/_components_pages/main/Toolbar/Toolbar.mdx delete mode 100644 packages/website/docs/_components_pages/main/Toolbar/ToolbarButton.mdx delete mode 100644 packages/website/docs/_components_pages/main/Toolbar/ToolbarItem.mdx delete mode 100644 packages/website/docs/_components_pages/main/Toolbar/ToolbarSelect.mdx delete mode 100644 packages/website/docs/_components_pages/main/Toolbar/ToolbarSelectOption.mdx delete mode 100644 packages/website/docs/_components_pages/main/Toolbar/ToolbarSeparator.mdx delete mode 100644 packages/website/docs/_components_pages/main/Toolbar/ToolbarSpacer.mdx delete mode 100644 packages/website/docs/_components_pages/main/Tree/Tree.mdx delete mode 100644 packages/website/docs/_components_pages/main/Tree/TreeItem.mdx delete mode 100644 packages/website/docs/_components_pages/main/Tree/TreeItemCustom.mdx diff --git a/packages/website/docs/_components_pages/ai/Button/Button.mdx b/packages/website/docs/_components_pages/ai/Button/Button.mdx deleted file mode 100644 index d031340b68a70..0000000000000 --- a/packages/website/docs/_components_pages/ai/Button/Button.mdx +++ /dev/null @@ -1,22 +0,0 @@ ---- -slug: ../Button ---- - -import ButtonMenu from "../../../_samples/ai/Button/ButtonMenu/ButtonMenu.md"; -import ButtonSplitMenu from "../../../_samples/ai/Button/ButtonSplitMenu/ButtonSplitMenu.md"; -import IconOnlyButton from "../../../_samples/ai/Button/IconOnlyButton/IconOnlyButton.md"; - -<%COMPONENT_OVERVIEW%> - -## Basic Sample - - -<%COMPONENT_METADATA%> - -## More Samples - -## AI Button With Split Mode State - - -### Icon-only AI Button With Menu - \ No newline at end of file diff --git a/packages/website/docs/_components_pages/ai/Button/ButtonState.mdx b/packages/website/docs/_components_pages/ai/Button/ButtonState.mdx deleted file mode 100644 index eec7c67ffaa91..0000000000000 --- a/packages/website/docs/_components_pages/ai/Button/ButtonState.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../ButtonState ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/ai/Input.mdx b/packages/website/docs/_components_pages/ai/Input.mdx deleted file mode 100644 index dd7eb26c0f097..0000000000000 --- a/packages/website/docs/_components_pages/ai/Input.mdx +++ /dev/null @@ -1,9 +0,0 @@ - -import Basic from "../../_samples/ai/Input/Basic/Basic.md"; - -<%COMPONENT_OVERVIEW%> - -## Basic Sample - - -<%COMPONENT_METADATA%> diff --git a/packages/website/docs/_components_pages/ai/PromptInput.mdx b/packages/website/docs/_components_pages/ai/PromptInput.mdx deleted file mode 100644 index 862d9fef74aee..0000000000000 --- a/packages/website/docs/_components_pages/ai/PromptInput.mdx +++ /dev/null @@ -1,8 +0,0 @@ -import Basic from "../../_samples/ai/PromptInput/Basic/Basic.md"; - -<%COMPONENT_OVERVIEW%> - -## Basic Sample - - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/ai/TextArea.mdx b/packages/website/docs/_components_pages/ai/TextArea.mdx deleted file mode 100644 index 434d69f04e0e7..0000000000000 --- a/packages/website/docs/_components_pages/ai/TextArea.mdx +++ /dev/null @@ -1,13 +0,0 @@ -import Basic from "../../_samples/ai/TextArea/Basic/Basic.md"; -import Extended from "../../_samples/ai/TextArea/Extended/Extended.md"; - -<%COMPONENT_OVERVIEW%> - -## Basic Sample - - -<%COMPONENT_METADATA%> -## Extended Sample -This extended sample showcases advanced AI TextArea features including multiple AI actions and version management. - - \ No newline at end of file diff --git a/packages/website/docs/_components_pages/compat/Table/Table.mdx b/packages/website/docs/_components_pages/compat/Table/Table.mdx deleted file mode 100644 index f2ee2ecb6abb1..0000000000000 --- a/packages/website/docs/_components_pages/compat/Table/Table.mdx +++ /dev/null @@ -1,50 +0,0 @@ ---- -slug: ../Table ---- - -import Basic from "../../../_samples/compat/Table/Basic/Basic.md"; -import ActiveRows from "../../../_samples/compat/Table/ActiveRows/ActiveRows.md"; -import Grouping from "../../../_samples/compat/Table/Grouping/Grouping.md"; -import GrowingOnButtonPress from "../../../_samples/compat/Table/GrowingOnButtonPress/GrowingOnButtonPress.md"; -import GrowingOnScroll from "../../../_samples/compat/Table/GrowingOnScroll/GrowingOnScroll.md"; -import NoData from "../../../_samples/compat/Table/NoData/NoData.md"; -import Popin from "../../../_samples/compat/Table/Popin/Popin.md"; -import SingleSelection from "../../../_samples/compat/Table/SingleSelection/SingleSelection.md"; -import MultipleSelection from "../../../_samples/compat/Table/MultipleSelection/MultipleSelection.md"; -import StickyHeader from "../../../_samples/compat/Table/StickyHeader/StickyHeader.md"; - -<%COMPONENT_OVERVIEW%> - -## Basic Sample - - -<%COMPONENT_METADATA%> - -## More Samples - -### Active Rows - - -### Columns Popin - - -### Single Selection - - -### Multiple Selection - - -### Grouping - - -### Growing on Button Press - - -### Growing on Scroll - - -### No Data - - -### Sticky Header - \ No newline at end of file diff --git a/packages/website/docs/_components_pages/compat/Table/TableCell.mdx b/packages/website/docs/_components_pages/compat/Table/TableCell.mdx deleted file mode 100644 index b2480f9272763..0000000000000 --- a/packages/website/docs/_components_pages/compat/Table/TableCell.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../TableCell ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/compat/Table/TableColumn.mdx b/packages/website/docs/_components_pages/compat/Table/TableColumn.mdx deleted file mode 100644 index 07a9a481ca1fb..0000000000000 --- a/packages/website/docs/_components_pages/compat/Table/TableColumn.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../TableColumn ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/compat/Table/TableGroupRow.mdx b/packages/website/docs/_components_pages/compat/Table/TableGroupRow.mdx deleted file mode 100644 index c69f0148608ab..0000000000000 --- a/packages/website/docs/_components_pages/compat/Table/TableGroupRow.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../TableGroupRow ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/compat/Table/TableRow.mdx b/packages/website/docs/_components_pages/compat/Table/TableRow.mdx deleted file mode 100644 index 20bca9218aa0a..0000000000000 --- a/packages/website/docs/_components_pages/compat/Table/TableRow.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../TableRow ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/fiori/BarcodeScannerDialog.mdx b/packages/website/docs/_components_pages/fiori/BarcodeScannerDialog.mdx deleted file mode 100644 index 3308d0f249de5..0000000000000 --- a/packages/website/docs/_components_pages/fiori/BarcodeScannerDialog.mdx +++ /dev/null @@ -1,8 +0,0 @@ -import Basic from "../../_samples/fiori/BardcodeScannerDialog/Basic/Basic.md"; - -<%COMPONENT_OVERVIEW%> - -## Basic Sample - - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/fiori/DynamicPage/DynamicPage.mdx b/packages/website/docs/_components_pages/fiori/DynamicPage/DynamicPage.mdx deleted file mode 100644 index db38a61a0bfcd..0000000000000 --- a/packages/website/docs/_components_pages/fiori/DynamicPage/DynamicPage.mdx +++ /dev/null @@ -1,12 +0,0 @@ ---- -slug: ../DynamicPage ---- - -import Basic from "../../../_samples/fiori/DynamicPage/Basic/Basic.md"; - -<%COMPONENT_OVERVIEW%> - -## Basic Usage - - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/fiori/DynamicPage/DynamicPageHeader.mdx b/packages/website/docs/_components_pages/fiori/DynamicPage/DynamicPageHeader.mdx deleted file mode 100644 index 48e9e4892a52e..0000000000000 --- a/packages/website/docs/_components_pages/fiori/DynamicPage/DynamicPageHeader.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../DynamicPageHeader ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/fiori/DynamicPage/DynamicPageTitle.mdx b/packages/website/docs/_components_pages/fiori/DynamicPage/DynamicPageTitle.mdx deleted file mode 100644 index 431926935ad95..0000000000000 --- a/packages/website/docs/_components_pages/fiori/DynamicPage/DynamicPageTitle.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../DynamicPageTitle ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/fiori/DynamicSideContent.mdx b/packages/website/docs/_components_pages/fiori/DynamicSideContent.mdx deleted file mode 100644 index 29e1b28714cb1..0000000000000 --- a/packages/website/docs/_components_pages/fiori/DynamicSideContent.mdx +++ /dev/null @@ -1,22 +0,0 @@ -import Basic from "../../_samples/fiori/DynamicSideContent/Basic/Basic.md"; -import SideContentPosition from "../../_samples/fiori/DynamicSideContent/SideContentPosition/SideContentPosition.md"; -import EqualSplit from "../../_samples/fiori/DynamicSideContent/EqualSplit/EqualSplit.md"; - -<%COMPONENT_OVERVIEW%> - -## Basic Sample - - -<%COMPONENT_METADATA%> - -## More Samples - -### Side Content Position -The side content can be placed at the "Start" or at the "End" via the sideContentPosition property. - - - -### Equal Split -When equalSplit property is set, the main and side contents take equal space. - - \ No newline at end of file diff --git a/packages/website/docs/_components_pages/fiori/FlexibleColumnLayout.mdx b/packages/website/docs/_components_pages/fiori/FlexibleColumnLayout.mdx deleted file mode 100644 index 384236dd1f0cc..0000000000000 --- a/packages/website/docs/_components_pages/fiori/FlexibleColumnLayout.mdx +++ /dev/null @@ -1,16 +0,0 @@ -import Basic from "../../_samples/fiori/FlexibleColumnLayout/Basic/Basic.md"; -import LayoutsConfiguration from "../../_samples/fiori/FlexibleColumnLayout/LayoutsConfiguration/LayoutsConfiguration.md"; - -<%COMPONENT_OVERVIEW%> - -## Basic Sample - - -<%COMPONENT_METADATA%> - -## More Samples - -### LayoutsConfiguration -The FlexibleColumnLayout supports customization of the column sizes within the limits of the current layout. - - \ No newline at end of file diff --git a/packages/website/docs/_components_pages/fiori/HeroBanner.mdx b/packages/website/docs/_components_pages/fiori/HeroBanner.mdx deleted file mode 100644 index 597d9be87e705..0000000000000 --- a/packages/website/docs/_components_pages/fiori/HeroBanner.mdx +++ /dev/null @@ -1,37 +0,0 @@ ---- -ui5_tag_name: ui5-hero-banner -ui5_since: 2.23.0 -sidebar_class_name: expComponentBadge newComponentBadge ---- - -import Basic from "../../_samples/fiori/HeroBanner/Basic/Basic.md"; -import ColumnsRatio from "../../_samples/fiori/HeroBanner/ColumnsRatio/ColumnsRatio.md"; -import UseCases from "../../_samples/fiori/HeroBanner/UseCases/UseCases.md"; -import BackgroundImage from "../../_samples/fiori/HeroBanner/BackgroundImage/BackgroundImage.md"; -import HeaderBlockAndActionsPlacement from "../../_samples/fiori/HeroBanner/HeaderBlockAndActionsPlacement/HeaderBlockAndActionsPlacement.md"; - -<%COMPONENT_OVERVIEW%> - -## Basic Sample - - -<%COMPONENT_METADATA%> - -## More Samples - -### Columns Ratio - - - -### Header Block and Actions Placement - - - -### Custom Background Image - - - -### Different Use Cases - - - diff --git a/packages/website/docs/_components_pages/fiori/IllustratedMessage.mdx b/packages/website/docs/_components_pages/fiori/IllustratedMessage.mdx deleted file mode 100644 index a567496881517..0000000000000 --- a/packages/website/docs/_components_pages/fiori/IllustratedMessage.mdx +++ /dev/null @@ -1,22 +0,0 @@ -import Basic from "../../_samples/fiori/IllustratedMessage/Basic/Basic.md"; -import CustomTitle from "../../_samples/fiori/IllustratedMessage/CustomTitle/CustomTitle.md"; -import WithDialog from "../../_samples/fiori/IllustratedMessage/WithDialog/WithDialog.md"; - -<%COMPONENT_OVERVIEW%> - -## Basic Sample - - -<%COMPONENT_METADATA%> - -## More Samples - -### Custom Title -By default the IllustratedMessage displays built-in title, but a custom title can be also set. - - - -### IllustratedMessage in Dialog -In genral IllustratedMessage can be displayed in many places and cases - one of them is inside Dialog. - - \ No newline at end of file diff --git a/packages/website/docs/_components_pages/fiori/MediaGallery/MediaGallery.mdx b/packages/website/docs/_components_pages/fiori/MediaGallery/MediaGallery.mdx deleted file mode 100644 index 0d5387c2a565a..0000000000000 --- a/packages/website/docs/_components_pages/fiori/MediaGallery/MediaGallery.mdx +++ /dev/null @@ -1,54 +0,0 @@ -import Basic from "../../../_samples/fiori/MediaGallery/Basic/Basic.md"; -import Interactive from "../../../_samples/fiori/MediaGallery/Interactive/Interactive.md"; -import Horizontal from "../../../_samples/fiori/MediaGallery/Horizontal/Horizontal.md"; -import ThumbnailCustom from "../../../_samples/fiori/MediaGallery/ThumbnailCustom/ThumbnailCustom.md"; -import VideoContent from "../../../_samples/fiori/MediaGallery/VideoContent/VideoContent.md"; -import Vertical from "../../../_samples/fiori/MediaGallery/Vertical/Vertical.md"; -import WithSelectedItem from "../../../_samples/fiori/MediaGallery/WithSelectedItem/WithSelectedItem.md"; -import WithDisabledItem from "../../../_samples/fiori/MediaGallery/WithDisabledItem/WithDisabledItem.md"; - -<%COMPONENT_OVERVIEW%> - -## Basic Sample - - -<%COMPONENT_METADATA%> - -## More Samples - -### Vertical Layout -The thumbnails and selected item are vertically placed. To enable this layout - set layout="Vertical". - - - -### Horizontal Layout -The thumbnails and selected item are vertically placed. To enable this layout - set layout="Horizontal". -Furthermore, you can also define on which side of the selected item you preffer to place the thumnails. -For instance, setting menu-horizontal-align="Right" will place the thumbnails on the rigtht. - - - -### Custom Thumbnail -By default the image, passed to the MediaGalleryItem, is reused as a thumbnail that the user clicks. -However, you can display another image as thumbnail via the thumbnail slot of the MediaGalleryItem. - - - -### Selected Item -You can predefine the selected item. - - - -### Disabled Item -The MediaGallery can show diasbled items as well. In this sample, the first item is disabled and second is shown. - - - -### Interactive Display Area -Setting interactiveDisplayArea property makes the diplay area (where the media content is displayed) interactive, e.g. clickable. -In the sample, clicking on the diplay area fires an event, and in this case we show a dialog, but the application can do whatever suitable in the given scenario. - - - -### Show Video Content - \ No newline at end of file diff --git a/packages/website/docs/_components_pages/fiori/MediaGallery/MediaGalleryItem.mdx b/packages/website/docs/_components_pages/fiori/MediaGallery/MediaGalleryItem.mdx deleted file mode 100644 index 695676939b69a..0000000000000 --- a/packages/website/docs/_components_pages/fiori/MediaGallery/MediaGalleryItem.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../MediaGalleryItem ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/fiori/NavigationLayout.mdx b/packages/website/docs/_components_pages/fiori/NavigationLayout.mdx deleted file mode 100644 index 54733b1f8deaa..0000000000000 --- a/packages/website/docs/_components_pages/fiori/NavigationLayout.mdx +++ /dev/null @@ -1,8 +0,0 @@ -import Basic from "../../_samples/fiori/NavigationLayout/Basic/Basic.md"; - -<%COMPONENT_OVERVIEW%> - -## Basic Sample - - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/fiori/NotificationList/NotificationList.mdx b/packages/website/docs/_components_pages/fiori/NotificationList/NotificationList.mdx deleted file mode 100644 index f3c41585dc30f..0000000000000 --- a/packages/website/docs/_components_pages/fiori/NotificationList/NotificationList.mdx +++ /dev/null @@ -1,20 +0,0 @@ -import Basic from "../../../_samples/fiori/NotificationList/Basic/Basic.md"; -import GroupItems from "../../../_samples/fiori/NotificationList/GroupItems/Basic.md"; -import InShellBar from "../../../_samples/fiori/NotificationList/InShellBar/InShellBar.md"; - -<%COMPONENT_OVERVIEW%> - -## Basic Sample - - -<%COMPONENT_METADATA%> - -## More Samples - -### Notification List with Group Items - - -### Notifications in ShellBar -The main usage of the Notifications is in the ShellBar. -Press the "notifications" icon on the right side of the ShellBar to show the Notifications. - \ No newline at end of file diff --git a/packages/website/docs/_components_pages/fiori/NotificationList/NotificationListGroupItem.mdx b/packages/website/docs/_components_pages/fiori/NotificationList/NotificationListGroupItem.mdx deleted file mode 100644 index 9877e63d2afc0..0000000000000 --- a/packages/website/docs/_components_pages/fiori/NotificationList/NotificationListGroupItem.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../NotificationListGroupItem ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/fiori/NotificationList/NotificationListItem.mdx b/packages/website/docs/_components_pages/fiori/NotificationList/NotificationListItem.mdx deleted file mode 100644 index 90ff986b5b3e3..0000000000000 --- a/packages/website/docs/_components_pages/fiori/NotificationList/NotificationListItem.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../NotificationListItem ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> diff --git a/packages/website/docs/_components_pages/fiori/Page.mdx b/packages/website/docs/_components_pages/fiori/Page.mdx deleted file mode 100644 index 85113392244c6..0000000000000 --- a/packages/website/docs/_components_pages/fiori/Page.mdx +++ /dev/null @@ -1,15 +0,0 @@ -import Basic from "../../_samples/fiori/Page/Basic/Basic.md"; -import FixedFooter from "../../_samples/fiori/Page/FixedFooter/FixedFooter.md"; - -<%COMPONENT_OVERVIEW%> - -## Basic Sample - - -<%COMPONENT_METADATA%> - -## More Samples - -### Fixed Footer - - \ No newline at end of file diff --git a/packages/website/docs/_components_pages/fiori/ProductSwitch/ProductSwitch.mdx b/packages/website/docs/_components_pages/fiori/ProductSwitch/ProductSwitch.mdx deleted file mode 100644 index 759bf23eea423..0000000000000 --- a/packages/website/docs/_components_pages/fiori/ProductSwitch/ProductSwitch.mdx +++ /dev/null @@ -1,21 +0,0 @@ -import Basic from "../../../_samples/fiori/ProductSwitch/Basic/Basic.md"; -import WithShellBar from "../../../_samples/fiori/ProductSwitch/WithShellBar/WithShellBar.md"; -import WithImageSlot from "../../../_samples/fiori/ProductSwitch/WithImageSlot/WithImageSlot.md"; - -<%COMPONENT_OVERVIEW%> - -## Basic Sample - - -<%COMPONENT_METADATA%> - -## More Samples - -### ProductSwitch in ShellBar -Press the "grid" on the right-most part of the ShellBar to show the ProductSwitch. - - - -### ProductSwitchItem with "image" slot - - \ No newline at end of file diff --git a/packages/website/docs/_components_pages/fiori/ProductSwitch/ProductSwitchItem.mdx b/packages/website/docs/_components_pages/fiori/ProductSwitch/ProductSwitchItem.mdx deleted file mode 100644 index 41cc7481ac68d..0000000000000 --- a/packages/website/docs/_components_pages/fiori/ProductSwitch/ProductSwitchItem.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../ProductSwitchItem ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/fiori/Search/Search.mdx b/packages/website/docs/_components_pages/fiori/Search/Search.mdx deleted file mode 100644 index 3a3acced05e8e..0000000000000 --- a/packages/website/docs/_components_pages/fiori/Search/Search.mdx +++ /dev/null @@ -1,49 +0,0 @@ -import Basic from "../../../_samples/fiori/Search/Basic/Basic.md"; -import Advanced from "../../../_samples/fiori/Search/Advanced/Advanced.md"; -import Byline from "../../../_samples/fiori/Search/Byline/Byline.md"; -import AdvancedFilter from "../../../_samples/fiori/Search/AdvancedFilter/AdvancedFilter.md" -import ShowMore from "../../../_samples/fiori/Search/ShowMore/ShowMore.md" -import Actions from "../../../_samples/fiori/Search/Actions/Actions.md" -import Loading from "../../../_samples/fiori/Search/Loading/Loading.md" - -<%COMPONENT_OVERVIEW%> - -## Basic Sample -A Search component with enabled scope and items and filtering by scope. - - - -<%COMPONENT_METADATA%> - -## More Samples - -### Filtering -The examples show the search message area, the search action, filtering per user input, typeahead and highlighting suggestions per user input. - - - -### Advanced Filtering Button -This example shows how to use a custom advanced filtering button via the `filterButton` slot. - - - -### Byline items -The example shows how to display byline items with an image and description. - - - -### Show More Item -This example shows how to use a Show More Item. - - - -### Actions -This example shows how to use a interactive elements in search items. - - - -### Loading State -This example shows the loading indicator during async search operations. - - - diff --git a/packages/website/docs/_components_pages/fiori/Search/SearchItem.mdx b/packages/website/docs/_components_pages/fiori/Search/SearchItem.mdx deleted file mode 100644 index aff808c32d004..0000000000000 --- a/packages/website/docs/_components_pages/fiori/Search/SearchItem.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../SearchItem ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/fiori/Search/SearchItemGroup.mdx b/packages/website/docs/_components_pages/fiori/Search/SearchItemGroup.mdx deleted file mode 100644 index 30476aa3bce8c..0000000000000 --- a/packages/website/docs/_components_pages/fiori/Search/SearchItemGroup.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../SearchItemGroup ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/fiori/Search/SearchItemShowMore.mdx b/packages/website/docs/_components_pages/fiori/Search/SearchItemShowMore.mdx deleted file mode 100644 index 9bc8d23104652..0000000000000 --- a/packages/website/docs/_components_pages/fiori/Search/SearchItemShowMore.mdx +++ /dev/null @@ -1,4 +0,0 @@ - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/fiori/Search/SearchMessageArea.mdx b/packages/website/docs/_components_pages/fiori/Search/SearchMessageArea.mdx deleted file mode 100644 index 5f7cc5fd68d19..0000000000000 --- a/packages/website/docs/_components_pages/fiori/Search/SearchMessageArea.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../SearchMessageArea ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/fiori/Search/SearchScope.mdx b/packages/website/docs/_components_pages/fiori/Search/SearchScope.mdx deleted file mode 100644 index c8f851341ed3e..0000000000000 --- a/packages/website/docs/_components_pages/fiori/Search/SearchScope.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../SearchScope ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/fiori/ShellBar/ShellBar.mdx b/packages/website/docs/_components_pages/fiori/ShellBar/ShellBar.mdx deleted file mode 100644 index ffcec3748a364..0000000000000 --- a/packages/website/docs/_components_pages/fiori/ShellBar/ShellBar.mdx +++ /dev/null @@ -1,48 +0,0 @@ -import Basic from "../../../_samples/fiori/ShellBar/Basic/Basic.md"; -import Advanced from "../../../_samples/fiori/ShellBar/Advanced/Advanced.md"; -import EmbeddedBackNavigation from "../../../_samples/fiori/ShellBar/EmbeddedBackNavigation/EmbeddedBackNavigation.md"; -import MultipleNonProductiveInstances from "../../../_samples/fiori/ShellBar/MultipleNonProductiveInstances/MultipleNonProductiveInstances.md"; -import MultipleProductiveInstances from "../../../_samples/fiori/ShellBar/MultipleProductiveInstances/MultipleProductiveInstances.md"; -import TrialExample from "../../../_samples/fiori/ShellBar/TrialExample/TrialExample.md"; -import Overflow from "../../../_samples/fiori/ShellBar/Overflow/Overflow.md"; - -<%COMPONENT_OVERVIEW%> - -## Basic Sample -The ShellBar includes Back button, Logo, Title and Profile image. - - - -<%COMPONENT_METADATA%> - -## More Samples - -### All Features -A comprehensive ShellBar demonstrating all available features including notifications, search, content items, and profile. - - - -### Embedded Back Navigation -ShellBar with embedded back navigation button in the start area. - - - -### Trial Example -ShellBar configured for trial environments with trial tags and remaining days indicator. - - - -### Multiple Productive Instances -ShellBar setup for multiple productive system instances with region indicators. - - - -### Multiple Non-Productive Instances -ShellBar setup for multiple non-productive system instances with system and region tags. - - - -### Application-Level Overflow -This sample demonstrates how applications can implement custom overflow handling for content items. When the ShellBar becomes narrow, content items are hidden and the application renders them in a custom popover. The sample listens to the `content-item-visibility-change` event and manages its own overflow button and popover. Use the slider to resize and observe the overflow behavior. - - \ No newline at end of file diff --git a/packages/website/docs/_components_pages/fiori/ShellBar/ShellBarBranding.mdx b/packages/website/docs/_components_pages/fiori/ShellBar/ShellBarBranding.mdx deleted file mode 100644 index c5a50199a9353..0000000000000 --- a/packages/website/docs/_components_pages/fiori/ShellBar/ShellBarBranding.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../ShellBarBranding ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/fiori/ShellBar/ShellBarItem.mdx b/packages/website/docs/_components_pages/fiori/ShellBar/ShellBarItem.mdx deleted file mode 100644 index 8436d90eaa4e1..0000000000000 --- a/packages/website/docs/_components_pages/fiori/ShellBar/ShellBarItem.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../ShellBarItem ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/fiori/ShellBar/ShellBarSearch.mdx b/packages/website/docs/_components_pages/fiori/ShellBar/ShellBarSearch.mdx deleted file mode 100644 index d7e830d54b17b..0000000000000 --- a/packages/website/docs/_components_pages/fiori/ShellBar/ShellBarSearch.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../ShellBarSearch ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/fiori/ShellBar/ShellBarSpacer.mdx b/packages/website/docs/_components_pages/fiori/ShellBar/ShellBarSpacer.mdx deleted file mode 100644 index 355a5f9cc80b4..0000000000000 --- a/packages/website/docs/_components_pages/fiori/ShellBar/ShellBarSpacer.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../ShellBarSpacer ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/fiori/SideNavigation/SideNavigation.mdx b/packages/website/docs/_components_pages/fiori/SideNavigation/SideNavigation.mdx deleted file mode 100644 index 17ff70da37e17..0000000000000 --- a/packages/website/docs/_components_pages/fiori/SideNavigation/SideNavigation.mdx +++ /dev/null @@ -1,44 +0,0 @@ -import Basic from "../../../_samples/fiori/SideNavigation/Basic/Basic.md"; -import QuickAction from "../../../_samples/fiori/SideNavigation/QuickAction/QuickAction.md"; -import UnselectableParentItems from "../../../_samples/fiori/SideNavigation/UnselectableParentItems/UnselectableParentItems.md"; -import OverlayMode from "../../../_samples/fiori/SideNavigation/OverlayMode/OverlayMode.md"; -import CustomWidth from "../../../_samples/fiori/SideNavigation/CustomWidth/CustomWidth.md"; -import Tags from "../../../_samples/fiori/SideNavigation/Tags/Tags.md"; - -<%COMPONENT_OVERVIEW%> - -## Basic Sample - - -<%COMPONENT_METADATA%> - -## More Samples - -### Unselectable Parent Items -When a parent item is selected, it will expand or collapse the list of child items, instead of the parent being selected itself. - - - -### Quick Action -Quick action items allow for providing access to frequent functionality. - - - -### Overlay Mode -SideNavigation is enabled to be used inside a responsive popover. This example shows how to achieve overlay mode with correct design and interaction. - - - -### Defining Custom Width -The width of the side navigation panel can be customized using CSS. The panel must be at least 16 rem wide to maintain readability and layout stability. You can set a larger width as needed, but it cannot be reduced below 16 rem. If the panel does not have sufficient space, long texts will wrap automatically. - - - -### Indication Tags -Navigation items can display indication tags to highlight status or phases such as "New", "Beta", or "Deprecated". Tags use the `tag` slot and should follow these guidelines: -- Use `ui5-tag` with `design="Set2"`, `hide-state-icon`, and `colorScheme` values 5-10 (avoiding semantic colors 1-4 which may be confused with error/success/warning states) -- It is recommended to limit tag width to 64px (4rem). If tag text exceeds this, use shortened forms or abbreviations (e.g., "Experimental" → "Exp") -- Tags are non-interactive - they serve purely as visual indicators and do not trigger any action or tooltip -- Only one tag is allowed per navigation item - - diff --git a/packages/website/docs/_components_pages/fiori/SideNavigation/SideNavigationGroup.mdx b/packages/website/docs/_components_pages/fiori/SideNavigation/SideNavigationGroup.mdx deleted file mode 100644 index 4ac0b97952388..0000000000000 --- a/packages/website/docs/_components_pages/fiori/SideNavigation/SideNavigationGroup.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../SideNavigationGroup ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/fiori/SideNavigation/SideNavigationItem.mdx b/packages/website/docs/_components_pages/fiori/SideNavigation/SideNavigationItem.mdx deleted file mode 100644 index 62fbe074f69a7..0000000000000 --- a/packages/website/docs/_components_pages/fiori/SideNavigation/SideNavigationItem.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../SideNavigationItem ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/fiori/SideNavigation/SideNavigationSubItem.mdx b/packages/website/docs/_components_pages/fiori/SideNavigation/SideNavigationSubItem.mdx deleted file mode 100644 index d8e6d4a7322be..0000000000000 --- a/packages/website/docs/_components_pages/fiori/SideNavigation/SideNavigationSubItem.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../SideNavigationSubItem ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/fiori/Timeline/Timeline.mdx b/packages/website/docs/_components_pages/fiori/Timeline/Timeline.mdx deleted file mode 100644 index 723702f7a6db0..0000000000000 --- a/packages/website/docs/_components_pages/fiori/Timeline/Timeline.mdx +++ /dev/null @@ -1,61 +0,0 @@ -import Basic from "../../../_samples/fiori/Timeline/Basic/Basic.md"; -import Horizontal from "../../../_samples/fiori/Timeline/Horizontal/Horizontal.md"; -import InCard from "../../../_samples/fiori/Timeline/InCard/InCard.md"; -import WithGroups from "../../../_samples/fiori/Timeline/WithGroups/WithGroups.md"; -import WithState from "../../../_samples/fiori/Timeline/WithState/WithState.md"; -import WithGrowing from "../../../_samples/fiori/Timeline/WithGrowing/WithGrowing.md"; -import WithHeader from "../../../_samples/fiori/Timeline/WithHeader/WithHeader.md"; -import WithFilter from "../../../_samples/fiori/Timeline/WithFilter/WithFilter.md"; -import StickyInPage from "../../../_samples/fiori/Timeline/StickyInPage/StickyInPage.md"; - -<%COMPONENT_OVERVIEW%> - -## Basic Sample - - -<%COMPONENT_METADATA%> - -## More Samples - -### Horizontal layout - - -### Timeline with State - - - -### Timeline in Card - - - -### Timeline with Groups - - - -### Timeline with Growing - - - -### Timeline with Header and Info Bar - -The `header` and `infoBar` slots let applications place their own controls and status indicators above the Timeline items. - -- **`header`** — controls (search, sort, filter). Use a `ui5-toolbar`. -- **`infoBar`** — status display (active filters, item count). Use a `ui5-bar` with `design="Subheader"`. -- Use `stickyHeader` to pin both bars while scrolling. - -The Timeline does not filter, sort, or search — the application owns that logic and updates items accordingly. - -#### Minimal — search and live count - - - -#### Full pipeline — search, sort and filter - - - -#### Sticky in a scrollable Timeline - -When the Timeline owns its scrollbar (give it a constrained height), `stickyHeader` keeps the `header` and `infoBar` slots pinned to the top while the items scroll. - - diff --git a/packages/website/docs/_components_pages/fiori/Timeline/TimelineGroupItem.mdx b/packages/website/docs/_components_pages/fiori/Timeline/TimelineGroupItem.mdx deleted file mode 100644 index 2a5429ae4c61c..0000000000000 --- a/packages/website/docs/_components_pages/fiori/Timeline/TimelineGroupItem.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../TimelineGroupItem ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/fiori/Timeline/TimelineItem.mdx b/packages/website/docs/_components_pages/fiori/Timeline/TimelineItem.mdx deleted file mode 100644 index f267c9be3be8e..0000000000000 --- a/packages/website/docs/_components_pages/fiori/Timeline/TimelineItem.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../TimelineItem ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/fiori/UploadCollection/UploadCollection.mdx b/packages/website/docs/_components_pages/fiori/UploadCollection/UploadCollection.mdx deleted file mode 100644 index 6d25d6e6dee9e..0000000000000 --- a/packages/website/docs/_components_pages/fiori/UploadCollection/UploadCollection.mdx +++ /dev/null @@ -1,22 +0,0 @@ -import Basic from "../../../_samples/fiori/UploadCollection/Basic/Basic.md"; -import RenamingFiles from "../../../_samples/fiori/UploadCollection/RenamingFiles/RenamingFiles.md"; -import VariousUploadStates from "../../../_samples/fiori/UploadCollection/VariousUploadStates/VariousUploadStates.md"; -import DragAndDrop from "../../../_samples/fiori/UploadCollection/DragAndDrop/DragAndDrop.md"; - -<%COMPONENT_OVERVIEW%> - -## Basic Sample - - -<%COMPONENT_METADATA%> - -## More Samples - -### Renaming Files - - -### Upload States - - -### Drag and Drop - \ No newline at end of file diff --git a/packages/website/docs/_components_pages/fiori/UploadCollection/UploadCollectionItem.mdx b/packages/website/docs/_components_pages/fiori/UploadCollection/UploadCollectionItem.mdx deleted file mode 100644 index ac7007b8589fc..0000000000000 --- a/packages/website/docs/_components_pages/fiori/UploadCollection/UploadCollectionItem.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../UploadCollectionItem ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/fiori/UserMenu/UserMenu.mdx b/packages/website/docs/_components_pages/fiori/UserMenu/UserMenu.mdx deleted file mode 100644 index 701b4377ceff7..0000000000000 --- a/packages/website/docs/_components_pages/fiori/UserMenu/UserMenu.mdx +++ /dev/null @@ -1,17 +0,0 @@ ---- -slug: ../UserMenu ---- - -import Basic from "../../../_samples/fiori/UserMenu/Basic/Basic.md"; - -import Advanced from "../../../_samples/fiori/UserMenu/Advanced/Advanced.md"; - -<%COMPONENT_OVERVIEW%> - -## Basic Sample - - -<%COMPONENT_METADATA%> - -## More Samples - diff --git a/packages/website/docs/_components_pages/fiori/UserMenu/UserMenuAccount.mdx b/packages/website/docs/_components_pages/fiori/UserMenu/UserMenuAccount.mdx deleted file mode 100644 index f5d9ef579d488..0000000000000 --- a/packages/website/docs/_components_pages/fiori/UserMenu/UserMenuAccount.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../UserMenuAccount ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/fiori/UserMenu/UserMenuItem.mdx b/packages/website/docs/_components_pages/fiori/UserMenu/UserMenuItem.mdx deleted file mode 100644 index 37c389bd1e141..0000000000000 --- a/packages/website/docs/_components_pages/fiori/UserMenu/UserMenuItem.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../UserMenuItem ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/fiori/UserMenu/UserMenuItemGroup.mdx b/packages/website/docs/_components_pages/fiori/UserMenu/UserMenuItemGroup.mdx deleted file mode 100644 index 3c44d435284c0..0000000000000 --- a/packages/website/docs/_components_pages/fiori/UserMenu/UserMenuItemGroup.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../UserMenuItemGroup ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/fiori/UserSettingsDialog/UserSettingsAccountView.mdx b/packages/website/docs/_components_pages/fiori/UserSettingsDialog/UserSettingsAccountView.mdx deleted file mode 100644 index 61a7f9253b564..0000000000000 --- a/packages/website/docs/_components_pages/fiori/UserSettingsDialog/UserSettingsAccountView.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../UserSettingsAccountView ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/fiori/UserSettingsDialog/UserSettingsAppearanceView.mdx b/packages/website/docs/_components_pages/fiori/UserSettingsDialog/UserSettingsAppearanceView.mdx deleted file mode 100644 index 3c7a2ee3e0d17..0000000000000 --- a/packages/website/docs/_components_pages/fiori/UserSettingsDialog/UserSettingsAppearanceView.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../UserSettingsAppearanceView ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/fiori/UserSettingsDialog/UserSettingsAppearanceViewGroup.mdx b/packages/website/docs/_components_pages/fiori/UserSettingsDialog/UserSettingsAppearanceViewGroup.mdx deleted file mode 100644 index eb627d0293511..0000000000000 --- a/packages/website/docs/_components_pages/fiori/UserSettingsDialog/UserSettingsAppearanceViewGroup.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../UserSettingsAppearanceViewGroup ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/fiori/UserSettingsDialog/UserSettingsAppearanceViewItem.mdx b/packages/website/docs/_components_pages/fiori/UserSettingsDialog/UserSettingsAppearanceViewItem.mdx deleted file mode 100644 index 9cd6c67494341..0000000000000 --- a/packages/website/docs/_components_pages/fiori/UserSettingsDialog/UserSettingsAppearanceViewItem.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../UserSettingsAppearanceViewItem ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/fiori/UserSettingsDialog/UserSettingsDialog.mdx b/packages/website/docs/_components_pages/fiori/UserSettingsDialog/UserSettingsDialog.mdx deleted file mode 100644 index cbcc66d9b502d..0000000000000 --- a/packages/website/docs/_components_pages/fiori/UserSettingsDialog/UserSettingsDialog.mdx +++ /dev/null @@ -1,22 +0,0 @@ ---- -slug: ../UserSettingsDialog ---- - -import Basic from "../../../_samples/fiori/UserSettingsDialog/Basic/Basic.md"; -import SaveMode from "../../../_samples/fiori/UserSettingsDialog/SaveMode/SaveMode.md"; - -<%COMPONENT_OVERVIEW%> - -## Basic Sample - - -<%COMPONENT_METADATA%> - -## More Samples - -### Save Mode -By default the dialog shows a single Close button in its footer and follows an implicit-save flow — changes are applied as the user interacts with each view. - -Setting the saveMode property replaces the footer with Save (Emphasized) and Cancel buttons. Clicks fire the corresponding save and cancel events; the dialog does not close itself, so the application is responsible for persisting or discarding the changes and closing the dialog afterwards (typically after a successful backend call). - - diff --git a/packages/website/docs/_components_pages/fiori/UserSettingsDialog/UserSettingsItem.mdx b/packages/website/docs/_components_pages/fiori/UserSettingsDialog/UserSettingsItem.mdx deleted file mode 100644 index fc1efa70c340b..0000000000000 --- a/packages/website/docs/_components_pages/fiori/UserSettingsDialog/UserSettingsItem.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../UserSettingsItem ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/fiori/UserSettingsDialog/UserSettingsView.mdx b/packages/website/docs/_components_pages/fiori/UserSettingsDialog/UserSettingsView.mdx deleted file mode 100644 index a6f9d94388113..0000000000000 --- a/packages/website/docs/_components_pages/fiori/UserSettingsDialog/UserSettingsView.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../UserSettingsView ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/fiori/ViewSettingsDialog/FilterItem.mdx b/packages/website/docs/_components_pages/fiori/ViewSettingsDialog/FilterItem.mdx deleted file mode 100644 index c2a7fbe7892e6..0000000000000 --- a/packages/website/docs/_components_pages/fiori/ViewSettingsDialog/FilterItem.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../FilterItem ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/fiori/ViewSettingsDialog/FilterItemOption.mdx b/packages/website/docs/_components_pages/fiori/ViewSettingsDialog/FilterItemOption.mdx deleted file mode 100644 index 8b6e2ca04fdb2..0000000000000 --- a/packages/website/docs/_components_pages/fiori/ViewSettingsDialog/FilterItemOption.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../FilterItemOption ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/fiori/ViewSettingsDialog/GroupItem.mdx b/packages/website/docs/_components_pages/fiori/ViewSettingsDialog/GroupItem.mdx deleted file mode 100644 index bb3524ff1897d..0000000000000 --- a/packages/website/docs/_components_pages/fiori/ViewSettingsDialog/GroupItem.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../GroupItem ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/fiori/ViewSettingsDialog/SortItem.mdx b/packages/website/docs/_components_pages/fiori/ViewSettingsDialog/SortItem.mdx deleted file mode 100644 index c794a36421a6d..0000000000000 --- a/packages/website/docs/_components_pages/fiori/ViewSettingsDialog/SortItem.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../SortItem ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/fiori/ViewSettingsDialog/ViewSettingsDialog.mdx b/packages/website/docs/_components_pages/fiori/ViewSettingsDialog/ViewSettingsDialog.mdx deleted file mode 100644 index 94186d81e4883..0000000000000 --- a/packages/website/docs/_components_pages/fiori/ViewSettingsDialog/ViewSettingsDialog.mdx +++ /dev/null @@ -1,15 +0,0 @@ -import Basic from "../../../_samples/fiori/ViewSettingsDialog/Basic/Basic.md"; -import CustomTabs from "../../../_samples/fiori/ViewSettingsDialog/CustomTabs/CustomTabs.md"; - -<%COMPONENT_OVERVIEW%> - -## Basic Sample - - -## Custom Tabs - -The ViewSettingsDialog supports custom tabs alongside the built-in Sort, Filter, and Group tabs. Use the `ui5-view-settings-dialog-custom-tab` component in the `customTabs` slot to add application-specific settings with any content. - - - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/fiori/ViewSettingsDialog/ViewSettingsDialogCustomTab.mdx b/packages/website/docs/_components_pages/fiori/ViewSettingsDialog/ViewSettingsDialogCustomTab.mdx deleted file mode 100644 index d37e1b3901b3a..0000000000000 --- a/packages/website/docs/_components_pages/fiori/ViewSettingsDialog/ViewSettingsDialogCustomTab.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../ViewSettingsDialogCustomTab ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> diff --git a/packages/website/docs/_components_pages/fiori/Wizard/Wizard.mdx b/packages/website/docs/_components_pages/fiori/Wizard/Wizard.mdx deleted file mode 100644 index 18a0c1accfe03..0000000000000 --- a/packages/website/docs/_components_pages/fiori/Wizard/Wizard.mdx +++ /dev/null @@ -1,20 +0,0 @@ -import Basic from "../../../_samples/fiori/Wizard/Basic/Basic.md"; -import PageMode from "../../../_samples/fiori/Wizard/PageMode/PageMode.md"; - -<%COMPONENT_OVERVIEW%> - -## Basic Sample -By default the navigation to another step happens with scrolling or pressing the given step in the Wizard header. -How to use the sample: to explore the steps click the "Step2' button, then enable the "5 years guarantee included -" switch to disover the "Step3" button to reach the final step. - - - -<%COMPONENT_METADATA%> - -## More Samples - -### Page Mode -Instead of scrolling each step is shown as a separate page. - - \ No newline at end of file diff --git a/packages/website/docs/_components_pages/fiori/Wizard/WizardStep.mdx b/packages/website/docs/_components_pages/fiori/Wizard/WizardStep.mdx deleted file mode 100644 index 738d503756d20..0000000000000 --- a/packages/website/docs/_components_pages/fiori/Wizard/WizardStep.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../WizardStep ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/main/Avatar/Avatar.mdx b/packages/website/docs/_components_pages/main/Avatar/Avatar.mdx deleted file mode 100644 index 97397a153e6a1..0000000000000 --- a/packages/website/docs/_components_pages/main/Avatar/Avatar.mdx +++ /dev/null @@ -1,80 +0,0 @@ ---- -slug: ../Avatar ---- - -import Basic from "../../../_samples/main/Avatar/Basic/Basic.md"; -import Interactive from "../../../_samples/main/Avatar/Interactive/Interactive.md"; -import Decorative from "../../../_samples/main/Avatar/Decorative/Decorative.md"; -import Variants from "../../../_samples/main/Avatar/Variants/Variants.md"; -import WithBadge from "../../../_samples/main/Avatar/WithBadge/WithBadge.md"; -import ColorSchemes from "../../../_samples/main/Avatar/ColorSchemes/ColorSchemes.md"; -import Sizes from "../../../_samples/main/Avatar/Sizes/Sizes.md"; -import Shapes from "../../../_samples/main/Avatar/Shapes/Shapes.md"; -import WithImage from "../../../_samples/main/Avatar/WithImage/WithImage.md"; -import WithIcon from "../../../_samples/main/Avatar/WithIcon/WithIcon.md"; -import Styles from "../../../_samples/main/Avatar/Styles/Styles.md"; - -<%COMPONENT_OVERVIEW%> - -## Basic Sample - - -<%COMPONENT_METADATA%> - -## More Samples - -### Shapes -The Avatar comes in two shapes (Square and Circle). - - - -### Sizes -The Avatar comes in several sizes (S to XL). - - - -### Interactive Mode -The Avatar can be made interactive in two ways: -- `mode="Interactive"` - Sets the avatar to interactive mode with role="button", making it focusable and enabling keyboard interaction -- `interactive` property - A boolean property that also makes the avatar interactive - -**Note:** The `interactive` property takes precedence over the `mode` property. When `interactive=true`, the `mode` property value is ignored, and the avatar behaves as interactive. - - - -### Decorative Mode -The Avatar can be set to decorative mode with `mode="Decorative"`, making it purely visual without semantic content (role="presentation", aria-hidden="true"). This is useful when the avatar is used for visual purposes only and shouldn't be announced by screen readers. - - - -### Color Schemes -The Avatar can be displayed in multiple color schemes. - - - -### With Icon -The Avatar can show icons. - - - -### With Image -The Avatar can show images. - - - -### With Badge -The Avatar supports visual affordance through badges using the `ui5-avatar-badge` component. Badges can display icons with different value states to indicate status or notifications. **It is recommended to use badges with interactive avatars** for better user experience and accessibility. - -`ui5-avatar-badge` displays an icon tooltip by default, based on the icon semantic text. To provide a custom tooltip text, set the badge `tooltip` property. - - - -### All Variants -A comprehensive overview of all Avatar variants with their recommended use cases and accessibility annotations: - - - -### Custom Styling -The Avatar allows customization with pure CSS on tag level. - - \ No newline at end of file diff --git a/packages/website/docs/_components_pages/main/Avatar/AvatarBadge.mdx b/packages/website/docs/_components_pages/main/Avatar/AvatarBadge.mdx deleted file mode 100644 index f86f5918928ea..0000000000000 --- a/packages/website/docs/_components_pages/main/Avatar/AvatarBadge.mdx +++ /dev/null @@ -1,20 +0,0 @@ ---- -slug: ../../AvatarBadge ---- - -import Basic from "../../../_samples/main/AvatarBadge/Basic/Basic.md"; -import ValueStates from "../../../_samples/main/AvatarBadge/ValueStates/ValueStates.md"; - -<%COMPONENT_OVERVIEW%> - -## Basic Sample - - -<%COMPONENT_METADATA%> - -## More Samples - -### States -The AvatarBadge supports different states to indicate status or notifications. - - diff --git a/packages/website/docs/_components_pages/main/AvatarGroup.mdx b/packages/website/docs/_components_pages/main/AvatarGroup.mdx deleted file mode 100644 index 2c0dcbf951a20..0000000000000 --- a/packages/website/docs/_components_pages/main/AvatarGroup.mdx +++ /dev/null @@ -1,26 +0,0 @@ ---- -slug: ../AvatarGroup ---- - -import Basic from "../../_samples/main/AvatarGroup/Basic/Basic.md"; -import TypesAndSizes from "../../_samples/main/AvatarGroup/TypesAndSizes/TypesAndSizes.md"; -import IndividualWithPopover from "../../_samples/main/AvatarGroup/IndividualWithPopover/IndividualWithPopover.md"; -import GroupWithPopover from "../../_samples/main/AvatarGroup/GroupWithPopover/GroupWithPopover.md"; - -<%COMPONENT_OVERVIEW%> - -## Basic Sample - - -<%COMPONENT_METADATA%> - -## More Samples - -### Types And Sizes - - -### Individual - - -### Grouping - \ No newline at end of file diff --git a/packages/website/docs/_components_pages/main/Bar.mdx b/packages/website/docs/_components_pages/main/Bar.mdx deleted file mode 100644 index eb7530fb8a2ca..0000000000000 --- a/packages/website/docs/_components_pages/main/Bar.mdx +++ /dev/null @@ -1,12 +0,0 @@ -import Basic from "../../_samples/main/Bar/Basic/Basic.md"; -import AccessibleRole from "../../_samples/main/Bar/AccessibleRole/AccessibleRole.md"; - -<%COMPONENT_OVERVIEW%> - -## Basic Sample - - -<%COMPONENT_METADATA%> - -## Bar with accessible role - \ No newline at end of file diff --git a/packages/website/docs/_components_pages/main/Breadcrumbs/Breadcrumbs.mdx b/packages/website/docs/_components_pages/main/Breadcrumbs/Breadcrumbs.mdx deleted file mode 100644 index bfcf44b417e5d..0000000000000 --- a/packages/website/docs/_components_pages/main/Breadcrumbs/Breadcrumbs.mdx +++ /dev/null @@ -1,40 +0,0 @@ ---- -slug: ../../Breadcrumbs ---- - -import Basic from "../../../_samples/main/Breadcrumbs/Basic/Basic.md"; -import BreadcrumbsStyles from "../../../_samples/main/Breadcrumbs/BreadcrumbsStyles/BreadcrumbsStyles.md"; -import BreadcrumbsOverflow from "../../../_samples/main/Breadcrumbs/BreadcrumbsOverflow/BreadcrumbsOverflow.md"; -import NoCurrentPage from "../../../_samples/main/Breadcrumbs/NoCurrentPage/NoCurrentPage.md"; -import ClickEvent from "../../../_samples/main/Breadcrumbs/ClickEvent/ClickEvent.md"; - - -<%COMPONENT_OVERVIEW%> - -## Basic Sample - - -<%COMPONENT_METADATA%> - -## More Samples - -### Overflow -When the links don't fit the available space, they overflow. - - - - -### Separator Styles -Separator between the links can be easily changed. - - - -### Current Page Appearance -The Breadcrumbs supports two visual appearances for the last BreadcrumbsItem - as "current page" (bold and without separator) and as a regular link, followed by separator. - - - -### Item Click Event -Each `ui5-breadcrumbs-item` fires its own `click` event, allowing framework consumers to attach handlers directly on the item. - - \ No newline at end of file diff --git a/packages/website/docs/_components_pages/main/Breadcrumbs/BreadcrumbsItem.mdx b/packages/website/docs/_components_pages/main/Breadcrumbs/BreadcrumbsItem.mdx deleted file mode 100644 index 54e46710019e9..0000000000000 --- a/packages/website/docs/_components_pages/main/Breadcrumbs/BreadcrumbsItem.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../../BreadcrumbsItem ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/main/BusyIndicator.mdx b/packages/website/docs/_components_pages/main/BusyIndicator.mdx deleted file mode 100644 index 2ac8d92c7a7b5..0000000000000 --- a/packages/website/docs/_components_pages/main/BusyIndicator.mdx +++ /dev/null @@ -1,33 +0,0 @@ ---- -slug: ../BusyIndicator ---- - -import Basic from "../../_samples/main/BusyIndicator/Basic/Basic.md"; -import WithComponent from "../../_samples/main/BusyIndicator/WithComponent/WithComponent.md"; -import Sizes from "../../_samples/main/BusyIndicator/Sizes/Sizes.md"; -import TextPlacement from "../../_samples/main/BusyIndicator/TextPlacement/TextPlacement.md"; - - -<%COMPONENT_OVERVIEW%> - -## Basic Sample - - -<%COMPONENT_METADATA%> - -## More Samples - -### Sizes -The BusyIndicator comes in several sizes - S, M and L. - - - -### Text Placement with display text -The BusyIndicator can display text either above (via text-placement="Top") or below the animated dots (by default). - - - -### Busy component -The BusyIndicator can be placed over another web component. - - \ No newline at end of file diff --git a/packages/website/docs/_components_pages/main/Button/Button.mdx b/packages/website/docs/_components_pages/main/Button/Button.mdx deleted file mode 100644 index a98e89f21c47e..0000000000000 --- a/packages/website/docs/_components_pages/main/Button/Button.mdx +++ /dev/null @@ -1,56 +0,0 @@ ---- -slug: ../Button ---- - -import Basic from "../../../_samples/main/Button/Basic/Basic.md"; -import Design from "../../../_samples/main/Button/Design/Design.md"; -import IconOnly from "../../../_samples/main/Button/IconOnly/IconOnly.md"; -import TextAndIcon from "../../../_samples/main/Button/TextAndIcon/TextAndIcon.md"; -import EndIcon from "../../../_samples/main/Button/EndIcon/EndIcon.md"; -import CustomStyling from "../../../_samples/main/Button/CustomStyling/CustomStyling.md"; -import MenuButton from "../../../_samples/main/Button/MenuButton/MenuButton.md"; -import ButtonBadge from "../../../_samples/main/Button/ButtonBadge/ButtonBadge.md"; -import Loading from "../../../_samples/main/Button/Loading/Loading.md" - -<%COMPONENT_OVERVIEW%> - -## Basic Sample - - -<%COMPONENT_METADATA%> - -## More Samples - -### Design -The Button supports several designs to indicate the priority or the nature of the action. - - - -### Icon Only - - -### Text and Icon - - -### Icon at the End -Button allows adding of second Icon at the end. - - - -### Custom Styling -To some extent, the Button allows customization with pure CSS as shown in the sample. - - - -### Menu Button -Achieve Menu Button functionality. - - - -### Button with badge -Add a badge to the button. - - - -### Button with Loading - \ No newline at end of file diff --git a/packages/website/docs/_components_pages/main/Button/ButtonBadge.mdx b/packages/website/docs/_components_pages/main/Button/ButtonBadge.mdx deleted file mode 100644 index 50a6ddcae6d47..0000000000000 --- a/packages/website/docs/_components_pages/main/Button/ButtonBadge.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../../ButtonBadge ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/main/Calendar/Calendar.mdx b/packages/website/docs/_components_pages/main/Calendar/Calendar.mdx deleted file mode 100644 index c91016c683955..0000000000000 --- a/packages/website/docs/_components_pages/main/Calendar/Calendar.mdx +++ /dev/null @@ -1,58 +0,0 @@ ---- -slug: ../../Calendar ---- - -import Basic from "../../../_samples/main/Calendar/Basic/Basic.md"; -import Bounds from "../../../_samples/main/Calendar/Bounds/Bounds.md"; -import CalendarTypes from "../../../_samples/main/Calendar/CalendarTypes/CalendarTypes.md"; -import CalendarWithLegend from "../../../_samples/main/Calendar/CalendarWithLegend/CalendarWithLegend.md" -import SelectionModes from "../../../_samples/main/Calendar/SelectionModes/SelectionModes.md"; -import CalendarInDifferentTimezone from "../../../_samples/main/Calendar/CalendarInDifferentTimezone/CalendarInDifferentTimezone.md"; -import CalendarWeekNumbering from "../../../_samples/main/Calendar/CalendarWeekNumbering/CalendarWeekNumbering.md"; -import CalendarWithDisabledDates from "../../../_samples/main/Calendar/CalendarWithDisabledDates/CalendarWithDisabledDates.md"; -import useBaseUrl from "@docusaurus/useBaseUrl"; -import Link from '@docusaurus/Link'; - -<%COMPONENT_OVERVIEW%> - -## Basic Sample - - -<%COMPONENT_METADATA%> - -## More Samples - -### Selection Modes -The Calendar supports Single, Multiple and Range selection. - - - - -### Min and Max Dates -Define min and max date boundaries to contrain user choice. - - - -### Calendar Types -Several calendars are supported: Gregorian, Islamic, Persian and Japanese. - - - -### Calendar with Legend -You can use the [CalendarLegend](../CalendarLegend/CalendarLegend.mdx) component in addition to the Calendar to highlight specific days. -Discover all the available CalendarLegendItem Types. - - - - -### Timezones -You can set to the configuration the preferred time zone, such as: Asia/Tokyo, Pacific/Apia, Asia/Kolkata, Europe/Sofia and etc. - - -### CalendarWeekNumbering -You can use the component, the preferred week numbering and first day of week. - - -### Calendar with Disabled Dates -Define disabled dates - \ No newline at end of file diff --git a/packages/website/docs/_components_pages/main/Calendar/CalendarDate.mdx b/packages/website/docs/_components_pages/main/Calendar/CalendarDate.mdx deleted file mode 100644 index 7bd3fb09e5661..0000000000000 --- a/packages/website/docs/_components_pages/main/Calendar/CalendarDate.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../../CalendarDate ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/main/Calendar/CalendarDateRange.mdx b/packages/website/docs/_components_pages/main/Calendar/CalendarDateRange.mdx deleted file mode 100644 index 49b3f398681e0..0000000000000 --- a/packages/website/docs/_components_pages/main/Calendar/CalendarDateRange.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../../CalendarDateRange ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/main/Calendar/SpecialCalendarDate.mdx b/packages/website/docs/_components_pages/main/Calendar/SpecialCalendarDate.mdx deleted file mode 100644 index f17d7b8cb24e7..0000000000000 --- a/packages/website/docs/_components_pages/main/Calendar/SpecialCalendarDate.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../../SpecialCalendarDate ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/main/CalendarLegend/CalendarLegend.mdx b/packages/website/docs/_components_pages/main/CalendarLegend/CalendarLegend.mdx deleted file mode 100644 index fe2189b0398a0..0000000000000 --- a/packages/website/docs/_components_pages/main/CalendarLegend/CalendarLegend.mdx +++ /dev/null @@ -1,25 +0,0 @@ ---- -slug: ../../CalendarLegend ---- - -import Basic from "../../../_samples/main/CalendarLegend/Basic/Basic.md"; -import ItemTypes from "../../../_samples/main/CalendarLegend/ItemTypes/ItemTypes.md"; -import HideToday from "../../../_samples/main/CalendarLegend/HideToday/HideToday.md"; - -<%COMPONENT_OVERVIEW%> - -## Basic Sample - - -<%COMPONENT_METADATA%> - -## More Samples - -### CalendarLegendItem Types - - -### Hide CalendarLegendItems -By default, the CalendarLegend shows Today, SelectedDay, WorkingDay and NonWorkingDay items. -However, you can hide them as shown in the sample. - - \ No newline at end of file diff --git a/packages/website/docs/_components_pages/main/CalendarLegend/CalendarLegendItem.mdx b/packages/website/docs/_components_pages/main/CalendarLegend/CalendarLegendItem.mdx deleted file mode 100644 index 2a1c38888e2fa..0000000000000 --- a/packages/website/docs/_components_pages/main/CalendarLegend/CalendarLegendItem.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../../CalendarLegendItem ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/main/Card/Card.mdx b/packages/website/docs/_components_pages/main/Card/Card.mdx deleted file mode 100644 index f6b8e7a0194a8..0000000000000 --- a/packages/website/docs/_components_pages/main/Card/Card.mdx +++ /dev/null @@ -1,30 +0,0 @@ ---- -slug: ../../Card ---- - -import Basic from "../../../_samples/main/Card/Basic/Basic.md"; -import WithList from "../../../_samples/main/Card/WithList/WithList.md"; -import WithTable from "../../../_samples/main/Card/WithTable/WithTable.md"; -import WithTimeline from "../../../_samples/main/Card/WithTimeline/WithTimeline.md"; -import MoreCards from "../../../_samples/main/Card/MoreCards/MoreCards.md"; - -<%COMPONENT_OVERVIEW%> - -## Basic Sample - - -<%COMPONENT_METADATA%> - -## More Samples - -### List Card - - -### Table Card - - -### Timeline Card - - -### Object Card - \ No newline at end of file diff --git a/packages/website/docs/_components_pages/main/Card/CardHeader.mdx b/packages/website/docs/_components_pages/main/Card/CardHeader.mdx deleted file mode 100644 index 8ac3e82aa86f6..0000000000000 --- a/packages/website/docs/_components_pages/main/Card/CardHeader.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../../CardHeader ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/main/Carousel.mdx b/packages/website/docs/_components_pages/main/Carousel.mdx deleted file mode 100644 index 2420ecb0203de..0000000000000 --- a/packages/website/docs/_components_pages/main/Carousel.mdx +++ /dev/null @@ -1,54 +0,0 @@ ---- -slug: ../Carousel ---- - -<%COMPONENT_OVERVIEW%> - -import Basic from "../../_samples/main/Carousel/Basic/Basic.md"; -import Cyclic from "../../_samples/main/Carousel/Cyclic/Cyclic.md"; -import ArrowsPlacement from "../../_samples/main/Carousel/ArrowsPlacement/ArrowsPlacement.md"; -import AccessibleName from "../../_samples/main/Carousel/AccessibleName/AccessibleName.md"; -import CardsWithHidden from "../../_samples/main/Carousel/CardsWithHidden/CardsWithHidden.md"; -import PageIndicatorType from "../../_samples/main/Carousel/PageIndicatorType/PageIndicatorType.md"; -import MultipleItemsPerPage from "../../_samples/main/Carousel/MultipleItemsPerPage/MultipleItemsPerPage.md"; - - - -<%COMPONENT_METADATA%> - -## More Samples - -### Cyclic -When the last page is reached, pressing "Forward" will navigate to the start. -When the first page is reached, pressing "Backward" will navigate to the last page. - - - -### Arrows Placement -When **arrowsPlacement** is set to **"Content"**, the arrows are placed on the sides of the current page. -When **arrowsPlacement** is set to **"Navigation"**, the arrows are placed on the sides of the page indicator. - - - -### Page Indicator -When **pageIndicatorType** is set to **"Default"**, the page indicator appear as dots. -When **pageIndicatorType** is set to **"Numeric"** - as numbers. - - - -### Multiple Items per Page - -The **items-per-page** property -define the number of items per page for given breakpoint ("S", "M", "L" and "XL"). - - - -### Accessible name -Use the **accessibleName** or the **accessibleNameRef** properties to label the Carousel and improve its accessibility. - - - -### Carousel with Hidden Items -This is a Carousel containing cards where some are hidden using the **hidden** attribute. Hidden items will not be included in the carousel navigation. - - diff --git a/packages/website/docs/_components_pages/main/CheckBox.mdx b/packages/website/docs/_components_pages/main/CheckBox.mdx deleted file mode 100644 index 173529533bd0a..0000000000000 --- a/packages/website/docs/_components_pages/main/CheckBox.mdx +++ /dev/null @@ -1,39 +0,0 @@ ---- -slug: ../CheckBox ---- - -import Basic from "../../_samples/main/CheckBox/Basic/Basic.md"; -import TextWrapping from "../../_samples/main/CheckBox/TextWrapping/TextWrapping.md"; -import States from "../../_samples/main/CheckBox/States/States.md"; -import Indeterminate from "../../_samples/main/CheckBox/Indeterminate/Indeterminate.md"; -import Group from "../../_samples/main/CheckBox/Group/Group.md"; - -<%COMPONENT_OVERVIEW%> - -## Basic Sample - - -<%COMPONENT_METADATA%> - -## More Samples - -### Indeterminate -The CheckBox can also display an indeterminate state. It's usefull to indicate that not all tasks/items are done/checked. - - - - -### States -CheckBox supports several semantic value states, readonly, disabled, etc. - - - -### Text Truncation and Wrapping -The CheckBox text wraps by default. To make it truncate - set wrapping-type="None". - - - -### Group of Checkboxes in a Form -Checkboxes can be logically grouped using the same name attribute to create a multi-selection form field. When the form is submitted, each checked item will send its individual value to the server, allowing backend processing to identify exactly which options the user selected. - - \ No newline at end of file diff --git a/packages/website/docs/_components_pages/main/ColorPalette/ColorPalette.mdx b/packages/website/docs/_components_pages/main/ColorPalette/ColorPalette.mdx deleted file mode 100644 index d9e214b73428e..0000000000000 --- a/packages/website/docs/_components_pages/main/ColorPalette/ColorPalette.mdx +++ /dev/null @@ -1,12 +0,0 @@ ---- -slug: ../../ColorPalette ---- - -import Basic from "../../../_samples/main/ColorPalette/Basic/Basic.md"; - -<%COMPONENT_OVERVIEW%> - -## Basic Sample - - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/main/ColorPalette/ColorPaletteItem.mdx b/packages/website/docs/_components_pages/main/ColorPalette/ColorPaletteItem.mdx deleted file mode 100644 index a291f07f4b043..0000000000000 --- a/packages/website/docs/_components_pages/main/ColorPalette/ColorPaletteItem.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../../ColorPaletteItem ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/main/ColorPalettePopover.mdx b/packages/website/docs/_components_pages/main/ColorPalettePopover.mdx deleted file mode 100644 index b33d14c8273b0..0000000000000 --- a/packages/website/docs/_components_pages/main/ColorPalettePopover.mdx +++ /dev/null @@ -1,25 +0,0 @@ ---- -slug: ../ColorPalettePopover ---- - -import Basic from "../../_samples/main/ColorPalettePopover/Basic/Basic.md"; -import DefaultColor from "../../_samples/main/ColorPalettePopover/DefaultColor/DefaultColor.md"; -import MoreColors from "../../_samples/main/ColorPalettePopover/MoreColors/MoreColors.md"; - -<%COMPONENT_OVERVIEW%> - -## Basic Sample - - -<%COMPONENT_METADATA%> - -## More Samples - -### Show Default Color - - -### Show More&Recent Colors -Recent colors shows the last five colors that have been selected. -More colors opens a dialog to manually choose a color from a ColorPicker. - - \ No newline at end of file diff --git a/packages/website/docs/_components_pages/main/ColorPicker.mdx b/packages/website/docs/_components_pages/main/ColorPicker.mdx deleted file mode 100644 index 075124d82e116..0000000000000 --- a/packages/website/docs/_components_pages/main/ColorPicker.mdx +++ /dev/null @@ -1,18 +0,0 @@ ---- -slug: ../ColorPicker ---- - -import Basic from "../../_samples/main/ColorPicker/Basic/Basic.md"; -import Simplified from "../../_samples/main/ColorPicker/Simplified/Simplified.md"; - -<%COMPONENT_OVERVIEW%> - -## Basic Sample - - -<%COMPONENT_METADATA%> - -## More Samples - -### Simplified Picker - \ No newline at end of file diff --git a/packages/website/docs/_components_pages/main/ComboBox/ComboBox.mdx b/packages/website/docs/_components_pages/main/ComboBox/ComboBox.mdx deleted file mode 100644 index 8fd3cfa5cd4fd..0000000000000 --- a/packages/website/docs/_components_pages/main/ComboBox/ComboBox.mdx +++ /dev/null @@ -1,66 +0,0 @@ ---- -slug: ../../ComboBox ---- - -import Basic from "../../../_samples/main/ComboBox/Basic/Basic.md"; -import ClearIcon from "../../../_samples/main/ComboBox/ClearIcon/ClearIcon.md"; -import Filters from "../../../_samples/main/ComboBox/Filters/Filters.md"; -import TwoColumnsLayout from "../../../_samples/main/ComboBox/TwoColumnsLayout/TwoColumnsLayout.md"; -import Grouping from "../../../_samples/main/ComboBox/Grouping/Grouping.md"; -import SuggestionsWrapping from "../../../_samples/main/ComboBox/SuggestionsWrapping/SuggestionsWrapping.md"; -import SelectedValue from "../../../_samples/main/ComboBox/SelectedValue/SelectedValue.md"; -import SameTextDifferentValues from "../../../_samples/main/ComboBox/SameTextDifferentValues/SameTextDifferentValues.md"; -import CustomItems from "../../../_samples/main/ComboBox/CustomItems/CustomItems.md"; - -<%COMPONENT_OVERVIEW%> - -## Basic Sample - - -<%COMPONENT_METADATA%> - -## More Samples - -### Clear Icon -The ComboBox can show a clear icon, visble when there is a value, typed by the user. -When pressed, the value gets cleared. - - - -### Filters -You can choose a Filter that the items will be matched against on user input (StartsWith, Contains, etc.) - - - -### Items with additional text -The ComboBox items can show additional text. - - - -### Items Grouping -Grouping of items can be implented via the ui5-cb-group-item web component. - - - -### Items Text Wrapping -The sample demonstrates how the text of the items wrap when too long. - - - -### Selected Value -Use the `value` property on items and `selected-value` on the ComboBox to decouple the display text from the underlying selection value. -This is useful for form submission, programmatic selection, and handling items with identical display text. - - - -### Items with Same Text but Different Values -When you have multiple items with identical display text (e.g., employees with the same name), use the `value` property to uniquely identify each item. -The `additional-text` property helps users distinguish between items visually. - - - -### Custom Items with Rich Content -Use `ui5-cb-item-custom` to create custom item templates with complex layouts, multiple icons, images, or any HTML content. -This allows you to build rich, visually appealing dropdown items beyond the standard text and `additional-text` format. - - \ No newline at end of file diff --git a/packages/website/docs/_components_pages/main/ComboBox/ComboBoxItem.mdx b/packages/website/docs/_components_pages/main/ComboBox/ComboBoxItem.mdx deleted file mode 100644 index e70a259dbcdd9..0000000000000 --- a/packages/website/docs/_components_pages/main/ComboBox/ComboBoxItem.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../../ComboBoxItem ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/main/ComboBox/ComboBoxItemCustom.mdx b/packages/website/docs/_components_pages/main/ComboBox/ComboBoxItemCustom.mdx deleted file mode 100644 index c5e477222e818..0000000000000 --- a/packages/website/docs/_components_pages/main/ComboBox/ComboBoxItemCustom.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../../ComboBoxItemCustom ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> diff --git a/packages/website/docs/_components_pages/main/ComboBox/ComboBoxItemGroup.mdx b/packages/website/docs/_components_pages/main/ComboBox/ComboBoxItemGroup.mdx deleted file mode 100644 index 2480e8db0b2cc..0000000000000 --- a/packages/website/docs/_components_pages/main/ComboBox/ComboBoxItemGroup.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../../ComboBoxItemGroup ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/main/DatePicker.mdx b/packages/website/docs/_components_pages/main/DatePicker.mdx deleted file mode 100644 index 1436ec6ab8fb6..0000000000000 --- a/packages/website/docs/_components_pages/main/DatePicker.mdx +++ /dev/null @@ -1,52 +0,0 @@ ---- -slug: ../DatePicker ---- - -import Basic from "../../_samples/main/DatePicker/Basic/Basic.md"; -import State from "../../_samples/main/DatePicker/State/State.md"; -import MinMax from "../../_samples/main/DatePicker/MinMax/MinMax.md"; -import CalendarTypes from "../../_samples/main/DatePicker/CalendarTypes/CalendarTypes.md"; -import CalendarWeekNumbering from "../../_samples/main/DatePicker/CalendarWeekNumbering/CalendarWeekNumbering.md"; -import DatePickerInDifferentTimezone from "../../_samples/main/DatePicker/DatePickerInDifferentTimezone/DatePickerInDifferentTimezone.md"; -import CustomFormatting from "../../_samples/main/DatePicker/CustomFormatting/CustomFormatting.md"; -import ClearIcon from "../../_samples/main/DatePicker/ClearIcon/ClearIcon.md"; - -<%COMPONENT_OVERVIEW%> - -## Basic Sample - - -<%COMPONENT_METADATA%> - -## More Samples - -### States - - -### Min and Max Dates -Define min and max date boundaries to contrain user choice. - - - -### Calendar Types -You can set the preferred calendar, such as: Gregorian, Islamic, Japanese and Persian. - - -### Timezones -You can set to the configuration the preferred time zone, such as: Asia/Tokyo, Pacific/Apia, Asia/Kolkata, Europe/Sofia and etc. - - -### CalendarWeekNumbering -You can use the component, the preferred week numbering and first day of week. - - -### CustomFormatting -You can have custom formatting for the display value and the value property. -Supported format options are pattern-based on Unicode LDML Date Format notation. -For more information, see UTS #35: Unicode Locale Data Markup Language. - - -### Clear Icon - -This sample demonstrates the component with the `show-clear-icon` property enabled, which displays a clear button to reset the selected date. - \ No newline at end of file diff --git a/packages/website/docs/_components_pages/main/DateRangePicker.mdx b/packages/website/docs/_components_pages/main/DateRangePicker.mdx deleted file mode 100644 index a15bcbb2131ce..0000000000000 --- a/packages/website/docs/_components_pages/main/DateRangePicker.mdx +++ /dev/null @@ -1,45 +0,0 @@ ---- -slug: ../DateRangePicker ---- - -import Basic from "../../_samples/main/DateRangePicker/Basic/Basic.md"; -import MinMax from "../../_samples/main/DateRangePicker/MinMax/MinMax.md"; -import DateFormat from "../../_samples/main/DateRangePicker/DateFormat/DateFormat.md"; -import CustomFormatting from "../../_samples/main/DateRangePicker/CustomFormatting/CustomFormatting.md"; -import ClearIcon from "../../_samples/main/DateRangePicker/ClearIcon/ClearIcon.md"; -import ShowTwoMonths from "../../_samples/main/DateRangePicker/ShowTwoMonths/ShowTwoMonths.md"; - -<%COMPONENT_OVERVIEW%> - -## Basic Sample - - -<%COMPONENT_METADATA%> - -## More Samples - -### Date Formats - - - -### Min and Max Dates -Define min and max date boundaries to contrain user choice. - - - -### CustomFormatting -You can have custom formatting for the display value and the value property. -Supported format options are pattern-based on Unicode LDML Date Format notation. -For more information, see UTS #35: Unicode Locale Data Markup Language. - - - -### Clear Icon - -This sample demonstrates the component with the `show-clear-icon` property enabled, which displays a clear button to reset the selected date. - - -### Show Two Months - -This sample demonstrates the component with the `show-two-months` property enabled, which displays two consecutive months, making it easier to select date ranges. - diff --git a/packages/website/docs/_components_pages/main/DateTimePicker.mdx b/packages/website/docs/_components_pages/main/DateTimePicker.mdx deleted file mode 100644 index 9cd3af1c2441b..0000000000000 --- a/packages/website/docs/_components_pages/main/DateTimePicker.mdx +++ /dev/null @@ -1,41 +0,0 @@ ---- -slug: ../DateTimePicker ---- - -import Basic from "../../_samples/main/DateTimePicker/Basic/Basic.md"; -import FormatPattern from "../../_samples/main/DateTimePicker/FormatPattern/FormatPattern.md"; -import MinMax from "../../_samples/main/DateTimePicker/MinMax/MinMax.md"; -import DateTimePickerInDifferentTimezone from "../../_samples/main/DateTimePicker/DateTimePickerInDifferentTimezone/DateTimePickerInDifferentTimezone.md"; -import CustomFormatting from "../../_samples/main/DateTimePicker/CustomFormatting/CustomFormatting.md"; -import ClearIcon from "../../_samples/main/DateTimePicker/ClearIcon/ClearIcon.md"; - -<%COMPONENT_OVERVIEW%> - -## Basic Sample - - -<%COMPONENT_METADATA%> - -## More Samples - -### Min and Max Dates -Define min and max date-time boundaries to contrain user choice. - - - -### Timezones -You can set to the configuration the preferred time zone, such as: Asia/Tokyo, Pacific/Apia, Asia/Kolkata, Europe/Sofia and etc. - - - -### CustomFormatting -You can have custom formatting for the display value and the value property. -Supported format options are pattern-based on Unicode LDML Date Format notation. -For more information, see UTS #35: Unicode Locale Data Markup Language. - - - -### Clear Icon - -This sample demonstrates the component with the `show-clear-icon` property enabled, which displays a clear button to reset the selected date. - \ No newline at end of file diff --git a/packages/website/docs/_components_pages/main/Dialog.mdx b/packages/website/docs/_components_pages/main/Dialog.mdx deleted file mode 100644 index 539c059b0c534..0000000000000 --- a/packages/website/docs/_components_pages/main/Dialog.mdx +++ /dev/null @@ -1,34 +0,0 @@ ---- -slug: ../Dialog ---- - -import Basic from "../../_samples/main/Dialog/Basic/Basic.md"; -import DraggableAndResizable from "../../_samples/main/Dialog/DraggableAndResizable/DraggableAndResizable.md"; -import Fullscreen from "../../_samples/main/Dialog/Fullscreen/Fullscreen.md"; -import BarInDialog from "../../_samples/main/Dialog/BarInDialog/BarInDialog.md"; -import WithState from "../../_samples/main/Dialog/WithState/WithState.md"; - -<%COMPONENT_OVERVIEW%> - -## Basic Sample - - -<%COMPONENT_METADATA%> - -## More Samples - -### Draggable and Resizable - - -### Fullscreen -Users can toggle between standard and full screen size. The full screen button is positioned top-right in the dialog's title bar. The fullscreen toggle can also be triggered by pressing Shift+Ctrl+F or by double-clicking the dialog header. - - -### Usage of Bar as header/footer -The Bar component can be used as header and/or footer of the Dialog - - -### States -The Dialog supports "Positive", "Critical", "Negative" and "None" states via the "state" property. - - \ No newline at end of file diff --git a/packages/website/docs/_components_pages/main/DynamicDateRange.mdx b/packages/website/docs/_components_pages/main/DynamicDateRange.mdx deleted file mode 100644 index 914d5e6752df8..0000000000000 --- a/packages/website/docs/_components_pages/main/DynamicDateRange.mdx +++ /dev/null @@ -1,14 +0,0 @@ -import Basic from "../../_samples/main/DynamicDateRange/Basic/Basic.md"; -import DynamicDateRangeValueSample from "../../_samples/main/DynamicDateRange/DynamicDateRangeValueSample/DynamicDateRangeValueSample.md"; - -<%COMPONENT_OVERVIEW%> - -## Basic Sample - - -<%COMPONENT_METADATA%> - -## More Samples - -### DynamicDateRangeValueSample - \ No newline at end of file diff --git a/packages/website/docs/_components_pages/main/ExpandableText.mdx b/packages/website/docs/_components_pages/main/ExpandableText.mdx deleted file mode 100644 index ba7c6065f9104..0000000000000 --- a/packages/website/docs/_components_pages/main/ExpandableText.mdx +++ /dev/null @@ -1,19 +0,0 @@ ---- -slug: ../ExpandableText ---- - -import Basic from "../../_samples/main/ExpandableText/Basic/Basic.md"; -import OverflowModePopover from "../../_samples/main/ExpandableText/OverflowModePopover/OverflowModePopover.md"; - -<%COMPONENT_OVERVIEW%> - -## Basic Sample - - -<%COMPONENT_METADATA%> - -## More Samples - -### Overflow Mode Popover - - diff --git a/packages/website/docs/_components_pages/main/FileUploader.mdx b/packages/website/docs/_components_pages/main/FileUploader.mdx deleted file mode 100644 index a1a0a1c928bbb..0000000000000 --- a/packages/website/docs/_components_pages/main/FileUploader.mdx +++ /dev/null @@ -1,42 +0,0 @@ ---- -slug: ../FileUploader ---- - -import Basic from "../../_samples/main/FileUploader/Basic/Basic.md"; -import MultipleFiles from "../../_samples/main/FileUploader/MultipleFiles/MultipleFiles.md"; -import FilesFilter from "../../_samples/main/FileUploader/FilesFilter/FilesFilter.md"; -import FileSizeLimit from "../../_samples/main/FileUploader/FileSizeLimit/FileSizeLimit.md"; -import WithoutInput from "../../_samples/main/FileUploader/WithoutInput/WithoutInput.md"; - -<%COMPONENT_OVERVIEW%> - -## Basic Sample - - -<%COMPONENT_METADATA%> - -## More Samples - - -### Upload Multiple Files - -By default, only one file can be selected, -to allow multiple files to be uploaded - set the "multiple" property. - - - -### Files Filter -You can define the files, allowed for uploading via the "accept" property. - - - -### File Size Upload Limit - -You can define the maximum file size the uploader will accept. - - - -### Button Only -You can hide the input part via the "hide-input" property. - - diff --git a/packages/website/docs/_components_pages/main/Form/Form.mdx b/packages/website/docs/_components_pages/main/Form/Form.mdx deleted file mode 100644 index d166eeeb5a349..0000000000000 --- a/packages/website/docs/_components_pages/main/Form/Form.mdx +++ /dev/null @@ -1,112 +0,0 @@ ---- -slug: ../../Form ---- - -import Basic from "../../../_samples/main/Form/Basic/Basic.md"; -import Groups from "../../../_samples/main/Form/Groups/Groups.md"; -import Edit from "../../../_samples/main/Form/Edit/Edit.md"; -import Layout from "../../../_samples/main/Form/Layout/Layout.md"; -import LabelSpan from "../../../_samples/main/Form/LabelSpan/LabelSpan.md"; -import EmptySpan from "../../../_samples/main/Form/EmptySpan/EmptySpan.md"; -import LabelsOnTop from "../../../_samples/main/Form/LabelsOnTop/LabelsOnTop.md"; -import GroupColumnSpan from "../../../_samples/main/Form/GroupColumnSpan/GroupColumnSpan.md"; -import HeaderTextWrapping from "../../../_samples/main/Form/HeaderTextWrapping/HeaderTextWrapping.md"; -import ItemColumnSpan from "../../../_samples/main/Form/ItemColumnSpan/ItemColumnSpan.md"; -import FreeStyleForm from "../../../_samples/main/Form/FreeStyleForm/FreeStyleForm.md"; -import CustomHeader from "../../../_samples/main/Form/CustomHeader/CustomHeader.md"; - -<%COMPONENT_OVERVIEW%> - -## Basic Sample - - -<%COMPONENT_METADATA%> - -## More Samples - -### Layout -Use the Form#**layout** property to define the number of columns to distribute the form content by breakpoint. - -- S1 M1 L2 XL3 - 1 cols in S, 1 cols in M, 2 cols in L and 3 cols in XL (default layout) -- S1 M2 L3 XL5 - 1 cols in S, 2 cols in M, 3 cols in L and 5 cols in XL -- S1 M2 L4 XL6 - 1 cols in S, 2 cols in M, 4 cols in L and 6 cols in XL -- S2 M3 L5 XL7 - 2 cols in S, 3 cols in M, 5 cols in L and 7 cols in XL - - - - - -### Groups -You can define groups via the **ui5-form-group** web component. - - - - - -### Label Span -Use the **labelSpan** property to define the width proportion of the labels and fields of a FormItem by breakpoint. - -For example: - -- S12 M4 L4 XL4 - the label takes 1/3 in M, L, XL -- S12 M6 L6 XL6 - the label takes 1/2 in M, L, XL -- S12 M12 L12 XL12 - the label takes the whole line and the texts gows on the next line (in all sizes) - - - - -### Empty Span -Use the **emptySpan** property to define the empty space at the FormItem's end. - -For example: - -- emptySpan="S1 M1 L1 XL1" + labelSpan="S4 M4 L4 XL4" will define "4 | 7 | 1" proportion between the label, the field and the empty space -- emptySpan="S3 M3 L3 XL3" + labelSpan="S4 M4 L4 XL4" will define "4 | 5 | 3" proportion between the label, the field and the empty space - - - - -### Labels On Top -Force labels always on top Form#**labelSpan=S12 M12 L12 XL12**. - - - - - -### Edit -The Form has no built-in functionality to transform texts into inputs to implement editable forms. This is delegated to the consumers as shown in the sample. -**Note:** We recommend using "Large" item spacing in "display" mode, and "Normal" for "edit" mode, to avoid "jumping" effect of switching between texts and inputs. - - - - - -### Column Span - -#### FormGroup#**columnSpan** -The FormGroup#columnSpan property defines how many columns the form group should expand to. - - - -#### FormItem#**columnSpan** -The FormItem#**columnSpan** defines to how many columns the form item should expand to. - - - - -### Header Text Wrapping - -The Form header text **is wrapping** when doesn't fit the available space. - - - -### Custom Header - -The Form provides a **header** slot that allows the usage of custom form header. - - - - -### Freestyle Form - - diff --git a/packages/website/docs/_components_pages/main/Form/FormGroup.mdx b/packages/website/docs/_components_pages/main/Form/FormGroup.mdx deleted file mode 100644 index 46dfed75a2f6a..0000000000000 --- a/packages/website/docs/_components_pages/main/Form/FormGroup.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../../FormGroup ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/main/Form/FormItem.mdx b/packages/website/docs/_components_pages/main/Form/FormItem.mdx deleted file mode 100644 index 517593307ca7b..0000000000000 --- a/packages/website/docs/_components_pages/main/Form/FormItem.mdx +++ /dev/null @@ -1,7 +0,0 @@ ---- -slug: ../../FormItem ---- - -<%COMPONENT_OVERVIEW%> - -<%COMPONENT_METADATA%> \ No newline at end of file diff --git a/packages/website/docs/_components_pages/main/Icon.mdx b/packages/website/docs/_components_pages/main/Icon.mdx deleted file mode 100644 index 00e108ff024fa..0000000000000 --- a/packages/website/docs/_components_pages/main/Icon.mdx +++ /dev/null @@ -1,50 +0,0 @@ ---- -slug: ../Icon ---- - -import Basic from "../../_samples/main/Icon/Basic/Basic.md"; -import TntIcons from "../../_samples/main/Icon/TntIcons/TNTIcons.md"; -import BSIcons from "../../_samples/main/Icon/BSIcons/BSIcons.md"; -import Interactive from "../../_samples/main/Icon/Interactive/Interactive.md"; -import CustomStyling from "../../_samples/main/Icon/CustomStyling/CustomStyling.md"; -import Design from "../../_samples/main/Icon/Design/Design.md"; - -<%COMPONENT_OVERVIEW%> - -## Basic Sample - - -<%COMPONENT_METADATA%> - -## More Samples - - -### Design -The Icon supports multiple designs. - - - -### Custom Styling -The Icon allows style customization via pure CSS, applied on the tag. - - - -### Interactive -The Icon can be interactive - clickable and focusable. - - - -### SAP Fiori Tools Icons -The SAP Fiori Tools Icons are available in the @ui5/webcomponents-icons-tnt package. - - - -### SAP Business Suite Icons -The SAP Business Suite Icons are available in the @ui5/webcomponents-icons-business-suite package. - - - - - - - diff --git a/packages/website/docs/_components_pages/main/Input/Input.mdx b/packages/website/docs/_components_pages/main/Input/Input.mdx deleted file mode 100644 index da33630d9da69..0000000000000 --- a/packages/website/docs/_components_pages/main/Input/Input.mdx +++ /dev/null @@ -1,74 +0,0 @@ ---- -slug: ../../Input ---- - -import Basic from "../../../_samples/main/Input/Basic/Basic.md"; -import Suggestions from "../../../_samples/main/Input/Suggestions/Suggestions.md"; -import ClearIcon from "../../../_samples/main/Input/ClearIcon/ClearIcon.md"; -import SuggestionsWrapping from "../../../_samples/main/Input/SuggestionsWrapping/SuggestionsWrapping.md"; -import DynamicSuggestions from "../../../_samples/main/Input/DynamicSuggestions/DynamicSuggestions.md"; -import ValueStateMessage from "../../../_samples/main/Input/ValueStateMessage/ValueStateMessage.md"; -import Label from "../../../_samples/main/Input/Label/Label.md"; -import ValueHelpDialog from "../../../_samples/main/Input/ValueHelpDialog/ValueHelpDialog.md"; -import CustomSuggestions from "../../../_samples/main/Input/CustomSuggestions/CustomSuggestions.md"; -import CustomStyling from "../../../_samples/main/Input/CustomStyling/CustomStyling.md"; -import BuiltInFiltering from "../../../_samples/main/Input/BuiltInFiltering/BuiltInFiltering.md"; -import InteractiveIcons from "../../../_samples/main/Input/InteractiveIcons/InteractiveIcons.md"; - -<%COMPONENT_OVERVIEW%> - -## Basic Sample - - -<%COMPONENT_METADATA%> - -## More Samples - -### Clear Icon -The Input can show a clear icon, visble when there is a value, typed by the user. -When pressed, the value gets cleared. - - - -### Interactive Icons -The Input can display interactive icons that users can click. Use the `ui5-input-icon` component for interactive icons with hover, focus, and active states. - - - -### Input with Suggestions -The Input can show dropdown with suggestions upon user input - see the showSuggestions property for more information. - - - -### Suggestions Wrapping -The sample demonstrates how the text of the suggestions wrap when too long. - - - -### Dynamic Suggestion Control -This sample demonstrates how applications can control when suggestions appear by dynamically toggling the showSuggestions property. -In this example, suggestions are only shown when the user has typed 3 or more characters. - - - -### Input and Label -