amotify 0.2.236 → 0.2.238
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 ee,e as te}from"../../chunk-C5N2D3ZX.js";import{Fragment as X,jsx as l,jsxs as V}from"react/jsx-runtime";import{useState as b,useEffect as F,useRef as ue}from"react";import p,{UUID as D}from"jmini";import{ExtractStyles as ce}from"../../@utils";import{Box as E,Span as pe,FAI as H,Column as oe}from"../../atoms";import{Literal as q,Row as P}from"../../mols";import{Button as ae}from"../Button";import{Loader as de}from"../Loader";import{Sheet as Se}from"../Sheet";import{OptionalInputWrapper as fe,BoxWrapper as me,CoreEffects as M,DefaultBoxishStyles as ve}from"./core";import{InputAutocompleteClasses as W}from"../../@styles/componentClasses";import{InputLabel as ye}from"./Label";import{RightIcon as le}from".";function _e(e){let{value:t,states:s}=e,{required:d,options:o,min:a,max:n}=s;a=a||0,n=n||65535;let S=[],u=t.filter(c=>c!==null).length;return d&&(u||S.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"})),u<a&&S.push({type:"invalid",label:a+"\u500B\u4EE5\u4E0A\u9078\u629E\u3057\u3066\u304F\u3060\u3055\u3044"}),u>n&&S.push({type:"invalid",label:n+"\u500B\u307E\u3067\u9078\u629E\u3067\u304D\u307E\u3059"}),{ok:!S.filter(({type:c})=>c=="invalid").length,notice:S}}const z={InitOptions:e=>{let t=[];return e.forEach(s=>{if(!s)return;let{type:d,label:o,value:a,searchValue:n}=s,S=n||p.is.string(o)&&o||""||p.is.string(a)&&a||p.Stringify(a||"")||"";p.is.nullish(o)&&(o=String(a)),t.push(g(m({id:D()},s),{searchValue:S,type:d||"selector",label:o,value:a}))}),t},FilterSelectableOptions:(e,t,s)=>{let d=e;return s||(d=e.filter(o=>(o==null?void 0:o.type)!="label")),p.scope(()=>{if(!t)return;let o=t.toLower().replace(/ /g,"");d=d.filter(a=>(a.searchValue||"").toLower().replace(/ /g,"").includes(o))}),d}},L={Shallow:e=>{let{rootStates:t,val_status:s}=e,d=ce(t);return l(E,{position:"absolute",top:0,left:0,right:0,height:0,overflow:"hidden",opacity:"trans",freeCSS:{zIndex:3,pointerEvents:"none"},children:l(q.Description,g(m({className:t.className},d),{position:"absolute",width:1,freeCSS:g(m({},d.freeCSS),{color:"orange"}),"data-id":"shallow_"+s.componentId,children:l(E,{"data-input-value-shallow":s.componentId,children:"A"})}))})},Button:e=>{let{rootStates:t,val_keyword:s,set_keyword:d,val_optionFocused:o,set_optionFocused:a,val_preventOpenSelector:n,set_preventOpenSelector:S,val_openSelector:u,set_openSelector:c,val_status:i,set_status:f,val_activeInput:v,set_activeInput:y,val_validate:C,set_validate:O}=e,Y=t,{tone:h,required:A,form:I,className:w,multiSelect:R,enableFormSubmit:K,checkValidationAtFirst:N,onValidate:$,onValidateDelay:Q,onUpdateValue:U,onUpdateValidValue:J,onUserAction:j,value:G="",options:T,leftIndicator:B,rightIndicator:k,leftIcon:ge,rightIcon:he,componentId:Ie,status_id:be,wrapStyles:Ce,emptySelect:De,SearchInput:Oe,SearchInputPlaceholder:we,SelectedComponent:Re,SelectorComponent:Te,SelectorStyles:ke,SelectorPosition:xe,DynamicOptionsOnSearch:Ve,DynamicOptionsOnSearchDelay:Ae}=Y,r=ee(Y,["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 F(()=>{var x;if(t.disabled||!u||p.is.exist(o))return;let _=z.FilterSelectableOptions(e.val_options,s,!1);a(((x=_[0])==null?void 0:x.id)||"")},[s]),F(()=>{if(i.eventType!="init"&&i.eventType!="override"){if(t.max==i.dataValue.length){c(!1),S(!0),d("");return}p("#SearchInput_"+t.componentId).focus()}},[i.dataValue]),F(()=>{if(i.eventType=="override")return;let _="autocomplete-click-"+t.componentId;if(!u){p(document).removeEvent([_]);return}p('[data-input-origin="'+t.componentId+'"]')&&(p("#SearchInput_"+t.componentId).focus(),p(document).addEvent({eventID:_,eventType:"mousedown",callback:ie=>{let Z=p(ie.target),re=!!p(Z).parent("."+W("Core")).length,se=!!p(Z).parent("."+W("Selector")).length;re||se||(c(!1),y(!1))},options:{passive:!1}}))},[u]),V(X,{children:[l(E,g(m({tabIndex:0},r),{"data-disabled":t.disabled,"data-show-validation":M.isShowValidation(C,i,!!N),"data-component-id":i.componentId,"data-input-origin":i.componentId,"data-focus":!!u||!!v,className:[w,W("Core")].join(" "),onFocus:_=>{if(r!=null&&r.onFocus&&(r==null||r.onFocus(_)),!t.disabled){if(n)return S(!1);c(!0),y(!0),_.preventDefault()}},onBlur:_=>{r!=null&&r.onBlur&&(r==null||r.onBlur(_))},onCompositionStart:_=>{r!=null&&r.onCompositionStart&&(r==null||r.onCompositionStart(_))},onCompositionEnd:_=>{r!=null&&r.onCompositionEnd&&(r==null||r.onCompositionEnd(_))},onClick:_=>{r!=null&&r.onClick&&(r==null||r.onClick(_)),!t.disabled&&(c(!0),y(!0))},onKeyDown:_=>{let{key:x}=_;K&&M.SubmitForm(_,I),!u&&(x==" "||x=="ArrowDown"||x=="ArrowUp"||x=="Enter")&&(c(!0),y(!0))},children:V(P.Left,{gap:0,children:[l(pe,{width:0,overflow:"hidden",opacity:"trans",children:"A"}),V(P.Left,{flexWrap:!0,flexSizing:0,gap:"1/3",freeCSS:{letterSpacing:".5px"},children:[l(L.Selected,m({},e)),l(L.SearchInput,m({},e))]})]})})),u&&l(L.Selector,m({},e))]})},SearchInput:e=>{let{rootStates:t,val_status:s,set_status:d}=e;return t.disabled||!e.val_openSelector&&!e.val_activeInput?null:l(E,{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=>{d(a=>g(m({},a),{eventID:D(),isFocusing:!0}))},onBlur:o=>{e.set_activeInput(!1),d(a=>g(m({},a),{eventID:D(),isFocusing:!1}))},onCompositionStart:o=>{d(a=>g(m({},a),{eventID:D(),isComposing:!0}))},onCompositionEnd:o=>{d(a=>g(m({},a),{eventID:D(),isComposing:!1}))},onKeyDown:o=>{let{key:a,metaKey:n,ctrlKey:S}=o,u=n||S;a=="Tab"?(e.set_openSelector(!1),e.set_activeInput(!1),e.set_preventOpenSelector(!1)):a==" "?p.scope(()=>{e.val_openSelector||e.val_keyword||(o.preventDefault(),e.set_openSelector(!0))}):a=="Backspace"?p.scope(()=>{if(e.val_keyword)return;let c=[...e.val_status.dataValue];c.pop(),e.set_status(i=>g(m({},i),{dataValue:c,eventType:"update",eventID:D()}))}):a=="Enter"&&p.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(f=>(f==null?void 0:f.id)==e.val_optionFocused);if(!c)return;let{value:i}=c;e.set_status(f=>{let v=[...f.dataValue];return p.scope(()=>{if(i===null)return v=[];f.dataValue.includes(i)?v=v.filter(C=>C!==i):t.multiSelect?v.push(i):v=[i]}),g(m({},f),{dataValue:v,eventType:"update",eventID:D()})}),e.set_optionsModified(!0),e.set_keyword("")}),p.scope(()=>{if(!["ArrowDown","ArrowUp"].includes(a))return;if(o.preventDefault(),!e.val_openSelector)return e.set_openSelector(!0);let c=a=="ArrowDown"?1:-1,i=z.FilterSelectableOptions(e.val_options),f=i.length-1,v=null;p.scope(()=>{var C,O,h,A,I,w;let y=i.findIndex(R=>(R==null?void 0:R.id)==e.val_optionFocused);if(y==-1&&(y=0),c==1){if(v=(C=i[0])==null?void 0:C.id,u){v=(O=i[f])==null?void 0:O.id;return}if(y==-1||y==f)return;v=(h=i[y+1])==null?void 0:h.id}else{if(v=(A=i[f])==null?void 0:A.id,u){v=(I=i[0])==null?void 0:I.id;return}if(y==-1||y==0)return;v=(w=i[y-1])==null?void 0:w.id}}),e.set_optionFocused(v)}),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 S;let[t,s]=b("idle"),[d,o]=b("idle");F(()=>{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(""),p.interval.once(()=>te(void 0,null,function*(){var f;let c=yield e.rootStates.DynamicOptionsOnSearch(e.val_keyword);o("idle");let i=z.InitOptions(c||[]);e.set_options(i),e.set_optionFocused(((f=i[0])==null?void 0:f.id)||"")}),e.rootStates.DynamicOptionsOnSearchDelay||500,u)},[e.val_keyword,e.val_status.isComposing]),F(()=>{let u=p(`[data-selector-id="${e.val_status.componentId}"]`)[0];if(!u)return;let c=p(`[data-autocomplete-input-value="${e.val_optionFocused}"]`)[0];c&&(u.scrollTop=c.offsetTop-24)},[e.val_optionFocused]);let a=z.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(E,g(m({position:"absolute"},n),{freeCSS:m({minWidth:"75%",zIndex:1e3},n.freeCSS),children:l(Se.Body,g(m({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:m({maxHeight:12*24},(S=e.rootStates.SelectorStyles)==null?void 0:S.freeCSS),children:V(oe,{gap:"1/12",padding:[1,0],children:[d=="fetch"&&l(P.Center,{padding:"1/2",children:l(de.Theme.R,{showInitial:!0})}),d!="fetch"&&V(X,{children:[!a.length&&l(q.Supplement,{padding:[0,1],fontColor:"4.thin",children:"\u5019\u88DC\u304C\u898B\u3064\u304B\u308A\u307E\u305B\u3093"}),a.map((u,c)=>{if(!u)return null;let{type:i,value:f}=u,v=e.val_optionFocused==u.id,y=e.val_status.dataValue.includes(f),C=e.rootStates.SelectorComponent;return l(oe,{"data-autocomplete-input-value":u.id,children:l(C,{option:u,isFocused:v,isSelected:y,addCallback:()=>{e.set_status(O=>{let h=[...O.dataValue];return p.scope(()=>{if(f===null)return h=[];O.dataValue.includes(f)?h=h.filter(I=>I!==f):e.rootStates.multiSelect?h.push(f):h=[f]}),g(m({},O),{dataValue:h,eventType:"update",eventID:D()})})}})},u.id)})]})]})}))}))},Selected:e=>{let{rootStates:t,val_status:s,set_status:d,val_optionsDict:o}=e,a=[];return s.dataValue.forEach(n=>{let S=o[p.Stringify(n)];if(!S)return;let u=t.SelectedComponent,c=S.label;(S==null?void 0:S.value)===null&&(c=""),a.push(l(E,{className:W("SelectedCell"),children:l(u,{value:S==null?void 0:S.value,label:c,removeCallback:i=>{if(i.stopPropagation(),i.preventDefault(),t.disabled)return;let f=[...s.dataValue];f=f.filter(v=>v!==n),d(v=>g(m({},v),{dataValue:f,eventType:"update",eventID:D()}))}})},p.Stringify(S==null?void 0:S.value)||D()))}),l(X,{children:a})},Core:e=>{var J,j,G;let{value:t}=e,[s,d]=b(!1),[o,a]=b(!1),[n,S]=b(!1),[u,c]=b(!1),[i,f]=b(""),[v,y]=b(e.options),[C,O]=b(((J=e.options.find(T=>{var B;return(T==null?void 0:T.value)===((B=e.value)==null?void 0:B[0])}))==null?void 0:J.id)||((j=e.options[0])==null?void 0:j.id)||""),[h,A]=b({}),[I,w]=b(M.DefaultStatus(e.componentId,t)),[R,K]=b({ok:!1,notice:[]}),N=ue(!1);F(()=>{o||(N.current?y(e.options):N.current=!0)},[p.Stringify((G=e.options)==null?void 0:G.map(T=>T.value))]),F(()=>{if(!v.length)return;let T=[...v],B=m({},h);T.forEach(k=>{(k==null?void 0:k.type)!="label"&&(B[p.Stringify(k==null?void 0:k.value)]=k)}),A(B)},[v]);let $={rootStates:e,val_options:v,set_options:y,val_optionFocused:C,set_optionFocused:O,val_optionsDict:h,set_optionsDict:A,val_optionsModified:o,set_optionsModified:a,val_preventOpenSelector:s,set_preventOpenSelector:d,val_openSelector:n,set_openSelector:S,val_activeInput:u,set_activeInput:c,val_keyword:i,set_keyword:f,val_status:I,set_status:w,val_validate:R,set_validate:K},Q=!!e.multiSelect;M.CommonEffects({type:Q?"autocomplete.multi":"autocomplete.single",states:e,val_status:I,set_status:w,val_validate:R,set_validate:K,SystemValidation:_e});let U=I.dataValue.length&&I.dataValue[0]!==null;return U=U||n||u,V(me,{val_status:I,set_status:w,val_validate:R,states:e,children:[l(ye,{componentId:e.componentId,fontSize:e.fontSize,required:e.required,label:e.label,isActive:U}),l(L.Shallow,m({},$)),l(L.Button,m({},$))]})}},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:d,isFocused:o,addCallback:a})=>s?(s==null?void 0:s.type)=="label"?l(X,{children:s.label}):l(ae.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:V(P.Left,{gap:"1/2",children:[d&&l(H.Check,{fontColor:"theme"}),l(q.Supplement,{transition:"short",children:s.label})]})}):null,SelectedComponent:({value:s,label:d,removeCallback:o})=>V(P.Left,{ssCardBox:"cloud",borderRadius:"2.tone.secondary",fontSize:"1.mini",padding:"1/2",gap:0,children:[l(E,{padding:[0,"1/4"],children:d}),l(ae.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(H.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:l(q.Supplement,{fontColor:"4.thin",children:"\u9078\u629E\u3092\u89E3\u9664"})},...t.options]),t.value=p.flatArray(t.value),t.options=z.InitOptions(t.options),p.is.nullish(t.rightIcon)&&(t.rightIcon=l(le,{children:l(H.Search,{})}),t.disabled&&(t.rightIcon=l(le,{fontColor:"5.translucent",children:l(H.Ban,{})}))),t.rightIcon&&(t=m({paddingRight:3},t)),t.leftIcon&&(t=m({paddingLeft:3},t)),l(fe,{componentId:t.componentId,children:L.Core,states:ve(t)})};export{ne as Autocomplete,ne as default};
|
|
1
|
+
import{b as f,c as h,d as ee,e as te}from"../../chunk-C5N2D3ZX.js";import{Fragment as X,jsx as l,jsxs as V}from"react/jsx-runtime";import{useState as b,useEffect as F,useRef as ue}from"react";import c,{UUID as D}from"jmini";import{ExtractStyles as ce}from"../../@utils";import{Box as E,Span as pe,FAI as H,Column as oe}from"../../atoms";import{Literal as q,Row as P}from"../../mols";import{Button as ae}from"../Button";import{Loader as de}from"../Loader";import{Sheet as Se}from"../Sheet";import{OptionalInputWrapper as fe,BoxWrapper as me,CoreEffects as M,DefaultBoxishStyles as ve}from"./core";import{InputAutocompleteClasses as W}from"../../@styles/componentClasses";import{InputLabel as ye}from"./Label";import{RightIcon as le}from".";function _e(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 z={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(h(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}},L={Shallow:e=>{let{rootStates:t,val_status:r}=e,p=ce(t);return l(E,{position:"absolute",top:0,left:0,right:0,height:0,overflow:"hidden",opacity:"trans",freeCSS:{zIndex:3,pointerEvents:"none"},children:l(q.Description,h(f({className:t.className},p),{position:"absolute",width:1,freeCSS:h(f({},p.freeCSS),{color:"orange"}),"data-id":"shallow_"+r.componentId,children:l(E,{"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,val_validate:C,set_validate:O}=e,Y=t,{tone:g,required:A,form:I,className:w,multiSelect:R,enableFormSubmit:K,checkValidationAtFirst:N,onValidate:$,onValidateDelay:Q,onUpdateValue:U,onUpdateValidValue:J,onUserAction:j,value:G="",options:T,leftIndicator:B,rightIndicator:k,leftIcon:he,rightIcon:ge,componentId:Ie,status_id:be,wrapStyles:Ce,emptySelect:De,SearchInput:Oe,SearchInputPlaceholder:we,SelectedComponent:Re,SelectorComponent:Te,SelectorStyles:ke,SelectorPosition:xe,DynamicOptionsOnSearch:Ve,DynamicOptionsOnSearchDelay:Ae}=Y,v=ee(Y,["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 F(()=>{var x;if(t.disabled||!s||c.is.exist(o))return;let _=z.FilterSelectableOptions(e.val_options,r,!1);a(((x=_[0])==null?void 0:x.id)||"")},[r]),F(()=>{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]),F(()=>{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:ie=>{let Z=c(ie.target),re=!!c(Z).parent("."+W("Core")).length,se=!!c(Z).parent("."+W("Selector")).length;re||se||(u(!1),y(!1))},options:{passive:!1}}))},[s]),V(X,{children:[l(E,h(f({tabIndex:0},v),{"data-disabled":t.disabled,"data-show-validation":M.isShowValidation(C,i,!!N),"data-component-id":i.componentId,"data-input-origin":i.componentId,"data-focus":!!s||!!m,className:[w,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:x}=_;K&&M.SubmitForm(_,I),!s&&(x==" "||x=="ArrowDown"||x=="ArrowUp"||x=="Enter")&&(u(!0),y(!0))},children:V(P.Left,{gap:0,children:[l(pe,{width:0,overflow:"hidden",opacity:"trans",children:"A"}),V(P.Left,{flexWrap:!0,flexSizing:0,gap:"1/3",freeCSS:{letterSpacing:".5px"},children:[l(L.Selected,f({},e)),l(L.SearchInput,f({},e))]})]})})),s&&l(L.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(E,{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=>h(f({},a),{eventID:D(),isFocusing:!0}))},onBlur:o=>{e.set_activeInput(!1),p(a=>h(f({},a),{eventID:D(),isFocusing:!1}))},onCompositionStart:o=>{p(a=>h(f({},a),{eventID:D(),isComposing:!0}))},onCompositionEnd:o=>{p(a=>h(f({},a),{eventID:D(),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=>h(f({},i),{dataValue:u,eventType:"update",eventID:D()}))}):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(C=>C!==i):t.multiSelect?m.push(i):m=[i]}),h(f({},S),{dataValue:m,eventType:"update",eventID:D()})}),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=z.FilterSelectableOptions(e.val_options),S=i.length-1,m=null;c.scope(()=>{var C,O,g,A,I,w;let y=i.findIndex(R=>(R==null?void 0:R.id)==e.val_optionFocused);if(y==-1&&(y=0),u==1){if(m=(C=i[0])==null?void 0:C.id,s){m=(O=i[S])==null?void 0:O.id;return}if(y==-1||y==S)return;m=(g=i[y+1])==null?void 0:g.id}else{if(m=(A=i[S])==null?void 0:A.id,s){m=(I=i[0])==null?void 0:I.id;return}if(y==-1||y==0)return;m=(w=i[y-1])==null?void 0:w.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");F(()=>{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(()=>te(void 0,null,function*(){var S;let u=yield e.rootStates.DynamicOptionsOnSearch(e.val_keyword);o("idle");let i=z.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]),F(()=>{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=z.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(E,h(f({position:"absolute"},n),{freeCSS:f({minWidth:"75%",zIndex:1e3},n.freeCSS),children:l(Se.Body,h(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:V(oe,{gap:"1/12",padding:[1,0],children:[p=="fetch"&&l(P.Center,{padding:"1/2",children:l(de.Theme.R,{showInitial:!0})}),p!="fetch"&&V(X,{children:[!a.length&&l(q.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),C=e.rootStates.SelectorComponent;return l(oe,{"data-autocomplete-input-value":s.id,children:l(C,{option:s,isFocused:m,isSelected:y,addCallback:()=>{e.set_status(O=>{let g=[...O.dataValue];return c.scope(()=>{if(S===null)return g=[];O.dataValue.includes(S)?g=g.filter(I=>I!==S):e.rootStates.multiSelect?g.push(S):g=[S]}),h(f({},O),{dataValue:g,eventType:"update",eventID:D()})})}})},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(E,{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=>h(f({},m),{dataValue:S,eventType:"update",eventID:D()}))}})},c.Stringify(d==null?void 0:d.value)||D()))}),l(X,{children:a})},Core:e=>{var J,j,G;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),[C,O]=b(((J=e.options.find(T=>{var B;return(T==null?void 0:T.value)===((B=e.value)==null?void 0:B[0])}))==null?void 0:J.id)||((j=e.options[0])==null?void 0:j.id)||""),[g,A]=b({}),[I,w]=b(M.DefaultStatus(e.componentId,t)),[R,K]=b({ok:!1,notice:[]}),N=ue(!1);F(()=>{o||(N.current?y(e.options):N.current=!0)},[c.Stringify((G=e.options)==null?void 0:G.map(T=>T.value))]),F(()=>{if(!m.length)return;let T=[...m],B=f({},g);T.forEach(k=>{(k==null?void 0:k.type)!="label"&&(B[c.Stringify(k==null?void 0:k.value)]=k)}),A(B)},[m]);let $={rootStates:e,val_options:m,set_options:y,val_optionFocused:C,set_optionFocused:O,val_optionsDict:g,set_optionsDict:A,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:w,val_validate:R,set_validate:K},Q=!!e.multiSelect;M.CommonEffects({type:Q?"autocomplete.multi":"autocomplete.single",states:e,val_status:I,set_status:w,val_validate:R,set_validate:K,SystemValidation:_e});let U=I.dataValue.length&&I.dataValue[0]!==null;return U=U||n||s,V(me,{val_status:I,set_status:w,val_validate:R,states:e,children:[l(ye,{componentId:e.componentId,fontSize:e.fontSize,required:e.required,label:e.label,isActive:U}),l(L.Shallow,f({},$)),l(L.Button,f({},$))]})}},ne=e=>{let t=f({},e);return t=h(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(X,{children:r.label}):l(ae.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:V(P.Left,{gap:"1/2",children:[p&&l(H.Check,{fontColor:"theme"}),l(q.Supplement,{transition:"short",children:r.label})]})}):null,SelectedComponent:({value:r,label:p,removeCallback:o})=>V(P.Left,{ssCardBox:"cloud",borderRadius:"2.tone.secondary",fontSize:"1.mini",padding:"1/2",gap:0,children:[l(E,{padding:[0,"1/4"],children:p}),l(ae.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(H.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(q.Supplement,{fontColor:"4.thin",children:"\u9078\u629E\u3092\u89E3\u9664"})},...t.options]),t.value=c.flatArray(t.value),t.options=z.InitOptions(t.options),c.is.nullish(t.rightIcon)&&(t.rightIcon=l(le,{children:l(H.Search,{})}),t.disabled&&(t.rightIcon=l(le,{fontColor:"5.translucent",children:l(H.Ban,{})}))),t.rightIcon&&(t=f({paddingRight:3},t)),t.leftIcon&&(t=f({paddingLeft:3},t)),l(fe,{componentId:t.componentId,children:L.Core,states:ve(t)})};export{ne as Autocomplete,ne as default};
|
|
@@ -29,13 +29,13 @@ declare namespace Select {
|
|
|
29
29
|
type?: 'selector';
|
|
30
30
|
id?: string;
|
|
31
31
|
value: T;
|
|
32
|
-
label
|
|
32
|
+
label?: ReactElement;
|
|
33
33
|
searchValue?: string;
|
|
34
34
|
} | {
|
|
35
35
|
type: 'label';
|
|
36
36
|
id?: string;
|
|
37
37
|
value?: T;
|
|
38
|
-
label
|
|
38
|
+
label?: ReactElement;
|
|
39
39
|
searchValue?: string;
|
|
40
40
|
};
|
|
41
41
|
type WrapperStates = {
|
package/dist/fn/Input/Select.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{b as o,c as u,d as H}from"../../chunk-C5N2D3ZX.js";import{Fragment as J,jsx as a,jsxs as O}from"react/jsx-runtime";import d,{UUID as C}from"jmini";import{useState as A,useEffect as $}from"react";import{ExtractStyles as Ve}from"../../@utils";import{Box as _,Span as Oe,FAI as le,Column as Te}from"../../atoms";import{Literal as W,Row as j}from"../../mols";import{Button as Fe}from"../Button";import{Sheet as xe}from"../Sheet";import{OptionalInputWrapper as De,BoxWrapper as we,CoreEffects as k,DefaultBoxishStyles as Re}from"./core";import{InputAutocompleteClasses as B}from"../../@styles/componentClasses";import{InputLabel as ke}from"./Label";import{RightIcon as Ae}from".";function Be(e){let{value:t,states:l}=e,{required:n,options:c}=l,y=[];return n&&t===null&&y.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"}),{ok:!y.filter(({type:S})=>S=="invalid").length,notice:y}}const ae={FilterSelectableOptions:(e,t)=>{let l=e.rootStates.options;return t||(l=l.filter(n=>(n==null?void 0:n.type)!="label")),l}},V={Shallow:e=>{let{rootStates:t,val_status:l}=e,n=Ve(t);return a(_,{position:"absolute",top:0,left:0,right:0,height:0,overflow:"hidden",opacity:"trans",freeCSS:{zIndex:3,pointerEvents:"none"},children:a(W.Description,u(o({className:t.className},n),{position:"absolute",width:1,freeCSS:u(o({},n.freeCSS),{color:"orange"}),children:a(_,{"data-input-value-shallow":l.componentId,children:"A"})}))})},Button:e=>O(J,{children:[a(V.LegacySelector,o({},e)),a(V.Original,o({},e))]}),Placeholder:e=>!e.rootStates.placeholder||e.val_status.dataValue!==null?null:a(_,{position:"absolute",opacity:"middle",fontColor:"3.blur",children:e.rootStates.placeholder||""}),Original:e=>{let{rootStates:t,val_preventOpenSelectorOnFocus:l,set_preventOpenSelectorOnFocus:n,val_optionFocused:c,set_optionFocused:y,val_validate:S,set_validate:I,val_status:p,set_status:b,val_selectorOpen:g,set_selectorOpen:f}=e,U=t,{tone:E,required:L,form:x,className:T,label:ne,isLabelActive:re,placeholder:se,enableFormSubmit:P,emptySelect:X,checkValidationAtFirst:M,onValidate:ie,onValidateDelay:ce,onUpdateValue:ue,onUpdateValidValue:de,onUserAction:pe,value:N="",options:K,leftIndicator:Se,rightIndicator:G,leftIcon:fe,rightIcon:me,componentId:ye,status_id:ve,wrapStyles:ge,SelectedCellStyles:be,SelectorCellStyles:Ie,SelectorMode:he,SelectorStyles:Ce,SelectorPosition:_e}=U,r=H(U,["tone","required","form","className","label","isLabelActive","placeholder","enableFormSubmit","emptySelect","checkValidationAtFirst","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","onUserAction","value","options","leftIndicator","rightIndicator","leftIcon","rightIcon","componentId","status_id","wrapStyles","SelectedCellStyles","SelectorCellStyles","SelectorMode","SelectorStyles","SelectorPosition"]);return $(()=>{if(e.rootStates.SelectorMode!="original"||t.disabled)return;let s="select-click-"+t.componentId;if(g){if(!d('[data-input-origin="'+t.componentId+'"]'))return;d(document).addEvent({eventID:s,eventType:"click",callback:i=>{let D=d(i.target),w=!!d(D).parent("."+B("Core")).length;d(D).parent("."+B("Selector")).length||w||f(!1)}})}else d(document).removeEvent([s])},[g]),$(()=>{if(e.rootStates.SelectorMode!="original"||p.eventType=="init"||!g)return;let s=d('[data-input-origin="'+t.componentId+'"]');s&&s.focus()},[p.dataValue]),e.rootStates.SelectorMode!="original"?null:O(J,{children:[a(_,u(o({tabIndex:0},r),{"data-disabled":t.disabled,"data-show-validation":k.isShowValidation(S,p,!!M),"data-component-id":p.componentId,"data-input-origin":p.componentId,className:[T,B("Core")].join(" "),onFocus:s=>{if(r!=null&&r.onFocus&&(r==null||r.onFocus(s)),b(m=>u(o({},m),{eventID:C(),isFocusing:!0})),!t.disabled){if(l)return n(!1);f(!0)}},onBlur:s=>{r!=null&&r.onBlur&&(r==null||r.onBlur(s)),b(m=>u(o({},m),{eventID:C(),isFocusing:!1}))},onClick:s=>{r!=null&&r.onClick&&(r==null||r.onClick(s)),!t.disabled&&f(!0)},onKeyDown:s=>{let{key:m,metaKey:i,ctrlKey:D}=s,w=i||D;if(r!=null&&r.onKeyDown&&(r==null||r.onKeyDown(s)),P&&k.SubmitForm(s,x),!t.disabled){if(d.scope(()=>{if(!["ArrowDown","ArrowUp"].includes(m))return;if(s.preventDefault(),!g)return f(!0);let h=m=="ArrowDown"?1:-1,v=ae.FilterSelectableOptions(e),q=v.length-1,F=null;d.scope(()=>{var Q,Y,Z,ee,te;let R=v.findIndex(z=>(z==null?void 0:z.id)==c);if(h==1){if(F=(Q=v[0])==null?void 0:Q.id,w){F=v[q].id;return}if(R==-1||R==q)return;F=(Y=v[R+1])==null?void 0:Y.id}else{if(F=(Z=v[q])==null?void 0:Z.id,w){F=(ee=v[0])==null?void 0:ee.id;return}if(R==-1||R==0)return;F=(te=v[R-1])==null?void 0:te.id}}),y(F)}),m=="Escape")f(!1);else if(m=="Tab")f(!1);else if(m=="Backspace")b(h=>u(o({},h),{dataValue:null,eventType:"update",eventID:C()}));else if(m==" ")s.preventDefault(),f(!0);else if(m=="Enter"){if(!g)return f(!0);s.preventDefault();let h=t.options.find(v=>(v==null?void 0:v.id)==c);if(!h)return;b(v=>u(o({},v),{dataValue:h==null?void 0:h.value,eventType:"update",eventID:C()})),f(!1)}}},children:O(j.Left,{gap:0,children:[a(Oe,{width:0,overflow:"hidden",opacity:"trans",children:"A"}),O(j.Left,{flexWrap:!0,gap:"1/3",freeCSS:{letterSpacing:".5px"},children:[a(V.Placeholder,o({},e)),a(V.Selected,o({},e))]})]})})),g&&a(V.Selector,o({},e))]})},LegacySelector:e=>{let{rootStates:t,val_preventOpenSelectorOnFocus:l,set_preventOpenSelectorOnFocus:n,val_optionFocused:c,set_optionFocused:y,val_validate:S,set_validate:I,val_status:p,set_status:b,val_selectorOpen:g,set_selectorOpen:f}=e,m=t,{tone:E,required:L,form:x,className:T,label:ne,isLabelActive:re,placeholder:se,enableFormSubmit:P,emptySelect:X,checkValidationAtFirst:M,onValidate:ie,onValidateDelay:ce,onUpdateValue:ue,onUpdateValidValue:de,onUserAction:pe,onKeyDown:N,onChange:K,value:Se="",options:G,leftIndicator:fe,rightIndicator:me,leftIcon:ye,rightIcon:ve,componentId:ge,status_id:be,wrapStyles:Ie,SelectedCellStyles:he,SelectorCellStyles:Ce,SelectorMode:_e,SelectorStyles:r,SelectorPosition:U}=m,s=H(m,["tone","required","form","className","label","isLabelActive","placeholder","enableFormSubmit","emptySelect","checkValidationAtFirst","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","onUserAction","onKeyDown","onChange","value","options","leftIndicator","rightIndicator","leftIcon","rightIcon","componentId","status_id","wrapStyles","SelectedCellStyles","SelectorCellStyles","SelectorMode","SelectorStyles","SelectorPosition"]);return e.rootStates.SelectorMode!="legacy"?null:O(_,u(o({htmlTag:"select",tabIndex:0},s),{"data-disabled":t.disabled,"data-show-validation":k.isShowValidation(S,p,!!M),"data-component-id":p.componentId,"data-input-origin":p.componentId,className:[T,B("Core")].join(" "),onKeyDown:i=>{N&&N(i),P&&k.SubmitForm(i,x)},onChange:i=>{let{value:D}=i.target;S.ok&&I({ok:!1,notice:[]}),b(w=>u(o({},w),{dataValue:D,eventType:"update",eventID:C()})),K&&K(i)},children:[!!X&&a("option",{value:"null",children:"\u9078\u629E"}),G.map(i=>d.is.nullish(i==null?void 0:i.value)?null:a("option",{value:i==null?void 0:i.value,children:i.label},String(i==null?void 0:i.value)))]}))},Selector:e=>{var n;$(()=>{let c=d(`[data-selector-id="${e.val_status.componentId}"]`)[0];if(!c)return;let y=d(`[data-select-input-value="${e.val_optionFocused}"]`)[0];y&&(c.scrollTop=y.offsetTop-24)},[e.val_optionFocused]);let t=ae.FilterSelectableOptions(e,!0),l={position:"absolute",minWidth:1,freeCSS:{zIndex:1e3}};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 a(_,u(o({},l),{children:a(xe.Body,u(o({className:B("Selector"),ssCardBox:!0,borderRadius:"2.tone.secondary",boxShadow:"1.normal",overflow:"auto","data-selector-id":e.val_status.componentId},e.rootStates.SelectorStyles),{freeCSS:o({minWidth:12*6,maxHeight:12*24},(n=e.rootStates.SelectorStyles)==null?void 0:n.freeCSS),children:O(Te,{gap:"1/12",padding:[1,0],children:[t.map((c,y)=>{if(!c)return null;let{type:S,value:I}=c,p=e.val_optionFocused==c.id,b=e.val_status.dataValue===I;return S=="label"?a(_,{children:c.label},C()):a(Fe.Sub.S,u(o({"data-select-input-value":c.id,color:"cloud",backgroundColor:"trans",borderRadius:0,fontColor:"2.normal",textAlign:"left",padding:["1/2",1],isActive:b||p,isActiveStyles:p?{backgroundColor:"cloud"}:{backgroundColor:"theme.opa.few",fontColor:"theme"}},e.rootStates.SelectorCellStyles),{onClick:g=>{e.set_status(f=>u(o({},f),{dataValue:I,eventType:"update",eventID:C()})),e.set_selectorOpen(!1),e.set_preventOpenSelectorOnFocus(!0)},children:O(j.Left,{gap:"1/2",children:[b&&a(le.Check,{fontColor:"theme"}),a(W.Supplement,{transition:"short",flexSizing:0,children:c.label})]})}),c.id)}),!t.length&&a(W.Supplement,{padding:[0,1],fontColor:"4.thin",children:"\u5019\u88DC\u304C\u898B\u3064\u304B\u308A\u307E\u305B\u3093"},"no-selector-notice")]})}))}))},Selected:e=>{let t=[];return e.val_status.dataValue!==null&&d.scope(()=>{let l=e.rootStates.options.find(n=>d.is.equal(n==null?void 0:n.value,e.val_status.dataValue));l&&t.push(a(_,u(o({},e.rootStates.SelectedCellStyles),{children:l.label}),String(l==null?void 0:l.value)))}),a(J,{children:t})},Core:e=>{var L,x;let{value:t}=e,[l,n]=A(k.DefaultStatus(e.componentId,t)),[c,y]=A(!1),[S,I]=A(!1),[p,b]=A(((L=e.options.find(T=>(T==null?void 0:T.value)===e.value))==null?void 0:L.id)||((x=e.options[0])==null?void 0:x.id)||""),[g,f]=A({ok:!1,notice:[]}),E={rootStates:e,val_preventOpenSelectorOnFocus:c,set_preventOpenSelectorOnFocus:y,val_optionFocused:p,set_optionFocused:b,val_selectorOpen:S,set_selectorOpen:I,val_status:l,set_status:n,val_validate:g,set_validate:f};return k.CommonEffects({type:"select",states:e,val_status:l,set_status:n,val_validate:g,set_validate:f,SystemValidation:Be}),O(we,{val_status:l,set_status:n,val_validate:g,states:e,children:[a(ke,{componentId:e.componentId,fontSize:e.fontSize,required:e.required,label:e.label,isActive:e.isLabelActive||l.dataValue!==null}),a(V.Shallow,o({},E)),a(V.Button,o({},E))]})}},oe=e=>{var l;let t=o({},e);return t=u(o({emptySelect:!0,SelectorMode:"original",SelectorPosition:3},t),{freeCSS:o({cursor:"pointer"},t.freeCSS)}),t.emptySelect&&(t.options=[{value:null,label:a(W.Supplement,{fontColor:"4.thin",children:"\u672A\u9078\u629E"})},...t.options]),t.value=(l=t.value)!=null?l:null,t.options.forEach((n,c)=>{if(!n)return;let{type:y,value:S,searchValue:I}=n,p=I||d.is.string(S)&&S||d.Stringify(S||"")||"";t.options[c]=u(o({id:C()},n),{value:S,searchValue:p,type:y||"selector"})}),d.is.nullish(t.rightIcon)&&(t.rightIcon=a(Ae,{children:a(le.AngleDown,{})})),a(De,{componentId:t.componentId,children:V.Core,states:Re(t)})};export{oe as Select,oe as default};
|
|
1
|
+
import{b as o,c,d as H}from"../../chunk-C5N2D3ZX.js";import{Fragment as J,jsx as a,jsxs as O}from"react/jsx-runtime";import d,{UUID as C}from"jmini";import{useState as A,useEffect as $}from"react";import{ExtractStyles as Ve}from"../../@utils";import{Box as _,Span as Oe,FAI as le,Column as Te}from"../../atoms";import{Literal as W,Row as j}from"../../mols";import{Button as Fe}from"../Button";import{Sheet as xe}from"../Sheet";import{OptionalInputWrapper as De,BoxWrapper as we,CoreEffects as k,DefaultBoxishStyles as Re}from"./core";import{InputAutocompleteClasses as B}from"../../@styles/componentClasses";import{InputLabel as ke}from"./Label";import{RightIcon as Ae}from".";function Be(e){let{value:t,states:l}=e,{required:n,options:i}=l,v=[];return n&&t===null&&v.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"}),{ok:!v.filter(({type:p})=>p=="invalid").length,notice:v}}const ae={FilterSelectableOptions:(e,t)=>{let l=e.rootStates.options;return t||(l=l.filter(n=>(n==null?void 0:n.type)!="label")),l}},V={Shallow:e=>{let{rootStates:t,val_status:l}=e,n=Ve(t);return a(_,{position:"absolute",top:0,left:0,right:0,height:0,overflow:"hidden",opacity:"trans",freeCSS:{zIndex:3,pointerEvents:"none"},children:a(W.Description,c(o({className:t.className},n),{position:"absolute",width:1,freeCSS:c(o({},n.freeCSS),{color:"orange"}),children:a(_,{"data-input-value-shallow":l.componentId,children:"A"})}))})},Button:e=>O(J,{children:[a(V.LegacySelector,o({},e)),a(V.Original,o({},e))]}),Placeholder:e=>!e.rootStates.placeholder||e.val_status.dataValue!==null?null:a(_,{position:"absolute",opacity:"middle",fontColor:"3.blur",children:e.rootStates.placeholder||""}),Original:e=>{let{rootStates:t,val_preventOpenSelectorOnFocus:l,set_preventOpenSelectorOnFocus:n,val_optionFocused:i,set_optionFocused:v,val_validate:p,set_validate:I,val_status:S,set_status:b,val_selectorOpen:g,set_selectorOpen:f}=e,U=t,{tone:E,required:L,form:x,className:T,label:ne,isLabelActive:re,placeholder:se,enableFormSubmit:P,emptySelect:X,checkValidationAtFirst:M,onValidate:ie,onValidateDelay:ue,onUpdateValue:ce,onUpdateValidValue:de,onUserAction:Se,value:N="",options:K,leftIndicator:pe,rightIndicator:G,leftIcon:fe,rightIcon:me,componentId:ve,status_id:ye,wrapStyles:ge,SelectedCellStyles:be,SelectorCellStyles:Ie,SelectorMode:he,SelectorStyles:Ce,SelectorPosition:_e}=U,r=H(U,["tone","required","form","className","label","isLabelActive","placeholder","enableFormSubmit","emptySelect","checkValidationAtFirst","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","onUserAction","value","options","leftIndicator","rightIndicator","leftIcon","rightIcon","componentId","status_id","wrapStyles","SelectedCellStyles","SelectorCellStyles","SelectorMode","SelectorStyles","SelectorPosition"]);return $(()=>{if(e.rootStates.SelectorMode!="original"||t.disabled)return;let u="select-click-"+t.componentId;if(g){if(!d('[data-input-origin="'+t.componentId+'"]'))return;d(document).addEvent({eventID:u,eventType:"click",callback:s=>{let D=d(s.target),w=!!d(D).parent("."+B("Core")).length;d(D).parent("."+B("Selector")).length||w||f(!1)}})}else d(document).removeEvent([u])},[g]),$(()=>{if(e.rootStates.SelectorMode!="original"||S.eventType=="init"||!g)return;let u=d('[data-input-origin="'+t.componentId+'"]');u&&u.focus()},[S.dataValue]),e.rootStates.SelectorMode!="original"?null:O(J,{children:[a(_,c(o({tabIndex:0},r),{"data-disabled":t.disabled,"data-show-validation":k.isShowValidation(p,S,!!M),"data-component-id":S.componentId,"data-input-origin":S.componentId,className:[T,B("Core")].join(" "),onFocus:u=>{if(r!=null&&r.onFocus&&(r==null||r.onFocus(u)),b(m=>c(o({},m),{eventID:C(),isFocusing:!0})),!t.disabled){if(l)return n(!1);f(!0)}},onBlur:u=>{r!=null&&r.onBlur&&(r==null||r.onBlur(u)),b(m=>c(o({},m),{eventID:C(),isFocusing:!1}))},onClick:u=>{r!=null&&r.onClick&&(r==null||r.onClick(u)),!t.disabled&&f(!0)},onKeyDown:u=>{let{key:m,metaKey:s,ctrlKey:D}=u,w=s||D;if(r!=null&&r.onKeyDown&&(r==null||r.onKeyDown(u)),P&&k.SubmitForm(u,x),!t.disabled){if(d.scope(()=>{if(!["ArrowDown","ArrowUp"].includes(m))return;if(u.preventDefault(),!g)return f(!0);let h=m=="ArrowDown"?1:-1,y=ae.FilterSelectableOptions(e),q=y.length-1,F=null;d.scope(()=>{var Q,Y,Z,ee,te;let R=y.findIndex(z=>(z==null?void 0:z.id)==i);if(h==1){if(F=(Q=y[0])==null?void 0:Q.id,w){F=y[q].id;return}if(R==-1||R==q)return;F=(Y=y[R+1])==null?void 0:Y.id}else{if(F=(Z=y[q])==null?void 0:Z.id,w){F=(ee=y[0])==null?void 0:ee.id;return}if(R==-1||R==0)return;F=(te=y[R-1])==null?void 0:te.id}}),v(F)}),m=="Escape")f(!1);else if(m=="Tab")f(!1);else if(m=="Backspace")b(h=>c(o({},h),{dataValue:null,eventType:"update",eventID:C()}));else if(m==" ")u.preventDefault(),f(!0);else if(m=="Enter"){if(!g)return f(!0);u.preventDefault();let h=t.options.find(y=>(y==null?void 0:y.id)==i);if(!h)return;b(y=>c(o({},y),{dataValue:h==null?void 0:h.value,eventType:"update",eventID:C()})),f(!1)}}},children:O(j.Left,{gap:0,children:[a(Oe,{width:0,overflow:"hidden",opacity:"trans",children:"A"}),O(j.Left,{flexWrap:!0,gap:"1/3",freeCSS:{letterSpacing:".5px"},children:[a(V.Placeholder,o({},e)),a(V.Selected,o({},e))]})]})})),g&&a(V.Selector,o({},e))]})},LegacySelector:e=>{let{rootStates:t,val_preventOpenSelectorOnFocus:l,set_preventOpenSelectorOnFocus:n,val_optionFocused:i,set_optionFocused:v,val_validate:p,set_validate:I,val_status:S,set_status:b,val_selectorOpen:g,set_selectorOpen:f}=e,m=t,{tone:E,required:L,form:x,className:T,label:ne,isLabelActive:re,placeholder:se,enableFormSubmit:P,emptySelect:X,checkValidationAtFirst:M,onValidate:ie,onValidateDelay:ue,onUpdateValue:ce,onUpdateValidValue:de,onUserAction:Se,onKeyDown:N,onChange:K,value:pe="",options:G,leftIndicator:fe,rightIndicator:me,leftIcon:ve,rightIcon:ye,componentId:ge,status_id:be,wrapStyles:Ie,SelectedCellStyles:he,SelectorCellStyles:Ce,SelectorMode:_e,SelectorStyles:r,SelectorPosition:U}=m,u=H(m,["tone","required","form","className","label","isLabelActive","placeholder","enableFormSubmit","emptySelect","checkValidationAtFirst","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","onUserAction","onKeyDown","onChange","value","options","leftIndicator","rightIndicator","leftIcon","rightIcon","componentId","status_id","wrapStyles","SelectedCellStyles","SelectorCellStyles","SelectorMode","SelectorStyles","SelectorPosition"]);return e.rootStates.SelectorMode!="legacy"?null:O(_,c(o({htmlTag:"select",tabIndex:0},u),{"data-disabled":t.disabled,"data-show-validation":k.isShowValidation(p,S,!!M),"data-component-id":S.componentId,"data-input-origin":S.componentId,className:[T,B("Core")].join(" "),onKeyDown:s=>{N&&N(s),P&&k.SubmitForm(s,x)},onChange:s=>{let{value:D}=s.target;p.ok&&I({ok:!1,notice:[]}),b(w=>c(o({},w),{dataValue:D,eventType:"update",eventID:C()})),K&&K(s)},children:[!!X&&a("option",{value:"null",children:"\u9078\u629E"}),G.map(s=>d.is.nullish(s==null?void 0:s.value)?null:a("option",{value:s==null?void 0:s.value,children:(s==null?void 0:s.label)||(s==null?void 0:s.value)},String(s==null?void 0:s.value)))]}))},Selector:e=>{var n;$(()=>{let i=d(`[data-selector-id="${e.val_status.componentId}"]`)[0];if(!i)return;let v=d(`[data-select-input-value="${e.val_optionFocused}"]`)[0];v&&(i.scrollTop=v.offsetTop-24)},[e.val_optionFocused]);let t=ae.FilterSelectableOptions(e,!0),l={position:"absolute",minWidth:1,freeCSS:{zIndex:1e3}};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 a(_,c(o({},l),{children:a(xe.Body,c(o({className:B("Selector"),ssCardBox:!0,borderRadius:"2.tone.secondary",boxShadow:"1.normal",overflow:"auto","data-selector-id":e.val_status.componentId},e.rootStates.SelectorStyles),{freeCSS:o({minWidth:12*6,maxHeight:12*24},(n=e.rootStates.SelectorStyles)==null?void 0:n.freeCSS),children:O(Te,{gap:"1/12",padding:[1,0],children:[t.map((i,v)=>{if(!i)return null;let{type:p,value:I}=i,S=e.val_optionFocused==i.id,b=e.val_status.dataValue===I;return p=="label"?a(_,{children:i.label||i.value},C()):a(Fe.Sub.S,c(o({"data-select-input-value":i.id,color:"cloud",backgroundColor:"trans",borderRadius:0,fontColor:"2.normal",textAlign:"left",padding:["1/2",1],isActive:b||S,isActiveStyles:S?{backgroundColor:"cloud"}:{backgroundColor:"theme.opa.few",fontColor:"theme"}},e.rootStates.SelectorCellStyles),{onClick:g=>{e.set_status(f=>c(o({},f),{dataValue:I,eventType:"update",eventID:C()})),e.set_selectorOpen(!1),e.set_preventOpenSelectorOnFocus(!0)},children:O(j.Left,{gap:"1/2",children:[b&&a(le.Check,{fontColor:"theme"}),a(W.Supplement,{transition:"short",flexSizing:0,children:i.label||i.value})]})}),i.id)}),!t.length&&a(W.Supplement,{padding:[0,1],fontColor:"4.thin",children:"\u5019\u88DC\u304C\u898B\u3064\u304B\u308A\u307E\u305B\u3093"},"no-selector-notice")]})}))}))},Selected:e=>{let t=[];return e.val_status.dataValue!==null&&d.scope(()=>{let l=e.rootStates.options.find(n=>d.is.equal(n==null?void 0:n.value,e.val_status.dataValue));l&&t.push(a(_,c(o({},e.rootStates.SelectedCellStyles),{children:(l==null?void 0:l.label)||(l==null?void 0:l.value)}),String(l==null?void 0:l.value)))}),a(J,{children:t})},Core:e=>{var L,x;let{value:t}=e,[l,n]=A(k.DefaultStatus(e.componentId,t)),[i,v]=A(!1),[p,I]=A(!1),[S,b]=A(((L=e.options.find(T=>(T==null?void 0:T.value)===e.value))==null?void 0:L.id)||((x=e.options[0])==null?void 0:x.id)||""),[g,f]=A({ok:!1,notice:[]}),E={rootStates:e,val_preventOpenSelectorOnFocus:i,set_preventOpenSelectorOnFocus:v,val_optionFocused:S,set_optionFocused:b,val_selectorOpen:p,set_selectorOpen:I,val_status:l,set_status:n,val_validate:g,set_validate:f};return k.CommonEffects({type:"select",states:e,val_status:l,set_status:n,val_validate:g,set_validate:f,SystemValidation:Be}),O(we,{val_status:l,set_status:n,val_validate:g,states:e,children:[a(ke,{componentId:e.componentId,fontSize:e.fontSize,required:e.required,label:e.label,isActive:e.isLabelActive||l.dataValue!==null}),a(V.Shallow,o({},E)),a(V.Button,o({},E))]})}},oe=e=>{var l;let t=o({},e);return t=c(o({emptySelect:!0,SelectorMode:"original",SelectorPosition:3},t),{freeCSS:o({cursor:"pointer"},t.freeCSS)}),t.emptySelect&&(t.options=[{value:null,label:a(W.Supplement,{fontColor:"4.thin",children:"\u672A\u9078\u629E"})},...t.options]),t.value=(l=t.value)!=null?l:null,t.options.forEach((n,i)=>{if(!n)return;let{type:v,value:p,searchValue:I}=n,S=I||d.is.string(p)&&p||d.Stringify(p||"")||"";t.options[i]=c(o({id:C()},n),{value:p,searchValue:S,type:v||"selector"})}),d.is.nullish(t.rightIcon)&&(t.rightIcon=a(Ae,{children:a(le.AngleDown,{})})),a(De,{componentId:t.componentId,children:V.Core,states:Re(t)})};export{oe as Select,oe as default};
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import{b as n,c as r,d as ae,e as ue}from"../../chunk-C5N2D3ZX.js";import{Fragment as de,jsx as s,jsxs as Y}from"react/jsx-runtime";import b,{UUID as C,useStore as ce}from"jmini";import{useState as ie,useEffect as ne}from"react";import{$$fromRoot as De,ExtractStyles as ke}from"../../@utils";import{Box as D,FAI as Ne}from"../../atoms";import{Literal as le}from"../../mols";import{Tips as pe,Button as Ee}from"..";import{faEye as Le}from"@fortawesome/free-solid-svg-icons/faEye";import{OptionalInputWrapper as _e,BoxWrapper as He,CoreEffects as K,DefaultBoxishStyles as Ae}from"./core";import{InputLabel as Be}from"./Label";import{LeftIcon as Me,RightIcon as me}from".";const $e={katakana:{reg:/^[ァ-ヶー ヲ-゚ ]*$/g,exist:!0,reason:"\u30AB\u30BF\u30AB\u30CA\u3067\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"},"hankaku.katakana":{reg:/^[ヲ-゚ ]*$/g,exist:!0,reason:"\u534A\u89D2\u30AB\u30BF\u30AB\u30CA\u3067\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"},number:{reg:/^-?[0-9\.]{0,}[0-9]{1,}$/g,exist:!0,reason:"\u534A\u89D2\u6570\u5B57\u3067\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"},digitNumber:{reg:/^-?[0-9\,\.]{0,}[0-9]{1,}$/g,exist:!0,reason:"\u534A\u89D2\u6570\u5B57\u3067\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"},fileName:{reg:/[¥\/:*\?\"\'\|\.\s\n\r\<\>]/g,exist:!1,reason:"\u7A7A\u767D\u307E\u305F\u306F\u4E00\u90E8\u306E\u7279\u6B8A\u6587\u5B57\u306F\u4F7F\u7528\u3067\u304D\u307E\u305B\u3093"},creditCard:{reg:/^\d{14,16}$/g,exist:!0,reason:"14~16\u6841\u306E\u6570\u5B57\u3067\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"},email:{reg:/^[A-Za-z0-9]{1}[A-Za-z0-9_.-]*@{1}[A-Za-z0-9_.-]+\.[A-Za-z0-9]+$/,exist:!0,reason:Y(de,{children:[s(D,{children:"\u25CB\u25CB\u25CB\u25CB@\u25CB\u25CB\u25CB\u25CB.\u25CB\u25CB\u25CB\u306E\u5F62\u5F0F\u3067\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"}),s(D,{children:"\u6700\u5F8C\u306E\u6587\u5B57\u306B.(\u30C9\u30C3\u30C8)\u3092\u5165\u308C\u308B\u3053\u3068\u306F\u3067\u304D\u307E\u305B\u3093"})]})},password:{reg:/^(?=[^A-Z]*[A-Z])(?=[^a-z]*[a-z])(?=[^0-9]*[0-9]).{8,}$/,exist:!0,reason:"8\u6587\u5B57\u4EE5\u4E0A\u3001\u534A\u89D2\u82F1\u6570\u5927\u5C0F\u6587\u5B57\u3067\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"},tel:{reg:/.*$/g,exist:!0,reason:Y(de,{children:[s(D,{children:"0\u304B\u3089\u59CB\u307E\u308B\u756A\u53F7\u306E\u307F\u5165\u529B\u53EF\u80FD\u3067\u3059"}),s(D,{children:"9~12\u6841\u306E\u6570\u5B57\u3067\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"}),s(D,{children:"\u6570\u5B57\u306E\u307F\u5165\u529B\u53EF\u80FD\u3067\u3059"})]})},url:{reg:/^https?:\/\/[^\n\s]+(\.|\:)[^\n\s\.\:]+$/,exist:!0,reason:"URL\u5F62\u5F0F : http(s)://\u25EF\u25EF\u25EF\u25EF"},postal:{reg:/^\d{7}$/g,exist:!0,reason:"7\u6841\u306E\u6570\u5B57\u3067\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"}},T={setSelection:t=>{let{id:a,restrict:l,val_status:u}=t,i=De("#"+a)[0];if(!i||!u.prevValue||!u.formatValue||!u.isFocusing||u.isComposing)return;let{formatValue:e,prevValue:f,caretFrom:g,caretTo:o}=u;if(l=="creditCard")e.length>=f.length&&g%5==0&&(g++,o++),i.setSelectionRange(g,o);else if(l=="postal")e.length==5&&f.length==3&&(g++,o++),i.setSelectionRange(g,o);else if(l=="digitNumber"){let p=e.length-f.length;p==2&&(g++,o++),p==-2&&(g--,o--),i.setSelectionRange(g,o)}},Validation:{System:t=>{let{value:a,states:l}=t,{restrict:u="text",defaultValidation:i,maxLength:e,multiline:f,required:g}=l,o=[];if(f||(e=e||255),b.is.exist(e)&&a.length>=Number(e)&&o.push({type:"invalid",label:e+"\u5B57\u4EE5\u5185\u3067\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"}),a){let p=T.Validation.Text(a,u,i);p.ok||o.push({type:"invalid",label:p.body})}else g&&o.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"});return{ok:!o.filter(({type:p})=>p=="invalid").length,notice:o}},Text:(t,a,l)=>{let u={ok:!0,body:""};return(()=>{let i=l||$e[a];if(!i)return;let e=i.reason;if(i){let f=!!(+!!t.match(i.reg)^+!i.exist);u={ok:f,body:f?"":e}}})(),u},DataLeveling:t=>{let{restrict:a,allowDecimals:l,allowZeroStart:u,value:i=""}=t,e=String(i);["tel","number","digitNumber","postal","creditCard"].includes(a)&&(e=e.zen2hanNumber()),a=="katakana",a=="hankaku.katakana",["postal","creditCard"].includes(a)&&(e=e.removeLetters()),b.scope(()=>{if(!["number","digitNumber"].includes(a))return;e=e.replace(/(\.\d+)\..*/g,"$1").replace(/\.+/g,".").replace(/[^0-9.-]/g,"");let g=Number(e)<0||e[0]=="-";e=e.replace(/[^0-9.]/g,""),g&&(e="-"+e);let o=Number(l);l?e=e.replace(/(\.\d{0,})\..*/g,"$1").replace(/\.(\d{0,})/g,(p,x)=>x.length>o?"."+x.slice(0,o):p):e=e.replace(/\.\d?/g,""),b.scope(()=>{a=="number"&&(u||(e=e.replace(/^0(\d+)/g,"$1").replace(/^-0(\d+)/g,"-$1")))}),b.scope(()=>{let p=e.slice(-1);if(!e||p=="."||p=="-")return;let{min:x,max:c}=t;b.is.exist(x)&&b.is.number(x)&&Number(e)<Number(x)&&(e=String(x.toFixed(o))),b.is.exist(c)&&b.is.number(c)&&Number(e)>Number(c)&&(e=String(c.toFixed(o)))}),b.scope(()=>{if(!e||e=="-"||a!="digitNumber")return;let p=e.slice(-1),[x,c]=e.split(".");e=x.replace(/\B(?=(\d{3})+(?!\d))/g,","),c&&(e+="."+c),p=="."&&(e+=".")})});let f=e;return a=="digitNumber"||(a=="postal"?e.length>=4&&(f=e.clip(0,3)+"-"+e.clip(3)):a=="creditCard"&&(f=e.replace(/.{4}(?=.)/g,"$& "))),(a=="digitNumber"||a=="number")&&(e=e.replace(/,/g,"")),{formatValue:f,dataValue:e}}},Shallow:t=>{let{rootStates:a,val_status:l}=t,u=l.dataValue||"";ne(()=>{b.scope(()=>ue(void 0,null,function*(){if(!a.multiline)return;let p=b('[data-input-origin="'+l.componentId+'"]'),x=b('[data-input-shallow="'+l.componentId+'"]'),c=b('[data-input-min-height-value-shallow="'+l.componentId+'"]'),E=b('[data-input-max-height-value-shallow="'+l.componentId+'"]');if(!p[0]||!x[0]||!c[0]||!E[0])return;let L=x.position(),F=c.position(),$=E.position(),k=0;a.autoHeight&&(k=L.height),k=Math.max(k,F.height),k=Math.min(k,$.height),p[0].style.height=k+"px"}))},[u]);let i=u||"";(!!u.match(/\n$/)||!u)&&(i+="T");let f="",g="";if(a.multiline){let p=a.minRows||1,x=a.maxRows||100;f=`
|
|
2
2
|
T`.repeat(p-1),g=`
|
|
3
|
-
T`.repeat(x-1)}let o=ke(a);return Y(D,{position:"absolute",top:0,left:0,right:0,height:0,overflow:"hidden",opacity:"trans",freeCSS:{zIndex:3,pointerEvents:"none"},children:[s(le.Description,r(n({className:a.className},o),{position:"absolute",width:1,freeCSS:r(n({},o.freeCSS),{color:"orange"}),"data-input-shallow":l.componentId,children:s(D,{"data-input-value-shallow":l.componentId,children:i})})),s(le.Description,r(n({className:a.className},o),{position:"absolute",left:0,freeCSS:r(n({},o.freeCSS),{backgroundColor:"transparent",color:"blue"}),"data-input-min-height-value-shallow":l.componentId,children:f})),s(le.Description,r(n({className:a.className},o),{position:"absolute",right:0,freeCSS:r(n({},o.freeCSS),{backgroundColor:"transparent",color:"red"}),"data-input-max-height-value-shallow":l.componentId,children:g}))]})},InputBox:t=>{let{rootStates:a,val_validate:l,set_validate:u,val_status:i,set_status:e,val_inputType:f,set_inputType:g}=t;if(a.multiline)return null;let re=a,{componentId:o,tone:p,required:x,restrict:c="text",form:E,autoComplete:L="off",autoCapitalize:F="off",minRows:$,maxRows:k,multiline:fe,autoHeight:ge,enableFormSubmit:G,clearButton:xe=!1,allowDecimals:z,allowZeroStart:A,checkValidationAtFirst:W,onChange:X,onKeyDown:Q,onValidate:be,onValidateDelay:he,onUpdateValue:Ie,onUpdateValidValue:Se,onUserAction:ve,value:Te="",leftIndicator:Ce,rightIndicator:Re,leftIcon:ye,rightIcon:we,maxLength:m,min:O,max:B,label:v,isLabelActive:y,defaultValidation:oe,wrapStyles:Pe}=re,d=ae(re,["componentId","tone","required","restrict","form","autoComplete","autoCapitalize","minRows","maxRows","multiline","autoHeight","enableFormSubmit","clearButton","allowDecimals","allowZeroStart","checkValidationAtFirst","onChange","onKeyDown","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","onUserAction","value","leftIndicator","rightIndicator","leftIcon","rightIcon","maxLength","min","max","label","isLabelActive","defaultValidation","wrapStyles"]);return s(D,r(n({htmlTag:"input",type:f,inputMode:["number","digitNumber","creditCard"].includes(c)?"numeric":c=="email"?"email":"text","data-disabled":a.disabled,"data-show-validation":K.isShowValidation(l,i,!!W),"data-component-id":i.componentId,"data-input-origin":i.componentId,value:i.formatValue,autoComplete:L,autoCapitalize:F,onKeyDown:I=>{let{key:h,target:w}=I,M=w,{selectionStart:P,selectionEnd:j}=M,q=Number(P),Z=Number(j);{let _=i.formatValue[Number(q)],H=i.formatValue[Number(q)-1];h=="Delete"&&(c=="creditCard"&&_==" "||c=="postal"&&_=="-"||c=="digitNumber"&&_==",")&&(M.setSelectionRange(q+1,Z+1),I.preventDefault()),h=="Backspace"&&(c=="creditCard"&&H==" "||c=="postal"&&H=="-"||c=="digitNumber"&&H==",")&&(M.setSelectionRange(q-1,Z-1),I.preventDefault()),h=="Enter"||h=="Tab"}b.scope(()=>{["number","digitNumber","creditCard"].includes(c)&&h=="Clear"&&e(_=>r(n({},_),{dataValue:"",formatValue:"",eventType:"update",eventID:C(),isFocusing:!0}))}),b.scope(()=>{if(!["number","digitNumber"].includes(c)||!["ArrowUp","ArrowDown"].includes(h))return;let _=+(h=="ArrowUp")*2-1,H=i.dataValue.slice(-1),se=i.formatValue[Z-1],N=Z-1,V=String(i.formatValue),ee=i.dataValue.split(".")[1],Ve=(ee==null?void 0:ee.length)||0;b.scope(()=>{if(!H){V="0";return}if(H=="-"){V+="0";return}if(H=="."){V+="0";return}if(Z==0)return;let te=String(V).slice(0,N).match(/\./),Fe=String(V).slice(N),J=String(Fe.toNumber().toFixed(0)).length;se=="."&&(J=1,N=V.split(".")[0].length-1),se==","&&(J+=1,N--),te&&(J=-1*(Ve-J));let U=V[N].toNumber()+_;U<0?U=9:U>=10&&(U=0),V=V.partReplace(N,String(U)),setTimeout(()=>{M.setSelectionRange(N+1,N+1)},1)}),l.ok&&u({ok:!1,notice:[]}),e(te=>r(n(n({},te),T.Validation.DataLeveling({allowDecimals:z,allowZeroStart:A,min:O,max:B,restrict:c,value:V})),{eventType:"update",eventID:C(),isFocusing:!0})),I.preventDefault()}),Q&&Q(I),G&&K.SubmitForm(I,E)},onChange:I=>{let{value:h,selectionStart:w,selectionEnd:M}=I.target,P=T.Validation.DataLeveling({allowDecimals:z,allowZeroStart:A,min:O,max:B,restrict:c,value:h});i.isComposing&&(P.formatValue=h),P.formatValue!=i.formatValue&&(l.ok&&u({ok:!1,notice:[]}),e(j=>r(n(n({},j),P),{prevValue:i.formatValue,eventType:"update",eventID:C(),caretFrom:Number(w),caretTo:Number(M),isFocusing:!0})),X&&X(I))},width:1},d),{onFocus:I=>{d!=null&&d.onFocus&&(d==null||d.onFocus(I)),e(h=>r(n({},h),{eventID:C(),isFocusing:!0}))},onBlur:I=>{d!=null&&d.onBlur&&(d==null||d.onBlur(I)),e(h=>r(n({},h),{eventID:C(),isFocusing:!1}))},onCompositionStart:I=>{d!=null&&d.onCompositionStart&&(d==null||d.onCompositionStart(I)),e(h=>r(n({},h),{eventID:C(),isComposing:!0}))},onCompositionEnd:I=>{if(d!=null&&d.onCompositionEnd&&(d==null||d.onCompositionEnd(I)),c=="text"){b.interval.once(()=>{e(w=>r(n({},w),{isComposing:!1}))},100,"input.textfield.composing.end");return}let h=T.Validation.DataLeveling({allowDecimals:z,allowZeroStart:A,min:O,max:B,restrict:c,value:i.formatValue});e(w=>r(n(n({},w),h),{prevValue:w.formatValue,eventType:"update",eventID:C(),caretFrom:Number(w.formatValue.length+1),caretTo:Number(w.formatValue.length+1),isComposing:!1}))}}))},TextAreaBox:t=>{let{rootStates:a,val_validate:l,set_validate:u,val_status:i,set_status:e,isShallow:f}=t,B=a,{componentId:g,tone:o,required:p,form:x,label:c,isLabelActive:E,minRows:L,maxRows:F,multiline:$,autoHeight:k,allowDecimals:fe,allowZeroStart:ge,enableFormSubmit:G,maxLength:xe,checkValidationAtFirst:z,onChange:A,onKeyDown:W,onValidate:X,onValidateDelay:Q,onUpdateValue:be,onUpdateValidValue:he,onUserAction:Ie,value:Se="",leftIndicator:ve,rightIndicator:Te,leftIcon:Ce,rightIcon:Re,defaultValidation:ye,wrapStyles:we}=B,m=ae(B,["componentId","tone","required","form","label","isLabelActive","minRows","maxRows","multiline","autoHeight","allowDecimals","allowZeroStart","enableFormSubmit","maxLength","checkValidationAtFirst","onChange","onKeyDown","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","onUserAction","value","leftIndicator","rightIndicator","leftIcon","rightIcon","defaultValidation","wrapStyles"]);return!a.multiline?null:s(D,r(n({htmlTag:"textarea","data-show-validation":K.isShowValidation(l,i,!!z),"data-input-origin":i.componentId,"data-component-id":i.componentId,value:i.dataValue,width:1},m),{onFocus:v=>{m!=null&&m.onFocus&&(m==null||m.onFocus(v)),e(y=>r(n({},y),{eventID:C(),isFocusing:!0}))},onBlur:v=>{m!=null&&m.onBlur&&(m==null||m.onBlur(v)),e(y=>r(n({},y),{eventID:C(),isFocusing:!1}))},onCompositionStart:v=>{m!=null&&m.onCompositionStart&&(m==null||m.onCompositionStart(v)),e(y=>r(n({},y),{eventID:C(),isComposing:!0}))},onCompositionEnd:v=>{m!=null&&m.onCompositionEnd&&(m==null||m.onCompositionEnd(v)),b.interval.once(()=>{e(y=>r(n({},y),{eventID:C(),isComposing:!1}))},100,"input.textfield.composing.end")},onKeyDown:v=>{W&&W(v),G&&K.SubmitForm(v,x)},onChange:v=>{let{value:y}=v.target;l.ok&&u({ok:!1,notice:[]}),e(oe=>r(n({},oe),{dataValue:y,eventType:"update",eventID:C(),isFocusing:!0})),A&&A(v)}}))}},ze=t=>{let{componentId:a,restrict:l="text",value:u="",min:i,max:e,allowDecimals:f,allowZeroStart:g}=t,[o,p]=ie(r(n({componentId:a},T.Validation.DataLeveling({allowDecimals:f,allowZeroStart:g,min:i,max:e,restrict:l,value:u})),{prevValue:"",eventType:"init",eventID:C(),caretFrom:null,caretTo:null})),[x,c]=ie({ok:!1,notice:[]}),[E,L]=ie(["password","concealed"].includes(l)&&"password"||"text");ne(()=>{p($=>n(n({},$),T.Validation.DataLeveling({allowDecimals:f,allowZeroStart:g,min:i,max:e,restrict:l,value:u}))),ce.set({[a+":set_inputType"]:L})},[]);let F={rootStates:t,val_inputType:E,set_inputType:L,val_status:o,set_status:p,val_validate:x,set_validate:c};return K.CommonEffects({type:"textfield",states:t,val_status:o,set_status:p,val_validate:x,set_validate:c,SystemValidation:T.Validation.System,ExtraOverrideStates:()=>T.Validation.DataLeveling({allowDecimals:f,allowZeroStart:g,min:i,max:e,restrict:l,value:u})}),ne(()=>{T.setSelection({id:t.id,restrict:l,val_status:o})},[o]),Y(He,{val_status:o,set_status:p,val_validate:x,states:F.rootStates,children:[s(Be,{componentId:t.componentId,fontSize:t.fontSize,required:t.required,label:t.label,isActive:t.isLabelActive||!!o.isFocusing||!!o.dataValue}),s(T.Shallow,n({},F)),s(T.InputBox,n({},F)),s(T.TextAreaBox,n({},F))]})},R=t=>(t=n({autoHeight:!0,restrict:"text",fontSize:"inherit",value:""},t),t.value=T.Validation.DataLeveling({allowDecimals:t.allowDecimals,allowZeroStart:t.allowZeroStart,min:t.min,max:t.max,restrict:t.restrict||"text",value:t.value||""}).dataValue||"",t.multiline?(t.minRows=t.minRows||5,t.maxRows=t.maxRows||20):(t.minRows=1,t.maxRows=1),s(_e,{componentId:t.componentId,children:ze,states:Ae(t)})),S=R;S.Validate=T.Validation.Text,S.Katakana=t=>s(R,r(n({},t),{restrict:"katakana",multiline:!1,autoHeight:!1})),S.HankakuKatakana=t=>s(R,r(n({},t),{restrict:"hankaku.katakana",multiline:!1,autoHeight:!1})),S.CreditCard=t=>s(R,r(n({},t),{restrict:"creditCard",multiline:!1,autoHeight:!1})),S.Tel=t=>s(R,r(n({},t),{restrict:"tel",multiline:!1,autoHeight:!1})),S.Number=t=>s(R,r(n({},t),{restrict:"number",multiline:!1,autoHeight:!1})),S.DigitNumber=t=>s(R,r(n({},t),{restrict:"digitNumber",multiline:!1,autoHeight:!1})),S.Email=t=>s(R,r(n({},t),{restrict:"email",multiline:!1,autoHeight:!1})),S.Url=t=>s(R,r(n({},t),{restrict:"url",multiline:!1,autoHeight:!1})),S.Postal=t=>s(R,r(n({label:"\u90F5\u4FBF\u756A\u53F7"},t),{restrict:"postal",multiline:!1,autoHeight:!1,leftIcon:s(Me,{ssSphere:2,fontColor:"4.thin",children:"\u3012"})})),S.Password=t=>s(R,r(n({label:"\u30D1\u30B9\u30EF\u30FC\u30C9",rightIcon:s(me,{ssSphere:2.5,freeCSS:{pointerEvents:"all"},children:s(Ee.Sub,{ssSphere:2.5,borderRadius:"3.tone.tertiary",fontColor:"theme",flexCenter:!0,height:1,ssEffectsOnActive:["expand"],onMouseOver:a=>{pe.open(a.currentTarget,"\u30C6\u30AD\u30B9\u30C8\u3092\u8868\u793A",24)},onMouseLeave:pe.abort,tabIndex:-1,onClick:a=>{b(a.target).parent().parent().find("input").callback(l=>{let u=l[0];if(!u)return;let i=u.dataset.componentId;if(!i)return;let e=ce.get(i+":set_inputType");e&&e(f=>f==="password"&&"text"||"password")})},children:s(Ne,{icon:Le})})}),restrict:"password"},t),{multiline:!1,autoHeight:!1})),S.Concealed=t=>s(S.Password,r(n({label:"\u79D8\u5BC6\u9375"},t),{restrict:"concealed"})),S.Money={JPY:t=>s(S.DigitNumber,r(n({rightIcon:s(me,{fontColor:"4.thin",children:"\u5186"})},t),{multiline:!1,autoHeight:!1}))};export{S as TextField,ze as TextInput,S as default};
|
|
3
|
+
T`.repeat(x-1)}let o=ke(a);return Y(D,{position:"absolute",top:0,left:0,right:0,height:0,overflow:"hidden",opacity:"trans",freeCSS:{zIndex:3,pointerEvents:"none"},children:[s(le.Description,r(n({className:a.className},o),{position:"absolute",width:1,freeCSS:r(n({},o.freeCSS),{color:"orange"}),"data-input-shallow":l.componentId,children:s(D,{"data-input-value-shallow":l.componentId,children:i})})),s(le.Description,r(n({className:a.className},o),{position:"absolute",left:0,freeCSS:r(n({},o.freeCSS),{backgroundColor:"transparent",color:"blue"}),"data-input-min-height-value-shallow":l.componentId,children:f})),s(le.Description,r(n({className:a.className},o),{position:"absolute",right:0,freeCSS:r(n({},o.freeCSS),{backgroundColor:"transparent",color:"red"}),"data-input-max-height-value-shallow":l.componentId,children:g}))]})},InputBox:t=>{let{rootStates:a,val_validate:l,set_validate:u,val_status:i,set_status:e,val_inputType:f,set_inputType:g}=t;if(a.multiline)return null;let re=a,{componentId:o,tone:p,required:x,restrict:c="text",form:E,autoComplete:L="off",autoCapitalize:F="off",minRows:$,maxRows:k,multiline:fe,autoHeight:ge,enableFormSubmit:G,clearButton:xe=!1,allowDecimals:z,allowZeroStart:A,checkValidationAtFirst:W,onChange:X,onKeyDown:Q,onValidate:be,onValidateDelay:he,onUpdateValue:Ie,onUpdateValidValue:Se,onUserAction:ve,value:Te="",leftIndicator:Ce,rightIndicator:Re,leftIcon:ye,rightIcon:we,maxLength:m,min:O,max:B,label:v,isLabelActive:y,defaultValidation:oe,wrapStyles:Pe}=re,d=ae(re,["componentId","tone","required","restrict","form","autoComplete","autoCapitalize","minRows","maxRows","multiline","autoHeight","enableFormSubmit","clearButton","allowDecimals","allowZeroStart","checkValidationAtFirst","onChange","onKeyDown","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","onUserAction","value","leftIndicator","rightIndicator","leftIcon","rightIcon","maxLength","min","max","label","isLabelActive","defaultValidation","wrapStyles"]);return s(D,r(n({htmlTag:"input",type:f,inputMode:["number","digitNumber","creditCard"].includes(c)?"numeric":c=="email"?"email":"text","data-disabled":a.disabled,"data-show-validation":K.isShowValidation(l,i,!!W),"data-component-id":i.componentId,"data-input-origin":i.componentId,value:i.formatValue,autoComplete:L,autoCapitalize:F,onKeyDown:I=>{let{key:h,target:w}=I,M=w,{selectionStart:P,selectionEnd:j}=M,q=Number(P),Z=Number(j);{let _=i.formatValue[Number(q)],H=i.formatValue[Number(q)-1];h=="Delete"&&(c=="creditCard"&&_==" "||c=="postal"&&_=="-"||c=="digitNumber"&&_==",")&&(M.setSelectionRange(q+1,Z+1),I.preventDefault()),h=="Backspace"&&(c=="creditCard"&&H==" "||c=="postal"&&H=="-"||c=="digitNumber"&&H==",")&&(M.setSelectionRange(q-1,Z-1),I.preventDefault()),h=="Enter"||h=="Tab"}b.scope(()=>{["number","digitNumber","creditCard"].includes(c)&&h=="Clear"&&e(_=>r(n({},_),{dataValue:"",formatValue:"",eventType:"update",eventID:C(),isFocusing:!0}))}),b.scope(()=>{if(!["number","digitNumber"].includes(c)||!["ArrowUp","ArrowDown"].includes(h))return;let _=+(h=="ArrowUp")*2-1,H=i.dataValue.slice(-1),se=i.formatValue[Z-1],N=Z-1,V=String(i.formatValue),ee=i.dataValue.split(".")[1],Ve=(ee==null?void 0:ee.length)||0;b.scope(()=>{if(!H){V="0";return}if(H=="-"){V+="0";return}if(H=="."){V+="0";return}if(Z==0)return;let te=String(V).slice(0,N).match(/\./),Fe=String(V).slice(N),J=String(Fe.toNumber().toFixed(0)).length;se=="."&&(J=1,N=V.split(".")[0].length-1),se==","&&(J+=1,N--),te&&(J=-1*(Ve-J));let U=V[N].toNumber()+_;U<0?U=9:U>=10&&(U=0),V=V.partReplace(N,String(U)),setTimeout(()=>{M.setSelectionRange(N+1,N+1)},1)}),l.ok&&u({ok:!1,notice:[]}),e(te=>r(n(n({},te),T.Validation.DataLeveling({allowDecimals:z,allowZeroStart:A,min:O,max:B,restrict:c,value:V})),{eventType:"update",eventID:C(),isFocusing:!0})),I.preventDefault()}),Q&&Q(I),G&&K.SubmitForm(I,E)},onChange:I=>{let{value:h,selectionStart:w,selectionEnd:M}=I.target,P=T.Validation.DataLeveling({allowDecimals:z,allowZeroStart:A,min:O,max:B,restrict:c,value:h});i.isComposing&&(P.formatValue=h),P.formatValue!=i.formatValue&&(l.ok&&u({ok:!1,notice:[]}),e(j=>r(n(n({},j),P),{prevValue:i.formatValue,eventType:"update",eventID:C(),caretFrom:Number(w),caretTo:Number(M),isFocusing:!0})),X&&X(I))},width:1},d),{onFocus:I=>{d!=null&&d.onFocus&&(d==null||d.onFocus(I)),e(h=>r(n({},h),{eventID:C(),isFocusing:!0}))},onBlur:I=>{d!=null&&d.onBlur&&(d==null||d.onBlur(I)),e(h=>r(n({},h),{eventID:C(),isFocusing:!1}))},onCompositionStart:I=>{d!=null&&d.onCompositionStart&&(d==null||d.onCompositionStart(I)),e(h=>r(n({},h),{eventID:C(),isComposing:!0}))},onCompositionEnd:I=>{if(d!=null&&d.onCompositionEnd&&(d==null||d.onCompositionEnd(I)),c=="text"){b.interval.once(()=>{e(w=>r(n({},w),{isComposing:!1}))},100,"input.textfield.composing.end");return}let h=T.Validation.DataLeveling({allowDecimals:z,allowZeroStart:A,min:O,max:B,restrict:c,value:i.formatValue});e(w=>r(n(n({},w),h),{prevValue:w.formatValue,eventType:"update",eventID:C(),caretFrom:Number(w.formatValue.length+1),caretTo:Number(w.formatValue.length+1),isComposing:!1}))}}))},TextAreaBox:t=>{let{rootStates:a,val_validate:l,set_validate:u,val_status:i,set_status:e,isShallow:f}=t,B=a,{componentId:g,tone:o,required:p,form:x,label:c,isLabelActive:E,minRows:L,maxRows:F,multiline:$,autoHeight:k,allowDecimals:fe,allowZeroStart:ge,enableFormSubmit:G,maxLength:xe,checkValidationAtFirst:z,onChange:A,onKeyDown:W,onValidate:X,onValidateDelay:Q,onUpdateValue:be,onUpdateValidValue:he,onUserAction:Ie,value:Se="",leftIndicator:ve,rightIndicator:Te,leftIcon:Ce,rightIcon:Re,defaultValidation:ye,wrapStyles:we}=B,m=ae(B,["componentId","tone","required","form","label","isLabelActive","minRows","maxRows","multiline","autoHeight","allowDecimals","allowZeroStart","enableFormSubmit","maxLength","checkValidationAtFirst","onChange","onKeyDown","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","onUserAction","value","leftIndicator","rightIndicator","leftIcon","rightIcon","defaultValidation","wrapStyles"]);return!a.multiline?null:s(D,r(n({htmlTag:"textarea","data-show-validation":K.isShowValidation(l,i,!!z),"data-input-origin":i.componentId,"data-component-id":i.componentId,value:i.dataValue,width:1},m),{onFocus:v=>{m!=null&&m.onFocus&&(m==null||m.onFocus(v)),e(y=>r(n({},y),{eventID:C(),isFocusing:!0}))},onBlur:v=>{m!=null&&m.onBlur&&(m==null||m.onBlur(v)),e(y=>r(n({},y),{eventID:C(),isFocusing:!1}))},onCompositionStart:v=>{m!=null&&m.onCompositionStart&&(m==null||m.onCompositionStart(v)),e(y=>r(n({},y),{eventID:C(),isComposing:!0}))},onCompositionEnd:v=>{m!=null&&m.onCompositionEnd&&(m==null||m.onCompositionEnd(v)),b.interval.once(()=>{e(y=>r(n({},y),{eventID:C(),isComposing:!1}))},100,"input.textfield.composing.end")},onKeyDown:v=>{W&&W(v),G&&K.SubmitForm(v,x)},onChange:v=>{let{value:y}=v.target;l.ok&&u({ok:!1,notice:[]}),e(oe=>r(n({},oe),{dataValue:y,eventType:"update",eventID:C(),isFocusing:!0})),A&&A(v)}}))}},ze=t=>{let{componentId:a,restrict:l="text",value:u="",min:i,max:e,allowDecimals:f,allowZeroStart:g}=t,[o,p]=ie(r(n({componentId:a},T.Validation.DataLeveling({allowDecimals:f,allowZeroStart:g,min:i,max:e,restrict:l,value:u})),{prevValue:"",eventType:"init",eventID:C(),caretFrom:null,caretTo:null})),[x,c]=ie({ok:!1,notice:[]}),[E,L]=ie(["password","concealed"].includes(l)&&"password"||"text");ne(()=>{p($=>n(n({},$),T.Validation.DataLeveling({allowDecimals:f,allowZeroStart:g,min:i,max:e,restrict:l,value:u}))),ce.set({[a+":set_inputType"]:L})},[]);let F={rootStates:t,val_inputType:E,set_inputType:L,val_status:o,set_status:p,val_validate:x,set_validate:c};return K.CommonEffects({type:"textfield",states:t,val_status:o,set_status:p,val_validate:x,set_validate:c,SystemValidation:T.Validation.System,ExtraOverrideStates:()=>T.Validation.DataLeveling({allowDecimals:f,allowZeroStart:g,min:i,max:e,restrict:l,value:u})}),ne(()=>{T.setSelection({id:t.id,restrict:l,val_status:o})},[o]),Y(He,{val_status:o,set_status:p,val_validate:x,states:F.rootStates,children:[s(Be,{componentId:t.componentId,fontSize:t.fontSize,required:t.required,label:t.label,isActive:t.isLabelActive||!!o.isFocusing||!!o.dataValue}),s(T.Shallow,n({},F)),s(T.InputBox,n({},F)),s(T.TextAreaBox,n({},F))]})},R=t=>{var a,l;return t=n({autoHeight:!0,restrict:"text",fontSize:"inherit",value:""},t),t.value=(l=T.Validation.DataLeveling({allowDecimals:t.allowDecimals,allowZeroStart:t.allowZeroStart,min:t.min,max:t.max,restrict:t.restrict||"text",value:(a=t.value)!=null?a:""}).dataValue)!=null?l:"",t.multiline?(t.minRows=t.minRows||5,t.maxRows=t.maxRows||20):(t.minRows=1,t.maxRows=1),s(_e,{componentId:t.componentId,children:ze,states:Ae(t)})},S=R;S.Validate=T.Validation.Text,S.Katakana=t=>s(R,r(n({},t),{restrict:"katakana",multiline:!1,autoHeight:!1})),S.HankakuKatakana=t=>s(R,r(n({},t),{restrict:"hankaku.katakana",multiline:!1,autoHeight:!1})),S.CreditCard=t=>s(R,r(n({},t),{restrict:"creditCard",multiline:!1,autoHeight:!1})),S.Tel=t=>s(R,r(n({},t),{restrict:"tel",multiline:!1,autoHeight:!1})),S.Number=t=>s(R,r(n({},t),{restrict:"number",multiline:!1,autoHeight:!1})),S.DigitNumber=t=>s(R,r(n({},t),{restrict:"digitNumber",multiline:!1,autoHeight:!1})),S.Email=t=>s(R,r(n({},t),{restrict:"email",multiline:!1,autoHeight:!1})),S.Url=t=>s(R,r(n({},t),{restrict:"url",multiline:!1,autoHeight:!1})),S.Postal=t=>s(R,r(n({label:"\u90F5\u4FBF\u756A\u53F7"},t),{restrict:"postal",multiline:!1,autoHeight:!1,leftIcon:s(Me,{ssSphere:2,fontColor:"4.thin",children:"\u3012"})})),S.Password=t=>s(R,r(n({label:"\u30D1\u30B9\u30EF\u30FC\u30C9",rightIcon:s(me,{ssSphere:2.5,freeCSS:{pointerEvents:"all"},children:s(Ee.Sub,{ssSphere:2.5,borderRadius:"3.tone.tertiary",fontColor:"theme",flexCenter:!0,height:1,ssEffectsOnActive:["expand"],onMouseOver:a=>{pe.open(a.currentTarget,"\u30C6\u30AD\u30B9\u30C8\u3092\u8868\u793A",24)},onMouseLeave:pe.abort,tabIndex:-1,onClick:a=>{b(a.target).parent().parent().find("input").callback(l=>{let u=l[0];if(!u)return;let i=u.dataset.componentId;if(!i)return;let e=ce.get(i+":set_inputType");e&&e(f=>f==="password"&&"text"||"password")})},children:s(Ne,{icon:Le})})}),restrict:"password"},t),{multiline:!1,autoHeight:!1})),S.Concealed=t=>s(S.Password,r(n({label:"\u79D8\u5BC6\u9375"},t),{restrict:"concealed"})),S.Money={JPY:t=>s(S.DigitNumber,r(n({rightIcon:s(me,{fontColor:"4.thin",children:"\u5186"})},t),{multiline:!1,autoHeight:!1}))};export{S as TextField,ze as TextInput,S as default};
|