@antadesign/anta 0.3.24 → 0.3.25

package/dist/components/Banner.d.ts

@@ -1,9 +1,8 @@
 import type { BaseProps } from "../general_types";
-/** Public props for the `<Banner>` message strip. `message` is the leading
- *  content, `children` sit between it and `actions`, all centered in one row. */
+/** Props for the `<Banner>` message strip. `message` leads, `children` precede
+ *  `actions`, and `align` places the row. */
 export interface BannerProps extends BaseProps {
-    /** Leading message — a string (rendered at the banner type scale) or any node.
-     *  Centered in the bar, followed by `children` and then `actions`. */
+    /** Leading message: a string at the banner type scale or any node. */
     message?: React.ReactNode;
     /** Trailing controls (buttons, links) rendered as a compact row after the
      *  message and `children`. */
@@ -16,6 +15,10 @@ export interface BannerProps extends BaseProps {
      *  lightness/chroma are pinned. `'neutral'` (the default) is the same as omitting it.
      *  @defaultValue 'neutral' */
     tone?: "neutral" | "brand" | "info" | "success" | "warning" | "critical" | (string & {});
+    /** Positions the content row. `'start'` aligns it to the inline edge; `'center'`
+     *  centers it. Wrapped message text follows the selected alignment.
+     *  @defaultValue 'start' */
+    align?: "start" | "center";
     /** Rounded corners for a standalone, floating banner (`border-radius: 999px`,
      *  which clamps to a stadium) instead of the edge-to-edge strip. Still borderless
      *  by default. Pass a `number` (px) or a CSS length string for a custom radius. */
@@ -45,11 +48,8 @@ export interface BannerProps extends BaseProps {
     onDismiss?: () => void;
 }
 /**
- * `<Banner>` — a full-width, dismissible message strip with a bottom border.
- *
- * A close cousin of `<Card>` with a small, centered horizontal payload:
- * `message` leads, `children` sit in the middle, `actions` trail, and (when
- * `closable`) a 40px-wide, full-height ✕ fills the right edge without shifting the centered group.
+ * `<Banner>` — a full-width, dismissible message strip. `message`, `children`, and
+ * `actions` form a row at the inline start by default; `align="center"` centers it.
  *
  * A pure, stateless pass-through to `<a-banner>`: the element owns dismissal and
  * visibility, so the wrapper holds no state and grabs no ref — it maps props to
@@ -76,4 +76,4 @@ export interface BannerProps extends BaseProps {
  * <Banner message="Saved." dismissed={hidden} onDismiss={() => setHidden(true)} />
  * ```
  */
-export declare const Banner: ({ message, actions, tone, round, closable, role, dismissed, defaultDismissed, onDismiss, className, style, children, ...rest }: BannerProps) => any;
+export declare const Banner: ({ message, actions, tone, align, round, closable, role, dismissed, defaultDismissed, onDismiss, className, style, children, ...rest }: BannerProps) => any;

package/dist/components/Banner.js

@@ -5,6 +5,7 @@ const Banner = ({
   message,
   actions,
   tone,
+  align,
   round,
   closable,
   role = "status",
@@ -29,6 +30,7 @@ const Banner = ({
       state: controlled ? dismissed ? "closed" : "open" : void 0,
       "default-state": !controlled ? defaultDismissed ? "closed" : "open" : void 0,
       tone: tone && tone !== "neutral" ? tone : void 0,
+      align: align === "center" ? "center" : void 0,
       round: roundAttr(round),
       role,
       onstatechange: onDismiss ? (e) => {
@@ -41,7 +43,7 @@ const Banner = ({
       children: [
         messageNode,
         children,
-        actions != null && /* @__PURE__ */ jsx("span", { slot: "actions", style: { display: "contents" }, children: actions }),
+        actions != null && /* @__PURE__ */ jsx("span", { "data-anta-banner-actions-wrapper": "", slot: "actions", style: { display: "contents" }, children: actions }),
         closable !== false && // A real <a-button> (light DOM → fully styled, keyboard-focusable) in the
         // element's `close` slot. It fires the bubbling `dismissrequest` event via
         // a-button's global listener, so dismissing works even without framework

package/dist/components/Breadcrumbs.css

@@ -1 +1 @@
-@layer anta{a-breadcrumbs{--breadcrumb-gap: 1px;--breadcrumb-separator-color: var(--text-5);--breadcrumb-separator-icon-size: 16px;--breadcrumb-separator-font-size: 15px;display:flex;align-items:center;gap:var(--breadcrumb-gap);width:max-content;min-width:100%;max-width:100%;overflow-x:auto}a-breadcrumbs[data-size=small]{--breadcrumb-separator-icon-size: 14px;--breadcrumb-separator-font-size: 13px}a-breadcrumbs[data-size=large]{--breadcrumb-separator-icon-size: 18px;--breadcrumb-separator-font-size: 17px}a-breadcrumbs[data-paddingless]{--breadcrumb-gap: .75ch}a-breadcrumbs[data-separator-icon]{--breadcrumb-gap: 0}a-breadcrumbs>*{flex:none}a-breadcrumb-separator{display:inline-flex;flex:none;align-items:center;justify-content:center;color:var(--breadcrumb-separator-color);font-family:var(--sans-serif);font-size:var(--breadcrumb-separator-font-size);line-height:1;user-select:none}a-breadcrumb-separator>a-icon{--icon-size: var(--breadcrumb-separator-icon-size)}}
+@layer anta.components{a-breadcrumbs{--breadcrumb-gap: 1px;--breadcrumb-separator-color: var(--text-5);--breadcrumb-separator-icon-size: 16px;--breadcrumb-separator-font-size: 15px;display:flex;align-items:center;gap:var(--breadcrumb-gap);width:max-content;min-width:100%;max-width:100%;overflow-x:auto}a-breadcrumbs[data-size=small]{--breadcrumb-separator-icon-size: 14px;--breadcrumb-separator-font-size: 13px}a-breadcrumbs[data-size=large]{--breadcrumb-separator-icon-size: 18px;--breadcrumb-separator-font-size: 17px}a-breadcrumbs[data-paddingless]{--breadcrumb-gap: .75ch}a-breadcrumbs[data-separator-icon]{--breadcrumb-gap: 0}a-breadcrumbs>*{flex:none}a-breadcrumb-separator{display:inline-flex;flex:none;align-items:center;justify-content:center;color:var(--breadcrumb-separator-color);font-family:var(--sans-serif);font-size:var(--breadcrumb-separator-font-size);line-height:1;user-select:none}a-breadcrumb-separator>a-icon{--icon-size: var(--breadcrumb-separator-icon-size)}}

package/dist/components/ButtonCopy.d.ts

@@ -32,8 +32,8 @@ export type ButtonCopyProps = ButtonProps & {
 /**
  * Copy button — a `Button` preset for copy-to-clipboard. Set `copy` for a literal
  * string, `copyNode` to copy a DOM region, or `copyUrl` to copy the current page
- * URL. For content computed on demand, keep `copy` reactive and refresh it in
- * `onCopyRequest` (fired on pointerdown / keydown).
+ * URL. For dynamic text, pass a controlled `copy` string and set it in
+ * `onCopyRequest` before activation.
  *
  * It composes a plain `<Button>` with a slotted `<a-copy>` child that performs
  * the write — the button itself carries no copy behavior. This wrapper flips the

package/dist/components/InputDate.css

@@ -1 +1 @@
-@layer anta{a-input-date-time-container{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:6px;padding-top:8px;border-top:1px solid var(--border-3)}}
+@layer anta.components{a-input-date-time-container{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:6px;padding-top:8px;border-top:1px solid var(--border-3)}}

package/dist/components/MenuItem.d.ts

@@ -12,7 +12,11 @@ export interface MenuItemCommonProps extends BaseProps {
      *  option `hint`. Requires `label` (it stacks in a column beneath it). Muted
      *  (`--text-3`) and tracks the row's `tone`. A string, or any node. */
     hint?: React.ReactNode;
-    /** A trailing keyboard-shortcut hint, e.g. `"⌘E"`. */
+    /** Trailing shortcut hint, e.g. `"⌘E"`. Anta translates it to
+     *  `aria-keyshortcuts` and hides the visual glyphs from assistive technology.
+     *  Use `+` within a chord and spaces between shortcuts (`"⌘K ⌘S"` becomes
+     *  `"Meta+K Meta+S"`). Pass `aria-keyshortcuts` to override the translation.
+     *  This does not bind the shortcut. */
     kbd?: string;
     /** A trailing icon. On a `submenu` item this **overrides** the default
      *  chevron (omit it to keep the chevron); on a normal item it's the trailing

package/dist/components/MenuItem.js

@@ -1,5 +1,70 @@
 import { jsx, jsxs } from "@antadesign/anta/jsx-runtime";
 import { toneStyle } from "../anta_helpers";
+const SHORTCUT_KEYS = {
+  "\u2318": "Meta",
+  cmd: "Meta",
+  command: "Meta",
+  win: "Meta",
+  super: "Meta",
+  "\u2303": "Control",
+  ctrl: "Control",
+  control: "Control",
+  "\u2325": "Alt",
+  alt: "Alt",
+  opt: "Alt",
+  option: "Alt",
+  "\u21E7": "Shift",
+  shift: "Shift",
+  "\u21B5": "Enter",
+  "\u23CE": "Enter",
+  enter: "Enter",
+  return: "Enter",
+  "\u232B": "Backspace",
+  backspace: "Backspace",
+  "\u2326": "Delete",
+  del: "Delete",
+  delete: "Delete",
+  "\u238B": "Escape",
+  esc: "Escape",
+  escape: "Escape",
+  "\u21E5": "Tab",
+  tab: "Tab",
+  "\u2423": "Space",
+  space: "Space",
+  "\u2191": "ArrowUp",
+  "\u2193": "ArrowDown",
+  "\u2190": "ArrowLeft",
+  "\u2192": "ArrowRight",
+  "\u21DE": "PageUp",
+  "\u21DF": "PageDown",
+  "\u2196": "Home",
+  "\u2198": "End"
+};
+function shortcutChordLabel(kbd) {
+  const parts = [];
+  let word = "";
+  const flush = () => {
+    if (!word) return;
+    parts.push(SHORTCUT_KEYS[word.toLowerCase()] ?? (word.length === 1 ? word.toUpperCase() : word));
+    word = "";
+  };
+  for (const char of kbd) {
+    if (SHORTCUT_KEYS[char]) {
+      flush();
+      parts.push(SHORTCUT_KEYS[char]);
+    } else if (char === "+") {
+      flush();
+    } else {
+      word += char;
+    }
+  }
+  flush();
+  return parts.length ? parts.join("+") : void 0;
+}
+function shortcutLabel(kbd) {
+  const shortcuts = kbd.trim().replace(/\s*\+\s*/g, "+").split(/\s+/).map(shortcutChordLabel).filter((shortcut) => shortcut !== void 0);
+  return shortcuts.length ? shortcuts.join(" ") : void 0;
+}
 const MenuItem = ({
   icon,
   label,
@@ -34,6 +99,9 @@ const MenuItem = ({
   const keepTint = selected && (selectionIndicator === void 0 || selectionIndicator === "check");
   const effectiveTone = selected && toneSelected || tone;
   const toneAttr = effectiveTone && effectiveTone !== "neutral" ? effectiveTone : void 0;
+  const declaredShortcuts = rest["aria-keyshortcuts"];
+  const keyShortcuts = kbd ? shortcutLabel(kbd) : void 0;
+  const kbdNode = kbd ? /* @__PURE__ */ jsx("kbd", { "aria-hidden": declaredShortcuts ?? keyShortcuts ? "true" : void 0, children: kbd }) : null;
   const labelNode = label != null && (hint != null ? /* @__PURE__ */ jsxs("a-menu-item-text", { children: [
     /* @__PURE__ */ jsx("a-menu-item-label", { children: label }),
     /* @__PURE__ */ jsx("a-menu-item-hint", { children: hint })
@@ -50,6 +118,7 @@ const MenuItem = ({
       tabIndex: disabled ? -1 : 0,
       "aria-disabled": disabled ? "true" : void 0,
       "aria-current": selected ? "true" : void 0,
+      "aria-keyshortcuts": keyShortcuts,
       tone: toneAttr,
       style: toneStyle(effectiveTone, "--menu-item-tone-source", style),
       onClick: onSelect && !disabled ? (e) => onSelect(e, { value, label }) : void 0,
@@ -59,7 +128,7 @@ const MenuItem = ({
       icon && /* @__PURE__ */ jsx("a-icon", { shape: icon, "aria-hidden": "true" }),
       labelNode,
       children,
-      kbd && /* @__PURE__ */ jsx("kbd", { children: kbd }),
+      kbdNode,
       iconTrailing && /* @__PURE__ */ jsx("a-icon", { shape: iconTrailing, "aria-hidden": "true" })
     ] });
   }
@@ -76,6 +145,7 @@ const MenuItem = ({
       submenu: submenu ? "" : void 0,
       "aria-haspopup": submenu ? "menu" : void 0,
       "aria-disabled": disabled ? "true" : void 0,
+      "aria-keyshortcuts": keyShortcuts,
       onmenuselect: onSelect ? (e) => onSelect(e, { value, label }) : void 0,
       class: className,
       ...rest,
@@ -120,7 +190,7 @@ const MenuItem = ({
         leadingIcon && /* @__PURE__ */ jsx("a-icon", { shape: leadingIcon, "aria-hidden": "true" }),
         labelNode,
         children,
-        kbd && /* @__PURE__ */ jsx("kbd", { children: kbd }),
+        kbdNode,
         (() => {
           let trailing = submenu ? iconTrailing ?? "chevron-right" : iconTrailing;
           if (!submenu && !iconTrailing && selectionIndicator === "check" && indicator == null)

package/dist/components/MenuItemCopy.d.ts

@@ -25,8 +25,8 @@ export type MenuItemCopyProps = MenuItemCommonProps & MenuItemActionMode & {
 /**
  * Copying menu item — a `MenuItem` preset for copy-to-clipboard rows inside a
  * `Menu`. Set `copy` for a literal string, `copyNode` to copy a DOM region, or
- * `copyUrl` to copy the current page URL. For content computed on demand, keep
- * `copy` reactive and refresh it in `onCopyRequest` (fired on pointerdown / keydown).
+ * `copyUrl` to copy the current page URL. For dynamic text, pass a controlled
+ * `copy` string and set it in `onCopyRequest` before activation.
  *
  * It composes a plain `<MenuItem>` with a slotted `<a-copy>` child that performs
  * the write when the row is chosen — the item itself carries no copy behavior.

package/dist/components/Steps.css

@@ -1 +1 @@
-@layer anta{a-steps{--steps-marker-size: 28px;--steps-icon-size: 16px;--steps-marker-border-width: 1.5px;--steps-marker-rest-border: var(--border-4);--steps-item-gap: 6px;--steps-gap: 4px;--steps-connector-color: var(--border-3);--steps-connector-width: 1px;--steps-complete-connector-color: var(--border-2);--steps-tab-padding-x: 9px;--steps-tab-padding-block: 0px;--steps-hint-leading: 16px;display:flex;flex-direction:column;width:100%;min-width:0}a-steps:has(>a-tabs[size=small]){--steps-marker-size: 24px;--steps-icon-size: 14px;--steps-tab-padding-x: 7px;--steps-hint-leading: 14px}a-steps:has(>a-tabs[size=large]){--steps-marker-size: 32px;--steps-icon-size: 18px;--steps-tab-padding-x: 13px;--steps-hint-leading: 20px}a-tabs[data-steps]{--steps-marker-active-border: var(--border-1);--steps-primary-marker-lightness: .5;--steps-primary-marker-chroma: .02;--steps-primary-marker-fg: #ffffff;--tabs-gap: 0px;align-items:center;width:fit-content;align-self:flex-start;overflow-x:auto;scrollbar-width:thin}a-tabs[data-steps][fill]{width:100%;align-self:stretch;justify-content:space-between}a-tabs[data-steps]>a-tab[tone=brand]{--steps-marker-active-border: var(--border-1-brand)}a-tabs[data-steps]>a-tab[tone=info]{--steps-marker-active-border: var(--border-1-info)}a-tabs[data-steps]>a-tab[tone=success]{--steps-marker-active-border: var(--border-1-success)}a-tabs[data-steps]>a-tab[tone=warning]{--steps-marker-active-border: var(--border-1-warning)}a-tabs[data-steps]>a-tab[tone=critical]{--steps-marker-active-border: var(--border-1-critical)}a-tabs[data-steps]>a-tab[tone=neutral]{--steps-marker-active-border: var(--border-1)}a-tabs[data-steps]>a-tab[tone]:not([tone=""],[tone=neutral]){--steps-primary-marker-chroma: .17}.dark a-tabs[data-steps]{--steps-primary-marker-lightness: .4;--steps-primary-marker-chroma: .015}.dark a-tabs[data-steps]>a-tab[tone]:not([tone=""],[tone=neutral]){--steps-primary-marker-chroma: .16}a-tabs[data-steps]:not([priority=secondary],[priority=tertiary]){--steps-marker-border-width: 2px;--steps-marker-rest-border: var(--border-3);--steps-connector-color: var(--border-3);--steps-connector-width: 2px}a-tabs[data-steps][priority=tertiary]{--steps-marker-size: calc(var(--steps-icon-size) + 4px);--steps-marker-border-width: 0px}a-steps>a-tabs[data-steps]{background:transparent;border-radius:0;box-shadow:none}a-tabs[data-steps]>a-tab{--steps-complete-connector-color: var(--tab-selected-border);--steps-primary-marker-bg: oklch( from var(--tabs-tone-source) var(--steps-primary-marker-lightness) var(--steps-primary-marker-chroma) h );--steps-primary-completed-marker-bg: color-mix( in oklch, var(--steps-primary-marker-bg) 80%, transparent );position:relative;flex:1 1 0;min-width:0;max-width:max-content;padding-block:0;justify-content:flex-start;gap:var(--steps-item-gap);transition:color var(--tab-timing),background-color var(--tab-timing),box-shadow var(--tab-timing)}a-steps[data-orientation=vertical]:has(>a-tabs[data-steps]>a-tab:state(selected)[tone=brand]){--steps-complete-connector-color: var(--border-2-brand)}a-steps[data-orientation=vertical]:has(>a-tabs[data-steps]>a-tab:state(selected)[tone=info]){--steps-complete-connector-color: var(--border-2-info)}a-steps[data-orientation=vertical]:has(>a-tabs[data-steps]>a-tab:state(selected)[tone=success]){--steps-complete-connector-color: var(--border-2-success)}a-steps[data-orientation=vertical]:has(>a-tabs[data-steps]>a-tab:state(selected)[tone=warning]){--steps-complete-connector-color: var(--border-2-warning)}a-steps[data-orientation=vertical]:has(>a-tabs[data-steps]>a-tab:state(selected)[tone=critical]){--steps-complete-connector-color: var(--border-2-critical)}a-tabs[data-steps]:not([orientation=vertical])>a-tab:first-child{padding-inline-start:0}a-steps>a-tabs[data-steps][fill]>a-tab:not(:last-child){flex:1 1 0;max-width:none}a-steps>a-tabs[data-steps][fill]>a-tab:last-child{flex:0 1 auto;max-width:max-content}a-steps>a-tabs[data-steps]>a-tab:state(selected){--tab-bg: transparent;box-shadow:none}a-steps>a-tabs[data-steps][priority=tertiary]>a-tab:after{border:0}a-step-desc{display:inline-flex;flex:0 1 auto;flex-direction:column;min-width:0;max-width:100%}a-step-desc>a-tab-label{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:500}a-step-hint{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--tab-rest-tone, var(--text-3));font-size:calc(1em - 2px);font-weight:400;line-height:var(--steps-hint-leading)}a-step-marker{display:inline-flex;flex:none;align-items:center;justify-content:center;width:var(--steps-marker-size);height:var(--steps-marker-size);box-sizing:border-box;color:var(--text-4);border:var(--steps-marker-border-width) solid var(--steps-marker-rest-border);border-radius:999px;transition:color var(--tab-timing),background-color var(--tab-timing),border-color var(--tab-timing)}a-tabs[data-steps] a-step-marker :is(a-icon,a-loader){--icon-size: var(--steps-icon-size)}a-tabs[data-steps]>a-tab[tone]{--tab-secondary-bg: oklch( from var(--tabs-tone-source) var(--_track-l) var(--_track-c) h / var(--_sec-a) )}a-tabs[data-steps]>a-tab[tone] a-step-marker{color:var(--tab-selected-text)}a-tabs[data-steps]>a-tab:is(:state(selected),[data-step-state=completed]) a-step-marker{border-color:var(--steps-marker-active-border)}a-tabs[data-steps]>a-tab[data-step-state=error]:not(:state(selected)):not([disabled]) a-step-marker{border-color:var(--border-2-critical)}a-tabs[data-steps]:is([priority=secondary],[priority=tertiary])>a-tab[tone]:not([tone=""],[tone=neutral]) a-step-marker{color:var(--tab-fg)}a-tabs[data-steps][priority=secondary] a-tab:state(selected):not([disabled]) a-step-marker{color:var(--tab-selected-text);background-color:var(--tab-secondary-bg);border-color:var(--steps-marker-active-border)}a-tabs[data-steps]:not([priority=secondary],[priority=tertiary]) a-tab:state(selected):not([disabled]) a-step-marker{color:var(--steps-primary-marker-fg);background-color:var(--steps-primary-marker-bg);border-color:var(--steps-primary-marker-bg)}a-tabs[data-steps]:not([priority=secondary],[priority=tertiary]) a-tab[data-step-state=completed]:not(:state(selected)):not([disabled]) a-step-marker{color:var(--steps-primary-marker-fg);background-color:var(--steps-primary-completed-marker-bg);border-color:transparent}a-tabs[data-steps][priority=tertiary] a-tab:state(selected):not([disabled]) a-step-marker{color:var(--tab-selected-text);background-color:transparent;border-color:transparent}a-tabs[data-steps] a-step-marker>a-loader{transition:color var(--tab-timing)}a-tabs[data-steps]:is([priority=secondary],[priority=tertiary]) a-step-marker>a-loader:not([tone=neutral]){color:inherit}a-tabs[data-steps] a-tab:state(selected):not([disabled]) a-step-marker>a-loader{color:inherit}a-tabs[data-steps]:not([orientation=vertical])>a-tab:not(:last-child):before{content:"";order:3;flex:1 1 auto;align-self:center;min-width:calc(var(--steps-marker-size) / 2);height:var(--steps-connector-width);margin-inline-start:calc(1ch - var(--steps-item-gap));margin-inline-end:calc(1ch - 2 * var(--steps-tab-padding-x));background:var(--steps-connector-color);pointer-events:none}a-tabs[data-steps]:not([orientation=vertical])>a-tab[data-step-state=completed]:not(:last-child):before{background:var(--steps-complete-connector-color)}a-tabs[data-steps] a-tab[disabled]{--tab-fg: var(--text-5);opacity:1}a-tabs[data-steps] a-tab[disabled] a-step-marker,a-tabs[data-steps] a-tab[disabled] a-step-marker>a-loader{color:var(--text-5)}a-tabs[data-steps] a-tab[disabled] a-step-hint{color:var(--text-5)}a-steps[data-orientation=vertical]{--steps-content-indent: calc( var(--steps-marker-size) + var(--steps-item-gap) );--steps-vertical-gap: calc(var(--steps-gap) + 4px);display:grid;grid-template-columns:minmax(0,1fr);row-gap:var(--steps-vertical-gap)}a-steps[data-orientation=vertical]>a-tabs[orientation=vertical]{display:contents}a-steps[data-orientation=vertical]>a-tabs[orientation=vertical]>a-tab{flex:none;min-width:0;grid-column:1;width:max-content;max-width:100%;padding-inline-start:0}a-steps[data-orientation=vertical] a-tab:not(:last-child):before{content:"";position:absolute;inset-block-start:calc(var(--steps-tab-padding-block) + var(--steps-marker-size));inset-inline-start:calc(var(--steps-marker-size) / 2 - var(--steps-connector-width) / 2);inset-inline-end:auto;width:var(--steps-connector-width);height:calc(100% - var(--steps-marker-size) + var(--steps-vertical-gap));background:var(--steps-connector-color);transform:none;pointer-events:none}a-steps[data-orientation=vertical]>a-tabpanel{grid-column:1;grid-row:var(--steps-panel-row);width:calc(100% - var(--steps-content-indent));margin-inline-start:var(--steps-content-indent)}a-steps[data-orientation=vertical]:has(>a-tabpanel):has(>a-tabs[orientation=vertical]>a-tab:state(selected):not(:last-child)):after{content:"";grid-column:1;grid-row:var(--steps-panel-row);align-self:stretch;justify-self:start;width:var(--steps-connector-width);min-height:var(--steps-marker-size);margin-inline-start:calc(var(--steps-marker-size) / 2 - var(--steps-connector-width) / 2);margin-block-end:calc(-1 * var(--steps-vertical-gap));background:var(--steps-connector-color);pointer-events:none;z-index:1}a-steps[data-orientation=vertical]>a-tabs[data-steps]>a-tab[data-step-state=completed]:not(:last-child):before{background:var(--steps-complete-connector-color)}a-steps[data-orientation=vertical]:has(>a-tabpanel):has(>a-tabs[data-steps][orientation=vertical]>a-tab[data-step-state=completed]:state(selected):not(:last-child)):after{background:var(--steps-complete-connector-color)}@media(forced-colors:active){a-tabs[data-steps][priority=secondary] a-tab:state(selected){background-color:transparent;border:0;box-shadow:none}a-step-marker{color:CanvasText;background-color:Canvas;border-color:CanvasText}a-tabs[data-steps] a-tab:state(selected):not([disabled]) a-step-marker{border-color:Highlight}}}
+@layer anta.components{a-steps{--steps-marker-size: 28px;--steps-icon-size: 16px;--steps-marker-border-width: 1.5px;--steps-marker-rest-border: var(--border-4);--steps-item-gap: 6px;--steps-gap: 4px;--steps-connector-color: var(--border-3);--steps-connector-width: 1px;--steps-complete-connector-color: var(--border-2);--steps-tab-padding-x: 9px;--steps-tab-padding-block: 0px;--steps-hint-leading: 16px;display:flex;flex-direction:column;width:100%;min-width:0}a-steps:has(>a-tabs[size=small]){--steps-marker-size: 24px;--steps-icon-size: 14px;--steps-tab-padding-x: 7px;--steps-hint-leading: 14px}a-steps:has(>a-tabs[size=large]){--steps-marker-size: 32px;--steps-icon-size: 18px;--steps-tab-padding-x: 13px;--steps-hint-leading: 20px}a-tabs[data-steps]{--steps-marker-active-border: var(--border-1);--steps-primary-marker-lightness: .5;--steps-primary-marker-chroma: .02;--steps-primary-marker-fg: #ffffff;--tabs-gap: 0px;align-items:center;width:fit-content;align-self:flex-start;overflow-x:auto;scrollbar-width:thin}a-tabs[data-steps][fill]{width:100%;align-self:stretch;justify-content:space-between}a-tabs[data-steps]>a-tab[tone=brand]{--steps-marker-active-border: var(--border-1-brand)}a-tabs[data-steps]>a-tab[tone=info]{--steps-marker-active-border: var(--border-1-info)}a-tabs[data-steps]>a-tab[tone=success]{--steps-marker-active-border: var(--border-1-success)}a-tabs[data-steps]>a-tab[tone=warning]{--steps-marker-active-border: var(--border-1-warning)}a-tabs[data-steps]>a-tab[tone=critical]{--steps-marker-active-border: var(--border-1-critical)}a-tabs[data-steps]>a-tab[tone=neutral]{--steps-marker-active-border: var(--border-1)}a-tabs[data-steps]>a-tab[tone]:not([tone=""],[tone=neutral]){--steps-primary-marker-chroma: .17}.dark a-tabs[data-steps]{--steps-primary-marker-lightness: .4;--steps-primary-marker-chroma: .015}.dark a-tabs[data-steps]>a-tab[tone]:not([tone=""],[tone=neutral]){--steps-primary-marker-chroma: .16}a-tabs[data-steps]:not([priority=secondary],[priority=tertiary]){--steps-marker-border-width: 2px;--steps-marker-rest-border: var(--border-3);--steps-connector-color: var(--border-3);--steps-connector-width: 2px}a-tabs[data-steps][priority=tertiary]{--steps-marker-size: calc(var(--steps-icon-size) + 4px);--steps-marker-border-width: 0px}a-steps>a-tabs[data-steps]{background:transparent;border-radius:0;box-shadow:none}a-tabs[data-steps]>a-tab{--steps-complete-connector-color: var(--tab-selected-border);--steps-primary-marker-bg: oklch( from var(--tabs-tone-source) var(--steps-primary-marker-lightness) var(--steps-primary-marker-chroma) h );--steps-primary-completed-marker-bg: color-mix( in oklch, var(--steps-primary-marker-bg) 80%, transparent );position:relative;flex:1 1 0;min-width:0;max-width:max-content;padding-block:0;justify-content:flex-start;gap:var(--steps-item-gap);transition:color var(--tab-timing),background-color var(--tab-timing),box-shadow var(--tab-timing)}a-steps[data-orientation=vertical]:has(>a-tabs[data-steps]>a-tab:state(selected)[tone=brand]){--steps-complete-connector-color: var(--border-2-brand)}a-steps[data-orientation=vertical]:has(>a-tabs[data-steps]>a-tab:state(selected)[tone=info]){--steps-complete-connector-color: var(--border-2-info)}a-steps[data-orientation=vertical]:has(>a-tabs[data-steps]>a-tab:state(selected)[tone=success]){--steps-complete-connector-color: var(--border-2-success)}a-steps[data-orientation=vertical]:has(>a-tabs[data-steps]>a-tab:state(selected)[tone=warning]){--steps-complete-connector-color: var(--border-2-warning)}a-steps[data-orientation=vertical]:has(>a-tabs[data-steps]>a-tab:state(selected)[tone=critical]){--steps-complete-connector-color: var(--border-2-critical)}a-tabs[data-steps]:not([orientation=vertical])>a-tab:first-child{padding-inline-start:0}a-steps>a-tabs[data-steps][fill]>a-tab:not(:last-child){flex:1 1 0;max-width:none}a-steps>a-tabs[data-steps][fill]>a-tab:last-child{flex:0 1 auto;max-width:max-content}a-steps>a-tabs[data-steps]>a-tab:state(selected){--tab-bg: transparent;box-shadow:none}a-steps>a-tabs[data-steps][priority=tertiary]>a-tab:after{border:0}a-step-desc{display:inline-flex;flex:0 1 auto;flex-direction:column;min-width:0;max-width:100%}a-step-desc>a-tab-label{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:500}a-step-hint{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--tab-rest-tone, var(--text-3));font-size:calc(1em - 2px);font-weight:400;line-height:var(--steps-hint-leading)}a-step-marker{display:inline-flex;flex:none;align-items:center;justify-content:center;width:var(--steps-marker-size);height:var(--steps-marker-size);box-sizing:border-box;color:var(--text-4);border:var(--steps-marker-border-width) solid var(--steps-marker-rest-border);border-radius:999px;transition:color var(--tab-timing),background-color var(--tab-timing),border-color var(--tab-timing)}a-tabs[data-steps] a-step-marker :is(a-icon,a-loader){--icon-size: var(--steps-icon-size)}a-tabs[data-steps]>a-tab[tone]{--tab-secondary-bg: oklch( from var(--tabs-tone-source) var(--_track-l) var(--_track-c) h / var(--_sec-a) )}a-tabs[data-steps]>a-tab[tone] a-step-marker{color:var(--tab-selected-text)}a-tabs[data-steps]>a-tab:is(:state(selected),[data-step-state=completed]) a-step-marker{border-color:var(--steps-marker-active-border)}a-tabs[data-steps]>a-tab[data-step-state=error]:not(:state(selected)):not([disabled]) a-step-marker{border-color:var(--border-2-critical)}a-tabs[data-steps]:is([priority=secondary],[priority=tertiary])>a-tab[tone]:not([tone=""],[tone=neutral]) a-step-marker{color:var(--tab-fg)}a-tabs[data-steps][priority=secondary] a-tab:state(selected):not([disabled]) a-step-marker{color:var(--tab-selected-text);background-color:var(--tab-secondary-bg);border-color:var(--steps-marker-active-border)}a-tabs[data-steps]:not([priority=secondary],[priority=tertiary]) a-tab:state(selected):not([disabled]) a-step-marker{color:var(--steps-primary-marker-fg);background-color:var(--steps-primary-marker-bg);border-color:var(--steps-primary-marker-bg)}a-tabs[data-steps]:not([priority=secondary],[priority=tertiary]) a-tab[data-step-state=completed]:not(:state(selected)):not([disabled]) a-step-marker{color:var(--steps-primary-marker-fg);background-color:var(--steps-primary-completed-marker-bg);border-color:transparent}a-tabs[data-steps][priority=tertiary] a-tab:state(selected):not([disabled]) a-step-marker{color:var(--tab-selected-text);background-color:transparent;border-color:transparent}a-tabs[data-steps] a-step-marker>a-loader{transition:color var(--tab-timing)}a-tabs[data-steps]:is([priority=secondary],[priority=tertiary]) a-step-marker>a-loader:not([tone=neutral]){color:inherit}a-tabs[data-steps] a-tab:state(selected):not([disabled]) a-step-marker>a-loader{color:inherit}a-tabs[data-steps]:not([orientation=vertical])>a-tab:not(:last-child):before{content:"";order:3;flex:1 1 auto;align-self:center;min-width:calc(var(--steps-marker-size) / 2);height:var(--steps-connector-width);margin-inline-start:calc(1ch - var(--steps-item-gap));margin-inline-end:calc(1ch - 2 * var(--steps-tab-padding-x));background:var(--steps-connector-color);pointer-events:none}a-tabs[data-steps]:not([orientation=vertical])>a-tab[data-step-state=completed]:not(:last-child):before{background:var(--steps-complete-connector-color)}a-tabs[data-steps] a-tab[disabled]{--tab-fg: var(--text-5);opacity:1}a-tabs[data-steps] a-tab[disabled] a-step-marker,a-tabs[data-steps] a-tab[disabled] a-step-marker>a-loader{color:var(--text-5)}a-tabs[data-steps] a-tab[disabled] a-step-hint{color:var(--text-5)}a-steps[data-orientation=vertical]{--steps-content-indent: calc( var(--steps-marker-size) + var(--steps-item-gap) );--steps-vertical-gap: calc(var(--steps-gap) + 4px);display:grid;grid-template-columns:minmax(0,1fr);row-gap:var(--steps-vertical-gap)}a-steps[data-orientation=vertical]>a-tabs[orientation=vertical]{display:contents}a-steps[data-orientation=vertical]>a-tabs[orientation=vertical]>a-tab{flex:none;min-width:0;grid-column:1;width:max-content;max-width:100%;padding-inline-start:0}a-steps[data-orientation=vertical] a-tab:not(:last-child):before{content:"";position:absolute;inset-block-start:calc(var(--steps-tab-padding-block) + var(--steps-marker-size));inset-inline-start:calc(var(--steps-marker-size) / 2 - var(--steps-connector-width) / 2);inset-inline-end:auto;width:var(--steps-connector-width);height:calc(100% - var(--steps-marker-size) + var(--steps-vertical-gap));background:var(--steps-connector-color);transform:none;pointer-events:none}a-steps[data-orientation=vertical]>a-tabpanel{grid-column:1;grid-row:var(--steps-panel-row);width:calc(100% - var(--steps-content-indent));margin-inline-start:var(--steps-content-indent)}a-steps[data-orientation=vertical]:has(>a-tabpanel):has(>a-tabs[orientation=vertical]>a-tab:state(selected):not(:last-child)):after{content:"";grid-column:1;grid-row:var(--steps-panel-row);align-self:stretch;justify-self:start;width:var(--steps-connector-width);min-height:var(--steps-marker-size);margin-inline-start:calc(var(--steps-marker-size) / 2 - var(--steps-connector-width) / 2);margin-block-end:calc(-1 * var(--steps-vertical-gap));background:var(--steps-connector-color);pointer-events:none;z-index:1}a-steps[data-orientation=vertical]>a-tabs[data-steps]>a-tab[data-step-state=completed]:not(:last-child):before{background:var(--steps-complete-connector-color)}a-steps[data-orientation=vertical]:has(>a-tabpanel):has(>a-tabs[data-steps][orientation=vertical]>a-tab[data-step-state=completed]:state(selected):not(:last-child)):after{background:var(--steps-complete-connector-color)}@media(forced-colors:active){a-tabs[data-steps][priority=secondary] a-tab:state(selected){background-color:transparent;border:0;box-shadow:none}a-step-marker{color:CanvasText;background-color:Canvas;border-color:CanvasText}a-tabs[data-steps] a-tab:state(selected):not([disabled]) a-step-marker{border-color:Highlight}}}

package/dist/components/copy-props.d.ts

@@ -10,10 +10,9 @@ export type CopyTarget = {
     copy: string;
     /** Prefix the copied text with `// URL: <current page URL>`. */
     copyWithUrl?: boolean;
-    /** Compute the copy content lazily. Fires on pointerdown / keydown; update
-     *  `copy` (a state change) here and the activation copies the latest value.
-     *  The gap lets the update land even off the UI thread — only the
-     *  serializable `copy` string crosses. */
+    /** Refresh a dynamic `copy` value before activation. Set the new string in
+     *  application state so the next render updates `copy`. Return values are
+     *  ignored. Fires on pointerdown and Enter/Space keydown. */
     onCopyRequest?: () => void;
     /** Fires after the copy attempt with whether it succeeded. */
     onCopied?: (ok: boolean) => void;

package/dist/components/select-parts.css

@@ -1 +1 @@
-@layer anta{a-select-chevron{display:inline-flex;transition:transform .15s ease}a-select-chevron[open]{transform:rotate(180deg)}a-select-faceted-summary{display:block;max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}
+@layer anta.components{a-select-chevron{display:inline-flex;transition:transform .15s ease}a-select-chevron[open]{transform:rotate(180deg)}a-select-faceted-summary{display:block;max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}

package/dist/elements/a-avatar.css

@@ -1 +1 @@
-@layer anta{a-avatar{--avatar-size: 44px;--avatar-radius: 22%;--avatar-placeholder-bg: var(--bg-3);--avatar-badge-ratio: .24;--avatar-badge-size: calc(var(--avatar-size) * var(--avatar-badge-ratio));--avatar-badge-inset: 0px;--avatar-badge-gap: 2px;--avatar-badge-mask: none;--avatar-badge-tone-source: var(--anta-seed-neutral);--avatar-badge-chroma: .17;--avatar-badge-color: oklch(from var(--avatar-badge-tone-source) .62 var(--avatar-badge-chroma) h);display:inline-block;inline-size:var(--avatar-size);block-size:var(--avatar-size);vertical-align:middle}a-avatar[round]{--avatar-round: attr(round type(<length>));--avatar-radius: var(--avatar-round, 50%);--avatar-badge-inset: calc(var(--avatar-size) * .03)}a-avatar[size=small]{--avatar-size: 32px;--avatar-badge-gap: 1.5px}a-avatar[size=large]{--avatar-size: 64px;--avatar-badge-gap: 2.5px}a-avatar[badge]:not([badge=""],[badge=none]){--avatar-badge-mask: radial-gradient( circle calc(var(--avatar-badge-size) / 2 + var(--avatar-badge-gap)) at calc(100% - var(--avatar-badge-inset) - var(--avatar-badge-size) / 2) calc(100% - var(--avatar-badge-inset) - var(--avatar-badge-size) / 2), transparent 99%, #000 100% )}a-avatar:not(:defined){display:inline-block;inline-size:var(--avatar-size);block-size:var(--avatar-size);border-radius:var(--avatar-radius);background:var(--avatar-placeholder-bg);vertical-align:middle}a-avatar[badge=neutral]{--avatar-badge-chroma: .005}a-avatar[badge=brand]{--avatar-badge-tone-source: var(--anta-seed-brand)}a-avatar[badge=info]{--avatar-badge-tone-source: var(--anta-seed-info)}a-avatar[badge=success]{--avatar-badge-tone-source: var(--anta-seed-success)}a-avatar[badge=warning]{--avatar-badge-tone-source: var(--anta-seed-warning)}a-avatar[badge=critical]{--avatar-badge-tone-source: var(--anta-seed-critical)}@supports (color: attr(badge type(<color>),transparent)){a-avatar[badge]:not([badge=""],[badge=neutral],[badge=brand],[badge=info],[badge=success],[badge=warning],[badge=critical]){--avatar-badge-tone-source: attr(badge type(<color>), transparent)}}.dark a-avatar{--avatar-badge-color: oklch(from var(--avatar-badge-tone-source) .68 var(--avatar-badge-chroma) h)}.dark a-avatar[badge=neutral]{--avatar-badge-chroma: .008}}
+@layer anta.components{a-avatar{--avatar-size: 44px;--avatar-radius: 22%;--avatar-placeholder-bg: var(--bg-3);--avatar-badge-ratio: .24;--avatar-badge-size: calc(var(--avatar-size) * var(--avatar-badge-ratio));--avatar-badge-inset: 0px;--avatar-badge-gap: 2px;--avatar-badge-mask: none;--avatar-badge-tone-source: var(--anta-seed-neutral);--avatar-badge-chroma: .17;--avatar-badge-color: oklch(from var(--avatar-badge-tone-source) .62 var(--avatar-badge-chroma) h);display:inline-block;inline-size:var(--avatar-size);block-size:var(--avatar-size);vertical-align:middle}a-avatar[round]{--avatar-round: attr(round type(<length>));--avatar-radius: var(--avatar-round, 50%);--avatar-badge-inset: calc(var(--avatar-size) * .03)}a-avatar[size=small]{--avatar-size: 32px;--avatar-badge-gap: 1.5px}a-avatar[size=large]{--avatar-size: 64px;--avatar-badge-gap: 2.5px}a-avatar[badge]:not([badge=""],[badge=none]){--avatar-badge-mask: radial-gradient( circle calc(var(--avatar-badge-size) / 2 + var(--avatar-badge-gap)) at calc(100% - var(--avatar-badge-inset) - var(--avatar-badge-size) / 2) calc(100% - var(--avatar-badge-inset) - var(--avatar-badge-size) / 2), transparent 99%, #000 100% )}a-avatar:not(:defined){display:inline-block;inline-size:var(--avatar-size);block-size:var(--avatar-size);border-radius:var(--avatar-radius);background:var(--avatar-placeholder-bg);vertical-align:middle}a-avatar[badge=neutral]{--avatar-badge-chroma: .005}a-avatar[badge=brand]{--avatar-badge-tone-source: var(--anta-seed-brand)}a-avatar[badge=info]{--avatar-badge-tone-source: var(--anta-seed-info)}a-avatar[badge=success]{--avatar-badge-tone-source: var(--anta-seed-success)}a-avatar[badge=warning]{--avatar-badge-tone-source: var(--anta-seed-warning)}a-avatar[badge=critical]{--avatar-badge-tone-source: var(--anta-seed-critical)}@supports (color: attr(badge type(<color>),transparent)){a-avatar[badge]:not([badge=""],[badge=neutral],[badge=brand],[badge=info],[badge=success],[badge=warning],[badge=critical]){--avatar-badge-tone-source: attr(badge type(<color>), transparent)}}.dark a-avatar{--avatar-badge-color: oklch(from var(--avatar-badge-tone-source) .68 var(--avatar-badge-chroma) h)}.dark a-avatar[badge=neutral]{--avatar-badge-chroma: .008}}

package/dist/elements/a-banner.css

@@ -1 +1 @@
-@layer anta{a-banner{--banner-bg: var(--bg-4);--banner-border: var(--border-4);--banner-text: var(--text-2);display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:4px 1ch;position:relative;box-sizing:border-box;width:100%;min-height:40px;padding:6px 52px;color:var(--banner-text);background:var(--banner-bg);border:0 solid var(--banner-border);border-radius:0;overflow:clip;overflow-clip-margin:3px;interpolate-size:allow-keywords;transition:opacity .16s ease,block-size .2s ease,padding-block .2s ease,border-block-width .2s ease,display .2s allow-discrete}a-banner[round]{--banner-round: attr(round type(<length>));border-radius:var(--banner-round, 999px)}a-banner [slot=close] a-button,a-banner a-button[slot=close]{height:100%;width:40px}a-banner-message{font-size:14px;line-height:20px;font-weight:475;text-align:center}a-banner[tone=brand]{--banner-bg: var(--bg-4-brand);--banner-border: var(--border-4-brand);--banner-text: var(--text-2-brand)}a-banner[tone=info]{--banner-bg: var(--bg-4-info);--banner-border: var(--border-4-info);--banner-text: var(--text-2-info)}a-banner[tone=success]{--banner-bg: var(--bg-4-success);--banner-border: var(--border-4-success);--banner-text: var(--text-2-success)}a-banner[tone=warning]{--banner-bg: var(--bg-4-warning);--banner-border: var(--border-4-warning);--banner-text: var(--text-2-warning)}a-banner[tone=critical]{--banner-bg: var(--bg-4-critical);--banner-border: var(--border-4-critical);--banner-text: var(--text-2-critical)}a-banner[tone]:not([tone=""],[tone=neutral],[tone=brand],[tone=info],[tone=success],[tone=warning],[tone=critical]){--banner-tone-source: attr(tone type(<color>), currentColor);--banner-text: oklch(from var(--banner-tone-source) .5 .125 h);--banner-bg: oklch(from var(--banner-tone-source) .955 .02 h);--banner-border: oklch(from var(--banner-tone-source) .9 .04 h);.dark &{--banner-text: oklch(from var(--banner-tone-source) .77 .11 h);--banner-bg: oklch(from var(--banner-tone-source) .185 .05 h);--banner-border: oklch(from var(--banner-tone-source) .26 .06 h)}}a-banner:not(:defined){opacity:0}a-banner[state=closed],a-banner[default-state=closed],a-banner:state(closed){display:none;block-size:0;min-block-size:0;padding-block:0;border-block-width:0;opacity:0}@media(forced-colors:active){a-banner{border-width:1px;border-color:CanvasText}}@media(prefers-reduced-motion:reduce){a-banner{transition:none}}}
+@layer anta.components{a-banner{--banner-bg: var(--bg-4);--banner-border: var(--border-4);--banner-text: var(--text-2);display:flex;align-items:center;justify-content:flex-start;flex-wrap:wrap;gap:4px 1ch;position:relative;box-sizing:border-box;width:100%;min-height:40px;padding-block:6px;padding-inline:16px 48px;color:var(--banner-text);background:var(--banner-bg);border:0 solid var(--banner-border);border-radius:0;overflow:clip;overflow-clip-margin:3px;interpolate-size:allow-keywords;transition:opacity .16s ease,block-size .2s ease,padding-block .2s ease,border-block-width .2s ease,display .2s allow-discrete}a-banner[align=center]{justify-content:center;padding-inline:48px}a-banner[round]{--banner-round: attr(round type(<length>));border-radius:var(--banner-round, 999px)}a-banner [slot=close] a-button,a-banner a-button[slot=close]{height:100%;width:40px}a-banner-message{font-size:14px;line-height:20px;font-weight:475;text-align:start}a-banner[align=center] a-banner-message{text-align:center}a-banner[tone=brand]{--banner-bg: var(--bg-4-brand);--banner-border: var(--border-4-brand);--banner-text: var(--text-2-brand)}a-banner[tone=info]{--banner-bg: var(--bg-4-info);--banner-border: var(--border-4-info);--banner-text: var(--text-2-info)}a-banner[tone=success]{--banner-bg: var(--bg-4-success);--banner-border: var(--border-4-success);--banner-text: var(--text-2-success)}a-banner[tone=warning]{--banner-bg: var(--bg-4-warning);--banner-border: var(--border-4-warning);--banner-text: var(--text-2-warning)}a-banner[tone=critical]{--banner-bg: var(--bg-4-critical);--banner-border: var(--border-4-critical);--banner-text: var(--text-2-critical)}a-banner[tone]:not([tone=""],[tone=neutral],[tone=brand],[tone=info],[tone=success],[tone=warning],[tone=critical]){--banner-tone-source: attr(tone type(<color>), currentColor);--banner-text: oklch(from var(--banner-tone-source) .5 .125 h);--banner-bg: oklch(from var(--banner-tone-source) .955 .02 h);--banner-border: oklch(from var(--banner-tone-source) .9 .04 h);.dark &{--banner-text: oklch(from var(--banner-tone-source) .77 .11 h);--banner-bg: oklch(from var(--banner-tone-source) .185 .05 h);--banner-border: oklch(from var(--banner-tone-source) .26 .06 h)}}a-banner:not(:defined){opacity:0}a-banner[state=closed],a-banner[default-state=closed],a-banner:state(closed){display:none;block-size:0;min-block-size:0;padding-block:0;border-block-width:0;opacity:0}@media(forced-colors:active){a-banner{border-width:1px;border-color:CanvasText}}@media(prefers-reduced-motion:reduce){a-banner{transition:none}}}

package/dist/elements/a-banner.js

@@ -11,6 +11,7 @@ const SHADOW_STYLE = `
     gap: 4px;
     flex-shrink: 0;
   }
+  slot[name="actions"][hidden] { display: none; }
 
   slot[name="close"] {
     position: absolute;
@@ -57,10 +58,21 @@ class ABannerElement extends HTMLElementBase {
     const actionsSlot = document.createElement("slot");
     actionsSlot.name = "actions";
     actionsSlot.setAttribute("part", "actions");
+    const syncActionsSlot = () => {
+      actionsSlot.hidden = !actionsSlot.assignedNodes({ flatten: true }).some((node) => {
+        if (node.nodeType === Node.TEXT_NODE) return node.textContent?.trim() !== "";
+        if (node.nodeType !== Node.ELEMENT_NODE) return false;
+        const element = node;
+        return !element.hasAttribute("data-anta-banner-actions-wrapper") || !element.matches(":empty");
+      });
+    };
+    actionsSlot.hidden = true;
+    actionsSlot.addEventListener("slotchange", syncActionsSlot);
     const closeSlot = document.createElement("slot");
     closeSlot.name = "close";
     closeSlot.setAttribute("part", "close");
     shadow.append(style, messageSlot, contentSlot, actionsSlot, closeSlot);
+    syncActionsSlot();
     this.addEventListener(DISMISS_TRIGGER, (e) => {
       e.stopPropagation();
       this.#requestDismiss();

package/dist/elements/a-button.css

@@ -1 +1 @@
-@layer anta{a-button,a[role=button][data-anta],button[data-anta],input[data-anta]:is([type=reset],[type=submit]){--button-primary-fg: #ffffff;--bg-primary-disabled: #ece9ec;--bg-secondary-disabled: #f6f4f6;--fg-disabled-primary: #afa9b1;--fg-disabled: #afa9b1;--button-loading-stripe: 14px;--button-loading-stripe-gap: 16px;--button-loading-period: calc( var(--button-loading-stripe) + var(--button-loading-stripe-gap) );--button-loading-angle: 125deg;--button-loading-x-period: calc( var(--button-loading-period) / cos(var(--button-loading-angle) - 90deg) );--button-loading-opacity: .15;--button-loading-blur: 5px;--_src: var(--anta-seed-neutral);--_tone-pl-rest: .5;--_tone-pl-hover: .45;--_tone-pl-active: .4;--_tone-pl-c: .02;--_tone-fg-l: .46;--_tone-fg-strong-l: .4;--_tone-fg-c: .008;--_tone-fg-shift: .05;--_tone-bg-l: .54;--_tone-bg-c: .03;--_tone-a-rest: .1;--_tone-a-hover: .15;--_tone-a-active: .2;--_tone-quat-hover-l: .38;--_tone-quat-rest-a: .85;--button-bg-primary-rest: oklch(from var(--_src) var(--_tone-pl-rest) var(--_tone-pl-c) h);--button-bg-primary-hover: oklch(from var(--_src) var(--_tone-pl-hover) var(--_tone-pl-c) h);--button-bg-primary-active: oklch(from var(--_src) var(--_tone-pl-active) var(--_tone-pl-c) h);--button-fg-primary-rest: var(--button-primary-fg);--button-fg-secondary-rest: oklch(from var(--_src) var(--_tone-fg-l) var(--_tone-fg-c) h);--button-fg-secondary-hover: oklch(from var(--_src) var(--_tone-fg-strong-l) var(--_tone-fg-c) h);--button-fg-secondary-l-shift: var(--_tone-fg-shift);--button-fg-tertiary-rest: oklch(from var(--_src) var(--_tone-fg-l) var(--_tone-fg-c) h);--button-fg-tertiary-hover: oklch(from var(--_src) var(--_tone-fg-strong-l) var(--_tone-fg-c) h);--button-bg-tertiary-hover: oklch(from var(--_src) var(--_tone-bg-l) var(--_tone-bg-c) h / var(--_tone-a-rest));--button-bg-tertiary-active: oklch(from var(--_src) var(--_tone-bg-l) var(--_tone-bg-c) h / var(--_tone-a-hover));--button-fg-quaternary-rest: oklch(from var(--_src) var(--_tone-fg-l) var(--_tone-fg-c) h / var(--_tone-quat-rest-a));--button-fg-quaternary-hover: oklch(from var(--_src) var(--_tone-quat-hover-l) var(--_tone-fg-c) h);--button-bg-secondary-rest: oklch(from var(--_src) var(--_tone-bg-l) var(--_tone-bg-c) h / var(--_tone-a-rest));--button-bg-secondary-hover: oklch(from var(--_src) var(--_tone-bg-l) var(--_tone-bg-c) h / var(--_tone-a-hover));--button-bg-secondary-active: oklch(from var(--_src) var(--_tone-bg-l) var(--_tone-bg-c) h / var(--_tone-a-active));--_fs: 15px;--_lh: 20px;--_pb: 1px;--button-padding-x: 9px;--button-padding-y: calc((8px - var(--_pb)) / 2);--button-timing-in: 75ms ease-in;--button-timing-active: 50ms linear;--button-timing-out: .15s ease-out;--button-loading-duration: .5s}a-button[round],a[role=button][data-anta][round],button[data-anta][round],input[data-anta]:is([type=reset],[type=submit])[round]{--button-round: attr(round type(<length>), 999px);border-radius:var(--button-round, 999px)}a-button[tone]:not([tone=""],[tone=neutral]),a[role=button][data-anta][tone]:not([tone=""],[tone=neutral]),button[data-anta][tone]:not([tone=""],[tone=neutral]),input[data-anta]:is([type=reset],[type=submit])[tone]:not([tone=""],[tone=neutral]){--_tone-pl-rest: .51;--_tone-pl-hover: .46;--_tone-pl-active: .41;--_tone-pl-c: .17;--_tone-fg-l: .46;--_tone-fg-strong-l: .4;--_tone-fg-c: .17;--_tone-fg-shift: .05;--_tone-bg-l: .54;--_tone-bg-c: .17;--_tone-a-rest: .1;--_tone-a-hover: .15;--_tone-a-active: .2;--_tone-quat-hover-l: .38;--_tone-quat-rest-a: .85}a-button[tone=brand],a[role=button][data-anta][tone=brand],button[data-anta][tone=brand],input[data-anta]:is([type=reset],[type=submit])[tone=brand]{--_src: var(--anta-seed-brand)}a-button[tone=info],a[role=button][data-anta][tone=info],button[data-anta][tone=info],input[data-anta]:is([type=reset],[type=submit])[tone=info]{--_src: var(--anta-seed-info)}a-button[tone=success],a[role=button][data-anta][tone=success],button[data-anta][tone=success],input[data-anta]:is([type=reset],[type=submit])[tone=success]{--_src: var(--anta-seed-success)}a-button[tone=warning],a[role=button][data-anta][tone=warning],button[data-anta][tone=warning],input[data-anta]:is([type=reset],[type=submit])[tone=warning]{--_src: var(--anta-seed-warning)}a-button[tone=critical],a[role=button][data-anta][tone=critical],button[data-anta][tone=critical],input[data-anta]:is([type=reset],[type=submit])[tone=critical]{--_src: var(--anta-seed-critical)}a-button[tone]:not([tone=""],[tone=neutral],[tone=brand],[tone=info],[tone=success],[tone=warning],[tone=critical]),a[role=button][data-anta][tone]:not([tone=""],[tone=neutral],[tone=brand],[tone=info],[tone=success],[tone=warning],[tone=critical]),button[data-anta][tone]:not([tone=""],[tone=neutral],[tone=brand],[tone=info],[tone=success],[tone=warning],[tone=critical]),input[data-anta]:is([type=reset],[type=submit])[tone]:not([tone=""],[tone=neutral],[tone=brand],[tone=info],[tone=success],[tone=warning],[tone=critical]){--_src: var(--button-tone-source, attr(tone type(<color>), transparent))}.dark a-button,.dark a[role=button][data-anta],.dark button[data-anta],.dark input[data-anta]:is([type=reset],[type=submit]){--bg-primary-disabled: #272329;--bg-secondary-disabled: #1d1a1e;--fg-disabled-primary: #776e77;--fg-disabled: #635b65;--_tone-pl-rest: .4;--_tone-pl-hover: .44;--_tone-pl-active: .48;--_tone-pl-c: .015;--_tone-fg-l: .86;--_tone-fg-strong-l: .86;--_tone-fg-c: .015;--_tone-fg-shift: 0;--_tone-bg-l: .44;--_tone-bg-c: .01;--_tone-a-rest: .24;--_tone-a-hover: .34;--_tone-a-active: .44;--_tone-quat-hover-l: .9;--_tone-quat-rest-a: .85}.dark a-button[tone]:not([tone=""],[tone=neutral]),.dark a[role=button][data-anta][tone]:not([tone=""],[tone=neutral]),.dark button[data-anta][tone]:not([tone=""],[tone=neutral]),.dark input[data-anta]:is([type=reset],[type=submit])[tone]:not([tone=""],[tone=neutral]){--_tone-pl-rest: .4;--_tone-pl-hover: .44;--_tone-pl-active: .48;--_tone-pl-c: .16;--_tone-fg-l: .86;--_tone-fg-strong-l: .86;--_tone-fg-c: .13;--_tone-fg-shift: 0;--_tone-bg-l: .58;--_tone-bg-c: .16;--_tone-a-rest: .215;--_tone-a-hover: .29;--_tone-a-active: .34;--_tone-quat-hover-l: .9;--_tone-quat-rest-a: .85}button[data-anta],input[data-anta]:is([type=reset],[type=submit]){box-sizing:border-box;margin:0;appearance:none;-webkit-appearance:none;border:none}a-button,a[role=button][data-anta],button[data-anta],input[data-anta]:is([type=reset],[type=submit]){user-select:none;display:inline-flex;align-items:center;gap:.5ch;overflow:hidden;cursor:pointer;&:has(>a-copy):not(:has(>a-icon)){cursor:copy}flex-shrink:0;color:var(--button-fg);background-color:var(--button-bg);border-radius:4px;text-decoration:none;box-shadow:inset 0 0 1px color-mix(in oklch,currentColor,transparent 90%);font-size:var(--_fs);font-family:var(--sans-serif);font-weight:450;font-variation-settings:"wdth" 88,"slnt" 0,"ital" 0;font-feature-settings:"ss02","ss05","tnum";line-height:var(--_lh);letter-spacing:.05ch;text-overflow:ellipsis;text-wrap:nowrap;white-space:nowrap;max-width:100%;padding-inline:var(--button-padding-x);padding-block:var(--button-padding-y);min-height:28px;>a-button-label{display:inline-block;text-overflow:ellipsis;text-wrap:nowrap;white-space:nowrap;overflow:hidden;min-width:0;line-height:var(--_lh);padding-bottom:var(--_pb);&:has(>*){display:inline-flex;gap:.25ch}}>*{pointer-events:none}& a-icon{transition:color var(--button-timing-out)}transition:color var(--button-timing-out),background-color var(--button-timing-out);&:hover,&:focus-visible{transition:color var(--button-timing-in),background-color var(--button-timing-in);& a-icon{transition:color var(--button-timing-in)}}&:active,&[selected]{transition:color var(--button-timing-active),background-color var(--button-timing-active);& a-icon{transition:color var(--button-timing-active)}}&[disabled]{pointer-events:none;cursor:not-allowed;transition:none;& a-icon{transition:none}}&:focus-visible{outline:1px solid var(--focus-ring);outline-offset:1px}&[priority=quaternary]{--button-timing-in: 0s;--button-timing-active: 0s;--button-timing-out: 0s}&[size=small]{--button-padding-x: 7px;--_fs: 13px;--_lh: 16px;--_pb: .5px;min-height:24px;& a-icon{--icon-size: 14px}}&[size=large]{--button-padding-x: 13px;--_fs: 17px;--_lh: 24px;--_pb: 1.5px;min-height:32px;& a-icon{--icon-size: 18px}}&[priority=tertiary],&[priority=quaternary]{&[underline=solid]{text-decoration:underline solid}&[underline=dashed]{text-decoration:underline dashed}&[underline=dotted]{text-decoration:underline dotted}&[underline]{text-decoration-color:color-mix(in oklch,currentColor 75%,transparent);text-decoration-thickness:1px;text-underline-offset:3px;&[selected]{text-decoration-color:var(--button-fg);text-decoration-thickness:1px}@media(hover:hover)and (pointer:fine){&:hover{text-decoration-color:var(--button-fg);text-decoration-thickness:1px}}}&[underline][underline-on-hover]{text-decoration-color:transparent;&[selected]{text-decoration-color:transparent}@media(hover:hover)and (pointer:fine){&:hover{text-decoration-color:var(--button-fg)}}}}&[priority=quaternary][paddingless]{--button-padding-x: 0;--button-padding-y: 0;min-height:0}&:has(>a-icon):not(:has(>a-icon~a-icon)):not(:has(>:not(a-icon):not(a-tooltip):not(a-copy))){--button-padding-y: 5px;--button-padding-x: 5px;min-width:28px;justify-content:center;&[size=small]{--button-padding-y: 3px;--button-padding-x: 3px;min-width:24px}&[size=large]{--button-padding-y: 7px;--button-padding-x: 7px;min-width:32px}}&:is(:has(>a-icon:first-child),:has(>a-tooltip:first-child+a-icon)):is(:has(>a-icon~a-icon),:has(>:not(a-icon):not(a-tooltip):not(a-copy))){padding-inline-start:max(0px,var(--button-padding-x) - 2px)}&:is(:has(>a-icon:last-child),:has(>a-icon+a-tooltip:last-child)):is(:has(>a-icon~a-icon),:has(>:not(a-icon):not(a-tooltip):not(a-copy))){padding-inline-end:max(0px,var(--button-padding-x) - 2px)}&[loading]{position:relative;pointer-events:none;cursor:wait;&:before{content:"";position:absolute;top:0;bottom:0;left:calc(0px - var(--button-loading-x-period));right:0;pointer-events:none;background:repeating-linear-gradient(var(--button-loading-angle),transparent 0,transparent var(--button-loading-stripe-gap),currentColor var(--button-loading-stripe-gap),currentColor calc(var(--button-loading-stripe-gap) + var(--button-loading-stripe)));opacity:var(--button-loading-opacity);filter:blur(var(--button-loading-blur));will-change:transform;animation:btn-loading-slide var(--button-loading-duration) linear infinite;animation-delay:-9999s}}--button-fg: oklch(from var(--button-fg-secondary-rest) calc(l - var(--button-fg-secondary-l-shift)) c h);--button-bg: var(--button-bg-secondary-rest);@media(hover:hover)and (pointer:fine){&:hover{--button-fg: var(--button-fg-secondary-hover);--button-bg: var(--button-bg-secondary-hover)}}&:active{--button-fg: var(--button-fg-secondary-hover);--button-bg: var(--button-bg-secondary-active)}&[selected]{--button-fg: var(--button-fg-secondary-hover);--button-bg: var(--button-bg-secondary-hover)}&[priority=primary]{--button-fg: var(--button-fg-primary-rest);--button-bg: var(--button-bg-primary-rest);box-shadow:none;@media(hover:hover)and (pointer:fine){&:hover{--button-bg: var(--button-bg-primary-hover)}}&:active{--button-bg: var(--button-bg-primary-active)}&[selected]{--button-bg: var(--button-bg-primary-hover)}}&[priority=tertiary]{--button-fg: var(--button-fg-tertiary-rest);--button-bg: transparent;box-shadow:none;@media(hover:hover)and (pointer:fine){&:hover{--button-fg: var(--button-fg-tertiary-hover);--button-bg: var(--button-bg-tertiary-hover)}}&:active{--button-fg: var(--button-fg-tertiary-hover);--button-bg: var(--button-bg-tertiary-active)}&[selected]{--button-fg: var(--button-fg-tertiary-hover);--button-bg: var(--button-bg-tertiary-hover)}}&[priority=quaternary]{--button-fg: var(--button-fg-quaternary-rest);--button-bg: transparent;box-shadow:none;font-weight:400;letter-spacing:.06ch;@media(hover:hover)and (pointer:fine){&:hover{--button-fg: var(--button-fg-quaternary-hover)}}&:active{--button-fg: var(--button-fg-quaternary-rest)}&[selected]{--button-fg: var(--button-fg-quaternary-hover)}}&[selected]{box-shadow:inset 0 0 0 .5px currentColor}&[disabled]{background-color:var(--bg-secondary-disabled);color:var(--fg-disabled);&[priority=primary]{background-color:var(--bg-primary-disabled);color:var(--fg-disabled-primary)}&[priority=tertiary],&[priority=quaternary]{background-color:transparent;color:var(--fg-disabled)}}}@media(forced-colors:active){:is(a-button,a[role=button][data-anta],button[data-anta],input[data-anta]:is([type=reset],[type=submit])){--anta-forced-foreground: ButtonText;color:ButtonText;background-color:ButtonFace;border:1px solid ButtonText;box-shadow:none}:is(a-button,a[role=button][data-anta],button[data-anta],input[data-anta]:is([type=reset],[type=submit]))[priority=primary]{--anta-forced-foreground: ButtonFace;color:ButtonFace;background-color:ButtonText;border-color:ButtonText}a-button:is([priority=primary],[selected]){forced-color-adjust:none}:is(a-button,a[role=button][data-anta],button[data-anta],input[data-anta]:is([type=reset],[type=submit]))[priority=tertiary]{--anta-forced-foreground: CanvasText;color:CanvasText;background-color:Canvas;border:0}@media(hover:hover)and (pointer:fine){:is(a-button,a[role=button][data-anta],button[data-anta],input[data-anta]:is([type=reset],[type=submit]))[priority=tertiary]:hover:not(:focus-visible){outline:1px solid ButtonText;outline-offset:0}}:is(a-button,a[role=button][data-anta],button[data-anta],input[data-anta]:is([type=reset],[type=submit]))[priority=quaternary]{--anta-forced-foreground: LinkText;color:LinkText;background-color:ButtonFace;border:0;text-decoration:none}:is(a-button,a[role=button][data-anta],button[data-anta],input[data-anta]:is([type=reset],[type=submit]))[selected]{--anta-forced-foreground: HighlightText;color:HighlightText;background-color:Highlight;border-color:Highlight}:is(a-button,a[role=button][data-anta],button[data-anta],input[data-anta]:is([type=reset],[type=submit]))[disabled]{--anta-forced-foreground: GrayText;color:GrayText;background-color:Canvas;border-color:GrayText;text-decoration-color:GrayText}}}@keyframes btn-loading-slide{to{transform:translate(var(--button-loading-x-period))}}
+@layer anta.components{a-button,a[role=button][data-anta],button[data-anta],input[data-anta]:is([type=reset],[type=submit]){--button-primary-fg: #ffffff;--bg-primary-disabled: #ece9ec;--bg-secondary-disabled: #f6f4f6;--fg-disabled-primary: #afa9b1;--fg-disabled: #afa9b1;--button-loading-stripe: 14px;--button-loading-stripe-gap: 16px;--button-loading-period: calc( var(--button-loading-stripe) + var(--button-loading-stripe-gap) );--button-loading-angle: 125deg;--button-loading-x-period: calc( var(--button-loading-period) / cos(var(--button-loading-angle) - 90deg) );--button-loading-opacity: .15;--button-loading-blur: 5px;--_src: var(--anta-seed-neutral);--_tone-pl-rest: .5;--_tone-pl-hover: .45;--_tone-pl-active: .4;--_tone-pl-c: .02;--_tone-fg-l: .46;--_tone-fg-strong-l: .4;--_tone-fg-c: .008;--_tone-fg-shift: .05;--_tone-bg-l: .54;--_tone-bg-c: .03;--_tone-a-rest: .1;--_tone-a-hover: .15;--_tone-a-active: .2;--_tone-quat-hover-l: .38;--_tone-quat-rest-a: .85;--button-bg-primary-rest: oklch(from var(--_src) var(--_tone-pl-rest) var(--_tone-pl-c) h);--button-bg-primary-hover: oklch(from var(--_src) var(--_tone-pl-hover) var(--_tone-pl-c) h);--button-bg-primary-active: oklch(from var(--_src) var(--_tone-pl-active) var(--_tone-pl-c) h);--button-fg-primary-rest: var(--button-primary-fg);--button-fg-secondary-rest: oklch(from var(--_src) var(--_tone-fg-l) var(--_tone-fg-c) h);--button-fg-secondary-hover: oklch(from var(--_src) var(--_tone-fg-strong-l) var(--_tone-fg-c) h);--button-fg-secondary-l-shift: var(--_tone-fg-shift);--button-fg-tertiary-rest: oklch(from var(--_src) var(--_tone-fg-l) var(--_tone-fg-c) h);--button-fg-tertiary-hover: oklch(from var(--_src) var(--_tone-fg-strong-l) var(--_tone-fg-c) h);--button-bg-tertiary-hover: oklch(from var(--_src) var(--_tone-bg-l) var(--_tone-bg-c) h / var(--_tone-a-rest));--button-bg-tertiary-active: oklch(from var(--_src) var(--_tone-bg-l) var(--_tone-bg-c) h / var(--_tone-a-hover));--button-fg-quaternary-rest: oklch(from var(--_src) var(--_tone-fg-l) var(--_tone-fg-c) h / var(--_tone-quat-rest-a));--button-fg-quaternary-hover: oklch(from var(--_src) var(--_tone-quat-hover-l) var(--_tone-fg-c) h);--button-bg-secondary-rest: oklch(from var(--_src) var(--_tone-bg-l) var(--_tone-bg-c) h / var(--_tone-a-rest));--button-bg-secondary-hover: oklch(from var(--_src) var(--_tone-bg-l) var(--_tone-bg-c) h / var(--_tone-a-hover));--button-bg-secondary-active: oklch(from var(--_src) var(--_tone-bg-l) var(--_tone-bg-c) h / var(--_tone-a-active));--_fs: 15px;--_lh: 20px;--_pb: 1px;--_radius: 4px;--button-padding-x: 9px;--button-padding-y: calc((8px - var(--_pb)) / 2);--button-timing-in: 75ms ease-in;--button-timing-active: 50ms linear;--button-timing-out: .15s ease-out;--button-loading-duration: .5s}a-button[round],a[role=button][data-anta][round],button[data-anta][round],input[data-anta]:is([type=reset],[type=submit])[round]{--button-round: attr(round type(<length>), 999px);--_radius: var(--button-round, 999px)}a-button[tone]:not([tone=""],[tone=neutral]),a[role=button][data-anta][tone]:not([tone=""],[tone=neutral]),button[data-anta][tone]:not([tone=""],[tone=neutral]),input[data-anta]:is([type=reset],[type=submit])[tone]:not([tone=""],[tone=neutral]){--_tone-pl-rest: .51;--_tone-pl-hover: .46;--_tone-pl-active: .41;--_tone-pl-c: .17;--_tone-fg-l: .46;--_tone-fg-strong-l: .4;--_tone-fg-c: .17;--_tone-fg-shift: .05;--_tone-bg-l: .54;--_tone-bg-c: .17;--_tone-a-rest: .1;--_tone-a-hover: .15;--_tone-a-active: .2;--_tone-quat-hover-l: .38;--_tone-quat-rest-a: .85}a-button[tone=brand],a[role=button][data-anta][tone=brand],button[data-anta][tone=brand],input[data-anta]:is([type=reset],[type=submit])[tone=brand]{--_src: var(--anta-seed-brand)}a-button[tone=info],a[role=button][data-anta][tone=info],button[data-anta][tone=info],input[data-anta]:is([type=reset],[type=submit])[tone=info]{--_src: var(--anta-seed-info)}a-button[tone=success],a[role=button][data-anta][tone=success],button[data-anta][tone=success],input[data-anta]:is([type=reset],[type=submit])[tone=success]{--_src: var(--anta-seed-success)}a-button[tone=warning],a[role=button][data-anta][tone=warning],button[data-anta][tone=warning],input[data-anta]:is([type=reset],[type=submit])[tone=warning]{--_src: var(--anta-seed-warning)}a-button[tone=critical],a[role=button][data-anta][tone=critical],button[data-anta][tone=critical],input[data-anta]:is([type=reset],[type=submit])[tone=critical]{--_src: var(--anta-seed-critical)}a-button[tone]:not([tone=""],[tone=neutral],[tone=brand],[tone=info],[tone=success],[tone=warning],[tone=critical]),a[role=button][data-anta][tone]:not([tone=""],[tone=neutral],[tone=brand],[tone=info],[tone=success],[tone=warning],[tone=critical]),button[data-anta][tone]:not([tone=""],[tone=neutral],[tone=brand],[tone=info],[tone=success],[tone=warning],[tone=critical]),input[data-anta]:is([type=reset],[type=submit])[tone]:not([tone=""],[tone=neutral],[tone=brand],[tone=info],[tone=success],[tone=warning],[tone=critical]){--_src: var(--button-tone-source, attr(tone type(<color>), transparent))}.dark a-button,.dark a[role=button][data-anta],.dark button[data-anta],.dark input[data-anta]:is([type=reset],[type=submit]){--bg-primary-disabled: #272329;--bg-secondary-disabled: #1d1a1e;--fg-disabled-primary: #776e77;--fg-disabled: #635b65;--_tone-pl-rest: .4;--_tone-pl-hover: .44;--_tone-pl-active: .48;--_tone-pl-c: .015;--_tone-fg-l: .86;--_tone-fg-strong-l: .86;--_tone-fg-c: .015;--_tone-fg-shift: 0;--_tone-bg-l: .44;--_tone-bg-c: .01;--_tone-a-rest: .24;--_tone-a-hover: .34;--_tone-a-active: .44;--_tone-quat-hover-l: .9;--_tone-quat-rest-a: .85}.dark a-button[tone]:not([tone=""],[tone=neutral]),.dark a[role=button][data-anta][tone]:not([tone=""],[tone=neutral]),.dark button[data-anta][tone]:not([tone=""],[tone=neutral]),.dark input[data-anta]:is([type=reset],[type=submit])[tone]:not([tone=""],[tone=neutral]){--_tone-pl-rest: .4;--_tone-pl-hover: .44;--_tone-pl-active: .48;--_tone-pl-c: .16;--_tone-fg-l: .86;--_tone-fg-strong-l: .86;--_tone-fg-c: .13;--_tone-fg-shift: 0;--_tone-bg-l: .58;--_tone-bg-c: .16;--_tone-a-rest: .215;--_tone-a-hover: .29;--_tone-a-active: .34;--_tone-quat-hover-l: .9;--_tone-quat-rest-a: .85}button[data-anta],input[data-anta]:is([type=reset],[type=submit]){box-sizing:border-box;margin:0;appearance:none;-webkit-appearance:none;border:none}a-button,a[role=button][data-anta],button[data-anta],input[data-anta]:is([type=reset],[type=submit]){user-select:none;display:inline-flex;align-items:center;gap:.5ch;cursor:pointer;&:has(>a-copy):not(:has(>a-icon)){cursor:copy}flex-shrink:0;color:var(--button-fg);background-color:var(--button-bg);border-radius:var(--_radius);text-decoration:none;box-shadow:inset 0 0 1px color-mix(in oklch,currentColor,transparent 90%);font-size:var(--_fs);font-family:var(--sans-serif);font-weight:450;font-variation-settings:"wdth" 88,"slnt" 0,"ital" 0;font-feature-settings:"ss02","ss05","tnum";line-height:var(--_lh);letter-spacing:.05ch;text-overflow:ellipsis;text-wrap:nowrap;white-space:nowrap;max-width:100%;padding-inline:var(--button-padding-x);padding-block:var(--button-padding-y);min-height:28px;>a-button-label{display:inline-block;text-overflow:ellipsis;text-wrap:nowrap;white-space:nowrap;overflow:hidden;min-width:0;line-height:var(--_lh);padding-bottom:var(--_pb);&:has(>*){display:inline-flex;gap:.25ch}}>*{pointer-events:none}& a-icon{transition:color var(--button-timing-out)}transition:color var(--button-timing-out),background-color var(--button-timing-out);&:hover,&:focus-visible{transition:color var(--button-timing-in),background-color var(--button-timing-in);& a-icon{transition:color var(--button-timing-in)}}&:active,&[selected]{transition:color var(--button-timing-active),background-color var(--button-timing-active);& a-icon{transition:color var(--button-timing-active)}}&[disabled]{pointer-events:none;cursor:not-allowed;transition:none;& a-icon{transition:none}}&:focus-visible{outline:1px solid var(--focus-ring);outline-offset:1px}&[priority=quaternary]{--button-timing-in: 0s;--button-timing-active: 0s;--button-timing-out: 0s}&[size=small]{--button-padding-x: 7px;--_fs: 13px;--_lh: 16px;--_pb: .5px;min-height:24px;& a-icon{--icon-size: 14px}}&[size=large]{--button-padding-x: 13px;--_fs: 17px;--_lh: 24px;--_pb: 1.5px;min-height:32px;& a-icon{--icon-size: 18px}}&[priority=tertiary],&[priority=quaternary]{&[underline=solid]{text-decoration:underline solid}&[underline=dashed]{text-decoration:underline dashed}&[underline=dotted]{text-decoration:underline dotted}&[underline]{text-decoration-color:color-mix(in oklch,currentColor 75%,transparent);text-decoration-thickness:1px;text-underline-offset:3px;&[selected]{text-decoration-color:var(--button-fg);text-decoration-thickness:1px}@media(hover:hover)and (pointer:fine){&:hover{text-decoration-color:var(--button-fg);text-decoration-thickness:1px}}}&[underline][underline-on-hover]{text-decoration-color:transparent;&[selected]{text-decoration-color:transparent}@media(hover:hover)and (pointer:fine){&:hover{text-decoration-color:var(--button-fg)}}}}&[priority=quaternary][paddingless]{--button-padding-x: 0;--button-padding-y: 0;min-height:0}&:has(>a-icon):not(:has(>a-icon~a-icon)):not(:has(>:not(a-icon):not(a-tooltip):not(a-copy))){--button-padding-y: 5px;--button-padding-x: 5px;min-width:28px;justify-content:center;&[size=small]{--button-padding-y: 3px;--button-padding-x: 3px;min-width:24px}&[size=large]{--button-padding-y: 7px;--button-padding-x: 7px;min-width:32px}}&:is(:has(>a-icon:first-child),:has(>a-tooltip:first-child+a-icon)):is(:has(>a-icon~a-icon),:has(>:not(a-icon):not(a-tooltip):not(a-copy))){padding-inline-start:max(0px,var(--button-padding-x) - 2px)}&:is(:has(>a-icon:last-child),:has(>a-icon+a-tooltip:last-child)):is(:has(>a-icon~a-icon),:has(>:not(a-icon):not(a-tooltip):not(a-copy))){padding-inline-end:max(0px,var(--button-padding-x) - 2px)}&[loading]{position:relative;pointer-events:none;cursor:wait;&:before{content:"";position:absolute;inset:0;pointer-events:none;clip-path:inset(0 round var(--_radius));background:repeating-linear-gradient(var(--button-loading-angle),transparent 0,transparent var(--button-loading-stripe-gap),currentColor var(--button-loading-stripe-gap),currentColor calc(var(--button-loading-stripe-gap) + var(--button-loading-stripe)));background-position-x:calc(0px - var(--button-loading-x-period));opacity:var(--button-loading-opacity);filter:blur(var(--button-loading-blur));will-change:background-position;animation:btn-loading-slide var(--button-loading-duration) linear infinite;animation-delay:-9999s}}--button-fg: oklch(from var(--button-fg-secondary-rest) calc(l - var(--button-fg-secondary-l-shift)) c h);--button-bg: var(--button-bg-secondary-rest);@media(hover:hover)and (pointer:fine){&:hover{--button-fg: var(--button-fg-secondary-hover);--button-bg: var(--button-bg-secondary-hover)}}&:active{--button-fg: var(--button-fg-secondary-hover);--button-bg: var(--button-bg-secondary-active)}&[selected]{--button-fg: var(--button-fg-secondary-hover);--button-bg: var(--button-bg-secondary-hover)}&[priority=primary]{--button-fg: var(--button-fg-primary-rest);--button-bg: var(--button-bg-primary-rest);box-shadow:none;@media(hover:hover)and (pointer:fine){&:hover{--button-bg: var(--button-bg-primary-hover)}}&:active{--button-bg: var(--button-bg-primary-active)}&[selected]{--button-bg: var(--button-bg-primary-hover)}}&[priority=tertiary]{--button-fg: var(--button-fg-tertiary-rest);--button-bg: transparent;box-shadow:none;@media(hover:hover)and (pointer:fine){&:hover{--button-fg: var(--button-fg-tertiary-hover);--button-bg: var(--button-bg-tertiary-hover)}}&:active{--button-fg: var(--button-fg-tertiary-hover);--button-bg: var(--button-bg-tertiary-active)}&[selected]{--button-fg: var(--button-fg-tertiary-hover);--button-bg: var(--button-bg-tertiary-hover)}}&[priority=quaternary]{--button-fg: var(--button-fg-quaternary-rest);--button-bg: transparent;box-shadow:none;font-weight:400;letter-spacing:.06ch;@media(hover:hover)and (pointer:fine){&:hover{--button-fg: var(--button-fg-quaternary-hover)}}&:active{--button-fg: var(--button-fg-quaternary-rest)}&[selected]{--button-fg: var(--button-fg-quaternary-hover)}}&[selected]{box-shadow:inset 0 0 0 .5px currentColor}&[disabled]{background-color:var(--bg-secondary-disabled);color:var(--fg-disabled);&[priority=primary]{background-color:var(--bg-primary-disabled);color:var(--fg-disabled-primary)}&[priority=tertiary],&[priority=quaternary]{background-color:transparent;color:var(--fg-disabled)}}}@media(forced-colors:active){:is(a-button,a[role=button][data-anta],button[data-anta],input[data-anta]:is([type=reset],[type=submit])){--anta-forced-foreground: ButtonText;color:ButtonText;background-color:ButtonFace;border:1px solid ButtonText;box-shadow:none}:is(a-button,a[role=button][data-anta],button[data-anta],input[data-anta]:is([type=reset],[type=submit]))[priority=primary]{--anta-forced-foreground: ButtonFace;color:ButtonFace;background-color:ButtonText;border-color:ButtonText}a-button:is([priority=primary],[selected]){forced-color-adjust:none}:is(a-button,a[role=button][data-anta],button[data-anta],input[data-anta]:is([type=reset],[type=submit]))[priority=tertiary]{--anta-forced-foreground: CanvasText;color:CanvasText;background-color:Canvas;border:0}@media(hover:hover)and (pointer:fine){:is(a-button,a[role=button][data-anta],button[data-anta],input[data-anta]:is([type=reset],[type=submit]))[priority=tertiary]:hover:not(:focus-visible){outline:1px solid ButtonText;outline-offset:0}}:is(a-button,a[role=button][data-anta],button[data-anta],input[data-anta]:is([type=reset],[type=submit]))[priority=quaternary]{--anta-forced-foreground: LinkText;color:LinkText;background-color:ButtonFace;border:0;text-decoration:none}:is(a-button,a[role=button][data-anta],button[data-anta],input[data-anta]:is([type=reset],[type=submit]))[selected]{--anta-forced-foreground: HighlightText;color:HighlightText;background-color:Highlight;border-color:Highlight}:is(a-button,a[role=button][data-anta],button[data-anta],input[data-anta]:is([type=reset],[type=submit]))[disabled]{--anta-forced-foreground: GrayText;color:GrayText;background-color:Canvas;border-color:GrayText;text-decoration-color:GrayText}}}@keyframes btn-loading-slide{to{background-position-x:0}}

package/dist/elements/a-calendar.css

@@ -1 +1 @@
-@layer anta{.anta-calendar{--calendar-cell-width: 32px;--calendar-cell-height: 28px;display:inline-flex;flex-direction:column;gap:6px}.anta-calendar [data-part=header]{display:flex;align-items:center;gap:0}.anta-calendar [data-part=heading]{flex:1 1 auto;justify-content:center;white-space:nowrap}.anta-calendar .jump-dot{flex:none;inline-size:6px;block-size:6px;border-radius:999px;background:currentColor}.anta-calendar[data-size=small]{--calendar-cell-width: 28px;--calendar-cell-height: 24px}.anta-calendar[data-size=large]{--calendar-cell-width: 36px;--calendar-cell-height: 32px}.anta-calendar[data-size=small] [data-part=weekday]{font-size:13px;line-height:16px}.anta-calendar[data-size=large] [data-part=weekday]{font-size:17px;line-height:24px}a-calendar{display:inline-grid;grid-template-columns:repeat(7,var(--calendar-cell-width, 32px));gap:1px;font-family:var(--sans-serif)}a-calendar [data-part=weekday]{display:flex;align-items:center;justify-content:center;height:24px;font-size:15px;line-height:20px;font-weight:400;color:var(--text-4);user-select:none}a-calendar [data-part=weekday][data-weekend]{color:var(--text-5)}a-calendar a-button[data-part=day-cell]{padding-inline:0;min-width:var(--calendar-cell-width, 32px);min-height:var(--calendar-cell-height, 28px);justify-content:center}a-calendar a-button[data-part=day-cell] a-button-label{padding-bottom:0}a-calendar a-button[data-part=day-cell]:focus-visible{outline-offset:0}a-calendar a-button[data-part=day-cell][data-today]:not([selected]){font-weight:600}a-calendar a-button[data-part=day-cell][data-outside]:not([selected]){opacity:.5}}
+@layer anta.components{.anta-calendar{--calendar-cell-width: 32px;--calendar-cell-height: 28px;display:inline-flex;flex-direction:column;gap:6px}.anta-calendar [data-part=header]{display:flex;align-items:center;gap:0}.anta-calendar [data-part=heading]{flex:1 1 auto;justify-content:center;white-space:nowrap}.anta-calendar .jump-dot{flex:none;inline-size:6px;block-size:6px;border-radius:999px;background:currentColor}.anta-calendar[data-size=small]{--calendar-cell-width: 28px;--calendar-cell-height: 24px}.anta-calendar[data-size=large]{--calendar-cell-width: 36px;--calendar-cell-height: 32px}.anta-calendar[data-size=small] [data-part=weekday]{font-size:13px;line-height:16px}.anta-calendar[data-size=large] [data-part=weekday]{font-size:17px;line-height:24px}a-calendar{display:inline-grid;grid-template-columns:repeat(7,var(--calendar-cell-width, 32px));gap:1px;font-family:var(--sans-serif)}a-calendar [data-part=weekday]{display:flex;align-items:center;justify-content:center;height:24px;font-size:15px;line-height:20px;font-weight:400;color:var(--text-4);user-select:none}a-calendar [data-part=weekday][data-weekend]{color:var(--text-5)}a-calendar a-button[data-part=day-cell]{padding-inline:0;min-width:var(--calendar-cell-width, 32px);min-height:var(--calendar-cell-height, 28px);justify-content:center}a-calendar a-button[data-part=day-cell] a-button-label{padding-bottom:0}a-calendar a-button[data-part=day-cell]:focus-visible{outline-offset:0}a-calendar a-button[data-part=day-cell][data-today]:not([selected]){font-weight:600}a-calendar a-button[data-part=day-cell][data-outside]:not([selected]){opacity:.5}}

package/dist/elements/a-card.css

@@ -1 +1 @@
-@layer anta{a-card{--card-text: var(--text-2);--card-bg-secondary: var(--bg-2);--card-bg-primary: var(--bg-1);--card-bg: var(--card-bg-primary);--card-border: var(--border-4);--card-border-hover: var(--border-3);--card-selected-ring: var(--border-1);--card-bg-hover-lift: .01;--card-radius: 8px;--card-padding: 12px;--card-content-fs: 15px;--card-content-lh: 20px;--card-icon-size: 40px;--card-icon-bg: var(--bg-4);--card-header-nudge: 2px;display:block;box-sizing:border-box;position:relative;width:100%;container-type:inline-size;container-name:card;color:var(--card-text);background:var(--card-bg);box-shadow:0 0 0 1px var(--card-border);border-radius:var(--card-radius);overflow:clip;transition:background-color .15s ease,box-shadow .15s ease,opacity .18s ease}a-card[priority=secondary]{--card-bg: var(--card-bg-secondary);--card-icon-blend: multiply}.dark a-card:not([priority=tertiary]){--card-icon-blend: exclusion}a-card[round]{--card-round: attr(round type(<length>));--card-radius: var(--card-round, 999px)}a-card[priority=tertiary]{--card-bg: color-mix(in oklch, var(--card-bg-primary) 1%, transparent);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.dark a-card:not([tone]),.dark a-card[tone=neutral]{--card-bg-primary: var(--bg-4);--card-icon-bg: var(--bg-5)}@media(hover:hover)and (pointer:fine){a-card[href]:not([loading]):hover{background:oklch(from var(--card-bg) calc(l + var(--card-bg-hover-lift)) c h)}a-card:not([loading]):hover{box-shadow:0 0 0 1px var(--card-border-hover)}}a-card[href]:not([loading]):active{box-shadow:0 0 0 1px var(--card-border)}@media(prefers-reduced-motion:reduce){a-card{transition:none}}a-card:not(:defined){padding:var(--card-padding);opacity:0}a-card:not(:has(>[slot=media]))::part(media),a-card:not(:has(>[slot=header])):not(:has(>[slot=icon]))::part(header),a-card:not(:has(>[slot=icon]))::part(icon),a-card:not(:has(>[slot=footer]))::part(footer),a-card:not(:has(>:not([slot])))::part(body){display:none}a-card>a-card-icon-chip[slot=icon]{display:grid;place-items:center;width:var(--card-icon-size);height:var(--card-icon-size);border-radius:50%;background:var(--card-icon-bg)}a-card:is(:has(>[slot=header]),:has(>[slot=icon]))::part(body){padding-block-start:0}a-card:has(>[slot=footer])::part(body){padding-block-end:0}a-card :is(h1,h2,h3,h4,h5,h6),a-card a-title[level]{margin-block-start:0}a-card>:is(h1,h2,h3,h4,h5,h6)[slot=header],a-card>a-title[slot=header]{margin-block-end:0}a-card>a-title[slot=header]+a-text[slot=header],a-card>:is(h1,h2,h3,h4,h5,h6)[slot=header]+a-text[slot=header]{margin-block-start:1px}a-card[size=large]>a-title[slot=header]+a-text[slot=header],a-card[size=large]>:is(h1,h2,h3,h4,h5,h6)[slot=header]+a-text[slot=header]{margin-block-start:2px}a-card[tone=brand]{--card-text: var(--text-2-brand);--card-bg-secondary: var(--bg-4-brand);--card-bg-primary: var(--bg-2-brand);--card-border: var(--border-4-brand);--card-border-hover: var(--border-3-brand);--card-icon-bg: var(--bg-5-brand);--card-selected-ring: var(--border-1-brand)}a-card[tone=info]{--card-text: var(--text-2-info);--card-bg-secondary: var(--bg-4-info);--card-bg-primary: var(--bg-2-info);--card-border: var(--border-4-info);--card-border-hover: var(--border-3-info);--card-icon-bg: var(--bg-5-info);--card-selected-ring: var(--border-1-info)}a-card[tone=success]{--card-text: var(--text-2-success);--card-bg-secondary: var(--bg-4-success);--card-bg-primary: var(--bg-2-success);--card-border: var(--border-4-success);--card-border-hover: var(--border-3-success);--card-icon-bg: var(--bg-5-success);--card-selected-ring: var(--border-1-success)}a-card[tone=warning]{--card-text: var(--text-2-warning);--card-bg-secondary: var(--bg-4-warning);--card-bg-primary: var(--bg-2-warning);--card-border: var(--border-4-warning);--card-border-hover: var(--border-3-warning);--card-icon-bg: var(--bg-5-warning);--card-selected-ring: var(--border-1-warning)}a-card[tone=critical]{--card-text: var(--text-2-critical);--card-bg-secondary: var(--bg-4-critical);--card-bg-primary: var(--bg-2-critical);--card-border: var(--border-4-critical);--card-border-hover: var(--border-3-critical);--card-icon-bg: var(--bg-5-critical);--card-selected-ring: var(--border-1-critical)}.dark a-card[tone=brand]{--card-bg-primary: var(--bg-4-brand);--card-bg-secondary: var(--bg-2-brand)}.dark a-card[tone=info]{--card-bg-primary: var(--bg-4-info);--card-bg-secondary: var(--bg-2-info)}.dark a-card[tone=success]{--card-bg-primary: var(--bg-4-success);--card-bg-secondary: var(--bg-2-success)}.dark a-card[tone=warning]{--card-bg-primary: var(--bg-4-warning);--card-bg-secondary: var(--bg-2-warning)}.dark a-card[tone=critical]{--card-bg-primary: var(--bg-4-critical);--card-bg-secondary: var(--bg-2-critical)}a-card[tone]:not([tone=neutral],[tone=brand],[tone=info],[tone=success],[tone=warning],[tone=critical]){--card-tone-source: attr(tone type(<color>), currentColor);--card-text: oklch(from var(--card-tone-source) .41 .15 h);--card-bg-secondary: oklch(from var(--card-tone-source) .955 .02 h);--card-bg-primary: oklch(from var(--card-tone-source) .99 .006 h);--card-icon-bg: oklch(from var(--card-tone-source) .925 .03 h);--card-border: oklch(from var(--card-tone-source) .895 .045 h);--card-border-hover: oklch(from var(--card-tone-source) .85 .06 h);--card-selected-ring: oklch(from var(--card-tone-source) .6 .15 h)}.dark a-card[tone]:not([tone=neutral],[tone=brand],[tone=info],[tone=success],[tone=warning],[tone=critical]){--card-text: oklch(from var(--card-tone-source) .75 .11 h);--card-bg-secondary: oklch(from var(--card-tone-source) .13 .02 h);--card-bg-primary: oklch(from var(--card-tone-source) .19 .04 h);--card-icon-bg: oklch(from var(--card-tone-source) .22 .05 h);--card-border: oklch(from var(--card-tone-source) .26 .07 h);--card-border-hover: oklch(from var(--card-tone-source) .32 .09 h);--card-selected-ring: oklch(from var(--card-tone-source) .7 .13 h)}a-card[priority=tertiary]{--card-icon-bg: var(--bg-3)}a-card[tone=brand][priority=tertiary]{--card-icon-bg: var(--bg-3-brand)}a-card[tone=info][priority=tertiary]{--card-icon-bg: var(--bg-3-info)}a-card[tone=success][priority=tertiary]{--card-icon-bg: var(--bg-3-success)}a-card[tone=warning][priority=tertiary]{--card-icon-bg: var(--bg-3-warning)}a-card[tone=critical][priority=tertiary]{--card-icon-bg: var(--bg-3-critical)}a-card[tone]:not([tone=neutral],[tone=brand],[tone=info],[tone=success],[tone=warning],[tone=critical])[priority=tertiary]{--card-icon-bg: oklch(from var(--card-tone-source) .97 .014 h)}.dark a-card[tone=brand][priority=tertiary]{--card-icon-bg: color-mix(in oklch, var(--bg-5-brand), white 10%)}.dark a-card[tone=info][priority=tertiary]{--card-icon-bg: color-mix(in oklch, var(--bg-5-info), white 10%)}.dark a-card[tone=success][priority=tertiary]{--card-icon-bg: color-mix(in oklch, var(--bg-5-success), white 10%)}.dark a-card[tone=warning][priority=tertiary]{--card-icon-bg: color-mix(in oklch, var(--bg-5-warning), white 10%)}.dark a-card[tone=critical][priority=tertiary]{--card-icon-bg: color-mix(in oklch, var(--bg-5-critical), white 10%)}.dark a-card:not([tone])[priority=tertiary],.dark a-card[tone=neutral][priority=tertiary]{--card-icon-bg: color-mix(in oklch, var(--bg-5), white 10%)}.dark a-card[tone]:not([tone=neutral],[tone=brand],[tone=info],[tone=success],[tone=warning],[tone=critical])[priority=tertiary]{--card-icon-bg: color-mix(in oklch, oklch(from var(--card-tone-source) .22 .05 h), white 10%)}@media(forced-colors:active){a-card{border:1px solid CanvasText;box-shadow:none}a-card[href]{border-color:LinkText}a-card>a-card-icon-chip[slot=icon]{box-sizing:border-box;border:1px dotted CanvasText}}a-card[size=small]{--card-padding: 8px;--card-header-nudge: 1px;--card-icon-size: 32px;--card-content-fs: 13px;--card-content-lh: 16px}a-card[size=large]{--card-padding: 16px;--card-header-nudge: 4px;--card-icon-size: 44px;--card-content-fs: 17px;--card-content-lh: 24px}}a-card>p:last-child,a-card>:not([slot])>p:last-child{margin-block-end:0}
+@layer anta.components{a-card{--card-text: var(--text-2);--card-bg-secondary: var(--bg-2);--card-bg-primary: var(--bg-1);--card-bg: var(--card-bg-primary);--card-border: var(--border-4);--card-border-hover: var(--border-3);--card-selected-ring: var(--border-1);--card-bg-hover-lift: .01;--card-radius: 8px;--card-padding: 12px;--card-content-fs: 15px;--card-content-lh: 20px;--card-icon-size: 40px;--card-icon-bg: var(--bg-4);--card-header-nudge: 2px;display:block;box-sizing:border-box;position:relative;width:100%;container-type:inline-size;container-name:card;color:var(--card-text);background:var(--card-bg);box-shadow:0 0 0 1px var(--card-border);border-radius:var(--card-radius);overflow:clip;transition:background-color .15s ease,box-shadow .15s ease,opacity .18s ease}a-card[priority=secondary]{--card-bg: var(--card-bg-secondary);--card-icon-blend: multiply}.dark a-card:not([priority=tertiary]){--card-icon-blend: exclusion}a-card[round]{--card-round: attr(round type(<length>));--card-radius: var(--card-round, 999px)}a-card[priority=tertiary]{--card-bg: color-mix(in oklch, var(--card-bg-primary) 1%, transparent);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.dark a-card:not([tone]),.dark a-card[tone=neutral]{--card-bg-primary: var(--bg-4);--card-icon-bg: var(--bg-5)}@media(hover:hover)and (pointer:fine){a-card[href]:not([loading]):hover{background:oklch(from var(--card-bg) calc(l + var(--card-bg-hover-lift)) c h)}a-card:not([loading]):hover{box-shadow:0 0 0 1px var(--card-border-hover)}}a-card[href]:not([loading]):active{box-shadow:0 0 0 1px var(--card-border)}@media(prefers-reduced-motion:reduce){a-card{transition:none}}a-card:not(:defined){padding:var(--card-padding);opacity:0}a-card:not(:has(>[slot=media]))::part(media),a-card:not(:has(>[slot=header])):not(:has(>[slot=icon]))::part(header),a-card:not(:has(>[slot=icon]))::part(icon),a-card:not(:has(>[slot=footer]))::part(footer),a-card:not(:has(>:not([slot])))::part(body){display:none}a-card>a-card-icon-chip[slot=icon]{display:grid;place-items:center;width:var(--card-icon-size);height:var(--card-icon-size);border-radius:50%;background:var(--card-icon-bg)}a-card:is(:has(>[slot=header]),:has(>[slot=icon]))::part(body){padding-block-start:0}a-card:has(>[slot=footer])::part(body){padding-block-end:0}a-card :is(h1,h2,h3,h4,h5,h6),a-card a-title[level]{margin-block-start:0}a-card>:is(h1,h2,h3,h4,h5,h6)[slot=header],a-card>a-title[slot=header]{margin-block-end:0}a-card>a-title[slot=header]+a-text[slot=header],a-card>:is(h1,h2,h3,h4,h5,h6)[slot=header]+a-text[slot=header]{margin-block-start:1px}a-card[size=large]>a-title[slot=header]+a-text[slot=header],a-card[size=large]>:is(h1,h2,h3,h4,h5,h6)[slot=header]+a-text[slot=header]{margin-block-start:2px}a-card[tone=brand]{--card-text: var(--text-2-brand);--card-bg-secondary: var(--bg-4-brand);--card-bg-primary: var(--bg-2-brand);--card-border: var(--border-4-brand);--card-border-hover: var(--border-3-brand);--card-icon-bg: var(--bg-5-brand);--card-selected-ring: var(--border-1-brand)}a-card[tone=info]{--card-text: var(--text-2-info);--card-bg-secondary: var(--bg-4-info);--card-bg-primary: var(--bg-2-info);--card-border: var(--border-4-info);--card-border-hover: var(--border-3-info);--card-icon-bg: var(--bg-5-info);--card-selected-ring: var(--border-1-info)}a-card[tone=success]{--card-text: var(--text-2-success);--card-bg-secondary: var(--bg-4-success);--card-bg-primary: var(--bg-2-success);--card-border: var(--border-4-success);--card-border-hover: var(--border-3-success);--card-icon-bg: var(--bg-5-success);--card-selected-ring: var(--border-1-success)}a-card[tone=warning]{--card-text: var(--text-2-warning);--card-bg-secondary: var(--bg-4-warning);--card-bg-primary: var(--bg-2-warning);--card-border: var(--border-4-warning);--card-border-hover: var(--border-3-warning);--card-icon-bg: var(--bg-5-warning);--card-selected-ring: var(--border-1-warning)}a-card[tone=critical]{--card-text: var(--text-2-critical);--card-bg-secondary: var(--bg-4-critical);--card-bg-primary: var(--bg-2-critical);--card-border: var(--border-4-critical);--card-border-hover: var(--border-3-critical);--card-icon-bg: var(--bg-5-critical);--card-selected-ring: var(--border-1-critical)}.dark a-card[tone=brand]{--card-bg-primary: var(--bg-4-brand);--card-bg-secondary: var(--bg-2-brand)}.dark a-card[tone=info]{--card-bg-primary: var(--bg-4-info);--card-bg-secondary: var(--bg-2-info)}.dark a-card[tone=success]{--card-bg-primary: var(--bg-4-success);--card-bg-secondary: var(--bg-2-success)}.dark a-card[tone=warning]{--card-bg-primary: var(--bg-4-warning);--card-bg-secondary: var(--bg-2-warning)}.dark a-card[tone=critical]{--card-bg-primary: var(--bg-4-critical);--card-bg-secondary: var(--bg-2-critical)}a-card[tone]:not([tone=neutral],[tone=brand],[tone=info],[tone=success],[tone=warning],[tone=critical]){--card-tone-source: attr(tone type(<color>), currentColor);--card-text: oklch(from var(--card-tone-source) .41 .15 h);--card-bg-secondary: oklch(from var(--card-tone-source) .955 .02 h);--card-bg-primary: oklch(from var(--card-tone-source) .99 .006 h);--card-icon-bg: oklch(from var(--card-tone-source) .925 .03 h);--card-border: oklch(from var(--card-tone-source) .895 .045 h);--card-border-hover: oklch(from var(--card-tone-source) .85 .06 h);--card-selected-ring: oklch(from var(--card-tone-source) .6 .15 h)}.dark a-card[tone]:not([tone=neutral],[tone=brand],[tone=info],[tone=success],[tone=warning],[tone=critical]){--card-text: oklch(from var(--card-tone-source) .75 .11 h);--card-bg-secondary: oklch(from var(--card-tone-source) .13 .02 h);--card-bg-primary: oklch(from var(--card-tone-source) .19 .04 h);--card-icon-bg: oklch(from var(--card-tone-source) .22 .05 h);--card-border: oklch(from var(--card-tone-source) .26 .07 h);--card-border-hover: oklch(from var(--card-tone-source) .32 .09 h);--card-selected-ring: oklch(from var(--card-tone-source) .7 .13 h)}a-card[priority=tertiary]{--card-icon-bg: var(--bg-3)}a-card[tone=brand][priority=tertiary]{--card-icon-bg: var(--bg-3-brand)}a-card[tone=info][priority=tertiary]{--card-icon-bg: var(--bg-3-info)}a-card[tone=success][priority=tertiary]{--card-icon-bg: var(--bg-3-success)}a-card[tone=warning][priority=tertiary]{--card-icon-bg: var(--bg-3-warning)}a-card[tone=critical][priority=tertiary]{--card-icon-bg: var(--bg-3-critical)}a-card[tone]:not([tone=neutral],[tone=brand],[tone=info],[tone=success],[tone=warning],[tone=critical])[priority=tertiary]{--card-icon-bg: oklch(from var(--card-tone-source) .97 .014 h)}.dark a-card[tone=brand][priority=tertiary]{--card-icon-bg: color-mix(in oklch, var(--bg-5-brand), white 10%)}.dark a-card[tone=info][priority=tertiary]{--card-icon-bg: color-mix(in oklch, var(--bg-5-info), white 10%)}.dark a-card[tone=success][priority=tertiary]{--card-icon-bg: color-mix(in oklch, var(--bg-5-success), white 10%)}.dark a-card[tone=warning][priority=tertiary]{--card-icon-bg: color-mix(in oklch, var(--bg-5-warning), white 10%)}.dark a-card[tone=critical][priority=tertiary]{--card-icon-bg: color-mix(in oklch, var(--bg-5-critical), white 10%)}.dark a-card:not([tone])[priority=tertiary],.dark a-card[tone=neutral][priority=tertiary]{--card-icon-bg: color-mix(in oklch, var(--bg-5), white 10%)}.dark a-card[tone]:not([tone=neutral],[tone=brand],[tone=info],[tone=success],[tone=warning],[tone=critical])[priority=tertiary]{--card-icon-bg: color-mix(in oklch, oklch(from var(--card-tone-source) .22 .05 h), white 10%)}@media(forced-colors:active){a-card{border:1px solid CanvasText;box-shadow:none}a-card[href]{border-color:LinkText}a-card>a-card-icon-chip[slot=icon]{box-sizing:border-box;border:1px dotted CanvasText}}a-card[size=small]{--card-padding: 8px;--card-header-nudge: 1px;--card-icon-size: 32px;--card-content-fs: 13px;--card-content-lh: 16px}a-card[size=large]{--card-padding: 16px;--card-header-nudge: 4px;--card-icon-size: 44px;--card-content-fs: 17px;--card-content-lh: 24px}}a-card>p:last-child,a-card>:not([slot])>p:last-child{margin-block-end:0}

package/dist/elements/a-checkbox.css

@@ -1 +1 @@
-@layer anta{a-checkbox{--checkbox-gap: 8px;--checkbox-box-size: 16px;--checkbox-bg: var(--bg-1);--checkbox-tone-source: var(--anta-seed-neutral);--checkbox-off-tone-source: var(--anta-seed-neutral);--_tone-l-rest: .6;--_tone-l-hover: .45;--_tone-l-active: .4;--checkbox-bg-selected: oklch(from var(--checkbox-tone-source) var(--_tone-l-rest) c h);--checkbox-bg-selected-hover: oklch(from var(--checkbox-tone-source) var(--_tone-l-hover) c h);--checkbox-bg-selected-active: oklch(from var(--checkbox-tone-source) var(--_tone-l-active) c h);--checkbox-border-neutral: var(--border-3);--checkbox-border: var(--checkbox-border-neutral);--checkbox-border-hover: var(--border-2);--checkbox-border-active: var(--border-1);--checkbox-icon: #f6f4f6;--checkbox-icon-disabled: #c1b9c1;--checkbox-bg-disabled: color-mix(in oklch, #44374b 10%, transparent);--checkbox-border-disabled: color-mix(in oklch, #44374b 10%, transparent);--checkbox-mask-size: 12px;--checkbox-mask-check: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");--checkbox-mask-indeterminate: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3C/svg%3E");--checkbox-label-color: var(--text-2);--checkbox-label-color-disabled: var(--text-4);--checkbox-hint-color: var(--text-3);--checkbox-label-fs: 15px;--checkbox-label-lh: 20px;--checkbox-hint-fs: 13px;--checkbox-hint-lh: 16px;display:inline-grid;grid-template-columns:auto 1fr;align-items:start;column-gap:var(--checkbox-gap);vertical-align:middle;cursor:pointer;user-select:none;-webkit-user-drag:none;outline:none;color:var(--checkbox-label-color);font-family:var(--sans-serif);font-size:var(--checkbox-label-fs);line-height:var(--checkbox-label-lh);font-feature-settings:"ss02","ss05","tnum";&:before{content:"";grid-column:1;grid-row:1 / -1;align-self:start;margin-block-start:calc((var(--checkbox-label-lh) - var(--checkbox-box-size)) / 2);box-sizing:border-box;inline-size:16px;block-size:16px;border-radius:4px;background:var(--checkbox-bg);border:1.5px solid var(--checkbox-border);transition:background-color .15s ease-out,border-color .15s ease-out}&[round]{--checkbox-round: attr(round type(<length>), 999px)}&[round]:before{border-radius:var(--checkbox-round, 999px)}&:after{content:"";grid-column:1;grid-row:1 / -1;align-self:start;margin-block-start:calc((var(--checkbox-label-lh) - var(--checkbox-box-size)) / 2);inline-size:16px;block-size:16px;background-color:transparent;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;-webkit-mask-size:var(--checkbox-mask-size);mask-size:var(--checkbox-mask-size)}@media(hover:hover)and (pointer:fine){&:not(:disabled):hover:before{border-color:var(--checkbox-border-hover);transition:background-color 75ms ease-in,border-color 75ms ease-in}&:not(:disabled):hover:is(:state(checked),:state(indeterminate)):before{background:var(--checkbox-bg-selected-hover);border-color:var(--checkbox-bg-selected-hover)}}&:not(:disabled):active:before{border-color:var(--checkbox-border-active);transition:background-color 50ms linear,border-color 50ms linear}&:not(:disabled):active:is(:state(checked),:state(indeterminate)):before{background:var(--checkbox-bg-selected-active);border-color:var(--checkbox-bg-selected-active)}&:is(:state(checked),:state(indeterminate)){&:before{background:var(--checkbox-bg-selected);border-color:var(--checkbox-bg-selected)}&:after{background-color:var(--checkbox-icon)}}&:state(checked):after{-webkit-mask-image:var(--checkbox-mask-check);mask-image:var(--checkbox-mask-check)}&:state(indeterminate):after{-webkit-mask-image:var(--checkbox-mask-indeterminate);mask-image:var(--checkbox-mask-indeterminate)}&:focus-visible{outline:none}&:focus-visible:before{outline:1px solid var(--focus-ring);outline-offset:1px}&:disabled{cursor:not-allowed;color:var(--checkbox-label-color-disabled);&:before{background:var(--checkbox-bg-disabled);border-color:var(--checkbox-border-disabled);transition:none}&:is(:state(checked),:state(indeterminate)):after{background-color:var(--checkbox-icon-disabled)}a-checkbox-hint{color:var(--checkbox-label-color-disabled)}}&[size=small]{--checkbox-gap: 6px;--checkbox-box-size: 14px;--checkbox-label-fs: 13px;--checkbox-label-lh: 16px;--checkbox-hint-fs: 12px;--checkbox-hint-lh: 14px;--checkbox-mask-size: 10px;&:before,&:after{inline-size:14px;block-size:14px}}&[size=large]{--checkbox-box-size: 18px;--checkbox-label-fs: 17px;--checkbox-label-lh: 22px;--checkbox-hint-fs: 15px;--checkbox-hint-lh: 19px;--checkbox-mask-size: 14px;&:before,&:after{inline-size:18px;block-size:18px}}}.dark a-checkbox{--checkbox-mask-size: 13px}.dark a-checkbox[size=small]{--checkbox-mask-size: 11px}.dark a-checkbox[size=large]{--checkbox-mask-size: 15px}a-checkbox-label,a-checkbox-hint{display:block;grid-column:2;min-width:0}a-checkbox-hint{color:var(--checkbox-hint-color);font-size:var(--checkbox-hint-fs);line-height:var(--checkbox-hint-lh);margin-block-start:2px}a-checkbox[tone]:not([tone=""],[tone=neutral]),a-checkbox[tone-selected]:not([tone-selected=""],[tone-selected=neutral]){--_tone-l-rest: .5;--_tone-l-hover: .45;--_tone-l-active: .4}a-checkbox[tone=brand]{--checkbox-tone-source: var(--anta-seed-brand);--checkbox-off-tone-source: var(--anta-seed-brand)}a-checkbox[tone=info]{--checkbox-tone-source: var(--anta-seed-info);--checkbox-off-tone-source: var(--anta-seed-info)}a-checkbox[tone=success]{--checkbox-tone-source: var(--anta-seed-success);--checkbox-off-tone-source: var(--anta-seed-success)}a-checkbox[tone=warning]{--checkbox-tone-source: var(--anta-seed-warning);--checkbox-off-tone-source: var(--anta-seed-warning)}a-checkbox[tone=critical]{--checkbox-tone-source: var(--anta-seed-critical);--checkbox-off-tone-source: var(--anta-seed-critical)}a-checkbox[tone=neutral]{--checkbox-tone-source: var(--anta-seed-neutral);--checkbox-off-tone-source: var(--anta-seed-neutral)}a-checkbox[tone]:not([tone=""],[tone=neutral]){--checkbox-bg: oklch(from var(--checkbox-off-tone-source) .99 calc(c*.03) h);--_checkbox-off-bg-selected: oklch(from var(--checkbox-off-tone-source) var(--_tone-l-rest) c h);--_checkbox-border-base: color-mix(in oklch, var(--_checkbox-off-bg-selected) 70%, var(--checkbox-border-neutral));--checkbox-border: oklch(from var(--_checkbox-border-base) calc(l + .17) c h);--checkbox-border-hover: oklch(from var(--_checkbox-border-base) calc(l + .1) c h);--checkbox-border-active: var(--_checkbox-border-base)}a-checkbox[tone]:not([tone=""],[tone=brand],[tone=neutral],[tone=info],[tone=success],[tone=warning],[tone=critical]){--checkbox-tone-source: attr(tone type(<color>), transparent);--checkbox-off-tone-source: attr(tone type(<color>), transparent)}a-checkbox[tone-selected=brand]{--checkbox-tone-source: var(--anta-seed-brand)}a-checkbox[tone-selected=info]{--checkbox-tone-source: var(--anta-seed-info)}a-checkbox[tone-selected=success]{--checkbox-tone-source: var(--anta-seed-success)}a-checkbox[tone-selected=warning]{--checkbox-tone-source: var(--anta-seed-warning)}a-checkbox[tone-selected=critical]{--checkbox-tone-source: var(--anta-seed-critical)}a-checkbox[tone-selected=neutral]{--checkbox-tone-source: var(--anta-seed-neutral);--_tone-l-rest: .6;--_tone-l-hover: .45;--_tone-l-active: .4}a-checkbox[tone-selected]:not([tone-selected=""],[tone-selected=brand],[tone-selected=neutral],[tone-selected=info],[tone-selected=success],[tone-selected=warning],[tone-selected=critical]){--checkbox-tone-source: attr(tone-selected type(<color>), transparent)}.dark a-checkbox{--checkbox-border-neutral: var(--border-3);--checkbox-border-hover: var(--border-2);--checkbox-border-active: var(--border-1);--checkbox-icon: #ece9ec;--checkbox-icon-disabled: #534c57;--checkbox-bg-disabled: color-mix(in oklch, #e4d1ef 10%, transparent);--checkbox-border-disabled: color-mix(in oklch, #e4d1ef 10%, transparent);--_tone-l-rest: .42;--_tone-l-hover: .45;--_tone-l-active: .5}.dark a-checkbox[tone]:not([tone=""],[tone=neutral]),.dark a-checkbox[tone-selected]:not([tone-selected=""],[tone-selected=neutral]){--_tone-l-rest: .45;--_tone-l-hover: .5;--_tone-l-active: .57}.dark a-checkbox[tone]:not([tone=""],[tone=neutral]){--checkbox-bg: oklch(from var(--checkbox-off-tone-source) .15 calc(c*.18) h);--checkbox-border: var(--_checkbox-border-base);--checkbox-border-hover: oklch(from var(--_checkbox-border-base) calc(l + .1) c h);--checkbox-border-active: oklch(from var(--_checkbox-border-base) calc(l + .17) c h)}.dark a-checkbox[tone-selected=neutral]{--_tone-l-rest: .42;--_tone-l-hover: .45;--_tone-l-active: .5}label:has(>input[data-anta][type=checkbox]){display:inline-flex;align-items:center;gap:8px;color:var(--text-2);font-family:var(--sans-serif);font-feature-settings:"ss02","ss05","tnum";font-size:15px;line-height:20px}input[data-anta][type=checkbox]{--native-choice-size: 16px;--native-choice-mark-size: 12px;--native-choice-round: 4px;--native-choice-bg: var(--bg-1);--native-choice-border-neutral: var(--border-3);--native-choice-border: var(--native-choice-border-neutral);--native-choice-border-hover: var(--border-2);--native-choice-border-active: var(--border-1);--native-choice-tone-source: var(--anta-seed-neutral);--native-choice-off-tone-source: var(--anta-seed-neutral);--_native-choice-l-rest: .6;--_native-choice-l-hover: .45;--_native-choice-l-active: .4;--native-choice-selected: oklch(from var(--native-choice-tone-source) var(--_native-choice-l-rest) c h);--native-choice-selected-hover: oklch(from var(--native-choice-tone-source) var(--_native-choice-l-hover) c h);--native-choice-selected-active: oklch(from var(--native-choice-tone-source) var(--_native-choice-l-active) c h);box-sizing:border-box;flex:0 0 var(--native-choice-size);inline-size:var(--native-choice-size);block-size:var(--native-choice-size);margin:0;appearance:none;-webkit-appearance:none;border:1.5px solid var(--native-choice-border);border-radius:var(--native-choice-round);background-color:var(--native-choice-bg);background-repeat:no-repeat;background-position:center;background-size:var(--native-choice-mark-size);cursor:pointer;vertical-align:middle;transition:background-color .15s ease-out,border-color .15s ease-out}label:has(>input[data-anta][type=checkbox][size=small]){gap:6px;font-size:13px;line-height:16px}label:has(>input[data-anta][type=checkbox][size=large]){font-size:17px;line-height:22px}input[data-anta][type=checkbox][size=small]{--native-choice-size: 14px;--native-choice-mark-size: 10px}input[data-anta][type=checkbox][size=large]{--native-choice-size: 18px;--native-choice-mark-size: 14px}input[data-anta][type=checkbox][round]{--native-choice-round: attr(round type(<length>), 999px)}input[data-anta][type=checkbox][tone]:not([tone=""],[tone=neutral]),input[data-anta][type=checkbox][tone-selected]:not([tone-selected=""],[tone-selected=neutral]){--_native-choice-l-rest: .5;--_native-choice-l-hover: .45;--_native-choice-l-active: .4}input[data-anta][type=checkbox][tone=brand]{--native-choice-tone-source: var(--anta-seed-brand);--native-choice-off-tone-source: var(--anta-seed-brand)}input[data-anta][type=checkbox][tone=info]{--native-choice-tone-source: var(--anta-seed-info);--native-choice-off-tone-source: var(--anta-seed-info)}input[data-anta][type=checkbox][tone=success]{--native-choice-tone-source: var(--anta-seed-success);--native-choice-off-tone-source: var(--anta-seed-success)}input[data-anta][type=checkbox][tone=warning]{--native-choice-tone-source: var(--anta-seed-warning);--native-choice-off-tone-source: var(--anta-seed-warning)}input[data-anta][type=checkbox][tone=critical]{--native-choice-tone-source: var(--anta-seed-critical);--native-choice-off-tone-source: var(--anta-seed-critical)}input[data-anta][type=checkbox][tone=neutral]{--native-choice-tone-source: var(--anta-seed-neutral);--native-choice-off-tone-source: var(--anta-seed-neutral)}input[data-anta][type=checkbox][tone]:not([tone=""],[tone=neutral]){--native-choice-bg: oklch(from var(--native-choice-off-tone-source) .99 calc(c*.03) h);--_native-choice-off-selected: oklch(from var(--native-choice-off-tone-source) var(--_native-choice-l-rest) c h);--_native-choice-border-base: color-mix(in oklch, var(--_native-choice-off-selected) 70%, var(--native-choice-border-neutral));--native-choice-border: oklch(from var(--_native-choice-border-base) calc(l + .17) c h);--native-choice-border-hover: oklch(from var(--_native-choice-border-base) calc(l + .1) c h);--native-choice-border-active: var(--_native-choice-border-base)}input[data-anta][type=checkbox][tone]:not([tone=""],[tone=brand],[tone=neutral],[tone=info],[tone=success],[tone=warning],[tone=critical]){--native-choice-tone-source: attr(tone type(<color>), var(--anta-seed-neutral));--native-choice-off-tone-source: attr(tone type(<color>), var(--anta-seed-neutral))}input[data-anta][type=checkbox][tone-selected=brand]{--native-choice-tone-source: var(--anta-seed-brand)}input[data-anta][type=checkbox][tone-selected=info]{--native-choice-tone-source: var(--anta-seed-info)}input[data-anta][type=checkbox][tone-selected=success]{--native-choice-tone-source: var(--anta-seed-success)}input[data-anta][type=checkbox][tone-selected=warning]{--native-choice-tone-source: var(--anta-seed-warning)}input[data-anta][type=checkbox][tone-selected=critical]{--native-choice-tone-source: var(--anta-seed-critical)}input[data-anta][type=checkbox][tone-selected=neutral]{--native-choice-tone-source: var(--anta-seed-neutral);--_native-choice-l-rest: .6;--_native-choice-l-hover: .45;--_native-choice-l-active: .4}input[data-anta][type=checkbox][tone-selected]:not([tone-selected=""],[tone-selected=brand],[tone-selected=neutral],[tone-selected=info],[tone-selected=success],[tone-selected=warning],[tone-selected=critical]){--native-choice-tone-source: attr(tone-selected type(<color>), var(--anta-seed-neutral))}@media(hover:hover)and (pointer:fine){input[data-anta][type=checkbox]:not(:disabled):hover{border-color:var(--native-choice-border-hover)}input[data-anta][type=checkbox]:not(:disabled):hover:is(:checked,:indeterminate){background-color:var(--native-choice-selected-hover);border-color:var(--native-choice-selected-hover)}}input[data-anta][type=checkbox]:not(:disabled):active{border-color:var(--native-choice-border-active)}input[data-anta][type=checkbox]:not(:disabled):active:is(:checked,:indeterminate){background-color:var(--native-choice-selected-active);border-color:var(--native-choice-selected-active)}input[data-anta][type=checkbox]:is(:checked,:indeterminate){background-color:var(--native-choice-selected);border-color:var(--native-choice-selected)}input[data-anta][type=checkbox]:checked{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23f6f4f6' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E")}input[data-anta][type=checkbox]:indeterminate{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23f6f4f6' stroke-width='3' stroke-linecap='round'%3E%3Cpath d='M5 12h14'/%3E%3C/svg%3E")}input[data-anta][type=checkbox]:focus-visible{outline:1px solid var(--focus-ring);outline-offset:1px}input[data-anta][type=checkbox]:disabled{border-color:color-mix(in oklch,var(--text-1) 10%,transparent);background-color:color-mix(in oklch,var(--text-1) 10%,transparent);cursor:not-allowed}input[data-anta][type=checkbox]:disabled:is(:checked,:indeterminate){background-color:color-mix(in oklch,var(--text-1) 10%,transparent)}.dark input[data-anta][type=checkbox]{--_native-choice-l-rest: .42;--_native-choice-l-hover: .45;--_native-choice-l-active: .5}.dark input[data-anta][type=checkbox][tone]:not([tone=""],[tone=neutral]),.dark input[data-anta][type=checkbox][tone-selected]:not([tone-selected=""],[tone-selected=neutral]){--_native-choice-l-rest: .45;--_native-choice-l-hover: .5;--_native-choice-l-active: .57}.dark input[data-anta][type=checkbox][tone]:not([tone=""],[tone=neutral]){--native-choice-bg: oklch(from var(--native-choice-off-tone-source) .15 calc(c*.18) h);--native-choice-border: var(--_native-choice-border-base);--native-choice-border-hover: oklch(from var(--_native-choice-border-base) calc(l + .1) c h);--native-choice-border-active: oklch(from var(--_native-choice-border-base) calc(l + .17) c h)}.dark input[data-anta][type=checkbox][tone-selected=neutral]{--_native-choice-l-rest: .42;--_native-choice-l-hover: .45;--_native-choice-l-active: .5}@media(forced-colors:active){a-checkbox:is(:state(checked),:state(indeterminate)):before{forced-color-adjust:none;background-color:Highlight;border-color:Highlight}a-checkbox:is(:state(checked),:state(indeterminate)):after{forced-color-adjust:none;background-color:HighlightText}a-checkbox:disabled:before{background-color:Canvas;border-color:GrayText}a-checkbox:disabled:is(:state(checked),:state(indeterminate)):after{background-color:GrayText}}}
+@layer anta.components{a-checkbox{--checkbox-gap: 8px;--checkbox-box-size: 16px;--checkbox-bg: var(--bg-1);--checkbox-tone-source: var(--anta-seed-neutral);--checkbox-off-tone-source: var(--anta-seed-neutral);--_tone-l-rest: .6;--_tone-l-hover: .45;--_tone-l-active: .4;--checkbox-bg-selected: oklch(from var(--checkbox-tone-source) var(--_tone-l-rest) c h);--checkbox-bg-selected-hover: oklch(from var(--checkbox-tone-source) var(--_tone-l-hover) c h);--checkbox-bg-selected-active: oklch(from var(--checkbox-tone-source) var(--_tone-l-active) c h);--checkbox-border-neutral: var(--border-3);--checkbox-border: var(--checkbox-border-neutral);--checkbox-border-hover: var(--border-2);--checkbox-border-active: var(--border-1);--checkbox-icon: #f6f4f6;--checkbox-icon-disabled: #c1b9c1;--checkbox-bg-disabled: color-mix(in oklch, #44374b 10%, transparent);--checkbox-border-disabled: color-mix(in oklch, #44374b 10%, transparent);--checkbox-mask-size: 12px;--checkbox-mask-check: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");--checkbox-mask-indeterminate: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3C/svg%3E");--checkbox-label-color: var(--text-2);--checkbox-label-color-disabled: var(--text-4);--checkbox-hint-color: var(--text-3);--checkbox-label-fs: 15px;--checkbox-label-lh: 20px;--checkbox-hint-fs: 13px;--checkbox-hint-lh: 16px;display:inline-grid;grid-template-columns:auto 1fr;align-items:start;column-gap:var(--checkbox-gap);vertical-align:middle;cursor:pointer;user-select:none;-webkit-user-drag:none;outline:none;color:var(--checkbox-label-color);font-family:var(--sans-serif);font-size:var(--checkbox-label-fs);line-height:var(--checkbox-label-lh);font-feature-settings:"ss02","ss05","tnum";&:before{content:"";grid-column:1;grid-row:1 / -1;align-self:start;margin-block-start:calc((var(--checkbox-label-lh) - var(--checkbox-box-size)) / 2);box-sizing:border-box;inline-size:16px;block-size:16px;border-radius:4px;background:var(--checkbox-bg);border:1.5px solid var(--checkbox-border);transition:background-color .15s ease-out,border-color .15s ease-out}&[round]{--checkbox-round: attr(round type(<length>), 999px)}&[round]:before{border-radius:var(--checkbox-round, 999px)}&:after{content:"";grid-column:1;grid-row:1 / -1;align-self:start;margin-block-start:calc((var(--checkbox-label-lh) - var(--checkbox-box-size)) / 2);inline-size:16px;block-size:16px;background-color:transparent;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;-webkit-mask-size:var(--checkbox-mask-size);mask-size:var(--checkbox-mask-size)}@media(hover:hover)and (pointer:fine){&:not(:disabled):hover:before{border-color:var(--checkbox-border-hover);transition:background-color 75ms ease-in,border-color 75ms ease-in}&:not(:disabled):hover:is(:state(checked),:state(indeterminate)):before{background:var(--checkbox-bg-selected-hover);border-color:var(--checkbox-bg-selected-hover)}}&:not(:disabled):active:before{border-color:var(--checkbox-border-active);transition:background-color 50ms linear,border-color 50ms linear}&:not(:disabled):active:is(:state(checked),:state(indeterminate)):before{background:var(--checkbox-bg-selected-active);border-color:var(--checkbox-bg-selected-active)}&:is(:state(checked),:state(indeterminate)){&:before{background:var(--checkbox-bg-selected);border-color:var(--checkbox-bg-selected)}&:after{background-color:var(--checkbox-icon)}}&:state(checked):after{-webkit-mask-image:var(--checkbox-mask-check);mask-image:var(--checkbox-mask-check)}&:state(indeterminate):after{-webkit-mask-image:var(--checkbox-mask-indeterminate);mask-image:var(--checkbox-mask-indeterminate)}&:focus-visible{outline:none}&:focus-visible:before{outline:1px solid var(--focus-ring);outline-offset:1px}&:disabled{cursor:not-allowed;color:var(--checkbox-label-color-disabled);&:before{background:var(--checkbox-bg-disabled);border-color:var(--checkbox-border-disabled);transition:none}&:is(:state(checked),:state(indeterminate)):after{background-color:var(--checkbox-icon-disabled)}a-checkbox-hint{color:var(--checkbox-label-color-disabled)}}&[size=small]{--checkbox-gap: 6px;--checkbox-box-size: 14px;--checkbox-label-fs: 13px;--checkbox-label-lh: 16px;--checkbox-hint-fs: 12px;--checkbox-hint-lh: 14px;--checkbox-mask-size: 10px;&:before,&:after{inline-size:14px;block-size:14px}}&[size=large]{--checkbox-box-size: 18px;--checkbox-label-fs: 17px;--checkbox-label-lh: 22px;--checkbox-hint-fs: 15px;--checkbox-hint-lh: 19px;--checkbox-mask-size: 14px;&:before,&:after{inline-size:18px;block-size:18px}}}.dark a-checkbox{--checkbox-mask-size: 13px}.dark a-checkbox[size=small]{--checkbox-mask-size: 11px}.dark a-checkbox[size=large]{--checkbox-mask-size: 15px}a-checkbox-label,a-checkbox-hint{display:block;grid-column:2;min-width:0}a-checkbox-hint{color:var(--checkbox-hint-color);font-size:var(--checkbox-hint-fs);line-height:var(--checkbox-hint-lh);margin-block-start:2px}a-checkbox[tone]:not([tone=""],[tone=neutral]),a-checkbox[tone-selected]:not([tone-selected=""],[tone-selected=neutral]){--_tone-l-rest: .5;--_tone-l-hover: .45;--_tone-l-active: .4}a-checkbox[tone=brand]{--checkbox-tone-source: var(--anta-seed-brand);--checkbox-off-tone-source: var(--anta-seed-brand)}a-checkbox[tone=info]{--checkbox-tone-source: var(--anta-seed-info);--checkbox-off-tone-source: var(--anta-seed-info)}a-checkbox[tone=success]{--checkbox-tone-source: var(--anta-seed-success);--checkbox-off-tone-source: var(--anta-seed-success)}a-checkbox[tone=warning]{--checkbox-tone-source: var(--anta-seed-warning);--checkbox-off-tone-source: var(--anta-seed-warning)}a-checkbox[tone=critical]{--checkbox-tone-source: var(--anta-seed-critical);--checkbox-off-tone-source: var(--anta-seed-critical)}a-checkbox[tone=neutral]{--checkbox-tone-source: var(--anta-seed-neutral);--checkbox-off-tone-source: var(--anta-seed-neutral)}a-checkbox[tone]:not([tone=""],[tone=neutral]){--checkbox-bg: oklch(from var(--checkbox-off-tone-source) .99 calc(c*.03) h);--_checkbox-off-bg-selected: oklch(from var(--checkbox-off-tone-source) var(--_tone-l-rest) c h);--_checkbox-border-base: color-mix(in oklch, var(--_checkbox-off-bg-selected) 70%, var(--checkbox-border-neutral));--checkbox-border: oklch(from var(--_checkbox-border-base) calc(l + .17) c h);--checkbox-border-hover: oklch(from var(--_checkbox-border-base) calc(l + .1) c h);--checkbox-border-active: var(--_checkbox-border-base)}a-checkbox[tone]:not([tone=""],[tone=brand],[tone=neutral],[tone=info],[tone=success],[tone=warning],[tone=critical]){--checkbox-tone-source: attr(tone type(<color>), transparent);--checkbox-off-tone-source: attr(tone type(<color>), transparent)}a-checkbox[tone-selected=brand]{--checkbox-tone-source: var(--anta-seed-brand)}a-checkbox[tone-selected=info]{--checkbox-tone-source: var(--anta-seed-info)}a-checkbox[tone-selected=success]{--checkbox-tone-source: var(--anta-seed-success)}a-checkbox[tone-selected=warning]{--checkbox-tone-source: var(--anta-seed-warning)}a-checkbox[tone-selected=critical]{--checkbox-tone-source: var(--anta-seed-critical)}a-checkbox[tone-selected=neutral]{--checkbox-tone-source: var(--anta-seed-neutral);--_tone-l-rest: .6;--_tone-l-hover: .45;--_tone-l-active: .4}a-checkbox[tone-selected]:not([tone-selected=""],[tone-selected=brand],[tone-selected=neutral],[tone-selected=info],[tone-selected=success],[tone-selected=warning],[tone-selected=critical]){--checkbox-tone-source: attr(tone-selected type(<color>), transparent)}.dark a-checkbox{--checkbox-border-neutral: var(--border-3);--checkbox-border-hover: var(--border-2);--checkbox-border-active: var(--border-1);--checkbox-icon: #ece9ec;--checkbox-icon-disabled: #534c57;--checkbox-bg-disabled: color-mix(in oklch, #e4d1ef 10%, transparent);--checkbox-border-disabled: color-mix(in oklch, #e4d1ef 10%, transparent);--_tone-l-rest: .42;--_tone-l-hover: .45;--_tone-l-active: .5}.dark a-checkbox[tone]:not([tone=""],[tone=neutral]),.dark a-checkbox[tone-selected]:not([tone-selected=""],[tone-selected=neutral]){--_tone-l-rest: .45;--_tone-l-hover: .5;--_tone-l-active: .57}.dark a-checkbox[tone]:not([tone=""],[tone=neutral]){--checkbox-bg: oklch(from var(--checkbox-off-tone-source) .15 calc(c*.18) h);--checkbox-border: var(--_checkbox-border-base);--checkbox-border-hover: oklch(from var(--_checkbox-border-base) calc(l + .1) c h);--checkbox-border-active: oklch(from var(--_checkbox-border-base) calc(l + .17) c h)}.dark a-checkbox[tone-selected=neutral]{--_tone-l-rest: .42;--_tone-l-hover: .45;--_tone-l-active: .5}label:has(>input[data-anta][type=checkbox]){display:inline-flex;align-items:center;gap:8px;color:var(--text-2);font-family:var(--sans-serif);font-feature-settings:"ss02","ss05","tnum";font-size:15px;line-height:20px}input[data-anta][type=checkbox]{--checkbox-box-size: 16px;--checkbox-mask-size: 12px;--checkbox-round: 4px;--checkbox-bg: var(--bg-1);--checkbox-border-neutral: var(--border-3);--checkbox-border: var(--checkbox-border-neutral);--checkbox-border-hover: var(--border-2);--checkbox-border-active: var(--border-1);--checkbox-tone-source: var(--anta-seed-neutral);--checkbox-off-tone-source: var(--anta-seed-neutral);--_tone-l-rest: .6;--_tone-l-hover: .45;--_tone-l-active: .4;--checkbox-bg-selected: oklch(from var(--checkbox-tone-source) var(--_tone-l-rest) c h);--checkbox-bg-selected-hover: oklch(from var(--checkbox-tone-source) var(--_tone-l-hover) c h);--checkbox-bg-selected-active: oklch(from var(--checkbox-tone-source) var(--_tone-l-active) c h);box-sizing:border-box;flex:0 0 var(--checkbox-box-size);inline-size:var(--checkbox-box-size);block-size:var(--checkbox-box-size);margin:0;appearance:none;-webkit-appearance:none;border:1.5px solid var(--checkbox-border);border-radius:var(--checkbox-round);background-color:var(--checkbox-bg);background-repeat:no-repeat;background-position:center;background-size:var(--checkbox-mask-size);cursor:pointer;vertical-align:middle;transition:background-color .15s ease-out,border-color .15s ease-out}label:has(>input[data-anta][type=checkbox][size=small]){gap:6px;font-size:13px;line-height:16px}label:has(>input[data-anta][type=checkbox][size=large]){font-size:17px;line-height:22px}input[data-anta][type=checkbox][size=small]{--checkbox-box-size: 14px;--checkbox-mask-size: 10px}input[data-anta][type=checkbox][size=large]{--checkbox-box-size: 18px;--checkbox-mask-size: 14px}input[data-anta][type=checkbox][round]{--checkbox-round: attr(round type(<length>), 999px)}input[data-anta][type=checkbox][tone]:not([tone=""],[tone=neutral]),input[data-anta][type=checkbox][tone-selected]:not([tone-selected=""],[tone-selected=neutral]){--_tone-l-rest: .5;--_tone-l-hover: .45;--_tone-l-active: .4}input[data-anta][type=checkbox][tone=brand]{--checkbox-tone-source: var(--anta-seed-brand);--checkbox-off-tone-source: var(--anta-seed-brand)}input[data-anta][type=checkbox][tone=info]{--checkbox-tone-source: var(--anta-seed-info);--checkbox-off-tone-source: var(--anta-seed-info)}input[data-anta][type=checkbox][tone=success]{--checkbox-tone-source: var(--anta-seed-success);--checkbox-off-tone-source: var(--anta-seed-success)}input[data-anta][type=checkbox][tone=warning]{--checkbox-tone-source: var(--anta-seed-warning);--checkbox-off-tone-source: var(--anta-seed-warning)}input[data-anta][type=checkbox][tone=critical]{--checkbox-tone-source: var(--anta-seed-critical);--checkbox-off-tone-source: var(--anta-seed-critical)}input[data-anta][type=checkbox][tone=neutral]{--checkbox-tone-source: var(--anta-seed-neutral);--checkbox-off-tone-source: var(--anta-seed-neutral)}input[data-anta][type=checkbox][tone]:not([tone=""],[tone=neutral]){--checkbox-bg: oklch(from var(--checkbox-off-tone-source) .99 calc(c*.03) h);--_checkbox-off-bg-selected: oklch(from var(--checkbox-off-tone-source) var(--_tone-l-rest) c h);--_checkbox-border-base: color-mix(in oklch, var(--_checkbox-off-bg-selected) 70%, var(--checkbox-border-neutral));--checkbox-border: oklch(from var(--_checkbox-border-base) calc(l + .17) c h);--checkbox-border-hover: oklch(from var(--_checkbox-border-base) calc(l + .1) c h);--checkbox-border-active: var(--_checkbox-border-base)}input[data-anta][type=checkbox][tone]:not([tone=""],[tone=brand],[tone=neutral],[tone=info],[tone=success],[tone=warning],[tone=critical]){--checkbox-tone-source: attr(tone type(<color>), var(--anta-seed-neutral));--checkbox-off-tone-source: attr(tone type(<color>), var(--anta-seed-neutral))}input[data-anta][type=checkbox][tone-selected=brand]{--checkbox-tone-source: var(--anta-seed-brand)}input[data-anta][type=checkbox][tone-selected=info]{--checkbox-tone-source: var(--anta-seed-info)}input[data-anta][type=checkbox][tone-selected=success]{--checkbox-tone-source: var(--anta-seed-success)}input[data-anta][type=checkbox][tone-selected=warning]{--checkbox-tone-source: var(--anta-seed-warning)}input[data-anta][type=checkbox][tone-selected=critical]{--checkbox-tone-source: var(--anta-seed-critical)}input[data-anta][type=checkbox][tone-selected=neutral]{--checkbox-tone-source: var(--anta-seed-neutral);--_tone-l-rest: .6;--_tone-l-hover: .45;--_tone-l-active: .4}input[data-anta][type=checkbox][tone-selected]:not([tone-selected=""],[tone-selected=brand],[tone-selected=neutral],[tone-selected=info],[tone-selected=success],[tone-selected=warning],[tone-selected=critical]){--checkbox-tone-source: attr(tone-selected type(<color>), var(--anta-seed-neutral))}@media(hover:hover)and (pointer:fine){input[data-anta][type=checkbox]:not(:disabled):hover{border-color:var(--checkbox-border-hover)}input[data-anta][type=checkbox]:not(:disabled):hover:is(:checked,:indeterminate){background-color:var(--checkbox-bg-selected-hover);border-color:var(--checkbox-bg-selected-hover)}}input[data-anta][type=checkbox]:not(:disabled):active{border-color:var(--checkbox-border-active)}input[data-anta][type=checkbox]:not(:disabled):active:is(:checked,:indeterminate){background-color:var(--checkbox-bg-selected-active);border-color:var(--checkbox-bg-selected-active)}input[data-anta][type=checkbox]:is(:checked,:indeterminate){background-color:var(--checkbox-bg-selected);border-color:var(--checkbox-bg-selected)}input[data-anta][type=checkbox]:checked{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23f6f4f6' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E")}input[data-anta][type=checkbox]:indeterminate{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23f6f4f6' stroke-width='3' stroke-linecap='round'%3E%3Cpath d='M5 12h14'/%3E%3C/svg%3E")}input[data-anta][type=checkbox]:focus-visible{outline:1px solid var(--focus-ring);outline-offset:1px}input[data-anta][type=checkbox]:disabled{border-color:color-mix(in oklch,var(--text-1) 10%,transparent);background-color:color-mix(in oklch,var(--text-1) 10%,transparent);cursor:not-allowed}input[data-anta][type=checkbox]:disabled:is(:checked,:indeterminate){background-color:color-mix(in oklch,var(--text-1) 10%,transparent)}.dark input[data-anta][type=checkbox]{--_tone-l-rest: .42;--_tone-l-hover: .45;--_tone-l-active: .5}.dark input[data-anta][type=checkbox][tone]:not([tone=""],[tone=neutral]),.dark input[data-anta][type=checkbox][tone-selected]:not([tone-selected=""],[tone-selected=neutral]){--_tone-l-rest: .45;--_tone-l-hover: .5;--_tone-l-active: .57}.dark input[data-anta][type=checkbox][tone]:not([tone=""],[tone=neutral]){--checkbox-bg: oklch(from var(--checkbox-off-tone-source) .15 calc(c*.18) h);--checkbox-border: var(--_checkbox-border-base);--checkbox-border-hover: oklch(from var(--_checkbox-border-base) calc(l + .1) c h);--checkbox-border-active: oklch(from var(--_checkbox-border-base) calc(l + .17) c h)}.dark input[data-anta][type=checkbox][tone-selected=neutral]{--_tone-l-rest: .42;--_tone-l-hover: .45;--_tone-l-active: .5}@media(forced-colors:active){a-checkbox:is(:state(checked),:state(indeterminate)):before{forced-color-adjust:none;background-color:Highlight;border-color:Highlight}a-checkbox:is(:state(checked),:state(indeterminate)):after{forced-color-adjust:none;background-color:HighlightText}a-checkbox:disabled:before{background-color:Canvas;border-color:GrayText}a-checkbox:disabled:is(:state(checked),:state(indeterminate)):after{background-color:GrayText}}}

package/dist/elements/a-copy.css

@@ -1 +1 @@
-@layer anta{a-copy,a-copy:not(:defined){display:contents}}
+@layer anta.components{a-copy,a-copy:not(:defined){display:contents}}

package/dist/elements/a-dialog.css

@@ -1 +1 @@
-@layer anta{a-dialog{--dialog-bg: var(--bg-1);--dialog-text: var(--text-2);--dialog-border: color-mix(in oklch, black 9%, transparent);--dialog-radius: 10px;--dialog-shadow: inset 0 0 0 1px var(--dialog-border), 0 1px 3px color-mix(in oklch, black 10%, transparent), 0 12px 32px color-mix(in oklch, black 22%, transparent), 0 28px 64px color-mix(in oklch, black 14%, transparent);--dialog-overlay: color-mix(in oklch, black 42%, transparent);display:contents}a-dialog[round]{--dialog-round: attr(round type(<length>), var(--dialog-radius, 10px))}a-dialog:not(:defined){display:none}.dark a-dialog{--dialog-border: color-mix(in oklch, white 14%, transparent);--dialog-shadow: inset 0 0 0 1px var(--dialog-border), 0 1px 3px color-mix(in oklch, black 40%, transparent), 0 12px 32px color-mix(in oklch, black 55%, transparent), 0 28px 64px color-mix(in oklch, black 40%, transparent);--dialog-overlay: color-mix(in oklch, black 62%, transparent)}@media(forced-colors:active){a-dialog{--dialog-outline: 1px solid CanvasText;--dialog-shadow: none}}}a-dialog>p:last-child,a-dialog>:not([slot])>p:last-child{margin-block-end:0}
+@layer anta.components{a-dialog{--dialog-bg: var(--bg-1);--dialog-text: var(--text-2);--dialog-border: color-mix(in oklch, black 9%, transparent);--dialog-radius: 10px;--dialog-shadow: inset 0 0 0 1px var(--dialog-border), 0 1px 3px color-mix(in oklch, black 10%, transparent), 0 12px 32px color-mix(in oklch, black 22%, transparent), 0 28px 64px color-mix(in oklch, black 14%, transparent);--dialog-overlay: color-mix(in oklch, black 42%, transparent);display:contents}a-dialog[round]{--dialog-round: attr(round type(<length>), var(--dialog-radius, 10px))}a-dialog:not(:defined){display:none}.dark a-dialog{--dialog-border: color-mix(in oklch, white 14%, transparent);--dialog-shadow: inset 0 0 0 1px var(--dialog-border), 0 1px 3px color-mix(in oklch, black 40%, transparent), 0 12px 32px color-mix(in oklch, black 55%, transparent), 0 28px 64px color-mix(in oklch, black 40%, transparent);--dialog-overlay: color-mix(in oklch, black 62%, transparent)}@media(forced-colors:active){a-dialog{--dialog-outline: 1px solid CanvasText;--dialog-shadow: none}}}a-dialog>p:last-child,a-dialog>:not([slot])>p:last-child{margin-block-end:0}