diff --git a/packages/main/src/Carousel.ts b/packages/main/src/Carousel.ts
index e1684d2fc1c8..3b99a4d2f650 100644
--- a/packages/main/src/Carousel.ts
+++ b/packages/main/src/Carousel.ts
@@ -29,7 +29,7 @@ import {
CAROUSEL_NEXT_ARROW_TEXT,
} from "./generated/i18n/i18n-defaults.js";
import CarouselArrowsPlacement from "./types/CarouselArrowsPlacement.js";
-import CarouselPageIndicatorStyle from "./types/CarouselPageIndicatorStyle.js";
+import CarouselPageIndicatorType from "./types/CarouselPageIndicatorType.js";
import BackgroundDesign from "./types/BackgroundDesign.js";
import BorderDesign from "./types/BorderDesign.js";
import CarouselTemplate from "./generated/templates/CarouselTemplate.lit.js";
@@ -189,8 +189,8 @@ class Carousel extends UI5Element {
* @default "Default"
* @public
*/
- @property({ type: CarouselPageIndicatorStyle, defaultValue: CarouselPageIndicatorStyle.Default })
- pageIndicatorStyle!: `${CarouselPageIndicatorStyle}`;
+ @property({ type: CarouselPageIndicatorType, defaultValue: CarouselPageIndicatorType.Default })
+ pageIndicatorType!: `${CarouselPageIndicatorType}`;
/**
* Defines the carousel's background design.
@@ -615,7 +615,7 @@ class Carousel extends UI5Element {
}
get isPageTypeDots() {
- if (this.pageIndicatorStyle === CarouselPageIndicatorStyle.Numeric) {
+ if (this.pageIndicatorType === CarouselPageIndicatorType.Numeric) {
return false;
}
diff --git a/packages/main/src/types/CarouselPageIndicatorStyle.ts b/packages/main/src/types/CarouselPageIndicatorType.ts
similarity index 77%
rename from packages/main/src/types/CarouselPageIndicatorStyle.ts
rename to packages/main/src/types/CarouselPageIndicatorType.ts
index a1d6dadb6785..fb61ec75af04 100644
--- a/packages/main/src/types/CarouselPageIndicatorStyle.ts
+++ b/packages/main/src/types/CarouselPageIndicatorType.ts
@@ -1,8 +1,8 @@
/**
- * Different Carousel page indicator styles.
+ * Different Carousel page indicator types.
* @public
*/
-enum CarouselPageIndicatorStyle {
+enum CarouselPageIndicatorType {
/**
* 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)
@@ -17,4 +17,4 @@ enum CarouselPageIndicatorStyle {
Numeric = "Numeric",
}
-export default CarouselPageIndicatorStyle;
+export default CarouselPageIndicatorType;
diff --git a/packages/main/test/pages/Carousel.html b/packages/main/test/pages/Carousel.html
index e27bc366e3ca..600859285dfb 100644
--- a/packages/main/test/pages/Carousel.html
+++ b/packages/main/test/pages/Carousel.html
@@ -448,8 +448,8 @@
- Carousel with Numeric style page indicator
-
+ Carousel with Numeric type page indicator
+
Button 1
Button 2
diff --git a/packages/main/test/specs/Carousel.spec.js b/packages/main/test/specs/Carousel.spec.js
index dfad786f460f..4bc4e3bd6eee 100644
--- a/packages/main/test/specs/Carousel.spec.js
+++ b/packages/main/test/specs/Carousel.spec.js
@@ -191,7 +191,7 @@ describe("Carousel general interaction", () => {
assert.strictEqual(await eventCounter.getProperty("value"), "6", "The navigate event is not fired as no previous item.");
});
- it("page-indicator-style property", async () => {
+ it("page-indicator-type property", async () => {
const carousel = await browser.$("#carouselNumericPageIndicator");
await carousel.scrollIntoView();
diff --git a/packages/playground/_stories/main/Carousel/Carousel.stories.ts b/packages/playground/_stories/main/Carousel/Carousel.stories.ts
index df62d1dfd87b..06c017a32920 100644
--- a/packages/playground/_stories/main/Carousel/Carousel.stories.ts
+++ b/packages/playground/_stories/main/Carousel/Carousel.stories.ts
@@ -25,7 +25,7 @@ const Template: UI5StoryArgs = (args) => {
items-per-page-l="${ifDefined(args.itemsPerPageL)}"
?hide-navigation-arrows="${ifDefined(args.hideNavigationArrows)}"
?hide-page-indicator="${ifDefined(args.hidePageIndicator)}"
- page-indicator-style="${ifDefined(args.pageIndicatorStyle)}"
+ page-indicator-type="${ifDefined(args.pageIndicatorType)}"
arrows-placement="${ifDefined(args.arrowsPlacement)}"
>
${unsafeHTML(args.default)}
diff --git a/packages/website/docs/_components_pages/main/Carousel.mdx b/packages/website/docs/_components_pages/main/Carousel.mdx
index 9dec114dc4e1..21292dd26d6c 100644
--- a/packages/website/docs/_components_pages/main/Carousel.mdx
+++ b/packages/website/docs/_components_pages/main/Carousel.mdx
@@ -23,14 +23,14 @@ When the first page is reached, pressing "Backward" will navigate to the last pa
### Arrows Placement
-When **pageIndicatorStyle** is set to **"Content"**, the arrows are placed on the sides of the current page.
-When **pageIndicatorStyle** is set to **"Navigation"**, the arrows are placed on the sides of the page indicator.
+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 **pageIndicatorStyle** is set to **"Default"**, the page indicator appear as dots.
-When **pageIndicatorStyle** is set to **"Numeric"** - as numbers.
+When **pageIndicatorType** is set to **"Default"**, the page indicator appear as dots.
+When **pageIndicatorType** is set to **"Numeric"** - as numbers.
diff --git a/packages/website/docs/_samples/main/Carousel/PageIndicatorType/sample.html b/packages/website/docs/_samples/main/Carousel/PageIndicatorType/sample.html
index 7aedf4682d3c..85cd88535014 100644
--- a/packages/website/docs/_samples/main/Carousel/PageIndicatorType/sample.html
+++ b/packages/website/docs/_samples/main/Carousel/PageIndicatorType/sample.html
@@ -12,7 +12,7 @@
-
+
