"use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[9522],{3393(e,t,i){i.d(t,{y:()=>a});var n=i(9696),s=i(79365),r=i(81365);const a=(...e)=>(0,n.Zz)(s.XX,s._$,s.yF,s.jd)((0,r.q)(...e))},1428(e,t,i){i.d(t,{A:()=>o,T:()=>r});var n=i(3393),s=i(97810);const r=(0,s.xE)("mappings-field-internal"),a=(0,n.y)({componentName:r,baseSelector:"div"}),o=class extends a{#e;static get observedAttributes(){return[].concat(a.observedAttributes||[],["label-value","label-attr","button-label","invalid","readonly","disabled","st-error-message-icon","st-error-message-icon-size","st-error-message-icon-padding"])}isValidDataType(e){try{return e.every(e=>"object"==typeof e&&!Array.isArray(e)&&1===Object.getOwnPropertyNames(e).length&&"string"==typeof e[Object.keys(e)[0]]&&""!==e[Object.keys(e)[0]].trim())}catch(e){return!1}}get labelValue(){return this.getAttribute("label-value")||"Value"}get labelAttr(){return this.getAttribute("label-attr")||"Attribute"}get buttonLabel(){return this.getAttribute("button-label")||"Add mapping"}get options(){return this.getAttribute("options")||[]}addNewMappingItem(e){const t=document.createElement("descope-mapping-item");return t.setAttribute("bordered","true"),this.mappingsContainerEle.appendChild(t),(0,s.EA)(this,t,{includeAttrs:["size","full-width","separator","options","disabled","st-error-message-icon","st-error-message-icon-size","st-error-message-icon-padding"]}),setTimeout(()=>{this.setCustomValidity(""),t.addEventListener("mapping-item-removed",()=>{t===this.#e&&(this.resetInvalidIndication(),this.#e=void 0),t.remove(),this.setCustomValidity("")}),this.dispatchEvent(new CustomEvent("mapping-item-added",{bubbles:!0,composed:!0})),e&&t.focus()},0),t}get items(){return Array.from(this.mappingsContainerEle.querySelectorAll("descope-mapping-item"))}get value(){return this.items.reduce((e,t)=>t.value?[...e,t.value]:e,[])}set value(e){if(!this.isValidDataType(e))return void console.error("received invalid value to set - should be an array of objects with one key-value pair");const t=this.items;if(t.length>e.length)for(let i=e.length;i<t.length;i++)this.mappingsContainerEle.removeChild(t[i]);e.forEach((e,i)=>{const n=t[i];if(n)n.value=e;else{const t=this.addNewMappingItem(!1);setTimeout(()=>{t.value=e},0)}})}constructor(){super(),this.innerHTML='\n      <div class="labels-container" part="labels"></div>\n      <div class="mappings-container"></div>\n      <div class="button-container"></div>\n    ',this.labelsEle=this.querySelector(".labels-container"),this.mappingsContainerEle=this.querySelector(".mappings-container"),this.buttonContainer=this.querySelector(".button-container")}initLabels(){this.labelsEle.innerHTML=`\n      <descope-text variant="body2" part="value-label">${this.labelValue}</descope-text>\n      <descope-text variant="body2" part="attr-label">${this.labelAttr}</descope-text>\n    `}initAddButton(){this.buttonContainer.innerHTML=`\n      <descope-button variant="link" mode="primary" disabled="${this.isDisabled}">\n        <vaadin-icon icon="vaadin:plus"></vaadin-icon>\n        ${this.buttonLabel}\n      </descope-button>\n    `;const e=this.querySelector("descope-button");e.onclick=()=>{this.addNewMappingItem(!0)},(0,s.EA)(this,e,{includeAttrs:["disabled"]})}#t(){this.labelsEle.style.display=this.items.length?"grid":"none"}init(){this.addEventListener("focus",e=>{e.isTrusted&&(this.#e||this.items[0]||this.querySelector("descope-button")).focus()}),super.init?.(),this.initLabels(),this.initAddButton(),this.addEventListener("input",()=>{this.mappingsContainerEle.contains(this.#e)&&this.#e?.checkValidity()&&(this.resetInvalidIndication(),this.#e.removeAttribute("invalid"),this.#e=void 0)}),(0,s.Ge)(this.mappingsContainerEle,this.#t.bind(this))}resetInvalidIndication(){this.removeAttribute("invalid")}getValidity(){const e=this.items.find(e=>!e.checkValidity());return e?e.validity:{}}#i(e){e&&(this.#e=this.items.find(e=>!e.checkValidity()),this.#e?.reportValidity(),this.#e?.setAttribute("invalid","true"))}attributeChangedCallback(e,t,i){super.attributeChangedCallback?.(e,t,i),"label-value"!==e&&"label-attr"!==e||this.initLabels(),"button-label"===e&&this.initAddButton(),"invalid"===e&&this.#i("true"===i),"readonly"===e&&this.toggleAttribute("inert","true"===i)}}},34884(e,t,i){i.r(t);var n=i(1428);customElements.define(n.T,n.A)}}]);
//# sourceMappingURL=mapping-fields-descope-mappings-field-descope-mappings-field-internal-index-js.js.map