amotify 0.2.261 → 0.2.262
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 m,c as g,d as Z,e as ee}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 se}from"react";import r,{UUID as w}from"jmini";import{ExtractStyles as ue}from"../../@utils";import{Box as L,Span as ce,FAI as N,Column as te}from"../../atoms";import{Literal as U,Row as M}from"../../mols";import{Button as oe}from"../Button";import{Loader as pe}from"../Loader";import{Sheet as de}from"../Sheet";import{OptionalInputWrapper as Se,BoxWrapper as fe,CoreEffects as W,DefaultBoxishStyles as me}from"./core";import{InputAutocompleteClasses as z}from"../../@styles/componentClasses";import{InputLabel as ve}from"./Label";import{RightIcon as le}from".";function ye(e){let{value:t,states:s}=e,{required:p,options:o,min:l,max:a}=s;l=l||0,a=a||65535;let d=[],u=t.filter(c=>c!==null).length;return p&&(u||d.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"})),u<l&&d.push({type:"invalid",label:l+"\u500B\u4EE5\u4E0A\u9078\u629E\u3057\u3066\u304F\u3060\u3055\u3044"}),u>a&&d.push({type:"invalid",label:a+"\u500B\u307E\u3067\u9078\u629E\u3067\u304D\u307E\u3059"}),{ok:!d.filter(({type:c})=>c=="invalid").length,notice:d}}const C={InitOptions:e=>{let t=[];return e.forEach(s=>{if(!s)return;let{type:p,label:o,value:l,searchValue:a}=s,d=a||r.is.string(o)&&o||""||r.is.string(l)&&l||r.Stringify(l||"")||"";r.is.nullish(o)&&(o=String(l)),t.push(g(m({id:w(8)},s),{searchValue:d,type:p||"selector",label:o,value:l}))}),t},FilterSelectableOptions:(e,t,s)=>{let p=e;return s||(p=e.filter(o=>(o==null?void 0:o.type)!="label")),r.scope(()=>{if(!t)return;let o=t.toLower().replace(/ /g,"");p=p.filter(l=>(l.searchValue||"").toLower().replace(/ /g,"").includes(o))}),p},Shallow:e=>{let{rootStates:t,val_status:s}=e,p=ue(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_"+s.componentId,children:n(L,{"data-input-value-shallow":s.componentId,children:"A"})}))})},Button:e=>{let{rootStates:t,val_keyword:s,set_keyword:p,val_optionFocused:o,set_optionFocused:l,val_preventOpenSelector:a,set_preventOpenSelector:d,val_openSelector:u,set_openSelector:c,val_status:i,set_status:S,val_activeInput:f,set_activeInput:y}=e,G=t,{tone:D,required:O,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:_e,rightIcon:ge,componentId:he,status_id:Ie,wrapStyles:be,emptySelect:Ce,SearchInput:we,SearchInputPlaceholder:De,SelectedComponent:Oe,SelectorComponent:ke,SelectorStyles:xe,SelectorPosition:Re,DynamicOptionsOnSearch:Te,DynamicOptionsOnSearchDelay:Ve}=G,v=Z(G,["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"]),J="#SearchInput_"+t.componentId;return B(()=>{var V;if(t.disabled||!u||r.is.exist(o))return;let _=C.FilterSelectableOptions(e.val_options,s,!1);l(((V=_[0])==null?void 0:V.id)||"")},[s]),B(()=>{if(i.eventType!="init"&&i.eventType!="override"){if(t.max==i.rawValue.length){c(!1),d(!0),p("");return}r(J).focus()}},[i.rawValue]),B(()=>{let _="autocomplete-click-"+t.componentId;if(!u){r(document).removeEvent([_]);return}r('[data-input-origin="'+t.componentId+'"]')&&(r(J).focus(),r(document).addEvent({eventID:_,eventType:"mousedown",callback:ae=>{var Y;let Q=r(ae.target),ie=!!r(Q).parent("."+z("Core")).length,re=!!r(Q).parent("."+z("Selector")).length;ie||re||((Y=r(J)[0])==null||Y.blur(),c(!1),y(!1))},options:{passive:!1}}))},[u]),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":!!u||!!f,className:[k,z("Core")].join(" "),onFocus:_=>{if(v!=null&&v.onFocus&&(v==null||v.onFocus(_)),!t.disabled){if(a)return d(!1);c(!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&&(c(!0),y(!0))},onKeyDown:_=>{let{key:V}=_;x&&W.SubmitForm(_,h),!u&&(V==" "||V=="ArrowDown"||V=="ArrowUp"||V=="Enter")&&(c(!0),y(!0))},children:A(M.Left,{gap:0,children:[n(ce,{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))]})]})})),u&&n(C.Selector,m({},e))]})},SearchInput:e=>{let{rootStates:t,val_status:s,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(l=>g(m({},l),{eventID:w(8),isFocusing:!0}))},onBlur:o=>{e.set_activeInput(!1),p(l=>g(m({},l),{eventID:w(8),isFocusing:!1}))},onCompositionStart:o=>{p(l=>g(m({},l),{eventID:w(8),isComposing:!0}))},onCompositionEnd:o=>{p(l=>g(m({},l),{eventID:w(8),isComposing:!1}))},onKeyDown:o=>{let{key:l,metaKey:a,ctrlKey:d}=o,u=a||d;l=="Tab"?(e.set_openSelector(!1),e.set_activeInput(!1),e.set_preventOpenSelector(!1)):l==" "?r.scope(()=>{e.val_openSelector||e.val_keyword||(o.preventDefault(),e.set_openSelector(!0))}):l=="Backspace"?r.scope(()=>{if(e.val_keyword)return;let c=[...e.val_status.rawValue];c.pop(),e.set_status(i=>g(m({},i),{rawValue:c,eventType:"update",eventID:w(8),isInspected:!1}))}):l=="Enter"&&r.scope(()=>{if(s.isComposing||(o==null?void 0:o.keyCode)===229)return;if(!e.val_openSelector)return e.set_openSelector(!0);if(!e.val_optionFocused)return;let c=e.val_options.find(S=>(S==null?void 0:S.id)==e.val_optionFocused);if(!c)return;let{value:i}=c;e.set_status(S=>{let f=[...S.rawValue];return r.scope(()=>{if(i===null)return f=[];S.rawValue.includes(i)?f=f.filter(D=>D!==i):t.multiSelect?f.push(i):f=[i]}),g(m({},S),{rawValue:f,eventType:"update",eventID:w(8),isInspected:!1})}),e.set_optionsModified(!0),e.set_keyword("")}),r.scope(()=>{if(!["ArrowDown","ArrowUp"].includes(l))return;if(o.preventDefault(),!e.val_openSelector)return e.set_openSelector(!0);let c=l=="ArrowDown"?1:-1,i=C.FilterSelectableOptions(e.val_options,e.val_keyword),S=i.length-1,f=null;r.scope(()=>{var D,O,h,k,I,x,F;let y=i.findIndex(E=>(E==null?void 0:E.id)==e.val_optionFocused);if(y==-1){f=(D=i[0])==null?void 0:D.id;return}if(c==1){if(f=(O=i[0])==null?void 0:O.id,u){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,u){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 a=o.target.value;e.set_openSelector(!0),e.set_optionFocused(""),e.set_keyword(a)}},"searchInput")},Selector:e=>{var d;let[t,s]=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 s("ok");o("fetch");let u="autocomplete-search-"+e.rootStates.componentId;e.set_optionFocused(""),r.interval.once(()=>ee(void 0,null,function*(){var S;let c=yield e.rootStates.DynamicOptionsOnSearch(e.val_keyword);o("idle");let i=C.InitOptions(c||[]);e.set_options(i),e.set_optionFocused(((S=i[0])==null?void 0:S.id)||"")}),e.rootStates.DynamicOptionsOnSearchDelay||500,u)},[e.val_keyword,e.val_status.isComposing]),B(()=>{let u=r(`[data-selector-id="${e.val_status.componentId}"]`)[0];if(!u)return;let c=r(`[data-autocomplete-input-value="${e.val_optionFocused}"]`)[0];c&&(u.scrollTop=c.offsetTop-24)},[e.val_optionFocused]);let l=C.FilterSelectableOptions(e.val_options,e.rootStates.DynamicOptionsOnSearch?"":e.val_keyword,!0),a={};switch(e.rootStates.SelectorPosition){case 1:a.bottom="100%",a.left=0,a.paddingBottom="1/3";break;case 2:a.bottom="100%",a.right=0,a.paddingBottom="1/3";break;case 3:a.top="100%",a.left=0,a.paddingTop="1/3";break;case 4:a.top="100%",a.right=0,a.paddingTop="1/3";break;default:break}return n(L,g(m({position:"absolute"},a),{freeCSS:m({minWidth:"75%",zIndex:1e3},a.freeCSS),children:n(de.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(te,{gap:"1/12",padding:[1,0],children:[p=="fetch"&&n(M.Center,{padding:"1/2",children:n(pe.Theme.R,{showInitial:!0})}),p!="fetch"&&A(H,{children:[!l.length&&n(U.Supplement,{padding:[0,1],fontColor:"4.thin",children:"\u5019\u88DC\u304C\u898B\u3064\u304B\u308A\u307E\u305B\u3093"}),l.map((u,c)=>{if(!u)return null;let{type:i,value:S}=u,f=e.val_optionFocused==u.id,y=e.val_status.rawValue.includes(S),D=e.rootStates.SelectorComponent;return n(te,{"data-autocomplete-input-value":u.id,children:n(D,{option:u,isFocused:f,isSelected:y,addCallback:()=>{e.set_status(O=>{let h=[...O.rawValue];return r.scope(()=>{if(S===null)return h=[];O.rawValue.includes(S)?h=h.filter(I=>I!==S):e.rootStates.multiSelect?h.push(S):h=[S]}),g(m({},O),{rawValue:h,eventType:"update",eventID:w(8),isInspected:!1})})}})},u.id)})]})]})}))}))},Selected:e=>{let{rootStates:t,val_status:s,set_status:p,val_optionsDict:o}=e,l=[];return s.rawValue.forEach(a=>{let d=o[r.Stringify(a)];if(!d)return;let u=t.SelectedComponent,c=d.label;(d==null?void 0:d.value)===null&&(c=""),l.push(n(L,{className:z("SelectedCell"),children:n(u,{value:d==null?void 0:d.value,label:c,removeCallback:i=>{if(i.stopPropagation(),i.preventDefault(),t.disabled)return;let S=[...s.rawValue];S=S.filter(f=>f!==a),p(f=>g(m({},f),{rawValue:S,eventType:"update",eventID:w(8),isInspected:!1}))}})},r.Stringify(d==null?void 0:d.value)||w(8)))}),n(H,{children:l})},Core:e=>{var q,X,$;let{value:t}=e,[s,p]=b(!1),[o,l]=b(!1),[a,d]=b(!1),[u,c]=b(!1),[i,S]=b(""),[f,y]=b(e.options),[D,O]=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=se(!1);B(()=>{o||(F.current?y(e.options):F.current=!0)},[r.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[r.Stringify(T==null?void 0:T.value)]=T)}),k(P)},[f]);let E={rootStates:e,val_options:f,set_options:y,val_optionFocused:D,set_optionFocused:O,val_optionsDict:h,set_optionsDict:k,val_optionsModified:o,set_optionsModified:l,val_preventOpenSelector:s,set_preventOpenSelector:p,val_openSelector:a,set_openSelector:d,val_activeInput:u,set_activeInput:c,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:ye});let K=I.rawValue.length&&I.rawValue[0]!==null;return K=K||a||u,A(fe,{val_status:I,set_status:x,states:e,children:[n(ve,{componentId:e.componentId,fontSize:e.fontSize,required:e.required,label:e.label,isActive:K}),n(C.Shallow,m({},E)),n(C.Button,m({},E))]})}},ne=e=>{let t=m({},e);return t=g(m({value:[],min:0,max:65535,multiSelect:!0,SearchInput:!0,emptySelect:!0,SelectorComponent:({option:s,isSelected:p,isFocused:o,addCallback:l})=>s?(s==null?void 0:s.type)=="label"?n(H,{children:s.label}):n(oe.Sub.S,{color:"cloud",backgroundColor:"trans",borderRadius:0,fontColor:"2.normal",textAlign:"left",padding:["1/2",1.5],isActive:o,isActiveStyles:{backgroundColor:"cloud"},onClick:l,children:A(M.Left,{gap:"1/2",children:[p&&n(N.Check,{fontColor:"theme"}),n(U.Supplement,{transition:"short",children:s.label})]})}):null,SelectedComponent:({value:s,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(oe.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=r.flatArray(t.value),t.options=C.InitOptions(t.options),r.is.nullish(t.rightIcon)&&(t.rightIcon=n(le,{children:n(N.Search,{})}),t.disabled&&(t.rightIcon=n(le,{fontColor:"5.translucent",children:n(N.Ban,{})}))),t.rightIcon&&(t=m({paddingRight:3},t)),t.leftIcon&&(t=m({paddingLeft:3},t)),n(Se,{componentId:t.componentId,children:C.Core,states:me(t)})};export{ne as Autocomplete,ne as default};
|
|
1
|
+
import{b as f,c as _,d as Y,e as Z}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 se}from"react";import c,{UUID as C}from"jmini";import{ExtractStyles as ue}from"../../@utils";import{Box as L,Span as ce,FAI as N,Column as ee}from"../../atoms";import{Literal as U,Row as M}from"../../mols";import{Button as te}from"../Button";import{Loader as pe}from"../Loader";import{Sheet as de}from"../Sheet";import{OptionalInputWrapper as Se,BoxWrapper as fe,CoreEffects as W,DefaultBoxishStyles as me}from"./core";import{InputAutocompleteClasses as z}from"../../@styles/componentClasses";import{InputLabel as ve}from"./Label";import{RightIcon as oe}from".";function ye(e){let{value:t,states:r}=e,{required:p,options:o,min:l,max:a}=r;l=l||0,a=a||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<l&&d.push({type:"invalid",label:l+"\u500B\u4EE5\u4E0A\u9078\u629E\u3057\u3066\u304F\u3060\u3055\u3044"}),s>a&&d.push({type:"invalid",label:a+"\u500B\u307E\u3067\u9078\u629E\u3067\u304D\u307E\u3059"}),{ok:!d.filter(({type:u})=>u=="invalid").length,notice:d}}const w={InitOptions:e=>{let t=[];return e.forEach(r=>{if(!r)return;let{type:p,label:o,value:l,searchValue:a}=r,d=a||c.is.string(o)&&o||""||c.is.string(l)&&l||c.Stringify(l||"")||"";c.is.nullish(o)&&(o=String(l)),t.push(_(f({id:C(8)},r),{searchValue:d,type:p||"selector",label:o,value:l}))}),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(l=>(l.searchValue||"").toLower().replace(/ /g,"").includes(o))}),p},Shallow:e=>{let{rootStates:t,val_status:r}=e,p=ue(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,_(f({className:t.className},p),{position:"absolute",width:1,freeCSS:_(f({},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:l,val_preventOpenSelector:a,set_preventOpenSelector:d,val_openSelector:s,set_openSelector:u,val_status:i,set_status:S,val_activeInput:m,set_activeInput:y}=e,G=t,{tone:D,required:O,form:g,className:x,multiSelect:I,enableFormSubmit:k,checkValidationAtFirst:F,onValidate:E,onValidateDelay:J,onUpdateValue:K,onUpdateValidValue:q,onUserAction:X,value:$="",options:R,leftIndicator:P,rightIndicator:T,leftIcon:_e,rightIcon:he,componentId:ge,status_id:Ie,wrapStyles:be,emptySelect:Ce,SearchInput:we,SearchInputPlaceholder:De,SelectedComponent:Oe,SelectorComponent:xe,SelectorStyles:ke,SelectorPosition:Re,DynamicOptionsOnSearch:Te,DynamicOptionsOnSearchDelay:Ve}=G,v=Y(G,["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"]),j="#SearchInput_"+t.componentId;return B(()=>{var V;if(t.disabled||!s||c.is.exist(o))return;let h=w.FilterSelectableOptions(e.val_options,r,!1);l(((V=h[0])==null?void 0:V.id)||"")},[r]),B(()=>{if(i.eventType!="init"&&i.eventType!="override"){if(t.max==i.rawValue.length){u(!1),d(!0),p("");return}c(j).focus()}},[i.rawValue]),B(()=>{let h="autocomplete-click-"+t.componentId;if(!s){c(document).removeEvent([h]);return}c('[data-input-origin="'+t.componentId+'"]')&&(c(j).focus(),c(document).addEvent({eventID:h,eventType:"mousedown",callback:ne=>{let Q=c(ne.target),ae=!!c(Q).parent("."+z("Core")).length,ie=!!c(Q).parent("."+z("Selector")).length;ae||ie||(S(re=>_(f({},re),{eventID:C(8),isFocusing:!1})),u(!1),y(!1))},options:{passive:!1}}))},[s]),A(H,{children:[n(L,_(f({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||!!m,className:[x,z("Core")].join(" "),onFocus:h=>{if(v!=null&&v.onFocus&&(v==null||v.onFocus(h)),!t.disabled){if(a)return d(!1);u(!0),y(!0),h.preventDefault()}},onCompositionStart:h=>{v!=null&&v.onCompositionStart&&(v==null||v.onCompositionStart(h))},onCompositionEnd:h=>{v!=null&&v.onCompositionEnd&&(v==null||v.onCompositionEnd(h))},onClick:h=>{v!=null&&v.onClick&&(v==null||v.onClick(h)),!t.disabled&&(u(!0),y(!0))},onKeyDown:h=>{let{key:V}=h;k&&W.SubmitForm(h,g),!s&&(V==" "||V=="ArrowDown"||V=="ArrowUp"||V=="Enter")&&(u(!0),y(!0))},children:A(M.Left,{gap:0,children:[n(ce,{width:0,overflow:"hidden",opacity:"trans",children:"A"}),A(M.Left,{flexWrap:!0,flexSizing:0,gap:"1/3",freeCSS:{letterSpacing:".5px"},children:[n(w.Selected,f({},e)),n(w.SearchInput,f({},e))]})]})})),s&&n(w.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: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(l=>_(f({},l),{eventID:C(8),isFocusing:!0}))},onBlur:o=>{e.set_activeInput(!1),p(l=>_(f({},l),{eventID:C(8),isFocusing:!1}))},onCompositionStart:o=>{p(l=>_(f({},l),{eventID:C(8),isComposing:!0}))},onCompositionEnd:o=>{p(l=>_(f({},l),{eventID:C(8),isComposing:!1}))},onKeyDown:o=>{let{key:l,metaKey:a,ctrlKey:d}=o,s=a||d;l=="Tab"?(e.set_openSelector(!1),e.set_activeInput(!1),e.set_preventOpenSelector(!1)):l==" "?c.scope(()=>{e.val_openSelector||e.val_keyword||(o.preventDefault(),e.set_openSelector(!0))}):l=="Backspace"?c.scope(()=>{if(e.val_keyword)return;let u=[...e.val_status.rawValue];u.pop(),e.set_status(i=>_(f({},i),{rawValue:u,eventType:"update",eventID:C(8),isInspected:!1}))}):l=="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.rawValue];return c.scope(()=>{if(i===null)return m=[];S.rawValue.includes(i)?m=m.filter(D=>D!==i):t.multiSelect?m.push(i):m=[i]}),_(f({},S),{rawValue:m,eventType:"update",eventID:C(8),isInspected:!1})}),e.set_optionsModified(!0),e.set_keyword("")}),c.scope(()=>{if(!["ArrowDown","ArrowUp"].includes(l))return;if(o.preventDefault(),!e.val_openSelector)return e.set_openSelector(!0);let u=l=="ArrowDown"?1:-1,i=w.FilterSelectableOptions(e.val_options,e.val_keyword),S=i.length-1,m=null;c.scope(()=>{var D,O,g,x,I,k,F;let y=i.findIndex(E=>(E==null?void 0:E.id)==e.val_optionFocused);if(y==-1){m=(D=i[0])==null?void 0:D.id;return}if(u==1){if(m=(O=i[0])==null?void 0:O.id,s){m=(g=i[S])==null?void 0:g.id;return}if(y==-1||y==S)return;m=(x=i[y+1])==null?void 0:x.id}else{if(m=(I=i[S])==null?void 0:I.id,s){m=(k=i[0])==null?void 0:k.id;return}if(y==-1||y==0)return;m=(F=i[y-1])==null?void 0:F.id}}),e.set_optionFocused(m)}),t.enableFormSubmit&&W.SubmitForm(o,e.rootStates.form)},onChange:o=>{let a=o.target.value;e.set_openSelector(!0),e.set_optionFocused(""),e.set_keyword(a)}},"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(()=>Z(void 0,null,function*(){var S;let u=yield e.rootStates.DynamicOptionsOnSearch(e.val_keyword);o("idle");let i=w.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 l=w.FilterSelectableOptions(e.val_options,e.rootStates.DynamicOptionsOnSearch?"":e.val_keyword,!0),a={};switch(e.rootStates.SelectorPosition){case 1:a.bottom="100%",a.left=0,a.paddingBottom="1/3";break;case 2:a.bottom="100%",a.right=0,a.paddingBottom="1/3";break;case 3:a.top="100%",a.left=0,a.paddingTop="1/3";break;case 4:a.top="100%",a.right=0,a.paddingTop="1/3";break;default:break}return n(L,_(f({position:"absolute"},a),{freeCSS:f({minWidth:"75%",zIndex:1e3},a.freeCSS),children:n(de.Body,_(f({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:f({maxHeight:12*24},(d=e.rootStates.SelectorStyles)==null?void 0:d.freeCSS),children:A(ee,{gap:"1/12",padding:[1,0],children:[p=="fetch"&&n(M.Center,{padding:"1/2",children:n(pe.Theme.R,{showInitial:!0})}),p!="fetch"&&A(H,{children:[!l.length&&n(U.Supplement,{padding:[0,1],fontColor:"4.thin",children:"\u5019\u88DC\u304C\u898B\u3064\u304B\u308A\u307E\u305B\u3093"}),l.map((s,u)=>{if(!s)return null;let{type:i,value:S}=s,m=e.val_optionFocused==s.id,y=e.val_status.rawValue.includes(S),D=e.rootStates.SelectorComponent;return n(ee,{"data-autocomplete-input-value":s.id,children:n(D,{option:s,isFocused:m,isSelected:y,addCallback:()=>{e.set_status(O=>{let g=[...O.rawValue];return c.scope(()=>{if(S===null)return g=[];O.rawValue.includes(S)?g=g.filter(I=>I!==S):e.rootStates.multiSelect?g.push(S):g=[S]}),_(f({},O),{rawValue:g,eventType:"update",eventID:C(8),isInspected:!1})})}})},s.id)})]})]})}))}))},Selected:e=>{let{rootStates:t,val_status:r,set_status:p,val_optionsDict:o}=e,l=[];return r.rawValue.forEach(a=>{let d=o[c.Stringify(a)];if(!d)return;let s=t.SelectedComponent,u=d.label;(d==null?void 0:d.value)===null&&(u=""),l.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.rawValue];S=S.filter(m=>m!==a),p(m=>_(f({},m),{rawValue:S,eventType:"update",eventID:C(8),isInspected:!1}))}})},c.Stringify(d==null?void 0:d.value)||C(8)))}),n(H,{children:l})},Core:e=>{var q,X,$;let{value:t}=e,[r,p]=b(!1),[o,l]=b(!1),[a,d]=b(!1),[s,u]=b(!1),[i,S]=b(""),[m,y]=b(e.options),[D,O]=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)||""),[g,x]=b({}),[I,k]=b(W.DefaultStatus(e.componentId,t)),F=se(!1);B(()=>{o||(F.current?y(e.options):F.current=!0)},[c.Stringify(($=e.options)==null?void 0:$.map(R=>R.value))]),B(()=>{if(!m.length)return;let R=[...m],P=f({},g);R.forEach(T=>{(T==null?void 0:T.type)!="label"&&(P[c.Stringify(T==null?void 0:T.value)]=T)}),x(P)},[m]);let E={rootStates:e,val_options:m,set_options:y,val_optionFocused:D,set_optionFocused:O,val_optionsDict:g,set_optionsDict:x,val_optionsModified:o,set_optionsModified:l,val_preventOpenSelector:r,set_preventOpenSelector:p,val_openSelector:a,set_openSelector:d,val_activeInput:s,set_activeInput:u,val_keyword:i,set_keyword:S,val_status:I,set_status:k},J=!!e.multiSelect;W.CommonEffects({type:J?"autocomplete.multi":"autocomplete.single",states:e,val_status:I,set_status:k,SystemValidation:ye});let K=I.rawValue.length&&I.rawValue[0]!==null;return K=K||a||s,A(fe,{val_status:I,set_status:k,states:e,children:[n(ve,{componentId:e.componentId,fontSize:e.fontSize,required:e.required,label:e.label,isActive:K}),n(w.Shallow,f({},E)),n(w.Button,f({},E))]})}},le=e=>{let t=f({},e);return t=_(f({value:[],min:0,max:65535,multiSelect:!0,SearchInput:!0,emptySelect:!0,SelectorComponent:({option:r,isSelected:p,isFocused:o,addCallback:l})=>r?(r==null?void 0:r.type)=="label"?n(H,{children:r.label}):n(te.Sub.S,{color:"cloud",backgroundColor:"trans",borderRadius:0,fontColor:"2.normal",textAlign:"left",padding:["1/2",1.5],isActive:o,isActiveStyles:{backgroundColor:"cloud"},onClick:l,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:!0,borderRadius:"2.tone.secondary",fontSize:"1.mini",padding:"1/2",gap:0,children:[n(L,{padding:[0,"1/4"],children:p}),n(te.Sub,{flexSizing:"none",color:"cloud",fontColor:"4.thin",tabIndex:-1,ssSphere:2,onClick:o,freeCSS:{lineHeight:1,aspectRatio:"1/1"},children:n(N.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:n(U.Supplement,{fontColor:"4.thin",children:"\u9078\u629E\u3092\u89E3\u9664"})},...t.options]),t.value=c.flatArray(t.value),t.options=w.InitOptions(t.options),c.is.nullish(t.rightIcon)&&(t.rightIcon=n(oe,{children:n(N.Search,{})}),t.disabled&&(t.rightIcon=n(oe,{fontColor:"5.translucent",children:n(N.Ban,{})}))),t.rightIcon&&(t=f({paddingRight:3},t)),t.leftIcon&&(t=f({paddingLeft:3},t)),n(Se,{componentId:t.componentId,children:w.Core,states:me(t)})};export{le as Autocomplete,le as default};
|