@lax-wp/design-system 0.4.7 → 0.4.9
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/components/forms/file-upload-dragger/FileUpload.d.ts +1 -15
- package/dist/components/forms/multi-file-upload/MultiFileUpload.d.ts +37 -2
- package/dist/components/modal/drawer/Drawer.d.ts +1 -1
- package/dist/design-system.css +1 -1
- package/dist/index.es.js +16945 -16894
- package/dist/index.umd.js +108 -108
- package/dist/utils/utilities.d.ts +1 -0
- package/package.json +4 -3
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { FC } from 'react';
|
|
1
|
+
import { type FC } from 'react';
|
|
2
2
|
/**
|
|
3
3
|
* Context interface for global agreement draggable functionality
|
|
4
4
|
*/
|
|
@@ -59,22 +59,8 @@ export type FileUploadDraggerProps = {
|
|
|
59
59
|
hideSelectedFile?: boolean;
|
|
60
60
|
/** Maximum file size in bytes */
|
|
61
61
|
maxSize?: number;
|
|
62
|
-
/** Toast function for notifications */
|
|
63
|
-
toast?: {
|
|
64
|
-
error: (message: string, options?: {
|
|
65
|
-
toastId: string;
|
|
66
|
-
}) => void;
|
|
67
|
-
};
|
|
68
62
|
/** File upload service */
|
|
69
63
|
fileUploadService?: FileUploadService;
|
|
70
|
-
/** System messages */
|
|
71
|
-
systemMessages?: SystemMessages;
|
|
72
|
-
/** Build query params function */
|
|
73
|
-
buildQueryParams?: (params: Record<string, string | null>) => string;
|
|
74
|
-
/** Get token function */
|
|
75
|
-
getToken?: () => string | null;
|
|
76
|
-
/** Context for global agreement draggable */
|
|
77
|
-
globalAgreementDraggableContext?: GlobalAgreementDraggableContext;
|
|
78
64
|
/** Custom click to upload text */
|
|
79
65
|
clickToUploadText?: string;
|
|
80
66
|
/** Custom drag and drop text */
|
|
@@ -11,6 +11,16 @@ export interface FileUploadResult {
|
|
|
11
11
|
* Union type for file change callback parameter
|
|
12
12
|
*/
|
|
13
13
|
export type FileChangeValue = File | File[] | FileUploadResult | FileUploadResult[] | string | string[] | null;
|
|
14
|
+
/**
|
|
15
|
+
* File upload service interface
|
|
16
|
+
*/
|
|
17
|
+
export interface FileUploadService {
|
|
18
|
+
uploadFileToFileServer: (formData: FormData, queryParams: string) => Promise<{
|
|
19
|
+
fileUrl: string;
|
|
20
|
+
fileName: string;
|
|
21
|
+
}>;
|
|
22
|
+
deleteFileFromFileServer: (fileName: string, queryParams: string) => Promise<void>;
|
|
23
|
+
}
|
|
14
24
|
/**
|
|
15
25
|
* Props for the MultiFileUpload component
|
|
16
26
|
*/
|
|
@@ -47,9 +57,11 @@ export interface MultiFileUploadProps {
|
|
|
47
57
|
getRealFileName?: boolean;
|
|
48
58
|
/** Maximum file size in bytes (default: 50MB) */
|
|
49
59
|
maxSize?: number;
|
|
50
|
-
/**
|
|
60
|
+
/** File upload service for server uploads */
|
|
61
|
+
fileUploadService?: FileUploadService;
|
|
62
|
+
/** Custom upload handler function (alternative to fileUploadService) */
|
|
51
63
|
onUpload?: (files: File[]) => Promise<FileUploadResult[]>;
|
|
52
|
-
/** Custom delete handler function */
|
|
64
|
+
/** Custom delete handler function (called after file deletion) */
|
|
53
65
|
onDelete?: (fileData?: FileUploadResult) => Promise<void>;
|
|
54
66
|
/** Additional CSS classes for the wrapper */
|
|
55
67
|
wrapperClassName?: string;
|
|
@@ -59,20 +71,43 @@ export interface MultiFileUploadProps {
|
|
|
59
71
|
showFileSize?: boolean;
|
|
60
72
|
/** Custom file size formatter */
|
|
61
73
|
formatFileSize?: (size: number) => string;
|
|
74
|
+
/** Custom click to upload text */
|
|
75
|
+
clickToUploadText?: string;
|
|
76
|
+
/** Custom drag and drop text */
|
|
77
|
+
dragAndDropText?: string;
|
|
78
|
+
/** Callback when file size exceeds limit */
|
|
79
|
+
onFileSizeError?: (maxSizeMB: number) => void;
|
|
62
80
|
}
|
|
63
81
|
/**
|
|
64
82
|
* A highly customizable multi-file upload component with drag-and-drop support.
|
|
65
83
|
* Features file validation, base64 conversion, server upload, and comprehensive styling options.
|
|
66
84
|
*
|
|
67
85
|
* @example
|
|
86
|
+
* // Using with fileUploadService (recommended for server uploads)
|
|
68
87
|
* ```tsx
|
|
69
88
|
* <MultiFileUpload
|
|
70
89
|
* id="file-upload"
|
|
71
90
|
* description="Upload your documents"
|
|
72
91
|
* onFileChange={(files) => console.log(files)}
|
|
92
|
+
* toFileServer
|
|
93
|
+
* fileUploadService={attachmentServices}
|
|
73
94
|
* multiple
|
|
74
95
|
* maxSize={10 * 1024 * 1024} // 10MB
|
|
75
96
|
* />
|
|
76
97
|
* ```
|
|
98
|
+
*
|
|
99
|
+
* @example
|
|
100
|
+
* // Using with custom onUpload handler
|
|
101
|
+
* ```tsx
|
|
102
|
+
* <MultiFileUpload
|
|
103
|
+
* id="file-upload"
|
|
104
|
+
* onFileChange={(files) => console.log(files)}
|
|
105
|
+
* toFileServer
|
|
106
|
+
* onUpload={async (files) => {
|
|
107
|
+
* // Custom upload logic
|
|
108
|
+
* return files.map(f => ({ filename: f.name, fileUrl: 'url' }));
|
|
109
|
+
* }}
|
|
110
|
+
* />
|
|
111
|
+
* ```
|
|
77
112
|
*/
|
|
78
113
|
export declare const MultiFileUpload: import("react").ForwardRefExoticComponent<MultiFileUploadProps & import("react").RefAttributes<HTMLDivElement>>;
|
package/dist/design-system.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.tooltip-container{--tooltipBackground: #101828;--tooltipBorder: #252525;--tooltipColor: #fff;background-color:var(--tooltipBackground);border-radius:8px;border:1px solid var(--tooltipBorder);box-shadow:0 2px 4px #0000002e;color:var(--tooltipColor);display:flex;flex-direction:column;padding:4px 8px;transition:opacity .3s;z-index:9999;overflow-wrap:break-word;word-wrap:break-word;max-width:40ch;font-size:12px;font-weight:500}.tooltip-content{display:flex;align-items:center;gap:8px}.tooltip-title{flex:1}.tooltip-shortcuts{display:flex;align-items:center;gap:2px;flex-shrink:0}.tooltip-shortcut-key{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 4px;background-color:#ffffff1a;border:1px solid rgba(255,255,255,.2);border-radius:4px;font-family:inherit;font-size:11px;font-weight:500;color:#fffc;line-height:1}.tooltip-container[data-popper-interactive=false]{pointer-events:none}.tooltip-arrow{height:1rem;position:absolute;width:1rem;pointer-events:none}.tooltip-arrow:before{border-style:solid;content:"";display:block;height:0;margin:auto;width:0}.tooltip-arrow:after{border-style:solid;content:"";display:block;height:0;margin:auto;position:absolute;width:0}.tooltip-container[data-popper-placement*=bottom] .tooltip-arrow{left:0;margin-top:-.4rem;top:0}.tooltip-container[data-popper-placement*=bottom] .tooltip-arrow:before{border-color:transparent transparent var(--tooltipBorder) transparent;border-width:0 .5rem .4rem .5rem;position:absolute;top:-2px}.tooltip-container[data-popper-placement*=bottom] .tooltip-arrow:after{border-color:transparent transparent var(--tooltipBackground) transparent;border-width:0 .5rem .4rem .5rem}.tooltip-container[data-popper-placement*=top] .tooltip-arrow{bottom:0;left:0;margin-bottom:-1rem}.tooltip-container[data-popper-placement*=top] .tooltip-arrow:before{border-color:var(--tooltipBorder) transparent transparent transparent;border-width:.4rem .5rem 0 .5rem;position:absolute;top:1px}.tooltip-container[data-popper-placement*=top] .tooltip-arrow:after{border-color:var(--tooltipBackground) transparent transparent transparent;border-width:.4rem .5rem 0 .5rem}.tooltip-container[data-popper-placement*=right] .tooltip-arrow{left:0;margin-left:-.7rem}.tooltip-container[data-popper-placement*=right] .tooltip-arrow:before{border-color:transparent var(--tooltipBorder) transparent transparent}.tooltip-container[data-popper-placement*=right] .tooltip-arrow:after{border-color:transparent var(--tooltipBackground) transparent transparent;border-width:.5rem .4rem .5rem 0;left:6px;top:0}.tooltip-container[data-popper-placement*=left] .tooltip-arrow{margin-right:-.7rem;right:0}.tooltip-container[data-popper-placement*=left] .tooltip-arrow:before{border-color:transparent transparent transparent var(--tooltipBorder);border-width:.5rem 0 .5rem .4em}.tooltip-container[data-popper-placement*=left] .tooltip-arrow:after{border-color:transparent transparent transparent var(--tooltipBackground);border-width:.5rem 0 .5rem .4em;left:3px;top:0}:root{--toastify-color-light: #fff;--toastify-color-dark: #121212;--toastify-color-info: #3498db;--toastify-color-success: #07bc0c;--toastify-color-warning: #f1c40f;--toastify-color-error: #e74c3c;--toastify-color-transparent: rgba(255, 255, 255, .7);--toastify-icon-color-info: var(--toastify-color-info);--toastify-icon-color-success: var(--toastify-color-success);--toastify-icon-color-warning: var(--toastify-color-warning);--toastify-icon-color-error: var(--toastify-color-error);--toastify-toast-width: 320px;--toastify-toast-offset: 16px;--toastify-toast-top: max(var(--toastify-toast-offset), env(safe-area-inset-top));--toastify-toast-right: max(var(--toastify-toast-offset), env(safe-area-inset-right));--toastify-toast-left: max(var(--toastify-toast-offset), env(safe-area-inset-left));--toastify-toast-bottom: max(var(--toastify-toast-offset), env(safe-area-inset-bottom));--toastify-toast-background: #fff;--toastify-toast-min-height: 64px;--toastify-toast-max-height: 800px;--toastify-toast-bd-radius: 6px;--toastify-font-family: sans-serif;--toastify-z-index: 9999;--toastify-text-color-light: #757575;--toastify-text-color-dark: #fff;--toastify-text-color-info: #fff;--toastify-text-color-success: #fff;--toastify-text-color-warning: #fff;--toastify-text-color-error: #fff;--toastify-spinner-color: #616161;--toastify-spinner-color-empty-area: #e0e0e0;--toastify-color-progress-light: linear-gradient( to right, #4cd964, #5ac8fa, #007aff, #34aadc, #5856d6, #ff2d55 );--toastify-color-progress-dark: #bb86fc;--toastify-color-progress-info: var(--toastify-color-info);--toastify-color-progress-success: var(--toastify-color-success);--toastify-color-progress-warning: var(--toastify-color-warning);--toastify-color-progress-error: var(--toastify-color-error);--toastify-color-progress-bgo: .2}.Toastify__toast-container{z-index:var(--toastify-z-index);-webkit-transform:translate3d(0,0,var(--toastify-z-index));position:fixed;padding:4px;width:var(--toastify-toast-width);box-sizing:border-box;color:#fff}.Toastify__toast-container--top-left{top:var(--toastify-toast-top);left:var(--toastify-toast-left)}.Toastify__toast-container--top-center{top:var(--toastify-toast-top);left:50%;transform:translate(-50%)}.Toastify__toast-container--top-right{top:var(--toastify-toast-top);right:var(--toastify-toast-right)}.Toastify__toast-container--bottom-left{bottom:var(--toastify-toast-bottom);left:var(--toastify-toast-left)}.Toastify__toast-container--bottom-center{bottom:var(--toastify-toast-bottom);left:50%;transform:translate(-50%)}.Toastify__toast-container--bottom-right{bottom:var(--toastify-toast-bottom);right:var(--toastify-toast-right)}@media only screen and (max-width : 480px){.Toastify__toast-container{width:100vw;padding:0;left:env(safe-area-inset-left);margin:0}.Toastify__toast-container--top-left,.Toastify__toast-container--top-center,.Toastify__toast-container--top-right{top:env(safe-area-inset-top);transform:translate(0)}.Toastify__toast-container--bottom-left,.Toastify__toast-container--bottom-center,.Toastify__toast-container--bottom-right{bottom:env(safe-area-inset-bottom);transform:translate(0)}.Toastify__toast-container--rtl{right:env(safe-area-inset-right);left:initial}}.Toastify__toast{--y: 0;position:relative;-ms-touch-action:none;touch-action:none;min-height:var(--toastify-toast-min-height);box-sizing:border-box;margin-bottom:1rem;padding:8px;border-radius:var(--toastify-toast-bd-radius);box-shadow:0 4px 12px #0000001a;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;max-height:var(--toastify-toast-max-height);font-family:var(--toastify-font-family);cursor:default;direction:ltr;z-index:0;overflow:hidden}.Toastify__toast--stacked{position:absolute;width:100%;transform:translate3d(0,var(--y),0) scale(var(--s));transition:transform .3s}.Toastify__toast--stacked[data-collapsed] .Toastify__toast-body,.Toastify__toast--stacked[data-collapsed] .Toastify__close-button{transition:opacity .1s}.Toastify__toast--stacked[data-collapsed=false]{overflow:visible}.Toastify__toast--stacked[data-collapsed=true]:not(:last-child)>*{opacity:0}.Toastify__toast--stacked:after{content:"";position:absolute;left:0;right:0;height:calc(var(--g) * 1px);bottom:100%}.Toastify__toast--stacked[data-pos=top]{top:0}.Toastify__toast--stacked[data-pos=bot]{bottom:0}.Toastify__toast--stacked[data-pos=bot].Toastify__toast--stacked:before{transform-origin:top}.Toastify__toast--stacked[data-pos=top].Toastify__toast--stacked:before{transform-origin:bottom}.Toastify__toast--stacked:before{content:"";position:absolute;left:0;right:0;bottom:0;height:100%;transform:scaleY(3);z-index:-1}.Toastify__toast--rtl{direction:rtl}.Toastify__toast--close-on-click{cursor:pointer}.Toastify__toast-body{margin:auto 0;-ms-flex:1 1 auto;flex:1 1 auto;padding:6px;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}.Toastify__toast-body>div:last-child{word-break:break-word;-ms-flex:1;flex:1}.Toastify__toast-icon{-webkit-margin-end:10px;margin-inline-end:10px;width:20px;-ms-flex-negative:0;flex-shrink:0;display:-ms-flexbox;display:flex}.Toastify--animate{animation-fill-mode:both;animation-duration:.5s}.Toastify--animate-icon{animation-fill-mode:both;animation-duration:.3s}@media only screen and (max-width : 480px){.Toastify__toast{margin-bottom:0;border-radius:0}}.Toastify__toast-theme--dark{background:var(--toastify-color-dark);color:var(--toastify-text-color-dark)}.Toastify__toast-theme--light,.Toastify__toast-theme--colored.Toastify__toast--default{background:var(--toastify-color-light);color:var(--toastify-text-color-light)}.Toastify__toast-theme--colored.Toastify__toast--info{color:var(--toastify-text-color-info);background:var(--toastify-color-info)}.Toastify__toast-theme--colored.Toastify__toast--success{color:var(--toastify-text-color-success);background:var(--toastify-color-success)}.Toastify__toast-theme--colored.Toastify__toast--warning{color:var(--toastify-text-color-warning);background:var(--toastify-color-warning)}.Toastify__toast-theme--colored.Toastify__toast--error{color:var(--toastify-text-color-error);background:var(--toastify-color-error)}.Toastify__progress-bar-theme--light{background:var(--toastify-color-progress-light)}.Toastify__progress-bar-theme--dark{background:var(--toastify-color-progress-dark)}.Toastify__progress-bar--info{background:var(--toastify-color-progress-info)}.Toastify__progress-bar--success{background:var(--toastify-color-progress-success)}.Toastify__progress-bar--warning{background:var(--toastify-color-progress-warning)}.Toastify__progress-bar--error{background:var(--toastify-color-progress-error)}.Toastify__progress-bar-theme--colored.Toastify__progress-bar--info,.Toastify__progress-bar-theme--colored.Toastify__progress-bar--success,.Toastify__progress-bar-theme--colored.Toastify__progress-bar--warning,.Toastify__progress-bar-theme--colored.Toastify__progress-bar--error{background:var(--toastify-color-transparent)}.Toastify__close-button{color:#fff;background:transparent;outline:none;border:none;padding:0;cursor:pointer;opacity:.7;transition:.3s ease;-ms-flex-item-align:start;align-self:flex-start;z-index:1}.Toastify__close-button--light{color:#000;opacity:.3}.Toastify__close-button>svg{fill:currentColor;height:16px;width:14px}.Toastify__close-button:hover,.Toastify__close-button:focus{opacity:1}@keyframes Toastify__trackProgress{0%{transform:scaleX(1)}to{transform:scaleX(0)}}.Toastify__progress-bar{position:absolute;bottom:0;left:0;width:100%;height:100%;z-index:var(--toastify-z-index);opacity:.7;transform-origin:left;border-bottom-left-radius:var(--toastify-toast-bd-radius)}.Toastify__progress-bar--animated{animation:Toastify__trackProgress linear 1 forwards}.Toastify__progress-bar--controlled{transition:transform .2s}.Toastify__progress-bar--rtl{right:0;left:initial;transform-origin:right;border-bottom-left-radius:initial;border-bottom-right-radius:var(--toastify-toast-bd-radius)}.Toastify__progress-bar--wrp{position:absolute;bottom:0;left:0;width:100%;height:5px;border-bottom-left-radius:var(--toastify-toast-bd-radius)}.Toastify__progress-bar--wrp[data-hidden=true]{opacity:0}.Toastify__progress-bar--bg{opacity:var(--toastify-color-progress-bgo);width:100%;height:100%}.Toastify__spinner{width:20px;height:20px;box-sizing:border-box;border:2px solid;border-radius:100%;border-color:var(--toastify-spinner-color-empty-area);border-right-color:var(--toastify-spinner-color);animation:Toastify__spin .65s linear infinite}@keyframes Toastify__bounceInRight{0%,60%,75%,90%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(3000px,0,0)}60%{opacity:1;transform:translate3d(-25px,0,0)}75%{transform:translate3d(10px,0,0)}90%{transform:translate3d(-5px,0,0)}to{transform:none}}@keyframes Toastify__bounceOutRight{20%{opacity:1;transform:translate3d(-20px,var(--y),0)}to{opacity:0;transform:translate3d(2000px,var(--y),0)}}@keyframes Toastify__bounceInLeft{0%,60%,75%,90%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(-3000px,0,0)}60%{opacity:1;transform:translate3d(25px,0,0)}75%{transform:translate3d(-10px,0,0)}90%{transform:translate3d(5px,0,0)}to{transform:none}}@keyframes Toastify__bounceOutLeft{20%{opacity:1;transform:translate3d(20px,var(--y),0)}to{opacity:0;transform:translate3d(-2000px,var(--y),0)}}@keyframes Toastify__bounceInUp{0%,60%,75%,90%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(0,3000px,0)}60%{opacity:1;transform:translate3d(0,-20px,0)}75%{transform:translate3d(0,10px,0)}90%{transform:translate3d(0,-5px,0)}to{transform:translateZ(0)}}@keyframes Toastify__bounceOutUp{20%{transform:translate3d(0,calc(var(--y) - 10px),0)}40%,45%{opacity:1;transform:translate3d(0,calc(var(--y) + 20px),0)}to{opacity:0;transform:translate3d(0,-2000px,0)}}@keyframes Toastify__bounceInDown{0%,60%,75%,90%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(0,-3000px,0)}60%{opacity:1;transform:translate3d(0,25px,0)}75%{transform:translate3d(0,-10px,0)}90%{transform:translate3d(0,5px,0)}to{transform:none}}@keyframes Toastify__bounceOutDown{20%{transform:translate3d(0,calc(var(--y) - 10px),0)}40%,45%{opacity:1;transform:translate3d(0,calc(var(--y) + 20px),0)}to{opacity:0;transform:translate3d(0,2000px,0)}}.Toastify__bounce-enter--top-left,.Toastify__bounce-enter--bottom-left{animation-name:Toastify__bounceInLeft}.Toastify__bounce-enter--top-right,.Toastify__bounce-enter--bottom-right{animation-name:Toastify__bounceInRight}.Toastify__bounce-enter--top-center{animation-name:Toastify__bounceInDown}.Toastify__bounce-enter--bottom-center{animation-name:Toastify__bounceInUp}.Toastify__bounce-exit--top-left,.Toastify__bounce-exit--bottom-left{animation-name:Toastify__bounceOutLeft}.Toastify__bounce-exit--top-right,.Toastify__bounce-exit--bottom-right{animation-name:Toastify__bounceOutRight}.Toastify__bounce-exit--top-center{animation-name:Toastify__bounceOutUp}.Toastify__bounce-exit--bottom-center{animation-name:Toastify__bounceOutDown}@keyframes Toastify__zoomIn{0%{opacity:0;transform:scale3d(.3,.3,.3)}50%{opacity:1}}@keyframes Toastify__zoomOut{0%{opacity:1}50%{opacity:0;transform:translate3d(0,var(--y),0) scale3d(.3,.3,.3)}to{opacity:0}}.Toastify__zoom-enter{animation-name:Toastify__zoomIn}.Toastify__zoom-exit{animation-name:Toastify__zoomOut}@keyframes Toastify__flipIn{0%{transform:perspective(400px) rotateX(90deg);animation-timing-function:ease-in;opacity:0}40%{transform:perspective(400px) rotateX(-20deg);animation-timing-function:ease-in}60%{transform:perspective(400px) rotateX(10deg);opacity:1}80%{transform:perspective(400px) rotateX(-5deg)}to{transform:perspective(400px)}}@keyframes Toastify__flipOut{0%{transform:translate3d(0,var(--y),0) perspective(400px)}30%{transform:translate3d(0,var(--y),0) perspective(400px) rotateX(-20deg);opacity:1}to{transform:translate3d(0,var(--y),0) perspective(400px) rotateX(90deg);opacity:0}}.Toastify__flip-enter{animation-name:Toastify__flipIn}.Toastify__flip-exit{animation-name:Toastify__flipOut}@keyframes Toastify__slideInRight{0%{transform:translate3d(110%,0,0);visibility:visible}to{transform:translate3d(0,var(--y),0)}}@keyframes Toastify__slideInLeft{0%{transform:translate3d(-110%,0,0);visibility:visible}to{transform:translate3d(0,var(--y),0)}}@keyframes Toastify__slideInUp{0%{transform:translate3d(0,110%,0);visibility:visible}to{transform:translate3d(0,var(--y),0)}}@keyframes Toastify__slideInDown{0%{transform:translate3d(0,-110%,0);visibility:visible}to{transform:translate3d(0,var(--y),0)}}@keyframes Toastify__slideOutRight{0%{transform:translate3d(0,var(--y),0)}to{visibility:hidden;transform:translate3d(110%,var(--y),0)}}@keyframes Toastify__slideOutLeft{0%{transform:translate3d(0,var(--y),0)}to{visibility:hidden;transform:translate3d(-110%,var(--y),0)}}@keyframes Toastify__slideOutDown{0%{transform:translate3d(0,var(--y),0)}to{visibility:hidden;transform:translate3d(0,500px,0)}}@keyframes Toastify__slideOutUp{0%{transform:translate3d(0,var(--y),0)}to{visibility:hidden;transform:translate3d(0,-500px,0)}}.Toastify__slide-enter--top-left,.Toastify__slide-enter--bottom-left{animation-name:Toastify__slideInLeft}.Toastify__slide-enter--top-right,.Toastify__slide-enter--bottom-right{animation-name:Toastify__slideInRight}.Toastify__slide-enter--top-center{animation-name:Toastify__slideInDown}.Toastify__slide-enter--bottom-center{animation-name:Toastify__slideInUp}.Toastify__slide-exit--top-left,.Toastify__slide-exit--bottom-left{animation-name:Toastify__slideOutLeft;animation-timing-function:ease-in;animation-duration:.3s}.Toastify__slide-exit--top-right,.Toastify__slide-exit--bottom-right{animation-name:Toastify__slideOutRight;animation-timing-function:ease-in;animation-duration:.3s}.Toastify__slide-exit--top-center{animation-name:Toastify__slideOutUp;animation-timing-function:ease-in;animation-duration:.3s}.Toastify__slide-exit--bottom-center{animation-name:Toastify__slideOutDown;animation-timing-function:ease-in;animation-duration:.3s}@keyframes Toastify__spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.Toastify__toast-container{z-index:100000}.Toastify__toast{min-height:64px;border-radius:4px;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}.Toastify__toast--success,.Toastify__toast--error,.Toastify__toast--warning,.Toastify__toast--info{background:transparent}.Toastify__toast-body{padding:0;margin:0;color:inherit;font-size:14px;font-weight:500;line-height:1.5}.Toastify__close-button{color:inherit;opacity:.7;align-self:flex-start;background:transparent;border:none;padding:4px;margin:0;transition:opacity .2s ease}.Toastify__close-button:hover{opacity:1}.Toastify__progress-bar{background:linear-gradient(to right,#4caf50,#8bc34a,#cddc39,#ffeb3b,#ffc107,#ff9800,#ff5722)}.Toastify__progress-bar--success{background:#12b76a}.Toastify__progress-bar--error{background:#f04438}.Toastify__progress-bar--warning{background:#f79009}.Toastify__progress-bar--info{background:#016dcf}@media (prefers-color-scheme: dark){.Toastify__toast-container{background:transparent}.Toastify__toast{box-shadow:0 4px 6px -1px #0000004d,0 2px 4px -1px #0003}}@media screen and (max-width: 640px){.Toastify__toast-container{left:1rem;right:1rem;bottom:1rem;width:auto}.Toastify__toast{margin-bottom:.5rem}}.Toastify__slide-enter--bottom-right,.Toastify__slide-enter--bottom-left,.Toastify__slide-enter--bottom-center{animation-duration:.3s;animation-timing-function:cubic-bezier(.4,0,.2,1)}.Toastify__slide-exit--bottom-right,.Toastify__slide-exit--bottom-left,.Toastify__slide-exit--bottom-center{animation-duration:.2s;animation-timing-function:cubic-bezier(.4,0,1,1)}
|
|
1
|
+
.tooltip-container{--tooltipBackground: #101828;--tooltipBorder: #252525;--tooltipColor: #fff;background-color:var(--tooltipBackground);border-radius:8px;border:1px solid var(--tooltipBorder);box-shadow:0 2px 4px #0000002e;color:var(--tooltipColor);display:flex;flex-direction:column;padding:4px 8px;transition:opacity .3s;z-index:9999;overflow-wrap:break-word;word-wrap:break-word;max-width:40ch;font-size:12px;font-weight:500}.tooltip-content{display:flex;align-items:center;gap:8px}.tooltip-title{flex:1}.tooltip-shortcuts{display:flex;align-items:center;gap:2px;flex-shrink:0}.tooltip-shortcut-key{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 4px;background-color:#ffffff1a;border:1px solid rgba(255,255,255,.2);border-radius:4px;font-family:inherit;font-size:11px;font-weight:500;color:#fffc;line-height:1}.tooltip-container[data-popper-interactive=false]{pointer-events:none}.tooltip-arrow{height:1rem;position:absolute;width:1rem;pointer-events:none}.tooltip-arrow:before{border-style:solid;content:"";display:block;height:0;margin:auto;width:0}.tooltip-arrow:after{border-style:solid;content:"";display:block;height:0;margin:auto;position:absolute;width:0}.tooltip-container[data-popper-placement*=bottom] .tooltip-arrow{left:0;margin-top:-.4rem;top:0}.tooltip-container[data-popper-placement*=bottom] .tooltip-arrow:before{border-color:transparent transparent var(--tooltipBorder) transparent;border-width:0 .5rem .4rem .5rem;position:absolute;top:-2px}.tooltip-container[data-popper-placement*=bottom] .tooltip-arrow:after{border-color:transparent transparent var(--tooltipBackground) transparent;border-width:0 .5rem .4rem .5rem}.tooltip-container[data-popper-placement*=top] .tooltip-arrow{bottom:0;left:0;margin-bottom:-1rem}.tooltip-container[data-popper-placement*=top] .tooltip-arrow:before{border-color:var(--tooltipBorder) transparent transparent transparent;border-width:.4rem .5rem 0 .5rem;position:absolute;top:1px}.tooltip-container[data-popper-placement*=top] .tooltip-arrow:after{border-color:var(--tooltipBackground) transparent transparent transparent;border-width:.4rem .5rem 0 .5rem}.tooltip-container[data-popper-placement*=right] .tooltip-arrow{left:0;margin-left:-.7rem}.tooltip-container[data-popper-placement*=right] .tooltip-arrow:before{border-color:transparent var(--tooltipBorder) transparent transparent}.tooltip-container[data-popper-placement*=right] .tooltip-arrow:after{border-color:transparent var(--tooltipBackground) transparent transparent;border-width:.5rem .4rem .5rem 0;left:6px;top:0}.tooltip-container[data-popper-placement*=left] .tooltip-arrow{margin-right:-.7rem;right:0}.tooltip-container[data-popper-placement*=left] .tooltip-arrow:before{border-color:transparent transparent transparent var(--tooltipBorder);border-width:.5rem 0 .5rem .4em}.tooltip-container[data-popper-placement*=left] .tooltip-arrow:after{border-color:transparent transparent transparent var(--tooltipBackground);border-width:.5rem 0 .5rem .4em;left:3px;top:0}:root{--toastify-color-light: #fff;--toastify-color-dark: #121212;--toastify-color-info: #3498db;--toastify-color-success: #07bc0c;--toastify-color-warning: #f1c40f;--toastify-color-error: #e74c3c;--toastify-color-transparent: rgba(255, 255, 255, .7);--toastify-icon-color-info: var(--toastify-color-info);--toastify-icon-color-success: var(--toastify-color-success);--toastify-icon-color-warning: var(--toastify-color-warning);--toastify-icon-color-error: var(--toastify-color-error);--toastify-toast-width: 320px;--toastify-toast-background: #fff;--toastify-toast-min-height: 64px;--toastify-toast-max-height: 800px;--toastify-font-family: sans-serif;--toastify-z-index: 9999;--toastify-text-color-light: #757575;--toastify-text-color-dark: #fff;--toastify-text-color-info: #fff;--toastify-text-color-success: #fff;--toastify-text-color-warning: #fff;--toastify-text-color-error: #fff;--toastify-spinner-color: #616161;--toastify-spinner-color-empty-area: #e0e0e0;--toastify-color-progress-light: linear-gradient( to right, #4cd964, #5ac8fa, #007aff, #34aadc, #5856d6, #ff2d55 );--toastify-color-progress-dark: #bb86fc;--toastify-color-progress-info: var(--toastify-color-info);--toastify-color-progress-success: var(--toastify-color-success);--toastify-color-progress-warning: var(--toastify-color-warning);--toastify-color-progress-error: var(--toastify-color-error)}.Toastify__toast-container{z-index:var(--toastify-z-index);-webkit-transform:translate3d(0,0,var(--toastify-z-index));position:fixed;padding:4px;width:var(--toastify-toast-width);box-sizing:border-box;color:#fff}.Toastify__toast-container--top-left{top:1em;left:1em}.Toastify__toast-container--top-center{top:1em;left:50%;transform:translate(-50%)}.Toastify__toast-container--top-right{top:1em;right:1em}.Toastify__toast-container--bottom-left{bottom:1em;left:1em}.Toastify__toast-container--bottom-center{bottom:1em;left:50%;transform:translate(-50%)}.Toastify__toast-container--bottom-right{bottom:1em;right:1em}@media only screen and (max-width : 480px){.Toastify__toast-container{width:100vw;padding:0;left:0;margin:0}.Toastify__toast-container--top-left,.Toastify__toast-container--top-center,.Toastify__toast-container--top-right{top:0;transform:translate(0)}.Toastify__toast-container--bottom-left,.Toastify__toast-container--bottom-center,.Toastify__toast-container--bottom-right{bottom:0;transform:translate(0)}.Toastify__toast-container--rtl{right:0;left:initial}}.Toastify__toast{position:relative;min-height:var(--toastify-toast-min-height);box-sizing:border-box;margin-bottom:1rem;padding:8px;border-radius:4px;box-shadow:0 1px 10px #0000001a,0 2px 15px #0000000d;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;max-height:var(--toastify-toast-max-height);overflow:hidden;font-family:var(--toastify-font-family);cursor:default;direction:ltr;z-index:0}.Toastify__toast--rtl{direction:rtl}.Toastify__toast--close-on-click{cursor:pointer}.Toastify__toast-body{margin:auto 0;-ms-flex:1 1 auto;flex:1 1 auto;padding:6px;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}.Toastify__toast-body>div:last-child{word-break:break-word;-ms-flex:1;flex:1}.Toastify__toast-icon{-webkit-margin-end:10px;margin-inline-end:10px;width:20px;-ms-flex-negative:0;flex-shrink:0;display:-ms-flexbox;display:flex}.Toastify--animate{animation-fill-mode:both;animation-duration:.7s}.Toastify--animate-icon{animation-fill-mode:both;animation-duration:.3s}@media only screen and (max-width : 480px){.Toastify__toast{margin-bottom:0;border-radius:0}}.Toastify__toast-theme--dark{background:var(--toastify-color-dark);color:var(--toastify-text-color-dark)}.Toastify__toast-theme--light,.Toastify__toast-theme--colored.Toastify__toast--default{background:var(--toastify-color-light);color:var(--toastify-text-color-light)}.Toastify__toast-theme--colored.Toastify__toast--info{color:var(--toastify-text-color-info);background:var(--toastify-color-info)}.Toastify__toast-theme--colored.Toastify__toast--success{color:var(--toastify-text-color-success);background:var(--toastify-color-success)}.Toastify__toast-theme--colored.Toastify__toast--warning{color:var(--toastify-text-color-warning);background:var(--toastify-color-warning)}.Toastify__toast-theme--colored.Toastify__toast--error{color:var(--toastify-text-color-error);background:var(--toastify-color-error)}.Toastify__progress-bar-theme--light{background:var(--toastify-color-progress-light)}.Toastify__progress-bar-theme--dark{background:var(--toastify-color-progress-dark)}.Toastify__progress-bar--info{background:var(--toastify-color-progress-info)}.Toastify__progress-bar--success{background:var(--toastify-color-progress-success)}.Toastify__progress-bar--warning{background:var(--toastify-color-progress-warning)}.Toastify__progress-bar--error{background:var(--toastify-color-progress-error)}.Toastify__progress-bar-theme--colored.Toastify__progress-bar--info,.Toastify__progress-bar-theme--colored.Toastify__progress-bar--success,.Toastify__progress-bar-theme--colored.Toastify__progress-bar--warning,.Toastify__progress-bar-theme--colored.Toastify__progress-bar--error{background:var(--toastify-color-transparent)}.Toastify__close-button{color:#fff;background:transparent;outline:none;border:none;padding:0;cursor:pointer;opacity:.7;transition:.3s ease;-ms-flex-item-align:start;align-self:flex-start}.Toastify__close-button--light{color:#000;opacity:.3}.Toastify__close-button>svg{fill:currentColor;height:16px;width:14px}.Toastify__close-button:hover,.Toastify__close-button:focus{opacity:1}@keyframes Toastify__trackProgress{0%{transform:scaleX(1)}to{transform:scaleX(0)}}.Toastify__progress-bar{position:absolute;bottom:0;left:0;width:100%;height:5px;z-index:var(--toastify-z-index);opacity:.7;transform-origin:left}.Toastify__progress-bar--animated{animation:Toastify__trackProgress linear 1 forwards}.Toastify__progress-bar--controlled{transition:transform .2s}.Toastify__progress-bar--rtl{right:0;left:initial;transform-origin:right}.Toastify__spinner{width:20px;height:20px;box-sizing:border-box;border:2px solid;border-radius:100%;border-color:var(--toastify-spinner-color-empty-area);border-right-color:var(--toastify-spinner-color);animation:Toastify__spin .65s linear infinite}@keyframes Toastify__bounceInRight{0%,60%,75%,90%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(3000px,0,0)}60%{opacity:1;transform:translate3d(-25px,0,0)}75%{transform:translate3d(10px,0,0)}90%{transform:translate3d(-5px,0,0)}to{transform:none}}@keyframes Toastify__bounceOutRight{20%{opacity:1;transform:translate3d(-20px,0,0)}to{opacity:0;transform:translate3d(2000px,0,0)}}@keyframes Toastify__bounceInLeft{0%,60%,75%,90%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(-3000px,0,0)}60%{opacity:1;transform:translate3d(25px,0,0)}75%{transform:translate3d(-10px,0,0)}90%{transform:translate3d(5px,0,0)}to{transform:none}}@keyframes Toastify__bounceOutLeft{20%{opacity:1;transform:translate3d(20px,0,0)}to{opacity:0;transform:translate3d(-2000px,0,0)}}@keyframes Toastify__bounceInUp{0%,60%,75%,90%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(0,3000px,0)}60%{opacity:1;transform:translate3d(0,-20px,0)}75%{transform:translate3d(0,10px,0)}90%{transform:translate3d(0,-5px,0)}to{transform:translateZ(0)}}@keyframes Toastify__bounceOutUp{20%{transform:translate3d(0,-10px,0)}40%,45%{opacity:1;transform:translate3d(0,20px,0)}to{opacity:0;transform:translate3d(0,-2000px,0)}}@keyframes Toastify__bounceInDown{0%,60%,75%,90%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(0,-3000px,0)}60%{opacity:1;transform:translate3d(0,25px,0)}75%{transform:translate3d(0,-10px,0)}90%{transform:translate3d(0,5px,0)}to{transform:none}}@keyframes Toastify__bounceOutDown{20%{transform:translate3d(0,10px,0)}40%,45%{opacity:1;transform:translate3d(0,-20px,0)}to{opacity:0;transform:translate3d(0,2000px,0)}}.Toastify__bounce-enter--top-left,.Toastify__bounce-enter--bottom-left{animation-name:Toastify__bounceInLeft}.Toastify__bounce-enter--top-right,.Toastify__bounce-enter--bottom-right{animation-name:Toastify__bounceInRight}.Toastify__bounce-enter--top-center{animation-name:Toastify__bounceInDown}.Toastify__bounce-enter--bottom-center{animation-name:Toastify__bounceInUp}.Toastify__bounce-exit--top-left,.Toastify__bounce-exit--bottom-left{animation-name:Toastify__bounceOutLeft}.Toastify__bounce-exit--top-right,.Toastify__bounce-exit--bottom-right{animation-name:Toastify__bounceOutRight}.Toastify__bounce-exit--top-center{animation-name:Toastify__bounceOutUp}.Toastify__bounce-exit--bottom-center{animation-name:Toastify__bounceOutDown}@keyframes Toastify__zoomIn{0%{opacity:0;transform:scale3d(.3,.3,.3)}50%{opacity:1}}@keyframes Toastify__zoomOut{0%{opacity:1}50%{opacity:0;transform:scale3d(.3,.3,.3)}to{opacity:0}}.Toastify__zoom-enter{animation-name:Toastify__zoomIn}.Toastify__zoom-exit{animation-name:Toastify__zoomOut}@keyframes Toastify__flipIn{0%{transform:perspective(400px) rotateX(90deg);animation-timing-function:ease-in;opacity:0}40%{transform:perspective(400px) rotateX(-20deg);animation-timing-function:ease-in}60%{transform:perspective(400px) rotateX(10deg);opacity:1}80%{transform:perspective(400px) rotateX(-5deg)}to{transform:perspective(400px)}}@keyframes Toastify__flipOut{0%{transform:perspective(400px)}30%{transform:perspective(400px) rotateX(-20deg);opacity:1}to{transform:perspective(400px) rotateX(90deg);opacity:0}}.Toastify__flip-enter{animation-name:Toastify__flipIn}.Toastify__flip-exit{animation-name:Toastify__flipOut}@keyframes Toastify__slideInRight{0%{transform:translate3d(110%,0,0);visibility:visible}to{transform:translateZ(0)}}@keyframes Toastify__slideInLeft{0%{transform:translate3d(-110%,0,0);visibility:visible}to{transform:translateZ(0)}}@keyframes Toastify__slideInUp{0%{transform:translate3d(0,110%,0);visibility:visible}to{transform:translateZ(0)}}@keyframes Toastify__slideInDown{0%{transform:translate3d(0,-110%,0);visibility:visible}to{transform:translateZ(0)}}@keyframes Toastify__slideOutRight{0%{transform:translateZ(0)}to{visibility:hidden;transform:translate3d(110%,0,0)}}@keyframes Toastify__slideOutLeft{0%{transform:translateZ(0)}to{visibility:hidden;transform:translate3d(-110%,0,0)}}@keyframes Toastify__slideOutDown{0%{transform:translateZ(0)}to{visibility:hidden;transform:translate3d(0,500px,0)}}@keyframes Toastify__slideOutUp{0%{transform:translateZ(0)}to{visibility:hidden;transform:translate3d(0,-500px,0)}}.Toastify__slide-enter--top-left,.Toastify__slide-enter--bottom-left{animation-name:Toastify__slideInLeft}.Toastify__slide-enter--top-right,.Toastify__slide-enter--bottom-right{animation-name:Toastify__slideInRight}.Toastify__slide-enter--top-center{animation-name:Toastify__slideInDown}.Toastify__slide-enter--bottom-center{animation-name:Toastify__slideInUp}.Toastify__slide-exit--top-left,.Toastify__slide-exit--bottom-left{animation-name:Toastify__slideOutLeft}.Toastify__slide-exit--top-right,.Toastify__slide-exit--bottom-right{animation-name:Toastify__slideOutRight}.Toastify__slide-exit--top-center{animation-name:Toastify__slideOutUp}.Toastify__slide-exit--bottom-center{animation-name:Toastify__slideOutDown}@keyframes Toastify__spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.Toastify__toast-container{z-index:100000}.Toastify__toast{min-height:64px;border-radius:4px;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}.Toastify__toast--success,.Toastify__toast--error,.Toastify__toast--warning,.Toastify__toast--info{background:transparent}.Toastify__toast-body{padding:0;margin:0;color:inherit;font-size:14px;font-weight:500;line-height:1.5}.Toastify__close-button{color:inherit;opacity:.7;align-self:flex-start;background:transparent;border:none;padding:4px;margin:0;transition:opacity .2s ease}.Toastify__close-button:hover{opacity:1}.Toastify__progress-bar{background:linear-gradient(to right,#4caf50,#8bc34a,#cddc39,#ffeb3b,#ffc107,#ff9800,#ff5722)}.Toastify__progress-bar--success{background:#12b76a}.Toastify__progress-bar--error{background:#f04438}.Toastify__progress-bar--warning{background:#f79009}.Toastify__progress-bar--info{background:#016dcf}@media (prefers-color-scheme: dark){.Toastify__toast-container{background:transparent}.Toastify__toast{box-shadow:0 4px 6px -1px #0000004d,0 2px 4px -1px #0003}}@media screen and (max-width: 640px){.Toastify__toast-container{left:1rem;right:1rem;bottom:1rem;width:auto}.Toastify__toast{margin-bottom:.5rem}}.Toastify__slide-enter--bottom-right,.Toastify__slide-enter--bottom-left,.Toastify__slide-enter--bottom-center{animation-duration:.3s;animation-timing-function:cubic-bezier(.4,0,.2,1)}.Toastify__slide-exit--bottom-right,.Toastify__slide-exit--bottom-left,.Toastify__slide-exit--bottom-center{animation-duration:.2s;animation-timing-function:cubic-bezier(.4,0,1,1)}
|