amotify 0.2.269 → 0.2.271
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/@utils/config.js +1 -1
- package/dist/fn/Cropper.js +1 -1
- package/dist/fn/Input/Autocomplete.js +1 -1
- package/dist/fn/Input/DigitCharacters.js +1 -1
- package/dist/fn/Input/Filer.js +1 -1
- package/dist/fn/Input/List.js +1 -1
- package/dist/fn/Input/Select.js +1 -1
- package/dist/fn/Input/TextField.js +3 -3
- package/dist/fn/Input/Time/index.js +1 -1
- package/dist/fn/Input/core.js +1 -1
- package/dist/fn/RootViewController.js +1 -1
- package/dist/fn/Sheet.js +1 -1
- package/dist/fn/SwipeView.js +1 -1
- package/dist/fn/Table/cellStyling.js +1 -1
- package/package.json +2 -2
package/dist/@utils/config.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{b as s,c as h}from"../chunk-C5N2D3ZX.js";import
|
|
1
|
+
import{b as s,c as h}from"../chunk-C5N2D3ZX.js";import i,{UUID as l}from"jmini";import{useRefresh as f,ColorObjects as b,SetThemeColorTag as g}from".";let n={sessionUID:l(),appRoot:null,darkMode:"light",themeColor:"comun",roundness:2,isSystemDarkmode:()=>window.matchMedia("(prefers-color-scheme: dark)").matches==!0,deviceIs:"",browserIs:"",isPhone:!1,isTouchDevice:!1,isIOS:!1,screen:{breakpoint:834,phonepoint:690,viewHeight:0,viewWidth:0,isBreakpoint:(e=834)=>window.innerWidth<=e,isPhonepoint:(e=690)=>window.innerWidth<=e}};const o={get:()=>n,set:e=>{n=s(s({},n),e)},update:{themeColor:e=>{if(b.find(d=>d.key==e)||(e="comun"),e==o.get().themeColor)return;o.set(h(s({},o.get()),{themeColor:e}));let t=i(document.body);t.removeClass(t.findClass(/^bdsTC/)).addClass("bdsTC_"+e).callback(()=>{g()}),o.restart()},darkMode:e=>{if(i.is.oneOf(e,"light","dark","dim","auto")||(e="light"),e==o.get().darkMode)return;let t=e=="auto"?o.get().isSystemDarkmode()?"dark":"light":e;o.set(h(s({},o.get()),{darkMode:t}));let d=i(document.body);d.removeClass(d.findClass(/^bdsDM/)).addClass("bdsDM_"+t),o.restart()},roundness:e=>{e>=0&&e<=5||(e=2),e!=o.get().roundness&&(o.set(h(s({},o.get()),{roundness:e})),o.restart(l()))},screen:e=>{o.get().screen=s(s({},o.get().screen),e)}},launch:e=>{const t=window.navigator.userAgent.toLowerCase(),d=t.indexOf("windows nt")!==-1?"windows":t.indexOf("android")!==-1?"android":t.indexOf("iphone")!==-1?"iPhone":t.indexOf("ipad")>-1?"iPad":t.indexOf("mac os x")!==-1?"macOSX":"undefined",u=t.indexOf("msie")!==-1||t.indexOf("trident")!==-1?"ie":t.indexOf("edge")!==-1?"edge":t.indexOf("chrome")!==-1?"chrome":t.indexOf("safari")!==-1?"safari":t.indexOf("firefox")!==-1?"firefox":t.indexOf("opera")!==-1||t.indexOf("opr")!==-1?"opera":"undefined";n.appRoot=e.appRoot||document.body,n.appRoot instanceof HTMLElement&&(n.appRoot.tabIndex=0),i.is.exist(e.roundness)&&o.update.roundness(e.roundness),i.is.exist(e.themeColor)&&o.update.themeColor(e.themeColor),i.is.exist(e.darkMode)&&o.update.darkMode(e.darkMode),n.deviceIs=d,n.browserIs=u,n.isPhone=i.is.oneOf(d,"android","iPhone"),n.isTouchDevice=window.ontouchstart!==void 0&&0<navigator.maxTouchPoints,n.isIOS=i.is.oneOf(d,"iPhone","iPad"),n.isTouchDevice=window.ontouchstart!==void 0&&0<navigator.maxTouchPoints,n.isIOS=i.is.oneOf(d,"iPhone","iPad"),n.screen={breakpoint:834,phonepoint:690,viewHeight:window.innerHeight,viewWidth:window.innerWidth,isBreakpoint:(r=834)=>window.innerWidth<=r,isPhonepoint:(r=690)=>window.innerWidth<=r},i(document.body).addClass(["AMOTIFY_be_body","usrDevice_"+o.get().deviceIs,"bdsDM_"+o.get().darkMode,"bdsTC_"+o.get().themeColor]),i(window).addEvent({eventType:"load",eventID:"windowLoad",callback:()=>{let r=document.body.style,a=i(document.body),m=Number(a.getStyleProperty("--topNavHeight").removeLetters()||0),p=Number(a.getStyleProperty("--footerNavHeight").removeLetters()||0),w=window.innerHeight-m-p;r.setProperty("--viewHeight",window.innerHeight+"px"),r.setProperty("--contentHeight",w+"px")}}).addEvent({eventType:"resize",eventID:"getDeviceInfo",callback:()=>{o.update.screen({viewHeight:window.innerHeight,viewWidth:window.innerWidth});let r=i(document.body),a=window.innerHeight,m=Number(r.getStyleProperty("--topNavHeight").removeLetters()),p=Number(r.getStyleProperty("--footerNavHeight").removeLetters()),c=a-m-p;r.setStyleProperty("--viewHeight",a+"px").setStyleProperty("--sideNavHeight",c+"px").setStyleProperty("--contentHeight",c+"px")}}),g()},restart:e=>{f.release("LaunchReactApp_"+o.get().sessionUID,e)}};export{o as Config,o as default};
|
package/dist/fn/Cropper.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{b as Z,c as ne,e as O}from"../chunk-C5N2D3ZX.js";import{Fragment as Ce,jsx as o,jsxs as m}from"react/jsx-runtime";import C,{Filer as he,UUID as pe,useStore as q}from"jmini";import{$$fromRoot as le}from"../@utils";import{useState as z,useEffect as ee}from"react";import{Box as X,FAI as H,Column as J,FlexMargin as me}from"../atoms";import{Row as B,Literal as w}from"../mols";import{Button as k}from"./Button";import N from"./Sheet";import te from"./Loader";import ae from"./Input";import{faPalette as ue}from"@fortawesome/free-solid-svg-icons/faPalette";import{faBarsStaggered as fe}from"@fortawesome/free-solid-svg-icons/faBarsStaggered";import{faRotateLeft as ge}from"@fortawesome/free-solid-svg-icons/faRotateLeft";import{faRotateRight as de}from"@fortawesome/free-solid-svg-icons/faRotateRight";import{CropperClasses as V}from"../@styles/componentClasses";import j from"./Tooltips";class ve{constructor(e){this.set_scale=e.set_scale,this.val_file=e.val_file,this.develops=e.develops;{let[h,l]=C.is.array(e.use)&&e.use||e.use.split(":").map(r=>Number(r)),p=h/l;this.usage={w:h,h:l,aspect:p}}this.componentId=e.componentId;let c=e.canvas,t=e.picture.image;this.Canvas={elm:c,ctx:c.getContext("2d")};let{width:a,height:i}=t,n=a/i;this.Picture={elm:t,originDataUrl:t.src,aspect:n,revisedAspect:1,rotate:e.picture.rotate,grayScale:e.picture.grayScale,tone:e.picture.tone},this.scale={current:e.scale.default,default:e.scale.default,min:e.scale.min,max:e.scale.max},this.usage.aspect<this.Picture.aspect?this.scale.min=100/n*this.usage.aspect:this.scale.min=100*n/this.usage.aspect,this.pst={frame:{x:0,y:0,w:0,h:0,aspect:1},outImage:{x:0,y:0,w:0,h:0},imageX:a/2,imageY:i/2,centerX:0,centerY:0},this.dragEffectInfo={origin:{x:0,y:0},frameExpandRate:{x:0,y:0}},this.pinchEffectInfo={origin:{x:0,y:0,scale:this.scale.current}},this.frameSizing(),this.modifyImage()}frameSizing(){let e=this.Canvas.elm,c=this.Picture.elm,t=0,a=0;{if(this.usage.aspect==1){let s=e.width*.6666666666666666,v=e.height*(2/3);a=t=Math.min(s,v)}else this.usage.aspect>1?(t=e.width*.9,a=t/this.usage.aspect):(a=e.height*.9,t=a*this.usage.aspect);let r=.85;a>e.height*r&&(a=e.height*r,t=a*this.usage.aspect),t>e.width*r&&(t=e.width*r,a=t/this.usage.aspect)}let{width:i,height:n}=c,h=(e.width-t)/2,l=(e.height-a)/2,p=t/a;this.pst={frame:{x:h,y:l,w:t,h:a,aspect:p},outImage:{x:0,y:0,w:0,h:0},imageX:i/2,imageY:n/2,centerX:e.width/2,centerY:e.height/2}}dragEffect(e){let{eventType:c,x:t,y:a}=e;if(c=="start"){let i=this.Canvas.elm.position();this.dragEffectInfo={origin:{x:t,y:a},frameExpandRate:{x:this.Canvas.elm.width/i.width,y:this.Canvas.elm.height/i.height}}}else{let{origin:i,frameExpandRate:n}=this.dragEffectInfo,h=i.x-t,l=i.y-a,p=this.scale.current*this.Picture.revisedAspect/100,r=h/p*n.x,s=l/p*n.y;c=="move"?this.drawImage(this.pst.imageX+r,this.pst.imageY+s):c=="end"&&this.drawImage(this.pst.imageX+=r,this.pst.imageY+=s)}}pinchEffect(e){let{eventType:c,event:t}=e,{x:a,y:i}=C.getCursor(t.touches[0]),{x:n,y:h}=C.getCursor(t.touches[1]),l=n-a,p=h-i;if(c=="start")this.pinchEffectInfo.origin={x:l,y:p,scale:this.scale.current};else if(c=="move"){let{origin:r}=this.pinchEffectInfo,s=Math.sqrt(Math.pow(r.x,2)+Math.pow(r.y,2)),S=Math.sqrt(Math.pow(l,2)+Math.pow(p,2))/s,g=Number(r.scale*S);this.set_scale(g)}}updateScale(e){let c=e;c=Math.max(c,this.scale.min),c=Math.min(c,this.scale.max),this.scale.current=c,this.drawImage()}updateFilter(e){this.Picture.grayScale=e.grayScale,this.Picture.tone=e.tone,this.Picture.rotate=e.rotate,this.modifyImage()}modifyImage(){return O(this,null,function*(){let{grayScale:e,tone:c,rotate:t}=this.Picture;const a=document.createElement("canvas");let i=a.getContext("2d"),n=yield C.ImageLoader(this.Picture.originDataUrl),h=n.width,l=n.height;(t==90||t==270)&&(h=n.height,l=n.width),a.width=h,a.height=l,e&&(i.filter="grayscale("+e+"%)"),t&&(i.translate(h/2,l/2),i.rotate(t*Math.PI/180),[90,270].includes(t)?i.translate(-l/2,-h/2):i.translate(-h/2,-l/2)),i.drawImage(n,0,0,n.width,n.height);let p=i.getImageData(0,0,a.width,a.height),r=p.data;{e/=100;let g=[[255,255,255],[255,200,100],[170,170,255],[240,200,145],[128,255,255],[255,128,255],[255,255,128],[128,158,169],[128,112,162],[50,192,87],[246,100,140]][c],y=g[0]/255,d=g[1]/255,R=g[2]/255;for(let x=0;x<l;x++)for(let b=0;b<h;b++){var s=(x*h+b)*4;if(e){let D=.3*r[s]+.59*r[s+1]+.11*r[s+2];for(var v=0;v<3;v++){let E=r[s+v];r[s+v]=E+(D-E)*e}}r[s]*=y,r[s+1]*=d,r[s+2]*=R}}i.putImageData(p,0,0);let S=a.toDataURL("image/jpeg");{let g=yield C.ImageLoader(S),{width:y,height:d}=g,R=y/d;this.Picture=ne(Z({},this.Picture),{elm:g,aspect:R,revisedAspect:this.pst.frame.aspect>R?this.pst.frame.w/y:this.pst.frame.h/d})}this.drawImage()})}drawImage(e,c){let{Canvas:{ctx:t,elm:a},pst:{frame:i}}=this;t.clearRect(0,0,this.Canvas.elm.width,this.Canvas.elm.height);let n=e||this.pst.imageX,h=c||this.pst.imageY;{let l=this.scale.current/100,p=this.Picture.revisedAspect*l,r=this.pst.centerX-n*p,s=this.pst.centerY-h*p,v=this.Picture.elm.width*p,S=this.Picture.elm.height*p,g=0,y=0;this.usage.aspect<this.Picture.aspect?(g=v,y=g/this.usage.aspect):(y=S,g=y*this.usage.aspect);{let d=this.pst.frame.x-(v-g)/2,R=this.pst.frame.x+this.pst.frame.w-(v+g)/2,x=this.pst.frame.y-(S-y)/2,b=this.pst.frame.y+this.pst.frame.h-(S+y)/2,D=0;r<R&&(D=r-R),r>d&&(D=r-d);let E=0;s<b&&(E=s-b),s>x&&(E=s-x),this.dragEffectInfo.origin.x+=D/2/this.dragEffectInfo.frameExpandRate.x,this.dragEffectInfo.origin.y+=E/2/this.dragEffectInfo.frameExpandRate.y,r=Math.min(Math.max(r,R),d),s=Math.min(Math.max(s,b),x)}this.pst.outImage={x:r,y:s,w:v,h:S};{let d=1;t.lineWidth=d,t.strokeStyle="#ffffff66",t.strokeRect(r+(v-g)/2-d,s+(S-y)/2-d,g+d*2,y+d*2)}t.drawImage(this.Picture.elm,0,0,this.Picture.elm.width,this.Picture.elm.height,r,s,v,S)}{if(this.usage.aspect==1){t.fillStyle="rgba( 20,24,20,.5 )",t.beginPath();let l=a.width/3*2,p=a.height/3*2,r=Math.min(l,p),s=Math.max(l,p);t.arc(a.width/2,a.height/2,s*1.41,0,Math.PI*2,!0),t.arc(a.width/2,a.height/2,r/2,0,Math.PI*2,!1),t.closePath(),t.fill()}else t.fillStyle="rgba( 20,24,20,.5 )";{let p=C(document.body).getStyleProperty("--color-theme-hsl"),r=2;t.lineWidth=r,t.strokeStyle=`hsla( ${p},1 )`,t.strokeRect(i.x-r,i.y-r,i.w+r*2,i.h+r*2)}}}export(){return O(this,null,function*(){let{Canvas:e,develops:c,Picture:t,pst:{outImage:a,frame:i}}=this,n=a.w/t.elm.width,h=a.h/t.elm.height,l=(i.x-a.x)/n,p=i.w/n,r=(i.y-a.y)/h,s=i.h/h,v=Array.from({length:c.length}),S="image/jpeg";for(let g=0;g<c.length;g++){let{size:y,maxSize:d}=c[g];d=d||{S:1024*20,R:1024*100,L:1024*350}[y];let R={S:140,R:600,L:1200}[y],x=document.createElement("canvas");x.width=p,x.height=s;let b=document.createElement("canvas");b.width=R,b.height=R/this.usage.aspect;let D=x.getContext("2d");if(!D)return;let E=b.getContext("2d");if(!E)return;D.clearRect(0,0,x.width,x.height),D.drawImage(this.Picture.elm,l,r,p,s,0,0,p,s),E.fillStyle="black",E.drawImage(x,0,0,x.width,x.height,0,0,b.width,b.height);let $=b.toDataURL(S),A=yield $.toBlob(S);if(!A)return;if(A.size>=d){let ie=d/A.size;if($=b.toDataURL(S,ie*.92),A=yield $.toBlob(S),!A)return}let re=new File([A],this.val_file.name,{type:S});v[g]=re}return v})}}const se={Core:u=>{let{val_file:e,options:c,finishedCallback:t,abortCallback:a}=u,{use:i,develops:n=[]}=c,[h]=z(pe());const l={scale:{default:120,min:50,max:300},rotate:0,grayScale:0,tone:0};let p=2048*2048,r=1024,[s,v]=z("init"),[S,g]=z(""),[y,d]=z(l.scale.default),[R,x]=z(l.rotate),[b,D]=z(l.grayScale),[E,$]=z(l.tone),[A,re]=z(-1),[ie,ce]=z(-1);return ee(()=>{let f="CropperResize";return C(window).addEvent({eventType:"resize",eventID:f,callback:()=>{C.interval.once(()=>{var G;let I=le("#Canvas-"+h)[0];if(!I)return;let P=(G=q.get(h))==null?void 0:G.Instance;if(!P)return;let W=I.position(),U=W.width/W.height,Y=r,F=Y/U;if(Y*F>p){let K=Y*F/p;Y=Math.floor(Y/Math.sqrt(K)),F=Math.floor(F/Math.sqrt(K))}I.width=r,I.height=F;let{width:L,height:Q}=I;P.pst.centerX=L/2,P.pst.centerY=Q/2,P.frameSizing(),P.modifyImage()},250,"CropperResize")}}),()=>{C(window).removeEvent(f)}},[]),ee(()=>{q.set({[h]:{}}),O(void 0,null,function*(){try{let f=le("#Canvas-"+h)[0];if(!f)return;let I=f.position(),P=I.width/I.height,W=r,U=W/P;if(W*U>p){let _=W*U/p;W=Math.floor(W/Math.sqrt(_)),U=Math.floor(U/Math.sqrt(_))}f.width=W,f.height=U;let Y=he(e),F=yield C.ImageLoader(yield Y.toObjectURL());re(F.width),ce(F.height);let L=new ve({set_scale:d,val_file:e,develops:n,use:i,scale:l.scale,componentId:h,canvas:f,picture:{image:F,grayScale:l.grayScale,tone:l.tone,rotate:l.rotate}});q.set({[h]:{Instance:L}});const Q=function(_){if(_.preventDefault(),_.touches&&_.touches.length>1)L.pinchEffect({eventType:"start",event:_}),C(document).addEvent({eventType:"touchmove",eventID:"CropperEffectMove",options:{passive:!1},callback:M=>{M.preventDefault(),L.pinchEffect({eventType:"move",event:M})}}).addEvent({eventType:"touchend",eventID:"CropperEffectEnd",options:{passive:!1},callback:K});else{L.dragEffect(Z({eventType:"start"},C.getCursor(_)));let{type:M}=_;C(document).addEvent({eventType:M=="touchstart"?"touchmove":"mousemove",eventID:"CropperEffectMove",options:{passive:!1},callback:T=>{G("move",T)}}).addEvent({eventType:M=="touchstart"?"touchend":"mouseup",eventID:"CropperEffectEnd",options:{passive:!1},callback:T=>{G("end",T),K(T)}})}},G=function(_,M){M.preventDefault(),L.dragEffect(Z({eventType:_},C.getCursor(M)))},K=function(_){_.preventDefault(),C(document).removeEvent(["CropperEffectMove","CropperEffectEnd"])};C(f).removeEvent(["CropperMouseWheel","CropperTouchStart","CropperMouseDown"]).addEvent({eventID:"CropperMouseWheel",eventType:"wheel",callback:_=>{_.preventDefault();let M=Number(_.wheelDelta*.04),T=L.scale.current+M;T=Math.max(T,L.scale.min),T=Math.min(T,L.scale.max),d(T)},options:{passive:!1}}).addEvent({eventType:"touchstart",eventID:"CropperTouchStart",callback:Q,options:{passive:!1}}).addEvent({eventType:"mousedown",eventID:"CropperMouseDown",callback:Q,options:{passive:!1}}),yield C.pending(1e3),v("ok")}catch(f){v("error"),g((f==null?void 0:f.message)||C.Stringify(f)),console.error(f)}})},[e.id]),ee(()=>{var I;let f=(I=q.get(h))==null?void 0:I.Instance;f&&f.updateScale(y)},[y]),ee(()=>{var I;let f=(I=q.get(h))==null?void 0:I.Instance;f&&f.updateFilter({grayScale:b,tone:E,rotate:R})},[b,E,R]),o(N.Body,{borderRadius:0,height:"viewHeight",width:"viewWidth",children:m(J,{className:[V("Wrap"),V("Use_"+i)].join(" "),gap:0,height:1,position:"relative",overflow:"hidden",borderRadius:"inherit",children:[m(X,{position:"absolute",top:"50%",left:"50%",flexCenter:!0,freeCSS:{zIndex:2,transform:"translate( -50%,-50% )",pointerEvents:"none"},children:[s=="init"&&o(te.Theme.XL,{showInitial:!0}),s=="error"&&m(w.Supplement,{fontColor:"nega",children:["\u753B\u50CF\u306E\u8AAD\u307F\u8FBC\u307F\u306B\u5931\u6557\u3057\u307E\u3057\u305F",o(w.Description,{children:S})]})]}),m(X,{flexSizing:0,overflow:"hidden",position:"relative",flexCenter:!0,paddingBottom:6,freeCSS:{zIndex:1,backgroundColor:"#000f0f"},children:[o("canvas",{style:{width:"100%",height:"100%"},width:r,height:r,className:V("Canvas"),id:"Canvas-"+h}),o(w.Supplement,{position:"absolute",bottom:1,left:1,right:1,ssCardBox:"plain",boxShadow:"0.max",padding:1,backgroundColor:"layer.0.opa.few",freeCSS:{backdropFilter:"blur(6px)"},children:m(J,{gap:"1/2",children:[m(B.Left,{gap:"1/2",flexWrap:!0,fontColor:"white",fontSize:"0.xs",fontHeight:1.2,children:[m(w,{children:["[",e.type,"]"]}),o(w,{children:e.name}),m(w,{children:[A,"px x ",ie,"px"]}),m(w,{children:["[",e.size.rank(),"B]"]})]}),m(B.Left,{gap:"1/2",verticalAlign:"unset",flexWrap:!0,children:[o(se.SettingRegion,{DefaultOptions:l,val_scale:y,set_scale:d,val_tone:E,set_tone:$,val_grayScale:b,set_grayScale:D,val_rotate:R,set_rotate:x}),o(me,{}),o(k.Border.S,{onClick:()=>{a()},children:"\u9589\u3058\u308B"}),o(k.Prime.S,{boxShadow:"3.remark",onClick:()=>O(void 0,null,function*(){var P;let f=(P=q.get(h))==null?void 0:P.Instance;if(!f)return;te.fn.mini.active("CropperExportation");let I=yield f.export();setTimeout(()=>{te.fn.mini.stop("CropperExportation"),t(I)},1e3)}),children:m(B.Center,{gap:"1/2",children:[o(te.White.R,{loaderID:"CropperExportation"}),"\u6C7A\u5B9A"]})})]})]})})]})]})})},SettingRegion:u=>{let e=["","\u6696\u8272","\u5BD2\u8272","\u30BB\u30D4\u30A2","\u30B7\u30A2\u30F3","\u30DE\u30BC\u30F3\u30BF","\u30A4\u30A8\u30ED\u30FC","\u30AA\u30EA\u30B8\u30CA\u30EB1","\u30AA\u30EA\u30B8\u30CA\u30EB2","\u30AA\u30EA\u30B8\u30CA\u30EB3","\u30AA\u30EA\u30B8\u30CA\u30EB4"],c=t=>e[t]||"\u306A\u3057";return m(Ce,{children:[m(B.Center,{gap:"1/6",children:[m(k.Border.S,{flexCenter:!0,gap:"1/4",border:"unset",borderTopRightRadius:0,borderBottomRightRadius:0,onClick:()=>{let t=u.val_rotate-90;t<0&&(t+=360),u.set_rotate(t)},children:[o(w,{children:"90\xB0"}),o(H,{icon:ge,fontColor:"4.thin"})]}),m(k.Border.S,{flexCenter:!0,gap:"1/4",border:"unset",borderTopLeftRadius:0,borderBottomLeftRadius:0,onClick:()=>{u.set_rotate((u.val_rotate+90)%360)},children:[o(H,{icon:de,fontColor:"4.thin"}),o(w,{children:"90\xB0"})]})]}),m(k.Border.S,{flexCenter:!0,gap:"1/2",border:"unset",onClick:t=>{let a="CropperZoomEdit";j.open({tipsID:a,gravityPoint:3,event:t,closeAtParentBlur:!1,freeCSS:{minWidth:12*26},content:o(N.Body,{children:m(J,{padding:1.5,children:[m(B.Separate,{children:[o(w.Paragraph,{children:m(B.Center,{gap:"1/2",children:[o(H.Search,{fontColor:"5.translucent"}),"Zoom"]})}),o(k.Sub,{color:"cloud",ssSphere:2.5,onClick:()=>{j.close(a)},children:o(H.X,{})})]}),o(X,{borderBottom:!0,opacity:"low"}),o(ae.Slider,{override:"force",value:u.val_scale-u.DefaultOptions.scale.min,min:u.DefaultOptions.scale.min-100,max:u.DefaultOptions.scale.max-100,step:25,onUpdateValidValue:(i,n)=>{C.interval.once(()=>{u.set_scale(i+100)},250,"Cropper.UpdateScale")},onLegendRender:i=>"x"+Math.round(100+i)/100})]})})})},children:[o(w.Supplement,{fontSize:"0.xs",fontColor:"4.thin",children:"Zoom"}),m(w,{unitWidth:4,children:[u.val_scale.rate(1,0),"%"]})]}),m(k.Border.S,{flexCenter:!0,gap:"1/2",border:"unset",onClick:t=>{let a="CropperGrayScaleEdit";j.open({tipsID:a,gravityPoint:3,event:t,closeAtParentBlur:!1,freeCSS:{minWidth:12*26},content:o(N.Body,{children:m(J,{padding:1.5,children:[m(B.Separate,{children:[o(w.Paragraph,{children:m(B.Center,{gap:"1/2",children:[o(H,{icon:ue,fontColor:"5.translucent"}),"Gray Scale"]})}),o(k.Sub,{color:"cloud",ssSphere:2.5,onClick:()=>{j.close(a)},children:o(H.X,{})})]}),o(X,{borderBottom:!0,opacity:"low"}),o(ae.Slider,{value:u.val_grayScale,min:0,max:100,step:10,onUpdateValidValue:i=>{C.interval.once(()=>{u.set_grayScale(i)},250,"Cropper.GrayScale")},onLegendRender:i=>i+"%"})]})})})},children:[o(w.Supplement,{fontSize:"0.xs",fontColor:"4.thin",children:"GrayScale"}),m(w,{children:[u.val_grayScale.rate(1,0),"%"]})]}),m(k.Border.S,{flexCenter:!0,gap:"1/2",border:"unset",onClick:t=>{let a="CropperToneEdit";j.open({tipsID:a,gravityPoint:3,event:t,closeAtParentBlur:!1,freeCSS:{minWidth:12*26,maxWidth:12*24},content:()=>{let i=[];for(let n=1;n<=10;n++)i.push({value:n,label:m(B.Left,{gap:"1/3",children:[o(X,{ssSphere:1,className:[V("ToneBall"),V("ToneBall_"+n)].join(" ")}),o(X,{textAlign:"left",flexSizing:0,children:c(n)})]})});return o(N.Body,{children:m(J,{padding:1.5,children:[m(B.Separate,{children:[o(w.Paragraph,{children:m(B.Center,{gap:"1/2",children:[o(H,{icon:fe,fontColor:"5.translucent"}),"Tone"]})}),o(k.Sub,{color:"cloud",ssSphere:2.5,onClick:()=>{j.close(a)},children:o(H.X,{})})]}),o(X,{borderBottom:!0,opacity:"low"}),o(ae.Radio.Normal,{value:u.val_tone,gap:"1/2",cellStyles:{fontColor:"3.blur"},options:[{value:0,label:o(X,{flexSizing:0,textAlign:"center",children:"\u306A\u3057"})},...i],onUpdateValidValue:n=>{u.set_tone(n)}})]})})}})},children:[o(w.Supplement,{fontSize:"0.xs",fontColor:"4.thin",children:"Tone"}),o(X,{boxShadow:"2.remark",ssSphere:1,className:[V("ToneBall"),V("ToneBall_"+u.val_tone)].join(" ")}),c(u.val_tone)]})]})}},oe={openDialogNEdit:u=>{ae.Filer.fn.openDialog({accept:"image",multiple:!1,onChange:e=>{oe.openEditor(Z({imageFile:e[0]},u))}})},openEditor:u=>O(void 0,null,function*(){let e="CropperImage";N.open("middleCenter",{sheetID:e,size:"MAX",padding:0,margin:0,freeCSS:{maxWidth:"100%"},content:o(se.Core,{val_file:u.imageFile,options:u,finishedCallback:c=>{N.close(e),u.onProcessFinished(c)},abortCallback:()=>{N.close(e)}}),closeAtEscapeKeyDown:!1})})};export{oe as Cropper,oe as default};
|
|
1
|
+
import{b as Z,c as ne,e as V}from"../chunk-C5N2D3ZX.js";import{Fragment as Ce,jsx as o,jsxs as m}from"react/jsx-runtime";import v,{Filer as he,UUID as pe,useStore as q}from"jmini";import{$$fromRoot as le}from"../@utils";import{useState as z,useEffect as ee}from"react";import{Box as X,FAI as H,Column as J,FlexMargin as me}from"../atoms";import{Row as B,Literal as w}from"../mols";import{Button as k}from"./Button";import N from"./Sheet";import te from"./Loader";import ae from"./Input";import{faPalette as ue}from"@fortawesome/free-solid-svg-icons/faPalette";import{faBarsStaggered as fe}from"@fortawesome/free-solid-svg-icons/faBarsStaggered";import{faRotateLeft as ge}from"@fortawesome/free-solid-svg-icons/faRotateLeft";import{faRotateRight as de}from"@fortawesome/free-solid-svg-icons/faRotateRight";import{CropperClasses as O}from"../@styles/componentClasses";import j from"./Tooltips";class ve{constructor(e){this.set_scale=e.set_scale,this.val_file=e.val_file,this.develops=e.develops;{let[h,l]=v.is.array(e.use)&&e.use||e.use.split(":").map(r=>Number(r)),p=h/l;this.usage={w:h,h:l,aspect:p}}this.componentId=e.componentId;let c=e.canvas,t=e.picture.image;this.Canvas={elm:c,ctx:c.getContext("2d")};let{width:a,height:i}=t,n=a/i;this.Picture={elm:t,originDataUrl:t.src,aspect:n,revisedAspect:1,rotate:e.picture.rotate,grayScale:e.picture.grayScale,tone:e.picture.tone},this.scale={current:e.scale.default,default:e.scale.default,min:e.scale.min,max:e.scale.max},this.usage.aspect<this.Picture.aspect?this.scale.min=100/n*this.usage.aspect:this.scale.min=100*n/this.usage.aspect,this.pst={frame:{x:0,y:0,w:0,h:0,aspect:1},outImage:{x:0,y:0,w:0,h:0},imageX:a/2,imageY:i/2,centerX:0,centerY:0},this.dragEffectInfo={origin:{x:0,y:0},frameExpandRate:{x:0,y:0}},this.pinchEffectInfo={origin:{x:0,y:0,scale:this.scale.current}},this.frameSizing(),this.modifyImage()}frameSizing(){let e=this.Canvas.elm,c=this.Picture.elm,t=0,a=0;{if(this.usage.aspect==1){let s=e.width*.6666666666666666,C=e.height*(2/3);a=t=Math.min(s,C)}else this.usage.aspect>1?(t=e.width*.9,a=t/this.usage.aspect):(a=e.height*.9,t=a*this.usage.aspect);let r=.85;a>e.height*r&&(a=e.height*r,t=a*this.usage.aspect),t>e.width*r&&(t=e.width*r,a=t/this.usage.aspect)}let{width:i,height:n}=c,h=(e.width-t)/2,l=(e.height-a)/2,p=t/a;this.pst={frame:{x:h,y:l,w:t,h:a,aspect:p},outImage:{x:0,y:0,w:0,h:0},imageX:i/2,imageY:n/2,centerX:e.width/2,centerY:e.height/2}}dragEffect(e){let{eventType:c,x:t,y:a}=e;if(c=="start"){let i=this.Canvas.elm.position();this.dragEffectInfo={origin:{x:t,y:a},frameExpandRate:{x:this.Canvas.elm.width/i.width,y:this.Canvas.elm.height/i.height}}}else{let{origin:i,frameExpandRate:n}=this.dragEffectInfo,h=i.x-t,l=i.y-a,p=this.scale.current*this.Picture.revisedAspect/100,r=h/p*n.x,s=l/p*n.y;c=="move"?this.drawImage(this.pst.imageX+r,this.pst.imageY+s):c=="end"&&this.drawImage(this.pst.imageX+=r,this.pst.imageY+=s)}}pinchEffect(e){let{eventType:c,event:t}=e,{x:a,y:i}=v.getCursor(t.touches[0]),{x:n,y:h}=v.getCursor(t.touches[1]),l=n-a,p=h-i;if(c=="start")this.pinchEffectInfo.origin={x:l,y:p,scale:this.scale.current};else if(c=="move"){let{origin:r}=this.pinchEffectInfo,s=Math.sqrt(Math.pow(r.x,2)+Math.pow(r.y,2)),S=Math.sqrt(Math.pow(l,2)+Math.pow(p,2))/s,g=Number(r.scale*S);this.set_scale(g)}}updateScale(e){let c=e;c=Math.max(c,this.scale.min),c=Math.min(c,this.scale.max),this.scale.current=c,this.drawImage()}updateFilter(e){this.Picture.grayScale=e.grayScale,this.Picture.tone=e.tone,this.Picture.rotate=e.rotate,this.modifyImage()}modifyImage(){return V(this,null,function*(){let{grayScale:e,tone:c,rotate:t}=this.Picture;const a=document.createElement("canvas");let i=a.getContext("2d"),n=yield v.ImageLoader(this.Picture.originDataUrl),h=n.width,l=n.height;(t==90||t==270)&&(h=n.height,l=n.width),a.width=h,a.height=l,e&&(i.filter="grayscale("+e+"%)"),t&&(i.translate(h/2,l/2),i.rotate(t*Math.PI/180),v.is.oneOf(t,90,270)?i.translate(-l/2,-h/2):i.translate(-h/2,-l/2)),i.drawImage(n,0,0,n.width,n.height);let p=i.getImageData(0,0,a.width,a.height),r=p.data;{e/=100;let g=[[255,255,255],[255,200,100],[170,170,255],[240,200,145],[128,255,255],[255,128,255],[255,255,128],[128,158,169],[128,112,162],[50,192,87],[246,100,140]][c],y=g[0]/255,d=g[1]/255,R=g[2]/255;for(let x=0;x<l;x++)for(let b=0;b<h;b++){var s=(x*h+b)*4;if(e){let D=.3*r[s]+.59*r[s+1]+.11*r[s+2];for(var C=0;C<3;C++){let E=r[s+C];r[s+C]=E+(D-E)*e}}r[s]*=y,r[s+1]*=d,r[s+2]*=R}}i.putImageData(p,0,0);let S=a.toDataURL("image/jpeg");{let g=yield v.ImageLoader(S),{width:y,height:d}=g,R=y/d;this.Picture=ne(Z({},this.Picture),{elm:g,aspect:R,revisedAspect:this.pst.frame.aspect>R?this.pst.frame.w/y:this.pst.frame.h/d})}this.drawImage()})}drawImage(e,c){let{Canvas:{ctx:t,elm:a},pst:{frame:i}}=this;t.clearRect(0,0,this.Canvas.elm.width,this.Canvas.elm.height);let n=e||this.pst.imageX,h=c||this.pst.imageY;{let l=this.scale.current/100,p=this.Picture.revisedAspect*l,r=this.pst.centerX-n*p,s=this.pst.centerY-h*p,C=this.Picture.elm.width*p,S=this.Picture.elm.height*p,g=0,y=0;this.usage.aspect<this.Picture.aspect?(g=C,y=g/this.usage.aspect):(y=S,g=y*this.usage.aspect);{let d=this.pst.frame.x-(C-g)/2,R=this.pst.frame.x+this.pst.frame.w-(C+g)/2,x=this.pst.frame.y-(S-y)/2,b=this.pst.frame.y+this.pst.frame.h-(S+y)/2,D=0;r<R&&(D=r-R),r>d&&(D=r-d);let E=0;s<b&&(E=s-b),s>x&&(E=s-x),this.dragEffectInfo.origin.x+=D/2/this.dragEffectInfo.frameExpandRate.x,this.dragEffectInfo.origin.y+=E/2/this.dragEffectInfo.frameExpandRate.y,r=Math.min(Math.max(r,R),d),s=Math.min(Math.max(s,b),x)}this.pst.outImage={x:r,y:s,w:C,h:S};{let d=1;t.lineWidth=d,t.strokeStyle="#ffffff66",t.strokeRect(r+(C-g)/2-d,s+(S-y)/2-d,g+d*2,y+d*2)}t.drawImage(this.Picture.elm,0,0,this.Picture.elm.width,this.Picture.elm.height,r,s,C,S)}{if(this.usage.aspect==1){t.fillStyle="rgba( 20,24,20,.5 )",t.beginPath();let l=a.width/3*2,p=a.height/3*2,r=Math.min(l,p),s=Math.max(l,p);t.arc(a.width/2,a.height/2,s*1.41,0,Math.PI*2,!0),t.arc(a.width/2,a.height/2,r/2,0,Math.PI*2,!1),t.closePath(),t.fill()}else t.fillStyle="rgba( 20,24,20,.5 )";{let p=v(document.body).getStyleProperty("--color-theme-hsl"),r=2;t.lineWidth=r,t.strokeStyle=`hsla( ${p},1 )`,t.strokeRect(i.x-r,i.y-r,i.w+r*2,i.h+r*2)}}}export(){return V(this,null,function*(){let{Canvas:e,develops:c,Picture:t,pst:{outImage:a,frame:i}}=this,n=a.w/t.elm.width,h=a.h/t.elm.height,l=(i.x-a.x)/n,p=i.w/n,r=(i.y-a.y)/h,s=i.h/h,C=Array.from({length:c.length}),S="image/jpeg";for(let g=0;g<c.length;g++){let{size:y,maxSize:d}=c[g];d=d||{S:1024*20,R:1024*100,L:1024*350}[y];let R={S:140,R:600,L:1200}[y],x=document.createElement("canvas");x.width=p,x.height=s;let b=document.createElement("canvas");b.width=R,b.height=R/this.usage.aspect;let D=x.getContext("2d");if(!D)return;let E=b.getContext("2d");if(!E)return;D.clearRect(0,0,x.width,x.height),D.drawImage(this.Picture.elm,l,r,p,s,0,0,p,s),E.fillStyle="black",E.drawImage(x,0,0,x.width,x.height,0,0,b.width,b.height);let $=b.toDataURL(S),A=yield $.toBlob(S);if(!A)return;if(A.size>=d){let ie=d/A.size;if($=b.toDataURL(S,ie*.92),A=yield $.toBlob(S),!A)return}let re=new File([A],this.val_file.name,{type:S});C[g]=re}return C})}}const se={Core:u=>{let{val_file:e,options:c,finishedCallback:t,abortCallback:a}=u,{use:i,develops:n=[]}=c,[h]=z(pe());const l={scale:{default:120,min:50,max:300},rotate:0,grayScale:0,tone:0};let p=2048*2048,r=1024,[s,C]=z("init"),[S,g]=z(""),[y,d]=z(l.scale.default),[R,x]=z(l.rotate),[b,D]=z(l.grayScale),[E,$]=z(l.tone),[A,re]=z(-1),[ie,ce]=z(-1);return ee(()=>{let f="CropperResize";return v(window).addEvent({eventType:"resize",eventID:f,callback:()=>{v.interval.once(()=>{var G;let I=le("#Canvas-"+h)[0];if(!I)return;let P=(G=q.get(h))==null?void 0:G.Instance;if(!P)return;let W=I.position(),U=W.width/W.height,Y=r,F=Y/U;if(Y*F>p){let K=Y*F/p;Y=Math.floor(Y/Math.sqrt(K)),F=Math.floor(F/Math.sqrt(K))}I.width=r,I.height=F;let{width:L,height:Q}=I;P.pst.centerX=L/2,P.pst.centerY=Q/2,P.frameSizing(),P.modifyImage()},250,"CropperResize")}}),()=>{v(window).removeEvent(f)}},[]),ee(()=>{q.set({[h]:{}}),V(void 0,null,function*(){try{let f=le("#Canvas-"+h)[0];if(!f)return;let I=f.position(),P=I.width/I.height,W=r,U=W/P;if(W*U>p){let _=W*U/p;W=Math.floor(W/Math.sqrt(_)),U=Math.floor(U/Math.sqrt(_))}f.width=W,f.height=U;let Y=he(e),F=yield v.ImageLoader(yield Y.toObjectURL());re(F.width),ce(F.height);let L=new ve({set_scale:d,val_file:e,develops:n,use:i,scale:l.scale,componentId:h,canvas:f,picture:{image:F,grayScale:l.grayScale,tone:l.tone,rotate:l.rotate}});q.set({[h]:{Instance:L}});const Q=function(_){if(_.preventDefault(),_.touches&&_.touches.length>1)L.pinchEffect({eventType:"start",event:_}),v(document).addEvent({eventType:"touchmove",eventID:"CropperEffectMove",options:{passive:!1},callback:M=>{M.preventDefault(),L.pinchEffect({eventType:"move",event:M})}}).addEvent({eventType:"touchend",eventID:"CropperEffectEnd",options:{passive:!1},callback:K});else{L.dragEffect(Z({eventType:"start"},v.getCursor(_)));let{type:M}=_;v(document).addEvent({eventType:M=="touchstart"?"touchmove":"mousemove",eventID:"CropperEffectMove",options:{passive:!1},callback:T=>{G("move",T)}}).addEvent({eventType:M=="touchstart"?"touchend":"mouseup",eventID:"CropperEffectEnd",options:{passive:!1},callback:T=>{G("end",T),K(T)}})}},G=function(_,M){M.preventDefault(),L.dragEffect(Z({eventType:_},v.getCursor(M)))},K=function(_){_.preventDefault(),v(document).removeEvent(["CropperEffectMove","CropperEffectEnd"])};v(f).removeEvent(["CropperMouseWheel","CropperTouchStart","CropperMouseDown"]).addEvent({eventID:"CropperMouseWheel",eventType:"wheel",callback:_=>{_.preventDefault();let M=Number(_.wheelDelta*.04),T=L.scale.current+M;T=Math.max(T,L.scale.min),T=Math.min(T,L.scale.max),d(T)},options:{passive:!1}}).addEvent({eventType:"touchstart",eventID:"CropperTouchStart",callback:Q,options:{passive:!1}}).addEvent({eventType:"mousedown",eventID:"CropperMouseDown",callback:Q,options:{passive:!1}}),yield v.pending(1e3),C("ok")}catch(f){C("error"),g((f==null?void 0:f.message)||v.Stringify(f)),console.error(f)}})},[e.id]),ee(()=>{var I;let f=(I=q.get(h))==null?void 0:I.Instance;f&&f.updateScale(y)},[y]),ee(()=>{var I;let f=(I=q.get(h))==null?void 0:I.Instance;f&&f.updateFilter({grayScale:b,tone:E,rotate:R})},[b,E,R]),o(N.Body,{borderRadius:0,height:"viewHeight",width:"viewWidth",children:m(J,{className:[O("Wrap"),O("Use_"+i)].join(" "),gap:0,height:1,position:"relative",overflow:"hidden",borderRadius:"inherit",children:[m(X,{position:"absolute",top:"50%",left:"50%",flexCenter:!0,freeCSS:{zIndex:2,transform:"translate( -50%,-50% )",pointerEvents:"none"},children:[s=="init"&&o(te.Theme.XL,{showInitial:!0}),s=="error"&&m(w.Supplement,{fontColor:"nega",children:["\u753B\u50CF\u306E\u8AAD\u307F\u8FBC\u307F\u306B\u5931\u6557\u3057\u307E\u3057\u305F",o(w.Description,{children:S})]})]}),m(X,{flexSizing:0,overflow:"hidden",position:"relative",flexCenter:!0,paddingBottom:6,freeCSS:{zIndex:1,backgroundColor:"#000f0f"},children:[o("canvas",{style:{width:"100%",height:"100%"},width:r,height:r,className:O("Canvas"),id:"Canvas-"+h}),o(w.Supplement,{position:"absolute",bottom:1,left:1,right:1,ssCardBox:"plain",boxShadow:"0.max",padding:1,backgroundColor:"layer.0.opa.few",freeCSS:{backdropFilter:"blur(6px)"},children:m(J,{gap:"1/2",children:[m(B.Left,{gap:"1/2",flexWrap:!0,fontColor:"white",fontSize:"0.xs",fontHeight:1.2,children:[m(w,{children:["[",e.type,"]"]}),o(w,{children:e.name}),m(w,{children:[A,"px x ",ie,"px"]}),m(w,{children:["[",e.size.rank(),"B]"]})]}),m(B.Left,{gap:"1/2",verticalAlign:"unset",flexWrap:!0,children:[o(se.SettingRegion,{DefaultOptions:l,val_scale:y,set_scale:d,val_tone:E,set_tone:$,val_grayScale:b,set_grayScale:D,val_rotate:R,set_rotate:x}),o(me,{}),o(k.Border.S,{onClick:()=>{a()},children:"\u9589\u3058\u308B"}),o(k.Prime.S,{boxShadow:"3.remark",onClick:()=>V(void 0,null,function*(){var P;let f=(P=q.get(h))==null?void 0:P.Instance;if(!f)return;te.fn.mini.active("CropperExportation");let I=yield f.export();setTimeout(()=>{te.fn.mini.stop("CropperExportation"),t(I)},1e3)}),children:m(B.Center,{gap:"1/2",children:[o(te.White.R,{loaderID:"CropperExportation"}),"\u6C7A\u5B9A"]})})]})]})})]})]})})},SettingRegion:u=>{let e=["","\u6696\u8272","\u5BD2\u8272","\u30BB\u30D4\u30A2","\u30B7\u30A2\u30F3","\u30DE\u30BC\u30F3\u30BF","\u30A4\u30A8\u30ED\u30FC","\u30AA\u30EA\u30B8\u30CA\u30EB1","\u30AA\u30EA\u30B8\u30CA\u30EB2","\u30AA\u30EA\u30B8\u30CA\u30EB3","\u30AA\u30EA\u30B8\u30CA\u30EB4"],c=t=>e[t]||"\u306A\u3057";return m(Ce,{children:[m(B.Center,{gap:"1/6",children:[m(k.Border.S,{flexCenter:!0,gap:"1/4",border:"unset",borderTopRightRadius:0,borderBottomRightRadius:0,onClick:()=>{let t=u.val_rotate-90;t<0&&(t+=360),u.set_rotate(t)},children:[o(w,{children:"90\xB0"}),o(H,{icon:ge,fontColor:"4.thin"})]}),m(k.Border.S,{flexCenter:!0,gap:"1/4",border:"unset",borderTopLeftRadius:0,borderBottomLeftRadius:0,onClick:()=>{u.set_rotate((u.val_rotate+90)%360)},children:[o(H,{icon:de,fontColor:"4.thin"}),o(w,{children:"90\xB0"})]})]}),m(k.Border.S,{flexCenter:!0,gap:"1/2",border:"unset",onClick:t=>{let a="CropperZoomEdit";j.open({tipsID:a,gravityPoint:3,event:t,closeAtParentBlur:!1,freeCSS:{minWidth:12*26},content:o(N.Body,{children:m(J,{padding:1.5,children:[m(B.Separate,{children:[o(w.Paragraph,{children:m(B.Center,{gap:"1/2",children:[o(H.Search,{fontColor:"5.translucent"}),"Zoom"]})}),o(k.Sub,{color:"cloud",ssSphere:2.5,onClick:()=>{j.close(a)},children:o(H.X,{})})]}),o(X,{borderBottom:!0,opacity:"low"}),o(ae.Slider,{override:"force",value:u.val_scale-u.DefaultOptions.scale.min,min:u.DefaultOptions.scale.min-100,max:u.DefaultOptions.scale.max-100,step:25,onUpdateValidValue:(i,n)=>{v.interval.once(()=>{u.set_scale(i+100)},250,"Cropper.UpdateScale")},onLegendRender:i=>"x"+Math.round(100+i)/100})]})})})},children:[o(w.Supplement,{fontSize:"0.xs",fontColor:"4.thin",children:"Zoom"}),m(w,{unitWidth:4,children:[u.val_scale.rate(1,0),"%"]})]}),m(k.Border.S,{flexCenter:!0,gap:"1/2",border:"unset",onClick:t=>{let a="CropperGrayScaleEdit";j.open({tipsID:a,gravityPoint:3,event:t,closeAtParentBlur:!1,freeCSS:{minWidth:12*26},content:o(N.Body,{children:m(J,{padding:1.5,children:[m(B.Separate,{children:[o(w.Paragraph,{children:m(B.Center,{gap:"1/2",children:[o(H,{icon:ue,fontColor:"5.translucent"}),"Gray Scale"]})}),o(k.Sub,{color:"cloud",ssSphere:2.5,onClick:()=>{j.close(a)},children:o(H.X,{})})]}),o(X,{borderBottom:!0,opacity:"low"}),o(ae.Slider,{value:u.val_grayScale,min:0,max:100,step:10,onUpdateValidValue:i=>{v.interval.once(()=>{u.set_grayScale(i)},250,"Cropper.GrayScale")},onLegendRender:i=>i+"%"})]})})})},children:[o(w.Supplement,{fontSize:"0.xs",fontColor:"4.thin",children:"GrayScale"}),m(w,{children:[u.val_grayScale.rate(1,0),"%"]})]}),m(k.Border.S,{flexCenter:!0,gap:"1/2",border:"unset",onClick:t=>{let a="CropperToneEdit";j.open({tipsID:a,gravityPoint:3,event:t,closeAtParentBlur:!1,freeCSS:{minWidth:12*26,maxWidth:12*24},content:()=>{let i=[];for(let n=1;n<=10;n++)i.push({value:n,label:m(B.Left,{gap:"1/3",children:[o(X,{ssSphere:1,className:[O("ToneBall"),O("ToneBall_"+n)].join(" ")}),o(X,{textAlign:"left",flexSizing:0,children:c(n)})]})});return o(N.Body,{children:m(J,{padding:1.5,children:[m(B.Separate,{children:[o(w.Paragraph,{children:m(B.Center,{gap:"1/2",children:[o(H,{icon:fe,fontColor:"5.translucent"}),"Tone"]})}),o(k.Sub,{color:"cloud",ssSphere:2.5,onClick:()=>{j.close(a)},children:o(H.X,{})})]}),o(X,{borderBottom:!0,opacity:"low"}),o(ae.Radio.Normal,{value:u.val_tone,gap:"1/2",cellStyles:{fontColor:"3.blur"},options:[{value:0,label:o(X,{flexSizing:0,textAlign:"center",children:"\u306A\u3057"})},...i],onUpdateValidValue:n=>{u.set_tone(n)}})]})})}})},children:[o(w.Supplement,{fontSize:"0.xs",fontColor:"4.thin",children:"Tone"}),o(X,{boxShadow:"2.remark",ssSphere:1,className:[O("ToneBall"),O("ToneBall_"+u.val_tone)].join(" ")}),c(u.val_tone)]})]})}},oe={openDialogNEdit:u=>{ae.Filer.fn.openDialog({accept:"image",multiple:!1,onChange:e=>{oe.openEditor(Z({imageFile:e[0]},u))}})},openEditor:u=>V(void 0,null,function*(){let e="CropperImage";N.open("middleCenter",{sheetID:e,size:"MAX",padding:0,margin:0,freeCSS:{maxWidth:"100%"},content:o(se.Core,{val_file:u.imageFile,options:u,finishedCallback:c=>{N.close(e),u.onProcessFinished(c)},abortCallback:()=>{N.close(e)}}),closeAtEscapeKeyDown:!1})})};export{oe as Cropper,oe as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{b as l,c as f,d as G,e as H}from"../../chunk-C5N2D3ZX.js";import{Fragment as N,jsx as s,jsxs as V}from"react/jsx-runtime";import{useState as A,useEffect as F,useRef as ne}from"react";import p,{UUID as v}from"jmini";import{Config as oe}from"../../@utils";import{Box as X,Span as ie,FAI as B,Column as q}from"../../atoms";import{Literal as W,Row as K}from"../../mols";import{Button as $}from"../Button";import{Loader as le}from"../Loader";import{Sheet as ae}from"../Sheet";import{OptionalInputWrapper as re,BoxWrapper as se,CoreEffects as z,DefaultBoxishStyles as ue}from"./core";import{InputAutocompleteClasses as L}from"../../@styles/componentClasses";import{InputLabel as ce}from"./Label";import{RightIcon as Q}from".";function pe(t){let{value:e,states:i}=t,{required:r,options:d,min:m,max:o}=i;m=m||0,o=o||65535;let n=[],c=e.filter(h=>h!==null).length;return r&&(c||n.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"})),c<m&&n.push({type:"invalid",label:m+"\u500B\u4EE5\u4E0A\u9078\u629E\u3057\u3066\u304F\u3060\u3055\u3044"}),c>o&&n.push({type:"invalid",label:o+"\u500B\u307E\u3067\u9078\u629E\u3067\u304D\u307E\u3059"}),{ok:!n.filter(({type:h})=>h=="invalid").length,notice:n}}const C={InitOptions:t=>{let e=[];return t.forEach(i=>{if(!i)return;let{type:r,label:d,value:m,searchValue:o}=i,n=o||p.is.string(d)&&d||""||p.is.string(m)&&m||p.Stringify(m||"")||"";p.is.nullish(d)&&(d=String(m)),e.push(f(l({id:v(8)},i),{searchValue:n,type:r||"selector",label:d,value:m}))}),e},FilterSelectableOptions:(t,e,i)=>{let r=t;return i||(r=t.filter(d=>(d==null?void 0:d.type)!="label")),p.scope(()=>{if(!e)return;let d=e.toLower().replace(/ /g,"");r=r.filter(m=>(m.searchValue||"").toLower().replace(/ /g,"").includes(d))}),r},Button:t=>{let{rootStates:e,val_keyword:i,set_keyword:r,val_optionFocused:d,set_optionFocused:m,val_status:o,set_status:n}=t,J=e,{tone:c,required:h,form:k,className:a,multiSelect:u,enableFormSubmit:y,checkValidationAtFirst:S,onValidate:g,onValidateDelay:I,onUpdateValue:R,onUpdateValidValue:x,onUserAction:P,value:E="",options:w,leftIndicator:O,rightIndicator:_,leftIcon:de,rightIcon:fe,componentId:me,status_id:Se,wrapStyles:ve,emptySelect:ye,searchInputPlaceholder:he,onSelectedRender:ge,onSelectorRender:Ie,pickerStyles:be,pickerPosition:ke,onDynamicSearchOptions:_e,onDynamicSearchOptionsDelay:we}=J,T=G(J,["tone","required","form","className","multiSelect","enableFormSubmit","checkValidationAtFirst","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","onUserAction","value","options","leftIndicator","rightIndicator","leftIcon","rightIcon","componentId","status_id","wrapStyles","emptySelect","searchInputPlaceholder","onSelectedRender","onSelectorRender","pickerStyles","pickerPosition","onDynamicSearchOptions","onDynamicSearchOptionsDelay"]),M="SearchInput_"+e.componentId;return F(()=>{var b;if(e.disabled||!o.isPickerOpen||p.is.exist(d))return;let D=C.FilterSelectableOptions(t.val_options,i,!1);m(((b=D[0])==null?void 0:b.id)||"")},[i]),F(()=>{if(o.eventType!="init"&&o.eventType!="override"&&e.max==o.rawValue.length){r(""),n(D=>f(l({},D),{eventID:v(8),isPickerOpen:!1}));return}},[o.rawValue]),F(()=>{let D="autocomplete-click-"+e.componentId;if(!o.isPickerOpen){p(document).removeEvent([D]);return}p('[data-input-origin="'+e.componentId+'"]')&&p(document).addEvent({eventID:D,eventType:"mousedown",callback:U=>{let j=p(U.target),Z=!!p(j).parent("."+L("Core")).length,ee=!!p(j).parent("."+L("Selector")).length;Z||ee||n(te=>f(l({},te),{eventID:v(8),isFocusing:!1,isPickerOpen:!1}))},options:{passive:!1}})},[o.isPickerOpen]),V(N,{children:[s(X,f(l({tabIndex:-1},T),{"data-disabled":e.disabled,"data-show-validation":z.isShowValidation(o,!!S),"data-component-id":o.componentId,"data-input-origin":o.componentId,"data-focus":o.isFocusing||o.isPickerOpen,className:[a,L("Core")].join(" "),onClick:D=>{if(T!=null&&T.onClick&&(T==null||T.onClick(D)),e.disabled)return;let b=document.activeElement;(b==null?void 0:b.id)!=M&&(oe.get().isTouchDevice||p("#"+M).focus()),n(U=>f(l({},U),{eventID:v(8),isPickerOpen:!0,isFocusing:!0}))},onKeyDown:D=>{let b=document.activeElement;(b==null?void 0:b.id)!=M&&(D.preventDefault(),p("#"+M).focus())},children:V(K.Left,{gap:0,children:[s(ie,{width:0,overflow:"hidden",opacity:"trans",children:"A"}),V(K.Left,{flexWrap:!0,flexSizing:0,gap:"1/2",verticalAlign:"unset",freeCSS:{letterSpacing:".5px"},children:[s(C.Selected,l({},t)),s(C.SearchInput,l({},t))]}),o.rawValue.length>1&&s($.Clear,{tabIndex:-1,color:"nega",fontColor:"4.thin",ssSphere:2,onClick:D=>{n(b=>f(l({},b),{eventType:"update",eventID:v(8),rawValue:[]}))},children:s(B.X,{})})]})})),s(C.Picker,l({},t))]})},SearchInput:t=>{let{rootStates:e,val_status:i,set_status:r}=t;if(e.disabled)return null;let d=!!i.isFocusing||!!i.isPickerOpen||!!i.rawValue.length;i.isFocusing||e.multiSelect||i.rawValue.length&&(d=!1);let m=e.searchInputPlaceholder||"\u691C\u7D22...";return s(X,{htmlTag:"input",id:"SearchInput_"+e.componentId,"data-input-value-shallow":i.componentId,placeholder:m,opacity:d?"max":"trans",transition:"middle",flexSizing:0,fontSize:"inherit",border:"0.trans",backgroundColor:"trans",isRounded:!0,padding:[0,"2/3"],value:t.val_keyword,className:[L("SearchInput"),d&&L("isActive")].join(" "),freeCSS:{outline:"none",minWidth:12*4},onFocus:o=>{r(n=>f(l({},n),{eventID:v(8),isFocusing:!0,isPickerOpen:!0}))},onBlur:o=>H(void 0,null,function*(){r(n=>f(l({},n),{eventID:v(8),isFocusing:!1}))}),onCompositionStart:o=>{r(n=>f(l({},n),{eventID:v(8),isComposing:!0}))},onCompositionEnd:o=>{r(n=>f(l({},n),{eventID:v(8),isComposing:!1}))},onKeyDown:o=>{let{key:n,metaKey:c,ctrlKey:h}=o,k=c||h;n=="Escape"?r(a=>f(l({},a),{eventID:v(12),isPickerOpen:!1})):n=="Tab"?r(a=>f(l({},a),{eventID:v(8),isFocusing:!1,isPickerOpen:!1})):n==" "?p.scope(()=>{i.isPickerOpen||t.val_keyword||(o.preventDefault(),r(a=>f(l({},a),{eventID:v(8),isPickerOpen:!0})))}):n=="Backspace"?p.scope(()=>{if(t.val_keyword)return;let a=[...t.val_status.rawValue];a.pop(),k&&(a=[]),r(u=>f(l({},u),{rawValue:a,eventType:"update",eventID:v(8),isInspected:!1}))}):n=="Enter"&&p.scope(()=>{if(i.isComposing||(o==null?void 0:o.keyCode)===229)return;if(!i.isPickerOpen){r(y=>f(l({},y),{eventID:v(8),isPickerOpen:!0}));return}if(!t.val_optionFocused)return;let a=t.val_options.find(y=>(y==null?void 0:y.id)==t.val_optionFocused);if(!a)return;let{value:u}=a;r(y=>{let S=[...y.rawValue];return p.scope(()=>{if(u===null)return S=[];y.rawValue.includes(u)?S=S.filter(I=>I!==u):e.multiSelect?S.push(u):S=[u]}),f(l({},y),{rawValue:S,eventType:"update",eventID:v(8),isInspected:!1})}),t.set_optionsModified(!0),t.set_keyword("")}),p.scope(()=>{if(!["ArrowDown","ArrowUp"].includes(n))return;if(o.preventDefault(),!i.isPickerOpen){r(g=>f(l({},g),{eventID:v(8),isPickerOpen:!0}));return}let a=n=="ArrowDown"?1:-1,u=C.FilterSelectableOptions(t.val_options,t.val_keyword),y=u.length-1,S=null;p.scope(()=>{var I,R,x,P,E,w,O;let g=u.findIndex(_=>(_==null?void 0:_.id)==t.val_optionFocused);if(g==-1){S=(I=u[0])==null?void 0:I.id;return}if(a==1){if(S=(R=u[0])==null?void 0:R.id,k){S=(x=u[y])==null?void 0:x.id;return}if(g==-1||g==y)return;S=(P=u[g+1])==null?void 0:P.id}else{if(S=(E=u[y])==null?void 0:E.id,k){S=(w=u[0])==null?void 0:w.id;return}if(g==-1||g==0)return;S=(O=u[g-1])==null?void 0:O.id}}),t.set_optionFocused(S)}),e.enableFormSubmit&&z.SubmitForm(o,t.rootStates.form)},onChange:o=>{let c=o.target.value;t.set_keyword(c),t.set_optionFocused(""),c&&r(h=>f(l({},h),{eventID:v(8),isPickerOpen:!0}))}},"searchInput")},Picker:t=>{var n;let{rootStates:e,val_status:i}=t,[r,d]=A("idle");F(()=>{if(!e.onDynamicSearchOptions||!i.isPickerOpen)return;if(t.val_optionsModified)return t.set_optionsModified(!1);if(i.isComposing)return;d("fetch");let c="autocomplete-search-"+e.componentId;t.set_optionFocused(""),p.interval.once(()=>H(void 0,null,function*(){var a;let h=yield e.onDynamicSearchOptions(t.val_keyword);d("idle");let k=C.InitOptions(h||[]);t.set_options(k),t.set_optionFocused(((a=k[0])==null?void 0:a.id)||"")}),e.onDynamicSearchOptionsDelay||500,c)},[t.val_keyword,i.isComposing]),F(()=>{let c=p(`[data-selector-id="${i.componentId}"]`)[0];if(!c)return;let h=p(`[data-autocomplete-input-value="${t.val_optionFocused}"]`)[0];h&&(c.scrollTop=h.offsetTop-24)},[t.val_optionFocused]);let m=C.FilterSelectableOptions(t.val_options,e.onDynamicSearchOptions?"":t.val_keyword,!0),o={};{let c=e.pickerPosition||0;[1,2].includes(c)?o.bottom="100%":[3,4].includes(c)&&(o.top="100%"),[1,3].includes(c)?o.left=0:[2,4].includes(c)&&(o.right=0)}return i.isPickerOpen?s(X,f(l({position:"absolute",padding:"1/3"},o),{freeCSS:l({minWidth:"75%",zIndex:1e3},o.freeCSS),children:s(ae.Body,f(l({className:L("Selector"),borderRadius:"2.tone.secondary",ssCardBox:!0,tabIndex:-1,boxShadow:"1.normal",overflow:"auto","data-selector-id":i.componentId},e.pickerStyles),{freeCSS:l({maxHeight:12*24},(n=e.pickerStyles)==null?void 0:n.freeCSS),children:V(q,{gap:"1/12",padding:[1,0],children:[r=="fetch"&&s(K.Center,{padding:"1/2",children:s(le.Theme.R,{showInitial:!0})}),r!="fetch"&&V(N,{children:[!m.length&&s(W.Supplement,{padding:[0,1],fontColor:"4.thin",children:"\u5019\u88DC\u304C\u898B\u3064\u304B\u308A\u307E\u305B\u3093"}),m.map((c,h)=>{if(!c)return null;let{type:k,value:a}=c,u=t.val_optionFocused==c.id,y=i.rawValue.includes(a),S=e.onSelectorRender;return s(q,{"data-autocomplete-input-value":c.id,children:s(S,{option:c,isFocused:u,isSelected:y,onAdd:()=>{t.set_status(g=>{let I=[...g.rawValue];return p.scope(()=>{if(a===null)return I=[];if(g.rawValue.includes(a)){I=I.filter(x=>x!==a);return}e.multiSelect?I.push(a):I=[a]}),f(l({},g),{rawValue:I,eventType:"update",eventID:v(8),isFocusing:e.max!=I.length,isInspected:!1})})},onKeyDown:g=>{let{key:I}=g;I=="Tab"&&(t.set_optionFocused(""),t.set_status(R=>f(l({},R),{eventID:v(8),isPickerOpen:!1,isFocusing:!1})))}})},c.id)})]})]})}))})):null},Selected:t=>{let{rootStates:e,val_status:i,set_status:r,val_optionsDict:d}=t,m=[];return i.rawValue.forEach(o=>{let n=d[p.Stringify(o)];if(!n)return;let c=e.onSelectedRender,h=(n==null?void 0:n.selectedLabel)||(n==null?void 0:n.label);(n==null?void 0:n.value)===null&&(h=""),m.push(s(q,{position:"relative",flexCenter:!0,freeCSS:{userSelect:"none"},children:s(c,{value:n==null?void 0:n.value,label:h,onRemove:k=>{if(e.disabled)return;let a=[...i.rawValue];a=a.filter(u=>u!==o),r(u=>f(l({},u),{rawValue:a,eventType:"update",eventID:v(8),isInspected:!1,isFocusing:e.max!=a.length,isPickerOpen:!0}))}})},p.Stringify(n==null?void 0:n.value)||v(8)))}),s(N,{children:m})},Core:t=>{var x,P,E;let{value:e}=t,[i,r]=A(!1),[d,m]=A(""),[o,n]=A(t.options),[c,h]=A(((x=t.options.find(w=>{var O;return(w==null?void 0:w.value)===((O=t.value)==null?void 0:O[0])}))==null?void 0:x.id)||((P=t.options[0])==null?void 0:P.id)||""),[k,a]=A({}),[u,y]=A(z.DefaultStatus(t.componentId,e)),S=ne(!1);F(()=>{i||(S.current?n(t.options):S.current=!0)},[p.Stringify((E=t.options)==null?void 0:E.map(w=>w.value))]),F(()=>{if(!o.length)return;let w=[...o],O=l({},k);w.forEach(_=>{(_==null?void 0:_.type)!="label"&&(O[p.Stringify(_==null?void 0:_.value)]=_)}),a(O)},[o]);let g={rootStates:t,val_options:o,set_options:n,val_optionFocused:c,set_optionFocused:h,val_optionsDict:k,set_optionsDict:a,val_optionsModified:i,set_optionsModified:r,val_keyword:d,set_keyword:m,val_status:u,set_status:y},I=!!t.multiSelect;z.CommonEffects({type:I?"autocomplete.multi":"autocomplete.single",states:t,val_status:u,set_status:y,SystemValidation:pe});let R=u.rawValue.length&&u.rawValue[0]!==null||u.isPickerOpen||u.isFocusing;return V(se,{val_status:u,set_status:y,states:t,children:[s(ce,{componentId:t.componentId,fontSize:t.fontSize,required:t.required,label:t.label,isActive:R}),s(C.Button,l({},g))]})}},Y=t=>{let e=l({},t);return e=f(l({value:[],min:0,max:65535,multiSelect:!0,emptySelect:!0,onSelectorRender:i=>{var r;return i.option?((r=i.option)==null?void 0:r.type)=="label"?s(N,{children:i.option.label}):s($.Sub.S,{color:"cloud",tabIndex:-1,backgroundColor:"trans",borderRadius:0,fontColor:"2.normal",textAlign:"left",padding:["2/3",1.5],isActive:i.isFocused,isActiveStyles:{backgroundColor:"cloud"},onClick:i.onAdd,onKeyDown:i.onKeyDown,children:V(K.Left,{gap:"1/2",children:[i.isSelected&&s(B.Check,{fontColor:"theme"}),s(W.Supplement,{transition:"short",children:i.option.label})]})}):null},onSelectedRender:i=>V(K.Left,{ssCardBox:!0,borderRadius:"1.tone.primary",fontSize:"1.mini",padding:"1/3",gap:0,children:[s(W,{padding:[0,"1/2"],children:i.label}),s($.Clear,{flexSizing:"none",color:"nega",fontColor:"4.thin",tabIndex:-1,ssSphere:2,onClick:i.onRemove,freeCSS:{lineHeight:1,aspectRatio:"1/1"},children:s(B.X,{})})]}),pickerPosition:3},e),{freeCSS:l({cursor:"pointer"},e.freeCSS)}),e.multiSelect||(e.min=0,e.max=1),e.options=e.options||[],e.emptySelect&&(e.options=[{value:null,label:s(W.Supplement,{fontColor:"4.thin",children:"\u9078\u629E\u3092\u89E3\u9664"})},...e.options]),e.value=p.flatArray(e.value),e.options=C.InitOptions(e.options),p.is.nullish(e.rightIcon)&&(e.rightIcon=s(Q,{children:s(B.Search,{})}),e.disabled&&(e.rightIcon=s(Q,{fontColor:"5.translucent",children:s(B.Ban,{})}))),e.rightIcon&&(e=l({paddingRight:3},e)),e.leftIcon&&(e=l({paddingLeft:3},e)),s(re,{componentId:e.componentId,children:C.Core,states:ue(e)})};export{Y as Autocomplete,Y as default};
|
|
1
|
+
import{b as l,c as f,d as G,e as H}from"../../chunk-C5N2D3ZX.js";import{Fragment as N,jsx as u,jsxs as V}from"react/jsx-runtime";import{useState as A,useEffect as F,useRef as ne}from"react";import a,{UUID as v}from"jmini";import{Config as oe}from"../../@utils";import{Box as X,Span as ie,FAI as B,Column as q}from"../../atoms";import{Literal as W,Row as K}from"../../mols";import{Button as $}from"../Button";import{Loader as le}from"../Loader";import{Sheet as ae}from"../Sheet";import{OptionalInputWrapper as re,BoxWrapper as se,CoreEffects as z,DefaultBoxishStyles as ue}from"./core";import{InputAutocompleteClasses as L}from"../../@styles/componentClasses";import{InputLabel as ce}from"./Label";import{RightIcon as Q}from".";function pe(t){let{value:e,states:i}=t,{required:s,options:d,min:m,max:o}=i;m=m||0,o=o||65535;let n=[],p=e.filter(h=>h!==null).length;return s&&(p||n.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"})),p<m&&n.push({type:"invalid",label:m+"\u500B\u4EE5\u4E0A\u9078\u629E\u3057\u3066\u304F\u3060\u3055\u3044"}),p>o&&n.push({type:"invalid",label:o+"\u500B\u307E\u3067\u9078\u629E\u3067\u304D\u307E\u3059"}),{ok:!n.filter(({type:h})=>h=="invalid").length,notice:n}}const D={InitOptions:t=>{let e=[];return t.forEach(i=>{if(!i)return;let{type:s,label:d,value:m,searchValue:o}=i,n=o||a.is.string(d)&&d||""||a.is.string(m)&&m||a.Stringify(m||"")||"";a.is.nullish(d)&&(d=String(m)),e.push(f(l({id:v(8)},i),{searchValue:n,type:s||"selector",label:d,value:m}))}),e},FilterSelectableOptions:(t,e,i)=>{let s=t;return i||(s=t.filter(d=>(d==null?void 0:d.type)!="label")),a.scope(()=>{if(!e)return;let d=e.toLower().replace(/ /g,"");s=s.filter(m=>(m.searchValue||"").toLower().replace(/ /g,"").includes(d))}),s},Button:t=>{let{rootStates:e,val_keyword:i,set_keyword:s,val_optionFocused:d,set_optionFocused:m,val_status:o,set_status:n}=t,J=e,{tone:p,required:h,form:k,className:r,multiSelect:c,enableFormSubmit:y,checkValidationAtFirst:S,onValidate:g,onValidateDelay:I,onUpdateValue:R,onUpdateValidValue:x,onUserAction:P,value:E="",options:w,leftIndicator:C,rightIndicator:_,leftIcon:de,rightIcon:fe,componentId:me,status_id:Se,wrapStyles:ve,emptySelect:ye,searchInputPlaceholder:he,onSelectedRender:ge,onSelectorRender:Ie,pickerStyles:be,pickerPosition:ke,onDynamicSearchOptions:_e,onDynamicSearchOptionsDelay:we}=J,T=G(J,["tone","required","form","className","multiSelect","enableFormSubmit","checkValidationAtFirst","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","onUserAction","value","options","leftIndicator","rightIndicator","leftIcon","rightIcon","componentId","status_id","wrapStyles","emptySelect","searchInputPlaceholder","onSelectedRender","onSelectorRender","pickerStyles","pickerPosition","onDynamicSearchOptions","onDynamicSearchOptionsDelay"]),M="SearchInput_"+e.componentId;return F(()=>{var b;if(e.disabled||!o.isPickerOpen||a.is.exist(d))return;let O=D.FilterSelectableOptions(t.val_options,i,!1);m(((b=O[0])==null?void 0:b.id)||"")},[i]),F(()=>{if(o.eventType!="init"&&o.eventType!="override"&&e.max==o.rawValue.length){s(""),n(O=>f(l({},O),{eventID:v(8),isPickerOpen:!1}));return}},[o.rawValue]),F(()=>{let O="autocomplete-click-"+e.componentId;if(!o.isPickerOpen){a(document).removeEvent([O]);return}a('[data-input-origin="'+e.componentId+'"]')&&a(document).addEvent({eventID:O,eventType:"mousedown",callback:U=>{let j=a(U.target),Z=!!a(j).parent("."+L("Core")).length,ee=!!a(j).parent("."+L("Selector")).length;Z||ee||n(te=>f(l({},te),{eventID:v(8),isFocusing:!1,isPickerOpen:!1}))},options:{passive:!1}})},[o.isPickerOpen]),V(N,{children:[u(X,f(l({tabIndex:-1},T),{"data-disabled":e.disabled,"data-show-validation":z.isShowValidation(o,!!S),"data-component-id":o.componentId,"data-input-origin":o.componentId,"data-focus":o.isFocusing||o.isPickerOpen,className:[r,L("Core")].join(" "),onClick:O=>{if(T!=null&&T.onClick&&(T==null||T.onClick(O)),e.disabled)return;let b=document.activeElement;(b==null?void 0:b.id)!=M&&(oe.get().isTouchDevice||a("#"+M).focus()),n(U=>f(l({},U),{eventID:v(8),isPickerOpen:!0,isFocusing:!0}))},onKeyDown:O=>{let b=document.activeElement;(b==null?void 0:b.id)!=M&&(O.preventDefault(),a("#"+M).focus())},children:V(K.Left,{gap:0,children:[u(ie,{width:0,overflow:"hidden",opacity:"trans",children:"A"}),V(K.Left,{flexWrap:!0,flexSizing:0,gap:"1/2",verticalAlign:"unset",freeCSS:{letterSpacing:".5px"},children:[u(D.Selected,l({},t)),u(D.SearchInput,l({},t))]}),o.rawValue.length>1&&u($.Clear,{tabIndex:-1,color:"nega",fontColor:"4.thin",ssSphere:2,onClick:O=>{n(b=>f(l({},b),{eventType:"update",eventID:v(8),rawValue:[]}))},children:u(B.X,{})})]})})),u(D.Picker,l({},t))]})},SearchInput:t=>{let{rootStates:e,val_status:i,set_status:s}=t;if(e.disabled)return null;let d=!!i.isFocusing||!!i.isPickerOpen||!!i.rawValue.length;i.isFocusing||e.multiSelect||i.rawValue.length&&(d=!1);let m=e.searchInputPlaceholder||"\u691C\u7D22...";return u(X,{htmlTag:"input",id:"SearchInput_"+e.componentId,"data-input-value-shallow":i.componentId,placeholder:m,opacity:d?"max":"trans",transition:"middle",flexSizing:0,fontSize:"inherit",border:"0.trans",backgroundColor:"trans",isRounded:!0,padding:[0,"2/3"],value:t.val_keyword,className:[L("SearchInput"),d&&L("isActive")].join(" "),freeCSS:{outline:"none",minWidth:12*4},onFocus:o=>{s(n=>f(l({},n),{eventID:v(8),isFocusing:!0,isPickerOpen:!0}))},onBlur:o=>H(void 0,null,function*(){s(n=>f(l({},n),{eventID:v(8),isFocusing:!1}))}),onCompositionStart:o=>{s(n=>f(l({},n),{eventID:v(8),isComposing:!0}))},onCompositionEnd:o=>{s(n=>f(l({},n),{eventID:v(8),isComposing:!1}))},onKeyDown:o=>{let{key:n,metaKey:p,ctrlKey:h}=o,k=p||h;n=="Escape"?s(r=>f(l({},r),{eventID:v(12),isPickerOpen:!1})):n=="Tab"?s(r=>f(l({},r),{eventID:v(8),isFocusing:!1,isPickerOpen:!1})):n==" "?a.scope(()=>{i.isPickerOpen||t.val_keyword||(o.preventDefault(),s(r=>f(l({},r),{eventID:v(8),isPickerOpen:!0})))}):n=="Backspace"?a.scope(()=>{if(t.val_keyword)return;let r=[...t.val_status.rawValue];r.pop(),k&&(r=[]),s(c=>f(l({},c),{rawValue:r,eventType:"update",eventID:v(8),isInspected:!1}))}):n=="Enter"&&a.scope(()=>{if(i.isComposing||(o==null?void 0:o.keyCode)===229)return;if(!i.isPickerOpen){s(y=>f(l({},y),{eventID:v(8),isPickerOpen:!0}));return}if(!t.val_optionFocused)return;let r=t.val_options.find(y=>(y==null?void 0:y.id)==t.val_optionFocused);if(!r)return;let{value:c}=r;s(y=>{let S=[...y.rawValue];return a.scope(()=>{if(c===null)return S=[];y.rawValue.includes(c)?S=S.filter(I=>I!==c):e.multiSelect?S.push(c):S=[c]}),f(l({},y),{rawValue:S,eventType:"update",eventID:v(8),isInspected:!1})}),t.set_optionsModified(!0),t.set_keyword("")}),a.scope(()=>{if(!a.is.oneOf(n,"ArrowDown","ArrowUp"))return;if(o.preventDefault(),!i.isPickerOpen){s(g=>f(l({},g),{eventID:v(8),isPickerOpen:!0}));return}let r=n=="ArrowDown"?1:-1,c=D.FilterSelectableOptions(t.val_options,t.val_keyword),y=c.length-1,S=null;a.scope(()=>{var I,R,x,P,E,w,C;let g=c.findIndex(_=>(_==null?void 0:_.id)==t.val_optionFocused);if(g==-1){S=(I=c[0])==null?void 0:I.id;return}if(r==1){if(S=(R=c[0])==null?void 0:R.id,k){S=(x=c[y])==null?void 0:x.id;return}if(g==-1||g==y)return;S=(P=c[g+1])==null?void 0:P.id}else{if(S=(E=c[y])==null?void 0:E.id,k){S=(w=c[0])==null?void 0:w.id;return}if(g==-1||g==0)return;S=(C=c[g-1])==null?void 0:C.id}}),t.set_optionFocused(S)}),e.enableFormSubmit&&z.SubmitForm(o,t.rootStates.form)},onChange:o=>{let p=o.target.value;t.set_keyword(p),t.set_optionFocused(""),p&&s(h=>f(l({},h),{eventID:v(8),isPickerOpen:!0}))}},"searchInput")},Picker:t=>{var n;let{rootStates:e,val_status:i}=t,[s,d]=A("idle");F(()=>{if(!e.onDynamicSearchOptions||!i.isPickerOpen)return;if(t.val_optionsModified)return t.set_optionsModified(!1);if(i.isComposing)return;d("fetch");let p="autocomplete-search-"+e.componentId;t.set_optionFocused(""),a.interval.once(()=>H(void 0,null,function*(){var r;let h=yield e.onDynamicSearchOptions(t.val_keyword);d("idle");let k=D.InitOptions(h||[]);t.set_options(k),t.set_optionFocused(((r=k[0])==null?void 0:r.id)||"")}),e.onDynamicSearchOptionsDelay||500,p)},[t.val_keyword,i.isComposing]),F(()=>{let p=a(`[data-selector-id="${i.componentId}"]`)[0];if(!p)return;let h=a(`[data-autocomplete-input-value="${t.val_optionFocused}"]`)[0];h&&(p.scrollTop=h.offsetTop-24)},[t.val_optionFocused]);let m=D.FilterSelectableOptions(t.val_options,e.onDynamicSearchOptions?"":t.val_keyword,!0),o={};{let p=e.pickerPosition||0;a.is.oneOf(p,1,2)?o.bottom="100%":a.is.oneOf(p,3,4)&&(o.top="100%"),a.is.oneOf(p,1,3)?o.left=0:a.is.oneOf(p,2,4)&&(o.right=0)}return i.isPickerOpen?u(X,f(l({position:"absolute",padding:"1/3"},o),{freeCSS:l({minWidth:"75%",zIndex:1e3},o.freeCSS),children:u(ae.Body,f(l({className:L("Selector"),borderRadius:"2.tone.secondary",ssCardBox:!0,tabIndex:-1,boxShadow:"1.normal",overflow:"auto","data-selector-id":i.componentId},e.pickerStyles),{freeCSS:l({maxHeight:12*24},(n=e.pickerStyles)==null?void 0:n.freeCSS),children:V(q,{gap:"1/12",padding:[1,0],children:[s=="fetch"&&u(K.Center,{padding:"1/2",children:u(le.Theme.R,{showInitial:!0})}),s!="fetch"&&V(N,{children:[!m.length&&u(W.Supplement,{padding:[0,1],fontColor:"4.thin",children:"\u5019\u88DC\u304C\u898B\u3064\u304B\u308A\u307E\u305B\u3093"}),m.map((p,h)=>{if(!p)return null;let{type:k,value:r}=p,c=t.val_optionFocused==p.id,y=i.rawValue.includes(r),S=e.onSelectorRender;return u(q,{"data-autocomplete-input-value":p.id,children:u(S,{option:p,isFocused:c,isSelected:y,onAdd:()=>{t.set_status(g=>{let I=[...g.rawValue];return a.scope(()=>{if(r===null)return I=[];if(g.rawValue.includes(r)){I=I.filter(x=>x!==r);return}e.multiSelect?I.push(r):I=[r]}),f(l({},g),{rawValue:I,eventType:"update",eventID:v(8),isFocusing:e.max!=I.length,isInspected:!1})})},onKeyDown:g=>{let{key:I}=g;I=="Tab"&&(t.set_optionFocused(""),t.set_status(R=>f(l({},R),{eventID:v(8),isPickerOpen:!1,isFocusing:!1})))}})},p.id)})]})]})}))})):null},Selected:t=>{let{rootStates:e,val_status:i,set_status:s,val_optionsDict:d}=t,m=[];return i.rawValue.forEach(o=>{let n=d[a.Stringify(o)];if(!n)return;let p=e.onSelectedRender,h=(n==null?void 0:n.selectedLabel)||(n==null?void 0:n.label);(n==null?void 0:n.value)===null&&(h=""),m.push(u(q,{position:"relative",flexCenter:!0,freeCSS:{userSelect:"none"},children:u(p,{value:n==null?void 0:n.value,label:h,onRemove:k=>{if(e.disabled)return;let r=[...i.rawValue];r=r.filter(c=>c!==o),s(c=>f(l({},c),{rawValue:r,eventType:"update",eventID:v(8),isInspected:!1,isFocusing:e.max!=r.length,isPickerOpen:!0}))}})},a.Stringify(n==null?void 0:n.value)||v(8)))}),u(N,{children:m})},Core:t=>{var x,P,E;let{value:e}=t,[i,s]=A(!1),[d,m]=A(""),[o,n]=A(t.options),[p,h]=A(((x=t.options.find(w=>{var C;return(w==null?void 0:w.value)===((C=t.value)==null?void 0:C[0])}))==null?void 0:x.id)||((P=t.options[0])==null?void 0:P.id)||""),[k,r]=A({}),[c,y]=A(z.DefaultStatus(t.componentId,e)),S=ne(!1);F(()=>{i||(S.current?n(t.options):S.current=!0)},[a.Stringify((E=t.options)==null?void 0:E.map(w=>w.value))]),F(()=>{if(!o.length)return;let w=[...o],C=l({},k);w.forEach(_=>{(_==null?void 0:_.type)!="label"&&(C[a.Stringify(_==null?void 0:_.value)]=_)}),r(C)},[o]);let g={rootStates:t,val_options:o,set_options:n,val_optionFocused:p,set_optionFocused:h,val_optionsDict:k,set_optionsDict:r,val_optionsModified:i,set_optionsModified:s,val_keyword:d,set_keyword:m,val_status:c,set_status:y},I=!!t.multiSelect;z.CommonEffects({type:I?"autocomplete.multi":"autocomplete.single",states:t,val_status:c,set_status:y,SystemValidation:pe});let R=c.rawValue.length&&c.rawValue[0]!==null||c.isPickerOpen||c.isFocusing;return V(se,{val_status:c,set_status:y,states:t,children:[u(ce,{componentId:t.componentId,fontSize:t.fontSize,required:t.required,label:t.label,isActive:R}),u(D.Button,l({},g))]})}},Y=t=>{let e=l({},t);return e=f(l({value:[],min:0,max:65535,multiSelect:!0,emptySelect:!0,onSelectorRender:i=>{var s;return i.option?((s=i.option)==null?void 0:s.type)=="label"?u(N,{children:i.option.label}):u($.Sub.S,{color:"cloud",tabIndex:-1,backgroundColor:"trans",borderRadius:0,fontColor:"2.normal",textAlign:"left",padding:["2/3",1.5],isActive:i.isFocused,isActiveStyles:{backgroundColor:"cloud"},onClick:i.onAdd,onKeyDown:i.onKeyDown,children:V(K.Left,{gap:"1/2",children:[i.isSelected&&u(B.Check,{fontColor:"theme"}),u(W.Supplement,{transition:"short",children:i.option.label})]})}):null},onSelectedRender:i=>V(K.Left,{ssCardBox:!0,borderRadius:"1.tone.primary",fontSize:"1.mini",padding:"1/3",gap:0,children:[u(W,{padding:[0,"1/2"],children:i.label}),u($.Clear,{flexSizing:"none",color:"nega",fontColor:"4.thin",tabIndex:-1,ssSphere:2,onClick:i.onRemove,freeCSS:{lineHeight:1,aspectRatio:"1/1"},children:u(B.X,{})})]}),pickerPosition:3},e),{freeCSS:l({cursor:"pointer"},e.freeCSS)}),e.multiSelect||(e.min=0,e.max=1),e.options=e.options||[],e.emptySelect&&(e.options=[{value:null,label:u(W.Supplement,{fontColor:"4.thin",children:"\u9078\u629E\u3092\u89E3\u9664"})},...e.options]),e.value=a.flatArray(e.value),e.options=D.InitOptions(e.options),a.is.nullish(e.rightIcon)&&(e.rightIcon=u(Q,{children:u(B.Search,{})}),e.disabled&&(e.rightIcon=u(Q,{fontColor:"5.translucent",children:u(B.Ban,{})}))),e.rightIcon&&(e=l({paddingRight:3},e)),e.leftIcon&&(e=l({paddingLeft:3},e)),u(re,{componentId:e.componentId,children:D.Core,states:ue(e)})};export{Y as Autocomplete,Y as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{b as t,c as o,d as F}from"../../chunk-C5N2D3ZX.js";import{jsx as S}from"react/jsx-runtime";import{useState as
|
|
1
|
+
import{b as t,c as o,d as F}from"../../chunk-C5N2D3ZX.js";import{jsx as S}from"react/jsx-runtime";import{useState as _}from"react";import V,{UUID as I}from"jmini";import{$$fromRoot as k,GenerateHTMLProps as K}from"../../@utils";import{OptionalInputWrapper as U,BoxWrapper as W,CoreEffects as w,DefaultBoxishStyles as $}from"./core";import{Flex as z}from"../../atoms";import{InputClasses as R}from"../../@styles/componentClasses";function P(e){let{value:n,states:u}=e,{required:f,numericOnly:p=!1,digits:D}=u,s=[];return f&&!n&&s.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"}),n&&(p&&n.match(/\D/)&&s.push({type:"invalid",label:"\u6570\u5B57\u306E\u307F\u3067\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"}),n.length!=D&&s.push({type:"warn",label:"\u6700\u5F8C\u307E\u3067\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"})),{ok:!s.filter(({type:C})=>C=="invalid"||C=="warn").length,notice:s}}const q=(e,n="")=>{let u=String(n),f=[];for(let p=0;p<e;p++)f[p]=u[p]||"";return{safeValue:f,rawValue:u}},A=(e="")=>{let n=e,u=n.join("");return{safeValue:n,rawValue:u}},j=e=>{let x=e,{tone:n,required:u,form:f,name:p,className:D="",digits:s,numericOnly:h=!1,enableFormSubmit:C,checkValidationAtFirst:G,onChange:J,onKeyDown:Q,onValidate:X,onValidateDelay:Y,onUpdateValue:Z,onUpdateValidValue:ee,onUserAction:te,value:M="",override:ne,freeCSS:ae,wrapStyles:ie,combineInput:re,componentId:se,listStyles:N}=x,a=F(x,["tone","required","form","name","className","digits","numericOnly","enableFormSubmit","checkValidationAtFirst","onChange","onKeyDown","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","onUserAction","value","override","freeCSS","wrapStyles","combineInput","componentId","listStyles"]),[c,d]=_(o(t({componentId:e.componentId||""},q(s,M)),{eventType:"init",eventID:I(12)}));w.CommonEffects({type:"textfield",states:e,val_status:c,set_status:d,SystemValidation:P});let b=[];for(let i=0;i<s;i++){let O=c.safeValue[i],E={},v=D;e.combineInput&&(v=[D,R("DigitCharacterCell"),R("Combined")].join(" ")),b.push(S("input",{type:"text",inputMode:h?"numeric":e.inputMode||"text",value:O,id:"Digit-"+i+"-"+c.componentId,className:v,style:t(t({},e.style),E),onKeyDown:m=>{let{key:l,code:H}=m;if(l=="Tab")return;m.preventDefault();let y=null;if(l=="Backspace"){let r=c.safeValue;r[i]="",d(g=>o(t(t({},g),A(r)),{eventType:"update",eventID:I(12),isInspected:!1})),y=i-1}else if(V.is.oneOf(l,"ArrowLeft","ArrowRight")){let r=+(l=="ArrowRight")*2-1;y=i+r}else C&&w.SubmitForm(m,f),(()=>{let r=H.match(/^(Key(.)|Digit(\d)|Numpad(\d))/);if(!r)return;let g=r[2]||r[3]||r[4];if(h&&!g.match(/\d/)||!g)return;let T=c.safeValue;T[i]=g,d(L=>o(t(t({},L),A(T)),{eventType:"update",eventID:I(12),isInspected:!1})),y=i+1})();V.is.exist(y)&&k("#Digit-"+y+"-"+c.componentId).focus()},onChange:()=>{},onFocus:m=>{a!=null&&a.onFocus&&(a==null||a.onFocus(m)),d(l=>o(t({},l),{eventID:I(12),isFocusing:!0}))},onBlur:m=>{a!=null&&a.onBlur&&(a==null||a.onBlur(m)),d(l=>o(t({},l),{eventID:I(12),isFocusing:!1}))}},i))}return S(W,{val_status:c,set_status:d,states:e,children:S(z,o(t({gap:"1/2",flexChilds:"even",flexWrap:!1,flexSizing:"auto"},N),{children:b}))})},B=e=>{e=t({},e),e=t({textAlign:"center",width:0},e),e.combineInput&&(e=o(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 n=K($(e));return S(U,{componentId:e.componentId,children:j,states:n})};export{B as DigitCharacters,B as default};
|
package/dist/fn/Input/Filer.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{b as r,c as f,d as G,e as
|
|
1
|
+
import{b as r,c as f,d as G,e as H}from"../../chunk-C5N2D3ZX.js";import{Fragment as ne,jsx as a,jsxs as m}from"react/jsx-runtime";import{useState as Q,useEffect as Y}from"react";import z,{UUID as b,useStore as ee}from"jmini";import{$$fromRoot as _,ExtractStyles as se}from"../../@utils";import{Box as S,FAI as R,Flex as L,Column as te}from"../../atoms";import{Row as re}from"../../mols";import{Button as P}from"../Button";import j from"../Snackbar";import{OptionalInputWrapper as pe,BoxWrapper as ue,CoreEffects as le,DefaultBoxishStyles as me}from"./core";import ce from"./TextField";import{InputFilerClasses as y}from"../../@styles/componentClasses";import{faCloudArrowUp as de}from"@fortawesome/free-solid-svg-icons/faCloudArrowUp";function fe(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 ae={List:e=>{let{rootStates:t,val_status:o,set_status:c}=e;if(t.useSystemOnly)return null;let l=t.limit-(o.rawValue||[]).length,p=(o.rawValue||[]).map((n,u)=>a(ae.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&&z.is.oneOf(u," ","Enter")&&_("#"+t.id).click()},children:m(re.Center,{padding:["1/3",0],children:[a(S,{isRounded:!0,className:y("AddIcon"),children:a(R,{icon:de,className:y("Icon"),fontColor:"theme",fontSize:"4.thirdTitle",backgroundColor:"theme.opa.low",ssSphere:3,padding:"1/2"})}),m(S,{children:[m(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(te,f(r({flexSizing:"auto"},se(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,[d,v]=Q(!1),I=b(),J=u.rank(),[K,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"),Y(()=>{d&&setTimeout(()=>{_("#"+I).focus()},100)},[d]),m(L,f(r({verticalAlign:"center",flexWrap:!1,gap:1,className:o.cellClassName},o.cellStyles),{children:[a(R.File,{fontSize:"4.thirdTitle",fontColor:"4.thin"}),m(S,{flexSizing:0,children:[a(S,{children:a(L,{verticalAlign:"center",gap:"2/3",flexWrap:!1,className:y("FileName"),children:d?a(ne,{children:m(te,{flexSizing:0,gap:"1/2",children:[m(L,{gap:"2/3",verticalAlign:"center",children:[a(ce,{tone:"border",wrapStyles:{flexSizing:"auto"},restrict:"fileName",name:"name",required:!0,id:I,form:"form-"+I,enableFormSubmit:!0,value:K,onKeyDown:F=>{let{key:B}=F;B=="Escape"&&v(!1)}}),m(S,{children:[". ",W]})]}),m(L,{gap:"2/3",horizontalAlign:"right",flexWrap:!1,children:[a(P.Sub.S,{padding:["2/3",1],onClick:()=>{v(!1)},children:"\u9589\u3058\u308B"}),a(P.Prime.S,{padding:["2/3",1],onFormSubmit:["form-"+I,F=>H(void 0,null,function*(){let{name:B}=F.body,w=[...l.rawValue],A=w[t],X=A.id;if(!A)return;let M=yield String(yield A.convert("dataURL")).toBlob(c.type);if(!M)return;let $=new File([M],B+"."+W,{type:A.type});$.id=X,w[t]=$,p(U=>f(r({},U),{rawValue:w,eventType:"update",eventID:b(12),isInspected:!1})),v(!1)})],children:"\u6C7A\u5B9A"})]})]})}):m(ne,{children:[n,!!o.isNameEditable&&a(P.Clear,{ssSphere:2.5,flexSizing:"none",fontColor:"4.thin",padding:"1/3",ssEffectsOnActive:"expand",color:"cloud",onClick:()=>{v(!0)},children:a(R.Pen,{})})]})})}),!d&&m(S,{fontSize:"1.mini",fontColor:"4.thin",flexSizing:0,children:[s,"\u30D5\u30A1\u30A4\u30EB / ",J,"B"]})]}),a(P.Sub,{color:"cloud",fontColor:"4.thin",ssSphere:3,onClick:()=>{let F=[...l.rawValue];F[t]&&(F.splice(t,1),p(w=>f(r({},w),{rawValue:F,eventType:"update",eventID:b(12),isInspected:!1})))},children:a(R.X,{})})]}))}},ge=e=>{let Z=e,{tone:t,required:o,form:c,isNameEditable:l,useSystemOnly:p,accept:n="*",limit:u=1,checkValidationAtFirst:i,onChange:d,onValidate:v,onValidateDelay:I,onUpdateValue:J,onUpdateValidValue:K,onUserAction:W,value:s=[],className:F,cellStyles:B,cellClassName:w,componentId:A,status_id:X,enableFormSubmit:oe,freeCSS:M,wrapStyles:$}=Z,U=G(Z,["tone","required","form","isNameEditable","useSystemOnly","accept","limit","checkValidationAtFirst","onChange","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","onUserAction","value","className","cellStyles","cellClassName","componentId","status_id","enableFormSubmit","freeCSS","wrapStyles"]),[T,N]=Q(le.DefaultStatus(e.componentId||"",s)),ie={rootStates:e,val_status:T,set_status:N};Y(()=>{ee.set({["AddFiles-"+T.componentId]:x=>{N(D=>{let C=D.rawValue,V=[];for(var g=0;g<(x==null?void 0:x.length);g++){let h=x[g],{type:k,name:E}=h;if(g+1+C.length>u){j.add({componentId:E,secondsToClose:12e3,children:`\u30D5\u30A1\u30A4\u30EB\u9078\u629E\u4E0A\u9650\u3092\u8D85\u3048\u305F\u305F\u3081\u3001${E}}\u306F\u8FFD\u52A0\u3067\u304D\u307E\u305B\u3093\u3002`,backgroundColor:"nega"});continue}if(n&&n=="image"&&!k.match(/image/)){j.add({componentId:E,secondsToClose:12e3,children:`\u30D5\u30A1\u30A4\u30EB\u5F62\u5F0F\u304C\u7570\u306A\u308B\u305F\u3081\u3001${E} \u306F\u8FFD\u52A0\u3067\u304D\u307E\u305B\u3093\u3002`,backgroundColor:"nega"});continue}V.push(h)}return f(r({},D),{rawValue:[...C,...V],eventType:"update",eventID:b(12),isInspected:!1})})}})},[]),le.CommonEffects({type:"file",states:e,val_status:T,set_status:N,SystemValidation:fe});let O="";return n&&(n=="image"?O="image/png,image/jpeg":O=n),m(ue,{val_status:T,set_status:N,states:e,children:[a(S,f(r({htmlTag:"input",type:"file",className:y("Input"),"data-component-id":T.componentId,accept:O,multiple:u!=1,onChange:x=>H(void 0,null,function*(){d&&d(x);let D=x.target,C=D.files,V=[];for(var g=0;g<(C==null?void 0:C.length);g++){if(!C[g])continue;let h=C[g].clone(),k=h.name;if(h.id=b(),g+1+T.rawValue.length>u){j.add({componentId:k,secondsToClose:12e3,children:`\u30D5\u30A1\u30A4\u30EB\u767B\u9332\u6570\u3092\u8D85\u3048\u305F\u305F\u3081\u3001${k}}\u306F\u8FFD\u52A0\u3067\u304D\u307E\u305B\u3093\u3067\u3057\u305F\u3002`,backgroundColor:"nega"});continue}V.push(h)}N(h=>f(r({},h),{rawValue:[...h.rawValue,...V],eventType:"update",eventID:b(12),isInspected:!1})),D.value=""})},U),{opacity:"low",tabIndex:-1,value:""})),a(ae.List,r({},ie))]})},q=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(pe,{componentId:e.componentId,children:ge,states:e}));q.fn={openDialog:e=>{let{multiple:t,accept:o}=e,c=b();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),z("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 d=0;d<n.length;d++){let I=n[d].clone();u.push(I)}e.onChange(u),z("#"+c).remove()},l.click()}},typeof window!="undefined"&&window.document&&z(document).addEvent({eventType:"dragover",callback:e=>{e.preventDefault(),_("."+y("AddButton")).addClass(y("Draggable"))},options:{passive:!1}}).addEvent({eventType:"drop",callback:e=>{e.preventDefault(),_("."+y("AddButton")).removeClass(y("Draggable"));let t=e.dataTransfer.files;if(t.length){let o=e.target;if(_(o).hasClass(y("AddButton"))){let{componentId:c}=o.dataset,l=ee.get("AddFiles-"+c);l&&l(t)}}},options:{passive:!1}});export{q as Filer,q as default};
|
package/dist/fn/Input/List.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{b as o,c as m,d as z}from"../../chunk-C5N2D3ZX.js";import{jsx as a}from"react/jsx-runtime";import
|
|
1
|
+
import{b as o,c as m,d as z}from"../../chunk-C5N2D3ZX.js";import{jsx as a}from"react/jsx-runtime";import p,{UUID as F}from"jmini";import{useState as ie}from"react";import{$$fromRoot as ae,GenerateHTMLProps as ne}from"../../@utils";import{Box as I,Flex as se,FAI as re,Span as ce}from"../../atoms";import{Button as ue}from"../Button";import{OptionalInputWrapper as de,BoxWrapper as me,CoreEffects as B}from"./core";import{InputListClasses as T}from"../../@styles/componentClasses";function pe(t){let{value:l,states:i}=t,{type:e,required:s,min:n,max:C}=i;n=n||0,C=C||65535;let c=[],S=l.length;return s&&(S||e=="radio"&&c.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"})),S<n&&c.push({type:"invalid",label:n+"\u500B\u4EE5\u4E0A\u9078\u629E\u3057\u3066\u304F\u3060\u3055\u3044"}),S>C&&c.push({type:"invalid",label:C+"\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(i=>{if(!i)return;let{label:e,value:s}=i;p.is.nullish(e)&&(e=String(s)),l.push(m(o({},i),{label:e,value:s}))}),l},OptionalListWrapper:t=>{let{value:l,options:i=[]}=t,e=p.is.exist(l)?p.flatArray(l):[],s=[];return e.forEach(n=>{i.findIndex(c=>p.is.equal(c.value,n))!=-1&&s.push(n)}),a(h.Core,m(o({},t),{value:s,options:i}))},Core:t=>{let g=t,{type:l,tone:i,required:e,componentId:s="",form:n,override:C,icon:c,iconType:S,iconSize:V,iconPosition:J,iconColor:v,CustomIcon:P,enableFormSubmit:X,checkValidationAtFirst:A,onValidate:$,onValidateDelay:N,onUpdateValue:U,onUpdateValidValue:W,onUserAction:H,value:f,options:q,className:K,cellStyles:j,cellClassName:G,cellCheckedStyles:Q,cellCheckedClassName:E,min:u,max:R,hideInput:b,freeCSS:Y,wrapStyles:x}=g,Z=z(g,["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"]),[O,L]=ie(B.DefaultStatus(s,f));return B.CommonEffects({type:"list."+l,states:t,val_status:O,set_status:L,SystemValidation:pe}),a(me,{val_status:O,set_status:L,states:t,children:a(h.List,{rootStates:t,val_status:O,set_status:L})})},List:t=>{let{rootStates:l,val_status:i,set_status:e}=t,{componentId:s,type:n,tone:C,icon:c,iconSize:S,iconColor:V,isChecker:J,options:v,name:P,form:X,tabIndex:A,hideInput:$,disabled:N,className:U,cellStyles:W,cellClassName:H="",cellCheckedStyles:f,cellCheckedClassName:q="",enableFormSubmit:K}=l,j=l.CustomIcon,G=v.map((Q,E)=>{let oe=Q,{value:u,label:R,disabled:b,className:Y="",checkedStyles:x,checkedClassName:Z="",freeCSS:O}=oe,L=z(oe,["value","label","disabled","className","checkedStyles","checkedClassName","freeCSS"]),g=F(),w=i.rawValue.findIndex(r=>r===u||p.is.equal(r,u))!=-1,y=o(o({},W),L),D=[T("Label"),H,Y];w&&(y=m(o(o(o({},y),f),x),{freeCSS:o(o(o({},y==null?void 0:y.freeCSS),f==null?void 0:f.freeCSS),x==null?void 0:x.freeCSS)}),D=[...D,q,Z]);const ee=()=>{if(N||b)return;let r=[];if(n=="radio")r=[u];else if(n=="checkbox"||J)if(!w)r=[...i.rawValue,u];else{let d=[...i.rawValue];d.splice(i.rawValue.findIndex(_=>_==u),1),r=d}e(d=>m(o({},d),{rawValue:r,eventType:"update",eventID:F(12),isInspected:!1}))};let te=[a(ce,{position:"relative",freeCSS:{zIndex:2},flexSizing:0,children:p.is.string(R)?a(I,{children:R}):R},"content")];return c&&te[l.iconPosition=="right"?"push":"unshift"](a(j,{isChecked:w,iconSize:S,iconColor:V,toggle:ee},"icon")),[a(I,{htmlTag:"input",type:n=="radio"?"radio":"checkbox",className:T("Input"),name:"RadioCheckbox-"+P,"data-list-index":s+"-"+E,id:g,value:String(u),disabled:N||b,checked:w,onFocus:r=>{b||n=="radio"&&(i.rawValue.length||e(d=>m(o({},d),{rawValue:[u],eventType:"update",eventID:F(12),isInspected:!1})))},onChange:()=>{ee()},onKeyDown:r=>{let{key:d,shiftKey:_}=r;if((n=="checkbox"||t.rootStates.isChecker)&&d!="Tab"){if(d.match(/Arrow/)){r.preventDefault();let le=p.is.oneOf(d,"ArrowLeft","ArrowUp")?-1:1,k=E+le;k<0?k=v.length-1:k>=v.length&&(k=0),ae(`input[data-list-index="${s}-${k}"]`).focus()}}K&&B.SubmitForm(r,X)},tabIndex:A},"List-"+p.Stringify(u)),a(I,m(o({htmlTag:"label","data-disabled":N||b,htmlFor:g,className:D.join(" "),tabIndex:-1,display:"flex",verticalAlign:"center",flexWrap:!1},y),{children:te}),"ListTrigger-"+p.Stringify(u))]});return a(se,{flexSizing:"auto",style:l.style,freeCSS:o({},l.freeCSS),className:[U,T("CellBase"),T("HideInput_"+$),T("IconIndicator_"+!!c),T("Tone_"+C)].join(" "),children:G})},_Icon:t=>{let l=1.5;return t.iconSize=="small"?l=1.2:t.iconSize=="large"&&(l=2),a(ue.Normal,{ssPushable:!0,color:"cloud",tabIndex:-1,ssEffectsOnActive:"ripple.cloud",ssSphere:2,freeCSS:{transform:`scale(${l})`},onClick:i=>{i.preventDefault(),i.stopPropagation(),t.toggle()},children:t.children})},RadioIcon:t=>a(h._Icon,m(o({type:"radio"},t),{children:a(I,{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:a(I,{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=>a(h._Icon,m(o({type:"checkbox"},t),{children:a(I,{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:a(re.Check,{transition:"middle",opacity:t.isChecked?"max":"trans",freeCSS:{zIndex:8,width:"100%",height:"100%",transform:t.isChecked?"scale(1)":"scale(.5)"}})})}))},M=t=>{t=t||"checkbox";const l=e=>(e=m(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=ne(e),e.options=h.InitOptions(e.options),a(de,{componentId:e.componentId,children:h.OptionalListWrapper,states:e})),i=l;return i.Normal=e=>a(l,o({type:t,tone:"normal",icon:!1},e)),i.Border=e=>a(l,o({type:t,tone:"border"},e)),i.Cloud=e=>a(l,o({type:t,tone:"cloud"},e)),i.Vivid=e=>a(l,o({type:t,tone:"normal",icon:!1,cellCheckedStyles:{backgroundColor:"theme",fontColor:"white"}},e)),i.Simple=e=>a(l,o({type:t,tone:"plain",icon:!1,cellCheckedStyles:{fontColor:"theme"}},e)),i},Ce=M("radio"),he=M("checkbox"),Se=M();export{he as Checkbox,Se as List,Ce as Radio};
|
package/dist/fn/Input/Select.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{b as n,c as u,d as U}from"../../chunk-C5N2D3ZX.js";import{Fragment as te,jsx as o,jsxs as V}from"react/jsx-runtime";import y,{UUID as v}from"jmini";import{useState as Y,useEffect as q}from"react";import{Box as T,FAI as Z,Column as ve}from"../../atoms";import{Literal as H,Row as $}from"../../mols";import{Button as Ie}from"../Button";import{Sheet as be}from"../Sheet";import{OptionalInputWrapper as ge,BoxWrapper as ke,CoreEffects as x,DefaultBoxishStyles as he}from"./core";import{InputAutocompleteClasses as F}from"../../@styles/componentClasses";import{InputLabel as Ce}from"./Label";import{RightIcon as Ve}from".";function we(t){let{value:e,states:a}=t,{required:c,options:d}=a,i=[];return c&&e===null&&i.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"}),{ok:!i.filter(({type:I})=>I=="invalid").length,notice:i}}const k={FilterSelectableOptions:(t,e)=>{let a=t.rootStates.options;return e||(a=a.filter(c=>(c==null?void 0:c.type)!="label")),a},Button:t=>V(te,{children:[o(k.Native,n({},t)),o(k.Original,n({},t))]}),Placeholder:t=>!t.rootStates.placeholder||t.val_status.rawValue!==null?null:o(T,{position:"absolute",opacity:"middle",fontColor:"3.blur",children:t.rootStates.placeholder||""}),Native:t=>{let{rootStates:e,val_status:a,set_status:c}=t,P=e,{tone:d,required:i,form:I,className:r,label:b,isLabelActive:S,placeholder:h,enableFormSubmit:g,emptySelect:D,checkValidationAtFirst:R,onValidate:L,onValidateDelay:z,onUpdateValue:le,onUpdateValidValue:ae,onUserAction:ne,onKeyDown:W,onChange:_,value:re="",options:M,leftIndicator:ie,rightIndicator:se,leftIcon:oe,rightIcon:ue,componentId:ce,status_id:de,wrapStyles:pe,selectedStyles:fe,selectorStyles:Se,pickerStyles:me,pickerPosition:ye,nativePicker:A}=P,s=U(P,["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","selectedStyles","selectorStyles","pickerStyles","pickerPosition","nativePicker"]);return A?V(T,u(n({htmlTag:"select",tabIndex:0},s),{"data-disabled":e.disabled,"data-show-validation":x.isShowValidation(a,!!R),"data-component-id":a.componentId,"data-input-origin":a.componentId,className:[r,F("Core")].join(" "),onKeyDown:l=>{W&&W(l),g&&x.SubmitForm(l,I)},onChange:l=>{let{value:f}=l.target;c(O=>u(n({},O),{rawValue:f,eventType:"update",eventID:v(12),isInspected:!1,isValidated:!1,notice:[]})),_&&_(l)},children:[!!D&&o("option",{value:"null",children:"\u9078\u629E"}),M.map(l=>y.is.nullish(l==null?void 0:l.value)?null:o("option",{value:l==null?void 0:l.value,children:(l==null?void 0:l.label)||(l==null?void 0:l.value)},String(l==null?void 0:l.value)))]})):null},Original:t=>{let{rootStates:e,val_optionFocused:a,set_optionFocused:c,val_status:d,set_status:i}=t,P=e,{tone:I,required:r,form:b,className:S,label:h,isLabelActive:g,placeholder:D,enableFormSubmit:R,emptySelect:L,checkValidationAtFirst:z,onValidate:le,onValidateDelay:ae,onUpdateValue:ne,onUpdateValidValue:W,onUserAction:_,value:re="",options:M,leftIndicator:ie,rightIndicator:se,leftIcon:oe,rightIcon:ue,componentId:ce,status_id:de,wrapStyles:pe,selectedStyles:fe,selectorStyles:Se,pickerStyles:me,pickerPosition:ye,nativePicker:A}=P,s=U(P,["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","selectedStyles","selectorStyles","pickerStyles","pickerPosition","nativePicker"]);return q(()=>{if(A||e.disabled)return;let l="select-click-"+e.componentId;if(d.isPickerOpen){if(!y('[data-input-origin="'+e.componentId+'"]'))return;y(document).addEvent({eventID:l,eventType:"click",callback:O=>{let B=y(O.target),E=!!y(B).parent("."+F("Core")).length;y(B).parent("."+F("Selector")).length||E||i(p=>u(n({},p),{eventID:v(12),isPickerOpen:!1}))}})}else y(document).removeEvent([l])},[d.isPickerOpen]),A?null:V(te,{children:[o(T,u(n({tabIndex:0},s),{"data-disabled":e.disabled,"data-show-validation":x.isShowValidation(d,!!z),"data-component-id":d.componentId,"data-input-origin":d.componentId,className:[S,F("Core")].join(" "),onFocus:l=>{s!=null&&s.onFocus&&(s==null||s.onFocus(l)),!e.disabled&&i(f=>u(n({},f),{eventID:v(12),isFocusing:!0,isPickerOpen:!0}))},onBlur:l=>{s!=null&&s.onBlur&&(s==null||s.onBlur(l)),i(f=>u(n({},f),{eventID:v(12),isFocusing:!1}))},onClick:l=>{s!=null&&s.onClick&&(s==null||s.onClick(l)),!e.disabled&&i(f=>u(n({},f),{eventID:v(12),isPickerOpen:!0}))},onKeyDown:l=>{let{key:f,metaKey:O,ctrlKey:B}=l,E=O||B;if(s!=null&&s.onKeyDown&&(s==null||s.onKeyDown(l)),R&&x.SubmitForm(l,b),!e.disabled){if(y.scope(()=>{if(!["ArrowDown","ArrowUp"].includes(f))return;if(l.preventDefault(),!d.isPickerOpen){i(C=>u(n({},C),{eventID:v(12),isPickerOpen:!0}));return}let m=f=="ArrowDown"?1:-1,p=k.FilterSelectableOptions(t),N=p.length-1,w=null;y.scope(()=>{var j,J,X,G,Q;let C=p.findIndex(K=>(K==null?void 0:K.id)==a);if(m==1){if(w=(j=p[0])==null?void 0:j.id,E){w=p[N].id;return}if(C==-1||C==N)return;w=(J=p[C+1])==null?void 0:J.id}else{if(w=(X=p[N])==null?void 0:X.id,E){w=(G=p[0])==null?void 0:G.id;return}if(C==-1||C==0)return;w=(Q=p[C-1])==null?void 0:Q.id}}),c(w)}),f=="Escape")i(m=>u(n({},m),{eventID:v(12),isPickerOpen:!1}));else if(f=="Tab")i(m=>u(n({},m),{eventID:v(12),isPickerOpen:!1}));else if(f=="Backspace")i(m=>u(n({},m),{rawValue:null,eventType:"update",eventID:v(12),isInspected:!1}));else if(f==" ")l.preventDefault(),i(m=>u(n({},m),{eventID:v(12),isPickerOpen:!0}));else if(f=="Enter"){if(!d.isPickerOpen){i(p=>u(n({},p),{eventID:v(12),isPickerOpen:!0}));return}l.preventDefault();let m=e.options.find(p=>(p==null?void 0:p.id)==a);if(!m)return;i(p=>u(n({},p),{rawValue:m==null?void 0:m.value,eventType:"update",eventID:v(12),isPickerOpen:!1,isInspected:!1}))}}},children:V($.Left,{gap:0,children:[o(T,{freeCSS:{width:0},overflow:"hidden",opacity:"trans","data-input-value-shallow":d.componentId,children:"A"}),V($.Left,{flexWrap:!0,gap:"1/3",freeCSS:{letterSpacing:".5px"},children:[o(k.Placeholder,n({},t)),o(k.Selected,n({},t))]})]})})),o(k.Picker,n({},t))]})},Picker:t=>{var I;let{rootStates:e,val_status:a,val_optionFocused:c}=t;q(()=>{if(!a.isPickerOpen||!a.rawValue)return;let r=y(`[data-picker-id="${a.componentId}"]`)[0];if(!r)return;let b=r.position(),S=e.options.find(g=>(g==null?void 0:g.value)===a.rawValue);if(!S)return;let h=y(`[data-select-input-value="${S.id}"]`)[0];h&&(r.scrollTop=h.offsetTop-b.height/2+h.offsetHeight/2)},[a.isPickerOpen]),q(()=>{let r=y(`[data-picker-id="${a.componentId}"]`)[0];if(!r)return;let b=r.position(),S=y(`[data-select-input-value="${c}"]`)[0];S&&(r.scrollTop=S.offsetTop-b.height/2+S.offsetHeight/2)},[c]);let d=k.FilterSelectableOptions(t,!0),i={};{let r=e.pickerPosition||0;[1,2].includes(r)?i.bottom="100%":[3,4].includes(r)&&(i.top="100%"),[1,3].includes(r)?i.left=0:[2,4].includes(r)&&(i.right=0)}return a.isPickerOpen?o(T,u(n({position:"absolute",minWidth:1,padding:"1/3"},i),{freeCSS:n({zIndex:1e3},i.freeCSS),children:o(be.Body,u(n({className:F("Selector"),ssCardBox:!0,borderRadius:"2.tone.secondary",boxShadow:"1.normal",overflow:"auto","data-picker-id":a.componentId},e.pickerStyles),{freeCSS:n({minWidth:12*6,maxHeight:12*24},(I=e.pickerStyles)==null?void 0:I.freeCSS),children:V(ve,{gap:"1/12",padding:[1,0],children:[d.map((r,b)=>{if(!r)return null;let{type:S,value:h}=r,g=t.val_optionFocused==r.id,D=t.val_status.rawValue===h;return S=="label"?o(T,{children:r.label||r.value},v()):o(Ie.Sub.S,u(n({"data-select-input-value":r.id,color:"cloud",backgroundColor:"trans",borderRadius:0,fontColor:"2.normal",textAlign:"left",padding:["1/2",1],isActive:D||g,isActiveStyles:g?{backgroundColor:"cloud"}:{backgroundColor:"theme.opa.few",fontColor:"theme"}},e.selectorStyles),{onClick:R=>{t.set_status(L=>u(n({},L),{rawValue:h,eventType:"update",eventID:v(12),isPickerOpen:!1,isInspected:!1}))},children:V($.Left,{gap:"1/2",children:[D&&o(Z.Check,{fontColor:"theme"}),o(H.Supplement,{transition:"short",flexSizing:0,children:r.label||r.value})]})}),r.id)}),!d.length&&o(H.Supplement,{padding:[0,1],fontColor:"4.thin",children:"\u5019\u88DC\u304C\u898B\u3064\u304B\u308A\u307E\u305B\u3093"},"no-selector-notice")]})}))})):null},Selected:t=>{let e=t.rootStates.options.find(a=>y.is.equal(a==null?void 0:a.value,t.val_status.rawValue));return!e||t.val_status.rawValue===null&&(t.rootStates.label||t.rootStates.placeholder)?null:o(T,u(n({},t.rootStates.selectedStyles),{children:(e==null?void 0:e.selectedLabel)||(e==null?void 0:e.label)||(e==null?void 0:e.value)}),String(e==null?void 0:e.value))},Core:t=>{var r,b;let{value:e}=t,[a,c]=Y(x.DefaultStatus(t.componentId,e)),[d,i]=Y(((r=t.options.find(S=>(S==null?void 0:S.value)===t.value))==null?void 0:r.id)||((b=t.options[0])==null?void 0:b.id)||""),I={rootStates:t,val_optionFocused:d,set_optionFocused:i,val_status:a,set_status:c};return x.CommonEffects({type:"select",states:t,val_status:a,set_status:c,SystemValidation:we}),V(ke,{val_status:a,set_status:c,states:t,children:[o(Ce,{componentId:t.componentId,fontSize:t.fontSize,required:t.required,label:t.label,isActive:t.isLabelActive||a.rawValue!==null}),o(k.Button,n({},I))]})}},ee=t=>{var a,c;let e=n({},t);return e=u(n({emptySelect:!0,nativePicker:!1,pickerPosition:3},e),{freeCSS:n({cursor:"pointer"},e.freeCSS)}),e.emptySelect&&(e.options=[{value:null,label:o(H.Supplement,{fontColor:"4.thin",children:"\u672A\u9078\u629E"})},...e.options]),e.value=(a=e.value)!=null?a:null,(c=e.options)==null||c.forEach((d,i)=>{if(!d)return;let{type:I,value:r}=d;e.options[i]=u(n({id:v(12)},d),{value:r,type:I||"selector"})}),y.is.nullish(e.rightIcon)&&(e.rightIcon=o(Ve,{children:o(Z.AngleDown,{})})),o(ge,{componentId:e.componentId,children:k.Core,states:he(e)})};export{ee as Select,ee as default};
|
|
1
|
+
import{b as n,c as u,d as U}from"../../chunk-C5N2D3ZX.js";import{Fragment as te,jsx as o,jsxs as V}from"react/jsx-runtime";import c,{UUID as v}from"jmini";import{useState as Y,useEffect as q}from"react";import{Box as T,FAI as Z,Column as ve}from"../../atoms";import{Literal as H,Row as $}from"../../mols";import{Button as Ie}from"../Button";import{Sheet as be}from"../Sheet";import{OptionalInputWrapper as ge,BoxWrapper as ke,CoreEffects as O,DefaultBoxishStyles as he}from"./core";import{InputAutocompleteClasses as F}from"../../@styles/componentClasses";import{InputLabel as Ce}from"./Label";import{RightIcon as Ve}from".";function we(t){let{value:e,states:a}=t,{required:d,options:p}=a,i=[];return d&&e===null&&i.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"}),{ok:!i.filter(({type:I})=>I=="invalid").length,notice:i}}const k={FilterSelectableOptions:(t,e)=>{let a=t.rootStates.options;return e||(a=a.filter(d=>(d==null?void 0:d.type)!="label")),a},Button:t=>V(te,{children:[o(k.Native,n({},t)),o(k.Original,n({},t))]}),Placeholder:t=>!t.rootStates.placeholder||t.val_status.rawValue!==null?null:o(T,{position:"absolute",opacity:"middle",fontColor:"3.blur",children:t.rootStates.placeholder||""}),Native:t=>{let{rootStates:e,val_status:a,set_status:d}=t,D=e,{tone:p,required:i,form:I,className:r,label:b,isLabelActive:m,placeholder:h,enableFormSubmit:g,emptySelect:x,checkValidationAtFirst:R,onValidate:L,onValidateDelay:z,onUpdateValue:le,onUpdateValidValue:ae,onUserAction:ne,onKeyDown:W,onChange:_,value:re="",options:M,leftIndicator:ie,rightIndicator:se,leftIcon:oe,rightIcon:ue,componentId:ce,status_id:de,wrapStyles:pe,selectedStyles:fe,selectorStyles:Se,pickerStyles:me,pickerPosition:ye,nativePicker:A}=D,s=U(D,["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","selectedStyles","selectorStyles","pickerStyles","pickerPosition","nativePicker"]);return A?V(T,u(n({htmlTag:"select",tabIndex:0},s),{"data-disabled":e.disabled,"data-show-validation":O.isShowValidation(a,!!R),"data-component-id":a.componentId,"data-input-origin":a.componentId,className:[r,F("Core")].join(" "),onKeyDown:l=>{W&&W(l),g&&O.SubmitForm(l,I)},onChange:l=>{let{value:S}=l.target;d(P=>u(n({},P),{rawValue:S,eventType:"update",eventID:v(12),isInspected:!1,isValidated:!1,notice:[]})),_&&_(l)},children:[!!x&&o("option",{value:"null",children:"\u9078\u629E"}),M.map(l=>c.is.nullish(l==null?void 0:l.value)?null:o("option",{value:l==null?void 0:l.value,children:(l==null?void 0:l.label)||(l==null?void 0:l.value)},String(l==null?void 0:l.value)))]})):null},Original:t=>{let{rootStates:e,val_optionFocused:a,set_optionFocused:d,val_status:p,set_status:i}=t,D=e,{tone:I,required:r,form:b,className:m,label:h,isLabelActive:g,placeholder:x,enableFormSubmit:R,emptySelect:L,checkValidationAtFirst:z,onValidate:le,onValidateDelay:ae,onUpdateValue:ne,onUpdateValidValue:W,onUserAction:_,value:re="",options:M,leftIndicator:ie,rightIndicator:se,leftIcon:oe,rightIcon:ue,componentId:ce,status_id:de,wrapStyles:pe,selectedStyles:fe,selectorStyles:Se,pickerStyles:me,pickerPosition:ye,nativePicker:A}=D,s=U(D,["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","selectedStyles","selectorStyles","pickerStyles","pickerPosition","nativePicker"]);return q(()=>{if(A||e.disabled)return;let l="select-click-"+e.componentId;if(p.isPickerOpen){if(!c('[data-input-origin="'+e.componentId+'"]'))return;c(document).addEvent({eventID:l,eventType:"click",callback:P=>{let B=c(P.target),E=!!c(B).parent("."+F("Core")).length;c(B).parent("."+F("Selector")).length||E||i(f=>u(n({},f),{eventID:v(12),isPickerOpen:!1}))}})}else c(document).removeEvent([l])},[p.isPickerOpen]),A?null:V(te,{children:[o(T,u(n({tabIndex:0},s),{"data-disabled":e.disabled,"data-show-validation":O.isShowValidation(p,!!z),"data-component-id":p.componentId,"data-input-origin":p.componentId,className:[m,F("Core")].join(" "),onFocus:l=>{s!=null&&s.onFocus&&(s==null||s.onFocus(l)),!e.disabled&&i(S=>u(n({},S),{eventID:v(12),isFocusing:!0,isPickerOpen:!0}))},onBlur:l=>{s!=null&&s.onBlur&&(s==null||s.onBlur(l)),i(S=>u(n({},S),{eventID:v(12),isFocusing:!1}))},onClick:l=>{s!=null&&s.onClick&&(s==null||s.onClick(l)),!e.disabled&&i(S=>u(n({},S),{eventID:v(12),isPickerOpen:!0}))},onKeyDown:l=>{let{key:S,metaKey:P,ctrlKey:B}=l,E=P||B;if(s!=null&&s.onKeyDown&&(s==null||s.onKeyDown(l)),R&&O.SubmitForm(l,b),!e.disabled){if(c.scope(()=>{if(!c.is.oneOf(S,"ArrowDown","ArrowUp"))return;if(l.preventDefault(),!p.isPickerOpen){i(C=>u(n({},C),{eventID:v(12),isPickerOpen:!0}));return}let y=S=="ArrowDown"?1:-1,f=k.FilterSelectableOptions(t),N=f.length-1,w=null;c.scope(()=>{var j,J,X,G,Q;let C=f.findIndex(K=>(K==null?void 0:K.id)==a);if(y==1){if(w=(j=f[0])==null?void 0:j.id,E){w=f[N].id;return}if(C==-1||C==N)return;w=(J=f[C+1])==null?void 0:J.id}else{if(w=(X=f[N])==null?void 0:X.id,E){w=(G=f[0])==null?void 0:G.id;return}if(C==-1||C==0)return;w=(Q=f[C-1])==null?void 0:Q.id}}),d(w)}),S=="Escape")i(y=>u(n({},y),{eventID:v(12),isPickerOpen:!1}));else if(S=="Tab")i(y=>u(n({},y),{eventID:v(12),isPickerOpen:!1}));else if(S=="Backspace")i(y=>u(n({},y),{rawValue:null,eventType:"update",eventID:v(12),isInspected:!1}));else if(S==" ")l.preventDefault(),i(y=>u(n({},y),{eventID:v(12),isPickerOpen:!0}));else if(S=="Enter"){if(!p.isPickerOpen){i(f=>u(n({},f),{eventID:v(12),isPickerOpen:!0}));return}l.preventDefault();let y=e.options.find(f=>(f==null?void 0:f.id)==a);if(!y)return;i(f=>u(n({},f),{rawValue:y==null?void 0:y.value,eventType:"update",eventID:v(12),isPickerOpen:!1,isInspected:!1}))}}},children:V($.Left,{gap:0,children:[o(T,{freeCSS:{width:0},overflow:"hidden",opacity:"trans","data-input-value-shallow":p.componentId,children:"A"}),V($.Left,{flexWrap:!0,gap:"1/3",freeCSS:{letterSpacing:".5px"},children:[o(k.Placeholder,n({},t)),o(k.Selected,n({},t))]})]})})),o(k.Picker,n({},t))]})},Picker:t=>{var I;let{rootStates:e,val_status:a,val_optionFocused:d}=t;q(()=>{if(!a.isPickerOpen||!a.rawValue)return;let r=c(`[data-picker-id="${a.componentId}"]`)[0];if(!r)return;let b=r.position(),m=e.options.find(g=>(g==null?void 0:g.value)===a.rawValue);if(!m)return;let h=c(`[data-select-input-value="${m.id}"]`)[0];h&&(r.scrollTop=h.offsetTop-b.height/2+h.offsetHeight/2)},[a.isPickerOpen]),q(()=>{let r=c(`[data-picker-id="${a.componentId}"]`)[0];if(!r)return;let b=r.position(),m=c(`[data-select-input-value="${d}"]`)[0];m&&(r.scrollTop=m.offsetTop-b.height/2+m.offsetHeight/2)},[d]);let p=k.FilterSelectableOptions(t,!0),i={};{let r=e.pickerPosition||0;c.is.oneOf(r,1,2)?i.bottom="100%":c.is.oneOf(r,3,4)&&(i.top="100%"),c.is.oneOf(r,1,3)?i.left=0:c.is.oneOf(r,2,4)&&(i.right=0)}return a.isPickerOpen?o(T,u(n({position:"absolute",minWidth:1,padding:"1/3"},i),{freeCSS:n({zIndex:1e3},i.freeCSS),children:o(be.Body,u(n({className:F("Selector"),ssCardBox:!0,borderRadius:"2.tone.secondary",boxShadow:"1.normal",overflow:"auto","data-picker-id":a.componentId},e.pickerStyles),{freeCSS:n({minWidth:12*6,maxHeight:12*24},(I=e.pickerStyles)==null?void 0:I.freeCSS),children:V(ve,{gap:"1/12",padding:[1,0],children:[p.map((r,b)=>{if(!r)return null;let{type:m,value:h}=r,g=t.val_optionFocused==r.id,x=t.val_status.rawValue===h;return m=="label"?o(T,{children:r.label||r.value},v()):o(Ie.Sub.S,u(n({"data-select-input-value":r.id,color:"cloud",backgroundColor:"trans",borderRadius:0,fontColor:"2.normal",textAlign:"left",padding:["1/2",1],isActive:x||g,isActiveStyles:g?{backgroundColor:"cloud"}:{backgroundColor:"theme.opa.few",fontColor:"theme"}},e.selectorStyles),{onClick:R=>{t.set_status(L=>u(n({},L),{rawValue:h,eventType:"update",eventID:v(12),isPickerOpen:!1,isInspected:!1}))},children:V($.Left,{gap:"1/2",children:[x&&o(Z.Check,{fontColor:"theme"}),o(H.Supplement,{transition:"short",flexSizing:0,children:r.label||r.value})]})}),r.id)}),!p.length&&o(H.Supplement,{padding:[0,1],fontColor:"4.thin",children:"\u5019\u88DC\u304C\u898B\u3064\u304B\u308A\u307E\u305B\u3093"},"no-selector-notice")]})}))})):null},Selected:t=>{let e=t.rootStates.options.find(a=>c.is.equal(a==null?void 0:a.value,t.val_status.rawValue));return!e||t.val_status.rawValue===null&&(t.rootStates.label||t.rootStates.placeholder)?null:o(T,u(n({},t.rootStates.selectedStyles),{children:(e==null?void 0:e.selectedLabel)||(e==null?void 0:e.label)||(e==null?void 0:e.value)}),String(e==null?void 0:e.value))},Core:t=>{var r,b;let{value:e}=t,[a,d]=Y(O.DefaultStatus(t.componentId,e)),[p,i]=Y(((r=t.options.find(m=>(m==null?void 0:m.value)===t.value))==null?void 0:r.id)||((b=t.options[0])==null?void 0:b.id)||""),I={rootStates:t,val_optionFocused:p,set_optionFocused:i,val_status:a,set_status:d};return O.CommonEffects({type:"select",states:t,val_status:a,set_status:d,SystemValidation:we}),V(ke,{val_status:a,set_status:d,states:t,children:[o(Ce,{componentId:t.componentId,fontSize:t.fontSize,required:t.required,label:t.label,isActive:t.isLabelActive||a.rawValue!==null}),o(k.Button,n({},I))]})}},ee=t=>{var a,d;let e=n({},t);return e=u(n({emptySelect:!0,nativePicker:!1,pickerPosition:3},e),{freeCSS:n({cursor:"pointer"},e.freeCSS)}),e.emptySelect&&(e.options=[{value:null,label:o(H.Supplement,{fontColor:"4.thin",children:"\u672A\u9078\u629E"})},...e.options]),e.value=(a=e.value)!=null?a:null,(d=e.options)==null||d.forEach((p,i)=>{if(!p)return;let{type:I,value:r}=p;e.options[i]=u(n({id:v(12)},p),{value:r,type:I||"selector"})}),c.is.nullish(e.rightIcon)&&(e.rightIcon=o(Ve,{children:o(Z.AngleDown,{})})),o(ge,{componentId:e.componentId,children:k.Core,states:he(e)})};export{ee as Select,ee as default};
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import{b as n,c as s,d as te,e as ue}from"../../chunk-C5N2D3ZX.js";import{Fragment as fe,jsx as u,jsxs as q}from"react/jsx-runtime";import
|
|
2
|
-
T`.repeat(l-1),
|
|
3
|
-
T`.repeat(x-1)}let r=Ne(i);return q(N,{position:"absolute",top:0,left:0,right:0,height:0,overflow:"hidden",opacity:"trans",freeCSS:{zIndex:3,pointerEvents:"none"},children:[u(ie.Description,s(n({className:i.className},r),{position:"absolute",width:1,freeCSS:s(n({},r.freeCSS),{color:"orange"}),"data-input-shallow":a.componentId,children:u(N,{"data-input-value-shallow":a.componentId,children:p})})),u(ie.Description,s(n({className:i.className},r),{position:"absolute",left:0,freeCSS:s(n({},r.freeCSS),{backgroundColor:"transparent",color:"blue"}),"data-input-min-height-value-shallow":a.componentId,children:d})),u(ie.Description,s(n({className:i.className},r),{position:"absolute",right:0,freeCSS:s(n({},r.freeCSS),{backgroundColor:"transparent",color:"red"}),"data-input-max-height-value-shallow":a.componentId,children:f}))]})},InputBox:e=>{let{rootStates:i,val_status:a,set_status:o,val_inputType:p,set_inputType:t}=e;if(i.multiline)return null;let re=i,{componentId:d,tone:f,required:r,restrict:l="text",form:x,autoComplete:h="off",autoCapitalize:v="off",minRows:E,maxRows:J,multiline:Y,autoHeight:k,enableFormSubmit:ne,clearButton:le=!1,allowDecimals:Z,allowZeroStart:B,checkValidationAtFirst:U,onChange:M,onKeyDown:G,onValidate:ge,onValidateDelay:xe,onUpdateValue:be,onUpdateValidValue:Ie,onUserAction:Se,value:he="",leftIndicator:Te,rightIndicator:we,leftIcon:ye,rightIcon:Ce,maxLength:ve,min:c,max:K,label:X,isLabelActive:T,defaultValidation:V,wrapStyles:oe}=re,m=te(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 u(N,s(n({htmlTag:"input",type:p,inputMode:["number","digitNumber","creditCard"].includes(l)?"numeric":l=="email"?"email":"text","data-disabled":i.disabled,"data-show-validation":P.isShowValidation(a,!!U),"data-component-id":a.componentId,"data-input-origin":a.componentId,value:a.safeValue,autoComplete:h,autoCapitalize:v,onKeyDown:I=>{let{key:b,target:R}=I,L=R,{selectionStart:_,selectionEnd:Q}=L,W=Number(_),$=Number(Q);{let H=a.safeValue[Number(W)],A=a.safeValue[Number(W)-1];b=="Delete"&&(l=="creditCard"&&H==" "||l=="postal"&&H=="-"||l=="digitNumber"&&H==",")&&(L.setSelectionRange(W+1,$+1),I.preventDefault()),b=="Backspace"&&(l=="creditCard"&&A==" "||l=="postal"&&A=="-"||l=="digitNumber"&&A==",")&&(L.setSelectionRange(W-1,$-1),I.preventDefault()),b=="Enter"||b=="Tab"}g.scope(()=>{["number","digitNumber","creditCard"].includes(l)&&b=="Clear"&&o(H=>s(n({},H),{rawValue:"",safeValue:"",eventType:"update",eventID:y(12),isFocusing:!0,isInspected:!1}))}),g.scope(()=>{if(!["number","digitNumber"].includes(l)||!["ArrowUp","ArrowDown"].includes(b))return;let H=+(b=="ArrowUp")*2-1,A=a.rawValue.slice(-1),se=a.safeValue[$-1],D=$-1,F=String(a.safeValue),j=a.rawValue.split(".")[1],Ve=(j==null?void 0:j.length)||0;g.scope(()=>{if(!A){F="0";return}if(A=="-"){F+="0";return}if(A=="."){F+="0";return}if($==0)return;let ee=String(F).slice(0,D).match(/\./),Re=String(F).slice(D),O=String(Re.toNumber().toFixed(0)).length;se=="."&&(O=1,D=F.split(".")[0].length-1),se==","&&(O+=1,D--),ee&&(O=-1*(Ve-O));let z=F[D].toNumber()+H;z<0?z=9:z>=10&&(z=0),F=F.partReplace(D,String(z)),setTimeout(()=>{L.setSelectionRange(D+1,D+1)},1)}),o(ee=>s(n(n({},ee),w.Validation.SyncValue({allowDecimals:Z,allowZeroStart:B,min:c,max:K,restrict:l,value:F})),{eventType:"update",eventID:y(12),isFocusing:!0,isInspected:!1,isValidated:!1,notice:[]})),I.preventDefault()}),G&&G(I),ne&&P.SubmitForm(I,x)},onChange:I=>{let{value:b,selectionStart:R,selectionEnd:L}=I.target,_=w.Validation.SyncValue({allowDecimals:Z,allowZeroStart:B,min:c,max:K,restrict:l,value:b});a.isComposing&&(_.safeValue=b),_.safeValue!=a.safeValue&&(o(Q=>s(n(n({},Q),_),{prevValue:a.safeValue,eventType:"update",eventID:y(12),caretFrom:Number(R),caretTo:Number(L),isFocusing:!0,isInspected:!1,isValidated:!1,notice:[]})),M&&M(I))},width:1},m),{onFocus:I=>{m!=null&&m.onFocus&&(m==null||m.onFocus(I)),o(b=>s(n({},b),{eventID:y(12),isFocusing:!0}))},onBlur:I=>{m!=null&&m.onBlur&&(m==null||m.onBlur(I)),o(b=>s(n({},b),{eventID:y(12),isFocusing:!1}))},onCompositionStart:I=>{m!=null&&m.onCompositionStart&&(m==null||m.onCompositionStart(I)),o(b=>s(n({},b),{eventID:y(12),isComposing:!0}))},onCompositionEnd:I=>{if(m!=null&&m.onCompositionEnd&&(m==null||m.onCompositionEnd(I)),l=="text"){g.interval.once(()=>{o(R=>s(n({},R),{isComposing:!1}))},100,"input.textfield.composing.end");return}let b=w.Validation.SyncValue({allowDecimals:Z,allowZeroStart:B,min:c,max:K,restrict:l,value:a.safeValue});o(R=>s(n(n({},R),b),{prevValue:R.safeValue,eventType:"update",eventID:y(12),caretFrom:Number(R.safeValue.length+1),caretTo:Number(R.safeValue.length+1),isComposing:!1,isInspected:!1}))}}))},TextAreaBox:e=>{let{rootStates:i,val_status:a,set_status:o,isShallow:p}=e,X=i,{componentId:t,tone:d,required:f,form:r,label:l,isLabelActive:x,clearButton:h=!1,minRows:v,maxRows:E,multiline:J,autoHeight:Y,allowDecimals:k,allowZeroStart:ne,enableFormSubmit:le,maxLength:Z,checkValidationAtFirst:B,onChange:U,onKeyDown:M,onValidate:G,onValidateDelay:ge,onUpdateValue:xe,onUpdateValidValue:be,onUserAction:Ie,value:Se="",leftIndicator:he,rightIndicator:Te,leftIcon:we,rightIcon:ye,defaultValidation:Ce,wrapStyles:ve}=X,c=te(X,["componentId","tone","required","form","label","isLabelActive","clearButton","minRows","maxRows","multiline","autoHeight","allowDecimals","allowZeroStart","enableFormSubmit","maxLength","checkValidationAtFirst","onChange","onKeyDown","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","onUserAction","value","leftIndicator","rightIndicator","leftIcon","rightIcon","defaultValidation","wrapStyles"]);return!i.multiline?null:u(N,s(n({htmlTag:"textarea","data-show-validation":P.isShowValidation(a,!!B),"data-input-origin":a.componentId,"data-component-id":a.componentId,value:a.rawValue,width:1},c),{onFocus:T=>{c!=null&&c.onFocus&&(c==null||c.onFocus(T)),o(V=>s(n({},V),{eventID:y(12),isFocusing:!0}))},onBlur:T=>{c!=null&&c.onBlur&&(c==null||c.onBlur(T)),o(V=>s(n({},V),{eventID:y(12),isFocusing:!1}))},onCompositionStart:T=>{c!=null&&c.onCompositionStart&&(c==null||c.onCompositionStart(T)),o(V=>s(n({},V),{eventID:y(12),isComposing:!0}))},onCompositionEnd:T=>{c!=null&&c.onCompositionEnd&&(c==null||c.onCompositionEnd(T)),g.interval.once(()=>{o(V=>s(n({},V),{eventID:y(12),isComposing:!1}))},100,"input.textfield.composing.end")},onKeyDown:T=>{M&&M(T),le&&P.SubmitForm(T,r)},onChange:T=>{let{value:V}=T.target;o(oe=>s(n({},oe),{rawValue:V,eventType:"update",eventID:y(12),isFocusing:!0,isInspected:!1,isValidated:!1,notice:[]})),U&&U(T)}}))}},$e=e=>{let{componentId:i,restrict:a="text",value:o="",min:p,max:t,allowDecimals:d,allowZeroStart:f}=e,[r,l]=pe(s(n({componentId:i},w.Validation.SyncValue({allowDecimals:d,allowZeroStart:f,min:p,max:t,restrict:a,value:o})),{prevValue:"",eventType:"init",eventID:y(12),caretFrom:null,caretTo:null})),[x,h]=pe(["password","concealed"].includes(a)&&"password"||"text");ae(()=>{l(E=>s(n(n({},E),w.Validation.SyncValue({allowDecimals:d,allowZeroStart:f,min:p,max:t,restrict:a,value:o})),{isInspected:!1})),ce.set({[i+":set_inputType"]:h})},[]);let v={rootStates:e,val_inputType:x,set_inputType:h,val_status:r,set_status:l};return P.CommonEffects({type:"textfield",states:e,val_status:r,set_status:l,SystemValidation:w.Validation.System,ExtraOverrideStates:E=>w.Validation.SyncValue({allowDecimals:d,allowZeroStart:f,min:p,max:t,restrict:a,value:E})}),ae(()=>{w.setSelection({id:e.id,restrict:a,val_status:r})},[r]),q(Ae,{val_status:r,set_status:l,states:v.rootStates,children:[u(Be,{componentId:e.componentId,fontSize:e.fontSize,required:e.required,label:e.label,isActive:e.isLabelActive||!!r.isFocusing||!!r.rawValue}),u(w.Shallow,n({},v)),u(w.InputBox,n({},v)),u(w.TextAreaBox,n({},v))]})},C=e=>{var i,a;return e=n({autoHeight:!0,restrict:"text",fontSize:"inherit",value:""},e),e.value=(a=w.Validation.SyncValue({allowDecimals:e.allowDecimals,allowZeroStart:e.allowZeroStart,min:e.min,max:e.max,restrict:e.restrict||"text",value:(i=e.value)!=null?i:""}).rawValue)!=null?a:"",e.multiline?(e.minRows=e.minRows||5,e.maxRows=e.maxRows||20):(e.minRows=1,e.maxRows=1),u(He,{componentId:e.componentId,children:$e,states:Le(e)})},S=C;S.Validate=w.Validation.Text,S.Katakana=e=>u(C,s(n({},e),{restrict:"katakana",multiline:!1,autoHeight:!1})),S.HankakuKatakana=e=>u(C,s(n({},e),{restrict:"hankaku.katakana",multiline:!1,autoHeight:!1})),S.CreditCard=e=>u(C,s(n({},e),{restrict:"creditCard",multiline:!1,autoHeight:!1})),S.Tel=e=>u(C,s(n({},e),{restrict:"tel",multiline:!1,autoHeight:!1})),S.Number=e=>u(C,s(n({},e),{restrict:"number",multiline:!1,autoHeight:!1})),S.DigitNumber=e=>u(C,s(n({},e),{restrict:"digitNumber",multiline:!1,autoHeight:!1})),S.Email=e=>u(C,s(n({},e),{restrict:"email",multiline:!1,autoHeight:!1})),S.Url=e=>u(C,s(n({},e),{restrict:"url",multiline:!1,autoHeight:!1})),S.Postal=e=>u(C,s(n({label:"\u90F5\u4FBF\u756A\u53F7"},e),{restrict:"postal",multiline:!1,autoHeight:!1,leftIcon:u(Me,{ssSphere:2,fontColor:"4.thin",children:"\u3012"})})),S.Password=e=>u(C,s(n({label:"\u30D1\u30B9\u30EF\u30FC\u30C9",rightIcon:u(de,{ssSphere:2.5,freeCSS:{pointerEvents:"all"},children:u(De.Sub,{ssSphere:2.5,borderRadius:"3.tone.tertiary",fontColor:"theme",flexCenter:!0,height:1,ssEffectsOnActive:["expand"],onMouseOver:i=>{me.open(i.currentTarget,"\u30C6\u30AD\u30B9\u30C8\u3092\u8868\u793A",24)},onMouseLeave:me.abort,tabIndex:-1,onClick:i=>{g(i.target).parent().parent().find("input").callback(a=>{let o=a[0];if(!o)return;let p=o.dataset.componentId;if(!p)return;let t=ce.get(p+":set_inputType");t&&t(d=>d==="password"&&"text"||"password")})},children:u(ke,{icon:Ee})})}),restrict:"password"},e),{multiline:!1,autoHeight:!1})),S.Concealed=e=>u(S.Password,s(n({label:"\u79D8\u5BC6\u9375"},e),{restrict:"concealed"})),S.Money={JPY:e=>u(S.DigitNumber,s(n({rightIcon:u(de,{fontColor:"4.thin",children:"\u5186"})},e),{multiline:!1,autoHeight:!1}))};export{S as TextField,$e as TextInput,S as default};
|
|
1
|
+
import{b as n,c as s,d as te,e as ue}from"../../chunk-C5N2D3ZX.js";import{Fragment as fe,jsx as u,jsxs as q}from"react/jsx-runtime";import p,{UUID as y,useStore as ce}from"jmini";import{useState as pe,useEffect as ae}from"react";import{$$fromRoot as Fe,ExtractStyles as Ne}from"../../@utils";import{Box as N,FAI as ke}from"../../atoms";import{Literal as ie}from"../../mols";import{Tips as me,Button as De}from"..";import{faEye as Ee}from"@fortawesome/free-solid-svg-icons/faEye";import{OptionalInputWrapper as He,BoxWrapper as Ae,CoreEffects as Z,DefaultBoxishStyles as Le}from"./core";import{InputLabel as Be}from"./Label";import{LeftIcon as Me,RightIcon as de}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:q(fe,{children:[u(N,{children:"\u25CB\u25CB\u25CB\u25CB@\u25CB\u25CB\u25CB\u25CB.\u25CB\u25CB\u25CB\u306E\u5F62\u5F0F\u3067\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"}),u(N,{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:q(fe,{children:[u(N,{children:"0\u304B\u3089\u59CB\u307E\u308B\u756A\u53F7\u306E\u307F\u5165\u529B\u53EF\u80FD\u3067\u3059"}),u(N,{children:"9~12\u6841\u306E\u6570\u5B57\u3067\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"}),u(N,{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"}},w={setSelection:e=>{let{id:i,restrict:a,val_status:o}=e,m=Fe("#"+i)[0];if(!m||!o.prevValue||!o.safeValue||!o.isFocusing||o.isComposing)return;let{safeValue:t,prevValue:f,caretFrom:g,caretTo:r}=o;if(a=="creditCard")t.length>=f.length&&g%5==0&&(g++,r++),m.setSelectionRange(g,r);else if(a=="postal")t.length==5&&f.length==3&&(g++,r++),m.setSelectionRange(g,r);else if(a=="digitNumber"){let l=t.length-f.length;l==2&&(g++,r++),l==-2&&(g--,r--),m.setSelectionRange(g,r)}},Validation:{System:e=>{let{value:i,states:a}=e,{restrict:o="text",defaultValidation:m,maxLength:t,multiline:f,required:g}=a,r=[];if(f||(t=t||255),p.is.exist(t)&&i.length>=Number(t)&&r.push({type:"invalid",label:t+"\u5B57\u4EE5\u5185\u3067\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"}),i){let l=w.Validation.Text(i,o,m);l.ok||r.push({type:"invalid",label:l.body})}else g&&r.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"});return{ok:!r.filter(({type:l})=>l=="invalid").length,notice:r}},Text:(e,i,a)=>{let o={ok:!0,body:""};return(()=>{let m=a||_e[i];if(!m)return;let t=m.reason;if(m){let f=!!(+!!e.match(m.reg)^+!m.exist);o={ok:f,body:f?"":t}}})(),o},SyncValue:e=>{let{restrict:i,allowDecimals:a,allowZeroStart:o,value:m=""}=e,t=String(m);p.is.oneOf(i,"tel","number","digitNumber","postal","creditCard")&&(t=t.zen2hanNumber()),i=="katakana",i=="hankaku.katakana",p.is.oneOf(i,"postal","creditCard")&&(t=t.removeLetters()),p.scope(()=>{if(!p.is.oneOf(i,"number","digitNumber"))return;t=t.replace(/(\.\d+)\..*/g,"$1").replace(/\.+/g,".").replace(/[^0-9.-]/g,"");let g=Number(t)<0||t[0]=="-";t=t.replace(/[^0-9.]/g,""),g&&(t="-"+t);let r=Number(a);a?t=t.replace(/(\.\d{0,})\..*/g,"$1").replace(/\.(\d{0,})/g,(l,x)=>x.length>r?"."+x.slice(0,r):l):t=t.replace(/\.\d?/g,""),p.scope(()=>{p.is.oneOf(i,"number","digitNumber")&&(o||(t=t.replace(/^0(\d+)/g,"$1").replace(/^-0(\d+)/g,"-$1")))}),p.scope(()=>{let l=t.slice(-1);if(!t||l=="."||l=="-")return;let{min:x,max:h}=e;p.is.exist(x)&&p.is.number(x)&&Number(t)<Number(x)&&(t=String(x.toFixed(r))),p.is.exist(h)&&p.is.number(h)&&Number(t)>Number(h)&&(t=String(h.toFixed(r)))}),p.scope(()=>{if(!t||t=="-"||i!="digitNumber")return;let l=t.slice(-1),[x,h]=t.split(".");t=x.replace(/\B(?=(\d{3})+(?!\d))/g,","),h&&(t+="."+h),l=="."&&(t+=".")})});let f=t;return i=="digitNumber"||(i=="postal"?t.length>=4&&(f=t.clip(0,3)+"-"+t.clip(3)):i=="creditCard"&&(f=t.replace(/.{4}(?=.)/g,"$& "))),(i=="digitNumber"||i=="number")&&(t=t.replace(/,/g,"")),{safeValue:f,rawValue:t}}},Shallow:e=>{let{rootStates:i,val_status:a}=e,o=a.rawValue||"";ae(()=>{p.scope(()=>ue(void 0,null,function*(){if(!i.multiline)return;let l=p('[data-input-origin="'+a.componentId+'"]'),x=p('[data-input-shallow="'+a.componentId+'"]'),h=p('[data-input-min-height-value-shallow="'+a.componentId+'"]'),v=p('[data-input-max-height-value-shallow="'+a.componentId+'"]');if(!l[0]||!x[0]||!h[0]||!v[0])return;let E=x.position(),J=h.position(),Y=v.position(),k=0;i.autoHeight&&(k=E.height),k=Math.max(k,J.height),k=Math.min(k,Y.height),l[0].style.height=k+"px"}))},[o]);let m=o||"";(!!o.match(/\n$/)||!o)&&(m+="T");let f="",g="";if(i.multiline){let l=i.minRows||1,x=i.maxRows||100;f=`
|
|
2
|
+
T`.repeat(l-1),g=`
|
|
3
|
+
T`.repeat(x-1)}let r=Ne(i);return q(N,{position:"absolute",top:0,left:0,right:0,height:0,overflow:"hidden",opacity:"trans",freeCSS:{zIndex:3,pointerEvents:"none"},children:[u(ie.Description,s(n({className:i.className},r),{position:"absolute",width:1,freeCSS:s(n({},r.freeCSS),{color:"orange"}),"data-input-shallow":a.componentId,children:u(N,{"data-input-value-shallow":a.componentId,children:m})})),u(ie.Description,s(n({className:i.className},r),{position:"absolute",left:0,freeCSS:s(n({},r.freeCSS),{backgroundColor:"transparent",color:"blue"}),"data-input-min-height-value-shallow":a.componentId,children:f})),u(ie.Description,s(n({className:i.className},r),{position:"absolute",right:0,freeCSS:s(n({},r.freeCSS),{backgroundColor:"transparent",color:"red"}),"data-input-max-height-value-shallow":a.componentId,children:g}))]})},InputBox:e=>{let{rootStates:i,val_status:a,set_status:o,val_inputType:m,set_inputType:t}=e;if(i.multiline)return null;let re=i,{componentId:f,tone:g,required:r,restrict:l="text",form:x,autoComplete:h="off",autoCapitalize:v="off",minRows:E,maxRows:J,multiline:Y,autoHeight:k,enableFormSubmit:ne,clearButton:le=!1,allowDecimals:z,allowZeroStart:B,checkValidationAtFirst:P,onChange:M,onKeyDown:G,onValidate:ge,onValidateDelay:xe,onUpdateValue:be,onUpdateValidValue:Se,onUserAction:Ie,value:he="",leftIndicator:Te,rightIndicator:we,leftIcon:ye,rightIcon:Ce,maxLength:ve,min:c,max:U,label:X,isLabelActive:T,defaultValidation:V,wrapStyles:oe}=re,d=te(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 u(N,s(n({htmlTag:"input",type:m,inputMode:p.is.oneOf(l,"number","digitNumber","creditCard")?"numeric":l=="email"?"email":"text","data-disabled":i.disabled,"data-show-validation":Z.isShowValidation(a,!!P),"data-component-id":a.componentId,"data-input-origin":a.componentId,value:a.safeValue,autoComplete:h,autoCapitalize:v,onKeyDown:S=>{let{key:b,target:R}=S,L=R,{selectionStart:_,selectionEnd:Q}=L,K=Number(_),$=Number(Q);{let H=a.safeValue[Number(K)],A=a.safeValue[Number(K)-1];b=="Delete"&&(l=="creditCard"&&H==" "||l=="postal"&&H=="-"||l=="digitNumber"&&H==",")&&(L.setSelectionRange(K+1,$+1),S.preventDefault()),b=="Backspace"&&(l=="creditCard"&&A==" "||l=="postal"&&A=="-"||l=="digitNumber"&&A==",")&&(L.setSelectionRange(K-1,$-1),S.preventDefault()),b=="Enter"||b=="Tab"}p.scope(()=>{p.is.oneOf(l,"number","digitNumber","creditCard")&&b=="Clear"&&o(H=>s(n({},H),{rawValue:"",safeValue:"",eventType:"update",eventID:y(12),isFocusing:!0,isInspected:!1}))}),p.scope(()=>{if(!p.is.oneOf(l,"number","digitNumber")||!p.is.oneOf(b,"ArrowUp","ArrowDown"))return;let H=+(b=="ArrowUp")*2-1,A=a.rawValue.slice(-1),se=a.safeValue[$-1],D=$-1,F=String(a.safeValue),j=a.rawValue.split(".")[1],Ve=(j==null?void 0:j.length)||0;p.scope(()=>{if(!A){F="0";return}if(A=="-"){F+="0";return}if(A=="."){F+="0";return}if($==0)return;let ee=String(F).slice(0,D).match(/\./),Re=String(F).slice(D),W=String(Re.toNumber().toFixed(0)).length;se=="."&&(W=1,D=F.split(".")[0].length-1),se==","&&(W+=1,D--),ee&&(W=-1*(Ve-W));let O=F[D].toNumber()+H;O<0?O=9:O>=10&&(O=0),F=F.partReplace(D,String(O)),setTimeout(()=>{L.setSelectionRange(D+1,D+1)},1)}),o(ee=>s(n(n({},ee),w.Validation.SyncValue({allowDecimals:z,allowZeroStart:B,min:c,max:U,restrict:l,value:F})),{eventType:"update",eventID:y(12),isFocusing:!0,isInspected:!1,isValidated:!1,notice:[]})),S.preventDefault()}),G&&G(S),ne&&Z.SubmitForm(S,x)},onChange:S=>{let{value:b,selectionStart:R,selectionEnd:L}=S.target,_=w.Validation.SyncValue({allowDecimals:z,allowZeroStart:B,min:c,max:U,restrict:l,value:b});a.isComposing&&(_.safeValue=b),_.safeValue!=a.safeValue&&(o(Q=>s(n(n({},Q),_),{prevValue:a.safeValue,eventType:"update",eventID:y(12),caretFrom:Number(R),caretTo:Number(L),isFocusing:!0,isInspected:!1,isValidated:!1,notice:[]})),M&&M(S))},width:1},d),{onFocus:S=>{d!=null&&d.onFocus&&(d==null||d.onFocus(S)),o(b=>s(n({},b),{eventID:y(12),isFocusing:!0}))},onBlur:S=>{d!=null&&d.onBlur&&(d==null||d.onBlur(S)),o(b=>s(n({},b),{eventID:y(12),isFocusing:!1}))},onCompositionStart:S=>{d!=null&&d.onCompositionStart&&(d==null||d.onCompositionStart(S)),o(b=>s(n({},b),{eventID:y(12),isComposing:!0}))},onCompositionEnd:S=>{if(d!=null&&d.onCompositionEnd&&(d==null||d.onCompositionEnd(S)),l=="text"){p.interval.once(()=>{o(R=>s(n({},R),{isComposing:!1}))},100,"input.textfield.composing.end");return}let b=w.Validation.SyncValue({allowDecimals:z,allowZeroStart:B,min:c,max:U,restrict:l,value:a.safeValue});o(R=>s(n(n({},R),b),{prevValue:R.safeValue,eventType:"update",eventID:y(12),caretFrom:Number(R.safeValue.length+1),caretTo:Number(R.safeValue.length+1),isComposing:!1,isInspected:!1}))}}))},TextAreaBox:e=>{let{rootStates:i,val_status:a,set_status:o,isShallow:m}=e,X=i,{componentId:t,tone:f,required:g,form:r,label:l,isLabelActive:x,clearButton:h=!1,minRows:v,maxRows:E,multiline:J,autoHeight:Y,allowDecimals:k,allowZeroStart:ne,enableFormSubmit:le,maxLength:z,checkValidationAtFirst:B,onChange:P,onKeyDown:M,onValidate:G,onValidateDelay:ge,onUpdateValue:xe,onUpdateValidValue:be,onUserAction:Se,value:Ie="",leftIndicator:he,rightIndicator:Te,leftIcon:we,rightIcon:ye,defaultValidation:Ce,wrapStyles:ve}=X,c=te(X,["componentId","tone","required","form","label","isLabelActive","clearButton","minRows","maxRows","multiline","autoHeight","allowDecimals","allowZeroStart","enableFormSubmit","maxLength","checkValidationAtFirst","onChange","onKeyDown","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","onUserAction","value","leftIndicator","rightIndicator","leftIcon","rightIcon","defaultValidation","wrapStyles"]);return!i.multiline?null:u(N,s(n({htmlTag:"textarea","data-show-validation":Z.isShowValidation(a,!!B),"data-input-origin":a.componentId,"data-component-id":a.componentId,value:a.rawValue,width:1},c),{onFocus:T=>{c!=null&&c.onFocus&&(c==null||c.onFocus(T)),o(V=>s(n({},V),{eventID:y(12),isFocusing:!0}))},onBlur:T=>{c!=null&&c.onBlur&&(c==null||c.onBlur(T)),o(V=>s(n({},V),{eventID:y(12),isFocusing:!1}))},onCompositionStart:T=>{c!=null&&c.onCompositionStart&&(c==null||c.onCompositionStart(T)),o(V=>s(n({},V),{eventID:y(12),isComposing:!0}))},onCompositionEnd:T=>{c!=null&&c.onCompositionEnd&&(c==null||c.onCompositionEnd(T)),p.interval.once(()=>{o(V=>s(n({},V),{eventID:y(12),isComposing:!1}))},100,"input.textfield.composing.end")},onKeyDown:T=>{M&&M(T),le&&Z.SubmitForm(T,r)},onChange:T=>{let{value:V}=T.target;o(oe=>s(n({},oe),{rawValue:V,eventType:"update",eventID:y(12),isFocusing:!0,isInspected:!1,isValidated:!1,notice:[]})),P&&P(T)}}))}},$e=e=>{let{componentId:i,restrict:a="text",value:o="",min:m,max:t,allowDecimals:f,allowZeroStart:g}=e,[r,l]=pe(s(n({componentId:i},w.Validation.SyncValue({allowDecimals:f,allowZeroStart:g,min:m,max:t,restrict:a,value:o})),{prevValue:"",eventType:"init",eventID:y(12),caretFrom:null,caretTo:null})),[x,h]=pe(p.is.oneOf(a,"password","concealed")&&"password"||"text");ae(()=>{l(E=>s(n(n({},E),w.Validation.SyncValue({allowDecimals:f,allowZeroStart:g,min:m,max:t,restrict:a,value:o})),{isInspected:!1})),ce.set({[i+":set_inputType"]:h})},[]);let v={rootStates:e,val_inputType:x,set_inputType:h,val_status:r,set_status:l};return Z.CommonEffects({type:"textfield",states:e,val_status:r,set_status:l,SystemValidation:w.Validation.System,ExtraOverrideStates:E=>w.Validation.SyncValue({allowDecimals:f,allowZeroStart:g,min:m,max:t,restrict:a,value:E})}),ae(()=>{w.setSelection({id:e.id,restrict:a,val_status:r})},[r]),q(Ae,{val_status:r,set_status:l,states:v.rootStates,children:[u(Be,{componentId:e.componentId,fontSize:e.fontSize,required:e.required,label:e.label,isActive:e.isLabelActive||!!r.isFocusing||!!r.rawValue}),u(w.Shallow,n({},v)),u(w.InputBox,n({},v)),u(w.TextAreaBox,n({},v))]})},C=e=>{var i,a;return e=n({autoHeight:!0,restrict:"text",fontSize:"inherit",value:""},e),e.value=(a=w.Validation.SyncValue({allowDecimals:e.allowDecimals,allowZeroStart:e.allowZeroStart,min:e.min,max:e.max,restrict:e.restrict||"text",value:(i=e.value)!=null?i:""}).rawValue)!=null?a:"",e.multiline?(e.minRows=e.minRows||5,e.maxRows=e.maxRows||20):(e.minRows=1,e.maxRows=1),u(He,{componentId:e.componentId,children:$e,states:Le(e)})},I=C;I.Validate=w.Validation.Text,I.Katakana=e=>u(C,s(n({},e),{restrict:"katakana",multiline:!1,autoHeight:!1})),I.HankakuKatakana=e=>u(C,s(n({},e),{restrict:"hankaku.katakana",multiline:!1,autoHeight:!1})),I.CreditCard=e=>u(C,s(n({},e),{restrict:"creditCard",multiline:!1,autoHeight:!1})),I.Tel=e=>u(C,s(n({},e),{restrict:"tel",multiline:!1,autoHeight:!1})),I.Number=e=>u(C,s(n({},e),{restrict:"number",multiline:!1,autoHeight:!1})),I.DigitNumber=e=>u(C,s(n({},e),{restrict:"digitNumber",multiline:!1,autoHeight:!1})),I.Email=e=>u(C,s(n({},e),{restrict:"email",multiline:!1,autoHeight:!1})),I.Url=e=>u(C,s(n({},e),{restrict:"url",multiline:!1,autoHeight:!1})),I.Postal=e=>u(C,s(n({label:"\u90F5\u4FBF\u756A\u53F7"},e),{restrict:"postal",multiline:!1,autoHeight:!1,leftIcon:u(Me,{ssSphere:2,fontColor:"4.thin",children:"\u3012"})})),I.Password=e=>u(C,s(n({label:"\u30D1\u30B9\u30EF\u30FC\u30C9",rightIcon:u(de,{ssSphere:2.5,freeCSS:{pointerEvents:"all"},children:u(De.Sub,{ssSphere:2.5,borderRadius:"3.tone.tertiary",fontColor:"theme",flexCenter:!0,height:1,ssEffectsOnActive:["expand"],onMouseOver:i=>{me.open(i.currentTarget,"\u30C6\u30AD\u30B9\u30C8\u3092\u8868\u793A",24)},onMouseLeave:me.abort,tabIndex:-1,onClick:i=>{p(i.target).parent().parent().find("input").callback(a=>{let o=a[0];if(!o)return;let m=o.dataset.componentId;if(!m)return;let t=ce.get(m+":set_inputType");t&&t(f=>f==="password"&&"text"||"password")})},children:u(ke,{icon:Ee})})}),restrict:"password"},e),{multiline:!1,autoHeight:!1})),I.Concealed=e=>u(I.Password,s(n({label:"\u79D8\u5BC6\u9375"},e),{restrict:"concealed"})),I.Money={JPY:e=>u(I.DigitNumber,s(n({rightIcon:u(de,{fontColor:"4.thin",children:"\u5186"}),allowZeroStart:!1},e),{multiline:!1,autoHeight:!1}))};export{I as TextField,$e as TextInput,I as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{a as re,b as i,c as I,d as Q}from"../../../chunk-C5N2D3ZX.js";import{Fragment as Ee,jsx as d,jsxs as ne}from"react/jsx-runtime";import Z,{UUID as O,useStore as $}from"jmini";import*as X from"jmini";import{useState as W,useEffect as K,useRef as me}from"react";import{$$fromRoot as ue,Config as ie,ExtractStyles as de}from"../../../@utils";import{Box as z,FAI as fe}from"../../../atoms";import{Literal as he}from"../../../mols";import{Button as oe}from"../../Button";import{faClock as ge}from"@fortawesome/free-solid-svg-icons/faClock";import{faCalendarAlt as ye}from"@fortawesome/free-solid-svg-icons/faCalendarAlt";import{OptionalInputWrapper as Se,BoxWrapper as Ie,CoreEffects as H,DefaultBoxishStyles as ve}from"../core";import{RightIcon as Te}from"..";import we from"../Select";import{InputLabel as De}from"../Label";import{TimeSelector as le}from"./Selector";const C=" ~ ",be={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},"period.clock":{defaultValue:"--:--",format:/^\d{2}\D\d{2}$/,ranges:[{type:"hour",from:0,length:2},{type:"minute",from:3,length:2},{type:"hour",from:5+C.length,length:2},{type:"minute",from:8+C.length,length:2}],sets:2},"period.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,region:5},{type:"year",from:10+C.length,length:4},{type:"month",from:15+C.length,length:2},{type:"date",from:18+C.length,length:2}],sets:2},"period.month":{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+C.length,length:4},{type:"month",from:13+C.length,length:2,region:3}],sets:2},"locale.jp.warekiDate":{defaultValue:"----\u5E74--\u6708--\u65E5",format:/^\d{4}\D\d{2}\D\d{2}$/,ranges:[{type:"locale.jp.warekiDate",from:0,length:4,region:5},{type:"month",from:5,length:2,region:3},{type:"date",from:8,length:2,region:3}],sets:1}},M={PeriodMargin:" ~ ",SyncValue:e=>{let{restrict:a,value:S,era:o}=e,f=Z.flatArray(S||""),{defaultValue:E,format:T,ranges:n,sets:r}=be[a],_=[],D=a.match(/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 p=f[t]||"";if(!p.match(T))f[t]="",_.push(E);else{let m=E;p.split(/\D/).forEach((b,k)=>{if(k==0&&a=="locale.jp.warekiDate"){let h=Number(b);o!="year"&&(h>=2019?o=="reiwa"?h-=2018:o=="heisei"&&(h=31):h>=1989?o=="heisei"?h-=1988:o=="shouwa"&&(h=64):h>=1926?o=="shouwa"?h-=1925:o=="taisho"&&(h=15):h>=1912?o=="taisho"?h-=1911:o=="meiji"&&(h=45):h>=1868&&(h-=1867)),b=h.zeroEmbed(4)}m=m.replace(new RegExp("------------------".slice(0,b.length)),b)}),_.push(m)}}return{safeValue:_.join(C),rawValue:a.startsWith("period.")?f:f[0],ranges:n}},SystemValidation:e=>{let{states:a}=e,{restrict:S,min:o,max:f,required:E}=a,T=[],n=Z.flatArray(e.value),r={empty:!1,escalated:1,filled:!0,correct:!0,prohibited:!1};(()=>{let D=S.match(/clock/)?":":"/";for(let t=0;t<n.length;t++)n[t]=String(n[t]).replace(/\D/ig,D);for(let t=0;t<n.length;t++){let p=n[t],m=n[t-1];p.removeLetters()||(r.empty=!0),t>0&&(r.escalated&=+(p>=m))}r.escalated&&(r.empty||(S.match(/clock/)?n.forEach(t=>{let[p,m]=t.split(/\D+/);!p||!m?r.filled=!1:(Number(p)>23||Number(m)>59)&&(r.correct=!1)}):S.match(/date/)?n.forEach(t=>{let[p,m,b]=t.split(/\D+/);if(!p||!m||!b)r.filled=!1;else{let k=X.Time(t);(!k.validate||t!=k.toFormatYMD())&&(r.correct=!1)}}):S.match(/week/)?n.forEach(t=>{let[p,m]=t.split(/\D+/);if(!p||!m)r.filled=!1;else{let b=X.Time(p+"/01/01").weekday,h=X.Time(p+"/01/0"+(7-b+1)).addWeek(Number(m)-1);p!=String(h.year)&&(r.correct=!1)}}):S.match(/month/)?n.forEach(t=>{let[p,m]=t.split(/\D+/);!p||!m?r.filled=!1:X.Time([p,m,"01"].join("/")).validate||(r.correct=!1)}):S.match(/year/),r.filled&&r.correct&&n.forEach(t=>{{let p=Number(String(t).replace(/\D/ig,""));if(o&&Number(String(o).replace(/\D/ig,""))>p&&(r.prohibited=!0),f){let m=Number(String(f).replace(/\D/ig,""));p>m&&(r.prohibited=!0)}}})))})();{let{empty:D,escalated:t,filled:p,correct:m,prohibited:b}=r;D&&E&&(T=[{type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"}]),t||T.push({type:"invalid",label:"\u6642\u7CFB\u5217\u3092\u6B63\u3057\u304F\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"}),m||T.push({type:"invalid",label:"\u7121\u52B9\u306A\u5024\u304C\u5165\u529B\u3055\u308C\u3066\u3044\u307E\u3059"}),p||T.push({type:"invalid",label:"\u6700\u5F8C\u307E\u3067\u5024\u3092\u57CB\u3081\u3066\u304F\u3060\u3055\u3044"}),b&&T.push({type:"invalid",label:ne(Ee,{children:[d(z,{children:"\u5165\u529B\u7BC4\u56F2\u304C\u5236\u9650\u3055\u308C\u3066\u3044\u307E\u3059"}),"[",o||"\u4E0B\u9650\u7121\u3057","] ~ [",f||"\u4E0A\u9650\u7121\u3057","]"]})})}return{ok:!T.filter(({type:D})=>D=="invalid").length,notice:T}},KeyDownEvent:e=>{let{val_era:a,restrict:S,event:o,val_status:f,set_status:E,val_focus:T,set_focus:n}=e,{key:r,shiftKey:_,ctrlKey:D,metaKey:t}=o,p=D||t,{selectionStart:m,selectionEnd:b}=o.target,{index:k,prevIndex:h}=T,{ranges:Y,safeValue:q}=f,F=Y.length-1;if(["Tab","ArrowLeft","ArrowRight"].includes(r)){let u=0;if(r=="Tab"){let c=+!_*2-1;if(u=T.index+c,u<0||u>F)return}else{let c=r=="ArrowLeft"?-1:r=="ArrowRight"?1:0;p||m==0&&b==String(f.safeValue).length?u=c==1?F:0:u=Math.max(0,Math.min(k+c,F))}n(c=>I(i({},c),{index:u,prevIndex:k})),o.preventDefault()}if(["Backspace","ArrowUp","ArrowDown","0","1","2","3","4","5","6","7","8","9"].includes(r)){o.preventDefault();let u=k;u=Math.max(u,0),u=Math.min(u,F);let{type:c,from:U,length:G}=Y[u],j=q.slice(U,U+G),v;if(r=="Backspace")v="------".slice(0,G);else if(["ArrowUp","ArrowDown"].includes(r)){let P=r=="ArrowUp"?1:-1;j=j|0,v=j+P;let[w,s,x]=c=="locale.jp.warekiDate"?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];v>s?v=w:v<w&&(v=s),v=Number(v).zeroEmbed(x)}else if(["0","1","2","3","4","5","6","7","8","9"].includes(r)){let P=j|0,w=r,s=`${P}${w}`;if(h!=k&&(P=0,s="0"+w),c=="year"||c=="locale.jp.warekiDate"&&a=="year")Number(s)>1e4?v=w:v=s,(v|0)>1e3&&u++;else if(["hour","minute","date","week","month"].includes(c)||c=="locale.jp.warekiDate"&&a!="year"){let x=c=="locale.jp.warekiDate"?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;v=(s|0)>x?w:s,(Number(w)>Number(String(x)[0])||j=="0000".slice(0,String(x).length)&&(s!="0000".slice(0,String(x).length)||["minute","hour"].includes(c)&&h==k)||(s|0)>=re(10,String(x).length-1))&&u++}c=="year"||c=="locale.jp.warekiDate"?v=(v|0).zeroEmbed(4):v=(v|0).zeroEmbed(2)}{let P=String(q).partReplace(U,String(v)),w=P.split(C).map(s=>s.replace(/(^\D|\D$)/,"").split(/\D+/).join(S.match(/clock/)&&":"||"/").replace(/(^\D|\D$)/,""));if(S=="locale.jp.warekiDate"){let s=w[0].split(/\D/),[x,g,R]=s;s.length==3&&x&&(w=[[Number(x)-1+Number({year:1,reiwa:2019,heisei:1989,shouwa:1926,taisho:1912,meiji:1868}[a]),g,R].join("/")])}u=Math.max(u,0),u=Math.min(u,F),E(s=>I(i({},s),{rawValue:S.startsWith("period.")?w:w[0],safeValue:P,eventType:"update",eventID:O(12),isInspected:!1})),n(s=>I(i({},s),{index:u,prevIndex:s.index}))}}},Shallow:e=>{let{rootStates:a,val_status:S}=e,o=de(a);return d(z,{position:"absolute",top:0,left:0,right:0,height:0,overflow:"hidden",opacity:"trans",freeCSS:{zIndex:3,pointerEvents:"none"},children:d(he.Description,I(i({className:a.className},o),{position:"absolute",width:1,freeCSS:I(i({},o.freeCSS),{color:"orange"}),children:d(z,{"data-input-value-shallow":S.componentId,children:"A"})}))})}},xe=e=>{let te=e,{tone:a,required:S,restrict:o="clock",componentId:f,era:E,form:T,name:n,min:r,max:_,className:D,enableFormSubmit:t,checkValidationAtFirst:p,onKeyDown:m,periodPresets:b,onValidate:k,onValidateDelay:h,onUpdateValue:Y,onUpdateValidValue:q,onUserAction:F,value:u="",leftIndicator:c,rightIndicator:U,leftIcon:G,rightIcon:j,freeCSS:v,wrapStyles:P}=te,w=Q(te,["tone","required","restrict","componentId","era","form","name","min","max","className","enableFormSubmit","checkValidationAtFirst","onKeyDown","periodPresets","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","onUserAction","value","leftIndicator","rightIndicator","leftIcon","rightIcon","freeCSS","wrapStyles"]),[s,x]=W(E||"year"),[g,R]=W(I(i({componentId:e.componentId||""},M.SyncValue({restrict:o,value:u,era:s})),{ranges:[],eventType:"init",eventID:O(12)})),[B,N]=W({active:!1,index:0,prevIndex:-1}),se={rootStates:e,val_status:g,set_status:R,val_era:s,set_era:x,val_focus:B,set_focus:N};H.CommonEffects({type:"time",states:e,val_status:g,set_status:R,SystemValidation:M.SystemValidation,ExtraOverrideStates:l=>M.SyncValue({restrict:o,value:l,era:s})}),K(()=>{R(l=>I(i(i({},l),M.SyncValue({restrict:o,value:u,era:s})),{isInspected:!1}))},[]);const ee=me(!1);return K(()=>{if(ee.current){R(y=>I(i(i({},y),M.SyncValue({restrict:o,value:y.rawValue,era:s})),{isInspected:!1}));let l=$.get("refreshEra_"+g.componentId);l&&l.refreshEra(s)}else ee.current=!0},[s]),$.update({[g.componentId]:{openPicker:l=>{e.disabled||le.picker.open({restrict:o,era:E,defaultValue:g.rawValue,min:r,max:_,periodPresets:e.periodPresets,onValueUpdate:y=>{y.eventType=="commit"&&(R(A=>I(i(i({},A),M.SyncValue({restrict:o,value:y.value,era:y.era})),{eventType:"update",eventID:O(12),isInspected:!1,isValidated:!1,notice:[]})),x(y.era))}})},resetEra:l=>{x(l),R(y=>I(i(i({},y),M.SyncValue({restrict:o,value:"",era:s})),{eventType:"update",eventID:O(12),isInspected:!1}))}}}),K(()=>{let{index:l,active:y}=B;if(y){l=Math.max(l,0),l=Math.min(l,g.ranges.length-1);let{from:A,length:J}=g.ranges[l],L=ue("#"+e.id)[0];L&&L.setSelectionRange&&L.setSelectionRange(A,A+J)}R(A=>I(i({},A),{isFocusing:y}))},[B]),ne(Ie,{val_status:g,set_status:R,states:e,children:[d(M.Shallow,i({},se)),d(De,{componentId:e.componentId,fontSize:e.fontSize,required:e.required,label:e.label,isActive:!0}),ie.get().isTouchDevice?d(oe.Plain,I(i({"data-show-validation":H.isShowValidation(g,!!p),"data-component-id":g.componentId,"data-input-origin":g.componentId,"data-disabled":e.disabled,className:D,freeCSS:{textAlign:"left"}},w),{children:g.safeValue,onClick:l=>{let y=$.get(g.componentId);y&&y.openPicker(`[data-input-origin="${g.componentId}"]`),l.stopPropagation()},onFocus:()=>{N(l=>I(i({},l),{active:!0}))},onBlur:()=>{N(l=>I(i({},l),{active:!1}))}})):d(z,i({htmlTag:"input",type:"text",inputMode:"numeric","data-show-validation":H.isShowValidation(g,!!p),"data-input-origin":g.componentId,"data-disabled":e.disabled,value:g.safeValue,className:D,tabIndex:ie.get().isTouchDevice?-1:0,onKeyDown:l=>{M.KeyDownEvent({restrict:o,event:l,val_era:s,val_status:g,set_status:R,val_focus:B,set_focus:N}),m&&m(l),t&&H.SubmitForm(l,T)},onKeyUp:l=>{l.key=="Tab"&&N(y=>I(i({},y),{active:!0}))},onClick:l=>{let y=l.target.selectionEnd,A=0;g.ranges.forEach((J,L)=>{let{from:ae,length:ce,region:pe}=J;ae<=y&&y<=ae+(pe||ce)&&(A=L)}),N(J=>I(i({},J),{active:!0,index:A})),l.preventDefault()},onBlur:()=>{N(l=>I(i({},l),{active:!1}))},onChange:()=>{}},w))]})},V={Origin:e=>{let a=i({fontSize:"inherit",width:1,value:""},e);a.value=a.value||"";let[S]=W(e.componentId||O(12));if(a.componentId=S,Z.is.nullish(a.rightIcon)){let o=(e.restrict||"").match(/clock/)?ge:ye;a.rightIcon=d(Te,{ssSphere:2.5,freeCSS:{pointerEvents:"all"},children:d(oe.Sub,{color:"cloud",border:"unset",ssSphere:2.5,fontColor:"theme",boxShadow:"0.normal",borderRadius:"3.tone.tertiary",flexCenter:!0,ssEffectsOnActive:"push",tabIndex:-1,id:"Picker-"+a.componentId,onClick:()=>{let f=$.get(a.componentId);f&&f.openPicker("#Picker-"+a.componentId)},children:d(fe,{icon:o})})})}return d(Se,{componentId:a.componentId,children:xe,states:ve(a)})},Clock:e=>d(V.Origin,i({restrict:"clock",era:"clock"},e)),Date:e=>d(V.Origin,i({restrict:"date"},e)),Week:e=>d(V.Origin,i({restrict:"week"},e)),Month:e=>d(V.Origin,i({restrict:"month"},e)),Year:e=>d(V.Origin,i({restrict:"year"},e)),Locale:{JP:{WarekiDate:e=>{e=i({},e);let[a]=W(e.componentId||O(12));e.componentId=a;let T=e,{defaultEra:S="wareki"}=T,o=Q(T,["defaultEra"]),[f,E]=W((()=>{let n="year";if(S=="wareki"&&(n="reiwa",e.value)){let[r,_,D]=e.value.split(/\D/);if(r&&_&&D){let t=Number(r);t>=2019?(t-=2019,n="reiwa"):t>=1989?(t-=1989,n="heisei"):t>=1926?(t-=1926,n="shouwa"):t>=1912?(t-=1912,n="taisho"):t>=1868&&(t-=1868,n="meiji"),t+=1}}return n})());return K(()=>{$.set({["refreshEra_"+a]:{refreshEra:n=>{E(n)}}})},[]),d(V.Origin,I(i({restrict:"locale.jp.warekiDate",leftIndicator:d(we,{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:n=>{E(n);let r=$.get(e.componentId);r&&r.resetEra&&r.resetEra(n)}})},o),{era:f}))}}},Periods:{Clock:e=>d(V.Origin,i({restrict:"period.clock",era:"clock"},e)),Date:e=>d(V.Origin,i({restrict:"period.date"},e)),Month:e=>d(V.Origin,i({restrict:"period.month"},e))}};export{V as Time,le as TimeSelector,V as default};
|
|
1
|
+
import{a as re,b as i,c as I,d as Z}from"../../../chunk-C5N2D3ZX.js";import{Fragment as Ee,jsx as f,jsxs as le}from"react/jsx-runtime";import C,{UUID as $,useStore as W}from"jmini";import*as K from"jmini";import{useState as B,useEffect as z,useRef as me}from"react";import{$$fromRoot as ue,Config as ie,ExtractStyles as fe}from"../../../@utils";import{Box as H,FAI as de}from"../../../atoms";import{Literal as he}from"../../../mols";import{Button as oe}from"../../Button";import{faClock as ge}from"@fortawesome/free-solid-svg-icons/faClock";import{faCalendarAlt as ye}from"@fortawesome/free-solid-svg-icons/faCalendarAlt";import{OptionalInputWrapper as Se,BoxWrapper as Ie,CoreEffects as Y,DefaultBoxishStyles as ve}from"../core";import{RightIcon as Te}from"..";import we from"../Select";import{InputLabel as De}from"../Label";import{TimeSelector as ne}from"./Selector";const M=" ~ ",be={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},"period.clock":{defaultValue:"--:--",format:/^\d{2}\D\d{2}$/,ranges:[{type:"hour",from:0,length:2},{type:"minute",from:3,length:2},{type:"hour",from:5+M.length,length:2},{type:"minute",from:8+M.length,length:2}],sets:2},"period.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,region:5},{type:"year",from:10+M.length,length:4},{type:"month",from:15+M.length,length:2},{type:"date",from:18+M.length,length:2}],sets:2},"period.month":{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+M.length,length:4},{type:"month",from:13+M.length,length:2,region:3}],sets:2},"locale.jp.warekiDate":{defaultValue:"----\u5E74--\u6708--\u65E5",format:/^\d{4}\D\d{2}\D\d{2}$/,ranges:[{type:"locale.jp.warekiDate",from:0,length:4,region:5},{type:"month",from:5,length:2,region:3},{type:"date",from:8,length:2,region:3}],sets:1}},O={PeriodMargin:" ~ ",SyncValue:e=>{let{restrict:a,value:S,era:o}=e,d=C.flatArray(S||""),{defaultValue:E,format:T,ranges:l,sets:r}=be[a],_=[],D=a.match(/clock/)?":":"/";for(let t=0;t<d.length;t++)d[t]=String(d[t]).replace(/\D/ig,D);for(let t=0;t<r;t++){let p=d[t]||"";if(!p.match(T))d[t]="",_.push(E);else{let m=E;p.split(/\D/).forEach((b,k)=>{if(k==0&&a=="locale.jp.warekiDate"){let h=Number(b);o!="year"&&(h>=2019?o=="reiwa"?h-=2018:o=="heisei"&&(h=31):h>=1989?o=="heisei"?h-=1988:o=="shouwa"&&(h=64):h>=1926?o=="shouwa"?h-=1925:o=="taisho"&&(h=15):h>=1912?o=="taisho"?h-=1911:o=="meiji"&&(h=45):h>=1868&&(h-=1867)),b=h.zeroEmbed(4)}m=m.replace(new RegExp("------------------".slice(0,b.length)),b)}),_.push(m)}}return{safeValue:_.join(M),rawValue:a.startsWith("period.")?d:d[0],ranges:l}},SystemValidation:e=>{let{states:a}=e,{restrict:S,min:o,max:d,required:E}=a,T=[],l=C.flatArray(e.value),r={empty:!1,escalated:1,filled:!0,correct:!0,prohibited:!1};(()=>{let D=S.match(/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 p=l[t],m=l[t-1];p.removeLetters()||(r.empty=!0),t>0&&(r.escalated&=+(p>=m))}r.escalated&&(r.empty||(S.match(/clock/)?l.forEach(t=>{let[p,m]=t.split(/\D+/);!p||!m?r.filled=!1:(Number(p)>23||Number(m)>59)&&(r.correct=!1)}):S.match(/date/)?l.forEach(t=>{let[p,m,b]=t.split(/\D+/);if(!p||!m||!b)r.filled=!1;else{let k=K.Time(t);(!k.validate||t!=k.toFormatYMD())&&(r.correct=!1)}}):S.match(/week/)?l.forEach(t=>{let[p,m]=t.split(/\D+/);if(!p||!m)r.filled=!1;else{let b=K.Time(p+"/01/01").weekday,h=K.Time(p+"/01/0"+(7-b+1)).addWeek(Number(m)-1);p!=String(h.year)&&(r.correct=!1)}}):S.match(/month/)?l.forEach(t=>{let[p,m]=t.split(/\D+/);!p||!m?r.filled=!1:K.Time([p,m,"01"].join("/")).validate||(r.correct=!1)}):S.match(/year/),r.filled&&r.correct&&l.forEach(t=>{{let p=Number(String(t).replace(/\D/ig,""));if(o&&Number(String(o).replace(/\D/ig,""))>p&&(r.prohibited=!0),d){let m=Number(String(d).replace(/\D/ig,""));p>m&&(r.prohibited=!0)}}})))})();{let{empty:D,escalated:t,filled:p,correct:m,prohibited:b}=r;D&&E&&(T=[{type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"}]),t||T.push({type:"invalid",label:"\u6642\u7CFB\u5217\u3092\u6B63\u3057\u304F\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"}),m||T.push({type:"invalid",label:"\u7121\u52B9\u306A\u5024\u304C\u5165\u529B\u3055\u308C\u3066\u3044\u307E\u3059"}),p||T.push({type:"invalid",label:"\u6700\u5F8C\u307E\u3067\u5024\u3092\u57CB\u3081\u3066\u304F\u3060\u3055\u3044"}),b&&T.push({type:"invalid",label:le(Ee,{children:[f(H,{children:"\u5165\u529B\u7BC4\u56F2\u304C\u5236\u9650\u3055\u308C\u3066\u3044\u307E\u3059"}),"[",o||"\u4E0B\u9650\u7121\u3057","] ~ [",d||"\u4E0A\u9650\u7121\u3057","]"]})})}return{ok:!T.filter(({type:D})=>D=="invalid").length,notice:T}},KeyDownEvent:e=>{let{val_era:a,restrict:S,event:o,val_status:d,set_status:E,val_focus:T,set_focus:l}=e,{key:r,shiftKey:_,ctrlKey:D,metaKey:t}=o,p=D||t,{selectionStart:m,selectionEnd:b}=o.target,{index:k,prevIndex:h}=T,{ranges:q,safeValue:G}=d,F=q.length-1;if(C.is.oneOf(r,"Tab","ArrowLeft","ArrowRight")){let u=0;if(r=="Tab"){let c=+!_*2-1;if(u=T.index+c,u<0||u>F)return}else{let c=r=="ArrowLeft"?-1:r=="ArrowRight"?1:0;p||m==0&&b==String(d.safeValue).length?u=c==1?F:0:u=Math.max(0,Math.min(k+c,F))}l(c=>I(i({},c),{index:u,prevIndex:k})),o.preventDefault()}if(C.is.oneOf(r,"Backspace","ArrowUp","ArrowDown","0","1","2","3","4","5","6","7","8","9")){o.preventDefault();let u=k;u=Math.max(u,0),u=Math.min(u,F);let{type:c,from:X,length:Q}=q[u],j=G.slice(X,X+Q),v;if(r=="Backspace")v="------".slice(0,Q);else if(C.is.oneOf(r,"ArrowUp","ArrowDown")){let P=r=="ArrowUp"?1:-1;j=j|0,v=j+P;let[w,s,x]=c=="locale.jp.warekiDate"?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];v>s?v=w:v<w&&(v=s),v=Number(v).zeroEmbed(x)}else if(C.is.oneOf(r,"0","1","2","3","4","5","6","7","8","9")){let P=j|0,w=r,s=`${P}${w}`;if(h!=k&&(P=0,s="0"+w),c=="year"||c=="locale.jp.warekiDate"&&a=="year")Number(s)>1e4?v=w:v=s,(v|0)>1e3&&u++;else if(C.is.oneOf(c,"hour","minute","date","week","month")||c=="locale.jp.warekiDate"&&a!="year"){let x=c=="locale.jp.warekiDate"?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;v=(s|0)>x?w:s,(Number(w)>Number(String(x)[0])||j=="0000".slice(0,String(x).length)&&(s!="0000".slice(0,String(x).length)||C.is.oneOf(c,"minute","hour")&&h==k)||(s|0)>=re(10,String(x).length-1))&&u++}c=="year"||c=="locale.jp.warekiDate"?v=(v|0).zeroEmbed(4):v=(v|0).zeroEmbed(2)}{let P=String(G).partReplace(X,String(v)),w=P.split(M).map(s=>s.replace(/(^\D|\D$)/,"").split(/\D+/).join(S.match(/clock/)&&":"||"/").replace(/(^\D|\D$)/,""));if(S=="locale.jp.warekiDate"){let s=w[0].split(/\D/),[x,g,R]=s;s.length==3&&x&&(w=[[Number(x)-1+Number({year:1,reiwa:2019,heisei:1989,shouwa:1926,taisho:1912,meiji:1868}[a]),g,R].join("/")])}u=Math.max(u,0),u=Math.min(u,F),E(s=>I(i({},s),{rawValue:S.startsWith("period.")?w:w[0],safeValue:P,eventType:"update",eventID:$(12),isInspected:!1})),l(s=>I(i({},s),{index:u,prevIndex:s.index}))}}},Shallow:e=>{let{rootStates:a,val_status:S}=e,o=fe(a);return f(H,{position:"absolute",top:0,left:0,right:0,height:0,overflow:"hidden",opacity:"trans",freeCSS:{zIndex:3,pointerEvents:"none"},children:f(he.Description,I(i({className:a.className},o),{position:"absolute",width:1,freeCSS:I(i({},o.freeCSS),{color:"orange"}),children:f(H,{"data-input-value-shallow":S.componentId,children:"A"})}))})}},xe=e=>{let te=e,{tone:a,required:S,restrict:o="clock",componentId:d,era:E,form:T,name:l,min:r,max:_,className:D,enableFormSubmit:t,checkValidationAtFirst:p,onKeyDown:m,periodPresets:b,onValidate:k,onValidateDelay:h,onUpdateValue:q,onUpdateValidValue:G,onUserAction:F,value:u="",leftIndicator:c,rightIndicator:X,leftIcon:Q,rightIcon:j,freeCSS:v,wrapStyles:P}=te,w=Z(te,["tone","required","restrict","componentId","era","form","name","min","max","className","enableFormSubmit","checkValidationAtFirst","onKeyDown","periodPresets","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","onUserAction","value","leftIndicator","rightIndicator","leftIcon","rightIcon","freeCSS","wrapStyles"]),[s,x]=B(E||"year"),[g,R]=B(I(i({componentId:e.componentId||""},O.SyncValue({restrict:o,value:u,era:s})),{ranges:[],eventType:"init",eventID:$(12)})),[J,N]=B({active:!1,index:0,prevIndex:-1}),se={rootStates:e,val_status:g,set_status:R,val_era:s,set_era:x,val_focus:J,set_focus:N};Y.CommonEffects({type:"time",states:e,val_status:g,set_status:R,SystemValidation:O.SystemValidation,ExtraOverrideStates:n=>O.SyncValue({restrict:o,value:n,era:s})}),z(()=>{R(n=>I(i(i({},n),O.SyncValue({restrict:o,value:u,era:s})),{isInspected:!1}))},[]);const ee=me(!1);return z(()=>{if(ee.current){R(y=>I(i(i({},y),O.SyncValue({restrict:o,value:y.rawValue,era:s})),{isInspected:!1}));let n=W.get("refreshEra_"+g.componentId);n&&n.refreshEra(s)}else ee.current=!0},[s]),W.update({[g.componentId]:{openPicker:n=>{e.disabled||ne.picker.open({restrict:o,era:E,defaultValue:g.rawValue,min:r,max:_,periodPresets:e.periodPresets,onValueUpdate:y=>{y.eventType=="commit"&&(R(A=>I(i(i({},A),O.SyncValue({restrict:o,value:y.value,era:y.era})),{eventType:"update",eventID:$(12),isInspected:!1,isValidated:!1,notice:[]})),x(y.era))}})},resetEra:n=>{x(n),R(y=>I(i(i({},y),O.SyncValue({restrict:o,value:"",era:s})),{eventType:"update",eventID:$(12),isInspected:!1}))}}}),z(()=>{let{index:n,active:y}=J;if(y){n=Math.max(n,0),n=Math.min(n,g.ranges.length-1);let{from:A,length:L}=g.ranges[n],U=ue("#"+e.id)[0];U&&U.setSelectionRange&&U.setSelectionRange(A,A+L)}R(A=>I(i({},A),{isFocusing:y}))},[J]),le(Ie,{val_status:g,set_status:R,states:e,children:[f(O.Shallow,i({},se)),f(De,{componentId:e.componentId,fontSize:e.fontSize,required:e.required,label:e.label,isActive:!0}),ie.get().isTouchDevice?f(oe.Plain,I(i({"data-show-validation":Y.isShowValidation(g,!!p),"data-component-id":g.componentId,"data-input-origin":g.componentId,"data-disabled":e.disabled,className:D,freeCSS:{textAlign:"left"}},w),{children:g.safeValue,onClick:n=>{let y=W.get(g.componentId);y&&y.openPicker(`[data-input-origin="${g.componentId}"]`),n.stopPropagation()},onFocus:()=>{N(n=>I(i({},n),{active:!0}))},onBlur:()=>{N(n=>I(i({},n),{active:!1}))}})):f(H,i({htmlTag:"input",type:"text",inputMode:"numeric","data-show-validation":Y.isShowValidation(g,!!p),"data-input-origin":g.componentId,"data-disabled":e.disabled,value:g.safeValue,className:D,tabIndex:ie.get().isTouchDevice?-1:0,onKeyDown:n=>{O.KeyDownEvent({restrict:o,event:n,val_era:s,val_status:g,set_status:R,val_focus:J,set_focus:N}),m&&m(n),t&&Y.SubmitForm(n,T)},onKeyUp:n=>{n.key=="Tab"&&N(y=>I(i({},y),{active:!0}))},onClick:n=>{let y=n.target.selectionEnd,A=0;g.ranges.forEach((L,U)=>{let{from:ae,length:ce,region:pe}=L;ae<=y&&y<=ae+(pe||ce)&&(A=U)}),N(L=>I(i({},L),{active:!0,index:A})),n.preventDefault()},onBlur:()=>{N(n=>I(i({},n),{active:!1}))},onChange:()=>{}},w))]})},V={Origin:e=>{let a=i({fontSize:"inherit",width:1,value:""},e);a.value=a.value||"";let[S]=B(e.componentId||$(12));if(a.componentId=S,C.is.nullish(a.rightIcon)){let o=(e.restrict||"").match(/clock/)?ge:ye;a.rightIcon=f(Te,{ssSphere:2.5,freeCSS:{pointerEvents:"all"},children:f(oe.Sub,{color:"cloud",border:"unset",ssSphere:2.5,fontColor:"theme",boxShadow:"0.normal",borderRadius:"3.tone.tertiary",flexCenter:!0,ssEffectsOnActive:"push",tabIndex:-1,id:"Picker-"+a.componentId,onClick:()=>{let d=W.get(a.componentId);d&&d.openPicker("#Picker-"+a.componentId)},children:f(de,{icon:o})})})}return f(Se,{componentId:a.componentId,children:xe,states:ve(a)})},Clock:e=>f(V.Origin,i({restrict:"clock",era:"clock"},e)),Date:e=>f(V.Origin,i({restrict:"date"},e)),Week:e=>f(V.Origin,i({restrict:"week"},e)),Month:e=>f(V.Origin,i({restrict:"month"},e)),Year:e=>f(V.Origin,i({restrict:"year"},e)),Locale:{JP:{WarekiDate:e=>{e=i({},e);let[a]=B(e.componentId||$(12));e.componentId=a;let T=e,{defaultEra:S="wareki"}=T,o=Z(T,["defaultEra"]),[d,E]=B((()=>{let l="year";if(S=="wareki"&&(l="reiwa",e.value)){let[r,_,D]=e.value.split(/\D/);if(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(()=>{W.set({["refreshEra_"+a]:{refreshEra:l=>{E(l)}}})},[]),f(V.Origin,I(i({restrict:"locale.jp.warekiDate",leftIndicator:f(we,{label:"\u5143\u53F7",emptySelect:!1,value:d,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=W.get(e.componentId);r&&r.resetEra&&r.resetEra(l)}})},o),{era:d}))}}},Periods:{Clock:e=>f(V.Origin,i({restrict:"period.clock",era:"clock"},e)),Date:e=>f(V.Origin,i({restrict:"period.date"},e)),Month:e=>f(V.Origin,i({restrict:"period.month"},e))}};export{V as Time,ne as TimeSelector,V as default};
|
package/dist/fn/Input/core.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{b as i,c as l,e as b}from"../../chunk-C5N2D3ZX.js";import{jsx as y,jsxs as h}from"react/jsx-runtime";import{useState as w,useEffect as S}from"react";import
|
|
1
|
+
import{b as i,c as l,e as b}from"../../chunk-C5N2D3ZX.js";import{jsx as y,jsxs as h}from"react/jsx-runtime";import{useState as w,useEffect as S}from"react";import u,{UUID as m,useStore as v}from"jmini";import{$$fromRoot as k}from"../../@utils";import{InputClasses as _}from"../../@styles/componentClasses";import{Box as D,Flex as B,FAI as V,Column as E}from"../../atoms";import{Row as x,Literal as O}from"../../mols";import{Button as A}from"../Button";import g from"../Tooltips";const te=e=>{let[n]=w(e.componentId||m(12));e=i({},e),e.states=l(i({enableFormSubmit:!0,status_id:m(8),override:"never",form:"",id:m(),"aria-label":"Input-"+n},e.states),{componentId:n});let{children:a}=e;return y(a,i({},e.states))},ae=e=>{let{children:n,val_status:a,states:t}=e,{leftIcon:s,wrapStyles:p}=t,r=a.notice||[];return t.checkValidationAtFirst||a.eventType=="init"&&(r=[]),h(x.Center,l(i({position:"relative",verticalAlign:"unset",gap:0},p),{className:_("Wrapper"),"data-notice-uid":a.componentId,children:[y(T.Notice,{notice:r,val_status:a}),t.leftIndicator,h(B,{position:"relative",flexSizing:"auto",children:[n,s,y(T.RightIcon,i({},e)),y(T.ClearButton,i({},e))]}),t.rightIndicator]}))},T={ClearButton:e=>!e.states.clearButton||!e.val_status.rawValue?null:y(A.Normal,{ssSphere:2,flexCenter:!0,fontColor:"5.translucent",ssEffectsOnActive:["ripple.theme"],position:"absolute",right:1,top:"50%",freeCSS:{zIndex:3,transform:"translateY(-50%)"},onClick:()=>{e.set_status(n=>l(i({},n),{rawValue:"",safeValue:"",eventType:"update",eventID:m(12),isInspected:!1}))},children:y(V.X,{})}),RightIcon:e=>e.states.clearButton&&e.val_status.rawValue?null:e.states.rightIcon,Notice:e=>{let{notice:n,val_status:a}=e,{componentId:t}=a,s="NoticeTimer-"+t,p="NoticeTimerClose-"+t,r="notice-tips-"+t;return S(()=>{u.interval.once(()=>{if(!(n!=null&&n.length)){g.close(r);return}g.open({tipsID:r,parent:`[data-notice-uid="${t}"]`,gravityPoint:24,padding:[1,0],closeAtParentBlur:!1,content:h(g.Body,{padding:["1/2","2/3"],fontSize:"1.mini",position:"relative",children:[y(D,{position:"absolute",unitHeight:1,unitWidth:1,right:1,backgroundColor:"dark",freeCSS:{zIndex:1,transform:"rotate(45deg)",top:-6}}),y(E,{backgroundColor:"inherit",gap:"1/3",position:"relative",freeCSS:{zIndex:2},children:n.map((d,f)=>{let{type:o,label:c}=d,I=o=="invalid"?V.Exclamation:o=="warn"?V.Exclamation:V.Check;return h(x.Left,{gap:0,borderRadius:"2.tone.secondary",children:[y(I,{flexCenter:!0,fontSize:"2.normal",fontColor:{invalid:"nega",warn:"warn",valid:"posi"}[o]}),y(O.Supplement,{fontSize:"0.xs",fontColor:"white",children:c})]},f+"-"+u.Stringify(d))})})]})})},350,s),u.interval.once(()=>{g.close(r)},6e3,p)},[n]),null}},F={DefaultStatus:(e,n)=>({componentId:e,rawValue:n,eventType:"init",eventID:m(12)}),CommonEffects:function(e){let{type:n,states:a,val_status:t,set_status:s,SystemValidation:p}=e;a=i({},a);let{componentId:r}=t;S(()=>(v.update({[`input_alias:id:${a.id}`]:{componentId:r},[`input_alias:name:${a.name}`]:{componentId:r},[r]:{ResolveRefresh:null,remoteUpdate:d=>{s(f=>l(i({},f),{isInspected:!1,isValidated:!1,rawValue:d,status_id:m(8),eventType:"update.remote",eventID:m(12)}))},Refresh:()=>new Promise((d,f)=>{v.get(r).ResolveRefresh=d,s(o=>l(i({},o),{isInspected:!1,eventType:"refresh",eventID:m(12)}))})}}),()=>{v.delete(r)}),[]),S(()=>{F.ValidationCheck({val_status:t,set_status:s,SystemValidation:p,states:a})},[t.eventID,t.rawValue]),u.scope(()=>{let{override:d}=a;if(t.eventType=="update.remote"){s(C=>l(i(i({},C),e.ExtraOverrideStates&&e.ExtraOverrideStates(t.rawValue)),{eventType:"override",eventID:m(12),isInspected:!1,isValidated:!1}));return}if(d=="never"||d=="beforeModified"&&!u.is.oneOf(t.eventType,"init","override")||t.isComposing)return;let f=v.get(t.componentId);if(!f)return;let o=a.value,c=t.rawValue;if(e.ExtraOverrideStates&&(o=e.ExtraOverrideStates(o).rawValue||o),u.is.equal(o,c)){f.status_id=a.status_id;return}let I=u.SortifyObject(o),R=u.SortifyObject(c);if(I&&R&&u.is.equal(I,R)){f.status_id=a.status_id;return}a.status_id!=f.status_id&&(t.eventType=="update"&&!t.isInspected||s(C=>l(i(l(i({},C),{rawValue:o}),e.ExtraOverrideStates&&e.ExtraOverrideStates(o)),{eventType:"override",eventID:m(12),isInspected:!1,isValidated:!1})))});{let{componentId:d,eventType:f}=t,o={eventType:f,componentId:d,isInspected:!!t.isInspected,isValidated:!!t.isValidated,isComposing:!!t.isComposing,isFocusing:!!t.isFocusing,isPickerOpen:!!t.isPickerOpen},c=t.rawValue;n=="autocomplete.single"?c=u.flatArray(c)[0]:n=="list.radio"?c=u.flatArray(c)[0]:a.isChecker&&(c=!!u.flatArray(c)[0]),S(()=>(u.scope(()=>{if(a.form=a.form||"testForm",a.name&&a.form&&v.update({[["form-data",a.form].join("-")]:{[a.name]:{componentId:d,type:n,value:c,validation:t.isValidated}}}),!t.isInspected||f!="refresh")return;let I=v.get(d);I&&I.ResolveRefresh&&I.ResolveRefresh(null)}),()=>{v.update({[["form-data",a.form].join("-")]:{[a.name]:null}})}),[t]),S(()=>{a.onUserAction&&a.onUserAction(c,o)},[t]),S(()=>{t.isInspected&&f=="update"&&(a.onUpdateValue&&a.onUpdateValue(c,o),t.isValidated&&a.onUpdateValidValue&&a.onUpdateValidValue(c,o))},[t.isValidated,t.isInspected,t.rawValue])}},ValidationCheck:e=>{let{states:n}=e;if(e.val_status.isInspected)return;let a="ValidationTimer-"+e.val_status.componentId;u.interval.abort(a),e.set_status(r=>l(i({},r),{isInspected:!1,isValidated:!1}));let t=e.SystemValidation({value:e.val_status.rawValue,states:n});if(!t.ok){e.set_status(r=>l(i({},r),{isInspected:!0,isValidated:!!t.ok,notice:t.notice||[]}));return}let s=t.notice||[];const p=()=>b(void 0,null,function*(){if(!n.onValidate)return;let r=yield n.onValidate(e.val_status.rawValue,e.val_status.eventType,e.val_status);e.set_status(d=>l(i({},d),{isInspected:!0,isValidated:!!r.ok,notice:[...s,...r.notice||[]]}))});if(n.onValidate){if(e.val_status.eventType=="refresh"){p();return}u.interval.once(p,n.onValidateDelay||400,a);return}e.set_status(r=>l(i({},r),{eventID:m(12),isInspected:!0,isValidated:!0,notice:s}))},SubmitForm:(e,n)=>{let a=!1;if(!n)return a;let t=k(`[data-form-submit-button="${n}"]`)[0];if(!t)return a;let s=t.dataset.sdfike||"",p=e.key,r=e.ctrlKey||e.metaKey;return u.scope(()=>{s.includes("enter")&&(p!="Enter"||e.nativeEvent.isComposing||(e==null?void 0:e.keyCode)==229)||((p=="Enter"&&(s.includes("enter")||s.includes("auxEnter")&&r)||p==" "&&s.includes("space"))&&(t.click(),e.preventDefault()),a=!0)}),a},isShowValidation:(e,n)=>{let a=e.isValidated;return!n&&e.eventType=="init"?!0:a}},ne=function(e){e=i({tone:"border"},e);let n=u.scope(()=>{if(e.tone=="plain")return{};let t={padding:1,transition:"middle",flexSizing:"auto",boxShadow:"0.min"};return e.tone=="border"?t=l(i({},t),{border:!0,borderRadius:"2.tone.secondary",backgroundColor:"layer.1"}):e.tone=="cloud"?t=l(i({},t),{border:"1.thin",borderRadius:"2.tone.secondary",backgroundColor:"cloud"}):e.tone=="bottomBorder"&&(t=l(i({},t),{borderRadius:0,border:"unset",borderBottom:!0,backgroundColor:"cloud"})),t});return l(i(i(i(i(i(i({fontColor:"2.normal"},n),!!e.rightIcon&&{paddingRight:3}),!!e.leftIcon&&{paddingLeft:3}),!!e.leftIndicator&&{borderTopLeftRadius:"2/3",borderBottomLeftRadius:"2/3",marginLeft:"1/4"}),!!e.rightIndicator&&{borderTopRightRadius:"2/3",borderBottomRightRadius:"2/3",marginRight:"1/4"}),e),{freeCSS:i({letterSpacing:"1px",resize:"none"},e.freeCSS),className:[_("Input"),e.className].join(" ")})};export{ae as BoxWrapper,F as CoreEffects,ne as DefaultBoxishStyles,te as OptionalInputWrapper};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{b as d,c as
|
|
1
|
+
import{b as d,c as m,d as v}from"../chunk-C5N2D3ZX.js";import{jsx as h,jsxs as w}from"react/jsx-runtime";import{useState as R,useEffect as S}from"react";import a,{UUID as H}from"jmini";import{$$fromRoot as c,Config as A,pageRouter as T}from"../@utils";import{Box as C,Flex as x,Column as V}from"../atoms";import{Button as W}from"./Button";import{LayoutClasses as y}from"../@styles/componentClasses";const t={Base:o=>{let g=o,{topNavigation:i,sideNavigation:e,footerNavigation:r,children:l,className:s}=g,f=v(g,["topNavigation","sideNavigation","footerNavigation","children","className"]);S(()=>{t.fn.updateCSSProperty.reset(),setTimeout(()=>{t.fn.updateCSSProperty.reset()},100);let n="ResizeCB",p="RemovePageEventCB";return a(window).addEvent({eventType:"resize",eventID:n,callback:()=>{A.get().screen.isPhonepoint()||a.interval.once(()=>{t.fn.updateCSSProperty.reset()},300,"__RVC_calcHeights")}}),()=>{a(window).removeEvent(p),a(window).removeEvent(n)}},[]);let u=l;return w(V,m(d({className:[s,y("RootViewController")].join(" "),backgroundColor:"layer.1",gap:0,minHeight:"viewHeight"},f),{children:[i,w(x,{className:y("Body"),flexWrap:!1,position:"relative",flexSizing:0,children:[e,h(C,{className:y("Content"),position:"relative",flexSizing:0,width:0,children:u})]}),r]}))},TopNavigation:o=>{let s=o,{className:i,children:e}=s,r=v(s,["className","children"]),[l]=R(H());return S(()=>{t.fn.updateCSSProperty.topNav()},[]),h(x,m(d({"data-id":l,flexSizing:"none",flexType:"col",position:"sticky",top:0,backgroundColor:"layer.1"},r),{id:"__RVC_TopNavigation",className:[i,y("TopNav")].join(" "),children:e}),l)},SideNavigation:o=>{let r=o,{className:i=""}=r,e=v(r,["className"]);return S(()=>{t.fn.updateCSSProperty.sideNav()},[]),h(C,m(d({className:[i,y("SideNav")].join(" "),flexSizing:"none",minHeight:"sideNavigationHeight"},e),{id:"__RVC_SideNavigation"}))},FooterNavigation:o=>{let s=o,{className:i="",baseStyles:e}=s,r=v(s,["className","baseStyles"]),[l]=R(H());return S(()=>{t.fn.updateCSSProperty.footer()},[]),h(x,m(d({"data-id":l,borderTop:!0,position:"sticky",bottom:0,overflow:"auto",backgroundColor:"layer.1",paddingBottom:"safeAreaBottom"},e),{id:"__RVC_FooterNavigation",className:[y("FooterNav"),i].join(" "),children:h(x,d({gap:1,flexWrap:!1,padding:"2/3",margin:"auto",width:1},r))}))},Comps:{Button:o=>{let g=o,{isActive:i,path:e,pathGroup:r,currentPath:l}=g,s=v(g,["isActive","path","pathGroup","currentPath"]),f=a.flatArray(r),u=l||location.pathname;{let n=!1;a.scope(()=>{a.is.string(e)&&(a.is.nullish(e)||(n=u.replace(/^\//,"").replace(/\/$/,"")==e.replace(/^\//,"").replace(/\/$/,"")))}),a.scope(()=>{if(!n&&f.length)for(let p of f){if(n)break;a.is.nullish(p)||(a.is.string(p)&&(p=String(p).escapeRegExChar()),u.match(new RegExp(p))&&(n=!0))}}),i=i!=null?i:n}return h(W.Clear,d({isActive:i,isActiveStyles:{fontColor:"theme",backgroundColor:"cloud"},onClick:n=>{a.is.exist(e)&&a.is.string(e)&&T.push(e,n.ctrlKey||n.metaKey)},color:"cloud",padding:["3/4",1],display:"flex",gap:"1/2",fontColor:"inherit",flexSizing:"none",flexWrap:!1,ssEffectsOnActive:"ripple.cloud",verticalAlign:"center",textAlign:"left",isSemiBoldFont:!0},s))},Bar:o=>h(C,d({flexSizing:"none",backgroundColor:"layer.4.opa.middle",unitHeight:"1/3",margin:["2/3",1],isRounded:!0},o)),Title:o=>h(C,d({fontSize:"3.paragraph",isSemiBoldFont:!0,padding:[0,1]},o))},fn:{updateCSSProperty:{topNav:()=>{let o=a(document.body),i=c("#__RVC_TopNavigation"),e=i.position().height||0,r=e;i.getStyleProperty("position")!="sticky"&&(r=0),t.fn.topNavHeight=e,t.fn.topBase=r,o.setStyleProperty("--topNavHeight",e+"px").setStyleProperty("--topBase",r+"px")},footer:()=>{let o=a(document.body),e=c("#__RVC_FooterNavigation").position().height||0;t.fn.footerNavHeight=e,o.setStyleProperty("--footerNavHeight",e+"px")},sideNav:()=>{let o=a(document.body),e=c("#__RVC_SideNavigation").position().width||0;t.fn.sideNavHeight=e,o.setStyleProperty("--sideNavWidth",e+"px")},reset:()=>{let o=a(document.body),i=c("#__RVC_TopNavigation"),e=c("#__RVC_FooterNavigation"),r=c("#__RVC_SideNavigation"),l=i.position().height||0,s=l,f=e.position().height||0,u=r.position().width||0;i.getStyleProperty("position")!="sticky"&&(s=0);let g=window.innerHeight,n=window.innerWidth,p=g-l-f,B=n-u;t.fn.viewHeight=g,t.fn.viewWidth=n,t.fn.contentHeight=p,t.fn.contentWidth=B,t.fn.topBase=s,t.fn.sideNavHeight=u,t.fn.topNavHeight=l,t.fn.footerNavHeight=f;{let N=getComputedStyle(document.documentElement),P=N.getPropertyValue("--safe-area-top"),_=N.getPropertyValue("--safe-area-bottom"),b=N.getPropertyValue("--safe-area-left"),F=N.getPropertyValue("--safe-area-right");t.fn.safeAreaTop=parseInt(P,10)||0,t.fn.safeAreaBottom=parseInt(_,10)||0,t.fn.safeAreaLeft=parseInt(b,10)||0,t.fn.safeAreaRight=parseInt(F,10)||0}o.setStyleProperty("--viewHeight",g+"px").setStyleProperty("--viewWidth",n+"px").setStyleProperty("--contentHeight",p+"px").setStyleProperty("--contentWidth",B+"px").setStyleProperty("--topBase",s+"px").setStyleProperty("--topNavHeight",l+"px").setStyleProperty("--footerNavHeight",f+"px").setStyleProperty("--sideNavHeight",p+"px")}},viewHeight:0,viewWidth:0,contentHeight:0,contentWidth:0,topBase:0,sideNavHeight:0,topNavHeight:0,footerNavHeight:0,safeAreaTop:0,safeAreaBottom:0,safeAreaLeft:0,safeAreaRight:0}};export{t as RootViewController,t as default};
|
package/dist/fn/Sheet.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{b as h,c as D,d as X}from"../chunk-C5N2D3ZX.js";import{Fragment as pe,jsx as c,jsxs as V}from"react/jsx-runtime";import u,{UUID as J,Time as ce,useStore as w}from"jmini";import{useState as M,useEffect as j,useRef as ue}from"react";import{$$fromRoot as U,Config as G}from"../@utils";import{Box as A,Flex as he,Img as fe,FAI as ae,Column as re,Grid as de,CacheRender as me}from"../atoms";import{Row as ne}from"../mols";import{Button as le}from"./Button";import{SheetClasses as g}from"../@styles/componentClasses";import ge from"./Plate";const v={currentIndex:0,openQueue:{},getSessionStates:()=>{let t=w.get("sessionStates-"+G.get().sessionUID);return t||null},getnew_sheetstates:t=>{var a;let e=D(h({sheetGroups:t.sheetGroups||[],backgroundEffect:!0,overwrap:t.type=="custom",hold_state:!1,closeAtPageTransit:!0,closeAtEscapeKeyDown:!0,closeAtAroundClick:t.type=="custom"},t),{sheetID:t.sheetID||J(),isOpen:!0,created_at:ce()});return e.type=="custom"&&(e.parent=e.parent||((a=e.event)==null?void 0:a.currentTarget)),e},Wrapper:()=>{let[t,e]=M([]),a={val_sheets:t,set_sheets:e},f="sessionStates-"+G.get().sessionUID;return w.set({[f]:a}),j(()=>{let d="Sheet-"+G.get().sessionUID;w.set({[d]:{add:(n,r)=>{let i=w.get(d);if(!i)return;let s=v.getnew_sheetstates(n);if(v.openQueue[s.sheetID])return;if(v.openQueue[s.sheetID]=!0,r!="inherit"&&(s.isOpen=r!=null?r:!0),!!i.find(s.sheetID)){e(y=>{let E=[...y],T=E.findIndex(L=>L.sheetID==s.sheetID);return T==-1||(E[T]=s),E}),delete v.openQueue[s.sheetID];return}e(y=>[s,...y])},find:n=>{let r=v.getSessionStates();if(!r)return null;let{val_sheets:i}=r;return i.find(s=>s.sheetID==n)}}}),u(G.get().appRoot).removeEvent(["SheetEvent.keyUp","SheetEvent.Click"]).addEvent({eventType:"keyup",eventID:"SheetEvent.keyUp",callback:function(n){let{key:r,metaKey:i}=n;if(r=="Escape"||r==","&&i){let s=v.getSessionStates();if(!s)return;let{val_sheets:C}=s,y=C.filter(T=>T.isOpen);if(!y.length)return;let E=y.reduce((T,L)=>T.created_at.value>L.created_at.value?T:L);x.close(E.sheetID,r)}}}).addEvent({eventType:"click",eventID:"SheetEvent.Click",callback:function(n){let r=v.getSessionStates();if(!r)return;let{val_sheets:i}=r,s=n.target;if(!s||s!=null&&s.closest("."+g("CustomSheet")))return;let C=i.filter(y=>y.type=="custom");C.length&&C.forEach(y=>{let{parent:E}=y;if(!y.closeAtAroundClick)return;let T=U(E)[0];E!==s&&T!==s&&(u(T).find(s).length||x.close(y.sheetID))})}})},[]),c(pe,{children:t.map(d=>c(me,{params:d,forceRender:(n,r)=>n.isOpen!=r.isOpen||n.size!=r.size||!u.is.equal(u.SortifyObject(n.props||""),u.SortifyObject(r.props||"")),children:c(v.Core,D(h({},a),{val_sheet:d,patch_sheet:n=>{e(r=>{let i=[...r],s=i.findIndex(C=>C.sheetID==d.sheetID);return s!=-1&&(i[s]=h(h({},i[s]),n)),i})},delete_sheet:()=>{e(n=>[...n.filter(r=>r.sheetID!=d.sheetID)])}}))},d.sheetID))})},sheetCategory:t=>t=="custom"?"custom":t.startsWith("drawer")?"drawer":"normal",sheetPosition:t=>t=="drawer.left"?"left":t=="drawer.right"?"right":t=="drawer.bottom"?"bottom":"",Core:t=>{let{val_sheet:e,patch_sheet:a}=t,[f,d]=M(v.currentIndex+2),[n]=M(J()),r=e.type!="custom"&&!e.overwrap;j(()=>{v.currentIndex++,u.scope(()=>{if(!e.closeAtParentBlur)return;let s=u(e.parent);s[0]&&s.addEvent({eventID:"SheetClosation-"+e.sheetID,eventType:"mouseout",callback:()=>{s.removeEvent("SheetClosation-"+e.sheetID),a({isOpen:!1})}})}),w.set({[e.sheetID]:{modifyProps:s=>{setTimeout(()=>{a({props:s})},10)},resize:s=>{if(e.type=="drawer.bottom"){let C=w.get(n);C&&C.resize&&C.resize(s);return}a({size:s})},close:s=>{a({isOpen:!1})},open:()=>{a({isOpen:!0})}}})},[]),j(()=>{u.scope(()=>{let s=U("#"+n);if(e.isOpen){e.hold_state&&d(v.currentIndex+1),s.await(10).removeClass(g("Hide")).await(10).addClass(g("Open")).callback(()=>{delete v.openQueue[e.sheetID],e.onOpen&&e.onOpen()});return}s.await(10).removeClass(g("Open")).await(251).addClass(g("Hide")).callback(()=>{if(e.onClose&&e.onClose(),r&&G.get().browserIs!="safari"&&u(G.get().appRoot).focus(),e.hold_state)return a({isOpen:!1});t.delete_sheet()})})},[e.isOpen]);let i=v.Types[{topLeft:"Normal",topCenter:"Normal",topRight:"Normal",middleLeft:"Normal",middleCenter:"Normal",middleRight:"Normal",bottomLeft:"Normal",bottomCenter:"Normal",bottomRight:"Normal","drawer.left":"Edge","drawer.right":"Edge","drawer.bottom":"Bottom",custom:"Custom"}[e.type]];return c(A,{className:["AMOTIFY_be",g("Wrap"),g("Tcate_"+v.sheetCategory(e.type)),g("Tpos_"+v.sheetPosition(e.type)),g("isMainSheet_"+r),e.wrapperClassName||""].join(" "),width:1,ssAbsoluteCovered:!0,position:"fixed",freeCSS:{zIndex:f},id:n,children:V(re,{className:g("Content"),gap:0,height:"viewHeight",overflow:"auto",transition:"middle",children:[!!r&&c(A,{className:g("TapSensor"),position:"sticky",top:0,height:0,width:1,flexSizing:"none",children:c(A,{backgroundColor:"trans",height:"viewHeight",position:"absolute",top:0,width:1,className:g("TapContent"),onClick:s=>{var y;((y=e.closeAtAroundClick)==null||y)&&x.close(e.sheetID)}})}),c(i,h({componentId:n},e))]})},n)},Types:{Normal:t=>{let k=t,{sheetID:e,sheetGroups:a,bodyScrolls:f,props:d,content:n,className:r="",type:i,size:s="R",freeCSS:C,onOpen:y,onClose:E,closeAtAroundClick:T,closeAtEscapeKeyDown:L,closeAtPageTransit:q,closeAtParentBlur:ee,closeAtSwipeDown:Y,hold_state:te,overwrap:oe,isOpen:se,backgroundEffect:H,wrapperClassName:F}=k,K=X(k,["sheetID","sheetGroups","bodyScrolls","props","content","className","type","size","freeCSS","onOpen","onClose","closeAtAroundClick","closeAtEscapeKeyDown","closeAtPageTransit","closeAtParentBlur","closeAtSwipeDown","hold_state","overwrap","isOpen","backgroundEffect","wrapperClassName"]),_=u.is.function(n)?c(n,h({},d)):n,R={},b=[];return i.match(/top/)?(b.push("top"),R.marginBottom="auto"):i.match(/middle/)?(b.push("center"),R.marginTop="auto",R.marginBottom="auto"):i.match(/bottom/)&&(b.push("bottom"),R.marginTop="auto"),i.match(/left/i)?(b.push("left"),R.marginRight="auto"):i.match(/center/i)?(b.push("center"),R.marginLeft="auto",R.marginRight="auto"):i.match(/right/i)&&(b.push("right"),R.marginLeft="auto"),c(A,D(h(h({className:[g("BB"),r].join(" "),padding:1,transition:"short",opacity:"trans"},K),R),{freeCSS:h({width:{XS:"22rem",S:"26rem",R:"36rem",L:"44rem","2L":"60rem","3L":"72rem",MAX:"100%"}[s],maxWidth:"96vw",transformOrigin:b.join(" ")},C),children:_}))},Edge:t=>{let _=t,{sheetID:e,sheetGroups:a,bodyScrolls:f,type:d,props:n,content:r,className:i="",size:s="R",onOpen:C,onClose:y,closeAtAroundClick:E,closeAtEscapeKeyDown:T,closeAtPageTransit:L,closeAtParentBlur:q,closeAtSwipeDown:ee,hold_state:Y,overwrap:te,isOpen:oe,backgroundEffect:se,wrapperClassName:H}=_,F=X(_,["sheetID","sheetGroups","bodyScrolls","type","props","content","className","size","onOpen","onClose","closeAtAroundClick","closeAtEscapeKeyDown","closeAtPageTransit","closeAtParentBlur","closeAtSwipeDown","hold_state","overwrap","isOpen","backgroundEffect","wrapperClassName"]),K=u.is.function(r)?c(r,h({},n)):r;return c(A,D(h(D(h({className:[g("BB"),i].join(" ")},d=="drawer.right"?{marginLeft:"auto"}:d=="drawer.left"?{marginRight:"auto"}:{}),{opacity:"trans",transition:"short",position:"relative",backgroundColor:"layer.1",flexSizing:"none",minHeight:"viewHeight",boxShadow:"3.remark"}),F),{freeCSS:h({width:{XS:"16rem",S:"20rem",R:"27rem",L:"32rem","2L":"40rem","3L":"58rem",MAX:"100vw"}[s],maxWidth:"96vw"},F.freeCSS),children:K}))},Bottom:t=>{let Q=t,{componentId:e,sheetID:a,sheetGroups:f,bodyScrolls:d,props:n,content:r,size:i="R",sizeChanged:s,baseStyles:C,onOpen:y,onClose:E,closeAtAroundClick:T,closeAtEscapeKeyDown:L,closeAtPageTransit:q,closeAtParentBlur:ee,closeAtSwipeDown:Y=!0,hold_state:te,overwrap:oe,isOpen:se,backgroundEffect:H,wrapperClassName:F}=Q,K=X(Q,["componentId","sheetID","sheetGroups","bodyScrolls","props","content","size","sizeChanged","baseStyles","onOpen","onClose","closeAtAroundClick","closeAtEscapeKeyDown","closeAtPageTransit","closeAtParentBlur","closeAtSwipeDown","hold_state","overwrap","isOpen","backgroundEffect","wrapperClassName"]),_=u.is.function(r)?c(r,h({},n)):r,R=u.getScreenSize(),b=[0,.2,.6,.95],k={ZERO:0,XS:1,S:1,R:2,L:3,"2L":3,"3L":3,MAX:3},[W,$]=M(i),[I,P]=M({process:!1,processStart:0,originY:0,originValue:0,viewHeight:0,value:b[k[i]]});w.update({[e]:{val_edit:I,resize:S=>{let m=b[k[S]];P(p=>D(h({},p),{value:m})),$(S)}}});const B={Start:S=>{u(document).addEvent({eventID:"BottomSheetMouseMove",eventType:"mousemove",callback:B.Move,options:{passive:!1}}).addEvent({eventID:"BottomSheetTouchMove",eventType:"touchmove",callback:B.Move,options:{passive:!1}}).addEvent({eventID:"BottomSheetMouseUp",eventType:"mouseup",callback:B.End}).addEvent({eventID:"BottomSheetTouchEnd",eventType:"touchend",callback:B.End});let m=u.getCursor(S),p=D(h({},I),{process:!0,processStart:new Date().getTime(),originY:m.y,originValue:I.value,viewHeight:u.getScreenSize().height});w.update({[e]:{val_edit:p}}),P(p)},Move:S=>{var O;let m=(O=w.get(e))==null?void 0:O.val_edit;if(!m.process)return;let z=(u.getCursor(S).y-m.originY)/m.viewHeight,o=m.originValue-z;if(o>.95)o=.95+(o-.95)*.5;else if(o<.2){let N=.2-o;N-=.1,o=.1+(.1-N)*.5}return P(D(h({},m),{value:o})),S.preventDefault(),S.stopPropagation(),!1},End:S=>{var o;let m=(o=w.get(e))==null?void 0:o.val_edit;if(!m.process)return;u(document).removeEvent(["BottomSheetMouseMove","BottomSheetTouchMove","BottomSheetMouseUp","BottomSheetTouchEnd"]);let p=0;if(m.value<.1||(m.value<.5?p=1:m.value>.75?p=3:p=2),new Date().getTime()-m.processStart<300){let O=u.getCursor(S).y-m.originY;if(Math.abs(O)>=20){let N=+(O<0)*2-1;p+=N,p=Math.min(Math.max(p,0),b.length-1)}}p==0&&(Y||(p=1)),$(["ZERO","S","R","L"][p]),P(D(h({},m),{value:b[p],process:!1}))}},Z=ue(!1);return j(()=>{Z.current?W=="ZERO"?Y&&x.close(a):setTimeout(()=>{t.sizeChanged&&t.sizeChanged(W)},250):Z.current=!0},[W]),c(A,{className:g("BB"),margin:[0,"auto"],marginTop:"auto",opacity:"trans",width:1,transition:"long",freeCSS:h({maxWidth:12*60,height:R.height*I.value},I.process?{transition:"0s"}:{}),children:V(re,D(h({gap:0,flexSizing:"none",borderTopLeftRadius:"1.tone.primary",borderTopRightRadius:"1.tone.primary",borderBottom:"unset",boxShadow:"3.remark",position:"relative",overflow:"hidden",height:1},C),{children:[V(ne.Separate,{padding:1,backgroundColor:"layer.1",position:"relative",freeCSS:{userSelect:"none"},children:[c(A,{ssSphere:2.5}),c(ne.Center,{onPointerDown:B.Start,flexSizing:0,padding:"2/3",ssPushable:!0,isRounded:!0,freeCSS:{cursor:"grab",userSelect:"none"},children:c(A,{unitWidth:6,unitHeight:"1/2",backgroundColor:"layer.4",isRounded:!0,className:g("DragBar")})}),c(le.Sub,{color:"cloud",ssSphere:2.5,onClick:()=>{x.close(a)},children:c(ae.X,{})})]}),c(A,D(h({backgroundColor:"layer.1",flexSizing:0,overflow:"auto"},K),{children:_}))]}))})},Custom:t=>{let Q=t,{sheetID:e,sheetGroups:a,bodyScrolls:f,event:d,parent:n,nextToCursor:r,gravityPoint:i=22,props:s,content:C,closeAtAroundClick:y,closeAtEscapeKeyDown:E,closeAtPageTransit:T,closeAtParentBlur:L,closeAtSwipeDown:q,hold_state:ee,onOpen:Y,onClose:te,overwrap:oe,isOpen:se,resize:H,backgroundEffect:F,wrapperClassName:K}=Q,_=X(Q,["sheetID","sheetGroups","bodyScrolls","event","parent","nextToCursor","gravityPoint","props","content","closeAtAroundClick","closeAtEscapeKeyDown","closeAtPageTransit","closeAtParentBlur","closeAtSwipeDown","hold_state","onOpen","onClose","overwrap","isOpen","resize","backgroundEffect","wrapperClassName"]),R=u.is.function(C)?c(C,h({},s)):C,[b]=M(J()),k=u.is.element(n)||u.is.jmini(n)?u(n):U(n),W='[data-sheet-id="'+b+'"]',$='[data-sheet-content="'+b+'"]';i=i;let I=i%5||5,P=Math.ceil(i/5);const B={Init:()=>{if(r&&d){let l=u.getScreenSize(),ie=u.getCursor(d);return{top:ie.y-l.pageYOffset,left:ie.x-l.pageXOffset}}let S={};if(!k||!k[0])return S;let{top:m,right:p,bottom:z,left:o,height:O,width:N}=k.position();return[1,2].includes(I)?S.left=o:I==3?S.left=o+N/2:[4,5].includes(I)&&(S.left=p),i<=10?S.top=m:i<=15?S.top=m+O/2:i<=25&&(S.top=z),S},Adjust:()=>{let S=U(W).position(),m=U($).position(),p=k.position(),z=u.getScreenSize(),o={};for(let l in m)o[l]=m[l];if(u.scope(()=>{if(t.nextToCursor)return;let l=0;P==1?l=p.top-o.bottom:P==2?l=p.top-o.top:P==3?l=p.top-o.top+(p.height-o.height)/2:P==4?l=p.bottom-o.bottom:P==5&&(l=p.bottom-o.top),o.top+=l,o.bottom+=l}),u.scope(()=>{if(t.nextToCursor)return;let l=0;I==1?l=p.left-o.right:I==2?l=p.left-o.left:I==3?l=p.left-o.left+(p.width-o.width)/2:I==4?l=p.right-o.right:I==5&&(l=p.right-o.left),o.left+=l,o.right+=l}),o.top<0){let l=-o.top;o.top+=l,o.bottom+=l}if(o.bottom>z.height){let l=o.bottom-z.height;o.top-=l,o.bottom-=l}if(o.left<0){let l=-o.left;o.left+=l,o.right+=l}if(o.right>z.width){let l=o.right-z.width;o.left-=l,o.right-=l}let O=o.top-m.top,N=o.left-m.left;u(W).css({top:S.top+O+"px",left:S.left+N+"px"})}};let[Z]=M(B.Init());return j(()=>{U(W).await(10).addClass(g("Open")).await(200).callback(()=>{(H==null||H)&&B.Adjust()}),w.update({["customSheet-"+t.sheetID]:{reposition:()=>{B.Adjust()}}})},[]),k[0]?c(A,{className:[g("BB"),g("CustomSheet")].join(" "),"data-sheet-id":b,transition:"long",position:"absolute",width:0,height:0,opacity:"trans",flexCenter:!0,freeCSS:Z,children:c(he,{position:"absolute",className:[g("GPT"),g("GPT_"+i),g("Col_"+I),g("Row_"+P)].join(" "),children:c(A,D(h({"data-sheet-content":b,flexSizing:"none",maxHeight:"viewHeight"},_),{freeCSS:h({maxWidth:"98vw"},_.freeCSS),children:R}))})}):null}}},x={Wrapper:()=>c(v.Wrapper,{}),Element:t=>{let d=t,{isOpen:e,children:a}=d,f=X(d,["isOpen","children"]);return j(()=>{if(e){x.open(t.type,D(h({},f),{content:a}));return}f.sheetID&&x.close(f.sheetID)},[e,f.props||""]),c(pe,{})},image:(t,e)=>{let a=t.sheetID||J(),n=t,{type:f}=n,d=X(n,["type"]);x.open(f||"topCenter",D(h({size:"MAX"},d),{sheetID:a,freeCSS:{maxWidth:"100vw"},content:()=>{let[r]=M(u.flatArray(e));return c(ge,{children:V(re,{children:[c(ne.Right,{children:V(le.Sub.S,{color:"cloud",isRounded:!0,onClick:()=>{x.close(a)},children:[c(ae.X,{})," \u9589\u3058\u308B"]})}),c(de.Layout,{gap:1,gridTemplateColumns:"repeat(3,1fr)",gridTemplateRows:"repeat(2,auto)",gridChildTemplates:[["span 3",0],["span 2","span 2"],[0,0],[0,0],[0,"span 2"],["span 2",0],[0,0],[0,0]],children:r.map((i,s)=>c(fe,{ssCardBox:!0,position:"relative",flexCenter:!0,src:i},s))})]})})}}))},open:(t,e,a)=>{e.sheetID=(e.sheetID||"").replace(/\./g,"-"),e.type=t;let f=w.get("Sheet-"+G.get().sessionUID);f&&f.add(e,a)},modifyProps:(t,e)=>{t=(t||"").replace(/\./g,"-");let a=w.get(t);a&&a.modifyProps&&a.modifyProps(e)},resize:(t,e)=>{t=(t||"").replace(/\./g,"-");let a=w.get(t);a&&a.resize&&a.resize(e)},customSheet:{reposition:t=>{let e=w.get("customSheet-"+t);e&&e.reposition&&e.reposition()}},close:function(t,e,a){let f=v.getSessionStates();if(!f)return;let{val_sheets:d}=f;t=t==null?void 0:t.replace(/\./g,"-");let n=d.find(i=>i.sheetID==t);if(!n||e=="Escape"&&!n.closeAtEscapeKeyDown)return;let r=w.get(n.sheetID);r&&r.close&&r.close(a)},closeGroup:t=>{let e=v.getSessionStates();if(!e)return;let{val_sheets:a}=e;t=(t||"").replace(/\./g,"-");for(let f of a)f.sheetGroups&&f.sheetGroups==t&&x.close(f.sheetID)},closeAll:t=>{let e=v.getSessionStates();if(!e)return;let{val_sheets:a}=e;for(let f of a)t&&!f.closeAtPageTransit||x.close(f.sheetID,"pageTransit",!0)},Body:t=>c(A,h({className:g("BaseBody"),backgroundColor:"layer.1",borderRadius:"1.tone.primary",position:"relative",boxShadow:"3.remark",transition:"long"},t))};export{x as Sheet,x as default};
|
|
1
|
+
import{b as h,c as D,d as X}from"../chunk-C5N2D3ZX.js";import{Fragment as pe,jsx as u,jsxs as V}from"react/jsx-runtime";import p,{UUID as J,Time as ce,useStore as w}from"jmini";import{useState as M,useEffect as j,useRef as ue}from"react";import{$$fromRoot as U,Config as G}from"../@utils";import{Box as A,Flex as he,Img as fe,FAI as ae,Column as re,Grid as de,CacheRender as me}from"../atoms";import{Row as ne}from"../mols";import{Button as le}from"./Button";import{SheetClasses as g}from"../@styles/componentClasses";import ge from"./Plate";const v={currentIndex:0,openQueue:{},getSessionStates:()=>{let t=w.get("sessionStates-"+G.get().sessionUID);return t||null},getnew_sheetstates:t=>{var a;let e=D(h({sheetGroups:t.sheetGroups||[],backgroundEffect:!0,overwrap:t.type=="custom",hold_state:!1,closeAtPageTransit:!0,closeAtEscapeKeyDown:!0,closeAtAroundClick:t.type=="custom"},t),{sheetID:t.sheetID||J(),isOpen:!0,created_at:ce()});return e.type=="custom"&&(e.parent=e.parent||((a=e.event)==null?void 0:a.currentTarget)),e},Wrapper:()=>{let[t,e]=M([]),a={val_sheets:t,set_sheets:e},f="sessionStates-"+G.get().sessionUID;return w.set({[f]:a}),j(()=>{let d="Sheet-"+G.get().sessionUID;w.set({[d]:{add:(n,r)=>{let i=w.get(d);if(!i)return;let s=v.getnew_sheetstates(n);if(v.openQueue[s.sheetID])return;if(v.openQueue[s.sheetID]=!0,r!="inherit"&&(s.isOpen=r!=null?r:!0),!!i.find(s.sheetID)){e(y=>{let E=[...y],T=E.findIndex(L=>L.sheetID==s.sheetID);return T==-1||(E[T]=s),E}),delete v.openQueue[s.sheetID];return}e(y=>[s,...y])},find:n=>{let r=v.getSessionStates();if(!r)return null;let{val_sheets:i}=r;return i.find(s=>s.sheetID==n)}}}),p(G.get().appRoot).removeEvent(["SheetEvent.keyUp","SheetEvent.Click"]).addEvent({eventType:"keyup",eventID:"SheetEvent.keyUp",callback:function(n){let{key:r,metaKey:i}=n;if(r=="Escape"||r==","&&i){let s=v.getSessionStates();if(!s)return;let{val_sheets:C}=s,y=C.filter(T=>T.isOpen);if(!y.length)return;let E=y.reduce((T,L)=>T.created_at.value>L.created_at.value?T:L);x.close(E.sheetID,r)}}}).addEvent({eventType:"click",eventID:"SheetEvent.Click",callback:function(n){let r=v.getSessionStates();if(!r)return;let{val_sheets:i}=r,s=n.target;if(!s||s!=null&&s.closest("."+g("CustomSheet")))return;let C=i.filter(y=>y.type=="custom");C.length&&C.forEach(y=>{let{parent:E}=y;if(!y.closeAtAroundClick)return;let T=U(E)[0];E!==s&&T!==s&&(p(T).find(s).length||x.close(y.sheetID))})}})},[]),u(pe,{children:t.map(d=>u(me,{params:d,forceRender:(n,r)=>n.isOpen!=r.isOpen||n.size!=r.size||!p.is.equal(p.SortifyObject(n.props||""),p.SortifyObject(r.props||"")),children:u(v.Core,D(h({},a),{val_sheet:d,patch_sheet:n=>{e(r=>{let i=[...r],s=i.findIndex(C=>C.sheetID==d.sheetID);return s!=-1&&(i[s]=h(h({},i[s]),n)),i})},delete_sheet:()=>{e(n=>[...n.filter(r=>r.sheetID!=d.sheetID)])}}))},d.sheetID))})},sheetCategory:t=>t=="custom"?"custom":t.startsWith("drawer")?"drawer":"normal",sheetPosition:t=>t=="drawer.left"?"left":t=="drawer.right"?"right":t=="drawer.bottom"?"bottom":"",Core:t=>{let{val_sheet:e,patch_sheet:a}=t,[f,d]=M(v.currentIndex+2),[n]=M(J()),r=e.type!="custom"&&!e.overwrap;j(()=>{v.currentIndex++,p.scope(()=>{if(!e.closeAtParentBlur)return;let s=p(e.parent);s[0]&&s.addEvent({eventID:"SheetClosation-"+e.sheetID,eventType:"mouseout",callback:()=>{s.removeEvent("SheetClosation-"+e.sheetID),a({isOpen:!1})}})}),w.set({[e.sheetID]:{modifyProps:s=>{setTimeout(()=>{a({props:s})},10)},resize:s=>{if(e.type=="drawer.bottom"){let C=w.get(n);C&&C.resize&&C.resize(s);return}a({size:s})},close:s=>{a({isOpen:!1})},open:()=>{a({isOpen:!0})}}})},[]),j(()=>{p.scope(()=>{let s=U("#"+n);if(e.isOpen){e.hold_state&&d(v.currentIndex+1),s.await(10).removeClass(g("Hide")).await(10).addClass(g("Open")).callback(()=>{delete v.openQueue[e.sheetID],e.onOpen&&e.onOpen()});return}s.await(10).removeClass(g("Open")).await(251).addClass(g("Hide")).callback(()=>{if(e.onClose&&e.onClose(),r&&G.get().browserIs!="safari"&&p(G.get().appRoot).focus(),e.hold_state)return a({isOpen:!1});t.delete_sheet()})})},[e.isOpen]);let i=v.Types[{topLeft:"Normal",topCenter:"Normal",topRight:"Normal",middleLeft:"Normal",middleCenter:"Normal",middleRight:"Normal",bottomLeft:"Normal",bottomCenter:"Normal",bottomRight:"Normal","drawer.left":"Edge","drawer.right":"Edge","drawer.bottom":"Bottom",custom:"Custom"}[e.type]];return u(A,{className:["AMOTIFY_be",g("Wrap"),g("Tcate_"+v.sheetCategory(e.type)),g("Tpos_"+v.sheetPosition(e.type)),g("isMainSheet_"+r),e.wrapperClassName||""].join(" "),width:1,ssAbsoluteCovered:!0,position:"fixed",freeCSS:{zIndex:f},id:n,children:V(re,{className:g("Content"),gap:0,height:"viewHeight",overflow:"auto",transition:"middle",children:[!!r&&u(A,{className:g("TapSensor"),position:"sticky",top:0,height:0,width:1,flexSizing:"none",children:u(A,{backgroundColor:"trans",height:"viewHeight",position:"absolute",top:0,width:1,className:g("TapContent"),onClick:s=>{var y;((y=e.closeAtAroundClick)==null||y)&&x.close(e.sheetID)}})}),u(i,h({componentId:n},e))]})},n)},Types:{Normal:t=>{let k=t,{sheetID:e,sheetGroups:a,bodyScrolls:f,props:d,content:n,className:r="",type:i,size:s="R",freeCSS:C,onOpen:y,onClose:E,closeAtAroundClick:T,closeAtEscapeKeyDown:L,closeAtPageTransit:q,closeAtParentBlur:ee,closeAtSwipeDown:Y,hold_state:te,overwrap:oe,isOpen:se,backgroundEffect:H,wrapperClassName:F}=k,K=X(k,["sheetID","sheetGroups","bodyScrolls","props","content","className","type","size","freeCSS","onOpen","onClose","closeAtAroundClick","closeAtEscapeKeyDown","closeAtPageTransit","closeAtParentBlur","closeAtSwipeDown","hold_state","overwrap","isOpen","backgroundEffect","wrapperClassName"]),_=p.is.function(n)?u(n,h({},d)):n,R={},b=[];return i.match(/top/)?(b.push("top"),R.marginBottom="auto"):i.match(/middle/)?(b.push("center"),R.marginTop="auto",R.marginBottom="auto"):i.match(/bottom/)&&(b.push("bottom"),R.marginTop="auto"),i.match(/left/i)?(b.push("left"),R.marginRight="auto"):i.match(/center/i)?(b.push("center"),R.marginLeft="auto",R.marginRight="auto"):i.match(/right/i)&&(b.push("right"),R.marginLeft="auto"),u(A,D(h(h({className:[g("BB"),r].join(" "),padding:1,transition:"short",opacity:"trans"},K),R),{freeCSS:h({width:{XS:"22rem",S:"26rem",R:"36rem",L:"44rem","2L":"60rem","3L":"72rem",MAX:"100%"}[s],maxWidth:"96vw",transformOrigin:b.join(" ")},C),children:_}))},Edge:t=>{let _=t,{sheetID:e,sheetGroups:a,bodyScrolls:f,type:d,props:n,content:r,className:i="",size:s="R",onOpen:C,onClose:y,closeAtAroundClick:E,closeAtEscapeKeyDown:T,closeAtPageTransit:L,closeAtParentBlur:q,closeAtSwipeDown:ee,hold_state:Y,overwrap:te,isOpen:oe,backgroundEffect:se,wrapperClassName:H}=_,F=X(_,["sheetID","sheetGroups","bodyScrolls","type","props","content","className","size","onOpen","onClose","closeAtAroundClick","closeAtEscapeKeyDown","closeAtPageTransit","closeAtParentBlur","closeAtSwipeDown","hold_state","overwrap","isOpen","backgroundEffect","wrapperClassName"]),K=p.is.function(r)?u(r,h({},n)):r;return u(A,D(h(D(h({className:[g("BB"),i].join(" ")},d=="drawer.right"?{marginLeft:"auto"}:d=="drawer.left"?{marginRight:"auto"}:{}),{opacity:"trans",transition:"short",position:"relative",backgroundColor:"layer.1",flexSizing:"none",minHeight:"viewHeight",boxShadow:"3.remark"}),F),{freeCSS:h({width:{XS:"16rem",S:"20rem",R:"27rem",L:"32rem","2L":"40rem","3L":"58rem",MAX:"100vw"}[s],maxWidth:"96vw"},F.freeCSS),children:K}))},Bottom:t=>{let Q=t,{componentId:e,sheetID:a,sheetGroups:f,bodyScrolls:d,props:n,content:r,size:i="R",sizeChanged:s,baseStyles:C,onOpen:y,onClose:E,closeAtAroundClick:T,closeAtEscapeKeyDown:L,closeAtPageTransit:q,closeAtParentBlur:ee,closeAtSwipeDown:Y=!0,hold_state:te,overwrap:oe,isOpen:se,backgroundEffect:H,wrapperClassName:F}=Q,K=X(Q,["componentId","sheetID","sheetGroups","bodyScrolls","props","content","size","sizeChanged","baseStyles","onOpen","onClose","closeAtAroundClick","closeAtEscapeKeyDown","closeAtPageTransit","closeAtParentBlur","closeAtSwipeDown","hold_state","overwrap","isOpen","backgroundEffect","wrapperClassName"]),_=p.is.function(r)?u(r,h({},n)):r,R=p.getScreenSize(),b=[0,.2,.6,.95],k={ZERO:0,XS:1,S:1,R:2,L:3,"2L":3,"3L":3,MAX:3},[W,$]=M(i),[I,P]=M({process:!1,processStart:0,originY:0,originValue:0,viewHeight:0,value:b[k[i]]});w.update({[e]:{val_edit:I,resize:S=>{let m=b[k[S]];P(c=>D(h({},c),{value:m})),$(S)}}});const B={Start:S=>{p(document).addEvent({eventID:"BottomSheetMouseMove",eventType:"mousemove",callback:B.Move,options:{passive:!1}}).addEvent({eventID:"BottomSheetTouchMove",eventType:"touchmove",callback:B.Move,options:{passive:!1}}).addEvent({eventID:"BottomSheetMouseUp",eventType:"mouseup",callback:B.End}).addEvent({eventID:"BottomSheetTouchEnd",eventType:"touchend",callback:B.End});let m=p.getCursor(S),c=D(h({},I),{process:!0,processStart:new Date().getTime(),originY:m.y,originValue:I.value,viewHeight:p.getScreenSize().height});w.update({[e]:{val_edit:c}}),P(c)},Move:S=>{var O;let m=(O=w.get(e))==null?void 0:O.val_edit;if(!m.process)return;let z=(p.getCursor(S).y-m.originY)/m.viewHeight,o=m.originValue-z;if(o>.95)o=.95+(o-.95)*.5;else if(o<.2){let N=.2-o;N-=.1,o=.1+(.1-N)*.5}return P(D(h({},m),{value:o})),S.preventDefault(),S.stopPropagation(),!1},End:S=>{var o;let m=(o=w.get(e))==null?void 0:o.val_edit;if(!m.process)return;p(document).removeEvent(["BottomSheetMouseMove","BottomSheetTouchMove","BottomSheetMouseUp","BottomSheetTouchEnd"]);let c=0;if(m.value<.1||(m.value<.5?c=1:m.value>.75?c=3:c=2),new Date().getTime()-m.processStart<300){let O=p.getCursor(S).y-m.originY;if(Math.abs(O)>=20){let N=+(O<0)*2-1;c+=N,c=Math.min(Math.max(c,0),b.length-1)}}c==0&&(Y||(c=1)),$(["ZERO","S","R","L"][c]),P(D(h({},m),{value:b[c],process:!1}))}},Z=ue(!1);return j(()=>{Z.current?W=="ZERO"?Y&&x.close(a):setTimeout(()=>{t.sizeChanged&&t.sizeChanged(W)},250):Z.current=!0},[W]),u(A,{className:g("BB"),margin:[0,"auto"],marginTop:"auto",opacity:"trans",width:1,transition:"long",freeCSS:h({maxWidth:12*60,height:R.height*I.value},I.process?{transition:"0s"}:{}),children:V(re,D(h({gap:0,flexSizing:"none",borderTopLeftRadius:"1.tone.primary",borderTopRightRadius:"1.tone.primary",borderBottom:"unset",boxShadow:"3.remark",position:"relative",overflow:"hidden",height:1},C),{children:[V(ne.Separate,{padding:1,backgroundColor:"layer.1",position:"relative",freeCSS:{userSelect:"none"},children:[u(A,{ssSphere:2.5}),u(ne.Center,{onPointerDown:B.Start,flexSizing:0,padding:"2/3",ssPushable:!0,isRounded:!0,freeCSS:{cursor:"grab",userSelect:"none"},children:u(A,{unitWidth:6,unitHeight:"1/2",backgroundColor:"layer.4",isRounded:!0,className:g("DragBar")})}),u(le.Sub,{color:"cloud",ssSphere:2.5,onClick:()=>{x.close(a)},children:u(ae.X,{})})]}),u(A,D(h({backgroundColor:"layer.1",flexSizing:0,overflow:"auto"},K),{children:_}))]}))})},Custom:t=>{let Q=t,{sheetID:e,sheetGroups:a,bodyScrolls:f,event:d,parent:n,nextToCursor:r,gravityPoint:i=22,props:s,content:C,closeAtAroundClick:y,closeAtEscapeKeyDown:E,closeAtPageTransit:T,closeAtParentBlur:L,closeAtSwipeDown:q,hold_state:ee,onOpen:Y,onClose:te,overwrap:oe,isOpen:se,resize:H,backgroundEffect:F,wrapperClassName:K}=Q,_=X(Q,["sheetID","sheetGroups","bodyScrolls","event","parent","nextToCursor","gravityPoint","props","content","closeAtAroundClick","closeAtEscapeKeyDown","closeAtPageTransit","closeAtParentBlur","closeAtSwipeDown","hold_state","onOpen","onClose","overwrap","isOpen","resize","backgroundEffect","wrapperClassName"]),R=p.is.function(C)?u(C,h({},s)):C,[b]=M(J()),k=p.is.element(n)||p.is.jmini(n)?p(n):U(n),W='[data-sheet-id="'+b+'"]',$='[data-sheet-content="'+b+'"]';i=i;let I=i%5||5,P=Math.ceil(i/5);const B={Init:()=>{if(r&&d){let l=p.getScreenSize(),ie=p.getCursor(d);return{top:ie.y-l.pageYOffset,left:ie.x-l.pageXOffset}}let S={};if(!k||!k[0])return S;let{top:m,right:c,bottom:z,left:o,height:O,width:N}=k.position();return p.is.oneOf(I,1,2)?S.left=o:I==3?S.left=o+N/2:p.is.oneOf(I,4,5)&&(S.left=c),i<=10?S.top=m:i<=15?S.top=m+O/2:i<=25&&(S.top=z),S},Adjust:()=>{let S=U(W).position(),m=U($).position(),c=k.position(),z=p.getScreenSize(),o={};for(let l in m)o[l]=m[l];if(p.scope(()=>{if(t.nextToCursor)return;let l=0;P==1?l=c.top-o.bottom:P==2?l=c.top-o.top:P==3?l=c.top-o.top+(c.height-o.height)/2:P==4?l=c.bottom-o.bottom:P==5&&(l=c.bottom-o.top),o.top+=l,o.bottom+=l}),p.scope(()=>{if(t.nextToCursor)return;let l=0;I==1?l=c.left-o.right:I==2?l=c.left-o.left:I==3?l=c.left-o.left+(c.width-o.width)/2:I==4?l=c.right-o.right:I==5&&(l=c.right-o.left),o.left+=l,o.right+=l}),o.top<0){let l=-o.top;o.top+=l,o.bottom+=l}if(o.bottom>z.height){let l=o.bottom-z.height;o.top-=l,o.bottom-=l}if(o.left<0){let l=-o.left;o.left+=l,o.right+=l}if(o.right>z.width){let l=o.right-z.width;o.left-=l,o.right-=l}let O=o.top-m.top,N=o.left-m.left;p(W).css({top:S.top+O+"px",left:S.left+N+"px"})}};let[Z]=M(B.Init());return j(()=>{U(W).await(10).addClass(g("Open")).await(200).callback(()=>{(H==null||H)&&B.Adjust()}),w.update({["customSheet-"+t.sheetID]:{reposition:()=>{B.Adjust()}}})},[]),k[0]?u(A,{className:[g("BB"),g("CustomSheet")].join(" "),"data-sheet-id":b,transition:"long",position:"absolute",width:0,height:0,opacity:"trans",flexCenter:!0,freeCSS:Z,children:u(he,{position:"absolute",className:[g("GPT"),g("GPT_"+i),g("Col_"+I),g("Row_"+P)].join(" "),children:u(A,D(h({"data-sheet-content":b,flexSizing:"none",maxHeight:"viewHeight"},_),{freeCSS:h({maxWidth:"98vw"},_.freeCSS),children:R}))})}):null}}},x={Wrapper:()=>u(v.Wrapper,{}),Element:t=>{let d=t,{isOpen:e,children:a}=d,f=X(d,["isOpen","children"]);return j(()=>{if(e){x.open(t.type,D(h({},f),{content:a}));return}f.sheetID&&x.close(f.sheetID)},[e,f.props||""]),u(pe,{})},image:(t,e)=>{let a=t.sheetID||J(),n=t,{type:f}=n,d=X(n,["type"]);x.open(f||"topCenter",D(h({size:"MAX"},d),{sheetID:a,freeCSS:{maxWidth:"100vw"},content:()=>{let[r]=M(p.flatArray(e));return u(ge,{children:V(re,{children:[u(ne.Right,{children:V(le.Sub.S,{color:"cloud",isRounded:!0,onClick:()=>{x.close(a)},children:[u(ae.X,{})," \u9589\u3058\u308B"]})}),u(de.Layout,{gap:1,gridTemplateColumns:"repeat(3,1fr)",gridTemplateRows:"repeat(2,auto)",gridChildTemplates:[["span 3",0],["span 2","span 2"],[0,0],[0,0],[0,"span 2"],["span 2",0],[0,0],[0,0]],children:r.map((i,s)=>u(fe,{ssCardBox:!0,position:"relative",flexCenter:!0,src:i},s))})]})})}}))},open:(t,e,a)=>{e.sheetID=(e.sheetID||"").replace(/\./g,"-"),e.type=t;let f=w.get("Sheet-"+G.get().sessionUID);f&&f.add(e,a)},modifyProps:(t,e)=>{t=(t||"").replace(/\./g,"-");let a=w.get(t);a&&a.modifyProps&&a.modifyProps(e)},resize:(t,e)=>{t=(t||"").replace(/\./g,"-");let a=w.get(t);a&&a.resize&&a.resize(e)},customSheet:{reposition:t=>{let e=w.get("customSheet-"+t);e&&e.reposition&&e.reposition()}},close:function(t,e,a){let f=v.getSessionStates();if(!f)return;let{val_sheets:d}=f;t=t==null?void 0:t.replace(/\./g,"-");let n=d.find(i=>i.sheetID==t);if(!n||e=="Escape"&&!n.closeAtEscapeKeyDown)return;let r=w.get(n.sheetID);r&&r.close&&r.close(a)},closeGroup:t=>{let e=v.getSessionStates();if(!e)return;let{val_sheets:a}=e;t=(t||"").replace(/\./g,"-");for(let f of a)f.sheetGroups&&f.sheetGroups==t&&x.close(f.sheetID)},closeAll:t=>{let e=v.getSessionStates();if(!e)return;let{val_sheets:a}=e;for(let f of a)t&&!f.closeAtPageTransit||x.close(f.sheetID,"pageTransit",!0)},Body:t=>u(A,h({className:g("BaseBody"),backgroundColor:"layer.1",borderRadius:"1.tone.primary",position:"relative",boxShadow:"3.remark",transition:"long"},t))};export{x as Sheet,x as default};
|
package/dist/fn/SwipeView.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{b as w,c as m,d as D}from"../chunk-C5N2D3ZX.js";import{jsx as T}from"react/jsx-runtime";import
|
|
1
|
+
import{b as w,c as m,d as D}from"../chunk-C5N2D3ZX.js";import{jsx as T}from"react/jsx-runtime";import p,{UUID as P}from"jmini";import{useState as V,useEffect as k,useRef as X}from"react";import{$$fromRoot as y}from"../@utils";import{Box as L,Flex as j}from"../atoms";import{LayoutClasses as a}from"../@styles/componentClasses";const _=t=>{let M=t,{options:{onSlideCallback:e,visibilitySurroundSlide:u=!0,autoSwipems:o=0,loop:s=!1,disableMousedrag:n=!1,disableTouch:l=!1}={},wrapper:i=r=>r,slides:S=[],slideIndex:B}=M,g=D(M,["options","wrapper","slides","slideIndex"]),[h]=V(P()),[d,b]=V({eventType:"init",index:t.slideIndex});const C=X(!1);k(()=>{b({eventType:"usr",index:t.slideIndex}),C.current||(C.current=!0)},[t.slideIndex]),k(()=>{let r=d.index+(s?1:0),v=p.is.oneOf(d.index,-1,S.length);v||e&&setTimeout(()=>{e(d.index)},300);let E=y("#Swiper-"+h);if(d.eventType=="adjustLoop")E.await(250).css({transition:"0s",transform:x(r)}).children().removeClass(a("Display")).parent().children(r).addClass([a("Display"),a("LoopAdjusting")]).await(100).removeClass(a("LoopAdjusting"));else if(d.eventType=="sys")E.await(250).css({transform:x(r)}).children().removeClass(a("Display")).parent().children(r).addClass(a("Display"));else if(E.children().removeClass(a("Display")).parent().children(r).addClass(a("Display")).parent().css({transition:"0.3s",transform:x(r)}).await(250).css({transition:"0s"}),v){let f=d.index==-1?S.length-1:0;b({eventType:"adjustLoop",index:f})}o&&!v&&p.interval.once(()=>{let f=d.index+1;!s&&f>S.length-1&&(f=0),b({eventType:"usr",index:f})},o-(d.eventType=="sys"?310:0),"SwipeTimer-"+h)},[d]);let c=S.map((r,v)=>T(L,{flexSizing:"none",width:1,height:0,className:a("Child"),children:i(r)},v));s&&(c.push(m(w({},c[0]),{key:c[0].key+"-Shallow0"})),c.unshift(m(w({},c[c.length-2]),{key:c[c.length-2].key+"-Shallow0"})));let A={x:0,y:0,process:!1,effectStartAt:0,id:h,loop:s,index:d.index,minIndex:s?-1:0,maxIndex:S.length+(s?1:-1),width:0,set_event:b},N=d.index+ +!!s;return T(L,m(w({overflow:"hidden",position:"relative"},g),{className:[g.className,a("SwipeView")].join(" "),freeCSS:w({zIndex:1},g.freeCSS),"data-swipe-id":h,onPointerDown:r=>{if(r.pointerType=="touch"){if(l)return}else if(r.pointerType=="mouse"&&(n||r.buttons!=1))return;I.Start(r,A)},children:T(j,{flexWrap:!1,gap:1,transition:"long",className:[a("Rail"),a("ShowOther_"+u)].join(" "),id:"Swiper-"+h,freeCSS:w({},C.current?{}:{transform:x(N)}),children:c})}))},x=t=>`translateX( calc( ${-100*t}% - ${12*t}px ) )`,I={Start:(t,e)=>{let{x:u,y:o}=p.getCursor(t),s=t.currentTarget,n=t.target;if(p.is.oneOf(n.tagName,"SELECT","BUTTON","LABEL","INPUT"))return;e=m(w({},e),{x:u-e.x+window.scrollX,y:o-e.y+window.scrollY,effectStartAt:new Date().getTime(),width:y("#Swiper-"+e.id).position().width});let{swipeId:l}=s.dataset;l==e.id&&p(document).addEvent({eventID:"SwipeView.PointerMove",eventType:"pointermove",callback:i=>{I.Check(i,e)},options:{passive:!1}}).addEvent({eventID:"SwipeView.PointerUp",eventType:"pointerup",callback:i=>{I.End(i,e)},options:{passive:!1}})},Check:(t,e)=>{if(e.process)return;let{x:u,y:o}=p.getCursor(t),s=Math.abs(u-e.x+window.scrollX),n=Math.abs(o-e.y+window.scrollY);if(!(t.touches&&t.touches.length>1)&&!(n+s<15))if(n>s/2)p(document).removeEvent(["SwipeView.PointerMove"]);else{e.process=!0;let l=e.index+(e.loop?1:0);y("#Swiper-"+e.id).children(l-1).addClass(a("Display")),p(document).addEvent({eventID:"SwipeView.Check.MouseMove",eventType:"mousemove",callback:i=>{I.Move(i,e)},options:{passive:!1}}).addEvent({eventID:"SwipeView.Check.TouchMove",eventType:"touchmove",callback:i=>{I.Move(i,e)},options:{passive:!1}}),t.preventDefault();return}},Move:(t,e)=>{if(t.touches&&t.touches.length>1)return;let{x:u}=p.getCursor(t),o=u-e.x+window.scrollX,n=e.index+(e.loop?1:0)-o/e.width;if(n<0)n/=2;else if(n>e.maxIndex){let l=n-e.maxIndex;n=e.maxIndex+l/2}y("#Swiper-"+e.id).css({transition:"0s",transform:x(n)}),t.preventDefault()},End:(t,e)=>{if(e.process){let o=p.getCursor(t).x-e.x+window.scrollX,s=new Date().getTime(),n=s-e.effectStartAt,l=e.index+(e.loop?1:0),i=0;n<400?i=l-(+(o>0)*2-1):i=Math.round(l-o/e.width),i=Math.max(Math.min(i,e.maxIndex),e.minIndex),e.process=!1,l===i?(e.effectStartAt=s,y("#Swiper-"+e.id).css({transition:".2s",transform:x(i)}).await(310).css({transition:"0s"}).children().removeClass(a("Display")).parent().children(l).addClass(a("Display"))):e.set_event({eventType:"usr",index:i+e.minIndex})}p(document).removeEvent(["SwipeView.PointerMove","SwipeView.Check.MouseMove","SwipeView.Check.TouchMove","SwipeView.PointerUp"])}},R=t=>T(_,m(w({},t),{slideIndex:Math.max(Math.min(t.slideIndex,t.slides.length-1),0)}));export{R as SwipeView,R as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{b as
|
|
1
|
+
import{b as o}from"../../chunk-C5N2D3ZX.js";import i from"jmini";const a=(t,e)=>{if(e=="plain")return{};let r={};return t=="drag"&&(r.padding=1),i.is.oneOf(e,"border","rowBorder","cellBorder")&&(r.borderBottom="2.normal"),i.is.oneOf(e,"border","cellBorder")&&(r.borderRight="2.normal"),o({padding:"3/4",backgroundColor:"layer.1",transition:"short",textAlign:"center"},r)},p=t=>{let e={};return t.right&&(e.borderRight="unset"),t.top&&(t.left&&(e.borderTopLeftRadius="inherit"),t.right&&(e.borderTopRightRadius="inherit")),t.bottom&&(e.borderBottom="unset",t.left&&(e.borderBottomLeftRadius="inherit"),t.right&&(e.borderBottomRightRadius="inherit")),e};export{a as DefaultCellStyles,p as DefaultCellSystemAdjustingStyles};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "amotify",
|
|
3
|
-
"version": "0.2.
|
|
3
|
+
"version": "0.2.271",
|
|
4
4
|
"description": "UI Component for React,NextJS,esbuild",
|
|
5
5
|
"scripts": {
|
|
6
6
|
"start": "run-p clean build:*",
|
|
@@ -90,7 +90,7 @@
|
|
|
90
90
|
"@fortawesome/free-solid-svg-icons": "^6.7.2",
|
|
91
91
|
"@fortawesome/react-fontawesome": "^3.1.1",
|
|
92
92
|
"dotenv": "^17.0.1",
|
|
93
|
-
"jmini": "^0.0.
|
|
93
|
+
"jmini": "^0.0.107",
|
|
94
94
|
"react": "^19.2.3"
|
|
95
95
|
},
|
|
96
96
|
"devDependencies": {
|