amotify 0.2.171 → 0.2.173

package/dist/fn/Button.js

@@ -1 +1 @@
-import{b as s,c as i,d as B,e as z}from"../chunk-C5N2D3ZX.js";import{jsx as p}from"react/jsx-runtime";import L,{UUID as P}from"jmini";import{pageRouter as k,ReadStyleSet as R}from"../@utils";import{Input as E}from".";import{Box as I}from"../atoms";import{ButtonClasses as c}from"../@styles/componentClasses";const x={Size:(l,t,o,n)=>{let e={fontSize:"inherit"};return o=o||"R",t=="plain"?{}:(t=="link"?o=="xsmall"?e.fontSize="0.xs":o=="small"?e.fontSize="1.mini":o=="regular"||o=="large"&&(e.fontSize="3.paragraph"):e=s({borderRadius:"2.tone.secondary",transition:"middle",position:"relative",textAlign:"center"},e),o=="xsmall"?e=i(s({},e),{padding:["1/3","2/3"],fontSize:"0.xs",borderRadius:"3.tone.tertiary"}):o=="small"?e=i(s({},e),{padding:["1/2","3/4"],fontSize:"1.mini",borderRadius:"3.tone.tertiary"}):o=="regular"?(e.padding=["3/4",1],t=="prime"&&(e.padding=["3/4",1.5])):o=="large"&&(e.padding=[1,2],e.fontSize="3.paragraph",e.isSemiBoldFont=!0),e)},Tone:(l,t,o,n)=>{let e={display:"inlineBlock",fontWeight:"inherit",fontColor:"inherit",border:"unset"};return t=="plain"||(t=="link"?(e.fontColor="theme",e.textAlign="left",e.backgroundColor="trans"):t=="normal"?e=i(s({},e),{backgroundColor:"trans"}):t=="border"?e=i(s({},e),{backgroundColor:"layer.1",border:"2.normal",borderStyle:"solid",boxShadow:"0.min"}):t=="prime"?(e=i(s({},e),{isSemiBoldFont:!0,fontColor:"white",backgroundColor:n,boxShadow:"0.normal",ssEffectsOnActive:["shrink","push","ripple.white"]}),n=="white"&&(e=i(s({},e),{fontColor:"theme",ssEffectsOnActive:["shrink","push","ripple.cloud"]}))):t=="sub"?e=i(s({},e),{fontColor:n,ssEffectsOnActive:["shrink","ripple.cloud"]}):t=="clear"?e=i(s({},e),{fontColor:n,backgroundColor:"trans",ssEffectsOnActive:["shrink","ripple.cloud"]}):t=="fillToBorder"?e=i(s({},e),{boxShadow:"0.normal",border:"2.normal",borderWidth:2,borderColor:n,fontColor:n,backgroundColor:n}):t=="borderToFill"&&(e=i(s({},e),{fontColor:n,boxShadow:"0.normal",border:"2.normal",borderWidth:2,borderColor:n,backgroundColor:n})),n=="cloud"&&(e.fontColor="2.normal"),t!="link"&&(e=s({position:"relative",ssEffectsOnActive:["shrink","push"]},e))),e}},F=l=>{let t=R(s({isLocked:!1,isActive:!1,isActiveStyles:{},isActiveClassName:"",tabIndex:0,className:"",color:"theme",tone:"border","aria-label":P()},l)),o=t.seed;{let{isLocked:y=!1,isActive:m=!1,isActiveStyles:h={},isActiveClassName:C="",tone:r="border",size:u="regular",color:a="theme",className:T=""}=t;t=s(s(s({},x.Size(l.seed,r,u,a)),x.Tone(l.seed,r,u,a)),t),t.className=[T,c("Wrap"),c("isNeutral_"+!m),c("isLocked_"+y),c("Tone_"+r),c("Color_"+a),c("Tone_"+r+"_Color_"+a)].join(" "),m&&(t=s(s({className:[t.className,C].join(" ")},t),h))}if(o=="button"){let n=t,{isLocked:y,isActive:m,isActiveClassName:h,isActiveStyles:C,submitOption:r,onClick:u}=n,a=B(n,["isLocked","isActive","isActiveClassName","isActiveStyles","submitOption","onClick"]);return r&&(r=s({acceptInvalidForm:!1,submitDelegationKey:"auxEnter"},r),a=i(s({},a),{"data-form-submit-button":r.formName,"data-sdfike":L.flatArray(r.submitDelegationKey).join(",")})),p(I,i(s({htmlTag:"button",fontHeight:"inherit"},a),{onClick:T=>z(void 0,null,function*(){if(y||(u&&u(T),!r))return;let S=yield E.CollectForm(r.formName);!r.acceptInvalidForm&&!S.valid||r.callback(S.data,S.valid)})}))}else if(o=="label"){let e=t,{isLocked:y,isActive:m,isActiveClassName:h,isActiveStyles:C,onClick:r}=e,u=B(e,["isLocked","isActive","isActiveClassName","isActiveStyles","onClick"]);return p(I,i(s({htmlTag:"label"},u),{onClick:a=>{y||r&&r(a)}}))}else if(o=="anchor"){let M=t,{isLocked:y,isActive:m,isActiveClassName:h,isActiveStyles:C,onClick:r,href:u="",newTab:a,sync:T,shiftQueryParams:S}=M,A=B(M,["isLocked","isActive","isActiveClassName","isActiveStyles","onClick","href","newTab","sync","shiftQueryParams"]);return p(I,i(s({htmlTag:"button"},A),{onClick:f=>{if(y)return;if(r)return r(f);let v=f.ctrlKey||f.metaKey,N=a||!!v,b=u;if(S&&(b+=location.search),T){k.pushSync(b);return}k.push(b,!!N)}}))}return null},d=function(l,t){const o=e=>p(F,s({seed:l,tone:t,size:"regular"},e)),n=o;return n.Plain=e=>p(o,s({size:"plain",tone:t},e)),n.XS=e=>p(o,s({size:"xsmall",tone:t},e)),n.S=e=>p(o,s({size:"small",tone:t},e)),n.R=e=>p(o,s({size:"regular",tone:t},e)),n.L=e=>p(o,s({size:"large",tone:t},e)),n},g=function(l){const o=n=>p(F,s({seed:l,tone:"prime",size:"regular"},n));return o.Plain=d(l,"plain"),o.Link=d(l,"link"),o.Normal=d(l,"normal"),o.Border=d(l,"border"),o.Prime=d(l,"prime"),o.Sub=d(l,"sub"),o.Clear=d(l,"clear"),o.FillToBorder=d(l,"fillToBorder"),o.BorderToFill=d(l,"borderToFill"),o},w=g("button"),D=g("label"),H=g("anchor");export{H as Anchor,w as Button,D as Label};
+import{b as s,c as i,d as B,e as z}from"../chunk-C5N2D3ZX.js";import{jsx as p}from"react/jsx-runtime";import L,{UUID as P}from"jmini";import{pageRouter as k,ReadStyleSet as R}from"../@utils";import{Input as E}from".";import{Box as I}from"../atoms";import{ButtonClasses as c}from"../@styles/componentClasses";const x={Size:(l,t,o,n)=>{let e={fontSize:"inherit"};return o=o||"R",t=="plain"?{}:(t=="link"?o=="xsmall"?e.fontSize="0.xs":o=="small"?e.fontSize="1.mini":o=="regular"||o=="large"&&(e.fontSize="3.paragraph"):e=s({borderRadius:"2.tone.secondary",transition:"middle",position:"relative",textAlign:"center"},e),o=="xsmall"?e=i(s({},e),{padding:["1/3","2/3"],fontSize:"0.xs",borderRadius:"3.tone.tertiary"}):o=="small"?e=i(s({},e),{padding:["1/2","3/4"],fontSize:"1.mini",borderRadius:"3.tone.tertiary"}):o=="regular"?(e.padding=["3/4",1],t=="prime"&&(e.padding=["3/4",1.5])):o=="large"&&(e.padding=[1,2],e.fontSize="3.paragraph",e.isSemiBoldFont=!0),e)},Tone:(l,t,o,n)=>{let e={display:"inlineBlock",fontWeight:"inherit",fontColor:"inherit",border:"unset"};return t=="plain"||(t=="link"?(e.fontColor="theme",e.textAlign="left",e.backgroundColor="trans"):t=="normal"?e=i(s({},e),{backgroundColor:"trans"}):t=="border"?e=i(s({},e),{backgroundColor:"layer.1",border:"2.normal",borderStyle:"solid",boxShadow:"0.min"}):t=="prime"?(e=i(s({},e),{isSemiBoldFont:!0,fontColor:"white",backgroundColor:n,boxShadow:"0.normal",ssEffectsOnActive:["shrink","push","ripple.white"]}),n=="white"&&(e=i(s({},e),{fontColor:"theme",ssEffectsOnActive:["shrink","push","ripple.cloud"]}))):t=="sub"?e=i(s({},e),{fontColor:n,ssEffectsOnActive:["shrink","ripple.cloud"]}):t=="clear"?e=i(s({},e),{fontColor:n,backgroundColor:"trans",ssEffectsOnActive:["shrink","ripple.cloud"]}):t=="fillToBorder"?e=i(s({},e),{boxShadow:"0.normal",border:"2.normal",borderWidth:2,borderColor:n,fontColor:n,backgroundColor:n}):t=="borderToFill"&&(e=i(s({},e),{fontColor:n,boxShadow:"0.normal",border:"2.normal",borderWidth:2,borderColor:n,backgroundColor:n})),n=="cloud"&&(e.fontColor="2.normal"),t!="link"&&(e=s({position:"relative",ssEffectsOnActive:["shrink","push"]},e))),e}},F=l=>{let t=R(s({isLocked:!1,isActive:!1,isActiveStyles:{},isActiveClassName:"",tabIndex:0,className:"",color:"theme",tone:"border","aria-label":P()},l)),o=t.seed;{let{isLocked:y=!1,isActive:m=!1,isActiveStyles:h={},isActiveClassName:C="",tone:r="border",size:u="regular",color:a="theme",className:T=""}=t;t=s(s(s({},x.Size(l.seed,r,u,a)),x.Tone(l.seed,r,u,a)),t),t.className=[T,c("Wrap"),c("isNeutral_"+!m),c("isLocked_"+y),c("Tone_"+r),c("Color_"+a),c("Tone_"+r+"_Color_"+a)].join(" "),m&&(t=s(s({className:[t.className,C].join(" ")},t),h))}if(o=="button"){let n=t,{isLocked:y,isActive:m,isActiveClassName:h,isActiveStyles:C,submitOption:r,onClick:u}=n,a=B(n,["isLocked","isActive","isActiveClassName","isActiveStyles","submitOption","onClick"]);return r&&(r=s({acceptInvalidForm:!1,submitDelegationKey:"auxEnter"},r),a=i(s({},a),{"data-form-submit-button":r.formName,"data-sdfike":L.flatArray(r.submitDelegationKey).join(",")})),p(I,i(s({htmlTag:"button",fontHeight:"inherit"},a),{onClick:T=>z(void 0,null,function*(){if(y||(u&&u(T),!r))return;let S=yield E.CollectForm(r.formName);!r.acceptInvalidForm&&!S.valid||r.callback(S.data,S.valid)})}))}else if(o=="label"){let e=t,{isLocked:y,isActive:m,isActiveClassName:h,isActiveStyles:C,onClick:r}=e,u=B(e,["isLocked","isActive","isActiveClassName","isActiveStyles","onClick"]);return p(I,i(s({htmlTag:"label"},u),{onClick:a=>{y||r&&r(a)}}))}else if(o=="anchor"){let M=t,{isLocked:y,isActive:m,isActiveClassName:h,isActiveStyles:C,onClick:r,href:u="",newTab:a,sync:T,shiftQueryParams:S}=M,A=B(M,["isLocked","isActive","isActiveClassName","isActiveStyles","onClick","href","newTab","sync","shiftQueryParams"]);return p(I,i(s({htmlTag:"button"},A),{onClick:f=>{if(y)return;if(r)return r(f);let v=f.ctrlKey||f.metaKey,N=a||!!v,b=u;if(S&&(b+=location.search),T){k.pushSync(b);return}k.push(b,!!N)}}))}return null},d=function(l,t){const o=e=>p(F,s({seed:l,tone:t,size:"regular"},e)),n=o;return n.Plain=e=>p(o,s({size:"plain",tone:t},e)),n.XS=e=>p(o,s({size:"xsmall",tone:t},e)),n.S=e=>p(o,s({size:"small",tone:t},e)),n.R=e=>p(o,s({size:"regular",tone:t},e)),n.L=e=>p(o,s({size:"large",tone:t},e)),n},g=function(l){const o=n=>p(F,s({seed:l,tone:"prime",size:"regular"},n));return o.Plain=d(l,"plain"),o.Link=d(l,"link"),o.Normal=d(l,"normal"),o.Border=d(l,"border"),o.Prime=d(l,"prime"),o.Sub=d(l,"sub"),o.Clear=d(l,"clear"),o.FillToBorder=d(l,"fillToBorder"),o.BorderToFill=d(l,"borderToFill"),o},w=g("button"),H=g("label"),K=g("anchor");export{K as Anchor,w as Button,H as Label};

package/dist/fn/Cropper.js

@@ -1 +1 @@
-import{b as H,c as K,e as F}from"../chunk-C5N2D3ZX.js";import{jsx as i,jsxs as f}from"react/jsx-runtime";import y,{UUID as J,useStore as X}from"jmini";import{$$fromRoot as Z}from"../@utils";import{useState as N,useEffect as O}from"react";import{Box as B,FAI as L,Column as M}from"../atoms";import{Row as R,Literal as A}from"../mols";import{Button as P}from"./Button";import U from"./Sheet";import V from"./Loader";import $ from"./Input";import{faPalette as Q}from"@fortawesome/free-solid-svg-icons/faPalette";import{faBarsStaggered as ee}from"@fortawesome/free-solid-svg-icons/faBarsStaggered";import{faRotateLeft as te}from"@fortawesome/free-solid-svg-icons/faRotateLeft";import{faRotateRight as ae}from"@fortawesome/free-solid-svg-icons/faRotateRight";import{CropperClasses as W}from"../@styles/componentClasses";import Y from"./Tooltips";class re{constructor(a){this.set_scale=a.set_scale,this.val_file=a.val_file,this.develops=a.develops;{let[c,m]=y.is.array(a.use)&&a.use||a.use.split(":").map(o=>Number(o)),g=c/m;this.usage={w:c,h:m,aspect:g}}this.componentID=a.componentID,this.scale={current:a.scale.default,default:a.scale.default,min:a.scale.min,max:a.scale.max};let s=a.canvas;this.Canvas={elm:s,ctx:s.getContext("2d")};let e=a.picture.image,{width:r,height:t}=e,n=r/t;this.Picture={elm:e,originDataUrl:e.src,aspect:n,revisedAspect:1,rotate:a.picture.rotate,grayScale:a.picture.grayScale,tone:a.picture.tone},this.pst={frame:{x:0,y:0,w:0,h:0,aspect:1},outImage:{x:0,y:0,w:0,h:0},imageX:r/2,imageY:t/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 a=this.Canvas.elm,s=this.Picture.elm,e=0,r=0;if(this.usage.aspect==1){let o=a.width*.6666666666666666,l=a.height*(2/3);r=e=Math.min(o,l)}else this.usage.aspect>1?(e=a.width*(8/10),r=e/this.usage.aspect):(r=a.height*(8/10),e=r*this.usage.aspect);let{width:t,height:n}=s,c=(a.width-e)/2,m=(a.height-r)/2,g=e/r;this.pst={frame:{x:c,y:m,w:e,h:r,aspect:g},outImage:{x:0,y:0,w:0,h:0},imageX:t/2,imageY:n/2,centerX:a.width/2,centerY:a.height/2}}dragEffect(a){let{eventType:s,x:e,y:r}=a;if(s=="start"){let t=this.Canvas.elm.position();this.dragEffectInfo={origin:{x:e,y:r},frameExpandRate:{x:this.Canvas.elm.width/t.width,y:this.Canvas.elm.height/t.height}}}else{let{origin:t,frameExpandRate:n}=this.dragEffectInfo,c=t.x-e,m=t.y-r,g=this.scale.current*this.Picture.revisedAspect/100,o=c/g*n.x,l=m/g*n.y;s=="move"?this.drawImage(this.pst.imageX+o,this.pst.imageY+l):s=="end"&&this.drawImage(this.pst.imageX+=o,this.pst.imageY+=l)}}pinchEffect(a){let{eventType:s,event:e}=a,{x:r,y:t}=y.getCursor(e.touches[0]),{x:n,y:c}=y.getCursor(e.touches[1]),m=n-r,g=c-t;if(s=="start")this.pinchEffectInfo.origin={x:m,y:g,scale:this.scale.current};else if(s=="move"){let{origin:o}=this.pinchEffectInfo,l=Math.sqrt(Math.pow(o.x,2)+Math.pow(o.y,2)),v=Math.sqrt(Math.pow(m,2)+Math.pow(g,2))/l,C=Number(o.scale*v);this.set_scale(C)}}updateScale(a){let s=a;s=Math.max(s,this.scale.min),s=Math.min(s,this.scale.max),this.scale.current=s,this.drawImage()}updateFilter(a){this.Picture.grayScale=a.grayScale,this.Picture.tone=a.tone,this.Picture.rotate=a.rotate,this.modifyImage()}modifyImage(){return F(this,null,function*(){let{grayScale:a,tone:s,rotate:e}=this.Picture;const r=document.createElement("canvas");let t=r.getContext("2d"),n=yield y.ImageLoader(this.Picture.originDataUrl),c=n.width,m=n.height;(e==90||e==270)&&(c=n.height,m=n.width),r.width=c,r.height=m,a&&(t.filter="grayscale("+a+"%)"),e&&(t.translate(c/2,m/2),t.rotate(e*Math.PI/180),[90,270].includes(e)?t.translate(-m/2,-c/2):t.translate(-c/2,-m/2)),t.drawImage(n,0,0,n.width,n.height);let g=t.getImageData(0,0,r.width,r.height),o=g.data;{a/=100;let C=[[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]][s],w=C[0]/255,x=C[1]/255,p=C[2]/255;for(let h=0;h<m;h++)for(let u=0;u<c;u++){var l=(h*c+u)*4;if(a){let E=.3*o[l]+.59*o[l+1]+.11*o[l+2];for(var S=0;S<3;S++){let D=o[l+S];o[l+S]=D+(E-D)*a}}o[l]*=w,o[l+1]*=x,o[l+2]*=p}}t.putImageData(g,0,0);let v=r.toDataURL("image/jpeg");{let C=yield y.ImageLoader(v),{width:w,height:x}=C,p=w/x;this.Picture=K(H({},this.Picture),{elm:C,aspect:p,revisedAspect:this.pst.frame.aspect>p?this.pst.frame.w/w:this.pst.frame.h/x})}this.drawImage()})}drawImage(a,s){let{Canvas:{ctx:e,elm:r},pst:{frame:t}}=this,n=a||this.pst.imageX,c=s||this.pst.imageY;{let m=this.scale.current/100,g=this.Picture.revisedAspect*m,o=this.pst.centerX-n*g,l=this.pst.centerY-c*g,S=this.Picture.elm.width*g,v=this.Picture.elm.height*g;{let C=this.pst.frame.x+this.pst.frame.w-S,w=this.pst.frame.x,x=this.pst.frame.y+this.pst.frame.h-v,p=this.pst.frame.y,h=0;o<C&&(h=o-C),o>w&&(h=o-w);let u=0;l<x&&(u=l-x),l>p&&(u=l-p),this.dragEffectInfo.origin.x+=h/2/this.dragEffectInfo.frameExpandRate.x,this.dragEffectInfo.origin.y+=u/2/this.dragEffectInfo.frameExpandRate.y,o=Math.min(Math.max(o,C),w),l=Math.min(Math.max(l,x),p)}this.pst.outImage={x:o,y:l,w:S,h:v},e.clearRect(0,0,this.Canvas.elm.width,this.Canvas.elm.height),e.drawImage(this.Picture.elm,0,0,this.Picture.elm.width,this.Picture.elm.height,o,l,S,v)}{if(this.usage.aspect==1){e.fillStyle="rgba( 20,24,20,.3 )",e.beginPath();let o=r.width/3*2,l=r.height/3*2,S=Math.min(o,l),v=Math.max(o,l);e.arc(r.width/2,r.height/2,v*1.41,0,Math.PI*2,!0),e.arc(r.width/2,r.height/2,S/2,0,Math.PI*2,!1),e.closePath(),e.fill()}else e.fillStyle="rgba( 20,24,20,.3 )";e.beginPath(),e.moveTo(0,0),e.lineTo(r.width,0),e.lineTo(r.width,r.height),e.lineTo(0,r.height),e.lineTo(0,0),e.closePath(),e.lineTo(t.x,t.y),e.lineTo(t.x,t.y+t.h),e.lineTo(t.x+t.w,t.y+t.h),e.lineTo(t.x+t.w,t.y),e.lineTo(t.x,t.y),e.fill();let g=y(document.body).getStyleProperty("--color-theme-hsl");e.lineWidth=4,e.strokeStyle=`hsla( ${g},1 )`,e.strokeRect(t.x,t.y,t.w,t.h)}}export(){return F(this,null,function*(){let{Canvas:a,develops:s,Picture:e,pst:{outImage:r,frame:t}}=this,n=r.w/e.elm.width,c=r.h/e.elm.height,m=(t.x-r.x)/n,g=(t.x-r.x+t.w)/n,o=(t.y-r.y)/c,l=(t.y-r.y+t.h)/c,S=Array.from({length:s.length}),v="image/jpeg";for(let C=0;C<s.length;C++){let{size:w,maxSize:x}=s[C];x=x||{S:1024*20,R:1024*100,L:1024*350}[w];let p={S:140,R:600,L:1200}[w],h=p;this.usage.aspect>1?h=p/this.usage.aspect:p=h*this.usage.aspect;let u=document.createElement("canvas");u.width=p,u.height=h;let E=u.getContext("2d");if(!E)return;E.clearRect(0,0,p,h),E.drawImage(this.Picture.elm,m,o,g-m,l-o,0,0,p,h);let D=u.toDataURL(v),b=yield D.toBlob(v);if(!b)return;if(b.size>=x){let k=x/b.size;if(D=u.toDataURL(v,k*.92),b=yield D.toBlob(v),!b)return}let z=new File([b],this.val_file.name,{type:v});S[C]=z}return S})}}const q={Core:d=>{let{val_file:a,options:s,finishedCallback:e,abortCallback:r}=d,{use:t,develops:n=[]}=s,[c]=N(J());const m={scale:{default:120,min:100,max:400},rotate:0,grayScale:0,tone:0};let[g,o]=N(m.scale.default),[l,S]=N(m.rotate),[v,C]=N(m.grayScale),[w,x]=N(m.tone);return O(()=>{let p="CropperResize";return y(window).addEvent({eventType:"resize",eventID:p,callback:()=>{y.interval.once(()=>{var k;let h=Z("#Canvas-"+c)[0];if(!h)return;let u=(k=X.get(c))==null?void 0:k.Instance;if(!u)return;let E=h.position(),D=E.width/E.height;h.width=2400,h.height=2400/D;let{width:b,height:z}=h;u.pst.centerX=b/2,u.pst.centerY=z/2,u.frameSizing(),u.modifyImage()},250,"CropperResize")}}),()=>{y(window).removeEvent(p)}},[]),O(()=>{X.set({[c]:{}}),F(void 0,null,function*(){V.fn.corner.active(),yield y.pending(()=>{},400);let{target:p}=yield a.convert();if(!p)return;let h=p.result,u=Z("#Canvas-"+c)[0];if(!u)return;let E=u.position(),D=E.width/E.height;u.width=2400,u.height=2400/D;let b=new re({set_scale:o,val_file:a,develops:n,use:t,scale:m.scale,componentID:c,canvas:u,picture:{image:yield y.ImageLoader(h),grayScale:m.grayScale,tone:m.tone,rotate:m.rotate}});X.set({[c]:{Instance:b}});const z=function(I){if(I.preventDefault(),I.touches&&I.touches.length>1)b.pinchEffect({eventType:"start",event:I}),y(document).addEvent({eventType:"touchmove",eventID:"CropperEffectMove",options:{passive:!1},callback:_=>{_.preventDefault(),b.pinchEffect({eventType:"move",event:_})}}).addEvent({eventType:"touchend",eventID:"CropperEffectEnd",options:{passive:!1},callback:G});else{b.dragEffect(H({eventType:"start"},y.getCursor(I)));let{type:_}=I;y(document).addEvent({eventType:_=="touchstart"?"touchmove":"mousemove",eventID:"CropperEffectMove",options:{passive:!1},callback:T=>{k("move",T)}}).addEvent({eventType:_=="touchstart"?"touchend":"mouseup",eventID:"CropperEffectEnd",options:{passive:!1},callback:T=>{k("end",T),G(T)}})}},k=function(I,_){_.preventDefault(),b.dragEffect(H({eventType:I},y.getCursor(_)))},G=function(I){I.preventDefault(),y(document).removeEvent(["CropperEffectMove","CropperEffectEnd"])};y(u).removeEvent(["CropperMouseWheel","CropperTouchStart","CropperMouseDown"]).addEvent({eventID:"CropperMouseWheel",eventType:"wheel",callback:I=>{I.preventDefault();let _=Number(I.wheelDelta*.04),T=b.scale.current+_;T=Math.max(T,b.scale.min),T=Math.min(T,b.scale.max),o(T)},options:{passive:!1}}).addEvent({eventType:"touchstart",eventID:"CropperTouchStart",callback:z,options:{passive:!1}}).addEvent({eventType:"mousedown",eventID:"CropperMouseDown",callback:z,options:{passive:!1}}),setTimeout(()=>{V.fn.corner.stop()},1e3)})},[a.id]),O(()=>{var h;let p=(h=X.get(c))==null?void 0:h.Instance;p&&p.updateScale(g)},[g]),O(()=>{var h;let p=(h=X.get(c))==null?void 0:h.Instance;p&&p.updateFilter({grayScale:v,tone:w,rotate:l})},[v,w,l]),i(U.Body,{borderRadius:0,height:"viewHeight",width:"viewWidth",children:f(M,{className:[W("Wrap"),W("Use_"+t)].join(" "),gap:0,height:1,position:"relative",overflow:"hidden",borderRadius:"inherit",children:[i(B,{flexSizing:0,overflow:"hidden",position:"relative",backgroundColor:"black",flexCenter:!0,freeCSS:{zIndex:1},children:i("canvas",{style:{width:"100%",height:"100%"},width:2400,height:2400,className:W("Canvas"),id:"Canvas-"+c})}),f(R.Separate,{borderTop:!0,flexSizing:"none",backgroundColor:"layer.1",padding:1,verticalAlign:"unset",UnderBreakPointStyles:{flexType:"col"},children:[i(q.SettingRegion,{DefaultOptions:m,val_scale:g,set_scale:o,val_tone:w,set_tone:x,val_grayScale:v,set_grayScale:C,val_rotate:l,set_rotate:S}),f(R.Right,{flexSizing:"none",children:[i(P.Border,{isRounded:!0,onClick:()=>{r()},children:"\u9589\u3058\u308B"}),i(P,{isRounded:!0,boxShadow:"3.remark",onClick:()=>F(void 0,null,function*(){var u;let p=(u=X.get(c))==null?void 0:u.Instance;if(!p)return;V.fn.mini.active("CropperExportation");let h=yield p.export();setTimeout(()=>{V.fn.mini.stop("CropperExportation"),e(h)},3e3)}),children:f(R.Center,{gap:"1/2",children:[i(V.White.R,{loaderID:"CropperExportation"}),"\u6C7A\u5B9A"]})})]})]})]})})},SettingRegion:d=>{let 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"],s=e=>a[e]||"\u306A\u3057";return f(R.Left,{verticalAlign:"unset",flexWrap:!0,children:[f(M,{gap:"1/3",children:[i(A.Supplement,{children:"Rotate"}),f(R.Left,{flexChilds:"even",gap:"1/6",children:[i(P.Border.S,{isRounded:!0,borderTopRightRadius:0,borderBottomRightRadius:0,onClick:()=>{let e=d.val_rotate-90;e<0&&(e+=360),d.set_rotate(e)},children:f(R.Center,{gap:"1/4",children:["90\xB0",i(L,{icon:te})]})}),i(P.Border.S,{isRounded:!0,borderTopLeftRadius:0,borderBottomLeftRadius:0,onClick:()=>{d.set_rotate((d.val_rotate+90)%360)},children:f(R.Center,{gap:"1/4",children:[i(L,{icon:ae}),"90\xB0"]})})]})]}),f(M,{gap:"1/3",freeCSS:{minWidth:12*6},children:[i(A.Supplement,{children:"Zoom"}),f(P.Border.S,{flexCenter:!0,isRounded:!0,flexSizing:0,onClick:e=>{let r="CropperZoomEdit";Y.open({tipsID:r,gravityPoint:3,event:e,closeAtParentBlur:!1,freeCSS:{minWidth:12*26},content:i(U.Body,{children:f(M,{padding:1.5,children:[f(R.Separate,{children:[i(A.Paragraph,{children:f(R.Center,{gap:"1/2",children:[i(L.Search,{fontColor:"5.translucent"}),"Zoom"]})}),i(P.Sub,{color:"cloud",ssSphere:2.5,onClick:()=>{Y.close(r)},children:i(L.Times,{})})]}),i(B,{borderBottom:!0,opacity:"low"}),i($.Slider,{override:"force",value:d.val_scale-100,min:d.DefaultOptions.scale.min-100,max:d.DefaultOptions.scale.max-100,step:25,onUpdateValidValue:(t,n)=>{y.interval.once(()=>{d.set_scale(t+100)},250,"Cropper.UpdateScale")},legends:{enable:!0,custom:t=>"x"+Math.round(100+t)/100}})]})})})},children:[d.val_scale.rate(1,0),"%"]})]}),f(M,{gap:"1/3",freeCSS:{minWidth:12*6},children:[i(A.Supplement,{children:"GrayScale"}),f(P.Border.S,{flexCenter:!0,isRounded:!0,flexSizing:0,onClick:e=>{let r="CropperGrayScaleEdit";Y.open({tipsID:r,gravityPoint:3,event:e,closeAtParentBlur:!1,freeCSS:{minWidth:12*26},content:i(U.Body,{children:f(M,{padding:1.5,children:[f(R.Separate,{children:[i(A.Paragraph,{children:f(R.Center,{gap:"1/2",children:[i(L,{icon:Q,fontColor:"5.translucent"}),"Gray Scale"]})}),i(P.Sub,{color:"cloud",ssSphere:2.5,onClick:()=>{Y.close(r)},children:i(L.Times,{})})]}),i(B,{borderBottom:!0,opacity:"low"}),i($.Slider,{value:d.val_grayScale,min:0,max:100,step:10,onUpdateValidValue:t=>{y.interval.once(()=>{d.set_grayScale(t)},250,"Cropper.GrayScale")},legends:{enable:!0,custom:t=>t+"%"}})]})})})},children:[d.val_grayScale.rate(1,0),"%"]})]}),f(M,{gap:"1/3",freeCSS:{minWidth:12*6},children:[i(A.Supplement,{children:"Tone"}),i(P.Border.S,{flexCenter:!0,isRounded:!0,flexSizing:0,onClick:e=>{let r="CropperToneEdit";Y.open({tipsID:r,gravityPoint:3,event:e,closeAtParentBlur:!1,freeCSS:{minWidth:12*26,maxWidth:12*24},content:()=>{let t=[];for(let n=1;n<=10;n++)t.push({value:n,label:f(R.Left,{gap:"1/3",children:[i(B,{ssSphere:1,className:[W("ToneBall"),W("ToneBall_"+n)].join(" ")}),i(B,{textAlign:"left",flexSizing:0,children:s(n)})]})});return i(U.Body,{children:f(M,{padding:1.5,children:[f(R.Separate,{children:[i(A.Paragraph,{children:f(R.Center,{gap:"1/2",children:[i(L,{icon:ee,fontColor:"5.translucent"}),"Tone"]})}),i(P.Sub,{color:"cloud",ssSphere:2.5,onClick:()=>{Y.close(r)},children:i(L.Times,{})})]}),i(B,{borderBottom:!0,opacity:"low"}),i($.Radio.Normal,{value:d.val_tone,gap:"1/2",cellStyles:{fontColor:"3.blur"},options:[{value:0,label:i(B,{flexSizing:0,textAlign:"center",children:"\u306A\u3057"})},...t],onUpdateValidValue:n=>{d.set_tone(n)}})]})})}})},children:f(R.Center,{gap:"1/2",children:[i(B,{boxShadow:"2.remark",ssSphere:1,className:[W("ToneBall"),W("ToneBall_"+d.val_tone)].join(" ")}),s(d.val_tone)]})})]})]})}},j={openDialogNEdit:d=>F(void 0,null,function*(){let a=yield $.Filer.fn.openDialog({accept:"image",multiple:!1});j.openEditor(H({imageFile:a[0]},d))}),openEditor:d=>F(void 0,null,function*(){let a="CropperImage";U.open("middleCenter",{sheetID:a,size:"MAX",padding:0,margin:0,freeCSS:{maxWidth:"100%"},content:i(q.Core,{val_file:d.imageFile,options:d,finishedCallback:s=>{U.close(a),d.onProcessFinished(s)},abortCallback:()=>{U.close(a)}}),closeAtEscapeKeyDown:!1})})};export{j as Cropper,j as default};
+import{b as H,c as K,e as F}from"../chunk-C5N2D3ZX.js";import{jsx as i,jsxs as f}from"react/jsx-runtime";import y,{UUID as J,useStore as z}from"jmini";import{$$fromRoot as Z}from"../@utils";import{useState as N,useEffect as O}from"react";import{Box as B,FAI as L,Column as M}from"../atoms";import{Row as R,Literal as A}from"../mols";import{Button as P}from"./Button";import X from"./Sheet";import V from"./Loader";import $ from"./Input";import{faPalette as Q}from"@fortawesome/free-solid-svg-icons/faPalette";import{faBarsStaggered as ee}from"@fortawesome/free-solid-svg-icons/faBarsStaggered";import{faRotateLeft as te}from"@fortawesome/free-solid-svg-icons/faRotateLeft";import{faRotateRight as ae}from"@fortawesome/free-solid-svg-icons/faRotateRight";import{CropperClasses as U}from"../@styles/componentClasses";import Y from"./Tooltips";class re{constructor(a){this.set_scale=a.set_scale,this.val_file=a.val_file,this.develops=a.develops;{let[c,m]=y.is.array(a.use)&&a.use||a.use.split(":").map(o=>Number(o)),g=c/m;this.usage={w:c,h:m,aspect:g}}this.componentId=a.componentId,this.scale={current:a.scale.default,default:a.scale.default,min:a.scale.min,max:a.scale.max};let s=a.canvas;this.Canvas={elm:s,ctx:s.getContext("2d")};let e=a.picture.image,{width:r,height:t}=e,n=r/t;this.Picture={elm:e,originDataUrl:e.src,aspect:n,revisedAspect:1,rotate:a.picture.rotate,grayScale:a.picture.grayScale,tone:a.picture.tone},this.pst={frame:{x:0,y:0,w:0,h:0,aspect:1},outImage:{x:0,y:0,w:0,h:0},imageX:r/2,imageY:t/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 a=this.Canvas.elm,s=this.Picture.elm,e=0,r=0;if(this.usage.aspect==1){let o=a.width*.6666666666666666,l=a.height*(2/3);r=e=Math.min(o,l)}else this.usage.aspect>1?(e=a.width*(8/10),r=e/this.usage.aspect):(r=a.height*(8/10),e=r*this.usage.aspect);let{width:t,height:n}=s,c=(a.width-e)/2,m=(a.height-r)/2,g=e/r;this.pst={frame:{x:c,y:m,w:e,h:r,aspect:g},outImage:{x:0,y:0,w:0,h:0},imageX:t/2,imageY:n/2,centerX:a.width/2,centerY:a.height/2}}dragEffect(a){let{eventType:s,x:e,y:r}=a;if(s=="start"){let t=this.Canvas.elm.position();this.dragEffectInfo={origin:{x:e,y:r},frameExpandRate:{x:this.Canvas.elm.width/t.width,y:this.Canvas.elm.height/t.height}}}else{let{origin:t,frameExpandRate:n}=this.dragEffectInfo,c=t.x-e,m=t.y-r,g=this.scale.current*this.Picture.revisedAspect/100,o=c/g*n.x,l=m/g*n.y;s=="move"?this.drawImage(this.pst.imageX+o,this.pst.imageY+l):s=="end"&&this.drawImage(this.pst.imageX+=o,this.pst.imageY+=l)}}pinchEffect(a){let{eventType:s,event:e}=a,{x:r,y:t}=y.getCursor(e.touches[0]),{x:n,y:c}=y.getCursor(e.touches[1]),m=n-r,g=c-t;if(s=="start")this.pinchEffectInfo.origin={x:m,y:g,scale:this.scale.current};else if(s=="move"){let{origin:o}=this.pinchEffectInfo,l=Math.sqrt(Math.pow(o.x,2)+Math.pow(o.y,2)),v=Math.sqrt(Math.pow(m,2)+Math.pow(g,2))/l,C=Number(o.scale*v);this.set_scale(C)}}updateScale(a){let s=a;s=Math.max(s,this.scale.min),s=Math.min(s,this.scale.max),this.scale.current=s,this.drawImage()}updateFilter(a){this.Picture.grayScale=a.grayScale,this.Picture.tone=a.tone,this.Picture.rotate=a.rotate,this.modifyImage()}modifyImage(){return F(this,null,function*(){let{grayScale:a,tone:s,rotate:e}=this.Picture;const r=document.createElement("canvas");let t=r.getContext("2d"),n=yield y.ImageLoader(this.Picture.originDataUrl),c=n.width,m=n.height;(e==90||e==270)&&(c=n.height,m=n.width),r.width=c,r.height=m,a&&(t.filter="grayscale("+a+"%)"),e&&(t.translate(c/2,m/2),t.rotate(e*Math.PI/180),[90,270].includes(e)?t.translate(-m/2,-c/2):t.translate(-c/2,-m/2)),t.drawImage(n,0,0,n.width,n.height);let g=t.getImageData(0,0,r.width,r.height),o=g.data;{a/=100;let C=[[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]][s],w=C[0]/255,x=C[1]/255,p=C[2]/255;for(let h=0;h<m;h++)for(let u=0;u<c;u++){var l=(h*c+u)*4;if(a){let E=.3*o[l]+.59*o[l+1]+.11*o[l+2];for(var S=0;S<3;S++){let _=o[l+S];o[l+S]=_+(E-_)*a}}o[l]*=w,o[l+1]*=x,o[l+2]*=p}}t.putImageData(g,0,0);let v=r.toDataURL("image/jpeg");{let C=yield y.ImageLoader(v),{width:w,height:x}=C,p=w/x;this.Picture=K(H({},this.Picture),{elm:C,aspect:p,revisedAspect:this.pst.frame.aspect>p?this.pst.frame.w/w:this.pst.frame.h/x})}this.drawImage()})}drawImage(a,s){let{Canvas:{ctx:e,elm:r},pst:{frame:t}}=this,n=a||this.pst.imageX,c=s||this.pst.imageY;{let m=this.scale.current/100,g=this.Picture.revisedAspect*m,o=this.pst.centerX-n*g,l=this.pst.centerY-c*g,S=this.Picture.elm.width*g,v=this.Picture.elm.height*g;{let C=this.pst.frame.x+this.pst.frame.w-S,w=this.pst.frame.x,x=this.pst.frame.y+this.pst.frame.h-v,p=this.pst.frame.y,h=0;o<C&&(h=o-C),o>w&&(h=o-w);let u=0;l<x&&(u=l-x),l>p&&(u=l-p),this.dragEffectInfo.origin.x+=h/2/this.dragEffectInfo.frameExpandRate.x,this.dragEffectInfo.origin.y+=u/2/this.dragEffectInfo.frameExpandRate.y,o=Math.min(Math.max(o,C),w),l=Math.min(Math.max(l,x),p)}this.pst.outImage={x:o,y:l,w:S,h:v},e.clearRect(0,0,this.Canvas.elm.width,this.Canvas.elm.height),e.drawImage(this.Picture.elm,0,0,this.Picture.elm.width,this.Picture.elm.height,o,l,S,v)}{if(this.usage.aspect==1){e.fillStyle="rgba( 20,24,20,.3 )",e.beginPath();let o=r.width/3*2,l=r.height/3*2,S=Math.min(o,l),v=Math.max(o,l);e.arc(r.width/2,r.height/2,v*1.41,0,Math.PI*2,!0),e.arc(r.width/2,r.height/2,S/2,0,Math.PI*2,!1),e.closePath(),e.fill()}else e.fillStyle="rgba( 20,24,20,.3 )";e.beginPath(),e.moveTo(0,0),e.lineTo(r.width,0),e.lineTo(r.width,r.height),e.lineTo(0,r.height),e.lineTo(0,0),e.closePath(),e.lineTo(t.x,t.y),e.lineTo(t.x,t.y+t.h),e.lineTo(t.x+t.w,t.y+t.h),e.lineTo(t.x+t.w,t.y),e.lineTo(t.x,t.y),e.fill();let g=y(document.body).getStyleProperty("--color-theme-hsl");e.lineWidth=4,e.strokeStyle=`hsla( ${g},1 )`,e.strokeRect(t.x,t.y,t.w,t.h)}}export(){return F(this,null,function*(){let{Canvas:a,develops:s,Picture:e,pst:{outImage:r,frame:t}}=this,n=r.w/e.elm.width,c=r.h/e.elm.height,m=(t.x-r.x)/n,g=(t.x-r.x+t.w)/n,o=(t.y-r.y)/c,l=(t.y-r.y+t.h)/c,S=Array.from({length:s.length}),v="image/jpeg";for(let C=0;C<s.length;C++){let{size:w,maxSize:x}=s[C];x=x||{S:1024*20,R:1024*100,L:1024*350}[w];let p={S:140,R:600,L:1200}[w],h=p;this.usage.aspect>1?h=p/this.usage.aspect:p=h*this.usage.aspect;let u=document.createElement("canvas");u.width=p,u.height=h;let E=u.getContext("2d");if(!E)return;E.clearRect(0,0,p,h),E.drawImage(this.Picture.elm,m,o,g-m,l-o,0,0,p,h);let _=u.toDataURL(v),b=yield _.toBlob(v);if(!b)return;if(b.size>=x){let k=x/b.size;if(_=u.toDataURL(v,k*.92),b=yield _.toBlob(v),!b)return}let W=new File([b],this.val_file.name,{type:v});S[C]=W}return S})}}const q={Core:d=>{let{val_file:a,options:s,finishedCallback:e,abortCallback:r}=d,{use:t,develops:n=[]}=s,[c]=N(J());const m={scale:{default:120,min:100,max:400},rotate:0,grayScale:0,tone:0};let[g,o]=N(m.scale.default),[l,S]=N(m.rotate),[v,C]=N(m.grayScale),[w,x]=N(m.tone);return O(()=>{let p="CropperResize";return y(window).addEvent({eventType:"resize",eventID:p,callback:()=>{y.interval.once(()=>{var k;let h=Z("#Canvas-"+c)[0];if(!h)return;let u=(k=z.get(c))==null?void 0:k.Instance;if(!u)return;let E=h.position(),_=E.width/E.height;h.width=2400,h.height=2400/_;let{width:b,height:W}=h;u.pst.centerX=b/2,u.pst.centerY=W/2,u.frameSizing(),u.modifyImage()},250,"CropperResize")}}),()=>{y(window).removeEvent(p)}},[]),O(()=>{z.set({[c]:{}}),F(void 0,null,function*(){V.fn.corner.active(),yield y.pending(()=>{},400);let{target:p}=yield a.convert();if(!p)return;let h=p.result,u=Z("#Canvas-"+c)[0];if(!u)return;let E=u.position(),_=E.width/E.height;u.width=2400,u.height=2400/_;let b=new re({set_scale:o,val_file:a,develops:n,use:t,scale:m.scale,componentId:c,canvas:u,picture:{image:yield y.ImageLoader(h),grayScale:m.grayScale,tone:m.tone,rotate:m.rotate}});z.set({[c]:{Instance:b}});const W=function(I){if(I.preventDefault(),I.touches&&I.touches.length>1)b.pinchEffect({eventType:"start",event:I}),y(document).addEvent({eventType:"touchmove",eventID:"CropperEffectMove",options:{passive:!1},callback:D=>{D.preventDefault(),b.pinchEffect({eventType:"move",event:D})}}).addEvent({eventType:"touchend",eventID:"CropperEffectEnd",options:{passive:!1},callback:G});else{b.dragEffect(H({eventType:"start"},y.getCursor(I)));let{type:D}=I;y(document).addEvent({eventType:D=="touchstart"?"touchmove":"mousemove",eventID:"CropperEffectMove",options:{passive:!1},callback:T=>{k("move",T)}}).addEvent({eventType:D=="touchstart"?"touchend":"mouseup",eventID:"CropperEffectEnd",options:{passive:!1},callback:T=>{k("end",T),G(T)}})}},k=function(I,D){D.preventDefault(),b.dragEffect(H({eventType:I},y.getCursor(D)))},G=function(I){I.preventDefault(),y(document).removeEvent(["CropperEffectMove","CropperEffectEnd"])};y(u).removeEvent(["CropperMouseWheel","CropperTouchStart","CropperMouseDown"]).addEvent({eventID:"CropperMouseWheel",eventType:"wheel",callback:I=>{I.preventDefault();let D=Number(I.wheelDelta*.04),T=b.scale.current+D;T=Math.max(T,b.scale.min),T=Math.min(T,b.scale.max),o(T)},options:{passive:!1}}).addEvent({eventType:"touchstart",eventID:"CropperTouchStart",callback:W,options:{passive:!1}}).addEvent({eventType:"mousedown",eventID:"CropperMouseDown",callback:W,options:{passive:!1}}),setTimeout(()=>{V.fn.corner.stop()},1e3)})},[a.id]),O(()=>{var h;let p=(h=z.get(c))==null?void 0:h.Instance;p&&p.updateScale(g)},[g]),O(()=>{var h;let p=(h=z.get(c))==null?void 0:h.Instance;p&&p.updateFilter({grayScale:v,tone:w,rotate:l})},[v,w,l]),i(X.Body,{borderRadius:0,height:"viewHeight",width:"viewWidth",children:f(M,{className:[U("Wrap"),U("Use_"+t)].join(" "),gap:0,height:1,position:"relative",overflow:"hidden",borderRadius:"inherit",children:[i(B,{flexSizing:0,overflow:"hidden",position:"relative",backgroundColor:"black",flexCenter:!0,freeCSS:{zIndex:1},children:i("canvas",{style:{width:"100%",height:"100%"},width:2400,height:2400,className:U("Canvas"),id:"Canvas-"+c})}),f(R.Separate,{borderTop:!0,flexSizing:"none",backgroundColor:"layer.1",padding:1,verticalAlign:"unset",UnderBreakPointStyles:{flexType:"col"},children:[i(q.SettingRegion,{DefaultOptions:m,val_scale:g,set_scale:o,val_tone:w,set_tone:x,val_grayScale:v,set_grayScale:C,val_rotate:l,set_rotate:S}),f(R.Right,{flexSizing:"none",children:[i(P.Border,{isRounded:!0,onClick:()=>{r()},children:"\u9589\u3058\u308B"}),i(P,{isRounded:!0,boxShadow:"3.remark",onClick:()=>F(void 0,null,function*(){var u;let p=(u=z.get(c))==null?void 0:u.Instance;if(!p)return;V.fn.mini.active("CropperExportation");let h=yield p.export();setTimeout(()=>{V.fn.mini.stop("CropperExportation"),e(h)},3e3)}),children:f(R.Center,{gap:"1/2",children:[i(V.White.R,{loaderID:"CropperExportation"}),"\u6C7A\u5B9A"]})})]})]})]})})},SettingRegion:d=>{let 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"],s=e=>a[e]||"\u306A\u3057";return f(R.Left,{verticalAlign:"unset",flexWrap:!0,children:[f(M,{gap:"1/3",children:[i(A.Supplement,{children:"Rotate"}),f(R.Left,{flexChilds:"even",gap:"1/6",children:[i(P.Border.S,{isRounded:!0,borderTopRightRadius:0,borderBottomRightRadius:0,onClick:()=>{let e=d.val_rotate-90;e<0&&(e+=360),d.set_rotate(e)},children:f(R.Center,{gap:"1/4",children:["90\xB0",i(L,{icon:te})]})}),i(P.Border.S,{isRounded:!0,borderTopLeftRadius:0,borderBottomLeftRadius:0,onClick:()=>{d.set_rotate((d.val_rotate+90)%360)},children:f(R.Center,{gap:"1/4",children:[i(L,{icon:ae}),"90\xB0"]})})]})]}),f(M,{gap:"1/3",freeCSS:{minWidth:12*6},children:[i(A.Supplement,{children:"Zoom"}),f(P.Border.S,{flexCenter:!0,isRounded:!0,flexSizing:0,onClick:e=>{let r="CropperZoomEdit";Y.open({tipsID:r,gravityPoint:3,event:e,closeAtParentBlur:!1,freeCSS:{minWidth:12*26},content:i(X.Body,{children:f(M,{padding:1.5,children:[f(R.Separate,{children:[i(A.Paragraph,{children:f(R.Center,{gap:"1/2",children:[i(L.Search,{fontColor:"5.translucent"}),"Zoom"]})}),i(P.Sub,{color:"cloud",ssSphere:2.5,onClick:()=>{Y.close(r)},children:i(L.X,{})})]}),i(B,{borderBottom:!0,opacity:"low"}),i($.Slider,{override:"force",value:d.val_scale-100,min:d.DefaultOptions.scale.min-100,max:d.DefaultOptions.scale.max-100,step:25,onUpdateValidValue:(t,n)=>{y.interval.once(()=>{d.set_scale(t+100)},250,"Cropper.UpdateScale")},legends:{enable:!0,custom:t=>"x"+Math.round(100+t)/100}})]})})})},children:[d.val_scale.rate(1,0),"%"]})]}),f(M,{gap:"1/3",freeCSS:{minWidth:12*6},children:[i(A.Supplement,{children:"GrayScale"}),f(P.Border.S,{flexCenter:!0,isRounded:!0,flexSizing:0,onClick:e=>{let r="CropperGrayScaleEdit";Y.open({tipsID:r,gravityPoint:3,event:e,closeAtParentBlur:!1,freeCSS:{minWidth:12*26},content:i(X.Body,{children:f(M,{padding:1.5,children:[f(R.Separate,{children:[i(A.Paragraph,{children:f(R.Center,{gap:"1/2",children:[i(L,{icon:Q,fontColor:"5.translucent"}),"Gray Scale"]})}),i(P.Sub,{color:"cloud",ssSphere:2.5,onClick:()=>{Y.close(r)},children:i(L.X,{})})]}),i(B,{borderBottom:!0,opacity:"low"}),i($.Slider,{value:d.val_grayScale,min:0,max:100,step:10,onUpdateValidValue:t=>{y.interval.once(()=>{d.set_grayScale(t)},250,"Cropper.GrayScale")},legends:{enable:!0,custom:t=>t+"%"}})]})})})},children:[d.val_grayScale.rate(1,0),"%"]})]}),f(M,{gap:"1/3",freeCSS:{minWidth:12*6},children:[i(A.Supplement,{children:"Tone"}),i(P.Border.S,{flexCenter:!0,isRounded:!0,flexSizing:0,onClick:e=>{let r="CropperToneEdit";Y.open({tipsID:r,gravityPoint:3,event:e,closeAtParentBlur:!1,freeCSS:{minWidth:12*26,maxWidth:12*24},content:()=>{let t=[];for(let n=1;n<=10;n++)t.push({value:n,label:f(R.Left,{gap:"1/3",children:[i(B,{ssSphere:1,className:[U("ToneBall"),U("ToneBall_"+n)].join(" ")}),i(B,{textAlign:"left",flexSizing:0,children:s(n)})]})});return i(X.Body,{children:f(M,{padding:1.5,children:[f(R.Separate,{children:[i(A.Paragraph,{children:f(R.Center,{gap:"1/2",children:[i(L,{icon:ee,fontColor:"5.translucent"}),"Tone"]})}),i(P.Sub,{color:"cloud",ssSphere:2.5,onClick:()=>{Y.close(r)},children:i(L.X,{})})]}),i(B,{borderBottom:!0,opacity:"low"}),i($.Radio.Normal,{value:d.val_tone,gap:"1/2",cellStyles:{fontColor:"3.blur"},options:[{value:0,label:i(B,{flexSizing:0,textAlign:"center",children:"\u306A\u3057"})},...t],onUpdateValidValue:n=>{d.set_tone(n)}})]})})}})},children:f(R.Center,{gap:"1/2",children:[i(B,{boxShadow:"2.remark",ssSphere:1,className:[U("ToneBall"),U("ToneBall_"+d.val_tone)].join(" ")}),s(d.val_tone)]})})]})]})}},j={openDialogNEdit:d=>F(void 0,null,function*(){let a=yield $.Filer.fn.openDialog({accept:"image",multiple:!1});j.openEditor(H({imageFile:a[0]},d))}),openEditor:d=>F(void 0,null,function*(){let a="CropperImage";X.open("middleCenter",{sheetID:a,size:"MAX",padding:0,margin:0,freeCSS:{maxWidth:"100%"},content:i(q.Core,{val_file:d.imageFile,options:d,finishedCallback:s=>{X.close(a),d.onProcessFinished(s)},abortCallback:()=>{X.close(a)}}),closeAtEscapeKeyDown:!1})})};export{j as Cropper,j as default};

package/dist/fn/Effect/Fade.js

@@ -1 +1 @@
-import{b as a,c as i,d as s}from"../../chunk-C5N2D3ZX.js";import{jsx as D}from"react/jsx-runtime";import{UUID as u}from"jmini";import{$$fromRoot as l}from"../../@utils";import{useState as I,useEffect as f}from"react";import{Box as d}from"../../atoms";const y=m=>{let n=m,{animationDelay:p=100,animationTime:r=300,componentID:c=u()}=n,e=s(n,["animationDelay","animationTime","componentID"]),[t]=I(c);return f(()=>{setTimeout(()=>{let o=l('[data-component-id="'+t+'"]');o[0]&&o.css({transition:r+"ms"}).await(1).css({opacity:1})},p)},[]),D(d,i(a({},e),{freeCSS:i(a({},e.freeCSS),{opacity:0}),componentID:t}))},S=m=>{let n=m,{animationDelay:p=100,animationTime:r=300,componentID:c=u()}=n,e=s(n,["animationDelay","animationTime","componentID"]),[t]=I(c);return f(()=>{setTimeout(()=>{let o=l('[data-component-id="'+t+'"]');o[0]&&o.css({transition:r+"ms"}).await(1).css({opacity:1,paddingTop:0})},p)},[]),D(d,i(a({paddingTop:2},e),{freeCSS:i(a({},e.freeCSS),{opacity:0}),componentID:t}))};export{y as FadeIn,S as FadeUp};
+import{b as a,c as i,d as s}from"../../chunk-C5N2D3ZX.js";import{jsx as y}from"react/jsx-runtime";import{UUID as d}from"jmini";import{$$fromRoot as u}from"../../@utils";import{useState as l,useEffect as I}from"react";import{Box as f}from"../../atoms";const S=m=>{let n=m,{animationDelay:p=100,animationTime:r=300,componentId:c=d()}=n,e=s(n,["animationDelay","animationTime","componentId"]),[t]=l(c);return I(()=>{setTimeout(()=>{let o=u('[data-component-id="'+t+'"]');o[0]&&o.css({transition:r+"ms"}).await(1).css({opacity:1})},p)},[]),y(f,i(a({},e),{freeCSS:i(a({},e.freeCSS),{opacity:0}),componentId:t}))},F=m=>{let n=m,{animationDelay:p=100,animationTime:r=300,componentId:c=d()}=n,e=s(n,["animationDelay","animationTime","componentId"]),[t]=l(c);return I(()=>{setTimeout(()=>{let o=u('[data-component-id="'+t+'"]');o[0]&&o.css({transition:r+"ms"}).await(1).css({opacity:1,paddingTop:0})},p)},[]),y(f,i(a({paddingTop:2},e),{freeCSS:i(a({},e.freeCSS),{opacity:0}),componentId:t}))};export{S as FadeIn,F as FadeUp};

package/dist/fn/Input/Autocomplete.js

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

package/dist/fn/Input/CollectForm.js

@@ -1 +1 @@
-import{e as n}from"../../chunk-C5N2D3ZX.js";import p,{useStore as e}from"jmini";const c=t=>n(void 0,null,function*(){let s=1,l={};return yield p.scope(()=>n(void 0,null,function*(){if(e.get("form-process-"+t))return;e.set({["form-process-"+t]:!0});let i=document.activeElement;i&&i.blur();{let o=e.get(["form-data",t].join("-"));if(!o){e.set({["form-process-"+t]:!1});return}for(let[m,a]of Object.entries(o)){if(!a)continue;let r=e.get(a.componentID);r&&r.Refresh&&(yield r.Refresh())}}{let o=e.get(["form-data",t].join("-"));if(!o){e.set({["form-process-"+t]:!1});return}for(let[m,a]of Object.entries(o))a&&(s&=Number(a.validation),l[m]=a.value)}e.set({["form-process-"+t]:!1})})),{valid:!!s,data:l}});export{c as CollectForm,c as default};
+import{e as n}from"../../chunk-C5N2D3ZX.js";import p,{useStore as e}from"jmini";const c=t=>n(void 0,null,function*(){let s=1,l={};return yield p.scope(()=>n(void 0,null,function*(){if(e.get("form-process-"+t))return;e.set({["form-process-"+t]:!0});let i=document.activeElement;i&&i.blur();{let o=e.get(["form-data",t].join("-"));if(!o){e.set({["form-process-"+t]:!1});return}for(let[m,a]of Object.entries(o)){if(!a)continue;let r=e.get(a.componentId);r&&r.Refresh&&(yield r.Refresh())}}{let o=e.get(["form-data",t].join("-"));if(!o){e.set({["form-process-"+t]:!1});return}for(let[m,a]of Object.entries(o))a&&(s&=Number(a.validation),l[m]=a.value)}e.set({["form-process-"+t]:!1})})),{valid:!!s,data:l}});export{c as CollectForm,c as default};

package/dist/fn/Input/Color.js

@@ -1 +1 @@
-import{b as e,c as r,d as h}from"../../chunk-C5N2D3ZX.js";import{jsx as m}from"react/jsx-runtime";import{UUID as b}from"jmini";import{useState as v}from"react";import x from"../../atoms/Box";import{OptionalInputWrapper as _,BoxWrapper as k,CoreEffects as p,DefaultBoxishStyles as F}from"./core";import{InputSwitchClasses as R}from"../../@styles/componentClasses";function w(t){let{value:n,states:d}=t,{required:s}=d,o=[];return s&&!n&&o.push({type:"invalid",label:"ON\u306B\u306A\u3063\u3066\u3044\u307E\u305B\u3093"}),{ok:!o.filter(({type:c})=>c=="invalid").length,notice:o}}const B=t=>{let y=t,{componentID:n,required:d,form:s,enableFormSubmit:o,checkValidationAtFirst:c,onChange:I,onKeyDown:f,onValidate:E,onUpdateValue:U,onUpdateValidValue:W,value:g=""}=y,S=h(y,["componentID","required","form","enableFormSubmit","checkValidationAtFirst","onChange","onKeyDown","onValidate","onUpdateValue","onUpdateValidValue","value"]),[l,i]=v(p.DefaultStatus(t.componentID||"",g)),[u,C]=v({ok:!1,notice:[]});return p.CommonEffects({type:"color",states:t,val_status:l,set_status:i,val_validate:u,set_validate:C,SystemValidation:w}),m(k,{val_status:l,set_status:i,val_validate:u,states:t,children:m(x,e({htmlTag:"input",type:"color","data-component-id":l.componentID,value:l.dataValue,className:R("Input"),onKeyDown:a=>{f&&f(a),o&&p.SubmitForm(a,s)},onChange:a=>{let{value:T}=a.target;u.ok&&C({ok:!1,notice:[]}),i(V=>r(e({},V),{dataValue:T,eventType:"update",eventID:b()})),I&&I(a)}},S))})},D=t=>{let n=r(e(r(e({},F(t)),{backgroundColor:"cloud",unitHeight:3}),t),{freeCSS:e({minWidth:108},t.freeCSS)});return m(_,{componentID:t.componentID,children:B,states:n})};export{D as Color,D as default};
+import{b as e,c as r,d as h}from"../../chunk-C5N2D3ZX.js";import{jsx as m}from"react/jsx-runtime";import{UUID as x}from"jmini";import{useState as v}from"react";import D from"../../atoms/Box";import{OptionalInputWrapper as _,BoxWrapper as k,CoreEffects as p,DefaultBoxishStyles as F}from"./core";import{InputSwitchClasses as R}from"../../@styles/componentClasses";function w(t){let{value:n,states:d}=t,{required:s}=d,o=[];return s&&!n&&o.push({type:"invalid",label:"ON\u306B\u306A\u3063\u3066\u3044\u307E\u305B\u3093"}),{ok:!o.filter(({type:c})=>c=="invalid").length,notice:o}}const B=t=>{let y=t,{componentId:n,required:d,form:s,enableFormSubmit:o,checkValidationAtFirst:c,onChange:I,onKeyDown:f,onValidate:E,onUpdateValue:U,onUpdateValidValue:W,value:S=""}=y,T=h(y,["componentId","required","form","enableFormSubmit","checkValidationAtFirst","onChange","onKeyDown","onValidate","onUpdateValue","onUpdateValidValue","value"]),[l,i]=v(p.DefaultStatus(t.componentId||"",S)),[u,C]=v({ok:!1,notice:[]});return p.CommonEffects({type:"color",states:t,val_status:l,set_status:i,val_validate:u,set_validate:C,SystemValidation:w}),m(k,{val_status:l,set_status:i,val_validate:u,states:t,children:m(D,e({htmlTag:"input",type:"color","data-component-id":l.componentId,value:l.dataValue,className:R("Input"),onKeyDown:a=>{f&&f(a),o&&p.SubmitForm(a,s)},onChange:a=>{let{value:V}=a.target;u.ok&&C({ok:!1,notice:[]}),i(b=>r(e({},b),{dataValue:V,eventType:"update",eventID:x()})),I&&I(a)}},T))})},g=t=>{let n=r(e(r(e({},F(t)),{backgroundColor:"cloud",unitHeight:3}),t),{freeCSS:e({minWidth:108},t.freeCSS)});return m(_,{componentId:t.componentId,children:B,states:n})};export{g as Color,g as default};

package/dist/fn/Input/Contenteditable.js

@@ -1 +1 @@
-import{b as o,c as r,d as b}from"../../chunk-C5N2D3ZX.js";import{jsx as c}from"react/jsx-runtime";import{UUID as g}from"jmini";import{useState as h}from"react";import{OptionalInputWrapper as w,BoxWrapper as _,CoreEffects as s,DefaultBoxishStyles as B}from"./core";import{Box as k}from"../../atoms";function F(t){let{value:e,states:d}=t,{required:m}=d,n=[];return m&&!e&&n.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"}),{ok:!n.filter(({type:p})=>p=="invalid").length,notice:n}}const H=t=>{let T=t,{componentID:e,tone:d,required:m,form:n,value:p,enableFormSubmit:S,checkValidationAtFirst:C,onInput:f,onKeyDown:I,onValidate:L,onUpdateValue:M,onUpdateValidValue:U,children:D="",leftIndicator:W,rightIndicator:q,leftIcon:A,rightIcon:K,freeCSS:G,wrapStyles:N}=T,E=b(T,["componentID","tone","required","form","value","enableFormSubmit","checkValidationAtFirst","onInput","onKeyDown","onValidate","onUpdateValue","onUpdateValidValue","children","leftIndicator","rightIndicator","leftIcon","rightIcon","freeCSS","wrapStyles"]),[i,u]=h(s.DefaultStatus(e,p)),[l,y]=h({ok:!1,notice:[]});return s.CommonEffects({type:"contenteditable",states:t,val_status:i,set_status:u,val_validate:l,set_validate:y,SystemValidation:F}),c(_,{val_status:i,set_status:u,val_validate:l,states:t,children:c(k,r(o({contentEditable:!0,"data-show-validation":s.isShowValidation(l,i,!!C),"data-component-id":i.componentID,onKeyDown:a=>{I&&I(a),S&&s.SubmitForm(a,n)},onInput:a=>{let R=a.currentTarget,{innerHTML:O,innerText:V}=R;l.ok&&y({ok:!1,notice:[]}),u(x=>r(o({},x),{dataValue:V,eventType:"update",eventID:g()})),f&&f(a)}},E),{children:D}))})},v=t=>{t=r(o({rows:5},t),{freeCSS:o({whiteSpace:"pre-wrap"},t.freeCSS)});let e=B(t);return c(w,{componentID:t.componentID,children:H,states:e})};export{v as Contenteditable,v as default};
+import{b as o,c as r,d as b}from"../../chunk-C5N2D3ZX.js";import{jsx as u}from"react/jsx-runtime";import{UUID as w}from"jmini";import{useState as h}from"react";import{OptionalInputWrapper as D,BoxWrapper as _,CoreEffects as s,DefaultBoxishStyles as B}from"./core";import{Box as k}from"../../atoms";function F(t){let{value:e,states:c}=t,{required:m}=c,n=[];return m&&!e&&n.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"}),{ok:!n.filter(({type:p})=>p=="invalid").length,notice:n}}const H=t=>{let T=t,{componentId:e,tone:c,required:m,form:n,value:p,enableFormSubmit:S,checkValidationAtFirst:C,onInput:f,onKeyDown:I,onValidate:L,onUpdateValue:M,onUpdateValidValue:U,children:E="",leftIndicator:W,rightIndicator:q,leftIcon:A,rightIcon:K,freeCSS:G,wrapStyles:N}=T,R=b(T,["componentId","tone","required","form","value","enableFormSubmit","checkValidationAtFirst","onInput","onKeyDown","onValidate","onUpdateValue","onUpdateValidValue","children","leftIndicator","rightIndicator","leftIcon","rightIcon","freeCSS","wrapStyles"]),[i,d]=h(s.DefaultStatus(e,p)),[l,y]=h({ok:!1,notice:[]});return s.CommonEffects({type:"contenteditable",states:t,val_status:i,set_status:d,val_validate:l,set_validate:y,SystemValidation:F}),u(_,{val_status:i,set_status:d,val_validate:l,states:t,children:u(k,r(o({contentEditable:!0,"data-show-validation":s.isShowValidation(l,i,!!C),"data-component-id":i.componentId,onKeyDown:a=>{I&&I(a),S&&s.SubmitForm(a,n)},onInput:a=>{let V=a.currentTarget,{innerHTML:O,innerText:x}=V;l.ok&&y({ok:!1,notice:[]}),d(g=>r(o({},g),{dataValue:x,eventType:"update",eventID:w()})),f&&f(a)}},R),{children:E}))})},v=t=>{t=r(o({rows:5},t),{freeCSS:o({whiteSpace:"pre-wrap"},t.freeCSS)});let e=B(t);return u(D,{componentId:t.componentId,children:H,states:e})};export{v as Contenteditable,v as default};

package/dist/fn/Input/DigitCharacters.js

@@ -1 +1 @@
-import{b as t,c as p,d as V}from"../../chunk-C5N2D3ZX.js";import{jsx as I}from"react/jsx-runtime";import{useState as F}from"react";import B,{UUID as C}from"jmini";import{$$fromRoot as K,GenerateHTMLProps as W}from"../../@utils";import{OptionalInputWrapper as U,BoxWrapper as $,CoreEffects as w,DefaultBoxishStyles as P}from"./core";import{Flex as q}from"../../atoms";import{InputClasses as R}from"../../@styles/componentClasses";function j(e){let{value:a,states:l}=e,{required:u,numericOnly:o=!1,digits:f}=l,r=[];return u&&!a&&r.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"}),a&&(o&&a.match(/\D/)&&r.push({type:"invalid",label:"\u6570\u5B57\u306E\u307F\u3067\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"}),a.length!=f&&r.push({type:"warn",label:"\u6700\u5F8C\u307E\u3067\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"})),{ok:!r.filter(({type:d})=>d=="invalid"||d=="warn").length,notice:r}}const z=(e,a="")=>{let l=String(a),u=[];for(let o=0;o<e;o++)u[o]=l[o]||"";return{formatValue:u,dataValue:l}},A=(e="")=>{let a=e,l=a.join("");return{formatValue:a,dataValue:l}},G=e=>{let v=e,{tone:a,required:l,form:u,name:o,className:f="",digits:r,numericOnly:h=!1,enableFormSubmit:d,checkValidationAtFirst:J,onChange:Q,onKeyDown:X,onValidate:Y,onUpdateValue:Z,onUpdateValidValue:ee,value:N="",override:te,freeCSS:ae,wrapStyles:ne,combineInput:ie,componentID:re,listStyles:_}=v,le=V(v,["tone","required","form","name","className","digits","numericOnly","enableFormSubmit","checkValidationAtFirst","onChange","onKeyDown","onValidate","onUpdateValue","onUpdateValidValue","value","override","freeCSS","wrapStyles","combineInput","componentID","listStyles"]),[s,y]=F(p(t({componentID:e.componentID||""},z(r,N)),{eventType:"init",eventID:C()})),[S,k]=F({ok:!1,notice:[]});w.CommonEffects({type:"textfield",states:e,val_status:s,set_status:y,val_validate:S,set_validate:k,SystemValidation:j});let b=[];for(let n=0;n<r;n++){let E=s.formatValue[n],H={},x=f;e.combineInput&&(x=[f,R("DigitCharacterCell"),R("Combined")].join(" ")),b.push(I("input",{type:"text",inputMode:h?"numeric":e.inputMode||"text",value:E,id:"Digit-"+n+"-"+s.componentID,className:x,style:t(t({},e.style),H),onKeyDown:D=>{let{key:g,code:L}=D;if(g=="Tab")return;D.preventDefault();let m=null;if(g=="Backspace"){let i=s.formatValue;i[n]="",y(c=>p(t(t({},c),A(i)),{eventType:"update",eventID:C()})),m=n-1}else if(["ArrowLeft","ArrowRight"].includes(g)){let i=+(g=="ArrowRight")*2-1;m=n+i}else d&&w.SubmitForm(D,u),(()=>{let i=L.match(/^(Key(.)|Digit(\d)|Numpad(\d))/);if(!i)return;let c=i[2]||i[3]||i[4];if(h&&!c.match(/\d/)||!c)return;let T=s.formatValue;T[n]=c,y(O=>p(t(t({},O),A(T)),{eventType:"update",eventID:C()})),m=n+1})();B.is.exist(m)&&K("#Digit-"+m+"-"+s.componentID).focus()},onChange:()=>{}},n))}return I($,{val_status:s,set_status:y,val_validate:S,states:e,children:I(q,p(t({gap:"1/2",flexChilds:"even",flexWrap:!1,flexSizing:"auto"},_),{children:b}))})},M=e=>{e=t({},e),e=t({textAlign:"center",width:0},e),e.combineInput&&(e=p(t({textAlign:"center",width:0},e),{freeCSS:t({minWidth:12*2,marginRight:-1},e.freeCSS),listStyles:t({borderRadius:"2.tone.secondary",border:"unset",gap:0},e.listStyles)}));let a=W(P(e));return I(U,{componentID:e.componentID,children:G,states:a})};export{M as DigitCharacters,M as default};
+import{b as t,c as p,d as V}from"../../chunk-C5N2D3ZX.js";import{jsx as I}from"react/jsx-runtime";import{useState as F}from"react";import B,{UUID as S}from"jmini";import{$$fromRoot as K,GenerateHTMLProps as W}from"../../@utils";import{OptionalInputWrapper as U,BoxWrapper as $,CoreEffects as w,DefaultBoxishStyles as P}from"./core";import{Flex as q}from"../../atoms";import{InputClasses as R}from"../../@styles/componentClasses";function j(e){let{value:a,states:l}=e,{required:u,numericOnly:o=!1,digits:c}=l,r=[];return u&&!a&&r.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"}),a&&(o&&a.match(/\D/)&&r.push({type:"invalid",label:"\u6570\u5B57\u306E\u307F\u3067\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"}),a.length!=c&&r.push({type:"warn",label:"\u6700\u5F8C\u307E\u3067\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"})),{ok:!r.filter(({type:f})=>f=="invalid"||f=="warn").length,notice:r}}const z=(e,a="")=>{let l=String(a),u=[];for(let o=0;o<e;o++)u[o]=l[o]||"";return{formatValue:u,dataValue:l}},A=(e="")=>{let a=e,l=a.join("");return{formatValue:a,dataValue:l}},G=e=>{let v=e,{tone:a,required:l,form:u,name:o,className:c="",digits:r,numericOnly:h=!1,enableFormSubmit:f,checkValidationAtFirst:J,onChange:Q,onKeyDown:X,onValidate:Y,onUpdateValue:Z,onUpdateValidValue:ee,value:N="",override:te,freeCSS:ae,wrapStyles:ne,combineInput:ie,componentId:re,listStyles:_}=v,le=V(v,["tone","required","form","name","className","digits","numericOnly","enableFormSubmit","checkValidationAtFirst","onChange","onKeyDown","onValidate","onUpdateValue","onUpdateValidValue","value","override","freeCSS","wrapStyles","combineInput","componentId","listStyles"]),[s,y]=F(p(t({componentId:e.componentId||""},z(r,N)),{eventType:"init",eventID:S()})),[D,k]=F({ok:!1,notice:[]});w.CommonEffects({type:"textfield",states:e,val_status:s,set_status:y,val_validate:D,set_validate:k,SystemValidation:j});let b=[];for(let n=0;n<r;n++){let E=s.formatValue[n],H={},x=c;e.combineInput&&(x=[c,R("DigitCharacterCell"),R("Combined")].join(" ")),b.push(I("input",{type:"text",inputMode:h?"numeric":e.inputMode||"text",value:E,id:"Digit-"+n+"-"+s.componentId,className:x,style:t(t({},e.style),H),onKeyDown:C=>{let{key:g,code:L}=C;if(g=="Tab")return;C.preventDefault();let m=null;if(g=="Backspace"){let i=s.formatValue;i[n]="",y(d=>p(t(t({},d),A(i)),{eventType:"update",eventID:S()})),m=n-1}else if(["ArrowLeft","ArrowRight"].includes(g)){let i=+(g=="ArrowRight")*2-1;m=n+i}else f&&w.SubmitForm(C,u),(()=>{let i=L.match(/^(Key(.)|Digit(\d)|Numpad(\d))/);if(!i)return;let d=i[2]||i[3]||i[4];if(h&&!d.match(/\d/)||!d)return;let T=s.formatValue;T[n]=d,y(O=>p(t(t({},O),A(T)),{eventType:"update",eventID:S()})),m=n+1})();B.is.exist(m)&&K("#Digit-"+m+"-"+s.componentId).focus()},onChange:()=>{}},n))}return I($,{val_status:s,set_status:y,val_validate:D,states:e,children:I(q,p(t({gap:"1/2",flexChilds:"even",flexWrap:!1,flexSizing:"auto"},_),{children:b}))})},M=e=>{e=t({},e),e=t({textAlign:"center",width:0},e),e.combineInput&&(e=p(t({textAlign:"center",width:0},e),{freeCSS:t({minWidth:12*2,marginRight:-1},e.freeCSS),listStyles:t({borderRadius:"2.tone.secondary",border:"unset",gap:0},e.listStyles)}));let a=W(P(e));return I(U,{componentId:e.componentId,children:G,states:a})};export{M as DigitCharacters,M as default};

package/dist/fn/Input/Filer.js

@@ -1 +1 @@
-import{b as s,c as u,d as Q,e as U}from"../../chunk-C5N2D3ZX.js";import{Fragment as le,jsx as l,jsxs as p}from"react/jsx-runtime";import{useState as H,useEffect as X}from"react";import ie,{UUID as T,useStore as Y}from"jmini";import{$$fromRoot as V,ExtractStyles as se}from"../../@utils";import{Box as d,FAI as R,Flex as P,Column as ee}from"../../atoms";import{Row as re}from"../../mols";import{Button as L}from"../Button";import j from"../Snackbar";import{OptionalInputWrapper as pe,BoxWrapper as ue,CoreEffects as te,DefaultBoxishStyles as me}from"./core";import ce from"./TextField";import{InputFilerClasses as f}from"../../@styles/componentClasses";import{faCloudArrowUp as de}from"@fortawesome/free-solid-svg-icons/faCloudArrowUp";function fe(e){let{value:t,states:n}=e,{required:m}=n,a=[];return m&&!t.length&&a.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"}),{ok:!a.filter(({type:c})=>c=="invalid").length,notice:a}}const ae={List:e=>{let{rootStates:t,val_status:n,set_status:m}=e;if(t.useSystemOnly)return null;let a=t.limit-(n.dataValue||[]).length,c=(n.dataValue||[]).map((r,g)=>l(ae.ListCell,u(s({},e),{index:g,val_file:r}),r.name));return a>0&&c.push(l(d,u(s({htmlTag:"label"},t.cellStyles),{className:[t.cellClassName,f("AddButton")].join(" "),"data-component-id":n.componentID,htmlFor:t.id,tabIndex:t.tabIndex,onKeyDown:r=>{let{key:g}=r;t.tabIndex!=-1&&[" ","Enter"].includes(g)&&V("#"+t.id).click()},children:p(re.Center,{padding:["1/3",0],children:[l(d,{isRounded:!0,className:f("AddIcon"),children:l(R,{icon:de,className:f("Icon"),fontColor:"theme",fontSize:"4.thirdTitle",backgroundColor:"theme.opa.low",ssSphere:3,padding:"1/2"})}),p(d,{children:[p(d,{fontColor:"theme",fontSize:"2.normal",isSemiBoldFont:!0,children:["\u30D5\u30A1\u30A4\u30EB\u3092\u9078\u629E(",a,")"]}),l(d,{fontColor:"4.thin",fontSize:"0.xs",isSemiBoldFont:!0,children:"\u30D5\u30A1\u30A4\u30EB\u3092\u30C9\u30ED\u30C3\u30D7"})]})]})}),"AddButton")),l(ee,u(s({flexSizing:"auto"},se(t)),{className:t.className,children:c}))},ListCell:e=>{let{index:t,rootStates:n,val_file:m,val_status:a,set_status:c}=e,{name:r,size:g,type:o}=m,[x,D]=H(!1),B=T(),K=g.rank(),[W,M]=r.replace(/\s/,"").replace(/(.*)\.(.*)$/,"$1 $2").split(" "),i="\u30D5\u30A1\u30A4\u30EB";return o.match(/image/)?i=o.replace(/image\//,""):o.match(/pdf/)?i="PDF":o.match(/csv/)?i="CSV":o.match(/spreadsheet/)?i="SpreadSheet":o.match(/presentation/)?i="PowerPoint":o.match(/word/)?i="Word":o.match(/zip/)?i="Zip":o.match(/powerpoint/)?i="PowerPoint":o.match(/html/)?i="HTML":o.match(/js/)?i="JavaScript":o.match(/css/)?i="CSS":o.match(/text\/plain/)&&(i="\u30C6\u30AD\u30B9\u30C8"),X(()=>{x&&setTimeout(()=>{V("#"+B).focus()},100)},[x]),p(P,u(s({verticalAlign:"center",flexWrap:!1,gap:1,className:n.cellClassName},n.cellStyles),{children:[l(R.File,{fontSize:"4.thirdTitle",fontColor:"4.thin"}),p(d,{flexSizing:0,children:[l(d,{children:l(P,{verticalAlign:"center",gap:"2/3",flexWrap:!1,className:f("FileName"),children:x?l(le,{children:p(ee,{flexSizing:0,gap:"1/2",children:[p(P,{gap:"2/3",verticalAlign:"center",children:[l(ce,{tone:"border",wrapStyles:{flexSizing:"auto"},restrict:"fileName",name:"name",required:!0,id:B,form:"form-"+B,enableFormSubmit:!0,value:W,onKeyDown:C=>{let{key:N}=C;N=="Escape"&&D(!1)}}),p(d,{children:[". ",M]})]}),p(P,{gap:"2/3",horizontalAlign:"right",flexWrap:!1,children:[l(L.Sub,{padding:["2/3",1],onClick:()=>{D(!1)},children:"\u9589\u3058\u308B"}),l(L,{padding:["2/3",1],submitOption:{formName:"form-"+B,callback:C=>U(void 0,null,function*(){let{name:N}=C,b=[...a.dataValue],w=b[t],J=w.id;if(!w)return;let{target:$}=yield w.convert();if(!$)return;let y=yield String($.result).toBlob(m.type);if(!y)return;let F=new File([y],N+"."+M,{type:w.type});F.id=J,b[t]=F,c(_=>u(s({},_),{dataValue:b,eventType:"update",eventID:T()})),D(!1)})},children:"\u6C7A\u5B9A"})]})]})}):p(le,{children:[r,!!n.isNameEditable&&l(L.Clear,{ssSphere:2.5,flexSizing:"none",fontColor:"4.thin",padding:"1/3",ssEffectsOnActive:"expand",color:"cloud",onClick:()=>{D(!0)},children:l(R.Pen,{})})]})})}),!x&&p(d,{fontSize:"1.mini",fontColor:"4.thin",flexSizing:0,children:[i,"\u30D5\u30A1\u30A4\u30EB / ",K,"B"]})]}),l(L.Sub,{color:"cloud",fontColor:"4.thin",ssSphere:3,onClick:()=>{let C=[...a.dataValue];C[t]&&(C.splice(t,1),c(b=>u(s({},b),{dataValue:C,eventType:"update",eventID:T()})))},children:l(R.Times,{})})]}))}},ge=e=>{let G=e,{tone:t,required:n,form:m,isNameEditable:a,useSystemOnly:c,accept:r="*",limit:g=1,checkValidationAtFirst:o,onChange:x,onValidate:D,onUpdateValue:B,onUpdateValidValue:K,value:W=[],className:M,cellStyles:i,cellClassName:C,componentID:N,status_id:b,enableFormSubmit:w,freeCSS:J,wrapStyles:$}=G,Z=Q(G,["tone","required","form","isNameEditable","useSystemOnly","accept","limit","checkValidationAtFirst","onChange","onValidate","onUpdateValue","onUpdateValidValue","value","className","cellStyles","cellClassName","componentID","status_id","enableFormSubmit","freeCSS","wrapStyles"]),[y,F]=H(te.DefaultStatus(e.componentID||"",W)),[_,ne]=H({ok:!1,notice:[]}),oe={rootStates:e,val_status:y,set_status:F};X(()=>{Y.set({["AddFiles-"+y.componentID]:v=>{F(A=>{let I=A.dataValue,k=[];for(var S=0;S<(v==null?void 0:v.length);S++){let h=v[S],{type:E,name:z}=h;if(S+1+I.length>g){j.add({componentID:z,secondsToClose:12e3,children:`\u30D5\u30A1\u30A4\u30EB\u9078\u629E\u4E0A\u9650\u3092\u8D85\u3048\u305F\u305F\u3081\u3001${z}}\u306F\u8FFD\u52A0\u3067\u304D\u307E\u305B\u3093\u3002`,backgroundColor:"nega"});continue}if(r&&r=="image"&&!E.match(/image/)){j.add({componentID:z,secondsToClose:12e3,children:`\u30D5\u30A1\u30A4\u30EB\u5F62\u5F0F\u304C\u7570\u306A\u308B\u305F\u3081\u3001${z} \u306F\u8FFD\u52A0\u3067\u304D\u307E\u305B\u3093\u3002`,backgroundColor:"nega"});continue}k.push(h)}return u(s({},A),{dataValue:[...I,...k],eventType:"update",eventID:T()})})}})},[]),te.CommonEffects({type:"file",states:e,val_status:y,set_status:F,val_validate:_,set_validate:ne,SystemValidation:fe});let O="";return r&&(r=="image"?O="image/png,image/jpeg":O=r),p(ue,{val_status:y,set_status:F,val_validate:_,states:e,children:[l(d,u(s({htmlTag:"input",type:"file",className:f("Input"),"data-component-id":y.componentID,accept:O,multiple:g!=1,onChange:v=>U(void 0,null,function*(){x&&x(v);let A=v.target,I=A.files,k=[];for(var S=0;S<(I==null?void 0:I.length);S++){let h=I[S],E=h.name;if(h.id=T(),S+1+y.dataValue.length>g){j.add({componentID:E,secondsToClose:12e3,children:`\u30D5\u30A1\u30A4\u30EB\u767B\u9332\u6570\u3092\u8D85\u3048\u305F\u305F\u3081\u3001${E}}\u306F\u8FFD\u52A0\u3067\u304D\u307E\u305B\u3093\u3067\u3057\u305F\u3002`,backgroundColor:"nega"});continue}k.push(h)}F(h=>u(s({},h),{dataValue:[...h.dataValue,...k],eventType:"update",eventID:T()})),A.value=""})},Z),{opacity:"low",tabIndex:-1,value:""})),l(ae.List,s({},oe))]})},q=e=>(e=u(s({limit:1,isNameEditable:!0,useSystemOnly:!1,tone:"border",value:[]},e),{override:"force",cellStyles:s(s({},me({tone:e.tone||"border"})),e.cellStyles)}),l(pe,{componentID:e.componentID,children:ge,states:e}));q.fn={openDialog:e=>{let{multiple:t,accept:n}=e;return new Promise(m=>{const a=document.createElement("input");a.type="file",a.multiple=t!=null?t:!0,n&&(n=="image"?a.accept="image/png,image/jpeg":a.accept=n),a.onchange=c=>{m(c.target.files)},a.click()})}},typeof window!="undefined"&&window.document&&ie(document).addEvent({eventType:"dragover",callback:e=>{e.preventDefault(),V("."+f("AddButton")).addClass(f("Draggable"))},options:{passive:!1}}).addEvent({eventType:"drop",callback:e=>{e.preventDefault(),V("."+f("AddButton")).removeClass(f("Draggable"));let t=e.dataTransfer.files;if(t.length){let n=e.target;if(V(n).hasClass(f("AddButton"))){let{componentId:m}=n.dataset,a=Y.get("AddFiles-"+m);a&&a(t)}}},options:{passive:!1}});export{q as Filer,q as default};
+import{b as s,c as u,d as G,e as U}from"../../chunk-C5N2D3ZX.js";import{Fragment as le,jsx as l,jsxs as p}from"react/jsx-runtime";import{useState as H,useEffect as Q}from"react";import ie,{UUID as T,useStore as Y}from"jmini";import{$$fromRoot as _,ExtractStyles as se}from"../../@utils";import{Box as d,FAI as R,Flex as P,Column as ee}from"../../atoms";import{Row as re}from"../../mols";import{Button as L}from"../Button";import j from"../Snackbar";import{OptionalInputWrapper as pe,BoxWrapper as ue,CoreEffects as te,DefaultBoxishStyles as ce}from"./core";import me from"./TextField";import{InputFilerClasses as f}from"../../@styles/componentClasses";import{faCloudArrowUp as de}from"@fortawesome/free-solid-svg-icons/faCloudArrowUp";function fe(e){let{value:t,states:n}=e,{required:c}=n,a=[];return c&&!t.length&&a.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"}),{ok:!a.filter(({type:m})=>m=="invalid").length,notice:a}}const ae={List:e=>{let{rootStates:t,val_status:n,set_status:c}=e;if(t.useSystemOnly)return null;let a=t.limit-(n.dataValue||[]).length,m=(n.dataValue||[]).map((r,g)=>l(ae.ListCell,u(s({},e),{index:g,val_file:r}),r.name));return a>0&&m.push(l(d,u(s({htmlTag:"label"},t.cellStyles),{className:[t.cellClassName,f("AddButton")].join(" "),"data-component-id":n.componentId,htmlFor:t.id,tabIndex:t.tabIndex,onKeyDown:r=>{let{key:g}=r;t.tabIndex!=-1&&[" ","Enter"].includes(g)&&_("#"+t.id).click()},children:p(re.Center,{padding:["1/3",0],children:[l(d,{isRounded:!0,className:f("AddIcon"),children:l(R,{icon:de,className:f("Icon"),fontColor:"theme",fontSize:"4.thirdTitle",backgroundColor:"theme.opa.low",ssSphere:3,padding:"1/2"})}),p(d,{children:[p(d,{fontColor:"theme",fontSize:"2.normal",isSemiBoldFont:!0,children:["\u30D5\u30A1\u30A4\u30EB\u3092\u9078\u629E(",a,")"]}),l(d,{fontColor:"4.thin",fontSize:"0.xs",isSemiBoldFont:!0,children:"\u30D5\u30A1\u30A4\u30EB\u3092\u30C9\u30ED\u30C3\u30D7"})]})]})}),"AddButton")),l(ee,u(s({flexSizing:"auto"},se(t)),{className:t.className,children:m}))},ListCell:e=>{let{index:t,rootStates:n,val_file:c,val_status:a,set_status:m}=e,{name:r,size:g,type:o}=c,[x,B]=H(!1),N=T(),K=g.rank(),[W,M]=r.replace(/\s/,"").replace(/(.*)\.(.*)$/,"$1 $2").split(" "),i="\u30D5\u30A1\u30A4\u30EB";return o.match(/image/)?i=o.replace(/image\//,""):o.match(/pdf/)?i="PDF":o.match(/csv/)?i="CSV":o.match(/spreadsheet/)?i="SpreadSheet":o.match(/presentation/)?i="PowerPoint":o.match(/word/)?i="Word":o.match(/zip/)?i="Zip":o.match(/powerpoint/)?i="PowerPoint":o.match(/html/)?i="HTML":o.match(/js/)?i="JavaScript":o.match(/css/)?i="CSS":o.match(/text\/plain/)&&(i="\u30C6\u30AD\u30B9\u30C8"),Q(()=>{x&&setTimeout(()=>{_("#"+N).focus()},100)},[x]),p(P,u(s({verticalAlign:"center",flexWrap:!1,gap:1,className:n.cellClassName},n.cellStyles),{children:[l(R.File,{fontSize:"4.thirdTitle",fontColor:"4.thin"}),p(d,{flexSizing:0,children:[l(d,{children:l(P,{verticalAlign:"center",gap:"2/3",flexWrap:!1,className:f("FileName"),children:x?l(le,{children:p(ee,{flexSizing:0,gap:"1/2",children:[p(P,{gap:"2/3",verticalAlign:"center",children:[l(me,{tone:"border",wrapStyles:{flexSizing:"auto"},restrict:"fileName",name:"name",required:!0,id:N,form:"form-"+N,enableFormSubmit:!0,value:W,onKeyDown:C=>{let{key:w}=C;w=="Escape"&&B(!1)}}),p(d,{children:[". ",M]})]}),p(P,{gap:"2/3",horizontalAlign:"right",flexWrap:!1,children:[l(L.Sub,{padding:["2/3",1],onClick:()=>{B(!1)},children:"\u9589\u3058\u308B"}),l(L,{padding:["2/3",1],submitOption:{formName:"form-"+N,callback:C=>U(void 0,null,function*(){let{name:w}=C,b=[...a.dataValue],A=b[t],J=A.id;if(!A)return;let{target:$}=yield A.convert();if(!$)return;let y=yield String($.result).toBlob(c.type);if(!y)return;let F=new File([y],w+"."+M,{type:A.type});F.id=J,b[t]=F,m(D=>u(s({},D),{dataValue:b,eventType:"update",eventID:T()})),B(!1)})},children:"\u6C7A\u5B9A"})]})]})}):p(le,{children:[r,!!n.isNameEditable&&l(L.Clear,{ssSphere:2.5,flexSizing:"none",fontColor:"4.thin",padding:"1/3",ssEffectsOnActive:"expand",color:"cloud",onClick:()=>{B(!0)},children:l(R.Pen,{})})]})})}),!x&&p(d,{fontSize:"1.mini",fontColor:"4.thin",flexSizing:0,children:[i,"\u30D5\u30A1\u30A4\u30EB / ",K,"B"]})]}),l(L.Sub,{color:"cloud",fontColor:"4.thin",ssSphere:3,onClick:()=>{let C=[...a.dataValue];C[t]&&(C.splice(t,1),m(b=>u(s({},b),{dataValue:C,eventType:"update",eventID:T()})))},children:l(R.X,{})})]}))}},ge=e=>{let Z=e,{tone:t,required:n,form:c,isNameEditable:a,useSystemOnly:m,accept:r="*",limit:g=1,checkValidationAtFirst:o,onChange:x,onValidate:B,onUpdateValue:N,onUpdateValidValue:K,value:W=[],className:M,cellStyles:i,cellClassName:C,componentId:w,status_id:b,enableFormSubmit:A,freeCSS:J,wrapStyles:$}=Z,X=G(Z,["tone","required","form","isNameEditable","useSystemOnly","accept","limit","checkValidationAtFirst","onChange","onValidate","onUpdateValue","onUpdateValidValue","value","className","cellStyles","cellClassName","componentId","status_id","enableFormSubmit","freeCSS","wrapStyles"]),[y,F]=H(te.DefaultStatus(e.componentId||"",W)),[D,ne]=H({ok:!1,notice:[]}),oe={rootStates:e,val_status:y,set_status:F};Q(()=>{Y.set({["AddFiles-"+y.componentId]:v=>{F(k=>{let I=k.dataValue,V=[];for(var S=0;S<(v==null?void 0:v.length);S++){let h=v[S],{type:E,name:z}=h;if(S+1+I.length>g){j.add({componentId:z,secondsToClose:12e3,children:`\u30D5\u30A1\u30A4\u30EB\u9078\u629E\u4E0A\u9650\u3092\u8D85\u3048\u305F\u305F\u3081\u3001${z}}\u306F\u8FFD\u52A0\u3067\u304D\u307E\u305B\u3093\u3002`,backgroundColor:"nega"});continue}if(r&&r=="image"&&!E.match(/image/)){j.add({componentId:z,secondsToClose:12e3,children:`\u30D5\u30A1\u30A4\u30EB\u5F62\u5F0F\u304C\u7570\u306A\u308B\u305F\u3081\u3001${z} \u306F\u8FFD\u52A0\u3067\u304D\u307E\u305B\u3093\u3002`,backgroundColor:"nega"});continue}V.push(h)}return u(s({},k),{dataValue:[...I,...V],eventType:"update",eventID:T()})})}})},[]),te.CommonEffects({type:"file",states:e,val_status:y,set_status:F,val_validate:D,set_validate:ne,SystemValidation:fe});let O="";return r&&(r=="image"?O="image/png,image/jpeg":O=r),p(ue,{val_status:y,set_status:F,val_validate:D,states:e,children:[l(d,u(s({htmlTag:"input",type:"file",className:f("Input"),"data-component-id":y.componentId,accept:O,multiple:g!=1,onChange:v=>U(void 0,null,function*(){x&&x(v);let k=v.target,I=k.files,V=[];for(var S=0;S<(I==null?void 0:I.length);S++){let h=I[S],E=h.name;if(h.id=T(),S+1+y.dataValue.length>g){j.add({componentId:E,secondsToClose:12e3,children:`\u30D5\u30A1\u30A4\u30EB\u767B\u9332\u6570\u3092\u8D85\u3048\u305F\u305F\u3081\u3001${E}}\u306F\u8FFD\u52A0\u3067\u304D\u307E\u305B\u3093\u3067\u3057\u305F\u3002`,backgroundColor:"nega"});continue}V.push(h)}F(h=>u(s({},h),{dataValue:[...h.dataValue,...V],eventType:"update",eventID:T()})),k.value=""})},X),{opacity:"low",tabIndex:-1,value:""})),l(ae.List,s({},oe))]})},q=e=>(e=u(s({limit:1,isNameEditable:!0,useSystemOnly:!1,tone:"border",value:[]},e),{override:"force",cellStyles:s(s({},ce({tone:e.tone||"border"})),e.cellStyles)}),l(pe,{componentId:e.componentId,children:ge,states:e}));q.fn={openDialog:e=>{let{multiple:t,accept:n}=e;return new Promise(c=>{const a=document.createElement("input");a.type="file",a.multiple=t!=null?t:!0,n&&(n=="image"?a.accept="image/png,image/jpeg":a.accept=n),a.onchange=m=>{c(m.target.files)},a.click()})}},typeof window!="undefined"&&window.document&&ie(document).addEvent({eventType:"dragover",callback:e=>{e.preventDefault(),_("."+f("AddButton")).addClass(f("Draggable"))},options:{passive:!1}}).addEvent({eventType:"drop",callback:e=>{e.preventDefault(),_("."+f("AddButton")).removeClass(f("Draggable"));let t=e.dataTransfer.files;if(t.length){let n=e.target;if(_(n).hasClass(f("AddButton"))){let{componentId:c}=n.dataset,a=Y.get("AddFiles-"+c);a&&a(t)}}},options:{passive:!1}});export{q as Filer,q as default};

package/dist/fn/Input/Hidden.d.ts

@@ -2,7 +2,7 @@
 import { KeyValueDict } from 'jmini';
 declare namespace Hidden {
     type Input = React.DOMAttributes<HTMLInputElement> & {
-        componentID?: string;
+        componentId?: string;
         name?: string;
         form?: string;
         enableFormSubmit?: boolean;

package/dist/fn/Input/Hidden.js

@@ -1 +1 @@
-import{b as n,c as a,d as s}from"../../chunk-C5N2D3ZX.js";import{jsx as m}from"react/jsx-runtime";import p,{UUID as r}from"jmini";import{useState as l,useEffect as D}from"react";import{OptionalInputWrapper as b,CoreEffects as V}from"./core";const g=t=>{let u=t,{componentID:c="",enableFormSubmit:H,form:S,value:e=""}=u,I=s(u,["componentID","enableFormSubmit","form","value"]),[o,i]=l({componentID:t.componentID||"",dataValue:e,eventType:"init",eventID:r()}),[f,v]=l({ok:!1,notice:[]});return D(()=>{p.is.equal(o.dataValue,e)||i(y=>a(n({},y),{dataValue:e,eventType:"update",eventID:r()}))},[t.value]),V.CommonEffects({type:"hidden",states:t,val_status:o,set_status:i,val_validate:f,set_validate:v,SystemValidation:()=>({ok:!0,notice:[]})}),m("input",a(n({value:p.Stringify(e),"data-component-id":c},I),{type:"hidden"}))},d=t=>m(b,{componentID:t.componentID,children:g,states:t});export{d as Hidden,d as default};
+import{b as n,c as a,d}from"../../chunk-C5N2D3ZX.js";import{jsx as m}from"react/jsx-runtime";import s,{UUID as p}from"jmini";import{useState as r,useEffect as b}from"react";import{OptionalInputWrapper as V,CoreEffects as g}from"./core";const D=t=>{let u=t,{componentId:c="",enableFormSubmit:H,form:S,value:e=""}=u,I=d(u,["componentId","enableFormSubmit","form","value"]),[o,i]=r({componentId:t.componentId||"",dataValue:e,eventType:"init",eventID:p()}),[f,v]=r({ok:!1,notice:[]});return b(()=>{s.is.equal(o.dataValue,e)||i(y=>a(n({},y),{dataValue:e,eventType:"update",eventID:p()}))},[t.value]),g.CommonEffects({type:"hidden",states:t,val_status:o,set_status:i,val_validate:f,set_validate:v,SystemValidation:()=>({ok:!0,notice:[]})}),m("input",a(n({value:s.Stringify(e),"data-component-id":c},I),{type:"hidden"}))},l=t=>m(V,{componentId:t.componentId,children:D,states:t});export{l as Hidden,l as default};

package/dist/fn/Input/Label.d.ts

@@ -1,6 +1,6 @@
 import { StyleTags, ReactElement } from '../../@declares';
 export declare const InputLabel: (p: {
-    componentID: string;
+    componentId: string;
     isActive: boolean;
     required?: boolean;
     fontSize?: StyleTags.Fonts.Size;

package/dist/fn/Input/Label.js

@@ -1 +1 @@
-import{b as l,c as p}from"../../chunk-C5N2D3ZX.js";import{jsx as m,jsxs as x}from"react/jsx-runtime";import{useState as b,useEffect as c}from"react";import a from"jmini";import{Box as d,Span as g}from"../../atoms";import{Row as h}from"../../mols";const D=t=>{if(!t.label)return null;let[r,s]=b({});return c(()=>{let f=a('[data-input-origin="'+t.componentID+'"]'),e=a('[data-input-label="'+t.componentID+'"]'),u=a('[data-input-value-shallow="'+t.componentID+'"]');if(!f[0]||!e[0]||!u[0])return;let i=f.position(),o=u.position();if(t.isActive){let n=o.left-i.left;s({opacity:"max",backgroundColor:"layer.1",freeCSS:{fontSize:"12px",lineHeight:1,transform:`translate(${n}px,-6px)`}})}else{let n=o.left-i.left,S=o.top-i.top;s({fontSize:t.fontSize||"inherit",opacity:"middle",backgroundColor:"trans",freeCSS:{lineHeight:"inherit",transform:`translate(${n}px,${S}px)`}})}e.getAttribute("data-label-init")=="true"&&e.setAttribute("data-label-init","false").await(10).css({transition:".25s"})},[t.isActive]),m(d,p(l({htmlTag:"label","data-input-label":t.componentID,"data-label-init":"true",position:"absolute",left:0,top:0,fontColor:"3.blur",backgroundColor:"trans",borderRadius:"1/3",padding:[0,"1/4"],opacity:"min",fontHeight:"inherit"},r),{freeCSS:l({zIndex:2,transformOrigin:"top left",pointerEvents:"none"},r.freeCSS),children:x(h.Left,{gap:"1/3",children:[t.label,t.required&&m(g,{fontColor:"nega",children:" * "})]})}))};export{D as InputLabel};
+import{b as l,c as p}from"../../chunk-C5N2D3ZX.js";import{jsx as d,jsxs as x}from"react/jsx-runtime";import{useState as S,useEffect as b}from"react";import a from"jmini";import{Box as c,Span as g}from"../../atoms";import{Row as h}from"../../mols";const $=t=>{if(!t.label)return null;let[r,s]=S({});return b(()=>{let f=a('[data-input-origin="'+t.componentId+'"]'),e=a('[data-input-label="'+t.componentId+'"]'),u=a('[data-input-value-shallow="'+t.componentId+'"]');if(!f[0]||!e[0]||!u[0])return;let i=f.position(),o=u.position();if(t.isActive){let n=o.left-i.left;s({opacity:"max",backgroundColor:"layer.1",freeCSS:{fontSize:"12px",lineHeight:1,transform:`translate(${n}px,-6px)`}})}else{let n=o.left-i.left,m=o.top-i.top;s({fontSize:t.fontSize||"inherit",opacity:"middle",backgroundColor:"trans",freeCSS:{lineHeight:"inherit",transform:`translate(${n}px,${m}px)`}})}e.getAttribute("data-label-init")=="true"&&e.setAttribute("data-label-init","false").await(10).css({transition:".25s"})},[t.isActive]),d(c,p(l({htmlTag:"label","data-input-label":t.componentId,"data-label-init":"true",position:"absolute",left:0,top:0,fontColor:"3.blur",backgroundColor:"trans",borderRadius:"1/3",padding:[0,"1/4"],opacity:"min",fontHeight:"inherit"},r),{freeCSS:l({zIndex:2,transformOrigin:"top left",pointerEvents:"none"},r.freeCSS),children:x(h.Left,{gap:"1/3",children:[t.label,t.required&&d(g,{fontColor:"nega",children:" * "})]})}))};export{$ as InputLabel};

package/dist/fn/Input/List.js

@@ -1 +1 @@
-import{b as o,c as d,d as B}from"../../chunk-C5N2D3ZX.js";import{jsx as a}from"react/jsx-runtime";import S,{UUID as w}from"jmini";import{useState as ie}from"react";import{$$fromRoot as ne,GenerateHTMLProps as se}from"../../@utils";import{Box as I,Flex as re,FAI as ce,Span as ue}from"../../atoms";import{Button as de}from"../Button";import{OptionalInputWrapper as me,BoxWrapper as pe,CoreEffects as M}from"./core";import{InputListClasses as T}from"../../@styles/componentClasses";function Ce(t){let{value:l,states:i}=t,{type:e,required:s,min:n,max:p}=i;n=n||0,p=p||65535;let r=[],y=l.length;return s&&(y||e=="radio"&&r.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"})),y<n&&r.push({type:"invalid",label:n+"\u500B\u4EE5\u4E0A\u9078\u629E\u3057\u3066\u304F\u3060\u3055\u3044"}),y>p&&r.push({type:"invalid",label:p+"\u500B\u307E\u3067\u9078\u629E\u3067\u304D\u307E\u3059"}),{ok:!r.filter(({type:g})=>g=="invalid").length,notice:r}}const h={InitOptions:t=>{let l=[];return t.forEach(i=>{let{label:e,value:s}=i;S.is.nullish(e)&&(e=String(s)),l.push(d(o({},i),{label:e,value:s}))}),l},OptionalListWrapper:t=>{let{value:l,options:i=[]}=t,e=S.is.exist(l)?S.flatArray(l):[],s=[];return e.forEach(n=>{i.findIndex(r=>S.is.equal(r.value,n))!=-1&&s.push(n)}),a(h.Core,d(o({},t),{value:s,options:i}))},Core:t=>{let D=t,{type:l,tone:i,required:e,componentID:s="",form:n,override:p,icon:r,iconType:y,iconSize:g,iconPosition:P,iconColor:V,CustomIcon:X,enableFormSubmit:A,checkValidationAtFirst:$,onValidate:W,onUpdateValue:v,onUpdateValidValue:H,value:_,options:U,className:b,cellStyles:K,cellClassName:q,cellCheckedStyles:j,cellCheckedClassName:G,min:Q,max:Y,hideInput:E,freeCSS:m,wrapStyles:N}=D,x=B(D,["type","tone","required","componentID","form","override","icon","iconType","iconSize","iconPosition","iconColor","CustomIcon","enableFormSubmit","checkValidationAtFirst","onValidate","onUpdateValue","onUpdateValidValue","value","options","className","cellStyles","cellClassName","cellCheckedStyles","cellCheckedClassName","min","max","hideInput","freeCSS","wrapStyles"]),[L,C]=ie(M.DefaultStatus(s,_)),[O,Z]=ie({ok:!1,notice:[]});return M.CommonEffects({type:"list."+l,states:t,val_status:L,set_status:C,val_validate:O,set_validate:Z,SystemValidation:Ce}),a(pe,{val_status:L,set_status:C,val_validate:O,states:t,children:a(h.List,{rootStates:t,val_status:L,set_status:C})})},List:t=>{let{rootStates:l,val_status:i,set_status:e}=t,{componentID:s,type:n,tone:p,icon:r,iconSize:y,iconColor:g,isChecker:P,options:V,name:X,form:A,tabIndex:$,hideInput:W,disabled:v,className:H,cellStyles:_,cellClassName:U="",cellCheckedStyles:b,cellCheckedClassName:K="",enableFormSubmit:q}=l,{dataValue:j}=i,G=l.CustomIcon,Q=V.map((Y,E)=>{let le=Y,{value:m,label:N,disabled:x,className:L="",checkedStyles:C,checkedClassName:O="",freeCSS:Z}=le,D=B(le,["value","label","disabled","className","checkedStyles","checkedClassName","freeCSS"]),ee=w(),R=j.findIndex(c=>c===m)!=-1,f=o(o({},_),D),z=[T("Label"),U,L];R&&(f=d(o(o(o({},f),b),C),{freeCSS:o(o(o({},f==null?void 0:f.freeCSS),b==null?void 0:b.freeCSS),C==null?void 0:C.freeCSS)}),z=[...z,K,O]);const te=()=>{if(v||x)return;let c=[];if(n=="radio")c=[m];else if(n=="checkbox"||P)if(!R)c=[...i.dataValue,m];else{let u=[...i.dataValue];u.splice(i.dataValue.findIndex(F=>F==m),1),c=u}e(u=>d(o({},u),{dataValue:c,eventType:"update",eventID:w()}))};let oe=[a(ue,{position:"relative",freeCSS:{zIndex:2},flexSizing:0,children:S.is.string(N)?a(I,{children:N}):N},"content")];return r&&oe[l.iconPosition=="right"?"push":"unshift"](a(G,{isChecked:R,iconSize:y,iconColor:g,toggle:te},"icon")),[a(I,{htmlTag:"input",type:n=="radio"?"radio":"checkbox",className:T("Input"),name:"RadioCheckbox-"+X,"data-list-index":s+"-"+E,id:ee,value:String(m),disabled:v||x,checked:R,onFocus:c=>{x||n=="radio"&&(i.dataValue.length||e(u=>d(o({},u),{dataValue:[m],eventType:"update",eventID:w()})))},onChange:()=>{te()},onKeyDown:c=>{let{key:u,shiftKey:F}=c;if((n=="checkbox"||t.rootStates.isChecker)&&u!="Tab"){if(u.match(/Arrow/)){c.preventDefault();let ae=["ArrowLeft","ArrowUp"].includes(u)?-1:1,k=E+ae;k<0?k=V.length-1:k>=V.length&&(k=0),ne(`input[data-list-index="${s}-${k}"]`).focus()}}q&&M.SubmitForm(c,A)},tabIndex:$},"List-"+S.Stringify(m)),a(I,d(o({htmlTag:"label","data-disabled":v||x,htmlFor:ee,className:z.join(" "),tabIndex:-1,display:"flex",verticalAlign:"center",flexWrap:!1},f),{children:oe}),"ListTrigger-"+S.Stringify(m))]});return a(re,{flexSizing:"auto",style:l.style,freeCSS:o({},l.freeCSS),className:[H,T("CellBase"),T("HideInput_"+W),T("IconIndicator_"+!!r),T("Tone_"+p)].join(" "),children:Q})},_Icon:t=>{let l=1.5;return t.iconSize=="small"?l=1.2:t.iconSize=="large"&&(l=2),a(de.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,d(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,d(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(ce.Check,{transition:"middle",opacity:t.isChecked?"max":"trans",freeCSS:{zIndex:8,width:"100%",height:"100%",transform:t.isChecked?"scale(1)":"scale(.5)"}})})}))},J=t=>{t=t||"checkbox";const l=e=>(e=d(o({gap:1,icon:!0,iconSize:"regular",iconType:t=="radio"?"radio":"checkbox",iconPosition:"left",iconColor:"theme"},e),{type:t,cellStyles:o({gap:"1/6",position:"relative",borderRadius:"2.tone.secondary",transition:"middle"},e.cellStyles)}),e.CustomIcon||(e.iconType=="radio"?e.CustomIcon=h.RadioIcon:e.iconType=="checkbox"&&(e.CustomIcon=h.CheckboxIcon)),e.iconSize=="small"?e.cellStyles.gap=0:e.iconSize=="large"&&(e.cellStyles.gap="1/2"),e.tone=="normal"?(e.cellStyles=o({padding:["1/4",1],border:"1.thin",backgroundColor:"layer.1"},e.cellStyles),e.cellCheckedStyles=o({borderColor:"theme",fontColor:"theme",boxShadow:"1.normal"},e.cellCheckedStyles)):e.tone=="border"?(e.cellStyles=o({border:"1.thin",backgroundColor:"layer.1",padding:["1/2",1,"1/2","1/2"]},e.cellStyles),e.cellCheckedStyles=o({borderColor:"theme",fontColor:"theme"},e.cellCheckedStyles)):e.tone=="cloud"&&(e.cellStyles=o({border:"1.thin",backgroundColor:"layer.2",padding:["1/2",1,"1/2","1/2"]},e.cellStyles),e.cellCheckedStyles=o({backgroundColor:"cloud",fontColor:"theme"},e.cellCheckedStyles)),e=se(e),e.options=h.InitOptions(e.options),a(me,{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},he=J("radio"),Se=J("checkbox"),ye=J();export{Se as Checkbox,ye as List,he as Radio};
+import{b as o,c as u,d as B}from"../../chunk-C5N2D3ZX.js";import{jsx as a}from"react/jsx-runtime";import S,{UUID as w}from"jmini";import{useState as ie}from"react";import{$$fromRoot as ne,GenerateHTMLProps as se}from"../../@utils";import{Box as I,Flex as re,FAI as ce,Span as de}from"../../atoms";import{Button as ue}from"../Button";import{OptionalInputWrapper as me,BoxWrapper as pe,CoreEffects as M}from"./core";import{InputListClasses as T}from"../../@styles/componentClasses";function Ce(t){let{value:l,states:i}=t,{type:e,required:s,min:n,max:p}=i;n=n||0,p=p||65535;let r=[],y=l.length;return s&&(y||e=="radio"&&r.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"})),y<n&&r.push({type:"invalid",label:n+"\u500B\u4EE5\u4E0A\u9078\u629E\u3057\u3066\u304F\u3060\u3055\u3044"}),y>p&&r.push({type:"invalid",label:p+"\u500B\u307E\u3067\u9078\u629E\u3067\u304D\u307E\u3059"}),{ok:!r.filter(({type:g})=>g=="invalid").length,notice:r}}const h={InitOptions:t=>{let l=[];return t.forEach(i=>{let{label:e,value:s}=i;S.is.nullish(e)&&(e=String(s)),l.push(u(o({},i),{label:e,value:s}))}),l},OptionalListWrapper:t=>{let{value:l,options:i=[]}=t,e=S.is.exist(l)?S.flatArray(l):[],s=[];return e.forEach(n=>{i.findIndex(r=>S.is.equal(r.value,n))!=-1&&s.push(n)}),a(h.Core,u(o({},t),{value:s,options:i}))},Core:t=>{let R=t,{type:l,tone:i,required:e,componentId:s="",form:n,override:p,icon:r,iconType:y,iconSize:g,iconPosition:P,iconColor:V,CustomIcon:X,enableFormSubmit:A,checkValidationAtFirst:$,onValidate:W,onUpdateValue:v,onUpdateValidValue:H,value:E,options:U,className:b,cellStyles:K,cellClassName:q,cellCheckedStyles:j,cellCheckedClassName:G,min:Q,max:Y,hideInput:z,freeCSS:m,wrapStyles:N}=R,x=B(R,["type","tone","required","componentId","form","override","icon","iconType","iconSize","iconPosition","iconColor","CustomIcon","enableFormSubmit","checkValidationAtFirst","onValidate","onUpdateValue","onUpdateValidValue","value","options","className","cellStyles","cellClassName","cellCheckedStyles","cellCheckedClassName","min","max","hideInput","freeCSS","wrapStyles"]),[L,C]=ie(M.DefaultStatus(s,E)),[O,Z]=ie({ok:!1,notice:[]});return M.CommonEffects({type:"list."+l,states:t,val_status:L,set_status:C,val_validate:O,set_validate:Z,SystemValidation:Ce}),a(pe,{val_status:L,set_status:C,val_validate:O,states:t,children:a(h.List,{rootStates:t,val_status:L,set_status:C})})},List:t=>{let{rootStates:l,val_status:i,set_status:e}=t,{componentId:s,type:n,tone:p,icon:r,iconSize:y,iconColor:g,isChecker:P,options:V,name:X,form:A,tabIndex:$,hideInput:W,disabled:v,className:H,cellStyles:E,cellClassName:U="",cellCheckedStyles:b,cellCheckedClassName:K="",enableFormSubmit:q}=l,{dataValue:j}=i,G=l.CustomIcon,Q=V.map((Y,z)=>{let le=Y,{value:m,label:N,disabled:x,className:L="",checkedStyles:C,checkedClassName:O="",freeCSS:Z}=le,R=B(le,["value","label","disabled","className","checkedStyles","checkedClassName","freeCSS"]),ee=w(),_=j.findIndex(c=>c===m)!=-1,f=o(o({},E),R),D=[T("Label"),U,L];_&&(f=u(o(o(o({},f),b),C),{freeCSS:o(o(o({},f==null?void 0:f.freeCSS),b==null?void 0:b.freeCSS),C==null?void 0:C.freeCSS)}),D=[...D,K,O]);const te=()=>{if(v||x)return;let c=[];if(n=="radio")c=[m];else if(n=="checkbox"||P)if(!_)c=[...i.dataValue,m];else{let d=[...i.dataValue];d.splice(i.dataValue.findIndex(F=>F==m),1),c=d}e(d=>u(o({},d),{dataValue:c,eventType:"update",eventID:w()}))};let oe=[a(de,{position:"relative",freeCSS:{zIndex:2},flexSizing:0,children:S.is.string(N)?a(I,{children:N}):N},"content")];return r&&oe[l.iconPosition=="right"?"push":"unshift"](a(G,{isChecked:_,iconSize:y,iconColor:g,toggle:te},"icon")),[a(I,{htmlTag:"input",type:n=="radio"?"radio":"checkbox",className:T("Input"),name:"RadioCheckbox-"+X,"data-list-index":s+"-"+z,id:ee,value:String(m),disabled:v||x,checked:_,onFocus:c=>{x||n=="radio"&&(i.dataValue.length||e(d=>u(o({},d),{dataValue:[m],eventType:"update",eventID:w()})))},onChange:()=>{te()},onKeyDown:c=>{let{key:d,shiftKey:F}=c;if((n=="checkbox"||t.rootStates.isChecker)&&d!="Tab"){if(d.match(/Arrow/)){c.preventDefault();let ae=["ArrowLeft","ArrowUp"].includes(d)?-1:1,k=z+ae;k<0?k=V.length-1:k>=V.length&&(k=0),ne(`input[data-list-index="${s}-${k}"]`).focus()}}q&&M.SubmitForm(c,A)},tabIndex:$},"List-"+S.Stringify(m)),a(I,u(o({htmlTag:"label","data-disabled":v||x,htmlFor:ee,className:D.join(" "),tabIndex:-1,display:"flex",verticalAlign:"center",flexWrap:!1},f),{children:oe}),"ListTrigger-"+S.Stringify(m))]});return a(re,{flexSizing:"auto",style:l.style,freeCSS:o({},l.freeCSS),className:[H,T("CellBase"),T("HideInput_"+W),T("IconIndicator_"+!!r),T("Tone_"+p)].join(" "),children:Q})},_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,u(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,u(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(ce.Check,{transition:"middle",opacity:t.isChecked?"max":"trans",freeCSS:{zIndex:8,width:"100%",height:"100%",transform:t.isChecked?"scale(1)":"scale(.5)"}})})}))},J=t=>{t=t||"checkbox";const l=e=>(e=u(o({gap:1,icon:!0,iconSize:"regular",iconType:t=="radio"?"radio":"checkbox",iconPosition:"left",iconColor:"theme"},e),{type:t,cellStyles:o({gap:"1/6",position:"relative",borderRadius:"2.tone.secondary",transition:"middle"},e.cellStyles)}),e.CustomIcon||(e.iconType=="radio"?e.CustomIcon=h.RadioIcon:e.iconType=="checkbox"&&(e.CustomIcon=h.CheckboxIcon)),e.iconSize=="small"?e.cellStyles.gap=0:e.iconSize=="large"&&(e.cellStyles.gap="1/2"),e.tone=="normal"?(e.cellStyles=o({padding:["1/4",1],border:"1.thin",backgroundColor:"layer.1"},e.cellStyles),e.cellCheckedStyles=o({borderColor:"theme",fontColor:"theme",boxShadow:"1.normal"},e.cellCheckedStyles)):e.tone=="border"?(e.cellStyles=o({border:"1.thin",backgroundColor:"layer.1",padding:["1/2",1,"1/2","1/2"]},e.cellStyles),e.cellCheckedStyles=o({borderColor:"theme",fontColor:"theme"},e.cellCheckedStyles)):e.tone=="cloud"&&(e.cellStyles=o({border:"1.thin",backgroundColor:"layer.2",padding:["1/2",1,"1/2","1/2"]},e.cellStyles),e.cellCheckedStyles=o({backgroundColor:"cloud",fontColor:"theme"},e.cellCheckedStyles)),e=se(e),e.options=h.InitOptions(e.options),a(me,{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},he=J("radio"),Se=J("checkbox"),ye=J();export{Se as Checkbox,ye as List,he as Radio};

package/dist/fn/Input/Segmented.js

@@ -1 +1 @@
-import{b as e,c as n,d as C}from"../../chunk-C5N2D3ZX.js";import{jsx as r}from"react/jsx-runtime";import{UUID as x}from"jmini";import{useState as a}from"react";import{Radio as w}from"./List";import{InputSegmentedClasses as u}from"../../@styles/componentClasses";const E=t=>{let i=t,{__sys_segmented_type:o,tone:B,value:d,options:S,onUpdateValue:h,onUpdateValidValue:p,enableFormSubmit:M,checkValidationAtFirst:R,cellStyles:g,cellClassName:_,cellCheckedClassName:b,cellCheckedStyles:f,freeCSS:k,wrapStyles:J}=i,I=C(i,["__sys_segmented_type","tone","value","options","onUpdateValue","onUpdateValidValue","enableFormSubmit","checkValidationAtFirst","cellStyles","cellClassName","cellCheckedClassName","cellCheckedStyles","freeCSS","wrapStyles"]),[T]=a(x()),[c,V]=a(d),[v,m]=a(c);return c!=d&&(V(d),m(d)),r(w,n(e({options:S,value:v,componentID:T,icon:!1,flexWrap:!1,borderRadius:"2.tone.secondary",position:"relative"},I),{freeCSS:e({whiteSpace:"nowrap"},k),cellStyles:e({flexCenter:!0,ssEffectsOnActive:"push"},g),cellCheckedStyles:e({},f),cellClassName:[_,u("Label"),u("Tone_"+o.replace(/\./ig,""))].join(" "),cellCheckedClassName:[b,u("Checked")].join(" "),tone:"custom",onUpdateValue:h,onUpdateValidValue:(...y)=>{p&&p(...y),o=="bottomline"&&m(y[0])}}))},s=t=>{let{__sys_segmented_type:o}=t;return o=o||"plain",o=="plain"&&(t=n(e({padding:"1/3",gap:"1/3",ssCardBox:!0},t),{cellStyles:e({padding:["1/2","3/4"],borderRadius:"inherit",position:"relative"},t.cellStyles),cellCheckedStyles:e({backgroundColor:"theme",boxShadow:"1.normal",fontColor:"white"},t.cellCheckedStyles)})),r(E,e({__sys_segmented_type:"plain"},t))},l=s;l.Cloud=t=>{let o=n(e({__sys_segmented_type:"cloud",padding:"1/3",gap:"1/3",backgroundColor:"cloud"},t),{cellStyles:e({padding:"3/4",borderRadius:"inherit",position:"relative"},t.cellStyles),cellCheckedStyles:e({boxShadow:"1.normal",backgroundColor:"theme",fontColor:"white"},t.cellCheckedStyles)});return r(s,e({},o))},l.CloudTheme=t=>{let o=e({backgroundColor:"theme.opa.few",fontColor:"theme",__sys_segmented_type:"cloud.theme"},t);return r(l.Cloud,e({},o))},l.CloudMono=t=>{let o=n(e({fontColor:"3.blur",__sys_segmented_type:"cloud.mono"},t),{cellCheckedStyles:e({backgroundColor:"layer.1",fontColor:"1.clear"},t.cellCheckedStyles)});return r(l.Cloud,e({},o))},l.Border=t=>{let o=n(e({backgroundColor:"layer.1",border:"2.normal",overflow:"hidden",gap:0,fontColor:"3.blur",ssLastChildLossBorder:"right",boxShadow:"0.min",__sys_segmented_type:"border"},t),{cellStyles:e({padding:["3/4",1],borderRadius:0,borderRight:"2.normal"},t.cellStyles),cellCheckedStyles:e({backgroundColor:"theme.opa.few",fontColor:"theme"},t.cellCheckedStyles)});return r(s,e({},o))},l.BorderVivid=t=>{let o=n(e({border:!0,borderColor:"theme",__sys_segmented_type:"border.vivid"},t),{cellStyles:e({borderRight:!0,borderColor:"theme"},t.cellStyles),cellCheckedStyles:e({backgroundColor:"theme",fontColor:"white"},t.cellCheckedStyles)});return r(l.Border,e({},o))},l.Bottomline=t=>{let o=n(e({__sys_segmented_type:"bottomline",gap:0,fontColor:"3.blur"},t),{cellStyles:e({ssEffectsOnActive:"ripple.theme",borderRadius:0,padding:1},t.cellStyles),cellCheckedStyles:e({fontColor:"theme"},t.cellCheckedStyles)});return r(s,e({},o))};export{l as Segmented,l as default};
+import{b as e,c as n,d as C}from"../../chunk-C5N2D3ZX.js";import{jsx as r}from"react/jsx-runtime";import{UUID as x}from"jmini";import{useState as a}from"react";import{Radio as w}from"./List";import{InputSegmentedClasses as u}from"../../@styles/componentClasses";const E=t=>{let i=t,{__sys_segmented_type:o,tone:B,value:d,options:S,onUpdateValue:h,onUpdateValidValue:p,enableFormSubmit:M,checkValidationAtFirst:R,cellStyles:g,cellClassName:_,cellCheckedClassName:b,cellCheckedStyles:f,freeCSS:k,wrapStyles:J}=i,I=C(i,["__sys_segmented_type","tone","value","options","onUpdateValue","onUpdateValidValue","enableFormSubmit","checkValidationAtFirst","cellStyles","cellClassName","cellCheckedClassName","cellCheckedStyles","freeCSS","wrapStyles"]),[T]=a(x()),[c,V]=a(d),[v,m]=a(c);return c!=d&&(V(d),m(d)),r(w,n(e({options:S,value:v,componentId:T,icon:!1,flexWrap:!1,borderRadius:"2.tone.secondary",position:"relative"},I),{freeCSS:e({whiteSpace:"nowrap"},k),cellStyles:e({flexCenter:!0,ssEffectsOnActive:"push"},g),cellCheckedStyles:e({},f),cellClassName:[_,u("Label"),u("Tone_"+o.replace(/\./ig,""))].join(" "),cellCheckedClassName:[b,u("Checked")].join(" "),tone:"custom",onUpdateValue:h,onUpdateValidValue:(...y)=>{p&&p(...y),o=="bottomline"&&m(y[0])}}))},s=t=>{let{__sys_segmented_type:o}=t;return o=o||"plain",o=="plain"&&(t=n(e({padding:"1/3",gap:"1/3",ssCardBox:!0},t),{cellStyles:e({padding:["1/2","3/4"],borderRadius:"inherit",position:"relative"},t.cellStyles),cellCheckedStyles:e({backgroundColor:"theme",boxShadow:"1.normal",fontColor:"white"},t.cellCheckedStyles)})),r(E,e({__sys_segmented_type:"plain"},t))},l=s;l.Cloud=t=>{let o=n(e({__sys_segmented_type:"cloud",padding:"1/3",gap:"1/3",backgroundColor:"cloud"},t),{cellStyles:e({padding:"3/4",borderRadius:"inherit",position:"relative"},t.cellStyles),cellCheckedStyles:e({boxShadow:"1.normal",backgroundColor:"theme",fontColor:"white"},t.cellCheckedStyles)});return r(s,e({},o))},l.CloudTheme=t=>{let o=e({backgroundColor:"theme.opa.few",fontColor:"theme",__sys_segmented_type:"cloud.theme"},t);return r(l.Cloud,e({},o))},l.CloudMono=t=>{let o=n(e({fontColor:"3.blur",__sys_segmented_type:"cloud.mono"},t),{cellCheckedStyles:e({backgroundColor:"layer.1",fontColor:"1.clear"},t.cellCheckedStyles)});return r(l.Cloud,e({},o))},l.Border=t=>{let o=n(e({backgroundColor:"layer.1",border:"2.normal",overflow:"hidden",gap:0,fontColor:"3.blur",ssLastChildLossBorder:"right",boxShadow:"0.min",__sys_segmented_type:"border"},t),{cellStyles:e({padding:["3/4",1],borderRadius:0,borderRight:"2.normal"},t.cellStyles),cellCheckedStyles:e({backgroundColor:"theme.opa.few",fontColor:"theme"},t.cellCheckedStyles)});return r(s,e({},o))},l.BorderVivid=t=>{let o=n(e({border:!0,borderColor:"theme",__sys_segmented_type:"border.vivid"},t),{cellStyles:e({borderRight:!0,borderColor:"theme"},t.cellStyles),cellCheckedStyles:e({backgroundColor:"theme",fontColor:"white"},t.cellCheckedStyles)});return r(l.Border,e({},o))},l.Bottomline=t=>{let o=n(e({__sys_segmented_type:"bottomline",gap:0,fontColor:"3.blur"},t),{cellStyles:e({ssEffectsOnActive:"ripple.theme",borderRadius:0,padding:1},t.cellStyles),cellCheckedStyles:e({fontColor:"theme"},t.cellCheckedStyles)});return r(s,e({},o))};export{l as Segmented,l as default};

package/dist/fn/Input/Select.js

@@ -1 +1 @@
-import{b as n,c as u,d as z}from"../../chunk-C5N2D3ZX.js";import{Fragment as H,jsx as a,jsxs as w}from"react/jsx-runtime";import c,{UUID as R}from"jmini";import{useState as k,useEffect as oe}from"react";import{ExtractStyles as Te}from"../../@utils";import{Box as I,Span as xe,FAI as ne,Column as Fe}from"../../atoms";import{Literal as B,Row as re}from"../../mols";import{Button as we}from"../Button";import{Sheet as Re}from"../Sheet";import{OptionalInputWrapper as ke,BoxWrapper as Ae,CoreEffects as F,DefaultBoxishStyles as Ee}from"./core";import{InputAutocompleteClasses as A}from"../../@styles/componentClasses";import{InputLabel as Be}from"./Label";import{RightIcon as Le}from".";function We(e){let{value:t,states:o}=e,{required:l,options:y}=o,p=[];return l&&t===null&&p.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"}),{ok:!p.filter(({type:S})=>S=="invalid").length,notice:p}}const se={FilterSelectableOptions:(e,t)=>{let o=e.rootStates.options;return t||(o=o.filter(l=>l.type!="label")),o}},C={Shallow:e=>{let{rootStates:t,val_status:o}=e,l=Te(t);return a(I,{position:"absolute",top:0,left:0,right:0,height:0,overflow:"hidden",opacity:"trans",freeCSS:{zIndex:3,pointerEvents:"none"},children:a(B.Description,u(n({className:t.className},l),{position:"absolute",width:1,freeCSS:u(n({},l.freeCSS),{color:"orange"}),children:a(I,{"data-input-value-shallow":o.componentID,children:"A"})}))})},Button:e=>w(H,{children:[a(C.LegacySelector,n({},e)),a(C.Original,n({},e))]}),Placeholder:e=>!e.rootStates.placeholder||e.val_status.dataValue!==null?null:a(I,{position:"absolute",opacity:"middle",fontColor:"3.blur",children:e.rootStates.placeholder||""}),Original:e=>{let{rootStates:t,val_preventOpenSelectorOnFocus:o,set_preventOpenSelectorOnFocus:l,val_optionFocused:y,set_optionFocused:p,val_validate:S,set_validate:h,val_status:s,set_status:g,val_selectorOpen:d,set_selectorOpen:f}=e,U=t,{tone:D,required:E,form:L,className:W,label:ue,isLabelActive:ce,placeholder:pe,enableFormSubmit:P,emptySelect:$,checkValidationAtFirst:M,onValidate:Se,onUpdateValue:de,onUpdateValidValue:fe,value:N="",options:K,leftIndicator:me,rightIndicator:j,leftIcon:ve,rightIcon:ye,componentID:be,status_id:ge,wrapStyles:he,SelectedCellStyles:Ie,SelectorCellStyles:Ce,SelectorMode:_e,SelectorStyles:Ve,SelectorPosition:De}=U,r=z(U,["tone","required","form","className","label","isLabelActive","placeholder","enableFormSubmit","emptySelect","checkValidationAtFirst","onValidate","onUpdateValue","onUpdateValidValue","value","options","leftIndicator","rightIndicator","leftIcon","rightIcon","componentID","status_id","wrapStyles","SelectedCellStyles","SelectorCellStyles","SelectorMode","SelectorStyles","SelectorPosition"]);return oe(()=>{if(e.rootStates.SelectorMode!="original"||t.disabled)return;let i="select-click-"+t.componentID;if(d){if(!c('[data-input-origin="'+t.componentID+'"]'))return;c(document).addEvent({eventID:i,eventType:"click",callback:m=>{let O=c(m.target),T=!!c(O).parent("."+A("Core")).length;c(O).parent("."+A("Selector")).length||T||f(!1)}})}else c(document).removeEvent([i])},[d]),oe(()=>{if(e.rootStates.SelectorMode!="original"||s.eventType=="init"||!d)return;let i=c('[data-input-origin="'+t.componentID+'"]');i&&i.focus()},[s.dataValue]),e.rootStates.SelectorMode!="original"?null:w(H,{children:[a(I,u(n({tabIndex:0},r),{"data-disabled":t.disabled,"data-show-validation":F.isShowValidation(S,s,!!M),"data-component-id":s.componentID,"data-input-origin":s.componentID,className:[W,A("Core")].join(" "),onFocus:i=>{if(r!=null&&r.onFocus&&(r==null||r.onFocus(i)),!t.disabled){if(o)return l(!1);f(!0)}},onClick:i=>{r!=null&&r.onClick&&(r==null||r.onClick(i)),!t.disabled&&f(!0)},onKeyDown:i=>{let{key:b,metaKey:m,ctrlKey:O}=i,T=m||O;if(r!=null&&r.onKeyDown&&(r==null||r.onKeyDown(i)),P&&F.SubmitForm(i,L),!t.disabled){if(c.scope(()=>{if(!["ArrowDown","ArrowUp"].includes(b))return;if(i.preventDefault(),!d)return f(!0);let _=b=="ArrowDown"?1:-1,v=se.FilterSelectableOptions(e),q=v.length-1,V=null;c.scope(()=>{var J,X,G,Q,Y,Z,ee,te,le,ae;let x=v.findIndex(Oe=>Oe.value==y);if(_==1){if(V=(X=(J=v[0])==null?void 0:J.value)!=null?X:null,T){V=(G=v[q].value)!=null?G:null;return}if(x==-1||x==q)return;V=(Y=(Q=v[x+1])==null?void 0:Q.value)!=null?Y:null}else{if(V=(Z=v[q].value)!=null?Z:null,T){V=(te=(ee=v[0])==null?void 0:ee.value)!=null?te:null;return}if(x==-1||x==0)return;V=(ae=(le=v[x-1])==null?void 0:le.value)!=null?ae:null}}),p(V)}),b=="Escape")f(!1);else if(b=="Tab")f(!1);else if(b=="Backspace")g(_=>u(n({},_),{dataValue:null,eventType:"update",eventID:R()}));else if(b==" ")i.preventDefault(),f(!0);else if(b=="Enter"){if(!d)return f(!0);i.preventDefault();let _=t.options.find(v=>v.value==y);if(!_)return;g(v=>u(n({},v),{dataValue:_.value,eventType:"update",eventID:R()})),f(!1)}}},children:w(re.Left,{flexWrap:!0,gap:"1/3",freeCSS:{letterSpacing:".5px"},children:[a(C.Placeholder,n({},e)),a(C.Selected,n({},e)),a(xe,{width:0,overflow:"hidden",opacity:"trans",children:"A"})]})})),d&&a(C.Selector,n({},e))]})},LegacySelector:e=>{let{rootStates:t,val_preventOpenSelectorOnFocus:o,set_preventOpenSelectorOnFocus:l,val_optionFocused:y,set_optionFocused:p,val_validate:S,set_validate:h,val_status:s,set_status:g,val_selectorOpen:d,set_selectorOpen:f}=e,b=t,{tone:D,required:E,form:L,className:W,label:ue,isLabelActive:ce,placeholder:pe,enableFormSubmit:P,emptySelect:$,checkValidationAtFirst:M,onValidate:Se,onUpdateValue:de,onUpdateValidValue:fe,onKeyDown:N,onChange:K,value:me="",options:j,leftIndicator:ve,rightIndicator:ye,leftIcon:be,rightIcon:ge,componentID:he,status_id:Ie,wrapStyles:Ce,SelectedCellStyles:_e,SelectorCellStyles:Ve,SelectorMode:De,SelectorStyles:r,SelectorPosition:U}=b,i=z(b,["tone","required","form","className","label","isLabelActive","placeholder","enableFormSubmit","emptySelect","checkValidationAtFirst","onValidate","onUpdateValue","onUpdateValidValue","onKeyDown","onChange","value","options","leftIndicator","rightIndicator","leftIcon","rightIcon","componentID","status_id","wrapStyles","SelectedCellStyles","SelectorCellStyles","SelectorMode","SelectorStyles","SelectorPosition"]);return e.rootStates.SelectorMode!="legacy"?null:w(I,u(n({htmlTag:"select",tabIndex:0},i),{"data-disabled":t.disabled,"data-show-validation":F.isShowValidation(S,s,!!M),"data-component-id":s.componentID,"data-input-origin":s.componentID,className:[W,A("Core")].join(" "),onKeyDown:m=>{N&&N(m),P&&F.SubmitForm(m,L)},onChange:m=>{let{value:O}=m.target;S.ok&&h({ok:!1,notice:[]}),g(T=>u(n({},T),{dataValue:O,eventType:"update",eventID:R()})),K&&K(m)},children:[!!$&&a("option",{value:"null",children:"\u9078\u629E"}),j.map(m=>c.is.nullish(m.value)?null:a("option",{value:m.value,children:m.label},String(m.value)))]}))},Selector:e=>{var y;let t=[],o=se.FilterSelectableOptions(e,!0);o.forEach((p,S)=>{let{type:h,value:s}=p,g=e.val_optionFocused==s,d=e.val_status.dataValue===s;if(h=="selector"){t.push(a(we.Sub.S,u(n({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.rootStates.SelectorCellStyles),{onClick:f=>{e.set_status(D=>u(n({},D),{dataValue:s,eventType:"update",eventID:R()})),e.set_selectorOpen(!1),e.set_preventOpenSelectorOnFocus(!0)},children:w(re.Left,{gap:"1/2",children:[d&&a(ne.Check,{fontColor:"theme"}),a(B.Supplement,{transition:"short",flexSizing:0,children:p.label})]})}),String(s)));return}t.push(a(I,{children:p.label},R()))}),o.length||(t=[a(B.Supplement,{padding:[0,1],fontColor:"4.thin",children:"\u5019\u88DC\u304C\u898B\u3064\u304B\u308A\u307E\u305B\u3093"},"no-selector-notice")]);let l={position:"absolute",minWidth:1,freeCSS:{zIndex:1e3}};switch(e.rootStates.SelectorPosition){case 1:l.bottom="100%",l.left=0,l.paddingBottom="1/3";break;case 2:l.bottom="100%",l.right=0,l.paddingBottom="1/3";break;case 3:l.top="100%",l.left=0,l.paddingTop="1/3";break;case 4:l.top="100%",l.right=0,l.paddingTop="1/3";break;default:break}return a(I,u(n({},l),{children:a(Re.Body,u(n({className:A("Selector"),ssCardBox:!0,borderRadius:"2.tone.secondary",boxShadow:"1.normal",overflow:"auto"},e.rootStates.SelectorStyles),{freeCSS:n({minWidth:12*6,maxHeight:12*24},(y=e.rootStates.SelectorStyles)==null?void 0:y.freeCSS),children:a(Fe,{gap:"1/12",padding:[1,0],children:t})}))}))},Selected:e=>{let t=[];return e.val_status.dataValue!==null&&c.scope(()=>{let o=e.rootStates.options.find(l=>c.is.equal(l.value,e.val_status.dataValue));o&&t.push(a(I,u(n({},e.rootStates.SelectedCellStyles),{children:o.label}),String(o.value)))}),a(H,{children:t})},Core:e=>{var E;let{value:t}=e,[o,l]=k(F.DefaultStatus(e.componentID,t)),[y,p]=k(!1),[S,h]=k(!1),[s,g]=k((E=e.value)!=null?E:null),[d,f]=k({ok:!1,notice:[]}),D={rootStates:e,val_preventOpenSelectorOnFocus:y,set_preventOpenSelectorOnFocus:p,val_optionFocused:s,set_optionFocused:g,val_selectorOpen:S,set_selectorOpen:h,val_status:o,set_status:l,val_validate:d,set_validate:f};return F.CommonEffects({type:"select",states:e,val_status:o,set_status:l,val_validate:d,set_validate:f,SystemValidation:We}),w(Ae,{val_status:o,set_status:l,val_validate:d,states:e,children:[a(Be,{componentID:e.componentID,fontSize:e.fontSize,required:e.required,label:e.label,isActive:e.isLabelActive||o.dataValue!==null}),a(C.Shallow,n({},D)),a(C.Button,n({},D))]})}},ie=e=>{var o;let t=n({},e);return t=u(n({emptySelect:!0,SelectorMode:"original",SelectorPosition:3},t),{freeCSS:n({cursor:"pointer"},t.freeCSS)}),t.emptySelect&&(t.options=[{value:null,label:a(B.Supplement,{fontColor:"4.thin",children:"\u672A\u9078\u629E"})},...t.options]),t.value=(o=t.value)!=null?o:null,t.options.forEach((l,y)=>{let{type:p,value:S,searchValue:h}=l,s=h||c.is.string(S)&&S||c.Stringify(S||"")||"";t.options[y]=u(n({},l),{value:S,searchValue:s,type:p||"selector"})}),c.is.nullish(t.rightIcon)&&(t.rightIcon=a(Le,{ssSphere:2,children:a(ne.AngleDown,{})})),a(ke,{componentID:t.componentID,children:C.Core,states:Ee(t)})};export{ie as Select,ie as default};
+import{b as n,c as u,d as z}from"../../chunk-C5N2D3ZX.js";import{Fragment as H,jsx as a,jsxs as R}from"react/jsx-runtime";import c,{UUID as k}from"jmini";import{useState as D,useEffect as oe}from"react";import{ExtractStyles as xe}from"../../@utils";import{Box as I,Span as Fe,FAI as ne,Column as we}from"../../atoms";import{Literal as B,Row as re}from"../../mols";import{Button as Re}from"../Button";import{Sheet as ke}from"../Sheet";import{OptionalInputWrapper as De,BoxWrapper as Ae,CoreEffects as w,DefaultBoxishStyles as Ee}from"./core";import{InputAutocompleteClasses as A}from"../../@styles/componentClasses";import{InputLabel as Be}from"./Label";import{RightIcon as Le}from".";function We(e){let{value:t,states:o}=e,{required:l,options:y}=o,p=[];return l&&t===null&&p.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"}),{ok:!p.filter(({type:d})=>d=="invalid").length,notice:p}}const se={FilterSelectableOptions:(e,t)=>{let o=e.rootStates.options;return t||(o=o.filter(l=>l.type!="label")),o}},C={Shallow:e=>{let{rootStates:t,val_status:o}=e,l=xe(t);return a(I,{position:"absolute",top:0,left:0,right:0,height:0,overflow:"hidden",opacity:"trans",freeCSS:{zIndex:3,pointerEvents:"none"},children:a(B.Description,u(n({className:t.className},l),{position:"absolute",width:1,freeCSS:u(n({},l.freeCSS),{color:"orange"}),children:a(I,{"data-input-value-shallow":o.componentId,children:"A"})}))})},Button:e=>R(H,{children:[a(C.LegacySelector,n({},e)),a(C.Original,n({},e))]}),Placeholder:e=>!e.rootStates.placeholder||e.val_status.dataValue!==null?null:a(I,{position:"absolute",opacity:"middle",fontColor:"3.blur",children:e.rootStates.placeholder||""}),Original:e=>{let{rootStates:t,val_preventOpenSelectorOnFocus:o,set_preventOpenSelectorOnFocus:l,val_optionFocused:y,set_optionFocused:p,val_validate:d,set_validate:h,val_status:s,set_status:g,val_selectorOpen:S,set_selectorOpen:f}=e,U=t,{tone:O,required:E,form:L,className:W,label:ue,isLabelActive:ce,placeholder:pe,enableFormSubmit:P,emptySelect:$,checkValidationAtFirst:M,onValidate:de,onUpdateValue:Se,onUpdateValidValue:fe,value:N="",options:K,leftIndicator:me,rightIndicator:j,leftIcon:ve,rightIcon:ye,componentId:be,status_id:ge,wrapStyles:he,SelectedCellStyles:Ie,SelectorCellStyles:Ce,SelectorMode:_e,SelectorStyles:Ve,SelectorPosition:Oe}=U,r=z(U,["tone","required","form","className","label","isLabelActive","placeholder","enableFormSubmit","emptySelect","checkValidationAtFirst","onValidate","onUpdateValue","onUpdateValidValue","value","options","leftIndicator","rightIndicator","leftIcon","rightIcon","componentId","status_id","wrapStyles","SelectedCellStyles","SelectorCellStyles","SelectorMode","SelectorStyles","SelectorPosition"]);return oe(()=>{if(e.rootStates.SelectorMode!="original"||t.disabled)return;let i="select-click-"+t.componentId;if(S){if(!c('[data-input-origin="'+t.componentId+'"]'))return;c(document).addEvent({eventID:i,eventType:"click",callback:m=>{let T=c(m.target),x=!!c(T).parent("."+A("Core")).length;c(T).parent("."+A("Selector")).length||x||f(!1)}})}else c(document).removeEvent([i])},[S]),oe(()=>{if(e.rootStates.SelectorMode!="original"||s.eventType=="init"||!S)return;let i=c('[data-input-origin="'+t.componentId+'"]');i&&i.focus()},[s.dataValue]),e.rootStates.SelectorMode!="original"?null:R(H,{children:[a(I,u(n({tabIndex:0},r),{"data-disabled":t.disabled,"data-show-validation":w.isShowValidation(d,s,!!M),"data-component-id":s.componentId,"data-input-origin":s.componentId,className:[W,A("Core")].join(" "),onFocus:i=>{if(r!=null&&r.onFocus&&(r==null||r.onFocus(i)),!t.disabled){if(o)return l(!1);f(!0)}},onClick:i=>{r!=null&&r.onClick&&(r==null||r.onClick(i)),!t.disabled&&f(!0)},onKeyDown:i=>{let{key:b,metaKey:m,ctrlKey:T}=i,x=m||T;if(r!=null&&r.onKeyDown&&(r==null||r.onKeyDown(i)),P&&w.SubmitForm(i,L),!t.disabled){if(c.scope(()=>{if(!["ArrowDown","ArrowUp"].includes(b))return;if(i.preventDefault(),!S)return f(!0);let _=b=="ArrowDown"?1:-1,v=se.FilterSelectableOptions(e),q=v.length-1,V=null;c.scope(()=>{var J,X,G,Q,Y,Z,ee,te,le,ae;let F=v.findIndex(Te=>Te.value==y);if(_==1){if(V=(X=(J=v[0])==null?void 0:J.value)!=null?X:null,x){V=(G=v[q].value)!=null?G:null;return}if(F==-1||F==q)return;V=(Y=(Q=v[F+1])==null?void 0:Q.value)!=null?Y:null}else{if(V=(Z=v[q].value)!=null?Z:null,x){V=(te=(ee=v[0])==null?void 0:ee.value)!=null?te:null;return}if(F==-1||F==0)return;V=(ae=(le=v[F-1])==null?void 0:le.value)!=null?ae:null}}),p(V)}),b=="Escape")f(!1);else if(b=="Tab")f(!1);else if(b=="Backspace")g(_=>u(n({},_),{dataValue:null,eventType:"update",eventID:k()}));else if(b==" ")i.preventDefault(),f(!0);else if(b=="Enter"){if(!S)return f(!0);i.preventDefault();let _=t.options.find(v=>v.value==y);if(!_)return;g(v=>u(n({},v),{dataValue:_.value,eventType:"update",eventID:k()})),f(!1)}}},children:R(re.Left,{flexWrap:!0,gap:"1/3",freeCSS:{letterSpacing:".5px"},children:[a(C.Placeholder,n({},e)),a(C.Selected,n({},e)),a(Fe,{width:0,overflow:"hidden",opacity:"trans",children:"A"})]})})),S&&a(C.Selector,n({},e))]})},LegacySelector:e=>{let{rootStates:t,val_preventOpenSelectorOnFocus:o,set_preventOpenSelectorOnFocus:l,val_optionFocused:y,set_optionFocused:p,val_validate:d,set_validate:h,val_status:s,set_status:g,val_selectorOpen:S,set_selectorOpen:f}=e,b=t,{tone:O,required:E,form:L,className:W,label:ue,isLabelActive:ce,placeholder:pe,enableFormSubmit:P,emptySelect:$,checkValidationAtFirst:M,onValidate:de,onUpdateValue:Se,onUpdateValidValue:fe,onKeyDown:N,onChange:K,value:me="",options:j,leftIndicator:ve,rightIndicator:ye,leftIcon:be,rightIcon:ge,componentId:he,status_id:Ie,wrapStyles:Ce,SelectedCellStyles:_e,SelectorCellStyles:Ve,SelectorMode:Oe,SelectorStyles:r,SelectorPosition:U}=b,i=z(b,["tone","required","form","className","label","isLabelActive","placeholder","enableFormSubmit","emptySelect","checkValidationAtFirst","onValidate","onUpdateValue","onUpdateValidValue","onKeyDown","onChange","value","options","leftIndicator","rightIndicator","leftIcon","rightIcon","componentId","status_id","wrapStyles","SelectedCellStyles","SelectorCellStyles","SelectorMode","SelectorStyles","SelectorPosition"]);return e.rootStates.SelectorMode!="legacy"?null:R(I,u(n({htmlTag:"select",tabIndex:0},i),{"data-disabled":t.disabled,"data-show-validation":w.isShowValidation(d,s,!!M),"data-component-id":s.componentId,"data-input-origin":s.componentId,className:[W,A("Core")].join(" "),onKeyDown:m=>{N&&N(m),P&&w.SubmitForm(m,L)},onChange:m=>{let{value:T}=m.target;d.ok&&h({ok:!1,notice:[]}),g(x=>u(n({},x),{dataValue:T,eventType:"update",eventID:k()})),K&&K(m)},children:[!!$&&a("option",{value:"null",children:"\u9078\u629E"}),j.map(m=>c.is.nullish(m.value)?null:a("option",{value:m.value,children:m.label},String(m.value)))]}))},Selector:e=>{var y;let t=[],o=se.FilterSelectableOptions(e,!0);o.forEach((p,d)=>{let{type:h,value:s}=p,g=e.val_optionFocused==s,S=e.val_status.dataValue===s;if(h=="selector"){t.push(a(Re.Sub.S,u(n({color:"cloud",backgroundColor:"trans",borderRadius:0,fontColor:"2.normal",textAlign:"left",padding:["1/2",1],isActive:S||g,isActiveStyles:g?{backgroundColor:"cloud"}:{backgroundColor:"theme.opa.few",fontColor:"theme"}},e.rootStates.SelectorCellStyles),{onClick:f=>{e.set_status(O=>u(n({},O),{dataValue:s,eventType:"update",eventID:k()})),e.set_selectorOpen(!1),e.set_preventOpenSelectorOnFocus(!0)},children:R(re.Left,{gap:"1/2",children:[S&&a(ne.Check,{fontColor:"theme"}),a(B.Supplement,{transition:"short",flexSizing:0,children:p.label})]})}),String(s)));return}t.push(a(I,{children:p.label},k()))}),o.length||(t=[a(B.Supplement,{padding:[0,1],fontColor:"4.thin",children:"\u5019\u88DC\u304C\u898B\u3064\u304B\u308A\u307E\u305B\u3093"},"no-selector-notice")]);let l={position:"absolute",minWidth:1,freeCSS:{zIndex:1e3}};switch(e.rootStates.SelectorPosition){case 1:l.bottom="100%",l.left=0,l.paddingBottom="1/3";break;case 2:l.bottom="100%",l.right=0,l.paddingBottom="1/3";break;case 3:l.top="100%",l.left=0,l.paddingTop="1/3";break;case 4:l.top="100%",l.right=0,l.paddingTop="1/3";break;default:break}return a(I,u(n({},l),{children:a(ke.Body,u(n({className:A("Selector"),ssCardBox:!0,borderRadius:"2.tone.secondary",boxShadow:"1.normal",overflow:"auto"},e.rootStates.SelectorStyles),{freeCSS:n({minWidth:12*6,maxHeight:12*24},(y=e.rootStates.SelectorStyles)==null?void 0:y.freeCSS),children:a(we,{gap:"1/12",padding:[1,0],children:t})}))}))},Selected:e=>{let t=[];return e.val_status.dataValue!==null&&c.scope(()=>{let o=e.rootStates.options.find(l=>c.is.equal(l.value,e.val_status.dataValue));o&&t.push(a(I,u(n({},e.rootStates.SelectedCellStyles),{children:o.label}),String(o.value)))}),a(H,{children:t})},Core:e=>{var E;let{value:t}=e,[o,l]=D(w.DefaultStatus(e.componentId,t)),[y,p]=D(!1),[d,h]=D(!1),[s,g]=D((E=e.value)!=null?E:null),[S,f]=D({ok:!1,notice:[]}),O={rootStates:e,val_preventOpenSelectorOnFocus:y,set_preventOpenSelectorOnFocus:p,val_optionFocused:s,set_optionFocused:g,val_selectorOpen:d,set_selectorOpen:h,val_status:o,set_status:l,val_validate:S,set_validate:f};return w.CommonEffects({type:"select",states:e,val_status:o,set_status:l,val_validate:S,set_validate:f,SystemValidation:We}),R(Ae,{val_status:o,set_status:l,val_validate:S,states:e,children:[a(Be,{componentId:e.componentId,fontSize:e.fontSize,required:e.required,label:e.label,isActive:e.isLabelActive||o.dataValue!==null}),a(C.Shallow,n({},O)),a(C.Button,n({},O))]})}},ie=e=>{var o;let t=n({},e);return t=u(n({emptySelect:!0,SelectorMode:"original",SelectorPosition:3},t),{freeCSS:n({cursor:"pointer"},t.freeCSS)}),t.emptySelect&&(t.options=[{value:null,label:a(B.Supplement,{fontColor:"4.thin",children:"\u672A\u9078\u629E"})},...t.options]),t.value=(o=t.value)!=null?o:null,t.options.forEach((l,y)=>{let{type:p,value:d,searchValue:h}=l,s=h||c.is.string(d)&&d||c.Stringify(d||"")||"";t.options[y]=u(n({},l),{value:d,searchValue:s,type:p||"selector"})}),c.is.nullish(t.rightIcon)&&(t.rightIcon=a(Le,{ssSphere:2,children:a(ne.AngleDown,{})})),a(De,{componentId:t.componentId,children:C.Core,states:Ee(t)})};export{ie as Select,ie as default};

package/dist/fn/Input/Slider.js

@@ -1 +1 @@
-import{b as y,c as D,d as V}from"../../chunk-C5N2D3ZX.js";import{jsx as d,jsxs as H}from"react/jsx-runtime";import L,{UUID as _}from"jmini";import{useState as k,useEffect as U}from"react";import{$$fromRoot as x,GenerateHTMLProps as P}from"../../@utils";import{Box as C,Flex as B,Column as $}from"../../atoms";import{Button as q}from"../Button";import{OptionalInputWrapper as O,BoxWrapper as G,CoreEffects as A}from"./core";import{InputSliderClasses as c}from"../../@styles/componentClasses";function X(t){let{value:e,states:n}=t,{required:s}=n,o=[];return s&&!e&&o.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"}),{ok:!o.filter(({type:r})=>r=="invalid").length,notice:o}}const F=t=>{let{value:e,val_status:n}=t,{min:s,max:o,step:r}=n;e=Math.max(e,s),e=Math.min(e,o);let a=e/o*o;return a=Math.round(a/r),{stepValue:a*r,stepIndex:a,positionLeft:a*r/o*100+"%"}},z={IndicatorLabels:t=>{let{componentID:e,min:n,max:s,step:o,customLegends:r}=t,i=[],a=Math.round(n/o),p=Math.round(s/o),S=p-a+1;for(var u=a;u<=p;u++){let l=u*o;l=Math.max(l,n),l=Math.min(l,s);let f=l/s*100+"%";i.push(d(C,{className:c("Label"),id:"Legend-"+e+"-"+u,display:u==a||u==p?"flex":"none",position:"absolute",top:0,unitHeight:1,unitWidth:1.5,transition:"middle",fontColor:"1.clear",verticalAlign:"center",horizontalAlign:"center",freeCSS:{left:f,whiteSpace:"nowrap",textAlign:"center"},children:r?r(l):l.rank()},l))}return U(()=>{const l=()=>{let f=x("#Labels-"+e),{width:v}=f.position(),w=Math.round(v/50)-1,h=Math.round(S/w);for(let m=a+1;m<p;m++)x("#Legend-"+e+"-"+m).css({display:m%h==0?"flex":"none"})};return L(window).addEvent({eventID:"SliderResizeCallback-"+e,eventType:"resize",callback:()=>{l()}}),l(),()=>{L(window).removeEvent("SliderResizeCallback-"+e)}},[]),d(B,{className:c("Labels"),verticalAlign:"center",horizontalAlign:"between",fontSize:"0.xs",position:"relative",unitHeight:1,id:"Labels-"+e,children:d(C,{position:"absolute",top:0,left:0,bottom:0,freeCSS:{right:12*1.5},children:i})})},Rail:t=>{let{val_status:e,set_status:n,DotData:s,form:o,enableFormSubmit:r}=t,{componentID:i}=e;return H(B,{className:c("Rail"),position:"relative",paddingLeft:"1/2",unitHeight:1.5,verticalAlign:"center",freeCSS:{zIndex:1,cursor:"pointer"},onPointerDown:a=>{t.rootStates.disabled||(a.stopPropagation(),g.Effects.Start(a,{val_status:e,set_status:n,DotData:s}))},children:[d(C,{className:c("Bar"),backgroundColor:"layer.4",position:"relative",borderRadius:"1.tone.primary",transition:"middle",flexSizing:"none",unitHeight:"2/3",width:1,id:i+"_Bar",children:d(C,{className:c("BarColor"),position:"relative",height:1,width:0,left:0,transition:"long",borderRadius:"inherit",backgroundColor:t.color,opacity:"middle",overflow:"hidden",freeCSS:{width:s.positionLeft},id:i+"_BarColor"})}),d(C,{className:c("BallWrap"),position:"absolute",top:0,left:0,bottom:0,freeCSS:{right:12*1.5},children:d(q.Plain,{className:c("Ball"),position:"absolute",boxShadow:"1.remark",backgroundColor:t.color,top:0,left:0,ssSquare:1.5,borderRadius:"1.tone.primary",freeCSS:{zIndex:2,left:s.positionLeft},id:i+"_Ball",onKeyDown:a=>{g.KeyDownEvent({event:a,val_status:e,set_status:n,DotData:s}),r&&A.SubmitForm(a,o)}})})]})}},g={Effects:{Start:(t,e)=>{L(document).addEvent({eventID:"SliderMouseMove",eventType:"mousemove",callback:n=>{g.Effects.Move(n,e)},options:{passive:!1}}).addEvent({eventID:"SliderTouchMove",eventType:"touchmove",callback:n=>{g.Effects.Move(n,e)},options:{passive:!1}}).addEvent({eventID:"SliderMouseUp",eventType:"mouseup",callback:()=>{g.Effects.End()}}).addEvent({eventID:"SliderTouchEnd",eventType:"touchend",callback:()=>{g.Effects.End()}})},Move:(t,e)=>{let n=L.getCursor(t).x,{val_status:s,set_status:o}=e,{componentID:r,min:i,max:a}=s,p=x("#"+r+"_Ball"),S=x("#"+r+"_Bar"),u=x("#"+r+"_BarColor"),{width:l,left:f}=S.position(),v=(n-f)/l;v=Math.max(v,0),v=Math.min(v,1);let w=v*a,h=F({value:w,val_status:s}),m=h.positionLeft,R=h.stepValue;return p.css({left:m}),u.css({width:m}),o(I=>{let b=I.dataValue;return R==b?I:D(y({},I),{dataValue:R,eventType:"update",eventID:_()})}),t.preventDefault(),t.stopPropagation(),!1},End:()=>{L(document).removeEvent(["SliderMouseMove","SliderTouchMove","SliderMouseUp","SliderTouchEnd"])}},KeyDownEvent:t=>{let{event:e,val_status:n,set_status:s}=t,{min:o,max:r,step:i}=n,{key:a,metaKey:p,ctrlKey:S}=e,u=S||p,l=n.dataValue;a.match(/Arrow/)&&(e.preventDefault(),a.match(/Left|Up/)?u?l=o:l-=i:a.match(/Right|Down/)&&(u?l=r:l+=i),l=Math.max(Math.min(l,r),o),s(f=>D(y({},f),{dataValue:l,eventType:"update",eventID:_()})))}},j=t=>{let M=t,{color:e="theme",required:n,form:s="",legends:{enable:o=!0,custom:r,showAlways:i=!1}={},min:a,max:p,step:S,enableFormSubmit:u,checkValidationAtFirst:l,onValidate:f,onUpdateValue:v,onUpdateValidValue:w,value:h="",className:m,wrapStyles:R}=M,I=V(M,["color","required","form","legends","min","max","step","enableFormSubmit","checkValidationAtFirst","onValidate","onUpdateValue","onUpdateValidValue","value","className","wrapStyles"]),[b,T]=k({componentID:t.componentID||"",dataValue:h,min:a,max:p,step:S,eventType:"init",eventID:_()}),[E,W]=k({ok:!1,notice:[]});A.CommonEffects({type:"slider",states:t,val_status:b,set_status:T,val_validate:E,set_validate:W,SystemValidation:X});let K=F({value:b.dataValue,val_status:b});return d(G,{val_status:b,set_status:T,val_validate:E,states:t,children:H($,D(y({gap:"1/2",flexSizing:"auto"},I),{className:[c("Wrap"),m,c("ShowLegendsAlways_"+i)].join(" "),children:[d(z.Rail,{rootStates:t,color:e,val_status:b,set_status:T,DotData:K,form:s,enableFormSubmit:u}),!!o&&d(z.IndicatorLabels,{componentID:b.componentID,min:a,max:p,step:S,customLegends:r})]}))})},N=t=>{let e=D(y({},t),{freeCSS:y({minWidth:120},t.freeCSS)});return d(O,{componentID:t.componentID,children:j,states:P(e)})};export{N as Slider,N as default};
+import{b as y,c as L,d as V}from"../../chunk-C5N2D3ZX.js";import{jsx as p,jsxs as H}from"react/jsx-runtime";import D,{UUID as _}from"jmini";import{useState as k,useEffect as U}from"react";import{$$fromRoot as x,GenerateHTMLProps as P}from"../../@utils";import{Box as C,Flex as B,Column as $}from"../../atoms";import{Button as q}from"../Button";import{OptionalInputWrapper as O,BoxWrapper as G,CoreEffects as A}from"./core";import{InputSliderClasses as c}from"../../@styles/componentClasses";function X(t){let{value:e,states:n}=t,{required:s}=n,o=[];return s&&!e&&o.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"}),{ok:!o.filter(({type:r})=>r=="invalid").length,notice:o}}const F=t=>{let{value:e,val_status:n}=t,{min:s,max:o,step:r}=n;e=Math.max(e,s),e=Math.min(e,o);let a=e/o*o;return a=Math.round(a/r),{stepValue:a*r,stepIndex:a,positionLeft:a*r/o*100+"%"}},z={IndicatorLabels:t=>{let{componentId:e,min:n,max:s,step:o,customLegends:r}=t,i=[],a=Math.round(n/o),d=Math.round(s/o),S=d-a+1;for(var u=a;u<=d;u++){let l=u*o;l=Math.max(l,n),l=Math.min(l,s);let f=l/s*100+"%";i.push(p(C,{className:c("Label"),id:"Legend-"+e+"-"+u,display:u==a||u==d?"flex":"none",position:"absolute",top:0,unitHeight:1,unitWidth:1.5,transition:"middle",fontColor:"1.clear",verticalAlign:"center",horizontalAlign:"center",freeCSS:{left:f,whiteSpace:"nowrap",textAlign:"center"},children:r?r(l):l.rank()},l))}return U(()=>{const l=()=>{let f=x("#Labels-"+e),{width:v}=f.position(),w=Math.round(v/50)-1,h=Math.round(S/w);for(let m=a+1;m<d;m++)x("#Legend-"+e+"-"+m).css({display:m%h==0?"flex":"none"})};return D(window).addEvent({eventID:"SliderResizeCallback-"+e,eventType:"resize",callback:()=>{l()}}),l(),()=>{D(window).removeEvent("SliderResizeCallback-"+e)}},[]),p(B,{className:c("Labels"),verticalAlign:"center",horizontalAlign:"between",fontSize:"0.xs",position:"relative",unitHeight:1,id:"Labels-"+e,children:p(C,{position:"absolute",top:0,left:0,bottom:0,freeCSS:{right:12*1.5},children:i})})},Rail:t=>{let{val_status:e,set_status:n,DotData:s,form:o,enableFormSubmit:r}=t,{componentId:i}=e;return H(B,{className:c("Rail"),position:"relative",paddingLeft:"1/2",unitHeight:1.5,verticalAlign:"center",freeCSS:{zIndex:1,cursor:"pointer"},onPointerDown:a=>{t.rootStates.disabled||(a.stopPropagation(),g.Effects.Start(a,{val_status:e,set_status:n,DotData:s}))},children:[p(C,{className:c("Bar"),backgroundColor:"layer.4",position:"relative",borderRadius:"1.tone.primary",transition:"middle",flexSizing:"none",unitHeight:"2/3",width:1,id:i+"_Bar",children:p(C,{className:c("BarColor"),position:"relative",height:1,width:0,left:0,transition:"long",borderRadius:"inherit",backgroundColor:t.color,opacity:"middle",overflow:"hidden",freeCSS:{width:s.positionLeft},id:i+"_BarColor"})}),p(C,{className:c("BallWrap"),position:"absolute",top:0,left:0,bottom:0,freeCSS:{right:12*1.5},children:p(q.Plain,{className:c("Ball"),position:"absolute",boxShadow:"1.remark",backgroundColor:t.color,top:0,left:0,ssSquare:1.5,borderRadius:"1.tone.primary",freeCSS:{zIndex:2,left:s.positionLeft},id:i+"_Ball",onKeyDown:a=>{g.KeyDownEvent({event:a,val_status:e,set_status:n,DotData:s}),r&&A.SubmitForm(a,o)}})})]})}},g={Effects:{Start:(t,e)=>{D(document).addEvent({eventID:"SliderMouseMove",eventType:"mousemove",callback:n=>{g.Effects.Move(n,e)},options:{passive:!1}}).addEvent({eventID:"SliderTouchMove",eventType:"touchmove",callback:n=>{g.Effects.Move(n,e)},options:{passive:!1}}).addEvent({eventID:"SliderMouseUp",eventType:"mouseup",callback:()=>{g.Effects.End()}}).addEvent({eventID:"SliderTouchEnd",eventType:"touchend",callback:()=>{g.Effects.End()}})},Move:(t,e)=>{let n=D.getCursor(t).x,{val_status:s,set_status:o}=e,{componentId:r,min:i,max:a}=s,d=x("#"+r+"_Ball"),S=x("#"+r+"_Bar"),u=x("#"+r+"_BarColor"),{width:l,left:f}=S.position(),v=(n-f)/l;v=Math.max(v,0),v=Math.min(v,1);let w=v*a,h=F({value:w,val_status:s}),m=h.positionLeft,R=h.stepValue;return d.css({left:m}),u.css({width:m}),o(I=>{let b=I.dataValue;return R==b?I:L(y({},I),{dataValue:R,eventType:"update",eventID:_()})}),t.preventDefault(),t.stopPropagation(),!1},End:()=>{D(document).removeEvent(["SliderMouseMove","SliderTouchMove","SliderMouseUp","SliderTouchEnd"])}},KeyDownEvent:t=>{let{event:e,val_status:n,set_status:s}=t,{min:o,max:r,step:i}=n,{key:a,metaKey:d,ctrlKey:S}=e,u=S||d,l=n.dataValue;a.match(/Arrow/)&&(e.preventDefault(),a.match(/Left|Up/)?u?l=o:l-=i:a.match(/Right|Down/)&&(u?l=r:l+=i),l=Math.max(Math.min(l,r),o),s(f=>L(y({},f),{dataValue:l,eventType:"update",eventID:_()})))}},j=t=>{let M=t,{color:e="theme",required:n,form:s="",legends:{enable:o=!0,custom:r,showAlways:i=!1}={},min:a,max:d,step:S,enableFormSubmit:u,checkValidationAtFirst:l,onValidate:f,onUpdateValue:v,onUpdateValidValue:w,value:h="",className:m,wrapStyles:R}=M,I=V(M,["color","required","form","legends","min","max","step","enableFormSubmit","checkValidationAtFirst","onValidate","onUpdateValue","onUpdateValidValue","value","className","wrapStyles"]),[b,T]=k({componentId:t.componentId||"",dataValue:h,min:a,max:d,step:S,eventType:"init",eventID:_()}),[E,W]=k({ok:!1,notice:[]});A.CommonEffects({type:"slider",states:t,val_status:b,set_status:T,val_validate:E,set_validate:W,SystemValidation:X});let K=F({value:b.dataValue,val_status:b});return p(G,{val_status:b,set_status:T,val_validate:E,states:t,children:H($,L(y({gap:"1/2",flexSizing:"auto"},I),{className:[c("Wrap"),m,c("ShowLegendsAlways_"+i)].join(" "),children:[p(z.Rail,{rootStates:t,color:e,val_status:b,set_status:T,DotData:K,form:s,enableFormSubmit:u}),!!o&&p(z.IndicatorLabels,{componentId:b.componentId,min:a,max:d,step:S,customLegends:r})]}))})},N=t=>{let e=L(y({},t),{freeCSS:y({minWidth:120},t.freeCSS)});return p(O,{componentId:t.componentId,children:j,states:P(e)})};export{N as Slider,N as default};

package/dist/fn/Input/Switch.js

@@ -1 +1 @@
-import{b as a,c as i,d as D}from"../../chunk-C5N2D3ZX.js";import{jsx as t,jsxs as N}from"react/jsx-runtime";import{UUID as V}from"jmini";import{useState as F}from"react";import u from"../../atoms/Box";import{Row as U}from"../../mols";import{Label as W}from"../Button";import{OptionalInputWrapper as A,BoxWrapper as P,CoreEffects as M}from"./core";import{InputSwitchClasses as f}from"../../@styles/componentClasses";function H(e){let{value:o,states:n}=e,{required:R}=n,l=[];return R&&!o&&l.push({type:"invalid",label:"ON\u306B\u306A\u3063\u3066\u3044\u307E\u305B\u3093"}),{ok:!l.filter(({type:m})=>m=="invalid").length,notice:l}}const O=e=>{let k=e,{componentID:o,color:n="posi",required:R,form:l,id:m,enableFormSubmit:z,checkValidationAtFirst:q,onChange:w,onKeyDown:x,onValidate:K,onUpdateValue:$,onUpdateValidValue:G,size:C="regular",value:B="",icon:v="",isApply:s=!1}=k,E=D(k,["componentID","color","required","form","id","enableFormSubmit","checkValidationAtFirst","onChange","onKeyDown","onValidate","onUpdateValue","onUpdateValidValue","size","value","icon","isApply"]),[r,S]=F({componentID:e.componentID||"",dataValue:B,eventType:"init",eventID:V()}),[b,T]=F({ok:!1,notice:[]}),p=!!r.dataValue;M.CommonEffects({type:"switch",states:e,val_status:r,set_status:S,val_validate:b,set_validate:T,SystemValidation:H});let h="middle",g=5,I=3;return s&&(I=4),N(P,{val_status:r,set_status:S,val_validate:b,states:e,children:[t(u,a({htmlTag:"input",type:"checkbox","data-component-id":r.componentID,checked:r.dataValue,className:f("Input"),id:m,onKeyDown:c=>{x&&x(c),z&&M.SubmitForm(c,l)},onChange:c=>{let{checked:L}=c.target;b.ok&&T({ok:!1,notice:[]}),S(_=>i(a({},_),{dataValue:L,eventType:"update",eventID:V()})),w&&w(c)}},E)),t(W.Plain,{tabIndex:-1,htmlFor:m,padding:"1/4",transition:h,borderRadius:"1.tone.primary",className:f("Label"),children:t(u,i(a({},s?{padding:"1/4",isRounded:!0,backgroundColor:p?n:"layer.3"}:{}),{children:N(U.Center,{unitHeight:C=="small"?2:C=="regular"?2.5:C=="large"?3:0,position:"relative",freeCSS:{aspectRatio:(g+I)/g},children:[!s&&t(u,{position:"absolute",backgroundColor:p?n:"layer.5",isRounded:!0,transition:h,width:1,opacity:"middle",className:f("Bar"),freeCSS:{height:"40%"}}),t(u,{position:"absolute",top:0,backgroundColor:!s&&p?n:"white",transition:h,isRounded:!0,flexCenter:!0,boxShadow:"1.remark",className:f("Dot"),freeCSS:{height:"100%",aspectRatio:"1",left:p?`calc(${I.ratio(g+I)}%)`:0},children:v&&t(u,{transition:h,flexCenter:!0,fontColor:p?s?n:"white":"6.clear",children:v})})]})}))})]})},y=e=>{let o=a({},e);return o.value=!!o.value,o.color=o.color||"theme",t(A,{componentID:o.componentID,children:O,states:o})},d=y;d.S=e=>t(y,i(a({},e),{size:"small"})),d.R=e=>t(y,i(a({},e),{size:"regular"})),d.L=e=>t(y,i(a({},e),{size:"large"}));export{d as Switch,d as default};
+import{b as a,c as i,d as V}from"../../chunk-C5N2D3ZX.js";import{jsx as t,jsxs as z}from"react/jsx-runtime";import{UUID as F}from"jmini";import{useState as M}from"react";import c from"../../atoms/Box";import{Row as U}from"../../mols";import{Label as W}from"../Button";import{OptionalInputWrapper as A,BoxWrapper as P,CoreEffects as N}from"./core";import{InputSwitchClasses as f}from"../../@styles/componentClasses";function H(e){let{value:o,states:n}=e,{required:R}=n,l=[];return R&&!o&&l.push({type:"invalid",label:"ON\u306B\u306A\u3063\u3066\u3044\u307E\u305B\u3093"}),{ok:!l.filter(({type:m})=>m=="invalid").length,notice:l}}const O=e=>{let k=e,{componentId:o,color:n="posi",required:R,form:l,id:m,enableFormSubmit:B,checkValidationAtFirst:q,onChange:w,onKeyDown:x,onValidate:K,onUpdateValue:$,onUpdateValidValue:G,size:C="regular",value:D="",icon:v="",isApply:s=!1}=k,E=V(k,["componentId","color","required","form","id","enableFormSubmit","checkValidationAtFirst","onChange","onKeyDown","onValidate","onUpdateValue","onUpdateValidValue","size","value","icon","isApply"]),[r,S]=M({componentId:e.componentId||"",dataValue:D,eventType:"init",eventID:F()}),[b,T]=M({ok:!1,notice:[]}),p=!!r.dataValue;N.CommonEffects({type:"switch",states:e,val_status:r,set_status:S,val_validate:b,set_validate:T,SystemValidation:H});let h="middle",g=5,I=3;return s&&(I=4),z(P,{val_status:r,set_status:S,val_validate:b,states:e,children:[t(c,a({htmlTag:"input",type:"checkbox","data-component-id":r.componentId,checked:r.dataValue,className:f("Input"),id:m,onKeyDown:d=>{x&&x(d),B&&N.SubmitForm(d,l)},onChange:d=>{let{checked:L}=d.target;b.ok&&T({ok:!1,notice:[]}),S(_=>i(a({},_),{dataValue:L,eventType:"update",eventID:F()})),w&&w(d)}},E)),t(W.Plain,{tabIndex:-1,htmlFor:m,padding:"1/4",transition:h,borderRadius:"1.tone.primary",className:f("Label"),children:t(c,i(a({},s?{padding:"1/4",isRounded:!0,backgroundColor:p?n:"layer.3"}:{}),{children:z(U.Center,{unitHeight:C=="small"?2:C=="regular"?2.5:C=="large"?3:0,position:"relative",freeCSS:{aspectRatio:(g+I)/g},children:[!s&&t(c,{position:"absolute",backgroundColor:p?n:"layer.5",isRounded:!0,transition:h,width:1,opacity:"middle",className:f("Bar"),freeCSS:{height:"40%"}}),t(c,{position:"absolute",top:0,backgroundColor:!s&&p?n:"white",transition:h,isRounded:!0,flexCenter:!0,boxShadow:"1.remark",className:f("Dot"),freeCSS:{height:"100%",aspectRatio:"1",left:p?`calc(${I.ratio(g+I)}%)`:0},children:v&&t(c,{transition:h,flexCenter:!0,fontColor:p?s?n:"white":"6.clear",children:v})})]})}))})]})},y=e=>{let o=a({},e);return o.value=!!o.value,o.color=o.color||"theme",t(A,{componentId:o.componentId,children:O,states:o})},u=y;u.S=e=>t(y,i(a({},e),{size:"small"})),u.R=e=>t(y,i(a({},e),{size:"regular"})),u.L=e=>t(y,i(a({},e),{size:"large"}));export{u as Switch,u as default};

package/dist/fn/Input/TextField.d.ts

@@ -43,6 +43,8 @@ declare namespace TextField {
         set_isComposing: React.Dispatch<React.SetStateAction<boolean>>;
         val_status: InputTypes.Status.Text;
         set_status: React.Dispatch<React.SetStateAction<InputTypes.Status.Text>>;
+        val_inputType: React.HTMLInputTypeAttribute;
+        set_inputType: React.Dispatch<React.SetStateAction<React.HTMLInputTypeAttribute>>;
         val_validate: InputTypes.Validation.Result;
         set_validate: React.Dispatch<React.SetStateAction<InputTypes.Validation.Result>>;
     };