@ds-mo/ui 15.7.0 → 15.8.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/.package-ready.json +1 -1
- package/dist/agent-patterns.json +1 -1
- package/dist/agent.json +2 -1
- package/dist/components/ds-agent-activity.js +1 -1
- package/dist/components/ds-agent-questionnaire.js +1 -1
- package/dist/components/ds-agent-response.js +1 -1
- package/dist/components/ds-agent-source-list.js +1 -1
- package/dist/components/ds-agent-tool-call.js +1 -1
- package/dist/components/ds-attachment-list.js +1 -1
- package/dist/components/ds-avatar.js +1 -1
- package/dist/components/ds-avatar.js.map +1 -1
- package/dist/components/ds-banner.js +1 -1
- package/dist/components/ds-bar-action.js +1 -1
- package/dist/components/ds-bar-action.js.map +1 -1
- package/dist/components/ds-bar-nav.js +1 -1
- package/dist/components/ds-bar-page-title.js +1 -1
- package/dist/components/ds-bar-title.js +1 -1
- package/dist/components/ds-bar-workflow.js +1 -1
- package/dist/components/ds-bar-workflow.js.map +1 -1
- package/dist/components/ds-button-filled.js +1 -1
- package/dist/components/ds-button-inverted.js +1 -1
- package/dist/components/ds-button-unfilled.js +1 -1
- package/dist/components/ds-calendar.js +1 -1
- package/dist/components/ds-card-action-center.js +1 -1
- package/dist/components/ds-card-chart.js +1 -1
- package/dist/components/ds-card-navigation.js +1 -1
- package/dist/components/ds-card-setting.js +1 -1
- package/dist/components/ds-chart.js +1 -1
- package/dist/components/ds-chip.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-item.js.map +1 -1
- package/dist/components/ds-data-customize.js +1 -1
- package/dist/components/ds-data-filter.js +1 -1
- package/dist/components/ds-data-group.js +1 -1
- package/dist/components/ds-data-preferences.js +1 -1
- package/dist/components/ds-data-preferences.js.map +1 -1
- package/dist/components/ds-data-saved-views.js +1 -1
- package/dist/components/ds-data-search.js +1 -1
- package/dist/components/ds-data-search.js.map +1 -1
- package/dist/components/ds-data-sort.js +1 -1
- package/dist/components/ds-empty-state.js +1 -1
- package/dist/components/ds-filter-menu.js +1 -1
- package/dist/components/ds-icon.js +1 -1
- package/dist/components/ds-input-date.js +1 -1
- package/dist/components/ds-input-time.js +1 -1
- package/dist/components/ds-input.js +1 -1
- package/dist/components/ds-map-entity-marker.js +1 -1
- package/dist/components/ds-markdown.js +1 -1
- package/dist/components/ds-menu.js +1 -1
- package/dist/components/ds-message-actions.js +1 -1
- package/dist/components/ds-message-composer.js +1 -1
- package/dist/components/ds-message-scroller.js +1 -1
- package/dist/components/ds-mobile-bar-nav.js +1 -1
- package/dist/components/ds-mobile-header.js +1 -1
- package/dist/components/ds-mobile-section-switcher.js +1 -1
- package/dist/components/ds-mobile-sheet-nav.js +1 -1
- package/dist/components/ds-modal.js +1 -1
- package/dist/components/ds-navigation-tab-group.js +1 -1
- package/dist/components/ds-pagination.js +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-tool-search.js.map +1 -1
- package/dist/components/ds-panel-tools.js +1 -1
- package/dist/components/ds-select-toggle.js +1 -1
- package/dist/components/ds-select.js +1 -1
- package/dist/components/ds-shell-app.js +1 -1
- package/dist/components/ds-shell-app.js.map +1 -1
- package/dist/components/ds-shell-tools.js +1 -1
- package/dist/components/ds-tab-group.js +1 -1
- package/dist/components/ds-table.js +1 -1
- package/dist/components/ds-table.js.map +1 -1
- package/dist/components/ds-tag.js +1 -1
- package/dist/components/ds-toast.js +1 -1
- package/dist/components/ds-tooltip-chart.js +1 -1
- package/dist/components/{p-DKvHBXwn.js → p-B1dnisok.js} +2 -2
- package/dist/components/p-B7EfrM6C.js +2 -0
- package/dist/components/{p-CLqqb0Jp.js.map → p-B7EfrM6C.js.map} +1 -1
- package/dist/components/{p-CgC4SM5b.js → p-B9ZhRwE3.js} +2 -2
- package/dist/components/{p-DGrSro-o.js → p-BAcdqJaa.js} +2 -2
- package/dist/components/{p-4sBUSsqs.js → p-BREDkBUv.js} +2 -2
- package/dist/components/{p-pPtjNRqC.js → p-BVsVUnAw.js} +2 -2
- package/dist/components/p-BVsVUnAw.js.map +1 -0
- package/dist/components/{p-CKSJwSWd.js → p-BWnL2SWn.js} +2 -2
- package/dist/components/{p-CqAC2IQO.js → p-BcmJBzB6.js} +2 -2
- package/dist/components/p-BjD1eFx6.js +2 -0
- package/dist/components/{p-CHyxUWqL.js.map → p-BjD1eFx6.js.map} +1 -1
- package/dist/components/{p-AGqUGzNZ.js → p-Bjm-Rk_x.js} +2 -2
- package/dist/components/{p-UBQ5O7B-.js → p-Bls48_RF.js} +2 -2
- package/dist/components/{p-oBpjD9OA.js → p-BqZWKYsS.js} +2 -2
- package/dist/components/p-C4YUkrr0.js +2 -0
- package/dist/components/{p-LJXiEPw1.js.map → p-C4YUkrr0.js.map} +1 -1
- package/dist/components/p-C62g3d5y.js +2 -0
- package/dist/components/{p-CRhoeCC8.js.map → p-C62g3d5y.js.map} +1 -1
- package/dist/components/p-C6EXrs1S.js +2 -0
- package/dist/components/{p-CvIHBa8S.js.map → p-C6EXrs1S.js.map} +1 -1
- package/dist/components/p-CCoJ7CBB.js +2 -0
- package/dist/components/{p-BKyE025p.js.map → p-CCoJ7CBB.js.map} +1 -1
- package/dist/components/p-CG4vPDhg.js +2 -0
- package/dist/components/{p-DmgDVoDb.js.map → p-CG4vPDhg.js.map} +1 -1
- package/dist/components/p-CJSIvfpo.js +2 -0
- package/dist/components/{p-C0L-VnSr.js.map → p-CJSIvfpo.js.map} +1 -1
- package/dist/components/p-CJuc20pQ.js +2 -0
- package/dist/components/p-CJuc20pQ.js.map +1 -0
- package/dist/components/{p-dSNHIJz6.js → p-CWAeg9jl.js} +2 -2
- package/dist/components/{p-BwNW5nqj.js → p-CantpOo3.js} +2 -2
- package/dist/components/p-D-TeAVxE.js +2 -0
- package/dist/components/{p-Ct2KQHF4.js.map → p-D-TeAVxE.js.map} +1 -1
- package/dist/components/{p-DiPqdcD4.js → p-D3JCih82.js} +2 -2
- package/dist/components/p-DHpcv_Os.js +2 -0
- package/dist/components/{p-BPDo1eQV.js.map → p-DHpcv_Os.js.map} +1 -1
- package/dist/components/{p-D_xZ5SFL.js → p-DWXpMWIp.js} +2 -2
- package/dist/components/{p-Dyjs8_Cl.js → p-DagrkX2v.js} +2 -2
- package/dist/components/{p-D62yUMhr.js → p-DcMbWqTd.js} +2 -2
- package/dist/components/{p-g2OUK8Z0.js → p-DiyL2sI5.js} +2 -2
- package/dist/components/p-Dvw7N7TH.js +2 -0
- package/dist/components/{p-D9l0QBgN.js.map → p-Dvw7N7TH.js.map} +1 -1
- package/dist/components/{p-v9Nhw5yM.js → p-IfsszNF0.js} +2 -2
- package/dist/components/p-QU4czL2k.js +2 -0
- package/dist/components/p-QU4czL2k.js.map +1 -0
- package/dist/components/{p-CCsxoztj.js → p-SXaH5TeC.js} +2 -2
- package/dist/components/{p-CCsxoztj.js.map → p-SXaH5TeC.js.map} +1 -1
- package/dist/components/p-Tf6odBOV.js +2 -0
- package/dist/components/{p-CXB_T13u.js.map → p-Tf6odBOV.js.map} +1 -1
- package/dist/components/p-UWU23pbX.js +2 -0
- package/dist/components/{p-Cs8Gq-PZ.js.map → p-UWU23pbX.js.map} +1 -1
- package/dist/components/p-YFjXYN8s.js +2 -0
- package/dist/components/{p-DdNJPBCS.js.map → p-YFjXYN8s.js.map} +1 -1
- package/dist/components/{p-pJ6gbwSa.js → p-kL4EOsx5.js} +2 -2
- package/dist/components/{p-BjBFJ2dd.js → p-topqlGsI.js} +2 -2
- package/dist/components/{p-Bdp2V6-c.js → p-zopMP2ze.js} +2 -2
- package/dist/components/{p-Bdp2V6-c.js.map → p-zopMP2ze.js.map} +1 -1
- package/dist/docs/components.json +1 -1
- package/dist/lib/shell/index.js.map +2 -2
- package/dist/lib/shell/shell-responsive.d.ts +2 -0
- package/dist/mcp-data/registry/data-preferences.json +1 -1
- package/dist/mcp-data/registry/data-sort.json +1 -1
- package/dist/mcp-data/registry/registry.json +1 -0
- package/dist/mcp-data/registry/shell-app.json +2 -1
- package/dist/styles/table.css +8 -0
- package/dist/types/components/ShellApp/ShellApp.d.ts +1 -0
- package/dist/types/shell/shell-responsive.d.ts +2 -0
- package/package.json +1 -1
- package/dist/components/p-BKyE025p.js +0 -2
- package/dist/components/p-BPDo1eQV.js +0 -2
- package/dist/components/p-C0L-VnSr.js +0 -2
- package/dist/components/p-CHyxUWqL.js +0 -2
- package/dist/components/p-CLqqb0Jp.js +0 -2
- package/dist/components/p-CRhoeCC8.js +0 -2
- package/dist/components/p-CXB_T13u.js +0 -2
- package/dist/components/p-CgGcgMjs.js +0 -2
- package/dist/components/p-CgGcgMjs.js.map +0 -1
- package/dist/components/p-Cs8Gq-PZ.js +0 -2
- package/dist/components/p-Ct2KQHF4.js +0 -2
- package/dist/components/p-CvIHBa8S.js +0 -2
- package/dist/components/p-D9l0QBgN.js +0 -2
- package/dist/components/p-DdNJPBCS.js +0 -2
- package/dist/components/p-DlCLfwP4.js +0 -2
- package/dist/components/p-DlCLfwP4.js.map +0 -1
- package/dist/components/p-DmgDVoDb.js +0 -2
- package/dist/components/p-LJXiEPw1.js +0 -2
- package/dist/components/p-pPtjNRqC.js.map +0 -1
- /package/dist/components/{p-DKvHBXwn.js.map → p-B1dnisok.js.map} +0 -0
- /package/dist/components/{p-CgC4SM5b.js.map → p-B9ZhRwE3.js.map} +0 -0
- /package/dist/components/{p-DGrSro-o.js.map → p-BAcdqJaa.js.map} +0 -0
- /package/dist/components/{p-4sBUSsqs.js.map → p-BREDkBUv.js.map} +0 -0
- /package/dist/components/{p-CKSJwSWd.js.map → p-BWnL2SWn.js.map} +0 -0
- /package/dist/components/{p-CqAC2IQO.js.map → p-BcmJBzB6.js.map} +0 -0
- /package/dist/components/{p-AGqUGzNZ.js.map → p-Bjm-Rk_x.js.map} +0 -0
- /package/dist/components/{p-UBQ5O7B-.js.map → p-Bls48_RF.js.map} +0 -0
- /package/dist/components/{p-oBpjD9OA.js.map → p-BqZWKYsS.js.map} +0 -0
- /package/dist/components/{p-dSNHIJz6.js.map → p-CWAeg9jl.js.map} +0 -0
- /package/dist/components/{p-BwNW5nqj.js.map → p-CantpOo3.js.map} +0 -0
- /package/dist/components/{p-DiPqdcD4.js.map → p-D3JCih82.js.map} +0 -0
- /package/dist/components/{p-D_xZ5SFL.js.map → p-DWXpMWIp.js.map} +0 -0
- /package/dist/components/{p-Dyjs8_Cl.js.map → p-DagrkX2v.js.map} +0 -0
- /package/dist/components/{p-D62yUMhr.js.map → p-DcMbWqTd.js.map} +0 -0
- /package/dist/components/{p-g2OUK8Z0.js.map → p-DiyL2sI5.js.map} +0 -0
- /package/dist/components/{p-v9Nhw5yM.js.map → p-IfsszNF0.js.map} +0 -0
- /package/dist/components/{p-pJ6gbwSa.js.map → p-kL4EOsx5.js.map} +0 -0
- /package/dist/components/{p-BjBFJ2dd.js.map → p-topqlGsI.js.map} +0 -0
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{p as s,H as e,c as t,h as i,a,t as o}from"./index.js";import{C as n}from"./p-BnhGV__o.js";import{d}from"./p-BWJb2rih.js";import{d as l}from"./p-
|
|
1
|
+
import{p as s,H as e,c as t,h as i,a,t as o}from"./index.js";import{C as n}from"./p-BnhGV__o.js";import{d}from"./p-BWJb2rih.js";import{d as l}from"./p-kL4EOsx5.js";import{d as c}from"./p-BVsVUnAw.js";import{d as r}from"./p-0XTyQNRG.js";import{d as p}from"./p-BbvAWFJA.js";import{d as h}from"./p-BJf49edB.js";const f=()=>`.sc-ds-message-actions-h{display:inline-flex;box-sizing:border-box}.message-actions.sc-ds-message-actions{display:inline-flex;align-items:center;gap:var(--dimension-space-050)}`;const m=s(class s extends e{constructor(s){super();if(s!==false){this.__registerHost()}this.dsCopyResult=t(this,"dsCopyResult",7);this.dsFeedbackChange=t(this,"dsFeedbackChange",7);this.feedbackEnabled=false;this.copied=false;this.copyFeedback=new n((s=>{this.copied=s}));this.copy=async()=>{const s=await this.copyFeedback.copy(this.copyText??"");if(s===undefined)return;this.dsCopyResult.emit({status:s?"success":"error"})}}connectedCallback(){this.copyFeedback.connect()}handleCopyTextChange(){this.copyFeedback.reset()}disconnectedCallback(){this.copyFeedback.disconnect()}changeFeedback(s,e){this.dsFeedbackChange.emit(e?s:undefined)}render(){const s=this.copied?"Copied":"Copy message";return i(a,{key:"b2417cc8969ecba4f8d0b1b89a955951b090a76f"},i("div",{key:"9ef3dd79b9f52267216343ff918d848fdf3c2d13",class:"message-actions",role:"group","aria-label":"Message actions"},this.copyText?i("ds-tooltip",{label:s,side:"top",size:"sm"},i("ds-button-unfilled",{variant:"icon",icon:this.copied?"Check":"Copy",size:"xs","aria-label":s,hasBorder:false,onDsClick:this.copy})):null,this.feedbackEnabled?i("ds-tooltip",{label:"Good response",side:"top",size:"sm"},i("ds-button-unfilled",{variant:"icon",icon:this.feedback==="positive"?"ThumbsUpFilled":"ThumbsUp",size:"xs","aria-label":"Good response",hasBorder:false,activeFill:false,pressed:this.feedback==="positive",onDsChange:s=>this.changeFeedback("positive",s.detail)})):null,this.feedbackEnabled?i("ds-tooltip",{label:"Bad response",side:"top",size:"sm"},i("ds-button-unfilled",{variant:"icon",icon:this.feedback==="negative"?"ThumbsDownFilled":"ThumbsDown",size:"xs","aria-label":"Bad response",hasBorder:false,activeFill:false,pressed:this.feedback==="negative",onDsChange:s=>this.changeFeedback("negative",s.detail)})):null))}static get watchers(){return{copyText:[{handleCopyTextChange:0}]}}static get style(){return f()}},[2,"ds-message-actions",{copyText:[1,"copy-text"],feedbackEnabled:[4,"feedback-enabled"],feedback:[1],copied:[32]},undefined,{copyText:[{handleCopyTextChange:0}]}]);function b(){if(typeof customElements==="undefined"){return}const s=["ds-message-actions","ds-badge","ds-button-unfilled","ds-icon","ds-loader","ds-text","ds-tooltip"];s.forEach((s=>{switch(s){case"ds-message-actions":if(!customElements.get(o(s))){customElements.define(o(s),m)}break;case"ds-badge":if(!customElements.get(o(s))){d()}break;case"ds-button-unfilled":if(!customElements.get(o(s))){l()}break;case"ds-icon":if(!customElements.get(o(s))){c()}break;case"ds-loader":if(!customElements.get(o(s))){r()}break;case"ds-text":if(!customElements.get(o(s))){p()}break;case"ds-tooltip":if(!customElements.get(o(s))){h()}break}}))}b();const u=m;const g=b;export{u as DsMessageActions,g as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=ds-message-actions.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{p as e,H as s,c as o,h as r,a,t}from"./index.js";import{d as c}from"./p-BWJb2rih.js";import{d as i}from"./p-
|
|
1
|
+
import{p as e,H as s,c as o,h as r,a,t}from"./index.js";import{d as c}from"./p-BWJb2rih.js";import{d as i}from"./p-CWAeg9jl.js";import{d}from"./p-kL4EOsx5.js";import{d as m}from"./p-BVsVUnAw.js";import{d as n}from"./p-0XTyQNRG.js";import{d as l}from"./p-BbvAWFJA.js";import{d as p}from"./p-BJf49edB.js";const g=()=>`@media (forced-colors: active){.sc-ds-message-composer:root,.sc-ds-message-composer-h,.ds-forced-colors-scope.sc-ds-message-composer{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.sc-ds-message-composer-h{display:block;width:100%;box-sizing:border-box;-webkit-user-select:none;user-select:none}.message-composer.sc-ds-message-composer{display:flex;flex-direction:column;gap:var(--dimension-space-050);width:100%;margin:0}.message-composer__attachments.sc-ds-message-composer:empty,.message-composer__tools.sc-ds-message-composer:empty,.message-composer__error-actions.sc-ds-message-composer:empty{display:none}.message-composer__error-support.sc-ds-message-composer,.message-composer__error-message.sc-ds-message-composer,.message-composer__error-actions.sc-ds-message-composer{display:flex;align-items:center}.message-composer__error-support.sc-ds-message-composer{justify-content:space-between;flex-wrap:wrap;gap:var(--dimension-space-075) var(--dimension-space-100);min-width:0;padding:var(--dimension-space-075) var(--dimension-space-100);background:var(--color-background-faint-negative)}.message-composer__error-message.sc-ds-message-composer{flex:1 1 var(--dimension-panel-width-xs);gap:var(--dimension-space-050);min-width:0;color:var(--color-foreground-bold-negative)}.message-composer__error-actions.sc-ds-message-composer{flex:0 1 auto;flex-wrap:wrap;gap:var(--dimension-space-050)}.message-composer__stack.sc-ds-message-composer{min-width:0}.message-composer--error.sc-ds-message-composer .message-composer__stack.sc-ds-message-composer{overflow:hidden;border:var(--dimension-stroke-width-012) solid var(--color-border-bold-negative);border-radius:var(--dimension-radius-050);background:var(--color-background-primary);box-shadow:var(--effect-elevation-elevated-md)}.message-composer__field.sc-ds-message-composer{display:flex;flex-direction:column;gap:var(--dimension-space-050);padding:var(--dimension-space-100);border-radius:var(--dimension-radius-050);background:var(--color-background-primary);box-shadow:var(--effect-elevation-elevated-md);overflow:hidden}.message-composer.sc-ds-message-composer:not(.message-composer--error) .message-composer__field.sc-ds-message-composer:focus-within{box-shadow:var(--effect-elevation-elevated-md), inset 0 0 0 var(--dimension-stroke-width-018) var(--color-border-bold-brand)}.message-composer--error.sc-ds-message-composer .message-composer__field.sc-ds-message-composer{border-radius:0;box-shadow:none}textarea.sc-ds-message-composer{field-sizing:content;width:100%;min-height:calc(var(--typography-lineheight-md) * 2 + var(--dimension-space-150));max-height:calc(var(--typography-lineheight-md) * 6 + var(--dimension-space-150));padding:var(--dimension-space-075);border:none;outline:none;resize:none;overflow-y:auto;box-sizing:border-box;background:transparent;color:var(--color-foreground-primary);font-family:var(--typography-font-family-ui);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);-webkit-user-select:text;user-select:text}textarea.sc-ds-message-composer::placeholder{color:var(--color-foreground-secondary)}textarea.sc-ds-message-composer:focus::placeholder{color:var(--color-foreground-quaternary)}textarea.sc-ds-message-composer:focus,textarea.sc-ds-message-composer:focus-visible{outline:none}.message-composer__tools.sc-ds-message-composer{display:flex;align-items:center;gap:var(--dimension-space-050);min-height:var(--dimension-size-400)}.message-composer__controls.sc-ds-message-composer{display:flex;align-items:center;justify-content:space-between;gap:var(--dimension-space-050);width:100%;min-width:0}.message-composer__actions.sc-ds-message-composer{display:flex;align-items:center;gap:var(--dimension-space-100);flex:0 0 auto;margin-inline-start:auto}@media (forced-colors: active){.message-composer__field.sc-ds-message-composer{border:var(--dimension-stroke-width-012) solid var(--ds-forced-color-control-boundary);box-shadow:none}.message-composer--error.sc-ds-message-composer .message-composer__field.sc-ds-message-composer{border:0}.message-composer--error.sc-ds-message-composer .message-composer__stack.sc-ds-message-composer{border:var(--dimension-stroke-width-025) dashed var(--ds-forced-color-content);box-shadow:none}.message-composer__error-support.sc-ds-message-composer{border-block-end:var(--dimension-stroke-width-012) solid var(--ds-forced-color-content);background:var(--ds-forced-color-surface)}}`;let f=0;const h=e(class e extends s{constructor(e){super();if(e!==false){this.__registerHost()}this.dsInput=o(this,"dsInput",7);this.dsSubmit=o(this,"dsSubmit",7);this.dsStop=o(this,"dsStop",7);this.value="";this.placeholder="Write a message";this.label="Message";this.status="ready";this.isInactive=false;this.submitIntent="brand";this.errorId=`ds-message-composer-error-${++f}`;this.handleInput=e=>{this.value=e.target.value;this.dsInput.emit(this.value)};this.handleKeyDown=e=>{if(e.key!=="Enter"||e.shiftKey||e.isComposing)return;e.preventDefault();this.submit()};this.handleAction=()=>{if(this.streaming)this.dsStop.emit();else this.submit()}}async setFocus(){this.textarea?.focus()}get streaming(){return this.status==="submitted"||this.status==="streaming"}submit(){const e=this.value.trim();if(!e||this.isInactive||this.streaming)return;this.dsSubmit.emit({text:e})}render(){const e=this.status==="error";const s=this.errorMessage||"Message could not be sent.";const o=!this.streaming&&(this.isInactive||!this.value.trim());return r(a,{key:"6ff534c1fa6e81a026bb0ff231f642b09ebcc7ca"},r("form",{key:"26cdb85e1146a1a5aa87d4961e574581f162217b",class:{"message-composer":true,"message-composer--error":e},"aria-busy":this.streaming?"true":undefined,onSubmit:e=>{e.preventDefault();this.submit()}},r("div",{key:"6bfcb12732b4e435ef6779c3f764d943c82302c7",class:"message-composer__attachments"},r("slot",{key:"01b1da7f51515498c79d6a75b69e60bdeae8db42",name:"attachments"})),r("div",{key:"c3a10fb1a6830a9da0b055f881cae133af57f03e",class:"message-composer__stack"},e?r("div",{class:"message-composer__error-support"},r("div",{id:this.errorId,class:"message-composer__error-message",role:"alert"},r("ds-icon",{name:"ExclamationTriangle",size:"xs",color:"inherit"}),r("ds-text",{variant:"text-body-small",color:"negative"},s)),r("div",{class:"message-composer__error-actions"},r("slot",{name:"error-actions"}))):null,r("div",{key:"b084ca4c347f742b95fe34d28da346f12fa189fa",class:"message-composer__field"},r("textarea",{key:"5f8856de1508a79a878b78b372130a10ed0b8ffc",ref:e=>{this.textarea=e},value:this.value,placeholder:this.placeholder,"aria-label":this.label,"aria-invalid":e?"true":undefined,"aria-describedby":e?this.errorId:undefined,disabled:this.isInactive,onInput:this.handleInput,onKeyDown:this.handleKeyDown}),r("div",{key:"3cf879e3b0b01fe9ac201ace883526f9d9687656",class:"message-composer__controls"},r("div",{key:"4cb6a188c3b4af47c0fc1ed8bf76216e43fbdbcf",class:"message-composer__tools"},r("slot",{key:"7565da05dad83b53e50e8adb388917cdc9b41ab6",name:"tools"})),r("div",{key:"21fd6315dbadb66756df1d770037a15b0c061d10",class:"message-composer__actions"},r("slot",{key:"c7390f9382e9d8ff9f2d794dee18ef880691d21a",name:"actions"}),o?r("ds-tooltip",{label:"Send message",side:"top",size:"sm"},r("ds-button-unfilled",{class:"message-composer__action",variant:"icon",icon:"ArrowUp",size:"md",rounded:true,"aria-label":"Send message",hasBorder:true,isInactive:true,onDsClick:this.handleAction})):r("ds-tooltip",{label:this.streaming?"Stop response":"Send message",side:"top",size:"sm"},r("ds-button-filled",{class:"message-composer__action",variant:"icon",icon:this.streaming?"SquareFilled":"ArrowUp",intent:this.streaming?"brand":this.submitIntent,contrast:"bold",size:"md",rounded:true,"aria-label":this.streaming?"Stop response":"Send message",onDsClick:this.handleAction}))))))))}get el(){return this}static get style(){return g()}},[262,"ds-message-composer",{value:[1025],placeholder:[1],label:[1],status:[1],errorMessage:[1,"error-message"],isInactive:[4,"is-inactive"],submitIntent:[1,"submit-intent"],setFocus:[64]}]);function b(){if(typeof customElements==="undefined"){return}const e=["ds-message-composer","ds-badge","ds-button-filled","ds-button-unfilled","ds-icon","ds-loader","ds-text","ds-tooltip"];e.forEach((e=>{switch(e){case"ds-message-composer":if(!customElements.get(t(e))){customElements.define(t(e),h)}break;case"ds-badge":if(!customElements.get(t(e))){c()}break;case"ds-button-filled":if(!customElements.get(t(e))){i()}break;case"ds-button-unfilled":if(!customElements.get(t(e))){d()}break;case"ds-icon":if(!customElements.get(t(e))){m()}break;case"ds-loader":if(!customElements.get(t(e))){n()}break;case"ds-text":if(!customElements.get(t(e))){l()}break;case"ds-tooltip":if(!customElements.get(t(e))){p()}break}}))}b();const u=h;const v=b;export{u as DsMessageComposer,v as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=ds-message-composer.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{p as e,H as s,c as t,h as i,a as r,t as a}from"./index.js";import{S as o}from"./p-DuCCuJKI.js";import{r as l}from"./p-ioGH5SoA.js";import{d as n}from"./p-BWJb2rih.js";import{d}from"./p-pJ6gbwSa.js";import{d as c}from"./p-pPtjNRqC.js";import{d as h}from"./p-0XTyQNRG.js";import{d as f}from"./p-BbvAWFJA.js";import{d as g}from"./p-BJf49edB.js";function m(e,s){if(!e.length)return false;if(!s.length)return true;const t=new Set(e);return!s.some((e=>t.has(e)))}function u(e,s){const t=new Set(s);for(const s of e){if(!t.has(s))e.delete(s)}}const v=()=>`@property --ds-scroll-edge-fade-top{syntax:'<length-percentage>';inherits:false;initial-value:0px}@property --ds-scroll-edge-fade-bottom{syntax:'<length-percentage>';inherits:false;initial-value:0px}@property --ds-scroll-edge-fade-left{syntax:'<length-percentage>';inherits:false;initial-value:0px}@property --ds-scroll-edge-fade-right{syntax:'<length-percentage>';inherits:false;initial-value:0px}@keyframes ds-scroll-edge-fade-reveal-top{from{--ds-scroll-edge-fade-top:0px}to{--ds-scroll-edge-fade-top:var(--ds-scroll-edge-fade-target-top)}}@keyframes ds-scroll-edge-fade-reveal-bottom{from{--ds-scroll-edge-fade-bottom:var(--ds-scroll-edge-fade-target-bottom)}to{--ds-scroll-edge-fade-bottom:0px}}@keyframes ds-scroll-edge-fade-reveal-left{from{--ds-scroll-edge-fade-left:0px}to{--ds-scroll-edge-fade-left:var(--ds-scroll-edge-fade-target-left)}}@keyframes ds-scroll-edge-fade-reveal-right{from{--ds-scroll-edge-fade-right:var(--ds-scroll-edge-fade-target-right)}to{--ds-scroll-edge-fade-right:0px}}.scroll-edge-fade.sc-ds-message-scroller{--ds-scroll-edge-fade-size:var(--dimension-size-600);--ds-scroll-edge-fade-reveal-distance:var(--dimension-size-800);--ds-scroll-edge-fade-target-top:0px;--ds-scroll-edge-fade-target-bottom:0px;--ds-scroll-edge-fade-target-left:0px;--ds-scroll-edge-fade-target-right:0px;--ds-scroll-edge-fade-top:var(--ds-scroll-edge-fade-target-top);--ds-scroll-edge-fade-bottom:var(--ds-scroll-edge-fade-target-bottom);--ds-scroll-edge-fade-left:var(--ds-scroll-edge-fade-target-left);--ds-scroll-edge-fade-right:var(--ds-scroll-edge-fade-target-right);--ds-scroll-edge-fade-block-mask:linear-gradient( to bottom, transparent 0, #000 var(--ds-scroll-edge-fade-top), #000 calc(100% - var(--ds-scroll-edge-fade-bottom)), transparent 100% );--ds-scroll-edge-fade-inline-mask:linear-gradient( to right, transparent 0, #000 var(--ds-scroll-edge-fade-left), #000 calc(100% - var(--ds-scroll-edge-fade-right)), transparent 100% );-webkit-mask-image:var(--ds-scroll-edge-fade-block-mask), var(--ds-scroll-edge-fade-inline-mask);mask-image:var(--ds-scroll-edge-fade-block-mask), var(--ds-scroll-edge-fade-inline-mask);-webkit-mask-composite:source-in;mask-composite:intersect;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:100% 100%;mask-size:100% 100%}.scroll-edge-fade--top.sc-ds-message-scroller{--ds-scroll-edge-fade-target-top:var(--ds-scroll-edge-fade-size)}.scroll-edge-fade--bottom.sc-ds-message-scroller{--ds-scroll-edge-fade-target-bottom:var(--ds-scroll-edge-fade-size)}.scroll-edge-fade--left.sc-ds-message-scroller{--ds-scroll-edge-fade-target-left:var(--ds-scroll-edge-fade-size)}.scroll-edge-fade--right.sc-ds-message-scroller{--ds-scroll-edge-fade-target-right:var(--ds-scroll-edge-fade-size)}.scroll-edge-fade--top-at-edge.sc-ds-message-scroller{--ds-scroll-edge-fade-target-top:0px}.scroll-edge-fade--bottom-at-edge.sc-ds-message-scroller{--ds-scroll-edge-fade-target-bottom:0px}.scroll-edge-fade--left-at-edge.sc-ds-message-scroller{--ds-scroll-edge-fade-target-left:0px}.scroll-edge-fade--right-at-edge.sc-ds-message-scroller{--ds-scroll-edge-fade-target-right:0px}@supports (animation-timeline: scroll()){.scroll-edge-fade--scroll-aware.sc-ds-message-scroller{animation-name:ds-scroll-edge-fade-reveal-top, ds-scroll-edge-fade-reveal-bottom, ds-scroll-edge-fade-reveal-left, ds-scroll-edge-fade-reveal-right;animation-duration:1ms;animation-timing-function:ease-in-out;animation-fill-mode:both;animation-timeline:scroll(self y), scroll(self y), scroll(self x), scroll(self x);animation-range:0 var(--ds-scroll-edge-fade-reveal-distance), calc(100% - var(--ds-scroll-edge-fade-reveal-distance)) 100%, 0 var(--ds-scroll-edge-fade-reveal-distance), calc(100% - var(--ds-scroll-edge-fade-reveal-distance)) 100%}@media (prefers-reduced-motion: reduce){.scroll-edge-fade--scroll-aware.sc-ds-message-scroller{animation:none}}}.scroll-edge-fade--at-end.sc-ds-message-scroller,.scroll-edge-fade--hidden.sc-ds-message-scroller{-webkit-mask-image:none;mask-image:none}.scroll-edge-fade--block-window.sc-ds-message-scroller{--ds-scroll-edge-fade-window-start:100%;--ds-scroll-edge-fade-window-end:100%;-webkit-mask-image:linear-gradient( to bottom, #000 0, #000 var(--ds-scroll-edge-fade-window-start), transparent var(--ds-scroll-edge-fade-window-end) );mask-image:linear-gradient( to bottom, #000 0, #000 var(--ds-scroll-edge-fade-window-start), transparent var(--ds-scroll-edge-fade-window-end) );-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}`;const p=()=>`.ds-control-elevation.sc-ds-message-scroller-h,.ds-control-elevation.sc-ds-message-scroller{position:relative;overflow:visible;box-shadow:var(--ds-control-elevation-shadow, none)}.ds-control-elevation.sc-ds-message-scroller-h::after,.ds-control-elevation.sc-ds-message-scroller::after{content:'';position:absolute;inset:0;z-index:4;border-radius:inherit;box-shadow:var(--ds-control-elevation-highlight, none);pointer-events:none}.ds-control-elevation--sm.sc-ds-message-scroller-h,.ds-control-elevation--sm.sc-ds-message-scroller{--ds-control-elevation-shadow:var(--effect-shadow-elevated-sm);--ds-control-elevation-highlight:var(--effect-highlight-elevated-sm)}.ds-control-elevation--md.sc-ds-message-scroller-h,.ds-control-elevation--md.sc-ds-message-scroller{--ds-control-elevation-shadow:var(--effect-shadow-elevated-md);--ds-control-elevation-highlight:var(--effect-highlight-elevated-md)}.ds-control-elevation--floating.sc-ds-message-scroller-h,.ds-control-elevation--floating.sc-ds-message-scroller{--ds-control-elevation-shadow:var(--effect-shadow-elevated-floating);--ds-control-elevation-highlight:var(--effect-highlight-elevated-floating)}.ds-control-elevation--press-scale.sc-ds-message-scroller{--ds-control-press-active-scale:var(--dimension-scale-default);transition:scale var(--effect-motion-short-2)}.ds-control-elevation--press-scale[data-ds-press-active].sc-ds-message-scroller{scale:var(--dimension-scale-subtle)}@media (prefers-reduced-motion: reduce){.ds-control-elevation--press-scale.sc-ds-message-scroller,.ds-control-elevation--press-scale[data-ds-press-active].sc-ds-message-scroller{scale:none;transition:none}}.sc-ds-message-scroller-h{--ds-message-scroller-anchor-offset:var(--dimension-space-800);display:block;width:100%;height:100%;min-height:0;box-sizing:border-box}.message-scroller.sc-ds-message-scroller{position:relative;width:100%;height:100%;min-height:0}.message-scroller__viewport.sc-ds-message-scroller{width:100%;height:100%;min-height:0;overflow:auto;overflow-anchor:none;overscroll-behavior:contain;box-sizing:border-box}.message-scroller__viewport.sc-ds-message-scroller:focus-visible{outline:var(--dimension-stroke-width-025) solid var(--color-border-bold-brand);outline-offset:calc(-1 * var(--dimension-stroke-width-025))}.message-scroller__content.sc-ds-message-scroller{display:flex;flex-direction:column;gap:var(--dimension-space-300);width:100%;max-width:var(--ds-message-scroller-content-max-width, var(--dimension-panel-width-2xl));min-height:100%;margin-inline:auto;padding-block-start:var(--dimension-space-200);padding-inline:var(--dimension-space-200);padding-block-end:max( calc(var(--dimension-space-200) + var(--ds-scroll-overlay-block-size, 0px)), var(--ds-message-scroller-turn-clearance, 0px) );box-sizing:border-box}.message-scroller__overlay.sc-ds-message-scroller{position:absolute;right:0;bottom:0;left:0;z-index:var(--dimension-z-index-floating)}.message-scroller__overlay-stack.sc-ds-message-scroller{display:grid;width:100%}.message-scroller__interaction.sc-ds-message-scroller,.message-scroller__overlay-content.sc-ds-message-scroller{min-width:0}.message-scroller__control.sc-ds-message-scroller{position:absolute;bottom:calc(var(--ds-scroll-overlay-content-block-size, 0px) + var(--dimension-space-200));left:50%;z-index:var(--dimension-z-index-floating);display:flex;align-items:center;justify-content:center;border-radius:var(--dimension-radius-half);background:var(--color-background-transparent);transform:translateX(-50%);-webkit-backdrop-filter:blur(var(--effect-blur-sm));backdrop-filter:blur(var(--effect-blur-sm))}`;const b=24;const k=e(class e extends s{constructor(e){super();if(e!==false){this.__registerHost()}this.dsReachStart=t(this,"dsReachStart",7);this.busy=false;this.autoFollow=true;this.defaultPosition="last-anchor";this.messagesLabel="Messages";this.showScrollToLatest=false;this.following=true;this.followReleased=false;this.releasePendingAtLiveEdge=false;this.atStart=false;this.programmatic=false;this.transcriptChildren=[];this.knownTranscriptElements=new Set;this.knownTurnAnchors=new Set;this.turnClearance=0;this.prependReconciliation=0;this.turnPositionGeneration=0;this.defaultPositionGeneration=0;this.transcriptResetPending=false;this.hasLoaded=false;this.handleTranscriptChange=()=>{const e=this.getTranscriptChildren();const s=this.transcriptChildren;const t=m(s,e)||this.transcriptResetPending&&e.length>0;if(t){this.invalidateTranscriptWork();this.resetTranscriptTracking();this.resetTranscriptPositionState();this.transcriptChildren=e;this.trackTranscript(e);this.transcriptResetPending=e.length===0;this.rememberFirstChildTop();this.scrollOverlayController?.sync();if(e.length)this.scheduleDefaultPosition();return}const i=this.knownTranscriptElements.size>0;const r=new Set(this.knownTranscriptElements);const a=[...e].reverse().find(((s,t)=>{if(!s.matches("ds-message[scroll-anchor]")||this.knownTurnAnchors.has(s)){return false}const i=e.length-t-1;return e.slice(i+1).every((e=>!this.knownTranscriptElements.has(e)))}));this.trackTranscript(e);this.pruneTranscriptTracking(e);if(!s.length){this.transcriptChildren=e;if(a&&i){this.scheduleNewTurnPosition(a)}return}const o=e.findIndex((e=>r.has(e)));const l=e.filter((e=>!r.has(e)));const n=e.length>s.length&&s.every(((t,i)=>e[e.length-s.length+i]===t))||!a&&l.length>0&&o>0&&l.every((s=>e.indexOf(s)<o));this.transcriptChildren=e;if(n){if(this.viewport){const e=this.activeTurnAnchor?.isConnected?this.activeTurnAnchor:s[0];const t=this.activeTurnAnchor?.isConnected?this.activeTurnAnchorViewportTop:this.firstChildViewportTop;if(e&&t!==undefined){this.reconcilePrependPosition(e,t);this.schedulePrependReconciliation(e,t,l)}}this.rememberFirstChildTop();this.rememberActiveTurnAnchorTop();this.scrollOverlayController?.sync();return}if(a){this.scheduleNewTurnPosition(a)}};this.handleTranscriptSlotChange=()=>this.handleTranscriptChange();this.handleScroll=()=>{if(!this.viewport)return;this.scrollOverlayController?.sync();this.rememberFirstChildTop();this.rememberActiveTurnAnchorTop();if(this.programmatic)return;const e=this.isAtLiveEdge();if(this.releasePendingAtLiveEdge&&e){this.following=false;this.followReleased=true;this.showScrollToLatest=false;return}this.releasePendingAtLiveEdge=false;this.following=e;this.followReleased=!this.following;this.showScrollToLatest=!this.following;const s=this.viewport.scrollTop<=b;if(s&&!this.atStart)this.dsReachStart.emit();this.atStart=s};this.releaseFollow=()=>{this.prependReconciliation+=1;this.releasePendingAtLiveEdge=this.isAtLiveEdge();this.following=false;this.followReleased=true;this.showScrollToLatest=!this.releasePendingAtLiveEdge};this.handleSelectionChange=()=>{const e=document.getSelection();if(e&&!e.isCollapsed&&e.anchorNode&&this.el.contains(e.anchorNode)){this.releaseFollow()}}}componentDidLoad(){this.hasLoaded=true;this.seedTranscriptBaseline();this.connectObservers();this.scheduleDefaultPosition();document.removeEventListener("selectionchange",this.handleSelectionChange);document.addEventListener("selectionchange",this.handleSelectionChange)}connectedCallback(){if(!this.hasLoaded)return;this.seedTranscriptBaseline();this.connectObservers();this.scheduleDefaultPosition();document.removeEventListener("selectionchange",this.handleSelectionChange);document.addEventListener("selectionchange",this.handleSelectionChange)}disconnectedCallback(){this.invalidateTranscriptWork();this.scrollOverlayController?.disconnect();this.scrollOverlayController=undefined;this.mutationObserver?.disconnect();this.mutationObserver=undefined;this.resetTranscriptTracking();this.resetTranscriptPositionState();this.transcriptResetPending=false;document.removeEventListener("selectionchange",this.handleSelectionChange)}async scrollToMessage(e){const s=Array.from(this.el.querySelectorAll("ds-message")).find((s=>s.messageId===e||s.getAttribute("message-id")===e));if(!s)return false;this.releasePendingAtLiveEdge=false;this.following=false;this.followReleased=true;this.showScrollToLatest=true;s.scrollIntoView({block:"start",behavior:this.motionBehavior()});return true}async scrollToStart(){this.releasePendingAtLiveEdge=false;this.scrollTo(0);this.following=false;this.followReleased=true;this.showScrollToLatest=Boolean(this.viewport&&this.viewport.scrollHeight>this.viewport.clientHeight)}async scrollToEnd(){this.releasePendingAtLiveEdge=false;this.following=true;this.followReleased=false;this.showScrollToLatest=false;this.scrollTo(this.viewport?.scrollHeight??0)}motionBehavior(){return matchMedia("(prefers-reduced-motion: reduce)").matches?"auto":"smooth"}scrollTo(e){if(!this.viewport)return;this.programmatic=true;const s=this.motionBehavior();this.viewport.scrollTo({top:e,behavior:s});if(this.programmaticTimer)clearTimeout(this.programmaticTimer);this.programmaticTimer=setTimeout((()=>{this.programmatic=false;this.programmaticTimer=undefined;if(this.following){this.viewport.scrollTop=e;this.showScrollToLatest=false}}),s==="smooth"?600:0)}invalidateTranscriptWork(){this.prependReconciliation+=1;this.turnPositionGeneration+=1;this.defaultPositionGeneration+=1;if(this.programmaticTimer)clearTimeout(this.programmaticTimer);this.programmaticTimer=undefined;this.programmatic=false}clearActiveTurnAnchor(){this.activeTurnAnchor=undefined;this.activeTurnAnchorViewportTop=undefined;this.turnClearance=0;this.el.style.removeProperty("--ds-message-scroller-turn-clearance")}resetTranscriptTracking(){this.transcriptChildren=[];this.knownTranscriptElements.clear();this.knownTurnAnchors.clear();this.firstChildViewportTop=undefined;this.clearActiveTurnAnchor()}resetTranscriptPositionState(){this.following=true;this.followReleased=false;this.releasePendingAtLiveEdge=false;this.atStart=false;this.showScrollToLatest=false}trackTranscript(e){e.forEach((e=>{this.knownTranscriptElements.add(e);if(e.matches("ds-message[scroll-anchor]")){this.knownTurnAnchors.add(e)}}))}seedTranscriptBaseline(){this.resetTranscriptTracking();this.transcriptChildren=this.getTranscriptChildren();this.trackTranscript(this.transcriptChildren);this.transcriptResetPending=false;this.rememberFirstChildTop()}pruneTranscriptTracking(e){u(this.knownTranscriptElements,e);u(this.knownTurnAnchors,e);if(this.activeTurnAnchor&&!e.includes(this.activeTurnAnchor)){this.clearActiveTurnAnchor()}}scheduleDefaultPosition(){const e=++this.defaultPositionGeneration;requestAnimationFrame((()=>{if(e!==this.defaultPositionGeneration||!this.el.isConnected)return;this.applyDefaultPosition()}))}connectObservers(){if(!this.viewport||!this.content||!this.overlay)return;this.scrollOverlayController?.disconnect();this.mutationObserver?.disconnect();this.scrollOverlayController=new o({host:this.el,viewport:this.viewport,content:this.content,overlay:this.overlay,overlayContentSelector:".message-scroller__overlay-stack",onGeometryChange:()=>this.handleContentGrowth()});this.scrollOverlayController.connect();this.mutationObserver=new MutationObserver((()=>{this.handleTranscriptChange();this.handleContentGrowth()}));this.mutationObserver.observe(this.el,{childList:true,subtree:true,characterData:true})}handleContentGrowth(){if(!this.viewport)return;this.syncTurnClearance();const e=this.viewport.scrollHeight;if(this.autoFollow&&this.following&&!this.followReleased){this.viewport.scrollTop=e}if(this.releasePendingAtLiveEdge&&!this.isAtLiveEdge()){this.releasePendingAtLiveEdge=false}this.showScrollToLatest=!this.following&&!this.isAtLiveEdge();this.scrollOverlayController?.sync()}rememberFirstChildTop(){if(!this.viewport)return;const e=this.getTranscriptChildren()[0];this.firstChildViewportTop=e?e.getBoundingClientRect().top-this.viewport.getBoundingClientRect().top:undefined}getTranscriptChildren(){const e=this.transcriptSlot?.assignedElements()??[];const t=e.filter((e=>e instanceof s&&(e.matches("ds-message")||e.matches("ds-agent-response"))));const i=Array.from(this.el.querySelectorAll("ds-message, ds-agent-response")).filter((e=>{if(e.closest(".message-scroller__interaction, .message-scroller__overlay-content")){return false}if(e.matches("ds-agent-response"))return true;return!e.closest("ds-agent-response")}));return i.length>t.length?i:t}reconcilePrependPosition(e,s){if(!this.viewport||!e.isConnected)return;const t=e.getBoundingClientRect().top-this.viewport.getBoundingClientRect().top;this.viewport.scrollTop+=t-s}schedulePrependReconciliation(e,s,t){const i=++this.prependReconciliation;const r=t.flatMap((e=>[e,...Array.from(e.querySelectorAll("*"))])).map((e=>{const s=e.componentOnReady;return s?s.call(e).catch((()=>undefined)):null})).filter((e=>Boolean(e)));void Promise.all(r).then((()=>{requestAnimationFrame((()=>{if(i!==this.prependReconciliation)return;this.reconcilePrependPosition(e,s);requestAnimationFrame((()=>{if(i!==this.prependReconciliation)return;this.reconcilePrependPosition(e,s);this.rememberFirstChildTop();this.rememberActiveTurnAnchorTop();this.scrollOverlayController?.sync()}))}))}))}scheduleNewTurnPosition(e){const s=++this.turnPositionGeneration;requestAnimationFrame((()=>{if(s!==this.turnPositionGeneration||!e.isConnected||!this.viewport){return}this.positionNewTurn(e,s)}))}positionNewTurn(e,s){if(s!==this.turnPositionGeneration||!this.viewport||!e.isConnected)return;this.activeTurnAnchor=e;this.syncTurnClearance();requestAnimationFrame((()=>{if(s!==this.turnPositionGeneration)return;this.finishPositionNewTurn(e,s)}))}finishPositionNewTurn(e,s){if(s!==this.turnPositionGeneration||!this.viewport||!e.isConnected){return}const t=this.viewport.getBoundingClientRect();const i=e.getBoundingClientRect().top-t.top+this.viewport.scrollTop;const r=getComputedStyle(this.el).getPropertyValue("--ds-message-scroller-anchor-offset").trim();const a=l(r,"var(--dimension-space-800)");const o=Math.max(this.viewport.scrollHeight-this.viewport.clientHeight,0);const n=Math.min(Math.max(i-a,0),o);this.following=o-n<=b;this.followReleased=!this.following;this.showScrollToLatest=!this.following;this.programmatic=true;this.viewport.scrollTop=n;requestAnimationFrame((()=>{if(s!==this.turnPositionGeneration)return;this.programmatic=false;this.following=this.isAtLiveEdge();this.followReleased=!this.following;this.showScrollToLatest=!this.following;this.rememberFirstChildTop();this.rememberActiveTurnAnchorTop()}));this.scrollOverlayController?.sync()}rememberActiveTurnAnchorTop(){if(!this.viewport||!this.activeTurnAnchor?.isConnected)return;this.activeTurnAnchorViewportTop=this.activeTurnAnchor.getBoundingClientRect().top-this.viewport.getBoundingClientRect().top}syncTurnClearance(){if(!this.viewport||!this.activeTurnAnchor?.isConnected)return;const e=this.getTranscriptChildren();const s=e[e.length-1];if(!s)return;const t=this.activeTurnAnchor.getBoundingClientRect();const i=s.getBoundingClientRect();const r=getComputedStyle(this.el).getPropertyValue("--ds-message-scroller-anchor-offset").trim();const a=l(r,"var(--dimension-space-800)");const o=Math.max(i.bottom-t.top,0);const n=Math.max(Math.ceil(this.viewport.clientHeight-a-o),0);if(n===this.turnClearance)return;this.turnClearance=n;this.el.style.setProperty("--ds-message-scroller-turn-clearance",`${n}px`)}applyDefaultPosition(){if(!this.viewport)return;this.releasePendingAtLiveEdge=false;if(this.defaultPosition==="start"){this.viewport.scrollTop=0;this.following=false;this.followReleased=true;this.showScrollToLatest=this.viewport.scrollHeight>this.viewport.clientHeight;this.scrollOverlayController?.sync();return}if(this.defaultPosition==="last-anchor"){const e=this.el.querySelectorAll("ds-message[scroll-anchor]");const s=e.item(e.length-1);if(s){s.scrollIntoView({block:"start"});this.following=this.isAtLiveEdge();this.followReleased=!this.following;this.showScrollToLatest=!this.following;this.scrollOverlayController?.sync();return}}this.viewport.scrollTop=this.viewport.scrollHeight;this.following=true;this.followReleased=false;this.showScrollToLatest=false;this.scrollOverlayController?.sync()}isAtLiveEdge(){if(!this.viewport)return true;return this.viewport.scrollHeight-this.viewport.clientHeight-this.viewport.scrollTop<=b}render(){return i(r,{key:"36cbd435ca6b16eba6c5155f6b55a71f308cb674"},i("div",{key:"370a3a071dc682b8ad1bd65bff34e76a2634176a",class:"message-scroller"},i("div",{key:"3bcbb93b9b36d0b26052139164c3fc66e47af794",class:"message-scroller__viewport",ref:e=>{this.viewport=e},role:"region","aria-label":this.messagesLabel,tabIndex:0,onScroll:this.handleScroll,onPointerDown:e=>{if(e.pointerType==="touch")this.releaseFollow()},onWheel:this.releaseFollow,onKeyDown:e=>{if(["ArrowUp","ArrowDown","PageUp","PageDown","Home","End"," "].includes(e.key)){this.releaseFollow()}}},i("div",{key:"382ea3754b5d56d804fbd15ec63d888f66733c47",class:"message-scroller__content scroll-edge-fade--block-window",ref:e=>{this.content=e},role:"log","aria-live":"polite","aria-relevant":"additions","aria-busy":this.busy?"true":undefined},i("slot",{key:"8026bf357bc1ad40114a18f2e0031d7da5b30a43",ref:e=>{this.transcriptSlot=e},onSlotchange:this.handleTranscriptSlotChange}))),i("div",{key:"a1cea9e82abea7d65358541356d41c3ce8dbc622",class:"message-scroller__overlay",ref:e=>{this.overlay=e}},i("div",{key:"5ee0074b3f94b99a42bfd19b07220e40665b1622",class:"message-scroller__overlay-stack"},i("div",{key:"02a3f2ae111cf092e384141eb859f01a0c8f9513",class:"message-scroller__interaction"},i("slot",{key:"4ae81b2b9f71ee91046f56497be31ec741c4f015",name:"interaction"})),i("div",{key:"54b77abc8f1fe3cee456767c5c53323e57ffe883",class:"message-scroller__overlay-content"},i("slot",{key:"222952bce69d0c2d91cce593783dbc51904aacdb",name:"overlay"})))),this.showScrollToLatest?i("div",{class:"message-scroller__control ds-control-elevation ds-control-elevation--md ds-control-elevation--press-scale"},i("ds-tooltip",{label:"Scroll to latest message",side:"top",size:"sm"},i("ds-button-unfilled",{variant:"icon",icon:"ChevronDown",size:"md",rounded:true,hasBorder:false,"aria-label":"Scroll to latest message",onDsClick:()=>void this.scrollToEnd()}))):null))}get el(){return this}static get style(){return v()+p()}},[262,"ds-message-scroller",{busy:[4],autoFollow:[4,"auto-follow"],defaultPosition:[1,"default-position"],messagesLabel:[1,"messages-label"],showScrollToLatest:[32],scrollToMessage:[64],scrollToStart:[64],scrollToEnd:[64]}]);function w(){if(typeof customElements==="undefined"){return}const e=["ds-message-scroller","ds-badge","ds-button-unfilled","ds-icon","ds-loader","ds-text","ds-tooltip"];e.forEach((e=>{switch(e){case"ds-message-scroller":if(!customElements.get(a(e))){customElements.define(a(e),k)}break;case"ds-badge":if(!customElements.get(a(e))){n()}break;case"ds-button-unfilled":if(!customElements.get(a(e))){d()}break;case"ds-icon":if(!customElements.get(a(e))){c()}break;case"ds-loader":if(!customElements.get(a(e))){h()}break;case"ds-text":if(!customElements.get(a(e))){f()}break;case"ds-tooltip":if(!customElements.get(a(e))){g()}break}}))}w();const y=k;const x=w;export{y as DsMessageScroller,x as defineCustomElement};
|
|
1
|
+
import{p as e,H as s,c as t,h as i,a as r,t as a}from"./index.js";import{S as o}from"./p-DuCCuJKI.js";import{r as l}from"./p-ioGH5SoA.js";import{d as n}from"./p-BWJb2rih.js";import{d}from"./p-kL4EOsx5.js";import{d as c}from"./p-BVsVUnAw.js";import{d as h}from"./p-0XTyQNRG.js";import{d as f}from"./p-BbvAWFJA.js";import{d as g}from"./p-BJf49edB.js";function m(e,s){if(!e.length)return false;if(!s.length)return true;const t=new Set(e);return!s.some((e=>t.has(e)))}function u(e,s){const t=new Set(s);for(const s of e){if(!t.has(s))e.delete(s)}}const v=()=>`@property --ds-scroll-edge-fade-top{syntax:'<length-percentage>';inherits:false;initial-value:0px}@property --ds-scroll-edge-fade-bottom{syntax:'<length-percentage>';inherits:false;initial-value:0px}@property --ds-scroll-edge-fade-left{syntax:'<length-percentage>';inherits:false;initial-value:0px}@property --ds-scroll-edge-fade-right{syntax:'<length-percentage>';inherits:false;initial-value:0px}@keyframes ds-scroll-edge-fade-reveal-top{from{--ds-scroll-edge-fade-top:0px}to{--ds-scroll-edge-fade-top:var(--ds-scroll-edge-fade-target-top)}}@keyframes ds-scroll-edge-fade-reveal-bottom{from{--ds-scroll-edge-fade-bottom:var(--ds-scroll-edge-fade-target-bottom)}to{--ds-scroll-edge-fade-bottom:0px}}@keyframes ds-scroll-edge-fade-reveal-left{from{--ds-scroll-edge-fade-left:0px}to{--ds-scroll-edge-fade-left:var(--ds-scroll-edge-fade-target-left)}}@keyframes ds-scroll-edge-fade-reveal-right{from{--ds-scroll-edge-fade-right:var(--ds-scroll-edge-fade-target-right)}to{--ds-scroll-edge-fade-right:0px}}.scroll-edge-fade.sc-ds-message-scroller{--ds-scroll-edge-fade-size:var(--dimension-size-600);--ds-scroll-edge-fade-reveal-distance:var(--dimension-size-800);--ds-scroll-edge-fade-target-top:0px;--ds-scroll-edge-fade-target-bottom:0px;--ds-scroll-edge-fade-target-left:0px;--ds-scroll-edge-fade-target-right:0px;--ds-scroll-edge-fade-top:var(--ds-scroll-edge-fade-target-top);--ds-scroll-edge-fade-bottom:var(--ds-scroll-edge-fade-target-bottom);--ds-scroll-edge-fade-left:var(--ds-scroll-edge-fade-target-left);--ds-scroll-edge-fade-right:var(--ds-scroll-edge-fade-target-right);--ds-scroll-edge-fade-block-mask:linear-gradient( to bottom, transparent 0, #000 var(--ds-scroll-edge-fade-top), #000 calc(100% - var(--ds-scroll-edge-fade-bottom)), transparent 100% );--ds-scroll-edge-fade-inline-mask:linear-gradient( to right, transparent 0, #000 var(--ds-scroll-edge-fade-left), #000 calc(100% - var(--ds-scroll-edge-fade-right)), transparent 100% );-webkit-mask-image:var(--ds-scroll-edge-fade-block-mask), var(--ds-scroll-edge-fade-inline-mask);mask-image:var(--ds-scroll-edge-fade-block-mask), var(--ds-scroll-edge-fade-inline-mask);-webkit-mask-composite:source-in;mask-composite:intersect;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:100% 100%;mask-size:100% 100%}.scroll-edge-fade--top.sc-ds-message-scroller{--ds-scroll-edge-fade-target-top:var(--ds-scroll-edge-fade-size)}.scroll-edge-fade--bottom.sc-ds-message-scroller{--ds-scroll-edge-fade-target-bottom:var(--ds-scroll-edge-fade-size)}.scroll-edge-fade--left.sc-ds-message-scroller{--ds-scroll-edge-fade-target-left:var(--ds-scroll-edge-fade-size)}.scroll-edge-fade--right.sc-ds-message-scroller{--ds-scroll-edge-fade-target-right:var(--ds-scroll-edge-fade-size)}.scroll-edge-fade--top-at-edge.sc-ds-message-scroller{--ds-scroll-edge-fade-target-top:0px}.scroll-edge-fade--bottom-at-edge.sc-ds-message-scroller{--ds-scroll-edge-fade-target-bottom:0px}.scroll-edge-fade--left-at-edge.sc-ds-message-scroller{--ds-scroll-edge-fade-target-left:0px}.scroll-edge-fade--right-at-edge.sc-ds-message-scroller{--ds-scroll-edge-fade-target-right:0px}@supports (animation-timeline: scroll()){.scroll-edge-fade--scroll-aware.sc-ds-message-scroller{animation-name:ds-scroll-edge-fade-reveal-top, ds-scroll-edge-fade-reveal-bottom, ds-scroll-edge-fade-reveal-left, ds-scroll-edge-fade-reveal-right;animation-duration:1ms;animation-timing-function:ease-in-out;animation-fill-mode:both;animation-timeline:scroll(self y), scroll(self y), scroll(self x), scroll(self x);animation-range:0 var(--ds-scroll-edge-fade-reveal-distance), calc(100% - var(--ds-scroll-edge-fade-reveal-distance)) 100%, 0 var(--ds-scroll-edge-fade-reveal-distance), calc(100% - var(--ds-scroll-edge-fade-reveal-distance)) 100%}@media (prefers-reduced-motion: reduce){.scroll-edge-fade--scroll-aware.sc-ds-message-scroller{animation:none}}}.scroll-edge-fade--at-end.sc-ds-message-scroller,.scroll-edge-fade--hidden.sc-ds-message-scroller{-webkit-mask-image:none;mask-image:none}.scroll-edge-fade--block-window.sc-ds-message-scroller{--ds-scroll-edge-fade-window-start:100%;--ds-scroll-edge-fade-window-end:100%;-webkit-mask-image:linear-gradient( to bottom, #000 0, #000 var(--ds-scroll-edge-fade-window-start), transparent var(--ds-scroll-edge-fade-window-end) );mask-image:linear-gradient( to bottom, #000 0, #000 var(--ds-scroll-edge-fade-window-start), transparent var(--ds-scroll-edge-fade-window-end) );-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}`;const p=()=>`.ds-control-elevation.sc-ds-message-scroller-h,.ds-control-elevation.sc-ds-message-scroller{position:relative;overflow:visible;box-shadow:var(--ds-control-elevation-shadow, none)}.ds-control-elevation.sc-ds-message-scroller-h::after,.ds-control-elevation.sc-ds-message-scroller::after{content:'';position:absolute;inset:0;z-index:4;border-radius:inherit;box-shadow:var(--ds-control-elevation-highlight, none);pointer-events:none}.ds-control-elevation--sm.sc-ds-message-scroller-h,.ds-control-elevation--sm.sc-ds-message-scroller{--ds-control-elevation-shadow:var(--effect-shadow-elevated-sm);--ds-control-elevation-highlight:var(--effect-highlight-elevated-sm)}.ds-control-elevation--md.sc-ds-message-scroller-h,.ds-control-elevation--md.sc-ds-message-scroller{--ds-control-elevation-shadow:var(--effect-shadow-elevated-md);--ds-control-elevation-highlight:var(--effect-highlight-elevated-md)}.ds-control-elevation--floating.sc-ds-message-scroller-h,.ds-control-elevation--floating.sc-ds-message-scroller{--ds-control-elevation-shadow:var(--effect-shadow-elevated-floating);--ds-control-elevation-highlight:var(--effect-highlight-elevated-floating)}.ds-control-elevation--press-scale.sc-ds-message-scroller{--ds-control-press-active-scale:var(--dimension-scale-default);transition:scale var(--effect-motion-short-2)}.ds-control-elevation--press-scale[data-ds-press-active].sc-ds-message-scroller{scale:var(--dimension-scale-subtle)}@media (prefers-reduced-motion: reduce){.ds-control-elevation--press-scale.sc-ds-message-scroller,.ds-control-elevation--press-scale[data-ds-press-active].sc-ds-message-scroller{scale:none;transition:none}}.sc-ds-message-scroller-h{--ds-message-scroller-anchor-offset:var(--dimension-space-800);display:block;width:100%;height:100%;min-height:0;box-sizing:border-box}.message-scroller.sc-ds-message-scroller{position:relative;width:100%;height:100%;min-height:0}.message-scroller__viewport.sc-ds-message-scroller{width:100%;height:100%;min-height:0;overflow:auto;overflow-anchor:none;overscroll-behavior:contain;box-sizing:border-box}.message-scroller__viewport.sc-ds-message-scroller:focus-visible{outline:var(--dimension-stroke-width-025) solid var(--color-border-bold-brand);outline-offset:calc(-1 * var(--dimension-stroke-width-025))}.message-scroller__content.sc-ds-message-scroller{display:flex;flex-direction:column;gap:var(--dimension-space-300);width:100%;max-width:var(--ds-message-scroller-content-max-width, var(--dimension-panel-width-2xl));min-height:100%;margin-inline:auto;padding-block-start:var(--dimension-space-200);padding-inline:var(--dimension-space-200);padding-block-end:max( calc(var(--dimension-space-200) + var(--ds-scroll-overlay-block-size, 0px)), var(--ds-message-scroller-turn-clearance, 0px) );box-sizing:border-box}.message-scroller__overlay.sc-ds-message-scroller{position:absolute;right:0;bottom:0;left:0;z-index:var(--dimension-z-index-floating)}.message-scroller__overlay-stack.sc-ds-message-scroller{display:grid;width:100%}.message-scroller__interaction.sc-ds-message-scroller,.message-scroller__overlay-content.sc-ds-message-scroller{min-width:0}.message-scroller__control.sc-ds-message-scroller{position:absolute;bottom:calc(var(--ds-scroll-overlay-content-block-size, 0px) + var(--dimension-space-200));left:50%;z-index:var(--dimension-z-index-floating);display:flex;align-items:center;justify-content:center;border-radius:var(--dimension-radius-half);background:var(--color-background-transparent);transform:translateX(-50%);-webkit-backdrop-filter:blur(var(--effect-blur-sm));backdrop-filter:blur(var(--effect-blur-sm))}`;const b=24;const k=e(class e extends s{constructor(e){super();if(e!==false){this.__registerHost()}this.dsReachStart=t(this,"dsReachStart",7);this.busy=false;this.autoFollow=true;this.defaultPosition="last-anchor";this.messagesLabel="Messages";this.showScrollToLatest=false;this.following=true;this.followReleased=false;this.releasePendingAtLiveEdge=false;this.atStart=false;this.programmatic=false;this.transcriptChildren=[];this.knownTranscriptElements=new Set;this.knownTurnAnchors=new Set;this.turnClearance=0;this.prependReconciliation=0;this.turnPositionGeneration=0;this.defaultPositionGeneration=0;this.transcriptResetPending=false;this.hasLoaded=false;this.handleTranscriptChange=()=>{const e=this.getTranscriptChildren();const s=this.transcriptChildren;const t=m(s,e)||this.transcriptResetPending&&e.length>0;if(t){this.invalidateTranscriptWork();this.resetTranscriptTracking();this.resetTranscriptPositionState();this.transcriptChildren=e;this.trackTranscript(e);this.transcriptResetPending=e.length===0;this.rememberFirstChildTop();this.scrollOverlayController?.sync();if(e.length)this.scheduleDefaultPosition();return}const i=this.knownTranscriptElements.size>0;const r=new Set(this.knownTranscriptElements);const a=[...e].reverse().find(((s,t)=>{if(!s.matches("ds-message[scroll-anchor]")||this.knownTurnAnchors.has(s)){return false}const i=e.length-t-1;return e.slice(i+1).every((e=>!this.knownTranscriptElements.has(e)))}));this.trackTranscript(e);this.pruneTranscriptTracking(e);if(!s.length){this.transcriptChildren=e;if(a&&i){this.scheduleNewTurnPosition(a)}return}const o=e.findIndex((e=>r.has(e)));const l=e.filter((e=>!r.has(e)));const n=e.length>s.length&&s.every(((t,i)=>e[e.length-s.length+i]===t))||!a&&l.length>0&&o>0&&l.every((s=>e.indexOf(s)<o));this.transcriptChildren=e;if(n){if(this.viewport){const e=this.activeTurnAnchor?.isConnected?this.activeTurnAnchor:s[0];const t=this.activeTurnAnchor?.isConnected?this.activeTurnAnchorViewportTop:this.firstChildViewportTop;if(e&&t!==undefined){this.reconcilePrependPosition(e,t);this.schedulePrependReconciliation(e,t,l)}}this.rememberFirstChildTop();this.rememberActiveTurnAnchorTop();this.scrollOverlayController?.sync();return}if(a){this.scheduleNewTurnPosition(a)}};this.handleTranscriptSlotChange=()=>this.handleTranscriptChange();this.handleScroll=()=>{if(!this.viewport)return;this.scrollOverlayController?.sync();this.rememberFirstChildTop();this.rememberActiveTurnAnchorTop();if(this.programmatic)return;const e=this.isAtLiveEdge();if(this.releasePendingAtLiveEdge&&e){this.following=false;this.followReleased=true;this.showScrollToLatest=false;return}this.releasePendingAtLiveEdge=false;this.following=e;this.followReleased=!this.following;this.showScrollToLatest=!this.following;const s=this.viewport.scrollTop<=b;if(s&&!this.atStart)this.dsReachStart.emit();this.atStart=s};this.releaseFollow=()=>{this.prependReconciliation+=1;this.releasePendingAtLiveEdge=this.isAtLiveEdge();this.following=false;this.followReleased=true;this.showScrollToLatest=!this.releasePendingAtLiveEdge};this.handleSelectionChange=()=>{const e=document.getSelection();if(e&&!e.isCollapsed&&e.anchorNode&&this.el.contains(e.anchorNode)){this.releaseFollow()}}}componentDidLoad(){this.hasLoaded=true;this.seedTranscriptBaseline();this.connectObservers();this.scheduleDefaultPosition();document.removeEventListener("selectionchange",this.handleSelectionChange);document.addEventListener("selectionchange",this.handleSelectionChange)}connectedCallback(){if(!this.hasLoaded)return;this.seedTranscriptBaseline();this.connectObservers();this.scheduleDefaultPosition();document.removeEventListener("selectionchange",this.handleSelectionChange);document.addEventListener("selectionchange",this.handleSelectionChange)}disconnectedCallback(){this.invalidateTranscriptWork();this.scrollOverlayController?.disconnect();this.scrollOverlayController=undefined;this.mutationObserver?.disconnect();this.mutationObserver=undefined;this.resetTranscriptTracking();this.resetTranscriptPositionState();this.transcriptResetPending=false;document.removeEventListener("selectionchange",this.handleSelectionChange)}async scrollToMessage(e){const s=Array.from(this.el.querySelectorAll("ds-message")).find((s=>s.messageId===e||s.getAttribute("message-id")===e));if(!s)return false;this.releasePendingAtLiveEdge=false;this.following=false;this.followReleased=true;this.showScrollToLatest=true;s.scrollIntoView({block:"start",behavior:this.motionBehavior()});return true}async scrollToStart(){this.releasePendingAtLiveEdge=false;this.scrollTo(0);this.following=false;this.followReleased=true;this.showScrollToLatest=Boolean(this.viewport&&this.viewport.scrollHeight>this.viewport.clientHeight)}async scrollToEnd(){this.releasePendingAtLiveEdge=false;this.following=true;this.followReleased=false;this.showScrollToLatest=false;this.scrollTo(this.viewport?.scrollHeight??0)}motionBehavior(){return matchMedia("(prefers-reduced-motion: reduce)").matches?"auto":"smooth"}scrollTo(e){if(!this.viewport)return;this.programmatic=true;const s=this.motionBehavior();this.viewport.scrollTo({top:e,behavior:s});if(this.programmaticTimer)clearTimeout(this.programmaticTimer);this.programmaticTimer=setTimeout((()=>{this.programmatic=false;this.programmaticTimer=undefined;if(this.following){this.viewport.scrollTop=e;this.showScrollToLatest=false}}),s==="smooth"?600:0)}invalidateTranscriptWork(){this.prependReconciliation+=1;this.turnPositionGeneration+=1;this.defaultPositionGeneration+=1;if(this.programmaticTimer)clearTimeout(this.programmaticTimer);this.programmaticTimer=undefined;this.programmatic=false}clearActiveTurnAnchor(){this.activeTurnAnchor=undefined;this.activeTurnAnchorViewportTop=undefined;this.turnClearance=0;this.el.style.removeProperty("--ds-message-scroller-turn-clearance")}resetTranscriptTracking(){this.transcriptChildren=[];this.knownTranscriptElements.clear();this.knownTurnAnchors.clear();this.firstChildViewportTop=undefined;this.clearActiveTurnAnchor()}resetTranscriptPositionState(){this.following=true;this.followReleased=false;this.releasePendingAtLiveEdge=false;this.atStart=false;this.showScrollToLatest=false}trackTranscript(e){e.forEach((e=>{this.knownTranscriptElements.add(e);if(e.matches("ds-message[scroll-anchor]")){this.knownTurnAnchors.add(e)}}))}seedTranscriptBaseline(){this.resetTranscriptTracking();this.transcriptChildren=this.getTranscriptChildren();this.trackTranscript(this.transcriptChildren);this.transcriptResetPending=false;this.rememberFirstChildTop()}pruneTranscriptTracking(e){u(this.knownTranscriptElements,e);u(this.knownTurnAnchors,e);if(this.activeTurnAnchor&&!e.includes(this.activeTurnAnchor)){this.clearActiveTurnAnchor()}}scheduleDefaultPosition(){const e=++this.defaultPositionGeneration;requestAnimationFrame((()=>{if(e!==this.defaultPositionGeneration||!this.el.isConnected)return;this.applyDefaultPosition()}))}connectObservers(){if(!this.viewport||!this.content||!this.overlay)return;this.scrollOverlayController?.disconnect();this.mutationObserver?.disconnect();this.scrollOverlayController=new o({host:this.el,viewport:this.viewport,content:this.content,overlay:this.overlay,overlayContentSelector:".message-scroller__overlay-stack",onGeometryChange:()=>this.handleContentGrowth()});this.scrollOverlayController.connect();this.mutationObserver=new MutationObserver((()=>{this.handleTranscriptChange();this.handleContentGrowth()}));this.mutationObserver.observe(this.el,{childList:true,subtree:true,characterData:true})}handleContentGrowth(){if(!this.viewport)return;this.syncTurnClearance();const e=this.viewport.scrollHeight;if(this.autoFollow&&this.following&&!this.followReleased){this.viewport.scrollTop=e}if(this.releasePendingAtLiveEdge&&!this.isAtLiveEdge()){this.releasePendingAtLiveEdge=false}this.showScrollToLatest=!this.following&&!this.isAtLiveEdge();this.scrollOverlayController?.sync()}rememberFirstChildTop(){if(!this.viewport)return;const e=this.getTranscriptChildren()[0];this.firstChildViewportTop=e?e.getBoundingClientRect().top-this.viewport.getBoundingClientRect().top:undefined}getTranscriptChildren(){const e=this.transcriptSlot?.assignedElements()??[];const t=e.filter((e=>e instanceof s&&(e.matches("ds-message")||e.matches("ds-agent-response"))));const i=Array.from(this.el.querySelectorAll("ds-message, ds-agent-response")).filter((e=>{if(e.closest(".message-scroller__interaction, .message-scroller__overlay-content")){return false}if(e.matches("ds-agent-response"))return true;return!e.closest("ds-agent-response")}));return i.length>t.length?i:t}reconcilePrependPosition(e,s){if(!this.viewport||!e.isConnected)return;const t=e.getBoundingClientRect().top-this.viewport.getBoundingClientRect().top;this.viewport.scrollTop+=t-s}schedulePrependReconciliation(e,s,t){const i=++this.prependReconciliation;const r=t.flatMap((e=>[e,...Array.from(e.querySelectorAll("*"))])).map((e=>{const s=e.componentOnReady;return s?s.call(e).catch((()=>undefined)):null})).filter((e=>Boolean(e)));void Promise.all(r).then((()=>{requestAnimationFrame((()=>{if(i!==this.prependReconciliation)return;this.reconcilePrependPosition(e,s);requestAnimationFrame((()=>{if(i!==this.prependReconciliation)return;this.reconcilePrependPosition(e,s);this.rememberFirstChildTop();this.rememberActiveTurnAnchorTop();this.scrollOverlayController?.sync()}))}))}))}scheduleNewTurnPosition(e){const s=++this.turnPositionGeneration;requestAnimationFrame((()=>{if(s!==this.turnPositionGeneration||!e.isConnected||!this.viewport){return}this.positionNewTurn(e,s)}))}positionNewTurn(e,s){if(s!==this.turnPositionGeneration||!this.viewport||!e.isConnected)return;this.activeTurnAnchor=e;this.syncTurnClearance();requestAnimationFrame((()=>{if(s!==this.turnPositionGeneration)return;this.finishPositionNewTurn(e,s)}))}finishPositionNewTurn(e,s){if(s!==this.turnPositionGeneration||!this.viewport||!e.isConnected){return}const t=this.viewport.getBoundingClientRect();const i=e.getBoundingClientRect().top-t.top+this.viewport.scrollTop;const r=getComputedStyle(this.el).getPropertyValue("--ds-message-scroller-anchor-offset").trim();const a=l(r,"var(--dimension-space-800)");const o=Math.max(this.viewport.scrollHeight-this.viewport.clientHeight,0);const n=Math.min(Math.max(i-a,0),o);this.following=o-n<=b;this.followReleased=!this.following;this.showScrollToLatest=!this.following;this.programmatic=true;this.viewport.scrollTop=n;requestAnimationFrame((()=>{if(s!==this.turnPositionGeneration)return;this.programmatic=false;this.following=this.isAtLiveEdge();this.followReleased=!this.following;this.showScrollToLatest=!this.following;this.rememberFirstChildTop();this.rememberActiveTurnAnchorTop()}));this.scrollOverlayController?.sync()}rememberActiveTurnAnchorTop(){if(!this.viewport||!this.activeTurnAnchor?.isConnected)return;this.activeTurnAnchorViewportTop=this.activeTurnAnchor.getBoundingClientRect().top-this.viewport.getBoundingClientRect().top}syncTurnClearance(){if(!this.viewport||!this.activeTurnAnchor?.isConnected)return;const e=this.getTranscriptChildren();const s=e[e.length-1];if(!s)return;const t=this.activeTurnAnchor.getBoundingClientRect();const i=s.getBoundingClientRect();const r=getComputedStyle(this.el).getPropertyValue("--ds-message-scroller-anchor-offset").trim();const a=l(r,"var(--dimension-space-800)");const o=Math.max(i.bottom-t.top,0);const n=Math.max(Math.ceil(this.viewport.clientHeight-a-o),0);if(n===this.turnClearance)return;this.turnClearance=n;this.el.style.setProperty("--ds-message-scroller-turn-clearance",`${n}px`)}applyDefaultPosition(){if(!this.viewport)return;this.releasePendingAtLiveEdge=false;if(this.defaultPosition==="start"){this.viewport.scrollTop=0;this.following=false;this.followReleased=true;this.showScrollToLatest=this.viewport.scrollHeight>this.viewport.clientHeight;this.scrollOverlayController?.sync();return}if(this.defaultPosition==="last-anchor"){const e=this.el.querySelectorAll("ds-message[scroll-anchor]");const s=e.item(e.length-1);if(s){s.scrollIntoView({block:"start"});this.following=this.isAtLiveEdge();this.followReleased=!this.following;this.showScrollToLatest=!this.following;this.scrollOverlayController?.sync();return}}this.viewport.scrollTop=this.viewport.scrollHeight;this.following=true;this.followReleased=false;this.showScrollToLatest=false;this.scrollOverlayController?.sync()}isAtLiveEdge(){if(!this.viewport)return true;return this.viewport.scrollHeight-this.viewport.clientHeight-this.viewport.scrollTop<=b}render(){return i(r,{key:"36cbd435ca6b16eba6c5155f6b55a71f308cb674"},i("div",{key:"370a3a071dc682b8ad1bd65bff34e76a2634176a",class:"message-scroller"},i("div",{key:"3bcbb93b9b36d0b26052139164c3fc66e47af794",class:"message-scroller__viewport",ref:e=>{this.viewport=e},role:"region","aria-label":this.messagesLabel,tabIndex:0,onScroll:this.handleScroll,onPointerDown:e=>{if(e.pointerType==="touch")this.releaseFollow()},onWheel:this.releaseFollow,onKeyDown:e=>{if(["ArrowUp","ArrowDown","PageUp","PageDown","Home","End"," "].includes(e.key)){this.releaseFollow()}}},i("div",{key:"382ea3754b5d56d804fbd15ec63d888f66733c47",class:"message-scroller__content scroll-edge-fade--block-window",ref:e=>{this.content=e},role:"log","aria-live":"polite","aria-relevant":"additions","aria-busy":this.busy?"true":undefined},i("slot",{key:"8026bf357bc1ad40114a18f2e0031d7da5b30a43",ref:e=>{this.transcriptSlot=e},onSlotchange:this.handleTranscriptSlotChange}))),i("div",{key:"a1cea9e82abea7d65358541356d41c3ce8dbc622",class:"message-scroller__overlay",ref:e=>{this.overlay=e}},i("div",{key:"5ee0074b3f94b99a42bfd19b07220e40665b1622",class:"message-scroller__overlay-stack"},i("div",{key:"02a3f2ae111cf092e384141eb859f01a0c8f9513",class:"message-scroller__interaction"},i("slot",{key:"4ae81b2b9f71ee91046f56497be31ec741c4f015",name:"interaction"})),i("div",{key:"54b77abc8f1fe3cee456767c5c53323e57ffe883",class:"message-scroller__overlay-content"},i("slot",{key:"222952bce69d0c2d91cce593783dbc51904aacdb",name:"overlay"})))),this.showScrollToLatest?i("div",{class:"message-scroller__control ds-control-elevation ds-control-elevation--md ds-control-elevation--press-scale"},i("ds-tooltip",{label:"Scroll to latest message",side:"top",size:"sm"},i("ds-button-unfilled",{variant:"icon",icon:"ChevronDown",size:"md",rounded:true,hasBorder:false,"aria-label":"Scroll to latest message",onDsClick:()=>void this.scrollToEnd()}))):null))}get el(){return this}static get style(){return v()+p()}},[262,"ds-message-scroller",{busy:[4],autoFollow:[4,"auto-follow"],defaultPosition:[1,"default-position"],messagesLabel:[1,"messages-label"],showScrollToLatest:[32],scrollToMessage:[64],scrollToStart:[64],scrollToEnd:[64]}]);function w(){if(typeof customElements==="undefined"){return}const e=["ds-message-scroller","ds-badge","ds-button-unfilled","ds-icon","ds-loader","ds-text","ds-tooltip"];e.forEach((e=>{switch(e){case"ds-message-scroller":if(!customElements.get(a(e))){customElements.define(a(e),k)}break;case"ds-badge":if(!customElements.get(a(e))){n()}break;case"ds-button-unfilled":if(!customElements.get(a(e))){d()}break;case"ds-icon":if(!customElements.get(a(e))){c()}break;case"ds-loader":if(!customElements.get(a(e))){h()}break;case"ds-text":if(!customElements.get(a(e))){f()}break;case"ds-tooltip":if(!customElements.get(a(e))){g()}break}}))}w();const y=k;const x=w;export{y as DsMessageScroller,x as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=ds-message-scroller.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{M as o,d as s}from"./p-
|
|
1
|
+
import{M as o,d as s}from"./p-Dvw7N7TH.js";const t=o;const p=s;export{t as DsMobileBarNav,p as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=ds-mobile-bar-nav.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{M as o,d as
|
|
1
|
+
import{M as o,d as r}from"./p-C4YUkrr0.js";const s=o;const t=r;export{s as DsMobileHeader,t as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=ds-mobile-header.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{M as o,d as s}from"./p-
|
|
1
|
+
import{M as o,d as s}from"./p-topqlGsI.js";const t=o;const p=s;export{t as DsMobileSectionSwitcher,p as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=ds-mobile-section-switcher.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{M as
|
|
1
|
+
import{M as o,d as s}from"./p-UWU23pbX.js";const p=o;const t=s;export{p as DsMobileSheetNav,t as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=ds-mobile-sheet-nav.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{M as o,d as s}from"./p-
|
|
1
|
+
import{M as o,d as s}from"./p-BjD1eFx6.js";const t=o;const p=s;export{t as DsModal,p as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=ds-modal.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{p as s,H as t,c as a,h as e,a as i,t as o}from"./index.js";import{d as r}from"./p-BWJb2rih.js";import{d as n}from"./p-
|
|
1
|
+
import{p as s,H as t,c as a,h as e,a as i,t as o}from"./index.js";import{d as r}from"./p-BWJb2rih.js";import{d as n}from"./p-BVsVUnAw.js";import{d as b}from"./p-BREDkBUv.js";import{d}from"./p-BbvAWFJA.js";const c=()=>`.sc-ds-navigation-tab-group-h{display:block;box-sizing:border-box}`;const l=s(class s extends t{constructor(s){super();if(s!==false){this.__registerHost()}this.dsChange=a(this,"dsChange",7);this.value="";this.tabs=[];this.size="md";this.width="hug";this.ariaLabel=null;this.handleChange=s=>{s.stopPropagation();this.value=s.detail;this.dsChange.emit(s.detail)}}render(){return e(i,{key:"f00a3bab2314a17617c3ba0d1faeaf12f9ba0d89"},e("ds-tab-group",{key:"50325b3b3a0ba4adc174e16426c58d333cca667c",tabs:this.tabs,value:this.value,size:this.size,width:this.width,presentation:"navigation","aria-label":this.ariaLabel,"aria-labelledby":this.ariaLabelledby,onDsChange:this.handleChange}))}static get style(){return c()}},[2,"ds-navigation-tab-group",{value:[1025],tabs:[16],size:[1],width:[1],ariaLabel:[1,"aria-label"],ariaLabelledby:[1,"aria-labelledby"]}]);function h(){if(typeof customElements==="undefined"){return}const s=["ds-navigation-tab-group","ds-badge","ds-icon","ds-tab-group","ds-text"];s.forEach((s=>{switch(s){case"ds-navigation-tab-group":if(!customElements.get(o(s))){customElements.define(o(s),l)}break;case"ds-badge":if(!customElements.get(o(s))){r()}break;case"ds-icon":if(!customElements.get(o(s))){n()}break;case"ds-tab-group":if(!customElements.get(o(s))){b()}break;case"ds-text":if(!customElements.get(o(s))){d()}break}}))}h();const m=l;const u=h;export{m as DsNavigationTabGroup,u as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=ds-navigation-tab-group.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{P as o,d as s}from"./p-
|
|
1
|
+
import{P as o,d as s}from"./p-D3JCih82.js";const t=o;const p=s;export{t as DsPagination,p as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=ds-pagination.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{P as
|
|
1
|
+
import{P as s,d as o}from"./p-C6EXrs1S.js";const r=s;const t=o;export{r as DsPanelNav,t as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=ds-panel-nav.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{P as o,d as
|
|
1
|
+
import{P as o,d as p}from"./p-DWXpMWIp.js";const s=o;const t=p;export{s as DsPanelToolHeader,t as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=ds-panel-tool-header.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{p as s,H as e,c as o,h as a,a as r,t as i}from"./index.js";import{a as
|
|
1
|
+
import{p as s,H as e,c as o,h as a,a as r,t as i}from"./index.js";import{a as n,d as t}from"./p-Tf6odBOV.js";import{d}from"./p-BWJb2rih.js";import{d as l}from"./p-kL4EOsx5.js";import{d as c}from"./p-IfsszNF0.js";import{d as h}from"./p-D_iZPukF.js";import{d as p}from"./p-BVsVUnAw.js";import{d as m}from"./p-0XTyQNRG.js";import{d as u}from"./p-BbvAWFJA.js";import{d as f}from"./p-BJf49edB.js";const v=()=>`.sc-ds-panel-tool-search-h,.sc-ds-panel-tool-search:where(.ds-table),.sc-ds-panel-tool-search:where(.tooltip-popup),.sc-ds-panel-tool-search:where(.ds-radius){--ds-radius-control:var(--dimension-radius-025);--ds-radius-card:var(--dimension-radius-050);--ds-radius-modal:var(--dimension-radius-050);--ds-radius-menu:var(--dimension-radius-075);--ds-radius-tooltip-control:var(--dimension-radius-025);--ds-radius-tooltip-menu:var(--dimension-radius-075);--ds-radius-table:var(--dimension-radius-050)}.ds-control--lg.sc-ds-panel-tool-search,.ds-control--lg.sc-ds-panel-tool-search-h,.ds-control--md.sc-ds-panel-tool-search-h,.ds-control--md.sc-ds-panel-tool-search,.ds-control--sm.sc-ds-panel-tool-search-h,.ds-control--sm.sc-ds-panel-tool-search,.ds-control--xs.sc-ds-panel-tool-search-h,.ds-control--xs.sc-ds-panel-tool-search{--ds-control-radius:var(--ds-radius-control)}.ds-control--lg.sc-ds-panel-tool-search-h,.ds-control--lg.sc-ds-panel-tool-search{--ds-control-height:var(--dimension-size-500);--ds-control-icon:var(--dimension-iconography-lg);--ds-control-padding-inline:var(--dimension-space-100);--ds-control-label-inset:var(--dimension-space-050);--ds-control-gap:var(--dimension-space-050)}.ds-control--md.sc-ds-panel-tool-search-h,.ds-control--md.sc-ds-panel-tool-search{--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-panel-tool-search-h,.ds-control--sm.sc-ds-panel-tool-search{--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-panel-tool-search-h,.ds-control--xs.sc-ds-panel-tool-search{--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-chrome-space--sm.sc-ds-panel-tool-search-h,.ds-chrome-space--sm.sc-ds-panel-tool-search{--ds-chrome-padding:var(--ds-chrome-space-sm-padding, var(--dimension-space-050));--ds-chrome-gap:var(--dimension-space-050)}.ds-chrome-space--md.sc-ds-panel-tool-search-h,.ds-chrome-space--md.sc-ds-panel-tool-search{--ds-chrome-padding:var(--dimension-space-100);--ds-chrome-gap:var(--dimension-space-100)}.ds-chrome-space--lg.sc-ds-panel-tool-search-h,.ds-chrome-space--lg.sc-ds-panel-tool-search{--ds-chrome-padding:var(--dimension-space-200);--ds-chrome-gap:var(--dimension-space-200)}.ds-chrome-row.sc-ds-panel-tool-search-h,.ds-chrome-row.sc-ds-panel-tool-search,.ds-chrome-column.sc-ds-panel-tool-search-h,.ds-chrome-column.sc-ds-panel-tool-search,.ds-chrome-grid.sc-ds-panel-tool-search-h,.ds-chrome-grid.sc-ds-panel-tool-search{display:flex;box-sizing:border-box;gap:var(--ds-chrome-gap, var(--dimension-space-100));padding:var(--ds-chrome-padding, var(--dimension-space-100))}.ds-chrome-row.sc-ds-panel-tool-search-h,.ds-chrome-row.sc-ds-panel-tool-search{flex-direction:row;align-items:center}.ds-chrome-column.sc-ds-panel-tool-search-h,.ds-chrome-column.sc-ds-panel-tool-search{flex-direction:column}.ds-chrome-grid.sc-ds-panel-tool-search-h,.ds-chrome-grid.sc-ds-panel-tool-search{display:grid;align-items:center}.select-search.sc-ds-panel-tool-search{position:relative;box-sizing:border-box;padding:var(--dimension-space-050);background:transparent}.select-search.sc-ds-panel-tool-search::after{content:'';position:absolute;inset:auto 0 0;height:var(--dimension-stroke-width-012);background-color:var(--color-border-tertiary);pointer-events:none}.select-search.sc-ds-panel-tool-search:focus-within::after{height:var(--dimension-stroke-width-018);background-color:var(--color-border-bold-brand)}.select-search--without-focus-boundary.sc-ds-panel-tool-search::after{display:none}.select-search__control.sc-ds-panel-tool-search{display:flex;width:100%;min-width:0}.sc-ds-panel-tool-search-h{display:block;flex:0 0 var(--dimension-size-600);width:100%;min-width:0;height:var(--dimension-size-600);box-sizing:border-box;background:transparent}.panel-tool-search.sc-ds-panel-tool-search{position:relative;width:100%;height:100%;background:transparent}.panel-tool-search.sc-ds-panel-tool-search::after{content:'';position:absolute;inset:auto 0 0;height:var(--dimension-stroke-width-012);background-color:var(--_shell-tools-divider, var(--color-border-tertiary));pointer-events:none}.select-search.sc-ds-panel-tool-search{flex:1 1 auto;width:auto;min-width:0;height:var(--dimension-size-400);padding:0}.panel-tool-search__filter-group.sc-ds-panel-tool-search{display:flex;flex:0 0 auto;align-items:center;gap:var(--dimension-space-100)}.panel-tool-search__divider.sc-ds-panel-tool-search,.panel-tool-search__filter.sc-ds-panel-tool-search{flex:0 0 auto}.panel-tool-search__divider.sc-ds-panel-tool-search{--_divider-color:var(--_shell-tools-divider, var(--color-divider-divider))}`;const g=s(class s extends e{constructor(s){super();if(s!==false){this.__registerHost()}this.dsChange=o(this,"dsChange",7);this.dsClear=o(this,"dsClear",7);this.dsFilterToggle=o(this,"dsFilterToggle",7);this.value="";this.placeholder="Search";this.ariaLabel="Search";this.isInactive=false;this.showFilter=false;this.filterAriaLabel="Filter";this.filterTriggerId="";this.filterExpanded=false;this.filterActive=false;this.handleChange=s=>{this.value=s;this.dsChange.emit(s)}}componentDidRender(){const s=this.el.querySelector("input");if(s&&s.value!==this.value)s.value=this.value}async setFocus(){this.el.querySelector("input")?.focus()}async focusFilterTrigger(){const s=this.el.querySelector("ds-button-unfilled.panel-tool-search__filter");await(s?.setFocus?.())}render(){return a(r,{key:"ea1a53cb8c766a6c57601f281294e251dfa72a20"},a("div",{key:"a98d0c00d71dafaf028a20498a8837663e46828c",class:"panel-tool-search ds-chrome-row ds-chrome-space--md"},a(n,{key:"7906b0e5b30f301e7c82d5b222035413f1073eeb",hasFocusBoundary:false,hasInteractionFill:false,value:this.value,placeholder:this.placeholder,ariaLabel:this.ariaLabel,controls:this.controls,disabled:this.isInactive,inputRef:()=>undefined,clearLabel:"Clear",onValueChange:this.handleChange,onClear:()=>this.dsClear.emit(),onKeyDown:()=>undefined}),this.showFilter?a("div",{class:"panel-tool-search__filter-group"},a("ds-divider",{class:"panel-tool-search__divider",orientation:"vertical",length:"var(--dimension-size-200)"}),a("ds-tooltip",{label:this.filterAriaLabel,side:"bottom",size:"sm"},a("ds-button-unfilled",{id:this.filterTriggerId||undefined,class:"panel-tool-search__filter",variant:"icon",icon:"Filters",size:"md","aria-label":this.filterAriaLabel,haspopup:"menu",controls:this.filterControls,expanded:this.filterExpanded,surfaceOpen:this.filterSurfaceOpen,isActive:this.filterActive,isInactive:this.isInactive,activeFill:false,hasBorder:false,onDsChange:s=>{s.stopPropagation()},onDsClick:s=>{s.stopPropagation();this.dsFilterToggle.emit(s.detail)}}))):null))}get el(){return this}static get style(){return v()}},[2,"ds-panel-tool-search",{value:[1025],placeholder:[1],ariaLabel:[1,"aria-label"],controls:[1],isInactive:[4,"is-inactive"],showFilter:[4,"show-filter"],filterAriaLabel:[1,"filter-aria-label"],filterTriggerId:[1,"filter-trigger-id"],filterControls:[1,"filter-controls"],filterExpanded:[4,"filter-expanded"],filterSurfaceOpen:[4,"filter-surface-open"],filterActive:[4,"filter-active"],setFocus:[64],focusFilterTrigger:[64]}]);function b(){if(typeof customElements==="undefined"){return}const s=["ds-panel-tool-search","ds-badge","ds-button-unfilled","ds-chip","ds-divider","ds-icon","ds-input","ds-loader","ds-text","ds-tooltip"];s.forEach((s=>{switch(s){case"ds-panel-tool-search":if(!customElements.get(i(s))){customElements.define(i(s),g)}break;case"ds-badge":if(!customElements.get(i(s))){d()}break;case"ds-button-unfilled":if(!customElements.get(i(s))){l()}break;case"ds-chip":if(!customElements.get(i(s))){c()}break;case"ds-divider":if(!customElements.get(i(s))){h()}break;case"ds-icon":if(!customElements.get(i(s))){p()}break;case"ds-input":if(!customElements.get(i(s))){t()}break;case"ds-loader":if(!customElements.get(i(s))){m()}break;case"ds-text":if(!customElements.get(i(s))){u()}break;case"ds-tooltip":if(!customElements.get(i(s))){f()}break}}))}b();const x=g;const w=b;export{x as DsPanelToolSearch,w as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=ds-panel-tool-search.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["panelToolSearchCss","PanelToolSearch","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","value","placeholder","ariaLabel","isInactive","showFilter","filterAriaLabel","filterTriggerId","filterExpanded","filterActive","handleChange","dsChange","emit","componentDidRender","input","el","querySelector","setFocus","focus","focusFilterTrigger","trigger","render","h","Host","key","class","ChoiceSearch","hasFocusBoundary","hasInteractionFill","controls","disabled","inputRef","undefined","clearLabel","onValueChange","onClear","dsClear","onKeyDown","orientation","length","label","side","size","id","variant","icon","haspopup","filterControls","expanded","surfaceOpen","filterSurfaceOpen","isActive","activeFill","hasBorder","onDsChange","event","stopPropagation","onDsClick","dsFilterToggle","detail"],"sources":["src/wc/components/PanelToolSearch/PanelToolSearch.css?tag=ds-panel-tool-search&encapsulation=scoped","src/wc/components/PanelToolSearch/PanelToolSearch.tsx"],"sourcesContent":["@import '../../utils/radius.css';\n@import '../../utils/control-density.css';\n@import '../../utils/chrome-layout.css';\n@import '../../utils/search-control.css';\n\n:host {\n display: block;\n flex: 0 0 var(--dimension-size-600);\n width: 100%;\n min-width: 0;\n height: var(--dimension-size-600);\n box-sizing: border-box;\n background: transparent;\n}\n\n.panel-tool-search {\n position: relative;\n width: 100%;\n height: 100%;\n background: transparent;\n}\n\n.panel-tool-search::after {\n content: '';\n position: absolute;\n inset: auto 0 0;\n height: var(--dimension-stroke-width-012);\n background-color: var(--_shell-tools-divider, var(--color-border-tertiary));\n pointer-events: none;\n}\n\n.select-search {\n flex: 1 1 auto;\n width: auto;\n min-width: 0;\n height: var(--dimension-size-400);\n padding: 0;\n}\n\n.panel-tool-search__filter-group {\n display: flex;\n flex: 0 0 auto;\n align-items: center;\n gap: var(--dimension-space-100);\n}\n\n.panel-tool-search__divider,\n.panel-tool-search__filter {\n flex: 0 0 auto;\n}\n\n.panel-tool-search__divider {\n --_divider-color: var(--_shell-tools-divider, var(--color-divider-divider));\n}\n","import { Component, Element, Event, EventEmitter, h, Host, Method, Prop } from '@stencil/core';\nimport { ChoiceSearch } from '../../utils/choice-list-parts';\n\n@Component({\n tag: 'ds-panel-tool-search',\n styleUrl: 'PanelToolSearch.css',\n scoped: true,\n})\nexport class PanelToolSearch {\n @Element() el!: HTMLElement;\n\n /** Current search query. */\n @Prop({ mutable: true }) value: string = '';\n /** Search guidance shown while the query is empty. */\n @Prop() placeholder: string = 'Search';\n /** Accessible name for the search field. */\n @Prop({ attribute: 'aria-label' }) ariaLabel: string = 'Search';\n /** Optional ID of the results region filtered by this search. */\n @Prop() controls: string | undefined;\n /** Prevents search interaction while keeping the row visible. */\n @Prop() isInactive: boolean = false;\n /** Show the optional trailing filter-menu trigger. */\n @Prop() showFilter: boolean = false;\n /** Accessible name for the filter-menu trigger. */\n @Prop() filterAriaLabel: string = 'Filter';\n /** Stable id placed on the filter trigger for ds-menu anchoring. */\n @Prop() filterTriggerId: string = '';\n /** Id of the menu controlled by the filter trigger. */\n @Prop() filterControls: string | undefined;\n /** Whether the controlled filter menu is open. */\n @Prop() filterExpanded: boolean = false;\n /** Associated filter surface is visible, including exit motion. */\n @Prop() filterSurfaceOpen: boolean | undefined;\n /** Promote the trigger foreground when one or more filters are applied. */\n @Prop() filterActive: boolean = false;\n\n @Event() dsChange!: EventEmitter<string>;\n @Event() dsClear!: EventEmitter<void>;\n @Event() dsFilterToggle!: EventEmitter<MouseEvent>;\n\n componentDidRender() {\n const input = this.el.querySelector('input');\n if (input && input.value !== this.value) input.value = this.value;\n }\n\n @Method()\n async setFocus() {\n this.el.querySelector('input')?.focus();\n }\n\n @Method()\n async focusFilterTrigger() {\n const trigger = this.el.querySelector('ds-button-unfilled.panel-tool-search__filter') as\n | (HTMLElement & { setFocus?: () => Promise<void> })\n | null;\n await trigger?.setFocus?.();\n }\n\n private handleChange = (value: string) => {\n this.value = value;\n this.dsChange.emit(value);\n };\n\n render() {\n return (\n <Host>\n <div class=\"panel-tool-search ds-chrome-row ds-chrome-space--md\">\n <ChoiceSearch\n hasFocusBoundary={false}\n hasInteractionFill={false}\n value={this.value}\n placeholder={this.placeholder}\n ariaLabel={this.ariaLabel}\n controls={this.controls}\n disabled={this.isInactive}\n inputRef={() => undefined}\n clearLabel=\"Clear\"\n onValueChange={this.handleChange}\n onClear={() => this.dsClear.emit()}\n onKeyDown={() => undefined}\n />\n {this.showFilter ? (\n <div class=\"panel-tool-search__filter-group\">\n <ds-divider\n class=\"panel-tool-search__divider\"\n orientation=\"vertical\"\n length=\"var(--dimension-size-200)\"\n />\n <ds-tooltip label={this.filterAriaLabel} side=\"bottom\" size=\"sm\">\n <ds-button-unfilled\n id={this.filterTriggerId || undefined}\n class=\"panel-tool-search__filter\"\n variant=\"icon\"\n icon=\"Filters\"\n size=\"md\"\n aria-label={this.filterAriaLabel}\n haspopup=\"menu\"\n controls={this.filterControls}\n expanded={this.filterExpanded}\n surfaceOpen={this.filterSurfaceOpen}\n isActive={this.filterActive}\n isInactive={this.isInactive}\n activeFill={false}\n hasBorder={false}\n onDsChange={(event: CustomEvent<boolean>) => {\n event.stopPropagation();\n }}\n onDsClick={(event: CustomEvent<MouseEvent>) => {\n event.stopPropagation();\n this.dsFilterToggle.emit(event.detail);\n }}\n />\n </ds-tooltip>\n </div>\n ) : null}\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"wYAAA,MAAMA,EAAqB,IAAM,
|
|
1
|
+
{"version":3,"names":["panelToolSearchCss","PanelToolSearch","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","value","placeholder","ariaLabel","isInactive","showFilter","filterAriaLabel","filterTriggerId","filterExpanded","filterActive","handleChange","dsChange","emit","componentDidRender","input","el","querySelector","setFocus","focus","focusFilterTrigger","trigger","render","h","Host","key","class","ChoiceSearch","hasFocusBoundary","hasInteractionFill","controls","disabled","inputRef","undefined","clearLabel","onValueChange","onClear","dsClear","onKeyDown","orientation","length","label","side","size","id","variant","icon","haspopup","filterControls","expanded","surfaceOpen","filterSurfaceOpen","isActive","activeFill","hasBorder","onDsChange","event","stopPropagation","onDsClick","dsFilterToggle","detail"],"sources":["src/wc/components/PanelToolSearch/PanelToolSearch.css?tag=ds-panel-tool-search&encapsulation=scoped","src/wc/components/PanelToolSearch/PanelToolSearch.tsx"],"sourcesContent":["@import '../../utils/radius.css';\n@import '../../utils/control-density.css';\n@import '../../utils/chrome-layout.css';\n@import '../../utils/search-control.css';\n\n:host {\n display: block;\n flex: 0 0 var(--dimension-size-600);\n width: 100%;\n min-width: 0;\n height: var(--dimension-size-600);\n box-sizing: border-box;\n background: transparent;\n}\n\n.panel-tool-search {\n position: relative;\n width: 100%;\n height: 100%;\n background: transparent;\n}\n\n.panel-tool-search::after {\n content: '';\n position: absolute;\n inset: auto 0 0;\n height: var(--dimension-stroke-width-012);\n background-color: var(--_shell-tools-divider, var(--color-border-tertiary));\n pointer-events: none;\n}\n\n.select-search {\n flex: 1 1 auto;\n width: auto;\n min-width: 0;\n height: var(--dimension-size-400);\n padding: 0;\n}\n\n.panel-tool-search__filter-group {\n display: flex;\n flex: 0 0 auto;\n align-items: center;\n gap: var(--dimension-space-100);\n}\n\n.panel-tool-search__divider,\n.panel-tool-search__filter {\n flex: 0 0 auto;\n}\n\n.panel-tool-search__divider {\n --_divider-color: var(--_shell-tools-divider, var(--color-divider-divider));\n}\n","import { Component, Element, Event, EventEmitter, h, Host, Method, Prop } from '@stencil/core';\nimport { ChoiceSearch } from '../../utils/choice-list-parts';\n\n@Component({\n tag: 'ds-panel-tool-search',\n styleUrl: 'PanelToolSearch.css',\n scoped: true,\n})\nexport class PanelToolSearch {\n @Element() el!: HTMLElement;\n\n /** Current search query. */\n @Prop({ mutable: true }) value: string = '';\n /** Search guidance shown while the query is empty. */\n @Prop() placeholder: string = 'Search';\n /** Accessible name for the search field. */\n @Prop({ attribute: 'aria-label' }) ariaLabel: string = 'Search';\n /** Optional ID of the results region filtered by this search. */\n @Prop() controls: string | undefined;\n /** Prevents search interaction while keeping the row visible. */\n @Prop() isInactive: boolean = false;\n /** Show the optional trailing filter-menu trigger. */\n @Prop() showFilter: boolean = false;\n /** Accessible name for the filter-menu trigger. */\n @Prop() filterAriaLabel: string = 'Filter';\n /** Stable id placed on the filter trigger for ds-menu anchoring. */\n @Prop() filterTriggerId: string = '';\n /** Id of the menu controlled by the filter trigger. */\n @Prop() filterControls: string | undefined;\n /** Whether the controlled filter menu is open. */\n @Prop() filterExpanded: boolean = false;\n /** Associated filter surface is visible, including exit motion. */\n @Prop() filterSurfaceOpen: boolean | undefined;\n /** Promote the trigger foreground when one or more filters are applied. */\n @Prop() filterActive: boolean = false;\n\n @Event() dsChange!: EventEmitter<string>;\n @Event() dsClear!: EventEmitter<void>;\n @Event() dsFilterToggle!: EventEmitter<MouseEvent>;\n\n componentDidRender() {\n const input = this.el.querySelector('input');\n if (input && input.value !== this.value) input.value = this.value;\n }\n\n @Method()\n async setFocus() {\n this.el.querySelector('input')?.focus();\n }\n\n @Method()\n async focusFilterTrigger() {\n const trigger = this.el.querySelector('ds-button-unfilled.panel-tool-search__filter') as\n | (HTMLElement & { setFocus?: () => Promise<void> })\n | null;\n await trigger?.setFocus?.();\n }\n\n private handleChange = (value: string) => {\n this.value = value;\n this.dsChange.emit(value);\n };\n\n render() {\n return (\n <Host>\n <div class=\"panel-tool-search ds-chrome-row ds-chrome-space--md\">\n <ChoiceSearch\n hasFocusBoundary={false}\n hasInteractionFill={false}\n value={this.value}\n placeholder={this.placeholder}\n ariaLabel={this.ariaLabel}\n controls={this.controls}\n disabled={this.isInactive}\n inputRef={() => undefined}\n clearLabel=\"Clear\"\n onValueChange={this.handleChange}\n onClear={() => this.dsClear.emit()}\n onKeyDown={() => undefined}\n />\n {this.showFilter ? (\n <div class=\"panel-tool-search__filter-group\">\n <ds-divider\n class=\"panel-tool-search__divider\"\n orientation=\"vertical\"\n length=\"var(--dimension-size-200)\"\n />\n <ds-tooltip label={this.filterAriaLabel} side=\"bottom\" size=\"sm\">\n <ds-button-unfilled\n id={this.filterTriggerId || undefined}\n class=\"panel-tool-search__filter\"\n variant=\"icon\"\n icon=\"Filters\"\n size=\"md\"\n aria-label={this.filterAriaLabel}\n haspopup=\"menu\"\n controls={this.filterControls}\n expanded={this.filterExpanded}\n surfaceOpen={this.filterSurfaceOpen}\n isActive={this.filterActive}\n isInactive={this.isInactive}\n activeFill={false}\n hasBorder={false}\n onDsChange={(event: CustomEvent<boolean>) => {\n event.stopPropagation();\n }}\n onDsClick={(event: CustomEvent<MouseEvent>) => {\n event.stopPropagation();\n this.dsFilterToggle.emit(event.detail);\n }}\n />\n </ds-tooltip>\n </div>\n ) : null}\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"wYAAA,MAAMA,EAAqB,IAAM,uhK,MCQpBC,EAAeC,EAAA,MAAAD,UAAAE,EAL5B,WAAAC,CAAAC,G,+JAS2BC,KAAAC,MAAgB,GAEjCD,KAAAE,YAAsB,SAEKF,KAAAG,UAAoB,SAI/CH,KAAAI,WAAsB,MAEtBJ,KAAAK,WAAsB,MAEtBL,KAAAM,gBAA0B,SAE1BN,KAAAO,gBAA0B,GAI1BP,KAAAQ,eAA0B,MAI1BR,KAAAS,aAAwB,MAwBxBT,KAAAU,aAAgBT,IACtBD,KAAKC,MAAQA,EACbD,KAAKW,SAASC,KAAKX,EAAM,CA2D5B,CA/EC,kBAAAY,GACE,MAAMC,EAAQd,KAAKe,GAAGC,cAAc,SACpC,GAAIF,GAASA,EAAMb,QAAUD,KAAKC,MAAOa,EAAMb,MAAQD,KAAKC,K,CAI9D,cAAMgB,GACJjB,KAAKe,GAAGC,cAAc,UAAUE,O,CAIlC,wBAAMC,GACJ,MAAMC,EAAUpB,KAAKe,GAAGC,cAAc,sDAGhCI,GAASH,a,CAQjB,MAAAI,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,OAAAE,IAAA,2CAAKC,MAAM,uDACTH,EAACI,EAAY,CAAAF,IAAA,2CACXG,iBAAkB,MAClBC,mBAAoB,MACpB3B,MAAOD,KAAKC,MACZC,YAAaF,KAAKE,YAClBC,UAAWH,KAAKG,UAChB0B,SAAU7B,KAAK6B,SACfC,SAAU9B,KAAKI,WACf2B,SAAU,IAAMC,UAChBC,WAAW,QACXC,cAAelC,KAAKU,aACpByB,QAAS,IAAMnC,KAAKoC,QAAQxB,OAC5ByB,UAAW,IAAML,YAElBhC,KAAKK,WACJiB,EAAA,OAAKG,MAAM,mCACTH,EAAA,cACEG,MAAM,6BACNa,YAAY,WACZC,OAAO,8BAETjB,EAAA,cAAYkB,MAAOxC,KAAKM,gBAAiBmC,KAAK,SAASC,KAAK,MAC1DpB,EAAA,sBACEqB,GAAI3C,KAAKO,iBAAmByB,UAC5BP,MAAM,4BACNmB,QAAQ,OACRC,KAAK,UACLH,KAAK,KAAI,aACG1C,KAAKM,gBACjBwC,SAAS,OACTjB,SAAU7B,KAAK+C,eACfC,SAAUhD,KAAKQ,eACfyC,YAAajD,KAAKkD,kBAClBC,SAAUnD,KAAKS,aACfL,WAAYJ,KAAKI,WACjBgD,WAAY,MACZC,UAAW,MACXC,WAAaC,IACXA,EAAMC,iBAAiB,EAEzBC,UAAYF,IACVA,EAAMC,kBACNxD,KAAK0D,eAAe9C,KAAK2C,EAAMI,OAAO,MAK5C,M","ignoreList":[]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{P as o,d as s}from"./p-
|
|
1
|
+
import{P as o,d as s}from"./p-D-TeAVxE.js";const t=o;const p=s;export{t as DsPanelTools,p as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=ds-panel-tools.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{p as e,H as t,c as o,h as s,a as i,t as n}from"./index.js";import{o as r}from"./p-Dkh_40bl.js";import{d as c}from"./p-pPtjNRqC.js";import{d}from"./p-BbvAWFJA.js";import{C as l}from"./p-CuwopElg.js";import{c as a}from"./p-DuFm-ieS.js";const g=()=>`.sc-ds-select-toggle-h,.sc-ds-select-toggle:where(.ds-table),.sc-ds-select-toggle:where(.tooltip-popup),.sc-ds-select-toggle:where(.ds-radius){--ds-radius-control:var(--dimension-radius-025);--ds-radius-card:var(--dimension-radius-050);--ds-radius-modal:var(--dimension-radius-050);--ds-radius-menu:var(--dimension-radius-075);--ds-radius-tooltip-control:var(--dimension-radius-025);--ds-radius-tooltip-menu:var(--dimension-radius-075);--ds-radius-table:var(--dimension-radius-050)}.ds-control--lg.sc-ds-select-toggle,.ds-control--lg.sc-ds-select-toggle-h,.ds-control--md.sc-ds-select-toggle-h,.ds-control--md.sc-ds-select-toggle,.ds-control--sm.sc-ds-select-toggle-h,.ds-control--sm.sc-ds-select-toggle,.ds-control--xs.sc-ds-select-toggle-h,.ds-control--xs.sc-ds-select-toggle{--ds-control-radius:var(--ds-radius-control)}.ds-control--lg.sc-ds-select-toggle-h,.ds-control--lg.sc-ds-select-toggle{--ds-control-height:var(--dimension-size-500);--ds-control-icon:var(--dimension-iconography-lg);--ds-control-padding-inline:var(--dimension-space-100);--ds-control-label-inset:var(--dimension-space-050);--ds-control-gap:var(--dimension-space-050)}.ds-control--md.sc-ds-select-toggle-h,.ds-control--md.sc-ds-select-toggle{--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-select-toggle-h,.ds-control--sm.sc-ds-select-toggle{--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-select-toggle-h,.ds-control--xs.sc-ds-select-toggle{--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-frame.sc-ds-select-toggle{display:inline-flex;align-items:center;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding-inline:var(--ds-control-padding-inline, var(--dimension-space-075));gap:var(--ds-control-gap, var(--dimension-space-050));border-radius:var(--ds-control-radius, var(--dimension-radius-025))}.ds-control-section-heading.sc-ds-select-toggle{display:flex;align-items:center;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding-inline:calc( var(--ds-control-padding-inline, var(--dimension-space-075)) + var(--ds-control-label-inset, var(--dimension-space-025)) )}.ds-control-icon-box.sc-ds-select-toggle{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))}.ds-control-label-box.sc-ds-select-toggle{min-width:0;padding-inline:var(--ds-control-label-inset, var(--dimension-space-025))}.ds-control-label-dot.sc-ds-select-toggle{position:relative;padding-inline-end:calc( var(--ds-control-label-inset, var(--dimension-space-025)) + var(--ds-control-gap, var(--dimension-space-050)) )}.ds-control-label-dot__badge.sc-ds-select-toggle{position:absolute;inset-block-start:0;inset-inline-end:0;pointer-events:none}.ds-control-width--hug.sc-ds-select-toggle-h,.ds-control-width--hug.sc-ds-select-toggle{width:fit-content;max-width:100%;flex:0 0 auto}.ds-control-width--fill.sc-ds-select-toggle-h,.ds-control-width--fill.sc-ds-select-toggle{width:100%;min-width:0;flex:1 1 auto;align-self:stretch}@media (forced-colors: active){.sc-ds-select-toggle:root,.sc-ds-select-toggle-h,.ds-forced-colors-scope.sc-ds-select-toggle{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.sc-ds-select-toggle-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-select-toggle-h,.ds-focus-ring.sc-ds-select-toggle,.ds-focus-ring-inset.sc-ds-select-toggle-h,.ds-focus-ring-inset.sc-ds-select-toggle{outline:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.ds-focus-ring.sc-ds-select-toggle-h:focus-visible,.ds-focus-ring.sc-ds-select-toggle: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-select-toggle-h,.ds-focus-ring.ds-focus-ring--visible.sc-ds-select-toggle{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-select-toggle-h:focus-visible,.ds-focus-ring-inset.sc-ds-select-toggle:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-select-toggle-h:focus-visible::after,.ds-focus-ring-inset.sc-ds-select-toggle: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-select-toggle-h,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-select-toggle{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-select-toggle-h::after,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-select-toggle::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}@media (forced-colors: active){.sc-ds-select-toggle-h{--ds-focus-ring-color:var(--ds-forced-color-selected)}}@media (forced-colors: active){.sc-ds-select-toggle:root,.sc-ds-select-toggle-h,.ds-forced-colors-scope.sc-ds-select-toggle{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.ds-interaction-fill.sc-ds-select-toggle-h,.ds-interaction-fill.sc-ds-select-toggle{position:var(--ds-interaction-position, relative);z-index:var(--ds-interaction-z-index, 0);cursor:default;--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-divider-width:0px;--ds-interaction-divider-color:transparent;--ds-interaction-divider-inline-start-width:0px;--ds-interaction-divider-inline-start-color:transparent;--ds-interaction-divider-inline-end-width:0px;--ds-interaction-divider-inline-end-color:transparent}.ds-interaction-fill.sc-ds-select-toggle-h::before,.ds-interaction-fill.sc-ds-select-toggle::before,.ds-interaction-fill.sc-ds-select-toggle-h::after,.ds-interaction-fill.sc-ds-select-toggle::after{content:'';position:absolute;inset:0;border-radius:inherit;background:transparent;pointer-events:none;cursor:inherit;transition:none}.ds-interaction-fill.sc-ds-select-toggle-h::before,.ds-interaction-fill.sc-ds-select-toggle::before{z-index:1}.ds-interaction-fill.sc-ds-select-toggle-h::after,.ds-interaction-fill.sc-ds-select-toggle::after{z-index:3;box-shadow:inset 0 calc(-1 * var(--ds-interaction-divider-width)) 0 var(--ds-interaction-divider-color), inset var(--ds-interaction-divider-inline-start-width) 0 0 var(--ds-interaction-divider-inline-start-color), inset calc(-1 * var(--ds-interaction-divider-inline-end-width)) 0 0 var(--ds-interaction-divider-inline-end-color), inset 0 0 0 var(--ds-interaction-border-width) var(--ds-interaction-border-color)}.ds-interaction-fill--bordered.sc-ds-select-toggle-h,.ds-interaction-fill--bordered.sc-ds-select-toggle{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--color-border-secondary)}.ds-interaction-fill--selected.sc-ds-select-toggle-h::before,.ds-interaction-fill--selected.sc-ds-select-toggle::before{background:var(--ds-interaction-active)}.ds-interaction-fill--selected.sc-ds-select-toggle-h,.ds-interaction-fill--selected.sc-ds-select-toggle{--ds-interaction-dot-ring:var(--ds-interaction-active)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-select-toggle-h:hover:not(:disabled)::after,.ds-interaction-fill.sc-ds-select-toggle:hover:not(:disabled)::after{background:var(--ds-interaction-hover)}}.ds-interaction-fill.sc-ds-select-toggle-h:active:not(:disabled)::after,.ds-interaction-fill.sc-ds-select-toggle:active:not(:disabled)::after{background:var(--ds-interaction-pressed)}.ds-interaction-fill--grouped.sc-ds-select-toggle-h::after,.ds-interaction-fill--grouped.sc-ds-select-toggle::after,.ds-interaction-fill--grouped.sc-ds-select-toggle-h:active:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-select-toggle:active:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill--grouped.sc-ds-select-toggle-h:hover:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-select-toggle:hover:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}}.ds-interaction-fill--grouped.sc-ds-select-toggle-h,.ds-interaction-fill--grouped.sc-ds-select-toggle{--ds-interaction-divider-width:var(--ds-interaction-group-divider-width, 0px);--ds-interaction-divider-color:var(--ds-interaction-group-divider-color, transparent);--ds-interaction-divider-inline-start-width:var( --ds-interaction-group-divider-inline-start-width, 0px );--ds-interaction-divider-inline-start-color:var( --ds-interaction-group-divider-inline-start-color, transparent );--ds-interaction-divider-inline-end-width:var( --ds-interaction-group-divider-inline-end-width, 0px );--ds-interaction-divider-inline-end-color:var( --ds-interaction-group-divider-inline-end-color, transparent )}.ds-interaction-fill.sc-ds-select-toggle-h>.ds-interaction-fill__content.sc-ds-select-toggle,.ds-interaction-fill.sc-ds-select-toggle>.ds-interaction-fill__content.sc-ds-select-toggle,.ds-interaction-fill__content.sc-ds-select-toggle{position:relative;z-index:2;cursor:inherit}.ds-interaction-fill--on-faint.sc-ds-select-toggle-h,.ds-interaction-fill--on-faint.sc-ds-select-toggle{--ds-interaction-active:var(--color-interaction-active)}.ds-interaction-fill--on-medium.sc-ds-select-toggle-h,.ds-interaction-fill--on-medium.sc-ds-select-toggle{--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-select-toggle-h,.ds-interaction-fill--on-bold.sc-ds-select-toggle{--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-select-toggle-h,.ds-interaction-fill--on-strong.sc-ds-select-toggle{--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-select-toggle-h,.ds-interaction-fill--on-translucent.sc-ds-select-toggle{--ds-interaction-hover:var(--color-translucent-interaction-hover);--ds-interaction-pressed:var(--color-translucent-interaction-pressed);--ds-interaction-active:var(--color-translucent-interaction-active-brand);--ds-focus-ring-color:var(--color-translucent-interaction-focus)}.ds-interaction-fill--on-inverted.sc-ds-select-toggle-h,.ds-interaction-fill--on-inverted.sc-ds-select-toggle{--ds-interaction-hover:var(--color-inverted-interaction-hover);--ds-interaction-pressed:var(--color-inverted-interaction-pressed);--ds-interaction-active:var(--color-inverted-interaction-active-brand);--ds-focus-ring-color:var(--color-inverted-interaction-focus)}.ds-interaction-fill--on-media.sc-ds-select-toggle-h,.ds-interaction-fill--on-media.sc-ds-select-toggle{--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-select-toggle-h,.ds-interaction-fill--on-always-dark.sc-ds-select-toggle{--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-brand);--ds-focus-ring-color:var(--color-always-dark-interaction-focus)}.ds-interaction-fill--on-chrome.sc-ds-select-toggle-h,.ds-interaction-fill--on-chrome.sc-ds-select-toggle{--ds-interaction-hover:var(--color-chrome-interaction-hover);--ds-interaction-pressed:var(--color-chrome-interaction-pressed);--ds-interaction-active:var(--color-chrome-interaction-active);--ds-focus-ring-color:var(--color-chrome-interaction-focus)}.ds-interaction-fill--on-navigation.sc-ds-select-toggle-h,.ds-interaction-fill--on-navigation.sc-ds-select-toggle{--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-interaction-fill.ds-interaction-fill--surface-open.sc-ds-select-toggle-h:not(:disabled)::after,.ds-interaction-fill.ds-interaction-fill--surface-open.sc-ds-select-toggle:not(:disabled)::after{background:var(--ds-interaction-pressed)}@media (forced-colors: active){.ds-interaction-fill.sc-ds-select-toggle-h::after,.ds-interaction-fill.sc-ds-select-toggle::after{box-shadow:none;outline:var(--ds-interaction-border-width) solid var(--ds-forced-color-control-boundary);outline-offset:calc(-1 * var(--ds-interaction-border-width))}.ds-interaction-fill--surface-open.sc-ds-select-toggle-h:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after,.ds-interaction-fill--surface-open.sc-ds-select-toggle:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after{outline:var(--dimension-stroke-width-025) dashed var(--ds-forced-color-control-boundary);outline-offset:calc(-1 * var(--dimension-stroke-width-025))}.ds-interaction-fill--selected.sc-ds-select-toggle-h::before,.ds-interaction-fill--selected.sc-ds-select-toggle::before{background:transparent;outline:var(--dimension-stroke-width-025) solid var(--ds-forced-color-selected);outline-offset:calc(-1 * var(--dimension-stroke-width-025))}}@media (forced-colors: active) and (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-select-toggle-h:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after,.ds-interaction-fill.sc-ds-select-toggle:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after{outline-color:var(--ds-forced-color-selected);outline-width:var(--dimension-stroke-width-012)}}@media (forced-colors: active){.sc-ds-select-toggle:root,.sc-ds-select-toggle-h,.ds-forced-colors-scope.sc-ds-select-toggle{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.ds-control-inactive.sc-ds-select-toggle-h,.ds-control-inactive.sc-ds-select-toggle{opacity:var(--effect-opacity-medium);pointer-events:none;cursor:not-allowed}@media (forced-colors: active){.ds-control-inactive.sc-ds-select-toggle-h,.ds-control-inactive.sc-ds-select-toggle{color:var(--ds-forced-color-disabled);opacity:1}}.sc-ds-select-toggle-h{display:inline-flex;min-inline-size:0;--_select-toggle-dot-position:var(--dimension-size-050);--_select-toggle-dot-idle:var(--dimension-space-025);--_select-toggle-dot-active:var(--_select-toggle-dot-idle);--_select-toggle-dot-gap:var(--dimension-space-012)}.ds-control--sm.sc-ds-select-toggle-h{--_select-toggle-dot-position:calc(var(--dimension-size-050) * 3 / 4);--_select-toggle-dot-idle:var(--dimension-space-012)}.ds-control--lg.sc-ds-select-toggle-h{--_select-toggle-dot-position:calc(var(--dimension-size-050) * 5 / 4);--_select-toggle-dot-idle:calc(var(--dimension-size-050) * 3 / 4);--_select-toggle-dot-gap:var(--dimension-space-025)}.ds-control-width--fill.sc-ds-select-toggle-h{display:flex;width:100%}.trigger.sc-ds-select-toggle{appearance:none;min-inline-size:0;max-inline-size:100%;justify-content:space-between;background:var(--color-background-transparent);border:0;color:var(--color-foreground-secondary);font-family:inherit;-webkit-user-select:none;user-select:none}.trigger--bordered.sc-ds-select-toggle{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--color-border-tertiary)}.ds-control-width--fill.sc-ds-select-toggle-h .trigger.sc-ds-select-toggle{width:100%}.trigger__content.sc-ds-select-toggle{display:inline-flex;align-items:center;flex:1 1 auto;gap:var(--ds-control-gap);min-width:0;overflow:hidden}.trigger__label.sc-ds-select-toggle{min-width:0;overflow:hidden;text-align:left}.trigger__indicator.sc-ds-select-toggle{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:0 0 calc(var(--ds-control-icon) - var(--dimension-size-100));width:calc(var(--ds-control-icon) - var(--dimension-size-100));height:var(--ds-control-icon);gap:var(--_select-toggle-dot-gap)}.trigger__dot-position.sc-ds-select-toggle{display:grid;place-items:center;flex:0 0 var(--_select-toggle-dot-position);width:var(--_select-toggle-dot-position);height:var(--_select-toggle-dot-position)}.trigger__dot.sc-ds-select-toggle{width:var(--_select-toggle-dot-idle);height:var(--_select-toggle-dot-idle);border-radius:var(--dimension-radius-half);background:var(--color-foreground-quaternary)}.trigger__dot--active.sc-ds-select-toggle{width:var(--_select-toggle-dot-active);height:var(--_select-toggle-dot-active);background:var(--color-foreground-secondary)}@media (forced-colors: active){.trigger.sc-ds-select-toggle{outline:var(--dimension-stroke-width-012) solid var(--ds-forced-color-control-boundary);outline-offset:calc(-1 * var(--dimension-stroke-width-012))}.trigger__dot.sc-ds-select-toggle{background:var(--ds-forced-color-content)}.trigger__dot--active.sc-ds-select-toggle{background:var(--ds-forced-color-selected)}}`;const f=e(class e extends t{constructor(e){super();if(e!==false){this.__registerHost()}this.dsChange=o(this,"dsChange",7);this.options=[];this.value="";this.variant="label";this.collapseLabel=false;this.size="md";this.width="hug";this.hasBorder=true;this.isInactive=false;this.ariaLabel=null;this.captionCompact=false;this.hasLoaded=false;this.advance=()=>{const e=this.validOptions;if(this.isInactive||!e.length)return;const t=Math.max(0,e.findIndex((e=>e.value===this.value)));const o=e[(t+1)%e.length];this.value=o.value;this.dsChange.emit(o.value)}}componentWillLoad(){this.reconcileValue()}componentDidLoad(){this.hasLoaded=true;this.syncCaptionCompactObserver()}connectedCallback(){if(this.hasLoaded)this.syncCaptionCompactObserver()}disconnectedCallback(){this.disconnectCaptionCompactObserver()}onCollapseLabelChange(){this.syncCaptionCompactObserver()}reconcileValue(){const e=this.validOptions;if(e.length&&!e.some((e=>e.value===this.value))){this.value=e[0].value}}get validOptions(){if(this.options.length<2||this.options.length>3)return[];if(this.options.some((e=>!e.value||!e.label))||new Set(this.options.map((e=>e.value))).size!==this.options.length){return[]}return this.options}syncCaptionCompactObserver(){this.disconnectCaptionCompactObserver();if(!this.collapseLabel){if(this.captionCompact)this.captionCompact=false;return}this.captionCompactDisconnect=r(this.el,(e=>{if(this.captionCompact!==e)this.captionCompact=e}))}disconnectCaptionCompactObserver(){this.captionCompactDisconnect?.();this.captionCompactDisconnect=undefined}render(){const e=this.validOptions;const t=Math.max(0,e.findIndex((e=>e.value===this.value)));const o=e[t];const n=e[(t+1)%e.length];const r=this.variant!=="label";const c=this.variant!=="icon"&&!(this.collapseLabel&&this.captionCompact&&this.variant==="icon-label"&&o?.icon);const d=o?`${this.ariaLabel?`${this.ariaLabel}: `:""}${o.label}, ${t+1} of ${e.length}. Next: ${n.label}`:undefined;return s(i,{key:"755d3fe95713a3ea4cc8f2fe5116bbeff596f8bc",class:{[`ds-control--${this.size}`]:true,...a(this.width)}},o&&s("button",{key:"848bf79e37b91387a0e1d0229bcc8b578c7e3a4d",type:"button",class:{trigger:true,"ds-control-frame":true,"ds-focus-ring-inset":true,"ds-interaction-fill":true,"ds-control-inactive":this.isInactive,"trigger--bordered":this.hasBorder},"aria-label":d,disabled:this.isInactive,onClick:this.advance},s("span",{key:"085c1c5ca34a9d548a9d329f41847bc1a5303f48",class:"trigger__content ds-interaction-fill__content"},r&&o.icon&&s("span",{key:"fbedda6f065d47d6593072a378901b9bc9823375",class:"trigger__icon ds-control-icon-box","aria-hidden":"true"},s("ds-icon",{key:"f644ce871e2a9fa12fed6d4329f0d0b6be081101",name:o.icon,size:this.size,color:"inherit"})),c&&s("ds-text",{key:"7df459fce692cc75a6182a799727bbeaac9631a3",class:"trigger__label ds-control-label-box",as:"span",variant:l[this.size],color:"inherit",lineTruncation:1},o.label)),s("span",{key:"57c0d17cf64fa2c3e984623c2f96cf33ac50c69d",class:"trigger__indicator ds-interaction-fill__content","aria-hidden":"true"},e.map(((e,o)=>s("span",{key:e.value,class:"trigger__dot-position"},s("span",{class:{trigger__dot:true,"trigger__dot--active":o===t}})))))))}get el(){return this}static get watchers(){return{collapseLabel:[{onCollapseLabelChange:0}],options:[{reconcileValue:0}],value:[{reconcileValue:0}]}}static get style(){return g()}},[2,"ds-select-toggle",{options:[16],value:[1025],variant:[1],collapseLabel:[516,"collapse-label"],size:[1],width:[1],hasBorder:[4,"has-border"],isInactive:[4,"is-inactive"],ariaLabel:[1,"aria-label"],captionCompact:[32]},undefined,{collapseLabel:[{onCollapseLabelChange:0}],options:[{reconcileValue:0}],value:[{reconcileValue:0}]}]);function v(){if(typeof customElements==="undefined"){return}const e=["ds-select-toggle","ds-icon","ds-text"];e.forEach((e=>{switch(e){case"ds-select-toggle":if(!customElements.get(n(e))){customElements.define(n(e),f)}break;case"ds-icon":if(!customElements.get(n(e))){c()}break;case"ds-text":if(!customElements.get(n(e))){d()}break}}))}v();const h=f;const u=v;export{h as DsSelectToggle,u as defineCustomElement};
|
|
1
|
+
import{p as e,H as t,c as o,h as s,a as i,t as n}from"./index.js";import{o as r}from"./p-Dkh_40bl.js";import{d as c}from"./p-BVsVUnAw.js";import{d}from"./p-BbvAWFJA.js";import{C as l}from"./p-CuwopElg.js";import{c as a}from"./p-DuFm-ieS.js";const g=()=>`.sc-ds-select-toggle-h,.sc-ds-select-toggle:where(.ds-table),.sc-ds-select-toggle:where(.tooltip-popup),.sc-ds-select-toggle:where(.ds-radius){--ds-radius-control:var(--dimension-radius-025);--ds-radius-card:var(--dimension-radius-050);--ds-radius-modal:var(--dimension-radius-050);--ds-radius-menu:var(--dimension-radius-075);--ds-radius-tooltip-control:var(--dimension-radius-025);--ds-radius-tooltip-menu:var(--dimension-radius-075);--ds-radius-table:var(--dimension-radius-050)}.ds-control--lg.sc-ds-select-toggle,.ds-control--lg.sc-ds-select-toggle-h,.ds-control--md.sc-ds-select-toggle-h,.ds-control--md.sc-ds-select-toggle,.ds-control--sm.sc-ds-select-toggle-h,.ds-control--sm.sc-ds-select-toggle,.ds-control--xs.sc-ds-select-toggle-h,.ds-control--xs.sc-ds-select-toggle{--ds-control-radius:var(--ds-radius-control)}.ds-control--lg.sc-ds-select-toggle-h,.ds-control--lg.sc-ds-select-toggle{--ds-control-height:var(--dimension-size-500);--ds-control-icon:var(--dimension-iconography-lg);--ds-control-padding-inline:var(--dimension-space-100);--ds-control-label-inset:var(--dimension-space-050);--ds-control-gap:var(--dimension-space-050)}.ds-control--md.sc-ds-select-toggle-h,.ds-control--md.sc-ds-select-toggle{--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-select-toggle-h,.ds-control--sm.sc-ds-select-toggle{--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-select-toggle-h,.ds-control--xs.sc-ds-select-toggle{--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-frame.sc-ds-select-toggle{display:inline-flex;align-items:center;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding-inline:var(--ds-control-padding-inline, var(--dimension-space-075));gap:var(--ds-control-gap, var(--dimension-space-050));border-radius:var(--ds-control-radius, var(--dimension-radius-025))}.ds-control-section-heading.sc-ds-select-toggle{display:flex;align-items:center;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding-inline:calc( var(--ds-control-padding-inline, var(--dimension-space-075)) + var(--ds-control-label-inset, var(--dimension-space-025)) )}.ds-control-icon-box.sc-ds-select-toggle{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))}.ds-control-label-box.sc-ds-select-toggle{min-width:0;padding-inline:var(--ds-control-label-inset, var(--dimension-space-025))}.ds-control-label-dot.sc-ds-select-toggle{position:relative;padding-inline-end:calc( var(--ds-control-label-inset, var(--dimension-space-025)) + var(--ds-control-gap, var(--dimension-space-050)) )}.ds-control-label-dot__badge.sc-ds-select-toggle{position:absolute;inset-block-start:0;inset-inline-end:0;pointer-events:none}.ds-control-width--hug.sc-ds-select-toggle-h,.ds-control-width--hug.sc-ds-select-toggle{width:fit-content;max-width:100%;flex:0 0 auto}.ds-control-width--fill.sc-ds-select-toggle-h,.ds-control-width--fill.sc-ds-select-toggle{width:100%;min-width:0;flex:1 1 auto;align-self:stretch}@media (forced-colors: active){.sc-ds-select-toggle:root,.sc-ds-select-toggle-h,.ds-forced-colors-scope.sc-ds-select-toggle{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.sc-ds-select-toggle-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-select-toggle-h,.ds-focus-ring.sc-ds-select-toggle,.ds-focus-ring-inset.sc-ds-select-toggle-h,.ds-focus-ring-inset.sc-ds-select-toggle{outline:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.ds-focus-ring.sc-ds-select-toggle-h:focus-visible,.ds-focus-ring.sc-ds-select-toggle: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-select-toggle-h,.ds-focus-ring.ds-focus-ring--visible.sc-ds-select-toggle{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-select-toggle-h:focus-visible,.ds-focus-ring-inset.sc-ds-select-toggle:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-select-toggle-h:focus-visible::after,.ds-focus-ring-inset.sc-ds-select-toggle: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-select-toggle-h,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-select-toggle{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-select-toggle-h::after,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-select-toggle::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}@media (forced-colors: active){.sc-ds-select-toggle-h{--ds-focus-ring-color:var(--ds-forced-color-selected)}}@media (forced-colors: active){.sc-ds-select-toggle:root,.sc-ds-select-toggle-h,.ds-forced-colors-scope.sc-ds-select-toggle{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.ds-interaction-fill.sc-ds-select-toggle-h,.ds-interaction-fill.sc-ds-select-toggle{position:var(--ds-interaction-position, relative);z-index:var(--ds-interaction-z-index, 0);cursor:default;--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-divider-width:0px;--ds-interaction-divider-color:transparent;--ds-interaction-divider-inline-start-width:0px;--ds-interaction-divider-inline-start-color:transparent;--ds-interaction-divider-inline-end-width:0px;--ds-interaction-divider-inline-end-color:transparent}.ds-interaction-fill.sc-ds-select-toggle-h::before,.ds-interaction-fill.sc-ds-select-toggle::before,.ds-interaction-fill.sc-ds-select-toggle-h::after,.ds-interaction-fill.sc-ds-select-toggle::after{content:'';position:absolute;inset:0;border-radius:inherit;background:transparent;pointer-events:none;cursor:inherit;transition:none}.ds-interaction-fill.sc-ds-select-toggle-h::before,.ds-interaction-fill.sc-ds-select-toggle::before{z-index:1}.ds-interaction-fill.sc-ds-select-toggle-h::after,.ds-interaction-fill.sc-ds-select-toggle::after{z-index:3;box-shadow:inset 0 calc(-1 * var(--ds-interaction-divider-width)) 0 var(--ds-interaction-divider-color), inset var(--ds-interaction-divider-inline-start-width) 0 0 var(--ds-interaction-divider-inline-start-color), inset calc(-1 * var(--ds-interaction-divider-inline-end-width)) 0 0 var(--ds-interaction-divider-inline-end-color), inset 0 0 0 var(--ds-interaction-border-width) var(--ds-interaction-border-color)}.ds-interaction-fill--bordered.sc-ds-select-toggle-h,.ds-interaction-fill--bordered.sc-ds-select-toggle{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--color-border-secondary)}.ds-interaction-fill--selected.sc-ds-select-toggle-h::before,.ds-interaction-fill--selected.sc-ds-select-toggle::before{background:var(--ds-interaction-active)}.ds-interaction-fill--selected.sc-ds-select-toggle-h,.ds-interaction-fill--selected.sc-ds-select-toggle{--ds-interaction-dot-ring:var(--ds-interaction-active)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-select-toggle-h:hover:not(:disabled)::after,.ds-interaction-fill.sc-ds-select-toggle:hover:not(:disabled)::after{background:var(--ds-interaction-hover)}}.ds-interaction-fill.sc-ds-select-toggle-h:active:not(:disabled)::after,.ds-interaction-fill.sc-ds-select-toggle:active:not(:disabled)::after{background:var(--ds-interaction-pressed)}.ds-interaction-fill--grouped.sc-ds-select-toggle-h::after,.ds-interaction-fill--grouped.sc-ds-select-toggle::after,.ds-interaction-fill--grouped.sc-ds-select-toggle-h:active:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-select-toggle:active:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill--grouped.sc-ds-select-toggle-h:hover:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-select-toggle:hover:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}}.ds-interaction-fill--grouped.sc-ds-select-toggle-h,.ds-interaction-fill--grouped.sc-ds-select-toggle{--ds-interaction-divider-width:var(--ds-interaction-group-divider-width, 0px);--ds-interaction-divider-color:var(--ds-interaction-group-divider-color, transparent);--ds-interaction-divider-inline-start-width:var( --ds-interaction-group-divider-inline-start-width, 0px );--ds-interaction-divider-inline-start-color:var( --ds-interaction-group-divider-inline-start-color, transparent );--ds-interaction-divider-inline-end-width:var( --ds-interaction-group-divider-inline-end-width, 0px );--ds-interaction-divider-inline-end-color:var( --ds-interaction-group-divider-inline-end-color, transparent )}.ds-interaction-fill.sc-ds-select-toggle-h>.ds-interaction-fill__content.sc-ds-select-toggle,.ds-interaction-fill.sc-ds-select-toggle>.ds-interaction-fill__content.sc-ds-select-toggle,.ds-interaction-fill__content.sc-ds-select-toggle{position:relative;z-index:2;cursor:inherit}.ds-interaction-fill--on-faint.sc-ds-select-toggle-h,.ds-interaction-fill--on-faint.sc-ds-select-toggle{--ds-interaction-active:var(--color-interaction-active)}.ds-interaction-fill--on-medium.sc-ds-select-toggle-h,.ds-interaction-fill--on-medium.sc-ds-select-toggle{--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-select-toggle-h,.ds-interaction-fill--on-bold.sc-ds-select-toggle{--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-select-toggle-h,.ds-interaction-fill--on-strong.sc-ds-select-toggle{--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-select-toggle-h,.ds-interaction-fill--on-translucent.sc-ds-select-toggle{--ds-interaction-hover:var(--color-translucent-interaction-hover);--ds-interaction-pressed:var(--color-translucent-interaction-pressed);--ds-interaction-active:var(--color-translucent-interaction-active-brand);--ds-focus-ring-color:var(--color-translucent-interaction-focus)}.ds-interaction-fill--on-inverted.sc-ds-select-toggle-h,.ds-interaction-fill--on-inverted.sc-ds-select-toggle{--ds-interaction-hover:var(--color-inverted-interaction-hover);--ds-interaction-pressed:var(--color-inverted-interaction-pressed);--ds-interaction-active:var(--color-inverted-interaction-active-brand);--ds-focus-ring-color:var(--color-inverted-interaction-focus)}.ds-interaction-fill--on-media.sc-ds-select-toggle-h,.ds-interaction-fill--on-media.sc-ds-select-toggle{--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-select-toggle-h,.ds-interaction-fill--on-always-dark.sc-ds-select-toggle{--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-brand);--ds-focus-ring-color:var(--color-always-dark-interaction-focus)}.ds-interaction-fill--on-chrome.sc-ds-select-toggle-h,.ds-interaction-fill--on-chrome.sc-ds-select-toggle{--ds-interaction-hover:var(--color-chrome-interaction-hover);--ds-interaction-pressed:var(--color-chrome-interaction-pressed);--ds-interaction-active:var(--color-chrome-interaction-active);--ds-focus-ring-color:var(--color-chrome-interaction-focus)}.ds-interaction-fill--on-navigation.sc-ds-select-toggle-h,.ds-interaction-fill--on-navigation.sc-ds-select-toggle{--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-interaction-fill.ds-interaction-fill--surface-open.sc-ds-select-toggle-h:not(:disabled)::after,.ds-interaction-fill.ds-interaction-fill--surface-open.sc-ds-select-toggle:not(:disabled)::after{background:var(--ds-interaction-pressed)}@media (forced-colors: active){.ds-interaction-fill.sc-ds-select-toggle-h::after,.ds-interaction-fill.sc-ds-select-toggle::after{box-shadow:none;outline:var(--ds-interaction-border-width) solid var(--ds-forced-color-control-boundary);outline-offset:calc(-1 * var(--ds-interaction-border-width))}.ds-interaction-fill--surface-open.sc-ds-select-toggle-h:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after,.ds-interaction-fill--surface-open.sc-ds-select-toggle:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after{outline:var(--dimension-stroke-width-025) dashed var(--ds-forced-color-control-boundary);outline-offset:calc(-1 * var(--dimension-stroke-width-025))}.ds-interaction-fill--selected.sc-ds-select-toggle-h::before,.ds-interaction-fill--selected.sc-ds-select-toggle::before{background:transparent;outline:var(--dimension-stroke-width-025) solid var(--ds-forced-color-selected);outline-offset:calc(-1 * var(--dimension-stroke-width-025))}}@media (forced-colors: active) and (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-select-toggle-h:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after,.ds-interaction-fill.sc-ds-select-toggle:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after{outline-color:var(--ds-forced-color-selected);outline-width:var(--dimension-stroke-width-012)}}@media (forced-colors: active){.sc-ds-select-toggle:root,.sc-ds-select-toggle-h,.ds-forced-colors-scope.sc-ds-select-toggle{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.ds-control-inactive.sc-ds-select-toggle-h,.ds-control-inactive.sc-ds-select-toggle{opacity:var(--effect-opacity-medium);pointer-events:none;cursor:not-allowed}@media (forced-colors: active){.ds-control-inactive.sc-ds-select-toggle-h,.ds-control-inactive.sc-ds-select-toggle{color:var(--ds-forced-color-disabled);opacity:1}}.sc-ds-select-toggle-h{display:inline-flex;min-inline-size:0;--_select-toggle-dot-position:var(--dimension-size-050);--_select-toggle-dot-idle:var(--dimension-space-025);--_select-toggle-dot-active:var(--_select-toggle-dot-idle);--_select-toggle-dot-gap:var(--dimension-space-012)}.ds-control--sm.sc-ds-select-toggle-h{--_select-toggle-dot-position:calc(var(--dimension-size-050) * 3 / 4);--_select-toggle-dot-idle:var(--dimension-space-012)}.ds-control--lg.sc-ds-select-toggle-h{--_select-toggle-dot-position:calc(var(--dimension-size-050) * 5 / 4);--_select-toggle-dot-idle:calc(var(--dimension-size-050) * 3 / 4);--_select-toggle-dot-gap:var(--dimension-space-025)}.ds-control-width--fill.sc-ds-select-toggle-h{display:flex;width:100%}.trigger.sc-ds-select-toggle{appearance:none;min-inline-size:0;max-inline-size:100%;justify-content:space-between;background:var(--color-background-transparent);border:0;color:var(--color-foreground-secondary);font-family:inherit;-webkit-user-select:none;user-select:none}.trigger--bordered.sc-ds-select-toggle{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--color-border-tertiary)}.ds-control-width--fill.sc-ds-select-toggle-h .trigger.sc-ds-select-toggle{width:100%}.trigger__content.sc-ds-select-toggle{display:inline-flex;align-items:center;flex:1 1 auto;gap:var(--ds-control-gap);min-width:0;overflow:hidden}.trigger__label.sc-ds-select-toggle{min-width:0;overflow:hidden;text-align:left}.trigger__indicator.sc-ds-select-toggle{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:0 0 calc(var(--ds-control-icon) - var(--dimension-size-100));width:calc(var(--ds-control-icon) - var(--dimension-size-100));height:var(--ds-control-icon);gap:var(--_select-toggle-dot-gap)}.trigger__dot-position.sc-ds-select-toggle{display:grid;place-items:center;flex:0 0 var(--_select-toggle-dot-position);width:var(--_select-toggle-dot-position);height:var(--_select-toggle-dot-position)}.trigger__dot.sc-ds-select-toggle{width:var(--_select-toggle-dot-idle);height:var(--_select-toggle-dot-idle);border-radius:var(--dimension-radius-half);background:var(--color-foreground-quaternary)}.trigger__dot--active.sc-ds-select-toggle{width:var(--_select-toggle-dot-active);height:var(--_select-toggle-dot-active);background:var(--color-foreground-secondary)}@media (forced-colors: active){.trigger.sc-ds-select-toggle{outline:var(--dimension-stroke-width-012) solid var(--ds-forced-color-control-boundary);outline-offset:calc(-1 * var(--dimension-stroke-width-012))}.trigger__dot.sc-ds-select-toggle{background:var(--ds-forced-color-content)}.trigger__dot--active.sc-ds-select-toggle{background:var(--ds-forced-color-selected)}}`;const f=e(class e extends t{constructor(e){super();if(e!==false){this.__registerHost()}this.dsChange=o(this,"dsChange",7);this.options=[];this.value="";this.variant="label";this.collapseLabel=false;this.size="md";this.width="hug";this.hasBorder=true;this.isInactive=false;this.ariaLabel=null;this.captionCompact=false;this.hasLoaded=false;this.advance=()=>{const e=this.validOptions;if(this.isInactive||!e.length)return;const t=Math.max(0,e.findIndex((e=>e.value===this.value)));const o=e[(t+1)%e.length];this.value=o.value;this.dsChange.emit(o.value)}}componentWillLoad(){this.reconcileValue()}componentDidLoad(){this.hasLoaded=true;this.syncCaptionCompactObserver()}connectedCallback(){if(this.hasLoaded)this.syncCaptionCompactObserver()}disconnectedCallback(){this.disconnectCaptionCompactObserver()}onCollapseLabelChange(){this.syncCaptionCompactObserver()}reconcileValue(){const e=this.validOptions;if(e.length&&!e.some((e=>e.value===this.value))){this.value=e[0].value}}get validOptions(){if(this.options.length<2||this.options.length>3)return[];if(this.options.some((e=>!e.value||!e.label))||new Set(this.options.map((e=>e.value))).size!==this.options.length){return[]}return this.options}syncCaptionCompactObserver(){this.disconnectCaptionCompactObserver();if(!this.collapseLabel){if(this.captionCompact)this.captionCompact=false;return}this.captionCompactDisconnect=r(this.el,(e=>{if(this.captionCompact!==e)this.captionCompact=e}))}disconnectCaptionCompactObserver(){this.captionCompactDisconnect?.();this.captionCompactDisconnect=undefined}render(){const e=this.validOptions;const t=Math.max(0,e.findIndex((e=>e.value===this.value)));const o=e[t];const n=e[(t+1)%e.length];const r=this.variant!=="label";const c=this.variant!=="icon"&&!(this.collapseLabel&&this.captionCompact&&this.variant==="icon-label"&&o?.icon);const d=o?`${this.ariaLabel?`${this.ariaLabel}: `:""}${o.label}, ${t+1} of ${e.length}. Next: ${n.label}`:undefined;return s(i,{key:"755d3fe95713a3ea4cc8f2fe5116bbeff596f8bc",class:{[`ds-control--${this.size}`]:true,...a(this.width)}},o&&s("button",{key:"848bf79e37b91387a0e1d0229bcc8b578c7e3a4d",type:"button",class:{trigger:true,"ds-control-frame":true,"ds-focus-ring-inset":true,"ds-interaction-fill":true,"ds-control-inactive":this.isInactive,"trigger--bordered":this.hasBorder},"aria-label":d,disabled:this.isInactive,onClick:this.advance},s("span",{key:"085c1c5ca34a9d548a9d329f41847bc1a5303f48",class:"trigger__content ds-interaction-fill__content"},r&&o.icon&&s("span",{key:"fbedda6f065d47d6593072a378901b9bc9823375",class:"trigger__icon ds-control-icon-box","aria-hidden":"true"},s("ds-icon",{key:"f644ce871e2a9fa12fed6d4329f0d0b6be081101",name:o.icon,size:this.size,color:"inherit"})),c&&s("ds-text",{key:"7df459fce692cc75a6182a799727bbeaac9631a3",class:"trigger__label ds-control-label-box",as:"span",variant:l[this.size],color:"inherit",lineTruncation:1},o.label)),s("span",{key:"57c0d17cf64fa2c3e984623c2f96cf33ac50c69d",class:"trigger__indicator ds-interaction-fill__content","aria-hidden":"true"},e.map(((e,o)=>s("span",{key:e.value,class:"trigger__dot-position"},s("span",{class:{trigger__dot:true,"trigger__dot--active":o===t}})))))))}get el(){return this}static get watchers(){return{collapseLabel:[{onCollapseLabelChange:0}],options:[{reconcileValue:0}],value:[{reconcileValue:0}]}}static get style(){return g()}},[2,"ds-select-toggle",{options:[16],value:[1025],variant:[1],collapseLabel:[516,"collapse-label"],size:[1],width:[1],hasBorder:[4,"has-border"],isInactive:[4,"is-inactive"],ariaLabel:[1,"aria-label"],captionCompact:[32]},undefined,{collapseLabel:[{onCollapseLabelChange:0}],options:[{reconcileValue:0}],value:[{reconcileValue:0}]}]);function v(){if(typeof customElements==="undefined"){return}const e=["ds-select-toggle","ds-icon","ds-text"];e.forEach((e=>{switch(e){case"ds-select-toggle":if(!customElements.get(n(e))){customElements.define(n(e),f)}break;case"ds-icon":if(!customElements.get(n(e))){c()}break;case"ds-text":if(!customElements.get(n(e))){d()}break}}))}v();const h=f;const u=v;export{h as DsSelectToggle,u as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=ds-select-toggle.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{S as o,d as s}from"./p-
|
|
1
|
+
import{S as o,d as s}from"./p-CJSIvfpo.js";const p=o;const t=s;export{p as DsSelect,t as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=ds-select.js.map
|