@pine-ds/core 4.7.2 → 4.9.0

package/components/pds-multiselect.js

@@ -1 +1 @@
-import{proxyCustomElement as i,HTMLElement as e,createEvent as t,h as s,Host as o,transformTag as n}from"@stencil/core/internal/client";import{a as l,c as r,o as a,f as d,s as c,b as h}from"./floating-ui.dom.js";import{c as p,d as u,f as m}from"./utils.js";import{i as b,a as v,m as g}from"./form.js";import{g as _,h as f}from"./index2.js";import{f as x,p as y}from"./i18n-format.js";import{d as w}from"./pds-box2.js";import{d as k}from"./pds-checkbox2.js";import{d as O}from"./pds-chip2.js";import{d as C}from"./pds-icon2.js";import{d as A}from"./pds-loader2.js";import{d as S}from"./pds-text2.js";const j=/^[a-z0-9-]+$/i,T='a[href], button:not([disabled]), input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"])',E=i(class extends e{constructor(i){super(),!1!==i&&this.__registerHost(),this.__attachShadow(),this.pdsMultiselectChange=t(this,"pdsMultiselectChange",7),this.pdsMultiselectSearch=t(this,"pdsMultiselectSearch",7),this.pdsMultiselectLoadOptions=t(this,"pdsMultiselectLoadOptions",7),this.pdsMultiselectCreate=t(this,"pdsMultiselectCreate",7),this.pdsMultiselectDismiss=t(this,"pdsMultiselectDismiss",7),this.pdsMultiselectOptionAction=t(this,"pdsMultiselectOptionAction",7),this.hasDisabledSlottedTrigger=!1,this.placeholder="Select...",this.searchPlaceholder="Find...",this.searchOptionsLabel="Search options",this.selectedItemsLabel="Selected items",this.optionsLabel="Options",this.noOptionsFoundLabel="No options found",this.createOptionLabel='Add "{text}"',this.createOptionAriaLabel="Create new tag: {text}",this.itemRemovedLabel="{item} removed",this.pillRemoveLabel="Remove",this.selectedCountLabelOne="{count} item",this.selectedCountLabelOther="{count} items",this.closePanelOnSelect=!1,this.value=[],this.disabled=!1,this.asyncMethod="GET",this.debounce=300,this.fetchTimeout=3e4,this.maxHeight="300px",this.triggerWidth="100%",this.minWidth="250px",this.hideLabel=!1,this.hideSelectedItems=!1,this.selectedDisplay="count",this.pillPosition="inline",this.maxInlinePills=3,this.optionDisplay="text",this.required=!1,this.loading=!1,this.csrfHeaderName="X-CSRF-Token",this.optionActions=!1,this.optionActionLabel="Edit {text}",this.optionActionDescription="Press Right Arrow to {action}",this.isOpen=!1,this.searchQuery="",this.highlightedIndex=-1,this.internalOptions=[],this.selectedItems=[],this.currentPage=1,this.hasMore=!1,this.creating=!1,this.removalAnnouncement="",this.isOpening=!1,this.isClosingViaSelection=!1,this.initialAsyncFetchTriggered=!1,this.pendingUnresolvedFetch=!1,this.handleTriggerClick=i=>{if(!this.disabled){if(i&&!this.slottedTriggerEl&&"pill"===this.selectedDisplay&&"inline"===this.pillPosition&&i.composedPath().some((i=>{var e;return"pds-chip"===(null===(e=i.tagName)||void 0===e?void 0:e.toLowerCase())})))return;this.isOpen?this.closeDropdown():this.openDropdown()}},this.handleTriggerKeyDown=i=>{if(!this.disabled&&i.target===this.activeTriggerEl)switch(i.key){case"ArrowDown":case"ArrowUp":case"Enter":case" ":i.preventDefault(),this.isOpen||this.openDropdown()}},this.handleSearchInputChange=i=>{this.searchQuery=i.target.value,this.highlightedIndex=-1,this.pdsMultiselectSearch.emit({query:this.searchQuery}),this.asyncUrl&&this.debouncedFetchAsyncOptions(this.searchQuery,1)},this.handleSearchInputKeyDown=i=>{var e,t,s;const o=this.getFilteredOptions();switch(i.key){case"ArrowDown":{i.preventDefault();let t=this.highlightedIndex+1;for(;t<o.length&&(null===(e=o[t])||void 0===e?void 0:e.disabled);)t++;t<o.length&&(this.highlightedIndex=t,this.scrollOptionIntoView());break}case"ArrowUp":{i.preventDefault();let e=Math.max(this.highlightedIndex-1,0);for(;e>0&&(null===(t=o[e])||void 0===t?void 0:t.disabled);)e--;(null===(s=o[e])||void 0===s?void 0:s.disabled)||(this.highlightedIndex=e,this.scrollOptionIntoView());break}case"Enter":if(i.preventDefault(),this.highlightedIndex>=0){const i=o[this.highlightedIndex];i&&this.selectOption(i)}break;case"ArrowRight":{const e=o[this.highlightedIndex];!(i.altKey||i.ctrlKey||i.metaKey||i.shiftKey||i.isComposing)&&e&&this.hasOptionAction(e)&&this.isCaretAtEndOfSearch()&&(i.preventDefault(),this.runOptionAction(e));break}case"Tab":{const e=i.shiftKey?void 0:this.getFooterTabbables()[0];null==e||e.focus(),(null==e?void 0:e.matches(":focus"))?i.preventDefault():this.closeDropdown();break}}},this.handleFooterKeyDown=i=>{var e;if("Tab"!==i.key)return;const t=this.getFooterTabbables(),s=i.composedPath()[0];i.shiftKey&&s===t[0]?(i.preventDefault(),null===(e=this.searchInputEl)||void 0===e||e.focus()):i.shiftKey||s!==t[t.length-1]||this.closeDropdown()},this.handleContainerFocusOut=()=>{setTimeout((()=>{var i;if(!this.isOpen||this.isOpening||this.isClosingViaSelection)return;const e=document.activeElement,t=null===(i=this.el.shadowRoot)||void 0===i?void 0:i.contains(e),s=this.el.contains(e);t||s||(this.pdsMultiselectDismiss.emit(),this.closeDropdown())}),0)},this.handleOptionMouseDown=i=>e=>{e.preventDefault(),this.toggleOption(i)},this.handleOptionClick=i=>{i.preventDefault()},this.handleOptionMouseEnter=(i,e)=>()=>{e.disabled||(this.highlightedIndex=i)},this.handleOptionActionMouseDown=i=>{i.preventDefault(),i.stopPropagation()},this.handleOptionActionClick=i=>()=>{this.runOptionAction(i)},this.handleFooterMouseDown=i=>{i.preventDefault()},this.handleScroll=i=>{if(!this.asyncUrl||!this.hasMore||this.loading)return;const e=i.target;e.scrollHeight-e.scrollTop-e.clientHeight<50&&(this.pdsMultiselectLoadOptions.emit({query:this.searchQuery,page:this.currentPage+1}),this.debouncedFetchAsyncOptions(this.searchQuery,this.currentPage+1))},this.handlePillRemove=i=>()=>{var e,t;if(this.disabled)return;const s=i.id+"";this.value=this.value.filter((i=>i!==s)),this.syncSelectedItems(),this.emitChange({removed:[s]}),this.removalAnnouncement="",queueMicrotask((()=>{this.removalAnnouncement=x(this.itemRemovedLabel,{item:i.text})})),this.isClosingViaSelection=!0,this.isOpen?null===(e=this.searchInputEl)||void 0===e||e.focus():null===(t=this.activeTriggerEl)||void 0===t||t.focus(),setTimeout((()=>{this.isClosingViaSelection=!1}),0)}}connectedCallback(){this.el.attachInternals&&!this.internals&&(this.internals=this.el.attachInternals())}formDisabledCallback(i){i&&!this.el.closest("fieldset[disabled]")||(this.disabled=i)}componentWillLoad(){this.originalSearchEmitter=this.pdsMultiselectSearch,this.syncSelectedItems(),this.syncSlottedTrigger()}componentDidLoad(){this.setupDebounce(),this.setupMutationObserver(),this.setupSlotChangeListener(),this.updateFormValue(),requestAnimationFrame((()=>{this.updateOptionsFromSlot(),this.syncSelectedItems()})),this.asyncUrl&&this.ensureValueArray().length>0&&(this.initialAsyncFetchTriggered=!0,this.fetchOptions("",1))}setupSlotChangeListener(){var i;const e=null===(i=this.el.shadowRoot)||void 0===i?void 0:i.querySelector("slot:not([name])");e&&(e.addEventListener("slotchange",(()=>{this.updateOptionsFromSlot(),this.syncSelectedItems()})),this.updateOptionsFromSlot())}disconnectedCallback(){var i,e;p(this.pdsMultiselectSearch),null===(i=this.observer)||void 0===i||i.disconnect(),null===(e=this.cleanupAutoUpdate)||void 0===e||e.call(this),this.clearAsyncFetchState()}setupDebounce(){const{pdsMultiselectSearch:i,debounce:e,originalSearchEmitter:t}=this;this.pdsMultiselectSearch=void 0===e?null!=t?t:i:u(i,e),m(i)}valueChanged(i){if("string"==typeof i)try{const e=JSON.parse(i);if(Array.isArray(e))return void(this.value=e)}catch(e){return void(this.value=i?[i]:[])}if(this.syncSelectedItems(),this.updateFormValue(),this.asyncUrl){const i=this.ensureValueArray();i.length>0&&this.selectedItems.length<i.length&&(this.loading?this.pendingUnresolvedFetch=!0:this.fetchOptions("",1))}}optionsChanged(){this.options&&(this.internalOptions=[...this.options])}internalOptionsChanged(){this.syncSelectedItems()}isOpenChanged(){var i;null===(i=this.slottedTriggerEl)||void 0===i||i.setAttribute("aria-expanded",this.isOpen+"")}disabledChanged(i){var e,t;if(this.syncSlottedTrigger(),!i||!this.isOpen)return;const s=document.activeElement,o=!(!(null===(e=this.el.shadowRoot)||void 0===e?void 0:e.contains(s))&&!this.el.contains(s));this.closeDropdown(),o&&(null===(t=this.activeTriggerEl)||void 0===t||t.focus())}async setFocus(){var i;null===(i=this.activeTriggerEl)||void 0===i||i.focus()}async clear(){const i=this.value.length>0||""!==this.searchQuery,e=this.ensureValueArray();this.value=[],this.searchQuery="",this.syncSelectedItems(),this.updateFormValue(),i&&this.emitChange({removed:e})}async refreshOptions(){await this.fetchOptions(this.searchQuery,1)}handleWindowKeyDown(i){var e;this.isOpen&&!i.defaultPrevented&&"Escape"===i.key&&(i.preventDefault(),this.pdsMultiselectDismiss.emit(),this.closeDropdown(),null===(e=this.activeTriggerEl)||void 0===e||e.focus())}get activeTriggerEl(){var i;return null!==(i=this.slottedTriggerEl)&&void 0!==i?i:this.triggerEl}syncSlottedTrigger(){const i=Array.from(this.el.children).find((i=>"trigger"===i.getAttribute("slot")));if(i!==this.slottedTriggerEl){const e=this.slottedTriggerEl;e&&(e.removeEventListener("click",this.handleTriggerClick),e.removeEventListener("keydown",this.handleTriggerKeyDown),e.removeAttribute("aria-expanded"),e.removeAttribute("aria-haspopup"),e.removeAttribute("aria-disabled"),this.setSlottedTriggerDisabled(e,!1)),null==i||i.addEventListener("click",this.handleTriggerClick),null==i||i.addEventListener("keydown",this.handleTriggerKeyDown),this.slottedTriggerEl=i}i&&(i.setAttribute("aria-haspopup","listbox"),i.setAttribute("aria-expanded",this.isOpen+""),this.disabled?i.setAttribute("aria-disabled","true"):i.removeAttribute("aria-disabled"),this.setSlottedTriggerDisabled(i,this.disabled))}setSlottedTriggerDisabled(i,e){if(!("disabled"in i))return void(e&&i.localName.includes("-")&&void 0===customElements.get(i.localName)&&customElements.whenDefined(i.localName).then((()=>this.syncSlottedTrigger())));const t=i;e&&!t.disabled?(t.disabled=!0,this.hasDisabledSlottedTrigger=!0):!e&&this.hasDisabledSlottedTrigger&&(t.disabled=!1,this.hasDisabledSlottedTrigger=!1)}setupMutationObserver(){this.observer=new MutationObserver((i=>{i.some((i=>i.target===this.el))&&this.syncSlottedTrigger();const e=this.slottedTriggerEl;e&&!i.some((i=>!e.contains(i.target)))||this.updateOptionsFromSlot()})),this.observer.observe(this.el,{childList:!0,subtree:!0})}updateOptionsFromSlot(){var i;const e=null===(i=this.el.shadowRoot)||void 0===i?void 0:i.querySelector("slot:not([name])");if(!e)return;const t=[];e.assignedElements({flatten:!0}).forEach((i=>{if("OPTGROUP"===i.tagName){const e=i.label,s=i.disabled;i.querySelectorAll("option").forEach((i=>{const o=this.parseSlottedOption(i,s);e&&(o.group=e),t.push(o)}))}else"OPTION"===i.tagName&&t.push(this.parseSlottedOption(i,!1))})),t.length>0&&!this.asyncUrl&&!this.options&&(this.internalOptions=t)}parseSlottedOption(i,e){var t;const s={id:i.value,text:(null===(t=i.textContent)||void 0===t?void 0:t.trim())||i.value,disabled:i.disabled||e||void 0},o=i.getAttribute("data-dot-color");o&&(s.dotColor=o);const n=i.getAttribute("data-action-icon");n&&(s.actionIcon=n);const l=i.getAttribute("data-action-label");return l&&(s.actionLabel=l),s}clearAsyncFetchState(){var i;void 0!==this.fetchDebounceTimer&&(window.clearTimeout(this.fetchDebounceTimer),this.fetchDebounceTimer=void 0),void 0!==this.fetchTimeoutTimer&&(window.clearTimeout(this.fetchTimeoutTimer),this.fetchTimeoutTimer=void 0),null===(i=this.abortController)||void 0===i||i.abort(),this.abortController=void 0}debouncedFetchAsyncOptions(i,e=1){var t;if(!this.asyncUrl)return;void 0!==this.fetchDebounceTimer&&window.clearTimeout(this.fetchDebounceTimer);const s=Math.max(0,null!==(t=this.debounce)&&void 0!==t?t:0);this.fetchDebounceTimer=window.setTimeout((()=>{this.fetchDebounceTimer=void 0,this.fetchOptions(i,e)}),s)}syncSelectedItems(){const i=this.ensureValueArray(),e=this.getAllOptions(),t=[],s=new Map(this.selectedItems.map((i=>[i.id+"",i])));i.forEach((i=>{const o=e.find((e=>e.id+""==i+""));o?t.push(o):s.has(i+"")&&t.push(s.get(i+""))})),this.selectedItems=t}ensureValueArray(){if("string"==typeof this.value)try{const i=JSON.parse(this.value);if(Array.isArray(i))return this.value=i,i}catch(i){const e=this.value;return this.value=e?[e]:[],this.value}return Array.isArray(this.value)?this.value:[]}getAllOptions(){return this.options||this.internalOptions}getFilteredOptions(){const i=this.getAllOptions(),e=this.searchQuery.toLowerCase(),t=i.filter((i=>!e||i.text.toLowerCase().includes(e)));return this.createUrl&&this.searchQuery.trim()&&0===t.length?[{id:"__create__",text:this.searchQuery.trim(),isCreateOption:!0}]:t}updateFormValue(){var i;if(!b()&&(null===(i=this.internals)||void 0===i?void 0:i.setFormValue)){const i=this.ensureValueArray(),e=new FormData;i.forEach((i=>{this.name&&e.append(this.name,i)})),this.internals.setFormValue(e),this.required&&0===i.length?this.internals.setValidity({valueMissing:!0},"Please select at least one option.",this.activeTriggerEl):this.internals.setValidity({})}}getCsrfToken(){if(this.csrfToken)return this.csrfToken;const i=document.querySelector('meta[name="csrf-token"]');return(null==i?void 0:i.content)||null}async fetchOptions(i,e=1){var t;if(this.asyncUrl){null===(t=this.abortController)||void 0===t||t.abort(),void 0!==this.fetchTimeoutTimer&&(window.clearTimeout(this.fetchTimeoutTimer),this.fetchTimeoutTimer=void 0),this.abortController=new AbortController,this.loading=!0,this.fetchTimeoutTimer=window.setTimeout((()=>{var i;null===(i=this.abortController)||void 0===i||i.abort(),this.fetchTimeoutTimer=void 0}),this.fetchTimeout);try{let t;try{t=new URL(this.asyncUrl,window.location.origin)}catch(i){throw new TypeError("Invalid asyncUrl: "+this.asyncUrl)}"GET"===this.asyncMethod&&(t.searchParams.set("search",i),t.searchParams.set("page",e+""));const s=this.getCsrfToken(),o={"Content-Type":"application/json",Accept:"application/json"};s&&(o[this.csrfHeaderName||"X-CSRF-Token"]=s);const n=await fetch(""+t,Object.assign({method:this.asyncMethod,signal:this.abortController.signal,headers:o},"POST"===this.asyncMethod&&{body:JSON.stringify({search:i,page:e})}));if(void 0!==this.fetchTimeoutTimer&&(window.clearTimeout(this.fetchTimeoutTimer),this.fetchTimeoutTimer=void 0),!n.ok)throw Error("Failed to fetch options");const l=await n.json(),r=l.results.map((i=>this.formatResult?this.formatResult(i):"object"==typeof i&&null!==i?Object.assign({id:i.id,text:i.text},i):{id:i+"",text:i+""}));this.internalOptions=1===e?r:[...this.internalOptions,...r],this.hasMore=!!l.totalCount&&this.internalOptions.length<l.totalCount,this.currentPage=e}catch(i){void 0!==this.fetchTimeoutTimer&&(window.clearTimeout(this.fetchTimeoutTimer),this.fetchTimeoutTimer=void 0),"AbortError"!==i.name&&console.error("PdsMultiselect: Failed to fetch options",i)}finally{if(this.loading=!1,this.pendingUnresolvedFetch){this.pendingUnresolvedFetch=!1;const i=this.ensureValueArray();i.length>0&&this.selectedItems.length<i.length&&this.fetchOptions("",1)}}}}async createOption(i){if(this.createUrl&&i.trim()&&!this.creating){this.creating=!0;try{const e=new URL(this.createUrl,window.location.origin),t=this.getCsrfToken(),s={"Content-Type":"application/json",Accept:"application/json"};t&&(s[this.csrfHeaderName||"X-CSRF-Token"]=t);const o=await fetch(""+e,{method:"POST",headers:s,body:JSON.stringify({text:i.trim()})});if(!o.ok)throw Error("Failed to create option");const n=await o.json(),l=Object.assign({id:n.id,text:n.text},n);this.internalOptions=[...this.internalOptions,l],this.value=[...this.value,l.id+""],this.syncSelectedItems(),this.pdsMultiselectCreate.emit({query:i.trim(),newOption:l}),this.emitChange({added:[l.id+""]}),this.searchQuery="",this.highlightedIndex=-1,requestAnimationFrame((()=>{var i;null===(i=this.searchInputEl)||void 0===i||i.focus()}))}catch(i){console.error("PdsMultiselect: Failed to create option",i)}finally{this.creating=!1}}}getFooterTabbables(){const i=[];return Array.from(this.el.children).filter((i=>"footer"===i.getAttribute("slot"))).forEach((e=>i.push(e,...Array.from(e.querySelectorAll("*"))))),i.map((i=>{var e;return i.matches(T)?i:null===(e=i.shadowRoot)||void 0===e?void 0:e.querySelector(T)})).filter((i=>{var e,t;return!!i&&(null===(t=null===(e=i.checkVisibility)||void 0===e?void 0:e.call(i))||void 0===t||t)}))}isCaretAtEndOfSearch(){var i,e;const t=this.searchInputEl;if(!t)return!0;const s=t.value.length;return(null!==(i=t.selectionStart)&&void 0!==i?i:s)===s&&(null!==(e=t.selectionEnd)&&void 0!==e?e:s)===s}hasOptionAction(i){return this.optionActions&&"string"==typeof i.actionIcon&&j.test(i.actionIcon)&&!i.isCreateOption&&!i.disabled}get isHoverless(){var i,e,t;return null!==(i=this.hoverlessQuery)&&void 0!==i||(this.hoverlessQuery=null===(e=window.matchMedia)||void 0===e?void 0:e.call(window,"(hover: none)")),!!(null===(t=this.hoverlessQuery)||void 0===t?void 0:t.matches)}runOptionAction(i){var e;this.isClosingViaSelection=!0,this.closeDropdown(),null===(e=this.activeTriggerEl)||void 0===e||e.focus(),this.pdsMultiselectOptionAction.emit({option:i})}openDropdown(){this.disabled||(this.isOpening=!0,this.isOpen=!0,this.highlightedIndex=-1,this.asyncUrl&&0===this.internalOptions.length&&!this.initialAsyncFetchTriggered&&this.debouncedFetchAsyncOptions(this.searchQuery,1),this.initialAsyncFetchTriggered=!1,requestAnimationFrame((()=>{var i;this.positionDropdown(),null===(i=this.searchInputEl)||void 0===i||i.focus(),setTimeout((()=>{this.isOpening=!1}),50)})))}closeDropdown(){this.isOpen=!1,this.highlightedIndex=-1,this.searchQuery="",this.isClosingViaSelection&&setTimeout((()=>{this.isClosingViaSelection=!1}),0),this.cleanupAutoUpdate&&(this.cleanupAutoUpdate(),this.cleanupAutoUpdate=void 0)}positionDropdown(){if(!this.containerEl||!this.panelEl)return;const i=this.slottedTriggerEl||this.pillInlineTriggerEl||this.triggerEl||this.containerEl,{minWidth:e,panelWidth:t}=this,s=()=>{r(i,this.panelEl,{placement:"bottom-start",strategy:"fixed",middleware:[a(12),d(),c({padding:8}),h({apply:({rects:i,elements:s})=>{Object.assign(s.floating.style,{width:null!=t?t:i.reference.width+"px",minWidth:e})}})]}).then((({x:i,y:e})=>{this.panelEl&&(this.panelEl.style.left=i+"px",this.panelEl.style.top=e+"px")}))};s();const o=l(i,this.panelEl,s);this.cleanupAutoUpdate=()=>{o(),this.clearAsyncFetchState()}}scrollOptionIntoView(){requestAnimationFrame((()=>{var i;const e=null===(i=this.listboxEl)||void 0===i?void 0:i.querySelector(`[data-index="${this.highlightedIndex}"]`);null==e||e.scrollIntoView({block:"nearest",behavior:"smooth"})}))}emitChange({added:i=[],removed:e=[]}){this.pdsMultiselectChange.emit({values:this.value,items:this.selectedItems,added:i,removed:e})}toggleOption(i){var e,t;if(i.disabled)return;if(i.isCreateOption)return void(this.creating||this.createOption(this.searchQuery));const s=i.id+"",o=this.value.includes(s);if(o)this.value=this.value.filter((i=>i!==s));else{if(this.maxSelections&&this.value.length>=this.maxSelections)return;this.value=[...this.value,s]}this.syncSelectedItems(),this.emitChange(o?{removed:[s]}:{added:[s]}),this.closePanelOnSelect?(this.isClosingViaSelection=!0,this.closeDropdown(),null===(e=this.activeTriggerEl)||void 0===e||e.focus()):null===(t=this.searchInputEl)||void 0===t||t.focus()}selectOption(i){this.toggleOption(i)}getGroupedRenderItems(i){const e=[];let t=null;return i.forEach(((i,s)=>{const o=i.group;void 0!==o?(t&&t.group===o||(t={type:"group",group:o,options:[]},e.push(t)),t.options.push({option:i,index:s})):(t=null,e.push({type:"option",option:i,index:s}))})),e}renderOption(i,e,t){const o=t.includes(i.id+""),n=i.isCreateOption,l=i.disabled,r=e===this.highlightedIndex&&!n,a=`${this.componentId}-option-${e}`,d=n&&this.creating,c=this.hasOptionAction(i);return s("li",{key:i.id+"",id:a,class:{"pds-multiselect__option":!0,"pds-multiselect__option--highlighted":r,"pds-multiselect__option--selected":o,"pds-multiselect__option--create":n,"pds-multiselect__option--disabled":l||d},role:"option","aria-selected":o?"true":"false","aria-disabled":l||d?"true":void 0,"aria-label":n?x(this.createOptionAriaLabel,{text:i.text}):void 0,"aria-describedby":c?a+"-action-description":void 0,"data-index":e,onMouseDown:this.handleOptionMouseDown(i),onClick:this.handleOptionClick,onMouseEnter:this.handleOptionMouseEnter(e,i)},n?s("pds-box",{class:"pds-multiselect__create-option","align-items":"center",gap:"xs"},s("pds-icon",{name:"add",size:"small"}),s("pds-text",null,x(this.createOptionLabel,{text:i.text}))):s("pds-checkbox",{componentId:`${this.componentId}-checkbox-${e}`,checked:o,label:i.text,disabled:l,style:{pointerEvents:"none"}},"chip"===this.optionDisplay&&s("pds-chip",{slot:"label",sentiment:"subtle",dot:!!i.dotColor,"dot-color":i.dotColor,"max-width":"100%"},i.text)),c&&this.renderOptionAction(i,a,r))}renderOptionAction(i,e,t){var o;const n=x(null!==(o=i.actionLabel)&&void 0!==o?o:this.optionActionLabel,{text:i.text});return[s("span",{class:"pds-multiselect__option-action",title:n,"aria-hidden":"true",onMouseDown:this.handleOptionActionMouseDown,onClick:this.handleOptionActionClick(i)},(t||this.isHoverless)&&s("pds-icon",{name:i.actionIcon})),s("span",{id:e+"-action-description",hidden:!0},x(this.optionActionDescription,{action:n}))]}renderSelectedItemsList(){return this.hideSelectedItems||0===this.selectedItems.length?null:s("div",{class:"pds-multiselect__selected-section"},s("ul",{class:"pds-multiselect__selected-list",role:"list"},this.selectedItems.map((i=>s("li",{key:i.id+"",class:"pds-multiselect__selected-item"},i.text)))))}renderDropdown(){if(!this.isOpen)return null;const i=this.getFilteredOptions(),e=this.ensureValueArray(),t=!!this.el.querySelector('[slot="empty"]'),o=!!this.el.querySelector('[slot="loading"]'),n=!!this.el.querySelector('[slot="footer"]');return s("div",{class:"pds-multiselect__panel",ref:i=>this.panelEl=i,style:{minWidth:this.minWidth}},s("div",{class:"pds-multiselect__search"},s("pds-icon",{name:"search",size:"small"}),s("input",{ref:i=>this.searchInputEl=i,type:"text",class:"pds-multiselect__search-input",placeholder:this.searchPlaceholder,value:this.searchQuery,"aria-label":this.searchOptionsLabel,"aria-controls":this.componentId+"-listbox","aria-activedescendant":this.highlightedIndex>=0?`${this.componentId}-option-${this.highlightedIndex}`:void 0,role:"combobox","aria-haspopup":"listbox","aria-expanded":"true","aria-autocomplete":"list",autocomplete:"off",onInput:this.handleSearchInputChange,onKeyDown:this.handleSearchInputKeyDown})),this.renderSelectedItemsList(),s("ul",{class:"pds-multiselect__listbox",role:"listbox","aria-multiselectable":"true","aria-label":this.label||this.optionsLabel,id:this.componentId+"-listbox",ref:i=>this.listboxEl=i,style:{maxHeight:this.maxHeight},onScroll:this.handleScroll},this.loading&&s("li",{class:"pds-multiselect__loading",role:"presentation"},o?s("slot",{name:"loading"}):s("pds-loader",{size:"small"})),!this.loading&&0===i.length&&s("li",{class:"pds-multiselect__empty",role:"presentation"},t?s("slot",{name:"empty"}):s("span",null,this.noOptionsFoundLabel)),this.getGroupedRenderItems(i).map(((i,t)=>"group"===i.type?s("li",{key:"group-"+t,role:"group","aria-label":i.group,class:"pds-multiselect__group"},s("span",{class:"pds-multiselect__group-header","aria-hidden":"true"},i.group),s("ul",{class:"pds-multiselect__group-list",role:"presentation"},i.options.map((({option:i,index:t})=>this.renderOption(i,t,e))))):this.renderOption(i.option,i.index,e))),this.hasMore&&!this.loading&&s("li",{class:"pds-multiselect__load-more",role:"presentation"},s("pds-loader",{size:"small"}))),n&&s("div",{class:"pds-multiselect__footer",onMouseDown:this.handleFooterMouseDown,onKeyDown:this.handleFooterKeyDown},s("slot",{name:"footer"})))}renderInlinePills(){if(!(this.selectedItems.length>0))return s("span",{class:"pds-multiselect__trigger-text pds-multiselect__trigger-text--placeholder"},this.placeholder||"Select...");const i=this.disabled?"text":"tag",e=this.selectedItems.slice(0,Math.max(1,this.maxInlinePills)),t=this.selectedItems.length-e.length;return s("div",{class:"pds-multiselect__pill-list pds-multiselect__pill-list--inline","aria-label":this.selectedItemsLabel},e.map((e=>s("pds-chip",{key:e.id+"","component-id":`${this.componentId}-pill-${e.id}`,variant:i,size:"sm",sentiment:"neutral","dismiss-label":this.pillRemoveLabel,onPdsTagCloseClick:this.handlePillRemove(e)},e.text))),t>0&&s("span",{class:"pds-multiselect__pill-overflow"},"+",t))}renderBelowPills(){if(0===this.selectedItems.length)return null;const i=this.disabled?"text":"tag";return s("div",{class:"pds-multiselect__pill-list pds-multiselect__pill-list--below","aria-label":this.selectedItemsLabel},this.selectedItems.map((e=>s("pds-chip",{key:e.id+"","component-id":`${this.componentId}-pill-${e.id}`,variant:i,size:"md",sentiment:"neutral","dismiss-label":this.pillRemoveLabel,onPdsTagCloseClick:this.handlePillRemove(e)},e.text))))}getTriggerText(){const i=this.selectedItems.length;return 0===i||"pill"===this.selectedDisplay&&"below"===this.pillPosition?this.placeholder||"Select...":y(this.el,i,this.resolveCountForms())}resolveCountForms(){const i={one:this.selectedCountLabelOne,other:this.selectedCountLabelOther},e=this.selectedCountLabels;if(!e)return i;if("string"==typeof e)try{const t=JSON.parse(e);return t&&"object"==typeof t?Object.assign(Object.assign({},i),t):i}catch(e){return i}return Object.assign(Object.assign({},i),e)}render(){const i=this.selectedItems.length>0;return s(o,{key:"a7806379c53598d41af91be63ee5bd300cc87755","aria-disabled":this.disabled?"true":null},s("div",{key:"0213d40953f1735b84c038e0e0afd1bc289d45ad",class:"pds-multiselect",onFocusout:this.handleContainerFocusOut},this.label&&s("label",{key:"fa91c2337cdc9f5dea62173aeaa6b56e118a1316",id:this.componentId+"-label",htmlFor:this.componentId,class:{"pds-multiselect__label":!0,"visually-hidden":this.hideLabel}},this.label),s("div",{key:"54209b3edfb3583ab1bcecd2b1df973955abfcc3",class:"pds-multiselect__wrapper",ref:i=>this.containerEl=i,style:{width:this.triggerWidth}},this.slottedTriggerEl?s("slot",{name:"trigger"}):"pill"===this.selectedDisplay&&"inline"===this.pillPosition?s("div",{ref:i=>this.pillInlineTriggerEl=i||void 0,part:"trigger",class:{"pds-multiselect__trigger":!0,"pds-multiselect__trigger--open":this.isOpen,"pds-multiselect__trigger--disabled":this.disabled,"pds-multiselect__trigger--invalid":this.invalid||!!this.errorMessage,"pds-multiselect__trigger--has-value":i,"pds-multiselect__trigger--pill-inline":!0},onClick:this.handleTriggerClick},this.renderInlinePills(),s("button",{ref:i=>this.triggerEl=i,type:"button",id:this.componentId,part:"pill-toggle",class:"pds-multiselect__pill-toggle",disabled:this.disabled,"aria-expanded":this.isOpen?"true":"false","aria-haspopup":"listbox","aria-labelledby":this.label?this.componentId+"-label":void 0,"aria-required":this.required?"true":void 0,"aria-describedby":v(this.componentId,this.invalid||!!this.errorMessage,this.helperMessage,this.errorMessage),"aria-invalid":this.invalid||this.errorMessage?"true":void 0,onKeyDown:this.handleTriggerKeyDown},s("pds-icon",{"aria-hidden":"true",class:"pds-multiselect__icon",icon:_}))):s("button",{ref:i=>this.triggerEl=i,type:"button",part:"trigger",class:{"pds-multiselect__trigger":!0,"pds-multiselect__trigger--open":this.isOpen,"pds-multiselect__trigger--disabled":this.disabled,"pds-multiselect__trigger--invalid":this.invalid||!!this.errorMessage,"pds-multiselect__trigger--has-value":i},id:this.componentId,disabled:this.disabled,"aria-required":this.required?"true":void 0,"aria-expanded":this.isOpen?"true":"false","aria-haspopup":"listbox","aria-describedby":v(this.componentId,this.invalid||!!this.errorMessage,this.helperMessage,this.errorMessage),"aria-invalid":this.invalid||this.errorMessage?"true":void 0,onClick:this.handleTriggerClick,onKeyDown:this.handleTriggerKeyDown},s("span",{class:{"pds-multiselect__trigger-text":!0,"pds-multiselect__trigger-text--placeholder":!i||"pill"===this.selectedDisplay&&"below"===this.pillPosition}},this.getTriggerText()),s("pds-icon",{"aria-hidden":"true",class:"pds-multiselect__icon",icon:_})),this.renderDropdown()),"pill"===this.selectedDisplay&&"below"===this.pillPosition&&this.renderBelowPills(),s("span",{key:"e3c1bb5c484d851b332e994cd2a528ae95cbfc4d",class:"visually-hidden","aria-live":"polite","aria-atomic":"true"},this.removalAnnouncement),this.helperMessage&&!(this.errorMessage&&this.errorMessage.length>0)&&s("p",{key:"2009f6487118252ef1ec14170ddd0c6853ad279f",class:"pds-multiselect__helper",id:g(this.componentId,"helper")},this.helperMessage),this.errorMessage&&s("p",{key:"c740f4845ff0c1ccff4633810c1d9d92fb2e8a78",class:"pds-multiselect__error",id:g(this.componentId,"error")},s("pds-icon",{key:"b2406ab3b0957a440593b4b986c98476258349be",icon:f,size:"small"}),this.errorMessage),s("div",{key:"6d2db6563864c71ab92ed9a8d4133efca23b1c55",style:{display:"none"}},s("slot",{key:"2af0e0a7e2410b9850fd15ef524fb388c32dc320"}))))}static get formAssociated(){return!0}get el(){return this}static get watchers(){return{debounce:[{setupDebounce:0}],value:[{valueChanged:0}],options:[{optionsChanged:0}],internalOptions:[{internalOptionsChanged:0}],isOpen:[{isOpenChanged:0}],disabled:[{disabledChanged:0}]}}static get style(){return":host{display:block}:host([aria-disabled=true]) .pds-multiselect__trigger{background:var(--pine-color-background-container-disabled);border-color:var(--pine-color-border-disabled);color:var(--pine-color-text-disabled);cursor:not-allowed}:host([aria-disabled=true]) .pds-multiselect__icon{color:var(--pine-color-text-disabled)}.pds-multiselect{position:relative}.pds-multiselect__label{color:var(--pine-color-text-label);display:block;font:var(--pine-typography-body-medium);letter-spacing:var(--pine-letter-spacing);-webkit-margin-after:var(--pine-dimension-2xs);margin-block-end:var(--pine-dimension-2xs)}.pds-multiselect__wrapper{position:relative}.pds-multiselect__trigger{-ms-flex-align:center;align-items:center;background:var(--pine-color-background-container);border:var(--pine-border);border-radius:var(--pine-dimension-125);cursor:pointer;display:-ms-flexbox;display:flex;font:var(--pine-typography-body-medium);gap:var(--pine-dimension-xs);-ms-flex-pack:justify;justify-content:space-between;letter-spacing:var(--pine-letter-spacing);min-height:var(--pine-dimension-450);padding:var(--pine-dimension-xs) var(--pine-dimension-sm);position:relative;text-align:start;-webkit-transition:border-color var(--pine-motion-duration-base) ease, -webkit-box-shadow var(--pine-motion-duration-base) ease;transition:border-color var(--pine-motion-duration-base) ease, -webkit-box-shadow var(--pine-motion-duration-base) ease;transition:border-color var(--pine-motion-duration-base) ease, box-shadow var(--pine-motion-duration-base) ease;transition:border-color var(--pine-motion-duration-base) ease, box-shadow var(--pine-motion-duration-base) ease, -webkit-box-shadow var(--pine-motion-duration-base) ease;width:100%}.pds-multiselect__trigger:hover:not(.pds-multiselect__trigger--disabled){border-color:var(--pine-color-border-hover)}.pds-multiselect__trigger:focus:not(.pds-multiselect__trigger--disabled){border-color:var(--pine-color-border-active);outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width)}.pds-multiselect__trigger.pds-multiselect__trigger--open{border-color:var(--pine-color-border-active)}.pds-multiselect__trigger.pds-multiselect__trigger--invalid{background-color:var(--pine-color-red-050);border-color:var(--pine-color-border-danger)}.pds-multiselect__trigger.pds-multiselect__trigger--invalid:focus{outline-color:var(--pine-color-focus-ring-danger)}.pds-multiselect__trigger.pds-multiselect__trigger--disabled{background:var(--pine-color-background-container-disabled);border-color:var(--pine-color-border-disabled);color:var(--pine-color-text-disabled);cursor:not-allowed}.pds-multiselect__trigger-text{color:var(--pine-color-text-strong);-ms-flex:1;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pds-multiselect__trigger-text.pds-multiselect__trigger-text--placeholder{color:var(--pine-color-text-placeholder)}.pds-multiselect__trigger--disabled .pds-multiselect__trigger-text{color:var(--pine-color-text-disabled)}.pds-multiselect__icon{color:var(--pine-color-icon);-ms-flex-negative:var(--pine-dimension-none);flex-shrink:var(--pine-dimension-none)}.pds-multiselect__pill-list{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:var(--pine-dimension-2xs)}.pds-multiselect__pill-list--inline{-ms-flex:1;flex:1;min-width:0}.pds-multiselect__pill-list--below{-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs)}.pds-multiselect__pill-overflow{color:var(--pine-color-text-muted);font:var(--pine-typography-body-sm-medium);white-space:nowrap}.pds-multiselect__trigger--pill-inline{-ms-flex-align:center;align-items:center;-webkit-box-sizing:border-box;box-sizing:border-box;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:var(--pine-dimension-2xs);min-height:var(--pine-dimension-450);padding:var(--pine-dimension-2xs) var(--pine-dimension-sm)}.pds-multiselect__trigger--pill-inline.pds-multiselect__trigger--open{border-color:var(--pine-color-border-active)}.pds-multiselect__trigger--pill-inline:focus-within:not(.pds-multiselect__trigger--disabled){border-color:var(--pine-color-border-active);outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width)}.pds-multiselect__trigger--pill-inline.pds-multiselect__trigger--invalid:focus-within{outline-color:var(--pine-color-focus-ring-danger)}.pds-multiselect__pill-toggle{-ms-flex-align:center;align-items:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border-width:0;cursor:pointer;display:-ms-flexbox;display:flex;padding:0}.pds-multiselect__pill-toggle:focus{outline:3px solid transparent}.pds-multiselect__trigger--disabled .pds-multiselect__pill-toggle{cursor:not-allowed;pointer-events:none}.pds-multiselect__panel{background:var(--pine-color-background-overlay);border-radius:var(--pine-dimension-125);-webkit-box-shadow:var(--pine-box-shadow);box-shadow:var(--pine-box-shadow);-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;position:fixed;z-index:var(--pine-z-index-raised)}.pds-multiselect__search{-ms-flex-align:center;align-items:center;-webkit-border-after:var(--pine-border);border-block-end:var(--pine-border);border-block-end-color:var(--pine-color-border-subtle);display:-ms-flexbox;display:flex;gap:var(--pine-dimension-xs);padding:var(--pine-dimension-xs) var(--pine-dimension-sm)}.pds-multiselect__search pds-icon{color:var(--pine-color-text-muted);-ms-flex-negative:var(--pine-dimension-none);flex-shrink:var(--pine-dimension-none)}.pds-multiselect__search-input{background:transparent;border:var(--pine-dimension-none);color:var(--pine-color-text-strong);-ms-flex:1;flex:1;font:var(--pine-typography-body);letter-spacing:var(--pine-letter-spacing);min-width:var(--pine-dimension-none);outline:none}.pds-multiselect__search-input::-webkit-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-multiselect__search-input::-moz-placeholder{color:var(--pine-color-text-placeholder)}.pds-multiselect__search-input:-ms-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-multiselect__search-input::-ms-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-multiselect__search-input::placeholder{color:var(--pine-color-text-placeholder)}.pds-multiselect__selected-section{-webkit-border-after:var(--pine-border);border-block-end:var(--pine-border);border-block-end-color:var(--pine-color-border-subtle);padding:var(--pine-dimension-xs)}.pds-multiselect__selected-list{list-style:none;margin:var(--pine-dimension-none);padding:var(--pine-dimension-none)}.pds-multiselect__selected-item{color:var(--pine-color-text-strong);font:var(--pine-typography-body);letter-spacing:var(--pine-letter-spacing);overflow:hidden;padding:var(--pine-dimension-2xs) var(--pine-dimension-xs);text-overflow:ellipsis;white-space:nowrap}.pds-multiselect__listbox{background:transparent;border:var(--pine-dimension-none);-webkit-box-sizing:border-box;box-sizing:border-box;list-style:none;margin:var(--pine-dimension-none);overflow-y:auto;padding:var(--pine-dimension-xs)}.pds-multiselect__group-header{color:var(--pine-color-text-muted);display:block;font:var(--pine-typography-body-sm-medium);letter-spacing:var(--pine-letter-spacing);padding:var(--pine-dimension-sm) var(--pine-dimension-xs) var(--pine-dimension-2xs);text-transform:uppercase}.pds-multiselect__listbox>li:first-child>.pds-multiselect__group-header{-webkit-padding-before:var(--pine-dimension-xs);padding-block-start:var(--pine-dimension-xs)}.pds-multiselect__group-list{list-style:none;margin:var(--pine-dimension-none);padding:var(--pine-dimension-none)}.pds-multiselect__option{-ms-flex-align:center;align-items:center;background:transparent;border-radius:var(--pine-dimension-xs);cursor:pointer;display:-ms-flexbox;display:flex;padding:var(--pine-dimension-2xs) var(--pine-dimension-xs);-webkit-transition:background 0.15s;transition:background 0.15s}.pds-multiselect__option pds-checkbox{min-width:var(--pine-dimension-none);pointer-events:none;width:100%}.pds-multiselect__option pds-chip{pointer-events:auto}.pds-multiselect__option:hover:not(.pds-multiselect__option--disabled),.pds-multiselect__option.pds-multiselect__option--highlighted:not(.pds-multiselect__option--disabled){background:var(--pine-color-background-muted)}.pds-multiselect__option.pds-multiselect__option--disabled{cursor:not-allowed;opacity:0.5}.pds-multiselect__option:focus-visible{outline:var(--pine-dimension-none)}.pds-multiselect__option-action{-ms-flex-align:center;align-items:center;block-size:var(--pine-dimension-md);color:var(--pine-color-icon);cursor:pointer;display:-ms-flexbox;display:flex;-ms-flex-negative:0;flex-shrink:0;inline-size:var(--pine-dimension-md);-ms-flex-pack:center;justify-content:center;-webkit-margin-start:var(--pine-dimension-xs);margin-inline-start:var(--pine-dimension-xs)}.pds-multiselect__create-option{color:var(--pine-color-text-strong);width:100%}.pds-multiselect__create-option pds-icon{color:var(--pine-color-text-muted);-ms-flex-negative:var(--pine-dimension-none);flex-shrink:var(--pine-dimension-none)}.pds-multiselect__empty,.pds-multiselect__loading{-ms-flex-align:center;align-items:center;color:var(--pine-color-text-muted);display:-ms-flexbox;display:flex;font:var(--pine-typography-body);-ms-flex-pack:center;justify-content:center;padding:var(--pine-dimension-sm)}.pds-multiselect__load-more{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;padding:var(--pine-dimension-xs)}.pds-multiselect__footer{-webkit-border-before:var(--pine-border);border-block-start:var(--pine-border);border-block-start-color:var(--pine-color-border-subtle);padding:var(--pine-dimension-xs) var(--pine-dimension-sm)}.pds-multiselect__helper{color:var(--pine-color-text-message);font:var(--pine-typography-body-sm-medium);-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs);-webkit-margin-start:var(--pine-dimension-none);margin-inline-start:var(--pine-dimension-none)}.pds-multiselect__error{-ms-flex-align:start;align-items:flex-start;color:var(--pine-color-text-message-danger);display:-ms-flexbox;display:flex;font:var(--pine-typography-body-sm-medium);gap:var(--pine-dimension-2xs);-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs);-webkit-margin-start:var(--pine-dimension-none);margin-inline-start:var(--pine-dimension-none)}.pds-multiselect__error pds-icon{-ms-flex-negative:var(--pine-dimension-none);flex-shrink:var(--pine-dimension-none);-webkit-margin-before:var(--pine-dimension-025);margin-block-start:var(--pine-dimension-025)}.visually-hidden{border:var(--pine-dimension-none);clip:rect(0 0 0 0);-webkit-clip-path:polygon(0 0, 0 0, 0 0);clip-path:polygon(0 0, 0 0, 0 0);height:1px;margin:-1px;overflow:hidden;padding:var(--pine-dimension-none);position:absolute;white-space:nowrap;width:1px}"}},[321,"pds-multiselect",{componentId:[1,"component-id"],label:[1],placeholder:[1],searchPlaceholder:[1,"search-placeholder"],searchOptionsLabel:[1,"search-options-label"],selectedItemsLabel:[1,"selected-items-label"],optionsLabel:[1,"options-label"],noOptionsFoundLabel:[1,"no-options-found-label"],createOptionLabel:[1,"create-option-label"],createOptionAriaLabel:[1,"create-option-aria-label"],itemRemovedLabel:[1,"item-removed-label"],pillRemoveLabel:[1,"pill-remove-label"],selectedCountLabelOne:[1,"selected-count-label-one"],selectedCountLabelOther:[1,"selected-count-label-other"],selectedCountLabels:[1,"selected-count-labels"],closePanelOnSelect:[4,"close-panel-on-select"],name:[1],value:[1040],disabled:[4],asyncUrl:[1,"async-url"],asyncMethod:[1,"async-method"],debounce:[2],fetchTimeout:[2,"fetch-timeout"],maxSelections:[2,"max-selections"],maxHeight:[1,"max-height"],triggerWidth:[1,"trigger-width"],minWidth:[1,"min-width"],panelWidth:[1,"panel-width"],hideLabel:[4,"hide-label"],hideSelectedItems:[4,"hide-selected-items"],selectedDisplay:[1,"selected-display"],pillPosition:[1,"pill-position"],maxInlinePills:[2,"max-inline-pills"],optionDisplay:[1,"option-display"],errorMessage:[1,"error-message"],helperMessage:[1,"helper-message"],invalid:[4],required:[4],loading:[1028],options:[16],formatResult:[16],createUrl:[1,"create-url"],csrfToken:[1,"csrf-token"],csrfHeaderName:[1,"csrf-header-name"],optionActions:[4,"option-actions"],optionActionLabel:[1,"option-action-label"],optionActionDescription:[1,"option-action-description"],isOpen:[32],searchQuery:[32],highlightedIndex:[32],internalOptions:[32],selectedItems:[32],currentPage:[32],hasMore:[32],creating:[32],removalAnnouncement:[32],slottedTriggerEl:[32],setFocus:[64],clear:[64],refreshOptions:[64]},[[6,"keydown","handleWindowKeyDown"]],{debounce:[{setupDebounce:0}],value:[{valueChanged:0}],options:[{optionsChanged:0}],internalOptions:[{internalOptionsChanged:0}],isOpen:[{isOpenChanged:0}],disabled:[{disabledChanged:0}]}]),D=E,F=function(){"undefined"!=typeof customElements&&["pds-multiselect","pds-box","pds-checkbox","pds-chip","pds-icon","pds-loader","pds-text"].forEach((i=>{switch(i){case"pds-multiselect":customElements.get(n(i))||customElements.define(n(i),E);break;case"pds-box":customElements.get(n(i))||w();break;case"pds-checkbox":customElements.get(n(i))||k();break;case"pds-chip":customElements.get(n(i))||O();break;case"pds-icon":customElements.get(n(i))||C();break;case"pds-loader":customElements.get(n(i))||A();break;case"pds-text":customElements.get(n(i))||S()}}))};export{D as PdsMultiselect,F as defineCustomElement}
+import{proxyCustomElement as i,HTMLElement as e,createEvent as t,h as s,Host as o,transformTag as n}from"@stencil/core/internal/client";import{a as l,c as r,o as a,f as d,s as c,b as h}from"./floating-ui.dom.js";import{c as p,d as u,f as m}from"./utils.js";import{i as b,a as v,m as g}from"./form.js";import{g as _,h as f}from"./index2.js";import{f as x,p as y}from"./i18n-format.js";import{d as w}from"./pds-box2.js";import{d as k}from"./pds-checkbox2.js";import{d as O}from"./pds-chip2.js";import{d as C}from"./pds-icon2.js";import{d as A}from"./pds-loader2.js";import{d as S}from"./pds-text2.js";const j=/^[a-z0-9-]+$/i,T='a[href], button:not([disabled]), input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"])',E=i(class extends e{constructor(i){super(),!1!==i&&this.__registerHost(),this.__attachShadow(),this.pdsMultiselectChange=t(this,"pdsMultiselectChange",7),this.pdsMultiselectSearch=t(this,"pdsMultiselectSearch",7),this.pdsMultiselectLoadOptions=t(this,"pdsMultiselectLoadOptions",7),this.pdsMultiselectCreate=t(this,"pdsMultiselectCreate",7),this.pdsMultiselectDismiss=t(this,"pdsMultiselectDismiss",7),this.pdsMultiselectOptionAction=t(this,"pdsMultiselectOptionAction",7),this.hasDisabledSlottedTrigger=!1,this.placeholder="Select...",this.searchPlaceholder="Find...",this.searchOptionsLabel="Search options",this.selectedItemsLabel="Selected items",this.optionsLabel="Options",this.noOptionsFoundLabel="No options found",this.createOptionLabel='Add "{text}"',this.createOptionAriaLabel="Create new tag: {text}",this.itemRemovedLabel="{item} removed",this.pillRemoveLabel="Remove",this.selectedCountLabelOne="{count} item",this.selectedCountLabelOther="{count} items",this.closePanelOnSelect=!1,this.value=[],this.disabled=!1,this.asyncMethod="GET",this.debounce=300,this.fetchTimeout=3e4,this.maxHeight="300px",this.triggerWidth="100%",this.minWidth="250px",this.hideLabel=!1,this.hideSelectedItems=!1,this.selectedDisplay="count",this.pillPosition="inline",this.maxInlinePills=3,this.optionDisplay="text",this.required=!1,this.loading=!1,this.csrfHeaderName="X-CSRF-Token",this.optionActions=!1,this.optionActionLabel="Edit {text}",this.optionActionDescription="Press Right Arrow to {action}",this.isOpen=!1,this.searchQuery="",this.highlightedIndex=-1,this.internalOptions=[],this.selectedItems=[],this.currentPage=1,this.hasMore=!1,this.creating=!1,this.removalAnnouncement="",this.isOpening=!1,this.isClosingViaSelection=!1,this.initialAsyncFetchTriggered=!1,this.pendingUnresolvedFetch=!1,this.handleTriggerClick=i=>{if(!this.disabled){if(i&&!this.slottedTriggerEl&&"pill"===this.selectedDisplay&&"inline"===this.pillPosition&&i.composedPath().some((i=>{var e;return"pds-chip"===(null===(e=i.tagName)||void 0===e?void 0:e.toLowerCase())})))return;this.isOpen?this.closeDropdown():this.openDropdown()}},this.handleTriggerKeyDown=i=>{if(!this.disabled&&i.target===this.activeTriggerEl)switch(i.key){case"ArrowDown":case"ArrowUp":case"Enter":case" ":i.preventDefault(),this.isOpen||this.openDropdown()}},this.handleSearchInputChange=i=>{this.searchQuery=i.target.value,this.highlightedIndex=-1,this.pdsMultiselectSearch.emit({query:this.searchQuery}),this.asyncUrl&&this.debouncedFetchAsyncOptions(this.searchQuery,1)},this.handleSearchInputKeyDown=i=>{var e,t,s;const o=this.getFilteredOptions();switch(i.key){case"ArrowDown":{i.preventDefault();let t=this.highlightedIndex+1;for(;t<o.length&&(null===(e=o[t])||void 0===e?void 0:e.disabled);)t++;t<o.length&&(this.highlightedIndex=t,this.scrollOptionIntoView());break}case"ArrowUp":{i.preventDefault();let e=Math.max(this.highlightedIndex-1,0);for(;e>0&&(null===(t=o[e])||void 0===t?void 0:t.disabled);)e--;(null===(s=o[e])||void 0===s?void 0:s.disabled)||(this.highlightedIndex=e,this.scrollOptionIntoView());break}case"Enter":if(i.preventDefault(),this.highlightedIndex>=0){const i=o[this.highlightedIndex];i&&this.selectOption(i)}break;case"ArrowRight":{const e=o[this.highlightedIndex];!(i.altKey||i.ctrlKey||i.metaKey||i.shiftKey||i.isComposing)&&e&&this.hasOptionAction(e)&&this.isCaretAtEndOfSearch()&&(i.preventDefault(),this.runOptionAction(e));break}case"Tab":{const e=i.shiftKey?void 0:this.getFooterTabbables()[0];null==e||e.focus(),(null==e?void 0:e.matches(":focus"))?i.preventDefault():this.closeDropdown();break}}},this.handleFooterKeyDown=i=>{var e;if("Tab"!==i.key)return;const t=this.getFooterTabbables(),s=i.composedPath()[0];i.shiftKey&&s===t[0]?(i.preventDefault(),null===(e=this.searchInputEl)||void 0===e||e.focus()):i.shiftKey||s!==t[t.length-1]||this.closeDropdown()},this.handleContainerFocusOut=()=>{setTimeout((()=>{var i;if(!this.isOpen||this.isOpening||this.isClosingViaSelection)return;const e=document.activeElement,t=null===(i=this.el.shadowRoot)||void 0===i?void 0:i.contains(e),s=this.el.contains(e);t||s||(this.pdsMultiselectDismiss.emit(),this.closeDropdown())}),0)},this.handleOptionMouseDown=i=>e=>{e.preventDefault(),this.toggleOption(i)},this.handleOptionClick=i=>{i.preventDefault()},this.handleOptionMouseEnter=(i,e)=>()=>{e.disabled||(this.highlightedIndex=i)},this.handleOptionActionMouseDown=i=>{i.preventDefault(),i.stopPropagation()},this.handleOptionActionClick=i=>()=>{this.runOptionAction(i)},this.handleFooterMouseDown=i=>{i.preventDefault()},this.handleScroll=i=>{if(!this.asyncUrl||!this.hasMore||this.loading)return;const e=i.target;e.scrollHeight-e.scrollTop-e.clientHeight<50&&(this.pdsMultiselectLoadOptions.emit({query:this.searchQuery,page:this.currentPage+1}),this.debouncedFetchAsyncOptions(this.searchQuery,this.currentPage+1))},this.handlePillRemove=i=>()=>{var e,t;if(this.disabled)return;const s=i.id+"";this.value=this.value.filter((i=>i!==s)),this.syncSelectedItems(),this.emitChange({removed:[s]}),this.removalAnnouncement="",queueMicrotask((()=>{this.removalAnnouncement=x(this.itemRemovedLabel,{item:i.text})})),this.isClosingViaSelection=!0,this.isOpen?null===(e=this.searchInputEl)||void 0===e||e.focus():null===(t=this.activeTriggerEl)||void 0===t||t.focus(),setTimeout((()=>{this.isClosingViaSelection=!1}),0)}}connectedCallback(){this.el.attachInternals&&!this.internals&&(this.internals=this.el.attachInternals())}formDisabledCallback(i){i&&!this.el.closest("fieldset[disabled]")||(this.disabled=i)}componentWillLoad(){this.originalSearchEmitter=this.pdsMultiselectSearch,this.syncSelectedItems(),this.syncSlottedTrigger()}componentDidLoad(){this.setupDebounce(),this.setupMutationObserver(),this.setupSlotChangeListener(),this.updateFormValue(),requestAnimationFrame((()=>{this.updateOptionsFromSlot(),this.syncSelectedItems()})),this.asyncUrl&&this.ensureValueArray().length>0&&(this.initialAsyncFetchTriggered=!0,this.fetchOptions("",1))}setupSlotChangeListener(){var i;const e=null===(i=this.el.shadowRoot)||void 0===i?void 0:i.querySelector("slot:not([name])");e&&(e.addEventListener("slotchange",(()=>{this.updateOptionsFromSlot(),this.syncSelectedItems()})),this.updateOptionsFromSlot())}disconnectedCallback(){var i,e;p(this.pdsMultiselectSearch),null===(i=this.observer)||void 0===i||i.disconnect(),null===(e=this.cleanupAutoUpdate)||void 0===e||e.call(this),this.clearAsyncFetchState()}setupDebounce(){const{pdsMultiselectSearch:i,debounce:e,originalSearchEmitter:t}=this;this.pdsMultiselectSearch=void 0===e?null!=t?t:i:u(i,e),m(i)}valueChanged(i){if("string"==typeof i)try{const e=JSON.parse(i);if(Array.isArray(e))return void(this.value=e)}catch(e){return void(this.value=i?[i]:[])}if(this.syncSelectedItems(),this.updateFormValue(),this.asyncUrl){const i=this.ensureValueArray();i.length>0&&this.selectedItems.length<i.length&&(this.loading?this.pendingUnresolvedFetch=!0:this.fetchOptions("",1))}}optionsChanged(){this.options&&(this.internalOptions=[...this.options])}internalOptionsChanged(){this.syncSelectedItems()}isOpenChanged(){var i;null===(i=this.slottedTriggerEl)||void 0===i||i.setAttribute("aria-expanded",this.isOpen+"")}disabledChanged(i){var e,t;if(this.syncSlottedTrigger(),!i||!this.isOpen)return;const s=document.activeElement,o=!(!(null===(e=this.el.shadowRoot)||void 0===e?void 0:e.contains(s))&&!this.el.contains(s));this.closeDropdown(),o&&(null===(t=this.activeTriggerEl)||void 0===t||t.focus())}async setFocus(){var i;null===(i=this.activeTriggerEl)||void 0===i||i.focus()}async clear(){const i=this.value.length>0||""!==this.searchQuery,e=this.ensureValueArray();this.value=[],this.searchQuery="",this.syncSelectedItems(),this.updateFormValue(),i&&this.emitChange({removed:e})}async refreshOptions(){await this.fetchOptions(this.searchQuery,1)}handleWindowKeyDown(i){var e;this.isOpen&&!i.defaultPrevented&&"Escape"===i.key&&(i.preventDefault(),this.pdsMultiselectDismiss.emit(),this.closeDropdown(),null===(e=this.activeTriggerEl)||void 0===e||e.focus())}get activeTriggerEl(){var i;return null!==(i=this.slottedTriggerEl)&&void 0!==i?i:this.triggerEl}syncSlottedTrigger(){const i=Array.from(this.el.children).find((i=>"trigger"===i.getAttribute("slot")));if(i!==this.slottedTriggerEl){const e=this.slottedTriggerEl;e&&(e.removeEventListener("click",this.handleTriggerClick),e.removeEventListener("keydown",this.handleTriggerKeyDown),e.removeAttribute("aria-expanded"),e.removeAttribute("aria-haspopup"),e.removeAttribute("aria-disabled"),this.setSlottedTriggerDisabled(e,!1)),null==i||i.addEventListener("click",this.handleTriggerClick),null==i||i.addEventListener("keydown",this.handleTriggerKeyDown),this.slottedTriggerEl=i}i&&(i.setAttribute("aria-haspopup","listbox"),i.setAttribute("aria-expanded",this.isOpen+""),this.disabled?i.setAttribute("aria-disabled","true"):i.removeAttribute("aria-disabled"),this.setSlottedTriggerDisabled(i,this.disabled))}setSlottedTriggerDisabled(i,e){if(!("disabled"in i))return void(e&&i.localName.includes("-")&&void 0===customElements.get(i.localName)&&customElements.whenDefined(i.localName).then((()=>this.syncSlottedTrigger())));const t=i;e&&!t.disabled?(t.disabled=!0,this.hasDisabledSlottedTrigger=!0):!e&&this.hasDisabledSlottedTrigger&&(t.disabled=!1,this.hasDisabledSlottedTrigger=!1)}setupMutationObserver(){this.observer=new MutationObserver((i=>{i.some((i=>i.target===this.el))&&this.syncSlottedTrigger();const e=this.slottedTriggerEl;e&&!i.some((i=>!e.contains(i.target)))||this.updateOptionsFromSlot()})),this.observer.observe(this.el,{childList:!0,subtree:!0})}updateOptionsFromSlot(){var i;const e=null===(i=this.el.shadowRoot)||void 0===i?void 0:i.querySelector("slot:not([name])");if(!e)return;const t=[];e.assignedElements({flatten:!0}).forEach((i=>{if("OPTGROUP"===i.tagName){const e=i.label,s=i.disabled;i.querySelectorAll("option").forEach((i=>{const o=this.parseSlottedOption(i,s);e&&(o.group=e),t.push(o)}))}else"OPTION"===i.tagName&&t.push(this.parseSlottedOption(i,!1))})),t.length>0&&!this.asyncUrl&&!this.options&&(this.internalOptions=t)}parseSlottedOption(i,e){var t;const s={id:i.value,text:(null===(t=i.textContent)||void 0===t?void 0:t.trim())||i.value,disabled:i.disabled||e||void 0},o=i.getAttribute("data-dot-color");o&&(s.dotColor=o);const n=i.getAttribute("data-action-icon");n&&(s.actionIcon=n);const l=i.getAttribute("data-action-label");return l&&(s.actionLabel=l),s}clearAsyncFetchState(){var i;void 0!==this.fetchDebounceTimer&&(window.clearTimeout(this.fetchDebounceTimer),this.fetchDebounceTimer=void 0),void 0!==this.fetchTimeoutTimer&&(window.clearTimeout(this.fetchTimeoutTimer),this.fetchTimeoutTimer=void 0),null===(i=this.abortController)||void 0===i||i.abort(),this.abortController=void 0}debouncedFetchAsyncOptions(i,e=1){var t;if(!this.asyncUrl)return;void 0!==this.fetchDebounceTimer&&window.clearTimeout(this.fetchDebounceTimer);const s=Math.max(0,null!==(t=this.debounce)&&void 0!==t?t:0);this.fetchDebounceTimer=window.setTimeout((()=>{this.fetchDebounceTimer=void 0,this.fetchOptions(i,e)}),s)}syncSelectedItems(){const i=this.ensureValueArray(),e=this.getAllOptions(),t=[],s=new Map(this.selectedItems.map((i=>[i.id+"",i])));i.forEach((i=>{const o=e.find((e=>e.id+""==i+""));o?t.push(o):s.has(i+"")&&t.push(s.get(i+""))})),this.selectedItems=t}ensureValueArray(){if("string"==typeof this.value)try{const i=JSON.parse(this.value);if(Array.isArray(i))return this.value=i,i}catch(i){const e=this.value;return this.value=e?[e]:[],this.value}return Array.isArray(this.value)?this.value:[]}getAllOptions(){return this.options||this.internalOptions}getFilteredOptions(){const i=this.getAllOptions(),e=this.searchQuery.toLowerCase(),t=i.filter((i=>!e||i.text.toLowerCase().includes(e)));return this.createUrl&&this.searchQuery.trim()&&0===t.length?[{id:"__create__",text:this.searchQuery.trim(),isCreateOption:!0}]:t}updateFormValue(){var i;if(!b()&&(null===(i=this.internals)||void 0===i?void 0:i.setFormValue)){const i=this.ensureValueArray(),e=new FormData;i.forEach((i=>{this.name&&e.append(this.name,i)})),this.internals.setFormValue(e),this.required&&0===i.length?this.internals.setValidity({valueMissing:!0},"Please select at least one option.",this.activeTriggerEl):this.internals.setValidity({})}}getCsrfToken(){if(this.csrfToken)return this.csrfToken;const i=document.querySelector('meta[name="csrf-token"]');return(null==i?void 0:i.content)||null}async fetchOptions(i,e=1){var t;if(this.asyncUrl){null===(t=this.abortController)||void 0===t||t.abort(),void 0!==this.fetchTimeoutTimer&&(window.clearTimeout(this.fetchTimeoutTimer),this.fetchTimeoutTimer=void 0),this.abortController=new AbortController,this.loading=!0,this.fetchTimeoutTimer=window.setTimeout((()=>{var i;null===(i=this.abortController)||void 0===i||i.abort(),this.fetchTimeoutTimer=void 0}),this.fetchTimeout);try{let t;try{t=new URL(this.asyncUrl,window.location.origin)}catch(i){throw new TypeError("Invalid asyncUrl: "+this.asyncUrl)}"GET"===this.asyncMethod&&(t.searchParams.set("search",i),t.searchParams.set("page",e+""));const s=this.getCsrfToken(),o={"Content-Type":"application/json",Accept:"application/json"};s&&(o[this.csrfHeaderName||"X-CSRF-Token"]=s);const n=await fetch(""+t,Object.assign({method:this.asyncMethod,signal:this.abortController.signal,headers:o},"POST"===this.asyncMethod&&{body:JSON.stringify({search:i,page:e})}));if(void 0!==this.fetchTimeoutTimer&&(window.clearTimeout(this.fetchTimeoutTimer),this.fetchTimeoutTimer=void 0),!n.ok)throw Error("Failed to fetch options");const l=await n.json(),r=l.results.map((i=>this.formatResult?this.formatResult(i):"object"==typeof i&&null!==i?Object.assign({id:i.id,text:i.text},i):{id:i+"",text:i+""}));this.internalOptions=1===e?r:[...this.internalOptions,...r],this.hasMore=!!l.totalCount&&this.internalOptions.length<l.totalCount,this.currentPage=e}catch(i){void 0!==this.fetchTimeoutTimer&&(window.clearTimeout(this.fetchTimeoutTimer),this.fetchTimeoutTimer=void 0),"AbortError"!==i.name&&console.error("PdsMultiselect: Failed to fetch options",i)}finally{if(this.loading=!1,this.pendingUnresolvedFetch){this.pendingUnresolvedFetch=!1;const i=this.ensureValueArray();i.length>0&&this.selectedItems.length<i.length&&this.fetchOptions("",1)}}}}async createOption(i){if(this.createUrl&&i.trim()&&!this.creating){this.creating=!0;try{const e=new URL(this.createUrl,window.location.origin),t=this.getCsrfToken(),s={"Content-Type":"application/json",Accept:"application/json"};t&&(s[this.csrfHeaderName||"X-CSRF-Token"]=t);const o=await fetch(""+e,{method:"POST",headers:s,body:JSON.stringify({text:i.trim()})});if(!o.ok)throw Error("Failed to create option");const n=await o.json(),l=Object.assign({id:n.id,text:n.text},n);this.internalOptions=[...this.internalOptions,l],this.value=[...this.value,l.id+""],this.syncSelectedItems(),this.pdsMultiselectCreate.emit({query:i.trim(),newOption:l}),this.emitChange({added:[l.id+""]}),this.searchQuery="",this.highlightedIndex=-1,requestAnimationFrame((()=>{var i;null===(i=this.searchInputEl)||void 0===i||i.focus()}))}catch(i){console.error("PdsMultiselect: Failed to create option",i)}finally{this.creating=!1}}}getFooterTabbables(){const i=[];return Array.from(this.el.children).filter((i=>"footer"===i.getAttribute("slot"))).forEach((e=>i.push(e,...Array.from(e.querySelectorAll("*"))))),i.map((i=>{var e;return i.matches(T)?i:null===(e=i.shadowRoot)||void 0===e?void 0:e.querySelector(T)})).filter((i=>{var e,t;return!!i&&(null===(t=null===(e=i.checkVisibility)||void 0===e?void 0:e.call(i))||void 0===t||t)}))}isCaretAtEndOfSearch(){var i,e;const t=this.searchInputEl;if(!t)return!0;const s=t.value.length;return(null!==(i=t.selectionStart)&&void 0!==i?i:s)===s&&(null!==(e=t.selectionEnd)&&void 0!==e?e:s)===s}hasOptionAction(i){return this.optionActions&&"string"==typeof i.actionIcon&&j.test(i.actionIcon)&&!i.isCreateOption&&!i.disabled}get isHoverless(){var i,e,t;return null!==(i=this.hoverlessQuery)&&void 0!==i||(this.hoverlessQuery=null===(e=window.matchMedia)||void 0===e?void 0:e.call(window,"(hover: none)")),!!(null===(t=this.hoverlessQuery)||void 0===t?void 0:t.matches)}runOptionAction(i){var e;this.isClosingViaSelection=!0,this.closeDropdown(),null===(e=this.activeTriggerEl)||void 0===e||e.focus(),this.pdsMultiselectOptionAction.emit({option:i})}openDropdown(){this.disabled||(this.isOpening=!0,this.isOpen=!0,this.highlightedIndex=-1,this.asyncUrl&&0===this.internalOptions.length&&!this.initialAsyncFetchTriggered&&this.debouncedFetchAsyncOptions(this.searchQuery,1),this.initialAsyncFetchTriggered=!1,requestAnimationFrame((()=>{var i;this.positionDropdown(),null===(i=this.searchInputEl)||void 0===i||i.focus(),setTimeout((()=>{this.isOpening=!1}),50)})))}closeDropdown(){this.isOpen=!1,this.highlightedIndex=-1,this.searchQuery="",this.isClosingViaSelection&&setTimeout((()=>{this.isClosingViaSelection=!1}),0),this.cleanupAutoUpdate&&(this.cleanupAutoUpdate(),this.cleanupAutoUpdate=void 0)}positionDropdown(){if(!this.containerEl||!this.panelEl)return;const i=this.slottedTriggerEl||this.pillInlineTriggerEl||this.triggerEl||this.containerEl,{minWidth:e,panelWidth:t}=this,s=()=>{r(i,this.panelEl,{placement:"bottom-start",strategy:"fixed",middleware:[a(12),d(),c({padding:8}),h({apply:({rects:i,elements:s})=>{Object.assign(s.floating.style,{width:null!=t?t:i.reference.width+"px",minWidth:e})}})]}).then((({x:i,y:e})=>{this.panelEl&&(this.panelEl.style.left=i+"px",this.panelEl.style.top=e+"px")}))};s();const o=l(i,this.panelEl,s);this.cleanupAutoUpdate=()=>{o(),this.clearAsyncFetchState()}}scrollOptionIntoView(){requestAnimationFrame((()=>{var i;const e=null===(i=this.listboxEl)||void 0===i?void 0:i.querySelector(`[data-index="${this.highlightedIndex}"]`);null==e||e.scrollIntoView({block:"nearest",behavior:"smooth"})}))}emitChange({added:i=[],removed:e=[]}){this.pdsMultiselectChange.emit({values:this.value,items:this.selectedItems,added:i,removed:e})}toggleOption(i){var e,t;if(i.disabled)return;if(i.isCreateOption)return void(this.creating||this.createOption(this.searchQuery));const s=i.id+"",o=this.value.includes(s);if(o)this.value=this.value.filter((i=>i!==s));else{if(this.maxSelections&&this.value.length>=this.maxSelections)return;this.value=[...this.value,s]}this.syncSelectedItems(),this.emitChange(o?{removed:[s]}:{added:[s]}),this.closePanelOnSelect?(this.isClosingViaSelection=!0,this.closeDropdown(),null===(e=this.activeTriggerEl)||void 0===e||e.focus()):null===(t=this.searchInputEl)||void 0===t||t.focus()}selectOption(i){this.toggleOption(i)}getGroupedRenderItems(i){const e=[];let t=null;return i.forEach(((i,s)=>{const o=i.group;void 0!==o?(t&&t.group===o||(t={type:"group",group:o,options:[]},e.push(t)),t.options.push({option:i,index:s})):(t=null,e.push({type:"option",option:i,index:s}))})),e}renderOption(i,e,t){const o=t.includes(i.id+""),n=i.isCreateOption,l=i.disabled,r=e===this.highlightedIndex&&!n,a=`${this.componentId}-option-${e}`,d=n&&this.creating,c=this.hasOptionAction(i);return s("li",{key:i.id+"",id:a,class:{"pds-multiselect__option":!0,"pds-multiselect__option--highlighted":r,"pds-multiselect__option--selected":o,"pds-multiselect__option--create":n,"pds-multiselect__option--disabled":l||d},role:"option","aria-selected":o?"true":"false","aria-disabled":l||d?"true":void 0,"aria-label":n?x(this.createOptionAriaLabel,{text:i.text}):void 0,"aria-describedby":c?a+"-action-description":void 0,"data-index":e,onMouseDown:this.handleOptionMouseDown(i),onClick:this.handleOptionClick,onMouseEnter:this.handleOptionMouseEnter(e,i)},n?s("pds-box",{class:"pds-multiselect__create-option","align-items":"center",gap:"xs"},s("pds-icon",{name:"add",size:"small","aria-hidden":"true"}),s("pds-text",null,x(this.createOptionLabel,{text:i.text}))):s("pds-checkbox",{componentId:`${this.componentId}-checkbox-${e}`,checked:o,label:i.text,disabled:l,style:{pointerEvents:"none"}},"chip"===this.optionDisplay&&s("pds-chip",{slot:"label",sentiment:"subtle",dot:!!i.dotColor,"dot-color":i.dotColor,"max-width":"100%"},i.text)),c&&this.renderOptionAction(i,a,r))}renderOptionAction(i,e,t){var o;const n=x(null!==(o=i.actionLabel)&&void 0!==o?o:this.optionActionLabel,{text:i.text});return[s("span",{class:"pds-multiselect__option-action",title:n,"aria-hidden":"true",onMouseDown:this.handleOptionActionMouseDown,onClick:this.handleOptionActionClick(i)},(t||this.isHoverless)&&s("pds-icon",{name:i.actionIcon})),s("span",{id:e+"-action-description",hidden:!0},x(this.optionActionDescription,{action:n}))]}renderSelectedItemsList(){return this.hideSelectedItems||0===this.selectedItems.length?null:s("div",{class:"pds-multiselect__selected-section"},s("ul",{class:"pds-multiselect__selected-list",role:"list"},this.selectedItems.map((i=>s("li",{key:i.id+"",class:"pds-multiselect__selected-item"},i.text)))))}renderDropdown(){if(!this.isOpen)return null;const i=this.getFilteredOptions(),e=this.ensureValueArray(),t=!!this.el.querySelector('[slot="empty"]'),o=!!this.el.querySelector('[slot="loading"]'),n=!!this.el.querySelector('[slot="footer"]');return s("div",{class:"pds-multiselect__panel",ref:i=>this.panelEl=i,style:{minWidth:this.minWidth}},s("div",{class:"pds-multiselect__search"},s("pds-icon",{name:"search",size:"small","aria-hidden":"true"}),s("input",{ref:i=>this.searchInputEl=i,type:"text",class:"pds-multiselect__search-input",placeholder:this.searchPlaceholder,value:this.searchQuery,"aria-label":this.searchOptionsLabel,"aria-controls":this.componentId+"-listbox","aria-activedescendant":this.highlightedIndex>=0?`${this.componentId}-option-${this.highlightedIndex}`:void 0,role:"combobox","aria-haspopup":"listbox","aria-expanded":"true","aria-autocomplete":"list",autocomplete:"off",onInput:this.handleSearchInputChange,onKeyDown:this.handleSearchInputKeyDown})),this.renderSelectedItemsList(),s("ul",{class:"pds-multiselect__listbox",role:"listbox","aria-multiselectable":"true","aria-label":this.label||this.optionsLabel,id:this.componentId+"-listbox",ref:i=>this.listboxEl=i,style:{maxHeight:this.maxHeight},onScroll:this.handleScroll},this.loading&&s("li",{class:"pds-multiselect__loading",role:"presentation"},o?s("slot",{name:"loading"}):s("pds-loader",{size:"small"})),!this.loading&&0===i.length&&s("li",{class:"pds-multiselect__empty",role:"presentation"},t?s("slot",{name:"empty"}):s("span",null,this.noOptionsFoundLabel)),this.getGroupedRenderItems(i).map(((i,t)=>"group"===i.type?s("li",{key:"group-"+t,role:"group","aria-label":i.group,class:"pds-multiselect__group"},s("span",{class:"pds-multiselect__group-header","aria-hidden":"true"},i.group),s("ul",{class:"pds-multiselect__group-list",role:"presentation"},i.options.map((({option:i,index:t})=>this.renderOption(i,t,e))))):this.renderOption(i.option,i.index,e))),this.hasMore&&!this.loading&&s("li",{class:"pds-multiselect__load-more",role:"presentation"},s("pds-loader",{size:"small"}))),n&&s("div",{class:"pds-multiselect__footer",onMouseDown:this.handleFooterMouseDown,onKeyDown:this.handleFooterKeyDown},s("slot",{name:"footer"})))}renderInlinePills(){if(!(this.selectedItems.length>0))return s("span",{class:"pds-multiselect__trigger-text pds-multiselect__trigger-text--placeholder"},this.placeholder||"Select...");const i=this.disabled?"text":"tag",e=this.selectedItems.slice(0,Math.max(1,this.maxInlinePills)),t=this.selectedItems.length-e.length;return s("div",{class:"pds-multiselect__pill-list pds-multiselect__pill-list--inline","aria-label":this.selectedItemsLabel},e.map((e=>s("pds-chip",{key:e.id+"","component-id":`${this.componentId}-pill-${e.id}`,variant:i,size:"sm",sentiment:"neutral","dismiss-label":this.pillRemoveLabel,onPdsTagCloseClick:this.handlePillRemove(e)},e.text))),t>0&&s("span",{class:"pds-multiselect__pill-overflow"},"+",t))}renderBelowPills(){if(0===this.selectedItems.length)return null;const i=this.disabled?"text":"tag";return s("div",{class:"pds-multiselect__pill-list pds-multiselect__pill-list--below","aria-label":this.selectedItemsLabel},this.selectedItems.map((e=>s("pds-chip",{key:e.id+"","component-id":`${this.componentId}-pill-${e.id}`,variant:i,size:"md",sentiment:"neutral","dismiss-label":this.pillRemoveLabel,onPdsTagCloseClick:this.handlePillRemove(e)},e.text))))}getTriggerText(){const i=this.selectedItems.length;return 0===i||"pill"===this.selectedDisplay&&"below"===this.pillPosition?this.placeholder||"Select...":y(this.el,i,this.resolveCountForms())}resolveCountForms(){const i={one:this.selectedCountLabelOne,other:this.selectedCountLabelOther},e=this.selectedCountLabels;if(!e)return i;if("string"==typeof e)try{const t=JSON.parse(e);return t&&"object"==typeof t?Object.assign(Object.assign({},i),t):i}catch(e){return i}return Object.assign(Object.assign({},i),e)}render(){const i=this.selectedItems.length>0;return s(o,{key:"a92086af75e20b9b37b147365bfa517d96021700","aria-disabled":this.disabled?"true":null},s("div",{key:"d49e0442e3a348248e5ac3b37afc9f128b34956b",class:"pds-multiselect",onFocusout:this.handleContainerFocusOut},this.label&&s("label",{key:"41a081803dfd784e20a7135ecf5f5c4657908dd1",id:this.componentId+"-label",htmlFor:this.componentId,class:{"pds-multiselect__label":!0,"visually-hidden":this.hideLabel}},this.label),s("div",{key:"0e3c8a3aaf7c70b4ff71972c29b8d5599f62ec97",class:"pds-multiselect__wrapper",ref:i=>this.containerEl=i,style:{width:this.triggerWidth}},this.slottedTriggerEl?s("slot",{name:"trigger"}):"pill"===this.selectedDisplay&&"inline"===this.pillPosition?s("div",{ref:i=>this.pillInlineTriggerEl=i||void 0,part:"trigger",class:{"pds-multiselect__trigger":!0,"pds-multiselect__trigger--open":this.isOpen,"pds-multiselect__trigger--disabled":this.disabled,"pds-multiselect__trigger--invalid":this.invalid||!!this.errorMessage,"pds-multiselect__trigger--has-value":i,"pds-multiselect__trigger--pill-inline":!0},onClick:this.handleTriggerClick},this.renderInlinePills(),s("button",{ref:i=>this.triggerEl=i,type:"button",id:this.componentId,part:"pill-toggle",class:"pds-multiselect__pill-toggle",disabled:this.disabled,"aria-expanded":this.isOpen?"true":"false","aria-haspopup":"listbox","aria-labelledby":this.label?this.componentId+"-label":void 0,"aria-required":this.required?"true":void 0,"aria-describedby":v(this.componentId,this.invalid||!!this.errorMessage,this.helperMessage,this.errorMessage),"aria-invalid":this.invalid||this.errorMessage?"true":void 0,onKeyDown:this.handleTriggerKeyDown},s("pds-icon",{"aria-hidden":"true",class:"pds-multiselect__icon",icon:_}))):s("button",{ref:i=>this.triggerEl=i,type:"button",part:"trigger",class:{"pds-multiselect__trigger":!0,"pds-multiselect__trigger--open":this.isOpen,"pds-multiselect__trigger--disabled":this.disabled,"pds-multiselect__trigger--invalid":this.invalid||!!this.errorMessage,"pds-multiselect__trigger--has-value":i},id:this.componentId,disabled:this.disabled,"aria-required":this.required?"true":void 0,"aria-expanded":this.isOpen?"true":"false","aria-haspopup":"listbox","aria-describedby":v(this.componentId,this.invalid||!!this.errorMessage,this.helperMessage,this.errorMessage),"aria-invalid":this.invalid||this.errorMessage?"true":void 0,onClick:this.handleTriggerClick,onKeyDown:this.handleTriggerKeyDown},s("span",{class:{"pds-multiselect__trigger-text":!0,"pds-multiselect__trigger-text--placeholder":!i||"pill"===this.selectedDisplay&&"below"===this.pillPosition}},this.getTriggerText()),s("pds-icon",{"aria-hidden":"true",class:"pds-multiselect__icon",icon:_})),this.renderDropdown()),"pill"===this.selectedDisplay&&"below"===this.pillPosition&&this.renderBelowPills(),s("span",{key:"d5cddc1d3374d94ecf0cce1bcaf7c7125bf3128d",class:"visually-hidden","aria-live":"polite","aria-atomic":"true"},this.removalAnnouncement),this.helperMessage&&!(this.errorMessage&&this.errorMessage.length>0)&&s("p",{key:"e3cb958b6fd2b1e138b769de0f53be1b8564902d",class:"pds-multiselect__helper",id:g(this.componentId,"helper")},this.helperMessage),this.errorMessage&&s("p",{key:"f6c2a30cc192391973d9b22fbb6732ce387832ac",class:"pds-multiselect__error",id:g(this.componentId,"error")},s("pds-icon",{key:"f437effafaa383b81aec7b5bf635598c8b0075b8","aria-hidden":"true",icon:f,size:"small"}),this.errorMessage),s("div",{key:"f1e747137f2dc7cad3d4e1ff8fc293401e3173e1",style:{display:"none"}},s("slot",{key:"f337137b3ca5983dc6641361101f6d19c972778c"}))))}static get formAssociated(){return!0}get el(){return this}static get watchers(){return{debounce:[{setupDebounce:0}],value:[{valueChanged:0}],options:[{optionsChanged:0}],internalOptions:[{internalOptionsChanged:0}],isOpen:[{isOpenChanged:0}],disabled:[{disabledChanged:0}]}}static get style(){return":host{display:block}:host([aria-disabled=true]) .pds-multiselect__trigger{background:var(--pine-color-background-container-disabled);border-color:var(--pine-color-border-disabled);color:var(--pine-color-text-disabled);cursor:not-allowed}:host([aria-disabled=true]) .pds-multiselect__icon{color:var(--pine-color-text-disabled)}.pds-multiselect{position:relative}.pds-multiselect__label{color:var(--pine-color-text-label);display:block;font:var(--pine-typography-body-medium);letter-spacing:var(--pine-letter-spacing);-webkit-margin-after:var(--pine-dimension-2xs);margin-block-end:var(--pine-dimension-2xs)}.pds-multiselect__wrapper{position:relative}.pds-multiselect__trigger{-ms-flex-align:center;align-items:center;background:var(--pine-color-background-container);border:var(--pine-border);border-radius:var(--pine-dimension-125);cursor:pointer;display:-ms-flexbox;display:flex;font:var(--pine-typography-body-medium);gap:var(--pine-dimension-xs);-ms-flex-pack:justify;justify-content:space-between;letter-spacing:var(--pine-letter-spacing);min-height:var(--pine-dimension-450);padding:var(--pine-dimension-xs) var(--pine-dimension-sm);position:relative;text-align:start;-webkit-transition:border-color var(--pine-motion-duration-base) ease, -webkit-box-shadow var(--pine-motion-duration-base) ease;transition:border-color var(--pine-motion-duration-base) ease, -webkit-box-shadow var(--pine-motion-duration-base) ease;transition:border-color var(--pine-motion-duration-base) ease, box-shadow var(--pine-motion-duration-base) ease;transition:border-color var(--pine-motion-duration-base) ease, box-shadow var(--pine-motion-duration-base) ease, -webkit-box-shadow var(--pine-motion-duration-base) ease;width:100%}.pds-multiselect__trigger:hover:not(.pds-multiselect__trigger--disabled){border-color:var(--pine-color-border-hover)}.pds-multiselect__trigger:focus:not(.pds-multiselect__trigger--disabled){border-color:var(--pine-color-border-active);outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width)}.pds-multiselect__trigger.pds-multiselect__trigger--open{border-color:var(--pine-color-border-active)}.pds-multiselect__trigger.pds-multiselect__trigger--invalid{background-color:var(--pine-color-red-050);border-color:var(--pine-color-border-danger)}.pds-multiselect__trigger.pds-multiselect__trigger--invalid:focus{outline-color:var(--pine-color-focus-ring-danger)}.pds-multiselect__trigger.pds-multiselect__trigger--disabled{background:var(--pine-color-background-container-disabled);border-color:var(--pine-color-border-disabled);color:var(--pine-color-text-disabled);cursor:not-allowed}.pds-multiselect__trigger-text{color:var(--pine-color-text-strong);-ms-flex:1;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pds-multiselect__trigger-text.pds-multiselect__trigger-text--placeholder{color:var(--pine-color-text-placeholder)}.pds-multiselect__trigger--disabled .pds-multiselect__trigger-text{color:var(--pine-color-text-disabled)}.pds-multiselect__icon{color:var(--pine-color-icon);-ms-flex-negative:var(--pine-dimension-none);flex-shrink:var(--pine-dimension-none)}.pds-multiselect__pill-list{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:var(--pine-dimension-2xs)}.pds-multiselect__pill-list--inline{-ms-flex:1;flex:1;min-width:0}.pds-multiselect__pill-list--below{-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs)}.pds-multiselect__pill-overflow{color:var(--pine-color-text-muted);font:var(--pine-typography-body-sm-medium);white-space:nowrap}.pds-multiselect__trigger--pill-inline{-ms-flex-align:center;align-items:center;-webkit-box-sizing:border-box;box-sizing:border-box;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:var(--pine-dimension-2xs);min-height:var(--pine-dimension-450);padding:var(--pine-dimension-2xs) var(--pine-dimension-sm)}.pds-multiselect__trigger--pill-inline.pds-multiselect__trigger--open{border-color:var(--pine-color-border-active)}.pds-multiselect__trigger--pill-inline:focus-within:not(.pds-multiselect__trigger--disabled){border-color:var(--pine-color-border-active);outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width)}.pds-multiselect__trigger--pill-inline.pds-multiselect__trigger--invalid:focus-within{outline-color:var(--pine-color-focus-ring-danger)}.pds-multiselect__pill-toggle{-ms-flex-align:center;align-items:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border-width:0;cursor:pointer;display:-ms-flexbox;display:flex;padding:0}.pds-multiselect__pill-toggle:focus{outline:3px solid transparent}.pds-multiselect__trigger--disabled .pds-multiselect__pill-toggle{cursor:not-allowed;pointer-events:none}.pds-multiselect__panel{background:var(--pine-color-background-overlay);border-radius:var(--pine-dimension-125);-webkit-box-shadow:var(--pine-box-shadow);box-shadow:var(--pine-box-shadow);-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;position:fixed;z-index:var(--pine-z-index-raised)}.pds-multiselect__search{-ms-flex-align:center;align-items:center;-webkit-border-after:var(--pine-border);border-block-end:var(--pine-border);border-block-end-color:var(--pine-color-border-subtle);display:-ms-flexbox;display:flex;gap:var(--pine-dimension-xs);padding:var(--pine-dimension-xs) var(--pine-dimension-sm)}.pds-multiselect__search pds-icon{color:var(--pine-color-text-muted);-ms-flex-negative:var(--pine-dimension-none);flex-shrink:var(--pine-dimension-none)}.pds-multiselect__search-input{background:transparent;border:var(--pine-dimension-none);color:var(--pine-color-text-strong);-ms-flex:1;flex:1;font:var(--pine-typography-body);letter-spacing:var(--pine-letter-spacing);min-width:var(--pine-dimension-none);outline:none}.pds-multiselect__search-input::-webkit-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-multiselect__search-input::-moz-placeholder{color:var(--pine-color-text-placeholder)}.pds-multiselect__search-input:-ms-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-multiselect__search-input::-ms-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-multiselect__search-input::placeholder{color:var(--pine-color-text-placeholder)}.pds-multiselect__selected-section{-webkit-border-after:var(--pine-border);border-block-end:var(--pine-border);border-block-end-color:var(--pine-color-border-subtle);padding:var(--pine-dimension-xs)}.pds-multiselect__selected-list{list-style:none;margin:var(--pine-dimension-none);padding:var(--pine-dimension-none)}.pds-multiselect__selected-item{color:var(--pine-color-text-strong);font:var(--pine-typography-body);letter-spacing:var(--pine-letter-spacing);overflow:hidden;padding:var(--pine-dimension-2xs) var(--pine-dimension-xs);text-overflow:ellipsis;white-space:nowrap}.pds-multiselect__listbox{background:transparent;border:var(--pine-dimension-none);-webkit-box-sizing:border-box;box-sizing:border-box;list-style:none;margin:var(--pine-dimension-none);overflow-y:auto;padding:var(--pine-dimension-xs)}.pds-multiselect__group-header{color:var(--pine-color-text-muted);display:block;font:var(--pine-typography-body-sm-medium);letter-spacing:var(--pine-letter-spacing);padding:var(--pine-dimension-sm) var(--pine-dimension-xs) var(--pine-dimension-2xs);text-transform:uppercase}.pds-multiselect__listbox>li:first-child>.pds-multiselect__group-header{-webkit-padding-before:var(--pine-dimension-xs);padding-block-start:var(--pine-dimension-xs)}.pds-multiselect__group-list{list-style:none;margin:var(--pine-dimension-none);padding:var(--pine-dimension-none)}.pds-multiselect__option{-ms-flex-align:center;align-items:center;background:transparent;border-radius:var(--pine-dimension-xs);cursor:pointer;display:-ms-flexbox;display:flex;padding:var(--pine-dimension-2xs) var(--pine-dimension-xs);-webkit-transition:background 0.15s;transition:background 0.15s}.pds-multiselect__option pds-checkbox{min-width:var(--pine-dimension-none);pointer-events:none;width:100%}.pds-multiselect__option pds-chip{pointer-events:auto}.pds-multiselect__option:hover:not(.pds-multiselect__option--disabled),.pds-multiselect__option.pds-multiselect__option--highlighted:not(.pds-multiselect__option--disabled){background:var(--pine-color-background-muted)}.pds-multiselect__option.pds-multiselect__option--disabled{cursor:not-allowed;opacity:0.5}.pds-multiselect__option:focus-visible{outline:var(--pine-dimension-none)}.pds-multiselect__option-action{-ms-flex-align:center;align-items:center;block-size:var(--pine-dimension-md);color:var(--pine-color-icon);cursor:pointer;display:-ms-flexbox;display:flex;-ms-flex-negative:0;flex-shrink:0;inline-size:var(--pine-dimension-md);-ms-flex-pack:center;justify-content:center;-webkit-margin-start:var(--pine-dimension-xs);margin-inline-start:var(--pine-dimension-xs)}.pds-multiselect__create-option{color:var(--pine-color-text-strong);width:100%}.pds-multiselect__create-option pds-icon{color:var(--pine-color-text-muted);-ms-flex-negative:var(--pine-dimension-none);flex-shrink:var(--pine-dimension-none)}.pds-multiselect__empty,.pds-multiselect__loading{-ms-flex-align:center;align-items:center;color:var(--pine-color-text-muted);display:-ms-flexbox;display:flex;font:var(--pine-typography-body);-ms-flex-pack:center;justify-content:center;padding:var(--pine-dimension-sm)}.pds-multiselect__load-more{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;padding:var(--pine-dimension-xs)}.pds-multiselect__footer{-webkit-border-before:var(--pine-border);border-block-start:var(--pine-border);border-block-start-color:var(--pine-color-border-subtle);padding:var(--pine-dimension-xs) var(--pine-dimension-sm)}.pds-multiselect__helper{color:var(--pine-color-text-message);font:var(--pine-typography-body-sm-medium);-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs);-webkit-margin-start:var(--pine-dimension-none);margin-inline-start:var(--pine-dimension-none)}.pds-multiselect__error{-ms-flex-align:start;align-items:flex-start;color:var(--pine-color-text-message-danger);display:-ms-flexbox;display:flex;font:var(--pine-typography-body-sm-medium);gap:var(--pine-dimension-2xs);-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs);-webkit-margin-start:var(--pine-dimension-none);margin-inline-start:var(--pine-dimension-none)}.pds-multiselect__error pds-icon{-ms-flex-negative:var(--pine-dimension-none);flex-shrink:var(--pine-dimension-none);-webkit-margin-before:var(--pine-dimension-025);margin-block-start:var(--pine-dimension-025)}.visually-hidden{border:var(--pine-dimension-none);clip:rect(0 0 0 0);-webkit-clip-path:polygon(0 0, 0 0, 0 0);clip-path:polygon(0 0, 0 0, 0 0);height:1px;margin:-1px;overflow:hidden;padding:var(--pine-dimension-none);position:absolute;white-space:nowrap;width:1px}"}},[321,"pds-multiselect",{componentId:[1,"component-id"],label:[1],placeholder:[1],searchPlaceholder:[1,"search-placeholder"],searchOptionsLabel:[1,"search-options-label"],selectedItemsLabel:[1,"selected-items-label"],optionsLabel:[1,"options-label"],noOptionsFoundLabel:[1,"no-options-found-label"],createOptionLabel:[1,"create-option-label"],createOptionAriaLabel:[1,"create-option-aria-label"],itemRemovedLabel:[1,"item-removed-label"],pillRemoveLabel:[1,"pill-remove-label"],selectedCountLabelOne:[1,"selected-count-label-one"],selectedCountLabelOther:[1,"selected-count-label-other"],selectedCountLabels:[1,"selected-count-labels"],closePanelOnSelect:[4,"close-panel-on-select"],name:[1],value:[1040],disabled:[4],asyncUrl:[1,"async-url"],asyncMethod:[1,"async-method"],debounce:[2],fetchTimeout:[2,"fetch-timeout"],maxSelections:[2,"max-selections"],maxHeight:[1,"max-height"],triggerWidth:[1,"trigger-width"],minWidth:[1,"min-width"],panelWidth:[1,"panel-width"],hideLabel:[4,"hide-label"],hideSelectedItems:[4,"hide-selected-items"],selectedDisplay:[1,"selected-display"],pillPosition:[1,"pill-position"],maxInlinePills:[2,"max-inline-pills"],optionDisplay:[1,"option-display"],errorMessage:[1,"error-message"],helperMessage:[1,"helper-message"],invalid:[4],required:[4],loading:[1028],options:[16],formatResult:[16],createUrl:[1,"create-url"],csrfToken:[1,"csrf-token"],csrfHeaderName:[1,"csrf-header-name"],optionActions:[4,"option-actions"],optionActionLabel:[1,"option-action-label"],optionActionDescription:[1,"option-action-description"],isOpen:[32],searchQuery:[32],highlightedIndex:[32],internalOptions:[32],selectedItems:[32],currentPage:[32],hasMore:[32],creating:[32],removalAnnouncement:[32],slottedTriggerEl:[32],setFocus:[64],clear:[64],refreshOptions:[64]},[[6,"keydown","handleWindowKeyDown"]],{debounce:[{setupDebounce:0}],value:[{valueChanged:0}],options:[{optionsChanged:0}],internalOptions:[{internalOptionsChanged:0}],isOpen:[{isOpenChanged:0}],disabled:[{disabledChanged:0}]}]),D=E,F=function(){"undefined"!=typeof customElements&&["pds-multiselect","pds-box","pds-checkbox","pds-chip","pds-icon","pds-loader","pds-text"].forEach((i=>{switch(i){case"pds-multiselect":customElements.get(n(i))||customElements.define(n(i),E);break;case"pds-box":customElements.get(n(i))||w();break;case"pds-checkbox":customElements.get(n(i))||k();break;case"pds-chip":customElements.get(n(i))||O();break;case"pds-icon":customElements.get(n(i))||C();break;case"pds-loader":customElements.get(n(i))||A();break;case"pds-text":customElements.get(n(i))||S()}}))};export{D as PdsMultiselect,F as defineCustomElement}

package/components/pds-popover.js

@@ -1 +1 @@
-import{proxyCustomElement as t,HTMLElement as s,createEvent as i,h as e,Host as o,transformTag as h}from"@stencil/core/internal/client";import{a as n,c as r}from"./closest.js";import{r as l}from"./reflected-attribute-default.js";import{l as a,s as d}from"./attributes.js";const c=t=>{const s=t+"",i=s.length,e=s.charCodeAt(0);let o="";for(let t=0;t<i;t++){const h=s.charCodeAt(t);o+=0!==h?h>=1&&h<=31||127===h||0===t&&h>=48&&h<=57||1===t&&h>=48&&h<=57&&45===e?`\\${h.toString(16)} `:0===t&&1===i&&45===h||!(h>=128||45===h||95===h||h>=48&&h<=57||h>=65&&h<=90||h>=97&&h<=122)?"\\"+s.charAt(t):s.charAt(t):"�"}return o},p=[];function u(){var t;let s=document.activeElement;for(;null===(t=null==s?void 0:s.shadowRoot)||void 0===t?void 0:t.activeElement;)s=s.shadowRoot.activeElement;return s}const v=t(class t extends s{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.pdsPopoverOpen=i(this,"pdsPopoverOpen",7),this.pdsPopoverClose=i(this,"pdsPopoverClose",7),this.active=!1,this.isComponentMounted=!0,this.hasLoaded=!1,this.generatedPortalId=null,this.triggerEl=null,this.triggerObserver=null,this.portalEl=null,this.isRepositioning=!1,this.scrollDebounceTimer=null,this.resizeDebounceTimer=null,this.movedNodes=[],this.openTimestamp=0,this.popoverTargetAction="show",this.popoverType="auto",this.maxWidth=352,this.placement="right",this.handleTriggerSlotChange=t=>{const s=t.target.assignedElements();null!=this.triggerEl&&this.triggerEl.removeEventListener("click",this.handleTriggerClick),s.length>0?(this.triggerEl=s[0],this.linkTriggerToPortal(),this.triggerEl.addEventListener("click",this.handleTriggerClick)):this.triggerEl=null,this.observeTrigger()},this.handleContentSlotChange=()=>{this.active&&this.updatePortalContent()},this.handleTriggerClick=t=>{switch(t.composedPath().find((t=>t instanceof HTMLAnchorElement&&t.href))||t.preventDefault(),this.popoverTargetAction){case"show":this.show();break;case"hide":this.hide();break;default:this.toggle()}},this.shadowFocusStyle=null,this.watchedDialog=null,this.onDialogClose=()=>{this.hide()},this.handleSubmitFromPanel=t=>{this.portalEl&&n(t.target,this.portalEl)&&(n(this.portalEl,t.submitter)||n(this.portalEl,u()))&&(t.preventDefault(),t.stopPropagation())}}restorePlacementDefault(t){this.placement=l(this.el,"placement",t,"right")}componentDidLoad(){var t;this.boundClickOutsideHandler=this.handleClickOutside.bind(this),this.boundEscapeKeyHandler=this.handleEscapeKey.bind(this),this.boundScrollHandler=this.handleScroll.bind(this),this.boundResizeHandler=this.handleResize.bind(this),this.createPortal(),this.hasLoaded=!0;const s=null===(t=this.el.shadowRoot)||void 0===t?void 0:t.querySelector('slot[name="trigger"]');if(s&&null==this.triggerEl){const t=new("undefined"!=typeof window?window.Event:global.Event)("slotchange");Object.defineProperty(t,"target",{value:s,enumerable:!0}),this.handleTriggerSlotChange(t)}else this.linkTriggerToPortal()}observeTrigger(){var t;null===(t=this.triggerObserver)||void 0===t||t.disconnect(),this.triggerObserver=null,null!=this.triggerEl&&"undefined"!=typeof MutationObserver&&(this.triggerObserver=new MutationObserver(a((()=>this.linkTriggerToPortal()),"pds-popover: stopped restoring its trigger ARIA, as another script keeps changing it. It may be wrong until the popover opens or closes.",this.triggerEl)),this.triggerObserver.observe(this.triggerEl,{attributes:!0,attributeFilter:["aria-expanded","aria-controls"]}))}linkTriggerToPortal(){return null!=this.triggerEl&&null!=this.portalEl&&d(this.triggerEl,{"aria-expanded":this.active+"","aria-controls":this.portalEl.id})}connectedCallback(){var t;this.hasLoaded&&(this.isComponentMounted=!0,this.createPortal(),null===(t=this.triggerEl)||void 0===t||t.addEventListener("click",this.handleTriggerClick),this.observeTrigger(),this.linkTriggerToPortal(),this.active&&(this.placePortal(),requestAnimationFrame((()=>this.handlePopoverPositioning()))))}disconnectedCallback(){var t;this.el.isConnected||(this.isComponentMounted=!1,this.unwatchDialogClose(),this.forgetOpen(),this.active&&(this.restorePortalContent(),this.active=!1,this.linkTriggerToPortal(),this.pdsPopoverClose.emit({componentId:this.componentId,popoverType:this.popoverType})),null!=this.triggerEl&&this.triggerEl.removeEventListener("click",this.handleTriggerClick),null===(t=this.triggerObserver)||void 0===t||t.disconnect(),this.triggerObserver=null,this.removeLightDismissListeners(),this.removeScrollAndResizeListeners(),document.removeEventListener("submit",this.handleSubmitFromPanel,!0),this.clearDebounceTimers(),this.removePortal())}clearDebounceTimers(){null!==this.scrollDebounceTimer&&(clearTimeout(this.scrollDebounceTimer),this.scrollDebounceTimer=null),null!==this.resizeDebounceTimer&&(clearTimeout(this.resizeDebounceTimer),this.resizeDebounceTimer=null)}createPortal(){var s;null===this.portalEl&&(this.portalEl=document.createElement("div"),this.portalEl.className="pds-popover",this.portalEl.style.position="fixed",this.portalEl.style.zIndex="var(--pine-z-index-raised)",this.portalEl.style.maxWidth=this.maxWidth+"px",this.portalEl.style.display="none",this.portalEl.style.opacity="0",this.portalEl.style.visibility="hidden",this.portalEl.style.backgroundColor="var(--pine-color-background-overlay)",this.portalEl.style.borderRadius="var(--pine-dimension-125)",this.portalEl.style.boxShadow="var(--pine-box-shadow-200)",this.portalEl.style.margin="var(--pine-dimension-none)",this.portalEl.style.padding="var(--pine-dimension-md)",this.componentId?this.portalEl.id=this.componentId+"-portal":(null!==(s=this.generatedPortalId)&&void 0!==s||(this.generatedPortalId="pds-popover-portal-"+t.instanceCounter++),this.portalEl.id=this.generatedPortalId),document.body.appendChild(this.portalEl),this.addPortalFocusStyles())}addPortalFocusStyles(){if(!this.portalEl)return;const t=this.portalEl.id,s=c(t);if(document.querySelector(`style[data-pds-popover-focus="${s}"]`))return;const i=document.createElement("style");i.setAttribute("data-pds-popover-focus",t),i.textContent=`\n      #${s}:focus {\n        outline: var(--pine-outline-focus, 2px solid var(--pine-color-focus-ring, #6366f1)) !important;\n        outline-offset: var(--pine-border-width, 1px);\n      }\n      #${s}:focus:not(:focus-visible) {\n        outline: none;\n      }\n      [data-theme="dark"] #${s} {\n        border: var(--pine-border);\n      }\n    `,document.head.appendChild(i)}updatePortalContent(){var t;if(!this.portalEl)return;const s=null===(t=this.el.shadowRoot)||void 0===t?void 0:t.querySelector(".pds-popover__content-slot-wrapper"),i=null==s?void 0:s.querySelector("slot");i&&i.assignedNodes().forEach((t=>{var s;const i=t.parentNode===this.portalEl,e=this.movedNodes.some((s=>s.node===t));if(i||e)return;const o=document.createComment("pds-popover-placeholder");null===(s=t.parentNode)||void 0===s||s.insertBefore(o,t),this.portalEl.appendChild(t),this.movedNodes.push({node:t,placeholder:o})}))}restorePortalContent(){this.movedNodes.forEach((({node:t,placeholder:s})=>{s.parentNode&&(s.parentNode.insertBefore(t,s),s.parentNode.removeChild(s))})),this.movedNodes=[]}copyFocusStylesInto(t){var s,i,e;if(!(t instanceof ShadowRoot))return null===(s=this.shadowFocusStyle)||void 0===s||s.remove(),void(this.shadowFocusStyle=null);if((null===(i=this.shadowFocusStyle)||void 0===i?void 0:i.parentNode)===t||!this.portalEl)return;const o=document.querySelector(`style[data-pds-popover-focus="${c(this.portalEl.id)}"]`);o&&(null===(e=this.shadowFocusStyle)||void 0===e||e.remove(),this.shadowFocusStyle=o.cloneNode(!0),t.appendChild(this.shadowFocusStyle))}removePortal(){var t;if(null===(t=this.shadowFocusStyle)||void 0===t||t.remove(),this.shadowFocusStyle=null,this.portalEl){this.portalEl.parentNode&&this.portalEl.parentNode.removeChild(this.portalEl);const t=document.querySelector(`style[data-pds-popover-focus="${c(this.portalEl.id)}"]`);t&&t.parentNode&&t.parentNode.removeChild(t)}this.portalEl=null}async show(){!this.active&&this.portalEl&&(this.active=!0,this.openTimestamp=Date.now(),this.linkTriggerToPortal(),this.placePortal(),this.updatePortalContent(),"auto"===this.popoverType&&this.portalEl.setAttribute("data-pds-popover-open",""),this.portalEl.style.display="block",this.portalEl.style.opacity="1",this.portalEl.style.visibility="visible",requestAnimationFrame((()=>{this.isComponentMounted&&this.handlePopoverPositioning()})),this.addScrollAndResizeListeners(),document.addEventListener("submit",this.handleSubmitFromPanel,!0),"auto"===this.popoverType&&(p.push(this),this.addLightDismissListeners()),this.pdsPopoverOpen.emit({componentId:this.componentId,popoverType:this.popoverType}))}async hide(){if(!this.active||!this.portalEl)return;this.active=!1,this.unwatchDialogClose();const t=n(this.portalEl,u());this.linkTriggerToPortal(),this.restorePortalContent(),this.portalEl.style.border="",this.portalEl.removeAttribute("data-pds-popover-open"),this.portalEl.style.display="none",this.portalEl.style.opacity="0",this.portalEl.style.visibility="hidden",t&&this.returnFocusToTrigger(),this.forgetOpen(),this.removeLightDismissListeners(),this.removeScrollAndResizeListeners(),document.removeEventListener("submit",this.handleSubmitFromPanel,!0),this.clearDebounceTimers(),this.pdsPopoverClose.emit({componentId:this.componentId,popoverType:this.popoverType})}async toggle(){this.active?this.hide():this.show()}placePortal(){var t,s;if(!this.portalEl)return;const i=r("dialog[open]",this.el);if(!i)return this.unwatchDialogClose(),this.portalEl.style.border="",this.portalEl.parentElement!==document.body&&document.body.appendChild(this.portalEl),void this.copyFocusStylesInto(document);const e=r("form",this.el);(null===(t=this.el.parentElement)||void 0===t?void 0:t.shadowRoot)||e&&n(i,e)?this.portalEl.parentNode!==i&&i.appendChild(this.portalEl):this.el.nextElementSibling!==this.portalEl&&(null===(s=this.el.parentNode)||void 0===s||s.insertBefore(this.portalEl,this.el.nextSibling)),this.watchDialogClose(i);const o=this.portalEl.getRootNode();this.copyFocusStylesInto(o),this.portalEl.style.border=o instanceof ShadowRoot&&r('[data-theme="dark"]',this.el)?"var(--pine-border)":""}forgetOpen(){const t=p.indexOf(this);t>=0&&p.splice(t,1)}takesEscapeFrom(t){var s,i;const e=null!==(i=null===(s=t.composedPath)||void 0===s?void 0:s.call(t)[0])&&void 0!==i?i:t.target,o=r("dialog[open]",e);return!(o&&!n(o,this.portalEl)&&(o.classList.contains("pds-modal__backdrop")||o.matches(":modal")))}addLightDismissListeners(){document.addEventListener("click",this.boundClickOutsideHandler,!0),document.addEventListener("keydown",this.boundEscapeKeyHandler)}watchDialogClose(t){this.watchedDialog!==t&&(this.unwatchDialogClose(),this.watchedDialog=t,t.addEventListener("close",this.onDialogClose))}unwatchDialogClose(){var t;null===(t=this.watchedDialog)||void 0===t||t.removeEventListener("close",this.onDialogClose),this.watchedDialog=null}removeLightDismissListeners(){document.removeEventListener("click",this.boundClickOutsideHandler,!0),document.removeEventListener("keydown",this.boundEscapeKeyHandler)}addScrollAndResizeListeners(){window.addEventListener("scroll",this.boundScrollHandler,!0),window.addEventListener("resize",this.boundResizeHandler)}removeScrollAndResizeListeners(){window.removeEventListener("scroll",this.boundScrollHandler,!0),window.removeEventListener("resize",this.boundResizeHandler)}handleClickOutside(t){var s,i;if((t.timeStamp?Date.now()-(performance.now()-t.timeStamp):Date.now())<=this.openTimestamp)return;const e=null!==(i=null===(s=t.composedPath)||void 0===s?void 0:s.call(t)[0])&&void 0!==i?i:t.target,o=r(".pds-datepicker-calendar-portal",e),h=null==o?void 0:o.pdsDatepicker;if(h&&(n(this.portalEl,h)||n(this.triggerEl,h)))return;const l=n(this.portalEl,e),a=n(this.triggerEl,e);l||a||this.hide()}returnFocusToTrigger(){this.triggerEl&&this.triggerEl.focus({preventScroll:!0})}handleEscapeKey(t){"Escape"!==t.key||t.defaultPrevented||[...p].reverse().find((s=>s.takesEscapeFrom(t)))===this&&(t.preventDefault(),t.stopPropagation(),this.hide())}handleScroll(){this.active&&(null!==this.scrollDebounceTimer&&clearTimeout(this.scrollDebounceTimer),this.scrollDebounceTimer=setTimeout((()=>{this.handlePopoverPositioning(),this.scrollDebounceTimer=null}),10))}handleResize(){this.active&&(null!==this.resizeDebounceTimer&&clearTimeout(this.resizeDebounceTimer),this.resizeDebounceTimer=setTimeout((()=>{this.handlePopoverPositioning(),this.resizeDebounceTimer=null}),100))}handlePopoverPositioning(){if(this.isRepositioning)return;if(this.isRepositioning=!0,null==this.triggerEl||null==this.portalEl)return void(this.isRepositioning=!1);const t=this.triggerEl.getBoundingClientRect(),s=this.portalEl.getBoundingClientRect();if(0===t.width||0===t.height)return void(this.isRepositioning=!1);let i=0,e=0;switch(this.placement){case"top":i=t.top-s.height-8,e=t.left+(t.width-s.width)/2;break;case"top-start":i=t.top-s.height-8,e=t.left;break;case"top-end":i=t.top-s.height-8,e=t.right-s.width;break;case"right":i=t.top+(t.height-s.height)/2,e=t.right+8;break;case"right-start":i=t.top,e=t.right+8;break;case"right-end":i=t.bottom-s.height,e=t.right+8;break;case"bottom":i=t.bottom+8,e=t.left+(t.width-s.width)/2;break;case"bottom-start":i=t.bottom+8,e=t.left;break;case"bottom-end":i=t.bottom+8,e=t.right-s.width;break;case"left":i=t.top+(t.height-s.height)/2,e=t.left-s.width-8;break;case"left-start":i=t.top,e=t.left-s.width-8;break;case"left-end":i=t.bottom-s.height,e=t.left-s.width-8}this.portalEl.style.top=i+"px",this.portalEl.style.left=e+"px";const o=this.portalEl.getBoundingClientRect();(Math.abs(o.top-i)>.5||Math.abs(o.left-e)>.5)&&(this.portalEl.style.top=2*i-o.top+"px",this.portalEl.style.left=2*e-o.left+"px"),setTimeout((()=>{this.isRepositioning=!1}),16)}render(){return e(o,{key:"da8a0c715df1199231b1265085f3f9ae0234032d",id:this.componentId},e("span",{key:"f35023492399420829cec2e88556462f5ac1663e",class:"pds-popover__trigger-wrapper"},e("slot",{key:"38ebe92eebb87665467b3f92ff94dc8095450063",name:"trigger",onSlotchange:this.handleTriggerSlotChange})),e("div",{key:"8917930f4520544d14bbd68b4c7936dd60af19e3",class:"pds-popover__content-slot-wrapper"},e("slot",{key:"28d3f9112256edd95721a79a7072a9e35a3712bf",onSlotchange:this.handleContentSlotChange})))}get el(){return this}static get watchers(){return{placement:[{restorePlacementDefault:0}]}}static get style(){return":host{--sizing-max-width-default:352px;display:inline-block}:host .pds-popover__trigger-wrapper{display:inline-block}:host .pds-popover__content-slot-wrapper{display:none}"}},[257,"pds-popover",{popoverTargetAction:[1,"popover-target-action"],popoverType:[1,"popover-type"],componentId:[1,"component-id"],maxWidth:[2,"max-width"],placement:[1537],active:[32],show:[64],hide:[64],toggle:[64]},void 0,{placement:[{restorePlacementDefault:0}]}]);v.instanceCounter=0;const m=v,f=function(){"undefined"!=typeof customElements&&["pds-popover"].forEach((t=>{"pds-popover"===t&&(customElements.get(h(t))||customElements.define(h(t),v))}))};export{m as PdsPopover,f as defineCustomElement}
+import{proxyCustomElement as t,HTMLElement as i,createEvent as s,h as e,Host as h,transformTag as o}from"@stencil/core/internal/client";import{p as n,a as r,c as l,o as a,f as d,s as p}from"./floating-ui.dom.js";import{a as c,c as u}from"./closest.js";import{r as v}from"./reflected-attribute-default.js";import{s as m}from"./attributes.js";import{l as f}from"./keep-hydrated.js";import{t as g}from"./tabbable.js";const b=t=>{const i=t+"",s=i.length,e=i.charCodeAt(0);let h="";for(let t=0;t<s;t++){const o=i.charCodeAt(t);h+=0!==o?o>=1&&o<=31||127===o||0===t&&o>=48&&o<=57||1===t&&o>=48&&o<=57&&45===e?`\\${o.toString(16)} `:0===t&&1===s&&45===o||!(o>=128||45===o||95===o||o>=48&&o<=57||o>=65&&o<=90||o>=97&&o<=122)?"\\"+i.charAt(t):i.charAt(t):"�"}return h},w=[],y=Object.assign(Object.assign({},n),{getOffsetParent:()=>window});function k(){var t;let i=document.activeElement;for(;null===(t=null==i?void 0:i.shadowRoot)||void 0===t?void 0:t.activeElement;)i=i.shadowRoot.activeElement;return i}function T(t,i){let s=t;for(;s.getRootNode()!==i.getRootNode()&&s.getRootNode()instanceof ShadowRoot;)s=s.getRootNode().host;return s}const x=new WeakMap,P=t(class t extends i{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.pdsPopoverOpen=s(this,"pdsPopoverOpen",7),this.pdsPopoverClose=s(this,"pdsPopoverClose",7),this.active=!1,this.isComponentMounted=!0,this.hasLoaded=!1,this.generatedPortalId=null,this.triggerEl=null,this.triggerObserver=null,this.portalEl=null,this.stopAutoUpdate=null,this.positioningRun=0,this.positioning=Promise.resolve(),this.openEventPending=!1,this.movedNodes=[],this.openTimestamp=0,this.hoverOpened=!1,this.closeWhenFocusLeaves=!1,this.panelDistance=1/0,this.tabGuardEl=null,this.leavingPanel=!1,this.tabDirection=null,this.popoverTargetAction="show",this.openOn="click",this.popoverType="auto",this.maxWidth=352,this.padding="md",this.placement="right",this.handleTriggerSlotChange=t=>{const i=t.target.assignedElements();null!=this.triggerEl&&(this.triggerEl.removeEventListener("click",this.handleTriggerClick),this.stopListeningForHover(this.triggerEl)),i.length>0?(this.triggerEl=i[0],this.linkTriggerToPortal(),this.triggerEl.addEventListener("click",this.handleTriggerClick),this.listenForHover(this.triggerEl)):this.triggerEl=null,this.active&&this.addScrollAndResizeListeners(),this.observeTrigger()},this.handleContentSlotChange=()=>{this.active&&this.updatePortalContent()},this.handleTriggerClick=t=>{if(t.composedPath().find((t=>t instanceof HTMLAnchorElement&&t.href))||t.preventDefault(),"hover"===this.openOn&&"hide"!==this.popoverTargetAction){const t=this.hoverOpened;if(this.pin(),t)return}switch(this.popoverTargetAction){case"show":this.show();break;case"hide":this.hide();break;default:this.toggle()}},this.handleHoverEnter=t=>{"touch"!==t.pointerType&&(this.clearHoverTimers(),this.active||(this.hoverOpenTimer=setTimeout((()=>{this.hoverOpenTimer=void 0,this.active||null==this.portalEl||(this.hoverOpened=!0,this.show())}),120)))},this.handleHoverLeave=t=>{"touch"!==t.pointerType&&(this.clearHoverTimers(),this.hoverOpened&&(this.hoverCloseTimer=setTimeout(this.closeFromHover,200),t.currentTarget===this.triggerEl&&(this.panelDistance=this.distanceToPanel(t),document.addEventListener("pointermove",this.handleMoveTowardPanel))))},this.handleMoveTowardPanel=t=>{const i=this.distanceToPanel(t);i<this.panelDistance&&(clearTimeout(this.hoverCloseTimer),this.hoverCloseTimer=setTimeout(this.closeFromHover,200)),this.panelDistance=i},this.handleHoverFocusOut=t=>{this.closeWhenFocusLeaves&&!c(this.portalEl,t.relatedTarget)&&(this.closeWhenFocusLeaves=!1,this.hoverCloseTimer=setTimeout(this.closeFromHover,200))},this.closeFromHover=()=>{this.clearHoverTimers(),this.hoverOpened&&(c(this.portalEl,k())?this.closeWhenFocusLeaves=!0:this.hide())},this.shadowFocusStyle=null,this.watchedDialog=null,this.onDialogClose=()=>{this.hide()},this.handleSubmitFromPanel=t=>{this.portalEl&&c(t.target,this.portalEl)&&(c(this.portalEl,t.submitter)||c(this.portalEl,k()))&&(t.preventDefault(),t.stopPropagation())},this.syncTabGuard=t=>{if("Tab"!==t.key)return;this.releasePanel(),this.tabDirection=t.shiftKey?"backward":"forward",setTimeout(this.endTabKey);const i=this.guardedTabbables().length>0;null!=this.tabGuardEl&&(this.tabGuardEl.tabIndex=i?0:-1);const s=k();!i||c(this.portalEl,s)||u(".pds-popover, .pds-datepicker-calendar-portal, .pds-combobox-dropdown-portal",null!=s?s:document)||(this.portalEl.inert=!0)},this.endTabKey=()=>{this.tabDirection=null,this.releasePanel()},this.handleTabGuardFocus=t=>{if(this.leavingPanel)return;this.releasePanel();const i=this.guardedTabbables(),s=t.relatedTarget,e=(null!=this.tabDirection?"backward"===this.tabDirection:null!=s&&this.isAfterPopover(s))?i[i.length-1]:i[0];null==e?this.returnFocusToTrigger():e.focus()},this.handleTabFromPanel=t=>{if("Tab"!==t.key||t.defaultPrevented||null==this.tabGuardEl)return;const i=this.guardedTabbables(),s=t.shiftKey?i[0]:i[i.length-1];null!=s&&k()===s&&this.leavePanel(s,t.shiftKey)},this.releasePanel=()=>{null!=this.portalEl&&(this.portalEl.inert=!1)}}openOnChanged(){this.pin(),this.stopListeningForHover(this.triggerEl),this.stopListeningForHover(this.portalEl),this.isComponentMounted&&(this.listenForHover(this.triggerEl),this.listenForHover(this.portalEl))}applyPadding(){null!=this.portalEl&&(this.portalEl.style.padding=this.paddingToken())}paddingToken(){switch(this.padding){case"none":return"var(--pine-dimension-none)";case"xs":return"var(--pine-dimension-xs)";case"sm":return"var(--pine-dimension-sm)";default:return"var(--pine-dimension-md)"}}restorePlacementDefault(t){this.placement=v(this.el,"placement",t,"right")}componentDidLoad(){var t;this.boundClickOutsideHandler=this.handleClickOutside.bind(this),this.boundEscapeKeyHandler=this.handleEscapeKey.bind(this),this.createPortal(),this.hasLoaded=!0;const i=null===(t=this.el.shadowRoot)||void 0===t?void 0:t.querySelector('slot[name="trigger"]');if(i&&null==this.triggerEl){const t=new("undefined"!=typeof window?window.Event:global.Event)("slotchange");Object.defineProperty(t,"target",{value:i,enumerable:!0}),this.handleTriggerSlotChange(t)}else this.linkTriggerToPortal()}observeTrigger(){var t;null===(t=this.triggerObserver)||void 0===t||t.disconnect(),this.triggerObserver=null,null!=this.triggerEl&&"undefined"!=typeof MutationObserver&&(this.triggerObserver=new MutationObserver(f((()=>this.linkTriggerToPortal()),"pds-popover: stopped restoring its trigger ARIA, as another script keeps changing it. It may be wrong until the popover opens or closes.",this.triggerEl)),this.triggerObserver.observe(this.triggerEl,{attributes:!0,attributeFilter:["aria-expanded","aria-controls"]}))}linkTriggerToPortal(){return null!=this.triggerEl&&null!=this.portalEl&&m(this.triggerEl,{"aria-expanded":this.active+"","aria-controls":this.portalEl.id})}listenForHover(t){"hover"===this.openOn&&null!=t&&(t.addEventListener("pointerenter",this.handleHoverEnter),t.addEventListener("pointerleave",this.handleHoverLeave),t.addEventListener("focusout",this.handleHoverFocusOut))}stopListeningForHover(t){null!=t&&(t.removeEventListener("pointerenter",this.handleHoverEnter),t.removeEventListener("pointerleave",this.handleHoverLeave),t.removeEventListener("focusout",this.handleHoverFocusOut))}distanceToPanel({clientX:t,clientY:i}){const s=this.portalEl.getBoundingClientRect();return Math.hypot(Math.max(s.left-t,0,t-s.right),Math.max(s.top-i,0,i-s.bottom))}pin(){var t;this.clearHoverTimers(),this.hoverOpened&&(this.hoverOpened=!1,"auto"!==this.popoverType&&(this.forgetOpen(),null===(t=this.portalEl)||void 0===t||t.removeAttribute("data-pds-popover-open"),document.removeEventListener("keydown",this.boundEscapeKeyHandler)))}clearHoverTimers(){clearTimeout(this.hoverOpenTimer),clearTimeout(this.hoverCloseTimer),this.hoverOpenTimer=void 0,this.hoverCloseTimer=void 0,this.closeWhenFocusLeaves=!1,document.removeEventListener("pointermove",this.handleMoveTowardPanel)}connectedCallback(){var t;this.hasLoaded&&(this.isComponentMounted=!0,this.createPortal(),null===(t=this.triggerEl)||void 0===t||t.addEventListener("click",this.handleTriggerClick),this.listenForHover(this.triggerEl),this.observeTrigger(),this.linkTriggerToPortal(),this.active&&(this.placePortal(),this.addScrollAndResizeListeners()))}disconnectedCallback(){var t,i;this.el.isConnected||(this.isComponentMounted=!1,this.unwatchDialogClose(),this.forgetOpen(),this.active&&(this.restorePortalContent(),this.active=!1,this.linkTriggerToPortal(),this.emitOpenEvent(),this.pdsPopoverClose.emit({componentId:this.componentId,popoverType:this.popoverType})),null!=this.triggerEl&&this.triggerEl.removeEventListener("click",this.handleTriggerClick),this.stopListeningForHover(this.triggerEl),null===(t=this.triggerObserver)||void 0===t||t.disconnect(),this.triggerObserver=null,this.removeLightDismissListeners(),this.removeScrollAndResizeListeners(),document.removeEventListener("submit",this.handleSubmitFromPanel,!0),document.removeEventListener("keydown",this.syncTabGuard,!0),null===(i=this.tabGuardEl)||void 0===i||i.removeAttribute("tabindex"),this.clearHoverTimers(),this.hoverOpened=!1,this.removePortal())}createPortal(){var i;null===this.portalEl&&(this.portalEl=document.createElement("div"),this.portalEl.className="pds-popover",x.set(this.portalEl,this),this.portalEl.style.position="fixed",this.portalEl.style.zIndex="var(--pine-z-index-raised)",this.portalEl.style.maxWidth=this.maxWidth+"px",this.portalEl.style.display="none",this.portalEl.style.opacity="0",this.portalEl.style.visibility="hidden",this.portalEl.style.backgroundColor="var(--pine-color-background-overlay)",this.portalEl.style.borderRadius="var(--pine-dimension-125)",this.portalEl.style.boxShadow="var(--pine-box-shadow-200)",this.portalEl.style.margin="var(--pine-dimension-none)",this.portalEl.style.padding=this.paddingToken(),this.componentId?this.portalEl.id=this.componentId+"-portal":(null!==(i=this.generatedPortalId)&&void 0!==i||(this.generatedPortalId="pds-popover-portal-"+t.instanceCounter++),this.portalEl.id=this.generatedPortalId),document.body.appendChild(this.portalEl),this.addPortalFocusStyles(),this.listenForHover(this.portalEl),this.portalEl.addEventListener("keydown",this.handleTabFromPanel))}addPortalFocusStyles(){if(!this.portalEl)return;const t=this.portalEl.id,i=b(t);if(document.querySelector(`style[data-pds-popover-focus="${i}"]`))return;const s=document.createElement("style");s.setAttribute("data-pds-popover-focus",t),s.textContent=`\n      #${i}:focus {\n        outline: var(--pine-outline-focus, 2px solid var(--pine-color-focus-ring, #6366f1)) !important;\n        outline-offset: var(--pine-border-width, 1px);\n      }\n      #${i}:focus:not(:focus-visible) {\n        outline: none;\n      }\n      [data-theme="dark"] #${i} {\n        border: var(--pine-border);\n      }\n    `,document.head.appendChild(s)}updatePortalContent(){var t;if(!this.portalEl)return;const i=null===(t=this.el.shadowRoot)||void 0===t?void 0:t.querySelector(".pds-popover__content-slot-wrapper"),s=null==i?void 0:i.querySelector("slot");s&&s.assignedNodes().forEach((t=>{var i;const s=t.parentNode===this.portalEl,e=this.movedNodes.some((i=>i.node===t));if(s||e)return;const h=document.createComment("pds-popover-placeholder");null===(i=t.parentNode)||void 0===i||i.insertBefore(h,t),this.portalEl.appendChild(t),this.movedNodes.push({node:t,placeholder:h})}))}restorePortalContent(){this.movedNodes.forEach((({node:t,placeholder:i})=>{i.parentNode&&(i.parentNode.insertBefore(t,i),i.parentNode.removeChild(i))})),this.movedNodes=[]}copyFocusStylesInto(t){var i,s,e;if(!(t instanceof ShadowRoot))return null===(i=this.shadowFocusStyle)||void 0===i||i.remove(),void(this.shadowFocusStyle=null);if((null===(s=this.shadowFocusStyle)||void 0===s?void 0:s.parentNode)===t||!this.portalEl)return;const h=document.querySelector(`style[data-pds-popover-focus="${b(this.portalEl.id)}"]`);h&&(null===(e=this.shadowFocusStyle)||void 0===e||e.remove(),this.shadowFocusStyle=h.cloneNode(!0),t.appendChild(this.shadowFocusStyle))}removePortal(){var t;if(null===(t=this.shadowFocusStyle)||void 0===t||t.remove(),this.shadowFocusStyle=null,this.portalEl){this.portalEl.parentNode&&this.portalEl.parentNode.removeChild(this.portalEl);const t=document.querySelector(`style[data-pds-popover-focus="${b(this.portalEl.id)}"]`);t&&t.parentNode&&t.parentNode.removeChild(t)}this.portalEl=null}async show(){if(this.active||!this.portalEl)return;let t;this.active=!0,this.openTimestamp=Date.now(),this.linkTriggerToPortal(),this.placePortal(),this.updatePortalContent(),("auto"===this.popoverType||this.hoverOpened)&&this.portalEl.setAttribute("data-pds-popover-open",""),this.portalEl.style.display="block",this.portalEl.style.opacity="1",this.portalEl.style.visibility="visible",this.addScrollAndResizeListeners(),document.addEventListener("submit",this.handleSubmitFromPanel,!0),document.addEventListener("keydown",this.syncTabGuard,!0),"auto"===this.popoverType?(w.push(this),this.addLightDismissListeners()):this.hoverOpened&&(w.push(this),document.addEventListener("keydown",this.boundEscapeKeyHandler)),this.openEventPending=!0;do{t=this.positioning,await t}while(t!==this.positioning);this.emitOpenEvent()}emitOpenEvent(){this.openEventPending&&(this.openEventPending=!1,this.pdsPopoverOpen.emit({componentId:this.componentId,popoverType:this.popoverType}))}async hide(){var t;if(this.clearHoverTimers(),!this.active||!this.portalEl)return;this.active=!1,this.hoverOpened=!1,this.unwatchDialogClose();const i=c(this.portalEl,k());this.linkTriggerToPortal(),this.restorePortalContent(),this.portalEl.style.border="",this.portalEl.removeAttribute("data-pds-popover-open"),this.portalEl.removeAttribute("data-pds-popover-placement"),this.portalEl.style.display="none",this.portalEl.style.opacity="0",this.portalEl.style.visibility="hidden",i&&this.returnFocusToTrigger(),this.forgetOpen(),this.removeLightDismissListeners(),this.removeScrollAndResizeListeners(),document.removeEventListener("submit",this.handleSubmitFromPanel,!0),document.removeEventListener("keydown",this.syncTabGuard,!0),null===(t=this.tabGuardEl)||void 0===t||t.removeAttribute("tabindex"),this.releasePanel(),this.emitOpenEvent(),this.pdsPopoverClose.emit({componentId:this.componentId,popoverType:this.popoverType})}async toggle(){this.active?await this.hide():await this.show()}placePortal(){var t,i;if(!this.portalEl)return;const s=u("dialog[open]",this.el);if(!s)return this.unwatchDialogClose(),this.portalEl.style.border="",this.portalEl.parentElement!==document.body&&document.body.appendChild(this.portalEl),void this.copyFocusStylesInto(document);const e=u("form",this.el);(null===(t=this.el.parentElement)||void 0===t?void 0:t.shadowRoot)||e&&c(s,e)?this.portalEl.parentNode!==s&&s.appendChild(this.portalEl):this.el.nextElementSibling!==this.portalEl&&(null===(i=this.el.parentNode)||void 0===i||i.insertBefore(this.portalEl,this.el.nextSibling)),this.watchDialogClose(s);const h=this.portalEl.getRootNode();this.copyFocusStylesInto(h),this.portalEl.style.border=h instanceof ShadowRoot&&u('[data-theme="dark"]',this.el)?"var(--pine-border)":""}forgetOpen(){const t=w.indexOf(this);t>=0&&w.splice(t,1)}takesEscapeFrom(t){var i,s;const e=null!==(s=null===(i=t.composedPath)||void 0===i?void 0:i.call(t)[0])&&void 0!==s?s:t.target,h=u("dialog[open]",e);return!(h&&!c(h,this.portalEl)&&(h.classList.contains("pds-modal__backdrop")||h.matches(":modal")))}addLightDismissListeners(){document.addEventListener("click",this.boundClickOutsideHandler,!0),document.addEventListener("keydown",this.boundEscapeKeyHandler)}watchDialogClose(t){this.watchedDialog!==t&&(this.unwatchDialogClose(),this.watchedDialog=t,t.addEventListener("close",this.onDialogClose))}unwatchDialogClose(){var t;null===(t=this.watchedDialog)||void 0===t||t.removeEventListener("close",this.onDialogClose),this.watchedDialog=null}removeLightDismissListeners(){document.removeEventListener("click",this.boundClickOutsideHandler,!0),document.removeEventListener("keydown",this.boundEscapeKeyHandler)}guardedTabbables(){return null==this.portalEl||this.el.nextElementSibling===this.portalEl?[]:g(this.portalEl)}isAfterPopover(t){return!c(this.el,t)&&((t,i)=>!(t&Node.DOCUMENT_POSITION_DISCONNECTED||!(t&i)))(function(t,i){const s=T(i,t);return T(t,s).compareDocumentPosition(s)}(this.el,t),Node.DOCUMENT_POSITION_FOLLOWING)}leavePanel(t,i){var s,e;this.leavingPanel=!0,null===(s=this.tabGuardEl)||void 0===s||s.focus(),this.leavingPanel=!1,this.portalEl.inert=!0,setTimeout((()=>this.finishLeavingPanel(t)));const h=x.get(u(".pds-popover",this.el)),o=null!==(e=null==h?void 0:h.guardedTabbables())&&void 0!==e?e:[];i||o[o.length-1]!==this.tabGuardEl||h.leavePanel(t,!1)}finishLeavingPanel(t){var i;this.releasePanel(),this.active&&(null===(i=this.el.shadowRoot)||void 0===i?void 0:i.activeElement)===this.tabGuardEl&&t.focus()}addScrollAndResizeListeners(){this.removeScrollAndResizeListeners(),null!=this.triggerEl&&null!=this.portalEl&&(this.stopAutoUpdate=r(this.triggerEl,this.portalEl,(()=>{this.positioning=this.handlePopoverPositioning().catch((t=>console.warn("pds-popover: failed to position the panel",t)))})))}removeScrollAndResizeListeners(){var t;null===(t=this.stopAutoUpdate)||void 0===t||t.call(this),this.stopAutoUpdate=null}handleClickOutside(t){var i,s;if((t.timeStamp?Date.now()-(performance.now()-t.timeStamp):Date.now())<=this.openTimestamp)return;const e=null!==(s=null===(i=t.composedPath)||void 0===i?void 0:i.call(t)[0])&&void 0!==s?s:t.target,h=u(".pds-datepicker-calendar-portal",e),o=null==h?void 0:h.pdsDatepicker;if(o&&(c(this.portalEl,o)||c(this.triggerEl,o)))return;const n=c(this.portalEl,e),r=c(this.triggerEl,e);n||r||this.hide()}returnFocusToTrigger(){this.triggerEl&&this.triggerEl.focus({preventScroll:!0})}handleEscapeKey(t){"Escape"!==t.key||t.defaultPrevented||[...w].reverse().find((i=>i.takesEscapeFrom(t)))===this&&(t.preventDefault(),t.stopPropagation(),this.hide())}async handlePopoverPositioning(){const t=++this.positioningRun;if(null==this.triggerEl||null==this.portalEl)return;const i=this.triggerEl.getBoundingClientRect();if(0===i.width||0===i.height)return;const s=this.portalEl,{x:e,y:h,placement:o}=await l(this.triggerEl,s,{placement:this.placement,strategy:"fixed",middleware:[a(8),d({fallbackStrategy:"initialPlacement"}),p({padding:8})],platform:y});if(!this.active||t!==this.positioningRun||s!==this.portalEl)return;s.setAttribute("data-pds-popover-placement",o);const n=(t=>{var i;const s=document.createElement("div");s.style.cssText="all: initial; position: fixed; top: 0; left: 0;",null===(i=t.parentNode)||void 0===i||i.insertBefore(s,t);const{top:e,left:h}=s.getBoundingClientRect();return s.remove(),{top:e,left:h}})(s);s.style.top=h-n.top+"px",s.style.left=e-n.left+"px"}render(){return e(h,{key:"85422eb7544a4795ce78b51684b7224a5d856a4e",id:this.componentId},e("span",{key:"6fe9c827ed4d46ca723d6013f296faf80ba31366",class:"pds-popover__trigger-wrapper"},e("slot",{key:"970d1974d2be1451e670a36e7d2ccdc5979595bb",name:"trigger",onSlotchange:this.handleTriggerSlotChange})),e("span",{key:"0c76f76286a30d8e6e948bd0abab3317b3673aa6",class:"pds-popover__tab-guard",ref:t=>this.tabGuardEl=null!=t?t:null,onFocus:this.handleTabGuardFocus}),e("div",{key:"692c45e93899e74a3d5970f3a3625f6115ab63b0",class:"pds-popover__content-slot-wrapper"},e("slot",{key:"f1566e0eb1eb08626f2a8285447702ce96b09f4d",onSlotchange:this.handleContentSlotChange})))}get el(){return this}static get watchers(){return{openOn:[{openOnChanged:0}],padding:[{applyPadding:0}],placement:[{restorePlacementDefault:0}]}}static get style(){return":host{--sizing-max-width-default:352px;display:inline-block}:host .pds-popover__trigger-wrapper{display:inline-block}:host .pds-popover__tab-guard{opacity:0;outline:none;pointer-events:none;position:fixed}:host .pds-popover__content-slot-wrapper{display:none}"}},[257,"pds-popover",{popoverTargetAction:[1,"popover-target-action"],openOn:[1,"open-on"],popoverType:[1,"popover-type"],componentId:[1,"component-id"],maxWidth:[2,"max-width"],padding:[1],placement:[1537],active:[32],show:[64],hide:[64],toggle:[64]},void 0,{openOn:[{openOnChanged:0}],padding:[{applyPadding:0}],placement:[{restorePlacementDefault:0}]}]);P.instanceCounter=0;const O=P,_=function(){"undefined"!=typeof customElements&&["pds-popover"].forEach((t=>{"pds-popover"===t&&(customElements.get(o(t))||customElements.define(o(t),P))}))};export{O as PdsPopover,_ as defineCustomElement}

package/components/pds-progress.js

@@ -1 +1 @@
-import{proxyCustomElement as e,HTMLElement as r,h as s,Host as i,transformTag as o}from"@stencil/core/internal/client";import{H as t}from"./attributes.js";import{n as a}from"./utils.js";const n=e(class extends r{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.hostKeeper=new t,this.animated=!1,this.percent=0,this.showPercent=!1}connectedCallback(){this.hostKeeper.connect(this.el)}disconnectedCallback(){this.hostKeeper.disconnect()}render(){const e=a(this.fillColor),r=this.animated?{"is-animated":this.animated}:"";return this.hostKeeper.record(r),s(i,{key:"a224e1e9bc50433553ab8bf4b0d772f01148ee76",class:r},s("div",{key:"261742044f3d68c204cbf640cc4447eb6d74df11",class:"pds-progress"},s("label",{key:"d686bdc6ab450bf8c14dd56077525a3139593f46",class:"pds-progress__label",htmlFor:this.componentId},this.label),s("progress",{key:"c716e977a952a628aec600fa680aa9c3b8d0e996",id:this.componentId,max:"100",style:e?{"--color-progress-fill":e}:{},value:this.percent})),this.showPercent&&s("div",{key:"44176a580b435f69993be4a60ee2e888b87e10fb",class:"pds-progress__percentage"},this.percent,"%"))}get el(){return this}static get style(){return":host{--color-progress-fill:var(--pine-color-primary);--sizing-progress-bar-width:100%;-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;width:var(--sizing-progress-bar-width)}@-webkit-keyframes progressBar{0%{width:0}100%{width:var(--sizing-progress-bar-width)}}@keyframes progressBar{0%{width:0}100%{width:var(--sizing-progress-bar-width)}}.pds-progress{-ms-flex-align:center;align-items:center;background-color:var(--pine-color-background-muted);border-radius:var(--pine-dimension-2xs);display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;height:var(--pine-dimension-xs);position:relative;width:100%}:host(.is-animated) progress,:host(.is-animated) progress::-webkit-progress-bar{-webkit-animation:progressBar 3s ease;animation:progressBar 3s ease;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards}progress,progress::-webkit-progress-bar{background-color:transparent;border:0;height:var(--pine-dimension-xs);width:100%}progress::-webkit-progress-value{background:var(--color-progress-fill, var(--pine-color-primary));border-radius:var(--pine-dimension-2xs)}progress::-moz-progress-bar{background:var(--color-progress-fill, var(--pine-color-primary));border-radius:var(--pine-dimension-2xs)}.pds-progress__label{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.pds-progress__percentage{font-weight:var(--pine-font-weight-medium);-webkit-margin-start:calc(var(--pine-dimension-md) / 2);margin-inline-start:calc(var(--pine-dimension-md) / 2)}"}},[1,"pds-progress",{animated:[4],componentId:[1,"component-id"],fillColor:[1,"fill-color"],label:[1],percent:[2],showPercent:[4,"show-percent"]}]),d=n,l=function(){"undefined"!=typeof customElements&&["pds-progress"].forEach((e=>{"pds-progress"===e&&(customElements.get(o(e))||customElements.define(o(e),n))}))};export{d as PdsProgress,l as defineCustomElement}
+import{proxyCustomElement as e,HTMLElement as r,h as s,Host as i,transformTag as o}from"@stencil/core/internal/client";import{H as t}from"./attributes.js";import{n as a}from"./utils.js";const n=e(class extends r{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.hostKeeper=new t,this.animated=!1,this.percent=0,this.showPercent=!1}connectedCallback(){this.hostKeeper.connect(this.el)}disconnectedCallback(){this.hostKeeper.disconnect()}render(){const e=a(this.fillColor),r=this.animated?{"is-animated":this.animated}:"";return this.hostKeeper.record(r),s(i,{key:"6d2151cdd1f65b33a7478e5ac12df711d8252d1f",class:r},s("div",{key:"4a902c6c7d51fe8e8a778e1fa24bdbf95d625b1f",class:"pds-progress"},s("label",{key:"c50955234a7eee05cdf47531e25b4413f206e416",class:"pds-progress__label",htmlFor:this.componentId},this.label),s("progress",{key:"c54ad90f7b3fcf3368afca4c5618949f1a370114",id:this.componentId,max:"100",style:e?{"--color-progress-fill":e}:{},value:this.percent})),this.showPercent&&s("div",{key:"6b3e3f42f04a516ef7992d1f8bc967be432f55bb",class:"pds-progress__percentage"},this.percent,"%"))}get el(){return this}static get style(){return":host{--color-progress-fill:var(--pine-color-primary);--sizing-progress-bar-width:100%;-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;width:var(--sizing-progress-bar-width)}@-webkit-keyframes progressBar{0%{width:0}100%{width:var(--sizing-progress-bar-width)}}@keyframes progressBar{0%{width:0}100%{width:var(--sizing-progress-bar-width)}}.pds-progress{-ms-flex-align:center;align-items:center;background-color:var(--pine-color-background-muted);border-radius:var(--pine-dimension-2xs);display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;height:var(--pine-dimension-xs);position:relative;width:100%}:host(.is-animated) progress,:host(.is-animated) progress::-webkit-progress-bar{-webkit-animation:progressBar 3s ease;animation:progressBar 3s ease;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards}progress,progress::-webkit-progress-bar{background-color:transparent;border:0;height:var(--pine-dimension-xs);width:100%}progress::-webkit-progress-value{background:var(--color-progress-fill, var(--pine-color-primary));border-radius:var(--pine-dimension-2xs)}progress::-moz-progress-bar{background:var(--color-progress-fill, var(--pine-color-primary));border-radius:var(--pine-dimension-2xs)}.pds-progress__label{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.pds-progress__percentage{font-weight:var(--pine-font-weight-medium);-webkit-margin-start:calc(var(--pine-dimension-md) / 2);margin-inline-start:calc(var(--pine-dimension-md) / 2)}"}},[1,"pds-progress",{animated:[4],componentId:[1,"component-id"],fillColor:[1,"fill-color"],label:[1],percent:[2],showPercent:[4,"show-percent"]}]),d=n,l=function(){"undefined"!=typeof customElements&&["pds-progress"].forEach((e=>{"pds-progress"===e&&(customElements.get(o(e))||customElements.define(o(e),n))}))};export{d as PdsProgress,l as defineCustomElement}

package/components/pds-property.js

@@ -1 +1 @@
-import{proxyCustomElement as e,HTMLElement as s,h as t,Host as o,transformTag as c}from"@stencil/core/internal/client";import{d as n}from"./pds-box2.js";import{d}from"./pds-icon2.js";const r=e(class extends s{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.icon="star"}render(){return t(o,{key:"d599b62be4bacf1d89afcc26b14fc93bdc9bb3a4",id:this.componentId},t("pds-box",{key:"d7f80f6598615c761d672893c8acab09bd9ea33f","align-items":"center",gap:"xs"},t("pds-icon",{key:"15a6a6545c2cd2332bd830451106b7b08adc39ff",icon:this.icon,size:"var(--pine-dimension-sm)","aria-hidden":"true"}),t("slot",{key:"4e5661563b99ec56189447faabcdd1ae631159b2"})))}static get style(){return":host{color:var(--pine-color-text-message);font:var(--pine-typography-body-medium)}"}},[257,"pds-property",{componentId:[1,"component-id"],icon:[1]}]),i=r,a=function(){"undefined"!=typeof customElements&&["pds-property","pds-box","pds-icon"].forEach((e=>{switch(e){case"pds-property":customElements.get(c(e))||customElements.define(c(e),r);break;case"pds-box":customElements.get(c(e))||n();break;case"pds-icon":customElements.get(c(e))||d()}}))};export{i as PdsProperty,a as defineCustomElement}
+import{proxyCustomElement as e,HTMLElement as s,h as t,Host as o,transformTag as d}from"@stencil/core/internal/client";import{d as n}from"./pds-box2.js";import{d as r}from"./pds-icon2.js";const c=e(class extends s{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.icon="star"}render(){return t(o,{key:"198ffd747b7a84a6f58a1b072890fc8bd3ed93aa",id:this.componentId},t("pds-box",{key:"be71f3d96efea0a45f357d888f71dbe5ad8b68d6","align-items":"center",gap:"xs"},t("pds-icon",{key:"1a52407e00b158d5e6a515ad4b07ed3407d31f75",icon:this.icon,size:"var(--pine-dimension-sm)","aria-hidden":"true"}),t("slot",{key:"46ac5019b27bdd079c7853abeef8f7c240d19c2c"})))}static get style(){return":host{color:var(--pine-color-text-message);font:var(--pine-typography-body-medium)}"}},[257,"pds-property",{componentId:[1,"component-id"],icon:[1]}]),i=c,a=function(){"undefined"!=typeof customElements&&["pds-property","pds-box","pds-icon"].forEach((e=>{switch(e){case"pds-property":customElements.get(d(e))||customElements.define(d(e),c);break;case"pds-box":customElements.get(d(e))||n();break;case"pds-icon":customElements.get(d(e))||r()}}))};export{i as PdsProperty,a as defineCustomElement}

package/components/pds-radio-group.js

@@ -1 +1 @@
-import{proxyCustomElement as e,HTMLElement as s,createEvent as i,h as r,Host as o,transformTag as a}from"@stencil/core/internal/client";import{m as d}from"./form.js";import{h as n}from"./index2.js";import{d as p}from"./pds-icon2.js";const t=e(class extends s{constructor(e){super(),!1!==e&&this.__registerHost(),this.pdsRadioGroupChange=i(this,"pdsRadioGroupChange",7),this.direction="column",this.gap="xs",this.disabled=!1,this.invalid=!1,this.required=!1}handlePropsChange(){this.updateChildRadios()}handleRadioChange(e){const s=e.target;if("radio"===s.type&&s.checked){const e=s.closest("pds-radio");e&&this.pdsRadioGroupChange.emit({checked:!0,value:e.value,componentId:e.componentId})}}updateChildRadios(){this.el.querySelectorAll("pds-radio").forEach((e=>{this.name?e.setAttribute("name",this.name):e.removeAttribute("name"),this.disabled?e.setAttribute("disabled","true"):e.removeAttribute("disabled"),this.invalid?e.setAttribute("invalid","true"):e.removeAttribute("invalid"),this.required?e.setAttribute("required","true"):e.removeAttribute("required")}))}componentWillLoad(){if(this.componentId)this._groupId=this.componentId;else{const e="undefined"!=typeof crypto&&crypto.randomUUID?crypto.randomUUID():`${Date.now()}-${Math.random().toString(36).substring(2,9)}`;this._groupId="radio-group-"+e}}componentDidLoad(){this.name||console.warn("pds-radio-group: name prop is required for proper radio group functionality"),this.updateChildRadios()}componentDidRender(){const e=this.el.querySelector(".pds-radio-group__radios");if(null===e)return;const s=()=>Array.from(e.children).find((e=>e.matches(".pds-radio-group__radios, .pds-radio-group__label, .pds-radio-group__message")));let i=s();for(;void 0!==i;)i.matches(".pds-radio-group__radios")&&Array.from(i.childNodes).forEach((s=>e.insertBefore(s,i))),i.remove(),i=s()}classNames(){const e=[];return this.invalid&&e.push("is-invalid"),e.join(" ")}getGapValue(){const e={none:"0",xxs:"var(--pine-dimension-xxs)",xs:"var(--pine-dimension-xs)",sm:"var(--pine-dimension-sm)",md:"var(--pine-dimension-md)",lg:"var(--pine-dimension-lg)",xl:"var(--pine-dimension-xl)",xxl:"var(--pine-dimension-xxl)"};return e[this.gap]?e[this.gap]:`var(--pine-dimension-${this.gap})`}getAriaDescribedBy(){const e=[];return this.errorMessage&&e.push(d(this._groupId,"error")),this.helperMessage&&e.push(d(this._groupId,"helper")),e.length>0?e.join(" "):void 0}render(){const e=this.getGapValue(),s=this.getAriaDescribedBy();return r(o,{key:"bf8063c1a99e272bb3f6bc647998a6ef103f8a71",class:this.classNames(),id:this._groupId,role:"group","aria-describedby":s,style:{"--pds-radio-group-gap":e}},this.groupLabel&&r("div",{key:"8564ed3f8f99cdc1a0e5b189aacc6960923eb5f7",class:"pds-radio-group__label"},this.groupLabel),r("div",{key:"2309c9373790182cde030c1dbda88fa3bdcaaf12",class:{"pds-radio-group__radios":!0,"pds-radio-group__radios--row":"row"===this.direction,"pds-radio-group__radios--column":"column"===this.direction}},r("slot",{key:"d88dde3c631e25c01bc7b6d3ef5d517255fabd1a",onSlotchange:()=>this.updateChildRadios()})),this.helperMessage&&r("div",{key:"a229214ed01663b0fc34f35e27c7148b4eb412ab",class:"pds-radio-group__message",id:d(this._groupId,"helper")},this.helperMessage),this.errorMessage&&r("div",{key:"dc092f2e6dbef0cb369cf00a6eccf9a095a0313d",class:"pds-radio-group__message pds-radio-group__message--error",id:d(this._groupId,"error"),"aria-live":"assertive"},r("pds-icon",{key:"d242da328731e55fa52d8e624fdfc750bfa6cce4",icon:n,size:"small"}),this.errorMessage))}get el(){return this}static get watchers(){return{name:[{handlePropsChange:0}],disabled:[{handlePropsChange:0}],invalid:[{handlePropsChange:0}],required:[{handlePropsChange:0}]}}static get style(){return".sc-pds-radio-group-h{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;gap:var(--pine-dimension-sm)}.is-invalid.sc-pds-radio-group-h .pds-radio-group__message--error.sc-pds-radio-group{color:var(--pine-color-text-message-danger)}.pds-radio-group__label.sc-pds-radio-group{color:var(--pine-color-text-label);font:var(--pine-typography-heading-6);font-weight:var(--pine-font-weight-medium);letter-spacing:var(--pine-letter-spacing-heading-6)}.pds-radio-group__radios.sc-pds-radio-group{display:-ms-flexbox;display:flex;gap:var(--pds-radio-group-gap, var(--pine-dimension-xs))}.pds-radio-group__radios--row.sc-pds-radio-group{-ms-flex-align:start;align-items:flex-start;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap}.pds-radio-group__radios--column.sc-pds-radio-group{-ms-flex-direction:column;flex-direction:column}.pds-radio-group__message.sc-pds-radio-group{color:var(--pine-color-text-message);font:var(--pine-typography-body);width:100%}.pds-radio-group__message--error.sc-pds-radio-group{display:-ms-flexbox;display:flex;gap:var(--pine-dimension-2xs)}.pds-radio-group__message--error.sc-pds-radio-group pds-icon.sc-pds-radio-group{-webkit-margin-before:var(--pine-dimension-050);margin-block-start:var(--pine-dimension-050)}"}},[262,"pds-radio-group",{componentId:[1,"component-id"],direction:[1],errorMessage:[1,"error-message"],helperMessage:[1,"helper-message"],gap:[1],disabled:[4],invalid:[4],groupLabel:[1,"group-label"],name:[1],required:[4]},[[0,"change","handleRadioChange"]],{name:[{handlePropsChange:0}],disabled:[{handlePropsChange:0}],invalid:[{handlePropsChange:0}],required:[{handlePropsChange:0}]}]),l=t,c=function(){"undefined"!=typeof customElements&&["pds-radio-group","pds-icon"].forEach((e=>{switch(e){case"pds-radio-group":customElements.get(a(e))||customElements.define(a(e),t);break;case"pds-icon":customElements.get(a(e))||p()}}))};export{l as PdsRadioGroup,c as defineCustomElement}
+import{proxyCustomElement as e,HTMLElement as s,createEvent as i,h as r,Host as o,transformTag as a}from"@stencil/core/internal/client";import{m as d}from"./form.js";import{h as n}from"./index2.js";import{d as p}from"./pds-icon2.js";const t=e(class extends s{constructor(e){super(),!1!==e&&this.__registerHost(),this.pdsRadioGroupChange=i(this,"pdsRadioGroupChange",7),this.direction="column",this.gap="xs",this.disabled=!1,this.invalid=!1,this.required=!1}handlePropsChange(){this.updateChildRadios()}handleRadioChange(e){const s=e.target;if("radio"===s.type&&s.checked){const e=s.closest("pds-radio");e&&this.pdsRadioGroupChange.emit({checked:!0,value:e.value,componentId:e.componentId})}}updateChildRadios(){this.el.querySelectorAll("pds-radio").forEach((e=>{this.name?e.setAttribute("name",this.name):e.removeAttribute("name"),this.disabled?e.setAttribute("disabled","true"):e.removeAttribute("disabled"),this.invalid?e.setAttribute("invalid","true"):e.removeAttribute("invalid"),this.required?e.setAttribute("required","true"):e.removeAttribute("required")}))}componentWillLoad(){if(this.componentId)this._groupId=this.componentId;else{const e="undefined"!=typeof crypto&&crypto.randomUUID?crypto.randomUUID():`${Date.now()}-${Math.random().toString(36).substring(2,9)}`;this._groupId="radio-group-"+e}}componentDidLoad(){this.name||console.warn("pds-radio-group: name prop is required for proper radio group functionality"),this.updateChildRadios()}componentDidRender(){const e=this.el.querySelector(".pds-radio-group__radios");if(null===e)return;const s=()=>Array.from(e.children).find((e=>e.matches(".pds-radio-group__radios, .pds-radio-group__label, .pds-radio-group__message")));let i=s();for(;void 0!==i;)i.matches(".pds-radio-group__radios")&&Array.from(i.childNodes).forEach((s=>e.insertBefore(s,i))),i.remove(),i=s()}classNames(){const e=[];return this.invalid&&e.push("is-invalid"),e.join(" ")}getGapValue(){const e={none:"0",xxs:"var(--pine-dimension-xxs)",xs:"var(--pine-dimension-xs)",sm:"var(--pine-dimension-sm)",md:"var(--pine-dimension-md)",lg:"var(--pine-dimension-lg)",xl:"var(--pine-dimension-xl)",xxl:"var(--pine-dimension-xxl)"};return e[this.gap]?e[this.gap]:`var(--pine-dimension-${this.gap})`}getAriaDescribedBy(){const e=[];return this.errorMessage&&e.push(d(this._groupId,"error")),this.helperMessage&&e.push(d(this._groupId,"helper")),e.length>0?e.join(" "):void 0}render(){const e=this.getGapValue(),s=this.getAriaDescribedBy();return r(o,{key:"aaf53113f06a0f49706e53735701fba64e79cb4d",class:this.classNames(),id:this._groupId,role:"group","aria-describedby":s,style:{"--pds-radio-group-gap":e}},this.groupLabel&&r("div",{key:"4be5e43146bf348929e45498107862aaca161644",class:"pds-radio-group__label"},this.groupLabel),r("div",{key:"b4a1b870c1a7167b8dcbcf0a11808bbd9a8cec4e",class:{"pds-radio-group__radios":!0,"pds-radio-group__radios--row":"row"===this.direction,"pds-radio-group__radios--column":"column"===this.direction}},r("slot",{key:"2d841cc69c35a4f9da933bbb33c1384ca343e077",onSlotchange:()=>this.updateChildRadios()})),this.helperMessage&&r("div",{key:"a09bb9e739570c06dc1907cb4e2dceecca36f7d3",class:"pds-radio-group__message",id:d(this._groupId,"helper")},this.helperMessage),this.errorMessage&&r("div",{key:"b8fe891cc4b8683d18c19b3b4ddb70212185b954",class:"pds-radio-group__message pds-radio-group__message--error",id:d(this._groupId,"error"),"aria-live":"assertive"},r("pds-icon",{key:"9a15d81d8303eeb5a928b96c760f6b15e536e0dc","aria-hidden":"true",icon:n,size:"small"}),this.errorMessage))}get el(){return this}static get watchers(){return{name:[{handlePropsChange:0}],disabled:[{handlePropsChange:0}],invalid:[{handlePropsChange:0}],required:[{handlePropsChange:0}]}}static get style(){return".sc-pds-radio-group-h{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;gap:var(--pine-dimension-sm)}.is-invalid.sc-pds-radio-group-h .pds-radio-group__message--error.sc-pds-radio-group{color:var(--pine-color-text-message-danger)}.pds-radio-group__label.sc-pds-radio-group{color:var(--pine-color-text-label);font:var(--pine-typography-heading-6);font-weight:var(--pine-font-weight-medium);letter-spacing:var(--pine-letter-spacing-heading-6)}.pds-radio-group__radios.sc-pds-radio-group{display:-ms-flexbox;display:flex;gap:var(--pds-radio-group-gap, var(--pine-dimension-xs))}.pds-radio-group__radios--row.sc-pds-radio-group{-ms-flex-align:start;align-items:flex-start;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap}.pds-radio-group__radios--column.sc-pds-radio-group{-ms-flex-direction:column;flex-direction:column}.pds-radio-group__message.sc-pds-radio-group{color:var(--pine-color-text-message);font:var(--pine-typography-body);width:100%}.pds-radio-group__message--error.sc-pds-radio-group{display:-ms-flexbox;display:flex;gap:var(--pine-dimension-2xs)}.pds-radio-group__message--error.sc-pds-radio-group pds-icon.sc-pds-radio-group{-webkit-margin-before:var(--pine-dimension-050);margin-block-start:var(--pine-dimension-050)}"}},[262,"pds-radio-group",{componentId:[1,"component-id"],direction:[1],errorMessage:[1,"error-message"],helperMessage:[1,"helper-message"],gap:[1],disabled:[4],invalid:[4],groupLabel:[1,"group-label"],name:[1],required:[4]},[[0,"change","handleRadioChange"]],{name:[{handlePropsChange:0}],disabled:[{handlePropsChange:0}],invalid:[{handlePropsChange:0}],required:[{handlePropsChange:0}]}]),l=t,c=function(){"undefined"!=typeof customElements&&["pds-radio-group","pds-icon"].forEach((e=>{switch(e){case"pds-radio-group":customElements.get(a(e))||customElements.define(a(e),t);break;case"pds-icon":customElements.get(a(e))||p()}}))};export{l as PdsRadioGroup,c as defineCustomElement}

package/components/pds-radio.js

@@ -1 +1 @@
-import{proxyCustomElement as e,HTMLElement as i,createEvent as r,h as a,Host as s,transformTag as o}from"@stencil/core/internal/client";import{H as d}from"./attributes.js";import{e as n,a as t,m as l}from"./form.js";import{h as c}from"./index2.js";import{d as p}from"./pds-icon2.js";const h=e(class extends i{constructor(e){super(),!1!==e&&this.__registerHost(),this.pdsRadioChange=r(this,"pdsRadioChange",7),this._type="radio",this.hostKeeper=new d,this._hasImage=!1,this.checked=!1,this.disabled=!1,this.hasBorder=!1,this.invalid=!1,this.required=!1,this.handleRadioChange=e=>{if(this.disabled)return;const i=e.target.checked;this.el.closest("pds-radio-group")||this.pdsRadioChange.emit(i)}}hasImageSlot(){return!!this.el.querySelector('[slot="image"]')}hasImage(){return this._hasImage}classNames(){const e=[];return this.invalid&&e.push("is-invalid"),this.disabled&&e.push("is-disabled"),this.hasBorder&&e.push("has-border"),this.hasImage()&&e.push("has-image"),e.join(" ")}componentWillLoad(){this._hasImage=this.hasImageSlot()}connectedCallback(){this.hostKeeper.connect(this.el),n(this.el,(()=>this._type))}disconnectedCallback(){this.hostKeeper.disconnect()}componentDidRender(){const e=this.el.querySelector(".pds-radio__image-container:not([hidden])");Array.from(this.el.querySelectorAll(".pds-radio__image-container[hidden], .pds-radio__content-wrapper[hidden], label[hidden], .pds-radio__message[hidden]")).forEach((i=>{const r=i.querySelector('[slot="image"]');null!==r&&null!==e&&e.appendChild(r),i.remove()}))}render(){const e=()=>[a("label",{htmlFor:this.componentId,key:this.componentId+"-label"},a("input",{key:"ccd618855831bcee309e815f2cd2712fd4e8fe1f","aria-describedby":t(this.componentId,this.invalid,this.helperMessage,this.errorMessage),"aria-invalid":this.invalid?"true":void 0,type:"radio",id:this.componentId,name:this.name,value:this.value,checked:this.checked,required:this.required,disabled:this.disabled,onChange:this.handleRadioChange,class:this.hasImage()?"visually-hidden":""}),a("span",{key:"2e372a880c28f48fb804bac2518208082c141fad",class:this.hideLabel?"visually-hidden":""},this.label)),this.helperMessage&&a("div",{key:this.componentId+"-helper",class:"pds-radio__message",id:l(this.componentId,"helper")},this.helperMessage),this.errorMessage&&a("div",{key:this.componentId+"-error",class:"pds-radio__message pds-radio__message--error",id:l(this.componentId,"error"),"aria-live":"assertive"},a("pds-icon",{key:"889d502575f6a162f450b6b58d76a6f6f1c74e4b",icon:c,size:"small"}),this.errorMessage)],i=this.classNames();return this.hostKeeper.record(i),a(s,{key:"374003032b28407581a55f1fb0a304c49acf3c16",class:i},this.hasImage()&&a("div",{key:"7eeb516267de1afcfa85fc7567999db488c2f4f5",class:"pds-radio__image-container",part:"image-container"},a("slot",{key:"a312fea06f0c015bffab3bb392ff04d4913fd1c0",name:"image",onSlotchange:()=>this._hasImage=this.hasImageSlot()})),this.hasImage()?a("div",{class:"pds-radio__content-wrapper"},e()):e())}get el(){return this}static get style(){return'.sc-pds-radio-h{display:inline-block}[aria-disabled=true].sc-pds-radio-h label.sc-pds-radio{color:var(--pine-color-text-label-disabled)}[aria-readonly=true].sc-pds-radio-h label.sc-pds-radio{color:var(--pine-color-text-label-readonly)}label.sc-pds-radio{color:var(--pine-color-text-label);font:var(--pine-typography-body-medium);letter-spacing:var(--pine-letter-spacing)}.sc-pds-radio-h{--sizing-check-size:6px;--sizing-input-size:var(--pine-dimension-sm);--sizing-margin-block-start:6px;-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-flow:row wrap;flex-flow:row wrap;position:relative}.is-invalid.sc-pds-radio-h .pds-radio__message--error.sc-pds-radio{color:var(--pine-color-text-message-danger)}.has-border.sc-pds-radio-h{-ms-flex-align:start;align-items:flex-start;border:var(--pine-border);border-radius:var(--pine-dimension-125);-webkit-column-gap:var(--pine-dimension-xs);-moz-column-gap:var(--pine-dimension-xs);column-gap:var(--pine-dimension-xs);display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-direction:column;flex-direction:column;padding:var(--pine-dimension-md)}@media (max-width: 767px){.has-border.sc-pds-radio-h{-webkit-box-sizing:border-box;box-sizing:border-box;-ms-flex:1 1 100%;flex:1 1 100%;max-width:100%;min-width:0}}.has-border.sc-pds-radio-h:hover{border:var(--pine-border-hover)}.has-border.sc-pds-radio-h:has(input:checked){-webkit-box-shadow:0 0 0 2px var(--pine-color-primary-hover);box-shadow:0 0 0 2px var(--pine-color-primary-hover)}.has-border.sc-pds-radio-h label.sc-pds-radio{color:var(--pine-color-text);font-weight:var(--pine-font-weight-semi-bold)}.has-border.sc-pds-radio-h label.sc-pds-radio::after{content:"";cursor:pointer;height:100%;left:0;position:absolute;top:0;width:100%;z-index:1}.has-border.sc-pds-radio-h:has(input:disabled){background:var(--pine-color-background-container-disabled);border-color:var(--pine-color-border-disabled);cursor:not-allowed}.has-border.sc-pds-radio-h:has(input:disabled) label.sc-pds-radio{color:var(--pine-color-text-label-disabled);cursor:not-allowed}.has-border.sc-pds-radio-h:has(input:disabled) label.sc-pds-radio::after{cursor:not-allowed}.has-border.is-invalid.sc-pds-radio-h .pds-radio__message--error.sc-pds-radio{color:var(--pine-color-text-message-danger)}input.sc-pds-radio{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--pine-color-background-container);border:var(--pine-border);border-radius:var(--pine-border-radius-full);-ms-flex:none;flex:none;height:var(--sizing-input-size);margin:0;-webkit-margin-before:var(--pine-dimension-025);margin-block-start:var(--pine-dimension-025);position:relative;width:var(--sizing-input-size)}input.visually-hidden.sc-pds-radio{border:0;clip:rect(0 0 0 0);-webkit-clip-path:polygon(0 0, 0 0, 0 0);clip-path:polygon(0 0, 0 0, 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}input.sc-pds-radio:hover{background:var(--pine-color-background-container-hover);border:var(--pine-border-hover)}input.sc-pds-radio:checked{background:var(--pine-color-accent);border-color:var(--pine-color-accent)}input.sc-pds-radio:checked:hover{background:var(--pine-color-accent-hover);border-color:var(--pine-color-accent-hover)}input.sc-pds-radio:checked::after{background:var(--pine-color-text-primary);border-radius:var(--pine-border-radius-full);content:"";display:block;height:var(--sizing-check-size);left:50%;position:absolute;top:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);width:var(--sizing-check-size)}input.sc-pds-radio:disabled{background:var(--pine-color-background-container-disabled);border-color:var(--pine-color-border-disabled);cursor:not-allowed}input.sc-pds-radio:disabled:checked{background-color:var(--pine-color-accent-disabled);border-color:var(--pine-color-border-disabled)}input.sc-pds-radio:disabled:checked::after{border-color:var(--pine-color-border-disabled)}input.sc-pds-radio:focus-visible{outline:var(--pine-outline-focus)}label.sc-pds-radio{display:-ms-flexbox;display:flex;gap:var(--pine-dimension-xs)}label.sc-pds-radio:has(input:disabled){color:var(--pine-color-text-label-disabled);cursor:not-allowed}.sc-pds-radio-h:has(input:disabled) .pds-radio__message.sc-pds-radio{color:var(--pine-color-text-label-disabled)}.visually-hidden.sc-pds-radio{border:0;clip:rect(0 0 0 0);-webkit-clip-path:polygon(0 0, 0 0, 0 0);clip-path:polygon(0 0, 0 0, 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.pds-radio__message.sc-pds-radio{color:var(--pine-color-text-message);-ms-flex-preferred-size:100%;flex-basis:100%;font:var(--pine-typography-body);-webkit-margin-start:var(--pine-dimension-md);margin-inline-start:var(--pine-dimension-md);width:100%}.pds-radio__message--error.sc-pds-radio{display:-ms-flexbox;display:flex;gap:var(--pine-dimension-2xs)}.pds-radio__message--error.sc-pds-radio pds-icon.sc-pds-radio{-webkit-margin-before:var(--pine-dimension-025);margin-block-start:var(--pine-dimension-025)}.has-image.sc-pds-radio-h{-ms-flex-align:center;align-items:center;border:var(--pine-border);border-radius:var(--pine-dimension-125);-webkit-column-gap:var(--pine-dimension-xs);-moz-column-gap:var(--pine-dimension-xs);column-gap:var(--pine-dimension-xs);display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-direction:row;flex-direction:row;padding:var(--pine-dimension-md)}@media (max-width: 767px){.has-image.sc-pds-radio-h{-webkit-box-sizing:border-box;box-sizing:border-box;-ms-flex:1 1 100%;flex:1 1 100%;max-width:100%;min-width:0}}.has-image.sc-pds-radio-h:hover{border:var(--pine-border-hover)}.has-image.sc-pds-radio-h:has(input:checked){-webkit-box-shadow:0 0 0 2px var(--pine-color-primary-hover);box-shadow:0 0 0 2px var(--pine-color-primary-hover)}.has-image.sc-pds-radio-h label.sc-pds-radio{color:var(--pine-color-text);display:-ms-flexbox;display:flex;font-weight:var(--pine-font-weight-semi-bold);gap:var(--pine-dimension-xs)}.has-image.sc-pds-radio-h label.sc-pds-radio::after{content:"";cursor:pointer;height:100%;left:0;position:absolute;top:0;width:100%;z-index:1}.has-image.sc-pds-radio-h .pds-radio__image-container.sc-pds-radio{-ms-flex-align:center;align-items:center;align-self:center;border:var(--pine-border);border-radius:var(--pine-border-radius-full);cursor:pointer;display:-ms-flexbox;display:flex;-ms-flex:none;flex:none;grid-area:image;-ms-flex-pack:center;justify-content:center;overflow:hidden;position:relative;-webkit-transition:all var(--pine-motion-duration-base) ease;transition:all var(--pine-motion-duration-base) ease}.has-image.sc-pds-radio-h .pds-radio__image-container.sc-pds-radio:hover{border-color:var(--pine-color-border-hover)}.has-image.sc-pds-radio-h .pds-radio__image-container.sc-pds-radio .pds-radio__image.sc-pds-radio{height:100%;-o-object-fit:cover;object-fit:cover;width:100%}.has-image.sc-pds-radio-h .pds-radio__content-wrapper.sc-pds-radio{-ms-flex:1;flex:1;min-width:0;overflow-wrap:anywhere}.has-image.sc-pds-radio-h .pds-radio__message.sc-pds-radio{grid-area:message;-webkit-margin-before:0;margin-block-start:0;-webkit-margin-start:0;margin-inline-start:0}.has-image.is-disabled.sc-pds-radio-h{background:var(--pine-color-background-container-disabled);border-color:var(--pine-color-border-disabled);cursor:not-allowed}.has-image.is-disabled.sc-pds-radio-h .pds-radio__image-container.sc-pds-radio{border-color:var(--pine-color-border-disabled);cursor:not-allowed;opacity:0.5}.has-image.is-disabled.sc-pds-radio-h .pds-radio__image-container.sc-pds-radio:hover{border-color:var(--pine-color-border-disabled)}.has-image.is-disabled.sc-pds-radio-h label.sc-pds-radio{color:var(--pine-color-text-label-disabled);cursor:not-allowed}.has-image.is-disabled.sc-pds-radio-h label.sc-pds-radio::after{cursor:not-allowed}.has-image.is-disabled.sc-pds-radio-h .pds-radio__message.sc-pds-radio{color:var(--pine-color-text-label-disabled)}.has-image.is-invalid.sc-pds-radio-h .pds-radio__message--error.sc-pds-radio{color:var(--pine-color-text-message-danger)}'}},[262,"pds-radio",{checked:[4],componentId:[1,"component-id"],disabled:[4],errorMessage:[1,"error-message"],helperMessage:[1,"helper-message"],hasBorder:[4,"has-border"],invalid:[4],label:[1],hideLabel:[4,"hide-label"],name:[1],required:[4],value:[1],_hasImage:[32]}]),b=h,m=function(){"undefined"!=typeof customElements&&["pds-radio","pds-icon"].forEach((e=>{switch(e){case"pds-radio":customElements.get(o(e))||customElements.define(o(e),h);break;case"pds-icon":customElements.get(o(e))||p()}}))};export{b as PdsRadio,m as defineCustomElement}
+import{proxyCustomElement as i,HTMLElement as e,createEvent as r,h as a,Host as o,transformTag as s}from"@stencil/core/internal/client";import{H as d}from"./attributes.js";import{e as n,a as t,m as l}from"./form.js";import{h as p}from"./index2.js";import{d as c}from"./pds-icon2.js";const h=i(class extends e{constructor(i){super(),!1!==i&&this.__registerHost(),this.pdsRadioChange=r(this,"pdsRadioChange",7),this._type="radio",this.hostKeeper=new d,this._hasImage=!1,this.checked=!1,this.disabled=!1,this.hasBorder=!1,this.invalid=!1,this.required=!1,this.variant="default",this.handleRadioChange=i=>{if(this.disabled)return;const e=i.target.checked;this.el.closest("pds-radio-group")||this.pdsRadioChange.emit(e)}}hasImageSlot(){return!!this.el.querySelector('[slot="image"]')}hasImage(){return this._hasImage}isPill(){return"pill"===this.variant}classNames(){const i=[];return this.invalid&&i.push("is-invalid"),this.disabled&&i.push("is-disabled"),this.hasBorder&&!this.isPill()&&i.push("has-border"),this.isPill()&&i.push("pds-radio--pill"),this.hasImage()&&!this.isPill()&&i.push("has-image"),i.join(" ")}componentWillLoad(){this._hasImage=this.hasImageSlot()}connectedCallback(){this.hostKeeper.connect(this.el),n(this.el,(()=>this._type))}disconnectedCallback(){this.hostKeeper.disconnect()}componentDidRender(){const i=this.el.querySelector(".pds-radio__image-container:not([hidden])");Array.from(this.el.querySelectorAll(".pds-radio__image-container[hidden], .pds-radio__content-wrapper[hidden], label[hidden], .pds-radio__message[hidden]")).forEach((e=>{const r=e.querySelector('[slot="image"]');null!==r&&null!==i&&i.appendChild(r),e.remove()}))}render(){const i=()=>[a("label",{htmlFor:this.componentId,key:this.componentId+"-label"},a("input",{key:"fdd83248666907fa25c5406cdedcd0e6f8d45f50","aria-describedby":t(this.componentId,this.invalid,this.helperMessage,this.errorMessage),"aria-invalid":this.invalid?"true":void 0,type:"radio",id:this.componentId,name:this.name,value:this.value,checked:this.checked,required:this.required,disabled:this.disabled,onChange:this.handleRadioChange,class:this.hasImage()||this.isPill()?"visually-hidden":""}),a("span",{key:"73166ffd57cdb1f3b9e2b61fe880216b23a6510b",class:this.hideLabel&&!this.isPill()?"visually-hidden":""},this.label)),this.helperMessage&&a("div",{key:this.componentId+"-helper",class:"pds-radio__message",id:l(this.componentId,"helper")},this.helperMessage),this.errorMessage&&a("div",{key:this.componentId+"-error",class:"pds-radio__message pds-radio__message--error",id:l(this.componentId,"error"),"aria-live":"assertive"},a("pds-icon",{key:"e5bca81578382181b6fce61fa6830fd60e54234a","aria-hidden":"true",icon:p,size:"small"}),this.errorMessage)],e=this.classNames();this.hostKeeper.record(e);const r=this.hasImage()&&!this.isPill();return a(o,{key:"4cf39a988cc7642234ff62e7fa2f0d08b09e7d25",class:e},r&&a("div",{key:"7a88d32f896ad4696ea46b13f9ef01e7df0a1c3e",class:"pds-radio__image-container",part:"image-container"},a("slot",{key:"eb8399263443d36ab91c0875602d0dc31f036058",name:"image",onSlotchange:()=>this._hasImage=this.hasImageSlot()})),r?a("div",{class:"pds-radio__content-wrapper"},i()):i())}get el(){return this}static get style(){return'.sc-pds-radio-h{display:inline-block}[aria-disabled=true].sc-pds-radio-h label.sc-pds-radio{color:var(--pine-color-text-label-disabled)}[aria-readonly=true].sc-pds-radio-h label.sc-pds-radio{color:var(--pine-color-text-label-readonly)}label.sc-pds-radio{color:var(--pine-color-text-label);font:var(--pine-typography-body-medium);letter-spacing:var(--pine-letter-spacing)}.sc-pds-radio-h{--sizing-check-size:6px;--sizing-input-size:var(--pine-dimension-sm);--sizing-margin-block-start:6px;-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-flow:row wrap;flex-flow:row wrap;position:relative}.is-invalid.sc-pds-radio-h .pds-radio__message--error.sc-pds-radio{color:var(--pine-color-text-message-danger)}.has-border.sc-pds-radio-h{-ms-flex-align:start;align-items:flex-start;border:var(--pine-border);border-radius:var(--pine-dimension-125);-webkit-column-gap:var(--pine-dimension-xs);-moz-column-gap:var(--pine-dimension-xs);column-gap:var(--pine-dimension-xs);display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-direction:column;flex-direction:column;padding:var(--pine-dimension-md)}@media (max-width: 767px){.has-border.sc-pds-radio-h{-webkit-box-sizing:border-box;box-sizing:border-box;-ms-flex:1 1 100%;flex:1 1 100%;max-width:100%;min-width:0}}.has-border.sc-pds-radio-h:hover{border:var(--pine-border-hover)}.has-border.sc-pds-radio-h:has(input:checked){-webkit-box-shadow:0 0 0 2px var(--pine-color-primary-hover);box-shadow:0 0 0 2px var(--pine-color-primary-hover)}.has-border.sc-pds-radio-h label.sc-pds-radio{color:var(--pine-color-text);font-weight:var(--pine-font-weight-semi-bold)}.has-border.sc-pds-radio-h label.sc-pds-radio::after{content:"";cursor:pointer;height:100%;left:0;position:absolute;top:0;width:100%;z-index:1}.has-border.sc-pds-radio-h:has(input:disabled){background:var(--pine-color-background-container-disabled);border-color:var(--pine-color-border-disabled);cursor:not-allowed}.has-border.sc-pds-radio-h:has(input:disabled) label.sc-pds-radio{color:var(--pine-color-text-label-disabled);cursor:not-allowed}.has-border.sc-pds-radio-h:has(input:disabled) label.sc-pds-radio::after{cursor:not-allowed}.has-border.is-invalid.sc-pds-radio-h .pds-radio__message--error.sc-pds-radio{color:var(--pine-color-text-message-danger)}input.sc-pds-radio{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--pine-color-background-container);border:var(--pine-border);border-radius:var(--pine-border-radius-full);-ms-flex:none;flex:none;height:var(--sizing-input-size);margin:0;-webkit-margin-before:var(--pine-dimension-025);margin-block-start:var(--pine-dimension-025);position:relative;width:var(--sizing-input-size)}input.visually-hidden.sc-pds-radio{border:0;clip:rect(0 0 0 0);-webkit-clip-path:polygon(0 0, 0 0, 0 0);clip-path:polygon(0 0, 0 0, 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}input.sc-pds-radio:hover{background:var(--pine-color-background-container-hover);border:var(--pine-border-hover)}input.sc-pds-radio:checked{background:var(--pine-color-accent);border-color:var(--pine-color-accent)}input.sc-pds-radio:checked:hover{background:var(--pine-color-accent-hover);border-color:var(--pine-color-accent-hover)}input.sc-pds-radio:checked::after{background:var(--pine-color-text-primary);border-radius:var(--pine-border-radius-full);content:"";display:block;height:var(--sizing-check-size);left:50%;position:absolute;top:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);width:var(--sizing-check-size)}input.sc-pds-radio:disabled{background:var(--pine-color-background-container-disabled);border-color:var(--pine-color-border-disabled);cursor:not-allowed}input.sc-pds-radio:disabled:checked{background-color:var(--pine-color-accent-disabled);border-color:var(--pine-color-border-disabled)}input.sc-pds-radio:disabled:checked::after{border-color:var(--pine-color-border-disabled)}input.sc-pds-radio:focus-visible{outline:var(--pine-outline-focus)}label.sc-pds-radio{display:-ms-flexbox;display:flex;gap:var(--pine-dimension-xs)}label.sc-pds-radio:has(input:disabled){color:var(--pine-color-text-label-disabled);cursor:not-allowed}.sc-pds-radio-h:has(input:disabled) .pds-radio__message.sc-pds-radio{color:var(--pine-color-text-label-disabled)}.visually-hidden.sc-pds-radio{border:0;clip:rect(0 0 0 0);-webkit-clip-path:polygon(0 0, 0 0, 0 0);clip-path:polygon(0 0, 0 0, 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.pds-radio__message.sc-pds-radio{color:var(--pine-color-text-message);-ms-flex-preferred-size:100%;flex-basis:100%;font:var(--pine-typography-body);-webkit-margin-start:var(--pine-dimension-md);margin-inline-start:var(--pine-dimension-md);width:100%}.pds-radio__message--error.sc-pds-radio{display:-ms-flexbox;display:flex;gap:var(--pine-dimension-2xs)}.pds-radio__message--error.sc-pds-radio pds-icon.sc-pds-radio{-webkit-margin-before:var(--pine-dimension-025);margin-block-start:var(--pine-dimension-025)}.has-image.sc-pds-radio-h{-ms-flex-align:center;align-items:center;border:var(--pine-border);border-radius:var(--pine-dimension-125);-webkit-column-gap:var(--pine-dimension-xs);-moz-column-gap:var(--pine-dimension-xs);column-gap:var(--pine-dimension-xs);display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-direction:row;flex-direction:row;padding:var(--pine-dimension-md)}@media (max-width: 767px){.has-image.sc-pds-radio-h{-webkit-box-sizing:border-box;box-sizing:border-box;-ms-flex:1 1 100%;flex:1 1 100%;max-width:100%;min-width:0}}.has-image.sc-pds-radio-h:hover{border:var(--pine-border-hover)}.has-image.sc-pds-radio-h:has(input:checked){-webkit-box-shadow:0 0 0 2px var(--pine-color-primary-hover);box-shadow:0 0 0 2px var(--pine-color-primary-hover)}.has-image.sc-pds-radio-h label.sc-pds-radio{color:var(--pine-color-text);display:-ms-flexbox;display:flex;font-weight:var(--pine-font-weight-semi-bold);gap:var(--pine-dimension-xs)}.has-image.sc-pds-radio-h label.sc-pds-radio::after{content:"";cursor:pointer;height:100%;left:0;position:absolute;top:0;width:100%;z-index:1}.has-image.sc-pds-radio-h .pds-radio__image-container.sc-pds-radio{-ms-flex-align:center;align-items:center;align-self:center;border:var(--pine-border);border-radius:var(--pine-border-radius-full);cursor:pointer;display:-ms-flexbox;display:flex;-ms-flex:none;flex:none;grid-area:image;-ms-flex-pack:center;justify-content:center;overflow:hidden;position:relative;-webkit-transition:all var(--pine-motion-duration-base) ease;transition:all var(--pine-motion-duration-base) ease}.has-image.sc-pds-radio-h .pds-radio__image-container.sc-pds-radio:hover{border-color:var(--pine-color-border-hover)}.has-image.sc-pds-radio-h .pds-radio__image-container.sc-pds-radio .pds-radio__image.sc-pds-radio{height:100%;-o-object-fit:cover;object-fit:cover;width:100%}.has-image.sc-pds-radio-h .pds-radio__content-wrapper.sc-pds-radio{-ms-flex:1;flex:1;min-width:0;overflow-wrap:anywhere}.has-image.sc-pds-radio-h .pds-radio__message.sc-pds-radio{grid-area:message;-webkit-margin-before:0;margin-block-start:0;-webkit-margin-start:0;margin-inline-start:0}.has-image.is-disabled.sc-pds-radio-h{background:var(--pine-color-background-container-disabled);border-color:var(--pine-color-border-disabled);cursor:not-allowed}.has-image.is-disabled.sc-pds-radio-h .pds-radio__image-container.sc-pds-radio{border-color:var(--pine-color-border-disabled);cursor:not-allowed;opacity:0.5}.has-image.is-disabled.sc-pds-radio-h .pds-radio__image-container.sc-pds-radio:hover{border-color:var(--pine-color-border-disabled)}.has-image.is-disabled.sc-pds-radio-h label.sc-pds-radio{color:var(--pine-color-text-label-disabled);cursor:not-allowed}.has-image.is-disabled.sc-pds-radio-h label.sc-pds-radio::after{cursor:not-allowed}.has-image.is-disabled.sc-pds-radio-h .pds-radio__message.sc-pds-radio{color:var(--pine-color-text-label-disabled)}.has-image.is-invalid.sc-pds-radio-h .pds-radio__message--error.sc-pds-radio{color:var(--pine-color-text-message-danger)}.pds-radio--pill.sc-pds-radio-h label.sc-pds-radio{-ms-flex-align:center;align-items:center;background:var(--pine-color-background-container);border:var(--pine-border);border-radius:var(--pine-border-radius-full);-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--pine-color-text-active);cursor:pointer;font:var(--pine-typography-body);min-block-size:var(--pine-dimension-xl);padding:0 var(--pine-dimension-sm);-webkit-transition:border-color var(--pine-motion-duration-fast) ease;transition:border-color var(--pine-motion-duration-fast) ease}.pds-radio--pill.sc-pds-radio-h label.sc-pds-radio span.sc-pds-radio{min-width:0;overflow-wrap:anywhere}.pds-radio--pill.sc-pds-radio-h label.sc-pds-radio:hover{border-color:var(--pine-color-text)}.pds-radio--pill.sc-pds-radio-h label.sc-pds-radio:has(input:checked){border-color:var(--pine-color-text-active);-webkit-box-shadow:inset 0 0 0 var(--pine-border-width) var(--pine-color-text-active);box-shadow:inset 0 0 0 var(--pine-border-width) var(--pine-color-text-active)}.pds-radio--pill.sc-pds-radio-h label.sc-pds-radio:has(input:focus-visible){outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width-thick)}.pds-radio--pill.sc-pds-radio-h label.sc-pds-radio:has(input:disabled){background:var(--pine-color-background-container-disabled);border-color:var(--pine-color-border-disabled);color:var(--pine-color-text-label-disabled);cursor:not-allowed}.pds-radio--pill.sc-pds-radio-h label.sc-pds-radio:has(input:disabled:checked){border-color:var(--pine-color-text-label-disabled);-webkit-box-shadow:inset 0 0 0 var(--pine-border-width) var(--pine-color-text-label-disabled);box-shadow:inset 0 0 0 var(--pine-border-width) var(--pine-color-text-label-disabled)}@media (forced-colors: active){.pds-radio--pill.sc-pds-radio-h label.sc-pds-radio:has(input:disabled){border-color:GrayText}.pds-radio--pill.sc-pds-radio-h label.sc-pds-radio:has(input:checked){border-color:Highlight;border-width:var(--pine-border-width-thick);padding-inline:calc(var(--pine-dimension-sm) - (var(--pine-border-width-thick) - var(--pine-border-width)))}.pds-radio--pill.sc-pds-radio-h label.sc-pds-radio:has(input:disabled:checked){border-color:GrayText;border-width:var(--pine-border-width-thick);padding-inline:calc(var(--pine-dimension-sm) - (var(--pine-border-width-thick) - var(--pine-border-width)))}}.pds-radio--pill.sc-pds-radio-h .pds-radio__message.sc-pds-radio{-webkit-margin-start:0;margin-inline-start:0}'}},[262,"pds-radio",{checked:[4],componentId:[1,"component-id"],disabled:[4],errorMessage:[1,"error-message"],helperMessage:[1,"helper-message"],hasBorder:[4,"has-border"],invalid:[4],label:[1],hideLabel:[4,"hide-label"],name:[1],required:[4],value:[1],variant:[1],_hasImage:[32]}]),b=h,m=function(){"undefined"!=typeof customElements&&["pds-radio","pds-icon"].forEach((i=>{switch(i){case"pds-radio":customElements.get(s(i))||customElements.define(s(i),h);break;case"pds-icon":customElements.get(s(i))||c()}}))};export{b as PdsRadio,m as defineCustomElement}

package/components/pds-row.js

@@ -1 +1 @@
-import{proxyCustomElement as e,HTMLElement as n,h as i,Host as a,transformTag as t}from"@stencil/core/internal/client";import{H as s}from"./attributes.js";const r=e(class extends n{constructor(e){super(),!1!==e&&this.__registerHost(),this.hostKeeper=new s,this.border=!1,this.noWrap=!1,this.colGapMap={none:"0",xxs:".25rem",xs:".5rem",sm:"1rem",md:"1.5rem",lg:"2.25rem",xl:"3rem",xxl:"4rem","025":"var(--pine-dimension-025)","050":"var(--pine-dimension-050)",100:"var(--pine-dimension-100)",125:"var(--pine-dimension-125)",150:"var(--pine-dimension-150)",200:"var(--pine-dimension-200)",250:"var(--pine-dimension-250)",300:"var(--pine-dimension-300)",350:"var(--pine-dimension-350)",400:"var(--pine-dimension-400)",450:"var(--pine-dimension-450)",500:"var(--pine-dimension-500)",550:"var(--pine-dimension-550)",600:"var(--pine-dimension-600)",650:"var(--pine-dimension-650)",700:"var(--pine-dimension-700)",750:"var(--pine-dimension-750)",800:"var(--pine-dimension-800)"}}connectedCallback(){this.hostKeeper.connect(this.el)}disconnectedCallback(){this.hostKeeper.disconnect()}render(){const e=`\n    ${null!=this.alignItems&&""!==this.alignItems.trim()?"pds-align-items-"+this.alignItems:""}\n    ${this.border?"pds-row--border":""}\n    ${null!=this.justifyContent&&""!==this.justifyContent.trim()?"pds-justify-content-"+this.justifyContent:""}\n    ${this.noWrap?"pds-row--no-wrap":""}\n  `,n=Object.assign(Object.assign(Object.assign(Object.assign({},this.colGap&&{"--row-gap-x":null!=this.colGap&&""!==this.colGap.trim()?this.colGapMap[this.colGap]:"","--row-gap-y":null!=this.colGap&&""!==this.colGap.trim()?this.colGapMap[this.colGap]:""}),this.colGapBlock&&{"--row-gap-y":null!=this.colGapBlock&&""!==this.colGapBlock.trim()?this.colGapMap[this.colGapBlock]:""}),this.colGapInline&&{"--row-gap-x":null!=this.colGapInline&&""!==this.colGapInline.trim()?this.colGapMap[this.colGapInline]:""}),this.minHeight&&{"min-height":this.minHeight});return this.hostKeeper.record("pds-row "+e,n),i(a,{key:"452882c1105868f5d392e7cb165311b1abc4a243",class:"pds-row "+e,style:n})}get el(){return this}static get style(){return":host{--row-gap-y:var(--pine-dimension-125);--row-gap-x:var(--pine-dimension-125);display:block;-webkit-margin-after:calc(var(--row-gap-y) * -1);margin-block-end:calc(var(--row-gap-y) * -1);-webkit-margin-before:calc(var(--row-gap-y) * -1);margin-block-start:calc(var(--row-gap-y) * -1);-webkit-margin-end:calc(var(--row-gap-x) * -0.5);margin-inline-end:calc(var(--row-gap-x) * -0.5);-webkit-margin-start:calc(var(--row-gap-x) * -0.5);margin-inline-start:calc(var(--row-gap-x) * -0.5)}.pds-row{display:-ms-flexbox;display:flex;-ms-flex-positive:1;flex-grow:1;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-margin-after:calc(var(--row-gap-y) * -1);margin-block-end:calc(var(--row-gap-y) * -1);-webkit-margin-before:calc(var(--row-gap-y) * -1);margin-block-start:calc(var(--row-gap-y) * -1);-webkit-margin-end:calc(var(--row-gap-x) * -1);margin-inline-end:calc(var(--row-gap-x) * -1);-webkit-margin-start:calc(var(--row-gap-x) * -1);margin-inline-start:calc(var(--row-gap-x) * -1)}@layer layout{.pds-row>*{-webkit-padding-after:calc(var(--row-gap-y));padding-block-end:calc(var(--row-gap-y));-webkit-padding-before:calc(var(--row-gap-y));padding-block-start:calc(var(--row-gap-y));-webkit-padding-end:calc(var(--row-gap-x));padding-inline-end:calc(var(--row-gap-x));-webkit-padding-start:calc(var(--row-gap-x));padding-inline-start:calc(var(--row-gap-x))}}.pds-row--no-wrap{-ms-flex-wrap:nowrap;flex-wrap:nowrap}.pds-row--border{border:var(--pine-border)}.pds-justify-content-start{-ms-flex-pack:start;justify-content:start}.pds-justify-content-center{-ms-flex-pack:center;justify-content:center}.pds-justify-content-end{-ms-flex-pack:end;justify-content:end}.pds-justify-content-space-between{-ms-flex-pack:justify;justify-content:space-between}.pds-justify-content-space-around{-ms-flex-pack:distribute;justify-content:space-around}.pds-justify-content-space-evenly{-ms-flex-pack:space-evenly;justify-content:space-evenly}.pds-align-items-start{-ms-flex-align:start;align-items:start}.pds-align-items-center{-ms-flex-align:center;align-items:center}.pds-align-items-end{-ms-flex-align:end;align-items:end}.pds-align-items-stretch{-ms-flex-align:stretch;align-items:stretch}.pds-align-items-baseline{-ms-flex-align:baseline;align-items:baseline}"}},[0,"pds-row",{alignItems:[1,"align-items"],border:[4],colGap:[1,"col-gap"],colGapBlock:[1,"col-gap-block"],colGapInline:[1,"col-gap-inline"],componentId:[1,"component-id"],justifyContent:[1,"justify-content"],minHeight:[1,"min-height"],noWrap:[4,"no-wrap"]}]),o=r,c=function(){"undefined"!=typeof customElements&&["pds-row"].forEach((e=>{"pds-row"===e&&(customElements.get(t(e))||customElements.define(t(e),r))}))};export{o as PdsRow,c as defineCustomElement}
+import{proxyCustomElement as e,HTMLElement as n,h as i,Host as a,transformTag as t}from"@stencil/core/internal/client";import{H as s}from"./attributes.js";const r=e(class extends n{constructor(e){super(),!1!==e&&this.__registerHost(),this.hostKeeper=new s,this.border=!1,this.noWrap=!1,this.colGapMap={none:"0",xxs:".25rem",xs:".5rem",sm:"1rem",md:"1.5rem",lg:"2.25rem",xl:"3rem",xxl:"4rem","025":"var(--pine-dimension-025)","050":"var(--pine-dimension-050)",100:"var(--pine-dimension-100)",125:"var(--pine-dimension-125)",150:"var(--pine-dimension-150)",200:"var(--pine-dimension-200)",250:"var(--pine-dimension-250)",300:"var(--pine-dimension-300)",350:"var(--pine-dimension-350)",400:"var(--pine-dimension-400)",450:"var(--pine-dimension-450)",500:"var(--pine-dimension-500)",550:"var(--pine-dimension-550)",600:"var(--pine-dimension-600)",650:"var(--pine-dimension-650)",700:"var(--pine-dimension-700)",750:"var(--pine-dimension-750)",800:"var(--pine-dimension-800)"}}connectedCallback(){this.hostKeeper.connect(this.el)}disconnectedCallback(){this.hostKeeper.disconnect()}render(){const e=`\n    ${null!=this.alignItems&&""!==this.alignItems.trim()?"pds-align-items-"+this.alignItems:""}\n    ${this.border?"pds-row--border":""}\n    ${null!=this.justifyContent&&""!==this.justifyContent.trim()?"pds-justify-content-"+this.justifyContent:""}\n    ${this.noWrap?"pds-row--no-wrap":""}\n  `,n=Object.assign(Object.assign(Object.assign(Object.assign({},this.colGap&&{"--row-gap-x":null!=this.colGap&&""!==this.colGap.trim()?this.colGapMap[this.colGap]:"","--row-gap-y":null!=this.colGap&&""!==this.colGap.trim()?this.colGapMap[this.colGap]:""}),this.colGapBlock&&{"--row-gap-y":null!=this.colGapBlock&&""!==this.colGapBlock.trim()?this.colGapMap[this.colGapBlock]:""}),this.colGapInline&&{"--row-gap-x":null!=this.colGapInline&&""!==this.colGapInline.trim()?this.colGapMap[this.colGapInline]:""}),this.minHeight&&{"min-height":this.minHeight});return this.hostKeeper.record("pds-row "+e,n),i(a,{key:"589ee3251a4ee1d7824c8e2fa3e214de5466c3db",class:"pds-row "+e,style:n})}get el(){return this}static get style(){return":host{--row-gap-y:var(--pine-dimension-125);--row-gap-x:var(--pine-dimension-125);display:block;-webkit-margin-after:calc(var(--row-gap-y) * -1);margin-block-end:calc(var(--row-gap-y) * -1);-webkit-margin-before:calc(var(--row-gap-y) * -1);margin-block-start:calc(var(--row-gap-y) * -1);-webkit-margin-end:calc(var(--row-gap-x) * -0.5);margin-inline-end:calc(var(--row-gap-x) * -0.5);-webkit-margin-start:calc(var(--row-gap-x) * -0.5);margin-inline-start:calc(var(--row-gap-x) * -0.5)}.pds-row{display:-ms-flexbox;display:flex;-ms-flex-positive:1;flex-grow:1;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-margin-after:calc(var(--row-gap-y) * -1);margin-block-end:calc(var(--row-gap-y) * -1);-webkit-margin-before:calc(var(--row-gap-y) * -1);margin-block-start:calc(var(--row-gap-y) * -1);-webkit-margin-end:calc(var(--row-gap-x) * -1);margin-inline-end:calc(var(--row-gap-x) * -1);-webkit-margin-start:calc(var(--row-gap-x) * -1);margin-inline-start:calc(var(--row-gap-x) * -1)}@layer layout{.pds-row>*{-webkit-padding-after:calc(var(--row-gap-y));padding-block-end:calc(var(--row-gap-y));-webkit-padding-before:calc(var(--row-gap-y));padding-block-start:calc(var(--row-gap-y));-webkit-padding-end:calc(var(--row-gap-x));padding-inline-end:calc(var(--row-gap-x));-webkit-padding-start:calc(var(--row-gap-x));padding-inline-start:calc(var(--row-gap-x))}}.pds-row--no-wrap{-ms-flex-wrap:nowrap;flex-wrap:nowrap}.pds-row--border{border:var(--pine-border)}.pds-justify-content-start{-ms-flex-pack:start;justify-content:start}.pds-justify-content-center{-ms-flex-pack:center;justify-content:center}.pds-justify-content-end{-ms-flex-pack:end;justify-content:end}.pds-justify-content-space-between{-ms-flex-pack:justify;justify-content:space-between}.pds-justify-content-space-around{-ms-flex-pack:distribute;justify-content:space-around}.pds-justify-content-space-evenly{-ms-flex-pack:space-evenly;justify-content:space-evenly}.pds-align-items-start{-ms-flex-align:start;align-items:start}.pds-align-items-center{-ms-flex-align:center;align-items:center}.pds-align-items-end{-ms-flex-align:end;align-items:end}.pds-align-items-stretch{-ms-flex-align:stretch;align-items:stretch}.pds-align-items-baseline{-ms-flex-align:baseline;align-items:baseline}"}},[0,"pds-row",{alignItems:[1,"align-items"],border:[4],colGap:[1,"col-gap"],colGapBlock:[1,"col-gap-block"],colGapInline:[1,"col-gap-inline"],componentId:[1,"component-id"],justifyContent:[1,"justify-content"],minHeight:[1,"min-height"],noWrap:[4,"no-wrap"]}]),o=r,c=function(){"undefined"!=typeof customElements&&["pds-row"].forEach((e=>{"pds-row"===e&&(customElements.get(t(e))||customElements.define(t(e),r))}))};export{o as PdsRow,c as defineCustomElement}

package/components/pds-select.js

@@ -1 +1 @@
-import{proxyCustomElement as e,HTMLElement as s,createEvent as i,h as t,Host as r,transformTag as a}from"@stencil/core/internal/client";import{H as o}from"./attributes.js";import{e as n,m as l,i as d,a as c}from"./form.js";import{h as p,g as h}from"./index2.js";import{d as b}from"./pds-icon2.js";const m=e(class extends s{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.pdsSelectChange=i(this,"pdsSelectChange",7),this.pdsBlur=i(this,"pdsBlur",7),this.pdsFocus=i(this,"pdsFocus",7),this.pdsKeyDown=i(this,"pdsKeyDown",7),this._type="select-one",this.hostKeeper=new o,this.disabled=!1,this.multiple=!1,this.required=!1,this.onSelectUpdate=e=>{const s=Array.from(e.target.options).filter((e=>e.selected)).map((e=>e.value));this.value=1!==s.length||this.multiple?s:s[0],this.pdsSelectChange.emit(e)},this.onBlur=e=>{this.pdsBlur.emit(e)},this.onFocus=e=>{this.pdsFocus.emit(e)},this.onKeyDown=e=>{this.pdsKeyDown.emit(e)},this.handleSlotChange=()=>{const e=this.slotContainer.querySelector("slot");this.selectEl.innerHTML="",e.assignedElements({flatten:!0}).forEach((e=>{if(["OPTION","OPTGROUP"].includes(e.tagName)){const s=e.cloneNode(!0);"OPTION"===s.tagName&&s.value===this.value&&(s.selected=!0),this.selectEl.appendChild(s)}})),this.updateSelectedOption()}}valueChanged(){this.updateSelectedOption(),this.updateFormValue()}multipleChanged(){this.updateType()}updateType(){this._type=this.multiple?"select-multiple":"select-one"}connectedCallback(){this.hostKeeper.connect(this.el),this.el.attachInternals&&!this.internals&&(this.internals=this.el.attachInternals()),n(this.el,(()=>this._type))}disconnectedCallback(){this.hostKeeper.disconnect()}componentWillLoad(){this.updateType(),this.updateSelectedOption()}componentDidLoad(){this.updateFormValue()}updateSelectedOption(){this.selectEl&&Array.from(this.selectEl.options).map((e=>{e.selected=Array.isArray(this.value)?this.value.includes(e.value):this.value===e.value}))}getHelperMessage(){return this.helperMessage&&t("p",{class:"pds-select__helper-message",id:l(this.componentId,"helper")},this.helperMessage)}getErrorMessage(){return this.errorMessage&&t("p",{class:"pds-select__error-message",id:l(this.componentId,"error"),"aria-live":"assertive"},t("pds-icon",{"aria-hidden":"true",icon:p,size:"small"}),this.errorMessage)}renderMessages(){return this.helperMessage||this.errorMessage?t("div",{class:"pds-select__message"},this.getHelperMessage(),this.getErrorMessage()):null}isInvalid(){return!!this.invalid||!!this.errorMessage}classNames(){const e=[];return this.invalid&&e.push("is-invalid"),this.disabled&&e.push("is-disabled"),e.join("  ")}renderAction(){return null!==this.el.querySelector('[slot="action"]')?t("div",{class:"pds-select__action",part:"action"},t("slot",{name:"action"})):null}updateFormValue(){if(!d()&&this.internals&&this.internals.setFormValue){const e=this.value;if(Array.isArray(e))if(e.length>1){const s=new FormData;e.forEach((e=>s.append(this.name||"",e))),this.internals.setFormValue(s)}else this.internals.setFormValue(e[0]||null);else this.internals.setFormValue(e||null);this.selectEl&&this.internals&&this.internals.setValidity&&this.internals.setValidity(this.selectEl.validity,this.selectEl.validationMessage,this.selectEl)}}formResetCallback(){this.value="",this.updateFormValue()}formDisabledCallback(e){this.disabled=e}formStateRestoreCallback(e){if("string"==typeof e)this.value=e;else if(e instanceof FormData&&this.name){const s=e.getAll(this.name);s.length>1?this.value=s.filter((e=>"string"==typeof e)):1===s.length&&"string"==typeof s[0]&&(this.value=s[0])}}render(){const e=null!==this.el.querySelector('[slot="action"]'),s=this.classNames(),i={"aria-disabled":this.disabled?"true":null,"has-action":e&&!this.hideLabel?"true":null};return this.hostKeeper.record(s,{},i),t(r,Object.assign({key:"343ed671e67dd1d6f9eb284b07e06d59877c64e9",class:s},i),t("div",{key:"650aed0869b02f658feb16ee99f17e1cd22e5a8e",class:"pds-select"},!this.hideLabel&&t("div",{key:"74739461acbea33c92279ec8ec9042d6af1773c1",class:"pds-select__label-wrapper"},t("label",{key:"1ad96ffd243000358edfbd79054ee770e1ba97d3",htmlFor:this.componentId},t("span",{key:"b832868db4f9cd4fd2f8313054d2e96e106189ab",class:this.hideLabel?"visually-hidden":""},this.label)),e&&this.renderAction()),t("select",{key:"e83c1a1a0a5646fc8abf9e50bc374f52b56be773","aria-describedby":c(this.componentId,this.isInvalid(),this.helperMessage,this.errorMessage),"aria-invalid":this.isInvalid()?"true":void 0,"aria-label":this.hideLabel?this.label:void 0,autocomplete:this.autocomplete||void 0,class:"pds-select__field",disabled:this.disabled,id:this.componentId,multiple:this.multiple,name:this.name,onBlur:this.onBlur,onChange:this.onSelectUpdate,onFocus:this.onFocus,onKeyDown:this.onKeyDown,part:"select",required:this.required,ref:e=>this.selectEl=e}),t("div",{key:"a34880120b88124b5122350856d023368f96abf7","aria-hidden":"true",class:"hidden",ref:e=>this.slotContainer=e},t("slot",{key:"df6abaf6a630761a32b263813181ff3453757e0d",onSlotchange:this.handleSlotChange})),this.renderMessages(),!this.multiple&&t("pds-icon",{key:"f9197284ef9965d693242a652b583f48bc3d7097","aria-hidden":"true",class:"pds-select__select-icon",icon:h})))}static get formAssociated(){return!0}get el(){return this}static get watchers(){return{value:[{valueChanged:0}],multiple:[{multipleChanged:0}]}}static get style(){return':host{--pine-select-color-background-danger:var(--pine-color-red-050)}:host{display:inline-block}:host([aria-disabled=true]) label{color:var(--pine-color-text-label-disabled)}:host([aria-readonly=true]) label{color:var(--pine-color-text-label-readonly)}label{color:var(--pine-color-text-label);font:var(--pine-typography-body-medium);letter-spacing:var(--pine-letter-spacing)}:host{--pds-select-background:var(--pine-color-background-container);--pds-select-border:var(--pine-border);--pds-select-border-radius:var(--pine-dimension-125);--pds-select-border-radius-start-end:var(--pine-dimension-125);--pds-select-border-radius-start-start:var(--pine-dimension-125);--pds-select-border-radius-end-end:var(--pine-dimension-125);--pds-select-border-radius-end-start:var(--pine-dimension-125);--pds-select-min-height:36px;--box-shadow-focus:0 0 0 1px var(--pine-color-background-container), 0 0 0 3px var(--pine-color-focus-ring);--box-shadow-focus-error:0 0 0 1px var(--pine-color-background-container), 0 0 0 3px var(--pine-color-focus-ring-danger)}:host .hidden,:host :host([hidden]){display:none}.pds-select{color:var(--pine-color-text);display:grid;-ms-flex-direction:column;flex-direction:column;grid-template-areas:"label label" "field field" "message message";grid-template-columns:1fr minmax(2rem, -webkit-min-content);grid-template-columns:1fr minmax(2rem, min-content);grid-template-rows:-webkit-min-content -webkit-min-content -webkit-min-content;grid-template-rows:min-content min-content min-content;position:relative;width:100%}.pds-select__label-wrapper{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;grid-area:label;-ms-flex-pack:justify;justify-content:space-between;-webkit-margin-after:var(--pine-dimension-2xs);margin-block-end:var(--pine-dimension-2xs)}.pds-select__action{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;gap:var(--pine-dimension-xs);-webkit-margin-start:var(--pine-dimension-xs);margin-inline-start:var(--pine-dimension-xs)}label{-webkit-margin-after:var(--pine-dimension-2xs);margin-block-end:var(--pine-dimension-2xs)}.pds-select__label-wrapper label{-webkit-margin-after:0;margin-block-end:0}select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:var(--pds-select-background);border:var(--pds-select-border);border-end-end-radius:var(--pds-select-border-radius-end-end, var(--pds-select-border-radius));border-end-start-radius:var(--pds-select-border-radius-end-start, var(--pds-select-border-radius));border-start-end-radius:var(--pds-select-border-radius-start-end, var(--pds-select-border-radius));border-start-start-radius:var(--pds-select-border-radius-start-start, var(--pds-select-border-radius));color:var(--pine-color-text);font:var(--pine-typography-body);grid-area:field;letter-spacing:var(--pine-letter-spacing);min-height:var(--pds-select-min-height);padding:calc(var(--pine-dimension-xs) - var(--pine-border-width)) var(--pine-dimension-150);-webkit-padding-end:var(--pine-dimension-450);padding-inline-end:var(--pine-dimension-450);position:relative}select:hover{border-color:var(--pine-color-border-hover);cursor:pointer}select:focus-visible{border-color:var(--pine-color-border-active);outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width)}select:disabled{background-color:var(--pine-color-background-container-disabled);border-color:var(--pine-color-border-disabled);color:var(--pine-color-text-disabled);cursor:not-allowed}select:has(~.pds-select__message .pds-select__error-message){background-color:var(--pine-select-color-background-danger);border-color:var(--pine-color-border-danger)}:host-context([data-theme=dark]) select:has(~.pds-select__message .pds-select__error-message){background-color:var(--pine-color-red-950)}select:has(~.pds-select__message .pds-select__error-message):focus-visible{outline-color:var(--pine-color-focus-ring-danger)}:host(.is-disabled) .pds-select__select-icon{color:var(--pine-color-text-disabled)}:host(.is-invalid) select{background-color:var(--pine-select-color-background-danger);border-color:var(--pine-color-border-danger)}:host-context([data-theme=dark]) :host(.is-invalid) select{background-color:var(--pine-color-red-950)}:host(.is-invalid) select:focus-visible{outline-color:var(--pine-color-focus-ring-danger)}:host([highlight]:not(.is-disabled):not(.is-invalid)) select{background-color:var(--pine-color-accent-disabled);border-color:var(--pine-color-accent);color:var(--pine-color-text-accent)}:host([highlight]:not(.is-disabled):not(.is-invalid)) select:hover:not(:disabled){border-color:var(--pine-color-accent-hover)}:host([highlight]:not(.is-disabled):not(.is-invalid)) select:focus-visible{outline-color:var(--pine-color-focus-ring)}:host([highlight]:not(.is-disabled):not(.is-invalid)) .pds-select__select-icon{color:var(--pine-color-text-accent)}.pds-select__error-message,.pds-select__helper-message{color:var(--pine-color-text-message);font:var(--pine-typography-body-sm-medium);-webkit-margin-after:0;margin-block-end:0;-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs)}.pds-select__error-message{color:var(--pine-color-text-message-danger);display:-ms-flexbox;display:flex;gap:var(--pine-dimension-2xs)}.pds-select__error-message pds-icon{-webkit-margin-before:var(--pine-dimension-025);margin-block-start:var(--pine-dimension-025)}.pds-select__message{grid-area:message}.pds-select__select-icon{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;grid-column:-1/-2;grid-row:2/3;height:var(--pds-select-min-height);pointer-events:none;position:relative;z-index:calc(var(--pine-z-index-raised) - 1)}.visually-hidden{border:0;clip:rect(0 0 0 0);-webkit-clip-path:polygon(0 0, 0 0, 0 0);clip-path:polygon(0 0, 0 0, 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}'}},[321,"pds-select",{autocomplete:[1],componentId:[1,"component-id"],disabled:[4],errorMessage:[1,"error-message"],hideLabel:[4,"hide-label"],helperMessage:[1,"helper-message"],invalid:[4],label:[1],multiple:[4],name:[1],required:[4],highlight:[516],value:[1025]},void 0,{value:[{valueChanged:0}],multiple:[{multipleChanged:0}]}]),g=m,u=function(){"undefined"!=typeof customElements&&["pds-select","pds-icon"].forEach((e=>{switch(e){case"pds-select":customElements.get(a(e))||customElements.define(a(e),m);break;case"pds-icon":customElements.get(a(e))||b()}}))};export{g as PdsSelect,u as defineCustomElement}
+import{proxyCustomElement as e,HTMLElement as s,createEvent as i,h as t,Host as r,transformTag as a}from"@stencil/core/internal/client";import{H as o}from"./attributes.js";import{e as n,m as l,i as d,a as c}from"./form.js";import{h,g as p}from"./index2.js";import{d as b}from"./pds-icon2.js";const m=e=>e.map((e=>e.tagName+("OPTGROUP"===e.tagName?`(${m(Array.from(e.children))})`:""))).join(),u=(e,s)=>{Array.from(e.attributes).forEach((({name:i})=>{s.hasAttribute(i)||e.removeAttribute(i)})),Array.from(s.attributes).forEach((({name:s,value:i})=>{e.getAttribute(s)!==i&&e.setAttribute(s,i)})),"OPTGROUP"===s.tagName?Array.from(s.children).forEach(((s,i)=>u(e.children[i],s))):e.textContent!==s.textContent&&(e.textContent=s.textContent)},g=e(class extends s{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.pdsSelectChange=i(this,"pdsSelectChange",7),this.pdsBlur=i(this,"pdsBlur",7),this.pdsFocus=i(this,"pdsFocus",7),this.pdsKeyDown=i(this,"pdsKeyDown",7),this._type="select-one",this.optionObserver=null,this.optionSyncFrame=null,this.hasHadOptions=!1,this.hostKeeper=new o,this.disabled=!1,this.multiple=!1,this.required=!1,this.touchesOption=({target:e})=>{const s=e.nodeType===Node.ELEMENT_NODE?e:e.parentElement;return e!==this.el&&null!=(null==s?void 0:s.closest("option, optgroup"))},this.onSelectUpdate=e=>{const s=Array.from(e.target.options).filter((e=>e.selected)).map((e=>e.value));this.value=1!==s.length||this.multiple?s:s[0],this.pdsSelectChange.emit(e)},this.onBlur=e=>{this.pdsBlur.emit(e)},this.onFocus=e=>{this.pdsFocus.emit(e)},this.onKeyDown=e=>{this.pdsKeyDown.emit(e)},this.handleSlotChange=()=>{var e;const s=null===(e=this.slotContainer)||void 0===e?void 0:e.querySelector("slot");if(null==s||void 0===this.selectEl)return;const i=s.assignedElements({flatten:!0}).filter((e=>["OPTION","OPTGROUP"].includes(e.tagName))).map((e=>e.cloneNode(!0))),t=Array.from(this.selectEl.children),r=this.hasHadOptions;i.length>0&&(this.hasHadOptions=!0);const a=e=>e.map((e=>e.outerHTML)).join("");a(i)!==a(t)&&(m(i)===m(t)?i.forEach(((e,s)=>u(t[s],e))):(this.selectEl.innerHTML="",i.forEach((e=>this.selectEl.appendChild(e)))),this.updateSelectedOption(),r&&this.showNoSelectionWithoutMatch(),this.updateFormValue())}}valueChanged(){this.updateSelectedOption(),this.updateFormValue()}multipleChanged(){this.updateType()}updateType(){this._type=this.multiple?"select-multiple":"select-one"}connectedCallback(){this.hostKeeper.connect(this.el),this.el.attachInternals&&!this.internals&&(this.internals=this.el.attachInternals()),n(this.el,(()=>this._type)),void 0!==this.selectEl&&(this.startOptionSync(),this.scheduleOptionSync())}disconnectedCallback(){this.hostKeeper.disconnect(),this.stopOptionSync()}componentWillLoad(){this.updateType(),this.updateSelectedOption()}componentDidLoad(){this.updateFormValue(),this.startOptionSync(),this.scheduleOptionSync()}startOptionSync(){null===this.optionObserver&&"undefined"!=typeof MutationObserver&&this.el.isConnected&&(this.optionObserver=new MutationObserver((e=>{e.some(this.touchesOption)&&this.scheduleOptionSync()})),this.optionObserver.observe(this.el,{childList:!0,subtree:!0,attributes:!0,characterData:!0}))}scheduleOptionSync(){null===this.optionSyncFrame&&(this.optionSyncFrame=requestAnimationFrame((()=>{this.optionSyncFrame=null,this.handleSlotChange()})))}stopOptionSync(){var e;null===(e=this.optionObserver)||void 0===e||e.disconnect(),this.optionObserver=null,null!==this.optionSyncFrame&&(cancelAnimationFrame(this.optionSyncFrame),this.optionSyncFrame=null)}updateSelectedOption(){this.selectEl&&Array.from(this.selectEl.options).map((e=>{e.selected=Array.isArray(this.value)?this.value.includes(e.value):this.value===e.value}))}showNoSelectionWithoutMatch(){var e;const s=[].concat(null!==(e=this.value)&&void 0!==e?e:[]).filter((e=>""!==e)),i=Array.from(this.selectEl.options);s.length>0&&!i.some((e=>s.includes(e.value)))&&(this.selectEl.selectedIndex=-1)}getHelperMessage(){return this.helperMessage&&t("p",{class:"pds-select__helper-message",id:l(this.componentId,"helper")},this.helperMessage)}getErrorMessage(){return this.errorMessage&&t("p",{class:"pds-select__error-message",id:l(this.componentId,"error"),"aria-live":"assertive"},t("pds-icon",{"aria-hidden":"true",icon:h,size:"small"}),this.errorMessage)}renderMessages(){return this.helperMessage||this.errorMessage?t("div",{class:"pds-select__message"},this.getHelperMessage(),this.getErrorMessage()):null}isInvalid(){return!!this.invalid||!!this.errorMessage}classNames(){const e=[];return this.invalid&&e.push("is-invalid"),this.disabled&&e.push("is-disabled"),e.join("  ")}renderAction(){return null!==this.el.querySelector('[slot="action"]')?t("div",{class:"pds-select__action",part:"action"},t("slot",{name:"action"})):null}updateFormValue(){if(!d()&&this.internals&&this.internals.setFormValue){const e=this.value;if(Array.isArray(e))if(e.length>1){const s=new FormData;e.forEach((e=>s.append(this.name||"",e))),this.internals.setFormValue(s)}else this.internals.setFormValue(e[0]||null);else this.internals.setFormValue(e||null);this.selectEl&&this.internals&&this.internals.setValidity&&this.internals.setValidity(this.selectEl.validity,this.selectEl.validationMessage,this.selectEl)}}formResetCallback(){this.value="",this.updateFormValue()}formDisabledCallback(e){this.disabled=e}formStateRestoreCallback(e){if("string"==typeof e)this.value=e;else if(e instanceof FormData&&this.name){const s=e.getAll(this.name);s.length>1?this.value=s.filter((e=>"string"==typeof e)):1===s.length&&"string"==typeof s[0]&&(this.value=s[0])}}render(){const e=null!==this.el.querySelector('[slot="action"]'),s=this.classNames(),i={"aria-disabled":this.disabled?"true":null,"has-action":e&&!this.hideLabel?"true":null};return this.hostKeeper.record(s,{},i),t(r,Object.assign({key:"37c2c3b72c13c3c4e3d81da29ddddc86a7300d70",class:s},i),t("div",{key:"ff1c311dca6fc25813e5473d0e8daff4dc12e807",class:"pds-select"},!this.hideLabel&&t("div",{key:"77db17b0beb1fefabb26ffe1df0e5f03a0515996",class:"pds-select__label-wrapper"},t("label",{key:"c4dcba3bc148aada4a3afcca0a30c64a630e441f",htmlFor:this.componentId},t("span",{key:"0fc3424ec1961d3b216c0fabb80cb8acee37f1a2",class:this.hideLabel?"visually-hidden":""},this.label)),e&&this.renderAction()),t("select",{key:"ff343a6653ccd081021cb669a428c780d0162e8b","aria-describedby":c(this.componentId,this.isInvalid(),this.helperMessage,this.errorMessage),"aria-invalid":this.isInvalid()?"true":void 0,"aria-label":this.hideLabel?this.label:void 0,autocomplete:this.autocomplete||void 0,class:"pds-select__field",disabled:this.disabled,id:this.componentId,multiple:this.multiple,name:this.name,onBlur:this.onBlur,onChange:this.onSelectUpdate,onFocus:this.onFocus,onKeyDown:this.onKeyDown,part:"select",required:this.required,ref:e=>this.selectEl=e}),t("div",{key:"86fed1916c3b13d079492581a7c6bb621012a4a5","aria-hidden":"true",class:"hidden",ref:e=>this.slotContainer=e},t("slot",{key:"abe06eeef5be13b716573c8a806d6b7795edc65f",onSlotchange:this.handleSlotChange})),this.renderMessages(),!this.multiple&&t("pds-icon",{key:"68c958666828f77114f2edeedb667070106046fa","aria-hidden":"true",class:"pds-select__select-icon",icon:p})))}static get formAssociated(){return!0}get el(){return this}static get watchers(){return{value:[{valueChanged:0}],multiple:[{multipleChanged:0}]}}static get style(){return':host{--pine-select-color-background-danger:var(--pine-color-red-050)}:host{display:inline-block}:host([aria-disabled=true]) label{color:var(--pine-color-text-label-disabled)}:host([aria-readonly=true]) label{color:var(--pine-color-text-label-readonly)}label{color:var(--pine-color-text-label);font:var(--pine-typography-body-medium);letter-spacing:var(--pine-letter-spacing)}:host{--pds-select-background:var(--pine-color-background-container);--pds-select-border:var(--pine-border);--pds-select-border-radius:var(--pine-dimension-125);--pds-select-border-radius-start-end:var(--pine-dimension-125);--pds-select-border-radius-start-start:var(--pine-dimension-125);--pds-select-border-radius-end-end:var(--pine-dimension-125);--pds-select-border-radius-end-start:var(--pine-dimension-125);--pds-select-min-height:36px;--box-shadow-focus:0 0 0 1px var(--pine-color-background-container), 0 0 0 3px var(--pine-color-focus-ring);--box-shadow-focus-error:0 0 0 1px var(--pine-color-background-container), 0 0 0 3px var(--pine-color-focus-ring-danger)}:host .hidden,:host :host([hidden]){display:none}.pds-select{color:var(--pine-color-text);display:grid;-ms-flex-direction:column;flex-direction:column;grid-template-areas:"label label" "field field" "message message";grid-template-columns:1fr minmax(2rem, -webkit-min-content);grid-template-columns:1fr minmax(2rem, min-content);grid-template-rows:-webkit-min-content -webkit-min-content -webkit-min-content;grid-template-rows:min-content min-content min-content;position:relative;width:100%}.pds-select__label-wrapper{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;grid-area:label;-ms-flex-pack:justify;justify-content:space-between;-webkit-margin-after:var(--pine-dimension-2xs);margin-block-end:var(--pine-dimension-2xs)}.pds-select__action{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;gap:var(--pine-dimension-xs);-webkit-margin-start:var(--pine-dimension-xs);margin-inline-start:var(--pine-dimension-xs)}label{-webkit-margin-after:var(--pine-dimension-2xs);margin-block-end:var(--pine-dimension-2xs)}.pds-select__label-wrapper label{-webkit-margin-after:0;margin-block-end:0}select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:var(--pds-select-background);border:var(--pds-select-border);border-end-end-radius:var(--pds-select-border-radius-end-end, var(--pds-select-border-radius));border-end-start-radius:var(--pds-select-border-radius-end-start, var(--pds-select-border-radius));border-start-end-radius:var(--pds-select-border-radius-start-end, var(--pds-select-border-radius));border-start-start-radius:var(--pds-select-border-radius-start-start, var(--pds-select-border-radius));color:var(--pine-color-text);font:var(--pine-typography-body);grid-area:field;letter-spacing:var(--pine-letter-spacing);min-height:var(--pds-select-min-height);padding:calc(var(--pine-dimension-xs) - var(--pine-border-width)) var(--pine-dimension-150);-webkit-padding-end:var(--pine-dimension-450);padding-inline-end:var(--pine-dimension-450);position:relative}select:hover{border-color:var(--pine-color-border-hover);cursor:pointer}select:focus-visible{border-color:var(--pine-color-border-active);outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width)}select:disabled{background-color:var(--pine-color-background-container-disabled);border-color:var(--pine-color-border-disabled);color:var(--pine-color-text-disabled);cursor:not-allowed}select:has(~.pds-select__message .pds-select__error-message){background-color:var(--pine-select-color-background-danger);border-color:var(--pine-color-border-danger)}:host-context([data-theme=dark]) select:has(~.pds-select__message .pds-select__error-message){background-color:var(--pine-color-red-950)}select:has(~.pds-select__message .pds-select__error-message):focus-visible{outline-color:var(--pine-color-focus-ring-danger)}:host(.is-disabled) .pds-select__select-icon{color:var(--pine-color-text-disabled)}:host(.is-invalid) select{background-color:var(--pine-select-color-background-danger);border-color:var(--pine-color-border-danger)}:host-context([data-theme=dark]) :host(.is-invalid) select{background-color:var(--pine-color-red-950)}:host(.is-invalid) select:focus-visible{outline-color:var(--pine-color-focus-ring-danger)}:host([highlight]:not(.is-disabled):not(.is-invalid)) select{background-color:var(--pine-color-accent-disabled);border-color:var(--pine-color-accent);color:var(--pine-color-text-accent)}:host([highlight]:not(.is-disabled):not(.is-invalid)) select:hover:not(:disabled){border-color:var(--pine-color-accent-hover)}:host([highlight]:not(.is-disabled):not(.is-invalid)) select:focus-visible{outline-color:var(--pine-color-focus-ring)}:host([highlight]:not(.is-disabled):not(.is-invalid)) .pds-select__select-icon{color:var(--pine-color-text-accent)}.pds-select__error-message,.pds-select__helper-message{color:var(--pine-color-text-message);font:var(--pine-typography-body-sm-medium);-webkit-margin-after:0;margin-block-end:0;-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs)}.pds-select__error-message{color:var(--pine-color-text-message-danger);display:-ms-flexbox;display:flex;gap:var(--pine-dimension-2xs)}.pds-select__error-message pds-icon{-webkit-margin-before:var(--pine-dimension-025);margin-block-start:var(--pine-dimension-025)}.pds-select__message{grid-area:message}.pds-select__select-icon{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;grid-column:-1/-2;grid-row:2/3;height:var(--pds-select-min-height);pointer-events:none;position:relative;z-index:calc(var(--pine-z-index-raised) - 1)}.visually-hidden{border:0;clip:rect(0 0 0 0);-webkit-clip-path:polygon(0 0, 0 0, 0 0);clip-path:polygon(0 0, 0 0, 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}'}},[321,"pds-select",{autocomplete:[1],componentId:[1,"component-id"],disabled:[4],errorMessage:[1,"error-message"],hideLabel:[4,"hide-label"],helperMessage:[1,"helper-message"],invalid:[4],label:[1],multiple:[4],name:[1],required:[4],highlight:[516],value:[1025]},void 0,{value:[{valueChanged:0}],multiple:[{multipleChanged:0}]}]),v=g,f=function(){"undefined"!=typeof customElements&&["pds-select","pds-icon"].forEach((e=>{switch(e){case"pds-select":customElements.get(a(e))||customElements.define(a(e),g);break;case"pds-icon":customElements.get(a(e))||b()}}))};export{v as PdsSelect,f as defineCustomElement}

package/components/pds-sortable-item.js

@@ -1 +1 @@
-import{proxyCustomElement as e,HTMLElement as s,h as t,Host as r,transformTag as a}from"@stencil/core/internal/client";import{H as i}from"./attributes.js";import{i as o}from"./index2.js";import{d}from"./pds-icon2.js";const n=e(class extends s{constructor(e){super(),!1!==e&&this.__registerHost(),this.hostKeeper=new i,this.enableActions=!1,this.showHandle=!1}connectedCallback(){this.hostKeeper.connect(this.el)}disconnectedCallback(){this.hostKeeper.disconnect()}componentDidRender(){Array.from(this.el.children).filter((e=>e.matches(".pds-sortable-item__handle"))).slice(1).forEach((e=>e.remove()));const e=Array.from(this.el.children).filter((e=>e.matches(".pds-sortable-item__actions"))),s=e[e.length-1];e.slice(0,-1).forEach((e=>{void 0!==s&&Array.from(e.children).forEach((e=>s.appendChild(e))),e.remove()}))}componentWillRender(){this.sortableRef=this.el.closest("pds-sortable"),this.sortableRef&&"handle"===this.sortableRef.handleType&&(this.showHandle=!0)}render(){return this.hostKeeper.record("pds-sortable-item"),t(r,{key:"2065ccb474ae4b7032edc3c37aa6855f3048909d",class:"pds-sortable-item",id:this.componentId},this.showHandle&&t("div",{key:"32385cc94837a3d0bc1c496615135c79274afe35",class:"pds-sortable-item__handle"},t("pds-icon",{key:"ea94e28b2867aa20622ca073dc31d3b4a11eebbb","aria-hidden":"true",icon:o})),t("slot",{key:"fb18aa90be0b8fa3832a5dd2b02a7b571205341f"}),this.enableActions&&t("div",{key:"4c6e59d77a7b2183552533a544f4a70ce0cc7011",class:"pds-sortable-item__actions"},t("slot",{key:"497b1ff88436175d9365a28032e109b6fa118e44",name:"sortable-item-actions"})))}get el(){return this}static get style(){return".pds-sortable-item.sc-pds-sortable-item-h{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;padding-block:var(--pine-dimension-xs);padding-inline:var(--pine-dimension-md)}.pds-sortable-item.sc-pds-sortable-item-h .pds-sortable-item__actions.sc-pds-sortable-item{-webkit-margin-start:auto;margin-inline-start:auto;-webkit-padding-start:var(--pine-dimension-md);padding-inline-start:var(--pine-dimension-md)}.pds-sortable-item.sc-pds-sortable-item-h .pds-sortable-item__handle.sc-pds-sortable-item{line-height:1;-webkit-margin-end:var(--pine-dimension-md);margin-inline-end:var(--pine-dimension-md)}.pds-sortable--bordered .pds-sortable-item.sc-pds-sortable-item-h:first-child{border-start-end-radius:calc(var(--pine-dimension-xs) * 1.25);border-start-start-radius:calc(var(--pine-dimension-xs) * 1.25)}.pds-sortable--bordered .pds-sortable-item.sc-pds-sortable-item-h:last-child{border-end-end-radius:calc(var(--pine-dimension-xs) * 1.25);border-end-start-radius:calc(var(--pine-dimension-xs) * 1.25)}.pds-sortable--divided .pds-sortable-item.sc-pds-sortable-item-h{-webkit-border-after:var(--pine-border);border-block-end:var(--pine-border)}.pds-sortable--divided .pds-sortable-item.sc-pds-sortable-item-h:last-child{-webkit-border-after:0;border-block-end:0}.pds-sortable--handle-type-row .pds-sortable-item.sc-pds-sortable-item-h{cursor:-webkit-grab;cursor:grab}.pds-sortable--handle-type-handle .pds-sortable-item.sc-pds-sortable-item-h .pds-sortable-item__handle.sc-pds-sortable-item{cursor:-webkit-grab;cursor:grab}.pds-sortable--disabled .pds-sortable-item.sc-pds-sortable-item-h{cursor:not-allowed;opacity:0.5}.pds-sortable--disabled .pds-sortable-item.sc-pds-sortable-item-h .pds-sortable-item__handle.sc-pds-sortable-item{cursor:not-allowed}.pds-sortable--disabled .pds-sortable-item.sc-pds-sortable-item-h:hover{background-color:transparent}.pds-sortable:not(.pds-sortable--disabled) .pds-sortable-item.sc-pds-sortable-item-h:hover{background-color:var(--pine-color-background-container-hover)}.pds-sortable:not(.pds-sortable--disabled) .pds-sortable-item.sc-pds-sortable-item-h:hover pds-icon.sc-pds-sortable-item{color:var(--pine-color-info)}.pds-sortable-item--drag.sc-pds-sortable-item-h{background-color:var(--pine-color-background-container);border-radius:0;-webkit-box-shadow:var(--pine-box-shadow-400);box-shadow:var(--pine-box-shadow-400);opacity:1}.pds-sortable-item--ghost.sc-pds-sortable-item-h{background-color:var(--pine-color-background-container-hover);border-radius:0}"}},[262,"pds-sortable-item",{enableActions:[4,"enable-actions"],componentId:[1,"component-id"],showHandle:[1028,"show-handle"]}]),l=n,b=function(){"undefined"!=typeof customElements&&["pds-sortable-item","pds-icon"].forEach((e=>{switch(e){case"pds-sortable-item":customElements.get(a(e))||customElements.define(a(e),n);break;case"pds-icon":customElements.get(a(e))||d()}}))};export{l as PdsSortableItem,b as defineCustomElement}
+import{proxyCustomElement as e,HTMLElement as s,h as t,Host as r,transformTag as d}from"@stencil/core/internal/client";import{H as a}from"./attributes.js";import{i}from"./index2.js";import{d as o}from"./pds-icon2.js";const n=e(class extends s{constructor(e){super(),!1!==e&&this.__registerHost(),this.hostKeeper=new a,this.enableActions=!1,this.showHandle=!1}connectedCallback(){this.hostKeeper.connect(this.el)}disconnectedCallback(){this.hostKeeper.disconnect()}componentDidRender(){Array.from(this.el.children).filter((e=>e.matches(".pds-sortable-item__handle"))).slice(1).forEach((e=>e.remove()));const e=Array.from(this.el.children).filter((e=>e.matches(".pds-sortable-item__actions"))),s=e[e.length-1];e.slice(0,-1).forEach((e=>{void 0!==s&&Array.from(e.children).forEach((e=>s.appendChild(e))),e.remove()}))}componentWillRender(){this.sortableRef=this.el.closest("pds-sortable"),this.sortableRef&&"handle"===this.sortableRef.handleType&&(this.showHandle=!0)}render(){return this.hostKeeper.record("pds-sortable-item"),t(r,{key:"c6b5402a54179d4e7caed3cc81874977d2d6c677",class:"pds-sortable-item",id:this.componentId},this.showHandle&&t("div",{key:"cd2d85286bcb3e47f76e4571d609d91f932b717b",class:"pds-sortable-item__handle"},t("pds-icon",{key:"97e2e155283d86921f40198637abf596d6cc86e0","aria-hidden":"true",icon:i})),t("slot",{key:"99743c8e5be45ca76f276b47688843a621c8ded5"}),this.enableActions&&t("div",{key:"7cb1a8b99658d72067ccae036b2bc0276b8cf02e",class:"pds-sortable-item__actions"},t("slot",{key:"f9b3b7d1cc10ac077f65ec2cafac7a372deae511",name:"sortable-item-actions"})))}get el(){return this}static get style(){return".pds-sortable-item.sc-pds-sortable-item-h{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;padding-block:var(--pine-dimension-xs);padding-inline:var(--pine-dimension-md)}.pds-sortable-item.sc-pds-sortable-item-h .pds-sortable-item__actions.sc-pds-sortable-item{-webkit-margin-start:auto;margin-inline-start:auto;-webkit-padding-start:var(--pine-dimension-md);padding-inline-start:var(--pine-dimension-md)}.pds-sortable-item.sc-pds-sortable-item-h .pds-sortable-item__handle.sc-pds-sortable-item{line-height:1;-webkit-margin-end:var(--pine-dimension-md);margin-inline-end:var(--pine-dimension-md)}.pds-sortable--bordered .pds-sortable-item.sc-pds-sortable-item-h:first-child{border-start-end-radius:calc(var(--pine-dimension-xs) * 1.25);border-start-start-radius:calc(var(--pine-dimension-xs) * 1.25)}.pds-sortable--bordered .pds-sortable-item.sc-pds-sortable-item-h:last-child{border-end-end-radius:calc(var(--pine-dimension-xs) * 1.25);border-end-start-radius:calc(var(--pine-dimension-xs) * 1.25)}.pds-sortable--divided .pds-sortable-item.sc-pds-sortable-item-h{-webkit-border-after:var(--pine-border);border-block-end:var(--pine-border)}.pds-sortable--divided .pds-sortable-item.sc-pds-sortable-item-h:last-child{-webkit-border-after:0;border-block-end:0}.pds-sortable--handle-type-row .pds-sortable-item.sc-pds-sortable-item-h{cursor:-webkit-grab;cursor:grab}.pds-sortable--handle-type-handle .pds-sortable-item.sc-pds-sortable-item-h .pds-sortable-item__handle.sc-pds-sortable-item{cursor:-webkit-grab;cursor:grab}.pds-sortable--disabled .pds-sortable-item.sc-pds-sortable-item-h{cursor:not-allowed;opacity:0.5}.pds-sortable--disabled .pds-sortable-item.sc-pds-sortable-item-h .pds-sortable-item__handle.sc-pds-sortable-item{cursor:not-allowed}.pds-sortable--disabled .pds-sortable-item.sc-pds-sortable-item-h:hover{background-color:transparent}.pds-sortable:not(.pds-sortable--disabled) .pds-sortable-item.sc-pds-sortable-item-h:hover{background-color:var(--pine-color-background-container-hover)}.pds-sortable:not(.pds-sortable--disabled) .pds-sortable-item.sc-pds-sortable-item-h:hover pds-icon.sc-pds-sortable-item{color:var(--pine-color-info)}.pds-sortable-item--drag.sc-pds-sortable-item-h{background-color:var(--pine-color-background-container);border-radius:0;-webkit-box-shadow:var(--pine-box-shadow-400);box-shadow:var(--pine-box-shadow-400);opacity:1}.pds-sortable-item--ghost.sc-pds-sortable-item-h{background-color:var(--pine-color-background-container-hover);border-radius:0}"}},[262,"pds-sortable-item",{enableActions:[4,"enable-actions"],componentId:[1,"component-id"],showHandle:[1028,"show-handle"]}]),l=n,b=function(){"undefined"!=typeof customElements&&["pds-sortable-item","pds-icon"].forEach((e=>{switch(e){case"pds-sortable-item":customElements.get(d(e))||customElements.define(d(e),n);break;case"pds-icon":customElements.get(d(e))||o()}}))};export{l as PdsSortableItem,b as defineCustomElement}