@vielzeug/refine 2.1.0 → 2.1.3

package/dist/typing-indicator.cjs

@@ -1,4 +1,4 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./styles/mixins/accessibility.css.cjs"),t=require("./styles/mixins/shape.css.cjs"),n=require("./styles/mixins/theme.css.cjs"),r=require("./core/announcer.cjs"),i=require("./shared/prop-bundles.cjs"),a=require("./feedback/typing-indicator/typing-indicator.css.cjs");let o=require("@vielzeug/ore"),s=require("@vielzeug/ripple/watch");var c=`ore-typing-indicator`;(0,o.define)(c,{props:{...i.themableBundle,...i.sizableBundle,label:o.prop.string(`Typing…`)},setup(e){return(0,s.watch)(()=>e.label.value,e=>r.announce(e??``),{immediate:!0}),o.html`
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./styles/mixins/accessibility.css.cjs"),t=require("./styles/mixins/shape.css.cjs"),n=require("./styles/mixins/theme.css.cjs"),r=require("./core/announcer.cjs"),i=require("./shared/prop-bundles.cjs"),a=require("./feedback/typing-indicator/typing-indicator.css.cjs");let o=require("@vielzeug/ore"),s=require("@vielzeug/ripple");var c=`ore-typing-indicator`;(0,o.define)(c,{props:{...i.themableBundle,...i.sizableBundle,label:o.prop.string(`Typing…`)},setup(e){return(0,s.watch)(()=>e.label.value,e=>r.announce(e??``),{immediate:!0}),o.html`
       <span class="dots" part="dots" aria-hidden="true">
         <span class="dot" part="dot"></span>
         <span class="dot" part="dot"></span>

package/dist/typing-indicator.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"typing-indicator.cjs","names":[],"sources":["../src/feedback/typing-indicator/typing-indicator.ts"],"sourcesContent":["import { define, html, prop } from '@vielzeug/ore';\nimport { watch } from '@vielzeug/ripple/watch';\n\nimport type { ComponentSize, ThemeColor } from '../../types';\n\nimport { announce } from '../../core';\nimport { sizableBundle, themableBundle } from '../../shared';\nimport { colorThemeMixin, reducedMotionMixin, sizeVariantMixin } from '../../styles';\nimport componentStyles from './typing-indicator.css?inline';\n\n/** Typing indicator component properties */\nexport type OreTypingIndicatorProps = {\n  /** Theme color for the dots */\n  color?: ThemeColor;\n  /** Accessible label announced once via a polite live region (default: `\"Typing…\"`) */\n  label?: string;\n  /** Dot size preset */\n  size?: ComponentSize;\n};\n\n/**\n * Three bouncing dots signaling that the other side of a conversation is composing a reply —\n * the moment before any content exists. For a message whose content is already streaming in,\n * use `ore-chat-message`'s `streaming` attribute (a blinking cursor) instead.\n *\n * The dots are decorative (`aria-hidden`) — `label` is the entire accessibility contract,\n * announced through the shared singleton live region (`core/announcer.ts`) rather than a\n * static `aria-live` element in the template. A live region populated in the same paint as\n * its own insertion is unreliable across browsers/screen readers; routing through the shared\n * announcer (pre-existing region, clear-then-set) is the same pattern already used for other\n * transient status messages across this package.\n *\n * @element ore-typing-indicator\n *\n * @attr {string} label - Accessible label announced once via a polite live region (default: \"Typing…\")\n * @attr {string} color - Theme color: 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error'\n * @attr {string} size - 'sm' | 'md' | 'lg'\n *\n * @cssprop --typing-indicator-color - Dot color\n * @cssprop --typing-indicator-size - Dot diameter\n * @cssprop --typing-indicator-gap - Gap between dots\n *\n * @part dots - Dots container.\n * @part dot - Individual dot element.\n * @example\n * ```html\n * <ore-typing-indicator></ore-typing-indicator>\n * <ore-typing-indicator label=\"Assistant is typing…\" color=\"primary\"></ore-typing-indicator>\n * ```\n */\nexport const TYPING_INDICATOR_TAG = 'ore-typing-indicator' as const;\ndefine<OreTypingIndicatorProps>(TYPING_INDICATOR_TAG, {\n  props: {\n    ...themableBundle,\n    ...sizableBundle,\n    label: prop.string('Typing…'),\n  },\n  setup(props) {\n    watch(\n      () => props.label.value,\n      (label) => announce(label ?? ''),\n      { immediate: true },\n    );\n\n    return html`\n      <span class=\"dots\" part=\"dots\" aria-hidden=\"true\">\n        <span class=\"dot\" part=\"dot\"></span>\n        <span class=\"dot\" part=\"dot\"></span>\n        <span class=\"dot\" part=\"dot\"></span>\n      </span>\n    `;\n  },\n  styles: [\n    colorThemeMixin,\n    reducedMotionMixin,\n    sizeVariantMixin({\n      lg: {\n        gap: 'var(--typing-indicator-gap, var(--size-1-5))',\n        size: 'var(--typing-indicator-size, var(--size-2-5))',\n      },\n      md: { gap: 'var(--typing-indicator-gap, var(--size-1))', size: 'var(--typing-indicator-size, var(--size-2))' },\n      sm: {\n        gap: 'var(--typing-indicator-gap, var(--size-1))',\n        size: 'var(--typing-indicator-size, var(--size-1-5))',\n      },\n    }),\n    componentStyles,\n  ],\n});\n"],"mappings":"gaAkDA,IAAa,EAAuB,wBACpC,EAAA,EAAA,OAAA,CAAgC,EAAsB,CACpD,MAAO,CACL,GAAG,EAAA,eACH,GAAG,EAAA,cACH,MAAO,EAAA,KAAK,OAAO,SAAS,CAC9B,EACA,MAAM,EAAO,CAOX,OANA,EAAA,EAAA,MAAA,KACQ,EAAM,MAAM,MACjB,GAAU,EAAA,SAAS,GAAS,EAAE,EAC/B,CAAE,UAAW,EAAK,CACpB,EAEO,EAAA,IAAI;;;;;;KAOb,EACA,OAAQ,CACN,EAAA,gBACA,EAAA,mBACA,EAAA,iBAAiB,CACf,GAAI,CACF,IAAK,+CACL,KAAM,+CACR,EACA,GAAI,CAAE,IAAK,6CAA8C,KAAM,6CAA8C,EAC7G,GAAI,CACF,IAAK,6CACL,KAAM,+CACR,CACF,CAAC,EACD,EAAA,OACF,CACF,CAAC"}
+{"version":3,"file":"typing-indicator.cjs","names":[],"sources":["../src/feedback/typing-indicator/typing-indicator.ts"],"sourcesContent":["import { define, html, prop } from '@vielzeug/ore';\nimport { watch } from '@vielzeug/ripple';\nimport { announce } from '../../core';\nimport { sizableBundle, themableBundle } from '../../shared';\nimport { colorThemeMixin, reducedMotionMixin, sizeVariantMixin } from '../../styles';\nimport type { ComponentSize, ThemeColor } from '../../types';\nimport componentStyles from './typing-indicator.css?inline';\n\n/** Typing indicator component properties */\nexport type OreTypingIndicatorProps = {\n  /** Theme color for the dots */\n  color?: ThemeColor;\n  /** Accessible label announced once via a polite live region (default: `\"Typing…\"`) */\n  label?: string;\n  /** Dot size preset */\n  size?: ComponentSize;\n};\n\n/**\n * Three bouncing dots signaling that the other side of a conversation is composing a reply —\n * the moment before any content exists. For a message whose content is already streaming in,\n * use `ore-chat-message`'s `streaming` attribute (a blinking cursor) instead.\n *\n * The dots are decorative (`aria-hidden`) — `label` is the entire accessibility contract,\n * announced through the shared singleton live region (`core/announcer.ts`) rather than a\n * static `aria-live` element in the template. A live region populated in the same paint as\n * its own insertion is unreliable across browsers/screen readers; routing through the shared\n * announcer (pre-existing region, clear-then-set) is the same pattern already used for other\n * transient status messages across this package.\n *\n * @element ore-typing-indicator\n *\n * @attr {string} label - Accessible label announced once via a polite live region (default: \"Typing…\")\n * @attr {string} color - Theme color: 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error'\n * @attr {string} size - 'sm' | 'md' | 'lg'\n *\n * @cssprop --typing-indicator-color - Dot color\n * @cssprop --typing-indicator-size - Dot diameter\n * @cssprop --typing-indicator-gap - Gap between dots\n *\n * @part dots - Dots container.\n * @part dot - Individual dot element.\n * @example\n * ```html\n * <ore-typing-indicator></ore-typing-indicator>\n * <ore-typing-indicator label=\"Assistant is typing…\" color=\"primary\"></ore-typing-indicator>\n * ```\n */\nexport const TYPING_INDICATOR_TAG = 'ore-typing-indicator' as const;\ndefine<OreTypingIndicatorProps>(TYPING_INDICATOR_TAG, {\n  props: {\n    ...themableBundle,\n    ...sizableBundle,\n    label: prop.string('Typing…'),\n  },\n  setup(props) {\n    watch(\n      () => props.label.value,\n      (label) => announce(label ?? ''),\n      { immediate: true },\n    );\n\n    return html`\n      <span class=\"dots\" part=\"dots\" aria-hidden=\"true\">\n        <span class=\"dot\" part=\"dot\"></span>\n        <span class=\"dot\" part=\"dot\"></span>\n        <span class=\"dot\" part=\"dot\"></span>\n      </span>\n    `;\n  },\n  styles: [\n    colorThemeMixin,\n    reducedMotionMixin,\n    sizeVariantMixin({\n      lg: {\n        gap: 'var(--typing-indicator-gap, var(--size-1-5))',\n        size: 'var(--typing-indicator-size, var(--size-2-5))',\n      },\n      md: { gap: 'var(--typing-indicator-gap, var(--size-1))', size: 'var(--typing-indicator-size, var(--size-2))' },\n      sm: {\n        gap: 'var(--typing-indicator-gap, var(--size-1))',\n        size: 'var(--typing-indicator-size, var(--size-1-5))',\n      },\n    }),\n    componentStyles,\n  ],\n});\n"],"mappings":"0ZAgDA,IAAa,EAAuB,wBACpC,EAAA,EAAA,OAAA,CAAgC,EAAsB,CACpD,MAAO,CACL,GAAG,EAAA,eACH,GAAG,EAAA,cACH,MAAO,EAAA,KAAK,OAAO,SAAS,CAC9B,EACA,MAAM,EAAO,CAOX,OANA,EAAA,EAAA,MAAA,KACQ,EAAM,MAAM,MACjB,GAAU,EAAA,SAAS,GAAS,EAAE,EAC/B,CAAE,UAAW,EAAK,CACpB,EAEO,EAAA,IAAI;;;;;;KAOb,EACA,OAAQ,CACN,EAAA,gBACA,EAAA,mBACA,EAAA,iBAAiB,CACf,GAAI,CACF,IAAK,+CACL,KAAM,+CACR,EACA,GAAI,CAAE,IAAK,6CAA8C,KAAM,6CAA8C,EAC7G,GAAI,CACF,IAAK,6CACL,KAAM,+CACR,CACF,CAAC,EACD,EAAA,OACF,CACF,CAAC"}

package/dist/typing-indicator.js

@@ -5,7 +5,7 @@ import { announce as r } from "./core/announcer.js";
 import { sizableBundle as i, themableBundle as a } from "./shared/prop-bundles.js";
 import o from "./feedback/typing-indicator/typing-indicator.css.js";
 import { define as s, html as c, prop as l } from "@vielzeug/ore";
-import { watch as u } from "@vielzeug/ripple/watch";
+import { watch as u } from "@vielzeug/ripple";
 //#region src/feedback/typing-indicator/typing-indicator.ts
 var d = "ore-typing-indicator";
 s(d, {

package/dist/typing-indicator.js.map

@@ -1 +1 @@
-{"version":3,"file":"typing-indicator.js","names":[],"sources":["../src/feedback/typing-indicator/typing-indicator.ts"],"sourcesContent":["import { define, html, prop } from '@vielzeug/ore';\nimport { watch } from '@vielzeug/ripple/watch';\n\nimport type { ComponentSize, ThemeColor } from '../../types';\n\nimport { announce } from '../../core';\nimport { sizableBundle, themableBundle } from '../../shared';\nimport { colorThemeMixin, reducedMotionMixin, sizeVariantMixin } from '../../styles';\nimport componentStyles from './typing-indicator.css?inline';\n\n/** Typing indicator component properties */\nexport type OreTypingIndicatorProps = {\n  /** Theme color for the dots */\n  color?: ThemeColor;\n  /** Accessible label announced once via a polite live region (default: `\"Typing…\"`) */\n  label?: string;\n  /** Dot size preset */\n  size?: ComponentSize;\n};\n\n/**\n * Three bouncing dots signaling that the other side of a conversation is composing a reply —\n * the moment before any content exists. For a message whose content is already streaming in,\n * use `ore-chat-message`'s `streaming` attribute (a blinking cursor) instead.\n *\n * The dots are decorative (`aria-hidden`) — `label` is the entire accessibility contract,\n * announced through the shared singleton live region (`core/announcer.ts`) rather than a\n * static `aria-live` element in the template. A live region populated in the same paint as\n * its own insertion is unreliable across browsers/screen readers; routing through the shared\n * announcer (pre-existing region, clear-then-set) is the same pattern already used for other\n * transient status messages across this package.\n *\n * @element ore-typing-indicator\n *\n * @attr {string} label - Accessible label announced once via a polite live region (default: \"Typing…\")\n * @attr {string} color - Theme color: 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error'\n * @attr {string} size - 'sm' | 'md' | 'lg'\n *\n * @cssprop --typing-indicator-color - Dot color\n * @cssprop --typing-indicator-size - Dot diameter\n * @cssprop --typing-indicator-gap - Gap between dots\n *\n * @part dots - Dots container.\n * @part dot - Individual dot element.\n * @example\n * ```html\n * <ore-typing-indicator></ore-typing-indicator>\n * <ore-typing-indicator label=\"Assistant is typing…\" color=\"primary\"></ore-typing-indicator>\n * ```\n */\nexport const TYPING_INDICATOR_TAG = 'ore-typing-indicator' as const;\ndefine<OreTypingIndicatorProps>(TYPING_INDICATOR_TAG, {\n  props: {\n    ...themableBundle,\n    ...sizableBundle,\n    label: prop.string('Typing…'),\n  },\n  setup(props) {\n    watch(\n      () => props.label.value,\n      (label) => announce(label ?? ''),\n      { immediate: true },\n    );\n\n    return html`\n      <span class=\"dots\" part=\"dots\" aria-hidden=\"true\">\n        <span class=\"dot\" part=\"dot\"></span>\n        <span class=\"dot\" part=\"dot\"></span>\n        <span class=\"dot\" part=\"dot\"></span>\n      </span>\n    `;\n  },\n  styles: [\n    colorThemeMixin,\n    reducedMotionMixin,\n    sizeVariantMixin({\n      lg: {\n        gap: 'var(--typing-indicator-gap, var(--size-1-5))',\n        size: 'var(--typing-indicator-size, var(--size-2-5))',\n      },\n      md: { gap: 'var(--typing-indicator-gap, var(--size-1))', size: 'var(--typing-indicator-size, var(--size-2))' },\n      sm: {\n        gap: 'var(--typing-indicator-gap, var(--size-1))',\n        size: 'var(--typing-indicator-size, var(--size-1-5))',\n      },\n    }),\n    componentStyles,\n  ],\n});\n"],"mappings":";;;;;;;;;AAkDA,IAAa,IAAuB;AACpC,EAAgC,GAAsB;CACpD,OAAO;EACL,GAAG;EACH,GAAG;EACH,OAAO,EAAK,OAAO,SAAS;CAC9B;CACA,MAAM,GAAO;EAOX,OANA,QACQ,EAAM,MAAM,QACjB,MAAU,EAAS,KAAS,EAAE,GAC/B,EAAE,WAAW,GAAK,CACpB,GAEO,CAAI;;;;;;;CAOb;CACA,QAAQ;EACN;EACA;EACA,EAAiB;GACf,IAAI;IACF,KAAK;IACL,MAAM;GACR;GACA,IAAI;IAAE,KAAK;IAA8C,MAAM;GAA8C;GAC7G,IAAI;IACF,KAAK;IACL,MAAM;GACR;EACF,CAAC;EACD;CACF;AACF,CAAC"}
+{"version":3,"file":"typing-indicator.js","names":[],"sources":["../src/feedback/typing-indicator/typing-indicator.ts"],"sourcesContent":["import { define, html, prop } from '@vielzeug/ore';\nimport { watch } from '@vielzeug/ripple';\nimport { announce } from '../../core';\nimport { sizableBundle, themableBundle } from '../../shared';\nimport { colorThemeMixin, reducedMotionMixin, sizeVariantMixin } from '../../styles';\nimport type { ComponentSize, ThemeColor } from '../../types';\nimport componentStyles from './typing-indicator.css?inline';\n\n/** Typing indicator component properties */\nexport type OreTypingIndicatorProps = {\n  /** Theme color for the dots */\n  color?: ThemeColor;\n  /** Accessible label announced once via a polite live region (default: `\"Typing…\"`) */\n  label?: string;\n  /** Dot size preset */\n  size?: ComponentSize;\n};\n\n/**\n * Three bouncing dots signaling that the other side of a conversation is composing a reply —\n * the moment before any content exists. For a message whose content is already streaming in,\n * use `ore-chat-message`'s `streaming` attribute (a blinking cursor) instead.\n *\n * The dots are decorative (`aria-hidden`) — `label` is the entire accessibility contract,\n * announced through the shared singleton live region (`core/announcer.ts`) rather than a\n * static `aria-live` element in the template. A live region populated in the same paint as\n * its own insertion is unreliable across browsers/screen readers; routing through the shared\n * announcer (pre-existing region, clear-then-set) is the same pattern already used for other\n * transient status messages across this package.\n *\n * @element ore-typing-indicator\n *\n * @attr {string} label - Accessible label announced once via a polite live region (default: \"Typing…\")\n * @attr {string} color - Theme color: 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error'\n * @attr {string} size - 'sm' | 'md' | 'lg'\n *\n * @cssprop --typing-indicator-color - Dot color\n * @cssprop --typing-indicator-size - Dot diameter\n * @cssprop --typing-indicator-gap - Gap between dots\n *\n * @part dots - Dots container.\n * @part dot - Individual dot element.\n * @example\n * ```html\n * <ore-typing-indicator></ore-typing-indicator>\n * <ore-typing-indicator label=\"Assistant is typing…\" color=\"primary\"></ore-typing-indicator>\n * ```\n */\nexport const TYPING_INDICATOR_TAG = 'ore-typing-indicator' as const;\ndefine<OreTypingIndicatorProps>(TYPING_INDICATOR_TAG, {\n  props: {\n    ...themableBundle,\n    ...sizableBundle,\n    label: prop.string('Typing…'),\n  },\n  setup(props) {\n    watch(\n      () => props.label.value,\n      (label) => announce(label ?? ''),\n      { immediate: true },\n    );\n\n    return html`\n      <span class=\"dots\" part=\"dots\" aria-hidden=\"true\">\n        <span class=\"dot\" part=\"dot\"></span>\n        <span class=\"dot\" part=\"dot\"></span>\n        <span class=\"dot\" part=\"dot\"></span>\n      </span>\n    `;\n  },\n  styles: [\n    colorThemeMixin,\n    reducedMotionMixin,\n    sizeVariantMixin({\n      lg: {\n        gap: 'var(--typing-indicator-gap, var(--size-1-5))',\n        size: 'var(--typing-indicator-size, var(--size-2-5))',\n      },\n      md: { gap: 'var(--typing-indicator-gap, var(--size-1))', size: 'var(--typing-indicator-size, var(--size-2))' },\n      sm: {\n        gap: 'var(--typing-indicator-gap, var(--size-1))',\n        size: 'var(--typing-indicator-size, var(--size-1-5))',\n      },\n    }),\n    componentStyles,\n  ],\n});\n"],"mappings":";;;;;;;;;AAgDA,IAAa,IAAuB;AACpC,EAAgC,GAAsB;CACpD,OAAO;EACL,GAAG;EACH,GAAG;EACH,OAAO,EAAK,OAAO,SAAS;CAC9B;CACA,MAAM,GAAO;EAOX,OANA,QACQ,EAAM,MAAM,QACjB,MAAU,EAAS,KAAS,EAAE,GAC/B,EAAE,WAAW,GAAK,CACpB,GAEO,CAAI;;;;;;;CAOb;CACA,QAAQ;EACN;EACA;EACA,EAAiB;GACf,IAAI;IACF,KAAK;IACL,MAAM;GACR;GACA,IAAI;IAAE,KAAK;IAA8C,MAAM;GAA8C;GAC7G,IAAI;IACF,KAAK;IACL,MAAM;GACR;EACF,CAAC;EACD;CACF;AACF,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vielzeug/refine",
-  "version": "2.1.0",
+  "version": "2.1.3",
   "description": "Accessible, themeable web components built on Ore custom element primitives",
   "keywords": [
     "web-components",
@@ -15,56 +15,26 @@
   ],
   "homepage": "https://vielzeug.dev/refine/",
   "repository": {
+    "directory": "packages/refine",
     "type": "git",
-    "url": "https://github.com/helmuthdu/vielzeug",
-    "directory": "packages/refine"
+    "url": "https://github.com/helmuthdu/vielzeug"
   },
   "bugs": {
     "url": "https://github.com/helmuthdu/vielzeug/issues"
   },
+  "type": "module",
   "engines": {
     "node": ">=22"
   },
-  "type": "module",
-  "customElements": "dist/custom-elements.json",
   "files": [
     "dist"
   ],
   "types": "./dist/index.d.ts",
   "exports": {
     ".": {
-      "types": "./dist/index.d.ts",
       "import": "./dist/index.js",
-      "require": "./dist/index.cjs"
-    },
-    "./styles/animation.css": {
-      "import": "./dist/styles/animation.css",
-      "default": "./dist/styles/animation.css"
-    },
-    "./styles/layers.css": {
-      "import": "./dist/styles/layer.css",
-      "default": "./dist/styles/layer.css"
-    },
-    "./styles/preflight.css": {
-      "import": "./dist/styles/preflight.css",
-      "default": "./dist/styles/preflight.css"
-    },
-    "./styles/theme.css": {
-      "import": "./dist/styles/theme.css",
-      "default": "./dist/styles/theme.css"
-    },
-    "./tokens.css": {
-      "import": "./dist/styles/tokens.css",
-      "default": "./dist/styles/tokens.css"
-    },
-    "./frameworks/elements": {
-      "types": "./dist/frameworks/elements.d.ts"
-    },
-    "./frameworks/react": {
-      "types": "./dist/frameworks/react.d.ts"
-    },
-    "./frameworks/vue": {
-      "types": "./dist/frameworks/vue.d.ts"
+      "require": "./dist/index.cjs",
+      "types": "./dist/index.d.ts"
     },
     "./accordion": {
       "import": "./dist/accordion.js",
@@ -201,6 +171,15 @@
       "require": "./dist/file-input.cjs",
       "types": "./dist/inputs/file-input/file-input.d.ts"
     },
+    "./frameworks/elements": {
+      "types": "./dist/frameworks/elements.d.ts"
+    },
+    "./frameworks/react": {
+      "types": "./dist/frameworks/react.d.ts"
+    },
+    "./frameworks/vue": {
+      "types": "./dist/frameworks/vue.d.ts"
+    },
     "./grid": {
       "import": "./dist/grid.js",
       "require": "./dist/grid.cjs",
@@ -336,6 +315,22 @@
       "require": "./dist/stepper.cjs",
       "types": "./dist/content/stepper/stepper.d.ts"
     },
+    "./styles/animation.css": {
+      "default": "./dist/styles/animation.css",
+      "import": "./dist/styles/animation.css"
+    },
+    "./styles/layers.css": {
+      "default": "./dist/styles/layer.css",
+      "import": "./dist/styles/layer.css"
+    },
+    "./styles/preflight.css": {
+      "default": "./dist/styles/preflight.css",
+      "import": "./dist/styles/preflight.css"
+    },
+    "./styles/theme.css": {
+      "default": "./dist/styles/theme.css",
+      "import": "./dist/styles/theme.css"
+    },
     "./switch": {
       "import": "./dist/switch.js",
       "require": "./dist/switch.cjs",
@@ -381,6 +376,10 @@
       "require": "./dist/toast.cjs",
       "types": "./dist/feedback/toast/toast.d.ts"
     },
+    "./tokens.css": {
+      "default": "./dist/styles/tokens.css",
+      "import": "./dist/styles/tokens.css"
+    },
     "./tooltip": {
       "import": "./dist/tooltip.js",
       "require": "./dist/tooltip.cjs",
@@ -392,68 +391,8 @@
       "types": "./dist/feedback/typing-indicator/typing-indicator.d.ts"
     }
   },
-  "scripts": {
-    "analyze": "custom-elements-manifest analyze --config scripts/refine-manifest.mjs",
-    "build": "pnpm run check:theme && pnpm run check:manifest && pnpm run check:css-contract && vite build && pnpm run build:bundle && cp -r src/styles/*.css dist/styles && pnpm run build:types && pnpm run analyze && pnpm run gen:framework-types",
-    "build:types": "tsc -p tsconfig.declarations.json",
-    "check:css-contract": "node ./scripts/check-css-contract.mjs",
-    "check:manifest": "node ./scripts/refine-manifest.mjs check-exports",
-    "check:theme": "node ./scripts/theme-tokens.mjs check",
-    "dev": "vite",
-    "fix": "eslint --fix src",
-    "gen:framework-types": "node ./scripts/generate-framework-types.mjs",
-    "lint": "eslint src",
-    "preview": "vite preview",
-    "sync:exports": "node ./scripts/refine-manifest.mjs sync-exports",
-    "sync:theme": "node ./scripts/theme-tokens.mjs sync",
-    "test": "vitest",
-    "test:e2e": "playwright test",
-    "build:bundle": "vite build --config vite.bundle.config.ts",
-    "build:bundle:watch": "vite build --watch --config vite.bundle.config.ts"
-  },
-  "dependencies": {
-    "@vielzeug/arsenal": "2.0.1",
-    "@vielzeug/assay": "2.0.1",
-    "@vielzeug/dnd": "2.0.0",
-    "@vielzeug/keymap": "2.0.0",
-    "@vielzeug/orbit": "2.0.1",
-    "@vielzeug/ore": "2.0.3",
-    "@vielzeug/ripple": "2.1.0",
-    "@vielzeug/tempo": "2.0.0",
-    "lucide": "^1.28.0"
-  },
-  "devDependencies": {
-    "@types/node": "^26.1.2",
-    "@axe-core/playwright": "^4.12.1",
-    "@custom-elements-manifest/analyzer": "^0.11.0",
-    "@playwright/test": "^1.62.1",
-    "@types/culori": "^4.0.1",
-    "axe-core": "^4.12.1",
-    "browserslist": "^4.28.7",
-    "culori": "^4.0.2",
-    "lightningcss": "^1.33.0",
-    "prettier": "^3.9.6",
-    "stylelint": "^17.14.1",
-    "typescript": "^6.0.3",
-    "vite": "^8.2.0",
-    "vitest": "^4.1.10"
-  },
-  "sideEffects": [
-    "./dist/*.js",
-    "./dist/*.cjs",
-    "./dist/styles/**"
-  ],
   "typesVersions": {
     "*": {
-      "frameworks/elements": [
-        "dist/frameworks/elements.d.ts"
-      ],
-      "frameworks/react": [
-        "dist/frameworks/react.d.ts"
-      ],
-      "frameworks/vue": [
-        "dist/frameworks/vue.d.ts"
-      ],
       "accordion": [
         "dist/disclosure/accordion/accordion.d.ts"
       ],
@@ -535,6 +474,15 @@
       "file-input": [
         "dist/inputs/file-input/file-input.d.ts"
       ],
+      "frameworks/elements": [
+        "dist/frameworks/elements.d.ts"
+      ],
+      "frameworks/react": [
+        "dist/frameworks/react.d.ts"
+      ],
+      "frameworks/vue": [
+        "dist/frameworks/vue.d.ts"
+      ],
       "grid": [
         "dist/layout/grid/grid.d.ts"
       ],
@@ -650,5 +598,56 @@
         "dist/feedback/typing-indicator/typing-indicator.d.ts"
       ]
     }
-  }
+  },
+  "sideEffects": [
+    "./dist/*.js",
+    "./dist/*.cjs",
+    "./dist/styles/**"
+  ],
+  "scripts": {
+    "analyze": "custom-elements-manifest analyze --config scripts/refine-manifest.mjs",
+    "build": "pnpm run check:theme && pnpm run check:manifest && pnpm run check:css-contract && vite build && pnpm run build:bundle && cp -r src/styles/*.css dist/styles && pnpm run build:types && pnpm run analyze && pnpm run gen:framework-types",
+    "build:bundle": "vite build --config vite.bundle.config.ts",
+    "build:bundle:watch": "vite build --watch --config vite.bundle.config.ts",
+    "build:types": "tsc -p tsconfig.declarations.json",
+    "check:css-contract": "node ./scripts/check-css-contract.mjs",
+    "check:manifest": "node ./scripts/refine-manifest.mjs check-exports",
+    "check:theme": "node ./scripts/theme-tokens.mjs check",
+    "dev": "vite",
+    "fix": "biome check --write src",
+    "gen:framework-types": "node ./scripts/generate-framework-types.mjs",
+    "lint": "biome ci src",
+    "preview": "vite preview",
+    "sync:exports": "node ./scripts/refine-manifest.mjs sync-exports",
+    "sync:theme": "node ./scripts/theme-tokens.mjs sync",
+    "test": "vitest",
+    "test:e2e": "playwright test"
+  },
+  "dependencies": {
+    "@vielzeug/arsenal": "2.0.1",
+    "@vielzeug/assay": "2.0.1",
+    "@vielzeug/dnd": "2.0.0",
+    "@vielzeug/keymap": "2.0.0",
+    "@vielzeug/orbit": "2.0.2",
+    "@vielzeug/ore": "2.0.6",
+    "@vielzeug/ripple": "2.2.0",
+    "@vielzeug/tempo": "2.0.0",
+    "lucide": "^1.31.0"
+  },
+  "devDependencies": {
+    "@axe-core/playwright": "^4.13.0",
+    "@biomejs/biome": "2.5.8",
+    "@custom-elements-manifest/analyzer": "^0.11.0",
+    "@playwright/test": "^1.62.1",
+    "@types/culori": "^4.0.1",
+    "@types/node": "^26.2.0",
+    "axe-core": "^4.13.0",
+    "browserslist": "^4.28.8",
+    "culori": "^4.0.2",
+    "lightningcss": "^1.33.0",
+    "typescript": "^6.0.3",
+    "vite": "^8.2.1",
+    "vitest": "^4.1.10"
+  },
+  "customElements": "dist/custom-elements.json"
 }