@kyndryl-design-system/shidoka-applications 1.24.13 → 1.24.14

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

@@ -28,6 +28,8 @@ export declare class Dropdown extends LitElement {
      * @ignore
      */
     internals: ElementInternals;
+    /** Update by value instead of deriving value from child selections. */
+    updateByValue: boolean;
     /** Dropdown size/height. "sm", "md", or "lg". */
     size: string;
     /** Dropdown inline style type. */
@@ -69,8 +71,7 @@ export declare class Dropdown extends LitElement {
      */
     selectAllIndeterminate: boolean;
     /**
-     * Selected option value.
-     * @ignore
+     * Dropdown value(s).
      */
     value: any;
     /**
@@ -163,6 +164,7 @@ export declare class Dropdown extends LitElement {
     private emitValue;
     private _emitSearch;
     updated(changedProps: any): void;
+    private _updateOptions;
     private _updateChildren;
 }
 declare global {

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":"AAAA,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAUvC,OAAO,kBAAkB,CAAC;AAC1B,OAAO,QAAQ,CAAC;AAChB,OAAO,2DAA2D,CAAC;AAMnE;;;;;;;GAOG;AACH,qBACa,QAAS,SAAQ,UAAU;IACtC,OAAgB,MAAM,+BAAgB;IAEtC,cAAc;IACd,OAAgB,iBAAiB;;;;MAG/B;IAEF;;;OAGG;IACH,MAAM,CAAC,cAAc,UAAQ;IAE7B;;;OAGG;IAEH,SAAS,mBAA0B;IAEnC,iDAAiD;IAEjD,IAAI,SAAQ;IAEZ,kCAAkC;IAElC,MAAM,UAAS;IAEf,uCAAuC;IAEvC,OAAO,SAAM;IAEb,4BAA4B;IAE5B,WAAW,SAAM;IAEjB,qBAAqB;IAErB,IAAI,SAAM;IAEV,iCAAiC;IAEjC,IAAI,UAAS;IAEb,qCAAqC;IAErC,UAAU,UAAS;IAEnB,0CAA0C;IAE1C,YAAY,UAAS;IAErB,0CAA0C;IAE1C,QAAQ,UAAS;IAEjB,mCAAmC;IAEnC,QAAQ,UAAS;IAEjB,+BAA+B;IAE/B,QAAQ,UAAS;IAEjB,6BAA6B;IAE7B,WAAW,SAAM;IAEjB,wCAAwC;IAExC,QAAQ,UAAS;IAEjB,wEAAwE;IAExE,SAAS,UAAS;IAElB,uCAAuC;IAEvC,aAAa,SAAgB;IAE7B,gCAAgC;IAEhC,YAAY,SAAa;IAEzB;;OAEG;IAEH,gBAAgB,UAAS;IAEzB;;OAEG;IAEH,sBAAsB,UAAS;IAE/B;;;OAGG;IAEH,KAAK,EAAE,GAAG,CAAM;IAEhB;;;OAGG;IAEH,IAAI,SAAM;IAEV;;;OAGG;IAEH,UAAU,SAAM;IAEhB;;;OAGG;IAEH,aAAa,SAA4B;IAEzC;;;OAGG;IAEH,OAAO,EAAG,KAAK,CAAC,GAAG,CAAC,CAAC;IAErB;;;OAGG;IAEH,eAAe,EAAG,KAAK,CAAC,GAAG,CAAC,CAAC;IAE7B;;;OAGG;IAEH,QAAQ,EAAG,gBAAgB,CAAC;IAE5B;;;OAGG;IAEH,QAAQ,EAAG,WAAW,CAAC;IAEvB;;;OAGG;IAEH,SAAS,EAAG,WAAW,CAAC;IAExB;;;OAGG;IAEH,qBAAqB,SAAM;IAE3B;;;OAGG;IAEH,SAAS,UAAS;IAElB;;;OAGG;IAEH,YAAY,UAAS;IAEZ,MAAM;IAsMN,YAAY;IAerB,OAAO,CAAC,gBAAgB;IAIxB;;;OAGG;IACI,cAAc;IAKrB,OAAO,CAAC,WAAW;IAWnB,OAAO,CAAC,iBAAiB;IAUzB,OAAO,CAAC,mBAAmB;IAI3B,OAAO,CAAC,iBAAiB;IAUzB,OAAO,CAAC,cAAc;IAatB,OAAO,CAAC,cAAc;IAoHtB,OAAO,CAAC,mBAAmB;IAsB3B,OAAO,CAAC,cAAc;IAOtB,OAAO,CAAC,WAAW;IAyBnB,OAAO,CAAC,iBAAiB;IAKzB,OAAO,CAAC,gBAAgB;IAUxB,OAAO,CAAC,gBAAgB;IAYxB,OAAO,CAAC,mBAAmB;IAoB3B,OAAO,CAAC,iBAAiB;IAmCzB,OAAO,CAAC,sBAAsB;IAW9B,OAAO,CAAC,YAAY;IA+BpB,OAAO,CAAC,WAAW;IAYnB,OAAO,CAAC,eAAe;IAUvB,OAAO,CAAC,cAAc;IAItB,OAAO,CAAC,eAAe;IAMd,iBAAiB;IAsBjB,oBAAoB;IAkB7B,OAAO,CAAC,WAAW;IA8BnB,OAAO,CAAC,SAAS;IA+BjB,OAAO,CAAC,SAAS;IASjB,OAAO,CAAC,WAAW;IASV,OAAO,CAAC,YAAY,EAAE,GAAG;IA8GlC,OAAO,CAAC,eAAe;CA4BxB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,cAAc,EAAE,QAAQ,CAAC;KAC1B;CACF"}
+{"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

@@ -1,4 +1,4 @@
-import{__decorate as e}from"../../../_virtual/_tslib.js";import'./../../../external/@lit/reactive-element/reactive-element.js';import{html as t}from'./../../../external/lit-html/lit-html.js';import{LitElement as i}from'./../../../external/lit-element/lit-element.js';import{customElement as s}from'./../../../external/@lit/reactive-element/decorators/custom-element.js';import{property as l}from'./../../../external/@lit/reactive-element/decorators/property.js';import{state as o}from'./../../../external/@lit/reactive-element/decorators/state.js';import{query as a}from'./../../../external/@lit/reactive-element/decorators/query.js';import{queryAssignedElements as n}from'./../../../external/@lit/reactive-element/decorators/query-assigned-elements.js';import{classMap as h}from'./../../../external/lit-html/directives/class-map.js';import d from"./dropdown.scss.js";import"./dropdownOption.js";import"../tag/tag.js";import"../tag/tagGroup.js";import"@kyndryl-design-system/shidoka-foundation/components/icon";import r from'./../../../external/@carbon/icons/es/chevron--down/24.js';import p from'./../../../external/@carbon/icons/es/warning--filled/24.js';import c from'./../../../external/@carbon/icons/es/close/24.js';import u from'./../../../external/@carbon/icons/es/close/16.js';let v=class extends i{constructor(){super(...arguments),this.internals=this.attachInternals(),this.size="md",this.inline=!1,this.caption="",this.placeholder="",this.name="",this.open=!1,this.searchable=!1,this.filterSearch=!1,this.multiple=!1,this.required=!1,this.disabled=!1,this.invalidText="",this.hideTags=!1,this.selectAll=!1,this.selectAllText="Select all",this.menuMinWidth="initial",this.selectAllChecked=!1,this.selectAllIndeterminate=!1,this.value="",this.text="",this.searchText="",this.assistiveText="Dropdown menu options.",this.internalValidationMsg="",this.isInvalid=!1,this._openUpwards=!1}render(){return t`
+import{__decorate as e}from"../../../_virtual/_tslib.js";import'./../../../external/@lit/reactive-element/reactive-element.js';import{html as t}from'./../../../external/lit-html/lit-html.js';import{LitElement as i}from'./../../../external/lit-element/lit-element.js';import{customElement as s}from'./../../../external/@lit/reactive-element/decorators/custom-element.js';import{property as l}from'./../../../external/@lit/reactive-element/decorators/property.js';import{state as o}from'./../../../external/@lit/reactive-element/decorators/state.js';import{query as a}from'./../../../external/@lit/reactive-element/decorators/query.js';import{queryAssignedElements as n}from'./../../../external/@lit/reactive-element/decorators/query-assigned-elements.js';import{classMap as h}from'./../../../external/lit-html/directives/class-map.js';import d from"./dropdown.scss.js";import"./dropdownOption.js";import"../tag/tag.js";import"../tag/tagGroup.js";import"@kyndryl-design-system/shidoka-foundation/components/icon";import r from'./../../../external/@carbon/icons/es/chevron--down/24.js';import p from'./../../../external/@carbon/icons/es/warning--filled/24.js';import c from'./../../../external/@carbon/icons/es/close/24.js';import u from'./../../../external/@carbon/icons/es/close/16.js';let v=class extends i{constructor(){super(...arguments),this.internals=this.attachInternals(),this.updateByValue=!1,this.size="md",this.inline=!1,this.caption="",this.placeholder="",this.name="",this.open=!1,this.searchable=!1,this.filterSearch=!1,this.multiple=!1,this.required=!1,this.disabled=!1,this.invalidText="",this.hideTags=!1,this.selectAll=!1,this.selectAllText="Select all",this.menuMinWidth="initial",this.selectAllChecked=!1,this.selectAllIndeterminate=!1,this.value="",this.text="",this.searchText="",this.assistiveText="Dropdown menu options.",this.internalValidationMsg="",this.isInvalid=!1,this._openUpwards=!1}render(){return t`
       <div
         class="dropdown"
         ?disabled=${this.disabled}
@@ -111,9 +111,9 @@ import{__decorate as e}from"../../../_virtual/_tslib.js";import'./../../../exter
 
         ${this.multiple&&!this.hideTags&&this.value.length?t`
               <kyn-tag-group filter>
-                ${this.value.map((e=>{var i;const s=this.options.find((t=>t.value===e));let l="";if(null===(i=null==s?void 0:s.shadowRoot)||void 0===i?void 0:i.querySelector("slot")){const e=s.shadowRoot.querySelector("slot").assignedNodes({flatten:!0});for(let t=0;t<e.length;t++)l+=e[t].textContent.trim()}return t`
+                ${this.value.map((e=>{const i=Array.from(this.querySelectorAll("kyn-dropdown-option")).find((t=>t.value===e)).textContent;return t`
                     <kyn-tag
-                      label=${l}
+                      label=${i}
                       ?disabled=${this.disabled}
                       @on-close=${e=>this.handleTagClear(e.detail.value)}
                     ></kyn-tag>
@@ -136,5 +136,5 @@ import{__decorate as e}from"../../../_virtual/_tslib.js";import'./../../../exter
           ${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.resetSelection()}resetSelection(){this._updateChildren(),this.emitValue()}handleClick(){this.disabled||(this.open=!this.open,this.searchable&&this.searchEl.focus())}_handleLabelClick(){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 s=[0,32],l=this.options.find((e=>e.highlighted)),o=this.options.find((e=>e.selected)),a=l?this.options.indexOf(l):this.options.find((e=>e.selected))?this.options.indexOf(o):0;if(s.includes(t)&&e.preventDefault(),"button"===i){(s.includes(t)||13===t||40==t||38==t)&&(this.open=!0,this.options[a].highlighted=!0,this.multiple||""===this.value||this.options[a].scrollIntoView({block:"nearest"}))}switch(t){case 13:return this.updateValue(this.options[a].value,!this.options[a].selected),void(this.assistiveText="Selected an item.");case 40:{let e=l||o?a===this.options.length-1?0:a+1:0;return this.options[e].disabled&&(e=e===this.options.length-1?0:e+1),this.options[a].highlighted=!1,this.options[e].highlighted=!0,this.options[e].scrollIntoView({block:"nearest"}),void(this.assistiveText=this.options[e].text)}case 38:{let e=0===a?this.options.length-1:a-1;return this.options[e].disabled&&(e=0===e?this.options.length-1:e-1),this.options[a].highlighted=!1,this.options[e].highlighted=!0,this.options[e].scrollIntoView({block:"nearest"}),void(this.assistiveText=this.options[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._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)}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)}handleSearchKeydown(e){e.stopPropagation();const t=this.options.find((e=>e.highlighted));13===e.keyCode&&t&&(this.updateValue(t.value,t.selected),this.assistiveText="Selected an item."),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"}))}}_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)}_handleFormdata(e){this.multiple?this.value.forEach((t=>{e.formData.append(this.name,t)})):e.formData.append(this.name,this.value)}_handleInvalid(){this._validate(!0,!1)}_handleClickOut(e){e.composedPath().includes(this)||(this.open=!1)}connectedCallback(){super.connectedCallback(),document.addEventListener("click",(e=>this._handleClickOut(e))),this.addEventListener("on-click",(e=>this._handleClick(e))),this.addEventListener("on-blur",(e=>this._handleBlur(e))),this.internals.form&&(this.internals.form.addEventListener("formdata",(e=>this._handleFormdata(e))),this.addEventListener("invalid",(()=>{this._handleInvalid()})))}disconnectedCallback(){document.removeEventListener("click",(e=>this._handleClickOut(e))),this.addEventListener("on-click",(e=>this._handleClick(e))),this.addEventListener("on-blur",(e=>this._handleBlur(e))),this.internals.form&&(this.internals.form.removeEventListener("formdata",(e=>this._handleFormdata(e))),this.removeEventListener("invalid",(()=>{this._handleInvalid()}))),super.disconnectedCallback()}updateValue(e,t=!1){const i=JSON.parse(JSON.stringify(this.value));if(this.multiple){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)},s=this.required&&!this.value.length?"Please fill out this field.":"",l=""!==this.invalidText?this.invalidText:s;this.internals.setValidity(i,l,this.buttonEl),e&&(this.internalValidationMsg=s),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)}updated(e){var t,i;if((e.has("invalidText")||e.has("internalValidationMsg"))&&(this.isInvalid=""!==this.invalidText||""!==this.internalValidationMsg),e.has("invalidText")&&void 0!==e.get("invalidText")&&this._validate(!1,!1),e.has("value")){this._validate(!1,!1);const e=(null===(t=this.shadowRoot)||void 0===t?void 0:t.querySelector("slot#children")).assignedElements().filter((e=>!e.disabled)),s=e.filter((e=>e.selected));if(this.selectAllChecked=s.length===e.length,this.selectAllIndeterminate=s.length<e.length&&s.length>0,!this.multiple){if(this.options.length&&""!==this.value){const e=this.options.find((e=>e.value===this.value));let t="";if(null===(i=null==e?void 0:e.shadowRoot)||void 0===i?void 0:i.querySelector("slot")){const i=e.shadowRoot.querySelector("slot").assignedNodes({flatten:!0});for(let e=0;e<i.length;e++)t+=i[e].textContent.trim()}this.text=t}this.searchable&&(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)){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}))}_updateChildren(){var e;const t=null===(e=this.shadowRoot)||void 0===e?void 0:e.querySelector("slot#children"),i=null==t?void 0:t.assignedElements();if(i){const e=[];let t="";i.forEach((i=>{i.multiple=this.multiple,i.selected&&(this.multiple?e.push(i.value):t=i.value)})),this.multiple?this.value=e:this.value=t}}};v.styles=d,v.shadowRootOptions={...i.shadowRootOptions,delegatesFocus:!0},v.formAssociated=!0,e([o()],v.prototype,"internals",void 0),e([l({type:String})],v.prototype,"size",void 0),e([l({type:Boolean})],v.prototype,"inline",void 0),e([l({type:String})],v.prototype,"caption",void 0),e([l({type:String})],v.prototype,"placeholder",void 0),e([l({type:String})],v.prototype,"name",void 0),e([l({type:Boolean})],v.prototype,"open",void 0),e([l({type:Boolean})],v.prototype,"searchable",void 0),e([l({type:Boolean})],v.prototype,"filterSearch",void 0),e([l({type:Boolean})],v.prototype,"multiple",void 0),e([l({type:Boolean})],v.prototype,"required",void 0),e([l({type:Boolean})],v.prototype,"disabled",void 0),e([l({type:String})],v.prototype,"invalidText",void 0),e([l({type:Boolean})],v.prototype,"hideTags",void 0),e([l({type:Boolean})],v.prototype,"selectAll",void 0),e([l({type:String})],v.prototype,"selectAllText",void 0),e([l({type:String})],v.prototype,"menuMinWidth",void 0),e([l({type:Boolean})],v.prototype,"selectAllChecked",void 0),e([l({type:Boolean})],v.prototype,"selectAllIndeterminate",void 0),e([o()],v.prototype,"value",void 0),e([o()],v.prototype,"text",void 0),e([o()],v.prototype,"searchText",void 0),e([o()],v.prototype,"assistiveText",void 0),e([n({selector:"kyn-dropdown-option"})],v.prototype,"options",void 0),e([n({selector:"kyn-dropdown-option[selected]"})],v.prototype,"selectedOptions",void 0),e([a(".search")],v.prototype,"searchEl",void 0),e([a(".select")],v.prototype,"buttonEl",void 0),e([a(".options")],v.prototype,"listboxEl",void 0),e([o()],v.prototype,"internalValidationMsg",void 0),e([o()],v.prototype,"isInvalid",void 0),e([o()],v.prototype,"_openUpwards",void 0),v=e([s("kyn-dropdown")],v);export{v as Dropdown};
+    `}firstUpdated(){""===this.placeholder&&(this.searchable?this.placeholder="Search":this.multiple?this.placeholder="Select items":this.placeholder="Select an option")}handleSlotChange(){this.resetSelection()}resetSelection(){this.updateByValue?this._updateOptions():(this._updateChildren(),this.emitValue())}handleClick(){this.disabled||(this.open=!this.open,this.searchable&&this.searchEl.focus())}_handleLabelClick(){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 s=[0,32],l=this.options.find((e=>e.highlighted)),o=this.options.find((e=>e.selected)),a=l?this.options.indexOf(l):this.options.find((e=>e.selected))?this.options.indexOf(o):0;if(s.includes(t)&&e.preventDefault(),"button"===i){(s.includes(t)||13===t||40==t||38==t)&&(this.open=!0,this.options[a].highlighted=!0,this.multiple||""===this.value||this.options[a].scrollIntoView({block:"nearest"}))}switch(t){case 13:return this.updateValue(this.options[a].value,!this.options[a].selected),void(this.assistiveText="Selected an item.");case 40:{let e=l||o?a===this.options.length-1?0:a+1:0;return this.options[e].disabled&&(e=e===this.options.length-1?0:e+1),this.options[a].highlighted=!1,this.options[e].highlighted=!0,this.options[e].scrollIntoView({block:"nearest"}),void(this.assistiveText=this.options[e].text)}case 38:{let e=0===a?this.options.length-1:a-1;return this.options[e].disabled&&(e=0===e?this.options.length-1:e-1),this.options[a].highlighted=!1,this.options[e].highlighted=!0,this.options[e].scrollIntoView({block:"nearest"}),void(this.assistiveText=this.options[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._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)}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)}handleSearchKeydown(e){e.stopPropagation();const t=this.options.find((e=>e.highlighted));13===e.keyCode&&t&&(this.updateValue(t.value,t.selected),this.assistiveText="Selected an item."),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"}))}}_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)}_handleFormdata(e){this.multiple?this.value.forEach((t=>{e.formData.append(this.name,t)})):e.formData.append(this.name,this.value)}_handleInvalid(){this._validate(!0,!1)}_handleClickOut(e){e.composedPath().includes(this)||(this.open=!1)}connectedCallback(){super.connectedCallback(),document.addEventListener("click",(e=>this._handleClickOut(e))),this.addEventListener("on-click",(e=>this._handleClick(e))),this.addEventListener("on-blur",(e=>this._handleBlur(e))),this.internals.form&&(this.internals.form.addEventListener("formdata",(e=>this._handleFormdata(e))),this.addEventListener("invalid",(()=>{this._handleInvalid()})))}disconnectedCallback(){document.removeEventListener("click",(e=>this._handleClickOut(e))),this.addEventListener("on-click",(e=>this._handleClick(e))),this.addEventListener("on-blur",(e=>this._handleBlur(e))),this.internals.form&&(this.internals.form.removeEventListener("formdata",(e=>this._handleFormdata(e))),this.removeEventListener("invalid",(()=>{this._handleInvalid()}))),super.disconnectedCallback()}updateValue(e,t=!1){const i=JSON.parse(JSON.stringify(this.value));if(this.multiple){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)},s=this.required&&!this.value.length?"Please fill out this field.":"",l=""!==this.invalidText?this.invalidText:s;this.internals.setValidity(i,l,this.buttonEl),e&&(this.internalValidationMsg=s),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)}updated(e){var t;if((e.has("invalidText")||e.has("internalValidationMsg"))&&(this.isInvalid=""!==this.invalidText||""!==this.internalValidationMsg),e.has("invalidText")&&void 0!==e.get("invalidText")&&this._validate(!1,!1),e.has("value")){this._validate(!1,!1);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.updateByValue&&this._updateOptions();const s=Array.from(this.querySelectorAll("kyn-dropdown-option"));if(!this.multiple){if(s.length&&""!==this.value){const e=s.find((e=>e.value===this.value));this.text=e.textContent}this.searchable&&(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)){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}))}_updateOptions(){this.options.forEach((e=>{this.multiple?(e.selected,this.value):e.selected=this.value.includes(e.value)}))}_updateChildren(){var e;const t=null===(e=this.shadowRoot)||void 0===e?void 0:e.querySelector("slot#children"),i=null==t?void 0:t.assignedElements();if(i){const e=[];let t="";i.forEach((i=>{i.multiple=this.multiple,i.selected&&(this.multiple?e.push(i.value):t=i.value)})),this.multiple?this.value=e:this.value=t}}};v.styles=d,v.shadowRootOptions={...i.shadowRootOptions,delegatesFocus:!0},v.formAssociated=!0,e([o()],v.prototype,"internals",void 0),e([l({type:Boolean})],v.prototype,"updateByValue",void 0),e([l({type:String})],v.prototype,"size",void 0),e([l({type:Boolean})],v.prototype,"inline",void 0),e([l({type:String})],v.prototype,"caption",void 0),e([l({type:String})],v.prototype,"placeholder",void 0),e([l({type:String})],v.prototype,"name",void 0),e([l({type:Boolean})],v.prototype,"open",void 0),e([l({type:Boolean})],v.prototype,"searchable",void 0),e([l({type:Boolean})],v.prototype,"filterSearch",void 0),e([l({type:Boolean})],v.prototype,"multiple",void 0),e([l({type:Boolean})],v.prototype,"required",void 0),e([l({type:Boolean})],v.prototype,"disabled",void 0),e([l({type:String})],v.prototype,"invalidText",void 0),e([l({type:Boolean})],v.prototype,"hideTags",void 0),e([l({type:Boolean})],v.prototype,"selectAll",void 0),e([l({type:String})],v.prototype,"selectAllText",void 0),e([l({type:String})],v.prototype,"menuMinWidth",void 0),e([l({type:Boolean})],v.prototype,"selectAllChecked",void 0),e([l({type:Boolean})],v.prototype,"selectAllIndeterminate",void 0),e([l({type:String})],v.prototype,"value",void 0),e([o()],v.prototype,"text",void 0),e([o()],v.prototype,"searchText",void 0),e([o()],v.prototype,"assistiveText",void 0),e([n({selector:"kyn-dropdown-option"})],v.prototype,"options",void 0),e([n({selector:"kyn-dropdown-option[selected]"})],v.prototype,"selectedOptions",void 0),e([a(".search")],v.prototype,"searchEl",void 0),e([a(".select")],v.prototype,"buttonEl",void 0),e([a(".options")],v.prototype,"listboxEl",void 0),e([o()],v.prototype,"internalValidationMsg",void 0),e([o()],v.prototype,"isInvalid",void 0),e([o()],v.prototype,"_openUpwards",void 0),v=e([s("kyn-dropdown")],v);export{v 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 { 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 './dropdownOption';\nimport '../tag';\nimport '@kyndryl-design-system/shidoka-foundation/components/icon';\nimport downIcon from '@carbon/icons/es/chevron--down/24';\nimport errorIcon from '@carbon/icons/es/warning--filled/24';\nimport clearIcon from '@carbon/icons/es/close/24';\nimport clearIcon16 from '@carbon/icons/es/close/16';\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 label - Slot for input label.\n */\n@customElement('kyn-dropdown')\nexport class Dropdown extends LitElement {\n  static override styles = DropdownScss;\n\n  /** @ignore */\n  static override shadowRootOptions = {\n    ...LitElement.shadowRootOptions,\n    delegatesFocus: true,\n  };\n\n  /**\n   * Associate the component with forms.\n   * @ignore\n   */\n  static formAssociated = true;\n\n  /**\n   * Attached internals for form association.\n   * @ignore\n   */\n  @state()\n  internals = this.attachInternals();\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  /** Dropdown name. */\n  @property({ type: String })\n  name = '';\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  /** Dropdown disabled state. */\n  @property({ type: Boolean })\n  disabled = false;\n\n  /** Dropdown invalid text. */\n  @property({ type: String })\n  invalidText = '';\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  /**\n   * Selected option value.\n   * @ignore\n   */\n  @state()\n  value: any = '';\n\n  /**\n   * Selected option text, automatically derived.\n   * @ignore\n   */\n  @state()\n  text = '';\n\n  /**\n   * Search input value.\n   * @ignore\n   */\n  @state()\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   * Internal validation message.\n   * @ignore\n   */\n  @state()\n  internalValidationMsg = '';\n\n  /**\n   * isInvalid when internalValidationMsg or invalidText is non-empty.\n   * @ignore\n   */\n  @state()\n  isInvalid = false;\n\n  /**\n   * Open drawer upwards.\n   * @ignore\n   */\n  @state()\n  _openUpwards = false;\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          for=${this.name}\n          id=\"label-${this.name}\"\n          class=\"label-text\"\n          @click=${this._handleLabelClick}\n        >\n          ${this.required ? html`<span class=\"required\">*</span>` : null}\n          <slot name=\"label\"></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                'size--sm': this.size === 'sm',\n                'size--lg': this.size === 'lg',\n                inline: this.inline,\n              })}\"\n              aria-labelledby=\"label-${this.name}\"\n              name=${this.name}\n              ?required=${this.required}\n              ?disabled=${this.disabled}\n              ?invalid=${this.isInvalid}\n              tabindex=\"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=\"Clear selections\"\n                      ?disabled=${this.disabled}\n                      @click=${(e: Event) => this.handleClearMultiple(e)}\n                    >\n                      ${this.value.length}\n                      <kd-icon .icon=${clearIcon16}></kd-icon>\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                      @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>\n                      ${this.multiple\n                        ? this.placeholder\n                        : this.value === ''\n                        ? this.placeholder\n                        : this.text}\n                    </span>\n                  `}\n\n              <kd-icon class=\"arrow-icon\" .icon=${downIcon}></kd-icon>\n            </div>\n\n            <ul\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\n          ${this.searchable && this.searchEl && this.searchText !== ''\n            ? html`\n                <button\n                  class=\"clear\"\n                  aria-label=\"Clear search text\"\n                  @click=${(e: any) => this.handleClear(e)}\n                >\n                  <kd-icon .icon=${clearIcon}></kd-icon>\n                </button>\n              `\n            : null}\n          ${this.isInvalid\n            ? html` <kd-icon class=\"error-icon\" .icon=${errorIcon}></kd-icon> `\n            : null}\n        </div>\n\n        ${this.multiple && !this.hideTags && this.value.length\n          ? html`\n              <kyn-tag-group filter>\n                ${this.value.map((value: string) => {\n                  const option = this.options.find(\n                    (option) => option.value === value\n                  );\n                  let text = '';\n\n                  if (option?.shadowRoot?.querySelector('slot')) {\n                    const nodes = option.shadowRoot\n                      .querySelector('slot')\n                      .assignedNodes({\n                        flatten: true,\n                      });\n\n                    for (let i = 0; i < nodes.length; i++) {\n                      text += nodes[i].textContent.trim();\n                    }\n                  }\n\n                  return html`\n                    <kyn-tag\n                      label=${text}\n                      ?disabled=${this.disabled}\n                      @on-close=${(e: any) =>\n                        this.handleTagClear(e.detail.value)}\n                    ></kyn-tag>\n                  `;\n                })}\n              </kyn-tag-group>\n            `\n          : null}\n        ${this.caption !== ''\n          ? html` <div class=\"caption\">${this.caption}</div> `\n          : null}\n        ${this.isInvalid\n          ? html`\n              <div class=\"error\">\n                ${this.invalidText || this.internalValidationMsg}\n              </div>\n            `\n          : null}\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.resetSelection();\n  }\n\n  /**\n   * Retrieves the selected values from the list of child options and sets value property.\n   * @function\n   */\n  public resetSelection() {\n    this._updateChildren();\n    this.emitValue();\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      }\n    }\n  }\n\n  private _handleLabelClick() {\n    this.open = !this.open;\n\n    if (this.searchable) {\n      this.searchEl.focus();\n    } else {\n      this.buttonEl.focus();\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 highlightedEl = this.options.find(\n      (option: any) => option.highlighted\n    );\n    const selectedEl = this.options.find((option: any) => option.selected);\n    const highlightedIndex = highlightedEl\n      ? this.options.indexOf(highlightedEl)\n      : this.options.find((option: any) => option.selected)\n      ? this.options.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    // open the listbox\n    if (target === 'button') {\n      const 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 (openDropdown) {\n        this.open = true;\n        this.options[highlightedIndex].highlighted = true;\n\n        // scroll to highlighted option\n        if (!this.multiple && this.value !== '') {\n          this.options[highlightedIndex].scrollIntoView({ block: 'nearest' });\n        }\n      }\n    }\n\n    switch (keyCode) {\n      case ENTER_KEY_CODE: {\n        // select highlighted option\n        this.updateValue(\n          this.options[highlightedIndex].value,\n          !this.options[highlightedIndex].selected\n        );\n        this.assistiveText = 'Selected an item.';\n        return;\n      }\n      case DOWN_ARROW_KEY_CODE: {\n        // go to next option\n        let nextIndex =\n          !highlightedEl && !selectedEl\n            ? 0\n            : highlightedIndex === this.options.length - 1\n            ? 0\n            : highlightedIndex + 1;\n\n        // skip disabled options\n        if (this.options[nextIndex].disabled) {\n          nextIndex = nextIndex === this.options.length - 1 ? 0 : nextIndex + 1;\n        }\n\n        this.options[highlightedIndex].highlighted = false;\n        this.options[nextIndex].highlighted = true;\n\n        // scroll to option\n        this.options[nextIndex].scrollIntoView({ block: 'nearest' });\n\n        this.assistiveText = this.options[nextIndex].text;\n        return;\n      }\n      case UP_ARROW_KEY_CODE: {\n        // go to previous option\n        let nextIndex =\n          highlightedIndex === 0\n            ? this.options.length - 1\n            : highlightedIndex - 1;\n\n        // skip disabled options\n        if (this.options[nextIndex].disabled) {\n          nextIndex = nextIndex === 0 ? this.options.length - 1 : nextIndex - 1;\n        }\n\n        this.options[highlightedIndex].highlighted = false;\n        this.options[nextIndex].highlighted = true;\n\n        // scroll to option\n        this.options[nextIndex].scrollIntoView({ block: 'nearest' });\n\n        this.assistiveText = this.options[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._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  }\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  }\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\n    // select option\n    if (e.keyCode === ENTER_KEY_CODE && option) {\n      this.updateValue(option.value, option.selected);\n      this.assistiveText = 'Selected an item.';\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      }\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 _handleFormdata(e: any) {\n    if (this.multiple) {\n      this.value.forEach((value: string) => {\n        e.formData.append(this.name, value);\n      });\n    } else {\n      e.formData.append(this.name, this.value);\n    }\n  }\n\n  private _handleInvalid() {\n    this._validate(true, false);\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    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    if (this.internals.form) {\n      this.internals.form.addEventListener('formdata', (e) =>\n        this._handleFormdata(e)\n      );\n\n      this.addEventListener('invalid', () => {\n        this._handleInvalid();\n      });\n    }\n  }\n\n  override disconnectedCallback() {\n    document.removeEventListener('click', (e) => this._handleClickOut(e));\n    this.addEventListener('on-click', (e: any) => this._handleClick(e));\n    this.addEventListener('on-blur', (e: any) => this._handleBlur(e));\n\n    if (this.internals.form) {\n      this.internals.form.removeEventListener('formdata', (e) =>\n        this._handleFormdata(e)\n      );\n\n      this.removeEventListener('invalid', () => {\n        this._handleInvalid();\n      });\n    }\n\n    super.disconnectedCallback();\n  }\n\n  private updateValue(value: string, selected = false) {\n    const values = JSON.parse(JSON.stringify(this.value));\n\n    // set value\n    if (this.multiple) {\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 updated(changedProps: any) {\n    if (\n      changedProps.has('invalidText') ||\n      changedProps.has('internalValidationMsg')\n    ) {\n      //check if any (internal / external )error msg. present then isInvalid is true\n      this.isInvalid =\n        this.invalidText !== '' || this.internalValidationMsg !== ''\n          ? true\n          : false;\n    }\n\n    if (\n      changedProps.has('invalidText') &&\n      changedProps.get('invalidText') !== undefined\n    ) {\n      this._validate(false, false);\n    }\n\n    if (changedProps.has('value')) {\n      this._validate(false, false);\n\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      // set form data value\n      // if (this.multiple) {\n      //   const entries = new FormData();\n      //   this.value.forEach((value: string) => {\n      //     entries.append(this.name, value);\n      //   });\n      //   this.internals.setFormValue(entries);\n      // } else {\n      //   this.internals.setFormValue(this.value);\n      // }\n\n      // update selected option text\n      if (!this.multiple) {\n        if (this.options.length && this.value !== '') {\n          const option = this.options.find(\n            (option) => option.value === this.value\n          );\n          let text = '';\n\n          if (option?.shadowRoot?.querySelector('slot')) {\n            const nodes = option.shadowRoot\n              .querySelector('slot')\n              .assignedNodes({\n                flatten: true,\n              });\n\n            for (let i = 0; i < nodes.length; i++) {\n              text += nodes[i].textContent.trim();\n            }\n          }\n\n          this.text = text;\n        }\n\n        // set search input value\n        if (this.searchable) {\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        // 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\n  private _updateChildren() {\n    const Slot: any = this.shadowRoot?.querySelector('slot#children');\n    const Options = Slot?.assignedElements();\n\n    // get value from selected options\n    if (Options) {\n      const values: any = [];\n      let value = '';\n      Options.forEach((option: any) => {\n        option.multiple = this.multiple;\n\n        if (option.selected) {\n          if (this.multiple) {\n            values.push(option.value);\n          } else {\n            value = option.value;\n          }\n        }\n      });\n\n      // set initial values\n      if (this.multiple) {\n        this.value = values;\n      } else {\n        this.value = value;\n      }\n    }\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'kyn-dropdown': Dropdown;\n  }\n}\n"],"names":["Dropdown","LitElement","constructor","this","internals","attachInternals","size","inline","caption","placeholder","name","open","searchable","filterSearch","multiple","required","disabled","invalidText","hideTags","selectAll","selectAllText","menuMinWidth","selectAllChecked","selectAllIndeterminate","value","text","searchText","assistiveText","internalValidationMsg","isInvalid","_openUpwards","render","html","_handleLabelClick","classMap","wrapper","select","handleClick","e","handleButtonKeydown","preventDefault","handleButtonBlur","length","handleClearMultiple","clearIcon16","handleSearchKeydown","handleSearchInput","handleSearchBlur","handleSearchClick","downIcon","options","upwards","handleListKeydown","handleListBlur","handleSlotChange","searchEl","handleClear","clearIcon","errorIcon","map","option","find","_a","shadowRoot","querySelector","nodes","assignedNodes","flatten","i","textContent","trim","handleTagClear","detail","firstUpdated","resetSelection","_updateChildren","emitValue","focus","buttonEl","handleKeyboard","keyCode","forEach","highlighted","relatedTarget","localName","target","SPACEBAR_KEY_CODE","highlightedEl","selectedEl","selected","highlightedIndex","indexOf","includes","scrollIntoView","block","updateValue","nextIndex","stopPropagation","_validate","_updateSelectedOptions","event","CustomEvent","dispatchEvent","_emitSearch","style","display","classList","contains","_b","toLowerCase","filter","startsWith","_handleClick","_handleBlur","origEvent","_handleFormdata","formData","append","_handleInvalid","_handleClickOut","composedPath","connectedCallback","super","document","addEventListener","form","disconnectedCallback","removeEventListener","values","JSON","parse","stringify","push","index","splice","interacted","report","Validity","customError","valueMissing","InternalMsg","ValidationMessage","setValidity","reportValidity","updated","changedProps","has","undefined","get","Options","assignedElements","SelectedOptions","listboxEl","preventScroll","Threshold","getBoundingClientRect","top","window","innerHeight","Slot","styles","DropdownScss","shadowRootOptions","delegatesFocus","formAssociated","__decorate","state","prototype","property","type","String","Boolean","queryAssignedElements","selector","query","customElement"],"mappings":"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"}
+{"version":3,"file":"dropdown.js","sources":["../../../../src/components/reusable/dropdown/dropdown.ts"],"sourcesContent":["import { 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 './dropdownOption';\nimport '../tag';\nimport '@kyndryl-design-system/shidoka-foundation/components/icon';\nimport downIcon from '@carbon/icons/es/chevron--down/24';\nimport errorIcon from '@carbon/icons/es/warning--filled/24';\nimport clearIcon from '@carbon/icons/es/close/24';\nimport clearIcon16 from '@carbon/icons/es/close/16';\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 label - Slot for input label.\n */\n@customElement('kyn-dropdown')\nexport class Dropdown extends LitElement {\n  static override styles = DropdownScss;\n\n  /** @ignore */\n  static override shadowRootOptions = {\n    ...LitElement.shadowRootOptions,\n    delegatesFocus: true,\n  };\n\n  /**\n   * Associate the component with forms.\n   * @ignore\n   */\n  static formAssociated = true;\n\n  /**\n   * Attached internals for form association.\n   * @ignore\n   */\n  @state()\n  internals = this.attachInternals();\n\n  /** Update by value instead of deriving value from child selections. */\n  @property({ type: Boolean })\n  updateByValue = false;\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  /** Dropdown name. */\n  @property({ type: String })\n  name = '';\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  /** Dropdown disabled state. */\n  @property({ type: Boolean })\n  disabled = false;\n\n  /** Dropdown invalid text. */\n  @property({ type: String })\n  invalidText = '';\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  /**\n   * Dropdown value(s).\n   */\n  @property({ type: String })\n  value: any = '';\n\n  /**\n   * Selected option text, automatically derived.\n   * @ignore\n   */\n  @state()\n  text = '';\n\n  /**\n   * Search input value.\n   * @ignore\n   */\n  @state()\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   * Internal validation message.\n   * @ignore\n   */\n  @state()\n  internalValidationMsg = '';\n\n  /**\n   * isInvalid when internalValidationMsg or invalidText is non-empty.\n   * @ignore\n   */\n  @state()\n  isInvalid = false;\n\n  /**\n   * Open drawer upwards.\n   * @ignore\n   */\n  @state()\n  _openUpwards = false;\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          for=${this.name}\n          id=\"label-${this.name}\"\n          class=\"label-text\"\n          @click=${this._handleLabelClick}\n        >\n          ${this.required ? html`<span class=\"required\">*</span>` : null}\n          <slot name=\"label\"></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                'size--sm': this.size === 'sm',\n                'size--lg': this.size === 'lg',\n                inline: this.inline,\n              })}\"\n              aria-labelledby=\"label-${this.name}\"\n              name=${this.name}\n              ?required=${this.required}\n              ?disabled=${this.disabled}\n              ?invalid=${this.isInvalid}\n              tabindex=\"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=\"Clear selections\"\n                      ?disabled=${this.disabled}\n                      @click=${(e: Event) => this.handleClearMultiple(e)}\n                    >\n                      ${this.value.length}\n                      <kd-icon .icon=${clearIcon16}></kd-icon>\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                      @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>\n                      ${this.multiple\n                        ? this.placeholder\n                        : this.value === ''\n                        ? this.placeholder\n                        : this.text}\n                    </span>\n                  `}\n\n              <kd-icon class=\"arrow-icon\" .icon=${downIcon}></kd-icon>\n            </div>\n\n            <ul\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\n          ${this.searchable && this.searchEl && this.searchText !== ''\n            ? html`\n                <button\n                  class=\"clear\"\n                  aria-label=\"Clear search text\"\n                  @click=${(e: any) => this.handleClear(e)}\n                >\n                  <kd-icon .icon=${clearIcon}></kd-icon>\n                </button>\n              `\n            : null}\n          ${this.isInvalid\n            ? html` <kd-icon class=\"error-icon\" .icon=${errorIcon}></kd-icon> `\n            : null}\n        </div>\n\n        ${this.multiple && !this.hideTags && this.value.length\n          ? html`\n              <kyn-tag-group filter>\n                ${this.value.map((value: string) => {\n                  const Options: any = Array.from(\n                    this.querySelectorAll('kyn-dropdown-option')\n                  );\n\n                  const option = Options.find(\n                    (option: any) => option.value === value\n                  );\n                  const text = option.textContent;\n\n                  return html`\n                    <kyn-tag\n                      label=${text}\n                      ?disabled=${this.disabled}\n                      @on-close=${(e: any) =>\n                        this.handleTagClear(e.detail.value)}\n                    ></kyn-tag>\n                  `;\n                })}\n              </kyn-tag-group>\n            `\n          : null}\n        ${this.caption !== ''\n          ? html` <div class=\"caption\">${this.caption}</div> `\n          : null}\n        ${this.isInvalid\n          ? html`\n              <div class=\"error\">\n                ${this.invalidText || this.internalValidationMsg}\n              </div>\n            `\n          : null}\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.resetSelection();\n  }\n\n  /**\n   * Retrieves the selected values from the list of child options and sets value property.\n   * @function\n   */\n  public resetSelection() {\n    if (this.updateByValue) {\n      this._updateOptions();\n    } else {\n      this._updateChildren();\n      this.emitValue();\n    }\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      }\n    }\n  }\n\n  private _handleLabelClick() {\n    this.open = !this.open;\n\n    if (this.searchable) {\n      this.searchEl.focus();\n    } else {\n      this.buttonEl.focus();\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 highlightedEl = this.options.find(\n      (option: any) => option.highlighted\n    );\n    const selectedEl = this.options.find((option: any) => option.selected);\n    const highlightedIndex = highlightedEl\n      ? this.options.indexOf(highlightedEl)\n      : this.options.find((option: any) => option.selected)\n      ? this.options.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    // open the listbox\n    if (target === 'button') {\n      const 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 (openDropdown) {\n        this.open = true;\n        this.options[highlightedIndex].highlighted = true;\n\n        // scroll to highlighted option\n        if (!this.multiple && this.value !== '') {\n          this.options[highlightedIndex].scrollIntoView({ block: 'nearest' });\n        }\n      }\n    }\n\n    switch (keyCode) {\n      case ENTER_KEY_CODE: {\n        // select highlighted option\n        this.updateValue(\n          this.options[highlightedIndex].value,\n          !this.options[highlightedIndex].selected\n        );\n        this.assistiveText = 'Selected an item.';\n        return;\n      }\n      case DOWN_ARROW_KEY_CODE: {\n        // go to next option\n        let nextIndex =\n          !highlightedEl && !selectedEl\n            ? 0\n            : highlightedIndex === this.options.length - 1\n            ? 0\n            : highlightedIndex + 1;\n\n        // skip disabled options\n        if (this.options[nextIndex].disabled) {\n          nextIndex = nextIndex === this.options.length - 1 ? 0 : nextIndex + 1;\n        }\n\n        this.options[highlightedIndex].highlighted = false;\n        this.options[nextIndex].highlighted = true;\n\n        // scroll to option\n        this.options[nextIndex].scrollIntoView({ block: 'nearest' });\n\n        this.assistiveText = this.options[nextIndex].text;\n        return;\n      }\n      case UP_ARROW_KEY_CODE: {\n        // go to previous option\n        let nextIndex =\n          highlightedIndex === 0\n            ? this.options.length - 1\n            : highlightedIndex - 1;\n\n        // skip disabled options\n        if (this.options[nextIndex].disabled) {\n          nextIndex = nextIndex === 0 ? this.options.length - 1 : nextIndex - 1;\n        }\n\n        this.options[highlightedIndex].highlighted = false;\n        this.options[nextIndex].highlighted = true;\n\n        // scroll to option\n        this.options[nextIndex].scrollIntoView({ block: 'nearest' });\n\n        this.assistiveText = this.options[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._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  }\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  }\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\n    // select option\n    if (e.keyCode === ENTER_KEY_CODE && option) {\n      this.updateValue(option.value, option.selected);\n      this.assistiveText = 'Selected an item.';\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      }\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 _handleFormdata(e: any) {\n    if (this.multiple) {\n      this.value.forEach((value: string) => {\n        e.formData.append(this.name, value);\n      });\n    } else {\n      e.formData.append(this.name, this.value);\n    }\n  }\n\n  private _handleInvalid() {\n    this._validate(true, false);\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    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    if (this.internals.form) {\n      this.internals.form.addEventListener('formdata', (e) =>\n        this._handleFormdata(e)\n      );\n\n      this.addEventListener('invalid', () => {\n        this._handleInvalid();\n      });\n    }\n  }\n\n  override disconnectedCallback() {\n    document.removeEventListener('click', (e) => this._handleClickOut(e));\n    this.addEventListener('on-click', (e: any) => this._handleClick(e));\n    this.addEventListener('on-blur', (e: any) => this._handleBlur(e));\n\n    if (this.internals.form) {\n      this.internals.form.removeEventListener('formdata', (e) =>\n        this._handleFormdata(e)\n      );\n\n      this.removeEventListener('invalid', () => {\n        this._handleInvalid();\n      });\n    }\n\n    super.disconnectedCallback();\n  }\n\n  private updateValue(value: string, selected = false) {\n    const values = JSON.parse(JSON.stringify(this.value));\n\n    // set value\n    if (this.multiple) {\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 updated(changedProps: any) {\n    if (\n      changedProps.has('invalidText') ||\n      changedProps.has('internalValidationMsg')\n    ) {\n      //check if any (internal / external )error msg. present then isInvalid is true\n      this.isInvalid =\n        this.invalidText !== '' || this.internalValidationMsg !== ''\n          ? true\n          : false;\n    }\n\n    if (\n      changedProps.has('invalidText') &&\n      changedProps.get('invalidText') !== undefined\n    ) {\n      this._validate(false, false);\n    }\n\n    if (changedProps.has('value')) {\n      this._validate(false, false);\n\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      // set form data value\n      // if (this.multiple) {\n      //   const entries = new FormData();\n      //   this.value.forEach((value: string) => {\n      //     entries.append(this.name, value);\n      //   });\n      //   this.internals.setFormValue(entries);\n      // } else {\n      //   this.internals.setFormValue(this.value);\n      // }\n\n      if (this.updateByValue) {\n        this._updateOptions();\n      }\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) {\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        // 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\n  private _updateOptions() {\n    this.options.forEach((option) => {\n      if (!this.multiple) {\n        option.selected = this.value.includes(option.value);\n      } else {\n        option.selected === this.value;\n      }\n    });\n  }\n\n  private _updateChildren() {\n    const Slot: any = this.shadowRoot?.querySelector('slot#children');\n    const Options = Slot?.assignedElements();\n\n    // get value from selected options\n    if (Options) {\n      const values: any = [];\n      let value = '';\n      Options.forEach((option: any) => {\n        option.multiple = this.multiple;\n\n        if (option.selected) {\n          if (this.multiple) {\n            values.push(option.value);\n          } else {\n            value = option.value;\n          }\n        }\n      });\n\n      // set initial values\n      if (this.multiple) {\n        this.value = values;\n      } else {\n        this.value = value;\n      }\n    }\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'kyn-dropdown': Dropdown;\n  }\n}\n"],"names":["Dropdown","LitElement","constructor","this","internals","attachInternals","updateByValue","size","inline","caption","placeholder","name","open","searchable","filterSearch","multiple","required","disabled","invalidText","hideTags","selectAll","selectAllText","menuMinWidth","selectAllChecked","selectAllIndeterminate","value","text","searchText","assistiveText","internalValidationMsg","isInvalid","_openUpwards","render","html","_handleLabelClick","classMap","wrapper","select","handleClick","e","handleButtonKeydown","preventDefault","handleButtonBlur","length","handleClearMultiple","clearIcon16","handleSearchKeydown","handleSearchInput","handleSearchBlur","handleSearchClick","downIcon","options","upwards","handleListKeydown","handleListBlur","handleSlotChange","searchEl","handleClear","clearIcon","errorIcon","map","Array","from","querySelectorAll","find","option","textContent","handleTagClear","detail","firstUpdated","resetSelection","_updateOptions","_updateChildren","emitValue","focus","buttonEl","handleKeyboard","keyCode","forEach","highlighted","relatedTarget","localName","target","SPACEBAR_KEY_CODE","highlightedEl","selectedEl","selected","highlightedIndex","indexOf","includes","scrollIntoView","block","updateValue","nextIndex","stopPropagation","_validate","_updateSelectedOptions","event","CustomEvent","dispatchEvent","_emitSearch","style","display","_a","classList","contains","_b","toLowerCase","filter","startsWith","_handleClick","_handleBlur","origEvent","_handleFormdata","formData","append","_handleInvalid","_handleClickOut","composedPath","connectedCallback","super","document","addEventListener","form","disconnectedCallback","removeEventListener","values","JSON","parse","stringify","push","index","splice","interacted","report","Validity","customError","valueMissing","InternalMsg","ValidationMessage","setValidity","reportValidity","updated","changedProps","has","undefined","get","Options","shadowRoot","querySelector","assignedElements","SelectedOptions","AllOptions","listboxEl","preventScroll","Threshold","getBoundingClientRect","top","window","innerHeight","Slot","styles","DropdownScss","shadowRootOptions","delegatesFocus","formAssociated","__decorate","state","prototype","property","type","Boolean","String","queryAssignedElements","selector","query","customElement"],"mappings":"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"}

package/components/reusable/pagination/pagination-page-size-dropdown.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"pagination-page-size-dropdown.d.ts","sourceRoot":"","sources":["../../../../src/components/reusable/pagination/pagination-page-size-dropdown.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,UAAU,EAAE,MAAM,KAAK,CAAC;AAGvC,OAAO,sBAAsB,CAAC;AAC9B,OAAO,4BAA4B,CAAC;AAKpC;;;;;;;GAOG;AACH,qBACa,0BAA2B,SAAQ,UAAU;IACxD,OAAgB,MAAM,iCAAY;IAElC,yBAAyB;IAEzB,QAAQ,SAAK;IAEb,wCAAwC;IAExC,aAAa,SAAmB;IAEhC,2CAA2C;IAE3C,eAAe,EAAE,KAAK,CAAC,MAAM,CAAC,CAA2B;IAEzD;;;OAGG;IACH,OAAO,CAAC,YAAY;IAYX,MAAM;CAsBhB;AAGD,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,mCAAmC,EAAE,0BAA0B,CAAC;KACjE;CACF"}
+{"version":3,"file":"pagination-page-size-dropdown.d.ts","sourceRoot":"","sources":["../../../../src/components/reusable/pagination/pagination-page-size-dropdown.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,UAAU,EAAE,MAAM,KAAK,CAAC;AAGvC,OAAO,sBAAsB,CAAC;AAC9B,OAAO,4BAA4B,CAAC;AAKpC;;;;;;;GAOG;AACH,qBACa,0BAA2B,SAAQ,UAAU;IACxD,OAAgB,MAAM,iCAAY;IAElC,yBAAyB;IAEzB,QAAQ,SAAK;IAEb,wCAAwC;IAExC,aAAa,SAAmB;IAEhC,2CAA2C;IAE3C,eAAe,EAAE,KAAK,CAAC,MAAM,CAAC,CAA2B;IAEzD;;;OAGG;IACH,OAAO,CAAC,YAAY;IAcX,MAAM;CAoBhB;AAGD,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,mCAAmC,EAAE,0BAA0B,CAAC;KACjE;CACF"}

package/components/reusable/pagination/pagination-page-size-dropdown.js

@@ -1,19 +1,17 @@
-import{__decorate as e}from"../../../_virtual/_tslib.js";import'./../../../external/@lit/reactive-element/reactive-element.js';import{html as t}from'./../../../external/lit-html/lit-html.js';import{LitElement as o}from'./../../../external/lit-element/lit-element.js';import{customElement as i}from'./../../../external/@lit/reactive-element/decorators/custom-element.js';import{property as s}from'./../../../external/@lit/reactive-element/decorators/property.js';import'./../../../external/@lit/reactive-element/decorators/query-assigned-elements.js';import"../dropdown/dropdown.js";import"../dropdown/dropdownOption.js";import n from"./pagination-page-size-dropdown.scss.js";import{PAGE_SIZE_LABEL as p}from"./constants.js";let r=class extends o{constructor(){super(...arguments),this.pageSize=5,this.pageSizeLabel=p,this.pageSizeOptions=[5,10,20,30,40,50]}handleChange(e){this.pageSize=e.detail.value,this.dispatchEvent(new CustomEvent("on-page-size-change",{detail:{value:e.detail.value},bubbles:!0,composed:!0}))}render(){return t`
+import{__decorate as e}from"../../../_virtual/_tslib.js";import'./../../../external/@lit/reactive-element/reactive-element.js';import{html as t}from'./../../../external/lit-html/lit-html.js';import{LitElement as o}from'./../../../external/lit-element/lit-element.js';import{customElement as i}from'./../../../external/@lit/reactive-element/decorators/custom-element.js';import{property as n}from'./../../../external/@lit/reactive-element/decorators/property.js';import'./../../../external/@lit/reactive-element/decorators/query-assigned-elements.js';import"../dropdown/dropdown.js";import"../dropdown/dropdownOption.js";import s from"./pagination-page-size-dropdown.scss.js";import{PAGE_SIZE_LABEL as p}from"./constants.js";let r=class extends o{constructor(){super(...arguments),this.pageSize=5,this.pageSizeLabel=p,this.pageSizeOptions=[5,10,20,30,40,50]}handleChange(e){this.pageSize=e.detail.value,this.dispatchEvent(new CustomEvent("on-page-size-change",{detail:{value:e.detail.value},bubbles:!0,composed:!0}))}render(){return t`
       <label> ${this.pageSizeLabel} </label>
       <kyn-dropdown
         inline
-        placeholder=${this.pageSize}
         size="sm"
+        updateByValue
+        value=${this.pageSize}
         @on-change=${e=>this.handleChange(e)}
       >
         ${this.pageSizeOptions.map((e=>t`
-            <kyn-dropdown-option
-              ?selected=${this.pageSize===e}
-              value=${e}
-            >
+            <kyn-dropdown-option value=${e}>
               ${e}
             </kyn-dropdown-option>
           `))}
       </kyn-dropdown>
-    `}};r.styles=[n],e([s({type:Number})],r.prototype,"pageSize",void 0),e([s({type:String})],r.prototype,"pageSizeLabel",void 0),e([s({type:Array})],r.prototype,"pageSizeOptions",void 0),r=e([i("kyn-pagination-page-size-dropdown")],r);export{r as PaginationPageSizeDropdown};
+    `}};r.styles=[s],e([n({type:Number})],r.prototype,"pageSize",void 0),e([n({type:String})],r.prototype,"pageSizeLabel",void 0),e([n({type:Array})],r.prototype,"pageSizeOptions",void 0),r=e([i("kyn-pagination-page-size-dropdown")],r);export{r as PaginationPageSizeDropdown};
 //# sourceMappingURL=pagination-page-size-dropdown.js.map

package/components/reusable/pagination/pagination-page-size-dropdown.js.map

@@ -1 +1 @@
-{"version":3,"file":"pagination-page-size-dropdown.js","sources":["../../../../src/components/reusable/pagination/pagination-page-size-dropdown.ts"],"sourcesContent":["import { html, LitElement } from 'lit';\nimport { property, customElement } from 'lit/decorators.js';\n\nimport '../dropdown/dropdown';\nimport '../dropdown/dropdownOption';\n\nimport styles from './pagination-page-size-dropdown.scss';\nimport { PAGE_SIZE_LABEL } from './constants';\n\n/**\n * `kyn-pagination-page-size-dropdown` Web Component.\n *\n * This component provides a dropdown to select the page size for pagination.\n * It emits events when the selected page size changes.\n *\n * @fires on-page-size-change - The event fired when the page size changes.\n */\n@customElement('kyn-pagination-page-size-dropdown')\nexport class PaginationPageSizeDropdown extends LitElement {\n  static override styles = [styles];\n\n  /** Current page size. */\n  @property({ type: Number })\n  pageSize = 5;\n\n  /** Label for the page size dropdown. */\n  @property({ type: String })\n  pageSizeLabel = PAGE_SIZE_LABEL;\n\n  /** Available options for the page size. */\n  @property({ type: Array })\n  pageSizeOptions: Array<number> = [5, 10, 20, 30, 40, 50];\n\n  /**\n   * Handles the dropdown change event.\n   * @param {CustomEvent} event - The dropdown change event.\n   */\n  private handleChange(event: CustomEvent) {\n    this.pageSize = event.detail.value;\n\n    this.dispatchEvent(\n      new CustomEvent('on-page-size-change', {\n        detail: { value: event.detail.value },\n        bubbles: true, // So that parent components can catch it\n        composed: true, // Required for the event to pass through the Shadow DOM boundary\n      })\n    );\n  }\n\n  override render() {\n    return html`\n      <label> ${this.pageSizeLabel} </label>\n      <kyn-dropdown\n        inline\n        placeholder=${this.pageSize}\n        size=\"sm\"\n        @on-change=${(e: CustomEvent) => this.handleChange(e)}\n      >\n        ${this.pageSizeOptions.map((option) => {\n          return html`\n            <kyn-dropdown-option\n              ?selected=${this.pageSize === option}\n              value=${option}\n            >\n              ${option}\n            </kyn-dropdown-option>\n          `;\n        })}\n      </kyn-dropdown>\n    `;\n  }\n}\n\n// Define the custom element in the global namespace\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'kyn-pagination-page-size-dropdown': PaginationPageSizeDropdown;\n  }\n}\n"],"names":["PaginationPageSizeDropdown","LitElement","constructor","this","pageSize","pageSizeLabel","PAGE_SIZE_LABEL","pageSizeOptions","handleChange","event","detail","value","dispatchEvent","CustomEvent","bubbles","composed","render","html","e","map","option","styles","__decorate","property","type","Number","prototype","String","Array","customElement"],"mappings":"guBAkBO,IAAMA,EAAN,cAAyCC,EAAzC,WAAAC,uBAKLC,KAAQC,SAAG,EAIXD,KAAaE,cAAGC,EAIhBH,KAAAI,gBAAiC,CAAC,EAAG,GAAI,GAAI,GAAI,GAAI,GAwCtD,CAlCS,YAAAC,CAAaC,GACnBN,KAAKC,SAAWK,EAAMC,OAAOC,MAE7BR,KAAKS,cACH,IAAIC,YAAY,sBAAuB,CACrCH,OAAQ,CAAEC,MAAOF,EAAMC,OAAOC,OAC9BG,SAAS,EACTC,UAAU,IAGf,CAEQ,MAAAC,GACP,OAAOC,CAAI;gBACCd,KAAKE;;;sBAGCF,KAAKC;;qBAELc,GAAmBf,KAAKK,aAAaU;;UAEjDf,KAAKI,gBAAgBY,KAAKC,GACnBH,CAAI;;0BAEKd,KAAKC,WAAagB;sBACtBA;;gBAENA;;;;KAMb,GAnDepB,EAAAqB,OAAS,CAACA,GAI1BC,EAAA,CADCC,EAAS,CAAEC,KAAMC,UACLzB,EAAA0B,UAAA,gBAAA,GAIbJ,EAAA,CADCC,EAAS,CAAEC,KAAMG,UACc3B,EAAA0B,UAAA,qBAAA,GAIhCJ,EAAA,CADCC,EAAS,CAAEC,KAAMI,SACuC5B,EAAA0B,UAAA,uBAAA,GAb9C1B,EAA0BsB,EAAA,CADtCO,EAAc,sCACF7B"}
+{"version":3,"file":"pagination-page-size-dropdown.js","sources":["../../../../src/components/reusable/pagination/pagination-page-size-dropdown.ts"],"sourcesContent":["import { html, LitElement } from 'lit';\nimport { property, customElement } from 'lit/decorators.js';\n\nimport '../dropdown/dropdown';\nimport '../dropdown/dropdownOption';\n\nimport styles from './pagination-page-size-dropdown.scss';\nimport { PAGE_SIZE_LABEL } from './constants';\n\n/**\n * `kyn-pagination-page-size-dropdown` Web Component.\n *\n * This component provides a dropdown to select the page size for pagination.\n * It emits events when the selected page size changes.\n *\n * @fires on-page-size-change - The event fired when the page size changes.\n */\n@customElement('kyn-pagination-page-size-dropdown')\nexport class PaginationPageSizeDropdown extends LitElement {\n  static override styles = [styles];\n\n  /** Current page size. */\n  @property({ type: Number })\n  pageSize = 5;\n\n  /** Label for the page size dropdown. */\n  @property({ type: String })\n  pageSizeLabel = PAGE_SIZE_LABEL;\n\n  /** Available options for the page size. */\n  @property({ type: Array })\n  pageSizeOptions: Array<number> = [5, 10, 20, 30, 40, 50];\n\n  /**\n   * Handles the dropdown change event.\n   * @param {CustomEvent} event - The dropdown change event.\n   */\n  private handleChange(event: CustomEvent) {\n    this.pageSize = event.detail.value;\n\n    // this.shadowRoot?.querySelector('kyn-dropdown')?.resetSelection();\n\n    this.dispatchEvent(\n      new CustomEvent('on-page-size-change', {\n        detail: { value: event.detail.value },\n        bubbles: true, // So that parent components can catch it\n        composed: true, // Required for the event to pass through the Shadow DOM boundary\n      })\n    );\n  }\n\n  override render() {\n    return html`\n      <label> ${this.pageSizeLabel} </label>\n      <kyn-dropdown\n        inline\n        size=\"sm\"\n        updateByValue\n        value=${this.pageSize}\n        @on-change=${(e: CustomEvent) => this.handleChange(e)}\n      >\n        ${this.pageSizeOptions.map((option) => {\n          return html`\n            <kyn-dropdown-option value=${option}>\n              ${option}\n            </kyn-dropdown-option>\n          `;\n        })}\n      </kyn-dropdown>\n    `;\n  }\n}\n\n// Define the custom element in the global namespace\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'kyn-pagination-page-size-dropdown': PaginationPageSizeDropdown;\n  }\n}\n"],"names":["PaginationPageSizeDropdown","LitElement","constructor","this","pageSize","pageSizeLabel","PAGE_SIZE_LABEL","pageSizeOptions","handleChange","event","detail","value","dispatchEvent","CustomEvent","bubbles","composed","render","html","e","map","option","styles","__decorate","property","type","Number","prototype","String","Array","customElement"],"mappings":"guBAkBO,IAAMA,EAAN,cAAyCC,EAAzC,WAAAC,uBAKLC,KAAQC,SAAG,EAIXD,KAAaE,cAAGC,EAIhBH,KAAAI,gBAAiC,CAAC,EAAG,GAAI,GAAI,GAAI,GAAI,GAwCtD,CAlCS,YAAAC,CAAaC,GACnBN,KAAKC,SAAWK,EAAMC,OAAOC,MAI7BR,KAAKS,cACH,IAAIC,YAAY,sBAAuB,CACrCH,OAAQ,CAAEC,MAAOF,EAAMC,OAAOC,OAC9BG,SAAS,EACTC,UAAU,IAGf,CAEQ,MAAAC,GACP,OAAOC,CAAI;gBACCd,KAAKE;;;;;gBAKLF,KAAKC;qBACCc,GAAmBf,KAAKK,aAAaU;;UAEjDf,KAAKI,gBAAgBY,KAAKC,GACnBH,CAAI;yCACoBG;gBACzBA;;;;KAMb,GAnDepB,EAAAqB,OAAS,CAACA,GAI1BC,EAAA,CADCC,EAAS,CAAEC,KAAMC,UACLzB,EAAA0B,UAAA,gBAAA,GAIbJ,EAAA,CADCC,EAAS,CAAEC,KAAMG,UACc3B,EAAA0B,UAAA,qBAAA,GAIhCJ,EAAA,CADCC,EAAS,CAAEC,KAAMI,SACuC5B,EAAA0B,UAAA,uBAAA,GAb9C1B,EAA0BsB,EAAA,CADtCO,EAAc,sCACF7B"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kyndryl-design-system/shidoka-applications",
-  "version": "1.24.13",
+  "version": "1.24.14",
   "description": "Shidoka Web Components for Applications",
   "main": "index.js",
   "type": "module",