@cas-smartdesign/token-selector 1.0.2 → 1.0.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.
- package/dist/docs/button.mjs +1 -1
- package/dist/docs/doc.mjs +28 -28
- package/dist/token-selector-with-externals.js +2 -2
- package/dist/token-selector-with-externals.js.map +3 -3
- package/dist/token-selector.d.ts +2 -0
- package/dist/token-selector.mjs +16 -9
- package/dist/token-selector.mjs.map +1 -1
- package/npm-third-party-licenses.json +5 -0
- package/package.json +6 -6
|
@@ -71,7 +71,7 @@ var window;(window||={})["@cas-smartdesign/token-selector"]=(()=>{var ii=Object.
|
|
|
71
71
|
</sd-field-validation-message>
|
|
72
72
|
`}
|
|
73
73
|
</div>
|
|
74
|
-
`}updated(e){super.updated(e),this._needsAutocompletedCheck&&!this.autocompleted&&setTimeout(()=>{try{this.autocompleted=this.autocompleted||!!this.shadowRoot.querySelector(":-webkit-autofill")}catch{}},0),this.rows>1&&((e.has("min")||e.has("max")||e.has("pattern"))&&console.warn("min, max & pattern attributes are not supported with multiple rows configuration."),this.type!="text"&&console.warn(`type: ${this.type} is not supported with multiple rows configuration.`))}update(e){if(super.update(e),e.has("validationMessage")&&(this.validationMessage?this._internals?.setValidity({customError:!0},this.validationMessage):this._internals?.setValidity(this.inputElement.validity,this.inputElement.validationMessage)),this._initialized&&e.has("rows"))throw Error("rows attribute cannot be changed after the input is attached to the DOM")}fireValueChange(e){this.dispatchEvent(new CustomEvent(`${e?"immediate-":""}value-change`,{detail:{value:this.value}})),this.setFormValue(this.value)}updateFormValidity(){if(this.validationMessage==null&&this.inputElement!=null){this._internals.setValidity(this.inputElement.validity,this.inputElement.validationMessage);let e=this.shadowRoot.querySelector("sd-field-validation-message");this.requestUpdate("validationMessage",e==null?null:e.message)}}shouldFloat(){return this.alwaysFloatLabel||this.currentText||this.placeholder||this.autocompleted||this.type==="date"}setFormValue(e){this._internals?.setFormValue(e),this.updateFormValidity()}formResetCallback(){this.value=this._initialValue}formDisabledCallback(e){this.effectiveDisabled=e||this.hasAttribute("disabled")}formAssociatedCallback(e){this._needsAutocompletedCheck=!0}formStateRestoreCallback(e,t){typeof e=="string"&&(this.value=e)}},nt.ID=vo,nt.DEFAULT_MAX_LENGTH=524288,nt.formAssociated=!0,nt.shadowRootOptions={...D.shadowRootOptions,delegatesFocus:rs},nt);$([h({type:String,reflect:!0})],k.prototype,"label");$([h({type:String,attribute:!0})],k.prototype,"validationMessage");$([h({type:String,attribute:!0})],k.prototype,"validationIconSrc");$([h({type:ue,attribute:!0,reflect:!0})],k.prototype,"validationLevel");$([h({type:String,hasChanged(e,t){return t!=null&&t!=e}})],k.prototype,"currentText");$([h({type:Boolean,attribute:!0})],k.prototype,"alwaysFloatLabel");$([h({type:Boolean,attribute:!0})],k.prototype,"autocompleted");$([h({type:Number,attribute:!0})],k.prototype,"rows");$([h({type:Boolean,reflect:!0,attribute:"effective-disabled"})],k.prototype,"effectiveDisabled");$([h({type:Boolean,reflect:!0,attribute:"extended-prefix"})],k.prototype,"extendedPrefix");$([h({type:String,reflect:!0})],k.prototype,"type");$([h({type:String,reflect:!0})],k.prototype,"placeholder");$([h({type:String,reflect:!0})],k.prototype,"sdAriaLabel");$([h({type:Number,reflect:!0})],k.prototype,"maxlength");$([h({type:Boolean,reflect:!0})],k.prototype,"readonly");$([h({type:Boolean,reflect:!0})],k.prototype,"required");$([h({type:String,reflect:!0})],k.prototype,"name");$([h({type:Boolean,reflect:!0})],k.prototype,"inactive");$([h({type:String,attribute:!0})],k.prototype,"autocomplete");$([h({type:String,attribute:!0})],k.prototype,"min");$([h({type:String,attribute:!0})],k.prototype,"max");$([h({type:String,attribute:!0})],k.prototype,"pattern");var ui=k;customElements.get(ui.ID)||customElements.define(ui.ID,ui);var Yt={ATTRIBUTE:1,CHILD:2,PROPERTY:3,BOOLEAN_ATTRIBUTE:4,EVENT:5,ELEMENT:6},Ot=e=>(...t)=>({_$litDirective$:e,values:t}),Xt=class{constructor(t){}get _$AU(){return this._$AM._$AU}_$AT(t,i,s){this._$Ct=t,this._$AM=i,this._$Ci=s}_$AS(t,i){return this.update(t,i)}update(t,i){return this.render(...i)}};var Dt=class extends Xt{constructor(t){if(super(t),this.it=g,t.type!==Yt.CHILD)throw Error(this.constructor.directiveName+"() can only be used in child bindings")}render(t){if(t===g||t==null)return this._t=void 0,this.it=t;if(t===ct)return t;if(typeof t!="string")throw Error(this.constructor.directiveName+"() called with a non-string value");if(t===this.it)return this._t;this.it=t;let i=[t];return i.raw=i,this._t={_$litType$:this.constructor.resultType,strings:i,values:[]}}};Dt.directiveName="unsafeHTML",Dt.resultType=1;var ns=Ot(Dt);var{I:hn}=ss;var as=e=>e.strings===void 0;var fe=(e,t)=>{let i=e._$AN;if(i===void 0)return!1;for(let s of i)s._$AO?.(t,!1),fe(s,t);return!0},He=e=>{let t,i;do{if((t=e._$AM)===void 0)break;i=t._$AN,i.delete(e),e=t}while(i?.size===0)},ls=e=>{for(let t;t=e._$AM;e=t){let i=t._$AN;if(i===void 0)t._$AN=i=new Set;else if(i.has(e))break;i.add(e),xo(t)}};function bo(e){this._$AN!==void 0?(He(this),this._$AM=e,ls(this)):this._$AM=e}function yo(e,t=!1,i=0){let s=this._$AH,o=this._$AN;if(o!==void 0&&o.size!==0)if(t)if(Array.isArray(s))for(let r=i;r<s.length;r++)fe(s[r],!1),He(s[r]);else s!=null&&(fe(s,!1),He(s));else fe(this,e)}var xo=e=>{e.type==Yt.CHILD&&(e._$AP??=yo,e._$AQ??=bo)},Ue=class extends Xt{constructor(){super(...arguments),this._$AN=void 0}_$AT(t,i,s){super._$AT(t,i,s),ls(this),this.isConnected=t._$AU}_$AO(t,i=!0){t!==this.isConnected&&(this.isConnected=t,t?this.reconnected?.():this.disconnected?.()),i&&(fe(this,t),He(this))}setValue(t){if(as(this._$Ct))this._$Ct._$AI(t,this);else{let i=[...this._$Ct._$AH];i[this._$Ci]=t,this._$Ct._$AI(i,this,0)}}disconnected(){}reconnected(){}};var ds=e=>e?e.startsWith("url")?e:`url("${e}")`:null,wo=(e,t)=>{if(e){let i=new Image;i.addEventListener("load",t),i.src=e,i.complete&&(i.removeEventListener("load",t),t())}};var fi=class extends Ue{constructor(t){if(super(t),t.type!==Yt.ATTRIBUTE||t.name!=="src"&&t.name!=="style")throw new Error("The `placeholder` directive must be used in the `src` or `style` attributes")}update(t,[i,s]){return this.useCssBackground=t.name=="style",this.render(i,s)}render(t,i){this.loadingToken!=null&&(this.loadingToken.cancelled=!0);let s={cancelled:!1};return this.loadingToken=s,typeof t=="string"?this.preload(t,s):t?.then(o=>{this.preload(o,s)}),this.useCssBackground?ds(i):i}preload(t,i){t!=null&&!i.cancelled&&wo(t,()=>{i.cancelled||this.setValue(this.useCssBackground?ds(t):t)})}},Be=Ot(fi);var _o=':host{display:block;contain:strict;height:50px}:host([selected]){background-color:#d3e6fa}:host(:not([selected]):hover),:host(:not([selected])[focused]){background-color:#e7f1fa}@media (forced-colors: active){:host([selected]){outline:4px solid}:host(:not([selected]):hover){outline:4px dotted}:host(:not([selected])[focused]){outline:4px dashed}}:host([enable-line-clamp]) .labels>:only-child{display:-webkit-box;overflow:hidden;-webkit-line-clamp:2;-webkit-box-orient:vertical;white-space:normal;overflow-wrap:break-word}.container{display:flex;height:100%;box-sizing:border-box}.container .level-indicator{width:7px;height:100%}.container .level-indicator.level-0{background-color:#a0c3ef}.container .level-indicator.level-1{background-color:#e7c374}.container .level-indicator.level-2{background-color:#bfd596}.container .level-indicator.level-3{background-color:#fd998d}.container .level-indicator.level-4{background-color:#c6e8f5}.container .level-indicator.level-5{background-color:#fde3a4}.container .level-indicator.level-6{background-color:#dcbfe0}.side-content{display:flex;align-items:center;flex-grow:0}.labels{display:flex;flex-direction:column;justify-content:center;flex:1 1 0px;height:100%;line-height:normal;overflow:hidden;padding:var(--sd-list-item-label-content-padding, 0 8px)}.caption,.description{width:100%;font-family:var(--sd-list-item-font-family, "Segoe UI", "Lucida Sans", Arial, sans-serif);font-style:normal;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;-webkit-user-select:none;user-select:none;text-decoration:var(--sd-list-item-text-decoration, inherit)}.caption em,.description em{font-weight:bolder}.caption{font-size:var(--sd-list-item-caption-font-size, 16px);color:var(--sd-list-item-caption-text-color, #111);font-weight:var(--sd-list-item-caption-font-weight, normal)}.description{font-size:var(--sd-list-item-description-font-size, 13px);color:var(--sd-list-item-description-text-color, #767676);font-weight:var(--sd-list-item-description-font-weight, normal)}.icon-wrapper{width:var(--sd-list-item-icon-wrapper-width, 45px);height:100%;display:flex;align-items:center;justify-content:center}.icon-wrapper .icon{min-height:var(--sd-list-item-icon-size, 24px);min-width:var(--sd-list-item-icon-size, 24px);background-repeat:no-repeat;background-position:center;background-size:cover}',Ao=Object.defineProperty,j=(e,t,i,s)=>{for(var o=void 0,r=e.length-1,n;r>=0;r--)(n=e[r])&&(o=n(t,i,o)||o);return o&&Ao(t,i,o),o},Mt,F=(Mt=class extends D{constructor(){super(...arguments),this.contentMode="text",this.role="option"}static get styles(){return[at`
|
|
74
|
+
`}updated(e){super.updated(e),this._needsAutocompletedCheck&&!this.autocompleted&&setTimeout(()=>{try{this.autocompleted=this.autocompleted||!!this.shadowRoot.querySelector(":-webkit-autofill")}catch{}},0),this.rows>1&&((e.has("min")||e.has("max")||e.has("pattern"))&&console.warn("min, max & pattern attributes are not supported with multiple rows configuration."),this.type!="text"&&console.warn(`type: ${this.type} is not supported with multiple rows configuration.`))}update(e){if(super.update(e),e.has("validationMessage")&&(this.validationMessage?this._internals?.setValidity({customError:!0},this.validationMessage):this._internals?.setValidity(this.inputElement.validity,this.inputElement.validationMessage)),this._initialized&&e.has("rows"))throw Error("rows attribute cannot be changed after the input is attached to the DOM")}fireValueChange(e){this.dispatchEvent(new CustomEvent(`${e?"immediate-":""}value-change`,{detail:{value:this.value}})),this.setFormValue(this.value)}updateFormValidity(){if(this.validationMessage==null&&this.inputElement!=null){this._internals.setValidity(this.inputElement.validity,this.inputElement.validationMessage);let e=this.shadowRoot.querySelector("sd-field-validation-message");this.requestUpdate("validationMessage",e==null?null:e.message)}}shouldFloat(){return this.alwaysFloatLabel||this.currentText||this.placeholder||this.autocompleted||this.type==="date"}setFormValue(e){this._internals?.setFormValue(e),this.updateFormValidity()}formResetCallback(){this.value=this._initialValue}formDisabledCallback(e){this.effectiveDisabled=e||this.hasAttribute("disabled")}formAssociatedCallback(e){this._needsAutocompletedCheck=!0}formStateRestoreCallback(e,t){typeof e=="string"&&(this.value=e)}},nt.ID=vo,nt.DEFAULT_MAX_LENGTH=524288,nt.formAssociated=!0,nt.shadowRootOptions={...D.shadowRootOptions,delegatesFocus:rs},nt);$([h({type:String,reflect:!0})],k.prototype,"label");$([h({type:String,attribute:!0})],k.prototype,"validationMessage");$([h({type:String,attribute:!0})],k.prototype,"validationIconSrc");$([h({type:ue,attribute:!0,reflect:!0})],k.prototype,"validationLevel");$([h({type:String,hasChanged(e,t){return t!=null&&t!=e}})],k.prototype,"currentText");$([h({type:Boolean,attribute:!0})],k.prototype,"alwaysFloatLabel");$([h({type:Boolean,attribute:!0})],k.prototype,"autocompleted");$([h({type:Number,attribute:!0})],k.prototype,"rows");$([h({type:Boolean,reflect:!0,attribute:"effective-disabled"})],k.prototype,"effectiveDisabled");$([h({type:Boolean,reflect:!0,attribute:"extended-prefix"})],k.prototype,"extendedPrefix");$([h({type:String,reflect:!0})],k.prototype,"type");$([h({type:String,reflect:!0})],k.prototype,"placeholder");$([h({type:String,reflect:!0})],k.prototype,"sdAriaLabel");$([h({type:Number,reflect:!0})],k.prototype,"maxlength");$([h({type:Boolean,reflect:!0})],k.prototype,"readonly");$([h({type:Boolean,reflect:!0})],k.prototype,"required");$([h({type:String,reflect:!0})],k.prototype,"name");$([h({type:Boolean,reflect:!0})],k.prototype,"inactive");$([h({type:String,attribute:!0})],k.prototype,"autocomplete");$([h({type:String,attribute:!0})],k.prototype,"min");$([h({type:String,attribute:!0})],k.prototype,"max");$([h({type:String,attribute:!0})],k.prototype,"pattern");var ui=k;customElements.get(ui.ID)||customElements.define(ui.ID,ui);var Yt={ATTRIBUTE:1,CHILD:2,PROPERTY:3,BOOLEAN_ATTRIBUTE:4,EVENT:5,ELEMENT:6},Ot=e=>(...t)=>({_$litDirective$:e,values:t}),Xt=class{constructor(t){}get _$AU(){return this._$AM._$AU}_$AT(t,i,s){this._$Ct=t,this._$AM=i,this._$Ci=s}_$AS(t,i){return this.update(t,i)}update(t,i){return this.render(...i)}};var Dt=class extends Xt{constructor(t){if(super(t),this.it=g,t.type!==Yt.CHILD)throw Error(this.constructor.directiveName+"() can only be used in child bindings")}render(t){if(t===g||t==null)return this._t=void 0,this.it=t;if(t===ct)return t;if(typeof t!="string")throw Error(this.constructor.directiveName+"() called with a non-string value");if(t===this.it)return this._t;this.it=t;let i=[t];return i.raw=i,this._t={_$litType$:this.constructor.resultType,strings:i,values:[]}}};Dt.directiveName="unsafeHTML",Dt.resultType=1;var ns=Ot(Dt);var{I:hn}=ss;var as=e=>e.strings===void 0;var fe=(e,t)=>{let i=e._$AN;if(i===void 0)return!1;for(let s of i)s._$AO?.(t,!1),fe(s,t);return!0},He=e=>{let t,i;do{if((t=e._$AM)===void 0)break;i=t._$AN,i.delete(e),e=t}while(i?.size===0)},ls=e=>{for(let t;t=e._$AM;e=t){let i=t._$AN;if(i===void 0)t._$AN=i=new Set;else if(i.has(e))break;i.add(e),xo(t)}};function bo(e){this._$AN!==void 0?(He(this),this._$AM=e,ls(this)):this._$AM=e}function yo(e,t=!1,i=0){let s=this._$AH,o=this._$AN;if(o!==void 0&&o.size!==0)if(t)if(Array.isArray(s))for(let r=i;r<s.length;r++)fe(s[r],!1),He(s[r]);else s!=null&&(fe(s,!1),He(s));else fe(this,e)}var xo=e=>{e.type==Yt.CHILD&&(e._$AP??=yo,e._$AQ??=bo)},Ue=class extends Xt{constructor(){super(...arguments),this._$AN=void 0}_$AT(t,i,s){super._$AT(t,i,s),ls(this),this.isConnected=t._$AU}_$AO(t,i=!0){t!==this.isConnected&&(this.isConnected=t,t?this.reconnected?.():this.disconnected?.()),i&&(fe(this,t),He(this))}setValue(t){if(as(this._$Ct))this._$Ct._$AI(t,this);else{let i=[...this._$Ct._$AH];i[this._$Ci]=t,this._$Ct._$AI(i,this,0)}}disconnected(){}reconnected(){}};var ds=e=>e?e.startsWith("url")?e:`url("${e}")`:null,wo=(e,t)=>{if(e){let i=new Image;i.addEventListener("load",t),i.src=e,i.complete&&(i.removeEventListener("load",t),window.queueMicrotask(()=>t()))}};var fi=class extends Ue{constructor(t){if(super(t),t.type!==Yt.ATTRIBUTE||t.name!=="src"&&t.name!=="style")throw new Error("The `placeholder` directive must be used in the `src` or `style` attributes")}update(t,[i,s]){return this.useCssBackground=t.name=="style",this.render(i,s)}render(t,i){this.loadingToken!=null&&(this.loadingToken.cancelled=!0);let s={cancelled:!1};return this.loadingToken=s,typeof t=="string"?this.preload(t,s):t?.then(o=>{this.preload(o,s)}),this.useCssBackground?ds(i):i}preload(t,i){t!=null&&!i.cancelled&&wo(t,()=>{i.cancelled||this.setValue(this.useCssBackground?ds(t):t)})}},Be=Ot(fi);var _o=':host{display:block;contain:strict;height:50px}:host([selected]){background-color:#d3e6fa}:host(:not([selected]):hover),:host(:not([selected])[focused]){background-color:#e7f1fa}@media (forced-colors: active){:host([selected]){outline:4px solid}:host(:not([selected]):hover){outline:4px dotted}:host(:not([selected])[focused]){outline:4px dashed}}:host([enable-line-clamp]) .labels>:only-child{display:-webkit-box;overflow:hidden;-webkit-line-clamp:2;-webkit-box-orient:vertical;white-space:normal;overflow-wrap:break-word}.container{display:flex;height:100%;box-sizing:border-box}.container .level-indicator{width:7px;height:100%}.container .level-indicator.level-0{background-color:#a0c3ef}.container .level-indicator.level-1{background-color:#e7c374}.container .level-indicator.level-2{background-color:#bfd596}.container .level-indicator.level-3{background-color:#fd998d}.container .level-indicator.level-4{background-color:#c6e8f5}.container .level-indicator.level-5{background-color:#fde3a4}.container .level-indicator.level-6{background-color:#dcbfe0}.side-content{display:flex;align-items:center;flex-grow:0}.labels{display:flex;flex-direction:column;justify-content:center;flex:1 1 0px;height:100%;line-height:normal;overflow:hidden;padding:var(--sd-list-item-label-content-padding, 0 8px)}.caption,.description{width:100%;font-family:var(--sd-list-item-font-family, "Segoe UI", "Lucida Sans", Arial, sans-serif);font-style:normal;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;-webkit-user-select:none;user-select:none;text-decoration:var(--sd-list-item-text-decoration, inherit)}.caption em,.description em{font-weight:bolder}.caption{font-size:var(--sd-list-item-caption-font-size, 16px);color:var(--sd-list-item-caption-text-color, #111);font-weight:var(--sd-list-item-caption-font-weight, normal)}.description{font-size:var(--sd-list-item-description-font-size, 13px);color:var(--sd-list-item-description-text-color, #767676);font-weight:var(--sd-list-item-description-font-weight, normal)}.icon-wrapper{width:var(--sd-list-item-icon-wrapper-width, 45px);height:100%;display:flex;align-items:center;justify-content:center}.icon-wrapper .icon{min-height:var(--sd-list-item-icon-size, 24px);min-width:var(--sd-list-item-icon-size, 24px);background-repeat:no-repeat;background-position:center;background-size:cover}',Ao=Object.defineProperty,j=(e,t,i,s)=>{for(var o=void 0,r=e.length-1,n;r>=0;r--)(n=e[r])&&(o=n(t,i,o)||o);return o&&Ao(t,i,o),o},Mt,F=(Mt=class extends D{constructor(){super(...arguments),this.contentMode="text",this.role="option"}static get styles(){return[at`
|
|
75
75
|
${X(_o)}
|
|
76
76
|
`]}render(){return A`
|
|
77
77
|
<div class="container">
|
|
@@ -155,7 +155,7 @@ var window;(window||={})["@cas-smartdesign/token-selector"]=(()=>{var ii=Object.
|
|
|
155
155
|
><div class="token-wrapper" slot="prefix"><slot name="items"></slot></div>
|
|
156
156
|
</sd-lit-input>
|
|
157
157
|
<slot class="additonal-content" name="additional-content" @focusin=${this.clearCheckedTokens}></slot>
|
|
158
|
-
`}firstUpdated(e){super.firstUpdated(e),this.setAttribute("role","listbox"),this.setAttribute("aria-multiselectable","true"),!this.hasAttribute("tabIndex")&&!this.disabled&&(this.tabIndex=0),this.addEventListener("focusout",t=>{let i=t.relatedTarget;!this.contains(i)&&!this.shadowRoot.contains(i)&&this.clearCheckedTokens()}),this.addEventListener("focusin",()=>{this.selectionMode=="remove-only"&&this.activeTokenIndex==-1&&this.items.length>0&&!this.disabled&&(this.activeTokenIndex=0)}),new Li(this,()=>this.inputElement?.value,t=>this.selectOrAddItems(t)),new Pi(this,t=>this.selectOrAddItems(t))}clearCheckedTokens(){this.querySelectorAll("[slot='items'][aria-checked='true']").forEach(t=>t.checked=!1);let e=this.inputElement;e&&(e.removeAttribute("focus-visible"),e.removeAttribute("focused"))}removeSelectionOrActiveToken(){if(!this.disabled){let e=this.querySelectorAll("[slot='items'][aria-checked='true']");if(e.length>0){let t=Array.from(e);this.removeTokens(t.filter(i=>!i.disabled).map(i=>i.index))}else if(this.activeTokenIndex!=-1){let t=this.activeTokenElement;t&&!t.disabled&&this.removeTokens([t.index])}}}updateActiveToken(e){if(this.disabled)return;let t=this.querySelectorAll("[slot='items']").length-1;if(this.activeTokenIndex==-1?e<0&&(this.activeTokenIndex=t):this.activeTokenIndex==t&&e>0&&this.selectionMode=="multi"?(this.activeTokenIndex=-1,this.focus()):this.activeTokenIndex=Math.max(0,Math.min(t,this.activeTokenIndex+e)),this.activeTokenIndex>-1&&(this.inputElement?.setAttribute("focus-visible",""),this.scrollHeight>this.offsetHeight)){let i=this.activeTokenElement;i.scrollIntoViewIfNeeded?i.scrollIntoViewIfNeeded():i.scrollIntoView()}}commitTokenValue(e){if(this.disabled)return;if(this.tokenSuggestPopover.isOpened){let i=this.tokenSuggestPopover.focusedSuggestToken;if(i){if(!i.disabled){let s=this.findIndex(i);this.handleTokenSelection([s]),this.tokenSuggestPopover.hide()}return}}if(!e?.trim())return;let t=this.items.findIndex(i=>this.caseSensitive?i.caption==e:i.caption.toLowerCase()==e.toLowerCase());this.selectedIndexes.includes(t)||(t>=0?this.handleTokenSelection([t]):this.handleTokenCreation(e)),this.requestUpdate("selectedIndexes"),this.tokenSuggestPopover.hide(),window.removeEventListener("pointerdown",this.handleWindowPointerDown)}updated(e){if(super.updated(e),this._tokenSuggestPopover&&(this.tokenSuggestPopover.list.className=this.suggestListClass||"",this.suggestionFilter&&(this.tokenSuggestPopover.filter=this.suggestionFilter)),e.has("selectionMode"))if(this.selectionMode=="multi"){this.setAttribute("aria-haspopup","listbox");let t=this.inputElement;t.addEventListener("immediate-value-change",i=>this.handleInputValueChange(i)),t.addEventListener("keydown",i=>this.handleInputKeyDown(i,t)),window.queueMicrotask(()=>this.tokenSuggestPopover)}else this.removeAttribute("aria-haspopup"),this.addEventListener("keydown",this.handleKeyDown),this._tokenSuggestPopover&&(this._tokenSuggestPopover.hide(),this._tokenSuggestPopover=null);(e.size==0||e.has("selectionMode")||e.has("items")||e.has("selectedIndexes")||e.has("disabled"))&&this.updateItems(),e.has("inputLabel")&&(this.inputLabel?this.setAttribute("aria-label",this.inputLabel):this.removeAttribute("aria-label"))}handleInputValueChange(e){e.detail.value?(this.activeTokenIndex=-1,this.cancelSearch=!1,this.debouncedShowTokenSuggestPopover(),window.addEventListener("pointerdown",this.handleWindowPointerDown)):(this.tokenSuggestPopover.hide(),this.cancelSearch=!0)}showFilteredTokenSuggestions(){!this.cancelSearch&&this.inputElement.value&&this.tokenSuggestPopover.show()}isTokenNotSelected(e){return!this.selectedIndexes.includes(e)}get tokenSuggestPopover(){return!this._tokenSuggestPopover&&this.inputElement&&(this._tokenSuggestPopover=new Ti(this.inputElement,()=>this.items.filter((e,t)=>!e.disabled&&this.isTokenNotSelected(t)),e=>{let t=this.findIndex(e);this.handleTokenSelection([t]),window.removeEventListener("pointerdown",this.handleWindowPointerDown)},e=>{this.appendChild(e.popover),this.inputElement.setAttribute("aria-controls",e.list.id),this.dispatchEvent(new CustomEvent("auto-suggest-initialized")),e.popover.addEventListener("close",()=>{this.inputElement.value&&!this.contains(document.activeElement)&&(this.inputElement.value="")})}),this._tokenSuggestPopover.list.itemGenerator=this._autoSuggestItemGenerator,this._tokenSuggestPopover.list.className=this.suggestListClass,this.suggestionFilter&&(this._tokenSuggestPopover.filter=this.suggestionFilter)),this._tokenSuggestPopover}updateItems(){if(!this.
|
|
158
|
+
`}connectedCallback(){super.connectedCallback(),this.updateItemsOnConnect&&(this.updateItemsOnConnect=!1,this.updateItems())}firstUpdated(e){super.firstUpdated(e),this.setAttribute("role","listbox"),this.setAttribute("aria-multiselectable","true"),!this.hasAttribute("tabIndex")&&!this.disabled&&(this.tabIndex=0),this.addEventListener("focusout",t=>{let i=t.relatedTarget;!this.contains(i)&&!this.shadowRoot.contains(i)&&this.clearCheckedTokens()}),this.addEventListener("focusin",()=>{this.selectionMode=="remove-only"&&this.activeTokenIndex==-1&&this.items.length>0&&!this.disabled&&(this.activeTokenIndex=0)}),new Li(this,()=>this.inputElement?.value,t=>this.selectOrAddItems(t)),new Pi(this,t=>this.selectOrAddItems(t))}clearCheckedTokens(){this.querySelectorAll("[slot='items'][aria-checked='true']").forEach(t=>t.checked=!1);let e=this.inputElement;e&&(e.removeAttribute("focus-visible"),e.removeAttribute("focused"))}removeSelectionOrActiveToken(){if(!this.disabled){let e=this.querySelectorAll("[slot='items'][aria-checked='true']");if(e.length>0){let t=Array.from(e);this.removeTokens(t.filter(i=>!i.disabled).map(i=>i.index))}else if(this.activeTokenIndex!=-1){let t=this.activeTokenElement;t&&!t.disabled&&this.removeTokens([t.index])}}}updateActiveToken(e){if(this.disabled)return;let t=this.querySelectorAll("[slot='items']").length-1;if(this.activeTokenIndex==-1?e<0&&(this.activeTokenIndex=t):this.activeTokenIndex==t&&e>0&&this.selectionMode=="multi"?(this.activeTokenIndex=-1,this.focus()):this.activeTokenIndex=Math.max(0,Math.min(t,this.activeTokenIndex+e)),this.activeTokenIndex>-1&&(this.inputElement?.setAttribute("focus-visible",""),this.scrollHeight>this.offsetHeight)){let i=this.activeTokenElement;i.scrollIntoViewIfNeeded?i.scrollIntoViewIfNeeded():i.scrollIntoView()}}commitTokenValue(e){if(this.disabled)return;if(this.tokenSuggestPopover.isOpened){let i=this.tokenSuggestPopover.focusedSuggestToken;if(i){if(!i.disabled){let s=this.findIndex(i);this.handleTokenSelection([s]),this.tokenSuggestPopover.hide()}return}}if(!e?.trim())return;let t=this.items.findIndex(i=>this.caseSensitive?i.caption==e:i.caption.toLowerCase()==e.toLowerCase());this.selectedIndexes.includes(t)||(t>=0?this.handleTokenSelection([t]):this.handleTokenCreation(e)),this.requestUpdate("selectedIndexes"),this.tokenSuggestPopover.hide(),window.removeEventListener("pointerdown",this.handleWindowPointerDown)}updated(e){if(super.updated(e),this._tokenSuggestPopover&&(this.tokenSuggestPopover.list.className=this.suggestListClass||"",this.suggestionFilter&&(this.tokenSuggestPopover.filter=this.suggestionFilter)),e.has("selectionMode"))if(this.selectionMode=="multi"){this.setAttribute("aria-haspopup","listbox");let t=this.inputElement;t.addEventListener("immediate-value-change",i=>this.handleInputValueChange(i)),t.addEventListener("keydown",i=>this.handleInputKeyDown(i,t)),window.queueMicrotask(()=>this.tokenSuggestPopover)}else this.removeAttribute("aria-haspopup"),this.addEventListener("keydown",this.handleKeyDown),this._tokenSuggestPopover&&(this._tokenSuggestPopover.hide(),this._tokenSuggestPopover=null);(e.size==0||e.has("selectionMode")||e.has("items")||e.has("selectedIndexes")||e.has("disabled"))&&this.updateItems(),e.has("inputLabel")&&(this.inputLabel?this.setAttribute("aria-label",this.inputLabel):this.removeAttribute("aria-label"))}handleInputValueChange(e){e.detail.value?(this.activeTokenIndex=-1,this.cancelSearch=!1,this.debouncedShowTokenSuggestPopover(),window.addEventListener("pointerdown",this.handleWindowPointerDown)):(this.tokenSuggestPopover.hide(),this.cancelSearch=!0)}showFilteredTokenSuggestions(){!this.cancelSearch&&this.inputElement.value&&this.tokenSuggestPopover.show()}isTokenNotSelected(e){return!this.selectedIndexes.includes(e)}get tokenSuggestPopover(){return!this._tokenSuggestPopover&&this.inputElement&&(this._tokenSuggestPopover=new Ti(this.inputElement,()=>this.items.filter((e,t)=>!e.disabled&&this.isTokenNotSelected(t)),e=>{let t=this.findIndex(e);this.handleTokenSelection([t]),window.removeEventListener("pointerdown",this.handleWindowPointerDown)},e=>{this.appendChild(e.popover),this.inputElement.setAttribute("aria-controls",e.list.id),this.dispatchEvent(new CustomEvent("auto-suggest-initialized")),e.popover.addEventListener("close",()=>{this.inputElement.value&&!this.contains(document.activeElement)&&(this.inputElement.value="")})}),this._tokenSuggestPopover.list.itemGenerator=this._autoSuggestItemGenerator,this._tokenSuggestPopover.list.className=this.suggestListClass,this.suggestionFilter&&(this._tokenSuggestPopover.filter=this.suggestionFilter)),this._tokenSuggestPopover}updateItems(){if(!this.items)return;if(!this.isConnected){this.updateItemsOnConnect=!0;return}this.activeTokenIndex=-1;let e=this.inputElement;e&&(!this._tokenSuggestPopover||!this._tokenSuggestPopover.isOpened)&&(e.value=""),this.querySelectorAll("[slot='items']").forEach(s=>{this.removeChild(s)});let t=document.createDocumentFragment(),i=[];this.selectionMode=="remove-only"?i=this.items.map(s=>this.disableIfNeeded(s)):this.selectedIndexes.forEach(s=>{i.push(this.disableIfNeeded(this.items[s]))}),i.forEach(s=>{let o=this.tokenGenerator(s,this.findIndex(s));o.slot="items",t.appendChild(o),o.id||(o.id=window.crypto.getRandomValues(new Uint32Array(1))[0].toString(16)),o.setClickHandler((r,n)=>this.onTokenClick(o,!0,n)),o.addEventListener("click",()=>{this.inputElement?.removeAttribute("focus-visible");let r=window.getSelection();(!r||r.type!="Range")&&document.activeElement!=this&&this.focus()}),o.setDeleteHandler(r=>this.removeTokens([r]))}),this.appendChild(t),this._tokenSuggestPopover&&this._tokenSuggestPopover.refreshItems()}removeTokens(e){if(!(this.disabled||e==null||e.length==0))if(this.activeTokenIndex!=-1&&e.includes(this.activeTokenElement.index)&&(this.activeTokenIndex=-1),this.selectionMode=="remove-only")this.dispatchEvent(new CustomEvent("tokens-removed",{detail:{removedIndices:e}}));else{let t=e.filter(i=>this.selectedIndexes.includes(i));t.length>0&&(this.selectedIndexes=this.selectedIndexes.filter(i=>!t.includes(i)),this.dispatchEvent(new CustomEvent("tokens-removed",{detail:{removedIndices:t,selectedIndices:[...this.selectedIndexes]}})))}}onTokenClick(e,t,i){let s;this.querySelectorAll("[slot='items']").forEach((o,r)=>{e==o?s=r:i||o.setAttribute("aria-checked","false")}),this.activeTokenIndex=s,this.setAttribute("aria-activedescendant",this.activeTokenElement.id),this._tokenSuggestPopover&&this._tokenSuggestPopover.isOpened&&this._tokenSuggestPopover.hide(),i||this.dispatchEvent(new CustomEvent("token-clicked",{detail:{index:e.index,tokenElement:e,byPointerDevice:t}}))}disableIfNeeded(e){return this.disabled?{...e,disabled:!0}:e}handleTokenSelection(e){this.selectedIndexes=this.selectedIndexes.concat(e),this.dispatchEvent(new CustomEvent("tokens-selected",{detail:{newIndices:e,selectedIndices:[...this.selectedIndexes]}}))}handleTokenCreation(e){this.dispatchEvent(new CustomEvent("token-created",{detail:{value:e}}))}get inputElement(){return this.shadowRoot.querySelector(".input")}get activeTokenElement(){return this.getTokenElement(this.activeTokenIndex)}getTokenElement(e){return this.querySelector("[slot='items']:nth-of-type("+(e+1)+")")}findIndex(e){return this.items.findIndex(t=>t.caption===e.caption)}get activeTokenIndex(){return this._activeTokenIndex}set activeTokenIndex(e){if(this._activeTokenIndex!=-1){let t=this.activeTokenElement;t&&(t.current=!1)}if(this._activeTokenIndex=e,e==-1)this.removeAttribute("aria-activedescendant");else{let t=this.activeTokenElement;t.current=!0,this.setAttribute("aria-activedescendant",t.id)}}get hasInputValue(){return!!this.inputElement?.value}},wt.ID="sd-token-selector",wt.ensureDefined=()=>{Je.ensureDefined(),customElements.get(wt.ID)||customElements.define(wt.ID,wt)},wt.shadowRootOptions={...D.shadowRootOptions,delegatesFocus:!0},wt);tt([h({type:String,attribute:"selection-mode",reflect:!0})],Y.prototype,"selectionMode");tt([h({type:Array,attribute:!1})],Y.prototype,"items");tt([h({type:Array,attribute:!1})],Y.prototype,"selectedIndexes");tt([h({type:String,reflect:!0})],Y.prototype,"placeholder");tt([h({type:String,reflect:!0,attribute:"suggest-list-class"})],Y.prototype,"suggestListClass");tt([h({type:String,reflect:!0,attribute:"input-label"})],Y.prototype,"inputLabel");tt([h({converter:{fromAttribute:e=>e=="true",toAttribute:e=>e},reflect:!0,attribute:"aria-disabled"})],Y.prototype,"disabled");tt([h({type:String,attribute:!0})],Y.prototype,"validationMessage");tt([h({type:String,attribute:!0})],Y.prototype,"validationIconSrc");tt([h({converter:he.levelConverter,attribute:!0,reflect:!0})],Y.prototype,"validationLevel");tt([h({type:String,reflect:!0,attribute:"token-type"})],Y.prototype,"tokenType");tt([h({type:Boolean,reflect:!0,attribute:"case-sensitive"})],Y.prototype,"caseSensitive");var br=Y;return Gs(yr);})();
|
|
159
159
|
/*! Bundled license information:
|
|
160
160
|
|
|
161
161
|
@lit/reactive-element/css-tag.js:
|