amotify 0.2.250 → 0.2.252
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.
|
@@ -1 +1 @@
|
|
|
1
|
-
import{b as f,c as g,d as Q,e as Y}from"../../chunk-C5N2D3ZX.js";import{Fragment as U,jsx as l,jsxs as F}from"react/jsx-runtime";import{useState as b,useEffect as E,useRef as ie}from"react";import c,{UUID as D}from"jmini";import{ExtractStyles as re}from"../../@utils";import{Box as B,Span as se,FAI as K,Column as Z}from"../../atoms";import{Literal as N,Row as P}from"../../mols";import{Button as ee}from"../Button";import{Loader as ue}from"../Loader";import{Sheet as ce}from"../Sheet";import{OptionalInputWrapper as pe,BoxWrapper as de,CoreEffects as M,DefaultBoxishStyles as Se}from"./core";import{InputAutocompleteClasses as W}from"../../@styles/componentClasses";import{InputLabel as fe}from"./Label";import{RightIcon as te}from".";function me(e){let{value:t,states:r}=e,{required:p,options:o,min:a,max:n}=r;a=a||0,n=n||65535;let d=[],s=t.filter(u=>u!==null).length;return p&&(s||d.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"})),s<a&&d.push({type:"invalid",label:a+"\u500B\u4EE5\u4E0A\u9078\u629E\u3057\u3066\u304F\u3060\u3055\u3044"}),s>n&&d.push({type:"invalid",label:n+"\u500B\u307E\u3067\u9078\u629E\u3067\u304D\u307E\u3059"}),{ok:!d.filter(({type:u})=>u=="invalid").length,notice:d}}const C={InitOptions:e=>{let t=[];return e.forEach(r=>{if(!r)return;let{type:p,label:o,value:a,searchValue:n}=r,d=n||c.is.string(o)&&o||""||c.is.string(a)&&a||c.Stringify(a||"")||"";c.is.nullish(o)&&(o=String(a)),t.push(g(f({id:D()},r),{searchValue:d,type:p||"selector",label:o,value:a}))}),t},FilterSelectableOptions:(e,t,r)=>{let p=e;return r||(p=e.filter(o=>(o==null?void 0:o.type)!="label")),c.scope(()=>{if(!t)return;let o=t.toLower().replace(/ /g,"");p=p.filter(a=>(a.searchValue||"").toLower().replace(/ /g,"").includes(o))}),p},Shallow:e=>{let{rootStates:t,val_status:r}=e,p=re(t);return l(B,{position:"absolute",top:0,left:0,right:0,height:0,overflow:"hidden",opacity:"trans",freeCSS:{zIndex:3,pointerEvents:"none"},children:l(N.Description,g(f({className:t.className},p),{position:"absolute",width:1,freeCSS:g(f({},p.freeCSS),{color:"orange"}),"data-id":"shallow_"+r.componentId,children:l(B,{"data-input-value-shallow":r.componentId,children:"A"})}))})},Button:e=>{let{rootStates:t,val_keyword:r,set_keyword:p,val_optionFocused:o,set_optionFocused:a,val_preventOpenSelector:n,set_preventOpenSelector:d,val_openSelector:s,set_openSelector:u,val_status:i,set_status:S,val_activeInput:m,set_activeInput:y}=e,j=t,{tone:O,required:w,form:h,className:x,multiSelect:I,enableFormSubmit:k,checkValidationAtFirst:R,onValidate:H,onValidateDelay:J,onUpdateValue:z,onUpdateValidValue:q,onUserAction:X,value:$="",options:T,leftIndicator:L,rightIndicator:V,leftIcon:ve,rightIcon:ye,componentId:_e,status_id:ge,wrapStyles:he,emptySelect:Ie,SearchInput:be,SearchInputPlaceholder:Ce,SelectedComponent:De,SelectorComponent:Oe,SelectorStyles:we,SelectorPosition:xe,DynamicOptionsOnSearch:ke,DynamicOptionsOnSearchDelay:Re}=j,v=Q(j,["tone","required","form","className","multiSelect","enableFormSubmit","checkValidationAtFirst","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","onUserAction","value","options","leftIndicator","rightIndicator","leftIcon","rightIcon","componentId","status_id","wrapStyles","emptySelect","SearchInput","SearchInputPlaceholder","SelectedComponent","SelectorComponent","SelectorStyles","SelectorPosition","DynamicOptionsOnSearch","DynamicOptionsOnSearchDelay"]);return E(()=>{var A;if(t.disabled||!s||c.is.exist(o))return;let _=C.FilterSelectableOptions(e.val_options,r,!1);a(((A=_[0])==null?void 0:A.id)||"")},[r]),E(()=>{if(i.eventType!="init"&&i.eventType!="override"){if(t.max==i.dataValue.length){u(!1),d(!0),p("");return}c("#SearchInput_"+t.componentId).focus()}},[i.dataValue]),E(()=>{let _="autocomplete-click-"+t.componentId;if(!s){c(document).removeEvent([_]);return}c('[data-input-origin="'+t.componentId+'"]')&&(c("#SearchInput_"+t.componentId).focus(),c(document).addEvent({eventID:_,eventType:"mousedown",callback:ae=>{let G=c(ae.target),le=!!c(G).parent("."+W("Core")).length,ne=!!c(G).parent("."+W("Selector")).length;le||ne||(u(!1),y(!1))},options:{passive:!1}}))},[s]),F(U,{children:[l(B,g(f({tabIndex:0},v),{"data-disabled":t.disabled,"data-show-validation":M.isShowValidation(i,!!R),"data-component-id":i.componentId,"data-input-origin":i.componentId,"data-focus":!!s||!!m,className:[x,W("Core")].join(" "),onFocus:_=>{if(v!=null&&v.onFocus&&(v==null||v.onFocus(_)),!t.disabled){if(n)return d(!1);u(!0),y(!0),_.preventDefault()}},onCompositionStart:_=>{v!=null&&v.onCompositionStart&&(v==null||v.onCompositionStart(_))},onCompositionEnd:_=>{v!=null&&v.onCompositionEnd&&(v==null||v.onCompositionEnd(_))},onClick:_=>{v!=null&&v.onClick&&(v==null||v.onClick(_)),!t.disabled&&(u(!0),y(!0))},onKeyDown:_=>{let{key:A}=_;k&&M.SubmitForm(_,h),!s&&(A==" "||A=="ArrowDown"||A=="ArrowUp"||A=="Enter")&&(u(!0),y(!0))},children:F(P.Left,{gap:0,children:[l(se,{width:0,overflow:"hidden",opacity:"trans",children:"A"}),F(P.Left,{flexWrap:!0,flexSizing:0,gap:"1/3",freeCSS:{letterSpacing:".5px"},children:[l(C.Selected,f({},e)),l(C.SearchInput,f({},e))]})]})})),s&&l(C.Selector,f({},e))]})},SearchInput:e=>{let{rootStates:t,val_status:r,set_status:p}=e;return t.disabled||!e.val_openSelector&&!e.val_activeInput?null:l(B,{htmlTag:"input",id:"SearchInput_"+t.componentId,placeholder:t.SearchInputPlaceholder||"\u691C\u7D22...",opacity:e.val_openSelector?"max":"middle",transition:"middle",flexSizing:0,fontSize:"inherit",border:"unset",backgroundColor:"trans",value:e.val_keyword,freeCSS:{outline:"none"},onFocus:o=>{p(a=>g(f({},a),{eventID:D(12),isFocusing:!0}))},onBlur:o=>{e.set_activeInput(!1),p(a=>g(f({},a),{eventID:D(12),isFocusing:!1}))},onCompositionStart:o=>{p(a=>g(f({},a),{eventID:D(12),isComposing:!0}))},onCompositionEnd:o=>{p(a=>g(f({},a),{eventID:D(12),isComposing:!1}))},onKeyDown:o=>{let{key:a,metaKey:n,ctrlKey:d}=o,s=n||d;a=="Tab"?(e.set_openSelector(!1),e.set_activeInput(!1),e.set_preventOpenSelector(!1)):a==" "?c.scope(()=>{e.val_openSelector||e.val_keyword||(o.preventDefault(),e.set_openSelector(!0))}):a=="Backspace"?c.scope(()=>{if(e.val_keyword)return;let u=[...e.val_status.dataValue];u.pop(),e.set_status(i=>g(f({},i),{dataValue:u,eventType:"update",eventID:D(12),isInspected:!1}))}):a=="Enter"&&c.scope(()=>{if(r.isComposing||(o==null?void 0:o.keyCode)===229)return;if(!e.val_openSelector)return e.set_openSelector(!0);if(!e.val_optionFocused)return;let u=e.val_options.find(S=>(S==null?void 0:S.id)==e.val_optionFocused);if(!u)return;let{value:i}=u;e.set_status(S=>{let m=[...S.dataValue];return c.scope(()=>{if(i===null)return m=[];S.dataValue.includes(i)?m=m.filter(O=>O!==i):t.multiSelect?m.push(i):m=[i]}),g(f({},S),{dataValue:m,eventType:"update",eventID:D(12),isInspected:!1})}),e.set_optionsModified(!0),e.set_keyword("")}),c.scope(()=>{if(!["ArrowDown","ArrowUp"].includes(a))return;if(o.preventDefault(),!e.val_openSelector)return e.set_openSelector(!0);let u=a=="ArrowDown"?1:-1,i=C.FilterSelectableOptions(e.val_options),S=i.length-1,m=null;c.scope(()=>{var O,w,h,x,I,k;let y=i.findIndex(R=>(R==null?void 0:R.id)==e.val_optionFocused);if(y==-1&&(y=0),u==1){if(m=(O=i[0])==null?void 0:O.id,s){m=(w=i[S])==null?void 0:w.id;return}if(y==-1||y==S)return;m=(h=i[y+1])==null?void 0:h.id}else{if(m=(x=i[S])==null?void 0:x.id,s){m=(I=i[0])==null?void 0:I.id;return}if(y==-1||y==0)return;m=(k=i[y-1])==null?void 0:k.id}}),e.set_optionFocused(m)}),t.enableFormSubmit&&M.SubmitForm(o,e.rootStates.form)},onChange:o=>{let n=o.target.value;e.set_openSelector(!0),e.set_keyword(n)}},"searchInput")},Selector:e=>{var d;let[t,r]=b("idle"),[p,o]=b("idle");E(()=>{if(!e.rootStates.DynamicOptionsOnSearch||!e.val_openSelector)return;if(e.val_optionsModified)return e.set_optionsModified(!1);if(e.val_status.isComposing)return;if(t=="idle")return r("ok");o("fetch");let s="autocomplete-search-"+e.rootStates.componentId;e.set_optionFocused(""),c.interval.once(()=>Y(void 0,null,function*(){var S;let u=yield e.rootStates.DynamicOptionsOnSearch(e.val_keyword);o("idle");let i=C.InitOptions(u||[]);e.set_options(i),e.set_optionFocused(((S=i[0])==null?void 0:S.id)||"")}),e.rootStates.DynamicOptionsOnSearchDelay||500,s)},[e.val_keyword,e.val_status.isComposing]),E(()=>{let s=c(`[data-selector-id="${e.val_status.componentId}"]`)[0];if(!s)return;let u=c(`[data-autocomplete-input-value="${e.val_optionFocused}"]`)[0];u&&(s.scrollTop=u.offsetTop-24)},[e.val_optionFocused]);let a=C.FilterSelectableOptions(e.val_options,e.rootStates.DynamicOptionsOnSearch?"":e.val_keyword,!0),n={};switch(e.rootStates.SelectorPosition){case 1:n.bottom="100%",n.left=0,n.paddingBottom="1/3";break;case 2:n.bottom="100%",n.right=0,n.paddingBottom="1/3";break;case 3:n.top="100%",n.left=0,n.paddingTop="1/3";break;case 4:n.top="100%",n.right=0,n.paddingTop="1/3";break;default:break}return l(B,g(f({position:"absolute"},n),{freeCSS:f({minWidth:"75%",zIndex:1e3},n.freeCSS),children:l(ce.Body,g(f({className:W("Selector"),borderRadius:"2.tone.secondary",ssCardBox:!0,boxShadow:"1.normal",overflow:"auto","data-selector-id":e.val_status.componentId},e.rootStates.SelectorStyles),{freeCSS:f({maxHeight:12*24},(d=e.rootStates.SelectorStyles)==null?void 0:d.freeCSS),children:F(Z,{gap:"1/12",padding:[1,0],children:[p=="fetch"&&l(P.Center,{padding:"1/2",children:l(ue.Theme.R,{showInitial:!0})}),p!="fetch"&&F(U,{children:[!a.length&&l(N.Supplement,{padding:[0,1],fontColor:"4.thin",children:"\u5019\u88DC\u304C\u898B\u3064\u304B\u308A\u307E\u305B\u3093"}),a.map((s,u)=>{if(!s)return null;let{type:i,value:S}=s,m=e.val_optionFocused==s.id,y=e.val_status.dataValue.includes(S),O=e.rootStates.SelectorComponent;return l(Z,{"data-autocomplete-input-value":s.id,children:l(O,{option:s,isFocused:m,isSelected:y,addCallback:()=>{e.set_status(w=>{let h=[...w.dataValue];return c.scope(()=>{if(S===null)return h=[];w.dataValue.includes(S)?h=h.filter(I=>I!==S):e.rootStates.multiSelect?h.push(S):h=[S]}),g(f({},w),{dataValue:h,eventType:"update",eventID:D(12),isInspected:!1})})}})},s.id)})]})]})}))}))},Selected:e=>{let{rootStates:t,val_status:r,set_status:p,val_optionsDict:o}=e,a=[];return r.dataValue.forEach(n=>{let d=o[c.Stringify(n)];if(!d)return;let s=t.SelectedComponent,u=d.label;(d==null?void 0:d.value)===null&&(u=""),a.push(l(B,{className:W("SelectedCell"),children:l(s,{value:d==null?void 0:d.value,label:u,removeCallback:i=>{if(i.stopPropagation(),i.preventDefault(),t.disabled)return;let S=[...r.dataValue];S=S.filter(m=>m!==n),p(m=>g(f({},m),{dataValue:S,eventType:"update",eventID:D(12),isInspected:!1}))}})},c.Stringify(d==null?void 0:d.value)||D()))}),l(U,{children:a})},Core:e=>{var q,X,$;let{value:t}=e,[r,p]=b(!1),[o,a]=b(!1),[n,d]=b(!1),[s,u]=b(!1),[i,S]=b(""),[m,y]=b(e.options),[O,w]=b(((q=e.options.find(T=>{var L;return(T==null?void 0:T.value)===((L=e.value)==null?void 0:L[0])}))==null?void 0:q.id)||((X=e.options[0])==null?void 0:X.id)||""),[h,x]=b({}),[I,k]=b(M.DefaultStatus(e.componentId,t)),R=ie(!1);E(()=>{o||(R.current?y(e.options):R.current=!0)},[c.Stringify(($=e.options)==null?void 0:$.map(T=>T.value))]),E(()=>{if(!m.length)return;let T=[...m],L=f({},h);T.forEach(V=>{(V==null?void 0:V.type)!="label"&&(L[c.Stringify(V==null?void 0:V.value)]=V)}),x(L)},[m]);let H={rootStates:e,val_options:m,set_options:y,val_optionFocused:O,set_optionFocused:w,val_optionsDict:h,set_optionsDict:x,val_optionsModified:o,set_optionsModified:a,val_preventOpenSelector:r,set_preventOpenSelector:p,val_openSelector:n,set_openSelector:d,val_activeInput:s,set_activeInput:u,val_keyword:i,set_keyword:S,val_status:I,set_status:k},J=!!e.multiSelect;M.CommonEffects({type:J?"autocomplete.multi":"autocomplete.single",states:e,val_status:I,set_status:k,SystemValidation:me});let z=I.dataValue.length&&I.dataValue[0]!==null;return z=z||n||s,F(de,{val_status:I,set_status:k,states:e,children:[l(fe,{componentId:e.componentId,fontSize:e.fontSize,required:e.required,label:e.label,isActive:z}),l(C.Shallow,f({},H)),l(C.Button,f({},H))]})}},oe=e=>{let t=f({},e);return t=g(f({value:[],min:0,max:65535,multiSelect:!0,SearchInput:!0,emptySelect:!0,SelectorComponent:({option:r,isSelected:p,isFocused:o,addCallback:a})=>r?(r==null?void 0:r.type)=="label"?l(U,{children:r.label}):l(ee.Sub.S,{color:"cloud",backgroundColor:"trans",borderRadius:0,fontColor:"2.normal",textAlign:"left",padding:["1/2",1.5],isActive:o,isActiveStyles:{backgroundColor:"cloud"},onClick:a,children:F(P.Left,{gap:"1/2",children:[p&&l(K.Check,{fontColor:"theme"}),l(N.Supplement,{transition:"short",children:r.label})]})}):null,SelectedComponent:({value:r,label:p,removeCallback:o})=>F(P.Left,{ssCardBox:"cloud",borderRadius:"2.tone.secondary",fontSize:"1.mini",padding:"1/2",gap:0,children:[l(B,{padding:[0,"1/4"],children:p}),l(ee.Clear,{flexSizing:"none",color:"nega",fontColor:"4.thin",tabIndex:-1,isRounded:!0,padding:"1/4",onClick:o,freeCSS:{lineHeight:1,aspectRatio:"1/1"},children:l(K.X,{})})]}),SelectorPosition:3},t),{freeCSS:f({cursor:"pointer"},t.freeCSS)}),t.multiSelect||(t.min=0,t.max=1),t.options=t.options||[],t.emptySelect&&(t.options=[{value:null,label:l(N.Supplement,{fontColor:"4.thin",children:"\u9078\u629E\u3092\u89E3\u9664"})},...t.options]),t.value=c.flatArray(t.value),t.options=C.InitOptions(t.options),c.is.nullish(t.rightIcon)&&(t.rightIcon=l(te,{children:l(K.Search,{})}),t.disabled&&(t.rightIcon=l(te,{fontColor:"5.translucent",children:l(K.Ban,{})}))),t.rightIcon&&(t=f({paddingRight:3},t)),t.leftIcon&&(t=f({paddingLeft:3},t)),l(pe,{componentId:t.componentId,children:C.Core,states:Se(t)})};export{oe as Autocomplete,oe as default};
|
|
1
|
+
import{b as m,c as g,d as Q,e as Y}from"../../chunk-C5N2D3ZX.js";import{Fragment as H,jsx as n,jsxs as A}from"react/jsx-runtime";import{useState as b,useEffect as B,useRef as ie}from"react";import c,{UUID as D}from"jmini";import{ExtractStyles as re}from"../../@utils";import{Box as L,Span as se,FAI as N,Column as Z}from"../../atoms";import{Literal as U,Row as M}from"../../mols";import{Button as ee}from"../Button";import{Loader as ue}from"../Loader";import{Sheet as ce}from"../Sheet";import{OptionalInputWrapper as pe,BoxWrapper as de,CoreEffects as W,DefaultBoxishStyles as Se}from"./core";import{InputAutocompleteClasses as z}from"../../@styles/componentClasses";import{InputLabel as fe}from"./Label";import{RightIcon as te}from".";function me(e){let{value:t,states:r}=e,{required:p,options:o,min:a,max:l}=r;a=a||0,l=l||65535;let d=[],s=t.filter(u=>u!==null).length;return p&&(s||d.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"})),s<a&&d.push({type:"invalid",label:a+"\u500B\u4EE5\u4E0A\u9078\u629E\u3057\u3066\u304F\u3060\u3055\u3044"}),s>l&&d.push({type:"invalid",label:l+"\u500B\u307E\u3067\u9078\u629E\u3067\u304D\u307E\u3059"}),{ok:!d.filter(({type:u})=>u=="invalid").length,notice:d}}const C={InitOptions:e=>{let t=[];return e.forEach(r=>{if(!r)return;let{type:p,label:o,value:a,searchValue:l}=r,d=l||c.is.string(o)&&o||""||c.is.string(a)&&a||c.Stringify(a||"")||"";c.is.nullish(o)&&(o=String(a)),t.push(g(m({id:D(8)},r),{searchValue:d,type:p||"selector",label:o,value:a}))}),t},FilterSelectableOptions:(e,t,r)=>{let p=e;return r||(p=e.filter(o=>(o==null?void 0:o.type)!="label")),c.scope(()=>{if(!t)return;let o=t.toLower().replace(/ /g,"");p=p.filter(a=>(a.searchValue||"").toLower().replace(/ /g,"").includes(o))}),p},Shallow:e=>{let{rootStates:t,val_status:r}=e,p=re(t);return n(L,{position:"absolute",top:0,left:0,right:0,height:0,overflow:"hidden",opacity:"trans",freeCSS:{zIndex:3,pointerEvents:"none"},children:n(U.Description,g(m({className:t.className},p),{position:"absolute",width:1,freeCSS:g(m({},p.freeCSS),{color:"orange"}),"data-id":"shallow_"+r.componentId,children:n(L,{"data-input-value-shallow":r.componentId,children:"A"})}))})},Button:e=>{let{rootStates:t,val_keyword:r,set_keyword:p,val_optionFocused:o,set_optionFocused:a,val_preventOpenSelector:l,set_preventOpenSelector:d,val_openSelector:s,set_openSelector:u,val_status:i,set_status:S,val_activeInput:f,set_activeInput:y}=e,j=t,{tone:O,required:w,form:h,className:k,multiSelect:I,enableFormSubmit:x,checkValidationAtFirst:F,onValidate:E,onValidateDelay:J,onUpdateValue:K,onUpdateValidValue:q,onUserAction:X,value:$="",options:R,leftIndicator:P,rightIndicator:T,leftIcon:ve,rightIcon:ye,componentId:_e,status_id:ge,wrapStyles:he,emptySelect:Ie,SearchInput:be,SearchInputPlaceholder:Ce,SelectedComponent:De,SelectorComponent:Oe,SelectorStyles:we,SelectorPosition:ke,DynamicOptionsOnSearch:xe,DynamicOptionsOnSearchDelay:Re}=j,v=Q(j,["tone","required","form","className","multiSelect","enableFormSubmit","checkValidationAtFirst","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","onUserAction","value","options","leftIndicator","rightIndicator","leftIcon","rightIcon","componentId","status_id","wrapStyles","emptySelect","SearchInput","SearchInputPlaceholder","SelectedComponent","SelectorComponent","SelectorStyles","SelectorPosition","DynamicOptionsOnSearch","DynamicOptionsOnSearchDelay"]);return B(()=>{var V;if(t.disabled||!s||c.is.exist(o))return;let _=C.FilterSelectableOptions(e.val_options,r,!1);a(((V=_[0])==null?void 0:V.id)||"")},[r]),B(()=>{if(i.eventType!="init"&&i.eventType!="override"){if(t.max==i.dataValue.length){u(!1),d(!0),p("");return}c("#SearchInput_"+t.componentId).focus()}},[i.dataValue]),B(()=>{let _="autocomplete-click-"+t.componentId;if(!s){c(document).removeEvent([_]);return}c('[data-input-origin="'+t.componentId+'"]')&&(c("#SearchInput_"+t.componentId).focus(),c(document).addEvent({eventID:_,eventType:"mousedown",callback:ae=>{let G=c(ae.target),ne=!!c(G).parent("."+z("Core")).length,le=!!c(G).parent("."+z("Selector")).length;ne||le||(u(!1),y(!1))},options:{passive:!1}}))},[s]),A(H,{children:[n(L,g(m({tabIndex:0},v),{"data-disabled":t.disabled,"data-show-validation":W.isShowValidation(i,!!F),"data-component-id":i.componentId,"data-input-origin":i.componentId,"data-focus":!!s||!!f,className:[k,z("Core")].join(" "),onFocus:_=>{if(v!=null&&v.onFocus&&(v==null||v.onFocus(_)),!t.disabled){if(l)return d(!1);u(!0),y(!0),_.preventDefault()}},onCompositionStart:_=>{v!=null&&v.onCompositionStart&&(v==null||v.onCompositionStart(_))},onCompositionEnd:_=>{v!=null&&v.onCompositionEnd&&(v==null||v.onCompositionEnd(_))},onClick:_=>{v!=null&&v.onClick&&(v==null||v.onClick(_)),!t.disabled&&(u(!0),y(!0))},onKeyDown:_=>{let{key:V}=_;x&&W.SubmitForm(_,h),!s&&(V==" "||V=="ArrowDown"||V=="ArrowUp"||V=="Enter")&&(u(!0),y(!0))},children:A(M.Left,{gap:0,children:[n(se,{width:0,overflow:"hidden",opacity:"trans",children:"A"}),A(M.Left,{flexWrap:!0,flexSizing:0,gap:"1/3",freeCSS:{letterSpacing:".5px"},children:[n(C.Selected,m({},e)),n(C.SearchInput,m({},e))]})]})})),s&&n(C.Selector,m({},e))]})},SearchInput:e=>{let{rootStates:t,val_status:r,set_status:p}=e;return t.disabled||!e.val_openSelector&&!e.val_activeInput?null:n(L,{htmlTag:"input",id:"SearchInput_"+t.componentId,placeholder:t.SearchInputPlaceholder||"\u691C\u7D22...",opacity:e.val_openSelector?"max":"middle",transition:"middle",flexSizing:0,fontSize:"inherit",border:"unset",backgroundColor:"trans",value:e.val_keyword,freeCSS:{outline:"none"},onFocus:o=>{p(a=>g(m({},a),{eventID:D(8),isFocusing:!0}))},onBlur:o=>{e.set_activeInput(!1),p(a=>g(m({},a),{eventID:D(8),isFocusing:!1}))},onCompositionStart:o=>{p(a=>g(m({},a),{eventID:D(8),isComposing:!0}))},onCompositionEnd:o=>{p(a=>g(m({},a),{eventID:D(8),isComposing:!1}))},onKeyDown:o=>{let{key:a,metaKey:l,ctrlKey:d}=o,s=l||d;a=="Tab"?(e.set_openSelector(!1),e.set_activeInput(!1),e.set_preventOpenSelector(!1)):a==" "?c.scope(()=>{e.val_openSelector||e.val_keyword||(o.preventDefault(),e.set_openSelector(!0))}):a=="Backspace"?c.scope(()=>{if(e.val_keyword)return;let u=[...e.val_status.dataValue];u.pop(),e.set_status(i=>g(m({},i),{dataValue:u,eventType:"update",eventID:D(8),isInspected:!1}))}):a=="Enter"&&c.scope(()=>{if(r.isComposing||(o==null?void 0:o.keyCode)===229)return;if(!e.val_openSelector)return e.set_openSelector(!0);if(!e.val_optionFocused)return;let u=e.val_options.find(S=>(S==null?void 0:S.id)==e.val_optionFocused);if(!u)return;let{value:i}=u;e.set_status(S=>{let f=[...S.dataValue];return c.scope(()=>{if(i===null)return f=[];S.dataValue.includes(i)?f=f.filter(O=>O!==i):t.multiSelect?f.push(i):f=[i]}),g(m({},S),{dataValue:f,eventType:"update",eventID:D(8),isInspected:!1})}),e.set_optionsModified(!0),e.set_keyword("")}),c.scope(()=>{if(!["ArrowDown","ArrowUp"].includes(a))return;if(o.preventDefault(),!e.val_openSelector)return e.set_openSelector(!0);let u=a=="ArrowDown"?1:-1,i=C.FilterSelectableOptions(e.val_options,e.val_keyword),S=i.length-1,f=null;c.scope(()=>{var O,w,h,k,I,x,F;let y=i.findIndex(E=>(E==null?void 0:E.id)==e.val_optionFocused);if(y==-1){f=(O=i[0])==null?void 0:O.id;return}if(u==1){if(f=(w=i[0])==null?void 0:w.id,s){f=(h=i[S])==null?void 0:h.id;return}if(y==-1||y==S)return;f=(k=i[y+1])==null?void 0:k.id}else{if(f=(I=i[S])==null?void 0:I.id,s){f=(x=i[0])==null?void 0:x.id;return}if(y==-1||y==0)return;f=(F=i[y-1])==null?void 0:F.id}}),e.set_optionFocused(f)}),t.enableFormSubmit&&W.SubmitForm(o,e.rootStates.form)},onChange:o=>{let l=o.target.value;e.set_openSelector(!0),e.set_optionFocused(""),e.set_keyword(l)}},"searchInput")},Selector:e=>{var d;let[t,r]=b("idle"),[p,o]=b("idle");B(()=>{if(!e.rootStates.DynamicOptionsOnSearch||!e.val_openSelector)return;if(e.val_optionsModified)return e.set_optionsModified(!1);if(e.val_status.isComposing)return;if(t=="idle")return r("ok");o("fetch");let s="autocomplete-search-"+e.rootStates.componentId;e.set_optionFocused(""),c.interval.once(()=>Y(void 0,null,function*(){var S;let u=yield e.rootStates.DynamicOptionsOnSearch(e.val_keyword);o("idle");let i=C.InitOptions(u||[]);e.set_options(i),e.set_optionFocused(((S=i[0])==null?void 0:S.id)||"")}),e.rootStates.DynamicOptionsOnSearchDelay||500,s)},[e.val_keyword,e.val_status.isComposing]),B(()=>{let s=c(`[data-selector-id="${e.val_status.componentId}"]`)[0];if(!s)return;let u=c(`[data-autocomplete-input-value="${e.val_optionFocused}"]`)[0];u&&(s.scrollTop=u.offsetTop-24)},[e.val_optionFocused]);let a=C.FilterSelectableOptions(e.val_options,e.rootStates.DynamicOptionsOnSearch?"":e.val_keyword,!0),l={};switch(e.rootStates.SelectorPosition){case 1:l.bottom="100%",l.left=0,l.paddingBottom="1/3";break;case 2:l.bottom="100%",l.right=0,l.paddingBottom="1/3";break;case 3:l.top="100%",l.left=0,l.paddingTop="1/3";break;case 4:l.top="100%",l.right=0,l.paddingTop="1/3";break;default:break}return n(L,g(m({position:"absolute"},l),{freeCSS:m({minWidth:"75%",zIndex:1e3},l.freeCSS),children:n(ce.Body,g(m({className:z("Selector"),borderRadius:"2.tone.secondary",ssCardBox:!0,boxShadow:"1.normal",overflow:"auto","data-selector-id":e.val_status.componentId},e.rootStates.SelectorStyles),{freeCSS:m({maxHeight:12*24},(d=e.rootStates.SelectorStyles)==null?void 0:d.freeCSS),children:A(Z,{gap:"1/12",padding:[1,0],children:[p=="fetch"&&n(M.Center,{padding:"1/2",children:n(ue.Theme.R,{showInitial:!0})}),p!="fetch"&&A(H,{children:[!a.length&&n(U.Supplement,{padding:[0,1],fontColor:"4.thin",children:"\u5019\u88DC\u304C\u898B\u3064\u304B\u308A\u307E\u305B\u3093"}),a.map((s,u)=>{if(!s)return null;let{type:i,value:S}=s,f=e.val_optionFocused==s.id,y=e.val_status.dataValue.includes(S),O=e.rootStates.SelectorComponent;return n(Z,{"data-autocomplete-input-value":s.id,children:n(O,{option:s,isFocused:f,isSelected:y,addCallback:()=>{e.set_status(w=>{let h=[...w.dataValue];return c.scope(()=>{if(S===null)return h=[];w.dataValue.includes(S)?h=h.filter(I=>I!==S):e.rootStates.multiSelect?h.push(S):h=[S]}),g(m({},w),{dataValue:h,eventType:"update",eventID:D(8),isInspected:!1})})}})},s.id)})]})]})}))}))},Selected:e=>{let{rootStates:t,val_status:r,set_status:p,val_optionsDict:o}=e,a=[];return r.dataValue.forEach(l=>{let d=o[c.Stringify(l)];if(!d)return;let s=t.SelectedComponent,u=d.label;(d==null?void 0:d.value)===null&&(u=""),a.push(n(L,{className:z("SelectedCell"),children:n(s,{value:d==null?void 0:d.value,label:u,removeCallback:i=>{if(i.stopPropagation(),i.preventDefault(),t.disabled)return;let S=[...r.dataValue];S=S.filter(f=>f!==l),p(f=>g(m({},f),{dataValue:S,eventType:"update",eventID:D(8),isInspected:!1}))}})},c.Stringify(d==null?void 0:d.value)||D(8)))}),n(H,{children:a})},Core:e=>{var q,X,$;let{value:t}=e,[r,p]=b(!1),[o,a]=b(!1),[l,d]=b(!1),[s,u]=b(!1),[i,S]=b(""),[f,y]=b(e.options),[O,w]=b(((q=e.options.find(R=>{var P;return(R==null?void 0:R.value)===((P=e.value)==null?void 0:P[0])}))==null?void 0:q.id)||((X=e.options[0])==null?void 0:X.id)||""),[h,k]=b({}),[I,x]=b(W.DefaultStatus(e.componentId,t)),F=ie(!1);B(()=>{o||(F.current?y(e.options):F.current=!0)},[c.Stringify(($=e.options)==null?void 0:$.map(R=>R.value))]),B(()=>{if(!f.length)return;let R=[...f],P=m({},h);R.forEach(T=>{(T==null?void 0:T.type)!="label"&&(P[c.Stringify(T==null?void 0:T.value)]=T)}),k(P)},[f]);let E={rootStates:e,val_options:f,set_options:y,val_optionFocused:O,set_optionFocused:w,val_optionsDict:h,set_optionsDict:k,val_optionsModified:o,set_optionsModified:a,val_preventOpenSelector:r,set_preventOpenSelector:p,val_openSelector:l,set_openSelector:d,val_activeInput:s,set_activeInput:u,val_keyword:i,set_keyword:S,val_status:I,set_status:x},J=!!e.multiSelect;W.CommonEffects({type:J?"autocomplete.multi":"autocomplete.single",states:e,val_status:I,set_status:x,SystemValidation:me});let K=I.dataValue.length&&I.dataValue[0]!==null;return K=K||l||s,A(de,{val_status:I,set_status:x,states:e,children:[n(fe,{componentId:e.componentId,fontSize:e.fontSize,required:e.required,label:e.label,isActive:K}),n(C.Shallow,m({},E)),n(C.Button,m({},E))]})}},oe=e=>{let t=m({},e);return t=g(m({value:[],min:0,max:65535,multiSelect:!0,SearchInput:!0,emptySelect:!0,SelectorComponent:({option:r,isSelected:p,isFocused:o,addCallback:a})=>r?(r==null?void 0:r.type)=="label"?n(H,{children:r.label}):n(ee.Sub.S,{color:"cloud",backgroundColor:"trans",borderRadius:0,fontColor:"2.normal",textAlign:"left",padding:["1/2",1.5],isActive:o,isActiveStyles:{backgroundColor:"cloud"},onClick:a,children:A(M.Left,{gap:"1/2",children:[p&&n(N.Check,{fontColor:"theme"}),n(U.Supplement,{transition:"short",children:r.label})]})}):null,SelectedComponent:({value:r,label:p,removeCallback:o})=>A(M.Left,{ssCardBox:"cloud",borderRadius:"2.tone.secondary",fontSize:"1.mini",padding:"1/2",gap:0,children:[n(L,{padding:[0,"1/4"],children:p}),n(ee.Clear,{flexSizing:"none",color:"nega",fontColor:"4.thin",tabIndex:-1,isRounded:!0,padding:"1/4",onClick:o,freeCSS:{lineHeight:1,aspectRatio:"1/1"},children:n(N.X,{})})]}),SelectorPosition:3},t),{freeCSS:m({cursor:"pointer"},t.freeCSS)}),t.multiSelect||(t.min=0,t.max=1),t.options=t.options||[],t.emptySelect&&(t.options=[{value:null,label:n(U.Supplement,{fontColor:"4.thin",children:"\u9078\u629E\u3092\u89E3\u9664"})},...t.options]),t.value=c.flatArray(t.value),t.options=C.InitOptions(t.options),c.is.nullish(t.rightIcon)&&(t.rightIcon=n(te,{children:n(N.Search,{})}),t.disabled&&(t.rightIcon=n(te,{fontColor:"5.translucent",children:n(N.Ban,{})}))),t.rightIcon&&(t=m({paddingRight:3},t)),t.leftIcon&&(t=m({paddingLeft:3},t)),n(pe,{componentId:t.componentId,children:C.Core,states:Se(t)})};export{oe as Autocomplete,oe as default};
|
package/dist/fn/Input/core.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{b as n,c as u,e as R}from"../../chunk-C5N2D3ZX.js";import{jsx as m,jsxs as C}from"react/jsx-runtime";import{useState as _,useEffect as
|
|
1
|
+
import{b as n,c as u,e as R}from"../../chunk-C5N2D3ZX.js";import{jsx as m,jsxs as C}from"react/jsx-runtime";import{useState as _,useEffect as g}from"react";import c,{UUID as y,useStore as S}from"jmini";import{$$fromRoot as x}from"../../@utils";import{InputClasses as T}from"../../@styles/componentClasses";import{Box as k,Flex as D,FAI as v,Column as B}from"../../atoms";import{Row as b,Literal as E}from"../../mols";import{Button as F}from"../Button";import V from"../Tooltips";const Z=t=>{let[i]=_(t.componentId||y(12));t=n({},t),t.states=u(n({enableFormSubmit:!0,status_id:y(),override:"never",form:"",id:y(),"aria-label":"Input-"+i},t.states),{componentId:i});let{children:a}=t;return m(a,n({},t.states))},tt=t=>{let{children:i,val_status:a,states:e}=t,{leftIcon:r,wrapStyles:p}=e,s=a.notice||[];return e.checkValidationAtFirst||a.eventType=="init"&&(s=[]),C(b.Center,u(n({position:"relative",verticalAlign:"unset",gap:0},p),{className:T("Wrapper"),"data-notice-uid":a.componentId,children:[m(h.Notice,{notice:s,val_status:a}),e.leftIndicator,C(D,{position:"relative",flexSizing:"auto",children:[i,r,m(h.RightIcon,n({},t)),m(h.ClearButton,n({},t))]}),e.rightIndicator]}))},h={ClearButton:t=>!t.states.clearButton||!t.val_status.dataValue?null:m(F.Normal,{ssSphere:2,flexCenter:!0,fontColor:"5.translucent",ssEffectsOnActive:["ripple.theme"],position:"absolute",right:1,top:"50%",freeCSS:{zIndex:3,transform:"translateY(-50%)"},onClick:()=>{t.set_status(i=>u(n({},i),{dataValue:"",formatValue:"",eventType:"update",eventID:y(12),isInspected:!1}))},children:m(v.X,{})}),RightIcon:t=>t.states.clearButton&&t.val_status.dataValue?null:t.states.rightIcon,Notice:t=>{let{notice:i,val_status:a}=t,{componentId:e}=a,r="NoticeTimer-"+e,p="NoticeTimerClose-"+e,s="notice-tips-"+e;return g(()=>{c.interval.once(()=>{if(!(i!=null&&i.length)){V.close(s);return}V.open({tipsID:s,parent:`[data-notice-uid="${e}"]`,gravityPoint:24,padding:[1,0],closeAtParentBlur:!1,content:C(V.Body,{padding:["1/2","2/3"],fontSize:"1.mini",position:"relative",children:[m(k,{position:"absolute",unitHeight:1,unitWidth:1,right:1,backgroundColor:"dark",freeCSS:{zIndex:1,transform:"rotate(45deg)",top:-6}}),m(B,{backgroundColor:"inherit",gap:"1/3",position:"relative",freeCSS:{zIndex:2},children:i.map((o,d)=>{let{type:f,label:l}=o,I=f=="invalid"?v.Exclamation:f=="warn"?v.Exclamation:v.Check;return C(b.Left,{gap:0,borderRadius:"2.tone.secondary",children:[m(I,{flexCenter:!0,fontSize:"2.normal",fontColor:{invalid:"nega",warn:"warn",valid:"posi"}[f]}),m(E.Supplement,{fontSize:"0.xs",fontColor:"white",children:l})]},d+"-"+c.Stringify(o))})})]})})},350,r),c.interval.once(()=>{V.close(s)},6e3,p)},[i]),null}},w={DefaultStatus:(t,i)=>({componentId:t,dataValue:i,eventType:"init",eventID:y(12)}),CommonEffects:function(t){let{type:i,states:a,val_status:e,set_status:r,SystemValidation:p}=t;a=n({},a);let{componentId:s}=e;t.type=="time",g(()=>(S.update({[s]:{ResolveRefresh:null,Refresh:()=>new Promise((o,d)=>{S.get(s).ResolveRefresh=o,r(f=>u(n({},f),{isInspected:!1,eventType:"refresh",eventID:y(12)}))})}}),()=>{S.delete(s)}),[]),g(()=>{w.ValidationCheck({val_status:e,set_status:r,SystemValidation:p,states:a})},[e.eventID,e.dataValue]),c.scope(()=>{let{override:o}=a;if(o=="never"||o=="beforeModified"&&!["init","override"].includes(e.eventType)||e.isComposing)return;let d=S.get(e.componentId);if(!d)return;if(c.is.equal(a.value,e.dataValue)){d.status_id=a.status_id;return}let f=c.SortifyObject(a.value),l=c.SortifyObject(e.dataValue);if(f&&l&&c.is.equal(f,l)){d.status_id=a.status_id;return}a.status_id!=d.status_id&&(e.eventType=="update"&&!e.isInspected||r(I=>u(n(u(n({},I),{dataValue:a.value}),t.ExtraOverrideStates&&t.ExtraOverrideStates()),{eventType:"override",eventID:y(12),isInspected:!1,isValidated:!1})))});{let{componentId:o,eventType:d,dataValue:f}=e,l=f;i=="autocomplete.single"||i=="list.radio"?l=l[0]:a.isChecker&&(l=!!l[0]),g(()=>(c.scope(()=>{if(a.form=a.form||"testForm",a.name&&a.form&&S.update({[["form-data",a.form].join("-")]:{[a.name]:{componentId:o,type:i,value:l,validation:e.isValidated}}}),!e.isInspected||d!="refresh")return;let I=S.get(o);I&&I.ResolveRefresh&&I.ResolveRefresh(null)}),()=>{S.update({[["form-data",a.form].join("-")]:{[a.name]:null}})}),[e]),g(()=>{a.onUserAction&&a.onUserAction(l,{eventType:d,componentId:o,isInspected:!!e.isInspected,isValidated:!!e.isValidated,isComposing:!!e.isComposing,isFocusing:!!e.isFocusing})},[e]),g(()=>{d=="update"&&e.isInspected&&(a.onUpdateValue&&a.onUpdateValue(l,{eventType:d,componentId:o,isValidated:!!e.isValidated,isComposing:!!e.isComposing,isFocusing:!!e.isFocusing}),e.isValidated&&a.onUpdateValidValue&&a.onUpdateValidValue(l,{eventType:d,componentId:o,isValidated:!!e.isValidated,isComposing:!!e.isComposing,isFocusing:!!e.isFocusing}))},[e.isValidated,e.isInspected,e.dataValue])}},ValidationCheck:t=>{let{states:i}=t;if(t.val_status.isInspected)return;let a="ValidationTimer-"+t.val_status.componentId;c.interval.abort(a),t.set_status(s=>u(n({},s),{isInspected:!1,isValidated:!1}));let e=t.SystemValidation({value:t.val_status.dataValue,states:i});if(!e.ok){t.set_status(s=>u(n({},s),{isInspected:!0,isValidated:!!e.ok,notice:e.notice||[]}));return}let r=e.notice||[];const p=()=>R(void 0,null,function*(){if(!i.onValidate)return;let s=yield i.onValidate(t.val_status.dataValue,t.val_status.eventType,t.val_status);t.set_status(o=>u(n({},o),{isInspected:!0,isValidated:!!s.ok,notice:[...r,...s.notice||[]]}))});if(i.onValidate){if(t.val_status.eventType=="refresh"){p();return}c.interval.once(p,i.onValidateDelay||500,a);return}t.set_status(s=>u(n({},s),{eventID:y(12),isInspected:!0,isValidated:!0,notice:r}))},SubmitForm:(t,i)=>{let a=!1;if(!i)return a;let e=x(`[data-form-submit-button="${i}"]`)[0];if(!e)return a;let r=e.dataset.sdfike||"",p=t.key,s=t.ctrlKey||t.metaKey;return c.scope(()=>{r.includes("enter")&&(p!="Enter"||t.nativeEvent.isComposing||(t==null?void 0:t.keyCode)==229)||((p=="Enter"&&(r.includes("enter")||r.includes("auxEnter")&&s)||p==" "&&r.includes("space"))&&(e.click(),t.preventDefault()),a=!0)}),a},isShowValidation:(t,i)=>{let a=t.isValidated;return!i&&t.eventType=="init"?!0:a}},et=function(t){t=n({tone:"border"},t);let i=c.scope(()=>{if(t.tone=="plain")return{};let e={padding:1,transition:"middle",flexSizing:"auto",boxShadow:"0.min"};return t.tone=="border"?e=u(n({},e),{border:!0,borderRadius:"2.tone.secondary",backgroundColor:"layer.1"}):t.tone=="cloud"?e=u(n({},e),{border:"1.thin",borderRadius:"2.tone.secondary",backgroundColor:"cloud"}):t.tone=="bottomBorder"&&(e=u(n({},e),{borderRadius:0,border:"unset",borderBottom:!0,backgroundColor:"cloud"})),e});return u(n(n(n(n(n(n({fontColor:"2.normal"},i),!!t.rightIcon&&{paddingRight:3}),!!t.leftIcon&&{paddingLeft:3}),!!t.leftIndicator&&{borderTopLeftRadius:"2/3",borderBottomLeftRadius:"2/3",marginLeft:"1/4"}),!!t.rightIndicator&&{borderTopRightRadius:"2/3",borderBottomRightRadius:"2/3",marginRight:"1/4"}),t),{freeCSS:n({letterSpacing:"1px",resize:"none"},t.freeCSS),className:[T("Input"),t.className].join(" ")})};export{tt as BoxWrapper,w as CoreEffects,et as DefaultBoxishStyles,Z as OptionalInputWrapper};
|
package/dist/fn/Input/index.d.ts
CHANGED
package/dist/fn/Input/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import"../../chunk-C5N2D3ZX.js";import*as o from"./Parts";export*from"./Parts";import
|
|
1
|
+
import"../../chunk-C5N2D3ZX.js";import*as o from"./Parts";export*from"./Parts";import i from"./Plain";import a from"./Hidden";import p from"./TextField";import n from"./Contenteditable";import m from"./DigitCharacters";import l from"./Time";import d from"./Time/Selector";import s from"./Select";import c from"./Autocomplete";import*as r from"./List";import x from"./Search";import y from"./Filer";import T from"./Slider";import f from"./Switch";import g from"./Checker";import b from"./Segmented";import S from"./Color";import V from"./CollectForm";var t;(e=>(e.Plain=i,e.Hidden=a,e.TextField=p,e.Contenteditable=n,e.DigitCharacters=m,e.Time=l,e.TimeSelector=d,e.Select=s,e.Autocomplete=c,e.List=r.List,e.Radio=r.Radio,e.Checkbox=r.Checkbox,e.Checker=g,e.Search=x,e.Filer=y,e.Slider=T,e.Switch=f,e.Segmented=b,e.Color=S,e.LeftIcon=o.LeftIcon,e.RightIcon=o.RightIcon,e.LeftIndicator=o.LeftIndicator,e.RightIndicator=o.RightIndicator,e.RequiredSign=o.RequiredSign,e.RequiredShortSign=o.RequiredShortSign,e.OmitSign=o.OmitSign,e.CollectForm=V))(t||(t={}));export{t as Input,t as default};
|