Merge branch 'release/1.0.0-alpha.9'

CHANGELOG.md

@@ -6,6 +6,13 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 
 ## [Unreleased]
 
+## [v1.0.0-alpha.9](https://github.com/studiometa/ui/compare/1.0.0-alpha.8..1.0.0-alpha.9) (2024-10-15)
+
+### Added
+
+- Add a [FigureShopify](https://ui.studiometa.dev/-/components/atoms/FigureShopify/) component ([#303](https://github.com/studiometa/ui/pull/303))
+- **Transition:** add support for grouped transitions ([#305](https://github.com/studiometa/ui/issues/305), [#306](https://github.com/studiometa/ui/pull/306), [be85501](https://github.com/studiometa/ui/commit/be85501))
+
 ## [v1.0.0-alpha.8](https://github.com/studiometa/ui/compare/1.0.0-alpha.7..1.0.0-alpha.8) (2024-09-25)
 
 ### Added

composer.json

@@ -1,6 +1,6 @@
 {
   "name": "studiometa/ui",
-  "version": "1.0.0-alpha.8",
+  "version": "1.0.0-alpha.9",
   "description": "A set of opiniated, unstyled and accessible components.",
   "license": "MIT",
   "require": {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@studiometa/ui-workspace",
-  "version": "1.0.0-alpha.8",
+  "version": "1.0.0-alpha.9",
   "private": true,
   "workspaces": [
     "packages/*"

packages/docs/components/atoms/FigureShopify/examples.md

@@ -0,0 +1,31 @@
+---
+title: FigureShopify examples
+---
+
+# Examples
+
+## Simple
+
+This is a simple example using a 1 × 1 pixels transparent PNG as a placeholder.
+
+<PreviewPlayground
+  :html="() => import('./stories/app.liquid?raw')"
+  :script="() => import('./stories/app.js?raw')"
+  />
+
+## Blurred placeholder
+
+This example uses a small sized image with a maximum width of 10 pixels with a blur backdrop-filter as a placeholder.
+
+<PreviewPlayground
+  :html="() => import('./stories/blurred.liquid?raw')"
+  :script="() => import('./stories/app.js?raw')"
+  />
+
+## Advanced reveal
+
+<PreviewPlayground
+  :html="() => import('./stories/reveal.liquid?raw')"
+  :script="() => import('./stories/reveal.js?raw')"
+  :css="() => import('./stories/reveal.css?raw')"
+  />