@antadesign/anta 0.3.19 → 0.3.21

package/dist/elements/a-expander.css

@@ -1 +1 @@
-@layer anta{a-expander,details[data-anta]{--_expander-chevron: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24'%3e%3cpath stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m9 18 6-6-6-6'/%3e%3c/svg%3e")}a-expander{--expander-text: var(--text-2);--expander-text-hover: var(--text-1);--expander-bg-secondary: var(--bg-2);--expander-border-secondary: var(--border-5);--expander-bg-primary: var(--bg-4);--expander-border-primary: var(--border-4);--expander-bg: var(--expander-bg-secondary);--expander-border: var(--expander-border-secondary);--expander-bg-hover-lift: .01;--expander-bg-hover: oklch(from var(--expander-bg) calc(l + var(--expander-bg-hover-lift)) c h);--expander-gutter: 24px;display:block;width:100%;box-sizing:border-box;border:1px solid var(--expander-border);border-radius:4px;color:var(--expander-text);background:var(--expander-bg);transition:background-color .1s ease}a-expander[round]{--expander-round: attr(round type(<length>));border-radius:var(--expander-round, var(--_expander-round-radius, 999px))}a-expander>span[slot=actions]{display:contents}a-expander:not(:defined) a-expander-details{display:none}a-expander:not(:defined)[state=open] a-expander-details,a-expander:not(:defined)[default-state=open] a-expander-details{display:block}a-expander:not(:defined) a-expander-summary{position:relative;padding:6px 4px 6px var(--expander-gutter)}a-expander:not(:defined) a-expander-summary:before{content:"";position:absolute;left:calc(var(--expander-gutter) - 16px - 2px);top:50%;width:16px;height:16px;transform:translateY(-50%);background-color:currentColor;-webkit-mask:var(--_expander-chevron) center / contain no-repeat;mask:var(--_expander-chevron) center / contain no-repeat;opacity:.6}a-expander:not(:defined){display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center}a-expander:not(:defined) a-expander-summary{grid-column:1}a-expander:not(:defined)>[slot=actions]{grid-column:2;display:flex;align-items:center;gap:2px;flex-shrink:0;margin-inline-start:8px;margin-inline-end:4px}a-expander:not(:defined) a-expander-details{grid-column:1 / -1}a-expander-summary{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:15px;line-height:20px;font-weight:584.62;letter-spacing:0;text-decoration-line:var(--_summary-underline, none);text-decoration-style:dotted;text-decoration-color:color-mix(in oklch,currentColor 75%,transparent);text-decoration-thickness:1px;text-underline-offset:3px;transition:color .15s ease}a-expander[level="1"] a-expander-summary{font-size:28px;line-height:32px}a-expander[level="2"] a-expander-summary{font-size:24px;line-height:28px}a-expander[level="3"] a-expander-summary{font-size:20px;line-height:24px}a-expander[level="4"] a-expander-summary{font-size:17px;line-height:20px}a-expander[level="6"] a-expander-summary{font-size:13px;line-height:16px}a-expander-details{display:block;padding:2px 4px 6px var(--expander-gutter);line-height:20px;overflow:auto}a-expander[priority=tertiary][outdent] a-expander-details{padding-inline-start:4px;margin-inline-start:-4px}a-expander[priority=primary]{--expander-bg: var(--expander-bg-primary);--expander-border: var(--expander-border-primary)}a-expander[priority=tertiary]{--expander-bg: transparent;--expander-border: transparent}a-expander:not([disabled]):not(:state(open)):hover{background:var(--expander-bg-hover)}a-expander:not([disabled]):not(:state(open)):active{background:var(--expander-bg)}a-expander[priority=tertiary][outdent]{--expander-gutter: 0px}a-expander[tone=brand]{--expander-text: var(--text-2-brand);--expander-text-hover: var(--text-1-brand);--expander-bg-secondary: var(--bg-2-brand);--expander-border-secondary: var(--border-5-brand);--expander-bg-primary: var(--bg-4-brand);--expander-border-primary: var(--border-4-brand)}a-expander[tone=info]{--expander-text: var(--text-2-info);--expander-text-hover: var(--text-1-info);--expander-bg-secondary: var(--bg-2-info);--expander-border-secondary: var(--border-5-info);--expander-bg-primary: var(--bg-4-info);--expander-border-primary: var(--border-4-info)}a-expander[tone=success]{--expander-text: var(--text-2-success);--expander-text-hover: var(--text-1-success);--expander-bg-secondary: var(--bg-2-success);--expander-border-secondary: var(--border-5-success);--expander-bg-primary: var(--bg-4-success);--expander-border-primary: var(--border-4-success)}a-expander[tone=warning]{--expander-text: var(--text-2-warning);--expander-text-hover: var(--text-1-warning);--expander-bg-secondary: var(--bg-2-warning);--expander-border-secondary: var(--border-5-warning);--expander-bg-primary: var(--bg-4-warning);--expander-border-primary: var(--border-4-warning)}a-expander[tone=critical]{--expander-text: var(--text-2-critical);--expander-text-hover: var(--text-1-critical);--expander-bg-secondary: var(--bg-2-critical);--expander-border-secondary: var(--border-5-critical);--expander-bg-primary: var(--bg-4-critical);--expander-border-primary: var(--border-4-critical)}a-expander[tone]:not([tone=neutral],[tone=brand],[tone=info],[tone=success],[tone=warning],[tone=critical]){--expander-tone-source: attr(tone type(<color>), currentColor);--expander-text: oklch(from var(--expander-tone-source) .5 .125 h);--expander-text-hover: oklch(from var(--expander-tone-source) .4 .11 h);--expander-bg-secondary: oklch(from var(--expander-tone-source) .99 .004 h);--expander-border-secondary: oklch(from var(--expander-tone-source) .935 .028 h);--expander-bg-primary: oklch(from var(--expander-tone-source) .955 .02 h);--expander-border-primary: oklch(from var(--expander-tone-source) .9 .04 h)}.dark a-expander[tone]:not([tone=neutral],[tone=brand],[tone=info],[tone=success],[tone=warning],[tone=critical]){--expander-text: oklch(from var(--expander-tone-source) .77 .11 h);--expander-text-hover: oklch(from var(--expander-tone-source) .85 .1 h);--expander-bg-secondary: oklch(from var(--expander-tone-source) .13 .02 h);--expander-border-secondary: oklch(from var(--expander-tone-source) .21 .045 h);--expander-bg-primary: oklch(from var(--expander-tone-source) .185 .05 h);--expander-border-primary: oklch(from var(--expander-tone-source) .26 .06 h)}a-expander[disabled],a-expander[disabled][tone]{--expander-text: #afa9b1}.dark a-expander[disabled],.dark a-expander[disabled][tone]{--expander-text: #635b65}details[data-anta]{--native-expander-gutter: 24px;--native-expander-summary-padding-block: 6px;--native-expander-summary-font-size: 15px;--native-expander-summary-line-height: 20px;--native-expander-chevron-size: 16px;--native-expander-text: var(--text-2);--native-expander-text-hover: var(--text-1);--native-expander-bg-secondary: var(--bg-2);--native-expander-border-secondary: var(--border-5);--native-expander-bg-primary: var(--bg-4);--native-expander-border-primary: var(--border-4);--native-expander-round-size: 16px;--native-expander-round: 4px;--native-expander-bg: transparent;--native-expander-border: transparent;display:block;inline-size:100%;box-sizing:border-box;border:0 solid var(--native-expander-border);border-radius:var(--native-expander-round);color:var(--native-expander-text);background:var(--native-expander-bg);font-family:var(--sans-serif);font-size:15px;font-feature-settings:"ss02","ss05","tnum";line-height:var(--native-expander-summary-line-height);transition:background-color .1s ease}details[data-anta][priority=secondary]{--native-expander-bg: var(--native-expander-bg-secondary);--native-expander-border: var(--native-expander-border-secondary);border-width:1px}details[data-anta][priority=primary]{--native-expander-bg: var(--native-expander-bg-primary);--native-expander-border: var(--native-expander-border-primary);border-width:1px}details[data-anta][level="1"]{--native-expander-summary-font-size: 28px;--native-expander-summary-line-height: 32px;--native-expander-round-size: 22px}details[data-anta][level="2"]{--native-expander-summary-font-size: 24px;--native-expander-summary-line-height: 28px;--native-expander-round-size: 20px}details[data-anta][level="3"]{--native-expander-summary-font-size: 20px;--native-expander-summary-line-height: 24px;--native-expander-round-size: 18px}details[data-anta][level="4"]{--native-expander-summary-font-size: 17px;--native-expander-summary-line-height: 20px}details[data-anta][level="6"]{--native-expander-summary-font-size: 13px;--native-expander-summary-line-height: 16px;--native-expander-round-size: 14px}details[data-anta][round]{--native-expander-round: var(--native-expander-round-size)}details[data-anta][round]:not([round=""]){--native-expander-round: attr(round type(<length>), var(--native-expander-round-size))}details[data-anta][priority=tertiary][outdent]{--native-expander-gutter: 0px}details[data-anta][tone=brand]{--native-expander-text: var(--text-2-brand);--native-expander-text-hover: var(--text-1-brand);--native-expander-bg-secondary: var(--bg-2-brand);--native-expander-border-secondary: var(--border-5-brand);--native-expander-bg-primary: var(--bg-4-brand);--native-expander-border-primary: var(--border-4-brand)}details[data-anta][tone=info]{--native-expander-text: var(--text-2-info);--native-expander-text-hover: var(--text-1-info);--native-expander-bg-secondary: var(--bg-2-info);--native-expander-border-secondary: var(--border-5-info);--native-expander-bg-primary: var(--bg-4-info);--native-expander-border-primary: var(--border-4-info)}details[data-anta][tone=success]{--native-expander-text: var(--text-2-success);--native-expander-text-hover: var(--text-1-success);--native-expander-bg-secondary: var(--bg-2-success);--native-expander-border-secondary: var(--border-5-success);--native-expander-bg-primary: var(--bg-4-success);--native-expander-border-primary: var(--border-4-success)}details[data-anta][tone=warning]{--native-expander-text: var(--text-2-warning);--native-expander-text-hover: var(--text-1-warning);--native-expander-bg-secondary: var(--bg-2-warning);--native-expander-border-secondary: var(--border-5-warning);--native-expander-bg-primary: var(--bg-4-warning);--native-expander-border-primary: var(--border-4-warning)}details[data-anta][tone=critical]{--native-expander-text: var(--text-2-critical);--native-expander-text-hover: var(--text-1-critical);--native-expander-bg-secondary: var(--bg-2-critical);--native-expander-border-secondary: var(--border-5-critical);--native-expander-bg-primary: var(--bg-4-critical);--native-expander-border-primary: var(--border-4-critical)}details[data-anta][tone]:not([tone=""],[tone=neutral],[tone=brand],[tone=info],[tone=success],[tone=warning],[tone=critical]){--native-expander-tone-source: attr(tone type(<color>), currentColor);--native-expander-text: oklch(from var(--native-expander-tone-source) .5 .125 h);--native-expander-text-hover: oklch(from var(--native-expander-tone-source) .4 .11 h);--native-expander-bg-secondary: oklch(from var(--native-expander-tone-source) .99 .004 h);--native-expander-border-secondary: oklch(from var(--native-expander-tone-source) .935 .028 h);--native-expander-bg-primary: oklch(from var(--native-expander-tone-source) .955 .02 h);--native-expander-border-primary: oklch(from var(--native-expander-tone-source) .9 .04 h)}.dark details[data-anta][tone]:not([tone=""],[tone=neutral],[tone=brand],[tone=info],[tone=success],[tone=warning],[tone=critical]){--native-expander-text: oklch(from var(--native-expander-tone-source) .77 .11 h);--native-expander-text-hover: oklch(from var(--native-expander-tone-source) .85 .1 h);--native-expander-bg-secondary: oklch(from var(--native-expander-tone-source) .13 .02 h);--native-expander-border-secondary: oklch(from var(--native-expander-tone-source) .21 .045 h);--native-expander-bg-primary: oklch(from var(--native-expander-tone-source) .185 .05 h);--native-expander-border-primary: oklch(from var(--native-expander-tone-source) .26 .06 h)}details[data-anta]>summary{position:relative;box-sizing:border-box;display:block;min-width:0;padding:var(--native-expander-summary-padding-block) 4px var(--native-expander-summary-padding-block) var(--native-expander-gutter);color:inherit;cursor:pointer;font:inherit;font-size:var(--native-expander-summary-font-size);line-height:var(--native-expander-summary-line-height);font-weight:584.62;letter-spacing:0;list-style:none;text-decoration-line:none;transition:color .15s ease}details[data-anta]>summary::-webkit-details-marker{display:none}details[data-anta]>summary::marker{content:""}details[data-anta]>summary:before{content:"";position:absolute;left:calc(var(--native-expander-gutter) - var(--native-expander-chevron-size) - 2px);top:var(--native-expander-summary-padding-block);width:var(--native-expander-chevron-size);height:var(--native-expander-summary-line-height);background-color:currentColor;-webkit-mask:var(--_expander-chevron) center / var(--native-expander-chevron-size) no-repeat;mask:var(--_expander-chevron) center / var(--native-expander-chevron-size) no-repeat;opacity:.6;transform:rotate(0);transition:transform .15s ease,opacity .15s ease,background-color .15s ease}details[data-anta][open]>summary:before{opacity:1;transform:rotate(90deg)}details[data-anta]:is([priority=primary],[priority=secondary]):not([open]):hover{background:oklch(from var(--native-expander-bg) calc(l + .01) c h)}details[data-anta]:is([priority=primary],[priority=secondary]):not([open]):active{background:var(--native-expander-bg)}details[data-anta]>summary:hover{color:var(--native-expander-text-hover);text-decoration-line:underline;text-decoration-style:dotted;text-decoration-color:color-mix(in oklch,currentColor 75%,transparent);text-decoration-thickness:1px;text-underline-offset:3px}details[data-anta]>summary:hover:before{opacity:1}details[data-anta]>summary:active{color:var(--native-expander-text)}details[data-anta]>summary:focus-visible{outline:1px solid var(--focus-ring);outline-offset:1px}details[data-anta]>:not(summary){display:block;padding:2px 4px 6px var(--native-expander-gutter);line-height:20px}@media(forced-colors:active){:is(a-expander,details[data-anta]){border-color:CanvasText}:is(a-expander,details[data-anta]):not([priority=primary],[priority=tertiary]){border-style:dashed}:is(a-expander,details[data-anta])[priority=tertiary]{border-color:Canvas}a-expander::part(summary):before,a-expander:not(:defined) a-expander-summary:before,details[data-anta]>summary:before{forced-color-adjust:none;background-color:CanvasText}a-expander[disabled]::part(summary):before{background-color:GrayText}}}
+@layer anta{a-expander,details[data-anta]{--_expander-chevron: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24'%3e%3cpath stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m9 18 6-6-6-6'/%3e%3c/svg%3e")}a-expander{--expander-text: var(--text-2);--expander-text-hover: var(--text-1);--expander-bg-secondary: var(--bg-2);--expander-border-secondary: var(--border-5);--expander-bg-primary: var(--bg-4);--expander-border-primary: var(--border-4);--expander-bg: var(--expander-bg-secondary);--expander-border: var(--expander-border-secondary);--expander-bg-hover-lift: .01;--expander-bg-hover: oklch(from var(--expander-bg) calc(l + var(--expander-bg-hover-lift)) c h);--expander-gutter: 24px;display:block;width:100%;box-sizing:border-box;border:1px solid var(--expander-border);border-radius:4px;color:var(--expander-text);background:var(--expander-bg);transition:background-color .1s ease}a-expander[round]{--expander-round: attr(round type(<length>));border-radius:var(--expander-round, var(--_expander-round-radius, 999px))}a-expander>span[slot=actions]{display:contents}a-expander:not(:defined) a-expander-details{display:none}a-expander:not(:defined)[state=open] a-expander-details,a-expander:not(:defined)[default-state=open] a-expander-details{display:block}a-expander:not(:defined) a-expander-summary{position:relative;padding:6px 4px 6px var(--expander-gutter)}a-expander:not(:defined) a-expander-summary:before{content:"";position:absolute;left:calc(var(--expander-gutter) - 16px - 2px);top:50%;width:16px;height:16px;transform:translateY(-50%);background-color:currentColor;-webkit-mask:var(--_expander-chevron) center / contain no-repeat;mask:var(--_expander-chevron) center / contain no-repeat;opacity:.6}a-expander:not(:defined){display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center}a-expander:not(:defined) a-expander-summary{grid-column:1}a-expander:not(:defined)>[slot=actions]{grid-column:2;display:flex;align-items:center;gap:2px;flex-shrink:0;margin-inline-start:8px;margin-inline-end:4px}a-expander:not(:defined) a-expander-details{grid-column:1 / -1}a-expander-summary{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:15px;line-height:20px;font-weight:584.62;letter-spacing:0;text-decoration-line:var(--_summary-underline, none);text-decoration-style:dotted;text-decoration-color:color-mix(in oklch,currentColor 75%,transparent);text-decoration-thickness:1px;text-underline-offset:3px;transition:color .15s ease}a-expander[level="1"] a-expander-summary{font-size:28px;line-height:32px}a-expander[level="2"] a-expander-summary{font-size:24px;line-height:28px}a-expander[level="3"] a-expander-summary{font-size:20px;line-height:24px}a-expander[level="4"] a-expander-summary{font-size:17px;line-height:20px}a-expander[level="6"] a-expander-summary{font-size:13px;line-height:16px}a-expander-details{display:block;padding:2px 4px 6px var(--expander-gutter);line-height:20px;overflow:auto}a-expander[priority=tertiary][outdent] a-expander-details{padding-inline-start:4px;margin-inline-start:-4px}a-expander[priority=primary]{--expander-bg: var(--expander-bg-primary);--expander-border: var(--expander-border-primary)}a-expander[priority=tertiary]{--expander-bg: transparent;--expander-border: transparent}a-expander:not([disabled]):not(:state(open)):hover{background:var(--expander-bg-hover)}a-expander:not([disabled]):not(:state(open)):active{background:var(--expander-bg)}a-expander[priority=tertiary][outdent]{--expander-gutter: 0px}a-expander[tone=brand]{--expander-text: var(--text-2-brand);--expander-text-hover: var(--text-1-brand);--expander-bg-secondary: var(--bg-2-brand);--expander-border-secondary: var(--border-5-brand);--expander-bg-primary: var(--bg-4-brand);--expander-border-primary: var(--border-4-brand)}a-expander[tone=info]{--expander-text: var(--text-2-info);--expander-text-hover: var(--text-1-info);--expander-bg-secondary: var(--bg-2-info);--expander-border-secondary: var(--border-5-info);--expander-bg-primary: var(--bg-4-info);--expander-border-primary: var(--border-4-info)}a-expander[tone=success]{--expander-text: var(--text-2-success);--expander-text-hover: var(--text-1-success);--expander-bg-secondary: var(--bg-2-success);--expander-border-secondary: var(--border-5-success);--expander-bg-primary: var(--bg-4-success);--expander-border-primary: var(--border-4-success)}a-expander[tone=warning]{--expander-text: var(--text-2-warning);--expander-text-hover: var(--text-1-warning);--expander-bg-secondary: var(--bg-2-warning);--expander-border-secondary: var(--border-5-warning);--expander-bg-primary: var(--bg-4-warning);--expander-border-primary: var(--border-4-warning)}a-expander[tone=critical]{--expander-text: var(--text-2-critical);--expander-text-hover: var(--text-1-critical);--expander-bg-secondary: var(--bg-2-critical);--expander-border-secondary: var(--border-5-critical);--expander-bg-primary: var(--bg-4-critical);--expander-border-primary: var(--border-4-critical)}a-expander[tone]:not([tone=neutral],[tone=brand],[tone=info],[tone=success],[tone=warning],[tone=critical]){--expander-tone-source: attr(tone type(<color>), currentColor);--expander-text: oklch(from var(--expander-tone-source) .5 .125 h);--expander-text-hover: oklch(from var(--expander-tone-source) .4 .11 h);--expander-bg-secondary: oklch(from var(--expander-tone-source) .99 .004 h);--expander-border-secondary: oklch(from var(--expander-tone-source) .935 .028 h);--expander-bg-primary: oklch(from var(--expander-tone-source) .955 .02 h);--expander-border-primary: oklch(from var(--expander-tone-source) .9 .04 h)}.dark a-expander[tone]:not([tone=neutral],[tone=brand],[tone=info],[tone=success],[tone=warning],[tone=critical]){--expander-text: oklch(from var(--expander-tone-source) .77 .11 h);--expander-text-hover: oklch(from var(--expander-tone-source) .85 .1 h);--expander-bg-secondary: oklch(from var(--expander-tone-source) .13 .02 h);--expander-border-secondary: oklch(from var(--expander-tone-source) .21 .045 h);--expander-bg-primary: oklch(from var(--expander-tone-source) .185 .05 h);--expander-border-primary: oklch(from var(--expander-tone-source) .26 .06 h)}a-expander[disabled],a-expander[disabled][tone]{--expander-text: #afa9b1}.dark a-expander[disabled],.dark a-expander[disabled][tone]{--expander-text: #635b65}details[data-anta]{--native-expander-gutter: 24px;--native-expander-summary-padding-block: 6px;--native-expander-summary-font-size: 15px;--native-expander-summary-line-height: 20px;--native-expander-chevron-size: 16px;--native-expander-text: var(--text-2);--native-expander-text-hover: var(--text-1);--native-expander-bg-secondary: var(--bg-2);--native-expander-border-secondary: var(--border-5);--native-expander-bg-primary: var(--bg-4);--native-expander-border-primary: var(--border-4);--native-expander-round-size: 16px;--native-expander-round: 4px;--native-expander-bg: transparent;--native-expander-border: transparent;display:block;inline-size:100%;box-sizing:border-box;border:0 solid var(--native-expander-border);border-radius:var(--native-expander-round);color:var(--native-expander-text);background:var(--native-expander-bg);font-family:var(--sans-serif);font-size:15px;font-feature-settings:"ss02","ss05","tnum";line-height:var(--native-expander-summary-line-height);transition:background-color .1s ease}details[data-anta][priority=secondary]{--native-expander-bg: var(--native-expander-bg-secondary);--native-expander-border: var(--native-expander-border-secondary);border-width:1px}details[data-anta][priority=primary]{--native-expander-bg: var(--native-expander-bg-primary);--native-expander-border: var(--native-expander-border-primary);border-width:1px}details[data-anta][level="1"]{--native-expander-summary-font-size: 28px;--native-expander-summary-line-height: 32px;--native-expander-round-size: 22px}details[data-anta][level="2"]{--native-expander-summary-font-size: 24px;--native-expander-summary-line-height: 28px;--native-expander-round-size: 20px}details[data-anta][level="3"]{--native-expander-summary-font-size: 20px;--native-expander-summary-line-height: 24px;--native-expander-round-size: 18px}details[data-anta][level="4"]{--native-expander-summary-font-size: 17px;--native-expander-summary-line-height: 20px}details[data-anta][level="6"]{--native-expander-summary-font-size: 13px;--native-expander-summary-line-height: 16px;--native-expander-round-size: 14px}details[data-anta][round]{--native-expander-round: var(--native-expander-round-size)}details[data-anta][round]:not([round=""]){--native-expander-round: attr(round type(<length>), var(--native-expander-round-size))}details[data-anta][priority=tertiary][outdent]{--native-expander-gutter: 0px}details[data-anta][tone=brand]{--native-expander-text: var(--text-2-brand);--native-expander-text-hover: var(--text-1-brand);--native-expander-bg-secondary: var(--bg-2-brand);--native-expander-border-secondary: var(--border-5-brand);--native-expander-bg-primary: var(--bg-4-brand);--native-expander-border-primary: var(--border-4-brand)}details[data-anta][tone=info]{--native-expander-text: var(--text-2-info);--native-expander-text-hover: var(--text-1-info);--native-expander-bg-secondary: var(--bg-2-info);--native-expander-border-secondary: var(--border-5-info);--native-expander-bg-primary: var(--bg-4-info);--native-expander-border-primary: var(--border-4-info)}details[data-anta][tone=success]{--native-expander-text: var(--text-2-success);--native-expander-text-hover: var(--text-1-success);--native-expander-bg-secondary: var(--bg-2-success);--native-expander-border-secondary: var(--border-5-success);--native-expander-bg-primary: var(--bg-4-success);--native-expander-border-primary: var(--border-4-success)}details[data-anta][tone=warning]{--native-expander-text: var(--text-2-warning);--native-expander-text-hover: var(--text-1-warning);--native-expander-bg-secondary: var(--bg-2-warning);--native-expander-border-secondary: var(--border-5-warning);--native-expander-bg-primary: var(--bg-4-warning);--native-expander-border-primary: var(--border-4-warning)}details[data-anta][tone=critical]{--native-expander-text: var(--text-2-critical);--native-expander-text-hover: var(--text-1-critical);--native-expander-bg-secondary: var(--bg-2-critical);--native-expander-border-secondary: var(--border-5-critical);--native-expander-bg-primary: var(--bg-4-critical);--native-expander-border-primary: var(--border-4-critical)}details[data-anta][tone]:not([tone=""],[tone=neutral],[tone=brand],[tone=info],[tone=success],[tone=warning],[tone=critical]){--native-expander-tone-source: attr(tone type(<color>), currentColor);--native-expander-text: oklch(from var(--native-expander-tone-source) .5 .125 h);--native-expander-text-hover: oklch(from var(--native-expander-tone-source) .4 .11 h);--native-expander-bg-secondary: oklch(from var(--native-expander-tone-source) .99 .004 h);--native-expander-border-secondary: oklch(from var(--native-expander-tone-source) .935 .028 h);--native-expander-bg-primary: oklch(from var(--native-expander-tone-source) .955 .02 h);--native-expander-border-primary: oklch(from var(--native-expander-tone-source) .9 .04 h)}.dark details[data-anta][tone]:not([tone=""],[tone=neutral],[tone=brand],[tone=info],[tone=success],[tone=warning],[tone=critical]){--native-expander-text: oklch(from var(--native-expander-tone-source) .77 .11 h);--native-expander-text-hover: oklch(from var(--native-expander-tone-source) .85 .1 h);--native-expander-bg-secondary: oklch(from var(--native-expander-tone-source) .13 .02 h);--native-expander-border-secondary: oklch(from var(--native-expander-tone-source) .21 .045 h);--native-expander-bg-primary: oklch(from var(--native-expander-tone-source) .185 .05 h);--native-expander-border-primary: oklch(from var(--native-expander-tone-source) .26 .06 h)}details[data-anta]>summary{position:relative;box-sizing:border-box;display:block;min-width:0;padding:var(--native-expander-summary-padding-block) 4px var(--native-expander-summary-padding-block) var(--native-expander-gutter);color:inherit;cursor:pointer;font:inherit;font-size:var(--native-expander-summary-font-size);line-height:var(--native-expander-summary-line-height);font-weight:584.62;letter-spacing:0;list-style:none;text-decoration-line:none;transition:color .15s ease}details[data-anta]>summary::-webkit-details-marker{display:none}details[data-anta]>summary::marker{content:""}details[data-anta]>summary:before{content:"";position:absolute;left:calc(var(--native-expander-gutter) - var(--native-expander-chevron-size) - 2px);top:var(--native-expander-summary-padding-block);width:var(--native-expander-chevron-size);height:var(--native-expander-summary-line-height);background-color:currentColor;-webkit-mask:var(--_expander-chevron) center / var(--native-expander-chevron-size) no-repeat;mask:var(--_expander-chevron) center / var(--native-expander-chevron-size) no-repeat;opacity:.6;transform:rotate(0);transition:transform .15s ease,opacity .15s ease,background-color .15s ease}details[data-anta][open]>summary:before{opacity:1;transform:rotate(90deg)}details[data-anta]:is([priority=primary],[priority=secondary]):not([open]):hover{background:oklch(from var(--native-expander-bg) calc(l + .01) c h)}details[data-anta]:is([priority=primary],[priority=secondary]):not([open]):active{background:var(--native-expander-bg)}details[data-anta]>summary:hover{color:var(--native-expander-text-hover);text-decoration-line:underline;text-decoration-style:dotted;text-decoration-color:color-mix(in oklch,currentColor 75%,transparent);text-decoration-thickness:1px;text-underline-offset:3px}details[data-anta]>summary:hover:before{opacity:1}details[data-anta]>summary:active{color:var(--native-expander-text)}details[data-anta]>summary:focus-visible{outline:1px solid var(--focus-ring);outline-offset:1px}details[data-anta]>:not(summary){display:block;padding:2px 4px 6px var(--native-expander-gutter);line-height:20px}@media(forced-colors:active){:is(a-expander,details[data-anta]){border-color:CanvasText}:is(a-expander,details[data-anta]):not([priority=primary],[priority=tertiary]){border-style:dashed}:is(a-expander,details[data-anta])[priority=tertiary]{border-color:Canvas}a-expander::part(summary):before,a-expander:not(:defined) a-expander-summary:before,details[data-anta]>summary:before{forced-color-adjust:none;background-color:CanvasText}a-expander[disabled]::part(summary):before{background-color:GrayText}}}a-expander-details>p:last-child,a-expander-details>:not([slot])>p:last-child,details[data-anta]>p:last-child,details[data-anta]>:not(summary)>p:last-child{margin-block-end:0}

package/dist/elements/a-expander.d.ts

@@ -4,6 +4,7 @@ export declare class AExpanderElement extends HTMLElementBase {
     #private;
     static observedAttributes: string[];
     private summary;
+    private titleSlot;
     private region;
     private header;
     private roundStyle;

package/dist/elements/a-expander.js

@@ -52,7 +52,7 @@ const SHADOW_STYLE = `
     align-items: center;
     gap: 0;
     cursor: pointer;
-    user-select: none;
+    user-select: text;
     border-radius: 2px;
     outline: none;
   }
@@ -132,6 +132,7 @@ const parseState = parseOpenState;
 class AExpanderElement extends HTMLElementBase {
   static observedAttributes = ["state", "disabled", "round"];
   summary;
+  titleSlot;
   region;
   header;
   // A dedicated shadow <style> the element rewrites to publish the measured
@@ -161,6 +162,7 @@ class AExpanderElement extends HTMLElementBase {
     this.summary.setAttribute("part", "summary");
     const titleSlot = document.createElement("slot");
     titleSlot.name = "title";
+    this.titleSlot = titleSlot;
     this.summary.append(titleSlot);
     this.summary.addEventListener("click", this.onSummaryClick);
     const header = document.createElement("div");
@@ -267,12 +269,20 @@ class AExpanderElement extends HTMLElementBase {
     const scope = end === -1 ? path : path.slice(0, end);
     return scope.some((n) => n instanceof Element && ignoresToggle(n));
   }
+  /** A selection that reaches projected title content came from a drag. Keep it
+   *  selected instead of treating its release as an activation. */
+  #titleHasSelection() {
+    const selection = this.ownerDocument.getSelection();
+    if (!selection || selection.isCollapsed || selection.rangeCount === 0) return false;
+    const range = selection.getRangeAt(0);
+    return this.titleSlot.assignedNodes().some((node) => range.intersectsNode(node));
+  }
   /** Compute the requested next state, announce it (cancelable, *before*
    *  applying), then — uncontrolled only, and only if not vetoed — apply it.
    *  Controlled: never self-apply; the consumer answers via the `state`
    *  attribute. See STATEFUL-COMPONENTS.md. */
   onSummaryClick = (e) => {
-    if (this.#clickIgnoresToggle(e)) return;
+    if (this.#clickIgnoresToggle(e) || e.detail !== 0 && this.#titleHasSelection()) return;
     const prev = this.#current;
     const next = prev === "open" ? "closed" : "open";
     const ok = this.dispatchEvent(

package/dist/elements/a-menu.d.ts

@@ -98,8 +98,7 @@ export declare class AMenuElement extends HTMLElementBase {
      *  a multi-select lands on its topmost checked row. */
     private seatInitialFocus;
     /** Scroll THIS menu's body so `item` sits inside the visible scroll viewport,
-     *  touching only the internal `.scroll` container — never the document, whose
-     *  scroll would trip the anchor-scrolled-out dismiss. No-op for a menu short
+     *  touching only the internal `.scroll` container. No-op for a menu short
      *  enough not to scroll. */
     private scrollItemIntoView;
     /** Fade the scrolling body's content into the top / bottom edges — but only on the
@@ -169,12 +168,6 @@ export declare class AMenuElement extends HTMLElementBase {
      *  mutates deep in its subtree, not this menu's direct children, so it won't
      *  spuriously reset the cursor. */
     private startComboObserver;
-    /** Watch the root trigger and dismiss the system once it scrolls out of the
-     *  spot it held at open (see trackPosition). Deferred a frame so the trigger's
-     *  post-open layout has settled before the rect is snapshotted; guarded in case
-     *  the menu closed in between. Tracks the root anchor only — submenus ride
-     *  inside it, so if the root anchor goes, the whole system should go. */
-    private armPositionTracker;
     /** Apply CLOSE to the DOM (no event). Closes this menu and everything stacked
      *  above it (its submenus). */
     private hide;

package/dist/elements/a-menu.js

@@ -7,14 +7,12 @@ const MIN_HEIGHT = 96;
 const SUBMENU_OPEN_DELAY = 130;
 const SUBMENU_CLOSE_DELAY = 130;
 const TYPEAHEAD_RESET = 500;
-const ANCHOR_VISIBLE_RATIO = 0.5;
 const SELF_ACTIVATING = 'a-button, button, a[href], input[type="button"], input[type="submit"], input[type="reset"], [role="button"]';
 const EDITABLE_FIELD = "input:not([readonly]), textarea:not([readonly]), a-input:not([readonly]), a-input-time:not([readonly])";
 const openStack = [];
 let docBound = false;
 let boundDoc = null;
 let boundView = null;
-let removePosTracker = null;
 function bindDocListeners(doc, view) {
   if (docBound) return;
   doc.addEventListener("pointerdown", onDocPointerDown, true);
@@ -33,31 +31,10 @@ function unbindDocListeners() {
   boundDoc?.removeEventListener("keyup", onDocKeyUp, true);
   boundDoc?.removeEventListener("contextmenu", onDocContextMenu, true);
   boundView?.removeEventListener("resize", onResize);
-  removePosTracker?.();
-  removePosTracker = null;
   boundDoc = null;
   boundView = null;
   docBound = false;
 }
-function trackPosition(el, onEscape) {
-  if (typeof IntersectionObserver === "undefined") return () => {
-  };
-  const doc = el.ownerDocument;
-  const rect = el.getBoundingClientRect();
-  const vw = doc.documentElement.clientWidth;
-  const vh = doc.documentElement.clientHeight;
-  const rootMargin = `${-rect.top}px ${-(vw - rect.right)}px ${-(vh - rect.bottom)}px ${-rect.left}px`;
-  const win = doc.defaultView;
-  const root = win && win !== win.top ? doc.documentElement : null;
-  const io = new IntersectionObserver(
-    ([entry]) => {
-      if (!entry.isIntersecting) onEscape();
-    },
-    { root, rootMargin, threshold: ANCHOR_VISIBLE_RATIO }
-  );
-  io.observe(el);
-  return () => io.disconnect();
-}
 function pathHitsMenus(e, primaryClick = false) {
   const path = e.composedPath();
   for (const m of openStack) {
@@ -471,8 +448,7 @@ class AMenuElement extends HTMLElementBase {
     if (viaKeyboard) (selected ?? items[0])?.focus({ preventScroll: true });
   }
   /** Scroll THIS menu's body so `item` sits inside the visible scroll viewport,
-   *  touching only the internal `.scroll` container — never the document, whose
-   *  scroll would trip the anchor-scrolled-out dismiss. No-op for a menu short
+   *  touching only the internal `.scroll` container. No-op for a menu short
    *  enough not to scroll. */
   scrollItemIntoView(item) {
     const c = this.scrollEl;
@@ -696,7 +672,6 @@ class AMenuElement extends HTMLElementBase {
     openStack.push(this);
     if (wasEmpty) {
       bindDocListeners(this.doc, this.view);
-      this.armPositionTracker();
     }
     const search = this.#searchField;
     if (search) {
@@ -722,20 +697,6 @@ class AMenuElement extends HTMLElementBase {
     });
     this.comboObserver.observe(this, { childList: true });
   }
-  /** Watch the root trigger and dismiss the system once it scrolls out of the
-   *  spot it held at open (see trackPosition). Deferred a frame so the trigger's
-   *  post-open layout has settled before the rect is snapshotted; guarded in case
-   *  the menu closed in between. Tracks the root anchor only — submenus ride
-   *  inside it, so if the root anchor goes, the whole system should go. */
-  armPositionTracker() {
-    const anchor = this.triggerAnchor;
-    if (!anchor) return;
-    this.view.requestAnimationFrame(() => {
-      if (!this._shown || openStack[0] !== this) return;
-      removePosTracker?.();
-      removePosTracker = trackPosition(anchor, () => dismiss());
-    });
-  }
   /** Apply CLOSE to the DOM (no event). Closes this menu and everything stacked
    *  above it (its submenus). */
   hide() {

package/dist/elements/a-progress.css

@@ -1 +1 @@
-@layer anta{:where(a-progress,progress[data-anta]){--progress-bg: var(--bg-4);--progress-border-color: var(--border-4);--progress-indicator-bg: var(--bg-5);--progress-indicator-edge: linear-gradient( 90deg, var(--progress-indicator-bg) 0%, var(--progress-border-color) 100% );--progress-text-color: var(--text-2);--progress-hint-color: var(--text-3);--progress-loading-angle: 125deg;--progress-loading-x-period: calc(40px + 5cqi) ;--progress-loading-period: calc( var(--progress-loading-x-period) * cos(var(--progress-loading-angle) - 90deg) );--progress-loading-stripe: calc(var(--progress-loading-period) * 2 / 5);--progress-loading-stripe-gap: calc(var(--progress-loading-period) * 3 / 5);--progress-loading-opacity: .15;--progress-loading-blur: clamp(8px, 2cqi, 16px);--progress-loading-duration: .5s;--progress-padding-block: 4px;--progress-padding-inline: 8px;--progress-min-height: 8px;--progress-label-size: 13px;--progress-label-line-height: 16px}a-progress{display:block;container-type:inline-size;padding:var(--progress-padding-block) var(--progress-padding-inline);min-height:var(--progress-min-height);background:var(--progress-bg);border:0px solid var(--progress-border-color);border-radius:0}:where(a-progress,progress[data-anta])[size=small]{--progress-padding-block: 2px;--progress-padding-inline: 6px;--progress-label-size: 12px;--progress-label-line-height: 14px}:where(a-progress,progress[data-anta])[size=large]{--progress-padding-block: 6px;--progress-padding-inline: 10px;--progress-label-size: 15px;--progress-label-line-height: 20px}a-progress[round]{--progress-round: 999px;border-radius:var(--progress-round)}@supports (border-radius: attr(round type(<length>),999px)){a-progress[round]{--progress-round: attr(round type(<length>), 999px)}}:where(a-progress,progress[data-anta])[tone=brand]{--progress-bg: var(--bg-4-brand);--progress-border-color: var(--border-4-brand);--progress-indicator-bg: var(--bg-5-brand);--progress-text-color: var(--text-2-brand);--progress-hint-color: var(--text-3-brand)}:where(a-progress,progress[data-anta])[tone=info]{--progress-bg: var(--bg-4-info);--progress-border-color: var(--border-4-info);--progress-indicator-bg: var(--bg-5-info);--progress-text-color: var(--text-2-info);--progress-hint-color: var(--text-3-info)}:where(a-progress,progress[data-anta])[tone=success]{--progress-bg: var(--bg-4-success);--progress-border-color: var(--border-4-success);--progress-indicator-bg: var(--bg-5-success);--progress-text-color: var(--text-2-success);--progress-hint-color: var(--text-3-success)}:where(a-progress,progress[data-anta])[tone=warning]{--progress-bg: var(--bg-4-warning);--progress-border-color: var(--border-4-warning);--progress-indicator-bg: var(--bg-5-warning);--progress-text-color: var(--text-2-warning);--progress-hint-color: var(--text-3-warning)}:where(a-progress,progress[data-anta])[tone=critical]{--progress-bg: var(--bg-4-critical);--progress-border-color: var(--border-4-critical);--progress-indicator-bg: var(--bg-5-critical);--progress-text-color: var(--text-2-critical);--progress-hint-color: var(--text-3-critical)}@supports (color: attr(tone type(<color>),transparent)){:where(a-progress,progress[data-anta])[tone]:not([tone=""],[tone=neutral],[tone=brand],[tone=info],[tone=success],[tone=warning],[tone=critical]){--progress-tone-source: attr(tone type(<color>), transparent);--progress-bg: oklch(from var(--progress-tone-source) .955 .02 h);--progress-border-color: oklch(from var(--progress-tone-source) .9 .04 h);--progress-indicator-bg: oklch(from var(--progress-tone-source) .935 .03 h);--progress-text-color: oklch(from var(--progress-tone-source) .43 .15 h);--progress-hint-color: color-mix(in oklch, var(--progress-text-color) 82%, transparent);.dark &{--progress-bg: oklch(from var(--progress-tone-source) .185 .05 h);--progress-border-color: oklch(from var(--progress-tone-source) .26 .06 h);--progress-indicator-bg: oklch(from var(--progress-tone-source) .205 .055 h);--progress-text-color: oklch(from var(--progress-tone-source) .77 .11 h);--progress-hint-color: color-mix(in oklch, var(--progress-text-color) 80%, transparent)}}}a-progress-label{display:flex;align-items:flex-start;gap:.5ch;font-variant-numeric:lining-nums tabular-nums;font-feature-settings:"ss02","ss05";letter-spacing:.03em;font-size:var(--progress-label-size);line-height:var(--progress-label-line-height)}a-progress-number{flex-shrink:0;color:var(--progress-text-color)}a-progress-text{flex:1 1 auto;min-width:0;color:var(--progress-text-color)}a-progress-hint{flex-shrink:0;margin-left:auto;color:var(--progress-hint-color)}progress[data-anta]{--anta-native-progress-height: calc( var(--progress-min-height) + var(--progress-padding-block) + var(--progress-padding-block) );--anta-native-progress-radius: 0px;--anta-native-progress-fill: linear-gradient( 90deg, var(--progress-indicator-bg) 0%, var(--progress-indicator-bg) calc(100% - 90px) , var(--progress-border-color) 100% );box-sizing:border-box;display:block;position:relative;container-type:inline-size;inline-size:100%;block-size:var(--anta-native-progress-height);margin:0;padding:0;border:0;border-radius:var(--anta-native-progress-radius);appearance:none;-webkit-appearance:none;-moz-appearance:none;background:var(--progress-bg);overflow:hidden;vertical-align:middle}progress[data-anta][round]{--anta-native-progress-radius: 999px}@supports (border-radius: attr(round type(<length>),999px)){progress[data-anta][round]{--anta-native-progress-radius: attr(round type(<length>), 999px)}}progress[data-anta]::-webkit-progress-bar{border-radius:var(--anta-native-progress-radius);background:var(--progress-bg)}progress[data-anta]::-webkit-progress-value{border-radius:var(--anta-native-progress-radius);background:var(--anta-native-progress-fill)}progress[data-anta]::-moz-progress-bar{border:0;border-radius:var(--anta-native-progress-radius);background:var(--anta-native-progress-fill)}progress[data-anta]:not([value]):before{content:"";position:absolute;top:0;bottom:0;left:calc(0px - var(--progress-loading-x-period));width:calc(100% + var(--progress-loading-x-period));pointer-events:none;background:repeating-linear-gradient(var(--progress-loading-angle),transparent 0,transparent var(--progress-loading-stripe-gap),var(--progress-text-color) var(--progress-loading-stripe-gap),var(--progress-text-color) calc(var(--progress-loading-stripe-gap) + var(--progress-loading-stripe)));filter:blur(var(--progress-loading-blur));opacity:var(--progress-loading-opacity);will-change:transform}@media(prefers-reduced-motion:no-preference){progress[data-anta]:not([value]):before{animation:progress-native-loading-slide var(--progress-loading-duration) linear infinite;animation-delay:-9999s}}@keyframes progress-native-loading-slide{to{transform:translate(var(--progress-loading-x-period))}}@media(forced-colors:active){:where(a-progress,progress[data-anta]){forced-color-adjust:none;--progress-bg: Canvas !important;--progress-border-color: CanvasText !important;--progress-indicator-bg: SelectedItem !important;--progress-indicator-edge: SelectedItem !important;--progress-indicator-edge-border: 1px solid SelectedItemText !important;--progress-text-color: CanvasText !important;--progress-hint-color: CanvasText !important;border:1px dotted CanvasText!important}.dark :where(a-progress,progress[data-anta]){--progress-indicator-bg: Highlight !important;--progress-indicator-edge: Highlight !important;--progress-indicator-edge-border: 1px solid HighlightText !important}}@media(forced-colors:active)and (prefers-color-scheme:dark){:where(a-progress,progress[data-anta]){--progress-indicator-bg: Highlight !important;--progress-indicator-edge: Highlight !important;--progress-indicator-edge-border: 1px solid HighlightText !important}}}
+@layer anta{:where(a-progress,progress[data-anta]){--progress-bg: var(--bg-4);--progress-border-color: var(--border-4);--progress-indicator-bg: var(--bg-5);--progress-indicator-edge: linear-gradient( 90deg, var(--progress-indicator-bg) 0%, var(--progress-border-color) 100% );--progress-text-color: var(--text-2);--progress-hint-color: var(--text-3);--progress-loading-angle: 125deg;--progress-loading-x-period: calc(40px + 5cqi) ;--progress-loading-period: calc( var(--progress-loading-x-period) * cos(var(--progress-loading-angle) - 90deg) );--progress-loading-stripe: calc(var(--progress-loading-period) * 2 / 5);--progress-loading-stripe-gap: calc(var(--progress-loading-period) * 3 / 5);--progress-loading-opacity: .15;--progress-loading-blur: clamp(8px, 2cqi, 16px);--progress-loading-duration: .5s;--progress-padding-block: 4px;--progress-padding-inline: 8px;--progress-min-height: 8px;--progress-label-size: 13px;--progress-label-line-height: 16px}a-progress{display:block;container-type:inline-size;padding:var(--progress-padding-block) var(--progress-padding-inline);min-height:var(--progress-min-height);background:var(--progress-bg);border:0px solid var(--progress-border-color);border-radius:0}:where(a-progress,progress[data-anta])[size=small]{--progress-padding-block: 2px;--progress-padding-inline: 6px;--progress-label-size: 12px;--progress-label-line-height: 14px}:where(a-progress,progress[data-anta])[size=large]{--progress-padding-block: 6px;--progress-padding-inline: 10px;--progress-label-size: 15px;--progress-label-line-height: 20px}a-progress[round]{--progress-round: 999px;border-radius:var(--progress-round)}@supports (border-radius: attr(round type(<length>),999px)){a-progress[round]{--progress-round: attr(round type(<length>), 999px)}}:where(a-progress,progress[data-anta])[tone=brand]{--progress-bg: var(--bg-4-brand);--progress-border-color: var(--border-4-brand);--progress-indicator-bg: var(--bg-5-brand);--progress-text-color: var(--text-2-brand);--progress-hint-color: var(--text-3-brand)}:where(a-progress,progress[data-anta])[tone=info]{--progress-bg: var(--bg-4-info);--progress-border-color: var(--border-4-info);--progress-indicator-bg: var(--bg-5-info);--progress-text-color: var(--text-2-info);--progress-hint-color: var(--text-3-info)}:where(a-progress,progress[data-anta])[tone=success]{--progress-bg: var(--bg-4-success);--progress-border-color: var(--border-4-success);--progress-indicator-bg: var(--bg-5-success);--progress-text-color: var(--text-2-success);--progress-hint-color: var(--text-3-success)}:where(a-progress,progress[data-anta])[tone=warning]{--progress-bg: var(--bg-4-warning);--progress-border-color: var(--border-4-warning);--progress-indicator-bg: var(--bg-5-warning);--progress-text-color: var(--text-2-warning);--progress-hint-color: var(--text-3-warning)}:where(a-progress,progress[data-anta])[tone=critical]{--progress-bg: var(--bg-4-critical);--progress-border-color: var(--border-4-critical);--progress-indicator-bg: var(--bg-5-critical);--progress-text-color: var(--text-2-critical);--progress-hint-color: var(--text-3-critical)}@supports (color: attr(tone type(<color>),transparent)){:where(a-progress,progress[data-anta])[tone]:not([tone=""],[tone=neutral],[tone=brand],[tone=info],[tone=success],[tone=warning],[tone=critical]){--progress-tone-source: attr(tone type(<color>), transparent);--progress-bg: oklch(from var(--progress-tone-source) .955 .02 h);--progress-border-color: oklch(from var(--progress-tone-source) .9 .04 h);--progress-indicator-bg: oklch(from var(--progress-tone-source) .935 .03 h);--progress-text-color: oklch(from var(--progress-tone-source) .43 .15 h);--progress-hint-color: color-mix(in oklch, var(--progress-text-color) 82%, transparent);.dark &{--progress-bg: oklch(from var(--progress-tone-source) .185 .05 h);--progress-border-color: oklch(from var(--progress-tone-source) .26 .06 h);--progress-indicator-bg: oklch(from var(--progress-tone-source) .205 .055 h);--progress-text-color: oklch(from var(--progress-tone-source) .77 .11 h);--progress-hint-color: color-mix(in oklch, var(--progress-text-color) 80%, transparent)}}}a-progress-label{display:flex;align-items:flex-start;gap:.5ch;font-variant-numeric:lining-nums tabular-nums;font-feature-settings:"ss02","ss05";letter-spacing:.03em;font-size:var(--progress-label-size);line-height:var(--progress-label-line-height)}a-progress-number{flex-shrink:0;color:var(--progress-text-color)}a-progress-text{flex:1 1 auto;min-width:0;color:var(--progress-text-color)}a-progress-hint{flex-shrink:0;margin-left:auto;color:var(--progress-hint-color)}progress[data-anta]{--anta-native-progress-height: calc( var(--progress-min-height) + var(--progress-padding-block) + var(--progress-padding-block) );--anta-native-progress-radius: 0px;--anta-native-progress-fill: linear-gradient( 90deg, var(--progress-indicator-bg) 0%, var(--progress-indicator-bg) calc(100% - 90px) , var(--progress-border-color) 100% );box-sizing:border-box;display:block;position:relative;container-type:inline-size;inline-size:100%;block-size:var(--anta-native-progress-height);margin:0;padding:0;border:0;border-radius:var(--anta-native-progress-radius);appearance:none;-webkit-appearance:none;-moz-appearance:none;background:var(--progress-bg);overflow:hidden;vertical-align:middle}progress[data-anta][round]{--anta-native-progress-radius: 999px}@supports (border-radius: attr(round type(<length>),999px)){progress[data-anta][round]{--anta-native-progress-radius: attr(round type(<length>), 999px)}}progress[data-anta]::-webkit-progress-bar{border-radius:var(--anta-native-progress-radius);background:var(--progress-bg)}progress[data-anta]::-webkit-progress-value{border-radius:var(--anta-native-progress-radius);background:var(--anta-native-progress-fill)}progress[data-anta]::-moz-progress-bar{border:0;border-radius:var(--anta-native-progress-radius);background:var(--anta-native-progress-fill)}progress[data-anta]:not([value]):before{content:"";position:absolute;top:0;bottom:0;left:calc(0px - var(--progress-loading-x-period));width:calc(100% + var(--progress-loading-x-period));pointer-events:none;background:repeating-linear-gradient(var(--progress-loading-angle),transparent 0,transparent var(--progress-loading-stripe-gap),var(--progress-text-color) var(--progress-loading-stripe-gap),var(--progress-text-color) calc(var(--progress-loading-stripe-gap) + var(--progress-loading-stripe)));filter:blur(var(--progress-loading-blur));opacity:var(--progress-loading-opacity);will-change:transform}@media(prefers-reduced-motion:no-preference){progress[data-anta]:not([value]):before{animation:progress-native-loading-slide var(--progress-loading-duration) linear infinite;animation-delay:-9999s}}@keyframes progress-native-loading-slide{to{transform:translate(var(--progress-loading-x-period))}}@media(forced-colors:active){:where(a-progress,progress[data-anta]){forced-color-adjust:none;--progress-bg: Canvas !important;--progress-border-color: CanvasText !important;--progress-indicator-bg: SelectedItem !important;--progress-indicator-edge: SelectedItem !important;--progress-indicator-edge-border: 1px solid SelectedItemText !important;--progress-text-color: CanvasText !important;--progress-hint-color: CanvasText !important;border:1px dotted CanvasText!important}.dark :where(a-progress,progress[data-anta]){--progress-indicator-bg: Highlight !important;--progress-indicator-edge: Highlight !important;--progress-indicator-edge-border: 1px solid HighlightText !important}}@media(forced-colors:active)and (prefers-color-scheme:dark){:where(a-progress,progress[data-anta]){--progress-indicator-bg: Highlight !important;--progress-indicator-edge: Highlight !important;--progress-indicator-edge-border: 1px solid HighlightText !important}}}a-progress>p:last-child,a-progress>:not([slot])>p:last-child{margin-block-end:0}

package/dist/elements/a-text.d.ts

@@ -35,6 +35,10 @@ export declare class ATextElement extends HTMLElementBase {
     connectedCallback(): void;
     disconnectedCallback(): void;
     attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void;
+    /** True when `truncate` currently hides some of the slotted content. This is
+     *  a UI-thread layout read, used by a nested `a-tooltip`; it never writes to
+     *  the host or light DOM. */
+    get isTruncated(): boolean;
     /** Create or remove the chevron to match `expandable`, then refresh it. */
     private syncExpandButton;
     private handleToggle;

package/dist/elements/a-text.js

@@ -141,6 +141,15 @@ class ATextElement extends HTMLElementBase {
   get #isCollapsible() {
     return this.hasAttribute("collapsible");
   }
+  /** True when `truncate` currently hides some of the slotted content. This is
+   *  a UI-thread layout read, used by a nested `a-tooltip`; it never writes to
+   *  the host or light DOM. */
+  get isTruncated() {
+    if (!this.hasAttribute("truncate") || this.expanded) return false;
+    const s = this.slotEl;
+    if (s.clientWidth === 0 && s.clientHeight === 0) return false;
+    return s.scrollHeight > s.clientHeight + 1 || s.scrollWidth > s.clientWidth + 1;
+  }
   /** Create or remove the chevron to match `expandable`, then refresh it. */
   syncExpandButton() {
     if (this.#isExpandable && !this.expandBtn) {
@@ -183,9 +192,7 @@ class ATextElement extends HTMLElementBase {
    *  clips. Frozen on while expanded; height catches wrapped text, width a long word. */
   measureOverflow() {
     if (!this.#isExpandable || this.expanded) return;
-    const s = this.slotEl;
-    const over = s.scrollHeight > s.clientHeight + 1 || s.scrollWidth > s.clientWidth + 1;
-    s.classList.toggle("overflowing", over);
+    this.slotEl.classList.toggle("overflowing", this.isTruncated);
   }
   /** Reflect state onto the button (label + `aria-expanded` + `.expanded`); a
    *  one-way expand removes it once open. */

package/dist/elements/a-tooltip.css

@@ -1 +1 @@
-@layer anta{a-tooltip:not(:defined){display:none}@media(hover:none)and (pointer:coarse){:where(:has(>a-tooltip)){-webkit-touch-callout:none;user-select:none}}a-tooltip{--tooltip-bg: color-mix(in oklch, var(--bg-1) 80%, transparent);--tooltip-shadow: 0 1px 8px color-mix(in oklch, var(--text-1) 15%, transparent), 0 0 1px color-mix(in oklch, var(--text-1) 50%, transparent);--tooltip-radius: 3px;--tooltip-max-width: min( calc(100vw - 20px) , 80ch);--tooltip-border: none;--tooltip-backdrop-filter: blur(8px)}a-tooltip[round]{--tooltip-radius: attr(round type(<length>), 20px)}.dark a-tooltip{--tooltip-bg: color-mix(in oklch, var(--bg-1) 70%, transparent);--tooltip-shadow: 0 2px 16px color-mix(in oklch, black 70%, transparent), inset 0 0 0 1px color-mix(in oklch, white 15%, transparent)}@media(forced-colors:active){a-tooltip{--tooltip-border: 1px dotted CanvasText}}}
+@layer anta{a-tooltip:not(:defined){display:none}@media(hover:none)and (pointer:coarse){:where(:has(>a-tooltip)){-webkit-touch-callout:none;user-select:none}}a-tooltip{--tooltip-bg: color-mix(in oklch, var(--bg-1) 80%, transparent);--tooltip-shadow: 0 1px 8px color-mix(in oklch, var(--text-1) 15%, transparent), 0 0 1px color-mix(in oklch, var(--text-1) 50%, transparent);--tooltip-radius: 3px;--tooltip-max-width: min( calc(100vw - 20px) , 80ch);--tooltip-border: none;--tooltip-backdrop-filter: blur(8px)}a-tooltip[round]{--tooltip-radius: attr(round type(<length>), 20px)}.dark a-tooltip{--tooltip-bg: color-mix(in oklch, var(--bg-1) 70%, transparent);--tooltip-shadow: 0 2px 16px color-mix(in oklch, black 70%, transparent), inset 0 0 0 1px color-mix(in oklch, white 15%, transparent)}@media(forced-colors:active){a-tooltip{--tooltip-border: 1px dotted CanvasText}}}a-tooltip>p:last-child,a-tooltip>:not([slot])>p:last-child{margin-block-end:0}

package/dist/elements/a-tooltip.d.ts

@@ -64,6 +64,13 @@ export declare class ATooltipElement extends HTMLElementBase {
      *  fed the latest cursor event, so it shows at the cursor and so moving back
      *  onto an anchor after the tooltip was dismissed re-arms it. */
     private makeDebouncedShow;
+    private hasExplicitTextTooltip;
+    /** Text rendered by the anchor, excluding every tooltip's light-DOM content.
+     *  An automatic text tooltip has no light children itself, but nested custom
+     *  tooltips might; including their hidden content would produce a misleading
+     *  fallback string. */
+    private anchorText;
+    private syncAutomaticTextContent;
     /** The element whose overflow decides whether the tooltip shows: a
      *  `truncated-selector` resolved within the anchor wins; else the first of
      *  Anta's ellipsizing label parts inside the anchor; else the anchor itself
@@ -109,7 +116,7 @@ export declare class ATooltipElement extends HTMLElementBase {
     private position;
     /** Opacity for the inner bubble from the cursor's distance to the anchor rect
      *  (0 inside the rect): 1 within PROX_NEAR, a linear ramp to 0 at PROX_FAR.
-     *  Cursor-follow only — drives the "fade as you move away" behaviour. */
+     *  Cursor-follow only — drives the "fade as you move away" behavior. */
     private proximityOpacity;
     show: (e?: MouseEvent) => void;
     hide: () => void;

package/dist/elements/a-tooltip.js

@@ -13,6 +13,7 @@ const PROX_FAR = 100;
 const PROX_FADE_MS = 60;
 const ENTER_TOUCH_DELAY = 500;
 const TRUNCATING_PARTS = "a-tab-label, a-button-label";
+const AUTOMATIC_TEXT_TOOLTIP = "data-anta-text-tooltip";
 const LEAVE_TOUCH_DELAY = 1500;
 const TOUCH_SLOP = 10;
 let currentOpen = null;
@@ -45,16 +46,37 @@ function releaseOpen(el) {
     graceTimer = void 0;
   }, GRACE_MS);
 }
-const anchorToTooltip = /* @__PURE__ */ new WeakMap();
+const anchorToTooltips = /* @__PURE__ */ new WeakMap();
+function preferredTooltip(registry) {
+  let automatic;
+  let explicit;
+  for (const tooltip of registry.tooltips) {
+    if (tooltip.hasAttribute(AUTOMATIC_TEXT_TOOLTIP)) automatic = tooltip;
+    else explicit = tooltip;
+  }
+  return explicit ?? automatic;
+}
+function syncAnchorListeners(anchor, registry) {
+  const preferred = preferredTooltip(registry);
+  for (const tooltip of registry.tooltips) {
+    if (tooltip !== preferred) tooltip.teardownListeners();
+  }
+  if (!preferred || !registry.intersecting) {
+    preferred?.teardownListeners();
+    return;
+  }
+  requestAnimationFrame(() => {
+    const current = anchorToTooltips.get(anchor);
+    if (current !== registry || !current.intersecting || preferredTooltip(current) !== preferred) return;
+    preferred.setupListeners();
+  });
+}
 function handleIntersection(entries) {
   for (const entry of entries) {
-    const tooltip = anchorToTooltip.get(entry.target);
-    if (!tooltip) continue;
-    if (!tooltip.listening && entry.isIntersecting) {
-      requestAnimationFrame(() => tooltip.setupListeners());
-    } else if (tooltip.listening && !entry.isIntersecting) {
-      requestAnimationFrame(() => tooltip.teardownListeners());
-    }
+    const registry = anchorToTooltips.get(entry.target);
+    if (!registry) continue;
+    registry.intersecting = entry.isIntersecting;
+    syncAnchorListeners(entry.target, registry);
   }
 }
 const lazyObserver = typeof IntersectionObserver !== "undefined" ? new IntersectionObserver(handleIntersection, { root: null, rootMargin: "0px", threshold: 0 }) : null;
@@ -178,15 +200,26 @@ class ATooltipElement extends HTMLElementBase {
     const parent = this.parentElement;
     if (!parent) return;
     this.anchor = parent;
-    anchorToTooltip.set(parent, this);
-    lazyObserver?.observe(parent);
+    let registry = anchorToTooltips.get(parent);
+    if (!registry) {
+      registry = { tooltips: /* @__PURE__ */ new Set(), intersecting: false };
+      anchorToTooltips.set(parent, registry);
+      lazyObserver?.observe(parent);
+    }
+    registry.tooltips.add(this);
+    syncAnchorListeners(parent, registry);
   }
   disconnectedCallback() {
     this.cleanup();
     if (this.anchor) {
-      if (anchorToTooltip.get(this.anchor) === this) {
-        anchorToTooltip.delete(this.anchor);
+      const anchor = this.anchor;
+      const registry = anchorToTooltips.get(anchor);
+      registry?.tooltips.delete(this);
+      if (registry && registry.tooltips.size === 0) {
+        anchorToTooltips.delete(anchor);
         lazyObserver?.unobserve(this.anchor);
+      } else if (registry) {
+        syncAnchorListeners(anchor, registry);
       }
       this.anchor = null;
     }
@@ -228,6 +261,34 @@ class ATooltipElement extends HTMLElementBase {
   get #truncatedOnly() {
     return this.hasAttribute("truncated-only");
   }
+  /** JSX `<Text truncate>` emits an empty marked tooltip. It takes its content
+   * from the anchor, while a consumer-provided sibling tooltip takes precedence
+   * even when that sibling is empty. */
+  get #isAutomaticTextTooltip() {
+    return this.hasAttribute(AUTOMATIC_TEXT_TOOLTIP);
+  }
+  hasExplicitTextTooltip() {
+    const anchor = this.anchor;
+    if (!this.#isAutomaticTextTooltip || !anchor) return false;
+    return Array.from(anchor.children).some(
+      (child) => child !== this && child.localName === "a-tooltip" && !child.hasAttribute(AUTOMATIC_TEXT_TOOLTIP)
+    );
+  }
+  /** Text rendered by the anchor, excluding every tooltip's light-DOM content.
+   *  An automatic text tooltip has no light children itself, but nested custom
+   *  tooltips might; including their hidden content would produce a misleading
+   *  fallback string. */
+  anchorText() {
+    const read = (node) => {
+      if (node.nodeType === 3) return node.textContent ?? "";
+      if (node.nodeType === 1 && node.localName === "a-tooltip") return "";
+      return Array.from(node.childNodes).map(read).join("");
+    };
+    return this.anchor ? Array.from(this.anchor.childNodes).map(read).join("").trim() : "";
+  }
+  syncAutomaticTextContent() {
+    if (this.#isAutomaticTextTooltip) this.bubble.textContent = this.anchorText();
+  }
   /** The element whose overflow decides whether the tooltip shows: a
    *  `truncated-selector` resolved within the anchor wins; else the first of
    *  Anta's ellipsizing label parts inside the anchor; else the anchor itself
@@ -252,6 +313,8 @@ class ATooltipElement extends HTMLElementBase {
   isTargetTruncated() {
     const t = this.resolveTruncationTarget();
     if (!t) return false;
+    const reported = t.isTruncated;
+    if (typeof reported === "boolean") return reported;
     if (t.clientWidth === 0 && t.clientHeight === 0) return false;
     return t.scrollWidth - t.clientWidth > 1 || t.scrollHeight - t.clientHeight > 1;
   }
@@ -260,6 +323,7 @@ class ATooltipElement extends HTMLElementBase {
    *  (so formatting whitespace / an empty conditional doesn't open a blank bubble).
    *  Re-checked on every show(), so a tooltip populated later self-corrects. */
   isEmpty() {
+    if (this.#isAutomaticTextTooltip) return this.anchorText() === "";
     return this.children.length === 0 && (this.textContent ?? "").trim() === "";
   }
   /** While shown, watch the slotted content so a bubble whose content is
@@ -279,10 +343,16 @@ class ATooltipElement extends HTMLElementBase {
     if (typeof MutationObserver === "undefined") return;
     if (!this.contentObserver) {
       this.contentObserver = new MutationObserver(() => {
-        if (this.shown && this.isEmpty()) this.hide();
+        if (!this.shown) return;
+        this.syncAutomaticTextContent();
+        if (this.isEmpty()) this.hide();
       });
     }
-    this.contentObserver.observe(this, { childList: true, characterData: true, subtree: true });
+    this.contentObserver.observe(this.#isAutomaticTextTooltip ? this.anchor ?? this : this, {
+      childList: true,
+      characterData: true,
+      subtree: true
+    });
   }
   // --- positioning (sets only the shadow container's own transform) ---
   // Single pending position frame: a burst of mousemoves within one frame
@@ -341,7 +411,7 @@ class ATooltipElement extends HTMLElementBase {
   }
   /** Opacity for the inner bubble from the cursor's distance to the anchor rect
    *  (0 inside the rect): 1 within PROX_NEAR, a linear ramp to 0 at PROX_FAR.
-   *  Cursor-follow only — drives the "fade as you move away" behaviour. */
+   *  Cursor-follow only — drives the "fade as you move away" behavior. */
   proximityOpacity(e) {
     if (!this.anchor) return 1;
     const r = anchorRect(this.anchor);
@@ -356,8 +426,10 @@ class ATooltipElement extends HTMLElementBase {
   show = (e) => {
     if (!this.anchor) return;
     if (isMenuOpen() && !isInsideOpenMenu(this.anchor)) return;
+    if (this.hasExplicitTextTooltip()) return;
     if (this.isEmpty()) return;
     if (this.#truncatedOnly && !this.isTargetTruncated()) return;
+    this.syncAutomaticTextContent();
     this.cancelHide();
     if (currentOpen && currentOpen !== this && this.anchor.contains(currentOpen.anchor)) {
       return;
@@ -472,6 +544,7 @@ class ATooltipElement extends HTMLElementBase {
   /** Open now if another tooltip is hot (skip delay), else (re)arm the delayed
    *  show with the latest cursor event. */
   trigger(e) {
+    if (this.hasExplicitTextTooltip()) return;
     if (this.isEmpty()) return;
     if (this.#truncatedOnly && !this.isTargetTruncated()) return;
     if (isHot()) {

package/dist/elements/index.d.ts

@@ -6,7 +6,7 @@
  * set + injects every element's CSS. Importing this barrel for side effects —
  * `import '@antadesign/anta/elements'` — gives you everything.
  *
- * For a SMALLER footprint, import just the element(s) you use instead:
+ * To reduce bundle size, import only the element(s) you use:
  *   import '@antadesign/anta/elements/a-tooltip'   // registers a-tooltip + its CSS, nothing else
  * That granular path pulls in only that element's code and CSS, nothing else.
  *