amotify 0.2.239 → 0.2.240
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/fn/Input/Autocomplete.js +1 -1
- package/dist/fn/Input/Color.js +1 -1
- package/dist/fn/Input/Contenteditable.js +1 -1
- package/dist/fn/Input/DigitCharacters.js +1 -1
- package/dist/fn/Input/Filer.js +1 -1
- package/dist/fn/Input/Hidden.js +1 -1
- package/dist/fn/Input/List.js +1 -1
- package/dist/fn/Input/Select.js +1 -1
- package/dist/fn/Input/Slider.js +1 -1
- package/dist/fn/Input/Switch.js +1 -1
- package/dist/fn/Input/TextField.js +2 -2
- package/dist/fn/Input/Time/index.js +1 -1
- package/dist/fn/Input/core.js +1 -1
- package/dist/fn/Input/index.d.ts +2 -1
- package/dist/fn/Input/index.js +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
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};
|
|
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(),isInspected:!1}))}):a=="Enter"&&c.scope(()=>{if(r.isComposing||(o==null?void 0:o.keyCode)===229)return;if(!e.val_openSelector)return e.set_openSelector(!0);if(!e.val_optionFocused)return;let u=e.val_options.find(S=>(S==null?void 0:S.id)==e.val_optionFocused);if(!u)return;let{value:i}=u;e.set_status(S=>{let m=[...S.dataValue];return c.scope(()=>{if(i===null)return m=[];S.dataValue.includes(i)?m=m.filter(C=>C!==i):t.multiSelect?m.push(i):m=[i]}),h(f({},S),{dataValue:m,eventType:"update",eventID:D(),isInspected:!1})}),e.set_optionsModified(!0),e.set_keyword("")}),c.scope(()=>{if(!["ArrowDown","ArrowUp"].includes(a))return;if(o.preventDefault(),!e.val_openSelector)return e.set_openSelector(!0);let u=a=="ArrowDown"?1:-1,i=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(),isInspected:!1})})}})},s.id)})]})]})}))}))},Selected:e=>{let{rootStates:t,val_status:r,set_status:p,val_optionsDict:o}=e,a=[];return r.dataValue.forEach(n=>{let d=o[c.Stringify(n)];if(!d)return;let s=t.SelectedComponent,u=d.label;(d==null?void 0:d.value)===null&&(u=""),a.push(l(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(),isInspected:!1}))}})},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};
|
package/dist/fn/Input/Color.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{b as a,c as n,d as S}from"../../chunk-C5N2D3ZX.js";import{jsx as I}from"react/jsx-runtime";import{UUID as
|
|
1
|
+
import{b as a,c as n,d as S}from"../../chunk-C5N2D3ZX.js";import{jsx as I}from"react/jsx-runtime";import{UUID as m}from"jmini";import{useState as T}from"react";import h from"../../atoms/Box";import{OptionalInputWrapper as x,BoxWrapper as B,CoreEffects as c,DefaultBoxishStyles as _}from"./core";import{InputSwitchClasses as k}from"../../@styles/componentClasses";function R(e){let{value:u,states:f}=e,{required:p}=f,l=[];return p&&!u&&l.push({type:"invalid",label:"ON\u306B\u306A\u3063\u3066\u3044\u307E\u305B\u3093"}),{ok:!l.filter(({type:C})=>C=="invalid").length,notice:l}}const U=e=>{let V=e,{componentId:u,required:f,form:p,enableFormSubmit:l,checkValidationAtFirst:C,onChange:y,onKeyDown:v,onValidate:w,onValidateDelay:E,onUpdateValue:W,onUpdateValidValue:A,onUserAction:H,value:D=""}=V,t=S(V,["componentId","required","form","enableFormSubmit","checkValidationAtFirst","onChange","onKeyDown","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","onUserAction","value"]),[r,i]=T(c.DefaultStatus(e.componentId||"",D)),[d,g]=T({ok:!1,notice:[]});return c.CommonEffects({type:"color",states:e,val_status:r,set_status:i,val_validate:d,set_validate:g,SystemValidation:R}),I(B,{val_status:r,set_status:i,val_validate:d,states:e,children:I(h,a({htmlTag:"input",type:"color","data-component-id":r.componentId,value:r.dataValue,className:k("Input"),onKeyDown:o=>{v&&v(o),l&&c.SubmitForm(o,p)},onChange:o=>{let{value:s}=o.target;d.ok&&g({ok:!1,notice:[]}),i(F=>n(a({},F),{dataValue:s,eventType:"update",eventID:m(),isInspected:!1})),y&&y(o)},onFocus:o=>{t!=null&&t.onFocus&&(t==null||t.onFocus(o)),i(s=>n(a({},s),{eventID:m(),isFocusing:!0}))},onBlur:o=>{t!=null&&t.onBlur&&(t==null||t.onBlur(o)),i(s=>n(a({},s),{eventID:m(),isFocusing:!1}))}},t))})},b=e=>{let u=n(a(n(a({},_(e)),{backgroundColor:"cloud",unitHeight:3}),e),{freeCSS:a({minWidth:108},e.freeCSS)});return I(x,{componentId:e.componentId,children:U,states:u})};export{b as Color,b as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{b as o,c as r,d as b}from"../../chunk-C5N2D3ZX.js";import{jsx as
|
|
1
|
+
import{b as o,c as r,d as b}from"../../chunk-C5N2D3ZX.js";import{jsx as c}from"react/jsx-runtime";import{UUID as g}from"jmini";import{useState as h}from"react";import{OptionalInputWrapper as w,BoxWrapper as _,CoreEffects as s,DefaultBoxishStyles as B}from"./core";import{Box as k}from"../../atoms";function F(t){let{value:e,states:u}=t,{required:m}=u,n=[];return m&&!e&&n.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"}),{ok:!n.filter(({type:p})=>p=="invalid").length,notice:n}}const H=t=>{let T=t,{componentId:e,tone:u,required:m,form:n,value:p,enableFormSubmit:S,checkValidationAtFirst:C,onInput:f,onKeyDown:I,onValidate:L,onValidateDelay:M,onUpdateValue:U,onUpdateValidValue:A,onUserAction:W,children:E="",leftIndicator:q,rightIndicator:K,leftIcon:G,rightIcon:N,freeCSS:O,wrapStyles:P}=T,V=b(T,["componentId","tone","required","form","value","enableFormSubmit","checkValidationAtFirst","onInput","onKeyDown","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","onUserAction","children","leftIndicator","rightIndicator","leftIcon","rightIcon","freeCSS","wrapStyles"]),[i,d]=h(s.DefaultStatus(e,p)),[l,y]=h({ok:!1,notice:[]});return s.CommonEffects({type:"contenteditable",states:t,val_status:i,set_status:d,val_validate:l,set_validate:y,SystemValidation:F}),c(_,{val_status:i,set_status:d,val_validate:l,states:t,children:c(k,r(o({contentEditable:!0,"data-show-validation":s.isShowValidation(l,i,!!C),"data-component-id":i.componentId,onKeyDown:a=>{I&&I(a),S&&s.SubmitForm(a,n)},onInput:a=>{let R=a.currentTarget,{innerHTML:z,innerText:x}=R;l.ok&&y({ok:!1,notice:[]}),d(D=>r(o({},D),{dataValue:x,eventType:"update",eventID:g(),isInspected:!1})),f&&f(a)}},V),{children:E}))})},v=t=>{t=r(o({rows:5},t),{freeCSS:o({whiteSpace:"pre-wrap"},t.freeCSS)});let e=B(t);return c(w,{componentId:t.componentId,children:H,states:e})};export{v as Contenteditable,v as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{b as t,c as s,d as V}from"../../chunk-C5N2D3ZX.js";import{jsx as D}from"react/jsx-runtime";import{useState as w}from"react";import K,{UUID as
|
|
1
|
+
import{b as t,c as s,d as V}from"../../chunk-C5N2D3ZX.js";import{jsx as D}from"react/jsx-runtime";import{useState as w}from"react";import K,{UUID as g}from"jmini";import{$$fromRoot as U,GenerateHTMLProps as W}from"../../@utils";import{OptionalInputWrapper as $,BoxWrapper as P,CoreEffects as R,DefaultBoxishStyles as q}from"./core";import{Flex as j}from"../../atoms";import{InputClasses as A}from"../../@styles/componentClasses";function z(e){let{value:a,states:u}=e,{required:d,numericOnly:p=!1,digits:C}=u,l=[];return d&&!a&&l.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"}),a&&(p&&a.match(/\D/)&&l.push({type:"invalid",label:"\u6570\u5B57\u306E\u307F\u3067\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"}),a.length!=C&&l.push({type:"warn",label:"\u6700\u5F8C\u307E\u3067\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"})),{ok:!l.filter(({type:S})=>S=="invalid"||S=="warn").length,notice:l}}const G=(e,a="")=>{let u=String(a),d=[];for(let p=0;p<e;p++)d[p]=u[p]||"";return{formatValue:d,dataValue:u}},B=(e="")=>{let a=e,u=a.join("");return{formatValue:a,dataValue:u}},J=e=>{let x=e,{tone:a,required:u,form:d,name:p,className:C="",digits:l,numericOnly:h=!1,enableFormSubmit:S,checkValidationAtFirst:Q,onChange:X,onKeyDown:Y,onValidate:Z,onValidateDelay:ee,onUpdateValue:te,onUpdateValidValue:ae,onUserAction:ne,value:N="",override:ie,freeCSS:re,wrapStyles:le,combineInput:oe,componentId:se,listStyles:_}=x,n=V(x,["tone","required","form","name","className","digits","numericOnly","enableFormSubmit","checkValidationAtFirst","onChange","onKeyDown","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","onUserAction","value","override","freeCSS","wrapStyles","combineInput","componentId","listStyles"]),[m,f]=w(s(t({componentId:e.componentId||""},G(l,N)),{eventType:"init",eventID:g()})),[v,k]=w({ok:!1,notice:[]});R.CommonEffects({type:"textfield",states:e,val_status:m,set_status:f,val_validate:v,set_validate:k,SystemValidation:z});let b=[];for(let i=0;i<l;i++){let E=m.formatValue[i],H={},T=C;e.combineInput&&(T=[C,A("DigitCharacterCell"),A("Combined")].join(" ")),b.push(D("input",{type:"text",inputMode:h?"numeric":e.inputMode||"text",value:E,id:"Digit-"+i+"-"+m.componentId,className:T,style:t(t({},e.style),H),onKeyDown:c=>{let{key:o,code:L}=c;if(o=="Tab")return;c.preventDefault();let y=null;if(o=="Backspace"){let r=m.formatValue;r[i]="",f(I=>s(t(t({},I),B(r)),{eventType:"update",eventID:g(),isInspected:!1})),y=i-1}else if(["ArrowLeft","ArrowRight"].includes(o)){let r=+(o=="ArrowRight")*2-1;y=i+r}else S&&R.SubmitForm(c,d),(()=>{let r=L.match(/^(Key(.)|Digit(\d)|Numpad(\d))/);if(!r)return;let I=r[2]||r[3]||r[4];if(h&&!I.match(/\d/)||!I)return;let F=m.formatValue;F[i]=I,f(O=>s(t(t({},O),B(F)),{eventType:"update",eventID:g(),isInspected:!1})),y=i+1})();K.is.exist(y)&&U("#Digit-"+y+"-"+m.componentId).focus()},onChange:()=>{},onFocus:c=>{n!=null&&n.onFocus&&(n==null||n.onFocus(c)),f(o=>s(t({},o),{eventID:g(),isFocusing:!0}))},onBlur:c=>{n!=null&&n.onBlur&&(n==null||n.onBlur(c)),f(o=>s(t({},o),{eventID:g(),isFocusing:!1}))}},i))}return D(P,{val_status:m,set_status:f,val_validate:v,states:e,children:D(j,s(t({gap:"1/2",flexChilds:"even",flexWrap:!1,flexSizing:"auto"},_),{children:b}))})},M=e=>{e=t({},e),e=t({textAlign:"center",width:0},e),e.combineInput&&(e=s(t({textAlign:"center",width:0},e),{freeCSS:t({minWidth:12*2,marginRight:-1},e.freeCSS),listStyles:t({borderRadius:"2.tone.secondary",border:"unset",gap:0},e.listStyles)}));let a=W(q(e));return D($,{componentId:e.componentId,children:J,states:a})};export{M as DigitCharacters,M as default};
|
package/dist/fn/Input/Filer.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{b as r,c as f,d as ee,e as j}from"../../chunk-C5N2D3ZX.js";import{Fragment as ie,jsx as a,jsxs as
|
|
1
|
+
import{b as r,c as f,d as ee,e as j}from"../../chunk-C5N2D3ZX.js";import{Fragment as ie,jsx as a,jsxs as d}from"react/jsx-runtime";import{useState as H,useEffect as te}from"react";import q,{UUID as v,useStore as le}from"jmini";import{$$fromRoot as D,ExtractStyles as pe}from"../../@utils";import{Box as S,FAI as R,Flex as P,Column as ae}from"../../atoms";import{Row as ue}from"../../mols";import{Button as L}from"../Button";import K from"../Snackbar";import{OptionalInputWrapper as de,BoxWrapper as ce,CoreEffects as ne,DefaultBoxishStyles as me}from"./core";import fe from"./TextField";import{InputFilerClasses as y}from"../../@styles/componentClasses";import{faCloudArrowUp as ge}from"@fortawesome/free-solid-svg-icons/faCloudArrowUp";function Se(e){let{value:t,states:o}=e,{required:c}=o,l=[];return c&&!t.length&&l.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"}),{ok:!l.filter(({type:p})=>p=="invalid").length,notice:l}}const oe={List:e=>{let{rootStates:t,val_status:o,set_status:c}=e;if(t.useSystemOnly)return null;let l=t.limit-(o.dataValue||[]).length,p=(o.dataValue||[]).map((n,u)=>a(oe.ListCell,f(r({},e),{index:u,val_file:n}),n.name));return l>0&&p.push(a(S,f(r({htmlTag:"label"},t.cellStyles),{className:[t.cellClassName,y("AddButton")].join(" "),"data-component-id":o.componentId,htmlFor:t.id,tabIndex:t.tabIndex,onKeyDown:n=>{let{key:u}=n;t.tabIndex!=-1&&[" ","Enter"].includes(u)&&D("#"+t.id).click()},children:d(ue.Center,{padding:["1/3",0],children:[a(S,{isRounded:!0,className:y("AddIcon"),children:a(R,{icon:ge,className:y("Icon"),fontColor:"theme",fontSize:"4.thirdTitle",backgroundColor:"theme.opa.low",ssSphere:3,padding:"1/2"})}),d(S,{children:[d(S,{fontColor:"theme",fontSize:"2.normal",isSemiBoldFont:!0,children:["\u30D5\u30A1\u30A4\u30EB\u3092\u9078\u629E(",l,")"]}),a(S,{fontColor:"4.thin",fontSize:"0.xs",isSemiBoldFont:!0,children:"\u30D5\u30A1\u30A4\u30EB\u3092\u30C9\u30ED\u30C3\u30D7"})]})]})}),"AddButton")),a(ae,f(r({flexSizing:"auto"},pe(t)),{className:t.className,children:p}))},ListCell:e=>{let{index:t,rootStates:o,val_file:c,val_status:l,set_status:p}=e,{name:n,size:u,type:i}=c,[m,b]=H(!1),I=v(),X=u.rank(),[Z,W]=n.replace(/\s/g,"_").replace(/(.*)\.(.*)$/,"$1 $2").split(" "),s="\u30D5\u30A1\u30A4\u30EB";return i.match(/image/)?s=i.replace(/image\//,""):i.match(/pdf/)?s="PDF":i.match(/csv/)?s="CSV":i.match(/spreadsheet/)?s="SpreadSheet":i.match(/presentation/)?s="PowerPoint":i.match(/word/)?s="Word":i.match(/zip/)?s="Zip":i.match(/powerpoint/)?s="PowerPoint":i.match(/html/)?s="HTML":i.match(/js/)?s="JavaScript":i.match(/css/)?s="CSS":i.match(/text\/plain/)&&(s="\u30C6\u30AD\u30B9\u30C8"),te(()=>{m&&setTimeout(()=>{D("#"+I).focus()},100)},[m]),d(P,f(r({verticalAlign:"center",flexWrap:!1,gap:1,className:o.cellClassName},o.cellStyles),{children:[a(R.File,{fontSize:"4.thirdTitle",fontColor:"4.thin"}),d(S,{flexSizing:0,children:[a(S,{children:a(P,{verticalAlign:"center",gap:"2/3",flexWrap:!1,className:y("FileName"),children:m?a(ie,{children:d(ae,{flexSizing:0,gap:"1/2",children:[d(P,{gap:"2/3",verticalAlign:"center",children:[a(fe,{tone:"border",wrapStyles:{flexSizing:"auto"},restrict:"fileName",name:"name",required:!0,id:I,form:"form-"+I,enableFormSubmit:!0,value:Z,onKeyDown:F=>{let{key:w}=F;w=="Escape"&&b(!1)}}),d(S,{children:[". ",W]})]}),d(P,{gap:"2/3",horizontalAlign:"right",flexWrap:!1,children:[a(L.Sub.S,{padding:["2/3",1],onClick:()=>{b(!1)},children:"\u9589\u3058\u308B"}),a(L.Prime.S,{padding:["2/3",1],onFormSubmit:["form-"+I,F=>j(void 0,null,function*(){let{name:w}=F.body,T=[...l.dataValue],A=T[t],G=A.id;if(!A)return;let k=yield A.convert();k=String(k);let M=yield k.toBlob(c.type);if(!M)return;let $=new File([M],w+"."+W,{type:A.type});$.id=G,T[t]=$,p(O=>f(r({},O),{dataValue:T,eventType:"update",eventID:v(),isInspected:!1})),b(!1)})],children:"\u6C7A\u5B9A"})]})]})}):d(ie,{children:[n,!!o.isNameEditable&&a(L.Clear,{ssSphere:2.5,flexSizing:"none",fontColor:"4.thin",padding:"1/3",ssEffectsOnActive:"expand",color:"cloud",onClick:()=>{b(!0)},children:a(R.Pen,{})})]})})}),!m&&d(S,{fontSize:"1.mini",fontColor:"4.thin",flexSizing:0,children:[s,"\u30D5\u30A1\u30A4\u30EB / ",X,"B"]})]}),a(L.Sub,{color:"cloud",fontColor:"4.thin",ssSphere:3,onClick:()=>{let F=[...l.dataValue];F[t]&&(F.splice(t,1),p(T=>f(r({},T),{dataValue:F,eventType:"update",eventID:v(),isInspected:!1})))},children:a(R.X,{})})]}))}},ye=e=>{let Y=e,{tone:t,required:o,form:c,isNameEditable:l,useSystemOnly:p,accept:n="*",limit:u=1,checkValidationAtFirst:i,onChange:m,onValidate:b,onValidateDelay:I,onUpdateValue:X,onUpdateValidValue:Z,onUserAction:W,value:s=[],className:F,cellStyles:w,cellClassName:T,componentId:A,status_id:G,enableFormSubmit:k,freeCSS:M,wrapStyles:$}=Y,O=ee(Y,["tone","required","form","isNameEditable","useSystemOnly","accept","limit","checkValidationAtFirst","onChange","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","onUserAction","value","className","cellStyles","cellClassName","componentId","status_id","enableFormSubmit","freeCSS","wrapStyles"]),[B,N]=H(ne.DefaultStatus(e.componentId||"",s)),[Q,se]=H({ok:!1,notice:[]}),re={rootStates:e,val_status:B,set_status:N};te(()=>{le.set({["AddFiles-"+B.componentId]:x=>{N(_=>{let C=_.dataValue,V=[];for(var g=0;g<(x==null?void 0:x.length);g++){let h=x[g],{type:E,name:z}=h;if(g+1+C.length>u){K.add({componentId:z,secondsToClose:12e3,children:`\u30D5\u30A1\u30A4\u30EB\u9078\u629E\u4E0A\u9650\u3092\u8D85\u3048\u305F\u305F\u3081\u3001${z}}\u306F\u8FFD\u52A0\u3067\u304D\u307E\u305B\u3093\u3002`,backgroundColor:"nega"});continue}if(n&&n=="image"&&!E.match(/image/)){K.add({componentId:z,secondsToClose:12e3,children:`\u30D5\u30A1\u30A4\u30EB\u5F62\u5F0F\u304C\u7570\u306A\u308B\u305F\u3081\u3001${z} \u306F\u8FFD\u52A0\u3067\u304D\u307E\u305B\u3093\u3002`,backgroundColor:"nega"});continue}V.push(h)}return f(r({},_),{dataValue:[...C,...V],eventType:"update",eventID:v(),isInspected:!1})})}})},[]),ne.CommonEffects({type:"file",states:e,val_status:B,set_status:N,val_validate:Q,set_validate:se,SystemValidation:Se});let U="";return n&&(n=="image"?U="image/png,image/jpeg":U=n),d(ce,{val_status:B,set_status:N,val_validate:Q,states:e,children:[a(S,f(r({htmlTag:"input",type:"file",className:y("Input"),"data-component-id":B.componentId,accept:U,multiple:u!=1,onChange:x=>j(void 0,null,function*(){m&&m(x);let _=x.target,C=_.files,V=[];for(var g=0;g<(C==null?void 0:C.length);g++){if(!C[g])continue;let h=C[g].clone(),E=h.name;if(h.id=v(),g+1+B.dataValue.length>u){K.add({componentId:E,secondsToClose:12e3,children:`\u30D5\u30A1\u30A4\u30EB\u767B\u9332\u6570\u3092\u8D85\u3048\u305F\u305F\u3081\u3001${E}}\u306F\u8FFD\u52A0\u3067\u304D\u307E\u305B\u3093\u3067\u3057\u305F\u3002`,backgroundColor:"nega"});continue}V.push(h)}N(h=>f(r({},h),{dataValue:[...h.dataValue,...V],eventType:"update",eventID:v(),isInspected:!1})),_.value=""})},O),{opacity:"low",tabIndex:-1,value:""})),a(oe.List,r({},re))]})},J=e=>(e=f(r({limit:1,isNameEditable:!0,useSystemOnly:!1,tone:"border",value:[]},e),{override:"force",cellStyles:r(r({},me({tone:e.tone||"border"})),e.cellStyles)}),a(de,{componentId:e.componentId,children:ye,states:e}));J.fn={openDialog:e=>{let{multiple:t,accept:o}=e,c=v();const l=document.createElement("input");l.type="file",l.multiple=!!t,l.value="",l.id=c,o&&(o=="image"?l.accept="image/png,image/jpeg,image/jpg,image/webp":l.accept=o),q("body").append(l),l.onchange=p=>{var i;let n=((i=p==null?void 0:p.target)==null?void 0:i.files)||[];if(!(n!=null&&n.length))return;let u=[];for(let m=0;m<n.length;m++){let I=n[m].clone();u.push(I)}e.onChange(u),q("#"+c).remove()},l.click()}},typeof window!="undefined"&&window.document&&q(document).addEvent({eventType:"dragover",callback:e=>{e.preventDefault(),D("."+y("AddButton")).addClass(y("Draggable"))},options:{passive:!1}}).addEvent({eventType:"drop",callback:e=>{e.preventDefault(),D("."+y("AddButton")).removeClass(y("Draggable"));let t=e.dataTransfer.files;if(t.length){let o=e.target;if(D(o).hasClass(y("AddButton"))){let{componentId:c}=o.dataset,l=le.get("AddFiles-"+c);l&&l(t)}}},options:{passive:!1}});export{J as Filer,J as default};
|
package/dist/fn/Input/Hidden.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{b as n,c as a,d}from"../../chunk-C5N2D3ZX.js";import{jsx as m}from"react/jsx-runtime";import
|
|
1
|
+
import{b as n,c as a,d as u}from"../../chunk-C5N2D3ZX.js";import{jsx as m}from"react/jsx-runtime";import d,{UUID as p}from"jmini";import{useState as r,useEffect as b}from"react";import{OptionalInputWrapper as V,CoreEffects as g}from"./core";const D=e=>{let s=e,{componentId:c="",enableFormSubmit:H,form:S,value:t=""}=s,I=u(s,["componentId","enableFormSubmit","form","value"]),[o,i]=r({componentId:e.componentId||"",dataValue:t,eventType:"init",eventID:p()}),[f,v]=r({ok:!1,notice:[]});return b(()=>{d.is.equal(o.dataValue,t)||i(y=>a(n({},y),{dataValue:t,eventType:"update",eventID:p(),isInspected:!1}))},[e.value]),g.CommonEffects({type:"hidden",states:e,val_status:o,set_status:i,val_validate:f,set_validate:v,SystemValidation:()=>({ok:!0,notice:[]})}),m("input",a(n({value:d.Stringify(t),"data-component-id":c},I),{type:"hidden"}))},l=e=>m(V,{componentId:e.componentId,children:D,states:e});export{l as Hidden,l as default};
|
package/dist/fn/Input/List.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{b as o,c as
|
|
1
|
+
import{b as o,c as p,d as B}from"../../chunk-C5N2D3ZX.js";import{jsx as i}from"react/jsx-runtime";import C,{UUID as w}from"jmini";import{useState as ae}from"react";import{$$fromRoot as ne,GenerateHTMLProps as se}from"../../@utils";import{Box as T,Flex as re,FAI as ce,Span as de}from"../../atoms";import{Button as ue}from"../Button";import{OptionalInputWrapper as pe,BoxWrapper as me,CoreEffects as M}from"./core";import{InputListClasses as b}from"../../@styles/componentClasses";function Ce(t){let{value:l,states:a}=t,{type:e,required:s,min:n,max:m}=a;n=n||0,m=m||65535;let c=[],f=l.length;return s&&(f||e=="radio"&&c.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"})),f<n&&c.push({type:"invalid",label:n+"\u500B\u4EE5\u4E0A\u9078\u629E\u3057\u3066\u304F\u3060\u3055\u3044"}),f>m&&c.push({type:"invalid",label:m+"\u500B\u307E\u3067\u9078\u629E\u3067\u304D\u307E\u3059"}),{ok:!c.filter(({type:V})=>V=="invalid").length,notice:c}}const h={InitOptions:t=>{let l=[];return t.forEach(a=>{if(!a)return;let{label:e,value:s}=a;C.is.nullish(e)&&(e=String(s)),l.push(p(o({},a),{label:e,value:s}))}),l},OptionalListWrapper:t=>{let{value:l,options:a=[]}=t,e=C.is.exist(l)?C.flatArray(l):[],s=[];return e.forEach(n=>{a.findIndex(c=>C.is.equal(c.value,n))!=-1&&s.push(n)}),i(h.Core,p(o({},t),{value:s,options:a}))},Core:t=>{let S=t,{type:l,tone:a,required:e,componentId:s="",form:n,override:m,icon:c,iconType:f,iconSize:V,iconPosition:P,iconColor:v,CustomIcon:X,enableFormSubmit:A,checkValidationAtFirst:$,onValidate:U,onValidateDelay:R,onUpdateValue:W,onUpdateValidValue:H,onUserAction:q,value:y,options:K,className:j,cellStyles:G,cellClassName:Q,cellCheckedStyles:Y,cellCheckedClassName:Z,min:D,max:d,hideInput:N,freeCSS:x,wrapStyles:ee}=S,L=B(S,["type","tone","required","componentId","form","override","icon","iconType","iconSize","iconPosition","iconColor","CustomIcon","enableFormSubmit","checkValidationAtFirst","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","onUserAction","value","options","className","cellStyles","cellClassName","cellCheckedStyles","cellCheckedClassName","min","max","hideInput","freeCSS","wrapStyles"]),[k,O]=ae(M.DefaultStatus(s,y)),[_,E]=ae({ok:!1,notice:[]});return M.CommonEffects({type:"list."+l,states:t,val_status:k,set_status:O,val_validate:_,set_validate:E,SystemValidation:Ce}),i(me,{val_status:k,set_status:O,val_validate:_,states:t,children:i(h.List,{rootStates:t,val_status:k,set_status:O})})},List:t=>{let{rootStates:l,val_status:a,set_status:e}=t,{componentId:s,type:n,tone:m,icon:c,iconSize:f,iconColor:V,isChecker:P,options:v,name:X,form:A,tabIndex:$,hideInput:U,disabled:R,className:W,cellStyles:H,cellClassName:q="",cellCheckedStyles:y,cellCheckedClassName:K="",enableFormSubmit:j}=l,{dataValue:G}=a,Q=l.CustomIcon,Y=v.map((Z,D)=>{let le=Z,{value:d,label:N,disabled:x,className:ee="",checkedStyles:L,checkedClassName:k="",freeCSS:O}=le,_=B(le,["value","label","disabled","className","checkedStyles","checkedClassName","freeCSS"]),E=w(),S=G.findIndex(r=>r===d||C.is.equal(r,d))!=-1,I=o(o({},H),_),z=[b("Label"),q,ee];S&&(I=p(o(o(o({},I),y),L),{freeCSS:o(o(o({},I==null?void 0:I.freeCSS),y==null?void 0:y.freeCSS),L==null?void 0:L.freeCSS)}),z=[...z,K,k]);const te=()=>{if(R||x)return;let r=[];if(n=="radio")r=[d];else if(n=="checkbox"||P)if(!S)r=[...a.dataValue,d];else{let u=[...a.dataValue];u.splice(a.dataValue.findIndex(F=>F==d),1),r=u}e(u=>p(o({},u),{dataValue:r,eventType:"update",eventID:w(),isInspected:!1}))};let oe=[i(de,{position:"relative",freeCSS:{zIndex:2},flexSizing:0,children:C.is.string(N)?i(T,{children:N}):N},"content")];return c&&oe[l.iconPosition=="right"?"push":"unshift"](i(Q,{isChecked:S,iconSize:f,iconColor:V,toggle:te},"icon")),[i(T,{htmlTag:"input",type:n=="radio"?"radio":"checkbox",className:b("Input"),name:"RadioCheckbox-"+X,"data-list-index":s+"-"+D,id:E,value:String(d),disabled:R||x,checked:S,onFocus:r=>{x||n=="radio"&&(a.dataValue.length||e(u=>p(o({},u),{dataValue:[d],eventType:"update",eventID:w(),isInspected:!1})))},onChange:()=>{te()},onKeyDown:r=>{let{key:u,shiftKey:F}=r;if((n=="checkbox"||t.rootStates.isChecker)&&u!="Tab"){if(u.match(/Arrow/)){r.preventDefault();let ie=["ArrowLeft","ArrowUp"].includes(u)?-1:1,g=D+ie;g<0?g=v.length-1:g>=v.length&&(g=0),ne(`input[data-list-index="${s}-${g}"]`).focus()}}j&&M.SubmitForm(r,A)},tabIndex:$},"List-"+C.Stringify(d)),i(T,p(o({htmlTag:"label","data-disabled":R||x,htmlFor:E,className:z.join(" "),tabIndex:-1,display:"flex",verticalAlign:"center",flexWrap:!1},I),{children:oe}),"ListTrigger-"+C.Stringify(d))]});return i(re,{flexSizing:"auto",style:l.style,freeCSS:o({},l.freeCSS),className:[W,b("CellBase"),b("HideInput_"+U),b("IconIndicator_"+!!c),b("Tone_"+m)].join(" "),children:Y})},_Icon:t=>{let l=1.5;return t.iconSize=="small"?l=1.2:t.iconSize=="large"&&(l=2),i(ue.Normal,{ssPushable:!0,color:"cloud",tabIndex:-1,ssEffectsOnActive:"ripple.cloud",ssSphere:2,freeCSS:{transform:`scale(${l})`},onClick:a=>{a.preventDefault(),a.stopPropagation(),t.toggle()},children:t.children})},RadioIcon:t=>i(h._Icon,p(o({type:"radio"},t),{children:i(T,{flexCenter:!0,isRounded:!0,border:t.isChecked?"0.trans":"3.thick",borderColor:t.isChecked?t.iconColor:"3.thick",position:"relative",transition:"middle",freeCSS:{width:"50%",height:"50%"},children:i(T,{position:"absolute",transition:"middle",isRounded:!0,backgroundColor:t.iconColor,opacity:t.isChecked?"max":"trans",freeCSS:{width:"60%",height:"60%",transform:t.isChecked?"scale(1)":"scale(.4)"}})})})),CheckboxIcon:t=>i(h._Icon,p(o({type:"checkbox"},t),{children:i(T,{flexCenter:!0,boxShadow:t.isChecked?"0.remark":"none",border:t.isChecked?"0.trans":"3.thick",backgroundColor:t.isChecked?t.iconColor:"trans",position:"relative",transition:"middle",fontColor:"white",freeCSS:{borderRadius:"25%",padding:"4%",width:"50%",height:"50%"},children:i(ce.Check,{transition:"middle",opacity:t.isChecked?"max":"trans",freeCSS:{zIndex:8,width:"100%",height:"100%",transform:t.isChecked?"scale(1)":"scale(.5)"}})})}))},J=t=>{t=t||"checkbox";const l=e=>(e=p(o({gap:1,icon:!0,iconSize:"regular",iconType:t=="radio"?"radio":"checkbox",iconPosition:"left",iconColor:"theme"},e),{type:t,cellStyles:o({gap:"1/6",position:"relative",borderRadius:"2.tone.secondary",transition:"middle"},e.cellStyles)}),e.CustomIcon||(e.iconType=="radio"?e.CustomIcon=h.RadioIcon:e.iconType=="checkbox"&&(e.CustomIcon=h.CheckboxIcon)),e.iconSize=="small"?e.cellStyles.gap=0:e.iconSize=="large"&&(e.cellStyles.gap="1/2"),e.tone=="normal"?(e.cellStyles=o({padding:["1/4",1],border:"1.thin",backgroundColor:"layer.1"},e.cellStyles),e.cellCheckedStyles=o({borderColor:"theme",fontColor:"theme",boxShadow:"1.normal"},e.cellCheckedStyles)):e.tone=="border"?(e.cellStyles=o({border:"1.thin",backgroundColor:"layer.1",padding:["1/2",1,"1/2","1/2"]},e.cellStyles),e.cellCheckedStyles=o({borderColor:"theme",fontColor:"theme"},e.cellCheckedStyles)):e.tone=="cloud"&&(e.cellStyles=o({border:"1.thin",backgroundColor:"layer.2",padding:["1/2",1,"1/2","1/2"]},e.cellStyles),e.cellCheckedStyles=o({backgroundColor:"cloud",fontColor:"theme"},e.cellCheckedStyles)),e=se(e),e.options=h.InitOptions(e.options),i(pe,{componentId:e.componentId,children:h.OptionalListWrapper,states:e})),a=l;return a.Normal=e=>i(l,o({type:t,tone:"normal",icon:!1},e)),a.Border=e=>i(l,o({type:t,tone:"border"},e)),a.Cloud=e=>i(l,o({type:t,tone:"cloud"},e)),a.Vivid=e=>i(l,o({type:t,tone:"normal",icon:!1,cellCheckedStyles:{backgroundColor:"theme",fontColor:"white"}},e)),a.Simple=e=>i(l,o({type:t,tone:"plain",icon:!1,cellCheckedStyles:{fontColor:"theme"}},e)),a},he=J("radio"),Se=J("checkbox"),fe=J();export{Se as Checkbox,fe as List,he as Radio};
|
package/dist/fn/Input/Select.js
CHANGED
|
@@ -1 +1 @@
|
|
|
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
|
+
import{b as n,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:o,options:i}=l,v=[];return o&&t===null&&v.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"}),{ok:!v.filter(({type:S})=>S=="invalid").length,notice:v}}const ae={FilterSelectableOptions:(e,t)=>{let l=e.rootStates.options;return t||(l=l.filter(o=>(o==null?void 0:o.type)!="label")),l}},V={Shallow:e=>{let{rootStates:t,val_status:l}=e,o=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(n({className:t.className},o),{position:"absolute",width:1,freeCSS:u(n({},o.freeCSS),{color:"orange"}),children:a(_,{"data-input-value-shallow":l.componentId,children:"A"})}))})},Button:e=>O(J,{children:[a(V.LegacySelector,n({},e)),a(V.Original,n({},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:o,val_optionFocused:i,set_optionFocused:v,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:oe,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: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 c="select-click-"+t.componentId;if(g){if(!d('[data-input-origin="'+t.componentId+'"]'))return;d(document).addEvent({eventID:c,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([c])},[g]),$(()=>{if(e.rootStates.SelectorMode!="original"||p.eventType=="init"||!g)return;let c=d('[data-input-origin="'+t.componentId+'"]');c&&c.focus()},[p.dataValue]),e.rootStates.SelectorMode!="original"?null:O(J,{children:[a(_,u(n({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:c=>{if(r!=null&&r.onFocus&&(r==null||r.onFocus(c)),b(m=>u(n({},m),{eventID:C(),isFocusing:!0})),!t.disabled){if(l)return o(!1);f(!0)}},onBlur:c=>{r!=null&&r.onBlur&&(r==null||r.onBlur(c)),b(m=>u(n({},m),{eventID:C(),isFocusing:!1}))},onClick:c=>{r!=null&&r.onClick&&(r==null||r.onClick(c)),!t.disabled&&f(!0)},onKeyDown:c=>{let{key:m,metaKey:s,ctrlKey:D}=c,w=s||D;if(r!=null&&r.onKeyDown&&(r==null||r.onKeyDown(c)),P&&k.SubmitForm(c,x),!t.disabled){if(d.scope(()=>{if(!["ArrowDown","ArrowUp"].includes(m))return;if(c.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=>u(n({},h),{dataValue:null,eventType:"update",eventID:C(),isInspected:!1}));else if(m==" ")c.preventDefault(),f(!0);else if(m=="Enter"){if(!g)return f(!0);c.preventDefault();let h=t.options.find(y=>(y==null?void 0:y.id)==i);if(!h)return;b(y=>u(n({},y),{dataValue:h==null?void 0:h.value,eventType:"update",eventID:C(),isInspected:!1})),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,n({},e)),a(V.Selected,n({},e))]})]})})),g&&a(V.Selector,n({},e))]})},LegacySelector:e=>{let{rootStates:t,val_preventOpenSelectorOnFocus:l,set_preventOpenSelectorOnFocus:o,val_optionFocused:i,set_optionFocused:v,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:oe,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:ve,rightIcon:ye,componentId:ge,status_id:be,wrapStyles:Ie,SelectedCellStyles:he,SelectorCellStyles:Ce,SelectorMode:_e,SelectorStyles:r,SelectorPosition:U}=m,c=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(n({htmlTag:"select",tabIndex:0},c),{"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:s=>{N&&N(s),P&&k.SubmitForm(s,x)},onChange:s=>{let{value:D}=s.target;S.ok&&I({ok:!1,notice:[]}),b(w=>u(n({},w),{dataValue:D,eventType:"update",eventID:C(),isInspected:!1})),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 o;$(()=>{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(_,u(n({},l),{children:a(xe.Body,u(n({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:n({minWidth:12*6,maxHeight:12*24},(o=e.rootStates.SelectorStyles)==null?void 0:o.freeCSS),children:O(Te,{gap:"1/12",padding:[1,0],children:[t.map((i,v)=>{if(!i)return null;let{type:S,value:I}=i,p=e.val_optionFocused==i.id,b=e.val_status.dataValue===I;return S=="label"?a(_,{children:i.label||i.value},C()):a(Fe.Sub.S,u(n({"data-select-input-value":i.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(n({},f),{dataValue:I,eventType:"update",eventID:C(),isInspected:!1})),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(o=>d.is.equal(o==null?void 0:o.value,e.val_status.dataValue));l&&t.push(a(_,u(n({},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,o]=A(k.DefaultStatus(e.componentId,t)),[i,v]=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:i,set_preventOpenSelectorOnFocus:v,val_optionFocused:p,set_optionFocused:b,val_selectorOpen:S,set_selectorOpen:I,val_status:l,set_status:o,val_validate:g,set_validate:f};return k.CommonEffects({type:"select",states:e,val_status:l,set_status:o,val_validate:g,set_validate:f,SystemValidation:Be}),O(we,{val_status:l,set_status:o,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,n({},E)),a(V.Button,n({},E))]})}},ne=e=>{var l;let t=n({},e);return t=u(n({emptySelect:!0,SelectorMode:"original",SelectorPosition:3},t),{freeCSS:n({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((o,i)=>{if(!o)return;let{type:v,value:S,searchValue:I}=o,p=I||d.is.string(S)&&S||d.Stringify(S||"")||"";t.options[i]=u(n({id:C()},o),{value:S,searchValue:p,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{ne as Select,ne as default};
|
package/dist/fn/Input/Slider.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{b,c as h,d as B}from"../../chunk-C5N2D3ZX.js";import{jsx as p,jsxs as U}from"react/jsx-runtime";import L,{UUID as x}from"jmini";import{useState as k,useEffect as $}from"react";import{$$fromRoot as C,GenerateHTMLProps as q}from"../../@utils";import{Box as w,Flex as A,Column as O}from"../../atoms";import{Button as G}from"../Button";import{OptionalInputWrapper as X,BoxWrapper as j,CoreEffects as F}from"./core";import{InputSliderClasses as m}from"../../@styles/componentClasses";function J(t){let{value:e,states:o}=t,{required:s}=o,n=[];return s&&!e&&n.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"}),{ok:!n.filter(({type:i})=>i=="invalid").length,notice:n}}const z=t=>{let{value:e,val_status:o}=t,{min:s,max:n,step:i}=o;e=Math.max(e,s),e=Math.min(e,n);let a=e/n*n;return a=Math.round(a/i),{stepValue:a*i,stepIndex:a,positionLeft:a*i/n*100+"%"}},N={IndicatorLabels:t=>{let{componentId:e,min:o,max:s,step:n,customLegends:i}=t,u=[],a=Math.round(o/n),r=Math.round(s/n),c=r-a+1;for(var d=a;d<=r;d++){let l=d*n;l=Math.max(l,o),l=Math.min(l,s);let S=l/s*100+"%";u.push(p(w,{className:m("Label"),id:"Legend-"+e+"-"+d,display:d==a||d==r?"flex":"none",position:"absolute",top:0,unitHeight:1,unitWidth:1.5,transition:"middle",fontColor:"1.clear",verticalAlign:"center",horizontalAlign:"center",freeCSS:{left:S,whiteSpace:"nowrap",textAlign:"center"},children:i?i(l):l.rank()},l))}return $(()=>{const l=()=>{let S=C("#Labels-"+e),{width:f}=S.position(),R=Math.round(f/50)-1,
|
|
1
|
+
import{b,c as h,d as B}from"../../chunk-C5N2D3ZX.js";import{jsx as p,jsxs as U}from"react/jsx-runtime";import L,{UUID as x}from"jmini";import{useState as k,useEffect as $}from"react";import{$$fromRoot as C,GenerateHTMLProps as q}from"../../@utils";import{Box as w,Flex as A,Column as O}from"../../atoms";import{Button as G}from"../Button";import{OptionalInputWrapper as X,BoxWrapper as j,CoreEffects as F}from"./core";import{InputSliderClasses as m}from"../../@styles/componentClasses";function J(t){let{value:e,states:o}=t,{required:s}=o,n=[];return s&&!e&&n.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"}),{ok:!n.filter(({type:i})=>i=="invalid").length,notice:n}}const z=t=>{let{value:e,val_status:o}=t,{min:s,max:n,step:i}=o;e=Math.max(e,s),e=Math.min(e,n);let a=e/n*n;return a=Math.round(a/i),{stepValue:a*i,stepIndex:a,positionLeft:a*i/n*100+"%"}},N={IndicatorLabels:t=>{let{componentId:e,min:o,max:s,step:n,customLegends:i}=t,u=[],a=Math.round(o/n),r=Math.round(s/n),c=r-a+1;for(var d=a;d<=r;d++){let l=d*n;l=Math.max(l,o),l=Math.min(l,s);let S=l/s*100+"%";u.push(p(w,{className:m("Label"),id:"Legend-"+e+"-"+d,display:d==a||d==r?"flex":"none",position:"absolute",top:0,unitHeight:1,unitWidth:1.5,transition:"middle",fontColor:"1.clear",verticalAlign:"center",horizontalAlign:"center",freeCSS:{left:S,whiteSpace:"nowrap",textAlign:"center"},children:i?i(l):l.rank()},l))}return $(()=>{const l=()=>{let S=C("#Labels-"+e),{width:f}=S.position(),R=Math.round(f/50)-1,g=Math.round(c/R);for(let v=a+1;v<r;v++)C("#Legend-"+e+"-"+v).css({display:v%g==0?"flex":"none"})};return L(window).addEvent({eventID:"SliderResizeCallback-"+e,eventType:"resize",callback:()=>{l()}}),l(),()=>{L(window).removeEvent("SliderResizeCallback-"+e)}},[]),p(A,{className:m("Labels"),verticalAlign:"center",horizontalAlign:"between",fontSize:"0.xs",position:"relative",unitHeight:1,id:"Labels-"+e,children:p(w,{position:"absolute",top:0,left:0,bottom:0,freeCSS:{right:12*1.5},children:u})})},Rail:t=>{let{val_status:e,set_status:o,DotData:s,form:n,enableFormSubmit:i}=t,{componentId:u}=e;return U(A,{className:m("Rail"),position:"relative",paddingLeft:"1/2",unitHeight:1.5,verticalAlign:"center",freeCSS:{zIndex:1,cursor:"pointer"},onPointerDown:a=>{t.rootStates.disabled||(a.stopPropagation(),y.Effects.Start(a,{val_status:e,set_status:o,DotData:s}))},children:[p(w,{className:m("Bar"),backgroundColor:"layer.4",position:"relative",borderRadius:"1.tone.primary",transition:"middle",flexSizing:"none",unitHeight:"2/3",width:1,id:u+"_Bar",children:p(w,{className:m("BarColor"),position:"relative",height:1,width:0,left:0,transition:"long",borderRadius:"inherit",backgroundColor:t.color,opacity:"middle",overflow:"hidden",freeCSS:{width:s.positionLeft},id:u+"_BarColor"})}),p(w,{className:m("BallWrap"),position:"absolute",top:0,left:0,bottom:0,freeCSS:{right:12*1.5},children:p(G.Plain,{className:m("Ball"),position:"absolute",boxShadow:"1.remark",backgroundColor:t.color,top:0,left:0,ssSquare:1.5,borderRadius:"1.tone.primary",freeCSS:{zIndex:2,left:s.positionLeft},id:u+"_Ball",onKeyDown:a=>{y.KeyDownEvent({event:a,val_status:e,set_status:o,DotData:s}),i&&F.SubmitForm(a,n)},onFocus:a=>{o(r=>h(b({},r),{eventID:x(),isFocusing:!0}))},onBlur:a=>{o(r=>h(b({},r),{eventID:x(),isFocusing:!1}))}})})]})}},y={Effects:{Start:(t,e)=>{L(document).addEvent({eventID:"SliderMouseMove",eventType:"mousemove",callback:o=>{y.Effects.Move(o,e)},options:{passive:!1}}).addEvent({eventID:"SliderTouchMove",eventType:"touchmove",callback:o=>{y.Effects.Move(o,e)},options:{passive:!1}}).addEvent({eventID:"SliderMouseUp",eventType:"mouseup",callback:()=>{y.Effects.End()}}).addEvent({eventID:"SliderTouchEnd",eventType:"touchend",callback:()=>{y.Effects.End()}})},Move:(t,e)=>{let o=L.getCursor(t).x,{val_status:s,set_status:n}=e,{componentId:i,min:u,max:a}=s,r=C("#"+i+"_Ball"),c=C("#"+i+"_Bar"),d=C("#"+i+"_BarColor"),{width:l,left:S}=c.position(),f=(o-S)/l;f=Math.max(f,0),f=Math.min(f,1);let R=f*a,g=z({value:R,val_status:s}),v=g.positionLeft,T=g.stepValue;return r.css({left:v}),d.css({width:v}),n(D=>{let E=D.dataValue;return T==E?D:h(b({},D),{dataValue:T,eventType:"update",eventID:x(),isInspected:!1})}),t.preventDefault(),t.stopPropagation(),!1},End:()=>{L(document).removeEvent(["SliderMouseMove","SliderTouchMove","SliderMouseUp","SliderTouchEnd"])}},KeyDownEvent:t=>{let{event:e,val_status:o,set_status:s}=t,{min:n,max:i,step:u}=o,{key:a,metaKey:r,ctrlKey:c}=e,d=c||r,l=o.dataValue;a.match(/Arrow/)&&(e.preventDefault(),a.match(/Left|Up/)?d?l=n:l-=u:a.match(/Right|Down/)&&(d?l=i:l+=u),l=Math.max(Math.min(l,i),n),s(S=>h(b({},S),{dataValue:l,eventType:"update",eventID:x(),isInspected:!1})))}},Q=t=>{let V=t,{color:e="theme",required:o,form:s="",legends:{enable:n=!0,custom:i,showAlways:u=!1}={},min:a,max:r,step:c,enableFormSubmit:d,checkValidationAtFirst:l,onValidate:S,onValidateDelay:f,onUpdateValue:R,onUpdateValidValue:g,onUserAction:v,value:T="",className:D,wrapStyles:E}=V,W=B(V,["color","required","form","legends","min","max","step","enableFormSubmit","checkValidationAtFirst","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","onUserAction","value","className","wrapStyles"]),[I,_]=k({componentId:t.componentId||"",dataValue:T,min:a,max:r,step:c,eventType:"init",eventID:x()}),[M,K]=k({ok:!1,notice:[]});F.CommonEffects({type:"slider",states:t,val_status:I,set_status:_,val_validate:M,set_validate:K,SystemValidation:J});let P=z({value:I.dataValue,val_status:I});return p(j,{val_status:I,set_status:_,val_validate:M,states:t,children:U(O,h(b({gap:"1/2",flexSizing:"auto"},W),{className:[m("Wrap"),D,m("ShowLegendsAlways_"+u)].join(" "),children:[p(N.Rail,{rootStates:t,color:e,val_status:I,set_status:_,DotData:P,form:s,enableFormSubmit:d}),!!n&&p(N.IndicatorLabels,{componentId:I.componentId,min:a,max:r,step:c,customLegends:i})]}))})},H=t=>{let e=h(b({},t),{freeCSS:b({minWidth:120},t.freeCSS)});return p(X,{componentId:t.componentId,children:Q,states:q(e)})};export{H as Slider,H as default};
|
package/dist/fn/Input/Switch.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{b as o,c as l,d as D}from"../../chunk-C5N2D3ZX.js";import{jsx as a,jsxs as z}from"react/jsx-runtime";import{UUID as S}from"jmini";import{useState as M}from"react";import I from"../../atoms/Box";import{Row as U}from"../../mols";import{Label as A}from"../Button";import{OptionalInputWrapper as W,BoxWrapper as P,CoreEffects as N}from"./core";import{InputSwitchClasses as g}from"../../@styles/componentClasses";function H(e){let{value:n,states:s}=e,{required:x}=s,r=[];return x&&!n&&r.push({type:"invalid",label:"ON\u306B\u306A\u3063\u3066\u3044\u307E\u305B\u3093"}),{ok:!r.filter(({type:f})=>f=="invalid").length,notice:r}}const O=e=>{let B=e,{componentId:n,color:s="posi",required:x,form:r,id:f,enableFormSubmit:E,checkValidationAtFirst:q,onChange:F,onKeyDown:T,onValidate:K,onValidateDelay:$,onUpdateValue:G,onUpdateValidValue:J,onUserAction:Q,size:R="regular",value:L="",icon:V="",isApply:p=!1}=B,t=D(B,["componentId","color","required","form","id","enableFormSubmit","checkValidationAtFirst","onChange","onKeyDown","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","onUserAction","size","value","icon","isApply"]),[u,c]=M({componentId:e.componentId||"",dataValue:L,eventType:"init",eventID:S()}),[v,k]=M({ok:!1,notice:[]}),d=!!u.dataValue;N.CommonEffects({type:"switch",states:e,val_status:u,set_status:c,val_validate:v,set_validate:k,SystemValidation:H});let y="middle",w=5,C=3;return p&&(C=4),z(P,{val_status:u,set_status:c,val_validate:v,states:e,children:[a(I,l(o({htmlTag:"input",type:"checkbox","data-component-id":u.componentId,checked:u.dataValue,className:g("Input"),id:f,onKeyDown:i=>{T&&T(i),E&&N.SubmitForm(i,r)},onChange:i=>{let{checked:m}=i.target;v.ok&&k({ok:!1,notice:[]}),c(_=>l(o({},_),{dataValue:m,eventType:"update",eventID:S()})),F&&F(i)}},t),{onFocus:i=>{t!=null&&t.onFocus&&(t==null||t.onFocus(i)),c(m=>l(o({},m),{eventID:S(),isFocusing:!0}))},onBlur:i=>{t!=null&&t.onBlur&&(t==null||t.onBlur(i)),c(m=>l(o({},m),{eventID:S(),isFocusing:!1}))}})),a(A.Plain,{tabIndex:-1,htmlFor:f,padding:"1/4",transition:y,borderRadius:"1.tone.primary",className:g("Label"),children:a(I,l(o({},p?{padding:"1/4",isRounded:!0,backgroundColor:d?s:"layer.3"}:{}),{children:z(U.Center,{unitHeight:R=="small"?2:R=="regular"?2.5:R=="large"?3:0,position:"relative",freeCSS:{aspectRatio:(w+C)/w},children:[!p&&a(I,{position:"absolute",backgroundColor:d?s:"layer.5",isRounded:!0,transition:y,width:1,opacity:"middle",className:g("Bar"),freeCSS:{height:"40%"}}),a(I,{position:"absolute",top:0,backgroundColor:!p&&d?s:"white",transition:y,isRounded:!0,flexCenter:!0,boxShadow:"1.remark",className:g("Dot"),freeCSS:{height:"100%",aspectRatio:"1",left:d?`calc(${C.ratio(w+C)}%)`:0},children:V&&a(I,{transition:y,flexCenter:!0,fontColor:d?p?s:"white":"6.clear",children:V})})]})}))})]})},b=e=>{let n=o({},e);return n.value=!!n.value,n.color=n.color||"theme",a(W,{componentId:n.componentId,children:O,states:n})},h=b;h.S=e=>a(b,l(o({},e),{size:"small"})),h.R=e=>a(b,l(o({},e),{size:"regular"})),h.L=e=>a(b,l(o({},e),{size:"large"}));export{h as Switch,h as default};
|
|
1
|
+
import{b as o,c as l,d as D}from"../../chunk-C5N2D3ZX.js";import{jsx as a,jsxs as z}from"react/jsx-runtime";import{UUID as S}from"jmini";import{useState as M}from"react";import I from"../../atoms/Box";import{Row as U}from"../../mols";import{Label as A}from"../Button";import{OptionalInputWrapper as W,BoxWrapper as P,CoreEffects as N}from"./core";import{InputSwitchClasses as g}from"../../@styles/componentClasses";function H(e){let{value:n,states:s}=e,{required:x}=s,r=[];return x&&!n&&r.push({type:"invalid",label:"ON\u306B\u306A\u3063\u3066\u3044\u307E\u305B\u3093"}),{ok:!r.filter(({type:f})=>f=="invalid").length,notice:r}}const O=e=>{let B=e,{componentId:n,color:s="posi",required:x,form:r,id:f,enableFormSubmit:E,checkValidationAtFirst:q,onChange:F,onKeyDown:T,onValidate:K,onValidateDelay:$,onUpdateValue:G,onUpdateValidValue:J,onUserAction:Q,size:R="regular",value:L="",icon:V="",isApply:p=!1}=B,t=D(B,["componentId","color","required","form","id","enableFormSubmit","checkValidationAtFirst","onChange","onKeyDown","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","onUserAction","size","value","icon","isApply"]),[u,c]=M({componentId:e.componentId||"",dataValue:L,eventType:"init",eventID:S()}),[v,k]=M({ok:!1,notice:[]}),d=!!u.dataValue;N.CommonEffects({type:"switch",states:e,val_status:u,set_status:c,val_validate:v,set_validate:k,SystemValidation:H});let y="middle",w=5,C=3;return p&&(C=4),z(P,{val_status:u,set_status:c,val_validate:v,states:e,children:[a(I,l(o({htmlTag:"input",type:"checkbox","data-component-id":u.componentId,checked:u.dataValue,className:g("Input"),id:f,onKeyDown:i=>{T&&T(i),E&&N.SubmitForm(i,r)},onChange:i=>{let{checked:m}=i.target;v.ok&&k({ok:!1,notice:[]}),c(_=>l(o({},_),{dataValue:m,eventType:"update",eventID:S(),isInspected:!1})),F&&F(i)}},t),{onFocus:i=>{t!=null&&t.onFocus&&(t==null||t.onFocus(i)),c(m=>l(o({},m),{eventID:S(),isFocusing:!0}))},onBlur:i=>{t!=null&&t.onBlur&&(t==null||t.onBlur(i)),c(m=>l(o({},m),{eventID:S(),isFocusing:!1}))}})),a(A.Plain,{tabIndex:-1,htmlFor:f,padding:"1/4",transition:y,borderRadius:"1.tone.primary",className:g("Label"),children:a(I,l(o({},p?{padding:"1/4",isRounded:!0,backgroundColor:d?s:"layer.3"}:{}),{children:z(U.Center,{unitHeight:R=="small"?2:R=="regular"?2.5:R=="large"?3:0,position:"relative",freeCSS:{aspectRatio:(w+C)/w},children:[!p&&a(I,{position:"absolute",backgroundColor:d?s:"layer.5",isRounded:!0,transition:y,width:1,opacity:"middle",className:g("Bar"),freeCSS:{height:"40%"}}),a(I,{position:"absolute",top:0,backgroundColor:!p&&d?s:"white",transition:y,isRounded:!0,flexCenter:!0,boxShadow:"1.remark",className:g("Dot"),freeCSS:{height:"100%",aspectRatio:"1",left:d?`calc(${C.ratio(w+C)}%)`:0},children:V&&a(I,{transition:y,flexCenter:!0,fontColor:d?p?s:"white":"6.clear",children:V})})]})}))})]})},b=e=>{let n=o({},e);return n.value=!!n.value,n.color=n.color||"theme",a(W,{componentId:n.componentId,children:O,states:n})},h=b;h.S=e=>a(b,l(o({},e),{size:"small"})),h.R=e=>a(b,l(o({},e),{size:"regular"})),h.L=e=>a(b,l(o({},e),{size:"large"}));export{h as Switch,h as default};
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import{b as n,c as
|
|
1
|
+
import{b as n,c as o,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:r}=u;if(l=="creditCard")e.length>=f.length&&g%5==0&&(g++,r++),i.setSelectionRange(g,r);else if(l=="postal")e.length==5&&f.length==3&&(g++,r++),i.setSelectionRange(g,r);else if(l=="digitNumber"){let p=e.length-f.length;p==2&&(g++,r++),p==-2&&(g--,r--),i.setSelectionRange(g,r)}},Validation:{System:t=>{let{value:a,states:l}=t,{restrict:u="text",defaultValidation:i,maxLength:e,multiline:f,required:g}=l,r=[];if(f||(e=e||255),b.is.exist(e)&&a.length>=Number(e)&&r.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||r.push({type:"invalid",label:p.body})}else g&&r.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"});return{ok:!r.filter(({type:p})=>p=="invalid").length,notice:r}},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 r=Number(l);l?e=e.replace(/(\.\d{0,})\..*/g,"$1").replace(/\.(\d{0,})/g,(p,x)=>x.length>r?"."+x.slice(0,r):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(r))),b.is.exist(c)&&b.is.number(c)&&Number(e)>Number(c)&&(e=String(c.toFixed(r)))}),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=>{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};
|
|
3
|
+
T`.repeat(x-1)}let r=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,o(n({className:a.className},r),{position:"absolute",width:1,freeCSS:o(n({},r.freeCSS),{color:"orange"}),"data-input-shallow":l.componentId,children:s(D,{"data-input-value-shallow":l.componentId,children:i})})),s(le.Description,o(n({className:a.className},r),{position:"absolute",left:0,freeCSS:o(n({},r.freeCSS),{backgroundColor:"transparent",color:"blue"}),"data-input-min-height-value-shallow":l.componentId,children:f})),s(le.Description,o(n({className:a.className},r),{position:"absolute",right:0,freeCSS:o(n({},r.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:r,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:Ie,onUpdateValue:he,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,o(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:h=>{let{key:I,target:w}=h,M=w,{selectionStart:P,selectionEnd:j}=M,q=Number(P),Z=Number(j);{let _=i.formatValue[Number(q)],H=i.formatValue[Number(q)-1];I=="Delete"&&(c=="creditCard"&&_==" "||c=="postal"&&_=="-"||c=="digitNumber"&&_==",")&&(M.setSelectionRange(q+1,Z+1),h.preventDefault()),I=="Backspace"&&(c=="creditCard"&&H==" "||c=="postal"&&H=="-"||c=="digitNumber"&&H==",")&&(M.setSelectionRange(q-1,Z-1),h.preventDefault()),I=="Enter"||I=="Tab"}b.scope(()=>{["number","digitNumber","creditCard"].includes(c)&&I=="Clear"&&e(_=>o(n({},_),{dataValue:"",formatValue:"",eventType:"update",eventID:C(),isFocusing:!0,isInspected:!1}))}),b.scope(()=>{if(!["number","digitNumber"].includes(c)||!["ArrowUp","ArrowDown"].includes(I))return;let _=+(I=="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=>o(n(n({},te),T.Validation.DataLeveling({allowDecimals:z,allowZeroStart:A,min:O,max:B,restrict:c,value:V})),{eventType:"update",eventID:C(),isFocusing:!0,isInspected:!1})),h.preventDefault()}),Q&&Q(h),G&&K.SubmitForm(h,E)},onChange:h=>{let{value:I,selectionStart:w,selectionEnd:M}=h.target,P=T.Validation.DataLeveling({allowDecimals:z,allowZeroStart:A,min:O,max:B,restrict:c,value:I});i.isComposing&&(P.formatValue=I),P.formatValue!=i.formatValue&&(l.ok&&u({ok:!1,notice:[]}),e(j=>o(n(n({},j),P),{prevValue:i.formatValue,eventType:"update",eventID:C(),caretFrom:Number(w),caretTo:Number(M),isFocusing:!0,isInspected:!1})),X&&X(h))},width:1},d),{onFocus:h=>{d!=null&&d.onFocus&&(d==null||d.onFocus(h)),e(I=>o(n({},I),{eventID:C(),isFocusing:!0}))},onBlur:h=>{d!=null&&d.onBlur&&(d==null||d.onBlur(h)),e(I=>o(n({},I),{eventID:C(),isFocusing:!1}))},onCompositionStart:h=>{d!=null&&d.onCompositionStart&&(d==null||d.onCompositionStart(h)),e(I=>o(n({},I),{eventID:C(),isComposing:!0}))},onCompositionEnd:h=>{if(d!=null&&d.onCompositionEnd&&(d==null||d.onCompositionEnd(h)),c=="text"){b.interval.once(()=>{e(w=>o(n({},w),{isComposing:!1}))},100,"input.textfield.composing.end");return}let I=T.Validation.DataLeveling({allowDecimals:z,allowZeroStart:A,min:O,max:B,restrict:c,value:i.formatValue});e(w=>o(n(n({},w),I),{prevValue:w.formatValue,eventType:"update",eventID:C(),caretFrom:Number(w.formatValue.length+1),caretTo:Number(w.formatValue.length+1),isComposing:!1,isInspected:!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:r,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:Ie,onUserAction:he,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,o(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=>o(n({},y),{eventID:C(),isFocusing:!0}))},onBlur:v=>{m!=null&&m.onBlur&&(m==null||m.onBlur(v)),e(y=>o(n({},y),{eventID:C(),isFocusing:!1}))},onCompositionStart:v=>{m!=null&&m.onCompositionStart&&(m==null||m.onCompositionStart(v)),e(y=>o(n({},y),{eventID:C(),isComposing:!0}))},onCompositionEnd:v=>{m!=null&&m.onCompositionEnd&&(m==null||m.onCompositionEnd(v)),b.interval.once(()=>{e(y=>o(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=>o(n({},oe),{dataValue:y,eventType:"update",eventID:C(),isFocusing:!0,isInspected:!1})),A&&A(v)}}))}},ze=t=>{let{componentId:a,restrict:l="text",value:u="",min:i,max:e,allowDecimals:f,allowZeroStart:g}=t,[r,p]=ie(o(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($=>o(n(n({},$),T.Validation.DataLeveling({allowDecimals:f,allowZeroStart:g,min:i,max:e,restrict:l,value:u})),{isInspected:!1})),ce.set({[a+":set_inputType"]:L})},[]);let F={rootStates:t,val_inputType:E,set_inputType:L,val_status:r,set_status:p,val_validate:x,set_validate:c};return K.CommonEffects({type:"textfield",states:t,val_status:r,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:r})},[r]),Y(He,{val_status:r,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||!!r.isFocusing||!!r.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,o(n({},t),{restrict:"katakana",multiline:!1,autoHeight:!1})),S.HankakuKatakana=t=>s(R,o(n({},t),{restrict:"hankaku.katakana",multiline:!1,autoHeight:!1})),S.CreditCard=t=>s(R,o(n({},t),{restrict:"creditCard",multiline:!1,autoHeight:!1})),S.Tel=t=>s(R,o(n({},t),{restrict:"tel",multiline:!1,autoHeight:!1})),S.Number=t=>s(R,o(n({},t),{restrict:"number",multiline:!1,autoHeight:!1})),S.DigitNumber=t=>s(R,o(n({},t),{restrict:"digitNumber",multiline:!1,autoHeight:!1})),S.Email=t=>s(R,o(n({},t),{restrict:"email",multiline:!1,autoHeight:!1})),S.Url=t=>s(R,o(n({},t),{restrict:"url",multiline:!1,autoHeight:!1})),S.Postal=t=>s(R,o(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,o(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,o(n({label:"\u79D8\u5BC6\u9375"},t),{restrict:"concealed"})),S.Money={JPY:t=>s(S.DigitNumber,o(n({rightIcon:s(me,{fontColor:"4.thin",children:"\u5186"})},t),{multiline:!1,autoHeight:!1}))};export{S as TextField,ze as TextInput,S as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{a as ie,b as o,c as b,d as K}from"../../../chunk-C5N2D3ZX.js";import{Fragment as Ae,jsx as h,jsxs as se}from"react/jsx-runtime";import ee,{UUID as P,useStore as U}from"jmini";import*as X from"jmini";import{useState as L,useEffect as z,useRef as pe}from"react";import{$$fromRoot as de,Config as ne,ExtractStyles as fe}from"../../../@utils";import{Box as H,FAI as he}from"../../../atoms";import{Literal as ge,Row as ye}from"../../../mols";import{Button as oe}from"../../Button";import ve from"../../Tooltips";import Ie from"../../Sheet";import{faClock as Se}from"@fortawesome/free-solid-svg-icons/faClock";import{faCalendarAlt as Te}from"@fortawesome/free-solid-svg-icons/faCalendarAlt";import{OptionalInputWrapper as De,BoxWrapper as be,CoreEffects as Y,DefaultBoxishStyles as xe}from"../core";import{RightIcon as ke}from"..";import Ee from"../Select";import{InputLabel as Re}from"../Label";import we from"./Picker";const $=" ~ ",Ve={clock:{defaultValue:"--:--",format:/^\d{2}\D\d{2}$/,ranges:[{type:"hour",from:0,length:2},{type:"minute",from:3,length:2}],sets:1},date:{defaultValue:"----/--/--",format:/^\d{4}\D\d{2}\D\d{2}$/,ranges:[{type:"year",from:0,length:4},{type:"month",from:5,length:2},{type:"date",from:8,length:2}],sets:1},week:{defaultValue:"----\u5E74\u7B2C--\u9031",format:/^\d{4}\D\d{2}$/,ranges:[{type:"year",from:0,length:4,region:6},{type:"week",from:6,length:2,region:3}],sets:1},month:{defaultValue:"----\u5E74--\u6708",format:/^\d{4}\D\d{2}$/,ranges:[{type:"year",from:0,length:4},{type:"month",from:5,length:2,region:3}],sets:1},year:{defaultValue:"----\u5E74",format:/^\d{4}$/,ranges:[{type:"year",from:0,length:4,region:5}],sets:1},dates:{defaultValue:"----/--/--",format:/^\d{4}\D\d{2}\D\d{2}$/,ranges:[{type:"year",from:0,length:4},{type:"month",from:5,length:2},{type:"date",from:8,length:2,region:5},{type:"year",from:10+$.length,length:4},{type:"month",from:15+$.length,length:2},{type:"date",from:18+$.length,length:2}],sets:2},months:{defaultValue:"----\u5E74--\u6708",format:/^\d{4}\D\d{2}$/,ranges:[{type:"year",from:0,length:4},{type:"month",from:5,length:2,region:6},{type:"year",from:8+$.length,length:4},{type:"month",from:13+$.length,length:2,region:3}],sets:2},dateWareki:{defaultValue:"----\u5E74--\u6708--\u65E5",format:/^\d{4}\D\d{2}\D\d{2}$/,ranges:[{type:"dateWareki",from:0,length:4,region:5},{type:"month",from:5,length:2,region:3},{type:"date",from:8,length:2,region:3}],sets:1}},F={PeriodMargin:" ~ ",DataLeveling:e=>{let{restrict:a,value:g,era:i}=e,f=ee.flatArray(g||""),{defaultValue:E,format:v,ranges:l,sets:r}=Ve[a],S=[],n=a=="clock"&&":"||"/";for(let t=0;t<f.length;t++)f[t]=String(f[t]).replace(/\D/ig,n);for(let t=0;t<r;t++){let u=f[t]||"";if(!u.match(v))f[t]="",S.push(E);else{let T=E;u.split(/\D/).forEach((k,R)=>{if(R==0&&a=="dateWareki"){let I=Number(k);i!="year"&&(I>=2019?i=="reiwa"?I-=2018:i=="heisei"&&(I=31):I>=1989?i=="heisei"?I-=1988:i=="shouwa"&&(I=64):I>=1926?i=="shouwa"?I-=1925:i=="taisho"&&(I=15):I>=1912?i=="taisho"?I-=1911:i=="meiji"&&(I=45):I>=1868&&(I-=1867)),k=I.zeroEmbed(4)}T=T.replace(new RegExp("------------------".slice(0,k.length)),k)}),S.push(T)}}return{formatValue:S.join($),dataValue:["dates","months"].includes(a)?f:f[0],ranges:l}},SystemValidation:e=>{let{states:a}=e,{restrict:g,min:i,max:f,required:E}=a,v=[],l=ee.flatArray(e.value),r={empty:!1,escalated:1,filled:!0,correct:!0,prohibited:!1};(()=>{let S=g=="clock"&&":"||"/";for(let n=0;n<l.length;n++)l[n]=String(l[n]).replace(/\D/ig,S);for(let n=0;n<l.length;n++){let t=l[n],u=l[n-1];t.removeLetters()||(r.empty=!0),n>0&&(r.escalated&=+(t>=u))}r.escalated&&(r.empty||(g.match(/clock/)?l.forEach(n=>{let[t,u]=n.split(/\D+/);!t||!u?r.filled=!1:(Number(t)>23||Number(u)>59)&&(r.correct=!1)}):g.match(/date/)?l.forEach(n=>{let[t,u,T]=n.split(/\D+/);if(!t||!u||!T)r.filled=!1;else{let k=X.Time(n);(!k.validate||n!=k.toFormatYMD())&&(r.correct=!1)}}):g.match(/week/)?l.forEach(n=>{let[t,u]=n.split(/\D+/);if(!t||!u)r.filled=!1;else{let T=X.Time(t+"/01/01").weekday,R=X.Time(t+"/01/0"+(7-T+1)).addWeek(Number(u)-1);t!=String(R.year)&&(r.correct=!1)}}):g.match(/month/)?l.forEach(n=>{let[t,u]=n.split(/\D+/);!t||!u?r.filled=!1:X.Time([t,u,"01"].join("/")).validate||(r.correct=!1)}):g.match(/year/),r.filled&&r.correct&&l.forEach(n=>{{let t=Number(String(n).replace(/\D/ig,""));if(i&&Number(String(i).replace(/\D/ig,""))>t&&(r.prohibited=!0),f){let u=Number(String(f).replace(/\D/ig,""));t>u&&(r.prohibited=!0)}}})))})();{let{empty:S,escalated:n,filled:t,correct:u,prohibited:T}=r;S&&E&&(v=[{type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"}]),n||v.push({type:"invalid",label:"\u6642\u7CFB\u5217\u3092\u6B63\u3057\u304F\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"}),u||v.push({type:"invalid",label:"\u7121\u52B9\u306A\u5024\u304C\u5165\u529B\u3055\u308C\u3066\u3044\u307E\u3059"}),t||v.push({type:"invalid",label:"\u6700\u5F8C\u307E\u3067\u5024\u3092\u57CB\u3081\u3066\u304F\u3060\u3055\u3044"}),T&&v.push({type:"invalid",label:se(Ae,{children:[h(H,{children:"\u5165\u529B\u7BC4\u56F2\u304C\u5236\u9650\u3055\u308C\u3066\u3044\u307E\u3059"}),"[",i||"\u4E0B\u9650\u7121\u3057","] ~ [",f||"\u4E0A\u9650\u7121\u3057","]"]})})}return{ok:!v.filter(({type:S})=>S=="invalid").length,notice:v}},KeyDownEvent:e=>{let{val_era:a,restrict:g,event:i,val_status:f,set_status:E,val_focus:v,set_focus:l}=e,{key:r,shiftKey:S,ctrlKey:n,metaKey:t}=i,u=n||t,{selectionStart:T,selectionEnd:k}=i.target,{index:R,prevIndex:I}=v,{ranges:q,formatValue:G}=f,V=q.length-1;if(["Tab","ArrowLeft","ArrowRight"].includes(r)){let y=0;if(r=="Tab"){let c=+!S*2-1;if(y=v.index+c,y<0||y>V)return}else{let c=r=="ArrowLeft"?-1:r=="ArrowRight"?1:0;u||T==0&&k==String(f.formatValue).length?y=c==1?V:0:y=Math.max(0,Math.min(R+c,V))}l(c=>b(o({},c),{index:y,prevIndex:R})),i.preventDefault()}if(["Backspace","ArrowUp","ArrowDown","0","1","2","3","4","5","6","7","8","9"].includes(r)){i.preventDefault();let y=R;y=Math.max(y,0),y=Math.min(y,V);let{type:c,from:j,length:Q}=q[y],B=G.slice(j,j+Q),D;if(r=="Backspace")D="------".slice(0,Q);else if(["ArrowUp","ArrowDown"].includes(r)){let _=r=="ArrowUp"?1:-1;B=B|0,D=B+_;let[p,d,s]=c=="dateWareki"?a=="year"?[0,2999,4]:a=="reiwa"?[1,2999,4]:a=="heisei"?[1,31,4]:a=="shouwa"?[1,64,4]:a=="taisho"?[1,15,4]:a=="meiji"?[1,45,4]:[0,0,0]:c=="minute"?[0,59,2]:c=="hour"?[0,23,2]:c=="date"?[1,31,2]:c=="week"?[1,53,2]:c=="month"?[1,12,2]:c=="year"?[0,2999,4]:[0,0,0];D>d?D=p:D<p&&(D=d),D=Number(D).zeroEmbed(s)}else if(["0","1","2","3","4","5","6","7","8","9"].includes(r)){let _=B|0,p=r,d=`${_}${p}`;if(I!=R&&(_=0,d="0"+p),c=="year"||c=="dateWareki"&&a=="year")Number(d)>1e4?D=p:D=d,(D|0)>1e3&&y++;else if(["hour","minute","date","week","month"].includes(c)||c=="dateWareki"&&a!="year"){let s=c=="dateWareki"?a=="reiwa"?100:a=="heisei"?31:a=="shouwa"?64:a=="taisho"?15:a=="meiji"?45:0:c=="minute"?59:c=="hour"?23:c=="date"?31:c=="week"?53:c=="month"?12:0;D=(d|0)>s?p:d,(Number(p)>Number(String(s)[0])||B=="0000".slice(0,String(s).length)&&(d!="0000".slice(0,String(s).length)||["minute","hour"].includes(c)&&I==R)||(d|0)>=ie(10,String(s).length-1))&&y++}c=="year"||c=="dateWareki"?D=(D|0).zeroEmbed(4):D=(D|0).zeroEmbed(2)}{let _=String(G).partReplace(j,String(D)),p=_.split($).map(d=>d.replace(/(^\D|\D$)/,"").split(/\D+/).join(g=="clock"&&":"||"/").replace(/(^\D|\D$)/,""));if(g=="dateWareki"){let d=p[0].split(/\D/),[s,w,M]=d;d.length==3&&s&&(p=[[Number(s)-1+Number({year:1,reiwa:2019,heisei:1989,shouwa:1926,taisho:1912,meiji:1868}[a]),w,M].join("/")])}y=Math.max(y,0),y=Math.min(y,V),E(d=>b(o({},d),{dataValue:["dates","months"].includes(g)?p:p[0],formatValue:_,eventType:"update",eventID:P()})),l(d=>b(o({},d),{index:y,prevIndex:d.index}))}}}},le={picker:{launch:e=>{let a=e.sheetID||P(),u=e,{onValueUpdate:g,min:i,max:f,era:E,restrict:v,defaultValue:l}=u,r=K(u,["onValueUpdate","min","max","era","restrict","defaultValue"]),S=!1,n=null,t=null;Ie.open("middleCenter",b(o({sheetID:a,size:"S",padding:0,closeAtAroundClick:!0,closeAtParentBlur:!1,onClose:()=>{S&&g(n,t,!0)}},r),{content:h(ye.Center,{children:h(we,{restrict:v,min:i,max:f,era:E,defaultValue:l,sheetID:a,onValueUpdate:(T,k,R)=>{g(T,k,R),S=!R,n=T,t=k}})})}))},remove:e=>{ve.close(e)}}},_e={Shallow:e=>{let{rootStates:a,val_status:g}=e,i=fe(a);return h(H,{position:"absolute",top:0,left:0,right:0,height:0,overflow:"hidden",opacity:"trans",freeCSS:{zIndex:3,pointerEvents:"none"},children:h(ge.Description,b(o({className:a.className},i),{position:"absolute",width:1,freeCSS:b(o({},i.freeCSS),{color:"orange"}),children:h(H,{"data-input-value-shallow":g.componentId,children:"A"})}))})}},Ce=e=>{let ae=e,{tone:a,required:g,restrict:i="clock",componentId:f,era:E,form:v,name:l,min:r,max:S,className:n,enableFormSubmit:t,checkValidationAtFirst:u,onKeyDown:T,onValidate:k,onValidateDelay:R,onUpdateValue:I,onUpdateValidValue:q,onUserAction:G,value:V="",leftIndicator:y,rightIndicator:c,leftIcon:j,rightIcon:Q,freeCSS:B,wrapStyles:D}=ae,_=K(ae,["tone","required","restrict","componentId","era","form","name","min","max","className","enableFormSubmit","checkValidationAtFirst","onKeyDown","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","onUserAction","value","leftIndicator","rightIndicator","leftIcon","rightIcon","freeCSS","wrapStyles"]),[p,d]=L(E),[s,w]=L(b(o({componentId:e.componentId||""},F.DataLeveling({restrict:i,value:V,era:p})),{ranges:[],eventType:"init",eventID:P()})),[M,Z]=L({ok:!1,notice:[]}),[J,N]=L({active:!1,index:0,prevIndex:-1}),me={rootStates:e,val_status:s,set_status:w,val_validate:M,set_validate:Z,val_era:p,set_era:d,val_focus:J,set_focus:N};Y.CommonEffects({type:"time",states:e,val_status:s,set_status:w,val_validate:M,set_validate:Z,SystemValidation:F.SystemValidation,ExtraOverrideStates:()=>F.DataLeveling({restrict:i,value:V,era:p})}),z(()=>{w(m=>o(o({},m),F.DataLeveling({restrict:i,value:V,era:p})))},[]);const te=pe(!1);return z(()=>{if(te.current){w(x=>o(o({},x),F.DataLeveling({restrict:i,value:x.dataValue,era:p})));let m=U.get("refreshEra_"+s.componentId);m&&m.refreshEra(p)}else te.current=!0},[p]),U.update({[s.componentId]:{openPicker:m=>{e.disabled||le.picker.launch({parent:m,sheetID:"PickerTips-"+s.componentId,restrict:i,min:r,max:S,defaultValue:s.dataValue,era:p,onValueUpdate:(x,C,W)=>{W&&(w(O=>b(o(o({},O),F.DataLeveling({restrict:i,value:x,era:C})),{eventType:"update",eventID:P()})),d(C))}})},resetEra:m=>{d(m),w(x=>b(o(o({},x),F.DataLeveling({restrict:i,value:"",era:p})),{eventType:"update",eventID:P()}))}}}),z(()=>{let{index:m,active:x}=J;if(x){m=Math.max(m,0),m=Math.min(m,s.ranges.length-1);let{from:C,length:W}=s.ranges[m],O=de("#"+e.id)[0];O&&O.setSelectionRange&&O.setSelectionRange(C,C+W)}w(C=>b(o({},C),{isFocusing:x}))},[J]),se(be,{val_status:s,set_status:w,val_validate:M,states:e,children:[h(_e.Shallow,o({},me)),h(Re,{componentId:e.componentId,fontSize:e.fontSize,required:e.required,label:e.label,isActive:!0}),ne.get().isTouchDevice?h(oe.Plain,b(o({"data-show-validation":Y.isShowValidation(M,s,!!u),"data-component-id":s.componentId,"data-input-origin":s.componentId,"data-disabled":e.disabled,className:n,freeCSS:{textAlign:"left"}},_),{children:s.formatValue,onClick:m=>{let x=U.get(s.componentId);x&&x.openPicker(`[data-input-origin="${s.componentId}"]`),m.stopPropagation()},onFocus:()=>{N(m=>b(o({},m),{active:!0}))},onBlur:()=>{N(m=>b(o({},m),{active:!1}))}})):h(H,o({htmlTag:"input",type:"text",inputMode:"numeric","data-show-validation":Y.isShowValidation(M,s,!!u),"data-input-origin":s.componentId,"data-disabled":e.disabled,value:s.formatValue,className:n,tabIndex:ne.get().isTouchDevice?-1:0,onKeyDown:m=>{F.KeyDownEvent({restrict:i,event:m,val_era:p,val_status:s,set_status:w,val_focus:J,set_focus:N}),T&&T(m),t&&Y.SubmitForm(m,v)},onKeyUp:m=>{m.key=="Tab"&&N(x=>b(o({},x),{active:!0}))},onClick:m=>{let x=m.target.selectionEnd,C=0;s.ranges.forEach((W,O)=>{let{from:re,length:ce,region:ue}=W;re<=x&&x<=re+(ue||ce)&&(C=O)}),N(W=>b(o({},W),{active:!0,index:C})),m.preventDefault()},onBlur:()=>{N(m=>b(o({},m),{active:!1}))},onChange:()=>{}},_))]})},A={Origin:e=>{let a=o({fontSize:"inherit",width:1,value:""},e);a.value=a.value||"";let[g]=L(e.componentId||P());if(a.componentId=g,ee.is.nullish(a.rightIcon)){let i=(e.restrict||"").match(/clock/)?Se:Te;a.rightIcon=h(ke,{ssSphere:2,freeCSS:{pointerEvents:"all"},children:h(oe.Sub,{color:"cloud",border:"unset",ssSphere:2,fontColor:"theme",boxShadow:"0.normal",borderRadius:"3.tone.tertiary",flexCenter:!0,ssEffectsOnActive:"push",tabIndex:-1,id:"Picker-"+a.componentId,onClick:()=>{let f=U.get(a.componentId);f&&f.openPicker("#Picker-"+a.componentId)},children:h(he,{icon:i})})})}return h(De,{componentId:a.componentId,children:Ce,states:xe(a)})},Clock:e=>h(A.Origin,o({restrict:"clock",era:"clock"},e)),Date:e=>h(A.Origin,o({restrict:"date"},e)),Week:e=>h(A.Origin,o({restrict:"week"},e)),Month:e=>h(A.Origin,o({restrict:"month"},e)),Year:e=>h(A.Origin,o({restrict:"year"},e)),DateWareki:e=>{e=o({},e);let[a]=L(e.componentId||P());e.componentId=a;let v=e,{defaultEra:g="wareki"}=v,i=K(v,["defaultEra"]),[f,E]=L((()=>{let l="year";if(g=="wareki"&&(l="reiwa",e.value)){let[r,S,n]=e.value.split(/\D/);if(r&&S&&n){let t=Number(r);t>=2019?(t-=2019,l="reiwa"):t>=1989?(t-=1989,l="heisei"):t>=1926?(t-=1926,l="shouwa"):t>=1912?(t-=1912,l="taisho"):t>=1868&&(t-=1868,l="meiji"),t+=1}}return l})());return z(()=>{U.set({["refreshEra_"+a]:{refreshEra:l=>{E(l)}}})},[]),h(A.Origin,b(o({restrict:"dateWareki",leftIndicator:h(Ee,{label:"\u5143\u53F7",emptySelect:!1,value:f,tone:e.tone||"border",override:"force",flexCenter:!0,borderTopRightRadius:"2/3",borderBottomRightRadius:"2/3",height:1,freeCSS:{whiteSpace:"nowrap"},options:[{value:"year",label:"\u897F\u66A6"},{value:"reiwa",label:"\u4EE4\u548C"},{value:"heisei",label:"\u5E73\u6210"},{value:"shouwa",label:"\u662D\u548C"},{value:"taisho",label:"\u5927\u6B63"},{value:"meiji",label:"\u660E\u6CBB"}],onUpdateValidValue:l=>{E(l);let r=U.get(e.componentId);r&&r.resetEra&&r.resetEra(l)}})},i),{era:f}))},Periods:{Date:e=>h(A.Origin,o({restrict:"dates"},e)),Month:e=>h(A.Origin,o({restrict:"months"},e))},fn:le};export{A as Time,A as default};
|
|
1
|
+
import{a as ie,b as n,c as I,d as K}from"../../../chunk-C5N2D3ZX.js";import{Fragment as Ae,jsx as h,jsxs as se}from"react/jsx-runtime";import ee,{UUID as P,useStore as U}from"jmini";import*as X from"jmini";import{useState as L,useEffect as z,useRef as ue}from"react";import{$$fromRoot as de,Config as ne,ExtractStyles as fe}from"../../../@utils";import{Box as H,FAI as he}from"../../../atoms";import{Literal as ge,Row as ye}from"../../../mols";import{Button as le}from"../../Button";import ve from"../../Tooltips";import Ie from"../../Sheet";import{faClock as Se}from"@fortawesome/free-solid-svg-icons/faClock";import{faCalendarAlt as Te}from"@fortawesome/free-solid-svg-icons/faCalendarAlt";import{OptionalInputWrapper as De,BoxWrapper as be,CoreEffects as Y,DefaultBoxishStyles as xe}from"../core";import{RightIcon as ke}from"..";import Ee from"../Select";import{InputLabel as Re}from"../Label";import we from"./Picker";const $=" ~ ",Ve={clock:{defaultValue:"--:--",format:/^\d{2}\D\d{2}$/,ranges:[{type:"hour",from:0,length:2},{type:"minute",from:3,length:2}],sets:1},date:{defaultValue:"----/--/--",format:/^\d{4}\D\d{2}\D\d{2}$/,ranges:[{type:"year",from:0,length:4},{type:"month",from:5,length:2},{type:"date",from:8,length:2}],sets:1},week:{defaultValue:"----\u5E74\u7B2C--\u9031",format:/^\d{4}\D\d{2}$/,ranges:[{type:"year",from:0,length:4,region:6},{type:"week",from:6,length:2,region:3}],sets:1},month:{defaultValue:"----\u5E74--\u6708",format:/^\d{4}\D\d{2}$/,ranges:[{type:"year",from:0,length:4},{type:"month",from:5,length:2,region:3}],sets:1},year:{defaultValue:"----\u5E74",format:/^\d{4}$/,ranges:[{type:"year",from:0,length:4,region:5}],sets:1},dates:{defaultValue:"----/--/--",format:/^\d{4}\D\d{2}\D\d{2}$/,ranges:[{type:"year",from:0,length:4},{type:"month",from:5,length:2},{type:"date",from:8,length:2,region:5},{type:"year",from:10+$.length,length:4},{type:"month",from:15+$.length,length:2},{type:"date",from:18+$.length,length:2}],sets:2},months:{defaultValue:"----\u5E74--\u6708",format:/^\d{4}\D\d{2}$/,ranges:[{type:"year",from:0,length:4},{type:"month",from:5,length:2,region:6},{type:"year",from:8+$.length,length:4},{type:"month",from:13+$.length,length:2,region:3}],sets:2},dateWareki:{defaultValue:"----\u5E74--\u6708--\u65E5",format:/^\d{4}\D\d{2}\D\d{2}$/,ranges:[{type:"dateWareki",from:0,length:4,region:5},{type:"month",from:5,length:2,region:3},{type:"date",from:8,length:2,region:3}],sets:1}},F={PeriodMargin:" ~ ",DataLeveling:e=>{let{restrict:a,value:g,era:i}=e,f=ee.flatArray(g||""),{defaultValue:E,format:S,ranges:l,sets:r}=Ve[a],R=[],D=a=="clock"&&":"||"/";for(let t=0;t<f.length;t++)f[t]=String(f[t]).replace(/\D/ig,D);for(let t=0;t<r;t++){let o=f[t]||"";if(!o.match(S))f[t]="",R.push(E);else{let c=E;o.split(/\D/).forEach((b,k)=>{if(k==0&&a=="dateWareki"){let y=Number(b);i!="year"&&(y>=2019?i=="reiwa"?y-=2018:i=="heisei"&&(y=31):y>=1989?i=="heisei"?y-=1988:i=="shouwa"&&(y=64):y>=1926?i=="shouwa"?y-=1925:i=="taisho"&&(y=15):y>=1912?i=="taisho"?y-=1911:i=="meiji"&&(y=45):y>=1868&&(y-=1867)),b=y.zeroEmbed(4)}c=c.replace(new RegExp("------------------".slice(0,b.length)),b)}),R.push(c)}}return{formatValue:R.join($),dataValue:["dates","months"].includes(a)?f:f[0],ranges:l}},SystemValidation:e=>{let{states:a}=e,{restrict:g,min:i,max:f,required:E}=a,S=[],l=ee.flatArray(e.value),r={empty:!1,escalated:1,filled:!0,correct:!0,prohibited:!1};(()=>{let D=g=="clock"&&":"||"/";for(let t=0;t<l.length;t++)l[t]=String(l[t]).replace(/\D/ig,D);for(let t=0;t<l.length;t++){let o=l[t],c=l[t-1];o.removeLetters()||(r.empty=!0),t>0&&(r.escalated&=+(o>=c))}r.escalated&&(r.empty||(g.match(/clock/)?l.forEach(t=>{let[o,c]=t.split(/\D+/);!o||!c?r.filled=!1:(Number(o)>23||Number(c)>59)&&(r.correct=!1)}):g.match(/date/)?l.forEach(t=>{let[o,c,b]=t.split(/\D+/);if(!o||!c||!b)r.filled=!1;else{let k=X.Time(t);(!k.validate||t!=k.toFormatYMD())&&(r.correct=!1)}}):g.match(/week/)?l.forEach(t=>{let[o,c]=t.split(/\D+/);if(!o||!c)r.filled=!1;else{let b=X.Time(o+"/01/01").weekday,y=X.Time(o+"/01/0"+(7-b+1)).addWeek(Number(c)-1);o!=String(y.year)&&(r.correct=!1)}}):g.match(/month/)?l.forEach(t=>{let[o,c]=t.split(/\D+/);!o||!c?r.filled=!1:X.Time([o,c,"01"].join("/")).validate||(r.correct=!1)}):g.match(/year/),r.filled&&r.correct&&l.forEach(t=>{{let o=Number(String(t).replace(/\D/ig,""));if(i&&Number(String(i).replace(/\D/ig,""))>o&&(r.prohibited=!0),f){let c=Number(String(f).replace(/\D/ig,""));o>c&&(r.prohibited=!0)}}})))})();{let{empty:D,escalated:t,filled:o,correct:c,prohibited:b}=r;D&&E&&(S=[{type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"}]),t||S.push({type:"invalid",label:"\u6642\u7CFB\u5217\u3092\u6B63\u3057\u304F\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"}),c||S.push({type:"invalid",label:"\u7121\u52B9\u306A\u5024\u304C\u5165\u529B\u3055\u308C\u3066\u3044\u307E\u3059"}),o||S.push({type:"invalid",label:"\u6700\u5F8C\u307E\u3067\u5024\u3092\u57CB\u3081\u3066\u304F\u3060\u3055\u3044"}),b&&S.push({type:"invalid",label:se(Ae,{children:[h(H,{children:"\u5165\u529B\u7BC4\u56F2\u304C\u5236\u9650\u3055\u308C\u3066\u3044\u307E\u3059"}),"[",i||"\u4E0B\u9650\u7121\u3057","] ~ [",f||"\u4E0A\u9650\u7121\u3057","]"]})})}return{ok:!S.filter(({type:D})=>D=="invalid").length,notice:S}},KeyDownEvent:e=>{let{val_era:a,restrict:g,event:i,val_status:f,set_status:E,val_focus:S,set_focus:l}=e,{key:r,shiftKey:R,ctrlKey:D,metaKey:t}=i,o=D||t,{selectionStart:c,selectionEnd:b}=i.target,{index:k,prevIndex:y}=S,{ranges:q,formatValue:G}=f,V=q.length-1;if(["Tab","ArrowLeft","ArrowRight"].includes(r)){let v=0;if(r=="Tab"){let p=+!R*2-1;if(v=S.index+p,v<0||v>V)return}else{let p=r=="ArrowLeft"?-1:r=="ArrowRight"?1:0;o||c==0&&b==String(f.formatValue).length?v=p==1?V:0:v=Math.max(0,Math.min(k+p,V))}l(p=>I(n({},p),{index:v,prevIndex:k})),i.preventDefault()}if(["Backspace","ArrowUp","ArrowDown","0","1","2","3","4","5","6","7","8","9"].includes(r)){i.preventDefault();let v=k;v=Math.max(v,0),v=Math.min(v,V);let{type:p,from:j,length:Q}=q[v],B=G.slice(j,j+Q),T;if(r=="Backspace")T="------".slice(0,Q);else if(["ArrowUp","ArrowDown"].includes(r)){let _=r=="ArrowUp"?1:-1;B=B|0,T=B+_;let[u,d,s]=p=="dateWareki"?a=="year"?[0,2999,4]:a=="reiwa"?[1,2999,4]:a=="heisei"?[1,31,4]:a=="shouwa"?[1,64,4]:a=="taisho"?[1,15,4]:a=="meiji"?[1,45,4]:[0,0,0]:p=="minute"?[0,59,2]:p=="hour"?[0,23,2]:p=="date"?[1,31,2]:p=="week"?[1,53,2]:p=="month"?[1,12,2]:p=="year"?[0,2999,4]:[0,0,0];T>d?T=u:T<u&&(T=d),T=Number(T).zeroEmbed(s)}else if(["0","1","2","3","4","5","6","7","8","9"].includes(r)){let _=B|0,u=r,d=`${_}${u}`;if(y!=k&&(_=0,d="0"+u),p=="year"||p=="dateWareki"&&a=="year")Number(d)>1e4?T=u:T=d,(T|0)>1e3&&v++;else if(["hour","minute","date","week","month"].includes(p)||p=="dateWareki"&&a!="year"){let s=p=="dateWareki"?a=="reiwa"?100:a=="heisei"?31:a=="shouwa"?64:a=="taisho"?15:a=="meiji"?45:0:p=="minute"?59:p=="hour"?23:p=="date"?31:p=="week"?53:p=="month"?12:0;T=(d|0)>s?u:d,(Number(u)>Number(String(s)[0])||B=="0000".slice(0,String(s).length)&&(d!="0000".slice(0,String(s).length)||["minute","hour"].includes(p)&&y==k)||(d|0)>=ie(10,String(s).length-1))&&v++}p=="year"||p=="dateWareki"?T=(T|0).zeroEmbed(4):T=(T|0).zeroEmbed(2)}{let _=String(G).partReplace(j,String(T)),u=_.split($).map(d=>d.replace(/(^\D|\D$)/,"").split(/\D+/).join(g=="clock"&&":"||"/").replace(/(^\D|\D$)/,""));if(g=="dateWareki"){let d=u[0].split(/\D/),[s,w,M]=d;d.length==3&&s&&(u=[[Number(s)-1+Number({year:1,reiwa:2019,heisei:1989,shouwa:1926,taisho:1912,meiji:1868}[a]),w,M].join("/")])}v=Math.max(v,0),v=Math.min(v,V),E(d=>I(n({},d),{dataValue:["dates","months"].includes(g)?u:u[0],formatValue:_,eventType:"update",eventID:P(),isInspected:!1})),l(d=>I(n({},d),{index:v,prevIndex:d.index}))}}}},oe={picker:{launch:e=>{let a=e.sheetID||P(),o=e,{onValueUpdate:g,min:i,max:f,era:E,restrict:S,defaultValue:l}=o,r=K(o,["onValueUpdate","min","max","era","restrict","defaultValue"]),R=!1,D=null,t=null;Ie.open("middleCenter",I(n({sheetID:a,size:"S",padding:0,closeAtAroundClick:!0,closeAtParentBlur:!1,onClose:()=>{R&&g(D,t,!0)}},r),{content:h(ye.Center,{children:h(we,{restrict:S,min:i,max:f,era:E,defaultValue:l,sheetID:a,onValueUpdate:(c,b,k)=>{g(c,b,k),R=!k,D=c,t=b}})})}))},remove:e=>{ve.close(e)}}},_e={Shallow:e=>{let{rootStates:a,val_status:g}=e,i=fe(a);return h(H,{position:"absolute",top:0,left:0,right:0,height:0,overflow:"hidden",opacity:"trans",freeCSS:{zIndex:3,pointerEvents:"none"},children:h(ge.Description,I(n({className:a.className},i),{position:"absolute",width:1,freeCSS:I(n({},i.freeCSS),{color:"orange"}),children:h(H,{"data-input-value-shallow":g.componentId,children:"A"})}))})}},Ce=e=>{let ae=e,{tone:a,required:g,restrict:i="clock",componentId:f,era:E,form:S,name:l,min:r,max:R,className:D,enableFormSubmit:t,checkValidationAtFirst:o,onKeyDown:c,onValidate:b,onValidateDelay:k,onUpdateValue:y,onUpdateValidValue:q,onUserAction:G,value:V="",leftIndicator:v,rightIndicator:p,leftIcon:j,rightIcon:Q,freeCSS:B,wrapStyles:T}=ae,_=K(ae,["tone","required","restrict","componentId","era","form","name","min","max","className","enableFormSubmit","checkValidationAtFirst","onKeyDown","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","onUserAction","value","leftIndicator","rightIndicator","leftIcon","rightIcon","freeCSS","wrapStyles"]),[u,d]=L(E),[s,w]=L(I(n({componentId:e.componentId||""},F.DataLeveling({restrict:i,value:V,era:u})),{ranges:[],eventType:"init",eventID:P()})),[M,Z]=L({ok:!1,notice:[]}),[J,N]=L({active:!1,index:0,prevIndex:-1}),me={rootStates:e,val_status:s,set_status:w,val_validate:M,set_validate:Z,val_era:u,set_era:d,val_focus:J,set_focus:N};Y.CommonEffects({type:"time",states:e,val_status:s,set_status:w,val_validate:M,set_validate:Z,SystemValidation:F.SystemValidation,ExtraOverrideStates:()=>F.DataLeveling({restrict:i,value:V,era:u})}),z(()=>{w(m=>I(n(n({},m),F.DataLeveling({restrict:i,value:V,era:u})),{isInspected:!1}))},[]);const te=ue(!1);return z(()=>{if(te.current){w(x=>I(n(n({},x),F.DataLeveling({restrict:i,value:x.dataValue,era:u})),{isInspected:!1}));let m=U.get("refreshEra_"+s.componentId);m&&m.refreshEra(u)}else te.current=!0},[u]),U.update({[s.componentId]:{openPicker:m=>{e.disabled||oe.picker.launch({parent:m,sheetID:"PickerTips-"+s.componentId,restrict:i,min:r,max:R,defaultValue:s.dataValue,era:u,onValueUpdate:(x,C,W)=>{W&&(w(O=>I(n(n({},O),F.DataLeveling({restrict:i,value:x,era:C})),{eventType:"update",eventID:P(),isInspected:!1})),d(C))}})},resetEra:m=>{d(m),w(x=>I(n(n({},x),F.DataLeveling({restrict:i,value:"",era:u})),{eventType:"update",eventID:P(),isInspected:!1}))}}}),z(()=>{let{index:m,active:x}=J;if(x){m=Math.max(m,0),m=Math.min(m,s.ranges.length-1);let{from:C,length:W}=s.ranges[m],O=de("#"+e.id)[0];O&&O.setSelectionRange&&O.setSelectionRange(C,C+W)}w(C=>I(n({},C),{isFocusing:x}))},[J]),se(be,{val_status:s,set_status:w,val_validate:M,states:e,children:[h(_e.Shallow,n({},me)),h(Re,{componentId:e.componentId,fontSize:e.fontSize,required:e.required,label:e.label,isActive:!0}),ne.get().isTouchDevice?h(le.Plain,I(n({"data-show-validation":Y.isShowValidation(M,s,!!o),"data-component-id":s.componentId,"data-input-origin":s.componentId,"data-disabled":e.disabled,className:D,freeCSS:{textAlign:"left"}},_),{children:s.formatValue,onClick:m=>{let x=U.get(s.componentId);x&&x.openPicker(`[data-input-origin="${s.componentId}"]`),m.stopPropagation()},onFocus:()=>{N(m=>I(n({},m),{active:!0}))},onBlur:()=>{N(m=>I(n({},m),{active:!1}))}})):h(H,n({htmlTag:"input",type:"text",inputMode:"numeric","data-show-validation":Y.isShowValidation(M,s,!!o),"data-input-origin":s.componentId,"data-disabled":e.disabled,value:s.formatValue,className:D,tabIndex:ne.get().isTouchDevice?-1:0,onKeyDown:m=>{F.KeyDownEvent({restrict:i,event:m,val_era:u,val_status:s,set_status:w,val_focus:J,set_focus:N}),c&&c(m),t&&Y.SubmitForm(m,S)},onKeyUp:m=>{m.key=="Tab"&&N(x=>I(n({},x),{active:!0}))},onClick:m=>{let x=m.target.selectionEnd,C=0;s.ranges.forEach((W,O)=>{let{from:re,length:ce,region:pe}=W;re<=x&&x<=re+(pe||ce)&&(C=O)}),N(W=>I(n({},W),{active:!0,index:C})),m.preventDefault()},onBlur:()=>{N(m=>I(n({},m),{active:!1}))},onChange:()=>{}},_))]})},A={Origin:e=>{let a=n({fontSize:"inherit",width:1,value:""},e);a.value=a.value||"";let[g]=L(e.componentId||P());if(a.componentId=g,ee.is.nullish(a.rightIcon)){let i=(e.restrict||"").match(/clock/)?Se:Te;a.rightIcon=h(ke,{ssSphere:2,freeCSS:{pointerEvents:"all"},children:h(le.Sub,{color:"cloud",border:"unset",ssSphere:2,fontColor:"theme",boxShadow:"0.normal",borderRadius:"3.tone.tertiary",flexCenter:!0,ssEffectsOnActive:"push",tabIndex:-1,id:"Picker-"+a.componentId,onClick:()=>{let f=U.get(a.componentId);f&&f.openPicker("#Picker-"+a.componentId)},children:h(he,{icon:i})})})}return h(De,{componentId:a.componentId,children:Ce,states:xe(a)})},Clock:e=>h(A.Origin,n({restrict:"clock",era:"clock"},e)),Date:e=>h(A.Origin,n({restrict:"date"},e)),Week:e=>h(A.Origin,n({restrict:"week"},e)),Month:e=>h(A.Origin,n({restrict:"month"},e)),Year:e=>h(A.Origin,n({restrict:"year"},e)),DateWareki:e=>{e=n({},e);let[a]=L(e.componentId||P());e.componentId=a;let S=e,{defaultEra:g="wareki"}=S,i=K(S,["defaultEra"]),[f,E]=L((()=>{let l="year";if(g=="wareki"&&(l="reiwa",e.value)){let[r,R,D]=e.value.split(/\D/);if(r&&R&&D){let t=Number(r);t>=2019?(t-=2019,l="reiwa"):t>=1989?(t-=1989,l="heisei"):t>=1926?(t-=1926,l="shouwa"):t>=1912?(t-=1912,l="taisho"):t>=1868&&(t-=1868,l="meiji"),t+=1}}return l})());return z(()=>{U.set({["refreshEra_"+a]:{refreshEra:l=>{E(l)}}})},[]),h(A.Origin,I(n({restrict:"dateWareki",leftIndicator:h(Ee,{label:"\u5143\u53F7",emptySelect:!1,value:f,tone:e.tone||"border",override:"force",flexCenter:!0,borderTopRightRadius:"2/3",borderBottomRightRadius:"2/3",height:1,freeCSS:{whiteSpace:"nowrap"},options:[{value:"year",label:"\u897F\u66A6"},{value:"reiwa",label:"\u4EE4\u548C"},{value:"heisei",label:"\u5E73\u6210"},{value:"shouwa",label:"\u662D\u548C"},{value:"taisho",label:"\u5927\u6B63"},{value:"meiji",label:"\u660E\u6CBB"}],onUpdateValidValue:l=>{E(l);let r=U.get(e.componentId);r&&r.resetEra&&r.resetEra(l)}})},i),{era:f}))},Periods:{Date:e=>h(A.Origin,n({restrict:"dates"},e)),Month:e=>h(A.Origin,n({restrict:"months"},e))},fn:oe};export{A as Time,A as default};
|
package/dist/fn/Input/core.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{b as
|
|
1
|
+
import{b as i,c as d,e as _}from"../../chunk-C5N2D3ZX.js";import{jsx as m,jsxs as h}from"react/jsx-runtime";import{useState as x,useEffect as S}from"react";import p,{UUID as I,useStore as v}from"jmini";import{$$fromRoot as D}from"../../@utils";import{InputClasses as b}from"../../@styles/componentClasses";import{Box as B,Flex as E,FAI as C,Column as F}from"../../atoms";import{Row as k,Literal as N}from"../../mols";import{Button as w}from"../Button";import R from"../Tooltips";const et=t=>{let[n]=x(t.componentId||I());t=i({},t),t.states=d(i({enableFormSubmit:!0,status_id:I(),override:"never",form:"",id:I(),"aria-label":"Input-"+n},t.states),{componentId:n});let{children:a}=t;return m(a,i({},t.states))},at=t=>{let{children:n,val_status:a,val_validate:e,states:s}=t,{leftIcon:r,wrapStyles:o}=s;return s.checkValidationAtFirst||a.eventType=="init"&&(e.notice=[]),h(k.Center,d(i({position:"relative",verticalAlign:"unset",gap:0},o),{className:b("Wrapper"),"data-notice-uid":a.componentId,children:[m(T.Notice,{notice:e.notice,val_status:a}),s.leftIndicator,h(E,{position:"relative",flexSizing:"auto",children:[n,r,m(T.RightIcon,i({},t)),m(T.ClearButton,i({},t))]}),s.rightIndicator]}))},T={ClearButton:t=>!t.states.clearButton||!t.val_status.dataValue?null:m(w.Normal,{ssSphere:2,flexCenter:!0,fontColor:"5.translucent",ssEffectsOnActive:["ripple.theme"],position:"absolute",right:1,top:"50%",freeCSS:{zIndex:3,transform:"translateY(-50%)"},onClick:()=>{t.set_status(n=>d(i({},n),{dataValue:"",formatValue:"",eventType:"update",eventID:I(),isInspected:!1}))},children:m(C.X,{})}),RightIcon:t=>t.states.clearButton&&t.val_status.dataValue?null:t.states.rightIcon,Notice:t=>{let{notice:n,val_status:a}=t,{componentId:e}=a,s="NoticeTimer-"+e,r="NoticeTimerClose-"+e,o="notice-tips-"+e;return S(()=>{p.interval.once(()=>{if(!(n!=null&&n.length)){R.close(o);return}R.open({tipsID:o,parent:`[data-notice-uid="${e}"]`,gravityPoint:24,padding:[1,0],closeAtParentBlur:!1,content:h(R.Body,{padding:["1/2","2/3"],fontSize:"1.mini",position:"relative",children:[m(B,{position:"absolute",unitHeight:1,unitWidth:1,right:1,backgroundColor:"dark",freeCSS:{zIndex:1,transform:"rotate(45deg)",top:-6}}),m(F,{backgroundColor:"inherit",gap:"1/3",position:"relative",freeCSS:{zIndex:2},children:n.map((y,g)=>{let{type:l,label:u}=y,f=l=="invalid"?C.Exclamation:l=="warn"?C.Exclamation:C.Check;return h(k.Left,{gap:0,borderRadius:"2.tone.secondary",children:[m(f,{flexCenter:!0,fontSize:"2.normal",fontColor:{invalid:"nega",warn:"warn",valid:"posi"}[l]}),m(N.Supplement,{fontSize:"0.xs",fontColor:"white",children:u})]},g+"-"+p.Stringify(y))})})]})})},350,s),p.interval.once(()=>{R.close(o)},6e3,r)},[n]),null}},A={DefaultStatus:(t,n)=>({componentId:t,dataValue:n,eventType:"init",eventID:I()}),CommonEffects:function(t){let{type:n,states:a,val_status:e,set_status:s,val_validate:r,set_validate:o,SystemValidation:y}=t;a=i({},a);let{componentId:g}=e;S(()=>(v.update({[g]:{ResolveRefresh:null,Refresh:()=>new Promise((l,u)=>{v.get(g).ResolveRefresh=l,s(f=>d(i({},f),{isInspected:!1,eventType:"refresh",eventID:I()}))}),GenNotice:l=>{let{ok:u,notice:f}=l;o({ok:u,notice:f})}}}),()=>{v.delete(g)}),[]),p.scope(()=>{let{override:l}=a;if(l=="never"||l=="beforeModified"&&!["init","override"].includes(e.eventType)||e.isComposing)return;let u=v.get(e.componentId);if(!u)return;if(p.is.equal(a.value,e.dataValue)){u.status_id=a.status_id;return}let f=p.SortifyObject(a.value),c=p.SortifyObject(e.dataValue);if(f&&c&&p.is.equal(f,c)){u.status_id=a.status_id;return}a.status_id!=u.status_id&&s(V=>d(i(d(i({},V),{dataValue:a.value}),t.ExtraOverrideStates&&t.ExtraOverrideStates()),{eventType:"override",eventID:I(),isInspected:!1}))}),S(()=>{A.ValidationCheck({val_status:e,set_status:s,set_validate:o,SystemValidation:y,states:a})},[e.eventID,e.dataValue]);{let{componentId:l,eventType:u,dataValue:f}=e,c=f;n=="autocomplete.single"||n=="list.radio"?c=c[0]:a.isChecker&&(c=!!c[0]),S(()=>(p.scope(()=>{if(a.form=a.form||"testForm",a.name&&a.form&&v.update({[["form-data",a.form].join("-")]:{[a.name]:{componentId:l,type:n,value:c,validation:r.ok}}}),!e.isInspected||u!="refresh")return;let V=v.get(l);V&&V.ResolveRefresh&&V.ResolveRefresh(null)}),()=>{v.update({[["form-data",a.form].join("-")]:{[a.name]:null}})}),[e,r]),S(()=>{a.onUserAction&&a.onUserAction(c,{eventType:u,componentId:l,isInspected:!!e.isInspected,isValidated:!!r.ok,isComposing:!!e.isComposing,isFocusing:!!e.isFocusing})},[e]),S(()=>{u=="update"&&e.isInspected&&(a.onUpdateValue&&a.onUpdateValue(c,{eventType:u,componentId:l,isValidated:!!r.ok,isComposing:!!e.isComposing,isFocusing:!!e.isFocusing}),r.ok&&a.onUpdateValidValue&&a.onUpdateValidValue(c,{eventType:u,componentId:l,isValidated:!!r.ok,isComposing:!!e.isComposing,isFocusing:!!e.isFocusing}))},[r.ok,e.isInspected,e.dataValue])}},ValidationCheck:t=>{let{states:n}=t,a="ValidationTimer-"+t.val_status.componentId;p.interval.abort(a),t.set_status(o=>d(i({},o),{isInspected:!1}));let e=t.SystemValidation({value:t.val_status.dataValue,states:n});if(!e.ok){t.set_validate(e),t.set_status(o=>d(i({},o),{isInspected:!0}));return}let s=e.notice||[];const r=()=>_(void 0,null,function*(){if(!n.onValidate)return;let o=yield n.onValidate(t.val_status.dataValue,t.val_status.eventType,t.val_status);t.set_validate({ok:o.ok,notice:[...s,...o.notice||[]]}),t.set_status(y=>d(i({},y),{isInspected:!0}))});if(n.onValidate){if(t.val_status.eventType=="refresh"){r();return}p.interval.once(r,n.onValidateDelay||500,a);return}t.set_validate({ok:!0,notice:s}),t.set_status(o=>d(i({},o),{isInspected:!0}))},SubmitForm:(t,n)=>{let a=!1;if(!n)return a;let e=D(`[data-form-submit-button="${n}"]`)[0];if(!e)return a;let s=e.dataset.sdfike||"",r=t.key,o=t.ctrlKey||t.metaKey;return p.scope(()=>{s.includes("enter")&&(r!="Enter"||t.nativeEvent.isComposing||(t==null?void 0:t.keyCode)==229)||((r=="Enter"&&(s.includes("enter")||s.includes("auxEnter")&&o)||r==" "&&s.includes("space"))&&(e.click(),t.preventDefault()),a=!0)}),a},isShowValidation:(t,n,a)=>{let e=t.ok;return!a&&n.eventType=="init"?!0:e}},nt=function(t){t=i({tone:"border"},t);let n=p.scope(()=>{if(t.tone=="plain")return{};let e={padding:1,transition:"middle",flexSizing:"auto",boxShadow:"0.min"};return t.tone=="border"?e=d(i({},e),{border:!0,borderRadius:"2.tone.secondary",backgroundColor:"layer.1"}):t.tone=="cloud"?e=d(i({},e),{border:"1.thin",borderRadius:"2.tone.secondary",backgroundColor:"cloud"}):t.tone=="bottomBorder"&&(e=d(i({},e),{borderRadius:0,border:"unset",borderBottom:!0,backgroundColor:"cloud"})),e});return d(i(i(i(i(i(i({fontColor:"2.normal"},n),!!t.rightIcon&&{paddingRight:3}),!!t.leftIcon&&{paddingLeft:3}),!!t.leftIndicator&&{borderTopLeftRadius:"2/3",borderBottomLeftRadius:"2/3",marginLeft:"1/4"}),!!t.rightIndicator&&{borderTopRightRadius:"2/3",borderBottomRightRadius:"2/3",marginRight:"1/4"}),t),{freeCSS:i({letterSpacing:"1px",resize:"none"},t.freeCSS),className:[b("Input"),t.className].join(" ")})};export{at as BoxWrapper,A as CoreEffects,nt as DefaultBoxishStyles,et as OptionalInputWrapper};
|
package/dist/fn/Input/index.d.ts
CHANGED
|
@@ -12,6 +12,7 @@ export declare namespace InputTypes {
|
|
|
12
12
|
type OnUserAction<T = any> = (value: T, option: {
|
|
13
13
|
eventType?: Validation.EventType;
|
|
14
14
|
componentId?: string;
|
|
15
|
+
isInspected?: boolean;
|
|
15
16
|
isValidated?: boolean;
|
|
16
17
|
isComposing?: boolean;
|
|
17
18
|
isFocusing?: boolean;
|
|
@@ -58,9 +59,9 @@ export declare namespace InputTypes {
|
|
|
58
59
|
dataValue: T;
|
|
59
60
|
eventType: Validation.EventType;
|
|
60
61
|
eventID: string;
|
|
62
|
+
isInspected?: boolean;
|
|
61
63
|
isFocusing?: boolean;
|
|
62
64
|
isComposing?: boolean;
|
|
63
|
-
isValidating?: boolean;
|
|
64
65
|
};
|
|
65
66
|
type Text = Plain & {
|
|
66
67
|
formatValue: any;
|
package/dist/fn/Input/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import"../../chunk-C5N2D3ZX.js";import*as t from"./Parts";export*from"./Parts";import i from"./Plain";import a from"./Hidden";import p from"./TextField";import n from"./Contenteditable";import m from"./DigitCharacters";import l from"./Time";import
|
|
1
|
+
import"../../chunk-C5N2D3ZX.js";import*as t from"./Parts";export*from"./Parts";import i from"./Plain";import a from"./Hidden";import p from"./TextField";import n from"./Contenteditable";import m from"./DigitCharacters";import l from"./Time";import s from"./Select";import d from"./Autocomplete";import*as r from"./List";import c from"./Search";import x from"./Filer";import y from"./Slider";import T from"./Switch";import f from"./Checker";import g from"./Segmented";import b from"./Color";import S from"./CollectForm";var o;(e=>(e.Plain=i,e.Hidden=a,e.TextField=p,e.Contenteditable=n,e.DigitCharacters=m,e.Time=l,e.Select=s,e.Autocomplete=d,e.List=r.List,e.Radio=r.Radio,e.Checkbox=r.Checkbox,e.Checker=f,e.Search=c,e.Filer=x,e.Slider=y,e.Switch=T,e.Segmented=g,e.Color=b,e.LeftIcon=t.LeftIcon,e.RightIcon=t.RightIcon,e.LeftIndicator=t.LeftIndicator,e.RightIndicator=t.RightIndicator,e.RequiredSign=t.RequiredSign,e.RequiredShortSign=t.RequiredShortSign,e.OmitSign=t.OmitSign,e.CollectForm=S))(o||(o={}));export{o as Input,o as default};
|