@vacano/ui 1.15.8 → 1.17.0
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/{ToggleGroup-Do3q0qhi.js → ToggleGroup-8TgP7j1_.js} +266 -246
- package/dist/ToggleGroup-8TgP7j1_.js.map +1 -0
- package/dist/{ToggleGroup-DXq3FgdQ.cjs → ToggleGroup-FYyi3zCW.cjs} +3 -3
- package/dist/ToggleGroup-FYyi3zCW.cjs.map +1 -0
- package/dist/form.cjs +1 -1
- package/dist/form.js +1 -1
- package/dist/{index-B_4jp70c.js → index-C35SsHTU.js} +2 -2
- package/dist/{index-B_4jp70c.js.map → index-C35SsHTU.js.map} +1 -1
- package/dist/{index-BUoqL3Q7.cjs → index-YmuoQ8lQ.cjs} +2 -2
- package/dist/{index-BUoqL3Q7.cjs.map → index-YmuoQ8lQ.cjs.map} +1 -1
- package/dist/index.cjs +460 -783
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.ts +1 -54
- package/dist/index.js +1935 -2971
- package/dist/index.js.map +1 -1
- package/dist/{keyboard-Cexig8lu.cjs → keyboard-Ce6jVywF.cjs} +3 -3
- package/dist/keyboard-Ce6jVywF.cjs.map +1 -0
- package/dist/{keyboard-D5qN_1XD.js → keyboard-WjRJTKKV.js} +53 -53
- package/dist/keyboard-WjRJTKKV.js.map +1 -0
- package/dist/lib.cjs +1 -1
- package/dist/lib.js +2 -2
- package/package.json +8 -10
- package/dist/ToggleGroup-DXq3FgdQ.cjs.map +0 -1
- package/dist/ToggleGroup-Do3q0qhi.js.map +0 -1
- package/dist/keyboard-Cexig8lu.cjs.map +0 -1
- package/dist/keyboard-D5qN_1XD.js.map +0 -1
package/dist/index.cjs
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("./keyboard-Ce6jVywF.cjs"),F=require("./index-YmuoQ8lQ.cjs"),n=require("./X-CI1qRJDP.cjs"),z=require("@emotion/react"),a=require("react"),i=require("./ToggleGroup-FYyi3zCW.cjs"),C=require("./tooling-Dflq0Y98.cjs"),Ne=require("react-dom"),$e=require("./CircleX-BzaN6v37.cjs"),gt=z.css`
|
|
2
2
|
*,
|
|
3
3
|
*::before,
|
|
4
4
|
*::after {
|
|
@@ -100,21 +100,21 @@
|
|
|
100
100
|
:focus:not(:focus-visible) {
|
|
101
101
|
outline: none;
|
|
102
102
|
}
|
|
103
|
-
`,
|
|
103
|
+
`,ft=()=>n.jsx(z.Global,{styles:gt}),ht=i.styled.div`
|
|
104
104
|
display: flex;
|
|
105
105
|
flex-direction: column;
|
|
106
106
|
gap: ${({$variant:e})=>e==="splitted"?"8px":"0"};
|
|
107
|
-
`,
|
|
108
|
-
border-bottom: ${({$variant:e})=>e==="outlined"?`1px solid ${
|
|
107
|
+
`,yt=i.styled.div`
|
|
108
|
+
border-bottom: ${({$variant:e})=>e==="outlined"?`1px solid ${r.COLORS.gray}`:"none"};
|
|
109
109
|
border-radius: ${({$variant:e})=>e==="splitted"?"8px":"0"};
|
|
110
110
|
background-color: ${({$variant:e})=>e==="splitted"?"#f9fafb":"transparent"};
|
|
111
111
|
opacity: ${({$disabled:e})=>e?.5:1};
|
|
112
112
|
pointer-events: ${({$disabled:e})=>e?"none":"auto"};
|
|
113
113
|
|
|
114
114
|
&:first-of-type {
|
|
115
|
-
border-top: ${({$variant:e})=>e==="outlined"?`1px solid ${
|
|
115
|
+
border-top: ${({$variant:e})=>e==="outlined"?`1px solid ${r.COLORS.gray}`:"none"};
|
|
116
116
|
}
|
|
117
|
-
`,
|
|
117
|
+
`,bt=i.styled.button`
|
|
118
118
|
display: flex;
|
|
119
119
|
align-items: center;
|
|
120
120
|
justify-content: space-between;
|
|
@@ -125,43 +125,43 @@
|
|
|
125
125
|
cursor: ${({$disabled:e})=>e?"not-allowed":"pointer"};
|
|
126
126
|
font-size: 14px;
|
|
127
127
|
font-weight: 600;
|
|
128
|
-
color: ${({$expanded:e})=>e?
|
|
128
|
+
color: ${({$expanded:e})=>e?r.COLORS.black:r.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: ${
|
|
134
|
+
color: ${r.COLORS.black};
|
|
135
135
|
}
|
|
136
|
-
|
|
136
|
+
`,$t=i.styled.span`
|
|
137
137
|
display: flex;
|
|
138
138
|
align-items: center;
|
|
139
139
|
justify-content: center;
|
|
140
140
|
width: 20px;
|
|
141
141
|
height: 20px;
|
|
142
142
|
flex-shrink: 0;
|
|
143
|
-
color: ${
|
|
143
|
+
color: ${r.COLORS["iron-grey"]};
|
|
144
144
|
transition: transform 0.2s ease;
|
|
145
145
|
transform: rotate(${({$expanded:e})=>e?"180deg":"0deg"});
|
|
146
|
-
`,
|
|
146
|
+
`,St=i.styled.div`
|
|
147
147
|
display: grid;
|
|
148
148
|
grid-template-rows: ${({$expanded:e})=>e?"1fr":"0fr"};
|
|
149
149
|
transition: grid-template-rows 0.2s ease;
|
|
150
|
-
`,
|
|
150
|
+
`,Ot=i.styled.div`
|
|
151
151
|
overflow: hidden;
|
|
152
|
-
`,
|
|
152
|
+
`,Ct=i.styled.div`
|
|
153
153
|
padding: 0 16px 14px;
|
|
154
154
|
font-size: 14px;
|
|
155
155
|
line-height: 1.5;
|
|
156
|
-
color: ${
|
|
157
|
-
`,
|
|
156
|
+
color: ${r.COLORS["iron-grey"]};
|
|
157
|
+
`,Q=C.newClassNameGetter("accordion"),wt=()=>n.jsx("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:n.jsx("polyline",{points:"6 9 12 15 18 9"})}),vt=({className:e,classnames:o,defaultValue:t=[],items:l,multiple:s=!1,onChange:d,ref:x,value:c,variant:p="outlined",...g})=>{const[f,h]=a.useState(t),y=c!==void 0,u=y?c:f,S=a.useCallback(b=>{const $=u.includes(b);let w;s?w=$?u.filter(R=>R!==b):[...u,b]:w=$?[]:[b],y||h(w),d==null||d(w)},[u,y,s,d]);return n.jsx(ht,{...g,ref:x,$variant:p,className:Q("container",e),role:"region",children:l.map(b=>{const $=u.includes(b.value);return n.jsxs(yt,{$variant:p,$disabled:!!b.disabled,className:Q("item",o==null?void 0:o.item),children:[n.jsxs(bt,{type:"button","aria-expanded":$,$disabled:!!b.disabled,$expanded:$,disabled:b.disabled,onClick:()=>S(b.value),className:Q("trigger",o==null?void 0:o.trigger),children:[b.title,n.jsx($t,{$expanded:$,className:Q("icon",o==null?void 0:o.icon),children:n.jsx(wt,{})})]}),n.jsx(St,{$expanded:$,children:n.jsx(Ot,{children:n.jsx(Ct,{className:Q("content",o==null?void 0:o.content),children:b.content})})})]},b.value)})})},mt={none:"0",sm:"8px",md:"12px",lg:"16px",full:"9999px"},kt={normal:r.COLORS.black,success:r.COLORS.green,warning:r.COLORS.yellow,danger:r.COLORS.red},Rt=i.styled.div`
|
|
158
158
|
display: flex;
|
|
159
159
|
align-items: ${({$center:e})=>e?"center":"flex-start"};
|
|
160
160
|
gap: 12px;
|
|
161
161
|
padding: 16px;
|
|
162
|
-
border-radius: ${({$radius:e})=>
|
|
163
|
-
background-color: ${
|
|
164
|
-
`,
|
|
162
|
+
border-radius: ${({$radius:e})=>mt[e]};
|
|
163
|
+
background-color: ${r.COLORS.gray};
|
|
164
|
+
`,Lt=i.styled.div`
|
|
165
165
|
flex-shrink: 0;
|
|
166
166
|
display: flex;
|
|
167
167
|
align-items: center;
|
|
@@ -169,9 +169,9 @@
|
|
|
169
169
|
width: 40px;
|
|
170
170
|
height: 40px;
|
|
171
171
|
border-radius: 50%;
|
|
172
|
-
background-color: ${
|
|
172
|
+
background-color: ${r.COLORS.white};
|
|
173
173
|
box-shadow:
|
|
174
|
-
0 0 0 4px ${
|
|
174
|
+
0 0 0 4px ${r.COLORS.gray},
|
|
175
175
|
0 0 0 5px rgba(0, 0, 0, 0.06);
|
|
176
176
|
|
|
177
177
|
&::after {
|
|
@@ -185,87 +185,87 @@
|
|
|
185
185
|
width: 28px;
|
|
186
186
|
height: 28px;
|
|
187
187
|
border-radius: 50%;
|
|
188
|
-
background-color: ${({$variant:e})=>
|
|
189
|
-
color: ${
|
|
188
|
+
background-color: ${({$variant:e})=>kt[e]};
|
|
189
|
+
color: ${r.COLORS.white};
|
|
190
190
|
}
|
|
191
191
|
|
|
192
192
|
> span svg {
|
|
193
193
|
width: 16px;
|
|
194
194
|
height: 16px;
|
|
195
195
|
}
|
|
196
|
-
`,
|
|
196
|
+
`,jt=i.styled.div`
|
|
197
197
|
display: flex;
|
|
198
198
|
flex-direction: column;
|
|
199
199
|
gap: 2px;
|
|
200
200
|
flex: 1;
|
|
201
201
|
min-width: 0;
|
|
202
|
-
`,
|
|
202
|
+
`,Nt=i.styled.div`
|
|
203
203
|
font-size: 14px;
|
|
204
204
|
font-weight: 600;
|
|
205
|
-
color: ${
|
|
205
|
+
color: ${r.COLORS.black};
|
|
206
206
|
line-height: 1.4;
|
|
207
|
-
`,
|
|
207
|
+
`,Et=i.styled.div`
|
|
208
208
|
font-size: 14px;
|
|
209
|
-
color: ${
|
|
209
|
+
color: ${r.COLORS["iron-grey"]};
|
|
210
210
|
line-height: 1.5;
|
|
211
|
-
`,
|
|
211
|
+
`,de=C.newClassNameGetter("alert"),It=({className:e,classnames:o,description:t,icon:l,radius:s="lg",ref:d,title:x,variant:c="normal",...p})=>n.jsxs(Rt,{...p,ref:d,role:"alert",className:de("container",e),$radius:s,$center:!t,children:[l&&n.jsx(Lt,{$variant:c,className:de("icon",o==null?void 0:o.icon),children:n.jsx("span",{children:l})}),n.jsxs(jt,{children:[x&&n.jsx(Nt,{className:de("title",o==null?void 0:o.title),children:x}),t&&n.jsx(Et,{className:de("description",o==null?void 0:o.description),children:t})]})]}),Tt=e=>{var t,l;const o=e.trim().split(/\s+/);if(o.length>=2){const s=((t=o[0])==null?void 0:t[0])??"",d=((l=o[o.length-1])==null?void 0:l[0])??"";return(s+d).toUpperCase()}return e.slice(0,2).toUpperCase()},le={sm:32,md:40,lg:56},Je={sm:12,md:14,lg:20},Ee={sm:18,md:22,lg:30},zt={sm:"6px",md:"10px",lg:"14px",full:"50%"},Se={default:{background:r.COLORS.gray,color:r.COLORS.black,border:r.COLORS.gray},primary:{background:r.COLORS["baltic-blue"],color:r.COLORS.white,border:r.COLORS["baltic-blue"]},success:{background:r.COLORS.green,color:r.COLORS.white,border:r.COLORS.green},warning:{background:r.COLORS.yellow,color:r.COLORS.black,border:r.COLORS.yellow},danger:{background:r.COLORS.red,color:r.COLORS.white,border:r.COLORS.red}},At=i.styled.div`
|
|
212
212
|
position: relative;
|
|
213
213
|
display: inline-flex;
|
|
214
214
|
align-items: center;
|
|
215
215
|
justify-content: center;
|
|
216
216
|
overflow: hidden;
|
|
217
|
-
width: ${({$size:e})=>
|
|
218
|
-
height: ${({$size:e})=>
|
|
219
|
-
border-radius: ${({$radius:e})=>
|
|
220
|
-
background-color: ${({$color:e})=>
|
|
221
|
-
color: ${({$color:e})=>
|
|
222
|
-
font-size: ${({$size:e})=>
|
|
217
|
+
width: ${({$size:e})=>le[e]}px;
|
|
218
|
+
height: ${({$size:e})=>le[e]}px;
|
|
219
|
+
border-radius: ${({$radius:e})=>zt[e]};
|
|
220
|
+
background-color: ${({$color:e})=>Se[e].background};
|
|
221
|
+
color: ${({$color:e})=>Se[e].color};
|
|
222
|
+
font-size: ${({$size:e})=>Je[e]}px;
|
|
223
223
|
font-weight: 600;
|
|
224
224
|
line-height: 1;
|
|
225
225
|
flex-shrink: 0;
|
|
226
226
|
user-select: none;
|
|
227
227
|
box-sizing: border-box;
|
|
228
|
-
${({$bordered:e,$color:
|
|
228
|
+
${({$bordered:e,$color:o})=>e&&`box-shadow: 0 0 0 2px #fff, 0 0 0 4px ${Se[o].border};`}
|
|
229
229
|
${({$disabled:e})=>e&&"opacity: 0.5; pointer-events: none;"}
|
|
230
|
-
`,
|
|
230
|
+
`,Pt=i.styled.img`
|
|
231
231
|
width: 100%;
|
|
232
232
|
height: 100%;
|
|
233
233
|
object-fit: cover;
|
|
234
|
-
`,
|
|
234
|
+
`,Ie=i.styled.span`
|
|
235
235
|
display: inline-flex;
|
|
236
236
|
align-items: center;
|
|
237
237
|
justify-content: center;
|
|
238
238
|
|
|
239
239
|
& svg {
|
|
240
|
-
width: ${({$size:e})=>
|
|
241
|
-
height: ${({$size:e})=>
|
|
240
|
+
width: ${({$size:e})=>Ee[e]}px;
|
|
241
|
+
height: ${({$size:e})=>Ee[e]}px;
|
|
242
242
|
}
|
|
243
|
-
`,
|
|
243
|
+
`,Bt=i.styled.span`
|
|
244
244
|
letter-spacing: 0.5px;
|
|
245
|
-
`,
|
|
245
|
+
`,J=C.newClassNameGetter("avatar"),et=({bordered:e=!1,className:o,classnames:t,color:l="default",disabled:s=!1,icon:d,name:x,radius:c="full",ref:p,size:g="md",src:f,...h})=>{const[y,u]=a.useState(!1),S=f&&!y;return n.jsx(At,{...h,ref:p,className:J("container",o),$size:g,$radius:c,$color:l,$bordered:e,$disabled:s,children:S?n.jsx(Pt,{className:J("image",t==null?void 0:t.image),src:f,alt:x||"",onError:()=>u(!0)}):d?n.jsx(Ie,{className:J("fallback",t==null?void 0:t.fallback),$size:g,children:d}):x?n.jsx(Bt,{className:J("initials",t==null?void 0:t.initials),children:Tt(x)}):n.jsx(Ie,{className:J("fallback",t==null?void 0:t.fallback),$size:g,children:n.jsx("svg",{viewBox:"0 0 24 24",fill:"currentColor",children:n.jsx("path",{d:"M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"})})})})},Dt=i.styled.div`
|
|
246
246
|
display: inline-flex;
|
|
247
247
|
align-items: center;
|
|
248
248
|
|
|
249
249
|
& > * + * {
|
|
250
|
-
margin-left: -${({$size:e})=>Math.round(
|
|
250
|
+
margin-left: -${({$size:e})=>Math.round(le[e]*.25)}px;
|
|
251
251
|
}
|
|
252
|
-
`,
|
|
252
|
+
`,Mt=i.styled.div`
|
|
253
253
|
display: inline-flex;
|
|
254
254
|
align-items: center;
|
|
255
255
|
justify-content: center;
|
|
256
|
-
width: ${({$size:e})=>
|
|
257
|
-
height: ${({$size:e})=>
|
|
256
|
+
width: ${({$size:e})=>le[e]}px;
|
|
257
|
+
height: ${({$size:e})=>le[e]}px;
|
|
258
258
|
border-radius: 50%;
|
|
259
259
|
background-color: #e4e4e7;
|
|
260
260
|
color: #71717a;
|
|
261
|
-
font-size: ${({$size:e})=>
|
|
261
|
+
font-size: ${({$size:e})=>Je[e]}px;
|
|
262
262
|
font-weight: 600;
|
|
263
263
|
line-height: 1;
|
|
264
264
|
flex-shrink: 0;
|
|
265
|
-
`,
|
|
265
|
+
`,Te=C.newClassNameGetter("avatar-group"),_t=({children:e,className:o,classnames:t,max:l=5,ref:s,size:d="md",...x})=>{const c=a.Children.toArray(e).filter(a.isValidElement),p=c.slice(0,l),g=c.length-l;return n.jsxs(Dt,{...x,ref:s,className:Te("container",o),$size:d,children:[p.map(f=>a.isValidElement(f)?a.cloneElement(f,{size:d}):f),g>0&&n.jsxs(Mt,{className:Te("count",t==null?void 0:t.count),$size:d,children:["+",g]})]})},Ft={default:{bg:r.COLORS.black,text:r.COLORS.white,border:r.COLORS.black,flatBg:r.COLORS.gray},success:{bg:r.COLORS.green,text:r.COLORS.white,border:r.COLORS.green,flatBg:"#dcfce7"},warning:{bg:r.COLORS.yellow,text:r.COLORS.black,border:r.COLORS.yellow,flatBg:"#fef9c3"},danger:{bg:r.COLORS.red,text:r.COLORS.white,border:r.COLORS.red,flatBg:"#fee2e2"}},q={sm:{minWidth:16,height:16,fontSize:10,padding:"0 4px",dotSize:8},md:{minWidth:20,height:20,fontSize:11,padding:"0 5px",dotSize:10},lg:{minWidth:24,height:24,fontSize:12,padding:"0 6px",dotSize:12}},Gt=(e,o)=>{const t=o==="circle"?"10%":"0%";switch(e){case"top-right":return`top: 0; right: 0; transform: translate(50%, -50%) translate(-${t}, ${t});`;case"top-left":return`top: 0; left: 0; transform: translate(-50%, -50%) translate(${t}, ${t});`;case"bottom-right":return`bottom: 0; right: 0; transform: translate(50%, 50%) translate(-${t}, -${t});`;case"bottom-left":return`bottom: 0; left: 0; transform: translate(-50%, 50%) translate(${t}, -${t});`}},Ht=(e,o)=>{const t=Ft[o];switch(e){case"solid":return`background-color: ${t.bg}; color: ${t.text};`;case"flat":return`background-color: ${t.flatBg}; color: ${o==="default"?r.COLORS.black:t.bg};`;case"bordered":return`background-color: transparent; color: ${t.border}; border: 1.5px solid ${t.border};`}},Ut=i.styled.div`
|
|
266
266
|
position: relative;
|
|
267
267
|
display: inline-flex;
|
|
268
|
-
`,
|
|
268
|
+
`,Wt=i.styled.span`
|
|
269
269
|
position: absolute;
|
|
270
270
|
display: inline-flex;
|
|
271
271
|
align-items: center;
|
|
@@ -279,66 +279,66 @@
|
|
|
279
279
|
transform 0.15s ease,
|
|
280
280
|
opacity 0.15s ease;
|
|
281
281
|
|
|
282
|
-
${({$dot:e,$size:
|
|
283
|
-
width: ${
|
|
284
|
-
height: ${
|
|
282
|
+
${({$dot:e,$size:o})=>e?`
|
|
283
|
+
width: ${q[o].dotSize}px;
|
|
284
|
+
height: ${q[o].dotSize}px;
|
|
285
285
|
min-width: auto;
|
|
286
286
|
padding: 0;
|
|
287
287
|
`:`
|
|
288
|
-
min-width: ${
|
|
289
|
-
height: ${
|
|
290
|
-
font-size: ${
|
|
291
|
-
padding: ${
|
|
288
|
+
min-width: ${q[o].minWidth}px;
|
|
289
|
+
height: ${q[o].height}px;
|
|
290
|
+
font-size: ${q[o].fontSize}px;
|
|
291
|
+
padding: ${q[o].padding};
|
|
292
292
|
`}
|
|
293
293
|
|
|
294
|
-
${({$variant:e,$color:
|
|
294
|
+
${({$variant:e,$color:o})=>Ht(e,o)}
|
|
295
295
|
|
|
296
|
-
${({$placement:e,$shape:
|
|
296
|
+
${({$placement:e,$shape:o})=>Gt(e,o)}
|
|
297
297
|
|
|
298
298
|
${({$showOutline:e})=>e&&`
|
|
299
|
-
box-shadow: 0 0 0 2px ${
|
|
299
|
+
box-shadow: 0 0 0 2px ${r.COLORS.white};
|
|
300
300
|
`}
|
|
301
301
|
|
|
302
302
|
${({$invisible:e})=>e&&`
|
|
303
303
|
opacity: 0;
|
|
304
304
|
transform: scale(0);
|
|
305
305
|
`}
|
|
306
|
-
`,
|
|
306
|
+
`,ze=C.newClassNameGetter("badge"),Xt=({children:e,className:o,classnames:t,color:l="default",content:s,dot:d=!1,invisible:x=!1,placement:c="top-right",ref:p,shape:g="rectangle",showOutline:f=!0,size:h="md",variant:y="solid",...u})=>n.jsxs(Ut,{...u,ref:p,className:ze("container",o),children:[e,n.jsx(Wt,{className:ze("badge",t==null?void 0:t.badge),$color:l,$dot:d,$invisible:x,$placement:c,$shape:g,$showOutline:f,$size:h,$variant:y,children:!d&&s})]}),Yt=({children:e,...o})=>n.jsx("li",{...o,children:e}),K={sm:{fontSize:12,gap:4,padding:"4px 8px"},md:{fontSize:14,gap:6,padding:"6px 12px"},lg:{fontSize:16,gap:8,padding:"8px 16px"}},Kt=i.styled.nav`
|
|
307
307
|
display: inline-flex;
|
|
308
308
|
align-items: center;
|
|
309
|
-
${({$variant:e,$size:
|
|
310
|
-
background-color: ${
|
|
309
|
+
${({$variant:e,$size:o})=>{const{padding:t}=K[o];switch(e){case"solid":return`
|
|
310
|
+
background-color: ${r.COLORS.gray};
|
|
311
311
|
border-radius: 10px;
|
|
312
|
-
padding: ${
|
|
312
|
+
padding: ${t};
|
|
313
313
|
`;case"bordered":return`
|
|
314
|
-
border: 1px solid ${
|
|
314
|
+
border: 1px solid ${r.COLORS.gray};
|
|
315
315
|
border-radius: 10px;
|
|
316
|
-
padding: ${
|
|
316
|
+
padding: ${t};
|
|
317
317
|
`;default:return""}}}
|
|
318
|
-
`,
|
|
318
|
+
`,qt=i.styled.ol`
|
|
319
319
|
display: flex;
|
|
320
320
|
align-items: center;
|
|
321
|
-
gap: ${({$size:e})=>
|
|
321
|
+
gap: ${({$size:e})=>K[e].gap}px;
|
|
322
322
|
list-style: none;
|
|
323
323
|
margin: 0;
|
|
324
324
|
padding: 0;
|
|
325
325
|
flex-wrap: wrap;
|
|
326
|
-
`,
|
|
326
|
+
`,Ae=i.styled.li`
|
|
327
327
|
display: inline-flex;
|
|
328
328
|
align-items: center;
|
|
329
|
-
gap: ${({$size:e})=>
|
|
330
|
-
font-size: ${({$size:e})=>
|
|
329
|
+
gap: ${({$size:e})=>K[e].gap}px;
|
|
330
|
+
font-size: ${({$size:e})=>K[e].fontSize}px;
|
|
331
331
|
line-height: 1.5;
|
|
332
|
-
color: ${({$current:e})=>e?
|
|
332
|
+
color: ${({$current:e})=>e?r.COLORS.black:r.COLORS["iron-grey"]};
|
|
333
333
|
font-weight: ${({$current:e})=>e?600:400};
|
|
334
|
-
${({$disabled:e,$current:
|
|
335
|
-
`,
|
|
334
|
+
${({$disabled:e,$current:o})=>e&&!o&&"opacity: 0.5; pointer-events: none;"}
|
|
335
|
+
`,Vt=i.styled.a`
|
|
336
336
|
display: inline-flex;
|
|
337
337
|
align-items: center;
|
|
338
338
|
gap: 4px;
|
|
339
339
|
text-decoration: none;
|
|
340
340
|
color: inherit;
|
|
341
|
-
cursor: ${({$current:e,$disabled:
|
|
341
|
+
cursor: ${({$current:e,$disabled:o})=>e||o?"default":"pointer"};
|
|
342
342
|
transition: color 0.15s ease;
|
|
343
343
|
|
|
344
344
|
& svg {
|
|
@@ -346,48 +346,48 @@
|
|
|
346
346
|
height: 1em;
|
|
347
347
|
}
|
|
348
348
|
|
|
349
|
-
${({$current:e,$disabled:
|
|
349
|
+
${({$current:e,$disabled:o})=>!e&&!o&&`
|
|
350
350
|
&:hover {
|
|
351
|
-
color: ${
|
|
351
|
+
color: ${r.COLORS.black};
|
|
352
352
|
}
|
|
353
353
|
`}
|
|
354
|
-
`,
|
|
354
|
+
`,Zt=i.styled.span`
|
|
355
355
|
display: inline-flex;
|
|
356
356
|
align-items: center;
|
|
357
|
-
color: ${
|
|
358
|
-
font-size: ${({$size:e})=>
|
|
357
|
+
color: ${r.COLORS["iron-grey"]};
|
|
358
|
+
font-size: ${({$size:e})=>K[e].fontSize}px;
|
|
359
359
|
user-select: none;
|
|
360
360
|
|
|
361
361
|
& svg {
|
|
362
|
-
width: ${({$size:e})=>
|
|
363
|
-
height: ${({$size:e})=>
|
|
362
|
+
width: ${({$size:e})=>K[e].fontSize-2}px;
|
|
363
|
+
height: ${({$size:e})=>K[e].fontSize-2}px;
|
|
364
364
|
}
|
|
365
|
-
`,
|
|
365
|
+
`,Qt=i.styled.button`
|
|
366
366
|
display: inline-flex;
|
|
367
367
|
align-items: center;
|
|
368
368
|
justify-content: center;
|
|
369
369
|
padding: 0 4px;
|
|
370
370
|
border: none;
|
|
371
371
|
background: transparent;
|
|
372
|
-
color: ${
|
|
372
|
+
color: ${r.COLORS["iron-grey"]};
|
|
373
373
|
font-size: inherit;
|
|
374
374
|
cursor: pointer;
|
|
375
375
|
border-radius: 4px;
|
|
376
376
|
transition: background-color 0.15s ease;
|
|
377
377
|
|
|
378
378
|
&:hover {
|
|
379
|
-
background-color: ${
|
|
380
|
-
color: ${
|
|
379
|
+
background-color: ${r.COLORS.gray};
|
|
380
|
+
color: ${r.COLORS.black};
|
|
381
381
|
}
|
|
382
|
-
`,
|
|
382
|
+
`,se=C.newClassNameGetter("breadcrumbs"),Jt=()=>n.jsx("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:n.jsx("path",{d:"m9 18 6-6-6-6"})}),eo=({children:e,className:o,classnames:t,disabled:l=!1,itemsAfterCollapse:s=1,itemsBeforeCollapse:d=1,maxItems:x,ref:c,separator:p,size:g="md",variant:f="light",...h})=>{const y=a.Children.toArray(e).filter(R=>a.isValidElement(R)),u=y.length,S=x!==void 0&&u>x,b=R=>n.jsx(Zt,{className:se("separator",t==null?void 0:t.separator),$size:g,children:p||n.jsx(Jt,{})},R),$=(R,k,N)=>{const{current:I,disabled:L,href:m,startContent:v,endContent:j}=R.props,O=I||N,T=l||L&&!O;return n.jsxs(Ae,{$size:g,$current:O,$disabled:!!T,children:[n.jsxs(Vt,{as:m&&!O?"a":"span",href:m&&!O?m:void 0,$current:O,$disabled:!!T,children:[v,R.props.children,j]}),!N&&b(`sep-${k}`)]},k)},w=()=>{if(S){const R=y.slice(0,d),k=y.slice(u-s);return n.jsxs(n.Fragment,{children:[R.map((N,I)=>$(N,I,!1)),n.jsxs(Ae,{$size:g,$current:!1,$disabled:!1,children:[n.jsx(Qt,{className:se("ellipsis",t==null?void 0:t.ellipsis),"aria-label":"Show more",children:"..."}),b("sep-ellipsis")]}),k.map((N,I)=>{const L=u-s+I;return $(N,L,L===u-1)})]})}return y.map((R,k)=>$(R,k,k===u-1))};return n.jsx(Kt,{...h,ref:c,className:se("container",o),$variant:f,$size:g,"aria-label":"Breadcrumbs",children:n.jsx(qt,{className:se("list",t==null?void 0:t.list),$size:g,children:w()})})},Pe={none:"none",sm:`0 1px 2px ${r.alpha(r.COLORS.black,5)}`,md:`0 4px 14px ${r.alpha(r.COLORS.black,10)}`,lg:`0 10px 30px ${r.alpha(r.COLORS.black,15)}`},to={none:"0",sm:"8px",md:"12px",lg:"16px"},oo=i.styled.div`
|
|
383
383
|
position: relative;
|
|
384
384
|
display: flex;
|
|
385
385
|
flex-direction: column;
|
|
386
386
|
overflow: hidden;
|
|
387
|
-
background-color: ${({$blurred:e})=>e?
|
|
388
|
-
border-radius: ${({$radius:e})=>
|
|
389
|
-
border: ${({$border:e})=>e?`1px solid ${
|
|
390
|
-
box-shadow: ${({$shadow:e})=>
|
|
387
|
+
background-color: ${({$blurred:e})=>e?r.alpha(r.COLORS.white,70):r.COLORS.white};
|
|
388
|
+
border-radius: ${({$radius:e})=>to[e]};
|
|
389
|
+
border: ${({$border:e})=>e?`1px solid ${r.alpha(r.COLORS["iron-grey"],15)}`:"none"};
|
|
390
|
+
box-shadow: ${({$shadow:e})=>Pe[e]};
|
|
391
391
|
width: ${({$fullWidth:e})=>e?"100%":"auto"};
|
|
392
392
|
opacity: ${({$disabled:e})=>e?.5:1};
|
|
393
393
|
pointer-events: ${({$disabled:e})=>e?"none":"auto"};
|
|
@@ -401,9 +401,9 @@
|
|
|
401
401
|
-webkit-backdrop-filter: blur(10px);
|
|
402
402
|
`}
|
|
403
403
|
|
|
404
|
-
${({$hoverable:e,$pressable:
|
|
404
|
+
${({$hoverable:e,$pressable:o})=>(e||o)&&`
|
|
405
405
|
&:hover {
|
|
406
|
-
box-shadow: ${
|
|
406
|
+
box-shadow: ${Pe.lg};
|
|
407
407
|
}
|
|
408
408
|
`}
|
|
409
409
|
|
|
@@ -414,19 +414,19 @@
|
|
|
414
414
|
transform: scale(0.98);
|
|
415
415
|
}
|
|
416
416
|
`}
|
|
417
|
-
|
|
417
|
+
`,ro=i.styled.div`
|
|
418
418
|
display: flex;
|
|
419
419
|
align-items: center;
|
|
420
420
|
gap: 12px;
|
|
421
421
|
padding: 16px 16px 0;
|
|
422
422
|
z-index: 1;
|
|
423
|
-
`,
|
|
423
|
+
`,no=i.styled.div`
|
|
424
424
|
display: flex;
|
|
425
425
|
flex-direction: column;
|
|
426
426
|
flex: 1;
|
|
427
427
|
padding: 12px 16px;
|
|
428
428
|
z-index: 1;
|
|
429
|
-
`,
|
|
429
|
+
`,io=i.styled.div`
|
|
430
430
|
display: flex;
|
|
431
431
|
align-items: center;
|
|
432
432
|
gap: 8px;
|
|
@@ -435,18 +435,18 @@
|
|
|
435
435
|
|
|
436
436
|
${({$blurred:e})=>e&&`
|
|
437
437
|
padding: 12px 16px;
|
|
438
|
-
background-color: ${
|
|
438
|
+
background-color: ${r.alpha(r.COLORS.white,60)};
|
|
439
439
|
backdrop-filter: blur(10px);
|
|
440
440
|
-webkit-backdrop-filter: blur(10px);
|
|
441
|
-
border-top: 1px solid ${
|
|
441
|
+
border-top: 1px solid ${r.alpha(r.COLORS["iron-grey"],15)};
|
|
442
442
|
`}
|
|
443
|
-
`,
|
|
443
|
+
`,lo=C.newClassNameGetter("card"),so=({blurred:e=!1,border:o=!1,children:t,className:l,disabled:s=!1,footerBlurred:d=!1,fullWidth:x=!1,hoverable:c=!1,pressable:p=!1,radius:g="lg",ref:f,shadow:h="md",...y})=>{const u=typeof h=="boolean"?h?"md":"none":h;return n.jsx(oo,{...y,ref:f,className:lo("container",l),$blurred:e,$border:o,$disabled:s,$footerBlurred:d,$fullWidth:x,$hoverable:c,$pressable:p,$radius:g,$shadow:u,tabIndex:p&&!s?0:void 0,role:p?"button":void 0,children:t})},ao=C.newClassNameGetter("card"),co=({children:e,className:o,ref:t,...l})=>n.jsx(no,{...l,ref:t,className:ao("body",o),children:e}),po=C.newClassNameGetter("card"),xo=({blurred:e=!1,children:o,className:t,ref:l,...s})=>n.jsx(io,{...s,ref:l,className:po("footer",t),$blurred:e,children:o}),uo=C.newClassNameGetter("card"),go=({children:e,className:o,ref:t,...l})=>n.jsx(ro,{...l,ref:t,className:uo("header",o),children:e}),fo="Confirm",ho="Cancel",yo=z.keyframes`
|
|
444
444
|
from { opacity: 0; }
|
|
445
445
|
to { opacity: 1; }
|
|
446
|
-
`,
|
|
446
|
+
`,bo=z.keyframes`
|
|
447
447
|
from { opacity: 1; }
|
|
448
448
|
to { opacity: 0; }
|
|
449
|
-
|
|
449
|
+
`,$o=z.keyframes`
|
|
450
450
|
from {
|
|
451
451
|
opacity: 0;
|
|
452
452
|
transform: translateX(-50%) translateY(100%);
|
|
@@ -455,7 +455,7 @@
|
|
|
455
455
|
opacity: 1;
|
|
456
456
|
transform: translateX(-50%) translateY(0);
|
|
457
457
|
}
|
|
458
|
-
`,
|
|
458
|
+
`,So=z.keyframes`
|
|
459
459
|
from {
|
|
460
460
|
opacity: 1;
|
|
461
461
|
transform: translateX(-50%) translateY(0);
|
|
@@ -464,14 +464,14 @@
|
|
|
464
464
|
opacity: 0;
|
|
465
465
|
transform: translateX(-50%) translateY(100%);
|
|
466
466
|
}
|
|
467
|
-
`,
|
|
467
|
+
`,Oo=i.styled.div`
|
|
468
468
|
position: fixed;
|
|
469
469
|
inset: 0;
|
|
470
|
-
z-index: ${
|
|
470
|
+
z-index: ${r.Z_INDEX.confirmation};
|
|
471
471
|
background-color: rgba(0, 0, 0, 0.15);
|
|
472
472
|
backdrop-filter: blur(2px);
|
|
473
|
-
animation: ${({$isExiting:e})=>e?
|
|
474
|
-
`,
|
|
473
|
+
animation: ${({$isExiting:e})=>e?bo:yo} 0.2s ease-out forwards;
|
|
474
|
+
`,Co=i.styled.div`
|
|
475
475
|
position: fixed;
|
|
476
476
|
bottom: 24px;
|
|
477
477
|
left: 50%;
|
|
@@ -479,139 +479,138 @@
|
|
|
479
479
|
align-items: center;
|
|
480
480
|
gap: 16px;
|
|
481
481
|
padding: 12px 16px;
|
|
482
|
-
background-color: ${
|
|
483
|
-
border: 1px dashed ${
|
|
482
|
+
background-color: ${r.COLORS.white};
|
|
483
|
+
border: 1px dashed ${r.COLORS.gray};
|
|
484
484
|
border-radius: 12px;
|
|
485
485
|
box-shadow:
|
|
486
486
|
0 4px 6px -1px rgba(0, 0, 0, 0.1),
|
|
487
487
|
0 2px 4px -2px rgba(0, 0, 0, 0.1);
|
|
488
|
-
animation: ${({$isExiting:e})=>e?
|
|
489
|
-
z-index: ${
|
|
490
|
-
`,
|
|
488
|
+
animation: ${({$isExiting:e})=>e?So:$o} 0.2s ease-out forwards;
|
|
489
|
+
z-index: ${r.Z_INDEX.confirmationBar};
|
|
490
|
+
`,wo=i.styled.p`
|
|
491
491
|
margin: 0;
|
|
492
492
|
font-size: 14px;
|
|
493
|
-
color: ${
|
|
493
|
+
color: ${r.COLORS.black};
|
|
494
494
|
white-space: nowrap;
|
|
495
|
-
`,
|
|
495
|
+
`,vo=i.styled.div`
|
|
496
496
|
display: flex;
|
|
497
497
|
align-items: center;
|
|
498
498
|
gap: 8px;
|
|
499
|
-
`,
|
|
499
|
+
`,mo=({confirmation:e,onDone:o})=>{const[t,l]=a.useState(!1),[s,d]=a.useState(!1),{message:x,onConfirm:c,onCancel:p,options:g}=e,f=g.confirmLabel||fo,h=g.cancelLabel||ho,y=a.useCallback(b=>{l(!0),setTimeout(()=>{b==null||b(),o()},200)},[o]),u=a.useCallback(async()=>{const b=c();if(b instanceof Promise){d(!0);try{await b}finally{d(!1)}}y()},[y,c]),S=a.useCallback(()=>{s||y(p)},[y,s,p]);return a.useEffect(()=>{const b=$=>{$.key==="Escape"&&!s&&S()};return document.addEventListener("keydown",b),()=>document.removeEventListener("keydown",b)},[S,s]),n.jsxs(n.Fragment,{children:[n.jsx(Oo,{$isExiting:t,onClick:S}),n.jsxs(Co,{$isExiting:t,children:[n.jsx(wo,{children:x}),n.jsxs(vo,{children:[n.jsx(i.Button,{variant:"system",size:"compact",onClick:S,disabled:s,children:h}),n.jsx(i.Button,{variant:"danger",size:"compact",onClick:u,loading:s,children:f})]})]})]})},tt=a.createContext(null),ko=()=>{},Ro=({children:e})=>{const[o,t]=a.useState(null),l=a.useCallback((d,x,c,p)=>{t({open:!0,message:d,onConfirm:x,onCancel:c||ko,options:p||{}})},[]),s=a.useCallback(()=>{t(null)},[]);return n.jsxs(tt.Provider,{value:{show:l,hide:s},children:[e,o&&n.jsx(mo,{confirmation:o,onDone:s})]})},Lo=()=>{const e=a.useContext(tt);if(!e)throw new Error("useConfirmation must be used within ConfirmationProvider");return e},ee={sm:`${r.BREAKPOINTS.sm}px`,md:`${r.BREAKPOINTS.md}px`,lg:`${r.BREAKPOINTS.lg}px`,xl:`${r.BREAKPOINTS.xl}px`,"2xl":`${r.BREAKPOINTS["2xl"]}px`},jo=i.styled.div`
|
|
500
500
|
width: 100%;
|
|
501
501
|
|
|
502
|
-
${
|
|
503
|
-
max-width: ${
|
|
502
|
+
${F.mediaUp("sm")} {
|
|
503
|
+
max-width: ${ee.sm};
|
|
504
504
|
}
|
|
505
505
|
|
|
506
|
-
${
|
|
507
|
-
max-width: ${
|
|
506
|
+
${F.mediaUp("md")} {
|
|
507
|
+
max-width: ${ee.md};
|
|
508
508
|
}
|
|
509
509
|
|
|
510
|
-
${
|
|
511
|
-
max-width: ${
|
|
510
|
+
${F.mediaUp("lg")} {
|
|
511
|
+
max-width: ${ee.lg};
|
|
512
512
|
}
|
|
513
513
|
|
|
514
|
-
${
|
|
515
|
-
max-width: ${
|
|
514
|
+
${F.mediaUp("xl")} {
|
|
515
|
+
max-width: ${ee.xl};
|
|
516
516
|
}
|
|
517
517
|
|
|
518
|
-
${
|
|
519
|
-
max-width: ${
|
|
518
|
+
${F.mediaUp("2xl")} {
|
|
519
|
+
max-width: ${ee["2xl"]};
|
|
520
520
|
}
|
|
521
|
-
`,
|
|
521
|
+
`,No=C.newClassNameGetter("container"),Eo=({children:e,className:o,ref:t,...l})=>n.jsx(jo,{...l,ref:t,className:No("container",o),children:e}),Be=(e,o)=>new Intl.DateTimeFormat(o,{year:"numeric",month:"long"}).format(e),Io=i.styled.span`
|
|
522
522
|
display: inline-flex;
|
|
523
523
|
align-items: baseline;
|
|
524
524
|
gap: 5px;
|
|
525
525
|
font-size: 13px;
|
|
526
526
|
font-weight: 500;
|
|
527
|
-
color: ${
|
|
528
|
-
`,
|
|
527
|
+
color: ${r.COLORS["iron-grey"]};
|
|
528
|
+
`,To=i.styled.span`
|
|
529
529
|
font-weight: 500;
|
|
530
|
-
`,
|
|
530
|
+
`,zo=i.styled.span``,te=C.newClassNameGetter("date-range"),Ao=({className:e,classnames:o,from:t,locale:l="en",presentLabel:s="Present Time",ref:d,to:x,...c})=>n.jsxs(Io,{...c,ref:d,className:te("container",e),children:[n.jsx(To,{className:te("hash",o==null?void 0:o.hash),children:"#"}),n.jsx("span",{className:te("from",o==null?void 0:o.from),children:Be(t,l)}),n.jsx(zo,{className:te("separator",o==null?void 0:o.separator),children:"—"}),n.jsx("span",{className:te("to",o==null?void 0:o.to),children:x?Be(x,l):s})]}),Po=i.styled.div`
|
|
531
531
|
display: flex;
|
|
532
532
|
flex-direction: row;
|
|
533
533
|
align-items: center;
|
|
534
534
|
gap: 8px;
|
|
535
535
|
margin-top: ${e=>e.$spacing}px;
|
|
536
536
|
margin-bottom: ${e=>e.$spacing}px;
|
|
537
|
-
`,
|
|
537
|
+
`,De=i.styled.div`
|
|
538
538
|
flex: 1;
|
|
539
539
|
height: 1px;
|
|
540
|
-
background-color: ${
|
|
541
|
-
`,
|
|
540
|
+
background-color: ${r.COLORS.gray};
|
|
541
|
+
`,Bo=i.styled.span`
|
|
542
542
|
font-size: 12px;
|
|
543
|
-
color: ${
|
|
543
|
+
color: ${r.COLORS["iron-grey"]};
|
|
544
544
|
white-space: nowrap;
|
|
545
|
-
`,
|
|
545
|
+
`,ae=C.newClassNameGetter("divider"),Do=({children:e,className:o,classnames:t,ref:l,spacing:s=8,...d})=>n.jsxs(Po,{...d,ref:l,className:ae("container",o),$spacing:s,children:[n.jsx(De,{className:ae("line",t==null?void 0:t.line)}),e&&n.jsxs(n.Fragment,{children:[n.jsx(Bo,{className:ae("label",t==null?void 0:t.label),children:e}),n.jsx(De,{className:ae("line",t==null?void 0:t.line)})]})]}),Mo={left:r.KEYFRAMES.slideInLeft,right:r.KEYFRAMES.slideInRight,top:r.KEYFRAMES.slideInTop,bottom:r.KEYFRAMES.slideInBottom},_o=(e,o)=>{switch(e){case"left":return`
|
|
546
546
|
top: 0;
|
|
547
547
|
left: 0;
|
|
548
548
|
height: 100%;
|
|
549
|
-
width: ${
|
|
549
|
+
width: ${o};
|
|
550
550
|
`;case"right":return`
|
|
551
551
|
top: 0;
|
|
552
552
|
right: 0;
|
|
553
553
|
height: 100%;
|
|
554
|
-
width: ${
|
|
554
|
+
width: ${o};
|
|
555
555
|
`;case"top":return`
|
|
556
556
|
top: 0;
|
|
557
557
|
left: 0;
|
|
558
558
|
width: 100%;
|
|
559
|
-
height: ${
|
|
559
|
+
height: ${o};
|
|
560
560
|
`;case"bottom":return`
|
|
561
561
|
bottom: 0;
|
|
562
562
|
left: 0;
|
|
563
563
|
width: 100%;
|
|
564
|
-
height: ${
|
|
565
|
-
`}},
|
|
564
|
+
height: ${o};
|
|
565
|
+
`}},Fo=i.styled.div`
|
|
566
566
|
position: fixed;
|
|
567
|
-
z-index: ${
|
|
568
|
-
background-color: ${
|
|
569
|
-
box-shadow: 0 4px 24px ${
|
|
570
|
-
${e=>
|
|
571
|
-
animation: ${e=>
|
|
572
|
-
`,
|
|
567
|
+
z-index: ${r.Z_INDEX.modal};
|
|
568
|
+
background-color: ${r.COLORS.white};
|
|
569
|
+
box-shadow: 0 4px 24px ${r.alpha(r.COLORS.black,20)};
|
|
570
|
+
${e=>_o(e.$position,e.$size)}
|
|
571
|
+
animation: ${e=>Mo[e.$position]} ${e=>e.$animated?"0.05s":"0s"} ease-out forwards;
|
|
572
|
+
`,Go=C.newClassNameGetter("drawer"),Ho=({animated:e,children:o,className:t,open:l,position:s="right",ref:d,size:x="400px",...c})=>l?Ne.createPortal(n.jsx(Fo,{...c,ref:d,className:Go("container",t),$animated:!!e,$position:s,$size:x,children:o}),document.body):null,Uo=i.styled.div`
|
|
573
573
|
position: relative;
|
|
574
574
|
display: inline-block;
|
|
575
|
-
`,
|
|
575
|
+
`,Wo=i.styled.div`
|
|
576
576
|
cursor: pointer;
|
|
577
|
-
`,
|
|
577
|
+
`,ot=`
|
|
578
578
|
min-width: 160px;
|
|
579
|
-
|
|
580
|
-
|
|
581
|
-
border: 1px solid ${n.COLORS.gray};
|
|
579
|
+
background-color: ${r.COLORS.white};
|
|
580
|
+
border: 1px solid ${r.COLORS.gray};
|
|
582
581
|
border-radius: 8px;
|
|
583
582
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
|
|
584
|
-
`,
|
|
583
|
+
`,rt=(e,o)=>e?"translateY(0)":o==="bottom"?"translateY(-8px)":"translateY(8px)",Xo=i.styled.div`
|
|
585
584
|
position: absolute;
|
|
586
585
|
${({$position:e})=>e==="bottom"?"top: calc(100% + 4px);":"bottom: calc(100% + 4px);"}
|
|
587
586
|
${({$align:e})=>e==="left"?"left: 0;":"right: 0;"}
|
|
588
|
-
z-index: ${
|
|
589
|
-
${
|
|
587
|
+
z-index: ${r.Z_INDEX.dropdown};
|
|
588
|
+
${ot}
|
|
590
589
|
opacity: ${({$open:e})=>e?1:0};
|
|
591
590
|
visibility: ${({$open:e})=>e?"visible":"hidden"};
|
|
592
|
-
transform: ${({$open:e,$position:
|
|
591
|
+
transform: ${({$open:e,$position:o})=>rt(e,o)};
|
|
593
592
|
transition:
|
|
594
593
|
opacity 0.15s ease,
|
|
595
594
|
transform 0.15s ease,
|
|
596
595
|
visibility 0.15s;
|
|
597
|
-
`,
|
|
596
|
+
`,Yo=i.styled.div`
|
|
598
597
|
position: fixed;
|
|
599
|
-
z-index: ${
|
|
600
|
-
${
|
|
598
|
+
z-index: ${r.Z_INDEX.portalDropdown};
|
|
599
|
+
${ot}
|
|
601
600
|
opacity: ${({$open:e})=>e?1:0};
|
|
602
601
|
visibility: ${({$open:e})=>e?"visible":"hidden"};
|
|
603
|
-
transform: ${({$open:e,$position:
|
|
602
|
+
transform: ${({$open:e,$position:o})=>rt(e,o)};
|
|
604
603
|
transition:
|
|
605
604
|
opacity 0.15s ease,
|
|
606
605
|
transform 0.15s ease,
|
|
607
606
|
visibility 0.15s;
|
|
608
|
-
`,
|
|
607
|
+
`,ce=C.newClassNameGetter("dropdown"),pe=4,Ko=100,qo=({align:e="left",autoClose:o=!0,children:t,className:l,classnames:s,onClose:d,onOpen:x,open:c,portalRenderNode:p,ref:g,trigger:f,...h})=>{const[y,u]=a.useState(!1),[S,b]=a.useState({top:0,left:0}),[$,w]=a.useState("bottom"),R=a.useRef(null),k=a.useRef(null),N=a.useRef(null),I=c!==void 0,L=I?c:y,m=a.useCallback(()=>{var B,D;if(!k.current)return;const E=k.current.getBoundingClientRect(),A=((B=N.current)==null?void 0:B.offsetHeight)??Ko,M=((D=N.current)==null?void 0:D.offsetWidth)??160,P=window.innerHeight-E.bottom-pe,G=E.top-pe,H=P<A&&G>P?"top":"bottom";if(w(H),p){let U;e==="left"?U=E.left:U=E.right-M;const ut=H==="bottom"?E.bottom+pe:E.top-A-pe;b({top:ut,left:U})}},[e,p]),v=a.useCallback(()=>{I?L?d==null||d():x==null||x():u(E=>{const A=!E;return A?x==null||x():d==null||d(),A})},[I,L,d,x]),j=a.useCallback(()=>{I||u(!1),d==null||d()},[I,d]),O=a.useCallback(()=>{o&&j()},[o,j]);a.useLayoutEffect(()=>{L&&m()},[L,m]),a.useEffect(()=>{const E=G=>{const H=G.target,B=R.current&&!R.current.contains(H),D=N.current&&!N.current.contains(H);p?B&&D&&j():B&&j()},A=G=>{G.key==="Escape"&&j()},M=()=>{L&&p&&m()},P=()=>{L&&p&&m()};return L&&(document.addEventListener("mousedown",E),document.addEventListener("keydown",A),p&&(window.addEventListener("scroll",M,!0),window.addEventListener("resize",P))),()=>{document.removeEventListener("mousedown",E),document.removeEventListener("keydown",A),window.removeEventListener("scroll",M,!0),window.removeEventListener("resize",P)}},[L,j,p,m]);const T=p?Ne.createPortal(n.jsx(Yo,{ref:N,$open:L,$position:$,className:ce("content",s==null?void 0:s.content),style:{top:S.top,left:S.left},onClick:O,children:t}),p):n.jsx(Xo,{ref:N,$align:e,$open:L,$position:$,className:ce("content",s==null?void 0:s.content),onClick:O,children:t});return n.jsxs(Uo,{...h,ref:g??R,className:ce("container",l),children:[n.jsx(Wo,{ref:k,onClick:v,className:ce("trigger",s==null?void 0:s.trigger),children:a.cloneElement(f)}),T]})},Vo=i.styled.div`
|
|
609
608
|
display: flex;
|
|
610
609
|
flex-direction: column;
|
|
611
610
|
align-items: center;
|
|
612
611
|
text-align: center;
|
|
613
612
|
padding: 40px 24px;
|
|
614
|
-
`,
|
|
613
|
+
`,Zo=i.styled.div`
|
|
615
614
|
position: relative;
|
|
616
615
|
display: flex;
|
|
617
616
|
align-items: center;
|
|
@@ -619,7 +618,7 @@
|
|
|
619
618
|
width: 200px;
|
|
620
619
|
height: 200px;
|
|
621
620
|
margin-bottom: 16px;
|
|
622
|
-
`,
|
|
621
|
+
`,Qo=i.styled.div`
|
|
623
622
|
position: absolute;
|
|
624
623
|
inset: 0;
|
|
625
624
|
|
|
@@ -628,7 +627,7 @@
|
|
|
628
627
|
content: '';
|
|
629
628
|
position: absolute;
|
|
630
629
|
border-radius: 50%;
|
|
631
|
-
border: 1px solid ${
|
|
630
|
+
border: 1px solid ${r.COLORS.gray};
|
|
632
631
|
}
|
|
633
632
|
|
|
634
633
|
&::before {
|
|
@@ -640,7 +639,7 @@
|
|
|
640
639
|
inset: 8px;
|
|
641
640
|
opacity: 0.5;
|
|
642
641
|
}
|
|
643
|
-
`,
|
|
642
|
+
`,Jo=i.styled.div`
|
|
644
643
|
position: absolute;
|
|
645
644
|
inset: 0;
|
|
646
645
|
|
|
@@ -649,7 +648,7 @@
|
|
|
649
648
|
content: '';
|
|
650
649
|
position: absolute;
|
|
651
650
|
border-radius: 50%;
|
|
652
|
-
border: 1px solid ${
|
|
651
|
+
border: 1px solid ${r.COLORS.gray};
|
|
653
652
|
}
|
|
654
653
|
|
|
655
654
|
&::before {
|
|
@@ -660,7 +659,7 @@
|
|
|
660
659
|
&::after {
|
|
661
660
|
inset: 52px;
|
|
662
661
|
}
|
|
663
|
-
`,
|
|
662
|
+
`,er=i.styled.div`
|
|
664
663
|
position: relative;
|
|
665
664
|
z-index: 1;
|
|
666
665
|
display: flex;
|
|
@@ -669,30 +668,30 @@
|
|
|
669
668
|
width: 48px;
|
|
670
669
|
height: 48px;
|
|
671
670
|
border-radius: 10px;
|
|
672
|
-
border: 1px solid ${
|
|
673
|
-
background-color: ${
|
|
674
|
-
color: ${
|
|
671
|
+
border: 1px solid ${r.COLORS.gray};
|
|
672
|
+
background-color: ${r.COLORS.white};
|
|
673
|
+
color: ${r.COLORS["iron-grey"]};
|
|
675
674
|
box-shadow:
|
|
676
675
|
0 1px 2px rgba(0, 0, 0, 0.05),
|
|
677
676
|
0 1px 3px rgba(0, 0, 0, 0.1);
|
|
678
|
-
`,
|
|
677
|
+
`,tr=i.styled.h3`
|
|
679
678
|
margin: 0 0 4px;
|
|
680
679
|
font-size: 16px;
|
|
681
680
|
font-weight: 600;
|
|
682
|
-
color: ${
|
|
681
|
+
color: ${r.COLORS.black};
|
|
683
682
|
line-height: 1.4;
|
|
684
|
-
`,
|
|
683
|
+
`,or=i.styled.p`
|
|
685
684
|
margin: 0;
|
|
686
685
|
font-size: 14px;
|
|
687
|
-
color: ${
|
|
686
|
+
color: ${r.COLORS["iron-grey"]};
|
|
688
687
|
line-height: 1.5;
|
|
689
688
|
max-width: 360px;
|
|
690
|
-
`,
|
|
689
|
+
`,rr=i.styled.div`
|
|
691
690
|
display: flex;
|
|
692
691
|
align-items: center;
|
|
693
692
|
gap: 12px;
|
|
694
693
|
margin-top: 20px;
|
|
695
|
-
`,
|
|
694
|
+
`,oe=C.newClassNameGetter("empty-state"),nr=({actions:e,className:o,classnames:t,description:l,icon:s,ref:d,title:x,...c})=>n.jsxs(Vo,{...c,ref:d,className:oe("container",o),children:[s&&n.jsxs(Zo,{className:oe("icon",t==null?void 0:t.icon),children:[n.jsx(Jo,{}),n.jsx(Qo,{}),n.jsx(er,{children:s})]}),n.jsx(tr,{className:oe("title",t==null?void 0:t.title),children:x}),l&&n.jsx(or,{className:oe("description",t==null?void 0:t.description),children:l}),e&&n.jsx(rr,{className:oe("actions",t==null?void 0:t.actions),children:e})]}),ir=i.styled.div`
|
|
696
695
|
display: grid;
|
|
697
696
|
grid-template-rows: auto 1fr auto;
|
|
698
697
|
grid-auto-flow: column;
|
|
@@ -717,19 +716,19 @@
|
|
|
717
716
|
> * > :not([class*='field-label']):not([class*='field-message']) {
|
|
718
717
|
grid-row: 2;
|
|
719
718
|
}
|
|
720
|
-
`,
|
|
719
|
+
`,lr=C.newClassNameGetter("field-row"),dr=({className:e,gap:o=16,ref:t,...l})=>n.jsx(ir,{...l,ref:t,$gap:o,className:lr("container",e)}),nt=e=>{if(e===0)return"0 B";const o=["B","KB","MB","GB"],t=Math.floor(Math.log(e)/Math.log(1024)),l=e/Math.pow(1024,t);return`${l%1===0?l:l.toFixed(1)} ${o[t]}`},Me=(e,o)=>o.split(",").map(l=>l.trim()).some(l=>l.startsWith(".")?e.name.toLowerCase().endsWith(l.toLowerCase()):l.endsWith("/*")?e.type.startsWith(l.replace("/*","/")):e.type===l),sr=i.styled.div`
|
|
721
720
|
flex-shrink: 0;
|
|
722
721
|
display: flex;
|
|
723
722
|
flex-direction: column;
|
|
724
723
|
gap: 16px;
|
|
725
|
-
`,
|
|
724
|
+
`,ar=i.styled.div`
|
|
726
725
|
display: flex;
|
|
727
726
|
flex-direction: column;
|
|
728
727
|
align-items: center;
|
|
729
728
|
justify-content: center;
|
|
730
729
|
gap: 8px;
|
|
731
730
|
padding: 24px;
|
|
732
|
-
border: 1.5px dashed ${({$dragOver:e})=>e?
|
|
731
|
+
border: 1.5px dashed ${({$dragOver:e})=>e?r.COLORS.black:r.COLORS.gray};
|
|
733
732
|
border-radius: 12px;
|
|
734
733
|
background-color: ${({$dragOver:e})=>e?"#f9fafb":"transparent"};
|
|
735
734
|
cursor: ${({$disabled:e})=>e?"not-allowed":"pointer"};
|
|
@@ -738,58 +737,58 @@
|
|
|
738
737
|
background-color 0.15s ease;
|
|
739
738
|
opacity: ${({$disabled:e})=>e?.5:1};
|
|
740
739
|
|
|
741
|
-
${({$disabled:e,$dragOver:
|
|
740
|
+
${({$disabled:e,$dragOver:o})=>!e&&!o&&`
|
|
742
741
|
&:hover {
|
|
743
|
-
border-color: ${
|
|
742
|
+
border-color: ${r.COLORS["iron-grey"]};
|
|
744
743
|
background-color: #f9fafb;
|
|
745
744
|
}
|
|
746
745
|
`}
|
|
747
|
-
`,
|
|
746
|
+
`,cr=i.styled.div`
|
|
748
747
|
display: flex;
|
|
749
748
|
align-items: center;
|
|
750
749
|
justify-content: center;
|
|
751
750
|
width: 40px;
|
|
752
751
|
height: 40px;
|
|
753
752
|
border-radius: 8px;
|
|
754
|
-
border: 1px solid ${
|
|
755
|
-
color: ${
|
|
753
|
+
border: 1px solid ${r.COLORS.gray};
|
|
754
|
+
color: ${r.COLORS["iron-grey"]};
|
|
756
755
|
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
|
|
757
756
|
|
|
758
757
|
& svg {
|
|
759
758
|
width: 20px;
|
|
760
759
|
height: 20px;
|
|
761
760
|
}
|
|
762
|
-
`,
|
|
761
|
+
`,pr=i.styled.div`
|
|
763
762
|
display: flex;
|
|
764
763
|
flex-direction: column;
|
|
765
764
|
align-items: center;
|
|
766
765
|
gap: 4px;
|
|
767
766
|
font-size: 14px;
|
|
768
|
-
color: ${
|
|
767
|
+
color: ${r.COLORS["iron-grey"]};
|
|
769
768
|
text-align: center;
|
|
770
|
-
`,
|
|
771
|
-
color: ${
|
|
769
|
+
`,xr=i.styled.span`
|
|
770
|
+
color: ${r.COLORS.black};
|
|
772
771
|
font-weight: 600;
|
|
773
772
|
cursor: pointer;
|
|
774
|
-
`,
|
|
773
|
+
`,ur=i.styled.div`
|
|
775
774
|
font-size: 12px;
|
|
776
|
-
color: ${
|
|
775
|
+
color: ${r.COLORS["iron-grey"]};
|
|
777
776
|
text-align: center;
|
|
778
|
-
`,
|
|
777
|
+
`,gr=i.styled.input`
|
|
779
778
|
display: none;
|
|
780
|
-
`;
|
|
779
|
+
`;i.styled.div`
|
|
781
780
|
display: flex;
|
|
782
781
|
flex-direction: column;
|
|
783
782
|
gap: 12px;
|
|
784
|
-
`;const
|
|
783
|
+
`;const fr={uploading:r.COLORS.gray,complete:r.COLORS.gray,failed:r.COLORS.red},hr=i.styled.div`
|
|
785
784
|
display: flex;
|
|
786
785
|
align-items: flex-start;
|
|
787
786
|
gap: 12px;
|
|
788
787
|
padding: 14px;
|
|
789
|
-
border: 1px solid ${({$status:e})=>
|
|
788
|
+
border: 1px solid ${({$status:e})=>fr[e]};
|
|
790
789
|
border-radius: 12px;
|
|
791
790
|
transition: border-color 0.15s ease;
|
|
792
|
-
`,
|
|
791
|
+
`,yr=i.styled.div`
|
|
793
792
|
display: flex;
|
|
794
793
|
align-items: center;
|
|
795
794
|
justify-content: center;
|
|
@@ -798,60 +797,60 @@
|
|
|
798
797
|
height: 36px;
|
|
799
798
|
border-radius: 8px;
|
|
800
799
|
background-color: ${({$status:e})=>e==="failed"?"#fef2f2":"#f9fafb"};
|
|
801
|
-
color: ${({$status:e})=>e==="failed"?
|
|
800
|
+
color: ${({$status:e})=>e==="failed"?r.COLORS.red:r.COLORS["iron-grey"]};
|
|
802
801
|
|
|
803
802
|
& svg {
|
|
804
803
|
width: 20px;
|
|
805
804
|
height: 20px;
|
|
806
805
|
}
|
|
807
|
-
`,
|
|
806
|
+
`,br=i.styled.div`
|
|
808
807
|
flex: 1;
|
|
809
808
|
min-width: 0;
|
|
810
809
|
display: flex;
|
|
811
810
|
flex-direction: column;
|
|
812
811
|
gap: 4px;
|
|
813
|
-
|
|
812
|
+
`,$r=i.styled.div`
|
|
814
813
|
display: flex;
|
|
815
814
|
align-items: flex-start;
|
|
816
815
|
justify-content: space-between;
|
|
817
816
|
gap: 8px;
|
|
818
|
-
`,
|
|
817
|
+
`,Sr=i.styled.div`
|
|
819
818
|
min-width: 0;
|
|
820
|
-
`,
|
|
819
|
+
`,Or=i.styled.div`
|
|
821
820
|
font-size: 14px;
|
|
822
821
|
font-weight: 500;
|
|
823
|
-
color: ${
|
|
822
|
+
color: ${r.COLORS.black};
|
|
824
823
|
white-space: nowrap;
|
|
825
824
|
overflow: hidden;
|
|
826
825
|
text-overflow: ellipsis;
|
|
827
|
-
`,
|
|
826
|
+
`,Cr=i.styled.div`
|
|
828
827
|
font-size: 14px;
|
|
829
|
-
color: ${
|
|
830
|
-
`,
|
|
828
|
+
color: ${r.COLORS["iron-grey"]};
|
|
829
|
+
`,wr=i.styled.div`
|
|
831
830
|
display: flex;
|
|
832
831
|
align-items: center;
|
|
833
832
|
gap: 12px;
|
|
834
833
|
margin-top: 2px;
|
|
835
|
-
`,
|
|
834
|
+
`,vr=i.styled.div`
|
|
836
835
|
flex: 1;
|
|
837
836
|
height: 8px;
|
|
838
837
|
border-radius: 4px;
|
|
839
|
-
background-color: ${
|
|
838
|
+
background-color: ${r.COLORS.gray};
|
|
840
839
|
overflow: hidden;
|
|
841
|
-
`,
|
|
840
|
+
`,mr=i.styled.div`
|
|
842
841
|
height: 100%;
|
|
843
842
|
width: ${({$value:e})=>Math.min(100,Math.max(0,e))}%;
|
|
844
843
|
border-radius: 4px;
|
|
845
|
-
background-color: ${({$status:e})=>e==="failed"?
|
|
844
|
+
background-color: ${({$status:e})=>e==="failed"?r.COLORS.red:r.COLORS.black};
|
|
846
845
|
transition: width 0.2s ease;
|
|
847
|
-
`,
|
|
846
|
+
`,kr=i.styled.span`
|
|
848
847
|
flex-shrink: 0;
|
|
849
848
|
font-size: 14px;
|
|
850
|
-
color: ${
|
|
849
|
+
color: ${r.COLORS.black};
|
|
851
850
|
font-weight: 500;
|
|
852
851
|
min-width: 36px;
|
|
853
852
|
text-align: right;
|
|
854
|
-
`,
|
|
853
|
+
`,Rr=i.styled.button`
|
|
855
854
|
display: flex;
|
|
856
855
|
align-items: center;
|
|
857
856
|
justify-content: center;
|
|
@@ -861,7 +860,7 @@
|
|
|
861
860
|
padding: 0;
|
|
862
861
|
border: none;
|
|
863
862
|
background: transparent;
|
|
864
|
-
color: ${
|
|
863
|
+
color: ${r.COLORS["iron-grey"]};
|
|
865
864
|
cursor: pointer;
|
|
866
865
|
border-radius: 4px;
|
|
867
866
|
transition: color 0.15s ease;
|
|
@@ -872,14 +871,14 @@
|
|
|
872
871
|
}
|
|
873
872
|
|
|
874
873
|
&:hover {
|
|
875
|
-
color: ${
|
|
874
|
+
color: ${r.COLORS.black};
|
|
876
875
|
}
|
|
877
|
-
`,
|
|
876
|
+
`,Lr=i.styled.button`
|
|
878
877
|
display: inline;
|
|
879
878
|
padding: 0;
|
|
880
879
|
border: none;
|
|
881
880
|
background: transparent;
|
|
882
|
-
color: ${
|
|
881
|
+
color: ${r.COLORS.red};
|
|
883
882
|
font-size: 14px;
|
|
884
883
|
font-weight: 500;
|
|
885
884
|
cursor: pointer;
|
|
@@ -888,374 +887,52 @@
|
|
|
888
887
|
&:hover {
|
|
889
888
|
text-decoration: underline;
|
|
890
889
|
}
|
|
891
|
-
`,
|
|
890
|
+
`,_e=i.styled.div`
|
|
892
891
|
display: flex;
|
|
893
892
|
align-items: center;
|
|
894
893
|
gap: 4px;
|
|
895
894
|
font-size: 14px;
|
|
896
|
-
color: ${
|
|
897
|
-
`,
|
|
895
|
+
color: ${r.COLORS["iron-grey"]};
|
|
896
|
+
`,jr=i.styled.span`
|
|
898
897
|
display: inline-flex;
|
|
899
|
-
color: ${
|
|
898
|
+
color: ${r.COLORS.green};
|
|
900
899
|
|
|
901
900
|
& svg {
|
|
902
901
|
width: 16px;
|
|
903
902
|
height: 16px;
|
|
904
903
|
}
|
|
905
|
-
|
|
904
|
+
`,xe=C.newClassNameGetter("file-upload"),Nr=()=>n.jsxs("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[n.jsx("path",{d:"M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"}),n.jsx("polyline",{points:"17 8 12 3 7 8"}),n.jsx("line",{x1:"12",x2:"12",y1:"3",y2:"15"})]}),Er=({accept:e,children:o,className:t,classnames:l,description:s,disabled:d=!1,hint:x,icon:c,maxSize:p,multiple:g=!1,onChange:f,onReject:h,ref:y,...u})=>{const S=a.useRef(null),[b,$]=a.useState(!1),w=a.useCallback(m=>{if(!m||m.length===0)return;const v=Array.from(m);if(e){const j=v.filter(O=>!Me(O,e));if(j.length>0){h==null||h(j,"type");const O=v.filter(T=>Me(T,e));if(O.length===0)return;f==null||f(O);return}}if(p){const j=v.filter(O=>O.size>p);if(j.length>0){h==null||h(j,"size");const O=v.filter(T=>T.size<=p);if(O.length===0)return;f==null||f(O);return}}f==null||f(v)},[e,p,f,h]),R=()=>{var m;d||(m=S.current)==null||m.click()},k=m=>{w(m.target.files),S.current&&(S.current.value="")},N=m=>{m.preventDefault(),m.stopPropagation(),d||$(!0)},I=m=>{m.preventDefault(),m.stopPropagation(),$(!1)},L=m=>{m.preventDefault(),m.stopPropagation(),$(!1),d||w(m.dataTransfer.files)};return n.jsxs(sr,{ref:y,className:t,...u,children:[n.jsxs(ar,{className:xe("dropzone",l==null?void 0:l.dropzone),$disabled:d,$dragOver:b,onClick:R,onDragOver:N,onDragLeave:I,onDrop:L,role:"button",tabIndex:d?-1:0,"aria-disabled":d,children:[n.jsx(cr,{className:xe("icon",l==null?void 0:l.icon),children:c||n.jsx(Nr,{})}),n.jsx(pr,{className:xe("text",l==null?void 0:l.text),children:s||n.jsxs("span",{children:[n.jsx(xr,{children:"Click to upload"})," or drag and drop"]})}),x&&n.jsx(ur,{className:xe("hint",l==null?void 0:l.hint),children:x})]}),n.jsx(gr,{ref:S,type:"file",accept:e,multiple:g,onChange:k,tabIndex:-1}),o]})},Y=C.newClassNameGetter("file-upload-item"),Ir=()=>n.jsxs("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[n.jsx("path",{d:"M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z"}),n.jsx("path",{d:"M14 2v4a2 2 0 0 0 2 2h4"})]}),Tr=()=>n.jsxs("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[n.jsx("path",{d:"M18 6 6 18"}),n.jsx("path",{d:"m6 6 12 12"})]}),zr=()=>n.jsx("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:n.jsx("path",{d:"M20 6 9 17l-5-5"})}),Ar=({name:e,size:o,status:t="uploading",progress:l=0,icon:s,onRemove:d,onRetry:x,className:c,classnames:p,ref:g})=>n.jsxs(hr,{ref:g,className:Y("item",c),$status:t,children:[n.jsx(yr,{className:Y("icon",p==null?void 0:p.icon),$status:t,children:s||n.jsx(Ir,{})}),n.jsxs(br,{children:[n.jsxs($r,{children:[n.jsxs(Sr,{className:Y("info",p==null?void 0:p.info),children:[n.jsx(Or,{className:Y("name",p==null?void 0:p.name),children:e}),n.jsx(Cr,{className:Y("size",p==null?void 0:p.size),children:nt(o)})]}),d&&n.jsx(Rr,{className:Y("action",p==null?void 0:p.action),onClick:d,"aria-label":"Remove file",type:"button",children:n.jsx(Tr,{})})]}),t==="uploading"&&n.jsxs(wr,{className:Y("progress",p==null?void 0:p.progress),children:[n.jsx(vr,{children:n.jsx(mr,{$value:l,$status:t})}),n.jsxs(kr,{children:[l,"%"]})]}),t==="complete"&&n.jsxs(_e,{children:[n.jsx(jr,{children:n.jsx(zr,{})}),"Complete"]}),t==="failed"&&n.jsxs(_e,{children:["Upload failed."," ",x&&n.jsx(Lr,{onClick:x,type:"button",children:"Try again"})]})]})]}),it=`
|
|
906
905
|
display: inline-flex;
|
|
907
906
|
font-size: 14px;
|
|
908
907
|
gap: 3px;
|
|
909
|
-
color: ${
|
|
908
|
+
color: ${r.COLORS["iron-grey"]};
|
|
910
909
|
transition: color 0.15s ease;
|
|
911
910
|
text-decoration: none;
|
|
912
|
-
`,
|
|
911
|
+
`,lt=`
|
|
913
912
|
cursor: pointer;
|
|
914
913
|
&:hover {
|
|
915
|
-
color: ${
|
|
914
|
+
color: ${r.COLORS["steel-blue"]};
|
|
916
915
|
}
|
|
917
|
-
`,
|
|
918
|
-
${
|
|
916
|
+
`,Pr=i.styled.span`
|
|
917
|
+
${it}
|
|
919
918
|
cursor: ${({$clickable:e})=>e?"pointer":"default"};
|
|
920
|
-
${({$clickable:e})=>e&&
|
|
921
|
-
`,
|
|
922
|
-
${
|
|
923
|
-
${
|
|
924
|
-
`,
|
|
919
|
+
${({$clickable:e})=>e&<}
|
|
920
|
+
`,Br=i.styled.a`
|
|
921
|
+
${it}
|
|
922
|
+
${lt}
|
|
923
|
+
`,Dr=i.styled.span``,Mr=i.styled.span``,ue=C.newClassNameGetter("hashtag"),_r=({children:e,className:o,classnames:t,href:l,onClick:s,ref:d,...x})=>{const c=n.jsxs(n.Fragment,{children:[n.jsx(Dr,{className:ue("hash",t==null?void 0:t.hash),children:"#"}),n.jsx(Mr,{className:ue("label",t==null?void 0:t.label),children:e})]});if(l)return n.jsx(Br,{ref:d,href:l,className:ue("container",o),onClick:s,children:c});const p=!!s;return n.jsx(Pr,{...x,ref:d,className:ue("container",o),$clickable:p,onClick:s,role:p?"button":void 0,tabIndex:p?0:void 0,children:c})},Fe={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}},Fr=i.styled.h1`
|
|
925
924
|
margin: 0;
|
|
926
925
|
font-weight: 700;
|
|
927
|
-
color: ${
|
|
928
|
-
font-size: ${({$level:e})=>
|
|
929
|
-
line-height: ${({$level:e})=>
|
|
930
|
-
`,
|
|
931
|
-
display: flex;
|
|
932
|
-
flex-direction: column;
|
|
933
|
-
gap: 12px;
|
|
934
|
-
`,an=d.styled.div`
|
|
935
|
-
width: ${({$size:e})=>e}px;
|
|
936
|
-
height: ${({$size:e})=>e}px;
|
|
937
|
-
border-radius: 8px;
|
|
938
|
-
border: 1px dashed ${n.COLORS.gray};
|
|
939
|
-
overflow: hidden;
|
|
940
|
-
display: flex;
|
|
941
|
-
align-items: center;
|
|
942
|
-
justify-content: center;
|
|
943
|
-
background-color: ${n.COLORS.white};
|
|
944
|
-
|
|
945
|
-
img {
|
|
946
|
-
width: 100%;
|
|
947
|
-
height: 100%;
|
|
948
|
-
object-fit: cover;
|
|
949
|
-
}
|
|
950
|
-
`,dn=d.styled.span`
|
|
951
|
-
font-size: 12px;
|
|
952
|
-
color: ${n.COLORS["iron-grey"]};
|
|
953
|
-
`,sn=e=>`
|
|
954
|
-
.${e} {
|
|
955
|
-
padding: 7px 16px;
|
|
956
|
-
font-size: 14px;
|
|
957
|
-
outline: 0;
|
|
958
|
-
border: 0;
|
|
959
|
-
background-color: #2F7FEF;
|
|
960
|
-
color: #FFFFFF;
|
|
961
|
-
border-radius: 20px;
|
|
962
|
-
user-select: none;
|
|
963
|
-
cursor: pointer;
|
|
964
|
-
-moz-user-select: none;
|
|
965
|
-
-webkit-user-select: none;
|
|
966
|
-
}
|
|
967
|
-
|
|
968
|
-
.${e}:active {
|
|
969
|
-
transform: translate(0, 1px);
|
|
970
|
-
}
|
|
971
|
-
`,cn=e=>`
|
|
972
|
-
.${e} {
|
|
973
|
-
display: flex;
|
|
974
|
-
flex: 1 1 auto;
|
|
975
|
-
background: #33393F;
|
|
976
|
-
overflow: hidden;
|
|
977
|
-
align-items: center;
|
|
978
|
-
justify-content: center;
|
|
979
|
-
position: relative;
|
|
980
|
-
width: 500px;
|
|
981
|
-
height: 500px;
|
|
982
|
-
max-width: 100%;
|
|
983
|
-
max-height: 60vh;
|
|
984
|
-
min-height: 250px;
|
|
985
|
-
}
|
|
986
|
-
|
|
987
|
-
@media (max-width: 540px) {
|
|
988
|
-
.${e} {
|
|
989
|
-
width: 100%;
|
|
990
|
-
height: auto;
|
|
991
|
-
aspect-ratio: 1;
|
|
992
|
-
max-height: 70vh;
|
|
993
|
-
}
|
|
994
|
-
}
|
|
995
|
-
`,pn=e=>`
|
|
996
|
-
.${e} {
|
|
997
|
-
padding: 7px 16px;
|
|
998
|
-
font-size: 14px;
|
|
999
|
-
outline: 0;
|
|
1000
|
-
border: 0;
|
|
1001
|
-
background-color: #E8EFF7;
|
|
1002
|
-
color: #768BA7;
|
|
1003
|
-
border-radius: 20px;
|
|
1004
|
-
cursor: pointer;
|
|
1005
|
-
user-select: none;
|
|
1006
|
-
-moz-user-select: none;
|
|
1007
|
-
-webkit-user-select: none;
|
|
1008
|
-
}
|
|
1009
|
-
|
|
1010
|
-
.${e}:active {
|
|
1011
|
-
transform: translate(0, 1px);
|
|
1012
|
-
}
|
|
1013
|
-
`,un=e=>`
|
|
1014
|
-
.${e} {
|
|
1015
|
-
display: flex;
|
|
1016
|
-
flex-direction: column;
|
|
1017
|
-
background-color: #FFFFFF;
|
|
1018
|
-
border-radius: 6px;
|
|
1019
|
-
box-shadow: 0 4px 16px rgba(77, 96, 124, 0.2);
|
|
1020
|
-
max-width: 100%;
|
|
1021
|
-
max-height: 100%;
|
|
1022
|
-
overflow: hidden;
|
|
1023
|
-
}
|
|
1024
|
-
|
|
1025
|
-
@media (max-width: 540px) {
|
|
1026
|
-
.${e} {
|
|
1027
|
-
width: 100%;
|
|
1028
|
-
border-radius: 8px;
|
|
1029
|
-
}
|
|
1030
|
-
}
|
|
1031
|
-
`,gn=e=>`
|
|
1032
|
-
.${e} {
|
|
1033
|
-
display: flex;
|
|
1034
|
-
justify-content: flex-end;
|
|
1035
|
-
gap: 10px;
|
|
1036
|
-
align-items: center;
|
|
1037
|
-
height: 60px;
|
|
1038
|
-
flex: 0 0 auto;
|
|
1039
|
-
padding: 0 20px;
|
|
1040
|
-
border-top: 1px solid #EEE;
|
|
1041
|
-
}
|
|
1042
|
-
|
|
1043
|
-
@media (max-width: 540px) {
|
|
1044
|
-
.${e} {
|
|
1045
|
-
height: 56px;
|
|
1046
|
-
padding: 0 12px;
|
|
1047
|
-
gap: 8px;
|
|
1048
|
-
}
|
|
1049
|
-
}
|
|
1050
|
-
`,xn=e=>`
|
|
1051
|
-
.${e} {
|
|
1052
|
-
display: flex;
|
|
1053
|
-
justify-content: flex-start;
|
|
1054
|
-
gap: 10px;
|
|
1055
|
-
align-items: center;
|
|
1056
|
-
height: 60px;
|
|
1057
|
-
flex: 0 0 auto;
|
|
1058
|
-
padding: 0 20px;
|
|
1059
|
-
border-top-left-radius: 6px;
|
|
1060
|
-
border-top-right-radius: 6px;
|
|
1061
|
-
border-bottom: 1px solid #EEE;
|
|
1062
|
-
overflow: hidden;
|
|
1063
|
-
}
|
|
1064
|
-
|
|
1065
|
-
@media (max-width: 540px) {
|
|
1066
|
-
.${e} {
|
|
1067
|
-
height: 48px;
|
|
1068
|
-
padding: 0 12px;
|
|
1069
|
-
font-size: 14px;
|
|
1070
|
-
}
|
|
1071
|
-
}
|
|
1072
|
-
`,hn=e=>`
|
|
1073
|
-
.${e} {
|
|
1074
|
-
display: block;
|
|
1075
|
-
z-index: 101;
|
|
1076
|
-
outline: 1px dashed #aaa;
|
|
1077
|
-
background-color: transparent;
|
|
1078
|
-
cursor: move;
|
|
1079
|
-
-webkit-user-select: none;
|
|
1080
|
-
-moz-user-select: none;
|
|
1081
|
-
-ms-user-select: none;
|
|
1082
|
-
user-select: none;
|
|
1083
|
-
left: 0;
|
|
1084
|
-
top: 0;
|
|
1085
|
-
bottom: 0;
|
|
1086
|
-
right: 0;
|
|
1087
|
-
position: absolute;
|
|
1088
|
-
touch-action: none;
|
|
1089
|
-
}
|
|
1090
|
-
`,fn=e=>`
|
|
1091
|
-
.${e} {
|
|
1092
|
-
position: absolute;
|
|
1093
|
-
z-index: 2;
|
|
1094
|
-
background-color: rgba(0, 0, 0, 0.6);
|
|
1095
|
-
touch-action: none;
|
|
1096
|
-
}
|
|
1097
|
-
`,yn=e=>`
|
|
1098
|
-
.${e} {
|
|
1099
|
-
position: absolute;
|
|
1100
|
-
z-index: 3;
|
|
1101
|
-
touch-action: none;
|
|
1102
|
-
}
|
|
1103
|
-
`,bn=e=>`
|
|
1104
|
-
.${e} {
|
|
1105
|
-
backface-visibility: hidden;
|
|
1106
|
-
perspective: 1000px;
|
|
1107
|
-
max-inline-size: unset !important;
|
|
1108
|
-
max-block-size: unset !important;
|
|
1109
|
-
}
|
|
1110
|
-
`,$n=e=>`
|
|
1111
|
-
.${e} {
|
|
1112
|
-
position: absolute;
|
|
1113
|
-
z-index: 100;
|
|
1114
|
-
left: 0;
|
|
1115
|
-
top: 0;
|
|
1116
|
-
right: 0;
|
|
1117
|
-
bottom: 0;
|
|
1118
|
-
overflow: hidden;
|
|
1119
|
-
border-radius: 50%;
|
|
1120
|
-
}
|
|
1121
|
-
`,Sn={tl:"nw-resize",tr:"ne-resize",bl:"sw-resize",br:"se-resize"},mn={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=Sn[t],{h:r,v:l}=mn[t];return`
|
|
1122
|
-
.${e} {
|
|
1123
|
-
display: block;
|
|
1124
|
-
z-index: 102;
|
|
1125
|
-
background-color: rgba(255, 255, 255, .6);
|
|
1126
|
-
cursor: ${o};
|
|
1127
|
-
-webkit-user-select: none;
|
|
1128
|
-
-moz-user-select: none;
|
|
1129
|
-
-ms-user-select: none;
|
|
1130
|
-
user-select: none;
|
|
1131
|
-
${r}: -3px;
|
|
1132
|
-
${l}: -3px;
|
|
1133
|
-
position: absolute;
|
|
1134
|
-
width: 5px;
|
|
1135
|
-
height: 5px;
|
|
1136
|
-
touch-action: none;
|
|
1137
|
-
}
|
|
1138
|
-
|
|
1139
|
-
@media (max-width: 540px), (pointer: coarse) {
|
|
1140
|
-
.${e} {
|
|
1141
|
-
width: 24px;
|
|
1142
|
-
height: 24px;
|
|
1143
|
-
${r}: -12px;
|
|
1144
|
-
${l}: -12px;
|
|
1145
|
-
}
|
|
1146
|
-
}
|
|
1147
|
-
`},On=e=>`
|
|
1148
|
-
.${e} {
|
|
1149
|
-
display: flex;
|
|
1150
|
-
align-items: center;
|
|
1151
|
-
justify-content: center;
|
|
1152
|
-
background-color: rgba(0, 0, 0, .4);
|
|
1153
|
-
width: 100vw;
|
|
1154
|
-
height: 100vh;
|
|
1155
|
-
height: 100dvh;
|
|
1156
|
-
position: fixed;
|
|
1157
|
-
left: 0;
|
|
1158
|
-
top: 0;
|
|
1159
|
-
z-index: 1000;
|
|
1160
|
-
overflow-y: auto;
|
|
1161
|
-
box-sizing: border-box;
|
|
1162
|
-
padding: 16px;
|
|
1163
|
-
}
|
|
1164
|
-
|
|
1165
|
-
@media (max-width: 540px) {
|
|
1166
|
-
.${e} {
|
|
1167
|
-
padding: 8px;
|
|
1168
|
-
align-items: flex-start;
|
|
1169
|
-
padding-top: env(safe-area-inset-top, 8px);
|
|
1170
|
-
padding-bottom: env(safe-area-inset-bottom, 8px);
|
|
1171
|
-
}
|
|
1172
|
-
}
|
|
1173
|
-
`,wn=e=>`
|
|
1174
|
-
.${e} {
|
|
1175
|
-
backface-visibility: hidden;
|
|
1176
|
-
user-select: none;
|
|
1177
|
-
perspective: 1000px;
|
|
1178
|
-
overflow: hidden;
|
|
1179
|
-
display: block;
|
|
1180
|
-
transform: translateZ(0);
|
|
1181
|
-
width: auto;
|
|
1182
|
-
-webkit-user-drag: none;
|
|
1183
|
-
position: absolute;
|
|
1184
|
-
z-index: 1;
|
|
1185
|
-
}
|
|
1186
|
-
`,vn=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)},T=e=>`hq-cropper__${vn(e)}`,A=e=>e||[],B=(e,t)=>{if(t)for(const o of t)e.classList.add(o)},Cn=e=>{const t={applyButton:[T("applyButton"),...A(e.applyButton)],cancelButton:[T("cancelButton"),...A(e.cancelButton)],container:[T("container"),...A(e.container)],handlerMove:[T("handlerMove"),...A(e.handlerMove)],handlerResizeTopLeft:[T("handlerResizeTopLeft"),...A(e.handlerResizeTopLeft)],handlerResizeTopRight:[T("handlerResizeTopRight"),...A(e.handlerResizeTopRight)],handlerResizeBottomLeft:[T("handlerResizeBottomLeft"),...A(e.handlerResizeBottomLeft)],handlerResizeBottomRight:[T("handlerResizeBottomRight"),...A(e.handlerResizeBottomRight)],sourceImage:[T("sourceImage"),...A(e.sourceImage)],portalArea:[T("portalArea"),...A(e.portalArea)],previewImage:[T("previewImage"),...A(e.previewImage)],body:[T("body"),...A(e.body)],header:[T("header"),...A(e.header)],footer:[T("footer"),...A(e.footer)],portal:[T("portal"),...A(e.portal)],preview:[T("preview"),...A(e.preview)],root:[T("root"),...A(e.root)]},o=`
|
|
1187
|
-
${sn(t.applyButton[0])}
|
|
1188
|
-
${cn(t.body[0])}
|
|
1189
|
-
${pn(t.cancelButton[0])}
|
|
1190
|
-
${un(t.container[0])}
|
|
1191
|
-
${gn(t.footer[0])}
|
|
1192
|
-
${xn(t.header[0])}
|
|
1193
|
-
${hn(t.handlerMove[0])}
|
|
1194
|
-
${fn(t.portalArea[0])}
|
|
1195
|
-
${yn(t.portal[0])}
|
|
1196
|
-
${bn(t.previewImage[0])}
|
|
1197
|
-
${$n(t.preview[0])}
|
|
1198
|
-
${me(t.handlerResizeBottomLeft[0],"bl")}
|
|
1199
|
-
${me(t.handlerResizeBottomRight[0],"br")}
|
|
1200
|
-
${me(t.handlerResizeTopLeft[0],"tl")}
|
|
1201
|
-
${me(t.handlerResizeTopRight[0],"tr")}
|
|
1202
|
-
${On(t.root[0])}
|
|
1203
|
-
${wn(t.sourceImage[0])}
|
|
1204
|
-
`,r=document.createElement("style");return r.innerHTML=o,document.getElementsByTagName("head")[0].prepend(r),t};let Rn=0;const Ln=e=>{const t=new Map,o=new Proxy({...e},{set(r,l,a){return Reflect.set(r,l,a),(t.get(l)||[]).forEach(c=>c.action(a,r,l)),!0}});return{getState:()=>({...o}),setState:r=>{for(const l of Object.keys(r)){const a=r[l];a!==void 0&&(o[l]=a)}},subscribe:(r,l)=>{const a=String(++Rn),c=t.get(r)||[];return t.set(r,[...c,{action:l,id:a}]),a},unsubscribe:r=>{for(const[l,a]of t.entries()){const c=a.filter(s=>s.id!==r);if(c.length!==a.length){t.set(l,c);return}}},unsubscribeAll:()=>{t.clear()}}},_e={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"]}},kn=(e={},t={})=>Ln({..._e,config:{..._e.config,...e},css:Cn(t)}),jn=(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:l,height:a}=r.getBoundingClientRect(),c=l/a,s=t.width/t.height;let p,x,g=0,h=0;return c>s?(p=a*s,x=a,h=(l-p)/2):(p=l,x=l*(t.height/t.width),g=(a-x)/2),{width:p,height:x,left:h,top:g}},En=(e,t,o)=>{const[r,l]=t,a=r+e>o.width?(o.width-e)/2:r,c=l+e>o.height?(o.height-e)/2:l;return[a,c]},zn=(e,t)=>{const{config:o}=e(),r=Math.min(t.width,t.height)-o.framePadding*2,l=o.portalSize>r?r:o.portalSize;if(Array.isArray(o.portalPosition)&&o.portalPosition.length===2){const[a,c]=En(l,o.portalPosition,t);return{left:a,top:c,size:l}}return o.portalPosition==="center"?{size:l,left:(t.width-l)/2,top:(t.height-l)/2}:{left:0,top:0,size:l}};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 Nn=e=>{var r;const t=e(),o=document.createElement("span");return B(o,(r=t.css)==null?void 0:r.handlerMove),o.setAttribute("data-action",G.MOVE),o},In=e=>{var r;const t=e(),o=document.createElement("span");return B(o,(r=t.css)==null?void 0:r.handlerResizeBottomLeft),o.setAttribute("data-action",G.RESIZE_BL),o},Tn=e=>{var r;const t=e(),o=document.createElement("span");return B(o,(r=t.css)==null?void 0:r.handlerResizeBottomRight),o.setAttribute("data-action",G.RESIZE_BR),o},An=e=>{var r;const t=e(),o=document.createElement("span");return B(o,(r=t.css)==null?void 0:r.handlerResizeTopLeft),o.setAttribute("data-action",G.RESIZE_TL),o},Pn=e=>{var r;const t=e(),o=document.createElement("span");return B(o,(r=t.css)==null?void 0:r.handlerResizeTopRight),o.setAttribute("data-action",G.RESIZE_TR),o},Bn=e=>{var r;const t=e(),o=document.createElement("img");return B(o,(r=t.css)==null?void 0:r.previewImage),o},Mn=e=>{var r;const t=e(),o=document.createElement("div");return B(o,(r=t.css)==null?void 0:r.preview),o.appendChild(Bn(e)),o},_n=e=>{var r;const t=e(),o=document.createElement("div");return B(o,(r=t.css)==null?void 0:r.portal),o.appendChild(Mn(e)),o.appendChild(Nn(e)),o.appendChild(An(e)),o.appendChild(Pn(e)),o.appendChild(In(e)),o.appendChild(Tn(e)),o},Dn=e=>{var r;const t=e(),o=document.createElement("div");return B(o,(r=t.css)==null?void 0:r.portalArea),o.appendChild(_n(e)),o},Fn=e=>{var r;const t=e(),o=document.createElement("img");return B(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},Gn=e=>{var r;const t=e(),o=document.createElement("div");return B(o,(r=t.css)==null?void 0:r.body),o.appendChild(Fn(e)),o.appendChild(Dn(e)),o},Xn=(e,t)=>{var l;const o=e(),r=document.createElement("div");return B(r,(l=o.css)==null?void 0:l.applyButton),r.setAttribute("role","button"),r.innerText=o.config.applyButtonLabel,r.addEventListener("click",t),r},Yn=(e,t)=>{var l;const o=e(),r=document.createElement("div");return B(r,(l=o.css)==null?void 0:l.cancelButton),r.setAttribute("role","button"),r.innerText=o.config.cancelButtonLabel,r.addEventListener("click",t),r},Hn=(e,t,o)=>{var a;const r=e(),l=document.createElement("div");return B(l,(a=r.css)==null?void 0:a.footer),l.appendChild(Yn(e,o)),l.appendChild(Xn(e,t)),l},Un=e=>{var r;const t=e(),o=document.createElement("div");return B(o,(r=t.css)==null?void 0:r.header),o},Wn=(e,t,o)=>{var a;const r=e(),l=document.createElement("div");return B(l,(a=r.css)==null?void 0:a.container),l.appendChild(Un(e)),l.appendChild(Gn(e)),l.appendChild(Hn(e,t,o)),l},qn=(e,t,o)=>{var a;const r=e(),l=document.createElement("div");B(l,(a=r.css)==null?void 0:a.root),l.appendChild(Wn(e,t,o)),document.body.appendChild(l)},Zn=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,Kn={header:"header",sourceImage:"sourceImage",portalArea:"portalArea",portal:"portal",previewImage:"previewImage"},J=(e,t)=>{if(pe.has(e))return pe.get(e);if(!t)return null;const o=t[Kn[e]],r=document.querySelector(`.${o[0]}`);return pe.set(e,r),r},Vn=()=>{pe.clear()},Qn=()=>{pe.clear()},Jn=(e,t)=>{const o=J("header",t.css);o&&(o.innerText=e)},ei=(e,t)=>{const o=J("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=J("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 l=J("portal",t.css);l&&(l.style.width=`${t.portal.size}px`,l.style.height=`${t.portal.size}px`,l.style.left=`${t.portal.left}px`,l.style.top=`${t.portal.top}px`);const a=J("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`)},ti=(e,t)=>{const o=J("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=J("previewImage",t.css);r&&(r.style.marginLeft=`-${e.left}px`,r.style.marginTop=`-${e.top}px`)},je=1,oi=e=>{var f,S;const t=e(),o=document.createElement("canvas"),r=t.frame.width||je,l=t.frame.height||je,a=t.sourceWidth/r,c=t.sourceHeight/l,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)}})},ri=(e,t,o)=>{const{emitted:r,portal:l,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-l.size,h=c.framePadding,y=a.height-c.framePadding-l.size;s<x&&(s=x),s>g&&(s=g),p<h&&(p=h),p>y&&(p=y),o({portal:{...l,left:s,top:p}})},ni=(e,t,o)=>{const{action:r,emitted:l,portal:a,frame:c,config:s}=t(),p=e.pageX-l.X,x=e.pageY-l.Y;switch(r){case G.RESIZE_BR:{let g=l.size+Math.max(p,x);return g<s.minPortalSize&&(g=s.minPortalSize),l.top+g>c.height-s.framePadding&&(g=c.height-l.top-s.framePadding),l.left+g>c.width-s.framePadding&&(g=c.width-l.left-s.framePadding),o({portal:{...a,size:g}})}case G.RESIZE_TR:{let g=p+x>0?l.size+p:l.size-x,h=p+x>0?l.top-p:l.top+x;return g<s.minPortalSize&&(h=l.top+l.size-s.minPortalSize,g=s.minPortalSize),l.left+g>c.width-s.framePadding&&(g=c.width-l.left-s.framePadding,h=l.top-c.width+l.left+l.size),h<s.framePadding&&(g=l.top+l.size,h=s.framePadding),o({portal:{...a,top:h,size:g}})}case G.RESIZE_TL:{const g=Math.min(p,x);let h=l.size-g,y=l.left+g,f=l.top+g;if(h<s.minPortalSize){const S=l.size-s.minPortalSize;h=s.minPortalSize,y=l.left+S,f=l.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?l.size+x:l.size-p,h=p+x>0?l.left-x:l.left+p;return g<s.minPortalSize&&(h=l.left+l.size-s.minPortalSize,g=s.minPortalSize),g+l.top>c.height-s.framePadding&&(h=l.left-c.height+l.top+l.size,g=c.height-l.top-s.framePadding),h<s.framePadding&&(h=s.framePadding,g=l.left+l.size-s.framePadding),o({portal:{...a,left:h,size:g}})}default:return}},Je=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}},ii=(e,t)=>{var y,f,S;const o=e(),r=document.querySelector(`.${(y=o.css)==null?void 0:y.portal[0]}`),l=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=Je(b);if(b.target){const O=b.target.getAttribute("data-action"),w={X:m.pageX,Y:m.pageY,left:$.left,top:$.top,size:$.size};t({action:O,emitted:w})}},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:ri(b,e,t);break;default:ni(b,e,t)}},h=b=>{const{action:$}=e();$&&(b.preventDefault(),s=Je(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})),l&&(l.addEventListener("mousemove",h),l.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)),l&&(l.removeEventListener("mousemove",h),l.removeEventListener("touchmove",h))}},et=1024*1024,li=(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},ai=(e,t,o,r,l,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=li(p,x);if(g){s(g),e.target.value="";return}const h=new FileReader;let y=null;const f=()=>{var w;const m=t(),O=document.querySelector(`.${(w=m.css)==null?void 0:w.root[0]}`);O&&(O.remove(),document.removeEventListener("keydown",S),y==null||y(),Qn(),a(),o(_e))},S=m=>{m.key==="Escape"&&t().sourceBase64&&b(m)},b=m=>{m.preventDefault(),f()},$=m=>{m.preventDefault();const O=t();oi(t).then(([w,k])=>{r(w,k,O),b(m)}).catch(w=>{s(w instanceof Error?w.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;qn(t,$,b),Vn(),l("fileName",Jn),l("sourceBase64",ei),l("portal",ti);const w=jn(t,O),k=zn(t,w);o({frame:w,portal:k,fileName:p.name,sourceBase64:(z=m.target)==null?void 0:z.result,sourceHeight:O.height,sourceWidth:O.width}),y=ii(t,o),document.addEventListener("keydown",S)}},h.onerror=()=>{s("Failed to read file")},h.readAsDataURL(p),e.target.value=""},di=(e,t,o,r)=>{const{getState:l,setState:a,subscribe:c,unsubscribeAll:s}=kn(t,o),p=Zn(x=>ai(x,l,a,e,c,s,r));return{open:()=>p.click()}},Z={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",si=`
|
|
1205
|
-
.vacano-cropper-root {
|
|
1206
|
-
background-color: rgba(0, 0, 0, 0.5);
|
|
1207
|
-
backdrop-filter: blur(4px);
|
|
1208
|
-
}
|
|
1209
|
-
|
|
1210
|
-
.vacano-cropper-header {
|
|
1211
|
-
border-bottom: 1px solid ${n.COLORS.gray};
|
|
1212
|
-
padding: 16px 20px;
|
|
1213
|
-
}
|
|
1214
|
-
|
|
1215
|
-
.vacano-cropper-footer {
|
|
1216
|
-
border-top: 1px solid ${n.COLORS.gray};
|
|
1217
|
-
padding: 16px 20px;
|
|
1218
|
-
gap: 12px;
|
|
1219
|
-
}
|
|
1220
|
-
|
|
1221
|
-
.vacano-cropper-cancel-button {
|
|
1222
|
-
padding: 8px 16px;
|
|
1223
|
-
border-radius: 16px;
|
|
1224
|
-
border: 1px solid ${n.COLORS.gray};
|
|
1225
|
-
background-color: ${n.COLORS.white};
|
|
1226
|
-
color: ${n.COLORS.black};
|
|
1227
|
-
font-size: 14px;
|
|
1228
|
-
font-weight: 500;
|
|
1229
|
-
cursor: pointer;
|
|
1230
|
-
transition: background-color 0.2s;
|
|
1231
|
-
}
|
|
1232
|
-
|
|
1233
|
-
.vacano-cropper-cancel-button:hover {
|
|
1234
|
-
background-color: ${n.COLORS.gray};
|
|
1235
|
-
}
|
|
1236
|
-
|
|
1237
|
-
.vacano-cropper-apply-button {
|
|
1238
|
-
padding: 8px 16px;
|
|
1239
|
-
border-radius: 16px;
|
|
1240
|
-
border: none;
|
|
1241
|
-
background-color: ${n.COLORS.black};
|
|
1242
|
-
color: ${n.COLORS.white};
|
|
1243
|
-
font-size: 14px;
|
|
1244
|
-
font-weight: 500;
|
|
1245
|
-
cursor: pointer;
|
|
1246
|
-
transition: background-color 0.2s;
|
|
1247
|
-
}
|
|
1248
|
-
|
|
1249
|
-
.vacano-cropper-apply-button:hover {
|
|
1250
|
-
background-color: ${n.COLORS["iron-grey"]};
|
|
1251
|
-
}
|
|
1252
|
-
`,ci=()=>{if(typeof document>"u"||document.getElementById(tt))return;const e=document.createElement("style");e.id=tt,e.textContent=si,document.head.appendChild(e)},pi={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=Z.allowedTypes,applyLabel:o=Z.applyLabel,cancelLabel:r=Z.cancelLabel,compression:l=Z.compression,maxFileSize:a=Z.maxFileSize,onCrop:c,onError:s,outputSize:p=Z.outputSize,portalSize:x=Z.portalSize,type:g=Z.type}=e,h=u.useRef(null);return{open:u.useCallback(()=>{h.current||(ci(),h.current=di((f,S,b)=>{S&&(c==null||c({base64:f,blob:S,state:b}))},{portalSize:x,outputSize:p,compression:l,type:g,maxFileSize:a,allowedTypes:t,applyButtonLabel:o,cancelButtonLabel:r},pi,f=>{s==null||s({code:"CROPPER_ERROR",message:f})})),h.current.open()},[t,o,r,l,a,c,s,p,x,g])}},Ee=C.newClassNameGetter("image-cropper"),ui=({allowedTypes:e,applyLabel:t,buttonLabel:o="Select Image",cancelLabel:r,className:l,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:w}=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 i.jsxs(ln,{...$,ref:f,className:Ee("container",l),children:[i.jsx(an,{$size:y,className:Ee("preview",a==null?void 0:a.preview),children:m?i.jsx("img",{src:m,alt:"Preview"}):i.jsx(dn,{children:"No image"})}),i.jsx(d.Button,{variant:"system",onClick:w,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}},gi=d.styled.button`
|
|
926
|
+
color: ${r.COLORS.black};
|
|
927
|
+
font-size: ${({$level:e})=>Fe[e].fontSize}px;
|
|
928
|
+
line-height: ${({$level:e})=>Fe[e].lineHeight};
|
|
929
|
+
`,Gr=C.newClassNameGetter("heading"),Hr=({as:e,children:o,className:t,level:l=3,ref:s,...d})=>n.jsx(Fr,{...d,as:`h${e??l}`,ref:s,className:Gr("container",t),$level:l,children:o}),Z={default:{box:40,line:22,weight:2.5,gap:6},compact:{box:32,line:18,weight:2,gap:5}},Ur=i.styled.button`
|
|
1253
930
|
position: relative;
|
|
1254
931
|
display: flex;
|
|
1255
932
|
align-items: center;
|
|
1256
933
|
justify-content: center;
|
|
1257
|
-
width: ${({$size:e})=>
|
|
1258
|
-
height: ${({$size:e})=>
|
|
934
|
+
width: ${({$size:e})=>Z[e].box}px;
|
|
935
|
+
height: ${({$size:e})=>Z[e].box}px;
|
|
1259
936
|
padding: 0;
|
|
1260
937
|
border: none;
|
|
1261
938
|
border-radius: 8px;
|
|
@@ -1266,54 +943,54 @@
|
|
|
1266
943
|
transition: background-color 0.15s ease;
|
|
1267
944
|
|
|
1268
945
|
&:hover:not(:disabled) {
|
|
1269
|
-
background-color: ${
|
|
946
|
+
background-color: ${r.COLORS.gray};
|
|
1270
947
|
}
|
|
1271
948
|
|
|
1272
949
|
&:focus-visible {
|
|
1273
|
-
box-shadow: 0 0 0 2px ${
|
|
950
|
+
box-shadow: 0 0 0 2px ${r.COLORS["steel-blue"]};
|
|
1274
951
|
}
|
|
1275
|
-
`,
|
|
952
|
+
`,Wr=i.styled.div`
|
|
1276
953
|
display: flex;
|
|
1277
954
|
flex-direction: column;
|
|
1278
955
|
align-items: center;
|
|
1279
|
-
gap: ${({$size:e})=>
|
|
1280
|
-
`,
|
|
956
|
+
gap: ${({$size:e})=>Z[e].gap}px;
|
|
957
|
+
`,Oe=i.styled.span`
|
|
1281
958
|
display: block;
|
|
1282
|
-
width: ${({$size:e})=>
|
|
1283
|
-
height: ${({$size:e})=>
|
|
1284
|
-
background-color: ${
|
|
959
|
+
width: ${({$size:e})=>Z[e].line}px;
|
|
960
|
+
height: ${({$size:e})=>Z[e].weight}px;
|
|
961
|
+
background-color: ${r.COLORS.black};
|
|
1285
962
|
border-radius: 2px;
|
|
1286
963
|
transition:
|
|
1287
964
|
transform 0.3s ease,
|
|
1288
965
|
opacity 0.2s ease;
|
|
1289
966
|
transform-origin: center;
|
|
1290
967
|
|
|
1291
|
-
${({$position:e,$size:
|
|
1292
|
-
`,
|
|
968
|
+
${({$position:e,$size:o,$open:t})=>{const{gap:l,weight:s}=Z[o],d=l+s;if(e==="top")return t?`transform: translateY(${d}px) rotate(45deg);`:"";if(e==="middle")return t?"opacity: 0;":"";if(e==="bottom")return t?`transform: translateY(-${d}px) rotate(-45deg);`:""}}
|
|
969
|
+
`,ge=C.newClassNameGetter("menu-button"),Xr=({className:e,classnames:o,defaultOpen:t=!1,disabled:l=!1,onOpenChange:s,open:d,ref:x,size:c="default",...p})=>{const[g,f]=a.useState(t),h=d!==void 0,y=h?d:g,u=a.useCallback(()=>{if(l)return;const S=!y;h||f(S),s==null||s(S)},[l,y,h,s]);return n.jsx(Ur,{...p,ref:x,type:"button",disabled:l,"aria-label":y?"Close menu":"Open menu","aria-expanded":y,className:ge("container",e),$size:c,$disabled:l,onClick:u,children:n.jsxs(Wr,{$size:c,$open:y,children:[n.jsx(Oe,{$size:c,$position:"top",$open:y,className:ge("line",o==null?void 0:o.line)}),n.jsx(Oe,{$size:c,$position:"middle",$open:y,className:ge("line",o==null?void 0:o.line)}),n.jsx(Oe,{$size:c,$position:"bottom",$open:y,className:ge("line",o==null?void 0:o.line)})]})})},Yr=5e3,Ge={default:{background:"#374151",text:r.COLORS.white},success:{background:r.COLORS.green,text:r.COLORS.white},warning:{background:r.COLORS.yellow,text:r.COLORS.white},danger:{background:r.COLORS.red,text:r.COLORS.white},info:{background:r.COLORS["steel-blue"],text:r.COLORS.white}},dt=a.createContext(null),He=e=>Ge[e]??Ge.default,Kr=i.styled.div`
|
|
1293
970
|
position: fixed;
|
|
1294
971
|
top: 0;
|
|
1295
972
|
left: 0;
|
|
1296
973
|
right: 0;
|
|
1297
974
|
z-index: 9999;
|
|
1298
975
|
pointer-events: none;
|
|
1299
|
-
`,
|
|
976
|
+
`,qr=i.styled.div`
|
|
1300
977
|
display: flex;
|
|
1301
978
|
align-items: center;
|
|
1302
979
|
justify-content: center;
|
|
1303
980
|
gap: 12px;
|
|
1304
981
|
min-height: 44px;
|
|
1305
982
|
padding: 12px 48px;
|
|
1306
|
-
background-color: ${({$variant:e})=>
|
|
1307
|
-
color: ${({$variant:e})=>
|
|
1308
|
-
animation: ${({$isExiting:e})=>e?
|
|
983
|
+
background-color: ${({$variant:e})=>He(e).background};
|
|
984
|
+
color: ${({$variant:e})=>He(e).text};
|
|
985
|
+
animation: ${({$isExiting:e})=>e?r.KEYFRAMES.slideOutTopFade:r.KEYFRAMES.slideInTopFade}
|
|
1309
986
|
0.3s ease-out forwards;
|
|
1310
987
|
pointer-events: auto;
|
|
1311
|
-
|
|
988
|
+
`,Vr=i.styled.span`
|
|
1312
989
|
font-size: 14px;
|
|
1313
990
|
font-weight: 500;
|
|
1314
991
|
line-height: 1.4;
|
|
1315
992
|
text-align: center;
|
|
1316
|
-
`,
|
|
993
|
+
`,Zr=i.styled.button`
|
|
1317
994
|
position: absolute;
|
|
1318
995
|
right: 16px;
|
|
1319
996
|
top: 50%;
|
|
@@ -1334,9 +1011,9 @@
|
|
|
1334
1011
|
&:hover {
|
|
1335
1012
|
opacity: 1;
|
|
1336
1013
|
}
|
|
1337
|
-
`,
|
|
1014
|
+
`,Qr=i.styled.div`
|
|
1338
1015
|
position: relative;
|
|
1339
|
-
`,
|
|
1016
|
+
`,Jr=({notification:e,onRemove:o,onAnimationEnd:t})=>{const[l,s]=a.useState(!1),d=()=>{s(!0)},x=()=>{l&&(o(),t())};return a.useEffect(()=>{const c=setTimeout(()=>{d()},e.duration);return()=>clearTimeout(c)},[e.duration,e.id]),n.jsx(Qr,{children:n.jsxs(qr,{$variant:e.variant,$isExiting:l,onAnimationEnd:x,children:[n.jsx(Vr,{children:e.message}),n.jsx(Zr,{onClick:d,children:n.jsx(n.X,{style:{width:18,height:18}})})]})})},en=(e,o)=>{switch(o.type){case"ADD_NOTIFICATION":{const t=o.payload;return e.current?{...e,queue:[...e.queue,t]}:{...e,current:t}}case"REMOVE_CURRENT":return{...e,current:null};case"SHOW_NEXT":{const t=e.queue[0];return t?{current:t,queue:e.queue.slice(1)}:e}default:return e}},tn={current:null,queue:[]},on=({children:e})=>{const[o,t]=a.useReducer(en,tn),l=a.useCallback((c,p="default",g=Yr)=>{const f=`notification-${Date.now()}-${Math.random().toString(36).substr(2,9)}`;t({type:"ADD_NOTIFICATION",payload:{id:f,message:c,variant:p,duration:g}})},[]),s=a.useCallback(()=>{t({type:"REMOVE_CURRENT"})},[]),d=a.useCallback(()=>{t({type:"REMOVE_CURRENT"})},[]),x=a.useCallback(()=>{setTimeout(()=>{t({type:"SHOW_NEXT"})},100)},[]);return n.jsxs(dt.Provider,{value:{show:l,hide:s},children:[e,n.jsx(Kr,{children:o.current&&n.jsx(Jr,{notification:o.current,onRemove:d,onAnimationEnd:x},o.current.id)})]})},rn=()=>{const e=a.useContext(dt);if(!e)throw new Error("useNotification must be used within NotificationProvider");return e},st=a.createContext(null),nn="Agree",ln="Discard",dn=z.keyframes`
|
|
1340
1017
|
from {
|
|
1341
1018
|
opacity: 0;
|
|
1342
1019
|
transform: translateY(100%);
|
|
@@ -1345,7 +1022,7 @@
|
|
|
1345
1022
|
opacity: 1;
|
|
1346
1023
|
transform: translateY(0);
|
|
1347
1024
|
}
|
|
1348
|
-
`,
|
|
1025
|
+
`,sn=z.keyframes`
|
|
1349
1026
|
from {
|
|
1350
1027
|
opacity: 1;
|
|
1351
1028
|
transform: translateY(0);
|
|
@@ -1354,7 +1031,7 @@
|
|
|
1354
1031
|
opacity: 0;
|
|
1355
1032
|
transform: translateY(100%);
|
|
1356
1033
|
}
|
|
1357
|
-
`,
|
|
1034
|
+
`,an=i.styled.div`
|
|
1358
1035
|
position: fixed;
|
|
1359
1036
|
bottom: 24px;
|
|
1360
1037
|
right: 24px;
|
|
@@ -1362,49 +1039,49 @@
|
|
|
1362
1039
|
flex-direction: column;
|
|
1363
1040
|
max-width: 400px;
|
|
1364
1041
|
padding: 16px 16px 0 16px;
|
|
1365
|
-
background-color: ${
|
|
1366
|
-
border: 1px dashed ${
|
|
1042
|
+
background-color: ${r.COLORS.white};
|
|
1043
|
+
border: 1px dashed ${r.COLORS.gray};
|
|
1367
1044
|
border-radius: 12px;
|
|
1368
1045
|
overflow: hidden;
|
|
1369
1046
|
box-shadow:
|
|
1370
1047
|
0 4px 6px -1px rgba(0, 0, 0, 0.1),
|
|
1371
1048
|
0 2px 4px -2px rgba(0, 0, 0, 0.1);
|
|
1372
|
-
animation: ${({$isExiting:e})=>e?
|
|
1049
|
+
animation: ${({$isExiting:e})=>e?sn:dn} 0.2s ease-out forwards;
|
|
1373
1050
|
z-index: 1000;
|
|
1374
|
-
`,
|
|
1051
|
+
`,cn=i.styled.p`
|
|
1375
1052
|
margin: 0;
|
|
1376
1053
|
font-weight: 600;
|
|
1377
1054
|
font-size: 14px;
|
|
1378
|
-
color: ${
|
|
1055
|
+
color: ${r.COLORS.black};
|
|
1379
1056
|
text-align: left;
|
|
1380
|
-
`,
|
|
1057
|
+
`,pn=i.styled.p`
|
|
1381
1058
|
margin: 4px 0 0;
|
|
1382
1059
|
font-size: 13px;
|
|
1383
|
-
color: ${
|
|
1060
|
+
color: ${r.COLORS["iron-grey"]};
|
|
1384
1061
|
text-align: left;
|
|
1385
|
-
`,
|
|
1062
|
+
`,xn=i.styled.div`
|
|
1386
1063
|
display: flex;
|
|
1387
1064
|
align-items: center;
|
|
1388
1065
|
justify-content: flex-start;
|
|
1389
1066
|
gap: 8px;
|
|
1390
1067
|
margin: 12px -16px 0;
|
|
1391
1068
|
padding: 12px 16px;
|
|
1392
|
-
border-top: 1px solid ${
|
|
1069
|
+
border-top: 1px solid ${r.COLORS.gray};
|
|
1393
1070
|
background-color: rgba(0, 0, 0, 0.01);
|
|
1394
|
-
`,
|
|
1071
|
+
`,un=({confirmation:e,onDone:o})=>{const[t,l]=a.useState(!1),[s,d]=a.useState(!1),{label:x,description:c,onConfirm:p,onDiscard:g,options:f}=e,h=f.confirmLabel||nn,y=f.discardLabel||ln,u=a.useCallback($=>{l(!0),setTimeout(()=>{$==null||$(),o()},200)},[o]),S=a.useCallback(async()=>{const $=p();if($ instanceof Promise){d(!0);try{await $}finally{d(!1)}}u()},[u,p]),b=a.useCallback(()=>{s||u(g)},[u,s,g]);return a.useEffect(()=>{const $=w=>{w.key==="Escape"&&!s&&b()};return document.addEventListener("keydown",$),()=>document.removeEventListener("keydown",$)},[b,s]),n.jsxs(an,{$isExiting:t,children:[n.jsx(cn,{children:x}),n.jsx(pn,{children:c}),n.jsxs(xn,{children:[n.jsx(i.Button,{variant:"transparent",size:"compact",onClick:b,disabled:s,children:y}),n.jsx(i.Button,{variant:"system",size:"compact",onClick:S,loading:s,children:h})]})]})},gn=()=>{},fn=({children:e})=>{const[o,t]=a.useState(null),l=a.useCallback((d,x,c,p,g)=>{t({open:!0,label:d,description:x,onConfirm:c,onDiscard:p||gn,options:g||{}})},[]),s=a.useCallback(()=>{t(null)},[]);return n.jsxs(st.Provider,{value:{show:l,hide:s},children:[e,o&&n.jsx(un,{confirmation:o,onDone:s})]})},hn=()=>{const e=a.useContext(st);if(!e)throw new Error("useNotifyConfirmation must be used within NotifyConfirmationProvider");return e},yn=i.styled.div`
|
|
1395
1072
|
display: flex;
|
|
1396
1073
|
flex-direction: column;
|
|
1397
1074
|
gap: 2px;
|
|
1398
|
-
`,
|
|
1075
|
+
`,bn=i.styled.span`
|
|
1399
1076
|
font-size: 12px;
|
|
1400
1077
|
font-weight: 700;
|
|
1401
1078
|
text-transform: uppercase;
|
|
1402
1079
|
letter-spacing: 0.5px;
|
|
1403
|
-
color: ${
|
|
1404
|
-
|
|
1080
|
+
color: ${r.COLORS["iron-grey"]};
|
|
1081
|
+
`,$n=i.styled.span`
|
|
1405
1082
|
font-size: 14px;
|
|
1406
|
-
color: ${
|
|
1407
|
-
`,
|
|
1083
|
+
color: ${r.COLORS["iron-grey"]};
|
|
1084
|
+
`,Ce=C.newClassNameGetter("overline"),Sn=({children:e,className:o,classnames:t,description:l,ref:s,...d})=>n.jsxs(yn,{...d,ref:s,className:Ce("container",o),children:[n.jsx(bn,{className:Ce("label",t==null?void 0:t.label),children:e}),l&&n.jsx($n,{className:Ce("description",t==null?void 0:t.description),children:l})]}),On=i.styled.div`
|
|
1408
1085
|
position: relative;
|
|
1409
1086
|
display: flex;
|
|
1410
1087
|
flex-direction: column;
|
|
@@ -1414,17 +1091,17 @@
|
|
|
1414
1091
|
min-height: 100dvh;
|
|
1415
1092
|
padding: 40px 24px;
|
|
1416
1093
|
overflow: hidden;
|
|
1417
|
-
`,
|
|
1094
|
+
`,Cn=i.styled.div`
|
|
1418
1095
|
position: absolute;
|
|
1419
1096
|
inset: 0;
|
|
1420
1097
|
background-image:
|
|
1421
|
-
linear-gradient(${
|
|
1422
|
-
linear-gradient(90deg, ${
|
|
1098
|
+
linear-gradient(${r.COLORS.gray} 1px, transparent 1px),
|
|
1099
|
+
linear-gradient(90deg, ${r.COLORS.gray} 1px, transparent 1px);
|
|
1423
1100
|
background-size: ${({$size:e})=>`${e}px ${e}px`};
|
|
1424
1101
|
mask-image: radial-gradient(ellipse 60% 50% at 50% 40%, black 20%, transparent 100%);
|
|
1425
1102
|
-webkit-mask-image: radial-gradient(ellipse 60% 50% at 50% 40%, black 20%, transparent 100%);
|
|
1426
1103
|
pointer-events: none;
|
|
1427
|
-
`,
|
|
1104
|
+
`,wn=i.styled.div`
|
|
1428
1105
|
position: relative;
|
|
1429
1106
|
z-index: 1;
|
|
1430
1107
|
display: flex;
|
|
@@ -1432,71 +1109,71 @@
|
|
|
1432
1109
|
align-items: center;
|
|
1433
1110
|
width: 100%;
|
|
1434
1111
|
max-width: 400px;
|
|
1435
|
-
`,
|
|
1112
|
+
`,vn=i.styled.div`
|
|
1436
1113
|
margin-bottom: 32px;
|
|
1437
|
-
`,
|
|
1114
|
+
`,mn=i.styled.div`
|
|
1438
1115
|
display: flex;
|
|
1439
1116
|
align-items: center;
|
|
1440
1117
|
justify-content: center;
|
|
1441
1118
|
width: 48px;
|
|
1442
1119
|
height: 48px;
|
|
1443
1120
|
border-radius: 10px;
|
|
1444
|
-
border: 1px solid ${
|
|
1445
|
-
background-color: ${
|
|
1446
|
-
color: ${
|
|
1121
|
+
border: 1px solid ${r.COLORS.gray};
|
|
1122
|
+
background-color: ${r.COLORS.white};
|
|
1123
|
+
color: ${r.COLORS["iron-grey"]};
|
|
1447
1124
|
box-shadow:
|
|
1448
1125
|
0 1px 2px rgba(0, 0, 0, 0.05),
|
|
1449
1126
|
0 1px 3px rgba(0, 0, 0, 0.1);
|
|
1450
1127
|
margin-bottom: 24px;
|
|
1451
|
-
`,
|
|
1128
|
+
`,kn=i.styled.div`
|
|
1452
1129
|
display: flex;
|
|
1453
1130
|
flex-direction: column;
|
|
1454
1131
|
align-items: center;
|
|
1455
1132
|
text-align: center;
|
|
1456
1133
|
gap: 8px;
|
|
1457
1134
|
margin-bottom: 32px;
|
|
1458
|
-
`,
|
|
1135
|
+
`,Rn=i.styled.h1`
|
|
1459
1136
|
margin: 0;
|
|
1460
1137
|
font-size: 24px;
|
|
1461
1138
|
font-weight: 600;
|
|
1462
|
-
color: ${
|
|
1139
|
+
color: ${r.COLORS.black};
|
|
1463
1140
|
line-height: 1.3;
|
|
1464
|
-
`,
|
|
1141
|
+
`,Ln=i.styled.p`
|
|
1465
1142
|
margin: 0;
|
|
1466
1143
|
font-size: 14px;
|
|
1467
|
-
color: ${
|
|
1144
|
+
color: ${r.COLORS["iron-grey"]};
|
|
1468
1145
|
line-height: 1.5;
|
|
1469
1146
|
max-width: 360px;
|
|
1470
|
-
`,
|
|
1147
|
+
`,jn=i.styled.div`
|
|
1471
1148
|
width: 100%;
|
|
1472
|
-
`,
|
|
1149
|
+
`,Nn=i.styled.div`
|
|
1473
1150
|
margin-top: 32px;
|
|
1474
1151
|
text-align: center;
|
|
1475
1152
|
font-size: 14px;
|
|
1476
|
-
color: ${
|
|
1477
|
-
`,
|
|
1153
|
+
color: ${r.COLORS["iron-grey"]};
|
|
1154
|
+
`,W=C.newClassNameGetter("shell-screen"),En=({children:e,className:o,classnames:t,description:l,footer:s,gridSize:d=64,icon:x,logo:c,ref:p,title:g,...f})=>n.jsxs(On,{...f,ref:p,className:W("container",o),children:[n.jsx(Cn,{$size:d,className:W("grid",t==null?void 0:t.grid)}),n.jsxs(wn,{children:[c&&n.jsx(vn,{children:c}),x&&n.jsx(mn,{className:W("icon"),children:x}),(g||l)&&n.jsxs(kn,{className:W("header",t==null?void 0:t.header),children:[g&&n.jsx(Rn,{className:W("title",t==null?void 0:t.title),children:g}),l&&n.jsx(Ln,{className:W("description",t==null?void 0:t.description),children:l})]}),e&&n.jsx(jn,{className:W("content",t==null?void 0:t.content),children:e}),s&&n.jsx(Nn,{className:W("footer",t==null?void 0:t.footer),children:s})]})]}),In=(e,o,t,l)=>{if(t*2+3+l*2>=e)return Array.from({length:e},(y,u)=>u+1);const d=Math.max(o-t,l+1),x=Math.min(o+t,e-l),c=d>l+2,p=x<e-l-1;if(!c&&p){const y=t*2+l+2,u=Array.from({length:y},(b,$)=>$+1),S=Array.from({length:l},(b,$)=>e-l+$+1);return[...u,"dots",...S]}if(c&&!p){const y=t*2+l+2,u=Array.from({length:l},(b,$)=>$+1),S=Array.from({length:y},(b,$)=>e-y+$+1);return[...u,"dots",...S]}const g=Array.from({length:l},(y,u)=>u+1),f=Array.from({length:x-d+1},(y,u)=>d+u),h=Array.from({length:l},(y,u)=>e-l+u+1);return[...g,"dots",...f,"dots",...h]},Tn=i.styled.nav`
|
|
1478
1155
|
display: inline-flex;
|
|
1479
1156
|
align-items: center;
|
|
1480
1157
|
gap: 2px;
|
|
1481
1158
|
position: relative;
|
|
1482
|
-
`,
|
|
1159
|
+
`,zn=(e,o)=>{if(!o)switch(e){case"bordered":return`
|
|
1483
1160
|
background-color: transparent;
|
|
1484
|
-
border: 1px solid ${
|
|
1485
|
-
color: ${
|
|
1486
|
-
&:hover { background-color: ${
|
|
1161
|
+
border: 1px solid ${r.COLORS.gray};
|
|
1162
|
+
color: ${r.COLORS["iron-grey"]};
|
|
1163
|
+
&:hover { background-color: ${r.COLORS.gray}; }
|
|
1487
1164
|
`;case"light":return`
|
|
1488
1165
|
background-color: transparent;
|
|
1489
|
-
color: ${
|
|
1490
|
-
&:hover { background-color: ${
|
|
1166
|
+
color: ${r.COLORS["iron-grey"]};
|
|
1167
|
+
&:hover { background-color: ${r.COLORS.gray}; }
|
|
1491
1168
|
`;default:return`
|
|
1492
1169
|
background-color: transparent;
|
|
1493
|
-
color: ${
|
|
1494
|
-
&:hover { background-color: ${
|
|
1170
|
+
color: ${r.COLORS["iron-grey"]};
|
|
1171
|
+
&:hover { background-color: ${r.COLORS.gray}; }
|
|
1495
1172
|
`}return`
|
|
1496
|
-
color: ${
|
|
1173
|
+
color: ${r.COLORS.white};
|
|
1497
1174
|
position: relative;
|
|
1498
1175
|
z-index: 1;
|
|
1499
|
-
`},
|
|
1176
|
+
`},An=i.styled.button`
|
|
1500
1177
|
position: relative;
|
|
1501
1178
|
display: inline-flex;
|
|
1502
1179
|
align-items: center;
|
|
@@ -1513,31 +1190,31 @@
|
|
|
1513
1190
|
transition:
|
|
1514
1191
|
background-color 0.15s ease,
|
|
1515
1192
|
color 0.15s ease;
|
|
1516
|
-
${({$variant:e,$active:
|
|
1193
|
+
${({$variant:e,$active:o})=>zn(e,o)}
|
|
1517
1194
|
${({$disabled:e})=>e&&`
|
|
1518
1195
|
opacity: 0.4;
|
|
1519
1196
|
pointer-events: none;
|
|
1520
1197
|
cursor: default;
|
|
1521
1198
|
`}
|
|
1522
|
-
`,
|
|
1199
|
+
`,Pn=i.styled.span`
|
|
1523
1200
|
position: absolute;
|
|
1524
1201
|
width: 36px;
|
|
1525
1202
|
height: 36px;
|
|
1526
1203
|
border-radius: 10px;
|
|
1527
|
-
background-color: ${
|
|
1204
|
+
background-color: ${r.COLORS.black};
|
|
1528
1205
|
z-index: 0;
|
|
1529
1206
|
transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
|
|
1530
1207
|
pointer-events: none;
|
|
1531
|
-
`,
|
|
1208
|
+
`,Bn=i.styled.span`
|
|
1532
1209
|
display: inline-flex;
|
|
1533
1210
|
align-items: center;
|
|
1534
1211
|
justify-content: center;
|
|
1535
1212
|
width: 36px;
|
|
1536
1213
|
height: 36px;
|
|
1537
1214
|
font-size: 14px;
|
|
1538
|
-
color: ${
|
|
1215
|
+
color: ${r.COLORS["iron-grey"]};
|
|
1539
1216
|
user-select: none;
|
|
1540
|
-
`,
|
|
1217
|
+
`,Ue=i.styled.button`
|
|
1541
1218
|
display: inline-flex;
|
|
1542
1219
|
align-items: center;
|
|
1543
1220
|
justify-content: center;
|
|
@@ -1546,14 +1223,14 @@
|
|
|
1546
1223
|
border: none;
|
|
1547
1224
|
border-radius: 10px;
|
|
1548
1225
|
background-color: transparent;
|
|
1549
|
-
color: ${
|
|
1226
|
+
color: ${r.COLORS["iron-grey"]};
|
|
1550
1227
|
font-size: 16px;
|
|
1551
1228
|
cursor: pointer;
|
|
1552
1229
|
user-select: none;
|
|
1553
1230
|
transition: background-color 0.15s ease;
|
|
1554
1231
|
|
|
1555
1232
|
&:hover {
|
|
1556
|
-
background-color: ${
|
|
1233
|
+
background-color: ${r.COLORS.gray};
|
|
1557
1234
|
}
|
|
1558
1235
|
|
|
1559
1236
|
${({$disabled:e})=>e&&`
|
|
@@ -1561,81 +1238,81 @@
|
|
|
1561
1238
|
pointer-events: none;
|
|
1562
1239
|
cursor: default;
|
|
1563
1240
|
`}
|
|
1564
|
-
`,
|
|
1241
|
+
`,V=C.newClassNameGetter("pagination"),Dn=({boundaries:e=1,className:o,classnames:t,disabled:l=!1,initialPage:s=1,loop:d=!1,onChange:x,page:c,ref:p,showControls:g=!1,siblings:f=1,total:h,variant:y="flat",...u})=>{const S=c!==void 0,[b,$]=a.useState(s),w=S?c:b,R=a.useRef(new Map),k=a.useRef(null),N=a.useRef(null),I=In(h,w,f,e),L=a.useCallback(O=>{S||$(O),x==null||x(O)},[S,x]),m=a.useCallback(O=>{O<1||O>h||O===w||L(O)},[w,L,h]),v=a.useCallback(()=>{if(w<=1){d&&L(h);return}L(w-1)},[w,d,L,h]),j=a.useCallback(()=>{if(w>=h){d&&L(1);return}L(w+1)},[w,d,L,h]);return a.useEffect(()=>{const O=N.current,T=k.current,E=R.current.get(w);if(!O||!T||!E)return;const A=T.getBoundingClientRect(),P=E.getBoundingClientRect().left-A.left;O.style.transform=`translateX(${P}px)`},[w,I]),n.jsxs(Tn,{...u,ref:p||k,className:V("container",o),children:[n.jsx(Pn,{ref:N,className:V("cursor",t==null?void 0:t.cursor)}),g&&n.jsx(Ue,{className:V("controls",t==null?void 0:t.controls),$disabled:l||!d&&w<=1,onClick:v,"aria-label":"Previous page",children:n.jsx("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:n.jsx("path",{d:"m15 18-6-6 6-6"})})}),I.map((O,T)=>O==="dots"?n.jsx(Bn,{className:V("ellipsis",t==null?void 0:t.ellipsis),children:"..."},`dots-${T}`):n.jsx(An,{ref:E=>{E?R.current.set(O,E):R.current.delete(O)},className:V("item",t==null?void 0:t.item),$active:O===w,$variant:y,$disabled:l,onClick:()=>m(O),"aria-label":`Page ${O}`,"aria-current":O===w?"page":void 0,children:O},O)),g&&n.jsx(Ue,{className:V("controls",t==null?void 0:t.controls),$disabled:l||!d&&w>=h,onClick:j,"aria-label":"Next page",children:n.jsx("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:n.jsx("path",{d:"m9 18 6-6-6-6"})})})]})},We={light:{background:r.COLORS.white,border:r.alpha(r.COLORS.black,30),title:r.COLORS.black,description:r.COLORS["iron-grey"]},dark:{background:r.alpha(r.COLORS.white,5),border:r.alpha(r.COLORS.white,30),title:r.COLORS.white,description:"#9ca3af"}},be=e=>We[e]??We.light,Mn=i.styled.div`
|
|
1565
1242
|
position: relative;
|
|
1566
1243
|
display: flex;
|
|
1567
1244
|
flex-direction: column;
|
|
1568
1245
|
gap: 16px;
|
|
1569
1246
|
padding: 12px;
|
|
1570
|
-
border: 1px dashed ${({$variant:e})=>
|
|
1247
|
+
border: 1px dashed ${({$variant:e})=>be(e).border};
|
|
1571
1248
|
border-radius: 16px;
|
|
1572
|
-
background-color: ${({$variant:e})=>
|
|
1249
|
+
background-color: ${({$variant:e})=>be(e).background};
|
|
1573
1250
|
box-shadow:
|
|
1574
1251
|
0 4px 6px -1px rgba(0, 0, 0, 0.1),
|
|
1575
1252
|
0 2px 4px -2px rgba(0, 0, 0, 0.1);
|
|
1576
|
-
`,
|
|
1253
|
+
`,_n=i.styled.div`
|
|
1577
1254
|
position: absolute;
|
|
1578
1255
|
top: -1px;
|
|
1579
1256
|
right: 12px;
|
|
1580
1257
|
padding: 4px 12px;
|
|
1581
1258
|
border-radius: 0 0 8px 8px;
|
|
1582
|
-
background-color: ${
|
|
1583
|
-
color: ${
|
|
1259
|
+
background-color: ${r.COLORS.black};
|
|
1260
|
+
color: ${r.COLORS.white};
|
|
1584
1261
|
font-size: 11px;
|
|
1585
1262
|
font-weight: 600;
|
|
1586
1263
|
letter-spacing: 0.5px;
|
|
1587
1264
|
text-transform: uppercase;
|
|
1588
1265
|
line-height: 1.4;
|
|
1589
|
-
`,
|
|
1266
|
+
`,Fn=i.styled.div`
|
|
1590
1267
|
display: flex;
|
|
1591
1268
|
flex-direction: column;
|
|
1592
1269
|
gap: 4px;
|
|
1593
|
-
`,
|
|
1270
|
+
`,Gn=i.styled.div`
|
|
1594
1271
|
font-size: 18px;
|
|
1595
1272
|
font-weight: 600;
|
|
1596
1273
|
line-height: 1.4;
|
|
1597
|
-
color: ${({$variant:e})=>
|
|
1598
|
-
`,
|
|
1274
|
+
color: ${({$variant:e})=>be(e).title};
|
|
1275
|
+
`,Hn=i.styled.div`
|
|
1599
1276
|
font-size: 14px;
|
|
1600
1277
|
line-height: 1.5;
|
|
1601
|
-
color: ${({$variant:e})=>
|
|
1602
|
-
`,
|
|
1278
|
+
color: ${({$variant:e})=>be(e).description};
|
|
1279
|
+
`,Un=i.styled.div`
|
|
1603
1280
|
display: flex;
|
|
1604
1281
|
flex-wrap: wrap;
|
|
1605
1282
|
gap: 8px;
|
|
1606
|
-
`,
|
|
1283
|
+
`,re=C.newClassNameGetter("panel"),Wn=({children:e,className:o,classnames:t,description:l,label:s,ref:d,title:x,variant:c="light",...p})=>{const g=x||l;return n.jsxs(Mn,{...p,ref:d,className:re("container",o),$variant:c,children:[s&&n.jsx(_n,{className:re("label",t==null?void 0:t.label),children:s}),g&&n.jsxs(Fn,{children:[x&&n.jsx(Gn,{className:re("title",t==null?void 0:t.title),$variant:c,children:x}),l&&n.jsx(Hn,{className:re("description",t==null?void 0:t.description),$variant:c,children:l})]}),n.jsx(Un,{className:re("content",t==null?void 0:t.content),children:e})]})},Xn=["Готовим стартовый стол к запуску","Прогреваем фотонные двигатели","Запрашиваем разрешение у ЦУПа","Проверяем герметичность шлюзов","Выводим реактор на рабочую мощность","Ожидаем окно для маневра","Проверяем целостность теплозащиты","Разворачиваем солнечные паруса","Активируем систему навигации","Инициализируем бортовой компьютер","Рассчитываем вектор ускорения","Продуваем топливные магистрали","Тестируем аварийную систему спасения","Стабилизируем гироскопы на платформе","Загружаем полетное задание в память","Синхронизируем орбитальные часы","Рассчитываем траекторию кометы","Настраиваем антенну дальней связи","Считываем телеметрию со спутника","Корректируем азимут наведения","Фиксируем координаты черной дыры","Загружаем карту звездного неба","Калибруем инерциальную платформу","Принимаем эфемериды от станции","Уточняем параметры орбиты","Привязываемся к опорным звездам","Строим модель гравитационного поля","Анализируем метрики далеких звезд","Ждем прохождения первого нейтрино","Декодируем сигналы из туманности","Замеряем гравитационные волны","Отправляем зонд в пояс астероидов","Перехватываем межзвездные частицы","Обрабатываем данные телескопа","Анализируем спектр далекой звезды","Собираем пробы лунного грунта","Сканируем поверхность экзопланеты","Измеряем реликтовое излучение","Картографируем магнитные аномалии","Исследуем состав колец Сатурна","Регистрируем вспышку сверхновой","Фиксируем рентгеновский пульсар","Моделируем столкновение галактик","Наблюдаем транзит далекой планеты","Калибруем квантовый компилятор","Переводим данные в гиперпространство","Синтезируем топливо из вакуума","Компилируем нейронную матрицу","Оптимизируем квантовые вентили","Разматываем кубиты суперпозиции","Интерполируем пространство решений","Нормализуем тензорное поле","Индексируем базу знаний вселенной","Дефрагментируем пространство-время","Хешируем координаты червоточины","Верифицируем квантовую запутанность","Устанавливаем связь с Вояджером","Расшифровываем послание с Проксимы","Ретранслируем сигнал через Юпитер","Пингуем ближайший ретранслятор","Буферизуем поток тахионных данных","Шифруем канал субпространственной связи","Декомпрессируем архив звездных карт","Проверяем давление в отсеках","Балансируем нагрузку на генераторы","Охлаждаем сверхпроводящие магниты","Калибруем датчики внешней среды","Перезагружаем модуль жизнеобеспечения","Тестируем маневровые двигатели","Обновляем прошивку скафандров","Юстируем зеркала главного телескопа","Переключаем контур охлаждения","Диагностируем плазменный щит","Затягиваем болты на обшивке"],Yn=3500,Kn=e=>e&&e.length>0?e:Xn,qn=e=>e&&e>0?e:Yn,Vn=e=>Math.max(...e.map(o=>o.length)),Zn=(e,o)=>{const t=Math.floor((o-e.length)/2);return e.padStart(e.length+t).padEnd(o)},Xe=(e,o)=>{const t=Array.from({length:e},(l,s)=>s);for(let l=t.length-1;l>0;l--){const s=Math.floor(Math.random()*(l+1));[t[l],t[s]]=[t[s],t[l]]}if(o!==void 0&&t[0]===o){const l=1+Math.floor(Math.random()*(t.length-1));[t[0],t[l]]=[t[l],t[0]]}return t},Qn=z.keyframes`
|
|
1607
1284
|
from { transform: rotate(0deg) translateX(20px) rotate(0deg); }
|
|
1608
1285
|
to { transform: rotate(360deg) translateX(20px) rotate(-360deg); }
|
|
1609
|
-
`,
|
|
1286
|
+
`,Jn=z.keyframes`
|
|
1610
1287
|
from { transform: rotate(120deg) translateX(14px) rotate(-120deg); }
|
|
1611
1288
|
to { transform: rotate(480deg) translateX(14px) rotate(-480deg); }
|
|
1612
|
-
`,
|
|
1289
|
+
`,ei=z.keyframes`
|
|
1613
1290
|
from { transform: rotate(240deg) translateX(26px) rotate(-240deg); }
|
|
1614
1291
|
to { transform: rotate(600deg) translateX(26px) rotate(-600deg); }
|
|
1615
|
-
`,
|
|
1292
|
+
`,ti=i.styled.div`
|
|
1616
1293
|
display: flex;
|
|
1617
1294
|
flex-direction: column;
|
|
1618
1295
|
align-items: center;
|
|
1619
1296
|
justify-content: center;
|
|
1620
1297
|
padding: 48px 24px;
|
|
1621
1298
|
gap: 28px;
|
|
1622
|
-
`,
|
|
1299
|
+
`,oi=i.styled.div`
|
|
1623
1300
|
position: relative;
|
|
1624
1301
|
width: 64px;
|
|
1625
1302
|
height: 64px;
|
|
1626
1303
|
display: flex;
|
|
1627
1304
|
align-items: center;
|
|
1628
1305
|
justify-content: center;
|
|
1629
|
-
`,
|
|
1306
|
+
`,we=i.styled.div`
|
|
1630
1307
|
position: absolute;
|
|
1631
1308
|
width: ${e=>e.$index===0?6:e.$index===1?4:3}px;
|
|
1632
1309
|
height: ${e=>e.$index===0?6:e.$index===1?4:3}px;
|
|
1633
1310
|
border-radius: 50%;
|
|
1634
|
-
background: ${
|
|
1311
|
+
background: ${r.COLORS.black};
|
|
1635
1312
|
opacity: ${e=>e.$index===0?1:e.$index===1?.6:.35};
|
|
1636
|
-
animation: ${e=>e.$index===0?
|
|
1313
|
+
animation: ${e=>e.$index===0?Qn:e.$index===1?Jn:ei}
|
|
1637
1314
|
${e=>e.$index===0?3:e.$index===1?2:4.5}s linear infinite;
|
|
1638
|
-
`,
|
|
1315
|
+
`,ri=i.styled.span`
|
|
1639
1316
|
position: absolute;
|
|
1640
1317
|
width: 1px;
|
|
1641
1318
|
height: 1px;
|
|
@@ -1645,14 +1322,14 @@
|
|
|
1645
1322
|
clip: rect(0, 0, 0, 0);
|
|
1646
1323
|
white-space: nowrap;
|
|
1647
1324
|
border: 0;
|
|
1648
|
-
`,
|
|
1325
|
+
`,ni=i.styled.p`
|
|
1649
1326
|
margin: 0;
|
|
1650
1327
|
font-size: 14px;
|
|
1651
|
-
color: ${
|
|
1328
|
+
color: ${r.COLORS["iron-grey"]};
|
|
1652
1329
|
line-height: 1.5;
|
|
1653
1330
|
text-align: center;
|
|
1654
1331
|
max-width: 360px;
|
|
1655
|
-
`,
|
|
1332
|
+
`,ii=40,li=200,di=30,Ye="АБВГДЕЖЗИКЛМНОПРСТУФХЦЧШЩЭЮЯабвгдежзиклмнопрстуфхцчшщэюяABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789",si=()=>Ye[Math.floor(Math.random()*Ye.length)],ai=e=>li+e*di,ci=()=>ii,pi=i.styled.div`
|
|
1656
1333
|
display: flex;
|
|
1657
1334
|
justify-content: center;
|
|
1658
1335
|
white-space: pre;
|
|
@@ -1660,25 +1337,25 @@
|
|
|
1660
1337
|
font-size: 18px;
|
|
1661
1338
|
font-weight: 500;
|
|
1662
1339
|
line-height: 1.6;
|
|
1663
|
-
color: ${
|
|
1340
|
+
color: ${r.COLORS.black};
|
|
1664
1341
|
min-height: 1.6em;
|
|
1665
|
-
`,
|
|
1342
|
+
`,xi=i.styled.span`
|
|
1666
1343
|
display: inline-block;
|
|
1667
1344
|
width: 0.65em;
|
|
1668
1345
|
text-align: center;
|
|
1669
|
-
`,
|
|
1346
|
+
`,ui=C.newClassNameGetter("split-flap-text"),at=({className:e,ref:o,text:t,...l})=>{const[s,d]=a.useState(()=>t.split("")),x=a.useRef(t),c=a.useRef([]),p=a.useRef(null),g=a.useRef([]),f=a.useRef(t.split("")),h=a.useCallback(()=>{p.current&&(clearInterval(p.current),p.current=null);for(const u of g.current)clearTimeout(u);g.current=[]},[]),y=a.useCallback(u=>{h(),f.current=u,c.current=u.map(S=>S===" "),p.current=setInterval(()=>{d(S=>S.map((b,$)=>c.current[$]?f.current[$]:si()))},ci()),g.current=u.map((S,b)=>setTimeout(()=>{c.current[b]=!0,c.current.every(Boolean)&&(p.current&&(clearInterval(p.current),p.current=null),d([...f.current]))},ai(b)))},[h]);return a.useEffect(()=>{t!==x.current&&(x.current=t,y(t.split("")))},[t,y]),a.useEffect(()=>h,[h]),n.jsx(pi,{...l,ref:o,className:ui("container",e),"aria-hidden":"true",children:s.map((u,S)=>n.jsx(xi,{children:u===" "?" ":u},S))})},fe=C.newClassNameGetter("pending-screen"),gi=({className:e,classnames:o,description:t,interval:l,phrases:s,ref:d,...x})=>{const c=a.useMemo(()=>Kn(s),[s]),p=a.useMemo(()=>qn(l),[l]),g=a.useMemo(()=>Vn(c),[c]),f=a.useRef([]),h=a.useRef(0),y=a.useCallback(k=>(h.current>=f.current.length&&(f.current=Xe(c.length,k),h.current=0),f.current[h.current++]),[c.length]),[u,S]=a.useState(()=>{f.current=Xe(c.length);const k=f.current[0];return h.current=1,k}),b=a.useRef(null),$=a.useCallback(()=>{S(k=>y(k))},[y]);a.useEffect(()=>(b.current=setInterval($,p),()=>{b.current&&clearInterval(b.current)}),[$,p]);const w=c[u],R=Zn(w,g);return n.jsxs(ti,{...x,ref:d,className:fe("container",e),role:"status",children:[n.jsxs(oi,{className:fe("indicator",o==null?void 0:o.indicator),children:[n.jsx(we,{$index:0}),n.jsx(we,{$index:1}),n.jsx(we,{$index:2})]}),n.jsx(at,{text:R,className:fe("board",o==null?void 0:o.board)}),n.jsx(ri,{children:w}),t&&n.jsx(ni,{className:fe("description",o==null?void 0:o.description),children:t})]})},je={compact:{height:4,radius:2},default:{height:8,radius:4}},fi=i.styled.div`
|
|
1670
1347
|
width: 100%;
|
|
1671
|
-
height: ${({$size:e})=>
|
|
1672
|
-
border-radius: ${({$size:e})=>
|
|
1673
|
-
background-color: ${
|
|
1348
|
+
height: ${({$size:e})=>je[e].height}px;
|
|
1349
|
+
border-radius: ${({$size:e})=>je[e].radius}px;
|
|
1350
|
+
background-color: ${r.COLORS.gray};
|
|
1674
1351
|
overflow: hidden;
|
|
1675
|
-
`,
|
|
1352
|
+
`,hi=i.styled.div`
|
|
1676
1353
|
height: 100%;
|
|
1677
1354
|
width: ${({$value:e})=>Math.min(100,Math.max(0,e))}%;
|
|
1678
|
-
border-radius: ${({$size:e})=>
|
|
1679
|
-
background-color: ${
|
|
1355
|
+
border-radius: ${({$size:e})=>je[e].radius}px;
|
|
1356
|
+
background-color: ${r.COLORS.black};
|
|
1680
1357
|
transition: width 0.2s ease;
|
|
1681
|
-
`,
|
|
1358
|
+
`,Ke=C.newClassNameGetter("progress"),yi=({value:e,size:o="default",className:t,classnames:l,ref:s,...d})=>n.jsx(fi,{...d,ref:s,$size:o,className:Ke("track",t,l==null?void 0:l.track),role:"progressbar","aria-valuenow":e,"aria-valuemin":0,"aria-valuemax":100,children:n.jsx(hi,{$size:o,$value:e,className:Ke("bar",l==null?void 0:l.bar)})}),ct=a.createContext(null),bi=i.styled.div`
|
|
1682
1359
|
position: fixed;
|
|
1683
1360
|
bottom: 24px;
|
|
1684
1361
|
right: 24px;
|
|
@@ -1687,156 +1364,156 @@
|
|
|
1687
1364
|
align-items: center;
|
|
1688
1365
|
gap: 10px;
|
|
1689
1366
|
padding: 10px 16px;
|
|
1690
|
-
background-color: ${
|
|
1367
|
+
background-color: ${r.alpha(r.COLORS["iron-grey"],10)};
|
|
1691
1368
|
backdrop-filter: blur(8px);
|
|
1692
1369
|
border-radius: 24px;
|
|
1693
|
-
animation: ${
|
|
1370
|
+
animation: ${r.KEYFRAMES.fadeIn} 0.2s ease-out;
|
|
1694
1371
|
pointer-events: none;
|
|
1695
|
-
color: ${
|
|
1696
|
-
|
|
1372
|
+
color: ${r.COLORS.black};
|
|
1373
|
+
`,$i=i.styled.span`
|
|
1697
1374
|
font-size: 14px;
|
|
1698
1375
|
font-weight: 500;
|
|
1699
1376
|
white-space: nowrap;
|
|
1700
|
-
`,
|
|
1377
|
+
`,Si=({children:e,defaultMessage:o="Saving"})=>{const[t,l]=a.useState(!1),[s,d]=a.useState(o),x=a.useCallback(g=>{d(g??o),l(!0)},[o]),c=a.useCallback(()=>{l(!1)},[]),p=a.useMemo(()=>({isVisible:t,show:x,hide:c}),[t,x,c]);return n.jsxs(ct.Provider,{value:p,children:[e,t&&n.jsxs(bi,{children:[n.jsx(i.Spinner,{size:"sm"}),n.jsx($i,{children:s})]})]})},Oi=()=>{const e=a.useContext(ct);if(!e)throw new Error("useSaveProgress must be used within SaveProgressProvider");return e},Ci=z.keyframes`
|
|
1701
1378
|
0% { opacity: 1; }
|
|
1702
1379
|
50% { opacity: 0.4; }
|
|
1703
1380
|
100% { opacity: 1; }
|
|
1704
|
-
`,
|
|
1381
|
+
`,wi=z.keyframes`
|
|
1705
1382
|
0% { transform: translateX(-100%); }
|
|
1706
1383
|
60% { transform: translateX(100%); }
|
|
1707
1384
|
100% { transform: translateX(100%); }
|
|
1708
|
-
`,
|
|
1709
|
-
animation: ${
|
|
1710
|
-
`,
|
|
1385
|
+
`,vi=z.css`
|
|
1386
|
+
animation: ${Ci} 1.5s ease-in-out infinite;
|
|
1387
|
+
`,mi=z.css`
|
|
1711
1388
|
&::after {
|
|
1712
1389
|
content: '';
|
|
1713
1390
|
position: absolute;
|
|
1714
1391
|
inset: 0;
|
|
1715
1392
|
background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.5), transparent);
|
|
1716
|
-
animation: ${
|
|
1393
|
+
animation: ${wi} 1.6s linear infinite;
|
|
1717
1394
|
}
|
|
1718
|
-
`,
|
|
1395
|
+
`,ki={pulse:vi,wave:mi,none:null},Ri={none:"0",sm:"4px",md:"8px",lg:"12px",full:"9999px"},ve=e=>typeof e=="number"?`${e}px`:e,Li=i.styled.div`
|
|
1719
1396
|
position: relative;
|
|
1720
1397
|
overflow: hidden;
|
|
1721
1398
|
background-color: #e5e7eb;
|
|
1722
|
-
width: ${({$width:e,$circle:
|
|
1723
|
-
height: ${({$height:e})=>
|
|
1724
|
-
border-radius: ${({$circle:e,$radius:
|
|
1725
|
-
${({$animation:e})=>
|
|
1726
|
-
`,
|
|
1399
|
+
width: ${({$width:e,$circle:o,$height:t})=>ve(o?t:e)};
|
|
1400
|
+
height: ${({$height:e})=>ve(e)};
|
|
1401
|
+
border-radius: ${({$circle:e,$radius:o})=>e?"50%":Ri[o]};
|
|
1402
|
+
${({$animation:e})=>ki[e]}
|
|
1403
|
+
`,ji=C.newClassNameGetter("skeleton"),Ni=({animation:e="pulse",circle:o=!1,className:t,height:l=16,radius:s="md",ref:d,width:x="100%",...c})=>n.jsx(Li,{...c,ref:d,className:ji("container",t),$animation:e,$circle:o,$height:l,$radius:s,$width:x}),Ei=i.styled.span`
|
|
1727
1404
|
display: inline-flex;
|
|
1728
1405
|
align-items: baseline;
|
|
1729
1406
|
gap: 4px;
|
|
1730
1407
|
font-size: 13px;
|
|
1731
1408
|
color: #666;
|
|
1732
|
-
`,
|
|
1409
|
+
`,Ii=i.styled.strong`
|
|
1733
1410
|
font-weight: 700;
|
|
1734
|
-
color: ${
|
|
1735
|
-
`,
|
|
1411
|
+
color: ${r.COLORS.black};
|
|
1412
|
+
`,Ti=i.styled.span``,me=C.newClassNameGetter("stat"),zi=({className:e,classnames:o,label:t,ref:l,value:s,...d})=>n.jsxs(Ei,{...d,ref:l,className:me("container",e),children:[n.jsx(Ii,{className:me("value",o==null?void 0:o.value),children:s}),n.jsx(Ti,{className:me("label",o==null?void 0:o.label),children:t})]}),Ai=i.styled.div`
|
|
1736
1413
|
display: flex;
|
|
1737
1414
|
flex-direction: column;
|
|
1738
|
-
border: 1px solid ${
|
|
1415
|
+
border: 1px solid ${r.COLORS.gray};
|
|
1739
1416
|
border-radius: 8px;
|
|
1740
1417
|
overflow: hidden;
|
|
1741
|
-
`,
|
|
1418
|
+
`,Pi=i.styled.div`
|
|
1742
1419
|
&:not(:last-child) {
|
|
1743
|
-
border-bottom: 1px solid ${
|
|
1420
|
+
border-bottom: 1px solid ${r.COLORS.gray};
|
|
1744
1421
|
}
|
|
1745
|
-
`,
|
|
1422
|
+
`,Bi=i.styled.button`
|
|
1746
1423
|
display: flex;
|
|
1747
1424
|
align-items: center;
|
|
1748
1425
|
gap: 8px;
|
|
1749
1426
|
width: 100%;
|
|
1750
1427
|
padding: 10px 16px;
|
|
1751
|
-
background-color: ${({$expanded:e})=>e?
|
|
1428
|
+
background-color: ${({$expanded:e})=>e?r.alpha(r.COLORS.black,3):"transparent"};
|
|
1752
1429
|
border: none;
|
|
1753
1430
|
cursor: ${({$interactive:e})=>e?"pointer":"default"};
|
|
1754
1431
|
font-size: 14px;
|
|
1755
1432
|
font-weight: 500;
|
|
1756
|
-
color: ${
|
|
1433
|
+
color: ${r.COLORS.black};
|
|
1757
1434
|
text-align: left;
|
|
1758
1435
|
outline: none;
|
|
1759
1436
|
transition: background-color 0.15s ease;
|
|
1760
1437
|
|
|
1761
1438
|
&:hover {
|
|
1762
|
-
background-color: ${({$interactive:e})=>e?
|
|
1439
|
+
background-color: ${({$interactive:e})=>e?r.alpha(r.COLORS.black,3):"transparent"};
|
|
1763
1440
|
}
|
|
1764
|
-
`,
|
|
1441
|
+
`,Di=i.styled.span`
|
|
1765
1442
|
display: flex;
|
|
1766
1443
|
align-items: center;
|
|
1767
1444
|
justify-content: center;
|
|
1768
1445
|
width: 16px;
|
|
1769
1446
|
height: 16px;
|
|
1770
1447
|
flex-shrink: 0;
|
|
1771
|
-
color: ${
|
|
1448
|
+
color: ${r.COLORS["iron-grey"]};
|
|
1772
1449
|
transition: transform 0.15s ease;
|
|
1773
1450
|
transform: rotate(${({$expanded:e})=>e?"90deg":"0deg"});
|
|
1774
|
-
`,
|
|
1451
|
+
`,Mi=i.styled.span`
|
|
1775
1452
|
width: 16px;
|
|
1776
1453
|
height: 16px;
|
|
1777
1454
|
flex-shrink: 0;
|
|
1778
|
-
`,
|
|
1455
|
+
`,_i={success:r.COLORS.green,error:r.COLORS.red,running:r.COLORS["steel-blue"],pending:r.COLORS.gray},Fi=z.keyframes`
|
|
1779
1456
|
from { transform: rotate(0deg); }
|
|
1780
1457
|
to { transform: rotate(360deg); }
|
|
1781
|
-
`,
|
|
1782
|
-
animation: ${
|
|
1783
|
-
`,
|
|
1458
|
+
`,Gi=z.css`
|
|
1459
|
+
animation: ${Fi} 1s linear infinite;
|
|
1460
|
+
`,Hi=i.styled.span`
|
|
1784
1461
|
display: flex;
|
|
1785
1462
|
align-items: center;
|
|
1786
1463
|
justify-content: center;
|
|
1787
1464
|
flex-shrink: 0;
|
|
1788
|
-
color: ${({$status:e})=>
|
|
1789
|
-
${({$status:e})=>e==="running"&&
|
|
1790
|
-
`,
|
|
1465
|
+
color: ${({$status:e})=>_i[e]};
|
|
1466
|
+
${({$status:e})=>e==="running"&&Gi}
|
|
1467
|
+
`,Ui=i.styled.span`
|
|
1791
1468
|
flex: 1;
|
|
1792
1469
|
min-width: 0;
|
|
1793
1470
|
overflow: hidden;
|
|
1794
1471
|
text-overflow: ellipsis;
|
|
1795
1472
|
white-space: nowrap;
|
|
1796
|
-
color: ${({$muted:e})=>e?
|
|
1797
|
-
`,
|
|
1473
|
+
color: ${({$muted:e})=>e?r.COLORS["iron-grey"]:r.COLORS.black};
|
|
1474
|
+
`,Wi=i.styled.span`
|
|
1798
1475
|
flex-shrink: 0;
|
|
1799
1476
|
font-size: 12px;
|
|
1800
1477
|
font-weight: 400;
|
|
1801
|
-
color: ${
|
|
1478
|
+
color: ${r.COLORS["iron-grey"]};
|
|
1802
1479
|
font-variant-numeric: tabular-nums;
|
|
1803
|
-
`,
|
|
1480
|
+
`,Xi=i.styled.div`
|
|
1804
1481
|
display: grid;
|
|
1805
1482
|
grid-template-rows: ${({$expanded:e})=>e?"1fr":"0fr"};
|
|
1806
1483
|
transition: grid-template-rows 0.15s ease;
|
|
1807
|
-
`,
|
|
1484
|
+
`,Yi=i.styled.div`
|
|
1808
1485
|
overflow: hidden;
|
|
1809
|
-
`,
|
|
1486
|
+
`,Ki=i.styled.div`
|
|
1810
1487
|
padding: 8px 0;
|
|
1811
|
-
background-color: ${
|
|
1812
|
-
border-top: 1px solid ${
|
|
1488
|
+
background-color: ${r.COLORS.white};
|
|
1489
|
+
border-top: 1px solid ${r.COLORS.gray};
|
|
1813
1490
|
font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;
|
|
1814
1491
|
font-size: 12px;
|
|
1815
1492
|
line-height: 20px;
|
|
1816
|
-
`,
|
|
1493
|
+
`,qi=i.styled.div`
|
|
1817
1494
|
display: flex;
|
|
1818
1495
|
padding: 0 16px;
|
|
1819
1496
|
|
|
1820
1497
|
&:hover {
|
|
1821
|
-
background-color: ${
|
|
1498
|
+
background-color: ${r.alpha(r.COLORS.black,3)};
|
|
1822
1499
|
}
|
|
1823
|
-
`,
|
|
1500
|
+
`,Vi=i.styled.span`
|
|
1824
1501
|
flex-shrink: 0;
|
|
1825
1502
|
width: 40px;
|
|
1826
1503
|
text-align: right;
|
|
1827
1504
|
padding-right: 16px;
|
|
1828
|
-
color: ${
|
|
1505
|
+
color: ${r.COLORS["iron-grey"]};
|
|
1829
1506
|
user-select: none;
|
|
1830
|
-
|
|
1507
|
+
`,Zi=i.styled.span`
|
|
1831
1508
|
flex: 1;
|
|
1832
1509
|
min-width: 0;
|
|
1833
1510
|
white-space: pre;
|
|
1834
|
-
color: ${
|
|
1835
|
-
`,
|
|
1511
|
+
color: ${r.COLORS.black};
|
|
1512
|
+
`,he=C.newClassNameGetter("step-log"),Qi={success:$e.CircleCheck,error:$e.CircleX,running:n.LoaderCircle,pending:$e.Circle},Ji=({className:e,classnames:o,defaultValue:t=[],onChange:l,ref:s,steps:d,value:x,...c})=>{const[p,g]=a.useState(t),f=x!==void 0,h=f?x:p,y=a.useCallback(u=>{const b=h.includes(u)?h.filter($=>$!==u):[...h,u];f||g(b),l==null||l(b)},[h,f,l]);return n.jsx(Ai,{...c,ref:s,className:he("container",e),children:d.map(u=>{const S=h.includes(u.value),b=u.status??"pending",$=b!=="pending",w=u.lines&&u.lines.length>0,R=Qi[b];return n.jsxs(Pi,{className:he("step",o==null?void 0:o.step),children:[n.jsxs(Bi,{type:"button",$expanded:S,$interactive:$,onClick:$?()=>y(u.value):void 0,className:he("header",o==null?void 0:o.header),children:[$?n.jsx(Di,{$expanded:S,children:n.jsx(n.ChevronRight,{size:14})}):n.jsx(Mi,{}),n.jsx(Hi,{$status:b,children:n.jsx(R,{size:16})}),n.jsx(Ui,{$muted:b==="pending",children:u.title}),u.duration&&n.jsx(Wi,{children:u.duration})]}),$&&w&&n.jsx(Xi,{$expanded:S,children:n.jsx(Yi,{children:n.jsx(Ki,{className:he("log",o==null?void 0:o.log),children:u.lines.map(k=>n.jsxs(qi,{children:[n.jsx(Vi,{children:k.line}),n.jsx(Zi,{children:k.text})]},k.line))})})})]},u.value)})})},el=i.styled.div`
|
|
1836
1513
|
display: flex;
|
|
1837
1514
|
align-items: ${e=>e.$orientation==="vertical"?"flex-start":"center"};
|
|
1838
1515
|
flex-direction: ${e=>e.$orientation==="vertical"?"column":"row"};
|
|
1839
|
-
`,
|
|
1516
|
+
`,tl=i.styled.div`
|
|
1840
1517
|
display: flex;
|
|
1841
1518
|
align-items: ${e=>e.$orientation==="vertical"?"flex-start":"center"};
|
|
1842
1519
|
flex-direction: ${e=>e.$orientation==="vertical"?"column":"row"};
|
|
@@ -1845,7 +1522,7 @@
|
|
|
1845
1522
|
&:last-child {
|
|
1846
1523
|
flex: 0;
|
|
1847
1524
|
}
|
|
1848
|
-
`,
|
|
1525
|
+
`,ol=i.styled.button`
|
|
1849
1526
|
display: flex;
|
|
1850
1527
|
align-items: center;
|
|
1851
1528
|
gap: 10px;
|
|
@@ -1854,7 +1531,7 @@
|
|
|
1854
1531
|
background: transparent;
|
|
1855
1532
|
cursor: ${e=>e.$clickable?"pointer":"default"};
|
|
1856
1533
|
flex-shrink: 0;
|
|
1857
|
-
`,
|
|
1534
|
+
`,rl=i.styled.div`
|
|
1858
1535
|
display: flex;
|
|
1859
1536
|
align-items: center;
|
|
1860
1537
|
justify-content: center;
|
|
@@ -1870,22 +1547,22 @@
|
|
|
1870
1547
|
color 0.2s ease;
|
|
1871
1548
|
|
|
1872
1549
|
${e=>e.$active||e.$completed?`
|
|
1873
|
-
background-color: ${
|
|
1874
|
-
border: 2px solid ${
|
|
1875
|
-
color: ${
|
|
1550
|
+
background-color: ${r.COLORS.black};
|
|
1551
|
+
border: 2px solid ${r.COLORS.black};
|
|
1552
|
+
color: ${r.COLORS.white};
|
|
1876
1553
|
`:`
|
|
1877
1554
|
background-color: transparent;
|
|
1878
|
-
border: 2px solid ${
|
|
1879
|
-
color: ${
|
|
1555
|
+
border: 2px solid ${r.COLORS.gray};
|
|
1556
|
+
color: ${r.COLORS["iron-grey"]};
|
|
1880
1557
|
`}
|
|
1881
|
-
`,
|
|
1558
|
+
`,nl=i.styled.span`
|
|
1882
1559
|
font-size: 14px;
|
|
1883
1560
|
font-weight: 500;
|
|
1884
1561
|
white-space: nowrap;
|
|
1885
|
-
color: ${e=>e.$active||e.$completed?
|
|
1562
|
+
color: ${e=>e.$active||e.$completed?r.COLORS.black:r.COLORS["iron-grey"]};
|
|
1886
1563
|
transition: color 0.2s ease;
|
|
1887
|
-
`,
|
|
1888
|
-
background-color: ${e=>e.$completed?
|
|
1564
|
+
`,il=i.styled.div`
|
|
1565
|
+
background-color: ${e=>e.$completed?r.COLORS.black:r.COLORS.gray};
|
|
1889
1566
|
transition: background-color 0.2s ease;
|
|
1890
1567
|
|
|
1891
1568
|
${e=>e.$orientation==="vertical"?`
|
|
@@ -1898,16 +1575,16 @@
|
|
|
1898
1575
|
min-width: 16px;
|
|
1899
1576
|
margin: 0 12px;
|
|
1900
1577
|
`}
|
|
1901
|
-
`,
|
|
1578
|
+
`,ne=C.newClassNameGetter("stepper"),ll=({className:e,classnames:o,onChange:t,orientation:l="horizontal",ref:s,steps:d,value:x,...c})=>{const p=a.useMemo(()=>d.findIndex(g=>g.value===x),[d,x]);return n.jsx(el,{...c,ref:s,$orientation:l,className:ne("container",e),children:d.map((g,f)=>{const h=g.value===x,y=f<p,u=f===d.length-1;return n.jsxs(tl,{$orientation:l,children:[n.jsxs(ol,{type:"button",$active:h,$completed:y,$clickable:!!t,onClick:()=>t==null?void 0:t(g.value),className:ne("step",o==null?void 0:o.step),children:[n.jsx(rl,{$active:h,$completed:y,className:ne("circle",o==null?void 0:o.circle),children:f+1}),n.jsx(nl,{$active:h,$completed:y,className:ne("label",o==null?void 0:o.label),children:g.label})]}),!u&&n.jsx(il,{$completed:y,$orientation:l,className:ne("line",o==null?void 0:o.line)})]},g.value)})})},dl=i.styled.div`
|
|
1902
1579
|
display: flex;
|
|
1903
1580
|
align-items: center;
|
|
1904
1581
|
gap: 6px;
|
|
1905
|
-
`,
|
|
1582
|
+
`,sl=i.styled.button`
|
|
1906
1583
|
padding: 6px 16px;
|
|
1907
1584
|
border: none;
|
|
1908
1585
|
border-radius: 12px;
|
|
1909
|
-
background-color: ${e=>e.$active?
|
|
1910
|
-
color: ${
|
|
1586
|
+
background-color: ${e=>e.$active?r.COLORS.gray:"transparent"};
|
|
1587
|
+
color: ${r.COLORS.black};
|
|
1911
1588
|
font-size: 14px;
|
|
1912
1589
|
font-weight: 500;
|
|
1913
1590
|
line-height: 1.4;
|
|
@@ -1918,62 +1595,62 @@
|
|
|
1918
1595
|
opacity 0.15s ease;
|
|
1919
1596
|
|
|
1920
1597
|
&:hover:not(:disabled) {
|
|
1921
|
-
background-color: ${e=>e.$active?
|
|
1598
|
+
background-color: ${e=>e.$active?r.COLORS.gray:"rgba(0, 0, 0, 0.05)"};
|
|
1922
1599
|
}
|
|
1923
|
-
`,
|
|
1600
|
+
`,qe=C.newClassNameGetter("tabs"),al=({className:e,classnames:o,onChange:t,ref:l,tabs:s,value:d,...x})=>n.jsx(dl,{...x,ref:l,className:qe("container",e),role:"tablist",children:s.map(c=>n.jsx(sl,{type:"button",role:"tab","aria-selected":d===c.value,$active:d===c.value,$disabled:!!c.disabled,disabled:c.disabled,onClick:()=>t(c.value),className:qe("tab",o==null?void 0:o.tab),children:c.label},c.value))}),cl=i.styled.div`
|
|
1924
1601
|
display: flex;
|
|
1925
1602
|
flex-direction: column;
|
|
1926
|
-
`,
|
|
1603
|
+
`,pl=i.styled.div`
|
|
1927
1604
|
display: grid;
|
|
1928
1605
|
grid-template-columns: 20px 1fr;
|
|
1929
1606
|
gap: 0 12px;
|
|
1930
|
-
`,
|
|
1607
|
+
`,xl=i.styled.div`
|
|
1931
1608
|
display: flex;
|
|
1932
1609
|
flex-direction: column;
|
|
1933
1610
|
align-items: center;
|
|
1934
1611
|
grid-row: 1 / -1;
|
|
1935
|
-
`,
|
|
1612
|
+
`,ul=i.styled.div`
|
|
1936
1613
|
width: 10px;
|
|
1937
1614
|
height: 10px;
|
|
1938
1615
|
border-radius: 50%;
|
|
1939
|
-
background-color: ${
|
|
1616
|
+
background-color: ${r.COLORS.black};
|
|
1940
1617
|
flex-shrink: 0;
|
|
1941
1618
|
margin-top: 5px;
|
|
1942
|
-
`,
|
|
1619
|
+
`,gl=i.styled.div`
|
|
1943
1620
|
width: 2px;
|
|
1944
1621
|
flex: 1;
|
|
1945
|
-
background-color: ${
|
|
1622
|
+
background-color: ${r.COLORS.gray};
|
|
1946
1623
|
visibility: ${e=>e.$last?"hidden":"visible"};
|
|
1947
|
-
`,
|
|
1624
|
+
`,fl=i.styled.div`
|
|
1948
1625
|
padding-bottom: ${e=>e.$last?"0":"24px"};
|
|
1949
1626
|
min-width: 0;
|
|
1950
|
-
`,
|
|
1627
|
+
`,hl=i.styled.div`
|
|
1951
1628
|
display: flex;
|
|
1952
1629
|
align-items: flex-start;
|
|
1953
1630
|
justify-content: space-between;
|
|
1954
1631
|
gap: 8px;
|
|
1955
|
-
`,
|
|
1632
|
+
`,yl=i.styled.div`
|
|
1956
1633
|
font-size: 15px;
|
|
1957
1634
|
font-weight: 600;
|
|
1958
|
-
color: ${
|
|
1635
|
+
color: ${r.COLORS.black};
|
|
1959
1636
|
line-height: 20px;
|
|
1960
1637
|
min-width: 0;
|
|
1961
|
-
`,
|
|
1638
|
+
`,bl=i.styled.div`
|
|
1962
1639
|
display: flex;
|
|
1963
1640
|
align-items: center;
|
|
1964
1641
|
gap: 4px;
|
|
1965
1642
|
flex-shrink: 0;
|
|
1966
|
-
|
|
1643
|
+
`,$l=i.styled.div`
|
|
1967
1644
|
font-size: 13px;
|
|
1968
|
-
color: ${
|
|
1645
|
+
color: ${r.COLORS["iron-grey"]};
|
|
1969
1646
|
margin-top: 2px;
|
|
1970
1647
|
line-height: 1.4;
|
|
1971
|
-
`,
|
|
1648
|
+
`,Sl=i.styled.div`
|
|
1972
1649
|
font-size: 14px;
|
|
1973
|
-
color: ${
|
|
1650
|
+
color: ${r.COLORS["iron-grey"]};
|
|
1974
1651
|
margin-top: 8px;
|
|
1975
1652
|
line-height: 1.5;
|
|
1976
|
-
`,
|
|
1653
|
+
`,_=C.newClassNameGetter("timeline"),Ol=({className:e,classnames:o,items:t,ref:l,...s})=>n.jsx(cl,{...s,ref:l,className:_("container",e),children:t.map((d,x)=>{const c=x===t.length-1;return n.jsxs(pl,{className:_("item",o==null?void 0:o.item),children:[n.jsxs(xl,{$last:c,children:[n.jsx(ul,{className:_("dot",o==null?void 0:o.dot)}),n.jsx(gl,{className:_("line",o==null?void 0:o.line),$last:c})]}),n.jsxs(fl,{className:_("content",o==null?void 0:o.content),$last:c,children:[n.jsxs(hl,{children:[n.jsxs("div",{children:[n.jsx(yl,{className:_("title",o==null?void 0:o.title),children:d.title}),d.description&&n.jsx($l,{className:_("description",o==null?void 0:o.description),children:d.description})]}),d.actions&&n.jsx(bl,{className:_("actions",o==null?void 0:o.actions),children:d.actions})]}),d.content&&n.jsx(Sl,{className:_("body",o==null?void 0:o.body),children:d.content})]})]},x)})}),pt=a.createContext(null),ke=3,Ve={default:{background:"#374151",text:r.COLORS.white,border:"#374151"},success:{background:r.COLORS.green,text:r.COLORS.white,border:r.COLORS.green},warning:{background:r.COLORS.yellow,text:r.COLORS.white,border:r.COLORS.yellow},danger:{background:r.COLORS.red,text:r.COLORS.white,border:r.COLORS.red}},Cl=(e,o)=>{switch(o.type){case"ADD_TOAST":{const t=o.payload;return e.toasts.length<ke?{...e,toasts:[...e.toasts,t]}:{...e,queue:[...e.queue,t]}}case"REMOVE_TOAST":{const t=o.payload,l=e.toasts.filter(d=>d.id!==t),s=e.queue[0];return s&&l.length<ke?{toasts:[...l,s],queue:e.queue.slice(1)}:{...e,toasts:l}}case"SHOW_NEXT_FROM_QUEUE":{const t=e.queue[0];return!t||e.toasts.length>=ke?e:{toasts:[...e.toasts,t],queue:e.queue.slice(1)}}default:return e}},wl={toasts:[],queue:[]},Re=e=>Ve[e]??Ve.default,vl=i.styled.div`
|
|
1977
1654
|
position: fixed;
|
|
1978
1655
|
bottom: 24px;
|
|
1979
1656
|
left: 24px;
|
|
@@ -1984,30 +1661,30 @@
|
|
|
1984
1661
|
pointer-events: none;
|
|
1985
1662
|
width: auto;
|
|
1986
1663
|
max-width: 90vw;
|
|
1987
|
-
`,
|
|
1664
|
+
`,ml=i.styled.div`
|
|
1988
1665
|
display: flex;
|
|
1989
1666
|
align-items: center;
|
|
1990
1667
|
justify-content: space-between;
|
|
1991
1668
|
gap: 12px;
|
|
1992
1669
|
min-height: 32px;
|
|
1993
1670
|
padding: 8px 8px 8px 16px;
|
|
1994
|
-
background-color: ${({$variant:e})=>
|
|
1995
|
-
color: ${({$variant:e})=>
|
|
1996
|
-
border: 1px solid ${({$variant:e})=>
|
|
1671
|
+
background-color: ${({$variant:e})=>Re(e).background};
|
|
1672
|
+
color: ${({$variant:e})=>Re(e).text};
|
|
1673
|
+
border: 1px solid ${({$variant:e})=>Re(e).border};
|
|
1997
1674
|
border-radius: 96px;
|
|
1998
1675
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
|
|
1999
|
-
animation: ${({$isExiting:e})=>e?
|
|
1676
|
+
animation: ${({$isExiting:e})=>e?r.KEYFRAMES.slideOutBottomFade:r.KEYFRAMES.slideInBottomFade}
|
|
2000
1677
|
0.3s ease-out;
|
|
2001
1678
|
pointer-events: auto;
|
|
2002
1679
|
max-width: 500px;
|
|
2003
|
-
`,
|
|
1680
|
+
`,kl=i.styled.span`
|
|
2004
1681
|
font-size: 14px;
|
|
2005
1682
|
font-weight: 500;
|
|
2006
1683
|
line-height: 1.4;
|
|
2007
1684
|
white-space: nowrap;
|
|
2008
1685
|
overflow: hidden;
|
|
2009
1686
|
text-overflow: ellipsis;
|
|
2010
|
-
`,
|
|
1687
|
+
`,Rl=i.styled.button`
|
|
2011
1688
|
display: flex;
|
|
2012
1689
|
align-items: center;
|
|
2013
1690
|
justify-content: center;
|
|
@@ -2025,20 +1702,20 @@
|
|
|
2025
1702
|
&:hover {
|
|
2026
1703
|
opacity: 1;
|
|
2027
1704
|
}
|
|
2028
|
-
`,
|
|
1705
|
+
`,Ll=i.styled.div`
|
|
2029
1706
|
display: flex;
|
|
2030
1707
|
align-items: center;
|
|
2031
1708
|
justify-content: space-between;
|
|
2032
1709
|
gap: 12px;
|
|
2033
1710
|
width: 100%;
|
|
2034
|
-
`,
|
|
1711
|
+
`,jl=i.styled.div`
|
|
2035
1712
|
display: flex;
|
|
2036
1713
|
align-items: center;
|
|
2037
1714
|
justify-content: center;
|
|
2038
1715
|
min-height: 32px;
|
|
2039
1716
|
padding: 8px 16px;
|
|
2040
1717
|
background-color: #374151;
|
|
2041
|
-
color: ${
|
|
1718
|
+
color: ${r.COLORS.white};
|
|
2042
1719
|
border-radius: 96px;
|
|
2043
1720
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
|
|
2044
1721
|
pointer-events: auto;
|
|
@@ -2046,58 +1723,58 @@
|
|
|
2046
1723
|
font-weight: 500;
|
|
2047
1724
|
white-space: nowrap;
|
|
2048
1725
|
margin-left: auto;
|
|
2049
|
-
`,
|
|
1726
|
+
`,Ze=({toast:e,onHide:o})=>{const[t,l]=a.useState(!1),s=()=>{l(!0),setTimeout(()=>{o(e.id)},300)};return a.useEffect(()=>{if(e.duration){const d=setTimeout(()=>{s()},e.duration);return()=>clearTimeout(d)}},[e.duration,e.id]),n.jsxs(ml,{$variant:e.variant,$isExiting:t,children:[n.jsx(kl,{children:e.message}),n.jsx(Rl,{onClick:s,children:n.jsx(n.X,{style:{width:16,height:16}})})]})},Nl=({toasts:e,queueCount:o,onHide:t})=>{if(e.length===0)return null;const l=e.length-1;return n.jsx(vl,{children:e.map((s,d)=>d===l&&o>0?n.jsxs(Ll,{children:[n.jsx(Ze,{toast:s,onHide:t}),n.jsxs(jl,{children:["+",o]})]},s.id):n.jsx(Ze,{toast:s,onHide:t},s.id))})},El=({children:e})=>{const[o,t]=a.useReducer(Cl,wl),l=a.useCallback((d,x="default",c)=>{const p=`toast-${Date.now()}-${Math.random().toString(36).substr(2,9)}`;t({type:"ADD_TOAST",payload:{id:p,message:d,variant:x,duration:c}})},[]),s=a.useCallback(d=>{t({type:"REMOVE_TOAST",payload:d})},[]);return n.jsxs(pt.Provider,{value:{show:l,hide:s},children:[e,n.jsx(Nl,{toasts:o.toasts,queueCount:o.queue.length,onHide:s})]})},Il=()=>{const e=a.useContext(pt);if(!e)throw new Error("useToastr must be used within ToastProvider");return e},Qe={dark:{background:r.COLORS.black,text:r.COLORS.white},light:{background:r.COLORS.white,text:r.COLORS.black,border:r.COLORS.gray},success:{background:r.COLORS.green,text:r.COLORS.white},warning:{background:r.COLORS.yellow,text:r.COLORS.white},danger:{background:r.COLORS.red,text:r.COLORS.white}},ie=e=>Qe[e]??Qe.dark,Tl=(e,o)=>{const t=ie(o).background;switch(e){case"top":return`
|
|
2050
1727
|
bottom: -12px;
|
|
2051
1728
|
left: 50%;
|
|
2052
1729
|
margin-left: -6px;
|
|
2053
|
-
border-top-color: ${
|
|
1730
|
+
border-top-color: ${t};
|
|
2054
1731
|
`;case"bottom":return`
|
|
2055
1732
|
top: -12px;
|
|
2056
1733
|
left: 50%;
|
|
2057
1734
|
margin-left: -6px;
|
|
2058
|
-
border-bottom-color: ${
|
|
1735
|
+
border-bottom-color: ${t};
|
|
2059
1736
|
`;case"left":return`
|
|
2060
1737
|
right: -12px;
|
|
2061
1738
|
top: 50%;
|
|
2062
1739
|
margin-top: -6px;
|
|
2063
|
-
border-left-color: ${
|
|
1740
|
+
border-left-color: ${t};
|
|
2064
1741
|
`;case"right":return`
|
|
2065
1742
|
left: -12px;
|
|
2066
1743
|
top: 50%;
|
|
2067
1744
|
margin-top: -6px;
|
|
2068
|
-
border-right-color: ${
|
|
2069
|
-
`;default:return""}},
|
|
1745
|
+
border-right-color: ${t};
|
|
1746
|
+
`;default:return""}},zl=(e,o)=>{if(o!=="light")return"";const t=ie(o).border;switch(e){case"top":return`
|
|
2070
1747
|
&::after {
|
|
2071
1748
|
bottom: -14px;
|
|
2072
1749
|
left: 50%;
|
|
2073
1750
|
margin-left: -7px;
|
|
2074
|
-
border-top-color: ${
|
|
1751
|
+
border-top-color: ${t};
|
|
2075
1752
|
}
|
|
2076
1753
|
`;case"bottom":return`
|
|
2077
1754
|
&::after {
|
|
2078
1755
|
top: -14px;
|
|
2079
1756
|
left: 50%;
|
|
2080
1757
|
margin-left: -7px;
|
|
2081
|
-
border-bottom-color: ${
|
|
1758
|
+
border-bottom-color: ${t};
|
|
2082
1759
|
}
|
|
2083
1760
|
`;case"left":return`
|
|
2084
1761
|
&::after {
|
|
2085
1762
|
right: -14px;
|
|
2086
1763
|
top: 50%;
|
|
2087
1764
|
margin-top: -7px;
|
|
2088
|
-
border-left-color: ${
|
|
1765
|
+
border-left-color: ${t};
|
|
2089
1766
|
}
|
|
2090
1767
|
`;case"right":return`
|
|
2091
1768
|
&::after {
|
|
2092
1769
|
left: -14px;
|
|
2093
1770
|
top: 50%;
|
|
2094
1771
|
margin-top: -7px;
|
|
2095
|
-
border-right-color: ${
|
|
1772
|
+
border-right-color: ${t};
|
|
2096
1773
|
}
|
|
2097
|
-
`;default:return""}},
|
|
1774
|
+
`;default:return""}},xt=e=>`
|
|
2098
1775
|
padding: 6px 12px;
|
|
2099
|
-
background-color: ${
|
|
2100
|
-
color: ${
|
|
1776
|
+
background-color: ${ie(e.$variant).background};
|
|
1777
|
+
color: ${ie(e.$variant).text};
|
|
2101
1778
|
font-size: 13px;
|
|
2102
1779
|
line-height: 1.4;
|
|
2103
1780
|
border-radius: 6px;
|
|
@@ -2111,7 +1788,7 @@
|
|
|
2111
1788
|
transition: opacity 0.2s ease-in-out, visibility 0.2s ease-in-out;
|
|
2112
1789
|
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
|
|
2113
1790
|
|
|
2114
|
-
${e.$variant==="light"?`border: 1px solid ${
|
|
1791
|
+
${e.$variant==="light"?`border: 1px solid ${ie(e.$variant).border};`:""}
|
|
2115
1792
|
|
|
2116
1793
|
&::before {
|
|
2117
1794
|
content: '';
|
|
@@ -2119,7 +1796,7 @@
|
|
|
2119
1796
|
width: 0;
|
|
2120
1797
|
height: 0;
|
|
2121
1798
|
border: 6px solid transparent;
|
|
2122
|
-
${
|
|
1799
|
+
${Tl(e.$placement,e.$variant)}
|
|
2123
1800
|
}
|
|
2124
1801
|
|
|
2125
1802
|
${e.$variant==="light"?`
|
|
@@ -2132,12 +1809,12 @@
|
|
|
2132
1809
|
}
|
|
2133
1810
|
`:""}
|
|
2134
1811
|
|
|
2135
|
-
${
|
|
2136
|
-
`,
|
|
1812
|
+
${zl(e.$placement,e.$variant)}
|
|
1813
|
+
`,Al=i.styled.div`
|
|
2137
1814
|
position: relative;
|
|
2138
1815
|
display: inline-block;
|
|
2139
1816
|
width: fit-content;
|
|
2140
|
-
`,
|
|
1817
|
+
`,Pl=e=>{switch(e){case"top":return`
|
|
2141
1818
|
bottom: calc(100% + 8px);
|
|
2142
1819
|
left: 50%;
|
|
2143
1820
|
transform: translateX(-50%);
|
|
@@ -2153,31 +1830,31 @@
|
|
|
2153
1830
|
left: calc(100% + 8px);
|
|
2154
1831
|
top: 50%;
|
|
2155
1832
|
transform: translateY(-50%);
|
|
2156
|
-
`;default:return""}},
|
|
1833
|
+
`;default:return""}},Bl=i.styled.div`
|
|
2157
1834
|
position: absolute;
|
|
2158
|
-
z-index: ${
|
|
2159
|
-
${e=>
|
|
2160
|
-
${({$placement:e})=>
|
|
2161
|
-
`,
|
|
1835
|
+
z-index: ${r.Z_INDEX.dropdown};
|
|
1836
|
+
${e=>xt(e)}
|
|
1837
|
+
${({$placement:e})=>Pl(e)}
|
|
1838
|
+
`,Dl=i.styled.div`
|
|
2162
1839
|
position: fixed;
|
|
2163
|
-
z-index: ${
|
|
2164
|
-
${e=>
|
|
2165
|
-
`,
|
|
1840
|
+
z-index: ${r.Z_INDEX.portalDropdown};
|
|
1841
|
+
${e=>xt(e)}
|
|
1842
|
+
`,Le=C.newClassNameGetter("tooltip"),X=8,Ml=({children:e,className:o,classnames:t,content:l,delay:s=200,placement:d="top",portalRenderNode:x,ref:c,variant:p="dark",...g})=>{const[f,h]=a.useState(!1),[y,u]=a.useState(null),[S,b]=a.useState(d),[$,w]=a.useState({top:0,left:0}),R=a.useRef(null),k=a.useRef(null),N=a.useCallback(()=>{var G,H;if(!R.current)return;const v=R.current.getBoundingClientRect(),j=((G=k.current)==null?void 0:G.offsetWidth)??100,O=((H=k.current)==null?void 0:H.offsetHeight)??30,T=v.top-X,E=window.innerHeight-v.bottom-X,A=v.left-X,M=window.innerWidth-v.right-X;let P=d;if(d==="top"&&T<O&&E>T?P="bottom":d==="bottom"&&E<O&&T>E?P="top":d==="left"&&A<j&&M>A?P="right":d==="right"&&M<j&&A>M&&(P="left"),b(P),x){let B,D;switch(P){case"top":B=v.top-O-X,D=v.left+v.width/2-j/2;break;case"bottom":B=v.bottom+X,D=v.left+v.width/2-j/2;break;case"left":B=v.top+v.height/2-O/2,D=v.left-j-X;break;case"right":B=v.top+v.height/2-O/2,D=v.right+X;break;default:B=0,D=0}const U=8;D=Math.max(U,Math.min(D,window.innerWidth-j-U)),B=Math.max(U,Math.min(B,window.innerHeight-O-U)),w({top:B,left:D})}},[d,x]);a.useLayoutEffect(()=>{f&&N()},[f,N]);const I=()=>{const v=setTimeout(()=>{h(!0)},s);u(v)},L=()=>{y&&(clearTimeout(y),u(null)),h(!1)},m=x?Ne.createPortal(n.jsx(Dl,{ref:k,className:Le("content",t==null?void 0:t.content),$placement:S,$variant:p,$visible:f,style:{top:$.top,left:$.left},children:l}),x):n.jsx(Bl,{ref:k,className:Le("content",t==null?void 0:t.content),$placement:S,$variant:p,$visible:f,children:l});return n.jsxs(Al,{...g,ref:v=>{R.current=v,typeof c=="function"?c(v):c&&(c.current=v)},className:Le("wrapper",o),onMouseEnter:I,onMouseLeave:L,children:[e,m]})},_l=i.styled.div`
|
|
2166
1843
|
display: inline-flex;
|
|
2167
1844
|
align-items: center;
|
|
2168
1845
|
gap: 12px;
|
|
2169
1846
|
flex-direction: ${({$reverse:e})=>e?"row-reverse":"row"};
|
|
2170
|
-
`,
|
|
1847
|
+
`,Fl=i.styled.div`
|
|
2171
1848
|
display: flex;
|
|
2172
1849
|
flex-direction: column;
|
|
2173
1850
|
text-align: ${({$align:e})=>e};
|
|
2174
|
-
`,
|
|
1851
|
+
`,Gl=i.styled.span`
|
|
2175
1852
|
font-size: 14px;
|
|
2176
1853
|
font-weight: 600;
|
|
2177
1854
|
line-height: 1.4;
|
|
2178
|
-
`,
|
|
1855
|
+
`,Hl=i.styled.span`
|
|
2179
1856
|
font-size: 12px;
|
|
2180
1857
|
color: #666;
|
|
2181
1858
|
line-height: 1.4;
|
|
2182
|
-
`,
|
|
1859
|
+
`,ye=C.newClassNameGetter("user"),Ul=({avatarPosition:e="left",avatarProps:o,className:t,classnames:l,description:s,name:d,ref:x,src:c,...p})=>{const g=e==="right";return n.jsxs(_l,{...p,ref:x,className:ye("container",t),$reverse:g,children:[n.jsx(et,{size:"sm",...o,name:typeof d=="string"?d:void 0,src:c??(o==null?void 0:o.src),className:ye("avatar",l==null?void 0:l.avatar)}),n.jsxs(Fl,{$align:g?"right":"left",children:[n.jsx(Gl,{className:ye("name",l==null?void 0:l.name),children:d}),s&&n.jsx(Hl,{className:ye("description",l==null?void 0:l.description),children:s})]})]})};exports.BREAKPOINTS=r.BREAKPOINTS;exports.COLORS=r.COLORS;exports.KEYFRAMES=r.KEYFRAMES;exports.KEY_SYMBOLS=r.KEY_SYMBOLS;exports.Z_INDEX=r.Z_INDEX;exports.alpha=r.alpha;exports.getBrowser=r.getBrowser;exports.getKeySymbols=r.getKeySymbols;exports.getOperatingSystem=r.getOperatingSystem;exports.isValid=r.isValid;exports.toHEX=r.toHEX;exports.useKeyBinding=r.useKeyBinding;exports.mediaBetween=F.mediaBetween;exports.mediaDown=F.mediaDown;exports.mediaUp=F.mediaUp;exports.validation=F.index;exports.Autocomplete=i.Autocomplete;exports.Button=i.Button;exports.Checkbox=i.Checkbox;exports.CheckboxCard=i.CheckboxCard;exports.CheckboxGroup=i.CheckboxGroup;exports.Chip=i.Chip;exports.DatePicker=i.DatePicker;exports.FieldLabel=i.FieldLabel;exports.FieldMessage=i.FieldMessage;exports.Input=i.Input;exports.KeySymbol=i.KeySymbol;exports.KeysBindings=i.KeysBindings;exports.Modal=i.Modal;exports.MultiSelect=i.MultiSelect;exports.OtpCode=i.OtpCode;exports.Radio=i.Radio;exports.RadioCard=i.RadioCard;exports.RadioGroup=i.RadioGroup;exports.Select=i.Select;exports.Spinner=i.Spinner;exports.Tags=i.Tags;exports.Textarea=i.Textarea;exports.Toggle=i.Toggle;exports.ToggleCard=i.ToggleCard;exports.ToggleGroup=i.ToggleGroup;exports.formatDateGo=i.formatDateGo;exports.newClassNameGetter=C.newClassNameGetter;exports.Accordion=vt;exports.Alert=It;exports.Avatar=et;exports.AvatarGroup=_t;exports.Badge=Xt;exports.BreadcrumbItem=Yt;exports.Breadcrumbs=eo;exports.Card=so;exports.CardBody=co;exports.CardFooter=xo;exports.CardHeader=go;exports.ConfirmationProvider=Ro;exports.Container=Eo;exports.DateRange=Ao;exports.Divider=Do;exports.Drawer=Ho;exports.Dropdown=qo;exports.EmptyState=nr;exports.FieldRow=dr;exports.FileUpload=Er;exports.FileUploadItem=Ar;exports.GlobalStyle=ft;exports.Hashtag=_r;exports.Heading=Hr;exports.MenuButton=Xr;exports.NotificationProvider=on;exports.NotifyConfirmationProvider=fn;exports.Overline=Sn;exports.Pagination=Dn;exports.Panel=Wn;exports.PendingScreen=gi;exports.Progress=yi;exports.SaveProgressProvider=Si;exports.ShellScreen=En;exports.Skeleton=Ni;exports.SplitFlapText=at;exports.Stat=zi;exports.StepLog=Ji;exports.Stepper=ll;exports.Tabs=al;exports.Timeline=Ol;exports.ToastProvider=El;exports.Tooltip=Ml;exports.User=Ul;exports.formatFileSize=nt;exports.useConfirmation=Lo;exports.useNotification=rn;exports.useNotifyConfirmation=hn;exports.useSaveProgress=Oi;exports.useToastr=Il;
|
|
2183
1860
|
//# sourceMappingURL=index.cjs.map
|