diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml index d906c07..b8f535a 100644 --- a/.github/workflows/release.yml +++ b/.github/workflows/release.yml @@ -46,7 +46,7 @@ jobs: generate_release_notes: true - files: core-carousel.zip + files: carousel-kit.zip env: diff --git a/blueprint.json b/blueprint.json index debc314..1a3b44d 100644 --- a/blueprint.json +++ b/blueprint.json @@ -10,7 +10,7 @@ "step": "installPlugin", "pluginData": { "resource": "url", - "url": "https://github.com/rtCamp/core-carousel/releases/latest/download/core-carousel.zip" + "url": "https://github.com/rtCamp/carousel-kit/releases/latest/download/carousel-kit.zip" } }, { diff --git a/examples/data/carousel-kit.xml b/examples/data/carousel-kit.xml index e3b4a1c..06a26d9 100644 --- a/examples/data/carousel-kit.xml +++ b/examples/data/carousel-kit.xml @@ -368,10 +368,10 @@

Examples

- -
-
-
+ +
+
+

Autoplay

@@ -386,10 +386,10 @@
- + - -
+ +

Infinite Loop

@@ -404,10 +404,10 @@
- + - -
+ +

Orientation & Direction

@@ -422,10 +422,10 @@
- + - -
+ +

Styling Options

@@ -440,19 +440,19 @@
-
- +
+ -
-
- +
+
+ - -
-
+ +
+
-]]> +]]> 9 2026-02-12 02:40:15 @@ -484,49 +484,49 @@

Using Carousel Kit, you can easily create carousels which auto-play. You can configure the duration of each slide and different interactions which pause the auto-play such as hovering over a slide.

- -
-
-
+ +
+
+

Excellence is an art won by training and habituation.

Aristotle
- + - -
+ +

I hear and I forget. I see and I remember. I do and I understand.

Confucius
- + - -
+ +

Wisdom begins in wonder.

Socrates
-
- +
+ -
-
- +
+
+ - -
-
+ +
+
- +

@@ -829,43 +829,43 @@

To loop your carousel, all you need to do is select the Carousel block and toggle the "Loop" option.

- -
-
-
+ +
+
+

Slide 1

- + - -
+ +

Slide 2

- + - -
+ +

Slide 3

-
- +
+ -
-
- +
+
+ - -
-
+ +
+
-]]> +]]> 32 2026-02-13 01:27:26 @@ -1034,47 +1034,47 @@

Result

- -
-
-
+ +
+
+

Hello World

- + - -
+ +

Hello World

- + - -
+ +

Hello World

- + - -
+ +

Hello World

-
- +
+ -
-
-
+
+
+
- +

@@ -1209,233 +1209,233 @@

100% Slides (1 slide per view)

- -
-
-
+ +
+
+

Hello World

- + - -
+ +

Hello World

- + - -
+ +

Hello World

- + - -
+ +

Hello World

-
- +
+ -
-
-
+
+
+
- +

50% Slides (2 slides per view)

- -
-
-
+ +
+
+

Hello World

- + - -
+ +

Hello World

- + - -
+ +

Hello World

- + - -
+ +

Hello World

-
- +
+ -
-
-
+
+
+
- +

33% Slides (3 slides per view)

- -
-
-
+ +
+
+

Hello World

- + - -
+ +

Hello World

- + - -
+ +

Hello World

- + - -
+ +

Hello World

- + - -
+ +

Hello World

- + - -
+ +

Hello World

- + - -
+ +

Hello World

-
- +
+ -
-
-
+
+
+
- +

25% Slides (4 slides per view)

- -
-
-
+ +
+
+

Hello World

- + - -
+ +

Hello World

- + - -
+ +

Hello World

- + - -
+ +

Hello World

- + - -
+ +

Hello World

- + - -
+ +

Hello World

- + - -
+ +

Hello World

-
- +
+ -
-
-
+
+
+
- +

Slide Gap

@@ -1542,49 +1542,49 @@

If you choose vertical orientation, you will also need to specify a fixed height.

- -
-
-
+ +
+
+

Excellence is an art won by training and habituation.

Aristotle
- + - -
+ +

I hear and I forget. I see and I remember. I do and I understand.

Confucius
- + - -
+ +

Wisdom begins in wonder.

Socrates
-
- +
+ -
-
- +
+
+ - -
-
+ +
+
- +

Direction

@@ -1594,49 +1594,49 @@

You can also specify direction of your carousel (LTR/RTL). Select the carousel block and in the "Direction" options, choose your desired direction.

- -
-
-
+ +
+
+

Excellence is an art won by training and habituation.

Aristotle
- + - -
+ +

I hear and I forget. I see and I remember. I do and I understand.

Confucius
- + - -
+ +

Wisdom begins in wonder.

Socrates
-
- +
+ -
-
- +
+
+ - -
-
+ +
+
- +

@@ -1738,8 +1738,8 @@
- -
+ +
@@ -1749,14 +1749,14 @@
- + -
-
-
+
+
+
- +

diff --git a/package.json b/package.json index d4a265a..337a513 100644 --- a/package.json +++ b/package.json @@ -1,5 +1,5 @@ { - "name": "core-carousel", + "name": "carousel-kit", "version": "1.0.1", "description": "Carousel block using Embla and WordPress Interactivity API", "author": "rtCamp", @@ -63,4 +63,4 @@ "react-dom": "^18.3.1", "webpack-dev-server": ">=5.2.1" } -} +} \ No newline at end of file diff --git a/src/blocks/carousel/styles/_core.scss b/src/blocks/carousel/styles/_core.scss index 139b021..e230bf7 100644 --- a/src/blocks/carousel/styles/_core.scss +++ b/src/blocks/carousel/styles/_core.scss @@ -48,14 +48,14 @@ * When looping is enabled, Embla v8 doesn't support CSS 'gap'. * We switch to margin for consistent spacing in loop mode. */ -:where(.core-carousel[data-loop="true"]) .embla__container, -:where(.core-carousel[data-loop="true"]) .embla .wp-block-post-template { +:where(.carousel-kit[data-loop="true"]) .embla__container, +:where(.carousel-kit[data-loop="true"]) .embla .wp-block-post-template { gap: 0; } -:where(.core-carousel[data-loop="true"]) .embla__slide, -:where(.core-carousel[data-loop="true"]) .embla .wp-block-post-template li { - margin-inline-end: var(--core-carousel-gap, 0); +:where(.carousel-kit[data-loop="true"]) .embla__slide, +:where(.carousel-kit[data-loop="true"]) .embla .wp-block-post-template li { + margin-inline-end: var(--carousel-kit-gap, 0); } /* Vertical Axis adjustments */ @@ -83,7 +83,10 @@ } /* Vertical + Loop specific */ -:where(.core-carousel[data-axis="y"][data-loop="true"]) .embla__slide, -:where(.core-carousel[data-axis="y"][data-loop="true"]) .embla .wp-block-post-template li { - margin-block-end: var(--core-carousel-gap, 0); +:where(.carousel-kit[data-axis="y"][data-loop="true"]) .embla__slide, +:where(.carousel-kit[data-axis="y"][data-loop="true"]) + .embla + .wp-block-post-template + li { + margin-block-end: var(--carousel-kit-gap, 0); }