@ds-mo/ui 11.0.0 → 11.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/.build-stamp +1 -1
- package/dist/agent-patterns.json +1 -1
- package/dist/agent.json +433 -20
- package/dist/angular/ds-button-filled.d.ts +1 -1
- package/dist/angular/ds-button-filled.js +3 -3
- package/dist/angular/ds-chart-donut.d.ts +1 -1
- package/dist/angular/ds-chart-donut.js +3 -3
- package/dist/components/ds-agent-response.js +1 -1
- package/dist/components/ds-bar-nav.js +1 -1
- package/dist/components/ds-button-filled.js +1 -1
- package/dist/components/ds-card-data-viz-donut.js +1 -1
- package/dist/components/ds-card-data-viz-donut.js.map +1 -1
- package/dist/components/ds-card-setting.js +1 -1
- package/dist/components/ds-chart-donut.js +1 -1
- package/dist/components/ds-chart-donut.js.map +1 -1
- package/dist/components/ds-chart-line.js +1 -1
- package/dist/components/ds-code-block.js +1 -1
- package/dist/components/ds-conversation-list-item.js +1 -1
- package/dist/components/ds-conversation-list-section.js +1 -1
- package/dist/components/ds-conversation-list.js +1 -1
- package/dist/components/ds-empty-state.js +1 -1
- package/dist/components/ds-field.js +1 -1
- package/dist/components/ds-markdown.js +1 -1
- package/dist/components/ds-menu.js +1 -1
- package/dist/components/ds-message-composer.js +1 -1
- package/dist/components/ds-message-composer.js.map +1 -1
- package/dist/components/ds-message-scroller.js +1 -1
- package/dist/components/ds-message.js +1 -1
- package/dist/components/ds-modal.js +1 -1
- package/dist/components/ds-modal.js.map +1 -1
- package/dist/components/ds-panel-nav.js +1 -1
- package/dist/components/ds-panel-tool-header.js +1 -1
- package/dist/components/ds-panel-tool-search.js +1 -1
- package/dist/components/ds-panel-tools.js +1 -1
- package/dist/components/ds-select-multi.js +1 -1
- package/dist/components/ds-select-multi.js.map +1 -1
- package/dist/components/ds-select.js +1 -1
- package/dist/components/ds-select.js.map +1 -1
- package/dist/components/ds-shell-gradient-picker.js +1 -1
- package/dist/components/ds-shell-gradient-picker.js.map +1 -1
- package/dist/components/ds-shell-gradient-swatch.js +1 -1
- package/dist/components/ds-swatch-picker.js +1 -1
- package/dist/components/ds-toast.js +1 -1
- package/dist/components/ds-toast.js.map +1 -1
- package/dist/components/ds-tooltip-data-viz.js +1 -1
- package/dist/components/ds-tooltip-data-viz.js.map +1 -1
- package/dist/components/ds-tooltip.js +1 -1
- package/dist/components/ds-typing-indicator.js +1 -1
- package/dist/components/p-BCCt2eT_.js +2 -0
- package/dist/components/{p-BMwnjAIq.js.map → p-BCCt2eT_.js.map} +1 -1
- package/dist/components/{p-CbckeueL.js → p-B_qVPsEU.js} +2 -2
- package/dist/components/p-BaZRP4Oo.js +2 -0
- package/dist/components/p-BaZRP4Oo.js.map +1 -0
- package/dist/components/p-Bet_UjML.js +2 -0
- package/dist/components/{p-C8e2A66f.js.map → p-Bet_UjML.js.map} +1 -1
- package/dist/components/p-BsnezUUC.js +2 -0
- package/dist/components/{p-C3nDIMX5.js.map → p-BsnezUUC.js.map} +1 -1
- package/dist/components/{p-Hw-HMjCk.js → p-C1K5QGUZ.js} +2 -2
- package/dist/components/p-CrwU83-g.js +2 -0
- package/dist/components/{p-C_0Q8Cnp.js.map → p-CrwU83-g.js.map} +1 -1
- package/dist/components/{p-M5pt9I13.js → p-CyoHRqy6.js} +2 -2
- package/dist/components/{p-bDx_rlLm.js → p-P_4vE1ub.js} +2 -2
- package/dist/components/p-ZTugT4as.js +2 -0
- package/dist/components/{p-DirD-b2y.js.map → p-ZTugT4as.js.map} +1 -1
- package/dist/components/p-bNpFhP5L.js +2 -0
- package/dist/components/p-bNpFhP5L.js.map +1 -0
- package/dist/docs/components.json +144 -6
- package/dist/mcp/cli.js +8 -12
- package/dist/mcp-data/registry/button-filled.json +38 -2
- package/dist/mcp-data/registry/card-data-viz-donut.json +73 -4
- package/dist/mcp-data/registry/chart-bar.json +67 -3
- package/dist/mcp-data/registry/chart-donut.json +94 -8
- package/dist/mcp-data/registry/chart-legend.json +73 -3
- package/dist/mcp-data/registry/chart-line.json +67 -3
- package/dist/mcp-data/registry/registry.json +432 -19
- package/dist/mcp-data/registry/tooltip-data-viz.json +68 -4
- package/dist/types/components/ButtonFilled/ButtonFilled.d.ts +9 -0
- package/dist/types/components/ButtonFilled/index.d.ts +1 -1
- package/dist/types/components/CardDataVizDonut/CardDataVizDonut.d.ts +1 -0
- package/dist/types/components/ChartDonut/ChartDonut.d.ts +12 -2
- package/dist/types/components/TooltipDataViz/TooltipDataViz.d.ts +3 -2
- package/dist/types/components.d.ts +47 -12
- package/package.json +1 -1
- package/dist/components/p-BHtg1fh3.js +0 -2
- package/dist/components/p-BHtg1fh3.js.map +0 -1
- package/dist/components/p-BMwnjAIq.js +0 -2
- package/dist/components/p-C3nDIMX5.js +0 -2
- package/dist/components/p-C8e2A66f.js +0 -2
- package/dist/components/p-CTFBf97-.js +0 -2
- package/dist/components/p-CTFBf97-.js.map +0 -1
- package/dist/components/p-C_0Q8Cnp.js +0 -2
- package/dist/components/p-DirD-b2y.js +0 -2
- /package/dist/components/{p-CbckeueL.js.map → p-B_qVPsEU.js.map} +0 -0
- /package/dist/components/{p-Hw-HMjCk.js.map → p-C1K5QGUZ.js.map} +0 -0
- /package/dist/components/{p-M5pt9I13.js.map → p-CyoHRqy6.js.map} +0 -0
- /package/dist/components/{p-bDx_rlLm.js.map → p-P_4vE1ub.js.map} +0 -0
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{p as t,H as s,h as e,a as i,t as a}from"./index.js";import{d as
|
|
1
|
+
import{p as t,H as s,h as e,a as i,t as a}from"./index.js";import{d as c}from"./p-CZZYGqKz.js";const n=()=>`.sc-ds-typing-indicator-h{display:block;width:100%;min-width:0;box-sizing:border-box}`;const o=t(class t extends s{constructor(t){super();if(t!==false){this.__registerHost()}this.label="Typing…"}render(){return e(i,{key:"6fd86fd7ac976f9cc47d1cd6a029ceadf5d37472",role:"status","aria-live":"polite","aria-atomic":"true"},e("ds-text",{key:"b546332fcfeffdc2ae94f0e0c1e2689a80171562",as:"span",variant:"text-body-small",color:"secondary",shimmer:true},this.label))}static get style(){return n()}},[2,"ds-typing-indicator",{label:[1]}]);function r(){if(typeof customElements==="undefined"){return}const t=["ds-typing-indicator","ds-text"];t.forEach((t=>{switch(t){case"ds-typing-indicator":if(!customElements.get(a(t))){customElements.define(a(t),o)}break;case"ds-text":if(!customElements.get(a(t))){c()}break}}))}r();const d=o;const f=r;export{d as DsTypingIndicator,f as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=ds-typing-indicator.js.map
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{p as t,H as i,h as s,a as o,t as n}from"./index.js";import{c as e}from"./p-B8C_yfLQ.js";import{d as r}from"./p-CZZYGqKz.js";import{b as a,T as d,r as h,a as l}from"./p-CrwU83-g.js";import{r as c}from"./p-BWUTr_XN.js";import{C as p}from"./p-Cx-ywr1e.js";const u=new Set(["⌘","⇧","⌥","⌃"]);const m={alt:"⌥",cmd:"⌘",command:"⌘",control:"⌃",ctrl:"⌃",option:"⌥",shift:"⇧"};function f(t){return m[t.toLowerCase()]??t}function g(t){const i=t.trim();if(!i)return[];if(i.includes("+")){return i.split("+").map((t=>t.trim())).filter(Boolean).map(f)}if(/\s/.test(i)){return i.split(/\s+/).filter(Boolean).map(f)}const s=Array.from(i);const o=[];while(s.length>1&&u.has(s[0])){o.push(s.shift())}o.push(s.join(""));return o}const v=()=>`.ds-control--md.sc-ds-tooltip-h,.ds-control--md.sc-ds-tooltip,.ds-control--sm.sc-ds-tooltip-h,.ds-control--sm.sc-ds-tooltip,.ds-control--xs.sc-ds-tooltip-h,.ds-control--xs.sc-ds-tooltip{--ds-control-radius:var(--dimension-radius-025)}.ds-control--md.sc-ds-tooltip-h,.ds-control--md.sc-ds-tooltip{--ds-control-height:var(--dimension-size-400);--ds-control-icon:var(--dimension-iconography-md);--ds-control-padding-inline:var(--dimension-space-075);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-050)}.ds-control--sm.sc-ds-tooltip-h,.ds-control--sm.sc-ds-tooltip{--ds-control-height:var(--dimension-size-300);--ds-control-icon:var(--dimension-iconography-sm);--ds-control-padding-inline:var(--dimension-space-050);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-025)}.ds-control--xs.sc-ds-tooltip-h,.ds-control--xs.sc-ds-tooltip{--ds-control-height:var(--dimension-size-200);--ds-control-icon:var(--dimension-iconography-xs);--ds-control-padding-inline:var(--dimension-space-025);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:0}.ds-control--md.sc-ds-tooltip-h,.ds-control--md.sc-ds-tooltip,.ds-control--sm.sc-ds-tooltip-h,.ds-control--sm.sc-ds-tooltip,.ds-control--xs.sc-ds-tooltip-h,.ds-control--xs.sc-ds-tooltip{--ds-control-radius:var(--dimension-radius-025)}.ds-control--md.sc-ds-tooltip-h,.ds-control--md.sc-ds-tooltip{--ds-control-height:var(--dimension-size-400);--ds-control-icon:var(--dimension-iconography-md);--ds-control-padding-inline:var(--dimension-space-075);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-050)}.ds-control--sm.sc-ds-tooltip-h,.ds-control--sm.sc-ds-tooltip{--ds-control-height:var(--dimension-size-300);--ds-control-icon:var(--dimension-iconography-sm);--ds-control-padding-inline:var(--dimension-space-050);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-025)}.ds-control--xs.sc-ds-tooltip-h,.ds-control--xs.sc-ds-tooltip{--ds-control-height:var(--dimension-size-200);--ds-control-icon:var(--dimension-iconography-xs);--ds-control-padding-inline:var(--dimension-space-025);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:0}.key-hint-group.sc-ds-tooltip{display:inline-flex;align-items:center;gap:var(--dimension-stroke-width-012);width:max-content;flex-shrink:0}.key-hint.sc-ds-tooltip{box-sizing:border-box;min-width:var(--ds-control-icon, var(--dimension-iconography-md));width:var(--ds-control-icon, var(--dimension-iconography-md));height:var(--ds-control-icon, var(--dimension-iconography-md));padding-inline:0;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;background-color:var(--color-background-secondary);border:var(--dimension-stroke-width-015) solid var(--color-border-tertiary);border-bottom-width:var(--dimension-stroke-width-025);border-radius:var(--dimension-radius-025);color:var(--color-foreground-secondary)}.key-hint--wide.sc-ds-tooltip{width:calc(var(--ds-control-icon, var(--dimension-iconography-md)) * 1.5)}.key-hint__label.sc-ds-tooltip{display:inline-flex;width:max-content;min-width:max-content;font-family:var(--typography-font-family);font-size:var(--typography-fontsize-xs);line-height:1;font-weight:var(--typography-weight-regular);letter-spacing:0;text-transform:uppercase;color:inherit}.ds-control--xs.sc-ds-tooltip .key-hint__label.sc-ds-tooltip{font-size:calc(var(--typography-fontsize-xs) * 0.78)}.tooltip-popup.sc-ds-tooltip{box-sizing:border-box;background-color:var(--color-background-primary);border-radius:var(--ds-control-radius, var(--dimension-radius-025));box-shadow:var(--effect-elevation-elevated-floating);white-space:nowrap;pointer-events:none;animation:tooltipFadeIn var(--effect-motion-short-2) forwards;will-change:transform;backface-visibility:hidden}.tooltip-popup--instant.sc-ds-tooltip{animation:none;opacity:1}.tooltip-popup--closing.sc-ds-tooltip{animation:tooltipFadeOut var(--effect-motion-short-3) forwards}.tooltip-inner.sc-ds-tooltip{box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));display:flex;align-items:center;gap:var(--ds-control-gap, var(--dimension-space-050));padding:0 var(--ds-control-padding-inline, var(--dimension-space-075))}.tooltip-inner.sc-ds-tooltip>ds-text.sc-ds-tooltip{flex-shrink:0;min-width:max-content;max-width:none;padding:0 var(--ds-control-label-inset, var(--dimension-space-025));color:var(--color-foreground-primary)}@keyframes tooltipFadeIn{from{opacity:0}to{opacity:1}}@keyframes tooltipFadeOut{from{opacity:1}to{opacity:0}}@media (prefers-reduced-motion: reduce){.tooltip-popup.sc-ds-tooltip,.tooltip-popup--instant.sc-ds-tooltip{animation:none;opacity:1}.tooltip-popup--closing.sc-ds-tooltip{animation:none;opacity:0}}`;const y={md:d.size400,sm:d.size300,xs:d.size200};let b=0;let x=0;let w=null;function C(t){const i=document.createElement("ds-text");i.as="span";i.variant=t.variant;i.emphasis=t.emphasis??false;i.color=t.color??"inherit";if(t.wrap)i.wrap=t.wrap;i.textContent=t.text;return i}function k(t){t.style.flexShrink="0";t.style.minWidth="max-content";t.style.maxWidth="none";t.style.padding="0 var(--ds-control-label-inset, var(--dimension-space-025))";t.style.color="var(--color-foreground-primary)"}const O=t(class t extends i{constructor(t){super();if(t!==false){this.__registerHost()}this.size="md";this.side="top";this.align="center";this.sideOffset=a.space050;this.alignOffset=0;this.delay=d.animationDelayMedium3;this.shortcutKeyPosition="end";this.tooltipId=`ds-tooltip-${++x}`;this.delayTimer=null;this.closeTimer=null;this.anchor=null;this.popupEl=null;this.positionObserver=null;this.anchorObserver=null;this.positionFrame=null;this.skipEnterAnimation=false;this.isOpen=false;this.lastInteractionWasKeyboard=false;this.pointerEnterHandler=t=>{if(t.pointerType==="touch")return;this.show()};this.pointerLeaveHandler=t=>{if(t.pointerType==="touch")return;this.hide()};this.pointerDownHandler=t=>{this.lastInteractionWasKeyboard=false;if(t.pointerType==="touch"&&(this.isOpen||this.popupEl))this.hideInstant()};this.keyDownHandler=()=>{this.lastInteractionWasKeyboard=true};this.focusHandler=()=>{if(this.lastInteractionWasKeyboard||this.anchor?.matches(":focus-visible"))this.show()};this.blurHandler=t=>{const i=t.relatedTarget;if(i&&this.anchor?.contains(i))return;this.hide()};this.scrollResizeHandler=()=>{if(this.positionFrame!==null)return;this.positionFrame=requestAnimationFrame((()=>{this.positionFrame=null;this.calculatePosition()}))};this.escapeHandler=t=>{if(t.key!=="Escape"||!this.isOpen)return;t.preventDefault();this.hide()};this.handleSlotChange=()=>{const t=this.el.querySelector("slot");const i=t?.assignedElements?.()[0]??this.el.firstElementChild;if(i===this.anchor)return;if(this.isOpen||this.popupEl)this.hideInstant();this.unbindAnchor();this.bindAnchor()}}componentDidLoad(){this.bindAnchor();this.anchorObserver=new MutationObserver((()=>this.handleSlotChange()));this.anchorObserver.observe(this.el,{childList:true})}disconnectedCallback(){if(w===this)w=null;this.anchorObserver?.disconnect();this.anchorObserver=null;this.unbindAnchor();this.clearTimers();this.destroyPopup()}onContentOrPositionChange(){if(!this.label?.trim()){if(this.isOpen||this.popupEl)this.hideInstant();return}if(!this.popupEl||!this.isOpen)return;this.renderPopupContent();this.schedulePosition()}get viewportPadPx(){return c(d.space050,d.space050)}get sideOffsetPx(){return c(this.sideOffset,d.space050)}get alignOffsetPx(){return c(this.alignOffset,0)}get hoverDelayMs(){return h(this.delay,d.animationDelayMedium3)}get instantReopenMs(){return h(d.animationDurationMedium1,d.animationDurationMedium1)}get fadeOutMs(){return l(d.motionShort3,d.animationDurationShort3)}get tooltipFallbackWidthPx(){return c(d.tooltipFallbackWidth,d.tooltipFallbackWidth)}get tooltipFallbackHeightPx(){const t=y[this.size];return c(t,t)}bindAnchor(){const t=this.el.querySelector("slot");const i=t?.assignedElements?.()??[];const s=i[0]??this.el.firstElementChild;if(!s||s===this.anchor)return;this.anchor=s;s.addEventListener("pointerenter",this.pointerEnterHandler);s.addEventListener("pointerleave",this.pointerLeaveHandler);s.addEventListener("pointerdown",this.pointerDownHandler);s.addEventListener("keydown",this.keyDownHandler);s.addEventListener("focusin",this.focusHandler);s.addEventListener("focusout",this.blurHandler)}unbindAnchor(){if(!this.anchor)return;this.unlinkDescribedBy();this.anchor.removeEventListener("pointerenter",this.pointerEnterHandler);this.anchor.removeEventListener("pointerleave",this.pointerLeaveHandler);this.anchor.removeEventListener("pointerdown",this.pointerDownHandler);this.anchor.removeEventListener("keydown",this.keyDownHandler);this.anchor.removeEventListener("focusin",this.focusHandler);this.anchor.removeEventListener("focusout",this.blurHandler);this.anchor=null}linkDescribedBy(){if(!this.anchor||!this.popupEl)return;const t=new Set((this.anchor.getAttribute("aria-describedby")??"").split(/\s+/).filter(Boolean));t.add(this.tooltipId);this.anchor.setAttribute("aria-describedby",Array.from(t).join(" "))}unlinkDescribedBy(){if(!this.anchor)return;const t=(this.anchor.getAttribute("aria-describedby")??"").split(/\s+/).filter((t=>t&&t!==this.tooltipId));if(t.length)this.anchor.setAttribute("aria-describedby",t.join(" "));else this.anchor.removeAttribute("aria-describedby")}clearTimers(){if(this.delayTimer){clearTimeout(this.delayTimer);this.delayTimer=null}if(this.closeTimer){clearTimeout(this.closeTimer);this.closeTimer=null}}setupOpenListeners(){window.addEventListener("scroll",this.scrollResizeHandler,true);window.addEventListener("resize",this.scrollResizeHandler);document.addEventListener("keydown",this.escapeHandler)}teardownOpenListeners(){window.removeEventListener("scroll",this.scrollResizeHandler,true);window.removeEventListener("resize",this.scrollResizeHandler);document.removeEventListener("keydown",this.escapeHandler);if(this.positionFrame!==null){cancelAnimationFrame(this.positionFrame);this.positionFrame=null}}destroyPopup(){this.teardownOpenListeners();this.positionObserver?.disconnect();this.positionObserver=null;this.unlinkDescribedBy();if(!this.popupEl)return;this.popupEl.remove();this.popupEl=null}schedulePosition(){if(!this.popupEl)return;const t=()=>{const t=this.popupEl?.querySelector(":scope > .tooltip-inner > ds-text");if(t instanceof i)k(t)};requestAnimationFrame((()=>{t();this.calculatePosition();requestAnimationFrame((()=>{t();this.calculatePosition()}))}));this.positionObserver?.disconnect();this.positionObserver=new ResizeObserver((()=>this.calculatePosition()));this.positionObserver.observe(this.popupEl);if(this.anchor)this.positionObserver.observe(this.anchor)}hideInstant(){this.clearTimers();b=Date.now();if(w===this)w=null;this.destroyPopup();this.isOpen=false;this.skipEnterAnimation=false}show(){if(!this.label?.trim())return;this.clearTimers();let t=Date.now()-b<this.instantReopenMs;if(w&&w!==this){w.hideInstant();t=true}w=this;this.skipEnterAnimation=t;if(t){this.mountPopup();return}this.delayTimer=setTimeout((()=>{this.delayTimer=null;if(!this.label?.trim())return;this.mountPopup()}),this.hoverDelayMs)}hide(){this.clearTimers();if(!this.popupEl&&!this.isOpen)return;b=Date.now();if(!this.popupEl){this.isOpen=false;return}this.popupEl.classList.remove("tooltip-popup--instant");this.popupEl.classList.add("tooltip-popup--closing");if(this.fadeOutMs===0){if(w===this)w=null;this.destroyPopup();this.isOpen=false;this.skipEnterAnimation=false;return}this.closeTimer=setTimeout((()=>{this.closeTimer=null;if(w===this)w=null;this.destroyPopup();this.isOpen=false;this.skipEnterAnimation=false}),this.fadeOutMs)}mountPopup(){if(!this.popupEl){const t=document.createElement("div");t.id=this.tooltipId;t.setAttribute("role","tooltip");t.className="tooltip-popup sc-ds-tooltip";Object.assign(t.style,{position:"fixed",left:"0",top:"0",zIndex:"var(--dimension-z-index-tooltip)",pointerEvents:"none"});document.body.appendChild(t);this.popupEl=t}this.setupOpenListeners();this.linkDescribedBy();this.popupEl.classList.toggle("tooltip-popup--instant",this.skipEnterAnimation);this.popupEl.classList.remove("tooltip-popup--closing");this.renderPopupContent();this.schedulePosition();this.isOpen=true}renderPopupContent(){if(!this.popupEl)return;const t=p[this.size];const i=this.size==="md"?"ds-control--md":this.size==="sm"?"ds-control--sm":"ds-control--xs";const s="sc-ds-tooltip";const o=document.createElement("div");o.className=`tooltip-inner ${i} ${s}`;const n=t=>{if(!this.shortcutKey||this.shortcutKeyPosition!==t)return;const i=document.createElement("span");i.className=`key-hint-group ${s}`;i.setAttribute("aria-hidden","true");for(const t of g(this.shortcutKey)){const o=document.createElement("span");const n=Array.from(t).length>1?" key-hint--wide":"";o.className=`key-hint${n} ${s}`;const e=document.createElement("span");e.className=`key-hint__label ${s}`;e.textContent=t;o.appendChild(e);i.appendChild(o)}o.appendChild(i)};n("start");const e=C({variant:t,wrap:"nowrap",text:this.label});k(e);o.appendChild(e);n("end");this.popupEl.replaceChildren(o)}calculatePosition(){if(!this.anchor||!this.popupEl)return;const t=this.popupEl;const i=this.anchor.getBoundingClientRect();const s=t.offsetWidth||this.tooltipFallbackWidthPx;const o=t.offsetHeight||this.tooltipFallbackHeightPx;const{x:n,y:r,resolvedSide:a}=e({anchorRect:i,popupWidth:s,popupHeight:o,side:this.side,align:this.align,sideOffsetPx:this.sideOffsetPx,alignOffsetPx:this.alignOffsetPx,viewportPadPx:this.viewportPadPx,viewportWidth:window.innerWidth,viewportHeight:window.innerHeight});t.dataset.side=a;t.style.transform=`translate(${Math.round(n)}px, ${Math.round(r)}px)`}render(){return s(o,{key:"a658f4fedd915acf28719181a6c0e36dfd3c3a84",style:{display:"contents"}},s("slot",{key:"56208e17b56f5dcff4e1b361957a7559964315c7",onSlotchange:this.handleSlotChange}))}get el(){return this}static get watchers(){return{label:[{onContentOrPositionChange:0}],size:[{onContentOrPositionChange:0}],side:[{onContentOrPositionChange:0}],align:[{onContentOrPositionChange:0}],sideOffset:[{onContentOrPositionChange:0}],alignOffset:[{onContentOrPositionChange:0}],shortcutKey:[{onContentOrPositionChange:0}],shortcutKeyPosition:[{onContentOrPositionChange:0}]}}static get style(){return v()}},[262,"ds-tooltip",{label:[1],size:[1],side:[1],align:[1],sideOffset:[8,"side-offset"],alignOffset:[8,"align-offset"],delay:[8],shortcutKey:[1,"shortcut-key"],shortcutKeyPosition:[1,"shortcut-key-position"]},undefined,{label:[{onContentOrPositionChange:0}],size:[{onContentOrPositionChange:0}],side:[{onContentOrPositionChange:0}],align:[{onContentOrPositionChange:0}],sideOffset:[{onContentOrPositionChange:0}],alignOffset:[{onContentOrPositionChange:0}],shortcutKey:[{onContentOrPositionChange:0}],shortcutKeyPosition:[{onContentOrPositionChange:0}]}]);function P(){if(typeof customElements==="undefined"){return}const t=["ds-tooltip","ds-text"];t.forEach((t=>{switch(t){case"ds-tooltip":if(!customElements.get(n(t))){customElements.define(n(t),O)}break;case"ds-text":if(!customElements.get(n(t))){r()}break}}))}P();export{O as T,P as d};
|
|
2
|
+
//# sourceMappingURL=p-BCCt2eT_.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["MODIFIER_GLYPHS","Set","MODIFIER_LABELS","alt","cmd","command","control","ctrl","option","shift","canonicalKeyLabel","label","toLowerCase","shortcutKeyLabels","shortcut","normalized","trim","includes","split","map","part","filter","Boolean","test","characters","Array","from","labels","length","has","push","join","tooltipCss","FALLBACK_HEIGHT","md","TOKEN_DEFAULTS","size400","sm","size300","xs","size200","lastDismissedAt","tooltipIdCounter","activeTooltip","createDsText","opts","el","document","createElement","as","variant","emphasis","color","wrap","textContent","text","styleTooltipLabel","style","flexShrink","minWidth","maxWidth","padding","Tooltip","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","size","side","align","sideOffset","TOKEN_CSS_LENGTHS","space050","alignOffset","delay","animationDelayMedium3","shortcutKeyPosition","tooltipId","delayTimer","closeTimer","anchor","popupEl","positionObserver","anchorObserver","positionFrame","skipEnterAnimation","isOpen","lastInteractionWasKeyboard","pointerEnterHandler","event","pointerType","show","pointerLeaveHandler","hide","pointerDownHandler","hideInstant","keyDownHandler","focusHandler","matches","blurHandler","e","next","relatedTarget","contains","scrollResizeHandler","requestAnimationFrame","calculatePosition","escapeHandler","key","preventDefault","handleSlotChange","slot","querySelector","assignedElements","firstElementChild","unbindAnchor","bindAnchor","componentDidLoad","MutationObserver","observe","childList","disconnectedCallback","disconnect","clearTimers","destroyPopup","onContentOrPositionChange","renderPopupContent","schedulePosition","viewportPadPx","resolveCssLengthPx","sideOffsetPx","alignOffsetPx","hoverDelayMs","resolveCssTimeMs","instantReopenMs","animationDurationMedium1","fadeOutMs","resolveMotionTimeMs","motionShort3","animationDurationShort3","tooltipFallbackWidthPx","tooltipFallbackWidth","tooltipFallbackHeightPx","token","slotted","child","addEventListener","unlinkDescribedBy","removeEventListener","linkDescribedBy","ids","getAttribute","add","setAttribute","id","removeAttribute","clearTimeout","setupOpenListeners","window","teardownOpenListeners","cancelAnimationFrame","remove","reapplyLabelStyles","ResizeObserver","Date","now","instant","mountPopup","setTimeout","classList","tip","className","Object","assign","position","left","top","zIndex","pointerEvents","body","appendChild","toggle","textVariant","CONTROL_TEXT_VARIANT","density","sc","inner","appendShortcut","shortcutKey","group","hint","wide","replaceChildren","a","getBoundingClientRect","tw","offsetWidth","th","offsetHeight","x","y","resolvedSide","computeTooltipPosition","anchorRect","popupWidth","popupHeight","viewportWidth","innerWidth","viewportHeight","innerHeight","dataset","transform","Math","round","render","h","Host","display","onSlotchange"],"sources":["src/wc/utils/shortcut-key.ts","src/wc/components/Tooltip/Tooltip.css?tag=ds-tooltip&encapsulation=scoped","src/wc/components/Tooltip/Tooltip.tsx"],"sourcesContent":["const MODIFIER_GLYPHS = new Set(['⌘', '⇧', '⌥', '⌃']);\nconst MODIFIER_LABELS: Readonly<Record<string, string>> = {\n alt: '⌥',\n cmd: '⌘',\n command: '⌘',\n control: '⌃',\n ctrl: '⌃',\n option: '⌥',\n shift: '⇧',\n};\n\nfunction canonicalKeyLabel(label: string): string {\n return MODIFIER_LABELS[label.toLowerCase()] ?? label;\n}\n\n/** Split a shortcut chord into the labels rendered on individual keycaps. */\nexport function shortcutKeyLabels(shortcut: string): string[] {\n const normalized = shortcut.trim();\n if (!normalized) return [];\n\n if (normalized.includes('+')) {\n return normalized.split('+').map(part => part.trim()).filter(Boolean).map(canonicalKeyLabel);\n }\n\n if (/\\s/.test(normalized)) {\n return normalized.split(/\\s+/).filter(Boolean).map(canonicalKeyLabel);\n }\n\n const characters = Array.from(normalized);\n const labels: string[] = [];\n while (characters.length > 1 && MODIFIER_GLYPHS.has(characters[0])) {\n labels.push(characters.shift()!);\n }\n labels.push(characters.join(''));\n return labels;\n}\n","@import '../../utils/control-density.css';\n@import '../../utils/key-hint.css';\n\n.tooltip-popup {\n box-sizing: border-box;\n background-color: var(--color-background-primary);\n border-radius: var(--ds-control-radius, var(--dimension-radius-025));\n box-shadow: var(--effect-elevation-elevated-floating);\n white-space: nowrap;\n pointer-events: none;\n animation: tooltipFadeIn var(--effect-motion-short-2) forwards;\n will-change: transform;\n backface-visibility: hidden;\n}\n\n/* Warm handoff between nearby triggers — no enter fade (avoids 20–100ms lag). */\n.tooltip-popup--instant {\n animation: none;\n opacity: 1;\n}\n\n.tooltip-popup--closing {\n animation: tooltipFadeOut var(--effect-motion-short-3) forwards;\n}\n\n/* Density: md / sm / xs via `.ds-control--*` on `.tooltip-inner`. */\n.tooltip-inner {\n box-sizing: border-box;\n height: var(--ds-control-height, var(--dimension-size-400));\n display: flex;\n align-items: center;\n gap: var(--ds-control-gap, var(--dimension-space-050));\n padding: 0 var(--ds-control-padding-inline, var(--dimension-space-075));\n}\n\n/*\n * Label layout lives on ds-text (metric-box + control label-inset).\n * NOTE: Stencil scopes this to `ds-text.sc-ds-tooltip`, but portaled\n * createElement ds-text loses that class when Text's <Host class> renders.\n * `renderPopupContent` therefore also sets these as inline styles.\n */\n.tooltip-inner > ds-text {\n flex-shrink: 0;\n min-width: max-content;\n max-width: none;\n padding: 0 var(--ds-control-label-inset, var(--dimension-space-025));\n color: var(--color-foreground-primary);\n}\n\n@keyframes tooltipFadeIn {\n from { opacity: 0; }\n to { opacity: 1; }\n}\n\n@keyframes tooltipFadeOut {\n from { opacity: 1; }\n to { opacity: 0; }\n}\n\n@media (prefers-reduced-motion: reduce) {\n .tooltip-popup,\n .tooltip-popup--instant {\n animation: none;\n opacity: 1;\n }\n\n .tooltip-popup--closing {\n animation: none;\n opacity: 0;\n }\n}\n","import { Component, Prop, Element, Watch, h, Host } from '@stencil/core';\nimport {\n CONTROL_TEXT_VARIANT,\n resolveCssLengthPx,\n resolveCssTimeMs,\n resolveMotionTimeMs,\n TOKEN_CSS_LENGTHS,\n TOKEN_DEFAULTS,\n} from '../../utils';\nimport type { TextVariant } from '../Text/text-types';\nimport { shortcutKeyLabels } from '../../utils/shortcut-key';\nimport { computeTooltipPosition } from './tooltip-position';\n// Side-effect: register `ds-text` — the portal builds it via createElement, not JSX.\nimport '../Text/Text';\n\nexport type TooltipSide = 'top' | 'right' | 'bottom' | 'left';\nexport type TooltipAlign = 'start' | 'center' | 'end';\nexport type TooltipSize = 'md' | 'sm' | 'xs';\n\nconst FALLBACK_HEIGHT: Record<TooltipSize, string> = {\n md: TOKEN_DEFAULTS.size400,\n sm: TOKEN_DEFAULTS.size300,\n xs: TOKEN_DEFAULTS.size200,\n};\n\nlet lastDismissedAt = 0;\nlet tooltipIdCounter = 0;\n/** Currently open tooltip — force-cleared on warm handoff so tips don't cross-fade. */\nlet activeTooltip: Tooltip | null = null;\n\ntype DsTextEl = HTMLElement & {\n as: string;\n variant: TextVariant;\n emphasis: boolean;\n color: string;\n wrap: string;\n};\n\nfunction createDsText(opts: {\n variant: TextVariant;\n emphasis?: boolean;\n color?: string;\n wrap?: 'wrap' | 'nowrap' | 'balance' | 'pretty';\n text: string;\n}): DsTextEl {\n const el = document.createElement('ds-text') as DsTextEl;\n el.as = 'span';\n el.variant = opts.variant;\n el.emphasis = opts.emphasis ?? false;\n el.color = opts.color ?? 'inherit';\n if (opts.wrap) el.wrap = opts.wrap;\n el.textContent = opts.text;\n return el;\n}\n\n/**\n * Control-density label styles for portaled ds-text.\n * Scoped CSS requires `sc-ds-tooltip` on the host, but Text's `<Host class>`\n * overwrites imperative className — so these must be inline to stick.\n */\nfunction styleTooltipLabel(el: HTMLElement) {\n el.style.flexShrink = '0';\n el.style.minWidth = 'max-content';\n el.style.maxWidth = 'none';\n el.style.padding = '0 var(--ds-control-label-inset, var(--dimension-space-025))';\n el.style.color = 'var(--color-foreground-primary)';\n}\n\n/**\n * Imperative body portal for the popup.\n * Stencil must not own the portaled node — moving a VDOM child to `document.body`\n * causes recreate → re-portal → @State loops that freeze the page.\n */\n@Component({\n tag: 'ds-tooltip',\n styleUrl: 'Tooltip.css',\n scoped: true,\n})\nexport class Tooltip {\n @Element() el!: HTMLElement;\n\n /**\n * Tooltip text. Empty/whitespace skips show — useful when the wrapper must stay\n * mounted for layout/animation stability (e.g. PanelNav expand/collapse).\n */\n @Prop() label!: string;\n\n /** Control density (height, padding, type). */\n @Prop() size: TooltipSize = 'md';\n\n @Prop() side: TooltipSide = 'top';\n @Prop() align: TooltipAlign = 'center';\n /** Gap between anchor and tooltip — number (px) or TokoMo length. */\n @Prop() sideOffset: number | string = TOKEN_CSS_LENGTHS.space050;\n /** Cross-axis offset — number (px) or TokoMo length. */\n @Prop() alignOffset: number | string = 0;\n /**\n * Hover show delay before the tooltip appears.\n * Default: `--effect-animation-delay-medium-3` (1000ms). Accepts a number (ms)\n * or a TokoMo time token / `var(--effect-animation-delay-*)`. Applies to the\n * initial hover/focus show only — after a recent dismiss, reopen is instant.\n * Prefer the default; override only for denser chrome or rare/destructive actions.\n */\n @Prop() delay: number | string = TOKEN_DEFAULTS.animationDelayMedium3;\n @Prop() shortcutKey: string | undefined;\n @Prop() shortcutKeyPosition: 'start' | 'end' = 'end';\n\n private tooltipId = `ds-tooltip-${++tooltipIdCounter}`;\n private delayTimer: ReturnType<typeof setTimeout> | null = null;\n private closeTimer: ReturnType<typeof setTimeout> | null = null;\n private anchor: HTMLElement | null = null;\n private popupEl: HTMLElement | null = null;\n private positionObserver: ResizeObserver | null = null;\n private anchorObserver: MutationObserver | null = null;\n private positionFrame: number | null = null;\n private skipEnterAnimation = false;\n private isOpen = false;\n private lastInteractionWasKeyboard = false;\n private pointerEnterHandler = (event: PointerEvent) => {\n if (event.pointerType === 'touch') return;\n this.show();\n };\n private pointerLeaveHandler = (event: PointerEvent) => {\n if (event.pointerType === 'touch') return;\n this.hide();\n };\n private pointerDownHandler = (event: PointerEvent) => {\n this.lastInteractionWasKeyboard = false;\n if (event.pointerType === 'touch' && (this.isOpen || this.popupEl)) this.hideInstant();\n };\n private keyDownHandler = () => {\n this.lastInteractionWasKeyboard = true;\n };\n /** focusin/focusout so nested focus targets (e.g. ds-button-* inner button) still open the tip. */\n private focusHandler = () => {\n if (this.lastInteractionWasKeyboard || this.anchor?.matches(':focus-visible')) this.show();\n };\n private blurHandler: (e: FocusEvent) => void = (e) => {\n const next = e.relatedTarget as Node | null;\n if (next && this.anchor?.contains(next)) return;\n this.hide();\n };\n private scrollResizeHandler = () => {\n if (this.positionFrame !== null) return;\n this.positionFrame = requestAnimationFrame(() => {\n this.positionFrame = null;\n this.calculatePosition();\n });\n };\n private escapeHandler = (event: KeyboardEvent) => {\n if (event.key !== 'Escape' || !this.isOpen) return;\n event.preventDefault();\n this.hide();\n };\n\n componentDidLoad() {\n this.bindAnchor();\n this.anchorObserver = new MutationObserver(() => this.handleSlotChange());\n this.anchorObserver.observe(this.el, { childList: true });\n }\n\n disconnectedCallback() {\n if (activeTooltip === this) activeTooltip = null;\n this.anchorObserver?.disconnect();\n this.anchorObserver = null;\n this.unbindAnchor();\n this.clearTimers();\n this.destroyPopup();\n }\n\n @Watch('label')\n @Watch('size')\n @Watch('side')\n @Watch('align')\n @Watch('sideOffset')\n @Watch('alignOffset')\n @Watch('shortcutKey')\n @Watch('shortcutKeyPosition')\n onContentOrPositionChange() {\n if (!this.label?.trim()) {\n if (this.isOpen || this.popupEl) this.hideInstant();\n return;\n }\n if (!this.popupEl || !this.isOpen) return;\n this.renderPopupContent();\n this.schedulePosition();\n }\n\n private get viewportPadPx(): number {\n return resolveCssLengthPx(TOKEN_DEFAULTS.space050, TOKEN_DEFAULTS.space050);\n }\n\n private get sideOffsetPx(): number {\n return resolveCssLengthPx(this.sideOffset, TOKEN_DEFAULTS.space050);\n }\n\n private get alignOffsetPx(): number {\n return resolveCssLengthPx(this.alignOffset, 0);\n }\n\n private get hoverDelayMs(): number {\n return resolveCssTimeMs(this.delay, TOKEN_DEFAULTS.animationDelayMedium3);\n }\n\n private get instantReopenMs(): number {\n return resolveCssTimeMs(\n TOKEN_DEFAULTS.animationDurationMedium1,\n TOKEN_DEFAULTS.animationDurationMedium1,\n );\n }\n\n private get fadeOutMs(): number {\n return resolveMotionTimeMs(TOKEN_DEFAULTS.motionShort3, TOKEN_DEFAULTS.animationDurationShort3);\n }\n\n private get tooltipFallbackWidthPx(): number {\n return resolveCssLengthPx(TOKEN_DEFAULTS.tooltipFallbackWidth, TOKEN_DEFAULTS.tooltipFallbackWidth);\n }\n\n private get tooltipFallbackHeightPx(): number {\n const token = FALLBACK_HEIGHT[this.size];\n return resolveCssLengthPx(token, token);\n }\n\n private bindAnchor() {\n const slot = this.el.querySelector('slot') as HTMLSlotElement | null;\n const slotted = slot?.assignedElements?.() ?? [];\n const child = (slotted[0] ?? this.el.firstElementChild) as HTMLElement | null;\n if (!child || child === this.anchor) return;\n this.anchor = child;\n child.addEventListener('pointerenter', this.pointerEnterHandler);\n child.addEventListener('pointerleave', this.pointerLeaveHandler);\n child.addEventListener('pointerdown', this.pointerDownHandler);\n child.addEventListener('keydown', this.keyDownHandler);\n child.addEventListener('focusin', this.focusHandler);\n child.addEventListener('focusout', this.blurHandler);\n }\n\n private unbindAnchor() {\n if (!this.anchor) return;\n this.unlinkDescribedBy();\n this.anchor.removeEventListener('pointerenter', this.pointerEnterHandler);\n this.anchor.removeEventListener('pointerleave', this.pointerLeaveHandler);\n this.anchor.removeEventListener('pointerdown', this.pointerDownHandler);\n this.anchor.removeEventListener('keydown', this.keyDownHandler);\n this.anchor.removeEventListener('focusin', this.focusHandler);\n this.anchor.removeEventListener('focusout', this.blurHandler);\n this.anchor = null;\n }\n\n private linkDescribedBy() {\n if (!this.anchor || !this.popupEl) return;\n const ids = new Set((this.anchor.getAttribute('aria-describedby') ?? '').split(/\\s+/).filter(Boolean));\n ids.add(this.tooltipId);\n this.anchor.setAttribute('aria-describedby', Array.from(ids).join(' '));\n }\n\n private unlinkDescribedBy() {\n if (!this.anchor) return;\n const ids = (this.anchor.getAttribute('aria-describedby') ?? '')\n .split(/\\s+/)\n .filter(id => id && id !== this.tooltipId);\n if (ids.length) this.anchor.setAttribute('aria-describedby', ids.join(' '));\n else this.anchor.removeAttribute('aria-describedby');\n }\n\n private handleSlotChange = () => {\n const slot = this.el.querySelector('slot') as HTMLSlotElement | null;\n const next = (slot?.assignedElements?.()[0] ?? this.el.firstElementChild) as HTMLElement | null;\n if (next === this.anchor) return;\n if (this.isOpen || this.popupEl) this.hideInstant();\n this.unbindAnchor();\n this.bindAnchor();\n };\n\n private clearTimers() {\n if (this.delayTimer) { clearTimeout(this.delayTimer); this.delayTimer = null; }\n if (this.closeTimer) { clearTimeout(this.closeTimer); this.closeTimer = null; }\n }\n\n private setupOpenListeners() {\n window.addEventListener('scroll', this.scrollResizeHandler, true);\n window.addEventListener('resize', this.scrollResizeHandler);\n document.addEventListener('keydown', this.escapeHandler);\n }\n\n private teardownOpenListeners() {\n window.removeEventListener('scroll', this.scrollResizeHandler, true);\n window.removeEventListener('resize', this.scrollResizeHandler);\n document.removeEventListener('keydown', this.escapeHandler);\n if (this.positionFrame !== null) {\n cancelAnimationFrame(this.positionFrame);\n this.positionFrame = null;\n }\n }\n\n private destroyPopup() {\n this.teardownOpenListeners();\n this.positionObserver?.disconnect();\n this.positionObserver = null;\n this.unlinkDescribedBy();\n if (!this.popupEl) return;\n this.popupEl.remove();\n this.popupEl = null;\n }\n\n /**\n * Position after `ds-text` upgrades and lays out. Measuring synchronously in\n * `mountPopup` reads a collapsed/fallback width and places left/right tips wrong.\n */\n private schedulePosition() {\n if (!this.popupEl) return;\n\n const reapplyLabelStyles = () => {\n const label = this.popupEl?.querySelector(':scope > .tooltip-inner > ds-text');\n if (label instanceof HTMLElement) styleTooltipLabel(label);\n };\n\n requestAnimationFrame(() => {\n reapplyLabelStyles();\n this.calculatePosition();\n requestAnimationFrame(() => {\n reapplyLabelStyles();\n this.calculatePosition();\n });\n });\n\n this.positionObserver?.disconnect();\n this.positionObserver = new ResizeObserver(() => this.calculatePosition());\n this.positionObserver.observe(this.popupEl);\n if (this.anchor) this.positionObserver.observe(this.anchor);\n }\n\n /** Drop the open tip immediately (warm handoff to another tooltip). */\n private hideInstant() {\n this.clearTimers();\n lastDismissedAt = Date.now();\n if (activeTooltip === this) activeTooltip = null;\n this.destroyPopup();\n this.isOpen = false;\n this.skipEnterAnimation = false;\n }\n\n private show() {\n // Empty label = wrapper present for DOM stability (e.g. PanelNav expand/collapse)\n // but no tip should appear.\n if (!this.label?.trim()) return;\n this.clearTimers();\n let instant = Date.now() - lastDismissedAt < this.instantReopenMs;\n if (activeTooltip && activeTooltip !== this) {\n activeTooltip.hideInstant();\n instant = true;\n }\n // eslint-disable-next-line @typescript-eslint/no-this-alias -- module singleton tracks the active instance\n activeTooltip = this;\n this.skipEnterAnimation = instant;\n if (instant) {\n this.mountPopup();\n return;\n }\n this.delayTimer = setTimeout(() => {\n this.delayTimer = null;\n if (!this.label?.trim()) return;\n this.mountPopup();\n }, this.hoverDelayMs);\n }\n\n private hide() {\n this.clearTimers();\n if (!this.popupEl && !this.isOpen) return;\n lastDismissedAt = Date.now();\n if (!this.popupEl) {\n this.isOpen = false;\n return;\n }\n this.popupEl.classList.remove('tooltip-popup--instant');\n this.popupEl.classList.add('tooltip-popup--closing');\n if (this.fadeOutMs === 0) {\n if (activeTooltip === this) activeTooltip = null;\n this.destroyPopup();\n this.isOpen = false;\n this.skipEnterAnimation = false;\n return;\n }\n this.closeTimer = setTimeout(() => {\n this.closeTimer = null;\n if (activeTooltip === this) activeTooltip = null;\n this.destroyPopup();\n this.isOpen = false;\n this.skipEnterAnimation = false;\n }, this.fadeOutMs);\n }\n\n private mountPopup() {\n if (!this.popupEl) {\n const tip = document.createElement('div');\n tip.id = this.tooltipId;\n tip.setAttribute('role', 'tooltip');\n // `sc-ds-tooltip` is required for Stencil scoped CSS to match outside the host.\n tip.className = 'tooltip-popup sc-ds-tooltip';\n Object.assign(tip.style, {\n position: 'fixed',\n left: '0',\n top: '0',\n zIndex: 'var(--dimension-z-index-tooltip)',\n pointerEvents: 'none',\n });\n document.body.appendChild(tip);\n this.popupEl = tip;\n }\n\n this.setupOpenListeners();\n this.linkDescribedBy();\n this.popupEl.classList.toggle('tooltip-popup--instant', this.skipEnterAnimation);\n this.popupEl.classList.remove('tooltip-popup--closing');\n this.renderPopupContent();\n this.schedulePosition();\n this.isOpen = true;\n }\n\n private renderPopupContent() {\n if (!this.popupEl) return;\n const textVariant = CONTROL_TEXT_VARIANT[this.size];\n const density =\n this.size === 'md' ? 'ds-control--md' : this.size === 'sm' ? 'ds-control--sm' : 'ds-control--xs';\n // Every layout node needs `sc-ds-tooltip` so scoped selectors (`.foo.sc-ds-tooltip`) match.\n const sc = 'sc-ds-tooltip';\n\n const inner = document.createElement('div');\n inner.className = `tooltip-inner ${density} ${sc}`;\n\n const appendShortcut = (position: 'start' | 'end') => {\n if (!this.shortcutKey || this.shortcutKeyPosition !== position) return;\n const group = document.createElement('span');\n group.className = `key-hint-group ${sc}`;\n group.setAttribute('aria-hidden', 'true');\n\n for (const label of shortcutKeyLabels(this.shortcutKey)) {\n const hint = document.createElement('span');\n const wide = Array.from(label).length > 1 ? ' key-hint--wide' : '';\n hint.className = `key-hint${wide} ${sc}`;\n const text = document.createElement('span');\n text.className = `key-hint__label ${sc}`;\n text.textContent = label;\n hint.appendChild(text);\n group.appendChild(hint);\n }\n inner.appendChild(group);\n };\n\n appendShortcut('start');\n\n // ds-text is the layout box (metric-box + 2px control label-inset).\n // Inline styles required — see styleTooltipLabel.\n const label = createDsText({ variant: textVariant, wrap: 'nowrap', text: this.label });\n styleTooltipLabel(label);\n inner.appendChild(label);\n\n appendShortcut('end');\n\n this.popupEl.replaceChildren(inner);\n }\n\n private calculatePosition() {\n if (!this.anchor || !this.popupEl) return;\n const tip = this.popupEl;\n const a = this.anchor.getBoundingClientRect();\n const tw = tip.offsetWidth || this.tooltipFallbackWidthPx;\n const th = tip.offsetHeight || this.tooltipFallbackHeightPx;\n const { x, y, resolvedSide } = computeTooltipPosition({\n anchorRect: a,\n popupWidth: tw,\n popupHeight: th,\n side: this.side,\n align: this.align,\n sideOffsetPx: this.sideOffsetPx,\n alignOffsetPx: this.alignOffsetPx,\n viewportPadPx: this.viewportPadPx,\n viewportWidth: window.innerWidth,\n viewportHeight: window.innerHeight,\n });\n tip.dataset.side = resolvedSide;\n tip.style.transform = `translate(${Math.round(x)}px, ${Math.round(y)}px)`;\n }\n\n render() {\n return (\n <Host style={{ display: 'contents' }}>\n <slot onSlotchange={this.handleSlotChange} />\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"names":["MODIFIER_GLYPHS","Set","MODIFIER_LABELS","alt","cmd","command","control","ctrl","option","shift","canonicalKeyLabel","label","toLowerCase","shortcutKeyLabels","shortcut","normalized","trim","includes","split","map","part","filter","Boolean","test","characters","Array","from","labels","length","has","push","join","tooltipCss","FALLBACK_HEIGHT","md","TOKEN_DEFAULTS","size400","sm","size300","xs","size200","lastDismissedAt","tooltipIdCounter","activeTooltip","createDsText","opts","el","document","createElement","as","variant","emphasis","color","wrap","textContent","text","styleTooltipLabel","style","flexShrink","minWidth","maxWidth","padding","Tooltip","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","size","side","align","sideOffset","TOKEN_CSS_LENGTHS","space050","alignOffset","delay","animationDelayMedium3","shortcutKeyPosition","tooltipId","delayTimer","closeTimer","anchor","popupEl","positionObserver","anchorObserver","positionFrame","skipEnterAnimation","isOpen","lastInteractionWasKeyboard","pointerEnterHandler","event","pointerType","show","pointerLeaveHandler","hide","pointerDownHandler","hideInstant","keyDownHandler","focusHandler","matches","blurHandler","e","next","relatedTarget","contains","scrollResizeHandler","requestAnimationFrame","calculatePosition","escapeHandler","key","preventDefault","handleSlotChange","slot","querySelector","assignedElements","firstElementChild","unbindAnchor","bindAnchor","componentDidLoad","MutationObserver","observe","childList","disconnectedCallback","disconnect","clearTimers","destroyPopup","onContentOrPositionChange","renderPopupContent","schedulePosition","viewportPadPx","resolveCssLengthPx","sideOffsetPx","alignOffsetPx","hoverDelayMs","resolveCssTimeMs","instantReopenMs","animationDurationMedium1","fadeOutMs","resolveMotionTimeMs","motionShort3","animationDurationShort3","tooltipFallbackWidthPx","tooltipFallbackWidth","tooltipFallbackHeightPx","token","slotted","child","addEventListener","unlinkDescribedBy","removeEventListener","linkDescribedBy","ids","getAttribute","add","setAttribute","id","removeAttribute","clearTimeout","setupOpenListeners","window","teardownOpenListeners","cancelAnimationFrame","remove","reapplyLabelStyles","ResizeObserver","Date","now","instant","mountPopup","setTimeout","classList","tip","className","Object","assign","position","left","top","zIndex","pointerEvents","body","appendChild","toggle","textVariant","CONTROL_TEXT_VARIANT","density","sc","inner","appendShortcut","shortcutKey","group","hint","wide","replaceChildren","a","getBoundingClientRect","tw","offsetWidth","th","offsetHeight","x","y","resolvedSide","computeTooltipPosition","anchorRect","popupWidth","popupHeight","viewportWidth","innerWidth","viewportHeight","innerHeight","dataset","transform","Math","round","render","h","Host","display","onSlotchange"],"sources":["src/wc/utils/shortcut-key.ts","src/wc/components/Tooltip/Tooltip.css?tag=ds-tooltip&encapsulation=scoped","src/wc/components/Tooltip/Tooltip.tsx"],"sourcesContent":["const MODIFIER_GLYPHS = new Set(['⌘', '⇧', '⌥', '⌃']);\nconst MODIFIER_LABELS: Readonly<Record<string, string>> = {\n alt: '⌥',\n cmd: '⌘',\n command: '⌘',\n control: '⌃',\n ctrl: '⌃',\n option: '⌥',\n shift: '⇧',\n};\n\nfunction canonicalKeyLabel(label: string): string {\n return MODIFIER_LABELS[label.toLowerCase()] ?? label;\n}\n\n/** Split a shortcut chord into the labels rendered on individual keycaps. */\nexport function shortcutKeyLabels(shortcut: string): string[] {\n const normalized = shortcut.trim();\n if (!normalized) return [];\n\n if (normalized.includes('+')) {\n return normalized.split('+').map(part => part.trim()).filter(Boolean).map(canonicalKeyLabel);\n }\n\n if (/\\s/.test(normalized)) {\n return normalized.split(/\\s+/).filter(Boolean).map(canonicalKeyLabel);\n }\n\n const characters = Array.from(normalized);\n const labels: string[] = [];\n while (characters.length > 1 && MODIFIER_GLYPHS.has(characters[0])) {\n labels.push(characters.shift()!);\n }\n labels.push(characters.join(''));\n return labels;\n}\n","@import '../../utils/control-density.css';\n@import '../../utils/key-hint.css';\n\n.tooltip-popup {\n box-sizing: border-box;\n background-color: var(--color-background-primary);\n border-radius: var(--ds-control-radius, var(--dimension-radius-025));\n box-shadow: var(--effect-elevation-elevated-floating);\n white-space: nowrap;\n pointer-events: none;\n animation: tooltipFadeIn var(--effect-motion-short-2) forwards;\n will-change: transform;\n backface-visibility: hidden;\n}\n\n/* Warm handoff between nearby triggers — no enter fade (avoids 20–100ms lag). */\n.tooltip-popup--instant {\n animation: none;\n opacity: 1;\n}\n\n.tooltip-popup--closing {\n animation: tooltipFadeOut var(--effect-motion-short-3) forwards;\n}\n\n/* Density: md / sm / xs via `.ds-control--*` on `.tooltip-inner`. */\n.tooltip-inner {\n box-sizing: border-box;\n height: var(--ds-control-height, var(--dimension-size-400));\n display: flex;\n align-items: center;\n gap: var(--ds-control-gap, var(--dimension-space-050));\n padding: 0 var(--ds-control-padding-inline, var(--dimension-space-075));\n}\n\n/*\n * Label layout lives on ds-text (metric-box + control label-inset).\n * NOTE: Stencil scopes this to `ds-text.sc-ds-tooltip`, but portaled\n * createElement ds-text loses that class when Text's <Host class> renders.\n * `renderPopupContent` therefore also sets these as inline styles.\n */\n.tooltip-inner > ds-text {\n flex-shrink: 0;\n min-width: max-content;\n max-width: none;\n padding: 0 var(--ds-control-label-inset, var(--dimension-space-025));\n color: var(--color-foreground-primary);\n}\n\n@keyframes tooltipFadeIn {\n from { opacity: 0; }\n to { opacity: 1; }\n}\n\n@keyframes tooltipFadeOut {\n from { opacity: 1; }\n to { opacity: 0; }\n}\n\n@media (prefers-reduced-motion: reduce) {\n .tooltip-popup,\n .tooltip-popup--instant {\n animation: none;\n opacity: 1;\n }\n\n .tooltip-popup--closing {\n animation: none;\n opacity: 0;\n }\n}\n","import { Component, Prop, Element, Watch, h, Host } from '@stencil/core';\nimport {\n CONTROL_TEXT_VARIANT,\n resolveCssLengthPx,\n resolveCssTimeMs,\n resolveMotionTimeMs,\n TOKEN_CSS_LENGTHS,\n TOKEN_DEFAULTS,\n} from '../../utils';\nimport type { TextVariant } from '../Text/text-types';\nimport { shortcutKeyLabels } from '../../utils/shortcut-key';\nimport { computeTooltipPosition } from './tooltip-position';\n// Side-effect: register `ds-text` — the portal builds it via createElement, not JSX.\nimport '../Text/Text';\n\nexport type TooltipSide = 'top' | 'right' | 'bottom' | 'left';\nexport type TooltipAlign = 'start' | 'center' | 'end';\nexport type TooltipSize = 'md' | 'sm' | 'xs';\n\nconst FALLBACK_HEIGHT: Record<TooltipSize, string> = {\n md: TOKEN_DEFAULTS.size400,\n sm: TOKEN_DEFAULTS.size300,\n xs: TOKEN_DEFAULTS.size200,\n};\n\nlet lastDismissedAt = 0;\nlet tooltipIdCounter = 0;\n/** Currently open tooltip — force-cleared on warm handoff so tips don't cross-fade. */\nlet activeTooltip: Tooltip | null = null;\n\ntype DsTextEl = HTMLElement & {\n as: string;\n variant: TextVariant;\n emphasis: boolean;\n color: string;\n wrap: string;\n};\n\nfunction createDsText(opts: {\n variant: TextVariant;\n emphasis?: boolean;\n color?: string;\n wrap?: 'wrap' | 'nowrap' | 'balance' | 'pretty';\n text: string;\n}): DsTextEl {\n const el = document.createElement('ds-text') as DsTextEl;\n el.as = 'span';\n el.variant = opts.variant;\n el.emphasis = opts.emphasis ?? false;\n el.color = opts.color ?? 'inherit';\n if (opts.wrap) el.wrap = opts.wrap;\n el.textContent = opts.text;\n return el;\n}\n\n/**\n * Control-density label styles for portaled ds-text.\n * Scoped CSS requires `sc-ds-tooltip` on the host, but Text's `<Host class>`\n * overwrites imperative className — so these must be inline to stick.\n */\nfunction styleTooltipLabel(el: HTMLElement) {\n el.style.flexShrink = '0';\n el.style.minWidth = 'max-content';\n el.style.maxWidth = 'none';\n el.style.padding = '0 var(--ds-control-label-inset, var(--dimension-space-025))';\n el.style.color = 'var(--color-foreground-primary)';\n}\n\n/**\n * Imperative body portal for the popup.\n * Stencil must not own the portaled node — moving a VDOM child to `document.body`\n * causes recreate → re-portal → @State loops that freeze the page.\n */\n@Component({\n tag: 'ds-tooltip',\n styleUrl: 'Tooltip.css',\n scoped: true,\n})\nexport class Tooltip {\n @Element() el!: HTMLElement;\n\n /**\n * Tooltip text. Empty/whitespace skips show — useful when the wrapper must stay\n * mounted for layout/animation stability (e.g. PanelNav expand/collapse).\n */\n @Prop() label!: string;\n\n /** Control density (height, padding, type). */\n @Prop() size: TooltipSize = 'md';\n\n @Prop() side: TooltipSide = 'top';\n @Prop() align: TooltipAlign = 'center';\n /** Gap between anchor and tooltip — number (px) or TokoMo length. */\n @Prop() sideOffset: number | string = TOKEN_CSS_LENGTHS.space050;\n /** Cross-axis offset — number (px) or TokoMo length. */\n @Prop() alignOffset: number | string = 0;\n /**\n * Hover show delay before the tooltip appears.\n * Default: `--effect-animation-delay-medium-3` (1000ms). Accepts a number (ms)\n * or a TokoMo time token / `var(--effect-animation-delay-*)`. Applies to the\n * initial hover/focus show only — after a recent dismiss, reopen is instant.\n * Prefer the default; override only for denser chrome or rare/destructive actions.\n */\n @Prop() delay: number | string = TOKEN_DEFAULTS.animationDelayMedium3;\n @Prop() shortcutKey: string | undefined;\n @Prop() shortcutKeyPosition: 'start' | 'end' = 'end';\n\n private tooltipId = `ds-tooltip-${++tooltipIdCounter}`;\n private delayTimer: ReturnType<typeof setTimeout> | null = null;\n private closeTimer: ReturnType<typeof setTimeout> | null = null;\n private anchor: HTMLElement | null = null;\n private popupEl: HTMLElement | null = null;\n private positionObserver: ResizeObserver | null = null;\n private anchorObserver: MutationObserver | null = null;\n private positionFrame: number | null = null;\n private skipEnterAnimation = false;\n private isOpen = false;\n private lastInteractionWasKeyboard = false;\n private pointerEnterHandler = (event: PointerEvent) => {\n if (event.pointerType === 'touch') return;\n this.show();\n };\n private pointerLeaveHandler = (event: PointerEvent) => {\n if (event.pointerType === 'touch') return;\n this.hide();\n };\n private pointerDownHandler = (event: PointerEvent) => {\n this.lastInteractionWasKeyboard = false;\n if (event.pointerType === 'touch' && (this.isOpen || this.popupEl)) this.hideInstant();\n };\n private keyDownHandler = () => {\n this.lastInteractionWasKeyboard = true;\n };\n /** focusin/focusout so nested focus targets (e.g. ds-button-* inner button) still open the tip. */\n private focusHandler = () => {\n if (this.lastInteractionWasKeyboard || this.anchor?.matches(':focus-visible')) this.show();\n };\n private blurHandler: (e: FocusEvent) => void = (e) => {\n const next = e.relatedTarget as Node | null;\n if (next && this.anchor?.contains(next)) return;\n this.hide();\n };\n private scrollResizeHandler = () => {\n if (this.positionFrame !== null) return;\n this.positionFrame = requestAnimationFrame(() => {\n this.positionFrame = null;\n this.calculatePosition();\n });\n };\n private escapeHandler = (event: KeyboardEvent) => {\n if (event.key !== 'Escape' || !this.isOpen) return;\n event.preventDefault();\n this.hide();\n };\n\n componentDidLoad() {\n this.bindAnchor();\n this.anchorObserver = new MutationObserver(() => this.handleSlotChange());\n this.anchorObserver.observe(this.el, { childList: true });\n }\n\n disconnectedCallback() {\n if (activeTooltip === this) activeTooltip = null;\n this.anchorObserver?.disconnect();\n this.anchorObserver = null;\n this.unbindAnchor();\n this.clearTimers();\n this.destroyPopup();\n }\n\n @Watch('label')\n @Watch('size')\n @Watch('side')\n @Watch('align')\n @Watch('sideOffset')\n @Watch('alignOffset')\n @Watch('shortcutKey')\n @Watch('shortcutKeyPosition')\n onContentOrPositionChange() {\n if (!this.label?.trim()) {\n if (this.isOpen || this.popupEl) this.hideInstant();\n return;\n }\n if (!this.popupEl || !this.isOpen) return;\n this.renderPopupContent();\n this.schedulePosition();\n }\n\n private get viewportPadPx(): number {\n return resolveCssLengthPx(TOKEN_DEFAULTS.space050, TOKEN_DEFAULTS.space050);\n }\n\n private get sideOffsetPx(): number {\n return resolveCssLengthPx(this.sideOffset, TOKEN_DEFAULTS.space050);\n }\n\n private get alignOffsetPx(): number {\n return resolveCssLengthPx(this.alignOffset, 0);\n }\n\n private get hoverDelayMs(): number {\n return resolveCssTimeMs(this.delay, TOKEN_DEFAULTS.animationDelayMedium3);\n }\n\n private get instantReopenMs(): number {\n return resolveCssTimeMs(\n TOKEN_DEFAULTS.animationDurationMedium1,\n TOKEN_DEFAULTS.animationDurationMedium1,\n );\n }\n\n private get fadeOutMs(): number {\n return resolveMotionTimeMs(TOKEN_DEFAULTS.motionShort3, TOKEN_DEFAULTS.animationDurationShort3);\n }\n\n private get tooltipFallbackWidthPx(): number {\n return resolveCssLengthPx(TOKEN_DEFAULTS.tooltipFallbackWidth, TOKEN_DEFAULTS.tooltipFallbackWidth);\n }\n\n private get tooltipFallbackHeightPx(): number {\n const token = FALLBACK_HEIGHT[this.size];\n return resolveCssLengthPx(token, token);\n }\n\n private bindAnchor() {\n const slot = this.el.querySelector('slot') as HTMLSlotElement | null;\n const slotted = slot?.assignedElements?.() ?? [];\n const child = (slotted[0] ?? this.el.firstElementChild) as HTMLElement | null;\n if (!child || child === this.anchor) return;\n this.anchor = child;\n child.addEventListener('pointerenter', this.pointerEnterHandler);\n child.addEventListener('pointerleave', this.pointerLeaveHandler);\n child.addEventListener('pointerdown', this.pointerDownHandler);\n child.addEventListener('keydown', this.keyDownHandler);\n child.addEventListener('focusin', this.focusHandler);\n child.addEventListener('focusout', this.blurHandler);\n }\n\n private unbindAnchor() {\n if (!this.anchor) return;\n this.unlinkDescribedBy();\n this.anchor.removeEventListener('pointerenter', this.pointerEnterHandler);\n this.anchor.removeEventListener('pointerleave', this.pointerLeaveHandler);\n this.anchor.removeEventListener('pointerdown', this.pointerDownHandler);\n this.anchor.removeEventListener('keydown', this.keyDownHandler);\n this.anchor.removeEventListener('focusin', this.focusHandler);\n this.anchor.removeEventListener('focusout', this.blurHandler);\n this.anchor = null;\n }\n\n private linkDescribedBy() {\n if (!this.anchor || !this.popupEl) return;\n const ids = new Set((this.anchor.getAttribute('aria-describedby') ?? '').split(/\\s+/).filter(Boolean));\n ids.add(this.tooltipId);\n this.anchor.setAttribute('aria-describedby', Array.from(ids).join(' '));\n }\n\n private unlinkDescribedBy() {\n if (!this.anchor) return;\n const ids = (this.anchor.getAttribute('aria-describedby') ?? '')\n .split(/\\s+/)\n .filter(id => id && id !== this.tooltipId);\n if (ids.length) this.anchor.setAttribute('aria-describedby', ids.join(' '));\n else this.anchor.removeAttribute('aria-describedby');\n }\n\n private handleSlotChange = () => {\n const slot = this.el.querySelector('slot') as HTMLSlotElement | null;\n const next = (slot?.assignedElements?.()[0] ?? this.el.firstElementChild) as HTMLElement | null;\n if (next === this.anchor) return;\n if (this.isOpen || this.popupEl) this.hideInstant();\n this.unbindAnchor();\n this.bindAnchor();\n };\n\n private clearTimers() {\n if (this.delayTimer) { clearTimeout(this.delayTimer); this.delayTimer = null; }\n if (this.closeTimer) { clearTimeout(this.closeTimer); this.closeTimer = null; }\n }\n\n private setupOpenListeners() {\n window.addEventListener('scroll', this.scrollResizeHandler, true);\n window.addEventListener('resize', this.scrollResizeHandler);\n document.addEventListener('keydown', this.escapeHandler);\n }\n\n private teardownOpenListeners() {\n window.removeEventListener('scroll', this.scrollResizeHandler, true);\n window.removeEventListener('resize', this.scrollResizeHandler);\n document.removeEventListener('keydown', this.escapeHandler);\n if (this.positionFrame !== null) {\n cancelAnimationFrame(this.positionFrame);\n this.positionFrame = null;\n }\n }\n\n private destroyPopup() {\n this.teardownOpenListeners();\n this.positionObserver?.disconnect();\n this.positionObserver = null;\n this.unlinkDescribedBy();\n if (!this.popupEl) return;\n this.popupEl.remove();\n this.popupEl = null;\n }\n\n /**\n * Position after `ds-text` upgrades and lays out. Measuring synchronously in\n * `mountPopup` reads a collapsed/fallback width and places left/right tips wrong.\n */\n private schedulePosition() {\n if (!this.popupEl) return;\n\n const reapplyLabelStyles = () => {\n const label = this.popupEl?.querySelector(':scope > .tooltip-inner > ds-text');\n if (label instanceof HTMLElement) styleTooltipLabel(label);\n };\n\n requestAnimationFrame(() => {\n reapplyLabelStyles();\n this.calculatePosition();\n requestAnimationFrame(() => {\n reapplyLabelStyles();\n this.calculatePosition();\n });\n });\n\n this.positionObserver?.disconnect();\n this.positionObserver = new ResizeObserver(() => this.calculatePosition());\n this.positionObserver.observe(this.popupEl);\n if (this.anchor) this.positionObserver.observe(this.anchor);\n }\n\n /** Drop the open tip immediately (warm handoff to another tooltip). */\n private hideInstant() {\n this.clearTimers();\n lastDismissedAt = Date.now();\n if (activeTooltip === this) activeTooltip = null;\n this.destroyPopup();\n this.isOpen = false;\n this.skipEnterAnimation = false;\n }\n\n private show() {\n // Empty label = wrapper present for DOM stability (e.g. PanelNav expand/collapse)\n // but no tip should appear.\n if (!this.label?.trim()) return;\n this.clearTimers();\n let instant = Date.now() - lastDismissedAt < this.instantReopenMs;\n if (activeTooltip && activeTooltip !== this) {\n activeTooltip.hideInstant();\n instant = true;\n }\n // eslint-disable-next-line @typescript-eslint/no-this-alias -- module singleton tracks the active instance\n activeTooltip = this;\n this.skipEnterAnimation = instant;\n if (instant) {\n this.mountPopup();\n return;\n }\n this.delayTimer = setTimeout(() => {\n this.delayTimer = null;\n if (!this.label?.trim()) return;\n this.mountPopup();\n }, this.hoverDelayMs);\n }\n\n private hide() {\n this.clearTimers();\n if (!this.popupEl && !this.isOpen) return;\n lastDismissedAt = Date.now();\n if (!this.popupEl) {\n this.isOpen = false;\n return;\n }\n this.popupEl.classList.remove('tooltip-popup--instant');\n this.popupEl.classList.add('tooltip-popup--closing');\n if (this.fadeOutMs === 0) {\n if (activeTooltip === this) activeTooltip = null;\n this.destroyPopup();\n this.isOpen = false;\n this.skipEnterAnimation = false;\n return;\n }\n this.closeTimer = setTimeout(() => {\n this.closeTimer = null;\n if (activeTooltip === this) activeTooltip = null;\n this.destroyPopup();\n this.isOpen = false;\n this.skipEnterAnimation = false;\n }, this.fadeOutMs);\n }\n\n private mountPopup() {\n if (!this.popupEl) {\n const tip = document.createElement('div');\n tip.id = this.tooltipId;\n tip.setAttribute('role', 'tooltip');\n // `sc-ds-tooltip` is required for Stencil scoped CSS to match outside the host.\n tip.className = 'tooltip-popup sc-ds-tooltip';\n Object.assign(tip.style, {\n position: 'fixed',\n left: '0',\n top: '0',\n zIndex: 'var(--dimension-z-index-tooltip)',\n pointerEvents: 'none',\n });\n document.body.appendChild(tip);\n this.popupEl = tip;\n }\n\n this.setupOpenListeners();\n this.linkDescribedBy();\n this.popupEl.classList.toggle('tooltip-popup--instant', this.skipEnterAnimation);\n this.popupEl.classList.remove('tooltip-popup--closing');\n this.renderPopupContent();\n this.schedulePosition();\n this.isOpen = true;\n }\n\n private renderPopupContent() {\n if (!this.popupEl) return;\n const textVariant = CONTROL_TEXT_VARIANT[this.size];\n const density =\n this.size === 'md' ? 'ds-control--md' : this.size === 'sm' ? 'ds-control--sm' : 'ds-control--xs';\n // Every layout node needs `sc-ds-tooltip` so scoped selectors (`.foo.sc-ds-tooltip`) match.\n const sc = 'sc-ds-tooltip';\n\n const inner = document.createElement('div');\n inner.className = `tooltip-inner ${density} ${sc}`;\n\n const appendShortcut = (position: 'start' | 'end') => {\n if (!this.shortcutKey || this.shortcutKeyPosition !== position) return;\n const group = document.createElement('span');\n group.className = `key-hint-group ${sc}`;\n group.setAttribute('aria-hidden', 'true');\n\n for (const label of shortcutKeyLabels(this.shortcutKey)) {\n const hint = document.createElement('span');\n const wide = Array.from(label).length > 1 ? ' key-hint--wide' : '';\n hint.className = `key-hint${wide} ${sc}`;\n const text = document.createElement('span');\n text.className = `key-hint__label ${sc}`;\n text.textContent = label;\n hint.appendChild(text);\n group.appendChild(hint);\n }\n inner.appendChild(group);\n };\n\n appendShortcut('start');\n\n // ds-text is the layout box (metric-box + 2px control label-inset).\n // Inline styles required — see styleTooltipLabel.\n const label = createDsText({ variant: textVariant, wrap: 'nowrap', text: this.label });\n styleTooltipLabel(label);\n inner.appendChild(label);\n\n appendShortcut('end');\n\n this.popupEl.replaceChildren(inner);\n }\n\n private calculatePosition() {\n if (!this.anchor || !this.popupEl) return;\n const tip = this.popupEl;\n const a = this.anchor.getBoundingClientRect();\n const tw = tip.offsetWidth || this.tooltipFallbackWidthPx;\n const th = tip.offsetHeight || this.tooltipFallbackHeightPx;\n const { x, y, resolvedSide } = computeTooltipPosition({\n anchorRect: a,\n popupWidth: tw,\n popupHeight: th,\n side: this.side,\n align: this.align,\n sideOffsetPx: this.sideOffsetPx,\n alignOffsetPx: this.alignOffsetPx,\n viewportPadPx: this.viewportPadPx,\n viewportWidth: window.innerWidth,\n viewportHeight: window.innerHeight,\n });\n tip.dataset.side = resolvedSide;\n tip.style.transform = `translate(${Math.round(x)}px, ${Math.round(y)}px)`;\n }\n\n render() {\n return (\n <Host style={{ display: 'contents' }}>\n <slot onSlotchange={this.handleSlotChange} />\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{p as e,H as s,h as r,a,t}from"./index.js";import{d as n}from"./p-DrDHC7V6.js";import{d as o}from"./p-DTqCBjUj.js";import{d}from"./p-
|
|
2
|
-
//# sourceMappingURL=p-
|
|
1
|
+
import{p as e,H as s,h as r,a,t}from"./index.js";import{d as n}from"./p-DrDHC7V6.js";import{d as o}from"./p-DTqCBjUj.js";import{d}from"./p-C1K5QGUZ.js";import{d as i}from"./p-DuNZGFkV.js";import{d as c}from"./p-Cpr3K41-.js";import{d as l}from"./p-CZZYGqKz.js";const m=()=>`.sc-ds-markdown-h{display:block;min-width:0;color:inherit;box-sizing:border-box;-webkit-user-select:text;user-select:text}.markdown.sc-ds-markdown{min-width:0;font-family:var(--typography-font-family);font-size:var(--typography-fontsize-md);line-height:var(--typography-lineheight-md);font-weight:var(--typography-weight-regular);letter-spacing:var(--typography-letterspacing-negative-half);overflow-wrap:anywhere}.markdown.sc-ds-markdown>.sc-ds-markdown:first-child{margin-top:0}.markdown.sc-ds-markdown>.sc-ds-markdown:last-child{margin-bottom:0}p.sc-ds-markdown,ul.sc-ds-markdown,ol.sc-ds-markdown,blockquote.sc-ds-markdown,.markdown__table-wrap.sc-ds-markdown,ds-code-block.sc-ds-markdown{margin:0 0 var(--dimension-space-150)}h1.sc-ds-markdown,h2.sc-ds-markdown,h3.sc-ds-markdown,h4.sc-ds-markdown,h5.sc-ds-markdown,h6.sc-ds-markdown{margin:var(--dimension-space-200) 0 var(--dimension-space-100);color:var(--color-foreground-primary);font-family:var(--typography-font-family);font-weight:var(--typography-weight-semibold)}h1.sc-ds-markdown,h2.sc-ds-markdown{font-size:var(--typography-fontsize-xl);line-height:var(--typography-lineheight-xl)}h3.sc-ds-markdown,h4.sc-ds-markdown,h5.sc-ds-markdown,h6.sc-ds-markdown{font-size:var(--typography-fontsize-lg);line-height:var(--typography-lineheight-lg)}ul.sc-ds-markdown,ol.sc-ds-markdown{padding-left:var(--dimension-space-300)}li.sc-ds-markdown+li.sc-ds-markdown{margin-top:var(--dimension-space-050)}li.sc-ds-markdown>input.sc-ds-markdown{margin-right:var(--dimension-space-050)}blockquote.sc-ds-markdown{padding-left:var(--dimension-space-150);border-left:var(--dimension-stroke-width-025) solid var(--color-border-secondary);color:var(--color-foreground-secondary)}a.sc-ds-markdown{color:var(--color-foreground-brand);text-decoration:underline}code.sc-ds-markdown:not(ds-code-block code){padding:var(--dimension-space-012) var(--dimension-space-025);border-radius:var(--dimension-radius-025);background:var(--color-background-secondary);font-family:var(--typography-fontfamily-mono);font-size:var(--typography-fontsize-sm)}hr.sc-ds-markdown{margin:var(--dimension-space-200) 0;border:none;border-top:var(--dimension-stroke-width-012) solid var(--color-border-tertiary)}.markdown__table-wrap.sc-ds-markdown{overflow-x:auto}table.sc-ds-markdown{width:100%;border-collapse:collapse}th.sc-ds-markdown,td.sc-ds-markdown{padding:var(--dimension-space-075);border:var(--dimension-stroke-width-012) solid var(--color-border-tertiary);text-align:left;vertical-align:top}th.sc-ds-markdown{font-weight:var(--typography-weight-semibold)}`;let h;function k(){h??(h=Promise.all([import("./p-BjtXYFhw.js"),import("./p-DVsje4AY.js"),import("./p-gidVv1FX.js")]).then((([e,s,r])=>({fromMarkdown:e.fromMarkdown,gfmFromMarkdown:s.gfmFromMarkdown,gfm:r.gfm}))));return h}function f(e){if(!e)return undefined;try{const s=new URL(e,document.baseURI);if(!["http:","https:","mailto:"].includes(s.protocol))return undefined;return s.href}catch{return undefined}}const p=e(class e extends s{constructor(e){super();if(e!==false){this.__registerHost()}this.content="";this.streaming=false;this.tree=null;this.parseRevision=0}componentWillLoad(){if(typeof document!=="undefined")return this.parse()}disconnectedCallback(){this.parseRevision+=1;if(this.parseFrame&&typeof cancelAnimationFrame==="function"){cancelAnimationFrame(this.parseFrame)}}scheduleParse(){if(typeof requestAnimationFrame!=="function")return;if(this.parseFrame)cancelAnimationFrame(this.parseFrame);this.parseFrame=requestAnimationFrame((()=>{this.parseFrame=undefined;void this.parse()}))}async parse(){const e=++this.parseRevision;try{const{fromMarkdown:s,gfmFromMarkdown:r,gfm:a}=await k();const t=s(this.content,{extensions:[a()],mdastExtensions:[r()]});if(e===this.parseRevision)this.tree=t}catch{if(e===this.parseRevision)this.tree=null}}children(e){if(!("children"in e))return[];return e.children.map((e=>this.renderNode(e)))}renderNode(e){switch(e.type){case"root":return this.children(e);case"text":return r("span",{class:"markdown__text"},e.value);case"paragraph":return r("p",{class:"markdown__paragraph"},this.children(e));case"heading":{const s=`h${e.depth}`;return r(s,{class:"markdown__heading"},this.children(e))}case"strong":return r("strong",{class:"markdown__strong"},this.children(e));case"emphasis":return r("em",{class:"markdown__emphasis"},this.children(e));case"delete":return r("del",{class:"markdown__delete"},this.children(e));case"blockquote":return r("blockquote",{class:"markdown__blockquote"},this.children(e));case"break":return r("br",{class:"markdown__break"});case"thematicBreak":return r("hr",{class:"markdown__thematic-break"});case"inlineCode":return r("code",{class:"markdown__inline-code"},e.value);case"code":return r("ds-code-block",{class:"markdown__code-block",code:e.value,language:e.lang??"",filename:e.meta??""});case"link":{const s=f(e.url);return s?r("a",{class:"markdown__link",href:s,target:"_blank",rel:"noopener noreferrer"},this.children(e)):this.children(e)}case"list":{const s=e.ordered?"ol":"ul";return r(s,{class:"markdown__list",start:e.ordered&&e.start?e.start:undefined},this.children(e))}case"listItem":return r("li",{class:"markdown__list-item"},typeof e.checked==="boolean"?r("input",{class:"markdown__task-indicator",type:"checkbox",checked:e.checked,disabled:true,"aria-hidden":"true",tabIndex:-1}):null,this.children(e));case"table":{const[s,...a]=e.children;return r("div",{class:"markdown__table-wrap"},r("table",{class:"markdown__table"},s?r("thead",{class:"markdown__table-head"},r("tr",{class:"markdown__table-row"},s.children.map((e=>r("th",{class:"markdown__table-heading",scope:"col"},this.children(e)))))):null,r("tbody",{class:"markdown__table-body"},a.map((e=>this.renderNode(e))))))}case"tableRow":return r("tr",{class:"markdown__table-row"},this.children(e));case"tableCell":return r("td",{class:"markdown__table-cell"},this.children(e));case"image":{const s=f(e.url);return s?r("a",{class:"markdown__image-link",href:s,target:"_blank",rel:"noopener noreferrer"},e.alt||"View image"):e.alt||null}case"html":case"definition":case"footnoteDefinition":return null;case"footnoteReference":return r("sup",{class:"markdown__footnote"},e.label);default:return this.children(e)}}render(){return r(a,{key:"f5ba13a73c0291b35e5f279f7f53e9900df41e4f","aria-busy":this.streaming?"true":undefined},r("div",{key:"47ca7152c9e914018ae03af3fd68f40fda3855fb",class:"markdown"},this.tree?this.renderNode(this.tree):r("p",{class:"markdown__paragraph"},r("span",{class:"markdown__text"},this.content))))}static get watchers(){return{content:[{scheduleParse:0}]}}static get style(){return m()}},[2,"ds-markdown",{content:[1],streaming:[4],tree:[32]},undefined,{content:[{scheduleParse:0}]}]);function w(){if(typeof customElements==="undefined"){return}const e=["ds-markdown","ds-badge","ds-button-unfilled","ds-code-block","ds-icon","ds-loader","ds-text"];e.forEach((e=>{switch(e){case"ds-markdown":if(!customElements.get(t(e))){customElements.define(t(e),p)}break;case"ds-badge":if(!customElements.get(t(e))){n()}break;case"ds-button-unfilled":if(!customElements.get(t(e))){o()}break;case"ds-code-block":if(!customElements.get(t(e))){d()}break;case"ds-icon":if(!customElements.get(t(e))){i()}break;case"ds-loader":if(!customElements.get(t(e))){c()}break;case"ds-text":if(!customElements.get(t(e))){l()}break}}))}w();export{p as M,w as d};
|
|
2
|
+
//# sourceMappingURL=p-B_qVPsEU.js.map
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{p as t,H as o,c as n,h as i,a as d,t as e}from"./index.js";import{d as l}from"./p-DuNZGFkV.js";import{d as r}from"./p-Cpr3K41-.js";import{d as s}from"./p-CZZYGqKz.js";import{C as a}from"./p-Cx-ywr1e.js";import{c}from"./p-DuFm-ieS.js";const u=()=>`.sc-ds-button-filled-h{--ds-focus-ring-width:var(--dimension-stroke-width-025, 2px);--ds-focus-ring-offset:var(--dimension-space-025, 2px);--ds-focus-ring-color:var(--color-interaction-focus)}.ds-focus-ring.sc-ds-button-filled-h:focus-visible,.ds-focus-ring.sc-ds-button-filled:focus-visible{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:var(--ds-focus-ring-offset)}.ds-focus-ring.ds-focus-ring--visible.sc-ds-button-filled-h,.ds-focus-ring.ds-focus-ring--visible.sc-ds-button-filled{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:var(--ds-focus-ring-offset)}.ds-focus-ring-inset.sc-ds-button-filled-h:focus-visible,.ds-focus-ring-inset.sc-ds-button-filled:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-button-filled-h:focus-visible::after,.ds-focus-ring-inset.sc-ds-button-filled:focus-visible::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-button-filled-h,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-button-filled{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-button-filled-h::after,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-button-filled::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}.ds-interaction-fill.sc-ds-button-filled-h,.ds-interaction-fill.sc-ds-button-filled{position:relative;z-index:0;--ds-interaction-hover:var(--color-interaction-hover);--ds-interaction-pressed:var(--color-interaction-pressed);--ds-interaction-active:var(--color-interaction-active-brand);--ds-interaction-border-width:0px;--ds-interaction-border-color:transparent}.ds-interaction-fill.sc-ds-button-filled-h::before,.ds-interaction-fill.sc-ds-button-filled::before,.ds-interaction-fill.sc-ds-button-filled-h::after,.ds-interaction-fill.sc-ds-button-filled::after{content:'';position:absolute;inset:0;border-radius:inherit;background:transparent;pointer-events:none;transition:none}.ds-interaction-fill.sc-ds-button-filled-h::before,.ds-interaction-fill.sc-ds-button-filled::before{z-index:1}.ds-interaction-fill.sc-ds-button-filled-h::after,.ds-interaction-fill.sc-ds-button-filled::after{z-index:3;box-shadow:inset 0 0 0 var(--ds-interaction-border-width) var(--ds-interaction-border-color)}.ds-interaction-fill--bordered.sc-ds-button-filled-h,.ds-interaction-fill--bordered.sc-ds-button-filled{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--color-border-secondary)}.ds-interaction-fill--selected.sc-ds-button-filled-h::before,.ds-interaction-fill--selected.sc-ds-button-filled::before{background:var(--ds-interaction-active)}.ds-interaction-fill--selected.sc-ds-button-filled-h,.ds-interaction-fill--selected.sc-ds-button-filled{--ds-interaction-dot-ring:var(--ds-interaction-active)}.ds-interaction-fill.sc-ds-button-filled-h:hover:not(:disabled)::after,.ds-interaction-fill.sc-ds-button-filled:hover:not(:disabled)::after{background:var(--ds-interaction-hover)}.ds-interaction-fill.sc-ds-button-filled-h:active:not(:disabled)::after,.ds-interaction-fill.sc-ds-button-filled:active:not(:disabled)::after{background:var(--ds-interaction-pressed)}.ds-interaction-fill.sc-ds-button-filled-h>.ds-interaction-fill__content.sc-ds-button-filled,.ds-interaction-fill.sc-ds-button-filled>.ds-interaction-fill__content.sc-ds-button-filled,.ds-interaction-fill__content.sc-ds-button-filled{position:relative;z-index:2}.ds-interaction-fill--on-faint.sc-ds-button-filled-h,.ds-interaction-fill--on-faint.sc-ds-button-filled{--ds-interaction-active:var(--color-interaction-active)}.ds-interaction-fill--on-medium.sc-ds-button-filled-h,.ds-interaction-fill--on-medium.sc-ds-button-filled{--ds-interaction-hover:var(--color-interaction-on-medium-background-hover);--ds-interaction-pressed:var(--color-interaction-on-medium-background-pressed);--ds-interaction-active:var(--color-interaction-on-medium-background-active);--ds-focus-ring-color:var(--color-interaction-on-medium-background-focus)}.ds-interaction-fill--on-bold.sc-ds-button-filled-h,.ds-interaction-fill--on-bold.sc-ds-button-filled{--ds-interaction-hover:var(--color-interaction-on-bold-background-hover);--ds-interaction-pressed:var(--color-interaction-on-bold-background-pressed);--ds-interaction-active:var(--color-interaction-on-bold-background-active);--ds-focus-ring-color:var(--color-interaction-on-bold-background-focus)}.ds-interaction-fill--on-strong.sc-ds-button-filled-h,.ds-interaction-fill--on-strong.sc-ds-button-filled{--ds-interaction-hover:var(--color-interaction-on-strong-background-hover);--ds-interaction-pressed:var(--color-interaction-on-strong-background-pressed);--ds-interaction-active:var(--color-interaction-on-strong-background-active);--ds-focus-ring-color:var(--color-interaction-on-strong-background-focus)}.ds-interaction-fill--on-translucent.sc-ds-button-filled-h,.ds-interaction-fill--on-translucent.sc-ds-button-filled{--ds-interaction-hover:var(--color-translucent-interaction-hover);--ds-interaction-pressed:var(--color-translucent-interaction-pressed);--ds-interaction-active:var(--color-translucent-interaction-active);--ds-focus-ring-color:var(--color-translucent-interaction-focus)}.ds-interaction-fill--on-inverted.sc-ds-button-filled-h,.ds-interaction-fill--on-inverted.sc-ds-button-filled{--ds-interaction-hover:var(--color-inverted-interaction-hover);--ds-interaction-pressed:var(--color-inverted-interaction-pressed);--ds-interaction-active:var(--color-inverted-interaction-active);--ds-focus-ring-color:var(--color-inverted-interaction-focus)}.ds-interaction-fill--on-media.sc-ds-button-filled-h,.ds-interaction-fill--on-media.sc-ds-button-filled{--ds-interaction-hover:var(--color-media-interaction-hover);--ds-interaction-pressed:var(--color-media-interaction-pressed);--ds-interaction-active:var(--color-media-interaction-active);--ds-focus-ring-color:var(--color-media-interaction-focus)}.ds-interaction-fill--on-always-dark.sc-ds-button-filled-h,.ds-interaction-fill--on-always-dark.sc-ds-button-filled{--ds-interaction-hover:var(--color-always-dark-interaction-hover);--ds-interaction-pressed:var(--color-always-dark-interaction-pressed);--ds-interaction-active:var(--color-always-dark-interaction-active);--ds-focus-ring-color:var(--color-always-dark-interaction-focus)}.ds-interaction-fill--on-navigation.sc-ds-button-filled-h,.ds-interaction-fill--on-navigation.sc-ds-button-filled{--ds-interaction-hover:var(--color-navigation-interaction-hover);--ds-interaction-pressed:var(--color-navigation-interaction-pressed);--ds-interaction-active:var(--color-navigation-interaction-active);--ds-focus-ring-color:var(--color-navigation-interaction-focus)}.ds-control-inactive.sc-ds-button-filled-h,.ds-control-inactive.sc-ds-button-filled{opacity:0.25;pointer-events:none;cursor:not-allowed}.ds-control--md.sc-ds-button-filled-h,.ds-control--md.sc-ds-button-filled,.ds-control--sm.sc-ds-button-filled-h,.ds-control--sm.sc-ds-button-filled,.ds-control--xs.sc-ds-button-filled-h,.ds-control--xs.sc-ds-button-filled{--ds-control-radius:var(--dimension-radius-025)}.ds-control--md.sc-ds-button-filled-h,.ds-control--md.sc-ds-button-filled{--ds-control-height:var(--dimension-size-400);--ds-control-icon:var(--dimension-iconography-md);--ds-control-padding-inline:var(--dimension-space-075);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-050)}.ds-control--sm.sc-ds-button-filled-h,.ds-control--sm.sc-ds-button-filled{--ds-control-height:var(--dimension-size-300);--ds-control-icon:var(--dimension-iconography-sm);--ds-control-padding-inline:var(--dimension-space-050);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-025)}.ds-control--xs.sc-ds-button-filled-h,.ds-control--xs.sc-ds-button-filled{--ds-control-height:var(--dimension-size-200);--ds-control-icon:var(--dimension-iconography-xs);--ds-control-padding-inline:var(--dimension-space-025);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:0}.ds-control-width--hug.sc-ds-button-filled-h,.ds-control-width--hug.sc-ds-button-filled{width:fit-content;max-width:100%;flex:0 0 auto;align-self:flex-start}.ds-control-width--fill.sc-ds-button-filled-h,.ds-control-width--fill.sc-ds-button-filled{width:100%;min-width:0;flex:1 1 auto;align-self:stretch}.sc-ds-button-filled-h{display:inline-flex;outline:none;--ds-button-filled-bg:var(--color-background-bold-brand);--ds-button-filled-fg:var(--color-foreground-faint-brand);--ds-button-filled-border:var(--color-border-secondary)}.button-filled-host--icon.ds-control-width--hug.sc-ds-button-filled-h{width:var(--ds-control-height, var(--dimension-size-400));height:var(--ds-control-height, var(--dimension-size-400));min-width:var(--ds-control-height, var(--dimension-size-400));min-height:var(--ds-control-height, var(--dimension-size-400))}.button-filled-host--icon.ds-control-width--fill.sc-ds-button-filled-h{height:var(--ds-control-height, var(--dimension-size-400));min-height:var(--ds-control-height, var(--dimension-size-400))}.ds-control-width--fill.sc-ds-button-filled-h .button-filled.sc-ds-button-filled{width:100%}.button-filled.sc-ds-button-filled{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding:0 var(--ds-control-padding-inline, var(--dimension-space-075));gap:var(--ds-control-gap, var(--dimension-space-050));border:none;border-radius:var(--ds-control-radius, var(--dimension-radius-025));background-color:var(--ds-button-filled-bg);color:var(--ds-button-filled-fg);cursor:pointer;-webkit-user-select:none;user-select:none;overflow:hidden;transition:background-color var(--effect-motion-short-2), color var(--effect-motion-short-2), transform var(--effect-motion-short-2)}.button-filled--icon.sc-ds-button-filled{width:100%;height:100%;padding:0}.button-filled--rounded.sc-ds-button-filled{--ds-control-radius:var(--dimension-radius-half)}.button-filled--bordered.sc-ds-button-filled{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--ds-button-filled-border)}.button-filled--bordered.sc-ds-button-filled:not(.ds-interaction-fill){box-shadow:inset 0 0 0 var(--ds-interaction-border-width) var(--ds-interaction-border-color)}.button-filled--background-medium.sc-ds-button-filled{--ds-button-filled-border:var(--color-border-on-medium-background-secondary)}.button-filled--background-bold.sc-ds-button-filled{--ds-button-filled-border:var(--color-border-on-bold-background-secondary)}.button-filled--background-strong.sc-ds-button-filled{--ds-button-filled-border:var(--color-border-on-strong-background-secondary)}.button-filled--background-translucent.sc-ds-button-filled{--ds-button-filled-border:var(--color-translucent-border-secondary)}.button-filled--background-inverted.sc-ds-button-filled{--ds-button-filled-border:var(--color-inverted-border-secondary)}.button-filled--background-media.sc-ds-button-filled{--ds-button-filled-border:var(--color-media-border-secondary)}.button-filled--background-always-dark.sc-ds-button-filled{--ds-button-filled-border:var(--color-always-dark-border-secondary)}.button-filled.sc-ds-button-filled:active:not(:disabled):not(.ds-control-inactive){transform:scale(var(--dimension-scale-subtle))}@media (prefers-reduced-motion: reduce){.button-filled.sc-ds-button-filled{transition:background-color var(--effect-motion-short-2), color var(--effect-motion-short-2)}.button-filled.sc-ds-button-filled:active:not(:disabled):not(.ds-control-inactive){transform:none}}.button-filled__icon-wrap.sc-ds-button-filled{position:relative;width:var(--ds-control-icon, var(--dimension-iconography-md));height:var(--ds-control-icon, var(--dimension-iconography-md));display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;z-index:2}.button-filled__label.sc-ds-button-filled{position:relative;z-index:2;padding:0 var(--ds-control-label-inset, var(--dimension-space-025));white-space:nowrap;flex-shrink:0;min-width:0}.button-filled__label--loading.sc-ds-button-filled{visibility:hidden}.button-filled.sc-ds-button-filled>.button-filled__loader-overlay.sc-ds-button-filled{position:absolute;inset:0;z-index:2;display:flex;align-items:center;justify-content:center;pointer-events:none}.button-filled--intent-neutral.sc-ds-button-filled{--ds-button-filled-bg:var(--color-background-bold-neutral);--ds-button-filled-fg:var(--color-foreground-faint-neutral)}.button-filled--intent-brand.sc-ds-button-filled{--ds-button-filled-bg:var(--color-background-bold-brand);--ds-button-filled-fg:var(--color-foreground-faint-brand)}.button-filled--intent-ai.sc-ds-button-filled{--ds-button-filled-bg:var(--color-background-bold-ai);--ds-button-filled-fg:var(--color-foreground-faint-ai)}.button-filled--intent-negative.sc-ds-button-filled{--ds-button-filled-bg:var(--color-background-bold-negative);--ds-button-filled-fg:var(--color-foreground-faint-negative)}.button-filled--intent-warning.sc-ds-button-filled{--ds-button-filled-bg:var(--color-background-bold-warning);--ds-button-filled-fg:var(--color-foreground-faint-warning)}.button-filled--intent-caution.sc-ds-button-filled{--ds-button-filled-bg:var(--color-background-bold-caution);--ds-button-filled-fg:var(--color-foreground-faint-caution)}.button-filled--intent-positive.sc-ds-button-filled{--ds-button-filled-bg:var(--color-background-bold-positive);--ds-button-filled-fg:var(--color-foreground-faint-positive)}.button-filled--intent-guide.sc-ds-button-filled{--ds-button-filled-bg:var(--color-background-bold-guide);--ds-button-filled-fg:var(--color-foreground-faint-guide)}.button-filled--intent-walkthrough.sc-ds-button-filled{--ds-button-filled-bg:var(--color-background-bold-walkthrough);--ds-button-filled-fg:var(--color-foreground-faint-walkthrough)}.button-filled--contrast-strong.button-filled--intent-neutral.sc-ds-button-filled{--ds-button-filled-bg:var(--color-background-strong-neutral);--ds-button-filled-fg:var(--color-foreground-medium-neutral)}.button-filled--contrast-strong.button-filled--intent-brand.sc-ds-button-filled{--ds-button-filled-bg:var(--color-background-strong-brand);--ds-button-filled-fg:var(--color-foreground-medium-brand)}.button-filled--contrast-strong.button-filled--intent-ai.sc-ds-button-filled{--ds-button-filled-bg:var(--color-background-strong-ai);--ds-button-filled-fg:var(--color-foreground-medium-ai)}.button-filled--contrast-strong.button-filled--intent-negative.sc-ds-button-filled{--ds-button-filled-bg:var(--color-background-strong-negative);--ds-button-filled-fg:var(--color-foreground-medium-negative)}.button-filled--contrast-strong.button-filled--intent-warning.sc-ds-button-filled{--ds-button-filled-bg:var(--color-background-strong-warning);--ds-button-filled-fg:var(--color-foreground-medium-warning)}.button-filled--contrast-strong.button-filled--intent-caution.sc-ds-button-filled{--ds-button-filled-bg:var(--color-background-strong-caution);--ds-button-filled-fg:var(--color-foreground-medium-caution)}.button-filled--contrast-strong.button-filled--intent-positive.sc-ds-button-filled{--ds-button-filled-bg:var(--color-background-strong-positive);--ds-button-filled-fg:var(--color-foreground-medium-positive)}.button-filled--contrast-strong.button-filled--intent-guide.sc-ds-button-filled{--ds-button-filled-bg:var(--color-background-strong-guide);--ds-button-filled-fg:var(--color-foreground-medium-guide)}.button-filled--contrast-strong.button-filled--intent-walkthrough.sc-ds-button-filled{--ds-button-filled-bg:var(--color-background-strong-walkthrough);--ds-button-filled-fg:var(--color-foreground-medium-walkthrough)}.button-filled--contrast-medium.button-filled--intent-neutral.sc-ds-button-filled{--ds-button-filled-bg:var(--color-background-medium-neutral);--ds-button-filled-fg:var(--color-foreground-strong-neutral)}.button-filled--contrast-medium.button-filled--intent-brand.sc-ds-button-filled{--ds-button-filled-bg:var(--color-background-medium-brand);--ds-button-filled-fg:var(--color-foreground-strong-brand)}.button-filled--contrast-medium.button-filled--intent-ai.sc-ds-button-filled{--ds-button-filled-bg:var(--color-background-medium-ai);--ds-button-filled-fg:var(--color-foreground-strong-ai)}.button-filled--contrast-medium.button-filled--intent-negative.sc-ds-button-filled{--ds-button-filled-bg:var(--color-background-medium-negative);--ds-button-filled-fg:var(--color-foreground-strong-negative)}.button-filled--contrast-medium.button-filled--intent-warning.sc-ds-button-filled{--ds-button-filled-bg:var(--color-background-medium-warning);--ds-button-filled-fg:var(--color-foreground-strong-warning)}.button-filled--contrast-medium.button-filled--intent-caution.sc-ds-button-filled{--ds-button-filled-bg:var(--color-background-medium-caution);--ds-button-filled-fg:var(--color-foreground-strong-caution)}.button-filled--contrast-medium.button-filled--intent-positive.sc-ds-button-filled{--ds-button-filled-bg:var(--color-background-medium-positive);--ds-button-filled-fg:var(--color-foreground-strong-positive)}.button-filled--contrast-medium.button-filled--intent-guide.sc-ds-button-filled{--ds-button-filled-bg:var(--color-background-medium-guide);--ds-button-filled-fg:var(--color-foreground-strong-guide)}.button-filled--contrast-medium.button-filled--intent-walkthrough.sc-ds-button-filled{--ds-button-filled-bg:var(--color-background-medium-walkthrough);--ds-button-filled-fg:var(--color-foreground-strong-walkthrough)}.button-filled--contrast-faint.button-filled--intent-neutral.sc-ds-button-filled{--ds-button-filled-bg:var(--color-background-faint-neutral);--ds-button-filled-fg:var(--color-foreground-bold-neutral)}.button-filled--contrast-faint.button-filled--intent-brand.sc-ds-button-filled{--ds-button-filled-bg:var(--color-background-faint-brand);--ds-button-filled-fg:var(--color-foreground-bold-brand)}.button-filled--contrast-faint.button-filled--intent-ai.sc-ds-button-filled{--ds-button-filled-bg:var(--color-background-faint-ai);--ds-button-filled-fg:var(--color-foreground-bold-ai)}.button-filled--contrast-faint.button-filled--intent-negative.sc-ds-button-filled{--ds-button-filled-bg:var(--color-background-faint-negative);--ds-button-filled-fg:var(--color-foreground-bold-negative)}.button-filled--contrast-faint.button-filled--intent-warning.sc-ds-button-filled{--ds-button-filled-bg:var(--color-background-faint-warning);--ds-button-filled-fg:var(--color-foreground-bold-warning)}.button-filled--contrast-faint.button-filled--intent-caution.sc-ds-button-filled{--ds-button-filled-bg:var(--color-background-faint-caution);--ds-button-filled-fg:var(--color-foreground-bold-caution)}.button-filled--contrast-faint.button-filled--intent-positive.sc-ds-button-filled{--ds-button-filled-bg:var(--color-background-faint-positive);--ds-button-filled-fg:var(--color-foreground-bold-positive)}.button-filled--contrast-faint.button-filled--intent-guide.sc-ds-button-filled{--ds-button-filled-bg:var(--color-background-faint-guide);--ds-button-filled-fg:var(--color-foreground-bold-guide)}.button-filled--contrast-faint.button-filled--intent-walkthrough.sc-ds-button-filled{--ds-button-filled-bg:var(--color-background-faint-walkthrough);--ds-button-filled-fg:var(--color-foreground-bold-walkthrough)}`;const f={md:"md",sm:"sm",xs:"xs"};const b=t(class t extends o{constructor(t){super();if(t!==false){this.__registerHost()}this.dsClick=n(this,"dsClick");this.variant="label";this.size="md";this.width="hug";this.label="";this.icon="";this.intent="brand";this.contrast="bold";this.hasBorder=false;this.rounded=false;this.isInactive=false;this.isLoading=false;this.type="button";this.ariaLabel=null;this.buttonEl=null;this.handleClick=t=>{if(this.isInactive||this.isLoading){t.preventDefault();t.stopPropagation();return}this.dsClick.emit(t)}}async setFocus(){this.buttonEl?.focus()}get showIcon(){return this.variant==="icon"||this.variant==="icon-label"}get showLabel(){return this.variant==="label"||this.variant==="icon-label"}get accessibleName(){if(this.ariaLabel)return this.ariaLabel;if(this.isLoading&&this.variant==="label"&&this.label)return this.label;return undefined}render(){const t=a[this.size];const o=f[this.size];const n={"button-filled":true,"ds-focus-ring-inset":true,"ds-interaction-fill":!this.isInactive,"ds-interaction-fill--on-bold":this.contrast==="bold","ds-interaction-fill--on-strong":this.contrast==="strong","ds-interaction-fill--on-medium":this.contrast==="medium","button-filled--bordered":this.hasBorder,"ds-control-inactive":this.isInactive,"ds-control--md":this.size==="md","ds-control--sm":this.size==="sm","ds-control--xs":this.size==="xs","button-filled--icon":this.variant==="icon","button-filled--label":this.variant==="label","button-filled--icon-label":this.variant==="icon-label","button-filled--rounded":this.rounded,[`button-filled--background-${this.background}`]:this.background!==undefined,[`button-filled--intent-${this.intent}`]:true,[`button-filled--contrast-${this.contrast}`]:this.contrast!=="bold"};return i(d,{key:"8502f8fa87672e8f442310229405e1ff06bc28cb",class:{"button-filled-host":true,"button-filled-host--icon":this.variant==="icon","ds-control--md":this.size==="md","ds-control--sm":this.size==="sm","ds-control--xs":this.size==="xs",...c(this.width)},tabIndex:-1},i("button",{key:"560faba6cedb7365fa35305e01f721f9a25a0049",ref:t=>{this.buttonEl=t??null},type:this.type,class:n,disabled:this.isInactive,"aria-label":this.accessibleName,"aria-busy":this.isLoading?"true":undefined,"aria-disabled":this.isLoading?"true":undefined,onClick:this.handleClick},this.showIcon&&i("span",{key:"fcdd821f4b988c8142acccab1b5d3d9d3e47113c",class:"button-filled__icon-wrap ds-interaction-fill__content"},this.isLoading?i("ds-loader",{size:o,color:"inherit"}):i("ds-icon",{name:this.icon,size:o,color:"inherit"})),this.showLabel&&i("ds-text",{key:"0c7674e71cd390e991bd73a790fe799a6f844a0a",class:{"button-filled__label":true,"button-filled__label--loading":this.isLoading&&this.variant==="label","ds-interaction-fill__content":true},as:"span",variant:t,emphasis:true,color:"inherit"},this.label),this.isLoading&&this.variant==="label"&&i("span",{key:"673f5769fe4805415204de8ffdd88bb358ba7fdf",class:"button-filled__loader-overlay ds-interaction-fill__content"},i("ds-loader",{key:"5371500134496e92a8349ac1537e3f8e2e66751d",size:o,color:"inherit"}))))}get el(){return this}static get style(){return u()}},[2,"ds-button-filled",{variant:[1],size:[1],width:[1],label:[1],icon:[1],intent:[1],contrast:[1],hasBorder:[4,"has-border"],background:[1],rounded:[4],isInactive:[4,"is-inactive"],isLoading:[4,"is-loading"],type:[1],ariaLabel:[1,"aria-label"],setFocus:[64]}]);function g(){if(typeof customElements==="undefined"){return}const t=["ds-button-filled","ds-icon","ds-loader","ds-text"];t.forEach((t=>{switch(t){case"ds-button-filled":if(!customElements.get(e(t))){customElements.define(e(t),b)}break;case"ds-icon":if(!customElements.get(e(t))){l()}break;case"ds-loader":if(!customElements.get(e(t))){r()}break;case"ds-text":if(!customElements.get(e(t))){s()}break}}))}g();export{b as B,g as d};
|
|
2
|
+
//# sourceMappingURL=p-BaZRP4Oo.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["buttonFilledCss","ICON_SIZE","md","sm","xs","ButtonFilled","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","variant","size","width","label","icon","intent","contrast","hasBorder","rounded","isInactive","isLoading","type","ariaLabel","buttonEl","handleClick","event","preventDefault","stopPropagation","dsClick","emit","setFocus","focus","showIcon","showLabel","accessibleName","undefined","render","textVariant","CONTROL_TEXT_VARIANT","iconSize","cls","background","h","Host","key","class","controlWidthClass","tabIndex","ref","el","disabled","onClick","color","name","as","emphasis"],"sources":["src/wc/components/ButtonFilled/ButtonFilled.css?tag=ds-button-filled&encapsulation=scoped","src/wc/components/ButtonFilled/ButtonFilled.tsx"],"sourcesContent":["@import '../../utils/focus-ring.css';\n@import '../../utils/interaction-fill.css';\n@import '../../utils/control-inactive.css';\n@import '../../utils/control-density.css';\n@import '../../utils/control-width.css';\n\n:host {\n display: inline-flex;\n outline: none;\n --ds-button-filled-bg: var(--color-background-bold-brand);\n --ds-button-filled-fg: var(--color-foreground-faint-brand);\n --ds-button-filled-border: var(--color-border-secondary);\n}\n\n/* Icon-only: fixed square from density height (hug). Fill stretches the hit target. */\n:host(.button-filled-host--icon.ds-control-width--hug) {\n width: var(--ds-control-height, var(--dimension-size-400));\n height: var(--ds-control-height, var(--dimension-size-400));\n min-width: var(--ds-control-height, var(--dimension-size-400));\n min-height: var(--ds-control-height, var(--dimension-size-400));\n}\n\n:host(.button-filled-host--icon.ds-control-width--fill) {\n height: var(--ds-control-height, var(--dimension-size-400));\n min-height: var(--ds-control-height, var(--dimension-size-400));\n}\n\n:host(.ds-control-width--fill) .button-filled {\n width: 100%;\n}\n\n.button-filled {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n height: var(--ds-control-height, var(--dimension-size-400));\n padding: 0 var(--ds-control-padding-inline, var(--dimension-space-075));\n gap: var(--ds-control-gap, var(--dimension-space-050));\n border: none;\n border-radius: var(--ds-control-radius, var(--dimension-radius-025));\n background-color: var(--ds-button-filled-bg);\n color: var(--ds-button-filled-fg);\n cursor: pointer;\n -webkit-user-select: none;\n user-select: none;\n overflow: hidden;\n transition:\n background-color var(--effect-motion-short-2),\n color var(--effect-motion-short-2),\n transform var(--effect-motion-short-2);\n /* Hover/press: `.ds-interaction-fill` + contrast → `--on-*` (token overlay, not color-mix). */\n}\n\n.button-filled--icon {\n width: 100%;\n height: 100%;\n padding: 0;\n}\n\n.button-filled--rounded {\n --ds-control-radius: var(--dimension-radius-half);\n}\n\n/* Inset stroke via interaction-fill ::after (above hover and pressed washes). */\n.button-filled--bordered {\n --ds-interaction-border-width: var(--dimension-stroke-width-012);\n --ds-interaction-border-color: var(--ds-button-filled-border);\n}\n\n/* Preserve the border while inactive, when interaction-fill is intentionally omitted. */\n.button-filled--bordered:not(.ds-interaction-fill) {\n box-shadow: inset 0 0 0 var(--ds-interaction-border-width) var(--ds-interaction-border-color);\n}\n\n/*\n * Parent-surface context affects only the optional inset border.\n * Intent + contrast continue to own fill, foreground, and interaction overlays.\n */\n.button-filled--background-medium {\n --ds-button-filled-border: var(--color-border-on-medium-background-secondary);\n}\n\n.button-filled--background-bold {\n --ds-button-filled-border: var(--color-border-on-bold-background-secondary);\n}\n\n.button-filled--background-strong {\n --ds-button-filled-border: var(--color-border-on-strong-background-secondary);\n}\n\n.button-filled--background-translucent {\n --ds-button-filled-border: var(--color-translucent-border-secondary);\n}\n\n.button-filled--background-inverted {\n --ds-button-filled-border: var(--color-inverted-border-secondary);\n}\n\n.button-filled--background-media {\n --ds-button-filled-border: var(--color-media-border-secondary);\n}\n\n.button-filled--background-always-dark {\n --ds-button-filled-border: var(--color-always-dark-border-secondary);\n}\n\n.button-filled:active:not(:disabled):not(.ds-control-inactive) {\n transform: scale(var(--dimension-scale-subtle));\n}\n\n@media (prefers-reduced-motion: reduce) {\n .button-filled {\n transition:\n background-color var(--effect-motion-short-2),\n color var(--effect-motion-short-2);\n }\n\n .button-filled:active:not(:disabled):not(.ds-control-inactive) {\n transform: none;\n }\n}\n\n/* Inactive: `.ds-control-inactive` (25% opacity). */\n\n.button-filled__icon-wrap {\n position: relative;\n width: var(--ds-control-icon, var(--dimension-iconography-md));\n height: var(--ds-control-icon, var(--dimension-iconography-md));\n display: inline-flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n z-index: 2;\n}\n\n.button-filled__label {\n position: relative;\n z-index: 2;\n padding: 0 var(--ds-control-label-inset, var(--dimension-space-025));\n white-space: nowrap;\n flex-shrink: 0;\n min-width: 0;\n}\n\n.button-filled__label--loading {\n visibility: hidden;\n}\n\n.button-filled > .button-filled__loader-overlay {\n position: absolute;\n inset: 0;\n z-index: 2;\n display: flex;\n align-items: center;\n justify-content: center;\n pointer-events: none;\n}\n\n/* ── Intent + contrast (bold default) ─────────────────────────────────────── */\n\n.button-filled--intent-neutral {\n --ds-button-filled-bg: var(--color-background-bold-neutral);\n --ds-button-filled-fg: var(--color-foreground-faint-neutral);\n}\n\n.button-filled--intent-brand {\n --ds-button-filled-bg: var(--color-background-bold-brand);\n --ds-button-filled-fg: var(--color-foreground-faint-brand);\n}\n\n.button-filled--intent-ai {\n --ds-button-filled-bg: var(--color-background-bold-ai);\n --ds-button-filled-fg: var(--color-foreground-faint-ai);\n}\n\n.button-filled--intent-negative {\n --ds-button-filled-bg: var(--color-background-bold-negative);\n --ds-button-filled-fg: var(--color-foreground-faint-negative);\n}\n\n.button-filled--intent-warning {\n --ds-button-filled-bg: var(--color-background-bold-warning);\n --ds-button-filled-fg: var(--color-foreground-faint-warning);\n}\n\n.button-filled--intent-caution {\n --ds-button-filled-bg: var(--color-background-bold-caution);\n --ds-button-filled-fg: var(--color-foreground-faint-caution);\n}\n\n.button-filled--intent-positive {\n --ds-button-filled-bg: var(--color-background-bold-positive);\n --ds-button-filled-fg: var(--color-foreground-faint-positive);\n}\n\n.button-filled--intent-guide {\n --ds-button-filled-bg: var(--color-background-bold-guide);\n --ds-button-filled-fg: var(--color-foreground-faint-guide);\n}\n\n.button-filled--intent-walkthrough {\n --ds-button-filled-bg: var(--color-background-bold-walkthrough);\n --ds-button-filled-fg: var(--color-foreground-faint-walkthrough);\n}\n\n/* strong → medium fg */\n.button-filled--contrast-strong.button-filled--intent-neutral {\n --ds-button-filled-bg: var(--color-background-strong-neutral);\n --ds-button-filled-fg: var(--color-foreground-medium-neutral);\n}\n\n.button-filled--contrast-strong.button-filled--intent-brand {\n --ds-button-filled-bg: var(--color-background-strong-brand);\n --ds-button-filled-fg: var(--color-foreground-medium-brand);\n}\n\n.button-filled--contrast-strong.button-filled--intent-ai {\n --ds-button-filled-bg: var(--color-background-strong-ai);\n --ds-button-filled-fg: var(--color-foreground-medium-ai);\n}\n\n.button-filled--contrast-strong.button-filled--intent-negative {\n --ds-button-filled-bg: var(--color-background-strong-negative);\n --ds-button-filled-fg: var(--color-foreground-medium-negative);\n}\n\n.button-filled--contrast-strong.button-filled--intent-warning {\n --ds-button-filled-bg: var(--color-background-strong-warning);\n --ds-button-filled-fg: var(--color-foreground-medium-warning);\n}\n\n.button-filled--contrast-strong.button-filled--intent-caution {\n --ds-button-filled-bg: var(--color-background-strong-caution);\n --ds-button-filled-fg: var(--color-foreground-medium-caution);\n}\n\n.button-filled--contrast-strong.button-filled--intent-positive {\n --ds-button-filled-bg: var(--color-background-strong-positive);\n --ds-button-filled-fg: var(--color-foreground-medium-positive);\n}\n\n.button-filled--contrast-strong.button-filled--intent-guide {\n --ds-button-filled-bg: var(--color-background-strong-guide);\n --ds-button-filled-fg: var(--color-foreground-medium-guide);\n}\n\n.button-filled--contrast-strong.button-filled--intent-walkthrough {\n --ds-button-filled-bg: var(--color-background-strong-walkthrough);\n --ds-button-filled-fg: var(--color-foreground-medium-walkthrough);\n}\n\n/* medium → strong fg */\n.button-filled--contrast-medium.button-filled--intent-neutral {\n --ds-button-filled-bg: var(--color-background-medium-neutral);\n --ds-button-filled-fg: var(--color-foreground-strong-neutral);\n}\n\n.button-filled--contrast-medium.button-filled--intent-brand {\n --ds-button-filled-bg: var(--color-background-medium-brand);\n --ds-button-filled-fg: var(--color-foreground-strong-brand);\n}\n\n.button-filled--contrast-medium.button-filled--intent-ai {\n --ds-button-filled-bg: var(--color-background-medium-ai);\n --ds-button-filled-fg: var(--color-foreground-strong-ai);\n}\n\n.button-filled--contrast-medium.button-filled--intent-negative {\n --ds-button-filled-bg: var(--color-background-medium-negative);\n --ds-button-filled-fg: var(--color-foreground-strong-negative);\n}\n\n.button-filled--contrast-medium.button-filled--intent-warning {\n --ds-button-filled-bg: var(--color-background-medium-warning);\n --ds-button-filled-fg: var(--color-foreground-strong-warning);\n}\n\n.button-filled--contrast-medium.button-filled--intent-caution {\n --ds-button-filled-bg: var(--color-background-medium-caution);\n --ds-button-filled-fg: var(--color-foreground-strong-caution);\n}\n\n.button-filled--contrast-medium.button-filled--intent-positive {\n --ds-button-filled-bg: var(--color-background-medium-positive);\n --ds-button-filled-fg: var(--color-foreground-strong-positive);\n}\n\n.button-filled--contrast-medium.button-filled--intent-guide {\n --ds-button-filled-bg: var(--color-background-medium-guide);\n --ds-button-filled-fg: var(--color-foreground-strong-guide);\n}\n\n.button-filled--contrast-medium.button-filled--intent-walkthrough {\n --ds-button-filled-bg: var(--color-background-medium-walkthrough);\n --ds-button-filled-fg: var(--color-foreground-strong-walkthrough);\n}\n\n/* faint → bold fg */\n.button-filled--contrast-faint.button-filled--intent-neutral {\n --ds-button-filled-bg: var(--color-background-faint-neutral);\n --ds-button-filled-fg: var(--color-foreground-bold-neutral);\n}\n\n.button-filled--contrast-faint.button-filled--intent-brand {\n --ds-button-filled-bg: var(--color-background-faint-brand);\n --ds-button-filled-fg: var(--color-foreground-bold-brand);\n}\n\n.button-filled--contrast-faint.button-filled--intent-ai {\n --ds-button-filled-bg: var(--color-background-faint-ai);\n --ds-button-filled-fg: var(--color-foreground-bold-ai);\n}\n\n.button-filled--contrast-faint.button-filled--intent-negative {\n --ds-button-filled-bg: var(--color-background-faint-negative);\n --ds-button-filled-fg: var(--color-foreground-bold-negative);\n}\n\n.button-filled--contrast-faint.button-filled--intent-warning {\n --ds-button-filled-bg: var(--color-background-faint-warning);\n --ds-button-filled-fg: var(--color-foreground-bold-warning);\n}\n\n.button-filled--contrast-faint.button-filled--intent-caution {\n --ds-button-filled-bg: var(--color-background-faint-caution);\n --ds-button-filled-fg: var(--color-foreground-bold-caution);\n}\n\n.button-filled--contrast-faint.button-filled--intent-positive {\n --ds-button-filled-bg: var(--color-background-faint-positive);\n --ds-button-filled-fg: var(--color-foreground-bold-positive);\n}\n\n.button-filled--contrast-faint.button-filled--intent-guide {\n --ds-button-filled-bg: var(--color-background-faint-guide);\n --ds-button-filled-fg: var(--color-foreground-bold-guide);\n}\n\n.button-filled--contrast-faint.button-filled--intent-walkthrough {\n --ds-button-filled-bg: var(--color-background-faint-walkthrough);\n --ds-button-filled-fg: var(--color-foreground-bold-walkthrough);\n}\n","import { Component, Element, Event, EventEmitter, h, Host, Method, Prop } from '@stencil/core';\nimport { controlWidthClass, CONTROL_TEXT_VARIANT, type ControlWidth } from '../../utils';\nimport type { ChoiceBackground } from '../../utils/choice-list';\n\nexport type ButtonFilledIntent =\n | 'neutral'\n | 'brand'\n | 'ai'\n | 'negative'\n | 'warning'\n | 'caution'\n | 'positive'\n | 'guide'\n | 'walkthrough';\n\nexport type ButtonFilledContrast = 'bold' | 'strong' | 'medium' | 'faint';\n\nexport type ButtonFilledBackground = ChoiceBackground;\n\nexport type ButtonFilledVariant = 'icon' | 'label' | 'icon-label';\n\nexport type ButtonFilledSize = 'md' | 'sm' | 'xs';\n\nexport type ButtonFilledWidth = ControlWidth;\n\n/**\n * `ds-icon` size prop matching control-density icon metrics\n * (md→20 / sm→16 / xs→12 via `--dimension-iconography-*`).\n */\nconst ICON_SIZE: Record<ButtonFilledSize, 'md' | 'sm' | 'xs'> = {\n md: 'md',\n sm: 'sm',\n xs: 'xs',\n};\n\n@Component({\n tag: 'ds-button-filled',\n styleUrl: 'ButtonFilled.css',\n scoped: true,\n})\nexport class ButtonFilled {\n @Element() el!: HTMLElement;\n\n /**\n * Content layout. Default is label-only; pass `icon` for icon-only chrome\n * (nav / tool rails) or `icon-label` for leading icon + text.\n */\n @Prop() variant: ButtonFilledVariant = 'label';\n\n /** Control density (height, padding, icon, type). */\n @Prop() size: ButtonFilledSize = 'md';\n\n /** Width fit — hug content (default) or fill the parent. */\n @Prop() width: ButtonFilledWidth = 'hug';\n\n /** Visible text for `label` / `icon-label` variants. */\n @Prop() label: string = '';\n\n /** Icon name passed to <ds-icon> for `icon` / `icon-label` variants. */\n @Prop() icon: string = '';\n\n /** Semantic colour intent. */\n @Prop() intent: ButtonFilledIntent = 'brand';\n\n /**\n * Background fill weight. Foreground uses the paired contrast token:\n * bold → faint, strong → medium, medium → strong, faint → bold.\n */\n @Prop() contrast: ButtonFilledContrast = 'bold';\n\n /** Show a 1px secondary inset border. */\n @Prop() hasBorder: boolean = false;\n\n /**\n * Actual parent surface context for the optional inset border color only.\n * Omit on primary and secondary surfaces.\n */\n @Prop() background: ButtonFilledBackground | undefined;\n\n /** Use the half-radius treatment instead of the default control radius. */\n @Prop() rounded: boolean = false;\n\n /** Disables interaction. */\n @Prop() isInactive: boolean = false;\n\n /** Shows an inline loader and prevents interaction without applying inactive opacity. */\n @Prop() isLoading: boolean = false;\n\n /** Native button type. */\n @Prop() type: 'button' | 'submit' | 'reset' = 'button';\n\n /** Accessible name override. Required for icon-only buttons. */\n @Prop({ attribute: 'aria-label' }) ariaLabel: string | null = null;\n\n @Event() dsClick!: EventEmitter<MouseEvent>;\n\n private buttonEl: HTMLButtonElement | null = null;\n\n @Method()\n async setFocus() {\n this.buttonEl?.focus();\n }\n\n private handleClick = (event: MouseEvent) => {\n if (this.isInactive || this.isLoading) {\n event.preventDefault();\n event.stopPropagation();\n return;\n }\n this.dsClick.emit(event);\n };\n\n private get showIcon(): boolean {\n return this.variant === 'icon' || this.variant === 'icon-label';\n }\n\n private get showLabel(): boolean {\n return this.variant === 'label' || this.variant === 'icon-label';\n }\n\n private get accessibleName(): string | undefined {\n if (this.ariaLabel) return this.ariaLabel;\n if (this.isLoading && this.variant === 'label' && this.label) return this.label;\n return undefined;\n }\n\n render() {\n const textVariant = CONTROL_TEXT_VARIANT[this.size];\n const iconSize = ICON_SIZE[this.size];\n\n const cls: Record<string, boolean> = {\n 'button-filled': true,\n 'ds-focus-ring-inset': true,\n 'ds-interaction-fill': !this.isInactive,\n /* Bold is the default filled contrast — on-bold interaction tokens. */\n 'ds-interaction-fill--on-bold': this.contrast === 'bold',\n 'ds-interaction-fill--on-strong': this.contrast === 'strong',\n 'ds-interaction-fill--on-medium': this.contrast === 'medium',\n /* faint → default app interaction tokens (no --on-*). */\n 'button-filled--bordered': this.hasBorder,\n 'ds-control-inactive': this.isInactive,\n 'ds-control--md': this.size === 'md',\n 'ds-control--sm': this.size === 'sm',\n 'ds-control--xs': this.size === 'xs',\n 'button-filled--icon': this.variant === 'icon',\n 'button-filled--label': this.variant === 'label',\n 'button-filled--icon-label': this.variant === 'icon-label',\n 'button-filled--rounded': this.rounded,\n [`button-filled--background-${this.background}`]: this.background !== undefined,\n [`button-filled--intent-${this.intent}`]: true,\n [`button-filled--contrast-${this.contrast}`]: this.contrast !== 'bold',\n };\n\n return (\n <Host\n class={{\n 'button-filled-host': true,\n 'button-filled-host--icon': this.variant === 'icon',\n 'ds-control--md': this.size === 'md',\n 'ds-control--sm': this.size === 'sm',\n 'ds-control--xs': this.size === 'xs',\n ...controlWidthClass(this.width),\n }}\n tabIndex={-1}\n >\n <button\n ref={el => {\n this.buttonEl = el ?? null;\n }}\n type={this.type}\n class={cls}\n disabled={this.isInactive}\n aria-label={this.accessibleName}\n aria-busy={this.isLoading ? 'true' : undefined}\n aria-disabled={this.isLoading ? 'true' : undefined}\n onClick={this.handleClick}\n >\n {this.showIcon && (\n <span class=\"button-filled__icon-wrap ds-interaction-fill__content\">\n {this.isLoading\n ? <ds-loader size={iconSize} color=\"inherit\" />\n : <ds-icon name={this.icon} size={iconSize} color=\"inherit\" />\n }\n </span>\n )}\n {this.showLabel && (\n <ds-text\n class={{\n 'button-filled__label': true,\n 'button-filled__label--loading': this.isLoading && this.variant === 'label',\n 'ds-interaction-fill__content': true,\n }}\n as=\"span\"\n variant={textVariant}\n emphasis\n color=\"inherit\"\n >\n {this.label}\n </ds-text>\n )}\n {this.isLoading && this.variant === 'label' && (\n <span class=\"button-filled__loader-overlay ds-interaction-fill__content\">\n <ds-loader size={iconSize} color=\"inherit\" />\n </span>\n )}\n </button>\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{p as t,H as e,h as s,a,t as c}from"./index.js";import{d as i}from"./p-DuNZGFkV.js";import{d as n}from"./p-CZZYGqKz.js";const d=()=>`.sc-ds-empty-state-h{display:block;width:100%;height:100%}.sc-ds-empty-state-h,.empty-state.sc-ds-empty-state,.empty-state__text.sc-ds-empty-state{box-sizing:border-box}.empty-state.sc-ds-empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--dimension-space-100);height:100%;width:100%;text-align:center}.empty-state__icon.sc-ds-empty-state{flex:0 0 auto}.empty-state__text.sc-ds-empty-state{display:flex;flex-direction:column;align-items:center;gap:var(--dimension-space-050);width:100%}`;const o=t(class t extends e{constructor(t){super();if(t!==false){this.__registerHost()}this.body=""}render(){const t=Boolean(this.heading?.trim());const e=t&&Boolean(this.icon);return s(a,{key:"bd428cd5c903e852bbae7af1382bc9253641112c"},s("div",{key:"6948014af4060a838864650c98b0f4efc9ee1d63",class:"empty-state"},e&&s("ds-icon",{key:"afecf48851e2b00f2546b3d66c11fdbf093c36a4",class:"empty-state__icon",name:this.icon,size:"xl",color:"primary"}),s("div",{key:"4de87b87effcc013255c4f853f1c4610b50e2f45",class:"empty-state__text"},t&&s("ds-text",{key:"c3bb4643be38cff2cb1e2a8a6edb5b599d90b431",class:"empty-state__title",as:"div",variant:"text-title-small",color:"primary",align:"center"},this.heading),this.body&&s("ds-text",{key:"ff4bad5375ca4573beb176c00759a72ee499224d",class:"empty-state__body",as:"p",variant:"text-body-medium",color:"secondary",align:"center"},this.body))))}static get style(){return d()}},[2,"ds-empty-state",{icon:[1],heading:[1],body:[1]}]);function m(){if(typeof customElements==="undefined"){return}const t=["ds-empty-state","ds-icon","ds-text"];t.forEach((t=>{switch(t){case"ds-empty-state":if(!customElements.get(c(t))){customElements.define(c(t),o)}break;case"ds-icon":if(!customElements.get(c(t))){i()}break;case"ds-text":if(!customElements.get(c(t))){n()}break}}))}m();export{o as E,m as d};
|
|
2
|
+
//# sourceMappingURL=p-Bet_UjML.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["emptyStateCss","EmptyState","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","body","render","showHeading","Boolean","heading","trim","showIcon","icon","h","Host","key","class","name","size","color","as","variant","align"],"sources":["src/wc/components/EmptyState/EmptyState.css?tag=ds-empty-state&encapsulation=scoped","src/wc/components/EmptyState/EmptyState.tsx"],"sourcesContent":[":host {\n display: block;\n width: 100%;\n height: 100%;\n}\n\n:host,\n.empty-state,\n.empty-state__text {\n box-sizing: border-box;\n}\n\n.empty-state {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: var(--dimension-space-100);\n height: 100%;\n width: 100%;\n text-align: center;\n}\n\n.empty-state__icon {\n flex: 0 0 auto;\n}\n\n.empty-state__text {\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: var(--dimension-space-050);\n width: 100%;\n}\n","import { Component, Prop, h, Host } from '@stencil/core';\n\n@Component({\n tag: 'ds-empty-state',\n styleUrl: 'EmptyState.css',\n scoped: true,\n})\nexport class EmptyState {\n /** Optional decorative prefix glyph for the complete icon + title + body variant. */\n @Prop() icon: string | undefined;\n /** Optional visual title. Use with body; required when icon is provided. */\n @Prop() heading: string | undefined;\n /** Explanatory empty-state copy. Every supported variant includes body text. */\n @Prop() body: string = '';\n\n render() {\n const showHeading = Boolean(this.heading?.trim());\n const showIcon = showHeading && Boolean(this.icon);\n\n return (\n <Host>\n <div class=\"empty-state\">\n {showIcon && (\n <ds-icon\n class=\"empty-state__icon\"\n name={this.icon}\n size=\"xl\"\n color=\"primary\"\n />\n )}\n <div class=\"empty-state__text\">\n {showHeading && (\n <ds-text\n class=\"empty-state__title\"\n as=\"div\"\n variant=\"text-title-small\"\n color=\"primary\"\n align=\"center\"\n >\n {this.heading}\n </ds-text>\n )}\n {this.body && (\n <ds-text\n class=\"empty-state__body\"\n as=\"p\"\n variant=\"text-body-medium\"\n color=\"secondary\"\n align=\"center\"\n >\n {this.body}\n </ds-text>\n )}\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"
|
|
1
|
+
{"version":3,"names":["emptyStateCss","EmptyState","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","body","render","showHeading","Boolean","heading","trim","showIcon","icon","h","Host","key","class","name","size","color","as","variant","align"],"sources":["src/wc/components/EmptyState/EmptyState.css?tag=ds-empty-state&encapsulation=scoped","src/wc/components/EmptyState/EmptyState.tsx"],"sourcesContent":[":host {\n display: block;\n width: 100%;\n height: 100%;\n}\n\n:host,\n.empty-state,\n.empty-state__text {\n box-sizing: border-box;\n}\n\n.empty-state {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: var(--dimension-space-100);\n height: 100%;\n width: 100%;\n text-align: center;\n}\n\n.empty-state__icon {\n flex: 0 0 auto;\n}\n\n.empty-state__text {\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: var(--dimension-space-050);\n width: 100%;\n}\n","import { Component, Prop, h, Host } from '@stencil/core';\n\n@Component({\n tag: 'ds-empty-state',\n styleUrl: 'EmptyState.css',\n scoped: true,\n})\nexport class EmptyState {\n /** Optional decorative prefix glyph for the complete icon + title + body variant. */\n @Prop() icon: string | undefined;\n /** Optional visual title. Use with body; required when icon is provided. */\n @Prop() heading: string | undefined;\n /** Explanatory empty-state copy. Every supported variant includes body text. */\n @Prop() body: string = '';\n\n render() {\n const showHeading = Boolean(this.heading?.trim());\n const showIcon = showHeading && Boolean(this.icon);\n\n return (\n <Host>\n <div class=\"empty-state\">\n {showIcon && (\n <ds-icon\n class=\"empty-state__icon\"\n name={this.icon}\n size=\"xl\"\n color=\"primary\"\n />\n )}\n <div class=\"empty-state__text\">\n {showHeading && (\n <ds-text\n class=\"empty-state__title\"\n as=\"div\"\n variant=\"text-title-small\"\n color=\"primary\"\n align=\"center\"\n >\n {this.heading}\n </ds-text>\n )}\n {this.body && (\n <ds-text\n class=\"empty-state__body\"\n as=\"p\"\n variant=\"text-body-medium\"\n color=\"secondary\"\n align=\"center\"\n >\n {this.body}\n </ds-text>\n )}\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"8HAAA,MAAMA,EAAgB,IAAM,whB,MCOfC,EAAUC,EAAA,MAAAD,UAAAE,EALvB,WAAAC,CAAAC,G,4CAWUC,KAAAC,KAAe,EA6CxB,CA3CC,MAAAC,GACE,MAAMC,EAAcC,QAAQJ,KAAKK,SAASC,QAC1C,MAAMC,EAAWJ,GAAeC,QAAQJ,KAAKQ,MAE7C,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,OAAAE,IAAA,2CAAKC,MAAM,eACRL,GACCE,EAAA,WAAAE,IAAA,2CACEC,MAAM,oBACNC,KAAMb,KAAKQ,KACXM,KAAK,KACLC,MAAM,YAGVN,EAAA,OAAAE,IAAA,2CAAKC,MAAM,qBACRT,GACCM,EAAA,WAAAE,IAAA,2CACEC,MAAM,qBACNI,GAAG,MACHC,QAAQ,mBACRF,MAAM,UACNG,MAAM,UAELlB,KAAKK,SAGTL,KAAKC,MACJQ,EAAA,WAAAE,IAAA,2CACEC,MAAM,oBACNI,GAAG,IACHC,QAAQ,mBACRF,MAAM,YACNG,MAAM,UAELlB,KAAKC,Q","ignoreList":[]}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{p as i,H as e,c as s,h as n,a as t,t as o}from"./index.js";import{a as r,c,r as a}from"./p-l6PmnW_P.js";import{s as d}from"./p-D1HFMTdC.js";import{d as l}from"./p-DrDHC7V6.js";import{d as h}from"./p-P_4vE1ub.js";import{d as u}from"./p-CLn7QnE0.js";import{d as m}from"./p-CZZYGqKz.js";import{b as f,a as p,T as v}from"./p-CrwU83-g.js";import{r as g}from"./p-BWUTr_XN.js";const b=r;function x(i){return"variant"in i&&i.variant==="gradient-picker"}function w(i){return"variant"in i&&i.variant==="swatch-picker"}function _(i){return x(i)||w(i)}const y=()=>`.sc-ds-menu-h{--ds-focus-ring-width:var(--dimension-stroke-width-025, 2px);--ds-focus-ring-offset:var(--dimension-space-025, 2px);--ds-focus-ring-color:var(--color-interaction-focus)}.ds-focus-ring.sc-ds-menu-h:focus-visible,.ds-focus-ring.sc-ds-menu:focus-visible{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:var(--ds-focus-ring-offset)}.ds-focus-ring.ds-focus-ring--visible.sc-ds-menu-h,.ds-focus-ring.ds-focus-ring--visible.sc-ds-menu{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:var(--ds-focus-ring-offset)}.ds-focus-ring-inset.sc-ds-menu-h:focus-visible,.ds-focus-ring-inset.sc-ds-menu:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-menu-h:focus-visible::after,.ds-focus-ring-inset.sc-ds-menu:focus-visible::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-menu-h,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-menu{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-menu-h::after,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-menu::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}.ds-interaction-fill.sc-ds-menu-h,.ds-interaction-fill.sc-ds-menu{position:relative;z-index:0;--ds-interaction-hover:var(--color-interaction-hover);--ds-interaction-pressed:var(--color-interaction-pressed);--ds-interaction-active:var(--color-interaction-active-brand);--ds-interaction-border-width:0px;--ds-interaction-border-color:transparent}.ds-interaction-fill.sc-ds-menu-h::before,.ds-interaction-fill.sc-ds-menu::before,.ds-interaction-fill.sc-ds-menu-h::after,.ds-interaction-fill.sc-ds-menu::after{content:'';position:absolute;inset:0;border-radius:inherit;background:transparent;pointer-events:none;transition:none}.ds-interaction-fill.sc-ds-menu-h::before,.ds-interaction-fill.sc-ds-menu::before{z-index:1}.ds-interaction-fill.sc-ds-menu-h::after,.ds-interaction-fill.sc-ds-menu::after{z-index:3;box-shadow:inset 0 0 0 var(--ds-interaction-border-width) var(--ds-interaction-border-color)}.ds-interaction-fill--bordered.sc-ds-menu-h,.ds-interaction-fill--bordered.sc-ds-menu{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--color-border-secondary)}.ds-interaction-fill--selected.sc-ds-menu-h::before,.ds-interaction-fill--selected.sc-ds-menu::before{background:var(--ds-interaction-active)}.ds-interaction-fill--selected.sc-ds-menu-h,.ds-interaction-fill--selected.sc-ds-menu{--ds-interaction-dot-ring:var(--ds-interaction-active)}.ds-interaction-fill.sc-ds-menu-h:hover:not(:disabled)::after,.ds-interaction-fill.sc-ds-menu:hover:not(:disabled)::after{background:var(--ds-interaction-hover)}.ds-interaction-fill.sc-ds-menu-h:active:not(:disabled)::after,.ds-interaction-fill.sc-ds-menu:active:not(:disabled)::after{background:var(--ds-interaction-pressed)}.ds-interaction-fill.sc-ds-menu-h>.ds-interaction-fill__content.sc-ds-menu,.ds-interaction-fill.sc-ds-menu>.ds-interaction-fill__content.sc-ds-menu,.ds-interaction-fill__content.sc-ds-menu{position:relative;z-index:2}.ds-interaction-fill--on-faint.sc-ds-menu-h,.ds-interaction-fill--on-faint.sc-ds-menu{--ds-interaction-active:var(--color-interaction-active)}.ds-interaction-fill--on-medium.sc-ds-menu-h,.ds-interaction-fill--on-medium.sc-ds-menu{--ds-interaction-hover:var(--color-interaction-on-medium-background-hover);--ds-interaction-pressed:var(--color-interaction-on-medium-background-pressed);--ds-interaction-active:var(--color-interaction-on-medium-background-active);--ds-focus-ring-color:var(--color-interaction-on-medium-background-focus)}.ds-interaction-fill--on-bold.sc-ds-menu-h,.ds-interaction-fill--on-bold.sc-ds-menu{--ds-interaction-hover:var(--color-interaction-on-bold-background-hover);--ds-interaction-pressed:var(--color-interaction-on-bold-background-pressed);--ds-interaction-active:var(--color-interaction-on-bold-background-active);--ds-focus-ring-color:var(--color-interaction-on-bold-background-focus)}.ds-interaction-fill--on-strong.sc-ds-menu-h,.ds-interaction-fill--on-strong.sc-ds-menu{--ds-interaction-hover:var(--color-interaction-on-strong-background-hover);--ds-interaction-pressed:var(--color-interaction-on-strong-background-pressed);--ds-interaction-active:var(--color-interaction-on-strong-background-active);--ds-focus-ring-color:var(--color-interaction-on-strong-background-focus)}.ds-interaction-fill--on-translucent.sc-ds-menu-h,.ds-interaction-fill--on-translucent.sc-ds-menu{--ds-interaction-hover:var(--color-translucent-interaction-hover);--ds-interaction-pressed:var(--color-translucent-interaction-pressed);--ds-interaction-active:var(--color-translucent-interaction-active);--ds-focus-ring-color:var(--color-translucent-interaction-focus)}.ds-interaction-fill--on-inverted.sc-ds-menu-h,.ds-interaction-fill--on-inverted.sc-ds-menu{--ds-interaction-hover:var(--color-inverted-interaction-hover);--ds-interaction-pressed:var(--color-inverted-interaction-pressed);--ds-interaction-active:var(--color-inverted-interaction-active);--ds-focus-ring-color:var(--color-inverted-interaction-focus)}.ds-interaction-fill--on-media.sc-ds-menu-h,.ds-interaction-fill--on-media.sc-ds-menu{--ds-interaction-hover:var(--color-media-interaction-hover);--ds-interaction-pressed:var(--color-media-interaction-pressed);--ds-interaction-active:var(--color-media-interaction-active);--ds-focus-ring-color:var(--color-media-interaction-focus)}.ds-interaction-fill--on-always-dark.sc-ds-menu-h,.ds-interaction-fill--on-always-dark.sc-ds-menu{--ds-interaction-hover:var(--color-always-dark-interaction-hover);--ds-interaction-pressed:var(--color-always-dark-interaction-pressed);--ds-interaction-active:var(--color-always-dark-interaction-active);--ds-focus-ring-color:var(--color-always-dark-interaction-focus)}.ds-interaction-fill--on-navigation.sc-ds-menu-h,.ds-interaction-fill--on-navigation.sc-ds-menu{--ds-interaction-hover:var(--color-navigation-interaction-hover);--ds-interaction-pressed:var(--color-navigation-interaction-pressed);--ds-interaction-active:var(--color-navigation-interaction-active);--ds-focus-ring-color:var(--color-navigation-interaction-focus)}.ds-control-inactive.sc-ds-menu-h,.ds-control-inactive.sc-ds-menu{opacity:0.25;pointer-events:none;cursor:not-allowed}.ds-control--md.sc-ds-menu-h,.ds-control--md.sc-ds-menu,.ds-control--sm.sc-ds-menu-h,.ds-control--sm.sc-ds-menu,.ds-control--xs.sc-ds-menu-h,.ds-control--xs.sc-ds-menu{--ds-control-radius:var(--dimension-radius-025)}.ds-control--md.sc-ds-menu-h,.ds-control--md.sc-ds-menu{--ds-control-height:var(--dimension-size-400);--ds-control-icon:var(--dimension-iconography-md);--ds-control-padding-inline:var(--dimension-space-075);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-050)}.ds-control--sm.sc-ds-menu-h,.ds-control--sm.sc-ds-menu{--ds-control-height:var(--dimension-size-300);--ds-control-icon:var(--dimension-iconography-sm);--ds-control-padding-inline:var(--dimension-space-050);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-025)}.ds-control--xs.sc-ds-menu-h,.ds-control--xs.sc-ds-menu{--ds-control-height:var(--dimension-size-200);--ds-control-icon:var(--dimension-iconography-xs);--ds-control-padding-inline:var(--dimension-space-025);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:0}.ds-choice-popup.sc-ds-menu{box-sizing:border-box;display:flex;flex-direction:column;min-width:var(--dimension-menu-width-xs);max-width:min( var(--dimension-panel-width-lg), calc(100vw - var(--dimension-space-200)) );max-height:calc(100vh - var(--dimension-space-200));overflow:hidden;background-color:var(--color-background-primary);border-radius:var(--dimension-radius-075);box-shadow:var(--effect-shadow-elevated-floating);animation:dsChoiceFadeIn var(--effect-motion-short-2) forwards;backface-visibility:hidden;will-change:transform;text-align:start}.ds-choice-popup.sc-ds-menu::after{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;box-shadow:var(--effect-highlight-elevated-floating)}.ds-choice-popup--closing.sc-ds-menu{animation:dsChoiceFadeOut var(--effect-motion-short-2) forwards}@keyframes dsChoiceFadeIn{from{opacity:0;transform:inherit scale(0.97)}to{opacity:1}}@keyframes dsChoiceFadeOut{from{opacity:1}to{opacity:0}}@media (prefers-reduced-motion: reduce){.ds-choice-popup.sc-ds-menu{animation:none;opacity:1}.ds-choice-popup--closing.sc-ds-menu{opacity:0}}.ds-choice-list.sc-ds-menu{display:flex;flex-direction:column;min-height:0;overflow-y:auto;overscroll-behavior:contain}.ds-choice-section.sc-ds-menu{display:flex;flex-direction:column;gap:var(--dimension-space-050);padding:var(--dimension-space-050)}.ds-choice-section--divided.sc-ds-menu{border-bottom:var(--dimension-stroke-width-015) solid var(--color-border-tertiary)}ds-text.ds-choice-section__header.sc-ds-menu{display:flex;align-items:center;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding:0 calc( var(--ds-control-padding-inline, var(--dimension-space-075)) + var(--ds-control-label-inset, var(--dimension-space-025)) );text-align:start;-webkit-user-select:none;user-select:none}.ds-choice-item.sc-ds-menu{display:flex;align-items:center;gap:var(--ds-control-gap, var(--dimension-space-050));width:100%;height:var(--ds-control-height, var(--dimension-size-400));padding:0 var(--ds-control-padding-inline, var(--dimension-space-075));box-sizing:border-box;border:none;border-radius:var(--ds-control-radius, var(--dimension-radius-025));background:transparent;cursor:pointer;-webkit-user-select:none;user-select:none;text-align:left;color:inherit}.ds-choice-item.sc-ds-menu:has(.ds-choice-item__subtext){height:auto;min-height:var(--ds-control-height, var(--dimension-size-400));padding-block:var(--ds-control-padding-inline, var(--dimension-space-075));align-items:flex-start}.ds-choice-item__content.sc-ds-menu{display:flex;flex:1;flex-direction:column;gap:var(--dimension-space-025);min-width:0}ds-text.ds-choice-item__label.sc-ds-menu,.ds-choice-item__subtext.sc-ds-menu,ds-text.ds-choice-item__subtext.sc-ds-menu{padding:0 var(--ds-control-label-inset, var(--dimension-space-025))}ds-text.ds-choice-item__label.sc-ds-menu{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}ds-text.ds-choice-item__subtext.sc-ds-menu{display:-webkit-box;overflow:hidden;white-space:normal;-webkit-box-orient:vertical;-webkit-line-clamp:2}.ds-choice-item__icon.sc-ds-menu,.ds-choice-item__suffix.sc-ds-menu{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ds-control-icon, var(--dimension-iconography-md));height:var(--ds-control-icon, var(--dimension-iconography-md));pointer-events:none}.ds-choice-empty.sc-ds-menu,.ds-choice-loading.sc-ds-menu{display:flex;align-items:center;justify-content:center;box-sizing:border-box;min-height:var(--dimension-size-600);padding:var(--dimension-space-100)}.ds-choice-footer.sc-ds-menu{position:relative;box-sizing:border-box;padding-block:var(--dimension-space-050)}.ds-choice-footer.sc-ds-menu::before{content:'';position:absolute;inset:0 0 auto;height:var(--dimension-stroke-width-012);background-color:var(--color-border-tertiary);pointer-events:none}.ds-choice-footer__content.sc-ds-menu{display:flex;align-items:center;justify-content:space-between;box-sizing:border-box;height:var(--dimension-size-400)}.ds-choice-footer__summary.sc-ds-menu,.ds-choice-footer__clear.sc-ds-menu ds-text.sc-ds-menu{padding-inline:calc( var(--dimension-space-050) + var(--ds-control-padding-inline, var(--dimension-space-075)) + var(--ds-control-label-inset, var(--dimension-space-025)) )}.ds-choice-footer__clear.sc-ds-menu{appearance:none;display:inline-flex;align-items:center;padding:0;border:0;border-radius:var(--dimension-radius-025);background:transparent;color:var(--color-foreground-bold-brand);cursor:pointer}.ds-choice-footer__clear.sc-ds-menu:hover{text-decoration:underline}.menu-item--destructive.sc-ds-menu .menu-item__label.sc-ds-menu{color:var(--color-foreground-bold-negative) !important}.menu-item__dot-box.sc-ds-menu{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ds-control-icon, var(--dimension-iconography-md));height:var(--ds-control-icon, var(--dimension-iconography-md));pointer-events:none}.menu-item__switch.sc-ds-menu{flex-shrink:0}.menu-item__radio-box.sc-ds-menu{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ds-control-icon, var(--dimension-iconography-md));height:var(--ds-control-icon, var(--dimension-iconography-md));pointer-events:none}.menu-item__radio.sc-ds-menu{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;width:var(--dimension-iconography-sm);height:var(--dimension-iconography-sm);border-radius:var(--dimension-radius-half);box-shadow:inset 0 0 0 var(--dimension-stroke-width-015) var(--color-foreground-tertiary)}.menu-item__radio--checked.sc-ds-menu{background-color:var(--color-background-bold-brand);box-shadow:none}.menu-item__radio-dot.sc-ds-menu{width:var(--dimension-size-100);height:var(--dimension-size-100);border-radius:var(--dimension-radius-half);background-color:var(--color-foreground-on-bold-background-primary)}`;const k=8;const P=["a[href]","button:not([disabled])",'input:not([disabled]):not([type="hidden"])',"select:not([disabled])","textarea:not([disabled])",'[tabindex]:not([tabindex="-1"])'].join(",");function C(i){return i.map((i=>{if(x(i))return{...i};if(w(i)){return{...i,options:i.options?.map((i=>({...i}))),sections:i.sections?.map((i=>({...i,options:i.options.map((i=>({...i})))})))}}return{...i,items:i.items.map((i=>({...i})))}}))}const z=i(class i extends e{constructor(i){super();if(i!==false){this.__registerHost()}this.dsClose=s(this,"dsClose");this.dsAfterClose=s(this,"dsAfterClose");this.dsSelect=s(this,"dsSelect");this.dsGradientSelect=s(this,"dsGradientSelect");this.dsSwatchSelect=s(this,"dsSwatchSelect");this.open=false;this.items=[];this.selectionMode="none";this.sections=[];this.side="bottom";this.align="start";this.anchorAlignment="choice-cell";this.sideOffset=f.space050;this.alignOffset=0;this.initialFocusVisible=false;this.menuLabel="Menu";this.shouldRender=false;this.closing=false;this.pos={x:0,y:0};this.focusedIndex=0;this.positionReady=false;this.focusRingVisible=false;this.clickOutsideHandler=null;this.scrollResizeHandler=null;this.closeTimer=null;this.itemEls=[];this.positionRetryRaf=null;this.listenersReady=false;this.lastRenderedSections=[];this.closingSections=null}componentDidLoad(){if(this.open)this.onOpenChange(true)}disconnectedCallback(){this.cancelPositionRetry();this.teardownListeners()}onOpenChange(i){if(i){this.teardownListeners();this.closingSections=null;this.shouldRender=true;this.closing=false;this.positionReady=false;this.listenersReady=false;this.focusRingVisible=this.initialFocusVisible;this.listenersReady=true;this.setupListeners();this.schedulePositionUpdate((()=>{this.focusInitialItem()}))}else if(this.shouldRender){this.cancelPositionRetry();this.captureClosingSections();this.closing=true;this.teardownListeners();this.listenersReady=false;const i=this.closeAnimationMs;if(i<=0){this.finishClose();return}this.closeTimer=setTimeout((()=>{this.closeTimer=null;this.finishClose()}),i)}}onAnchorChange(){if(this.open)this.schedulePositionUpdate()}onPositionPropsChange(){if(this.open)this.schedulePositionUpdate()}get viewportPadPx(){return g(v.space050,v.space050)}get sideOffsetPx(){return g(this.sideOffset,v.space050)}get alignOffsetPx(){return g(this.alignOffset,0)}get popupFallbackWidthPx(){return g(v.menuWidthXs,v.menuWidthXs)}get popupFallbackHeightPx(){return g(v.menuFallbackHeight,v.menuFallbackHeight)}get closeAnimationMs(){return p(v.motionShort2,v.animationDurationShort3)}finishClose(){this.shouldRender=false;this.closing=false;this.lastRenderedSections=[];this.closingSections=null;this.dsAfterClose.emit()}captureClosingSections(){if(this.closingSections)return;const i=this.lastRenderedSections.length?this.lastRenderedSections:this.activeSections;this.closingSections=C(i)}get resolvedAnchor(){if(this.anchor)return this.anchor;if(this.anchorId)return document.getElementById(this.anchorId);return null}get anchorFocusTarget(){const i=this.resolvedAnchor;if(!i)return null;if(i.matches(P))return i;return i.querySelector(P)??i}focusAnchor(){const i=this.resolvedAnchor;if(i?.setFocus){i.setFocus();return}this.anchorFocusTarget?.focus()}moveFocusAfterTab(i){const e=this.anchorFocusTarget;if(!e)return;if(i){e.focus();return}const s=Array.from(document.querySelectorAll(P)).filter((i=>!i.closest(".menu-popup")&&!i.closest("[inert]")&&i.getClientRects().length>0));const n=s.indexOf(e);(s[n+1]??e).focus()}compositeTabLeavesPopup(i){const e=this.el.querySelector(".menu-popup");if(!e)return true;const s=Array.from(e.querySelectorAll(P)).filter((i=>i.getClientRects().length>0));const n=s.indexOf(i.target);if(n<0)return true;return i.shiftKey?n===0:n===s.length-1}get activeSections(){if(this.sections.length>0)return this.sections;if(this.items.length>0)return[{items:this.items}];return[]}get flatItems(){return this.activeSections.flatMap((i=>_(i)?[]:i.items))}get hasCompositeSections(){return this.activeSections.some(_)}cancelPositionRetry(){if(this.positionRetryRaf!==null){cancelAnimationFrame(this.positionRetryRaf);this.positionRetryRaf=null}}schedulePositionUpdate(i){if(!this.open)return;this.cancelPositionRetry();this.positionReady=false;let e=k;const s=()=>{this.positionRetryRaf=null;if(!this.open)return;if(this.calculatePosition()){this.positionReady=true;i?.();return}if(e>0){e-=1;this.positionRetryRaf=requestAnimationFrame(s)}};this.positionRetryRaf=requestAnimationFrame(s)}calculatePosition(){const i=this.resolvedAnchor;if(!i)return false;const e=this.el.querySelector(".menu-popup");if(!e)return false;const s=i.getBoundingClientRect();const n=this.viewportPadPx;if(!this.minWidth){if(this.anchorAlignment==="choice-cell"&&(this.side==="top"||this.side==="bottom")){e.style.minWidth=`max(var(--dimension-menu-width-xs), ${c(s.width,n)}px)`}else{e.style.removeProperty("min-width")}}this.pos=b({anchorRect:s,popupWidth:e.offsetWidth||this.popupFallbackWidthPx,popupHeight:e.offsetHeight||this.popupFallbackHeightPx,side:this.side,align:this.align,sideOffsetPx:this.sideOffsetPx,alignOffsetPx:a({align:this.align,alignOffsetPx:this.alignOffsetPx,sectionInsetPx:n,anchorAlignment:this.anchorAlignment}),viewportPadPx:this.viewportPadPx,viewportWidth:window.innerWidth,viewportHeight:window.innerHeight});return true}focusInitialItem(){if(this.hasCompositeSections){requestAnimationFrame((()=>{this.el.querySelector('.menu-popup [tabindex="0"]')?.focus()}));return}const i=this.flatItems;const e=i.findIndex((i=>i.isSelected&&!i.isInactive));const s=i.findIndex((i=>!i.isInactive));this.focusedIndex=e>=0?e:s>=0?s:0;requestAnimationFrame((()=>{const i=this.el.querySelectorAll(".menu-item");i[this.focusedIndex]?.focus()}))}setupListeners(){this.clickOutsideHandler=i=>{const e=i.target;const s=this.el.querySelector(".menu-popup");const n=this.resolvedAnchor;if(s?.contains(e)||n?.contains(e))return;this.close()};this.scrollResizeHandler=()=>{if(this.shouldRender&&!this.closing)this.calculatePosition()};document.addEventListener("mousedown",this.clickOutsideHandler,true);window.addEventListener("scroll",this.scrollResizeHandler,true);window.addEventListener("resize",this.scrollResizeHandler)}teardownListeners(){if(this.clickOutsideHandler){document.removeEventListener("mousedown",this.clickOutsideHandler,true);this.clickOutsideHandler=null}if(this.scrollResizeHandler){window.removeEventListener("scroll",this.scrollResizeHandler,true);window.removeEventListener("resize",this.scrollResizeHandler);this.scrollResizeHandler=null}if(this.closeTimer){clearTimeout(this.closeTimer);this.closeTimer=null}}close(i=true){this.captureClosingSections();if(i)this.focusAnchor();this.dsClose.emit();this.open=false;this.onOpenChange(false)}handleKeyDown(i){if(!this.shouldRender||this.closing)return;if(i.key==="Escape"){i.preventDefault();this.close();return}if(i.key==="Tab"){if(this.hasCompositeSections&&!this.compositeTabLeavesPopup(i))return;i.preventDefault();this.close(false);this.moveFocusAfterTab(i.shiftKey);return}if(this.hasCompositeSections)return;const e=this.flatItems;const s=e.map(((i,e)=>({it:i,i:e}))).filter((({it:i})=>!i.isInactive)).map((({i})=>i));if(!s.length)return;const n=s.indexOf(this.focusedIndex);const t=n<0?0:n;switch(i.key){case"ArrowDown":i.preventDefault();i.stopPropagation();this.focusRingVisible=true;this.focusedIndex=s[(t+1)%s.length];this.focusItem(this.focusedIndex);break;case"ArrowUp":i.preventDefault();i.stopPropagation();this.focusRingVisible=true;this.focusedIndex=s[(t-1+s.length)%s.length];this.focusItem(this.focusedIndex);break;case"Home":i.preventDefault();i.stopPropagation();this.focusRingVisible=true;this.focusedIndex=s[0];this.focusItem(this.focusedIndex);break;case"End":i.preventDefault();i.stopPropagation();this.focusRingVisible=true;this.focusedIndex=s[s.length-1];this.focusItem(this.focusedIndex);break}}focusItem(i){const e=this.el.querySelectorAll(".menu-item");e[i]?.focus()}handleItemClick(i){if(i.isInactive)return;this.captureClosingSections();this.dsSelect.emit(i)}handleGradientSelect(i){this.dsGradientSelect.emit(i)}handleSwatchSelect(i){this.dsSwatchSelect.emit(i)}render(){if(!this.shouldRender)return n(t,{style:{display:"contents"}});const i=this.closing?this.closingSections??this.lastRenderedSections:this.activeSections;const e=i.some(_);if(!this.closing){this.lastRenderedSections=C(i);this.closingSections=null}let s=0;const o={position:"fixed",left:"0",top:"0",transform:`translate(${Math.round(this.pos.x)}px, ${Math.round(this.pos.y)}px)`,zIndex:"9998",visibility:this.positionReady?"visible":"hidden"};if(this.menuWidth)o["width"]=this.menuWidth;if(this.minWidth)o["min-width"]=this.minWidth;return n(t,{style:{display:"contents"}},n("div",{class:{"menu-popup":true,"menu-popup--closing":this.closing,"ds-choice-popup":true,"ds-choice-popup--closing":this.closing},style:o,role:e?"dialog":"menu","aria-label":this.menuLabel,"aria-orientation":e?undefined:"vertical"},n("div",{class:"ds-choice-list"},i.map(((t,o)=>n("div",{key:o,class:{"menu-section":true,"menu-section--divided":o<i.length-1,"menu-section--gradient-picker":_(t),"ds-choice-section":true,"ds-choice-section--divided":o<i.length-1},role:t.header?"group":undefined,"aria-label":t.header},t.header&&n("ds-text",{class:"section-header ds-choice-section__header ds-control--md",as:"span",variant:"text-body-small",emphasis:true,color:"primary","aria-hidden":"true"},t.header),x(t)?n("ds-swatch-picker",{value:t.value,groupLabel:t.header??"Shell gradient theme",sections:d(),onDsChange:i=>{i.stopPropagation();this.handleGradientSelect(i.detail)}}):w(t)?n("ds-swatch-picker",{value:t.value,groupLabel:t.groupLabel??t.header??"Swatch options",options:t.options??[],sections:t.sections??[],onDsChange:i=>{i.stopPropagation();this.handleSwatchSelect(i.detail)}}):t.items.map((i=>{const t=s++;const o=this.focusedIndex===t;const r=!e&&this.selectionMode==="single"&&!i.showSwitch;return n("button",{key:t,type:"button",class:{"menu-item":true,"ds-choice-item":true,"ds-control--md":true,"ds-focus-ring-inset":true,"ds-focus-ring--visible":o&&this.focusRingVisible,"ds-interaction-fill":!i.isInactive,"ds-interaction-fill--selected":!!i.isSelected&&!i.isInactive,"menu-item--selected":!!i.isSelected,"ds-control-inactive":!!i.isInactive,"menu-item--destructive":!!i.isDestructive,"menu-item--focused":o},role:e?undefined:i.showSwitch?"menuitemcheckbox":r?"menuitemradio":"menuitem","aria-checked":!e&&i.showSwitch?String(!!i.switchValue):r?String(!!i.isSelected):undefined,"aria-pressed":e?String(i.showSwitch?!!i.switchValue:!!i.isSelected):undefined,"aria-current":!e&&!i.showSwitch&&!r&&i.isSelected?"true":undefined,disabled:i.isInactive,tabIndex:e?0:o?0:-1,onMouseDown:()=>{this.focusRingVisible=false},onClick:()=>this.handleItemClick(i),onFocus:()=>{this.focusedIndex=t}},r&&n("span",{class:"menu-item__radio-box ds-interaction-fill__content","aria-hidden":"true"},n("span",{class:{"menu-item__radio":true,"menu-item__radio--checked":!!i.isSelected}},i.isSelected&&n("span",{class:"menu-item__radio-dot"}))),n("div",{class:"menu-item__content ds-choice-item__content ds-interaction-fill__content"},n("ds-text",{class:"menu-item__label ds-choice-item__label",as:"span",variant:"text-body-medium",color:i.isSelected?"primary":"secondary"},i.label),i.subtext&&n("ds-text",{class:"menu-item__subtext ds-choice-item__subtext",as:"span",variant:"text-body-small",color:"secondary"},i.subtext)),i.dot&&n("span",{class:"menu-item__dot-box ds-interaction-fill__content","aria-hidden":"true"},n("ds-badge",{class:"menu-item__dot",variant:"dot",hasRing:false,label:""})),i.showSwitch&&n("ds-switch",{class:"menu-item__switch ds-interaction-fill__content",size:"md",checked:!!i.switchValue,presentation:true}))}))))))))}get el(){return this}static get watchers(){return{open:[{onOpenChange:0}],anchor:[{onAnchorChange:0}],anchorId:[{onAnchorChange:0}],side:[{onPositionPropsChange:0}],align:[{onPositionPropsChange:0}],anchorAlignment:[{onPositionPropsChange:0}],sideOffset:[{onPositionPropsChange:0}],alignOffset:[{onPositionPropsChange:0}]}}static get style(){return y()}},[2,"ds-menu",{open:[1028],items:[16],selectionMode:[1,"selection-mode"],sections:[16],side:[1],align:[1],anchorAlignment:[1,"anchor-alignment"],sideOffset:[8,"side-offset"],alignOffset:[8,"align-offset"],menuWidth:[1,"menu-width"],minWidth:[1,"min-width"],anchor:[16],anchorId:[1,"anchor-id"],initialFocusVisible:[4,"initial-focus-visible"],menuLabel:[1,"menu-label"],shouldRender:[32],closing:[32],pos:[32],focusedIndex:[32],positionReady:[32],focusRingVisible:[32]},[[0,"keydown","handleKeyDown"]],{open:[{onOpenChange:0}],anchor:[{onAnchorChange:0}],anchorId:[{onAnchorChange:0}],side:[{onPositionPropsChange:0}],align:[{onPositionPropsChange:0}],anchorAlignment:[{onPositionPropsChange:0}],sideOffset:[{onPositionPropsChange:0}],alignOffset:[{onPositionPropsChange:0}]}]);function A(){if(typeof customElements==="undefined"){return}const i=["ds-menu","ds-badge","ds-swatch-picker","ds-switch","ds-text"];i.forEach((i=>{switch(i){case"ds-menu":if(!customElements.get(o(i))){customElements.define(o(i),z)}break;case"ds-badge":if(!customElements.get(o(i))){l()}break;case"ds-swatch-picker":if(!customElements.get(o(i))){h()}break;case"ds-switch":if(!customElements.get(o(i))){u()}break;case"ds-text":if(!customElements.get(o(i))){m()}break}}))}A();export{z as M,A as d};
|
|
2
|
+
//# sourceMappingURL=p-BsnezUUC.js.map
|