@kyndryl-design-system/shidoka-applications 2.27.2 → 2.29.0

package/components/reusable/dropdown/dropdown.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dropdown.d.ts","sourceRoot":"","sources":["../../../../src/components/reusable/dropdown/dropdown.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"dropdown.d.ts","sourceRoot":"","sources":["../../../../src/components/reusable/dropdown/dropdown.ts"],"names":[],"mappings":"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"}

package/components/reusable/dropdown/dropdown.js

@@ -878,5 +878,5 @@ kyn-tag-group {
           ${this.assistiveText}
         </div>
       </div>
-    `}firstUpdated(){""===this.placeholder&&(this.searchable?this.placeholder="Search":this.multiple?this.placeholder="Select items":this.placeholder="Select an option")}handleSlotChange(){this._updateOptions()}handleClick(){this.disabled||(this.open=!this.open,this.searchable?this.searchEl.focus():this.buttonEl.focus())}_handleLabelClick(){this.disabled||(this.open=!this.open,this.searchable?this.searchEl.focus():this.buttonEl.focus())}handleButtonKeydown(e){this.handleKeyboard(e,e.keyCode,"button")}handleListKeydown(e){9!==e.keyCode&&e.preventDefault(),this.handleKeyboard(e,e.keyCode,"list")}handleListBlur(e){this.options.forEach((e=>e.highlighted=!1)),e.relatedTarget&&"kyn-dropdown-option"!==e.relatedTarget.localName&&(this.open=!1),this.assistiveText="Dropdown menu options."}handleKeyboard(e,t,i){const l=[0,32],o=this.options.filter((e=>"none"!==e.style.display)),a=o.find((e=>e.highlighted)),s=o.find((e=>e.selected));let r=a?o.indexOf(a):o.find((e=>e.selected))?o.indexOf(s):0;l.includes(t)&&e.preventDefault();const n=this.open;if("button"===i){let i=l.includes(t)||13===t||40==t||38==t;if(e.target===this.clearMultipleEl&&(i=!1,o[r].highlighted=!1,o[r].selected=!o[r].selected,r=0,13!==t))return;i&&(this.open=!0,this.multiple||""===this.value||o[r].scrollIntoView({block:"nearest"}))}switch(t){case 0:case 32:case 13:return o[r].highlighted=!0,n&&(this.multiple?(o[r].selected=!o[r].selected,o[r].selected?this.assistiveText=`Selected ${o[r].innerHTML}`:this.assistiveText=`Deselected ${o[r].innerHTML}`):(o.forEach((e=>e.selected=!1)),o[r].selected=!0,this.open=!1,this.assistiveText=`Selected ${o[r].innerHTML}`)),a&&n&&this.updateValue(o[r].value,o[r].selected),void this.emitValue();case 40:{let e=a||s?r===o.length-1?0:r+1:0;return o[e].disabled&&(e=e===o.length-1?0:e+1),o[r].highlighted=!1,o[e].highlighted=!0,o[e].scrollIntoView({block:"nearest"}),void(this.assistiveText=o[e].text)}case 38:{let e=0===r?o.length-1:r-1;return o[e].disabled&&(e=0===e?o.length-1:e-1),o[r].highlighted=!1,o[e].highlighted=!0,o[e].scrollIntoView({block:"nearest"}),void(this.assistiveText=o[e].text)}case 27:return this.open=!1,this.searchable?this.searchEl.focus():this.buttonEl.focus(),void(this.assistiveText="Dropdown menu options.");default:return}}handleClearMultiple(e){e.stopPropagation(),this.multiple?this.value=[]:this.value="",this._validate(!0,!1),this._updateSelectedOptions(),this.emitValue();const t=new CustomEvent("on-clear-all",{detail:{value:this.value}});this.dispatchEvent(t)}handleTagClear(e){this.updateValue(e,!1),this._updateSelectedOptions(),this.emitValue()}handleClear(e){e.stopPropagation(),this.text="",this.searchText="",this.searchEl.value="",this._emitSearch(),this.filterSearch&&this.options.map((e=>{e.style.display="block"})),this.multiple||(this.value="",this._validate(!0,!1),this._updateSelectedOptions(),this.emitValue())}handleSearchClick(e){e.stopPropagation(),this.open=!0}handleButtonBlur(e){var t,i;(null===(t=e.relatedTarget)||void 0===t?void 0:t.classList.contains("options"))||(null===(i=e.relatedTarget)||void 0===i?void 0:i.classList.contains("search"))||(this.open=!1),this._validate(!0,!1)}handleSearchBlur(e){var t,i;e.relatedTarget&&("kyn-dropdown-option"===e.relatedTarget.localName||(null===(t=e.relatedTarget)||void 0===t?void 0:t.classList.contains("options"))||(null===(i=e.relatedTarget)||void 0===i?void 0:i.classList.contains("select")))||(this.open=!1),this._validate(!0,!1)}handleSearchKeydown(e){e.stopPropagation();const t=this.options.find((e=>e.highlighted)),i=this.options.findIndex((e=>e.highlighted));this.searchTextEntered=!1,13===e.keyCode&&(this.searchTextEntered=!0,t?(this.prevSearchKeydownIndex!==i&&(this.multiple?t.selected=!t.selected:(this.options.forEach((e=>e.selected=!1)),t.selected=!0,this.open=!1),this.updateValue(t.value,t.selected)),t.selected?(this.assistiveText=`Selected ${t.innerHTML}`,this.prevSearchKeydownIndex=i):this.assistiveText=`Deselected ${t.innerHTML}`):this.assistiveText="No item matched."),27===e.keyCode&&(this.open=!1,this.buttonEl.focus())}handleSearchInput(e){const t=e.target.value;if(this.searchText=t,this.open=!0,this._emitSearch(),this.filterSearch)this.options.map((e=>{e.text.toLowerCase().includes(t.toLowerCase())?e.style.display="block":e.style.display="none"}));else{const e=this.options.filter((e=>e.text.toLowerCase().startsWith(t.toLowerCase())));this.options.forEach((e=>e.highlighted=!1)),""!==t&&e.length&&(e[0].highlighted=!0,e[0].scrollIntoView({block:"nearest"}),this.searchTextEntered&&(this.assistiveText="Option Matched"))}}_updateSelectedOptions(){this.options.forEach((e=>{this.multiple?e.selected=this.value.includes(e.value):e.selected=this.value===e.value}))}_handleClick(e){"selectAll"===e.detail.value?(e.detail.selected?(this.value=this.options.filter((e=>!e.disabled)).map((e=>e.value)),this.assistiveText="Selected all items."):(this.value=[],this.assistiveText="Deselected all items."),this._validate(!0,!1)):(this.updateValue(e.detail.value,e.detail.selected),this.assistiveText="Selected an item."),this._updateSelectedOptions(),this.multiple||(this.open=!1),this.emitValue()}_handleBlur(e){const t=e.detail.origEvent.relatedTarget;(!t||"kyn-dropdown-option"!==t.localName&&"kyn-dropdown"!==t.localName)&&(this.open=!1)}_handleClickOut(e){e.composedPath().includes(this)||(this.open=!1)}connectedCallback(){super.connectedCallback(),this._onConnected(),document.addEventListener("click",(e=>this._handleClickOut(e))),this.addEventListener("on-click",(e=>this._handleClick(e))),this.addEventListener("on-blur",(e=>this._handleBlur(e)))}disconnectedCallback(){this._onDisconnected(),document.removeEventListener("click",(e=>this._handleClickOut(e))),this.removeEventListener("on-click",(e=>this._handleClick(e))),this.removeEventListener("on-blur",(e=>this._handleBlur(e))),super.disconnectedCallback()}updateValue(e,t=!1){if(this.multiple){const i=""===this.value?[]:JSON.parse(JSON.stringify(this.value));if(t)i.push(e);else{const t=i.indexOf(e);i.splice(t,1)}this.value=i}else this.value=e;this._validate(!0,!1),this.multiple||(this.searchable?this.searchEl.focus():this.buttonEl.focus())}_validate(e,t){const i={customError:""!==this.invalidText,valueMissing:this.required&&(!this.value||this.multiple&&!this.value.length||!this.multiple&&""===this.value)},l=this.required&&!this.value.length?"Please fill out this field.":"",o=""!==this.invalidText?this.invalidText:l;this._internals.setValidity(i,o,this.buttonEl),e&&(this._internalValidationMsg=l),t&&this._internals.reportValidity()}emitValue(){const e=new CustomEvent("on-change",{detail:{value:this.value}});this.dispatchEvent(e)}_emitSearch(){const e=new CustomEvent("on-search",{detail:{searchText:this.searchText}});this.dispatchEvent(e)}willUpdate(e){e.has("textStrings")&&(this._textStrings=c(b,this.textStrings))}updated(e){var t,i;if(this._onUpdated(e),e.has("value")){const e=(null===(t=this.shadowRoot)||void 0===t?void 0:t.querySelector("slot#children")).assignedElements().filter((e=>!e.disabled)),i=e.filter((e=>e.selected));this.selectAllChecked=i.length===e.length,this.selectAllIndeterminate=i.length<e.length&&i.length>0,this._updateOptions(),this._updateTags();const l=Array.from(this.querySelectorAll("kyn-dropdown-option"));if(!this.multiple){if(l.length&&""!==this.value){const e=l.find((e=>e.value===this.value));this.text=e.textContent}this.searchable&&this.text&&(this.searchText=this.text===this.placeholder?"":this.text,this.searchEl.value=this.searchText)}}if(e.has("open")&&(this.open&&!this.searchable&&(this.listboxEl.focus({preventScroll:!0}),this.assistiveText="Selecting items. Use up and down arrow keys to navigate."),this.open)){this.multiple||null===(i=this.options.find((e=>e.selected)))||void 0===i||i.scrollIntoView({block:"nearest"});const e=.6;this.buttonEl.getBoundingClientRect().top>window.innerHeight*e?this._openUpwards=!0:this._openUpwards=!1}e.has("multiple")&&this.options.forEach((e=>{e.multiple=this.multiple})),e.has("searchText")&&this.searchEl&&(this.searchEl.value=this.searchText)}_updateTags(){if(this.multiple){const e=Array.from(this.querySelectorAll("kyn-dropdown-option")),t=[];e&&(e.forEach((e=>{e.selected&&t.push({value:e.value,text:e.textContent})})),this._tags=t)}}_updateOptions(){Array.from(this.querySelectorAll("kyn-dropdown-option")).forEach((e=>{if(e.multiple=this.multiple,this.multiple){const t=this.value.includes(e.value);e.selected=t}else e.selected=this.value===e.value}))}};x.styles=g,e([l({type:String})],x.prototype,"label",void 0),e([l({type:String})],x.prototype,"size",void 0),e([l({type:Boolean})],x.prototype,"inline",void 0),e([l({type:String})],x.prototype,"caption",void 0),e([l({type:String})],x.prototype,"placeholder",void 0),e([l({type:Boolean})],x.prototype,"open",void 0),e([l({type:Boolean})],x.prototype,"searchable",void 0),e([l({type:Boolean})],x.prototype,"filterSearch",void 0),e([l({type:Boolean})],x.prototype,"multiple",void 0),e([l({type:Boolean})],x.prototype,"required",void 0),e([l({type:Boolean})],x.prototype,"hideLabel",void 0),e([l({type:Boolean})],x.prototype,"disabled",void 0),e([l({type:Boolean})],x.prototype,"hideTags",void 0),e([l({type:Boolean})],x.prototype,"selectAll",void 0),e([l({type:String})],x.prototype,"selectAllText",void 0),e([l({type:String})],x.prototype,"menuMinWidth",void 0),e([l({type:Boolean})],x.prototype,"selectAllChecked",void 0),e([l({type:Boolean})],x.prototype,"selectAllIndeterminate",void 0),e([l({type:Object})],x.prototype,"textStrings",void 0),e([o()],x.prototype,"_textStrings",void 0),e([o()],x.prototype,"text",void 0),e([l({type:String})],x.prototype,"searchText",void 0),e([o()],x.prototype,"assistiveText",void 0),e([a({selector:"kyn-dropdown-option"})],x.prototype,"options",void 0),e([a({selector:"kyn-dropdown-option[selected]"})],x.prototype,"selectedOptions",void 0),e([s(".search")],x.prototype,"searchEl",void 0),e([s(".select")],x.prototype,"buttonEl",void 0),e([s(".options")],x.prototype,"listboxEl",void 0),e([s(".clear-multiple")],x.prototype,"clearMultipleEl",void 0),e([o()],x.prototype,"_openUpwards",void 0),e([o()],x.prototype,"_tags",void 0),x=e([r("kyn-dropdown")],x);export{x as Dropdown};
+    `}firstUpdated(){""===this.placeholder&&(this.searchable?this.placeholder="Search":this.multiple?this.placeholder="Select items":this.placeholder="Select an option")}handleSlotChange(){this._updateOptions()}handleClick(){this.disabled||(this.open=!this.open,this.searchable?this.searchEl.focus():this.buttonEl.focus())}_handleLabelClick(){this.disabled||(this.open=!this.open,this.searchable?this.searchEl.focus():this.buttonEl.focus())}handleButtonKeydown(e){this.handleKeyboard(e,e.keyCode,"button")}handleListKeydown(e){9!==e.keyCode&&e.preventDefault(),this.handleKeyboard(e,e.keyCode,"list")}handleListBlur(e){this.options.forEach((e=>e.highlighted=!1)),e.relatedTarget&&"kyn-dropdown-option"!==e.relatedTarget.localName&&(this.open=!1),this.assistiveText="Dropdown menu options."}handleKeyboard(e,t,i){const l=[0,32],o=this.options.filter((e=>"none"!==e.style.display)),a=o.find((e=>e.highlighted)),s=o.find((e=>e.selected));let r=a?o.indexOf(a):o.find((e=>e.selected))?o.indexOf(s):0;l.includes(t)&&e.preventDefault();const n=this.open;if("button"===i){let i=l.includes(t)||13===t||40==t||38==t;if(e.target===this.clearMultipleEl&&(i=!1,o[r].highlighted=!1,o[r].selected=!o[r].selected,r=0,13!==t))return;i&&(this.open=!0,this.multiple||""===this.value||o[r].scrollIntoView({block:"nearest"}))}switch(t){case 0:case 32:case 13:return o[r].highlighted=!0,n&&(this.multiple?(o[r].selected=!o[r].selected,o[r].selected?this.assistiveText=`Selected ${o[r].innerHTML}`:this.assistiveText=`Deselected ${o[r].innerHTML}`):(o.forEach((e=>e.selected=!1)),o[r].selected=!0,this.open=!1,this.assistiveText=`Selected ${o[r].innerHTML}`)),a&&n&&this.updateValue(o[r].value,o[r].selected),void this.emitValue();case 40:{let e=a||s?r===o.length-1?0:r+1:0;return o[e].disabled&&(e=e===o.length-1?0:e+1),o[r].highlighted=!1,o[e].highlighted=!0,o[e].scrollIntoView({block:"nearest"}),void(this.assistiveText=o[e].text)}case 38:{let e=0===r?o.length-1:r-1;return o[e].disabled&&(e=0===e?o.length-1:e-1),o[r].highlighted=!1,o[e].highlighted=!0,o[e].scrollIntoView({block:"nearest"}),void(this.assistiveText=o[e].text)}case 27:return this.open=!1,this.searchable?this.searchEl.focus():this.buttonEl.focus(),void(this.assistiveText="Dropdown menu options.");default:return}}handleClearMultiple(e){e.stopPropagation(),this.multiple?this.value=[]:this.value="",this._validate(!0,!1),this._updateSelectedOptions(),this.emitValue();const t=new CustomEvent("on-clear-all",{detail:{value:this.value}});this.dispatchEvent(t)}handleTagClear(e){this.updateValue(e,!1),this._updateSelectedOptions(),this.emitValue()}handleClear(e){e.stopPropagation(),this.text="",this.searchText="",this.searchEl.value="",this._emitSearch(),this.filterSearch&&this.options.map((e=>{e.style.display="block"})),this.multiple||(this.value="",this._validate(!0,!1),this._updateSelectedOptions(),this.emitValue())}handleSearchClick(e){e.stopPropagation(),this.open=!0}handleButtonBlur(e){var t,i;(null===(t=e.relatedTarget)||void 0===t?void 0:t.classList.contains("options"))||(null===(i=e.relatedTarget)||void 0===i?void 0:i.classList.contains("search"))||(this.open=!1),this._validate(!0,!1)}handleSearchBlur(e){var t,i;e.relatedTarget&&("kyn-dropdown-option"===e.relatedTarget.localName||(null===(t=e.relatedTarget)||void 0===t?void 0:t.classList.contains("options"))||(null===(i=e.relatedTarget)||void 0===i?void 0:i.classList.contains("select")))||(this.open=!1),this._validate(!0,!1)}handleSearchKeydown(e){e.stopPropagation();const t=this.options.find((e=>e.highlighted)),i=this.options.findIndex((e=>e.highlighted));this.searchTextEntered=!1,13===e.keyCode&&(this.searchTextEntered=!0,t?(this.prevSearchKeydownIndex!==i&&(this.multiple?t.selected=!t.selected:(this.options.forEach((e=>e.selected=!1)),t.selected=!0,this.open=!1),this.updateValue(t.value,t.selected)),t.selected?(this.assistiveText=`Selected ${t.innerHTML}`,this.prevSearchKeydownIndex=i):this.assistiveText=`Deselected ${t.innerHTML}`):this.assistiveText="No item matched."),27===e.keyCode&&(this.open=!1,this.buttonEl.focus())}handleSearchInput(e){const t=e.target.value;if(this.searchText=t,this.open=!0,this._emitSearch(),this.filterSearch)this.options.map((e=>{e.text.toLowerCase().includes(t.toLowerCase())?e.style.display="block":e.style.display="none"}));else{const e=this.options.filter((e=>e.text.toLowerCase().startsWith(t.toLowerCase())));this.options.forEach((e=>e.highlighted=!1)),""!==t&&e.length&&(e[0].highlighted=!0,e[0].scrollIntoView({block:"nearest"}),this.searchTextEntered&&(this.assistiveText="Option Matched"))}}_updateSelectedOptions(){this.options.forEach((e=>{this.multiple?e.selected=this.value.includes(e.value):e.selected=this.value===e.value}))}_handleClick(e){"selectAll"===e.detail.value?(e.detail.selected?(this.value=this.options.filter((e=>!e.disabled)).map((e=>e.value)),this.assistiveText="Selected all items."):(this.value=[],this.assistiveText="Deselected all items."),this._validate(!0,!1)):(this.updateValue(e.detail.value,e.detail.selected),this.assistiveText="Selected an item."),this._updateSelectedOptions(),this.multiple||(this.open=!1),this.emitValue()}_handleBlur(e){const t=e.detail.origEvent.relatedTarget;(!t||"kyn-dropdown-option"!==t.localName&&"kyn-dropdown"!==t.localName)&&(this.open=!1)}_handleClickOut(e){e.composedPath().includes(this)||(this.open=!1)}connectedCallback(){super.connectedCallback(),this._onConnected(),document.addEventListener("click",(e=>this._handleClickOut(e))),this.addEventListener("on-click",(e=>this._handleClick(e))),this.addEventListener("on-blur",(e=>this._handleBlur(e)))}disconnectedCallback(){this._onDisconnected(),document.removeEventListener("click",(e=>this._handleClickOut(e))),this.removeEventListener("on-click",(e=>this._handleClick(e))),this.removeEventListener("on-blur",(e=>this._handleBlur(e))),super.disconnectedCallback()}updateValue(e,t=!1){if(this.multiple){const i=""===this.value?[]:JSON.parse(JSON.stringify(this.value));if(t)i.push(e);else{const t=i.indexOf(e);i.splice(t,1)}this.value=i}else this.value=e;this._validate(!0,!1),this.multiple||(this.searchable?this.searchEl.focus():this.buttonEl.focus())}_validate(e,t){const i={customError:""!==this.invalidText,valueMissing:this.required&&(!this.value||this.multiple&&!this.value.length||!this.multiple&&""===this.value)},l=this.required&&!this.value.length?"Please fill out this field.":"",o=""!==this.invalidText?this.invalidText:l;this._internals.setValidity(i,o,this.buttonEl),e&&(this._internalValidationMsg=l),t&&this._internals.reportValidity()}emitValue(){const e=new CustomEvent("on-change",{detail:{value:this.value}});this.dispatchEvent(e)}_emitSearch(){const e=new CustomEvent("on-search",{detail:{searchText:this.searchText}});this.dispatchEvent(e)}willUpdate(e){e.has("textStrings")&&(this._textStrings=c(b,this.textStrings))}updated(e){var t,i;if(this._onUpdated(e),e.has("value")){const e=(null===(t=this.shadowRoot)||void 0===t?void 0:t.querySelector("slot#children")).assignedElements().filter((e=>!e.disabled)),i=e.filter((e=>e.selected));this.selectAllChecked=i.length===e.length,this.selectAllIndeterminate=i.length<e.length&&i.length>0,this._updateOptions(),this._updateTags();const l=Array.from(this.querySelectorAll("kyn-dropdown-option"));if(!this.multiple){if(l.length&&""!==this.value){const e=l.find((e=>e.value===this.value));this.text=e.textContent.trim()}this.searchable&&this.text&&(this.searchText=this.text===this.placeholder?"":this.text,this.searchEl.value=this.searchText)}}if(e.has("open")&&(this.open&&!this.searchable&&(this.listboxEl.focus({preventScroll:!0}),this.assistiveText="Selecting items. Use up and down arrow keys to navigate."),this.open)){this.multiple||null===(i=this.options.find((e=>e.selected)))||void 0===i||i.scrollIntoView({block:"nearest"});const e=.6;this.buttonEl.getBoundingClientRect().top>window.innerHeight*e?this._openUpwards=!0:this._openUpwards=!1}e.has("multiple")&&this.options.forEach((e=>{e.multiple=this.multiple})),e.has("searchText")&&this.searchEl&&(this.searchEl.value=this.searchText)}_updateTags(){if(this.multiple){const e=Array.from(this.querySelectorAll("kyn-dropdown-option")),t=[];e&&(e.forEach((e=>{e.selected&&t.push({value:e.value,text:e.textContent})})),this._tags=t)}}_updateOptions(){Array.from(this.querySelectorAll("kyn-dropdown-option")).forEach((e=>{if(e.multiple=this.multiple,this.multiple){const t=this.value.includes(e.value);e.selected=t}else e.selected=this.value===e.value}))}};x.styles=g,e([l({type:String})],x.prototype,"label",void 0),e([l({type:String})],x.prototype,"size",void 0),e([l({type:Boolean})],x.prototype,"inline",void 0),e([l({type:String})],x.prototype,"caption",void 0),e([l({type:String})],x.prototype,"placeholder",void 0),e([l({type:Boolean})],x.prototype,"open",void 0),e([l({type:Boolean})],x.prototype,"searchable",void 0),e([l({type:Boolean})],x.prototype,"filterSearch",void 0),e([l({type:Boolean})],x.prototype,"multiple",void 0),e([l({type:Boolean})],x.prototype,"required",void 0),e([l({type:Boolean})],x.prototype,"hideLabel",void 0),e([l({type:Boolean})],x.prototype,"disabled",void 0),e([l({type:Boolean})],x.prototype,"hideTags",void 0),e([l({type:Boolean})],x.prototype,"selectAll",void 0),e([l({type:String})],x.prototype,"selectAllText",void 0),e([l({type:String})],x.prototype,"menuMinWidth",void 0),e([l({type:Boolean})],x.prototype,"selectAllChecked",void 0),e([l({type:Boolean})],x.prototype,"selectAllIndeterminate",void 0),e([l({type:Object})],x.prototype,"textStrings",void 0),e([o()],x.prototype,"_textStrings",void 0),e([o()],x.prototype,"text",void 0),e([l({type:String})],x.prototype,"searchText",void 0),e([o()],x.prototype,"assistiveText",void 0),e([a({selector:"kyn-dropdown-option"})],x.prototype,"options",void 0),e([a({selector:"kyn-dropdown-option[selected]"})],x.prototype,"selectedOptions",void 0),e([s(".search")],x.prototype,"searchEl",void 0),e([s(".select")],x.prototype,"buttonEl",void 0),e([s(".options")],x.prototype,"listboxEl",void 0),e([s(".clear-multiple")],x.prototype,"clearMultipleEl",void 0),e([o()],x.prototype,"_openUpwards",void 0),e([o()],x.prototype,"_tags",void 0),x=e([r("kyn-dropdown")],x);export{x as Dropdown};
 //# sourceMappingURL=dropdown.js.map

package/components/reusable/dropdown/dropdown.js.map

@@ -1 +1 @@
-{"version":3,"file":"dropdown.js","sources":["../../../../src/components/reusable/dropdown/dropdown.ts"],"sourcesContent":["import { unsafeSVG } from 'lit-html/directives/unsafe-svg.js';\nimport { LitElement, html } from 'lit';\nimport {\n  customElement,\n  property,\n  state,\n  query,\n  queryAssignedElements,\n} from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport DropdownScss from './dropdown.scss';\nimport { FormMixin } from '../../../common/mixins/form-input';\nimport { deepmerge } from 'deepmerge-ts';\n\nimport './dropdownOption';\nimport '../tag';\nimport '../button';\n\nimport downIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/16/chevron-down.svg';\nimport errorIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/16/error-filled.svg';\nimport clearIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/20/close-simple.svg';\n\nconst _defaultTextStrings = {\n  title: 'Dropdown',\n  selectedOptions: 'List of selected options',\n  requiredText: 'Required',\n  errorText: 'Error',\n  clearAll: 'Clear all',\n};\n\n/**\n * Dropdown, single select.\n * @fires on-change - Captures the input event and emits the selected value and original event details.\n * @fires on-search - Capture the search input event and emits the search text.\n * @fires on-clear-all - Captures the the multi-select clear all button click event and emits the value.\n * @slot unnamed - Slot for dropdown options.\n * @slot tooltip - Slot for tooltip.\n */\n@customElement('kyn-dropdown')\nexport class Dropdown extends FormMixin(LitElement) {\n  static override styles = DropdownScss;\n\n  /** Label text. */\n  @property({ type: String })\n  label = '';\n\n  /** Dropdown size/height. \"sm\", \"md\", or \"lg\". */\n  @property({ type: String })\n  size = 'md';\n\n  /** Dropdown inline style type. */\n  @property({ type: Boolean })\n  inline = false;\n\n  /** Optional text beneath the input. */\n  @property({ type: String })\n  caption = '';\n\n  /** Dropdown placeholder. */\n  @property({ type: String })\n  placeholder = '';\n\n  /** Listbox/drawer open state. */\n  @property({ type: Boolean })\n  open = false;\n\n  /** Makes the dropdown searchable. */\n  @property({ type: Boolean })\n  searchable = false;\n\n  /** Searchable variant filters results. */\n  @property({ type: Boolean })\n  filterSearch = false;\n\n  /** Enabled multi-select functionality. */\n  @property({ type: Boolean })\n  multiple = false;\n\n  /** Makes the dropdown required. */\n  @property({ type: Boolean })\n  required = false;\n\n  /** Visually hide the label. */\n  @property({ type: Boolean })\n  hideLabel = false;\n\n  /** Dropdown disabled state. */\n  @property({ type: Boolean })\n  disabled = false;\n\n  /** Hide the tags below multi-select. */\n  @property({ type: Boolean })\n  hideTags = false;\n\n  /** Adds a \"Select all\" option to the top of a multi-select dropdown. */\n  @property({ type: Boolean })\n  selectAll = false;\n\n  /** \"Select all\" text customization. */\n  @property({ type: String })\n  selectAllText = 'Select all';\n\n  /** Menu CSS min-width value. */\n  @property({ type: String })\n  menuMinWidth = 'initial';\n\n  /** Is \"Select All\" box checked.\n   * @internal\n   */\n  @property({ type: Boolean })\n  selectAllChecked = false;\n\n  /** Is \"Select All\" indeterminate.\n   * @internal\n   */\n  @property({ type: Boolean })\n  selectAllIndeterminate = false;\n\n  /** Text string customization. */\n  @property({ type: Object })\n  textStrings = _defaultTextStrings;\n\n  /** Internal text strings.\n   * @internal\n   */\n  @state()\n  _textStrings = _defaultTextStrings;\n\n  /**\n   * Selected option text, automatically derived.\n   * @ignore\n   */\n  @state()\n  text = '';\n\n  /**\n   * Search input value.\n   */\n  @property({ type: String })\n  searchText = '';\n\n  /**\n   * Assistive text for screen readers.\n   * @ignore\n   */\n  @state()\n  assistiveText = 'Dropdown menu options.';\n\n  /**\n   * Queries any slotted options.\n   * @ignore\n   */\n  @queryAssignedElements({ selector: 'kyn-dropdown-option' })\n  options!: Array<any>;\n\n  /**\n   * Queries any slotted selected options.\n   * @ignore\n   */\n  @queryAssignedElements({ selector: 'kyn-dropdown-option[selected]' })\n  selectedOptions!: Array<any>;\n\n  /**\n   * Queries the .search DOM element.\n   * @ignore\n   */\n  @query('.search')\n  searchEl!: HTMLInputElement;\n\n  /**\n   * Queries the .select DOM element.\n   * @ignore\n   */\n  @query('.select')\n  buttonEl!: HTMLElement;\n\n  /**\n   * Queries the .options DOM element.\n   * @ignore\n   */\n  @query('.options')\n  listboxEl!: HTMLElement;\n\n  /**\n   * Queries the .clear-multiple DOM element.\n   * @ignore\n   */\n  @query('.clear-multiple')\n  clearMultipleEl!: HTMLElement;\n\n  /**\n   * Open drawer upwards.\n   * @ignore\n   */\n  @state()\n  _openUpwards = false;\n\n  /**\n   * Tags value/text reference.\n   * @ignore\n   */\n  @state()\n  _tags: Array<object> = [];\n\n  /** Toggles on clicking enter key in the search input.\n   * @internal\n   */\n  searchTextEntered: any = false;\n\n  /** Toggles on clicking enter key in the search input.\n   * @internal\n   */\n  prevSearchKeydownIndex = -1;\n\n  override render() {\n    return html`\n      <div\n        class=\"dropdown\"\n        ?disabled=${this.disabled}\n        ?open=${this.open}\n        ?inline=${this.inline}\n        ?searchable=${this.searchable}\n      >\n        <label\n          id=\"label-${this.name}\"\n          class=\"label-text ${this.hideLabel || this.inline ? 'sr-only' : ''}\"\n          for=${this.name}\n          aria-disabled=${this.disabled}\n          @click=${() => this._handleLabelClick()}\n        >\n          ${this.required\n            ? html`<abbr\n                class=\"required\"\n                title=${this._textStrings.requiredText}\n                role=\"img\"\n                aria-label=${this._textStrings?.requiredText || 'Required'}\n                >*</abbr\n              >`\n            : null}\n          ${this.label}\n          <slot name=\"tooltip\"></slot>\n        </label>\n\n        <div\n          class=${classMap({\n            wrapper: true,\n            open: this.open,\n          })}\n        >\n          <div class=\"custom\">\n            <div\n              class=\"${classMap({\n                select: true,\n                'input-custom': true,\n                'size--sm': this.size === 'sm',\n                'size--lg': this.size === 'lg',\n                inline: this.inline,\n              })}\"\n              aria-labelledby=\"label-${this.name}\"\n              aria-expanded=${this.open}\n              aria-controls=\"options\"\n              role=\"combobox\"\n              id=${this.name}\n              name=${this.name}\n              title=${this._textStrings.title}\n              ?required=${this.required}\n              ?disabled=${this.disabled}\n              ?invalid=${this._isInvalid}\n              tabindex=${this.disabled ? '' : '0'}\n              @click=${() => this.handleClick()}\n              @keydown=${(e: any) => this.handleButtonKeydown(e)}\n              @mousedown=${(e: any) => {\n                if (!this.searchable) {\n                  e.preventDefault();\n                }\n              }}\n              @blur=${(e: any) => this.handleButtonBlur(e)}\n            >\n              ${this.multiple && this.value.length\n                ? html`\n                    <button\n                      class=\"clear-multiple\"\n                      aria-label=\"${this.value\n                        .length} items selected. Clear selections\"\n                      ?disabled=${this.disabled}\n                      @click=${(e: Event) => this.handleClearMultiple(e)}\n                    >\n                      ${this.value.length}\n                      <span style=\"display:flex;\" slot=\"icon\"\n                        >${unsafeSVG(clearIcon)}</span\n                      >\n                    </button>\n                  `\n                : null}\n              ${this.searchable\n                ? html`\n                    <input\n                      class=\"search\"\n                      type=\"text\"\n                      placeholder=${this.placeholder}\n                      value=${this.searchText}\n                      ?disabled=${this.disabled}\n                      aria-disabled=${this.disabled}\n                      @keydown=${(e: any) => this.handleSearchKeydown(e)}\n                      @input=${(e: any) => this.handleSearchInput(e)}\n                      @blur=${(e: any) => this.handleSearchBlur(e)}\n                      @click=${(e: any) => this.handleSearchClick(e)}\n                    />\n                  `\n                : html`\n                    <span aria-disabled=${this.disabled}>\n                      ${this.multiple\n                        ? this.placeholder\n                        : this.value === ''\n                        ? this.placeholder\n                        : this.text}\n                    </span>\n                  `}\n\n              <span class=\"arrow-icon\">${unsafeSVG(downIcon)}</span>\n            </div>\n\n            <ul\n              id=\"options\"\n              class=${classMap({\n                options: true,\n                open: this.open,\n                upwards: this._openUpwards,\n              })}\n              style=\"min-width: ${this.menuMinWidth};\"\n              aria-labelledby=\"label-${this.name}\"\n              name=${this.name}\n              role=\"listbox\"\n              tabindex=\"0\"\n              aria-expanded=${this.open}\n              aria-hidden=${!this.open}\n              @keydown=${(e: any) => this.handleListKeydown(e)}\n              @blur=${(e: any) => this.handleListBlur(e)}\n            >\n              ${this.multiple && this.selectAll\n                ? html`\n                    <kyn-dropdown-option\n                      class=\"select-all\"\n                      value=\"selectAll\"\n                      multiple\n                      ?selected=${this.selectAllChecked}\n                      ?indeterminate=${this.selectAllIndeterminate}\n                      ?disabled=${this.disabled}\n                    >\n                      ${this.selectAllText}\n                    </kyn-dropdown-option>\n                  `\n                : null}\n\n              <slot\n                id=\"children\"\n                @slotchange=${() => this.handleSlotChange()}\n              ></slot>\n            </ul>\n          </div>\n          ${this.searchText !== ''\n            ? html`\n                <kyn-button\n                  ?disabled=${this.disabled}\n                  class=\"clear-button dropdown-clear\"\n                  kind=\"ghost\"\n                  size=\"small\"\n                  description=${this._textStrings.clearAll}\n                  @click=${(e: Event) => this.handleClear(e)}\n                >\n                  <span style=\"display:flex;\" slot=\"icon\"\n                    >${unsafeSVG(clearIcon)}</span\n                  >\n                </kyn-button>\n              `\n            : null}\n        </div>\n        ${this.renderHelperContent()}\n      </div>\n    `;\n  }\n\n  private renderHelperContent() {\n    return html`\n        ${\n          this.multiple && !this.hideTags && this._tags.length\n            ? html`\n                <kyn-tag-group\n                  filter\n                  role=\"list\"\n                  aria-label=${this._textStrings.selectedOptions}\n                >\n                  ${this._tags.map((tag: any) => {\n                    return html`\n                      <kyn-tag\n                        role=\"listitem\"\n                        label=${tag.text}\n                        ?disabled=${this.disabled}\n                        clearTagText=\"Clear Tag ${tag.text}\"\n                        @on-close=${() => this.handleTagClear(tag.value)}\n                      ></kyn-tag>\n                    `;\n                  })}\n                </kyn-tag-group>\n              `\n            : null\n        }\n        ${\n          this.caption !== ''\n            ? html`\n                <div class=\"caption\" aria-disabled=${this.disabled}>\n                  ${this.caption}\n                </div>\n              `\n            : null\n        }\n        ${\n          this._isInvalid\n            ? html`\n                <div class=\"error\">\n                  <span\n                    class=\"error-icon\"\n                    role=\"img\"\n                    title=${this._textStrings.errorText}\n                    aria-label=${this._textStrings.errorText}\n                    >${unsafeSVG(errorIcon)}</span\n                  >\n                  ${this.invalidText || this._internalValidationMsg}\n                </div>\n              `\n            : null\n        }\n\n        <div\n          class=\"assistive-text\"\n          role=\"status\"\n          aria-live=\"assertive\"\n          aria-relevant=\"additions text\"\n        >\n          ${this.assistiveText}\n        </div>\n      </div>\n    `;\n  }\n\n  override firstUpdated() {\n    // set a default placeholder if none provided\n    if (this.placeholder === '') {\n      if (this.searchable) {\n        this.placeholder = 'Search';\n      } else {\n        if (this.multiple) {\n          this.placeholder = 'Select items';\n        } else {\n          this.placeholder = 'Select an option';\n        }\n      }\n    }\n  }\n\n  private handleSlotChange() {\n    this._updateOptions();\n  }\n\n  private handleClick() {\n    if (!this.disabled) {\n      this.open = !this.open;\n\n      // focus search input if searchable\n      if (this.searchable) {\n        this.searchEl.focus();\n      } else {\n        this.buttonEl.focus();\n      }\n    }\n  }\n\n  private _handleLabelClick() {\n    if (!this.disabled) {\n      this.open = !this.open;\n\n      if (this.searchable) {\n        this.searchEl.focus();\n      } else {\n        this.buttonEl.focus();\n      }\n    }\n  }\n\n  private handleButtonKeydown(e: any) {\n    this.handleKeyboard(e, e.keyCode, 'button');\n  }\n\n  private handleListKeydown(e: any) {\n    const TAB_KEY_CODE = 9;\n\n    if (e.keyCode !== TAB_KEY_CODE) {\n      e.preventDefault();\n    }\n\n    this.handleKeyboard(e, e.keyCode, 'list');\n  }\n\n  private handleListBlur(e: any) {\n    this.options.forEach((option) => (option.highlighted = false));\n\n    // don't blur if clicking an option inside\n    if (\n      e.relatedTarget &&\n      e.relatedTarget.localName !== 'kyn-dropdown-option'\n    ) {\n      this.open = false;\n    }\n    this.assistiveText = 'Dropdown menu options.';\n  }\n\n  private handleKeyboard(e: any, keyCode: number, target: string) {\n    const SPACEBAR_KEY_CODE = [0, 32];\n    const ENTER_KEY_CODE = 13;\n    const DOWN_ARROW_KEY_CODE = 40;\n    const UP_ARROW_KEY_CODE = 38;\n    const ESCAPE_KEY_CODE = 27;\n\n    // get highlighted element + index and selected element\n    const visibleOptions = this.options.filter(\n      (option: any) => option.style.display !== 'none'\n    );\n    const highlightedEl = visibleOptions.find(\n      (option: any) => option.highlighted\n    );\n    const selectedEl = visibleOptions.find((option: any) => option.selected);\n    let highlightedIndex = highlightedEl\n      ? visibleOptions.indexOf(highlightedEl)\n      : visibleOptions.find((option: any) => option.selected)\n      ? visibleOptions.indexOf(selectedEl)\n      : 0;\n\n    // prevent page scroll on spacebar press\n    if (SPACEBAR_KEY_CODE.includes(keyCode)) {\n      e.preventDefault();\n    }\n\n    const isListboxElOpened = this.open;\n    // open the listbox\n    if (target === 'button') {\n      let openDropdown =\n        SPACEBAR_KEY_CODE.includes(keyCode) ||\n        keyCode === ENTER_KEY_CODE ||\n        keyCode == DOWN_ARROW_KEY_CODE ||\n        keyCode == UP_ARROW_KEY_CODE;\n\n      if (e.target === this.clearMultipleEl) {\n        openDropdown = false;\n        visibleOptions[highlightedIndex].highlighted = false;\n        visibleOptions[highlightedIndex].selected =\n          !visibleOptions[highlightedIndex].selected;\n        highlightedIndex = 0;\n        if (keyCode !== ENTER_KEY_CODE) return;\n      }\n\n      if (openDropdown) {\n        this.open = true;\n\n        // scroll to highlighted option\n        if (!this.multiple && this.value !== '') {\n          visibleOptions[highlightedIndex].scrollIntoView({ block: 'nearest' });\n        }\n      }\n    }\n    switch (keyCode) {\n      case 0:\n      case 32:\n      case ENTER_KEY_CODE: {\n        // select highlighted option\n        visibleOptions[highlightedIndex].highlighted = true;\n        if (isListboxElOpened) {\n          if (this.multiple) {\n            visibleOptions[highlightedIndex].selected =\n              !visibleOptions[highlightedIndex].selected;\n            if (visibleOptions[highlightedIndex].selected) {\n              this.assistiveText = `Selected ${visibleOptions[highlightedIndex].innerHTML}`;\n            } else {\n              this.assistiveText = `Deselected ${visibleOptions[highlightedIndex].innerHTML}`;\n            }\n          } else {\n            visibleOptions.forEach((e) => (e.selected = false));\n            visibleOptions[highlightedIndex].selected = true;\n            this.open = false;\n            this.assistiveText = `Selected ${visibleOptions[highlightedIndex].innerHTML}`;\n          }\n        }\n        if (highlightedEl && isListboxElOpened)\n          this.updateValue(\n            visibleOptions[highlightedIndex].value,\n            visibleOptions[highlightedIndex].selected\n          );\n\n        this.emitValue();\n        return;\n      }\n      case DOWN_ARROW_KEY_CODE: {\n        // go to next option\n        let nextIndex =\n          !highlightedEl && !selectedEl\n            ? 0\n            : highlightedIndex === visibleOptions.length - 1\n            ? 0\n            : highlightedIndex + 1;\n\n        // skip disabled options\n        if (visibleOptions[nextIndex].disabled) {\n          nextIndex =\n            nextIndex === visibleOptions.length - 1 ? 0 : nextIndex + 1;\n        }\n\n        visibleOptions[highlightedIndex].highlighted = false;\n        visibleOptions[nextIndex].highlighted = true;\n\n        // scroll to option\n        visibleOptions[nextIndex].scrollIntoView({ block: 'nearest' });\n\n        this.assistiveText = visibleOptions[nextIndex].text;\n        return;\n      }\n      case UP_ARROW_KEY_CODE: {\n        // go to previous option\n        let nextIndex =\n          highlightedIndex === 0\n            ? visibleOptions.length - 1\n            : highlightedIndex - 1;\n\n        // skip disabled options\n        if (visibleOptions[nextIndex].disabled) {\n          nextIndex =\n            nextIndex === 0 ? visibleOptions.length - 1 : nextIndex - 1;\n        }\n\n        visibleOptions[highlightedIndex].highlighted = false;\n        visibleOptions[nextIndex].highlighted = true;\n\n        // scroll to option\n        visibleOptions[nextIndex].scrollIntoView({ block: 'nearest' });\n\n        this.assistiveText = visibleOptions[nextIndex].text;\n        return;\n      }\n      case ESCAPE_KEY_CODE: {\n        // close listbox\n        this.open = false;\n\n        // restore focus\n        if (this.searchable) {\n          this.searchEl.focus();\n        } else {\n          this.buttonEl.focus();\n        }\n\n        this.assistiveText = 'Dropdown menu options.';\n        return;\n      }\n      default: {\n        return;\n      }\n    }\n  }\n\n  private handleClearMultiple(e: any) {\n    e.stopPropagation();\n\n    // clear values\n    if (this.multiple) {\n      this.value = [];\n    } else {\n      this.value = '';\n    }\n\n    this._validate(true, false);\n    this._updateSelectedOptions();\n    this.emitValue();\n\n    const event = new CustomEvent('on-clear-all', {\n      detail: {\n        value: this.value,\n      },\n    });\n    this.dispatchEvent(event);\n  }\n\n  private handleTagClear(value: string) {\n    // remove value\n    this.updateValue(value, false);\n    this._updateSelectedOptions();\n    this.emitValue();\n  }\n\n  private handleClear(e: any) {\n    e.stopPropagation();\n\n    // reset search input text\n    this.text = '';\n    this.searchText = '';\n    this.searchEl.value = '';\n\n    this._emitSearch();\n\n    if (this.filterSearch) {\n      // reveal all options\n      this.options.map((option: any) => {\n        option.style.display = 'block';\n      });\n    }\n\n    // clear selection for single select\n    if (!this.multiple) {\n      this.value = '';\n      this._validate(true, false);\n      this._updateSelectedOptions();\n      this.emitValue();\n    }\n  }\n\n  private handleSearchClick(e: any) {\n    e.stopPropagation();\n    this.open = true;\n  }\n\n  private handleButtonBlur(e: any) {\n    // don't blur if entering listbox or search input\n    if (\n      !e.relatedTarget?.classList.contains('options') &&\n      !e.relatedTarget?.classList.contains('search')\n    ) {\n      this.open = false;\n    }\n    this._validate(true, false);\n  }\n\n  private handleSearchBlur(e: any) {\n    // don't blur if entering listbox of button\n    if (\n      !e.relatedTarget ||\n      (e.relatedTarget.localName !== 'kyn-dropdown-option' &&\n        !e.relatedTarget?.classList.contains('options') &&\n        !e.relatedTarget?.classList.contains('select'))\n    ) {\n      this.open = false;\n    }\n    this._validate(true, false);\n  }\n\n  private handleSearchKeydown(e: any) {\n    e.stopPropagation();\n\n    const ENTER_KEY_CODE = 13;\n    const ESCAPE_KEY_CODE = 27;\n    const option = this.options.find((option) => option.highlighted);\n    const highlightedIndex = this.options.findIndex(\n      (option) => option.highlighted\n    );\n    this.searchTextEntered = false;\n    // select option\n    if (e.keyCode === ENTER_KEY_CODE) {\n      this.searchTextEntered = true;\n      if (option) {\n        if (this.prevSearchKeydownIndex !== highlightedIndex) {\n          if (this.multiple) {\n            option.selected = !option.selected;\n          } else {\n            this.options.forEach((e) => (e.selected = false));\n            option.selected = true;\n            this.open = false;\n          }\n          this.updateValue(option.value, option.selected);\n        }\n\n        if (option.selected) {\n          this.assistiveText = `Selected ${option.innerHTML}`;\n          this.prevSearchKeydownIndex = highlightedIndex;\n        } else {\n          this.assistiveText = `Deselected ${option.innerHTML}`;\n        }\n      } else {\n        this.assistiveText = 'No item matched.';\n      }\n    }\n\n    // close listbox\n    if (e.keyCode === ESCAPE_KEY_CODE) {\n      this.open = false;\n      this.buttonEl.focus();\n    }\n  }\n\n  private handleSearchInput(e: any) {\n    const value = e.target.value;\n    this.searchText = value;\n    this.open = true;\n\n    this._emitSearch();\n\n    if (this.filterSearch) {\n      // hide items that don't match\n      this.options.map((option: any) => {\n        const text = option.text;\n        if (text.toLowerCase().includes(value.toLowerCase())) {\n          option.style.display = 'block';\n        } else {\n          option.style.display = 'none';\n        }\n      });\n    } else {\n      // find matches\n      const options = this.options.filter((option: any) => {\n        const text = option.text;\n        return text.toLowerCase().startsWith(value.toLowerCase());\n      });\n\n      // reset options highlighted state\n      this.options.forEach((option) => (option.highlighted = false));\n\n      // option highlight and scroll\n      if (value !== '' && options.length) {\n        options[0].highlighted = true;\n        options[0].scrollIntoView({ block: 'nearest' });\n        if (this.searchTextEntered) this.assistiveText = 'Option Matched';\n      }\n    }\n  }\n\n  private _updateSelectedOptions() {\n    // set selected state for each option\n    this.options.forEach((option: any) => {\n      if (this.multiple) {\n        option.selected = this.value.includes(option.value);\n      } else {\n        option.selected = this.value === option.value;\n      }\n    });\n  }\n\n  private _handleClick(e: any) {\n    if (e.detail.value === 'selectAll') {\n      if (e.detail.selected) {\n        this.value = this.options\n          .filter((option) => !option.disabled)\n          .map((option) => {\n            return option.value;\n          });\n        this.assistiveText = 'Selected all items.';\n      } else {\n        this.value = [];\n        this.assistiveText = 'Deselected all items.';\n      }\n\n      this._validate(true, false);\n    } else {\n      this.updateValue(e.detail.value, e.detail.selected);\n      this.assistiveText = 'Selected an item.';\n    }\n\n    this._updateSelectedOptions();\n\n    // close listbox\n    if (!this.multiple) {\n      this.open = false;\n    }\n\n    // emit selected value\n    this.emitValue();\n  }\n\n  private _handleBlur(e: any) {\n    const relatedTarget = e.detail.origEvent.relatedTarget;\n\n    if (\n      !relatedTarget ||\n      (relatedTarget.localName !== 'kyn-dropdown-option' &&\n        relatedTarget.localName !== 'kyn-dropdown')\n    ) {\n      this.open = false;\n    }\n  }\n\n  private _handleClickOut(e: Event) {\n    if (!e.composedPath().includes(this)) {\n      this.open = false;\n    }\n  }\n\n  override connectedCallback() {\n    super.connectedCallback();\n\n    // preserve FormMixin connectedCallback function\n    this._onConnected();\n\n    document.addEventListener('click', (e) => this._handleClickOut(e));\n\n    // capture child options click event\n    this.addEventListener('on-click', (e: any) => this._handleClick(e));\n\n    // capture child options blur event\n    this.addEventListener('on-blur', (e: any) => this._handleBlur(e));\n  }\n\n  override disconnectedCallback() {\n    // preserve FormMixin disconnectedCallback function\n    this._onDisconnected();\n\n    document.removeEventListener('click', (e) => this._handleClickOut(e));\n    this.removeEventListener('on-click', (e: any) => this._handleClick(e));\n    this.removeEventListener('on-blur', (e: any) => this._handleBlur(e));\n\n    super.disconnectedCallback();\n  }\n\n  private updateValue(value: string, selected = false) {\n    // set value\n    if (this.multiple) {\n      const values =\n        this.value === '' ? [] : JSON.parse(JSON.stringify(this.value));\n\n      // update array\n      if (selected) {\n        values.push(value);\n      } else {\n        const index = values.indexOf(value);\n        values.splice(index, 1);\n      }\n\n      this.value = values;\n    } else {\n      this.value = value;\n    }\n\n    this._validate(true, false);\n\n    // reset focus\n    if (!this.multiple) {\n      if (this.searchable) {\n        this.searchEl.focus();\n      } else {\n        this.buttonEl.focus();\n      }\n    }\n  }\n\n  private _validate(interacted: Boolean, report: Boolean) {\n    // set validity flags\n    const Validity = {\n      customError: this.invalidText !== '',\n      valueMissing:\n        this.required &&\n        (!this.value ||\n          (this.multiple && !this.value.length) ||\n          (!this.multiple && this.value === '')),\n    };\n\n    // set validationMessage\n    const InternalMsg =\n      this.required && !this.value.length ? 'Please fill out this field.' : '';\n    const ValidationMessage =\n      this.invalidText !== '' ? this.invalidText : InternalMsg;\n\n    // set validity on custom element, anchor to buttonEl\n    this._internals.setValidity(Validity, ValidationMessage, this.buttonEl);\n\n    // set internal validation message if value was changed by user input\n    if (interacted) {\n      this._internalValidationMsg = InternalMsg;\n    }\n\n    // focus the buttonEl to show validity\n    if (report) {\n      this._internals.reportValidity();\n    }\n  }\n\n  private emitValue() {\n    const event = new CustomEvent('on-change', {\n      detail: {\n        value: this.value,\n      },\n    });\n    this.dispatchEvent(event);\n  }\n\n  private _emitSearch() {\n    const event = new CustomEvent('on-search', {\n      detail: {\n        searchText: this.searchText,\n      },\n    });\n    this.dispatchEvent(event);\n  }\n\n  override willUpdate(changedProps: any) {\n    if (changedProps.has('textStrings')) {\n      this._textStrings = deepmerge(_defaultTextStrings, this.textStrings);\n    }\n  }\n\n  override updated(changedProps: any) {\n    // preserve FormMixin updated function\n    this._onUpdated(changedProps);\n\n    if (changedProps.has('value')) {\n      const Slot: any = this.shadowRoot?.querySelector('slot#children');\n      const Options: Array<any> = Slot.assignedElements().filter(\n        (option: any) => !option.disabled\n      );\n      const SelectedOptions: Array<any> = Options.filter(\n        (option: any) => option.selected\n      );\n\n      // sync \"Select All\" checkbox state\n      this.selectAllChecked = SelectedOptions.length === Options.length;\n\n      // sync \"Select All\" indeterminate state\n      this.selectAllIndeterminate =\n        SelectedOptions.length < Options.length && SelectedOptions.length > 0;\n\n      this._updateOptions();\n      this._updateTags();\n\n      // update selected option text\n      const AllOptions: any = Array.from(\n        this.querySelectorAll('kyn-dropdown-option')\n      );\n\n      if (!this.multiple) {\n        if (AllOptions.length && this.value !== '') {\n          const option = AllOptions.find(\n            (option: any) => option.value === this.value\n          );\n\n          this.text = option.textContent;\n        }\n\n        // set search input value\n        if (this.searchable && this.text) {\n          this.searchText = this.text === this.placeholder ? '' : this.text;\n          this.searchEl.value = this.searchText;\n        }\n      }\n    }\n\n    if (changedProps.has('open')) {\n      if (this.open && !this.searchable) {\n        // focus listbox if not searchable\n        this.listboxEl.focus({ preventScroll: true });\n        this.assistiveText =\n          'Selecting items. Use up and down arrow keys to navigate.';\n      }\n\n      if (this.open) {\n        if (!this.multiple) {\n          // scroll to selected option\n          this.options\n            .find((option) => option.selected)\n            ?.scrollIntoView({ block: 'nearest' });\n        }\n\n        // open dropdown upwards if closer to bottom of viewport\n        const Threshold = 0.6;\n\n        if (\n          this.buttonEl.getBoundingClientRect().top >\n          window.innerHeight * Threshold\n        ) {\n          this._openUpwards = true;\n        } else {\n          this._openUpwards = false;\n        }\n      }\n    }\n\n    if (changedProps.has('multiple')) {\n      // set multiple for each option\n      this.options.forEach((option: any) => {\n        option.multiple = this.multiple;\n      });\n    }\n\n    if (changedProps.has('searchText') && this.searchEl) {\n      this.searchEl.value = this.searchText;\n    }\n  }\n\n  // add selected options to Tags array\n  private _updateTags() {\n    if (this.multiple) {\n      const Options: any = Array.from(\n        this.querySelectorAll('kyn-dropdown-option')\n      );\n      const Tags: Array<object> = [];\n\n      if (Options) {\n        Options.forEach((option: any) => {\n          if (option.selected) {\n            Tags.push({\n              value: option.value,\n              text: option.textContent,\n            });\n          }\n        });\n\n        this._tags = Tags;\n      }\n    }\n  }\n\n  private _updateOptions() {\n    const Options: any = Array.from(\n      this.querySelectorAll('kyn-dropdown-option')\n    );\n\n    Options.forEach((option: any) => {\n      // set option multiple state\n      option.multiple = this.multiple;\n\n      if (this.multiple) {\n        const Selected = this.value.includes(option.value);\n        // set option selected state\n        option.selected = Selected;\n      } else {\n        option.selected = this.value === option.value;\n      }\n    });\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'kyn-dropdown': Dropdown;\n  }\n}\n"],"names":["_defaultTextStrings","title","selectedOptions","requiredText","errorText","clearAll","Dropdown","FormMixin","LitElement","constructor","this","label","size","inline","caption","placeholder","open","searchable","filterSearch","multiple","required","hideLabel","disabled","hideTags","selectAll","selectAllText","menuMinWidth","selectAllChecked","selectAllIndeterminate","textStrings","_textStrings","text","searchText","assistiveText","_openUpwards","_tags","searchTextEntered","prevSearchKeydownIndex","render","html","name","_handleLabelClick","_a","classMap","wrapper","select","_isInvalid","handleClick","e","handleButtonKeydown","preventDefault","handleButtonBlur","value","length","handleClearMultiple","unsafeSVG","clearIcon","handleSearchKeydown","handleSearchInput","handleSearchBlur","handleSearchClick","downIcon","options","upwards","handleListKeydown","handleListBlur","handleSlotChange","handleClear","renderHelperContent","map","tag","handleTagClear","errorIcon","invalidText","_internalValidationMsg","firstUpdated","_updateOptions","searchEl","focus","buttonEl","handleKeyboard","keyCode","forEach","option","highlighted","relatedTarget","localName","target","SPACEBAR_KEY_CODE","visibleOptions","filter","style","display","highlightedEl","find","selectedEl","selected","highlightedIndex","indexOf","includes","isListboxElOpened","openDropdown","clearMultipleEl","scrollIntoView","block","innerHTML","updateValue","emitValue","nextIndex","stopPropagation","_validate","_updateSelectedOptions","event","CustomEvent","detail","dispatchEvent","_emitSearch","classList","contains","_b","findIndex","toLowerCase","startsWith","_handleClick","_handleBlur","origEvent","_handleClickOut","composedPath","connectedCallback","super","_onConnected","document","addEventListener","disconnectedCallback","_onDisconnected","removeEventListener","values","JSON","parse","stringify","push","index","splice","interacted","report","Validity","customError","valueMissing","InternalMsg","ValidationMessage","_internals","setValidity","reportValidity","willUpdate","changedProps","has","deepmerge","updated","_onUpdated","Options","shadowRoot","querySelector","assignedElements","SelectedOptions","_updateTags","AllOptions","Array","from","querySelectorAll","textContent","listboxEl","preventScroll","Threshold","getBoundingClientRect","top","window","innerHeight","Tags","Selected","styles","DropdownScss","__decorate","property","type","String","prototype","Boolean","Object","state","queryAssignedElements","selector","query","customElement"],"mappings":"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"}
+{"version":3,"file":"dropdown.js","sources":["../../../../src/components/reusable/dropdown/dropdown.ts"],"sourcesContent":["import { unsafeSVG } from 'lit-html/directives/unsafe-svg.js';\nimport { LitElement, html } from 'lit';\nimport {\n  customElement,\n  property,\n  state,\n  query,\n  queryAssignedElements,\n} from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport DropdownScss from './dropdown.scss';\nimport { FormMixin } from '../../../common/mixins/form-input';\nimport { deepmerge } from 'deepmerge-ts';\n\nimport './dropdownOption';\nimport '../tag';\nimport '../button';\n\nimport downIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/16/chevron-down.svg';\nimport errorIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/16/error-filled.svg';\nimport clearIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/20/close-simple.svg';\n\nconst _defaultTextStrings = {\n  title: 'Dropdown',\n  selectedOptions: 'List of selected options',\n  requiredText: 'Required',\n  errorText: 'Error',\n  clearAll: 'Clear all',\n};\n\n/**\n * Dropdown, single select.\n * @fires on-change - Captures the input event and emits the selected value and original event details.\n * @fires on-search - Capture the search input event and emits the search text.\n * @fires on-clear-all - Captures the the multi-select clear all button click event and emits the value.\n * @slot unnamed - Slot for dropdown options.\n * @slot tooltip - Slot for tooltip.\n */\n@customElement('kyn-dropdown')\nexport class Dropdown extends FormMixin(LitElement) {\n  static override styles = DropdownScss;\n\n  /** Label text. */\n  @property({ type: String })\n  label = '';\n\n  /** Dropdown size/height. \"sm\", \"md\", or \"lg\". */\n  @property({ type: String })\n  size = 'md';\n\n  /** Dropdown inline style type. */\n  @property({ type: Boolean })\n  inline = false;\n\n  /** Optional text beneath the input. */\n  @property({ type: String })\n  caption = '';\n\n  /** Dropdown placeholder. */\n  @property({ type: String })\n  placeholder = '';\n\n  /** Listbox/drawer open state. */\n  @property({ type: Boolean })\n  open = false;\n\n  /** Makes the dropdown searchable. */\n  @property({ type: Boolean })\n  searchable = false;\n\n  /** Searchable variant filters results. */\n  @property({ type: Boolean })\n  filterSearch = false;\n\n  /** Enabled multi-select functionality. */\n  @property({ type: Boolean })\n  multiple = false;\n\n  /** Makes the dropdown required. */\n  @property({ type: Boolean })\n  required = false;\n\n  /** Visually hide the label. */\n  @property({ type: Boolean })\n  hideLabel = false;\n\n  /** Dropdown disabled state. */\n  @property({ type: Boolean })\n  disabled = false;\n\n  /** Hide the tags below multi-select. */\n  @property({ type: Boolean })\n  hideTags = false;\n\n  /** Adds a \"Select all\" option to the top of a multi-select dropdown. */\n  @property({ type: Boolean })\n  selectAll = false;\n\n  /** \"Select all\" text customization. */\n  @property({ type: String })\n  selectAllText = 'Select all';\n\n  /** Menu CSS min-width value. */\n  @property({ type: String })\n  menuMinWidth = 'initial';\n\n  /** Is \"Select All\" box checked.\n   * @internal\n   */\n  @property({ type: Boolean })\n  selectAllChecked = false;\n\n  /** Is \"Select All\" indeterminate.\n   * @internal\n   */\n  @property({ type: Boolean })\n  selectAllIndeterminate = false;\n\n  /** Text string customization. */\n  @property({ type: Object })\n  textStrings = _defaultTextStrings;\n\n  /** Internal text strings.\n   * @internal\n   */\n  @state()\n  _textStrings = _defaultTextStrings;\n\n  /**\n   * Selected option text, automatically derived.\n   * @ignore\n   */\n  @state()\n  text = '';\n\n  /**\n   * Search input value.\n   */\n  @property({ type: String })\n  searchText = '';\n\n  /**\n   * Assistive text for screen readers.\n   * @ignore\n   */\n  @state()\n  assistiveText = 'Dropdown menu options.';\n\n  /**\n   * Queries any slotted options.\n   * @ignore\n   */\n  @queryAssignedElements({ selector: 'kyn-dropdown-option' })\n  options!: Array<any>;\n\n  /**\n   * Queries any slotted selected options.\n   * @ignore\n   */\n  @queryAssignedElements({ selector: 'kyn-dropdown-option[selected]' })\n  selectedOptions!: Array<any>;\n\n  /**\n   * Queries the .search DOM element.\n   * @ignore\n   */\n  @query('.search')\n  searchEl!: HTMLInputElement;\n\n  /**\n   * Queries the .select DOM element.\n   * @ignore\n   */\n  @query('.select')\n  buttonEl!: HTMLElement;\n\n  /**\n   * Queries the .options DOM element.\n   * @ignore\n   */\n  @query('.options')\n  listboxEl!: HTMLElement;\n\n  /**\n   * Queries the .clear-multiple DOM element.\n   * @ignore\n   */\n  @query('.clear-multiple')\n  clearMultipleEl!: HTMLElement;\n\n  /**\n   * Open drawer upwards.\n   * @ignore\n   */\n  @state()\n  _openUpwards = false;\n\n  /**\n   * Tags value/text reference.\n   * @ignore\n   */\n  @state()\n  _tags: Array<object> = [];\n\n  /** Toggles on clicking enter key in the search input.\n   * @internal\n   */\n  searchTextEntered: any = false;\n\n  /** Toggles on clicking enter key in the search input.\n   * @internal\n   */\n  prevSearchKeydownIndex = -1;\n\n  override render() {\n    return html`\n      <div\n        class=\"dropdown\"\n        ?disabled=${this.disabled}\n        ?open=${this.open}\n        ?inline=${this.inline}\n        ?searchable=${this.searchable}\n      >\n        <label\n          id=\"label-${this.name}\"\n          class=\"label-text ${this.hideLabel || this.inline ? 'sr-only' : ''}\"\n          for=${this.name}\n          aria-disabled=${this.disabled}\n          @click=${() => this._handleLabelClick()}\n        >\n          ${this.required\n            ? html`<abbr\n                class=\"required\"\n                title=${this._textStrings.requiredText}\n                role=\"img\"\n                aria-label=${this._textStrings?.requiredText || 'Required'}\n                >*</abbr\n              >`\n            : null}\n          ${this.label}\n          <slot name=\"tooltip\"></slot>\n        </label>\n\n        <div\n          class=${classMap({\n            wrapper: true,\n            open: this.open,\n          })}\n        >\n          <div class=\"custom\">\n            <div\n              class=\"${classMap({\n                select: true,\n                'input-custom': true,\n                'size--sm': this.size === 'sm',\n                'size--lg': this.size === 'lg',\n                inline: this.inline,\n              })}\"\n              aria-labelledby=\"label-${this.name}\"\n              aria-expanded=${this.open}\n              aria-controls=\"options\"\n              role=\"combobox\"\n              id=${this.name}\n              name=${this.name}\n              title=${this._textStrings.title}\n              ?required=${this.required}\n              ?disabled=${this.disabled}\n              ?invalid=${this._isInvalid}\n              tabindex=${this.disabled ? '' : '0'}\n              @click=${() => this.handleClick()}\n              @keydown=${(e: any) => this.handleButtonKeydown(e)}\n              @mousedown=${(e: any) => {\n                if (!this.searchable) {\n                  e.preventDefault();\n                }\n              }}\n              @blur=${(e: any) => this.handleButtonBlur(e)}\n            >\n              ${this.multiple && this.value.length\n                ? html`\n                    <button\n                      class=\"clear-multiple\"\n                      aria-label=\"${this.value\n                        .length} items selected. Clear selections\"\n                      ?disabled=${this.disabled}\n                      @click=${(e: Event) => this.handleClearMultiple(e)}\n                    >\n                      ${this.value.length}\n                      <span style=\"display:flex;\" slot=\"icon\"\n                        >${unsafeSVG(clearIcon)}</span\n                      >\n                    </button>\n                  `\n                : null}\n              ${this.searchable\n                ? html`\n                    <input\n                      class=\"search\"\n                      type=\"text\"\n                      placeholder=${this.placeholder}\n                      value=${this.searchText}\n                      ?disabled=${this.disabled}\n                      aria-disabled=${this.disabled}\n                      @keydown=${(e: any) => this.handleSearchKeydown(e)}\n                      @input=${(e: any) => this.handleSearchInput(e)}\n                      @blur=${(e: any) => this.handleSearchBlur(e)}\n                      @click=${(e: any) => this.handleSearchClick(e)}\n                    />\n                  `\n                : html`\n                    <span aria-disabled=${this.disabled}>\n                      ${this.multiple\n                        ? this.placeholder\n                        : this.value === ''\n                        ? this.placeholder\n                        : this.text}\n                    </span>\n                  `}\n\n              <span class=\"arrow-icon\">${unsafeSVG(downIcon)}</span>\n            </div>\n\n            <ul\n              id=\"options\"\n              class=${classMap({\n                options: true,\n                open: this.open,\n                upwards: this._openUpwards,\n              })}\n              style=\"min-width: ${this.menuMinWidth};\"\n              aria-labelledby=\"label-${this.name}\"\n              name=${this.name}\n              role=\"listbox\"\n              tabindex=\"0\"\n              aria-expanded=${this.open}\n              aria-hidden=${!this.open}\n              @keydown=${(e: any) => this.handleListKeydown(e)}\n              @blur=${(e: any) => this.handleListBlur(e)}\n            >\n              ${this.multiple && this.selectAll\n                ? html`\n                    <kyn-dropdown-option\n                      class=\"select-all\"\n                      value=\"selectAll\"\n                      multiple\n                      ?selected=${this.selectAllChecked}\n                      ?indeterminate=${this.selectAllIndeterminate}\n                      ?disabled=${this.disabled}\n                    >\n                      ${this.selectAllText}\n                    </kyn-dropdown-option>\n                  `\n                : null}\n\n              <slot\n                id=\"children\"\n                @slotchange=${() => this.handleSlotChange()}\n              ></slot>\n            </ul>\n          </div>\n          ${this.searchText !== ''\n            ? html`\n                <kyn-button\n                  ?disabled=${this.disabled}\n                  class=\"clear-button dropdown-clear\"\n                  kind=\"ghost\"\n                  size=\"small\"\n                  description=${this._textStrings.clearAll}\n                  @click=${(e: Event) => this.handleClear(e)}\n                >\n                  <span style=\"display:flex;\" slot=\"icon\"\n                    >${unsafeSVG(clearIcon)}</span\n                  >\n                </kyn-button>\n              `\n            : null}\n        </div>\n        ${this.renderHelperContent()}\n      </div>\n    `;\n  }\n\n  private renderHelperContent() {\n    return html`\n        ${\n          this.multiple && !this.hideTags && this._tags.length\n            ? html`\n                <kyn-tag-group\n                  filter\n                  role=\"list\"\n                  aria-label=${this._textStrings.selectedOptions}\n                >\n                  ${this._tags.map((tag: any) => {\n                    return html`\n                      <kyn-tag\n                        role=\"listitem\"\n                        label=${tag.text}\n                        ?disabled=${this.disabled}\n                        clearTagText=\"Clear Tag ${tag.text}\"\n                        @on-close=${() => this.handleTagClear(tag.value)}\n                      ></kyn-tag>\n                    `;\n                  })}\n                </kyn-tag-group>\n              `\n            : null\n        }\n        ${\n          this.caption !== ''\n            ? html`\n                <div class=\"caption\" aria-disabled=${this.disabled}>\n                  ${this.caption}\n                </div>\n              `\n            : null\n        }\n        ${\n          this._isInvalid\n            ? html`\n                <div class=\"error\">\n                  <span\n                    class=\"error-icon\"\n                    role=\"img\"\n                    title=${this._textStrings.errorText}\n                    aria-label=${this._textStrings.errorText}\n                    >${unsafeSVG(errorIcon)}</span\n                  >\n                  ${this.invalidText || this._internalValidationMsg}\n                </div>\n              `\n            : null\n        }\n\n        <div\n          class=\"assistive-text\"\n          role=\"status\"\n          aria-live=\"assertive\"\n          aria-relevant=\"additions text\"\n        >\n          ${this.assistiveText}\n        </div>\n      </div>\n    `;\n  }\n\n  override firstUpdated() {\n    // set a default placeholder if none provided\n    if (this.placeholder === '') {\n      if (this.searchable) {\n        this.placeholder = 'Search';\n      } else {\n        if (this.multiple) {\n          this.placeholder = 'Select items';\n        } else {\n          this.placeholder = 'Select an option';\n        }\n      }\n    }\n  }\n\n  private handleSlotChange() {\n    this._updateOptions();\n  }\n\n  private handleClick() {\n    if (!this.disabled) {\n      this.open = !this.open;\n\n      // focus search input if searchable\n      if (this.searchable) {\n        this.searchEl.focus();\n      } else {\n        this.buttonEl.focus();\n      }\n    }\n  }\n\n  private _handleLabelClick() {\n    if (!this.disabled) {\n      this.open = !this.open;\n\n      if (this.searchable) {\n        this.searchEl.focus();\n      } else {\n        this.buttonEl.focus();\n      }\n    }\n  }\n\n  private handleButtonKeydown(e: any) {\n    this.handleKeyboard(e, e.keyCode, 'button');\n  }\n\n  private handleListKeydown(e: any) {\n    const TAB_KEY_CODE = 9;\n\n    if (e.keyCode !== TAB_KEY_CODE) {\n      e.preventDefault();\n    }\n\n    this.handleKeyboard(e, e.keyCode, 'list');\n  }\n\n  private handleListBlur(e: any) {\n    this.options.forEach((option) => (option.highlighted = false));\n\n    // don't blur if clicking an option inside\n    if (\n      e.relatedTarget &&\n      e.relatedTarget.localName !== 'kyn-dropdown-option'\n    ) {\n      this.open = false;\n    }\n    this.assistiveText = 'Dropdown menu options.';\n  }\n\n  private handleKeyboard(e: any, keyCode: number, target: string) {\n    const SPACEBAR_KEY_CODE = [0, 32];\n    const ENTER_KEY_CODE = 13;\n    const DOWN_ARROW_KEY_CODE = 40;\n    const UP_ARROW_KEY_CODE = 38;\n    const ESCAPE_KEY_CODE = 27;\n\n    // get highlighted element + index and selected element\n    const visibleOptions = this.options.filter(\n      (option: any) => option.style.display !== 'none'\n    );\n    const highlightedEl = visibleOptions.find(\n      (option: any) => option.highlighted\n    );\n    const selectedEl = visibleOptions.find((option: any) => option.selected);\n    let highlightedIndex = highlightedEl\n      ? visibleOptions.indexOf(highlightedEl)\n      : visibleOptions.find((option: any) => option.selected)\n      ? visibleOptions.indexOf(selectedEl)\n      : 0;\n\n    // prevent page scroll on spacebar press\n    if (SPACEBAR_KEY_CODE.includes(keyCode)) {\n      e.preventDefault();\n    }\n\n    const isListboxElOpened = this.open;\n    // open the listbox\n    if (target === 'button') {\n      let openDropdown =\n        SPACEBAR_KEY_CODE.includes(keyCode) ||\n        keyCode === ENTER_KEY_CODE ||\n        keyCode == DOWN_ARROW_KEY_CODE ||\n        keyCode == UP_ARROW_KEY_CODE;\n\n      if (e.target === this.clearMultipleEl) {\n        openDropdown = false;\n        visibleOptions[highlightedIndex].highlighted = false;\n        visibleOptions[highlightedIndex].selected =\n          !visibleOptions[highlightedIndex].selected;\n        highlightedIndex = 0;\n        if (keyCode !== ENTER_KEY_CODE) return;\n      }\n\n      if (openDropdown) {\n        this.open = true;\n\n        // scroll to highlighted option\n        if (!this.multiple && this.value !== '') {\n          visibleOptions[highlightedIndex].scrollIntoView({ block: 'nearest' });\n        }\n      }\n    }\n    switch (keyCode) {\n      case 0:\n      case 32:\n      case ENTER_KEY_CODE: {\n        // select highlighted option\n        visibleOptions[highlightedIndex].highlighted = true;\n        if (isListboxElOpened) {\n          if (this.multiple) {\n            visibleOptions[highlightedIndex].selected =\n              !visibleOptions[highlightedIndex].selected;\n            if (visibleOptions[highlightedIndex].selected) {\n              this.assistiveText = `Selected ${visibleOptions[highlightedIndex].innerHTML}`;\n            } else {\n              this.assistiveText = `Deselected ${visibleOptions[highlightedIndex].innerHTML}`;\n            }\n          } else {\n            visibleOptions.forEach((e) => (e.selected = false));\n            visibleOptions[highlightedIndex].selected = true;\n            this.open = false;\n            this.assistiveText = `Selected ${visibleOptions[highlightedIndex].innerHTML}`;\n          }\n        }\n        if (highlightedEl && isListboxElOpened)\n          this.updateValue(\n            visibleOptions[highlightedIndex].value,\n            visibleOptions[highlightedIndex].selected\n          );\n\n        this.emitValue();\n        return;\n      }\n      case DOWN_ARROW_KEY_CODE: {\n        // go to next option\n        let nextIndex =\n          !highlightedEl && !selectedEl\n            ? 0\n            : highlightedIndex === visibleOptions.length - 1\n            ? 0\n            : highlightedIndex + 1;\n\n        // skip disabled options\n        if (visibleOptions[nextIndex].disabled) {\n          nextIndex =\n            nextIndex === visibleOptions.length - 1 ? 0 : nextIndex + 1;\n        }\n\n        visibleOptions[highlightedIndex].highlighted = false;\n        visibleOptions[nextIndex].highlighted = true;\n\n        // scroll to option\n        visibleOptions[nextIndex].scrollIntoView({ block: 'nearest' });\n\n        this.assistiveText = visibleOptions[nextIndex].text;\n        return;\n      }\n      case UP_ARROW_KEY_CODE: {\n        // go to previous option\n        let nextIndex =\n          highlightedIndex === 0\n            ? visibleOptions.length - 1\n            : highlightedIndex - 1;\n\n        // skip disabled options\n        if (visibleOptions[nextIndex].disabled) {\n          nextIndex =\n            nextIndex === 0 ? visibleOptions.length - 1 : nextIndex - 1;\n        }\n\n        visibleOptions[highlightedIndex].highlighted = false;\n        visibleOptions[nextIndex].highlighted = true;\n\n        // scroll to option\n        visibleOptions[nextIndex].scrollIntoView({ block: 'nearest' });\n\n        this.assistiveText = visibleOptions[nextIndex].text;\n        return;\n      }\n      case ESCAPE_KEY_CODE: {\n        // close listbox\n        this.open = false;\n\n        // restore focus\n        if (this.searchable) {\n          this.searchEl.focus();\n        } else {\n          this.buttonEl.focus();\n        }\n\n        this.assistiveText = 'Dropdown menu options.';\n        return;\n      }\n      default: {\n        return;\n      }\n    }\n  }\n\n  private handleClearMultiple(e: any) {\n    e.stopPropagation();\n\n    // clear values\n    if (this.multiple) {\n      this.value = [];\n    } else {\n      this.value = '';\n    }\n\n    this._validate(true, false);\n    this._updateSelectedOptions();\n    this.emitValue();\n\n    const event = new CustomEvent('on-clear-all', {\n      detail: {\n        value: this.value,\n      },\n    });\n    this.dispatchEvent(event);\n  }\n\n  private handleTagClear(value: string) {\n    // remove value\n    this.updateValue(value, false);\n    this._updateSelectedOptions();\n    this.emitValue();\n  }\n\n  private handleClear(e: any) {\n    e.stopPropagation();\n\n    // reset search input text\n    this.text = '';\n    this.searchText = '';\n    this.searchEl.value = '';\n\n    this._emitSearch();\n\n    if (this.filterSearch) {\n      // reveal all options\n      this.options.map((option: any) => {\n        option.style.display = 'block';\n      });\n    }\n\n    // clear selection for single select\n    if (!this.multiple) {\n      this.value = '';\n      this._validate(true, false);\n      this._updateSelectedOptions();\n      this.emitValue();\n    }\n  }\n\n  private handleSearchClick(e: any) {\n    e.stopPropagation();\n    this.open = true;\n  }\n\n  private handleButtonBlur(e: any) {\n    // don't blur if entering listbox or search input\n    if (\n      !e.relatedTarget?.classList.contains('options') &&\n      !e.relatedTarget?.classList.contains('search')\n    ) {\n      this.open = false;\n    }\n    this._validate(true, false);\n  }\n\n  private handleSearchBlur(e: any) {\n    // don't blur if entering listbox of button\n    if (\n      !e.relatedTarget ||\n      (e.relatedTarget.localName !== 'kyn-dropdown-option' &&\n        !e.relatedTarget?.classList.contains('options') &&\n        !e.relatedTarget?.classList.contains('select'))\n    ) {\n      this.open = false;\n    }\n    this._validate(true, false);\n  }\n\n  private handleSearchKeydown(e: any) {\n    e.stopPropagation();\n\n    const ENTER_KEY_CODE = 13;\n    const ESCAPE_KEY_CODE = 27;\n    const option = this.options.find((option) => option.highlighted);\n    const highlightedIndex = this.options.findIndex(\n      (option) => option.highlighted\n    );\n    this.searchTextEntered = false;\n    // select option\n    if (e.keyCode === ENTER_KEY_CODE) {\n      this.searchTextEntered = true;\n      if (option) {\n        if (this.prevSearchKeydownIndex !== highlightedIndex) {\n          if (this.multiple) {\n            option.selected = !option.selected;\n          } else {\n            this.options.forEach((e) => (e.selected = false));\n            option.selected = true;\n            this.open = false;\n          }\n          this.updateValue(option.value, option.selected);\n        }\n\n        if (option.selected) {\n          this.assistiveText = `Selected ${option.innerHTML}`;\n          this.prevSearchKeydownIndex = highlightedIndex;\n        } else {\n          this.assistiveText = `Deselected ${option.innerHTML}`;\n        }\n      } else {\n        this.assistiveText = 'No item matched.';\n      }\n    }\n\n    // close listbox\n    if (e.keyCode === ESCAPE_KEY_CODE) {\n      this.open = false;\n      this.buttonEl.focus();\n    }\n  }\n\n  private handleSearchInput(e: any) {\n    const value = e.target.value;\n    this.searchText = value;\n    this.open = true;\n\n    this._emitSearch();\n\n    if (this.filterSearch) {\n      // hide items that don't match\n      this.options.map((option: any) => {\n        const text = option.text;\n        if (text.toLowerCase().includes(value.toLowerCase())) {\n          option.style.display = 'block';\n        } else {\n          option.style.display = 'none';\n        }\n      });\n    } else {\n      // find matches\n      const options = this.options.filter((option: any) => {\n        const text = option.text;\n        return text.toLowerCase().startsWith(value.toLowerCase());\n      });\n\n      // reset options highlighted state\n      this.options.forEach((option) => (option.highlighted = false));\n\n      // option highlight and scroll\n      if (value !== '' && options.length) {\n        options[0].highlighted = true;\n        options[0].scrollIntoView({ block: 'nearest' });\n        if (this.searchTextEntered) this.assistiveText = 'Option Matched';\n      }\n    }\n  }\n\n  private _updateSelectedOptions() {\n    // set selected state for each option\n    this.options.forEach((option: any) => {\n      if (this.multiple) {\n        option.selected = this.value.includes(option.value);\n      } else {\n        option.selected = this.value === option.value;\n      }\n    });\n  }\n\n  private _handleClick(e: any) {\n    if (e.detail.value === 'selectAll') {\n      if (e.detail.selected) {\n        this.value = this.options\n          .filter((option) => !option.disabled)\n          .map((option) => {\n            return option.value;\n          });\n        this.assistiveText = 'Selected all items.';\n      } else {\n        this.value = [];\n        this.assistiveText = 'Deselected all items.';\n      }\n\n      this._validate(true, false);\n    } else {\n      this.updateValue(e.detail.value, e.detail.selected);\n      this.assistiveText = 'Selected an item.';\n    }\n\n    this._updateSelectedOptions();\n\n    // close listbox\n    if (!this.multiple) {\n      this.open = false;\n    }\n\n    // emit selected value\n    this.emitValue();\n  }\n\n  private _handleBlur(e: any) {\n    const relatedTarget = e.detail.origEvent.relatedTarget;\n\n    if (\n      !relatedTarget ||\n      (relatedTarget.localName !== 'kyn-dropdown-option' &&\n        relatedTarget.localName !== 'kyn-dropdown')\n    ) {\n      this.open = false;\n    }\n  }\n\n  private _handleClickOut(e: Event) {\n    if (!e.composedPath().includes(this)) {\n      this.open = false;\n    }\n  }\n\n  override connectedCallback() {\n    super.connectedCallback();\n\n    // preserve FormMixin connectedCallback function\n    this._onConnected();\n\n    document.addEventListener('click', (e) => this._handleClickOut(e));\n\n    // capture child options click event\n    this.addEventListener('on-click', (e: any) => this._handleClick(e));\n\n    // capture child options blur event\n    this.addEventListener('on-blur', (e: any) => this._handleBlur(e));\n  }\n\n  override disconnectedCallback() {\n    // preserve FormMixin disconnectedCallback function\n    this._onDisconnected();\n\n    document.removeEventListener('click', (e) => this._handleClickOut(e));\n    this.removeEventListener('on-click', (e: any) => this._handleClick(e));\n    this.removeEventListener('on-blur', (e: any) => this._handleBlur(e));\n\n    super.disconnectedCallback();\n  }\n\n  private updateValue(value: string, selected = false) {\n    // set value\n    if (this.multiple) {\n      const values =\n        this.value === '' ? [] : JSON.parse(JSON.stringify(this.value));\n\n      // update array\n      if (selected) {\n        values.push(value);\n      } else {\n        const index = values.indexOf(value);\n        values.splice(index, 1);\n      }\n\n      this.value = values;\n    } else {\n      this.value = value;\n    }\n\n    this._validate(true, false);\n\n    // reset focus\n    if (!this.multiple) {\n      if (this.searchable) {\n        this.searchEl.focus();\n      } else {\n        this.buttonEl.focus();\n      }\n    }\n  }\n\n  private _validate(interacted: Boolean, report: Boolean) {\n    // set validity flags\n    const Validity = {\n      customError: this.invalidText !== '',\n      valueMissing:\n        this.required &&\n        (!this.value ||\n          (this.multiple && !this.value.length) ||\n          (!this.multiple && this.value === '')),\n    };\n\n    // set validationMessage\n    const InternalMsg =\n      this.required && !this.value.length ? 'Please fill out this field.' : '';\n    const ValidationMessage =\n      this.invalidText !== '' ? this.invalidText : InternalMsg;\n\n    // set validity on custom element, anchor to buttonEl\n    this._internals.setValidity(Validity, ValidationMessage, this.buttonEl);\n\n    // set internal validation message if value was changed by user input\n    if (interacted) {\n      this._internalValidationMsg = InternalMsg;\n    }\n\n    // focus the buttonEl to show validity\n    if (report) {\n      this._internals.reportValidity();\n    }\n  }\n\n  private emitValue() {\n    const event = new CustomEvent('on-change', {\n      detail: {\n        value: this.value,\n      },\n    });\n    this.dispatchEvent(event);\n  }\n\n  private _emitSearch() {\n    const event = new CustomEvent('on-search', {\n      detail: {\n        searchText: this.searchText,\n      },\n    });\n    this.dispatchEvent(event);\n  }\n\n  override willUpdate(changedProps: any) {\n    if (changedProps.has('textStrings')) {\n      this._textStrings = deepmerge(_defaultTextStrings, this.textStrings);\n    }\n  }\n\n  override updated(changedProps: any) {\n    // preserve FormMixin updated function\n    this._onUpdated(changedProps);\n\n    if (changedProps.has('value')) {\n      const Slot: any = this.shadowRoot?.querySelector('slot#children');\n      const Options: Array<any> = Slot.assignedElements().filter(\n        (option: any) => !option.disabled\n      );\n      const SelectedOptions: Array<any> = Options.filter(\n        (option: any) => option.selected\n      );\n\n      // sync \"Select All\" checkbox state\n      this.selectAllChecked = SelectedOptions.length === Options.length;\n\n      // sync \"Select All\" indeterminate state\n      this.selectAllIndeterminate =\n        SelectedOptions.length < Options.length && SelectedOptions.length > 0;\n\n      this._updateOptions();\n      this._updateTags();\n\n      // update selected option text\n      const AllOptions: any = Array.from(\n        this.querySelectorAll('kyn-dropdown-option')\n      );\n\n      if (!this.multiple) {\n        if (AllOptions.length && this.value !== '') {\n          const option = AllOptions.find(\n            (option: any) => option.value === this.value\n          );\n          this.text = option.textContent.trim();\n        }\n\n        // set search input value\n        if (this.searchable && this.text) {\n          this.searchText = this.text === this.placeholder ? '' : this.text;\n          this.searchEl.value = this.searchText;\n        }\n      }\n    }\n\n    if (changedProps.has('open')) {\n      if (this.open && !this.searchable) {\n        // focus listbox if not searchable\n        this.listboxEl.focus({ preventScroll: true });\n        this.assistiveText =\n          'Selecting items. Use up and down arrow keys to navigate.';\n      }\n\n      if (this.open) {\n        if (!this.multiple) {\n          // scroll to selected option\n          this.options\n            .find((option) => option.selected)\n            ?.scrollIntoView({ block: 'nearest' });\n        }\n\n        // open dropdown upwards if closer to bottom of viewport\n        const Threshold = 0.6;\n\n        if (\n          this.buttonEl.getBoundingClientRect().top >\n          window.innerHeight * Threshold\n        ) {\n          this._openUpwards = true;\n        } else {\n          this._openUpwards = false;\n        }\n      }\n    }\n\n    if (changedProps.has('multiple')) {\n      // set multiple for each option\n      this.options.forEach((option: any) => {\n        option.multiple = this.multiple;\n      });\n    }\n\n    if (changedProps.has('searchText') && this.searchEl) {\n      this.searchEl.value = this.searchText;\n    }\n  }\n\n  // add selected options to Tags array\n  private _updateTags() {\n    if (this.multiple) {\n      const Options: any = Array.from(\n        this.querySelectorAll('kyn-dropdown-option')\n      );\n      const Tags: Array<object> = [];\n\n      if (Options) {\n        Options.forEach((option: any) => {\n          if (option.selected) {\n            Tags.push({\n              value: option.value,\n              text: option.textContent,\n            });\n          }\n        });\n\n        this._tags = Tags;\n      }\n    }\n  }\n\n  private _updateOptions() {\n    const Options: any = Array.from(\n      this.querySelectorAll('kyn-dropdown-option')\n    );\n\n    Options.forEach((option: any) => {\n      // set option multiple state\n      option.multiple = this.multiple;\n\n      if (this.multiple) {\n        const Selected = this.value.includes(option.value);\n        // set option selected state\n        option.selected = Selected;\n      } else {\n        option.selected = this.value === option.value;\n      }\n    });\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'kyn-dropdown': Dropdown;\n  }\n}\n"],"names":["_defaultTextStrings","title","selectedOptions","requiredText","errorText","clearAll","Dropdown","FormMixin","LitElement","constructor","this","label","size","inline","caption","placeholder","open","searchable","filterSearch","multiple","required","hideLabel","disabled","hideTags","selectAll","selectAllText","menuMinWidth","selectAllChecked","selectAllIndeterminate","textStrings","_textStrings","text","searchText","assistiveText","_openUpwards","_tags","searchTextEntered","prevSearchKeydownIndex","render","html","name","_handleLabelClick","_a","classMap","wrapper","select","_isInvalid","handleClick","e","handleButtonKeydown","preventDefault","handleButtonBlur","value","length","handleClearMultiple","unsafeSVG","clearIcon","handleSearchKeydown","handleSearchInput","handleSearchBlur","handleSearchClick","downIcon","options","upwards","handleListKeydown","handleListBlur","handleSlotChange","handleClear","renderHelperContent","map","tag","handleTagClear","errorIcon","invalidText","_internalValidationMsg","firstUpdated","_updateOptions","searchEl","focus","buttonEl","handleKeyboard","keyCode","forEach","option","highlighted","relatedTarget","localName","target","SPACEBAR_KEY_CODE","visibleOptions","filter","style","display","highlightedEl","find","selectedEl","selected","highlightedIndex","indexOf","includes","isListboxElOpened","openDropdown","clearMultipleEl","scrollIntoView","block","innerHTML","updateValue","emitValue","nextIndex","stopPropagation","_validate","_updateSelectedOptions","event","CustomEvent","detail","dispatchEvent","_emitSearch","classList","contains","_b","findIndex","toLowerCase","startsWith","_handleClick","_handleBlur","origEvent","_handleClickOut","composedPath","connectedCallback","super","_onConnected","document","addEventListener","disconnectedCallback","_onDisconnected","removeEventListener","values","JSON","parse","stringify","push","index","splice","interacted","report","Validity","customError","valueMissing","InternalMsg","ValidationMessage","_internals","setValidity","reportValidity","willUpdate","changedProps","has","deepmerge","updated","_onUpdated","Options","shadowRoot","querySelector","assignedElements","SelectedOptions","_updateTags","AllOptions","Array","from","querySelectorAll","textContent","trim","listboxEl","preventScroll","Threshold","getBoundingClientRect","top","window","innerHeight","Tags","Selected","styles","DropdownScss","__decorate","property","type","String","prototype","Boolean","Object","state","queryAssignedElements","selector","query","customElement"],"mappings":"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"}

package/components/reusable/dropdown/dropdownOption.d.ts

@@ -4,6 +4,7 @@ import '../checkbox';
  * Dropdown option.
  * @fires on-click - Emits the option details to the parent dropdown.
  * @slot unnamed - Slot for option text.
+ * @slot icon - Slot for option icon. Icon size should be 16px only.
  */
 export declare class DropdownOption extends LitElement {
     static styles: any;

package/components/reusable/dropdown/dropdownOption.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dropdownOption.d.ts","sourceRoot":"","sources":["../../../../src/components/reusable/dropdown/dropdownOption.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAGvC,OAAO,aAAa,CAAC;AAMrB;;;;GAIG;AACH,qBACa,cAAe,SAAQ,UAAU;IAC5C,OAAgB,MAAM,MAAsB;IAE5C,oBAAoB;IAEpB,KAAK,SAAM;IAEX;;OAEG;IAEH,QAAQ,UAAS;IAEjB,6BAA6B;IAE7B,QAAQ,UAAS;IAEjB;;;OAGG;IAEH,WAAW,UAAS;IAEpB;;OAEG;IAEH,QAAQ,UAAS;IAEjB;;;OAGG;IAEH,IAAI,EAAE,GAAG,CAAM;IAEf,oEAAoE;IAEpE,aAAa,UAAS;IAEb,MAAM;IA2Cf,OAAO,CAAC,gBAAgB;IAYxB,OAAO,CAAC,WAAW;IA0BnB,OAAO,CAAC,UAAU;CAWnB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,qBAAqB,EAAE,cAAc,CAAC;KACvC;CACF"}
+{"version":3,"file":"dropdownOption.d.ts","sourceRoot":"","sources":["../../../../src/components/reusable/dropdown/dropdownOption.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAGvC,OAAO,aAAa,CAAC;AAMrB;;;;;GAKG;AACH,qBACa,cAAe,SAAQ,UAAU;IAC5C,OAAgB,MAAM,MAAsB;IAE5C,oBAAoB;IAEpB,KAAK,SAAM;IAEX;;OAEG;IAEH,QAAQ,UAAS;IAEjB,6BAA6B;IAE7B,QAAQ,UAAS;IAEjB;;;OAGG;IAEH,WAAW,UAAS;IAEpB;;OAEG;IAEH,QAAQ,UAAS;IAEjB;;;OAGG;IAEH,IAAI,EAAE,GAAG,CAAM;IAEf,oEAAoE;IAEpE,aAAa,UAAS;IAEb,MAAM;IA4Cf,OAAO,CAAC,gBAAgB;IAYxB,OAAO,CAAC,WAAW;IA0BnB,OAAO,CAAC,UAAU;CAWnB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,qBAAqB,EAAE,cAAc,CAAC;KACvC;CACF"}

package/components/reusable/dropdown/dropdownOption.js

@@ -1,4 +1,4 @@
-import{_ as e}from"../../../vendor/tslib-53a81efe.js";import{o as t}from"../../../vendor/lit-html-29220869.js";import{n as o,t as i,e as l}from"../../../vendor/lit-461e78e6.js";import{i as s,s as r,x as d}from"../../../vendor/lit-element-c6c02f24.js";import"../checkbox/checkbox.js";import"../checkbox/checkboxGroup.js";import"../checkbox/checkboxSubgroup.js";import{h as n}from"../../../vendor/@kyndryl-design-system/shidoka-icons-43e7210b.js";import"../../../vendor/deepmerge-ts-e62363e6.js";import"../../../common/mixins/form-input.js";import"../textInput/textInput.js";import"../button/button.js";import"../../../common/helpers/helpers.js";import"../button/defs.js";var c=s`*,
+import{_ as e}from"../../../vendor/tslib-53a81efe.js";import{o as t}from"../../../vendor/lit-html-29220869.js";import{n as o,t as i,e as l}from"../../../vendor/lit-461e78e6.js";import{i as s,s as d,x as r}from"../../../vendor/lit-element-c6c02f24.js";import"../checkbox/checkbox.js";import"../checkbox/checkboxGroup.js";import"../checkbox/checkboxSubgroup.js";import{h as n}from"../../../vendor/@kyndryl-design-system/shidoka-icons-43e7210b.js";import"../../../vendor/deepmerge-ts-e62363e6.js";import"../../../common/mixins/form-input.js";import"../textInput/textInput.js";import"../button/button.js";import"../../../common/helpers/helpers.js";import"../button/defs.js";var a=s`*,
 *::before,
 *::after {
   box-sizing: border-box;
@@ -17,11 +17,13 @@ li {
   cursor: default;
   padding: 16px;
   transition: background-color 150ms ease-out;
+  display: flex;
+  gap: 8px;
+  align-items: center;
 }
 li[selected] {
   display: flex;
   align-items: center;
-  justify-content: space-between;
   background-color: var(--kd-color-background-accent-subtle);
 }
 li:hover, li[highlighted] {
@@ -45,6 +47,9 @@ li span {
   overflow: hidden;
   text-overflow: ellipsis;
 }
+li slot[name=icon]::slotted(span) {
+  display: flex;
+}
 
 kyn-checkbox {
   display: inline-block;
@@ -54,7 +59,8 @@ kyn-checkbox {
 
 .check-icon {
   display: flex;
-}`;let a=class extends r{constructor(){super(...arguments),this.value="",this.selected=!1,this.disabled=!1,this.highlighted=!1,this.multiple=!1,this.text="",this.indeterminate=!1}render(){return d`
+  margin-left: auto;
+}`;let c=class extends d{constructor(){super(...arguments),this.value="",this.selected=!1,this.disabled=!1,this.highlighted=!1,this.multiple=!1,this.text="",this.indeterminate=!1}render(){return r`
       <li
         role="option"
         ?highlighted=${this.highlighted}
@@ -67,8 +73,9 @@ kyn-checkbox {
         @click=${e=>this.handleClick(e)}
         @blur=${e=>this.handleBlur(e)}
       >
+        <slot name="icon"></slot>
         <span>
-          ${this.multiple?d`
+          ${this.multiple?r`
                 <kyn-checkbox
                   type="checkbox"
                   value=${this.value}
@@ -87,7 +94,7 @@ kyn-checkbox {
           <slot @slotchange=${e=>this.handleSlotChange(e)}></slot>
         </span>
 
-        ${this.selected&&!this.multiple?d`<span class="check-icon">${t(n)}</span>`:null}
+        ${this.selected&&!this.multiple?r`<span class="check-icon">${t(n)}</span>`:null}
       </li>
-    `}handleSlotChange(e){const t=e.target.assignedNodes({flatten:!0});let o="";for(let e=0;e<t.length;e++)o+=t[e].textContent.trim();this.text=o}handleClick(e){if(this.disabled)return;this.multiple?this.selected=!this.selected:this.selected=!0;const t=new CustomEvent("on-click",{bubbles:!0,composed:!0,detail:{selected:this.selected,value:this.value,origEvent:e}});this.dispatchEvent(t)}handleBlur(e){const t=new CustomEvent("on-blur",{bubbles:!0,composed:!0,detail:{origEvent:e}});this.dispatchEvent(t)}};a.styles=c,e([o({type:String})],a.prototype,"value",void 0),e([i()],a.prototype,"selected",void 0),e([o({type:Boolean})],a.prototype,"disabled",void 0),e([i()],a.prototype,"highlighted",void 0),e([o({type:Boolean})],a.prototype,"multiple",void 0),e([i()],a.prototype,"text",void 0),e([o({type:Boolean,reflect:!0})],a.prototype,"indeterminate",void 0),a=e([l("kyn-dropdown-option")],a);export{a as DropdownOption};
+    `}handleSlotChange(e){const t=e.target.assignedNodes({flatten:!0});let o="";for(let e=0;e<t.length;e++)o+=t[e].textContent.trim();this.text=o}handleClick(e){if(this.disabled)return;this.multiple?this.selected=!this.selected:this.selected=!0;const t=new CustomEvent("on-click",{bubbles:!0,composed:!0,detail:{selected:this.selected,value:this.value,origEvent:e}});this.dispatchEvent(t)}handleBlur(e){const t=new CustomEvent("on-blur",{bubbles:!0,composed:!0,detail:{origEvent:e}});this.dispatchEvent(t)}};c.styles=a,e([o({type:String})],c.prototype,"value",void 0),e([i()],c.prototype,"selected",void 0),e([o({type:Boolean})],c.prototype,"disabled",void 0),e([i()],c.prototype,"highlighted",void 0),e([o({type:Boolean})],c.prototype,"multiple",void 0),e([i()],c.prototype,"text",void 0),e([o({type:Boolean,reflect:!0})],c.prototype,"indeterminate",void 0),c=e([l("kyn-dropdown-option")],c);export{c as DropdownOption};
 //# sourceMappingURL=dropdownOption.js.map

package/components/reusable/dropdown/dropdownOption.js.map

@@ -1 +1 @@
-{"version":3,"file":"dropdownOption.js","sources":["../../../../src/components/reusable/dropdown/dropdownOption.ts"],"sourcesContent":["import { unsafeSVG } from 'lit-html/directives/unsafe-svg.js';\nimport { LitElement, html } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\n\nimport '../checkbox';\n\nimport checkIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/16/check.svg';\n\nimport DropdownOptionScss from './dropdownOption.scss';\n\n/**\n * Dropdown option.\n * @fires on-click - Emits the option details to the parent dropdown.\n * @slot unnamed - Slot for option text.\n */\n@customElement('kyn-dropdown-option')\nexport class DropdownOption extends LitElement {\n  static override styles = DropdownOptionScss;\n\n  /** Option value. */\n  @property({ type: String })\n  value = '';\n\n  /** Internal text strings.\n   * @internal\n   */\n  @state()\n  selected = false;\n\n  /** Option disabled state. */\n  @property({ type: Boolean })\n  disabled = false;\n\n  /**\n   * Option highlighted state for keyboard navigation, automatically derived.\n   * @ignore\n   */\n  @state()\n  highlighted = false;\n\n  /** Multi-select state, derived from parent.\n   * @ignore\n   */\n  @property({ type: Boolean })\n  multiple = false;\n\n  /**\n   * Option text, automatically derived.\n   * @ignore\n   */\n  @state()\n  text: any = '';\n\n  /** Determines whether the checkbox is in an indeterminate state. */\n  @property({ type: Boolean, reflect: true })\n  indeterminate = false;\n\n  override render() {\n    return html`\n      <li\n        role=\"option\"\n        ?highlighted=${this.highlighted}\n        ?selected=${this.selected}\n        aria-selected=${this.selected}\n        ?disabled=${this.disabled}\n        aria-disabled=${this.disabled}\n        ?multiple=${this.multiple}\n        title=${this.text}\n        @click=${(e: any) => this.handleClick(e)}\n        @blur=${(e: any) => this.handleBlur(e)}\n      >\n        <span>\n          ${this.multiple\n            ? html`\n                <kyn-checkbox\n                  type=\"checkbox\"\n                  value=${this.value}\n                  aria-hidden=\"true\"\n                  tabindex=\"-1\"\n                  @pointerdown=${(e: any) => e.preventDefault()}\n                  @pointerup=${(e: any) => e.preventDefault()}\n                  .checked=${this.selected}\n                  ?checked=${this.selected}\n                  ?disabled=${this.disabled}\n                  visiblyHidden\n                  .indeterminate=${this.indeterminate}\n                ></kyn-checkbox>\n              `\n            : null}\n\n          <slot @slotchange=${(e: any) => this.handleSlotChange(e)}></slot>\n        </span>\n\n        ${this.selected && !this.multiple\n          ? html`<span class=\"check-icon\">${unsafeSVG(checkIcon)}</span>`\n          : null}\n      </li>\n    `;\n  }\n\n  private handleSlotChange(e: any) {\n    // set text prop from slotted text, for ease of access\n    const nodes = e.target.assignedNodes({ flatten: true });\n    let text = '';\n\n    for (let i = 0; i < nodes.length; i++) {\n      text += nodes[i].textContent.trim();\n    }\n\n    this.text = text;\n  }\n\n  private handleClick(e: Event) {\n    // prevent click if disabled\n    if (this.disabled) {\n      return;\n    }\n\n    // update selected state\n    if (this.multiple) {\n      this.selected = !this.selected;\n    } else {\n      this.selected = true;\n    }\n\n    // emit selected value, bubble so it can be captured by the parent dropdown\n    const event = new CustomEvent('on-click', {\n      bubbles: true,\n      composed: true,\n      detail: {\n        selected: this.selected,\n        value: this.value,\n        origEvent: e,\n      },\n    });\n    this.dispatchEvent(event);\n  }\n\n  private handleBlur(e: any) {\n    // emit blur event, bubble so it can be captured by the parent dropdown\n    const event = new CustomEvent('on-blur', {\n      bubbles: true,\n      composed: true,\n      detail: {\n        origEvent: e,\n      },\n    });\n    this.dispatchEvent(event);\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'kyn-dropdown-option': DropdownOption;\n  }\n}\n"],"names":["DropdownOption","LitElement","constructor","this","value","selected","disabled","highlighted","multiple","text","indeterminate","render","html","e","handleClick","handleBlur","preventDefault","handleSlotChange","unsafeSVG","checkIcon","nodes","target","assignedNodes","flatten","i","length","textContent","trim","event","CustomEvent","bubbles","composed","detail","origEvent","dispatchEvent","styles","DropdownOptionScss","__decorate","property","type","String","prototype","state","Boolean","reflect","customElement"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgBO,IAAMA,EAAN,cAA6BC,EAA7B,WAAAC,uBAKLC,KAAKC,MAAG,GAMRD,KAAQE,UAAG,EAIXF,KAAQG,UAAG,EAOXH,KAAWI,aAAG,EAMdJ,KAAQK,UAAG,EAOXL,KAAIM,KAAQ,GAIZN,KAAaO,eAAG,CA8FjB,CA5FU,MAAAC,GACP,OAAOC,CAAI;;;uBAGQT,KAAKI;oBACRJ,KAAKE;wBACDF,KAAKE;oBACTF,KAAKG;wBACDH,KAAKG;oBACTH,KAAKK;gBACTL,KAAKM;iBACHI,GAAWV,KAAKW,YAAYD;gBAC7BA,GAAWV,KAAKY,WAAWF;;;YAGhCV,KAAKK,SACHI,CAAI;;;0BAGQT,KAAKC;;;iCAGGS,GAAWA,EAAEG;+BACfH,GAAWA,EAAEG;6BAChBb,KAAKE;6BACLF,KAAKE;8BACJF,KAAKG;;mCAEAH,KAAKO;;gBAG1B;;8BAEiBG,GAAWV,KAAKc,iBAAiBJ;;;UAGtDV,KAAKE,WAAaF,KAAKK,SACrBI,CAAI,4BAA4BM,EAAUC,YAC1C;;KAGT,CAEO,gBAAAF,CAAiBJ,GAEvB,MAAMO,EAAQP,EAAEQ,OAAOC,cAAc,CAAEC,SAAS,IAChD,IAAId,EAAO,GAEX,IAAK,IAAIe,EAAI,EAAGA,EAAIJ,EAAMK,OAAQD,IAChCf,GAAQW,EAAMI,GAAGE,YAAYC,OAG/BxB,KAAKM,KAAOA,CACb,CAEO,WAAAK,CAAYD,GAElB,GAAIV,KAAKG,SACP,OAIEH,KAAKK,SACPL,KAAKE,UAAYF,KAAKE,SAEtBF,KAAKE,UAAW,EAIlB,MAAMuB,EAAQ,IAAIC,YAAY,WAAY,CACxCC,SAAS,EACTC,UAAU,EACVC,OAAQ,CACN3B,SAAUF,KAAKE,SACfD,MAAOD,KAAKC,MACZ6B,UAAWpB,KAGfV,KAAK+B,cAAcN,EACpB,CAEO,UAAAb,CAAWF,GAEjB,MAAMe,EAAQ,IAAIC,YAAY,UAAW,CACvCC,SAAS,EACTC,UAAU,EACVC,OAAQ,CACNC,UAAWpB,KAGfV,KAAK+B,cAAcN,EACpB,GAnIe5B,EAAMmC,OAAGC,EAIzBC,EAAA,CADCC,EAAS,CAAEC,KAAMC,UACPxC,EAAAyC,UAAA,aAAA,GAMXJ,EAAA,CADCK,KACgB1C,EAAAyC,UAAA,gBAAA,GAIjBJ,EAAA,CADCC,EAAS,CAAEC,KAAMI,WACD3C,EAAAyC,UAAA,gBAAA,GAOjBJ,EAAA,CADCK,KACmB1C,EAAAyC,UAAA,mBAAA,GAMpBJ,EAAA,CADCC,EAAS,CAAEC,KAAMI,WACD3C,EAAAyC,UAAA,gBAAA,GAOjBJ,EAAA,CADCK,KACc1C,EAAAyC,UAAA,YAAA,GAIfJ,EAAA,CADCC,EAAS,CAAEC,KAAMI,QAASC,SAAS,KACd5C,EAAAyC,UAAA,qBAAA,GAvCXzC,EAAcqC,EAAA,CAD1BQ,EAAc,wBACF7C"}
+{"version":3,"file":"dropdownOption.js","sources":["../../../../src/components/reusable/dropdown/dropdownOption.ts"],"sourcesContent":["import { unsafeSVG } from 'lit-html/directives/unsafe-svg.js';\nimport { LitElement, html } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\n\nimport '../checkbox';\n\nimport checkIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/16/check.svg';\n\nimport DropdownOptionScss from './dropdownOption.scss';\n\n/**\n * Dropdown option.\n * @fires on-click - Emits the option details to the parent dropdown.\n * @slot unnamed - Slot for option text.\n * @slot icon - Slot for option icon. Icon size should be 16px only.\n */\n@customElement('kyn-dropdown-option')\nexport class DropdownOption extends LitElement {\n  static override styles = DropdownOptionScss;\n\n  /** Option value. */\n  @property({ type: String })\n  value = '';\n\n  /** Internal text strings.\n   * @internal\n   */\n  @state()\n  selected = false;\n\n  /** Option disabled state. */\n  @property({ type: Boolean })\n  disabled = false;\n\n  /**\n   * Option highlighted state for keyboard navigation, automatically derived.\n   * @ignore\n   */\n  @state()\n  highlighted = false;\n\n  /** Multi-select state, derived from parent.\n   * @ignore\n   */\n  @property({ type: Boolean })\n  multiple = false;\n\n  /**\n   * Option text, automatically derived.\n   * @ignore\n   */\n  @state()\n  text: any = '';\n\n  /** Determines whether the checkbox is in an indeterminate state. */\n  @property({ type: Boolean, reflect: true })\n  indeterminate = false;\n\n  override render() {\n    return html`\n      <li\n        role=\"option\"\n        ?highlighted=${this.highlighted}\n        ?selected=${this.selected}\n        aria-selected=${this.selected}\n        ?disabled=${this.disabled}\n        aria-disabled=${this.disabled}\n        ?multiple=${this.multiple}\n        title=${this.text}\n        @click=${(e: any) => this.handleClick(e)}\n        @blur=${(e: any) => this.handleBlur(e)}\n      >\n        <slot name=\"icon\"></slot>\n        <span>\n          ${this.multiple\n            ? html`\n                <kyn-checkbox\n                  type=\"checkbox\"\n                  value=${this.value}\n                  aria-hidden=\"true\"\n                  tabindex=\"-1\"\n                  @pointerdown=${(e: any) => e.preventDefault()}\n                  @pointerup=${(e: any) => e.preventDefault()}\n                  .checked=${this.selected}\n                  ?checked=${this.selected}\n                  ?disabled=${this.disabled}\n                  visiblyHidden\n                  .indeterminate=${this.indeterminate}\n                ></kyn-checkbox>\n              `\n            : null}\n\n          <slot @slotchange=${(e: any) => this.handleSlotChange(e)}></slot>\n        </span>\n\n        ${this.selected && !this.multiple\n          ? html`<span class=\"check-icon\">${unsafeSVG(checkIcon)}</span>`\n          : null}\n      </li>\n    `;\n  }\n\n  private handleSlotChange(e: any) {\n    // set text prop from slotted text, for ease of access\n    const nodes = e.target.assignedNodes({ flatten: true });\n    let text = '';\n\n    for (let i = 0; i < nodes.length; i++) {\n      text += nodes[i].textContent.trim();\n    }\n\n    this.text = text;\n  }\n\n  private handleClick(e: Event) {\n    // prevent click if disabled\n    if (this.disabled) {\n      return;\n    }\n\n    // update selected state\n    if (this.multiple) {\n      this.selected = !this.selected;\n    } else {\n      this.selected = true;\n    }\n\n    // emit selected value, bubble so it can be captured by the parent dropdown\n    const event = new CustomEvent('on-click', {\n      bubbles: true,\n      composed: true,\n      detail: {\n        selected: this.selected,\n        value: this.value,\n        origEvent: e,\n      },\n    });\n    this.dispatchEvent(event);\n  }\n\n  private handleBlur(e: any) {\n    // emit blur event, bubble so it can be captured by the parent dropdown\n    const event = new CustomEvent('on-blur', {\n      bubbles: true,\n      composed: true,\n      detail: {\n        origEvent: e,\n      },\n    });\n    this.dispatchEvent(event);\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'kyn-dropdown-option': DropdownOption;\n  }\n}\n"],"names":["DropdownOption","LitElement","constructor","this","value","selected","disabled","highlighted","multiple","text","indeterminate","render","html","e","handleClick","handleBlur","preventDefault","handleSlotChange","unsafeSVG","checkIcon","nodes","target","assignedNodes","flatten","i","length","textContent","trim","event","CustomEvent","bubbles","composed","detail","origEvent","dispatchEvent","styles","DropdownOptionScss","__decorate","property","type","String","prototype","state","Boolean","reflect","customElement"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiBO,IAAMA,EAAN,cAA6BC,EAA7B,WAAAC,uBAKLC,KAAKC,MAAG,GAMRD,KAAQE,UAAG,EAIXF,KAAQG,UAAG,EAOXH,KAAWI,aAAG,EAMdJ,KAAQK,UAAG,EAOXL,KAAIM,KAAQ,GAIZN,KAAaO,eAAG,CA+FjB,CA7FU,MAAAC,GACP,OAAOC,CAAI;;;uBAGQT,KAAKI;oBACRJ,KAAKE;wBACDF,KAAKE;oBACTF,KAAKG;wBACDH,KAAKG;oBACTH,KAAKK;gBACTL,KAAKM;iBACHI,GAAWV,KAAKW,YAAYD;gBAC7BA,GAAWV,KAAKY,WAAWF;;;;YAIhCV,KAAKK,SACHI,CAAI;;;0BAGQT,KAAKC;;;iCAGGS,GAAWA,EAAEG;+BACfH,GAAWA,EAAEG;6BAChBb,KAAKE;6BACLF,KAAKE;8BACJF,KAAKG;;mCAEAH,KAAKO;;gBAG1B;;8BAEiBG,GAAWV,KAAKc,iBAAiBJ;;;UAGtDV,KAAKE,WAAaF,KAAKK,SACrBI,CAAI,4BAA4BM,EAAUC,YAC1C;;KAGT,CAEO,gBAAAF,CAAiBJ,GAEvB,MAAMO,EAAQP,EAAEQ,OAAOC,cAAc,CAAEC,SAAS,IAChD,IAAId,EAAO,GAEX,IAAK,IAAIe,EAAI,EAAGA,EAAIJ,EAAMK,OAAQD,IAChCf,GAAQW,EAAMI,GAAGE,YAAYC,OAG/BxB,KAAKM,KAAOA,CACb,CAEO,WAAAK,CAAYD,GAElB,GAAIV,KAAKG,SACP,OAIEH,KAAKK,SACPL,KAAKE,UAAYF,KAAKE,SAEtBF,KAAKE,UAAW,EAIlB,MAAMuB,EAAQ,IAAIC,YAAY,WAAY,CACxCC,SAAS,EACTC,UAAU,EACVC,OAAQ,CACN3B,SAAUF,KAAKE,SACfD,MAAOD,KAAKC,MACZ6B,UAAWpB,KAGfV,KAAK+B,cAAcN,EACpB,CAEO,UAAAb,CAAWF,GAEjB,MAAMe,EAAQ,IAAIC,YAAY,UAAW,CACvCC,SAAS,EACTC,UAAU,EACVC,OAAQ,CACNC,UAAWpB,KAGfV,KAAK+B,cAAcN,EACpB,GApIe5B,EAAMmC,OAAGC,EAIzBC,EAAA,CADCC,EAAS,CAAEC,KAAMC,UACPxC,EAAAyC,UAAA,aAAA,GAMXJ,EAAA,CADCK,KACgB1C,EAAAyC,UAAA,gBAAA,GAIjBJ,EAAA,CADCC,EAAS,CAAEC,KAAMI,WACD3C,EAAAyC,UAAA,gBAAA,GAOjBJ,EAAA,CADCK,KACmB1C,EAAAyC,UAAA,mBAAA,GAMpBJ,EAAA,CADCC,EAAS,CAAEC,KAAMI,WACD3C,EAAAyC,UAAA,gBAAA,GAOjBJ,EAAA,CADCK,KACc1C,EAAAyC,UAAA,YAAA,GAIfJ,EAAA,CADCC,EAAS,CAAEC,KAAMI,QAASC,SAAS,KACd5C,EAAAyC,UAAA,qBAAA,GAvCXzC,EAAcqC,EAAA,CAD1BQ,EAAc,wBACF7C"}

package/components/reusable/sliderInput/index.d.ts

@@ -0,0 +1,2 @@
+export { SliderInput } from './sliderInput';
+//# sourceMappingURL=index.d.ts.map

package/components/reusable/sliderInput/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/reusable/sliderInput/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC"}

package/components/reusable/sliderInput/index.js

@@ -0,0 +1,2 @@
+export{SliderInput}from"./sliderInput.js";import"../../../vendor/tslib-53a81efe.js";import"../../../vendor/lit-html-29220869.js";import"../../../vendor/lit-461e78e6.js";import"../../../vendor/lit-element-c6c02f24.js";import"../../../common/mixins/form-input.js";import"../button/button.js";import"../../../common/helpers/helpers.js";import"../button/defs.js";import"../../../vendor/deepmerge-ts-e62363e6.js";import"../../../vendor/@kyndryl-design-system/shidoka-icons-43e7210b.js";
+//# sourceMappingURL=index.js.map

package/components/reusable/sliderInput/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/components/reusable/sliderInput/sliderInput.d.ts

@@ -0,0 +1,93 @@
+import { LitElement } from 'lit';
+import '../button';
+declare const SliderInput_base: (new (...args: any[]) => import("../../../common/mixins/form-input").FormMixinInterface) & typeof LitElement;
+/**
+ * Slider Input.
+ * @fires on-input - Captures the input event and emits the selected value and original event details.
+ * @prop {number} min - The minimum value.
+ * @prop {number} max - The maximum value.
+ * @prop {number} step - The step between values.
+ * @slot tooltip - Slot for tooltip.
+ *
+ */
+export declare class SliderInput extends SliderInput_base {
+    static styles: any;
+    /** Label text. */
+    label: string;
+    /** Input value. */
+    value: number;
+    /** Input disabled state. */
+    disabled: boolean;
+    /** Optional text beneath the input. */
+    caption: string;
+    /** Maximum value. */
+    max: number;
+    /** Minimum value. */
+    min: number;
+    /** The step between values */
+    step: number;
+    /** Visually hide the label. */
+    hideLabel: boolean;
+    /** Set this to `true` for enable Tick Marker on slider. */
+    enableTickMarker: boolean;
+    /** Set this to `true` for enable Scale Marker below slider */
+    enableScaleMarker: boolean;
+    /** Set this to `true` for editable Input. Note: Enabling this property will disable the tooltip. */
+    editableInput: boolean;
+    /** Customizable text strings. */
+    textStrings: {
+        error: string;
+    };
+    /** Custom Labels */
+    customLabels: string[];
+    /** Set this to `true` for enable Tooltip. */
+    enableTooltip: boolean;
+    /** Internal text strings.
+     * @internal
+     */
+    _textStrings: {
+        error: string;
+    };
+    /**Tooltip open state.
+     * @internal
+     */
+    tooltipVisible: boolean;
+    /**Tooltip position.
+     * @internal
+     */
+    tooltipPosition: string;
+    /**
+     * Queries the <input> DOM element.
+     * @ignore
+     */
+    _inputRangeEl: HTMLInputElement;
+    /**
+     * Queries the <input> DOM element.
+     * @ignore
+     */
+    _inputEl: HTMLInputElement;
+    render(): import("lit").TemplateResult<1>;
+    private _renderTickMarker;
+    private _renderCustomLabel;
+    private _renderScaleMarker;
+    private _renderTooltip;
+    private _renderEditableInput;
+    private _showTooltip;
+    private _hideTooltip;
+    private _handleInput;
+    private _handleNumberInput;
+    private _emitValue;
+    private _getTooltipPosition;
+    private _updateTooltipPosition;
+    private showTickMark;
+    private _validate;
+    updated(changedProps: any): void;
+    willUpdate(changedProps: any): void;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'kyn-slider-input': SliderInput;
+    }
+}
+export {};
+//# sourceMappingURL=sliderInput.d.ts.map

package/components/reusable/sliderInput/sliderInput.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sliderInput.d.ts","sourceRoot":"","sources":["../../../../src/components/reusable/sliderInput/sliderInput.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAOvC,OAAO,WAAW,CAAC;;AASnB;;;;;;;;GAQG;AACH,qBACa,WAAY,SAAQ,gBAAqB;IACpD,OAAgB,MAAM,MAAU;IAEhC,kBAAkB;IAElB,KAAK,SAAM;IAEX,mBAAmB;IAEV,KAAK,SAAK;IAEnB,4BAA4B;IAE5B,QAAQ,UAAS;IAEjB,uCAAuC;IAEvC,OAAO,SAAM;IAEb,qBAAqB;IAErB,GAAG,SAAO;IAEV,qBAAqB;IAErB,GAAG,SAAK;IAER,8BAA8B;IAE9B,IAAI,SAAK;IAET,+BAA+B;IAE/B,SAAS,UAAS;IAElB,2DAA2D;IAE3D,gBAAgB,UAAS;IAEzB,8DAA8D;IAE9D,iBAAiB,UAAS;IAE1B,oGAAoG;IAEpG,aAAa,UAAS;IAEtB,iCAAiC;IAEjC,WAAW;;MAAuB;IAElC,oBAAoB;IAEpB,YAAY,EAAE,MAAM,EAAE,CAAM;IAE5B,6CAA6C;IAE7C,aAAa,UAAS;IAEtB;;OAEG;IAEH,YAAY;;MAAuB;IAEnC;;OAEG;IAEH,cAAc,UAAS;IAEvB;;OAEG;IAEH,eAAe,SAAM;IAErB;;;OAGG;IAEH,aAAa,EAAG,gBAAgB,CAAC;IAEjC;;;OAGG;IAEH,QAAQ,EAAG,gBAAgB,CAAC;IAEnB,MAAM;IAqFf,OAAO,CAAC,iBAAiB;IAyBzB,OAAO,CAAC,kBAAkB;IAW1B,OAAO,CAAC,kBAAkB;IAmB1B,OAAO,CAAC,cAAc;IAmBtB,OAAO,CAAC,oBAAoB;IAuB5B,OAAO,CAAC,YAAY;IAKpB,OAAO,CAAC,YAAY;IAMpB,OAAO,CAAC,YAAY;IAsBpB,OAAO,CAAC,kBAAkB;IAW1B,OAAO,CAAC,UAAU;IAelB,OAAO,CAAC,mBAAmB;IAI3B,OAAO,CAAC,sBAAsB;IAc9B,OAAO,CAAC,YAAY;IA2CpB,OAAO,CAAC,SAAS;IA2BR,OAAO,CAAC,YAAY,EAAE,GAAG;IA2BzB,UAAU,CAAC,YAAY,EAAE,GAAG;CAKtC;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,kBAAkB,EAAE,WAAW,CAAC;KACjC;CACF"}