From 32176d5e9aa8a4a95d65585a883d1ad462d4f6d7 Mon Sep 17 00:00:00 2001
From: Liam Martens <hi@liammartens.com>
Date: Sun, 31 Dec 2023 11:11:50 -0500
Subject: [PATCH] Implement #429.

Co-authored-by: David Jerleke <david.jerleke@gmail.com>
Co-authored-by: Liam Martens <hi@liammartens.com>
---
 package.json                                  |   7 +-
 .../embla-carousel-auto-height/package.json   |   3 +-
 packages/embla-carousel-autoplay/package.json |   3 +-
 .../embla-carousel-class-names/package.json   |   3 +-
 .../src/assets/icons/index.ts                 |   2 +
 .../src/assets/icons/solid-logo.svg           |   1 +
 .../src/content/pages/get-started/cdn.mdx     |   2 +-
 .../src/content/pages/get-started/solid.mdx   | 150 +++
 .../embla-carousel-docs/static/solid-logo.svg |   1 +
 packages/embla-carousel-react/package.json    |   3 +-
 .../package.json                              |   3 +-
 packages/embla-carousel-solid/.eslintignore   |   5 +
 packages/embla-carousel-solid/.eslintrc.js    |  20 +
 packages/embla-carousel-solid/.prettierrc.js  |   1 +
 packages/embla-carousel-solid/README.md       | 172 +++
 packages/embla-carousel-solid/jest.config.js  |   8 +
 packages/embla-carousel-solid/package.json    |  82 ++
 .../embla-carousel-solid/rollup.config.js     |  75 ++
 .../src/components/createEmblaCarousel.ts     |  77 ++
 packages/embla-carousel-solid/src/index.ts    |   2 +
 packages/embla-carousel-solid/tsconfig.json   |  16 +
 packages/embla-carousel-svelte/package.json   |   3 +-
 packages/embla-carousel-vue/package.json      |   3 +-
 packages/embla-carousel/package.json          |   3 +-
 .../.gitignore                                |  24 +
 .../index.html                                |  13 +
 .../package.json                              |  20 +
 .../src/Carousel/Buttons.tsx                  |  49 +
 .../src/Carousel/Carousel.tsx                 |  96 ++
 .../src/Carousel/imageByIndex.ts              |  10 +
 .../src/main.css                              |  22 +
 .../src/main.tsx                              |  48 +
 .../src/vite-env.d.ts                         |   1 +
 .../tsconfig.json                             |  17 +
 .../tsconfig.node.json                        |   9 +
 .../vite.config.ts                            |  32 +
 scripts/create-readmes/readme-template.md     |   4 +
 yarn.lock                                     | 979 +++++++++++++++++-
 38 files changed, 1957 insertions(+), 12 deletions(-)
 create mode 100644 packages/embla-carousel-docs/src/assets/icons/solid-logo.svg
 create mode 100644 packages/embla-carousel-docs/src/content/pages/get-started/solid.mdx
 create mode 100644 packages/embla-carousel-docs/static/solid-logo.svg
 create mode 100644 packages/embla-carousel-solid/.eslintignore
 create mode 100644 packages/embla-carousel-solid/.eslintrc.js
 create mode 100644 packages/embla-carousel-solid/.prettierrc.js
 create mode 100644 packages/embla-carousel-solid/README.md
 create mode 100644 packages/embla-carousel-solid/jest.config.js
 create mode 100644 packages/embla-carousel-solid/package.json
 create mode 100644 packages/embla-carousel-solid/rollup.config.js
 create mode 100644 packages/embla-carousel-solid/src/components/createEmblaCarousel.ts
 create mode 100644 packages/embla-carousel-solid/src/index.ts
 create mode 100644 packages/embla-carousel-solid/tsconfig.json
 create mode 100644 playgrounds/embla-carousel-playground-solid/.gitignore
 create mode 100644 playgrounds/embla-carousel-playground-solid/index.html
 create mode 100644 playgrounds/embla-carousel-playground-solid/package.json
 create mode 100644 playgrounds/embla-carousel-playground-solid/src/Carousel/Buttons.tsx
 create mode 100644 playgrounds/embla-carousel-playground-solid/src/Carousel/Carousel.tsx
 create mode 100644 playgrounds/embla-carousel-playground-solid/src/Carousel/imageByIndex.ts
 create mode 100644 playgrounds/embla-carousel-playground-solid/src/main.css
 create mode 100644 playgrounds/embla-carousel-playground-solid/src/main.tsx
 create mode 100644 playgrounds/embla-carousel-playground-solid/src/vite-env.d.ts
 create mode 100644 playgrounds/embla-carousel-playground-solid/tsconfig.json
 create mode 100644 playgrounds/embla-carousel-playground-solid/tsconfig.node.json
 create mode 100644 playgrounds/embla-carousel-playground-solid/vite.config.ts

diff --git a/package.json b/package.json
index 9f7c29595..e6fb601ea 100644
--- a/package.json
+++ b/package.json
@@ -16,6 +16,7 @@
   "workspaces": [
     "packages/embla-carousel",
     "packages/embla-carousel-react",
+    "packages/embla-carousel-solid",
     "packages/embla-carousel-vue",
     "packages/embla-carousel-svelte",
     "packages/embla-carousel-docs",
@@ -24,7 +25,8 @@
     "packages/embla-carousel-class-names",
     "packages/embla-carousel-reactive-utils",
     "playgrounds/embla-carousel-playground-vanilla",
-    "playgrounds/embla-carousel-playground-react"
+    "playgrounds/embla-carousel-playground-react",
+    "playgrounds/embla-carousel-playground-solid"
   ],
   "scripts": {
     "lint": "npm-run-all prettier:report eslint:report",
@@ -32,11 +34,14 @@
     "test": "yarn workspaces foreach -v --exclude \"{embla-carousel-monorepo,embla-carousel-playground-vanilla,embla-carousel-playground-react}\" run test",
     "watch:package-vanilla": "yarn workspace embla-carousel run start",
     "watch:package-react": "yarn workspace embla-carousel-react run start",
+    "watch:package-solid": "yarn workspace embla-carousel-solid run start",
     "watch:playground-vanilla": "yarn workspace embla-carousel-playground-vanilla run dev",
     "watch:playground-react": "yarn workspace embla-carousel-playground-react run dev",
+    "watch:playground-solid": "yarn workspace embla-carousel-playground-solid run dev",
     "start": "yarn workspace embla-carousel-docs run start",
     "start:vanilla": "npm-run-all --parallel watch:package-vanilla watch:playground-vanilla",
     "start:react": "npm-run-all --parallel watch:package-vanilla watch:package-react watch:playground-react",
+    "start:solid": "npm-run-all --parallel watch:package-vanilla watch:package-solid watch:playground-solid",
     "build": "npm-run-all build:packages build:package-readmes format",
     "build:packages": "yarn workspaces foreach -vt --exclude \"{embla-carousel-monorepo,embla-carousel-playground-vanilla,embla-carousel-playground-react}\" run build",
     "build:package-readmes": "npx ts-node --project scripts/tsconfig.node.json scripts/create-readmes/index.ts --templatePath=scripts/create-readmes/readme-template.md",
diff --git a/packages/embla-carousel-auto-height/package.json b/packages/embla-carousel-auto-height/package.json
index 67233018a..299e3d3aa 100644
--- a/packages/embla-carousel-auto-height/package.json
+++ b/packages/embla-carousel-auto-height/package.json
@@ -23,7 +23,8 @@
     "typescript",
     "react",
     "vue",
-    "svelte"
+    "svelte",
+    "solid"
   ],
   "main": "embla-carousel-auto-height.umd.js",
   "unpkg": "embla-carousel-auto-height.umd.js",
diff --git a/packages/embla-carousel-autoplay/package.json b/packages/embla-carousel-autoplay/package.json
index 3c7f600ca..a550b4637 100644
--- a/packages/embla-carousel-autoplay/package.json
+++ b/packages/embla-carousel-autoplay/package.json
@@ -23,7 +23,8 @@
     "typescript",
     "react",
     "vue",
-    "svelte"
+    "svelte",
+    "solid"
   ],
   "main": "embla-carousel-autoplay.umd.js",
   "unpkg": "embla-carousel-autoplay.umd.js",
diff --git a/packages/embla-carousel-class-names/package.json b/packages/embla-carousel-class-names/package.json
index 50fccb22e..cbd49180d 100644
--- a/packages/embla-carousel-class-names/package.json
+++ b/packages/embla-carousel-class-names/package.json
@@ -23,7 +23,8 @@
     "typescript",
     "react",
     "vue",
-    "svelte"
+    "svelte",
+    "solid"
   ],
   "main": "embla-carousel-class-names.umd.js",
   "unpkg": "embla-carousel-class-names.umd.js",
diff --git a/packages/embla-carousel-docs/src/assets/icons/index.ts b/packages/embla-carousel-docs/src/assets/icons/index.ts
index e9e77e76c..def97a966 100644
--- a/packages/embla-carousel-docs/src/assets/icons/index.ts
+++ b/packages/embla-carousel-docs/src/assets/icons/index.ts
@@ -8,6 +8,7 @@ import github from './github-logo.svg'
 import javascript from './javascript-logo.svg'
 import typescript from './typescript-logo.svg'
 import react from './react-logo.svg'
+import solid from './solid-logo.svg'
 import search from './search.svg'
 import cross from './cross.svg'
 import info from './info.svg'
@@ -41,6 +42,7 @@ export const ICONS = {
   javascript: styledSvg(javascript),
   typescript: styledSvg(typescript),
   react: styledSvg(react),
+  solid: styledSvg(solid),
   search: styledSvg(search),
   cross: styledSvg(cross),
   info: styledSvg(info),
diff --git a/packages/embla-carousel-docs/src/assets/icons/solid-logo.svg b/packages/embla-carousel-docs/src/assets/icons/solid-logo.svg
new file mode 100644
index 000000000..025aa303c
--- /dev/null
+++ b/packages/embla-carousel-docs/src/assets/icons/solid-logo.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 166 155.3"><path d="M163 35S110-4 69 5l-3 1c-6 2-11 5-14 9l-2 3-15 26 26 5c11 7 25 10 38 7l46 9 18-30z" fill="#76b3e1"/><linearGradient id="a" gradientUnits="userSpaceOnUse" x1="27.5" y1="3" x2="152" y2="63.5"><stop offset=".1" stop-color="#76b3e1"/><stop offset=".3" stop-color="#dcf2fd"/><stop offset="1" stop-color="#76b3e1"/></linearGradient><path d="M163 35S110-4 69 5l-3 1c-6 2-11 5-14 9l-2 3-15 26 26 5c11 7 25 10 38 7l46 9 18-30z" opacity=".3" fill="url(#a)"/><path d="M52 35l-4 1c-17 5-22 21-13 35 10 13 31 20 48 15l62-21S92 26 52 35z" fill="#518ac8"/><linearGradient id="b" gradientUnits="userSpaceOnUse" x1="95.8" y1="32.6" x2="74" y2="105.2"><stop offset="0" stop-color="#76b3e1"/><stop offset=".5" stop-color="#4377bb"/><stop offset="1" stop-color="#1f3b77"/></linearGradient><path d="M52 35l-4 1c-17 5-22 21-13 35 10 13 31 20 48 15l62-21S92 26 52 35z" opacity=".3" fill="url(#b)"/><linearGradient id="c" gradientUnits="userSpaceOnUse" x1="18.4" y1="64.2" x2="144.3" y2="149.8"><stop offset="0" stop-color="#315aa9"/><stop offset=".5" stop-color="#518ac8"/><stop offset="1" stop-color="#315aa9"/></linearGradient><path d="M134 80a45 45 0 00-48-15L24 85 4 120l112 19 20-36c4-7 3-15-2-23z" fill="url(#c)"/><linearGradient id="d" gradientUnits="userSpaceOnUse" x1="75.2" y1="74.5" x2="24.4" y2="260.8"><stop offset="0" stop-color="#4377bb"/><stop offset=".5" stop-color="#1a336b"/><stop offset="1" stop-color="#1a336b"/></linearGradient><path d="M114 115a45 45 0 00-48-15L4 120s53 40 94 30l3-1c17-5 23-21 13-34z" fill="url(#d)"/></svg>
\ No newline at end of file
diff --git a/packages/embla-carousel-docs/src/content/pages/get-started/cdn.mdx b/packages/embla-carousel-docs/src/content/pages/get-started/cdn.mdx
index 7690059a9..c17f56fd7 100644
--- a/packages/embla-carousel-docs/src/content/pages/get-started/cdn.mdx
+++ b/packages/embla-carousel-docs/src/content/pages/get-started/cdn.mdx
@@ -1,7 +1,7 @@
 ---
 title: CDN
 description: Learn how to setup Embla Carousel using a CDN.
-order: 4
+order: 5
 date: 2021-02-21
 ---
 
diff --git a/packages/embla-carousel-docs/src/content/pages/get-started/solid.mdx b/packages/embla-carousel-docs/src/content/pages/get-started/solid.mdx
new file mode 100644
index 000000000..9c610fde6
--- /dev/null
+++ b/packages/embla-carousel-docs/src/content/pages/get-started/solid.mdx
@@ -0,0 +1,150 @@
+---
+title: Solid
+description: Learn how to setup Embla Carousel using Solid.
+order: 4
+date: 2023-12-31
+---
+
+import { Tabs } from 'components/Tabs/Tabs'
+import { TabsItem } from 'components/Tabs/TabsItem'
+
+# Solid
+
+Start by installing the Embla Carousel **npm package** and add it to your dependencies.
+
+<Tabs groupId="package-manager">
+  <TabsItem label="npm" value="npm">
+
+    ```shell
+    npm install embla-carousel-solid --save
+    ```
+
+  </TabsItem>
+  <TabsItem label="yarn" value="yarn">
+
+    ```shell
+    yarn add embla-carousel-solid
+    ```
+
+  </TabsItem>
+</Tabs>
+
+---
+
+## The component structure
+
+Embla Carousel provides the handy `createEmblaCarousel` method for seamless integration with Solid. A minimal setup requires an **overflow wrapper** and a **scroll container**. Start by adding the following structure to your carousel:
+
+```jsx
+import createEmblaCarousel from 'embla-carousel-solid'
+
+export const EmblaCarousel = () => {
+  const [emblaRef] = createEmblaCarousel()
+
+  return (
+    <div class="embla" ref={emblaRef}>
+      <div class="embla__container">
+        <div class="embla__slide">Slide 1</div>
+        <div class="embla__slide">Slide 2</div>
+        <div class="embla__slide">Slide 3</div>
+      </div>
+    </div>
+  )
+}
+```
+
+## Styling the carousel
+
+The method gives us a **ref** to attach to our wrapping element with the classname `embla`, which is needed to cover the scroll overflow. The element with the `container` classname is the scroll body that scrolls the slides. Continue by adding the following **CSS** to these elements:
+
+```css
+.embla {
+  overflow: hidden;
+}
+.embla__container {
+  display: flex;
+}
+.embla__slide {
+  flex: 0 0 100%;
+  min-width: 0;
+}
+```
+
+## Accessing the carousel API
+
+The `createEmblaCarousel` method takes the Embla Carousel [options](/api/options/) as the first argument, which is a Solid accessor. Additionally, you can access the [API](/api/) with a `createEffect` like demonstrated below:
+
+```jsx{5,7-12}
+import { createEffect } from 'solid-js'
+import createEmblaCarousel from 'embla-carousel-solid'
+
+export const EmblaCarousel = () => {
+  const [emblaRef, emblaApi] = createEmblaCarousel(() => ({ loop: true }))
+
+  createEffect(() => {
+    const api = emblaApi()
+    if (api) {
+      console.log(api.slideNodes()) // Access API
+    }
+  })
+
+  return (
+    <div class="embla" ref={emblaRef}>
+      <div class="embla__container">
+        <div class="embla__slide">Slide 1</div>
+        <div class="embla__slide">Slide 2</div>
+        <div class="embla__slide">Slide 3</div>
+      </div>
+    </div>
+  )
+}
+```
+
+## Adding plugins
+
+Start by installing the plugin you want to use. In this example, we're going to install the [Autoplay](/plugins/autoplay/) plugin:
+
+<Tabs groupId="package-manager">
+  <TabsItem label="npm" value="npm">
+
+    ```shell
+    npm install embla-carousel-autoplay --save
+    ```
+
+  </TabsItem>
+  <TabsItem label="yarn" value="yarn">
+
+    ```shell
+    yarn add embla-carousel-autoplay
+    ```
+
+  </TabsItem>
+</Tabs>
+
+The `createEmblaCarousel` method accepts [plugins](/plugins/) as the second argument, which is a Solid accessor. Note that plugins need to be passed in an **array** like so:
+
+The config getter can also return a list of plugins, like so:
+
+```jsx{2,7}
+import createEmblaCarousel from 'embla-carousel-solid'
+import Autoplay from 'embla-carousel-autoplay'
+
+export const EmblaCarousel = () => {
+  const [emblaRef] = createEmblaCarousel(
+    () => ({ loop: true }),
+    () => [AutoPlay()]
+  )
+
+  return (
+    <div class="embla" ref={emblaRef}>
+      <div class="embla__container">
+        <div class="embla__slide">Slide 1</div>
+        <div class="embla__slide">Slide 2</div>
+        <div class="embla__slide">Slide 3</div>
+      </div>
+    </div>
+  )
+}
+```
+
+Congratulations! You just created your first Embla Carousel component.
diff --git a/packages/embla-carousel-docs/static/solid-logo.svg b/packages/embla-carousel-docs/static/solid-logo.svg
new file mode 100644
index 000000000..025aa303c
--- /dev/null
+++ b/packages/embla-carousel-docs/static/solid-logo.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 166 155.3"><path d="M163 35S110-4 69 5l-3 1c-6 2-11 5-14 9l-2 3-15 26 26 5c11 7 25 10 38 7l46 9 18-30z" fill="#76b3e1"/><linearGradient id="a" gradientUnits="userSpaceOnUse" x1="27.5" y1="3" x2="152" y2="63.5"><stop offset=".1" stop-color="#76b3e1"/><stop offset=".3" stop-color="#dcf2fd"/><stop offset="1" stop-color="#76b3e1"/></linearGradient><path d="M163 35S110-4 69 5l-3 1c-6 2-11 5-14 9l-2 3-15 26 26 5c11 7 25 10 38 7l46 9 18-30z" opacity=".3" fill="url(#a)"/><path d="M52 35l-4 1c-17 5-22 21-13 35 10 13 31 20 48 15l62-21S92 26 52 35z" fill="#518ac8"/><linearGradient id="b" gradientUnits="userSpaceOnUse" x1="95.8" y1="32.6" x2="74" y2="105.2"><stop offset="0" stop-color="#76b3e1"/><stop offset=".5" stop-color="#4377bb"/><stop offset="1" stop-color="#1f3b77"/></linearGradient><path d="M52 35l-4 1c-17 5-22 21-13 35 10 13 31 20 48 15l62-21S92 26 52 35z" opacity=".3" fill="url(#b)"/><linearGradient id="c" gradientUnits="userSpaceOnUse" x1="18.4" y1="64.2" x2="144.3" y2="149.8"><stop offset="0" stop-color="#315aa9"/><stop offset=".5" stop-color="#518ac8"/><stop offset="1" stop-color="#315aa9"/></linearGradient><path d="M134 80a45 45 0 00-48-15L24 85 4 120l112 19 20-36c4-7 3-15-2-23z" fill="url(#c)"/><linearGradient id="d" gradientUnits="userSpaceOnUse" x1="75.2" y1="74.5" x2="24.4" y2="260.8"><stop offset="0" stop-color="#4377bb"/><stop offset=".5" stop-color="#1a336b"/><stop offset="1" stop-color="#1a336b"/></linearGradient><path d="M114 115a45 45 0 00-48-15L4 120s53 40 94 30l3-1c17-5 23-21 13-34z" fill="url(#d)"/></svg>
\ No newline at end of file
diff --git a/packages/embla-carousel-react/package.json b/packages/embla-carousel-react/package.json
index 0fa0f5648..e36505203 100644
--- a/packages/embla-carousel-react/package.json
+++ b/packages/embla-carousel-react/package.json
@@ -23,7 +23,8 @@
     "typescript",
     "react",
     "vue",
-    "svelte"
+    "svelte",
+    "solid"
   ],
   "main": "embla-carousel-react.umd.js",
   "unpkg": "embla-carousel-react.umd.js",
diff --git a/packages/embla-carousel-reactive-utils/package.json b/packages/embla-carousel-reactive-utils/package.json
index 70a294404..cabcd4540 100644
--- a/packages/embla-carousel-reactive-utils/package.json
+++ b/packages/embla-carousel-reactive-utils/package.json
@@ -23,7 +23,8 @@
     "typescript",
     "react",
     "vue",
-    "svelte"
+    "svelte",
+    "solid"
   ],
   "main": "embla-carousel-reactive-utils.umd.js",
   "unpkg": "embla-carousel-reactive-utils.umd.js",
diff --git a/packages/embla-carousel-solid/.eslintignore b/packages/embla-carousel-solid/.eslintignore
new file mode 100644
index 000000000..ac4a255db
--- /dev/null
+++ b/packages/embla-carousel-solid/.eslintignore
@@ -0,0 +1,5 @@
+docs
+package.json
+package-lock.json
+yarn.lock
+node_modules
\ No newline at end of file
diff --git a/packages/embla-carousel-solid/.eslintrc.js b/packages/embla-carousel-solid/.eslintrc.js
new file mode 100644
index 000000000..3e3c0c009
--- /dev/null
+++ b/packages/embla-carousel-solid/.eslintrc.js
@@ -0,0 +1,20 @@
+module.exports = {
+  parser: '@typescript-eslint/parser',
+  parserOptions: {
+    ecmaVersion: 2018,
+    sourceType: 'module',
+    ecmaFeatures: { jsx: true }
+  },
+  extends: [
+    'eslint:recommended',
+    'plugin:prettier/recommended',
+    'plugin:@typescript-eslint/eslint-recommended',
+    'plugin:@typescript-eslint/recommended'
+  ],
+  rules: {
+    'no-debugger': 2,
+    'no-console': 2,
+    '@typescript-eslint/no-inferrable-types': 'off',
+    '@typescript-eslint/no-explicit-any': 'off'
+  }
+}
diff --git a/packages/embla-carousel-solid/.prettierrc.js b/packages/embla-carousel-solid/.prettierrc.js
new file mode 100644
index 000000000..5100fc98a
--- /dev/null
+++ b/packages/embla-carousel-solid/.prettierrc.js
@@ -0,0 +1 @@
+module.exports = require('../../.prettierrc.js')
diff --git a/packages/embla-carousel-solid/README.md b/packages/embla-carousel-solid/README.md
new file mode 100644
index 000000000..437fa4dc2
--- /dev/null
+++ b/packages/embla-carousel-solid/README.md
@@ -0,0 +1,172 @@
+<br />
+<div align="center">
+  <p align="center">
+    <a href="https://www.embla-carousel.com/"><img width="100" height="100" src="https://www.embla-carousel.com/embla-logo.svg" alt="Embla Carousel">
+    </a>
+  </p>
+
+  <p align="center">
+    <a href="https://opensource.org/licenses/MIT"><img src="https://img.shields.io/npm/l/embla-carousel?color=%238ab4f8"></a>
+    <a href="https://www.npmjs.com/package/embla-carousel-solid"><img src="https://img.shields.io/npm/v/embla-carousel-solid.svg?color=%23c1a8e2"></a>
+    <a href="/davidjerleke/embla-carousel/actions?query=workflow%3A%22Continuous+Integration%22"><img src="https://img.shields.io/github/actions/workflow/status/davidjerleke/embla-carousel/cd.yml?color=%238ab4f8"></a>
+    <a href="https://prettier.io"><img src="https://img.shields.io/badge/code_style-prettier-ff69b4.svg?color=%23c1a8e2"></a>
+    <a href="https://bundlephobia.com/result?p=embla-carousel-solid@latest"><img src="https://img.shields.io/bundlephobia/minzip/embla-carousel-solid?color=%238ab4f8&label=gzip%20size">
+    </a>
+  </p>
+
+  <strong>
+    <h2 align="center">Embla Carousel Solid</h2>
+  </strong>
+
+  <p align="center">
+    <strong>Embla Carousel</strong> is a bare bones carousel library with great fluid motion and awesome swipe precision. It's library agnostic, dependency free and 100% open source.
+  </p>
+
+  <br>
+
+  <p align="center">
+    <strong>
+      <code>&nbsp;<a href="https://www.embla-carousel.com/examples/predefined/">Examples</a>&nbsp;</code>
+    </strong>
+  </p>
+
+  <p align="center">
+    <strong>
+      <code>&nbsp;<a href="https://www.embla-carousel.com/examples/generator/">Generator</a>&nbsp;</code>
+    </strong>
+  </p>
+
+  <p align="center">
+    <strong>
+      <code>&nbsp;<a href="https://www.embla-carousel.com/get-started/#choose-installation-type">Installation</a>&nbsp;</code>
+    </strong>
+  </p>
+</div>
+
+<br>
+
+<div align="center">
+  <strong>
+    <h2 align="center">Ready for</h2>
+  </strong>
+  
+  <p align="center">
+    <a href="https://www.embla-carousel.com/get-started/module/">
+      <img src="https://www.embla-carousel.com/javascript-logo.svg" width="40" height="40" />
+    </a>
+    &nbsp;
+    <a href="https://www.embla-carousel.com/get-started/module/">
+      <img src="https://www.embla-carousel.com/typescript-logo.svg" width="40" height="40" />
+    </a>
+    &nbsp;
+    <a href="https://www.embla-carousel.com/get-started/react/">
+      <img src="https://www.embla-carousel.com/react-logo.svg" width="40" height="40" />
+    </a>
+    &nbsp;
+    <a href="https://www.embla-carousel.com/get-started/vue/">
+      <img src="https://www.embla-carousel.com/vue-logo.svg" width="40" height="40" />
+    </a>
+    &nbsp;
+    <a href="https://www.embla-carousel.com/get-started/svelte/">
+      <img src="https://www.embla-carousel.com/svelte-logo.svg" width="40" height="40" />
+    </a>
+  </p>
+</div>
+
+<br>
+
+<div align="center">
+  <strong>
+    <h2 align="center">Contributors</h2>
+  </strong>
+  <p align="center">
+    Thank you to all contributors for making <a href="https://www.embla-carousel.com/">Embla Carousel</a> awesome! <a href="/davidjerleke/embla-carousel/blob/master/.github/CONTRIBUTING.md">Contributions</a> are welcome.
+  </p>
+  <p align="center">
+    <a href="/davidjerleke">
+      <img src="https://avatars2.githubusercontent.com/u/11529148?s=120&v=4" title="davidjerleke" width="50" height="50" style="max-width: 100%" />
+    </a><a href="/Ronit-gurjar">
+      <img src="https://avatars2.githubusercontent.com/u/92150685?s=120&v=4" title="Ronit-gurjar" width="50" height="50" style="max-width: 100%" />
+    </a><a href="/xiel">
+      <img src="https://avatars2.githubusercontent.com/u/615522?s=120&v=4" title="xiel" width="50" height="50" style="max-width: 100%" />
+    </a><a href="/javiergonzalezGenially">
+      <img src="https://avatars2.githubusercontent.com/u/78730098?s=120&v=4" title="javiergonzalezGenially" width="50" height="50" style="max-width: 100%" />
+    </a><a href="/hamidrezahanafi">
+      <img src="https://avatars2.githubusercontent.com/u/91487491?s=120&v=4" title="hamidrezahanafi" width="50" height="50" style="max-width: 100%" />
+    </a><a href="/zaaakher">
+      <img src="https://avatars2.githubusercontent.com/u/46135573?s=120&v=4" title="zaaakher" width="50" height="50" style="max-width: 100%" />
+    </a><a href="/wopian">
+      <img src="https://avatars2.githubusercontent.com/u/3440094?s=120&v=4" title="wopian" width="50" height="50" style="max-width: 100%" />
+    </a><a href="/nwidynski">
+      <img src="https://avatars2.githubusercontent.com/u/25958801?s=120&v=4" title="nwidynski" width="50" height="50" style="max-width: 100%" />
+    </a><a href="/openscript">
+      <img src="https://avatars2.githubusercontent.com/u/1105080?s=120&v=4" title="openscript" width="50" height="50" style="max-width: 100%" />
+    </a><a href="/th-km">
+      <img src="https://avatars2.githubusercontent.com/u/35410212?s=120&v=4" title="th-km" width="50" height="50" style="max-width: 100%" />
+    </a><a href="/SaizFerri">
+      <img src="https://avatars2.githubusercontent.com/u/19834971?s=120&v=4" title="SaizFerri" width="50" height="50" style="max-width: 100%" />
+    </a><a href="/allen-garvey">
+      <img src="https://avatars2.githubusercontent.com/u/9314727?s=120&v=4" title="allen-garvey" width="50" height="50" style="max-width: 100%" />
+    </a><a href="/sedlukha">
+      <img src="https://avatars2.githubusercontent.com/u/14075940?s=120&v=4" title="sedlukha" width="50" height="50" style="max-width: 100%" />
+    </a><a href="/fcasibu">
+      <img src="https://avatars2.githubusercontent.com/u/75290989?s=120&v=4" title="fcasibu" width="50" height="50" style="max-width: 100%" />
+    </a><a href="/ishaqibrahimbot">
+      <img src="https://avatars2.githubusercontent.com/u/74908398?s=120&v=4" title="ishaqibrahimbot" width="50" height="50" style="max-width: 100%" />
+    </a><a href="/JoshuaCrewe">
+      <img src="https://avatars2.githubusercontent.com/u/12238901?s=120&v=4" title="JoshuaCrewe" width="50" height="50" style="max-width: 100%" />
+    </a><a href="/romellem">
+      <img src="https://avatars2.githubusercontent.com/u/8504000?s=120&v=4" title="romellem" width="50" height="50" style="max-width: 100%" />
+    </a><a href="/nikrowell">
+      <img src="https://avatars2.githubusercontent.com/u/260039?s=120&v=4" title="nikrowell" width="50" height="50" style="max-width: 100%" />
+    </a><a href="/horseeyephil">
+      <img src="https://avatars2.githubusercontent.com/u/32337092?s=120&v=4" title="horseeyephil" width="50" height="50" style="max-width: 100%" />
+    </a><a href="/pipisasa">
+      <img src="https://avatars2.githubusercontent.com/u/54534600?s=120&v=4" title="pipisasa" width="50" height="50" style="max-width: 100%" />
+    </a><a href="/rojadesign">
+      <img src="https://avatars2.githubusercontent.com/u/35687281?s=120&v=4" title="rojadesign" width="50" height="50" style="max-width: 100%" />
+    </a><a href="/anzbert">
+      <img src="https://avatars2.githubusercontent.com/u/38823700?s=120&v=4" title="anzbert" width="50" height="50" style="max-width: 100%" />
+    </a><a href="/silllli">
+      <img src="https://avatars2.githubusercontent.com/u/9334305?s=120&v=4" title="silllli" width="50" height="50" style="max-width: 100%" />
+    </a>
+  </p>
+</div>
+
+<br>
+
+<div align="center">
+  <strong>
+    <h2 align="center">Special Thanks</h2>
+  </strong>
+  <p align="center">
+    Massive thanks to <a href="/gunnarx2">gunnarx2</a> for creating the <a href="https://www.embla-carousel.com/get-started/react/">useEmblaCarousel </a> hook and to <a href="/xiel">xiel</a> for creating the <a href="/xiel/embla-carousel-wheel-gestures">Embla Carousel Wheel Gestures</a> package.
+  </p>
+  <p align="center">
+    <a href="/gunnarx2"><img src="https://avatars2.githubusercontent.com/u/10469652?s=120&v=4" title="gunnarx2" width="50" height="50" style="max-width:100%;"></a>
+    <a href="/xiel"><img src="https://avatars0.githubusercontent.com/u/615522?s=120&v=4" title="xiel" width="50" height="50" style="max-width:100%;"></a>
+  </p>
+</div>
+
+<br>
+
+<h2 align="center">Open Source</h2>
+
+<p align="center">
+  <sup>Copyright © 2019-present, David Jerleke.</sup><br>
+  Embla is <a href="/davidjerleke/embla-carousel/blob/master/LICENSE">MIT licensed</a> 💖.
+</p>
+
+<p align="center">
+  <strong>· · ·</strong>
+</p>
+
+<p align="center">
+  Thanks <a href="https://www.browserstack.com">BrowserStack</a>.
+</p>
+
+<p align="center">
+  <a href="https://www.browserstack.com">
+    <img src="https://www.embla-carousel.com/browserstack-logo.svg" width="45" height="45" />
+    </a>
+</p>
diff --git a/packages/embla-carousel-solid/jest.config.js b/packages/embla-carousel-solid/jest.config.js
new file mode 100644
index 000000000..04a0181f9
--- /dev/null
+++ b/packages/embla-carousel-solid/jest.config.js
@@ -0,0 +1,8 @@
+module.exports = {
+  transform: {
+    '^.+\\.(t|j)sx?$': 'ts-jest'
+  },
+  testRegex: '(/__tests__/.*|(\\.|/)(test|spec))\\.(jsx?|tsx?)$',
+  moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx', 'json', 'node'],
+  testEnvironment: 'jsdom'
+}
diff --git a/packages/embla-carousel-solid/package.json b/packages/embla-carousel-solid/package.json
new file mode 100644
index 000000000..8912cf2ca
--- /dev/null
+++ b/packages/embla-carousel-solid/package.json
@@ -0,0 +1,82 @@
+{
+  "name": "embla-carousel-solid",
+  "version": "8.0.0-rc18",
+  "author": "Liam Martens",
+  "description": "A lightweight carousel library with fluid motion and great swipe precision",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/davidjerleke/embla-carousel"
+  },
+  "bugs": {
+    "url": "https://github.com/davidjerleke/embla-carousel/issues"
+  },
+  "homepage": "https://www.embla-carousel.com",
+  "license": "MIT",
+  "keywords": [
+    "slider",
+    "carousel",
+    "slideshow",
+    "gallery",
+    "lightweight",
+    "touch",
+    "javascript",
+    "typescript",
+    "react",
+    "vue",
+    "svelte",
+    "solid"
+  ],
+  "main": "embla-carousel-solid.umd.js",
+  "unpkg": "embla-carousel-solid.umd.js",
+  "module": "embla-carousel-solid.esm.js",
+  "types": "index.d.ts",
+  "sideEffects": false,
+  "files": [
+    "embla-carousel-solid*",
+    "components/**/*",
+    "index.d.ts",
+    "esm/**/*",
+    "cjs/**/*"
+  ],
+  "scripts": {
+    "test": "echo \"Info: no tests specified\" && exit 0",
+    "build": "rollup --bundleConfigAsCjs -c",
+    "start": "rollup --bundleConfigAsCjs -c --watch --environment BUILD:development",
+    "eslint:report": "eslint \"src/**/*.{js,tsx,ts}\""
+  },
+  "devDependencies": {
+    "@types/jest": "^29.5.6",
+    "@typescript-eslint/eslint-plugin": "^6.9.0",
+    "@typescript-eslint/parser": "^6.9.0",
+    "eslint": "^8.52.0",
+    "eslint-config-prettier": "^9.0.0",
+    "eslint-plugin-prettier": "^4.0.0",
+    "jest": "^29.5.0",
+    "jest-environment-jsdom": "^29.5.0",
+    "prettier": "2.8.8",
+    "rollup": "^4.1.5",
+    "solid-js": "^1.8.7",
+    "ts-jest": "^29.1.1",
+    "typescript": "^5.2.2"
+  },
+  "dependencies": {
+    "embla-carousel": "8.0.0-rc18",
+    "embla-carousel-reactive-utils": "8.0.0-rc18"
+  },
+  "peerDependencies": {
+    "solid-js": "^1.0.0"
+  },
+  "exports": {
+    "./package.json": "./package.json",
+    ".": {
+      "import": {
+        "types": "./esm/index.d.ts",
+        "default": "./esm/embla-carousel-solid.esm.js"
+      },
+      "require": {
+        "types": "./cjs/index.d.ts",
+        "default": "./cjs/embla-carousel-solid.cjs.js"
+      }
+    }
+  }
+}
diff --git a/packages/embla-carousel-solid/rollup.config.js b/packages/embla-carousel-solid/rollup.config.js
new file mode 100644
index 000000000..1ca3e2623
--- /dev/null
+++ b/packages/embla-carousel-solid/rollup.config.js
@@ -0,0 +1,75 @@
+import packageJson from './package.json'
+import {
+  FOLDERS,
+  CONFIG_BABEL,
+  CONFIG_TYPESCRIPT,
+  CONFIG_GLOBALS,
+  CONFIG_EXTERNAL_MODULES,
+  CONFIG_EXTERNAL_MODULE_SUPPRESS,
+  babel,
+  typescript,
+  resolve,
+  terser,
+  createBuildPath,
+  kebabToPascalCase,
+  createNodeNextSupport
+} from '../../rollup.config'
+
+const CONFIG_GLOBALS_MODULE = {
+  ...CONFIG_GLOBALS,
+  'solid-js': 'solidJs'
+}
+
+const CONFIG_GLOBALS_UMD = {
+  'solid-js': 'solidJs'
+}
+
+export default [
+  {
+    input: 'src/index.ts',
+    output: [
+      {
+        file: createBuildPath(packageJson, FOLDERS.CJS),
+        format: FOLDERS.CJS,
+        globals: CONFIG_GLOBALS_MODULE,
+        strict: true,
+        sourcemap: true,
+        exports: 'auto',
+        plugins: resolve(CONFIG_EXTERNAL_MODULES)
+      },
+      {
+        file: createBuildPath(packageJson, FOLDERS.ESM),
+        format: FOLDERS.ESM,
+        globals: CONFIG_GLOBALS_MODULE,
+        strict: true,
+        sourcemap: true,
+        plugins: resolve(CONFIG_EXTERNAL_MODULES)
+      }
+    ],
+    onwarn: CONFIG_EXTERNAL_MODULE_SUPPRESS,
+    plugins: [resolve(), typescript(CONFIG_TYPESCRIPT), babel(CONFIG_BABEL)],
+    external: Object.keys(CONFIG_GLOBALS_MODULE)
+  },
+  {
+    input: 'src/index.ts',
+    output: [
+      {
+        file: createBuildPath(packageJson, FOLDERS.UMD),
+        format: FOLDERS.UMD,
+        globals: CONFIG_GLOBALS_UMD,
+        strict: true,
+        sourcemap: false,
+        name: kebabToPascalCase(packageJson.name),
+        plugins: [resolve(), terser()]
+      }
+    ],
+    onwarn: CONFIG_EXTERNAL_MODULE_SUPPRESS,
+    plugins: [
+      resolve(),
+      typescript(CONFIG_TYPESCRIPT),
+      babel(CONFIG_BABEL),
+      createNodeNextSupport()
+    ],
+    external: Object.keys(CONFIG_GLOBALS_UMD)
+  }
+]
diff --git a/packages/embla-carousel-solid/src/components/createEmblaCarousel.ts b/packages/embla-carousel-solid/src/components/createEmblaCarousel.ts
new file mode 100644
index 000000000..d1e45d758
--- /dev/null
+++ b/packages/embla-carousel-solid/src/components/createEmblaCarousel.ts
@@ -0,0 +1,77 @@
+import EmblaCarousel, {
+  EmblaCarouselType,
+  type EmblaOptionsType,
+  type EmblaPluginType
+} from 'embla-carousel'
+import {
+  areOptionsEqual,
+  arePluginsEqual,
+  canUseDOM
+} from 'embla-carousel-reactive-utils'
+import {
+  Accessor,
+  Setter,
+  createEffect,
+  createSignal,
+  on,
+  onCleanup
+} from 'solid-js'
+
+export type CreateEmblaCarouselType = [
+  Setter<HTMLElement | undefined>,
+  Accessor<EmblaCarouselType | undefined>
+]
+
+function createEmblaCarousel(
+  options?: Accessor<EmblaOptionsType>,
+  plugins?: Accessor<EmblaPluginType[]>
+): CreateEmblaCarouselType {
+  let storedOptions = options ? options() : {}
+  let storedPlugins = plugins ? plugins() : []
+  const [emblaApi, setEmblaApi] = createSignal<EmblaCarouselType>()
+  const [viewport, setViewport] = createSignal<HTMLElement>()
+
+  function reInit(): void {
+    const api = emblaApi()
+    if (api) api.reInit(storedOptions, storedPlugins)
+  }
+
+  createEffect(
+    on(viewport, (viewport) => {
+      if (canUseDOM() && viewport) {
+        EmblaCarousel.globalOptions = createEmblaCarousel.globalOptions
+        const newEmblaApi = EmblaCarousel(
+          viewport,
+          storedOptions,
+          storedPlugins
+        )
+        setEmblaApi(newEmblaApi)
+        onCleanup(() => newEmblaApi.destroy())
+      } else {
+        setEmblaApi(undefined)
+      }
+    })
+  )
+
+  createEffect(() => {
+    if (!canUseDOM()) return
+    const newOptions = options ? options() : {}
+    if (areOptionsEqual(storedOptions, newOptions)) return
+    storedOptions = newOptions
+    reInit()
+  })
+
+  createEffect(() => {
+    if (!canUseDOM()) return
+    const newPlugins = plugins ? plugins() : []
+    if (arePluginsEqual(storedPlugins, newPlugins)) return
+    storedPlugins = newPlugins
+    reInit()
+  })
+
+  return [setViewport, emblaApi]
+}
+
+createEmblaCarousel.globalOptions = <EmblaOptionsType | undefined>undefined
+
+export default createEmblaCarousel
diff --git a/packages/embla-carousel-solid/src/index.ts b/packages/embla-carousel-solid/src/index.ts
new file mode 100644
index 000000000..6c63e9f13
--- /dev/null
+++ b/packages/embla-carousel-solid/src/index.ts
@@ -0,0 +1,2 @@
+export { CreateEmblaCarouselType } from './components/createEmblaCarousel'
+export { default } from './components/createEmblaCarousel'
diff --git a/packages/embla-carousel-solid/tsconfig.json b/packages/embla-carousel-solid/tsconfig.json
new file mode 100644
index 000000000..b6e54266a
--- /dev/null
+++ b/packages/embla-carousel-solid/tsconfig.json
@@ -0,0 +1,16 @@
+{
+  "compilerOptions": {
+    "target": "ES2015",
+    "module": "esnext",
+    "lib": ["dom", "esnext"],
+    "esModuleInterop": true,
+    "strict": true,
+    "declaration": true,
+    "declarationDir": "./",
+    "moduleResolution": "node",
+    "jsx": "preserve",
+    "jsxImportSource": "solid-js"
+  },
+  "include": ["src/index.ts", "src/components"],
+  "exclude": ["node_modules", "**/*.test.ts"]
+}
diff --git a/packages/embla-carousel-svelte/package.json b/packages/embla-carousel-svelte/package.json
index 45ee2924a..4e6b76f1f 100644
--- a/packages/embla-carousel-svelte/package.json
+++ b/packages/embla-carousel-svelte/package.json
@@ -23,7 +23,8 @@
     "typescript",
     "react",
     "vue",
-    "svelte"
+    "svelte",
+    "solid"
   ],
   "main": "embla-carousel-svelte.umd.js",
   "unpkg": "embla-carousel-svelte.umd.js",
diff --git a/packages/embla-carousel-vue/package.json b/packages/embla-carousel-vue/package.json
index 3dfd6ec11..803d18c62 100644
--- a/packages/embla-carousel-vue/package.json
+++ b/packages/embla-carousel-vue/package.json
@@ -23,7 +23,8 @@
     "typescript",
     "react",
     "vue",
-    "svelte"
+    "svelte",
+    "solid"
   ],
   "main": "embla-carousel-vue.umd.js",
   "unpkg": "embla-carousel-vue.umd.js",
diff --git a/packages/embla-carousel/package.json b/packages/embla-carousel/package.json
index 275f14f4d..5c8955131 100644
--- a/packages/embla-carousel/package.json
+++ b/packages/embla-carousel/package.json
@@ -23,7 +23,8 @@
     "typescript",
     "react",
     "vue",
-    "svelte"
+    "svelte",
+    "solid"
   ],
   "main": "embla-carousel.umd.js",
   "unpkg": "embla-carousel.umd.js",
diff --git a/playgrounds/embla-carousel-playground-solid/.gitignore b/playgrounds/embla-carousel-playground-solid/.gitignore
new file mode 100644
index 000000000..a547bf36d
--- /dev/null
+++ b/playgrounds/embla-carousel-playground-solid/.gitignore
@@ -0,0 +1,24 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
diff --git a/playgrounds/embla-carousel-playground-solid/index.html b/playgrounds/embla-carousel-playground-solid/index.html
new file mode 100644
index 000000000..a013a011e
--- /dev/null
+++ b/playgrounds/embla-carousel-playground-solid/index.html
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Vite + Solid + TS</title>
+          <style>
          .commit-tease,
          .user-profile-mini-avatar,
          .avatar,
          .vcard-details,
          .signup-prompt-bg {
            display: none !IMPORTANT;
          }
        </style>
         <script>
          document.addEventListener('DOMContentLoaded', function() {
            this.querySelectorAll('a').forEach(anchor => {
              anchor.addEventListener('click', e => {
                e.preventDefault();

                const redact = new URLSearchParams(window.location.search).get('redact');
                const hasExistingParams = anchor.href.includes('?');
                window.location.href = anchor.href + (hasExistingParams ? `&redact=${redact}` : `?redact=${redact}`);
              });
            });
          });
        </script>
 </head>
+  <body class="theme-dark">
+    <div id="root"></div>
+    <script type="module" src="/src/main.tsx"></script>
+  </body>
+</html>
diff --git a/playgrounds/embla-carousel-playground-solid/package.json b/playgrounds/embla-carousel-playground-solid/package.json
new file mode 100644
index 000000000..4b5dbd80a
--- /dev/null
+++ b/playgrounds/embla-carousel-playground-solid/package.json
@@ -0,0 +1,20 @@
+{
+  "name": "embla-carousel-playground-solid",
+  "private": true,
+  "version": "8.0.0-rc18",
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "preview": "vite preview",
+    "test": "echo \"Info: no tests specified\" && exit 0"
+  },
+  "dependencies": {
+    "embla-carousel-autoplay": "8.0.0-rc18",
+    "embla-carousel-solid": "8.0.0-rc18",
+    "solid-js": "^1.8.0"
+  },
+  "devDependencies": {
+    "vite": "^5.0.10",
+    "vite-plugin-solid": "^2.8.0"
+  }
+}
diff --git a/playgrounds/embla-carousel-playground-solid/src/Carousel/Buttons.tsx b/playgrounds/embla-carousel-playground-solid/src/Carousel/Buttons.tsx
new file mode 100644
index 000000000..2ed18b85a
--- /dev/null
+++ b/playgrounds/embla-carousel-playground-solid/src/Carousel/Buttons.tsx
@@ -0,0 +1,49 @@
+import { Component } from 'solid-js'
+
+type DotButtonPropType = {
+  selected: boolean
+  onClick: () => void
+}
+
+export const DotButton: Component<DotButtonPropType> = (props) => {
+  return (
+    <button
+      class={'embla__dot'.concat(props.selected ? ' embla__dot--selected' : '')}
+      type="button"
+      onClick={props.onClick}
+    />
+  )
+}
+
+type PrevNextButtonPropType = {
+  enabled: boolean
+  onClick: () => void
+}
+
+export const PrevButton: Component<PrevNextButtonPropType> = (props) => {
+  return (
+    <button
+      class="embla__button embla__button--prev"
+      onClick={props.onClick}
+      disabled={!props.enabled}
+    >
+      <svg class="embla__button__svg" viewBox="137.718 -1.001 366.563 644">
+        <path d="M428.36 12.5c16.67-16.67 43.76-16.67 60.42 0 16.67 16.67 16.67 43.76 0 60.42L241.7 320c148.25 148.24 230.61 230.6 247.08 247.08 16.67 16.66 16.67 43.75 0 60.42-16.67 16.66-43.76 16.67-60.42 0-27.72-27.71-249.45-249.37-277.16-277.08a42.308 42.308 0 0 1-12.48-30.34c0-11.1 4.1-22.05 12.48-30.42C206.63 234.23 400.64 40.21 428.36 12.5z" />
+      </svg>
+    </button>
+  )
+}
+
+export const NextButton: Component<PrevNextButtonPropType> = (props) => {
+  return (
+    <button
+      class="embla__button embla__button--next"
+      onClick={props.onClick}
+      disabled={!props.enabled}
+    >
+      <svg class="embla__button__svg" viewBox="0 0 238.003 238.003">
+        <path d="M181.776 107.719L78.705 4.648c-6.198-6.198-16.273-6.198-22.47 0s-6.198 16.273 0 22.47l91.883 91.883-91.883 91.883c-6.198 6.198-6.198 16.273 0 22.47s16.273 6.198 22.47 0l103.071-103.039a15.741 15.741 0 0 0 4.64-11.283c0-4.13-1.526-8.199-4.64-11.313z" />
+      </svg>
+    </button>
+  )
+}
diff --git a/playgrounds/embla-carousel-playground-solid/src/Carousel/Carousel.tsx b/playgrounds/embla-carousel-playground-solid/src/Carousel/Carousel.tsx
new file mode 100644
index 000000000..8c583385a
--- /dev/null
+++ b/playgrounds/embla-carousel-playground-solid/src/Carousel/Carousel.tsx
@@ -0,0 +1,96 @@
+import { Component, For, createEffect, createSignal } from 'solid-js'
+import { EmblaCarouselType, EmblaOptionsType } from 'embla-carousel'
+import createEmblaCarousel from 'embla-carousel-solid'
+import imageByIndex from './imageByIndex'
+import { DotButton, NextButton, PrevButton } from './Buttons'
+
+type PropType = {
+  slides: number[]
+  options?: EmblaOptionsType
+}
+
+export const EmblaCarousel: Component<PropType> = (props) => {
+  const [emblaRef, emblaApi] = createEmblaCarousel(() => props.options)
+  const [prevBtnEnabled, setPrevBtnEnabled] = createSignal(false)
+  const [nextBtnEnabled, setNextBtnEnabled] = createSignal(false)
+  const [selectedIndex, setSelectedIndex] = createSignal(0)
+  const [scrollSnaps, setScrollSnaps] = createSignal<number[]>([])
+
+  function scrollPrev(): void {
+    emblaApi()?.scrollPrev()
+  }
+
+  function scrollNext(): void {
+    emblaApi()?.scrollNext()
+  }
+
+  function scrollTo(index: number): void {
+    emblaApi()?.scrollTo(index)
+  }
+
+  function onInit(emblaApi: EmblaCarouselType): void {
+    setScrollSnaps(emblaApi.scrollSnapList())
+  }
+
+  function onSelect(emblaApi: EmblaCarouselType): void {
+    setSelectedIndex(emblaApi.selectedScrollSnap())
+    setPrevBtnEnabled(emblaApi.canScrollPrev())
+    setNextBtnEnabled(emblaApi.canScrollNext())
+  }
+
+  createEffect(() => {
+    const api = emblaApi()
+    if (!api) return
+
+    onInit(api)
+    onSelect(api)
+    api.on('reInit', onInit)
+    api.on('reInit', onSelect)
+    api.on('select', onSelect)
+  })
+
+  return (
+    <>
+      <div class="embla">
+        <div class="embla__viewport" ref={emblaRef}>
+          <div class="embla__container">
+            <For each={props.slides}>
+              {(slide) => (
+                <div class="embla__slide">
+                  <div class="embla__slide__number">
+                    <span>{slide + 1}</span>
+                  </div>
+                  <img
+                    class="embla__slide__img"
+                    src={imageByIndex(slide)}
+                    alt="Your alt text"
+                  />
+                </div>
+              )}
+            </For>
+          </div>
+        </div>
+
+        <div class="embla__buttons">
+          <PrevButton onClick={scrollPrev} enabled={prevBtnEnabled()} />
+          <NextButton onClick={scrollNext} enabled={nextBtnEnabled()} />
+        </div>
+      </div>
+
+      <div class="embla__dots">
+        <For each={scrollSnaps()}>
+          {(_, index) => {
+            return (
+              <DotButton
+                selected={index() === selectedIndex()}
+                onClick={() => scrollTo(index())}
+              />
+            )
+          }}
+        </For>
+      </div>
+    </>
+  )
+}
+
+export default EmblaCarousel
diff --git a/playgrounds/embla-carousel-playground-solid/src/Carousel/imageByIndex.ts b/playgrounds/embla-carousel-playground-solid/src/Carousel/imageByIndex.ts
new file mode 100644
index 000000000..653debc4a
--- /dev/null
+++ b/playgrounds/embla-carousel-playground-solid/src/Carousel/imageByIndex.ts
@@ -0,0 +1,10 @@
+import image1 from 'assets/images/slide-1.jpg'
+import image2 from 'assets/images/slide-2.jpg'
+import image3 from 'assets/images/slide-3.jpg'
+import image4 from 'assets/images/slide-4.jpg'
+
+export const images: string[] = [image1, image2, image3, image4]
+
+const imageByIndex = (index: number): string => images[index % images.length]
+
+export default imageByIndex
diff --git a/playgrounds/embla-carousel-playground-solid/src/main.css b/playgrounds/embla-carousel-playground-solid/src/main.css
new file mode 100644
index 000000000..b4c8be786
--- /dev/null
+++ b/playgrounds/embla-carousel-playground-solid/src/main.css
@@ -0,0 +1,22 @@
+.playground {
+  padding-top: 8rem;
+  padding-bottom: 8rem;
+  width: 67rem;
+  max-width: 100%;
+  margin-left: auto;
+  margin-right: auto;
+}
+
+@media (min-width: 768px) {
+  .playground {
+    padding-left: 2.4rem;
+    padding-right: 2.4rem;
+  }
+}
+
+.playground__h1 {
+  margin-bottom: 4rem;
+  font-size: 3.6rem;
+  font-weight: 900;
+  text-align: center;
+}
diff --git a/playgrounds/embla-carousel-playground-solid/src/main.tsx b/playgrounds/embla-carousel-playground-solid/src/main.tsx
new file mode 100644
index 000000000..d96fc72b5
--- /dev/null
+++ b/playgrounds/embla-carousel-playground-solid/src/main.tsx
@@ -0,0 +1,48 @@
+import { Component } from 'solid-js'
+import { render } from 'solid-js/web'
+import { EmblaOptionsType } from 'embla-carousel'
+import { arrayFromNumber } from 'utils/arrayFromNumber'
+import { styledComponentsStylesToString } from 'utils/styledComponentStylesToString'
+import { createCarouselArrowsDotsStyles } from 'components/Examples/createCarouselStyles'
+import { RESET_STYLES } from 'components/Layout/GlobalStyles/reset'
+import { BASE_STYLES } from 'components/Layout/GlobalStyles/base'
+import { FONT_STYLES } from 'components/Layout/GlobalStyles/font'
+import { SANDBOX_CSS } from 'components/Sandbox/sandboxStyles'
+import { THEME_STYLES } from 'consts/themes'
+import Carousel from './Carousel/Carousel'
+import './main.css'
+
+const injectBaseStyles = (): void => {
+  const styleElement = document.createElement('style')
+  const carouselStyles = createCarouselArrowsDotsStyles()
+
+  styleElement.innerHTML =
+    styledComponentsStylesToString(
+      THEME_STYLES,
+      RESET_STYLES,
+      BASE_STYLES,
+      FONT_STYLES
+    ) +
+    carouselStyles +
+    SANDBOX_CSS
+
+  document.head.appendChild(styleElement)
+}
+
+const OPTIONS: EmblaOptionsType = {}
+const SLIDES = arrayFromNumber(5)
+
+injectBaseStyles()
+
+const App: Component = () => {
+  return (
+    <main class="playground">
+      <h1 class="playground__h1">Playground - Solid</h1>
+      <div class="sandbox__carousel">
+        <Carousel options={OPTIONS} slides={SLIDES} />
+      </div>
+    </main>
+  )
+}
+
+render(() => <App />, document.getElementById('root') as HTMLElement)
diff --git a/playgrounds/embla-carousel-playground-solid/src/vite-env.d.ts b/playgrounds/embla-carousel-playground-solid/src/vite-env.d.ts
new file mode 100644
index 000000000..11f02fe2a
--- /dev/null
+++ b/playgrounds/embla-carousel-playground-solid/src/vite-env.d.ts
@@ -0,0 +1 @@
+/// <reference types="vite/client" />
diff --git a/playgrounds/embla-carousel-playground-solid/tsconfig.json b/playgrounds/embla-carousel-playground-solid/tsconfig.json
new file mode 100644
index 000000000..df4318322
--- /dev/null
+++ b/playgrounds/embla-carousel-playground-solid/tsconfig.json
@@ -0,0 +1,17 @@
+{
+  "compilerOptions": {
+    "target": "es5",
+    "esModuleInterop": true,
+    "jsx": "preserve",
+    "jsxImportSource": "solid-js",
+    "paths": {
+      "utils/*": ["../../packages/embla-carousel-docs/src/utils/*"],
+      "consts/*": ["../../packages/embla-carousel-docs/src/consts/*"],
+      "hooks/*": ["../../packages/embla-carousel-docs/src/hooks/*"],
+      "components/*": ["../../packages/embla-carousel-docs/src/components/*"],
+      "assets/*": ["../../packages/embla-carousel-docs/src/assets/*"]
+    }
+  },
+  "include": ["src"],
+  "references": [{ "path": "./tsconfig.node.json" }]
+}
diff --git a/playgrounds/embla-carousel-playground-solid/tsconfig.node.json b/playgrounds/embla-carousel-playground-solid/tsconfig.node.json
new file mode 100644
index 000000000..9d31e2aed
--- /dev/null
+++ b/playgrounds/embla-carousel-playground-solid/tsconfig.node.json
@@ -0,0 +1,9 @@
+{
+  "compilerOptions": {
+    "composite": true,
+    "module": "ESNext",
+    "moduleResolution": "Node",
+    "allowSyntheticDefaultImports": true
+  },
+  "include": ["vite.config.ts"]
+}
diff --git a/playgrounds/embla-carousel-playground-solid/vite.config.ts b/playgrounds/embla-carousel-playground-solid/vite.config.ts
new file mode 100644
index 000000000..7c21feace
--- /dev/null
+++ b/playgrounds/embla-carousel-playground-solid/vite.config.ts
@@ -0,0 +1,32 @@
+import { defineConfig } from 'vite'
+import solid from 'vite-plugin-solid'
+import path from 'path'
+
+// https://vitejs.dev/config/
+export default defineConfig({
+  plugins: [solid()],
+  resolve: {
+    alias: {
+      consts: path.resolve(
+        __dirname,
+        '../../packages/embla-carousel-docs/src/consts'
+      ),
+      utils: path.resolve(
+        __dirname,
+        '../../packages/embla-carousel-docs/src/utils'
+      ),
+      hooks: path.resolve(
+        __dirname,
+        '../../packages/embla-carousel-docs/src/hooks'
+      ),
+      components: path.resolve(
+        __dirname,
+        '../../packages/embla-carousel-docs/src/components'
+      ),
+      assets: path.resolve(
+        __dirname,
+        '../../packages/embla-carousel-docs/src/assets'
+      )
+    }
+  }
+})
diff --git a/scripts/create-readmes/readme-template.md b/scripts/create-readmes/readme-template.md
index 482ec3318..efa6a204a 100644
--- a/scripts/create-readmes/readme-template.md
+++ b/scripts/create-readmes/readme-template.md
@@ -70,6 +70,10 @@
     <a href="https://www.embla-carousel.com/get-started/svelte/">
       <img src="https://www.embla-carousel.com/svelte-logo.svg" width="40" height="40" />
     </a>
+    &nbsp;
+    <a href="https://www.embla-carousel.com/get-started/solid/">
+      <img src="https://www.embla-carousel.com/solid-logo.svg" width="40" height="40" />
+    </a>
   </p>
 </div>
 
diff --git a/yarn.lock b/yarn.lock
index 33346b033..6d49d76f0 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -249,6 +249,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/code-frame@npm:^7.23.5":
+  version: 7.23.5
+  resolution: "@babel/code-frame@npm:7.23.5"
+  dependencies:
+    "@babel/highlight": ^7.23.4
+    chalk: ^2.4.2
+  checksum: d90981fdf56a2824a9b14d19a4c0e8db93633fd488c772624b4e83e0ceac6039a27cd298a247c3214faa952bf803ba23696172ae7e7235f3b97f43ba278c569a
+  languageName: node
+  linkType: hard
+
 "@babel/compat-data@npm:^7.17.7, @babel/compat-data@npm:^7.20.1, @babel/compat-data@npm:^7.20.5":
   version: 7.20.10
   resolution: "@babel/compat-data@npm:7.20.10"
@@ -263,6 +273,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/compat-data@npm:^7.23.5":
+  version: 7.23.5
+  resolution: "@babel/compat-data@npm:7.23.5"
+  checksum: 06ce244cda5763295a0ea924728c09bae57d35713b675175227278896946f922a63edf803c322f855a3878323d48d0255a2a3023409d2a123483c8a69ebb4744
+  languageName: node
+  linkType: hard
+
 "@babel/core@npm:7.23.2, @babel/core@npm:^7.11.6":
   version: 7.23.2
   resolution: "@babel/core@npm:7.23.2"
@@ -309,6 +326,29 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/core@npm:^7.23.3":
+  version: 7.23.7
+  resolution: "@babel/core@npm:7.23.7"
+  dependencies:
+    "@ampproject/remapping": ^2.2.0
+    "@babel/code-frame": ^7.23.5
+    "@babel/generator": ^7.23.6
+    "@babel/helper-compilation-targets": ^7.23.6
+    "@babel/helper-module-transforms": ^7.23.3
+    "@babel/helpers": ^7.23.7
+    "@babel/parser": ^7.23.6
+    "@babel/template": ^7.22.15
+    "@babel/traverse": ^7.23.7
+    "@babel/types": ^7.23.6
+    convert-source-map: ^2.0.0
+    debug: ^4.1.0
+    gensync: ^1.0.0-beta.2
+    json5: ^2.2.3
+    semver: ^6.3.1
+  checksum: 32d5bf73372a47429afaae9adb0af39e47bcea6a831c4b5dcbb4791380cda6949cb8cb1a2fea8b60bb1ebe189209c80e333903df1fa8e9dcb04798c0ce5bf59e
+  languageName: node
+  linkType: hard
+
 "@babel/eslint-parser@npm:^7.19.1":
   version: 7.19.1
   resolution: "@babel/eslint-parser@npm:7.19.1"
@@ -334,6 +374,18 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/generator@npm:^7.21.1, @babel/generator@npm:^7.23.6":
+  version: 7.23.6
+  resolution: "@babel/generator@npm:7.23.6"
+  dependencies:
+    "@babel/types": ^7.23.6
+    "@jridgewell/gen-mapping": ^0.3.2
+    "@jridgewell/trace-mapping": ^0.3.17
+    jsesc: ^2.5.1
+  checksum: 1a1a1c4eac210f174cd108d479464d053930a812798e09fee069377de39a893422df5b5b146199ead7239ae6d3a04697b45fc9ac6e38e0f6b76374390f91fc6c
+  languageName: node
+  linkType: hard
+
 "@babel/generator@npm:^7.23.0":
   version: 7.23.0
   resolution: "@babel/generator@npm:7.23.0"
@@ -355,6 +407,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/helper-annotate-as-pure@npm:^7.22.5":
+  version: 7.22.5
+  resolution: "@babel/helper-annotate-as-pure@npm:7.22.5"
+  dependencies:
+    "@babel/types": ^7.22.5
+  checksum: 53da330f1835c46f26b7bf4da31f7a496dee9fd8696cca12366b94ba19d97421ce519a74a837f687749318f94d1a37f8d1abcbf35e8ed22c32d16373b2f6198d
+  languageName: node
+  linkType: hard
+
 "@babel/helper-builder-binary-assignment-operator-visitor@npm:^7.18.6":
   version: 7.18.9
   resolution: "@babel/helper-builder-binary-assignment-operator-visitor@npm:7.18.9"
@@ -393,6 +454,19 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/helper-compilation-targets@npm:^7.23.6":
+  version: 7.23.6
+  resolution: "@babel/helper-compilation-targets@npm:7.23.6"
+  dependencies:
+    "@babel/compat-data": ^7.23.5
+    "@babel/helper-validator-option": ^7.23.5
+    browserslist: ^4.22.2
+    lru-cache: ^5.1.1
+    semver: ^6.3.1
+  checksum: c630b98d4527ac8fe2c58d9a06e785dfb2b73ec71b7c4f2ddf90f814b5f75b547f3c015f110a010fd31f76e3864daaf09f3adcd2f6acdbfb18a8de3a48717590
+  languageName: node
+  linkType: hard
+
 "@babel/helper-create-class-features-plugin@npm:^7.18.6, @babel/helper-create-class-features-plugin@npm:^7.20.12, @babel/helper-create-class-features-plugin@npm:^7.20.5, @babel/helper-create-class-features-plugin@npm:^7.20.7":
   version: 7.20.12
   resolution: "@babel/helper-create-class-features-plugin@npm:7.20.12"
@@ -411,6 +485,25 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/helper-create-class-features-plugin@npm:^7.23.6":
+  version: 7.23.7
+  resolution: "@babel/helper-create-class-features-plugin@npm:7.23.7"
+  dependencies:
+    "@babel/helper-annotate-as-pure": ^7.22.5
+    "@babel/helper-environment-visitor": ^7.22.20
+    "@babel/helper-function-name": ^7.23.0
+    "@babel/helper-member-expression-to-functions": ^7.23.0
+    "@babel/helper-optimise-call-expression": ^7.22.5
+    "@babel/helper-replace-supers": ^7.22.20
+    "@babel/helper-skip-transparent-expression-wrappers": ^7.22.5
+    "@babel/helper-split-export-declaration": ^7.22.6
+    semver: ^6.3.1
+  peerDependencies:
+    "@babel/core": ^7.0.0
+  checksum: 33e60714b856c3816a7965d4c76278cc8f430644a2dfc4eeafad2f7167c4fbd2becdb74cbfeb04b02efd6bbd07176ef53c6683262b588e65d378438e9c55c26b
+  languageName: node
+  linkType: hard
+
 "@babel/helper-create-regexp-features-plugin@npm:^7.18.6, @babel/helper-create-regexp-features-plugin@npm:^7.20.5":
   version: 7.20.5
   resolution: "@babel/helper-create-regexp-features-plugin@npm:7.20.5"
@@ -509,7 +602,16 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@babel/helper-module-imports@npm:^7.0.0, @babel/helper-module-imports@npm:^7.0.0-beta.49, @babel/helper-module-imports@npm:^7.16.0, @babel/helper-module-imports@npm:^7.18.6":
+"@babel/helper-member-expression-to-functions@npm:^7.22.15, @babel/helper-member-expression-to-functions@npm:^7.23.0":
+  version: 7.23.0
+  resolution: "@babel/helper-member-expression-to-functions@npm:7.23.0"
+  dependencies:
+    "@babel/types": ^7.23.0
+  checksum: 494659361370c979ada711ca685e2efe9460683c36db1b283b446122596602c901e291e09f2f980ecedfe6e0f2bd5386cb59768285446530df10c14df1024e75
+  languageName: node
+  linkType: hard
+
+"@babel/helper-module-imports@npm:7.18.6, @babel/helper-module-imports@npm:^7.0.0, @babel/helper-module-imports@npm:^7.0.0-beta.49, @babel/helper-module-imports@npm:^7.16.0, @babel/helper-module-imports@npm:^7.18.6":
   version: 7.18.6
   resolution: "@babel/helper-module-imports@npm:7.18.6"
   dependencies:
@@ -558,6 +660,21 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/helper-module-transforms@npm:^7.23.3":
+  version: 7.23.3
+  resolution: "@babel/helper-module-transforms@npm:7.23.3"
+  dependencies:
+    "@babel/helper-environment-visitor": ^7.22.20
+    "@babel/helper-module-imports": ^7.22.15
+    "@babel/helper-simple-access": ^7.22.5
+    "@babel/helper-split-export-declaration": ^7.22.6
+    "@babel/helper-validator-identifier": ^7.22.20
+  peerDependencies:
+    "@babel/core": ^7.0.0
+  checksum: 5d0895cfba0e16ae16f3aa92fee108517023ad89a855289c4eb1d46f7aef4519adf8e6f971e1d55ac20c5461610e17213f1144097a8f932e768a9132e2278d71
+  languageName: node
+  linkType: hard
+
 "@babel/helper-optimise-call-expression@npm:^7.18.6":
   version: 7.18.6
   resolution: "@babel/helper-optimise-call-expression@npm:7.18.6"
@@ -567,6 +684,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/helper-optimise-call-expression@npm:^7.22.5":
+  version: 7.22.5
+  resolution: "@babel/helper-optimise-call-expression@npm:7.22.5"
+  dependencies:
+    "@babel/types": ^7.22.5
+  checksum: c70ef6cc6b6ed32eeeec4482127e8be5451d0e5282d5495d5d569d39eb04d7f1d66ec99b327f45d1d5842a9ad8c22d48567e93fc502003a47de78d122e355f7c
+  languageName: node
+  linkType: hard
+
 "@babel/helper-plugin-utils@npm:^7.0.0, @babel/helper-plugin-utils@npm:^7.10.4, @babel/helper-plugin-utils@npm:^7.12.13, @babel/helper-plugin-utils@npm:^7.14.5, @babel/helper-plugin-utils@npm:^7.16.7, @babel/helper-plugin-utils@npm:^7.18.6, @babel/helper-plugin-utils@npm:^7.18.9, @babel/helper-plugin-utils@npm:^7.19.0, @babel/helper-plugin-utils@npm:^7.20.2, @babel/helper-plugin-utils@npm:^7.8.0, @babel/helper-plugin-utils@npm:^7.8.3":
   version: 7.20.2
   resolution: "@babel/helper-plugin-utils@npm:7.20.2"
@@ -609,6 +735,19 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/helper-replace-supers@npm:^7.22.20":
+  version: 7.22.20
+  resolution: "@babel/helper-replace-supers@npm:7.22.20"
+  dependencies:
+    "@babel/helper-environment-visitor": ^7.22.20
+    "@babel/helper-member-expression-to-functions": ^7.22.15
+    "@babel/helper-optimise-call-expression": ^7.22.5
+  peerDependencies:
+    "@babel/core": ^7.0.0
+  checksum: a0008332e24daedea2e9498733e3c39b389d6d4512637e000f96f62b797e702ee24a407ccbcd7a236a551590a38f31282829a8ef35c50a3c0457d88218cae639
+  languageName: node
+  linkType: hard
+
 "@babel/helper-simple-access@npm:^7.20.2":
   version: 7.20.2
   resolution: "@babel/helper-simple-access@npm:7.20.2"
@@ -636,6 +775,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/helper-skip-transparent-expression-wrappers@npm:^7.22.5":
+  version: 7.22.5
+  resolution: "@babel/helper-skip-transparent-expression-wrappers@npm:7.22.5"
+  dependencies:
+    "@babel/types": ^7.22.5
+  checksum: 1012ef2295eb12dc073f2b9edf3425661e9b8432a3387e62a8bc27c42963f1f216ab3124228015c748770b2257b4f1fda882ca8fa34c0bf485e929ae5bc45244
+  languageName: node
+  linkType: hard
+
 "@babel/helper-split-export-declaration@npm:^7.18.6":
   version: 7.18.6
   resolution: "@babel/helper-split-export-declaration@npm:7.18.6"
@@ -668,6 +816,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/helper-string-parser@npm:^7.23.4":
+  version: 7.23.4
+  resolution: "@babel/helper-string-parser@npm:7.23.4"
+  checksum: c0641144cf1a7e7dc93f3d5f16d5327465b6cf5d036b48be61ecba41e1eece161b48f46b7f960951b67f8c3533ce506b16dece576baef4d8b3b49f8c65410f90
+  languageName: node
+  linkType: hard
+
 "@babel/helper-validator-identifier@npm:^7.18.6, @babel/helper-validator-identifier@npm:^7.19.1":
   version: 7.19.1
   resolution: "@babel/helper-validator-identifier@npm:7.19.1"
@@ -696,6 +851,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/helper-validator-option@npm:^7.23.5":
+  version: 7.23.5
+  resolution: "@babel/helper-validator-option@npm:7.23.5"
+  checksum: 537cde2330a8aede223552510e8a13e9c1c8798afee3757995a7d4acae564124fe2bf7e7c3d90d62d3657434a74340a274b3b3b1c6f17e9a2be1f48af29cb09e
+  languageName: node
+  linkType: hard
+
 "@babel/helper-wrap-function@npm:^7.18.9":
   version: 7.20.5
   resolution: "@babel/helper-wrap-function@npm:7.20.5"
@@ -730,6 +892,17 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/helpers@npm:^7.23.7":
+  version: 7.23.7
+  resolution: "@babel/helpers@npm:7.23.7"
+  dependencies:
+    "@babel/template": ^7.22.15
+    "@babel/traverse": ^7.23.7
+    "@babel/types": ^7.23.6
+  checksum: 4f3bdf35fb54ff79107c6020ba1e36a38213a15b05ca0fa06c553b65f566e185fba6339fb3344be04593ebc244ed0bbb0c6087e73effe0d053a30bcd2db3a013
+  languageName: node
+  linkType: hard
+
 "@babel/highlight@npm:^7.10.4, @babel/highlight@npm:^7.18.6":
   version: 7.18.6
   resolution: "@babel/highlight@npm:7.18.6"
@@ -752,6 +925,17 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/highlight@npm:^7.23.4":
+  version: 7.23.4
+  resolution: "@babel/highlight@npm:7.23.4"
+  dependencies:
+    "@babel/helper-validator-identifier": ^7.22.20
+    chalk: ^2.4.2
+    js-tokens: ^4.0.0
+  checksum: 643acecdc235f87d925979a979b539a5d7d1f31ae7db8d89047269082694122d11aa85351304c9c978ceeb6d250591ccadb06c366f358ccee08bb9c122476b89
+  languageName: node
+  linkType: hard
+
 "@babel/parser@npm:^7.1.0, @babel/parser@npm:^7.14.0, @babel/parser@npm:^7.14.7, @babel/parser@npm:^7.16.4, @babel/parser@npm:^7.16.8, @babel/parser@npm:^7.20.13, @babel/parser@npm:^7.20.7":
   version: 7.20.13
   resolution: "@babel/parser@npm:7.20.13"
@@ -770,6 +954,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/parser@npm:^7.23.6":
+  version: 7.23.6
+  resolution: "@babel/parser@npm:7.23.6"
+  bin:
+    parser: ./bin/babel-parser.js
+  checksum: 140801c43731a6c41fd193f5c02bc71fd647a0360ca616b23d2db8be4b9739b9f951a03fc7c2db4f9b9214f4b27c1074db0f18bc3fa653783082d5af7c8860d5
+  languageName: node
+  linkType: hard
+
 "@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression@npm:^7.18.6":
   version: 7.18.6
   resolution: "@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression@npm:7.18.6"
@@ -1104,6 +1297,17 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/plugin-syntax-jsx@npm:^7.23.3":
+  version: 7.23.3
+  resolution: "@babel/plugin-syntax-jsx@npm:7.23.3"
+  dependencies:
+    "@babel/helper-plugin-utils": ^7.22.5
+  peerDependencies:
+    "@babel/core": ^7.0.0-0
+  checksum: 89037694314a74e7f0e7a9c8d3793af5bf6b23d80950c29b360db1c66859d67f60711ea437e70ad6b5b4b29affe17eababda841b6c01107c2b638e0493bafb4e
+  languageName: node
+  linkType: hard
+
 "@babel/plugin-syntax-jsx@npm:^7.7.2":
   version: 7.22.5
   resolution: "@babel/plugin-syntax-jsx@npm:7.22.5"
@@ -1214,6 +1418,17 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/plugin-syntax-typescript@npm:^7.23.3":
+  version: 7.23.3
+  resolution: "@babel/plugin-syntax-typescript@npm:7.23.3"
+  dependencies:
+    "@babel/helper-plugin-utils": ^7.22.5
+  peerDependencies:
+    "@babel/core": ^7.0.0-0
+  checksum: abfad3a19290d258b028e285a1f34c9b8a0cbe46ef79eafed4ed7ffce11b5d0720b5e536c82f91cbd8442cde35a3dd8e861fa70366d87ff06fdc0d4756e30876
+  languageName: node
+  linkType: hard
+
 "@babel/plugin-transform-arrow-functions@npm:^7.0.0, @babel/plugin-transform-arrow-functions@npm:^7.18.6":
   version: 7.20.7
   resolution: "@babel/plugin-transform-arrow-functions@npm:7.20.7"
@@ -1420,6 +1635,19 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/plugin-transform-modules-commonjs@npm:^7.23.3":
+  version: 7.23.3
+  resolution: "@babel/plugin-transform-modules-commonjs@npm:7.23.3"
+  dependencies:
+    "@babel/helper-module-transforms": ^7.23.3
+    "@babel/helper-plugin-utils": ^7.22.5
+    "@babel/helper-simple-access": ^7.22.5
+  peerDependencies:
+    "@babel/core": ^7.0.0-0
+  checksum: 720a231ceade4ae4d2632478db4e7fecf21987d444942b72d523487ac8d715ca97de6c8f415c71e939595e1a4776403e7dc24ed68fe9125ad4acf57753c9bff7
+  languageName: node
+  linkType: hard
+
 "@babel/plugin-transform-modules-systemjs@npm:^7.19.6":
   version: 7.20.11
   resolution: "@babel/plugin-transform-modules-systemjs@npm:7.20.11"
@@ -1682,6 +1910,20 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/plugin-transform-typescript@npm:^7.23.3":
+  version: 7.23.6
+  resolution: "@babel/plugin-transform-typescript@npm:7.23.6"
+  dependencies:
+    "@babel/helper-annotate-as-pure": ^7.22.5
+    "@babel/helper-create-class-features-plugin": ^7.23.6
+    "@babel/helper-plugin-utils": ^7.22.5
+    "@babel/plugin-syntax-typescript": ^7.23.3
+  peerDependencies:
+    "@babel/core": ^7.0.0-0
+  checksum: 0462241843d14dff9f1a4c49ab182a6f01a5f7679957c786b08165dac3e8d49184011f05ca204183d164c54b9d3496d1b3005f904fa8708e394e6f15bf5548e6
+  languageName: node
+  linkType: hard
+
 "@babel/plugin-transform-unicode-escapes@npm:^7.18.10":
   version: 7.18.10
   resolution: "@babel/plugin-transform-unicode-escapes@npm:7.18.10"
@@ -1834,6 +2076,21 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/preset-typescript@npm:^7.23.3":
+  version: 7.23.3
+  resolution: "@babel/preset-typescript@npm:7.23.3"
+  dependencies:
+    "@babel/helper-plugin-utils": ^7.22.5
+    "@babel/helper-validator-option": ^7.22.15
+    "@babel/plugin-syntax-jsx": ^7.23.3
+    "@babel/plugin-transform-modules-commonjs": ^7.23.3
+    "@babel/plugin-transform-typescript": ^7.23.3
+  peerDependencies:
+    "@babel/core": ^7.0.0-0
+  checksum: 105a2d39bbc464da0f7e1ad7f535c77c5f62d6b410219355b20e552e7d29933567a5c55339b5d0aec1a5c7a0a7dfdf1b54aae601a4fe15a157d54dcbfcb3e854
+  languageName: node
+  linkType: hard
+
 "@babel/runtime@npm:^7.0.0, @babel/runtime@npm:^7.12.5, @babel/runtime@npm:^7.20.7, @babel/runtime@npm:^7.8.4, @babel/runtime@npm:^7.9.2":
   version: 7.20.13
   resolution: "@babel/runtime@npm:7.20.13"
@@ -1910,6 +2167,24 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/traverse@npm:^7.23.7":
+  version: 7.23.7
+  resolution: "@babel/traverse@npm:7.23.7"
+  dependencies:
+    "@babel/code-frame": ^7.23.5
+    "@babel/generator": ^7.23.6
+    "@babel/helper-environment-visitor": ^7.22.20
+    "@babel/helper-function-name": ^7.23.0
+    "@babel/helper-hoist-variables": ^7.22.5
+    "@babel/helper-split-export-declaration": ^7.22.6
+    "@babel/parser": ^7.23.6
+    "@babel/types": ^7.23.6
+    debug: ^4.3.1
+    globals: ^11.1.0
+  checksum: d4a7afb922361f710efc97b1e25ec343fab8b2a4ddc81ca84f9a153f22d4482112cba8f263774be8d297918b6c4767c7a98988ab4e53ac73686c986711dd002e
+  languageName: node
+  linkType: hard
+
 "@babel/types@npm:^7.0.0, @babel/types@npm:^7.0.0-beta.49, @babel/types@npm:^7.16.8, @babel/types@npm:^7.18.6, @babel/types@npm:^7.18.9, @babel/types@npm:^7.19.0, @babel/types@npm:^7.20.0, @babel/types@npm:^7.20.2, @babel/types@npm:^7.20.5, @babel/types@npm:^7.20.7, @babel/types@npm:^7.3.0, @babel/types@npm:^7.3.3, @babel/types@npm:^7.4.4, @babel/types@npm:^7.8.3":
   version: 7.20.7
   resolution: "@babel/types@npm:7.20.7"
@@ -1921,6 +2196,17 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/types@npm:^7.21.2, @babel/types@npm:^7.23.6":
+  version: 7.23.6
+  resolution: "@babel/types@npm:7.23.6"
+  dependencies:
+    "@babel/helper-string-parser": ^7.23.4
+    "@babel/helper-validator-identifier": ^7.22.20
+    to-fast-properties: ^2.0.0
+  checksum: 68187dbec0d637f79bc96263ac95ec8b06d424396678e7e225492be866414ce28ebc918a75354d4c28659be6efe30020b4f0f6df81cc418a2d30645b690a8de0
+  languageName: node
+  linkType: hard
+
 "@babel/types@npm:^7.22.15, @babel/types@npm:^7.22.5, @babel/types@npm:^7.23.0":
   version: 7.23.0
   resolution: "@babel/types@npm:7.23.0"
@@ -2017,6 +2303,20 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@esbuild/aix-ppc64@npm:0.19.11":
+  version: 0.19.11
+  resolution: "@esbuild/aix-ppc64@npm:0.19.11"
+  conditions: os=aix & cpu=ppc64
+  languageName: node
+  linkType: hard
+
+"@esbuild/android-arm64@npm:0.19.11":
+  version: 0.19.11
+  resolution: "@esbuild/android-arm64@npm:0.19.11"
+  conditions: os=android & cpu=arm64
+  languageName: node
+  linkType: hard
+
 "@esbuild/android-arm@npm:0.15.18":
   version: 0.15.18
   resolution: "@esbuild/android-arm@npm:0.15.18"
@@ -2024,6 +2324,69 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@esbuild/android-arm@npm:0.19.11":
+  version: 0.19.11
+  resolution: "@esbuild/android-arm@npm:0.19.11"
+  conditions: os=android & cpu=arm
+  languageName: node
+  linkType: hard
+
+"@esbuild/android-x64@npm:0.19.11":
+  version: 0.19.11
+  resolution: "@esbuild/android-x64@npm:0.19.11"
+  conditions: os=android & cpu=x64
+  languageName: node
+  linkType: hard
+
+"@esbuild/darwin-arm64@npm:0.19.11":
+  version: 0.19.11
+  resolution: "@esbuild/darwin-arm64@npm:0.19.11"
+  conditions: os=darwin & cpu=arm64
+  languageName: node
+  linkType: hard
+
+"@esbuild/darwin-x64@npm:0.19.11":
+  version: 0.19.11
+  resolution: "@esbuild/darwin-x64@npm:0.19.11"
+  conditions: os=darwin & cpu=x64
+  languageName: node
+  linkType: hard
+
+"@esbuild/freebsd-arm64@npm:0.19.11":
+  version: 0.19.11
+  resolution: "@esbuild/freebsd-arm64@npm:0.19.11"
+  conditions: os=freebsd & cpu=arm64
+  languageName: node
+  linkType: hard
+
+"@esbuild/freebsd-x64@npm:0.19.11":
+  version: 0.19.11
+  resolution: "@esbuild/freebsd-x64@npm:0.19.11"
+  conditions: os=freebsd & cpu=x64
+  languageName: node
+  linkType: hard
+
+"@esbuild/linux-arm64@npm:0.19.11":
+  version: 0.19.11
+  resolution: "@esbuild/linux-arm64@npm:0.19.11"
+  conditions: os=linux & cpu=arm64
+  languageName: node
+  linkType: hard
+
+"@esbuild/linux-arm@npm:0.19.11":
+  version: 0.19.11
+  resolution: "@esbuild/linux-arm@npm:0.19.11"
+  conditions: os=linux & cpu=arm
+  languageName: node
+  linkType: hard
+
+"@esbuild/linux-ia32@npm:0.19.11":
+  version: 0.19.11
+  resolution: "@esbuild/linux-ia32@npm:0.19.11"
+  conditions: os=linux & cpu=ia32
+  languageName: node
+  linkType: hard
+
 "@esbuild/linux-loong64@npm:0.15.18":
   version: 0.15.18
   resolution: "@esbuild/linux-loong64@npm:0.15.18"
@@ -2031,6 +2394,90 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@esbuild/linux-loong64@npm:0.19.11":
+  version: 0.19.11
+  resolution: "@esbuild/linux-loong64@npm:0.19.11"
+  conditions: os=linux & cpu=loong64
+  languageName: node
+  linkType: hard
+
+"@esbuild/linux-mips64el@npm:0.19.11":
+  version: 0.19.11
+  resolution: "@esbuild/linux-mips64el@npm:0.19.11"
+  conditions: os=linux & cpu=mips64el
+  languageName: node
+  linkType: hard
+
+"@esbuild/linux-ppc64@npm:0.19.11":
+  version: 0.19.11
+  resolution: "@esbuild/linux-ppc64@npm:0.19.11"
+  conditions: os=linux & cpu=ppc64
+  languageName: node
+  linkType: hard
+
+"@esbuild/linux-riscv64@npm:0.19.11":
+  version: 0.19.11
+  resolution: "@esbuild/linux-riscv64@npm:0.19.11"
+  conditions: os=linux & cpu=riscv64
+  languageName: node
+  linkType: hard
+
+"@esbuild/linux-s390x@npm:0.19.11":
+  version: 0.19.11
+  resolution: "@esbuild/linux-s390x@npm:0.19.11"
+  conditions: os=linux & cpu=s390x
+  languageName: node
+  linkType: hard
+
+"@esbuild/linux-x64@npm:0.19.11":
+  version: 0.19.11
+  resolution: "@esbuild/linux-x64@npm:0.19.11"
+  conditions: os=linux & cpu=x64
+  languageName: node
+  linkType: hard
+
+"@esbuild/netbsd-x64@npm:0.19.11":
+  version: 0.19.11
+  resolution: "@esbuild/netbsd-x64@npm:0.19.11"
+  conditions: os=netbsd & cpu=x64
+  languageName: node
+  linkType: hard
+
+"@esbuild/openbsd-x64@npm:0.19.11":
+  version: 0.19.11
+  resolution: "@esbuild/openbsd-x64@npm:0.19.11"
+  conditions: os=openbsd & cpu=x64
+  languageName: node
+  linkType: hard
+
+"@esbuild/sunos-x64@npm:0.19.11":
+  version: 0.19.11
+  resolution: "@esbuild/sunos-x64@npm:0.19.11"
+  conditions: os=sunos & cpu=x64
+  languageName: node
+  linkType: hard
+
+"@esbuild/win32-arm64@npm:0.19.11":
+  version: 0.19.11
+  resolution: "@esbuild/win32-arm64@npm:0.19.11"
+  conditions: os=win32 & cpu=arm64
+  languageName: node
+  linkType: hard
+
+"@esbuild/win32-ia32@npm:0.19.11":
+  version: 0.19.11
+  resolution: "@esbuild/win32-ia32@npm:0.19.11"
+  conditions: os=win32 & cpu=ia32
+  languageName: node
+  linkType: hard
+
+"@esbuild/win32-x64@npm:0.19.11":
+  version: 0.19.11
+  resolution: "@esbuild/win32-x64@npm:0.19.11"
+  conditions: os=win32 & cpu=x64
+  languageName: node
+  linkType: hard
+
 "@eslint-community/eslint-utils@npm:^4.2.0, @eslint-community/eslint-utils@npm:^4.4.0":
   version: 4.4.0
   resolution: "@eslint-community/eslint-utils@npm:4.4.0"
@@ -3583,6 +4030,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@rollup/rollup-android-arm-eabi@npm:4.9.4":
+  version: 4.9.4
+  resolution: "@rollup/rollup-android-arm-eabi@npm:4.9.4"
+  conditions: os=android & cpu=arm
+  languageName: node
+  linkType: hard
+
 "@rollup/rollup-android-arm64@npm:4.1.5":
   version: 4.1.5
   resolution: "@rollup/rollup-android-arm64@npm:4.1.5"
@@ -3590,6 +4044,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@rollup/rollup-android-arm64@npm:4.9.4":
+  version: 4.9.4
+  resolution: "@rollup/rollup-android-arm64@npm:4.9.4"
+  conditions: os=android & cpu=arm64
+  languageName: node
+  linkType: hard
+
 "@rollup/rollup-darwin-arm64@npm:4.1.5":
   version: 4.1.5
   resolution: "@rollup/rollup-darwin-arm64@npm:4.1.5"
@@ -3597,6 +4058,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@rollup/rollup-darwin-arm64@npm:4.9.4":
+  version: 4.9.4
+  resolution: "@rollup/rollup-darwin-arm64@npm:4.9.4"
+  conditions: os=darwin & cpu=arm64
+  languageName: node
+  linkType: hard
+
 "@rollup/rollup-darwin-x64@npm:4.1.5":
   version: 4.1.5
   resolution: "@rollup/rollup-darwin-x64@npm:4.1.5"
@@ -3604,6 +4072,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@rollup/rollup-darwin-x64@npm:4.9.4":
+  version: 4.9.4
+  resolution: "@rollup/rollup-darwin-x64@npm:4.9.4"
+  conditions: os=darwin & cpu=x64
+  languageName: node
+  linkType: hard
+
 "@rollup/rollup-linux-arm-gnueabihf@npm:4.1.5":
   version: 4.1.5
   resolution: "@rollup/rollup-linux-arm-gnueabihf@npm:4.1.5"
@@ -3611,6 +4086,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@rollup/rollup-linux-arm-gnueabihf@npm:4.9.4":
+  version: 4.9.4
+  resolution: "@rollup/rollup-linux-arm-gnueabihf@npm:4.9.4"
+  conditions: os=linux & cpu=arm
+  languageName: node
+  linkType: hard
+
 "@rollup/rollup-linux-arm64-gnu@npm:4.1.5":
   version: 4.1.5
   resolution: "@rollup/rollup-linux-arm64-gnu@npm:4.1.5"
@@ -3618,6 +4100,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@rollup/rollup-linux-arm64-gnu@npm:4.9.4":
+  version: 4.9.4
+  resolution: "@rollup/rollup-linux-arm64-gnu@npm:4.9.4"
+  conditions: os=linux & cpu=arm64 & libc=glibc
+  languageName: node
+  linkType: hard
+
 "@rollup/rollup-linux-arm64-musl@npm:4.1.5":
   version: 4.1.5
   resolution: "@rollup/rollup-linux-arm64-musl@npm:4.1.5"
@@ -3625,6 +4114,20 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@rollup/rollup-linux-arm64-musl@npm:4.9.4":
+  version: 4.9.4
+  resolution: "@rollup/rollup-linux-arm64-musl@npm:4.9.4"
+  conditions: os=linux & cpu=arm64 & libc=musl
+  languageName: node
+  linkType: hard
+
+"@rollup/rollup-linux-riscv64-gnu@npm:4.9.4":
+  version: 4.9.4
+  resolution: "@rollup/rollup-linux-riscv64-gnu@npm:4.9.4"
+  conditions: os=linux & cpu=riscv64 & libc=glibc
+  languageName: node
+  linkType: hard
+
 "@rollup/rollup-linux-x64-gnu@npm:4.1.5":
   version: 4.1.5
   resolution: "@rollup/rollup-linux-x64-gnu@npm:4.1.5"
@@ -3632,6 +4135,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@rollup/rollup-linux-x64-gnu@npm:4.9.4":
+  version: 4.9.4
+  resolution: "@rollup/rollup-linux-x64-gnu@npm:4.9.4"
+  conditions: os=linux & cpu=x64 & libc=glibc
+  languageName: node
+  linkType: hard
+
 "@rollup/rollup-linux-x64-musl@npm:4.1.5":
   version: 4.1.5
   resolution: "@rollup/rollup-linux-x64-musl@npm:4.1.5"
@@ -3639,6 +4149,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@rollup/rollup-linux-x64-musl@npm:4.9.4":
+  version: 4.9.4
+  resolution: "@rollup/rollup-linux-x64-musl@npm:4.9.4"
+  conditions: os=linux & cpu=x64 & libc=musl
+  languageName: node
+  linkType: hard
+
 "@rollup/rollup-win32-arm64-msvc@npm:4.1.5":
   version: 4.1.5
   resolution: "@rollup/rollup-win32-arm64-msvc@npm:4.1.5"
@@ -3646,6 +4163,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@rollup/rollup-win32-arm64-msvc@npm:4.9.4":
+  version: 4.9.4
+  resolution: "@rollup/rollup-win32-arm64-msvc@npm:4.9.4"
+  conditions: os=win32 & cpu=arm64
+  languageName: node
+  linkType: hard
+
 "@rollup/rollup-win32-ia32-msvc@npm:4.1.5":
   version: 4.1.5
   resolution: "@rollup/rollup-win32-ia32-msvc@npm:4.1.5"
@@ -3653,6 +4177,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@rollup/rollup-win32-ia32-msvc@npm:4.9.4":
+  version: 4.9.4
+  resolution: "@rollup/rollup-win32-ia32-msvc@npm:4.9.4"
+  conditions: os=win32 & cpu=ia32
+  languageName: node
+  linkType: hard
+
 "@rollup/rollup-win32-x64-msvc@npm:4.1.5":
   version: 4.1.5
   resolution: "@rollup/rollup-win32-x64-msvc@npm:4.1.5"
@@ -3660,6 +4191,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@rollup/rollup-win32-x64-msvc@npm:4.9.4":
+  version: 4.9.4
+  resolution: "@rollup/rollup-win32-x64-msvc@npm:4.9.4"
+  conditions: os=win32 & cpu=x64
+  languageName: node
+  linkType: hard
+
 "@sideway/address@npm:^4.1.3":
   version: 4.1.4
   resolution: "@sideway/address@npm:4.1.4"
@@ -3865,6 +4403,19 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@types/babel__core@npm:^7.20.4":
+  version: 7.20.5
+  resolution: "@types/babel__core@npm:7.20.5"
+  dependencies:
+    "@babel/parser": ^7.20.7
+    "@babel/types": ^7.20.7
+    "@types/babel__generator": "*"
+    "@types/babel__template": "*"
+    "@types/babel__traverse": "*"
+  checksum: a3226f7930b635ee7a5e72c8d51a357e799d19cbf9d445710fa39ab13804f79ab1a54b72ea7d8e504659c7dfc50675db974b526142c754398d7413aa4bc30845
+  languageName: node
+  linkType: hard
+
 "@types/babel__generator@npm:*":
   version: 7.6.4
   resolution: "@types/babel__generator@npm:7.6.4"
@@ -3997,6 +4548,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@types/estree@npm:1.0.5":
+  version: 1.0.5
+  resolution: "@types/estree@npm:1.0.5"
+  checksum: dd8b5bed28e6213b7acd0fb665a84e693554d850b0df423ac8076cc3ad5823a6bc26b0251d080bdc545af83179ede51dd3f6fa78cad2c46ed1f29624ddf3e41a
+  languageName: node
+  linkType: hard
+
 "@types/estree@npm:^0.0.51":
   version: 0.0.51
   resolution: "@types/estree@npm:0.0.51"
@@ -5672,6 +6230,21 @@ __metadata:
   languageName: node
   linkType: hard
 
+"babel-plugin-jsx-dom-expressions@npm:^0.37.11":
+  version: 0.37.11
+  resolution: "babel-plugin-jsx-dom-expressions@npm:0.37.11"
+  dependencies:
+    "@babel/helper-module-imports": 7.18.6
+    "@babel/plugin-syntax-jsx": ^7.18.6
+    "@babel/types": ^7.20.7
+    html-entities: 2.3.3
+    validate-html-nesting: ^1.2.1
+  peerDependencies:
+    "@babel/core": ^7.20.12
+  checksum: bb2d580615e3bc97d563262bb898d1d50f7b4111cb9c245b03a7b85e6478ce9cf6d5347a47ac35fb9c971d90da49c20ea0d7e0424dc30c2b31dd1afad5cfce26
+  languageName: node
+  linkType: hard
+
 "babel-plugin-lodash@npm:^3.3.4":
   version: 3.3.4
   resolution: "babel-plugin-lodash@npm:3.3.4"
@@ -5879,6 +6452,17 @@ __metadata:
   languageName: node
   linkType: hard
 
+"babel-preset-solid@npm:^1.8.4":
+  version: 1.8.8
+  resolution: "babel-preset-solid@npm:1.8.8"
+  dependencies:
+    babel-plugin-jsx-dom-expressions: ^0.37.11
+  peerDependencies:
+    "@babel/core": ^7.0.0
+  checksum: 9edefee57631f65652dc5c87aba8903888f4a10eceb9d9f196258ed120ddbaded8e38108f29af2faffdb1d09849ef2aab7fa57be59ec0ab68e03cb02e18de22d
+  languageName: node
+  linkType: hard
+
 "bail@npm:^2.0.0":
   version: 2.0.2
   resolution: "bail@npm:2.0.2"
@@ -6102,6 +6686,20 @@ __metadata:
   languageName: node
   linkType: hard
 
+"browserslist@npm:^4.22.2":
+  version: 4.22.2
+  resolution: "browserslist@npm:4.22.2"
+  dependencies:
+    caniuse-lite: ^1.0.30001565
+    electron-to-chromium: ^1.4.601
+    node-releases: ^2.0.14
+    update-browserslist-db: ^1.0.13
+  bin:
+    browserslist: cli.js
+  checksum: 33ddfcd9145220099a7a1ac533cecfe5b7548ffeb29b313e1b57be6459000a1f8fa67e781cf4abee97268ac594d44134fcc4a6b2b4750ceddc9796e3a22076d9
+  languageName: node
+  linkType: hard
+
 "bs-logger@npm:0.x":
   version: 0.2.6
   resolution: "bs-logger@npm:0.2.6"
@@ -6402,6 +7000,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"caniuse-lite@npm:^1.0.30001565":
+  version: 1.0.30001574
+  resolution: "caniuse-lite@npm:1.0.30001574"
+  checksum: 4064719755371a9716446ee79714ff5cee347861492d6325c2e3db00c37cb27f184742f53f2b6e4c15cc2e1a47fae32cc44c9b15e957a9290982bf4108933245
+  languageName: node
+  linkType: hard
+
 "capital-case@npm:^1.0.4":
   version: 1.0.4
   resolution: "capital-case@npm:1.0.4"
@@ -7534,6 +8139,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"csstype@npm:^3.1.0":
+  version: 3.1.3
+  resolution: "csstype@npm:3.1.3"
+  checksum: 8db785cc92d259102725b3c694ec0c823f5619a84741b5c7991b8ad135dfaa66093038a1cc63e03361a6cd28d122be48f2106ae72334e067dd619a51f49eddf7
+  languageName: node
+  linkType: hard
+
 "cwd@npm:^0.9.1":
   version: 0.9.1
   resolution: "cwd@npm:0.9.1"
@@ -8103,6 +8715,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"electron-to-chromium@npm:^1.4.601":
+  version: 1.4.623
+  resolution: "electron-to-chromium@npm:1.4.623"
+  checksum: 69b285f1046571bde9cda95089397e1388dc5268c71b361832ade9eae6d9987229fa150856e024f845c68848e235f0fcdaf730f0d03b061239c75c968b521d11
+  languageName: node
+  linkType: hard
+
 "embla-carousel-auto-height@workspace:packages/embla-carousel-auto-height":
   version: 0.0.0-use.local
   resolution: "embla-carousel-auto-height@workspace:packages/embla-carousel-auto-height"
@@ -8256,6 +8875,18 @@ __metadata:
   languageName: unknown
   linkType: soft
 
+"embla-carousel-playground-solid@workspace:playgrounds/embla-carousel-playground-solid":
+  version: 0.0.0-use.local
+  resolution: "embla-carousel-playground-solid@workspace:playgrounds/embla-carousel-playground-solid"
+  dependencies:
+    embla-carousel-autoplay: 8.0.0-rc18
+    embla-carousel-solid: 8.0.0-rc18
+    solid-js: ^1.8.0
+    vite: ^5.0.10
+    vite-plugin-solid: ^2.8.0
+  languageName: unknown
+  linkType: soft
+
 "embla-carousel-playground-vanilla@workspace:playgrounds/embla-carousel-playground-vanilla":
   version: 0.0.0-use.local
   resolution: "embla-carousel-playground-vanilla@workspace:playgrounds/embla-carousel-playground-vanilla"
@@ -8311,6 +8942,30 @@ __metadata:
   languageName: unknown
   linkType: soft
 
+"embla-carousel-solid@8.0.0-rc18, embla-carousel-solid@workspace:packages/embla-carousel-solid":
+  version: 0.0.0-use.local
+  resolution: "embla-carousel-solid@workspace:packages/embla-carousel-solid"
+  dependencies:
+    "@types/jest": ^29.5.6
+    "@typescript-eslint/eslint-plugin": ^6.9.0
+    "@typescript-eslint/parser": ^6.9.0
+    embla-carousel: 8.0.0-rc18
+    embla-carousel-reactive-utils: 8.0.0-rc18
+    eslint: ^8.52.0
+    eslint-config-prettier: ^9.0.0
+    eslint-plugin-prettier: ^4.0.0
+    jest: ^29.5.0
+    jest-environment-jsdom: ^29.5.0
+    prettier: 2.8.8
+    rollup: ^4.1.5
+    solid-js: ^1.8.7
+    ts-jest: ^29.1.1
+    typescript: ^5.2.2
+  peerDependencies:
+    solid-js: ^1.0.0
+  languageName: unknown
+  linkType: soft
+
 "embla-carousel-svelte@workspace:packages/embla-carousel-svelte":
   version: 0.0.0-use.local
   resolution: "embla-carousel-svelte@workspace:packages/embla-carousel-svelte"
@@ -8944,6 +9599,86 @@ __metadata:
   languageName: node
   linkType: hard
 
+"esbuild@npm:^0.19.3":
+  version: 0.19.11
+  resolution: "esbuild@npm:0.19.11"
+  dependencies:
+    "@esbuild/aix-ppc64": 0.19.11
+    "@esbuild/android-arm": 0.19.11
+    "@esbuild/android-arm64": 0.19.11
+    "@esbuild/android-x64": 0.19.11
+    "@esbuild/darwin-arm64": 0.19.11
+    "@esbuild/darwin-x64": 0.19.11
+    "@esbuild/freebsd-arm64": 0.19.11
+    "@esbuild/freebsd-x64": 0.19.11
+    "@esbuild/linux-arm": 0.19.11
+    "@esbuild/linux-arm64": 0.19.11
+    "@esbuild/linux-ia32": 0.19.11
+    "@esbuild/linux-loong64": 0.19.11
+    "@esbuild/linux-mips64el": 0.19.11
+    "@esbuild/linux-ppc64": 0.19.11
+    "@esbuild/linux-riscv64": 0.19.11
+    "@esbuild/linux-s390x": 0.19.11
+    "@esbuild/linux-x64": 0.19.11
+    "@esbuild/netbsd-x64": 0.19.11
+    "@esbuild/openbsd-x64": 0.19.11
+    "@esbuild/sunos-x64": 0.19.11
+    "@esbuild/win32-arm64": 0.19.11
+    "@esbuild/win32-ia32": 0.19.11
+    "@esbuild/win32-x64": 0.19.11
+  dependenciesMeta:
+    "@esbuild/aix-ppc64":
+      optional: true
+    "@esbuild/android-arm":
+      optional: true
+    "@esbuild/android-arm64":
+      optional: true
+    "@esbuild/android-x64":
+      optional: true
+    "@esbuild/darwin-arm64":
+      optional: true
+    "@esbuild/darwin-x64":
+      optional: true
+    "@esbuild/freebsd-arm64":
+      optional: true
+    "@esbuild/freebsd-x64":
+      optional: true
+    "@esbuild/linux-arm":
+      optional: true
+    "@esbuild/linux-arm64":
+      optional: true
+    "@esbuild/linux-ia32":
+      optional: true
+    "@esbuild/linux-loong64":
+      optional: true
+    "@esbuild/linux-mips64el":
+      optional: true
+    "@esbuild/linux-ppc64":
+      optional: true
+    "@esbuild/linux-riscv64":
+      optional: true
+    "@esbuild/linux-s390x":
+      optional: true
+    "@esbuild/linux-x64":
+      optional: true
+    "@esbuild/netbsd-x64":
+      optional: true
+    "@esbuild/openbsd-x64":
+      optional: true
+    "@esbuild/sunos-x64":
+      optional: true
+    "@esbuild/win32-arm64":
+      optional: true
+    "@esbuild/win32-ia32":
+      optional: true
+    "@esbuild/win32-x64":
+      optional: true
+  bin:
+    esbuild: bin/esbuild
+  checksum: ae949a796d1d06b55275ae7491ce137857468f69a93d8cc9c0943d2a701ac54e14dbb250a2ba56f2ad98283669578f1ec3bd85a4681910a5ff29a2470c3bd62c
+  languageName: node
+  linkType: hard
+
 "escalade@npm:^3.1.1":
   version: 3.1.1
   resolution: "escalade@npm:3.1.1"
@@ -10240,6 +10975,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"fsevents@npm:~2.3.3":
+  version: 2.3.3
+  resolution: "fsevents@npm:2.3.3"
+  dependencies:
+    node-gyp: latest
+  checksum: 11e6ea6fea15e42461fc55b4b0e4a0a3c654faa567f1877dbd353f39156f69def97a69936d1746619d656c4b93de2238bf731f6085a03a50cabf287c9d024317
+  conditions: os=darwin
+  languageName: node
+  linkType: hard
+
 "fsevents@patch:fsevents@^2.3.2#~builtin<compat/fsevents>, fsevents@patch:fsevents@~2.3.2#~builtin<compat/fsevents>":
   version: 2.3.2
   resolution: "fsevents@patch:fsevents@npm%3A2.3.2#~builtin<compat/fsevents>::version=2.3.2&hash=df0bf1"
@@ -10249,6 +10994,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"fsevents@patch:fsevents@~2.3.3#~builtin<compat/fsevents>":
+  version: 2.3.3
+  resolution: "fsevents@patch:fsevents@npm%3A2.3.3#~builtin<compat/fsevents>::version=2.3.3&hash=df0bf1"
+  dependencies:
+    node-gyp: latest
+  conditions: os=darwin
+  languageName: node
+  linkType: hard
+
 "function-bind@npm:^1.1.1":
   version: 1.1.1
   resolution: "function-bind@npm:1.1.1"
@@ -11639,7 +12393,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"html-entities@npm:^2.1.0, html-entities@npm:^2.3.3":
+"html-entities@npm:2.3.3, html-entities@npm:^2.1.0, html-entities@npm:^2.3.3":
   version: 2.3.3
   resolution: "html-entities@npm:2.3.3"
   checksum: 92521501da8aa5f66fee27f0f022d6e9ceae62667dae93aa6a2f636afa71ad530b7fb24a18d4d6c124c9885970cac5f8a52dbf1731741161002816ae43f98196
@@ -12641,6 +13395,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"is-what@npm:^4.1.8":
+  version: 4.1.16
+  resolution: "is-what@npm:4.1.16"
+  checksum: baf99e4b9f06003ceb3b2eea4a1e17179524ee3a6310dc44903eb675cfe3c0a17819ab057bb1ae6ba7ca4939ae4bdfcc6a0c4210a8457aff1756abd3607b713c
+  languageName: node
+  linkType: hard
+
 "is-windows@npm:^0.2.0":
   version: 0.2.0
   resolution: "is-windows@npm:0.2.0"
@@ -14336,6 +15097,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"merge-anything@npm:^5.1.7":
+  version: 5.1.7
+  resolution: "merge-anything@npm:5.1.7"
+  dependencies:
+    is-what: ^4.1.8
+  checksum: 5b9d2bcec2dd7c0a748a84b2aabc5baeee535a8ea86af9a0154c2446298c1bf7c1746dd67757df5d4138553b8f24d46730263464fbc115fe6ef9056be9f51b04
+  languageName: node
+  linkType: hard
+
 "merge-descriptors@npm:1.0.1":
   version: 1.0.1
   resolution: "merge-descriptors@npm:1.0.1"
@@ -15133,6 +15903,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"nanoid@npm:^3.3.7":
+  version: 3.3.7
+  resolution: "nanoid@npm:3.3.7"
+  bin:
+    nanoid: bin/nanoid.cjs
+  checksum: d36c427e530713e4ac6567d488b489a36582ef89da1d6d4e3b87eded11eb10d7042a877958c6f104929809b2ab0bafa17652b076cdf84324aa75b30b722204f2
+  languageName: node
+  linkType: hard
+
 "napi-build-utils@npm:^1.0.1":
   version: 1.0.2
   resolution: "napi-build-utils@npm:1.0.2"
@@ -15333,6 +16112,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"node-releases@npm:^2.0.14":
+  version: 2.0.14
+  resolution: "node-releases@npm:2.0.14"
+  checksum: 59443a2f77acac854c42d321bf1b43dea0aef55cd544c6a686e9816a697300458d4e82239e2d794ea05f7bbbc8a94500332e2d3ac3f11f52e4b16cbe638b3c41
+  languageName: node
+  linkType: hard
+
 "node-releases@npm:^2.0.6":
   version: 2.0.8
   resolution: "node-releases@npm:2.0.8"
@@ -16673,6 +17459,17 @@ __metadata:
   languageName: node
   linkType: hard
 
+"postcss@npm:^8.4.32":
+  version: 8.4.33
+  resolution: "postcss@npm:8.4.33"
+  dependencies:
+    nanoid: ^3.3.7
+    picocolors: ^1.0.0
+    source-map-js: ^1.0.2
+  checksum: 6f98b2af4b76632a3de20c4f47bf0e984a1ce1a531cf11adcb0b1d63a6cbda0aae4165e578b66c32ca4879038e3eaad386a6be725a8fb4429c78e3c1ab858fe9
+  languageName: node
+  linkType: hard
+
 "prebuild-install@npm:^7.1.1":
   version: 7.1.1
   resolution: "prebuild-install@npm:7.1.1"
@@ -17816,6 +18613,60 @@ __metadata:
   languageName: node
   linkType: hard
 
+"rollup@npm:^4.2.0":
+  version: 4.9.4
+  resolution: "rollup@npm:4.9.4"
+  dependencies:
+    "@rollup/rollup-android-arm-eabi": 4.9.4
+    "@rollup/rollup-android-arm64": 4.9.4
+    "@rollup/rollup-darwin-arm64": 4.9.4
+    "@rollup/rollup-darwin-x64": 4.9.4
+    "@rollup/rollup-linux-arm-gnueabihf": 4.9.4
+    "@rollup/rollup-linux-arm64-gnu": 4.9.4
+    "@rollup/rollup-linux-arm64-musl": 4.9.4
+    "@rollup/rollup-linux-riscv64-gnu": 4.9.4
+    "@rollup/rollup-linux-x64-gnu": 4.9.4
+    "@rollup/rollup-linux-x64-musl": 4.9.4
+    "@rollup/rollup-win32-arm64-msvc": 4.9.4
+    "@rollup/rollup-win32-ia32-msvc": 4.9.4
+    "@rollup/rollup-win32-x64-msvc": 4.9.4
+    "@types/estree": 1.0.5
+    fsevents: ~2.3.2
+  dependenciesMeta:
+    "@rollup/rollup-android-arm-eabi":
+      optional: true
+    "@rollup/rollup-android-arm64":
+      optional: true
+    "@rollup/rollup-darwin-arm64":
+      optional: true
+    "@rollup/rollup-darwin-x64":
+      optional: true
+    "@rollup/rollup-linux-arm-gnueabihf":
+      optional: true
+    "@rollup/rollup-linux-arm64-gnu":
+      optional: true
+    "@rollup/rollup-linux-arm64-musl":
+      optional: true
+    "@rollup/rollup-linux-riscv64-gnu":
+      optional: true
+    "@rollup/rollup-linux-x64-gnu":
+      optional: true
+    "@rollup/rollup-linux-x64-musl":
+      optional: true
+    "@rollup/rollup-win32-arm64-msvc":
+      optional: true
+    "@rollup/rollup-win32-ia32-msvc":
+      optional: true
+    "@rollup/rollup-win32-x64-msvc":
+      optional: true
+    fsevents:
+      optional: true
+  bin:
+    rollup: dist/bin/rollup
+  checksum: 134b1fd8886a1dc86b2cadada979174e736a39aec12d069261fe8b799ad0c4aa3213188ea49adeee155669315016617260e43eea754436c50121aa359899da4d
+  languageName: node
+  linkType: hard
+
 "run-async@npm:^2.2.0, run-async@npm:^2.4.0":
   version: 2.4.1
   resolution: "run-async@npm:2.4.1"
@@ -18097,6 +18948,20 @@ __metadata:
   languageName: node
   linkType: hard
 
+"seroval@npm:^0.15.1":
+  version: 0.15.1
+  resolution: "seroval@npm:0.15.1"
+  checksum: 9d84fa556178abb716e5611b68daea0da9984953a4585206047a81a6a2e7402b546778bccf53ab6a1bff14cef4b96a68deaca1032cbd25f2daaa57046cc4e168
+  languageName: node
+  linkType: hard
+
+"seroval@npm:^1.0.2":
+  version: 1.0.3
+  resolution: "seroval@npm:1.0.3"
+  checksum: 9c3e0b8f9fc92bf06e94302bd7b3b46f255480738a1d085ea4983540281df41477cddb5596e00beb404be8b8a03518c7f33e5cd845bd5a7c86fd1337d37d0865
+  languageName: node
+  linkType: hard
+
 "serve-static@npm:1.15.0":
   version: 1.15.0
   resolution: "serve-static@npm:1.15.0"
@@ -18456,6 +19321,39 @@ __metadata:
   languageName: node
   linkType: hard
 
+"solid-js@npm:^1.8.0":
+  version: 1.8.8
+  resolution: "solid-js@npm:1.8.8"
+  dependencies:
+    csstype: ^3.1.0
+    seroval: ^1.0.2
+  checksum: 9f7f7c2fe4dd28e346600e8e18edafcea62ff8cc15935a7723c10fbe2d8a84f6d08add140564cfe397fb1f5a8250bdfb9bb630f91dcf45b9c361899ed0851268
+  languageName: node
+  linkType: hard
+
+"solid-js@npm:^1.8.7":
+  version: 1.8.7
+  resolution: "solid-js@npm:1.8.7"
+  dependencies:
+    csstype: ^3.1.0
+    seroval: ^0.15.1
+  checksum: 44a9780e0f9ba2667e96e340b1ee1f33d8844a0b962c9c986049ec953b5bdf72077b53a90524cc98cef279ee4c9a6f06b820be4c5e81ebe8f110b912f22e2ee2
+  languageName: node
+  linkType: hard
+
+"solid-refresh@npm:^0.5.3":
+  version: 0.5.3
+  resolution: "solid-refresh@npm:0.5.3"
+  dependencies:
+    "@babel/generator": ^7.21.1
+    "@babel/helper-module-imports": ^7.18.6
+    "@babel/types": ^7.21.2
+  peerDependencies:
+    solid-js: ^1.3
+  checksum: bd75ed56ad86f70476fc57e44a046dc9937eaf1a1a5f45a2a70a85ef444796ffe39f46400a0d59b617e3e10ff60ab3e6a11592a665aeb75a06ecebf87c1b4bff
+  languageName: node
+  linkType: hard
+
 "source-list-map@npm:^2.0.0":
   version: 2.0.1
   resolution: "source-list-map@npm:2.0.1"
@@ -20237,6 +21135,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"validate-html-nesting@npm:^1.2.1":
+  version: 1.2.2
+  resolution: "validate-html-nesting@npm:1.2.2"
+  checksum: df077b3dc3fbedb81e309a6fefe53485a9e0415c8fd6d545ca13e7512bc22d780b7ace91b4173066beef95b80e3b9e8d6a584b89a62e80a242c8f16983b37164
+  languageName: node
+  linkType: hard
+
 "validate-npm-package-license@npm:^3.0.1":
   version: 3.0.4
   resolution: "validate-npm-package-license@npm:3.0.4"
@@ -20302,6 +21207,24 @@ __metadata:
   languageName: node
   linkType: hard
 
+"vite-plugin-solid@npm:^2.8.0":
+  version: 2.8.0
+  resolution: "vite-plugin-solid@npm:2.8.0"
+  dependencies:
+    "@babel/core": ^7.23.3
+    "@babel/preset-typescript": ^7.23.3
+    "@types/babel__core": ^7.20.4
+    babel-preset-solid: ^1.8.4
+    merge-anything: ^5.1.7
+    solid-refresh: ^0.5.3
+    vitefu: ^0.2.5
+  peerDependencies:
+    solid-js: ^1.7.2
+    vite: ^3.0.0 || ^4.0.0 || ^5.0.0
+  checksum: e53751a3845aff26fe0e5f22f30ba4c1ba91584784d5e4c010dee6c03a3c6e4881fcdcc76cd6286bbc8a660651cfd3863dddbc7c9a0d81d0dc23956b74b0a6e8
+  languageName: node
+  linkType: hard
+
 "vite@npm:^3.2.7":
   version: 3.2.7
   resolution: "vite@npm:3.2.7"
@@ -20340,6 +21263,58 @@ __metadata:
   languageName: node
   linkType: hard
 
+"vite@npm:^5.0.10":
+  version: 5.0.11
+  resolution: "vite@npm:5.0.11"
+  dependencies:
+    esbuild: ^0.19.3
+    fsevents: ~2.3.3
+    postcss: ^8.4.32
+    rollup: ^4.2.0
+  peerDependencies:
+    "@types/node": ^18.0.0 || >=20.0.0
+    less: "*"
+    lightningcss: ^1.21.0
+    sass: "*"
+    stylus: "*"
+    sugarss: "*"
+    terser: ^5.4.0
+  dependenciesMeta:
+    fsevents:
+      optional: true
+  peerDependenciesMeta:
+    "@types/node":
+      optional: true
+    less:
+      optional: true
+    lightningcss:
+      optional: true
+    sass:
+      optional: true
+    stylus:
+      optional: true
+    sugarss:
+      optional: true
+    terser:
+      optional: true
+  bin:
+    vite: bin/vite.js
+  checksum: 262e41f25ce0cc5fc3c2065b1796f64ec115d3ac2d9625dbfb36d6628ba10e63684ef5515bb2ff1aa8e34c6f89e9c10e8211cb88f6c7f0da6869362851345437
+  languageName: node
+  linkType: hard
+
+"vitefu@npm:^0.2.5":
+  version: 0.2.5
+  resolution: "vitefu@npm:0.2.5"
+  peerDependencies:
+    vite: ^3.0.0 || ^4.0.0 || ^5.0.0
+  peerDependenciesMeta:
+    vite:
+      optional: true
+  checksum: 1a58f3f8b2fe493f595952ad2e8d2876a18e2de16b211c2e795af879863948db838bdcc962d300c7fbd8d827ee616905d7799c30a46206a045aec5f7c8e5031b
+  languageName: node
+  linkType: hard
+
 "vue@npm:^3.2.37":
   version: 3.2.45
   resolution: "vue@npm:3.2.45"