@kyndryl-design-system/shidoka-applications 2.58.2 → 2.58.3
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.
|
@@ -42,6 +42,10 @@ export declare class DropdownOption extends LitElement {
|
|
|
42
42
|
* @ignore
|
|
43
43
|
*/
|
|
44
44
|
accessor kind: 'ai' | 'default';
|
|
45
|
+
/** slotted icon added state.
|
|
46
|
+
* @ignore
|
|
47
|
+
*/
|
|
48
|
+
accessor hasIcon: boolean;
|
|
45
49
|
accessor role: string;
|
|
46
50
|
accessor ariaSelected: string;
|
|
47
51
|
render(): import("lit-html").TemplateResult<1>;
|
|
@@ -51,6 +55,7 @@ export declare class DropdownOption extends LitElement {
|
|
|
51
55
|
private handleSlotChange;
|
|
52
56
|
private handleClick;
|
|
53
57
|
private handleBlur;
|
|
58
|
+
private handleIconSlotChange;
|
|
54
59
|
}
|
|
55
60
|
declare global {
|
|
56
61
|
interface HTMLElementTagNameMap {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dropdownOption.d.ts","sourceRoot":"","sources":["../../../../src/components/reusable/dropdown/dropdownOption.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAmB,MAAM,KAAK,CAAC;AAIlD,OAAO,aAAa,CAAC;AACrB,OAAO,WAAW,CAAC;AAOnB;;;;;;GAMG;AACH,qBACa,cAAe,SAAQ,UAAU;IAC5C,OAAgB,MAAM,0BAAiC;IAEvD,oBAAoB;IAEpB,QAAQ,CAAC,KAAK,SAAM;IAEpB;;OAEG;IAEH,QAAQ,CAAC,QAAQ,UAAS;IAE1B,6BAA6B;IAE7B,QAAQ,CAAC,QAAQ,UAAS;IAE1B,mDAAmD;IAEnD,QAAQ,CAAC,cAAc,UAAS;IAEhC;;;OAGG;IAEH,QAAQ,CAAC,WAAW,UAAS;IAE7B;;OAEG;IAEH,QAAQ,CAAC,QAAQ,UAAS;IAE1B,wBAAwB;IAExB,QAAQ,CAAC,SAAS,UAAS;IAE3B;;;OAGG;IAEH,QAAQ,CAAC,IAAI,EAAE,GAAG,CAAM;IAExB,oEAAoE;IAEpE,QAAQ,CAAC,aAAa,UAAS;IAE/B;;OAEG;IAEH,QAAQ,CAAC,IAAI,EAAE,IAAI,GAAG,SAAS,CAAa;IAE5C,SACkB,IAAI,SAAY;IAElC,SACkB,YAAY,SAAY;IAEjC,MAAM;
|
|
1
|
+
{"version":3,"file":"dropdownOption.d.ts","sourceRoot":"","sources":["../../../../src/components/reusable/dropdown/dropdownOption.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAmB,MAAM,KAAK,CAAC;AAIlD,OAAO,aAAa,CAAC;AACrB,OAAO,WAAW,CAAC;AAOnB;;;;;;GAMG;AACH,qBACa,cAAe,SAAQ,UAAU;IAC5C,OAAgB,MAAM,0BAAiC;IAEvD,oBAAoB;IAEpB,QAAQ,CAAC,KAAK,SAAM;IAEpB;;OAEG;IAEH,QAAQ,CAAC,QAAQ,UAAS;IAE1B,6BAA6B;IAE7B,QAAQ,CAAC,QAAQ,UAAS;IAE1B,mDAAmD;IAEnD,QAAQ,CAAC,cAAc,UAAS;IAEhC;;;OAGG;IAEH,QAAQ,CAAC,WAAW,UAAS;IAE7B;;OAEG;IAEH,QAAQ,CAAC,QAAQ,UAAS;IAE1B,wBAAwB;IAExB,QAAQ,CAAC,SAAS,UAAS;IAE3B;;;OAGG;IAEH,QAAQ,CAAC,IAAI,EAAE,GAAG,CAAM;IAExB,oEAAoE;IAEpE,QAAQ,CAAC,aAAa,UAAS;IAE/B;;OAEG;IAEH,QAAQ,CAAC,IAAI,EAAE,IAAI,GAAG,SAAS,CAAa;IAE5C;;OAEG;IAEH,QAAQ,CAAC,OAAO,UAAS;IAEzB,SACkB,IAAI,SAAY;IAElC,SACkB,YAAY,SAAY;IAEjC,MAAM;IAsFN,YAAY;IAWZ,UAAU,CAAC,YAAY,EAAE,GAAG;IAMrC,OAAO,CAAC,iBAAiB;IAYzB,OAAO,CAAC,gBAAgB;IAYxB,OAAO,CAAC,WAAW;IA0BnB,OAAO,CAAC,UAAU;IAYlB,OAAO,CAAC,oBAAoB;CAI7B;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,qBAAqB,EAAE,cAAc,CAAC;KACvC;CACF"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{_ as e,a as t,b as i,c as
|
|
1
|
+
import{_ as e,a as t,b as i,c as n,d as o}from"../../../vendor/tslib-Ac8XvvSX.js";import{e as a,x as l,o as s}from"../../../vendor/lit-html-BRBT5o_V.js";import{i as r,a as d,t as c,r as m,n as h}from"../../../vendor/@lit/reactive-element-f91Vet7N.js";import{i as u}from"../../../vendor/lit-element-m-OqzV5s.js";import"../checkbox/checkbox.js";import"../checkbox/checkboxGroup.js";import"../checkbox/checkboxSubgroup.js";import"../button/button.js";import{h as v,c as g}from"../../../vendor/@kyndryl-design-system/shidoka-icons-bi0_OAYf.js";import"../../../vendor/deepmerge-ts-OFb5ej8y.js";import"../../../common/mixins/form-input.js";import"../textInput/textInput.js";import"../../../common/helpers/helpers.js";import"../button/defs.js";var b=r`*,
|
|
2
2
|
*::before,
|
|
3
3
|
*::after {
|
|
4
4
|
box-sizing: border-box;
|
|
@@ -181,7 +181,7 @@ import{_ as e,a as t,b as i,c as o,d as n}from"../../../vendor/tslib-Ac8XvvSX.js
|
|
|
181
181
|
|
|
182
182
|
.option {
|
|
183
183
|
cursor: default;
|
|
184
|
-
padding:
|
|
184
|
+
padding: 16px;
|
|
185
185
|
height: 48px;
|
|
186
186
|
transition: background-color 150ms ease-out;
|
|
187
187
|
display: flex;
|
|
@@ -205,6 +205,7 @@ import{_ as e,a as t,b as i,c as o,d as n}from"../../../vendor/tslib-Ac8XvvSX.js
|
|
|
205
205
|
}
|
|
206
206
|
.option slot[name=icon]::slotted(span) {
|
|
207
207
|
display: flex;
|
|
208
|
+
padding: 0.5rem 0.5rem 0.5rem 0;
|
|
208
209
|
}
|
|
209
210
|
|
|
210
211
|
kyn-checkbox {
|
|
@@ -219,7 +220,7 @@ kyn-checkbox {
|
|
|
219
220
|
}
|
|
220
221
|
.remove-option .clear-icon {
|
|
221
222
|
padding-top: 0.25rem;
|
|
222
|
-
}`;let k=(()=>{var r,k,p,f,x,w,y,$,S,j,M
|
|
223
|
+
}`;let k=(()=>{var r,k,p,f,x,w,y,$,S,j,C,I,M;let W,O,E,B,A,P,D,z,N,R,U,F,G,L,_,q=[c("kyn-dropdown-option")],H=[],J=u,K=[],Q=[],T=[],V=[],X=[],Y=[],Z=[],ee=[],te=[],ie=[],ne=[],oe=[],ae=[],le=[],se=[],re=[],de=[],ce=[],me=[],he=[],ue=[],ve=[],ge=[],be=[],ke=[],pe=[];return O=class extends J{get value(){return n(this,r,"f")}set value(e){o(this,r,e,"f")}get selected(){return n(this,k,"f")}set selected(e){o(this,k,e,"f")}get disabled(){return n(this,p,"f")}set disabled(e){o(this,p,e,"f")}get allowAddOption(){return n(this,f,"f")}set allowAddOption(e){o(this,f,e,"f")}get highlighted(){return n(this,x,"f")}set highlighted(e){o(this,x,e,"f")}get multiple(){return n(this,w,"f")}set multiple(e){o(this,w,e,"f")}get removable(){return n(this,y,"f")}set removable(e){o(this,y,e,"f")}get text(){return n(this,$,"f")}set text(e){o(this,$,e,"f")}get indeterminate(){return n(this,S,"f")}set indeterminate(e){o(this,S,e,"f")}get kind(){return n(this,j,"f")}set kind(e){o(this,j,e,"f")}get hasIcon(){return n(this,C,"f")}set hasIcon(e){o(this,C,e,"f")}get role(){return n(this,I,"f")}set role(e){o(this,I,e,"f")}get ariaSelected(){return n(this,M,"f")}set ariaSelected(e){o(this,M,e,"f")}render(){const e={option:!0,"menu-item":!0,[`ai-connected-${"ai"===this.kind}`]:!0};return l`
|
|
223
224
|
<div
|
|
224
225
|
class=${a(e)}
|
|
225
226
|
?highlighted=${this.highlighted}
|
|
@@ -253,10 +254,17 @@ kyn-checkbox {
|
|
|
253
254
|
></slot>
|
|
254
255
|
`}
|
|
255
256
|
</span>
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
257
|
+
${this.hasIcon?l`<slot
|
|
258
|
+
name="icon"
|
|
259
|
+
style="display:flex"
|
|
260
|
+
@slotchange=${e=>this.handleIconSlotChange(e)}
|
|
261
|
+
></slot>`:l`
|
|
262
|
+
<slot
|
|
263
|
+
name="icon"
|
|
264
|
+
style="display:none"
|
|
265
|
+
@slotchange=${e=>this.handleIconSlotChange(e)}
|
|
266
|
+
></slot>
|
|
267
|
+
`}
|
|
260
268
|
${this.selected&&!this.multiple?l`
|
|
261
269
|
<span class="menu-item-inner-el check-icon"
|
|
262
270
|
>${s(v)}</span
|
|
@@ -275,10 +283,10 @@ kyn-checkbox {
|
|
|
275
283
|
@focus=${e=>e.stopPropagation()}
|
|
276
284
|
>
|
|
277
285
|
<span slot="icon" class="clear-icon">
|
|
278
|
-
${s(
|
|
286
|
+
${s(g)}
|
|
279
287
|
</span>
|
|
280
288
|
</kyn-button>
|
|
281
289
|
`:null}
|
|
282
290
|
</div>
|
|
283
|
-
`}firstUpdated(){const e=this.closest("kyn-dropdown");e&&(this.kind=e.kind,e.addEventListener("kind-changed",(e=>{this.kind=e.detail})))}willUpdate(e){e.has("selected")&&(this.ariaSelected=this.selected.toString())}handleRemoveClick(e){e.stopPropagation();const t=new CustomEvent("on-remove-option",{bubbles:!0,composed:!0,detail:{value:this.value}});this.dispatchEvent(t)}handleSlotChange(e){const t=e.target.assignedNodes({flatten:!0});let i="";for(let e=0;e<t.length;e++)i+=t[e].textContent.trim();this.text=i}handleClick(e){if(this.disabled)return;this.multiple?this.selected=!this.selected:this.selected=!0;const t=new CustomEvent("on-click",{bubbles:!0,composed:!0,detail:{selected:this.selected,value:this.value,origEvent:e}});this.dispatchEvent(t)}handleBlur(e){const t=new CustomEvent("on-blur",{bubbles:!0,composed:!0,detail:{origEvent:e}});this.dispatchEvent(t)}constructor(){super(...arguments),r.set(this,i(this,
|
|
291
|
+
`}firstUpdated(){const e=this.closest("kyn-dropdown");e&&(this.kind=e.kind,e.addEventListener("kind-changed",(e=>{this.kind=e.detail})))}willUpdate(e){e.has("selected")&&(this.ariaSelected=this.selected.toString())}handleRemoveClick(e){e.stopPropagation();const t=new CustomEvent("on-remove-option",{bubbles:!0,composed:!0,detail:{value:this.value}});this.dispatchEvent(t)}handleSlotChange(e){const t=e.target.assignedNodes({flatten:!0});let i="";for(let e=0;e<t.length;e++)i+=t[e].textContent.trim();this.text=i}handleClick(e){if(this.disabled)return;this.multiple?this.selected=!this.selected:this.selected=!0;const t=new CustomEvent("on-click",{bubbles:!0,composed:!0,detail:{selected:this.selected,value:this.value,origEvent:e}});this.dispatchEvent(t)}handleBlur(e){const t=new CustomEvent("on-blur",{bubbles:!0,composed:!0,detail:{origEvent:e}});this.dispatchEvent(t)}handleIconSlotChange(e){const t=e.target.assignedNodes({flatten:!0});this.hasIcon=t.length>0}constructor(){super(...arguments),r.set(this,i(this,K,"")),k.set(this,(i(this,Q),i(this,T,!1))),p.set(this,(i(this,V),i(this,X,!1))),f.set(this,(i(this,Y),i(this,Z,!1))),x.set(this,(i(this,ee),i(this,te,!1))),w.set(this,(i(this,ie),i(this,ne,!1))),y.set(this,(i(this,oe),i(this,ae,!1))),$.set(this,(i(this,le),i(this,se,""))),S.set(this,(i(this,re),i(this,de,!1))),j.set(this,(i(this,ce),i(this,me,"default"))),C.set(this,(i(this,he),i(this,ue,!1))),I.set(this,(i(this,ve),i(this,ge,"option"))),M.set(this,(i(this,be),i(this,ke,"option"))),i(this,pe)}},r=new WeakMap,k=new WeakMap,p=new WeakMap,f=new WeakMap,x=new WeakMap,w=new WeakMap,y=new WeakMap,$=new WeakMap,S=new WeakMap,j=new WeakMap,C=new WeakMap,I=new WeakMap,M=new WeakMap,e(O,"DropdownOption"),(()=>{var e;const i="function"==typeof Symbol&&Symbol.metadata?Object.create(null!==(e=J[Symbol.metadata])&&void 0!==e?e:null):void 0;E=[h({type:String})],B=[h({type:Boolean})],A=[h({type:Boolean})],P=[h({type:Boolean})],D=[d()],z=[h({type:Boolean})],N=[h({type:Boolean})],R=[d()],U=[h({type:Boolean,reflect:!0})],F=[d()],G=[d()],L=[h({type:String,reflect:!0})],_=[h({type:String,reflect:!0,attribute:"aria-selected"})],t(O,null,E,{kind:"accessor",name:"value",static:!1,private:!1,access:{has:e=>"value"in e,get:e=>e.value,set:(e,t)=>{e.value=t}},metadata:i},K,Q),t(O,null,B,{kind:"accessor",name:"selected",static:!1,private:!1,access:{has:e=>"selected"in e,get:e=>e.selected,set:(e,t)=>{e.selected=t}},metadata:i},T,V),t(O,null,A,{kind:"accessor",name:"disabled",static:!1,private:!1,access:{has:e=>"disabled"in e,get:e=>e.disabled,set:(e,t)=>{e.disabled=t}},metadata:i},X,Y),t(O,null,P,{kind:"accessor",name:"allowAddOption",static:!1,private:!1,access:{has:e=>"allowAddOption"in e,get:e=>e.allowAddOption,set:(e,t)=>{e.allowAddOption=t}},metadata:i},Z,ee),t(O,null,D,{kind:"accessor",name:"highlighted",static:!1,private:!1,access:{has:e=>"highlighted"in e,get:e=>e.highlighted,set:(e,t)=>{e.highlighted=t}},metadata:i},te,ie),t(O,null,z,{kind:"accessor",name:"multiple",static:!1,private:!1,access:{has:e=>"multiple"in e,get:e=>e.multiple,set:(e,t)=>{e.multiple=t}},metadata:i},ne,oe),t(O,null,N,{kind:"accessor",name:"removable",static:!1,private:!1,access:{has:e=>"removable"in e,get:e=>e.removable,set:(e,t)=>{e.removable=t}},metadata:i},ae,le),t(O,null,R,{kind:"accessor",name:"text",static:!1,private:!1,access:{has:e=>"text"in e,get:e=>e.text,set:(e,t)=>{e.text=t}},metadata:i},se,re),t(O,null,U,{kind:"accessor",name:"indeterminate",static:!1,private:!1,access:{has:e=>"indeterminate"in e,get:e=>e.indeterminate,set:(e,t)=>{e.indeterminate=t}},metadata:i},de,ce),t(O,null,F,{kind:"accessor",name:"kind",static:!1,private:!1,access:{has:e=>"kind"in e,get:e=>e.kind,set:(e,t)=>{e.kind=t}},metadata:i},me,he),t(O,null,G,{kind:"accessor",name:"hasIcon",static:!1,private:!1,access:{has:e=>"hasIcon"in e,get:e=>e.hasIcon,set:(e,t)=>{e.hasIcon=t}},metadata:i},ue,ve),t(O,null,L,{kind:"accessor",name:"role",static:!1,private:!1,access:{has:e=>"role"in e,get:e=>e.role,set:(e,t)=>{e.role=t}},metadata:i},ge,be),t(O,null,_,{kind:"accessor",name:"ariaSelected",static:!1,private:!1,access:{has:e=>"ariaSelected"in e,get:e=>e.ariaSelected,set:(e,t)=>{e.ariaSelected=t}},metadata:i},ke,pe),t(null,W={value:O},q,{kind:"class",name:O.name,metadata:i},null,H),O=W.value,i&&Object.defineProperty(O,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:i})})(),O.styles=m(b),i(O,H),O})();export{k as DropdownOption};
|
|
284
292
|
//# sourceMappingURL=dropdownOption.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dropdownOption.js","sources":["../../../../src/components/reusable/dropdown/dropdownOption.ts"],"sourcesContent":["import { unsafeSVG } from 'lit-html/directives/unsafe-svg.js';\nimport { LitElement, html, unsafeCSS } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\n\nimport '../checkbox';\nimport '../button';\n\nimport checkIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/16/check.svg';\nimport clearIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/16/close-simple.svg';\n\nimport DropdownOptionScss from './dropdownOption.scss?inline';\n\n/**\n * Dropdown option.\n * @fires on-click - Emits the option details to the parent dropdown. `detail:{ selected: boolean, value: string, origEvent: PointerEvent }`\n * @fires on-remove-option - Emits the option that is removed. `detail:{ value: string }`\n * @slot unnamed - Slot for option text.\n * @slot icon - Slot for option icon. Icon size should be 16px only.\n */\n@customElement('kyn-dropdown-option')\nexport class DropdownOption extends LitElement {\n static override styles = unsafeCSS(DropdownOptionScss);\n\n /** Option value. */\n @property({ type: String })\n accessor value = '';\n\n /** Internal text strings.\n * @internal\n */\n @property({ type: Boolean })\n accessor selected = false;\n\n /** Option disabled state. */\n @property({ type: Boolean })\n accessor disabled = false;\n\n /** Allow Add Option state, derived from parent. */\n @property({ type: Boolean })\n accessor allowAddOption = false;\n\n /**\n * Option highlighted state for keyboard navigation, automatically derived.\n * @ignore\n */\n @state()\n accessor highlighted = false;\n\n /** Multi-select state, derived from parent.\n * @ignore\n */\n @property({ type: Boolean })\n accessor multiple = false;\n\n /** Removable option. */\n @property({ type: Boolean })\n accessor removable = false;\n\n /**\n * Option text, automatically derived.\n * @ignore\n */\n @state()\n accessor text: any = '';\n\n /** Determines whether the checkbox is in an indeterminate state. */\n @property({ type: Boolean, reflect: true })\n accessor indeterminate = false;\n\n /** Kind of the item, derived from parent.\n * @ignore\n */\n @state()\n accessor kind: 'ai' | 'default' = 'default';\n\n @property({ type: String, reflect: true })\n override accessor role = 'option';\n\n @property({ type: String, reflect: true, attribute: 'aria-selected' })\n override accessor ariaSelected = 'option';\n\n override render() {\n const classes = {\n option: true,\n 'menu-item': true,\n [`ai-connected-${this.kind === 'ai'}`]: true,\n };\n\n return html`\n <div\n class=${classMap(classes)}\n ?highlighted=${this.highlighted}\n ?selected=${this.selected}\n ?disabled=${this.disabled}\n aria-disabled=${this.disabled}\n ?multiple=${this.multiple}\n title=${this.text}\n @pointerup=${(e: any) => this.handleClick(e)}\n @blur=${(e: any) => this.handleBlur(e)}\n >\n <span class=\"menu-item-inner-el text\">\n ${this.multiple\n ? html`\n <kyn-checkbox\n type=\"checkbox\"\n value=${this.value}\n .checked=${this.selected}\n ?checked=${this.selected}\n ?disabled=${this.disabled}\n notFocusable\n .indeterminate=${this.indeterminate}\n >\n </kyn-checkbox>\n\n <slot\n @slotchange=${(e: any) => this.handleSlotChange(e)}\n ></slot>\n `\n : html`\n <slot\n @slotchange=${(e: any) => this.handleSlotChange(e)}\n ></slot>\n `}\n </span>\n\n <span class=\"menu-item-inner-el icon\"\n ><slot name=\"icon\" style=\"display:flex\"></slot\n ></span>\n ${this.selected && !this.multiple\n ? html`\n <span class=\"menu-item-inner-el check-icon\"\n >${unsafeSVG(checkIcon)}</span\n >\n `\n : this.allowAddOption && this.removable\n ? html`\n <kyn-button\n class=\"remove-option\"\n kind=\"ghost\"\n size=\"small\"\n aria-label=\"Delete ${this.value}\"\n description=\"Delete ${this.value}\"\n ?disabled=${this.disabled}\n @click=${(e: Event) => this.handleRemoveClick(e)}\n @mousedown=${(e: Event) => e.stopPropagation()}\n @keydown=${(e: KeyboardEvent) => e.stopPropagation()}\n @focus=${(e: KeyboardEvent) => e.stopPropagation()}\n >\n <span slot=\"icon\" class=\"clear-icon\">\n ${unsafeSVG(clearIcon)}\n </span>\n </kyn-button>\n `\n : null}\n </div>\n `;\n }\n\n override firstUpdated() {\n const parent = this.closest('kyn-dropdown') as any;\n if (parent) {\n this.kind = parent.kind;\n\n parent.addEventListener('kind-changed', (e: Event) => {\n this.kind = (e as CustomEvent<'ai' | 'default'>).detail;\n });\n }\n }\n\n override willUpdate(changedProps: any) {\n if (changedProps.has('selected')) {\n this.ariaSelected = this.selected.toString();\n }\n }\n\n private handleRemoveClick(e: Event) {\n e.stopPropagation();\n const event = new CustomEvent('on-remove-option', {\n bubbles: true,\n composed: true,\n detail: {\n value: this.value,\n },\n });\n this.dispatchEvent(event);\n }\n\n private handleSlotChange(e: any) {\n // set text prop from slotted text, for ease of access\n const nodes = e.target.assignedNodes({ flatten: true });\n let text = '';\n\n for (let i = 0; i < nodes.length; i++) {\n text += nodes[i].textContent.trim();\n }\n\n this.text = text;\n }\n\n private handleClick(e: Event) {\n // prevent click if disabled\n if (this.disabled) {\n return;\n }\n\n // update selected state\n if (this.multiple) {\n this.selected = !this.selected;\n } else {\n this.selected = true;\n }\n\n // emit selected value, bubble so it can be captured by the parent dropdown\n const event = new CustomEvent('on-click', {\n bubbles: true,\n composed: true,\n detail: {\n selected: this.selected,\n value: this.value,\n origEvent: e,\n },\n });\n this.dispatchEvent(event);\n }\n\n private handleBlur(e: any) {\n // emit blur event, bubble so it can be captured by the parent dropdown\n const event = new CustomEvent('on-blur', {\n bubbles: true,\n composed: true,\n detail: {\n origEvent: e,\n },\n });\n this.dispatchEvent(event);\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'kyn-dropdown-option': DropdownOption;\n }\n}\n"],"names":["DropdownOption","customElement","LitElement","_classThis","_classSuper","value","__classPrivateFieldGet","this","_DropdownOption_value_accessor_storage","__classPrivateFieldSet","selected","_DropdownOption_selected_accessor_storage","disabled","_DropdownOption_disabled_accessor_storage","allowAddOption","_DropdownOption_allowAddOption_accessor_storage","highlighted","_DropdownOption_highlighted_accessor_storage","multiple","_DropdownOption_multiple_accessor_storage","removable","_DropdownOption_removable_accessor_storage","text","_DropdownOption_text_accessor_storage","indeterminate","_DropdownOption_indeterminate_accessor_storage","kind","_DropdownOption_kind_accessor_storage","role","_DropdownOption_role_accessor_storage","ariaSelected","_DropdownOption_ariaSelected_accessor_storage","render","classes","option","html","classMap","e","handleClick","handleBlur","handleSlotChange","unsafeSVG","checkIcon","handleRemoveClick","stopPropagation","clearIcon","firstUpdated","parent","closest","addEventListener","detail","willUpdate","changedProps","has","toString","event","CustomEvent","bubbles","composed","dispatchEvent","nodes","target","assignedNodes","flatten","i","length","textContent","trim","origEvent","set","__runInitializers","_value_initializers","_value_extraInitializers","_selected_initializers","_selected_extraInitializers","_disabled_initializers","_disabled_extraInitializers","_allowAddOption_initializers","_allowAddOption_extraInitializers","_highlighted_initializers","_highlighted_extraInitializers","_multiple_initializers","_multiple_extraInitializers","_removable_initializers","_removable_extraInitializers","_text_initializers","_text_extraInitializers","_indeterminate_initializers","_indeterminate_extraInitializers","_kind_initializers","_kind_extraInitializers","_role_initializers","_role_extraInitializers","_ariaSelected_initializers","_value_decorators","property","type","String","_selected_decorators","Boolean","_disabled_decorators","_allowAddOption_decorators","_highlighted_decorators","state","_multiple_decorators","_removable_decorators","_text_decorators","reflect","_kind_decorators","_ariaSelected_decorators","attribute","__esDecorate","name","static","private","access","obj","get","metadata","_metadata","_indeterminate_decorators","_role_decorators","_ariaSelected_extraInitializers","_classDescriptor","_classDecorators","_classExtraInitializers","styles","unsafeCSS","DropdownOptionScss"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"dropdownOption.js","sources":["../../../../src/components/reusable/dropdown/dropdownOption.ts"],"sourcesContent":["import { unsafeSVG } from 'lit-html/directives/unsafe-svg.js';\nimport { LitElement, html, unsafeCSS } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\n\nimport '../checkbox';\nimport '../button';\n\nimport checkIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/16/check.svg';\nimport clearIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/16/close-simple.svg';\n\nimport DropdownOptionScss from './dropdownOption.scss?inline';\n\n/**\n * Dropdown option.\n * @fires on-click - Emits the option details to the parent dropdown. `detail:{ selected: boolean, value: string, origEvent: PointerEvent }`\n * @fires on-remove-option - Emits the option that is removed. `detail:{ value: string }`\n * @slot unnamed - Slot for option text.\n * @slot icon - Slot for option icon. Icon size should be 16px only.\n */\n@customElement('kyn-dropdown-option')\nexport class DropdownOption extends LitElement {\n static override styles = unsafeCSS(DropdownOptionScss);\n\n /** Option value. */\n @property({ type: String })\n accessor value = '';\n\n /** Internal text strings.\n * @internal\n */\n @property({ type: Boolean })\n accessor selected = false;\n\n /** Option disabled state. */\n @property({ type: Boolean })\n accessor disabled = false;\n\n /** Allow Add Option state, derived from parent. */\n @property({ type: Boolean })\n accessor allowAddOption = false;\n\n /**\n * Option highlighted state for keyboard navigation, automatically derived.\n * @ignore\n */\n @state()\n accessor highlighted = false;\n\n /** Multi-select state, derived from parent.\n * @ignore\n */\n @property({ type: Boolean })\n accessor multiple = false;\n\n /** Removable option. */\n @property({ type: Boolean })\n accessor removable = false;\n\n /**\n * Option text, automatically derived.\n * @ignore\n */\n @state()\n accessor text: any = '';\n\n /** Determines whether the checkbox is in an indeterminate state. */\n @property({ type: Boolean, reflect: true })\n accessor indeterminate = false;\n\n /** Kind of the item, derived from parent.\n * @ignore\n */\n @state()\n accessor kind: 'ai' | 'default' = 'default';\n\n /** slotted icon added state.\n * @ignore\n */\n @state()\n accessor hasIcon = false;\n\n @property({ type: String, reflect: true })\n override accessor role = 'option';\n\n @property({ type: String, reflect: true, attribute: 'aria-selected' })\n override accessor ariaSelected = 'option';\n\n override render() {\n const classes = {\n option: true,\n 'menu-item': true,\n [`ai-connected-${this.kind === 'ai'}`]: true,\n };\n\n return html`\n <div\n class=${classMap(classes)}\n ?highlighted=${this.highlighted}\n ?selected=${this.selected}\n ?disabled=${this.disabled}\n aria-disabled=${this.disabled}\n ?multiple=${this.multiple}\n title=${this.text}\n @pointerup=${(e: any) => this.handleClick(e)}\n @blur=${(e: any) => this.handleBlur(e)}\n >\n <span class=\"menu-item-inner-el text\">\n ${this.multiple\n ? html`\n <kyn-checkbox\n type=\"checkbox\"\n value=${this.value}\n .checked=${this.selected}\n ?checked=${this.selected}\n ?disabled=${this.disabled}\n notFocusable\n .indeterminate=${this.indeterminate}\n >\n </kyn-checkbox>\n\n <slot\n @slotchange=${(e: any) => this.handleSlotChange(e)}\n ></slot>\n `\n : html`\n <slot\n @slotchange=${(e: any) => this.handleSlotChange(e)}\n ></slot>\n `}\n </span>\n ${this.hasIcon\n ? html`<slot\n name=\"icon\"\n style=\"display:flex\"\n @slotchange=${(e: any) => this.handleIconSlotChange(e)}\n ></slot>`\n : html`\n <slot\n name=\"icon\"\n style=\"display:none\"\n @slotchange=${(e: any) => this.handleIconSlotChange(e)}\n ></slot>\n `}\n ${this.selected && !this.multiple\n ? html`\n <span class=\"menu-item-inner-el check-icon\"\n >${unsafeSVG(checkIcon)}</span\n >\n `\n : this.allowAddOption && this.removable\n ? html`\n <kyn-button\n class=\"remove-option\"\n kind=\"ghost\"\n size=\"small\"\n aria-label=\"Delete ${this.value}\"\n description=\"Delete ${this.value}\"\n ?disabled=${this.disabled}\n @click=${(e: Event) => this.handleRemoveClick(e)}\n @mousedown=${(e: Event) => e.stopPropagation()}\n @keydown=${(e: KeyboardEvent) => e.stopPropagation()}\n @focus=${(e: KeyboardEvent) => e.stopPropagation()}\n >\n <span slot=\"icon\" class=\"clear-icon\">\n ${unsafeSVG(clearIcon)}\n </span>\n </kyn-button>\n `\n : null}\n </div>\n `;\n }\n\n override firstUpdated() {\n const parent = this.closest('kyn-dropdown') as any;\n if (parent) {\n this.kind = parent.kind;\n\n parent.addEventListener('kind-changed', (e: Event) => {\n this.kind = (e as CustomEvent<'ai' | 'default'>).detail;\n });\n }\n }\n\n override willUpdate(changedProps: any) {\n if (changedProps.has('selected')) {\n this.ariaSelected = this.selected.toString();\n }\n }\n\n private handleRemoveClick(e: Event) {\n e.stopPropagation();\n const event = new CustomEvent('on-remove-option', {\n bubbles: true,\n composed: true,\n detail: {\n value: this.value,\n },\n });\n this.dispatchEvent(event);\n }\n\n private handleSlotChange(e: any) {\n // set text prop from slotted text, for ease of access\n const nodes = e.target.assignedNodes({ flatten: true });\n let text = '';\n\n for (let i = 0; i < nodes.length; i++) {\n text += nodes[i].textContent.trim();\n }\n\n this.text = text;\n }\n\n private handleClick(e: Event) {\n // prevent click if disabled\n if (this.disabled) {\n return;\n }\n\n // update selected state\n if (this.multiple) {\n this.selected = !this.selected;\n } else {\n this.selected = true;\n }\n\n // emit selected value, bubble so it can be captured by the parent dropdown\n const event = new CustomEvent('on-click', {\n bubbles: true,\n composed: true,\n detail: {\n selected: this.selected,\n value: this.value,\n origEvent: e,\n },\n });\n this.dispatchEvent(event);\n }\n\n private handleBlur(e: any) {\n // emit blur event, bubble so it can be captured by the parent dropdown\n const event = new CustomEvent('on-blur', {\n bubbles: true,\n composed: true,\n detail: {\n origEvent: e,\n },\n });\n this.dispatchEvent(event);\n }\n\n private handleIconSlotChange(e: any) {\n const nodes = e.target.assignedNodes({ flatten: true });\n this.hasIcon = nodes.length > 0;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'kyn-dropdown-option': DropdownOption;\n }\n}\n"],"names":["DropdownOption","customElement","LitElement","_classThis","_classSuper","value","__classPrivateFieldGet","this","_DropdownOption_value_accessor_storage","__classPrivateFieldSet","selected","_DropdownOption_selected_accessor_storage","disabled","_DropdownOption_disabled_accessor_storage","allowAddOption","_DropdownOption_allowAddOption_accessor_storage","highlighted","_DropdownOption_highlighted_accessor_storage","multiple","_DropdownOption_multiple_accessor_storage","removable","_DropdownOption_removable_accessor_storage","text","_DropdownOption_text_accessor_storage","indeterminate","_DropdownOption_indeterminate_accessor_storage","kind","_DropdownOption_kind_accessor_storage","hasIcon","_DropdownOption_hasIcon_accessor_storage","role","_DropdownOption_role_accessor_storage","ariaSelected","_DropdownOption_ariaSelected_accessor_storage","render","classes","option","html","classMap","e","handleClick","handleBlur","handleSlotChange","handleIconSlotChange","unsafeSVG","checkIcon","handleRemoveClick","stopPropagation","clearIcon","firstUpdated","parent","closest","addEventListener","detail","willUpdate","changedProps","has","toString","event","CustomEvent","bubbles","composed","dispatchEvent","nodes","target","assignedNodes","flatten","i","length","textContent","trim","origEvent","set","__runInitializers","_value_initializers","_value_extraInitializers","_selected_initializers","_selected_extraInitializers","_disabled_initializers","_disabled_extraInitializers","_allowAddOption_initializers","_allowAddOption_extraInitializers","_highlighted_initializers","_highlighted_extraInitializers","_multiple_initializers","_multiple_extraInitializers","_removable_initializers","_removable_extraInitializers","_text_initializers","_text_extraInitializers","_indeterminate_initializers","_indeterminate_extraInitializers","_kind_initializers","_kind_extraInitializers","_hasIcon_initializers","_hasIcon_extraInitializers","_role_initializers","_role_extraInitializers","_ariaSelected_initializers","_value_decorators","property","type","String","_selected_decorators","Boolean","_disabled_decorators","_allowAddOption_decorators","_highlighted_decorators","state","_multiple_decorators","_removable_decorators","_text_decorators","reflect","_kind_decorators","_hasIcon_decorators","_ariaSelected_decorators","attribute","__esDecorate","name","static","private","access","obj","get","metadata","_metadata","_indeterminate_decorators","_role_decorators","_ariaSelected_extraInitializers","_classDescriptor","_classDecorators","_classExtraInitializers","styles","unsafeCSS","DropdownOptionScss"],"mappings":"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"}
|