=== Lime Product Carousel Block ===
Contributors: limewoo, thenahidul
Tags: woocommerce, products, carousel, gutenberg, block
Requires at least: 6.5
Tested up to: 6.9
Stable tag: 1.0.0
Requires PHP: 8.0
WC requires at least: 8.0
WC tested up to: 10.7.0
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html

Display WooCommerce products in a beautiful, touch-friendly carousel block with newest, sale, and category products, plus full styling controls.
== Description ==

**Lime Product Carousel Block** adds a native Gutenberg block to showcase your WooCommerce products in a smooth, responsive carousel. Built with [Embla Carousel](https://www.embla-carousel.com/) — no jQuery, no slick, no bloat.

Add it to any page, post, or widget area. Configure everything from the Inspector panel without touching code.

= What you can display =

* **Newest products** — latest published by date
* **Sale products** — products currently on sale
* **Products by category** — pick one or more product categories

= Carousel controls =

* Touch and drag on mobile and desktop
* Configurable slides visible at once — independently for desktop, tablet, and mobile
* Optional autoplay with configurable speed
* Prev / next navigation arrows (optional)
* Dot indicators (optional)
* Configurable gap between slides

= Product card options =

* Show or hide: product price, star rating, Add to Cart button
* Working AJAX Add to Cart — cart quantity updates in real time
* Sale badge on discounted products
* Card alignment: left, center, or right
* Hover lift animation with drop shadow

= Style controls =

All styling is done from the Inspector panel — no CSS required:

* Accent color (buttons, price)
* Title color, font size, font weight
* Price color, font size
* Button background color, text color, border radius

= Performance =

* Full HTML output cached via WP transients — one DB query on the first load, then served from cache
* Cache invalidates automatically on stock changes, price updates, and scheduled sales
* Compatible with page caching plugins

= Editor experience =

* Live server-side preview in the block editor
* Styles update instantly in the preview as you change settings
* No configuration outside the editor

= Developer friendly =

* Declares HPOS (High-Performance Order Storage) compatibility
* Declares block cart / checkout compatibility
* Uses `WC_Product_Query` — no raw DB queries
* Cache TTL filterable via `lpcb_cache_ttl` filter
* All classes namespaced under `Lime_Product_Carousel_Block`
* Full source available on [GitHub](https://github.com/Limewoo/lime-product-carousel-block)

**Requires:** WooCommerce 8.0+

Check out our other WooCommerce plugins at [limewoo.com](https://limewoo.com).

== Installation ==

**From WordPress admin (recommended):**

1. Go to **Plugins → Add New**.
2. Search for **Lime Product Carousel Block**.
3. Click **Install Now**, then **Activate**.

**Manual upload:**

1. Download the plugin zip.
2. Go to **Plugins → Add New → Upload Plugin**.
3. Upload the zip, then click **Install Now** and **Activate**.

**After activation:**

1. Open any page or post in the block editor.
2. Click **+** to add a block, then search for **Lime Product Carousel**.
3. Insert the block and configure it from the **Inspector panel** on the right.

== Frequently Asked Questions ==

= Does this require WooCommerce? =

Yes. The block queries WooCommerce products and will not load without WooCommerce active.

= Can I show products from a specific category? =

Yes. In the **Options** tab, set **Query Type** to **By Category**, then choose one or more product categories from the multi-select dropdown.

= How many products can I show? =

Between 1 and 20 products per carousel instance. Use the **Products Count** control in the Inspector panel.

= Can I have multiple carousels on the same page? =

Yes. Each block gets a unique ID automatically — even duplicated blocks are fully independent.

= Can I show products in random order? =

Yes. Set **Order By** to **Random**. Note that random-order carousels are not cached (cache would defeat the randomness).

= Is autoplay accessible? =

Autoplay pauses on hover and on focus so keyboard and screen reader users are not disrupted.

= Does Add to Cart work? =

Yes. The button uses WooCommerce's standard AJAX cart system. The cart quantity updates in real time and stays in sync across all carousel instances on the page.

= Does this work with HPOS (High-Performance Order Storage)? =

Yes. The plugin explicitly declares HPOS compatibility and uses `WC_Product_Query` throughout — no legacy order table queries.

= Does this work with block themes? =

Yes. The block is fully compatible with block themes and classic themes. It uses `get_block_wrapper_attributes()` so the block supports alignment and spacing controls natively.

= Is the output cached? =

Yes. The full HTML is cached in WP transients by default for 24 hours. The cache is automatically cleared when product stock changes, prices update, or a scheduled sale starts or ends. You can change the TTL using the `lpcb_cache_ttl` filter:

`add_filter( 'lpcb_cache_ttl', fn() => HOUR_IN_SECONDS * 6 );`

= How do I style it to match my theme? =

Use the **Styles** tab in the Inspector panel to set accent color, title color/size/weight, price color/size, and button colors and border radius. All overrides are applied as CSS custom properties on the block wrapper — no specificity battles with theme styles.

= Can I use this block in the site editor (FSE)? =

Yes. The block works in the site editor, template parts, and patterns.

== Development ==

The plugin's JavaScript and CSS are compiled from source. Full source code is on GitHub:

https://github.com/Limewoo/lime-product-carousel-block

To build from source:

1. Clone: `git clone https://github.com/Limewoo/lime-product-carousel-block.git`
2. Install dependencies: `bun install` (or `npm install`)
3. Production build: `bun run build`
4. Watch mode: `bun run start`

Source files live in `src/`. Compiled output goes to `build/`. Do not edit `build/` directly.

== Screenshots ==

1. Product carousel on the frontend — showing newest products with sale badges, ratings, and AJAX cart buttons.
2. Block editor with live server-side preview.
3. Inspector panel — Options tab: query type, order, slide counts, autoplay, card toggles.
4. Inspector panel — Styles tab: accent color, title, price, and button style controls.

== Changelog ==

= 1.0.0 =
* Initial release.

== Upgrade Notice ==

= 1.0.0 =
Initial release. No upgrade steps required.
