maz-ui 5.0.0-beta.18 → 5.0.0-beta.19
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/assets/MazInput.CxBl5eb8.css +2 -0
- package/dist/assets/MazTextarea.B165I3tW.css +2 -0
- package/dist/chunks/MazInput.C5wxW29_.js +1 -0
- package/dist/chunks/{MazInputNumber._F7CRgHE.js → MazInputNumber.H3hDFruX.js} +1 -1
- package/dist/chunks/{MazInputPhoneNumber.DMD2XErn.js → MazInputPhoneNumber.DSKkCU9W.js} +1 -1
- package/dist/chunks/{MazInputPrice.aR_f6LuH.js → MazInputPrice.vwVZLIjo.js} +1 -1
- package/dist/chunks/{MazInputTags.Bd4P9p7N.js → MazInputTags.Cbo7mrA-.js} +1 -1
- package/dist/chunks/{MazSelect.DDUMyiCj.js → MazSelect.D0Bhctte.js} +1 -1
- package/dist/chunks/{MazSelectCountry.DonkdtGq.js → MazSelectCountry.DG9eMPlJ.js} +1 -1
- package/dist/chunks/MazTextarea.CvuA5KZc.js +1 -0
- package/dist/chunks/{PhoneInput._D4UIQzs.js → PhoneInput.DXI3UxdG.js} +1 -1
- package/dist/chunks/autofillSync.B_LuRBKI.js +8 -0
- package/dist/components/MazInput.js +1 -1
- package/dist/components/MazInputNumber.js +1 -1
- package/dist/components/MazInputPhoneNumber/PhoneInput.js +1 -1
- package/dist/components/MazInputPhoneNumber.js +1 -1
- package/dist/components/MazInputPrice.js +1 -1
- package/dist/components/MazInputTags.js +1 -1
- package/dist/components/MazSelect.js +1 -1
- package/dist/components/MazSelectCountry.js +1 -1
- package/dist/components/MazTextarea.js +1 -1
- package/dist/components/index.js +1 -1
- package/dist/utils/autofillSync.d.ts +7 -0
- package/package.json +7 -7
- package/dist/assets/MazInput.CsWp2Ijb.css +0 -2
- package/dist/assets/MazTextarea.DYOLW1ej.css +0 -2
- package/dist/chunks/MazInput.CDKs42ml.js +0 -1
- package/dist/chunks/MazTextarea.VagTSXAo.js +0 -1
- package/dist/chunks/autofillSync.CsX6Qzf_.js +0 -8
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */
|
|
2
|
+
.m-input[data-v-2e5d0e6c]{--maz-input-color:oklch(from var(--m-input-tint-bg) clamp(0, calc(l + .32), 1) calc(c * .35) h)}.m-input-wrapper-input.--xl[data-v-2e5d0e6c]{block-size:calc(4rem - (var(--maz-border-width) * 2))}.m-input-wrapper-input.--lg[data-v-2e5d0e6c]{block-size:calc(3.5rem - (var(--maz-border-width) * 2))}.m-input-wrapper-input.--md[data-v-2e5d0e6c]{block-size:calc(3rem - (var(--maz-border-width) * 2))}.m-input-wrapper-input.--sm[data-v-2e5d0e6c]{block-size:calc(2.5rem - (var(--maz-border-width) * 2))}.m-input-wrapper-input.--xs[data-v-2e5d0e6c]{block-size:calc(2rem - (var(--maz-border-width) * 2))}.m-input-wrapper-input.--mini[data-v-2e5d0e6c]{block-size:calc(1.5rem - (var(--maz-border-width) * 2))}.m-input-input[data-v-2e5d0e6c]{transition:padding .2s cubic-bezier(0,0,.2,1)}.m-input-input[data-v-2e5d0e6c]::placeholder{color:var(--maz-color-muted,var(--maz-muted))}.m-input-label[data-v-2e5d0e6c]{transition:transform .2s cubic-bezier(0,0,.2,1)}.m-input.--always-up .m-input-label[data-v-2e5d0e6c],.m-input.--has-placeholder .m-input-label[data-v-2e5d0e6c],.m-input .m-input-input:not(:placeholder-shown)~.m-input-label[data-v-2e5d0e6c]{font-size:var(--maz-text-xs,.75rem);line-height:var(--tw-leading,var(--maz-text-xs--line-height,calc(1 / .75)));transform:translateY(-1em)}.m-input .m-input-input:-webkit-autofill~.m-input-label[data-v-2e5d0e6c]{font-size:var(--maz-text-xs,.75rem);line-height:var(--tw-leading,var(--maz-text-xs--line-height,calc(1 / .75)));transform:translateY(-1em)}.m-input.--always-up .m-input-input[data-v-2e5d0e6c],.m-input.--has-placeholder.--has-label .m-input-input[data-v-2e5d0e6c],.m-input.--has-label .m-input-input[data-v-2e5d0e6c]:not(:placeholder-shown){padding-top:calc(var(--maz-space) * 4)}.m-input.--has-label .m-input-input[data-v-2e5d0e6c]:-webkit-autofill{padding-top:calc(var(--maz-space) * 4)}.m-input:not(.--has-state) .m-input-wrapper[data-v-2e5d0e6c]{color:var(--maz-color-muted,var(--maz-muted))}.m-input.--has-z-2 .m-input-wrapper[data-v-2e5d0e6c]{z-index:2}.m-input.--is-readonly .m-input-input[data-v-2e5d0e6c]{cursor:default}.m-input:has(input:disabled) .m-input-wrapper[data-v-2e5d0e6c]{background-color:var(--maz-color-surface-600,oklch(from var(--maz-surface) clamp(0, calc(l - .05), 1) c h));color:var(--maz-color-muted,var(--maz-muted))}.m-input:has(input:disabled) .m-input-wrapper[data-v-2e5d0e6c]:where(.dark,.dark *){background-color:var(--maz-color-surface-300,oklch(from var(--maz-surface) clamp(0, calc(l + .13), 1) c h))}.m-input:has(input:disabled) .m-input-input[data-v-2e5d0e6c]{cursor:var(--maz-disabled-cursor);color:var(--maz-color-muted,var(--maz-muted))}.m-input .m-input-wrapper[data-v-2e5d0e6c]:focus-within,.m-input.--border-active .m-input-wrapper[data-v-2e5d0e6c]{z-index:3}.m-input.--primary .m-input-wrapper[data-v-2e5d0e6c]:focus-within,.m-input.--primary.--border-active .m-input-wrapper[data-v-2e5d0e6c]{border-color:var(--maz-color-primary,var(--maz-primary))}.m-input.--secondary .m-input-wrapper[data-v-2e5d0e6c]:focus-within,.m-input.--secondary.--border-active .m-input-wrapper[data-v-2e5d0e6c]{border-color:var(--maz-color-secondary,var(--maz-secondary))}.m-input.--accent .m-input-wrapper[data-v-2e5d0e6c]:focus-within,.m-input.--accent.--border-active .m-input-wrapper[data-v-2e5d0e6c]{border-color:var(--maz-color-accent,var(--maz-accent))}.m-input.--info .m-input-wrapper[data-v-2e5d0e6c]:focus-within,.m-input.--info.--border-active .m-input-wrapper[data-v-2e5d0e6c]{border-color:var(--maz-color-info,var(--maz-info))}.m-input.--success .m-input-wrapper[data-v-2e5d0e6c]:focus-within,.m-input.--success.--border-active .m-input-wrapper[data-v-2e5d0e6c]{border-color:var(--maz-color-success,var(--maz-success))}.m-input.--warning .m-input-wrapper[data-v-2e5d0e6c]:focus-within,.m-input.--warning.--border-active .m-input-wrapper[data-v-2e5d0e6c]{border-color:var(--maz-color-warning,var(--maz-warning))}.m-input.--destructive .m-input-wrapper[data-v-2e5d0e6c]:focus-within,.m-input.--destructive.--border-active .m-input-wrapper[data-v-2e5d0e6c]{border-color:var(--maz-color-destructive,var(--maz-destructive))}.m-input.--contrast .m-input-wrapper[data-v-2e5d0e6c]:focus-within,.m-input.--contrast.--border-active .m-input-wrapper[data-v-2e5d0e6c]{border-color:var(--maz-color-contrast,var(--maz-contrast))}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */
|
|
2
|
+
@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){[data-v-6f0a6f64],[data-v-6f0a6f64]:before,[data-v-6f0a6f64]:after{--tw-leading:initial}[data-v-6f0a6f64]::backdrop{--tw-leading:initial}}}.m-textarea.--has-placeholder.--has-label textarea[data-v-6f0a6f64]{padding-block-start:.875rem}.m-textarea.--has-label:has(textarea:not(:placeholder-shown)) textarea[data-v-6f0a6f64]{padding-block-start:.875rem}.m-textarea.--has-label:has(textarea:-webkit-autofill) textarea[data-v-6f0a6f64]{padding-block-start:.875rem}.m-textarea__append[data-v-6f0a6f64]{justify-content:var(--append-justify)}.m-textarea textarea[data-v-6f0a6f64]{--tw-outline-style:none;background-color:#0000;outline-style:none;width:100%}@media (forced-colors:active){.m-textarea textarea[data-v-6f0a6f64]{outline-offset:2px;outline:2px solid #0000}}.m-textarea textarea[data-v-6f0a6f64]{transition:padding .2s cubic-bezier(0,0,.2,1)}.m-textarea textarea.--has-append[data-v-6f0a6f64]{padding-bottom:calc(var(--maz-space) * 4)}.m-textarea.--is-disabled[data-v-6f0a6f64] *{cursor:var(--maz-disabled-cursor);color:var(--maz-color-muted,var(--maz-muted))}.m-textarea.--is-disabled>label[data-v-6f0a6f64]{color:var(--maz-color-gray-300,#d1d5dc)}@supports (color:lab(0% 0 0)){.m-textarea.--is-disabled>label[data-v-6f0a6f64]{color:var(--maz-color-gray-300,lab(85.1236% -.612259 -3.7138))}}.m-textarea.--is-disabled>label[data-v-6f0a6f64]:where(.dark,.dark *){color:var(--maz-color-gray-600,#4a5565)}@supports (color:lab(0% 0 0)){.m-textarea.--is-disabled>label[data-v-6f0a6f64]:where(.dark,.dark *){color:var(--maz-color-gray-600,lab(35.6337% -1.58697 -10.8425))}}.m-textarea__label[data-v-6f0a6f64]{pointer-events:none;transform-origin:0 0;text-overflow:ellipsis;white-space:nowrap;width:max-content;top:calc(var(--maz-space) * 3);left:calc(var(--maz-space) * 4);--tw-leading:calc(var(--maz-space) * 6);line-height:calc(var(--maz-space) * 6);justify-content:center;align-items:center;transition:transform .2s cubic-bezier(0,0,.2,1);display:flex;position:absolute;overflow:hidden}.m-textarea__label[data-v-6f0a6f64]:not(.--has-state){color:var(--maz-color-muted,var(--maz-muted))}.m-textarea.--has-placeholder .m-textarea__label[data-v-6f0a6f64]{transform:scale(.8)translateY(-.65rem)}.m-textarea:has(textarea:not(:placeholder-shown)) .m-textarea__label[data-v-6f0a6f64]{transform:scale(.8)translateY(-.65rem)}.m-textarea:has(textarea:-webkit-autofill) .m-textarea__label[data-v-6f0a6f64]{transform:scale(.8)translateY(-.65rem)}.m-textarea.--primary[data-v-6f0a6f64]:focus-within{border-color:var(--maz-color-primary,var(--maz-primary))}.m-textarea.--secondary[data-v-6f0a6f64]:focus-within{border-color:var(--maz-color-secondary,var(--maz-secondary))}.m-textarea.--accent[data-v-6f0a6f64]:focus-within{border-color:var(--maz-color-accent,var(--maz-accent))}.m-textarea.--info[data-v-6f0a6f64]:focus-within{border-color:var(--maz-color-info,var(--maz-info))}.m-textarea.--success[data-v-6f0a6f64]:focus-within{border-color:var(--maz-color-success,var(--maz-success))}.m-textarea.--warning[data-v-6f0a6f64]:focus-within{border-color:var(--maz-color-warning,var(--maz-warning))}.m-textarea.--destructive[data-v-6f0a6f64]:focus-within{border-color:var(--maz-color-destructive,var(--maz-destructive))}.m-textarea.--contrast[data-v-6f0a6f64]:focus-within{border-color:var(--maz-color-contrast,var(--maz-contrast))}.m-textarea.--autogrow textarea[data-v-6f0a6f64]{resize:none;field-sizing:content;min-block-size:3lh}.m-textarea:not(.--autogrow) textarea[data-v-6f0a6f64]{resize:vertical}@property --tw-leading{syntax:"*";inherits:false}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{useInstanceUniqId}from"../composables/useInstanceUniqId.js";import{t as hasSlotContent}from"./hasSlotContent.BLn0kQC7.js";import{t as _plugin_vue_export_helper_default}from"./_plugin-vue_export-helper.ChmETRGw.js";import{useMazIconProps}from"../composables/useMazIconProps.js";import{n as readInitialAutofillValue,t as onAutofillSync}from"./autofillSync.B_LuRBKI.js";import{computed,createBlock,createCommentVNode,createElementBlock,createElementVNode,createVNode,defineAsyncComponent,defineComponent,mergeProps,normalizeClass,normalizeStyle,onBeforeUnmount,onMounted,openBlock,ref,renderSlot,toDisplayString,toHandlers,unref,useSlots,vModelDynamic,withCtx,withDirectives,withModifiers}from"vue";import{debounce}from"@maz-ui/utils/helpers/debounce";import{MazEye}from"@maz-ui/icons/lazy/MazEye";import{MazEyeSlash}from"@maz-ui/icons/lazy/MazEyeSlash";import '../assets/MazInput.CxBl5eb8.css';var _hoisted_1=[`for`];var _hoisted_2={key:0,class:`m-input-wrapper-start maz:relative maz:z-1 maz:flex maz:flex-center maz:space-x-1 maz:py-1 maz:ps-2`};var _hoisted_3=[`id`,`placeholder`,`aria-label`,`type`,`inputmode`,`name`,`autocomplete`,`disabled`,`readonly`,`required`];var _hoisted_4={key:1,class:`m-input-wrapper-end maz:relative maz:z-1 maz:flex maz:flex-center maz:space-x-1 maz:py-1 maz:pe-2`};var MazInput_default=_plugin_vue_export_helper_default(defineComponent({inheritAttrs:!1,__name:`MazInput`,props:{style:{type:[Boolean,null,String,Object,Array]},class:{type:[Boolean,null,String,Object,Array]},modelValue:{},placeholder:{},label:{},topLabel:{},assistiveText:{},color:{default:`primary`},type:{default:`text`},required:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},readonly:{type:Boolean},id:{},error:{type:Boolean,default:!1},success:{type:Boolean,default:!1},warning:{type:Boolean,default:!1},hint:{},inputClasses:{},border:{type:Boolean,default:!0},inputmode:{default:`text`},size:{default:`md`},debounce:{type:[Boolean,Number],default:!1},autoFocus:{type:Boolean,default:!1},borderActive:{type:Boolean,default:!1},startIcon:{type:[String,Function,Object]},endIcon:{type:[String,Function,Object]},roundedSize:{default:`md`},block:{type:Boolean},name:{},autocomplete:{},loading:{type:Boolean,default:!1}},emits:[`update:model-value`,`focus`,`blur`,`click`,`change`,`input`],setup(__props,{emit:__emit}){let emits=__emit;let MazIcon=defineAsyncComponent(()=>import(`../components/MazIcon.js`));let MazBtn=defineAsyncComponent(()=>import(`../components/MazBtn.js`));let MazSpinner=defineAsyncComponent(()=>import(`../components/MazSpinner.js`));let{iconProps:startIconProps}=useMazIconProps(()=>__props.startIcon);let{iconProps:endIconProps}=useMazIconProps(()=>__props.endIcon);let hasPasswordVisible=ref(!1);let input=ref();let instanceId=useInstanceUniqId({componentName:`MazInput`,providedId:__props.id});let initialAutofillValue=readInitialAutofillValue(instanceId.value);let autofillCleanup;onMounted(()=>{__props.autoFocus&&input.value?.focus(),input.value&&(initialAutofillValue&&input.value.value!==initialAutofillValue&&(input.value.value=initialAutofillValue,initialAutofillValue!==__props.modelValue&&emits(`update:model-value`,initialAutofillValue)),autofillCleanup=onAutofillSync(input.value,value=>{value!==__props.modelValue&&emits(`update:model-value`,value)}))}),onBeforeUnmount(()=>{autofillCleanup?.()});let isPasswordType=computed(()=>__props.type===`password`);let inputType=computed(()=>hasPasswordVisible.value?`text`:__props.type);let borderStyle=computed(()=>{if(__props.border)return __props.error?`maz:border-destructive`:__props.success?`maz:border-success`:__props.warning?`maz:border-warning`:`--default-border maz:border-divider maz:dark:border-divider-400`});let slots=useSlots();let debounceEmitValue=debounce(value=>{emits(`update:model-value`,value)},typeof __props.debounce==`number`?__props.debounce:500);function emitValue(value){if(__props.debounce)return debounceEmitValue(value);emits(`update:model-value`,value)}let model=computed({get:()=>__props.modelValue,set:value=>emitValue(value)});let hasLabel=computed(()=>!!__props.label||!!__props.hint);let alwaysUp=computed(()=>[`date`,`month`,`week`].includes(__props.type));function hasEndPart(){return hasSlotContent(slots[`end-icon`])||isPasswordType.value||!!__props.endIcon||__props.loading}function hasStartPart(){return hasSlotContent(slots[`start-icon`])||!!__props.startIcon}function focus(event){emits(`focus`,event)}function blur(event){emits(`blur`,event)}function change(event){return emits(`change`,event)}function emitInputEvent(event){return emits(`input`,event)}let stateColor=computed(()=>{if(__props.error)return`maz:text-destructive-600!`;if(__props.success)return`maz:text-success-600!`;if(__props.warning)return`maz:text-warning-600!`});let ROUNDED_CLASS={none:``,sm:`maz:rounded-xs`,md:`maz:rounded-md`,lg:`maz:rounded-lg`,xl:`maz:rounded-xl`,full:`maz:rounded-full`};let CHILD_TEXT_SIZE_CLASS={xl:`maz:text-xl`,lg:`maz:text-lg`,md:``,sm:`maz:text-sm`,xs:`maz:text-xs`,mini:`maz:text-xs`};return(_ctx,_cache)=>(openBlock(),createElementBlock(`div`,{class:normalizeClass([`m-input m-reset-css maz:inline-flex maz:h-fit maz:flex-col maz:items-start maz:align-top maz:text-foreground`,[{"--border-active":__props.borderActive,"--always-up":alwaysUp.value,"--has-placeholder":!!__props.placeholder,"--has-label":hasLabel.value,"--is-readonly":__props.readonly,"--has-z-2":__props.error||__props.warning||__props.success,"--has-state":__props.error||__props.warning||__props.success,"--block":__props.block,"maz:w-full":__props.block},__props.class,`--${__props.color}`]]),style:normalizeStyle([__props.style,{"--m-input-tint-bg":`var(--maz-${__props.color})`}])},[__props.topLabel?(openBlock(),createElementBlock(`label`,{key:0,for:unref(instanceId),class:normalizeClass([`m-input-top-label maz:mb-2`,stateColor.value]),style:{fontWeight:`var(--maz-input-top-label-font-weight, 600)`}},toDisplayString(__props.topLabel),11,_hoisted_1)):createCommentVNode(``,!0),createElementVNode(`div`,{class:normalizeClass([`m-input-wrapper maz:relative maz:z-1 maz:flex maz:size-full maz:flex-1 maz:overflow-hidden maz:bg-input maz:transition-colors maz:duration-300`,[__props.inputClasses,borderStyle.value,ROUNDED_CLASS[__props.roundedSize],`--rounded-${__props.roundedSize}`,{"--block":__props.block,"--border":__props.border,"maz:w-full":__props.block,"maz:border maz:border-solid":__props.border}]])},[hasStartPart()?(openBlock(),createElementBlock(`div`,_hoisted_2,[unref(hasSlotContent)(unref(slots)[`start-icon`])||__props.startIcon?renderSlot(_ctx.$slots,`start-icon`,{key:0},()=>[unref(startIconProps)?(openBlock(),createBlock(unref(MazIcon),mergeProps({key:0},unref(startIconProps),{class:[`maz:text-xl`,stateColor.value||`maz:text-muted`]}),null,16,[`class`])):createCommentVNode(``,!0)],!0):createCommentVNode(``,!0)])):createCommentVNode(``,!0),createElementVNode(`div`,{class:normalizeClass([`m-input-wrapper-input maz:relative maz:flex maz:w-full maz:max-w-full maz:flex-1 maz:items-center`,[`--${__props.size}`,{"--top-label":!!__props.topLabel,"--has-start-icon":hasStartPart(),"--has-end-icon":hasEndPart()}]])},[withDirectives(createElementVNode(`input`,mergeProps({id:unref(instanceId)},_ctx.$attrs,{ref_key:`input`,ref:input,"onUpdate:modelValue":_cache[0]||=$event=>model.value=$event,placeholder:__props.placeholder||` `,"aria-label":__props.label||__props.placeholder,type:inputType.value,inputmode:__props.inputmode,name:__props.name,autocomplete:__props.autocomplete,disabled:__props.disabled,readonly:__props.readonly,required:__props.required,class:[`m-input-input maz:m-0 maz:size-full maz:appearance-none maz:truncate maz:border-none maz:bg-transparent maz:px-4 maz:py-0 maz:text-foreground maz:shadow-none maz:outline-hidden`,[CHILD_TEXT_SIZE_CLASS[__props.size],{"maz:ps-2!":hasStartPart(),"maz:pe-2!":hasEndPart()}]]},toHandlers({blur,focus,change,input:emitInputEvent},!0),{onClick:_cache[1]||=$event=>_ctx.$emit(`click`,$event)}),null,16,_hoisted_3),[[vModelDynamic,model.value]]),__props.label||__props.hint?(openBlock(),createElementBlock(`span`,{key:0,class:normalizeClass([`m-input-label maz:pointer-events-none maz:absolute maz:inset-s-4 maz:w-full maz:origin-top-left maz:items-center maz:truncate maz:overflow-hidden maz:text-start maz:leading-6 maz:whitespace-nowrap`,[stateColor.value,CHILD_TEXT_SIZE_CLASS[__props.size],{"maz:inset-s-2!":hasStartPart(),"maz:pe-3!":hasLabel.value}]])},toDisplayString(__props.hint||__props.label),3)):createCommentVNode(``,!0)],2),hasEndPart()?(openBlock(),createElementBlock(`div`,_hoisted_4,[unref(hasSlotContent)(unref(slots)[`end-icon`])||__props.endIcon?renderSlot(_ctx.$slots,`end-icon`,{key:0},()=>[unref(endIconProps)?(openBlock(),createBlock(unref(MazIcon),mergeProps({key:0},unref(endIconProps),{class:[`maz:text-xl`,stateColor.value||`maz:text-muted`]}),null,16,[`class`])):createCommentVNode(``,!0)],!0):createCommentVNode(``,!0),isPasswordType.value?(openBlock(),createBlock(unref(MazBtn),{key:1,color:`transparent`,tabindex:`-1`,size:`mini`,onClick:_cache[2]||=withModifiers($event=>hasPasswordVisible.value=!hasPasswordVisible.value,[`stop`])},{default:withCtx(()=>[hasPasswordVisible.value?(openBlock(),createBlock(unref(MazEyeSlash),{key:0,class:`maz:text-xl maz:text-muted`})):(openBlock(),createBlock(unref(MazEye),{key:1,class:`maz:text-xl maz:text-muted`}))]),_:1})):createCommentVNode(``,!0),__props.loading?renderSlot(_ctx.$slots,`loader`,{key:2},()=>[createVNode(unref(MazSpinner),{color:__props.color},null,8,[`color`])],!0):createCommentVNode(``,!0)])):createCommentVNode(``,!0)],2),__props.assistiveText?(openBlock(),createElementBlock(`div`,{key:1,class:normalizeClass([`m-input-bottom-text maz:mt-1 maz:text-sm`,[{"maz:text-destructive-600":__props.error,"maz:text-success-600":__props.success,"maz:text-warning-600":__props.warning,"maz:text-muted":!__props.error&&!__props.success&&!__props.warning}]])},toDisplayString(__props.assistiveText),3)):createCommentVNode(``,!0)],6))}}),[[`__scopeId`,`data-v-2e5d0e6c`]]);export{MazInput_default as t};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{useInstanceUniqId}from"../composables/useInstanceUniqId.js";import{t as _plugin_vue_export_helper_default}from"./_plugin-vue_export-helper.ChmETRGw.js";import{t as MazIcon_default}from"./MazIcon.BKcg5YfP.js";import{t as MazInput_default}from"./MazInput.
|
|
1
|
+
import{useInstanceUniqId}from"../composables/useInstanceUniqId.js";import{t as _plugin_vue_export_helper_default}from"./_plugin-vue_export-helper.ChmETRGw.js";import{t as MazIcon_default}from"./MazIcon.BKcg5YfP.js";import{t as MazInput_default}from"./MazInput.C5wxW29_.js";import{computed,createBlock,createCommentVNode,createElementBlock,createElementVNode,createVNode,defineAsyncComponent,defineComponent,mergeProps,normalizeClass,normalizeStyle,openBlock,toDisplayString,unref,withCtx,withKeys,withModifiers}from"vue";import{throttle}from"@maz-ui/utils/helpers/throttle";import{MazMinus}from"@maz-ui/icons/raw/MazMinus";import{MazPlus}from"@maz-ui/icons/raw/MazPlus";import '../assets/MazInputNumber.CkY2X-Br.css';var _hoisted_1=[`for`];var _hoisted_2={class:`m-input-number__wrapper maz:flex maz:items-center maz:align-top`};var MazInputNumber_default=_plugin_vue_export_helper_default(defineComponent({inheritAttrs:!1,__name:`MazInputNumber`,props:{id:{default:()=>void 0},style:{type:[Boolean,null,String,Object,Array],default:()=>void 0},class:{type:[Boolean,null,String,Object,Array],default:()=>void 0},modelValue:{default:()=>void 0},disabled:{type:Boolean,default:!1},max:{default:()=>1/0},min:{default:()=>-1/0},step:{default:1},size:{default:`md`},hideButtons:{type:Boolean},textCenter:{type:Boolean,default:!0},inputmode:{default:`numeric`},block:{type:Boolean},error:{type:Boolean,default:!1},hint:{},success:{type:Boolean,default:!1},warning:{type:Boolean,default:!1},inputProps:{},topLabel:{default:()=>void 0}},emits:[`update:model-value`,`focus`,`blur`,`click`,`change`],setup(__props,{emit:__emit}){let emits=__emit;let instanceId=useInstanceUniqId({componentName:`MazInput`,providedId:__props.id});let MazBtn=defineAsyncComponent(()=>import(`../components/MazBtn.js`));let currentValue=computed({get:()=>__props.modelValue,set:value=>emitValue(value)});function findClosestStep(number){return Math.round(number/__props.step)*__props.step}function checkValue(value){if(typeof value==`number`)return value<=__props.min?__props.min:value>=__props.max?__props.max:findClosestStep(value)}let emitThrottled=throttle(value=>emitValue(value),300);function emitValue(newValue){newValue=checkValue(newValue),currentValue.value!==newValue&&emits(`update:model-value`,newValue)}emitValue(currentValue.value);let incrementDisabled=computed(()=>__props.modelValue&&__props.modelValue>=__props.max);let decrementDisabled=computed(()=>__props.modelValue&&__props.modelValue<=__props.min);function increment(){if(!(__props.disabled||incrementDisabled.value)){if((currentValue.value===void 0||currentValue.value===null)&&Number.isFinite(__props.min)){currentValue.value=__props.min;return}currentValue.value=(currentValue.value??0)+1*__props.step}}function decrement(){if(!(__props.disabled||decrementDisabled.value)){if((currentValue.value===void 0||currentValue.value===null)&&Number.isFinite(__props.min)){currentValue.value=__props.min;return}currentValue.value=(currentValue.value??0)-1*__props.step}}let stateColor=computed(()=>{if(__props.error)return`maz:text-destructive-600!`;if(__props.success)return`maz:text-success-600!`;if(__props.warning)return`maz:text-warning-600!`});return(_ctx,_cache)=>(openBlock(),createElementBlock(`div`,{class:normalizeClass([`m-input-number m-reset-css maz:inline-flex maz:flex-col maz:gap-2`,[`m-input-number--${__props.size}`,__props.class,{"--block":__props.block,"maz:w-full":__props.block}]]),style:normalizeStyle(__props.style)},[__props.topLabel?(openBlock(),createElementBlock(`label`,{key:0,for:unref(instanceId),class:normalizeClass([`m-input-number__top-label`,stateColor.value]),style:{fontWeight:`var(--maz-input-top-label-font-weight, 600)`}},toDisplayString(__props.topLabel),11,_hoisted_1)):createCommentVNode(``,!0),createElementVNode(`div`,_hoisted_2,[__props.hideButtons?createCommentVNode(``,!0):(openBlock(),createBlock(unref(MazBtn),{key:0,color:`transparent`,size:__props.size,class:`m-input-number__button m-input-number__decrement-button`,disabled:decrementDisabled.value||__props.disabled,onClick:decrement},{default:withCtx(()=>[createVNode(MazIcon_default,{icon:unref(MazMinus),class:`m-input-number__button__icon maz:text-base`},null,8,[`icon`])]),_:1},8,[`size`,`disabled`])),createVNode(MazInput_default,mergeProps({..._ctx.$attrs,...__props.inputProps},{id:unref(instanceId),"model-value":currentValue.value,type:`number`,class:[`m-input-number__input`,{"--no-buttons":__props.hideButtons,"--text-center":__props.textCenter}],disabled:__props.disabled,min:__props.min,max:__props.max,step:__props.step,error:__props.error,success:__props.success,warning:__props.warning,hint:__props.hint,inputmode:__props.inputmode,size:__props.size,block:``,onKeydown:[withKeys(withModifiers(increment,[`prevent`]),[`up`]),withKeys(withModifiers(decrement,[`prevent`]),[`down`])],onFocus:_cache[0]||=$event=>_ctx.$emit(`focus`,$event),onChange:_cache[1]||=$event=>_ctx.$emit(`change`,$event),onBlur:_cache[2]||=$event=>_ctx.$emit(`blur`,$event),onClick:_cache[3]||=$event=>_ctx.$emit(`click`,$event),"onUpdate:modelValue":_cache[4]||=$event=>unref(emitThrottled)($event)}),null,16,[`id`,`model-value`,`class`,`disabled`,`min`,`max`,`step`,`error`,`success`,`warning`,`hint`,`inputmode`,`size`,`onKeydown`]),__props.hideButtons?createCommentVNode(``,!0):(openBlock(),createBlock(unref(MazBtn),{key:1,color:`transparent`,size:__props.size,class:`m-input-number__button m-input-number__increment-button`,disabled:incrementDisabled.value||__props.disabled,onClick:increment},{default:withCtx(()=>[createVNode(MazIcon_default,{icon:unref(MazPlus),class:`m-input-number__button__icon maz:text-base`},null,8,[`icon`])]),_:1},8,[`size`,`disabled`]))])],6))}}),[[`__scopeId`,`data-v-f058d45d`]]);export{MazInputNumber_default as t};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{useInstanceUniqId}from"../composables/useInstanceUniqId.js";import{t as _plugin_vue_export_helper_default}from"./_plugin-vue_export-helper.ChmETRGw.js";import{t as MazSelectCountry_default}from"./MazSelectCountry.DonkdtGq.js";import{n as useMazInputPhoneNumber,r as useLibphonenumber,t as PhoneInput_default}from"./PhoneInput._D4UIQzs.js";import{computed,createBlock,createCommentVNode,createElementBlock,createElementVNode,createVNode,defineComponent,mergeProps,nextTick,normalizeClass,normalizeStyle,onBeforeMount,onMounted,openBlock,provide,ref,renderSlot,toDisplayString,unref,watch,withCtx}from"vue";import{useTranslations}from"@maz-ui/translations/composables/useTranslations";import '../assets/MazInputPhoneNumber.DJpbK7FY.css';var _hoisted_1=[`id`];var _hoisted_2=[`for`];var _hoisted_3={class:`m-input-phone-number__country-list-code maz:min-w-8 maz:text-center maz:text-muted`};var MazInputPhoneNumber_default=_plugin_vue_export_helper_default(defineComponent({name:`MazInputPhoneNumber`,inheritAttrs:!1,__name:`MazInputPhoneNumber`,props:{style:{type:[Boolean,null,String,Object,Array]},class:{type:[Boolean,null,String,Object,Array]},modelValue:{default:()=>void 0},countryCode:{default:()=>void 0},id:{default:()=>void 0},placeholder:{default:()=>void 0},topLabel:{},label:{},preferredCountries:{default:()=>void 0},ignoredCountries:{default:()=>void 0},onlyCountries:{default:()=>void 0},translations:{default:()=>void 0},listPosition:{default:`bottom-start`},color:{default:`primary`},size:{default:`md`},hideFlags:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},required:{type:Boolean,default:!1},example:{type:Boolean,default:!0},search:{type:Boolean,default:!0},searchThreshold:{default:.75},useBrowserLocale:{type:Boolean,default:!0},fetchCountry:{type:Boolean,default:()=>void 0},hideCountrySelect:{type:Boolean,default:!1},showCodeInList:{type:Boolean,default:!1},customCountriesList:{default:()=>void 0},autoFormat:{type:[String,Boolean],default:`blur`},countryLocale:{default:()=>void 0},validationError:{type:Boolean,default:!0},validationSuccess:{type:Boolean,default:!0},success:{type:Boolean,default:!1},error:{type:Boolean,default:!1},warning:{type:Boolean,default:!1},displayCountryName:{type:Boolean,default:!1},block:{type:Boolean,default:!1},orientation:{default:`responsive`},countrySelectAttributes:{default:()=>({name:`country`,autocomplete:`off`,style:{width:`14rem`}})},phoneInputAttributes:{default:()=>({name:`phone`,autocomplete:`tel`,inputmode:`tel`})},assistiveText:{default:()=>void 0},hint:{default:()=>void 0}},emits:[`update:model-value`,`country-code`,`update:country-code`,`data`],setup(__props,{emit:__emit}){let emits=__emit;let{fetchCountryCode,getBrowserLocale,getCountryList}=useMazInputPhoneNumber();let{isCountryAvailable,getPhoneNumberResults}=useLibphonenumber();let instanceId=useInstanceUniqId({componentName:`MazInputPhoneNumber`,providedId:__props.id});let phoneNumber=ref();let selectedCountry=ref();let{t}=useTranslations();let messages=computed(()=>({countrySelect:{error:__props.translations?.countrySelect?.error||t(`inputPhoneNumber.countrySelect.error`),placeholder:__props.translations?.countrySelect?.placeholder||t(`inputPhoneNumber.countrySelect.placeholder`),searchPlaceholder:__props.translations?.countrySelect?.searchPlaceholder||t(`inputPhoneNumber.countrySelect.searchPlaceholder`)},phoneInput:{placeholder:__props.translations?.phoneInput?.placeholder||t(`inputPhoneNumber.phoneInput.placeholder`),example:__props.translations?.phoneInput?.example}}));let isPhoneNumberInternalUpdate=ref(!1);let isCountryInternalUpdate=ref(!1);let results=ref({isValid:!1,countryCode:__props.countryCode,phoneNumber:__props.modelValue});let PhoneInputRef=ref();onBeforeMount(async()=>{if(__props.countryCode&&!selectedCountry.value&&onCountryChanged({countryCode:__props.countryCode}),__props.fetchCountry&&!selectedCountry.value){let{data:countryCode,error}=await fetchCountryCode();if(error){console.error(`[MazInputPhoneNumber](onBeforeMount) Error while fetching country code - ${error.message}`);return}onCountryChanged({countryCode})}}),onMounted(()=>{if(!selectedCountry.value&&__props.useBrowserLocale){let countryCode=getBrowserLocale()?.locale;countryCode&&isCountryAvailable(countryCode)&&onCountryChanged({countryCode})}});function updateTheResults({phone=phoneNumber.value||__props.modelValue,countryCode=selectedCountry.value,checkCountryCode=!1}){results.value=getPhoneNumberResults({phoneNumber:phone,countryCode,checkCountryCode})}async function selectPhoneNumberInput(){await nextTick(),setTimeout(()=>{PhoneInputRef.value?.focus()},100)}function setSelectedCountry(countryCode){if(countryCode){if(!isCountryAvailable(countryCode)){console.warn(`[MazInputPhoneNumber] Country code not available: "${countryCode}"`),selectedCountry.value=void 0;return}selectedCountry.value=countryCode}}let isLetterRegex=/\D/g;function onPhoneNumberChanged({newPhoneNumber}){updateTheResults({phone:newPhoneNumber}),results.value.parsedCountryCode&&results.value.parsedCountryCode!==selectedCountry.value&&onCountryChanged({countryCode:results.value.parsedCountryCode,updateResults:!1}),results.value.isValid&&(__props.autoFormat===`blur`||__props.autoFormat===`typing`)?phoneNumber.value=results.value.formatNational?.trim().replaceAll(isLetterRegex,``):phoneNumber.value=newPhoneNumber,isPhoneNumberInternalUpdate.value=!0,results.value.e164?emits(`update:model-value`,results.value.e164):emits(`update:model-value`,results.value.phoneNumber),setTimeout(()=>{isPhoneNumberInternalUpdate.value=!1},0)}function onCountryChanged({countryCode,updateResults=!0,selectPhoneNumber=!1}){if(!countryCode){selectedCountry.value=void 0;return}isCountryInternalUpdate.value=!0,countryCode!==selectedCountry.value&&setSelectedCountry(countryCode),updateResults&&updateTheResults({countryCode:selectedCountry.value,checkCountryCode:!0});let code=selectedCountry.value;emits(`country-code`,code),emits(`update:country-code`,code),selectPhoneNumber&&!results.value.isValid&&selectPhoneNumberInput(),setTimeout(()=>{isCountryInternalUpdate.value=!1},0)}let countriesList=computed(()=>{let list=getCountryList(__props.countryLocale,__props.customCountriesList);return __props.onlyCountries&&(list=list?.filter(country=>__props.onlyCountries?.includes(country.code))),__props.ignoredCountries&&(list=list?.filter(country=>!__props.ignoredCountries?.includes(country.code))),__props.preferredCountries&&(list=list?.sort((a,b)=>{let indexA=__props.preferredCountries?.indexOf(a.code)??-1;let indexB=__props.preferredCountries?.indexOf(b.code)??-1;return indexA>=0&&indexB>=0?indexA-indexB:indexA>=0?-1:+(indexB>=0)})),list??[]});watch(()=>__props.modelValue,(value,oldValue)=>{!isPhoneNumberInternalUpdate.value&&value!==oldValue&&value!==phoneNumber.value&&onPhoneNumberChanged({newPhoneNumber:value})},{immediate:!0}),watch(()=>__props.countryCode,(value,oldValue)=>{!isCountryInternalUpdate.value&&value&&value!==oldValue&&value!==selectedCountry.value&&onCountryChanged({countryCode:value})},{immediate:!0}),watch(results,value=>emits(`data`,value),{immediate:!0});let countryState=computed(()=>({error:__props.error||(__props.validationError?!!phoneNumber.value&&!selectedCountry.value:!1),success:__props.success||(__props.validationSuccess?results.value?.isValid:!1)}));let phoneState=computed(()=>({error:__props.error||(__props.validationError?!!phoneNumber.value&&!results.value?.isValid:!1),success:__props.success||(__props.validationSuccess?results.value.isValid:!1)}));let stateLabelColor=computed(()=>[{"maz:text-destructive-600":countryState.value.error||phoneState.value.error,"maz:text-success-600":countryState.value.success&&phoneState.value.success,"maz:text-warning-600":__props.warning}]);let assistiveTextStateColor=computed(()=>[{"maz:text-destructive-600":countryState.value.error||phoneState.value.error,"maz:text-success-600":countryState.value.success&&phoneState.value.success,"maz:text-warning-600":__props.warning,"maz:text-muted":!(countryState.value.error||phoneState.value.error)&&!(countryState.value.success&&phoneState.value.success)&&!__props.warning}]);return provide(`mazInputPhoneNumberData`,{selectedCountry,phoneNumber,results}),(_ctx,_cache)=>(openBlock(),createElementBlock(`div`,{id:unref(instanceId),class:normalizeClass([`m-input-phone-number m-reset-css maz:relative maz:inline-flex maz:flex-col`,[__props.class,{"maz:w-full":__props.block}]]),style:normalizeStyle(__props.style)},[__props.topLabel?(openBlock(),createElementBlock(`label`,{key:0,for:`${unref(instanceId)}-phone`,class:normalizeClass([`m-input-phone-number__top-label maz:mb-2`,stateLabelColor.value]),style:{fontWeight:`var(--maz-input-top-label-font-weight, 600)`}},toDisplayString(__props.topLabel),11,_hoisted_2)):createCommentVNode(``,!0),createElementVNode(`div`,{class:normalizeClass([`maz:flex maz:items-center maz:align-top`,[__props.orientation&&`--${__props.orientation}`,__props.orientation===`col`?`maz:flex-col`:__props.orientation===`row`?`maz:flex-row`:`maz:flex-col maz:mob-l:flex-row`]])},[__props.hideCountrySelect?createCommentVNode(``,!0):(openBlock(),createBlock(MazSelectCountry_default,mergeProps({key:0,id:`${unref(instanceId)}-country`,class:`m-input-phone-number__country-select`},__props.countrySelectAttributes,{"model-value":selectedCountry.value,"option-input-value-key":__props.displayCountryName?`name`:`dialCode`,color:__props.color,size:__props.size,locale:__props.countryLocale,"countries-list":__props.customCountriesList,"list-position":__props.listPosition,"hide-flags":__props.hideFlags,search:__props.search,block:__props.block,error:__props.error||(__props.validationError?!!phoneNumber.value&&!selectedCountry.value:!1),success:__props.success||(__props.validationSuccess?results.value?.isValid:!1),translations:messages.value.countrySelect,hint:phoneNumber.value&&!selectedCountry.value?messages.value.countrySelect.error:void 0,options:countriesList.value,disabled:__props.disabled,warning:__props.warning,required:__props.required,"search-threshold":__props.searchThreshold,"format-input-value":__props.displayCountryName||!selectedCountry.value?void 0:value=>`+${value}`,"show-code-in-list":__props.showCodeInList,label:messages.value.countrySelect.placeholder,"onUpdate:modelValue":_cache[0]||=$event=>onCountryChanged({countryCode:$event,selectPhoneNumber:!0})}),{"no-results":withCtx(()=>[renderSlot(_ctx.$slots,`no-results`,{},void 0,!0)]),"selector-flag":withCtx(({countryCode:codeCountry})=>[renderSlot(_ctx.$slots,`selector-flag`,{countryCode:codeCountry},void 0,!0)]),"country-list-flag":withCtx(({isSelected,option})=>[renderSlot(_ctx.$slots,`country-list-flag`,{countryCode:option.code,option,isSelected},void 0,!0)]),"country-list-code":withCtx(({option})=>[createElementVNode(`span`,_hoisted_3,` +`+toDisplayString(option.dialCode),1)]),_:3},16,[`id`,`model-value`,`option-input-value-key`,`color`,`size`,`locale`,`countries-list`,`list-position`,`hide-flags`,`search`,`block`,`error`,`success`,`translations`,`hint`,`options`,`disabled`,`warning`,`required`,`search-threshold`,`format-input-value`,`show-code-in-list`,`label`])),createVNode(PhoneInput_default,mergeProps({id:`${unref(instanceId)}-phone`,ref_key:`PhoneInputRef`,ref:PhoneInputRef,class:`m-input-phone-number__phone-input`,"model-value":phoneNumber.value},{..._ctx.$attrs,...__props.phoneInputAttributes},{color:__props.color,size:__props.size,"auto-format":__props.autoFormat,example:__props.example,block:``,disabled:__props.disabled,required:__props.required,warning:__props.warning,hint:__props.hint,name:__props.phoneInputAttributes.name,"has-radius":!__props.hideCountrySelect,success:__props.success||(__props.validationSuccess?results.value.isValid:!1),error:__props.error||(__props.validationError?!!phoneNumber.value&&!results.value.isValid:!1),locales:messages.value.phoneInput,label:__props.label,placeholder:__props.placeholder,"onUpdate:modelValue":_cache[1]||=$event=>onPhoneNumberChanged({newPhoneNumber:$event})}),null,16,[`id`,`model-value`,`color`,`size`,`auto-format`,`example`,`disabled`,`required`,`warning`,`hint`,`name`,`has-radius`,`success`,`error`,`locales`,`label`,`placeholder`])],2),__props.assistiveText?(openBlock(),createElementBlock(`div`,{key:1,class:normalizeClass([`m-input-phone-number__bottom-text maz:mt-1 maz:text-sm`,assistiveTextStateColor.value])},toDisplayString(__props.assistiveText),3)):createCommentVNode(``,!0)],14,_hoisted_1))}}),[[`__scopeId`,`data-v-31c63de8`]]);export{MazInputPhoneNumber_default as t};
|
|
1
|
+
import{useInstanceUniqId}from"../composables/useInstanceUniqId.js";import{t as _plugin_vue_export_helper_default}from"./_plugin-vue_export-helper.ChmETRGw.js";import{t as MazSelectCountry_default}from"./MazSelectCountry.DG9eMPlJ.js";import{n as useMazInputPhoneNumber,r as useLibphonenumber,t as PhoneInput_default}from"./PhoneInput.DXI3UxdG.js";import{computed,createBlock,createCommentVNode,createElementBlock,createElementVNode,createVNode,defineComponent,mergeProps,nextTick,normalizeClass,normalizeStyle,onBeforeMount,onMounted,openBlock,provide,ref,renderSlot,toDisplayString,unref,watch,withCtx}from"vue";import{useTranslations}from"@maz-ui/translations/composables/useTranslations";import '../assets/MazInputPhoneNumber.DJpbK7FY.css';var _hoisted_1=[`id`];var _hoisted_2=[`for`];var _hoisted_3={class:`m-input-phone-number__country-list-code maz:min-w-8 maz:text-center maz:text-muted`};var MazInputPhoneNumber_default=_plugin_vue_export_helper_default(defineComponent({name:`MazInputPhoneNumber`,inheritAttrs:!1,__name:`MazInputPhoneNumber`,props:{style:{type:[Boolean,null,String,Object,Array]},class:{type:[Boolean,null,String,Object,Array]},modelValue:{default:()=>void 0},countryCode:{default:()=>void 0},id:{default:()=>void 0},placeholder:{default:()=>void 0},topLabel:{},label:{},preferredCountries:{default:()=>void 0},ignoredCountries:{default:()=>void 0},onlyCountries:{default:()=>void 0},translations:{default:()=>void 0},listPosition:{default:`bottom-start`},color:{default:`primary`},size:{default:`md`},hideFlags:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},required:{type:Boolean,default:!1},example:{type:Boolean,default:!0},search:{type:Boolean,default:!0},searchThreshold:{default:.75},useBrowserLocale:{type:Boolean,default:!0},fetchCountry:{type:Boolean,default:()=>void 0},hideCountrySelect:{type:Boolean,default:!1},showCodeInList:{type:Boolean,default:!1},customCountriesList:{default:()=>void 0},autoFormat:{type:[String,Boolean],default:`blur`},countryLocale:{default:()=>void 0},validationError:{type:Boolean,default:!0},validationSuccess:{type:Boolean,default:!0},success:{type:Boolean,default:!1},error:{type:Boolean,default:!1},warning:{type:Boolean,default:!1},displayCountryName:{type:Boolean,default:!1},block:{type:Boolean,default:!1},orientation:{default:`responsive`},countrySelectAttributes:{default:()=>({name:`country`,autocomplete:`off`,style:{width:`14rem`}})},phoneInputAttributes:{default:()=>({name:`phone`,autocomplete:`tel`,inputmode:`tel`})},assistiveText:{default:()=>void 0},hint:{default:()=>void 0}},emits:[`update:model-value`,`country-code`,`update:country-code`,`data`],setup(__props,{emit:__emit}){let emits=__emit;let{fetchCountryCode,getBrowserLocale,getCountryList}=useMazInputPhoneNumber();let{isCountryAvailable,getPhoneNumberResults}=useLibphonenumber();let instanceId=useInstanceUniqId({componentName:`MazInputPhoneNumber`,providedId:__props.id});let phoneNumber=ref();let selectedCountry=ref();let{t}=useTranslations();let messages=computed(()=>({countrySelect:{error:__props.translations?.countrySelect?.error||t(`inputPhoneNumber.countrySelect.error`),placeholder:__props.translations?.countrySelect?.placeholder||t(`inputPhoneNumber.countrySelect.placeholder`),searchPlaceholder:__props.translations?.countrySelect?.searchPlaceholder||t(`inputPhoneNumber.countrySelect.searchPlaceholder`)},phoneInput:{placeholder:__props.translations?.phoneInput?.placeholder||t(`inputPhoneNumber.phoneInput.placeholder`),example:__props.translations?.phoneInput?.example}}));let isPhoneNumberInternalUpdate=ref(!1);let isCountryInternalUpdate=ref(!1);let results=ref({isValid:!1,countryCode:__props.countryCode,phoneNumber:__props.modelValue});let PhoneInputRef=ref();onBeforeMount(async()=>{if(__props.countryCode&&!selectedCountry.value&&onCountryChanged({countryCode:__props.countryCode}),__props.fetchCountry&&!selectedCountry.value){let{data:countryCode,error}=await fetchCountryCode();if(error){console.error(`[MazInputPhoneNumber](onBeforeMount) Error while fetching country code - ${error.message}`);return}onCountryChanged({countryCode})}}),onMounted(()=>{if(!selectedCountry.value&&__props.useBrowserLocale){let countryCode=getBrowserLocale()?.locale;countryCode&&isCountryAvailable(countryCode)&&onCountryChanged({countryCode})}});function updateTheResults({phone=phoneNumber.value||__props.modelValue,countryCode=selectedCountry.value,checkCountryCode=!1}){results.value=getPhoneNumberResults({phoneNumber:phone,countryCode,checkCountryCode})}async function selectPhoneNumberInput(){await nextTick(),setTimeout(()=>{PhoneInputRef.value?.focus()},100)}function setSelectedCountry(countryCode){if(countryCode){if(!isCountryAvailable(countryCode)){console.warn(`[MazInputPhoneNumber] Country code not available: "${countryCode}"`),selectedCountry.value=void 0;return}selectedCountry.value=countryCode}}let isLetterRegex=/\D/g;function onPhoneNumberChanged({newPhoneNumber}){updateTheResults({phone:newPhoneNumber}),results.value.parsedCountryCode&&results.value.parsedCountryCode!==selectedCountry.value&&onCountryChanged({countryCode:results.value.parsedCountryCode,updateResults:!1}),results.value.isValid&&(__props.autoFormat===`blur`||__props.autoFormat===`typing`)?phoneNumber.value=results.value.formatNational?.trim().replaceAll(isLetterRegex,``):phoneNumber.value=newPhoneNumber,isPhoneNumberInternalUpdate.value=!0,results.value.e164?emits(`update:model-value`,results.value.e164):emits(`update:model-value`,results.value.phoneNumber),setTimeout(()=>{isPhoneNumberInternalUpdate.value=!1},0)}function onCountryChanged({countryCode,updateResults=!0,selectPhoneNumber=!1}){if(!countryCode){selectedCountry.value=void 0;return}isCountryInternalUpdate.value=!0,countryCode!==selectedCountry.value&&setSelectedCountry(countryCode),updateResults&&updateTheResults({countryCode:selectedCountry.value,checkCountryCode:!0});let code=selectedCountry.value;emits(`country-code`,code),emits(`update:country-code`,code),selectPhoneNumber&&!results.value.isValid&&selectPhoneNumberInput(),setTimeout(()=>{isCountryInternalUpdate.value=!1},0)}let countriesList=computed(()=>{let list=getCountryList(__props.countryLocale,__props.customCountriesList);return __props.onlyCountries&&(list=list?.filter(country=>__props.onlyCountries?.includes(country.code))),__props.ignoredCountries&&(list=list?.filter(country=>!__props.ignoredCountries?.includes(country.code))),__props.preferredCountries&&(list=list?.sort((a,b)=>{let indexA=__props.preferredCountries?.indexOf(a.code)??-1;let indexB=__props.preferredCountries?.indexOf(b.code)??-1;return indexA>=0&&indexB>=0?indexA-indexB:indexA>=0?-1:+(indexB>=0)})),list??[]});watch(()=>__props.modelValue,(value,oldValue)=>{!isPhoneNumberInternalUpdate.value&&value!==oldValue&&value!==phoneNumber.value&&onPhoneNumberChanged({newPhoneNumber:value})},{immediate:!0}),watch(()=>__props.countryCode,(value,oldValue)=>{!isCountryInternalUpdate.value&&value&&value!==oldValue&&value!==selectedCountry.value&&onCountryChanged({countryCode:value})},{immediate:!0}),watch(results,value=>emits(`data`,value),{immediate:!0});let countryState=computed(()=>({error:__props.error||(__props.validationError?!!phoneNumber.value&&!selectedCountry.value:!1),success:__props.success||(__props.validationSuccess?results.value?.isValid:!1)}));let phoneState=computed(()=>({error:__props.error||(__props.validationError?!!phoneNumber.value&&!results.value?.isValid:!1),success:__props.success||(__props.validationSuccess?results.value.isValid:!1)}));let stateLabelColor=computed(()=>[{"maz:text-destructive-600":countryState.value.error||phoneState.value.error,"maz:text-success-600":countryState.value.success&&phoneState.value.success,"maz:text-warning-600":__props.warning}]);let assistiveTextStateColor=computed(()=>[{"maz:text-destructive-600":countryState.value.error||phoneState.value.error,"maz:text-success-600":countryState.value.success&&phoneState.value.success,"maz:text-warning-600":__props.warning,"maz:text-muted":!(countryState.value.error||phoneState.value.error)&&!(countryState.value.success&&phoneState.value.success)&&!__props.warning}]);return provide(`mazInputPhoneNumberData`,{selectedCountry,phoneNumber,results}),(_ctx,_cache)=>(openBlock(),createElementBlock(`div`,{id:unref(instanceId),class:normalizeClass([`m-input-phone-number m-reset-css maz:relative maz:inline-flex maz:flex-col`,[__props.class,{"maz:w-full":__props.block}]]),style:normalizeStyle(__props.style)},[__props.topLabel?(openBlock(),createElementBlock(`label`,{key:0,for:`${unref(instanceId)}-phone`,class:normalizeClass([`m-input-phone-number__top-label maz:mb-2`,stateLabelColor.value]),style:{fontWeight:`var(--maz-input-top-label-font-weight, 600)`}},toDisplayString(__props.topLabel),11,_hoisted_2)):createCommentVNode(``,!0),createElementVNode(`div`,{class:normalizeClass([`maz:flex maz:items-center maz:align-top`,[__props.orientation&&`--${__props.orientation}`,__props.orientation===`col`?`maz:flex-col`:__props.orientation===`row`?`maz:flex-row`:`maz:flex-col maz:mob-l:flex-row`]])},[__props.hideCountrySelect?createCommentVNode(``,!0):(openBlock(),createBlock(MazSelectCountry_default,mergeProps({key:0,id:`${unref(instanceId)}-country`,class:`m-input-phone-number__country-select`},__props.countrySelectAttributes,{"model-value":selectedCountry.value,"option-input-value-key":__props.displayCountryName?`name`:`dialCode`,color:__props.color,size:__props.size,locale:__props.countryLocale,"countries-list":__props.customCountriesList,"list-position":__props.listPosition,"hide-flags":__props.hideFlags,search:__props.search,block:__props.block,error:__props.error||(__props.validationError?!!phoneNumber.value&&!selectedCountry.value:!1),success:__props.success||(__props.validationSuccess?results.value?.isValid:!1),translations:messages.value.countrySelect,hint:phoneNumber.value&&!selectedCountry.value?messages.value.countrySelect.error:void 0,options:countriesList.value,disabled:__props.disabled,warning:__props.warning,required:__props.required,"search-threshold":__props.searchThreshold,"format-input-value":__props.displayCountryName||!selectedCountry.value?void 0:value=>`+${value}`,"show-code-in-list":__props.showCodeInList,label:messages.value.countrySelect.placeholder,"onUpdate:modelValue":_cache[0]||=$event=>onCountryChanged({countryCode:$event,selectPhoneNumber:!0})}),{"no-results":withCtx(()=>[renderSlot(_ctx.$slots,`no-results`,{},void 0,!0)]),"selector-flag":withCtx(({countryCode:codeCountry})=>[renderSlot(_ctx.$slots,`selector-flag`,{countryCode:codeCountry},void 0,!0)]),"country-list-flag":withCtx(({isSelected,option})=>[renderSlot(_ctx.$slots,`country-list-flag`,{countryCode:option.code,option,isSelected},void 0,!0)]),"country-list-code":withCtx(({option})=>[createElementVNode(`span`,_hoisted_3,` +`+toDisplayString(option.dialCode),1)]),_:3},16,[`id`,`model-value`,`option-input-value-key`,`color`,`size`,`locale`,`countries-list`,`list-position`,`hide-flags`,`search`,`block`,`error`,`success`,`translations`,`hint`,`options`,`disabled`,`warning`,`required`,`search-threshold`,`format-input-value`,`show-code-in-list`,`label`])),createVNode(PhoneInput_default,mergeProps({id:`${unref(instanceId)}-phone`,ref_key:`PhoneInputRef`,ref:PhoneInputRef,class:`m-input-phone-number__phone-input`,"model-value":phoneNumber.value},{..._ctx.$attrs,...__props.phoneInputAttributes},{color:__props.color,size:__props.size,"auto-format":__props.autoFormat,example:__props.example,block:``,disabled:__props.disabled,required:__props.required,warning:__props.warning,hint:__props.hint,name:__props.phoneInputAttributes.name,"has-radius":!__props.hideCountrySelect,success:__props.success||(__props.validationSuccess?results.value.isValid:!1),error:__props.error||(__props.validationError?!!phoneNumber.value&&!results.value.isValid:!1),locales:messages.value.phoneInput,label:__props.label,placeholder:__props.placeholder,"onUpdate:modelValue":_cache[1]||=$event=>onPhoneNumberChanged({newPhoneNumber:$event})}),null,16,[`id`,`model-value`,`color`,`size`,`auto-format`,`example`,`disabled`,`required`,`warning`,`hint`,`name`,`has-radius`,`success`,`error`,`locales`,`label`,`placeholder`])],2),__props.assistiveText?(openBlock(),createElementBlock(`div`,{key:1,class:normalizeClass([`m-input-phone-number__bottom-text maz:mt-1 maz:text-sm`,assistiveTextStateColor.value])},toDisplayString(__props.assistiveText),3)):createCommentVNode(``,!0)],14,_hoisted_1))}}),[[`__scopeId`,`data-v-31c63de8`]]);export{MazInputPhoneNumber_default as t};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{t as MazInput_default}from"./MazInput.
|
|
1
|
+
import{t as MazInput_default}from"./MazInput.C5wxW29_.js";import{computed,createBlock,defineComponent,nextTick,onMounted,openBlock,ref,unref,watch,withKeys}from"vue";import{MazBanknotes}from"@maz-ui/icons/lazy/MazBanknotes";import{formatCurrency}from"@maz-ui/utils/helpers/formatCurrency";var MazInputPrice_default=defineComponent({__name:`MazInputPrice`,props:{modelValue:{},currency:{default:`EUR`},locale:{default:`fr-FR`},min:{default:()=>-1/0},max:{default:()=>1/0},noIcon:{type:Boolean,default:!1},block:{type:Boolean},error:{type:Boolean},hint:{},success:{type:Boolean},warning:{type:Boolean},currencyOptions:{}},emits:[`update:model-value`,`input`,`formatted`,`blur`,`focus`],setup(__props,{emit:__emit}){let emits=__emit;let internalValue=ref(getAdjustedPrice(__props.modelValue));watch(()=>__props.modelValue,updateInternalValue);let isActive=ref(!1);let valueString=computed(()=>__props.modelValue?.toString());let valueNumber=computed(()=>__props.modelValue);let priceFormatted=computed(()=>typeof valueNumber.value==`number`?formatCurrency(valueNumber.value,__props.locale,{...__props.currencyOptions,currency:__props.currency}):void 0);let isLetterRegex=/[^\d.]/g;function getAdjustedPrice(value){let isNegative=typeof value==`string`&&value.startsWith(`-`);let newValue=typeof value==`string`?Number.parseFloat(value.replace(`,`,`.`).replaceAll(isLetterRegex,``)):value;return newValue=isNegative&&newValue?-newValue:newValue,(typeof newValue!=`number`||Number.isNaN(newValue))&&(newValue=void 0),newValue&&newValue<__props.min&&(newValue=__props.min),newValue&&newValue>__props.max&&(newValue=__props.max),newValue}let displayPrice=computed(()=>{if(isActive.value)return valueString.value;if(typeof __props.modelValue==`number`)return priceFormatted.value});async function emitValues(newValue){emits(`update:model-value`,getAdjustedPrice(newValue)),await nextTick(),emits(`formatted`,priceFormatted.value)}onMounted(()=>{emitValues(__props.modelValue)});function onBlur(event){isActive.value=!1,emitValues(internalValue.value),emits(`blur`,event)}function onFocus(event){isActive.value=!0,emits(`focus`,event)}function onInput(){emits(`input`,internalValue.value),emitValues(internalValue.value)}function updateInternalValue(value){internalValue.value=getAdjustedPrice(value)}return(_ctx,_cache)=>(openBlock(),createBlock(MazInput_default,{"model-value":displayPrice.value,class:`maz:input-price m-reset-css`,block:__props.block,error:__props.error,success:__props.success,warning:__props.warning,hint:__props.hint,"start-icon":__props.noIcon?void 0:unref(MazBanknotes),onFocus,onBlur,onInput,onKeydown:_cache[0]||=withKeys($event=>emitValues(internalValue.value),[`enter`]),"onUpdate:modelValue":_cache[1]||=$event=>updateInternalValue($event)},null,8,[`model-value`,`block`,`error`,`success`,`warning`,`hint`,`start-icon`]))}});export{MazInputPrice_default as t};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{t as _plugin_vue_export_helper_default}from"./_plugin-vue_export-helper.ChmETRGw.js";import{t as MazInput_default}from"./MazInput.
|
|
1
|
+
import{t as _plugin_vue_export_helper_default}from"./_plugin-vue_export-helper.ChmETRGw.js";import{t as MazInput_default}from"./MazInput.C5wxW29_.js";import{t as MazBtn_default}from"./MazBtn.BbzUbXCS.js";import{Fragment,TransitionGroup,computed,createElementBlock,createTextVNode,createVNode,defineComponent,mergeProps,normalizeClass,normalizeStyle,openBlock,ref,renderList,toDisplayString,unref,withCtx,withKeys,withModifiers}from"vue";import{truthyFilter}from"@maz-ui/utils/helpers/truthyFilter";import{MazTrash}from"@maz-ui/icons/raw/MazTrash";import '../assets/MazInputTags.CcTvLQpM.css';var MazInputTags_default=_plugin_vue_export_helper_default(defineComponent({inheritAttrs:!1,__name:`MazInputTags`,props:{style:{type:[Boolean,null,String,Object,Array]},class:{type:[Boolean,null,String,Object,Array]},modelValue:{},placeholder:{},label:{},disabled:{type:Boolean,default:!1},error:{type:Boolean,default:!1},success:{type:Boolean,default:!1},warning:{type:Boolean,default:!1},size:{default:`md`},color:{default:`primary`},block:{type:Boolean},addTagsOnBlur:{type:Boolean,default:!0},hint:{}},emits:[`update:model-value`],setup(__props,{emit:__emit}){let emits=__emit;let isFocused=ref(!1);let inputValue=ref();let tagsHoveredId=ref();let lastIdToDelete=ref();let currentDeleteTimeout=ref();let tags=computed(()=>__props.modelValue?.map(tag=>({tag,id:`${Date.now()}-${Math.random().toString(36).slice(2)}`})));function addTags(event){if(inputValue.value){lastIdToDelete.value=void 0,event.preventDefault();let newValues=inputValue.value.trim().split(`,`).map(value=>value.trim()===`,`?void 0:value.trim()).filter(truthyFilter).filter(value=>!__props.modelValue?.filter(truthyFilter)?.includes(value));emits(`update:model-value`,__props.modelValue?[...__props.modelValue,...newValues]:[...newValues]),inputValue.value=void 0}}let borderStyle=computed(()=>{if(__props.error)return`maz:border-destructive`;if(__props.success)return`maz:border-success`;if(__props.warning)return`maz:border-warning`;if(isFocused.value){if(__props.color===`primary`)return`maz:border-primary`;if(__props.color===`secondary`)return`maz:border-secondary`;if(__props.color===`info`)return`maz:border-info`;if(__props.color===`destructive`)return`maz:border-destructive`;if(__props.color===`success`)return`maz:border-success`;if(__props.color===`warning`)return`maz:border-warning`}return``});function removeLastTag(){inputValue.value||tags.value&&tags.value?.length===0||(currentDeleteTimeout.value&&clearTimeout(currentDeleteTimeout.value),lastIdToDelete.value?(removeTag(lastIdToDelete.value),lastIdToDelete.value=void 0):(lastIdToDelete.value=tags.value?.at(-1)?.id,currentDeleteTimeout.value=setTimeout(()=>{lastIdToDelete.value=void 0},2e3)))}function removeTag(id){let tagsArray=tags.value?.filter(tag=>tag.id!==id).map(tag=>tag.tag);emits(`update:model-value`,tagsArray)}let SIZE_CLASS={xl:`maz:min-h-16`,lg:`maz:min-h-14`,md:`maz:min-h-12`,sm:`maz:min-h-10`,xs:`maz:min-h-8`,mini:`maz:min-h-6`};let buttonSize=computed(()=>__props.size===`mini`||__props.size===`xs`?`mini`:__props.size===`sm`?`xs`:__props.size===`md`?`sm`:__props.size===`lg`?`md`:__props.size===`xl`?`lg`:__props.size);return(_ctx,_cache)=>(openBlock(),createElementBlock(`div`,{class:normalizeClass([`m-input-tags m-reset-css maz:relative maz:inline-flex maz:flex-wrap maz:gap-1 maz:overflow-hidden maz:rounded-md maz:border maz:border-divider maz:bg-input maz:px-[0.5em] maz:py-[0.25em] maz:align-top maz:transition-colors maz:duration-200 maz:ease-in-out maz:dark:border-divider-400`,[borderStyle.value,`--${__props.color}`,`--${__props.size}`,SIZE_CLASS[__props.size],__props.class,{"--block":__props.block,"maz:w-full":__props.block}]]),style:normalizeStyle(__props.style),onFocusCapture:_cache[4]||=$event=>isFocused.value=!0,onBlurCapture:_cache[5]||=$event=>isFocused.value=!1},[createVNode(TransitionGroup,{name:`maz-tags`},{default:withCtx(()=>[(openBlock(!0),createElementBlock(Fragment,null,renderList(tags.value,({tag,id},i)=>(openBlock(),createElementBlock(`div`,{key:`tag-${i}`,class:`m-input-tags__wrapper maz:inline-flex maz:h-auto maz:flex-none! maz:flex-center`},[createVNode(MazBtn_default,{class:`m-input-tags__tag`,disabled:__props.disabled,size:buttonSize.value,color:tagsHoveredId.value===id||lastIdToDelete.value===id?`destructive`:__props.color,"end-icon":tagsHoveredId.value===id||lastIdToDelete.value===id?unref(MazTrash):void 0,onClick:withModifiers($event=>removeTag(id),[`stop`]),onMouseenter:$event=>tagsHoveredId.value=__props.disabled?void 0:id,onFocus:$event=>tagsHoveredId.value=__props.disabled?void 0:id,onMouseleave:_cache[0]||=$event=>tagsHoveredId.value=void 0,onBlur:_cache[1]||=$event=>tagsHoveredId.value=void 0},{default:withCtx(()=>[createTextVNode(toDisplayString(tag),1)]),_:2},1032,[`disabled`,`size`,`color`,`end-icon`,`onClick`,`onMouseenter`,`onFocus`])]))),128))]),_:1}),createVNode(MazInput_default,mergeProps({key:`input-tags`,modelValue:inputValue.value,"onUpdate:modelValue":_cache[2]||=$event=>inputValue.value=$event},_ctx.$attrs,{placeholder:__props.placeholder,label:__props.label,"aria-label":__props.label||__props.placeholder,error:__props.error,hint:__props.hint,success:__props.success,warning:__props.warning,disabled:__props.disabled,"top-label":void 0,"assistive-text":void 0,color:__props.color,block:__props.block,size:__props.size,"input-classes":`maz:w-full`,border:!1,class:`m-input-tags__input maz:h-auto! maz:flex-1`,onKeydown:[withKeys(addTags,[`enter`]),withKeys(removeLastTag,[`delete`])],onBlur:_cache[3]||=$event=>__props.addTagsOnBlur?addTags($event):void 0}),null,16,[`modelValue`,`placeholder`,`label`,`aria-label`,`error`,`hint`,`success`,`warning`,`disabled`,`color`,`block`,`size`])],38))}}),[[`__scopeId`,`data-v-4ed5b94f`]]);export{MazInputTags_default as t};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{useInstanceUniqId}from"../composables/useInstanceUniqId.js";import{t as hasSlotContent}from"./hasSlotContent.BLn0kQC7.js";import{t as MazPopover_default}from"./MazPopover.BZG8J4IR.js";import{t as _plugin_vue_export_helper_default}from"./_plugin-vue_export-helper.ChmETRGw.js";import{useStringMatching}from"../composables/useStringMatching.js";import{t as MazIcon_default}from"./MazIcon.BKcg5YfP.js";import{t as MazInput_default}from"./MazInput.CDKs42ml.js";import{Fragment,computed,createBlock,createCommentVNode,createElementBlock,createElementVNode,createSlots,createVNode,defineAsyncComponent,defineComponent,mergeModels,mergeProps,nextTick,normalizeClass,normalizeStyle,onBeforeUnmount,openBlock,ref,renderList,renderSlot,toDisplayString,unref,useModel,useTemplateRef,watch,withCtx,withModifiers}from"vue";import{useTranslations}from"@maz-ui/translations/composables/useTranslations";import{isClient}from"@maz-ui/utils/helpers/isClient";import{normalizeString}from"@maz-ui/utils/helpers/normalizeString";import{MazMagnifyingGlass}from"@maz-ui/icons/lazy/MazMagnifyingGlass";import{MazNoSymbol}from"@maz-ui/icons/lazy/MazNoSymbol";import{MazChevronDown}from"@maz-ui/icons/raw/MazChevronDown";import{debounceCallback}from"@maz-ui/utils/helpers/debounceCallback";import '../assets/MazSelect.vD0j0NLj.css';var _hoisted_1=[`disabled`,`aria-label`];var _hoisted_2=[`id`];var _hoisted_3={key:0,class:`m-select-list__search-wrapper`};var _hoisted_4={class:`m-select-list__no-results`};var _hoisted_5={key:2,ref:`optionListWrapper`,class:`m-select-list__scroll-wrapper`,tabindex:`-1`};var _hoisted_6={class:`m-select-list-optgroup`};var _hoisted_7=[`tabindex`,`onClick`];var MazSelect_default=_plugin_vue_export_helper_default(defineComponent({inheritAttrs:!1,__name:`MazSelect`,props:mergeModels({style:{type:[Boolean,null,String,Object,Array],default:()=>void 0},class:{type:[Boolean,null,String,Object,Array],default:()=>void 0},id:{default:()=>void 0},label:{},placeholder:{},modelValue:{default:()=>void 0},options:{},optionValueKey:{default:`value`},optionLabelKey:{default:`label`},optionInputValueKey:{default:`label`},listPosition:{default:`auto`},preferPosition:{default:`bottom-start`},fallbackPosition:{default:`top-start`},itemHeight:{default:()=>void 0},maxListHeight:{default:240},maxListWidth:{default:()=>void 0},minListHeight:{default:()=>void 0},minListWidth:{default:()=>void 0},size:{default:`md`},color:{default:`primary`},search:{type:Boolean},searchFunction:{type:Function},searchThreshold:{default:.75},multiple:{type:Boolean,default:!1},required:{type:Boolean},disabled:{type:Boolean},block:{type:Boolean},autocomplete:{default:`off`},translations:{},formatInputValue:{type:Function},transition:{default:`scale-fade`}},{open:{default:!1},openModifiers:{}}),emits:mergeModels([`close`,`open`,`blur`,`focus`,`change`,`input`,`update:model-value`,`selected-option`],[`update:open`]),setup(__props,{expose:__expose,emit:__emit}){let emits=__emit;let MazCheckbox=defineAsyncComponent(()=>import(`../components/MazCheckbox.js`));let popoverComponent=useTemplateRef(`popover`);let inputRef=useTemplateRef(`input`);let searchInputRef=useTemplateRef(`searchInput`);let optionListElement=useTemplateRef(`optionListRef`);let optionListWrapperRef=useTemplateRef(`optionListWrapper`);let selectedTextColor=computed(()=>`var(--maz-${__props.color})`);let selectedBgColor=computed(()=>`color-mix(in srgb, var(--maz-${__props.color}) 10%, transparent)`);let SIZE_TEXT_CLASS={mini:`maz:text-xs`,xs:`maz:text-xs`,sm:`maz:text-sm`,md:`maz:text-base`,lg:`maz:text-lg`,xl:`maz:text-xl`};let{t}=useTranslations();let messages=computed(()=>({searchPlaceholder:__props.translations?.searchPlaceholder||t(`select.searchPlaceholder`)}));let isOpen=useModel(__props,`open`);let instanceId=useInstanceUniqId({componentName:`MazSelect`,providedId:__props.id});function getOptionPayload(option){return{[__props.optionValueKey]:option,[__props.optionLabelKey]:option,[__props.optionInputValueKey]:option}}function getNormalizedOptionPayload(option){return{...option,[__props.optionValueKey]:option[__props.optionValueKey],[__props.optionLabelKey]:option[__props.optionLabelKey],[__props.optionInputValueKey]:option[__props.optionInputValueKey]}}function getNormalizedOptions(options){let normalizedOptions=[];if(!options?.length)return[];for(let option of options)typeof option==`string`||typeof option==`number`||typeof option==`boolean`?normalizedOptions.push(getOptionPayload(option)):typeof option==`object`&&`options`in option&&Array.isArray(option.options)?normalizedOptions.push({label:option.label,isOptGroup:!0},...option.options.map(opt=>typeof opt==`string`||typeof opt==`number`||typeof opt==`boolean`?getOptionPayload(opt):getNormalizedOptionPayload(opt))):normalizedOptions.push(getNormalizedOptionPayload(option));return normalizedOptions}let optionsNormalized=computed(()=>getNormalizedOptions(__props.options??[]));function isOptionInSelection(option){return isNullOrUndefined(option[__props.optionValueKey])?!1:__props.multiple?Array.isArray(__props.modelValue)&&__props.modelValue.includes(option[__props.optionValueKey]):__props.modelValue===option[__props.optionValueKey]}let selectedOptions=computed(()=>optionsNormalized.value?.filter(isOptionInSelection)??[]);function isNullOrUndefined(value){return value==null}function isSelectedOption(option){return(selectedOptions.value?.some(selectedOption=>selectedOption[__props.optionValueKey]===option[__props.optionValueKey])??!1)&&!isNullOrUndefined(option[__props.optionValueKey])}let inputValue=computed(()=>{if(__props.multiple&&__props.modelValue&&Array.isArray(__props.modelValue)){let values=__props.modelValue.map(value=>optionsNormalized.value?.find(option=>option[__props.optionValueKey]===value)?.[__props.optionInputValueKey]);return __props.formatInputValue?__props.formatInputValue(values):values.join(`, `)}let selectedOption=optionsNormalized.value?.find(option=>option[__props.optionValueKey]===__props.modelValue);let value=isNullOrUndefined(__props.modelValue)?void 0:selectedOption?.[__props.optionInputValueKey];return __props.formatInputValue?__props.formatInputValue(value):value});let searchQuery=ref();let query=ref(``);function searchInValue(value,query){return query&&value&&normalizeString(value).includes(normalizeString(query))}function getFilteredOptionWithQuery(query){return query?optionsNormalized.value?.filter(option=>{let searchValue=option[__props.optionLabelKey];let searchValue3=option[__props.optionValueKey];let searchValue2=option[__props.optionInputValueKey];let threshold=__props.searchThreshold;return searchInValue(searchValue,query)||searchInValue(searchValue2,query)||searchInValue(searchValue3,query)||typeof searchValue==`string`&&useStringMatching(searchValue,query,threshold).isMatching.value||typeof searchValue2==`string`&&useStringMatching(searchValue2,query,threshold).isMatching.value||typeof searchValue3==`string`&&useStringMatching(searchValue3,query,threshold).isMatching.value}):optionsNormalized.value}let optionList=computed(()=>__props.searchFunction&&__props.search&&searchQuery.value?getNormalizedOptions(__props.searchFunction(searchQuery.value,__props.options??[])??[]):getFilteredOptionWithQuery(searchQuery.value));async function onOpenList(){let selectedIndex=optionList.value?.findIndex(option=>isSelectedOption(option));await scrollToOptionIndex(selectedIndex),emits(`open`)}function focusMainInput(){inputRef.value?.$el?.querySelector(`input`)?.focus()}function emitInputMainInput(){inputRef.value?.$el?.querySelector(`input`)?.dispatchEvent(new Event(`input`))}function focusSearchInputAndSetQuery(q){searchQuery.value=q,searchInputRef.value?.$el?.querySelector(`input`)?.focus()}function searchOptionWithQuery(keyPressed){keyPressed===`Backspace`&&query.value&&query.value.length>0?query.value=query.value.slice(0,-1):query.value+=keyPressed;let filteredOptions=getFilteredOptionWithQuery(query.value);if(!filteredOptions?.length)return;let optionIndex=optionList.value?.findIndex(option=>option[__props.optionValueKey]===filteredOptions[0][__props.optionValueKey]);typeof optionIndex!=`number`||optionIndex===-1||(scrollToOptionIndex(optionIndex),debounceCallback(()=>{query.value=``},1e3))}let isLetterOrNumberRegex=/^([\dA-Za-z\u0400-\u04FF])$/;function mainInputKeyboardHandler(event){if(event.ctrlKey||event.metaKey||event.altKey)return;let keyPressed=event.key;(keyPressed===`ArrowDown`||keyPressed===`ArrowUp`||isLetterOrNumberRegex.test(keyPressed))&&!isOpen.value&&(event.preventDefault(),popoverComponent.value?.open()),isLetterOrNumberRegex.test(keyPressed)&&__props.search&&(event.preventDefault(),event.stopPropagation(),focusSearchInputAndSetQuery(keyPressed))}async function scrollToOptionIndex(index){if(await nextTick(),typeof index!=`number`||index<0)return;let item=optionListElement.value?.querySelector(`.m-select-list-item:nth-child(${index+1})`);if(item&&optionListWrapperRef.value){let wrapperRect=optionListWrapperRef.value.getBoundingClientRect();let itemRect=item.getBoundingClientRect();let scrollTop=item.offsetTop-wrapperRect.height/2-itemRect.height;optionListWrapperRef.value.scrollTo?.({top:scrollTop,behavior:`auto`}),setTimeout(()=>{item.focus({preventScroll:!0})},100)}}function updateValue(inputOption,mustCloseList=!0){mustCloseList&&!__props.multiple&&nextTick(()=>{popoverComponent.value?.close()}),searchQuery.value=``;let isAlreadySelected=selectedOptions.value?.some(option=>option[__props.optionValueKey]===inputOption[__props.optionValueKey]);let newValue=selectedOptions.value;isAlreadySelected&&__props.multiple?newValue=newValue?.filter(option=>option[__props.optionValueKey]!==inputOption[__props.optionValueKey]):__props.multiple?newValue.push(inputOption):newValue=[inputOption];let selectedValues=newValue.map(option=>option[__props.optionValueKey]);emits(`update:model-value`,__props.multiple?selectedValues:selectedValues[0]),emits(`selected-option`,inputOption),emitInputMainInput(),focusMainInput()}function keydownHandler(event){let keyPressed=event.key;if(keyPressed===`ArrowDown`||keyPressed===`ArrowUp`){event.preventDefault();let itemLength=optionList.value?.length;if(!itemLength)return;let currentElement=document.activeElement;let itemsElements=document.querySelectorAll(`#${instanceId.value}-option-list .m-select-list-item`);let currentIndex=[...itemsElements].indexOf(currentElement);if(currentIndex===-1){itemsElements[0]?.focus({preventScroll:!0});return}itemsElements[keyPressed===`ArrowDown`?(currentIndex+1)%itemLength:(currentIndex-1+itemLength)%itemLength]?.focus()}else !__props.search&&isLetterOrNumberRegex.test(keyPressed)&&searchOptionWithQuery(keyPressed)}function updateListPosition(){nextTick(()=>{popoverComponent.value?.updatePosition()})}return watch(isOpen,value=>{isClient()&&(value?document.addEventListener(`keydown`,keydownHandler):document.removeEventListener(`keydown`,keydownHandler))},{immediate:!0}),onBeforeUnmount(()=>{document.removeEventListener(`keydown`,keydownHandler)}),__expose({open:()=>{popoverComponent.value?.open()},close:()=>{popoverComponent.value?.close()}}),(_ctx,_cache)=>(openBlock(),createBlock(MazPopover_default,{id:`${unref(instanceId)}-popover`,ref:`popover`,modelValue:isOpen.value,"onUpdate:modelValue":_cache[5]||=$event=>isOpen.value=$event,class:normalizeClass([`m-select m-reset-css maz:relative maz:inline-flex maz:align-top`,[{"--is-open":isOpen.value,"--disabled":__props.disabled},__props.class,`--${__props.size}`,SIZE_TEXT_CLASS[__props.size]]]),style:normalizeStyle(__props.style),trigger:`click`,block:__props.block,transition:__props.transition,offset:0,position:__props.listPosition,disabled:__props.disabled,"prefer-position":__props.preferPosition,"fallback-position":__props.fallbackPosition,"position-reference":`#${unref(instanceId)}-popover .m-input-wrapper`,onClose:_cache[6]||=$event=>emits(`close`),onOpen:onOpenList},{trigger:withCtx(({close,open:openPicker,toggle:togglePopover})=>[createVNode(MazInput_default,mergeProps({id:unref(instanceId),ref:`input`,class:`m-select-input`},_ctx.$attrs,{required:__props.required,"border-active":isOpen.value,color:__props.color,"model-value":inputValue.value,size:__props.size,block:__props.block,placeholder:__props.placeholder,label:__props.label,autocomplete:__props.autocomplete,disabled:__props.disabled,readonly:``,onChange:_cache[0]||=$event=>emits(`change`,$event),onInput:_cache[1]||=$event=>emits(`input`,$event),onFocus:_cache[2]||=$event=>emits(`focus`,$event),onBlur:_cache[3]||=$event=>emits(`blur`,$event),onKeydown:mainInputKeyboardHandler}),createSlots({"end-icon":withCtx(()=>[renderSlot(_ctx.$slots,`end-icon`,{isOpen:isOpen.value,close,open:openPicker,toggle:togglePopover},()=>[createElementVNode(`button`,{tabindex:`-1`,disabled:__props.disabled,type:`button`,class:`m-select-input__toggle-button maz-custom`,"aria-label":`${isOpen.value?`collapse`:`expand`} list of options`},[createVNode(MazIcon_default,{icon:unref(MazChevronDown),class:`m-select-chevron`},null,8,[`icon`])],8,_hoisted_1)],!0)]),_:2},[unref(hasSlotContent)(_ctx.$slots[`start-icon`])?{name:`start-icon`,fn:withCtx(()=>[renderSlot(_ctx.$slots,`start-icon`,{isOpen:isOpen.value,close,open:openPicker,toggle:togglePopover},void 0,!0)]),key:`0`}:void 0]),1040,[`id`,`required`,`border-active`,`color`,`model-value`,`size`,`block`,`placeholder`,`label`,`autocomplete`,`disabled`])]),default:withCtx(({close,open:openPicker,toggle:togglePopover})=>[createElementVNode(`div`,{id:`${unref(instanceId)}-option-list`,ref:`optionListRef`,class:normalizeClass([`m-select-list`,[`--${__props.size}`,SIZE_TEXT_CLASS[__props.size]]]),style:normalizeStyle([{maxHeight:`${__props.maxListHeight}px`,maxWidth:`${__props.maxListWidth}px`,minHeight:`${__props.minListHeight}px`,minWidth:`${__props.minListWidth}px`,"--selected-bg-color":selectedBgColor.value,"--selected-text-color":selectedTextColor.value}])},[__props.search?(openBlock(),createElementBlock(`div`,_hoisted_3,[createVNode(MazInput_default,{ref:`searchInput`,modelValue:searchQuery.value,"onUpdate:modelValue":[_cache[4]||=$event=>searchQuery.value=$event,updateListPosition],size:`sm`,disabled:__props.disabled,color:__props.color,placeholder:messages.value.searchPlaceholder,name:`search`,inputmode:`search`,autocomplete:`off`,block:``,class:`m-select-list__search-input maz:flex-none`,"start-icon":unref(MazMagnifyingGlass)},null,8,[`modelValue`,`disabled`,`color`,`placeholder`,`start-icon`])])):createCommentVNode(``,!0),!optionList.value||optionList.value.length<=0?renderSlot(_ctx.$slots,`no-results`,{key:1},()=>[createElementVNode(`span`,_hoisted_4,[createVNode(unref(MazNoSymbol),{class:`maz:size-6 maz:text-foreground`})])],!0):(openBlock(),createElementBlock(`div`,_hoisted_5,[(openBlock(!0),createElementBlock(Fragment,null,renderList(optionList.value,(option,i)=>(openBlock(),createElementBlock(Fragment,{key:i},[option.label&&option.isOptGroup?renderSlot(_ctx.$slots,`optgroup`,{key:0,label:option.label},()=>[createElementVNode(`span`,_hoisted_6,toDisplayString(option.label),1)],!0):(openBlock(),createElementBlock(`button`,{key:1,type:`button`,tabindex:__props.multiple?-1:0,class:normalizeClass([`m-select-list-item maz-custom maz:flex-none`,[{"--is-selected":isSelectedOption(option),"--is-none-value":isNullOrUndefined(option[__props.optionValueKey])}]]),style:normalizeStyle(__props.itemHeight?{height:`${__props.itemHeight}px`}:void 0),onClick:withModifiers($event=>updateValue(option,!0),[`prevent`,`stop`])},[__props.multiple?(openBlock(),createBlock(unref(MazCheckbox),{key:0,"model-value":isSelectedOption(option),size:`sm`,color:__props.color},null,8,[`model-value`,`color`])):createCommentVNode(``,!0),renderSlot(_ctx.$slots,`default`,{option,isSelected:isSelectedOption(option),isOpen:isOpen.value,close,open:openPicker,toggle:togglePopover},()=>[createElementVNode(`span`,null,toDisplayString(option[__props.optionLabelKey]),1)],!0)],14,_hoisted_7))],64))),128))],512))],14,_hoisted_2)]),_:3},8,[`id`,`modelValue`,`class`,`style`,`block`,`transition`,`position`,`disabled`,`prefer-position`,`fallback-position`,`position-reference`]))}}),[[`__scopeId`,`data-v-12f7d7b2`]]);export{MazSelect_default as t};
|
|
1
|
+
import{useInstanceUniqId}from"../composables/useInstanceUniqId.js";import{t as hasSlotContent}from"./hasSlotContent.BLn0kQC7.js";import{t as MazPopover_default}from"./MazPopover.BZG8J4IR.js";import{t as _plugin_vue_export_helper_default}from"./_plugin-vue_export-helper.ChmETRGw.js";import{useStringMatching}from"../composables/useStringMatching.js";import{t as MazIcon_default}from"./MazIcon.BKcg5YfP.js";import{t as MazInput_default}from"./MazInput.C5wxW29_.js";import{Fragment,computed,createBlock,createCommentVNode,createElementBlock,createElementVNode,createSlots,createVNode,defineAsyncComponent,defineComponent,mergeModels,mergeProps,nextTick,normalizeClass,normalizeStyle,onBeforeUnmount,openBlock,ref,renderList,renderSlot,toDisplayString,unref,useModel,useTemplateRef,watch,withCtx,withModifiers}from"vue";import{useTranslations}from"@maz-ui/translations/composables/useTranslations";import{isClient}from"@maz-ui/utils/helpers/isClient";import{normalizeString}from"@maz-ui/utils/helpers/normalizeString";import{MazMagnifyingGlass}from"@maz-ui/icons/lazy/MazMagnifyingGlass";import{MazNoSymbol}from"@maz-ui/icons/lazy/MazNoSymbol";import{MazChevronDown}from"@maz-ui/icons/raw/MazChevronDown";import{debounceCallback}from"@maz-ui/utils/helpers/debounceCallback";import '../assets/MazSelect.vD0j0NLj.css';var _hoisted_1=[`disabled`,`aria-label`];var _hoisted_2=[`id`];var _hoisted_3={key:0,class:`m-select-list__search-wrapper`};var _hoisted_4={class:`m-select-list__no-results`};var _hoisted_5={key:2,ref:`optionListWrapper`,class:`m-select-list__scroll-wrapper`,tabindex:`-1`};var _hoisted_6={class:`m-select-list-optgroup`};var _hoisted_7=[`tabindex`,`onClick`];var MazSelect_default=_plugin_vue_export_helper_default(defineComponent({inheritAttrs:!1,__name:`MazSelect`,props:mergeModels({style:{type:[Boolean,null,String,Object,Array],default:()=>void 0},class:{type:[Boolean,null,String,Object,Array],default:()=>void 0},id:{default:()=>void 0},label:{},placeholder:{},modelValue:{default:()=>void 0},options:{},optionValueKey:{default:`value`},optionLabelKey:{default:`label`},optionInputValueKey:{default:`label`},listPosition:{default:`auto`},preferPosition:{default:`bottom-start`},fallbackPosition:{default:`top-start`},itemHeight:{default:()=>void 0},maxListHeight:{default:240},maxListWidth:{default:()=>void 0},minListHeight:{default:()=>void 0},minListWidth:{default:()=>void 0},size:{default:`md`},color:{default:`primary`},search:{type:Boolean},searchFunction:{type:Function},searchThreshold:{default:.75},multiple:{type:Boolean,default:!1},required:{type:Boolean},disabled:{type:Boolean},block:{type:Boolean},autocomplete:{default:`off`},translations:{},formatInputValue:{type:Function},transition:{default:`scale-fade`}},{open:{default:!1},openModifiers:{}}),emits:mergeModels([`close`,`open`,`blur`,`focus`,`change`,`input`,`update:model-value`,`selected-option`],[`update:open`]),setup(__props,{expose:__expose,emit:__emit}){let emits=__emit;let MazCheckbox=defineAsyncComponent(()=>import(`../components/MazCheckbox.js`));let popoverComponent=useTemplateRef(`popover`);let inputRef=useTemplateRef(`input`);let searchInputRef=useTemplateRef(`searchInput`);let optionListElement=useTemplateRef(`optionListRef`);let optionListWrapperRef=useTemplateRef(`optionListWrapper`);let selectedTextColor=computed(()=>`var(--maz-${__props.color})`);let selectedBgColor=computed(()=>`color-mix(in srgb, var(--maz-${__props.color}) 10%, transparent)`);let SIZE_TEXT_CLASS={mini:`maz:text-xs`,xs:`maz:text-xs`,sm:`maz:text-sm`,md:`maz:text-base`,lg:`maz:text-lg`,xl:`maz:text-xl`};let{t}=useTranslations();let messages=computed(()=>({searchPlaceholder:__props.translations?.searchPlaceholder||t(`select.searchPlaceholder`)}));let isOpen=useModel(__props,`open`);let instanceId=useInstanceUniqId({componentName:`MazSelect`,providedId:__props.id});function getOptionPayload(option){return{[__props.optionValueKey]:option,[__props.optionLabelKey]:option,[__props.optionInputValueKey]:option}}function getNormalizedOptionPayload(option){return{...option,[__props.optionValueKey]:option[__props.optionValueKey],[__props.optionLabelKey]:option[__props.optionLabelKey],[__props.optionInputValueKey]:option[__props.optionInputValueKey]}}function getNormalizedOptions(options){let normalizedOptions=[];if(!options?.length)return[];for(let option of options)typeof option==`string`||typeof option==`number`||typeof option==`boolean`?normalizedOptions.push(getOptionPayload(option)):typeof option==`object`&&`options`in option&&Array.isArray(option.options)?normalizedOptions.push({label:option.label,isOptGroup:!0},...option.options.map(opt=>typeof opt==`string`||typeof opt==`number`||typeof opt==`boolean`?getOptionPayload(opt):getNormalizedOptionPayload(opt))):normalizedOptions.push(getNormalizedOptionPayload(option));return normalizedOptions}let optionsNormalized=computed(()=>getNormalizedOptions(__props.options??[]));function isOptionInSelection(option){return isNullOrUndefined(option[__props.optionValueKey])?!1:__props.multiple?Array.isArray(__props.modelValue)&&__props.modelValue.includes(option[__props.optionValueKey]):__props.modelValue===option[__props.optionValueKey]}let selectedOptions=computed(()=>optionsNormalized.value?.filter(isOptionInSelection)??[]);function isNullOrUndefined(value){return value==null}function isSelectedOption(option){return(selectedOptions.value?.some(selectedOption=>selectedOption[__props.optionValueKey]===option[__props.optionValueKey])??!1)&&!isNullOrUndefined(option[__props.optionValueKey])}let inputValue=computed(()=>{if(__props.multiple&&__props.modelValue&&Array.isArray(__props.modelValue)){let values=__props.modelValue.map(value=>optionsNormalized.value?.find(option=>option[__props.optionValueKey]===value)?.[__props.optionInputValueKey]);return __props.formatInputValue?__props.formatInputValue(values):values.join(`, `)}let selectedOption=optionsNormalized.value?.find(option=>option[__props.optionValueKey]===__props.modelValue);let value=isNullOrUndefined(__props.modelValue)?void 0:selectedOption?.[__props.optionInputValueKey];return __props.formatInputValue?__props.formatInputValue(value):value});let searchQuery=ref();let query=ref(``);function searchInValue(value,query){return query&&value&&normalizeString(value).includes(normalizeString(query))}function getFilteredOptionWithQuery(query){return query?optionsNormalized.value?.filter(option=>{let searchValue=option[__props.optionLabelKey];let searchValue3=option[__props.optionValueKey];let searchValue2=option[__props.optionInputValueKey];let threshold=__props.searchThreshold;return searchInValue(searchValue,query)||searchInValue(searchValue2,query)||searchInValue(searchValue3,query)||typeof searchValue==`string`&&useStringMatching(searchValue,query,threshold).isMatching.value||typeof searchValue2==`string`&&useStringMatching(searchValue2,query,threshold).isMatching.value||typeof searchValue3==`string`&&useStringMatching(searchValue3,query,threshold).isMatching.value}):optionsNormalized.value}let optionList=computed(()=>__props.searchFunction&&__props.search&&searchQuery.value?getNormalizedOptions(__props.searchFunction(searchQuery.value,__props.options??[])??[]):getFilteredOptionWithQuery(searchQuery.value));async function onOpenList(){let selectedIndex=optionList.value?.findIndex(option=>isSelectedOption(option));await scrollToOptionIndex(selectedIndex),emits(`open`)}function focusMainInput(){inputRef.value?.$el?.querySelector(`input`)?.focus()}function emitInputMainInput(){inputRef.value?.$el?.querySelector(`input`)?.dispatchEvent(new Event(`input`))}function focusSearchInputAndSetQuery(q){searchQuery.value=q,searchInputRef.value?.$el?.querySelector(`input`)?.focus()}function searchOptionWithQuery(keyPressed){keyPressed===`Backspace`&&query.value&&query.value.length>0?query.value=query.value.slice(0,-1):query.value+=keyPressed;let filteredOptions=getFilteredOptionWithQuery(query.value);if(!filteredOptions?.length)return;let optionIndex=optionList.value?.findIndex(option=>option[__props.optionValueKey]===filteredOptions[0][__props.optionValueKey]);typeof optionIndex!=`number`||optionIndex===-1||(scrollToOptionIndex(optionIndex),debounceCallback(()=>{query.value=``},1e3))}let isLetterOrNumberRegex=/^([\dA-Za-z\u0400-\u04FF])$/;function mainInputKeyboardHandler(event){if(event.ctrlKey||event.metaKey||event.altKey)return;let keyPressed=event.key;(keyPressed===`ArrowDown`||keyPressed===`ArrowUp`||isLetterOrNumberRegex.test(keyPressed))&&!isOpen.value&&(event.preventDefault(),popoverComponent.value?.open()),isLetterOrNumberRegex.test(keyPressed)&&__props.search&&(event.preventDefault(),event.stopPropagation(),focusSearchInputAndSetQuery(keyPressed))}async function scrollToOptionIndex(index){if(await nextTick(),typeof index!=`number`||index<0)return;let item=optionListElement.value?.querySelector(`.m-select-list-item:nth-child(${index+1})`);if(item&&optionListWrapperRef.value){let wrapperRect=optionListWrapperRef.value.getBoundingClientRect();let itemRect=item.getBoundingClientRect();let scrollTop=item.offsetTop-wrapperRect.height/2-itemRect.height;optionListWrapperRef.value.scrollTo?.({top:scrollTop,behavior:`auto`}),setTimeout(()=>{item.focus({preventScroll:!0})},100)}}function updateValue(inputOption,mustCloseList=!0){mustCloseList&&!__props.multiple&&nextTick(()=>{popoverComponent.value?.close()}),searchQuery.value=``;let isAlreadySelected=selectedOptions.value?.some(option=>option[__props.optionValueKey]===inputOption[__props.optionValueKey]);let newValue=selectedOptions.value;isAlreadySelected&&__props.multiple?newValue=newValue?.filter(option=>option[__props.optionValueKey]!==inputOption[__props.optionValueKey]):__props.multiple?newValue.push(inputOption):newValue=[inputOption];let selectedValues=newValue.map(option=>option[__props.optionValueKey]);emits(`update:model-value`,__props.multiple?selectedValues:selectedValues[0]),emits(`selected-option`,inputOption),emitInputMainInput(),focusMainInput()}function keydownHandler(event){let keyPressed=event.key;if(keyPressed===`ArrowDown`||keyPressed===`ArrowUp`){event.preventDefault();let itemLength=optionList.value?.length;if(!itemLength)return;let currentElement=document.activeElement;let itemsElements=document.querySelectorAll(`#${instanceId.value}-option-list .m-select-list-item`);let currentIndex=[...itemsElements].indexOf(currentElement);if(currentIndex===-1){itemsElements[0]?.focus({preventScroll:!0});return}itemsElements[keyPressed===`ArrowDown`?(currentIndex+1)%itemLength:(currentIndex-1+itemLength)%itemLength]?.focus()}else !__props.search&&isLetterOrNumberRegex.test(keyPressed)&&searchOptionWithQuery(keyPressed)}function updateListPosition(){nextTick(()=>{popoverComponent.value?.updatePosition()})}return watch(isOpen,value=>{isClient()&&(value?document.addEventListener(`keydown`,keydownHandler):document.removeEventListener(`keydown`,keydownHandler))},{immediate:!0}),onBeforeUnmount(()=>{document.removeEventListener(`keydown`,keydownHandler)}),__expose({open:()=>{popoverComponent.value?.open()},close:()=>{popoverComponent.value?.close()}}),(_ctx,_cache)=>(openBlock(),createBlock(MazPopover_default,{id:`${unref(instanceId)}-popover`,ref:`popover`,modelValue:isOpen.value,"onUpdate:modelValue":_cache[5]||=$event=>isOpen.value=$event,class:normalizeClass([`m-select m-reset-css maz:relative maz:inline-flex maz:align-top`,[{"--is-open":isOpen.value,"--disabled":__props.disabled},__props.class,`--${__props.size}`,SIZE_TEXT_CLASS[__props.size]]]),style:normalizeStyle(__props.style),trigger:`click`,block:__props.block,transition:__props.transition,offset:0,position:__props.listPosition,disabled:__props.disabled,"prefer-position":__props.preferPosition,"fallback-position":__props.fallbackPosition,"position-reference":`#${unref(instanceId)}-popover .m-input-wrapper`,onClose:_cache[6]||=$event=>emits(`close`),onOpen:onOpenList},{trigger:withCtx(({close,open:openPicker,toggle:togglePopover})=>[createVNode(MazInput_default,mergeProps({id:unref(instanceId),ref:`input`,class:`m-select-input`},_ctx.$attrs,{required:__props.required,"border-active":isOpen.value,color:__props.color,"model-value":inputValue.value,size:__props.size,block:__props.block,placeholder:__props.placeholder,label:__props.label,autocomplete:__props.autocomplete,disabled:__props.disabled,readonly:``,onChange:_cache[0]||=$event=>emits(`change`,$event),onInput:_cache[1]||=$event=>emits(`input`,$event),onFocus:_cache[2]||=$event=>emits(`focus`,$event),onBlur:_cache[3]||=$event=>emits(`blur`,$event),onKeydown:mainInputKeyboardHandler}),createSlots({"end-icon":withCtx(()=>[renderSlot(_ctx.$slots,`end-icon`,{isOpen:isOpen.value,close,open:openPicker,toggle:togglePopover},()=>[createElementVNode(`button`,{tabindex:`-1`,disabled:__props.disabled,type:`button`,class:`m-select-input__toggle-button maz-custom`,"aria-label":`${isOpen.value?`collapse`:`expand`} list of options`},[createVNode(MazIcon_default,{icon:unref(MazChevronDown),class:`m-select-chevron`},null,8,[`icon`])],8,_hoisted_1)],!0)]),_:2},[unref(hasSlotContent)(_ctx.$slots[`start-icon`])?{name:`start-icon`,fn:withCtx(()=>[renderSlot(_ctx.$slots,`start-icon`,{isOpen:isOpen.value,close,open:openPicker,toggle:togglePopover},void 0,!0)]),key:`0`}:void 0]),1040,[`id`,`required`,`border-active`,`color`,`model-value`,`size`,`block`,`placeholder`,`label`,`autocomplete`,`disabled`])]),default:withCtx(({close,open:openPicker,toggle:togglePopover})=>[createElementVNode(`div`,{id:`${unref(instanceId)}-option-list`,ref:`optionListRef`,class:normalizeClass([`m-select-list`,[`--${__props.size}`,SIZE_TEXT_CLASS[__props.size]]]),style:normalizeStyle([{maxHeight:`${__props.maxListHeight}px`,maxWidth:`${__props.maxListWidth}px`,minHeight:`${__props.minListHeight}px`,minWidth:`${__props.minListWidth}px`,"--selected-bg-color":selectedBgColor.value,"--selected-text-color":selectedTextColor.value}])},[__props.search?(openBlock(),createElementBlock(`div`,_hoisted_3,[createVNode(MazInput_default,{ref:`searchInput`,modelValue:searchQuery.value,"onUpdate:modelValue":[_cache[4]||=$event=>searchQuery.value=$event,updateListPosition],size:`sm`,disabled:__props.disabled,color:__props.color,placeholder:messages.value.searchPlaceholder,name:`search`,inputmode:`search`,autocomplete:`off`,block:``,class:`m-select-list__search-input maz:flex-none`,"start-icon":unref(MazMagnifyingGlass)},null,8,[`modelValue`,`disabled`,`color`,`placeholder`,`start-icon`])])):createCommentVNode(``,!0),!optionList.value||optionList.value.length<=0?renderSlot(_ctx.$slots,`no-results`,{key:1},()=>[createElementVNode(`span`,_hoisted_4,[createVNode(unref(MazNoSymbol),{class:`maz:size-6 maz:text-foreground`})])],!0):(openBlock(),createElementBlock(`div`,_hoisted_5,[(openBlock(!0),createElementBlock(Fragment,null,renderList(optionList.value,(option,i)=>(openBlock(),createElementBlock(Fragment,{key:i},[option.label&&option.isOptGroup?renderSlot(_ctx.$slots,`optgroup`,{key:0,label:option.label},()=>[createElementVNode(`span`,_hoisted_6,toDisplayString(option.label),1)],!0):(openBlock(),createElementBlock(`button`,{key:1,type:`button`,tabindex:__props.multiple?-1:0,class:normalizeClass([`m-select-list-item maz-custom maz:flex-none`,[{"--is-selected":isSelectedOption(option),"--is-none-value":isNullOrUndefined(option[__props.optionValueKey])}]]),style:normalizeStyle(__props.itemHeight?{height:`${__props.itemHeight}px`}:void 0),onClick:withModifiers($event=>updateValue(option,!0),[`prevent`,`stop`])},[__props.multiple?(openBlock(),createBlock(unref(MazCheckbox),{key:0,"model-value":isSelectedOption(option),size:`sm`,color:__props.color},null,8,[`model-value`,`color`])):createCommentVNode(``,!0),renderSlot(_ctx.$slots,`default`,{option,isSelected:isSelectedOption(option),isOpen:isOpen.value,close,open:openPicker,toggle:togglePopover},()=>[createElementVNode(`span`,null,toDisplayString(option[__props.optionLabelKey]),1)],!0)],14,_hoisted_7))],64))),128))],512))],14,_hoisted_2)]),_:3},8,[`id`,`modelValue`,`class`,`style`,`block`,`transition`,`position`,`disabled`,`prefer-position`,`fallback-position`,`position-reference`]))}}),[[`__scopeId`,`data-v-12f7d7b2`]]);export{MazSelect_default as t};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{useInstanceUniqId}from"../composables/useInstanceUniqId.js";import{t as _plugin_vue_export_helper_default}from"./_plugin-vue_export-helper.ChmETRGw.js";import{useDisplayNames}from"../composables/useDisplayNames.js";import{t as MazSelect_default}from"./MazSelect.
|
|
1
|
+
import{useInstanceUniqId}from"../composables/useInstanceUniqId.js";import{t as _plugin_vue_export_helper_default}from"./_plugin-vue_export-helper.ChmETRGw.js";import{useDisplayNames}from"../composables/useDisplayNames.js";import{t as MazSelect_default}from"./MazSelect.D0Bhctte.js";import{computed,createBlock,createCommentVNode,createElementBlock,createElementVNode,createVNode,defineAsyncComponent,defineComponent,mergeProps,normalizeClass,normalizeStyle,openBlock,renderSlot,toDisplayString,unref,withCtx}from"vue";import{useTranslations}from"@maz-ui/translations/composables/useTranslations";import{getBrowserLocale}from"@maz-ui/utils/helpers/getBrowserLocale";import{getCountryFlagUrl}from"@maz-ui/utils/helpers/getCountryFlagUrl";import '../assets/MazSelectCountry.B3E_sxoF.css';var _hoisted_1={key:0,class:`m-select-country__select__item__flag-container maz:flex maz:flex-center`};var _hoisted_2={key:1,class:`m-select-country__select__item__list-flag maz:flex maz:size-5 maz:flex-center maz:rounded-full maz:bg-primary-500 maz:text-xs maz:leading-none maz:text-primary-foreground/80`};var _hoisted_3={class:`maz:text-muted`};var MazSelectCountry_default=_plugin_vue_export_helper_default(defineComponent({inheritAttrs:!1,__name:`MazSelectCountry`,props:{style:{type:[Boolean,null,String,Object,Array]},class:{type:[Boolean,null,String,Object,Array]},id:{},color:{default:`primary`},size:{default:`md`},preferredCodes:{},ignoredCodes:{},onlyCodes:{},listPosition:{},hideFlags:{type:Boolean},search:{type:Boolean,default:!0},showCodeInList:{type:Boolean,default:!1},locale:{},success:{type:Boolean},error:{type:Boolean},warning:{type:Boolean},displayCode:{type:Boolean},searchThreshold:{},translations:{},hint:{},options:{},displayNamesOptions:{default:()=>({type:`region`,languageDisplay:`standard`,fallback:`code`,style:`long`})},codesType:{},open:{type:Boolean},label:{},placeholder:{},modelValue:{},optionValueKey:{default:`code`},optionLabelKey:{default:`name`},optionInputValueKey:{default:`name`},preferPosition:{},fallbackPosition:{},itemHeight:{},maxListHeight:{},maxListWidth:{default:250},minListHeight:{},minListWidth:{default:200},searchFunction:{type:Function},required:{type:Boolean},disabled:{type:Boolean},block:{type:Boolean},autocomplete:{},formatInputValue:{type:Function},transition:{}},emits:[`update:model-value`],setup(__props){let instanceId=useInstanceUniqId({componentName:`MazSelectCountry`,providedId:__props.id});let{t,locale:mazLocale}=useTranslations();let locale=computed(()=>__props.locale??mazLocale.value??getBrowserLocale());let MazLazyImg=defineAsyncComponent(()=>import(`../components/MazLazyImg.js`));let{getAllDisplayNames}=useDisplayNames(locale);let displayNames=getAllDisplayNames({type:()=>__props.displayNamesOptions.type,languageDisplay:()=>__props.displayNamesOptions.languageDisplay,fallback:()=>__props.displayNamesOptions.fallback,style:()=>__props.displayNamesOptions.style,onlyCodes:()=>__props.onlyCodes,excludedCodes:()=>__props.ignoredCodes,preferredCodes:()=>__props.preferredCodes,codesType:computed(()=>__props.codesType?__props.codesType:__props.displayNamesOptions.type===`region`?`country`:`iso`)});let countriesOptions=computed(()=>__props.options?__props.options:displayNames?.value??[]);let messages=computed(()=>({searchPlaceholder:__props.translations?.searchPlaceholder??t(`selectCountry.searchPlaceholder`)}));function getFlagUrl(code,size=`h20`){return getCountryFlagUrl(code.slice(0,2),size)||getCountryFlagUrl(code.slice(3,5),size)||getCountryFlagUrl(code,size)}let flagUrl=computed(()=>{if(__props.modelValue)return getFlagUrl(__props.modelValue)});return(_ctx,_cache)=>(openBlock(),createElementBlock(`div`,{class:normalizeClass([`m-select-country m-reset-css maz:relative maz:inline-flex`,[__props.class,{"--no-flags":__props.hideFlags}]]),style:normalizeStyle(__props.style)},[createVNode(MazSelect_default,mergeProps({id:unref(instanceId),"model-value":__props.modelValue},_ctx.$attrs,{class:`m-select-country__select`,"option-value-key":__props.optionValueKey,"option-label-key":__props.optionLabelKey,"option-input-value-key":__props.displayCode?`code`:__props.optionInputValueKey,"max-list-width":__props.maxListWidth,"min-list-width":__props.minListWidth,disabled:__props.disabled,color:__props.color,placeholder:__props.placeholder,label:__props.label,size:__props.size,multiple:!1,"list-position":__props.listPosition,error:__props.error,warning:__props.warning,success:__props.success,search:__props.search,block:__props.block,autocomplete:__props.autocomplete,"item-height":__props.itemHeight,"max-list-height":__props.maxListHeight,"min-list-height":__props.minListHeight,required:__props.required,"search-function":__props.searchFunction,"format-input-value":__props.formatInputValue,translations:messages.value,"search-threshold":__props.searchThreshold,options:countriesOptions.value,hint:__props.hint,open:__props.open,"onUpdate:modelValue":_cache[0]||=$event=>_ctx.$emit(`update:model-value`,$event)}),{"start-icon":withCtx(()=>[renderSlot(_ctx.$slots,`selector-flag`,{countryCode:__props.modelValue},()=>[flagUrl.value&&!__props.hideFlags?(openBlock(),createBlock(unref(MazLazyImg),{key:0,src:flagUrl.value,alt:__props.modelValue,width:`20`,height:`20`,class:`maz:size-5 maz:rounded-md`,"img-class":`maz:size-5 maz:rounded-md`},null,8,[`src`,`alt`])):createCommentVNode(``,!0)],!0)]),"no-results":withCtx(()=>[renderSlot(_ctx.$slots,`no-results`,{},void 0,!0)]),default:withCtx(({option,isSelected})=>[createElementVNode(`div`,{class:normalizeClass([`m-select-country__select__item maz:flex maz:w-full maz:items-center maz:gap-2 maz:truncate maz:text-sm`,{"m-select-country__select__item--selected":isSelected}])},[!__props.hideFlags&&typeof option.code==`string`?(openBlock(),createElementBlock(`span`,_hoisted_1,[renderSlot(_ctx.$slots,`country-list-flag`,{option,isSelected},()=>[option.code&&getFlagUrl(option.code)?(openBlock(),createBlock(unref(MazLazyImg),{key:0,src:getFlagUrl(option.code),alt:`${option.name} flag`,width:`20`,height:`20`,class:`maz:size-5 maz:rounded-md`,"img-class":`maz:rounded-md maz:h-5 maz:w-5`},null,8,[`src`,`alt`])):(openBlock(),createElementBlock(`span`,_hoisted_2,toDisplayString(option.code),1))],!0)])):createCommentVNode(``,!0),createElementVNode(`div`,{class:normalizeClass([`maz:flex maz:flex-1 maz:gap-2 maz:truncate`,{"maz:font-semibold":isSelected}])},[__props.showCodeInList?renderSlot(_ctx.$slots,`country-list-code`,{key:0,option,isSelected},()=>[createElementVNode(`span`,_hoisted_3,toDisplayString(option.code),1)],!0):createCommentVNode(``,!0),renderSlot(_ctx.$slots,`country-list-name`,{option,isSelected},()=>[createElementVNode(`span`,null,toDisplayString(option.name),1)],!0)],2)],2)]),_:3},16,`id.model-value.option-value-key.option-label-key.option-input-value-key.max-list-width.min-list-width.disabled.color.placeholder.label.size.list-position.error.warning.success.search.block.autocomplete.item-height.max-list-height.min-list-height.required.search-function.format-input-value.translations.search-threshold.options.hint.open`.split(`.`))],6))}}),[[`__scopeId`,`data-v-01e115f5`]]);export{MazSelectCountry_default as t};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{useInstanceUniqId}from"../composables/useInstanceUniqId.js";import{t as _plugin_vue_export_helper_default}from"./_plugin-vue_export-helper.ChmETRGw.js";import{n as readInitialAutofillValue,t as onAutofillSync}from"./autofillSync.B_LuRBKI.js";import{computed,createCommentVNode,createElementBlock,createElementVNode,createTextVNode,defineComponent,mergeProps,normalizeClass,normalizeStyle,onBeforeUnmount,onMounted,openBlock,ref,renderSlot,toDisplayString,toHandlers,unref,useSlots,vModelText,withDirectives}from"vue";import '../assets/MazTextarea.B165I3tW.css';var _hoisted_1=[`for`];var _hoisted_2=[`for`];var _hoisted_3=[`for`];var _hoisted_4={key:1};var _hoisted_5={key:2};var _hoisted_6=[`id`,`placeholder`,`name`,`disabled`,`readonly`,`required`];var _hoisted_7={key:1,class:`m-textarea__append maz:inline-flex`};var MazTextarea_default=_plugin_vue_export_helper_default(defineComponent({inheritAttrs:!1,__name:`MazTextarea`,props:{style:{type:[Boolean,null,String,Object,Array]},class:{type:[Boolean,null,String,Object,Array]},modelValue:{},id:{},name:{default:`MazTextarea`},label:{},placeholder:{},required:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},readonly:{type:Boolean,default:!1},error:{type:Boolean,default:!1},success:{type:Boolean,default:!1},warning:{type:Boolean,default:!1},hint:{},color:{default:`primary`},roundedSize:{default:`md`},padding:{type:Boolean,default:!0},transparent:{type:Boolean,default:!1},border:{type:Boolean,default:!0},autogrow:{type:Boolean,default:!0},appendJustify:{default:`end`},topLabel:{},assistiveText:{}},emits:[`update:model-value`,`input`,`focus`,`blur`,`change`],setup(__props,{emit:__emit}){let emits=__emit;let instanceId=useInstanceUniqId({componentName:`MazTextarea`,providedId:__props.id});let initialAutofillValue=readInitialAutofillValue(instanceId.value);let textarea=ref();let inputValue=computed({get:()=>__props.modelValue,set:value=>{emits(`update:model-value`,value),emits(`input`,value)}});function focus(event){emits(`focus`,event)}function blur(event){emits(`blur`,event)}function change(event){emits(`change`,event)}let slots=useSlots();let hasLabelOrHint=computed(()=>__props.label||__props.hint||!!slots.label);let hasAppend=computed(()=>!!slots.append);let borderStyle=computed(()=>__props.error?`maz:border-destructive`:__props.success?`maz:border-success`:__props.warning?`maz:border-warning`:`--default-border maz:border-divider maz:dark:border-divider-400`);let autofillCleanup;onMounted(()=>{textarea.value&&(initialAutofillValue&&textarea.value.value!==initialAutofillValue&&(textarea.value.value=initialAutofillValue,initialAutofillValue!==__props.modelValue&&emits(`update:model-value`,initialAutofillValue)),autofillCleanup=onAutofillSync(textarea.value,value=>{value!==__props.modelValue&&emits(`update:model-value`,value)}))}),onBeforeUnmount(()=>{autofillCleanup?.()});let ROUNDED_CLASS={none:``,sm:`maz:rounded-xs`,md:`maz:rounded-md`,lg:`maz:rounded-lg`,xl:`maz:rounded-xl`,full:`maz:rounded-full`};let stateLabelColor=computed(()=>[{"maz:text-destructive-600":__props.error,"maz:text-success-600":__props.success,"maz:text-warning-600":__props.warning}]);return(_ctx,_cache)=>(openBlock(),createElementBlock(`div`,{class:normalizeClass([`m-textarea-wrapper m-reset-css maz:flex maz:flex-col maz:gap-2`,__props.class]),style:normalizeStyle(__props.style)},[__props.topLabel?(openBlock(),createElementBlock(`label`,{key:0,for:unref(instanceId),class:normalizeClass([`m-textarea__top-label`,stateLabelColor.value]),style:{fontWeight:`var(--maz-input-top-label-font-weight, 600)`}},toDisplayString(__props.topLabel),11,_hoisted_1)):createCommentVNode(``,!0),createElementVNode(`label`,{class:normalizeClass([`m-textarea maz:relative maz:flex maz:min-h-25 maz:flex-col maz:align-top maz:text-foreground`,[{"--is-disabled":__props.disabled,"--has-label":hasLabelOrHint.value,"--background-transparent":__props.transparent,"--has-placeholder":!!__props.placeholder,"--autogrow":__props.autogrow,"maz:px-4 maz:py-3":__props.padding,"maz:border maz:border-solid":__props.border&&!__props.disabled,"maz:bg-input":!__props.transparent&&!__props.disabled,"maz:disabled-cursor maz:border-divider maz:bg-surface-600 maz:text-muted maz:dark:border-divider-400 maz:dark:bg-surface-400":__props.disabled},borderStyle.value,ROUNDED_CLASS[__props.roundedSize],`--${__props.color}`]]),for:unref(instanceId),style:normalizeStyle([`--append-justify: ${__props.appendJustify}`])},[hasLabelOrHint.value?(openBlock(),createElementBlock(`label`,{key:0,for:unref(instanceId),class:normalizeClass([`m-textarea__label`,[...stateLabelColor.value,{"--has-state":__props.error||__props.warning||__props.success}]])},[__props.hint?(openBlock(),createElementBlock(`span`,_hoisted_4,toDisplayString(__props.hint),1)):renderSlot(_ctx.$slots,`label`,{key:0},()=>[createTextVNode(toDisplayString(__props.label),1)],!0),__props.required?(openBlock(),createElementBlock(`sup`,_hoisted_5,`*`)):createCommentVNode(``,!0)],10,_hoisted_3)):createCommentVNode(``,!0),withDirectives(createElementVNode(`textarea`,mergeProps({id:unref(instanceId),ref_key:`textarea`,ref:textarea},_ctx.$attrs,{"onUpdate:modelValue":_cache[0]||=$event=>inputValue.value=$event,placeholder:__props.placeholder||` `,name:__props.name,disabled:__props.disabled,readonly:__props.readonly,required:__props.required,class:{"--has-append":hasAppend.value}},toHandlers({blur,focus,change},!0)),null,16,_hoisted_6),[[vModelText,inputValue.value]]),hasAppend.value?(openBlock(),createElementBlock(`div`,_hoisted_7,[renderSlot(_ctx.$slots,`append`,{},void 0,!0)])):createCommentVNode(``,!0)],14,_hoisted_2),__props.assistiveText?(openBlock(),createElementBlock(`div`,{key:1,class:normalizeClass([`m-textarea__bottom-text maz:-mt-1 maz:text-sm`,[{"maz:text-destructive-600":__props.error,"maz:text-success-600":__props.success,"maz:text-warning-600":__props.warning,"maz:text-muted":!__props.error&&!__props.success&&!__props.warning}]])},toDisplayString(__props.assistiveText),3)):createCommentVNode(``,!0)],6))}}),[[`__scopeId`,`data-v-6f0a6f64`]]);export{MazTextarea_default as t};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{t as _plugin_vue_export_helper_default}from"./_plugin-vue_export-helper.ChmETRGw.js";import{useInjectStrict}from"../composables/useInjectStrict.js";import{t as MazInput_default}from"./MazInput.
|
|
1
|
+
import{t as _plugin_vue_export_helper_default}from"./_plugin-vue_export-helper.ChmETRGw.js";import{useInjectStrict}from"../composables/useInjectStrict.js";import{t as MazInput_default}from"./MazInput.C5wxW29_.js";import{computed,createBlock,defineComponent,mergeModels,mergeProps,onMounted,openBlock,ref,unref,useModel,useTemplateRef}from"vue";import{useTranslations}from"@maz-ui/translations/composables/useTranslations";import{AsYouType,getCountries,getCountryCallingCode,getExampleNumber,isSupportedCountry,parsePhoneNumberFromString}from"libphonenumber-js";import{fetchLocaleIp}from"@maz-ui/utils/helpers/fetchLocaleIp";import '../assets/PhoneInput.B7NIGHOT.css';var examples=ref();function isCountryAvailable(locale){try{return isSupportedCountry(locale)||(console.error(`[maz-ui](MazInputPhoneNumber) The code country "${locale}" is not available`),!1)}catch(error){return console.error(`[maz-ui](MazInputPhoneNumber) ${error}`),!1}}function getPhoneNumberResults({phoneNumber,countryCode,checkCountryCode=!1}){try{if(!phoneNumber)return{isValid:!1,countryCode};let parsedNumber=parsePhoneNumberFromString(phoneNumber,countryCode??void 0);return{isValid:(parsedNumber?.isValid()??!1)&&!!(!(countryCode&&checkCountryCode)||parsedNumber?.country&&countryCode===parsedNumber.country),countryCode,parsedCountryCode:parsedNumber?.country,isPossible:parsedNumber?.isPossible(),countryCallingCode:parsedNumber?.countryCallingCode,nationalNumber:parsedNumber?.nationalNumber,type:parsedNumber?.getType(),formatInternational:parsedNumber?.formatInternational(),formatNational:parsedNumber?.formatNational(),uri:parsedNumber?.getURI(),e164:parsedNumber?.format(`E.164`),rfc3966:parsedNumber?.format(`RFC3966`),possibleCountries:parsedNumber?.getPossibleCountries(),phoneNumber}}catch(error){throw Error(`[MazInputPhoneNumber](getResultsFromPhoneNumber) ${error}`,{cause:error})}}async function getPhoneNumberExamplesFile(){let{default:data}=await import(`libphonenumber-js/examples.mobile.json`);return data}function getPhoneNumberExample(countryCode){try{return examples.value&&countryCode?getExampleNumber(countryCode,examples.value)?.formatNational():void 0}catch(error){console.error(`[maz-ui](MazInputPhoneNumber) ${error}`)}}function getAsYouTypeFormat(countryCode,phoneNumber){try{return!phoneNumber||!countryCode||typeof countryCode!=`string`||countryCode.length!==2?phoneNumber:new AsYouType(countryCode).input(phoneNumber)}catch(error){return console.error(`[MazInputPhoneNumber](getAsYouTypeFormat) Error with countryCode: "${countryCode}", phoneNumber: "${phoneNumber}"`,error),phoneNumber}}function isSameCountryCallingCode(countryCode,countryCode2){return getCountryCallingCode(countryCode)===getCountryCallingCode(countryCode2)}async function loadExamples(){try{if(examples.value)return;examples.value=await getPhoneNumberExamplesFile()}catch(error){console.error(`[maz-ui](MazInputPhoneNumber) while loading phone number examples file`,error)}}function useLibphonenumber(){return{examples,getAsYouTypeFormat,getPhoneNumberResults,getPhoneNumberExamplesFile,getPhoneNumberExample,isSameCountryCallingCode,isCountryAvailable,getCountries,getCountryCallingCode,loadExamples}}function getBrowserLocale(){if(globalThis.window===void 0)return;let browserLocale=globalThis.navigator.language;if(!browserLocale)return;let parts=browserLocale.split(`-`);let locale=parts.length>1?parts[1].slice(0,2).toUpperCase():parts[0].slice(0,2).toUpperCase();return locale===`EN`&&(locale=`US`),locale===`JA`&&(locale=`JP`),{locale,browserLocale}}var displayNamesInstance;var displayNamesLocale;function getCountryName(locale,code,customCountriesNameListByIsoCode){return customCountriesNameListByIsoCode?.[code]?customCountriesNameListByIsoCode[code]:((displayNamesLocale!==locale||!displayNamesInstance)&&(displayNamesLocale=locale,displayNamesInstance=new Intl.DisplayNames([locale],{type:`region`})),displayNamesInstance.of(code))}function getCountryList(locale,customCountriesNameListByIsoCode){let countriesList=[];let isoList=getCountries();locale=locale??getBrowserLocale()?.browserLocale??`en-US`;for(let code of isoList){let name=getCountryName(locale,code,customCountriesNameListByIsoCode);if(name)try{let dialCode=getCountryCallingCode(code);countriesList.push({code,dialCode,name})}catch(error){console.error(`[MazInputPhoneNumber](getCountryCallingCode) ${error}`)}}return countriesList}async function fetchCountryCode(){try{let countryCode=await fetchLocaleIp();return countryCode?{data:countryCode,error:void 0}:{data:void 0,error:Error(`[MazInputPhoneNumber](fetchCountryCode) No country code found`)}}catch(error){return{data:void 0,error:Error(`[MazInputPhoneNumber](fetchCountryCode) ${error}`)}}}var isLetterOrNumberRegex=/[^\d ()+-]/g;function sanitizePhoneNumber(input){return input?input.replaceAll(isLetterOrNumberRegex,``).trim():``}function useMazInputPhoneNumber(){return{fetchCountryCode,getBrowserLocale,getCountryList,sanitizePhoneNumber}}var PhoneInput_default=_plugin_vue_export_helper_default(defineComponent({__name:`PhoneInput`,props:mergeModels({style:{type:[Boolean,null,String,Object,Array]},class:{type:[Boolean,null,String,Object,Array]},placeholder:{},label:{},topLabel:{},assistiveText:{},color:{},type:{},required:{type:Boolean},disabled:{type:Boolean},readonly:{type:Boolean},id:{},error:{type:Boolean},success:{type:Boolean},warning:{type:Boolean},hint:{},inputClasses:{},border:{type:Boolean},inputmode:{},size:{},debounce:{type:[Boolean,Number]},autoFocus:{type:Boolean},borderActive:{type:Boolean},startIcon:{type:[String,Function,Object]},endIcon:{type:[String,Function,Object]},roundedSize:{},block:{type:Boolean},name:{},autocomplete:{},loading:{type:Boolean},locales:{},example:{type:Boolean},hasRadius:{type:Boolean},autoFormat:{type:[String,Boolean]}},{modelValue:{},modelModifiers:{}}),emits:[`update:modelValue`],setup(__props,{expose:__expose}){let{getPhoneNumberExample,getAsYouTypeFormat,loadExamples}=useLibphonenumber();let{sanitizePhoneNumber}=useMazInputPhoneNumber();let{results,selectedCountry}=useInjectStrict(`mazInputPhoneNumberData`);let modelValue=useModel(__props,`modelValue`);let inputFocused=ref(!1);let asYouTypeFormatted=computed(()=>{let phoneNumberToFormat=results.value.isValid?results.value.formatNational:modelValue.value;return getAsYouTypeFormat(selectedCountry.value,phoneNumberToFormat)||phoneNumberToFormat});let displayedPhoneNumber=computed({get:()=>!inputFocused.value&&__props.autoFormat===`blur`||__props.autoFormat===`typing`?asYouTypeFormatted.value:modelValue.value,set:value=>{modelValue.value=sanitizePhoneNumber(value)}});let{t}=useTranslations();function getCountryPhoneNumberExample(selectedCountry){let example=getPhoneNumberExample(selectedCountry);if(example)return __props.locales.example?__props.locales.example.replace(`{example}`,example):t(`inputPhoneNumber.phoneInput.example`,{example})}let inputLabelOrPlaceholder=computed(()=>{if(__props.label||__props.placeholder)return __props.label||__props.placeholder;let defaultPlaceholder=__props.locales.placeholder;if(!__props.example||!inputFocused.value)return defaultPlaceholder;{let phoneExample=getCountryPhoneNumberExample(selectedCountry.value);return results.value?.isValid||!phoneExample?defaultPlaceholder:phoneExample}});let inputProps=computed(()=>__props.placeholder?{placeholder:inputLabelOrPlaceholder.value}:{label:inputLabelOrPlaceholder.value});onMounted(()=>{__props.example&&loadExamples()});let inputRef=useTemplateRef(`input`);return __expose({focus:()=>{inputRef.value?.$el.querySelector(`input`)?.focus()}}),(_ctx,_cache)=>(openBlock(),createBlock(MazInput_default,mergeProps({id:__props.id},{..._ctx.$attrs,...inputProps.value},{ref:`input`,modelValue:displayedPhoneNumber.value,"onUpdate:modelValue":_cache[0]||=$event=>displayedPhoneNumber.value=$event,disabled:__props.disabled,color:__props.color,error:__props.error,warning:__props.warning,hint:__props.hint,size:__props.size,success:__props.success,block:``,name:__props.name,inputmode:__props.inputmode,autocomplete:__props.autocomplete,class:[`m-phone-input maz:min-w-52 maz:flex-1`,[__props.class,{"--border-radius":__props.hasRadius,"maz:z-1":__props.error||!unref(results).isValid||inputFocused.value}]],style:__props.style,onFocus:_cache[1]||=$event=>inputFocused.value=!0,onBlur:_cache[2]||=$event=>inputFocused.value=!1}),null,16,[`id`,`modelValue`,`disabled`,`color`,`error`,`warning`,`hint`,`size`,`success`,`name`,`inputmode`,`autocomplete`,`class`,`style`]))}}),[[`__scopeId`,`data-v-ee1617ff`]]);export{useMazInputPhoneNumber as n,useLibphonenumber as r,PhoneInput_default as t};
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
var ANIMATION_NAME=`maz-autofill-start`;var STYLE_ELEMENT_ID=`maz-autofill-sync`;function ensureStylesInjected(){if(typeof document>`u`||document.getElementById(STYLE_ELEMENT_ID))return;let style=document.createElement(`style`);style.id=STYLE_ELEMENT_ID,style.textContent=`
|
|
2
|
+
@keyframes ${ANIMATION_NAME} { from {} to {} }
|
|
3
|
+
[data-maz-autofill-sync]:-webkit-autofill,
|
|
4
|
+
[data-maz-autofill-sync]:autofill {
|
|
5
|
+
animation-name: ${ANIMATION_NAME};
|
|
6
|
+
animation-duration: 1ms;
|
|
7
|
+
}
|
|
8
|
+
`,document.head.appendChild(style)}function readInitialAutofillValue(id){if(typeof document>`u`)return;let el=document.getElementById(id);if(el instanceof HTMLInputElement||el instanceof HTMLTextAreaElement)return el.value||void 0}function onAutofillSync(field,onSync){ensureStylesInjected(),field.setAttribute(`data-maz-autofill-sync`,``);function handleAnimationStart(event){event.animationName===ANIMATION_NAME&&onSync(event.target.value)}return field.addEventListener(`animationstart`,handleAnimationStart),()=>{field.removeEventListener(`animationstart`,handleAnimationStart),field.removeAttribute(`data-maz-autofill-sync`)}}export{readInitialAutofillValue as n,onAutofillSync as t};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{t as MazInput_default}from"../chunks/MazInput.
|
|
1
|
+
import{t as MazInput_default}from"../chunks/MazInput.C5wxW29_.js";export{MazInput_default as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{t as MazInputNumber_default}from"../chunks/MazInputNumber.
|
|
1
|
+
import{t as MazInputNumber_default}from"../chunks/MazInputNumber.H3hDFruX.js";export{MazInputNumber_default as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{t as PhoneInput_default}from"../../chunks/PhoneInput.
|
|
1
|
+
import{t as PhoneInput_default}from"../../chunks/PhoneInput.DXI3UxdG.js";export{PhoneInput_default as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{t as MazInputPhoneNumber_default}from"../chunks/MazInputPhoneNumber.
|
|
1
|
+
import{t as MazInputPhoneNumber_default}from"../chunks/MazInputPhoneNumber.DSKkCU9W.js";export{MazInputPhoneNumber_default as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{t as MazInputPrice_default}from"../chunks/MazInputPrice.
|
|
1
|
+
import{t as MazInputPrice_default}from"../chunks/MazInputPrice.vwVZLIjo.js";export{MazInputPrice_default as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{t as MazInputTags_default}from"../chunks/MazInputTags.
|
|
1
|
+
import{t as MazInputTags_default}from"../chunks/MazInputTags.Cbo7mrA-.js";export{MazInputTags_default as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{t as MazSelect_default}from"../chunks/MazSelect.
|
|
1
|
+
import{t as MazSelect_default}from"../chunks/MazSelect.D0Bhctte.js";export{MazSelect_default as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{t as MazSelectCountry_default}from"../chunks/MazSelectCountry.
|
|
1
|
+
import{t as MazSelectCountry_default}from"../chunks/MazSelectCountry.DG9eMPlJ.js";export{MazSelectCountry_default as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{t as MazTextarea_default}from"../chunks/MazTextarea.
|
|
1
|
+
import{t as MazTextarea_default}from"../chunks/MazTextarea.CvuA5KZc.js";export{MazTextarea_default as default};
|
package/dist/components/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{t as MazPopover_default}from"../chunks/MazPopover.BZG8J4IR.js";import{t as MazWindowMockup_default}from"../chunks/MazWindowMockup.BPtZQS_5.js";import{t as MazUiProvider_default}from"../chunks/MazUiProvider.DlRehEZH.js";import{n as mazSidebarKey,t as MazSidebar_default}from"../chunks/MazSidebar.DtJV3Qus.js";import{t as MazTimeline_default}from"../chunks/MazTimeline.CwgMKnxB.js";import{t as MazTicker_default}from"../chunks/MazTicker.IC-g93GQ.js";import{t as MazTextarea_default}from"../chunks/MazTextarea.
|
|
1
|
+
import{t as MazPopover_default}from"../chunks/MazPopover.BZG8J4IR.js";import{t as MazWindowMockup_default}from"../chunks/MazWindowMockup.BPtZQS_5.js";import{t as MazUiProvider_default}from"../chunks/MazUiProvider.DlRehEZH.js";import{n as mazSidebarKey,t as MazSidebar_default}from"../chunks/MazSidebar.DtJV3Qus.js";import{t as MazTimeline_default}from"../chunks/MazTimeline.CwgMKnxB.js";import{t as MazTicker_default}from"../chunks/MazTicker.IC-g93GQ.js";import{t as MazTextarea_default}from"../chunks/MazTextarea.CvuA5KZc.js";import{t as MazTabsContentItem_default}from"../chunks/MazTabsContentItem.FeabvNjK.js";import{t as MazTabsContent_default}from"../chunks/MazTabsContent.3n3JMUhb.js";import{t as MazTabsBar_default}from"../chunks/MazTabsBar.BtzkarA9.js";import{t as MazTabs_default}from"../chunks/MazTabs.BKiO8ea3.js";import{t as MazIcon_default}from"../chunks/MazIcon.BKcg5YfP.js";import{t as MazTable_default}from"../chunks/MazTable.DLv0EPdq.js";import{t as MazTableTitle_default}from"../chunks/MazTableTitle.CanAyB3B.js";import{t as MazTableRow_default}from"../chunks/MazTableRow.DdgQXUjE.js";import{t as MazTableCell_default}from"../chunks/MazTableCell.8KquT_rl.js";import{t as MazSwitch_default}from"../chunks/MazSwitch.CehyUAVa.js";import{t as MazStepper_default}from"../chunks/MazStepper.CVSQcw6J.js";import{t as MazSpinner_default}from"../chunks/MazSpinner.DSO951_i.js";import{t as MazSlider_default}from"../chunks/MazSlider.DzOgeA_f.js";import{t as MazSkeleton_default}from"../chunks/MazSkeleton.Dx2Wx-KY.js";import{t as MazSidebarTrigger_default}from"../chunks/MazSidebarTrigger.BAIhFZ_Y.js";import{t as MazSidebarSeparator_default}from"../chunks/MazSidebarSeparator.DSzlCQPt.js";import{t as MazSidebarMenuSub_default}from"../chunks/MazSidebarMenuSub.O1gmR7hF.js";import{t as MazSidebarMenuItem_default}from"../chunks/MazSidebarMenuItem.DGa-3pkn.js";import{t as MazSidebarMenuButton_default}from"../chunks/MazSidebarMenuButton.C3FO7ruZ.js";import{t as MazSidebarMenu_default}from"../chunks/MazSidebarMenu.BVJTEclJ.js";import{t as MazSidebarHeader_default}from"../chunks/MazSidebarHeader.D3wbhaMr.js";import{t as MazSidebarGroup_default}from"../chunks/MazSidebarGroup.CE6R9SPE.js";import{t as MazSidebarFooter_default}from"../chunks/MazSidebarFooter.6zWxAfIW.js";import{t as MazSidebarContent_default}from"../chunks/MazSidebarContent.DXrKEUe2.js";import{t as MazInput_default}from"../chunks/MazInput.C5wxW29_.js";import{t as MazSelect_default}from"../chunks/MazSelect.D0Bhctte.js";import{t as MazSelectCountry_default}from"../chunks/MazSelectCountry.DG9eMPlJ.js";import{t as MazReadingProgressBar_default}from"../chunks/MazReadingProgressBar.B4O-DlKc.js";import{t as MazLink_default}from"../chunks/MazLink.DNRMFwxx.js";import{t as MazReadMore_default}from"../chunks/MazReadMore.Gi36G0ie.js";import{t as MazRadioButtons_default}from"../chunks/MazRadioButtons.CujnlCek.js";import{t as MazRadio_default}from"../chunks/MazRadio.BxPh6uNY.js";import{t as MazPullToRefresh_default}from"../chunks/MazPullToRefresh.Cv9fdXAR.js";import{t as MazBtn_default}from"../chunks/MazBtn.BbzUbXCS.js";import{t as MazPagination_default}from"../chunks/MazPagination.qBHT1H5C.js";import{t as MazLoadingBar_default}from"../chunks/MazLoadingBar.8VIbG1FC.js";import{t as MazLazyImg_default}from"../chunks/MazLazyImg.C-rXKwgk.js";import{t as MazInputTags_default}from"../chunks/MazInputTags.Cbo7mrA-.js";import{t as MazInputPrice_default}from"../chunks/MazInputPrice.vwVZLIjo.js";import{t as MazInputPhoneNumber_default}from"../chunks/MazInputPhoneNumber.DSKkCU9W.js";import{t as MazInputNumber_default}from"../chunks/MazInputNumber.H3hDFruX.js";import{t as MazInputCode_default}from"../chunks/MazInputCode.Clw49atB.js";import{t as MazGallery_default}from"../chunks/MazGallery.CxTVI2eq.js";import{t as MazFullscreenLoader_default}from"../chunks/MazFullscreenLoader.DdJwziyG.js";import{t as MazExpandAnimation_default}from"../chunks/MazExpandAnimation.2yfCUs-B.js";import{t as MazDropzone_default}from"../chunks/MazDropzone.pYZqQMx-.js";import{t as MazDropdown_default}from"../chunks/MazDropdown.Bks10tZ-.js";import{t as MazBackdrop_default}from"../chunks/MazBackdrop.Dr4Jzi7i.js";import{t as MazDrawer_default}from"../chunks/MazDrawer.wiCtW3te.js";import{t as MazDialog_default}from"../chunks/MazDialog.DPDetEnB.js";import{n as useMazDialogConfirm,t as MazDialogConfirm_default}from"../chunks/MazDialogConfirm.CMjHcqtL.js";import{t as MazDatePicker_default}from"../chunks/MazDatePicker.BQv_VjLC.js";import{t as MazContainer_default}from"../chunks/MazContainer.Cxym3mwp.js";import{t as MazCodeHighlight_default}from"../chunks/MazCodeHighlight.SRyNl3m0.js";import{t as MazCircularProgressBar_default}from"../chunks/MazCircularProgressBar.CPVPaqix.js";import{t as MazCardSpotlight_default}from"../chunks/MazCardSpotlight.Cp-9GWEo.js";import{t as MazCheckbox_default}from"../chunks/MazCheckbox.CxZ9h3wO.js";import{t as MazChecklist_default}from"../chunks/MazChecklist.BnfCIFqV.js";import{t as MazChart_default}from"../chunks/MazChart.rgunYvSL.js";import{t as MazCarousel_default}from"../chunks/MazCarousel.zQtP-Ko6.js";import{t as MazCard_default}from"../chunks/MazCard.QIBcwdOh.js";import{t as MazBtnGroup_default}from"../chunks/MazBtnGroup.Bzp5sJdI.js";import{t as MazBottomSheet_default}from"../chunks/MazBottomSheet.rynuS491.js";import{t as MazBadge_default}from"../chunks/MazBadge.sGi-WO8_.js";import{t as MazAvatar_default}from"../chunks/MazAvatar.DBPOlZ55.js";import{t as MazAnimatedText_default}from"../chunks/MazAnimatedText.iQfrDH56.js";import{t as MazAnimatedElement_default}from"../chunks/MazAnimatedElement.BhKCkwho.js";import{t as MazAnimatedCounter_default}from"../chunks/MazAnimatedCounter.Rk-yM4N2.js";import{t as MazAlert_default}from"../chunks/MazAlert.B64HfK6T.js";import{t as MazAccordion_default}from"../chunks/MazAccordion.C1kFmgOd.js";export{MazAccordion_default as MazAccordion,MazAlert_default as MazAlert,MazAnimatedCounter_default as MazAnimatedCounter,MazAnimatedElement_default as MazAnimatedElement,MazAnimatedText_default as MazAnimatedText,MazAvatar_default as MazAvatar,MazBackdrop_default as MazBackdrop,MazBadge_default as MazBadge,MazBottomSheet_default as MazBottomSheet,MazBtn_default as MazBtn,MazBtnGroup_default as MazBtnGroup,MazCard_default as MazCard,MazCardSpotlight_default as MazCardSpotlight,MazCarousel_default as MazCarousel,MazChart_default as MazChart,MazCheckbox_default as MazCheckbox,MazChecklist_default as MazChecklist,MazCircularProgressBar_default as MazCircularProgressBar,MazCodeHighlight_default as MazCodeHighlight,MazContainer_default as MazContainer,MazDatePicker_default as MazDatePicker,MazDialog_default as MazDialog,MazDialogConfirm_default as MazDialogConfirm,MazDrawer_default as MazDrawer,MazDropdown_default as MazDropdown,MazDropzone_default as MazDropzone,MazExpandAnimation_default as MazExpandAnimation,MazFullscreenLoader_default as MazFullscreenLoader,MazGallery_default as MazGallery,MazIcon_default as MazIcon,MazInput_default as MazInput,MazInputCode_default as MazInputCode,MazInputNumber_default as MazInputNumber,MazInputPhoneNumber_default as MazInputPhoneNumber,MazInputPrice_default as MazInputPrice,MazInputTags_default as MazInputTags,MazLazyImg_default as MazLazyImg,MazLink_default as MazLink,MazLoadingBar_default as MazLoadingBar,MazPagination_default as MazPagination,MazPopover_default as MazPopover,MazPullToRefresh_default as MazPullToRefresh,MazRadio_default as MazRadio,MazRadioButtons_default as MazRadioButtons,MazReadMore_default as MazReadMore,MazReadingProgressBar_default as MazReadingProgressBar,MazSelect_default as MazSelect,MazSelectCountry_default as MazSelectCountry,MazSidebar_default as MazSidebar,MazSidebarContent_default as MazSidebarContent,MazSidebarFooter_default as MazSidebarFooter,MazSidebarGroup_default as MazSidebarGroup,MazSidebarHeader_default as MazSidebarHeader,MazSidebarMenu_default as MazSidebarMenu,MazSidebarMenuButton_default as MazSidebarMenuButton,MazSidebarMenuItem_default as MazSidebarMenuItem,MazSidebarMenuSub_default as MazSidebarMenuSub,MazSidebarSeparator_default as MazSidebarSeparator,MazSidebarTrigger_default as MazSidebarTrigger,MazSkeleton_default as MazSkeleton,MazSlider_default as MazSlider,MazSpinner_default as MazSpinner,MazStepper_default as MazStepper,MazSwitch_default as MazSwitch,MazTable_default as MazTable,MazTableCell_default as MazTableCell,MazTableRow_default as MazTableRow,MazTableTitle_default as MazTableTitle,MazTabs_default as MazTabs,MazTabsBar_default as MazTabsBar,MazTabsContent_default as MazTabsContent,MazTabsContentItem_default as MazTabsContentItem,MazTextarea_default as MazTextarea,MazTicker_default as MazTicker,MazTimeline_default as MazTimeline,MazUiProvider_default as MazUiProvider,MazWindowMockup_default as MazWindowMockup,mazSidebarKey,useMazDialogConfirm};
|
|
@@ -1,4 +1,11 @@
|
|
|
1
1
|
type AutofillableField = HTMLInputElement | HTMLTextAreaElement;
|
|
2
|
+
/**
|
|
3
|
+
* Reads the current DOM value of an input/textarea by id. Must be called
|
|
4
|
+
* synchronously during `setup()` so the SSR-rendered DOM (possibly carrying a
|
|
5
|
+
* pre-hydration browser autofill) can be captured before Vue's built-in
|
|
6
|
+
* `vModelText.mounted` hook overwrites `el.value`.
|
|
7
|
+
*/
|
|
8
|
+
export declare function readInitialAutofillValue(id: string): string | undefined;
|
|
2
9
|
/**
|
|
3
10
|
* Detects browser autofill on an input or textarea and syncs the value.
|
|
4
11
|
*
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "maz-ui",
|
|
3
3
|
"type": "module",
|
|
4
|
-
"version": "5.0.0-beta.
|
|
4
|
+
"version": "5.0.0-beta.19",
|
|
5
5
|
"description": "A standalone components library for Vue.Js 3 & Nuxt.Js 3",
|
|
6
6
|
"author": "Louis Mazel <me@loicmazuel.com>",
|
|
7
7
|
"license": "MIT",
|
|
@@ -185,11 +185,11 @@
|
|
|
185
185
|
"dayjs": "^1.11.20",
|
|
186
186
|
"libphonenumber-js": "^1.13.2",
|
|
187
187
|
"valibot": "^1.4.0",
|
|
188
|
-
"@maz-ui/icons": "5.0.0-beta.18",
|
|
189
188
|
"@maz-ui/cli": "5.0.0-beta.18",
|
|
190
|
-
"@maz-ui/translations": "5.0.0-beta.18",
|
|
191
189
|
"@maz-ui/utils": "5.0.0-beta.18",
|
|
192
|
-
"@maz-ui/themes": "5.0.0-beta.18"
|
|
190
|
+
"@maz-ui/themes": "5.0.0-beta.18",
|
|
191
|
+
"@maz-ui/translations": "5.0.0-beta.18",
|
|
192
|
+
"@maz-ui/icons": "5.0.0-beta.18"
|
|
193
193
|
},
|
|
194
194
|
"devDependencies": {
|
|
195
195
|
"@tailwindcss/cli": "^4.3.0",
|
|
@@ -207,10 +207,10 @@
|
|
|
207
207
|
"unplugin-auto-import": "^21.0.0",
|
|
208
208
|
"unplugin-vue-components": "^32.0.0",
|
|
209
209
|
"vue-router": "^5.0.7",
|
|
210
|
-
"@maz-ui/eslint-config": "5.0.0-beta.18",
|
|
211
210
|
"@maz-ui/stylelint-config": "5.0.0-beta.18",
|
|
212
|
-
"@maz-ui/
|
|
213
|
-
"@maz-ui/vite-config": "0.0.0"
|
|
211
|
+
"@maz-ui/eslint-config": "5.0.0-beta.18",
|
|
212
|
+
"@maz-ui/vite-config": "0.0.0",
|
|
213
|
+
"@maz-ui/node": "5.0.0-beta.11"
|
|
214
214
|
},
|
|
215
215
|
"lint-staged": {
|
|
216
216
|
"*.{js,ts,vue,mjs,mts,cjs,md,yml,json}": "cross-env NODE_ENV=production eslint --fix",
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */
|
|
2
|
-
.m-input[data-v-8baf93a1]{--maz-input-color:oklch(from var(--m-input-tint-bg) clamp(0, calc(l + .32), 1) calc(c * .35) h)}.m-input-wrapper-input.--xl[data-v-8baf93a1]{block-size:calc(4rem - (var(--maz-border-width) * 2))}.m-input-wrapper-input.--lg[data-v-8baf93a1]{block-size:calc(3.5rem - (var(--maz-border-width) * 2))}.m-input-wrapper-input.--md[data-v-8baf93a1]{block-size:calc(3rem - (var(--maz-border-width) * 2))}.m-input-wrapper-input.--sm[data-v-8baf93a1]{block-size:calc(2.5rem - (var(--maz-border-width) * 2))}.m-input-wrapper-input.--xs[data-v-8baf93a1]{block-size:calc(2rem - (var(--maz-border-width) * 2))}.m-input-wrapper-input.--mini[data-v-8baf93a1]{block-size:calc(1.5rem - (var(--maz-border-width) * 2))}.m-input-input[data-v-8baf93a1]{transition:padding .2s cubic-bezier(0,0,.2,1)}.m-input-input[data-v-8baf93a1]::placeholder{color:var(--maz-color-muted,var(--maz-muted))}.m-input-label[data-v-8baf93a1]{transition:transform .2s cubic-bezier(0,0,.2,1)}.m-input.--always-up .m-input-label[data-v-8baf93a1],.m-input.--has-placeholder .m-input-label[data-v-8baf93a1],.m-input .m-input-input:not(:placeholder-shown)~.m-input-label[data-v-8baf93a1]{font-size:var(--maz-text-xs,.75rem);line-height:var(--tw-leading,var(--maz-text-xs--line-height,calc(1 / .75)));transform:translateY(-1em)}.m-input .m-input-input:-webkit-autofill~.m-input-label[data-v-8baf93a1]{font-size:var(--maz-text-xs,.75rem);line-height:var(--tw-leading,var(--maz-text-xs--line-height,calc(1 / .75)));transform:translateY(-1em)}.m-input.--always-up .m-input-input[data-v-8baf93a1],.m-input.--has-placeholder.--has-label .m-input-input[data-v-8baf93a1],.m-input.--has-label .m-input-input[data-v-8baf93a1]:not(:placeholder-shown){padding-top:calc(var(--maz-space) * 4)}.m-input.--has-label .m-input-input[data-v-8baf93a1]:-webkit-autofill{padding-top:calc(var(--maz-space) * 4)}.m-input:not(.--has-state) .m-input-wrapper[data-v-8baf93a1]{color:var(--maz-color-muted,var(--maz-muted))}.m-input.--has-z-2 .m-input-wrapper[data-v-8baf93a1]{z-index:2}.m-input.--is-readonly .m-input-input[data-v-8baf93a1]{cursor:default}.m-input:has(input:disabled) .m-input-wrapper[data-v-8baf93a1]{background-color:var(--maz-color-surface-600,oklch(from var(--maz-surface) clamp(0, calc(l - .05), 1) c h));color:var(--maz-color-muted,var(--maz-muted))}.m-input:has(input:disabled) .m-input-wrapper[data-v-8baf93a1]:where(.dark,.dark *){background-color:var(--maz-color-surface-300,oklch(from var(--maz-surface) clamp(0, calc(l + .13), 1) c h))}.m-input:has(input:disabled) .m-input-input[data-v-8baf93a1]{cursor:var(--maz-disabled-cursor);color:var(--maz-color-muted,var(--maz-muted))}.m-input .m-input-wrapper[data-v-8baf93a1]:focus-within,.m-input.--border-active .m-input-wrapper[data-v-8baf93a1]{z-index:3}.m-input.--primary .m-input-wrapper[data-v-8baf93a1]:focus-within,.m-input.--primary.--border-active .m-input-wrapper[data-v-8baf93a1]{border-color:var(--maz-color-primary,var(--maz-primary))}.m-input.--secondary .m-input-wrapper[data-v-8baf93a1]:focus-within,.m-input.--secondary.--border-active .m-input-wrapper[data-v-8baf93a1]{border-color:var(--maz-color-secondary,var(--maz-secondary))}.m-input.--accent .m-input-wrapper[data-v-8baf93a1]:focus-within,.m-input.--accent.--border-active .m-input-wrapper[data-v-8baf93a1]{border-color:var(--maz-color-accent,var(--maz-accent))}.m-input.--info .m-input-wrapper[data-v-8baf93a1]:focus-within,.m-input.--info.--border-active .m-input-wrapper[data-v-8baf93a1]{border-color:var(--maz-color-info,var(--maz-info))}.m-input.--success .m-input-wrapper[data-v-8baf93a1]:focus-within,.m-input.--success.--border-active .m-input-wrapper[data-v-8baf93a1]{border-color:var(--maz-color-success,var(--maz-success))}.m-input.--warning .m-input-wrapper[data-v-8baf93a1]:focus-within,.m-input.--warning.--border-active .m-input-wrapper[data-v-8baf93a1]{border-color:var(--maz-color-warning,var(--maz-warning))}.m-input.--destructive .m-input-wrapper[data-v-8baf93a1]:focus-within,.m-input.--destructive.--border-active .m-input-wrapper[data-v-8baf93a1]{border-color:var(--maz-color-destructive,var(--maz-destructive))}.m-input.--contrast .m-input-wrapper[data-v-8baf93a1]:focus-within,.m-input.--contrast.--border-active .m-input-wrapper[data-v-8baf93a1]{border-color:var(--maz-color-contrast,var(--maz-contrast))}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */
|
|
2
|
-
@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){[data-v-92478102],[data-v-92478102]:before,[data-v-92478102]:after{--tw-leading:initial}[data-v-92478102]::backdrop{--tw-leading:initial}}}.m-textarea.--has-placeholder.--has-label textarea[data-v-92478102]{padding-block-start:.875rem}.m-textarea.--has-label:has(textarea:not(:placeholder-shown)) textarea[data-v-92478102]{padding-block-start:.875rem}.m-textarea.--has-label:has(textarea:-webkit-autofill) textarea[data-v-92478102]{padding-block-start:.875rem}.m-textarea__append[data-v-92478102]{justify-content:var(--append-justify)}.m-textarea textarea[data-v-92478102]{--tw-outline-style:none;background-color:#0000;outline-style:none;width:100%}@media (forced-colors:active){.m-textarea textarea[data-v-92478102]{outline-offset:2px;outline:2px solid #0000}}.m-textarea textarea[data-v-92478102]{transition:padding .2s cubic-bezier(0,0,.2,1)}.m-textarea textarea.--has-append[data-v-92478102]{padding-bottom:calc(var(--maz-space) * 4)}.m-textarea.--is-disabled[data-v-92478102] *{cursor:var(--maz-disabled-cursor);color:var(--maz-color-muted,var(--maz-muted))}.m-textarea.--is-disabled>label[data-v-92478102]{color:var(--maz-color-gray-300,#d1d5dc)}@supports (color:lab(0% 0 0)){.m-textarea.--is-disabled>label[data-v-92478102]{color:var(--maz-color-gray-300,lab(85.1236% -.612259 -3.7138))}}.m-textarea.--is-disabled>label[data-v-92478102]:where(.dark,.dark *){color:var(--maz-color-gray-600,#4a5565)}@supports (color:lab(0% 0 0)){.m-textarea.--is-disabled>label[data-v-92478102]:where(.dark,.dark *){color:var(--maz-color-gray-600,lab(35.6337% -1.58697 -10.8425))}}.m-textarea__label[data-v-92478102]{pointer-events:none;transform-origin:0 0;text-overflow:ellipsis;white-space:nowrap;width:max-content;top:calc(var(--maz-space) * 3);left:calc(var(--maz-space) * 4);--tw-leading:calc(var(--maz-space) * 6);line-height:calc(var(--maz-space) * 6);justify-content:center;align-items:center;transition:transform .2s cubic-bezier(0,0,.2,1);display:flex;position:absolute;overflow:hidden}.m-textarea__label[data-v-92478102]:not(.--has-state){color:var(--maz-color-muted,var(--maz-muted))}.m-textarea.--has-placeholder .m-textarea__label[data-v-92478102]{transform:scale(.8)translateY(-.65rem)}.m-textarea:has(textarea:not(:placeholder-shown)) .m-textarea__label[data-v-92478102]{transform:scale(.8)translateY(-.65rem)}.m-textarea:has(textarea:-webkit-autofill) .m-textarea__label[data-v-92478102]{transform:scale(.8)translateY(-.65rem)}.m-textarea.--primary[data-v-92478102]:focus-within{border-color:var(--maz-color-primary,var(--maz-primary))}.m-textarea.--secondary[data-v-92478102]:focus-within{border-color:var(--maz-color-secondary,var(--maz-secondary))}.m-textarea.--accent[data-v-92478102]:focus-within{border-color:var(--maz-color-accent,var(--maz-accent))}.m-textarea.--info[data-v-92478102]:focus-within{border-color:var(--maz-color-info,var(--maz-info))}.m-textarea.--success[data-v-92478102]:focus-within{border-color:var(--maz-color-success,var(--maz-success))}.m-textarea.--warning[data-v-92478102]:focus-within{border-color:var(--maz-color-warning,var(--maz-warning))}.m-textarea.--destructive[data-v-92478102]:focus-within{border-color:var(--maz-color-destructive,var(--maz-destructive))}.m-textarea.--contrast[data-v-92478102]:focus-within{border-color:var(--maz-color-contrast,var(--maz-contrast))}.m-textarea.--autogrow textarea[data-v-92478102]{resize:none;field-sizing:content;min-block-size:3lh}.m-textarea:not(.--autogrow) textarea[data-v-92478102]{resize:vertical}@property --tw-leading{syntax:"*";inherits:false}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{useInstanceUniqId}from"../composables/useInstanceUniqId.js";import{t as hasSlotContent}from"./hasSlotContent.BLn0kQC7.js";import{t as _plugin_vue_export_helper_default}from"./_plugin-vue_export-helper.ChmETRGw.js";import{useMazIconProps}from"../composables/useMazIconProps.js";import{t as onAutofillSync}from"./autofillSync.CsX6Qzf_.js";import{computed,createBlock,createCommentVNode,createElementBlock,createElementVNode,createVNode,defineAsyncComponent,defineComponent,mergeProps,normalizeClass,normalizeStyle,onBeforeUnmount,onMounted,openBlock,ref,renderSlot,toDisplayString,toHandlers,unref,useSlots,vModelDynamic,withCtx,withDirectives,withModifiers}from"vue";import{debounce}from"@maz-ui/utils/helpers/debounce";import{MazEye}from"@maz-ui/icons/lazy/MazEye";import{MazEyeSlash}from"@maz-ui/icons/lazy/MazEyeSlash";import '../assets/MazInput.CsWp2Ijb.css';var _hoisted_1=[`for`];var _hoisted_2={key:0,class:`m-input-wrapper-start maz:relative maz:z-1 maz:flex maz:flex-center maz:space-x-1 maz:py-1 maz:ps-2`};var _hoisted_3=[`id`,`placeholder`,`aria-label`,`type`,`inputmode`,`name`,`autocomplete`,`disabled`,`readonly`,`required`];var _hoisted_4={key:1,class:`m-input-wrapper-end maz:relative maz:z-1 maz:flex maz:flex-center maz:space-x-1 maz:py-1 maz:pe-2`};var MazInput_default=_plugin_vue_export_helper_default(defineComponent({inheritAttrs:!1,__name:`MazInput`,props:{style:{type:[Boolean,null,String,Object,Array]},class:{type:[Boolean,null,String,Object,Array]},modelValue:{},placeholder:{},label:{},topLabel:{},assistiveText:{},color:{default:`primary`},type:{default:`text`},required:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},readonly:{type:Boolean},id:{},error:{type:Boolean,default:!1},success:{type:Boolean,default:!1},warning:{type:Boolean,default:!1},hint:{},inputClasses:{},border:{type:Boolean,default:!0},inputmode:{default:`text`},size:{default:`md`},debounce:{type:[Boolean,Number],default:!1},autoFocus:{type:Boolean,default:!1},borderActive:{type:Boolean,default:!1},startIcon:{type:[String,Function,Object]},endIcon:{type:[String,Function,Object]},roundedSize:{default:`md`},block:{type:Boolean},name:{},autocomplete:{},loading:{type:Boolean,default:!1}},emits:[`update:model-value`,`focus`,`blur`,`click`,`change`,`input`],setup(__props,{emit:__emit}){let emits=__emit;let MazIcon=defineAsyncComponent(()=>import(`../components/MazIcon.js`));let MazBtn=defineAsyncComponent(()=>import(`../components/MazBtn.js`));let MazSpinner=defineAsyncComponent(()=>import(`../components/MazSpinner.js`));let{iconProps:startIconProps}=useMazIconProps(()=>__props.startIcon);let{iconProps:endIconProps}=useMazIconProps(()=>__props.endIcon);let hasPasswordVisible=ref(!1);let input=ref();let instanceId=useInstanceUniqId({componentName:`MazInput`,providedId:__props.id});let autofillCleanup;onMounted(()=>{__props.autoFocus&&input.value?.focus(),input.value&&(autofillCleanup=onAutofillSync(input.value,value=>{value!==__props.modelValue&&emits(`update:model-value`,value)}))}),onBeforeUnmount(()=>{autofillCleanup?.()});let isPasswordType=computed(()=>__props.type===`password`);let inputType=computed(()=>hasPasswordVisible.value?`text`:__props.type);let borderStyle=computed(()=>{if(__props.border)return __props.error?`maz:border-destructive`:__props.success?`maz:border-success`:__props.warning?`maz:border-warning`:`--default-border maz:border-divider maz:dark:border-divider-400`});let slots=useSlots();let debounceEmitValue=debounce(value=>{emits(`update:model-value`,value)},typeof __props.debounce==`number`?__props.debounce:500);function emitValue(value){if(__props.debounce)return debounceEmitValue(value);emits(`update:model-value`,value)}let model=computed({get:()=>__props.modelValue,set:value=>emitValue(value)});let hasLabel=computed(()=>!!__props.label||!!__props.hint);let alwaysUp=computed(()=>[`date`,`month`,`week`].includes(__props.type));function hasEndPart(){return hasSlotContent(slots[`end-icon`])||isPasswordType.value||!!__props.endIcon||__props.loading}function hasStartPart(){return hasSlotContent(slots[`start-icon`])||!!__props.startIcon}function focus(event){emits(`focus`,event)}function blur(event){emits(`blur`,event)}function change(event){return emits(`change`,event)}function emitInputEvent(event){return emits(`input`,event)}let stateColor=computed(()=>{if(__props.error)return`maz:text-destructive-600!`;if(__props.success)return`maz:text-success-600!`;if(__props.warning)return`maz:text-warning-600!`});let ROUNDED_CLASS={none:``,sm:`maz:rounded-xs`,md:`maz:rounded-md`,lg:`maz:rounded-lg`,xl:`maz:rounded-xl`,full:`maz:rounded-full`};let CHILD_TEXT_SIZE_CLASS={xl:`maz:text-xl`,lg:`maz:text-lg`,md:``,sm:`maz:text-sm`,xs:`maz:text-xs`,mini:`maz:text-xs`};return(_ctx,_cache)=>(openBlock(),createElementBlock(`div`,{class:normalizeClass([`m-input m-reset-css maz:inline-flex maz:h-fit maz:flex-col maz:items-start maz:align-top maz:text-foreground`,[{"--border-active":__props.borderActive,"--always-up":alwaysUp.value,"--has-placeholder":!!__props.placeholder,"--has-label":hasLabel.value,"--is-readonly":__props.readonly,"--has-z-2":__props.error||__props.warning||__props.success,"--has-state":__props.error||__props.warning||__props.success,"--block":__props.block,"maz:w-full":__props.block},__props.class,`--${__props.color}`]]),style:normalizeStyle([__props.style,{"--m-input-tint-bg":`var(--maz-${__props.color})`}])},[__props.topLabel?(openBlock(),createElementBlock(`label`,{key:0,for:unref(instanceId),class:normalizeClass([`m-input-top-label maz:mb-2`,stateColor.value]),style:{fontWeight:`var(--maz-input-top-label-font-weight, 600)`}},toDisplayString(__props.topLabel),11,_hoisted_1)):createCommentVNode(``,!0),createElementVNode(`div`,{class:normalizeClass([`m-input-wrapper maz:relative maz:z-1 maz:flex maz:size-full maz:flex-1 maz:overflow-hidden maz:bg-input maz:transition-colors maz:duration-300`,[__props.inputClasses,borderStyle.value,ROUNDED_CLASS[__props.roundedSize],`--rounded-${__props.roundedSize}`,{"--block":__props.block,"--border":__props.border,"maz:w-full":__props.block,"maz:border maz:border-solid":__props.border}]])},[hasStartPart()?(openBlock(),createElementBlock(`div`,_hoisted_2,[unref(hasSlotContent)(unref(slots)[`start-icon`])||__props.startIcon?renderSlot(_ctx.$slots,`start-icon`,{key:0},()=>[unref(startIconProps)?(openBlock(),createBlock(unref(MazIcon),mergeProps({key:0},unref(startIconProps),{class:[`maz:text-xl`,stateColor.value||`maz:text-muted`]}),null,16,[`class`])):createCommentVNode(``,!0)],!0):createCommentVNode(``,!0)])):createCommentVNode(``,!0),createElementVNode(`div`,{class:normalizeClass([`m-input-wrapper-input maz:relative maz:flex maz:w-full maz:max-w-full maz:flex-1 maz:items-center`,[`--${__props.size}`,{"--top-label":!!__props.topLabel,"--has-start-icon":hasStartPart(),"--has-end-icon":hasEndPart()}]])},[withDirectives(createElementVNode(`input`,mergeProps({id:unref(instanceId)},_ctx.$attrs,{ref_key:`input`,ref:input,"onUpdate:modelValue":_cache[0]||=$event=>model.value=$event,placeholder:__props.placeholder||` `,"aria-label":__props.label||__props.placeholder,type:inputType.value,inputmode:__props.inputmode,name:__props.name,autocomplete:__props.autocomplete,disabled:__props.disabled,readonly:__props.readonly,required:__props.required,class:[`m-input-input maz:m-0 maz:size-full maz:appearance-none maz:truncate maz:border-none maz:bg-transparent maz:px-4 maz:py-0 maz:text-foreground maz:shadow-none maz:outline-hidden`,[CHILD_TEXT_SIZE_CLASS[__props.size],{"maz:ps-2!":hasStartPart(),"maz:pe-2!":hasEndPart()}]]},toHandlers({blur,focus,change,input:emitInputEvent},!0),{onClick:_cache[1]||=$event=>_ctx.$emit(`click`,$event)}),null,16,_hoisted_3),[[vModelDynamic,model.value]]),__props.label||__props.hint?(openBlock(),createElementBlock(`span`,{key:0,class:normalizeClass([`m-input-label maz:pointer-events-none maz:absolute maz:inset-s-4 maz:w-full maz:origin-top-left maz:items-center maz:truncate maz:overflow-hidden maz:text-start maz:leading-6 maz:whitespace-nowrap`,[stateColor.value,CHILD_TEXT_SIZE_CLASS[__props.size],{"maz:inset-s-2!":hasStartPart(),"maz:pe-3!":hasLabel.value}]])},toDisplayString(__props.hint||__props.label),3)):createCommentVNode(``,!0)],2),hasEndPart()?(openBlock(),createElementBlock(`div`,_hoisted_4,[unref(hasSlotContent)(unref(slots)[`end-icon`])||__props.endIcon?renderSlot(_ctx.$slots,`end-icon`,{key:0},()=>[unref(endIconProps)?(openBlock(),createBlock(unref(MazIcon),mergeProps({key:0},unref(endIconProps),{class:[`maz:text-xl`,stateColor.value||`maz:text-muted`]}),null,16,[`class`])):createCommentVNode(``,!0)],!0):createCommentVNode(``,!0),isPasswordType.value?(openBlock(),createBlock(unref(MazBtn),{key:1,color:`transparent`,tabindex:`-1`,size:`mini`,onClick:_cache[2]||=withModifiers($event=>hasPasswordVisible.value=!hasPasswordVisible.value,[`stop`])},{default:withCtx(()=>[hasPasswordVisible.value?(openBlock(),createBlock(unref(MazEyeSlash),{key:0,class:`maz:text-xl maz:text-muted`})):(openBlock(),createBlock(unref(MazEye),{key:1,class:`maz:text-xl maz:text-muted`}))]),_:1})):createCommentVNode(``,!0),__props.loading?renderSlot(_ctx.$slots,`loader`,{key:2},()=>[createVNode(unref(MazSpinner),{color:__props.color},null,8,[`color`])],!0):createCommentVNode(``,!0)])):createCommentVNode(``,!0)],2),__props.assistiveText?(openBlock(),createElementBlock(`div`,{key:1,class:normalizeClass([`m-input-bottom-text maz:mt-1 maz:text-sm`,[{"maz:text-destructive-600":__props.error,"maz:text-success-600":__props.success,"maz:text-warning-600":__props.warning,"maz:text-muted":!__props.error&&!__props.success&&!__props.warning}]])},toDisplayString(__props.assistiveText),3)):createCommentVNode(``,!0)],6))}}),[[`__scopeId`,`data-v-8baf93a1`]]);export{MazInput_default as t};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{useInstanceUniqId}from"../composables/useInstanceUniqId.js";import{t as _plugin_vue_export_helper_default}from"./_plugin-vue_export-helper.ChmETRGw.js";import{t as onAutofillSync}from"./autofillSync.CsX6Qzf_.js";import{computed,createCommentVNode,createElementBlock,createElementVNode,createTextVNode,defineComponent,mergeProps,normalizeClass,normalizeStyle,onBeforeUnmount,onMounted,openBlock,ref,renderSlot,toDisplayString,toHandlers,unref,useSlots,vModelText,withDirectives}from"vue";import '../assets/MazTextarea.DYOLW1ej.css';var _hoisted_1=[`for`];var _hoisted_2=[`for`];var _hoisted_3=[`for`];var _hoisted_4={key:1};var _hoisted_5={key:2};var _hoisted_6=[`id`,`placeholder`,`name`,`disabled`,`readonly`,`required`];var _hoisted_7={key:1,class:`m-textarea__append maz:inline-flex`};var MazTextarea_default=_plugin_vue_export_helper_default(defineComponent({inheritAttrs:!1,__name:`MazTextarea`,props:{style:{type:[Boolean,null,String,Object,Array]},class:{type:[Boolean,null,String,Object,Array]},modelValue:{},id:{},name:{default:`MazTextarea`},label:{},placeholder:{},required:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},readonly:{type:Boolean,default:!1},error:{type:Boolean,default:!1},success:{type:Boolean,default:!1},warning:{type:Boolean,default:!1},hint:{},color:{default:`primary`},roundedSize:{default:`md`},padding:{type:Boolean,default:!0},transparent:{type:Boolean,default:!1},border:{type:Boolean,default:!0},autogrow:{type:Boolean,default:!0},appendJustify:{default:`end`},topLabel:{},assistiveText:{}},emits:[`update:model-value`,`input`,`focus`,`blur`,`change`],setup(__props,{emit:__emit}){let emits=__emit;let instanceId=useInstanceUniqId({componentName:`MazTextarea`,providedId:__props.id});let textarea=ref();let inputValue=computed({get:()=>__props.modelValue,set:value=>{emits(`update:model-value`,value),emits(`input`,value)}});function focus(event){emits(`focus`,event)}function blur(event){emits(`blur`,event)}function change(event){emits(`change`,event)}let slots=useSlots();let hasLabelOrHint=computed(()=>__props.label||__props.hint||!!slots.label);let hasAppend=computed(()=>!!slots.append);let borderStyle=computed(()=>__props.error?`maz:border-destructive`:__props.success?`maz:border-success`:__props.warning?`maz:border-warning`:`--default-border maz:border-divider maz:dark:border-divider-400`);let autofillCleanup;onMounted(()=>{textarea.value&&(autofillCleanup=onAutofillSync(textarea.value,value=>{value!==__props.modelValue&&emits(`update:model-value`,value)}))}),onBeforeUnmount(()=>{autofillCleanup?.()});let ROUNDED_CLASS={none:``,sm:`maz:rounded-xs`,md:`maz:rounded-md`,lg:`maz:rounded-lg`,xl:`maz:rounded-xl`,full:`maz:rounded-full`};let stateLabelColor=computed(()=>[{"maz:text-destructive-600":__props.error,"maz:text-success-600":__props.success,"maz:text-warning-600":__props.warning}]);return(_ctx,_cache)=>(openBlock(),createElementBlock(`div`,{class:normalizeClass([`m-textarea-wrapper m-reset-css maz:flex maz:flex-col maz:gap-2`,__props.class]),style:normalizeStyle(__props.style)},[__props.topLabel?(openBlock(),createElementBlock(`label`,{key:0,for:unref(instanceId),class:normalizeClass([`m-textarea__top-label`,stateLabelColor.value]),style:{fontWeight:`var(--maz-input-top-label-font-weight, 600)`}},toDisplayString(__props.topLabel),11,_hoisted_1)):createCommentVNode(``,!0),createElementVNode(`label`,{class:normalizeClass([`m-textarea maz:relative maz:flex maz:min-h-25 maz:flex-col maz:align-top maz:text-foreground`,[{"--is-disabled":__props.disabled,"--has-label":hasLabelOrHint.value,"--background-transparent":__props.transparent,"--has-placeholder":!!__props.placeholder,"--autogrow":__props.autogrow,"maz:px-4 maz:py-3":__props.padding,"maz:border maz:border-solid":__props.border&&!__props.disabled,"maz:bg-input":!__props.transparent&&!__props.disabled,"maz:disabled-cursor maz:border-divider maz:bg-surface-600 maz:text-muted maz:dark:border-divider-400 maz:dark:bg-surface-400":__props.disabled},borderStyle.value,ROUNDED_CLASS[__props.roundedSize],`--${__props.color}`]]),for:unref(instanceId),style:normalizeStyle([`--append-justify: ${__props.appendJustify}`])},[hasLabelOrHint.value?(openBlock(),createElementBlock(`label`,{key:0,for:unref(instanceId),class:normalizeClass([`m-textarea__label`,[...stateLabelColor.value,{"--has-state":__props.error||__props.warning||__props.success}]])},[__props.hint?(openBlock(),createElementBlock(`span`,_hoisted_4,toDisplayString(__props.hint),1)):renderSlot(_ctx.$slots,`label`,{key:0},()=>[createTextVNode(toDisplayString(__props.label),1)],!0),__props.required?(openBlock(),createElementBlock(`sup`,_hoisted_5,`*`)):createCommentVNode(``,!0)],10,_hoisted_3)):createCommentVNode(``,!0),withDirectives(createElementVNode(`textarea`,mergeProps({id:unref(instanceId),ref_key:`textarea`,ref:textarea},_ctx.$attrs,{"onUpdate:modelValue":_cache[0]||=$event=>inputValue.value=$event,placeholder:__props.placeholder||` `,name:__props.name,disabled:__props.disabled,readonly:__props.readonly,required:__props.required,class:{"--has-append":hasAppend.value}},toHandlers({blur,focus,change},!0)),null,16,_hoisted_6),[[vModelText,inputValue.value]]),hasAppend.value?(openBlock(),createElementBlock(`div`,_hoisted_7,[renderSlot(_ctx.$slots,`append`,{},void 0,!0)])):createCommentVNode(``,!0)],14,_hoisted_2),__props.assistiveText?(openBlock(),createElementBlock(`div`,{key:1,class:normalizeClass([`m-textarea__bottom-text maz:-mt-1 maz:text-sm`,[{"maz:text-destructive-600":__props.error,"maz:text-success-600":__props.success,"maz:text-warning-600":__props.warning,"maz:text-muted":!__props.error&&!__props.success&&!__props.warning}]])},toDisplayString(__props.assistiveText),3)):createCommentVNode(``,!0)],6))}}),[[`__scopeId`,`data-v-92478102`]]);export{MazTextarea_default as t};
|
|
@@ -1,8 +0,0 @@
|
|
|
1
|
-
var ANIMATION_NAME=`maz-autofill-start`;var STYLE_ELEMENT_ID=`maz-autofill-sync`;function ensureStylesInjected(){if(typeof document>`u`||document.getElementById(STYLE_ELEMENT_ID))return;let style=document.createElement(`style`);style.id=STYLE_ELEMENT_ID,style.textContent=`
|
|
2
|
-
@keyframes ${ANIMATION_NAME} { from {} to {} }
|
|
3
|
-
[data-maz-autofill-sync]:-webkit-autofill,
|
|
4
|
-
[data-maz-autofill-sync]:autofill {
|
|
5
|
-
animation-name: ${ANIMATION_NAME};
|
|
6
|
-
animation-duration: 1ms;
|
|
7
|
-
}
|
|
8
|
-
`,document.head.appendChild(style)}function onAutofillSync(field,onSync){ensureStylesInjected(),field.setAttribute(`data-maz-autofill-sync`,``);function handleAnimationStart(event){event.animationName===ANIMATION_NAME&&onSync(event.target.value)}return field.addEventListener(`animationstart`,handleAnimationStart),()=>{field.removeEventListener(`animationstart`,handleAnimationStart),field.removeAttribute(`data-maz-autofill-sync`)}}export{onAutofillSync as t};
|