@vacano/ui 1.15.0 → 1.15.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -1
- package/dist/index.cjs +183 -179
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.ts +2 -2
- package/dist/index.js +677 -672
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
|
@@ -125,13 +125,13 @@
|
|
|
125
125
|
cursor: ${({$disabled:e})=>e?"not-allowed":"pointer"};
|
|
126
126
|
font-size: 14px;
|
|
127
127
|
font-weight: 600;
|
|
128
|
-
color: ${n.COLORS.black};
|
|
128
|
+
color: ${({$expanded:e})=>e?n.COLORS.black:n.COLORS["iron-grey"]};
|
|
129
129
|
text-align: left;
|
|
130
130
|
outline: none;
|
|
131
131
|
transition: color 0.2s ease;
|
|
132
132
|
|
|
133
133
|
&:hover {
|
|
134
|
-
color: ${n.COLORS
|
|
134
|
+
color: ${n.COLORS.black};
|
|
135
135
|
}
|
|
136
136
|
`,It=d.styled.span`
|
|
137
137
|
display: flex;
|
|
@@ -154,7 +154,7 @@
|
|
|
154
154
|
font-size: 14px;
|
|
155
155
|
line-height: 1.5;
|
|
156
156
|
color: ${n.COLORS["iron-grey"]};
|
|
157
|
-
`,ne=C.newClassNameGetter("accordion"),Mt=()=>l.jsx("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:l.jsx("polyline",{points:"6 9 12 15 18 9"})}),Ft=({className:e,classnames:t,defaultValue:o=[],items:r,multiple:i=!1,onChange:a,ref:c,value:s,variant:p="outlined",...x})=>{const[g,h]=u.useState(o),y=s!==void 0,f=y?s:g,S=u.useCallback(b=>{const $=f.includes(b);let m;i?m=$?f.filter(O=>O!==b):[...f,b]:m=$?[]:[b],y||h(m),a==null||a(m)},[f,y,i,a]);return l.jsx(zt,{...x,ref:c,$variant:p,className:ne("container",e),role:"region",children:r.map(b=>{const $=f.includes(b.value);return l.jsxs(Nt,{$variant:p,$disabled:!!b.disabled,className:ne("item",t==null?void 0:t.item),children:[l.jsxs(Tt,{type:"button","aria-expanded":$,$disabled:!!b.disabled
|
|
157
|
+
`,ne=C.newClassNameGetter("accordion"),Mt=()=>l.jsx("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:l.jsx("polyline",{points:"6 9 12 15 18 9"})}),Ft=({className:e,classnames:t,defaultValue:o=[],items:r,multiple:i=!1,onChange:a,ref:c,value:s,variant:p="outlined",...x})=>{const[g,h]=u.useState(o),y=s!==void 0,f=y?s:g,S=u.useCallback(b=>{const $=f.includes(b);let m;i?m=$?f.filter(O=>O!==b):[...f,b]:m=$?[]:[b],y||h(m),a==null||a(m)},[f,y,i,a]);return l.jsx(zt,{...x,ref:c,$variant:p,className:ne("container",e),role:"region",children:r.map(b=>{const $=f.includes(b.value);return l.jsxs(Nt,{$variant:p,$disabled:!!b.disabled,className:ne("item",t==null?void 0:t.item),children:[l.jsxs(Tt,{type:"button","aria-expanded":$,$disabled:!!b.disabled,$expanded:$,disabled:b.disabled,onClick:()=>S(b.value),className:ne("trigger",t==null?void 0:t.trigger),children:[b.title,l.jsx(It,{$expanded:$,className:ne("icon",t==null?void 0:t.icon),children:l.jsx(Mt,{})})]}),l.jsx(At,{$expanded:$,children:l.jsx(Pt,{children:l.jsx(Bt,{className:ne("content",t==null?void 0:t.content),children:b.content})})})]},b.value)})})},_t={none:"0",sm:"8px",md:"12px",lg:"16px",full:"9999px"},Dt={normal:n.COLORS.black,success:n.COLORS.green,warning:n.COLORS.yellow,danger:n.COLORS.red},Gt=d.styled.div`
|
|
158
158
|
display: flex;
|
|
159
159
|
align-items: ${({$center:e})=>e?"center":"flex-start"};
|
|
160
160
|
gap: 12px;
|
|
@@ -704,6 +704,11 @@
|
|
|
704
704
|
grid-row: 2;
|
|
705
705
|
}
|
|
706
706
|
`,$r=C.newClassNameGetter("field-row"),Sr=({className:e,gap:t=16,ref:o,...r})=>l.jsx(br,{...r,ref:o,$gap:t,className:$r("container",e)}),bt=e=>{if(e===0)return"0 B";const t=["B","KB","MB","GB"],o=Math.floor(Math.log(e)/Math.log(1024)),r=e/Math.pow(1024,o);return`${r%1===0?r:r.toFixed(1)} ${t[o]}`},Ve=(e,t)=>t.split(",").map(r=>r.trim()).some(r=>r.startsWith(".")?e.name.toLowerCase().endsWith(r.toLowerCase()):r.endsWith("/*")?e.type.startsWith(r.replace("/*","/")):e.type===r),mr=d.styled.div`
|
|
707
|
+
flex-shrink: 0;
|
|
708
|
+
display: flex;
|
|
709
|
+
flex-direction: column;
|
|
710
|
+
gap: 16px;
|
|
711
|
+
`,Or=d.styled.div`
|
|
707
712
|
display: flex;
|
|
708
713
|
flex-direction: column;
|
|
709
714
|
align-items: center;
|
|
@@ -725,7 +730,7 @@
|
|
|
725
730
|
background-color: #f9fafb;
|
|
726
731
|
}
|
|
727
732
|
`}
|
|
728
|
-
`,
|
|
733
|
+
`,vr=d.styled.div`
|
|
729
734
|
display: flex;
|
|
730
735
|
align-items: center;
|
|
731
736
|
justify-content: center;
|
|
@@ -740,7 +745,7 @@
|
|
|
740
745
|
width: 20px;
|
|
741
746
|
height: 20px;
|
|
742
747
|
}
|
|
743
|
-
`,
|
|
748
|
+
`,wr=d.styled.div`
|
|
744
749
|
display: flex;
|
|
745
750
|
flex-direction: column;
|
|
746
751
|
align-items: center;
|
|
@@ -748,30 +753,29 @@
|
|
|
748
753
|
font-size: 14px;
|
|
749
754
|
color: ${n.COLORS["iron-grey"]};
|
|
750
755
|
text-align: center;
|
|
751
|
-
`,
|
|
756
|
+
`,Cr=d.styled.span`
|
|
752
757
|
color: ${n.COLORS.black};
|
|
753
758
|
font-weight: 600;
|
|
754
759
|
cursor: pointer;
|
|
755
|
-
`,
|
|
760
|
+
`,Rr=d.styled.div`
|
|
756
761
|
font-size: 12px;
|
|
757
762
|
color: ${n.COLORS["iron-grey"]};
|
|
758
763
|
text-align: center;
|
|
759
|
-
`,
|
|
764
|
+
`,Lr=d.styled.input`
|
|
760
765
|
display: none;
|
|
761
766
|
`;d.styled.div`
|
|
762
767
|
display: flex;
|
|
763
768
|
flex-direction: column;
|
|
764
769
|
gap: 12px;
|
|
765
|
-
|
|
766
|
-
`;const Lr={uploading:n.COLORS.gray,complete:n.COLORS.gray,failed:n.COLORS.red},kr=d.styled.div`
|
|
770
|
+
`;const kr={uploading:n.COLORS.gray,complete:n.COLORS.gray,failed:n.COLORS.red},jr=d.styled.div`
|
|
767
771
|
display: flex;
|
|
768
772
|
align-items: flex-start;
|
|
769
773
|
gap: 12px;
|
|
770
774
|
padding: 14px;
|
|
771
|
-
border: 1px solid ${({$status:e})=>
|
|
775
|
+
border: 1px solid ${({$status:e})=>kr[e]};
|
|
772
776
|
border-radius: 12px;
|
|
773
777
|
transition: border-color 0.15s ease;
|
|
774
|
-
`,
|
|
778
|
+
`,Er=d.styled.div`
|
|
775
779
|
display: flex;
|
|
776
780
|
align-items: center;
|
|
777
781
|
justify-content: center;
|
|
@@ -786,54 +790,54 @@
|
|
|
786
790
|
width: 20px;
|
|
787
791
|
height: 20px;
|
|
788
792
|
}
|
|
789
|
-
`,
|
|
793
|
+
`,zr=d.styled.div`
|
|
790
794
|
flex: 1;
|
|
791
795
|
min-width: 0;
|
|
792
796
|
display: flex;
|
|
793
797
|
flex-direction: column;
|
|
794
798
|
gap: 4px;
|
|
795
|
-
`,
|
|
799
|
+
`,Nr=d.styled.div`
|
|
796
800
|
display: flex;
|
|
797
801
|
align-items: flex-start;
|
|
798
802
|
justify-content: space-between;
|
|
799
803
|
gap: 8px;
|
|
800
|
-
`,Nr=d.styled.div`
|
|
801
|
-
min-width: 0;
|
|
802
804
|
`,Tr=d.styled.div`
|
|
805
|
+
min-width: 0;
|
|
806
|
+
`,Ir=d.styled.div`
|
|
803
807
|
font-size: 14px;
|
|
804
808
|
font-weight: 500;
|
|
805
809
|
color: ${n.COLORS.black};
|
|
806
810
|
white-space: nowrap;
|
|
807
811
|
overflow: hidden;
|
|
808
812
|
text-overflow: ellipsis;
|
|
809
|
-
`,
|
|
813
|
+
`,Ar=d.styled.div`
|
|
810
814
|
font-size: 14px;
|
|
811
815
|
color: ${n.COLORS["iron-grey"]};
|
|
812
|
-
`,
|
|
816
|
+
`,Pr=d.styled.div`
|
|
813
817
|
display: flex;
|
|
814
818
|
align-items: center;
|
|
815
819
|
gap: 12px;
|
|
816
820
|
margin-top: 2px;
|
|
817
|
-
`,
|
|
821
|
+
`,Br=d.styled.div`
|
|
818
822
|
flex: 1;
|
|
819
823
|
height: 8px;
|
|
820
824
|
border-radius: 4px;
|
|
821
825
|
background-color: ${n.COLORS.gray};
|
|
822
826
|
overflow: hidden;
|
|
823
|
-
`,
|
|
827
|
+
`,Mr=d.styled.div`
|
|
824
828
|
height: 100%;
|
|
825
829
|
width: ${({$value:e})=>Math.min(100,Math.max(0,e))}%;
|
|
826
830
|
border-radius: 4px;
|
|
827
831
|
background-color: ${({$status:e})=>e==="failed"?n.COLORS.red:n.COLORS.black};
|
|
828
832
|
transition: width 0.2s ease;
|
|
829
|
-
`,
|
|
833
|
+
`,Fr=d.styled.span`
|
|
830
834
|
flex-shrink: 0;
|
|
831
835
|
font-size: 14px;
|
|
832
836
|
color: ${n.COLORS.black};
|
|
833
837
|
font-weight: 500;
|
|
834
838
|
min-width: 36px;
|
|
835
839
|
text-align: right;
|
|
836
|
-
`,
|
|
840
|
+
`,_r=d.styled.button`
|
|
837
841
|
display: flex;
|
|
838
842
|
align-items: center;
|
|
839
843
|
justify-content: center;
|
|
@@ -856,7 +860,7 @@
|
|
|
856
860
|
&:hover {
|
|
857
861
|
color: ${n.COLORS.black};
|
|
858
862
|
}
|
|
859
|
-
`,
|
|
863
|
+
`,Dr=d.styled.button`
|
|
860
864
|
display: inline;
|
|
861
865
|
padding: 0;
|
|
862
866
|
border: none;
|
|
@@ -876,7 +880,7 @@
|
|
|
876
880
|
gap: 4px;
|
|
877
881
|
font-size: 14px;
|
|
878
882
|
color: ${n.COLORS["iron-grey"]};
|
|
879
|
-
`,
|
|
883
|
+
`,Gr=d.styled.span`
|
|
880
884
|
display: inline-flex;
|
|
881
885
|
color: ${n.COLORS.green};
|
|
882
886
|
|
|
@@ -884,7 +888,7 @@
|
|
|
884
888
|
width: 16px;
|
|
885
889
|
height: 16px;
|
|
886
890
|
}
|
|
887
|
-
`,$e=C.newClassNameGetter("file-upload"),
|
|
891
|
+
`,$e=C.newClassNameGetter("file-upload"),Yr=()=>l.jsxs("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[l.jsx("path",{d:"M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"}),l.jsx("polyline",{points:"17 8 12 3 7 8"}),l.jsx("line",{x1:"12",x2:"12",y1:"3",y2:"15"})]}),Hr=({accept:e,children:t,className:o,classnames:r,description:i,disabled:a=!1,hint:c,icon:s,maxSize:p,multiple:x=!1,onChange:g,onReject:h,ref:y,...f})=>{const S=u.useRef(null),[b,$]=u.useState(!1),m=u.useCallback(L=>{if(!L||L.length===0)return;const R=Array.from(L);if(e){const E=R.filter(w=>!Ve(w,e));if(E.length>0){h==null||h(E,"type");const w=R.filter(T=>Ve(T,e));if(w.length===0)return;g==null||g(w);return}}if(p){const E=R.filter(w=>w.size>p);if(E.length>0){h==null||h(E,"size");const w=R.filter(T=>T.size<=p);if(w.length===0)return;g==null||g(w);return}}g==null||g(R)},[e,p,g,h]),O=()=>{var L;a||(L=S.current)==null||L.click()},v=L=>{m(L.target.files),S.current&&(S.current.value="")},k=L=>{L.preventDefault(),L.stopPropagation(),a||$(!0)},z=L=>{L.preventDefault(),L.stopPropagation(),$(!1)},j=L=>{L.preventDefault(),L.stopPropagation(),$(!1),a||m(L.dataTransfer.files)};return l.jsxs(mr,{ref:y,className:o,...f,children:[l.jsxs(Or,{className:$e("dropzone",r==null?void 0:r.dropzone),$disabled:a,$dragOver:b,onClick:O,onDragOver:k,onDragLeave:z,onDrop:j,role:"button",tabIndex:a?-1:0,"aria-disabled":a,children:[l.jsx(vr,{className:$e("icon",r==null?void 0:r.icon),children:s||l.jsx(Yr,{})}),l.jsx(wr,{className:$e("text",r==null?void 0:r.text),children:i||l.jsxs("span",{children:[l.jsx(Cr,{children:"Click to upload"})," or drag and drop"]})}),c&&l.jsx(Rr,{className:$e("hint",r==null?void 0:r.hint),children:c})]}),l.jsx(Lr,{ref:S,type:"file",accept:e,multiple:x,onChange:v,tabIndex:-1}),t]})},J=C.newClassNameGetter("file-upload-item"),Xr=()=>l.jsxs("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[l.jsx("path",{d:"M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z"}),l.jsx("path",{d:"M14 2v4a2 2 0 0 0 2 2h4"})]}),Ur=()=>l.jsxs("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[l.jsx("path",{d:"M18 6 6 18"}),l.jsx("path",{d:"m6 6 12 12"})]}),Wr=()=>l.jsx("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:l.jsx("path",{d:"M20 6 9 17l-5-5"})}),qr=({name:e,size:t,status:o="uploading",progress:r=0,icon:i,onRemove:a,onRetry:c,className:s,classnames:p,ref:x})=>l.jsxs(jr,{ref:x,className:J("item",s),$status:o,children:[l.jsx(Er,{className:J("icon",p==null?void 0:p.icon),$status:o,children:i||l.jsx(Xr,{})}),l.jsxs(zr,{children:[l.jsxs(Nr,{children:[l.jsxs(Tr,{className:J("info",p==null?void 0:p.info),children:[l.jsx(Ir,{className:J("name",p==null?void 0:p.name),children:e}),l.jsx(Ar,{className:J("size",p==null?void 0:p.size),children:bt(t)})]}),a&&l.jsx(_r,{className:J("action",p==null?void 0:p.action),onClick:a,"aria-label":"Remove file",type:"button",children:l.jsx(Ur,{})})]}),o==="uploading"&&l.jsxs(Pr,{className:J("progress",p==null?void 0:p.progress),children:[l.jsx(Br,{children:l.jsx(Mr,{$value:r,$status:o})}),l.jsxs(Fr,{children:[r,"%"]})]}),o==="complete"&&l.jsxs(Ze,{children:[l.jsx(Gr,{children:l.jsx(Wr,{})}),"Complete"]}),o==="failed"&&l.jsxs(Ze,{children:["Upload failed."," ",c&&l.jsx(Dr,{onClick:c,type:"button",children:"Try again"})]})]})]}),$t=`
|
|
888
892
|
display: inline-flex;
|
|
889
893
|
font-size: 14px;
|
|
890
894
|
color: #666;
|
|
@@ -895,24 +899,24 @@
|
|
|
895
899
|
&:hover {
|
|
896
900
|
color: ${n.COLORS["steel-blue"]};
|
|
897
901
|
}
|
|
898
|
-
`,
|
|
902
|
+
`,Kr=d.styled.span`
|
|
899
903
|
${$t}
|
|
900
904
|
cursor: ${({$clickable:e})=>e?"pointer":"default"};
|
|
901
905
|
${({$clickable:e})=>e&&St}
|
|
902
|
-
`,
|
|
906
|
+
`,Vr=d.styled.a`
|
|
903
907
|
${$t}
|
|
904
908
|
${St}
|
|
905
|
-
`,
|
|
909
|
+
`,Zr=d.styled.span``,Jr=d.styled.span``,Se=C.newClassNameGetter("hashtag"),Qr=({children:e,className:t,classnames:o,href:r,onClick:i,ref:a,...c})=>{const s=l.jsxs(l.Fragment,{children:[l.jsx(Zr,{className:Se("hash",o==null?void 0:o.hash),children:"#"}),l.jsx(Jr,{className:Se("label",o==null?void 0:o.label),children:e})]});if(r)return l.jsx(Vr,{ref:a,href:r,className:Se("container",t),onClick:i,children:s});const p=!!i;return l.jsx(Kr,{...c,ref:a,className:Se("container",t),$clickable:p,onClick:i,role:p?"button":void 0,tabIndex:p?0:void 0,children:s})},Je={1:{fontSize:32,lineHeight:1.2},2:{fontSize:24,lineHeight:1.25},3:{fontSize:18,lineHeight:1.3},4:{fontSize:16,lineHeight:1.4},5:{fontSize:14,lineHeight:1.4},6:{fontSize:12,lineHeight:1.5}},en=d.styled.h1`
|
|
906
910
|
margin: 0;
|
|
907
911
|
font-weight: 700;
|
|
908
912
|
color: ${n.COLORS.black};
|
|
909
913
|
font-size: ${({$level:e})=>Je[e].fontSize}px;
|
|
910
914
|
line-height: ${({$level:e})=>Je[e].lineHeight};
|
|
911
|
-
`,
|
|
915
|
+
`,tn=C.newClassNameGetter("heading"),on=({as:e,children:t,className:o,level:r=3,ref:i,...a})=>l.jsx(en,{...a,as:`h${e??r}`,ref:i,className:tn("container",o),$level:r,children:t}),rn=d.styled.div`
|
|
912
916
|
display: flex;
|
|
913
917
|
flex-direction: column;
|
|
914
918
|
gap: 12px;
|
|
915
|
-
`,
|
|
919
|
+
`,nn=d.styled.div`
|
|
916
920
|
width: ${({$size:e})=>e}px;
|
|
917
921
|
height: ${({$size:e})=>e}px;
|
|
918
922
|
border-radius: 8px;
|
|
@@ -928,10 +932,10 @@
|
|
|
928
932
|
height: 100%;
|
|
929
933
|
object-fit: cover;
|
|
930
934
|
}
|
|
931
|
-
`,
|
|
935
|
+
`,ln=d.styled.span`
|
|
932
936
|
font-size: 12px;
|
|
933
937
|
color: ${n.COLORS["iron-grey"]};
|
|
934
|
-
`,
|
|
938
|
+
`,an=e=>`
|
|
935
939
|
.${e} {
|
|
936
940
|
padding: 7px 16px;
|
|
937
941
|
font-size: 14px;
|
|
@@ -949,7 +953,7 @@
|
|
|
949
953
|
.${e}:active {
|
|
950
954
|
transform: translate(0, 1px);
|
|
951
955
|
}
|
|
952
|
-
`,
|
|
956
|
+
`,dn=e=>`
|
|
953
957
|
.${e} {
|
|
954
958
|
display: flex;
|
|
955
959
|
flex: 1 1 auto;
|
|
@@ -973,7 +977,7 @@
|
|
|
973
977
|
max-height: 70vh;
|
|
974
978
|
}
|
|
975
979
|
}
|
|
976
|
-
`,
|
|
980
|
+
`,sn=e=>`
|
|
977
981
|
.${e} {
|
|
978
982
|
padding: 7px 16px;
|
|
979
983
|
font-size: 14px;
|
|
@@ -991,7 +995,7 @@
|
|
|
991
995
|
.${e}:active {
|
|
992
996
|
transform: translate(0, 1px);
|
|
993
997
|
}
|
|
994
|
-
`,
|
|
998
|
+
`,cn=e=>`
|
|
995
999
|
.${e} {
|
|
996
1000
|
display: flex;
|
|
997
1001
|
flex-direction: column;
|
|
@@ -1009,7 +1013,7 @@
|
|
|
1009
1013
|
border-radius: 8px;
|
|
1010
1014
|
}
|
|
1011
1015
|
}
|
|
1012
|
-
`,
|
|
1016
|
+
`,pn=e=>`
|
|
1013
1017
|
.${e} {
|
|
1014
1018
|
display: flex;
|
|
1015
1019
|
justify-content: flex-end;
|
|
@@ -1028,7 +1032,7 @@
|
|
|
1028
1032
|
gap: 8px;
|
|
1029
1033
|
}
|
|
1030
1034
|
}
|
|
1031
|
-
`,
|
|
1035
|
+
`,un=e=>`
|
|
1032
1036
|
.${e} {
|
|
1033
1037
|
display: flex;
|
|
1034
1038
|
justify-content: flex-start;
|
|
@@ -1050,7 +1054,7 @@
|
|
|
1050
1054
|
font-size: 14px;
|
|
1051
1055
|
}
|
|
1052
1056
|
}
|
|
1053
|
-
`,
|
|
1057
|
+
`,gn=e=>`
|
|
1054
1058
|
.${e} {
|
|
1055
1059
|
display: block;
|
|
1056
1060
|
z-index: 101;
|
|
@@ -1068,27 +1072,27 @@
|
|
|
1068
1072
|
position: absolute;
|
|
1069
1073
|
touch-action: none;
|
|
1070
1074
|
}
|
|
1071
|
-
`,
|
|
1075
|
+
`,xn=e=>`
|
|
1072
1076
|
.${e} {
|
|
1073
1077
|
position: absolute;
|
|
1074
1078
|
z-index: 2;
|
|
1075
1079
|
background-color: rgba(0, 0, 0, 0.6);
|
|
1076
1080
|
touch-action: none;
|
|
1077
1081
|
}
|
|
1078
|
-
`,
|
|
1082
|
+
`,hn=e=>`
|
|
1079
1083
|
.${e} {
|
|
1080
1084
|
position: absolute;
|
|
1081
1085
|
z-index: 3;
|
|
1082
1086
|
touch-action: none;
|
|
1083
1087
|
}
|
|
1084
|
-
`,
|
|
1088
|
+
`,fn=e=>`
|
|
1085
1089
|
.${e} {
|
|
1086
1090
|
backface-visibility: hidden;
|
|
1087
1091
|
perspective: 1000px;
|
|
1088
1092
|
max-inline-size: unset !important;
|
|
1089
1093
|
max-block-size: unset !important;
|
|
1090
1094
|
}
|
|
1091
|
-
`,
|
|
1095
|
+
`,yn=e=>`
|
|
1092
1096
|
.${e} {
|
|
1093
1097
|
position: absolute;
|
|
1094
1098
|
z-index: 100;
|
|
@@ -1099,7 +1103,7 @@
|
|
|
1099
1103
|
overflow: hidden;
|
|
1100
1104
|
border-radius: 50%;
|
|
1101
1105
|
}
|
|
1102
|
-
`,
|
|
1106
|
+
`,bn={tl:"nw-resize",tr:"ne-resize",bl:"sw-resize",br:"se-resize"},$n={tl:{h:"left",v:"top"},tr:{h:"right",v:"top"},bl:{h:"left",v:"bottom"},br:{h:"right",v:"bottom"}},me=(e,t)=>{const o=bn[t],{h:r,v:i}=$n[t];return`
|
|
1103
1107
|
.${e} {
|
|
1104
1108
|
display: block;
|
|
1105
1109
|
z-index: 102;
|
|
@@ -1125,7 +1129,7 @@
|
|
|
1125
1129
|
${i}: -12px;
|
|
1126
1130
|
}
|
|
1127
1131
|
}
|
|
1128
|
-
`}
|
|
1132
|
+
`},Sn=e=>`
|
|
1129
1133
|
.${e} {
|
|
1130
1134
|
display: flex;
|
|
1131
1135
|
align-items: center;
|
|
@@ -1151,7 +1155,7 @@
|
|
|
1151
1155
|
padding-bottom: env(safe-area-inset-bottom, 8px);
|
|
1152
1156
|
}
|
|
1153
1157
|
}
|
|
1154
|
-
`,
|
|
1158
|
+
`,mn=e=>`
|
|
1155
1159
|
.${e} {
|
|
1156
1160
|
backface-visibility: hidden;
|
|
1157
1161
|
user-select: none;
|
|
@@ -1164,25 +1168,25 @@
|
|
|
1164
1168
|
position: absolute;
|
|
1165
1169
|
z-index: 1;
|
|
1166
1170
|
}
|
|
1167
|
-
`,
|
|
1168
|
-
${
|
|
1169
|
-
${
|
|
1170
|
-
${
|
|
1171
|
-
${
|
|
1172
|
-
${
|
|
1173
|
-
${
|
|
1174
|
-
${
|
|
1175
|
-
${
|
|
1176
|
-
${
|
|
1177
|
-
${
|
|
1178
|
-
${
|
|
1171
|
+
`,On=e=>{let t=5381;for(let o=0;o<e.length;o++)t=(t<<5)+t^e.charCodeAt(o);return Math.abs(t).toString(36)},I=e=>`hq-cropper__${On(e)}`,A=e=>e||[],P=(e,t)=>{if(t)for(const o of t)e.classList.add(o)},vn=e=>{const t={applyButton:[I("applyButton"),...A(e.applyButton)],cancelButton:[I("cancelButton"),...A(e.cancelButton)],container:[I("container"),...A(e.container)],handlerMove:[I("handlerMove"),...A(e.handlerMove)],handlerResizeTopLeft:[I("handlerResizeTopLeft"),...A(e.handlerResizeTopLeft)],handlerResizeTopRight:[I("handlerResizeTopRight"),...A(e.handlerResizeTopRight)],handlerResizeBottomLeft:[I("handlerResizeBottomLeft"),...A(e.handlerResizeBottomLeft)],handlerResizeBottomRight:[I("handlerResizeBottomRight"),...A(e.handlerResizeBottomRight)],sourceImage:[I("sourceImage"),...A(e.sourceImage)],portalArea:[I("portalArea"),...A(e.portalArea)],previewImage:[I("previewImage"),...A(e.previewImage)],body:[I("body"),...A(e.body)],header:[I("header"),...A(e.header)],footer:[I("footer"),...A(e.footer)],portal:[I("portal"),...A(e.portal)],preview:[I("preview"),...A(e.preview)],root:[I("root"),...A(e.root)]},o=`
|
|
1172
|
+
${an(t.applyButton[0])}
|
|
1173
|
+
${dn(t.body[0])}
|
|
1174
|
+
${sn(t.cancelButton[0])}
|
|
1175
|
+
${cn(t.container[0])}
|
|
1176
|
+
${pn(t.footer[0])}
|
|
1177
|
+
${un(t.header[0])}
|
|
1178
|
+
${gn(t.handlerMove[0])}
|
|
1179
|
+
${xn(t.portalArea[0])}
|
|
1180
|
+
${hn(t.portal[0])}
|
|
1181
|
+
${fn(t.previewImage[0])}
|
|
1182
|
+
${yn(t.preview[0])}
|
|
1179
1183
|
${me(t.handlerResizeBottomLeft[0],"bl")}
|
|
1180
1184
|
${me(t.handlerResizeBottomRight[0],"br")}
|
|
1181
1185
|
${me(t.handlerResizeTopLeft[0],"tl")}
|
|
1182
1186
|
${me(t.handlerResizeTopRight[0],"tr")}
|
|
1183
|
-
${
|
|
1184
|
-
${
|
|
1185
|
-
`,r=document.createElement("style");return r.innerHTML=o,document.getElementsByTagName("head")[0].prepend(r),t};let vn=0;const wn=e=>{const t=new Map,o=new Proxy({...e},{set(r,i,a){return Reflect.set(r,i,a),(t.get(i)||[]).forEach(c=>c.action(a,r,i)),!0}});return{getState:()=>({...o}),setState:r=>{for(const i of Object.keys(r)){const a=r[i];a!==void 0&&(o[i]=a)}},subscribe:(r,i)=>{const a=String(++vn),c=t.get(r)||[];return t.set(r,[...c,{action:i,id:a}]),a},unsubscribe:r=>{for(const[i,a]of t.entries()){const c=a.filter(s=>s.id!==r);if(c.length!==a.length){t.set(i,c);return}}},unsubscribeAll:()=>{t.clear()}}},Fe={action:null,sourceBase64:"",fileName:"",sourceHeight:0,sourceWidth:0,frame:{left:0,top:0,width:0,height:0},portal:{left:0,top:0,size:0},emitted:{X:0,Y:0,left:0,top:0,size:0},config:{applyButtonLabel:"Apply",cancelButtonLabel:"Cancel",compression:1,framePadding:3,minPortalSize:50,portalPosition:"center",portalSize:150,outputSize:0,type:"jpeg",maxFileSize:0,allowedTypes:["image/jpeg","image/png","image/gif","image/webp"]}},Cn=(e={},t={})=>wn({...Fe,config:{...Fe.config,...e},css:On(t)}),Rn=(e,t)=>{var y;const o=e(),r=document.querySelector(`.${(y=o.css)==null?void 0:y.body[0]}`);if(!r)return o.frame;const{width:i,height:a}=r.getBoundingClientRect(),c=i/a,s=t.width/t.height;let p,x,g=0,h=0;return c>s?(p=a*s,x=a,h=(i-p)/2):(p=i,x=i*(t.height/t.width),g=(a-x)/2),{width:p,height:x,left:h,top:g}},Ln=(e,t,o)=>{const[r,i]=t,a=r+e>o.width?(o.width-e)/2:r,c=i+e>o.height?(o.height-e)/2:i;return[a,c]},kn=(e,t)=>{const{config:o}=e(),r=Math.min(t.width,t.height)-o.framePadding*2,i=o.portalSize>r?r:o.portalSize;if(Array.isArray(o.portalPosition)&&o.portalPosition.length===2){const[a,c]=Ln(i,o.portalPosition,t);return{left:a,top:c,size:i}}return o.portalPosition==="center"?{size:i,left:(t.width-i)/2,top:(t.height-i)/2}:{left:0,top:0,size:i}};var G=(e=>(e.MOVE="MOVE",e.RESIZE_TL="RESIZE_TL",e.RESIZE_TR="RESIZE_TR",e.RESIZE_BR="RESIZE_BR",e.RESIZE_BL="RESIZE_BL",e))(G||{});const jn=e=>{var r;const t=e(),o=document.createElement("span");return P(o,(r=t.css)==null?void 0:r.handlerMove),o.setAttribute("data-action",G.MOVE),o},En=e=>{var r;const t=e(),o=document.createElement("span");return P(o,(r=t.css)==null?void 0:r.handlerResizeBottomLeft),o.setAttribute("data-action",G.RESIZE_BL),o},zn=e=>{var r;const t=e(),o=document.createElement("span");return P(o,(r=t.css)==null?void 0:r.handlerResizeBottomRight),o.setAttribute("data-action",G.RESIZE_BR),o},Nn=e=>{var r;const t=e(),o=document.createElement("span");return P(o,(r=t.css)==null?void 0:r.handlerResizeTopLeft),o.setAttribute("data-action",G.RESIZE_TL),o},Tn=e=>{var r;const t=e(),o=document.createElement("span");return P(o,(r=t.css)==null?void 0:r.handlerResizeTopRight),o.setAttribute("data-action",G.RESIZE_TR),o},In=e=>{var r;const t=e(),o=document.createElement("img");return P(o,(r=t.css)==null?void 0:r.previewImage),o},An=e=>{var r;const t=e(),o=document.createElement("div");return P(o,(r=t.css)==null?void 0:r.preview),o.appendChild(In(e)),o},Pn=e=>{var r;const t=e(),o=document.createElement("div");return P(o,(r=t.css)==null?void 0:r.portal),o.appendChild(An(e)),o.appendChild(jn(e)),o.appendChild(Nn(e)),o.appendChild(Tn(e)),o.appendChild(En(e)),o.appendChild(zn(e)),o},Bn=e=>{var r;const t=e(),o=document.createElement("div");return P(o,(r=t.css)==null?void 0:r.portalArea),o.appendChild(Pn(e)),o},Mn=e=>{var r;const t=e(),o=document.createElement("img");return P(o,(r=t.css)==null?void 0:r.sourceImage),o.setAttribute("alt","source"),o.setAttribute("crossOrigin","anonymous"),o.setAttribute("draggable","false"),o.setAttribute("src",t.sourceBase64),o},Fn=e=>{var r;const t=e(),o=document.createElement("div");return P(o,(r=t.css)==null?void 0:r.body),o.appendChild(Mn(e)),o.appendChild(Bn(e)),o},_n=(e,t)=>{var i;const o=e(),r=document.createElement("div");return P(r,(i=o.css)==null?void 0:i.applyButton),r.setAttribute("role","button"),r.innerText=o.config.applyButtonLabel,r.addEventListener("click",t),r},Dn=(e,t)=>{var i;const o=e(),r=document.createElement("div");return P(r,(i=o.css)==null?void 0:i.cancelButton),r.setAttribute("role","button"),r.innerText=o.config.cancelButtonLabel,r.addEventListener("click",t),r},Gn=(e,t,o)=>{var a;const r=e(),i=document.createElement("div");return P(i,(a=r.css)==null?void 0:a.footer),i.appendChild(Dn(e,o)),i.appendChild(_n(e,t)),i},Yn=e=>{var r;const t=e(),o=document.createElement("div");return P(o,(r=t.css)==null?void 0:r.header),o},Hn=(e,t,o)=>{var a;const r=e(),i=document.createElement("div");return P(i,(a=r.css)==null?void 0:a.container),i.appendChild(Yn(e)),i.appendChild(Fn(e)),i.appendChild(Gn(e,t,o)),i},Xn=(e,t,o)=>{var a;const r=e(),i=document.createElement("div");P(i,(a=r.css)==null?void 0:a.root),i.appendChild(Hn(e,t,o)),document.body.appendChild(i)},Un=e=>{const t=document.createElement("input");return t.style.display="none",t.setAttribute("type","file"),t.setAttribute("accept","image/x-png,image/jpeg"),t.addEventListener("change",e,!1),document.body.appendChild(t),t},pe=new Map,Wn={header:"header",sourceImage:"sourceImage",portalArea:"portalArea",portal:"portal",previewImage:"previewImage"},Q=(e,t)=>{if(pe.has(e))return pe.get(e);if(!t)return null;const o=t[Wn[e]],r=document.querySelector(`.${o[0]}`);return pe.set(e,r),r},qn=()=>{pe.clear()},Kn=()=>{pe.clear()},Vn=(e,t)=>{const o=Q("header",t.css);o&&(o.innerText=e)},Zn=(e,t)=>{const o=Q("sourceImage",t.css);o&&(o.setAttribute("src",e),o.style.height=`${t.frame.height}px`,o.style.width=`${t.frame.width}px`,o.style.left=`${t.frame.left}px`,o.style.top=`${t.frame.top}px`);const r=Q("portalArea",t.css);r&&(r.style.height=`${t.frame.height}px`,r.style.width=`${t.frame.width}px`,r.style.left=`${t.frame.left}px`,r.style.top=`${t.frame.top}px`);const i=Q("portal",t.css);i&&(i.style.width=`${t.portal.size}px`,i.style.height=`${t.portal.size}px`,i.style.left=`${t.portal.left}px`,i.style.top=`${t.portal.top}px`);const a=Q("previewImage",t.css);a&&(a.setAttribute("src",e),a.style.height=`${t.frame.height}px`,a.style.width=`${t.frame.width}px`,a.style.marginLeft=`-${t.portal.left}px`,a.style.marginTop=`-${t.portal.top}px`)},Jn=(e,t)=>{const o=Q("portal",t.css);o&&(o.style.left=`${e.left}px`,o.style.top=`${e.top}px`,o.style.width=`${e.size}px`,o.style.height=`${e.size}px`);const r=Q("previewImage",t.css);r&&(r.style.marginLeft=`-${e.left}px`,r.style.marginTop=`-${e.top}px`)},je=1,Qn=e=>{var f,S;const t=e(),o=document.createElement("canvas"),r=t.frame.width||je,i=t.frame.height||je,a=t.sourceWidth/r,c=t.sourceHeight/i,s=t.portal.left*a,p=t.portal.top*c,x=Math.max(t.portal.size*Math.min(a,c),je),g=t.config.outputSize>0?t.config.outputSize:x;o.width=g,o.height=g;const h=document.querySelector(`.${(f=t.css)==null?void 0:f.sourceImage[0]}`);h&&((S=o.getContext("2d"))==null||S.drawImage(h,s,p,x,x,0,0,g,g));const y=o.toDataURL(`image/${t.config.type}`,t.config.compression);return new Promise((b,$)=>{try{o.toBlob(m=>{if(o.remove(),!m){$(new Error(`Failed to create blob for type: image/${t.config.type}`));return}b([y,m])},`image/${t.config.type}`,t.config.compression)}catch(m){o.remove(),$(m)}})},ei=(e,t,o)=>{const{emitted:r,portal:i,frame:a,config:c}=t();let s=r.left-r.X+e.clientX,p=r.top-r.Y+e.clientY;const x=c.framePadding,g=a.width-c.framePadding-i.size,h=c.framePadding,y=a.height-c.framePadding-i.size;s<x&&(s=x),s>g&&(s=g),p<h&&(p=h),p>y&&(p=y),o({portal:{...i,left:s,top:p}})},ti=(e,t,o)=>{const{action:r,emitted:i,portal:a,frame:c,config:s}=t(),p=e.pageX-i.X,x=e.pageY-i.Y;switch(r){case G.RESIZE_BR:{let g=i.size+Math.max(p,x);return g<s.minPortalSize&&(g=s.minPortalSize),i.top+g>c.height-s.framePadding&&(g=c.height-i.top-s.framePadding),i.left+g>c.width-s.framePadding&&(g=c.width-i.left-s.framePadding),o({portal:{...a,size:g}})}case G.RESIZE_TR:{let g=p+x>0?i.size+p:i.size-x,h=p+x>0?i.top-p:i.top+x;return g<s.minPortalSize&&(h=i.top+i.size-s.minPortalSize,g=s.minPortalSize),i.left+g>c.width-s.framePadding&&(g=c.width-i.left-s.framePadding,h=i.top-c.width+i.left+i.size),h<s.framePadding&&(g=i.top+i.size,h=s.framePadding),o({portal:{...a,top:h,size:g}})}case G.RESIZE_TL:{const g=Math.min(p,x);let h=i.size-g,y=i.left+g,f=i.top+g;if(h<s.minPortalSize){const S=i.size-s.minPortalSize;h=s.minPortalSize,y=i.left+S,f=i.top+S}if(f<s.framePadding){const S=s.framePadding-f;f=s.framePadding,y=y+S,h=h-S}if(y<s.framePadding){const S=s.framePadding-y;y=s.framePadding,f=f+S,h=h-S}return o({portal:{...a,top:f,left:y,size:h}})}case G.RESIZE_BL:{let g=p+x>0?i.size+x:i.size-p,h=p+x>0?i.left-x:i.left+p;return g<s.minPortalSize&&(h=i.left+i.size-s.minPortalSize,g=s.minPortalSize),g+i.top>c.height-s.framePadding&&(h=i.left-c.height+i.top+i.size,g=c.height-i.top-s.framePadding),h<s.framePadding&&(h=s.framePadding,g=i.left+i.size-s.framePadding),o({portal:{...a,left:h,size:g}})}default:return}},Qe=e=>{if("touches"in e&&e.touches.length>0){const o=e.touches[0];return{clientX:o.clientX,clientY:o.clientY,pageX:o.pageX,pageY:o.pageY}}if("changedTouches"in e&&e.changedTouches.length>0){const o=e.changedTouches[0];return{clientX:o.clientX,clientY:o.clientY,pageX:o.pageX,pageY:o.pageY}}const t=e;return{clientX:t.clientX,clientY:t.clientY,pageX:t.pageX,pageY:t.pageY}},oi=(e,t)=>{var y,f,S;const o=e(),r=document.querySelector(`.${(y=o.css)==null?void 0:y.portal[0]}`),i=document.querySelector(`.${(f=o.css)==null?void 0:f.portalArea[0]}`),a=document.querySelector(`.${(S=o.css)==null?void 0:S.root[0]}`);let c=null,s=null;const p=b=>{b.preventDefault();const{portal:$}=e(),m=Qe(b);if(b.target){const O=b.target.getAttribute("data-action"),v={X:m.pageX,Y:m.pageY,left:$.left,top:$.top,size:$.size};t({action:O,emitted:v})}},x=()=>{const{action:b}=e();c!==null&&(cancelAnimationFrame(c),c=null),s=null,b&&t({action:null})},g=()=>{if(c=null,!s)return;const b=s;s=null;const{action:$}=e();if($)switch($){case G.MOVE:ei(b,e,t);break;default:ti(b,e,t)}},h=b=>{const{action:$}=e();$&&(b.preventDefault(),s=Qe(b),c===null&&(c=requestAnimationFrame(g)))};return a&&(a.addEventListener("mouseup",x),a.addEventListener("touchend",x),a.addEventListener("touchcancel",x)),r&&(r.addEventListener("mousedown",p),r.addEventListener("touchstart",p,{passive:!1})),i&&(i.addEventListener("mousemove",h),i.addEventListener("touchmove",h,{passive:!1})),()=>{c!==null&&cancelAnimationFrame(c),a&&(a.removeEventListener("mouseup",x),a.removeEventListener("touchend",x),a.removeEventListener("touchcancel",x)),r&&(r.removeEventListener("mousedown",p),r.removeEventListener("touchstart",p)),i&&(i.removeEventListener("mousemove",h),i.removeEventListener("touchmove",h))}},et=1024*1024,ri=(e,t)=>{if(!t.allowedTypes.includes(e.type))return`Invalid file type "${e.type}". Allowed types: ${t.allowedTypes.join(", ")}`;if(t.maxFileSize>0&&e.size>t.maxFileSize){const o=(t.maxFileSize/et).toFixed(2);return`File size (${(e.size/et).toFixed(2)}MB) exceeds maximum allowed size (${o}MB)`}return null},ni=(e,t,o,r,i,a,c)=>{const s=m=>{c?c(m):console.error(`HqCropper: ${m}`)};if(!e.target.files||e.target.files.length===0){s("Can't read file input");return}const p=e.target.files[0],{config:x}=t(),g=ri(p,x);if(g){s(g),e.target.value="";return}const h=new FileReader;let y=null;const f=()=>{var v;const m=t(),O=document.querySelector(`.${(v=m.css)==null?void 0:v.root[0]}`);O&&(O.remove(),document.removeEventListener("keydown",S),y==null||y(),Kn(),a(),o(Fe))},S=m=>{m.key==="Escape"&&t().sourceBase64&&b(m)},b=m=>{m.preventDefault(),f()},$=m=>{m.preventDefault();const O=t();Qn(t).then(([v,k])=>{r(v,k,O),b(m)}).catch(v=>{s(v instanceof Error?v.message:"Failed to crop image")})};h.onload=m=>{const O=new Image;if(!m.target||typeof m.target.result!="string"){s("Can't load result image");return}O.src=m.target.result,O.onerror=()=>{s("Failed to load image")},O.onload=()=>{var z;Xn(t,$,b),qn(),i("fileName",Vn),i("sourceBase64",Zn),i("portal",Jn);const v=Rn(t,O),k=kn(t,v);o({frame:v,portal:k,fileName:p.name,sourceBase64:(z=m.target)==null?void 0:z.result,sourceHeight:O.height,sourceWidth:O.width}),y=oi(t,o),document.addEventListener("keydown",S)}},h.onerror=()=>{s("Failed to read file")},h.readAsDataURL(p),e.target.value=""},ii=(e,t,o,r)=>{const{getState:i,setState:a,subscribe:c,unsubscribeAll:s}=Cn(t,o),p=Un(x=>ni(x,i,a,e,c,s,r));return{open:()=>p.click()}},q={portalSize:200,outputSize:400,compression:.9,type:"jpeg",maxFileSize:10*1024*1024,allowedTypes:["image/jpeg","image/png","image/webp"],applyLabel:"Apply",cancelLabel:"Cancel"},tt="vacano-image-cropper-styles",li=`
|
|
1187
|
+
${Sn(t.root[0])}
|
|
1188
|
+
${mn(t.sourceImage[0])}
|
|
1189
|
+
`,r=document.createElement("style");return r.innerHTML=o,document.getElementsByTagName("head")[0].prepend(r),t};let wn=0;const Cn=e=>{const t=new Map,o=new Proxy({...e},{set(r,i,a){return Reflect.set(r,i,a),(t.get(i)||[]).forEach(c=>c.action(a,r,i)),!0}});return{getState:()=>({...o}),setState:r=>{for(const i of Object.keys(r)){const a=r[i];a!==void 0&&(o[i]=a)}},subscribe:(r,i)=>{const a=String(++wn),c=t.get(r)||[];return t.set(r,[...c,{action:i,id:a}]),a},unsubscribe:r=>{for(const[i,a]of t.entries()){const c=a.filter(s=>s.id!==r);if(c.length!==a.length){t.set(i,c);return}}},unsubscribeAll:()=>{t.clear()}}},Fe={action:null,sourceBase64:"",fileName:"",sourceHeight:0,sourceWidth:0,frame:{left:0,top:0,width:0,height:0},portal:{left:0,top:0,size:0},emitted:{X:0,Y:0,left:0,top:0,size:0},config:{applyButtonLabel:"Apply",cancelButtonLabel:"Cancel",compression:1,framePadding:3,minPortalSize:50,portalPosition:"center",portalSize:150,outputSize:0,type:"jpeg",maxFileSize:0,allowedTypes:["image/jpeg","image/png","image/gif","image/webp"]}},Rn=(e={},t={})=>Cn({...Fe,config:{...Fe.config,...e},css:vn(t)}),Ln=(e,t)=>{var y;const o=e(),r=document.querySelector(`.${(y=o.css)==null?void 0:y.body[0]}`);if(!r)return o.frame;const{width:i,height:a}=r.getBoundingClientRect(),c=i/a,s=t.width/t.height;let p,x,g=0,h=0;return c>s?(p=a*s,x=a,h=(i-p)/2):(p=i,x=i*(t.height/t.width),g=(a-x)/2),{width:p,height:x,left:h,top:g}},kn=(e,t,o)=>{const[r,i]=t,a=r+e>o.width?(o.width-e)/2:r,c=i+e>o.height?(o.height-e)/2:i;return[a,c]},jn=(e,t)=>{const{config:o}=e(),r=Math.min(t.width,t.height)-o.framePadding*2,i=o.portalSize>r?r:o.portalSize;if(Array.isArray(o.portalPosition)&&o.portalPosition.length===2){const[a,c]=kn(i,o.portalPosition,t);return{left:a,top:c,size:i}}return o.portalPosition==="center"?{size:i,left:(t.width-i)/2,top:(t.height-i)/2}:{left:0,top:0,size:i}};var G=(e=>(e.MOVE="MOVE",e.RESIZE_TL="RESIZE_TL",e.RESIZE_TR="RESIZE_TR",e.RESIZE_BR="RESIZE_BR",e.RESIZE_BL="RESIZE_BL",e))(G||{});const En=e=>{var r;const t=e(),o=document.createElement("span");return P(o,(r=t.css)==null?void 0:r.handlerMove),o.setAttribute("data-action",G.MOVE),o},zn=e=>{var r;const t=e(),o=document.createElement("span");return P(o,(r=t.css)==null?void 0:r.handlerResizeBottomLeft),o.setAttribute("data-action",G.RESIZE_BL),o},Nn=e=>{var r;const t=e(),o=document.createElement("span");return P(o,(r=t.css)==null?void 0:r.handlerResizeBottomRight),o.setAttribute("data-action",G.RESIZE_BR),o},Tn=e=>{var r;const t=e(),o=document.createElement("span");return P(o,(r=t.css)==null?void 0:r.handlerResizeTopLeft),o.setAttribute("data-action",G.RESIZE_TL),o},In=e=>{var r;const t=e(),o=document.createElement("span");return P(o,(r=t.css)==null?void 0:r.handlerResizeTopRight),o.setAttribute("data-action",G.RESIZE_TR),o},An=e=>{var r;const t=e(),o=document.createElement("img");return P(o,(r=t.css)==null?void 0:r.previewImage),o},Pn=e=>{var r;const t=e(),o=document.createElement("div");return P(o,(r=t.css)==null?void 0:r.preview),o.appendChild(An(e)),o},Bn=e=>{var r;const t=e(),o=document.createElement("div");return P(o,(r=t.css)==null?void 0:r.portal),o.appendChild(Pn(e)),o.appendChild(En(e)),o.appendChild(Tn(e)),o.appendChild(In(e)),o.appendChild(zn(e)),o.appendChild(Nn(e)),o},Mn=e=>{var r;const t=e(),o=document.createElement("div");return P(o,(r=t.css)==null?void 0:r.portalArea),o.appendChild(Bn(e)),o},Fn=e=>{var r;const t=e(),o=document.createElement("img");return P(o,(r=t.css)==null?void 0:r.sourceImage),o.setAttribute("alt","source"),o.setAttribute("crossOrigin","anonymous"),o.setAttribute("draggable","false"),o.setAttribute("src",t.sourceBase64),o},_n=e=>{var r;const t=e(),o=document.createElement("div");return P(o,(r=t.css)==null?void 0:r.body),o.appendChild(Fn(e)),o.appendChild(Mn(e)),o},Dn=(e,t)=>{var i;const o=e(),r=document.createElement("div");return P(r,(i=o.css)==null?void 0:i.applyButton),r.setAttribute("role","button"),r.innerText=o.config.applyButtonLabel,r.addEventListener("click",t),r},Gn=(e,t)=>{var i;const o=e(),r=document.createElement("div");return P(r,(i=o.css)==null?void 0:i.cancelButton),r.setAttribute("role","button"),r.innerText=o.config.cancelButtonLabel,r.addEventListener("click",t),r},Yn=(e,t,o)=>{var a;const r=e(),i=document.createElement("div");return P(i,(a=r.css)==null?void 0:a.footer),i.appendChild(Gn(e,o)),i.appendChild(Dn(e,t)),i},Hn=e=>{var r;const t=e(),o=document.createElement("div");return P(o,(r=t.css)==null?void 0:r.header),o},Xn=(e,t,o)=>{var a;const r=e(),i=document.createElement("div");return P(i,(a=r.css)==null?void 0:a.container),i.appendChild(Hn(e)),i.appendChild(_n(e)),i.appendChild(Yn(e,t,o)),i},Un=(e,t,o)=>{var a;const r=e(),i=document.createElement("div");P(i,(a=r.css)==null?void 0:a.root),i.appendChild(Xn(e,t,o)),document.body.appendChild(i)},Wn=e=>{const t=document.createElement("input");return t.style.display="none",t.setAttribute("type","file"),t.setAttribute("accept","image/x-png,image/jpeg"),t.addEventListener("change",e,!1),document.body.appendChild(t),t},pe=new Map,qn={header:"header",sourceImage:"sourceImage",portalArea:"portalArea",portal:"portal",previewImage:"previewImage"},Q=(e,t)=>{if(pe.has(e))return pe.get(e);if(!t)return null;const o=t[qn[e]],r=document.querySelector(`.${o[0]}`);return pe.set(e,r),r},Kn=()=>{pe.clear()},Vn=()=>{pe.clear()},Zn=(e,t)=>{const o=Q("header",t.css);o&&(o.innerText=e)},Jn=(e,t)=>{const o=Q("sourceImage",t.css);o&&(o.setAttribute("src",e),o.style.height=`${t.frame.height}px`,o.style.width=`${t.frame.width}px`,o.style.left=`${t.frame.left}px`,o.style.top=`${t.frame.top}px`);const r=Q("portalArea",t.css);r&&(r.style.height=`${t.frame.height}px`,r.style.width=`${t.frame.width}px`,r.style.left=`${t.frame.left}px`,r.style.top=`${t.frame.top}px`);const i=Q("portal",t.css);i&&(i.style.width=`${t.portal.size}px`,i.style.height=`${t.portal.size}px`,i.style.left=`${t.portal.left}px`,i.style.top=`${t.portal.top}px`);const a=Q("previewImage",t.css);a&&(a.setAttribute("src",e),a.style.height=`${t.frame.height}px`,a.style.width=`${t.frame.width}px`,a.style.marginLeft=`-${t.portal.left}px`,a.style.marginTop=`-${t.portal.top}px`)},Qn=(e,t)=>{const o=Q("portal",t.css);o&&(o.style.left=`${e.left}px`,o.style.top=`${e.top}px`,o.style.width=`${e.size}px`,o.style.height=`${e.size}px`);const r=Q("previewImage",t.css);r&&(r.style.marginLeft=`-${e.left}px`,r.style.marginTop=`-${e.top}px`)},je=1,ei=e=>{var f,S;const t=e(),o=document.createElement("canvas"),r=t.frame.width||je,i=t.frame.height||je,a=t.sourceWidth/r,c=t.sourceHeight/i,s=t.portal.left*a,p=t.portal.top*c,x=Math.max(t.portal.size*Math.min(a,c),je),g=t.config.outputSize>0?t.config.outputSize:x;o.width=g,o.height=g;const h=document.querySelector(`.${(f=t.css)==null?void 0:f.sourceImage[0]}`);h&&((S=o.getContext("2d"))==null||S.drawImage(h,s,p,x,x,0,0,g,g));const y=o.toDataURL(`image/${t.config.type}`,t.config.compression);return new Promise((b,$)=>{try{o.toBlob(m=>{if(o.remove(),!m){$(new Error(`Failed to create blob for type: image/${t.config.type}`));return}b([y,m])},`image/${t.config.type}`,t.config.compression)}catch(m){o.remove(),$(m)}})},ti=(e,t,o)=>{const{emitted:r,portal:i,frame:a,config:c}=t();let s=r.left-r.X+e.clientX,p=r.top-r.Y+e.clientY;const x=c.framePadding,g=a.width-c.framePadding-i.size,h=c.framePadding,y=a.height-c.framePadding-i.size;s<x&&(s=x),s>g&&(s=g),p<h&&(p=h),p>y&&(p=y),o({portal:{...i,left:s,top:p}})},oi=(e,t,o)=>{const{action:r,emitted:i,portal:a,frame:c,config:s}=t(),p=e.pageX-i.X,x=e.pageY-i.Y;switch(r){case G.RESIZE_BR:{let g=i.size+Math.max(p,x);return g<s.minPortalSize&&(g=s.minPortalSize),i.top+g>c.height-s.framePadding&&(g=c.height-i.top-s.framePadding),i.left+g>c.width-s.framePadding&&(g=c.width-i.left-s.framePadding),o({portal:{...a,size:g}})}case G.RESIZE_TR:{let g=p+x>0?i.size+p:i.size-x,h=p+x>0?i.top-p:i.top+x;return g<s.minPortalSize&&(h=i.top+i.size-s.minPortalSize,g=s.minPortalSize),i.left+g>c.width-s.framePadding&&(g=c.width-i.left-s.framePadding,h=i.top-c.width+i.left+i.size),h<s.framePadding&&(g=i.top+i.size,h=s.framePadding),o({portal:{...a,top:h,size:g}})}case G.RESIZE_TL:{const g=Math.min(p,x);let h=i.size-g,y=i.left+g,f=i.top+g;if(h<s.minPortalSize){const S=i.size-s.minPortalSize;h=s.minPortalSize,y=i.left+S,f=i.top+S}if(f<s.framePadding){const S=s.framePadding-f;f=s.framePadding,y=y+S,h=h-S}if(y<s.framePadding){const S=s.framePadding-y;y=s.framePadding,f=f+S,h=h-S}return o({portal:{...a,top:f,left:y,size:h}})}case G.RESIZE_BL:{let g=p+x>0?i.size+x:i.size-p,h=p+x>0?i.left-x:i.left+p;return g<s.minPortalSize&&(h=i.left+i.size-s.minPortalSize,g=s.minPortalSize),g+i.top>c.height-s.framePadding&&(h=i.left-c.height+i.top+i.size,g=c.height-i.top-s.framePadding),h<s.framePadding&&(h=s.framePadding,g=i.left+i.size-s.framePadding),o({portal:{...a,left:h,size:g}})}default:return}},Qe=e=>{if("touches"in e&&e.touches.length>0){const o=e.touches[0];return{clientX:o.clientX,clientY:o.clientY,pageX:o.pageX,pageY:o.pageY}}if("changedTouches"in e&&e.changedTouches.length>0){const o=e.changedTouches[0];return{clientX:o.clientX,clientY:o.clientY,pageX:o.pageX,pageY:o.pageY}}const t=e;return{clientX:t.clientX,clientY:t.clientY,pageX:t.pageX,pageY:t.pageY}},ri=(e,t)=>{var y,f,S;const o=e(),r=document.querySelector(`.${(y=o.css)==null?void 0:y.portal[0]}`),i=document.querySelector(`.${(f=o.css)==null?void 0:f.portalArea[0]}`),a=document.querySelector(`.${(S=o.css)==null?void 0:S.root[0]}`);let c=null,s=null;const p=b=>{b.preventDefault();const{portal:$}=e(),m=Qe(b);if(b.target){const O=b.target.getAttribute("data-action"),v={X:m.pageX,Y:m.pageY,left:$.left,top:$.top,size:$.size};t({action:O,emitted:v})}},x=()=>{const{action:b}=e();c!==null&&(cancelAnimationFrame(c),c=null),s=null,b&&t({action:null})},g=()=>{if(c=null,!s)return;const b=s;s=null;const{action:$}=e();if($)switch($){case G.MOVE:ti(b,e,t);break;default:oi(b,e,t)}},h=b=>{const{action:$}=e();$&&(b.preventDefault(),s=Qe(b),c===null&&(c=requestAnimationFrame(g)))};return a&&(a.addEventListener("mouseup",x),a.addEventListener("touchend",x),a.addEventListener("touchcancel",x)),r&&(r.addEventListener("mousedown",p),r.addEventListener("touchstart",p,{passive:!1})),i&&(i.addEventListener("mousemove",h),i.addEventListener("touchmove",h,{passive:!1})),()=>{c!==null&&cancelAnimationFrame(c),a&&(a.removeEventListener("mouseup",x),a.removeEventListener("touchend",x),a.removeEventListener("touchcancel",x)),r&&(r.removeEventListener("mousedown",p),r.removeEventListener("touchstart",p)),i&&(i.removeEventListener("mousemove",h),i.removeEventListener("touchmove",h))}},et=1024*1024,ni=(e,t)=>{if(!t.allowedTypes.includes(e.type))return`Invalid file type "${e.type}". Allowed types: ${t.allowedTypes.join(", ")}`;if(t.maxFileSize>0&&e.size>t.maxFileSize){const o=(t.maxFileSize/et).toFixed(2);return`File size (${(e.size/et).toFixed(2)}MB) exceeds maximum allowed size (${o}MB)`}return null},ii=(e,t,o,r,i,a,c)=>{const s=m=>{c?c(m):console.error(`HqCropper: ${m}`)};if(!e.target.files||e.target.files.length===0){s("Can't read file input");return}const p=e.target.files[0],{config:x}=t(),g=ni(p,x);if(g){s(g),e.target.value="";return}const h=new FileReader;let y=null;const f=()=>{var v;const m=t(),O=document.querySelector(`.${(v=m.css)==null?void 0:v.root[0]}`);O&&(O.remove(),document.removeEventListener("keydown",S),y==null||y(),Vn(),a(),o(Fe))},S=m=>{m.key==="Escape"&&t().sourceBase64&&b(m)},b=m=>{m.preventDefault(),f()},$=m=>{m.preventDefault();const O=t();ei(t).then(([v,k])=>{r(v,k,O),b(m)}).catch(v=>{s(v instanceof Error?v.message:"Failed to crop image")})};h.onload=m=>{const O=new Image;if(!m.target||typeof m.target.result!="string"){s("Can't load result image");return}O.src=m.target.result,O.onerror=()=>{s("Failed to load image")},O.onload=()=>{var z;Un(t,$,b),Kn(),i("fileName",Zn),i("sourceBase64",Jn),i("portal",Qn);const v=Ln(t,O),k=jn(t,v);o({frame:v,portal:k,fileName:p.name,sourceBase64:(z=m.target)==null?void 0:z.result,sourceHeight:O.height,sourceWidth:O.width}),y=ri(t,o),document.addEventListener("keydown",S)}},h.onerror=()=>{s("Failed to read file")},h.readAsDataURL(p),e.target.value=""},li=(e,t,o,r)=>{const{getState:i,setState:a,subscribe:c,unsubscribeAll:s}=Rn(t,o),p=Wn(x=>ii(x,i,a,e,c,s,r));return{open:()=>p.click()}},q={portalSize:200,outputSize:400,compression:.9,type:"jpeg",maxFileSize:10*1024*1024,allowedTypes:["image/jpeg","image/png","image/webp"],applyLabel:"Apply",cancelLabel:"Cancel"},tt="vacano-image-cropper-styles",ai=`
|
|
1186
1190
|
.vacano-cropper-root {
|
|
1187
1191
|
background-color: rgba(0, 0, 0, 0.5);
|
|
1188
1192
|
backdrop-filter: blur(4px);
|
|
@@ -1230,7 +1234,7 @@
|
|
|
1230
1234
|
.vacano-cropper-apply-button:hover {
|
|
1231
1235
|
background-color: ${n.COLORS["iron-grey"]};
|
|
1232
1236
|
}
|
|
1233
|
-
`,
|
|
1237
|
+
`,di=()=>{if(typeof document>"u"||document.getElementById(tt))return;const e=document.createElement("style");e.id=tt,e.textContent=ai,document.head.appendChild(e)},si={root:["vacano-cropper-root"],container:["vacano-cropper-container"],header:["vacano-cropper-header"],body:["vacano-cropper-body"],footer:["vacano-cropper-footer"],cancelButton:["vacano-cropper-cancel-button"],applyButton:["vacano-cropper-apply-button"],portal:["vacano-cropper-portal"]},mt=(e={})=>{const{allowedTypes:t=q.allowedTypes,applyLabel:o=q.applyLabel,cancelLabel:r=q.cancelLabel,compression:i=q.compression,maxFileSize:a=q.maxFileSize,onCrop:c,onError:s,outputSize:p=q.outputSize,portalSize:x=q.portalSize,type:g=q.type}=e,h=u.useRef(null);return{open:u.useCallback(()=>{h.current||(di(),h.current=li((f,S,b)=>{S&&(c==null||c({base64:f,blob:S,state:b}))},{portalSize:x,outputSize:p,compression:i,type:g,maxFileSize:a,allowedTypes:t,applyButtonLabel:o,cancelButtonLabel:r},si,f=>{s==null||s({code:"CROPPER_ERROR",message:f})})),h.current.open()},[t,o,r,i,a,c,s,p,x,g])}},Ee=C.newClassNameGetter("image-cropper"),ci=({allowedTypes:e,applyLabel:t,buttonLabel:o="Select Image",cancelLabel:r,className:i,classnames:a,compression:c,maxFileSize:s,onCrop:p,onError:x,outputSize:g,portalSize:h,previewSize:y=120,ref:f,type:S,value:b,...$})=>{const[m,O]=u.useState(b??null),{open:v}=mt({allowedTypes:e,applyLabel:t,cancelLabel:r,compression:c,maxFileSize:s,onCrop:k=>{O(k.base64),p==null||p(k)},onError:x,outputSize:g,portalSize:h,type:S});return l.jsxs(rn,{...$,ref:f,className:Ee("container",i),children:[l.jsx(nn,{$size:y,className:Ee("preview",a==null?void 0:a.preview),children:m?l.jsx("img",{src:m,alt:"Preview"}):l.jsx(ln,{children:"No image"})}),l.jsx(d.Button,{variant:"system",onClick:v,className:Ee("button",a==null?void 0:a.button),style:{width:y},children:o})]})},re={default:{box:40,line:22,weight:2.5,gap:6},compact:{box:32,line:18,weight:2,gap:5}},pi=d.styled.button`
|
|
1234
1238
|
position: relative;
|
|
1235
1239
|
display: flex;
|
|
1236
1240
|
align-items: center;
|
|
@@ -1253,7 +1257,7 @@
|
|
|
1253
1257
|
&:focus-visible {
|
|
1254
1258
|
box-shadow: 0 0 0 2px ${n.COLORS["steel-blue"]};
|
|
1255
1259
|
}
|
|
1256
|
-
`,
|
|
1260
|
+
`,ui=d.styled.div`
|
|
1257
1261
|
display: flex;
|
|
1258
1262
|
flex-direction: column;
|
|
1259
1263
|
align-items: center;
|
|
@@ -1270,14 +1274,14 @@
|
|
|
1270
1274
|
transform-origin: center;
|
|
1271
1275
|
|
|
1272
1276
|
${({$position:e,$size:t,$open:o})=>{const{gap:r,weight:i}=re[t],a=r+i;if(e==="top")return o?`transform: translateY(${a}px) rotate(45deg);`:"";if(e==="middle")return o?"opacity: 0;":"";if(e==="bottom")return o?`transform: translateY(-${a}px) rotate(-45deg);`:""}}
|
|
1273
|
-
`,Oe=C.newClassNameGetter("menu-button"),
|
|
1277
|
+
`,Oe=C.newClassNameGetter("menu-button"),gi=({className:e,classnames:t,defaultOpen:o=!1,disabled:r=!1,onOpenChange:i,open:a,ref:c,size:s="default",...p})=>{const[x,g]=u.useState(o),h=a!==void 0,y=h?a:x,f=u.useCallback(()=>{if(r)return;const S=!y;h||g(S),i==null||i(S)},[r,y,h,i]);return l.jsx(pi,{...p,ref:c,type:"button",disabled:r,"aria-label":y?"Close menu":"Open menu","aria-expanded":y,className:Oe("container",e),$size:s,$disabled:r,onClick:f,children:l.jsxs(ui,{$size:s,$open:y,children:[l.jsx(ze,{$size:s,$position:"top",$open:y,className:Oe("line",t==null?void 0:t.line)}),l.jsx(ze,{$size:s,$position:"middle",$open:y,className:Oe("line",t==null?void 0:t.line)}),l.jsx(ze,{$size:s,$position:"bottom",$open:y,className:Oe("line",t==null?void 0:t.line)})]})})},xi=5e3,ot={default:{background:"#374151",text:n.COLORS.white},success:{background:n.COLORS.green,text:n.COLORS.white},warning:{background:n.COLORS.yellow,text:n.COLORS.white},danger:{background:n.COLORS.red,text:n.COLORS.white},info:{background:n.COLORS["steel-blue"],text:n.COLORS.white}},Ot=u.createContext(null),rt=e=>ot[e]??ot.default,hi=d.styled.div`
|
|
1274
1278
|
position: fixed;
|
|
1275
1279
|
top: 0;
|
|
1276
1280
|
left: 0;
|
|
1277
1281
|
right: 0;
|
|
1278
1282
|
z-index: 9999;
|
|
1279
1283
|
pointer-events: none;
|
|
1280
|
-
`,
|
|
1284
|
+
`,fi=d.styled.div`
|
|
1281
1285
|
display: flex;
|
|
1282
1286
|
align-items: center;
|
|
1283
1287
|
justify-content: center;
|
|
@@ -1289,12 +1293,12 @@
|
|
|
1289
1293
|
animation: ${({$isExiting:e})=>e?n.KEYFRAMES.slideOutTopFade:n.KEYFRAMES.slideInTopFade}
|
|
1290
1294
|
0.3s ease-out forwards;
|
|
1291
1295
|
pointer-events: auto;
|
|
1292
|
-
`,
|
|
1296
|
+
`,yi=d.styled.span`
|
|
1293
1297
|
font-size: 14px;
|
|
1294
1298
|
font-weight: 500;
|
|
1295
1299
|
line-height: 1.4;
|
|
1296
1300
|
text-align: center;
|
|
1297
|
-
`,
|
|
1301
|
+
`,bi=d.styled.button`
|
|
1298
1302
|
position: absolute;
|
|
1299
1303
|
right: 16px;
|
|
1300
1304
|
top: 50%;
|
|
@@ -1315,9 +1319,9 @@
|
|
|
1315
1319
|
&:hover {
|
|
1316
1320
|
opacity: 1;
|
|
1317
1321
|
}
|
|
1318
|
-
|
|
1322
|
+
`,$i=d.styled.div`
|
|
1319
1323
|
position: relative;
|
|
1320
|
-
|
|
1324
|
+
`,Si=({notification:e,onRemove:t,onAnimationEnd:o})=>{const[r,i]=u.useState(!1),a=()=>{i(!0)},c=()=>{r&&(t(),o())};return u.useEffect(()=>{const s=setTimeout(()=>{a()},e.duration);return()=>clearTimeout(s)},[e.duration,e.id]),l.jsx($i,{children:l.jsxs(fi,{$variant:e.variant,$isExiting:r,onAnimationEnd:c,children:[l.jsx(yi,{children:e.message}),l.jsx(bi,{onClick:a,children:l.jsx(l.X,{style:{width:18,height:18}})})]})})},mi=(e,t)=>{switch(t.type){case"ADD_NOTIFICATION":{const o=t.payload;return e.current?{...e,queue:[...e.queue,o]}:{...e,current:o}}case"REMOVE_CURRENT":return{...e,current:null};case"SHOW_NEXT":{const o=e.queue[0];return o?{current:o,queue:e.queue.slice(1)}:e}default:return e}},Oi={current:null,queue:[]},vi=({children:e})=>{const[t,o]=u.useReducer(mi,Oi),r=u.useCallback((s,p="default",x=xi)=>{const g=`notification-${Date.now()}-${Math.random().toString(36).substr(2,9)}`;o({type:"ADD_NOTIFICATION",payload:{id:g,message:s,variant:p,duration:x}})},[]),i=u.useCallback(()=>{o({type:"REMOVE_CURRENT"})},[]),a=u.useCallback(()=>{o({type:"REMOVE_CURRENT"})},[]),c=u.useCallback(()=>{setTimeout(()=>{o({type:"SHOW_NEXT"})},100)},[]);return l.jsxs(Ot.Provider,{value:{show:r,hide:i},children:[e,l.jsx(hi,{children:t.current&&l.jsx(Si,{notification:t.current,onRemove:a,onAnimationEnd:c},t.current.id)})]})},wi=()=>{const e=u.useContext(Ot);if(!e)throw new Error("useNotification must be used within NotificationProvider");return e},vt=u.createContext(null),Ci="Agree",Ri="Discard",Li=B.keyframes`
|
|
1321
1325
|
from {
|
|
1322
1326
|
opacity: 0;
|
|
1323
1327
|
transform: translateY(100%);
|
|
@@ -1326,7 +1330,7 @@
|
|
|
1326
1330
|
opacity: 1;
|
|
1327
1331
|
transform: translateY(0);
|
|
1328
1332
|
}
|
|
1329
|
-
`,
|
|
1333
|
+
`,ki=B.keyframes`
|
|
1330
1334
|
from {
|
|
1331
1335
|
opacity: 1;
|
|
1332
1336
|
transform: translateY(0);
|
|
@@ -1335,7 +1339,7 @@
|
|
|
1335
1339
|
opacity: 0;
|
|
1336
1340
|
transform: translateY(100%);
|
|
1337
1341
|
}
|
|
1338
|
-
`,
|
|
1342
|
+
`,ji=d.styled.div`
|
|
1339
1343
|
position: fixed;
|
|
1340
1344
|
bottom: 24px;
|
|
1341
1345
|
right: 24px;
|
|
@@ -1350,20 +1354,20 @@
|
|
|
1350
1354
|
box-shadow:
|
|
1351
1355
|
0 4px 6px -1px rgba(0, 0, 0, 0.1),
|
|
1352
1356
|
0 2px 4px -2px rgba(0, 0, 0, 0.1);
|
|
1353
|
-
animation: ${({$isExiting:e})=>e?Li
|
|
1357
|
+
animation: ${({$isExiting:e})=>e?ki:Li} 0.2s ease-out forwards;
|
|
1354
1358
|
z-index: 1000;
|
|
1355
|
-
`,
|
|
1359
|
+
`,Ei=d.styled.p`
|
|
1356
1360
|
margin: 0;
|
|
1357
1361
|
font-weight: 600;
|
|
1358
1362
|
font-size: 14px;
|
|
1359
1363
|
color: ${n.COLORS.black};
|
|
1360
1364
|
text-align: left;
|
|
1361
|
-
`,
|
|
1365
|
+
`,zi=d.styled.p`
|
|
1362
1366
|
margin: 4px 0 0;
|
|
1363
1367
|
font-size: 13px;
|
|
1364
1368
|
color: ${n.COLORS["iron-grey"]};
|
|
1365
1369
|
text-align: left;
|
|
1366
|
-
`,
|
|
1370
|
+
`,Ni=d.styled.div`
|
|
1367
1371
|
display: flex;
|
|
1368
1372
|
align-items: center;
|
|
1369
1373
|
justify-content: flex-start;
|
|
@@ -1372,20 +1376,20 @@
|
|
|
1372
1376
|
padding: 12px 16px;
|
|
1373
1377
|
border-top: 1px solid ${n.COLORS.gray};
|
|
1374
1378
|
background-color: rgba(0, 0, 0, 0.01);
|
|
1375
|
-
`,
|
|
1379
|
+
`,Ti=({confirmation:e,onDone:t})=>{const[o,r]=u.useState(!1),[i,a]=u.useState(!1),{label:c,description:s,onConfirm:p,onDiscard:x,options:g}=e,h=g.confirmLabel||Ci,y=g.discardLabel||Ri,f=u.useCallback($=>{r(!0),setTimeout(()=>{$==null||$(),t()},200)},[t]),S=u.useCallback(async()=>{const $=p();if($ instanceof Promise){a(!0);try{await $}finally{a(!1)}}f()},[f,p]),b=u.useCallback(()=>{i||f(x)},[f,i,x]);return u.useEffect(()=>{const $=m=>{m.key==="Escape"&&!i&&b()};return document.addEventListener("keydown",$),()=>document.removeEventListener("keydown",$)},[b,i]),l.jsxs(ji,{$isExiting:o,children:[l.jsx(Ei,{children:c}),l.jsx(zi,{children:s}),l.jsxs(Ni,{children:[l.jsx(d.Button,{variant:"transparent",size:"compact",onClick:b,disabled:i,children:y}),l.jsx(d.Button,{variant:"system",size:"compact",onClick:S,loading:i,children:h})]})]})},Ii=()=>{},Ai=({children:e})=>{const[t,o]=u.useState(null),r=u.useCallback((a,c,s,p,x)=>{o({open:!0,label:a,description:c,onConfirm:s,onDiscard:p||Ii,options:x||{}})},[]),i=u.useCallback(()=>{o(null)},[]);return l.jsxs(vt.Provider,{value:{show:r,hide:i},children:[e,t&&l.jsx(Ti,{confirmation:t,onDone:i})]})},Pi=()=>{const e=u.useContext(vt);if(!e)throw new Error("useNotifyConfirmation must be used within NotifyConfirmationProvider");return e},Bi=d.styled.div`
|
|
1376
1380
|
display: flex;
|
|
1377
1381
|
flex-direction: column;
|
|
1378
1382
|
gap: 2px;
|
|
1379
|
-
`,
|
|
1383
|
+
`,Mi=d.styled.span`
|
|
1380
1384
|
font-size: 10px;
|
|
1381
1385
|
font-weight: 700;
|
|
1382
1386
|
text-transform: uppercase;
|
|
1383
1387
|
letter-spacing: 0.5px;
|
|
1384
1388
|
color: #666;
|
|
1385
|
-
`,
|
|
1389
|
+
`,Fi=d.styled.span`
|
|
1386
1390
|
font-size: 12px;
|
|
1387
1391
|
color: #666;
|
|
1388
|
-
`,Ne=C.newClassNameGetter("overline"),
|
|
1392
|
+
`,Ne=C.newClassNameGetter("overline"),_i=({children:e,className:t,classnames:o,description:r,ref:i,...a})=>l.jsxs(Bi,{...a,ref:i,className:Ne("container",t),children:[l.jsx(Mi,{className:Ne("label",o==null?void 0:o.label),children:e}),r&&l.jsx(Fi,{className:Ne("description",o==null?void 0:o.description),children:r})]}),Di=d.styled.div`
|
|
1389
1393
|
position: relative;
|
|
1390
1394
|
display: flex;
|
|
1391
1395
|
flex-direction: column;
|
|
@@ -1395,7 +1399,7 @@
|
|
|
1395
1399
|
min-height: 100dvh;
|
|
1396
1400
|
padding: 40px 24px;
|
|
1397
1401
|
overflow: hidden;
|
|
1398
|
-
`,
|
|
1402
|
+
`,Gi=d.styled.div`
|
|
1399
1403
|
position: absolute;
|
|
1400
1404
|
inset: 0;
|
|
1401
1405
|
background-image:
|
|
@@ -1405,7 +1409,7 @@
|
|
|
1405
1409
|
mask-image: radial-gradient(ellipse 60% 50% at 50% 40%, black 20%, transparent 100%);
|
|
1406
1410
|
-webkit-mask-image: radial-gradient(ellipse 60% 50% at 50% 40%, black 20%, transparent 100%);
|
|
1407
1411
|
pointer-events: none;
|
|
1408
|
-
`,
|
|
1412
|
+
`,Yi=d.styled.div`
|
|
1409
1413
|
position: relative;
|
|
1410
1414
|
z-index: 1;
|
|
1411
1415
|
display: flex;
|
|
@@ -1413,9 +1417,9 @@
|
|
|
1413
1417
|
align-items: center;
|
|
1414
1418
|
width: 100%;
|
|
1415
1419
|
max-width: 400px;
|
|
1416
|
-
`,Yi=d.styled.div`
|
|
1417
|
-
margin-bottom: 32px;
|
|
1418
1420
|
`,Hi=d.styled.div`
|
|
1421
|
+
margin-bottom: 32px;
|
|
1422
|
+
`,Xi=d.styled.div`
|
|
1419
1423
|
display: flex;
|
|
1420
1424
|
align-items: center;
|
|
1421
1425
|
justify-content: center;
|
|
@@ -1429,38 +1433,38 @@
|
|
|
1429
1433
|
0 1px 2px rgba(0, 0, 0, 0.05),
|
|
1430
1434
|
0 1px 3px rgba(0, 0, 0, 0.1);
|
|
1431
1435
|
margin-bottom: 24px;
|
|
1432
|
-
`,
|
|
1436
|
+
`,Ui=d.styled.div`
|
|
1433
1437
|
display: flex;
|
|
1434
1438
|
flex-direction: column;
|
|
1435
1439
|
align-items: center;
|
|
1436
1440
|
text-align: center;
|
|
1437
1441
|
gap: 8px;
|
|
1438
1442
|
margin-bottom: 32px;
|
|
1439
|
-
`,
|
|
1443
|
+
`,Wi=d.styled.h1`
|
|
1440
1444
|
margin: 0;
|
|
1441
1445
|
font-size: 24px;
|
|
1442
1446
|
font-weight: 600;
|
|
1443
1447
|
color: ${n.COLORS.black};
|
|
1444
1448
|
line-height: 1.3;
|
|
1445
|
-
`,
|
|
1449
|
+
`,qi=d.styled.p`
|
|
1446
1450
|
margin: 0;
|
|
1447
1451
|
font-size: 14px;
|
|
1448
1452
|
color: ${n.COLORS["iron-grey"]};
|
|
1449
1453
|
line-height: 1.5;
|
|
1450
1454
|
max-width: 360px;
|
|
1451
|
-
`,qi=d.styled.div`
|
|
1452
|
-
width: 100%;
|
|
1453
1455
|
`,Ki=d.styled.div`
|
|
1456
|
+
width: 100%;
|
|
1457
|
+
`,Vi=d.styled.div`
|
|
1454
1458
|
margin-top: 32px;
|
|
1455
1459
|
text-align: center;
|
|
1456
1460
|
font-size: 14px;
|
|
1457
1461
|
color: ${n.COLORS["iron-grey"]};
|
|
1458
|
-
`,K=C.newClassNameGetter("shell-screen"),
|
|
1462
|
+
`,K=C.newClassNameGetter("shell-screen"),Zi=({children:e,className:t,classnames:o,description:r,footer:i,gridSize:a=64,icon:c,logo:s,ref:p,title:x,...g})=>l.jsxs(Di,{...g,ref:p,className:K("container",t),children:[l.jsx(Gi,{$size:a,className:K("grid",o==null?void 0:o.grid)}),l.jsxs(Yi,{children:[s&&l.jsx(Hi,{children:s}),c&&l.jsx(Xi,{className:K("icon"),children:c}),(x||r)&&l.jsxs(Ui,{className:K("header",o==null?void 0:o.header),children:[x&&l.jsx(Wi,{className:K("title",o==null?void 0:o.title),children:x}),r&&l.jsx(qi,{className:K("description",o==null?void 0:o.description),children:r})]}),e&&l.jsx(Ki,{className:K("content",o==null?void 0:o.content),children:e}),i&&l.jsx(Vi,{className:K("footer",o==null?void 0:o.footer),children:i})]})]}),Ji=(e,t,o,r)=>{if(o*2+3+r*2>=e)return Array.from({length:e},(y,f)=>f+1);const a=Math.max(t-o,r+1),c=Math.min(t+o,e-r),s=a>r+2,p=c<e-r-1;if(!s&&p){const y=o*2+r+2,f=Array.from({length:y},(b,$)=>$+1),S=Array.from({length:r},(b,$)=>e-r+$+1);return[...f,"dots",...S]}if(s&&!p){const y=o*2+r+2,f=Array.from({length:r},(b,$)=>$+1),S=Array.from({length:y},(b,$)=>e-y+$+1);return[...f,"dots",...S]}const x=Array.from({length:r},(y,f)=>f+1),g=Array.from({length:c-a+1},(y,f)=>a+f),h=Array.from({length:r},(y,f)=>e-r+f+1);return[...x,"dots",...g,"dots",...h]},Qi=d.styled.nav`
|
|
1459
1463
|
display: inline-flex;
|
|
1460
1464
|
align-items: center;
|
|
1461
1465
|
gap: 2px;
|
|
1462
1466
|
position: relative;
|
|
1463
|
-
`,
|
|
1467
|
+
`,el=(e,t)=>{if(!t)switch(e){case"bordered":return`
|
|
1464
1468
|
background-color: transparent;
|
|
1465
1469
|
border: 1px solid ${n.COLORS.gray};
|
|
1466
1470
|
color: ${n.COLORS["iron-grey"]};
|
|
@@ -1477,7 +1481,7 @@
|
|
|
1477
1481
|
color: ${n.COLORS.white};
|
|
1478
1482
|
position: relative;
|
|
1479
1483
|
z-index: 1;
|
|
1480
|
-
`},
|
|
1484
|
+
`},tl=d.styled.button`
|
|
1481
1485
|
position: relative;
|
|
1482
1486
|
display: inline-flex;
|
|
1483
1487
|
align-items: center;
|
|
@@ -1494,13 +1498,13 @@
|
|
|
1494
1498
|
transition:
|
|
1495
1499
|
background-color 0.15s ease,
|
|
1496
1500
|
color 0.15s ease;
|
|
1497
|
-
${({$variant:e,$active:t})=>
|
|
1501
|
+
${({$variant:e,$active:t})=>el(e,t)}
|
|
1498
1502
|
${({$disabled:e})=>e&&`
|
|
1499
1503
|
opacity: 0.4;
|
|
1500
1504
|
pointer-events: none;
|
|
1501
1505
|
cursor: default;
|
|
1502
1506
|
`}
|
|
1503
|
-
`,
|
|
1507
|
+
`,ol=d.styled.span`
|
|
1504
1508
|
position: absolute;
|
|
1505
1509
|
width: 36px;
|
|
1506
1510
|
height: 36px;
|
|
@@ -1509,7 +1513,7 @@
|
|
|
1509
1513
|
z-index: 0;
|
|
1510
1514
|
transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
|
|
1511
1515
|
pointer-events: none;
|
|
1512
|
-
`,
|
|
1516
|
+
`,rl=d.styled.span`
|
|
1513
1517
|
display: inline-flex;
|
|
1514
1518
|
align-items: center;
|
|
1515
1519
|
justify-content: center;
|
|
@@ -1542,7 +1546,7 @@
|
|
|
1542
1546
|
pointer-events: none;
|
|
1543
1547
|
cursor: default;
|
|
1544
1548
|
`}
|
|
1545
|
-
`,oe=C.newClassNameGetter("pagination"),
|
|
1549
|
+
`,oe=C.newClassNameGetter("pagination"),nl=({boundaries:e=1,className:t,classnames:o,disabled:r=!1,initialPage:i=1,loop:a=!1,onChange:c,page:s,ref:p,showControls:x=!1,siblings:g=1,total:h,variant:y="flat",...f})=>{const S=s!==void 0,[b,$]=u.useState(i),m=S?s:b,O=u.useRef(new Map),v=u.useRef(null),k=u.useRef(null),z=Ji(h,m,g,e),j=u.useCallback(w=>{S||$(w),c==null||c(w)},[S,c]),L=u.useCallback(w=>{w<1||w>h||w===m||j(w)},[m,j,h]),R=u.useCallback(()=>{if(m<=1){a&&j(h);return}j(m-1)},[m,a,j,h]),E=u.useCallback(()=>{if(m>=h){a&&j(1);return}j(m+1)},[m,a,j,h]);return u.useEffect(()=>{const w=k.current,T=v.current,N=O.current.get(m);if(!w||!T||!N)return;const M=T.getBoundingClientRect(),F=N.getBoundingClientRect().left-M.left;w.style.transform=`translateX(${F}px)`},[m,z]),l.jsxs(Qi,{...f,ref:p||v,className:oe("container",t),children:[l.jsx(ol,{ref:k,className:oe("cursor",o==null?void 0:o.cursor)}),x&&l.jsx(nt,{className:oe("controls",o==null?void 0:o.controls),$disabled:r||!a&&m<=1,onClick:R,"aria-label":"Previous page",children:l.jsx("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:l.jsx("path",{d:"m15 18-6-6 6-6"})})}),z.map((w,T)=>w==="dots"?l.jsx(rl,{className:oe("ellipsis",o==null?void 0:o.ellipsis),children:"..."},`dots-${T}`):l.jsx(tl,{ref:N=>{N?O.current.set(w,N):O.current.delete(w)},className:oe("item",o==null?void 0:o.item),$active:w===m,$variant:y,$disabled:r,onClick:()=>L(w),"aria-label":`Page ${w}`,"aria-current":w===m?"page":void 0,children:w},w)),x&&l.jsx(nt,{className:oe("controls",o==null?void 0:o.controls),$disabled:r||!a&&m>=h,onClick:E,"aria-label":"Next page",children:l.jsx("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:l.jsx("path",{d:"m9 18 6-6-6-6"})})})]})},it={light:{background:n.COLORS.white,border:n.alpha(n.COLORS.black,30),title:n.COLORS.black,description:n.COLORS["iron-grey"]},dark:{background:n.alpha(n.COLORS.white,5),border:n.alpha(n.COLORS.white,30),title:n.COLORS.white,description:"#9ca3af"}},Re=e=>it[e]??it.light,il=d.styled.div`
|
|
1546
1550
|
position: relative;
|
|
1547
1551
|
display: flex;
|
|
1548
1552
|
flex-direction: column;
|
|
@@ -1554,7 +1558,7 @@
|
|
|
1554
1558
|
box-shadow:
|
|
1555
1559
|
0 4px 6px -1px rgba(0, 0, 0, 0.1),
|
|
1556
1560
|
0 2px 4px -2px rgba(0, 0, 0, 0.1);
|
|
1557
|
-
`,
|
|
1561
|
+
`,ll=d.styled.div`
|
|
1558
1562
|
position: absolute;
|
|
1559
1563
|
top: -1px;
|
|
1560
1564
|
right: 12px;
|
|
@@ -1567,40 +1571,40 @@
|
|
|
1567
1571
|
letter-spacing: 0.5px;
|
|
1568
1572
|
text-transform: uppercase;
|
|
1569
1573
|
line-height: 1.4;
|
|
1570
|
-
`,
|
|
1574
|
+
`,al=d.styled.div`
|
|
1571
1575
|
display: flex;
|
|
1572
1576
|
flex-direction: column;
|
|
1573
1577
|
gap: 4px;
|
|
1574
|
-
`,
|
|
1578
|
+
`,dl=d.styled.div`
|
|
1575
1579
|
font-size: 18px;
|
|
1576
1580
|
font-weight: 600;
|
|
1577
1581
|
line-height: 1.4;
|
|
1578
1582
|
color: ${({$variant:e})=>Re(e).title};
|
|
1579
|
-
`,
|
|
1583
|
+
`,sl=d.styled.div`
|
|
1580
1584
|
font-size: 14px;
|
|
1581
1585
|
line-height: 1.5;
|
|
1582
1586
|
color: ${({$variant:e})=>Re(e).description};
|
|
1583
|
-
`,
|
|
1587
|
+
`,cl=d.styled.div`
|
|
1584
1588
|
display: flex;
|
|
1585
1589
|
flex-wrap: wrap;
|
|
1586
1590
|
gap: 8px;
|
|
1587
|
-
`,se=C.newClassNameGetter("panel"),
|
|
1591
|
+
`,se=C.newClassNameGetter("panel"),pl=({children:e,className:t,classnames:o,description:r,label:i,ref:a,title:c,variant:s="light",...p})=>{const x=c||r;return l.jsxs(il,{...p,ref:a,className:se("container",t),$variant:s,children:[i&&l.jsx(ll,{className:se("label",o==null?void 0:o.label),children:i}),x&&l.jsxs(al,{children:[c&&l.jsx(dl,{className:se("title",o==null?void 0:o.title),$variant:s,children:c}),r&&l.jsx(sl,{className:se("description",o==null?void 0:o.description),$variant:s,children:r})]}),l.jsx(cl,{className:se("content",o==null?void 0:o.content),children:e})]})},ul=["Готовим стартовый стол к запуску","Прогреваем фотонные двигатели","Запрашиваем разрешение у ЦУПа","Проверяем герметичность шлюзов","Выводим реактор на рабочую мощность","Ожидаем окно для маневра","Проверяем целостность теплозащиты","Разворачиваем солнечные паруса","Активируем систему навигации","Инициализируем бортовой компьютер","Рассчитываем вектор ускорения","Продуваем топливные магистрали","Тестируем аварийную систему спасения","Стабилизируем гироскопы на платформе","Загружаем полетное задание в память","Синхронизируем орбитальные часы","Рассчитываем траекторию кометы","Настраиваем антенну дальней связи","Считываем телеметрию со спутника","Корректируем азимут наведения","Фиксируем координаты черной дыры","Загружаем карту звездного неба","Калибруем инерциальную платформу","Принимаем эфемериды от станции","Уточняем параметры орбиты","Привязываемся к опорным звездам","Строим модель гравитационного поля","Анализируем метрики далеких звезд","Ждем прохождения первого нейтрино","Декодируем сигналы из туманности","Замеряем гравитационные волны","Отправляем зонд в пояс астероидов","Перехватываем межзвездные частицы","Обрабатываем данные телескопа","Анализируем спектр далекой звезды","Собираем пробы лунного грунта","Сканируем поверхность экзопланеты","Измеряем реликтовое излучение","Картографируем магнитные аномалии","Исследуем состав колец Сатурна","Регистрируем вспышку сверхновой","Фиксируем рентгеновский пульсар","Моделируем столкновение галактик","Наблюдаем транзит далекой планеты","Калибруем квантовый компилятор","Переводим данные в гиперпространство","Синтезируем топливо из вакуума","Компилируем нейронную матрицу","Оптимизируем квантовые вентили","Разматываем кубиты суперпозиции","Интерполируем пространство решений","Нормализуем тензорное поле","Индексируем базу знаний вселенной","Дефрагментируем пространство-время","Хешируем координаты червоточины","Верифицируем квантовую запутанность","Устанавливаем связь с Вояджером","Расшифровываем послание с Проксимы","Ретранслируем сигнал через Юпитер","Пингуем ближайший ретранслятор","Буферизуем поток тахионных данных","Шифруем канал субпространственной связи","Декомпрессируем архив звездных карт","Проверяем давление в отсеках","Балансируем нагрузку на генераторы","Охлаждаем сверхпроводящие магниты","Калибруем датчики внешней среды","Перезагружаем модуль жизнеобеспечения","Тестируем маневровые двигатели","Обновляем прошивку скафандров","Юстируем зеркала главного телескопа","Переключаем контур охлаждения","Диагностируем плазменный щит","Затягиваем болты на обшивке"],gl=3500,xl=e=>e&&e.length>0?e:ul,hl=e=>e&&e>0?e:gl,fl=e=>Math.max(...e.map(t=>t.length)),yl=(e,t)=>{const o=Math.floor((t-e.length)/2);return e.padStart(e.length+o).padEnd(t)},lt=(e,t)=>{const o=Array.from({length:e},(r,i)=>i);for(let r=o.length-1;r>0;r--){const i=Math.floor(Math.random()*(r+1));[o[r],o[i]]=[o[i],o[r]]}if(t!==void 0&&o[0]===t){const r=1+Math.floor(Math.random()*(o.length-1));[o[0],o[r]]=[o[r],o[0]]}return o},bl=B.keyframes`
|
|
1588
1592
|
from { transform: rotate(0deg) translateX(20px) rotate(0deg); }
|
|
1589
1593
|
to { transform: rotate(360deg) translateX(20px) rotate(-360deg); }
|
|
1590
|
-
|
|
1594
|
+
`,$l=B.keyframes`
|
|
1591
1595
|
from { transform: rotate(120deg) translateX(14px) rotate(-120deg); }
|
|
1592
1596
|
to { transform: rotate(480deg) translateX(14px) rotate(-480deg); }
|
|
1593
|
-
|
|
1597
|
+
`,Sl=B.keyframes`
|
|
1594
1598
|
from { transform: rotate(240deg) translateX(26px) rotate(-240deg); }
|
|
1595
1599
|
to { transform: rotate(600deg) translateX(26px) rotate(-600deg); }
|
|
1596
|
-
`,
|
|
1600
|
+
`,ml=d.styled.div`
|
|
1597
1601
|
display: flex;
|
|
1598
1602
|
flex-direction: column;
|
|
1599
1603
|
align-items: center;
|
|
1600
1604
|
justify-content: center;
|
|
1601
1605
|
padding: 48px 24px;
|
|
1602
1606
|
gap: 28px;
|
|
1603
|
-
`,
|
|
1607
|
+
`,Ol=d.styled.div`
|
|
1604
1608
|
position: relative;
|
|
1605
1609
|
width: 64px;
|
|
1606
1610
|
height: 64px;
|
|
@@ -1614,9 +1618,9 @@
|
|
|
1614
1618
|
border-radius: 50%;
|
|
1615
1619
|
background: ${n.COLORS.black};
|
|
1616
1620
|
opacity: ${e=>e.$index===0?1:e.$index===1?.6:.35};
|
|
1617
|
-
animation: ${e=>e.$index===0?
|
|
1621
|
+
animation: ${e=>e.$index===0?bl:e.$index===1?$l:Sl}
|
|
1618
1622
|
${e=>e.$index===0?3:e.$index===1?2:4.5}s linear infinite;
|
|
1619
|
-
`,
|
|
1623
|
+
`,vl=d.styled.span`
|
|
1620
1624
|
position: absolute;
|
|
1621
1625
|
width: 1px;
|
|
1622
1626
|
height: 1px;
|
|
@@ -1626,14 +1630,14 @@
|
|
|
1626
1630
|
clip: rect(0, 0, 0, 0);
|
|
1627
1631
|
white-space: nowrap;
|
|
1628
1632
|
border: 0;
|
|
1629
|
-
`,
|
|
1633
|
+
`,wl=d.styled.p`
|
|
1630
1634
|
margin: 0;
|
|
1631
1635
|
font-size: 14px;
|
|
1632
1636
|
color: ${n.COLORS["iron-grey"]};
|
|
1633
1637
|
line-height: 1.5;
|
|
1634
1638
|
text-align: center;
|
|
1635
1639
|
max-width: 360px;
|
|
1636
|
-
`,
|
|
1640
|
+
`,Cl=40,Rl=200,Ll=30,at="АБВГДЕЖЗИКЛМНОПРСТУФХЦЧШЩЭЮЯабвгдежзиклмнопрстуфхцчшщэюяABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789",kl=()=>at[Math.floor(Math.random()*at.length)],jl=e=>Rl+e*Ll,El=()=>Cl,zl=d.styled.div`
|
|
1637
1641
|
display: flex;
|
|
1638
1642
|
justify-content: center;
|
|
1639
1643
|
white-space: pre;
|
|
@@ -1643,23 +1647,23 @@
|
|
|
1643
1647
|
line-height: 1.6;
|
|
1644
1648
|
color: ${n.COLORS.black};
|
|
1645
1649
|
min-height: 1.6em;
|
|
1646
|
-
`,
|
|
1650
|
+
`,Nl=d.styled.span`
|
|
1647
1651
|
display: inline-block;
|
|
1648
1652
|
width: 0.65em;
|
|
1649
1653
|
text-align: center;
|
|
1650
|
-
`,
|
|
1654
|
+
`,Tl=C.newClassNameGetter("split-flap-text"),wt=({className:e,ref:t,text:o,...r})=>{const[i,a]=u.useState(()=>o.split("")),c=u.useRef(o),s=u.useRef([]),p=u.useRef(null),x=u.useRef([]),g=u.useRef(o.split("")),h=u.useCallback(()=>{p.current&&(clearInterval(p.current),p.current=null);for(const f of x.current)clearTimeout(f);x.current=[]},[]),y=u.useCallback(f=>{h(),g.current=f,s.current=f.map(S=>S===" "),p.current=setInterval(()=>{a(S=>S.map((b,$)=>s.current[$]?g.current[$]:kl()))},El()),x.current=f.map((S,b)=>setTimeout(()=>{s.current[b]=!0,s.current.every(Boolean)&&(p.current&&(clearInterval(p.current),p.current=null),a([...g.current]))},jl(b)))},[h]);return u.useEffect(()=>{o!==c.current&&(c.current=o,y(o.split("")))},[o,y]),u.useEffect(()=>h,[h]),l.jsx(zl,{...r,ref:t,className:Tl("container",e),"aria-hidden":"true",children:i.map((f,S)=>l.jsx(Nl,{children:f===" "?" ":f},S))})},ve=C.newClassNameGetter("pending-screen"),Il=({className:e,classnames:t,description:o,interval:r,phrases:i,ref:a,...c})=>{const s=u.useMemo(()=>xl(i),[i]),p=u.useMemo(()=>hl(r),[r]),x=u.useMemo(()=>fl(s),[s]),g=u.useRef([]),h=u.useRef(0),y=u.useCallback(v=>(h.current>=g.current.length&&(g.current=lt(s.length,v),h.current=0),g.current[h.current++]),[s.length]),[f,S]=u.useState(()=>{g.current=lt(s.length);const v=g.current[0];return h.current=1,v}),b=u.useRef(null),$=u.useCallback(()=>{S(v=>y(v))},[y]);u.useEffect(()=>(b.current=setInterval($,p),()=>{b.current&&clearInterval(b.current)}),[$,p]);const m=s[f],O=yl(m,x);return l.jsxs(ml,{...c,ref:a,className:ve("container",e),role:"status",children:[l.jsxs(Ol,{className:ve("indicator",t==null?void 0:t.indicator),children:[l.jsx(Te,{$index:0}),l.jsx(Te,{$index:1}),l.jsx(Te,{$index:2})]}),l.jsx(wt,{text:O,className:ve("board",t==null?void 0:t.board)}),l.jsx(vl,{children:m}),o&&l.jsx(wl,{className:ve("description",t==null?void 0:t.description),children:o})]})},_e={compact:{height:4,radius:2},default:{height:8,radius:4}},Al=d.styled.div`
|
|
1651
1655
|
width: 100%;
|
|
1652
1656
|
height: ${({$size:e})=>_e[e].height}px;
|
|
1653
1657
|
border-radius: ${({$size:e})=>_e[e].radius}px;
|
|
1654
1658
|
background-color: ${n.COLORS.gray};
|
|
1655
1659
|
overflow: hidden;
|
|
1656
|
-
`,
|
|
1660
|
+
`,Pl=d.styled.div`
|
|
1657
1661
|
height: 100%;
|
|
1658
1662
|
width: ${({$value:e})=>Math.min(100,Math.max(0,e))}%;
|
|
1659
1663
|
border-radius: ${({$size:e})=>_e[e].radius}px;
|
|
1660
1664
|
background-color: ${n.COLORS.black};
|
|
1661
1665
|
transition: width 0.2s ease;
|
|
1662
|
-
`,dt=C.newClassNameGetter("progress"),
|
|
1666
|
+
`,dt=C.newClassNameGetter("progress"),Bl=({value:e,size:t="default",className:o,classnames:r,ref:i,...a})=>l.jsx(Al,{...a,ref:i,$size:t,className:dt("track",o,r==null?void 0:r.track),role:"progressbar","aria-valuenow":e,"aria-valuemin":0,"aria-valuemax":100,children:l.jsx(Pl,{$size:t,$value:e,className:dt("bar",r==null?void 0:r.bar)})}),Ct=u.createContext(null),Ml=d.styled.div`
|
|
1663
1667
|
position: fixed;
|
|
1664
1668
|
bottom: 24px;
|
|
1665
1669
|
right: 24px;
|
|
@@ -1674,56 +1678,56 @@
|
|
|
1674
1678
|
animation: ${n.KEYFRAMES.fadeIn} 0.2s ease-out;
|
|
1675
1679
|
pointer-events: none;
|
|
1676
1680
|
color: ${n.COLORS.black};
|
|
1677
|
-
`,
|
|
1681
|
+
`,Fl=d.styled.span`
|
|
1678
1682
|
font-size: 14px;
|
|
1679
1683
|
font-weight: 500;
|
|
1680
1684
|
white-space: nowrap;
|
|
1681
|
-
`,
|
|
1685
|
+
`,_l=({children:e,defaultMessage:t="Saving"})=>{const[o,r]=u.useState(!1),[i,a]=u.useState(t),c=u.useCallback(x=>{a(x??t),r(!0)},[t]),s=u.useCallback(()=>{r(!1)},[]),p=u.useMemo(()=>({isVisible:o,show:c,hide:s}),[o,c,s]);return l.jsxs(Ct.Provider,{value:p,children:[e,o&&l.jsxs(Ml,{children:[l.jsx(d.Spinner,{size:"sm"}),l.jsx(Fl,{children:i})]})]})},Dl=()=>{const e=u.useContext(Ct);if(!e)throw new Error("useSaveProgress must be used within SaveProgressProvider");return e},Gl=B.keyframes`
|
|
1682
1686
|
0% { opacity: 1; }
|
|
1683
1687
|
50% { opacity: 0.4; }
|
|
1684
1688
|
100% { opacity: 1; }
|
|
1685
|
-
`,
|
|
1689
|
+
`,Yl=B.keyframes`
|
|
1686
1690
|
0% { transform: translateX(-100%); }
|
|
1687
1691
|
60% { transform: translateX(100%); }
|
|
1688
1692
|
100% { transform: translateX(100%); }
|
|
1689
|
-
`,Yl=B.css`
|
|
1690
|
-
animation: ${Dl} 1.5s ease-in-out infinite;
|
|
1691
1693
|
`,Hl=B.css`
|
|
1694
|
+
animation: ${Gl} 1.5s ease-in-out infinite;
|
|
1695
|
+
`,Xl=B.css`
|
|
1692
1696
|
&::after {
|
|
1693
1697
|
content: '';
|
|
1694
1698
|
position: absolute;
|
|
1695
1699
|
inset: 0;
|
|
1696
1700
|
background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.5), transparent);
|
|
1697
|
-
animation: ${
|
|
1701
|
+
animation: ${Yl} 1.6s linear infinite;
|
|
1698
1702
|
}
|
|
1699
|
-
`,
|
|
1703
|
+
`,Ul={pulse:Hl,wave:Xl,none:null},Wl={none:"0",sm:"4px",md:"8px",lg:"12px",full:"9999px"},Ie=e=>typeof e=="number"?`${e}px`:e,ql=d.styled.div`
|
|
1700
1704
|
position: relative;
|
|
1701
1705
|
overflow: hidden;
|
|
1702
1706
|
background-color: #e5e7eb;
|
|
1703
1707
|
width: ${({$width:e,$circle:t,$height:o})=>Ie(t?o:e)};
|
|
1704
1708
|
height: ${({$height:e})=>Ie(e)};
|
|
1705
|
-
border-radius: ${({$circle:e,$radius:t})=>e?"50%":
|
|
1706
|
-
${({$animation:e})=>
|
|
1707
|
-
`,
|
|
1709
|
+
border-radius: ${({$circle:e,$radius:t})=>e?"50%":Wl[t]};
|
|
1710
|
+
${({$animation:e})=>Ul[e]}
|
|
1711
|
+
`,Kl=C.newClassNameGetter("skeleton"),Vl=({animation:e="pulse",circle:t=!1,className:o,height:r=16,radius:i="md",ref:a,width:c="100%",...s})=>l.jsx(ql,{...s,ref:a,className:Kl("container",o),$animation:e,$circle:t,$height:r,$radius:i,$width:c}),Zl=d.styled.span`
|
|
1708
1712
|
display: inline-flex;
|
|
1709
1713
|
align-items: baseline;
|
|
1710
1714
|
gap: 4px;
|
|
1711
1715
|
font-size: 13px;
|
|
1712
1716
|
color: #666;
|
|
1713
|
-
`,
|
|
1717
|
+
`,Jl=d.styled.strong`
|
|
1714
1718
|
font-weight: 700;
|
|
1715
1719
|
color: ${n.COLORS.black};
|
|
1716
|
-
`,
|
|
1720
|
+
`,Ql=d.styled.span``,Ae=C.newClassNameGetter("stat"),ea=({className:e,classnames:t,label:o,ref:r,value:i,...a})=>l.jsxs(Zl,{...a,ref:r,className:Ae("container",e),children:[l.jsx(Jl,{className:Ae("value",t==null?void 0:t.value),children:i}),l.jsx(Ql,{className:Ae("label",t==null?void 0:t.label),children:o})]}),ta=d.styled.div`
|
|
1717
1721
|
display: flex;
|
|
1718
1722
|
flex-direction: column;
|
|
1719
1723
|
border: 1px solid ${n.COLORS.gray};
|
|
1720
1724
|
border-radius: 8px;
|
|
1721
1725
|
overflow: hidden;
|
|
1722
|
-
`,
|
|
1726
|
+
`,oa=d.styled.div`
|
|
1723
1727
|
&:not(:last-child) {
|
|
1724
1728
|
border-bottom: 1px solid ${n.COLORS.gray};
|
|
1725
1729
|
}
|
|
1726
|
-
`,
|
|
1730
|
+
`,ra=d.styled.button`
|
|
1727
1731
|
display: flex;
|
|
1728
1732
|
align-items: center;
|
|
1729
1733
|
gap: 8px;
|
|
@@ -1742,7 +1746,7 @@
|
|
|
1742
1746
|
&:hover {
|
|
1743
1747
|
background-color: ${({$interactive:e})=>e?n.alpha(n.COLORS.black,3):"transparent"};
|
|
1744
1748
|
}
|
|
1745
|
-
`,
|
|
1749
|
+
`,na=d.styled.span`
|
|
1746
1750
|
display: flex;
|
|
1747
1751
|
align-items: center;
|
|
1748
1752
|
justify-content: center;
|
|
@@ -1752,72 +1756,72 @@
|
|
|
1752
1756
|
color: ${n.COLORS["iron-grey"]};
|
|
1753
1757
|
transition: transform 0.15s ease;
|
|
1754
1758
|
transform: rotate(${({$expanded:e})=>e?"90deg":"0deg"});
|
|
1755
|
-
`,
|
|
1759
|
+
`,ia=d.styled.span`
|
|
1756
1760
|
width: 16px;
|
|
1757
1761
|
height: 16px;
|
|
1758
1762
|
flex-shrink: 0;
|
|
1759
|
-
`,
|
|
1763
|
+
`,la={success:n.COLORS.green,error:n.COLORS.red,running:n.COLORS["steel-blue"],pending:n.COLORS.gray},aa=B.keyframes`
|
|
1760
1764
|
from { transform: rotate(0deg); }
|
|
1761
1765
|
to { transform: rotate(360deg); }
|
|
1762
|
-
`,
|
|
1763
|
-
animation: ${
|
|
1764
|
-
`,
|
|
1766
|
+
`,da=B.css`
|
|
1767
|
+
animation: ${aa} 1s linear infinite;
|
|
1768
|
+
`,sa=d.styled.span`
|
|
1765
1769
|
display: flex;
|
|
1766
1770
|
align-items: center;
|
|
1767
1771
|
justify-content: center;
|
|
1768
1772
|
flex-shrink: 0;
|
|
1769
|
-
color: ${({$status:e})=>
|
|
1770
|
-
${({$status:e})=>e==="running"&&
|
|
1771
|
-
`,
|
|
1773
|
+
color: ${({$status:e})=>la[e]};
|
|
1774
|
+
${({$status:e})=>e==="running"&&da}
|
|
1775
|
+
`,ca=d.styled.span`
|
|
1772
1776
|
flex: 1;
|
|
1773
1777
|
min-width: 0;
|
|
1774
1778
|
overflow: hidden;
|
|
1775
1779
|
text-overflow: ellipsis;
|
|
1776
1780
|
white-space: nowrap;
|
|
1777
1781
|
color: ${({$muted:e})=>e?n.COLORS["iron-grey"]:n.COLORS.black};
|
|
1778
|
-
`,
|
|
1782
|
+
`,pa=d.styled.span`
|
|
1779
1783
|
flex-shrink: 0;
|
|
1780
1784
|
font-size: 12px;
|
|
1781
1785
|
font-weight: 400;
|
|
1782
1786
|
color: ${n.COLORS["iron-grey"]};
|
|
1783
1787
|
font-variant-numeric: tabular-nums;
|
|
1784
|
-
`,
|
|
1788
|
+
`,ua=d.styled.div`
|
|
1785
1789
|
display: grid;
|
|
1786
1790
|
grid-template-rows: ${({$expanded:e})=>e?"1fr":"0fr"};
|
|
1787
1791
|
transition: grid-template-rows 0.15s ease;
|
|
1788
|
-
`,ua=d.styled.div`
|
|
1789
|
-
overflow: hidden;
|
|
1790
1792
|
`,ga=d.styled.div`
|
|
1793
|
+
overflow: hidden;
|
|
1794
|
+
`,xa=d.styled.div`
|
|
1791
1795
|
padding: 8px 0;
|
|
1792
1796
|
background-color: ${n.COLORS.white};
|
|
1793
1797
|
border-top: 1px solid ${n.COLORS.gray};
|
|
1794
1798
|
font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;
|
|
1795
1799
|
font-size: 12px;
|
|
1796
1800
|
line-height: 20px;
|
|
1797
|
-
`,
|
|
1801
|
+
`,ha=d.styled.div`
|
|
1798
1802
|
display: flex;
|
|
1799
1803
|
padding: 0 16px;
|
|
1800
1804
|
|
|
1801
1805
|
&:hover {
|
|
1802
1806
|
background-color: ${n.alpha(n.COLORS.black,3)};
|
|
1803
1807
|
}
|
|
1804
|
-
`,
|
|
1808
|
+
`,fa=d.styled.span`
|
|
1805
1809
|
flex-shrink: 0;
|
|
1806
1810
|
width: 40px;
|
|
1807
1811
|
text-align: right;
|
|
1808
1812
|
padding-right: 16px;
|
|
1809
1813
|
color: ${n.COLORS["iron-grey"]};
|
|
1810
1814
|
user-select: none;
|
|
1811
|
-
`,
|
|
1815
|
+
`,ya=d.styled.span`
|
|
1812
1816
|
flex: 1;
|
|
1813
1817
|
min-width: 0;
|
|
1814
1818
|
white-space: pre;
|
|
1815
1819
|
color: ${n.COLORS.black};
|
|
1816
|
-
`,we=C.newClassNameGetter("step-log"),
|
|
1820
|
+
`,we=C.newClassNameGetter("step-log"),ba={success:Le.CircleCheck,error:Le.CircleX,running:l.LoaderCircle,pending:Le.Circle},$a=({className:e,classnames:t,defaultValue:o=[],onChange:r,ref:i,steps:a,value:c,...s})=>{const[p,x]=u.useState(o),g=c!==void 0,h=g?c:p,y=u.useCallback(f=>{const b=h.includes(f)?h.filter($=>$!==f):[...h,f];g||x(b),r==null||r(b)},[h,g,r]);return l.jsx(ta,{...s,ref:i,className:we("container",e),children:a.map(f=>{const S=h.includes(f.value),b=f.status??"pending",$=b!=="pending",m=f.lines&&f.lines.length>0,O=ba[b];return l.jsxs(oa,{className:we("step",t==null?void 0:t.step),children:[l.jsxs(ra,{type:"button",$expanded:S,$interactive:$,onClick:$?()=>y(f.value):void 0,className:we("header",t==null?void 0:t.header),children:[$?l.jsx(na,{$expanded:S,children:l.jsx(l.ChevronRight,{size:14})}):l.jsx(ia,{}),l.jsx(sa,{$status:b,children:l.jsx(O,{size:16})}),l.jsx(ca,{$muted:b==="pending",children:f.title}),f.duration&&l.jsx(pa,{children:f.duration})]}),$&&m&&l.jsx(ua,{$expanded:S,children:l.jsx(ga,{children:l.jsx(xa,{className:we("log",t==null?void 0:t.log),children:f.lines.map(v=>l.jsxs(ha,{children:[l.jsx(fa,{children:v.line}),l.jsx(ya,{children:v.text})]},v.line))})})})]},f.value)})})},Sa=d.styled.div`
|
|
1817
1821
|
display: flex;
|
|
1818
1822
|
align-items: ${e=>e.$orientation==="vertical"?"flex-start":"center"};
|
|
1819
1823
|
flex-direction: ${e=>e.$orientation==="vertical"?"column":"row"};
|
|
1820
|
-
`,
|
|
1824
|
+
`,ma=d.styled.div`
|
|
1821
1825
|
display: flex;
|
|
1822
1826
|
align-items: ${e=>e.$orientation==="vertical"?"flex-start":"center"};
|
|
1823
1827
|
flex-direction: ${e=>e.$orientation==="vertical"?"column":"row"};
|
|
@@ -1826,7 +1830,7 @@
|
|
|
1826
1830
|
&:last-child {
|
|
1827
1831
|
flex: 0;
|
|
1828
1832
|
}
|
|
1829
|
-
`,
|
|
1833
|
+
`,Oa=d.styled.button`
|
|
1830
1834
|
display: flex;
|
|
1831
1835
|
align-items: center;
|
|
1832
1836
|
gap: 10px;
|
|
@@ -1835,7 +1839,7 @@
|
|
|
1835
1839
|
background: transparent;
|
|
1836
1840
|
cursor: ${e=>e.$clickable?"pointer":"default"};
|
|
1837
1841
|
flex-shrink: 0;
|
|
1838
|
-
`,
|
|
1842
|
+
`,va=d.styled.div`
|
|
1839
1843
|
display: flex;
|
|
1840
1844
|
align-items: center;
|
|
1841
1845
|
justify-content: center;
|
|
@@ -1859,13 +1863,13 @@
|
|
|
1859
1863
|
border: 2px solid ${n.COLORS.gray};
|
|
1860
1864
|
color: ${n.COLORS["iron-grey"]};
|
|
1861
1865
|
`}
|
|
1862
|
-
`,
|
|
1866
|
+
`,wa=d.styled.span`
|
|
1863
1867
|
font-size: 14px;
|
|
1864
1868
|
font-weight: 500;
|
|
1865
1869
|
white-space: nowrap;
|
|
1866
1870
|
color: ${e=>e.$active||e.$completed?n.COLORS.black:n.COLORS["iron-grey"]};
|
|
1867
1871
|
transition: color 0.2s ease;
|
|
1868
|
-
`,
|
|
1872
|
+
`,Ca=d.styled.div`
|
|
1869
1873
|
background-color: ${e=>e.$completed?n.COLORS.black:n.COLORS.gray};
|
|
1870
1874
|
transition: background-color 0.2s ease;
|
|
1871
1875
|
|
|
@@ -1879,11 +1883,11 @@
|
|
|
1879
1883
|
min-width: 16px;
|
|
1880
1884
|
margin: 0 12px;
|
|
1881
1885
|
`}
|
|
1882
|
-
`,ce=C.newClassNameGetter("stepper"),
|
|
1886
|
+
`,ce=C.newClassNameGetter("stepper"),Ra=({className:e,classnames:t,onChange:o,orientation:r="horizontal",ref:i,steps:a,value:c,...s})=>{const p=u.useMemo(()=>a.findIndex(x=>x.value===c),[a,c]);return l.jsx(Sa,{...s,ref:i,$orientation:r,className:ce("container",e),children:a.map((x,g)=>{const h=x.value===c,y=g<p,f=g===a.length-1;return l.jsxs(ma,{$orientation:r,children:[l.jsxs(Oa,{type:"button",$active:h,$completed:y,$clickable:!!o,onClick:()=>o==null?void 0:o(x.value),className:ce("step",t==null?void 0:t.step),children:[l.jsx(va,{$active:h,$completed:y,className:ce("circle",t==null?void 0:t.circle),children:g+1}),l.jsx(wa,{$active:h,$completed:y,className:ce("label",t==null?void 0:t.label),children:x.label})]}),!f&&l.jsx(Ca,{$completed:y,$orientation:r,className:ce("line",t==null?void 0:t.line)})]},x.value)})})},La=d.styled.div`
|
|
1883
1887
|
display: flex;
|
|
1884
1888
|
align-items: center;
|
|
1885
1889
|
gap: 6px;
|
|
1886
|
-
`,
|
|
1890
|
+
`,ka=d.styled.button`
|
|
1887
1891
|
padding: 6px 16px;
|
|
1888
1892
|
border: none;
|
|
1889
1893
|
border-radius: 12px;
|
|
@@ -1901,49 +1905,49 @@
|
|
|
1901
1905
|
&:hover:not(:disabled) {
|
|
1902
1906
|
background-color: ${e=>e.$active?n.COLORS.gray:"rgba(0, 0, 0, 0.05)"};
|
|
1903
1907
|
}
|
|
1904
|
-
`,st=C.newClassNameGetter("tabs"),
|
|
1908
|
+
`,st=C.newClassNameGetter("tabs"),ja=({className:e,classnames:t,onChange:o,ref:r,tabs:i,value:a,...c})=>l.jsx(La,{...c,ref:r,className:st("container",e),role:"tablist",children:i.map(s=>l.jsx(ka,{type:"button",role:"tab","aria-selected":a===s.value,$active:a===s.value,$disabled:!!s.disabled,disabled:s.disabled,onClick:()=>o(s.value),className:st("tab",t==null?void 0:t.tab),children:s.label},s.value))}),Ea=d.styled.div`
|
|
1905
1909
|
display: flex;
|
|
1906
1910
|
flex-direction: column;
|
|
1907
|
-
`,
|
|
1911
|
+
`,za=d.styled.div`
|
|
1908
1912
|
display: grid;
|
|
1909
1913
|
grid-template-columns: 20px 1fr;
|
|
1910
1914
|
gap: 0 12px;
|
|
1911
|
-
`,
|
|
1915
|
+
`,Na=d.styled.div`
|
|
1912
1916
|
display: flex;
|
|
1913
1917
|
flex-direction: column;
|
|
1914
1918
|
align-items: center;
|
|
1915
1919
|
grid-row: 1 / -1;
|
|
1916
|
-
`,
|
|
1920
|
+
`,Ta=d.styled.div`
|
|
1917
1921
|
width: 10px;
|
|
1918
1922
|
height: 10px;
|
|
1919
1923
|
border-radius: 50%;
|
|
1920
1924
|
background-color: ${n.COLORS.black};
|
|
1921
1925
|
flex-shrink: 0;
|
|
1922
1926
|
margin-top: 5px;
|
|
1923
|
-
`,
|
|
1927
|
+
`,Ia=d.styled.div`
|
|
1924
1928
|
width: 2px;
|
|
1925
1929
|
flex: 1;
|
|
1926
1930
|
background-color: ${n.COLORS.gray};
|
|
1927
1931
|
visibility: ${e=>e.$last?"hidden":"visible"};
|
|
1928
|
-
`,
|
|
1932
|
+
`,Aa=d.styled.div`
|
|
1929
1933
|
padding-bottom: ${e=>e.$last?"0":"24px"};
|
|
1930
1934
|
min-width: 0;
|
|
1931
|
-
`,
|
|
1935
|
+
`,Pa=d.styled.div`
|
|
1932
1936
|
font-size: 15px;
|
|
1933
1937
|
font-weight: 600;
|
|
1934
1938
|
color: ${n.COLORS.black};
|
|
1935
1939
|
line-height: 20px;
|
|
1936
|
-
`,
|
|
1940
|
+
`,Ba=d.styled.div`
|
|
1937
1941
|
font-size: 13px;
|
|
1938
1942
|
color: ${n.COLORS["iron-grey"]};
|
|
1939
1943
|
margin-top: 2px;
|
|
1940
1944
|
line-height: 1.4;
|
|
1941
|
-
`,
|
|
1945
|
+
`,Ma=d.styled.div`
|
|
1942
1946
|
font-size: 14px;
|
|
1943
1947
|
color: ${n.COLORS["iron-grey"]};
|
|
1944
1948
|
margin-top: 8px;
|
|
1945
1949
|
line-height: 1.5;
|
|
1946
|
-
`,V=C.newClassNameGetter("timeline"),
|
|
1950
|
+
`,V=C.newClassNameGetter("timeline"),Fa=({className:e,classnames:t,items:o,ref:r,...i})=>l.jsx(Ea,{...i,ref:r,className:V("container",e),children:o.map((a,c)=>{const s=c===o.length-1;return l.jsxs(za,{className:V("item",t==null?void 0:t.item),children:[l.jsxs(Na,{$last:s,children:[l.jsx(Ta,{className:V("dot",t==null?void 0:t.dot)}),l.jsx(Ia,{className:V("line",t==null?void 0:t.line),$last:s})]}),l.jsxs(Aa,{className:V("content",t==null?void 0:t.content),$last:s,children:[l.jsx(Pa,{className:V("title",t==null?void 0:t.title),children:a.title}),a.description&&l.jsx(Ba,{className:V("description",t==null?void 0:t.description),children:a.description}),a.content&&l.jsx(Ma,{className:V("body",t==null?void 0:t.body),children:a.content})]})]},c)})}),Rt=u.createContext(null),Pe=3,ct={default:{background:"#374151",text:n.COLORS.white,border:"#374151"},success:{background:n.COLORS.green,text:n.COLORS.white,border:n.COLORS.green},warning:{background:n.COLORS.yellow,text:n.COLORS.white,border:n.COLORS.yellow},danger:{background:n.COLORS.red,text:n.COLORS.white,border:n.COLORS.red}},_a=(e,t)=>{switch(t.type){case"ADD_TOAST":{const o=t.payload;return e.toasts.length<Pe?{...e,toasts:[...e.toasts,o]}:{...e,queue:[...e.queue,o]}}case"REMOVE_TOAST":{const o=t.payload,r=e.toasts.filter(a=>a.id!==o),i=e.queue[0];return i&&r.length<Pe?{toasts:[...r,i],queue:e.queue.slice(1)}:{...e,toasts:r}}case"SHOW_NEXT_FROM_QUEUE":{const o=e.queue[0];return!o||e.toasts.length>=Pe?e:{toasts:[...e.toasts,o],queue:e.queue.slice(1)}}default:return e}},Da={toasts:[],queue:[]},Be=e=>ct[e]??ct.default,Ga=d.styled.div`
|
|
1947
1951
|
position: fixed;
|
|
1948
1952
|
bottom: 24px;
|
|
1949
1953
|
left: 24px;
|
|
@@ -1954,7 +1958,7 @@
|
|
|
1954
1958
|
pointer-events: none;
|
|
1955
1959
|
width: auto;
|
|
1956
1960
|
max-width: 90vw;
|
|
1957
|
-
`,
|
|
1961
|
+
`,Ya=d.styled.div`
|
|
1958
1962
|
display: flex;
|
|
1959
1963
|
align-items: center;
|
|
1960
1964
|
justify-content: space-between;
|
|
@@ -1970,14 +1974,14 @@
|
|
|
1970
1974
|
0.3s ease-out;
|
|
1971
1975
|
pointer-events: auto;
|
|
1972
1976
|
max-width: 500px;
|
|
1973
|
-
`,
|
|
1977
|
+
`,Ha=d.styled.span`
|
|
1974
1978
|
font-size: 14px;
|
|
1975
1979
|
font-weight: 500;
|
|
1976
1980
|
line-height: 1.4;
|
|
1977
1981
|
white-space: nowrap;
|
|
1978
1982
|
overflow: hidden;
|
|
1979
1983
|
text-overflow: ellipsis;
|
|
1980
|
-
`,
|
|
1984
|
+
`,Xa=d.styled.button`
|
|
1981
1985
|
display: flex;
|
|
1982
1986
|
align-items: center;
|
|
1983
1987
|
justify-content: center;
|
|
@@ -1995,13 +1999,13 @@
|
|
|
1995
1999
|
&:hover {
|
|
1996
2000
|
opacity: 1;
|
|
1997
2001
|
}
|
|
1998
|
-
`,
|
|
2002
|
+
`,Ua=d.styled.div`
|
|
1999
2003
|
display: flex;
|
|
2000
2004
|
align-items: center;
|
|
2001
2005
|
justify-content: space-between;
|
|
2002
2006
|
gap: 12px;
|
|
2003
2007
|
width: 100%;
|
|
2004
|
-
`,
|
|
2008
|
+
`,Wa=d.styled.div`
|
|
2005
2009
|
display: flex;
|
|
2006
2010
|
align-items: center;
|
|
2007
2011
|
justify-content: center;
|
|
@@ -2016,7 +2020,7 @@
|
|
|
2016
2020
|
font-weight: 500;
|
|
2017
2021
|
white-space: nowrap;
|
|
2018
2022
|
margin-left: auto;
|
|
2019
|
-
`,pt=({toast:e,onHide:t})=>{const[o,r]=u.useState(!1),i=()=>{r(!0),setTimeout(()=>{t(e.id)},300)};return u.useEffect(()=>{if(e.duration){const a=setTimeout(()=>{i()},e.duration);return()=>clearTimeout(a)}},[e.duration,e.id]),l.jsxs(
|
|
2023
|
+
`,pt=({toast:e,onHide:t})=>{const[o,r]=u.useState(!1),i=()=>{r(!0),setTimeout(()=>{t(e.id)},300)};return u.useEffect(()=>{if(e.duration){const a=setTimeout(()=>{i()},e.duration);return()=>clearTimeout(a)}},[e.duration,e.id]),l.jsxs(Ya,{$variant:e.variant,$isExiting:o,children:[l.jsx(Ha,{children:e.message}),l.jsx(Xa,{onClick:i,children:l.jsx(l.X,{style:{width:16,height:16}})})]})},qa=({toasts:e,queueCount:t,onHide:o})=>{if(e.length===0)return null;const r=e.length-1;return l.jsx(Ga,{children:e.map((i,a)=>a===r&&t>0?l.jsxs(Ua,{children:[l.jsx(pt,{toast:i,onHide:o}),l.jsxs(Wa,{children:["+",t]})]},i.id):l.jsx(pt,{toast:i,onHide:o},i.id))})},Ka=({children:e})=>{const[t,o]=u.useReducer(_a,Da),r=u.useCallback((a,c="default",s)=>{const p=`toast-${Date.now()}-${Math.random().toString(36).substr(2,9)}`;o({type:"ADD_TOAST",payload:{id:p,message:a,variant:c,duration:s}})},[]),i=u.useCallback(a=>{o({type:"REMOVE_TOAST",payload:a})},[]);return l.jsxs(Rt.Provider,{value:{show:r,hide:i},children:[e,l.jsx(qa,{toasts:t.toasts,queueCount:t.queue.length,onHide:i})]})},Va=()=>{const e=u.useContext(Rt);if(!e)throw new Error("useToastr must be used within ToastProvider");return e},ut={dark:{background:n.COLORS.black,text:n.COLORS.white},light:{background:n.COLORS.white,text:n.COLORS.black,border:n.COLORS.gray},success:{background:n.COLORS.green,text:n.COLORS.white},warning:{background:n.COLORS.yellow,text:n.COLORS.white},danger:{background:n.COLORS.red,text:n.COLORS.white}},ue=e=>ut[e]??ut.dark,Za=(e,t)=>{const o=ue(t).background;switch(e){case"top":return`
|
|
2020
2024
|
bottom: -12px;
|
|
2021
2025
|
left: 50%;
|
|
2022
2026
|
margin-left: -6px;
|
|
@@ -2036,7 +2040,7 @@
|
|
|
2036
2040
|
top: 50%;
|
|
2037
2041
|
margin-top: -6px;
|
|
2038
2042
|
border-right-color: ${o};
|
|
2039
|
-
`;default:return""}},
|
|
2043
|
+
`;default:return""}},Ja=(e,t)=>{if(t!=="light")return"";const o=ue(t).border;switch(e){case"top":return`
|
|
2040
2044
|
&::after {
|
|
2041
2045
|
bottom: -14px;
|
|
2042
2046
|
left: 50%;
|
|
@@ -2090,7 +2094,7 @@
|
|
|
2090
2094
|
width: 0;
|
|
2091
2095
|
height: 0;
|
|
2092
2096
|
border: 6px solid transparent;
|
|
2093
|
-
${
|
|
2097
|
+
${Za(e.$placement,e.$variant)}
|
|
2094
2098
|
}
|
|
2095
2099
|
|
|
2096
2100
|
${e.$variant==="light"?`
|
|
@@ -2103,12 +2107,12 @@
|
|
|
2103
2107
|
}
|
|
2104
2108
|
`:""}
|
|
2105
2109
|
|
|
2106
|
-
${
|
|
2107
|
-
`,
|
|
2110
|
+
${Ja(e.$placement,e.$variant)}
|
|
2111
|
+
`,Qa=d.styled.div`
|
|
2108
2112
|
position: relative;
|
|
2109
2113
|
display: inline-block;
|
|
2110
2114
|
width: fit-content;
|
|
2111
|
-
`,
|
|
2115
|
+
`,ed=e=>{switch(e){case"top":return`
|
|
2112
2116
|
bottom: calc(100% + 8px);
|
|
2113
2117
|
left: 50%;
|
|
2114
2118
|
transform: translateX(-50%);
|
|
@@ -2124,29 +2128,29 @@
|
|
|
2124
2128
|
left: calc(100% + 8px);
|
|
2125
2129
|
top: 50%;
|
|
2126
2130
|
transform: translateY(-50%);
|
|
2127
|
-
`;default:return""}},
|
|
2131
|
+
`;default:return""}},td=d.styled.div`
|
|
2128
2132
|
position: absolute;
|
|
2129
2133
|
${e=>Lt(e)}
|
|
2130
|
-
${({$placement:e})=>
|
|
2131
|
-
`,
|
|
2134
|
+
${({$placement:e})=>ed(e)}
|
|
2135
|
+
`,od=d.styled.div`
|
|
2132
2136
|
position: fixed;
|
|
2133
2137
|
${e=>Lt(e)}
|
|
2134
|
-
`,Me=C.newClassNameGetter("tooltip"),Z=8,
|
|
2138
|
+
`,Me=C.newClassNameGetter("tooltip"),Z=8,rd=({children:e,className:t,classnames:o,content:r,delay:i=200,placement:a="top",portalRenderNode:c,ref:s,variant:p="dark",...x})=>{const[g,h]=u.useState(!1),[y,f]=u.useState(null),[S,b]=u.useState(a),[$,m]=u.useState({top:0,left:0}),O=u.useRef(null),v=u.useRef(null),k=u.useCallback(()=>{var X,U;if(!O.current)return;const R=O.current.getBoundingClientRect(),E=((X=v.current)==null?void 0:X.offsetWidth)??100,w=((U=v.current)==null?void 0:U.offsetHeight)??30,T=R.top-Z,N=window.innerHeight-R.bottom-Z,M=R.left-Z,Y=window.innerWidth-R.right-Z;let F=a;if(a==="top"&&T<w&&N>T?F="bottom":a==="bottom"&&N<w&&T>N?F="top":a==="left"&&M<E&&Y>M?F="right":a==="right"&&Y<E&&M>Y&&(F="left"),b(F),c){let _,D;switch(F){case"top":_=R.top-w-Z,D=R.left+R.width/2-E/2;break;case"bottom":_=R.bottom+Z,D=R.left+R.width/2-E/2;break;case"left":_=R.top+R.height/2-w/2,D=R.left-E-Z;break;case"right":_=R.top+R.height/2-w/2,D=R.right+Z;break;default:_=0,D=0}const W=8;D=Math.max(W,Math.min(D,window.innerWidth-E-W)),_=Math.max(W,Math.min(_,window.innerHeight-w-W)),m({top:_,left:D})}},[a,c]);u.useLayoutEffect(()=>{g&&k()},[g,k]);const z=()=>{const R=setTimeout(()=>{h(!0)},i);f(R)},j=()=>{y&&(clearTimeout(y),f(null)),h(!1)},L=c?De.createPortal(l.jsx(od,{ref:v,className:Me("content",o==null?void 0:o.content),$placement:S,$variant:p,$visible:g,style:{top:$.top,left:$.left},children:r}),c):l.jsx(td,{ref:v,className:Me("content",o==null?void 0:o.content),$placement:S,$variant:p,$visible:g,children:r});return l.jsxs(Qa,{...x,ref:R=>{O.current=R,typeof s=="function"?s(R):s&&(s.current=R)},className:Me("wrapper",t),onMouseEnter:z,onMouseLeave:j,children:[e,L]})},nd=d.styled.div`
|
|
2135
2139
|
display: inline-flex;
|
|
2136
2140
|
align-items: center;
|
|
2137
2141
|
gap: 12px;
|
|
2138
2142
|
flex-direction: ${({$reverse:e})=>e?"row-reverse":"row"};
|
|
2139
|
-
`,
|
|
2143
|
+
`,id=d.styled.div`
|
|
2140
2144
|
display: flex;
|
|
2141
2145
|
flex-direction: column;
|
|
2142
2146
|
text-align: ${({$align:e})=>e};
|
|
2143
|
-
`,
|
|
2147
|
+
`,ld=d.styled.span`
|
|
2144
2148
|
font-size: 14px;
|
|
2145
2149
|
font-weight: 600;
|
|
2146
2150
|
line-height: 1.4;
|
|
2147
|
-
`,
|
|
2151
|
+
`,ad=d.styled.span`
|
|
2148
2152
|
font-size: 12px;
|
|
2149
2153
|
color: #666;
|
|
2150
2154
|
line-height: 1.4;
|
|
2151
|
-
`,Ce=C.newClassNameGetter("user"),
|
|
2155
|
+
`,Ce=C.newClassNameGetter("user"),dd=({avatarPosition:e="left",avatarProps:t,className:o,classnames:r,description:i,name:a,ref:c,src:s,...p})=>{const x=e==="right";return l.jsxs(nd,{...p,ref:c,className:Ce("container",o),$reverse:x,children:[l.jsx(xt,{size:"sm",...t,name:typeof a=="string"?a:void 0,src:s??(t==null?void 0:t.src),className:Ce("avatar",r==null?void 0:r.avatar)}),l.jsxs(id,{$align:x?"right":"left",children:[l.jsx(ld,{className:Ce("name",r==null?void 0:r.name),children:a}),i&&l.jsx(ad,{className:Ce("description",r==null?void 0:r.description),children:i})]})]})};exports.BREAKPOINTS=n.BREAKPOINTS;exports.COLORS=n.COLORS;exports.KEYFRAMES=n.KEYFRAMES;exports.KEY_SYMBOLS=n.KEY_SYMBOLS;exports.alpha=n.alpha;exports.getBrowser=n.getBrowser;exports.getKeySymbols=n.getKeySymbols;exports.getOperatingSystem=n.getOperatingSystem;exports.isValid=n.isValid;exports.toHEX=n.toHEX;exports.useKeyBinding=n.useKeyBinding;exports.mediaBetween=H.mediaBetween;exports.mediaDown=H.mediaDown;exports.mediaUp=H.mediaUp;exports.validation=H.index;exports.Autocomplete=d.Autocomplete;exports.Button=d.Button;exports.Checkbox=d.Checkbox;exports.CheckboxCard=d.CheckboxCard;exports.CheckboxGroup=d.CheckboxGroup;exports.Chip=d.Chip;exports.DatePicker=d.DatePicker;exports.FieldLabel=d.FieldLabel;exports.FieldMessage=d.FieldMessage;exports.Input=d.Input;exports.KeySymbol=d.KeySymbol;exports.KeysBindings=d.KeysBindings;exports.Modal=d.Modal;exports.MultiSelect=d.MultiSelect;exports.OtpCode=d.OtpCode;exports.Radio=d.Radio;exports.RadioCard=d.RadioCard;exports.RadioGroup=d.RadioGroup;exports.Select=d.Select;exports.Spinner=d.Spinner;exports.Tags=d.Tags;exports.Textarea=d.Textarea;exports.Toggle=d.Toggle;exports.ToggleCard=d.ToggleCard;exports.ToggleGroup=d.ToggleGroup;exports.formatDateGo=d.formatDateGo;exports.newClassNameGetter=C.newClassNameGetter;exports.Accordion=Ft;exports.Alert=Wt;exports.Avatar=xt;exports.AvatarGroup=to;exports.Badge=ao;exports.BreadcrumbItem=so;exports.Breadcrumbs=fo;exports.Card=vo;exports.CardBody=Co;exports.CardFooter=Lo;exports.CardHeader=jo;exports.ConfirmationProvider=Fo;exports.Container=Yo;exports.DateRange=qo;exports.Divider=Zo;exports.Drawer=or;exports.Dropdown=dr;exports.EmptyState=yr;exports.FieldRow=Sr;exports.FileUpload=Hr;exports.FileUploadItem=qr;exports.GlobalStyle=Et;exports.Hashtag=Qr;exports.Heading=on;exports.ImageCropper=ci;exports.MenuButton=gi;exports.NotificationProvider=vi;exports.NotifyConfirmationProvider=Ai;exports.Overline=_i;exports.Pagination=nl;exports.Panel=pl;exports.PendingScreen=Il;exports.Progress=Bl;exports.SaveProgressProvider=_l;exports.ShellScreen=Zi;exports.Skeleton=Vl;exports.SplitFlapText=wt;exports.Stat=ea;exports.StepLog=$a;exports.Stepper=Ra;exports.Tabs=ja;exports.Timeline=Fa;exports.ToastProvider=Ka;exports.Tooltip=rd;exports.User=dd;exports.formatFileSize=bt;exports.useConfirmation=_o;exports.useImageCropper=mt;exports.useNotification=wi;exports.useNotifyConfirmation=Pi;exports.useSaveProgress=Dl;exports.useToastr=Va;
|
|
2152
2156
|
//# sourceMappingURL=index.cjs.map
|