@kyndryl-design-system/shidoka-applications 1.32.2 → 1.32.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -128,6 +128,11 @@ export declare class Dropdown extends LitElement {
128
128
  * @ignore
129
129
  */
130
130
  _openUpwards: boolean;
131
+ /**
132
+ * Tags value/text reference.
133
+ * @ignore
134
+ */
135
+ _tags: Array<object>;
131
136
  render(): import("lit-html").TemplateResult<1>;
132
137
  firstUpdated(): void;
133
138
  private handleSlotChange;
@@ -1 +1 @@
1
- {"version":3,"file":"dropdown.d.ts","sourceRoot":"","sources":["../../../../src/components/reusable/dropdown/dropdown.ts"],"names":[],"mappings":"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"}
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,MAAgB;IAEtC,cAAc;IACd,OAAgB,iBAAiB;;;;MAG/B;IAEF;;;OAGG;IACH,MAAM,CAAC,cAAc,UAAQ;IAE7B;;;OAGG;IAEH,SAAS,mBAA0B;IAEnC,uEAAuE;IAEvE,aAAa,UAAS;IAEtB,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;;OAEG;IAEH,KAAK,EAAE,GAAG,CAAM;IAEhB;;;OAGG;IAEH,IAAI,SAAM;IAEV;;OAEG;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;IAErB;;;OAGG;IAEH,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,CAAM;IAEjB,MAAM;IA2LN,YAAY;IAerB,OAAO,CAAC,gBAAgB;IAIxB;;;OAGG;IACI,cAAc;IASrB,OAAO,CAAC,WAAW;IAWnB,OAAO,CAAC,iBAAiB;IAYzB,OAAO,CAAC,mBAAmB;IAI3B,OAAO,CAAC,iBAAiB;IAUzB,OAAO,CAAC,cAAc;IAatB,OAAO,CAAC,cAAc;IA0HtB,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;IA+BnB,OAAO,CAAC,SAAS;IA+BjB,OAAO,CAAC,SAAS;IASjB,OAAO,CAAC,WAAW;IASV,OAAO,CAAC,YAAY,EAAE,GAAG;IAoHlC,OAAO,CAAC,cAAc;IA8BtB,OAAO,CAAC,eAAe;CA4BxB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,cAAc,EAAE,QAAQ,CAAC;KAC1B;CACF"}
@@ -1,4 +1,4 @@
1
- import{__decorate as e}from'./../../../external/tslib/tslib.es6.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 a}from'./../../../external/@lit/reactive-element/decorators/state.js';import{query as o}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 c from'./../../../external/@carbon/icons/es/warning--filled/24.js';import p 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`
1
+ import{__decorate as e}from'./../../../external/tslib/tslib.es6.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 a}from'./../../../external/@lit/reactive-element/decorators/state.js';import{query as o}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,this._tags=[]}render(){return t`
2
2
  <div
3
3
  class="dropdown"
4
4
  ?disabled=${this.disabled}
@@ -108,23 +108,23 @@ import{__decorate as e}from'./../../../external/tslib/tslib.es6.js';import'./../
108
108
  aria-label="Clear search text"
109
109
  @click=${e=>this.handleClear(e)}
110
110
  >
111
- <kd-icon .icon=${p}></kd-icon>
111
+ <kd-icon .icon=${c}></kd-icon>
112
112
  </button>
113
113
  `:null}
114
114
  <!--
115
- ${this.isInvalid?t` <kd-icon class="error-icon" .icon=${c}></kd-icon> `:null}
115
+ ${this.isInvalid?t` <kd-icon class="error-icon" .icon=${p}></kd-icon> `:null}
116
116
  -->
117
117
  </div>
118
118
 
119
119
  ${this.multiple&&!this.hideTags&&this.value.length?t`
120
120
  <kyn-tag-group filter>
121
- ${this.value.map((e=>{const i=Array.from(this.querySelectorAll("kyn-dropdown-option")).find((t=>t.value===e.toString())),s=i?i.textContent:"";return t`
121
+ ${this._tags.map((e=>t`
122
122
  <kyn-tag
123
- label=${s}
123
+ label=${e.text}
124
124
  ?disabled=${this.disabled}
125
- @on-close=${()=>this.handleTagClear(e)}
125
+ @on-close=${()=>this.handleTagClear(e.value)}
126
126
  ></kyn-tag>
127
- `}))}
127
+ `))}
128
128
  </kyn-tag-group>
129
129
  `:null}
130
130
  ${""!==this.caption?t` <div class="caption">${this.caption}</div> `:null}
@@ -143,5 +143,5 @@ import{__decorate as e}from'./../../../external/tslib/tslib.es6.js';import'./../
143
143
  ${this.assistiveText}
144
144
  </div>
145
145
  </div>
146
- `}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.disabled||(this.open=!this.open,this.searchable?this.searchEl.focus():this.buttonEl.focus())}handleButtonKeydown(e){this.handleKeyboard(e,e.keyCode,"button")}handleListKeydown(e){9!==e.keyCode&&e.preventDefault(),this.handleKeyboard(e,e.keyCode,"list")}handleListBlur(e){this.options.forEach((e=>e.highlighted=!1)),e.relatedTarget&&"kyn-dropdown-option"!==e.relatedTarget.localName&&(this.open=!1),this.assistiveText="Dropdown menu options."}handleKeyboard(e,t,i){const s=[0,32],l=this.options.filter((e=>"none"!==e.style.display)),a=l.find((e=>e.highlighted)),o=l.find((e=>e.selected)),n=a?l.indexOf(a):l.find((e=>e.selected))?l.indexOf(o):0;if(s.includes(t)&&e.preventDefault(),"button"===i){(s.includes(t)||13===t||40==t||38==t)&&(this.open=!0,l[n].highlighted=!0,this.multiple||""===this.value||l[n].scrollIntoView({block:"nearest"}))}switch(t){case 13:return this.updateValue(l[n].value,!l[n].selected),this.assistiveText="Selected an item.",void this.emitValue();case 40:{let e=a||o?n===l.length-1?0:n+1:0;return l[e].disabled&&(e=e===l.length-1?0:e+1),l[n].highlighted=!1,l[e].highlighted=!0,l[e].scrollIntoView({block:"nearest"}),void(this.assistiveText=l[e].text)}case 38:{let e=0===n?l.length-1:n-1;return l[e].disabled&&(e=0===e?l.length-1:e-1),l[n].highlighted=!1,l[e].highlighted=!0,l[e].scrollIntoView({block:"nearest"}),void(this.assistiveText=l[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){if(this.multiple){const i=""===this.value?[]:JSON.parse(JSON.stringify(this.value));if(t)i.push(e);else{const t=i.indexOf(e);i.splice(t,1)}this.value=i}else this.value=e;this._validate(!0,!1),this.multiple||(this.searchable?this.searchEl.focus():this.buttonEl.focus())}_validate(e,t){const i={customError:""!==this.invalidText,valueMissing:this.required&&(!this.value||this.multiple&&!this.value.length||!this.multiple&&""===this.value)},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)),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.text&&(this.searchText=this.text===this.placeholder?"":this.text,this.searchEl.value=this.searchText)}}if(e.has("open")&&(this.open&&!this.searchable&&(this.listboxEl.focus({preventScroll:!0}),this.assistiveText="Selecting items. Use up and down arrow keys to navigate."),this.open)){this.multiple||null===(i=this.options.find((e=>e.selected)))||void 0===i||i.scrollIntoView({block:"nearest"});const e=.6;this.buttonEl.getBoundingClientRect().top>window.innerHeight*e?this._openUpwards=!0:this._openUpwards=!1}e.has("multiple")&&this.options.forEach((e=>{e.multiple=this.multiple})),e.has("searchText")&&this.searchEl&&(this.searchEl.value=this.searchText)}_updateOptions(){this.options.forEach((e=>{this.multiple?e.selected=this.value.includes(e.value):e.selected=this.value===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([a()],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([a()],v.prototype,"text",void 0),e([l({type:String})],v.prototype,"searchText",void 0),e([a()],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([o(".search")],v.prototype,"searchEl",void 0),e([o(".select")],v.prototype,"buttonEl",void 0),e([o(".options")],v.prototype,"listboxEl",void 0),e([a()],v.prototype,"internalValidationMsg",void 0),e([a()],v.prototype,"isInvalid",void 0),e([a()],v.prototype,"_openUpwards",void 0),v=e([s("kyn-dropdown")],v);export{v as Dropdown};
146
+ `}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.disabled||(this.open=!this.open,this.searchable?this.searchEl.focus():this.buttonEl.focus())}handleButtonKeydown(e){this.handleKeyboard(e,e.keyCode,"button")}handleListKeydown(e){9!==e.keyCode&&e.preventDefault(),this.handleKeyboard(e,e.keyCode,"list")}handleListBlur(e){this.options.forEach((e=>e.highlighted=!1)),e.relatedTarget&&"kyn-dropdown-option"!==e.relatedTarget.localName&&(this.open=!1),this.assistiveText="Dropdown menu options."}handleKeyboard(e,t,i){const s=[0,32],l=this.options.filter((e=>"none"!==e.style.display)),a=l.find((e=>e.highlighted)),o=l.find((e=>e.selected)),n=a?l.indexOf(a):l.find((e=>e.selected))?l.indexOf(o):0;if(s.includes(t)&&e.preventDefault(),"button"===i){(s.includes(t)||13===t||40==t||38==t)&&(this.open=!0,l[n].highlighted=!0,this.multiple||""===this.value||l[n].scrollIntoView({block:"nearest"}))}switch(t){case 13:return this.updateValue(l[n].value,!l[n].selected),this.assistiveText="Selected an item.",void this.emitValue();case 40:{let e=a||o?n===l.length-1?0:n+1:0;return l[e].disabled&&(e=e===l.length-1?0:e+1),l[n].highlighted=!1,l[e].highlighted=!0,l[e].scrollIntoView({block:"nearest"}),void(this.assistiveText=l[e].text)}case 38:{let e=0===n?l.length-1:n-1;return l[e].disabled&&(e=0===e?l.length-1:e-1),l[n].highlighted=!1,l[e].highlighted=!0,l[e].scrollIntoView({block:"nearest"}),void(this.assistiveText=l[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){if(this.multiple){const i=""===this.value?[]:JSON.parse(JSON.stringify(this.value));if(t)i.push(e);else{const t=i.indexOf(e);i.splice(t,1)}this.value=i}else this.value=e;this._validate(!0,!1),this.multiple||(this.searchable?this.searchEl.focus():this.buttonEl.focus())}_validate(e,t){const i={customError:""!==this.invalidText,valueMissing:this.required&&(!this.value||this.multiple&&!this.value.length||!this.multiple&&""===this.value)},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)),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.text&&(this.searchText=this.text===this.placeholder?"":this.text,this.searchEl.value=this.searchText)}}if(e.has("open")&&(this.open&&!this.searchable&&(this.listboxEl.focus({preventScroll:!0}),this.assistiveText="Selecting items. Use up and down arrow keys to navigate."),this.open)){this.multiple||null===(i=this.options.find((e=>e.selected)))||void 0===i||i.scrollIntoView({block:"nearest"});const e=.6;this.buttonEl.getBoundingClientRect().top>window.innerHeight*e?this._openUpwards=!0:this._openUpwards=!1}e.has("multiple")&&this.options.forEach((e=>{e.multiple=this.multiple})),e.has("searchText")&&this.searchEl&&(this.searchEl.value=this.searchText)}_updateOptions(){const e=Array.from(this.querySelectorAll("kyn-dropdown-option")),t=[];e.forEach((e=>{if(e.multiple=this.multiple,this.multiple){const i=this.value.includes(e.value);e.selected=i,i&&t.push({value:e.value,text:e.textContent})}else e.selected=this.value===e.value})),this._tags=t}_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([a()],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([a()],v.prototype,"text",void 0),e([l({type:String})],v.prototype,"searchText",void 0),e([a()],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([o(".search")],v.prototype,"searchEl",void 0),e([o(".select")],v.prototype,"buttonEl",void 0),e([o(".options")],v.prototype,"listboxEl",void 0),e([a()],v.prototype,"internalValidationMsg",void 0),e([a()],v.prototype,"isInvalid",void 0),e([a()],v.prototype,"_openUpwards",void 0),e([a()],v.prototype,"_tags",void 0),v=e([s("kyn-dropdown")],v);export{v as Dropdown};
147
147
  //# sourceMappingURL=dropdown.js.map
@@ -1 +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 /** 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 */\n @property({ type: String })\n searchText = '';\n\n /**\n * Assistive text for screen readers.\n * @ignore\n */\n @state()\n assistiveText = 'Dropdown menu options.';\n\n /**\n * Queries any slotted options.\n * @ignore\n */\n @queryAssignedElements({ selector: 'kyn-dropdown-option' })\n options!: Array<any>;\n\n /**\n * Queries any slotted selected options.\n * @ignore\n */\n @queryAssignedElements({ selector: 'kyn-dropdown-option[selected]' })\n selectedOptions!: Array<any>;\n\n /**\n * Queries the .search DOM element.\n * @ignore\n */\n @query('.search')\n searchEl!: HTMLInputElement;\n\n /**\n * Queries the .select DOM element.\n * @ignore\n */\n @query('.select')\n buttonEl!: HTMLElement;\n\n /**\n * Queries the .options DOM element.\n * @ignore\n */\n @query('.options')\n listboxEl!: HTMLElement;\n\n /**\n * 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 aria-expanded=${this.open}\n aria-controls=\"options\"\n role=\"combobox\"\n id=${this.name}\n name=${this.name}\n ?required=${this.required}\n ?disabled=${this.disabled}\n ?invalid=${this.isInvalid}\n tabindex=${this.disabled ? '' : '0'}\n @click=${() => this.handleClick()}\n @keydown=${(e: any) => this.handleButtonKeydown(e)}\n @mousedown=${(e: any) => {\n if (!this.searchable) {\n e.preventDefault();\n }\n }}\n @blur=${(e: any) => this.handleButtonBlur(e)}\n >\n ${this.multiple && this.value.length\n ? html`\n <button\n class=\"clear-multiple\"\n aria-label=\"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 id=\"options\"\n class=${classMap({\n options: true,\n open: this.open,\n upwards: this._openUpwards,\n })}\n style=\"min-width: ${this.menuMinWidth};\"\n aria-labelledby=\"label-${this.name}\"\n name=${this.name}\n role=\"listbox\"\n tabindex=\"0\"\n aria-expanded=${this.open}\n aria-hidden=${!this.open}\n @keydown=${(e: any) => this.handleListKeydown(e)}\n @blur=${(e: any) => this.handleListBlur(e)}\n >\n ${this.multiple && this.selectAll\n ? html`\n <kyn-dropdown-option\n class=\"select-all\"\n value=\"selectAll\"\n multiple\n ?selected=${this.selectAllChecked}\n ?indeterminate=${this.selectAllIndeterminate}\n ?disabled=${this.disabled}\n >\n ${this.selectAllText}\n </kyn-dropdown-option>\n `\n : null}\n\n <slot\n id=\"children\"\n @slotchange=${() => this.handleSlotChange()}\n ></slot>\n </ul>\n </div>\n\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 <!--\n ${this.isInvalid\n ? html` <kd-icon class=\"error-icon\" .icon=${errorIcon}></kd-icon> `\n : null}\n -->\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.toString()\n );\n const text = option ? option.textContent : '';\n\n return html`\n <kyn-tag\n label=${text}\n ?disabled=${this.disabled}\n @on-close=${() => this.handleTagClear(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 if (!this.disabled) {\n this.open = !this.open;\n\n if (this.searchable) {\n this.searchEl.focus();\n } else {\n this.buttonEl.focus();\n }\n }\n }\n\n private handleButtonKeydown(e: any) {\n this.handleKeyboard(e, e.keyCode, 'button');\n }\n\n private handleListKeydown(e: any) {\n const TAB_KEY_CODE = 9;\n\n if (e.keyCode !== TAB_KEY_CODE) {\n e.preventDefault();\n }\n\n this.handleKeyboard(e, e.keyCode, 'list');\n }\n\n private handleListBlur(e: any) {\n this.options.forEach((option) => (option.highlighted = false));\n\n // don't blur if clicking an option inside\n if (\n e.relatedTarget &&\n e.relatedTarget.localName !== 'kyn-dropdown-option'\n ) {\n this.open = false;\n }\n this.assistiveText = 'Dropdown menu options.';\n }\n\n private handleKeyboard(e: any, keyCode: number, target: string) {\n const SPACEBAR_KEY_CODE = [0, 32];\n const ENTER_KEY_CODE = 13;\n const DOWN_ARROW_KEY_CODE = 40;\n const UP_ARROW_KEY_CODE = 38;\n const ESCAPE_KEY_CODE = 27;\n\n // get highlighted element + index and selected element\n const visibleOptions = this.options.filter(\n (option: any) => option.style.display !== 'none'\n );\n const highlightedEl = visibleOptions.find(\n (option: any) => option.highlighted\n );\n const selectedEl = visibleOptions.find((option: any) => option.selected);\n const highlightedIndex = highlightedEl\n ? visibleOptions.indexOf(highlightedEl)\n : visibleOptions.find((option: any) => option.selected)\n ? visibleOptions.indexOf(selectedEl)\n : 0;\n\n // prevent page scroll on spacebar press\n if (SPACEBAR_KEY_CODE.includes(keyCode)) {\n e.preventDefault();\n }\n\n // 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 visibleOptions[highlightedIndex].highlighted = true;\n\n // scroll to highlighted option\n if (!this.multiple && this.value !== '') {\n visibleOptions[highlightedIndex].scrollIntoView({ block: 'nearest' });\n }\n }\n }\n\n switch (keyCode) {\n case ENTER_KEY_CODE: {\n // select highlighted option\n this.updateValue(\n visibleOptions[highlightedIndex].value,\n !visibleOptions[highlightedIndex].selected\n );\n this.assistiveText = 'Selected an item.';\n this.emitValue();\n return;\n }\n case DOWN_ARROW_KEY_CODE: {\n // go to next option\n let nextIndex =\n !highlightedEl && !selectedEl\n ? 0\n : highlightedIndex === visibleOptions.length - 1\n ? 0\n : highlightedIndex + 1;\n\n // skip disabled options\n if (visibleOptions[nextIndex].disabled) {\n nextIndex =\n nextIndex === visibleOptions.length - 1 ? 0 : nextIndex + 1;\n }\n\n visibleOptions[highlightedIndex].highlighted = false;\n visibleOptions[nextIndex].highlighted = true;\n\n // scroll to option\n visibleOptions[nextIndex].scrollIntoView({ block: 'nearest' });\n\n this.assistiveText = visibleOptions[nextIndex].text;\n return;\n }\n case UP_ARROW_KEY_CODE: {\n // go to previous option\n let nextIndex =\n highlightedIndex === 0\n ? visibleOptions.length - 1\n : highlightedIndex - 1;\n\n // skip disabled options\n if (visibleOptions[nextIndex].disabled) {\n nextIndex =\n nextIndex === 0 ? visibleOptions.length - 1 : nextIndex - 1;\n }\n\n visibleOptions[highlightedIndex].highlighted = false;\n visibleOptions[nextIndex].highlighted = true;\n\n // scroll to option\n visibleOptions[nextIndex].scrollIntoView({ block: 'nearest' });\n\n this.assistiveText = visibleOptions[nextIndex].text;\n return;\n }\n case ESCAPE_KEY_CODE: {\n // close listbox\n this.open = false;\n\n // restore focus\n if (this.searchable) {\n this.searchEl.focus();\n } else {\n this.buttonEl.focus();\n }\n\n this.assistiveText = 'Dropdown menu options.';\n return;\n }\n default: {\n return;\n }\n }\n }\n\n private handleClearMultiple(e: any) {\n e.stopPropagation();\n\n // clear values\n if (this.multiple) {\n this.value = [];\n } else {\n this.value = '';\n }\n\n this._validate(true, false);\n this._updateSelectedOptions();\n this.emitValue();\n\n const event = new CustomEvent('on-clear-all', {\n detail: {\n value: this.value,\n },\n });\n this.dispatchEvent(event);\n }\n\n private handleTagClear(value: string) {\n // remove value\n this.updateValue(value, false);\n this._updateSelectedOptions();\n this.emitValue();\n }\n\n private handleClear(e: any) {\n e.stopPropagation();\n\n // reset search input text\n this.text = '';\n this.searchText = '';\n this.searchEl.value = '';\n\n this._emitSearch();\n\n if (this.filterSearch) {\n // reveal all options\n this.options.map((option: any) => {\n option.style.display = 'block';\n });\n }\n\n // clear selection for single select\n if (!this.multiple) {\n this.value = '';\n this._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 // set value\n if (this.multiple) {\n const values =\n this.value === '' ? [] : JSON.parse(JSON.stringify(this.value));\n\n // update array\n if (selected) {\n values.push(value);\n } else {\n const index = values.indexOf(value);\n values.splice(index, 1);\n }\n\n this.value = values;\n } else {\n this.value = value;\n }\n\n this._validate(true, false);\n\n // reset focus\n if (!this.multiple) {\n if (this.searchable) {\n this.searchEl.focus();\n } else {\n this.buttonEl.focus();\n }\n }\n }\n\n private _validate(interacted: Boolean, report: Boolean) {\n // set validity flags\n const Validity = {\n customError: this.invalidText !== '',\n valueMissing:\n this.required &&\n (!this.value ||\n (this.multiple && !this.value.length) ||\n (!this.multiple && this.value === '')),\n };\n\n // set validationMessage\n const InternalMsg =\n this.required && !this.value.length ? 'Please fill out this field.' : '';\n const ValidationMessage =\n this.invalidText !== '' ? this.invalidText : InternalMsg;\n\n // set validity on custom element, anchor to buttonEl\n this.internals.setValidity(Validity, ValidationMessage, this.buttonEl);\n\n // set internal validation message if value was changed by user input\n if (interacted) {\n this.internalValidationMsg = InternalMsg;\n }\n\n // focus the buttonEl to show validity\n if (report) {\n this.internals.reportValidity();\n }\n }\n\n private emitValue() {\n const event = new CustomEvent('on-change', {\n detail: {\n value: this.value,\n },\n });\n this.dispatchEvent(event);\n }\n\n private _emitSearch() {\n const event = new CustomEvent('on-search', {\n detail: {\n searchText: this.searchText,\n },\n });\n this.dispatchEvent(event);\n }\n\n override 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 && this.text) {\n this.searchText = this.text === this.placeholder ? '' : this.text;\n this.searchEl.value = this.searchText;\n }\n }\n }\n\n if (changedProps.has('open')) {\n if (this.open && !this.searchable) {\n // focus listbox if not searchable\n this.listboxEl.focus({ preventScroll: true });\n this.assistiveText =\n 'Selecting items. Use up and down arrow keys to navigate.';\n }\n\n if (this.open) {\n if (!this.multiple) {\n // scroll to selected option\n this.options\n .find((option) => option.selected)\n ?.scrollIntoView({ block: 'nearest' });\n }\n\n // open dropdown upwards if closer to bottom of viewport\n const Threshold = 0.6;\n\n if (\n this.buttonEl.getBoundingClientRect().top >\n window.innerHeight * Threshold\n ) {\n this._openUpwards = true;\n } else {\n this._openUpwards = false;\n }\n }\n }\n\n if (changedProps.has('multiple')) {\n // set multiple for each option\n this.options.forEach((option: any) => {\n option.multiple = this.multiple;\n });\n }\n\n if (changedProps.has('searchText') && this.searchEl) {\n this.searchEl.value = this.searchText;\n }\n }\n\n 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 === option.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","option","Array","from","querySelectorAll","find","toString","textContent","handleTagClear","firstUpdated","resetSelection","_updateOptions","_updateChildren","emitValue","focus","buttonEl","handleKeyboard","keyCode","forEach","highlighted","relatedTarget","localName","target","SPACEBAR_KEY_CODE","visibleOptions","filter","style","display","highlightedEl","selectedEl","selected","highlightedIndex","indexOf","includes","scrollIntoView","block","updateValue","nextIndex","stopPropagation","_validate","_updateSelectedOptions","event","CustomEvent","detail","dispatchEvent","_emitSearch","_a","classList","contains","_b","toLowerCase","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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"}
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 /** 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 */\n @property({ type: String })\n searchText = '';\n\n /**\n * Assistive text for screen readers.\n * @ignore\n */\n @state()\n assistiveText = 'Dropdown menu options.';\n\n /**\n * Queries any slotted options.\n * @ignore\n */\n @queryAssignedElements({ selector: 'kyn-dropdown-option' })\n options!: Array<any>;\n\n /**\n * Queries any slotted selected options.\n * @ignore\n */\n @queryAssignedElements({ selector: 'kyn-dropdown-option[selected]' })\n selectedOptions!: Array<any>;\n\n /**\n * Queries the .search DOM element.\n * @ignore\n */\n @query('.search')\n searchEl!: HTMLInputElement;\n\n /**\n * Queries the .select DOM element.\n * @ignore\n */\n @query('.select')\n buttonEl!: HTMLElement;\n\n /**\n * Queries the .options DOM element.\n * @ignore\n */\n @query('.options')\n listboxEl!: HTMLElement;\n\n /**\n * 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 /**\n * Tags value/text reference.\n * @ignore\n */\n @state()\n _tags: Array<object> = [];\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 aria-expanded=${this.open}\n aria-controls=\"options\"\n role=\"combobox\"\n id=${this.name}\n name=${this.name}\n ?required=${this.required}\n ?disabled=${this.disabled}\n ?invalid=${this.isInvalid}\n tabindex=${this.disabled ? '' : '0'}\n @click=${() => this.handleClick()}\n @keydown=${(e: any) => this.handleButtonKeydown(e)}\n @mousedown=${(e: any) => {\n if (!this.searchable) {\n e.preventDefault();\n }\n }}\n @blur=${(e: any) => this.handleButtonBlur(e)}\n >\n ${this.multiple && this.value.length\n ? html`\n <button\n class=\"clear-multiple\"\n aria-label=\"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 id=\"options\"\n class=${classMap({\n options: true,\n open: this.open,\n upwards: this._openUpwards,\n })}\n style=\"min-width: ${this.menuMinWidth};\"\n aria-labelledby=\"label-${this.name}\"\n name=${this.name}\n role=\"listbox\"\n tabindex=\"0\"\n aria-expanded=${this.open}\n aria-hidden=${!this.open}\n @keydown=${(e: any) => this.handleListKeydown(e)}\n @blur=${(e: any) => this.handleListBlur(e)}\n >\n ${this.multiple && this.selectAll\n ? html`\n <kyn-dropdown-option\n class=\"select-all\"\n value=\"selectAll\"\n multiple\n ?selected=${this.selectAllChecked}\n ?indeterminate=${this.selectAllIndeterminate}\n ?disabled=${this.disabled}\n >\n ${this.selectAllText}\n </kyn-dropdown-option>\n `\n : null}\n\n <slot\n id=\"children\"\n @slotchange=${() => this.handleSlotChange()}\n ></slot>\n </ul>\n </div>\n\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 <!--\n ${this.isInvalid\n ? html` <kd-icon class=\"error-icon\" .icon=${errorIcon}></kd-icon> `\n : null}\n -->\n </div>\n\n ${this.multiple && !this.hideTags && this.value.length\n ? html`\n <kyn-tag-group filter>\n ${this._tags.map((tag: any) => {\n return html`\n <kyn-tag\n label=${tag.text}\n ?disabled=${this.disabled}\n @on-close=${() => this.handleTagClear(tag.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 if (!this.disabled) {\n this.open = !this.open;\n\n if (this.searchable) {\n this.searchEl.focus();\n } else {\n this.buttonEl.focus();\n }\n }\n }\n\n private handleButtonKeydown(e: any) {\n this.handleKeyboard(e, e.keyCode, 'button');\n }\n\n private handleListKeydown(e: any) {\n const TAB_KEY_CODE = 9;\n\n if (e.keyCode !== TAB_KEY_CODE) {\n e.preventDefault();\n }\n\n this.handleKeyboard(e, e.keyCode, 'list');\n }\n\n private handleListBlur(e: any) {\n this.options.forEach((option) => (option.highlighted = false));\n\n // don't blur if clicking an option inside\n if (\n e.relatedTarget &&\n e.relatedTarget.localName !== 'kyn-dropdown-option'\n ) {\n this.open = false;\n }\n this.assistiveText = 'Dropdown menu options.';\n }\n\n private handleKeyboard(e: any, keyCode: number, target: string) {\n const SPACEBAR_KEY_CODE = [0, 32];\n const ENTER_KEY_CODE = 13;\n const DOWN_ARROW_KEY_CODE = 40;\n const UP_ARROW_KEY_CODE = 38;\n const ESCAPE_KEY_CODE = 27;\n\n // get highlighted element + index and selected element\n const visibleOptions = this.options.filter(\n (option: any) => option.style.display !== 'none'\n );\n const highlightedEl = visibleOptions.find(\n (option: any) => option.highlighted\n );\n const selectedEl = visibleOptions.find((option: any) => option.selected);\n const highlightedIndex = highlightedEl\n ? visibleOptions.indexOf(highlightedEl)\n : visibleOptions.find((option: any) => option.selected)\n ? visibleOptions.indexOf(selectedEl)\n : 0;\n\n // prevent page scroll on spacebar press\n if (SPACEBAR_KEY_CODE.includes(keyCode)) {\n e.preventDefault();\n }\n\n // 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 visibleOptions[highlightedIndex].highlighted = true;\n\n // scroll to highlighted option\n if (!this.multiple && this.value !== '') {\n visibleOptions[highlightedIndex].scrollIntoView({ block: 'nearest' });\n }\n }\n }\n\n switch (keyCode) {\n case ENTER_KEY_CODE: {\n // select highlighted option\n this.updateValue(\n visibleOptions[highlightedIndex].value,\n !visibleOptions[highlightedIndex].selected\n );\n this.assistiveText = 'Selected an item.';\n this.emitValue();\n return;\n }\n case DOWN_ARROW_KEY_CODE: {\n // go to next option\n let nextIndex =\n !highlightedEl && !selectedEl\n ? 0\n : highlightedIndex === visibleOptions.length - 1\n ? 0\n : highlightedIndex + 1;\n\n // skip disabled options\n if (visibleOptions[nextIndex].disabled) {\n nextIndex =\n nextIndex === visibleOptions.length - 1 ? 0 : nextIndex + 1;\n }\n\n visibleOptions[highlightedIndex].highlighted = false;\n visibleOptions[nextIndex].highlighted = true;\n\n // scroll to option\n visibleOptions[nextIndex].scrollIntoView({ block: 'nearest' });\n\n this.assistiveText = visibleOptions[nextIndex].text;\n return;\n }\n case UP_ARROW_KEY_CODE: {\n // go to previous option\n let nextIndex =\n highlightedIndex === 0\n ? visibleOptions.length - 1\n : highlightedIndex - 1;\n\n // skip disabled options\n if (visibleOptions[nextIndex].disabled) {\n nextIndex =\n nextIndex === 0 ? visibleOptions.length - 1 : nextIndex - 1;\n }\n\n visibleOptions[highlightedIndex].highlighted = false;\n visibleOptions[nextIndex].highlighted = true;\n\n // scroll to option\n visibleOptions[nextIndex].scrollIntoView({ block: 'nearest' });\n\n this.assistiveText = visibleOptions[nextIndex].text;\n return;\n }\n case ESCAPE_KEY_CODE: {\n // close listbox\n this.open = false;\n\n // restore focus\n if (this.searchable) {\n this.searchEl.focus();\n } else {\n this.buttonEl.focus();\n }\n\n this.assistiveText = 'Dropdown menu options.';\n return;\n }\n default: {\n return;\n }\n }\n }\n\n private handleClearMultiple(e: any) {\n e.stopPropagation();\n\n // clear values\n if (this.multiple) {\n this.value = [];\n } else {\n this.value = '';\n }\n\n this._validate(true, false);\n this._updateSelectedOptions();\n this.emitValue();\n\n const event = new CustomEvent('on-clear-all', {\n detail: {\n value: this.value,\n },\n });\n this.dispatchEvent(event);\n }\n\n private handleTagClear(value: string) {\n // remove value\n this.updateValue(value, false);\n this._updateSelectedOptions();\n this.emitValue();\n }\n\n private handleClear(e: any) {\n e.stopPropagation();\n\n // reset search input text\n this.text = '';\n this.searchText = '';\n this.searchEl.value = '';\n\n this._emitSearch();\n\n if (this.filterSearch) {\n // reveal all options\n this.options.map((option: any) => {\n option.style.display = 'block';\n });\n }\n\n // clear selection for single select\n if (!this.multiple) {\n this.value = '';\n this._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 // set value\n if (this.multiple) {\n const values =\n this.value === '' ? [] : JSON.parse(JSON.stringify(this.value));\n\n // update array\n if (selected) {\n values.push(value);\n } else {\n const index = values.indexOf(value);\n values.splice(index, 1);\n }\n\n this.value = values;\n } else {\n this.value = value;\n }\n\n this._validate(true, false);\n\n // reset focus\n if (!this.multiple) {\n if (this.searchable) {\n this.searchEl.focus();\n } else {\n this.buttonEl.focus();\n }\n }\n }\n\n private _validate(interacted: Boolean, report: Boolean) {\n // set validity flags\n const Validity = {\n customError: this.invalidText !== '',\n valueMissing:\n this.required &&\n (!this.value ||\n (this.multiple && !this.value.length) ||\n (!this.multiple && this.value === '')),\n };\n\n // set validationMessage\n const InternalMsg =\n this.required && !this.value.length ? 'Please fill out this field.' : '';\n const ValidationMessage =\n this.invalidText !== '' ? this.invalidText : InternalMsg;\n\n // set validity on custom element, anchor to buttonEl\n this.internals.setValidity(Validity, ValidationMessage, this.buttonEl);\n\n // set internal validation message if value was changed by user input\n if (interacted) {\n this.internalValidationMsg = InternalMsg;\n }\n\n // focus the buttonEl to show validity\n if (report) {\n this.internals.reportValidity();\n }\n }\n\n private emitValue() {\n const event = new CustomEvent('on-change', {\n detail: {\n value: this.value,\n },\n });\n this.dispatchEvent(event);\n }\n\n private _emitSearch() {\n const event = new CustomEvent('on-search', {\n detail: {\n searchText: this.searchText,\n },\n });\n this.dispatchEvent(event);\n }\n\n override 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 && this.text) {\n this.searchText = this.text === this.placeholder ? '' : this.text;\n this.searchEl.value = this.searchText;\n }\n }\n }\n\n if (changedProps.has('open')) {\n if (this.open && !this.searchable) {\n // focus listbox if not searchable\n this.listboxEl.focus({ preventScroll: true });\n this.assistiveText =\n 'Selecting items. Use up and down arrow keys to navigate.';\n }\n\n if (this.open) {\n if (!this.multiple) {\n // scroll to selected option\n this.options\n .find((option) => option.selected)\n ?.scrollIntoView({ block: 'nearest' });\n }\n\n // open dropdown upwards if closer to bottom of viewport\n const Threshold = 0.6;\n\n if (\n this.buttonEl.getBoundingClientRect().top >\n window.innerHeight * Threshold\n ) {\n this._openUpwards = true;\n } else {\n this._openUpwards = false;\n }\n }\n }\n\n if (changedProps.has('multiple')) {\n // set multiple for each option\n this.options.forEach((option: any) => {\n option.multiple = this.multiple;\n });\n }\n\n if (changedProps.has('searchText') && this.searchEl) {\n this.searchEl.value = this.searchText;\n }\n }\n\n private _updateOptions() {\n const Options: any = Array.from(\n this.querySelectorAll('kyn-dropdown-option')\n );\n const Tags: Array<object> = [];\n\n Options.forEach((option: any) => {\n // set option multiple state\n option.multiple = this.multiple;\n\n if (this.multiple) {\n const Selected = this.value.includes(option.value);\n // set option selected state\n option.selected = Selected;\n\n if (Selected) {\n // add selected options to Tags array\n Tags.push({\n value: option.value,\n text: option.textContent,\n });\n }\n } else {\n option.selected = this.value === option.value;\n }\n });\n\n this._tags = Tags;\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","_tags","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","tag","handleTagClear","firstUpdated","resetSelection","_updateOptions","_updateChildren","emitValue","focus","buttonEl","handleKeyboard","keyCode","forEach","option","highlighted","relatedTarget","localName","target","SPACEBAR_KEY_CODE","visibleOptions","filter","style","display","highlightedEl","find","selectedEl","selected","highlightedIndex","indexOf","includes","scrollIntoView","block","updateValue","nextIndex","stopPropagation","_validate","_updateSelectedOptions","event","CustomEvent","detail","dispatchEvent","_emitSearch","_a","classList","contains","_b","toLowerCase","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","Array","from","querySelectorAll","textContent","listboxEl","preventScroll","Threshold","getBoundingClientRect","top","window","innerHeight","Tags","Selected","Slot","styles","DropdownScss","shadowRootOptions","delegatesFocus","formAssociated","__decorate","state","prototype","property","type","Boolean","String","queryAssignedElements","selector","query","customElement"],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kyndryl-design-system/shidoka-applications",
3
- "version": "1.32.2",
3
+ "version": "1.32.4",
4
4
  "description": "Shidoka Web Components for Applications",
5
5
  "main": "index.js",
6
6
  "type": "module",