@maggioli-design-system/magma 1.10.8 → 1.10.9

package/dist/magma-components/p-75487b6d.entry.js

@@ -1 +0,0 @@
-import{r as t,c as n,h as e,H as i,g as o}from"./p-3a6b32e7.js";import{c as r}from"./p-8a1a6e56.js";import{m as s}from"./p-581a0bb5.js";import{m as a}from"./p-a8265c47.js";import{m as d}from"./p-af30edf5.js";import{m as h}from"./p-b69d8626.js";import{L as l}from"./p-2d77deaf.js";import{h as c}from"./p-f00c93f4.js";import"./p-85aa8e05.js";const p='<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z"/></svg>',u='<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M12 14c1.66 0 3-1.34 3-3V5c0-1.66-1.34-3-3-3S9 3.34 9 5v6c0 1.66 1.34 3 3 3z"/><path d="M17 11c0 2.76-2.24 5-5 5s-5-2.24-5-5H5c0 3.53 2.61 6.43 6 6.92V21h2v-3.08c3.39-.49 6-3.39 6-6.92h-2z"/></svg>',m={decrease:"Μείωση",hidePassword:"Απόκρυψη κωδικού",increase:"Αύξηση",showPassword:"Εμφάνιση κωδικού",speechToTextError:"Η φωνητική υπαγόρευση δεν υποστηρίζεται από αυτό το πρόγραμμα περιήγησης",speechToTextOff:"Διακοπή φωνητικής υπαγόρευσης",speechToTextOn:"Έναρξη φωνητικής υπαγόρευσης"},b={decrease:"Decrease",hidePassword:"Hide password",increase:"Increase",showPassword:"Show password",speechToTextError:"Voice dictation is not supported by this browser",speechToTextOff:"Stop voice dictation",speechToTextOn:"Start voice dictation"},y={decrease:"Disminuir",hidePassword:"Ocultar contraseña",increase:"Aumentar",showPassword:"Mostrar contraseña",speechToTextError:"El dictado por voz no es compatible con este navegador",speechToTextOff:"Detener dictado por voz",speechToTextOn:"Iniciar dictado por voz"},g={decrease:"Diminuisci",hidePassword:"Nascondi password",increase:"Aumenta",showPassword:"Visualizza password",speechToTextError:"Dettatura vocale non supportata da questo browser",speechToTextOff:"Ferma dettatura vocale",speechToTextOn:"Inizia dettatura vocale"},f=()=>null,v=t=>t.length>0?null:{required:""},w=t=>{if(""===t)return null;if(Number.isNaN(t.slice(0,-1))||10!==t.length&&13!==t.length)return{"isbn-error":"formato isbn non correto"};const n=t.split("").map((t=>"X"===t?10:Number(t)));let e=0;return e=10===t.length?n.reduce(((t,n,e)=>t+(10-e)*n),0)%11:n.reduce(((t,n,e)=>t+n*(e%2==0?1:3)),0)%10,0===e?null:{"isbn-error":"codice isbn non valido"}};class x{constructor(){this._validators=[],this._errors=null,this.isValid=!0}addValidator(t){Array.isArray(t)?this._validators.push(...t):this._validators.push(t)}_hasValidator(t,n){return Array.isArray(t)?t.includes(n):t===n}hasValidator(t){return t?this._hasValidator(this._validators,t):this._validators.length>0}removeValidator(t){this._validators=this._validators.filter((n=>!this._hasValidator(t,n)))}validate(t){const n=this._validators.map((n=>n(t))).reduce(((t,n)=>Object.assign(Object.assign({},t),n)),f);this._errors=0===Object.keys(n).length?null:n,this.isValid=!this._errors}get errors(){return this._errors}}class k{}k.CF_Regex=/^(?:[A-Z][AEIOU][AEIOUX]|[AEIOU]X{2}|[B-DF-HJ-NP-TV-Z]{2}[A-Z]){2}(?:[\dLMNP-V]{2}(?:[A-EHLMPR-T](?:[04LQ][1-9MNP-V]|[15MR][\dLMNP-V]|[26NS][0-8LMNP-U])|[DHPS][37PT][0L]|[ACELMRT][37PT][01LM]|[AC-EHLMPR-T][26NS][9V])|(?:[02468LNQSU][048LQU]|[13579MPRTV][26NS])B[26NS][9V])(?:[A-MZ][1-9MNP-V][\dLMNP-V]{2}|[A-M][0L](?:[1-9MNP-V][\dLMNP-V]|[0L][1-9MNP-V]))[A-Z]$/i,k.CF_MASK="A{6}(99|AA)A(99|AA)A(999|AAA)A",k.CC_MASK="9999-9999-9999-9999";class z{constructor(t){this.validator=new x,this.pattern=t}mask(t){if(!this.pattern)throw new Error("no pattern found, set pattern before mask")}isValid(t){return this.validator.validate(t),this.validator.isValid}}const M=class{constructor(e){t(this,e),this.changeEvent=n(this,"mdsInputChange",7),this.keyDownEvent=n(this,"mdsInputKeydown",7),this.blurEvent=n(this,"mdsInputBlur",7),this.focusEvent=n(this,"mdsInputFocus",7),this.speechEvent=n(this,"mdsInputSpeechEnd",7),this.validationEvent=n(this,"mdsInputValidation",7),e.$hostElement$["s-ei"]?this.internals=e.$hostElement$["s-ei"]:(this.internals=e.$hostElement$.attachInternals(),e.$hostElement$["s-ei"]=this.internals),this.speechToTextIcon=u,this.hasFocus=!1,this.isRecording=!1,this.countVariant="count-empty",this.isPasswordVisible=!1,this.t=new l({el:m,en:b,es:y,it:g}),this.autocomplete="off",this.autofocus=!1,this.await=!1,this.controlsLayout="vertical",this.controlsIcon="arrow",this.controlIncreaseLabel="Aumenta",this.controlDecreaseLabel="Riduci",this.disabled=!1,this.readonly=!1,this.required=!1,this.variant="primary",this.type="text",this.typography="detail",this.value="",this.countMaxLength=()=>{var t,n,e;if(!this.maxlength)return;if(void 0===this.value)return;this.currentLengthLabel=`${null!==(n=null===(t=this.value)||void 0===t?void 0:t.length)&&void 0!==n?n:0} / ${this.maxlength}`;const i=Math.round(100*this.value.length/this.maxlength);this.countVariant=(null===(e=this.value)||void 0===e?void 0:e.length)!==this.maxlength?i>=100?"count-full":i>=75?"count-almost-full":i>=50?"count-almost":i>=25?"count-incomplete":"count-empty":"count-full"},this.onInput=t=>{const n=t.target;n&&(this.value=n.value,this.internals.setFormValue(this.value)),this.keyDownEvent.emit(t)},this.onBlur=()=>{this.hasFocus=!1,this.validateInput(),this.blurEvent.emit()},this.onFocus=t=>{const n=t.target;this.hasFocus=!0,this.focusEvent.emit(),this.readonly&&setTimeout((()=>{n.select()}),10)},this.stepUp=()=>{!this.nativeInput||this.readonly||this.disabled||(this.nativeInput.stepUp(),this.value=this.nativeInput.value)},this.stepDown=()=>{!this.nativeInput||this.readonly||this.disabled||(this.nativeInput.stepDown(),this.value=this.nativeInput.value)},this.toggleTextRecognition=()=>{if(this.isRecording=!this.isRecording,!this.isRecording)return this.speechToTextLabel=this.t.get("speechToTextOn"),this.speechToTextIcon=u,void this.stopRecognition();this.speechToTextLabel=this.t.get("speechToTextOff"),this.speechToTextIcon=h,this.startRecognition()},this.onSpeechRecognitionError=()=>{console.error("SpeechRecognition API may not work properly on Chrome based browsers."),this.speechButton.classList.remove("mic-toggle-button--recording"),this.speechButton.classList.add("toggle-button--error"),this.isRecording=!1,this.speechToTextLabel=this.t.get("speechToTextError"),this.speechToTextIcon='<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M10.8 4.9c0-.66.54-1.2 1.2-1.2s1.2.54 1.2 1.2l-.01 3.91L15 10.6V5c0-1.66-1.34-3-3-3c-1.54 0-2.79 1.16-2.96 2.65l1.76 1.76V4.9zM19 11h-1.7c0 .58-.1 1.13-.27 1.64l1.27 1.27c.44-.88.7-1.87.7-2.91zM4.41 2.86L3 4.27l6 6V11c0 1.66 1.34 3 3 3c.23 0 .44-.03.65-.08l1.66 1.66c-.71.33-1.5.52-2.31.52c-2.76 0-5.3-2.1-5.3-5.1H5c0 3.41 2.72 6.23 6 6.72V21h2v-3.28a7.13 7.13 0 0 0 2.55-.9l4.2 4.2l1.41-1.41L4.41 2.86z"/></svg>'},this.startRecognition=()=>{var t,n,e;this.speechButton||(this.speechButton=null===(n=null===(t=this.el)||void 0===t?void 0:t.shadowRoot)||void 0===n?void 0:n.querySelector(".mic-toggle-button"));const i=null!==(e=window.SpeechRecognition)&&void 0!==e?e:window.webkitSpeechRecognition;if(this.value="",!i)return void this.onSpeechRecognitionError();this.recognition=new i,this.recognition.continuous=!0,this.recognition.lang=navigator.language||"it-IT",this.recognition.interimResults=!0,this.recognition.maxAlternatives=1;let o="",r=0;this.recognition.onresult=t=>{const n=t.results[r];if(n.isFinal)return o+=n[0].transcript,this.value=o,void(r+=1);this.value=o+n[0].transcript},this.recognition.onerror=t=>{console.error("SpeechRecognition API error:",t.error),this.onSpeechRecognitionError()},this.recognition.start()},this.stopRecognition=()=>{this.recognition&&(this.recognition.stop(),this.speechEvent.emit())}}async updateLang(){this.language=this.t.lang(this.el),this.t.update()}formResetCallback(){this.internals.setFormValue("")}connectedCallback(){this.datalistId=`datalist-${c()}`}componentWillLoad(){var t;if(this.language=this.t.lang(this.el),this.speechToTextLabel=this.t.get("speechToTextOn"),this.el.hasAttribute("tabindex")){const t=this.el.getAttribute("tabindex");this.tabindex=null!==t?parseInt(t):void 0,this.el.removeAttribute("tabindex")}this.internals.setFormValue(null!==(t=this.value)&&void 0!==t?t:null),this.maxLengthChanged(this.maxlength),this.isValid=!(this.required&&""===this.value),this.el.focus=()=>{var t;null===(t=this.nativeInput)||void 0===t||t.focus()}}componentDidLoad(){var t,n,e;this.inputValidation=function(t){let n;switch(t){case"tel":case"url":case"piva":default:n=new z("");break;case"cc":n=new z(k.CC_MASK);break;case"cf":n=new z(k.CF_MASK),n.validator.addValidator((t=>""===t||k.CF_Regex.test(t)?null:{"cf-regex":"Codice fiscale inserito non corretto"})),n.validator.addValidator((t=>""===t||16===t.length?null:{"cf-length":"Codice fiscale deve essere lungo 16 caratteri"}));break;case"isbn":n=new z,n.validator.addValidator(w)}return n}(this.type),this.setValidators(),null===(t=this.nativeInput)||void 0===t||t.setAttribute("pattern",String(this.inputValidation.pattern)),this.autofocus&&(null===(n=this.nativeInput)||void 0===n||n.focus()),this.variantChanged(null!==(e=this.variant)&&void 0!==e?e:"primary")}setValidators(){var t,n,e;this.required&&this.inputValidation.validator.addValidator(v),""!==this.max&&Number(this.max)&&this.inputValidation.validator.addValidator((t=Number(this.max),n=>{if(""===n||null===t)return null;const e=parseFloat(n);return!isNaN(e)&&e>t?{max:`valore massimo ${t}`}:null})),""!==this.min&&Number(this.min)&&this.inputValidation.validator.addValidator((n=Number(this.max),t=>{if(""===t||null===n)return null;const e=parseFloat(t);return!isNaN(e)&&e<n?{min:`valore minimo ${n}`}:null})),this.maxlength&&this.inputValidation.validator.addValidator((e=this.maxlength,t=>""===t||null===e?null:t.length>e?{minLenght:`La lunghezza massima accettata è ${e}`}:null)),this.minlength&&this.inputValidation.validator.addValidator((t=>n=>""===n||null===t?null:n.length<t?{minLenght:`La lunghezza minima accettata è ${t}`}:null)(this.minlength))}valueChanged(){var t;this.changeEvent.emit({value:this.value}),this.internals.setFormValue(null!==(t=this.value)&&void 0!==t?t:null),void 0!==this.maxlength&&this.countMaxLength(),""!==this.value&&(this.isValid||this.validateInput())}variantChanged(t){"ai"===t&&void 0===this.icon&&(this.icon='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">\n  <path d="M10 11H8V8h2zM16 11h-2V8h2z"/>\n  <path fill-rule="evenodd" d="M21.544 10.436a3 3 0 0 1 0 3.128l-3.667 6A3 3 0 0 1 15.317 21H8.683a3 3 0 0 1-2.56-1.436l-3.666-6a3 3 0 0 1 0-3.128l3.667-6A3 3 0 0 1 8.683 3h6.635a3 3 0 0 1 2.56 1.436zM4.162 11.479a1 1 0 0 0 0 1.043l3.668 6a1 1 0 0 0 .853.478h6.634a1 1 0 0 0 .853-.479l3.667-6a1 1 0 0 0 0-1.042l-3.667-6A1 1 0 0 0 15.317 5H8.683a1 1 0 0 0-.853.479z" clip-rule="evenodd"/>\n  <path d="M16.707 14.707C15.477 15.937 13.698 16.5 12 16.5s-3.477-.563-4.707-1.793l1.414-1.414c.77.77 1.991 1.207 3.293 1.207s2.523-.437 3.293-1.207z"/>\n</svg>\n')}maxLengthChanged(t){void 0!==t&&(t<=0?this.maxlength=void 0:this.countMaxLength())}async addValidator(t){return this.inputValidation.validator.addValidator(t),Promise.resolve()}async removeValidator(t){this.inputValidation.validator.removeValidator(t)}async hasValidator(t){return this.inputValidation.validator.hasValidator(t)}async getErrors(){return Promise.resolve(this.inputValidation.validator.errors)}validateInput(){return this.inputValidation.validator.hasValidator()&&(this.isValid=this.inputValidation.isValid(this.value),this.variant=""!==this.value||this.required?this.isValid?"success":"error":"primary",this.validationEvent.emit(this.isValid)),this.isValid}disabledChanged(t){t&&this.internals.setFormValue(null)}async setFocus(){this.nativeInput&&this.nativeInput.focus()}getInputElement(){return Promise.resolve(this.nativeInput)}componentWillRender(){this.t.lang(this.el)}render(){var t,n;return e(i,{key:"6904606bb94fbe4039190d44dc6b146561cb1c9d"},"number"===this.type&&"horizontal"===this.controlsLayout&&e("mds-button",{key:"e529d4c484cd78950a425b884fe927199acc0b05",class:"counter-button counter-button--horizontal counter-button--decrease",icon:"arrow"===this.controlsIcon?s:d,onClick:this.stepDown,tabindex:"0",title:this.t.get("decrease"),part:"counter-button-decrease"}),"textarea"===this.type?e("textarea",{class:r("input",(null!==(t=this.icon)&&void 0!==t?t:this.await)&&"has-icon",this.mic&&"has-right-icon"),autoFocus:this.autofocus,disabled:this.disabled,maxLength:this.maxlength,minLength:this.minlength,name:this.name,onBlur:this.onBlur,onFocus:this.onFocus,onInput:this.onInput,part:"field",placeholder:this.placeholder,readOnly:this.readonly,ref:t=>this.nativeInput=t,required:this.required,tabIndex:this.tabindex,value:this.value}):e("input",{class:r("input",(null!==(n=this.icon)&&void 0!==n?n:this.await)&&"has-icon",this.mic&&"has-right-icon"),autoComplete:this.autocomplete,autoFocus:this.autofocus,disabled:this.disabled,max:this.max,maxLength:this.maxlength,min:this.min,minLength:this.minlength,name:this.name,onBlur:this.onBlur,onFocus:this.onFocus,onInput:this.onInput,pattern:this.pattern,list:this.datalistId,part:"field",placeholder:this.placeholder,readOnly:this.readonly,ref:t=>this.nativeInput=t,required:this.required,step:this.step,tabIndex:this.tabindex,type:"password"===this.type&&this.isPasswordVisible?"text":this.type,value:this.value}),"number"===this.type&&"vertical"===this.controlsLayout&&e("div",{key:"d000022047e1333c236edce58b177c5f619f4385",class:"counter counter--vertical"},e("mds-button",{key:"c96ebc62547c9feec928ffe5ff818015ff011032",class:"counter-button",icon:"arrow"===this.controlsIcon?a:p,onClick:this.stepUp,tabindex:"0",title:this.t.get("increase"),part:"counter-button-increase"}),e("mds-button",{key:"ee82c65fd71d66b08714461ac8263f4bbfebcc9d",class:"counter-button",icon:"arrow"===this.controlsIcon?s:d,onClick:this.stepDown,tabindex:"0",title:this.t.get("decrease"),part:"counter-button-decrease"})),"number"===this.type&&"horizontal"===this.controlsLayout&&e("mds-button",{key:"b4621ae846273b4b70642d6747aa5d69fa234342",class:"counter-button counter-button--horizontal counter-button--increase",icon:"arrow"===this.controlsIcon?a:p,onClick:this.stepUp,tabindex:"0",title:this.t.get("increase"),part:"counter-button-increase"}),"password"===this.type&&e("mds-button",{key:"fa637888acee00fb2df6d6b5770f5b40eeae7031",class:"password-toggle-button",icon:this.isPasswordVisible?'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M12 7c2.76 0 5 2.24 5 5c0 .65-.13 1.26-.36 1.83l2.92 2.92c1.51-1.26 2.7-2.89 3.43-4.75c-1.73-4.39-6-7.5-11-7.5c-1.4 0-2.74.25-3.98.7l2.16 2.16C10.74 7.13 11.35 7 12 7zM2 4.27l2.28 2.28l.46.46A11.804 11.804 0 0 0 1 12c1.73 4.39 6 7.5 11 7.5c1.55 0 3.03-.3 4.38-.84l.42.42L19.73 22L21 20.73L3.27 3L2 4.27zM7.53 9.8l1.55 1.55c-.05.21-.08.43-.08.65c0 1.66 1.34 3 3 3c.22 0 .44-.03.65-.08l1.55 1.55c-.67.33-1.41.53-2.2.53c-2.76 0-5-2.24-5-5c0-.79.2-1.53.53-2.2zm4.31-.78l3.15 3.15l.02-.16c0-1.66-1.34-3-3-3l-.17.01z"/></svg>':'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M12 4.5C7 4.5 2.73 7.61 1 12c1.73 4.39 6 7.5 11 7.5s9.27-3.11 11-7.5c-1.73-4.39-6-7.5-11-7.5zM12 17c-2.76 0-5-2.24-5-5s2.24-5 5-5s5 2.24 5 5s-2.24 5-5 5zm0-8c-1.66 0-3 1.34-3 3s1.34 3 3 3s3-1.34 3-3s-1.34-3-3-3z"/></svg>',onClick:()=>this.isPasswordVisible=!this.isPasswordVisible,tabindex:"0",tone:"quiet",title:this.t.get(this.isPasswordVisible?"hidePassword":"showPassword"),part:"password-toggle-button"}),this.mic&&e("mds-button",{key:"85613ac5d7b424dc43770a4e54296d0bc9e7794a",class:r("mic-toggle-button",this.isRecording&&"mic-toggle-button--recording"),icon:this.speechToTextIcon,onClick:()=>this.toggleTextRecognition(),tabindex:"0",variant:"dark",tone:"quiet",title:this.speechToTextLabel,part:"mic-toggle-button"}),e("mds-input-tip",{key:"156b330252d0f8483c7996d902e1321bcc05dd7c",lang:this.language,position:"top",active:this.hasFocus},this.disabled&&e("mds-input-tip-item",{key:"5ccb7a0700d723bc05bab4fdac21d7bf823cf12f",expanded:!0,variant:"disabled"}),this.readonly&&e("mds-input-tip-item",{key:"eed82a87a109822b60e8d0a9ff6b078517087135",expanded:!0,variant:"readonly"}),this.required&&e("mds-input-tip-item",{key:"53daa9c77147a4fda3d13e55fdf4bca4c8471b29",expanded:this.hasFocus,variant:this.isValid?"required-success":"required"})),e("mds-input-tip",{key:"c95aa6e4c98c074712c772fe3a7513640c4daa63",lang:this.language,position:"bottom",active:this.hasFocus},this.tip&&e("mds-input-tip-item",{key:"a7813d9e3675924fe00e93248292a48d5e273ada",expanded:!0,variant:"text"},this.tip),this.maxlength&&e("mds-input-tip-item",{key:"01305a14e95334b7352dbe9cbccc90af18c0cc1d",part:"tip-count",expanded:!0,variant:this.countVariant},this.currentLengthLabel)),this.datalist&&e("datalist",{key:"f99c96b4bbb45760252e2a5fc5965dddfbc60c21",id:this.datalistId,class:"datalist"},this.datalist.map(((t,n)=>e("option",{key:n,value:t})))),this.icon&&!this.await&&e("mds-icon",{key:"41f6e990e5f47dbc8821934fc486c44a388d0386",class:r("icon",this.variant),name:this.icon}),e("mds-spinner",{key:"85598d3e10e75fff275693b7fe2d17b392e3e8c2",running:this.await,class:r("await",this.variant)}))}static get formAssociated(){return!0}get el(){return o(this)}static get watchers(){return{value:["valueChanged"],variant:["variantChanged"],maxlength:["maxLengthChanged"],disabled:["disabledChanged"]}}};M.style='/**\n * @prop --mds-input-background: Sets the background-color of the component\n * @prop --mds-input-icon-color: Sets the icon color of the component\n * @prop --mds-input-placeholder-default-color: Sets the color of the placeholder\n * @prop --mds-input-placeholder-focus-color: Sets the color of the placeholder when the input is focused\n * @prop --mds-input-placeholder-hover-color: Sets the color of the placeholder when the input is hovered\n * @prop --mds-input-ring: Sets the box-shadow of the component\'s input\n * @prop --mds-input-shadow: Sets the box-shadow of the component\'s input\n * @prop --mds-input-textarea-field-sizing: Sets the height of the textarea automatically, this is an EXPERIMENTAL css property, so it couldn\'t work in every browser\n * @prop --mds-input-textarea-max-height: Sets the `max-height` of the component when attribute `type` is set to `textarea`\n * @prop --mds-input-textarea-min-height: Sets the `min-height` of the component when attribute `type` is set to `textarea`\n * @prop --mds-input-tip-background: Sets the background color of the tip message at the bottom right of the component\n * @prop --mds-input-variant-color: Sets the variant colors of the component\n */\n\n:host {\n  --mds-input-background: rgb(var(--tone-neutral));\n  --mds-input-icon-color: var(--mds-input-variant-color);\n  --mds-input-placeholder-default-color: rgb(var(--tone-neutral-06));\n  --mds-input-placeholder-focus-color: rgb(var(--tone-neutral-07));\n  --mds-input-placeholder-hover-color: var(--mds-input-placeholder-default-color);\n  --mds-input-ring: 0 0 0 1px rgb(var(--mds-input-variant-color) / 0.1);\n  --mds-input-shadow: 0 1px 3px 0 rgb(var(--mds-input-variant-color) / 0.1), 0 1px 2px 0 rgb(var(--mds-input-variant-color) / 0.06);\n  --mds-input-textarea-field-sizing: content;\n  --mds-input-textarea-resize: none;\n  --mds-input-textarea-max-height: 16rem;\n  --mds-input-textarea-min-height: 6rem;\n  --mds-input-tip-background: 84 84 84;\n  --mds-input-variant-color: 0 0 0;\n  /* private */ --mds-input-controls-border: 2px solid rgb(var(--tone-neutral-09));\n  /* private */ --mds-input-controls-color: rgb(var(--tone-neutral-03)); min-height: 1.5rem; font-family: Karla, system-ui, -apple-system, BlinkMacSystemFont, \'Segoe UI\', sans-serif; font-size: 1rem; line-height: 1.5rem; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; gap: 0.5rem;\n\n  container-type: inline-size;\n  display: -ms-flexbox;\n  display: flex;\n  position: relative;\n}\n\n:host([typography="detail"]) .input {\n  min-height: 1.5rem;\n  font-family: Karla, system-ui, -apple-system, BlinkMacSystemFont, \'Segoe UI\', sans-serif;\n  font-size: 1rem;\n  line-height: 1.5rem;\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n}\n\n:host([typography="snippet"]) .input {\n  min-height: 1.5rem;\n  font-family: \'Roboto Mono\', \'Courier New\', monospace;\n  font-size: 1rem;\n  line-height: 1.5rem;\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n}\n\n.input {\n  font-family: Karla, system-ui, -apple-system, BlinkMacSystemFont, \'Segoe UI\', sans-serif;\n  font-size: 1rem;\n  line-height: 1.5rem;\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n  margin: 0rem;\n  border-radius: 0.5rem;\n  padding-left: 1rem;\n  padding-right: 1rem;\n  padding-top: 0.75rem;\n  padding-bottom: 0.75rem;\n  -webkit-transition-duration: 300ms;\n  transition-duration: 300ms;\n  -webkit-transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);\n  transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);\n\n    background-color: var(--mds-input-background);\n    border: 0;\n    -webkit-box-shadow: var(--mds-input-ring), var(--mds-input-shadow);\n    box-shadow: var(--mds-input-ring), var(--mds-input-shadow);\n    -webkit-box-sizing: border-box;\n    box-sizing: border-box;\n    color: rgb(var(--tone-neutral-02));\n    max-width: 100%;\n    min-height: 3rem;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    -webkit-transition-property: background-color, border-color, color, fill, margin, opacity, padding, -webkit-box-shadow, -webkit-transform;\n    transition-property: background-color, border-color, color, fill, margin, opacity, padding, -webkit-box-shadow, -webkit-transform;\n    transition-property: background-color, border-color, box-shadow, color, fill, margin, opacity, padding, transform;\n    transition-property: background-color, border-color, box-shadow, color, fill, margin, opacity, padding, transform, -webkit-box-shadow, -webkit-transform;\n    width: 100%;\n}\n\n.input::-moz-placeholder {\n  transition-duration: 300ms;\n  transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);\n\n  color: var(--mds-input-placeholder-default-color);\n  -moz-transition-property: color;\n  transition-property: color;\n}\n\n.input::-webkit-input-placeholder {\n  -webkit-transition-duration: 300ms;\n  transition-duration: 300ms;\n  -webkit-transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);\n  transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);\n\n  color: var(--mds-input-placeholder-default-color);\n  -webkit-transition-property: color;\n  transition-property: color;\n}\n\n.input:-ms-input-placeholder {\n  transition-duration: 300ms;\n  transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);\n\n  color: var(--mds-input-placeholder-default-color);\n  -ms-transition-property: color;\n  transition-property: color;\n}\n\n.input::-ms-input-placeholder {\n  transition-duration: 300ms;\n  transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);\n\n  color: var(--mds-input-placeholder-default-color);\n  -ms-transition-property: color;\n  transition-property: color;\n}\n\n.input::placeholder {\n  -webkit-transition-duration: 300ms;\n  transition-duration: 300ms;\n  -webkit-transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);\n  transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);\n\n  color: var(--mds-input-placeholder-default-color);\n  -webkit-transition-property: color;\n  transition-property: color;\n}\n\n.input:hover::-moz-placeholder {\n  color: var(--mds-input-placeholder-hover-color);\n}\n\n.input:hover::-webkit-input-placeholder {\n  color: var(--mds-input-placeholder-hover-color);\n}\n\n.input:hover:-ms-input-placeholder {\n  color: var(--mds-input-placeholder-hover-color);\n}\n\n.input:hover::-ms-input-placeholder {\n  color: var(--mds-input-placeholder-hover-color);\n}\n\n.input:hover::placeholder {\n  color: var(--mds-input-placeholder-hover-color);\n}\n\n.input:focus::-moz-placeholder {\n  color: var(--mds-input-placeholder-focus-color);\n}\n\n.input:focus::-webkit-input-placeholder {\n  color: var(--mds-input-placeholder-focus-color);\n}\n\n.input:focus:-ms-input-placeholder {\n  color: var(--mds-input-placeholder-focus-color);\n}\n\n.input:focus::-ms-input-placeholder {\n  color: var(--mds-input-placeholder-focus-color);\n}\n\n.input:focus::placeholder {\n  color: var(--mds-input-placeholder-focus-color);\n}\n\n.input::-webkit-outer-spin-button,\n.input::-webkit-inner-spin-button {\n  -webkit-appearance: none;\n          appearance: none;\n  display: none;\n  margin: 0;\n}\n\n:host textarea.input,\n:host([typography]) textarea.input {\n  border-bottom-right-radius: 0;\n\n  field-sizing: var(--mds-input-textarea-field-sizing);\n  max-height: var(--mds-input-textarea-max-height);\n  min-height: var(--mds-input-textarea-min-height);\n  overflow: auto;\n  resize: var(--mds-input-textarea-resize);\n}\n\n.input:focus {\n  outline: 2px solid transparent;\n  outline-offset: 2px;\n\n  --mds-input-ring: 0 0 0 3px rgb(var(--mds-input-variant-color) / 1);\n  --mds-input-shadow: 0 4px 6px 3px rgb(var(--mds-input-variant-color) / 0.1), 0 2px 4px -1px rgb(var(--mds-input-variant-color) / 0.06);\n}\n\n.input:disabled {\n  background-color: rgb(var(--tone-neutral-10));\n}\n\n.input:disabled::-moz-placeholder {\n  color: rgb(var(--tone-neutral-05));\n}\n\n.input:disabled::-webkit-input-placeholder {\n  color: rgb(var(--tone-neutral-05));\n}\n\n.input:disabled:-ms-input-placeholder {\n  color: rgb(var(--tone-neutral-05));\n}\n\n.input:disabled::-ms-input-placeholder {\n  color: rgb(var(--tone-neutral-05));\n}\n\n.input:disabled,\n.input:disabled::placeholder {\n  color: rgb(var(--tone-neutral-05));\n}\n\n.input.has-icon {\n  padding-left: 2.75rem;\n}\n\n.input.has-right-icon {\n  padding-right: 2.75rem;\n}\n\n\n.await,\n.icon {\n  left: 0.75rem;\n  top: 0.75rem;\n\n  fill: rgb(var(--mds-input-icon-color));\n  position: absolute;\n}\n\n.await {\n  color: rgb(var(--mds-input-icon-color));\n  height: 24px;\n  width: 24px;\n}\n\n.counter {\n  border-left: var(--mds-input-controls-border);\n  display: -ms-flexbox;\n  display: flex;\n  -ms-flex-direction: column;\n  flex-direction: column;\n  gap: 0;\n  position: absolute;\n  right: 0;\n}\n\n.counter-button {\n  height: 1.5rem;\n  width: 1.75rem;\n  border-radius: 0.5rem;\n\n  --mds-button-background: transparent;\n\n  border: 0;\n  fill: var(--mds-input-controls-color);\n  min-height: 0;\n  padding: 0;\n}\n\n.counter-button:hover {\n  --mds-button-background: rgb(var(--tone-neutral-09));\n}\n\n.counter .counter-button:first-child {\n  border-bottom-left-radius: 0;\n  border-bottom-right-radius: 0;\n  border-top-left-radius: 0;\n}\n\n.counter .counter-button:last-child {\n  border-bottom-left-radius: 0;\n  border-top-left-radius: 0;\n  border-top-right-radius: 0;\n}\n\n.counter-button--horizontal {\n  height: 3rem;\n  width: 3rem;\n\n  bottom: 0;\n  position: absolute;\n  top: 0;\n}\n\n.counter-button--decrease {\n  border-bottom-right-radius: 0;\n  border-right: var(--mds-input-controls-border);\n  border-top-right-radius: 0;\n  left: 0;\n}\n\n.counter-button--increase {\n  border-bottom-left-radius: 0;\n  border-left: var(--mds-input-controls-border);\n  border-top-left-radius: 0;\n  right: 0;\n}\n\n.password-toggle-button {\n  top: 0.375rem;\n  right: 0.375rem;\n\n  fill: var(--mds-input-controls-color);\n  position: absolute;\n}\n\n.mic-toggle-button {\n  top: 0.375rem;\n  right: 0.375rem;\n\n  fill: var(--mds-input-controls-color);\n  position: absolute;\n}\n\n.toggle-button--error {\n  cursor: help;\n  fill: rgb(var(--tone-neutral-06));\n}\n\n@-webkit-keyframes pulse {\n\n  50% {\n    opacity: .5;\n  }\n}\n\n@keyframes pulse {\n\n  50% {\n    opacity: .5;\n  }\n}\n\n.mic-toggle-button--recording {\n  -webkit-animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;\n  animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;\n}\n\n:host([type="number"]) .input {\n\n  /* required to avoid input number buttons on firefox go be shown always */\n\n  /* stylelint-disable-next-line property-no-vendor-prefix */\n  -moz-appearance: textfield;\n  padding-right: 2rem;\n}\n\n:host([type="number"][controls-layout="horizontal"]) .input {\n  padding-left: 3.5rem;\n  padding-right: 3.5rem;\n\n  text-align: center;\n}\n\n:host([type="number"][controls-layout="horizontal"][icon]) .input {\n  padding-left: 6rem;\n\n  text-align: left;\n}\n\n\n:host([type="number"][controls-layout="horizontal"]) .icon {\n  left: 3.75rem;\n}\n\n:host([type="password"]) .input {\n  padding-right: 2.5rem;\n}\n\n:host([type="password"]) .input[type="password"]:not(:-moz-placeholder-shown) {\n  font-size: 3rem;\n  max-height: 3rem;\n}\n\n:host([type="password"]) .input[type="password"]:not(:-ms-input-placeholder) {\n  font-size: 3rem;\n  max-height: 3rem;\n}\n\n:host([type="password"]) .input[type="password"]:not(:placeholder-shown) {\n  font-size: 3rem;\n  max-height: 3rem;\n}\n\n:host([type="password"]) .input[type="text"]:not(:-moz-placeholder-shown) {\n  min-height: 1.5rem;\n  font-family: \'Roboto Mono\', \'Courier New\', monospace;\n  font-size: 1rem;\n  line-height: 1.5rem;\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n}\n\n:host([type="password"]) .input[type="text"]:not(:-ms-input-placeholder) {\n  min-height: 1.5rem;\n  font-family: \'Roboto Mono\', \'Courier New\', monospace;\n  font-size: 1rem;\n  line-height: 1.5rem;\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n}\n\n:host([type="password"]) .input[type="text"]:not(:placeholder-shown) {\n  min-height: 1.5rem;\n  font-family: \'Roboto Mono\', \'Courier New\', monospace;\n  font-size: 1rem;\n  line-height: 1.5rem;\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n}\n\n:host([type="cf"]) .input {\n  min-height: 1.5rem;\n  font-family: \'Roboto Mono\', \'Courier New\', monospace;\n  font-size: 1rem;\n  line-height: 1.5rem;\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n  text-transform: uppercase;\n}\n\n@container (max-width: 210px) {\n  :host .tip__content,\n  :host(:focus-within) .tip__content {\n    grid-template-columns: 0fr;\n    opacity: 0;\n  }\n\n  :host .tip {\n    padding-left: 0;\n    padding-right: 0;\n  }\n\n  :host {\n    --mds-input-background: rgb(var(--variant-primary-07));\n  }\n}\n\n:host {\n  --mds-input-icon-color: var(--variant-primary-03);\n  --mds-input-variant-color: 0 0 0;\n}\n\n:host(:focus) {\n  --mds-input-variant-color: var(--variant-primary-04);\n}\n\n:host([variant="ai"]) {\n  --mds-input-icon-color: var(--variant-ai-05);\n  --mds-input-tip-background: var(--variant-ai-05);\n  --mds-input-variant-color: 0 0 0;\n}\n\n:host([variant="ai"]:focus) {\n  --mds-input-icon-color: var(--variant-ai-04);\n  --mds-input-variant-color: var(--variant-ai-05);\n}\n\n:host([variant="info"]) {\n  --mds-input-icon-color: var(--status-info-05);\n  --mds-input-tip-background: var(--status-info-05);\n  --mds-input-variant-color: 0 0 0;\n}\n\n:host([variant="info"]:focus) {\n  --mds-input-icon-color: var(--status-info-04);\n  --mds-input-variant-color: var(--status-info-05);\n}\n\n:host([variant="success"]) {\n  --mds-input-icon-color: var(--status-success-05);\n  --mds-input-tip-background: var(--status-success-05);\n  --mds-input-variant-color: 0 0 0;\n}\n\n:host([variant="success"]:focus) {\n  --mds-input-icon-color: var(--status-success-04);\n  --mds-input-variant-color: var(--status-success-05);\n}\n\n:host([variant="warning"]) {\n  --mds-input-icon-color: var(--status-warning-05);\n  --mds-input-tip-background: var(--status-warning-05);\n  --mds-input-variant-color: 0 0 0;\n}\n\n:host([variant="warning"]:focus) {\n  --mds-input-icon-color: var(--status-warning-04);\n  --mds-input-variant-color: var(--status-warning-05);\n}\n\n:host([variant="error"]) {\n  --mds-input-icon-color: var(--status-error-05);\n  --mds-input-tip-background: var(--status-error-05);\n  --mds-input-variant-color: 0 0 0;\n}\n\n:host([variant="error"]:focus) {\n  --mds-input-icon-color: var(--status-error-04);\n  --mds-input-variant-color: var(--status-error-05);\n}\n\n:host-context(.pref-animation-reduce) .input {\n  -webkit-transition-duration: 0s;\n  transition-duration: 0s;\n}\n\n@media (prefers-reduced-motion) {\n  :host-context(.pref-animation-system) .input {\n    -webkit-transition-duration: 0s;\n    transition-duration: 0s;\n  }\n}\n\n:host-context(.pref-theme-dark) {\n  --mds-input-ring: 0 0 0 2px rgb(var(--tone-neutral-01) / 0.3);\n  --mds-input-background: rgb(var(--tone-neutral-09));\n  --mds-input-controls-border: 2px solid rgb(var(--tone-neutral-06));\n}\n\n:host-context(.pref-theme-dark) .counter-button:hover {\n  --mds-button-background: rgb(var(--tone-neutral-08));\n}\n\n@media (prefers-color-scheme: dark) {\n  :host-context(.pref-theme-system) {\n    --mds-input-ring: 0 0 0 2px rgb(var(--tone-neutral-01) / 0.3);\n    --mds-input-background: rgb(var(--tone-neutral-09));\n    --mds-input-controls-border: 2px solid rgb(var(--tone-neutral-06));\n  }\n\n  :host-context(.pref-theme-system) .counter-button:hover {\n    --mds-button-background: rgb(var(--tone-neutral-08));\n  }\n}\n\n:host-context(.pref-contrast-more) {\n  --mds-input-ring: 0 0 0 2px rgb(var(--tone-neutral-01) / 0.6);\n  --mds-input-background: rgb(var(--tone-neutral-09));\n  --mds-input-controls-border: 2px solid rgb(var(--tone-neutral-05));\n}\n\n:host-context(.pref-contrast-more) .input::-moz-placeholder {\n  color: rgb(var(--tone-neutral-03));\n}\n\n:host-context(.pref-contrast-more) .input::-webkit-input-placeholder {\n  color: rgb(var(--tone-neutral-03));\n}\n\n:host-context(.pref-contrast-more) .input:-ms-input-placeholder {\n  color: rgb(var(--tone-neutral-03));\n}\n\n:host-context(.pref-contrast-more) .input::-ms-input-placeholder {\n  color: rgb(var(--tone-neutral-03));\n}\n\n:host-context(.pref-contrast-more) .input::placeholder {\n  color: rgb(var(--tone-neutral-03));\n}\n\n@media (prefers-contrast: more) {\n  :host-context(.pref-contrast-system) {\n    --mds-input-ring: 0 0 0 2px rgb(var(--tone-neutral-01) / 0.6);\n    --mds-input-background: rgb(var(--tone-neutral-09));\n    --mds-input-controls-border: 2px solid rgb(var(--tone-neutral-05));\n  }\n\n  :host-context(.pref-contrast-more) .input::-moz-placeholder {\n    color: rgb(var(--tone-neutral-03));\n  }\n\n  :host-context(.pref-contrast-more) .input::-webkit-input-placeholder {\n    color: rgb(var(--tone-neutral-03));\n  }\n\n  :host-context(.pref-contrast-more) .input:-ms-input-placeholder {\n    color: rgb(var(--tone-neutral-03));\n  }\n\n  :host-context(.pref-contrast-more) .input::-ms-input-placeholder {\n    color: rgb(var(--tone-neutral-03));\n  }\n\n  :host-context(.pref-contrast-more) .input::placeholder {\n    color: rgb(var(--tone-neutral-03));\n  }\n}\n\n:host(:not(:is([hydrated], .hydrated))) {\n  -webkit-animation-duration: 0s;\n  animation-duration: 0s;\n  border-color: transparent;\n  -webkit-box-shadow: 0 0 0 transparent;\n  box-shadow: 0 0 0 transparent;\n  opacity: 0;\n  outline-color: transparent;\n  -webkit-transition-delay: 0s;\n  transition-delay: 0s;\n  -webkit-transition-duration: 0s;\n  transition-duration: 0s;\n  visibility: hidden;\n}\n\n/* TODO refact(stencil): Uses only used selector from parent shadowDOM component */\n\nmds-accordion:not(:is([hydrated], .hydrated)),\nmds-accordion-item:not(:is([hydrated], .hydrated)),\nmds-accordion-timer:not(:is([hydrated], .hydrated)),\nmds-accordion-timer-item:not(:is([hydrated], .hydrated)),\nmds-author:not(:is([hydrated], .hydrated)),\nmds-avatar:not(:is([hydrated], .hydrated)),\nmds-badge:not(:is([hydrated], .hydrated)),\nmds-banner:not(:is([hydrated], .hydrated)),\nmds-benchmark-bar:not(:is([hydrated], .hydrated)),\nmds-bibliography:not(:is([hydrated], .hydrated)),\nmds-breadcrumb:not(:is([hydrated], .hydrated)),\nmds-breadcrumb-item:not(:is([hydrated], .hydrated)),\nmds-button:not(:is([hydrated], .hydrated)),\nmds-card:not(:is([hydrated], .hydrated)),\nmds-card-content:not(:is([hydrated], .hydrated)),\nmds-card-footer:not(:is([hydrated], .hydrated)),\nmds-card-header:not(:is([hydrated], .hydrated)),\nmds-card-media:not(:is([hydrated], .hydrated)),\nmds-chip:not(:is([hydrated], .hydrated)),\nmds-details:not(:is([hydrated], .hydrated)),\nmds-dropdown:not(:is([hydrated], .hydrated)),\nmds-entity:not(:is([hydrated], .hydrated)),\nmds-file:not(:is([hydrated], .hydrated)),\nmds-file-preview:not(:is([hydrated], .hydrated)),\nmds-filter:not(:is([hydrated], .hydrated)),\nmds-filter-item:not(:is([hydrated], .hydrated)),\nmds-header:not(:is([hydrated], .hydrated)),\nmds-header-bar:not(:is([hydrated], .hydrated)),\nmds-help:not(:is([hydrated], .hydrated)),\nmds-horizontal-scroll:not(:is([hydrated], .hydrated)),\nmds-hr:not(:is([hydrated], .hydrated)),\nmds-icon:not(:is([hydrated], .hydrated)),\nmds-img:not(:is([hydrated], .hydrated)),\nmds-input:not(:is([hydrated], .hydrated)),\nmds-input-field:not(:is([hydrated], .hydrated)),\nmds-input-range:not(:is([hydrated], .hydrated)),\nmds-input-select:not(:is([hydrated], .hydrated)),\nmds-input-switch:not(:is([hydrated], .hydrated)),\nmds-input-tip:not(:is([hydrated], .hydrated)),\nmds-input-tip-item:not(:is([hydrated], .hydrated)),\nmds-input-upload:not(:is([hydrated], .hydrated)),\nmds-keyboard:not(:is([hydrated], .hydrated)),\nmds-keyboard-key:not(:is([hydrated], .hydrated)),\nmds-kpi:not(:is([hydrated], .hydrated)),\nmds-kpi-item:not(:is([hydrated], .hydrated)),\nmds-label:not(:is([hydrated], .hydrated)),\nmds-list:not(:is([hydrated], .hydrated)),\nmds-list-item:not(:is([hydrated], .hydrated)),\nmds-modal:not(:is([hydrated], .hydrated)),\nmds-note:not(:is([hydrated], .hydrated)),\nmds-notification:not(:is([hydrated], .hydrated)),\nmds-paginator:not(:is([hydrated], .hydrated)),\nmds-paginator-item:not(:is([hydrated], .hydrated)),\nmds-pref:not(:is([hydrated], .hydrated)),\nmds-pref-animation:not(:is([hydrated], .hydrated)),\nmds-pref-consumption:not(:is([hydrated], .hydrated)),\nmds-pref-contrast:not(:is([hydrated], .hydrated)),\nmds-pref-language:not(:is([hydrated], .hydrated)),\nmds-pref-language-item:not(:is([hydrated], .hydrated)),\nmds-pref-theme:not(:is([hydrated], .hydrated)),\nmds-price-table:not(:is([hydrated], .hydrated)),\nmds-price-table-features:not(:is([hydrated], .hydrated)),\nmds-price-table-features-cell:not(:is([hydrated], .hydrated)),\nmds-price-table-features-row:not(:is([hydrated], .hydrated)),\nmds-price-table-header:not(:is([hydrated], .hydrated)),\nmds-price-table-list:not(:is([hydrated], .hydrated)),\nmds-price-table-list-item:not(:is([hydrated], .hydrated)),\nmds-progress:not(:is([hydrated], .hydrated)),\nmds-push-notification:not(:is([hydrated], .hydrated)),\nmds-push-notifications:not(:is([hydrated], .hydrated)),\nmds-quote:not(:is([hydrated], .hydrated)),\nmds-separator:not(:is([hydrated], .hydrated)),\nmds-spinner:not(:is([hydrated], .hydrated)),\nmds-stepper-bar:not(:is([hydrated], .hydrated)),\nmds-stepper-bar-item:not(:is([hydrated], .hydrated)),\nmds-tab:not(:is([hydrated], .hydrated)),\nmds-tab-bar:not(:is([hydrated], .hydrated)),\nmds-tab-bar-item:not(:is([hydrated], .hydrated)),\nmds-tab-item:not(:is([hydrated], .hydrated)),\nmds-table:not(:is([hydrated], .hydrated)),\nmds-table-body:not(:is([hydrated], .hydrated)),\nmds-table-cell:not(:is([hydrated], .hydrated)),\nmds-table-footer:not(:is([hydrated], .hydrated)),\nmds-table-header:not(:is([hydrated], .hydrated)),\nmds-table-header-cell:not(:is([hydrated], .hydrated)),\nmds-table-row:not(:is([hydrated], .hydrated)),\nmds-text:not(:is([hydrated], .hydrated)),\nmds-toast:not(:is([hydrated], .hydrated)),\nmds-tooltip:not(:is([hydrated], .hydrated)),\nmds-tree:not(:is([hydrated], .hydrated)),\nmds-tree-item:not(:is([hydrated], .hydrated)),\nmds-url-view:not(:is([hydrated], .hydrated)),\nmds-usage:not(:is([hydrated], .hydrated)),\nmds-video-wall:not(:is([hydrated], .hydrated)),\nmds-zero:not(:is([hydrated], .hydrated))\n{\n  -webkit-animation-duration: 0s;\n  animation-duration: 0s;\n  border-color: transparent;\n  -webkit-box-shadow: 0 0 0 transparent;\n  box-shadow: 0 0 0 transparent;\n  opacity: 0;\n  outline-color: transparent;\n  -webkit-transition-delay: 0s;\n  transition-delay: 0s;\n  -webkit-transition-duration: 0s;\n  transition-duration: 0s;\n  visibility: hidden;\n}\n\n';export{M as mds_input}

package/dist/magma-components/p-cc65db79.entry.js

@@ -1 +0,0 @@
-import{r as t,h as e,H as a,g as o}from"./p-3a6b32e7.js";const i={action:{tag:"span",selector:{default:"text-title-action",title:"text-title-action"}},caption:{tag:"span",selector:{default:"text-info-caption",info:"text-info-caption",read:"text-read-caption"}},detail:{tag:"p",selector:{default:"text-info-detail",info:"text-info-detail",read:"text-read-detail"}},h1:{tag:"h1",selector:{default:"text-title-h1",title:"text-title-h1"}},h2:{tag:"h2",selector:{default:"text-title-h2",title:"text-title-h2"}},h3:{tag:"h3",selector:{default:"text-title-h3",title:"text-title-h3"}},h4:{tag:"h4",selector:{default:"text-title-h4",title:"text-title-h4"}},h5:{tag:"h5",selector:{default:"text-title-h5",title:"text-title-h5"}},h6:{tag:"h6",selector:{default:"text-title-h6",title:"text-title-h6"}},hack:{tag:"code",selector:{default:"text-code-hack",mono:"text-code-hack"}},label:{tag:"label",selector:{default:"text-info-label",info:"text-info-label"}},option:{tag:"label",selector:{default:"text-info-option",info:"text-info-option"}},paragraph:{tag:"p",selector:{default:"text-info-paragraph",secondary:"text-secondary-paragraph",info:"text-info-paragraph",read:"text-read-paragraph"}},snippet:{tag:"code",selector:{default:"text-code-snippet",mono:"text-code-snippet"}},tip:{tag:"div",selector:{default:"text-info-tip",info:"text-info-tip"}}},s=2147483647,r=t=>16807*t%s,d=t=>r(t)/s,n=((t=1)=>{let e=t<1?1:t;const a=()=>(e=r(e),e);return{random:()=>a(),randomFloat:()=>d(a()),range:(t,e)=>{const o=t-.4999;return Math.round(o+(e+.4999-o)*d(a()))},rangeFloat:(t,e)=>t+(e-t)*d(a())}})(),h=()=>{};class m{constructor(t){this.start=()=>{const{frameOffset:t,charOffset:e,str:a,speed:o}=this,i=(s=t,r=e,t=>(t=>t.split("").map((t=>t.charCodeAt(0))))(t).map(((t,e)=>()=>(t+n.range(0,e))*(2*(Math.round(Math.random())-.5)))(s,r)))(a);var s,r;this.stop(),this.rafId=requestAnimationFrame((()=>{this.step(i,o,o)}))},Object.assign(this,Object.assign(Object.assign({},m.defaults),t))}stop(){cancelAnimationFrame(this.rafId)}step(t,e,a){const{str:o,charStep:i,minCharCode:s,maxCharCode:r,placeholderChar:d,onProgress:n,onComplete:h}=this,m=t.slice(0,e).map((t=>t>0?t-1:t<0?t+1:0)),l=(({str:t,minCharCode:e,maxCharCode:a,placeholderChar:o,charStep:i})=>s=>s.reduce(((s,r,d)=>{return 0!==r?Math.abs(r)>i?s+o:s+String.fromCharCode((n=e,h=a,t=>t>h?n+(t-h):t<n?h+(t-n):t)(t.charCodeAt(d)+r)):s+t.charAt(d);var n,h}),""))({str:o,minCharCode:s,maxCharCode:r,placeholderChar:d,charStep:i})(m),y=[...m,...t.slice(e)];n(l),l!==o?this.rafId=requestAnimationFrame((()=>{this.step(y,e+a,a)})):h(l)}}m.defaults={str:"",speed:2,placeholderChar:"_",frameOffset:30,charOffset:20,charStep:10,minCharCode:32,maxCharCode:122,onProgress:h,onComplete:h};const l=class{constructor(e){t(this,e),this.cssTextAnimationSpeed=2,this.cssTextAnimationPlaceholderChar=" ",this.randomTextOptions={speed:this.cssTextAnimationSpeed,placeholderChar:this.cssTextAnimationPlaceholderChar,frameOffset:10,charOffset:20,charStep:15},this.animation="none",this.typography="detail",this.animateText=t=>{var e;const a=null===(e=this.host.shadowRoot)||void 0===e?void 0:e.querySelector(".text");this.randomTextOptions.speed=this.cssTextAnimationSpeed,this.randomTextOptions.placeholderChar=this.cssTextAnimationPlaceholderChar,console.info("animateText",this.cssTextAnimationPlaceholderChar),this.randomText=new m(Object.assign({str:t,onProgress:t=>{a.innerHTML=t}},this.randomTextOptions)),this.randomText.start()},this.updateCSSCustomProps=()=>{if("undefined"==typeof window)return;const t=window.getComputedStyle(this.host);this.cssTextAnimationSpeed=Number(t.getPropertyValue("--mds-text-animation-speed"));const e=t.getPropertyValue("--mds-text-animation-placeholder-char");this.cssTextAnimationPlaceholderChar='" "'!==e&&"' '"!==e?e:" "}}componentWillRender(){var t;const{tag:e}=i[this.typography];this.tag=null!==(t=this.tag)&&void 0!==t?t:e}componentDidLoad(){this.updateCSSCustomProps()}textHandler(t){"none"!==this.animation&&(this.randomText&&this.randomText.stop(),t&&this.animateText(t))}render(){return e(a,{key:"be2fe2a0408f4021fe38199c85d05b766fcc69ef"},e(this.tag,{key:"179a5b0c33ec88d31459f77b686c3f318b06a410",class:"text"},this.text?this.text:e("slot",null)))}get host(){return o(this)}static get watchers(){return{text:["textHandler"]}}};l.style=':host{--mds-text-selection-background:rgb(var(--label-sky-09));--mds-text-selection-color:rgb(var(--label-sky-01));--mds-text-line-clamp:3;--mds-text-animation-speed:0.5;--mds-text-animation-placeholder-char:" ";display:-ms-flexbox;display:flex;min-width:0}.text::-moz-selection{background-color:var(--mds-text-selection-background);color:var(--mds-text-selection-color)}.text::selection{background-color:var(--mds-text-selection-background);color:var(--mds-text-selection-color)}.text{cursor:inherit;display:inherit}:host([typography="snippet"]){min-height:1.5rem;font-family:\'Roboto Mono\', \'Courier New\', monospace;font-size:1rem;line-height:1.5rem;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:host([typography="hack"]){min-height:1.25rem;font-family:\'Roboto Mono\', \'Courier New\', monospace;font-size:0.875rem;line-height:1.25rem;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:host([typography="h1"]){min-height:3rem;font-family:Roboto, system-ui, -apple-system, BlinkMacSystemFont, \'Segoe UI\', sans-serif;font-size:3rem;line-height:3rem;letter-spacing:-0.025em;font-weight:900;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:host([typography="h2"]){min-height:2.5rem;font-family:Roboto, system-ui, -apple-system, BlinkMacSystemFont, \'Segoe UI\', sans-serif;font-size:2.25rem;line-height:2.5rem;letter-spacing:-0.025em;font-weight:900;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:host([typography="h3"]){min-height:2.25rem;font-family:Roboto, system-ui, -apple-system, BlinkMacSystemFont, \'Segoe UI\', sans-serif;font-size:1.875rem;line-height:2.25rem;letter-spacing:-0.025em;font-weight:900;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:host([typography="h4"]){min-height:2rem;font-family:Roboto, system-ui, -apple-system, BlinkMacSystemFont, \'Segoe UI\', sans-serif;font-size:1.5rem;line-height:2rem;letter-spacing:-0.025em;font-weight:700;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:host([typography="h5"]){min-height:1.75rem;font-family:Roboto, system-ui, -apple-system, BlinkMacSystemFont, \'Segoe UI\', sans-serif;font-size:1.25rem;line-height:1.75rem;letter-spacing:-0.025em;font-weight:700;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:host([typography="h6"]){min-height:1.5rem;font-family:Roboto, system-ui, -apple-system, BlinkMacSystemFont, \'Segoe UI\', sans-serif;font-size:1rem;line-height:1.5rem;letter-spacing:-0.025em;font-weight:700;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:host([typography="h1"]),:host([typography="h2"]),:host([typography="h3"]),:host([typography="h4"]),:host([typography="h5"]),:host([typography="h6"]){text-wrap:balance}:host([typography="action"]){min-height:1.5rem;font-family:Roboto, system-ui, -apple-system, BlinkMacSystemFont, \'Segoe UI\', sans-serif;font-size:0.875rem;line-height:1.5rem;font-weight:500;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:host([typography="paragraph"]){min-height:2rem;font-family:Karla, system-ui, -apple-system, BlinkMacSystemFont, \'Segoe UI\', sans-serif;font-size:1.25rem;line-height:2rem;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:host([typography="detail"]){min-height:1.5rem;font-family:Karla, system-ui, -apple-system, BlinkMacSystemFont, \'Segoe UI\', sans-serif;font-size:1rem;line-height:1.5rem;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:host([typography="caption"]){min-height:1.25rem;font-family:Karla, system-ui, -apple-system, BlinkMacSystemFont, \'Segoe UI\', sans-serif;font-size:0.875rem;line-height:1.25rem;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:host([typography="paragraph"]),:host([typography="detail"]),:host([typography="caption"]){text-wrap:pretty}:host([typography="label"]){min-height:1rem;font-family:Karla, system-ui, -apple-system, BlinkMacSystemFont, \'Segoe UI\', sans-serif;font-size:0.75rem;line-height:1rem;font-weight:700;text-transform:uppercase;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:host([typography="tip"]){min-height:1rem;font-family:Karla, system-ui, -apple-system, BlinkMacSystemFont, \'Segoe UI\', sans-serif;font-size:0.75rem;line-height:1rem;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:host([typography="option"]){min-height:0.625rem;font-family:Karla, system-ui, -apple-system, BlinkMacSystemFont, \'Segoe UI\', sans-serif;font-size:0.625rem;line-height:0.625rem;letter-spacing:-0.025em;font-weight:700;text-transform:uppercase;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:host([typography="paragraph"][variant="read"]){min-height:2rem;font-family:\'Merriweather\', Times, \'Times New Roman\', serif;font-size:1.25rem;line-height:2rem;font-weight:300;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:host([typography="detail"][variant="read"]){min-height:1.5rem;font-family:\'Merriweather\', Times, \'Times New Roman\', serif;font-size:1rem;line-height:1.5rem;font-weight:300;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:host([typography="caption"][variant="read"]){min-height:1.25rem;font-family:\'Merriweather\', Times, \'Times New Roman\', serif;font-size:0.875rem;line-height:1.25rem;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:host([tag="article"]),:host([tag="blockquote"]),:host([tag="dd"]),:host([tag="details"]),:host([tag="div"]),:host([tag="dl"]),:host([tag="dt"]),:host([tag="figcaption"]),:host([tag="h1"]),:host([tag="h2"]),:host([tag="h3"]),:host([tag="h4"]),:host([tag="h5"]),:host([tag="h6"]),:host([tag="label"]),:host([tag="legend"]),:host([tag="li"]),:host([tag="ol"]),:host([tag="p"]),:host([tag="pre"]),:host([tag="summary"]),:host([tag="ul"]){display:block}:host([tag="abbr"]),:host([tag="address"]),:host([tag="b"]),:host([tag="bdo"]),:host([tag="cite"]),:host([tag="code"]),:host([tag="del"]),:host([tag="dfn"]),:host([tag="em"]),:host([tag="i"]),:host([tag="ins"]),:host([tag="kbd"]),:host([tag="mark"]),:host([tag="q"]),:host([tag="rb"]),:host([tag="rt"]),:host([tag="ruby"]),:host([tag="s"]),:host([tag="samp"]),:host([tag="small"]),:host([tag="span"]),:host([tag="strong"]),:host([tag="sub"]),:host([tag="sup"]),:host([tag="time"]),:host([tag="u"]),:host([tag="var"]){display:inline}:host([tag="code"]){border-radius:0.25rem;padding-left:0.25rem;padding-right:0.25rem;padding-top:0.0625rem;padding-bottom:0.0625rem;-webkit-transition-duration:200ms;transition-duration:200ms;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);background-color:rgb(var(--tone-neutral-09));-webkit-box-shadow:rgb(var(--tone-neutral-08)) 0 0 0 1px;box-shadow:rgb(var(--tone-neutral-08)) 0 0 0 1px;color:rgb(var(--tone-neutral-03));-webkit-transition-property:color, background-color;transition-property:color, background-color}:host([truncate]) .text{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis}:host([truncate="word"]) .text{white-space:nowrap}@supports (line-clamp: 1){:host([truncate="all"]) .text{line-clamp:var(--mds-text-line-clamp, 1)}}@supports (display: -webkit-box){:host([truncate="all"]) .text{-webkit-box-orient:vertical;display:-webkit-box;-webkit-line-clamp:var(--mds-text-line-clamp, 1)}}abbr,address,article,b,bdo,blockquote,cite,code,dd,del,details,dfn,div,dl,dt,em,figcaption,h1,h2,h3,h4,h5,h6,i,ins,kbd,label,legend,li,mark,ol,p,pre,q,rb,rt,ruby,s,samp,small,span,strong,sub,summary,sup,time,u,ul,var,wbr{font-family:inherit;font-size:inherit;font-weight:inherit;line-height:inherit;margin:0;overflow:inherit;text-overflow:inherit}:host-context(.pref-animation-reduce){-webkit-transition-duration:0s;transition-duration:0s}@media (prefers-reduced-motion){:host-context(.pref-animation-system){-webkit-transition-duration:0s;transition-duration:0s}}:host(:not(:is([hydrated],.hydrated))){-webkit-animation-duration:0s;animation-duration:0s;border-color:transparent;-webkit-box-shadow:0 0 0 transparent;box-shadow:0 0 0 transparent;opacity:0;outline-color:transparent;-webkit-transition-delay:0s;transition-delay:0s;-webkit-transition-duration:0s;transition-duration:0s;visibility:hidden}mds-accordion:not(:is([hydrated],.hydrated)),mds-accordion-item:not(:is([hydrated],.hydrated)),mds-accordion-timer:not(:is([hydrated],.hydrated)),mds-accordion-timer-item:not(:is([hydrated],.hydrated)),mds-author:not(:is([hydrated],.hydrated)),mds-avatar:not(:is([hydrated],.hydrated)),mds-badge:not(:is([hydrated],.hydrated)),mds-banner:not(:is([hydrated],.hydrated)),mds-benchmark-bar:not(:is([hydrated],.hydrated)),mds-bibliography:not(:is([hydrated],.hydrated)),mds-breadcrumb:not(:is([hydrated],.hydrated)),mds-breadcrumb-item:not(:is([hydrated],.hydrated)),mds-button:not(:is([hydrated],.hydrated)),mds-card:not(:is([hydrated],.hydrated)),mds-card-content:not(:is([hydrated],.hydrated)),mds-card-footer:not(:is([hydrated],.hydrated)),mds-card-header:not(:is([hydrated],.hydrated)),mds-card-media:not(:is([hydrated],.hydrated)),mds-chip:not(:is([hydrated],.hydrated)),mds-details:not(:is([hydrated],.hydrated)),mds-dropdown:not(:is([hydrated],.hydrated)),mds-entity:not(:is([hydrated],.hydrated)),mds-file:not(:is([hydrated],.hydrated)),mds-file-preview:not(:is([hydrated],.hydrated)),mds-filter:not(:is([hydrated],.hydrated)),mds-filter-item:not(:is([hydrated],.hydrated)),mds-header:not(:is([hydrated],.hydrated)),mds-header-bar:not(:is([hydrated],.hydrated)),mds-help:not(:is([hydrated],.hydrated)),mds-horizontal-scroll:not(:is([hydrated],.hydrated)),mds-hr:not(:is([hydrated],.hydrated)),mds-icon:not(:is([hydrated],.hydrated)),mds-img:not(:is([hydrated],.hydrated)),mds-input:not(:is([hydrated],.hydrated)),mds-input-field:not(:is([hydrated],.hydrated)),mds-input-range:not(:is([hydrated],.hydrated)),mds-input-select:not(:is([hydrated],.hydrated)),mds-input-switch:not(:is([hydrated],.hydrated)),mds-input-tip:not(:is([hydrated],.hydrated)),mds-input-tip-item:not(:is([hydrated],.hydrated)),mds-input-upload:not(:is([hydrated],.hydrated)),mds-keyboard:not(:is([hydrated],.hydrated)),mds-keyboard-key:not(:is([hydrated],.hydrated)),mds-kpi:not(:is([hydrated],.hydrated)),mds-kpi-item:not(:is([hydrated],.hydrated)),mds-label:not(:is([hydrated],.hydrated)),mds-list:not(:is([hydrated],.hydrated)),mds-list-item:not(:is([hydrated],.hydrated)),mds-modal:not(:is([hydrated],.hydrated)),mds-note:not(:is([hydrated],.hydrated)),mds-notification:not(:is([hydrated],.hydrated)),mds-paginator:not(:is([hydrated],.hydrated)),mds-paginator-item:not(:is([hydrated],.hydrated)),mds-pref:not(:is([hydrated],.hydrated)),mds-pref-animation:not(:is([hydrated],.hydrated)),mds-pref-consumption:not(:is([hydrated],.hydrated)),mds-pref-contrast:not(:is([hydrated],.hydrated)),mds-pref-language:not(:is([hydrated],.hydrated)),mds-pref-language-item:not(:is([hydrated],.hydrated)),mds-pref-theme:not(:is([hydrated],.hydrated)),mds-price-table:not(:is([hydrated],.hydrated)),mds-price-table-features:not(:is([hydrated],.hydrated)),mds-price-table-features-cell:not(:is([hydrated],.hydrated)),mds-price-table-features-row:not(:is([hydrated],.hydrated)),mds-price-table-header:not(:is([hydrated],.hydrated)),mds-price-table-list:not(:is([hydrated],.hydrated)),mds-price-table-list-item:not(:is([hydrated],.hydrated)),mds-progress:not(:is([hydrated],.hydrated)),mds-push-notification:not(:is([hydrated],.hydrated)),mds-push-notifications:not(:is([hydrated],.hydrated)),mds-quote:not(:is([hydrated],.hydrated)),mds-separator:not(:is([hydrated],.hydrated)),mds-spinner:not(:is([hydrated],.hydrated)),mds-stepper-bar:not(:is([hydrated],.hydrated)),mds-stepper-bar-item:not(:is([hydrated],.hydrated)),mds-tab:not(:is([hydrated],.hydrated)),mds-tab-bar:not(:is([hydrated],.hydrated)),mds-tab-bar-item:not(:is([hydrated],.hydrated)),mds-tab-item:not(:is([hydrated],.hydrated)),mds-table:not(:is([hydrated],.hydrated)),mds-table-body:not(:is([hydrated],.hydrated)),mds-table-cell:not(:is([hydrated],.hydrated)),mds-table-footer:not(:is([hydrated],.hydrated)),mds-table-header:not(:is([hydrated],.hydrated)),mds-table-header-cell:not(:is([hydrated],.hydrated)),mds-table-row:not(:is([hydrated],.hydrated)),mds-text:not(:is([hydrated],.hydrated)),mds-toast:not(:is([hydrated],.hydrated)),mds-tooltip:not(:is([hydrated],.hydrated)),mds-tree:not(:is([hydrated],.hydrated)),mds-tree-item:not(:is([hydrated],.hydrated)),mds-url-view:not(:is([hydrated],.hydrated)),mds-usage:not(:is([hydrated],.hydrated)),mds-video-wall:not(:is([hydrated],.hydrated)),mds-zero:not(:is([hydrated],.hydrated)){-webkit-animation-duration:0s;animation-duration:0s;border-color:transparent;-webkit-box-shadow:0 0 0 transparent;box-shadow:0 0 0 transparent;opacity:0;outline-color:transparent;-webkit-transition-delay:0s;transition-delay:0s;-webkit-transition-duration:0s;transition-duration:0s;visibility:hidden}';export{l as mds_text}