Applelo · Applelo · Feb 16, 2026 · Feb 16, 2026 · Feb 16, 2026 · Feb 16, 2026
diff --git a/package.json b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@compotes/root",
   "type": "module",
-  "version": "0.10.0",
+  "version": "0.10.1",
   "private": "true",
   "packageManager": "pnpm@10.29.1",
   "description": "Components library focused on accessibility/customization",
@@ -33,24 +33,30 @@
     "build": "pnpm run -r build",
     "lint": "eslint .",
     "lint:fix": "eslint . --fix",
-    "test": "pnpm run test:types && pnpm run test:vitest",
+    "test": "pnpm run test:types && pnpm run test:attw && pnpm run test:vitest",
+    "test:attw": "pnpm run -r test:attw",
+    "test:publint": "pnpm run -r test:publint",
     "test:vitest": "pnpm run -r test:vitest --run",
     "test:coverage": "pnpm run -r test:coverage",
     "test:types": "pnpm run -r test:types",
-    "prepublishOnly": "pnpm build",
     "docs:dev": "vitepress dev docs",
     "docs:build": "vitepress build docs",
     "docs:serve": "vitepress serve docs",
     "docs:sync": "node scripts/doc-sync.js",
+    "prepublish:sync": "node scripts/prepublish-sync.js",
+    "prepublishOnly": "pnpm prepublish:sync && pnpm build",
     "publish:all": "pnpm -r publish"
   },
   "devDependencies": {
     "@antfu/eslint-config": "catalog:",
+    "@arethetypeswrong/cli": "catalog:",
     "@vitest/browser-playwright": "catalog:",
     "@vitest/coverage-istanbul": "catalog:",
     "@vitest/ui": "catalog:",
     "eslint": "catalog:",
     "playwright": "catalog:",
+    "publint": "catalog:",
+    "rolldown": "catalog:",
     "rollup": "catalog:",
     "tsdown": "catalog:",
     "typescript": "catalog:",

diff --git a/packages/core/README.md b/packages/core/README.md
@@ -1,5 +1,6 @@
 <a href="https://npmjs.com/package/compotes"><img src="https://img.shields.io/npm/v/compotes.svg" alt="npm package"></a>
 <a href="https://github.com/Applelo/compotes/actions/workflows/ci.yml"><img src="https://github.com/Applelo/compotes/actions/workflows/ci.yml/badge.svg?branch=main" alt="build status"></a>
+[![Coverage Status](https://coveralls.io/repos/github/Applelo/compotes/badge.svg?branch=main)](https://coveralls.io/github/Applelo/compotes?branch=main)
 
 # Compotes
 
@@ -12,14 +13,20 @@ To learn more, check the *[documentation](https://compotes.dev)*.
 - 👨‍🎨 Minimal CSS to do your customization
 - 🦾 Accessibility in mind
 - 📠 Fully typed
+- 🧩 Framework agnostic
+- 📦 Simple components ready to use
+- 🪶 Lightweight
 
 ## 🍏 Compotes
 
-- Collapse/Accordion ([demo](https://compotes.dev/demo/drilldown.html))
+- Collapse/Accordion ([demo](https://compotes.dev/demo/collapse.html))
 - Drag ([demo](https://compotes.dev/demo/drag.html))
-- Drilldown ([demo](https://compotes.dev/demo/collapse.html))
+- Drilldown ([demo](https://compotes.dev/demo/drilldown.html))
 - Dropdown ([demo](https://compotes.dev/demo/dropdown.html))
 - Marquee ([demo](https://compotes.dev/demo/marquee.html))
+<!--
+- Tabs
+-->
 
 And more to come!
 
@@ -36,6 +43,9 @@ yarn add -D compotes
 
 # pnpm
 pnpm add -D compotes
+
+#bun
+bun add -D compotes
 ```
 
 <br></details>
@@ -51,12 +61,15 @@ yarn add -D @compotes/vue
 
 # pnpm
 pnpm add -D @compotes/vue
+
+#bun
+bun add -D @compotes/vue
 ```
 
 <br></details>
 
-<!--<details>
-<summary>Nuxt 4</summary><br>
+<!-- <details>
+<summary>Nuxt 3</summary><br>
 
 ```bash
 npm i -D @compotes/nuxt
@@ -68,15 +81,19 @@ yarn add -D @compotes/nuxt
 pnpm add -D @compotes/nuxt
 ```
 
-<br></details>-->
+<br></details> -->
 
 ## 🙋‍♂️ Why ?
 
-A lot of components library are already shipped with styles but as a Front End developer, I always wants to override a lot. Futhermore, there are not always accessible or they are shipped with jQuery.
+A lot of component libraries are already shipped with styles but as a Front End developer, I always want to override a lot. Furthermore, they are not always accessible or they are shipped with jQuery.
+
+There are some good libraries like [React Aria](https://react-spectrum.adobe.com/react-aria/react-aria-components.html) but it's made to work on one framework and I work on different tech like Wordpress, Symfony or VueJS.
+
+> This library provides only the compotes and it's up to you to make a tart.
 
-There are some good library like [React Aria](https://react-spectrum.adobe.com/react-aria/react-aria-components.html) but it's made to work on one framework and I work on different tech like Wordpress, Symfony or VueJS.
+## AI Usage
 
-> This library provide only the compotes and it's you to make a tart.
+This project uses AI to improve and keep the documentation up to date. It also helps me writing the connection between core components to VueJS.
 
 ## 👨‍💼 License
 

diff --git a/packages/core/package.json b/packages/core/package.json
@@ -1,14 +1,14 @@
 {
   "name": "compotes",
   "type": "module",
-  "version": "0.10.0",
+  "version": "0.10.1",
   "description": "Components library focused on accessibility/customization",
   "author": "Applelo",
   "license": "MIT",
   "homepage": "https://compotes.dev",
   "repository": {
     "type": "git",
-    "url": "https://github.com/Applelo/compotes"
+    "url": "git+https://github.com/Applelo/compotes.git"
   },
   "bugs": "https://github.com/Applelo/compotes/issues",
   "keywords": [
@@ -24,12 +24,12 @@
   "exports": {
     ".": {
       "import": {
-        "types": "./dist/index.d.ts",
-        "default": "./dist/compotes.js"
+        "types": "./dist/compotes.d.mts",
+        "default": "./dist/compotes.mjs"
       },
       "require": {
-        "types": "./dist/index.d.ts",
-        "default": "./dist/compotes.umd.js"
+        "types": "./dist/compotes.d.cts",
+        "default": "./dist/compotes.umd.cjs"
       }
     },
     "./css": "./dist/style.css",
@@ -45,9 +45,9 @@
     "./css/marquee": "./dist/css/marquee.css",
     "./css/marquee.css": "./dist/css/marquee.css"
   },
-  "main": "./dist/compotes.umd.js",
-  "module": "./dist/compotes.js",
-  "types": "./dist/index.d.ts",
+  "main": "./dist/compotes.umd.cjs",
+  "module": "./dist/compotes.mjs",
+  "types": "./dist/compotes.d.mts",
   "files": [
     "dist"
   ],
@@ -59,6 +59,8 @@
     "build": "tsdown",
     "test:vitest": "vitest",
     "test:coverage": "vitest --run --coverage",
+    "test:attw": "attw --pack . --entrypoints . --ignore-rules cjs-resolves-to-esm unexpected-module-syntax",
+    "test:publint": "pnpm build && publint",
     "test:types": "tsc --noEmit && vue-tsc --noEmit",
     "prepublishOnly": "pnpm build"
   },

diff --git a/packages/core/tsdown.config.ts b/packages/core/tsdown.config.ts
@@ -1,3 +1,4 @@
+import type { Plugin } from 'rolldown'
 import { promises as fs } from 'node:fs'
 import { basename, resolve } from 'node:path'
 import { fileURLToPath } from 'node:url'
@@ -8,12 +9,12 @@ import LightningCSS from 'unplugin-lightningcss/rolldown'
 
 const root = fileURLToPath(new URL('.', import.meta.url))
 
-function addCSSCompotes() {
+function addCSSCompotes(): Plugin {
   return {
     name: 'add-css',
     async generateBundle() {
       const styles = await fg.glob(['src/css/*.css'], { cwd: root })
-      const minifyStyle = async (path: string) => {
+      for (const path of styles) {
         const filename = basename(path)
         const css = await fs.readFile(resolve(root, path))
         const { code } = transform({
@@ -27,7 +28,6 @@ function addCSSCompotes() {
           type: 'asset',
         })
       }
-      await Promise.all(styles.map(path => minifyStyle(path)))
     },
   }
 }
@@ -44,15 +44,23 @@ export default defineConfig({
       tabbable: 'tabbable',
     },
   },
+  fixedExtension: true,
+  outExtensions: ({ format }) => {
+    if (format === 'umd')
+      return { js: '.cjs', dts: '.d.cts' }
+  },
   hash: false,
   alias: {
     '@src': resolve(root, 'src'),
   },
   css: {
     splitting: false,
-    fileName: 'compotes.css',
+    fileName: 'style.css',
   },
   dts: true,
+  onSuccess: async () => {
+    await fs.copyFile(resolve(root, 'dist/compotes.d.mts'), resolve(root, 'dist/compotes.d.cts'))
+  },
   plugins: [LightningCSS({
     options: {
       minify: true,

diff --git a/packages/vue/LICENSE b/packages/vue/LICENSE
@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2023-present Loïs Boubault (Applelo)
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
diff --git a/packages/vue/README.md b/packages/vue/README.md
@@ -0,0 +1,100 @@
+<a href="https://npmjs.com/package/compotes"><img src="https://img.shields.io/npm/v/compotes.svg" alt="npm package"></a>
+<a href="https://github.com/Applelo/compotes/actions/workflows/ci.yml"><img src="https://github.com/Applelo/compotes/actions/workflows/ci.yml/badge.svg?branch=main" alt="build status"></a>
+[![Coverage Status](https://coveralls.io/repos/github/Applelo/compotes/badge.svg?branch=main)](https://coveralls.io/github/Applelo/compotes?branch=main)
+
+# Compotes
+
+> A components library focused on customization/accessibility
+
+To learn more, check the *[documentation](https://compotes.dev)*.
+
+## ✨ Features
+
+- 👨‍🎨 Minimal CSS to do your customization
+- 🦾 Accessibility in mind
+- 📠 Fully typed
+- 🧩 Framework agnostic
+- 📦 Simple components ready to use
+- 🪶 Lightweight
+
+## 🍏 Compotes
+
+- Collapse/Accordion ([demo](https://compotes.dev/demo/collapse.html))
+- Drag ([demo](https://compotes.dev/demo/drag.html))
+- Drilldown ([demo](https://compotes.dev/demo/drilldown.html))
+- Dropdown ([demo](https://compotes.dev/demo/dropdown.html))
+- Marquee ([demo](https://compotes.dev/demo/marquee.html))
+<!--
+- Tabs
+-->
+
+And more to come!
+
+## 🍯 Pots
+
+<details>
+<summary>Vanilla JS/TS</summary><br>
+
+```bash
+npm i -D compotes
+
+# yarn
+yarn add -D compotes
+
+# pnpm
+pnpm add -D compotes
+
+#bun
+bun add -D compotes
+```
+
+<br></details>
+
+<details>
+<summary>Vue 3</summary><br>
+
+```bash
+npm i -D @compotes/vue
+
+# yarn
+yarn add -D @compotes/vue
+
+# pnpm
+pnpm add -D @compotes/vue
+
+#bun
+bun add -D @compotes/vue
+```
+
+<br></details>
+
+<!-- <details>
+<summary>Nuxt 3</summary><br>
+
+```bash
+npm i -D @compotes/nuxt
+
+# yarn
+yarn add -D @compotes/nuxt
+
+# pnpm
+pnpm add -D @compotes/nuxt
+```
+
+<br></details> -->
+
+## 🙋‍♂️ Why ?
+
+A lot of component libraries are already shipped with styles but as a Front End developer, I always want to override a lot. Furthermore, they are not always accessible or they are shipped with jQuery.
+
+There are some good libraries like [React Aria](https://react-spectrum.adobe.com/react-aria/react-aria-components.html) but it's made to work on one framework and I work on different tech like Wordpress, Symfony or VueJS.
+
+> This library provides only the compotes and it's up to you to make a tart.
+
+## AI Usage
+
+This project uses AI to improve and keep the documentation up to date. It also helps me writing the connection between core components to VueJS.
+
+## 👨‍💼 License
+
+MIT