amotify/dist/fn/Input/core.js

UI Component for React,NextJS,esbuild

import{b as i,c as l,e as T}from"../../chunk-C5N2D3ZX.js";import{jsx as y,jsxs as h}from"react/jsx-runtime";import{useState as w,useEffect as S}from"react";import u,{UUID as m,useStore as v}from"jmini";import{$$fromRoot as k}from"../../@utils";import{InputClasses as b}from"../../@styles/componentClasses";import{Box as E,Flex as B,FAI as g,Column as D}from"../../atoms";import{Row as _,Literal as O}from"../../mols";import{Button as A}from"../Button";import V from"../Tooltips";const te=e=>{let[n]=w(e.componentId||m(12));e=i({},e),e.states=l(i({enableFormSubmit:!0,status_id:m(8),override:"never",form:"",id:m(),"aria-label":"Input-"+n},e.states),{componentId:n});let{children:a}=e;return y(a,i({},e.states))},ae=e=>{let{children:n,val_status:a,states:t}=e,{leftIcon:s,wrapStyles:f}=t,r=a.notice||[];return t.showInitValidation||a.eventType=="init"&&(r=[]),h(_.Center,l(i({position:"relative",verticalAlign:"unset",gap:0},f),{className:b("Wrapper"),"data-notice-uid":a.componentId,children:[y(C.Notice,{notice:r,val_status:a}),t.leftIndicator,h(B,{position:"relative",flexSizing:"auto",children:[n,s,y(C.RightIcon,i({},e)),y(C.ClearButton,i({},e))]}),t.rightIndicator]}))},C={ClearButton:e=>!e.states.clearButton||!e.val_status.rawValue?null:y(A.Normal,{ssSphere:2,flexCenter:!0,fontColor:"5.translucent",ssEffectsOnActive:["ripple.theme"],position:"absolute",ssZIndex:3,right:"2/3",top:"50%",xcss:{transform:"translateY(-50%)"},onClick:()=>{e.set_status(n=>l(i({},n),{rawValue:"",safeValue:"",eventType:"update",eventID:m(12),isInspected:!1}))},children:y(g.X,{})}),RightIcon:e=>e.states.clearButton&&e.val_status.rawValue?null:e.states.rightIcon,Notice:e=>{let{notice:n,val_status:a}=e,{componentId:t}=a,s="NoticeTimer-"+t,f="NoticeTimerClose-"+t,r="notice-tips-"+t;return S(()=>{u.interval.once(()=>{if(!(n!=null&&n.length)){V.close(r);return}V.open({tipsID:r,parent:`[data-notice-uid="${t}"]`,gravityPoint:24,padding:[1,0],closeAtParentBlur:!1,content:h(V.Body,{padding:["1/2","2/3"],fontSize:"1.mini",position:"relative",children:[y(E,{position:"absolute",unitHeight:1,unitWidth:1,right:1,backgroundColor:"dark",ssZIndex:1,xcss:{transform:"rotate(45deg)",top:-6}}),y(D,{backgroundColor:"inherit",gap:"1/3",ssZIndex:2,children:n.map((d,p)=>{let{type:o,label:c}=d,I=o=="invalid"?g.Exclamation:o=="warn"?g.Exclamation:g.Check;return h(_.Left,{gap:0,borderRadius:"2.tone.secondary",children:[y(I,{flexCenter:!0,fontSize:"2.normal",fontColor:{invalid:"nega",warn:"warn",valid:"posi"}[o]}),y(O.Micro,{fontColor:"white",children:c})]},p+"-"+u.Stringify(d))})})]})})},350,s),u.interval.once(()=>{V.close(r)},6e3,f)},[n]),null}},F={DefaultStatus:(e,n)=>({componentId:e,rawValue:n,eventType:"init",eventID:m(12)}),CommonEffects:function(e){let{type:n,states:a,val_status:t,set_status:s,SystemValidation:f}=e;a=i({},a);let{componentId:r}=t;S(()=>(v.update({[`input_alias:id:${a.id}`]:{componentId:r},[`input_alias:name:${a.name}`]:{componentId:r},[r]:{ResolveRefresh:null,remoteUpdate:d=>{s(p=>l(i({},p),{isInspected:!1,isValidated:!1,rawValue:d,status_id:m(8),eventType:"update.remote",eventID:m(12)}))},Refresh:()=>new Promise((d,p)=>{v.get(r).ResolveRefresh=d,s(o=>l(i({},o),{isInspected:!1,eventType:"refresh",eventID:m(12)}))})}}),()=>{v.delete(r)}),[]),S(()=>{F.ValidationCheck({val_status:t,set_status:s,SystemValidation:f,states:a})},[t.eventID,t.rawValue]),u.scope(()=>{let{override:d}=a;if(t.eventType=="update.remote"){s(R=>l(i(i({},R),e.ExtraOverrideStates&&e.ExtraOverrideStates(t.rawValue)),{eventType:"override",eventID:m(12),isInspected:!1,isValidated:!1}));return}if(d=="never"||d=="beforeModified"&&!u.isOneOf(t.eventType,"init","override")||t.isComposing)return;let p=v.get(t.componentId);if(!p)return;let o=a.value,c=t.rawValue;if(e.ExtraOverrideStates&&(o=e.ExtraOverrideStates(o).rawValue||o),u.isEqual(o,c)){p.status_id=a.status_id;return}let I=u.SortifyObject(o),x=u.SortifyObject(c);if(I&&x&&u.isEqual(I,x)){p.status_id=a.status_id;return}a.status_id!=p.status_id&&(t.eventType=="update"&&!t.isInspected||s(R=>l(i(l(i({},R),{rawValue:o}),e.ExtraOverrideStates&&e.ExtraOverrideStates(o)),{eventType:"override",eventID:m(12),isInspected:!1,isValidated:!1})))});{let{componentId:d,eventType:p}=t,o={eventType:p,componentId:d,isInspected:!!t.isInspected,isValidated:!!t.isValidated,isComposing:!!t.isComposing,isFocusing:!!t.isFocusing,isPickerOpen:!!t.isPickerOpen},c=t.rawValue;n=="autocomplete.single"?c=u.Arrayify(c)[0]:n=="list.radio"?c=u.Arrayify(c)[0]:a.isChecker&&(c=!!u.Arrayify(c)[0]),S(()=>(u.scope(()=>{if(a.form=a.form||"testForm",a.name&&a.form&&v.update({[["form-data",a.form].join("-")]:{[a.name]:{componentId:d,type:n,value:c,validation:t.isValidated}}}),!t.isInspected||p!="refresh")return;let I=v.get(d);I&&I.ResolveRefresh&&I.ResolveRefresh(null)}),()=>{v.update({[["form-data",a.form].join("-")]:{[a.name]:null}})}),[t]),S(()=>{a.onUserAction&&a.onUserAction(c,o)},[t]),S(()=>{t.isInspected&&p=="update"&&(a.onUpdateValue&&a.onUpdateValue(c,o),t.isValidated&&a.onUpdateValidValue&&a.onUpdateValidValue(c,o))},[t.isValidated,t.isInspected,t.rawValue])}},ValidationCheck:e=>{let{states:n}=e;if(e.val_status.isInspected)return;let a="ValidationTimer-"+e.val_status.componentId;u.interval.abort(a),e.set_status(r=>l(i({},r),{isInspected:!1,isValidated:!1}));let t=e.SystemValidation({value:e.val_status.rawValue,states:n});if(!t.ok){e.set_status(r=>l(i({},r),{isInspected:!0,isValidated:!!t.ok,notice:t.notice||[]}));return}let s=t.notice||[];const f=()=>T(void 0,null,function*(){if(!n.onValidate)return;let r=yield n.onValidate(e.val_status.rawValue,e.val_status.eventType,e.val_status);e.set_status(d=>l(i({},d),{isInspected:!0,isValidated:!!r.ok,notice:[...s,...r.notice||[]]}))});if(n.onValidate){if(e.val_status.eventType=="refresh"){f();return}u.interval.once(f,n.onValidateDelay||400,a);return}e.set_status(r=>l(i({},r),{eventID:m(12),isInspected:!0,isValidated:!0,notice:s}))},SubmitForm:(e,n)=>{let a=!1;if(!n)return a;let t=k(`[data-form-submit-button="${n}"]`)[0];if(!t)return a;let s=t.dataset.sdfike||"",f=e.key,r=e.ctrlKey||e.metaKey;return u.scope(()=>{s.includes("enter")&&(f!="Enter"||e.nativeEvent.isComposing||(e==null?void 0:e.keyCode)==229)||((f=="Enter"&&(s.includes("enter")||s.includes("auxEnter")&&r)||f==" "&&s.includes("space"))&&(t.click(),e.preventDefault()),a=!0)}),a},isShowValidation:(e,n)=>{let a=e.isValidated;return!n&&e.eventType=="init"?!0:a}},ne=function(e){e=i({tone:"border"},e);let n=u.scope(()=>{if(e.tone=="plain")return{};let t={padding:1,transition:"long",flexSizing:"auto",boxShadow:"0.min"};return e.tone=="border"?t=l(i({},t),{border:!0,borderRadius:"2.tone.secondary",backgroundColor:"layer.1"}):e.tone=="cloud"?t=l(i({},t),{border:"1.thin",borderRadius:"2.tone.secondary",backgroundColor:"cloud"}):e.tone=="bottomBorder"&&(t=l(i({},t),{borderRadius:0,border:"unset",borderBottom:!0,backgroundColor:"cloud"})),t});return l(i(i(i(i(i(i({fontColor:"2.normal"},n),!!e.rightIcon&&{paddingRight:3}),!!e.leftIcon&&{paddingLeft:3}),!!e.leftIndicator&&{borderTopLeftRadius:"2/3",borderBottomLeftRadius:"2/3",marginLeft:"1/4"}),!!e.rightIndicator&&{borderTopRightRadius:"2/3",borderBottomRightRadius:"2/3",marginRight:"1/4"}),e),{xcss:i({letterSpacing:"1px",resize:"none"},e.xcss),className:[b("Input"),e.className].join(" ")})};export{ae as BoxWrapper,F as CoreEffects,ne as DefaultBoxishStyles,te as OptionalInputWrapper};