@xplortech/apollo-core 1.0.0-beta.17 → 1.0.0-beta.18

package/dist/apollo-core/apollo-core.esm.js

@@ -1,2 +1,2 @@
-import{p as e,b as a}from"./p-e8953b60.js";export{s as setNonce}from"./p-e8953b60.js";const t=()=>{const a=import.meta.url;const t={};if(a!==""){t.resourcesUrl=new URL(".",a).href}return e(t)};t().then((e=>a([["p-db29ebe0",[[0,"xpl-select",{choices:[16],description:[1],disabled:[4],error:[1],label:[1],mode:[1],name:[1],placeholder:[1],truncate:[4],selectedValues:[1,"selected-values"],active:[32],id:[32],keepFocus:[32],selected:[32],value:[32],displayValue:[32],visibleChoices:[32]}]]],["p-5372bf3e",[[4,"xpl-application-shell",{withSubnav:[4,"with-subnav"],withUtility:[4,"with-utility"],navWidth:[1,"nav-width"],isNavOpenAtStartup:[4,"is-nav-open-at-startup"],navOpen:[32]},[[0,"navOpen","navToggleHandler"],[0,"navWidth","navWithHandler"],[9,"resize","onWindowResize"]]]]],["p-6797b2b7",[[4,"xpl-data-card",{link:[4],name:[1],stat:[1],shortStat:[1,"short-stat"],variant:[1],icon:[1]}],[4,"xpl-utility-bar",{navControl:[4,"nav-control"],isNavOpenAtStartup:[4,"is-nav-open-at-startup"],open:[32]}],[4,"xpl-breadcrumb-item"],[4,"xpl-breadcrumbs"],[4,"xpl-content-area",{size:[1]}],[4,"xpl-dashboard"],[4,"xpl-nav-item",{navControl:[4,"nav-control"]}],[4,"xpl-secondary-nav"],[0,"xpl-table",{columns:[16],data:[16],freeze:[4],multiselect:[4],striped:[4],selectedValues:[16],areAllSelected:[32],rowData:[32],hasScrolled:[32],selected:[32]}],[4,"xpl-avatar",{color:[1],disabled:[4],href:[1],name:[1],size:[1],src:[1],status:[1],target:[1]}],[4,"xpl-badge",{dot:[4],variant:[1]}],[4,"xpl-button",{disabled:[4],link:[4],iconOnly:[4,"icon-only"],fullWidth:[4,"full-width"],name:[1],size:[1],type:[1],value:[1],variant:[1],state:[1]}],[4,"xpl-checkbox",{checked:[4],description:[1],disabled:[4],indeterminate:[4],name:[1],required:[4],styled:[4],value:[1],id:[32]}],[4,"xpl-radio",{checked:[4],description:[1],disabled:[4],name:[1],required:[4],styled:[4],value:[1],id:[32]}],[0,"xpl-icon",{icon:[1],size:[2],backgroundColor:[1,"background-color"]}]]],["p-60d4d252",[[0,"xpl-list",{items:[16]}]]],["p-29f4679d",[[0,"xpl-choicelist",{choices:[16],description:[1],heading:[1],multi:[4],name:[1],styled:[4],selected:[32]}]]],["p-e215fc5f",[[0,"xpl-button-row",{primary:[1],secondary:[1],tertiary:[1]}]]],["p-bcb81e30",[[0,"xpl-input",{_id:[1],autocomplete:[1],dateFormat:[1,"date-format"],description:[1],disabled:[4],error:[1],label:[1],max:[8],maxCharacterCount:[2,"max-character-count"],min:[8],mode:[1],multiline:[4],name:[1],placeholder:[1],post:[1],pre:[1],readonly:[4],required:[4],step:[2],type:[1],value:[1],characterCount:[32],passwordVisible:[32]}]]],["p-807d8de9",[[4,"xpl-divider",{tier:[2]}]]],["p-efa8a79d",[[0,"xpl-grid"]]],["p-1fa46bc3",[[4,"xpl-grid-item",{xs:[2],sm:[2],md:[2],lg:[2]}]]],["p-3f3cc34e",[[4,"xpl-main-nav",{width:[1]}]]],["p-7a8e818a",[[0,"xpl-pagination",{total:[2],perPage:[2,"per-page"],waitForCallback:[4,"wait-for-callback"],current:[32],goto:[64]}]]],["p-5ceaec87",[[0,"xpl-toggle",{checked:[4],description:[1],disabled:[4],heading:[1],label:[1],name:[1],variant:[1],id:[32]}]]],["p-e0541e23",[[0,"xpl-backdrop",{relative:[4]}]]],["p-6acc4122",[[4,"xpl-dropdown-group",{groupName:[1,"label"],options:[16]}],[4,"xpl-dropdown-heading",{label:[1]}],[4,"xpl-dropdown-option",{isDisabled:[516,"disabled"],label:[1],value:[1],isSelected:[4,"selected"]}]]],["p-787bac91",[[4,"xpl-dropdown",{isOpen:[1540,"open"],closeOnSelect:[4,"close-on-select"],mode:[1],options:[16],selectOnFocus:[4,"select-on-focus"],triggerId:[1,"trigger-id"],update:[16],handleSelect:[64]}],[4,"xpl-tag"]]]],e)));
+import{p as e,b as a}from"./p-e8953b60.js";export{s as setNonce}from"./p-e8953b60.js";const t=()=>{const a=import.meta.url;const t={};if(a!==""){t.resourcesUrl=new URL(".",a).href}return e(t)};t().then((e=>a([["p-da5a8e74",[[0,"xpl-select",{choices:[16],description:[1],disabled:[4],error:[1],label:[1],mode:[1],name:[1],placeholder:[1],truncate:[4],selectedValues:[1,"selected-values"],active:[32],id:[32],keepFocus:[32],selected:[32],value:[32],displayValue:[32],visibleChoices:[32]}]]],["p-5372bf3e",[[4,"xpl-application-shell",{withSubnav:[4,"with-subnav"],withUtility:[4,"with-utility"],navWidth:[1,"nav-width"],isNavOpenAtStartup:[4,"is-nav-open-at-startup"],navOpen:[32]},[[0,"navOpen","navToggleHandler"],[0,"navWidth","navWithHandler"],[9,"resize","onWindowResize"]]]]],["p-6797b2b7",[[4,"xpl-data-card",{link:[4],name:[1],stat:[1],shortStat:[1,"short-stat"],variant:[1],icon:[1]}],[4,"xpl-utility-bar",{navControl:[4,"nav-control"],isNavOpenAtStartup:[4,"is-nav-open-at-startup"],open:[32]}],[4,"xpl-breadcrumb-item"],[4,"xpl-breadcrumbs"],[4,"xpl-content-area",{size:[1]}],[4,"xpl-dashboard"],[4,"xpl-nav-item",{navControl:[4,"nav-control"]}],[4,"xpl-secondary-nav"],[0,"xpl-table",{columns:[16],data:[16],freeze:[4],multiselect:[4],striped:[4],selectedValues:[16],areAllSelected:[32],rowData:[32],hasScrolled:[32],selected:[32]}],[4,"xpl-avatar",{color:[1],disabled:[4],href:[1],name:[1],size:[1],src:[1],status:[1],target:[1]}],[4,"xpl-badge",{dot:[4],variant:[1]}],[4,"xpl-button",{disabled:[4],link:[4],iconOnly:[4,"icon-only"],fullWidth:[4,"full-width"],name:[1],size:[1],type:[1],value:[1],variant:[1],state:[1]}],[4,"xpl-checkbox",{checked:[4],description:[1],disabled:[4],indeterminate:[4],name:[1],required:[4],styled:[4],value:[1],id:[32]}],[4,"xpl-radio",{checked:[4],description:[1],disabled:[4],name:[1],required:[4],styled:[4],value:[1],id:[32]}],[0,"xpl-icon",{icon:[1],size:[2],backgroundColor:[1,"background-color"]}]]],["p-60d4d252",[[0,"xpl-list",{items:[16]}]]],["p-29f4679d",[[0,"xpl-choicelist",{choices:[16],description:[1],heading:[1],multi:[4],name:[1],styled:[4],selected:[32]}]]],["p-e215fc5f",[[0,"xpl-button-row",{primary:[1],secondary:[1],tertiary:[1]}]]],["p-bcb81e30",[[0,"xpl-input",{_id:[1],autocomplete:[1],dateFormat:[1,"date-format"],description:[1],disabled:[4],error:[1],label:[1],max:[8],maxCharacterCount:[2,"max-character-count"],min:[8],mode:[1],multiline:[4],name:[1],placeholder:[1],post:[1],pre:[1],readonly:[4],required:[4],step:[2],type:[1],value:[1],characterCount:[32],passwordVisible:[32]}]]],["p-807d8de9",[[4,"xpl-divider",{tier:[2]}]]],["p-efa8a79d",[[0,"xpl-grid"]]],["p-1fa46bc3",[[4,"xpl-grid-item",{xs:[2],sm:[2],md:[2],lg:[2]}]]],["p-3f3cc34e",[[4,"xpl-main-nav",{width:[1]}]]],["p-7a8e818a",[[0,"xpl-pagination",{total:[2],perPage:[2,"per-page"],waitForCallback:[4,"wait-for-callback"],current:[32],goto:[64]}]]],["p-5ceaec87",[[0,"xpl-toggle",{checked:[4],description:[1],disabled:[4],heading:[1],label:[1],name:[1],variant:[1],id:[32]}]]],["p-e0541e23",[[0,"xpl-backdrop",{relative:[4]}]]],["p-6acc4122",[[4,"xpl-dropdown-group",{groupName:[1,"label"],options:[16]}],[4,"xpl-dropdown-heading",{label:[1]}],[4,"xpl-dropdown-option",{isDisabled:[516,"disabled"],label:[1],value:[1],isSelected:[4,"selected"]}]]],["p-787bac91",[[4,"xpl-dropdown",{isOpen:[1540,"open"],closeOnSelect:[4,"close-on-select"],mode:[1],options:[16],selectOnFocus:[4,"select-on-focus"],triggerId:[1,"trigger-id"],update:[16],handleSelect:[64]}],[4,"xpl-tag"]]]],e)));
 //# sourceMappingURL=apollo-core.esm.js.map

package/dist/apollo-core/p-da5a8e74.entry.js

@@ -0,0 +1,2 @@
+import{r as t,c as i,h as e,H as n}from"./p-e8953b60.js";import{v as s}from"./p-ad90fe4d.js";var r=typeof globalThis!=="undefined"?globalThis:typeof window!=="undefined"?window:typeof global!=="undefined"?global:typeof self!=="undefined"?self:{};var h="Expected a function";var o=0/0;var u="[object Symbol]";var l=/^\s+|\s+$/g;var a=/^[-+]0x[0-9a-f]+$/i;var f=/^0b[01]+$/i;var d=/^0o[0-7]+$/i;var c=parseInt;var p=typeof r=="object"&&r&&r.Object===Object&&r;var v=typeof self=="object"&&self&&self.Object===Object&&self;var b=p||v||Function("return this")();var g=Object.prototype;var m=g.toString;var y=Math.max,x=Math.min;var w=function(){return b.Date.now()};function C(t,i,e){var n,s,r,o,u,l,a=0,f=false,d=false,c=true;if(typeof t!="function"){throw new TypeError(h)}i=S(i)||0;if(j(e)){f=!!e.leading;d="maxWait"in e;r=d?y(S(e.maxWait)||0,i):r;c="trailing"in e?!!e.trailing:c}function p(i){var e=n,r=s;n=s=undefined;a=i;o=t.apply(r,e);return o}function v(t){a=t;u=setTimeout(m,i);return f?p(t):o}function b(t){var e=t-l,n=t-a,s=i-e;return d?x(s,r-n):s}function g(t){var e=t-l,n=t-a;return l===undefined||e>=i||e<0||d&&n>=r}function m(){var t=w();if(g(t)){return C(t)}u=setTimeout(m,b(t))}function C(t){u=undefined;if(c&&n){return p(t)}n=s=undefined;return o}function T(){if(u!==undefined){clearTimeout(u)}a=0;n=l=s=u=undefined}function I(){return u===undefined?o:C(w())}function M(){var t=w(),e=g(t);n=arguments;s=this;l=t;if(e){if(u===undefined){return v(l)}if(d){u=setTimeout(m,i);return p(l)}}if(u===undefined){u=setTimeout(m,i)}return o}M.cancel=T;M.flush=I;return M}function T(t,i,e){var n=true,s=true;if(typeof t!="function"){throw new TypeError(h)}if(j(e)){n="leading"in e?!!e.leading:n;s="trailing"in e?!!e.trailing:s}return C(t,i,{leading:n,maxWait:i,trailing:s})}function j(t){var i=typeof t;return!!t&&(i=="object"||i=="function")}function I(t){return!!t&&typeof t=="object"}function M(t){return typeof t=="symbol"||I(t)&&m.call(t)==u}function S(t){if(typeof t=="number"){return t}if(M(t)){return o}if(j(t)){var i=typeof t.valueOf=="function"?t.valueOf():t;t=j(i)?i+"":i}if(typeof t!="string"){return t===0?t:+t}t=t.replace(l,"");var e=f.test(t);return e||d.test(t)?c(t.slice(2),e?2:8):a.test(t)?o:+t}var $=T;function D(t){const i=document.createElement("canvas").getContext("2d");i.font="14px apple-system, system-ui, 'Segoe UI', Arial, Helvetica, Roboto, sans-serif";return i.measureText(t).width+44}const E=class{constructor(e){t(this,e);this.selectChange=i(this,"selectChange",7);this.choices=[];this.description=undefined;this.disabled=undefined;this.error=undefined;this.label=undefined;this.mode="single";this.name=undefined;this.placeholder=undefined;this.truncate=true;this.selectedValues=undefined;this.active=false;this.id=s();this.keepFocus=false;this.selected=undefined;this.value="";this.displayValue="";this.visibleChoices=Infinity}onChoicesChanged(t){this.update()}componentWillLoad(){this.selected=this.choices&&this.choices.length>0?this.choices.map((()=>false)):[];if(this.selectedValues){const t=this.mode==="single";if(t){const t=this.selectedValues;const i=this.choices.find((i=>(i.value!==undefined?i.value:i.label)===t));if(i!==undefined)i.isSelected=true}else{this.choices.forEach((({options:t})=>{t.forEach((t=>{const i=this.selectedValues.includes(t.value||t.label);if(i)t.isSelected=true}))}))}this.update()}window.addEventListener("click",(t=>{const i=t.target;const e=i.closest(".xpl-select");if(e===null||e!==this.container){this.active=false}}));window.addEventListener("resize",$((()=>{this.maybeTruncateChoices()}),250))}componentDidLoad(){this.dropdown=this.container.querySelector("xpl-dropdown")}maybeTruncateChoices(){if(this.mode==="single"||!this.truncate)return;const t=this.container.getBoundingClientRect().width;let i=0;let e=0;const n=this.selected.filter((t=>t)).length;for(let s=0;s<n;s++){e+=D(this.getDisplayValue(s));if(e>t-140)break;i++}if(i>=n)i=Infinity;if(i<1)i=1;this.visibleChoices=i}flattenChoices(){return this.choices.reduce(((t,i)=>[...t,...i.groupName?i.options:[i]]),[])}getDisplayValue(t){return this.flattenChoices()[t].label||this.flattenChoices()[t].value}getActualValue(t){return this.flattenChoices()[t].value||this.flattenChoices()[t].label}update(){this.selected=this.flattenChoices().map((({isSelected:t})=>t));if(this.mode==="single"){const t=this.selected.findIndex((t=>t));this.value=t>=0?this.getActualValue(t):"";this.displayValue=t>=0?this.getDisplayValue(t):""}else if(this.mode==="multi"){this.value=this.selected.map(((t,i)=>t?this.getActualValue(i):"")).filter((t=>t.length>0)).join("|")}}handleValueStateChange(t){this.selectChange.emit(t)}render(){let t=0;return e(n,{class:{"xpl-select":true,"xpl-select--disabled":this.disabled,"xpl-select--no-truncate":!this.truncate},onKeyDown:t=>{if(t.key==="Escape")this.active=false},ref:t=>this.container=t},this.label||this.description?e("label",{class:{"xpl-label":true,"xpl-label--disabled":this.disabled},htmlFor:this.id},this.label,this.description&&e("small",{class:{"xpl-description":true,"xpl-description--disabled":this.disabled}},this.description)):null,e("div",{class:{"xpl-input":true,"xpl-input--disabled":this.disabled,"xpl-input--error":this.error!==undefined}},e("div",{class:"xpl-input-wrapper"},e("div",{class:{"xpl-select-value":true,"xpl-select-value--active":this.mode==="multi"&&this.value.length>0,"has-value":this.value.length>0}},this.mode==="single"?this.displayValue||this.placeholder:this.value.length>0?this.selected.map(((i,n)=>{if(!i)return null;if(t>=this.visibleChoices){return null}t++;return e("xpl-tag",{onClose:()=>{this.flattenChoices().forEach(((t,i)=>{if(n===i)t.isSelected=false}));const t=i=>{i.options=i.groupName?i.options.map(t):undefined;return i};this.choices=this.choices.map(t);this.update();this.maybeTruncateChoices()}},this.getDisplayValue(n))})):this.placeholder,this.visibleChoices<Infinity&&`+ ${this.selected.filter((t=>t)).length-this.visibleChoices} more`),e("button",{disabled:this.disabled,id:this.id,onKeyDown:t=>{if(t.key==="Tab")this.keepFocus=true},onClick:()=>{const{dropdown:t}=this;if(!this.disabled)t.isOpen=!t.isOpen},type:"button"})),!this.disabled&&e("xpl-dropdown",{options:this.choices,mode:this.mode,triggerId:this.id,update:()=>{this.update();this.maybeTruncateChoices()}}),this.error!==undefined&&this.error.length>0&&e("label",{class:"xpl-input-error",htmlFor:this.id},e("svg",{width:"10",height:"11",viewBox:"0 0 10 11",fill:"none",xmlns:"http://www.w3.org/2000/svg"},e("path",{d:"M9.84375 5.25C9.84375 2.59375 7.65625 0.40625 5 0.40625C2.32422 0.40625 0.15625 2.59375 0.15625 5.25C0.15625 7.92578 2.32422 10.0938 5 10.0938C7.65625 10.0938 9.84375 7.92578 9.84375 5.25ZM5 6.22656C5.48828 6.22656 5.89844 6.63672 5.89844 7.125C5.89844 7.63281 5.48828 8.02344 5 8.02344C4.49219 8.02344 4.10156 7.63281 4.10156 7.125C4.10156 6.63672 4.49219 6.22656 5 6.22656ZM4.14062 3.00391C4.12109 2.86719 4.23828 2.75 4.375 2.75H5.60547C5.74219 2.75 5.85938 2.86719 5.83984 3.00391L5.70312 5.66016C5.68359 5.79688 5.58594 5.875 5.46875 5.875H4.51172C4.39453 5.875 4.29688 5.79688 4.27734 5.66016L4.14062 3.00391Z"})),this.error)),e("input",{type:"hidden",name:this.name,value:this.value}))}static get watchers(){return{choices:["onChoicesChanged"],value:["handleValueStateChange"]}}};export{E as xpl_select};
+//# sourceMappingURL=p-da5a8e74.entry.js.map

package/dist/apollo-core/p-da5a8e74.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["FUNC_ERROR_TEXT","NAN","symbolTag","reTrim","reIsBadHex","reIsBinary","reIsOctal","freeParseInt","parseInt","freeGlobal","global","Object","freeSelf","self","root","Function","objectProto","prototype","objectToString","toString","nativeMax","Math","max","nativeMin","min","now","Date","debounce","func","wait","options","lastArgs","lastThis","maxWait","result","timerId","lastCallTime","lastInvokeTime","leading","maxing","trailing","TypeError","toNumber","isObject","invokeFunc","time","args","thisArg","undefined","apply","leadingEdge","setTimeout","timerExpired","remainingWait","timeSinceLastCall","timeSinceLastInvoke","shouldInvoke","trailingEdge","cancel","clearTimeout","flush","debounced","isInvoking","arguments","this","throttle","value","type","isObjectLike","isSymbol","call","other","valueOf","replace","isBinary","test","slice","lodash_throttle","tagWidth","text","context","document","createElement","getContext","font","measureText","width","XplSelect","uuid","Infinity","onChoicesChanged","_choices","update","componentWillLoad","selected","choices","length","map","selectedValues","isSingleMode","mode","selectedValue","shouldBeSelected","find","choice","label","isSelected","forEach","option","includes","window","addEventListener","e","el","target","select","closest","container","active","maybeTruncateChoices","componentDidLoad","dropdown","querySelector","truncate","containerWidth","getBoundingClientRect","visibleChoices","visibleChoicesWidth","actualNumSelected","filter","a","i","getDisplayValue","flattenChoices","reduce","acc","curr","groupName","getActualValue","findIndex","v","displayValue","join","handleValueStateChange","newValue","selectChange","emit","render","h","Host","class","disabled","onKeyDown","key","ref","description","htmlFor","id","error","placeholder","onClose","j","mapOptions","keepFocus","onClick","isOpen","triggerId","height","viewBox","fill","xmlns","d","name"],"sources":["./node_modules/lodash.throttle/index.js","./src/components/components/xpl-select/xpl-select.tsx"],"sourcesContent":["/**\n * lodash (Custom Build) <https://lodash.com/>\n * Build: `lodash modularize exports=\"npm\" -o ./`\n * Copyright jQuery Foundation and other contributors <https://jquery.org/>\n * Released under MIT license <https://lodash.com/license>\n * Based on Underscore.js 1.8.3 <http://underscorejs.org/LICENSE>\n * Copyright Jeremy Ashkenas, DocumentCloud and Investigative Reporters & Editors\n */\n\n/** Used as the `TypeError` message for \"Functions\" methods. */\nvar FUNC_ERROR_TEXT = 'Expected a function';\n\n/** Used as references for various `Number` constants. */\nvar NAN = 0 / 0;\n\n/** `Object#toString` result references. */\nvar symbolTag = '[object Symbol]';\n\n/** Used to match leading and trailing whitespace. */\nvar reTrim = /^\\s+|\\s+$/g;\n\n/** Used to detect bad signed hexadecimal string values. */\nvar reIsBadHex = /^[-+]0x[0-9a-f]+$/i;\n\n/** Used to detect binary string values. */\nvar reIsBinary = /^0b[01]+$/i;\n\n/** Used to detect octal string values. */\nvar reIsOctal = /^0o[0-7]+$/i;\n\n/** Built-in method references without a dependency on `root`. */\nvar freeParseInt = parseInt;\n\n/** Detect free variable `global` from Node.js. */\nvar freeGlobal = typeof global == 'object' && global && global.Object === Object && global;\n\n/** Detect free variable `self`. */\nvar freeSelf = typeof self == 'object' && self && self.Object === Object && self;\n\n/** Used as a reference to the global object. */\nvar root = freeGlobal || freeSelf || Function('return this')();\n\n/** Used for built-in method references. */\nvar objectProto = Object.prototype;\n\n/**\n * Used to resolve the\n * [`toStringTag`](http://ecma-international.org/ecma-262/7.0/#sec-object.prototype.tostring)\n * of values.\n */\nvar objectToString = objectProto.toString;\n\n/* Built-in method references for those with the same name as other `lodash` methods. */\nvar nativeMax = Math.max,\n    nativeMin = Math.min;\n\n/**\n * Gets the timestamp of the number of milliseconds that have elapsed since\n * the Unix epoch (1 January 1970 00:00:00 UTC).\n *\n * @static\n * @memberOf _\n * @since 2.4.0\n * @category Date\n * @returns {number} Returns the timestamp.\n * @example\n *\n * _.defer(function(stamp) {\n *   console.log(_.now() - stamp);\n * }, _.now());\n * // => Logs the number of milliseconds it took for the deferred invocation.\n */\nvar now = function() {\n  return root.Date.now();\n};\n\n/**\n * Creates a debounced function that delays invoking `func` until after `wait`\n * milliseconds have elapsed since the last time the debounced function was\n * invoked. The debounced function comes with a `cancel` method to cancel\n * delayed `func` invocations and a `flush` method to immediately invoke them.\n * Provide `options` to indicate whether `func` should be invoked on the\n * leading and/or trailing edge of the `wait` timeout. The `func` is invoked\n * with the last arguments provided to the debounced function. Subsequent\n * calls to the debounced function return the result of the last `func`\n * invocation.\n *\n * **Note:** If `leading` and `trailing` options are `true`, `func` is\n * invoked on the trailing edge of the timeout only if the debounced function\n * is invoked more than once during the `wait` timeout.\n *\n * If `wait` is `0` and `leading` is `false`, `func` invocation is deferred\n * until to the next tick, similar to `setTimeout` with a timeout of `0`.\n *\n * See [David Corbacho's article](https://css-tricks.com/debouncing-throttling-explained-examples/)\n * for details over the differences between `_.debounce` and `_.throttle`.\n *\n * @static\n * @memberOf _\n * @since 0.1.0\n * @category Function\n * @param {Function} func The function to debounce.\n * @param {number} [wait=0] The number of milliseconds to delay.\n * @param {Object} [options={}] The options object.\n * @param {boolean} [options.leading=false]\n *  Specify invoking on the leading edge of the timeout.\n * @param {number} [options.maxWait]\n *  The maximum time `func` is allowed to be delayed before it's invoked.\n * @param {boolean} [options.trailing=true]\n *  Specify invoking on the trailing edge of the timeout.\n * @returns {Function} Returns the new debounced function.\n * @example\n *\n * // Avoid costly calculations while the window size is in flux.\n * jQuery(window).on('resize', _.debounce(calculateLayout, 150));\n *\n * // Invoke `sendMail` when clicked, debouncing subsequent calls.\n * jQuery(element).on('click', _.debounce(sendMail, 300, {\n *   'leading': true,\n *   'trailing': false\n * }));\n *\n * // Ensure `batchLog` is invoked once after 1 second of debounced calls.\n * var debounced = _.debounce(batchLog, 250, { 'maxWait': 1000 });\n * var source = new EventSource('/stream');\n * jQuery(source).on('message', debounced);\n *\n * // Cancel the trailing debounced invocation.\n * jQuery(window).on('popstate', debounced.cancel);\n */\nfunction debounce(func, wait, options) {\n  var lastArgs,\n      lastThis,\n      maxWait,\n      result,\n      timerId,\n      lastCallTime,\n      lastInvokeTime = 0,\n      leading = false,\n      maxing = false,\n      trailing = true;\n\n  if (typeof func != 'function') {\n    throw new TypeError(FUNC_ERROR_TEXT);\n  }\n  wait = toNumber(wait) || 0;\n  if (isObject(options)) {\n    leading = !!options.leading;\n    maxing = 'maxWait' in options;\n    maxWait = maxing ? nativeMax(toNumber(options.maxWait) || 0, wait) : maxWait;\n    trailing = 'trailing' in options ? !!options.trailing : trailing;\n  }\n\n  function invokeFunc(time) {\n    var args = lastArgs,\n        thisArg = lastThis;\n\n    lastArgs = lastThis = undefined;\n    lastInvokeTime = time;\n    result = func.apply(thisArg, args);\n    return result;\n  }\n\n  function leadingEdge(time) {\n    // Reset any `maxWait` timer.\n    lastInvokeTime = time;\n    // Start the timer for the trailing edge.\n    timerId = setTimeout(timerExpired, wait);\n    // Invoke the leading edge.\n    return leading ? invokeFunc(time) : result;\n  }\n\n  function remainingWait(time) {\n    var timeSinceLastCall = time - lastCallTime,\n        timeSinceLastInvoke = time - lastInvokeTime,\n        result = wait - timeSinceLastCall;\n\n    return maxing ? nativeMin(result, maxWait - timeSinceLastInvoke) : result;\n  }\n\n  function shouldInvoke(time) {\n    var timeSinceLastCall = time - lastCallTime,\n        timeSinceLastInvoke = time - lastInvokeTime;\n\n    // Either this is the first call, activity has stopped and we're at the\n    // trailing edge, the system time has gone backwards and we're treating\n    // it as the trailing edge, or we've hit the `maxWait` limit.\n    return (lastCallTime === undefined || (timeSinceLastCall >= wait) ||\n      (timeSinceLastCall < 0) || (maxing && timeSinceLastInvoke >= maxWait));\n  }\n\n  function timerExpired() {\n    var time = now();\n    if (shouldInvoke(time)) {\n      return trailingEdge(time);\n    }\n    // Restart the timer.\n    timerId = setTimeout(timerExpired, remainingWait(time));\n  }\n\n  function trailingEdge(time) {\n    timerId = undefined;\n\n    // Only invoke if we have `lastArgs` which means `func` has been\n    // debounced at least once.\n    if (trailing && lastArgs) {\n      return invokeFunc(time);\n    }\n    lastArgs = lastThis = undefined;\n    return result;\n  }\n\n  function cancel() {\n    if (timerId !== undefined) {\n      clearTimeout(timerId);\n    }\n    lastInvokeTime = 0;\n    lastArgs = lastCallTime = lastThis = timerId = undefined;\n  }\n\n  function flush() {\n    return timerId === undefined ? result : trailingEdge(now());\n  }\n\n  function debounced() {\n    var time = now(),\n        isInvoking = shouldInvoke(time);\n\n    lastArgs = arguments;\n    lastThis = this;\n    lastCallTime = time;\n\n    if (isInvoking) {\n      if (timerId === undefined) {\n        return leadingEdge(lastCallTime);\n      }\n      if (maxing) {\n        // Handle invocations in a tight loop.\n        timerId = setTimeout(timerExpired, wait);\n        return invokeFunc(lastCallTime);\n      }\n    }\n    if (timerId === undefined) {\n      timerId = setTimeout(timerExpired, wait);\n    }\n    return result;\n  }\n  debounced.cancel = cancel;\n  debounced.flush = flush;\n  return debounced;\n}\n\n/**\n * Creates a throttled function that only invokes `func` at most once per\n * every `wait` milliseconds. The throttled function comes with a `cancel`\n * method to cancel delayed `func` invocations and a `flush` method to\n * immediately invoke them. Provide `options` to indicate whether `func`\n * should be invoked on the leading and/or trailing edge of the `wait`\n * timeout. The `func` is invoked with the last arguments provided to the\n * throttled function. Subsequent calls to the throttled function return the\n * result of the last `func` invocation.\n *\n * **Note:** If `leading` and `trailing` options are `true`, `func` is\n * invoked on the trailing edge of the timeout only if the throttled function\n * is invoked more than once during the `wait` timeout.\n *\n * If `wait` is `0` and `leading` is `false`, `func` invocation is deferred\n * until to the next tick, similar to `setTimeout` with a timeout of `0`.\n *\n * See [David Corbacho's article](https://css-tricks.com/debouncing-throttling-explained-examples/)\n * for details over the differences between `_.throttle` and `_.debounce`.\n *\n * @static\n * @memberOf _\n * @since 0.1.0\n * @category Function\n * @param {Function} func The function to throttle.\n * @param {number} [wait=0] The number of milliseconds to throttle invocations to.\n * @param {Object} [options={}] The options object.\n * @param {boolean} [options.leading=true]\n *  Specify invoking on the leading edge of the timeout.\n * @param {boolean} [options.trailing=true]\n *  Specify invoking on the trailing edge of the timeout.\n * @returns {Function} Returns the new throttled function.\n * @example\n *\n * // Avoid excessively updating the position while scrolling.\n * jQuery(window).on('scroll', _.throttle(updatePosition, 100));\n *\n * // Invoke `renewToken` when the click event is fired, but not more than once every 5 minutes.\n * var throttled = _.throttle(renewToken, 300000, { 'trailing': false });\n * jQuery(element).on('click', throttled);\n *\n * // Cancel the trailing throttled invocation.\n * jQuery(window).on('popstate', throttled.cancel);\n */\nfunction throttle(func, wait, options) {\n  var leading = true,\n      trailing = true;\n\n  if (typeof func != 'function') {\n    throw new TypeError(FUNC_ERROR_TEXT);\n  }\n  if (isObject(options)) {\n    leading = 'leading' in options ? !!options.leading : leading;\n    trailing = 'trailing' in options ? !!options.trailing : trailing;\n  }\n  return debounce(func, wait, {\n    'leading': leading,\n    'maxWait': wait,\n    'trailing': trailing\n  });\n}\n\n/**\n * Checks if `value` is the\n * [language type](http://www.ecma-international.org/ecma-262/7.0/#sec-ecmascript-language-types)\n * of `Object`. (e.g. arrays, functions, objects, regexes, `new Number(0)`, and `new String('')`)\n *\n * @static\n * @memberOf _\n * @since 0.1.0\n * @category Lang\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is an object, else `false`.\n * @example\n *\n * _.isObject({});\n * // => true\n *\n * _.isObject([1, 2, 3]);\n * // => true\n *\n * _.isObject(_.noop);\n * // => true\n *\n * _.isObject(null);\n * // => false\n */\nfunction isObject(value) {\n  var type = typeof value;\n  return !!value && (type == 'object' || type == 'function');\n}\n\n/**\n * Checks if `value` is object-like. A value is object-like if it's not `null`\n * and has a `typeof` result of \"object\".\n *\n * @static\n * @memberOf _\n * @since 4.0.0\n * @category Lang\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is object-like, else `false`.\n * @example\n *\n * _.isObjectLike({});\n * // => true\n *\n * _.isObjectLike([1, 2, 3]);\n * // => true\n *\n * _.isObjectLike(_.noop);\n * // => false\n *\n * _.isObjectLike(null);\n * // => false\n */\nfunction isObjectLike(value) {\n  return !!value && typeof value == 'object';\n}\n\n/**\n * Checks if `value` is classified as a `Symbol` primitive or object.\n *\n * @static\n * @memberOf _\n * @since 4.0.0\n * @category Lang\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is a symbol, else `false`.\n * @example\n *\n * _.isSymbol(Symbol.iterator);\n * // => true\n *\n * _.isSymbol('abc');\n * // => false\n */\nfunction isSymbol(value) {\n  return typeof value == 'symbol' ||\n    (isObjectLike(value) && objectToString.call(value) == symbolTag);\n}\n\n/**\n * Converts `value` to a number.\n *\n * @static\n * @memberOf _\n * @since 4.0.0\n * @category Lang\n * @param {*} value The value to process.\n * @returns {number} Returns the number.\n * @example\n *\n * _.toNumber(3.2);\n * // => 3.2\n *\n * _.toNumber(Number.MIN_VALUE);\n * // => 5e-324\n *\n * _.toNumber(Infinity);\n * // => Infinity\n *\n * _.toNumber('3.2');\n * // => 3.2\n */\nfunction toNumber(value) {\n  if (typeof value == 'number') {\n    return value;\n  }\n  if (isSymbol(value)) {\n    return NAN;\n  }\n  if (isObject(value)) {\n    var other = typeof value.valueOf == 'function' ? value.valueOf() : value;\n    value = isObject(other) ? (other + '') : other;\n  }\n  if (typeof value != 'string') {\n    return value === 0 ? value : +value;\n  }\n  value = value.replace(reTrim, '');\n  var isBinary = reIsBinary.test(value);\n  return (isBinary || reIsOctal.test(value))\n    ? freeParseInt(value.slice(2), isBinary ? 2 : 8)\n    : (reIsBadHex.test(value) ? NAN : +value);\n}\n\nmodule.exports = throttle;\n","import { v4 as uuid } from 'uuid';\nimport {\n    Component,\n    Host,\n    h,\n    Prop,\n    State,\n    Event,\n    EventEmitter,\n    Watch,\n} from '@stencil/core';\nimport throttle from 'lodash.throttle';\nimport type { DropdownItem } from '../xpl-dropdown/dropdownoption';\n\nfunction tagWidth(text: string): number {\n    const context = document.createElement('canvas').getContext('2d');\n    context.font =\n        \"14px apple-system, system-ui, 'Segoe UI', Arial, Helvetica, Roboto, sans-serif\";\n    return context.measureText(text).width + 44; // = text + l/r padding + margin-right\n}\n\n@Component({\n    tag: 'xpl-select',\n})\nexport class XplSelect {\n    /**\n     * An array of choices for the user to choose from.\n     * Each choice should be of the form:\n     * {\n     *   label: string;\n     *   href?: string;\n     *   value?: string;\n     *   isGroupHeading?: boolean;\n     * }\n     */\n    @Prop() choices?: DropdownItem[] = [];\n\n    /**\n     *\n     * @param _choices\n     */\n    @Watch('choices')\n    onChoicesChanged(_choices: DropdownItem[]) {\n        this.update();\n    }\n\n    /**\n     * Optional text that appears below the input label.\n     */\n    @Prop() description?: string;\n    @Prop() disabled?: boolean;\n    /**\n     * If an empty string (attribute present with no value),\n     * will display visually as an error. If a string is\n     * included, will display visually as an error and include\n     * the value as an error message.\n     */\n    @Prop() error?: string;\n\n    /**\n     * The label that appears above the select dropdown\n     */\n    @Prop() label?: string;\n    /**\n     * Whether to allow a single choice or multiple choices.\n     */\n    @Prop() mode?: 'single' | 'multi' = 'single';\n\n    /**\n     * The name of the hidden input field that contains the selected option's value(s)\n     */\n    @Prop() name?: string;\n\n    @Prop() placeholder: string;\n    /**\n     * Only used in multi-choice selects. If `true`,\n     * badges representing selections that would overflow the\n     * container are replaced with \"+x more\" (where x is the\n     * number not shown). If `false`, the container's height will\n     * adjust to show all badges representing selections.\n     */\n    @Prop() truncate?: boolean = true;\n\n    @Prop() selectedValues?: string | string[];\n\n    /**\n     * Emits the value of the selected option in the select menu on change\n     */\n    @Event() selectChange: EventEmitter<string>;\n\n    @State() active: boolean = false;\n    @State() id: string = uuid();\n    @State() keepFocus: boolean = false;\n    @State() selected: boolean[];\n    @State() value: string = '';\n    @State() displayValue: string = '';\n    // infinity isn't real, it's just a mathematical construct, it can't hurt you\n    @State() visibleChoices: number = Infinity;\n\n    private container!: HTMLElement;\n\n    private dropdown: HTMLXplDropdownElement;\n\n    componentWillLoad() {\n        this.selected =\n            this.choices && this.choices.length > 0\n                ? this.choices.map(() => false)\n                : [];\n\n        if (this.selectedValues) {\n            const isSingleMode = this.mode === 'single';\n\n            if (isSingleMode) {\n                const selectedValue = this.selectedValues as string;\n                const shouldBeSelected = this.choices.find(\n                    (choice) =>\n                        (choice.value !== undefined\n                            ? choice.value\n                            : choice.label) === selectedValue\n                );\n                if (shouldBeSelected !== undefined)\n                    shouldBeSelected.isSelected = true;\n            } else {\n                this.choices.forEach(({ options }) => {\n                    options.forEach((option) => {\n                        const shouldBeSelected = this.selectedValues.includes(\n                            option.value || option.label\n                        );\n\n                        if (shouldBeSelected) option.isSelected = true;\n                    });\n                });\n            }\n\n            this.update();\n        }\n\n        window.addEventListener('click', (e: MouseEvent) => {\n            const el = e.target as HTMLElement;\n            const select = el.closest('.xpl-select');\n            if (select === null || select !== this.container) {\n                this.active = false;\n            }\n        });\n\n        window.addEventListener(\n            'resize',\n            throttle(() => {\n                this.maybeTruncateChoices();\n            }, 250)\n        );\n    }\n    componentDidLoad() {\n        this.dropdown = this.container.querySelector('xpl-dropdown');\n    }\n\n    private maybeTruncateChoices(): void {\n        if (this.mode === 'single' || !this.truncate) return;\n\n        const containerWidth = this.container.getBoundingClientRect().width;\n\n        let visibleChoices = 0;\n        let visibleChoicesWidth = 0;\n\n        const actualNumSelected = this.selected.filter((a) => a).length;\n        for (let i = 0; i < actualNumSelected; i++) {\n            visibleChoicesWidth += tagWidth(this.getDisplayValue(i));\n            if (visibleChoicesWidth > containerWidth - 140) break;\n            visibleChoices++;\n        }\n\n        if (visibleChoices >= actualNumSelected) visibleChoices = Infinity;\n        if (visibleChoices < 1) visibleChoices = 1;\n\n        this.visibleChoices = visibleChoices;\n    }\n\n    private flattenChoices(): DropdownItem[] {\n        return this.choices.reduce(\n            (acc, curr) => [\n                ...acc,\n                ...(curr.groupName ? curr.options : [curr]),\n            ],\n            []\n        );\n    }\n    private getDisplayValue(i: number): string {\n        return this.flattenChoices()[i].label || this.flattenChoices()[i].value;\n    }\n\n    private getActualValue(i: number): string {\n        return this.flattenChoices()[i].value || this.flattenChoices()[i].label;\n    }\n\n    private update() {\n        this.selected = this.flattenChoices().map(\n            ({ isSelected }) => isSelected\n        );\n\n        if (this.mode === 'single') {\n            const selected = this.selected.findIndex((v) => v);\n            this.value = selected >= 0 ? this.getActualValue(selected) : '';\n            this.displayValue =\n                selected >= 0 ? this.getDisplayValue(selected) : '';\n        } else if (this.mode === 'multi') {\n            this.value = this.selected\n                .map((v, i) => {\n                    return v ? this.getActualValue(i) : '';\n                })\n                .filter((v) => v.length > 0)\n                .join('|');\n        }\n    }\n\n    @Watch('value')\n    handleValueStateChange(newValue) {\n        this.selectChange.emit(newValue);\n    }\n\n    render() {\n        let visibleChoices = 0;\n        return (\n            <Host\n                class={{\n                    'xpl-select': true,\n                    'xpl-select--disabled': this.disabled,\n                    'xpl-select--no-truncate': !this.truncate,\n                }}\n                onKeyDown={(e: KeyboardEvent) => {\n                    if (e.key === 'Escape') this.active = false;\n                }}\n                ref={(el) => (this.container = el as HTMLElement)}\n            >\n                {this.label || this.description ? (\n                    <label\n                        class={{\n                            'xpl-label': true,\n                            'xpl-label--disabled': this.disabled,\n                        }}\n                        htmlFor={this.id}\n                    >\n                        {this.label}\n                        {this.description && (\n                            <small\n                                class={{\n                                    'xpl-description': true,\n                                    'xpl-description--disabled': this.disabled,\n                                }}\n                            >\n                                {this.description}\n                            </small>\n                        )}\n                    </label>\n                ) : null}\n                <div\n                    class={{\n                        'xpl-input': true,\n                        'xpl-input--disabled': this.disabled,\n                        'xpl-input--error': this.error !== undefined,\n                    }}\n                >\n                    <div class=\"xpl-input-wrapper\">\n                        <div\n                            class={{\n                                'xpl-select-value': true,\n                                'xpl-select-value--active':\n                                    this.mode === 'multi' &&\n                                    this.value.length > 0,\n                                'has-value': this.value.length > 0,\n                            }}\n                        >\n                            {this.mode === 'single'\n                                ? this.displayValue || this.placeholder\n                                : this.value.length > 0\n                                ? this.selected.map((v, i) => {\n                                      if (!v) return null;\n                                      if (\n                                          visibleChoices >= this.visibleChoices\n                                      ) {\n                                          return null;\n                                      }\n                                      visibleChoices++;\n                                      return (\n                                          <xpl-tag\n                                              onClose={() => {\n                                                  this.flattenChoices().forEach(\n                                                      (v, j) => {\n                                                          if (i === j)\n                                                              v.isSelected =\n                                                                  false;\n                                                      }\n                                                  );\n                                                  const mapOptions = (\n                                                      option: DropdownItem\n                                                  ): DropdownItem => {\n                                                      option.options =\n                                                          option.groupName\n                                                              ? option.options.map(\n                                                                    mapOptions\n                                                                )\n                                                              : undefined;\n                                                      return option;\n                                                  };\n                                                  this.choices =\n                                                      this.choices.map(\n                                                          mapOptions\n                                                      );\n\n                                                  this.update();\n                                                  this.maybeTruncateChoices();\n                                              }}\n                                          >\n                                              {this.getDisplayValue(i)}\n                                          </xpl-tag>\n                                      );\n                                  })\n                                : this.placeholder}\n                            {this.visibleChoices < Infinity &&\n                                `+ ${\n                                    this.selected.filter((a) => a).length -\n                                    this.visibleChoices\n                                } more`}\n                        </div>\n                        <button\n                            disabled={this.disabled}\n                            id={this.id}\n                            onKeyDown={(e: KeyboardEvent) => {\n                                if (e.key === 'Tab') this.keepFocus = true;\n                            }}\n                            onClick={() => {\n                                const { dropdown } = this;\n                                if (!this.disabled)\n                                    dropdown.isOpen = !dropdown.isOpen;\n                            }}\n                            type=\"button\"\n                        ></button>\n                    </div>\n                    {!this.disabled && (\n                        <xpl-dropdown\n                            options={this.choices}\n                            mode={this.mode}\n                            triggerId={this.id}\n                            update={() => {\n                                this.update();\n                                this.maybeTruncateChoices();\n                            }}\n                        ></xpl-dropdown>\n                    )}\n                    {this.error !== undefined && this.error.length > 0 && (\n                        <label class=\"xpl-input-error\" htmlFor={this.id}>\n                            <svg\n                                width=\"10\"\n                                height=\"11\"\n                                viewBox=\"0 0 10 11\"\n                                fill=\"none\"\n                                xmlns=\"http://www.w3.org/2000/svg\"\n                            >\n                                <path d=\"M9.84375 5.25C9.84375 2.59375 7.65625 0.40625 5 0.40625C2.32422 0.40625 0.15625 2.59375 0.15625 5.25C0.15625 7.92578 2.32422 10.0938 5 10.0938C7.65625 10.0938 9.84375 7.92578 9.84375 5.25ZM5 6.22656C5.48828 6.22656 5.89844 6.63672 5.89844 7.125C5.89844 7.63281 5.48828 8.02344 5 8.02344C4.49219 8.02344 4.10156 7.63281 4.10156 7.125C4.10156 6.63672 4.49219 6.22656 5 6.22656ZM4.14062 3.00391C4.12109 2.86719 4.23828 2.75 4.375 2.75H5.60547C5.74219 2.75 5.85938 2.86719 5.83984 3.00391L5.70312 5.66016C5.68359 5.79688 5.58594 5.875 5.46875 5.875H4.51172C4.39453 5.875 4.29688 5.79688 4.27734 5.66016L4.14062 3.00391Z\" />\n                            </svg>\n                            {this.error}\n                        </label>\n                    )}\n                </div>\n                <input type=\"hidden\" name={this.name} value={this.value} />\n            </Host>\n        );\n    }\n}\n"],"mappings":"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"}

package/dist/cjs/xpl-select.cjs.entry.js

@@ -475,6 +475,13 @@ const XplSelect = class {
     this.displayValue = '';
     this.visibleChoices = Infinity;
   }
+  /**
+   *
+   * @param _choices
+   */
+  onChoicesChanged(_choices) {
+    this.update();
+  }
   componentWillLoad() {
     this.selected =
       this.choices && this.choices.length > 0
@@ -483,12 +490,12 @@ const XplSelect = class {
     if (this.selectedValues) {
       const isSingleMode = this.mode === 'single';
       if (isSingleMode) {
-        this.choices.forEach((choice) => {
-          const shouldBeSelected = choice.value.includes(this.selectedValues) ||
-            choice.label.includes(this.selectedValues);
-          if (shouldBeSelected)
-            choice.isSelected = true;
-        });
+        const selectedValue = this.selectedValues;
+        const shouldBeSelected = this.choices.find((choice) => (choice.value !== undefined
+          ? choice.value
+          : choice.label) === selectedValue);
+        if (shouldBeSelected !== undefined)
+          shouldBeSelected.isSelected = true;
       }
       else {
         this.choices.forEach(({ options }) => {
@@ -634,6 +641,7 @@ const XplSelect = class {
       } })), this.error !== undefined && this.error.length > 0 && (index.h("label", { class: "xpl-input-error", htmlFor: this.id }, index.h("svg", { width: "10", height: "11", viewBox: "0 0 10 11", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { d: "M9.84375 5.25C9.84375 2.59375 7.65625 0.40625 5 0.40625C2.32422 0.40625 0.15625 2.59375 0.15625 5.25C0.15625 7.92578 2.32422 10.0938 5 10.0938C7.65625 10.0938 9.84375 7.92578 9.84375 5.25ZM5 6.22656C5.48828 6.22656 5.89844 6.63672 5.89844 7.125C5.89844 7.63281 5.48828 8.02344 5 8.02344C4.49219 8.02344 4.10156 7.63281 4.10156 7.125C4.10156 6.63672 4.49219 6.22656 5 6.22656ZM4.14062 3.00391C4.12109 2.86719 4.23828 2.75 4.375 2.75H5.60547C5.74219 2.75 5.85938 2.86719 5.83984 3.00391L5.70312 5.66016C5.68359 5.79688 5.58594 5.875 5.46875 5.875H4.51172C4.39453 5.875 4.29688 5.79688 4.27734 5.66016L4.14062 3.00391Z" })), this.error))), index.h("input", { type: "hidden", name: this.name, value: this.value })));
   }
   static get watchers() { return {
+    "choices": ["onChoicesChanged"],
     "value": ["handleValueStateChange"]
   }; }
 };

package/dist/cjs/xpl-select.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"xpl-select.entry.cjs.js","mappings":";;;;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,IAAI,eAAe,GAAG,qBAAqB,CAAC;AAC5C;AACA;AACA,IAAI,GAAG,GAAG,CAAC,GAAG,CAAC,CAAC;AAChB;AACA;AACA,IAAI,SAAS,GAAG,iBAAiB,CAAC;AAClC;AACA;AACA,IAAI,MAAM,GAAG,YAAY,CAAC;AAC1B;AACA;AACA,IAAI,UAAU,GAAG,oBAAoB,CAAC;AACtC;AACA;AACA,IAAI,UAAU,GAAG,YAAY,CAAC;AAC9B;AACA;AACA,IAAI,SAAS,GAAG,aAAa,CAAC;AAC9B;AACA;AACA,IAAI,YAAY,GAAG,QAAQ,CAAC;AAC5B;AACA;AACA,IAAI,UAAU,GAAG,OAAOA,cAAM,IAAI,QAAQ,IAAIA,cAAM,IAAIA,cAAM,CAAC,MAAM,KAAK,MAAM,IAAIA,cAAM,CAAC;AAC3F;AACA;AACA,IAAI,QAAQ,GAAG,OAAO,IAAI,IAAI,QAAQ,IAAI,IAAI,IAAI,IAAI,CAAC,MAAM,KAAK,MAAM,IAAI,IAAI,CAAC;AACjF;AACA;AACA,IAAI,IAAI,GAAG,UAAU,IAAI,QAAQ,IAAI,QAAQ,CAAC,aAAa,CAAC,EAAE,CAAC;AAC/D;AACA;AACA,IAAI,WAAW,GAAG,MAAM,CAAC,SAAS,CAAC;AACnC;AACA;AACA;AACA;AACA;AACA;AACA,IAAI,cAAc,GAAG,WAAW,CAAC,QAAQ,CAAC;AAC1C;AACA;AACA,IAAI,SAAS,GAAG,IAAI,CAAC,GAAG;AACxB,IAAI,SAAS,GAAG,IAAI,CAAC,GAAG,CAAC;AACzB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,IAAI,GAAG,GAAG,WAAW;AACrB,EAAE,OAAO,IAAI,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC;AACzB,CAAC,CAAC;AACF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAAS,QAAQ,CAAC,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE;AACvC,EAAE,IAAI,QAAQ;AACd,MAAM,QAAQ;AACd,MAAM,OAAO;AACb,MAAM,MAAM;AACZ,MAAM,OAAO;AACb,MAAM,YAAY;AAClB,MAAM,cAAc,GAAG,CAAC;AACxB,MAAM,OAAO,GAAG,KAAK;AACrB,MAAM,MAAM,GAAG,KAAK;AACpB,MAAM,QAAQ,GAAG,IAAI,CAAC;AACtB;AACA,EAAE,IAAI,OAAO,IAAI,IAAI,UAAU,EAAE;AACjC,IAAI,MAAM,IAAI,SAAS,CAAC,eAAe,CAAC,CAAC;AACzC,GAAG;AACH,EAAE,IAAI,GAAG,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;AAC7B,EAAE,IAAI,QAAQ,CAAC,OAAO,CAAC,EAAE;AACzB,IAAI,OAAO,GAAG,CAAC,CAAC,OAAO,CAAC,OAAO,CAAC;AAChC,IAAI,MAAM,GAAG,SAAS,IAAI,OAAO,CAAC;AAClC,IAAI,OAAO,GAAG,MAAM,GAAG,SAAS,CAAC,QAAQ,CAAC,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,IAAI,CAAC,GAAG,OAAO,CAAC;AACjF,IAAI,QAAQ,GAAG,UAAU,IAAI,OAAO,GAAG,CAAC,CAAC,OAAO,CAAC,QAAQ,GAAG,QAAQ,CAAC;AACrE,GAAG;AACH;AACA,EAAE,SAAS,UAAU,CAAC,IAAI,EAAE;AAC5B,IAAI,IAAI,IAAI,GAAG,QAAQ;AACvB,QAAQ,OAAO,GAAG,QAAQ,CAAC;AAC3B;AACA,IAAI,QAAQ,GAAG,QAAQ,GAAG,SAAS,CAAC;AACpC,IAAI,cAAc,GAAG,IAAI,CAAC;AAC1B,IAAI,MAAM,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,EAAE,IAAI,CAAC,CAAC;AACvC,IAAI,OAAO,MAAM,CAAC;AAClB,GAAG;AACH;AACA,EAAE,SAAS,WAAW,CAAC,IAAI,EAAE;AAC7B;AACA,IAAI,cAAc,GAAG,IAAI,CAAC;AAC1B;AACA,IAAI,OAAO,GAAG,UAAU,CAAC,YAAY,EAAE,IAAI,CAAC,CAAC;AAC7C;AACA,IAAI,OAAO,OAAO,GAAG,UAAU,CAAC,IAAI,CAAC,GAAG,MAAM,CAAC;AAC/C,GAAG;AACH;AACA,EAAE,SAAS,aAAa,CAAC,IAAI,EAAE;AAC/B,IAAI,IAAI,iBAAiB,GAAG,IAAI,GAAG,YAAY;AAC/C,QAAQ,mBAAmB,GAAG,IAAI,GAAG,cAAc;AACnD,QAAQ,MAAM,GAAG,IAAI,GAAG,iBAAiB,CAAC;AAC1C;AACA,IAAI,OAAO,MAAM,GAAG,SAAS,CAAC,MAAM,EAAE,OAAO,GAAG,mBAAmB,CAAC,GAAG,MAAM,CAAC;AAC9E,GAAG;AACH;AACA,EAAE,SAAS,YAAY,CAAC,IAAI,EAAE;AAC9B,IAAI,IAAI,iBAAiB,GAAG,IAAI,GAAG,YAAY;AAC/C,QAAQ,mBAAmB,GAAG,IAAI,GAAG,cAAc,CAAC;AACpD;AACA;AACA;AACA;AACA,IAAI,QAAQ,YAAY,KAAK,SAAS,KAAK,iBAAiB,IAAI,IAAI,CAAC;AACrE,OAAO,iBAAiB,GAAG,CAAC,CAAC,KAAK,MAAM,IAAI,mBAAmB,IAAI,OAAO,CAAC,EAAE;AAC7E,GAAG;AACH;AACA,EAAE,SAAS,YAAY,GAAG;AAC1B,IAAI,IAAI,IAAI,GAAG,GAAG,EAAE,CAAC;AACrB,IAAI,IAAI,YAAY,CAAC,IAAI,CAAC,EAAE;AAC5B,MAAM,OAAO,YAAY,CAAC,IAAI,CAAC,CAAC;AAChC,KAAK;AACL;AACA,IAAI,OAAO,GAAG,UAAU,CAAC,YAAY,EAAE,aAAa,CAAC,IAAI,CAAC,CAAC,CAAC;AAC5D,GAAG;AACH;AACA,EAAE,SAAS,YAAY,CAAC,IAAI,EAAE;AAC9B,IAAI,OAAO,GAAG,SAAS,CAAC;AACxB;AACA;AACA;AACA,IAAI,IAAI,QAAQ,IAAI,QAAQ,EAAE;AAC9B,MAAM,OAAO,UAAU,CAAC,IAAI,CAAC,CAAC;AAC9B,KAAK;AACL,IAAI,QAAQ,GAAG,QAAQ,GAAG,SAAS,CAAC;AACpC,IAAI,OAAO,MAAM,CAAC;AAClB,GAAG;AACH;AACA,EAAE,SAAS,MAAM,GAAG;AACpB,IAAI,IAAI,OAAO,KAAK,SAAS,EAAE;AAC/B,MAAM,YAAY,CAAC,OAAO,CAAC,CAAC;AAC5B,KAAK;AACL,IAAI,cAAc,GAAG,CAAC,CAAC;AACvB,IAAI,QAAQ,GAAG,YAAY,GAAG,QAAQ,GAAG,OAAO,GAAG,SAAS,CAAC;AAC7D,GAAG;AACH;AACA,EAAE,SAAS,KAAK,GAAG;AACnB,IAAI,OAAO,OAAO,KAAK,SAAS,GAAG,MAAM,GAAG,YAAY,CAAC,GAAG,EAAE,CAAC,CAAC;AAChE,GAAG;AACH;AACA,EAAE,SAAS,SAAS,GAAG;AACvB,IAAI,IAAI,IAAI,GAAG,GAAG,EAAE;AACpB,QAAQ,UAAU,GAAG,YAAY,CAAC,IAAI,CAAC,CAAC;AACxC;AACA,IAAI,QAAQ,GAAG,SAAS,CAAC;AACzB,IAAI,QAAQ,GAAG,IAAI,CAAC;AACpB,IAAI,YAAY,GAAG,IAAI,CAAC;AACxB;AACA,IAAI,IAAI,UAAU,EAAE;AACpB,MAAM,IAAI,OAAO,KAAK,SAAS,EAAE;AACjC,QAAQ,OAAO,WAAW,CAAC,YAAY,CAAC,CAAC;AACzC,OAAO;AACP,MAAM,IAAI,MAAM,EAAE;AAClB;AACA,QAAQ,OAAO,GAAG,UAAU,CAAC,YAAY,EAAE,IAAI,CAAC,CAAC;AACjD,QAAQ,OAAO,UAAU,CAAC,YAAY,CAAC,CAAC;AACxC,OAAO;AACP,KAAK;AACL,IAAI,IAAI,OAAO,KAAK,SAAS,EAAE;AAC/B,MAAM,OAAO,GAAG,UAAU,CAAC,YAAY,EAAE,IAAI,CAAC,CAAC;AAC/C,KAAK;AACL,IAAI,OAAO,MAAM,CAAC;AAClB,GAAG;AACH,EAAE,SAAS,CAAC,MAAM,GAAG,MAAM,CAAC;AAC5B,EAAE,SAAS,CAAC,KAAK,GAAG,KAAK,CAAC;AAC1B,EAAE,OAAO,SAAS,CAAC;AACnB,CAAC;AACD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAAS,QAAQ,CAAC,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE;AACvC,EAAE,IAAI,OAAO,GAAG,IAAI;AACpB,MAAM,QAAQ,GAAG,IAAI,CAAC;AACtB;AACA,EAAE,IAAI,OAAO,IAAI,IAAI,UAAU,EAAE;AACjC,IAAI,MAAM,IAAI,SAAS,CAAC,eAAe,CAAC,CAAC;AACzC,GAAG;AACH,EAAE,IAAI,QAAQ,CAAC,OAAO,CAAC,EAAE;AACzB,IAAI,OAAO,GAAG,SAAS,IAAI,OAAO,GAAG,CAAC,CAAC,OAAO,CAAC,OAAO,GAAG,OAAO,CAAC;AACjE,IAAI,QAAQ,GAAG,UAAU,IAAI,OAAO,GAAG,CAAC,CAAC,OAAO,CAAC,QAAQ,GAAG,QAAQ,CAAC;AACrE,GAAG;AACH,EAAE,OAAO,QAAQ,CAAC,IAAI,EAAE,IAAI,EAAE;AAC9B,IAAI,SAAS,EAAE,OAAO;AACtB,IAAI,SAAS,EAAE,IAAI;AACnB,IAAI,UAAU,EAAE,QAAQ;AACxB,GAAG,CAAC,CAAC;AACL,CAAC;AACD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAAS,QAAQ,CAAC,KAAK,EAAE;AACzB,EAAE,IAAI,IAAI,GAAG,OAAO,KAAK,CAAC;AAC1B,EAAE,OAAO,CAAC,CAAC,KAAK,KAAK,IAAI,IAAI,QAAQ,IAAI,IAAI,IAAI,UAAU,CAAC,CAAC;AAC7D,CAAC;AACD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAAS,YAAY,CAAC,KAAK,EAAE;AAC7B,EAAE,OAAO,CAAC,CAAC,KAAK,IAAI,OAAO,KAAK,IAAI,QAAQ,CAAC;AAC7C,CAAC;AACD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAAS,QAAQ,CAAC,KAAK,EAAE;AACzB,EAAE,OAAO,OAAO,KAAK,IAAI,QAAQ;AACjC,KAAK,YAAY,CAAC,KAAK,CAAC,IAAI,cAAc,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,SAAS,CAAC,CAAC;AACrE,CAAC;AACD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAAS,QAAQ,CAAC,KAAK,EAAE;AACzB,EAAE,IAAI,OAAO,KAAK,IAAI,QAAQ,EAAE;AAChC,IAAI,OAAO,KAAK,CAAC;AACjB,GAAG;AACH,EAAE,IAAI,QAAQ,CAAC,KAAK,CAAC,EAAE;AACvB,IAAI,OAAO,GAAG,CAAC;AACf,GAAG;AACH,EAAE,IAAI,QAAQ,CAAC,KAAK,CAAC,EAAE;AACvB,IAAI,IAAI,KAAK,GAAG,OAAO,KAAK,CAAC,OAAO,IAAI,UAAU,GAAG,KAAK,CAAC,OAAO,EAAE,GAAG,KAAK,CAAC;AAC7E,IAAI,KAAK,GAAG,QAAQ,CAAC,KAAK,CAAC,IAAI,KAAK,GAAG,EAAE,IAAI,KAAK,CAAC;AACnD,GAAG;AACH,EAAE,IAAI,OAAO,KAAK,IAAI,QAAQ,EAAE;AAChC,IAAI,OAAO,KAAK,KAAK,CAAC,GAAG,KAAK,GAAG,CAAC,KAAK,CAAC;AACxC,GAAG;AACH,EAAE,KAAK,GAAG,KAAK,CAAC,OAAO,CAAC,MAAM,EAAE,EAAE,CAAC,CAAC;AACpC,EAAE,IAAI,QAAQ,GAAG,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;AACxC,EAAE,OAAO,CAAC,QAAQ,IAAI,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC;AAC3C,MAAM,YAAY,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,QAAQ,GAAG,CAAC,GAAG,CAAC,CAAC;AACpD,OAAO,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,GAAG,GAAG,CAAC,KAAK,CAAC,CAAC;AAC9C,CAAC;AACD;AACA,mBAAc,GAAG,QAAQ;;ACxazB,SAAS,QAAQ,CAAC,IAAY;EAC1B,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;EAClE,OAAO,CAAC,IAAI;IACR,gFAAgF,CAAC;EACrF,OAAO,OAAO,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC,KAAK,GAAG,EAAE,CAAC;AAChD,CAAC;MAKY,SAAS;;;;mBAWiB,EAAE;;;;;gBAqBD,QAAQ;;;oBAef,IAAI;;kBASN,KAAK;cACVC,KAAI,EAAE;qBACE,KAAK;;iBAEV,EAAE;wBACK,EAAE;0BAEA,QAAQ;;EAM1C,iBAAiB;IACb,IAAI,CAAC,QAAQ;MACT,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,OAAO,CAAC,MAAM,GAAG,CAAC;UACjC,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,MAAM,KAAK,CAAC;UAC7B,EAAE,CAAC;IAEb,IAAI,IAAI,CAAC,cAAc,EAAE;MACrB,MAAM,YAAY,GAAG,IAAI,CAAC,IAAI,KAAK,QAAQ,CAAC;MAE5C,IAAI,YAAY,EAAE;QACd,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,MAAM;UACxB,MAAM,gBAAgB,GAClB,MAAM,CAAC,KAAK,CAAC,QAAQ,CAAC,IAAI,CAAC,cAAwB,CAAC;YACpD,MAAM,CAAC,KAAK,CAAC,QAAQ,CAAC,IAAI,CAAC,cAAwB,CAAC,CAAC;UAEzD,IAAI,gBAAgB;YAAE,MAAM,CAAC,UAAU,GAAG,IAAI,CAAC;SAClD,CAAC,CAAC;OACN;WAAM;QACH,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,EAAE,OAAO,EAAE;UAC7B,OAAO,CAAC,OAAO,CAAC,CAAC,MAAM;YACnB,MAAM,gBAAgB,GAAG,IAAI,CAAC,cAAc,CAAC,QAAQ,CACjD,MAAM,CAAC,KAAK,IAAI,MAAM,CAAC,KAAK,CAC/B,CAAC;YAEF,IAAI,gBAAgB;cAAE,MAAM,CAAC,UAAU,GAAG,IAAI,CAAC;WAClD,CAAC,CAAC;SACN,CAAC,CAAC;OACN;MAED,IAAI,CAAC,MAAM,EAAE,CAAC;KACjB;IAED,MAAM,CAAC,gBAAgB,CAAC,OAAO,EAAE,CAAC,CAAa;MAC3C,MAAM,EAAE,GAAG,CAAC,CAAC,MAAqB,CAAC;MACnC,MAAM,MAAM,GAAG,EAAE,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC;MACzC,IAAI,MAAM,KAAK,IAAI,IAAI,MAAM,KAAK,IAAI,CAAC,SAAS,EAAE;QAC9C,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;OACvB;KACJ,CAAC,CAAC;IAEH,MAAM,CAAC,gBAAgB,CACnB,QAAQ,EACRC,eAAQ,CAAC;MACL,IAAI,CAAC,oBAAoB,EAAE,CAAC;KAC/B,EAAE,GAAG,CAAC,CACV,CAAC;GACL;EACD,gBAAgB;IACZ,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,SAAS,CAAC,aAAa,CAAC,cAAc,CAAC,CAAC;GAChE;EAEO,oBAAoB;IACxB,IAAI,IAAI,CAAC,IAAI,KAAK,QAAQ,IAAI,CAAC,IAAI,CAAC,QAAQ;MAAE,OAAO;IAErD,MAAM,cAAc,GAAG,IAAI,CAAC,SAAS,CAAC,qBAAqB,EAAE,CAAC,KAAK,CAAC;IAEpE,IAAI,cAAc,GAAG,CAAC,CAAC;IACvB,IAAI,mBAAmB,GAAG,CAAC,CAAC;IAE5B,MAAM,iBAAiB,GAAG,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC;IAChE,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,iBAAiB,EAAE,CAAC,EAAE,EAAE;MACxC,mBAAmB,IAAI,QAAQ,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC,CAAC;MACzD,IAAI,mBAAmB,GAAG,cAAc,GAAG,GAAG;QAAE,MAAM;MACtD,cAAc,EAAE,CAAC;KACpB;IAED,IAAI,cAAc,IAAI,iBAAiB;MAAE,cAAc,GAAG,QAAQ,CAAC;IACnE,IAAI,cAAc,GAAG,CAAC;MAAE,cAAc,GAAG,CAAC,CAAC;IAE3C,IAAI,CAAC,cAAc,GAAG,cAAc,CAAC;GACxC;EAEO,cAAc;IAClB,OAAO,IAAI,CAAC,OAAO,CAAC,MAAM,CACtB,CAAC,GAAG,EAAE,IAAI,KAAK;MACX,GAAG,GAAG;MACN,IAAI,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,OAAO,GAAG,CAAC,IAAI,CAAC,CAAC;KAC9C,EACD,EAAE,CACL,CAAC;GACL;EACO,eAAe,CAAC,CAAS;IAC7B,OAAO,IAAI,CAAC,cAAc,EAAE,CAAC,CAAC,CAAC,CAAC,KAAK,IAAI,IAAI,CAAC,cAAc,EAAE,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC;GAC3E;EAEO,cAAc,CAAC,CAAS;IAC5B,OAAO,IAAI,CAAC,cAAc,EAAE,CAAC,CAAC,CAAC,CAAC,KAAK,IAAI,IAAI,CAAC,cAAc,EAAE,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC;GAC3E;EAEO,MAAM;IACV,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,cAAc,EAAE,CAAC,GAAG,CACrC,CAAC,EAAE,UAAU,EAAE,KAAK,UAAU,CACjC,CAAC;IAEF,IAAI,IAAI,CAAC,IAAI,KAAK,QAAQ,EAAE;MACxB,MAAM,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC;MACnD,IAAI,CAAC,KAAK,GAAG,QAAQ,IAAI,CAAC,GAAG,IAAI,CAAC,cAAc,CAAC,QAAQ,CAAC,GAAG,EAAE,CAAC;MAChE,IAAI,CAAC,YAAY;QACb,QAAQ,IAAI,CAAC,GAAG,IAAI,CAAC,eAAe,CAAC,QAAQ,CAAC,GAAG,EAAE,CAAC;KAC3D;SAAM,IAAI,IAAI,CAAC,IAAI,KAAK,OAAO,EAAE;MAC9B,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,QAAQ;SACrB,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC;QACN,OAAO,CAAC,GAAG,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,GAAG,EAAE,CAAC;OAC1C,CAAC;SACD,MAAM,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC;SAC3B,IAAI,CAAC,GAAG,CAAC,CAAC;KAClB;GACJ;EAGD,sBAAsB,CAAC,QAAQ;IAC3B,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;GACpC;EAED,MAAM;IACF,IAAI,cAAc,GAAG,CAAC,CAAC;IACvB,QACIC,QAACC,UAAI,IACD,KAAK,EAAE;QACH,YAAY,EAAE,IAAI;QAClB,sBAAsB,EAAE,IAAI,CAAC,QAAQ;QACrC,yBAAyB,EAAE,CAAC,IAAI,CAAC,QAAQ;OAC5C,EACD,SAAS,EAAE,CAAC,CAAgB;QACxB,IAAI,CAAC,CAAC,GAAG,KAAK,QAAQ;UAAE,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;OAC/C,EACD,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,SAAS,GAAG,EAAiB,CAAC,IAEhD,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,WAAW,IAC3BD,mBACI,KAAK,EAAE;QACH,WAAW,EAAE,IAAI;QACjB,qBAAqB,EAAE,IAAI,CAAC,QAAQ;OACvC,EACD,OAAO,EAAE,IAAI,CAAC,EAAE,IAEf,IAAI,CAAC,KAAK,EACV,IAAI,CAAC,WAAW,KACbA,mBACI,KAAK,EAAE;QACH,iBAAiB,EAAE,IAAI;QACvB,2BAA2B,EAAE,IAAI,CAAC,QAAQ;OAC7C,IAEA,IAAI,CAAC,WAAW,CACb,CACX,CACG,IACR,IAAI,EACRA,iBACI,KAAK,EAAE;QACH,WAAW,EAAE,IAAI;QACjB,qBAAqB,EAAE,IAAI,CAAC,QAAQ;QACpC,kBAAkB,EAAE,IAAI,CAAC,KAAK,KAAK,SAAS;OAC/C,IAEDA,iBAAK,KAAK,EAAC,mBAAmB,IAC1BA,iBACI,KAAK,EAAE;QACH,kBAAkB,EAAE,IAAI;QACxB,0BAA0B,EACtB,IAAI,CAAC,IAAI,KAAK,OAAO;UACrB,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC;QACzB,WAAW,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC;OACrC,IAEA,IAAI,CAAC,IAAI,KAAK,QAAQ;QACjB,IAAI,CAAC,YAAY,IAAI,IAAI,CAAC,WAAW;QACrC,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC;UACrB,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC;UACnB,IAAI,CAAC,CAAC;YAAE,OAAO,IAAI,CAAC;UACpB,IACI,cAAc,IAAI,IAAI,CAAC,cAAc,EACvC;YACE,OAAO,IAAI,CAAC;WACf;UACD,cAAc,EAAE,CAAC;UACjB,QACIA,qBACI,OAAO,EAAE;cACL,IAAI,CAAC,cAAc,EAAE,CAAC,OAAO,CACzB,CAAC,CAAC,EAAE,CAAC;gBACD,IAAI,CAAC,KAAK,CAAC;kBACP,CAAC,CAAC,UAAU;oBACR,KAAK,CAAC;eACjB,CACJ,CAAC;cACF,MAAM,UAAU,GAAG,CACf,MAAoB;gBAEpB,MAAM,CAAC,OAAO;kBACV,MAAM,CAAC,SAAS;sBACV,MAAM,CAAC,OAAO,CAAC,GAAG,CACd,UAAU,CACb;sBACD,SAAS,CAAC;gBACpB,OAAO,MAAM,CAAC;eACjB,CAAC;cACF,IAAI,CAAC,OAAO;gBACR,IAAI,CAAC,OAAO,CAAC,GAAG,CACZ,UAAU,CACb,CAAC;cAEN,IAAI,CAAC,MAAM,EAAE,CAAC;cACd,IAAI,CAAC,oBAAoB,EAAE,CAAC;aAC/B,IAEA,IAAI,CAAC,eAAe,CAAC,CAAC,CAAC,CAClB,EACZ;SACL,CAAC;UACF,IAAI,CAAC,WAAW,EACrB,IAAI,CAAC,cAAc,GAAG,QAAQ;MAC3B,KACI,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM;QACrC,IAAI,CAAC,cACT,OAAO,CACT,EACNA,oBACI,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,EAAE,EAAE,IAAI,CAAC,EAAE,EACX,SAAS,EAAE,CAAC,CAAgB;QACxB,IAAI,CAAC,CAAC,GAAG,KAAK,KAAK;UAAE,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC;OAC9C,EACD,OAAO,EAAE;QACL,MAAM,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAC;QAC1B,IAAI,CAAC,IAAI,CAAC,QAAQ;UACd,QAAQ,CAAC,MAAM,GAAG,CAAC,QAAQ,CAAC,MAAM,CAAC;OAC1C,EACD,IAAI,EAAC,QAAQ,GACP,CACR,EACL,CAAC,IAAI,CAAC,QAAQ,KACXA,0BACI,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,SAAS,EAAE,IAAI,CAAC,EAAE,EAClB,MAAM,EAAE;QACJ,IAAI,CAAC,MAAM,EAAE,CAAC;QACd,IAAI,CAAC,oBAAoB,EAAE,CAAC;OAC/B,GACW,CACnB,EACA,IAAI,CAAC,KAAK,KAAK,SAAS,IAAI,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,KAC9CA,mBAAO,KAAK,EAAC,iBAAiB,EAAC,OAAO,EAAE,IAAI,CAAC,EAAE,IAC3CA,iBACI,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI,EACX,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,4BAA4B,IAElCA,kBAAM,CAAC,EAAC,ymBAAymB,GAAG,CAClnB,EACL,IAAI,CAAC,KAAK,CACP,CACX,CACC,EACNA,mBAAO,IAAI,EAAC,QAAQ,EAAC,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,GAAI,CACxD,EACT;GACL;;;;;;;;","names":["global","uuid","throttle","h","Host"],"sources":["./node_modules/lodash.throttle/index.js","./src/components/components/xpl-select/xpl-select.tsx"],"sourcesContent":["/**\n * lodash (Custom Build) <https://lodash.com/>\n * Build: `lodash modularize exports=\"npm\" -o ./`\n * Copyright jQuery Foundation and other contributors <https://jquery.org/>\n * Released under MIT license <https://lodash.com/license>\n * Based on Underscore.js 1.8.3 <http://underscorejs.org/LICENSE>\n * Copyright Jeremy Ashkenas, DocumentCloud and Investigative Reporters & Editors\n */\n\n/** Used as the `TypeError` message for \"Functions\" methods. */\nvar FUNC_ERROR_TEXT = 'Expected a function';\n\n/** Used as references for various `Number` constants. */\nvar NAN = 0 / 0;\n\n/** `Object#toString` result references. */\nvar symbolTag = '[object Symbol]';\n\n/** Used to match leading and trailing whitespace. */\nvar reTrim = /^\\s+|\\s+$/g;\n\n/** Used to detect bad signed hexadecimal string values. */\nvar reIsBadHex = /^[-+]0x[0-9a-f]+$/i;\n\n/** Used to detect binary string values. */\nvar reIsBinary = /^0b[01]+$/i;\n\n/** Used to detect octal string values. */\nvar reIsOctal = /^0o[0-7]+$/i;\n\n/** Built-in method references without a dependency on `root`. */\nvar freeParseInt = parseInt;\n\n/** Detect free variable `global` from Node.js. */\nvar freeGlobal = typeof global == 'object' && global && global.Object === Object && global;\n\n/** Detect free variable `self`. */\nvar freeSelf = typeof self == 'object' && self && self.Object === Object && self;\n\n/** Used as a reference to the global object. */\nvar root = freeGlobal || freeSelf || Function('return this')();\n\n/** Used for built-in method references. */\nvar objectProto = Object.prototype;\n\n/**\n * Used to resolve the\n * [`toStringTag`](http://ecma-international.org/ecma-262/7.0/#sec-object.prototype.tostring)\n * of values.\n */\nvar objectToString = objectProto.toString;\n\n/* Built-in method references for those with the same name as other `lodash` methods. */\nvar nativeMax = Math.max,\n    nativeMin = Math.min;\n\n/**\n * Gets the timestamp of the number of milliseconds that have elapsed since\n * the Unix epoch (1 January 1970 00:00:00 UTC).\n *\n * @static\n * @memberOf _\n * @since 2.4.0\n * @category Date\n * @returns {number} Returns the timestamp.\n * @example\n *\n * _.defer(function(stamp) {\n *   console.log(_.now() - stamp);\n * }, _.now());\n * // => Logs the number of milliseconds it took for the deferred invocation.\n */\nvar now = function() {\n  return root.Date.now();\n};\n\n/**\n * Creates a debounced function that delays invoking `func` until after `wait`\n * milliseconds have elapsed since the last time the debounced function was\n * invoked. The debounced function comes with a `cancel` method to cancel\n * delayed `func` invocations and a `flush` method to immediately invoke them.\n * Provide `options` to indicate whether `func` should be invoked on the\n * leading and/or trailing edge of the `wait` timeout. The `func` is invoked\n * with the last arguments provided to the debounced function. Subsequent\n * calls to the debounced function return the result of the last `func`\n * invocation.\n *\n * **Note:** If `leading` and `trailing` options are `true`, `func` is\n * invoked on the trailing edge of the timeout only if the debounced function\n * is invoked more than once during the `wait` timeout.\n *\n * If `wait` is `0` and `leading` is `false`, `func` invocation is deferred\n * until to the next tick, similar to `setTimeout` with a timeout of `0`.\n *\n * See [David Corbacho's article](https://css-tricks.com/debouncing-throttling-explained-examples/)\n * for details over the differences between `_.debounce` and `_.throttle`.\n *\n * @static\n * @memberOf _\n * @since 0.1.0\n * @category Function\n * @param {Function} func The function to debounce.\n * @param {number} [wait=0] The number of milliseconds to delay.\n * @param {Object} [options={}] The options object.\n * @param {boolean} [options.leading=false]\n *  Specify invoking on the leading edge of the timeout.\n * @param {number} [options.maxWait]\n *  The maximum time `func` is allowed to be delayed before it's invoked.\n * @param {boolean} [options.trailing=true]\n *  Specify invoking on the trailing edge of the timeout.\n * @returns {Function} Returns the new debounced function.\n * @example\n *\n * // Avoid costly calculations while the window size is in flux.\n * jQuery(window).on('resize', _.debounce(calculateLayout, 150));\n *\n * // Invoke `sendMail` when clicked, debouncing subsequent calls.\n * jQuery(element).on('click', _.debounce(sendMail, 300, {\n *   'leading': true,\n *   'trailing': false\n * }));\n *\n * // Ensure `batchLog` is invoked once after 1 second of debounced calls.\n * var debounced = _.debounce(batchLog, 250, { 'maxWait': 1000 });\n * var source = new EventSource('/stream');\n * jQuery(source).on('message', debounced);\n *\n * // Cancel the trailing debounced invocation.\n * jQuery(window).on('popstate', debounced.cancel);\n */\nfunction debounce(func, wait, options) {\n  var lastArgs,\n      lastThis,\n      maxWait,\n      result,\n      timerId,\n      lastCallTime,\n      lastInvokeTime = 0,\n      leading = false,\n      maxing = false,\n      trailing = true;\n\n  if (typeof func != 'function') {\n    throw new TypeError(FUNC_ERROR_TEXT);\n  }\n  wait = toNumber(wait) || 0;\n  if (isObject(options)) {\n    leading = !!options.leading;\n    maxing = 'maxWait' in options;\n    maxWait = maxing ? nativeMax(toNumber(options.maxWait) || 0, wait) : maxWait;\n    trailing = 'trailing' in options ? !!options.trailing : trailing;\n  }\n\n  function invokeFunc(time) {\n    var args = lastArgs,\n        thisArg = lastThis;\n\n    lastArgs = lastThis = undefined;\n    lastInvokeTime = time;\n    result = func.apply(thisArg, args);\n    return result;\n  }\n\n  function leadingEdge(time) {\n    // Reset any `maxWait` timer.\n    lastInvokeTime = time;\n    // Start the timer for the trailing edge.\n    timerId = setTimeout(timerExpired, wait);\n    // Invoke the leading edge.\n    return leading ? invokeFunc(time) : result;\n  }\n\n  function remainingWait(time) {\n    var timeSinceLastCall = time - lastCallTime,\n        timeSinceLastInvoke = time - lastInvokeTime,\n        result = wait - timeSinceLastCall;\n\n    return maxing ? nativeMin(result, maxWait - timeSinceLastInvoke) : result;\n  }\n\n  function shouldInvoke(time) {\n    var timeSinceLastCall = time - lastCallTime,\n        timeSinceLastInvoke = time - lastInvokeTime;\n\n    // Either this is the first call, activity has stopped and we're at the\n    // trailing edge, the system time has gone backwards and we're treating\n    // it as the trailing edge, or we've hit the `maxWait` limit.\n    return (lastCallTime === undefined || (timeSinceLastCall >= wait) ||\n      (timeSinceLastCall < 0) || (maxing && timeSinceLastInvoke >= maxWait));\n  }\n\n  function timerExpired() {\n    var time = now();\n    if (shouldInvoke(time)) {\n      return trailingEdge(time);\n    }\n    // Restart the timer.\n    timerId = setTimeout(timerExpired, remainingWait(time));\n  }\n\n  function trailingEdge(time) {\n    timerId = undefined;\n\n    // Only invoke if we have `lastArgs` which means `func` has been\n    // debounced at least once.\n    if (trailing && lastArgs) {\n      return invokeFunc(time);\n    }\n    lastArgs = lastThis = undefined;\n    return result;\n  }\n\n  function cancel() {\n    if (timerId !== undefined) {\n      clearTimeout(timerId);\n    }\n    lastInvokeTime = 0;\n    lastArgs = lastCallTime = lastThis = timerId = undefined;\n  }\n\n  function flush() {\n    return timerId === undefined ? result : trailingEdge(now());\n  }\n\n  function debounced() {\n    var time = now(),\n        isInvoking = shouldInvoke(time);\n\n    lastArgs = arguments;\n    lastThis = this;\n    lastCallTime = time;\n\n    if (isInvoking) {\n      if (timerId === undefined) {\n        return leadingEdge(lastCallTime);\n      }\n      if (maxing) {\n        // Handle invocations in a tight loop.\n        timerId = setTimeout(timerExpired, wait);\n        return invokeFunc(lastCallTime);\n      }\n    }\n    if (timerId === undefined) {\n      timerId = setTimeout(timerExpired, wait);\n    }\n    return result;\n  }\n  debounced.cancel = cancel;\n  debounced.flush = flush;\n  return debounced;\n}\n\n/**\n * Creates a throttled function that only invokes `func` at most once per\n * every `wait` milliseconds. The throttled function comes with a `cancel`\n * method to cancel delayed `func` invocations and a `flush` method to\n * immediately invoke them. Provide `options` to indicate whether `func`\n * should be invoked on the leading and/or trailing edge of the `wait`\n * timeout. The `func` is invoked with the last arguments provided to the\n * throttled function. Subsequent calls to the throttled function return the\n * result of the last `func` invocation.\n *\n * **Note:** If `leading` and `trailing` options are `true`, `func` is\n * invoked on the trailing edge of the timeout only if the throttled function\n * is invoked more than once during the `wait` timeout.\n *\n * If `wait` is `0` and `leading` is `false`, `func` invocation is deferred\n * until to the next tick, similar to `setTimeout` with a timeout of `0`.\n *\n * See [David Corbacho's article](https://css-tricks.com/debouncing-throttling-explained-examples/)\n * for details over the differences between `_.throttle` and `_.debounce`.\n *\n * @static\n * @memberOf _\n * @since 0.1.0\n * @category Function\n * @param {Function} func The function to throttle.\n * @param {number} [wait=0] The number of milliseconds to throttle invocations to.\n * @param {Object} [options={}] The options object.\n * @param {boolean} [options.leading=true]\n *  Specify invoking on the leading edge of the timeout.\n * @param {boolean} [options.trailing=true]\n *  Specify invoking on the trailing edge of the timeout.\n * @returns {Function} Returns the new throttled function.\n * @example\n *\n * // Avoid excessively updating the position while scrolling.\n * jQuery(window).on('scroll', _.throttle(updatePosition, 100));\n *\n * // Invoke `renewToken` when the click event is fired, but not more than once every 5 minutes.\n * var throttled = _.throttle(renewToken, 300000, { 'trailing': false });\n * jQuery(element).on('click', throttled);\n *\n * // Cancel the trailing throttled invocation.\n * jQuery(window).on('popstate', throttled.cancel);\n */\nfunction throttle(func, wait, options) {\n  var leading = true,\n      trailing = true;\n\n  if (typeof func != 'function') {\n    throw new TypeError(FUNC_ERROR_TEXT);\n  }\n  if (isObject(options)) {\n    leading = 'leading' in options ? !!options.leading : leading;\n    trailing = 'trailing' in options ? !!options.trailing : trailing;\n  }\n  return debounce(func, wait, {\n    'leading': leading,\n    'maxWait': wait,\n    'trailing': trailing\n  });\n}\n\n/**\n * Checks if `value` is the\n * [language type](http://www.ecma-international.org/ecma-262/7.0/#sec-ecmascript-language-types)\n * of `Object`. (e.g. arrays, functions, objects, regexes, `new Number(0)`, and `new String('')`)\n *\n * @static\n * @memberOf _\n * @since 0.1.0\n * @category Lang\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is an object, else `false`.\n * @example\n *\n * _.isObject({});\n * // => true\n *\n * _.isObject([1, 2, 3]);\n * // => true\n *\n * _.isObject(_.noop);\n * // => true\n *\n * _.isObject(null);\n * // => false\n */\nfunction isObject(value) {\n  var type = typeof value;\n  return !!value && (type == 'object' || type == 'function');\n}\n\n/**\n * Checks if `value` is object-like. A value is object-like if it's not `null`\n * and has a `typeof` result of \"object\".\n *\n * @static\n * @memberOf _\n * @since 4.0.0\n * @category Lang\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is object-like, else `false`.\n * @example\n *\n * _.isObjectLike({});\n * // => true\n *\n * _.isObjectLike([1, 2, 3]);\n * // => true\n *\n * _.isObjectLike(_.noop);\n * // => false\n *\n * _.isObjectLike(null);\n * // => false\n */\nfunction isObjectLike(value) {\n  return !!value && typeof value == 'object';\n}\n\n/**\n * Checks if `value` is classified as a `Symbol` primitive or object.\n *\n * @static\n * @memberOf _\n * @since 4.0.0\n * @category Lang\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is a symbol, else `false`.\n * @example\n *\n * _.isSymbol(Symbol.iterator);\n * // => true\n *\n * _.isSymbol('abc');\n * // => false\n */\nfunction isSymbol(value) {\n  return typeof value == 'symbol' ||\n    (isObjectLike(value) && objectToString.call(value) == symbolTag);\n}\n\n/**\n * Converts `value` to a number.\n *\n * @static\n * @memberOf _\n * @since 4.0.0\n * @category Lang\n * @param {*} value The value to process.\n * @returns {number} Returns the number.\n * @example\n *\n * _.toNumber(3.2);\n * // => 3.2\n *\n * _.toNumber(Number.MIN_VALUE);\n * // => 5e-324\n *\n * _.toNumber(Infinity);\n * // => Infinity\n *\n * _.toNumber('3.2');\n * // => 3.2\n */\nfunction toNumber(value) {\n  if (typeof value == 'number') {\n    return value;\n  }\n  if (isSymbol(value)) {\n    return NAN;\n  }\n  if (isObject(value)) {\n    var other = typeof value.valueOf == 'function' ? value.valueOf() : value;\n    value = isObject(other) ? (other + '') : other;\n  }\n  if (typeof value != 'string') {\n    return value === 0 ? value : +value;\n  }\n  value = value.replace(reTrim, '');\n  var isBinary = reIsBinary.test(value);\n  return (isBinary || reIsOctal.test(value))\n    ? freeParseInt(value.slice(2), isBinary ? 2 : 8)\n    : (reIsBadHex.test(value) ? NAN : +value);\n}\n\nmodule.exports = throttle;\n","import { v4 as uuid } from 'uuid';\nimport {\n    Component,\n    Host,\n    h,\n    Prop,\n    State,\n    Event,\n    EventEmitter,\n    Watch,\n} from '@stencil/core';\nimport throttle from 'lodash.throttle';\nimport type { DropdownItem } from '../xpl-dropdown/dropdownoption';\n\nfunction tagWidth(text: string): number {\n    const context = document.createElement('canvas').getContext('2d');\n    context.font =\n        \"14px apple-system, system-ui, 'Segoe UI', Arial, Helvetica, Roboto, sans-serif\";\n    return context.measureText(text).width + 44; // = text + l/r padding + margin-right\n}\n\n@Component({\n    tag: 'xpl-select',\n})\nexport class XplSelect {\n    /**\n     * An array of choices for the user to choose from.\n     * Each choice should be of the form:\n     * {\n     *   label: string;\n     *   href?: string;\n     *   value?: string;\n     *   isGroupHeading?: boolean;\n     * }\n     */\n    @Prop() choices?: DropdownItem[] = [];\n    /**\n     * Optional text that appears below the input label.\n     */\n    @Prop() description?: string;\n    @Prop() disabled?: boolean;\n    /**\n     * If an empty string (attribute present with no value),\n     * will display visually as an error. If a string is\n     * included, will display visually as an error and include\n     * the value as an error message.\n     */\n    @Prop() error?: string;\n\n    /**\n     * The label that appears above the select dropdown\n     */\n    @Prop() label?: string;\n    /**\n     * Whether to allow a single choice or multiple choices.\n     */\n    @Prop() mode?: 'single' | 'multi' = 'single';\n\n    /**\n     * The name of the hidden input field that contains the selected option's value(s)\n     */\n    @Prop() name?: string;\n\n    @Prop() placeholder: string;\n    /**\n     * Only used in multi-choice selects. If `true`,\n     * badges representing selections that would overflow the\n     * container are replaced with \"+x more\" (where x is the\n     * number not shown). If `false`, the container's height will\n     * adjust to show all badges representing selections.\n     */\n    @Prop() truncate?: boolean = true;\n\n    @Prop() selectedValues?: string | string[];\n\n    /**\n     * Emits the value of the selected option in the select menu on change\n     */\n    @Event() selectChange: EventEmitter<string>;\n\n    @State() active: boolean = false;\n    @State() id: string = uuid();\n    @State() keepFocus: boolean = false;\n    @State() selected: boolean[];\n    @State() value: string = '';\n    @State() displayValue: string = '';\n    // infinity isn't real, it's just a mathematical construct, it can't hurt you\n    @State() visibleChoices: number = Infinity;\n\n    private container!: HTMLElement;\n\n    private dropdown: HTMLXplDropdownElement;\n\n    componentWillLoad() {\n        this.selected =\n            this.choices && this.choices.length > 0\n                ? this.choices.map(() => false)\n                : [];\n\n        if (this.selectedValues) {\n            const isSingleMode = this.mode === 'single';\n\n            if (isSingleMode) {\n                this.choices.forEach((choice) => {\n                    const shouldBeSelected =\n                        choice.value.includes(this.selectedValues as string) ||\n                        choice.label.includes(this.selectedValues as string);\n\n                    if (shouldBeSelected) choice.isSelected = true;\n                });\n            } else {\n                this.choices.forEach(({ options }) => {\n                    options.forEach((option) => {\n                        const shouldBeSelected = this.selectedValues.includes(\n                            option.value || option.label\n                        );\n\n                        if (shouldBeSelected) option.isSelected = true;\n                    });\n                });\n            }\n\n            this.update();\n        }\n\n        window.addEventListener('click', (e: MouseEvent) => {\n            const el = e.target as HTMLElement;\n            const select = el.closest('.xpl-select');\n            if (select === null || select !== this.container) {\n                this.active = false;\n            }\n        });\n\n        window.addEventListener(\n            'resize',\n            throttle(() => {\n                this.maybeTruncateChoices();\n            }, 250)\n        );\n    }\n    componentDidLoad() {\n        this.dropdown = this.container.querySelector('xpl-dropdown');\n    }\n\n    private maybeTruncateChoices(): void {\n        if (this.mode === 'single' || !this.truncate) return;\n\n        const containerWidth = this.container.getBoundingClientRect().width;\n\n        let visibleChoices = 0;\n        let visibleChoicesWidth = 0;\n\n        const actualNumSelected = this.selected.filter((a) => a).length;\n        for (let i = 0; i < actualNumSelected; i++) {\n            visibleChoicesWidth += tagWidth(this.getDisplayValue(i));\n            if (visibleChoicesWidth > containerWidth - 140) break;\n            visibleChoices++;\n        }\n\n        if (visibleChoices >= actualNumSelected) visibleChoices = Infinity;\n        if (visibleChoices < 1) visibleChoices = 1;\n\n        this.visibleChoices = visibleChoices;\n    }\n\n    private flattenChoices(): DropdownItem[] {\n        return this.choices.reduce(\n            (acc, curr) => [\n                ...acc,\n                ...(curr.groupName ? curr.options : [curr]),\n            ],\n            []\n        );\n    }\n    private getDisplayValue(i: number): string {\n        return this.flattenChoices()[i].label || this.flattenChoices()[i].value;\n    }\n\n    private getActualValue(i: number): string {\n        return this.flattenChoices()[i].value || this.flattenChoices()[i].label;\n    }\n\n    private update() {\n        this.selected = this.flattenChoices().map(\n            ({ isSelected }) => isSelected\n        );\n\n        if (this.mode === 'single') {\n            const selected = this.selected.findIndex((v) => v);\n            this.value = selected >= 0 ? this.getActualValue(selected) : '';\n            this.displayValue =\n                selected >= 0 ? this.getDisplayValue(selected) : '';\n        } else if (this.mode === 'multi') {\n            this.value = this.selected\n                .map((v, i) => {\n                    return v ? this.getActualValue(i) : '';\n                })\n                .filter((v) => v.length > 0)\n                .join('|');\n        }\n    }\n\n    @Watch('value')\n    handleValueStateChange(newValue) {\n        this.selectChange.emit(newValue);\n    }\n\n    render() {\n        let visibleChoices = 0;\n        return (\n            <Host\n                class={{\n                    'xpl-select': true,\n                    'xpl-select--disabled': this.disabled,\n                    'xpl-select--no-truncate': !this.truncate,\n                }}\n                onKeyDown={(e: KeyboardEvent) => {\n                    if (e.key === 'Escape') this.active = false;\n                }}\n                ref={(el) => (this.container = el as HTMLElement)}\n            >\n                {this.label || this.description ? (\n                    <label\n                        class={{\n                            'xpl-label': true,\n                            'xpl-label--disabled': this.disabled,\n                        }}\n                        htmlFor={this.id}\n                    >\n                        {this.label}\n                        {this.description && (\n                            <small\n                                class={{\n                                    'xpl-description': true,\n                                    'xpl-description--disabled': this.disabled,\n                                }}\n                            >\n                                {this.description}\n                            </small>\n                        )}\n                    </label>\n                ) : null}\n                <div\n                    class={{\n                        'xpl-input': true,\n                        'xpl-input--disabled': this.disabled,\n                        'xpl-input--error': this.error !== undefined,\n                    }}\n                >\n                    <div class=\"xpl-input-wrapper\">\n                        <div\n                            class={{\n                                'xpl-select-value': true,\n                                'xpl-select-value--active':\n                                    this.mode === 'multi' &&\n                                    this.value.length > 0,\n                                'has-value': this.value.length > 0,\n                            }}\n                        >\n                            {this.mode === 'single'\n                                ? this.displayValue || this.placeholder\n                                : this.value.length > 0\n                                ? this.selected.map((v, i) => {\n                                      if (!v) return null;\n                                      if (\n                                          visibleChoices >= this.visibleChoices\n                                      ) {\n                                          return null;\n                                      }\n                                      visibleChoices++;\n                                      return (\n                                          <xpl-tag\n                                              onClose={() => {\n                                                  this.flattenChoices().forEach(\n                                                      (v, j) => {\n                                                          if (i === j)\n                                                              v.isSelected =\n                                                                  false;\n                                                      }\n                                                  );\n                                                  const mapOptions = (\n                                                      option: DropdownItem\n                                                  ): DropdownItem => {\n                                                      option.options =\n                                                          option.groupName\n                                                              ? option.options.map(\n                                                                    mapOptions\n                                                                )\n                                                              : undefined;\n                                                      return option;\n                                                  };\n                                                  this.choices =\n                                                      this.choices.map(\n                                                          mapOptions\n                                                      );\n\n                                                  this.update();\n                                                  this.maybeTruncateChoices();\n                                              }}\n                                          >\n                                              {this.getDisplayValue(i)}\n                                          </xpl-tag>\n                                      );\n                                  })\n                                : this.placeholder}\n                            {this.visibleChoices < Infinity &&\n                                `+ ${\n                                    this.selected.filter((a) => a).length -\n                                    this.visibleChoices\n                                } more`}\n                        </div>\n                        <button\n                            disabled={this.disabled}\n                            id={this.id}\n                            onKeyDown={(e: KeyboardEvent) => {\n                                if (e.key === 'Tab') this.keepFocus = true;\n                            }}\n                            onClick={() => {\n                                const { dropdown } = this;\n                                if (!this.disabled)\n                                    dropdown.isOpen = !dropdown.isOpen;\n                            }}\n                            type=\"button\"\n                        ></button>\n                    </div>\n                    {!this.disabled && (\n                        <xpl-dropdown\n                            options={this.choices}\n                            mode={this.mode}\n                            triggerId={this.id}\n                            update={() => {\n                                this.update();\n                                this.maybeTruncateChoices();\n                            }}\n                        ></xpl-dropdown>\n                    )}\n                    {this.error !== undefined && this.error.length > 0 && (\n                        <label class=\"xpl-input-error\" htmlFor={this.id}>\n                            <svg\n                                width=\"10\"\n                                height=\"11\"\n                                viewBox=\"0 0 10 11\"\n                                fill=\"none\"\n                                xmlns=\"http://www.w3.org/2000/svg\"\n                            >\n                                <path d=\"M9.84375 5.25C9.84375 2.59375 7.65625 0.40625 5 0.40625C2.32422 0.40625 0.15625 2.59375 0.15625 5.25C0.15625 7.92578 2.32422 10.0938 5 10.0938C7.65625 10.0938 9.84375 7.92578 9.84375 5.25ZM5 6.22656C5.48828 6.22656 5.89844 6.63672 5.89844 7.125C5.89844 7.63281 5.48828 8.02344 5 8.02344C4.49219 8.02344 4.10156 7.63281 4.10156 7.125C4.10156 6.63672 4.49219 6.22656 5 6.22656ZM4.14062 3.00391C4.12109 2.86719 4.23828 2.75 4.375 2.75H5.60547C5.74219 2.75 5.85938 2.86719 5.83984 3.00391L5.70312 5.66016C5.68359 5.79688 5.58594 5.875 5.46875 5.875H4.51172C4.39453 5.875 4.29688 5.79688 4.27734 5.66016L4.14062 3.00391Z\" />\n                            </svg>\n                            {this.error}\n                        </label>\n                    )}\n                </div>\n                <input type=\"hidden\" name={this.name} value={this.value} />\n            </Host>\n        );\n    }\n}\n"],"version":3}
+{"file":"xpl-select.entry.cjs.js","mappings":"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","names":["global","uuid","throttle","h","Host"],"sources":["./node_modules/lodash.throttle/index.js","./src/components/components/xpl-select/xpl-select.tsx"],"sourcesContent":["/**\n * lodash (Custom Build) <https://lodash.com/>\n * Build: `lodash modularize exports=\"npm\" -o ./`\n * Copyright jQuery Foundation and other contributors <https://jquery.org/>\n * Released under MIT license <https://lodash.com/license>\n * Based on Underscore.js 1.8.3 <http://underscorejs.org/LICENSE>\n * Copyright Jeremy Ashkenas, DocumentCloud and Investigative Reporters & Editors\n */\n\n/** Used as the `TypeError` message for \"Functions\" methods. */\nvar FUNC_ERROR_TEXT = 'Expected a function';\n\n/** Used as references for various `Number` constants. */\nvar NAN = 0 / 0;\n\n/** `Object#toString` result references. */\nvar symbolTag = '[object Symbol]';\n\n/** Used to match leading and trailing whitespace. */\nvar reTrim = /^\\s+|\\s+$/g;\n\n/** Used to detect bad signed hexadecimal string values. */\nvar reIsBadHex = /^[-+]0x[0-9a-f]+$/i;\n\n/** Used to detect binary string values. */\nvar reIsBinary = /^0b[01]+$/i;\n\n/** Used to detect octal string values. */\nvar reIsOctal = /^0o[0-7]+$/i;\n\n/** Built-in method references without a dependency on `root`. */\nvar freeParseInt = parseInt;\n\n/** Detect free variable `global` from Node.js. */\nvar freeGlobal = typeof global == 'object' && global && global.Object === Object && global;\n\n/** Detect free variable `self`. */\nvar freeSelf = typeof self == 'object' && self && self.Object === Object && self;\n\n/** Used as a reference to the global object. */\nvar root = freeGlobal || freeSelf || Function('return this')();\n\n/** Used for built-in method references. */\nvar objectProto = Object.prototype;\n\n/**\n * Used to resolve the\n * [`toStringTag`](http://ecma-international.org/ecma-262/7.0/#sec-object.prototype.tostring)\n * of values.\n */\nvar objectToString = objectProto.toString;\n\n/* Built-in method references for those with the same name as other `lodash` methods. */\nvar nativeMax = Math.max,\n    nativeMin = Math.min;\n\n/**\n * Gets the timestamp of the number of milliseconds that have elapsed since\n * the Unix epoch (1 January 1970 00:00:00 UTC).\n *\n * @static\n * @memberOf _\n * @since 2.4.0\n * @category Date\n * @returns {number} Returns the timestamp.\n * @example\n *\n * _.defer(function(stamp) {\n *   console.log(_.now() - stamp);\n * }, _.now());\n * // => Logs the number of milliseconds it took for the deferred invocation.\n */\nvar now = function() {\n  return root.Date.now();\n};\n\n/**\n * Creates a debounced function that delays invoking `func` until after `wait`\n * milliseconds have elapsed since the last time the debounced function was\n * invoked. The debounced function comes with a `cancel` method to cancel\n * delayed `func` invocations and a `flush` method to immediately invoke them.\n * Provide `options` to indicate whether `func` should be invoked on the\n * leading and/or trailing edge of the `wait` timeout. The `func` is invoked\n * with the last arguments provided to the debounced function. Subsequent\n * calls to the debounced function return the result of the last `func`\n * invocation.\n *\n * **Note:** If `leading` and `trailing` options are `true`, `func` is\n * invoked on the trailing edge of the timeout only if the debounced function\n * is invoked more than once during the `wait` timeout.\n *\n * If `wait` is `0` and `leading` is `false`, `func` invocation is deferred\n * until to the next tick, similar to `setTimeout` with a timeout of `0`.\n *\n * See [David Corbacho's article](https://css-tricks.com/debouncing-throttling-explained-examples/)\n * for details over the differences between `_.debounce` and `_.throttle`.\n *\n * @static\n * @memberOf _\n * @since 0.1.0\n * @category Function\n * @param {Function} func The function to debounce.\n * @param {number} [wait=0] The number of milliseconds to delay.\n * @param {Object} [options={}] The options object.\n * @param {boolean} [options.leading=false]\n *  Specify invoking on the leading edge of the timeout.\n * @param {number} [options.maxWait]\n *  The maximum time `func` is allowed to be delayed before it's invoked.\n * @param {boolean} [options.trailing=true]\n *  Specify invoking on the trailing edge of the timeout.\n * @returns {Function} Returns the new debounced function.\n * @example\n *\n * // Avoid costly calculations while the window size is in flux.\n * jQuery(window).on('resize', _.debounce(calculateLayout, 150));\n *\n * // Invoke `sendMail` when clicked, debouncing subsequent calls.\n * jQuery(element).on('click', _.debounce(sendMail, 300, {\n *   'leading': true,\n *   'trailing': false\n * }));\n *\n * // Ensure `batchLog` is invoked once after 1 second of debounced calls.\n * var debounced = _.debounce(batchLog, 250, { 'maxWait': 1000 });\n * var source = new EventSource('/stream');\n * jQuery(source).on('message', debounced);\n *\n * // Cancel the trailing debounced invocation.\n * jQuery(window).on('popstate', debounced.cancel);\n */\nfunction debounce(func, wait, options) {\n  var lastArgs,\n      lastThis,\n      maxWait,\n      result,\n      timerId,\n      lastCallTime,\n      lastInvokeTime = 0,\n      leading = false,\n      maxing = false,\n      trailing = true;\n\n  if (typeof func != 'function') {\n    throw new TypeError(FUNC_ERROR_TEXT);\n  }\n  wait = toNumber(wait) || 0;\n  if (isObject(options)) {\n    leading = !!options.leading;\n    maxing = 'maxWait' in options;\n    maxWait = maxing ? nativeMax(toNumber(options.maxWait) || 0, wait) : maxWait;\n    trailing = 'trailing' in options ? !!options.trailing : trailing;\n  }\n\n  function invokeFunc(time) {\n    var args = lastArgs,\n        thisArg = lastThis;\n\n    lastArgs = lastThis = undefined;\n    lastInvokeTime = time;\n    result = func.apply(thisArg, args);\n    return result;\n  }\n\n  function leadingEdge(time) {\n    // Reset any `maxWait` timer.\n    lastInvokeTime = time;\n    // Start the timer for the trailing edge.\n    timerId = setTimeout(timerExpired, wait);\n    // Invoke the leading edge.\n    return leading ? invokeFunc(time) : result;\n  }\n\n  function remainingWait(time) {\n    var timeSinceLastCall = time - lastCallTime,\n        timeSinceLastInvoke = time - lastInvokeTime,\n        result = wait - timeSinceLastCall;\n\n    return maxing ? nativeMin(result, maxWait - timeSinceLastInvoke) : result;\n  }\n\n  function shouldInvoke(time) {\n    var timeSinceLastCall = time - lastCallTime,\n        timeSinceLastInvoke = time - lastInvokeTime;\n\n    // Either this is the first call, activity has stopped and we're at the\n    // trailing edge, the system time has gone backwards and we're treating\n    // it as the trailing edge, or we've hit the `maxWait` limit.\n    return (lastCallTime === undefined || (timeSinceLastCall >= wait) ||\n      (timeSinceLastCall < 0) || (maxing && timeSinceLastInvoke >= maxWait));\n  }\n\n  function timerExpired() {\n    var time = now();\n    if (shouldInvoke(time)) {\n      return trailingEdge(time);\n    }\n    // Restart the timer.\n    timerId = setTimeout(timerExpired, remainingWait(time));\n  }\n\n  function trailingEdge(time) {\n    timerId = undefined;\n\n    // Only invoke if we have `lastArgs` which means `func` has been\n    // debounced at least once.\n    if (trailing && lastArgs) {\n      return invokeFunc(time);\n    }\n    lastArgs = lastThis = undefined;\n    return result;\n  }\n\n  function cancel() {\n    if (timerId !== undefined) {\n      clearTimeout(timerId);\n    }\n    lastInvokeTime = 0;\n    lastArgs = lastCallTime = lastThis = timerId = undefined;\n  }\n\n  function flush() {\n    return timerId === undefined ? result : trailingEdge(now());\n  }\n\n  function debounced() {\n    var time = now(),\n        isInvoking = shouldInvoke(time);\n\n    lastArgs = arguments;\n    lastThis = this;\n    lastCallTime = time;\n\n    if (isInvoking) {\n      if (timerId === undefined) {\n        return leadingEdge(lastCallTime);\n      }\n      if (maxing) {\n        // Handle invocations in a tight loop.\n        timerId = setTimeout(timerExpired, wait);\n        return invokeFunc(lastCallTime);\n      }\n    }\n    if (timerId === undefined) {\n      timerId = setTimeout(timerExpired, wait);\n    }\n    return result;\n  }\n  debounced.cancel = cancel;\n  debounced.flush = flush;\n  return debounced;\n}\n\n/**\n * Creates a throttled function that only invokes `func` at most once per\n * every `wait` milliseconds. The throttled function comes with a `cancel`\n * method to cancel delayed `func` invocations and a `flush` method to\n * immediately invoke them. Provide `options` to indicate whether `func`\n * should be invoked on the leading and/or trailing edge of the `wait`\n * timeout. The `func` is invoked with the last arguments provided to the\n * throttled function. Subsequent calls to the throttled function return the\n * result of the last `func` invocation.\n *\n * **Note:** If `leading` and `trailing` options are `true`, `func` is\n * invoked on the trailing edge of the timeout only if the throttled function\n * is invoked more than once during the `wait` timeout.\n *\n * If `wait` is `0` and `leading` is `false`, `func` invocation is deferred\n * until to the next tick, similar to `setTimeout` with a timeout of `0`.\n *\n * See [David Corbacho's article](https://css-tricks.com/debouncing-throttling-explained-examples/)\n * for details over the differences between `_.throttle` and `_.debounce`.\n *\n * @static\n * @memberOf _\n * @since 0.1.0\n * @category Function\n * @param {Function} func The function to throttle.\n * @param {number} [wait=0] The number of milliseconds to throttle invocations to.\n * @param {Object} [options={}] The options object.\n * @param {boolean} [options.leading=true]\n *  Specify invoking on the leading edge of the timeout.\n * @param {boolean} [options.trailing=true]\n *  Specify invoking on the trailing edge of the timeout.\n * @returns {Function} Returns the new throttled function.\n * @example\n *\n * // Avoid excessively updating the position while scrolling.\n * jQuery(window).on('scroll', _.throttle(updatePosition, 100));\n *\n * // Invoke `renewToken` when the click event is fired, but not more than once every 5 minutes.\n * var throttled = _.throttle(renewToken, 300000, { 'trailing': false });\n * jQuery(element).on('click', throttled);\n *\n * // Cancel the trailing throttled invocation.\n * jQuery(window).on('popstate', throttled.cancel);\n */\nfunction throttle(func, wait, options) {\n  var leading = true,\n      trailing = true;\n\n  if (typeof func != 'function') {\n    throw new TypeError(FUNC_ERROR_TEXT);\n  }\n  if (isObject(options)) {\n    leading = 'leading' in options ? !!options.leading : leading;\n    trailing = 'trailing' in options ? !!options.trailing : trailing;\n  }\n  return debounce(func, wait, {\n    'leading': leading,\n    'maxWait': wait,\n    'trailing': trailing\n  });\n}\n\n/**\n * Checks if `value` is the\n * [language type](http://www.ecma-international.org/ecma-262/7.0/#sec-ecmascript-language-types)\n * of `Object`. (e.g. arrays, functions, objects, regexes, `new Number(0)`, and `new String('')`)\n *\n * @static\n * @memberOf _\n * @since 0.1.0\n * @category Lang\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is an object, else `false`.\n * @example\n *\n * _.isObject({});\n * // => true\n *\n * _.isObject([1, 2, 3]);\n * // => true\n *\n * _.isObject(_.noop);\n * // => true\n *\n * _.isObject(null);\n * // => false\n */\nfunction isObject(value) {\n  var type = typeof value;\n  return !!value && (type == 'object' || type == 'function');\n}\n\n/**\n * Checks if `value` is object-like. A value is object-like if it's not `null`\n * and has a `typeof` result of \"object\".\n *\n * @static\n * @memberOf _\n * @since 4.0.0\n * @category Lang\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is object-like, else `false`.\n * @example\n *\n * _.isObjectLike({});\n * // => true\n *\n * _.isObjectLike([1, 2, 3]);\n * // => true\n *\n * _.isObjectLike(_.noop);\n * // => false\n *\n * _.isObjectLike(null);\n * // => false\n */\nfunction isObjectLike(value) {\n  return !!value && typeof value == 'object';\n}\n\n/**\n * Checks if `value` is classified as a `Symbol` primitive or object.\n *\n * @static\n * @memberOf _\n * @since 4.0.0\n * @category Lang\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is a symbol, else `false`.\n * @example\n *\n * _.isSymbol(Symbol.iterator);\n * // => true\n *\n * _.isSymbol('abc');\n * // => false\n */\nfunction isSymbol(value) {\n  return typeof value == 'symbol' ||\n    (isObjectLike(value) && objectToString.call(value) == symbolTag);\n}\n\n/**\n * Converts `value` to a number.\n *\n * @static\n * @memberOf _\n * @since 4.0.0\n * @category Lang\n * @param {*} value The value to process.\n * @returns {number} Returns the number.\n * @example\n *\n * _.toNumber(3.2);\n * // => 3.2\n *\n * _.toNumber(Number.MIN_VALUE);\n * // => 5e-324\n *\n * _.toNumber(Infinity);\n * // => Infinity\n *\n * _.toNumber('3.2');\n * // => 3.2\n */\nfunction toNumber(value) {\n  if (typeof value == 'number') {\n    return value;\n  }\n  if (isSymbol(value)) {\n    return NAN;\n  }\n  if (isObject(value)) {\n    var other = typeof value.valueOf == 'function' ? value.valueOf() : value;\n    value = isObject(other) ? (other + '') : other;\n  }\n  if (typeof value != 'string') {\n    return value === 0 ? value : +value;\n  }\n  value = value.replace(reTrim, '');\n  var isBinary = reIsBinary.test(value);\n  return (isBinary || reIsOctal.test(value))\n    ? freeParseInt(value.slice(2), isBinary ? 2 : 8)\n    : (reIsBadHex.test(value) ? NAN : +value);\n}\n\nmodule.exports = throttle;\n","import { v4 as uuid } from 'uuid';\nimport {\n    Component,\n    Host,\n    h,\n    Prop,\n    State,\n    Event,\n    EventEmitter,\n    Watch,\n} from '@stencil/core';\nimport throttle from 'lodash.throttle';\nimport type { DropdownItem } from '../xpl-dropdown/dropdownoption';\n\nfunction tagWidth(text: string): number {\n    const context = document.createElement('canvas').getContext('2d');\n    context.font =\n        \"14px apple-system, system-ui, 'Segoe UI', Arial, Helvetica, Roboto, sans-serif\";\n    return context.measureText(text).width + 44; // = text + l/r padding + margin-right\n}\n\n@Component({\n    tag: 'xpl-select',\n})\nexport class XplSelect {\n    /**\n     * An array of choices for the user to choose from.\n     * Each choice should be of the form:\n     * {\n     *   label: string;\n     *   href?: string;\n     *   value?: string;\n     *   isGroupHeading?: boolean;\n     * }\n     */\n    @Prop() choices?: DropdownItem[] = [];\n\n    /**\n     *\n     * @param _choices\n     */\n    @Watch('choices')\n    onChoicesChanged(_choices: DropdownItem[]) {\n        this.update();\n    }\n\n    /**\n     * Optional text that appears below the input label.\n     */\n    @Prop() description?: string;\n    @Prop() disabled?: boolean;\n    /**\n     * If an empty string (attribute present with no value),\n     * will display visually as an error. If a string is\n     * included, will display visually as an error and include\n     * the value as an error message.\n     */\n    @Prop() error?: string;\n\n    /**\n     * The label that appears above the select dropdown\n     */\n    @Prop() label?: string;\n    /**\n     * Whether to allow a single choice or multiple choices.\n     */\n    @Prop() mode?: 'single' | 'multi' = 'single';\n\n    /**\n     * The name of the hidden input field that contains the selected option's value(s)\n     */\n    @Prop() name?: string;\n\n    @Prop() placeholder: string;\n    /**\n     * Only used in multi-choice selects. If `true`,\n     * badges representing selections that would overflow the\n     * container are replaced with \"+x more\" (where x is the\n     * number not shown). If `false`, the container's height will\n     * adjust to show all badges representing selections.\n     */\n    @Prop() truncate?: boolean = true;\n\n    @Prop() selectedValues?: string | string[];\n\n    /**\n     * Emits the value of the selected option in the select menu on change\n     */\n    @Event() selectChange: EventEmitter<string>;\n\n    @State() active: boolean = false;\n    @State() id: string = uuid();\n    @State() keepFocus: boolean = false;\n    @State() selected: boolean[];\n    @State() value: string = '';\n    @State() displayValue: string = '';\n    // infinity isn't real, it's just a mathematical construct, it can't hurt you\n    @State() visibleChoices: number = Infinity;\n\n    private container!: HTMLElement;\n\n    private dropdown: HTMLXplDropdownElement;\n\n    componentWillLoad() {\n        this.selected =\n            this.choices && this.choices.length > 0\n                ? this.choices.map(() => false)\n                : [];\n\n        if (this.selectedValues) {\n            const isSingleMode = this.mode === 'single';\n\n            if (isSingleMode) {\n                const selectedValue = this.selectedValues as string;\n                const shouldBeSelected = this.choices.find(\n                    (choice) =>\n                        (choice.value !== undefined\n                            ? choice.value\n                            : choice.label) === selectedValue\n                );\n                if (shouldBeSelected !== undefined)\n                    shouldBeSelected.isSelected = true;\n            } else {\n                this.choices.forEach(({ options }) => {\n                    options.forEach((option) => {\n                        const shouldBeSelected = this.selectedValues.includes(\n                            option.value || option.label\n                        );\n\n                        if (shouldBeSelected) option.isSelected = true;\n                    });\n                });\n            }\n\n            this.update();\n        }\n\n        window.addEventListener('click', (e: MouseEvent) => {\n            const el = e.target as HTMLElement;\n            const select = el.closest('.xpl-select');\n            if (select === null || select !== this.container) {\n                this.active = false;\n            }\n        });\n\n        window.addEventListener(\n            'resize',\n            throttle(() => {\n                this.maybeTruncateChoices();\n            }, 250)\n        );\n    }\n    componentDidLoad() {\n        this.dropdown = this.container.querySelector('xpl-dropdown');\n    }\n\n    private maybeTruncateChoices(): void {\n        if (this.mode === 'single' || !this.truncate) return;\n\n        const containerWidth = this.container.getBoundingClientRect().width;\n\n        let visibleChoices = 0;\n        let visibleChoicesWidth = 0;\n\n        const actualNumSelected = this.selected.filter((a) => a).length;\n        for (let i = 0; i < actualNumSelected; i++) {\n            visibleChoicesWidth += tagWidth(this.getDisplayValue(i));\n            if (visibleChoicesWidth > containerWidth - 140) break;\n            visibleChoices++;\n        }\n\n        if (visibleChoices >= actualNumSelected) visibleChoices = Infinity;\n        if (visibleChoices < 1) visibleChoices = 1;\n\n        this.visibleChoices = visibleChoices;\n    }\n\n    private flattenChoices(): DropdownItem[] {\n        return this.choices.reduce(\n            (acc, curr) => [\n                ...acc,\n                ...(curr.groupName ? curr.options : [curr]),\n            ],\n            []\n        );\n    }\n    private getDisplayValue(i: number): string {\n        return this.flattenChoices()[i].label || this.flattenChoices()[i].value;\n    }\n\n    private getActualValue(i: number): string {\n        return this.flattenChoices()[i].value || this.flattenChoices()[i].label;\n    }\n\n    private update() {\n        this.selected = this.flattenChoices().map(\n            ({ isSelected }) => isSelected\n        );\n\n        if (this.mode === 'single') {\n            const selected = this.selected.findIndex((v) => v);\n            this.value = selected >= 0 ? this.getActualValue(selected) : '';\n            this.displayValue =\n                selected >= 0 ? this.getDisplayValue(selected) : '';\n        } else if (this.mode === 'multi') {\n            this.value = this.selected\n                .map((v, i) => {\n                    return v ? this.getActualValue(i) : '';\n                })\n                .filter((v) => v.length > 0)\n                .join('|');\n        }\n    }\n\n    @Watch('value')\n    handleValueStateChange(newValue) {\n        this.selectChange.emit(newValue);\n    }\n\n    render() {\n        let visibleChoices = 0;\n        return (\n            <Host\n                class={{\n                    'xpl-select': true,\n                    'xpl-select--disabled': this.disabled,\n                    'xpl-select--no-truncate': !this.truncate,\n                }}\n                onKeyDown={(e: KeyboardEvent) => {\n                    if (e.key === 'Escape') this.active = false;\n                }}\n                ref={(el) => (this.container = el as HTMLElement)}\n            >\n                {this.label || this.description ? (\n                    <label\n                        class={{\n                            'xpl-label': true,\n                            'xpl-label--disabled': this.disabled,\n                        }}\n                        htmlFor={this.id}\n                    >\n                        {this.label}\n                        {this.description && (\n                            <small\n                                class={{\n                                    'xpl-description': true,\n                                    'xpl-description--disabled': this.disabled,\n                                }}\n                            >\n                                {this.description}\n                            </small>\n                        )}\n                    </label>\n                ) : null}\n                <div\n                    class={{\n                        'xpl-input': true,\n                        'xpl-input--disabled': this.disabled,\n                        'xpl-input--error': this.error !== undefined,\n                    }}\n                >\n                    <div class=\"xpl-input-wrapper\">\n                        <div\n                            class={{\n                                'xpl-select-value': true,\n                                'xpl-select-value--active':\n                                    this.mode === 'multi' &&\n                                    this.value.length > 0,\n                                'has-value': this.value.length > 0,\n                            }}\n                        >\n                            {this.mode === 'single'\n                                ? this.displayValue || this.placeholder\n                                : this.value.length > 0\n                                ? this.selected.map((v, i) => {\n                                      if (!v) return null;\n                                      if (\n                                          visibleChoices >= this.visibleChoices\n                                      ) {\n                                          return null;\n                                      }\n                                      visibleChoices++;\n                                      return (\n                                          <xpl-tag\n                                              onClose={() => {\n                                                  this.flattenChoices().forEach(\n                                                      (v, j) => {\n                                                          if (i === j)\n                                                              v.isSelected =\n                                                                  false;\n                                                      }\n                                                  );\n                                                  const mapOptions = (\n                                                      option: DropdownItem\n                                                  ): DropdownItem => {\n                                                      option.options =\n                                                          option.groupName\n                                                              ? option.options.map(\n                                                                    mapOptions\n                                                                )\n                                                              : undefined;\n                                                      return option;\n                                                  };\n                                                  this.choices =\n                                                      this.choices.map(\n                                                          mapOptions\n                                                      );\n\n                                                  this.update();\n                                                  this.maybeTruncateChoices();\n                                              }}\n                                          >\n                                              {this.getDisplayValue(i)}\n                                          </xpl-tag>\n                                      );\n                                  })\n                                : this.placeholder}\n                            {this.visibleChoices < Infinity &&\n                                `+ ${\n                                    this.selected.filter((a) => a).length -\n                                    this.visibleChoices\n                                } more`}\n                        </div>\n                        <button\n                            disabled={this.disabled}\n                            id={this.id}\n                            onKeyDown={(e: KeyboardEvent) => {\n                                if (e.key === 'Tab') this.keepFocus = true;\n                            }}\n                            onClick={() => {\n                                const { dropdown } = this;\n                                if (!this.disabled)\n                                    dropdown.isOpen = !dropdown.isOpen;\n                            }}\n                            type=\"button\"\n                        ></button>\n                    </div>\n                    {!this.disabled && (\n                        <xpl-dropdown\n                            options={this.choices}\n                            mode={this.mode}\n                            triggerId={this.id}\n                            update={() => {\n                                this.update();\n                                this.maybeTruncateChoices();\n                            }}\n                        ></xpl-dropdown>\n                    )}\n                    {this.error !== undefined && this.error.length > 0 && (\n                        <label class=\"xpl-input-error\" htmlFor={this.id}>\n                            <svg\n                                width=\"10\"\n                                height=\"11\"\n                                viewBox=\"0 0 10 11\"\n                                fill=\"none\"\n                                xmlns=\"http://www.w3.org/2000/svg\"\n                            >\n                                <path d=\"M9.84375 5.25C9.84375 2.59375 7.65625 0.40625 5 0.40625C2.32422 0.40625 0.15625 2.59375 0.15625 5.25C0.15625 7.92578 2.32422 10.0938 5 10.0938C7.65625 10.0938 9.84375 7.92578 9.84375 5.25ZM5 6.22656C5.48828 6.22656 5.89844 6.63672 5.89844 7.125C5.89844 7.63281 5.48828 8.02344 5 8.02344C4.49219 8.02344 4.10156 7.63281 4.10156 7.125C4.10156 6.63672 4.49219 6.22656 5 6.22656ZM4.14062 3.00391C4.12109 2.86719 4.23828 2.75 4.375 2.75H5.60547C5.74219 2.75 5.85938 2.86719 5.83984 3.00391L5.70312 5.66016C5.68359 5.79688 5.58594 5.875 5.46875 5.875H4.51172C4.39453 5.875 4.29688 5.79688 4.27734 5.66016L4.14062 3.00391Z\" />\n                            </svg>\n                            {this.error}\n                        </label>\n                    )}\n                </div>\n                <input type=\"hidden\" name={this.name} value={this.value} />\n            </Host>\n        );\n    }\n}\n"],"version":3}

package/dist/collection/components/xpl-select/xpl-select.js

@@ -27,6 +27,13 @@ export class XplSelect {
     this.displayValue = '';
     this.visibleChoices = Infinity;
   }
+  /**
+   *
+   * @param _choices
+   */
+  onChoicesChanged(_choices) {
+    this.update();
+  }
   componentWillLoad() {
     this.selected =
       this.choices && this.choices.length > 0
@@ -35,12 +42,12 @@ export class XplSelect {
     if (this.selectedValues) {
       const isSingleMode = this.mode === 'single';
       if (isSingleMode) {
-        this.choices.forEach((choice) => {
-          const shouldBeSelected = choice.value.includes(this.selectedValues) ||
-            choice.label.includes(this.selectedValues);
-          if (shouldBeSelected)
-            choice.isSelected = true;
-        });
+        const selectedValue = this.selectedValues;
+        const shouldBeSelected = this.choices.find((choice) => (choice.value !== undefined
+          ? choice.value
+          : choice.label) === selectedValue);
+        if (shouldBeSelected !== undefined)
+          shouldBeSelected.isSelected = true;
       }
       else {
         this.choices.forEach(({ options }) => {
@@ -397,6 +404,9 @@ export class XplSelect {
   }
   static get watchers() {
     return [{
+        "propName": "choices",
+        "methodName": "onChoicesChanged"
+      }, {
         "propName": "value",
         "methodName": "handleValueStateChange"
       }];

package/dist/collection/components/xpl-select/xpl-select.js.map

@@ -1 +1 @@
-{"version":3,"file":"xpl-select.js","sourceRoot":"","sources":["../../../../src/components/components/xpl-select/xpl-select.tsx"],"names":[],"mappings":"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","sourcesContent":["import { v4 as uuid } from 'uuid';\nimport {\n    Component,\n    Host,\n    h,\n    Prop,\n    State,\n    Event,\n    EventEmitter,\n    Watch,\n} from '@stencil/core';\nimport throttle from 'lodash.throttle';\nimport type { DropdownItem } from '../xpl-dropdown/dropdownoption';\n\nfunction tagWidth(text: string): number {\n    const context = document.createElement('canvas').getContext('2d');\n    context.font =\n        \"14px apple-system, system-ui, 'Segoe UI', Arial, Helvetica, Roboto, sans-serif\";\n    return context.measureText(text).width + 44; // = text + l/r padding + margin-right\n}\n\n@Component({\n    tag: 'xpl-select',\n})\nexport class XplSelect {\n    /**\n     * An array of choices for the user to choose from.\n     * Each choice should be of the form:\n     * {\n     *   label: string;\n     *   href?: string;\n     *   value?: string;\n     *   isGroupHeading?: boolean;\n     * }\n     */\n    @Prop() choices?: DropdownItem[] = [];\n    /**\n     * Optional text that appears below the input label.\n     */\n    @Prop() description?: string;\n    @Prop() disabled?: boolean;\n    /**\n     * If an empty string (attribute present with no value),\n     * will display visually as an error. If a string is\n     * included, will display visually as an error and include\n     * the value as an error message.\n     */\n    @Prop() error?: string;\n\n    /**\n     * The label that appears above the select dropdown\n     */\n    @Prop() label?: string;\n    /**\n     * Whether to allow a single choice or multiple choices.\n     */\n    @Prop() mode?: 'single' | 'multi' = 'single';\n\n    /**\n     * The name of the hidden input field that contains the selected option's value(s)\n     */\n    @Prop() name?: string;\n\n    @Prop() placeholder: string;\n    /**\n     * Only used in multi-choice selects. If `true`,\n     * badges representing selections that would overflow the\n     * container are replaced with \"+x more\" (where x is the\n     * number not shown). If `false`, the container's height will\n     * adjust to show all badges representing selections.\n     */\n    @Prop() truncate?: boolean = true;\n\n    @Prop() selectedValues?: string | string[];\n\n    /**\n     * Emits the value of the selected option in the select menu on change\n     */\n    @Event() selectChange: EventEmitter<string>;\n\n    @State() active: boolean = false;\n    @State() id: string = uuid();\n    @State() keepFocus: boolean = false;\n    @State() selected: boolean[];\n    @State() value: string = '';\n    @State() displayValue: string = '';\n    // infinity isn't real, it's just a mathematical construct, it can't hurt you\n    @State() visibleChoices: number = Infinity;\n\n    private container!: HTMLElement;\n\n    private dropdown: HTMLXplDropdownElement;\n\n    componentWillLoad() {\n        this.selected =\n            this.choices && this.choices.length > 0\n                ? this.choices.map(() => false)\n                : [];\n\n        if (this.selectedValues) {\n            const isSingleMode = this.mode === 'single';\n\n            if (isSingleMode) {\n                this.choices.forEach((choice) => {\n                    const shouldBeSelected =\n                        choice.value.includes(this.selectedValues as string) ||\n                        choice.label.includes(this.selectedValues as string);\n\n                    if (shouldBeSelected) choice.isSelected = true;\n                });\n            } else {\n                this.choices.forEach(({ options }) => {\n                    options.forEach((option) => {\n                        const shouldBeSelected = this.selectedValues.includes(\n                            option.value || option.label\n                        );\n\n                        if (shouldBeSelected) option.isSelected = true;\n                    });\n                });\n            }\n\n            this.update();\n        }\n\n        window.addEventListener('click', (e: MouseEvent) => {\n            const el = e.target as HTMLElement;\n            const select = el.closest('.xpl-select');\n            if (select === null || select !== this.container) {\n                this.active = false;\n            }\n        });\n\n        window.addEventListener(\n            'resize',\n            throttle(() => {\n                this.maybeTruncateChoices();\n            }, 250)\n        );\n    }\n    componentDidLoad() {\n        this.dropdown = this.container.querySelector('xpl-dropdown');\n    }\n\n    private maybeTruncateChoices(): void {\n        if (this.mode === 'single' || !this.truncate) return;\n\n        const containerWidth = this.container.getBoundingClientRect().width;\n\n        let visibleChoices = 0;\n        let visibleChoicesWidth = 0;\n\n        const actualNumSelected = this.selected.filter((a) => a).length;\n        for (let i = 0; i < actualNumSelected; i++) {\n            visibleChoicesWidth += tagWidth(this.getDisplayValue(i));\n            if (visibleChoicesWidth > containerWidth - 140) break;\n            visibleChoices++;\n        }\n\n        if (visibleChoices >= actualNumSelected) visibleChoices = Infinity;\n        if (visibleChoices < 1) visibleChoices = 1;\n\n        this.visibleChoices = visibleChoices;\n    }\n\n    private flattenChoices(): DropdownItem[] {\n        return this.choices.reduce(\n            (acc, curr) => [\n                ...acc,\n                ...(curr.groupName ? curr.options : [curr]),\n            ],\n            []\n        );\n    }\n    private getDisplayValue(i: number): string {\n        return this.flattenChoices()[i].label || this.flattenChoices()[i].value;\n    }\n\n    private getActualValue(i: number): string {\n        return this.flattenChoices()[i].value || this.flattenChoices()[i].label;\n    }\n\n    private update() {\n        this.selected = this.flattenChoices().map(\n            ({ isSelected }) => isSelected\n        );\n\n        if (this.mode === 'single') {\n            const selected = this.selected.findIndex((v) => v);\n            this.value = selected >= 0 ? this.getActualValue(selected) : '';\n            this.displayValue =\n                selected >= 0 ? this.getDisplayValue(selected) : '';\n        } else if (this.mode === 'multi') {\n            this.value = this.selected\n                .map((v, i) => {\n                    return v ? this.getActualValue(i) : '';\n                })\n                .filter((v) => v.length > 0)\n                .join('|');\n        }\n    }\n\n    @Watch('value')\n    handleValueStateChange(newValue) {\n        this.selectChange.emit(newValue);\n    }\n\n    render() {\n        let visibleChoices = 0;\n        return (\n            <Host\n                class={{\n                    'xpl-select': true,\n                    'xpl-select--disabled': this.disabled,\n                    'xpl-select--no-truncate': !this.truncate,\n                }}\n                onKeyDown={(e: KeyboardEvent) => {\n                    if (e.key === 'Escape') this.active = false;\n                }}\n                ref={(el) => (this.container = el as HTMLElement)}\n            >\n                {this.label || this.description ? (\n                    <label\n                        class={{\n                            'xpl-label': true,\n                            'xpl-label--disabled': this.disabled,\n                        }}\n                        htmlFor={this.id}\n                    >\n                        {this.label}\n                        {this.description && (\n                            <small\n                                class={{\n                                    'xpl-description': true,\n                                    'xpl-description--disabled': this.disabled,\n                                }}\n                            >\n                                {this.description}\n                            </small>\n                        )}\n                    </label>\n                ) : null}\n                <div\n                    class={{\n                        'xpl-input': true,\n                        'xpl-input--disabled': this.disabled,\n                        'xpl-input--error': this.error !== undefined,\n                    }}\n                >\n                    <div class=\"xpl-input-wrapper\">\n                        <div\n                            class={{\n                                'xpl-select-value': true,\n                                'xpl-select-value--active':\n                                    this.mode === 'multi' &&\n                                    this.value.length > 0,\n                                'has-value': this.value.length > 0,\n                            }}\n                        >\n                            {this.mode === 'single'\n                                ? this.displayValue || this.placeholder\n                                : this.value.length > 0\n                                ? this.selected.map((v, i) => {\n                                      if (!v) return null;\n                                      if (\n                                          visibleChoices >= this.visibleChoices\n                                      ) {\n                                          return null;\n                                      }\n                                      visibleChoices++;\n                                      return (\n                                          <xpl-tag\n                                              onClose={() => {\n                                                  this.flattenChoices().forEach(\n                                                      (v, j) => {\n                                                          if (i === j)\n                                                              v.isSelected =\n                                                                  false;\n                                                      }\n                                                  );\n                                                  const mapOptions = (\n                                                      option: DropdownItem\n                                                  ): DropdownItem => {\n                                                      option.options =\n                                                          option.groupName\n                                                              ? option.options.map(\n                                                                    mapOptions\n                                                                )\n                                                              : undefined;\n                                                      return option;\n                                                  };\n                                                  this.choices =\n                                                      this.choices.map(\n                                                          mapOptions\n                                                      );\n\n                                                  this.update();\n                                                  this.maybeTruncateChoices();\n                                              }}\n                                          >\n                                              {this.getDisplayValue(i)}\n                                          </xpl-tag>\n                                      );\n                                  })\n                                : this.placeholder}\n                            {this.visibleChoices < Infinity &&\n                                `+ ${\n                                    this.selected.filter((a) => a).length -\n                                    this.visibleChoices\n                                } more`}\n                        </div>\n                        <button\n                            disabled={this.disabled}\n                            id={this.id}\n                            onKeyDown={(e: KeyboardEvent) => {\n                                if (e.key === 'Tab') this.keepFocus = true;\n                            }}\n                            onClick={() => {\n                                const { dropdown } = this;\n                                if (!this.disabled)\n                                    dropdown.isOpen = !dropdown.isOpen;\n                            }}\n                            type=\"button\"\n                        ></button>\n                    </div>\n                    {!this.disabled && (\n                        <xpl-dropdown\n                            options={this.choices}\n                            mode={this.mode}\n                            triggerId={this.id}\n                            update={() => {\n                                this.update();\n                                this.maybeTruncateChoices();\n                            }}\n                        ></xpl-dropdown>\n                    )}\n                    {this.error !== undefined && this.error.length > 0 && (\n                        <label class=\"xpl-input-error\" htmlFor={this.id}>\n                            <svg\n                                width=\"10\"\n                                height=\"11\"\n                                viewBox=\"0 0 10 11\"\n                                fill=\"none\"\n                                xmlns=\"http://www.w3.org/2000/svg\"\n                            >\n                                <path d=\"M9.84375 5.25C9.84375 2.59375 7.65625 0.40625 5 0.40625C2.32422 0.40625 0.15625 2.59375 0.15625 5.25C0.15625 7.92578 2.32422 10.0938 5 10.0938C7.65625 10.0938 9.84375 7.92578 9.84375 5.25ZM5 6.22656C5.48828 6.22656 5.89844 6.63672 5.89844 7.125C5.89844 7.63281 5.48828 8.02344 5 8.02344C4.49219 8.02344 4.10156 7.63281 4.10156 7.125C4.10156 6.63672 4.49219 6.22656 5 6.22656ZM4.14062 3.00391C4.12109 2.86719 4.23828 2.75 4.375 2.75H5.60547C5.74219 2.75 5.85938 2.86719 5.83984 3.00391L5.70312 5.66016C5.68359 5.79688 5.58594 5.875 5.46875 5.875H4.51172C4.39453 5.875 4.29688 5.79688 4.27734 5.66016L4.14062 3.00391Z\" />\n                            </svg>\n                            {this.error}\n                        </label>\n                    )}\n                </div>\n                <input type=\"hidden\" name={this.name} value={this.value} />\n            </Host>\n        );\n    }\n}\n"]}
+{"version":3,"file":"xpl-select.js","sourceRoot":"","sources":["../../../../src/components/components/xpl-select/xpl-select.tsx"],"names":[],"mappings":"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","sourcesContent":["import { v4 as uuid } from 'uuid';\nimport {\n    Component,\n    Host,\n    h,\n    Prop,\n    State,\n    Event,\n    EventEmitter,\n    Watch,\n} from '@stencil/core';\nimport throttle from 'lodash.throttle';\nimport type { DropdownItem } from '../xpl-dropdown/dropdownoption';\n\nfunction tagWidth(text: string): number {\n    const context = document.createElement('canvas').getContext('2d');\n    context.font =\n        \"14px apple-system, system-ui, 'Segoe UI', Arial, Helvetica, Roboto, sans-serif\";\n    return context.measureText(text).width + 44; // = text + l/r padding + margin-right\n}\n\n@Component({\n    tag: 'xpl-select',\n})\nexport class XplSelect {\n    /**\n     * An array of choices for the user to choose from.\n     * Each choice should be of the form:\n     * {\n     *   label: string;\n     *   href?: string;\n     *   value?: string;\n     *   isGroupHeading?: boolean;\n     * }\n     */\n    @Prop() choices?: DropdownItem[] = [];\n\n    /**\n     *\n     * @param _choices\n     */\n    @Watch('choices')\n    onChoicesChanged(_choices: DropdownItem[]) {\n        this.update();\n    }\n\n    /**\n     * Optional text that appears below the input label.\n     */\n    @Prop() description?: string;\n    @Prop() disabled?: boolean;\n    /**\n     * If an empty string (attribute present with no value),\n     * will display visually as an error. If a string is\n     * included, will display visually as an error and include\n     * the value as an error message.\n     */\n    @Prop() error?: string;\n\n    /**\n     * The label that appears above the select dropdown\n     */\n    @Prop() label?: string;\n    /**\n     * Whether to allow a single choice or multiple choices.\n     */\n    @Prop() mode?: 'single' | 'multi' = 'single';\n\n    /**\n     * The name of the hidden input field that contains the selected option's value(s)\n     */\n    @Prop() name?: string;\n\n    @Prop() placeholder: string;\n    /**\n     * Only used in multi-choice selects. If `true`,\n     * badges representing selections that would overflow the\n     * container are replaced with \"+x more\" (where x is the\n     * number not shown). If `false`, the container's height will\n     * adjust to show all badges representing selections.\n     */\n    @Prop() truncate?: boolean = true;\n\n    @Prop() selectedValues?: string | string[];\n\n    /**\n     * Emits the value of the selected option in the select menu on change\n     */\n    @Event() selectChange: EventEmitter<string>;\n\n    @State() active: boolean = false;\n    @State() id: string = uuid();\n    @State() keepFocus: boolean = false;\n    @State() selected: boolean[];\n    @State() value: string = '';\n    @State() displayValue: string = '';\n    // infinity isn't real, it's just a mathematical construct, it can't hurt you\n    @State() visibleChoices: number = Infinity;\n\n    private container!: HTMLElement;\n\n    private dropdown: HTMLXplDropdownElement;\n\n    componentWillLoad() {\n        this.selected =\n            this.choices && this.choices.length > 0\n                ? this.choices.map(() => false)\n                : [];\n\n        if (this.selectedValues) {\n            const isSingleMode = this.mode === 'single';\n\n            if (isSingleMode) {\n                const selectedValue = this.selectedValues as string;\n                const shouldBeSelected = this.choices.find(\n                    (choice) =>\n                        (choice.value !== undefined\n                            ? choice.value\n                            : choice.label) === selectedValue\n                );\n                if (shouldBeSelected !== undefined)\n                    shouldBeSelected.isSelected = true;\n            } else {\n                this.choices.forEach(({ options }) => {\n                    options.forEach((option) => {\n                        const shouldBeSelected = this.selectedValues.includes(\n                            option.value || option.label\n                        );\n\n                        if (shouldBeSelected) option.isSelected = true;\n                    });\n                });\n            }\n\n            this.update();\n        }\n\n        window.addEventListener('click', (e: MouseEvent) => {\n            const el = e.target as HTMLElement;\n            const select = el.closest('.xpl-select');\n            if (select === null || select !== this.container) {\n                this.active = false;\n            }\n        });\n\n        window.addEventListener(\n            'resize',\n            throttle(() => {\n                this.maybeTruncateChoices();\n            }, 250)\n        );\n    }\n    componentDidLoad() {\n        this.dropdown = this.container.querySelector('xpl-dropdown');\n    }\n\n    private maybeTruncateChoices(): void {\n        if (this.mode === 'single' || !this.truncate) return;\n\n        const containerWidth = this.container.getBoundingClientRect().width;\n\n        let visibleChoices = 0;\n        let visibleChoicesWidth = 0;\n\n        const actualNumSelected = this.selected.filter((a) => a).length;\n        for (let i = 0; i < actualNumSelected; i++) {\n            visibleChoicesWidth += tagWidth(this.getDisplayValue(i));\n            if (visibleChoicesWidth > containerWidth - 140) break;\n            visibleChoices++;\n        }\n\n        if (visibleChoices >= actualNumSelected) visibleChoices = Infinity;\n        if (visibleChoices < 1) visibleChoices = 1;\n\n        this.visibleChoices = visibleChoices;\n    }\n\n    private flattenChoices(): DropdownItem[] {\n        return this.choices.reduce(\n            (acc, curr) => [\n                ...acc,\n                ...(curr.groupName ? curr.options : [curr]),\n            ],\n            []\n        );\n    }\n    private getDisplayValue(i: number): string {\n        return this.flattenChoices()[i].label || this.flattenChoices()[i].value;\n    }\n\n    private getActualValue(i: number): string {\n        return this.flattenChoices()[i].value || this.flattenChoices()[i].label;\n    }\n\n    private update() {\n        this.selected = this.flattenChoices().map(\n            ({ isSelected }) => isSelected\n        );\n\n        if (this.mode === 'single') {\n            const selected = this.selected.findIndex((v) => v);\n            this.value = selected >= 0 ? this.getActualValue(selected) : '';\n            this.displayValue =\n                selected >= 0 ? this.getDisplayValue(selected) : '';\n        } else if (this.mode === 'multi') {\n            this.value = this.selected\n                .map((v, i) => {\n                    return v ? this.getActualValue(i) : '';\n                })\n                .filter((v) => v.length > 0)\n                .join('|');\n        }\n    }\n\n    @Watch('value')\n    handleValueStateChange(newValue) {\n        this.selectChange.emit(newValue);\n    }\n\n    render() {\n        let visibleChoices = 0;\n        return (\n            <Host\n                class={{\n                    'xpl-select': true,\n                    'xpl-select--disabled': this.disabled,\n                    'xpl-select--no-truncate': !this.truncate,\n                }}\n                onKeyDown={(e: KeyboardEvent) => {\n                    if (e.key === 'Escape') this.active = false;\n                }}\n                ref={(el) => (this.container = el as HTMLElement)}\n            >\n                {this.label || this.description ? (\n                    <label\n                        class={{\n                            'xpl-label': true,\n                            'xpl-label--disabled': this.disabled,\n                        }}\n                        htmlFor={this.id}\n                    >\n                        {this.label}\n                        {this.description && (\n                            <small\n                                class={{\n                                    'xpl-description': true,\n                                    'xpl-description--disabled': this.disabled,\n                                }}\n                            >\n                                {this.description}\n                            </small>\n                        )}\n                    </label>\n                ) : null}\n                <div\n                    class={{\n                        'xpl-input': true,\n                        'xpl-input--disabled': this.disabled,\n                        'xpl-input--error': this.error !== undefined,\n                    }}\n                >\n                    <div class=\"xpl-input-wrapper\">\n                        <div\n                            class={{\n                                'xpl-select-value': true,\n                                'xpl-select-value--active':\n                                    this.mode === 'multi' &&\n                                    this.value.length > 0,\n                                'has-value': this.value.length > 0,\n                            }}\n                        >\n                            {this.mode === 'single'\n                                ? this.displayValue || this.placeholder\n                                : this.value.length > 0\n                                ? this.selected.map((v, i) => {\n                                      if (!v) return null;\n                                      if (\n                                          visibleChoices >= this.visibleChoices\n                                      ) {\n                                          return null;\n                                      }\n                                      visibleChoices++;\n                                      return (\n                                          <xpl-tag\n                                              onClose={() => {\n                                                  this.flattenChoices().forEach(\n                                                      (v, j) => {\n                                                          if (i === j)\n                                                              v.isSelected =\n                                                                  false;\n                                                      }\n                                                  );\n                                                  const mapOptions = (\n                                                      option: DropdownItem\n                                                  ): DropdownItem => {\n                                                      option.options =\n                                                          option.groupName\n                                                              ? option.options.map(\n                                                                    mapOptions\n                                                                )\n                                                              : undefined;\n                                                      return option;\n                                                  };\n                                                  this.choices =\n                                                      this.choices.map(\n                                                          mapOptions\n                                                      );\n\n                                                  this.update();\n                                                  this.maybeTruncateChoices();\n                                              }}\n                                          >\n                                              {this.getDisplayValue(i)}\n                                          </xpl-tag>\n                                      );\n                                  })\n                                : this.placeholder}\n                            {this.visibleChoices < Infinity &&\n                                `+ ${\n                                    this.selected.filter((a) => a).length -\n                                    this.visibleChoices\n                                } more`}\n                        </div>\n                        <button\n                            disabled={this.disabled}\n                            id={this.id}\n                            onKeyDown={(e: KeyboardEvent) => {\n                                if (e.key === 'Tab') this.keepFocus = true;\n                            }}\n                            onClick={() => {\n                                const { dropdown } = this;\n                                if (!this.disabled)\n                                    dropdown.isOpen = !dropdown.isOpen;\n                            }}\n                            type=\"button\"\n                        ></button>\n                    </div>\n                    {!this.disabled && (\n                        <xpl-dropdown\n                            options={this.choices}\n                            mode={this.mode}\n                            triggerId={this.id}\n                            update={() => {\n                                this.update();\n                                this.maybeTruncateChoices();\n                            }}\n                        ></xpl-dropdown>\n                    )}\n                    {this.error !== undefined && this.error.length > 0 && (\n                        <label class=\"xpl-input-error\" htmlFor={this.id}>\n                            <svg\n                                width=\"10\"\n                                height=\"11\"\n                                viewBox=\"0 0 10 11\"\n                                fill=\"none\"\n                                xmlns=\"http://www.w3.org/2000/svg\"\n                            >\n                                <path d=\"M9.84375 5.25C9.84375 2.59375 7.65625 0.40625 5 0.40625C2.32422 0.40625 0.15625 2.59375 0.15625 5.25C0.15625 7.92578 2.32422 10.0938 5 10.0938C7.65625 10.0938 9.84375 7.92578 9.84375 5.25ZM5 6.22656C5.48828 6.22656 5.89844 6.63672 5.89844 7.125C5.89844 7.63281 5.48828 8.02344 5 8.02344C4.49219 8.02344 4.10156 7.63281 4.10156 7.125C4.10156 6.63672 4.49219 6.22656 5 6.22656ZM4.14062 3.00391C4.12109 2.86719 4.23828 2.75 4.375 2.75H5.60547C5.74219 2.75 5.85938 2.86719 5.83984 3.00391L5.70312 5.66016C5.68359 5.79688 5.58594 5.875 5.46875 5.875H4.51172C4.39453 5.875 4.29688 5.79688 4.27734 5.66016L4.14062 3.00391Z\" />\n                            </svg>\n                            {this.error}\n                        </label>\n                    )}\n                </div>\n                <input type=\"hidden\" name={this.name} value={this.value} />\n            </Host>\n        );\n    }\n}\n"]}

package/dist/components/xpl-select.js

@@ -477,6 +477,13 @@ const XplSelect$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     this.displayValue = '';
     this.visibleChoices = Infinity;
   }
+  /**
+   *
+   * @param _choices
+   */
+  onChoicesChanged(_choices) {
+    this.update();
+  }
   componentWillLoad() {
     this.selected =
       this.choices && this.choices.length > 0
@@ -485,12 +492,12 @@ const XplSelect$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     if (this.selectedValues) {
       const isSingleMode = this.mode === 'single';
       if (isSingleMode) {
-        this.choices.forEach((choice) => {
-          const shouldBeSelected = choice.value.includes(this.selectedValues) ||
-            choice.label.includes(this.selectedValues);
-          if (shouldBeSelected)
-            choice.isSelected = true;
-        });
+        const selectedValue = this.selectedValues;
+        const shouldBeSelected = this.choices.find((choice) => (choice.value !== undefined
+          ? choice.value
+          : choice.label) === selectedValue);
+        if (shouldBeSelected !== undefined)
+          shouldBeSelected.isSelected = true;
       }
       else {
         this.choices.forEach(({ options }) => {
@@ -636,6 +643,7 @@ const XplSelect$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
       } })), this.error !== undefined && this.error.length > 0 && (h("label", { class: "xpl-input-error", htmlFor: this.id }, h("svg", { width: "10", height: "11", viewBox: "0 0 10 11", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { d: "M9.84375 5.25C9.84375 2.59375 7.65625 0.40625 5 0.40625C2.32422 0.40625 0.15625 2.59375 0.15625 5.25C0.15625 7.92578 2.32422 10.0938 5 10.0938C7.65625 10.0938 9.84375 7.92578 9.84375 5.25ZM5 6.22656C5.48828 6.22656 5.89844 6.63672 5.89844 7.125C5.89844 7.63281 5.48828 8.02344 5 8.02344C4.49219 8.02344 4.10156 7.63281 4.10156 7.125C4.10156 6.63672 4.49219 6.22656 5 6.22656ZM4.14062 3.00391C4.12109 2.86719 4.23828 2.75 4.375 2.75H5.60547C5.74219 2.75 5.85938 2.86719 5.83984 3.00391L5.70312 5.66016C5.68359 5.79688 5.58594 5.875 5.46875 5.875H4.51172C4.39453 5.875 4.29688 5.79688 4.27734 5.66016L4.14062 3.00391Z" })), this.error))), h("input", { type: "hidden", name: this.name, value: this.value })));
   }
   static get watchers() { return {
+    "choices": ["onChoicesChanged"],
     "value": ["handleValueStateChange"]
   }; }
 }, [0, "xpl-select", {