You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
55 lines
34 KiB
55 lines
34 KiB
// All material copyright Esri, All Rights Reserved, unless otherwise specified. |
|
// See https://js.arcgis.com/4.30/esri/copyright.txt for details. |
|
//>>built |
|
define("exports ./componentsUtils ./core ./filter ./dom ./floating-ui ./form ./guid ./interactive ./label2 ./loadable ./locale ./observers ./openCloseComponent ./t9n ./component ./Validation ./utils2 ./chip ./combobox-item ./icon ./input-message ./debounce".split(" "),function(z,f,J,K,p,n,q,L,t,y,u,A,B,C,v,w,M,h,N,O,P,Q,D){function R({disabled:a,key:b,label:c,onClick:d,ref:e,scale:g}){return f.h("button",{"aria-label":c,class:E.button,disabled:a,key:b,onClick:d,tabIndex:-1,type:"button",ref:e},f.h("calcite-icon", |
|
{icon:"x",scale:w.getIconScale(g)}))}function F(){"undefined"!==typeof customElements&&["calcite-combobox","calcite-chip","calcite-combobox-item","calcite-icon","calcite-input-message"].forEach(a=>{switch(a){case "calcite-combobox":customElements.get(a)||customElements.define(a,G);break;case "calcite-chip":customElements.get(a)||N.defineCustomElement();break;case "calcite-combobox-item":customElements.get(a)||O.defineCustomElement();break;case "calcite-icon":customElements.get(a)||P.defineCustomElement(); |
|
break;case "calcite-input-message":customElements.get(a)||Q.defineCustomElement()}})}const E={button:"x-button"},G=f.proxyCustomElement(class extends f.H{constructor(){super();this.__registerHost();this.__attachShadow();this.calciteComboboxChange=f.createEvent(this,"calciteComboboxChange",6);this.calciteComboboxFilterChange=f.createEvent(this,"calciteComboboxFilterChange",6);this.calciteComboboxChipClose=f.createEvent(this,"calciteComboboxChipClose",6);this.calciteComboboxBeforeClose=f.createEvent(this, |
|
"calciteComboboxBeforeClose",6);this.calciteComboboxClose=f.createEvent(this,"calciteComboboxClose",6);this.calciteComboboxBeforeOpen=f.createEvent(this,"calciteComboboxBeforeOpen",6);this.calciteComboboxOpen=f.createEvent(this,"calciteComboboxOpen",6);this.placement=n.defaultMenuPlacement;this.internalValueChangeFlag=!1;this.textInput=null;this.mutationObserver=B.createObserver("mutation",()=>this.updateItems());this.resizeObserver=B.createObserver("resize",()=>{this.setMaxScrollerHeight();this.refreshSelectionDisplay()}); |
|
this.guid=L.guid();this.inputHeight=0;this.ignoreSelectedEventsFlag=!1;this.openTransitionProp="opacity";this.setFilteredPlacements=()=>{const {el:a,flipPlacements:b}=this;this.filteredFlipPlacements=b?n.filterComputedPlacements(b,a):null};this.getValue=()=>{const a=this.selectedItems.map(b=>b?.value?.toString());return a?.length?1<a.length?a:a[0]:""};this.onLabelClick=()=>{this.setFocus()};this.keyDownHandler=a=>{if(!this.readOnly){var {key:b}=a;switch(b){case "Tab":this.activeItemIndex=this.activeChipIndex= |
|
-1;this.allowCustomValues&&this.text?(this.addCustomChip(this.text,!0),a.preventDefault()):this.open?(this.open=!1,a.preventDefault()):!this.allowCustomValues&&this.text&&(this.clearInputValue(),this.filterItems(""),this.updateActiveItemIndex(-1));break;case "ArrowLeft":this.previousChip();a.preventDefault();break;case "ArrowRight":this.nextChip();a.preventDefault();break;case "ArrowUp":a.preventDefault();this.open&&this.shiftActiveItemIndex(-1);this.comboboxInViewport()||this.el.scrollIntoView(); |
|
break;case "ArrowDown":a.preventDefault();this.open?this.shiftActiveItemIndex(1):(this.open=!0,this.ensureRecentSelectedItemIsActive());this.comboboxInViewport()||this.el.scrollIntoView();break;case " ":this.textInput.value||a.defaultPrevented||(this.open||(this.open=!0,this.shiftActiveItemIndex(1)),a.preventDefault());break;case "Home":if(!this.open)break;a.preventDefault();this.updateActiveItemIndex(0);this.scrollToActiveItem();this.comboboxInViewport()||this.el.scrollIntoView();break;case "End":if(!this.open)break; |
|
a.preventDefault();this.updateActiveItemIndex(this.filteredItems.length-1);this.scrollToActiveItem();this.comboboxInViewport()||this.el.scrollIntoView();break;case "Escape":this.clearDisabled||this.open||this.clearValue();this.open=!1;a.preventDefault();break;case "Enter":this.open&&-1<this.activeItemIndex?(this.toggleSelection(this.filteredItems[this.activeItemIndex]),a.preventDefault()):-1<this.activeChipIndex?(this.removeActiveChip(),a.preventDefault()):this.allowCustomValues&&this.text?(this.addCustomChip(this.text, |
|
!0),a.preventDefault()):a.defaultPrevented||q.submitForm(this)&&a.preventDefault();break;case "Delete":case "Backspace":"single"===this.selectionDisplay||"fit"===this.selectionDisplay&&0<this.selectedHiddenChipsCount||(-1<this.activeChipIndex?(a.preventDefault(),this.removeActiveChip()):!this.text&&this.isMulti()&&(a.preventDefault(),this.removeLastChip()))}}};this.toggleCloseEnd=()=>{this.open=!1;this.el.removeEventListener("calciteComboboxClose",this.toggleCloseEnd)};this.toggleOpenEnd=()=>{this.open= |
|
!1;this.el.removeEventListener("calciteComboboxOpen",this.toggleOpenEnd)};this.setMaxScrollerHeight=async()=>{const {listContainerEl:a,open:b,referenceEl:c}=this;if(a&&b){await this.reposition(!0);var d=this.getMaxScrollerHeight();a.style.maxHeight=0<d?`${d}px`:"";a.style.minWidth=`${c.clientWidth}px`;await this.reposition(!0)}};this.calciteChipCloseHandler=a=>{this.open=!1;const b=this.items.find(c=>c===a);b&&this.toggleSelection(b,!1);this.calciteComboboxChipClose.emit()};this.clickHandler=a=>{if(!this.readOnly){var b= |
|
a.composedPath();b.some(c=>"CALCITE-CHIP"===c.tagName)?(this.open=!1,a.preventDefault()):b.some(c=>c.classList?.contains(E.button))?(this.clearValue(),a.preventDefault()):(this.open=!this.open,this.ensureRecentSelectedItemIsActive())}};this.refreshSelectionDisplay=async()=>{await u.componentLoaded(this);if(!h.isSingleLike(this.selectionMode)&&this.textInput){var {allSelectedIndicatorChipEl:a,chipContainerEl:b,selectionDisplay:c,placeholder:d,selectedIndicatorChipEl:e,textInput:g}=this,k=parseInt(getComputedStyle(b).gap.replace("px", |
|
"")),l=p.getElementWidth(b),{fontSize:m,fontFamily:r}=getComputedStyle(g),H=(p.getTextWidth(d,`${m} ${r}`)||parseInt(J.calciteSize48))+k,x=p.getElementWidth(a),I=p.getElementWidth(e);this.setCompactSelectionDisplay({chipContainerElGap:k,chipContainerElWidth:l,inputWidth:H,largestSelectedIndicatorChipWidth:Math.max(x,I)});"fit"===c&&(x=Array.from(this.el.shadowRoot.querySelectorAll("calcite-chip")).filter(S=>S.closable),this.refreshChipDisplay({availableHorizontalChipElSpace:Math.round(l-((0<this.selectedHiddenChipsCount? |
|
I:0)+k+H+k)),chipContainerElGap:k,chipEls:x}),this.setVisibleAndHiddenChips(x))}};this.setFloatingEl=a=>{this.floatingEl=a;n.connectFloatingUI(this,this.referenceEl,this.floatingEl)};this.setContainerEl=a=>{this.resizeObserver.observe(a);this.transitionEl=this.listContainerEl=a};this.setChipContainerEl=a=>{this.resizeObserver.observe(a);this.chipContainerEl=a};this.setReferenceEl=a=>{this.referenceEl=a;n.connectFloatingUI(this,this.referenceEl,this.floatingEl)};this.setAllSelectedIndicatorChipEl= |
|
a=>{this.allSelectedIndicatorChipEl=a};this.setSelectedIndicatorChipEl=a=>{this.selectedIndicatorChipEl=a};this.inputHandler=a=>{this.text=a=a.target.value;this.filterItems(a);a&&(this.activeChipIndex=-1)};this.filterItems=(()=>{const a=(b,c)=>b&&c.some(({label:d,value:e})=>b.tagName===h.ComboboxItemGroup?d===b.label:e===b.value&&d===b.textLabel);return D.debounce(b=>{const c=K.filter(this.data,b);this.getItemsAndGroups().forEach(d=>{const e=!a(d,c);d.hidden=e;const [g,k]=d.ancestors;if(a(g,c)||a(k, |
|
c))d.hidden=!1;e||d.ancestors.forEach(l=>l.hidden=!1)});this.filteredItems=this.getFilteredItems();this.calciteComboboxFilterChange.emit()},100)})();this.internalComboboxChangeEvent=()=>{this.calciteComboboxChange.emit()};this.emitComboboxChange=D.debounce(this.internalComboboxChangeEvent,0);this.getSelectedItems=()=>{if(!this.isMulti()){const a=this.items.find(({selected:b})=>b);return a?[a]:[]}return this.items.filter(a=>a.selected&&("ancestors"!==this.selectionMode||!h.hasActiveChildren(a))).sort((a, |
|
b)=>{a=this.selectedItems.indexOf(a);b=this.selectedItems.indexOf(b);return-1<a&&-1<b?a-b:b-a})};this.updateItems=()=>{this.items=this.getItems();this.groupItems=this.getGroupItems();this.data=this.getData();this.selectedItems=this.getSelectedItems();this.filteredItems=this.getFilteredItems();this.needsIcon=this.getNeedsIcon();this.items.forEach(a=>{a.selectionMode=this.selectionMode;a.scale=this.scale});this.allowCustomValues||this.setMaxScrollerHeight();this.groupItems.forEach((a,b,c)=>{0===b&& |
|
(a.afterEmptyGroup=!1);if(b=c[b+1])b.afterEmptyGroup=0===a.children.length})};this.scrollToActiveItem=()=>{const a=this.filteredItems[this.activeItemIndex];if(a){var b=this.calculateSingleItemHeight(a),{offsetHeight:c,scrollTop:d}=this.listContainerEl;c+d<a.offsetTop+b?this.listContainerEl.scrollTop=a.offsetTop-c+b:a.offsetTop<d&&(this.listContainerEl.scrollTop=a.offsetTop)}};this.comboboxFocusHandler=()=>{this.disabled||this.textInput?.focus()};this.clearDisabled=!1;this.selectionDisplay="all";this.disabled= |
|
this.open=!1;this.placeholderIcon=this.placeholder=this.label=this.form=void 0;this.placeholderIconFlipRtl=!1;this.maxItems=0;this.validationIcon=this.validationMessage=void 0;this.validity={valid:!1,badInput:!1,customError:!1,patternMismatch:!1,rangeOverflow:!1,rangeUnderflow:!1,stepMismatch:!1,tooLong:!1,tooShort:!1,typeMismatch:!1,valueMissing:!1};this.allowCustomValues=this.name=void 0;this.overlayPositioning="absolute";this.required=!1;this.selectionMode="multiple";this.scale="m";this.status= |
|
"idle";this.value=null;this.messageOverrides=this.messages=this.flipPlacements=void 0;this.selectedItems=[];this.filteredItems=[];this.readOnly=!1;this.items=[];this.groupItems=[];this.needsIcon=void 0;this.activeChipIndex=this.activeItemIndex=-1;this.activeDescendant="";this.compactSelectionDisplay=!1;this.selectedVisibleChipsCount=this.selectedHiddenChipsCount=0;this.text="";this.defaultMessages=this.effectiveLocale=void 0}openHandler(){C.onToggleOpenCloseComponent(this);this.disabled?this.open= |
|
!1:this.setMaxScrollerHeight()}handleDisabledChange(a){a||(this.open=!1)}maxItemsHandler(){this.setMaxScrollerHeight()}overlayPositioningHandler(){this.reposition(!0)}handlePropsChange(){this.updateItems()}valueHandler(a){if(!this.internalValueChangeFlag){const b=this.getItems();Array.isArray(a)?b.forEach(c=>c.selected=a.includes(c.value)):a?b.forEach(c=>c.selected=a===c.value):b.forEach(c=>c.selected=!1);this.updateItems()}}onMessagesChange(){}flipPlacementsHandler(){this.setFilteredPlacements(); |
|
this.reposition(!0)}selectedItemsHandler(){this.internalValueChangeFlag=!0;this.value=this.getValue();this.internalValueChangeFlag=!1}async documentClickHandler(a){this.disabled||a.composedPath().includes(this.el)||(await w.componentOnReady(this.el),!this.allowCustomValues&&this.text&&(this.clearInputValue(),this.filterItems(""),this.updateActiveItemIndex(-1)),this.allowCustomValues&&this.text.trim().length&&this.addCustomChip(this.text),this.open=!1)}calciteComboboxItemChangeHandler(a){if(!this.ignoreSelectedEventsFlag){a= |
|
a.target;var b=this.filteredItems.indexOf(a);this.updateActiveItemIndex(b);this.toggleSelection(a,a.selected)}}async reposition(a=!1){const {floatingEl:b,referenceEl:c,placement:d,overlayPositioning:e,filteredFlipPlacements:g}=this;return n.reposition(this,{floatingEl:b,referenceEl:c,overlayPositioning:e,placement:d,flipPlacements:g,type:"menu"},a)}async setFocus(){await u.componentFocusable(this);this.textInput?.focus();this.activeItemIndex=this.activeChipIndex=-1}connectedCallback(){t.connectInteractive(this); |
|
A.connectLocalized(this);v.connectMessages(this);y.connectLabel(this);q.connectForm(this);this.internalValueChangeFlag=!0;this.value=this.getValue();this.internalValueChangeFlag=!1;this.mutationObserver?.observe(this.el,{childList:!0,subtree:!0});this.updateItems();this.setFilteredPlacements();this.open&&(this.openHandler(),C.onToggleOpenCloseComponent(this));n.connectFloatingUI(this,this.referenceEl,this.floatingEl)}async componentWillLoad(){u.setUpLoadableComponent(this);this.updateItems();await v.setUpMessages(this)}componentDidLoad(){q.afterConnectDefaultValueSet(this, |
|
this.getValue());n.connectFloatingUI(this,this.referenceEl,this.floatingEl);u.setComponentLoaded(this)}componentDidRender(){this.el.offsetHeight!==this.inputHeight&&(this.reposition(!0),this.inputHeight=this.el.offsetHeight);t.updateHostInteraction(this)}componentDidUpdate(){this.refreshSelectionDisplay()}disconnectedCallback(){this.mutationObserver?.disconnect();this.resizeObserver?.disconnect();t.disconnectInteractive(this);y.disconnectLabel(this);q.disconnectForm(this);n.disconnectFloatingUI(this, |
|
this.referenceEl,this.floatingEl);A.disconnectLocalized(this);v.disconnectMessages(this)}textHandler(){this.updateActiveItemIndex(-1)}effectiveLocaleChange(){v.updateMessages(this,this.effectiveLocale)}clearValue(){this.ignoreSelectedEventsFlag=!0;this.items.forEach(a=>a.selected=!1);this.ignoreSelectedEventsFlag=!1;this.selectedItems=[];this.emitComboboxChange();this.open=!1;this.updateActiveItemIndex(-1);this.resetText();this.filterItems("");this.setFocus()}clearInputValue(){this.text=this.textInput.value= |
|
""}comboboxInViewport(){const a=this.el.getBoundingClientRect();return 0<=a.top&&0<=a.left&&a.right<=(window.innerWidth||document.documentElement.clientWidth)&&a.bottom<=(window.innerHeight||document.documentElement.clientHeight)}onBeforeOpen(){this.scrollToActiveItem();this.calciteComboboxBeforeOpen.emit()}onOpen(){this.calciteComboboxOpen.emit()}onBeforeClose(){this.calciteComboboxBeforeClose.emit()}onClose(){this.calciteComboboxClose.emit()}ensureRecentSelectedItemIsActive(){var {selectedItems:a}= |
|
this;a=0===a.length?0:this.items.indexOf(a[a.length-1]);this.updateActiveItemIndex(a)}hideChip(a){a.classList.add(h.CSS.chipInvisible)}showChip(a){a.classList.remove(h.CSS.chipInvisible)}refreshChipDisplay({chipEls:a,availableHorizontalChipElSpace:b,chipContainerElGap:c}){a.forEach(d=>{if(d.selected){const e=p.getElementWidth(d);if(e&&e<b){b-=e+c;this.showChip(d);return}}else this.hideChip(d);this.hideChip(d)})}setCompactSelectionDisplay({chipContainerElGap:a,chipContainerElWidth:b,inputWidth:c,largestSelectedIndicatorChipWidth:d}){a= |
|
Math.round(d+a+c);if(!this.maxCompactBreakpoint||this.maxCompactBreakpoint<a)this.maxCompactBreakpoint=a;this.compactSelectionDisplay=b<this.maxCompactBreakpoint}setVisibleAndHiddenChips(a){let b=0;a.forEach(c=>{c.selected&&!c.classList.contains(h.CSS.chipInvisible)&&b++});b!==this.selectedVisibleChipsCount&&(this.selectedVisibleChipsCount=b);a=this.getSelectedItems().length-b;a!==this.selectedHiddenChipsCount&&(this.selectedHiddenChipsCount=a)}getMaxScrollerHeight(){const a=this.getItemsAndGroups().filter(e=> |
|
!e.hidden),{maxItems:b}=this;let c=0,d=0;a.length>b&&a.forEach(e=>{c<b&&0<b&&(e=this.calculateSingleItemHeight(e),0<e&&(d+=e,c++))});return d}calculateSingleItemHeight(a){if(a){var b=a.offsetHeight;Array.from(a.querySelectorAll(h.ComboboxChildSelector)).map(c=>c?.offsetHeight).forEach(c=>{b-=c});return b}}getItemsAndGroups(){return[...this.groupItems,...this.items]}toggleSelection(a,b=!a.selected){!a||"single-persist"===this.selectionMode&&a.selected&&a.value===this.value||(this.isMulti()?(a.selected= |
|
b,this.updateAncestors(a),this.selectedItems=this.getSelectedItems(),this.emitComboboxChange()):(this.ignoreSelectedEventsFlag=!0,this.items.forEach(c=>c.selected=c===a?b:!1),this.ignoreSelectedEventsFlag=!1,this.selectedItems=this.getSelectedItems(),this.emitComboboxChange(),this.textInput&&(this.textInput.value=a.textLabel),this.open=!1,this.updateActiveItemIndex(-1)),this.resetText(),this.filterItems(""))}updateAncestors(a){if("ancestors"===this.selectionMode){var b=h.getItemAncestors(a),c=h.getItemChildren(a); |
|
a.selected?b.forEach(d=>{d.selected=!0}):(c.forEach(d=>d.selected=!1),[...b].forEach(d=>{h.hasActiveChildren(d)||(d.selected=!1)}))}}getFilteredItems(){return this.items.filter(a=>!a.hidden)}getData(){return this.items.map(a=>({filterDisabled:a.filterDisabled,value:a.value,label:a.textLabel}))}getNeedsIcon(){return h.isSingleLike(this.selectionMode)&&this.items.some(a=>a.icon)}resetText(){this.textInput&&(this.textInput.value="");this.text=""}getItems(){return Array.from(this.el.querySelectorAll(h.ComboboxItem)).filter(a=> |
|
!a.disabled)}getGroupItems(){return Array.from(this.el.querySelectorAll(h.ComboboxItemGroup))}addCustomChip(a,b){var c=this.items.find(d=>d.textLabel===a);c?this.toggleSelection(c,!0):(this.isMulti()||this.toggleSelection(this.selectedItems[this.selectedItems.length-1],!1),c=document.createElement("calcite-combobox-item"),c.value=a,c.textLabel=a,c.selected=!0,this.el.appendChild(c),this.resetText(),b&&this.setFocus(),this.updateItems(),this.filterItems(""),this.emitComboboxChange())}removeActiveChip(){this.toggleSelection(this.selectedItems[this.activeChipIndex], |
|
!1);this.setFocus()}removeLastChip(){this.toggleSelection(this.selectedItems[this.selectedItems.length-1],!1);this.setFocus()}previousChip(){if(!this.text){var a=this.selectedItems.length-1,b=this.activeChipIndex;this.activeChipIndex=-1===b?a:Math.max(b-1,0);this.updateActiveItemIndex(-1);this.focusChip()}}nextChip(){if(!this.text&&-1!==this.activeChipIndex){var a=this.activeChipIndex+1;a>this.selectedItems.length-1?(this.activeChipIndex=-1,this.setFocus()):(this.activeChipIndex=a,this.focusChip()); |
|
this.updateActiveItemIndex(-1)}}focusChip(){const a=this.selectedItems[this.activeChipIndex]?.guid;(a?this.referenceEl.querySelector(`#${"combobox-chip-"}${a}`):null)?.setFocus()}shiftActiveItemIndex(a){const {length:b}=this.filteredItems;this.updateActiveItemIndex((this.activeItemIndex+b+a)%b);this.scrollToActiveItem()}updateActiveItemIndex(a){this.activeItemIndex=a;let b=null;this.filteredItems.forEach((c,d)=>{d===a?(c.active=!0,b=`${"combobox-item-"}${c.guid}`):c.active=!1});this.activeDescendant= |
|
b;-1<this.activeItemIndex&&(this.activeChipIndex=-1)}isAllSelected(){return this.getItems().length===this.getSelectedItems().length}isMulti(){return!h.isSingleLike(this.selectionMode)}renderChips(){const {activeChipIndex:a,readOnly:b,scale:c,selectionMode:d,messages:e}=this;return this.selectedItems.map((g,k)=>{k={chip:!0,"chip--active":a===k};var l=[...[...h.getItemAncestors(g)].reverse(),g].map(m=>m.textLabel);l="ancestors"!==d?g.textLabel:l.join(" / ");return f.h("calcite-chip",{appearance:b?"outline": |
|
"solid",class:k,closable:!b,icon:g.icon,iconFlipRtl:g.iconFlipRtl,id:g.guid?`${"combobox-chip-"}${g.guid}`:null,key:g.textLabel,messageOverrides:{dismissLabel:e.removeTag},onCalciteChipClose:()=>this.calciteChipCloseHandler(g),scale:c,selected:g.selected,title:l,value:g.value},l)})}renderAllSelectedIndicatorChip(){const {compactSelectionDisplay:a,scale:b,selectedVisibleChipsCount:c,setAllSelectedIndicatorChipEl:d}=this,e=this.messages.allSelected;return f.h("calcite-chip",{class:{chip:!0,[h.CSS.chipInvisible]:!(this.isAllSelected()&& |
|
!c&&!a)},scale:b,title:e,value:"",ref:d},e)}renderAllSelectedIndicatorChipCompact(){const {compactSelectionDisplay:a,scale:b,selectedVisibleChipsCount:c}=this,d=this.messages.all||"All";return f.h("calcite-chip",{class:{chip:!0,[h.CSS.chipInvisible]:!(this.isAllSelected()&&!c&&a)},scale:b,title:d,value:""},d)}renderSelectedIndicatorChip(){const {compactSelectionDisplay:a,selectionDisplay:b,getSelectedItems:c,scale:d,selectedHiddenChipsCount:e,selectedVisibleChipsCount:g,setSelectedIndicatorChipEl:k}= |
|
this;let l;if(a)l=!0;else if("single"===b){var m=c().length;l=this.isAllSelected()?!0:0<m?!1:!0;m=`${m} ${this.messages.selected}`}else"fit"===b&&(l=!!(this.isAllSelected()&&0===g||0===e),m=0<g?`+${e}`:`${e} ${this.messages.selected}`);return f.h("calcite-chip",{class:{chip:!0,[h.CSS.chipInvisible]:l},scale:d,title:m,value:"",ref:k},m)}renderSelectedIndicatorChipCompact(){const {compactSelectionDisplay:a,selectionDisplay:b,getSelectedItems:c,scale:d,selectedHiddenChipsCount:e}=this;let g,k;if(a){const l= |
|
c().length;this.isAllSelected()?g=!0:"fit"===b?(g=!(0<e),k=`${e||0}`):"single"===b&&(g=!(0<l),k=`${l}`)}else g=!0;return f.h("calcite-chip",{class:{chip:!0,[h.CSS.chipInvisible]:g},scale:d,title:k,value:""},k)}get showingInlineIcon(){const {placeholderIcon:a,selectionMode:b,selectedItems:c,open:d}=this,e=c[0],g=e?.icon,k=h.isSingleLike(b);return!d&&e?!!g&&k:!!a&&(!e||k)}renderInput(){const {guid:a,disabled:b,placeholder:c,selectionMode:d,selectedItems:e,open:g}=this,k=h.isSingleLike(d),l=e[0],m=!g&& |
|
k&&!!l;return f.h("span",{class:{"input-wrap":!0,"input-wrap--single":k}},m&&f.h("span",{class:{label:!0,"label--icon":!!l?.icon},key:"label"},l.textLabel),f.h("input",{"aria-activedescendant":this.activeDescendant,"aria-autocomplete":"list","aria-controls":`${"combobox-listbox-"}${a}`,"aria-expanded":p.toAriaBoolean(g),"aria-haspopup":"listbox","aria-label":y.getLabelText(this),"aria-owns":`${"combobox-listbox-"}${a}`,class:{[h.CSS.input]:!0,"input--single":!0,"input--transparent":-1<this.activeChipIndex, |
|
"input--hidden":m,"input--icon":this.showingInlineIcon&&!!this.placeholderIcon},disabled:b,id:`${"combobox-input-"}${a}`,key:"input",onFocus:this.comboboxFocusHandler,onInput:this.inputHandler,placeholder:c,readOnly:this.readOnly,role:"combobox",type:"text",ref:r=>this.textInput=r}))}renderListBoxOptions(){return this.filteredItems.map(a=>f.h("li",{"aria-selected":p.toAriaBoolean(a.selected),id:a.guid?`${"combobox-item-"}${a.guid}`:null,role:"option",tabindex:"-1"},a.textLabel))}renderFloatingUIContainer(){const {setFloatingEl:a, |
|
setContainerEl:b,open:c}=this;return f.h("div",{"aria-hidden":"true",class:{"floating-ui-container":!0,"floating-ui-container--active":c},ref:a},f.h("div",{class:{[h.CSS.listContainer]:!0,[n.FloatingCSS.animation]:!0,[n.FloatingCSS.animationActive]:c},ref:b},f.h("ul",{class:{list:!0,"list--hide":!c}},f.h("slot",null))))}renderSelectedOrPlaceholderIcon(){const {selectedItems:a,placeholderIcon:b,placeholderIconFlipRtl:c}=this,d=a[0];return this.showingInlineIcon&&f.h("span",{class:"icon-start",key:"selected-placeholder-icon"}, |
|
f.h("calcite-icon",{class:"selected-icon",flipRtl:this.open&&d?d.iconFlipRtl:c,icon:!this.open&&d?d?.icon:b,scale:w.getIconScale(this.scale)}))}renderChevronIcon(){const {open:a}=this;return f.h("span",{class:"icon-end",key:"chevron"},f.h("calcite-icon",{class:h.CSS.icon,icon:a?"chevron-up":"chevron-down",scale:w.getIconScale(this.scale)}))}render(){const {selectionDisplay:a,guid:b,label:c,open:d,readOnly:e}=this,g=h.isSingleLike(this.selectionMode),k="all"===a,l="single"===a,m=!g&&"fit"===a,r=!this.clearDisabled&& |
|
0<this.value?.length;return f.h(f.Host,{key:"6f3800dd3e309251ed56cd9e0ba8826c71b5551e",onClick:this.comboboxFocusHandler},f.h(t.InteractiveContainer,{key:"cd96916c5a2bd5f6d9b4011859ff804c9d06001c",disabled:this.disabled},f.h("div",{key:"2ccaa8432826a117b2179a1974018a96ea9a44d1","aria-live":"polite",class:{wrapper:!0,"wrapper--single":g||!this.selectedItems.length,"wrapper--active":d},onClick:this.clickHandler,onKeyDown:this.keyDownHandler,ref:this.setReferenceEl},this.renderSelectedOrPlaceholderIcon(), |
|
f.h("div",{class:{"grid-input":!0,[h.CSS.selectionDisplayFit]:m,[h.CSS.selectionDisplaySingle]:l},key:"grid",ref:this.setChipContainerEl},!g&&!l&&this.renderChips(),!g&&!k&&[this.renderSelectedIndicatorChip(),this.renderSelectedIndicatorChipCompact(),this.renderAllSelectedIndicatorChip(),this.renderAllSelectedIndicatorChipCompact()],f.h("label",{key:"3fa3c37a83c7fe0a8a6be409cdf4c797b4b174dc",class:"screen-readers-only",htmlFor:`${"combobox-input-"}${b}`,id:`${"combobox-label-"}${b}`},c),this.renderInput()), |
|
!e&&r?f.h(R,{disabled:this.disabled,key:"close-button",label:this.messages.clear,scale:this.scale}):null,!e&&this.renderChevronIcon()),f.h("ul",{key:"b2376d24b07d17738da6d9d3463be5d4a79fdbc1","aria-labelledby":`${"combobox-label-"}${b}`,"aria-multiselectable":"true",class:"screen-readers-only",id:`${"combobox-listbox-"}${b}`,role:"listbox",tabIndex:-1},this.renderListBoxOptions()),this.renderFloatingUIContainer(),f.h(q.HiddenFormInputSlot,{key:"37a5a706bfa1847aa825985c25f59992691bf339",component:this}), |
|
this.validationMessage&&"invalid"===this.status?f.h(M.Validation,{icon:this.validationIcon,message:this.validationMessage,scale:this.scale,status:this.status}):null))}static get assetsDirs(){return["assets"]}get el(){return this}static get watchers(){return{open:["openHandler"],disabled:["handleDisabledChange"],maxItems:["maxItemsHandler"],overlayPositioning:["overlayPositioningHandler"],selectionMode:["handlePropsChange"],scale:["handlePropsChange"],value:["valueHandler"],messageOverrides:["onMessagesChange"], |
|
flipPlacements:["flipPlacementsHandler"],selectedItems:["selectedItemsHandler"],text:["textHandler"],effectiveLocale:["effectiveLocaleChange"]}}static get style(){return":host([disabled]){cursor:default;-webkit-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host{position:relative;display:block}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.interaction-container{display:contents}:host([scale\x3ds]) .x-button{inline-size:1rem;block-size:1rem}:host([scale\x3dm]) .x-button{inline-size:1.5rem;block-size:1.5rem}:host([scale\x3dl]) .x-button{inline-size:2rem;block-size:2rem}.x-button{margin:0px;display:flex;cursor:pointer;appearance:none;align-content:center;align-items:center;justify-content:center;align-self:center;border-width:2px;background-color:transparent;color:var(--calcite-color-text-3);outline-color:transparent;transition:background-color, block-size, border-color, box-shadow, color, inset-block-end, inset-block-start, inset-inline-end, inset-inline-start inset-size, opacity, outline-color, transform var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s;border-radius:50%;border-color:transparent;background-color:var(--calcite-color-foreground-2)}.x-button:active,.x-button:hover{color:var(--calcite-color-text-1);background-color:var(--calcite-color-foreground-3)}.x-button:active{border-style:solid;border-color:var(--calcite-color-brand)}.x-button calcite-icon{color:inherit}:host([scale\x3ds]){font-size:var(--calcite-font-size--2);--calcite-combobox-item-spacing-unit-l:0.5rem;--calcite-combobox-item-spacing-unit-s:0.25rem;--calcite-combobox-input-height:1rem;--calcite-internal-combobox-input-margin-block:calc(0.25rem - 1px)}:host([scale\x3ds]) .x-button{margin-inline:0.5rem}:host([scale\x3dm]){font-size:var(--calcite-font-size--1);--calcite-combobox-item-spacing-unit-l:0.75rem;--calcite-combobox-item-spacing-unit-s:0.5rem;--calcite-combobox-input-height:1rem;--calcite-internal-combobox-input-margin-block:calc(0.5rem - 1px)}:host([scale\x3dm]) .x-button{margin-inline-end:0.75rem}:host([scale\x3dl]){font-size:var(--calcite-font-size-0);--calcite-combobox-item-spacing-unit-l:1rem;--calcite-combobox-item-spacing-unit-s:0.75rem;--calcite-combobox-input-height:1.5rem;--calcite-internal-combobox-input-margin-block:calc(0.625rem - 1px)}:host([scale\x3dl]) .x-button{margin-inline-end:1rem}.wrapper{display:flex;border-width:1px;border-style:solid;border-color:var(--calcite-color-border-input);background-color:var(--calcite-color-foreground-1);color:var(--calcite-color-text-1);outline-color:transparent;padding-block:calc(var(--calcite-combobox-item-spacing-unit-s) / 4);padding-inline:var(--calcite-combobox-item-spacing-unit-l)}.wrapper:hover .icon{color:var(--calcite-color-text-1)}:host(:focus-within) .wrapper,.wrapper--active{outline:2px solid var(--calcite-ui-focus-color, var(--calcite-color-brand));outline-offset:calc(\n -2px *\n calc(\n 1 -\n 2 * clamp(\n 0,\n var(--calcite-offset-invert-focus),\n 1\n )\n )\n )}:host([read-only]) .wrapper{background-color:var(--calcite-color-background)}:host([read-only]) .label{font-weight:var(--calcite-font-weight-medium)}:host([status\x3dinvalid]) .wrapper{border-color:var(--calcite-color-status-danger)}:host([status\x3dinvalid]:focus-within) .wrapper{outline:2px solid var(--calcite-color-status-danger);outline-offset:calc(\n -2px *\n calc(\n 1 -\n 2 * clamp(\n 0,\n var(--calcite-offset-invert-focus),\n 1\n )\n )\n )}.wrapper--single{padding-block:0;padding-inline:var(--calcite-combobox-item-spacing-unit-l);cursor:pointer;flex-wrap:nowrap}.grid-input{position:relative;display:flex;flex-grow:1;flex-wrap:wrap;align-items:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:0px;gap:var(--calcite-combobox-item-spacing-unit-s);margin-inline-end:var(--calcite-combobox-item-spacing-unit-s)}.grid-input.selection-display-fit,.grid-input.selection-display-single{flex-wrap:nowrap;overflow:hidden}.input{flex-grow:1;appearance:none;overflow:hidden;text-overflow:ellipsis;border-style:none;background-color:transparent;padding:0px;font-family:inherit;color:var(--calcite-color-text-1);font-size:inherit;block-size:var(--calcite-combobox-input-height);line-height:var(--calcite-combobox-input-height);inline-size:100%;margin-block-end:var(--calcite-combobox-item-spacing-unit-s);min-inline-size:4.8125rem}.input:focus{outline:2px solid transparent;outline-offset:2px}.input:placeholder-shown{text-overflow:ellipsis}.input--transparent{opacity:0}.input--single{padding:0px;margin-block:var(--calcite-internal-combobox-input-margin-block)}.wrapper--active .input-single{cursor:text}.input--hidden{pointer-events:none;inline-size:0px;min-inline-size:0px;opacity:0}.input--icon{padding-block:0;padding-inline:var(--calcite-combobox-item-spacing-unit-l)}.input-wrap{display:flex;flex-grow:1;align-items:center}.input-wrap--single{flex:1 1 0%;overflow:hidden}.label{pointer-events:none;max-inline-size:100%;flex:1 1 auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:0px;font-weight:var(--calcite-font-weight-normal);block-size:var(--calcite-combobox-input-height);line-height:var(--calcite-combobox-input-height)}.label--icon{padding-inline:var(--calcite-combobox-item-spacing-unit-l)}.icon-end,.icon-start{display:flex;cursor:pointer;align-items:center}.icon-end{flex:none}.icon-end .icon{color:var(--calcite-color-text-3)}.floating-ui-container{--calcite-floating-ui-z-index:var(--calcite-z-index-dropdown);display:block;position:absolute;z-index:var(--calcite-floating-ui-z-index);visibility:hidden}.floating-ui-container .calcite-floating-ui-anim{position:relative;transition:var(--calcite-floating-ui-transition);transition-property:transform, visibility, opacity;opacity:0;box-shadow:0 0 16px 0 rgba(0, 0, 0, 0.16);z-index:var(--calcite-z-index);border-radius:0.25rem}.floating-ui-container[data-placement^\x3dbottom] .calcite-floating-ui-anim{transform:translateY(-5px)}.floating-ui-container[data-placement^\x3dtop] .calcite-floating-ui-anim{transform:translateY(5px)}.floating-ui-container[data-placement^\x3dleft] .calcite-floating-ui-anim{transform:translateX(5px)}.floating-ui-container[data-placement^\x3dright] .calcite-floating-ui-anim{transform:translateX(-5px)}.floating-ui-container[data-placement] .calcite-floating-ui-anim--active{opacity:1;transform:translate(0)}.floating-ui-container--active{visibility:visible}@media (forced-colors: active){.wrapper,.floating-ui-container--active{border:1px solid canvasText}}.screen-readers-only{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}.list-container{max-block-size:45vh;overflow-y:auto;background-color:var(--calcite-color-foreground-1);inline-size:var(--calcite-dropdown-width)}.list{margin:0px;display:block;padding:0px}.list--hide{block-size:0px;overflow:hidden}calcite-chip{--calcite-animation-timing:0}.chip{margin-block:calc(var(--calcite-combobox-item-spacing-unit-s) / 4);max-inline-size:100%}.chip--active{background-color:var(--calcite-color-foreground-3)}.chip--invisible{visibility:hidden;position:absolute}.item{display:block}.validation-container{display:flex;flex-direction:column;align-items:flex-start;align-self:stretch}:host([scale\x3dm]) .validation-container,:host([scale\x3dl]) .validation-container{padding-block-start:0.5rem}:host([scale\x3ds]) .validation-container{padding-block-start:0.25rem}::slotted(input[slot\x3dhidden-form-input]){margin:0 !important;opacity:0 !important;outline:none !important;padding:0 !important;position:absolute !important;inset:0 !important;transform:none !important;-webkit-appearance:none !important;z-index:-1 !important}:host([hidden]){display:none}[hidden]{display:none}::slotted(calcite-combobox-item-group:not(:first-child)){padding-block-start:var(--calcite-combobox-item-spacing-unit-l)}"}}, |
|
[1,"calcite-combobox",{clearDisabled:[516,"clear-disabled"],selectionDisplay:[513,"selection-display"],open:[1540],disabled:[516],form:[513],label:[1],placeholder:[1],placeholderIcon:[513,"placeholder-icon"],placeholderIconFlipRtl:[516,"placeholder-icon-flip-rtl"],maxItems:[514,"max-items"],validationMessage:[1,"validation-message"],validationIcon:[520,"validation-icon"],validity:[1040],name:[513],allowCustomValues:[516,"allow-custom-values"],overlayPositioning:[513,"overlay-positioning"],required:[516], |
|
selectionMode:[513,"selection-mode"],scale:[513],status:[513],value:[1025],flipPlacements:[16],messages:[1040],messageOverrides:[1040],selectedItems:[1040],filteredItems:[1040],readOnly:[516,"read-only"],items:[32],groupItems:[32],needsIcon:[32],activeItemIndex:[32],activeChipIndex:[32],activeDescendant:[32],compactSelectionDisplay:[32],selectedHiddenChipsCount:[32],selectedVisibleChipsCount:[32],text:[32],effectiveLocale:[32],defaultMessages:[32],reposition:[64],setFocus:[64]},[[4,"click","documentClickHandler"], |
|
[0,"calciteComboboxItemChange","calciteComboboxItemChangeHandler"]],{open:["openHandler"],disabled:["handleDisabledChange"],maxItems:["maxItemsHandler"],overlayPositioning:["overlayPositioningHandler"],selectionMode:["handlePropsChange"],scale:["handlePropsChange"],value:["valueHandler"],messageOverrides:["onMessagesChange"],flipPlacements:["flipPlacementsHandler"],selectedItems:["selectedItemsHandler"],text:["textHandler"],effectiveLocale:["effectiveLocaleChange"]}]);F();z.Combobox=G;z.defineCustomElement= |
|
F}); |