@public-ui/components/dist/kolibri/associated.controller-Bagx9pCw.js

Contains all web components that belong to KoliBri - The accessible HTML-Standard.

/*!
 * KoliBri - The accessible HTML-Standard
 */
import{g as t,J as e,j as i,O as s}from"./common-Cx_AGO_M.js";import{g as o}from"./bootstrap-DPKvOz00.js";const a=(e,i,s)=>{t(e,"_name",i,s)};const n=t=>t==="KOL-BUTTON"||t==="KOL-COMBOBOX"||t==="KOL-INPUT-CHECKBOX"||t==="KOL-INPUT-COLOR"||t==="KOL-INPUT-DATE"||t==="KOL-INPUT-EMAIL"||t==="KOL-INPUT-FILE"||t==="KOL-INPUT-NUMBER"||t==="KOL-INPUT-PASSWORD"||t==="KOL-INPUT-RADIO"||t==="KOL-INPUT-RANGE"||t==="KOL-INPUT-TEXT"||t==="KOL-SELECT"||t==="KOL-SINGLE-SELECT"||t==="KOL-TEXTAREA";class l{constructor(t,s,a){var l,c,r,h;this.experimentalMode=e();this.setFormAssociatedValue=t=>{var e;const s=(e=this.formAssociated)===null||e===void 0?void 0:e.getAttribute("name");if(s===null||s===""){i(` The form field (${this.type}) must have a name attribute to be form-associated. Please define the _name attribute.`)}const o=this.tryToStringifyValue(t);this.syncValue(t,o,this.formAssociated);this.syncValue(t,o,this.syncToOwnInput)};this.component=t;this.host=this.findHostWithShadowRoot(a);this.type=s;if(((l=o())===null||l===void 0?void 0:l.reflectInputValues)&&n((c=this.host)===null||c===void 0?void 0:c.tagName)&&t._name){(r=this.host)===null||r===void 0?void 0:r.querySelectorAll("input,select,textarea").forEach((t=>{var e;(e=this.host)===null||e===void 0?void 0:e.removeChild(t)}));switch(this.type){case"button":case"color":case"date":case"email":case"file":case"number":case"password":case"radio":case"range":case"text":this.formAssociated=document.createElement("input");this.formAssociated.setAttribute("type",this.type);break;case"select":this.formAssociated=document.createElement("select");this.formAssociated.setAttribute("multiple","");break;case"textarea":this.formAssociated=document.createElement("textarea");break;case"checkbox":case"single-select":case"combobox":default:this.formAssociated=document.createElement("input");this.formAssociated.setAttribute("type","hidden")}this.formAssociated.setAttribute("data-form-associated","");this.formAssociated.setAttribute("hidden","");(h=this.host)===null||h===void 0?void 0:h.appendChild(this.formAssociated)}}findHostWithShadowRoot(t){while((t===null||t===void 0?void 0:t.shadowRoot)===null&&t!==document.body){t=t===null||t===void 0?void 0:t.parentNode;if(t.host){t=t.host}}return t}setAttribute(t,e,i){if(this.experimentalMode){try{i=typeof i==="object"&&i!==null?JSON.stringify(i):i;if(typeof i==="boolean"||typeof i==="number"||typeof i==="string"){e===null||e===void 0?void 0:e.setAttribute(t,`${i}`)}else{throw new Error(`Invalid value type: ${typeof i}`)}}catch(i){e===null||e===void 0?void 0:e.removeAttribute(t)}}}tryToStringifyValue(t){try{return typeof t==="object"&&t!==null?JSON.stringify(t).toString():t===null||t===undefined?null:t.toString()}catch(t){s(`The form field raw value is not able to stringify! ${t}`);return""}}syncValue(t,e,i){if(i){switch(this.type){case"file":i.files=t;break;case"select":i.querySelectorAll("option").forEach((t=>{i.removeChild(t)}));if(Array.isArray(t)){t.forEach((t=>{const e=this.tryToStringifyValue(t);if(typeof e==="string"){const t=document.createElement("option");t.setAttribute("value",e);t.setAttribute("selected","");i.appendChild(t)}}))}break;case"radio":if(typeof e==="string"){i.setAttribute("value",e);i.setAttribute("checked","");i.value=e}break;default:if(typeof e==="string"){i.setAttribute("value",e);i.value=e}else{i.removeAttribute("value");i.value=""}}}}validateName(t){a(this.component,t,{hooks:{afterPatch:()=>{this.setAttribute("name",this.formAssociated,this.component.state._name)}}});if(typeof t==="undefined"){i(`A name on input fields or switches is not strictly required, but it might be relevant for the autocomplete function and for the static submission of the input field.`)}}validateSyncValueBySelector(t){if(this.experimentalMode&&typeof t==="string"){const e=document.querySelector(t);if(e){this.syncToOwnInput=e}}}componentWillLoad(){this.validateName(this.component._name);this.validateSyncValueBySelector(this.component._syncValueBySelector)}}export{l as A};
//# sourceMappingURL=associated.controller-Bagx9pCw.js.map