@vacano/ui 1.4.2 → 1.4.3
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/dist/index.cjs +234 -215
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.ts +15 -0
- package/dist/index.js +781 -736
- package/dist/index.js.map +1 -1
- package/package.json +8 -8
package/dist/index.cjs
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("./X-CI1qRJDP.cjs"),ie=require("@emotion/react"),g=require("react"),t=require("./media-OVL6YjWb.cjs"),I=require("./tooling-Dflq0Y98.cjs"),ge=require("react-dom");function
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("./X-CI1qRJDP.cjs"),ie=require("@emotion/react"),g=require("react"),t=require("./media-OVL6YjWb.cjs"),I=require("./tooling-Dflq0Y98.cjs"),ge=require("react-dom");function Zo(e){const o=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const r in e)if(r!=="default"){const i=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(o,r,i.get?i:{enumerable:!0,get:()=>e[r]})}}return o.default=e,Object.freeze(o)}const we=Zo(g);function Ot(){return Ot=Object.assign?Object.assign.bind():function(e){for(var o=1;o<arguments.length;o++){var r=arguments[o];for(var i in r)({}).hasOwnProperty.call(r,i)&&(e[i]=r[i])}return e},Ot.apply(null,arguments)}const Jo=ie.css`
|
|
2
2
|
*,
|
|
3
3
|
*::before,
|
|
4
4
|
*::after {
|
|
@@ -141,13 +141,13 @@
|
|
|
141
141
|
:focus:not(:focus-visible) {
|
|
142
142
|
outline: none;
|
|
143
143
|
}
|
|
144
|
-
`,
|
|
144
|
+
`,Qo=()=>a.jsx(ie.Global,{styles:Jo});var er=/^((children|dangerouslySetInnerHTML|key|ref|autoFocus|defaultValue|defaultChecked|innerHTML|suppressContentEditableWarning|suppressHydrationWarning|valueLink|abbr|accept|acceptCharset|accessKey|action|allow|allowUserMedia|allowPaymentRequest|allowFullScreen|allowTransparency|alt|async|autoComplete|autoPlay|capture|cellPadding|cellSpacing|challenge|charSet|checked|cite|classID|className|cols|colSpan|content|contentEditable|contextMenu|controls|controlsList|coords|crossOrigin|data|dateTime|decoding|default|defer|dir|disabled|disablePictureInPicture|disableRemotePlayback|download|draggable|encType|enterKeyHint|fetchpriority|fetchPriority|form|formAction|formEncType|formMethod|formNoValidate|formTarget|frameBorder|headers|height|hidden|high|href|hrefLang|htmlFor|httpEquiv|id|inputMode|integrity|is|keyParams|keyType|kind|label|lang|list|loading|loop|low|marginHeight|marginWidth|max|maxLength|media|mediaGroup|method|min|minLength|multiple|muted|name|nonce|noValidate|open|optimum|pattern|placeholder|playsInline|popover|popoverTarget|popoverTargetAction|poster|preload|profile|radioGroup|readOnly|referrerPolicy|rel|required|reversed|role|rows|rowSpan|sandbox|scope|scoped|scrolling|seamless|selected|shape|size|sizes|slot|span|spellCheck|src|srcDoc|srcLang|srcSet|start|step|style|summary|tabIndex|target|title|translate|type|useMap|value|width|wmode|wrap|about|datatype|inlist|prefix|property|resource|typeof|vocab|autoCapitalize|autoCorrect|autoSave|color|incremental|fallback|inert|itemProp|itemScope|itemType|itemID|itemRef|on|option|results|security|unselectable|accentHeight|accumulate|additive|alignmentBaseline|allowReorder|alphabetic|amplitude|arabicForm|ascent|attributeName|attributeType|autoReverse|azimuth|baseFrequency|baselineShift|baseProfile|bbox|begin|bias|by|calcMode|capHeight|clip|clipPathUnits|clipPath|clipRule|colorInterpolation|colorInterpolationFilters|colorProfile|colorRendering|contentScriptType|contentStyleType|cursor|cx|cy|d|decelerate|descent|diffuseConstant|direction|display|divisor|dominantBaseline|dur|dx|dy|edgeMode|elevation|enableBackground|end|exponent|externalResourcesRequired|fill|fillOpacity|fillRule|filter|filterRes|filterUnits|floodColor|floodOpacity|focusable|fontFamily|fontSize|fontSizeAdjust|fontStretch|fontStyle|fontVariant|fontWeight|format|from|fr|fx|fy|g1|g2|glyphName|glyphOrientationHorizontal|glyphOrientationVertical|glyphRef|gradientTransform|gradientUnits|hanging|horizAdvX|horizOriginX|ideographic|imageRendering|in|in2|intercept|k|k1|k2|k3|k4|kernelMatrix|kernelUnitLength|kerning|keyPoints|keySplines|keyTimes|lengthAdjust|letterSpacing|lightingColor|limitingConeAngle|local|markerEnd|markerMid|markerStart|markerHeight|markerUnits|markerWidth|mask|maskContentUnits|maskUnits|mathematical|mode|numOctaves|offset|opacity|operator|order|orient|orientation|origin|overflow|overlinePosition|overlineThickness|panose1|paintOrder|pathLength|patternContentUnits|patternTransform|patternUnits|pointerEvents|points|pointsAtX|pointsAtY|pointsAtZ|preserveAlpha|preserveAspectRatio|primitiveUnits|r|radius|refX|refY|renderingIntent|repeatCount|repeatDur|requiredExtensions|requiredFeatures|restart|result|rotate|rx|ry|scale|seed|shapeRendering|slope|spacing|specularConstant|specularExponent|speed|spreadMethod|startOffset|stdDeviation|stemh|stemv|stitchTiles|stopColor|stopOpacity|strikethroughPosition|strikethroughThickness|string|stroke|strokeDasharray|strokeDashoffset|strokeLinecap|strokeLinejoin|strokeMiterlimit|strokeOpacity|strokeWidth|surfaceScale|systemLanguage|tableValues|targetX|targetY|textAnchor|textDecoration|textRendering|textLength|to|transform|u1|u2|underlinePosition|underlineThickness|unicode|unicodeBidi|unicodeRange|unitsPerEm|vAlphabetic|vHanging|vIdeographic|vMathematical|values|vectorEffect|version|vertAdvY|vertOriginX|vertOriginY|viewBox|viewTarget|visibility|widths|wordSpacing|writingMode|x|xHeight|x1|x2|xChannelSelector|xlinkActuate|xlinkArcrole|xlinkHref|xlinkRole|xlinkShow|xlinkTitle|xlinkType|xmlBase|xmlns|xmlnsXlink|xmlLang|xmlSpace|y|y1|y2|yChannelSelector|z|zoomAndPan|for|class|autofocus)|(([Dd][Aa][Tt][Aa]|[Aa][Rr][Ii][Aa]|x)-.*))$/,tr=a.memoize(function(e){return er.test(e)||e.charCodeAt(0)===111&&e.charCodeAt(1)===110&&e.charCodeAt(2)<91}),or=tr,rr=function(o){return o!=="theme"},Lt=function(o){return typeof o=="string"&&o.charCodeAt(0)>96?or:rr},Pt=function(o,r,i){var n;if(r){var l=r.shouldForwardProp;n=o.__emotion_forwardProp&&l?function(c){return o.__emotion_forwardProp(c)&&l(c)}:l}return typeof n!="function"&&i&&(n=o.__emotion_forwardProp),n},ir=function(o){var r=o.cache,i=o.serialized,n=o.isStringTag;return a.registerStyles(r,i,n),a.useInsertionEffectAlwaysWithSyncFallback(function(){return a.insertStyles(r,i,n)}),null},nr=function e(o,r){var i=o.__emotion_real===o,n=i&&o.__emotion_base||o,l,c;r!==void 0&&(l=r.label,c=r.target);var d=Pt(o,r,i),p=d||Lt(n),b=!p("as");return function(){var h=arguments,f=i&&o.__emotion_styles!==void 0?o.__emotion_styles.slice(0):[];if(l!==void 0&&f.push("label:"+l+";"),h[0]==null||h[0].raw===void 0)f.push.apply(f,h);else{var O=h[0];f.push(O[0]);for(var w=h.length,y=1;y<w;y++)f.push(h[y],O[y])}var S=ie.withEmotionCache(function(v,x,$){var u=b&&v.as||n,P="",j=[],T=v;if(v.theme==null){T={};for(var Y in v)T[Y]=v[Y];T.theme=we.useContext(ie.ThemeContext)}typeof v.className=="string"?P=a.getRegisteredStyles(x.registered,j,v.className):v.className!=null&&(P=v.className+" ");var z=a.serializeStyles(f.concat(j),x.registered,T);P+=x.key+"-"+z.name,c!==void 0&&(P+=" "+c);var D=b&&d===void 0?Lt(u):p,E={};for(var R in v)b&&R==="as"||D(R)&&(E[R]=v[R]);return E.className=P,$&&(E.ref=$),we.createElement(we.Fragment,null,we.createElement(ir,{cache:x,serialized:z,isStringTag:typeof u=="string"}),we.createElement(u,E))});return S.displayName=l!==void 0?l:"Styled("+(typeof n=="string"?n:n.displayName||n.name||"Component")+")",S.defaultProps=o.defaultProps,S.__emotion_real=S,S.__emotion_base=n,S.__emotion_styles=f,S.__emotion_forwardProp=d,Object.defineProperty(S,"toString",{value:function(){return"."+c}}),S.withComponent=function(v,x){var $=e(v,Ot({},r,x,{shouldForwardProp:Pt(S,x,!0)}));return $.apply(void 0,f)},S}},ar=["a","abbr","address","area","article","aside","audio","b","base","bdi","bdo","big","blockquote","body","br","button","canvas","caption","cite","code","col","colgroup","data","datalist","dd","del","details","dfn","dialog","div","dl","dt","em","embed","fieldset","figcaption","figure","footer","form","h1","h2","h3","h4","h5","h6","head","header","hgroup","hr","html","i","iframe","img","input","ins","kbd","keygen","label","legend","li","link","main","map","mark","marquee","menu","menuitem","meta","meter","nav","noscript","object","ol","optgroup","option","output","p","param","picture","pre","progress","q","rp","rt","ruby","s","samp","script","section","select","small","source","span","strong","style","sub","summary","sup","table","tbody","td","textarea","tfoot","th","thead","time","title","tr","track","u","ul","var","video","wbr","circle","clipPath","defs","ellipse","foreignObject","g","image","line","linearGradient","mask","path","pattern","polygon","polyline","radialGradient","rect","stop","svg","text","tspan"],s=nr.bind(null);ar.forEach(function(e){s[e]=s(e)});const zt={compact:{height:"32px",padding:"0 8px",radius:"12px",iconSize:"16px"},default:{height:"40px",padding:"0 12px",radius:"16px",iconSize:"20px"}},jt={normal:{background:{static:t.COLORS["steel-blue"],hover:t.alpha(t.COLORS["steel-blue"],90),active:t.alpha(t.COLORS["steel-blue"],80),disabled:t.alpha(t.COLORS["steel-blue"],50)},color:{static:t.COLORS.white,hover:t.COLORS.white,active:t.COLORS.white,disabled:t.COLORS.white},borderColor:{static:"transparent",hover:"transparent",active:"transparent",disabled:"transparent"}},system:{background:{static:t.COLORS.black,hover:t.alpha(t.COLORS.black,90),active:t.alpha(t.COLORS.black,80),disabled:t.alpha(t.COLORS.black,50)},color:{static:t.COLORS.white,hover:t.COLORS.white,active:t.COLORS.white,disabled:t.COLORS.white},borderColor:{static:"transparent",hover:"transparent",active:"transparent",disabled:"transparent"}},success:{background:{static:t.COLORS.green,hover:t.alpha(t.COLORS.green,90),active:t.alpha(t.COLORS.green,80),disabled:t.alpha(t.COLORS.green,50)},color:{static:t.COLORS.white,hover:t.COLORS.white,active:t.COLORS.white,disabled:t.COLORS.white},borderColor:{static:"transparent",hover:"transparent",active:"transparent",disabled:"transparent"}},warning:{background:{static:t.COLORS.yellow,hover:t.alpha(t.COLORS.yellow,90),active:t.alpha(t.COLORS.yellow,80),disabled:t.alpha(t.COLORS.yellow,50)},color:{static:t.COLORS.black,hover:t.COLORS.black,active:t.COLORS.black,disabled:t.COLORS.black},borderColor:{static:"transparent",hover:"transparent",active:"transparent",disabled:"transparent"}},danger:{background:{static:t.COLORS.red,hover:t.alpha(t.COLORS.red,90),active:t.alpha(t.COLORS.red,80),disabled:t.alpha(t.COLORS.red,50)},color:{static:t.COLORS.white,hover:t.COLORS.white,active:t.COLORS.white,disabled:t.COLORS.white},borderColor:{static:"transparent",hover:"transparent",active:"transparent",disabled:"transparent"}},transparent:{background:{static:t.alpha(t.COLORS["iron-grey"],1),hover:t.alpha(t.COLORS["iron-grey"],5),active:t.alpha(t.COLORS["iron-grey"],10),disabled:t.alpha(t.COLORS["iron-grey"],5)},color:{static:t.COLORS.black,hover:t.COLORS.black,active:t.COLORS.black,disabled:t.alpha(t.COLORS.black,30)},borderColor:{static:t.alpha(t.COLORS["iron-grey"],20),hover:t.alpha(t.COLORS["iron-grey"],20),active:t.alpha(t.COLORS["iron-grey"],20),disabled:t.alpha(t.COLORS["iron-grey"],10)}}},J=e=>{const o=jt[e];return o||jt.normal},oe=e=>{const o=zt[e];return o||zt.default},lr=e=>e?"auto":"fit-content",dr=s.button`
|
|
145
145
|
display: flex;
|
|
146
146
|
gap: 6px;
|
|
147
147
|
text-decoration: none;
|
|
148
148
|
align-items: center;
|
|
149
149
|
justify-content: center;
|
|
150
|
-
width: ${e=>e.$iconOnly?oe(e.$size).height:
|
|
150
|
+
width: ${e=>e.$iconOnly?oe(e.$size).height:lr(!!e.$fullWidth)};
|
|
151
151
|
color: ${e=>J(e.$variant).color.static};
|
|
152
152
|
background-color: ${e=>J(e.$variant).background.static};
|
|
153
153
|
height: ${e=>oe(e.$size).height};
|
|
@@ -177,7 +177,7 @@
|
|
|
177
177
|
background-color: ${e=>J(e.$variant).background.disabled};
|
|
178
178
|
border-color: ${e=>J(e.$variant).borderColor.disabled};
|
|
179
179
|
}
|
|
180
|
-
`,
|
|
180
|
+
`,cr=s.div`
|
|
181
181
|
display: grid;
|
|
182
182
|
place-items: center;
|
|
183
183
|
width: ${e=>oe(e.$size).iconSize};
|
|
@@ -187,19 +187,19 @@
|
|
|
187
187
|
width: ${e=>oe(e.$size).iconSize};
|
|
188
188
|
height: ${e=>oe(e.$size).iconSize};
|
|
189
189
|
}
|
|
190
|
-
`,
|
|
190
|
+
`,sr=s.span`
|
|
191
191
|
font-weight: 600;
|
|
192
192
|
overflow: hidden;
|
|
193
193
|
white-space: nowrap;
|
|
194
194
|
text-overflow: ellipsis;
|
|
195
|
-
`,
|
|
195
|
+
`,pr=s(a.LoaderCircle)`
|
|
196
196
|
width: ${e=>oe(e.$size).iconSize};
|
|
197
197
|
height: ${e=>oe(e.$size).iconSize};
|
|
198
198
|
animation: ${t.KEYFRAMES.rotate} 0.8s linear infinite;
|
|
199
|
-
`,
|
|
199
|
+
`,ur=s.div`
|
|
200
200
|
display: flex;
|
|
201
201
|
gap: 3px;
|
|
202
|
-
`,
|
|
202
|
+
`,hr=s.span`
|
|
203
203
|
text-align: center;
|
|
204
204
|
display: flex;
|
|
205
205
|
justify-content: center;
|
|
@@ -212,12 +212,12 @@
|
|
|
212
212
|
border-radius: 4px;
|
|
213
213
|
width: fit-content;
|
|
214
214
|
background-color: ${e=>e.$variant==="light"?t.alpha(t.COLORS.white,25):t.alpha(t.COLORS.black,25)};
|
|
215
|
-
`,
|
|
215
|
+
`,br=I.newClassNameGetter("key-symbol"),bo=({className:e,ref:o,symbol:r,variant:i="light",...n})=>r?a.jsx(hr,{...n,ref:o,className:br("container",e),$variant:i,children:r}):null,Et=I.newClassNameGetter("key-bindings"),go=({className:e,classnames:o,keys:r,ref:i,variant:n,...l})=>{const c=g.useMemo(()=>t.getKeySymbols(r),[r]);return c.length===0?null:a.jsx(ur,{...l,ref:i,className:Et("container",e),children:c.map(d=>a.jsx(bo,{symbol:d,className:Et("item",o==null?void 0:o.item),variant:n},d))})},Tt=I.newClassNameGetter("button"),Ie=({children:e,className:o,classnames:r,disabled:i,fullWidth:n,icon:l,loading:c,onClick:d,ref:p=null,keyBindings:b=[],size:h="default",type:f="button",variant:O="normal",...w})=>{const y=g.useRef(null);g.useImperativeHandle(p,()=>y.current,[]),t.useKeyBinding(b,()=>{var v;(v=y.current)==null||v.click()});const S=g.useMemo(()=>{switch(f){case"link":return"button";default:return f}},[f]);return a.jsxs(dr,{...w,onClick:d,ref:y,type:S,disabled:i,className:Tt("container",o),$variant:O,$size:h,$fullWidth:!!n,$iconOnly:!!l&&!(e||(b==null?void 0:b.length)>0),children:[c&&a.jsx(pr,{$size:h}),l&&!c&&a.jsx(cr,{$size:h,children:l}),e&&a.jsx(sr,{className:Tt("label",r==null?void 0:r.label),children:e}),a.jsx(go,{keys:b,variant:O==="system"?"light":"dark"})]})},gr=s.div`
|
|
216
216
|
background-color: ${t.COLORS.white};
|
|
217
217
|
border-radius: 16px;
|
|
218
218
|
border: ${e=>e.$border?`1px solid ${t.alpha(t.COLORS["iron-grey"],15)}`:"none"};
|
|
219
219
|
box-shadow: ${e=>e.$shadow?`0 2px 8px ${t.alpha(t.COLORS.black,10)}`:"none"};
|
|
220
|
-
`,
|
|
220
|
+
`,fr=I.newClassNameGetter("card"),xr=({children:e,className:o,ref:r,border:i=!1,shadow:n=!1,...l})=>a.jsx(gr,{...l,ref:r,className:fr("container",o),$border:i,$shadow:n,children:e}),Nt={normal:{box:{border:t.alpha(t.COLORS["iron-grey"],30),borderChecked:t.COLORS["iron-grey"],background:t.COLORS.white,backgroundChecked:t.COLORS.black,focusShadow:t.alpha(t.COLORS["iron-grey"],30)},label:t.COLORS.black,icon:t.COLORS.white},error:{box:{border:t.COLORS.red,borderChecked:t.COLORS.red,background:t.COLORS.white,backgroundChecked:t.COLORS.red,focusShadow:t.alpha(t.COLORS.red,30)},label:t.COLORS.red,icon:t.COLORS.white}},ue=e=>Nt[e]??Nt.normal,Or=s.label`
|
|
221
221
|
display: inline-flex;
|
|
222
222
|
align-items: flex-start;
|
|
223
223
|
gap: 8px;
|
|
@@ -227,13 +227,13 @@
|
|
|
227
227
|
&:has(input:focus-visible) > span:first-of-type {
|
|
228
228
|
box-shadow: 0 0 0 2px ${e=>ue(e.$variant).box.focusShadow};
|
|
229
229
|
}
|
|
230
|
-
|
|
230
|
+
`,$r=s.input`
|
|
231
231
|
position: absolute;
|
|
232
232
|
opacity: 0;
|
|
233
233
|
width: 0;
|
|
234
234
|
height: 0;
|
|
235
235
|
pointer-events: none;
|
|
236
|
-
`,
|
|
236
|
+
`,Sr=s.span`
|
|
237
237
|
display: inline-flex;
|
|
238
238
|
align-items: center;
|
|
239
239
|
justify-content: center;
|
|
@@ -248,7 +248,7 @@
|
|
|
248
248
|
border-color 0.15s ease,
|
|
249
249
|
background-color 0.15s ease,
|
|
250
250
|
box-shadow 0.15s ease;
|
|
251
|
-
|
|
251
|
+
`,yr=s.span`
|
|
252
252
|
display: inline-flex;
|
|
253
253
|
align-items: center;
|
|
254
254
|
justify-content: center;
|
|
@@ -263,7 +263,7 @@
|
|
|
263
263
|
width: 12px;
|
|
264
264
|
height: 12px;
|
|
265
265
|
}
|
|
266
|
-
`,
|
|
266
|
+
`,vr=s.span`
|
|
267
267
|
font-size: 14px;
|
|
268
268
|
font-weight: 500;
|
|
269
269
|
line-height: 1.4;
|
|
@@ -279,7 +279,7 @@
|
|
|
279
279
|
text-decoration: none;
|
|
280
280
|
}
|
|
281
281
|
}
|
|
282
|
-
`,Re=I.newClassNameGetter("checkbox"),Je=({checked:e,className:o,classnames:r,disabled:i,indeterminate:n=!1,label:l,onChange:c,ref:d,variant:p="normal",...b})=>a.jsxs(
|
|
282
|
+
`,Re=I.newClassNameGetter("checkbox"),Je=({checked:e,className:o,classnames:r,disabled:i,indeterminate:n=!1,label:l,onChange:c,ref:d,variant:p="normal",...b})=>a.jsxs(Or,{className:Re("container",o),$disabled:!!i,$variant:p,children:[a.jsx($r,{...b,ref:d,type:"checkbox",className:Re("input",r==null?void 0:r.input),checked:e,disabled:i,onChange:c}),a.jsx(Sr,{className:Re("box",r==null?void 0:r.box),$checked:e,$indeterminate:n,$variant:p,children:a.jsx(yr,{className:Re("icon",r==null?void 0:r.icon),$visible:n||e,$variant:p,children:n?a.jsx(a.Minus,{}):a.jsx(a.Check,{})})}),l&&a.jsx(vr,{className:Re("label",r==null?void 0:r.label),$variant:p,children:l})]}),It={normal:{border:{static:t.alpha(t.COLORS.black,20),hover:t.alpha(t.COLORS.black,40),active:t.alpha(t.COLORS.black,40),disabled:t.alpha(t.COLORS.black,10)},borderChecked:t.COLORS.black,background:{static:t.COLORS.white,hover:t.COLORS.white,active:t.COLORS.white,disabled:t.alpha(t.COLORS.black,5)},backgroundChecked:t.alpha(t.COLORS.black,5),focusRing:t.alpha(t.COLORS.black,20),label:{static:t.COLORS.black,hover:t.COLORS.black,active:t.COLORS.black,disabled:t.alpha(t.COLORS.black,40)},description:{static:t.alpha(t.COLORS.black,60),hover:t.alpha(t.COLORS.black,60),active:t.alpha(t.COLORS.black,60),disabled:t.alpha(t.COLORS.black,30)}},error:{border:{static:t.COLORS.red,hover:t.COLORS.red,active:t.COLORS.red,disabled:t.alpha(t.COLORS.red,30)},borderChecked:t.COLORS.red,background:{static:t.COLORS.white,hover:t.COLORS.white,active:t.COLORS.white,disabled:t.alpha(t.COLORS.red,5)},backgroundChecked:t.alpha(t.COLORS.red,5),focusRing:t.alpha(t.COLORS.red,20),label:{static:t.COLORS.red,hover:t.COLORS.red,active:t.COLORS.red,disabled:t.alpha(t.COLORS.red,40)},description:{static:t.alpha(t.COLORS.red,70),hover:t.alpha(t.COLORS.red,70),active:t.alpha(t.COLORS.red,70),disabled:t.alpha(t.COLORS.red,40)}}},ce=e=>It[e]??It.normal,mr=s.label`
|
|
283
283
|
display: grid;
|
|
284
284
|
grid-template-columns: auto 1fr;
|
|
285
285
|
align-items: start;
|
|
@@ -308,7 +308,7 @@
|
|
|
308
308
|
.vacano_checkbox_container {
|
|
309
309
|
pointer-events: none;
|
|
310
310
|
}
|
|
311
|
-
`,
|
|
311
|
+
`,Cr=s.input`
|
|
312
312
|
position: absolute;
|
|
313
313
|
width: 1px;
|
|
314
314
|
height: 1px;
|
|
@@ -318,12 +318,12 @@
|
|
|
318
318
|
clip: rect(0, 0, 0, 0);
|
|
319
319
|
white-space: nowrap;
|
|
320
320
|
border: 0;
|
|
321
|
-
`,
|
|
321
|
+
`,wr=s.div`
|
|
322
322
|
display: flex;
|
|
323
323
|
flex-direction: column;
|
|
324
324
|
gap: 2px;
|
|
325
325
|
min-width: 0;
|
|
326
|
-
`,
|
|
326
|
+
`,Rr=s.span`
|
|
327
327
|
font-size: 14px;
|
|
328
328
|
font-weight: 500;
|
|
329
329
|
line-height: 1.4;
|
|
@@ -332,7 +332,7 @@
|
|
|
332
332
|
label[data-disabled='true'] & {
|
|
333
333
|
color: ${e=>ce(e.$variant).label.disabled};
|
|
334
334
|
}
|
|
335
|
-
`,
|
|
335
|
+
`,kr=s.span`
|
|
336
336
|
font-size: 12px;
|
|
337
337
|
font-weight: 400;
|
|
338
338
|
line-height: 1.4;
|
|
@@ -341,21 +341,21 @@
|
|
|
341
341
|
label[data-disabled='true'] & {
|
|
342
342
|
color: ${e=>ce(e.$variant).description.disabled};
|
|
343
343
|
}
|
|
344
|
-
`,Fe=I.newClassNameGetter("checkbox-card"),
|
|
344
|
+
`,Fe=I.newClassNameGetter("checkbox-card"),Lr=({checked:e,className:o,classnames:r,description:i,disabled:n,fullWidth:l=!1,label:c,onChange:d,ref:p,variant:b="normal",...h})=>a.jsxs(mr,{className:Fe("container",o),$checked:e,$disabled:!!n,$fullWidth:l,$variant:b,"data-disabled":n,children:[a.jsx(Cr,{...h,ref:p,type:"checkbox",checked:e,disabled:n,onChange:d}),a.jsx(Je,{className:r==null?void 0:r.checkbox,checked:e,disabled:n,variant:b,onChange:()=>{},tabIndex:-1,"aria-hidden":!0}),a.jsxs(wr,{className:Fe("content",r==null?void 0:r.content),children:[a.jsx(Rr,{className:Fe("label",r==null?void 0:r.label),$variant:b,children:c}),i&&a.jsx(kr,{className:Fe("description",r==null?void 0:r.description),$variant:b,children:i})]})]}),At={label:{color:t.COLORS.black,disabledColor:t.alpha(t.COLORS.black,40)}},Pr=s.div`
|
|
345
345
|
display: flex;
|
|
346
346
|
flex-direction: column;
|
|
347
347
|
gap: 8px;
|
|
348
|
-
`,
|
|
348
|
+
`,zr=s.span`
|
|
349
349
|
font-size: 13px;
|
|
350
350
|
font-weight: 500;
|
|
351
351
|
line-height: 1.5;
|
|
352
352
|
color: ${e=>e.$disabled?At.label.disabledColor:At.label.color};
|
|
353
353
|
margin-bottom: 4px;
|
|
354
|
-
`,
|
|
354
|
+
`,jr=s.div`
|
|
355
355
|
display: flex;
|
|
356
356
|
flex-direction: column;
|
|
357
357
|
gap: 12px;
|
|
358
|
-
`,tt=I.newClassNameGetter("checkbox-group"),
|
|
358
|
+
`,tt=I.newClassNameGetter("checkbox-group"),Er=({className:e,classnames:o,disabled:r,label:i,onChange:n,options:l,ref:c,value:d,...p})=>{const b=(h,f)=>{n(f?[...d,h]:d.filter(O=>O!==h))};return a.jsxs(Pr,{...p,ref:c,className:tt("container",e),children:[i&&a.jsx(zr,{className:tt("label",o==null?void 0:o.label),$disabled:r,children:i}),a.jsx(jr,{className:tt("options",o==null?void 0:o.options),children:l.map(h=>a.jsx(Je,{className:o==null?void 0:o.checkbox,checked:d.includes(h.value),label:h.label,disabled:r,onChange:f=>b(h.value,f.target.checked)},h.value))})]})},Dt={gray:{background:t.alpha(t.COLORS["iron-grey"],10),color:t.COLORS["iron-grey"],deleteHover:t.alpha(t.COLORS["iron-grey"],20)},red:{background:t.alpha(t.COLORS.red,10),color:t.COLORS.red,deleteHover:t.alpha(t.COLORS.red,20)},blue:{background:t.alpha(t.COLORS["steel-blue"],10),color:t.COLORS["steel-blue"],deleteHover:t.alpha(t.COLORS["steel-blue"],20)},black:{background:t.COLORS.black,color:t.COLORS.white,deleteHover:t.alpha(t.COLORS.white,20)}},$t=e=>Dt[e]??Dt.gray,Tr=s.span`
|
|
359
359
|
display: inline-flex;
|
|
360
360
|
align-items: center;
|
|
361
361
|
gap: 4px;
|
|
@@ -367,7 +367,7 @@
|
|
|
367
367
|
line-height: 1.5;
|
|
368
368
|
background-color: ${e=>$t(e.$variant).background};
|
|
369
369
|
color: ${e=>$t(e.$variant).color};
|
|
370
|
-
`,
|
|
370
|
+
`,Nr=s.button`
|
|
371
371
|
display: inline-flex;
|
|
372
372
|
align-items: center;
|
|
373
373
|
justify-content: center;
|
|
@@ -389,10 +389,10 @@
|
|
|
389
389
|
width: 14px;
|
|
390
390
|
height: 14px;
|
|
391
391
|
}
|
|
392
|
-
`,
|
|
392
|
+
`,Ir=s.span`
|
|
393
393
|
flex: 1 0 auto;
|
|
394
394
|
text-align: center;
|
|
395
|
-
`,ot=I.newClassNameGetter("chip"),Ke=({children:e,className:o,classnames:r,deletable:i,onDelete:n,ref:l,variant:c="gray",...d})=>a.jsxs(
|
|
395
|
+
`,ot=I.newClassNameGetter("chip"),Ke=({children:e,className:o,classnames:r,deletable:i,onDelete:n,ref:l,variant:c="gray",...d})=>a.jsxs(Tr,{...d,ref:l,className:ot("container",o),$variant:c,$deletable:!!i,children:[a.jsx(Ir,{className:ot("label",r==null?void 0:r.label),children:e}),i&&a.jsx(Nr,{type:"button",className:ot("delete",r==null?void 0:r.delete),$variant:c,onClick:n,children:a.jsx(a.X,{})})]}),Ar="Confirm",Dr="Cancel",_r=ie.keyframes`
|
|
396
396
|
from {
|
|
397
397
|
opacity: 0;
|
|
398
398
|
transform: translateX(-50%) translateY(100%);
|
|
@@ -401,7 +401,7 @@
|
|
|
401
401
|
opacity: 1;
|
|
402
402
|
transform: translateX(-50%) translateY(0);
|
|
403
403
|
}
|
|
404
|
-
`,
|
|
404
|
+
`,Mr=ie.keyframes`
|
|
405
405
|
from {
|
|
406
406
|
opacity: 1;
|
|
407
407
|
transform: translateX(-50%) translateY(0);
|
|
@@ -410,7 +410,7 @@
|
|
|
410
410
|
opacity: 0;
|
|
411
411
|
transform: translateX(-50%) translateY(100%);
|
|
412
412
|
}
|
|
413
|
-
`,
|
|
413
|
+
`,Fr=s.div`
|
|
414
414
|
position: fixed;
|
|
415
415
|
bottom: 24px;
|
|
416
416
|
left: 50%;
|
|
@@ -425,18 +425,18 @@
|
|
|
425
425
|
box-shadow:
|
|
426
426
|
0 4px 6px -1px rgba(0, 0, 0, 0.1),
|
|
427
427
|
0 2px 4px -2px rgba(0, 0, 0, 0.1);
|
|
428
|
-
animation: ${({$open:e})=>e?
|
|
428
|
+
animation: ${({$open:e})=>e?_r:Mr} 0.2s ease-out forwards;
|
|
429
429
|
z-index: 1000;
|
|
430
|
-
`,
|
|
430
|
+
`,Br=s.p`
|
|
431
431
|
margin: 0;
|
|
432
432
|
font-size: 14px;
|
|
433
433
|
color: ${t.COLORS.black};
|
|
434
434
|
white-space: nowrap;
|
|
435
|
-
`,
|
|
435
|
+
`,Yr=s.div`
|
|
436
436
|
display: flex;
|
|
437
437
|
align-items: center;
|
|
438
438
|
gap: 8px;
|
|
439
|
-
`,ke=I.newClassNameGetter("confirmation"),
|
|
439
|
+
`,ke=I.newClassNameGetter("confirmation"),Hr=({cancelBindings:e,cancelLabel:o=Dr,className:r,classnames:i,confirmLabel:n=Ar,loading:l=!1,message:c,onCancel:d,onConfirm:p,open:b=!0,ref:h,submitBindings:f,...O})=>b?a.jsxs(Fr,{...O,ref:h,className:ke("container",r),$open:b,children:[a.jsx(Br,{className:ke("message",i==null?void 0:i.message),children:c}),a.jsxs(Yr,{className:ke("actions",i==null?void 0:i.actions),children:[a.jsx(Ie,{variant:"system",size:"compact",onClick:d,keyBindings:e,className:ke("cancel-button",i==null?void 0:i.cancelButton),children:o}),a.jsx(Ie,{variant:"danger",size:"compact",onClick:p,loading:l,keyBindings:f,className:ke("confirm-button",i==null?void 0:i.confirmButton),children:n})]})]}):null,Le={sm:`${t.BREAKPOINTS.sm}px`,md:`${t.BREAKPOINTS.md}px`,lg:`${t.BREAKPOINTS.lg}px`,xl:`${t.BREAKPOINTS.xl}px`,"2xl":`${t.BREAKPOINTS["2xl"]}px`},Gr=s.div`
|
|
440
440
|
width: 100%;
|
|
441
441
|
|
|
442
442
|
${t.mediaUp("sm")} {
|
|
@@ -458,20 +458,20 @@
|
|
|
458
458
|
${t.mediaUp("2xl")} {
|
|
459
459
|
max-width: ${Le["2xl"]};
|
|
460
460
|
}
|
|
461
|
-
`,
|
|
461
|
+
`,Vr=I.newClassNameGetter("container"),Wr=({children:e,className:o,ref:r,...i})=>a.jsx(Gr,{...i,ref:r,className:Vr("container",o),children:e}),qe={compact:{height:"32px",padding:"0 10px",radius:"14px",iconSize:16},default:{height:"40px",padding:"0 14px",radius:"16px",iconSize:20}},$e={normal:{background:{static:t.alpha(t.COLORS.black,2),disabled:t.alpha(t.COLORS.black,10)},border:{static:t.alpha(t.COLORS.black,60),disabled:t.alpha(t.COLORS.black,10)},color:{static:t.COLORS.black,disabled:t.alpha(t.COLORS.black,65)},placeholder:{static:t.alpha(t.COLORS.black,40),disabled:t.alpha(t.COLORS.black,65)},focus:t.alpha(t.COLORS["iron-grey"],30)},error:{background:{static:t.alpha(t.COLORS.red,2),disabled:t.alpha(t.COLORS.red,10)},border:{static:t.alpha(t.COLORS.red,60),disabled:t.alpha(t.COLORS.red,10)},color:{static:t.COLORS.red,disabled:t.alpha(t.COLORS.red,65)},placeholder:{static:t.alpha(t.COLORS.red,40),disabled:t.alpha(t.COLORS.red,65)},focus:t.alpha(t.COLORS.red,30)}},ne=36,Qe=2,Ur=12,fo=(e,o,r="en")=>{const i=e.getFullYear(),n=e.getMonth(),l=e.getDate(),c=e.getHours(),d=e.getMinutes(),p=e.getSeconds(),b=c%12||12,h=c>=12,f=new Intl.DateTimeFormat(r,{month:"long"}).format(e),O=new Intl.DateTimeFormat(r,{month:"short"}).format(e),w=new Intl.DateTimeFormat(r,{weekday:"long"}).format(e),y=new Intl.DateTimeFormat(r,{weekday:"short"}).format(e),S=P=>P.toString().padStart(2,"0"),v=P=>P.toString().padStart(2," "),x=P=>`\0${P}\0`,$=[["2006","YEARFOUR",i.toString()],["January","MONTHLONG",f],["Monday","WEEKDAYLONG",w],["Jan","MONTHSHORT",O],["Mon","WEEKDAYSHORT",y],["06","YEARTWO",i.toString().slice(-2)],["01","MONTHPAD",S(n+1)],["_2","DAYSPACE",v(l)],["02","DAYPAD",S(l)],["15","HOURTWENTYFOUR",S(c)],["03","HOURTWELVEPAD",S(b)],["04","MINUTE",S(d)],["05","SECOND",S(p)],["PM","AMPMUP",h?"PM":"AM"],["pm","AMPMLOW",h?"pm":"am"],["1","MONTH",(n+1).toString()],["2","DAY",l.toString()],["3","HOURTWELVE",b.toString()]];let u=o;for(const[P,j]of $)u=u.split(P).join(x(j));for(const[,P,j]of $)u=u.split(x(P)).join(j);return u},Xr=(e,o)=>new Date(e,o+1,0).getDate(),qr=(e,o)=>new Date(e,o,1).getDay(),Kr=(e,o,r=1)=>{const i=Xr(e,o);let l=qr(e,o)-r;l<0&&(l+=7);const c=[];for(let d=0;d<l;d++)c.push(null);for(let d=1;d<=i;d++)c.push(d);for(;c.length<42;)c.push(null);return c},Zr=(e,o=1)=>{const r=[];for(let i=0;i<7;i++){const n=(o+i)%7,l=new Date(2024,0,7+n);r.push(new Intl.DateTimeFormat(e,{weekday:"short"}).format(l))}return r},Jr=e=>{const o=[];for(let r=0;r<12;r++){const i=new Date(2024,r,1);o.push(new Intl.DateTimeFormat(e,{month:"short"}).format(i))}return o},_t=(e,o)=>e.getFullYear()===o.getFullYear()&&e.getMonth()===o.getMonth()&&e.getDate()===o.getDate(),Mt=(e,o)=>e.getFullYear()===o.getFullYear()&&e.getMonth()===o.getMonth(),Qr=(e,o)=>e.getFullYear()===o.getFullYear(),Ft=(e,o,r,i,n)=>{const l=new Date(e,o,r);if(i){const c=new Date(i.getFullYear(),i.getMonth(),i.getDate());if(l<c)return!0}if(n){const c=new Date(n.getFullYear(),n.getMonth(),n.getDate());if(l>c)return!0}return!1},Bt=(e,o,r,i)=>{if(r){const n=r.getFullYear(),l=r.getMonth();if(e<n||e===n&&o<l)return!0}if(i){const n=i.getFullYear(),l=i.getMonth();if(e>n||e===n&&o>l)return!0}return!1},Yt=(e,o,r)=>!!(o&&e<o.getFullYear()||r&&e>r.getFullYear()),ei=(e,o=12)=>{const r=e-Math.floor(o/2),i=[];for(let n=0;n<o;n++)i.push(r+n);return i},ti=e=>{switch(e){case"date":return"02.01.2006";case"month":return"January 2006";case"year":return"2006"}},oi=s.span`
|
|
462
462
|
font-size: 12px;
|
|
463
463
|
font-weight: 500;
|
|
464
464
|
color: ${e=>e.$variant==="normal"?t.COLORS.black:t.COLORS.red};
|
|
465
|
-
`,
|
|
465
|
+
`,ri=I.newClassNameGetter("field-label"),fe=({children:e,className:o,ref:r,required:i,variant:n="normal",...l})=>e?a.jsxs(oi,{...l,ref:r,className:ri("container",o),$variant:n,children:[e," ",i&&"*"]}):null,ii=s.div`
|
|
466
466
|
position: relative;
|
|
467
467
|
display: inline-flex;
|
|
468
468
|
flex-direction: column;
|
|
469
469
|
gap: 2px;
|
|
470
470
|
min-width: 180px;
|
|
471
471
|
width: ${({$fullWidth:e})=>e?"100%":"fit-content"};
|
|
472
|
-
`,
|
|
472
|
+
`,ni=s(fe)`
|
|
473
473
|
margin-left: 6px;
|
|
474
|
-
`,
|
|
474
|
+
`,ai=s.button`
|
|
475
475
|
display: flex;
|
|
476
476
|
align-items: center;
|
|
477
477
|
justify-content: space-between;
|
|
@@ -497,12 +497,12 @@
|
|
|
497
497
|
${({$open:e,$variant:o})=>e&&`
|
|
498
498
|
outline: 2px solid ${$e[o].focus};
|
|
499
499
|
`}
|
|
500
|
-
`,
|
|
500
|
+
`,li=s.span`
|
|
501
501
|
flex: 1;
|
|
502
502
|
overflow: hidden;
|
|
503
503
|
text-overflow: ellipsis;
|
|
504
504
|
white-space: nowrap;
|
|
505
|
-
`,
|
|
505
|
+
`,di=s.span`
|
|
506
506
|
display: flex;
|
|
507
507
|
align-items: center;
|
|
508
508
|
justify-content: center;
|
|
@@ -515,8 +515,8 @@
|
|
|
515
515
|
border: 1px solid ${t.alpha(t.COLORS.black,15)};
|
|
516
516
|
border-radius: 12px;
|
|
517
517
|
box-shadow: 0 4px 16px ${t.alpha(t.COLORS.black,12)};
|
|
518
|
-
padding: ${
|
|
519
|
-
`,Oo=(e,o)=>e?"translateY(0)":o==="bottom"?"translateY(-8px)":"translateY(8px)",
|
|
518
|
+
padding: ${Ur}px;
|
|
519
|
+
`,Oo=(e,o)=>e?"translateY(0)":o==="bottom"?"translateY(-8px)":"translateY(8px)",ci=s.div`
|
|
520
520
|
position: absolute;
|
|
521
521
|
${({$position:e})=>e==="bottom"?"top: calc(100% + 4px);":"bottom: calc(100% + 4px);"}
|
|
522
522
|
left: 0;
|
|
@@ -528,7 +528,7 @@
|
|
|
528
528
|
opacity 0.15s ease,
|
|
529
529
|
transform 0.15s ease,
|
|
530
530
|
visibility 0.15s;
|
|
531
|
-
`,
|
|
531
|
+
`,si=s.div`
|
|
532
532
|
position: fixed;
|
|
533
533
|
${xo}
|
|
534
534
|
opacity: ${({$open:e})=>e?1:0};
|
|
@@ -594,12 +594,12 @@
|
|
|
594
594
|
`,nt=s.div`
|
|
595
595
|
display: flex;
|
|
596
596
|
gap: 4px;
|
|
597
|
-
`,
|
|
597
|
+
`,pi=s.div`
|
|
598
598
|
display: grid;
|
|
599
599
|
grid-template-columns: repeat(7, ${ne}px);
|
|
600
600
|
gap: ${Qe}px;
|
|
601
601
|
margin-bottom: 4px;
|
|
602
|
-
`,
|
|
602
|
+
`,ui=s.div`
|
|
603
603
|
display: flex;
|
|
604
604
|
align-items: center;
|
|
605
605
|
justify-content: center;
|
|
@@ -608,11 +608,11 @@
|
|
|
608
608
|
font-weight: 500;
|
|
609
609
|
color: ${t.alpha(t.COLORS.black,50)};
|
|
610
610
|
text-transform: uppercase;
|
|
611
|
-
`,
|
|
611
|
+
`,hi=s.div`
|
|
612
612
|
display: grid;
|
|
613
613
|
grid-template-columns: repeat(7, ${ne}px);
|
|
614
614
|
gap: ${Qe}px;
|
|
615
|
-
`,
|
|
615
|
+
`,bi=s.button`
|
|
616
616
|
display: flex;
|
|
617
617
|
align-items: center;
|
|
618
618
|
justify-content: center;
|
|
@@ -642,12 +642,12 @@
|
|
|
642
642
|
&:disabled {
|
|
643
643
|
cursor: not-allowed;
|
|
644
644
|
}
|
|
645
|
-
`,
|
|
645
|
+
`,gi=s.div`
|
|
646
646
|
display: grid;
|
|
647
647
|
grid-template-columns: repeat(3, 1fr);
|
|
648
648
|
gap: 8px;
|
|
649
649
|
width: ${7*ne+6*Qe}px;
|
|
650
|
-
`,
|
|
650
|
+
`,fi=s.button`
|
|
651
651
|
display: flex;
|
|
652
652
|
align-items: center;
|
|
653
653
|
justify-content: center;
|
|
@@ -672,12 +672,12 @@
|
|
|
672
672
|
outline: 2px solid ${t.alpha(t.COLORS.black,30)};
|
|
673
673
|
outline-offset: 1px;
|
|
674
674
|
}
|
|
675
|
-
`,
|
|
675
|
+
`,xi=s.div`
|
|
676
676
|
display: grid;
|
|
677
677
|
grid-template-columns: repeat(3, 1fr);
|
|
678
678
|
gap: 8px;
|
|
679
679
|
width: ${7*ne+6*Qe}px;
|
|
680
|
-
`,
|
|
680
|
+
`,Oi=s.button`
|
|
681
681
|
display: flex;
|
|
682
682
|
align-items: center;
|
|
683
683
|
justify-content: center;
|
|
@@ -702,10 +702,10 @@
|
|
|
702
702
|
outline: 2px solid ${t.alpha(t.COLORS.black,30)};
|
|
703
703
|
outline-offset: 1px;
|
|
704
704
|
}
|
|
705
|
-
|
|
705
|
+
`,$i=s.div`
|
|
706
706
|
width: ${ne}px;
|
|
707
707
|
height: ${ne}px;
|
|
708
|
-
`,K=I.newClassNameGetter("date-picker"),Be=4,
|
|
708
|
+
`,K=I.newClassNameGetter("date-picker"),Be=4,Si=300,yi=({value:e,onChange:o,mode:r="date",displayFormat:i,placeholder:n,locale:l="en",weekStartsOn:c=1,minDate:d,maxDate:p,size:b="default",variant:h="normal",disabled:f=!1,fullWidth:O=!1,label:w,portalRenderNode:y,open:S,onOpen:v,onClose:x,className:$,classnames:u,ref:P,...j})=>{const T=g.useMemo(()=>new Date,[]),[Y,z]=g.useState(!1),[D,E]=g.useState({top:0,left:0}),[R,F]=g.useState("bottom"),[m,N]=g.useState(()=>r==="year"?"years":r==="month"?"months":"days"),[k,_]=g.useState(()=>e??T),[H,M]=g.useState(()=>((e==null?void 0:e.getFullYear())??T.getFullYear())-6),G=g.useRef(null),L=g.useRef(null),A=g.useRef(null),X=S!==void 0,q=X?S:Y,xe=i??ti(r),Ae=g.useMemo(()=>Zr(l,c),[l,c]),et=g.useMemo(()=>Jr(l),[l]),To=g.useMemo(()=>Kr(k.getFullYear(),k.getMonth(),c),[k,c]),De=g.useMemo(()=>ei(H+6,12),[H]),Ct=g.useMemo(()=>e?fo(e,xe,l):null,[e,xe,l]),No=n??xe.replace(/2006|06|January|Jan|01|02/g,"__"),ve=g.useCallback(()=>{var Ce;if(!L.current)return;const C=L.current.getBoundingClientRect(),B=((Ce=A.current)==null?void 0:Ce.offsetHeight)??Si,me=window.innerHeight-C.bottom-Be,_e=C.top-Be,Oe=me<B&&_e>me?"top":"bottom";if(F(Oe),y){const Me=Oe==="bottom"?C.bottom+Be:C.top-B-Be;E({top:Me,left:C.left})}},[y]),wt=g.useCallback(()=>{if(f)return;X||z(!0),v==null||v(),N(r==="year"?"years":r==="month"?"months":"days");const C=e??T;_(C),M(C.getFullYear()-6)},[f,X,v,r,e,T]),Z=g.useCallback(()=>{X||z(!1),x==null||x()},[X,x]),Io=g.useCallback(()=>{q?Z():wt()},[q,Z,wt]),Ao=g.useCallback(C=>{const B=new Date(k.getFullYear(),k.getMonth(),C);o==null||o(B),Z()},[k,o,Z]),Do=g.useCallback(C=>{if(r==="month"){const B=new Date(k.getFullYear(),C,1);o==null||o(B),Z()}else _(new Date(k.getFullYear(),C,1)),N("days")},[r,k,o,Z]),_o=g.useCallback(C=>{if(r==="year"){const B=new Date(C,0,1);o==null||o(B),Z()}else r==="month"?(_(new Date(C,k.getMonth(),1)),N("months")):(_(new Date(C,k.getMonth(),1)),N("months"))},[r,k,o,Z]),Mo=g.useCallback(()=>{_(C=>new Date(C.getFullYear(),C.getMonth()-1,1))},[]),Fo=g.useCallback(()=>{_(C=>new Date(C.getFullYear(),C.getMonth()+1,1))},[]),Bo=g.useCallback(()=>{_(C=>new Date(C.getFullYear()-1,C.getMonth(),1))},[]),Yo=g.useCallback(()=>{_(C=>new Date(C.getFullYear()+1,C.getMonth(),1))},[]),Ho=g.useCallback(()=>{M(C=>C-12)},[]),Go=g.useCallback(()=>{M(C=>C+12)},[]),Rt=g.useCallback(()=>{m==="days"?N("months"):m==="months"&&N("years")},[m]);g.useLayoutEffect(()=>{q&&ve()},[q,ve]),g.useEffect(()=>{const C=Oe=>{const Ce=Oe.target,Me=G.current&&!G.current.contains(Ce),Ko=A.current&&!A.current.contains(Ce);y?Me&&Ko&&Z():Me&&Z()},B=Oe=>{Oe.key==="Escape"&&Z()},me=()=>{q&&y&&ve()},_e=()=>{q&&y&&ve()};return q&&(document.addEventListener("mousedown",C),document.addEventListener("keydown",B),y&&(window.addEventListener("scroll",me,!0),window.addEventListener("resize",_e))),()=>{document.removeEventListener("mousedown",C),document.removeEventListener("keydown",B),window.removeEventListener("scroll",me,!0),window.removeEventListener("resize",_e)}},[q,Z,y,ve]);const Vo=qe[b].iconSize,Wo=()=>a.jsxs(a.Fragment,{children:[a.jsxs(rt,{className:K("header",u==null?void 0:u.header),children:[a.jsx(it,{onClick:Rt,type:"button",children:new Intl.DateTimeFormat(l,{month:"long",year:"numeric"}).format(k)}),a.jsxs(nt,{children:[a.jsx(Se,{onClick:Mo,type:"button","aria-label":"Previous month",children:a.jsx(a.ChevronLeft,{size:16})}),a.jsx(Se,{onClick:Fo,type:"button","aria-label":"Next month",children:a.jsx(a.ChevronRight,{size:16})})]})]}),a.jsx(pi,{children:Ae.map((C,B)=>a.jsx(ui,{children:C},B))}),a.jsx(hi,{className:K("grid",u==null?void 0:u.grid),children:To.map((C,B)=>C===null?a.jsx($i,{},B):a.jsx(bi,{type:"button",className:K("cell",u==null?void 0:u.cell),$selected:e?_t(e,new Date(k.getFullYear(),k.getMonth(),C)):!1,$today:_t(T,new Date(k.getFullYear(),k.getMonth(),C)),$disabled:Ft(k.getFullYear(),k.getMonth(),C,d,p),disabled:Ft(k.getFullYear(),k.getMonth(),C,d,p),onClick:()=>Ao(C),children:C},B))})]}),Uo=()=>a.jsxs(a.Fragment,{children:[a.jsxs(rt,{className:K("header",u==null?void 0:u.header),children:[a.jsx(it,{onClick:Rt,type:"button",children:k.getFullYear()}),a.jsxs(nt,{children:[a.jsx(Se,{onClick:Bo,type:"button","aria-label":"Previous year",children:a.jsx(a.ChevronLeft,{size:16})}),a.jsx(Se,{onClick:Yo,type:"button","aria-label":"Next year",children:a.jsx(a.ChevronRight,{size:16})})]})]}),a.jsx(gi,{className:K("grid",u==null?void 0:u.grid),children:et.map((C,B)=>a.jsx(fi,{type:"button",className:K("cell",u==null?void 0:u.cell),$selected:e?Mt(e,new Date(k.getFullYear(),B,1)):!1,$current:Mt(T,new Date(k.getFullYear(),B,1)),$disabled:Bt(k.getFullYear(),B,d,p),disabled:Bt(k.getFullYear(),B,d,p),onClick:()=>Do(B),children:C},B))})]}),Xo=()=>a.jsxs(a.Fragment,{children:[a.jsxs(rt,{className:K("header",u==null?void 0:u.header),children:[a.jsxs(it,{type:"button",style:{cursor:"default"},children:[De[0]," - ",De[De.length-1]]}),a.jsxs(nt,{children:[a.jsx(Se,{onClick:Ho,type:"button","aria-label":"Previous years",children:a.jsx(a.ChevronLeft,{size:16})}),a.jsx(Se,{onClick:Go,type:"button","aria-label":"Next years",children:a.jsx(a.ChevronRight,{size:16})})]})]}),a.jsx(xi,{className:K("grid",u==null?void 0:u.grid),children:De.map(C=>a.jsx(Oi,{type:"button",className:K("cell",u==null?void 0:u.cell),$selected:e?Qr(e,new Date(C,0,1)):!1,$current:T.getFullYear()===C,$disabled:Yt(C,d,p),disabled:Yt(C,d,p),onClick:()=>_o(C),children:C},C))})]}),kt=()=>{switch(m){case"days":return Wo();case"months":return Uo();case"years":return Xo()}},qo=y?ge.createPortal(a.jsx(si,{ref:A,$open:q,$position:R,className:K("calendar",u==null?void 0:u.calendar),style:{top:D.top,left:D.left},children:kt()}),y):a.jsx(ci,{ref:A,$open:q,$position:R,className:K("calendar",u==null?void 0:u.calendar),children:kt()});return a.jsxs(ii,{...j,ref:P??G,$fullWidth:O,className:K("container",$),children:[w&&a.jsx(ni,{children:w}),a.jsxs(ai,{ref:L,type:"button",onClick:Io,disabled:f,$size:b,$variant:h,$disabled:f,$open:q,$hasValue:!!Ct,className:K("trigger",u==null?void 0:u.trigger),children:[a.jsx(li,{children:Ct??No}),a.jsx(di,{$open:q,children:a.jsx(a.ChevronDown,{size:Vo})})]}),qo]})},vi={left:t.KEYFRAMES.slideInLeft,right:t.KEYFRAMES.slideInRight,top:t.KEYFRAMES.slideInTop,bottom:t.KEYFRAMES.slideInBottom},mi=(e,o)=>{switch(e){case"left":return`
|
|
709
709
|
top: 0;
|
|
710
710
|
left: 0;
|
|
711
711
|
height: 100%;
|
|
@@ -725,17 +725,17 @@
|
|
|
725
725
|
left: 0;
|
|
726
726
|
width: 100%;
|
|
727
727
|
height: ${o};
|
|
728
|
-
`}},
|
|
728
|
+
`}},Ci=s.div`
|
|
729
729
|
position: fixed;
|
|
730
730
|
z-index: 1001;
|
|
731
731
|
background-color: ${t.COLORS.white};
|
|
732
732
|
box-shadow: 0 4px 24px ${t.alpha(t.COLORS.black,20)};
|
|
733
|
-
${e=>
|
|
734
|
-
animation: ${e=>
|
|
735
|
-
`,
|
|
733
|
+
${e=>mi(e.$position,e.$size)}
|
|
734
|
+
animation: ${e=>vi[e.$position]} ${e=>e.$animated?"0.05s":"0s"} ease-out forwards;
|
|
735
|
+
`,wi=I.newClassNameGetter("drawer"),Ri=({animated:e,children:o,className:r,open:i,position:n="right",ref:l,size:c="400px",...d})=>i?ge.createPortal(a.jsx(Ci,{...d,ref:l,className:wi("container",r),$animated:!!e,$position:n,$size:c,children:o}),document.body):null,ki=s.div`
|
|
736
736
|
position: relative;
|
|
737
737
|
display: inline-block;
|
|
738
|
-
`,
|
|
738
|
+
`,Li=s.div`
|
|
739
739
|
cursor: pointer;
|
|
740
740
|
`,$o=`
|
|
741
741
|
z-index: 100;
|
|
@@ -745,7 +745,7 @@
|
|
|
745
745
|
border: 1px solid ${t.COLORS.gray};
|
|
746
746
|
border-radius: 8px;
|
|
747
747
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
|
|
748
|
-
`,So=(e,o)=>e?"translateY(0)":o==="bottom"?"translateY(-8px)":"translateY(8px)",
|
|
748
|
+
`,So=(e,o)=>e?"translateY(0)":o==="bottom"?"translateY(-8px)":"translateY(8px)",Pi=s.div`
|
|
749
749
|
position: absolute;
|
|
750
750
|
${({$position:e})=>e==="bottom"?"top: calc(100% + 4px);":"bottom: calc(100% + 4px);"}
|
|
751
751
|
${({$align:e})=>e==="left"?"left: 0;":"right: 0;"}
|
|
@@ -757,7 +757,7 @@
|
|
|
757
757
|
opacity 0.15s ease,
|
|
758
758
|
transform 0.15s ease,
|
|
759
759
|
visibility 0.15s;
|
|
760
|
-
`,
|
|
760
|
+
`,zi=s.div`
|
|
761
761
|
position: fixed;
|
|
762
762
|
${$o}
|
|
763
763
|
opacity: ${({$open:e})=>e?1:0};
|
|
@@ -767,17 +767,17 @@
|
|
|
767
767
|
opacity 0.15s ease,
|
|
768
768
|
transform 0.15s ease,
|
|
769
769
|
visibility 0.15s;
|
|
770
|
-
`,Ye=I.newClassNameGetter("dropdown"),He=4,
|
|
770
|
+
`,Ye=I.newClassNameGetter("dropdown"),He=4,ji=100,Ei=({align:e="left",children:o,className:r,classnames:i,onClose:n,onOpen:l,open:c,portalRenderNode:d,ref:p,trigger:b,...h})=>{const[f,O]=g.useState(!1),[w,y]=g.useState({top:0,left:0}),[S,v]=g.useState("bottom"),x=g.useRef(null),$=g.useRef(null),u=g.useRef(null),P=c!==void 0,j=P?c:f,T=g.useCallback(()=>{var _,H;if(!$.current)return;const E=$.current.getBoundingClientRect(),R=((_=u.current)==null?void 0:_.offsetHeight)??ji,F=((H=u.current)==null?void 0:H.offsetWidth)??160,m=window.innerHeight-E.bottom-He,N=E.top-He,k=m<R&&N>m?"top":"bottom";if(v(k),d){let M;e==="left"?M=E.left:M=E.right-F;const G=k==="bottom"?E.bottom+He:E.top-R-He;y({top:G,left:M})}},[e,d]),Y=g.useCallback(()=>{P?j?n==null||n():l==null||l():O(E=>{const R=!E;return R?l==null||l():n==null||n(),R})},[P,j,n,l]),z=g.useCallback(()=>{P||O(!1),n==null||n()},[P,n]);g.useLayoutEffect(()=>{j&&T()},[j,T]),g.useEffect(()=>{const E=N=>{const k=N.target,_=x.current&&!x.current.contains(k),H=u.current&&!u.current.contains(k);d?_&&H&&z():_&&z()},R=N=>{N.key==="Escape"&&z()},F=()=>{j&&d&&T()},m=()=>{j&&d&&T()};return j&&(document.addEventListener("mousedown",E),document.addEventListener("keydown",R),d&&(window.addEventListener("scroll",F,!0),window.addEventListener("resize",m))),()=>{document.removeEventListener("mousedown",E),document.removeEventListener("keydown",R),window.removeEventListener("scroll",F,!0),window.removeEventListener("resize",m)}},[j,z,d,T]);const D=d?ge.createPortal(a.jsx(zi,{ref:u,$open:j,$position:S,className:Ye("content",i==null?void 0:i.content),style:{top:w.top,left:w.left},children:o}),d):a.jsx(Pi,{ref:u,$align:e,$open:j,$position:S,className:Ye("content",i==null?void 0:i.content),children:o});return a.jsxs(ki,{...h,ref:p??x,className:Ye("container",r),children:[a.jsx(Li,{ref:$,onClick:Y,className:Ye("trigger",i==null?void 0:i.trigger),children:g.cloneElement(b)}),D]})},Ti={normal:t.COLORS["iron-grey"],error:t.COLORS.red,success:t.COLORS.green,warning:t.COLORS.yellow},Ni=s.span`
|
|
771
771
|
display: block;
|
|
772
772
|
font-size: 12px;
|
|
773
773
|
font-weight: 500;
|
|
774
774
|
line-height: 1.4;
|
|
775
|
-
color: ${e=>
|
|
776
|
-
`,
|
|
775
|
+
color: ${e=>Ti[e.$variant]};
|
|
776
|
+
`,Ii=I.newClassNameGetter("field-message"),Ai=({children:e,className:o,ref:r,variant:i="normal",...n})=>e?a.jsx(Ni,{...n,ref:r,className:Ii("container",o),$variant:i,children:e}):null,Di=s.div`
|
|
777
777
|
display: flex;
|
|
778
778
|
flex-direction: column;
|
|
779
779
|
gap: 12px;
|
|
780
|
-
`,
|
|
780
|
+
`,_i=s.div`
|
|
781
781
|
width: ${({$size:e})=>e}px;
|
|
782
782
|
height: ${({$size:e})=>e}px;
|
|
783
783
|
border-radius: 8px;
|
|
@@ -793,10 +793,10 @@
|
|
|
793
793
|
height: 100%;
|
|
794
794
|
object-fit: cover;
|
|
795
795
|
}
|
|
796
|
-
`,
|
|
796
|
+
`,Mi=s.span`
|
|
797
797
|
font-size: 12px;
|
|
798
798
|
color: ${t.COLORS["iron-grey"]};
|
|
799
|
-
`,
|
|
799
|
+
`,Fi=e=>`
|
|
800
800
|
.${e} {
|
|
801
801
|
padding: 7px 16px;
|
|
802
802
|
font-size: 14px;
|
|
@@ -814,7 +814,7 @@
|
|
|
814
814
|
.${e}:active {
|
|
815
815
|
transform: translate(0, 1px);
|
|
816
816
|
}
|
|
817
|
-
`,
|
|
817
|
+
`,Bi=e=>`
|
|
818
818
|
.${e} {
|
|
819
819
|
display: flex;
|
|
820
820
|
flex: 1 1 auto;
|
|
@@ -838,7 +838,7 @@
|
|
|
838
838
|
max-height: 70vh;
|
|
839
839
|
}
|
|
840
840
|
}
|
|
841
|
-
`,
|
|
841
|
+
`,Yi=e=>`
|
|
842
842
|
.${e} {
|
|
843
843
|
padding: 7px 16px;
|
|
844
844
|
font-size: 14px;
|
|
@@ -856,7 +856,7 @@
|
|
|
856
856
|
.${e}:active {
|
|
857
857
|
transform: translate(0, 1px);
|
|
858
858
|
}
|
|
859
|
-
`,
|
|
859
|
+
`,Hi=e=>`
|
|
860
860
|
.${e} {
|
|
861
861
|
display: flex;
|
|
862
862
|
flex-direction: column;
|
|
@@ -874,7 +874,7 @@
|
|
|
874
874
|
border-radius: 8px;
|
|
875
875
|
}
|
|
876
876
|
}
|
|
877
|
-
`,
|
|
877
|
+
`,Gi=e=>`
|
|
878
878
|
.${e} {
|
|
879
879
|
display: flex;
|
|
880
880
|
justify-content: flex-end;
|
|
@@ -893,7 +893,7 @@
|
|
|
893
893
|
gap: 8px;
|
|
894
894
|
}
|
|
895
895
|
}
|
|
896
|
-
`,
|
|
896
|
+
`,Vi=e=>`
|
|
897
897
|
.${e} {
|
|
898
898
|
display: flex;
|
|
899
899
|
justify-content: flex-start;
|
|
@@ -915,7 +915,7 @@
|
|
|
915
915
|
font-size: 14px;
|
|
916
916
|
}
|
|
917
917
|
}
|
|
918
|
-
`,
|
|
918
|
+
`,Wi=e=>`
|
|
919
919
|
.${e} {
|
|
920
920
|
display: block;
|
|
921
921
|
z-index: 101;
|
|
@@ -933,27 +933,27 @@
|
|
|
933
933
|
position: absolute;
|
|
934
934
|
touch-action: none;
|
|
935
935
|
}
|
|
936
|
-
`,
|
|
936
|
+
`,Ui=e=>`
|
|
937
937
|
.${e} {
|
|
938
938
|
position: absolute;
|
|
939
939
|
z-index: 2;
|
|
940
940
|
background-color: rgba(0, 0, 0, 0.6);
|
|
941
941
|
touch-action: none;
|
|
942
942
|
}
|
|
943
|
-
`,
|
|
943
|
+
`,Xi=e=>`
|
|
944
944
|
.${e} {
|
|
945
945
|
position: absolute;
|
|
946
946
|
z-index: 3;
|
|
947
947
|
touch-action: none;
|
|
948
948
|
}
|
|
949
|
-
`,
|
|
949
|
+
`,qi=e=>`
|
|
950
950
|
.${e} {
|
|
951
951
|
backface-visibility: hidden;
|
|
952
952
|
perspective: 1000px;
|
|
953
953
|
max-inline-size: unset !important;
|
|
954
954
|
max-block-size: unset !important;
|
|
955
955
|
}
|
|
956
|
-
`,
|
|
956
|
+
`,Ki=e=>`
|
|
957
957
|
.${e} {
|
|
958
958
|
position: absolute;
|
|
959
959
|
z-index: 100;
|
|
@@ -964,7 +964,7 @@
|
|
|
964
964
|
overflow: hidden;
|
|
965
965
|
border-radius: 50%;
|
|
966
966
|
}
|
|
967
|
-
`,
|
|
967
|
+
`,Zi={tl:"nw-resize",tr:"ne-resize",bl:"sw-resize",br:"se-resize"},Ji={tl:{h:"left",v:"top"},tr:{h:"right",v:"top"},bl:{h:"left",v:"bottom"},br:{h:"right",v:"bottom"}},Ge=(e,o)=>{const r=Zi[o],{h:i,v:n}=Ji[o];return`
|
|
968
968
|
.${e} {
|
|
969
969
|
display: block;
|
|
970
970
|
z-index: 102;
|
|
@@ -990,7 +990,7 @@
|
|
|
990
990
|
${n}: -12px;
|
|
991
991
|
}
|
|
992
992
|
}
|
|
993
|
-
`},
|
|
993
|
+
`},Qi=e=>`
|
|
994
994
|
.${e} {
|
|
995
995
|
display: flex;
|
|
996
996
|
align-items: center;
|
|
@@ -1016,7 +1016,7 @@
|
|
|
1016
1016
|
padding-bottom: env(safe-area-inset-bottom, 8px);
|
|
1017
1017
|
}
|
|
1018
1018
|
}
|
|
1019
|
-
`,
|
|
1019
|
+
`,en=e=>`
|
|
1020
1020
|
.${e} {
|
|
1021
1021
|
backface-visibility: hidden;
|
|
1022
1022
|
user-select: none;
|
|
@@ -1029,25 +1029,25 @@
|
|
|
1029
1029
|
position: absolute;
|
|
1030
1030
|
z-index: 1;
|
|
1031
1031
|
}
|
|
1032
|
-
`,
|
|
1033
|
-
${
|
|
1034
|
-
${
|
|
1035
|
-
${
|
|
1036
|
-
${
|
|
1037
|
-
${
|
|
1038
|
-
${
|
|
1039
|
-
${
|
|
1040
|
-
${
|
|
1041
|
-
${
|
|
1042
|
-
${
|
|
1043
|
-
${
|
|
1032
|
+
`,tn=e=>{let o=5381;for(let r=0;r<e.length;r++)o=(o<<5)+o^e.charCodeAt(r);return Math.abs(o).toString(36)},V=e=>`hq-cropper__${tn(e)}`,W=e=>e||[],U=(e,o)=>{if(o)for(const r of o)e.classList.add(r)},on=e=>{const o={applyButton:[V("applyButton"),...W(e.applyButton)],cancelButton:[V("cancelButton"),...W(e.cancelButton)],container:[V("container"),...W(e.container)],handlerMove:[V("handlerMove"),...W(e.handlerMove)],handlerResizeTopLeft:[V("handlerResizeTopLeft"),...W(e.handlerResizeTopLeft)],handlerResizeTopRight:[V("handlerResizeTopRight"),...W(e.handlerResizeTopRight)],handlerResizeBottomLeft:[V("handlerResizeBottomLeft"),...W(e.handlerResizeBottomLeft)],handlerResizeBottomRight:[V("handlerResizeBottomRight"),...W(e.handlerResizeBottomRight)],sourceImage:[V("sourceImage"),...W(e.sourceImage)],portalArea:[V("portalArea"),...W(e.portalArea)],previewImage:[V("previewImage"),...W(e.previewImage)],body:[V("body"),...W(e.body)],header:[V("header"),...W(e.header)],footer:[V("footer"),...W(e.footer)],portal:[V("portal"),...W(e.portal)],preview:[V("preview"),...W(e.preview)],root:[V("root"),...W(e.root)]},r=`
|
|
1033
|
+
${Fi(o.applyButton[0])}
|
|
1034
|
+
${Bi(o.body[0])}
|
|
1035
|
+
${Yi(o.cancelButton[0])}
|
|
1036
|
+
${Hi(o.container[0])}
|
|
1037
|
+
${Gi(o.footer[0])}
|
|
1038
|
+
${Vi(o.header[0])}
|
|
1039
|
+
${Wi(o.handlerMove[0])}
|
|
1040
|
+
${Ui(o.portalArea[0])}
|
|
1041
|
+
${Xi(o.portal[0])}
|
|
1042
|
+
${qi(o.previewImage[0])}
|
|
1043
|
+
${Ki(o.preview[0])}
|
|
1044
1044
|
${Ge(o.handlerResizeBottomLeft[0],"bl")}
|
|
1045
1045
|
${Ge(o.handlerResizeBottomRight[0],"br")}
|
|
1046
1046
|
${Ge(o.handlerResizeTopLeft[0],"tl")}
|
|
1047
1047
|
${Ge(o.handlerResizeTopRight[0],"tr")}
|
|
1048
|
-
${
|
|
1049
|
-
${
|
|
1050
|
-
`,i=document.createElement("style");return i.innerHTML=r,document.getElementsByTagName("head")[0].prepend(i),o};let tn=0;const on=e=>{const o=new Map,r=new Proxy({...e},{set(i,n,l){return Reflect.set(i,n,l),(o.get(n)||[]).forEach(c=>c.action(l,i,n)),!0}});return{getState:()=>({...r}),setState:i=>{for(const n of Object.keys(i)){const l=i[n];l!==void 0&&(r[n]=l)}},subscribe:(i,n)=>{const l=String(++tn),c=o.get(i)||[];return o.set(i,[...c,{action:n,id:l}]),l},unsubscribe:i=>{for(const[n,l]of o.entries()){const c=l.filter(d=>d.id!==i);if(c.length!==l.length){o.set(n,c);return}}},unsubscribeAll:()=>{o.clear()}}},St={action:null,sourceBase64:"",fileName:"",sourceHeight:0,sourceWidth:0,frame:{left:0,top:0,width:0,height:0},portal:{left:0,top:0,size:0},emitted:{X:0,Y:0,left:0,top:0,size:0},config:{applyButtonLabel:"Apply",cancelButtonLabel:"Cancel",compression:1,framePadding:3,minPortalSize:50,portalPosition:"center",portalSize:150,outputSize:0,type:"jpeg",maxFileSize:0,allowedTypes:["image/jpeg","image/png","image/gif","image/webp"]}},rn=(e={},o={})=>on({...St,config:{...St.config,...e},css:en(o)}),nn=(e,o)=>{var O;const r=e(),i=document.querySelector(`.${(O=r.css)==null?void 0:O.body[0]}`);if(!i)return r.frame;const{width:n,height:l}=i.getBoundingClientRect(),c=n/l,d=o.width/o.height;let p,b,h=0,f=0;return c>d?(p=l*d,b=l,f=(n-p)/2):(p=n,b=n*(o.height/o.width),h=(l-b)/2),{width:p,height:b,left:f,top:h}},an=(e,o,r)=>{const[i,n]=o,l=i+e>r.width?(r.width-e)/2:i,c=n+e>r.height?(r.height-e)/2:n;return[l,c]},ln=(e,o)=>{const{config:r}=e(),i=Math.min(o.width,o.height)-r.framePadding*2,n=r.portalSize>i?i:r.portalSize;if(Array.isArray(r.portalPosition)&&r.portalPosition.length===2){const[l,c]=an(n,r.portalPosition,o);return{left:l,top:c,size:n}}return r.portalPosition==="center"?{size:n,left:(o.width-n)/2,top:(o.height-n)/2}:{left:0,top:0,size:n}};var te=(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))(te||{});const dn=e=>{var i;const o=e(),r=document.createElement("span");return U(r,(i=o.css)==null?void 0:i.handlerMove),r.setAttribute("data-action",te.MOVE),r},cn=e=>{var i;const o=e(),r=document.createElement("span");return U(r,(i=o.css)==null?void 0:i.handlerResizeBottomLeft),r.setAttribute("data-action",te.RESIZE_BL),r},sn=e=>{var i;const o=e(),r=document.createElement("span");return U(r,(i=o.css)==null?void 0:i.handlerResizeBottomRight),r.setAttribute("data-action",te.RESIZE_BR),r},pn=e=>{var i;const o=e(),r=document.createElement("span");return U(r,(i=o.css)==null?void 0:i.handlerResizeTopLeft),r.setAttribute("data-action",te.RESIZE_TL),r},un=e=>{var i;const o=e(),r=document.createElement("span");return U(r,(i=o.css)==null?void 0:i.handlerResizeTopRight),r.setAttribute("data-action",te.RESIZE_TR),r},hn=e=>{var i;const o=e(),r=document.createElement("img");return U(r,(i=o.css)==null?void 0:i.previewImage),r},bn=e=>{var i;const o=e(),r=document.createElement("div");return U(r,(i=o.css)==null?void 0:i.preview),r.appendChild(hn(e)),r},gn=e=>{var i;const o=e(),r=document.createElement("div");return U(r,(i=o.css)==null?void 0:i.portal),r.appendChild(bn(e)),r.appendChild(dn(e)),r.appendChild(pn(e)),r.appendChild(un(e)),r.appendChild(cn(e)),r.appendChild(sn(e)),r},fn=e=>{var i;const o=e(),r=document.createElement("div");return U(r,(i=o.css)==null?void 0:i.portalArea),r.appendChild(gn(e)),r},xn=e=>{var i;const o=e(),r=document.createElement("img");return U(r,(i=o.css)==null?void 0:i.sourceImage),r.setAttribute("alt","source"),r.setAttribute("crossOrigin","anonymous"),r.setAttribute("draggable","false"),r.setAttribute("src",o.sourceBase64),r},On=e=>{var i;const o=e(),r=document.createElement("div");return U(r,(i=o.css)==null?void 0:i.body),r.appendChild(xn(e)),r.appendChild(fn(e)),r},$n=(e,o)=>{var n;const r=e(),i=document.createElement("div");return U(i,(n=r.css)==null?void 0:n.applyButton),i.setAttribute("role","button"),i.innerText=r.config.applyButtonLabel,i.addEventListener("click",o),i},Sn=(e,o)=>{var n;const r=e(),i=document.createElement("div");return U(i,(n=r.css)==null?void 0:n.cancelButton),i.setAttribute("role","button"),i.innerText=r.config.cancelButtonLabel,i.addEventListener("click",o),i},yn=(e,o,r)=>{var l;const i=e(),n=document.createElement("div");return U(n,(l=i.css)==null?void 0:l.footer),n.appendChild(Sn(e,r)),n.appendChild($n(e,o)),n},vn=e=>{var i;const o=e(),r=document.createElement("div");return U(r,(i=o.css)==null?void 0:i.header),r},mn=(e,o,r)=>{var l;const i=e(),n=document.createElement("div");return U(n,(l=i.css)==null?void 0:l.container),n.appendChild(vn(e)),n.appendChild(On(e)),n.appendChild(yn(e,o,r)),n},wn=(e,o,r)=>{var l;const i=e(),n=document.createElement("div");U(n,(l=i.css)==null?void 0:l.root),n.appendChild(mn(e,o,r)),document.body.appendChild(n)},Cn=e=>{const o=document.createElement("input");return o.style.display="none",o.setAttribute("type","file"),o.setAttribute("accept","image/x-png,image/jpeg"),o.addEventListener("change",e,!1),document.body.appendChild(o),o},Te=new Map,Rn={header:"header",sourceImage:"sourceImage",portalArea:"portalArea",portal:"portal",previewImage:"previewImage"},he=(e,o)=>{if(Te.has(e))return Te.get(e);if(!o)return null;const r=o[Rn[e]],i=document.querySelector(`.${r[0]}`);return Te.set(e,i),i},kn=()=>{Te.clear()},Ln=()=>{Te.clear()},zn=(e,o)=>{const r=he("header",o.css);r&&(r.innerText=e)},Pn=(e,o)=>{const r=he("sourceImage",o.css);r&&(r.setAttribute("src",e),r.style.height=`${o.frame.height}px`,r.style.width=`${o.frame.width}px`,r.style.left=`${o.frame.left}px`,r.style.top=`${o.frame.top}px`);const i=he("portalArea",o.css);i&&(i.style.height=`${o.frame.height}px`,i.style.width=`${o.frame.width}px`,i.style.left=`${o.frame.left}px`,i.style.top=`${o.frame.top}px`);const n=he("portal",o.css);n&&(n.style.width=`${o.portal.size}px`,n.style.height=`${o.portal.size}px`,n.style.left=`${o.portal.left}px`,n.style.top=`${o.portal.top}px`);const l=he("previewImage",o.css);l&&(l.setAttribute("src",e),l.style.height=`${o.frame.height}px`,l.style.width=`${o.frame.width}px`,l.style.marginLeft=`-${o.portal.left}px`,l.style.marginTop=`-${o.portal.top}px`)},jn=(e,o)=>{const r=he("portal",o.css);r&&(r.style.left=`${e.left}px`,r.style.top=`${e.top}px`,r.style.width=`${e.size}px`,r.style.height=`${e.size}px`);const i=he("previewImage",o.css);i&&(i.style.marginLeft=`-${e.left}px`,i.style.marginTop=`-${e.top}px`)},at=1,En=e=>{var C,y;const o=e(),r=document.createElement("canvas"),i=o.frame.width||at,n=o.frame.height||at,l=o.sourceWidth/i,c=o.sourceHeight/n,d=o.portal.left*l,p=o.portal.top*c,b=Math.max(o.portal.size*Math.min(l,c),at),h=o.config.outputSize>0?o.config.outputSize:b;r.width=h,r.height=h;const f=document.querySelector(`.${(C=o.css)==null?void 0:C.sourceImage[0]}`);f&&((y=r.getContext("2d"))==null||y.drawImage(f,d,p,b,b,0,0,h,h));const O=r.toDataURL(`image/${o.config.type}`,o.config.compression);return new Promise((S,v)=>{try{r.toBlob(x=>{if(r.remove(),!x){v(new Error(`Failed to create blob for type: image/${o.config.type}`));return}S([O,x])},`image/${o.config.type}`,o.config.compression)}catch(x){r.remove(),v(x)}})},Tn=(e,o,r)=>{const{emitted:i,portal:n,frame:l,config:c}=o();let d=i.left-i.X+e.clientX,p=i.top-i.Y+e.clientY;const b=c.framePadding,h=l.width-c.framePadding-n.size,f=c.framePadding,O=l.height-c.framePadding-n.size;d<b&&(d=b),d>h&&(d=h),p<f&&(p=f),p>O&&(p=O),r({portal:{...n,left:d,top:p}})},Nn=(e,o,r)=>{const{action:i,emitted:n,portal:l,frame:c,config:d}=o(),p=e.pageX-n.X,b=e.pageY-n.Y;switch(i){case te.RESIZE_BR:{let h=n.size+Math.max(p,b);return h<d.minPortalSize&&(h=d.minPortalSize),n.top+h>c.height-d.framePadding&&(h=c.height-n.top-d.framePadding),n.left+h>c.width-d.framePadding&&(h=c.width-n.left-d.framePadding),r({portal:{...l,size:h}})}case te.RESIZE_TR:{let h=p+b>0?n.size+p:n.size-b,f=p+b>0?n.top-p:n.top+b;return h<d.minPortalSize&&(f=n.top+n.size-d.minPortalSize,h=d.minPortalSize),n.left+h>c.width-d.framePadding&&(h=c.width-n.left-d.framePadding,f=n.top-c.width+n.left+n.size),f<d.framePadding&&(h=n.top+n.size,f=d.framePadding),r({portal:{...l,top:f,size:h}})}case te.RESIZE_TL:{const h=Math.min(p,b);let f=n.size-h,O=n.left+h,C=n.top+h;if(f<d.minPortalSize){const y=n.size-d.minPortalSize;f=d.minPortalSize,O=n.left+y,C=n.top+y}if(C<d.framePadding){const y=d.framePadding-C;C=d.framePadding,O=O+y,f=f-y}if(O<d.framePadding){const y=d.framePadding-O;O=d.framePadding,C=C+y,f=f-y}return r({portal:{...l,top:C,left:O,size:f}})}case te.RESIZE_BL:{let h=p+b>0?n.size+b:n.size-p,f=p+b>0?n.left-b:n.left+p;return h<d.minPortalSize&&(f=n.left+n.size-d.minPortalSize,h=d.minPortalSize),h+n.top>c.height-d.framePadding&&(f=n.left-c.height+n.top+n.size,h=c.height-n.top-d.framePadding),f<d.framePadding&&(f=d.framePadding,h=n.left+n.size-d.framePadding),r({portal:{...l,left:f,size:h}})}default:return}},Ht=e=>{if("touches"in e&&e.touches.length>0){const r=e.touches[0];return{clientX:r.clientX,clientY:r.clientY,pageX:r.pageX,pageY:r.pageY}}if("changedTouches"in e&&e.changedTouches.length>0){const r=e.changedTouches[0];return{clientX:r.clientX,clientY:r.clientY,pageX:r.pageX,pageY:r.pageY}}const o=e;return{clientX:o.clientX,clientY:o.clientY,pageX:o.pageX,pageY:o.pageY}},In=(e,o)=>{var O,C,y;const r=e(),i=document.querySelector(`.${(O=r.css)==null?void 0:O.portal[0]}`),n=document.querySelector(`.${(C=r.css)==null?void 0:C.portalArea[0]}`),l=document.querySelector(`.${(y=r.css)==null?void 0:y.root[0]}`);let c=null,d=null;const p=S=>{S.preventDefault();const{portal:v}=e(),x=Ht(S);if(S.target){const $=S.target.getAttribute("data-action"),u={X:x.pageX,Y:x.pageY,left:v.left,top:v.top,size:v.size};o({action:$,emitted:u})}},b=()=>{const{action:S}=e();c!==null&&(cancelAnimationFrame(c),c=null),d=null,S&&o({action:null})},h=()=>{if(c=null,!d)return;const S=d;d=null;const{action:v}=e();if(v)switch(v){case te.MOVE:Tn(S,e,o);break;default:Nn(S,e,o)}},f=S=>{const{action:v}=e();v&&(S.preventDefault(),d=Ht(S),c===null&&(c=requestAnimationFrame(h)))};return l&&(l.addEventListener("mouseup",b),l.addEventListener("touchend",b),l.addEventListener("touchcancel",b)),i&&(i.addEventListener("mousedown",p),i.addEventListener("touchstart",p,{passive:!1})),n&&(n.addEventListener("mousemove",f),n.addEventListener("touchmove",f,{passive:!1})),()=>{c!==null&&cancelAnimationFrame(c),l&&(l.removeEventListener("mouseup",b),l.removeEventListener("touchend",b),l.removeEventListener("touchcancel",b)),i&&(i.removeEventListener("mousedown",p),i.removeEventListener("touchstart",p)),n&&(n.removeEventListener("mousemove",f),n.removeEventListener("touchmove",f))}},Gt=1024*1024,An=(e,o)=>{if(!o.allowedTypes.includes(e.type))return`Invalid file type "${e.type}". Allowed types: ${o.allowedTypes.join(", ")}`;if(o.maxFileSize>0&&e.size>o.maxFileSize){const r=(o.maxFileSize/Gt).toFixed(2);return`File size (${(e.size/Gt).toFixed(2)}MB) exceeds maximum allowed size (${r}MB)`}return null},Dn=(e,o,r,i,n,l,c)=>{const d=x=>{c?c(x):console.error(`HqCropper: ${x}`)};if(!e.target.files||e.target.files.length===0){d("Can't read file input");return}const p=e.target.files[0],{config:b}=o(),h=An(p,b);if(h){d(h),e.target.value="";return}const f=new FileReader;let O=null;const C=()=>{var u;const x=o(),$=document.querySelector(`.${(u=x.css)==null?void 0:u.root[0]}`);$&&($.remove(),document.removeEventListener("keydown",y),O==null||O(),Ln(),l(),r(St))},y=x=>{x.key==="Escape"&&o().sourceBase64&&S(x)},S=x=>{x.preventDefault(),C()},v=x=>{x.preventDefault();const $=o();En(o).then(([u,z])=>{i(u,z,$),S(x)}).catch(u=>{d(u instanceof Error?u.message:"Failed to crop image")})};f.onload=x=>{const $=new Image;if(!x.target||typeof x.target.result!="string"){d("Can't load result image");return}$.src=x.target.result,$.onerror=()=>{d("Failed to load image")},$.onload=()=>{var j;wn(o,v,S),kn(),n("fileName",zn),n("sourceBase64",Pn),n("portal",jn);const u=nn(o,$),z=ln(o,u);r({frame:u,portal:z,fileName:p.name,sourceBase64:(j=x.target)==null?void 0:j.result,sourceHeight:$.height,sourceWidth:$.width}),O=In(o,r),document.addEventListener("keydown",y)}},f.onerror=()=>{d("Failed to read file")},f.readAsDataURL(p),e.target.value=""},_n=(e,o,r,i)=>{const{getState:n,setState:l,subscribe:c,unsubscribeAll:d}=rn(o,r),p=Cn(b=>Dn(b,n,l,e,c,d,i));return{open:()=>p.click()}},ae={portalSize:200,outputSize:400,compression:.9,type:"jpeg",maxFileSize:10*1024*1024,allowedTypes:["image/jpeg","image/png","image/webp"],applyLabel:"Apply",cancelLabel:"Cancel"},Vt="vacano-image-cropper-styles",Mn=`
|
|
1048
|
+
${Qi(o.root[0])}
|
|
1049
|
+
${en(o.sourceImage[0])}
|
|
1050
|
+
`,i=document.createElement("style");return i.innerHTML=r,document.getElementsByTagName("head")[0].prepend(i),o};let rn=0;const nn=e=>{const o=new Map,r=new Proxy({...e},{set(i,n,l){return Reflect.set(i,n,l),(o.get(n)||[]).forEach(c=>c.action(l,i,n)),!0}});return{getState:()=>({...r}),setState:i=>{for(const n of Object.keys(i)){const l=i[n];l!==void 0&&(r[n]=l)}},subscribe:(i,n)=>{const l=String(++rn),c=o.get(i)||[];return o.set(i,[...c,{action:n,id:l}]),l},unsubscribe:i=>{for(const[n,l]of o.entries()){const c=l.filter(d=>d.id!==i);if(c.length!==l.length){o.set(n,c);return}}},unsubscribeAll:()=>{o.clear()}}},St={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"]}},an=(e={},o={})=>nn({...St,config:{...St.config,...e},css:on(o)}),ln=(e,o)=>{var O;const r=e(),i=document.querySelector(`.${(O=r.css)==null?void 0:O.body[0]}`);if(!i)return r.frame;const{width:n,height:l}=i.getBoundingClientRect(),c=n/l,d=o.width/o.height;let p,b,h=0,f=0;return c>d?(p=l*d,b=l,f=(n-p)/2):(p=n,b=n*(o.height/o.width),h=(l-b)/2),{width:p,height:b,left:f,top:h}},dn=(e,o,r)=>{const[i,n]=o,l=i+e>r.width?(r.width-e)/2:i,c=n+e>r.height?(r.height-e)/2:n;return[l,c]},cn=(e,o)=>{const{config:r}=e(),i=Math.min(o.width,o.height)-r.framePadding*2,n=r.portalSize>i?i:r.portalSize;if(Array.isArray(r.portalPosition)&&r.portalPosition.length===2){const[l,c]=dn(n,r.portalPosition,o);return{left:l,top:c,size:n}}return r.portalPosition==="center"?{size:n,left:(o.width-n)/2,top:(o.height-n)/2}:{left:0,top:0,size:n}};var te=(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))(te||{});const sn=e=>{var i;const o=e(),r=document.createElement("span");return U(r,(i=o.css)==null?void 0:i.handlerMove),r.setAttribute("data-action",te.MOVE),r},pn=e=>{var i;const o=e(),r=document.createElement("span");return U(r,(i=o.css)==null?void 0:i.handlerResizeBottomLeft),r.setAttribute("data-action",te.RESIZE_BL),r},un=e=>{var i;const o=e(),r=document.createElement("span");return U(r,(i=o.css)==null?void 0:i.handlerResizeBottomRight),r.setAttribute("data-action",te.RESIZE_BR),r},hn=e=>{var i;const o=e(),r=document.createElement("span");return U(r,(i=o.css)==null?void 0:i.handlerResizeTopLeft),r.setAttribute("data-action",te.RESIZE_TL),r},bn=e=>{var i;const o=e(),r=document.createElement("span");return U(r,(i=o.css)==null?void 0:i.handlerResizeTopRight),r.setAttribute("data-action",te.RESIZE_TR),r},gn=e=>{var i;const o=e(),r=document.createElement("img");return U(r,(i=o.css)==null?void 0:i.previewImage),r},fn=e=>{var i;const o=e(),r=document.createElement("div");return U(r,(i=o.css)==null?void 0:i.preview),r.appendChild(gn(e)),r},xn=e=>{var i;const o=e(),r=document.createElement("div");return U(r,(i=o.css)==null?void 0:i.portal),r.appendChild(fn(e)),r.appendChild(sn(e)),r.appendChild(hn(e)),r.appendChild(bn(e)),r.appendChild(pn(e)),r.appendChild(un(e)),r},On=e=>{var i;const o=e(),r=document.createElement("div");return U(r,(i=o.css)==null?void 0:i.portalArea),r.appendChild(xn(e)),r},$n=e=>{var i;const o=e(),r=document.createElement("img");return U(r,(i=o.css)==null?void 0:i.sourceImage),r.setAttribute("alt","source"),r.setAttribute("crossOrigin","anonymous"),r.setAttribute("draggable","false"),r.setAttribute("src",o.sourceBase64),r},Sn=e=>{var i;const o=e(),r=document.createElement("div");return U(r,(i=o.css)==null?void 0:i.body),r.appendChild($n(e)),r.appendChild(On(e)),r},yn=(e,o)=>{var n;const r=e(),i=document.createElement("div");return U(i,(n=r.css)==null?void 0:n.applyButton),i.setAttribute("role","button"),i.innerText=r.config.applyButtonLabel,i.addEventListener("click",o),i},vn=(e,o)=>{var n;const r=e(),i=document.createElement("div");return U(i,(n=r.css)==null?void 0:n.cancelButton),i.setAttribute("role","button"),i.innerText=r.config.cancelButtonLabel,i.addEventListener("click",o),i},mn=(e,o,r)=>{var l;const i=e(),n=document.createElement("div");return U(n,(l=i.css)==null?void 0:l.footer),n.appendChild(vn(e,r)),n.appendChild(yn(e,o)),n},Cn=e=>{var i;const o=e(),r=document.createElement("div");return U(r,(i=o.css)==null?void 0:i.header),r},wn=(e,o,r)=>{var l;const i=e(),n=document.createElement("div");return U(n,(l=i.css)==null?void 0:l.container),n.appendChild(Cn(e)),n.appendChild(Sn(e)),n.appendChild(mn(e,o,r)),n},Rn=(e,o,r)=>{var l;const i=e(),n=document.createElement("div");U(n,(l=i.css)==null?void 0:l.root),n.appendChild(wn(e,o,r)),document.body.appendChild(n)},kn=e=>{const o=document.createElement("input");return o.style.display="none",o.setAttribute("type","file"),o.setAttribute("accept","image/x-png,image/jpeg"),o.addEventListener("change",e,!1),document.body.appendChild(o),o},Te=new Map,Ln={header:"header",sourceImage:"sourceImage",portalArea:"portalArea",portal:"portal",previewImage:"previewImage"},he=(e,o)=>{if(Te.has(e))return Te.get(e);if(!o)return null;const r=o[Ln[e]],i=document.querySelector(`.${r[0]}`);return Te.set(e,i),i},Pn=()=>{Te.clear()},zn=()=>{Te.clear()},jn=(e,o)=>{const r=he("header",o.css);r&&(r.innerText=e)},En=(e,o)=>{const r=he("sourceImage",o.css);r&&(r.setAttribute("src",e),r.style.height=`${o.frame.height}px`,r.style.width=`${o.frame.width}px`,r.style.left=`${o.frame.left}px`,r.style.top=`${o.frame.top}px`);const i=he("portalArea",o.css);i&&(i.style.height=`${o.frame.height}px`,i.style.width=`${o.frame.width}px`,i.style.left=`${o.frame.left}px`,i.style.top=`${o.frame.top}px`);const n=he("portal",o.css);n&&(n.style.width=`${o.portal.size}px`,n.style.height=`${o.portal.size}px`,n.style.left=`${o.portal.left}px`,n.style.top=`${o.portal.top}px`);const l=he("previewImage",o.css);l&&(l.setAttribute("src",e),l.style.height=`${o.frame.height}px`,l.style.width=`${o.frame.width}px`,l.style.marginLeft=`-${o.portal.left}px`,l.style.marginTop=`-${o.portal.top}px`)},Tn=(e,o)=>{const r=he("portal",o.css);r&&(r.style.left=`${e.left}px`,r.style.top=`${e.top}px`,r.style.width=`${e.size}px`,r.style.height=`${e.size}px`);const i=he("previewImage",o.css);i&&(i.style.marginLeft=`-${e.left}px`,i.style.marginTop=`-${e.top}px`)},at=1,Nn=e=>{var w,y;const o=e(),r=document.createElement("canvas"),i=o.frame.width||at,n=o.frame.height||at,l=o.sourceWidth/i,c=o.sourceHeight/n,d=o.portal.left*l,p=o.portal.top*c,b=Math.max(o.portal.size*Math.min(l,c),at),h=o.config.outputSize>0?o.config.outputSize:b;r.width=h,r.height=h;const f=document.querySelector(`.${(w=o.css)==null?void 0:w.sourceImage[0]}`);f&&((y=r.getContext("2d"))==null||y.drawImage(f,d,p,b,b,0,0,h,h));const O=r.toDataURL(`image/${o.config.type}`,o.config.compression);return new Promise((S,v)=>{try{r.toBlob(x=>{if(r.remove(),!x){v(new Error(`Failed to create blob for type: image/${o.config.type}`));return}S([O,x])},`image/${o.config.type}`,o.config.compression)}catch(x){r.remove(),v(x)}})},In=(e,o,r)=>{const{emitted:i,portal:n,frame:l,config:c}=o();let d=i.left-i.X+e.clientX,p=i.top-i.Y+e.clientY;const b=c.framePadding,h=l.width-c.framePadding-n.size,f=c.framePadding,O=l.height-c.framePadding-n.size;d<b&&(d=b),d>h&&(d=h),p<f&&(p=f),p>O&&(p=O),r({portal:{...n,left:d,top:p}})},An=(e,o,r)=>{const{action:i,emitted:n,portal:l,frame:c,config:d}=o(),p=e.pageX-n.X,b=e.pageY-n.Y;switch(i){case te.RESIZE_BR:{let h=n.size+Math.max(p,b);return h<d.minPortalSize&&(h=d.minPortalSize),n.top+h>c.height-d.framePadding&&(h=c.height-n.top-d.framePadding),n.left+h>c.width-d.framePadding&&(h=c.width-n.left-d.framePadding),r({portal:{...l,size:h}})}case te.RESIZE_TR:{let h=p+b>0?n.size+p:n.size-b,f=p+b>0?n.top-p:n.top+b;return h<d.minPortalSize&&(f=n.top+n.size-d.minPortalSize,h=d.minPortalSize),n.left+h>c.width-d.framePadding&&(h=c.width-n.left-d.framePadding,f=n.top-c.width+n.left+n.size),f<d.framePadding&&(h=n.top+n.size,f=d.framePadding),r({portal:{...l,top:f,size:h}})}case te.RESIZE_TL:{const h=Math.min(p,b);let f=n.size-h,O=n.left+h,w=n.top+h;if(f<d.minPortalSize){const y=n.size-d.minPortalSize;f=d.minPortalSize,O=n.left+y,w=n.top+y}if(w<d.framePadding){const y=d.framePadding-w;w=d.framePadding,O=O+y,f=f-y}if(O<d.framePadding){const y=d.framePadding-O;O=d.framePadding,w=w+y,f=f-y}return r({portal:{...l,top:w,left:O,size:f}})}case te.RESIZE_BL:{let h=p+b>0?n.size+b:n.size-p,f=p+b>0?n.left-b:n.left+p;return h<d.minPortalSize&&(f=n.left+n.size-d.minPortalSize,h=d.minPortalSize),h+n.top>c.height-d.framePadding&&(f=n.left-c.height+n.top+n.size,h=c.height-n.top-d.framePadding),f<d.framePadding&&(f=d.framePadding,h=n.left+n.size-d.framePadding),r({portal:{...l,left:f,size:h}})}default:return}},Ht=e=>{if("touches"in e&&e.touches.length>0){const r=e.touches[0];return{clientX:r.clientX,clientY:r.clientY,pageX:r.pageX,pageY:r.pageY}}if("changedTouches"in e&&e.changedTouches.length>0){const r=e.changedTouches[0];return{clientX:r.clientX,clientY:r.clientY,pageX:r.pageX,pageY:r.pageY}}const o=e;return{clientX:o.clientX,clientY:o.clientY,pageX:o.pageX,pageY:o.pageY}},Dn=(e,o)=>{var O,w,y;const r=e(),i=document.querySelector(`.${(O=r.css)==null?void 0:O.portal[0]}`),n=document.querySelector(`.${(w=r.css)==null?void 0:w.portalArea[0]}`),l=document.querySelector(`.${(y=r.css)==null?void 0:y.root[0]}`);let c=null,d=null;const p=S=>{S.preventDefault();const{portal:v}=e(),x=Ht(S);if(S.target){const $=S.target.getAttribute("data-action"),u={X:x.pageX,Y:x.pageY,left:v.left,top:v.top,size:v.size};o({action:$,emitted:u})}},b=()=>{const{action:S}=e();c!==null&&(cancelAnimationFrame(c),c=null),d=null,S&&o({action:null})},h=()=>{if(c=null,!d)return;const S=d;d=null;const{action:v}=e();if(v)switch(v){case te.MOVE:In(S,e,o);break;default:An(S,e,o)}},f=S=>{const{action:v}=e();v&&(S.preventDefault(),d=Ht(S),c===null&&(c=requestAnimationFrame(h)))};return l&&(l.addEventListener("mouseup",b),l.addEventListener("touchend",b),l.addEventListener("touchcancel",b)),i&&(i.addEventListener("mousedown",p),i.addEventListener("touchstart",p,{passive:!1})),n&&(n.addEventListener("mousemove",f),n.addEventListener("touchmove",f,{passive:!1})),()=>{c!==null&&cancelAnimationFrame(c),l&&(l.removeEventListener("mouseup",b),l.removeEventListener("touchend",b),l.removeEventListener("touchcancel",b)),i&&(i.removeEventListener("mousedown",p),i.removeEventListener("touchstart",p)),n&&(n.removeEventListener("mousemove",f),n.removeEventListener("touchmove",f))}},Gt=1024*1024,_n=(e,o)=>{if(!o.allowedTypes.includes(e.type))return`Invalid file type "${e.type}". Allowed types: ${o.allowedTypes.join(", ")}`;if(o.maxFileSize>0&&e.size>o.maxFileSize){const r=(o.maxFileSize/Gt).toFixed(2);return`File size (${(e.size/Gt).toFixed(2)}MB) exceeds maximum allowed size (${r}MB)`}return null},Mn=(e,o,r,i,n,l,c)=>{const d=x=>{c?c(x):console.error(`HqCropper: ${x}`)};if(!e.target.files||e.target.files.length===0){d("Can't read file input");return}const p=e.target.files[0],{config:b}=o(),h=_n(p,b);if(h){d(h),e.target.value="";return}const f=new FileReader;let O=null;const w=()=>{var u;const x=o(),$=document.querySelector(`.${(u=x.css)==null?void 0:u.root[0]}`);$&&($.remove(),document.removeEventListener("keydown",y),O==null||O(),zn(),l(),r(St))},y=x=>{x.key==="Escape"&&o().sourceBase64&&S(x)},S=x=>{x.preventDefault(),w()},v=x=>{x.preventDefault();const $=o();Nn(o).then(([u,P])=>{i(u,P,$),S(x)}).catch(u=>{d(u instanceof Error?u.message:"Failed to crop image")})};f.onload=x=>{const $=new Image;if(!x.target||typeof x.target.result!="string"){d("Can't load result image");return}$.src=x.target.result,$.onerror=()=>{d("Failed to load image")},$.onload=()=>{var j;Rn(o,v,S),Pn(),n("fileName",jn),n("sourceBase64",En),n("portal",Tn);const u=ln(o,$),P=cn(o,u);r({frame:u,portal:P,fileName:p.name,sourceBase64:(j=x.target)==null?void 0:j.result,sourceHeight:$.height,sourceWidth:$.width}),O=Dn(o,r),document.addEventListener("keydown",y)}},f.onerror=()=>{d("Failed to read file")},f.readAsDataURL(p),e.target.value=""},Fn=(e,o,r,i)=>{const{getState:n,setState:l,subscribe:c,unsubscribeAll:d}=an(o,r),p=kn(b=>Mn(b,n,l,e,c,d,i));return{open:()=>p.click()}},ae={portalSize:200,outputSize:400,compression:.9,type:"jpeg",maxFileSize:10*1024*1024,allowedTypes:["image/jpeg","image/png","image/webp"],applyLabel:"Apply",cancelLabel:"Cancel"},Vt="vacano-image-cropper-styles",Bn=`
|
|
1051
1051
|
.vacano-cropper-root {
|
|
1052
1052
|
background-color: rgba(0, 0, 0, 0.5);
|
|
1053
1053
|
backdrop-filter: blur(4px);
|
|
@@ -1095,14 +1095,14 @@
|
|
|
1095
1095
|
.vacano-cropper-apply-button:hover {
|
|
1096
1096
|
background-color: ${t.COLORS["iron-grey"]};
|
|
1097
1097
|
}
|
|
1098
|
-
`,
|
|
1098
|
+
`,Yn=()=>{if(typeof document>"u"||document.getElementById(Vt))return;const e=document.createElement("style");e.id=Vt,e.textContent=Bn,document.head.appendChild(e)},Hn={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"]},yo=(e={})=>{const{allowedTypes:o=ae.allowedTypes,applyLabel:r=ae.applyLabel,cancelLabel:i=ae.cancelLabel,compression:n=ae.compression,maxFileSize:l=ae.maxFileSize,onCrop:c,onError:d,outputSize:p=ae.outputSize,portalSize:b=ae.portalSize,type:h=ae.type}=e,f=g.useRef(null);return{open:g.useCallback(()=>{f.current||(Yn(),f.current=Fn((w,y,S)=>{y&&(c==null||c({base64:w,blob:y,state:S}))},{portalSize:b,outputSize:p,compression:n,type:h,maxFileSize:l,allowedTypes:o,applyButtonLabel:r,cancelButtonLabel:i},Hn,w=>{d==null||d({code:"CROPPER_ERROR",message:w})})),f.current.open()},[o,r,i,n,l,c,d,p,b,h])}},lt=I.newClassNameGetter("image-cropper"),Gn=({allowedTypes:e,applyLabel:o,buttonLabel:r="Select Image",cancelLabel:i,className:n,classnames:l,compression:c,maxFileSize:d,onCrop:p,onError:b,outputSize:h,portalSize:f,previewSize:O=120,ref:w,type:y,value:S,...v})=>{const[x,$]=g.useState(S??null),{open:u}=yo({allowedTypes:e,applyLabel:o,cancelLabel:i,compression:c,maxFileSize:d,onCrop:P=>{$(P.base64),p==null||p(P)},onError:b,outputSize:h,portalSize:f,type:y});return a.jsxs(Di,{...v,ref:w,className:lt("container",n),children:[a.jsx(_i,{$size:O,className:lt("preview",l==null?void 0:l.preview),children:x?a.jsx("img",{src:x,alt:"Preview"}):a.jsx(Mi,{children:"No image"})}),a.jsx(Ie,{variant:"system",onClick:u,className:lt("button",l==null?void 0:l.button),style:{width:O},children:r})]})},Wt={compact:{height:"32px",padding:"0 10px",radius:"14px",prefixSize:"16px"},default:{height:"40px",padding:"0 14px",radius:"16px",prefixSize:"20px"}},Ut={normal:{background:{static:t.alpha(t.COLORS.black,2),disabled:t.alpha(t.COLORS.black,10)},border:{static:t.alpha(t.COLORS.black,60),disabled:t.alpha(t.COLORS.black,10)},color:{static:t.COLORS.black,disabled:t.alpha(t.COLORS.black,65)},placeholder:{static:t.alpha(t.COLORS.black,40),disabled:t.alpha(t.COLORS.black,65)},focus:t.alpha(t.COLORS["iron-grey"],30)},error:{background:{static:t.alpha(t.COLORS.red,2),disabled:t.alpha(t.COLORS.red,10)},border:{static:t.alpha(t.COLORS.red,60),disabled:t.alpha(t.COLORS.red,10)},color:{static:t.COLORS.red,disabled:t.alpha(t.COLORS.red,65)},placeholder:{static:t.alpha(t.COLORS.red,40),disabled:t.alpha(t.COLORS.red,65)},focus:t.alpha(t.COLORS.red,30)}},re=e=>Ut[e]??Ut.normal,dt=e=>Wt[e]??Wt.default,Vn=s.div`
|
|
1099
1099
|
display: grid;
|
|
1100
1100
|
flex-direction: column;
|
|
1101
1101
|
gap: 2px;
|
|
1102
1102
|
width: ${e=>e.$fullWidth?"100%":"fit-content"};
|
|
1103
|
-
`,
|
|
1103
|
+
`,Wn=s(fe)`
|
|
1104
1104
|
margin-left: 6px;
|
|
1105
|
-
`,
|
|
1105
|
+
`,Un=s.input`
|
|
1106
1106
|
flex: 1;
|
|
1107
1107
|
min-width: 0;
|
|
1108
1108
|
outline: none;
|
|
@@ -1134,7 +1134,7 @@
|
|
|
1134
1134
|
&:focus-visible {
|
|
1135
1135
|
outline: 2px solid ${e=>re(e.$variant).focus};
|
|
1136
1136
|
}
|
|
1137
|
-
`,ct=I.newClassNameGetter("input"),vo=({className:e,classnames:o,disabled:r,fullWidth:i,label:n,ref:l,size:c="default",variant:d="normal",...p})=>a.jsxs(
|
|
1137
|
+
`,ct=I.newClassNameGetter("input"),vo=({className:e,classnames:o,disabled:r,fullWidth:i,label:n,ref:l,size:c="default",variant:d="normal",...p})=>a.jsxs(Vn,{className:ct("container",e),$fullWidth:!!i,children:[a.jsx(Wn,{variant:d,className:ct("label",o==null?void 0:o.label),children:n}),a.jsx(Un,{...p,ref:l,disabled:r,$size:c,$variant:d,className:ct("input",o==null?void 0:o.input)})]}),Xn=s.div`
|
|
1138
1138
|
position: fixed;
|
|
1139
1139
|
inset: 0;
|
|
1140
1140
|
z-index: 1000;
|
|
@@ -1143,7 +1143,7 @@
|
|
|
1143
1143
|
justify-content: center;
|
|
1144
1144
|
background-color: ${t.alpha(t.COLORS.black,50)};
|
|
1145
1145
|
animation: ${t.KEYFRAMES.fadeIn} ${e=>e.$animated?"0.15s":"0s"} ease-out forwards;
|
|
1146
|
-
`,
|
|
1146
|
+
`,qn=s.div`
|
|
1147
1147
|
position: relative;
|
|
1148
1148
|
z-index: 1001;
|
|
1149
1149
|
width: ${e=>e.$width};
|
|
@@ -1154,21 +1154,21 @@
|
|
|
1154
1154
|
border-radius: 16px;
|
|
1155
1155
|
box-shadow: 0 8px 32px ${t.alpha(t.COLORS.black,20)};
|
|
1156
1156
|
animation: ${t.KEYFRAMES.scaleIn} ${e=>e.$animated?"0.15s":"0s"} ease-out forwards;
|
|
1157
|
-
`,Xt=I.newClassNameGetter("modal"),mo=({animated:e,children:o,className:r,classnames:i,open:n,ref:l,width:c="500px",...d})=>n?ge.createPortal(a.jsx(
|
|
1157
|
+
`,Xt=I.newClassNameGetter("modal"),mo=({animated:e,children:o,className:r,classnames:i,open:n,ref:l,width:c="500px",...d})=>n?ge.createPortal(a.jsx(Xn,{className:Xt("overlay",i==null?void 0:i.overlay),$animated:!!e,children:a.jsx(qn,{...d,ref:l,className:Xt("content",r,i==null?void 0:i.content),$animated:!!e,$width:c,children:o})}),document.body):null,Co={normal:{border:t.COLORS["iron-grey"],label:t.COLORS.black},error:{border:t.COLORS.red,label:t.COLORS.red}},Kn=s.div`
|
|
1158
1158
|
display: flex;
|
|
1159
1159
|
flex-direction: column;
|
|
1160
1160
|
gap: 4px;
|
|
1161
|
-
`,
|
|
1161
|
+
`,Zn=s(fe)`
|
|
1162
1162
|
margin-left: 6px;
|
|
1163
|
-
color: ${e=>
|
|
1164
|
-
`,
|
|
1163
|
+
color: ${e=>Co[e.$variant].label};
|
|
1164
|
+
`,Jn=s.button`
|
|
1165
1165
|
display: flex;
|
|
1166
1166
|
flex-wrap: wrap;
|
|
1167
1167
|
align-items: center;
|
|
1168
1168
|
gap: 6px;
|
|
1169
1169
|
min-height: 44px;
|
|
1170
1170
|
padding: 8px 12px;
|
|
1171
|
-
border: 1px dashed ${e=>
|
|
1171
|
+
border: 1px dashed ${e=>Co[e.$variant].border};
|
|
1172
1172
|
border-radius: 8px;
|
|
1173
1173
|
background: ${t.COLORS.white};
|
|
1174
1174
|
cursor: ${e=>e.$disabled?"not-allowed":"pointer"};
|
|
@@ -1185,31 +1185,31 @@
|
|
|
1185
1185
|
${e=>e.$variant==="error"?t.COLORS.red:t.COLORS["steel-blue"]};
|
|
1186
1186
|
outline-offset: 2px;
|
|
1187
1187
|
}
|
|
1188
|
-
`,
|
|
1188
|
+
`,Qn=s.span`
|
|
1189
1189
|
color: ${t.COLORS["iron-grey"]};
|
|
1190
1190
|
font-size: 14px;
|
|
1191
|
-
`,
|
|
1191
|
+
`,ea=s.div`
|
|
1192
1192
|
display: flex;
|
|
1193
1193
|
flex-direction: column;
|
|
1194
1194
|
padding: 20px;
|
|
1195
1195
|
gap: 16px;
|
|
1196
|
-
`,
|
|
1196
|
+
`,ta=s.div`
|
|
1197
1197
|
display: flex;
|
|
1198
1198
|
align-items: center;
|
|
1199
1199
|
justify-content: space-between;
|
|
1200
|
-
`,
|
|
1200
|
+
`,oa=s.h3`
|
|
1201
1201
|
margin: 0;
|
|
1202
1202
|
font-size: 18px;
|
|
1203
1203
|
font-weight: 600;
|
|
1204
1204
|
color: ${t.COLORS.black};
|
|
1205
|
-
`,
|
|
1205
|
+
`,ra=s.div`
|
|
1206
1206
|
display: flex;
|
|
1207
1207
|
flex-direction: column;
|
|
1208
1208
|
gap: 4px;
|
|
1209
1209
|
min-height: 200px;
|
|
1210
1210
|
max-height: 300px;
|
|
1211
1211
|
overflow-y: auto;
|
|
1212
|
-
`,
|
|
1212
|
+
`,ia=s.label`
|
|
1213
1213
|
display: flex;
|
|
1214
1214
|
align-items: center;
|
|
1215
1215
|
gap: 10px;
|
|
@@ -1222,10 +1222,10 @@
|
|
|
1222
1222
|
&:hover {
|
|
1223
1223
|
background-color: ${e=>e.$disabled?"transparent":t.COLORS.gray};
|
|
1224
1224
|
}
|
|
1225
|
-
`,
|
|
1225
|
+
`,na=s.span`
|
|
1226
1226
|
font-size: 14px;
|
|
1227
1227
|
color: ${t.COLORS.black};
|
|
1228
|
-
`,
|
|
1228
|
+
`,aa=s.div`
|
|
1229
1229
|
display: flex;
|
|
1230
1230
|
align-items: center;
|
|
1231
1231
|
justify-content: center;
|
|
@@ -1233,16 +1233,16 @@
|
|
|
1233
1233
|
color: ${t.COLORS["iron-grey"]};
|
|
1234
1234
|
font-size: 14px;
|
|
1235
1235
|
text-align: center;
|
|
1236
|
-
`,Q=I.newClassNameGetter("multi-select"),
|
|
1236
|
+
`,Q=I.newClassNameGetter("multi-select"),la=({className:e,classnames:o,disabled:r=!1,emptyMessage:i="No options found",label:n,maxVisible:l=1/0,modalTitle:c="Select options",onChange:d,options:p,placeholder:b="Select...",ref:h,searchPlaceholder:f="Search...",value:O,variant:w="normal",...y})=>{const[S,v]=g.useState(!1),[x,$]=g.useState(""),u=g.useMemo(()=>p.filter(R=>O.includes(R.value)),[p,O]),P=g.useMemo(()=>{if(!x.trim())return p;const R=x.toLowerCase().trim();return p.filter(F=>F.label.toLowerCase().includes(R))},[p,x]),j=l===1/0?u:u.slice(0,l),T=u.length-j.length,Y=()=>{r||(v(!0),$(""))},z=()=>{v(!1),$("")},D=R=>{O.includes(R)?d(O.filter(F=>F!==R)):d([...O,R])},E=R=>{d(O.filter(F=>F!==R))};return a.jsxs(Kn,{...y,ref:h,className:Q("container",e),children:[n&&a.jsx(Zn,{$variant:w,className:Q("label",o==null?void 0:o.trigger),children:n}),a.jsx(Jn,{type:"button",$variant:w,$disabled:r,disabled:r,onClick:Y,className:Q("trigger",o==null?void 0:o.trigger),children:u.length===0?a.jsx(Qn,{className:Q("placeholder",o==null?void 0:o.placeholder),children:b}):a.jsxs(a.Fragment,{children:[j.map(R=>a.jsx(Ke,{deletable:!0,onDelete:()=>E(R.value),onClick:F=>F.stopPropagation(),className:Q("chip",o==null?void 0:o.chip),children:R.label},R.value)),T>0&&a.jsxs(Ke,{variant:"gray",onClick:R=>R.stopPropagation(),className:Q("chip",o==null?void 0:o.chip),children:["+",T]})]})}),a.jsx(mo,{open:S,width:"400px",animated:!0,className:Q("modal",o==null?void 0:o.modal),children:a.jsxs(ea,{children:[a.jsxs(ta,{children:[a.jsx(oa,{children:c}),a.jsx(Ie,{variant:"transparent",size:"compact",icon:a.jsx(a.X,{}),onClick:z})]}),a.jsx(vo,{type:"text",value:x,onChange:R=>$(R.target.value),placeholder:f,autoFocus:!0,fullWidth:!0,className:Q("search",o==null?void 0:o.search)}),a.jsx(ra,{className:Q("options",o==null?void 0:o.options),children:P.length===0?a.jsx(aa,{className:Q("empty",o==null?void 0:o.empty),children:i}):P.map(R=>a.jsxs(ia,{$disabled:!!R.disabled,className:Q("option",o==null?void 0:o.option),children:[a.jsx(Je,{checked:O.includes(R.value),disabled:R.disabled,onChange:()=>D(R.value)}),a.jsx(na,{children:R.label})]},R.value))})]})})]})},qt={compact:{width:"36px",height:"40px",fontSize:"16px",radius:"10px",gap:"8px"},default:{width:"44px",height:"52px",fontSize:"20px",radius:"12px",gap:"10px"}},Kt={normal:{background:{static:t.alpha(t.COLORS.black,2),disabled:t.alpha(t.COLORS.black,10)},border:{static:t.alpha(t.COLORS.black,60),disabled:t.alpha(t.COLORS.black,10)},color:{static:t.COLORS.black,disabled:t.alpha(t.COLORS.black,65)},focus:t.alpha(t.COLORS["iron-grey"],30)},error:{background:{static:t.alpha(t.COLORS.red,2),disabled:t.alpha(t.COLORS.red,10)},border:{static:t.alpha(t.COLORS.red,60),disabled:t.alpha(t.COLORS.red,10)},color:{static:t.COLORS.red,disabled:t.alpha(t.COLORS.red,65)},focus:t.alpha(t.COLORS.red,30)}},Ee=e=>qt[e]??qt.default,pe=e=>Kt[e]??Kt.normal,da=s.div`
|
|
1237
1237
|
display: inline-flex;
|
|
1238
1238
|
flex-direction: column;
|
|
1239
1239
|
gap: 2px;
|
|
1240
|
-
`,
|
|
1240
|
+
`,ca=s(fe)`
|
|
1241
1241
|
margin-left: 6px;
|
|
1242
|
-
`,
|
|
1242
|
+
`,sa=s.div`
|
|
1243
1243
|
display: flex;
|
|
1244
1244
|
gap: ${e=>Ee(e.$size).gap};
|
|
1245
|
-
`,
|
|
1245
|
+
`,pa=s.input`
|
|
1246
1246
|
width: ${e=>Ee(e.$size).width};
|
|
1247
1247
|
height: ${e=>Ee(e.$size).height};
|
|
1248
1248
|
border-radius: ${e=>Ee(e.$size).radius};
|
|
@@ -1271,7 +1271,7 @@
|
|
|
1271
1271
|
&::selection {
|
|
1272
1272
|
background-color: transparent;
|
|
1273
1273
|
}
|
|
1274
|
-
`,st=I.newClassNameGetter("otp-code"),
|
|
1274
|
+
`,st=I.newClassNameGetter("otp-code"),ua=({autoFocus:e,className:o,classnames:r,disabled:i,label:n,length:l=6,onChange:c,ref:d,size:p="default",value:b="",variant:h="normal",...f})=>{const O=g.useRef([]);g.useEffect(()=>{e&&O.current[0]&&O.current[0].focus()},[e]);const w=g.useCallback(x=>{const $=O.current[x];$&&($.focus(),$.select())},[]),y=g.useCallback((x,$)=>{const P=$.target.value.replace(/\D/g,"").slice(-1);if(!P)return;const j=b.padEnd(l," ").split(""),T=j.findIndex(E=>E===" "||E===""),Y=T!==-1?T:x;j[Y]=P;const z=j.join("").replace(/ /g,"");c==null||c(z);const D=Y+1;D<l&&w(D)},[b,l,c,w]),S=g.useCallback((x,$)=>{if($.key==="Backspace"){$.preventDefault();const u=b.split("");u[x]?(u[x]="",c==null||c(u.join(""))):x>0&&(u[x-1]="",c==null||c(u.join("")),w(x-1))}else $.key==="ArrowLeft"&&x>0?($.preventDefault(),w(x-1)):$.key==="ArrowRight"&&x<l-1&&($.preventDefault(),w(x+1))},[b,l,c,w]),v=g.useCallback(x=>{x.preventDefault();const $=x.clipboardData.getData("text").replace(/\D/g,"").slice(0,l);if($){c==null||c($);const u=Math.min($.length,l-1);w(u)}},[l,c,w]);return a.jsxs(da,{ref:d,className:st("container",o),...f,children:[n&&a.jsx(ca,{variant:h,className:st("label",r==null?void 0:r.label),children:n}),a.jsx(sa,{$size:p,children:Array.from({length:l}).map((x,$)=>a.jsx(pa,{ref:u=>{O.current[$]=u},type:"text",inputMode:"numeric",autoComplete:"one-time-code",maxLength:2,disabled:i,value:b[$]??"",onChange:u=>y($,u),onKeyDown:u=>S($,u),onPaste:v,onFocus:u=>u.target.select(),$size:p,$variant:h,className:st("input",r==null?void 0:r.input)},$))})]})},Zt={light:{background:t.COLORS.white,border:t.alpha(t.COLORS.black,30),title:t.COLORS.black,description:t.COLORS["iron-grey"]},dark:{background:t.alpha(t.COLORS.white,5),border:t.alpha(t.COLORS.white,30),title:t.COLORS.white,description:"#9ca3af"}},Ze=e=>Zt[e]??Zt.light,ha=s.div`
|
|
1275
1275
|
display: flex;
|
|
1276
1276
|
flex-direction: column;
|
|
1277
1277
|
gap: 16px;
|
|
@@ -1279,36 +1279,36 @@
|
|
|
1279
1279
|
border: 1px dashed ${({$variant:e})=>Ze(e).border};
|
|
1280
1280
|
border-radius: 16px;
|
|
1281
1281
|
background-color: ${({$variant:e})=>Ze(e).background};
|
|
1282
|
-
`,
|
|
1282
|
+
`,ba=s.div`
|
|
1283
1283
|
display: flex;
|
|
1284
1284
|
flex-direction: column;
|
|
1285
1285
|
gap: 4px;
|
|
1286
|
-
`,
|
|
1286
|
+
`,ga=s.div`
|
|
1287
1287
|
font-size: 18px;
|
|
1288
1288
|
font-weight: 600;
|
|
1289
1289
|
line-height: 1.4;
|
|
1290
1290
|
color: ${({$variant:e})=>Ze(e).title};
|
|
1291
|
-
`,
|
|
1291
|
+
`,fa=s.div`
|
|
1292
1292
|
font-size: 14px;
|
|
1293
1293
|
line-height: 1.5;
|
|
1294
1294
|
color: ${({$variant:e})=>Ze(e).description};
|
|
1295
|
-
`,
|
|
1295
|
+
`,xa=s.div`
|
|
1296
1296
|
display: flex;
|
|
1297
1297
|
flex-wrap: wrap;
|
|
1298
1298
|
gap: 8px;
|
|
1299
|
-
`,Ve=I.newClassNameGetter("panel"),
|
|
1299
|
+
`,Ve=I.newClassNameGetter("panel"),Oa=({children:e,className:o,classnames:r,description:i,ref:n,title:l,variant:c="light",...d})=>{const p=l||i;return a.jsxs(ha,{...d,ref:n,className:Ve("container",o),$variant:c,children:[p&&a.jsxs(ba,{children:[l&&a.jsx(ga,{className:Ve("title",r==null?void 0:r.title),$variant:c,children:l}),i&&a.jsx(fa,{className:Ve("description",r==null?void 0:r.description),$variant:c,children:i})]}),a.jsx(xa,{className:Ve("content",r==null?void 0:r.content),children:e})]})},yt={compact:{height:4,radius:2},default:{height:8,radius:4}},$a=s.div`
|
|
1300
1300
|
width: 100%;
|
|
1301
1301
|
height: ${({$size:e})=>yt[e].height}px;
|
|
1302
1302
|
border-radius: ${({$size:e})=>yt[e].radius}px;
|
|
1303
1303
|
background-color: ${t.COLORS.gray};
|
|
1304
1304
|
overflow: hidden;
|
|
1305
|
-
`,
|
|
1305
|
+
`,Sa=s.div`
|
|
1306
1306
|
height: 100%;
|
|
1307
1307
|
width: ${({$value:e})=>Math.min(100,Math.max(0,e))}%;
|
|
1308
1308
|
border-radius: ${({$size:e})=>yt[e].radius}px;
|
|
1309
1309
|
background-color: ${t.COLORS.black};
|
|
1310
1310
|
transition: width 0.2s ease;
|
|
1311
|
-
`,Jt=I.newClassNameGetter("progress")
|
|
1311
|
+
`,Jt=I.newClassNameGetter("progress"),ya=({value:e,size:o="default",className:r,classnames:i,ref:n,...l})=>a.jsx($a,{...l,ref:n,$size:o,className:Jt("track",r,i==null?void 0:i.track),role:"progressbar","aria-valuenow":e,"aria-valuemin":0,"aria-valuemax":100,children:a.jsx(Sa,{$size:o,$value:e,className:Jt("bar",i==null?void 0:i.bar)})}),Qt={normal:{box:{border:t.alpha(t.COLORS["iron-grey"],30),borderChecked:t.COLORS["iron-grey"],background:t.COLORS.white,backgroundChecked:t.COLORS.white,focusShadow:t.alpha(t.COLORS["iron-grey"],30)},dot:t.COLORS.black,label:t.COLORS.black},error:{box:{border:t.COLORS.red,borderChecked:t.COLORS.red,background:t.COLORS.white,backgroundChecked:t.COLORS.white,focusShadow:t.alpha(t.COLORS.red,30)},dot:t.COLORS.red,label:t.COLORS.red}},be=e=>Qt[e]??Qt.normal,va=s.label`
|
|
1312
1312
|
display: inline-flex;
|
|
1313
1313
|
align-items: flex-start;
|
|
1314
1314
|
gap: 8px;
|
|
@@ -1318,13 +1318,13 @@
|
|
|
1318
1318
|
&:has(input:focus-visible) > span:first-of-type {
|
|
1319
1319
|
box-shadow: 0 0 0 2px ${e=>be(e.$variant).box.focusShadow};
|
|
1320
1320
|
}
|
|
1321
|
-
`,
|
|
1321
|
+
`,ma=s.input`
|
|
1322
1322
|
position: absolute;
|
|
1323
1323
|
opacity: 0;
|
|
1324
1324
|
width: 0;
|
|
1325
1325
|
height: 0;
|
|
1326
1326
|
pointer-events: none;
|
|
1327
|
-
`,
|
|
1327
|
+
`,Ca=s.span`
|
|
1328
1328
|
display: inline-flex;
|
|
1329
1329
|
align-items: center;
|
|
1330
1330
|
justify-content: center;
|
|
@@ -1339,7 +1339,7 @@
|
|
|
1339
1339
|
border-color 0.15s ease,
|
|
1340
1340
|
background-color 0.15s ease,
|
|
1341
1341
|
box-shadow 0.15s ease;
|
|
1342
|
-
`,
|
|
1342
|
+
`,wa=s.span`
|
|
1343
1343
|
width: 8px;
|
|
1344
1344
|
height: 8px;
|
|
1345
1345
|
border-radius: 50%;
|
|
@@ -1349,7 +1349,7 @@
|
|
|
1349
1349
|
transition:
|
|
1350
1350
|
opacity 0.15s ease,
|
|
1351
1351
|
transform 0.15s ease;
|
|
1352
|
-
`,
|
|
1352
|
+
`,Ra=s.span`
|
|
1353
1353
|
font-size: 14px;
|
|
1354
1354
|
font-weight: 500;
|
|
1355
1355
|
line-height: 1.5;
|
|
@@ -1365,7 +1365,7 @@
|
|
|
1365
1365
|
text-decoration: none;
|
|
1366
1366
|
}
|
|
1367
1367
|
}
|
|
1368
|
-
`,
|
|
1368
|
+
`,Pe=I.newClassNameGetter("radio"),mt=({checked:e,className:o,classnames:r,disabled:i,label:n,onChange:l,ref:c,variant:d="normal",...p})=>a.jsxs(va,{className:Pe("container",o),$disabled:!!i,$variant:d,children:[a.jsx(ma,{...p,ref:c,type:"radio",className:Pe("input",r==null?void 0:r.input),checked:e,disabled:i,onChange:l}),a.jsx(Ca,{className:Pe("box",r==null?void 0:r.box),$checked:e,$variant:d,children:a.jsx(wa,{className:Pe("dot",r==null?void 0:r.dot),$visible:e,$variant:d})}),n&&a.jsx(Ra,{className:Pe("label",r==null?void 0:r.label),$variant:d,children:n})]}),eo={normal:{border:{static:t.alpha(t.COLORS.black,20),hover:t.alpha(t.COLORS.black,40),active:t.alpha(t.COLORS.black,40),disabled:t.alpha(t.COLORS.black,10)},borderChecked:t.COLORS.black,background:{static:t.COLORS.white,hover:t.COLORS.white,active:t.COLORS.white,disabled:t.alpha(t.COLORS.black,5)},backgroundChecked:t.alpha(t.COLORS.black,5),focusRing:t.alpha(t.COLORS.black,20),label:{static:t.COLORS.black,hover:t.COLORS.black,active:t.COLORS.black,disabled:t.alpha(t.COLORS.black,40)},description:{static:t.alpha(t.COLORS.black,60),hover:t.alpha(t.COLORS.black,60),active:t.alpha(t.COLORS.black,60),disabled:t.alpha(t.COLORS.black,30)}},error:{border:{static:t.COLORS.red,hover:t.COLORS.red,active:t.COLORS.red,disabled:t.alpha(t.COLORS.red,30)},borderChecked:t.COLORS.red,background:{static:t.COLORS.white,hover:t.COLORS.white,active:t.COLORS.white,disabled:t.alpha(t.COLORS.red,5)},backgroundChecked:t.alpha(t.COLORS.red,5),focusRing:t.alpha(t.COLORS.red,20),label:{static:t.COLORS.red,hover:t.COLORS.red,active:t.COLORS.red,disabled:t.alpha(t.COLORS.red,40)},description:{static:t.alpha(t.COLORS.red,70),hover:t.alpha(t.COLORS.red,70),active:t.alpha(t.COLORS.red,70),disabled:t.alpha(t.COLORS.red,40)}}},se=e=>eo[e]??eo.normal,ka=s.label`
|
|
1369
1369
|
display: grid;
|
|
1370
1370
|
grid-template-columns: auto 1fr;
|
|
1371
1371
|
align-items: start;
|
|
@@ -1394,7 +1394,7 @@
|
|
|
1394
1394
|
.vacano_radio_container {
|
|
1395
1395
|
pointer-events: none;
|
|
1396
1396
|
}
|
|
1397
|
-
`,
|
|
1397
|
+
`,La=s.input`
|
|
1398
1398
|
position: absolute;
|
|
1399
1399
|
width: 1px;
|
|
1400
1400
|
height: 1px;
|
|
@@ -1404,12 +1404,12 @@
|
|
|
1404
1404
|
clip: rect(0, 0, 0, 0);
|
|
1405
1405
|
white-space: nowrap;
|
|
1406
1406
|
border: 0;
|
|
1407
|
-
`,
|
|
1407
|
+
`,Pa=s.div`
|
|
1408
1408
|
display: flex;
|
|
1409
1409
|
flex-direction: column;
|
|
1410
1410
|
gap: 2px;
|
|
1411
1411
|
min-width: 0;
|
|
1412
|
-
`,
|
|
1412
|
+
`,za=s.span`
|
|
1413
1413
|
font-size: 14px;
|
|
1414
1414
|
font-weight: 500;
|
|
1415
1415
|
line-height: 1.4;
|
|
@@ -1418,7 +1418,7 @@
|
|
|
1418
1418
|
label[data-disabled='true'] & {
|
|
1419
1419
|
color: ${e=>se(e.$variant).label.disabled};
|
|
1420
1420
|
}
|
|
1421
|
-
`,
|
|
1421
|
+
`,ja=s.span`
|
|
1422
1422
|
font-size: 12px;
|
|
1423
1423
|
font-weight: 400;
|
|
1424
1424
|
line-height: 1.4;
|
|
@@ -1427,29 +1427,63 @@
|
|
|
1427
1427
|
label[data-disabled='true'] & {
|
|
1428
1428
|
color: ${e=>se(e.$variant).description.disabled};
|
|
1429
1429
|
}
|
|
1430
|
-
`,We=I.newClassNameGetter("radio-card"),
|
|
1430
|
+
`,We=I.newClassNameGetter("radio-card"),Ea=({checked:e,className:o,classnames:r,description:i,disabled:n,fullWidth:l=!1,label:c,onChange:d,ref:p,variant:b="normal",...h})=>a.jsxs(ka,{className:We("container",o),$checked:e,$disabled:!!n,$fullWidth:l,$variant:b,"data-disabled":n,children:[a.jsx(La,{...h,ref:p,type:"radio",checked:e,disabled:n,onChange:d}),a.jsx(mt,{className:r==null?void 0:r.radio,checked:e,disabled:n,variant:b,onChange:()=>{},tabIndex:-1,"aria-hidden":!0}),a.jsxs(Pa,{className:We("content",r==null?void 0:r.content),children:[a.jsx(za,{className:We("label",r==null?void 0:r.label),$variant:b,children:c}),i&&a.jsx(ja,{className:We("description",r==null?void 0:r.description),$variant:b,children:i})]})]}),to={label:{color:t.COLORS.black,disabledColor:t.alpha(t.COLORS.black,40)}},Ta=s.div`
|
|
1431
1431
|
display: flex;
|
|
1432
1432
|
flex-direction: column;
|
|
1433
1433
|
gap: 8px;
|
|
1434
|
-
`,
|
|
1434
|
+
`,Na=s.span`
|
|
1435
1435
|
font-size: 13px;
|
|
1436
1436
|
font-weight: 500;
|
|
1437
1437
|
line-height: 1.5;
|
|
1438
1438
|
color: ${e=>e.$disabled?to.label.disabledColor:to.label.color};
|
|
1439
1439
|
margin-bottom: 4px;
|
|
1440
|
-
`,
|
|
1440
|
+
`,Ia=s.div`
|
|
1441
1441
|
display: flex;
|
|
1442
1442
|
flex-direction: column;
|
|
1443
1443
|
gap: 12px;
|
|
1444
|
-
`,pt=I.newClassNameGetter("radio-group"),
|
|
1444
|
+
`,pt=I.newClassNameGetter("radio-group"),Aa=({className:e,classnames:o,disabled:r,label:i,name:n,onChange:l,options:c,ref:d,value:p,...b})=>a.jsxs(Ta,{...b,ref:d,className:pt("container",e),children:[i&&a.jsx(Na,{className:pt("label",o==null?void 0:o.label),$disabled:r,children:i}),a.jsx(Ia,{className:pt("options",o==null?void 0:o.options),children:c.map(h=>a.jsx(mt,{className:o==null?void 0:o.radio,name:n,checked:p===h.value,label:h.label,disabled:r,onChange:()=>l(h.value)},h.value))})]}),wo=g.createContext(null),Da=s.div`
|
|
1445
|
+
position: fixed;
|
|
1446
|
+
bottom: 24px;
|
|
1447
|
+
right: 24px;
|
|
1448
|
+
z-index: 9999;
|
|
1449
|
+
display: flex;
|
|
1450
|
+
align-items: center;
|
|
1451
|
+
gap: 10px;
|
|
1452
|
+
padding: 10px 16px;
|
|
1453
|
+
background-color: ${t.alpha(t.COLORS["iron-grey"],10)};
|
|
1454
|
+
backdrop-filter: blur(8px);
|
|
1455
|
+
border-radius: 24px;
|
|
1456
|
+
animation: ${t.KEYFRAMES.fadeIn} 0.2s ease-out;
|
|
1457
|
+
pointer-events: none;
|
|
1458
|
+
color: ${t.COLORS.black};
|
|
1459
|
+
`,_a=s.span`
|
|
1460
|
+
font-size: 14px;
|
|
1461
|
+
font-weight: 500;
|
|
1462
|
+
white-space: nowrap;
|
|
1463
|
+
`,oo={xs:{size:"16px",borderWidth:"2px"},sm:{size:"20px",borderWidth:"2px"},md:{size:"32px",borderWidth:"3px"},lg:{size:"48px",borderWidth:"4px"}},ro={track:t.alpha(t.COLORS.black,15),indicator:t.COLORS.black},ut=e=>oo[e]??oo.md,Ma=ie.keyframes`
|
|
1464
|
+
0% {
|
|
1465
|
+
transform: rotate(0deg);
|
|
1466
|
+
}
|
|
1467
|
+
100% {
|
|
1468
|
+
transform: rotate(360deg);
|
|
1469
|
+
}
|
|
1470
|
+
`,Fa=s.div`
|
|
1471
|
+
display: inline-block;
|
|
1472
|
+
width: ${e=>ut(e.$size).size};
|
|
1473
|
+
height: ${e=>ut(e.$size).size};
|
|
1474
|
+
border: ${e=>ut(e.$size).borderWidth} solid ${ro.track};
|
|
1475
|
+
border-top-color: ${ro.indicator};
|
|
1476
|
+
border-radius: 50%;
|
|
1477
|
+
animation: ${Ma} 0.8s linear infinite;
|
|
1478
|
+
`,Ba=I.newClassNameGetter("spinner"),Ro=({"aria-label":e="Loading",className:o,ref:r,size:i="md",...n})=>a.jsx(Fa,{...n,ref:r,className:Ba("container",o),role:"status","aria-label":e,$size:i}),Ya=({children:e,defaultMessage:o="Saving"})=>{const[r,i]=g.useState(!1),[n,l]=g.useState(o),c=g.useCallback(b=>{l(b??o),i(!0)},[o]),d=g.useCallback(()=>{i(!1)},[]),p=g.useMemo(()=>({isVisible:r,show:c,hide:d}),[r,c,d]);return a.jsxs(wo.Provider,{value:p,children:[e,r&&a.jsxs(Da,{children:[a.jsx(Ro,{size:"sm"}),a.jsx(_a,{children:n})]})]})},Ha=()=>{const e=g.useContext(wo);if(!e)throw new Error("useSaveProgress must be used within SaveProgressProvider");return e},ht=40,ze=4,io={compact:{height:"32px",padding:"0 10px",radius:"14px"},default:{height:"40px",padding:"0 14px",radius:"16px"}},no={normal:{background:{static:t.alpha(t.COLORS.black,2),disabled:t.alpha(t.COLORS.black,10)},border:{static:t.alpha(t.COLORS.black,60),disabled:t.alpha(t.COLORS.black,10)},color:{static:t.COLORS.black,disabled:t.alpha(t.COLORS.black,65)},placeholder:t.alpha(t.COLORS.black,40),focus:t.alpha(t.COLORS["iron-grey"],30)},error:{background:{static:t.alpha(t.COLORS.red,2),disabled:t.alpha(t.COLORS.red,10)},border:{static:t.alpha(t.COLORS.red,60),disabled:t.alpha(t.COLORS.red,10)},color:{static:t.COLORS.red,disabled:t.alpha(t.COLORS.red,65)},placeholder:t.alpha(t.COLORS.red,40),focus:t.alpha(t.COLORS.red,30)}},bt=e=>io[e]??io.default,le=e=>no[e]??no.normal,Ga=s.div`
|
|
1445
1479
|
position: relative;
|
|
1446
1480
|
display: grid;
|
|
1447
1481
|
gap: 2px;
|
|
1448
1482
|
min-width: 180px;
|
|
1449
1483
|
width: ${e=>e.$fullWidth?"100%":"fit-content"};
|
|
1450
|
-
`,
|
|
1484
|
+
`,Va=s(fe)`
|
|
1451
1485
|
margin-left: 6px;
|
|
1452
|
-
`,
|
|
1486
|
+
`,Wa=s.button`
|
|
1453
1487
|
display: flex;
|
|
1454
1488
|
align-items: center;
|
|
1455
1489
|
justify-content: space-between;
|
|
@@ -1460,9 +1494,9 @@
|
|
|
1460
1494
|
font-weight: 500;
|
|
1461
1495
|
text-align: left;
|
|
1462
1496
|
cursor: ${e=>e.$disabled?"not-allowed":"pointer"};
|
|
1463
|
-
height: ${e=>
|
|
1464
|
-
padding: ${e=>
|
|
1465
|
-
border-radius: ${e=>
|
|
1497
|
+
height: ${e=>bt(e.$size).height};
|
|
1498
|
+
padding: ${e=>bt(e.$size).padding};
|
|
1499
|
+
border-radius: ${e=>bt(e.$size).radius};
|
|
1466
1500
|
|
|
1467
1501
|
color: ${e=>e.$hasValue?e.$disabled?le(e.$variant).color.disabled:le(e.$variant).color.static:le(e.$variant).placeholder};
|
|
1468
1502
|
border: 1px solid
|
|
@@ -1472,35 +1506,35 @@
|
|
|
1472
1506
|
&:focus-visible {
|
|
1473
1507
|
outline: 2px solid ${e=>le(e.$variant).focus};
|
|
1474
1508
|
}
|
|
1475
|
-
`,
|
|
1509
|
+
`,Ua=s.span`
|
|
1476
1510
|
flex: 1;
|
|
1477
1511
|
min-width: 0;
|
|
1478
1512
|
overflow: hidden;
|
|
1479
1513
|
text-overflow: ellipsis;
|
|
1480
1514
|
white-space: nowrap;
|
|
1481
|
-
`,
|
|
1515
|
+
`,Xa=s.span`
|
|
1482
1516
|
display: flex;
|
|
1483
1517
|
align-items: center;
|
|
1484
1518
|
justify-content: center;
|
|
1485
1519
|
flex-shrink: 0;
|
|
1486
1520
|
transition: transform 0.2s ease;
|
|
1487
1521
|
transform: rotate(${e=>e.$open?"180deg":"0deg"});
|
|
1488
|
-
`,
|
|
1522
|
+
`,ko=`
|
|
1489
1523
|
padding: 4px;
|
|
1490
1524
|
background: ${t.COLORS.white};
|
|
1491
1525
|
border: 1px solid ${t.alpha(t.COLORS.black,10)};
|
|
1492
1526
|
border-radius: 16px;
|
|
1493
1527
|
box-shadow: 0 4px 20px ${t.alpha(t.COLORS.black,15)};
|
|
1494
1528
|
z-index: 1000;
|
|
1495
|
-
`,
|
|
1529
|
+
`,qa=s.div`
|
|
1496
1530
|
position: absolute;
|
|
1497
1531
|
left: -4px;
|
|
1498
1532
|
width: calc(100% + 8px);
|
|
1499
|
-
${
|
|
1500
|
-
`,
|
|
1533
|
+
${ko}
|
|
1534
|
+
`,Ka=s.div`
|
|
1501
1535
|
position: fixed;
|
|
1502
|
-
${
|
|
1503
|
-
`,
|
|
1536
|
+
${ko}
|
|
1537
|
+
`,Za=s.button`
|
|
1504
1538
|
display: flex;
|
|
1505
1539
|
align-items: center;
|
|
1506
1540
|
justify-content: space-between;
|
|
@@ -1526,28 +1560,13 @@
|
|
|
1526
1560
|
outline: none;
|
|
1527
1561
|
background: ${t.alpha(t.COLORS.black,8)};
|
|
1528
1562
|
}
|
|
1529
|
-
`,
|
|
1563
|
+
`,Ja=s.span`
|
|
1530
1564
|
display: flex;
|
|
1531
1565
|
align-items: center;
|
|
1532
1566
|
justify-content: center;
|
|
1533
1567
|
flex-shrink: 0;
|
|
1534
1568
|
color: ${t.COLORS.black};
|
|
1535
|
-
`,ye=I.newClassNameGetter("select"),
|
|
1536
|
-
0% {
|
|
1537
|
-
transform: rotate(0deg);
|
|
1538
|
-
}
|
|
1539
|
-
100% {
|
|
1540
|
-
transform: rotate(360deg);
|
|
1541
|
-
}
|
|
1542
|
-
`,Wa=s.div`
|
|
1543
|
-
display: inline-block;
|
|
1544
|
-
width: ${e=>bt(e.$size).size};
|
|
1545
|
-
height: ${e=>bt(e.$size).size};
|
|
1546
|
-
border: ${e=>bt(e.$size).borderWidth} solid ${no.track};
|
|
1547
|
-
border-top-color: ${no.indicator};
|
|
1548
|
-
border-radius: 50%;
|
|
1549
|
-
animation: ${Va} 0.8s linear infinite;
|
|
1550
|
-
`,Ua=I.newClassNameGetter("spinner"),Xa=({"aria-label":e="Loading",className:o,ref:r,size:i="md",...n})=>a.jsx(Wa,{...n,ref:r,className:Ua("container",o),role:"status","aria-label":e,$size:i}),ao={positive:t.COLORS.green,negative:t.COLORS.red,neutral:t.COLORS["iron-grey"]},qa=e=>ao[e]??ao.neutral,Ka=s.div`
|
|
1569
|
+
`,ye=I.newClassNameGetter("select"),Qa=({className:e,classnames:o,disabled:r=!1,fullWidth:i=!1,label:n,onChange:l,options:c,placeholder:d="Select...",portalRenderNode:p,ref:b,size:h="default",value:f,variant:O="normal",...w})=>{const[y,S]=g.useState(!1),[v,x]=g.useState({top:0,left:0,width:0}),$=g.useRef(null),u=g.useRef(null),P=g.useRef(null),j=c.find(m=>m.value===f),T=Math.max(0,c.findIndex(m=>m.value===f)),Y=-(T*ht+ze),z=()=>{if(!u.current||!p)return;const m=u.current.getBoundingClientRect(),N=T*ht+ze;let k=m.top-N;const _=c.length*ht+ze*2,H=8,M=window.innerHeight-_-8;k<H&&(k=H),k>M&&(k=M),x({top:k,left:m.left-ze,width:m.width+ze*2})},D=m=>{var N;l==null||l(m),S(!1),(N=u.current)==null||N.focus()},E=m=>{r||(m.key==="Enter"||m.key===" "?(m.preventDefault(),S(N=>!N)):m.key==="Escape"&&y?(m.preventDefault(),S(!1)):m.key==="ArrowDown"&&!y&&(m.preventDefault(),S(!0)))};g.useLayoutEffect(()=>{y&&p&&z()},[y,p,T,c.length]),g.useEffect(()=>{if(!y)return;const m=_=>{const H=_.target,M=$.current&&!$.current.contains(H),G=P.current&&!P.current.contains(H);p?M&&G&&S(!1):M&&S(!1)},N=()=>{p&&z()},k=()=>{p&&z()};return document.addEventListener("mousedown",m),p&&(window.addEventListener("scroll",N,!0),window.addEventListener("resize",k)),()=>{document.removeEventListener("mousedown",m),window.removeEventListener("scroll",N,!0),window.removeEventListener("resize",k)}},[y,p]);const R=()=>c.map(m=>a.jsxs(Za,{type:"button",role:"option",$selected:m.value===f,$disabled:m.disabled??!1,disabled:m.disabled,"aria-selected":m.value===f,onClick:()=>D(m.value),className:ye("option",o==null?void 0:o.option),children:[a.jsx("span",{children:m.label}),m.value===f&&a.jsx(Ja,{children:a.jsx(a.Check,{size:16})})]},m.value)),F=p?ge.createPortal(a.jsx(Ka,{ref:P,role:"listbox",style:{top:v.top,left:v.left,width:v.width},className:ye("dropdown",o==null?void 0:o.dropdown),children:R()}),p):a.jsx(qa,{ref:P,role:"listbox",style:{top:Y},className:ye("dropdown",o==null?void 0:o.dropdown),children:R()});return a.jsxs(Ga,{...w,ref:m=>{$.current=m,typeof b=="function"?b(m):b&&(b.current=m)},$fullWidth:i,className:ye("container",e),children:[n&&a.jsx(Va,{className:ye("label",o==null?void 0:o.label),children:n}),a.jsxs(Wa,{ref:u,type:"button",$size:h,$variant:O,$disabled:r,$hasValue:!!j,disabled:r,onClick:()=>!r&&S(m=>!m),onKeyDown:E,"aria-haspopup":"listbox","aria-expanded":y,className:ye("trigger",o==null?void 0:o.trigger),children:[a.jsx(Ua,{children:(j==null?void 0:j.label)??d}),a.jsx(Xa,{$open:y,children:a.jsx(a.ChevronDown,{size:16})})]}),y&&F]})},ao={positive:t.COLORS.green,negative:t.COLORS.red,neutral:t.COLORS["iron-grey"]},el=e=>ao[e]??ao.neutral,tl=s.div`
|
|
1551
1570
|
display: flex;
|
|
1552
1571
|
flex-direction: column;
|
|
1553
1572
|
gap: 4px;
|
|
@@ -1556,16 +1575,16 @@
|
|
|
1556
1575
|
border-radius: 16px;
|
|
1557
1576
|
border: ${({$border:e})=>e?"1px solid #e5e7eb":"none"};
|
|
1558
1577
|
box-shadow: ${({$shadow:e})=>e?"0 4px 6px -1px rgba(0, 0, 0, 0.1)":"none"};
|
|
1559
|
-
`,
|
|
1578
|
+
`,ol=s.div`
|
|
1560
1579
|
display: flex;
|
|
1561
1580
|
align-items: center;
|
|
1562
1581
|
justify-content: space-between;
|
|
1563
1582
|
gap: 8px;
|
|
1564
|
-
`,
|
|
1583
|
+
`,rl=s.p`
|
|
1565
1584
|
margin: 0;
|
|
1566
1585
|
font-size: 13px;
|
|
1567
1586
|
color: ${t.COLORS["iron-grey"]};
|
|
1568
|
-
`,
|
|
1587
|
+
`,il=s.div`
|
|
1569
1588
|
display: flex;
|
|
1570
1589
|
align-items: center;
|
|
1571
1590
|
justify-content: center;
|
|
@@ -1579,21 +1598,21 @@
|
|
|
1579
1598
|
width: 18px;
|
|
1580
1599
|
height: 18px;
|
|
1581
1600
|
}
|
|
1582
|
-
`,
|
|
1601
|
+
`,nl=s.h3`
|
|
1583
1602
|
margin: 0;
|
|
1584
1603
|
font-size: 28px;
|
|
1585
1604
|
font-weight: 600;
|
|
1586
1605
|
line-height: 1.2;
|
|
1587
1606
|
color: ${t.COLORS.black};
|
|
1588
|
-
`,
|
|
1607
|
+
`,al=s.p`
|
|
1589
1608
|
margin: 0;
|
|
1590
1609
|
font-size: 12px;
|
|
1591
|
-
color: ${({$variant:e})=>
|
|
1592
|
-
`,Ue=I.newClassNameGetter("status-card"),
|
|
1610
|
+
color: ${({$variant:e})=>el(e)};
|
|
1611
|
+
`,Ue=I.newClassNameGetter("status-card"),ll=({border:e=!1,className:o,classnames:r,icon:i,label:n,ref:l,shadow:c=!1,trend:d,trendVariant:p="neutral",value:b,...h})=>a.jsxs(tl,{...h,ref:l,className:Ue("container",o),$border:e,$shadow:c,children:[a.jsxs(ol,{children:[a.jsx(rl,{className:Ue("label",r==null?void 0:r.label),children:n}),i&&a.jsx(il,{children:i})]}),a.jsx(nl,{className:Ue("value",r==null?void 0:r.value),children:b}),d&&a.jsx(al,{className:Ue("trend",r==null?void 0:r.trend),$variant:p,children:d})]}),dl=s.div`
|
|
1593
1612
|
display: flex;
|
|
1594
1613
|
align-items: ${e=>e.$orientation==="vertical"?"flex-start":"center"};
|
|
1595
1614
|
flex-direction: ${e=>e.$orientation==="vertical"?"column":"row"};
|
|
1596
|
-
`,
|
|
1615
|
+
`,cl=s.div`
|
|
1597
1616
|
display: flex;
|
|
1598
1617
|
align-items: ${e=>e.$orientation==="vertical"?"flex-start":"center"};
|
|
1599
1618
|
flex-direction: ${e=>e.$orientation==="vertical"?"column":"row"};
|
|
@@ -1602,7 +1621,7 @@
|
|
|
1602
1621
|
&:last-child {
|
|
1603
1622
|
flex: 0;
|
|
1604
1623
|
}
|
|
1605
|
-
`,
|
|
1624
|
+
`,sl=s.button`
|
|
1606
1625
|
display: flex;
|
|
1607
1626
|
align-items: center;
|
|
1608
1627
|
gap: 10px;
|
|
@@ -1620,7 +1639,7 @@
|
|
|
1620
1639
|
outline-offset: 2px;
|
|
1621
1640
|
}
|
|
1622
1641
|
}
|
|
1623
|
-
`,
|
|
1642
|
+
`,pl=s.div`
|
|
1624
1643
|
display: flex;
|
|
1625
1644
|
align-items: center;
|
|
1626
1645
|
justify-content: center;
|
|
@@ -1644,13 +1663,13 @@
|
|
|
1644
1663
|
border: 2px solid ${t.COLORS.gray};
|
|
1645
1664
|
color: ${t.COLORS["iron-grey"]};
|
|
1646
1665
|
`}
|
|
1647
|
-
`,
|
|
1666
|
+
`,ul=s.span`
|
|
1648
1667
|
font-size: 14px;
|
|
1649
1668
|
font-weight: 500;
|
|
1650
1669
|
white-space: nowrap;
|
|
1651
1670
|
color: ${e=>e.$active||e.$completed?t.COLORS.black:t.COLORS["iron-grey"]};
|
|
1652
1671
|
transition: color 0.2s ease;
|
|
1653
|
-
`,
|
|
1672
|
+
`,hl=s.div`
|
|
1654
1673
|
background-color: ${e=>e.$completed?t.COLORS.black:t.COLORS.gray};
|
|
1655
1674
|
transition: background-color 0.2s ease;
|
|
1656
1675
|
|
|
@@ -1664,15 +1683,15 @@
|
|
|
1664
1683
|
min-width: 16px;
|
|
1665
1684
|
margin: 0 12px;
|
|
1666
1685
|
`}
|
|
1667
|
-
`,je=I.newClassNameGetter("stepper"),
|
|
1686
|
+
`,je=I.newClassNameGetter("stepper"),bl=({className:e,classnames:o,onChange:r,orientation:i="horizontal",ref:n,steps:l,value:c,...d})=>{const p=g.useMemo(()=>l.findIndex(b=>b.value===c),[l,c]);return a.jsx(dl,{...d,ref:n,$orientation:i,className:je("container",e),children:l.map((b,h)=>{const f=b.value===c,O=h<p,w=h===l.length-1;return a.jsxs(cl,{$orientation:i,children:[a.jsxs(sl,{type:"button",$active:f,$completed:O,$clickable:!!r,onClick:()=>r==null?void 0:r(b.value),className:je("step",o==null?void 0:o.step),children:[a.jsx(pl,{$active:f,$completed:O,className:je("circle",o==null?void 0:o.circle),children:h+1}),a.jsx(ul,{$active:f,$completed:O,className:je("label",o==null?void 0:o.label),children:b.label})]}),!w&&a.jsx(hl,{$completed:O,$orientation:i,className:je("line",o==null?void 0:o.line)})]},b.value)})})},vt={normal:{border:t.COLORS["iron-grey"],label:t.COLORS.black},error:{border:t.COLORS.red,label:t.COLORS.red}},gl=s.div`
|
|
1668
1687
|
position: relative;
|
|
1669
1688
|
display: flex;
|
|
1670
1689
|
flex-direction: column;
|
|
1671
1690
|
gap: 4px;
|
|
1672
|
-
`,
|
|
1691
|
+
`,fl=s(fe)`
|
|
1673
1692
|
margin-left: 6px;
|
|
1674
1693
|
color: ${e=>vt[e.$variant].label};
|
|
1675
|
-
`,
|
|
1694
|
+
`,xl=s.div`
|
|
1676
1695
|
display: flex;
|
|
1677
1696
|
flex-wrap: wrap;
|
|
1678
1697
|
align-items: center;
|
|
@@ -1694,7 +1713,7 @@
|
|
|
1694
1713
|
outline: 2px solid ${e.$variant==="error"?t.COLORS.red:t.COLORS["steel-blue"]};
|
|
1695
1714
|
outline-offset: 2px;
|
|
1696
1715
|
`}
|
|
1697
|
-
`,
|
|
1716
|
+
`,Ol=s.input`
|
|
1698
1717
|
flex: 1;
|
|
1699
1718
|
min-width: 80px;
|
|
1700
1719
|
border: none;
|
|
@@ -1711,7 +1730,7 @@
|
|
|
1711
1730
|
&:disabled {
|
|
1712
1731
|
cursor: not-allowed;
|
|
1713
1732
|
}
|
|
1714
|
-
`,
|
|
1733
|
+
`,Lo=`
|
|
1715
1734
|
z-index: 100;
|
|
1716
1735
|
background-color: ${t.COLORS.white};
|
|
1717
1736
|
border: 1px solid ${t.alpha(t.COLORS.black,15)};
|
|
@@ -1719,27 +1738,27 @@
|
|
|
1719
1738
|
box-shadow: 0 4px 16px ${t.alpha(t.COLORS.black,12)};
|
|
1720
1739
|
max-height: 200px;
|
|
1721
1740
|
overflow-y: auto;
|
|
1722
|
-
`,
|
|
1741
|
+
`,Po=(e,o)=>e?"translateY(0)":o==="bottom"?"translateY(-8px)":"translateY(8px)",zo=`
|
|
1723
1742
|
opacity 0.15s ease,
|
|
1724
1743
|
transform 0.15s ease,
|
|
1725
1744
|
visibility 0.15s;
|
|
1726
|
-
|
|
1745
|
+
`,$l=s.div`
|
|
1727
1746
|
position: absolute;
|
|
1728
1747
|
left: 0;
|
|
1729
1748
|
right: 0;
|
|
1730
1749
|
${e=>e.$position==="bottom"?"top: calc(100% + 4px);":"bottom: calc(100% + 4px);"}
|
|
1731
|
-
${
|
|
1750
|
+
${Lo}
|
|
1732
1751
|
opacity: ${e=>e.$open?1:0};
|
|
1733
1752
|
visibility: ${e=>e.$open?"visible":"hidden"};
|
|
1734
|
-
transform: ${e=>
|
|
1735
|
-
transition: ${
|
|
1736
|
-
`,
|
|
1753
|
+
transform: ${e=>Po(e.$open,e.$position)};
|
|
1754
|
+
transition: ${zo};
|
|
1755
|
+
`,Sl=s.div`
|
|
1737
1756
|
position: fixed;
|
|
1738
|
-
${
|
|
1757
|
+
${Lo}
|
|
1739
1758
|
opacity: ${e=>e.$open?1:0};
|
|
1740
1759
|
visibility: ${e=>e.$open?"visible":"hidden"};
|
|
1741
|
-
transform: ${e=>
|
|
1742
|
-
transition: ${
|
|
1760
|
+
transform: ${e=>Po(e.$open,e.$position)};
|
|
1761
|
+
transition: ${zo};
|
|
1743
1762
|
`,lo=s.button`
|
|
1744
1763
|
display: flex;
|
|
1745
1764
|
align-items: center;
|
|
@@ -1776,11 +1795,11 @@
|
|
|
1776
1795
|
color: ${t.COLORS["iron-grey"]};
|
|
1777
1796
|
font-size: 14px;
|
|
1778
1797
|
text-align: center;
|
|
1779
|
-
`,ee=I.newClassNameGetter("tags"),Xe=4,
|
|
1798
|
+
`,ee=I.newClassNameGetter("tags"),Xe=4,yl=({className:e,classnames:o,createKey:r="Tab",disabled:i=!1,emptyMessage:n="No options",freeSolo:l=!0,label:c,onChange:d,options:p=[],placeholder:b="Add tag...",portalRenderNode:h,ref:f,value:O,variant:w="normal",...y})=>{const S=g.useRef(null),v=g.useRef(null),x=g.useRef(null),$=g.useRef(null),[u,P]=g.useState(""),[j,T]=g.useState(!1),[Y,z]=g.useState("bottom"),[D,E]=g.useState({top:0,left:0,width:0}),R=g.useMemo(()=>{const L=p.filter(X=>!O.includes(X.value));if(!u.trim())return L;const A=u.toLowerCase().trim();return L.filter(X=>X.label.toLowerCase().includes(A))},[p,O,u]),F=j&&p.length>0,m=g.useCallback(()=>{var Ae;if(!v.current)return;const L=v.current.getBoundingClientRect(),A=((Ae=x.current)==null?void 0:Ae.offsetHeight)??200,X=window.innerHeight-L.bottom-Xe,q=L.top-Xe,xe=X<A&&q>X?"top":"bottom";if(z(xe),h){const et=xe==="bottom"?L.bottom+Xe:L.top-A-Xe;E({top:et,left:L.left,width:L.width})}},[h]);g.useEffect(()=>{if(j)return m(),window.addEventListener("scroll",m,!0),window.addEventListener("resize",m),()=>{window.removeEventListener("scroll",m,!0),window.removeEventListener("resize",m)}},[j,m]);const N=g.useCallback(L=>{const A=L.trim();return!A||O.includes(A)?!1:(d([...O,A]),P(""),!0)},[O,d]),k=L=>{if(L.key===r&&u.trim())if(L.preventDefault(),l)N(u);else{const A=R.find(X=>X.label.toLowerCase()===u.toLowerCase().trim());A&&N(A.value)}else L.key==="Backspace"&&!u&&O.length>0&&d(O.slice(0,-1))},_=L=>{var A;N(L),(A=$.current)==null||A.focus()},H=L=>{d(O.filter(A=>A!==L))},M=()=>{var L;i||(L=$.current)==null||L.focus()},G=L=>{const A=p.find(X=>X.value===L);return(A==null?void 0:A.label)??L};return a.jsxs(gl,{...y,ref:f,className:ee("container",e),children:[c&&a.jsx(fl,{$variant:w,className:ee("label"),children:c}),a.jsxs("div",{ref:S,style:{position:"relative"},children:[a.jsxs(xl,{ref:v,$variant:w,$disabled:i,$focused:j,onClick:M,className:ee("trigger",o==null?void 0:o.trigger),children:[O.map(L=>a.jsx(Ke,{deletable:!i,onDelete:()=>H(L),className:ee("chip",o==null?void 0:o.chip),children:G(L)},L)),a.jsx(Ol,{ref:$,type:"text",value:u,onChange:L=>P(L.target.value),onFocus:()=>T(!0),onBlur:()=>setTimeout(()=>T(!1),150),onKeyDown:k,placeholder:O.length===0?b:"",disabled:i,$disabled:i,className:ee("input",o==null?void 0:o.input)})]}),p.length>0&&(h?ge.createPortal(a.jsx(Sl,{ref:x,$open:F,$position:Y,style:{top:D.top,left:D.left,width:D.width},className:ee("dropdown",o==null?void 0:o.dropdown),children:R.length===0?a.jsx(co,{className:ee("empty",o==null?void 0:o.empty),children:n}):R.map(L=>a.jsx(lo,{type:"button",onMouseDown:A=>A.preventDefault(),onClick:()=>_(L.value),className:ee("option",o==null?void 0:o.option),children:L.label},L.value))}),h):a.jsx($l,{ref:x,$open:F,$position:Y,className:ee("dropdown",o==null?void 0:o.dropdown),children:R.length===0?a.jsx(co,{className:ee("empty",o==null?void 0:o.empty),children:n}):R.map(L=>a.jsx(lo,{type:"button",onMouseDown:A=>A.preventDefault(),onClick:()=>_(L.value),className:ee("option",o==null?void 0:o.option),children:L.label},L.value))}))]})]})},vl=s.div`
|
|
1780
1799
|
display: flex;
|
|
1781
1800
|
align-items: center;
|
|
1782
1801
|
gap: 6px;
|
|
1783
|
-
`,
|
|
1802
|
+
`,ml=s.button`
|
|
1784
1803
|
padding: 6px 16px;
|
|
1785
1804
|
border: none;
|
|
1786
1805
|
border-radius: 12px;
|
|
@@ -1803,7 +1822,7 @@
|
|
|
1803
1822
|
outline: 2px solid ${t.COLORS["steel-blue"]};
|
|
1804
1823
|
outline-offset: 2px;
|
|
1805
1824
|
}
|
|
1806
|
-
`,so=I.newClassNameGetter("tabs")
|
|
1825
|
+
`,so=I.newClassNameGetter("tabs"),Cl=({className:e,classnames:o,onChange:r,ref:i,tabs:n,value:l,...c})=>a.jsx(vl,{...c,ref:i,className:so("container",e),role:"tablist",children:n.map(d=>a.jsx(ml,{type:"button",role:"tab","aria-selected":l===d.value,$active:l===d.value,$disabled:!!d.disabled,disabled:d.disabled,onClick:()=>r(d.value),className:so("tab",o==null?void 0:o.tab),children:d.label},d.value))}),jo=g.createContext(null),gt=3,po={default:{background:"#374151",text:t.COLORS.white,border:"#374151"},success:{background:t.COLORS.green,text:t.COLORS.white,border:t.COLORS.green},warning:{background:t.COLORS.yellow,text:t.COLORS.white,border:t.COLORS.yellow},danger:{background:t.COLORS.red,text:t.COLORS.white,border:t.COLORS.red}},wl=(e,o)=>{switch(o.type){case"ADD_TOAST":{const r=o.payload;return e.toasts.length<gt?{...e,toasts:[...e.toasts,r]}:{...e,queue:[...e.queue,r]}}case"REMOVE_TOAST":{const r=o.payload,i=e.toasts.filter(l=>l.id!==r),n=e.queue[0];return n&&i.length<gt?{toasts:[...i,n],queue:e.queue.slice(1)}:{...e,toasts:i}}case"SHOW_NEXT_FROM_QUEUE":{const r=e.queue[0];return!r||e.toasts.length>=gt?e:{toasts:[...e.toasts,r],queue:e.queue.slice(1)}}default:return e}},Rl={toasts:[],queue:[]},ft=e=>po[e]??po.default,kl=ie.keyframes`
|
|
1807
1826
|
from {
|
|
1808
1827
|
transform: translateY(100%);
|
|
1809
1828
|
opacity: 0;
|
|
@@ -1812,7 +1831,7 @@
|
|
|
1812
1831
|
transform: translateY(0);
|
|
1813
1832
|
opacity: 1;
|
|
1814
1833
|
}
|
|
1815
|
-
`,
|
|
1834
|
+
`,Ll=ie.keyframes`
|
|
1816
1835
|
from {
|
|
1817
1836
|
transform: translateY(0);
|
|
1818
1837
|
opacity: 1;
|
|
@@ -1821,7 +1840,7 @@
|
|
|
1821
1840
|
transform: translateY(100%);
|
|
1822
1841
|
opacity: 0;
|
|
1823
1842
|
}
|
|
1824
|
-
`,
|
|
1843
|
+
`,Pl=s.div`
|
|
1825
1844
|
position: fixed;
|
|
1826
1845
|
bottom: 24px;
|
|
1827
1846
|
left: 24px;
|
|
@@ -1832,7 +1851,7 @@
|
|
|
1832
1851
|
pointer-events: none;
|
|
1833
1852
|
width: auto;
|
|
1834
1853
|
max-width: 90vw;
|
|
1835
|
-
`,
|
|
1854
|
+
`,zl=s.div`
|
|
1836
1855
|
display: flex;
|
|
1837
1856
|
align-items: center;
|
|
1838
1857
|
justify-content: space-between;
|
|
@@ -1844,17 +1863,17 @@
|
|
|
1844
1863
|
border: 1px solid ${({$variant:e})=>ft(e).border};
|
|
1845
1864
|
border-radius: 96px;
|
|
1846
1865
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
|
|
1847
|
-
animation: ${({$isExiting:e})=>e?
|
|
1866
|
+
animation: ${({$isExiting:e})=>e?Ll:kl} 0.3s ease-out;
|
|
1848
1867
|
pointer-events: auto;
|
|
1849
1868
|
max-width: 500px;
|
|
1850
|
-
`,
|
|
1869
|
+
`,jl=s.span`
|
|
1851
1870
|
font-size: 14px;
|
|
1852
1871
|
font-weight: 500;
|
|
1853
1872
|
line-height: 1.4;
|
|
1854
1873
|
white-space: nowrap;
|
|
1855
1874
|
overflow: hidden;
|
|
1856
1875
|
text-overflow: ellipsis;
|
|
1857
|
-
`,
|
|
1876
|
+
`,El=s.button`
|
|
1858
1877
|
display: flex;
|
|
1859
1878
|
align-items: center;
|
|
1860
1879
|
justify-content: center;
|
|
@@ -1872,13 +1891,13 @@
|
|
|
1872
1891
|
&:hover {
|
|
1873
1892
|
opacity: 1;
|
|
1874
1893
|
}
|
|
1875
|
-
`,
|
|
1894
|
+
`,Tl=s.div`
|
|
1876
1895
|
display: flex;
|
|
1877
1896
|
align-items: center;
|
|
1878
1897
|
justify-content: space-between;
|
|
1879
1898
|
gap: 12px;
|
|
1880
1899
|
width: 100%;
|
|
1881
|
-
`,
|
|
1900
|
+
`,Nl=s.div`
|
|
1882
1901
|
display: flex;
|
|
1883
1902
|
align-items: center;
|
|
1884
1903
|
justify-content: center;
|
|
@@ -1893,7 +1912,7 @@
|
|
|
1893
1912
|
font-weight: 500;
|
|
1894
1913
|
white-space: nowrap;
|
|
1895
1914
|
margin-left: auto;
|
|
1896
|
-
`,uo=({toast:e,onRemove:o})=>{const[r,i]=g.useState(!1),n=()=>{i(!0),setTimeout(()=>{o(e.id)},300)};return g.useEffect(()=>{if(e.duration){const l=setTimeout(()=>{n()},e.duration);return()=>clearTimeout(l)}},[e.duration,e.id]),a.jsxs(
|
|
1915
|
+
`,uo=({toast:e,onRemove:o})=>{const[r,i]=g.useState(!1),n=()=>{i(!0),setTimeout(()=>{o(e.id)},300)};return g.useEffect(()=>{if(e.duration){const l=setTimeout(()=>{n()},e.duration);return()=>clearTimeout(l)}},[e.duration,e.id]),a.jsxs(zl,{$variant:e.variant,$isExiting:r,children:[a.jsx(jl,{children:e.message}),a.jsx(El,{onClick:n,children:a.jsx(a.X,{style:{width:16,height:16}})})]})},Il=({toasts:e,queueCount:o,removeToast:r})=>{if(e.length===0)return null;const i=e.length-1;return a.jsx(Pl,{children:e.map((n,l)=>l===i&&o>0?a.jsxs(Tl,{children:[a.jsx(uo,{toast:n,onRemove:r}),a.jsxs(Nl,{children:["+",o]})]},n.id):a.jsx(uo,{toast:n,onRemove:r},n.id))})},Al=({children:e})=>{const[o,r]=g.useReducer(wl,Rl),i=g.useCallback((l,c="default",d)=>{const p=`toast-${Date.now()}-${Math.random().toString(36).substr(2,9)}`;r({type:"ADD_TOAST",payload:{id:p,message:l,variant:c,duration:d}})},[]),n=g.useCallback(l=>{r({type:"REMOVE_TOAST",payload:l})},[]);return a.jsxs(jo.Provider,{value:{addToast:i,removeToast:n},children:[e,a.jsx(Il,{toasts:o.toasts,queueCount:o.queue.length,removeToast:n})]})},Dl=()=>{const e=g.useContext(jo);if(!e)throw new Error("useToast must be used within ToastProvider");return e},ho={dark:{background:t.COLORS.black,text:t.COLORS.white},light:{background:t.COLORS.white,text:t.COLORS.black,border:t.COLORS.gray},success:{background:t.COLORS.green,text:t.COLORS.white},warning:{background:t.COLORS.yellow,text:t.COLORS.white},danger:{background:t.COLORS.red,text:t.COLORS.white}},Ne=e=>ho[e]??ho.dark,_l=(e,o)=>{const r=Ne(o).background;switch(e){case"top":return`
|
|
1897
1916
|
bottom: -12px;
|
|
1898
1917
|
left: 50%;
|
|
1899
1918
|
margin-left: -6px;
|
|
@@ -1913,7 +1932,7 @@
|
|
|
1913
1932
|
top: 50%;
|
|
1914
1933
|
margin-top: -6px;
|
|
1915
1934
|
border-right-color: ${r};
|
|
1916
|
-
`;default:return""}},
|
|
1935
|
+
`;default:return""}},Ml=(e,o)=>{if(o!=="light")return"";const r=Ne(o).border;switch(e){case"top":return`
|
|
1917
1936
|
&::after {
|
|
1918
1937
|
bottom: -14px;
|
|
1919
1938
|
left: 50%;
|
|
@@ -1941,7 +1960,7 @@
|
|
|
1941
1960
|
margin-top: -7px;
|
|
1942
1961
|
border-right-color: ${r};
|
|
1943
1962
|
}
|
|
1944
|
-
`;default:return""}},
|
|
1963
|
+
`;default:return""}},Eo=e=>`
|
|
1945
1964
|
z-index: 1000;
|
|
1946
1965
|
padding: 6px 12px;
|
|
1947
1966
|
background-color: ${Ne(e.$variant).background};
|
|
@@ -1967,7 +1986,7 @@
|
|
|
1967
1986
|
width: 0;
|
|
1968
1987
|
height: 0;
|
|
1969
1988
|
border: 6px solid transparent;
|
|
1970
|
-
${
|
|
1989
|
+
${_l(e.$placement,e.$variant)}
|
|
1971
1990
|
}
|
|
1972
1991
|
|
|
1973
1992
|
${e.$variant==="light"?`
|
|
@@ -1980,11 +1999,11 @@
|
|
|
1980
1999
|
}
|
|
1981
2000
|
`:""}
|
|
1982
2001
|
|
|
1983
|
-
${
|
|
1984
|
-
`,
|
|
2002
|
+
${Ml(e.$placement,e.$variant)}
|
|
2003
|
+
`,Fl=s.div`
|
|
1985
2004
|
position: relative;
|
|
1986
2005
|
display: inline-block;
|
|
1987
|
-
`,
|
|
2006
|
+
`,Bl=e=>{switch(e){case"top":return`
|
|
1988
2007
|
bottom: calc(100% + 8px);
|
|
1989
2008
|
left: 50%;
|
|
1990
2009
|
transform: translateX(-50%);
|
|
@@ -2000,12 +2019,12 @@
|
|
|
2000
2019
|
left: calc(100% + 8px);
|
|
2001
2020
|
top: 50%;
|
|
2002
2021
|
transform: translateY(-50%);
|
|
2003
|
-
`;default:return""}},
|
|
2022
|
+
`;default:return""}},Yl=s.div`
|
|
2004
2023
|
position: absolute;
|
|
2005
|
-
${e=>
|
|
2006
|
-
${({$placement:e})=>
|
|
2007
|
-
`,
|
|
2024
|
+
${e=>Eo(e)}
|
|
2025
|
+
${({$placement:e})=>Bl(e)}
|
|
2026
|
+
`,Hl=s.div`
|
|
2008
2027
|
position: fixed;
|
|
2009
|
-
${e=>
|
|
2010
|
-
`,xt=I.newClassNameGetter("tooltip"),de=8,
|
|
2028
|
+
${e=>Eo(e)}
|
|
2029
|
+
`,xt=I.newClassNameGetter("tooltip"),de=8,Gl=({children:e,className:o,classnames:r,content:i,delay:n=200,placement:l="top",portalRenderNode:c,ref:d,variant:p="dark",...b})=>{const[h,f]=g.useState(!1),[O,w]=g.useState(null),[y,S]=g.useState(l),[v,x]=g.useState({top:0,left:0}),$=g.useRef(null),u=g.useRef(null),P=g.useCallback(()=>{var _,H;if(!$.current)return;const z=$.current.getBoundingClientRect(),D=((_=u.current)==null?void 0:_.offsetWidth)??100,E=((H=u.current)==null?void 0:H.offsetHeight)??30,R=z.top-de,F=window.innerHeight-z.bottom-de,m=z.left-de,N=window.innerWidth-z.right-de;let k=l;if(l==="top"&&R<E&&F>R?k="bottom":l==="bottom"&&F<E&&R>F?k="top":l==="left"&&m<D&&N>m?k="right":l==="right"&&N<D&&m>N&&(k="left"),S(k),c){let M,G;switch(k){case"top":M=z.top-E-de,G=z.left+z.width/2-D/2;break;case"bottom":M=z.bottom+de,G=z.left+z.width/2-D/2;break;case"left":M=z.top+z.height/2-E/2,G=z.left-D-de;break;case"right":M=z.top+z.height/2-E/2,G=z.right+de;break;default:M=0,G=0}const L=8;G=Math.max(L,Math.min(G,window.innerWidth-D-L)),M=Math.max(L,Math.min(M,window.innerHeight-E-L)),x({top:M,left:G})}},[l,c]);g.useLayoutEffect(()=>{h&&P()},[h,P]);const j=()=>{const z=setTimeout(()=>{f(!0)},n);w(z)},T=()=>{O&&(clearTimeout(O),w(null)),f(!1)},Y=c?ge.createPortal(a.jsx(Hl,{ref:u,className:xt("content",r==null?void 0:r.content),$placement:y,$variant:p,$visible:h,style:{top:v.top,left:v.left},children:i}),c):a.jsx(Yl,{ref:u,className:xt("content",r==null?void 0:r.content),$placement:y,$variant:p,$visible:h,children:i});return a.jsxs(Fl,{...b,ref:z=>{$.current=z,typeof d=="function"?d(z):d&&(d.current=z)},className:xt("wrapper",o),onMouseEnter:j,onMouseLeave:T,children:[e,Y]})};exports.Button=Ie;exports.Card=xr;exports.Checkbox=Je;exports.CheckboxCard=Lr;exports.CheckboxGroup=Er;exports.Chip=Ke;exports.Confirmation=Hr;exports.Container=Wr;exports.DatePicker=yi;exports.Drawer=Ri;exports.Dropdown=Ei;exports.FieldLabel=fe;exports.FieldMessage=Ai;exports.GlobalStyle=Qo;exports.ImageCropper=Gn;exports.Input=vo;exports.KeySymbol=bo;exports.KeysBindings=go;exports.Modal=mo;exports.MultiSelect=la;exports.OtpCode=ua;exports.Panel=Oa;exports.Progress=ya;exports.Radio=mt;exports.RadioCard=Ea;exports.RadioGroup=Aa;exports.SaveProgressProvider=Ya;exports.Select=Qa;exports.Spinner=Ro;exports.StatusCard=ll;exports.Stepper=bl;exports.Tabs=Cl;exports.Tags=yl;exports.ToastProvider=Al;exports.Tooltip=Gl;exports.formatDateGo=fo;exports.useImageCropper=yo;exports.useSaveProgress=Ha;exports.useToast=Dl;
|
|
2011
2030
|
//# sourceMappingURL=index.cjs.map
|