amotify 0.3.20 → 0.3.21

package/demo/esbuild/designBook.tsx

@@ -2486,8 +2486,8 @@ const Cropping = () => {
       <Button
         onClick={ () => {
           Cropper.openDialogNEdit( {
-            // use: 'square',
-            use: '3:1',
+            use: '4:3',
+            // use: '3:1',
             develops: [
               { size: 'S' },
               { size: 'R' },

package/demo/next/next.config.ts

@@ -7,6 +7,9 @@ const nextConfig: NextConfig = {
   experimental: {
     webpackMemoryOptimizations: true,
   },
+  allowedDevOrigins: [
+    '192.168.10.71'
+  ]
 }
 
 export default nextConfig

package/dist/fn/Cropper.d.ts

@@ -9,6 +9,16 @@ declare namespace Cropper {
         h: number;
         aspect: number;
     };
+    type Config = {
+        scale: {
+            _: number;
+            min: number;
+            max: number;
+        };
+        rotate: number;
+        grayScale: number;
+        tone: number;
+    };
     type Input = {
         use: Use;
         develops: Develop[];
@@ -27,7 +37,7 @@ declare namespace Cropper {
         }): void;
     };
     type CoreProps = {
-        val_file: Input.Filer.CustomFile;
+        file: Input.Filer.CustomFile;
         options: Input;
         finishedCallback(files: Input.Filer.CustomFile[]): void;
         abortCallback(): void;

package/dist/fn/Cropper.js

@@ -1 +1 @@
-import{b as K,c as ne,e as V}from"../chunk-C5N2D3ZX.js";import{Fragment as Ce,jsx as o,jsxs as p}from"react/jsx-runtime";import v,{Filer as he,UUID as me,useStore as q}from"jmini";import{$$fromRoot as le}from"../@utils";import{useState as X,useEffect as ee}from"react";import{Box as A,FAI as z,Column as J,FlexMargin as pe}from"../atoms";import{Row as M,Literal as w}from"../mols";import{Button as W}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 ge}from"@fortawesome/free-solid-svg-icons/faBarsStaggered";import{faRotateLeft as fe}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.isArray(e.use)&&e.use||e.use.split(":").map(r=>Number(r)),m=h/l;this.usage={w:h,h:l,aspect:m}}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,m=t/a;this.pst={frame:{x:h,y:l,w:t,h:a,aspect:m},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,m=this.scale.current*this.Picture.revisedAspect/100,r=h/m*n.x,s=l/m*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,m=h-i;if(c=="start")this.pinchEffectInfo.origin={x:l,y:m,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)),x=Math.sqrt(Math.pow(l,2)+Math.pow(m,2))/s,f=Number(r.scale*x);this.set_scale(f)}}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.isOneOf(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 m=i.getImageData(0,0,a.width,a.height),r=m.data;{e/=100;let f=[[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=f[0]/255,d=f[1]/255,_=f[2]/255;for(let S=0;S<l;S++)for(let b=0;b<h;b++){var s=(S*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]*=_}}i.putImageData(m,0,0);let x=a.toDataURL("image/jpeg");{let f=yield v.ImageLoader(x),{width:y,height:d}=f,_=y/d;this.Picture=ne(K({},this.Picture),{elm:f,aspect:_,revisedAspect:this.pst.frame.aspect>_?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,m=this.Picture.revisedAspect*l,r=this.pst.centerX-n*m,s=this.pst.centerY-h*m,C=this.Picture.elm.width*m,x=this.Picture.elm.height*m,f=0,y=0;this.usage.aspect<this.Picture.aspect?(f=C,y=f/this.usage.aspect):(y=x,f=y*this.usage.aspect);{let d=this.pst.frame.x-(C-f)/2,_=this.pst.frame.x+this.pst.frame.w-(C+f)/2,S=this.pst.frame.y-(x-y)/2,b=this.pst.frame.y+this.pst.frame.h-(x+y)/2,D=0;r<_&&(D=r-_),r>d&&(D=r-d);let E=0;s<b&&(E=s-b),s>S&&(E=s-S),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,_),d),s=Math.min(Math.max(s,b),S)}this.pst.outImage={x:r,y:s,w:C,h:x};{let d=1;t.lineWidth=d,t.strokeStyle="#ffffff66",t.strokeRect(r+(C-f)/2-d,s+(x-y)/2-d,f+d*2,y+d*2)}t.drawImage(this.Picture.elm,0,0,this.Picture.elm.width,this.Picture.elm.height,r,s,C,x)}{if(this.usage.aspect==1){t.fillStyle="rgba( 20,24,20,.5 )",t.beginPath();let l=a.width/3*2,m=a.height/3*2,r=Math.min(l,m),s=Math.max(l,m);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 m=v(document.body).getStyleProperty("--color-theme-hsl"),r=2;t.lineWidth=r,t.strokeStyle=`hsla( ${m},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,m=i.w/n,r=(i.y-a.y)/h,s=i.h/h,C=Array.from({length:c.length}),x="image/jpeg";for(let f=0;f<c.length;f++){let{size:y,maxSize:d}=c[f];d=d||{S:1024*20,R:1024*100,L:1024*350}[y];let _={S:140,R:600,L:1200}[y],S=document.createElement("canvas");S.width=m,S.height=s;let b=document.createElement("canvas");b.width=_,b.height=_/this.usage.aspect;let D=S.getContext("2d");if(!D)return;let E=b.getContext("2d");if(!E)return;D.clearRect(0,0,S.width,S.height),D.drawImage(this.Picture.elm,l,r,m,s,0,0,m,s),E.fillStyle="black",E.drawImage(S,0,0,S.width,S.height,0,0,b.width,b.height);let Z=b.toDataURL(x),H=yield Z.toBlob(x);if(!H)return;if(H.size>=d){let ie=d/H.size;if(Z=b.toDataURL(x,ie*.92),H=yield Z.toBlob(x),!H)return}let re=new File([H],this.val_file.name,{type:x});C[f]=re}return C})}}const se={Core:u=>{let{val_file:e,options:c,finishedCallback:t,abortCallback:a}=u,{use:i,develops:n=[]}=c,[h]=X(me());const l={scale:{default:120,min:50,max:300},rotate:0,grayScale:0,tone:0};let m=2048*2048,r=1024,[s,C]=X("init"),[x,f]=X(""),[y,d]=X(l.scale.default),[_,S]=X(l.rotate),[b,D]=X(l.grayScale),[E,Z]=X(l.tone),[H,re]=X(-1),[ie,ce]=X(-1);return ee(()=>{let g="CropperResize";return v(window).onEvent("resize",()=>{v.interval.once(()=>{var $;let I=le("#Canvas-"+h)[0];if(!I)return;let B=($=q.get(h))==null?void 0:$.Instance;if(!B)return;let F=I.position(),U=F.width/F.height,Y=r,k=Y/U;if(Y*k>m){let G=Y*k/m;Y=Math.floor(Y/Math.sqrt(G)),k=Math.floor(k/Math.sqrt(G))}I.width=r,I.height=k;let{width:P,height:Q}=I;B.pst.centerX=P/2,B.pst.centerY=Q/2,B.frameSizing(),B.modifyImage()},250,"CropperResize")},{eventID:g}),()=>{v(window).removeEvent(g)}},[]),ee(()=>{q.set({[h]:{}}),V(void 0,null,function*(){try{let g=le("#Canvas-"+h)[0];if(!g)return;let I=g.position(),B=I.width/I.height,F=r,U=F/B;if(F*U>m){let R=F*U/m;F=Math.floor(F/Math.sqrt(R)),U=Math.floor(U/Math.sqrt(R))}g.width=F,g.height=U;let Y=he(e),k=yield v.ImageLoader(yield Y.toObjectURL());re(k.width),ce(k.height);let P=new ve({set_scale:d,val_file:e,develops:n,use:i,scale:l.scale,componentId:h,canvas:g,picture:{image:k,grayScale:l.grayScale,tone:l.tone,rotate:l.rotate}});q.set({[h]:{Instance:P}});const Q=function(R){if(R.preventDefault(),R.touches&&R.touches.length>1)P.pinchEffect({eventType:"start",event:R}),v(document).onEvent("touchmove",L=>{L.preventDefault(),P.pinchEffect({eventType:"move",event:L})},{eventID:"CropperEffectMove",passive:!1}).onEvent("touchend",G,{eventID:"CropperEffectEnd",passive:!1});else{P.dragEffect(K({eventType:"start"},v.getCursor(R)));let{type:L}=R;v(document).onEvent(L=="touchstart"?"touchmove":"mousemove",T=>{$("move",T)},{eventID:"CropperEffectMove",passive:!1}).onEvent(L=="touchstart"?"touchend":"mouseup",T=>{$("end",T),G(T)},{eventID:"CropperEffectEnd",passive:!1})}},$=function(R,L){L.preventDefault(),P.dragEffect(K({eventType:R},v.getCursor(L)))},G=function(R){R.preventDefault(),v(document).removeEvent(["CropperEffectMove","CropperEffectEnd"])};v(g).removeEvent(["CropperMouseWheel","CropperTouchStart","CropperMouseDown"]).onEvent("wheel",R=>{R.preventDefault();let L=Number(R.wheelDelta*.04),T=P.scale.current+L;T=Math.max(T,P.scale.min),T=Math.min(T,P.scale.max),d(T)},{eventID:"CropperMouseWheel",passive:!1}).onEvent("touchstart",Q,{eventID:"CropperTouchStart",passive:!1}).onEvent("mousedown",Q,{eventID:"CropperMouseDown",passive:!1}),yield v.pending(1e3),C("ok")}catch(g){C("error"),f((g==null?void 0:g.message)||v.Stringify(g)),console.error(g)}})},[e.id]),ee(()=>{var I;let g=(I=q.get(h))==null?void 0:I.Instance;g&&g.updateScale(y)},[y]),ee(()=>{var I;let g=(I=q.get(h))==null?void 0:I.Instance;g&&g.updateFilter({grayScale:b,tone:E,rotate:_})},[b,E,_]),o(N.Body,{borderRadius:0,height:"viewHeight",width:"viewWidth",children:p(J,{className:[O("Wrap"),O("Use_"+i)].join(" "),gap:0,height:1,position:"relative",overflow:"hidden",borderRadius:"inherit",children:[p(A,{position:"absolute",ssZIndex:2,top:"50%",left:"50%",flexCenter:!0,xcss:{transform:"translate( -50%,-50% )",pointerEvents:"none"},children:[s=="init"&&o(te.Theme.XL,{showInitial:!0}),s=="error"&&p(w.Mini,{fontColor:"nega",children:["\u753B\u50CF\u306E\u8AAD\u307F\u8FBC\u307F\u306B\u5931\u6557\u3057\u307E\u3057\u305F",o(w.Description,{children:x})]})]}),p(A,{flexSizing:0,overflow:"hidden",ssZIndex:1,flexCenter:!0,paddingBottom:6,xcss:{backgroundColor:"#000f0f"},children:[o("canvas",{style:{width:"100%",height:"100%"},width:r,height:r,className:O("Canvas"),id:"Canvas-"+h}),o(w.Mini,{position:"absolute",bottom:1,left:1,right:1,ssCardBox:"plain",boxShadow:"0.max",padding:1,backgroundColor:"layer.0.opa.few",xcss:{backdropFilter:"blur(6px)"},children:p(J,{gap:"1/2",children:[p(M.Left,{gap:"1/2",flexWrap:!0,fontColor:"white",fontSize:"0.xs",fontHeight:1.2,children:[p(w,{children:["[",e.type,"]"]}),o(w,{children:e.name}),p(w,{children:[H,"px x ",ie,"px"]}),p(w,{children:["[",e.size.rank(),"B]"]})]}),p(M.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:Z,val_grayScale:b,set_grayScale:D,val_rotate:_,set_rotate:S}),o(pe,{}),o(W.Border.S,{onClick:()=>{a()},children:"\u9589\u3058\u308B"}),o(W.Prime.S,{boxShadow:"3.remark",onClick:()=>V(void 0,null,function*(){var B;let g=(B=q.get(h))==null?void 0:B.Instance;if(!g)return;te.fn.mini.active("CropperExportation");let I=yield g.export();setTimeout(()=>{te.fn.mini.stop("CropperExportation"),t(I)},1e3)}),children:p(M.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 p(Ce,{children:[p(M.Center,{gap:"1/6",children:[p(W.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(z,{icon:fe,fontColor:"4.thin"})]}),p(W.Border.S,{flexCenter:!0,gap:"1/4",border:"unset",borderTopLeftRadius:0,borderBottomLeftRadius:0,onClick:()=>{u.set_rotate((u.val_rotate+90)%360)},children:[o(z,{icon:de,fontColor:"4.thin"}),o(w,{children:"90\xB0"})]})]}),p(W.Border.S,{flexCenter:!0,gap:"1/2",border:"unset",onClick:t=>{let a="CropperZoomEdit";j.open({tipsID:a,gravityPoint:3,event:t,closeAtParentBlur:!1,xcss:{minWidth:12*26},content:o(N.Body,{children:p(J,{padding:1.5,children:[p(M.Separate,{children:[o(w.Paragraph,{children:p(M.Center,{gap:"1/2",children:[o(z.Search,{fontColor:"5.translucent"}),"Zoom"]})}),o(W.Sub,{color:"cloud",ssSphere:2.5,onClick:()=>{j.close(a)},children:o(z.X,{})})]}),o(A,{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.Micro,{fontColor:"4.thin",children:"Zoom"}),p(w,{unitWidth:4,children:[u.val_scale.toRatio(1,0),"%"]})]}),p(W.Border.S,{flexCenter:!0,gap:"1/2",border:"unset",onClick:t=>{let a="CropperGrayScaleEdit";j.open({tipsID:a,gravityPoint:3,event:t,closeAtParentBlur:!1,xcss:{minWidth:12*26},content:o(N.Body,{children:p(J,{padding:1.5,children:[p(M.Separate,{children:[o(w.Paragraph,{children:p(M.Center,{gap:"1/2",children:[o(z,{icon:ue,fontColor:"5.translucent"}),"Gray Scale"]})}),o(W.Sub,{color:"cloud",ssSphere:2.5,onClick:()=>{j.close(a)},children:o(z.X,{})})]}),o(A,{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.Micro,{fontColor:"4.thin",children:"GrayScale"}),p(w,{children:[u.val_grayScale.toRatio(1,0),"%"]})]}),p(W.Border.S,{flexCenter:!0,gap:"1/2",border:"unset",onClick:t=>{let a="CropperToneEdit";j.open({tipsID:a,gravityPoint:3,event:t,closeAtParentBlur:!1,xcss:{minWidth:12*26,maxWidth:12*24},content:()=>{let i=[];for(let n=1;n<=10;n++)i.push({value:n,label:p(M.Left,{gap:"1/3",children:[o(A,{ssSphere:1,className:[O("ToneBall"),O("ToneBall_"+n)].join(" ")}),o(A,{textAlign:"left",flexSizing:0,children:c(n)})]})});return o(N.Body,{children:p(J,{padding:1.5,children:[p(M.Separate,{children:[o(w.Paragraph,{children:p(M.Center,{gap:"1/2",children:[o(z,{icon:ge,fontColor:"5.translucent"}),"Tone"]})}),o(W.Sub,{color:"cloud",ssSphere:2.5,onClick:()=>{j.close(a)},children:o(z.X,{})})]}),o(A,{borderBottom:!0,opacity:"low"}),o(ae.Radio.Normal,{value:u.val_tone,gap:"1/2",cellStyles:{fontColor:"3.blur"},options:[{value:0,label:o(A,{flexSizing:0,textAlign:"center",children:"\u306A\u3057"})},...i],onUpdateValidValue:n=>{u.set_tone(n)}})]})})}})},children:[o(w.Micro,{fontColor:"4.thin",children:"Tone"}),o(A,{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(K({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,xcss:{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};
+import{b as L,c as D,e as j}from"../chunk-C5N2D3ZX.js";import{Fragment as fe,jsx as o,jsxs as g}from"react/jsx-runtime";import C,{Filer as ne,UUID as se,useStore as q}from"jmini";import{$$fromRoot as ie}from"../@utils";import{useState as Y,useEffect as Q}from"react";import{Box as H,FAI as U,Column as G,FlexMargin as le}from"../atoms";import{Row as F,Literal as M}from"../mols";import{Button as X}from"./Button";import N from"./Sheet";import ee from"./Loader";import te from"./Input";import{faPalette as ce}from"@fortawesome/free-solid-svg-icons/faPalette";import{faBarsStaggered as he}from"@fortawesome/free-solid-svg-icons/faBarsStaggered";import{faRotateLeft as pe}from"@fortawesome/free-solid-svg-icons/faRotateLeft";import{faRotateRight as me}from"@fortawesome/free-solid-svg-icons/faRotateRight";import{CropperClasses as V}from"../@styles/componentClasses";import O from"./Tooltips";class ge{constructor(e){let{config:l}=e;this.setConfig=e.setConfig,this.val_file=e.val_file,this.develops=e.develops;{let[s,n]=C.isArray(e.use)&&e.use||e.use.split(":").map(p=>Number(p)),t=s/n;this.usage={w:s,h:n,aspect:t}}this.componentId=e.componentId;let a=e.canvas,r=e.image;this.Canvas={elm:a,ctx:a.getContext("2d")};let{width:i,height:c}=r,h=i/c;this.Picture={elm:r,originDataUrl:r.src,aspect:h,revisedAspect:1,rotate:l.rotate,grayScale:l.grayScale,tone:l.tone},this.scale={_:l.scale._,current:l.scale._,min:l.scale.min,max:l.scale.max},this.usage.aspect<this.Picture.aspect?this.scale.min=100/h*this.usage.aspect:this.scale.min=100*h/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:i/2,imageY:c/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,l=this.Picture.elm,a=0,r=0;{if(this.usage.aspect==1){let p=e.width*.6666666666666666,v=e.height*(2/3);r=a=Math.min(p,v)}else this.usage.aspect>1?(a=e.width*.9,r=a/this.usage.aspect):(r=e.height*.9,a=r*this.usage.aspect);let t=.85;r>e.height*t&&(r=e.height*t,a=r*this.usage.aspect),a>e.width*t&&(a=e.width*t,r=a/this.usage.aspect)}let{width:i,height:c}=l,h=(e.width-a)/2,s=(e.height-r)/2,n=a/r;this.pst={frame:{x:h,y:s,w:a,h:r,aspect:n},outImage:{x:0,y:0,w:0,h:0},imageX:i/2,imageY:c/2,centerX:e.width/2,centerY:e.height/2}}dragEffect(e){let{eventType:l,x:a,y:r}=e;if(l=="start"){let i=this.Canvas.elm.position();this.dragEffectInfo={origin:{x:a,y:r},frameExpandRate:{x:this.Canvas.elm.width/i.width,y:this.Canvas.elm.height/i.height}}}else{let{origin:i,frameExpandRate:c}=this.dragEffectInfo,h=i.x-a,s=i.y-r,n=this.scale.current*this.Picture.revisedAspect/100,t=h/n*c.x,p=s/n*c.y;l=="move"?this.drawImage(this.pst.imageX+t,this.pst.imageY+p):l=="end"&&this.drawImage(this.pst.imageX+=t,this.pst.imageY+=p)}}pinchEffect(e){let{eventType:l,event:a}=e,{x:r,y:i}=C.getCursor(a.touches[0]),{x:c,y:h}=C.getCursor(a.touches[1]),s=c-r,n=h-i;if(l=="start")this.pinchEffectInfo.origin={x:s,y:n,scale:this.scale.current};else if(l=="move"){let{origin:t}=this.pinchEffectInfo,p=Math.sqrt(Math.pow(t.x,2)+Math.pow(t.y,2)),w=Math.sqrt(Math.pow(s,2)+Math.pow(n,2))/p,f=Number(t.scale*w);f=Math.max(f,this.scale.min),f=Math.min(f,this.scale.max),this.setConfig(u=>D(L({},u),{scale:D(L({},u.scale),{_:f})}))}}updateScale(e){let l=e;l=Math.max(l,this.scale.min),l=Math.min(l,this.scale.max),this.scale.current=l,this.drawImage()}updateFilter(e){this.Picture.grayScale=e.grayScale,this.Picture.tone=e.tone,this.Picture.rotate=e.rotate,this.modifyImage()}modifyImage(){return j(this,null,function*(){let{grayScale:e,tone:l,rotate:a}=this.Picture;const r=document.createElement("canvas");let i=r.getContext("2d"),c=yield C.ImageLoader(this.Picture.originDataUrl),h=c.width,s=c.height;(a==90||a==270)&&(h=c.height,s=c.width),r.width=h,r.height=s,e&&(i.filter="grayscale("+e+"%)"),a&&(i.translate(h/2,s/2),i.rotate(a*Math.PI/180),C.isOneOf(a,90,270)?i.translate(-s/2,-h/2):i.translate(-h/2,-s/2)),i.drawImage(c,0,0,c.width,c.height);let n=i.getImageData(0,0,r.width,r.height),t=n.data;{e/=100;let f=[[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]][l],u=f[0]/255,d=f[1]/255,B=f[2]/255;for(let b=0;b<s;b++)for(let S=0;S<h;S++){var p=(b*h+S)*4;if(e){let T=.3*t[p]+.59*t[p+1]+.11*t[p+2];for(var v=0;v<3;v++){let m=t[p+v];t[p+v]=m+(T-m)*e}}t[p]*=u,t[p+1]*=d,t[p+2]*=B}}i.putImageData(n,0,0);let w=r.toDataURL("image/jpeg");{let f=yield C.ImageLoader(w),{width:u,height:d}=f,B=u/d;this.Picture=D(L({},this.Picture),{elm:f,aspect:B,revisedAspect:this.pst.frame.aspect>B?this.pst.frame.w/u:this.pst.frame.h/d})}this.drawImage()})}drawImage(e,l){let{Canvas:{ctx:a,elm:r},pst:{frame:i}}=this;a.clearRect(0,0,this.Canvas.elm.width,this.Canvas.elm.height);let c=e||this.pst.imageX,h=l||this.pst.imageY;{let s=this.scale.current/100,n=this.Picture.revisedAspect*s,t=this.pst.centerX-c*n,p=this.pst.centerY-h*n,v=this.Picture.elm.width*n,w=this.Picture.elm.height*n,f=0,u=0;this.usage.aspect<this.Picture.aspect?(f=v,u=f/this.usage.aspect):(u=w,f=u*this.usage.aspect);{let d=this.pst.frame.x-(v-f)/2,B=this.pst.frame.x+this.pst.frame.w-(v+f)/2,b=this.pst.frame.y-(w-u)/2,S=this.pst.frame.y+this.pst.frame.h-(w+u)/2,T=0;t<B&&(T=t-B),t>d&&(T=t-d);let m=0;p<S&&(m=p-S),p>b&&(m=p-b),this.dragEffectInfo.origin.x+=T/2/this.dragEffectInfo.frameExpandRate.x,this.dragEffectInfo.origin.y+=m/2/this.dragEffectInfo.frameExpandRate.y,t=Math.min(Math.max(t,B),d),p=Math.min(Math.max(p,S),b)}this.pst.outImage={x:t,y:p,w:v,h:w};{let d=1;a.lineWidth=d,a.strokeStyle="#ffffff66",a.strokeRect(t+(v-f)/2-d,p+(w-u)/2-d,f+d*2,u+d*2)}a.drawImage(this.Picture.elm,0,0,this.Picture.elm.width,this.Picture.elm.height,t,p,v,w)}{if(this.usage.aspect==1){a.fillStyle="rgba( 20,24,20,.5 )",a.beginPath();let s=r.width/3*2,n=r.height/3*2,t=Math.min(s,n),p=Math.max(s,n);a.arc(r.width/2,r.height/2,p*1.41,0,Math.PI*2,!0),a.arc(r.width/2,r.height/2,t/2,0,Math.PI*2,!1),a.closePath(),a.fill()}else a.fillStyle="rgba( 20,24,20,.5 )";{let n=C(document.body).getStyleProperty("--color-theme-hsl"),t=2;a.lineWidth=t,a.strokeStyle=`hsla( ${n},1 )`,a.strokeRect(i.x-t,i.y-t,i.w+t*2,i.h+t*2)}}}export(){return j(this,null,function*(){let{Canvas:e,develops:l,Picture:a,pst:{outImage:r,frame:i}}=this,c=r.w/a.elm.width,h=r.h/a.elm.height,s=(i.x-r.x)/c,n=i.w/c,t=(i.y-r.y)/h,p=i.h/h,v=Array.from({length:l.length}),w="image/jpeg";for(let f=0;f<l.length;f++){let{size:u,maxSize:d}=l[f];d=d||{S:1024*20,R:1024*100,L:1024*350}[u];let B={S:140,R:600,L:1200}[u],b=document.createElement("canvas");b.width=n,b.height=p;let S=document.createElement("canvas");S.width=B,S.height=B/this.usage.aspect;let T=b.getContext("2d");if(!T)return;let m=S.getContext("2d");if(!m)return;T.clearRect(0,0,b.width,b.height),T.drawImage(this.Picture.elm,s,t,n,p,0,0,n,p),m.fillStyle="black",m.drawImage(b,0,0,b.width,b.height,0,0,S.width,S.height);let x=S.toDataURL(w),I=yield x.toBlob(w);if(!I)return;if(I.size>=d){let z=d/I.size;if(x=S.toDataURL(w,z*.92),I=yield x.toBlob(w),!I)return}let W=new File([I],this.val_file.name,{type:w});v[f]=W}return v})}}const re={Core:_=>{let{options:e,finishedCallback:l,abortCallback:a}=_,{use:r,develops:i=[]}=e,c=2048*2048,h=1024,s=4096,[n]=Y(se()),[t]=Y(()=>_.file),[p,v]=Y("init"),[w,f]=Y(""),[u,d]=Y({scale:{_:120,min:50,max:300},rotate:0,grayScale:0,tone:0}),[B,b]=Y(-1),[S,T]=Y(-1);return Q(()=>{let m="CropperResize";return C(window).onEvent("resize",()=>{C.interval.once(()=>{var Z;let x=ie("#Canvas-"+n)[0];if(!x)return;let I=(Z=q.get(n))==null?void 0:Z.Instance;if(!I)return;let W=x.position(),z=W.width/W.height,A=h,E=A/z;if(A*E>c){let $=A*E/c;A=Math.floor(A/Math.sqrt($)),E=Math.floor(E/Math.sqrt($))}x.width=h,x.height=E;let{width:k,height:K}=x;I.pst.centerX=k/2,I.pst.centerY=K/2,I.frameSizing(),I.modifyImage()},250,"CropperResize")},{eventID:m}),()=>{C(window).removeEvent(m)}},[]),Q(()=>{q.set({[n]:{}}),j(void 0,null,function*(){try{let m=ie("#Canvas-"+n)[0];if(!m)return;let x=m.position(),I=x.width/x.height,W=h,z=W/I;if(W*z>c){let y=W*z/c;W=Math.floor(W/Math.sqrt(y)),z=Math.floor(z/Math.sqrt(y))}m.width=W,m.height=z;let A=ne(t),E=yield C.ImageLoader(yield A.toObjectURL());if(E.width>s||E.height>s){const y=Math.min(s/E.width,s/E.height),R=document.createElement("canvas");R.width=Math.floor(E.width*y),R.height=Math.floor(E.height*y),R.getContext("2d").drawImage(E,0,0,R.width,R.height);const P=yield new Promise(J=>R.toBlob(oe=>J(URL.createObjectURL(oe))));E=yield C.ImageLoader(P)}b(E.width),T(E.height);let k=new ge({config:u,setConfig:d,val_file:t,develops:i,use:r,componentId:n,canvas:m,image:E});q.set({[n]:{Instance:k}});const K=function(y){if(y.preventDefault(),y.touches&&y.touches.length>1)k.pinchEffect({eventType:"start",event:y}),C(document).onEvent("touchmove",R=>{R.preventDefault(),k.pinchEffect({eventType:"move",event:R})},{eventID:"CropperEffectMove",passive:!1}).onEvent("touchend",$,{eventID:"CropperEffectEnd",passive:!1});else{k.dragEffect(L({eventType:"start"},C.getCursor(y)));let{type:R}=y;C(document).onEvent(R=="touchstart"?"touchmove":"mousemove",P=>{Z("move",P)},{eventID:"CropperEffectMove",passive:!1}).onEvent(R=="touchstart"?"touchend":"mouseup",P=>{Z("end",P),$(P)},{eventID:"CropperEffectEnd",passive:!1})}},Z=function(y,R){R.preventDefault(),k.dragEffect(L({eventType:y},C.getCursor(R)))},$=function(y){y.preventDefault(),C(document).removeEvent(["CropperEffectMove","CropperEffectEnd"])};C(m).removeEvent(["CropperMouseWheel","CropperTouchStart","CropperMouseDown"]).onEvent("wheel",y=>{y.preventDefault();let R=Number(y.wheelDelta*.04),P=k.scale.current+R;P=Math.max(P,k.scale.min),P=Math.min(P,k.scale.max),d(J=>D(L({},J),{scale:D(L({},J.scale),{_:P})}))},{eventID:"CropperMouseWheel",passive:!1}).onEvent("touchstart",K,{eventID:"CropperTouchStart",passive:!1}).onEvent("mousedown",K,{eventID:"CropperMouseDown",passive:!1}),yield C.pending(1e3),v("ok")}catch(m){v("error"),f((m==null?void 0:m.message)||C.Stringify(m)),console.error(m)}})},[t.id]),Q(()=>{var x;let m=(x=q.get(n))==null?void 0:x.Instance;m&&m.updateScale(u.scale._)},[u.scale._]),Q(()=>{var x;let m=(x=q.get(n))==null?void 0:x.Instance;m&&m.updateFilter(u)},[u.grayScale,u.tone,u.rotate]),o(N.Body,{borderRadius:0,height:"viewHeight",width:"viewWidth",children:g(G,{className:[V("Wrap"),V("Use_"+r)].join(" "),gap:0,height:1,position:"relative",overflow:"hidden",borderRadius:"inherit",children:[g(H,{position:"absolute",ssZIndex:2,top:"50%",left:"50%",flexCenter:!0,xcss:{transform:"translate( -50%,-50% )",pointerEvents:"none"},children:[p=="init"&&o(ee.Theme.XL,{showInitial:!0}),p=="error"&&g(M.Mini,{fontColor:"nega",children:["\u753B\u50CF\u306E\u8AAD\u307F\u8FBC\u307F\u306B\u5931\u6557\u3057\u307E\u3057\u305F",o(M.Description,{children:w})]})]}),g(H,{flexSizing:0,overflow:"hidden",ssZIndex:1,flexCenter:!0,paddingBottom:6,xcss:{backgroundColor:"#000f0f"},children:[o("canvas",{style:{width:"100%",height:"100%"},width:h,height:h,className:V("Canvas"),id:"Canvas-"+n}),o(M.Mini,{position:"absolute",bottom:1,left:1,right:1,ssCardBox:"plain",boxShadow:"0.max",padding:1,backgroundColor:"layer.0.opa.few",xcss:{backdropFilter:"blur(6px)"},children:g(G,{gap:"1/2",children:[g(F.Left,{gap:"1/2",flexWrap:!0,fontColor:"white",fontSize:"0.xs",fontHeight:1.2,children:[g(M,{children:["[",t.type,"]"]}),o(M,{children:t.name}),g(M,{children:[B,"px x ",S,"px"]}),g(M,{children:["[",t.size.rank(),"B]"]})]}),g(F.Left,{gap:"1/2",verticalAlign:"unset",flexWrap:!0,children:[o(re.SettingRegion,{config:u,setConfig:d}),o(le,{}),o(X.Border.S,{onClick:()=>{a()},children:"\u9589\u3058\u308B"}),o(X.Prime.S,{boxShadow:"3.remark",onClick:()=>j(void 0,null,function*(){var I;let m=(I=q.get(n))==null?void 0:I.Instance;if(!m)return;ee.fn.mini.active("CropperExportation");let x=yield m.export();setTimeout(()=>{ee.fn.mini.stop("CropperExportation"),l(x)},1e3)}),children:g(F.Center,{gap:"1/2",children:[o(ee.White.R,{loaderID:"CropperExportation"}),"\u6C7A\u5B9A"]})})]})]})})]})]})})},SettingRegion:_=>{let{config:e,setConfig:l}=_,a=["","\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"],r=i=>a[i]||"\u306A\u3057";return g(fe,{children:[g(F.Center,{gap:"1/6",children:[g(X.Border.S,{flexCenter:!0,gap:"1/4",border:"unset",borderTopRightRadius:0,borderBottomRightRadius:0,onClick:()=>{let i=e.rotate-90;i<0&&(i+=360),l(c=>D(L({},c),{rotate:i}))},children:[o(M,{children:"90\xB0"}),o(U,{icon:pe,fontColor:"4.thin"})]}),g(X.Border.S,{flexCenter:!0,gap:"1/4",border:"unset",borderTopLeftRadius:0,borderBottomLeftRadius:0,onClick:()=>{let i=(e.rotate+90)%360;l(c=>D(L({},c),{rotate:i}))},children:[o(U,{icon:me,fontColor:"4.thin"}),o(M,{children:"90\xB0"})]})]}),g(X.Border.S,{flexCenter:!0,gap:"1/2",border:"unset",onClick:i=>{let c="CropperZoomEdit";O.open({tipsID:c,gravityPoint:3,event:i,closeAtParentBlur:!1,xcss:{minWidth:12*26},content:o(N.Body,{children:g(G,{padding:1.5,children:[g(F.Separate,{children:[o(M.Paragraph,{children:g(F.Center,{gap:"1/2",children:[o(U.Search,{fontColor:"5.translucent"}),"Zoom"]})}),o(X.Sub,{color:"cloud",ssSphere:2.5,onClick:()=>{O.close(c)},children:o(U.X,{})})]}),o(H,{borderBottom:!0,opacity:"low"}),o(te.Slider,{override:"force",value:e.scale._-e.scale.min,min:e.scale.min-100,max:e.scale.max-100,step:25,onUpdateValidValue:(h,s)=>{C.interval.once(()=>{let n=h+100;l(t=>D(L({},t),{scale:D(L({},t.scale),{_:n})}))},250,"Cropper.UpdateScale")},onLegendRender:h=>"x"+Math.round(100+h)/100})]})})})},children:[o(M.Micro,{fontColor:"4.thin",children:"Zoom"}),g(M,{unitWidth:4,children:[e.scale._.toRatio(1,0),"%"]})]}),g(X.Border.S,{flexCenter:!0,gap:"1/2",border:"unset",onClick:i=>{let c="CropperGrayScaleEdit";O.open({tipsID:c,gravityPoint:3,event:i,closeAtParentBlur:!1,xcss:{minWidth:12*26},content:o(N.Body,{children:g(G,{padding:1.5,children:[g(F.Separate,{children:[o(M.Paragraph,{children:g(F.Center,{gap:"1/2",children:[o(U,{icon:ce,fontColor:"5.translucent"}),"Gray Scale"]})}),o(X.Sub,{color:"cloud",ssSphere:2.5,onClick:()=>{O.close(c)},children:o(U.X,{})})]}),o(H,{borderBottom:!0,opacity:"low"}),o(te.Slider,{value:e.grayScale,min:0,max:100,step:10,onUpdateValidValue:h=>{C.interval.once(()=>{l(s=>D(L({},s),{grayScale:h}))},250,"Cropper.GrayScale")},onLegendRender:h=>h+"%"})]})})})},children:[o(M.Micro,{fontColor:"4.thin",children:"GrayScale"}),g(M,{children:[e.grayScale.toRatio(1,0),"%"]})]}),g(X.Border.S,{flexCenter:!0,gap:"1/2",border:"unset",onClick:i=>{let c="CropperToneEdit";O.open({tipsID:c,gravityPoint:3,event:i,closeAtParentBlur:!1,xcss:{minWidth:12*26,maxWidth:12*24},content:()=>{let h=[];for(let s=1;s<=10;s++)h.push({value:s,label:g(F.Left,{gap:"1/3",children:[o(H,{ssSphere:1,className:[V("ToneBall"),V("ToneBall_"+s)].join(" ")}),o(H,{textAlign:"left",flexSizing:0,children:r(s)})]})});return o(N.Body,{children:g(G,{padding:1.5,children:[g(F.Separate,{children:[o(M.Paragraph,{children:g(F.Center,{gap:"1/2",children:[o(U,{icon:he,fontColor:"5.translucent"}),"Tone"]})}),o(X.Sub,{color:"cloud",ssSphere:2.5,onClick:()=>{O.close(c)},children:o(U.X,{})})]}),o(H,{borderBottom:!0,opacity:"low"}),o(te.Radio.Normal,{value:e.tone,gap:"1/2",cellStyles:{fontColor:"3.blur"},options:[{value:0,label:o(H,{flexSizing:0,textAlign:"center",children:"\u306A\u3057"})},...h],onUpdateValidValue:s=>{l(n=>D(L({},n),{tone:s}))}})]})})}})},children:[o(M.Micro,{fontColor:"4.thin",children:"Tone"}),o(H,{boxShadow:"2.remark",ssSphere:1,className:[V("ToneBall"),V("ToneBall_"+e.tone)].join(" ")}),r(e.tone)]})]})}},ae={openDialogNEdit:_=>{te.Filer.fn.openDialog({accept:"image",multiple:!1,onChange:e=>{ae.openEditor(L({imageFile:e[0]},_))}})},openEditor:_=>j(void 0,null,function*(){let e="CropperImage";N.open("middleCenter",{sheetID:e,size:"MAX",padding:0,margin:0,xcss:{maxWidth:"100%"},content:o(re.Core,{file:_.imageFile,options:_,finishedCallback:l=>{N.close(e),_.onProcessFinished(l)},abortCallback:()=>{N.close(e)}}),closeAtEscapeKeyDown:!1})})};export{ae as Cropper,ae as default};

package/dist/fn/DataGrid/index.js

@@ -1 +1 @@
-import{b as a,c as p,d as G,e as be}from"../../chunk-C5N2D3ZX.js";import{Fragment as Be,jsx as l,jsxs as $}from"react/jsx-runtime";import f,{useStore as ne,UUID as ge}from"jmini";import me,{useState as Re,useEffect as se}from"react";import{ExtractStyles as X,GenerateHTMLProps as xe,dragEffect as ye,useRemote as ie}from"../../@utils";import{faArrowUp as Te}from"@fortawesome/free-solid-svg-icons/faArrowUp";import{faUpDown as De}from"@fortawesome/free-solid-svg-icons/faUpDown";import{Box as K,Flex as we,FAI as _,Span as ke}from"../../atoms";import{Literal as pe,Row as q,MarkerPen as he}from"../../mols";import{Button as ce}from"../Button";import E from"../Input";import{TableClasses as Ke}from"../../@styles/componentClasses";import{faGripVertical as Se}from"@fortawesome/free-solid-svg-icons/faGripVertical";import{Tips as Ce}from"../Tips";const u={reservedKeys:["row_id","onCheckerDisabled","onDraggerDisabled","columnIdx","isSelected","isFilterMatched","isVisible","draggerIndex","onRowClick"],toSafetyHeader:t=>{let e=!!t.some(o=>o.draggable);return(t==null?void 0:t.map((o,n)=>{var d;return f.isRecord(o)||(o={key:o}),f.isString(o.key)&&(o.key=o.key.replace(/[.\s]/g,"_")),e&&(o.sortable=0,o.filterable=!1),o.columnIdx=(d=o.columnIdx)!=null?d:n,o}).toASC("columnIdx"))||[]},toSafetyBody:t=>t==null?void 0:t.map((e,r)=>{var n;let o={};return Object.entries(e).forEach(([d,c])=>{var g,i;if(f.isOneOf(d,...u.reservedKeys))return;let s=c;f.isNullish(s)||(f.isRecord(s)||(s={data:s}),f.isString(d)&&(d=d.replace(/[.\s]/g,"_")),s.sortKey=(i=(g=s.sortKey)!=null?g:String(s.data))!=null?i:"",o[d]=s)}),o=p(a({},o),{row_id:(n=e.row_id)!=null?n:r,onRowClick:e.onRowClick,isSelected:!!e.isSelected,isFilterMatched:!0,isVisible:!0,onCheckerDisabled:e.onCheckerDisabled,onDraggerDisabled:e.onDraggerDisabled,draggerIndex:r}),o}),toSafetyData:t=>{var o,n;let{header:e=[]}=t,r={datagridID:t.datagridID||ge(),sessionID:ge(),body:u.toSafetyBody(t.body||[]),filter:{keyword:t.defaultSearchKey||"",current:[]},sort:{col:-1,dir:1},paging:{rows:t.maxRows||100,total:1,current:1},draggable:!!e.some(d=>d.draggable)};{let d=e==null?void 0:e.findIndex(c=>c.defSort);d!==-1&&(r.sort.col=d,r.sort.dir=(n=(o=e[d])==null?void 0:o.sortable)!=null?n:1)}return r.draggable&&(r.sort.col=-1,r.sort.dir=0),u.updateRowMeta(r,t)},updateRowMeta:(t,e)=>{let r=a({},t);if(r.sort.col>=0&&r.sort.dir){let o=e.header[r.sort.col].key;r.sort.dir==1?r.body.toASC(o+".sortKey"):r.body.toDESC(o+".sortKey")}{let o=String(r.filter.keyword)||"";r.body.forEach(n=>{if(n.isFilterMatched=!0,!o)return;let d=e.header.some(c=>{var i;let s=n[c.key];return!s||!s.sortKey?!1:!!((i=String(s.sortKey||s.data))!=null&&i.match(new RegExp(o.escapeRegExChar(),"i")))});n.isFilterMatched=d})}{let o=r.paging.rows;r.paging.total=Math.ceil(r.body.filter(s=>s.isFilterMatched).length/o);let n=o*(r.paging.current-1),d=n+o,c=0;r.body.forEach(s=>{s.isVisible=!1,s.isFilterMatched&&(s.isVisible=c>=n&&c<d,c++)})}return r.draggable&&r.body.toASC("draggerIndex"),r},index:t=>{var i,b,H,x;let[e,r]=Re(()=>u.toSafetyData(t));se(()=>{ne.set({["reset-"+e.datagridID]:()=>{r(u.toSafetyData(t))},["refresh-"+e.datagridID]:()=>{r(y=>u.updateRowMeta(p(a({},y),{body:u.toSafetyBody(t.body)}),t))}})},[t]),se(()=>{ne.set({["rows-"+e.datagridID]:e.body}),ie.bridge(e.datagridID,{val_config:e,remoteUpdate:{paging:y=>{r(m=>u.updateRowMeta(p(a({},m),{paging:p(a({},m.paging),{current:Math.max(1,Math.min(m.paging.total,y))})}),t))},maxRow:y=>{r(m=>u.updateRowMeta(p(a({},m),{paging:p(a({},m.paging),{rows:y,current:1})}),t))},searchKey:y=>{f.interval.once(()=>{r(m=>{let w=p(a({},m),{paging:p(a({},m.paging),{current:1}),filter:p(a({},m.filter),{keyword:String(y||"").trim()})});return u.updateRowMeta(w,t)})},300,"InputSearchTime")}}})},[e]);const o=me.useRef(!1);se(()=>{if(t.onSelected){if(!o.current){o.current=!0;return}t.onSelected(e.body.filter(y=>y.isSelected))}},[(i=e==null?void 0:e.body)==null?void 0:i.filter(y=>y.isSelected).length]);const n=me.useRef(!1);se(()=>{if(t.onSorted){if(!n.current){n.current=!0;return}t.onSorted(e.sort.col,e.sort.dir)}},[(b=e==null?void 0:e.sort)==null?void 0:b.col,(H=e==null?void 0:e.sort)==null?void 0:H.dir]);let d={input:t,val_config:e,set_config:r},{className:c,style:s}=xe(t),g=(x=t.colLength)!=null?x:t.header.length;return l(K,{className:c,style:s,children:l(D.Table,{className:Ke("DataGrid"),borderRadius:"inherit",children:$(D.Body,{children:[l(u.Header,a({},d)),l(u.Body,a({},d)),l(u.Footer,a({},d))]})},[g,...t.header.map(y=>y.key),e.sessionID].join("."))})},Checker:t=>l(K,{flexCenter:!0,onClick:e=>{e.stopPropagation()},children:l(E.Checker,p(a({wrapStyles:{display:"inlineBlock"},cellStyles:{gap:0}},t),{label:!1}))}),Header:t=>{var g,i,b,H;let{input:e,val_config:r,set_config:o}=t;if(e.headerless)return null;let n="datagrid-dragger-"+r.datagridID,d=["datagrid",r.datagridID,""].join("-"),c=1+r.body.filter(x=>x.isVisible).length+ +!!e.footer,s=(g=e.colLength)!=null?g:e.header.length;return l(ye.DropArea,p(a({jsxElement:D.Row,id:d},e.rowStyles),{dragInfo:{type:n,id:String(((H=(b=(i=r.body)==null?void 0:i.filter(x=>x.isFilterMatched))==null?void 0:b[0])==null?void 0:H.draggerIndex)||0),marker:"bottom"},children:e.header.toASC("columnIdx").map((x,y)=>{var re,oe,le,k,j,F;let[m,w]=X(x),te=w,{isTH:S,key:C,label:M,onLabelRender:B,columnIdx:Y,checkable:N,draggable:J,defSort:de,sortable:P,filterable:A,isHidden:v}=te,T=G(te,["isTH","key","label","onLabelRender","columnIdx","checkable","draggable","defSort","sortable","filterable","isHidden"]);if(v)return null;let I={rowIdx:0,colIdx:y,topIdx:0,leftIdx:y,rightIdx:s-y-1,bottomIdx:c-1,isHeader:!0,isBody:!1,isFooter:!1},Z=J,V=P!=0,O=y==r.sort.col,Q=f.deepMerge(f.deepCopy(e.cellStyles),fe(I,{}),(re=e.cellStyles)==null?void 0:re.onHeader,!I.leftIdx&&((oe=e.cellStyles)==null?void 0:oe.onLeft),!I.rightIdx&&((le=e.cellStyles)==null?void 0:le.onRight),!I.topIdx&&((k=e.cellStyles)==null?void 0:k.onTop),!I.bottomIdx&&((j=e.cellStyles)==null?void 0:j.onBottom),m);e.onCellStyles&&(Q=e.onCellStyles(I,Q||{}));let U=[],ee=[];if(Z&&U.push(l(ce.Clear.S,{ssSphere:2.5,fontColor:"theme",onMouseOver:h=>{Ce.open(h.currentTarget,$(pe.Mini,{children:[l(_,{icon:Se}),"\u30C9\u30E9\u30C3\u30B0\u3067\u5217\u306E\u9806\u756A\u3092\u5909\u66F4"]}),22)},onMouseLeave:h=>Ce.abort(),onClick:h=>{h.stopPropagation()},children:l(_.QuestionCircle,{})},"drag")),N){let h=l(u.Checker,{value:r.body.every(R=>R.isSelected),onUpdateValue:R=>{o(L=>{let z=a({},L);return z.body.forEach(ae=>{ae.isFilterMatched&&(ae.onCheckerDisabled||(ae.isSelected=!!R))}),z})}},"check");N=="left"?U.push(h):ee.push(h)}return V&&U.push(l(_,{fontSize:"1.mini",fontColor:"theme",opacity:O?"max":"low",transition:"middle",xcss:{transform:O&&r.sort.dir==-1?"rotate(180deg)":"none"},icon:O?Te:De},"sort")),l(D.Cell,p(a(a({isTH:!!S,ssPushable:!!P},X(Q||{})[0]),T),{className:[e.cellClassName,T.className].join(" "),onClick:h=>{T.onClick&&T.onClick(h),e.onCellClick&&e.onCellClick(I,h),V&&o(R=>{let L=a({},R);return L.sort={col:y,dir:O?R.sort.dir*-1:P},u.updateRowMeta(L,e)})},children:$(q.Left,{gap:"1/3",height:1,children:[U,(F=B==null?void 0:B(C))!=null?F:l(K,{flexSizing:0,children:M!=null?M:C}),ee]})}),[y,x.key].join("/"))})}))},Body:t=>{var s,g;let{input:e,val_config:r,set_config:o}=t,n=r.body.filter(i=>i.isVisible),d=+!e.headerless+n.length+ +!!e.footer,c=(s=e.colLength)!=null?s:e.header.length;return n.length?l(Be,{children:n.map((i,b)=>{let{onCheckerDisabled:H,onDraggerDisabled:x}=i,y=b;e.headerless||(y+=1);let m="datagrid-dragger-"+r.datagridID,w=["datagrid",r.datagridID,i.row_id].join("-");return l(ye.DropArea,p(a({jsxElement:D.Row,id:w,ssPushable:!!e.onRowClick||!!i.onRowClick},e.rowStyles),{onClick:S=>{i.onRowClick&&i.onRowClick(S),e.onRowClick&&e.onRowClick(i,S)},dragInfo:{type:m,id:String(i.row_id||""),disabled:!r.draggable,marker:"bottom"},children:e.header.toASC("columnIdx").map((S,C)=>{var U,ee,te,re,oe,le;let M=S.draggable,B=i[S.key];if(!B)return null;let[Y,N]=X(B),Q=N,{isTH:J,sortKey:de,data:P,label:A,onLabelRender:v}=Q,T=G(Q,["isTH","sortKey","data","label","onLabelRender"]),I={rowIdx:y,colIdx:C,topIdx:y,leftIdx:C,rightIdx:c-C-1,bottomIdx:d-y-1,isHeader:!1,isBody:!0,isFooter:!1},Z=f.deepMerge(f.deepCopy(e.cellStyles),fe(I,{}),(U=e.cellStyles)==null?void 0:U.onBody,!I.leftIdx&&((ee=e.cellStyles)==null?void 0:ee.onLeft),!I.rightIdx&&((te=e.cellStyles)==null?void 0:te.onRight),!I.topIdx&&((re=e.cellStyles)==null?void 0:re.onTop),!I.bottomIdx&&((oe=e.cellStyles)==null?void 0:oe.onBottom),Y);e.onCellStyles&&(Z=e.onCellStyles(I,Z||{}));let V=[],O=[];return f.scope(()=>{if(M){if(i.onDraggerDisabled){V.push(i.onDraggerDisabled());return}V.push(l(ce.Clear.S,{tabIndex:-1,isRounded:!0,ssSphere:2.5,fontColor:"6.clear",onPointerDown:k=>{let j=f("#"+w)[0],F=j.cloneNode(!0);F.style.width=j.offsetWidth+"px",ye.Start(m,{dragElement:F,startEvent:k,originId:w,horizontal:!1},h=>be(void 0,null,function*(){if(!h.end||!h.onDropArea)return;let R=[...r.body],L=R.findIndex(W=>W.row_id==i.row_id);if(L==-1)return;let z=R.findIndex(W=>W.row_id==h.id);if(z<L&&z++,L==z)return;let ae=R.splice(L,1)[0];R.splice(z,0,ae),R.forEach((W,Ie)=>{W.draggerIndex=Ie}),e.onDragged&&e.onDragged(R),o(W=>p(a({},W),{body:R}))}))},children:l(q.Center,{gap:"1/4",children:l(_,{icon:Se})})},"drag"))}}),f.scope(()=>{if(!S.checkable)return;let k=l(u.Checker,{override:"force",value:!!i.isSelected,onUpdateValue:j=>{o(F=>p(a({},F),{body:F.body.map(h=>(h.row_id==i.row_id&&(h.isSelected=!!j),h))}))}},"check");i.onCheckerDisabled&&(k=i.onCheckerDisabled()),S.checkable=="left"?V.push(k):O.push(k)}),l(D.Cell,p(a(a({isTH:!!J},X(Z||{})[0]),T),{className:[e.cellClassName,T.className].join(" "),onClick:k=>{T.onClick&&T.onClick(k),e.onCellClick&&e.onCellClick(I,k)},children:$(q.Left,{gap:"1/3",height:1,children:[V,(le=v==null?void 0:v(P))!=null?le:l(K,{flexSizing:0,children:he(A!=null?A:String(P),r.filter.keyword)}),O]})}),[C,S.key].join("/"))})}),[i.row_id,y].join("."))})}):l(D.Row,p(a({},e.rowStyles),{children:l(D.Cell,{colSpan:c,padding:1,children:(g=e.onNoRecordsRender)==null?void 0:g.call(e)})}))},Footer:t=>{var c;let{input:e,val_config:r,set_config:o}=t;if(!e.footer)return null;let n=+!e.headerless+r.body.filter(s=>s.isVisible).length+1,d=(c=e.colLength)!=null?c:e.header.length;return l(D.Row,p(a({},e.rowStyles),{children:e.header.toASC("columnIdx").map((s,g)=>{var Y,N,J,de,P,A,v;let i=e.footer[s.key];if(!i)return null;f.isRecord(i)||(i={data:i});let[b,H]=X(i),B=H,{isTH:x,data:y,label:m,onLabelRender:w}=B,S=G(B,["isTH","data","label","onLabelRender"]),C={rowIdx:n-1,colIdx:g,topIdx:n-1,leftIdx:g,rightIdx:d-g-1,bottomIdx:0,isHeader:!1,isBody:!1,isFooter:!0},M=f.deepMerge(f.deepCopy(e.cellStyles),fe(C,{}),(Y=e.cellStyles)==null?void 0:Y.onBody,(N=e.cellStyles)==null?void 0:N.onFooter,!C.leftIdx&&((J=e.cellStyles)==null?void 0:J.onLeft),!C.rightIdx&&((de=e.cellStyles)==null?void 0:de.onRight),!C.topIdx&&((P=e.cellStyles)==null?void 0:P.onTop),!C.bottomIdx&&((A=e.cellStyles)==null?void 0:A.onBottom),b);return e.onCellStyles&&(M=e.onCellStyles(C,M||{})),l(D.Cell,p(a(a({isTH:!!x},X(M||{})[0]),S),{className:[e.cellClassName,S.className].join(" "),onClick:T=>{S.onClick&&S.onClick(T),e.onCellClick&&e.onCellClick(C,T)},children:l(K,{flexSizing:0,children:(v=w==null?void 0:w(y))!=null?v:he(m!=null?m:String(y),r.filter.keyword)})}),[g,s.key].join("/"))})}))}},fe=(t,e)=>{let r=a({},e);return t.topIdx||(r.borderTop="unset"),t.bottomIdx||(r.borderBottom="unset"),t.rightIdx||(r.borderRight="unset"),t.leftIdx||(r.borderLeft="unset"),t.topIdx||(t.leftIdx||(r.borderTopLeftRadius="inherit"),t.rightIdx||(r.borderTopRightRadius="inherit")),t.bottomIdx||(t.leftIdx||(r.borderBottomLeftRadius="inherit"),t.rightIdx||(r.borderBottomRightRadius="inherit")),r},Me=t=>(t=a({datagridID:ge(),tone:"border",maxRows:100,onNoRecordsRender:()=>l(q.Center,{children:l(pe.Mini,{fontColor:"4.thin",children:"(\u30C7\u30FC\u30BF\u306A\u3057)"})})},t),t.rowStyles=a({backgroundColor:"layer.0"},t.rowStyles),t.cellStyles=a(p(a({},f.scope(()=>{if(!t.tone)return{};let e={};return f.isOneOf(t.tone,"border","border.horizontal")&&(e.borderBottom="2.normal"),f.isOneOf(t.tone,"border","border.vertical")&&(e.borderRight="2.normal"),e})),{position:"relative",padding:["1/3","2/3"],transition:"short"}),t.cellStyles),t.tone&&(t=a({border:!0,borderRadius:"2.tone.secondary",backgroundColor:"layer.1"},t)),t.header=u.toSafetyHeader(t.header||[]),t.header.forEach((e,r)=>{var o;e.sortable=(o=e.sortable)!=null?o:1,e.checkable===!0&&(e.checkable="left")}),l(u.index,a({},t))),ue={getBodyRows:t=>ne.get("rows-"+t)||[],toSafetyBody:u.toSafetyBody,reset:t=>{var e;(e=ne.get("reset-"+t))==null||e()},refreshBody:t=>{var e;(e=ne.get("refresh-"+t))==null||e()},reservedKeys:u.reservedKeys,Table:t=>l(K,p(a({htmlTag:"table",borderRadius:"inherit"},t),{border:t.border})),Head:t=>l(K,a({htmlTag:"thead",borderRadius:"inherit"},t)),Body:t=>l(K,a({htmlTag:"tbody",borderRadius:"inherit"},t)),Row:t=>l(K,a({htmlTag:"tr",borderRadius:"inherit"},t)),TH:t=>l(K,a({htmlTag:"th"},t)),TD:t=>l(K,a({htmlTag:"td"},t)),Cell:t=>{let o=t,{isTH:e}=o,r=G(o,["isTH"]);return e?l(ue.TH,a({},r)):l(ue.TD,a({},r))},RightIndicator:{data:"",label:l(q.Right,{children:l(_.AngleRight,{fontColor:"theme",fontSize:"3.paragraph"})})},SearchInput:t=>{let d=t,{datagridID:e}=d,r=G(d,["datagridID"]),o=ie.catch(t.datagridID);if(!o)return console.warn("[DataGrid] SearchInput must be used inside DataGrid."),null;let{val_config:n}=o;return l(E.TextField,p(a({label:"\u691C\u7D22...",clearButton:!0,padding:["1/2","2/3"],rightIcon:l(E.RightIcon,{ssSphere:2,fontColor:"5.translucent",right:"2/3",children:l(_.Search,{})}),value:n.filter.keyword},r),{onUpdateValidValue:(...c)=>{r.onUpdateValidValue&&r.onUpdateValidValue(...c),o.remoteUpdate.searchKey(c[0])}}))},Info:t=>{let e=ie.catch(t.datagridID);if(!e)return null;let{val_config:r}=e,o=t.totalCount||r.body.length,n=r.body.filter(c=>c.isFilterMatched).length,d=n.toRate(o,1)||0;return $(we,{verticalAlign:"baseline",gap:"1/2",fontSize:"1.mini",fontColor:"3.blur",children:[l(ke,{fontSize:"4.thirdTitle",fontColor:"theme",children:n.toLocaleString()}),"/ ",o.toLocaleString(),"\u4EF6 (",d,"%)"]})},Paging:t=>{let s=t,{datagridID:e}=s,r=G(s,["datagridID"]),o=ie.catch(e);if(!o)return null;let{val_config:n}=o,d=[];for(let g=0;g<n.paging.total;g++)d.push({value:g+1,label:(g+1).toString()});const c=g=>{let i=Math.min(Math.max(1,g),n.paging.total),b=a({},n);b.paging.current=i,o.remoteUpdate.paging(i)};return l(E.Select,p(a({emptySelect:!1,padding:["1/3","2/3"],override:"force",gap:0},r),{leftIcon:l(E.LeftIcon,{xcss:{left:2,pointerEvents:"all"},children:l(ce.Sub.S,{color:"cloud",fontColor:"4.thin",ssSquare:2.5,unitWidth:2,onClick:()=>{if(n.paging.current==1){c(n.paging.total);return}c(n.paging.current-1)},children:l(_.ChevronLeft,{})})}),rightIcon:l(E.RightIcon,{xcss:{right:2,pointerEvents:"all"},children:l(ce.Sub.S,{color:"cloud",fontColor:"4.thin",ssSquare:2.5,unitWidth:2,onClick:()=>{if(n.paging.current==n.paging.total){c(1);return}c(n.paging.current+1)},children:l(_.ChevronRight,{})})}),options:d.map(g=>({value:g.value||0,label:$(q.Left,{gap:"1/3",verticalAlign:"baseline",children:[g.label,$(pe.Micro,{fontColor:"4.thin",children:["/ ",n.paging.total]})]})})),value:n.paging.current,onUpdateValidValue:g=>{c(g)}}))},RowCount:t=>{let i=t,{datagridID:e}=i,r=G(i,["datagridID"]),o=ie.catch(e);if(!o)return null;let{val_config:n}=o,d=n.body.filter(b=>b.isFilterMatched).length,c=n.paging.rows,s=0,g=t.options.map(b=>(s|=+(b==c),{value:b,label:b.toString()}));return s||g.push({value:c,label:c.toString()}),l(q.Center,{gap:"1/2",children:l(E.Select,p(a({emptySelect:!1,override:"force",padding:"1/3",paddingLeft:3,paddingRight:2,pickerStyles:{xcss:{minWidth:12*9}},pickerPosition:4,leftIcon:l(E.LeftIcon,{fontSize:"0.xs",fontColor:"4.thin",xcss:{left:6},children:"\u8868\u793A"}),rightIcon:l(E.RightIcon,{fontSize:"0.xs",fontColor:"4.thin",xcss:{right:6},children:"\u4EF6"})},r),{value:n.paging.rows,options:g.toASC("value"),onUpdateValidValue:b=>{o.remoteUpdate.maxRow(Number(b))}}))})}},D=Object.assign(Me,ue);export{D as DataGrid,D as default,fe as onDefaultCellStyles};
+import{b as n,c as p,d as G,e as be}from"../../chunk-C5N2D3ZX.js";import{Fragment as Be,jsx as o,jsxs as $}from"react/jsx-runtime";import u,{useStore as ne,UUID as ge}from"jmini";import me,{useState as Re,useEffect as se}from"react";import{ExtractStyles as X,GenerateHTMLProps as xe,dragEffect as ye,useRemote as ie}from"../../@utils";import{faArrowUp as Te}from"@fortawesome/free-solid-svg-icons/faArrowUp";import{faUpDown as De}from"@fortawesome/free-solid-svg-icons/faUpDown";import{Box as K,Flex as we,FAI as _,Span as ke}from"../../atoms";import{Literal as pe,Row as q,MarkerPen as he}from"../../mols";import{Button as ce}from"../Button";import E from"../Input";import{TableClasses as Ke}from"../../@styles/componentClasses";import{faGripVertical as Se}from"@fortawesome/free-solid-svg-icons/faGripVertical";import{Tips as Ce}from"../Tips";const b={reservedKeys:["row_id","onCheckerDisabled","onDraggerDisabled","columnIdx","isSelected","isFilterMatched","isVisible","draggerIndex","onRowClick"],toSafetyHeader:t=>{let e=!!t.some(l=>l.draggable);return(t==null?void 0:t.map((l,a)=>{var d;return u.isRecord(l)||(l={key:l}),u.isString(l.key)&&(l.key=l.key.replace(/[.\s]/g,"_")),e&&(l.sortable=0,l.filterable=!1),l.columnIdx=(d=l.columnIdx)!=null?d:a,l}).toASC("columnIdx"))||[]},toSafetyBody:t=>t==null?void 0:t.map((e,r)=>{var a;let l={};return Object.entries(e).forEach(([d,c])=>{var i,s;if(u.isOneOf(d,...b.reservedKeys))return;let g=c;u.isNullish(g)||(u.isRecord(g)||(g={data:g}),u.isString(d)&&(d=d.replace(/[.\s]/g,"_")),g.sortKey=(s=(i=g.sortKey)!=null?i:String(g.data))!=null?s:"",l[d]=g)}),l=p(n({},l),{row_id:(a=e.row_id)!=null?a:r,onRowClick:e.onRowClick,isSelected:!!e.isSelected,isFilterMatched:!0,isVisible:!0,onCheckerDisabled:e.onCheckerDisabled,onDraggerDisabled:e.onDraggerDisabled,draggerIndex:r}),l}),toSafetyData:t=>{var l,a;let{header:e=[]}=t,r={datagridID:t.datagridID||ge(),sessionID:ge(),body:b.toSafetyBody(t.body||[]),filter:{keyword:t.defaultSearchKey||"",current:[]},sort:{col:-1,dir:1},paging:{rows:t.maxRows||100,total:1,current:1},draggable:!!e.some(d=>d.draggable)};{let d=e==null?void 0:e.findIndex(c=>c.defSort);d!==-1&&(r.sort.col=d,r.sort.dir=(a=(l=e[d])==null?void 0:l.sortable)!=null?a:1)}return r.draggable&&(r.sort.col=-1,r.sort.dir=0),b.updateRowMeta(r,t)},updateRowMeta:(t,e)=>{var l;let r=n({},t);if(r.sort.col>=0&&r.sort.dir){let a=((l=e.header[r.sort.col])==null?void 0:l.key)||"";r.sort.dir==1?r.body.toASC(a+".sortKey"):r.body.toDESC(a+".sortKey")}{let a=String(r.filter.keyword)||"";r.body.forEach(d=>{if(d.isFilterMatched=!0,!a)return;let c=e.header.some(g=>{var f;let i=d[g.key];return!i||!i.sortKey?!1:!!((f=String(i.sortKey||i.data))!=null&&f.match(new RegExp(a.escapeRegExChar(),"i")))});d.isFilterMatched=c})}{let a=r.paging.rows;r.paging.total=Math.ceil(r.body.filter(i=>i.isFilterMatched).length/a);let d=a*(r.paging.current-1),c=d+a,g=0;r.body.forEach(i=>{i.isVisible=!1,i.isFilterMatched&&(i.isVisible=g>=d&&g<c,g++)})}return r.draggable&&r.body.toASC("draggerIndex"),r},index:t=>{var s,f,H,x;let[e,r]=Re(()=>b.toSafetyData(t));se(()=>{ne.set({["reset-"+e.datagridID]:()=>{r(b.toSafetyData(t))},["refresh-"+e.datagridID]:()=>{r(y=>b.updateRowMeta(p(n({},y),{body:b.toSafetyBody(t.body)}),t))}})},[t]),se(()=>{ne.set({["rows-"+e.datagridID]:e.body}),ie.bridge(e.datagridID,{val_config:e,remoteUpdate:{paging:y=>{r(m=>b.updateRowMeta(p(n({},m),{paging:p(n({},m.paging),{current:Math.max(1,Math.min(m.paging.total,y))})}),t))},maxRow:y=>{r(m=>b.updateRowMeta(p(n({},m),{paging:p(n({},m.paging),{rows:y,current:1})}),t))},searchKey:y=>{u.interval.once(()=>{r(m=>{let w=p(n({},m),{paging:p(n({},m.paging),{current:1}),filter:p(n({},m.filter),{keyword:String(y||"").trim()})});return b.updateRowMeta(w,t)})},300,"InputSearchTime")}}})},[e]);const l=me.useRef(!1);se(()=>{if(t.onSelected){if(!l.current){l.current=!0;return}t.onSelected(e.body.filter(y=>y.isSelected))}},[(s=e==null?void 0:e.body)==null?void 0:s.filter(y=>y.isSelected).length]);const a=me.useRef(!1);se(()=>{if(t.onSorted){if(!a.current){a.current=!0;return}t.onSorted(e.sort.col,e.sort.dir)}},[(f=e==null?void 0:e.sort)==null?void 0:f.col,(H=e==null?void 0:e.sort)==null?void 0:H.dir]);let d={input:t,val_config:e,set_config:r},{className:c,style:g}=xe(t),i=(x=t.colLength)!=null?x:t.header.length;return o(K,{className:c,style:g,children:o(D.Table,{className:Ke("DataGrid"),borderRadius:"inherit",children:$(D.Body,{children:[o(b.Header,n({},d)),o(b.Body,n({},d)),o(b.Footer,n({},d))]})},[i,...t.header.map(y=>y.key),e.sessionID].join("."))})},Checker:t=>o(K,{flexCenter:!0,onClick:e=>{e.stopPropagation()},children:o(E.Checker,p(n({wrapStyles:{display:"inlineBlock"},cellStyles:{gap:0}},t),{label:!1}))}),Header:t=>{var i,s,f,H;let{input:e,val_config:r,set_config:l}=t;if(e.headerless)return null;let a="datagrid-dragger-"+r.datagridID,d=["datagrid",r.datagridID,""].join("-"),c=1+r.body.filter(x=>x.isVisible).length+ +!!e.footer,g=(i=e.colLength)!=null?i:e.header.length;return o(ye.DropArea,p(n({jsxElement:D.Row,id:d},e.rowStyles),{dragInfo:{type:a,id:String(((H=(f=(s=r.body)==null?void 0:s.filter(x=>x.isFilterMatched))==null?void 0:f[0])==null?void 0:H.draggerIndex)||0),marker:"bottom"},children:e.header.toASC("columnIdx").map((x,y)=>{var re,oe,le,k,j,F;let[m,w]=X(x),te=w,{isTH:S,key:C,label:M,onLabelRender:B,columnIdx:Y,checkable:N,draggable:J,defSort:de,sortable:P,filterable:A,isHidden:v}=te,T=G(te,["isTH","key","label","onLabelRender","columnIdx","checkable","draggable","defSort","sortable","filterable","isHidden"]);if(v)return null;let I={rowIdx:0,colIdx:y,topIdx:0,leftIdx:y,rightIdx:g-y-1,bottomIdx:c-1,isHeader:!0,isBody:!1,isFooter:!1},Z=J,V=P!=0,O=y==r.sort.col,Q=u.deepMerge(u.deepCopy(e.cellStyles),fe(I,{}),(re=e.cellStyles)==null?void 0:re.onHeader,!I.leftIdx&&((oe=e.cellStyles)==null?void 0:oe.onLeft),!I.rightIdx&&((le=e.cellStyles)==null?void 0:le.onRight),!I.topIdx&&((k=e.cellStyles)==null?void 0:k.onTop),!I.bottomIdx&&((j=e.cellStyles)==null?void 0:j.onBottom),m);e.onCellStyles&&(Q=e.onCellStyles(I,Q||{}));let U=[],ee=[];if(Z&&U.push(o(ce.Clear.S,{ssSphere:2.5,fontColor:"theme",onMouseOver:h=>{Ce.open(h.currentTarget,$(pe.Mini,{children:[o(_,{icon:Se}),"\u30C9\u30E9\u30C3\u30B0\u3067\u5217\u306E\u9806\u756A\u3092\u5909\u66F4"]}),22)},onMouseLeave:h=>Ce.abort(),onClick:h=>{h.stopPropagation()},children:o(_.QuestionCircle,{})},"drag")),N){let h=o(b.Checker,{value:r.body.every(R=>R.isSelected),onUpdateValue:R=>{l(L=>{let z=n({},L);return z.body.forEach(ae=>{ae.isFilterMatched&&(ae.onCheckerDisabled||(ae.isSelected=!!R))}),z})}},"check");N=="left"?U.push(h):ee.push(h)}return V&&U.push(o(_,{fontSize:"1.mini",fontColor:"theme",opacity:O?"max":"low",transition:"middle",xcss:{transform:O&&r.sort.dir==-1?"rotate(180deg)":"none"},icon:O?Te:De},"sort")),o(D.Cell,p(n(n({isTH:!!S,ssPushable:!!P},X(Q||{})[0]),T),{className:[e.cellClassName,T.className].join(" "),onClick:h=>{T.onClick&&T.onClick(h),e.onCellClick&&e.onCellClick(I,h),V&&l(R=>{let L=n({},R);return L.sort={col:y,dir:O?R.sort.dir*-1:P},b.updateRowMeta(L,e)})},children:$(q.Left,{gap:"1/3",height:1,children:[U,(F=B==null?void 0:B(C))!=null?F:o(K,{flexSizing:0,children:M!=null?M:C}),ee]})}),[y,x.key].join("/"))})}))},Body:t=>{var g,i;let{input:e,val_config:r,set_config:l}=t,a=r.body.filter(s=>s.isVisible),d=+!e.headerless+a.length+ +!!e.footer,c=(g=e.colLength)!=null?g:e.header.length;return a.length?o(Be,{children:a.map((s,f)=>{let{onCheckerDisabled:H,onDraggerDisabled:x}=s,y=f;e.headerless||(y+=1);let m="datagrid-dragger-"+r.datagridID,w=["datagrid",r.datagridID,s.row_id].join("-");return o(ye.DropArea,p(n({jsxElement:D.Row,id:w,ssPushable:!!e.onRowClick||!!s.onRowClick},e.rowStyles),{onClick:S=>{s.onRowClick&&s.onRowClick(S),e.onRowClick&&e.onRowClick(s,S)},dragInfo:{type:m,id:String(s.row_id||""),disabled:!r.draggable,marker:"bottom"},children:e.header.toASC("columnIdx").map((S,C)=>{var U,ee,te,re,oe,le;let M=S.draggable,B=s[S.key];if(!B)return null;let[Y,N]=X(B),Q=N,{isTH:J,sortKey:de,data:P,label:A,onLabelRender:v}=Q,T=G(Q,["isTH","sortKey","data","label","onLabelRender"]),I={rowIdx:y,colIdx:C,topIdx:y,leftIdx:C,rightIdx:c-C-1,bottomIdx:d-y-1,isHeader:!1,isBody:!0,isFooter:!1},Z=u.deepMerge(u.deepCopy(e.cellStyles),fe(I,{}),(U=e.cellStyles)==null?void 0:U.onBody,!I.leftIdx&&((ee=e.cellStyles)==null?void 0:ee.onLeft),!I.rightIdx&&((te=e.cellStyles)==null?void 0:te.onRight),!I.topIdx&&((re=e.cellStyles)==null?void 0:re.onTop),!I.bottomIdx&&((oe=e.cellStyles)==null?void 0:oe.onBottom),Y);e.onCellStyles&&(Z=e.onCellStyles(I,Z||{}));let V=[],O=[];return u.scope(()=>{if(M){if(s.onDraggerDisabled){V.push(s.onDraggerDisabled());return}V.push(o(ce.Clear.S,{tabIndex:-1,isRounded:!0,ssSphere:2.5,fontColor:"6.clear",onPointerDown:k=>{let j=u("#"+w)[0],F=j.cloneNode(!0);F.style.width=j.offsetWidth+"px",ye.Start(m,{dragElement:F,startEvent:k,originId:w,horizontal:!1},h=>be(void 0,null,function*(){if(!h.end||!h.onDropArea)return;let R=[...r.body],L=R.findIndex(W=>W.row_id==s.row_id);if(L==-1)return;let z=R.findIndex(W=>W.row_id==h.id);if(z<L&&z++,L==z)return;let ae=R.splice(L,1)[0];R.splice(z,0,ae),R.forEach((W,Ie)=>{W.draggerIndex=Ie}),e.onDragged&&e.onDragged(R),l(W=>p(n({},W),{body:R}))}))},children:o(q.Center,{gap:"1/4",children:o(_,{icon:Se})})},"drag"))}}),u.scope(()=>{if(!S.checkable)return;let k=o(b.Checker,{override:"force",value:!!s.isSelected,onUpdateValue:j=>{l(F=>p(n({},F),{body:F.body.map(h=>(h.row_id==s.row_id&&(h.isSelected=!!j),h))}))}},"check");s.onCheckerDisabled&&(k=s.onCheckerDisabled()),S.checkable=="left"?V.push(k):O.push(k)}),o(D.Cell,p(n(n({isTH:!!J},X(Z||{})[0]),T),{className:[e.cellClassName,T.className].join(" "),onClick:k=>{T.onClick&&T.onClick(k),e.onCellClick&&e.onCellClick(I,k)},children:$(q.Left,{gap:"1/3",height:1,children:[V,(le=v==null?void 0:v(P))!=null?le:o(K,{flexSizing:0,children:he(A!=null?A:String(P),r.filter.keyword)}),O]})}),[C,S.key].join("/"))})}),[s.row_id,y].join("."))})}):o(D.Row,p(n({},e.rowStyles),{children:o(D.Cell,{colSpan:c,padding:1,children:(i=e.onNoRecordsRender)==null?void 0:i.call(e)})}))},Footer:t=>{var c;let{input:e,val_config:r,set_config:l}=t;if(!e.footer)return null;let a=+!e.headerless+r.body.filter(g=>g.isVisible).length+1,d=(c=e.colLength)!=null?c:e.header.length;return o(D.Row,p(n({},e.rowStyles),{children:e.header.toASC("columnIdx").map((g,i)=>{var Y,N,J,de,P,A,v;let s=e.footer[g.key];if(!s)return null;u.isRecord(s)||(s={data:s});let[f,H]=X(s),B=H,{isTH:x,data:y,label:m,onLabelRender:w}=B,S=G(B,["isTH","data","label","onLabelRender"]),C={rowIdx:a-1,colIdx:i,topIdx:a-1,leftIdx:i,rightIdx:d-i-1,bottomIdx:0,isHeader:!1,isBody:!1,isFooter:!0},M=u.deepMerge(u.deepCopy(e.cellStyles),fe(C,{}),(Y=e.cellStyles)==null?void 0:Y.onBody,(N=e.cellStyles)==null?void 0:N.onFooter,!C.leftIdx&&((J=e.cellStyles)==null?void 0:J.onLeft),!C.rightIdx&&((de=e.cellStyles)==null?void 0:de.onRight),!C.topIdx&&((P=e.cellStyles)==null?void 0:P.onTop),!C.bottomIdx&&((A=e.cellStyles)==null?void 0:A.onBottom),f);return e.onCellStyles&&(M=e.onCellStyles(C,M||{})),o(D.Cell,p(n(n({isTH:!!x},X(M||{})[0]),S),{className:[e.cellClassName,S.className].join(" "),onClick:T=>{S.onClick&&S.onClick(T),e.onCellClick&&e.onCellClick(C,T)},children:o(K,{flexSizing:0,children:(v=w==null?void 0:w(y))!=null?v:he(m!=null?m:String(y),r.filter.keyword)})}),[i,g.key].join("/"))})}))}},fe=(t,e)=>{let r=n({},e);return t.topIdx||(r.borderTop="unset"),t.bottomIdx||(r.borderBottom="unset"),t.rightIdx||(r.borderRight="unset"),t.leftIdx||(r.borderLeft="unset"),t.topIdx||(t.leftIdx||(r.borderTopLeftRadius="inherit"),t.rightIdx||(r.borderTopRightRadius="inherit")),t.bottomIdx||(t.leftIdx||(r.borderBottomLeftRadius="inherit"),t.rightIdx||(r.borderBottomRightRadius="inherit")),r},Me=t=>(t=n({datagridID:ge(),tone:"border",maxRows:100,onNoRecordsRender:()=>o(q.Center,{children:o(pe.Mini,{fontColor:"4.thin",children:"(\u30C7\u30FC\u30BF\u306A\u3057)"})})},t),t.rowStyles=n({backgroundColor:"layer.0"},t.rowStyles),t.cellStyles=n(p(n({},u.scope(()=>{if(!t.tone)return{};let e={};return u.isOneOf(t.tone,"border","border.horizontal")&&(e.borderBottom="2.normal"),u.isOneOf(t.tone,"border","border.vertical")&&(e.borderRight="2.normal"),e})),{position:"relative",padding:["1/3","2/3"],transition:"short"}),t.cellStyles),t.tone&&(t=n({border:!0,borderRadius:"2.tone.secondary",backgroundColor:"layer.1"},t)),t.header=b.toSafetyHeader(t.header||[]),t.header.forEach((e,r)=>{var l;e.sortable=(l=e.sortable)!=null?l:1,e.checkable===!0&&(e.checkable="left")}),o(b.index,n({},t))),ue={getBodyRows:t=>ne.get("rows-"+t)||[],toSafetyBody:b.toSafetyBody,reset:t=>{var e;(e=ne.get("reset-"+t))==null||e()},refreshBody:t=>{var e;(e=ne.get("refresh-"+t))==null||e()},reservedKeys:b.reservedKeys,Table:t=>o(K,p(n({htmlTag:"table",borderRadius:"inherit"},t),{border:t.border})),Head:t=>o(K,n({htmlTag:"thead",borderRadius:"inherit"},t)),Body:t=>o(K,n({htmlTag:"tbody",borderRadius:"inherit"},t)),Row:t=>o(K,n({htmlTag:"tr",borderRadius:"inherit"},t)),TH:t=>o(K,n({htmlTag:"th"},t)),TD:t=>o(K,n({htmlTag:"td"},t)),Cell:t=>{let l=t,{isTH:e}=l,r=G(l,["isTH"]);return e?o(ue.TH,n({},r)):o(ue.TD,n({},r))},RightIndicator:{data:"",label:o(q.Right,{children:o(_.AngleRight,{fontColor:"theme",fontSize:"3.paragraph"})})},SearchInput:t=>{let d=t,{datagridID:e}=d,r=G(d,["datagridID"]),l=ie.catch(t.datagridID);if(!l)return console.warn("[DataGrid] SearchInput must be used inside DataGrid."),null;let{val_config:a}=l;return o(E.TextField,p(n({label:"\u691C\u7D22...",clearButton:!0,padding:["1/2","2/3"],rightIcon:o(E.RightIcon,{ssSphere:2,fontColor:"5.translucent",right:"2/3",children:o(_.Search,{})}),value:a.filter.keyword},r),{onUpdateValidValue:(...c)=>{r.onUpdateValidValue&&r.onUpdateValidValue(...c),l.remoteUpdate.searchKey(c[0])}}))},Info:t=>{let e=ie.catch(t.datagridID);if(!e)return null;let{val_config:r}=e,l=t.totalCount||r.body.length,a=r.body.filter(c=>c.isFilterMatched).length,d=a.toRate(l,1)||0;return $(we,{verticalAlign:"baseline",gap:"1/2",fontSize:"1.mini",fontColor:"3.blur",children:[o(ke,{fontSize:"4.thirdTitle",fontColor:"theme",children:a.toLocaleString()}),"/ ",l.toLocaleString(),"\u4EF6 (",d,"%)"]})},Paging:t=>{let g=t,{datagridID:e}=g,r=G(g,["datagridID"]),l=ie.catch(e);if(!l)return null;let{val_config:a}=l,d=[];for(let i=0;i<a.paging.total;i++)d.push({value:i+1,label:(i+1).toString()});const c=i=>{let s=Math.min(Math.max(1,i),a.paging.total),f=n({},a);f.paging.current=s,l.remoteUpdate.paging(s)};return o(E.Select,p(n({emptySelect:!1,padding:["1/3","2/3"],override:"force",gap:0},r),{leftIcon:o(E.LeftIcon,{xcss:{left:2,pointerEvents:"all"},children:o(ce.Sub.S,{color:"cloud",fontColor:"4.thin",ssSquare:2.5,unitWidth:2,onClick:()=>{if(a.paging.current==1){c(a.paging.total);return}c(a.paging.current-1)},children:o(_.ChevronLeft,{})})}),rightIcon:o(E.RightIcon,{xcss:{right:2,pointerEvents:"all"},children:o(ce.Sub.S,{color:"cloud",fontColor:"4.thin",ssSquare:2.5,unitWidth:2,onClick:()=>{if(a.paging.current==a.paging.total){c(1);return}c(a.paging.current+1)},children:o(_.ChevronRight,{})})}),options:d.map(i=>({value:i.value||0,label:$(q.Left,{gap:"1/3",verticalAlign:"baseline",children:[i.label,$(pe.Micro,{fontColor:"4.thin",children:["/ ",a.paging.total]})]})})),value:a.paging.current,onUpdateValidValue:i=>{c(i)}}))},RowCount:t=>{let s=t,{datagridID:e}=s,r=G(s,["datagridID"]),l=ie.catch(e);if(!l)return null;let{val_config:a}=l,d=a.body.filter(f=>f.isFilterMatched).length,c=a.paging.rows,g=0,i=t.options.map(f=>(g|=+(f==c),{value:f,label:f.toString()}));return g||i.push({value:c,label:c.toString()}),o(q.Center,{gap:"1/2",children:o(E.Select,p(n({emptySelect:!1,override:"force",padding:"1/3",paddingLeft:3,paddingRight:2,pickerStyles:{xcss:{minWidth:12*9}},pickerPosition:4,leftIcon:o(E.LeftIcon,{fontSize:"0.xs",fontColor:"4.thin",xcss:{left:6},children:"\u8868\u793A"}),rightIcon:o(E.RightIcon,{fontSize:"0.xs",fontColor:"4.thin",xcss:{right:6},children:"\u4EF6"})},r),{value:a.paging.rows,options:i.toASC("value"),onUpdateValidValue:f=>{l.remoteUpdate.maxRow(Number(f))}}))})}},D=Object.assign(Me,ue);export{D as DataGrid,D as default,fe as onDefaultCellStyles};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "amotify",
-  "version": "0.3.20",
+  "version": "0.3.21",
   "description": "UI Component for React,NextJS,esbuild",
   "scripts": {
     "start": "run-p clean build:*",