amotify
Version:
UI Component for React,NextJS,esbuild
2 lines (1 loc) • 15.3 kB
JavaScript
import{b as g,c as T,d as G}from"../chunk-C5N2D3ZX.js";import{jsx as c,jsxs as $}from"react/jsx-runtime";import f,{UUID as Z,Time as le,useStore as E}from"jmini";import{useState as L,useEffect as X,useRef as pe}from"react";import{$$fromRoot as j,Config as K}from"../@utils";import{Box as k,Flex as he,Img as ie,FAI as ae,Column as oe}from"../atoms";import{Row as re}from"../mols";import{Button as se}from"./Button";import ce from"./Input";import{SheetClasses as d}from"../@styles/componentClasses";import ue from"./Effect";const R={currentIndex:0,openQueue:{},getSessionStates:()=>{let t=E.get("sessionStates-"+K.get().sessionUID);return t||null},getNewSheetStates:t=>{var a;let e=T(g({sheetGroups:t.sheetGroups||[],backgroundEffect:!0,overwrap:t.type=="custom",hold_state:!1,closeAtPageTransit:!0,closeAtEscapeKeyDown:!0,closeAtAroundClick:t.type=="custom"},t),{sheetID:t.sheetID||Z(),isOpen:!0,created_at:le()});if(e.type=="custom"){let l=e;l.parent=l.parent||((a=l==null?void 0:l.event)==null?void 0:a.currentTarget),e=l}return e}},J={Wrapper:()=>{let[t,e]=L([]),a={val_sheets:t,set_sheets:e},l="sessionStates-"+K.get().sessionUID;E.set({[l]:a}),X(()=>{let n="Sheet-"+K.get().sessionUID;E.set({[n]:{add:(u,r)=>{let p=E.get(n);if(!p)return;let s=R.getNewSheetStates(u);if(R.openQueue[s.sheetID])return;if(R.openQueue[s.sheetID]=!0,r!="inherit"&&(s.isOpen=r!=null?r:!0),!!p.find(s.sheetID)){e(C=>{let b=[...C],w=b.findIndex(M=>M.sheetID==s.sheetID);return w==-1||(b[w]=s),b}),delete R.openQueue[s.sheetID];return}e(C=>[s,...C])},find:u=>{let r=R.getSessionStates();if(!r)return null;let{val_sheets:p}=r;return p.find(s=>s.sheetID==u)}}}),f(K.get().appRoot).addEvent({eventType:"keyup",eventID:"SheetEvent.keyUp",callback:function(u){let{key:r,metaKey:p}=u;if(r=="Escape"||r==","&&p){let s=R.getSessionStates();if(!s)return;let{val_sheets:S}=s,C=S.filter(w=>w.isOpen);if(!C.length)return;let b=C.reduce((w,M)=>w.created_at.value>M.created_at.value?w:M);_.close(b.sheetID,r)}}}).addEvent({eventType:"click",eventID:"SheetEvent.Click",callback:function(u){let r=R.getSessionStates();if(!r)return;let{val_sheets:p}=r,s=u.target;if(!s||s!=null&&s.closest("."+d("CustomSheet")))return;let S=p.filter(C=>C.type=="custom");S.length&&S.forEach(C=>{let{parent:b}=C;if(!C.closeAtAroundClick)return;let w=j(b)[0];b!==s&&w!==s&&(f(w).find(s).length||_.close(C.sheetID))})}})},[]);let v=t.map(n=>c(J.Core,T(g({},a),{val_sheet:n,patch_sheet:u=>{e(r=>{let p=[...r],s=p.findIndex(S=>S.sheetID==n.sheetID);return s==-1||(p[s]=g(g({},p[s]),u)),p})},delete_sheet:()=>{e(u=>{let r=[...u],p=r.findIndex(s=>s.sheetID==n.sheetID);return p==-1||r.splice(p,1),r})}}),n.sheetID));return c(k,{className:["AMOTIFY_be",d("Wrapper")].join(" "),children:v})},Core:t=>{let{val_sheet:e,patch_sheet:a}=t,[l,v]=L(R.currentIndex+2),[n]=L(Z()),u=e.type!="custom"&&!e.overwrap;X(()=>{R.currentIndex++,f.scope(()=>{if(!e.closeAtParentBlur)return;let S=f(e.parent);S[0]&&S.addEvent({eventID:"SheetClosation-"+e.sheetID,eventType:"mouseout",callback:()=>{S.removeEvent("SheetClosation-"+e.sheetID),a({isOpen:!1})}})}),E.set({[e.sheetID]:{resize:S=>{if(e.type=="drawer.bottom"){let C=E.get(n);C&&C.resize&&C.resize(S)}else(e.type.includes("normal")||e.type.includes("drawer"))&&a({size:S})},close:S=>{a({isOpen:!1})},open:()=>{a({isOpen:!0})}}})},[]),X(()=>{f.scope(()=>{let S=j("#"+n);if(e.isOpen){e.hold_state&&v(R.currentIndex+1),S.await(10).removeClass(d("Hide")).await(10).addClass(d("Open")).callback(()=>{delete R.openQueue[e.sheetID],e.openAfter&&e.openAfter()});return}S.await(10).removeClass(d("Open")).await(251).addClass(d("Hide")).callback(()=>{if(e.closeAfter&&e.closeAfter(),u&&K.get().browserIs!="safari"&&f(K.get().appRoot).focus(),e.hold_state)return a({isOpen:!1});t.delete_sheet()})})},[e.isOpen]);let[r,p]=e.type.split("."),s=J.Types[{"normal.topLeft":"Normal","normal.topCenter":"Normal","normal.topRight":"Normal","normal.middleLeft":"Normal","normal.middleCenter":"Normal","normal.middleRight":"Normal","normal.bottomLeft":"Normal","normal.bottomCenter":"Normal","normal.bottomRight":"Normal",image:"Normal","drawer.left":"Edge","drawer.right":"Edge","drawer.bottom":"Bottom",custom:"Custom"}[e.type]];return c(k,{className:[d("Wrap"),d("Tcate_"+r),d("Tpos_"+p),d("isMainSheet_"+u)].join(" "),width:1,ssAbsoluteCovered:!0,freeCSS:{zIndex:l},id:n,children:$(oe,{className:d("Content"),gap:0,height:"viewHeight",overflow:"auto",transition:"middle",children:[!!u&&c(J.TapSensor,{sheetID:e.sheetID,delegateAroundClick:e.closeAtAroundClick}),c(s,g({componentID:n},e))]})},n)},Types:{Normal:t=>{let H=t,{sheetID:e,sheetGroups:a,bodyScrolls:l,content:v,className:n="",type:u,size:r="R",freeCSS:p,openAfter:s,closeAfter:S,closeAtAroundClick:C,closeAtEscapeKeyDown:b,closeAtPageTransit:w,closeAtParentBlur:M,closeAtSwipeDown:Y,hold_state:q,overwrap:ee,isOpen:te,backgroundEffect:W}=H,U=G(H,["sheetID","sheetGroups","bodyScrolls","content","className","type","size","freeCSS","openAfter","closeAfter","closeAtAroundClick","closeAtEscapeKeyDown","closeAtPageTransit","closeAtParentBlur","closeAtSwipeDown","hold_state","overwrap","isOpen","backgroundEffect"]),[F,D]=u.split("."),I={},A=[];return D.match(/top/)?(A.push("top"),I.marginBottom="auto"):D.match(/middle/)?(A.push("center"),I.marginTop="auto",I.marginBottom="auto"):D.match(/bottom/)&&(A.push("bottom"),I.marginTop="auto"),D.match(/left/i)?(A.push("left"),I.marginRight="auto"):D.match(/center/i)?(A.push("center"),I.marginLeft="auto",I.marginRight="auto"):D.match(/right/i)&&(A.push("right"),I.marginLeft="auto"),c(k,T(g(g({className:[d("BB"),n].join(" "),padding:1,transition:"long",opacity:"trans"},U),I),{freeCSS:g({width:{S:"26rem",R:"36rem",L:"44rem","2L":"60rem","3L":"72rem",MAX:"100%"}[r],maxWidth:"96vw",transformOrigin:A.join(" ")},p),children:f.is.function(v)?c(v,{}):v}))},Edge:t=>{let U=t,{sheetID:e,sheetGroups:a,bodyScrolls:l,type:v,content:n,className:u="",size:r="R",openAfter:p,closeAfter:s,closeAtAroundClick:S,closeAtEscapeKeyDown:C,closeAtPageTransit:b,closeAtParentBlur:w,closeAtSwipeDown:M,hold_state:Y,overwrap:q,isOpen:ee,backgroundEffect:te}=U,W=G(U,["sheetID","sheetGroups","bodyScrolls","type","content","className","size","openAfter","closeAfter","closeAtAroundClick","closeAtEscapeKeyDown","closeAtPageTransit","closeAtParentBlur","closeAtSwipeDown","hold_state","overwrap","isOpen","backgroundEffect"]);return c(k,T(g(T(g({className:[d("BB"),u].join(" ")},v=="drawer.right"?{marginLeft:"auto"}:v=="drawer.left"?{marginRight:"auto"}:{}),{opacity:"trans",transition:"long",position:"relative",backgroundColor:"layer.1",flexSizing:"none",minHeight:"viewHeight",boxShadow:"3.remark"}),W),{freeCSS:g({width:{S:"20rem",R:"27rem",L:"32rem","2L":"40rem","3L":"58rem",MAX:"100vw"}[r],maxWidth:"96vw"},W.freeCSS),children:f.is.function(n)?c(n,{}):n}))},Bottom:t=>{let V=t,{componentID:e,sheetID:a,sheetGroups:l,bodyScrolls:v,content:n,size:u="R",sizeChanged:r,baseStyles:p,openAfter:s,closeAfter:S,closeAtAroundClick:C,closeAtEscapeKeyDown:b,closeAtPageTransit:w,closeAtParentBlur:M,closeAtSwipeDown:Y=!0,hold_state:q,overwrap:ee,isOpen:te,backgroundEffect:W}=V,U=G(V,["componentID","sheetID","sheetGroups","bodyScrolls","content","size","sizeChanged","baseStyles","openAfter","closeAfter","closeAtAroundClick","closeAtEscapeKeyDown","closeAtPageTransit","closeAtParentBlur","closeAtSwipeDown","hold_state","overwrap","isOpen","backgroundEffect"]),F=f.getScreenSize(),D=[0,.2,.6,.95],I={ZERO:0,S:1,R:2,L:3},[A,H]=L(u),[x,B]=L({process:!1,processStart:0,originY:0,originValue:0,viewHeight:0,value:D[I[u]]});E.update({[e]:{val_edit:x,resize:y=>{let m=D[I[y]];B(h=>T(g({},h),{value:m})),H(y)}}});const z={Start:y=>{f(document).addEvent({eventID:"BottomSheetMouseMove",eventType:"mousemove",callback:z.Move,options:{passive:!1}}).addEvent({eventID:"BottomSheetTouchMove",eventType:"touchmove",callback:z.Move,options:{passive:!1}}).addEvent({eventID:"BottomSheetMouseUp",eventType:"mouseup",callback:z.End}).addEvent({eventID:"BottomSheetTouchEnd",eventType:"touchend",callback:z.End});let m=f.getCursor(y),h=T(g({},x),{process:!0,processStart:new Date().getTime(),originY:m.y,originValue:x.value,viewHeight:f.getScreenSize().height});E.update({[e]:{val_edit:h}}),B(h)},Move:y=>{var O;let m=(O=E.get(e))==null?void 0:O.val_edit;if(!m.process)return;let N=(f.getCursor(y).y-m.originY)/m.viewHeight,o=m.originValue-N;if(o>.95)o=.95+(o-.95)*.5;else if(o<.2){let P=.2-o;P-=.1,o=.1+(.1-P)*.5}return B(T(g({},m),{value:o})),y.preventDefault(),y.stopPropagation(),!1},End:y=>{var o;let m=(o=E.get(e))==null?void 0:o.val_edit;if(!m.process)return;f(document).removeEvent(["BottomSheetMouseMove","BottomSheetTouchMove","BottomSheetMouseUp","BottomSheetTouchEnd"]);let h=0;if(m.value<.1||(m.value<.5?h=1:m.value>.75?h=3:h=2),new Date().getTime()-m.processStart<300){let O=f.getCursor(y).y-m.originY;if(Math.abs(O)>=20){let P=+(O<0)*2-1;h+=P,h=Math.min(Math.max(h,0),D.length-1)}}h==0&&(Y||(h=1)),H(["ZERO","S","R","L"][h]),B(T(g({},m),{value:D[h],process:!1}))}},Q=pe(!1);return X(()=>{Q.current?A=="ZERO"?Y&&_.close(a):setTimeout(()=>{t.sizeChanged&&t.sizeChanged(A)},250):Q.current=!0},[A]),c(k,{className:d("BB"),margin:[0,"auto"],marginTop:"auto",opacity:"trans",width:1,transition:"long",freeCSS:g({maxWidth:12*60,height:F.height*x.value},x.process?{transition:"0s"}:{}),children:$(oe,T(g({gap:0,flexSizing:"none",borderTopLeftRadius:"1.tone.primary",borderTopRightRadius:"1.tone.primary",borderBottom:"unset",boxShadow:"3.remark",position:"relative",overflow:"hidden",height:1},p),{children:[$(re.Separate,{padding:1,backgroundColor:"layer.1",position:"relative",freeCSS:{userSelect:"none"},children:[c(k,{ssSphere:2.5}),c(re.Center,{onPointerDown:z.Start,flexSizing:0,padding:"2/3",ssPushable:!0,isRounded:!0,freeCSS:{cursor:"grab",userSelect:"none"},children:c(k,{unitWidth:6,unitHeight:"1/2",backgroundColor:"layer.4",isRounded:!0,className:d("DragBar")})}),c(se.Sub,{color:"cloud",ssSphere:2.5,onClick:()=>{_.close(a)},children:c(ae.Times,{})})]}),c(k,T(g({backgroundColor:"layer.1",flexSizing:0,overflow:"auto"},U),{children:f.is.function(n)?c(n,{}):n}))]}))})},Custom:t=>{let V=t,{sheetID:e,sheetGroups:a,bodyScrolls:l,event:v,parent:n,nextToCursor:u,gravityPoint:r=22,content:p,closeAtAroundClick:s,closeAtEscapeKeyDown:S,closeAtPageTransit:C,closeAtParentBlur:b,closeAtSwipeDown:w,hold_state:M,openAfter:Y,closeAfter:q,overwrap:ee,isOpen:te,resize:W,backgroundEffect:U}=V,F=G(V,["sheetID","sheetGroups","bodyScrolls","event","parent","nextToCursor","gravityPoint","content","closeAtAroundClick","closeAtEscapeKeyDown","closeAtPageTransit","closeAtParentBlur","closeAtSwipeDown","hold_state","openAfter","closeAfter","overwrap","isOpen","resize","backgroundEffect"]),[D]=L(Z()),I=f.is.element(n)||f.is.jmini(n)?f(n):j(n),A='[data-sheet-id="'+D+'"]',H='[data-sheet-content="'+D+'"]';r=r;let x=r%5||5,B=Math.ceil(r/5);const z={Init:()=>{if(u&&v){let i=f.getScreenSize(),ne=f.getCursor(v);return{top:ne.y-i.pageYOffset,left:ne.x-i.pageXOffset}}let y={};if(!I||!I[0])return y;let{top:m,right:h,bottom:N,left:o,height:O,width:P}=I.position();return[1,2].includes(x)?y.left=o:x==3?y.left=o+P/2:[4,5].includes(x)&&(y.left=h),r<=10?y.top=m:r<=15?y.top=m+O/2:r<=25&&(y.top=N),y},Adjust:()=>{let y=j(A).position(),m=j(H).position(),h=I.position(),N=f.getScreenSize(),o={};for(let i in m)o[i]=m[i];if(f.scope(()=>{if(t.nextToCursor)return;let i=0;B==1?i=h.top-o.bottom:B==2?i=h.top-o.top:B==3?i=h.top-o.top+(h.height-o.height)/2:B==4?i=h.bottom-o.bottom:B==5&&(i=h.bottom-o.top),o.top+=i,o.bottom+=i}),f.scope(()=>{if(t.nextToCursor)return;let i=0;x==1?i=h.left-o.right:x==2?i=h.left-o.left:x==3?i=h.left-o.left+(h.width-o.width)/2:x==4?i=h.right-o.right:x==5&&(i=h.right-o.left),o.left+=i,o.right+=i}),o.top<0){let i=-o.top;o.top+=i,o.bottom+=i}if(o.bottom>N.height){let i=o.bottom-N.height;o.top-=i,o.bottom-=i}if(o.left<0){let i=-o.left;o.left+=i,o.right+=i}if(o.right>N.width){let i=o.right-N.width;o.left-=i,o.right-=i}let O=o.top-m.top,P=o.left-m.left;f(A).css({top:y.top+O+"px",left:y.left+P+"px"})}};let[Q]=L(z.Init());return X(()=>{j(A).await(10).addClass(d("Open")).await(200).callback(()=>{(W==null||W)&&z.Adjust()}),E.update({["customSheet-"+t.sheetID]:{reposition:()=>{z.Adjust()}}})},[]),I[0]?c(k,{className:[d("BB"),d("CustomSheet")].join(" "),"data-sheet-id":D,transition:"long",position:"absolute",width:0,height:0,opacity:"trans",flexCenter:!0,freeCSS:Q,children:c(he,{position:"absolute",className:[d("GPT"),d("GPT_"+r),d("Col_"+x),d("Row_"+B)].join(" "),children:c(k,T(g({"data-sheet-content":D,flexSizing:"none",maxHeight:"viewHeight"},F),{freeCSS:g({maxWidth:"98vw"},F.freeCSS),children:f.is.function(p)?c(p,{}):p}))})}):null}},TapSensor:t=>c(k,{className:d("TapSensor"),children:c(se.Plain,{className:d("TapContent"),onClick:e=>{var a;(a=t.delegateAroundClick)!=null&&a&&_.close(t.sheetID)},freeCSS:{cursor:"default",pointerEvents:"all"}})})},_={Wrapper:()=>c(J.Wrapper,{}),Element:t=>{let v=t,{isOpen:e,children:a}=v,l=G(v,["isOpen","children"]);return X(()=>{if(e){_.open(T(g({},l),{content:a}));return}l.sheetID&&_.close(l.sheetID)},[e]),null},open:(t,e)=>{if(t.sheetID=(t.sheetID||"").replace(/\./g,"-"),t.type=="image"){let v=t.sheetID||Z(),l=t,{type:n,src:u}=l,r=G(l,["type","src"]);_.open(T(g({type:"normal.topCenter",size:"MAX",backgroundColor:"trans",height:"viewHeight"},r),{sheetID:v,freeCSS:{maxWidth:"96vw",transformOrigin:"top"},content:()=>{let[p]=L(f.flatArray(u)),[s,S]=L(0),C=[];return p.forEach((b,w)=>{C.push({value:w,label:c(ie,{src:f.flatArray(b)[0],width:"auto",height:1,borderRadius:"3.tone.tertiary",freeCSS:{maxWidth:12*6,maxHeight:12*3}})})}),$(oe,{gap:0,height:1,position:"relative",children:[$(re.Separate,{position:"absolute",top:0,left:0,right:0,padding:[1,2],freeCSS:{zIndex:2},children:[c(ce.Radio,{icon:!1,value:s,override:"force",horizontalAlign:"center",onUpdateValidValue:b=>{S(b)},cellStyles:{border:!0,borderWidth:2,padding:"1/3",paddingRight:"1/3",boxShadow:"2.normal",gap:0},cellCheckedStyles:{borderColor:"theme"},options:C}),c(se.Sub.S,{color:"cloud",ssSphere:3,onClick:()=>{_.close(v)},children:c(ae.Times,{})})]}),c(ue.FadeIn,{flexCenter:!0,flexSizing:0,overflow:"auto",children:c(ie,{width:"auto",height:"auto",maxWidth:1,maxHeight:1,src:p[s]})},s)]})}}));return}let a=E.get("Sheet-"+K.get().sessionUID);a&&a.add(t,e)},resize:t=>{t.sheetID=(t.sheetID||"").replace(/\./g,"-");let e=E.get(t.sheetID);e&&e.resize&&e.resize(t.size)},customSheet:{reposition:t=>{let e=E.get("customSheet-"+t);e&&e.reposition&&e.reposition()}},close:function(t,e,a){let l=R.getSessionStates();if(!l)return;let{val_sheets:v}=l;t=t==null?void 0:t.replace(/\./g,"-");let n=v.find(r=>r.sheetID==t);if(!n||e=="Escape"&&!n.closeAtEscapeKeyDown)return;let u=E.get(n.sheetID);u&&u.close&&u.close(a)},closeGroup:t=>{let e=R.getSessionStates();if(!e)return;let{val_sheets:a}=e;t=(t||"").replace(/\./g,"-");for(let l of a)l.sheetGroups&&l.sheetGroups==t&&_.close(l.sheetID)},closeAll:t=>{let e=R.getSessionStates();if(!e)return;let{val_sheets:a}=e;for(let l of a)t&&!l.closeAtPageTransit||_.close(l.sheetID,"pageTransit",!0)},Body:t=>c(k,g({className:d("BaseBody"),backgroundColor:"layer.1",borderRadius:"1.tone.primary",position:"relative",boxShadow:"3.remark",transition:"long"},t))};export{_ as Sheet,_ as default};