@youcan/celeste 0.22.0 → 0.22.1

package/ai/README.md

@@ -1,6 +1,6 @@
 # Celeste agent indexes
 
-Generated from source for `@youcan/celeste@0.22.0`. Do not edit.
+Generated from source for `@youcan/celeste@0.22.1`. Do not edit.
 
 - `component-registry.json` — every component's props, events, slots, story and usage example, and
   every exported helper such as `toast`

package/ai/component-registry.json

@@ -1,7 +1,7 @@
 {
   "schemaVersion": 1,
-  "version": "0.22.0",
-  "generatedAt": "2026-10-14T03:57:23.172Z",
+  "version": "0.22.1",
+  "generatedAt": "2026-10-16T23:45:51.671Z",
   "components": {
     "Alert": {
       "name": "Alert",

package/ai/icons.json

@@ -1,7 +1,7 @@
 {
   "schemaVersion": 1,
-  "version": "0.22.0",
-  "generatedAt": "2026-10-14T03:57:19.806Z",
+  "version": "0.22.1",
+  "generatedAt": "2026-10-16T23:45:48.828Z",
   "prefix": "celeste",
   "icons": [
     {

package/ai/tokens.json

@@ -1,7 +1,7 @@
 {
   "schemaVersion": 1,
-  "version": "0.22.0",
-  "generatedAt": "2026-10-14T03:57:19.806Z",
+  "version": "0.22.1",
+  "generatedAt": "2026-10-16T23:45:48.828Z",
   "tokens": [
     {
       "name": "animation-extra-fast",

package/dist/celeste.css

@@ -974,7 +974,7 @@ to {
 .celeste-bar-chart [data-bar][data-hidden=true] {
   transition: opacity var(--animation-fast) ease-out;
   opacity: 0;
-}.celeste-button[data-v-86a7957d] {
+}.celeste-button[data-v-0aeead06] {
   display: inline-flex;
   box-sizing: border-box;
   align-items: center;
@@ -987,231 +987,232 @@ to {
   background-color: transparent;
   font: var(--label-sm);
   text-decoration: none;
+  white-space: nowrap;
   cursor: pointer;
 }
-.celeste-button[data-v-86a7957d]:disabled {
+.celeste-button[data-v-0aeead06]:disabled {
   background-color: var(--color-bg-weak-50);
   color: var(--color-text-disabled-300);
   cursor: default;
 }
-.celeste-button[data-v-86a7957d] i {
+.celeste-button[data-v-0aeead06] i {
   flex-shrink: 0;
   width: 20px;
   height: 20px;
 }
-.celeste-button-size-xxs[data-v-86a7957d] {
+.celeste-button-size-xxs[data-v-0aeead06] {
   gap: var(--spacing-4);
   height: 28px;
   padding: var(--spacing-4) var(--spacing-6);
   border-radius: var(--radius-8);
 }
-.celeste-button-size-xxs[data-v-86a7957d]:has(> :only-child:is(i)) {
+.celeste-button-size-xxs[data-v-0aeead06]:has(> :only-child:is(i)) {
   padding: var(--spacing-4);
 }
-.celeste-button-size-xs[data-v-86a7957d] {
+.celeste-button-size-xs[data-v-0aeead06] {
   gap: var(--spacing-4);
   height: 32px;
   padding: var(--spacing-6) var(--spacing-8);
   border-radius: var(--radius-8);
 }
-.celeste-button-size-xs[data-v-86a7957d]:has(> :only-child:is(i)) {
+.celeste-button-size-xs[data-v-0aeead06]:has(> :only-child:is(i)) {
   padding: var(--spacing-6);
 }
-.celeste-button-size-sm[data-v-86a7957d] {
+.celeste-button-size-sm[data-v-0aeead06] {
   gap: var(--spacing-6);
   height: 36px;
   padding: var(--spacing-8) var(--spacing-10);
   border-radius: var(--radius-8);
 }
-.celeste-button-size-sm[data-v-86a7957d]:has(> :only-child:is(i)) {
+.celeste-button-size-sm[data-v-0aeead06]:has(> :only-child:is(i)) {
   padding: var(--spacing-8);
 }
-.celeste-button-size-md[data-v-86a7957d] {
+.celeste-button-size-md[data-v-0aeead06] {
   gap: var(--spacing-6);
   height: 40px;
   padding: var(--spacing-10) var(--spacing-12);
   border-radius: var(--radius-10);
 }
-.celeste-button-size-md[data-v-86a7957d]:has(> :only-child:is(i)) {
+.celeste-button-size-md[data-v-0aeead06]:has(> :only-child:is(i)) {
   padding: var(--spacing-10);
 }
-.celeste-button-intent-primary:not(:disabled).celeste-button-variant-fill[data-v-86a7957d]:not(:disabled) {
+.celeste-button-intent-primary:not(:disabled).celeste-button-variant-fill[data-v-0aeead06]:not(:disabled) {
   border-color: var(--color-primary-base);
   background-color: var(--color-primary-base);
   box-shadow: none;
   color: var(--color-static-white);
 }
-.celeste-button-intent-primary:not(:disabled).celeste-button-variant-fill[data-v-86a7957d]:not(:disabled):hover:not(:disabled) {
+.celeste-button-intent-primary:not(:disabled).celeste-button-variant-fill[data-v-0aeead06]:not(:disabled):hover:not(:disabled) {
   border-color: var(--color-primary-darker);
   background-color: var(--color-primary-darker);
   color: var(--color-static-white);
 }
-.celeste-button-intent-primary:not(:disabled).celeste-button-variant-fill[data-v-86a7957d]:not(:disabled):focus-visible:not(:disabled) {
+.celeste-button-intent-primary:not(:disabled).celeste-button-variant-fill[data-v-0aeead06]:not(:disabled):focus-visible:not(:disabled) {
   outline: none;
   box-shadow: var(--shadow-buttons-primary-focus);
 }
-.celeste-button-intent-primary:not(:disabled).celeste-button-variant-stroke[data-v-86a7957d]:not(:disabled) {
+.celeste-button-intent-primary:not(:disabled).celeste-button-variant-stroke[data-v-0aeead06]:not(:disabled) {
   border-color: var(--color-primary-base);
   background-color: transparent;
   box-shadow: none;
   color: var(--color-primary-base);
 }
-.celeste-button-intent-primary:not(:disabled).celeste-button-variant-stroke[data-v-86a7957d]:not(:disabled):hover:not(:disabled) {
+.celeste-button-intent-primary:not(:disabled).celeste-button-variant-stroke[data-v-0aeead06]:not(:disabled):hover:not(:disabled) {
   border-color: transparent;
   background-color: var(--color-primary-alpha-10);
   color: var(--color-primary-base);
 }
-.celeste-button-intent-primary:not(:disabled).celeste-button-variant-stroke[data-v-86a7957d]:not(:disabled):focus-visible:not(:disabled) {
+.celeste-button-intent-primary:not(:disabled).celeste-button-variant-stroke[data-v-0aeead06]:not(:disabled):focus-visible:not(:disabled) {
   outline: none;
   box-shadow: var(--shadow-buttons-primary-focus);
 }
-.celeste-button-intent-primary:not(:disabled).celeste-button-variant-lighter[data-v-86a7957d]:not(:disabled) {
+.celeste-button-intent-primary:not(:disabled).celeste-button-variant-lighter[data-v-0aeead06]:not(:disabled) {
   border-color: transparent;
   background-color: var(--color-primary-alpha-10);
   box-shadow: none;
   color: var(--color-primary-base);
 }
-.celeste-button-intent-primary:not(:disabled).celeste-button-variant-lighter[data-v-86a7957d]:not(:disabled):hover:not(:disabled) {
+.celeste-button-intent-primary:not(:disabled).celeste-button-variant-lighter[data-v-0aeead06]:not(:disabled):hover:not(:disabled) {
   border-color: var(--color-primary-base);
   background-color: transparent;
   color: var(--color-primary-base);
 }
-.celeste-button-intent-primary:not(:disabled).celeste-button-variant-lighter[data-v-86a7957d]:not(:disabled):focus-visible:not(:disabled) {
+.celeste-button-intent-primary:not(:disabled).celeste-button-variant-lighter[data-v-0aeead06]:not(:disabled):focus-visible:not(:disabled) {
   outline: none;
   box-shadow: var(--shadow-buttons-primary-focus);
 }
-.celeste-button-intent-primary:not(:disabled).celeste-button-variant-ghost[data-v-86a7957d]:not(:disabled) {
+.celeste-button-intent-primary:not(:disabled).celeste-button-variant-ghost[data-v-0aeead06]:not(:disabled) {
   border-color: transparent;
   background-color: transparent;
   box-shadow: none;
   color: var(--color-primary-base);
 }
-.celeste-button-intent-primary:not(:disabled).celeste-button-variant-ghost[data-v-86a7957d]:not(:disabled):hover:not(:disabled) {
+.celeste-button-intent-primary:not(:disabled).celeste-button-variant-ghost[data-v-0aeead06]:not(:disabled):hover:not(:disabled) {
   border-color: transparent;
   background-color: var(--color-primary-alpha-10);
   color: var(--color-primary-base);
 }
-.celeste-button-intent-primary:not(:disabled).celeste-button-variant-ghost[data-v-86a7957d]:not(:disabled):focus-visible:not(:disabled) {
+.celeste-button-intent-primary:not(:disabled).celeste-button-variant-ghost[data-v-0aeead06]:not(:disabled):focus-visible:not(:disabled) {
   outline: none;
   box-shadow: var(--shadow-buttons-primary-focus);
 }
-.celeste-button-intent-neutral:not(:disabled).celeste-button-variant-fill[data-v-86a7957d]:not(:disabled) {
+.celeste-button-intent-neutral:not(:disabled).celeste-button-variant-fill[data-v-0aeead06]:not(:disabled) {
   border-color: var(--color-bg-strong-950);
   background-color: var(--color-bg-strong-950);
   box-shadow: none;
   color: var(--color-text-white-0);
 }
-.celeste-button-intent-neutral:not(:disabled).celeste-button-variant-fill[data-v-86a7957d]:not(:disabled):hover:not(:disabled) {
+.celeste-button-intent-neutral:not(:disabled).celeste-button-variant-fill[data-v-0aeead06]:not(:disabled):hover:not(:disabled) {
   border-color: transparent;
   background-color: var(--color-bg-surface-800);
   color: var(--color-text-white-0);
 }
-.celeste-button-intent-neutral:not(:disabled).celeste-button-variant-fill[data-v-86a7957d]:not(:disabled):focus-visible:not(:disabled) {
+.celeste-button-intent-neutral:not(:disabled).celeste-button-variant-fill[data-v-0aeead06]:not(:disabled):focus-visible:not(:disabled) {
   outline: none;
   box-shadow: var(--shadow-buttons-important-focus);
 }
-.celeste-button-intent-neutral:not(:disabled).celeste-button-variant-stroke[data-v-86a7957d]:not(:disabled) {
+.celeste-button-intent-neutral:not(:disabled).celeste-button-variant-stroke[data-v-0aeead06]:not(:disabled) {
   border-color: var(--color-bg-soft-200);
   background-color: transparent;
   box-shadow: var(--shadow-regular-xs);
   color: var(--color-text-sub-600);
 }
-.celeste-button-intent-neutral:not(:disabled).celeste-button-variant-stroke[data-v-86a7957d]:not(:disabled):hover:not(:disabled) {
+.celeste-button-intent-neutral:not(:disabled).celeste-button-variant-stroke[data-v-0aeead06]:not(:disabled):hover:not(:disabled) {
   border-color: transparent;
   background-color: var(--color-bg-weak-50);
   color: var(--color-text-strong-950);
 }
-.celeste-button-intent-neutral:not(:disabled).celeste-button-variant-stroke[data-v-86a7957d]:not(:disabled):focus-visible:not(:disabled) {
+.celeste-button-intent-neutral:not(:disabled).celeste-button-variant-stroke[data-v-0aeead06]:not(:disabled):focus-visible:not(:disabled) {
   outline: none;
   box-shadow: var(--shadow-buttons-important-focus);
 }
-.celeste-button-intent-neutral:not(:disabled).celeste-button-variant-lighter[data-v-86a7957d]:not(:disabled) {
+.celeste-button-intent-neutral:not(:disabled).celeste-button-variant-lighter[data-v-0aeead06]:not(:disabled) {
   border-color: var(--color-bg-weak-50);
   background-color: var(--color-bg-weak-50);
   box-shadow: none;
   color: var(--color-text-sub-600);
 }
-.celeste-button-intent-neutral:not(:disabled).celeste-button-variant-lighter[data-v-86a7957d]:not(:disabled):hover:not(:disabled) {
+.celeste-button-intent-neutral:not(:disabled).celeste-button-variant-lighter[data-v-0aeead06]:not(:disabled):hover:not(:disabled) {
   border-color: var(--color-bg-soft-200);
   background-color: transparent;
   color: var(--color-text-strong-950);
 }
-.celeste-button-intent-neutral:not(:disabled).celeste-button-variant-lighter[data-v-86a7957d]:not(:disabled):focus-visible:not(:disabled) {
+.celeste-button-intent-neutral:not(:disabled).celeste-button-variant-lighter[data-v-0aeead06]:not(:disabled):focus-visible:not(:disabled) {
   outline: none;
   box-shadow: var(--shadow-buttons-important-focus);
 }
-.celeste-button-intent-neutral:not(:disabled).celeste-button-variant-ghost[data-v-86a7957d]:not(:disabled) {
+.celeste-button-intent-neutral:not(:disabled).celeste-button-variant-ghost[data-v-0aeead06]:not(:disabled) {
   border-color: transparent;
   background-color: transparent;
   box-shadow: none;
   color: var(--color-text-sub-600);
 }
-.celeste-button-intent-neutral:not(:disabled).celeste-button-variant-ghost[data-v-86a7957d]:not(:disabled):hover:not(:disabled) {
+.celeste-button-intent-neutral:not(:disabled).celeste-button-variant-ghost[data-v-0aeead06]:not(:disabled):hover:not(:disabled) {
   border-color: transparent;
   background-color: var(--color-bg-weak-50);
   color: var(--color-text-strong-950);
 }
-.celeste-button-intent-neutral:not(:disabled).celeste-button-variant-ghost[data-v-86a7957d]:not(:disabled):focus-visible:not(:disabled) {
+.celeste-button-intent-neutral:not(:disabled).celeste-button-variant-ghost[data-v-0aeead06]:not(:disabled):focus-visible:not(:disabled) {
   outline: none;
   box-shadow: var(--shadow-buttons-important-focus);
 }
-.celeste-button-intent-error:not(:disabled).celeste-button-variant-fill[data-v-86a7957d]:not(:disabled) {
+.celeste-button-intent-error:not(:disabled).celeste-button-variant-fill[data-v-0aeead06]:not(:disabled) {
   border-color: var(--color-state-error-base);
   background-color: var(--color-state-error-base);
   box-shadow: none;
   color: var(--color-static-white);
 }
-.celeste-button-intent-error:not(:disabled).celeste-button-variant-fill[data-v-86a7957d]:not(:disabled):hover:not(:disabled) {
+.celeste-button-intent-error:not(:disabled).celeste-button-variant-fill[data-v-0aeead06]:not(:disabled):hover:not(:disabled) {
   border-color: var(--color-red-700);
   background-color: var(--color-red-700);
   color: var(--color-static-white);
 }
-.celeste-button-intent-error:not(:disabled).celeste-button-variant-fill[data-v-86a7957d]:not(:disabled):focus-visible:not(:disabled) {
+.celeste-button-intent-error:not(:disabled).celeste-button-variant-fill[data-v-0aeead06]:not(:disabled):focus-visible:not(:disabled) {
   outline: none;
   box-shadow: var(--shadow-buttons-error-focus);
 }
-.celeste-button-intent-error:not(:disabled).celeste-button-variant-stroke[data-v-86a7957d]:not(:disabled) {
+.celeste-button-intent-error:not(:disabled).celeste-button-variant-stroke[data-v-0aeead06]:not(:disabled) {
   border-color: var(--color-state-error-base);
   background-color: transparent;
   box-shadow: none;
   color: var(--color-state-error-base);
 }
-.celeste-button-intent-error:not(:disabled).celeste-button-variant-stroke[data-v-86a7957d]:not(:disabled):hover:not(:disabled) {
+.celeste-button-intent-error:not(:disabled).celeste-button-variant-stroke[data-v-0aeead06]:not(:disabled):hover:not(:disabled) {
   border-color: transparent;
   background-color: var(--color-red-alpha-10);
   color: var(--color-state-error-base);
 }
-.celeste-button-intent-error:not(:disabled).celeste-button-variant-stroke[data-v-86a7957d]:not(:disabled):focus-visible:not(:disabled) {
+.celeste-button-intent-error:not(:disabled).celeste-button-variant-stroke[data-v-0aeead06]:not(:disabled):focus-visible:not(:disabled) {
   outline: none;
   box-shadow: var(--shadow-buttons-error-focus);
 }
-.celeste-button-intent-error:not(:disabled).celeste-button-variant-lighter[data-v-86a7957d]:not(:disabled) {
+.celeste-button-intent-error:not(:disabled).celeste-button-variant-lighter[data-v-0aeead06]:not(:disabled) {
   border-color: transparent;
   background-color: var(--color-red-alpha-10);
   box-shadow: none;
   color: var(--color-state-error-base);
 }
-.celeste-button-intent-error:not(:disabled).celeste-button-variant-lighter[data-v-86a7957d]:not(:disabled):hover:not(:disabled) {
+.celeste-button-intent-error:not(:disabled).celeste-button-variant-lighter[data-v-0aeead06]:not(:disabled):hover:not(:disabled) {
   border-color: var(--color-state-error-base);
   background-color: transparent;
   color: var(--color-state-error-base);
 }
-.celeste-button-intent-error:not(:disabled).celeste-button-variant-lighter[data-v-86a7957d]:not(:disabled):focus-visible:not(:disabled) {
+.celeste-button-intent-error:not(:disabled).celeste-button-variant-lighter[data-v-0aeead06]:not(:disabled):focus-visible:not(:disabled) {
   outline: none;
   box-shadow: var(--shadow-buttons-error-focus);
 }
-.celeste-button-intent-error:not(:disabled).celeste-button-variant-ghost[data-v-86a7957d]:not(:disabled) {
+.celeste-button-intent-error:not(:disabled).celeste-button-variant-ghost[data-v-0aeead06]:not(:disabled) {
   border-color: transparent;
   background-color: transparent;
   box-shadow: none;
   color: var(--color-state-error-base);
 }
-.celeste-button-intent-error:not(:disabled).celeste-button-variant-ghost[data-v-86a7957d]:not(:disabled):hover:not(:disabled) {
+.celeste-button-intent-error:not(:disabled).celeste-button-variant-ghost[data-v-0aeead06]:not(:disabled):hover:not(:disabled) {
   border-color: transparent;
   background-color: var(--color-red-alpha-10);
   color: var(--color-state-error-base);
 }
-.celeste-button-intent-error:not(:disabled).celeste-button-variant-ghost[data-v-86a7957d]:not(:disabled):focus-visible:not(:disabled) {
+.celeste-button-intent-error:not(:disabled).celeste-button-variant-ghost[data-v-0aeead06]:not(:disabled):focus-visible:not(:disabled) {
   outline: none;
   box-shadow: var(--shadow-buttons-error-focus);
 }.celeste-calendar[data-v-8b6a5725] {
@@ -1754,7 +1755,7 @@ to {
   initial-value: rgba(0, 0, 0, 0);
   inherits: false;
 }
-.celeste-fbutton[data-v-e9dcba71] {
+.celeste-fbutton[data-v-d53adf47] {
   display: inline-flex;
   position: relative;
   box-sizing: border-box;
@@ -1767,47 +1768,48 @@ to {
   background-color: transparent;
   font: var(--label-sm);
   text-decoration: none;
+  white-space: nowrap;
   cursor: pointer;
 }
-.celeste-fbutton[data-v-e9dcba71]:disabled {
+.celeste-fbutton[data-v-d53adf47]:disabled {
   background-color: var(--color-bg-weak-50);
   color: var(--color-text-disabled-300);
   cursor: default;
 }
-.celeste-fbutton[data-v-e9dcba71] i {
+.celeste-fbutton[data-v-d53adf47] i {
   flex-shrink: 0;
   width: 20px;
   height: 20px;
 }
-.celeste-fbutton[data-v-e9dcba71]:focus-visible {
+.celeste-fbutton[data-v-d53adf47]:focus-visible {
   outline: none;
 }
-.celeste-fbutton-xs[data-v-e9dcba71] {
+.celeste-fbutton-xs[data-v-d53adf47] {
   gap: var(--spacing-4);
   height: 32px;
   padding: var(--spacing-6) var(--spacing-8);
   border-radius: var(--radius-8);
 }
-.celeste-fbutton-sm[data-v-e9dcba71] {
+.celeste-fbutton-sm[data-v-d53adf47] {
   gap: var(--spacing-6);
   height: 36px;
   padding: var(--spacing-8) var(--spacing-10);
   border-radius: var(--radius-8);
 }
-.celeste-fbutton-md[data-v-e9dcba71] {
+.celeste-fbutton-md[data-v-d53adf47] {
   gap: var(--spacing-6);
   height: 40px;
   padding: var(--spacing-10) var(--spacing-12);
   border-radius: var(--radius-10);
 }
-.celeste-fbutton-primary[data-v-e9dcba71]:not(.celeste-fbutton-basic, :disabled) {
+.celeste-fbutton-primary[data-v-d53adf47]:not(.celeste-fbutton-basic, :disabled) {
   --celeste-fbutton-bg-start: rgb(255 255 255 / 16%);
   --celeste-fbutton-bg-end: rgb(255 255 255 / 0%);
   background: linear-gradient(180deg, var(--celeste-fbutton-bg-start) 0%, var(--celeste-fbutton-bg-end) 100%), var(--color-primary-base);
   box-shadow: var(--shadow-fancy-buttons-primary);
   color: var(--color-static-white);
 }
-.celeste-fbutton-primary[data-v-e9dcba71]:not(.celeste-fbutton-basic, :disabled)::before {
+.celeste-fbutton-primary[data-v-d53adf47]:not(.celeste-fbutton-basic, :disabled)::before {
   content: "";
   position: absolute;
   padding: 1px;
@@ -1821,23 +1823,23 @@ to {
           mask-composite: exclude;
   inset: 0;
 }
-.celeste-fbutton-primary[data-v-e9dcba71]:not(.celeste-fbutton-basic, :disabled):hover {
+.celeste-fbutton-primary[data-v-d53adf47]:not(.celeste-fbutton-basic, :disabled):hover {
   --celeste-fbutton-bg-start: rgb(255 255 255 / 24%);
   --celeste-fbutton-bg-end: rgb(255 255 255 / 0%);
 }
-.celeste-fbutton-primary[data-v-e9dcba71]:not(.celeste-fbutton-basic, :disabled):focus-visible {
+.celeste-fbutton-primary[data-v-d53adf47]:not(.celeste-fbutton-basic, :disabled):focus-visible {
   --celeste-fbutton-bg-start: rgb(255 255 255 / 24%);
   --celeste-fbutton-bg-end: rgb(255 255 255 / 0%);
   box-shadow: var(--shadow-fancy-buttons-primary), var(--shadow-buttons-primary-focus);
 }
-.celeste-fbutton-neutral[data-v-e9dcba71]:not(.celeste-fbutton-basic, :disabled) {
+.celeste-fbutton-neutral[data-v-d53adf47]:not(.celeste-fbutton-basic, :disabled) {
   --celeste-fbutton-bg-start: rgb(255 255 255 / 16%);
   --celeste-fbutton-bg-end: rgb(255 255 255 / 0%);
   background: linear-gradient(180deg, var(--celeste-fbutton-bg-start) 0%, var(--celeste-fbutton-bg-end) 100%), var(--color-bg-strong-950);
   box-shadow: var(--shadow-fancy-buttons-neutral);
   color: var(--color-text-white-0);
 }
-.celeste-fbutton-neutral[data-v-e9dcba71]:not(.celeste-fbutton-basic, :disabled)::before {
+.celeste-fbutton-neutral[data-v-d53adf47]:not(.celeste-fbutton-basic, :disabled)::before {
   content: "";
   position: absolute;
   padding: 1px;
@@ -1851,23 +1853,23 @@ to {
           mask-composite: exclude;
   inset: 0;
 }
-.celeste-fbutton-neutral[data-v-e9dcba71]:not(.celeste-fbutton-basic, :disabled):hover {
+.celeste-fbutton-neutral[data-v-d53adf47]:not(.celeste-fbutton-basic, :disabled):hover {
   --celeste-fbutton-bg-start: rgb(255 255 255 / 24%);
   --celeste-fbutton-bg-end: rgb(255 255 255 / 0%);
 }
-.celeste-fbutton-neutral[data-v-e9dcba71]:not(.celeste-fbutton-basic, :disabled):focus-visible {
+.celeste-fbutton-neutral[data-v-d53adf47]:not(.celeste-fbutton-basic, :disabled):focus-visible {
   --celeste-fbutton-bg-start: rgb(255 255 255 / 24%);
   --celeste-fbutton-bg-end: rgb(255 255 255 / 0%);
   box-shadow: var(--shadow-fancy-buttons-neutral), var(--shadow-buttons-important-focus);
 }
-.celeste-fbutton-error[data-v-e9dcba71]:not(.celeste-fbutton-basic, :disabled) {
+.celeste-fbutton-error[data-v-d53adf47]:not(.celeste-fbutton-basic, :disabled) {
   --celeste-fbutton-bg-start: rgb(255 255 255 / 16%);
   --celeste-fbutton-bg-end: rgb(255 255 255 / 0%);
   background: linear-gradient(180deg, var(--celeste-fbutton-bg-start) 0%, var(--celeste-fbutton-bg-end) 100%), var(--color-state-error-base);
   box-shadow: var(--shadow-fancy-buttons-error);
   color: var(--color-static-white);
 }
-.celeste-fbutton-error[data-v-e9dcba71]:not(.celeste-fbutton-basic, :disabled)::before {
+.celeste-fbutton-error[data-v-d53adf47]:not(.celeste-fbutton-basic, :disabled)::before {
   content: "";
   position: absolute;
   padding: 1px;
@@ -1881,30 +1883,30 @@ to {
           mask-composite: exclude;
   inset: 0;
 }
-.celeste-fbutton-error[data-v-e9dcba71]:not(.celeste-fbutton-basic, :disabled):hover {
+.celeste-fbutton-error[data-v-d53adf47]:not(.celeste-fbutton-basic, :disabled):hover {
   --celeste-fbutton-bg-start: rgb(255 255 255 / 24%);
   --celeste-fbutton-bg-end: rgb(255 255 255 / 0%);
 }
-.celeste-fbutton-error[data-v-e9dcba71]:not(.celeste-fbutton-basic, :disabled):focus-visible {
+.celeste-fbutton-error[data-v-d53adf47]:not(.celeste-fbutton-basic, :disabled):focus-visible {
   --celeste-fbutton-bg-start: rgb(255 255 255 / 24%);
   --celeste-fbutton-bg-end: rgb(255 255 255 / 0%);
   box-shadow: var(--shadow-fancy-buttons-error), var(--shadow-buttons-error-focus);
 }
-.celeste-fbutton-basic[data-v-e9dcba71] {
+.celeste-fbutton-basic[data-v-d53adf47] {
   background: var(--color-bg-white-0);
   box-shadow: var(--shadow-fancy-buttons-stroke);
   color: var(--color-text-sub-600);
 }
-.celeste-fbutton-basic[data-v-e9dcba71]:hover {
+.celeste-fbutton-basic[data-v-d53adf47]:hover {
   background: var(--color-bg-weak-50);
   box-shadow: none;
   color: var(--color-text-strong-950);
 }
-.celeste-fbutton-basic[data-v-e9dcba71]:focus-visible {
+.celeste-fbutton-basic[data-v-d53adf47]:focus-visible {
   background: var(--color-bg-weak-50);
   box-shadow: var(--shadow-buttons-important-focus);
   color: var(--color-text-strong-950);
-}.celeste-link-button[data-v-42f6843d] {
+}.celeste-link-button[data-v-59b06e1d] {
   display: inline-flex;
   align-items: center;
   justify-content: center;
@@ -1912,67 +1914,68 @@ to {
   transition-duration: var(--animation-fast);
   transition-timing-function: ease-out;
   text-decoration: none;
+  white-space: nowrap;
   cursor: pointer;
 }
-.celeste-link-button[data-v-42f6843d]:disabled, .celeste-link-button-disabled[data-v-42f6843d] {
+.celeste-link-button[data-v-59b06e1d]:disabled, .celeste-link-button-disabled[data-v-59b06e1d] {
   color: var(--color-text-disabled-300);
   cursor: default;
   pointer-events: none;
 }
-.celeste-link-button[data-v-42f6843d]:hover, .celeste-link-button[data-v-42f6843d]:focus-visible {
+.celeste-link-button[data-v-59b06e1d]:hover, .celeste-link-button[data-v-59b06e1d]:focus-visible {
   outline: none;
   text-decoration: underline;
 }
-.celeste-link-button-underline[data-v-42f6843d] {
+.celeste-link-button-underline[data-v-59b06e1d] {
   text-decoration: underline;
 }
-.celeste-link-button-md[data-v-42f6843d] {
+.celeste-link-button-md[data-v-59b06e1d] {
   height: 20px;
   font: var(--label-sm);
 }
-.celeste-link-button-md[data-v-42f6843d] i {
+.celeste-link-button-md[data-v-59b06e1d] i {
   flex-shrink: 0;
   width: 20px;
   height: 20px;
 }
-.celeste-link-button-sm[data-v-42f6843d] {
+.celeste-link-button-sm[data-v-59b06e1d] {
   height: 16px;
   font: var(--label-xs);
 }
-.celeste-link-button-sm[data-v-42f6843d] i {
+.celeste-link-button-sm[data-v-59b06e1d] i {
   flex-shrink: 0;
   width: 16px;
   height: 16px;
 }
-.celeste-link-button-primary[data-v-42f6843d]:not(.celeste-link-button-disabled) {
+.celeste-link-button-primary[data-v-59b06e1d]:not(.celeste-link-button-disabled) {
   color: var(--color-primary-base);
 }
-.celeste-link-button-primary[data-v-42f6843d]:not(.celeste-link-button-disabled):hover, .celeste-link-button-primary[data-v-42f6843d]:not(.celeste-link-button-disabled):focus-visible {
+.celeste-link-button-primary[data-v-59b06e1d]:not(.celeste-link-button-disabled):hover, .celeste-link-button-primary[data-v-59b06e1d]:not(.celeste-link-button-disabled):focus-visible {
   color: var(--color-primary-darker);
 }
-.celeste-link-button-black[data-v-42f6843d]:not(.celeste-link-button-disabled) {
+.celeste-link-button-black[data-v-59b06e1d]:not(.celeste-link-button-disabled) {
   color: var(--color-text-strong-950);
 }
-.celeste-link-button-black[data-v-42f6843d]:not(.celeste-link-button-disabled):hover, .celeste-link-button-black[data-v-42f6843d]:not(.celeste-link-button-disabled):focus-visible {
+.celeste-link-button-black[data-v-59b06e1d]:not(.celeste-link-button-disabled):hover, .celeste-link-button-black[data-v-59b06e1d]:not(.celeste-link-button-disabled):focus-visible {
   color: var(--color-text-strong-950);
 }
-.celeste-link-button-gray[data-v-42f6843d]:not(.celeste-link-button-disabled) {
+.celeste-link-button-gray[data-v-59b06e1d]:not(.celeste-link-button-disabled) {
   color: var(--color-text-sub-600);
 }
-.celeste-link-button-gray[data-v-42f6843d]:not(.celeste-link-button-disabled):hover, .celeste-link-button-gray[data-v-42f6843d]:not(.celeste-link-button-disabled):focus-visible {
+.celeste-link-button-gray[data-v-59b06e1d]:not(.celeste-link-button-disabled):hover, .celeste-link-button-gray[data-v-59b06e1d]:not(.celeste-link-button-disabled):focus-visible {
   color: var(--color-text-sub-600);
 }
-.celeste-link-button-error[data-v-42f6843d]:not(.celeste-link-button-disabled) {
+.celeste-link-button-error[data-v-59b06e1d]:not(.celeste-link-button-disabled) {
   color: var(--color-state-error-base);
 }
-.celeste-link-button-error[data-v-42f6843d]:not(.celeste-link-button-disabled):hover, .celeste-link-button-error[data-v-42f6843d]:not(.celeste-link-button-disabled):focus-visible {
+.celeste-link-button-error[data-v-59b06e1d]:not(.celeste-link-button-disabled):hover, .celeste-link-button-error[data-v-59b06e1d]:not(.celeste-link-button-disabled):focus-visible {
   color: var(--color-red-700);
 }@property --celeste-social-button-bg {
   syntax: "<color>";
   initial-value: rgba(0, 0, 0, 0);
   inherits: false;
 }
-.celeste-social-button[data-v-dd727c87] {
+.celeste-social-button[data-v-3652f72b] {
   display: flex;
   align-items: center;
   justify-content: center;
@@ -1984,68 +1987,69 @@ to {
   border-radius: var(--radius-10);
   font: var(--label-sm);
   text-decoration: none;
+  white-space: nowrap;
   cursor: pointer;
   gap: var(--spacing-8);
 }
-.celeste-social-button span[data-v-dd727c87] {
+.celeste-social-button span[data-v-3652f72b] {
   padding-inline-end: var(--spacing-6);
 }
-.celeste-social-button[data-v-dd727c87]:focus-visible {
+.celeste-social-button[data-v-3652f72b]:focus-visible {
   outline: none;
   box-shadow: var(--shadow-buttons-important-focus);
 }
-.celeste-social-button-fill[data-v-dd727c87] {
+.celeste-social-button-fill[data-v-3652f72b] {
   color: var(--color-text-white-0);
 }
-.celeste-social-button-stroke[data-v-dd727c87] {
+.celeste-social-button-stroke[data-v-3652f72b] {
   border-color: var(--color-stroke-soft-200);
   background-color: var(--color-bg-white-0);
   box-shadow: var(--shadow-regular-xs);
   color: var(--color-text-strong-950);
 }
-.celeste-social-button-stroke[data-v-dd727c87]:hover {
+.celeste-social-button-stroke[data-v-3652f72b]:hover {
   border-color: transparent;
   background: var(--color-bg-weak-50);
 }
-.celeste-social-button i[data-v-dd727c87] {
+.celeste-social-button i[data-v-3652f72b] {
   flex-shrink: 0;
   width: 20px;
   height: 20px;
 }
-.celeste-social-button-google[data-v-dd727c87]:not(.celeste-social-button-stroke) {
+.celeste-social-button-google[data-v-3652f72b]:not(.celeste-social-button-stroke) {
   background: linear-gradient(0deg, var(--celeste-social-button-bg) 0%, var(--celeste-social-button-bg) 100%), #f14336;
 }
-.celeste-social-button-google[data-v-dd727c87]:not(.celeste-social-button-stroke):hover {
+.celeste-social-button-google[data-v-3652f72b]:not(.celeste-social-button-stroke):hover {
   --celeste-social-button-bg: rgba(0, 0, 0, 0.16);
 }
-.celeste-social-button-apple[data-v-dd727c87]:not(.celeste-social-button-stroke) {
+.celeste-social-button-apple[data-v-3652f72b]:not(.celeste-social-button-stroke) {
   background: linear-gradient(0deg, var(--celeste-social-button-bg) 0%, var(--celeste-social-button-bg) 100%), #000;
 }
-.celeste-social-button-apple[data-v-dd727c87]:not(.celeste-social-button-stroke):hover {
+.celeste-social-button-apple[data-v-3652f72b]:not(.celeste-social-button-stroke):hover {
   --celeste-social-button-bg: rgba(255, 255, 255, 0.16);
 }
-.celeste-social-button-twitter[data-v-dd727c87]:not(.celeste-social-button-stroke) {
+.celeste-social-button-twitter[data-v-3652f72b]:not(.celeste-social-button-stroke) {
   background: linear-gradient(0deg, var(--celeste-social-button-bg) 0%, var(--celeste-social-button-bg) 100%), #000;
 }
-.celeste-social-button-twitter[data-v-dd727c87]:not(.celeste-social-button-stroke):hover {
+.celeste-social-button-twitter[data-v-3652f72b]:not(.celeste-social-button-stroke):hover {
   --celeste-social-button-bg: rgba(255, 255, 255, 0.16);
 }
-.celeste-social-button-facebook[data-v-dd727c87]:not(.celeste-social-button-stroke) {
+.celeste-social-button-facebook[data-v-3652f72b]:not(.celeste-social-button-stroke) {
   background: linear-gradient(0deg, var(--celeste-social-button-bg) 0%, var(--celeste-social-button-bg) 100%), #1977f3;
 }
-.celeste-social-button-facebook[data-v-dd727c87]:not(.celeste-social-button-stroke):hover {
+.celeste-social-button-facebook[data-v-3652f72b]:not(.celeste-social-button-stroke):hover {
   --celeste-social-button-bg: rgba(0, 0, 0, 0.16);
 }
-.celeste-social-button-linkedin[data-v-dd727c87]:not(.celeste-social-button-stroke) {
+.celeste-social-button-linkedin[data-v-3652f72b]:not(.celeste-social-button-stroke) {
   background: linear-gradient(0deg, var(--celeste-social-button-bg) 0%, var(--celeste-social-button-bg) 100%), #0077b5;
 }
-.celeste-social-button-linkedin[data-v-dd727c87]:not(.celeste-social-button-stroke):hover {
+.celeste-social-button-linkedin[data-v-3652f72b]:not(.celeste-social-button-stroke):hover {
   --celeste-social-button-bg: rgba(0, 0, 0, 0.16);
 }
-.celeste-social-button-github[data-v-dd727c87]:not(.celeste-social-button-stroke) {
+.celeste-social-button-github[data-v-3652f72b]:not(.celeste-social-button-stroke) {
   background: linear-gradient(0deg, var(--celeste-social-button-bg) 0%, var(--celeste-social-button-bg) 100%), #24292f;
 }
-.celeste-social-button-github[data-v-dd727c87]:not(.celeste-social-button-stroke):hover {
+.celeste-social-button-github[data-v-3652f72b]:not(.celeste-social-button-stroke):hover {
   --celeste-social-button-bg: rgba(255, 255, 255, 0.16);
 }[data-v-9034edc8] .celeste-popover-content-wrapper {
   z-index: 50;

package/dist/cjs/chunks/button.cjs

@@ -41,7 +41,7 @@ var button_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ (0, vue.d
 });
 //#endregion
 //#region src/components/button/button.vue
-var button_default = /*#__PURE__*/ require__plugin_vue_export_helper._plugin_vue_export_helper_default(button_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-86a7957d"]]);
+var button_default = /*#__PURE__*/ require__plugin_vue_export_helper._plugin_vue_export_helper_default(button_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-0aeead06"]]);
 //#endregion
 Object.defineProperty(exports, "button_default", {
 	enumerable: true,

package/dist/cjs/chunks/fancy-button.cjs

@@ -40,7 +40,7 @@ var fancy_button_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ (0,
 });
 //#endregion
 //#region src/components/button/fancy-button.vue
-var fancy_button_default = /*#__PURE__*/ require__plugin_vue_export_helper._plugin_vue_export_helper_default(fancy_button_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-e9dcba71"]]);
+var fancy_button_default = /*#__PURE__*/ require__plugin_vue_export_helper._plugin_vue_export_helper_default(fancy_button_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-d53adf47"]]);
 //#endregion
 Object.defineProperty(exports, "fancy_button_default", {
 	enumerable: true,

package/dist/cjs/chunks/link-button.cjs

@@ -46,7 +46,7 @@ var link_button_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ (0,
 });
 //#endregion
 //#region src/components/button/link-button.vue
-var link_button_default = /*#__PURE__*/ require__plugin_vue_export_helper._plugin_vue_export_helper_default(link_button_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-42f6843d"]]);
+var link_button_default = /*#__PURE__*/ require__plugin_vue_export_helper._plugin_vue_export_helper_default(link_button_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-59b06e1d"]]);
 //#endregion
 Object.defineProperty(exports, "link_button_default", {
 	enumerable: true,

package/dist/cjs/chunks/social-button.cjs

@@ -34,7 +34,7 @@ var social_button_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ (0
 });
 //#endregion
 //#region src/components/button/social-button.vue
-var social_button_default = /*#__PURE__*/ require__plugin_vue_export_helper._plugin_vue_export_helper_default(social_button_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-dd727c87"]]);
+var social_button_default = /*#__PURE__*/ require__plugin_vue_export_helper._plugin_vue_export_helper_default(social_button_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-3652f72b"]]);
 //#endregion
 Object.defineProperty(exports, "social_button_default", {
 	enumerable: true,

package/dist/es/chunks/button.js

@@ -37,6 +37,6 @@ var button_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE_
 			]);
 		};
 	}
-}), [["__scopeId", "data-v-86a7957d"]]);
+}), [["__scopeId", "data-v-0aeead06"]]);
 //#endregion
 export { button_default as t };

package/dist/es/chunks/fancy-button.js

@@ -36,6 +36,6 @@ var fancy_button_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @_
 			]);
 		};
 	}
-}), [["__scopeId", "data-v-e9dcba71"]]);
+}), [["__scopeId", "data-v-d53adf47"]]);
 //#endregion
 export { fancy_button_default as t };

package/dist/es/chunks/link-button.js

@@ -42,6 +42,6 @@ var link_button_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__
 			]);
 		};
 	}
-}), [["__scopeId", "data-v-42f6843d"]]);
+}), [["__scopeId", "data-v-59b06e1d"]]);
 //#endregion
 export { link_button_default as t };

package/dist/es/chunks/social-button.js

@@ -31,6 +31,6 @@ var social_button_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @
 			}, 8, ["aria-label", "class"]);
 		};
 	}
-}), [["__scopeId", "data-v-dd727c87"]]);
+}), [["__scopeId", "data-v-3652f72b"]]);
 //#endregion
 export { social_button_default as t };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@youcan/celeste",
   "type": "module",
-  "version": "0.22.0",
+  "version": "0.22.1",
   "author": "YouCan <tech@youcan.shop>",
   "repository": {
     "type": "git",
@@ -52,8 +52,8 @@
     "reka-ui": "~2.10.5",
     "tinycolor2": "^1.6.0",
     "vue-sonner": "^2.0.9",
-    "@youcan/celeste-icons": "0.22.0",
-    "@youcan/celeste-tokens": "0.22.0"
+    "@youcan/celeste-icons": "0.22.1",
+    "@youcan/celeste-tokens": "0.22.1"
   },
   "devDependencies": {
     "@chromatic-com/storybook": "^5.3.0",

package/src/components/button/button.vue

@@ -227,6 +227,7 @@ $hover-map: (
   background-color: transparent;
   font: var(--label-sm);
   text-decoration: none;
+  white-space: nowrap;
   cursor: pointer;
 
   &:disabled {

package/src/components/button/fancy-button.vue

@@ -93,6 +93,7 @@ $intent-map: (
   background-color: transparent;
   font: var(--label-sm);
   text-decoration: none;
+  white-space: nowrap;
   cursor: pointer;
 
   &:disabled {

package/src/components/button/link-button.vue

@@ -47,6 +47,7 @@ const props = withDefaults(defineProps<LinkButtonProps>(), {
   transition-duration: var(--animation-fast);
   transition-timing-function: ease-out;
   text-decoration: none;
+  white-space: nowrap;
   cursor: pointer;
 
   &:disabled,

package/src/components/button/social-button.vue

@@ -80,6 +80,7 @@ $brand-map: (
   border-radius: var(--radius-10);
   font: var(--label-sm);
   text-decoration: none;
+  white-space: nowrap;
   cursor: pointer;
   gap: var(--spacing-8);