@mgdis/mg-components 6.26.0 → 6.28.0

package/dist/components/mg-input-checkbox.js

@@ -1 +1 @@
-import{h as t,transformTag as i,proxyCustomElement as e,HTMLElement as s,createEvent as a}from"@stencil/core/internal/client";import{k as n,C as h,q as o,i as c,t as l}from"./index2.js";import{n as r}from"./index3.js";import{a as m,d as u,c as p,b as g}from"./mg-input.conf.js";import{i as d}from"./index4.js";import{d as b,S as v}from"./mg-tabs2.js";import{d as f}from"./mg-badge2.js";import{d as y}from"./mg-button2.js";import{d as k}from"./mg-card2.js";import{d as x}from"./mg-character-left2.js";import{d as _}from"./mg-icon2.js";import{d as w}from"./mg-input2.js";import{d as z}from"./mg-input-text2.js";import{d as j}from"./mg-input-title2.js";import{d as V}from"./mg-popover2.js";import{d as E}from"./mg-popover-content2.js";import{d as O}from"./mg-tooltip2.js";import{d as I}from"./mg-tooltip-content2.js";const C=["checkbox","multi"],S=i=>t("div",{class:"mg-c-input__input-group-container","aria-labelledby":i.labelledby,id:i.id},i.checkboxes.map((e=>{var s,a;return t("div",{key:e._id,class:{"mg-c-input__input-group":!0,"mg-c-input__input-group--disabled":i.disabled||e.disabled}},t("input",{type:"checkbox",id:e._id,name:i.name,value:null===(s=e.value)||void 0===s?void 0:""+s,checked:!!e.value,required:e.required,"aria-invalid":(null===(a=i.invalid)||void 0===a?void 0:""+a)||"false",disabled:i.disabled||e.disabled,indeterminate:null===e.value,onInput:e._handleInput,onBlur:e._handleBlur,onKeyDown:e._handleKeydown}),t("label",{htmlFor:e._id},e.title))}))),M=(t,i)=>t.length>i,B=i=>{const e=((t,i)=>[...t].slice(0,i))(i.checkboxes,i.limit),s=n(i.messages.label),a="tab-info-"+i.key;return t("div",{class:"mg-input-checkbox-paginated mg-c-input__tab",slot:"tab_content-"+(i.key+1)},"function"==typeof i.handleMassAction&&i.checkboxes.length>0&&i.checkboxes.some((t=>!0!==t.disabled))&&t("mg-tooltip",{slot:"header-action",class:"mg-c-input__tabs-action",message:i.messages.tooltip},t("mg-button",{variant:"link",onClick:i.handleMassAction},i.messages.action)),t("div",{class:"mg-c-input__tabs-content"},t("p",{id:a,class:{"mg-c-input__popover-info":!0,"mg-u-visually-hidden":0!==e.length},"aria-live":0!==e.length?"polite":void 0},0===e.length?i.messages.noValue:i.messages.values.replace("{count}",""+e.length)),e.length>0&&t(S,{checkboxes:e,labelledby:a,id:s,disabled:i.disabled,name:i.name,invalid:i.invalid}),M(i.checkboxes,i.limit)&&t("mg-button",{key:"load-more",variant:"flat",class:"mg-c-input__load-more",tabIndex:-1,"full-width":!0,onClick:()=>{M(i.checkboxes,i.limit)&&i.handleLoadMore()},"aria-controls":s},t("mg-icon",{icon:"chevron-down"}),i.messages.showMore)))},T=e(class extends s{constructor(i){super(),!1!==i&&this.__registerHost(),this.__attachShadow(),this.valueChange=a(this,"value-change",7),this.inputValid=a(this,"input-valid",7),this.hasDisplayedError=!1,this.customErrorMessage={lock:!1},this.mode="custom",this.baseClassName="mg-c-input--checkbox",this.classTypeMulti="mg-c-input--checkbox-multi",this.classWithValues="mg-c-input--with-values",this.classSearchMode="mg-c-input--search-mode",this.multiStart=5,this.searchStart=10,this.paginatedStep=10,this.hasOpenedPopover=!1,this.checkboxesId="checkboxes-list",this.name=this.identifier,this.labelOnTop=!1,this.labelHide=!1,this.inputVerticalList=!1,this.required=!1,this.readonly=!1,this.displaySelectedValues=!1,this.disabled=!1,this.tooltipPosition="input",this.classCollection=new h([this.baseClassName,m]),this.checkboxItems=[],this.searchValue="",this.searchResults=[],this.selectValuesButtonKey="editButton",this.activeTab=1,this.paginatedLimits={},this.handleInput=t=>{this.updateCheckboxItems("value",!!t.target.checked,(i=>i._id===t.target.id)),this.updateValues(),this.checkValidity(),this.setErrorMessage()},this.handleKeydown=t=>{var i;if("Tab"===t.key&&(null===(i=this.mgPopover)||void 0===i?void 0:i.display)){if(this.searchInput&&t.shiftKey&&this.searchInput.id===t.target.id)return void(this.mgPopover.display=!1);const i=Array.from(this.element.shadowRoot.querySelectorAll("input")).filter((t=>!t.hasAttribute("disabled"))).map((({id:t})=>t)),e=i.findIndex((i=>i===t.target.id));(e+1>=i.length&&!t.shiftKey||0===e&&t.shiftKey&&void 0===this.searchInput)&&(this.mgPopover.display=!1)}},this.handleBlur=()=>{this.checkValidity(),this.setErrorMessage()},this.handleSearchChange=t=>{t.stopPropagation(),t.preventDefault(),this.searchValue=t.detail},this.handleActiveTabChange=t=>{this.activeTab=t.detail,this.resetTabsLimit()},this.handleMgPopoverDisplayChange=t=>{this.hasOpenedPopover=t.detail,this.setButtonTextKey(),t.detail||(this.searchValue="",this.resetTabsLimit(),this.checkValidity()),this.activeTab=this.checkboxItems.some((t=>t.value))?2:1},this.updateValues=()=>{this.value=this.checkboxItems.map((t=>(delete t._handleBlur,delete t._handleInput,delete t._handleKeydown,delete t._id,t)))},this.hasInvalidInput=()=>Array.from(this.element.shadowRoot.querySelectorAll('input[type="checkbox"]')).some((t=>!t.disabled&&!t.checkValidity())),this.updateSearchResults=()=>{this.searchResults=this.checkboxItems.filter((t=>o(t.title).includes(o(this.searchValue))))},this.validateRequired=()=>!this.required||this.checkboxItems.some((({value:t})=>t)),this.checkValidity=()=>{this.setValidity(this.readonly||this.disabled||!this.hasInvalidInput()&&this.validateRequired())},this.setButtonTextKey=()=>{if(this.hasOpenedPopover)return;let t="editButton";this.disabled?t="showButton":this.getSelectedItems().length<1&&(t="selectButton"),this.selectValuesButtonKey=t},this.getSelectValuesButtonMessage=()=>"editButton"===this.selectValuesButtonKey&&c(this.editButtonMessage)?this.editButtonMessage:"showButton"===this.selectValuesButtonKey&&c(this.showButtonMessage)?this.showButtonMessage:"selectButton"===this.selectValuesButtonKey&&c(this.selectButtonMessage)?this.selectButtonMessage:this.messages.input.checkbox[this.selectValuesButtonKey],this.setErrorMessage=(t=!1)=>{this.errorMessage=void 0,this.valid||(t||this.customErrorMessage.lock&&void 0!==this.customErrorMessage.message?this.errorMessage=this.customErrorMessage.message:this.validateRequired()||(this.errorMessage=this.messages.errors.required))},this.getMgPopoverIdentifier=()=>this.identifier+"-input-mg-popover",this.getDisplayItems=()=>this.searchValue.length>0?this.searchResults:this.checkboxItems,this.getSelectedItems=()=>this.checkboxItems.filter((({value:t})=>t)),this.resetTabsLimit=()=>{this.paginatedLimits={}},this.handlePaginatedLoadMore=t=>{var i;this.paginatedLimits=Object.assign(Object.assign({},this.paginatedLimits),{[t]:(null!==(i=this.paginatedLimits[t])&&void 0!==i?i:this.paginatedStep)+this.paginatedStep})},this.renderReadonly=i=>this.inputVerticalList?t("ul",{class:"mg-c-input__readonly-value"},i.map((i=>t("li",{key:i},t("b",null,i))))):t("b",{class:"mg-c-input__readonly-value"},i.join(", ")),this.renderMgInputCheckboxList=()=>t(S,{checkboxes:this.checkboxItems,id:this.checkboxesId,disabled:this.disabled,name:this.name,invalid:this.invalid})}validateValue(t){if(!(t=>Array.isArray(t)&&t.every((t=>"object"==typeof t&&"string"==typeof t.title&&(null===t.value||"boolean"==typeof t.value)&&void 0!==t.value)))(t))throw Error(`<mg-input-checkbox> prop "value" is required and all values must be the same type, ICheckboxItem. Passed value: ${l(t)}.`);this.checkboxItems=t.map(((t,i)=>Object.assign(Object.assign({},t),{_id:`${this.identifier}_${i}`,_handleInput:this.handleInput.bind(this),_handleBlur:this.handleBlur.bind(this),_handleKeydown:this.handleKeydown.bind(this)}))),this.valueChange.emit(t)}validateType(t){if(void 0!==t&&!C.includes(t))throw Error(`<mg-input-checkbox> prop "type" must be a CheckboxType. Passed value: ${l(t)}.`);void 0===t?(this.mode="auto",this.type=C[0]):"multi"===t?(this.classCollection.add(this.classTypeMulti),this.element.dataset.mgPopoverGuard=this.getMgPopoverIdentifier()):this.classCollection.delete(this.classTypeMulti)}watchInputVerticalList(t){t?this.classCollection.add(u):this.classCollection.delete(u)}watchReadonly(t){t?this.classCollection.add(p):this.classCollection.delete(p)}watchDisplaySelectedValues(t){t?this.classCollection.add(this.classWithValues):this.classCollection.delete(this.classWithValues)}handleValidityChange(t,i,e){t&&"readonly"!==e?this.updateCheckboxItems(e,t):this.validateValue(this.value),this.checkValidity(),this.hasDisplayedError&&(this.hasDisplayedError="required"!==e,this.setErrorMessage()),this.setButtonTextKey()}validateDisabled(t){t?this.classCollection.add(g):this.classCollection.delete(g)}validateCheckboxItems(t){"auto"===this.mode&&(this.type=t.length>this.multiStart?"multi":"checkbox"),this.displaySearchInput="multi"===this.type&&t.length>this.searchStart,this.displaySearchInput&&this.updateSearchResults(),this.setButtonTextKey()}watchDisplaySearchInput(t){t?this.classCollection.add(this.classSearchMode):this.classCollection.delete(this.classSearchMode)}validateSearchValue(){this.updateSearchResults()}async setFocus(){var t;null===(t=this.element.shadowRoot.querySelector("input"))||void 0===t||t.focus()}displayError(){return new Promise((t=>{requestAnimationFrame((()=>{this.checkValidity(),this.setErrorMessage(),this.hasDisplayedError=this.invalid,t()}))}))}async setError(t,i,e=!1){if("boolean"!=typeof t)throw Error('<mg-input-checkbox> method "setError()" param "valid" must be a boolean.');if(void 0!==i&&!c(i))throw Error('<mg-input-checkbox> method "setError()" param "errorMessage" must be a string.');this.customErrorMessage={lock:!t&&e,message:t?void 0:i},this.setValidity(t),this.setErrorMessage(!0),this.hasDisplayedError=this.invalid}async reset(){if(!this.readonly)return this.value=this.value.map((t=>Object.assign(Object.assign({},t),{value:!1}))),new Promise((t=>{requestAnimationFrame((()=>{this.customErrorMessage={lock:!1},this.checkValidity(),this.errorMessage=void 0,this.hasDisplayedError=!1,t()}))}))}setValidity(t){const i=this.valid;this.customErrorMessage.lock&&(void 0===this.customErrorMessage.message||t)||(this.valid=t),this.invalid=!this.valid,this.valid!==i&&this.inputValid.emit(this.valid)}updateCheckboxItems(t,i,e){this.checkboxItems=this.checkboxItems.map((s=>(("function"==typeof e&&e(s)||void 0===e)&&(s[t]=i),s)))}componentWillLoad(){return this.messages=d(this.element).messages,r(this),this.validateType(this.type),this.validateValue(this.value),this.validateDisabled(this.disabled),this.watchReadonly(this.readonly),this.watchInputVerticalList(this.inputVerticalList),this.watchDisplaySelectedValues(this.displaySelectedValues),this.watchDisplaySearchInput(this.displaySearchInput),setTimeout((()=>{this.checkValidity()}),0)}componentDidLoad(){var t,i;this.readonly||(this.searchInput=null===(t=this.element.shadowRoot.querySelector("mg-input-text"))||void 0===t?void 0:t.shadowRoot.querySelector("input"),null===(i=this.searchInput)||void 0===i||i.addEventListener("keydown",this.handleKeydown))}renderCheckboxTabs(i){const e=t=>()=>{this.getDisplayItems().forEach((i=>{i.disabled||(i.value=1!==t)})),this.updateValues()},[s,a]=i.checkboxes.reduce(((t,i)=>(t[i.value?0:1].push(i),t)),[[],[]]),n=[Object.assign(Object.assign({},i),{checkboxes:a,messages:Object.assign(Object.assign({},this.messages.input.checkbox.sections.notSelected),{showMore:this.messages.input.showMore}),key:0,handleMassAction:e(0)}),Object.assign(Object.assign({},i),{checkboxes:s,messages:Object.assign(Object.assign({},this.messages.input.checkbox.sections.selected),{showMore:this.messages.input.showMore}),key:1,handleMassAction:e(1)})];return t("mg-tabs",{identifier:this.identifier+"-tabs",class:"mg-c-input__tabs",label:this.messages.input.checkbox.sections.label,items:n.map(((t,i)=>({label:t.messages.title,badge:{value:t.checkboxes.length,label:this.messages.input.checkbox.sections.badge.label,role:"information"},status:i+1===this.activeTab?v.ACTIVE:v.VISIBLE}))),activeTab:this.activeTab,"onActive-tab-change":this.handleActiveTabChange},n.map((i=>{var e;return t(B,Object.assign({},i,{limit:null!==(e=this.paginatedLimits[i.key])&&void 0!==e?e:this.paginatedStep,handleLoadMore:()=>this.handlePaginatedLoadMore(i.key)}))})))}renderCheckboxMulti(){var i;const e=this.getSelectedItems().length,s={readonly:this.readonly,disabled:this.disabled,checkboxes:this.getDisplayItems()},a=Object.assign(Object.assign({},s),{messages:Object.assign(Object.assign({},this.messages.input.checkbox.sections.search),{showMore:this.messages.input.showMore}),key:2,limit:null!==(i=this.paginatedLimits[2])&&void 0!==i?i:this.paginatedStep,handleLoadMore:()=>this.handlePaginatedLoadMore(2)});return t("div",{class:"mg-c-input__input-container"},t("mg-popover",{identifier:this.getMgPopoverIdentifier(),display:this.hasOpenedPopover,"onDisplay-change":this.handleMgPopoverDisplayChange,"data-fallback-placement":"bottom-end",ref:t=>{null!==t&&(this.mgPopover=t)}},t("mg-button",{variant:"secondary","aria-describedby":this.identifier+"-title"},t("mg-icon",{icon:"list"}),this.getSelectValuesButtonMessage()),t("div",{slot:"content",class:"mg-c-input__content"},this.displaySearchInput?[t("mg-input-text",{key:"input-search",identifier:this.identifier+"-input-search",icon:"magnifying-glass",type:"search",placeholder:this.messages.input.checkbox.sections.search.label,label:this.messages.input.checkbox.sections.search.label,mgWidth:"full",value:this.searchValue,labelHide:!0,characterLeftHide:!0,name:"q","onValue-change":this.handleSearchChange}),this.searchValue.length>0?t(B,Object.assign({},a)):this.renderCheckboxTabs(s)]:t(S,Object.assign({},s,{id:this.checkboxesId,name:this.name,invalid:this.invalid})))),this.displaySelectedValues?e>0&&t("ul",{role:"list",class:"mg-c-input__input-container-list"},this.getSelectedItems().map((({title:i})=>t("li",{class:"mg-c-input__input-value",key:i},i)))):t("b",null,this.messages.input.checkbox[e>1?"selectedValues":"selectedValue"].replace("{nb}",e)))}render(){let i;const e=this.value.filter((({value:t})=>t)).map((({title:t})=>t));return i=this.readonly?this.renderReadonly(e):"checkbox"===this.type?this.renderMgInputCheckboxList():this.renderCheckboxMulti(),t("mg-input",{key:"8e403fd79ca8a9bb2db5545e946a3763eb156551",label:this.label,identifier:this.identifier,class:this.classCollection.join(),labelOnTop:this.labelOnTop,labelHide:this.labelHide,required:this.readonly?void 0:this.required,tooltip:this.tooltip,tooltipPosition:this.readonly&&0===e.length?"label":this.tooltipPosition,helpText:this.readonly?void 0:this.helpText,errorMessage:this.readonly?void 0:this.errorMessage},i)}get element(){return this}static get watchers(){return{value:[{validateValue:0}],type:[{validateType:0}],inputVerticalList:[{watchInputVerticalList:0}],readonly:[{watchReadonly:0},{handleValidityChange:0}],displaySelectedValues:[{watchDisplaySelectedValues:0}],required:[{handleValidityChange:0}],disabled:[{handleValidityChange:0},{validateDisabled:0}],checkboxItems:[{validateCheckboxItems:0}],displaySearchInput:[{watchDisplaySearchInput:0}],searchValue:[{validateSearchValue:0}]}}static get style(){return".mg-c-input__readonly-value{min-height:var(--mg-b-font-size);align-self:flex-start;margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2);overflow-wrap:anywhere}.mg-c-input.mg-c-input--fieldset{padding:0;border:0;margin-right:0;margin-left:0}.mg-c-input.mg-c-input--fieldset input[type=radio],.mg-c-input.mg-c-input--fieldset input[type=checkbox]{width:var(--mg-c-input-check-size);height:var(--mg-c-input-check-size);flex-shrink:0;margin:calc((var(--mg-b-font-size)*var(--mg-b-line-height) - var(--mg-c-input-check-size))/2) var(--mg-b-size-8) 0 0}.mg-c-input.mg-c-input--fieldset .mg-c-input__input-group{display:flex;align-items:start}.mg-c-input.mg-c-input--fieldset .mg-c-input__input-group-container{display:flex;flex-wrap:wrap;padding:0;margin:0;margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2);gap:var(--mg-b-size-12) var(--mg-b-size-24);list-style:none}.mg-c-input.mg-c-input--fieldset .mg-c-input__input-group.mg-c-input__input-group--disabled label{opacity:var(--mg-b-opacity-element-disabled)}.mg-c-input.mg-c-input--fieldset.mg-c-input--vertical-list .mg-c-input__input-group-container,.mg-c-input.mg-c-input--fieldset.mg-c-input--checkbox-multi .mg-c-input__input-group-container{flex-direction:column}.mg-c-input.mg-c-input--fieldset.mg-c-input--label-on-top .mg-c-input__input-group-container{margin-top:var(--mg-b-size-8)}.mg-c-input__popover-info{padding:var(--mg-b-size-8);margin:0;color:var(--mg-b-color-neutral-90);text-align:center}.mg-u-visually-hidden{position:absolute !important;overflow:hidden !important;width:.1rem !important;height:.1rem !important;padding:0 !important;border:0 !important;margin:-0.1rem !important;clip-path:inset(50%) !important;white-space:nowrap !important}.mg-u-visually-hidden *{overflow:hidden !important}*:focus:not(:focus-visible){outline:none}@media (prefers-reduced-motion){*{animation:none !important;transition:none !important}}a{color:inherit;text-decoration:underline}a:has(mg-icon){display:inline-flex;align-items:center;gap:var(--mg-b-size-4)}a:hover,a:focus,a:active{text-decoration:none}.mg-c-input.mg-c-input--checkbox-multi .mg-c-input__input-group-container{padding:var(--mg-b-size-4) var(--mg-b-size-8);margin:0}.mg-c-input.mg-c-input--checkbox-multi .mg-c-input__input-container{display:flex;width:unset;flex:unset;flex-wrap:wrap;column-gap:var(--mg-b-size-8)}.mg-c-input.mg-c-input--checkbox-multi .mg-c-input__input-container-list{display:flex;flex-flow:row wrap;padding:0;margin:0;gap:var(--mg-b-size-4);list-style:none}.mg-c-input.mg-c-input--checkbox-multi .mg-c-input__tab{display:block;min-height:calc(var(--mg-b-size-4)*55)}.mg-c-input.mg-c-input--checkbox-multi .mg-c-input__tabs{min-height:0;flex-shrink:1}.mg-c-input.mg-c-input--checkbox-multi .mg-c-input__tabs-action{padding-top:var(--mg-b-size-16);padding-bottom:var(--mg-b-size-12)}.mg-c-input.mg-c-input--checkbox-multi .mg-c-input__tabs-content{height:calc(24*var(--mg-b-size-8) - 2*var(--mg-b-size-8));overflow-y:auto}.mg-c-input.mg-c-input--checkbox-multi .mg-c-input__input-value{display:inline-flex;min-width:var(--mg-b-size-min-height);min-height:var(--mg-b-size-min-height);box-sizing:border-box;align-items:center;justify-content:center;padding:calc((var(--mg-b-size-min-height) - 2*var(--mg-b-size-border) - var(--mg-b-font-size)*var(--mg-b-line-height))/2) var(--mg-b-size-12);border-radius:var(--mg-b-size-4);background-color:var(--mg-b-color-neutral-20);font-size:var(--mg-b-font-size)}.mg-c-input.mg-c-input--checkbox-multi b{margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2)}.mg-c-input.mg-c-input--checkbox-multi.mg-c-input--disabled .mg-c-input__input-container b{opacity:var(--mg-b-opacity-element-disabled)}.mg-c-input.mg-c-input--checkbox-multi.mg-c-input--with-values .mg-c-input__input-container{gap:var(--mg-b-size-4)}.mg-c-input.mg-c-input--checkbox-multi.mg-c-input--search-mode .mg-c-input__content{display:flex;width:calc(var(--mg-b-size-floating-element-max-width) - var(--mg-b-size-16));flex-direction:column;gap:var(--mg-b-size-4)}.mg-c-input.mg-c-input--checkbox-multi.mg-c-input--search-mode .mg-c-input__content .mg-c-input__tabs-content{min-height:calc(var(--mg-b-size-4)*55)}.mg-c-input.mg-c-input--checkbox-multi:not(.mg-c-input--label-on-top) mg-tooltip:not(.mg-c-input__section-header-tootlip){margin-left:var(--mg-b-size-8)}.mg-c-input.mg-c-input--checkbox-multi mg-popover{--mg-c-card-spacing:var(--mg-b-size-8)}.mg-c-input.mg-c-input--readonly ul{display:flex;min-height:var(--mg-b-font-size);flex-flow:column wrap;padding:0;margin:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2) 0 0;list-style:none;row-gap:var(--mg-b-size-8)}"}},[1,"mg-input-checkbox",{value:[1040],type:[1025],identifier:[1],name:[1],label:[1],labelOnTop:[4,"label-on-top"],labelHide:[4,"label-hide"],inputVerticalList:[4,"input-vertical-list"],required:[4],readonly:[4],displaySelectedValues:[4,"display-selected-values"],disabled:[4],tooltip:[1],tooltipPosition:[1,"tooltip-position"],helpText:[1,"help-text"],valid:[1028],invalid:[1028],editButtonMessage:[1,"edit-button-message"],showButtonMessage:[1,"show-button-message"],selectButtonMessage:[1,"select-button-message"],classCollection:[32],errorMessage:[32],checkboxItems:[32],displaySearchInput:[32],searchValue:[32],searchResults:[32],selectValuesButtonKey:[32],activeTab:[32],paginatedLimits:[32],setFocus:[64],displayError:[64],setError:[64],reset:[64]},void 0,{value:[{validateValue:0}],type:[{validateType:0}],inputVerticalList:[{watchInputVerticalList:0}],readonly:[{watchReadonly:0},{handleValidityChange:0}],displaySelectedValues:[{watchDisplaySelectedValues:0}],required:[{handleValidityChange:0}],disabled:[{handleValidityChange:0},{validateDisabled:0}],checkboxItems:[{validateCheckboxItems:0}],displaySearchInput:[{watchDisplaySearchInput:0}],searchValue:[{validateSearchValue:0}]}]);function D(){"undefined"!=typeof customElements&&["mg-input-checkbox","mg-badge","mg-button","mg-card","mg-character-left","mg-icon","mg-input","mg-input-text","mg-input-title","mg-popover","mg-popover-content","mg-tabs","mg-tooltip","mg-tooltip-content"].forEach((t=>{switch(t){case"mg-input-checkbox":customElements.get(i(t))||customElements.define(i(t),T);break;case"mg-badge":customElements.get(i(t))||f();break;case"mg-button":customElements.get(i(t))||y();break;case"mg-card":customElements.get(i(t))||k();break;case"mg-character-left":customElements.get(i(t))||x();break;case"mg-icon":customElements.get(i(t))||_();break;case"mg-input":customElements.get(i(t))||w();break;case"mg-input-text":customElements.get(i(t))||z();break;case"mg-input-title":customElements.get(i(t))||j();break;case"mg-popover":customElements.get(i(t))||V();break;case"mg-popover-content":customElements.get(i(t))||E();break;case"mg-tabs":customElements.get(i(t))||b();break;case"mg-tooltip":customElements.get(i(t))||O();break;case"mg-tooltip-content":customElements.get(i(t))||I()}}))}D();const L=T,q=D;export{L as MgInputCheckbox,q as defineCustomElement}
+import{h as t,transformTag as i,proxyCustomElement as e,HTMLElement as s,createEvent as a}from"@stencil/core/internal/client";import{k as n,C as h,q as o,i as c,t as l}from"./index2.js";import{n as m}from"./index3.js";import{a as r,d as u,c as p,b as g}from"./mg-input.conf.js";import{i as d}from"./index4.js";import{d as b,S as v}from"./mg-tabs2.js";import{d as f}from"./mg-badge2.js";import{d as y}from"./mg-button2.js";import{d as k}from"./mg-card2.js";import{d as x}from"./mg-character-left2.js";import{d as _}from"./mg-icon2.js";import{d as w}from"./mg-input2.js";import{d as z}from"./mg-input-text2.js";import{d as j}from"./mg-input-title2.js";import{d as V}from"./mg-popover2.js";import{d as E}from"./mg-popover-content2.js";import{d as O}from"./mg-tooltip2.js";import{d as I}from"./mg-tooltip-content2.js";const C=["checkbox","multi"],S=i=>t("div",{class:"mg-c-input__input-group-container","aria-labelledby":i.labelledby,id:i.id},i.checkboxes.map((e=>{var s,a;return t("div",{key:e._id,class:{"mg-c-input__input-group":!0,"mg-c-input__input-group--disabled":i.disabled||e.disabled}},t("input",{type:"checkbox",id:e._id,name:i.name,value:null===(s=e.value)||void 0===s?void 0:""+s,checked:!!e.value,required:e.required,"aria-invalid":(null===(a=i.invalid)||void 0===a?void 0:""+a)||"false",disabled:i.disabled||e.disabled,indeterminate:null===e.value,onInput:e._handleInput,onBlur:e._handleBlur,onKeyDown:e._handleKeydown}),t("label",{htmlFor:e._id},e.title))}))),M=(t,i)=>t.length>i,B=i=>{const e=((t,i)=>[...t].slice(0,i))(i.checkboxes,i.limit),s=n(i.messages.label),a="tab-info-"+i.key;return t("div",{class:"mg-input-checkbox-paginated mg-c-input__tab",slot:"tab_content-"+(i.key+1)},"function"==typeof i.handleMassAction&&i.checkboxes.length>0&&i.checkboxes.some((t=>!0!==t.disabled))&&t("mg-tooltip",{slot:"header-action",class:"mg-c-input__tabs-action",message:i.messages.tooltip},t("mg-button",{variant:"link",onClick:i.handleMassAction},i.messages.action)),t("div",{class:"mg-c-input__tabs-content"},t("p",{id:a,class:{"mg-c-input__popover-info":!0,"mg-u-visually-hidden":0!==e.length},"aria-live":0!==e.length?"polite":void 0},0===e.length?i.messages.noValue:i.messages.values.replace("{count}",""+e.length)),e.length>0&&t(S,{checkboxes:e,labelledby:a,id:s,disabled:i.disabled,name:i.name,invalid:i.invalid}),M(i.checkboxes,i.limit)&&t("mg-button",{key:"load-more",variant:"flat",class:"mg-c-input__load-more",tabIndex:-1,"full-width":!0,onClick:()=>{M(i.checkboxes,i.limit)&&i.handleLoadMore()},"aria-controls":s},t("mg-icon",{icon:"chevron-down"}),i.messages.showMore)))},D=e(class extends s{constructor(i){super(),!1!==i&&this.__registerHost(),this.__attachShadow(),this.valueChange=a(this,"value-change",7),this.inputValid=a(this,"input-valid",7),this.hasDisplayedError=!1,this.validityCheckPending=!1,this.customErrorMessage={lock:!1},this.mode="custom",this.baseClassName="mg-c-input--checkbox",this.classTypeMulti="mg-c-input--checkbox-multi",this.classWithValues="mg-c-input--with-values",this.classSearchMode="mg-c-input--search-mode",this.multiStart=5,this.searchStart=10,this.paginatedStep=10,this.hasOpenedPopover=!1,this.checkboxesId="checkboxes-list",this.name=this.identifier,this.labelOnTop=!1,this.labelHide=!1,this.inputVerticalList=!1,this.required=!1,this.readonly=!1,this.displaySelectedValues=!1,this.disabled=!1,this.tooltipPosition="input",this.classCollection=new h([this.baseClassName,r]),this.checkboxItems=[],this.searchValue="",this.searchResults=[],this.selectValuesButtonKey="editButton",this.activeTab=1,this.paginatedLimits={},this.handleInput=t=>{this.updateCheckboxItems("value",!!t.target.checked,(i=>i._id===t.target.id)),this.updateValues(),this.checkValidity(),this.setErrorMessage()},this.handleKeydown=t=>{var i;if("Tab"===t.key&&(null===(i=this.mgPopover)||void 0===i?void 0:i.display)){if(this.searchInput&&t.shiftKey&&this.searchInput.id===t.target.id)return void(this.mgPopover.display=!1);const i=Array.from(this.element.shadowRoot.querySelectorAll("input")).filter((t=>!t.hasAttribute("disabled"))).map((({id:t})=>t)),e=i.findIndex((i=>i===t.target.id));(e+1>=i.length&&!t.shiftKey||0===e&&t.shiftKey&&void 0===this.searchInput)&&(this.mgPopover.display=!1)}},this.handleBlur=()=>{this.checkValidity(),this.setErrorMessage()},this.handleSearchChange=t=>{t.stopPropagation(),t.preventDefault(),this.searchValue=t.detail},this.handleActiveTabChange=t=>{this.activeTab=t.detail,this.resetTabsLimit()},this.handleMgPopoverDisplayChange=t=>{this.hasOpenedPopover=t.detail,this.setButtonTextKey(),t.detail||(this.searchValue="",this.resetTabsLimit(),this.checkValidity()),this.activeTab=this.checkboxItems.some((t=>t.value))?2:1},this.updateValues=()=>{this.value=this.checkboxItems.map((t=>(delete t._handleBlur,delete t._handleInput,delete t._handleKeydown,delete t._id,t)))},this.hasInvalidInput=()=>Array.from(this.element.shadowRoot.querySelectorAll('input[type="checkbox"]')).some((t=>!t.disabled&&!t.checkValidity())),this.updateSearchResults=()=>{this.searchResults=this.checkboxItems.filter((t=>o(t.title).includes(o(this.searchValue))))},this.validateRequired=()=>!this.required||this.checkboxItems.some((({value:t})=>t)),this.checkValidity=()=>{this.setValidity(this.readonly||this.disabled||!this.hasInvalidInput()&&this.validateRequired())},this.setButtonTextKey=()=>{if(this.hasOpenedPopover)return;let t="editButton";this.disabled?t="showButton":this.getSelectedItems().length<1&&(t="selectButton"),this.selectValuesButtonKey=t},this.getSelectValuesButtonMessage=()=>"editButton"===this.selectValuesButtonKey&&c(this.editButtonMessage)?this.editButtonMessage:"showButton"===this.selectValuesButtonKey&&c(this.showButtonMessage)?this.showButtonMessage:"selectButton"===this.selectValuesButtonKey&&c(this.selectButtonMessage)?this.selectButtonMessage:this.messages.input.checkbox[this.selectValuesButtonKey],this.setErrorMessage=(t=!1)=>{this.errorMessage=void 0,this.valid||(t||this.customErrorMessage.lock&&void 0!==this.customErrorMessage.message?this.errorMessage=this.customErrorMessage.message:this.validateRequired()||(this.errorMessage=this.messages.errors.required))},this.getMgPopoverIdentifier=()=>this.identifier+"-input-mg-popover",this.getDisplayItems=()=>this.searchValue.length>0?this.searchResults:this.checkboxItems,this.getSelectedItems=()=>this.checkboxItems.filter((({value:t})=>t)),this.resetTabsLimit=()=>{this.paginatedLimits={}},this.handlePaginatedLoadMore=t=>{var i;this.paginatedLimits=Object.assign(Object.assign({},this.paginatedLimits),{[t]:(null!==(i=this.paginatedLimits[t])&&void 0!==i?i:this.paginatedStep)+this.paginatedStep})},this.renderReadonly=i=>t("b",{class:"mg-c-input__readonly-value"},i.join(", ")),this.renderMgInputCheckboxList=()=>t(S,{checkboxes:this.checkboxItems,id:this.checkboxesId,disabled:this.disabled,name:this.name,invalid:this.invalid})}validateValue(t){if(this.validityCheckPending=!0,!(t=>Array.isArray(t)&&t.every((t=>"object"==typeof t&&"string"==typeof t.title&&(null===t.value||"boolean"==typeof t.value)&&void 0!==t.value)))(t))throw Error(`<mg-input-checkbox> prop "value" is required and all values must be the same type, ICheckboxItem. Passed value: ${l(t)}.`);this.checkboxItems=t.map(((t,i)=>Object.assign(Object.assign({},t),{_id:`${this.identifier}_${i}`,_handleInput:this.handleInput.bind(this),_handleBlur:this.handleBlur.bind(this),_handleKeydown:this.handleKeydown.bind(this)}))),this.valueChange.emit(t)}validateType(t){if(void 0!==t&&!C.includes(t))throw Error(`<mg-input-checkbox> prop "type" must be a CheckboxType. Passed value: ${l(t)}.`);void 0===t?(this.mode="auto",this.type=C[0]):"multi"===t?(this.classCollection.add(this.classTypeMulti),this.element.dataset.mgPopoverGuard=this.getMgPopoverIdentifier()):this.classCollection.delete(this.classTypeMulti)}watchInputVerticalList(t){t?this.classCollection.add(u):this.classCollection.delete(u)}watchReadonly(t){t?this.classCollection.add(p):this.classCollection.delete(p)}watchDisplaySelectedValues(t){t?this.classCollection.add(this.classWithValues):this.classCollection.delete(this.classWithValues)}handleValidityChange(t,i,e){t&&"readonly"!==e?this.updateCheckboxItems(e,t):this.validateValue(this.value),this.checkValidity(),this.hasDisplayedError&&(this.hasDisplayedError="required"!==e,this.setErrorMessage()),this.setButtonTextKey()}validateDisabled(t){t?this.classCollection.add(g):this.classCollection.delete(g)}validateCheckboxItems(t){"auto"===this.mode&&(this.type=t.length>this.multiStart?"multi":"checkbox"),this.displaySearchInput="multi"===this.type&&t.length>this.searchStart,this.displaySearchInput&&this.updateSearchResults(),this.setButtonTextKey()}watchDisplaySearchInput(t){t?this.classCollection.add(this.classSearchMode):this.classCollection.delete(this.classSearchMode)}validateSearchValue(){this.updateSearchResults()}async setFocus(){var t;null===(t=this.element.shadowRoot.querySelector("input"))||void 0===t||t.focus()}displayError(){return new Promise((t=>{requestAnimationFrame((()=>{this.checkValidity(),this.setErrorMessage(),this.hasDisplayedError=this.invalid,t()}))}))}async setError(t,i,e=!1){if("boolean"!=typeof t)throw Error('<mg-input-checkbox> method "setError()" param "valid" must be a boolean.');if(void 0!==i&&!c(i))throw Error('<mg-input-checkbox> method "setError()" param "errorMessage" must be a string.');this.customErrorMessage={lock:!t&&e,message:t?void 0:i},this.validityCheckPending=!1,this.setValidity(t),this.setErrorMessage(!0),this.hasDisplayedError=this.invalid}async reset(){if(!this.readonly)return this.value=this.value.map((t=>Object.assign(Object.assign({},t),{value:!1}))),new Promise((t=>{requestAnimationFrame((()=>{this.customErrorMessage={lock:!1},this.checkValidity(),this.errorMessage=void 0,this.hasDisplayedError=!1,t()}))}))}setValidity(t){const i=this.valid;this.customErrorMessage.lock&&(void 0===this.customErrorMessage.message||t)||(this.valid=t),this.invalid=!this.valid,this.valid!==i&&this.inputValid.emit(this.valid)}updateCheckboxItems(t,i,e){this.checkboxItems=this.checkboxItems.map((s=>(("function"==typeof e&&e(s)||void 0===e)&&(s[t]=i),s)))}componentWillLoad(){return this.messages=d(this.element).messages,m(this),this.validateType(this.type),this.validateValue(this.value),this.validateDisabled(this.disabled),this.watchReadonly(this.readonly),this.watchInputVerticalList(this.inputVerticalList),this.watchDisplaySelectedValues(this.displaySelectedValues),this.watchDisplaySearchInput(this.displaySearchInput),setTimeout((()=>{this.checkValidity(),this.validityCheckPending=!1}),0)}componentDidUpdate(){this.validityCheckPending&&this.checkboxItems.length>0&&(this.validityCheckPending=!1,this.checkValidity(),this.hasDisplayedError&&this.setErrorMessage())}componentDidLoad(){var t,i;this.readonly||(this.searchInput=null===(t=this.element.shadowRoot.querySelector("mg-input-text"))||void 0===t?void 0:t.shadowRoot.querySelector("input"),null===(i=this.searchInput)||void 0===i||i.addEventListener("keydown",this.handleKeydown))}renderCheckboxTabs(i){const e=t=>()=>{this.getDisplayItems().forEach((i=>{i.disabled||(i.value=1!==t)})),this.updateValues()},[s,a]=i.checkboxes.reduce(((t,i)=>(t[i.value?0:1].push(i),t)),[[],[]]),n=[Object.assign(Object.assign({},i),{checkboxes:a,messages:Object.assign(Object.assign({},this.messages.input.checkbox.sections.notSelected),{showMore:this.messages.input.showMore}),key:0,handleMassAction:e(0)}),Object.assign(Object.assign({},i),{checkboxes:s,messages:Object.assign(Object.assign({},this.messages.input.checkbox.sections.selected),{showMore:this.messages.input.showMore}),key:1,handleMassAction:e(1)})];return t("mg-tabs",{identifier:this.identifier+"-tabs",class:"mg-c-input__tabs",label:this.messages.input.checkbox.sections.label,items:n.map(((t,i)=>({label:t.messages.title,badge:{value:t.checkboxes.length,label:this.messages.input.checkbox.sections.badge.label,role:"information"},status:i+1===this.activeTab?v.ACTIVE:v.VISIBLE}))),activeTab:this.activeTab,"onActive-tab-change":this.handleActiveTabChange},n.map((i=>{var e;return t(B,Object.assign({},i,{limit:null!==(e=this.paginatedLimits[i.key])&&void 0!==e?e:this.paginatedStep,handleLoadMore:()=>this.handlePaginatedLoadMore(i.key)}))})))}renderCheckboxMulti(){var i;const e=this.getSelectedItems().length,s={readonly:this.readonly,disabled:this.disabled,checkboxes:this.getDisplayItems()},a=Object.assign(Object.assign({},s),{messages:Object.assign(Object.assign({},this.messages.input.checkbox.sections.search),{showMore:this.messages.input.showMore}),key:2,limit:null!==(i=this.paginatedLimits[2])&&void 0!==i?i:this.paginatedStep,handleLoadMore:()=>this.handlePaginatedLoadMore(2)});return t("div",{class:"mg-c-input__input-container"},t("mg-popover",{identifier:this.getMgPopoverIdentifier(),display:this.hasOpenedPopover,"onDisplay-change":this.handleMgPopoverDisplayChange,"data-fallback-placement":"bottom-end",ref:t=>{null!==t&&(this.mgPopover=t)}},t("mg-button",{variant:"secondary","aria-describedby":this.identifier+"-title"},t("mg-icon",{icon:"list"}),this.getSelectValuesButtonMessage()),t("div",{slot:"content",class:"mg-c-input__content"},this.displaySearchInput?[t("mg-input-text",{key:"input-search",identifier:this.identifier+"-input-search",icon:"magnifying-glass",type:"search",placeholder:this.messages.input.checkbox.sections.search.label,label:this.messages.input.checkbox.sections.search.label,mgWidth:"full",value:this.searchValue,labelHide:!0,characterLeftHide:!0,name:"q","onValue-change":this.handleSearchChange}),this.searchValue.length>0?t(B,Object.assign({},a)):this.renderCheckboxTabs(s)]:t(S,Object.assign({},s,{id:this.checkboxesId,name:this.name,invalid:this.invalid})))),this.displaySelectedValues?e>0&&t("ul",{role:"list",class:"mg-c-input__input-container-list"},this.getSelectedItems().map((({title:i})=>t("li",{class:"mg-c-input__input-value",key:i},i)))):t("b",null,this.messages.input.checkbox[e>1?"selectedValues":"selectedValue"].replace("{nb}",e)))}render(){let i;const e=this.value.filter((({value:t})=>t)).map((({title:t})=>t));return i=this.readonly?this.renderReadonly(e):"checkbox"===this.type?this.renderMgInputCheckboxList():this.renderCheckboxMulti(),t("mg-input",{key:"e873b2c1a5e96f5f424f21e3531c6c63c1d9ff39",label:this.label,identifier:this.identifier,class:this.classCollection.join(),labelOnTop:this.labelOnTop,labelHide:this.labelHide,required:this.readonly?void 0:this.required,tooltip:this.tooltip,tooltipPosition:this.readonly&&0===e.length?"label":this.tooltipPosition,helpText:this.readonly?void 0:this.helpText,errorMessage:this.readonly?void 0:this.errorMessage},i)}get element(){return this}static get watchers(){return{value:[{validateValue:0}],type:[{validateType:0}],inputVerticalList:[{watchInputVerticalList:0}],readonly:[{watchReadonly:0},{handleValidityChange:0}],displaySelectedValues:[{watchDisplaySelectedValues:0}],required:[{handleValidityChange:0}],disabled:[{handleValidityChange:0},{validateDisabled:0}],checkboxItems:[{validateCheckboxItems:0}],displaySearchInput:[{watchDisplaySearchInput:0}],searchValue:[{validateSearchValue:0}]}}static get style(){return".mg-c-input__readonly-value{min-height:var(--mg-b-font-size);align-self:flex-start;margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2);overflow-wrap:anywhere}.mg-c-input--label-on-top .mg-c-input__readonly-value{margin-top:0}.mg-c-input.mg-c-input--fieldset{padding:0;border:0;margin-right:0;margin-left:0}.mg-c-input.mg-c-input--fieldset input[type=radio],.mg-c-input.mg-c-input--fieldset input[type=checkbox]{width:var(--mg-c-input-check-size);height:var(--mg-c-input-check-size);flex-shrink:0;margin:calc((var(--mg-b-font-size)*var(--mg-b-line-height) - var(--mg-c-input-check-size))/2) var(--mg-b-size-8) 0 0}.mg-c-input.mg-c-input--fieldset .mg-c-input__input-group{display:flex;align-items:start}.mg-c-input.mg-c-input--fieldset .mg-c-input__input-group-container{display:flex;flex-wrap:wrap;padding:0;margin:0;margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2);gap:var(--mg-b-size-12) var(--mg-b-size-24);list-style:none}.mg-c-input.mg-c-input--fieldset .mg-c-input__input-group.mg-c-input__input-group--disabled label{opacity:var(--mg-b-opacity-element-disabled)}.mg-c-input.mg-c-input--fieldset.mg-c-input--vertical-list .mg-c-input__input-group-container,.mg-c-input.mg-c-input--fieldset.mg-c-input--checkbox-multi .mg-c-input__input-group-container{flex-direction:column}.mg-c-input.mg-c-input--fieldset.mg-c-input--label-on-top .mg-c-input__input-group-container{margin-top:var(--mg-b-size-8)}.mg-c-input__popover-info{padding:var(--mg-b-size-8);margin:0;color:var(--mg-b-color-neutral-90);text-align:center}.mg-u-visually-hidden{position:absolute !important;overflow:hidden !important;width:.1rem !important;height:.1rem !important;padding:0 !important;border:0 !important;margin:-0.1rem !important;clip-path:inset(50%) !important;white-space:nowrap !important}.mg-u-visually-hidden *{overflow:hidden !important}*:focus:not(:focus-visible){outline:none}@media (prefers-reduced-motion){*{animation:none !important;transition:none !important}}a{color:inherit;text-decoration:underline}a:has(mg-icon){display:inline-flex;align-items:center;gap:var(--mg-b-size-4)}a:hover,a:focus,a:active{text-decoration:none}.mg-c-input.mg-c-input--checkbox-multi .mg-c-input__input-group-container{padding:var(--mg-b-size-4) var(--mg-b-size-8);margin:0}.mg-c-input.mg-c-input--checkbox-multi .mg-c-input__input-container{display:flex;width:unset;flex:unset;flex-wrap:wrap;column-gap:var(--mg-b-size-8)}.mg-c-input.mg-c-input--checkbox-multi .mg-c-input__input-container-list{display:flex;flex-flow:row wrap;padding:0;margin:0;gap:var(--mg-b-size-4);list-style:none}.mg-c-input.mg-c-input--checkbox-multi .mg-c-input__tab{display:block;min-height:calc(var(--mg-b-size-4)*55)}.mg-c-input.mg-c-input--checkbox-multi .mg-c-input__tabs{min-height:0;flex-shrink:1}.mg-c-input.mg-c-input--checkbox-multi .mg-c-input__tabs-action{padding-top:var(--mg-b-size-16);padding-bottom:var(--mg-b-size-12)}.mg-c-input.mg-c-input--checkbox-multi .mg-c-input__tabs-content{height:calc(24*var(--mg-b-size-8) - 2*var(--mg-b-size-8));overflow-y:auto}.mg-c-input.mg-c-input--checkbox-multi .mg-c-input__input-value{display:inline-flex;min-width:var(--mg-b-size-min-height);min-height:var(--mg-b-size-min-height);box-sizing:border-box;align-items:center;justify-content:center;padding:calc((var(--mg-b-size-min-height) - 2*var(--mg-b-size-border) - var(--mg-b-font-size)*var(--mg-b-line-height))/2) var(--mg-b-size-12);border-radius:var(--mg-b-size-4);background-color:var(--mg-b-color-neutral-20);font-size:var(--mg-b-font-size)}.mg-c-input.mg-c-input--checkbox-multi b{margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2)}.mg-c-input.mg-c-input--checkbox-multi.mg-c-input--label-on-top b.mg-c-input__readonly-value{margin-top:0}.mg-c-input.mg-c-input--checkbox-multi.mg-c-input--disabled .mg-c-input__input-container b{opacity:var(--mg-b-opacity-element-disabled)}.mg-c-input.mg-c-input--checkbox-multi.mg-c-input--with-values .mg-c-input__input-container{gap:var(--mg-b-size-4)}.mg-c-input.mg-c-input--checkbox-multi.mg-c-input--search-mode .mg-c-input__content{display:flex;width:calc(var(--mg-b-size-floating-element-max-width) - var(--mg-b-size-16));flex-direction:column;gap:var(--mg-b-size-4)}.mg-c-input.mg-c-input--checkbox-multi.mg-c-input--search-mode .mg-c-input__content .mg-c-input__tabs-content{min-height:calc(var(--mg-b-size-4)*55)}.mg-c-input.mg-c-input--checkbox-multi:not(.mg-c-input--label-on-top) mg-tooltip:not(.mg-c-input__section-header-tootlip){margin-left:var(--mg-b-size-8)}.mg-c-input.mg-c-input--checkbox-multi mg-popover{--mg-c-card-spacing:var(--mg-b-size-8)}"}},[1,"mg-input-checkbox",{value:[1040],type:[1025],identifier:[1],name:[1],label:[1],labelOnTop:[4,"label-on-top"],labelHide:[4,"label-hide"],inputVerticalList:[4,"input-vertical-list"],required:[4],readonly:[4],displaySelectedValues:[4,"display-selected-values"],disabled:[4],tooltip:[1],tooltipPosition:[1,"tooltip-position"],helpText:[1,"help-text"],valid:[1028],invalid:[1028],editButtonMessage:[1,"edit-button-message"],showButtonMessage:[1,"show-button-message"],selectButtonMessage:[1,"select-button-message"],classCollection:[32],errorMessage:[32],checkboxItems:[32],displaySearchInput:[32],searchValue:[32],searchResults:[32],selectValuesButtonKey:[32],activeTab:[32],paginatedLimits:[32],setFocus:[64],displayError:[64],setError:[64],reset:[64]},void 0,{value:[{validateValue:0}],type:[{validateType:0}],inputVerticalList:[{watchInputVerticalList:0}],readonly:[{watchReadonly:0},{handleValidityChange:0}],displaySelectedValues:[{watchDisplaySelectedValues:0}],required:[{handleValidityChange:0}],disabled:[{handleValidityChange:0},{validateDisabled:0}],checkboxItems:[{validateCheckboxItems:0}],displaySearchInput:[{watchDisplaySearchInput:0}],searchValue:[{validateSearchValue:0}]}]);function T(){"undefined"!=typeof customElements&&["mg-input-checkbox","mg-badge","mg-button","mg-card","mg-character-left","mg-icon","mg-input","mg-input-text","mg-input-title","mg-popover","mg-popover-content","mg-tabs","mg-tooltip","mg-tooltip-content"].forEach((t=>{switch(t){case"mg-input-checkbox":customElements.get(i(t))||customElements.define(i(t),D);break;case"mg-badge":customElements.get(i(t))||f();break;case"mg-button":customElements.get(i(t))||y();break;case"mg-card":customElements.get(i(t))||k();break;case"mg-character-left":customElements.get(i(t))||x();break;case"mg-icon":customElements.get(i(t))||_();break;case"mg-input":customElements.get(i(t))||w();break;case"mg-input-text":customElements.get(i(t))||z();break;case"mg-input-title":customElements.get(i(t))||j();break;case"mg-popover":customElements.get(i(t))||V();break;case"mg-popover-content":customElements.get(i(t))||E();break;case"mg-tabs":customElements.get(i(t))||b();break;case"mg-tooltip":customElements.get(i(t))||O();break;case"mg-tooltip-content":customElements.get(i(t))||I()}}))}T();const L=D,q=T;export{L as MgInputCheckbox,q as defineCustomElement}

package/dist/components/mg-input-combobox.js

@@ -1 +1 @@
-import{transformTag as t,proxyCustomElement as i,HTMLElement as s,createEvent as o,h as e}from"@stencil/core/internal/client";import{P as n,C as a,t as r,e as c,n as h,f as p,h as m,d as l,i as u,j as g,k as d}from"./index2.js";import{n as b}from"./index3.js";import{c as v,b as f,w}from"./mg-input.conf.js";import{i as _}from"./index4.js";import{K as x}from"./events.utils.js";import{d as y}from"./mg-button2.js";import{d as z}from"./mg-card2.js";import{d as k}from"./mg-icon2.js";import{d as E}from"./mg-input2.js";import{d as j}from"./mg-input-title2.js";import{d as F}from"./mg-loader2.js";import{d as O}from"./mg-popover2.js";import{d as q}from"./mg-popover-content2.js";import{d as C}from"./mg-tooltip2.js";import{d as D}from"./mg-tooltip-content2.js";const P=t=>t&&"object"==typeof t&&"string"==typeof t.title&&void 0!==t.value,V=i(class extends s{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.valueChange=o(this,"value-change",7),this.filterChange=o(this,"filter-change",7),this.showMore=o(this,"load-more",7),this.inputValid=o(this,"input-valid",7),this.fetchError=o(this,"fetch-error",7),this.hasDisplayedError=!1,this.customErrorMessage={lock:!1},this.name=this.identifier,this.labelOnTop=!1,this.labelHide=!1,this.required=!1,this.readonly=!1,this.disabled=!1,this.mgWidth="full",this.popoverPlacement="bottom-start",this.tooltipPosition="input",this.options=new n([]),this.filter="",this.classCollection=new a(["mg-c-input--combobox","mg-c-input--has-icon","mg-c-input--input-append"]),this.popoverDisplay=!1,this.handleOptionClick=t=>{this.setValue(this.options.items.find((i=>r(i.value)===t.target.dataset.value))),this.popoverDisplay=!1},this.handleResetButton=t=>{t.stopPropagation(),this.reset().then((()=>{this.input.focus()}))},this.handlePopoverDisplay=t=>{this.popoverDisplay=t.detail},this.handleFilterInput=()=>{this.checkValidity(),this.hasDisplayedError&&this.setErrorMessage(),this.popoverDisplay||(this.popoverDisplay=!0),this.debounce||(this.debounce=!0,setTimeout((()=>{this.filter=this.input.value,this.debounce=!1}),250))},this.handleFilterBlur=t=>{this.popoverDisplay?(t.stopImmediatePropagation(),this.input.focus()):(this.handlerInProgress="blur",this.displayError().finally((()=>{this.handlerInProgress=void 0})))},this.handleFilterFocus=()=>{this.isLoading||(this.option=null)},this.handleLoadMoreButton=()=>{this.loadingWrapper({name:"load-more",cursor:c.NEXT}).then((()=>{this.input.focus()}))},this.handleFilterKeydown=t=>{var i;if(this.disabled||t.ctrlKey||t.shiftKey)return;let s=!1;switch(t.key){case x.TAB:case x.ENTER:{s=t.key===x.ENTER;const o=null!==(i=this.option)&&void 0!==i?i:this.options.items.find(this.isCurrentOption);this.popoverDisplay&&this.setValue(o),this.popoverDisplay=!1;break}case x.DOWN:case x.ARROWDOWN:case x.UP:case x.ARROWUP:{if(s=!0,this.isLoading||0===this.page.total){this.popoverDisplay=!0;break}if(t.altKey&&[x.DOWN,x.ARROWDOWN].includes(t.key)){this.popoverDisplay=!0;break}let i;const o=this.popoverDisplay&&P(this.option);[x.DOWN,x.ARROWDOWN].includes(t.key)?i=o?c.NEXT:c.FIRST:[x.UP,x.ARROWUP].includes(t.key)&&(i=o?c.PREVIOUS:c.LAST),this.loadingWrapper({name:"scroll",cursor:i}),this.popoverDisplay=!0;break}case x.LEFT:case x.ARROWLEFT:case x.HOME:case x.RIGHT:case x.ARROWRIGHT:case x.END:{if(!P(this.option))break;let i;s=!0,this.option=null,x.HOME===t.key?i=0:x.END===t.key&&(i=this.filter.length),"number"==typeof i&&this.input.setSelectionRange(i,i);break}case x.ESC:case x.ESCAPE:s=!0,this.popoverDisplay?this.popoverDisplay=!1:(this.setValue(null),this.filter="",this.option=null);break;default:this.option=null}s&&(t.stopPropagation(),t.preventDefault())},this.scrollToIndex=t=>{requestAnimationFrame((()=>{var i;this.popoverDisplay&&(null===(i=this.element.shadowRoot.querySelector(`li:nth-of-type(${(t||0)+this.page.baseIndex})`))||void 0===i||i.scrollIntoView({block:"nearest"}))}))},this.isCurrentOption=t=>(P(this.value)?this.value.value:this.value)===t.value,this.getValueTitle=()=>this.value&&P(this.value)?this.value.title:"string"==typeof this.value?this.value:"",this.checkValidity=()=>{this.setValidity(this.readonly||this.disabled||this.input.checkValidity())},this.setErrorMessage=(t=!1)=>{this.errorMessage=void 0,this.valid||(t||this.customErrorMessage.lock&&void 0!==this.customErrorMessage.message?this.errorMessage=this.customErrorMessage.message:this.input.validity.valueMissing&&(this.errorMessage=this.messages.errors.required))},this.getFirstPage=()=>this.options.getPage(0,(t=>""===this.filter||t.title.toLocaleLowerCase().includes(this.filter.toLocaleLowerCase()))),this.loadingWrapper=t=>{var i;let s,o;if(null!==(i=this.loadingAction)&&void 0!==i||(this.loadingAction=t.name),this.option&&"load-more"!==this.loadingAction?o=this.page.items.findIndex((t=>r(t.value)===r(this.option.value))):"load-more"===this.loadingAction&&(o=this.page.items.length-this.page.baseIndex),"load-more"===t.name)this.isLoading=!0,s=this.goToNextPage;else{if(t.cursor===c.NEXT&&this.page.items.length<=this.page.total&&o+this.page.baseIndex===this.page.items.length&&o+this.page.baseIndex<this.page.total)return void this.loadMoreElement.click();s="scroll"===t.name?h:this.updatePage}return s().then((()=>{const i=""===this.filter?this.options.items:this.options.items.filter((t=>t.title.includes(this.filter)));"load-data"!==t.name&&(o=this.page.getIndexFromCursor(t.cursor,"load-more"===this.loadingAction&&o>=0?i[o]:this.option)),this.option=i[o],this.scrollToIndex(o)})).finally((()=>{requestAnimationFrame((()=>{this.isLoading=!1,this.loadingAction=void 0}))}))},this.goToNextPage=()=>(this.showMore.emit(),void 0!==this.fetchurl?this.getOptions("string"==typeof this.page.next?this.page.next:void 0).then((t=>{if(void 0!==t){const i=[...this.page.items,...t.items];this.options=new n(i,{total:t.total,next:t.next,top:i.length})}})):h((()=>{if("function"==typeof this.page.next){const t=this.page.next();this.page=new p(Object.assign(Object.assign({},t),{items:[...this.page.items,...t.items]}))}}))),this.updatePage=async()=>{if(void 0!==this.fetchurl)return this.getOptions().then((t=>{void 0!==t&&(this.options=new n(t.items,{total:t.total,next:t.next,top:t.top}))}));this.page=this.getFirstPage()},this.getOptions=async(t=this.fetchurl)=>{const i="function"==typeof this.fetchmappings.request.filterTransform?this.fetchmappings.request.filterTransform(this.filter):this.filter,s=("string"==typeof t?t:""+t).replaceAll(this.fetchmappings.request.filter,encodeURIComponent(i));try{const t=await fetch(s,this.fetchoptions);if(!t.ok)return void this.fetchError.emit(Error(`${t.status} - ${t.statusText}`));const i=await t.json(),o=m(i,this.fetchmappings.response.items).map((t=>{var i;return{title:m(t,this.fetchmappings.response.itemTitle),value:null!==(i=m(t,this.fetchmappings.response.itemValue))&&void 0!==i?i:t}})),e=Number(m(i,this.fetchmappings.response.total,0));let n=m(i,this.fetchmappings.response.next);if(n&&!URL.canParse(n)){const t=new URL(s,this.element.ownerDocument.baseURI);n=""+new URL(n,t)}return{items:o,total:e,next:n,top:o.length}}catch(t){this.fetchError.emit(t)}}}watchValue(t){this.filter=this.getValueTitle(),this.valueChange.emit(t)}watchItems(t){if(void 0===this.fetchurl||void 0!==t){if(void 0!==this.fetchurl&&void 0!==t)throw Error(`<mg-input-combobox> prop "items" values cannot be use with "fetchurl" prop defined. Passed value: ${r(t)}.`);if(Array.isArray(t)&&0===t.length)this.options=new n([]);else if(l(t))this.options=new n(t.map((t=>({title:t,value:t}))),{total:t.length});else{if(!(t=>Array.isArray(t)&&t.every(P))(t))throw Error(`<mg-input-combobox> prop "items" values must be the same type, string or Option. Passed value: ${r(t)}.`);this.options=new n(t,{total:t.length})}}}watchIdentifier(t){u(t)&&(this.popoverId=t+"-popover",this.element.dataset.mgPopoverGuard=this.popoverId)}watchReadonly(t){t?this.classCollection.add(v):this.classCollection.delete(v)}watchValidityChange(t,i,s){void 0!==this.input&&(this.input[s]=t,this.checkValidity(),this.hasDisplayedError&&(this.setErrorMessage(),this.hasDisplayedError=!1))}watchDisabled(t){t?this.classCollection.add(f):this.classCollection.delete(f)}watchMgWidth(t){w.forEach((t=>{this.classCollection.delete("mg-c-input--width-"+t)})),void 0!==t&&this.classCollection.add("mg-c-input--width-"+this.mgWidth),this.classCollection=new a(this.classCollection.classes)}watchFetchUrl(t){void 0!==t&&this.loadingWrapper({name:"load-data"})}watchFetchOptions(t){if(this.fetchurl&&t&&!g(t))throw Error(`<mg-input-combobox> prop "fetchoptions" value must be a valid RequestInit. Passed value: ${r(t)}.`)}watchFetchMappings(t){if(void 0!==this.fetchurl&&!g(t))throw Error('<mg-input-combobox> prop "fetchmappings" is required with "fetchurl" prop.');if(void 0!==t&&!(t=>{const i=g(t)&&Object.hasOwn(t,"request")&&Object.hasOwn(t,"response");if(i){const{request:i,response:s}=t;return![i,s].some((t=>!g(t)))&&!("string"!=typeof i.filter||void 0!==i.filterTransform&&"function"!=typeof i.filterTransform||"object"!=typeof s||"string"!=typeof s.total||"string"!=typeof s.items||"string"!=typeof s.next||"string"!=typeof s.itemTitle||"string"!=typeof s.itemValue&&void 0!==s.itemValue)}return i})(t))throw Error(`<mg-input-combobox> prop "fetchmappings" value must be { request: RequestMappingType, response: ResponseMappingType }. Passed value: ${r(t)}.`)}watchOptions(){this.page=this.getFirstPage()}watchFilter(t){this.loadingWrapper({name:"load-data"}),this.filterChange.emit(t)}watchPopoverDisplay(t){t?this.input.focus():(this.option=null,this.filter=this.getValueTitle(),this.handlerInProgress="blur",this.displayError().finally((()=>{this.handlerInProgress=void 0})))}async setFocus(){var t;null===(t=this.input)||void 0===t||t.focus()}displayError(){return new Promise((t=>{requestAnimationFrame((()=>{this.checkValidity(),this.setErrorMessage(),this.hasDisplayedError=this.invalid,t()}))}))}async setError(t,i,s=!1){if("boolean"!=typeof t)throw Error('<mg-input-combobox> method "setError()" param "valid" must be a boolean.');if(void 0!==i&&!u(i))throw Error('<mg-input-combobox> method "setError()" param "errorMessage" must be a string.');this.customErrorMessage={lock:!t&&s,message:t?void 0:i},this.setValidity(t),this.setErrorMessage(!0),this.hasDisplayedError=this.invalid}async reset(){if(!this.readonly)return this.setValue(null),this.option=null,this.filter="",new Promise((t=>{requestAnimationFrame((()=>{this.customErrorMessage={lock:!1},this.checkValidity(),this.errorMessage=void 0,this.hasDisplayedError=!1,t()}))}))}setValue(t){this.value=P(t)?l(this.items||this.options.items)?t.title:Object.assign({},t):""}setValidity(t){const i=this.valid;this.customErrorMessage.lock&&(void 0===this.customErrorMessage.message||t)||(this.valid=t),this.invalid=!this.valid,(void 0===this.handlerInProgress||"blur"===this.handlerInProgress&&this.valid!==i)&&this.inputValid.emit(this.valid)}componentWillLoad(){return this.messages=_(this.element).messages,b(this),this.watchIdentifier(this.identifier),this.watchItems(this.items),void 0!==this.fetchurl&&(this.watchFetchOptions(this.fetchoptions),this.watchFetchMappings(this.fetchmappings),this.loadingWrapper({name:"load-data"})),this.watchValue(this.value),this.watchOptions(),this.watchMgWidth(this.mgWidth),this.watchReadonly(this.readonly),this.watchDisabled(this.disabled),setTimeout((()=>{this.checkValidity()}),0)}render(){var t,i,s,o,n,a;const c=this.identifier+"-list",h=this.getValueTitle(),p=this.value&&!this.disabled;let m,l;return(null===(t=this.page)||void 0===t?void 0:t.items.length)>0?m="list":0===(null===(i=this.page)||void 0===i?void 0:i.items.length)&&this.filter.length>0?m="notfound":0===(null===(s=this.page)||void 0===s?void 0:s.items.length)&&(m="notavailable"),l=void 0!==(null===(o=this.option)||void 0===o?void 0:o.value)?this.option.value:"string"==typeof this.value?this.value:null===(n=this.value)||void 0===n?void 0:n.value,e("mg-input",{key:"c8cff9468c9bfdcc6dd5c96c1452ad81620e050c",label:this.label,identifier:this.identifier,class:this.classCollection.classes.join(" "),ariaDescribedbyIDs:m&&"list"!==m?m:void 0,labelOnTop:this.labelOnTop,labelHide:this.labelHide,required:this.required,tooltip:this.tooltip,tooltipPosition:this.readonly&&void 0===this.value?"label":this.tooltipPosition,helpText:this.helpText,errorMessage:this.errorMessage},this.readonly?h&&e("b",{class:"mg-c-input__readonly-value"},h):e("mg-popover",{identifier:this.popoverId,placement:this.popoverPlacement,display:this.popoverDisplay,style:{"--mg-c-input-list-width":(null===(a=this.input)||void 0===a?void 0:a.offsetWidth)>0?this.input.offsetWidth+"px":void 0},"data-fallback-placement":"bottom-end","onDisplay-change":this.handlePopoverDisplay},e("div",{class:"mg-c-input__input-group-container"},e("mg-icon",{icon:"magnifying-glass"}),e("input",{type:"text",role:"combobox",class:"mg-c-input__box mg-c-input__box--width",value:this.filter,id:this.identifier,name:this.name,placeholder:this.placeholder,title:this.placeholder,disabled:this.disabled,required:this.required,autocomplete:"off","aria-autocomplete":"list","aria-expanded":""+this.popoverDisplay,"aria-controls":c,"aria-invalid":""+(!0===this.invalid),"aria-activedescendant":d(l),onInput:this.handleFilterInput,onBlur:this.handleFilterBlur,onFocus:this.handleFilterFocus,onKeyDown:this.handleFilterKeydown,ref:t=>{null!==t&&(this.input=t)}}),p?e("mg-button",{class:"mg-c-input__box-append mg-c-input__reset",variant:"flat","is-icon":!0,label:this.messages.general.reset,"aria-controls":this.identifier,tabindex:"-1",onClick:this.handleResetButton},e("mg-icon",{icon:"cross"})):e("mg-button",{class:"mg-c-input__box-append",variant:"flat","is-icon":!0,label:this.itemsLabel,tabindex:"-1",disabled:this.disabled},e("mg-icon",{icon:"chevron-"+(this.popoverDisplay?"up":"down")}))),e("div",{slot:"content",class:"mg-c-input__popover-container"},"list"===m&&[e("ul",{key:"list",class:"mg-c-input__input-list",role:"listbox",id:c,"aria-label":this.itemsLabel,"aria-setsize":this.page.total},this.page.items.map((t=>{var i;return e("li",{role:"option",class:{"mg-c-input__input-list-item":!0,"mg-c-input__input-list-item--focus-visible":JSON.stringify(null===(i=this.option)||void 0===i?void 0:i.value)===JSON.stringify(t.value),"mg-c-input__input-list-item--selected":this.isCurrentOption(t)},key:t.title,id:d(t.value),"aria-selected":""+this.isCurrentOption(t),"data-value":r(t.value),onClick:this.handleOptionClick},t.title,this.isCurrentOption(t)&&e("mg-icon",{icon:"check"}))}))),this.isLoading&&e("mg-loader",{key:"loader",message:this.messages.input.combobox.search,class:{"mg-u-visually-hidden":!!this.page.next}}),this.page.next&&e("mg-button",{key:"load-more",variant:"flat",class:"mg-c-input__load-more",tabIndex:-1,disabled:this.isLoading,"full-width":!0,"disable-on-click":!0,onClick:this.handleLoadMoreButton,"aria-controls":c,ref:t=>{null!==t&&(this.loadMoreElement=t)}},e("mg-icon",{icon:"chevron-down"}),this.messages.input.showMore)],"notfound"===m&&e("p",{id:m,class:"mg-c-input__popover-info"},this.messages.input.combobox.notFound),"notavailable"===m&&e("p",{id:m,class:"mg-c-input__popover-info"},this.messages.input.combobox.notAvailable))))}get element(){return this}static get watchers(){return{value:[{watchValue:0}],items:[{watchItems:0}],identifier:[{watchIdentifier:0}],readonly:[{watchReadonly:0},{watchValidityChange:0}],required:[{watchValidityChange:0}],disabled:[{watchValidityChange:0},{watchDisabled:0}],mgWidth:[{watchMgWidth:0}],fetchurl:[{watchFetchUrl:0}],fetchoptions:[{watchFetchOptions:0}],fetchmappings:[{watchFetchMappings:0}],options:[{watchOptions:0}],filter:[{watchFilter:0}],popoverDisplay:[{watchPopoverDisplay:0}]}}static get style(){return".mg-c-input__box{height:var(--mg-b-size-min-height);box-sizing:border-box;padding:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2) var(--mg-b-size-8);border-width:var(--mg-c-input-border-width);border-style:solid;border-color:var(--mg-c-input-color-border);border-radius:var(--mg-c-input-border-radius);background-color:var(--mg-b-color-light);color:var(--mg-b-color-dark);font-family:inherit;font-size:var(--mg-b-font-size);text-align:var(--mg-c-input-text-align, left)}.mg-c-input__box::placeholder{color:var(--mg-c-input-placeholder-color-text);font-style:italic}.mg-c-input__box:focus{box-shadow:0 0 var(--mg-b-size-4) var(--mg-c-input-color-box-shadow-focus)}.mg-c-input__box:disabled{opacity:var(--mg-b-opacity-element-disabled)}.mg-c-input.mg-c-input--has-error .mg-c-input__box{border-color:var(--mg-b-color-danger)}.mg-c-input.mg-c-input--is-input-group-append{--mg-c-button-border-radius-top-left:0;--mg-c-button-border-radius-bottom-left:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box{margin-right:calc(-1*var(--mg-b-size-border));border-bottom-right-radius:0;border-top-right-radius:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box:focus-visible{outline-offset:calc(-1*var(--mg-b-size-2));outline-style:solid;outline-width:var(--mg-b-size-2)}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]){--mg-c-button-border-radius-top-right:0;--mg-c-button-border-radius-bottom-right:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:not(:last-of-type)){--mg-c-button-border-right-width:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:last-of-type){--mg-c-button-border-radius-top-right:var(--mg-c-input-border-radius);--mg-c-button-border-radius-bottom-right:var(--mg-c-input-border-radius)}.mg-c-input.mg-c-input--is-append-input-slot-content:not(.mg-c-input--readonly) ::slotted([slot=append-input]){align-self:start;padding-top:calc((var(--mg-b-size-min-height) - var(--mg-b-size-16))/2)}.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container{position:relative}.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container>mg-icon:first-of-type{position:absolute;top:50%;left:var(--mg-b-size-8);color:var(--mg-c-input-color-icon);transform:translateY(-50%)}.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container .mg-c-input__box{padding-left:calc(var(--mg-b-size-16) + var(--mg-b-size-8)*2)}.mg-c-input__popover-info{padding:var(--mg-b-size-8);margin:0;color:var(--mg-b-color-neutral-90);text-align:center}.mg-c-input__input-container{width:100%;flex:1 auto}.mg-c-input.mg-c-input--width-full .mg-c-input__box{width:100%}.mg-c-input.mg-c-input--width-full .mg-c-input__input-group-container{width:100%;flex-grow:1}.mg-c-input.mg-c-input--width-2.mg-c-input--display-character-left .mg-c-input__input-group-container,.mg-c-input.mg-c-input--width-4.mg-c-input--display-character-left .mg-c-input__input-group-container,.mg-c-input.mg-c-input--width-16.mg-c-input--display-character-left .mg-c-input__input-group-container{width:max-content}.mg-c-input.mg-c-input--width-2 .mg-c-input__box{width:var(--mg-b-size-48)}.mg-c-input.mg-c-input--width-2.mg-c-input--text.mg-c-input--display-character-left .mg-c-input__box{width:calc(var(--mg-b-size-48) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-4 .mg-c-input__box{width:var(--mg-b-size-72)}.mg-c-input.mg-c-input--width-4.mg-c-input--text.mg-c-input--display-character-left .mg-c-input__box{width:calc(var(--mg-b-size-72) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-16 .mg-c-input__box{width:calc(26*var(--mg-b-size-8))}.mg-c-input.mg-c-input--width-16.mg-c-input--text.mg-c-input--display-character-left .mg-c-input__box{width:calc(calc(26 * var(--mg-b-size-8)) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-full:not(.mg-c-input--label-on-top){justify-content:stretch}.mg-c-input.mg-c-input--is-input-group-append ::slotted([slot=append-input]),.mg-c-input.mg-c-input--is-append-input-slot-content ::slotted([slot=append-input]){width:auto}:host(.mg-c-input.mg-c-input--width-full) ::slotted(*:not(mg-input-title)){width:100%;max-width:100%}.mg-c-input__readonly-value{min-height:var(--mg-b-font-size);align-self:flex-start;margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2);overflow-wrap:anywhere}.mg-u-visually-hidden{position:absolute !important;overflow:hidden !important;width:.1rem !important;height:.1rem !important;padding:0 !important;border:0 !important;margin:-0.1rem !important;clip-path:inset(50%) !important;white-space:nowrap !important}.mg-u-visually-hidden *{overflow:hidden !important}*:focus:not(:focus-visible){outline:none}@media (prefers-reduced-motion){*{animation:none !important;transition:none !important}}a{color:inherit;text-decoration:underline}a:has(mg-icon){display:inline-flex;align-items:center;gap:var(--mg-b-size-4)}a:hover,a:focus,a:active{text-decoration:none}.mg-c-input.mg-c-input--combobox mg-popover{--mg-c-popover-overflow:auto;--mg-c-popover-spacing-vertical:0;--mg-c-popover-spacing-horizontal:0;--mg-c-popover-min-width:var(--mg-c-input-list-width);--mg-c-popover-max-height:calc(50 * var(--mg-b-size-8) - var(--mg-b-size-32))}.mg-c-input.mg-c-input--combobox .mg-c-input__input-group-container{position:relative}.mg-c-input.mg-c-input--combobox .mg-c-input__box{cursor:pointer}.mg-c-input.mg-c-input--combobox .mg-c-input__popover-container{display:flex;flex-direction:column;gap:var(--mg-b-size-4)}.mg-c-input.mg-c-input--combobox .mg-c-input__load-more{padding:0 var(--mg-b-size-8) var(--mg-b-size-4)}.mg-c-input.mg-c-input--combobox .mg-c-input__input-list{padding:0;margin:0;cursor:pointer;list-style:none}.mg-c-input.mg-c-input--combobox .mg-c-input__input-list-item{display:flex;padding:var(--mg-b-size-8)}.mg-c-input.mg-c-input--combobox .mg-c-input__input-list-item:hover,.mg-c-input.mg-c-input--combobox .mg-c-input__input-list-item.mg-c-input__input-list-item--focus-visible{background-color:var(--mg-b-color-neutral-20)}.mg-c-input.mg-c-input--combobox .mg-c-input__input-list-item.mg-c-input__input-list-item--selected{font-weight:700}.mg-c-input.mg-c-input--combobox .mg-c-input__input-list-item.mg-c-input__input-list-item--selected mg-icon{margin-left:auto}.mg-c-input.mg-c-input--combobox.mg-c-input--width-2 .mg-c-input__box{width:calc(var(--mg-b-size-16) + var(--mg-b-size-8)*2 + var(--mg-b-size-24) + var(--mg-b-size-min-height) + var(--mg-b-size-4))}.mg-c-input.mg-c-input--combobox.mg-c-input--width-4 .mg-c-input__box{width:calc(var(--mg-b-size-16) + var(--mg-b-size-8)*2 + var(--mg-b-size-48) + var(--mg-b-size-min-height) + var(--mg-b-size-4))}.mg-c-input.mg-c-input--combobox.mg-c-input--width-16 .mg-c-input__box{width:calc(var(--mg-b-size-16) + var(--mg-b-size-8)*2 + calc(23 * var(--mg-b-size-8)) + var(--mg-b-size-min-height) + var(--mg-b-size-4))}.mg-c-input.mg-c-input--combobox.mg-c-input--width-full mg-popover{--mg-c-popover-max-width:var(--mg-c-input-list-width, var(--mg-c-popover-max-width))}.mg-c-input.mg-c-input--combobox.mg-c-input--width-full .mg-c-input__input-group-container{display:flex;width:100%}.mg-c-input.mg-c-input--combobox.mg-c-input--width-full .mg-c-input__box{flex:1}.mg-c-input.mg-c-input--combobox.mg-c-input--input-append .mg-c-input__box{padding-right:calc(var(--mg-b-size-min-height) + var(--mg-b-size-4))}.mg-c-input.mg-c-input--combobox.mg-c-input--input-append .mg-c-input__box-append{position:absolute;top:0;right:0}"}},[1,"mg-input-combobox",{value:[1537],items:[16],itemsLabel:[1,"items-label"],identifier:[1],name:[1],label:[1],labelOnTop:[4,"label-on-top"],labelHide:[4,"label-hide"],placeholder:[1],required:[4],readonly:[4],disabled:[4],mgWidth:[8,"mg-width"],popoverPlacement:[1,"popover-placement"],tooltip:[1],tooltipPosition:[1,"tooltip-position"],helpText:[1,"help-text"],fetchurl:[1],fetchoptions:[16],fetchmappings:[16],valid:[1028],invalid:[1028],isLoading:[32],options:[32],option:[32],filter:[32],classCollection:[32],errorMessage:[32],popoverDisplay:[32],setFocus:[64],displayError:[64],setError:[64],reset:[64]},void 0,{value:[{watchValue:0}],items:[{watchItems:0}],identifier:[{watchIdentifier:0}],readonly:[{watchReadonly:0},{watchValidityChange:0}],required:[{watchValidityChange:0}],disabled:[{watchValidityChange:0},{watchDisabled:0}],mgWidth:[{watchMgWidth:0}],fetchurl:[{watchFetchUrl:0}],fetchoptions:[{watchFetchOptions:0}],fetchmappings:[{watchFetchMappings:0}],options:[{watchOptions:0}],filter:[{watchFilter:0}],popoverDisplay:[{watchPopoverDisplay:0}]}]);function I(){"undefined"!=typeof customElements&&["mg-input-combobox","mg-button","mg-card","mg-icon","mg-input","mg-input-title","mg-loader","mg-popover","mg-popover-content","mg-tooltip","mg-tooltip-content"].forEach((i=>{switch(i){case"mg-input-combobox":customElements.get(t(i))||customElements.define(t(i),V);break;case"mg-button":customElements.get(t(i))||y();break;case"mg-card":customElements.get(t(i))||z();break;case"mg-icon":customElements.get(t(i))||k();break;case"mg-input":customElements.get(t(i))||E();break;case"mg-input-title":customElements.get(t(i))||j();break;case"mg-loader":customElements.get(t(i))||F();break;case"mg-popover":customElements.get(t(i))||O();break;case"mg-popover-content":customElements.get(t(i))||q();break;case"mg-tooltip":customElements.get(t(i))||C();break;case"mg-tooltip-content":customElements.get(t(i))||D()}}))}I();const M=V,R=I;export{M as MgInputCombobox,R as defineCustomElement}
+import{transformTag as t,proxyCustomElement as i,HTMLElement as s,createEvent as o,h as e}from"@stencil/core/internal/client";import{P as n,C as a,t as r,e as h,n as c,f as p,h as m,d as l,i as u,j as g,k as d}from"./index2.js";import{n as b}from"./index3.js";import{c as v,b as f,w}from"./mg-input.conf.js";import{i as _}from"./index4.js";import{K as x}from"./events.utils.js";import{d as y}from"./mg-button2.js";import{d as z}from"./mg-card2.js";import{d as k}from"./mg-icon2.js";import{d as E}from"./mg-input2.js";import{d as j}from"./mg-input-title2.js";import{d as F}from"./mg-loader2.js";import{d as O}from"./mg-popover2.js";import{d as q}from"./mg-popover-content2.js";import{d as D}from"./mg-tooltip2.js";import{d as C}from"./mg-tooltip-content2.js";const P=t=>t&&"object"==typeof t&&"string"==typeof t.title&&void 0!==t.value,V=i(class extends s{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.valueChange=o(this,"value-change",7),this.filterChange=o(this,"filter-change",7),this.showMore=o(this,"load-more",7),this.inputValid=o(this,"input-valid",7),this.fetchError=o(this,"fetch-error",7),this.hasDisplayedError=!1,this.validityCheckPending=!1,this.customErrorMessage={lock:!1},this.name=this.identifier,this.labelOnTop=!1,this.labelHide=!1,this.required=!1,this.readonly=!1,this.disabled=!1,this.mgWidth="full",this.popoverPlacement="bottom-start",this.tooltipPosition="input",this.options=new n([]),this.filter="",this.classCollection=new a(["mg-c-input--combobox","mg-c-input--has-icon","mg-c-input--input-append"]),this.popoverDisplay=!1,this.handleOptionClick=t=>{this.setValue(this.options.items.find((i=>r(i.value)===t.target.dataset.value))),this.popoverDisplay=!1},this.handleResetButton=t=>{t.stopPropagation(),this.reset().then((()=>{this.input.focus()}))},this.handlePopoverDisplay=t=>{this.popoverDisplay=t.detail},this.handleFilterInput=()=>{this.checkValidity(),this.hasDisplayedError&&this.setErrorMessage(),this.popoverDisplay||(this.popoverDisplay=!0),this.debounce||(this.debounce=!0,setTimeout((()=>{this.filter=this.input.value,this.debounce=!1}),250))},this.handleFilterBlur=t=>{this.popoverDisplay?(t.stopImmediatePropagation(),this.input.focus()):(this.handlerInProgress="blur",this.displayError().finally((()=>{this.handlerInProgress=void 0})))},this.handleFilterFocus=()=>{this.isLoading||(this.option=null)},this.handleLoadMoreButton=()=>{this.loadingWrapper({name:"load-more",cursor:h.NEXT}).then((()=>{this.input.focus()}))},this.handleFilterKeydown=t=>{var i;if(this.disabled||t.ctrlKey||t.shiftKey)return;let s=!1;switch(t.key){case x.TAB:case x.ENTER:{s=t.key===x.ENTER;const o=null!==(i=this.option)&&void 0!==i?i:this.options.items.find(this.isCurrentOption);this.popoverDisplay&&this.setValue(o),this.popoverDisplay=!1;break}case x.DOWN:case x.ARROWDOWN:case x.UP:case x.ARROWUP:{if(s=!0,this.isLoading||0===this.page.total){this.popoverDisplay=!0;break}if(t.altKey&&[x.DOWN,x.ARROWDOWN].includes(t.key)){this.popoverDisplay=!0;break}let i;const o=this.popoverDisplay&&P(this.option);[x.DOWN,x.ARROWDOWN].includes(t.key)?i=o?h.NEXT:h.FIRST:[x.UP,x.ARROWUP].includes(t.key)&&(i=o?h.PREVIOUS:h.LAST),this.loadingWrapper({name:"scroll",cursor:i}),this.popoverDisplay=!0;break}case x.LEFT:case x.ARROWLEFT:case x.HOME:case x.RIGHT:case x.ARROWRIGHT:case x.END:{if(!P(this.option))break;let i;s=!0,this.option=null,x.HOME===t.key?i=0:x.END===t.key&&(i=this.filter.length),"number"==typeof i&&this.input.setSelectionRange(i,i);break}case x.ESC:case x.ESCAPE:s=!0,this.popoverDisplay?this.popoverDisplay=!1:(this.setValue(null),this.filter="",this.option=null);break;default:this.option=null}s&&(t.stopPropagation(),t.preventDefault())},this.scrollToIndex=t=>{requestAnimationFrame((()=>{var i;this.popoverDisplay&&(null===(i=this.element.shadowRoot.querySelector(`li:nth-of-type(${(t||0)+this.page.baseIndex})`))||void 0===i||i.scrollIntoView({block:"nearest"}))}))},this.isCurrentOption=t=>(P(this.value)?this.value.value:this.value)===t.value,this.getValueTitle=()=>this.value&&P(this.value)?this.value.title:"string"==typeof this.value?this.value:"",this.checkValidity=()=>{this.setValidity(this.readonly||this.disabled||this.input.checkValidity())},this.setErrorMessage=(t=!1)=>{this.errorMessage=void 0,this.valid||(t||this.customErrorMessage.lock&&void 0!==this.customErrorMessage.message?this.errorMessage=this.customErrorMessage.message:this.input.validity.valueMissing&&(this.errorMessage=this.messages.errors.required))},this.matchFilter=t=>""===this.filter||t.title.toLocaleLowerCase().includes(this.filter.toLocaleLowerCase()),this.getFilteredOptions=()=>this.options.items.filter(this.matchFilter),this.getFirstPage=()=>{const t=this.options.getPage(0,this.matchFilter);return void 0===this.fetchurl&&(t.total=this.getFilteredOptions().length),t},this.loadingWrapper=t=>{var i;let s,o;if(null!==(i=this.loadingAction)&&void 0!==i||(this.loadingAction=t.name),this.option&&"load-more"!==this.loadingAction?o=this.page.items.findIndex((t=>r(t.value)===r(this.option.value))):"load-more"===this.loadingAction&&(o=this.page.items.length-this.page.baseIndex),"load-more"===t.name)this.isLoading=!0,s=this.goToNextPage;else{if(t.cursor===h.NEXT&&this.page.items.length<=this.page.total&&o+this.page.baseIndex===this.page.items.length&&o+this.page.baseIndex<this.page.total)return void this.loadMoreElement.click();s="scroll"===t.name?c:this.updatePage}return s().then((()=>{const i=this.getFilteredOptions();"load-data"!==t.name&&(o=this.page.getIndexFromCursor(t.cursor,"load-more"===this.loadingAction&&o>=0?i[o]:this.option)),this.option=i[o],this.scrollToIndex(o)})).finally((()=>{requestAnimationFrame((()=>{this.isLoading=!1,this.loadingAction=void 0}))}))},this.goToNextPage=()=>(this.showMore.emit(),void 0!==this.fetchurl?this.getOptions("string"==typeof this.page.next?this.page.next:void 0).then((t=>{if(void 0!==t){const i=[...this.page.items,...t.items];this.options=new n(i,{total:t.total,next:t.next,top:i.length})}})):c((()=>{if("function"==typeof this.page.next){const t=this.page.next();this.page=new p(Object.assign(Object.assign({},t),{items:[...this.page.items,...t.items],total:this.getFilteredOptions().length}))}}))),this.updatePage=async()=>{if(void 0!==this.fetchurl)return this.getOptions().then((t=>{void 0!==t&&(this.options=new n(t.items,{total:t.total,next:t.next,top:t.top}))}));this.page=this.getFirstPage()},this.getOptions=async(t=this.fetchurl)=>{const i="function"==typeof this.fetchmappings.request.filterTransform?this.fetchmappings.request.filterTransform(this.filter):this.filter,s=("string"==typeof t?t:""+t).replaceAll(this.fetchmappings.request.filter,encodeURIComponent(i));try{const t=await fetch(s,this.fetchoptions);if(!t.ok)return void this.fetchError.emit(Error(`${t.status} - ${t.statusText}`));const i=await t.json(),o=m(i,this.fetchmappings.response.items).map((t=>{var i;return{title:m(t,this.fetchmappings.response.itemTitle),value:null!==(i=m(t,this.fetchmappings.response.itemValue))&&void 0!==i?i:t}})),e=Number(m(i,this.fetchmappings.response.total,0));let n=m(i,this.fetchmappings.response.next);if(n&&!URL.canParse(n)){const t=new URL(s,this.element.ownerDocument.baseURI);n=""+new URL(n,t)}return{items:o,total:e,next:n,top:o.length}}catch(t){this.fetchError.emit(t)}}}watchValue(t){this.validityCheckPending=!0,this.filter=this.getValueTitle(),this.valueChange.emit(t)}watchItems(t,i){if(void 0===this.fetchurl||void 0!==t){if(void 0!==this.fetchurl&&void 0!==t)throw Error(`<mg-input-combobox> prop "items" values cannot be use with "fetchurl" prop defined. Passed value: ${r(t)}.`);if(Array.isArray(t)&&0===t.length)this.options=new n([]);else if(l(t))this.options=new n(t.map((t=>({title:t,value:t}))),{total:t.length});else{if(!(t=>Array.isArray(t)&&t.every(P))(t))throw Error(`<mg-input-combobox> prop "items" values must be the same type, string or Option. Passed value: ${r(t)}.`);this.options=new n(t,{total:t.length})}void 0!==i&&(void 0!==this.value&&this.options.items.length>0&&!this.options.items.some((t=>this.isCurrentOption(t)))&&(this.value=void 0),this.validityCheckPending=!0)}}watchIdentifier(t){u(t)&&(this.popoverId=t+"-popover",this.element.dataset.mgPopoverGuard=this.popoverId)}watchReadonly(t){t?this.classCollection.add(v):this.classCollection.delete(v)}watchValidityChange(t,i,s){void 0!==this.input&&(this.input[s]=t,this.checkValidity(),this.hasDisplayedError&&(this.setErrorMessage(),this.hasDisplayedError=!1))}watchDisabled(t){t?this.classCollection.add(f):this.classCollection.delete(f)}watchMgWidth(t){w.forEach((t=>{this.classCollection.delete("mg-c-input--width-"+t)})),void 0!==t&&this.classCollection.add("mg-c-input--width-"+this.mgWidth),this.classCollection=new a(this.classCollection.classes)}watchFetchUrl(t){void 0!==t&&this.loadingWrapper({name:"load-data"})}watchFetchOptions(t){if(this.fetchurl&&t&&!g(t))throw Error(`<mg-input-combobox> prop "fetchoptions" value must be a valid RequestInit. Passed value: ${r(t)}.`)}watchFetchMappings(t){if(void 0!==this.fetchurl&&!g(t))throw Error('<mg-input-combobox> prop "fetchmappings" is required with "fetchurl" prop.');if(void 0!==t&&!(t=>{const i=g(t)&&Object.hasOwn(t,"request")&&Object.hasOwn(t,"response");if(i){const{request:i,response:s}=t;return![i,s].some((t=>!g(t)))&&!("string"!=typeof i.filter||void 0!==i.filterTransform&&"function"!=typeof i.filterTransform||"object"!=typeof s||"string"!=typeof s.total||"string"!=typeof s.items||"string"!=typeof s.next||"string"!=typeof s.itemTitle||"string"!=typeof s.itemValue&&void 0!==s.itemValue)}return i})(t))throw Error(`<mg-input-combobox> prop "fetchmappings" value must be { request: RequestMappingType, response: ResponseMappingType }. Passed value: ${r(t)}.`)}watchOptions(){this.page=this.getFirstPage()}watchFilter(t){this.loadingWrapper({name:"load-data"}),this.filterChange.emit(t)}watchPopoverDisplay(t){t?this.input.focus():(this.option=null,this.filter=this.getValueTitle(),this.handlerInProgress="blur",this.displayError().finally((()=>{this.handlerInProgress=void 0})))}async setFocus(){var t;null===(t=this.input)||void 0===t||t.focus()}displayError(){return new Promise((t=>{requestAnimationFrame((()=>{this.checkValidity(),this.setErrorMessage(),this.hasDisplayedError=this.invalid,t()}))}))}async setError(t,i,s=!1){if("boolean"!=typeof t)throw Error('<mg-input-combobox> method "setError()" param "valid" must be a boolean.');if(void 0!==i&&!u(i))throw Error('<mg-input-combobox> method "setError()" param "errorMessage" must be a string.');this.customErrorMessage={lock:!t&&s,message:t?void 0:i},this.validityCheckPending=!1,this.setValidity(t),this.setErrorMessage(!0),this.hasDisplayedError=this.invalid}async reset(){if(!this.readonly)return this.setValue(null),this.option=null,this.filter="",new Promise((t=>{requestAnimationFrame((()=>{this.customErrorMessage={lock:!1},this.checkValidity(),this.errorMessage=void 0,this.hasDisplayedError=!1,t()}))}))}setValue(t){this.value=P(t)?l(this.items||this.options.items)?t.title:Object.assign({},t):""}setValidity(t){const i=this.valid;this.customErrorMessage.lock&&(void 0===this.customErrorMessage.message||t)||(this.valid=t),this.invalid=!this.valid,(void 0===this.handlerInProgress||"blur"===this.handlerInProgress&&this.valid!==i)&&this.inputValid.emit(this.valid)}componentWillLoad(){return this.messages=_(this.element).messages,b(this),this.watchIdentifier(this.identifier),this.watchItems(this.items),void 0!==this.fetchurl&&(this.watchFetchOptions(this.fetchoptions),this.watchFetchMappings(this.fetchmappings),this.loadingWrapper({name:"load-data"})),this.watchValue(this.value),this.watchOptions(),this.watchMgWidth(this.mgWidth),this.watchReadonly(this.readonly),this.watchDisabled(this.disabled),setTimeout((()=>{this.checkValidity(),this.validityCheckPending=!1}),0)}componentDidUpdate(){this.validityCheckPending&&void 0!==this.input&&(this.validityCheckPending=!1,this.checkValidity(),this.hasDisplayedError&&this.setErrorMessage())}render(){var t,i,s,o,n,a;const h=this.identifier+"-list",c=this.getValueTitle(),p=this.value&&!this.disabled;let m,l;return(null===(t=this.page)||void 0===t?void 0:t.items.length)>0?m="list":0===(null===(i=this.page)||void 0===i?void 0:i.items.length)&&this.filter.length>0?m="notfound":0===(null===(s=this.page)||void 0===s?void 0:s.items.length)&&(m="notavailable"),l=void 0!==(null===(o=this.option)||void 0===o?void 0:o.value)?this.option.value:"string"==typeof this.value?this.value:null===(n=this.value)||void 0===n?void 0:n.value,e("mg-input",{key:"20006f3066f661cd9cf8ec25b4090221d3925b04",label:this.label,identifier:this.identifier,class:this.classCollection.classes.join(" "),ariaDescribedbyIDs:m&&"list"!==m?m:void 0,labelOnTop:this.labelOnTop,labelHide:this.labelHide,required:this.required,tooltip:this.tooltip,tooltipPosition:this.readonly&&void 0===this.value?"label":this.tooltipPosition,helpText:this.helpText,errorMessage:this.errorMessage},this.readonly?c&&e("b",{class:"mg-c-input__readonly-value"},c):e("mg-popover",{identifier:this.popoverId,placement:this.popoverPlacement,display:this.popoverDisplay,style:{"--mg-c-input-list-width":(null===(a=this.input)||void 0===a?void 0:a.offsetWidth)>0?this.input.offsetWidth+"px":void 0},"data-fallback-placement":"bottom-end","onDisplay-change":this.handlePopoverDisplay},e("div",{class:"mg-c-input__input-group-container"},e("mg-icon",{icon:"magnifying-glass"}),e("input",{type:"text",role:"combobox",class:"mg-c-input__box mg-c-input__box--width",value:this.filter,id:this.identifier,name:this.name,placeholder:this.placeholder,title:this.placeholder,disabled:this.disabled,required:this.required,autocomplete:"off","aria-autocomplete":"list","aria-expanded":""+this.popoverDisplay,"aria-controls":h,"aria-invalid":""+(!0===this.invalid),"aria-activedescendant":d(l),onInput:this.handleFilterInput,onBlur:this.handleFilterBlur,onFocus:this.handleFilterFocus,onKeyDown:this.handleFilterKeydown,ref:t=>{null!==t&&(this.input=t)}}),p?e("mg-button",{class:"mg-c-input__box-append mg-c-input__reset",variant:"flat","is-icon":!0,label:this.messages.general.reset,"aria-controls":this.identifier,tabindex:"-1",onClick:this.handleResetButton},e("mg-icon",{icon:"cross"})):e("mg-button",{class:"mg-c-input__box-append",variant:"flat","is-icon":!0,label:this.itemsLabel,tabindex:"-1",disabled:this.disabled},e("mg-icon",{icon:"chevron-"+(this.popoverDisplay?"up":"down")}))),e("div",{slot:"content",class:"mg-c-input__popover-container"},"list"===m&&[e("ul",{key:"list",class:"mg-c-input__input-list",role:"listbox",id:h,"aria-label":this.itemsLabel,"aria-setsize":this.page.total},this.page.items.map((t=>{var i;return e("li",{role:"option",class:{"mg-c-input__input-list-item":!0,"mg-c-input__input-list-item--focus-visible":JSON.stringify(null===(i=this.option)||void 0===i?void 0:i.value)===JSON.stringify(t.value),"mg-c-input__input-list-item--selected":this.isCurrentOption(t)},key:t.title,id:d(t.value),"aria-selected":""+this.isCurrentOption(t),"data-value":r(t.value),onClick:this.handleOptionClick},t.title,this.isCurrentOption(t)&&e("mg-icon",{icon:"check"}))}))),this.isLoading&&e("mg-loader",{key:"loader",message:this.messages.input.combobox.search,class:{"mg-u-visually-hidden":!!this.page.next}}),this.page.next&&e("mg-button",{key:"load-more",variant:"flat",class:"mg-c-input__load-more",tabIndex:-1,disabled:this.isLoading,"full-width":!0,"disable-on-click":!0,onClick:this.handleLoadMoreButton,"aria-controls":h,ref:t=>{null!==t&&(this.loadMoreElement=t)}},e("mg-icon",{icon:"chevron-down"}),this.messages.input.showMore)],"notfound"===m&&e("p",{id:m,class:"mg-c-input__popover-info"},this.messages.input.combobox.notFound),"notavailable"===m&&e("p",{id:m,class:"mg-c-input__popover-info"},this.messages.input.combobox.notAvailable))))}get element(){return this}static get watchers(){return{value:[{watchValue:0}],items:[{watchItems:0}],identifier:[{watchIdentifier:0}],readonly:[{watchReadonly:0},{watchValidityChange:0}],required:[{watchValidityChange:0}],disabled:[{watchValidityChange:0},{watchDisabled:0}],mgWidth:[{watchMgWidth:0}],fetchurl:[{watchFetchUrl:0}],fetchoptions:[{watchFetchOptions:0}],fetchmappings:[{watchFetchMappings:0}],options:[{watchOptions:0}],filter:[{watchFilter:0}],popoverDisplay:[{watchPopoverDisplay:0}]}}static get style(){return".mg-c-input__box{height:var(--mg-b-size-min-height);box-sizing:border-box;padding:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2) var(--mg-b-size-8);border-width:var(--mg-c-input-border-width);border-style:solid;border-color:var(--mg-c-input-color-border);border-radius:var(--mg-c-input-border-radius);background-color:var(--mg-b-color-light);color:var(--mg-b-color-dark);font-family:inherit;font-size:var(--mg-b-font-size);text-align:var(--mg-c-input-text-align, left)}.mg-c-input__box::placeholder{color:var(--mg-c-input-placeholder-color-text);font-style:italic}.mg-c-input__box:focus{box-shadow:0 0 var(--mg-b-size-4) var(--mg-c-input-color-box-shadow-focus)}.mg-c-input__box:disabled{opacity:var(--mg-b-opacity-element-disabled)}.mg-c-input.mg-c-input--has-error .mg-c-input__box{border-color:var(--mg-b-color-danger)}.mg-c-input.mg-c-input--is-input-group-append{--mg-c-button-border-radius-top-left:0;--mg-c-button-border-radius-bottom-left:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box{margin-right:calc(-1*var(--mg-b-size-border));border-bottom-right-radius:0;border-top-right-radius:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box:focus-visible{outline-offset:calc(-1*var(--mg-b-size-2));outline-style:solid;outline-width:var(--mg-b-size-2)}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]){--mg-c-button-border-radius-top-right:0;--mg-c-button-border-radius-bottom-right:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:not(:last-of-type)){--mg-c-button-border-right-width:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:last-of-type){--mg-c-button-border-radius-top-right:var(--mg-c-input-border-radius);--mg-c-button-border-radius-bottom-right:var(--mg-c-input-border-radius)}.mg-c-input.mg-c-input--is-append-input-slot-content:not(.mg-c-input--readonly) ::slotted([slot=append-input]){align-self:start;padding-top:calc((var(--mg-b-size-min-height) - var(--mg-b-size-16))/2)}.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container{position:relative}.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container>mg-icon:first-of-type{position:absolute;top:50%;left:var(--mg-b-size-8);color:var(--mg-c-input-color-icon);transform:translateY(-50%)}.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container .mg-c-input__box{padding-left:calc(var(--mg-b-size-16) + var(--mg-b-size-8)*2)}.mg-c-input__popover-info{padding:var(--mg-b-size-8);margin:0;color:var(--mg-b-color-neutral-90);text-align:center}.mg-c-input__input-container{width:100%;flex:1 auto}.mg-c-input.mg-c-input--width-full .mg-c-input__box{width:100%}.mg-c-input.mg-c-input--width-full .mg-c-input__input-group-container{width:100%;flex-grow:1}.mg-c-input.mg-c-input--width-2.mg-c-input--display-character-left .mg-c-input__input-group-container,.mg-c-input.mg-c-input--width-4.mg-c-input--display-character-left .mg-c-input__input-group-container,.mg-c-input.mg-c-input--width-16.mg-c-input--display-character-left .mg-c-input__input-group-container{width:max-content}.mg-c-input.mg-c-input--width-2 .mg-c-input__box{width:var(--mg-b-size-48)}.mg-c-input.mg-c-input--width-2.mg-c-input--text.mg-c-input--display-character-left .mg-c-input__box{width:calc(var(--mg-b-size-48) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-4 .mg-c-input__box{width:var(--mg-b-size-72)}.mg-c-input.mg-c-input--width-4.mg-c-input--text.mg-c-input--display-character-left .mg-c-input__box{width:calc(var(--mg-b-size-72) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-16 .mg-c-input__box{width:calc(26*var(--mg-b-size-8))}.mg-c-input.mg-c-input--width-16.mg-c-input--text.mg-c-input--display-character-left .mg-c-input__box{width:calc(calc(26 * var(--mg-b-size-8)) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-full:not(.mg-c-input--label-on-top){justify-content:stretch}.mg-c-input.mg-c-input--is-input-group-append ::slotted([slot=append-input]),.mg-c-input.mg-c-input--is-append-input-slot-content ::slotted([slot=append-input]){width:auto}:host(.mg-c-input.mg-c-input--width-full) ::slotted(*:not(mg-input-title)){width:100%;max-width:100%}.mg-c-input__readonly-value{min-height:var(--mg-b-font-size);align-self:flex-start;margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2);overflow-wrap:anywhere}.mg-c-input--label-on-top .mg-c-input__readonly-value{margin-top:0}.mg-u-visually-hidden{position:absolute !important;overflow:hidden !important;width:.1rem !important;height:.1rem !important;padding:0 !important;border:0 !important;margin:-0.1rem !important;clip-path:inset(50%) !important;white-space:nowrap !important}.mg-u-visually-hidden *{overflow:hidden !important}*:focus:not(:focus-visible){outline:none}@media (prefers-reduced-motion){*{animation:none !important;transition:none !important}}a{color:inherit;text-decoration:underline}a:has(mg-icon){display:inline-flex;align-items:center;gap:var(--mg-b-size-4)}a:hover,a:focus,a:active{text-decoration:none}.mg-c-input.mg-c-input--combobox mg-popover{--mg-c-popover-overflow:auto;--mg-c-popover-spacing-vertical:0;--mg-c-popover-spacing-horizontal:0;--mg-c-popover-min-width:var(--mg-c-input-list-width);--mg-c-popover-max-height:calc(50 * var(--mg-b-size-8) - var(--mg-b-size-32))}.mg-c-input.mg-c-input--combobox .mg-c-input__input-group-container{position:relative}.mg-c-input.mg-c-input--combobox .mg-c-input__box{cursor:pointer}.mg-c-input.mg-c-input--combobox .mg-c-input__popover-container{display:flex;flex-direction:column;gap:var(--mg-b-size-4)}.mg-c-input.mg-c-input--combobox .mg-c-input__load-more{padding:0 var(--mg-b-size-8) var(--mg-b-size-4)}.mg-c-input.mg-c-input--combobox .mg-c-input__input-list{padding:0;margin:0;cursor:pointer;list-style:none}.mg-c-input.mg-c-input--combobox .mg-c-input__input-list-item{display:flex;padding:var(--mg-b-size-8)}.mg-c-input.mg-c-input--combobox .mg-c-input__input-list-item:hover,.mg-c-input.mg-c-input--combobox .mg-c-input__input-list-item.mg-c-input__input-list-item--focus-visible{background-color:var(--mg-b-color-neutral-20)}.mg-c-input.mg-c-input--combobox .mg-c-input__input-list-item.mg-c-input__input-list-item--selected{font-weight:700}.mg-c-input.mg-c-input--combobox .mg-c-input__input-list-item.mg-c-input__input-list-item--selected mg-icon{margin-left:auto}.mg-c-input.mg-c-input--combobox.mg-c-input--width-2 .mg-c-input__box{width:calc(var(--mg-b-size-16) + var(--mg-b-size-8)*2 + var(--mg-b-size-24) + var(--mg-b-size-min-height) + var(--mg-b-size-4))}.mg-c-input.mg-c-input--combobox.mg-c-input--width-4 .mg-c-input__box{width:calc(var(--mg-b-size-16) + var(--mg-b-size-8)*2 + var(--mg-b-size-48) + var(--mg-b-size-min-height) + var(--mg-b-size-4))}.mg-c-input.mg-c-input--combobox.mg-c-input--width-16 .mg-c-input__box{width:calc(var(--mg-b-size-16) + var(--mg-b-size-8)*2 + calc(23 * var(--mg-b-size-8)) + var(--mg-b-size-min-height) + var(--mg-b-size-4))}.mg-c-input.mg-c-input--combobox.mg-c-input--width-full mg-popover{--mg-c-popover-max-width:var(--mg-c-input-list-width, var(--mg-c-popover-max-width))}.mg-c-input.mg-c-input--combobox.mg-c-input--width-full .mg-c-input__input-group-container{display:flex;width:100%}.mg-c-input.mg-c-input--combobox.mg-c-input--width-full .mg-c-input__box{flex:1}.mg-c-input.mg-c-input--combobox.mg-c-input--input-append .mg-c-input__box{padding-right:calc(var(--mg-b-size-min-height) + var(--mg-b-size-4))}.mg-c-input.mg-c-input--combobox.mg-c-input--input-append .mg-c-input__box-append{position:absolute;top:0;right:0}"}},[1,"mg-input-combobox",{value:[1537],items:[16],itemsLabel:[1,"items-label"],identifier:[1],name:[1],label:[1],labelOnTop:[4,"label-on-top"],labelHide:[4,"label-hide"],placeholder:[1],required:[4],readonly:[4],disabled:[4],mgWidth:[8,"mg-width"],popoverPlacement:[1,"popover-placement"],tooltip:[1],tooltipPosition:[1,"tooltip-position"],helpText:[1,"help-text"],fetchurl:[1],fetchoptions:[16],fetchmappings:[16],valid:[1028],invalid:[1028],isLoading:[32],options:[32],option:[32],filter:[32],classCollection:[32],errorMessage:[32],popoverDisplay:[32],setFocus:[64],displayError:[64],setError:[64],reset:[64]},void 0,{value:[{watchValue:0}],items:[{watchItems:0}],identifier:[{watchIdentifier:0}],readonly:[{watchReadonly:0},{watchValidityChange:0}],required:[{watchValidityChange:0}],disabled:[{watchValidityChange:0},{watchDisabled:0}],mgWidth:[{watchMgWidth:0}],fetchurl:[{watchFetchUrl:0}],fetchoptions:[{watchFetchOptions:0}],fetchmappings:[{watchFetchMappings:0}],options:[{watchOptions:0}],filter:[{watchFilter:0}],popoverDisplay:[{watchPopoverDisplay:0}]}]);function I(){"undefined"!=typeof customElements&&["mg-input-combobox","mg-button","mg-card","mg-icon","mg-input","mg-input-title","mg-loader","mg-popover","mg-popover-content","mg-tooltip","mg-tooltip-content"].forEach((i=>{switch(i){case"mg-input-combobox":customElements.get(t(i))||customElements.define(t(i),V);break;case"mg-button":customElements.get(t(i))||y();break;case"mg-card":customElements.get(t(i))||z();break;case"mg-icon":customElements.get(t(i))||k();break;case"mg-input":customElements.get(t(i))||E();break;case"mg-input-title":customElements.get(t(i))||j();break;case"mg-loader":customElements.get(t(i))||F();break;case"mg-popover":customElements.get(t(i))||O();break;case"mg-popover-content":customElements.get(t(i))||q();break;case"mg-tooltip":customElements.get(t(i))||D();break;case"mg-tooltip-content":customElements.get(t(i))||C()}}))}I();const M=V,R=I;export{M as MgInputCombobox,R as defineCustomElement}

package/dist/components/mg-input-date.js

@@ -1 +1 @@
-import{transformTag as t,proxyCustomElement as i,HTMLElement as e,createEvent as s,h as a}from"@stencil/core/internal/client";import{C as n,i as o,m as r,o as h,t as l}from"./index2.js";import{n as m}from"./index3.js";import{a as d,b as p,i as u}from"./index4.js";import{c,b as g}from"./mg-input.conf.js";import{d as b}from"./mg-icon2.js";import{d as v}from"./mg-input2.js";import{d as f}from"./mg-input-title2.js";import{d as y}from"./mg-tooltip2.js";import{d as x}from"./mg-tooltip-content2.js";const w=i(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.valueChange=s(this,"value-change",7),this.inputValid=s(this,"input-valid",7),this.hasDisplayedError=!1,this.customErrorMessage={lock:!1},this.name=this.identifier,this.labelOnTop=!1,this.labelHide=!1,this.required=!1,this.readonly=!1,this.max="9999-12-31",this.disabled=!1,this.tooltipPosition="input",this.classCollection=new n(["mg-c-input--date"]),this.isValidPattern=t=>o(t)&&r.test(t),this.formatHelpText=t=>{if(this.readonly)return;const i="{defaultHelpText}";let e=o(t)?t:this.messages.input.date.helpText.expectedFormat;return e.includes(i)&&(e=e.replace(i,this.formatHelpText(this.messages.input.date.helpText.expectedFormat))),e.replace("{pattern}",this.renderPattern()).replace("{date}",d(h(new Date("2025-12-24")),this.systemLocale))},this.handleInput=()=>{this.checkValidity(),this.hasDisplayedError&&this.setErrorMessage(),this.value=this.input.value},this.handleBlur=()=>{this.handlerInProgress="blur",this.displayError().finally((()=>{this.handlerInProgress=void 0}))},this.handleKeyDown=t=>{["Delete","Backspace"].includes(t.key)&&(t.preventDefault(),this.value=null,this.checkValidity(),this.hasDisplayedError&&this.setErrorMessage())},this.checkValidity=()=>{this.setValidity(this.readonly||this.disabled||this.input.checkValidity()&&(null===this.value||this.isValidPattern(this.value)))},this.getInputError=()=>{var t;let i;return this.input.validity.badInput||this.value&&!this.isValidPattern(this.value)?i="badInput":this.input.validity.valueMissing?i="required":(this.input.validity.rangeUnderflow||this.input.validity.rangeOverflow)&&(null===(t=this.min)||void 0===t?void 0:t.length)>0&&"9999-12-31"!==this.max?i="minMax":this.input.validity.rangeUnderflow?i="min":this.input.validity.rangeOverflow&&(i="max"),i},this.setErrorMessage=(t=!1)=>{if(this.errorMessage=void 0,!this.valid){const i=this.getInputError();this.errorMessage=t||this.customErrorMessage.lock&&void 0!==this.customErrorMessage.message?this.customErrorMessage.message:"required"===i?this.messages.errors[i]:["min","max","minMax"].includes(i)?this.messages.input.date.error[i].replace("{min}",d(this.min,this.systemLocale)).replace("{max}",d(this.max,this.systemLocale)):this.messages.input.date.error.badInput.replace("{pattern}",this.renderPattern()).replace("{date}",d(h(new Date("2025-12-24")),this.systemLocale))}},this.renderPattern=()=>{let t=p(this.systemLocale);for(const i in this.messages.input.date.pattern)t=t.replace(i,this.messages.input.date.pattern[i]);return`<span aria-hidden="true">${t}</span><span class="mg-u-visually-hidden">${[...t].join(" ")}</span>`}}validateValue(t){if(["",void 0].includes(t))this.value=null;else{if(t&&!o(t))throw Error(`<mg-input-date> props 'value' must be a valid string. Passed value: ${l(t)}.`);null===t||this.isValidPattern(t)?this.valueChange.emit(t):console.error("<mg-input-date> props 'value' doesn't match pattern: 'yyyy-mm-dd'.")}}watchReadonly(t){t?this.classCollection.add(c):this.classCollection.delete(c)}validateMinMax(t){if(t&&!this.isValidPattern(t))throw Error(`<mg-input-date> props 'min/max' doesn't match pattern: 'yyyy-mm-dd'. Passed value: ${l(t)}.`)}handleValidityChange(t,i,e){void 0!==this.input&&(this.input[e]=t,this.checkValidity(),this.hasDisplayedError&&(this.setErrorMessage(),this.hasDisplayedError=!1))}watchDisabled(t){t?this.classCollection.add(g):this.classCollection.delete(g)}async setFocus(){var t;null===(t=this.input)||void 0===t||t.focus()}displayError(){return new Promise((t=>{requestAnimationFrame((()=>{this.checkValidity(),this.setErrorMessage(),this.hasDisplayedError=this.invalid,t()}))}))}async setError(t,i,e=!1){if("boolean"!=typeof t)throw Error('<mg-input-date> method "setError()" param "valid" must be a boolean.');if(void 0!==i&&!o(i))throw Error('<mg-input-date> method "setError()" param "errorMessage" must be a string.');this.customErrorMessage={lock:!t&&e,message:t?void 0:i},this.setValidity(t),this.setErrorMessage(!0),this.hasDisplayedError=this.invalid}async reset(){if(!this.readonly)return this.value=null,new Promise((t=>{requestAnimationFrame((()=>{this.customErrorMessage={lock:!1},this.checkValidity(),this.errorMessage=void 0,this.hasDisplayedError=!1,t()}))}))}setValidity(t){const i=this.valid;this.customErrorMessage.lock&&(void 0===this.customErrorMessage.message||t)||(this.valid=t),this.invalid=!this.valid,(void 0===this.handlerInProgress||"blur"===this.handlerInProgress&&this.valid!==i)&&this.inputValid.emit(this.valid)}componentWillLoad(){const t=u(this.element);return this.locale=t.locale,this.messages=t.messages,this.systemLocale=Intl.DateTimeFormat().resolvedOptions().locale,m(this),this.validateValue(this.value),this.validateMinMax(this.min),this.validateMinMax(this.max),this.watchReadonly(this.readonly),this.watchDisabled(this.disabled),setTimeout((()=>{this.checkValidity()}),0)}render(){return a("mg-input",{key:"c13dd54974bd7c8381bcefbe847fe79f2270506c",label:this.label,identifier:this.identifier,class:this.classCollection.join(),labelOnTop:this.labelOnTop,labelHide:this.labelHide,required:this.required,tooltip:this.tooltip,tooltipPosition:this.readonly&&null===this.value?"label":this.tooltipPosition,helpText:this.formatHelpText(this.helpText),errorMessage:this.errorMessage},this.readonly?this.value&&a("b",{class:"mg-c-input__readonly-value"},d(this.value,this.locale)):a("input",{type:"date",class:"mg-c-input__box",min:this.min,max:this.max,value:this.value,id:this.identifier,name:this.name,disabled:this.disabled,required:this.required,"aria-invalid":""+(!0===this.invalid),onInput:this.handleInput,onBlur:this.handleBlur,onKeyDown:this.handleKeyDown,ref:t=>{null!==t&&(this.input=t)}}))}get element(){return this}static get watchers(){return{value:[{validateValue:0}],readonly:[{watchReadonly:0},{handleValidityChange:0}],min:[{validateMinMax:0},{handleValidityChange:0}],max:[{validateMinMax:0},{handleValidityChange:0}],required:[{handleValidityChange:0}],disabled:[{handleValidityChange:0},{watchDisabled:0}]}}static get style(){return".mg-c-input__readonly-value{min-height:var(--mg-b-font-size);align-self:flex-start;margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2);overflow-wrap:anywhere}.mg-c-input__box{height:var(--mg-b-size-min-height);box-sizing:border-box;padding:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2) var(--mg-b-size-8);border-width:var(--mg-c-input-border-width);border-style:solid;border-color:var(--mg-c-input-color-border);border-radius:var(--mg-c-input-border-radius);background-color:var(--mg-b-color-light);color:var(--mg-b-color-dark);font-family:inherit;font-size:var(--mg-b-font-size);text-align:var(--mg-c-input-text-align, left)}.mg-c-input__box::placeholder{color:var(--mg-c-input-placeholder-color-text);font-style:italic}.mg-c-input__box:focus{box-shadow:0 0 var(--mg-b-size-4) var(--mg-c-input-color-box-shadow-focus)}.mg-c-input__box:disabled{opacity:var(--mg-b-opacity-element-disabled)}.mg-c-input.mg-c-input--has-error .mg-c-input__box{border-color:var(--mg-b-color-danger)}.mg-c-input.mg-c-input--is-input-group-append{--mg-c-button-border-radius-top-left:0;--mg-c-button-border-radius-bottom-left:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box{margin-right:calc(-1*var(--mg-b-size-border));border-bottom-right-radius:0;border-top-right-radius:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box:focus-visible{outline-offset:calc(-1*var(--mg-b-size-2));outline-style:solid;outline-width:var(--mg-b-size-2)}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]){--mg-c-button-border-radius-top-right:0;--mg-c-button-border-radius-bottom-right:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:not(:last-of-type)){--mg-c-button-border-right-width:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:last-of-type){--mg-c-button-border-radius-top-right:var(--mg-c-input-border-radius);--mg-c-button-border-radius-bottom-right:var(--mg-c-input-border-radius)}.mg-c-input.mg-c-input--is-append-input-slot-content:not(.mg-c-input--readonly) ::slotted([slot=append-input]){align-self:start;padding-top:calc((var(--mg-b-size-min-height) - var(--mg-b-size-16))/2)}.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container{position:relative}.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container>mg-icon:first-of-type{position:absolute;top:50%;left:var(--mg-b-size-8);color:var(--mg-c-input-color-icon);transform:translateY(-50%)}.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container .mg-c-input__box{padding-left:calc(var(--mg-b-size-16) + var(--mg-b-size-8)*2)}.mg-u-visually-hidden{position:absolute !important;overflow:hidden !important;width:.1rem !important;height:.1rem !important;padding:0 !important;border:0 !important;margin:-0.1rem !important;clip-path:inset(50%) !important;white-space:nowrap !important}.mg-u-visually-hidden *{overflow:hidden !important}*:focus:not(:focus-visible){outline:none}@media (prefers-reduced-motion){*{animation:none !important;transition:none !important}}a{color:inherit;text-decoration:underline}a:has(mg-icon){display:inline-flex;align-items:center;gap:var(--mg-b-size-4)}a:hover,a:focus,a:active{text-decoration:none}"}},[1,"mg-input-date",{value:[1537],identifier:[1],name:[1],label:[1],labelOnTop:[4,"label-on-top"],labelHide:[4,"label-hide"],required:[4],readonly:[4],min:[1],max:[1],disabled:[4],tooltip:[1],tooltipPosition:[1,"tooltip-position"],helpText:[1,"help-text"],valid:[1028],invalid:[1028],classCollection:[32],errorMessage:[32],setFocus:[64],displayError:[64],setError:[64],reset:[64]},void 0,{value:[{validateValue:0}],readonly:[{watchReadonly:0},{handleValidityChange:0}],min:[{validateMinMax:0},{handleValidityChange:0}],max:[{validateMinMax:0},{handleValidityChange:0}],required:[{handleValidityChange:0}],disabled:[{handleValidityChange:0},{watchDisabled:0}]}]);function _(){"undefined"!=typeof customElements&&["mg-input-date","mg-icon","mg-input","mg-input-title","mg-tooltip","mg-tooltip-content"].forEach((i=>{switch(i){case"mg-input-date":customElements.get(t(i))||customElements.define(t(i),w);break;case"mg-icon":customElements.get(t(i))||b();break;case"mg-input":customElements.get(t(i))||v();break;case"mg-input-title":customElements.get(t(i))||f();break;case"mg-tooltip":customElements.get(t(i))||y();break;case"mg-tooltip-content":customElements.get(t(i))||x()}}))}_();const z=w,E=_;export{z as MgInputDate,E as defineCustomElement}
+import{transformTag as t,proxyCustomElement as i,HTMLElement as e,createEvent as s,h as a}from"@stencil/core/internal/client";import{C as n,i as o,m as r,o as h,t as l}from"./index2.js";import{n as d}from"./index3.js";import{a as m,b as p,i as u}from"./index4.js";import{c,b as g}from"./mg-input.conf.js";import{d as b}from"./mg-icon2.js";import{d as v}from"./mg-input2.js";import{d as f}from"./mg-input-title2.js";import{d as y}from"./mg-tooltip2.js";import{d as x}from"./mg-tooltip-content2.js";const w=i(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.valueChange=s(this,"value-change",7),this.inputValid=s(this,"input-valid",7),this.hasDisplayedError=!1,this.validityCheckPending=!1,this.customErrorMessage={lock:!1},this.name=this.identifier,this.labelOnTop=!1,this.labelHide=!1,this.required=!1,this.readonly=!1,this.max="9999-12-31",this.disabled=!1,this.tooltipPosition="input",this.classCollection=new n(["mg-c-input--date"]),this.isValidPattern=t=>o(t)&&r.test(t),this.formatHelpText=t=>{if(this.readonly)return;const i="{defaultHelpText}";let e=o(t)?t:this.messages.input.date.helpText.expectedFormat;return e.includes(i)&&(e=e.replace(i,this.formatHelpText(this.messages.input.date.helpText.expectedFormat))),e.replace("{pattern}",this.renderPattern()).replace("{date}",m(h(new Date("2025-12-24")),this.systemLocale))},this.handleInput=()=>{this.value=this.input.value},this.handleBlur=()=>{this.handlerInProgress="blur",this.displayError().finally((()=>{this.handlerInProgress=void 0}))},this.handleKeyDown=t=>{["Delete","Backspace"].includes(t.key)&&(t.preventDefault(),this.value=null)},this.checkValidity=()=>{this.setValidity(this.readonly||this.disabled||this.input.checkValidity()&&(null===this.value||this.isValidPattern(this.value)))},this.getInputError=()=>{var t;let i;return this.input.validity.badInput||this.value&&!this.isValidPattern(this.value)?i="badInput":this.input.validity.valueMissing?i="required":(this.input.validity.rangeUnderflow||this.input.validity.rangeOverflow)&&(null===(t=this.min)||void 0===t?void 0:t.length)>0&&"9999-12-31"!==this.max?i="minMax":this.input.validity.rangeUnderflow?i="min":this.input.validity.rangeOverflow&&(i="max"),i},this.setErrorMessage=(t=!1)=>{if(this.errorMessage=void 0,!this.valid){const i=this.getInputError();this.errorMessage=t||this.customErrorMessage.lock&&void 0!==this.customErrorMessage.message?this.customErrorMessage.message:"required"===i?this.messages.errors[i]:["min","max","minMax"].includes(i)?this.messages.input.date.error[i].replace("{min}",m(this.min,this.systemLocale)).replace("{max}",m(this.max,this.systemLocale)):this.messages.input.date.error.badInput.replace("{pattern}",this.renderPattern()).replace("{date}",m(h(new Date("2025-12-24")),this.systemLocale))}},this.renderPattern=()=>{let t=p(this.systemLocale);for(const i in this.messages.input.date.pattern)t=t.replace(i,this.messages.input.date.pattern[i]);return`<span aria-hidden="true">${t}</span><span class="mg-u-visually-hidden">${[...t].join(" ")}</span>`}}validateValue(t){if(this.validityCheckPending=!0,["",void 0].includes(t))this.value=null;else{if(t&&!o(t))throw Error(`<mg-input-date> props 'value' must be a valid string. Passed value: ${l(t)}.`);null===t||this.isValidPattern(t)?this.valueChange.emit(t):console.error("<mg-input-date> props 'value' doesn't match pattern: 'yyyy-mm-dd'.")}}watchReadonly(t){t?this.classCollection.add(c):this.classCollection.delete(c)}validateMinMax(t){if(t&&!this.isValidPattern(t))throw Error(`<mg-input-date> props 'min/max' doesn't match pattern: 'yyyy-mm-dd'. Passed value: ${l(t)}.`)}handleValidityChange(t,i,e){void 0!==this.input&&(this.input[e]=t,this.checkValidity(),this.hasDisplayedError&&(this.setErrorMessage(),this.hasDisplayedError=!1))}watchDisabled(t){t?this.classCollection.add(g):this.classCollection.delete(g)}async setFocus(){var t;null===(t=this.input)||void 0===t||t.focus()}displayError(){return new Promise((t=>{requestAnimationFrame((()=>{this.checkValidity(),this.setErrorMessage(),this.hasDisplayedError=this.invalid,t()}))}))}async setError(t,i,e=!1){if("boolean"!=typeof t)throw Error('<mg-input-date> method "setError()" param "valid" must be a boolean.');if(void 0!==i&&!o(i))throw Error('<mg-input-date> method "setError()" param "errorMessage" must be a string.');this.customErrorMessage={lock:!t&&e,message:t?void 0:i},this.validityCheckPending=!1,this.setValidity(t),this.setErrorMessage(!0),this.hasDisplayedError=this.invalid}async reset(){if(!this.readonly)return this.value=null,new Promise((t=>{requestAnimationFrame((()=>{this.customErrorMessage={lock:!1},this.checkValidity(),this.errorMessage=void 0,this.hasDisplayedError=!1,t()}))}))}setValidity(t){const i=this.valid;this.customErrorMessage.lock&&(void 0===this.customErrorMessage.message||t)||(this.valid=t),this.invalid=!this.valid,(void 0===this.handlerInProgress||"blur"===this.handlerInProgress&&this.valid!==i)&&this.inputValid.emit(this.valid)}componentWillLoad(){const t=u(this.element);return this.locale=t.locale,this.messages=t.messages,this.systemLocale=Intl.DateTimeFormat().resolvedOptions().locale,d(this),this.validateValue(this.value),this.validateMinMax(this.min),this.validateMinMax(this.max),this.watchReadonly(this.readonly),this.watchDisabled(this.disabled),setTimeout((()=>{this.checkValidity(),this.validityCheckPending=!1}),0)}componentDidUpdate(){this.validityCheckPending&&void 0!==this.input&&(this.validityCheckPending=!1,this.checkValidity(),this.hasDisplayedError&&this.setErrorMessage())}render(){return a("mg-input",{key:"3d3f6910dde9c32bbf3d0c853e0c778380ed40fc",label:this.label,identifier:this.identifier,class:this.classCollection.join(),labelOnTop:this.labelOnTop,labelHide:this.labelHide,required:this.required,tooltip:this.tooltip,tooltipPosition:this.readonly&&null===this.value?"label":this.tooltipPosition,helpText:this.formatHelpText(this.helpText),errorMessage:this.errorMessage},this.readonly?this.value&&a("b",{class:"mg-c-input__readonly-value"},m(this.value,this.locale)):a("input",{type:"date",class:"mg-c-input__box",min:this.min,max:this.max,value:this.value,id:this.identifier,name:this.name,disabled:this.disabled,required:this.required,"aria-invalid":""+(!0===this.invalid),onInput:this.handleInput,onBlur:this.handleBlur,onKeyDown:this.handleKeyDown,ref:t=>{null!==t&&(this.input=t)}}))}get element(){return this}static get watchers(){return{value:[{validateValue:0}],readonly:[{watchReadonly:0},{handleValidityChange:0}],min:[{validateMinMax:0},{handleValidityChange:0}],max:[{validateMinMax:0},{handleValidityChange:0}],required:[{handleValidityChange:0}],disabled:[{handleValidityChange:0},{watchDisabled:0}]}}static get style(){return".mg-c-input__readonly-value{min-height:var(--mg-b-font-size);align-self:flex-start;margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2);overflow-wrap:anywhere}.mg-c-input--label-on-top .mg-c-input__readonly-value{margin-top:0}.mg-c-input__box{height:var(--mg-b-size-min-height);box-sizing:border-box;padding:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2) var(--mg-b-size-8);border-width:var(--mg-c-input-border-width);border-style:solid;border-color:var(--mg-c-input-color-border);border-radius:var(--mg-c-input-border-radius);background-color:var(--mg-b-color-light);color:var(--mg-b-color-dark);font-family:inherit;font-size:var(--mg-b-font-size);text-align:var(--mg-c-input-text-align, left)}.mg-c-input__box::placeholder{color:var(--mg-c-input-placeholder-color-text);font-style:italic}.mg-c-input__box:focus{box-shadow:0 0 var(--mg-b-size-4) var(--mg-c-input-color-box-shadow-focus)}.mg-c-input__box:disabled{opacity:var(--mg-b-opacity-element-disabled)}.mg-c-input.mg-c-input--has-error .mg-c-input__box{border-color:var(--mg-b-color-danger)}.mg-c-input.mg-c-input--is-input-group-append{--mg-c-button-border-radius-top-left:0;--mg-c-button-border-radius-bottom-left:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box{margin-right:calc(-1*var(--mg-b-size-border));border-bottom-right-radius:0;border-top-right-radius:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box:focus-visible{outline-offset:calc(-1*var(--mg-b-size-2));outline-style:solid;outline-width:var(--mg-b-size-2)}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]){--mg-c-button-border-radius-top-right:0;--mg-c-button-border-radius-bottom-right:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:not(:last-of-type)){--mg-c-button-border-right-width:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:last-of-type){--mg-c-button-border-radius-top-right:var(--mg-c-input-border-radius);--mg-c-button-border-radius-bottom-right:var(--mg-c-input-border-radius)}.mg-c-input.mg-c-input--is-append-input-slot-content:not(.mg-c-input--readonly) ::slotted([slot=append-input]){align-self:start;padding-top:calc((var(--mg-b-size-min-height) - var(--mg-b-size-16))/2)}.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container{position:relative}.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container>mg-icon:first-of-type{position:absolute;top:50%;left:var(--mg-b-size-8);color:var(--mg-c-input-color-icon);transform:translateY(-50%)}.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container .mg-c-input__box{padding-left:calc(var(--mg-b-size-16) + var(--mg-b-size-8)*2)}.mg-u-visually-hidden{position:absolute !important;overflow:hidden !important;width:.1rem !important;height:.1rem !important;padding:0 !important;border:0 !important;margin:-0.1rem !important;clip-path:inset(50%) !important;white-space:nowrap !important}.mg-u-visually-hidden *{overflow:hidden !important}*:focus:not(:focus-visible){outline:none}@media (prefers-reduced-motion){*{animation:none !important;transition:none !important}}a{color:inherit;text-decoration:underline}a:has(mg-icon){display:inline-flex;align-items:center;gap:var(--mg-b-size-4)}a:hover,a:focus,a:active{text-decoration:none}"}},[1,"mg-input-date",{value:[1537],identifier:[1],name:[1],label:[1],labelOnTop:[4,"label-on-top"],labelHide:[4,"label-hide"],required:[4],readonly:[4],min:[1],max:[1],disabled:[4],tooltip:[1],tooltipPosition:[1,"tooltip-position"],helpText:[1,"help-text"],valid:[1028],invalid:[1028],classCollection:[32],errorMessage:[32],setFocus:[64],displayError:[64],setError:[64],reset:[64]},void 0,{value:[{validateValue:0}],readonly:[{watchReadonly:0},{handleValidityChange:0}],min:[{validateMinMax:0},{handleValidityChange:0}],max:[{validateMinMax:0},{handleValidityChange:0}],required:[{handleValidityChange:0}],disabled:[{handleValidityChange:0},{watchDisabled:0}]}]);function _(){"undefined"!=typeof customElements&&["mg-input-date","mg-icon","mg-input","mg-input-title","mg-tooltip","mg-tooltip-content"].forEach((i=>{switch(i){case"mg-input-date":customElements.get(t(i))||customElements.define(t(i),w);break;case"mg-icon":customElements.get(t(i))||b();break;case"mg-input":customElements.get(t(i))||v();break;case"mg-input-title":customElements.get(t(i))||f();break;case"mg-tooltip":customElements.get(t(i))||y();break;case"mg-tooltip-content":customElements.get(t(i))||x()}}))}_();const z=w,E=_;export{z as MgInputDate,E as defineCustomElement}

package/dist/components/mg-input-file.js

@@ -1 +1 @@
-import{transformTag as t,proxyCustomElement as i,HTMLElement as e,createEvent as s,h as o}from"@stencil/core/internal/client";import{C as r,d as n,t as a,i as l,j as h}from"./index2.js";import{n as c}from"./index3.js";import{l as m,i as p}from"./index4.js";import{b as u}from"./mg-input.conf.js";import{d as g}from"./mg-button2.js";import{d}from"./mg-icon2.js";import{d as b}from"./mg-input2.js";import{d as f}from"./mg-input-title2.js";import{d as v}from"./mg-tooltip2.js";import{d as _}from"./mg-tooltip-content2.js";const w=i(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.valueChange=s(this,"value-change",7),this.inputValid=s(this,"input-valid",7),this.hasDisplayedError=!1,this.customErrorMessage={lock:!1},this.name=this.identifier,this.labelOnTop=!1,this.labelHide=!1,this.multiple=!1,this.required=!1,this.disabled=!1,this.tooltipPosition="input",this.classCollection=new r(["mg-c-input--file"]),this.files=[],this.setValidity=t=>{const i=this.valid;this.customErrorMessage.lock&&(void 0===this.customErrorMessage.message||t)||(this.valid=t),this.invalid=!this.valid,(void 0===this.handlerInProgress||"blur"===this.handlerInProgress&&this.valid!==i)&&this.inputValid.emit(this.valid)},this.handleInputChange=t=>{this.checkValidity(),this.hasDisplayedError&&this.setErrorMessage(),this.files=Array.from(t.target.files),this.fileButtonElement.focus()},this.handleInputFocus=()=>{this.fileButtonElement.dataset.focusVisible=""},this.handleInputBlur=()=>{this.handlerInProgress="blur",this.displayError().finally((()=>{this.handlerInProgress=void 0})),delete this.fileButtonElement.dataset.focusVisible},this.handleButtonBlur=()=>{this.inputElement.blur()},this.handleButtonClick=()=>{this.inputElement.click()},this.checkValidity=()=>{this.setValidity(this.disabled||!this.isMaxSizeExceeded()&&this.inputElement.checkValidity())},this.handleDeleteFileClick=()=>{this.files=[],this.fileButtonElement.focus()},this.setErrorMessage=(t=!1)=>{this.errorMessage=void 0,this.valid||(t||this.customErrorMessage.lock&&void 0!==this.customErrorMessage.message?this.errorMessage=this.customErrorMessage.message:this.isMaxSizeExceeded()?this.errorMessage=this.messages.input.file.errors.maxSize.replace("{{maxSize}}",m(this.maxSize,this.locale)):this.inputElement.validity.valueMissing&&(this.errorMessage=this.messages.errors.required))},this.isMaxSizeExceeded=()=>this.maxSize>=0&&this.files.some((t=>t.size>this.maxSize)),this.renderFiles=()=>{const t=this.identifier+"-file-list",i=t=>o("span",{class:"mg-c-input__file-item-name"},t.name,t.size>0?o("span",{class:"mg-c-input__file-item-size"}," "+m(t.size,this.locale)):void 0),e=()=>o("mg-button",{variant:"flat",class:"mg-c-input__file-delete-button","is-icon":!0,label:this.messages.input.file.deleteButton,type:"button",disabled:this.disabled,"aria-controls":[this.identifier,t].join(" "),onClick:this.handleDeleteFileClick},o("mg-icon",{icon:"cross"}));return 0===this.files.length?null:1===this.files.length?o("div",{class:"mg-c-input__file-item"},i(this.files[0]),e()):o("div",{class:"mg-c-input__file-list-container"},o("ul",{role:"list",class:"mg-c-input__file-list",id:t},Array.from(this.files).map(((t,e)=>o("li",{class:"mg-c-input__file-item",key:`${t.name}-${e}`},i(t))))),e())}}watchValue(t){if(n(t))this.files=this.value.map((t=>new File([],t)));else if((t=>Array.isArray(t)&&t.every((t=>h(t)&&"string"==typeof t.name&&"number"==typeof t.size)))(t))this.files=this.value;else{if(void 0!==t)throw Error(`<mg-input-file> prop "value" must be an array of strings or File objects. Passed value: ${a(t)}.`);this.files=[]}this.valueChange.emit(t)}watchMultiple(){if(!1===this.multiple&&this.files.length>1)throw Error('<mg-input-file> prop "value" must be a single file when prop "multiple" is set to false.')}watchAccept(t){if(void 0!==t&&!l(t))throw Error('<mg-input-file> prop "accept" must be a valid string.')}handleValidityChange(t,i,e){void 0!==this.inputElement&&(this.inputElement[e]=t,this.checkValidity(),this.hasDisplayedError&&(this.setErrorMessage(),this.hasDisplayedError=!1))}watchDisabled(t){t?this.classCollection.add(u):this.classCollection.delete(u)}watchHelpText(){if(!l(this.helpText)){const t=[];void 0!==this.maxSize&&t.push(this.messages.input.file.helpText.maxSize.replace("{{maxSize}}",m(this.maxSize,this.locale))),void 0!==this.accept&&t.push(this.messages.input.file.helpText.accept.replace("{{accept}}",this.accept)),this.helpText=t.join(". ")}}watchFiles(t,i){a(t)!==a(i)&&(this.value=t.length>0?t:void 0)}async setFocus(){this.fileButtonElement.focus()}displayError(){return new Promise((t=>{requestAnimationFrame((()=>{this.checkValidity(),this.setErrorMessage(),this.hasDisplayedError=this.invalid,t()}))}))}async setError(t,i,e=!1){if("boolean"!=typeof t)throw Error('<mg-input-file> method "setError()" param "valid" must be a boolean.');if(void 0!==i&&!l(i))throw Error('<mg-input-file> method "setError()" param "errorMessage" must be a string.');this.customErrorMessage={lock:!t&&e,message:t?void 0:i},this.setValidity(t),this.setErrorMessage(!0),this.hasDisplayedError=this.invalid}async reset(){return this.files=[],new Promise((t=>{requestAnimationFrame((()=>{this.customErrorMessage={lock:!1},this.checkValidity(),this.errorMessage=void 0,this.hasDisplayedError=!1,t()}))}))}componentWillLoad(){const t=p(this.element);return this.locale=t.locale,this.messages=t.messages,c(this),this.watchValue(this.value),this.watchDisabled(this.disabled),this.watchHelpText(),this.watchAccept(this.accept),this.watchMultiple(),setTimeout((()=>{this.checkValidity()}),0)}render(){return o("mg-input",{key:"3c4c0ebdd1661e381f0002b2ae68dcf454097913",label:this.label,identifier:this.identifier,class:this.classCollection.join(),labelOnTop:this.labelOnTop,labelHide:this.labelHide,required:this.required,tooltip:this.tooltip,tooltipPosition:this.tooltipPosition,helpText:this.helpText,errorMessage:this.errorMessage},o("div",{key:"bd7665fe8c6e01ec4e04fbbbf9cc21ccc4128b17",class:"mg-c-input__file-container"},o("input",{key:"f27d10160115ec1ff5163a1c55aa2658779c6fd7",name:this.name,id:this.identifier,class:"mg-u-visually-hidden",type:"file",multiple:!0===this.multiple,capture:this.capture,accept:this.accept,disabled:this.disabled,required:0===this.files.length&&this.required,onFocus:this.handleInputFocus,onBlur:this.handleInputBlur,onChange:this.handleInputChange,"aria-invalid":""+(!0===this.invalid),ref:t=>{this.inputElement=t}}),o("mg-button",{key:"d16c4cbd95d676bcddb895659aab37f0f9c396eb",variant:"secondary",class:"mg-c-input__file-button",type:"button",disabled:this.disabled,onClick:this.handleButtonClick,onBlur:this.handleButtonBlur,tabindex:"-1",ref:t=>{this.fileButtonElement=t}},this.messages.input.file.browse),this.renderFiles()))}get element(){return this}static get watchers(){return{value:[{watchValue:0},{watchMultiple:0}],multiple:[{watchMultiple:0}],accept:[{watchAccept:0},{watchHelpText:0}],required:[{handleValidityChange:0}],disabled:[{handleValidityChange:0},{watchDisabled:0}],helpText:[{watchHelpText:0}],maxSize:[{watchHelpText:0}],files:[{watchFiles:0}]}}static get style(){return".mg-c-input__readonly-value{min-height:var(--mg-b-font-size);align-self:flex-start;margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2);overflow-wrap:anywhere}.mg-c-input__box{height:var(--mg-b-size-min-height);box-sizing:border-box;padding:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2) var(--mg-b-size-8);border-width:var(--mg-c-input-border-width);border-style:solid;border-color:var(--mg-c-input-color-border);border-radius:var(--mg-c-input-border-radius);background-color:var(--mg-b-color-light);color:var(--mg-b-color-dark);font-family:inherit;font-size:var(--mg-b-font-size);text-align:var(--mg-c-input-text-align, left)}.mg-c-input__box::placeholder{color:var(--mg-c-input-placeholder-color-text);font-style:italic}.mg-c-input__box:focus{box-shadow:0 0 var(--mg-b-size-4) var(--mg-c-input-color-box-shadow-focus)}.mg-c-input__box:disabled{opacity:var(--mg-b-opacity-element-disabled)}.mg-c-input.mg-c-input--has-error .mg-c-input__box{border-color:var(--mg-b-color-danger)}.mg-c-input.mg-c-input--is-input-group-append{--mg-c-button-border-radius-top-left:0;--mg-c-button-border-radius-bottom-left:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box{margin-right:calc(-1*var(--mg-b-size-border));border-bottom-right-radius:0;border-top-right-radius:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box:focus-visible{outline-offset:calc(-1*var(--mg-b-size-2));outline-style:solid;outline-width:var(--mg-b-size-2)}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]){--mg-c-button-border-radius-top-right:0;--mg-c-button-border-radius-bottom-right:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:not(:last-of-type)){--mg-c-button-border-right-width:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:last-of-type){--mg-c-button-border-radius-top-right:var(--mg-c-input-border-radius);--mg-c-button-border-radius-bottom-right:var(--mg-c-input-border-radius)}.mg-c-input.mg-c-input--is-append-input-slot-content:not(.mg-c-input--readonly) ::slotted([slot=append-input]){align-self:start;padding-top:calc((var(--mg-b-size-min-height) - var(--mg-b-size-16))/2)}.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container{position:relative}.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container>mg-icon:first-of-type{position:absolute;top:50%;left:var(--mg-b-size-8);color:var(--mg-c-input-color-icon);transform:translateY(-50%)}.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container .mg-c-input__box{padding-left:calc(var(--mg-b-size-16) + var(--mg-b-size-8)*2)}.mg-u-visually-hidden{position:absolute !important;overflow:hidden !important;width:.1rem !important;height:.1rem !important;padding:0 !important;border:0 !important;margin:-0.1rem !important;clip-path:inset(50%) !important;white-space:nowrap !important}.mg-u-visually-hidden *{overflow:hidden !important}*:focus:not(:focus-visible){outline:none}@media (prefers-reduced-motion){*{animation:none !important;transition:none !important}}.mg-c-input__file-container{display:flex;flex-direction:column;gap:var(--mg-b-size-8)}.mg-c-input__file-item{display:inline-flex;min-height:var(--mg-b-size-min-height);align-items:center;padding-left:var(--mg-b-size-8);background-color:var(--mg-b-color-neutral-10);font-weight:600;gap:var(--mg-b-size-8)}.mg-c-input__file-item-name{word-break:break-all}.mg-c-input__file-item-size{color:var(--mg-b-color-neutral-90);font-weight:400;word-break:normal}.mg-c-input__file-delete-button{align-self:flex-start}.mg-c-input__file-list{display:flex;flex-direction:column;padding:0;margin:0;gap:var(--mg-b-size-4);list-style:none}.mg-c-input__file-list .mg-c-input__file-item{min-height:unset;padding:var(--mg-b-size-8)}.mg-c-input__file-list-container{position:relative;padding:var(--mg-b-size-8) calc(var(--mg-b-size-8) + var(--mg-b-size-min-height)) var(--mg-b-size-8) var(--mg-b-size-8);border:var(--mg-b-size-border) solid var(--mg-b-color-neutral-30);border-radius:var(--mg-b-size-4)}.mg-c-input__file-list-container .mg-c-input__file-delete-button{position:absolute;top:0;right:0}"}},[1,"mg-input-file",{value:[1032],identifier:[1],name:[1],label:[1],labelOnTop:[4,"label-on-top"],labelHide:[4,"label-hide"],multiple:[4],accept:[1],maxSize:[2,"max-size"],capture:[1],required:[4],disabled:[4],tooltip:[1],tooltipPosition:[1,"tooltip-position"],helpText:[1025,"help-text"],valid:[1028],invalid:[1028],classCollection:[32],errorMessage:[32],files:[32],setFocus:[64],displayError:[64],setError:[64],reset:[64]},void 0,{value:[{watchValue:0},{watchMultiple:0}],multiple:[{watchMultiple:0}],accept:[{watchAccept:0},{watchHelpText:0}],required:[{handleValidityChange:0}],disabled:[{handleValidityChange:0},{watchDisabled:0}],helpText:[{watchHelpText:0}],maxSize:[{watchHelpText:0}],files:[{watchFiles:0}]}]);function y(){"undefined"!=typeof customElements&&["mg-input-file","mg-button","mg-icon","mg-input","mg-input-title","mg-tooltip","mg-tooltip-content"].forEach((i=>{switch(i){case"mg-input-file":customElements.get(t(i))||customElements.define(t(i),w);break;case"mg-button":customElements.get(t(i))||g();break;case"mg-icon":customElements.get(t(i))||d();break;case"mg-input":customElements.get(t(i))||b();break;case"mg-input-title":customElements.get(t(i))||f();break;case"mg-tooltip":customElements.get(t(i))||v();break;case"mg-tooltip-content":customElements.get(t(i))||_()}}))}y();const x=w,z=y;export{x as MgInputFile,z as defineCustomElement}
+import{transformTag as t,proxyCustomElement as i,HTMLElement as e,createEvent as s,h as o}from"@stencil/core/internal/client";import{C as a,d as n,t as r,i as l,j as h}from"./index2.js";import{n as m}from"./index3.js";import{l as c,i as p}from"./index4.js";import{b as u}from"./mg-input.conf.js";import{d as g}from"./mg-button2.js";import{d}from"./mg-icon2.js";import{d as b}from"./mg-input2.js";import{d as f}from"./mg-input-title2.js";import{d as v}from"./mg-tooltip2.js";import{d as _}from"./mg-tooltip-content2.js";const w=i(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.valueChange=s(this,"value-change",7),this.inputValid=s(this,"input-valid",7),this.hasDisplayedError=!1,this.validityCheckPending=!1,this.customErrorMessage={lock:!1},this.name=this.identifier,this.labelOnTop=!1,this.labelHide=!1,this.multiple=!1,this.required=!1,this.disabled=!1,this.tooltipPosition="input",this.classCollection=new a(["mg-c-input--file"]),this.files=[],this.setValidity=t=>{const i=this.valid;this.customErrorMessage.lock&&(void 0===this.customErrorMessage.message||t)||(this.valid=t),this.invalid=!this.valid,(void 0===this.handlerInProgress||"blur"===this.handlerInProgress&&this.valid!==i)&&this.inputValid.emit(this.valid)},this.handleInputChange=t=>{this.checkValidity(),this.hasDisplayedError&&this.setErrorMessage(),this.files=Array.from(t.target.files),this.fileButtonElement.focus()},this.handleInputFocus=()=>{this.fileButtonElement.dataset.focusVisible=""},this.handleInputBlur=()=>{this.handlerInProgress="blur",this.displayError().finally((()=>{this.handlerInProgress=void 0})),delete this.fileButtonElement.dataset.focusVisible},this.handleButtonBlur=()=>{this.inputElement.blur()},this.handleButtonClick=()=>{this.inputElement.click()},this.checkValidity=()=>{this.setValidity(this.disabled||!this.isMaxSizeExceeded()&&this.inputElement.checkValidity())},this.handleDeleteFileClick=()=>{this.files=[],this.fileButtonElement.focus()},this.setErrorMessage=(t=!1)=>{this.errorMessage=void 0,this.valid||(t||this.customErrorMessage.lock&&void 0!==this.customErrorMessage.message?this.errorMessage=this.customErrorMessage.message:this.isMaxSizeExceeded()?this.errorMessage=this.messages.input.file.errors.maxSize.replace("{{maxSize}}",c(this.maxSize,this.locale)):this.inputElement.validity.valueMissing&&(this.errorMessage=this.messages.errors.required))},this.isMaxSizeExceeded=()=>this.maxSize>=0&&this.files.some((t=>t.size>this.maxSize)),this.renderFiles=()=>{const t=this.identifier+"-file-list",i=t=>o("span",{class:"mg-c-input__file-item-name"},t.name,t.size>0?o("span",{class:"mg-c-input__file-item-size"}," "+c(t.size,this.locale)):void 0),e=()=>o("mg-button",{variant:"flat",class:"mg-c-input__file-delete-button","is-icon":!0,label:this.messages.input.file.deleteButton,type:"button",disabled:this.disabled,"aria-controls":[this.identifier,t].join(" "),onClick:this.handleDeleteFileClick},o("mg-icon",{icon:"cross"}));return 0===this.files.length?null:1===this.files.length?o("div",{class:"mg-c-input__file-item"},i(this.files[0]),e()):o("div",{class:"mg-c-input__file-list-container"},o("ul",{role:"list",class:"mg-c-input__file-list",id:t},Array.from(this.files).map(((t,e)=>o("li",{class:"mg-c-input__file-item",key:`${t.name}-${e}`},i(t))))),e())}}watchValue(t){if(this.validityCheckPending=!0,n(t))this.files=this.value.map((t=>new File([],t)));else if((t=>Array.isArray(t)&&t.every((t=>h(t)&&"string"==typeof t.name&&"number"==typeof t.size)))(t))this.files=this.value;else{if(void 0!==t)throw Error(`<mg-input-file> prop "value" must be an array of strings or File objects. Passed value: ${r(t)}.`);this.files=[]}this.valueChange.emit(t)}watchMultiple(){if(!1===this.multiple&&this.files.length>1)throw Error('<mg-input-file> prop "value" must be a single file when prop "multiple" is set to false.')}watchAccept(t){if(void 0!==t&&!l(t))throw Error('<mg-input-file> prop "accept" must be a valid string.')}handleValidityChange(t,i,e){void 0!==this.inputElement&&(this.inputElement[e]=t,this.checkValidity(),this.hasDisplayedError&&(this.setErrorMessage(),this.hasDisplayedError=!1))}watchDisabled(t){t?this.classCollection.add(u):this.classCollection.delete(u)}watchHelpText(){if(!l(this.helpText)){const t=[];void 0!==this.maxSize&&t.push(this.messages.input.file.helpText.maxSize.replace("{{maxSize}}",c(this.maxSize,this.locale))),void 0!==this.accept&&t.push(this.messages.input.file.helpText.accept.replace("{{accept}}",this.accept)),this.helpText=t.join(". ")}}watchFiles(t,i){r(t)!==r(i)&&(this.value=t.length>0?t:void 0)}async setFocus(){this.fileButtonElement.focus()}displayError(){return new Promise((t=>{requestAnimationFrame((()=>{this.checkValidity(),this.setErrorMessage(),this.hasDisplayedError=this.invalid,t()}))}))}async setError(t,i,e=!1){if("boolean"!=typeof t)throw Error('<mg-input-file> method "setError()" param "valid" must be a boolean.');if(void 0!==i&&!l(i))throw Error('<mg-input-file> method "setError()" param "errorMessage" must be a string.');this.customErrorMessage={lock:!t&&e,message:t?void 0:i},this.validityCheckPending=!1,this.setValidity(t),this.setErrorMessage(!0),this.hasDisplayedError=this.invalid}async reset(){return this.files=[],new Promise((t=>{requestAnimationFrame((()=>{this.customErrorMessage={lock:!1},this.checkValidity(),this.errorMessage=void 0,this.hasDisplayedError=!1,t()}))}))}componentWillLoad(){const t=p(this.element);return this.locale=t.locale,this.messages=t.messages,m(this),this.watchValue(this.value),this.watchDisabled(this.disabled),this.watchHelpText(),this.watchAccept(this.accept),this.watchMultiple(),setTimeout((()=>{this.checkValidity(),this.validityCheckPending=!1}),0)}componentDidUpdate(){this.validityCheckPending&&void 0!==this.inputElement&&(this.validityCheckPending=!1,this.checkValidity(),this.hasDisplayedError&&this.setErrorMessage())}render(){return o("mg-input",{key:"f1613e1105c1eea0c08624ffc270a74889d85ce0",label:this.label,identifier:this.identifier,class:this.classCollection.join(),labelOnTop:this.labelOnTop,labelHide:this.labelHide,required:this.required,tooltip:this.tooltip,tooltipPosition:this.tooltipPosition,helpText:this.helpText,errorMessage:this.errorMessage},o("div",{key:"23897ae896de9569ea68bf88e26f1349eb5bc909",class:"mg-c-input__file-container"},o("input",{key:"0601a8af1c3f17331cb671184353b8b63a5f4fa8",name:this.name,id:this.identifier,class:"mg-u-visually-hidden",type:"file",multiple:!0===this.multiple,capture:this.capture,accept:this.accept,disabled:this.disabled,required:0===this.files.length&&this.required,onFocus:this.handleInputFocus,onBlur:this.handleInputBlur,onChange:this.handleInputChange,"aria-invalid":""+(!0===this.invalid),ref:t=>{this.inputElement=t}}),o("mg-button",{key:"5ac1076a443cc1a0bb2d7168b1d248d31faeedfd",variant:"secondary",class:"mg-c-input__file-button",type:"button",disabled:this.disabled,onClick:this.handleButtonClick,onBlur:this.handleButtonBlur,tabindex:"-1",ref:t=>{this.fileButtonElement=t}},this.messages.input.file.browse),this.renderFiles()))}get element(){return this}static get watchers(){return{value:[{watchValue:0},{watchMultiple:0}],multiple:[{watchMultiple:0}],accept:[{watchAccept:0},{watchHelpText:0}],required:[{handleValidityChange:0}],disabled:[{handleValidityChange:0},{watchDisabled:0}],helpText:[{watchHelpText:0}],maxSize:[{watchHelpText:0}],files:[{watchFiles:0}]}}static get style(){return".mg-c-input__readonly-value{min-height:var(--mg-b-font-size);align-self:flex-start;margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2);overflow-wrap:anywhere}.mg-c-input--label-on-top .mg-c-input__readonly-value{margin-top:0}.mg-c-input__box{height:var(--mg-b-size-min-height);box-sizing:border-box;padding:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2) var(--mg-b-size-8);border-width:var(--mg-c-input-border-width);border-style:solid;border-color:var(--mg-c-input-color-border);border-radius:var(--mg-c-input-border-radius);background-color:var(--mg-b-color-light);color:var(--mg-b-color-dark);font-family:inherit;font-size:var(--mg-b-font-size);text-align:var(--mg-c-input-text-align, left)}.mg-c-input__box::placeholder{color:var(--mg-c-input-placeholder-color-text);font-style:italic}.mg-c-input__box:focus{box-shadow:0 0 var(--mg-b-size-4) var(--mg-c-input-color-box-shadow-focus)}.mg-c-input__box:disabled{opacity:var(--mg-b-opacity-element-disabled)}.mg-c-input.mg-c-input--has-error .mg-c-input__box{border-color:var(--mg-b-color-danger)}.mg-c-input.mg-c-input--is-input-group-append{--mg-c-button-border-radius-top-left:0;--mg-c-button-border-radius-bottom-left:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box{margin-right:calc(-1*var(--mg-b-size-border));border-bottom-right-radius:0;border-top-right-radius:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box:focus-visible{outline-offset:calc(-1*var(--mg-b-size-2));outline-style:solid;outline-width:var(--mg-b-size-2)}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]){--mg-c-button-border-radius-top-right:0;--mg-c-button-border-radius-bottom-right:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:not(:last-of-type)){--mg-c-button-border-right-width:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:last-of-type){--mg-c-button-border-radius-top-right:var(--mg-c-input-border-radius);--mg-c-button-border-radius-bottom-right:var(--mg-c-input-border-radius)}.mg-c-input.mg-c-input--is-append-input-slot-content:not(.mg-c-input--readonly) ::slotted([slot=append-input]){align-self:start;padding-top:calc((var(--mg-b-size-min-height) - var(--mg-b-size-16))/2)}.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container{position:relative}.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container>mg-icon:first-of-type{position:absolute;top:50%;left:var(--mg-b-size-8);color:var(--mg-c-input-color-icon);transform:translateY(-50%)}.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container .mg-c-input__box{padding-left:calc(var(--mg-b-size-16) + var(--mg-b-size-8)*2)}.mg-u-visually-hidden{position:absolute !important;overflow:hidden !important;width:.1rem !important;height:.1rem !important;padding:0 !important;border:0 !important;margin:-0.1rem !important;clip-path:inset(50%) !important;white-space:nowrap !important}.mg-u-visually-hidden *{overflow:hidden !important}*:focus:not(:focus-visible){outline:none}@media (prefers-reduced-motion){*{animation:none !important;transition:none !important}}.mg-c-input__file-container{display:flex;flex-direction:column;gap:var(--mg-b-size-8)}.mg-c-input__file-item{display:inline-flex;min-height:var(--mg-b-size-min-height);align-items:center;padding-left:var(--mg-b-size-8);background-color:var(--mg-b-color-neutral-10);font-weight:600;gap:var(--mg-b-size-8)}.mg-c-input__file-item-name{word-break:break-all}.mg-c-input__file-item-size{color:var(--mg-b-color-neutral-90);font-weight:400;word-break:normal}.mg-c-input__file-delete-button{align-self:flex-start}.mg-c-input__file-list{display:flex;flex-direction:column;padding:0;margin:0;gap:var(--mg-b-size-4);list-style:none}.mg-c-input__file-list .mg-c-input__file-item{min-height:unset;padding:var(--mg-b-size-8)}.mg-c-input__file-list-container{position:relative;padding:var(--mg-b-size-8) calc(var(--mg-b-size-8) + var(--mg-b-size-min-height)) var(--mg-b-size-8) var(--mg-b-size-8);border:var(--mg-b-size-border) solid var(--mg-b-color-neutral-30);border-radius:var(--mg-b-size-4)}.mg-c-input__file-list-container .mg-c-input__file-delete-button{position:absolute;top:0;right:0}"}},[1,"mg-input-file",{value:[1032],identifier:[1],name:[1],label:[1],labelOnTop:[4,"label-on-top"],labelHide:[4,"label-hide"],multiple:[4],accept:[1],maxSize:[2,"max-size"],capture:[1],required:[4],disabled:[4],tooltip:[1],tooltipPosition:[1,"tooltip-position"],helpText:[1025,"help-text"],valid:[1028],invalid:[1028],classCollection:[32],errorMessage:[32],files:[32],setFocus:[64],displayError:[64],setError:[64],reset:[64]},void 0,{value:[{watchValue:0},{watchMultiple:0}],multiple:[{watchMultiple:0}],accept:[{watchAccept:0},{watchHelpText:0}],required:[{handleValidityChange:0}],disabled:[{handleValidityChange:0},{watchDisabled:0}],helpText:[{watchHelpText:0}],maxSize:[{watchHelpText:0}],files:[{watchFiles:0}]}]);function y(){"undefined"!=typeof customElements&&["mg-input-file","mg-button","mg-icon","mg-input","mg-input-title","mg-tooltip","mg-tooltip-content"].forEach((i=>{switch(i){case"mg-input-file":customElements.get(t(i))||customElements.define(t(i),w);break;case"mg-button":customElements.get(t(i))||g();break;case"mg-icon":customElements.get(t(i))||d();break;case"mg-input":customElements.get(t(i))||b();break;case"mg-input-title":customElements.get(t(i))||f();break;case"mg-tooltip":customElements.get(t(i))||v();break;case"mg-tooltip-content":customElements.get(t(i))||_()}}))}y();const x=w,z=y;export{x as MgInputFile,z as defineCustomElement}

package/dist/components/mg-input-numeric.js

@@ -1 +1 @@
-import{transformTag as t,proxyCustomElement as i,HTMLElement as e,createEvent as s,h as n}from"@stencil/core/internal/client";import{C as a,i as r,t as o}from"./index2.js";import{n as h}from"./index3.js";import{c as l,d as m,e as c,f as u,i as p}from"./index4.js";import{c as g,b as d,w as b}from"./mg-input.conf.js";import{d as v}from"./mg-icon2.js";import{d as f}from"./mg-input2.js";import{d as w}from"./mg-input-title2.js";import{d as y}from"./mg-tooltip2.js";import{d as _}from"./mg-tooltip-content2.js";const x=["decimal","integer"],z=["none","number","currency","percent","unit"],E=i(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.valueChange=s(this,"value-change",7),this.inputValid=s(this,"input-valid",7),this.hasDisplayedError=!1,this.customErrorMessage={lock:!1},this.name=this.identifier,this.labelOnTop=!1,this.labelHide=!1,this.required=!1,this.readonly=!1,this.disabled=!1,this.tooltipPosition="input",this.type="decimal",this.format="number",this.currency="EUR",this.unitDisplay="short",this.integerLength=13,this.decimalLength=2,this.classCollection=new a(["mg-c-input--numeric"]),this.handleInput=()=>{this.value=this.input.value,this.checkValidity(),this.hasDisplayedError&&this.setErrorMessage()},this.handleFocus=()=>{this.hasFocus=!0},this.handleBlur=()=>{"-"===this.value&&(this.value=""),this.handlerInProgress="blur",this.displayError().finally((()=>{this.handlerInProgress=void 0,this.hasFocus=!1}))},this.checkValidity=()=>{this.setValidity(this.readonly||this.disabled||null===this.getInputError())},this.formatErrorValue=t=>l(t,this.locale,Number.isInteger(t)||"decimal"!==this.type?0:this.decimalLength),this.setErrorMessage=(t=!1)=>{if(this.errorMessage=void 0,!this.valid){const i=this.getInputError();if(t||this.customErrorMessage.lock&&void 0!==this.customErrorMessage.message)this.errorMessage=this.customErrorMessage.message;else if("required"===i)this.errorMessage=this.messages.errors[i];else{const t=this.formatErrorValue(this.min),e=this.formatErrorValue(this.max);this.errorMessage=this.messages.input.numeric.error[i].replace("{min}",t).replace("{max}",e)}}},this.getInputError=()=>{const t=t=>!t.some((t=>[null,void 0].includes(t)));return!this.input.checkValidity()&&this.input.validity.valueMissing?"required":t([this.min,this.numericValue])&&this.numericValue<this.min&&void 0===this.max?"min":t([this.max,this.numericValue])&&this.numericValue>this.max&&void 0===this.min?"max":t([this.min,this.max,this.numericValue])&&(this.numericValue<this.min||this.numericValue>this.max)?"minMax":null},this.formatValue=t=>{switch(this.format){case"number":return l(t,this.locale,"decimal"===this.type?this.decimalLength:void 0);case"currency":return u(t,this.locale,this.currency);case"percent":return c(t/100,this.locale,"decimal"===this.type?this.decimalLength:void 0);case"unit":return m(t,this.locale,this.unit,this.unitDisplay,"decimal"===this.type?this.decimalLength:void 0);case"none":return""+t}},this.validateAppendSlot=()=>{const t=this.element.querySelector('[slot="append-input"]');null!==t&&("MG-BUTTON"===t.nodeName?this.classCollection.add("mg-c-input--is-input-group-append"):(this.classCollection.add("mg-c-input--is-append-input-slot-content"),this.slotContent=t.textContent))},this.formatHelpText=t=>{if(this.readonly)return;const i=r(t)?t:void 0;return void 0!==this.min||void 0!==this.max||void 0!==i?i:void 0},this.renderReadonly=()=>void 0!==this.slotContent?n("span",{class:"mg-c-input__readonly-value"},n("b",null,this.readonlyValue),this.slotContent):n("b",{class:"mg-c-input__readonly-value"},this.readonlyValue)}validateValue(t){var i;if("string"==typeof t){t.startsWith("0")&&parseInt(t,10)>0&&(t=t.substring(1));const[e,s=""]=t.replace("-","").split(/[.,]/);this.isValidValue(t,"integer"===this.type?/^(?!-?0\d)-?\d+$/:/^(?!-?0\d)-?\d+(?:[.,]\d*)?$/,e,s)?this.storedValue=t:t=null!==(i=this.storedValue)&&void 0!==i?i:null,this.updateValues(t)}}watchReadonly(t){t?this.classCollection.add(g):this.classCollection.delete(g)}handleValidityChange(t,i,e){void 0!==this.input&&(this.input[e]=t,this.checkValidity(),this.hasDisplayedError&&(this.setErrorMessage(),this.hasDisplayedError=!1))}watchDisabled(t){t?this.classCollection.add(d):this.classCollection.delete(d)}watchMgWidth(t){b.forEach((t=>{this.classCollection.delete("mg-c-input--width-"+t)})),void 0!==t&&this.classCollection.add("mg-c-input--width-"+this.mgWidth)}validateType(t){if(!x.includes(t))throw Error(`<mg-input-numeric> prop "type" must be one of: ${x.join(", ")}. Passed value: ${o(t)}.`)}watchFormat(t){if(!z.includes(t))throw Error(`<mg-input-numeric> prop "format" must be one of: ${z.join(", ")}. Passed value: ${o(t)}.`)}validateIntegerLength(t){if(t<1)throw Error(`<mg-input-numeric> prop "integer-length" must be a positive number. Passed value: ${o(t)}.`)}validateDecimalLength(t){if(t<1)throw Error(`<mg-input-numeric> prop "decimal-length" must be a positive number, consider using prop "type" to "integer" instead. Passed value: ${o(t)}.`)}async setFocus(){var t;null===(t=this.input)||void 0===t||t.focus()}displayError(){return new Promise((t=>{requestAnimationFrame((()=>{this.checkValidity(),this.setErrorMessage(),this.hasDisplayedError=this.invalid,t()}))}))}async setError(t,i,e=!1){if("boolean"!=typeof t)throw Error('<mg-input-numeric> method "setError()" param "valid" must be a boolean.');if(void 0!==i&&!r(i))throw Error('<mg-input-numeric> method "setError()" param "errorMessage" must be a string.');this.customErrorMessage={lock:!t&&e,message:t?void 0:i},this.setValidity(t),this.setErrorMessage(!0),this.hasDisplayedError=this.invalid}async reset(){if(!this.readonly)return this.value="",new Promise((t=>{requestAnimationFrame((()=>{this.customErrorMessage={lock:!1},this.checkValidity(),this.errorMessage=void 0,this.hasDisplayedError=!1,t()}))}))}setValidity(t){const i=this.valid;this.customErrorMessage.lock&&(void 0===this.customErrorMessage.message||t)||(this.valid=t),this.invalid=!this.valid,(void 0===this.handlerInProgress||"blur"===this.handlerInProgress&&this.valid!==i)&&this.inputValid.emit(this.valid)}isValidValue(t,i,e,s){return["","-"].includes(t)||null!==i.exec(t)&&e.length<=this.integerLength&&s.length<=("integer"===this.type?0:this.decimalLength)}updateValues(t){this.value=t,void 0!==this.input&&(this.input.value=this.value),this.numericValue=["",null].includes(this.value)||isNaN(parseFloat(this.value))?null:parseFloat(this.value.replace(",",".")),(null===t||t===this.storedValue&&!Object.is(this.numericValue,-0))&&this.valueChange.emit(this.numericValue),this.readonlyValue=null!==this.numericValue?this.formatValue(this.numericValue):""}displayValue(){return this.hasFocus?this.value:this.readonlyValue}componentWillLoad(){const t=p(this.element);return this.locale=t.locale,this.messages=t.messages,h(this),this.watchFormat(this.format),this.validateType(this.type),this.validateIntegerLength(this.integerLength),this.validateDecimalLength(this.decimalLength),this.validateValue(this.value),this.validateAppendSlot(),this.watchReadonly(this.readonly),this.watchDisabled(this.disabled),this.watchMgWidth(this.mgWidth),setTimeout((()=>{this.checkValidity()}),0)}render(){return n("mg-input",{key:"dbf435211890922742cbead9ab3a738b5219df44",label:this.label,identifier:this.identifier,class:this.classCollection.join(),labelOnTop:this.labelOnTop,labelHide:this.labelHide,required:this.required,tooltip:this.tooltip,tooltipPosition:this.readonly&&void 0===this.value?"label":this.tooltipPosition,helpText:this.formatHelpText(this.helpText),errorMessage:this.errorMessage},this.readonly?this.readonlyValue&&this.renderReadonly():[n("input",{key:"input",type:"text",class:"mg-c-input__box mg-c-input__box--width",value:this.displayValue(),id:this.identifier,name:this.name,placeholder:this.placeholder,title:this.placeholder,disabled:this.disabled,required:this.required,autocomplete:"off","aria-invalid":""+(!0===this.invalid),onInput:this.handleInput,onFocus:this.handleFocus,onBlur:this.handleBlur,ref:t=>{null!==t&&(this.input=t)}}),n("slot",{key:"slot",name:"append-input"})])}get element(){return this}static get watchers(){return{value:[{validateValue:0}],readonly:[{watchReadonly:0},{handleValidityChange:0}],required:[{handleValidityChange:0}],disabled:[{handleValidityChange:0},{watchDisabled:0}],min:[{handleValidityChange:0}],max:[{handleValidityChange:0}],mgWidth:[{watchMgWidth:0}],type:[{validateType:0}],format:[{watchFormat:0}],integerLength:[{validateIntegerLength:0}],decimalLength:[{validateDecimalLength:0}]}}static get style(){return".mg-c-input__box{height:var(--mg-b-size-min-height);box-sizing:border-box;padding:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2) var(--mg-b-size-8);border-width:var(--mg-c-input-border-width);border-style:solid;border-color:var(--mg-c-input-color-border);border-radius:var(--mg-c-input-border-radius);background-color:var(--mg-b-color-light);color:var(--mg-b-color-dark);font-family:inherit;font-size:var(--mg-b-font-size);text-align:var(--mg-c-input-text-align, left)}.mg-c-input__box::placeholder{color:var(--mg-c-input-placeholder-color-text);font-style:italic}.mg-c-input__box:focus{box-shadow:0 0 var(--mg-b-size-4) var(--mg-c-input-color-box-shadow-focus)}.mg-c-input__box:disabled{opacity:var(--mg-b-opacity-element-disabled)}.mg-c-input.mg-c-input--has-error .mg-c-input__box{border-color:var(--mg-b-color-danger)}.mg-c-input.mg-c-input--is-input-group-append{--mg-c-button-border-radius-top-left:0;--mg-c-button-border-radius-bottom-left:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box{margin-right:calc(-1*var(--mg-b-size-border));border-bottom-right-radius:0;border-top-right-radius:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box:focus-visible{outline-offset:calc(-1*var(--mg-b-size-2));outline-style:solid;outline-width:var(--mg-b-size-2)}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]){--mg-c-button-border-radius-top-right:0;--mg-c-button-border-radius-bottom-right:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:not(:last-of-type)){--mg-c-button-border-right-width:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:last-of-type){--mg-c-button-border-radius-top-right:var(--mg-c-input-border-radius);--mg-c-button-border-radius-bottom-right:var(--mg-c-input-border-radius)}.mg-c-input.mg-c-input--is-append-input-slot-content:not(.mg-c-input--readonly) ::slotted([slot=append-input]){align-self:start;padding-top:calc((var(--mg-b-size-min-height) - var(--mg-b-size-16))/2)}.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container{position:relative}.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container>mg-icon:first-of-type{position:absolute;top:50%;left:var(--mg-b-size-8);color:var(--mg-c-input-color-icon);transform:translateY(-50%)}.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container .mg-c-input__box{padding-left:calc(var(--mg-b-size-16) + var(--mg-b-size-8)*2)}.mg-c-input__readonly-value{min-height:var(--mg-b-font-size);align-self:flex-start;margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2);overflow-wrap:anywhere}.mg-c-input__input-container{width:100%;flex:1 auto}.mg-c-input.mg-c-input--width-full .mg-c-input__box{width:100%}.mg-c-input.mg-c-input--width-full .mg-c-input__input-group-container{width:100%;flex-grow:1}.mg-c-input.mg-c-input--width-2.mg-c-input--display-character-left .mg-c-input__input-group-container,.mg-c-input.mg-c-input--width-4.mg-c-input--display-character-left .mg-c-input__input-group-container,.mg-c-input.mg-c-input--width-16.mg-c-input--display-character-left .mg-c-input__input-group-container{width:max-content}.mg-c-input.mg-c-input--width-2 .mg-c-input__box{width:var(--mg-b-size-48)}.mg-c-input.mg-c-input--width-2.mg-c-input--text.mg-c-input--display-character-left .mg-c-input__box{width:calc(var(--mg-b-size-48) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-4 .mg-c-input__box{width:var(--mg-b-size-72)}.mg-c-input.mg-c-input--width-4.mg-c-input--text.mg-c-input--display-character-left .mg-c-input__box{width:calc(var(--mg-b-size-72) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-16 .mg-c-input__box{width:calc(26*var(--mg-b-size-8))}.mg-c-input.mg-c-input--width-16.mg-c-input--text.mg-c-input--display-character-left .mg-c-input__box{width:calc(calc(26 * var(--mg-b-size-8)) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-full:not(.mg-c-input--label-on-top){justify-content:stretch}.mg-c-input.mg-c-input--is-input-group-append ::slotted([slot=append-input]),.mg-c-input.mg-c-input--is-append-input-slot-content ::slotted([slot=append-input]){width:auto}:host(.mg-c-input.mg-c-input--width-full) ::slotted(*:not(mg-input-title)){width:100%;max-width:100%}.mg-u-visually-hidden{position:absolute !important;overflow:hidden !important;width:.1rem !important;height:.1rem !important;padding:0 !important;border:0 !important;margin:-0.1rem !important;clip-path:inset(50%) !important;white-space:nowrap !important}.mg-u-visually-hidden *{overflow:hidden !important}*:focus:not(:focus-visible){outline:none}@media (prefers-reduced-motion){*{animation:none !important;transition:none !important}}a{color:inherit;text-decoration:underline}a:has(mg-icon){display:inline-flex;align-items:center;gap:var(--mg-b-size-4)}a:hover,a:focus,a:active{text-decoration:none}.mg-c-input .mg-c-input__box{width:auto;text-align:var(--mg-c-input-text-align, right)}"}},[257,"mg-input-numeric",{value:[1537],identifier:[1],name:[1],label:[1],labelOnTop:[4,"label-on-top"],labelHide:[4,"label-hide"],placeholder:[1],required:[4],readonly:[4],max:[2],min:[2],disabled:[4],mgWidth:[8,"mg-width"],tooltip:[1],tooltipPosition:[1,"tooltip-position"],helpText:[1,"help-text"],type:[1],format:[1],currency:[1],unit:[1],unitDisplay:[1,"unit-display"],integerLength:[2,"integer-length"],decimalLength:[2,"decimal-length"],valid:[1028],invalid:[1028],classCollection:[32],errorMessage:[32],hasFocus:[32],setFocus:[64],displayError:[64],setError:[64],reset:[64]},void 0,{value:[{validateValue:0}],readonly:[{watchReadonly:0},{handleValidityChange:0}],required:[{handleValidityChange:0}],disabled:[{handleValidityChange:0},{watchDisabled:0}],min:[{handleValidityChange:0}],max:[{handleValidityChange:0}],mgWidth:[{watchMgWidth:0}],type:[{validateType:0}],format:[{watchFormat:0}],integerLength:[{validateIntegerLength:0}],decimalLength:[{validateDecimalLength:0}]}]);function V(){"undefined"!=typeof customElements&&["mg-input-numeric","mg-icon","mg-input","mg-input-title","mg-tooltip","mg-tooltip-content"].forEach((i=>{switch(i){case"mg-input-numeric":customElements.get(t(i))||customElements.define(t(i),E);break;case"mg-icon":customElements.get(t(i))||v();break;case"mg-input":customElements.get(t(i))||f();break;case"mg-input-title":customElements.get(t(i))||w();break;case"mg-tooltip":customElements.get(t(i))||y();break;case"mg-tooltip-content":customElements.get(t(i))||_()}}))}V();const k=E,C=V;export{k as MgInputNumeric,C as defineCustomElement}
+import{transformTag as t,proxyCustomElement as i,HTMLElement as e,createEvent as s,h as n}from"@stencil/core/internal/client";import{C as a,i as o,t as r}from"./index2.js";import{n as h}from"./index3.js";import{c as l,d as c,e as m,f as p,i as u}from"./index4.js";import{c as d,b as g,w as b}from"./mg-input.conf.js";import{d as v}from"./mg-icon2.js";import{d as f}from"./mg-input2.js";import{d as w}from"./mg-input-title2.js";import{d as y}from"./mg-tooltip2.js";import{d as _}from"./mg-tooltip-content2.js";const x=["decimal","integer"],z=["none","number","currency","percent","unit"],E=i(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.valueChange=s(this,"value-change",7),this.inputValid=s(this,"input-valid",7),this.hasDisplayedError=!1,this.validityCheckPending=!1,this.customErrorMessage={lock:!1},this.name=this.identifier,this.labelOnTop=!1,this.labelHide=!1,this.required=!1,this.readonly=!1,this.disabled=!1,this.tooltipPosition="input",this.type="decimal",this.format="number",this.currency="EUR",this.unitDisplay="short",this.integerLength=13,this.decimalLength=2,this.classCollection=new a(["mg-c-input--numeric"]),this.handleInput=()=>{this.value=this.input.value},this.handleFocus=()=>{this.hasFocus=!0},this.handleBlur=()=>{"-"===this.value&&(this.value=""),this.handlerInProgress="blur",this.displayError().finally((()=>{this.handlerInProgress=void 0,this.hasFocus=!1}))},this.checkValidity=()=>{this.setValidity(this.readonly||this.disabled||null===this.getInputError())},this.formatErrorValue=t=>l(t,this.locale,Number.isInteger(t)||"decimal"!==this.type?0:this.decimalLength),this.setErrorMessage=(t=!1)=>{if(this.errorMessage=void 0,!this.valid){const i=this.getInputError();if(t||this.customErrorMessage.lock&&void 0!==this.customErrorMessage.message)this.errorMessage=this.customErrorMessage.message;else if("required"===i)this.errorMessage=this.messages.errors[i];else{const t=this.formatErrorValue(this.min),e=this.formatErrorValue(this.max);this.errorMessage=this.messages.input.numeric.error[i].replace("{min}",t).replace("{max}",e)}}},this.getInputError=()=>{const t=t=>!t.some((t=>[null,void 0].includes(t)));return!this.input.checkValidity()&&this.input.validity.valueMissing?"required":t([this.min,this.numericValue])&&this.numericValue<this.min&&void 0===this.max?"min":t([this.max,this.numericValue])&&this.numericValue>this.max&&void 0===this.min?"max":t([this.min,this.max,this.numericValue])&&(this.numericValue<this.min||this.numericValue>this.max)?"minMax":null},this.formatValue=t=>{switch(this.format){case"number":return l(t,this.locale,"decimal"===this.type?this.decimalLength:void 0);case"currency":return p(t,this.locale,this.currency);case"percent":return m(t/100,this.locale,"decimal"===this.type?this.decimalLength:void 0);case"unit":return c(t,this.locale,this.unit,this.unitDisplay,"decimal"===this.type?this.decimalLength:void 0);case"none":return""+t}},this.validateAppendSlot=()=>{const t=this.element.querySelector('[slot="append-input"]');null!==t&&("MG-BUTTON"===t.nodeName?this.classCollection.add("mg-c-input--is-input-group-append"):(this.classCollection.add("mg-c-input--is-append-input-slot-content"),this.slotContent=t.textContent))},this.formatHelpText=t=>{if(this.readonly)return;const i=o(t)?t:void 0;return void 0!==this.min||void 0!==this.max||void 0!==i?i:void 0},this.renderReadonly=()=>void 0!==this.slotContent?n("span",{class:"mg-c-input__readonly-value"},n("b",null,this.readonlyValue),this.slotContent):n("b",{class:"mg-c-input__readonly-value"},this.readonlyValue)}validateValue(t){var i;if(this.validityCheckPending=!0,"string"==typeof t){t.startsWith("0")&&parseInt(t,10)>0&&(t=t.substring(1));const[e,s=""]=t.replace("-","").split(/[.,]/);this.isValidValue(t,"integer"===this.type?/^(?!-?0\d)-?\d+$/:/^(?!-?0\d)-?\d+(?:[.,]\d*)?$/,e,s)?this.storedValue=t:t=null!==(i=this.storedValue)&&void 0!==i?i:null,this.updateValues(t)}}watchReadonly(t){t?this.classCollection.add(d):this.classCollection.delete(d)}handleValidityChange(t,i,e){void 0!==this.input&&(this.input[e]=t,this.checkValidity(),this.hasDisplayedError&&(this.setErrorMessage(),this.hasDisplayedError=!1))}watchDisabled(t){t?this.classCollection.add(g):this.classCollection.delete(g)}watchMgWidth(t){b.forEach((t=>{this.classCollection.delete("mg-c-input--width-"+t)})),void 0!==t&&this.classCollection.add("mg-c-input--width-"+this.mgWidth)}validateType(t){if(!x.includes(t))throw Error(`<mg-input-numeric> prop "type" must be one of: ${x.join(", ")}. Passed value: ${r(t)}.`)}watchFormat(t){if(!z.includes(t))throw Error(`<mg-input-numeric> prop "format" must be one of: ${z.join(", ")}. Passed value: ${r(t)}.`)}validateIntegerLength(t){if(t<1)throw Error(`<mg-input-numeric> prop "integer-length" must be a positive number. Passed value: ${r(t)}.`)}validateDecimalLength(t){if(t<1)throw Error(`<mg-input-numeric> prop "decimal-length" must be a positive number, consider using prop "type" to "integer" instead. Passed value: ${r(t)}.`)}async setFocus(){var t;null===(t=this.input)||void 0===t||t.focus()}displayError(){return new Promise((t=>{requestAnimationFrame((()=>{this.checkValidity(),this.setErrorMessage(),this.hasDisplayedError=this.invalid,t()}))}))}async setError(t,i,e=!1){if("boolean"!=typeof t)throw Error('<mg-input-numeric> method "setError()" param "valid" must be a boolean.');if(void 0!==i&&!o(i))throw Error('<mg-input-numeric> method "setError()" param "errorMessage" must be a string.');this.customErrorMessage={lock:!t&&e,message:t?void 0:i},this.validityCheckPending=!1,this.setValidity(t),this.setErrorMessage(!0),this.hasDisplayedError=this.invalid}async reset(){if(!this.readonly)return this.value="",new Promise((t=>{requestAnimationFrame((()=>{this.customErrorMessage={lock:!1},this.checkValidity(),this.errorMessage=void 0,this.hasDisplayedError=!1,t()}))}))}setValidity(t){const i=this.valid;this.customErrorMessage.lock&&(void 0===this.customErrorMessage.message||t)||(this.valid=t),this.invalid=!this.valid,(void 0===this.handlerInProgress||"blur"===this.handlerInProgress&&this.valid!==i)&&this.inputValid.emit(this.valid)}isValidValue(t,i,e,s){return["","-"].includes(t)||null!==i.exec(t)&&e.length<=this.integerLength&&s.length<=("integer"===this.type?0:this.decimalLength)}updateValues(t){this.value=t,void 0!==this.input&&(this.input.value=this.value),this.numericValue=["",null].includes(this.value)||isNaN(parseFloat(this.value))?null:parseFloat(this.value.replace(",",".")),(null===t||t===this.storedValue&&!Object.is(this.numericValue,-0))&&this.valueChange.emit(this.numericValue),this.readonlyValue=null!==this.numericValue?this.formatValue(this.numericValue):""}displayValue(){return this.hasFocus?this.value:this.readonlyValue}componentWillLoad(){const t=u(this.element);return this.locale=t.locale,this.messages=t.messages,h(this),this.watchFormat(this.format),this.validateType(this.type),this.validateIntegerLength(this.integerLength),this.validateDecimalLength(this.decimalLength),this.validateValue(this.value),this.validateAppendSlot(),this.watchReadonly(this.readonly),this.watchDisabled(this.disabled),this.watchMgWidth(this.mgWidth),setTimeout((()=>{this.checkValidity(),this.validityCheckPending=!1}),0)}componentDidUpdate(){this.validityCheckPending&&void 0!==this.input&&(this.validityCheckPending=!1,this.checkValidity(),this.hasDisplayedError&&this.setErrorMessage())}render(){return n("mg-input",{key:"8a9a2c269754aa1259e79dd5e68cc0ed6b578fd1",label:this.label,identifier:this.identifier,class:this.classCollection.join(),labelOnTop:this.labelOnTop,labelHide:this.labelHide,required:this.required,tooltip:this.tooltip,tooltipPosition:this.readonly&&void 0===this.value?"label":this.tooltipPosition,helpText:this.formatHelpText(this.helpText),errorMessage:this.errorMessage},this.readonly?this.readonlyValue&&this.renderReadonly():[n("input",{key:"input",type:"text",class:"mg-c-input__box mg-c-input__box--width",value:this.displayValue(),id:this.identifier,name:this.name,placeholder:this.placeholder,title:this.placeholder,disabled:this.disabled,required:this.required,autocomplete:"off","aria-invalid":""+(!0===this.invalid),onInput:this.handleInput,onFocus:this.handleFocus,onBlur:this.handleBlur,ref:t=>{null!==t&&(this.input=t)}}),n("slot",{key:"slot",name:"append-input"})])}get element(){return this}static get watchers(){return{value:[{validateValue:0}],readonly:[{watchReadonly:0},{handleValidityChange:0}],required:[{handleValidityChange:0}],disabled:[{handleValidityChange:0},{watchDisabled:0}],min:[{handleValidityChange:0}],max:[{handleValidityChange:0}],mgWidth:[{watchMgWidth:0}],type:[{validateType:0}],format:[{watchFormat:0}],integerLength:[{validateIntegerLength:0}],decimalLength:[{validateDecimalLength:0}]}}static get style(){return".mg-c-input__box{height:var(--mg-b-size-min-height);box-sizing:border-box;padding:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2) var(--mg-b-size-8);border-width:var(--mg-c-input-border-width);border-style:solid;border-color:var(--mg-c-input-color-border);border-radius:var(--mg-c-input-border-radius);background-color:var(--mg-b-color-light);color:var(--mg-b-color-dark);font-family:inherit;font-size:var(--mg-b-font-size);text-align:var(--mg-c-input-text-align, left)}.mg-c-input__box::placeholder{color:var(--mg-c-input-placeholder-color-text);font-style:italic}.mg-c-input__box:focus{box-shadow:0 0 var(--mg-b-size-4) var(--mg-c-input-color-box-shadow-focus)}.mg-c-input__box:disabled{opacity:var(--mg-b-opacity-element-disabled)}.mg-c-input.mg-c-input--has-error .mg-c-input__box{border-color:var(--mg-b-color-danger)}.mg-c-input.mg-c-input--is-input-group-append{--mg-c-button-border-radius-top-left:0;--mg-c-button-border-radius-bottom-left:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box{margin-right:calc(-1*var(--mg-b-size-border));border-bottom-right-radius:0;border-top-right-radius:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box:focus-visible{outline-offset:calc(-1*var(--mg-b-size-2));outline-style:solid;outline-width:var(--mg-b-size-2)}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]){--mg-c-button-border-radius-top-right:0;--mg-c-button-border-radius-bottom-right:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:not(:last-of-type)){--mg-c-button-border-right-width:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:last-of-type){--mg-c-button-border-radius-top-right:var(--mg-c-input-border-radius);--mg-c-button-border-radius-bottom-right:var(--mg-c-input-border-radius)}.mg-c-input.mg-c-input--is-append-input-slot-content:not(.mg-c-input--readonly) ::slotted([slot=append-input]){align-self:start;padding-top:calc((var(--mg-b-size-min-height) - var(--mg-b-size-16))/2)}.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container{position:relative}.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container>mg-icon:first-of-type{position:absolute;top:50%;left:var(--mg-b-size-8);color:var(--mg-c-input-color-icon);transform:translateY(-50%)}.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container .mg-c-input__box{padding-left:calc(var(--mg-b-size-16) + var(--mg-b-size-8)*2)}.mg-c-input__readonly-value{min-height:var(--mg-b-font-size);align-self:flex-start;margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2);overflow-wrap:anywhere}.mg-c-input--label-on-top .mg-c-input__readonly-value{margin-top:0}.mg-c-input__input-container{width:100%;flex:1 auto}.mg-c-input.mg-c-input--width-full .mg-c-input__box{width:100%}.mg-c-input.mg-c-input--width-full .mg-c-input__input-group-container{width:100%;flex-grow:1}.mg-c-input.mg-c-input--width-2.mg-c-input--display-character-left .mg-c-input__input-group-container,.mg-c-input.mg-c-input--width-4.mg-c-input--display-character-left .mg-c-input__input-group-container,.mg-c-input.mg-c-input--width-16.mg-c-input--display-character-left .mg-c-input__input-group-container{width:max-content}.mg-c-input.mg-c-input--width-2 .mg-c-input__box{width:var(--mg-b-size-48)}.mg-c-input.mg-c-input--width-2.mg-c-input--text.mg-c-input--display-character-left .mg-c-input__box{width:calc(var(--mg-b-size-48) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-4 .mg-c-input__box{width:var(--mg-b-size-72)}.mg-c-input.mg-c-input--width-4.mg-c-input--text.mg-c-input--display-character-left .mg-c-input__box{width:calc(var(--mg-b-size-72) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-16 .mg-c-input__box{width:calc(26*var(--mg-b-size-8))}.mg-c-input.mg-c-input--width-16.mg-c-input--text.mg-c-input--display-character-left .mg-c-input__box{width:calc(calc(26 * var(--mg-b-size-8)) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-full:not(.mg-c-input--label-on-top){justify-content:stretch}.mg-c-input.mg-c-input--is-input-group-append ::slotted([slot=append-input]),.mg-c-input.mg-c-input--is-append-input-slot-content ::slotted([slot=append-input]){width:auto}:host(.mg-c-input.mg-c-input--width-full) ::slotted(*:not(mg-input-title)){width:100%;max-width:100%}.mg-u-visually-hidden{position:absolute !important;overflow:hidden !important;width:.1rem !important;height:.1rem !important;padding:0 !important;border:0 !important;margin:-0.1rem !important;clip-path:inset(50%) !important;white-space:nowrap !important}.mg-u-visually-hidden *{overflow:hidden !important}*:focus:not(:focus-visible){outline:none}@media (prefers-reduced-motion){*{animation:none !important;transition:none !important}}a{color:inherit;text-decoration:underline}a:has(mg-icon){display:inline-flex;align-items:center;gap:var(--mg-b-size-4)}a:hover,a:focus,a:active{text-decoration:none}.mg-c-input .mg-c-input__box{width:auto;text-align:var(--mg-c-input-text-align, right)}"}},[257,"mg-input-numeric",{value:[1537],identifier:[1],name:[1],label:[1],labelOnTop:[4,"label-on-top"],labelHide:[4,"label-hide"],placeholder:[1],required:[4],readonly:[4],max:[2],min:[2],disabled:[4],mgWidth:[8,"mg-width"],tooltip:[1],tooltipPosition:[1,"tooltip-position"],helpText:[1,"help-text"],type:[1],format:[1],currency:[1],unit:[1],unitDisplay:[1,"unit-display"],integerLength:[2,"integer-length"],decimalLength:[2,"decimal-length"],valid:[1028],invalid:[1028],classCollection:[32],errorMessage:[32],hasFocus:[32],setFocus:[64],displayError:[64],setError:[64],reset:[64]},void 0,{value:[{validateValue:0}],readonly:[{watchReadonly:0},{handleValidityChange:0}],required:[{handleValidityChange:0}],disabled:[{handleValidityChange:0},{watchDisabled:0}],min:[{handleValidityChange:0}],max:[{handleValidityChange:0}],mgWidth:[{watchMgWidth:0}],type:[{validateType:0}],format:[{watchFormat:0}],integerLength:[{validateIntegerLength:0}],decimalLength:[{validateDecimalLength:0}]}]);function V(){"undefined"!=typeof customElements&&["mg-input-numeric","mg-icon","mg-input","mg-input-title","mg-tooltip","mg-tooltip-content"].forEach((i=>{switch(i){case"mg-input-numeric":customElements.get(t(i))||customElements.define(t(i),E);break;case"mg-icon":customElements.get(t(i))||v();break;case"mg-input":customElements.get(t(i))||f();break;case"mg-input-title":customElements.get(t(i))||w();break;case"mg-tooltip":customElements.get(t(i))||y();break;case"mg-tooltip-content":customElements.get(t(i))||_()}}))}V();const k=E,C=V;export{k as MgInputNumeric,C as defineCustomElement}

package/dist/components/mg-input-password.js

@@ -1 +1 @@
-import{transformTag as t,proxyCustomElement as i,HTMLElement as n,createEvent as e,h as s}from"@stencil/core/internal/client";import{C as o,i as a}from"./index2.js";import{n as r}from"./index3.js";import{c as p,b as c,w as m}from"./mg-input.conf.js";import{i as h}from"./index4.js";import{d as g}from"./mg-button2.js";import{d as u}from"./mg-icon2.js";import{d as l}from"./mg-input2.js";import{d}from"./mg-input-title2.js";import{d as b}from"./mg-tooltip2.js";import{d as v}from"./mg-tooltip-content2.js";const f=i(class extends n{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.valueChange=e(this,"value-change",7),this.inputValid=e(this,"input-valid",7),this.hasDisplayedError=!1,this.customErrorMessage={lock:!1},this.name=this.identifier,this.labelOnTop=!1,this.labelHide=!1,this.required=!1,this.readonly=!1,this.disabled=!1,this.mgWidth="full",this.tooltipPosition="input",this.classCollection=new o(["mg-c-input--password"]),this.displayPassword=!1,this.handleInput=()=>{this.checkValidity(),this.hasDisplayedError&&this.setErrorMessage(),this.value=this.input.value},this.handleBlur=()=>{this.handlerInProgress="blur",this.displayError().finally((()=>{this.handlerInProgress=void 0}))},this.toggleDisplayPassword=()=>{this.displayPassword=!this.displayPassword},this.checkValidity=()=>{this.setValidity(this.readonly||this.disabled||this.input.checkValidity())},this.setErrorMessage=(t=!1)=>{this.errorMessage=void 0,this.valid||(t||this.customErrorMessage.lock&&void 0!==this.customErrorMessage.message?this.errorMessage=this.customErrorMessage.message:this.input.validity.valueMissing&&(this.errorMessage=this.messages.errors.required))}}handleValue(t){this.valueChange.emit(t)}watchReadonly(t){t?this.classCollection.add(p):this.classCollection.delete(p)}handleValidityChange(t,i,n){void 0!==this.input&&(this.input[n]=t,this.checkValidity(),this.hasDisplayedError&&(this.setErrorMessage(),this.hasDisplayedError=!1))}watchDisabled(t){t?this.classCollection.add(c):this.classCollection.delete(c)}watchMgWidth(t){m.forEach((t=>{this.classCollection.delete("mg-c-input--width-"+t)})),void 0!==t&&this.classCollection.add("mg-c-input--width-"+this.mgWidth)}async setFocus(){var t;null===(t=this.input)||void 0===t||t.focus()}displayError(){return new Promise((t=>{requestAnimationFrame((()=>{this.checkValidity(),this.setErrorMessage(),this.hasDisplayedError=this.invalid,t()}))}))}async setError(t,i,n=!1){if("boolean"!=typeof t)throw Error('<mg-input-password> method "setError()" param "valid" must be a boolean.');if(void 0!==i&&!a(i))throw Error('<mg-input-password> method "setError()" param "errorMessage" must be a string.');this.customErrorMessage={lock:!t&&n,message:t?void 0:i},this.setValidity(t),this.setErrorMessage(!0),this.hasDisplayedError=this.invalid}async reset(){if(!this.readonly)return this.value="",new Promise((t=>{requestAnimationFrame((()=>{this.customErrorMessage={lock:!1},this.checkValidity(),this.errorMessage=void 0,this.hasDisplayedError=!1,t()}))}))}setValidity(t){const i=this.valid;this.customErrorMessage.lock&&(void 0===this.customErrorMessage.message||t)||(this.valid=t),this.invalid=!this.valid,(void 0===this.handlerInProgress||"blur"===this.handlerInProgress&&this.valid!==i)&&this.inputValid.emit(this.valid)}componentWillLoad(){return this.messages=h(this.element).messages,r(this),this.watchReadonly(this.readonly),this.watchDisabled(this.disabled),this.watchMgWidth(this.mgWidth),setTimeout((()=>{this.checkValidity()}),0)}render(){const t=this.displayPassword?"eye-slash":"eye";return s("mg-input",{key:"913d0653faad21f56cb930dfdc0947a0747f17ad",label:this.label,identifier:this.identifier,class:this.classCollection.join(),labelOnTop:this.labelOnTop,labelHide:this.labelHide,required:this.required,tooltip:this.tooltip,tooltipPosition:this.readonly&&void 0===this.value?"label":this.tooltipPosition,helpText:this.helpText,errorMessage:this.errorMessage},this.readonly?void 0!==this.value&&s("b",{class:"mg-c-input__readonly-value"},"•".repeat(this.value.length)):s("span",{class:"mg-c-input__input-group"},s("input",{type:this.displayPassword?"text":"password",class:"mg-c-input__box mg-c-input__box--width",value:this.value,id:this.identifier,name:this.name,placeholder:this.placeholder,title:this.placeholder,disabled:this.disabled,required:this.required,maxlength:this.maxlength,"aria-invalid":""+(!0===this.invalid),onInput:this.handleInput,onBlur:this.handleBlur,ref:t=>{null!==t&&(this.input=t)}}),s("mg-button",{label:this.messages.input.password[this.displayPassword?"hide":"display"],disabled:this.disabled,variant:"flat",class:"mg-c-input__append-button","is-icon":!0,onClick:this.toggleDisplayPassword,"aria-controls":this.identifier},s("mg-icon",{class:"mg-c-input__input-icon",icon:t}))))}get element(){return this}static get watchers(){return{value:[{handleValue:0}],readonly:[{watchReadonly:0},{handleValidityChange:0}],required:[{handleValidityChange:0}],disabled:[{handleValidityChange:0},{watchDisabled:0}],mgWidth:[{watchMgWidth:0}]}}static get style(){return".mg-c-input__box{height:var(--mg-b-size-min-height);box-sizing:border-box;padding:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2) var(--mg-b-size-8);border-width:var(--mg-c-input-border-width);border-style:solid;border-color:var(--mg-c-input-color-border);border-radius:var(--mg-c-input-border-radius);background-color:var(--mg-b-color-light);color:var(--mg-b-color-dark);font-family:inherit;font-size:var(--mg-b-font-size);text-align:var(--mg-c-input-text-align, left)}.mg-c-input__box::placeholder{color:var(--mg-c-input-placeholder-color-text);font-style:italic}.mg-c-input__box:focus{box-shadow:0 0 var(--mg-b-size-4) var(--mg-c-input-color-box-shadow-focus)}.mg-c-input__box:disabled{opacity:var(--mg-b-opacity-element-disabled)}.mg-c-input.mg-c-input--has-error .mg-c-input__box{border-color:var(--mg-b-color-danger)}.mg-c-input.mg-c-input--is-input-group-append{--mg-c-button-border-radius-top-left:0;--mg-c-button-border-radius-bottom-left:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box{margin-right:calc(-1*var(--mg-b-size-border));border-bottom-right-radius:0;border-top-right-radius:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box:focus-visible{outline-offset:calc(-1*var(--mg-b-size-2));outline-style:solid;outline-width:var(--mg-b-size-2)}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]){--mg-c-button-border-radius-top-right:0;--mg-c-button-border-radius-bottom-right:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:not(:last-of-type)){--mg-c-button-border-right-width:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:last-of-type){--mg-c-button-border-radius-top-right:var(--mg-c-input-border-radius);--mg-c-button-border-radius-bottom-right:var(--mg-c-input-border-radius)}.mg-c-input.mg-c-input--is-append-input-slot-content:not(.mg-c-input--readonly) ::slotted([slot=append-input]){align-self:start;padding-top:calc((var(--mg-b-size-min-height) - var(--mg-b-size-16))/2)}.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container{position:relative}.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container>mg-icon:first-of-type{position:absolute;top:50%;left:var(--mg-b-size-8);color:var(--mg-c-input-color-icon);transform:translateY(-50%)}.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container .mg-c-input__box{padding-left:calc(var(--mg-b-size-16) + var(--mg-b-size-8)*2)}.mg-c-input__readonly-value{min-height:var(--mg-b-font-size);align-self:flex-start;margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2);overflow-wrap:anywhere}.mg-c-input__input-container{width:100%;flex:1 auto}.mg-c-input.mg-c-input--width-full .mg-c-input__box{width:100%}.mg-c-input.mg-c-input--width-full .mg-c-input__input-group-container{width:100%;flex-grow:1}.mg-c-input.mg-c-input--width-2.mg-c-input--display-character-left .mg-c-input__input-group-container,.mg-c-input.mg-c-input--width-4.mg-c-input--display-character-left .mg-c-input__input-group-container,.mg-c-input.mg-c-input--width-16.mg-c-input--display-character-left .mg-c-input__input-group-container{width:max-content}.mg-c-input.mg-c-input--width-2 .mg-c-input__box{width:var(--mg-b-size-48)}.mg-c-input.mg-c-input--width-2.mg-c-input--text.mg-c-input--display-character-left .mg-c-input__box{width:calc(var(--mg-b-size-48) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-4 .mg-c-input__box{width:var(--mg-b-size-72)}.mg-c-input.mg-c-input--width-4.mg-c-input--text.mg-c-input--display-character-left .mg-c-input__box{width:calc(var(--mg-b-size-72) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-16 .mg-c-input__box{width:calc(26*var(--mg-b-size-8))}.mg-c-input.mg-c-input--width-16.mg-c-input--text.mg-c-input--display-character-left .mg-c-input__box{width:calc(calc(26 * var(--mg-b-size-8)) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-full:not(.mg-c-input--label-on-top){justify-content:stretch}.mg-c-input.mg-c-input--is-input-group-append ::slotted([slot=append-input]),.mg-c-input.mg-c-input--is-append-input-slot-content ::slotted([slot=append-input]){width:auto}:host(.mg-c-input.mg-c-input--width-full) ::slotted(*:not(mg-input-title)){width:100%;max-width:100%}.mg-u-visually-hidden{position:absolute !important;overflow:hidden !important;width:.1rem !important;height:.1rem !important;padding:0 !important;border:0 !important;margin:-0.1rem !important;clip-path:inset(50%) !important;white-space:nowrap !important}.mg-u-visually-hidden *{overflow:hidden !important}*:focus:not(:focus-visible){outline:none}@media (prefers-reduced-motion){*{animation:none !important;transition:none !important}}a{color:inherit;text-decoration:underline}a:has(mg-icon){display:inline-flex;align-items:center;gap:var(--mg-b-size-4)}a:hover,a:focus,a:active{text-decoration:none}.mg-c-input.mg-c-input--password .mg-c-input__input-icon{color:var(--mg-b-color-dark)}.mg-c-input.mg-c-input--password .mg-c-input__input-group{position:relative;flex-grow:1}.mg-c-input.mg-c-input--password .mg-c-input__append-button{position:absolute;right:0}.mg-c-input.mg-c-input--password .mg-c-input__box{padding-right:calc(var(--mg-b-size-min-height) + var(--mg-b-size-8))}.mg-c-input.mg-c-input--password .mg-c-input__box::-ms-reveal{display:none}"}},[1,"mg-input-password",{value:[1537],identifier:[1],name:[1],label:[1],labelOnTop:[4,"label-on-top"],labelHide:[4,"label-hide"],placeholder:[1],maxlength:[2],required:[4],readonly:[4],disabled:[4],mgWidth:[8,"mg-width"],tooltip:[1],tooltipPosition:[1,"tooltip-position"],helpText:[1,"help-text"],valid:[1028],invalid:[1028],classCollection:[32],errorMessage:[32],displayPassword:[32],setFocus:[64],displayError:[64],setError:[64],reset:[64]},void 0,{value:[{handleValue:0}],readonly:[{watchReadonly:0},{handleValidityChange:0}],required:[{handleValidityChange:0}],disabled:[{handleValidityChange:0},{watchDisabled:0}],mgWidth:[{watchMgWidth:0}]}]);function w(){"undefined"!=typeof customElements&&["mg-input-password","mg-button","mg-icon","mg-input","mg-input-title","mg-tooltip","mg-tooltip-content"].forEach((i=>{switch(i){case"mg-input-password":customElements.get(t(i))||customElements.define(t(i),f);break;case"mg-button":customElements.get(t(i))||g();break;case"mg-icon":customElements.get(t(i))||u();break;case"mg-input":customElements.get(t(i))||l();break;case"mg-input-title":customElements.get(t(i))||d();break;case"mg-tooltip":customElements.get(t(i))||b();break;case"mg-tooltip-content":customElements.get(t(i))||v()}}))}w();const _=f,y=w;export{_ as MgInputPassword,y as defineCustomElement}
+import{transformTag as t,proxyCustomElement as i,HTMLElement as n,createEvent as e,h as s}from"@stencil/core/internal/client";import{C as o,i as a}from"./index2.js";import{n as r}from"./index3.js";import{c as p,b as c,w as m}from"./mg-input.conf.js";import{i as h}from"./index4.js";import{d as g}from"./mg-button2.js";import{d as u}from"./mg-icon2.js";import{d as l}from"./mg-input2.js";import{d}from"./mg-input-title2.js";import{d as b}from"./mg-tooltip2.js";import{d as v}from"./mg-tooltip-content2.js";const w=i(class extends n{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.valueChange=e(this,"value-change",7),this.inputValid=e(this,"input-valid",7),this.hasDisplayedError=!1,this.customErrorMessage={lock:!1},this.validityCheckPending=!1,this.name=this.identifier,this.labelOnTop=!1,this.labelHide=!1,this.required=!1,this.readonly=!1,this.disabled=!1,this.mgWidth="full",this.tooltipPosition="input",this.classCollection=new o(["mg-c-input--password"]),this.displayPassword=!1,this.handleInput=()=>{this.value=this.input.value},this.handleBlur=()=>{this.handlerInProgress="blur",this.displayError().finally((()=>{this.handlerInProgress=void 0}))},this.toggleDisplayPassword=()=>{this.displayPassword=!this.displayPassword},this.checkValidity=()=>{this.setValidity(this.readonly||this.disabled||this.input.checkValidity())},this.setErrorMessage=(t=!1)=>{this.errorMessage=void 0,this.valid||(t||this.customErrorMessage.lock&&void 0!==this.customErrorMessage.message?this.errorMessage=this.customErrorMessage.message:this.input.validity.valueMissing&&(this.errorMessage=this.messages.errors.required))}}handleValue(t){this.validityCheckPending=!0,this.valueChange.emit(t)}watchReadonly(t){t?this.classCollection.add(p):this.classCollection.delete(p)}handleValidityChange(t,i,n){void 0!==this.input&&(this.input[n]=t,this.checkValidity(),this.hasDisplayedError&&(this.setErrorMessage(),this.hasDisplayedError=!1))}watchDisabled(t){t?this.classCollection.add(c):this.classCollection.delete(c)}watchMgWidth(t){m.forEach((t=>{this.classCollection.delete("mg-c-input--width-"+t)})),void 0!==t&&this.classCollection.add("mg-c-input--width-"+this.mgWidth)}async setFocus(){var t;null===(t=this.input)||void 0===t||t.focus()}displayError(){return new Promise((t=>{requestAnimationFrame((()=>{this.checkValidity(),this.setErrorMessage(),this.hasDisplayedError=this.invalid,t()}))}))}async setError(t,i,n=!1){if("boolean"!=typeof t)throw Error('<mg-input-password> method "setError()" param "valid" must be a boolean.');if(void 0!==i&&!a(i))throw Error('<mg-input-password> method "setError()" param "errorMessage" must be a string.');this.customErrorMessage={lock:!t&&n,message:t?void 0:i},this.validityCheckPending=!1,this.setValidity(t),this.setErrorMessage(!0),this.hasDisplayedError=this.invalid}async reset(){if(!this.readonly)return this.value="",new Promise((t=>{requestAnimationFrame((()=>{this.customErrorMessage={lock:!1},this.checkValidity(),this.errorMessage=void 0,this.hasDisplayedError=!1,t()}))}))}setValidity(t){const i=this.valid;this.customErrorMessage.lock&&(void 0===this.customErrorMessage.message||t)||(this.valid=t),this.invalid=!this.valid,(void 0===this.handlerInProgress||"blur"===this.handlerInProgress&&this.valid!==i)&&this.inputValid.emit(this.valid)}componentWillLoad(){return this.messages=h(this.element).messages,r(this),this.watchReadonly(this.readonly),this.watchDisabled(this.disabled),this.watchMgWidth(this.mgWidth),setTimeout((()=>{this.checkValidity(),this.validityCheckPending=!1}),0)}componentDidUpdate(){this.validityCheckPending&&void 0!==this.input&&(this.validityCheckPending=!1,this.checkValidity(),this.hasDisplayedError&&this.setErrorMessage())}render(){const t=this.displayPassword?"eye-slash":"eye";return s("mg-input",{key:"2d9498c380536dc32177d1ac16a513ee43944a72",label:this.label,identifier:this.identifier,class:this.classCollection.join(),labelOnTop:this.labelOnTop,labelHide:this.labelHide,required:this.required,tooltip:this.tooltip,tooltipPosition:this.readonly&&void 0===this.value?"label":this.tooltipPosition,helpText:this.helpText,errorMessage:this.errorMessage},this.readonly?void 0!==this.value&&s("b",{class:"mg-c-input__readonly-value"},"•".repeat(this.value.length)):s("span",{class:"mg-c-input__input-group"},s("input",{type:this.displayPassword?"text":"password",class:"mg-c-input__box mg-c-input__box--width",value:this.value,id:this.identifier,name:this.name,placeholder:this.placeholder,title:this.placeholder,disabled:this.disabled,required:this.required,maxlength:this.maxlength,"aria-invalid":""+(!0===this.invalid),onInput:this.handleInput,onBlur:this.handleBlur,ref:t=>{null!==t&&(this.input=t)}}),s("mg-button",{label:this.messages.input.password[this.displayPassword?"hide":"display"],disabled:this.disabled,variant:"flat",class:"mg-c-input__append-button","is-icon":!0,onClick:this.toggleDisplayPassword,"aria-controls":this.identifier},s("mg-icon",{class:"mg-c-input__input-icon",icon:t}))))}get element(){return this}static get watchers(){return{value:[{handleValue:0}],readonly:[{watchReadonly:0},{handleValidityChange:0}],required:[{handleValidityChange:0}],disabled:[{handleValidityChange:0},{watchDisabled:0}],mgWidth:[{watchMgWidth:0}]}}static get style(){return".mg-c-input__box{height:var(--mg-b-size-min-height);box-sizing:border-box;padding:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2) var(--mg-b-size-8);border-width:var(--mg-c-input-border-width);border-style:solid;border-color:var(--mg-c-input-color-border);border-radius:var(--mg-c-input-border-radius);background-color:var(--mg-b-color-light);color:var(--mg-b-color-dark);font-family:inherit;font-size:var(--mg-b-font-size);text-align:var(--mg-c-input-text-align, left)}.mg-c-input__box::placeholder{color:var(--mg-c-input-placeholder-color-text);font-style:italic}.mg-c-input__box:focus{box-shadow:0 0 var(--mg-b-size-4) var(--mg-c-input-color-box-shadow-focus)}.mg-c-input__box:disabled{opacity:var(--mg-b-opacity-element-disabled)}.mg-c-input.mg-c-input--has-error .mg-c-input__box{border-color:var(--mg-b-color-danger)}.mg-c-input.mg-c-input--is-input-group-append{--mg-c-button-border-radius-top-left:0;--mg-c-button-border-radius-bottom-left:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box{margin-right:calc(-1*var(--mg-b-size-border));border-bottom-right-radius:0;border-top-right-radius:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box:focus-visible{outline-offset:calc(-1*var(--mg-b-size-2));outline-style:solid;outline-width:var(--mg-b-size-2)}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]){--mg-c-button-border-radius-top-right:0;--mg-c-button-border-radius-bottom-right:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:not(:last-of-type)){--mg-c-button-border-right-width:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:last-of-type){--mg-c-button-border-radius-top-right:var(--mg-c-input-border-radius);--mg-c-button-border-radius-bottom-right:var(--mg-c-input-border-radius)}.mg-c-input.mg-c-input--is-append-input-slot-content:not(.mg-c-input--readonly) ::slotted([slot=append-input]){align-self:start;padding-top:calc((var(--mg-b-size-min-height) - var(--mg-b-size-16))/2)}.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container{position:relative}.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container>mg-icon:first-of-type{position:absolute;top:50%;left:var(--mg-b-size-8);color:var(--mg-c-input-color-icon);transform:translateY(-50%)}.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container .mg-c-input__box{padding-left:calc(var(--mg-b-size-16) + var(--mg-b-size-8)*2)}.mg-c-input__readonly-value{min-height:var(--mg-b-font-size);align-self:flex-start;margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2);overflow-wrap:anywhere}.mg-c-input--label-on-top .mg-c-input__readonly-value{margin-top:0}.mg-c-input__input-container{width:100%;flex:1 auto}.mg-c-input.mg-c-input--width-full .mg-c-input__box{width:100%}.mg-c-input.mg-c-input--width-full .mg-c-input__input-group-container{width:100%;flex-grow:1}.mg-c-input.mg-c-input--width-2.mg-c-input--display-character-left .mg-c-input__input-group-container,.mg-c-input.mg-c-input--width-4.mg-c-input--display-character-left .mg-c-input__input-group-container,.mg-c-input.mg-c-input--width-16.mg-c-input--display-character-left .mg-c-input__input-group-container{width:max-content}.mg-c-input.mg-c-input--width-2 .mg-c-input__box{width:var(--mg-b-size-48)}.mg-c-input.mg-c-input--width-2.mg-c-input--text.mg-c-input--display-character-left .mg-c-input__box{width:calc(var(--mg-b-size-48) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-4 .mg-c-input__box{width:var(--mg-b-size-72)}.mg-c-input.mg-c-input--width-4.mg-c-input--text.mg-c-input--display-character-left .mg-c-input__box{width:calc(var(--mg-b-size-72) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-16 .mg-c-input__box{width:calc(26*var(--mg-b-size-8))}.mg-c-input.mg-c-input--width-16.mg-c-input--text.mg-c-input--display-character-left .mg-c-input__box{width:calc(calc(26 * var(--mg-b-size-8)) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-full:not(.mg-c-input--label-on-top){justify-content:stretch}.mg-c-input.mg-c-input--is-input-group-append ::slotted([slot=append-input]),.mg-c-input.mg-c-input--is-append-input-slot-content ::slotted([slot=append-input]){width:auto}:host(.mg-c-input.mg-c-input--width-full) ::slotted(*:not(mg-input-title)){width:100%;max-width:100%}.mg-u-visually-hidden{position:absolute !important;overflow:hidden !important;width:.1rem !important;height:.1rem !important;padding:0 !important;border:0 !important;margin:-0.1rem !important;clip-path:inset(50%) !important;white-space:nowrap !important}.mg-u-visually-hidden *{overflow:hidden !important}*:focus:not(:focus-visible){outline:none}@media (prefers-reduced-motion){*{animation:none !important;transition:none !important}}a{color:inherit;text-decoration:underline}a:has(mg-icon){display:inline-flex;align-items:center;gap:var(--mg-b-size-4)}a:hover,a:focus,a:active{text-decoration:none}.mg-c-input.mg-c-input--password .mg-c-input__input-icon{color:var(--mg-b-color-dark)}.mg-c-input.mg-c-input--password .mg-c-input__input-group{position:relative;flex-grow:1}.mg-c-input.mg-c-input--password .mg-c-input__append-button{position:absolute;right:0}.mg-c-input.mg-c-input--password .mg-c-input__box{padding-right:calc(var(--mg-b-size-min-height) + var(--mg-b-size-8))}.mg-c-input.mg-c-input--password .mg-c-input__box::-ms-reveal{display:none}"}},[1,"mg-input-password",{value:[1537],identifier:[1],name:[1],label:[1],labelOnTop:[4,"label-on-top"],labelHide:[4,"label-hide"],placeholder:[1],maxlength:[2],required:[4],readonly:[4],disabled:[4],mgWidth:[8,"mg-width"],tooltip:[1],tooltipPosition:[1,"tooltip-position"],helpText:[1,"help-text"],valid:[1028],invalid:[1028],classCollection:[32],errorMessage:[32],displayPassword:[32],setFocus:[64],displayError:[64],setError:[64],reset:[64]},void 0,{value:[{handleValue:0}],readonly:[{watchReadonly:0},{handleValidityChange:0}],required:[{handleValidityChange:0}],disabled:[{handleValidityChange:0},{watchDisabled:0}],mgWidth:[{watchMgWidth:0}]}]);function f(){"undefined"!=typeof customElements&&["mg-input-password","mg-button","mg-icon","mg-input","mg-input-title","mg-tooltip","mg-tooltip-content"].forEach((i=>{switch(i){case"mg-input-password":customElements.get(t(i))||customElements.define(t(i),w);break;case"mg-button":customElements.get(t(i))||g();break;case"mg-icon":customElements.get(t(i))||u();break;case"mg-input":customElements.get(t(i))||l();break;case"mg-input-title":customElements.get(t(i))||d();break;case"mg-tooltip":customElements.get(t(i))||b();break;case"mg-tooltip-content":customElements.get(t(i))||v()}}))}f();const _=w,y=f;export{_ as MgInputPassword,y as defineCustomElement}

package/dist/components/mg-input-radio.js

@@ -1 +1 @@
-import{transformTag as t,proxyCustomElement as i,HTMLElement as e,createEvent as s,h as n}from"@stencil/core/internal/client";import{C as a,d as o,t as r,i as h}from"./index2.js";import{n as l}from"./index3.js";import{a as m,c as p,b as c}from"./mg-input.conf.js";import{i as d}from"./index4.js";import{d as u}from"./mg-icon2.js";import{d as g}from"./mg-input2.js";import{d as v}from"./mg-input-title2.js";import{d as b}from"./mg-tooltip2.js";import{d as f}from"./mg-tooltip-content2.js";const y=t=>"object"==typeof t&&"string"==typeof t.title&&void 0!==t.value,w=i(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.valueChange=s(this,"value-change",7),this.inputValid=s(this,"input-valid",7),this.inputs=[],this.classVerticalList="mg-c-input--vertical-list",this.hasDisplayedError=!1,this.customErrorMessage={lock:!1},this.name=this.identifier,this.labelOnTop=!1,this.labelHide=!1,this.inputVerticalList=!1,this.required=!1,this.readonly=!1,this.disabled=!1,this.tooltipPosition="input",this.classCollection=new a(["mg-c-input--radio",m]),this.handleInput=t=>{this.checkValidity(),this.value=this.options[t.target.value].value},this.handleBlur=()=>{this.handlerInProgress="blur",this.checkValidity(),this.setErrorMessage(),this.handlerInProgress=void 0},this.checkValidity=()=>{this.setValidity(this.readonly||this.disabled||void 0===this.getInvalidElement())},this.setErrorMessage=(t=!1)=>{const i=this.getInvalidElement();this.errorMessage=void 0,this.valid||(t||this.customErrorMessage.lock&&void 0!==this.customErrorMessage.message?this.errorMessage=this.customErrorMessage.message:i.validity.valueMissing&&(this.errorMessage=this.messages.errors.required))},this.getInvalidElement=()=>this.inputs.find((t=>!t.disabled&&!t.readOnly&&!t.checkValidity()))}watchValue(t){var i;this.readonlyValue=o(this.items)&&"string"==typeof t?t:Array.isArray(this.items)&&this.items.every(y)?null===(i=this.items.find((i=>i.value===t)))||void 0===i?void 0:i.title:null,this.valueChange.emit(t)}validateItems(t){if("object"==typeof t&&t.length<2)throw Error(`<mg-input-radio> prop "items" require at least 2 items. Passed value: ${r(t)}.`);if(o(t))this.options=t.map((t=>({title:t,value:t,disabled:this.disabled})));else{if(!t||!t.every((t=>y(t))))throw Error(`<mg-input-radio> prop "items" is required and all items must be the same type, string or RadioOption. Passed value: ${r(t)}.`);this.options=t}}watchInputVerticalList(t){t?this.classCollection.add(this.classVerticalList):this.classCollection.delete(this.classVerticalList)}watchReadonly(t){t?this.classCollection.add(p):this.classCollection.delete(p)}handleValidityChange(t,i,e){this.inputs.forEach((i=>{i[e]=t})),this.checkValidity(),this.hasDisplayedError&&(this.setErrorMessage(),this.hasDisplayedError=!1)}watchDisabled(t){t?this.classCollection.add(c):this.classCollection.delete(c)}async setFocus(){this.inputs.length>0&&this.inputs[0].focus()}displayError(){return new Promise((t=>{requestAnimationFrame((()=>{this.checkValidity(),this.setErrorMessage(),this.hasDisplayedError=this.invalid,t()}))}))}async setError(t,i,e=!1){if("boolean"!=typeof t)throw Error('<mg-input-radio> method "setError()" param "valid" must be a boolean.');if(void 0!==i&&!h(i))throw Error('<mg-input-radio> method "setError()" param "errorMessage" must be a string.');this.customErrorMessage={lock:!t&&e,message:t?void 0:i},this.setValidity(t),this.setErrorMessage(!0),this.hasDisplayedError=this.invalid}async reset(){if(!this.readonly)return this.value=void 0,new Promise((t=>{requestAnimationFrame((()=>{this.customErrorMessage={lock:!1},this.checkValidity(),this.errorMessage=void 0,this.hasDisplayedError=!1,t()}))}))}setValidity(t){const i=this.valid;this.customErrorMessage.lock&&(void 0===this.customErrorMessage.message||t)||(this.valid=t),this.invalid=!this.valid,(void 0===this.handlerInProgress||"blur"===this.handlerInProgress&&this.valid!==i)&&this.inputValid.emit(this.valid)}componentWillLoad(){return this.messages=d(this.element).messages,l(this),this.validateItems(this.items),this.watchInputVerticalList(this.inputVerticalList),this.watchReadonly(this.readonly),this.watchDisabled(this.disabled),this.watchValue(this.value),setTimeout((()=>{this.checkValidity()}),0)}render(){return n("mg-input",{key:"763e021cdda0735dcbd62700f09cbc32c0de7377",label:this.label,identifier:this.identifier,class:this.classCollection.join(),labelOnTop:this.labelOnTop,labelHide:this.labelHide,required:this.required,tooltip:this.tooltip,tooltipPosition:this.readonly&&!this.value?"label":this.tooltipPosition,helpText:this.helpText,errorMessage:this.errorMessage},this.readonly?this.readonlyValue&&n("b",{class:"mg-c-input__readonly-value"},this.readonlyValue):n("div",{class:"mg-c-input__input-group-container"},this.options.map(((t,i)=>n("div",{key:t.title,class:{"mg-c-input__input-group":!0,"mg-c-input__input-group--disabled":this.disabled||t.disabled}},n("input",{type:"radio",id:this.identifier+"_"+i,name:this.identifier,value:i,checked:JSON.stringify(this.value)===JSON.stringify(this.options[i].value),disabled:this.disabled||t.disabled,required:this.required,onBlur:this.handleBlur,onInput:this.handleInput,ref:t=>{null!==t&&(this.inputs[i]=t)}}),n("label",{htmlFor:this.identifier+"_"+i},t.title))))))}get element(){return this}static get watchers(){return{value:[{watchValue:0}],items:[{validateItems:0}],inputVerticalList:[{watchInputVerticalList:0}],readonly:[{watchReadonly:0},{handleValidityChange:0}],required:[{handleValidityChange:0}],disabled:[{handleValidityChange:0},{watchDisabled:0}]}}static get style(){return".mg-c-input__readonly-value{min-height:var(--mg-b-font-size);align-self:flex-start;margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2);overflow-wrap:anywhere}.mg-c-input.mg-c-input--fieldset{padding:0;border:0;margin-right:0;margin-left:0}.mg-c-input.mg-c-input--fieldset input[type=radio],.mg-c-input.mg-c-input--fieldset input[type=checkbox]{width:var(--mg-c-input-check-size);height:var(--mg-c-input-check-size);flex-shrink:0;margin:calc((var(--mg-b-font-size)*var(--mg-b-line-height) - var(--mg-c-input-check-size))/2) var(--mg-b-size-8) 0 0}.mg-c-input.mg-c-input--fieldset .mg-c-input__input-group{display:flex;align-items:start}.mg-c-input.mg-c-input--fieldset .mg-c-input__input-group-container{display:flex;flex-wrap:wrap;padding:0;margin:0;margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2);gap:var(--mg-b-size-12) var(--mg-b-size-24);list-style:none}.mg-c-input.mg-c-input--fieldset .mg-c-input__input-group.mg-c-input__input-group--disabled label{opacity:var(--mg-b-opacity-element-disabled)}.mg-c-input.mg-c-input--fieldset.mg-c-input--vertical-list .mg-c-input__input-group-container,.mg-c-input.mg-c-input--fieldset.mg-c-input--checkbox-multi .mg-c-input__input-group-container{flex-direction:column}.mg-c-input.mg-c-input--fieldset.mg-c-input--label-on-top .mg-c-input__input-group-container{margin-top:var(--mg-b-size-8)}.mg-u-visually-hidden{position:absolute !important;overflow:hidden !important;width:.1rem !important;height:.1rem !important;padding:0 !important;border:0 !important;margin:-0.1rem !important;clip-path:inset(50%) !important;white-space:nowrap !important}.mg-u-visually-hidden *{overflow:hidden !important}*:focus:not(:focus-visible){outline:none}@media (prefers-reduced-motion){*{animation:none !important;transition:none !important}}a{color:inherit;text-decoration:underline}a:has(mg-icon){display:inline-flex;align-items:center;gap:var(--mg-b-size-4)}a:hover,a:focus,a:active{text-decoration:none}"}},[1,"mg-input-radio",{value:[1032],items:[16],identifier:[1],name:[1],label:[1],labelOnTop:[4,"label-on-top"],labelHide:[4,"label-hide"],inputVerticalList:[4,"input-vertical-list"],required:[4],readonly:[4],disabled:[4],tooltip:[1],tooltipPosition:[1,"tooltip-position"],helpText:[1,"help-text"],valid:[1028],invalid:[1028],classCollection:[32],errorMessage:[32],options:[32],readonlyValue:[32],setFocus:[64],displayError:[64],setError:[64],reset:[64]},void 0,{value:[{watchValue:0}],items:[{validateItems:0}],inputVerticalList:[{watchInputVerticalList:0}],readonly:[{watchReadonly:0},{handleValidityChange:0}],required:[{handleValidityChange:0}],disabled:[{handleValidityChange:0},{watchDisabled:0}]}]);function _(){"undefined"!=typeof customElements&&["mg-input-radio","mg-icon","mg-input","mg-input-title","mg-tooltip","mg-tooltip-content"].forEach((i=>{switch(i){case"mg-input-radio":customElements.get(t(i))||customElements.define(t(i),w);break;case"mg-icon":customElements.get(t(i))||u();break;case"mg-input":customElements.get(t(i))||g();break;case"mg-input-title":customElements.get(t(i))||v();break;case"mg-tooltip":customElements.get(t(i))||b();break;case"mg-tooltip-content":customElements.get(t(i))||f()}}))}_();const x=w,E=_;export{x as MgInputRadio,E as defineCustomElement}
+import{transformTag as t,proxyCustomElement as i,HTMLElement as e,createEvent as s,h as n}from"@stencil/core/internal/client";import{C as a,d as o,t as r,i as h}from"./index2.js";import{n as l}from"./index3.js";import{a as m,c as p,b as c}from"./mg-input.conf.js";import{i as d}from"./index4.js";import{d as u}from"./mg-icon2.js";import{d as g}from"./mg-input2.js";import{d as v}from"./mg-input-title2.js";import{d as b}from"./mg-tooltip2.js";import{d as f}from"./mg-tooltip-content2.js";const y=t=>"object"==typeof t&&"string"==typeof t.title&&void 0!==t.value,w=i(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.valueChange=s(this,"value-change",7),this.inputValid=s(this,"input-valid",7),this.classVerticalList="mg-c-input--vertical-list",this.hasDisplayedError=!1,this.validityCheckPending=!1,this.customErrorMessage={lock:!1},this.name=this.identifier,this.labelOnTop=!1,this.labelHide=!1,this.inputVerticalList=!1,this.required=!1,this.readonly=!1,this.disabled=!1,this.tooltipPosition="input",this.classCollection=new a(["mg-c-input--radio",m]),this.handleInput=t=>{this.value=this.options[t.target.value].value},this.handleBlur=()=>{this.handlerInProgress="blur",this.checkValidity(),this.setErrorMessage(),this.handlerInProgress=void 0},this.validateRequired=()=>{const t=this.options.filter((t=>!t.disabled));return!this.required||t.length<1||t.some((t=>this.isSelectedValue(t.value)))},this.checkValidity=()=>{this.setValidity(this.readonly||this.disabled||void 0===this.getInvalidElement()&&this.validateRequired())},this.setErrorMessage=(t=!1)=>{const i=this.getInvalidElement();this.errorMessage=void 0,this.valid||(t||this.customErrorMessage.lock&&void 0!==this.customErrorMessage.message?this.errorMessage=this.customErrorMessage.message:(void 0===i||i.validity.valueMissing)&&(this.errorMessage=this.messages.errors.required))},this.getInvalidElement=()=>this.getInputs().find((t=>!t.disabled&&!t.readOnly&&!t.checkValidity())),this.getInputs=()=>Array.from(this.element.shadowRoot.querySelectorAll('input[type="radio"]')),this.isSelectedValue=t=>JSON.stringify(this.value)===JSON.stringify(t)}watchValue(t){var i;this.validityCheckPending=!0,this.readonlyValue=o(this.items)&&"string"==typeof t?t:Array.isArray(this.items)&&this.items.every(y)?null===(i=this.items.find((i=>i.value===t)))||void 0===i?void 0:i.title:null,this.valueChange.emit(t)}validateItems(t,i){if("object"==typeof t&&t.length<2)throw Error(`<mg-input-radio> prop "items" require at least 2 items. Passed value: ${r(t)}.`);if(o(t))this.options=t.map((t=>({title:t,value:t,disabled:this.disabled})));else{if(!t||!t.every((t=>y(t))))throw Error(`<mg-input-radio> prop "items" is required and all items must be the same type, string or RadioOption. Passed value: ${r(t)}.`);this.options=t}void 0!==i&&(void 0===this.value||this.options.some((t=>this.isSelectedValue(t.value)))||(this.value=void 0),this.validityCheckPending=!0)}watchInputVerticalList(t){t?this.classCollection.add(this.classVerticalList):this.classCollection.delete(this.classVerticalList)}watchReadonly(t){t?this.classCollection.add(p):this.classCollection.delete(p)}handleValidityChange(t,i,e){this.getInputs().forEach((i=>{i[e]=t})),this.checkValidity(),this.hasDisplayedError&&(this.setErrorMessage(),this.hasDisplayedError=!1)}watchDisabled(t){t?this.classCollection.add(c):this.classCollection.delete(c)}async setFocus(){var t;null===(t=this.element.shadowRoot.querySelector("input"))||void 0===t||t.focus()}displayError(){return new Promise((t=>{requestAnimationFrame((()=>{this.checkValidity(),this.setErrorMessage(),this.hasDisplayedError=this.invalid,t()}))}))}async setError(t,i,e=!1){if("boolean"!=typeof t)throw Error('<mg-input-radio> method "setError()" param "valid" must be a boolean.');if(void 0!==i&&!h(i))throw Error('<mg-input-radio> method "setError()" param "errorMessage" must be a string.');this.customErrorMessage={lock:!t&&e,message:t?void 0:i},this.validityCheckPending=!1,this.setValidity(t),this.setErrorMessage(!0),this.hasDisplayedError=this.invalid}async reset(){if(!this.readonly)return this.value=void 0,new Promise((t=>{requestAnimationFrame((()=>{this.customErrorMessage={lock:!1},this.checkValidity(),this.errorMessage=void 0,this.hasDisplayedError=!1,t()}))}))}setValidity(t){const i=this.valid;this.customErrorMessage.lock&&(void 0===this.customErrorMessage.message||t)||(this.valid=t),this.invalid=!this.valid,(void 0===this.handlerInProgress||"blur"===this.handlerInProgress&&this.valid!==i)&&this.inputValid.emit(this.valid)}componentWillLoad(){return this.messages=d(this.element).messages,l(this),this.validateItems(this.items),this.watchInputVerticalList(this.inputVerticalList),this.watchReadonly(this.readonly),this.watchDisabled(this.disabled),this.watchValue(this.value),setTimeout((()=>{this.checkValidity(),this.validityCheckPending=!1}),0)}componentDidUpdate(){this.validityCheckPending&&this.getInputs().length>0&&(this.validityCheckPending=!1,this.checkValidity(),this.hasDisplayedError&&this.setErrorMessage())}render(){return n("mg-input",{key:"1fd4b600eb95f2ff5c753884c40b982e0552d576",label:this.label,identifier:this.identifier,class:this.classCollection.join(),labelOnTop:this.labelOnTop,labelHide:this.labelHide,required:this.required,tooltip:this.tooltip,tooltipPosition:this.readonly&&!this.value?"label":this.tooltipPosition,helpText:this.helpText,errorMessage:this.errorMessage},this.readonly?this.readonlyValue&&n("b",{class:"mg-c-input__readonly-value"},this.readonlyValue):n("div",{class:"mg-c-input__input-group-container"},this.options.map(((t,i)=>n("div",{key:t.title,class:{"mg-c-input__input-group":!0,"mg-c-input__input-group--disabled":this.disabled||t.disabled}},n("input",{type:"radio",id:this.identifier+"_"+i,name:this.identifier,value:i,checked:this.isSelectedValue(this.options[i].value),disabled:this.disabled||t.disabled,required:this.required,onBlur:this.handleBlur,onInput:this.handleInput}),n("label",{htmlFor:this.identifier+"_"+i},t.title))))))}get element(){return this}static get watchers(){return{value:[{watchValue:0}],items:[{validateItems:0}],inputVerticalList:[{watchInputVerticalList:0}],readonly:[{watchReadonly:0},{handleValidityChange:0}],required:[{handleValidityChange:0}],disabled:[{handleValidityChange:0},{watchDisabled:0}]}}static get style(){return".mg-c-input__readonly-value{min-height:var(--mg-b-font-size);align-self:flex-start;margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2);overflow-wrap:anywhere}.mg-c-input--label-on-top .mg-c-input__readonly-value{margin-top:0}.mg-c-input.mg-c-input--fieldset{padding:0;border:0;margin-right:0;margin-left:0}.mg-c-input.mg-c-input--fieldset input[type=radio],.mg-c-input.mg-c-input--fieldset input[type=checkbox]{width:var(--mg-c-input-check-size);height:var(--mg-c-input-check-size);flex-shrink:0;margin:calc((var(--mg-b-font-size)*var(--mg-b-line-height) - var(--mg-c-input-check-size))/2) var(--mg-b-size-8) 0 0}.mg-c-input.mg-c-input--fieldset .mg-c-input__input-group{display:flex;align-items:start}.mg-c-input.mg-c-input--fieldset .mg-c-input__input-group-container{display:flex;flex-wrap:wrap;padding:0;margin:0;margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2);gap:var(--mg-b-size-12) var(--mg-b-size-24);list-style:none}.mg-c-input.mg-c-input--fieldset .mg-c-input__input-group.mg-c-input__input-group--disabled label{opacity:var(--mg-b-opacity-element-disabled)}.mg-c-input.mg-c-input--fieldset.mg-c-input--vertical-list .mg-c-input__input-group-container,.mg-c-input.mg-c-input--fieldset.mg-c-input--checkbox-multi .mg-c-input__input-group-container{flex-direction:column}.mg-c-input.mg-c-input--fieldset.mg-c-input--label-on-top .mg-c-input__input-group-container{margin-top:var(--mg-b-size-8)}.mg-u-visually-hidden{position:absolute !important;overflow:hidden !important;width:.1rem !important;height:.1rem !important;padding:0 !important;border:0 !important;margin:-0.1rem !important;clip-path:inset(50%) !important;white-space:nowrap !important}.mg-u-visually-hidden *{overflow:hidden !important}*:focus:not(:focus-visible){outline:none}@media (prefers-reduced-motion){*{animation:none !important;transition:none !important}}a{color:inherit;text-decoration:underline}a:has(mg-icon){display:inline-flex;align-items:center;gap:var(--mg-b-size-4)}a:hover,a:focus,a:active{text-decoration:none}"}},[1,"mg-input-radio",{value:[1032],items:[16],identifier:[1],name:[1],label:[1],labelOnTop:[4,"label-on-top"],labelHide:[4,"label-hide"],inputVerticalList:[4,"input-vertical-list"],required:[4],readonly:[4],disabled:[4],tooltip:[1],tooltipPosition:[1,"tooltip-position"],helpText:[1,"help-text"],valid:[1028],invalid:[1028],classCollection:[32],errorMessage:[32],options:[32],readonlyValue:[32],setFocus:[64],displayError:[64],setError:[64],reset:[64]},void 0,{value:[{watchValue:0}],items:[{validateItems:0}],inputVerticalList:[{watchInputVerticalList:0}],readonly:[{watchReadonly:0},{handleValidityChange:0}],required:[{handleValidityChange:0}],disabled:[{handleValidityChange:0},{watchDisabled:0}]}]);function _(){"undefined"!=typeof customElements&&["mg-input-radio","mg-icon","mg-input","mg-input-title","mg-tooltip","mg-tooltip-content"].forEach((i=>{switch(i){case"mg-input-radio":customElements.get(t(i))||customElements.define(t(i),w);break;case"mg-icon":customElements.get(t(i))||u();break;case"mg-input":customElements.get(t(i))||g();break;case"mg-input-title":customElements.get(t(i))||v();break;case"mg-tooltip":customElements.get(t(i))||b();break;case"mg-tooltip-content":customElements.get(t(i))||f()}}))}_();const x=w,E=_;export{x as MgInputRadio,E as defineCustomElement}