@hh.ru/magritte-ui-upload 1.2.0 → 2.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (11) hide show
  1. package/FileName.d.ts +7 -0
  2. package/FileName.js +29 -0
  3. package/FileName.js.map +1 -0
  4. package/Upload.d.ts +1 -1
  5. package/Upload.js +22 -24
  6. package/Upload.js.map +1 -1
  7. package/index.css +587 -21
  8. package/index.js +1 -0
  9. package/index.js.map +1 -1
  10. package/package.json +2 -2
  11. package/types.d.ts +2 -3
package/FileName.d.ts ADDED
@@ -0,0 +1,7 @@
1
+ import { ReactElement } from 'react';
2
+ interface FileNameProps {
3
+ file: File;
4
+ isSizeMedium?: boolean;
5
+ }
6
+ declare const FileName: ({ file, isSizeMedium }: FileNameProps) => ReactElement;
7
+ export { FileName };
package/FileName.js ADDED
@@ -0,0 +1,29 @@
1
+ import './index.css';
2
+ import { jsxs, jsx } from 'react/jsx-runtime';
3
+ import classnames from 'classnames';
4
+
5
+ var styles = {"file-name-body":"magritte-file-name-body___PTTMc_2-0-0","fileNameBody":"magritte-file-name-body___PTTMc_2-0-0","file-name-body_medium":"magritte-file-name-body_medium___sfmmq_2-0-0","fileNameBodyMedium":"magritte-file-name-body_medium___sfmmq_2-0-0","file-name":"magritte-file-name___ZSL2g_2-0-0","fileName":"magritte-file-name___ZSL2g_2-0-0"};
6
+
7
+ const parse = (file) => {
8
+ const name = file.name;
9
+ const parts = name.split('.');
10
+ if (parts.length === 1) {
11
+ return {
12
+ name: parts[0],
13
+ extension: '',
14
+ };
15
+ }
16
+ const extension = parts.pop();
17
+ return {
18
+ // -1 из-за точки
19
+ name: name.substring(0, name.length - (extension?.length || 0) - 1),
20
+ extension: extension || '',
21
+ };
22
+ };
23
+ const FileName = ({ file, isSizeMedium = false }) => {
24
+ const { name, extension } = parse(file);
25
+ return (jsxs("div", { className: classnames(styles.fileNameBody, { [styles.fileNameBodyMedium]: isSizeMedium }), children: [jsx("div", { className: styles.fileName, children: name }), extension && jsxs("div", { children: [".", extension] })] }));
26
+ };
27
+
28
+ export { FileName };
29
+ //# sourceMappingURL=FileName.js.map
package/FileName.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"FileName.js","sources":["../src/FileName.tsx"],"sourcesContent":["import { ReactElement } from 'react';\nimport classnames from 'classnames';\n\nimport styles from './file-name.less';\n\nconst parse = (file: File): { name: string; extension: string } => {\n const name = file.name;\n const parts = name.split('.');\n if (parts.length === 1) {\n return {\n name: parts[0],\n extension: '',\n };\n }\n const extension = parts.pop();\n return {\n // -1 из-за точки\n name: name.substring(0, name.length - (extension?.length || 0) - 1),\n extension: extension || '',\n };\n};\n\ninterface FileNameProps {\n file: File;\n isSizeMedium?: boolean;\n}\n\nconst FileName = ({ file, isSizeMedium = false }: FileNameProps): ReactElement => {\n const { name, extension } = parse(file);\n return (\n <div className={classnames(styles.fileNameBody, { [styles.fileNameBodyMedium]: isSizeMedium })}>\n <div className={styles.fileName}>{name}</div>\n {extension && <div>.{extension}</div>}\n </div>\n );\n};\n\nexport { FileName };\n"],"names":["_jsxs","_jsx"],"mappings":";;;;;AAKA,MAAM,KAAK,GAAG,CAAC,IAAU,KAAyC;AAC9D,IAAA,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC;IACvB,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;AAC9B,IAAA,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC,EAAE;QACpB,OAAO;AACH,YAAA,IAAI,EAAE,KAAK,CAAC,CAAC,CAAC;AACd,YAAA,SAAS,EAAE,EAAE;SAChB,CAAC;KACL;AACD,IAAA,MAAM,SAAS,GAAG,KAAK,CAAC,GAAG,EAAE,CAAC;IAC9B,OAAO;;QAEH,IAAI,EAAE,IAAI,CAAC,SAAS,CAAC,CAAC,EAAE,IAAI,CAAC,MAAM,IAAI,SAAS,EAAE,MAAM,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC;QACnE,SAAS,EAAE,SAAS,IAAI,EAAE;KAC7B,CAAC;AACN,CAAC,CAAC;AAOI,MAAA,QAAQ,GAAG,CAAC,EAAE,IAAI,EAAE,YAAY,GAAG,KAAK,EAAiB,KAAkB;IAC7E,MAAM,EAAE,IAAI,EAAE,SAAS,EAAE,GAAG,KAAK,CAAC,IAAI,CAAC,CAAC;AACxC,IAAA,QACIA,IAAK,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,UAAU,CAAC,MAAM,CAAC,YAAY,EAAE,EAAE,CAAC,MAAM,CAAC,kBAAkB,GAAG,YAAY,EAAE,CAAC,EAAA,QAAA,EAAA,CAC1FC,aAAK,SAAS,EAAE,MAAM,CAAC,QAAQ,EAAG,QAAA,EAAA,IAAI,EAAO,CAAA,EAC5C,SAAS,IAAID,IAAA,CAAA,KAAA,EAAA,EAAA,QAAA,EAAA,CAAA,GAAA,EAAO,SAAS,CAAO,EAAA,CAAA,CAAA,EAAA,CACnC,EACR;AACN;;;;"}
package/Upload.d.ts CHANGED
@@ -1,4 +1,4 @@
1
1
  import { ReactElement } from 'react';
2
2
  import { UploadProps } from '@hh.ru/magritte-ui-upload/types';
3
- declare const Upload: ({ files, trls, size, multiple, accept, selectFileButton: _selectFileButton, deleteFileButton: _deleteFileButton, replaceImageButton: _replaceImageButton, deleteImageButton: _deleteImageButton, renderFileInfo, onDropAccepted: onDropAcceptedExternal, onDropRejected: onDropRejectedExternal, onFileDelete: onFileDeleteExternal, "aria-label": ariaLabel, ...dropzoneProps }: UploadProps) => ReactElement;
3
+ declare const Upload: ({ files, trls, size, multiple, accept, selectFileButton: _selectFileButton, deleteFileButton: _deleteFileButton, replaceImageButton: _replaceImageButton, renderFileInfo, onDropAccepted: onDropAcceptedExternal, onDropRejected: onDropRejectedExternal, onFileDelete: onFileDeleteExternal, "aria-label": ariaLabel, ...dropzoneProps }: UploadProps) => ReactElement;
4
4
  export { Upload };
package/Upload.js CHANGED
@@ -9,9 +9,10 @@ import { ExclamationTriangleOutlinedSize16, CheckCircleOutlinedSize16, CrossOutl
9
9
  import { Loader } from '@hh.ru/magritte-ui-loader';
10
10
  import { VSpacing } from '@hh.ru/magritte-ui-spacing';
11
11
  import { Text } from '@hh.ru/magritte-ui-typography';
12
+ import { FileName } from './FileName.js';
12
13
  import { getUploadIcon } from './utils.js';
13
14
 
14
- var styles = {"root":"magritte-root___FV1tC_1-2-0","background":"magritte-background___RfZ0U_1-2-0","drag-active":"magritte-drag-active___dihBL_1-2-0","dragActive":"magritte-drag-active___dihBL_1-2-0","load":"magritte-load___MghDA_1-2-0","loading":"magritte-loading___9E3p-_1-2-0","invalid":"magritte-invalid___Rt10-_1-2-0","root_medium":"magritte-root_medium___67WJa_1-2-0","rootMedium":"magritte-root_medium___67WJa_1-2-0","body":"magritte-body___O7ROl_1-2-0","root_small":"magritte-root_small___dkUYq_1-2-0","rootSmall":"magritte-root_small___dkUYq_1-2-0","loader":"magritte-loader___XYpWg_1-2-0","cancel":"magritte-cancel___tQ-yX_1-2-0","image-controls":"magritte-image-controls___vLf94_1-2-0","imageControls":"magritte-image-controls___vLf94_1-2-0","small-controls":"magritte-small-controls___Qn9TP_1-2-0","smallControls":"magritte-small-controls___Qn9TP_1-2-0","small-file-info":"magritte-small-file-info___cMns-_1-2-0","smallFileInfo":"magritte-small-file-info___cMns-_1-2-0"};
15
+ var styles = {"root":"magritte-root___FV1tC_2-0-0","background":"magritte-background___RfZ0U_2-0-0","drag-active":"magritte-drag-active___dihBL_2-0-0","dragActive":"magritte-drag-active___dihBL_2-0-0","load":"magritte-load___MghDA_2-0-0","loading":"magritte-loading___9E3p-_2-0-0","invalid":"magritte-invalid___Rt10-_2-0-0","root_medium":"magritte-root_medium___67WJa_2-0-0","rootMedium":"magritte-root_medium___67WJa_2-0-0","body":"magritte-body___O7ROl_2-0-0","root_small":"magritte-root_small___dkUYq_2-0-0","rootSmall":"magritte-root_small___dkUYq_2-0-0","loader":"magritte-loader___XYpWg_2-0-0","cancel":"magritte-cancel___tQ-yX_2-0-0","image-controls":"magritte-image-controls___vLf94_2-0-0","imageControls":"magritte-image-controls___vLf94_2-0-0","small-controls":"magritte-small-controls___Qn9TP_2-0-0","smallControls":"magritte-small-controls___Qn9TP_2-0-0","small-file-info-container":"magritte-small-file-info-container___MIN5r_2-0-0","smallFileInfoContainer":"magritte-small-file-info-container___MIN5r_2-0-0","small-file-info":"magritte-small-file-info___cMns-_2-0-0","smallFileInfo":"magritte-small-file-info___cMns-_2-0-0"};
15
16
 
16
17
  const order = 1024 * 1024;
17
18
  const bytes2mb = (value) => {
@@ -35,7 +36,7 @@ const RenderFileInfoDefault = (loadedFile) => {
35
36
  const DEFAULT_ACCEPT = {
36
37
  'image/*': ['.png', '.jpeg', '.jpg'],
37
38
  };
38
- const Upload = ({ files, trls, size = 'medium', multiple = false, accept = DEFAULT_ACCEPT, selectFileButton: _selectFileButton, deleteFileButton: _deleteFileButton, replaceImageButton: _replaceImageButton, deleteImageButton: _deleteImageButton, renderFileInfo = RenderFileInfoDefault, onDropAccepted: onDropAcceptedExternal, onDropRejected: onDropRejectedExternal, onFileDelete: onFileDeleteExternal, 'aria-label': ariaLabel, ...dropzoneProps }) => {
39
+ const Upload = ({ files, trls, size = 'medium', multiple = false, accept = DEFAULT_ACCEPT, selectFileButton: _selectFileButton, deleteFileButton: _deleteFileButton, replaceImageButton: _replaceImageButton, renderFileInfo = RenderFileInfoDefault, onDropAccepted: onDropAcceptedExternal, onDropRejected: onDropRejectedExternal, onFileDelete: onFileDeleteExternal, 'aria-label': ariaLabel, ...dropzoneProps }) => {
39
40
  const bodyUploadRef = useRef(null);
40
41
  const uploadType = getAvaliableFileTypes(accept);
41
42
  const loadedFile = files.length > 0 ? files[0] : undefined;
@@ -58,13 +59,17 @@ const Upload = ({ files, trls, size = 'medium', multiple = false, accept = DEFAU
58
59
  }, [loadedFile, isImageType, isSizeSmall]);
59
60
  useEffect(() => {
60
61
  if (!bodyUploadRef.current) {
61
- return;
62
+ return void 0;
62
63
  }
63
64
  if (isSizeSmall) {
64
- return;
65
+ return void 0;
65
66
  }
66
67
  // фиксируем ширину, так как после выбора контент поменяется
67
- bodyUploadRef.current.style.minHeight = `${bodyUploadRef.current.offsetHeight}px`;
68
+ const currentElement = bodyUploadRef.current;
69
+ currentElement.style.minHeight = `${bodyUploadRef.current.offsetHeight}px`;
70
+ return () => {
71
+ currentElement.style.minHeight = 'auto';
72
+ };
68
73
  }, [isSizeSmall]);
69
74
  const onDropAccepted = useCallback((acceptedFiles, event) => {
70
75
  const acceptedLoadFiles = acceptedFiles.map((file) => ({ data: file, loading: true, loadPercentage: 0 }));
@@ -82,10 +87,11 @@ const Upload = ({ files, trls, size = 'medium', multiple = false, accept = DEFAU
82
87
  loadedFile && onFileDeleteExternal(loadedFile, 0);
83
88
  event.stopPropagation();
84
89
  }, [loadedFile, onFileDeleteExternal]);
85
- const selectFileButton = cloneElement(_selectFileButton, {
86
- key: 'selectFileButton',
87
- 'data-qa': 'magritte-select-file-button',
88
- });
90
+ const selectFileButton = _selectFileButton &&
91
+ cloneElement(_selectFileButton, {
92
+ key: 'selectFileButton',
93
+ 'data-qa': 'magritte-select-file-button',
94
+ });
89
95
  const deleteFileButton = _deleteFileButton &&
90
96
  cloneElement(_deleteFileButton, {
91
97
  key: 'deleteFileButton',
@@ -99,14 +105,6 @@ const Upload = ({ files, trls, size = 'medium', multiple = false, accept = DEFAU
99
105
  key: 'replaceImageButton',
100
106
  'data-qa': 'magritte-select-replace-image-button',
101
107
  });
102
- const deleteImageButton = _deleteImageButton &&
103
- cloneElement(_deleteImageButton, {
104
- key: 'deleteImageButton',
105
- 'data-qa': 'magritte-delete-image-button',
106
- onClick: (event) => {
107
- onFileDelete(event);
108
- },
109
- });
110
108
  const { getRootProps, getInputProps, isDragActive } = useDropzone({
111
109
  ...dropzoneProps,
112
110
  accept,
@@ -114,19 +112,19 @@ const Upload = ({ files, trls, size = 'medium', multiple = false, accept = DEFAU
114
112
  onDropRejected,
115
113
  multiple,
116
114
  });
117
- return (jsxs("div", { className: classnames(styles.root, styles[`root_${size}`], { [styles.dragActive]: isDragActive }, { [styles.loading]: isLoading }, { [styles.load]: isLoad }, { [styles.invalid]: isInvalid }), ...getRootProps(), children: [jsx("div", { className: styles.background, style: { backgroundImage: !isSizeSmall ? backgroundUploadPreview : 'none' } }), jsxs("div", { className: styles.body, ref: bodyUploadRef, children: [jsx("input", { ...getInputProps() }), isSizeSmall && (jsxs(Fragment, { children: [loadedFile && (jsxs(Fragment, { children: [jsx(Avatar, { mode: isImageType && !isLoading ? 'image' : 'icon', style: "secondary", image: backgroundUploadPreview, size: 48, icon: getUploadIcon(uploadType, loadedFile, true), "aria-label": ariaLabel }), jsxs("div", { children: [jsx(Text, { typography: "label-2-regular", children: loadedFile.data.name }), jsx(VSpacing, { default: 4 }), jsx(Text, { typography: "label-4-regular", style: "secondary", children: jsxs("div", { className: styles.smallFileInfo, children: [isInvalid && jsx(ExclamationTriangleOutlinedSize16, { initial: "negative" }), isLoading && jsx(Loader, { size: 16 }), !isInvalid && !isLoading && (jsx(CheckCircleOutlinedSize16, { initial: "positive" })), renderFileInfo({
118
- ...loadedFile,
119
- fileSizeMB: bytes2mb(loadedFile.data.size),
120
- })] }) })] }), jsxs("div", { className: styles.smallControls, children: [isLoading && (jsx(Action, { icon: CrossOutlinedSize24, mode: "secondary", onClick: (event) => {
115
+ return (jsxs("div", { className: classnames(styles.root, styles[`root_${size}`], { [styles.dragActive]: isDragActive }, { [styles.loading]: isLoading }, { [styles.load]: isLoad }, { [styles.invalid]: isInvalid }), ...getRootProps(), children: [jsx("div", { className: styles.background, style: { backgroundImage: !isSizeSmall ? backgroundUploadPreview : 'none' } }), jsxs("div", { className: styles.body, ref: bodyUploadRef, children: [jsx("input", { ...getInputProps() }), isSizeSmall && (jsxs(Fragment, { children: [loadedFile && (jsxs(Fragment, { children: [jsx(Avatar, { mode: isImageType && !isLoading ? 'image' : 'icon', style: "secondary", image: backgroundUploadPreview, size: 48, icon: getUploadIcon(uploadType, loadedFile, true), "aria-label": ariaLabel || '' }), jsxs("div", { className: styles.smallFileInfoContainer, children: [jsx(FileName, { file: loadedFile.data }), jsx(VSpacing, { default: 4 }), jsxs("div", { className: styles.smallFileInfo, children: [isInvalid && jsx(ExclamationTriangleOutlinedSize16, { initial: "negative" }), isLoading && jsx(Loader, { size: 16 }), !isInvalid && !isLoading && jsx(CheckCircleOutlinedSize16, { initial: "positive" }), renderFileInfo({
116
+ ...loadedFile,
117
+ fileSizeMB: bytes2mb(loadedFile.data.size),
118
+ })] })] }), jsxs("div", { className: styles.smallControls, children: [isLoading && (jsx(Action, { icon: CrossOutlinedSize24, mode: "secondary", onClick: (event) => {
121
119
  onFileDelete(event);
122
120
  } })), !isLoading && (jsx(Action, { icon: TrashOutlinedSize24, mode: "secondary", onClick: (event) => {
123
121
  onFileDelete(event);
124
- } }))] })] })), !loadedFile && (jsxs(Fragment, { children: [jsx(Avatar, { mode: "icon", style: "secondary", size: 48, icon: getUploadIcon(uploadType, loadedFile, true), "aria-label": ariaLabel }), jsxs("div", { children: [jsx(Text, { typography: "label-2-regular", children: trls.title }), jsx(VSpacing, { default: 4 }), jsx(Text, { typography: "label-4-regular", style: "secondary", children: trls.subTitle })] }), jsx("div", { className: styles.smallControls, children: selectFileButton })] }))] })), !isSizeSmall && (jsxs(Fragment, { children: [isLoading && (jsxs("div", { className: styles.loader, children: [jsx(Loader, { size: 64 }), jsx("div", { className: styles.cancel, children: jsx(CrossOutlinedSize24, { initial: "accent", onClick: (event) => {
122
+ } }))] })] })), !loadedFile && (jsxs(Fragment, { children: [jsx(Avatar, { mode: "icon", style: "secondary", size: 48, icon: getUploadIcon(uploadType, loadedFile, true), "aria-label": ariaLabel }), jsxs("div", { children: [jsx(Text, { typography: "label-2-regular", children: trls.title }), jsx(VSpacing, { default: 4 }), jsx(Text, { typography: "label-4-regular", style: "secondary", children: trls.subTitle })] }), selectFileButton && jsx("div", { className: styles.smallControls, children: selectFileButton })] }))] })), !isSizeSmall && (jsxs(Fragment, { children: [isLoading && (jsxs("div", { className: styles.loader, children: [jsx(Loader, { size: 64 }), jsx("div", { className: styles.cancel, children: jsx(CrossOutlinedSize24, { initial: "accent", onClick: (event) => {
125
123
  onFileDelete(event);
126
- } }) })] })), isInvalid ? (jsx(ExclamationTriangleOutlinedSize32, { initial: "negative" })) : (getUploadIcon(uploadType, loadedFile, false)), jsx(VSpacing, { default: 16 }), loadedFile && (jsxs(Fragment, { children: [jsx(Text, { typography: "label-2-regular", children: loadedFile.data.name }), jsx(VSpacing, { default: 6 }), jsx(Text, { typography: "label-4-regular", style: "secondary", children: renderFileInfo({
124
+ } }) })] })), isInvalid ? (jsx(ExclamationTriangleOutlinedSize32, { initial: "negative" })) : (getUploadIcon(uploadType, loadedFile, false)), jsx(VSpacing, { default: 16 }), loadedFile && (jsxs(Fragment, { children: [jsx(FileName, { file: loadedFile.data, isSizeMedium: true }), jsx(VSpacing, { default: 6 }), jsx(Text, { typography: "label-4-regular", style: "secondary", children: renderFileInfo({
127
125
  ...loadedFile,
128
126
  fileSizeMB: bytes2mb(loadedFile.data.size),
129
- }) }), jsx(VSpacing, { default: 8 }), !loadedFile.loading && !isImageType && (jsxs(Fragment, { children: [jsx(VSpacing, { default: 8 }), deleteFileButton] })), !loadedFile.loading && isImageType && (jsxs("div", { className: styles.imageControls, children: [replaceImageButton, deleteImageButton] }))] })), !loadedFile && (jsxs(Fragment, { children: [jsx(Text, { typography: "label-2-regular", children: trls.title }), jsx(VSpacing, { default: 6 }), jsx(Text, { typography: "label-4-regular", style: "secondary", children: trls.subTitle }), jsx(VSpacing, { default: 16 }), selectFileButton] }))] }))] })] }));
127
+ }) }), !loadedFile.loading && !isImageType && deleteFileButton && (jsxs(Fragment, { children: [jsx(VSpacing, { default: 16 }), deleteFileButton] })), !loadedFile.loading && isImageType && (replaceImageButton || deleteFileButton) && (jsxs("div", { className: styles.imageControls, children: [replaceImageButton, deleteFileButton] }))] })), !loadedFile && (jsxs(Fragment, { children: [jsx(Text, { typography: "label-2-regular", children: trls.title }), jsx(VSpacing, { default: 6 }), jsx(Text, { typography: "label-4-regular", style: "secondary", children: trls.subTitle }), selectFileButton && (jsxs(Fragment, { children: [jsx(VSpacing, { default: 16 }), selectFileButton] }))] }))] }))] })] }));
130
128
  };
131
129
 
132
130
  export { Upload };
package/Upload.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Upload.js","sources":["../src/Upload.tsx"],"sourcesContent":["import {\n ReactElement,\n useRef,\n ReactNode,\n useEffect,\n useCallback,\n cloneElement,\n MouseEvent,\n ComponentProps,\n useMemo,\n} from 'react';\nimport { useDropzone, Accept, DropEvent, FileRejection } from 'react-dropzone';\nimport classnames from 'classnames';\n\nimport { Action } from '@hh.ru/magritte-ui-action';\nimport { Avatar } from '@hh.ru/magritte-ui-avatar';\nimport { Button } from '@hh.ru/magritte-ui-button';\nimport {\n CrossOutlinedSize24,\n CheckCircleOutlinedSize16,\n ExclamationTriangleOutlinedSize32,\n ExclamationTriangleOutlinedSize16,\n TrashOutlinedSize24,\n} from '@hh.ru/magritte-ui-icon/icon';\nimport { Loader } from '@hh.ru/magritte-ui-loader';\nimport { VSpacing } from '@hh.ru/magritte-ui-spacing';\nimport { Text } from '@hh.ru/magritte-ui-typography';\nimport { UploadProps, UploadType, LoadedFileWithFileSize } from '@hh.ru/magritte-ui-upload/types';\nimport { getUploadIcon } from '@hh.ru/magritte-ui-upload/utils';\n\nimport styles from './upload.less';\n\nconst order = 1024 * 1024;\nconst bytes2mb = (value: number): string => {\n return (value / order).toFixed(2);\n};\n\n// парсим accept в нормальный формат\nconst getAvaliableFileTypes = (accept: Accept): UploadType => {\n const avaliableTypes = Object.keys(accept);\n if (avaliableTypes.length === 0) {\n throw new Error(`Magritte component Upload: accept can't be empty`);\n }\n if (avaliableTypes.length > 1) {\n return 'mixed';\n }\n const avaliableType = avaliableTypes[0];\n return avaliableType.split('/')[0] as UploadType;\n};\n\nconst RenderFileInfoDefault = (loadedFile: LoadedFileWithFileSize): ReactNode => {\n return loadedFile.fileSizeMB;\n};\n\nconst DEFAULT_ACCEPT: Accept = {\n 'image/*': ['.png', '.jpeg', '.jpg'],\n};\n\nconst Upload = ({\n files,\n trls,\n size = 'medium',\n multiple = false,\n accept = DEFAULT_ACCEPT,\n selectFileButton: _selectFileButton,\n deleteFileButton: _deleteFileButton,\n replaceImageButton: _replaceImageButton,\n deleteImageButton: _deleteImageButton,\n renderFileInfo = RenderFileInfoDefault,\n onDropAccepted: onDropAcceptedExternal,\n onDropRejected: onDropRejectedExternal,\n onFileDelete: onFileDeleteExternal,\n 'aria-label': ariaLabel,\n ...dropzoneProps\n}: UploadProps): ReactElement => {\n const bodyUploadRef = useRef<HTMLDivElement>(null);\n const uploadType = getAvaliableFileTypes(accept);\n const loadedFile = files.length > 0 ? files[0] : undefined;\n const isLoad = Boolean(loadedFile);\n const isLoading = Boolean(loadedFile?.loading);\n const isInvalid = Boolean(loadedFile?.error);\n const isSizeSmall = size === 'small';\n const isImageType = uploadType === 'image';\n\n const backgroundUploadPreview: string = useMemo(() => {\n if (!loadedFile || !isImageType) {\n return 'none';\n }\n if (loadedFile.loading) {\n return 'none';\n }\n if (isSizeSmall) {\n return URL.createObjectURL(loadedFile.data);\n }\n return `url('${URL.createObjectURL(loadedFile.data)}')`;\n }, [loadedFile, isImageType, isSizeSmall]);\n\n useEffect(() => {\n if (!bodyUploadRef.current) {\n return;\n }\n if (isSizeSmall) {\n return;\n }\n // фиксируем ширину, так как после выбора контент поменяется\n bodyUploadRef.current.style.minHeight = `${bodyUploadRef.current.offsetHeight}px`;\n }, [isSizeSmall]);\n\n const onDropAccepted = useCallback(\n (acceptedFiles: File[], event: DropEvent) => {\n const acceptedLoadFiles = acceptedFiles.map((file) => ({ data: file, loading: true, loadPercentage: 0 }));\n onDropAcceptedExternal(acceptedLoadFiles, event);\n },\n [onDropAcceptedExternal]\n );\n const onDropRejected = useCallback(\n (fileRejections: FileRejection[], event: DropEvent) => {\n const rejectionLoadFiles = fileRejections.map((fileRejection) => ({\n data: fileRejection.file,\n loading: false,\n error: fileRejection.errors?.[0].code || '',\n }));\n onDropRejectedExternal?.(rejectionLoadFiles, event);\n },\n [onDropRejectedExternal]\n );\n const onFileDelete = useCallback(\n (event: MouseEvent) => {\n loadedFile && onFileDeleteExternal(loadedFile, 0);\n event.stopPropagation();\n },\n [loadedFile, onFileDeleteExternal]\n );\n\n const selectFileButton = cloneElement(_selectFileButton, {\n key: 'selectFileButton',\n 'data-qa': 'magritte-select-file-button',\n } as Partial<ComponentProps<typeof Button>>);\n\n const deleteFileButton =\n _deleteFileButton &&\n cloneElement(_deleteFileButton, {\n key: 'deleteFileButton',\n 'data-qa': 'magritte-delete-file-button',\n onClick: (event: MouseEvent) => {\n onFileDelete(event);\n },\n } as Partial<ComponentProps<typeof Button>>);\n\n const replaceImageButton =\n _replaceImageButton &&\n cloneElement(_replaceImageButton, {\n key: 'replaceImageButton',\n 'data-qa': 'magritte-select-replace-image-button',\n } as Partial<ComponentProps<typeof Button>>);\n\n const deleteImageButton =\n _deleteImageButton &&\n cloneElement(_deleteImageButton, {\n key: 'deleteImageButton',\n 'data-qa': 'magritte-delete-image-button',\n onClick: (event: MouseEvent) => {\n onFileDelete(event);\n },\n } as Partial<ComponentProps<typeof Button>>);\n\n const { getRootProps, getInputProps, isDragActive } = useDropzone({\n ...dropzoneProps,\n accept,\n onDropAccepted,\n onDropRejected,\n multiple,\n });\n return (\n <div\n className={classnames(\n styles.root,\n styles[`root_${size}`],\n { [styles.dragActive]: isDragActive },\n { [styles.loading]: isLoading },\n { [styles.load]: isLoad },\n { [styles.invalid]: isInvalid }\n )}\n {...getRootProps()}\n >\n <div\n className={styles.background}\n style={{ backgroundImage: !isSizeSmall ? backgroundUploadPreview : 'none' }}\n />\n <div className={styles.body} ref={bodyUploadRef}>\n <input {...getInputProps()} />\n {isSizeSmall && (\n <>\n {loadedFile && (\n <>\n <Avatar\n mode={isImageType && !isLoading ? 'image' : 'icon'}\n style=\"secondary\"\n image={backgroundUploadPreview}\n size={48}\n icon={getUploadIcon(uploadType, loadedFile, true)}\n aria-label={ariaLabel as string}\n />\n <div>\n <Text typography=\"label-2-regular\">{loadedFile.data.name}</Text>\n <VSpacing default={4} />\n <Text typography=\"label-4-regular\" style=\"secondary\">\n <div className={styles.smallFileInfo}>\n {isInvalid && <ExclamationTriangleOutlinedSize16 initial=\"negative\" />}\n {isLoading && <Loader size={16} />}\n {!isInvalid && !isLoading && (\n <CheckCircleOutlinedSize16 initial=\"positive\" />\n )}\n {renderFileInfo({\n ...loadedFile,\n fileSizeMB: bytes2mb(loadedFile.data.size),\n })}\n </div>\n </Text>\n </div>\n <div className={styles.smallControls}>\n {isLoading && (\n <Action\n icon={CrossOutlinedSize24}\n mode=\"secondary\"\n onClick={(event) => {\n onFileDelete(event);\n }}\n />\n )}\n {!isLoading && (\n <Action\n icon={TrashOutlinedSize24}\n mode=\"secondary\"\n onClick={(event) => {\n onFileDelete(event);\n }}\n />\n )}\n </div>\n </>\n )}\n {!loadedFile && (\n <>\n <Avatar\n mode=\"icon\"\n style=\"secondary\"\n size={48}\n icon={getUploadIcon(uploadType, loadedFile, true)}\n aria-label={ariaLabel as string}\n />\n <div>\n <Text typography=\"label-2-regular\">{trls.title}</Text>\n <VSpacing default={4} />\n <Text typography=\"label-4-regular\" style=\"secondary\">\n {trls.subTitle}\n </Text>\n </div>\n <div className={styles.smallControls}>{selectFileButton}</div>\n </>\n )}\n </>\n )}\n {!isSizeSmall && (\n <>\n {isLoading && (\n <div className={styles.loader}>\n <Loader size={64} />\n <div className={styles.cancel}>\n <CrossOutlinedSize24\n initial=\"accent\"\n onClick={(event) => {\n onFileDelete(event);\n }}\n />\n </div>\n </div>\n )}\n {isInvalid ? (\n <ExclamationTriangleOutlinedSize32 initial=\"negative\" />\n ) : (\n getUploadIcon(uploadType, loadedFile, false)\n )}\n <VSpacing default={16} />\n {loadedFile && (\n <>\n <Text typography=\"label-2-regular\">{loadedFile.data.name}</Text>\n <VSpacing default={6} />\n <Text typography=\"label-4-regular\" style=\"secondary\">\n {renderFileInfo({\n ...loadedFile,\n fileSizeMB: bytes2mb(loadedFile.data.size),\n })}\n </Text>\n <VSpacing default={8} />\n {!loadedFile.loading && !isImageType && (\n <>\n <VSpacing default={8} />\n {deleteFileButton}\n </>\n )}\n {!loadedFile.loading && isImageType && (\n <div className={styles.imageControls}>\n {replaceImageButton}\n {deleteImageButton}\n </div>\n )}\n </>\n )}\n {!loadedFile && (\n <>\n <Text typography=\"label-2-regular\">{trls.title}</Text>\n <VSpacing default={6} />\n <Text typography=\"label-4-regular\" style=\"secondary\">\n {trls.subTitle}\n </Text>\n <VSpacing default={16} />\n {selectFileButton}\n </>\n )}\n </>\n )}\n </div>\n </div>\n );\n};\n\nexport { Upload };\n"],"names":["_jsxs","_jsx","_Fragment"],"mappings":"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"}
1
+ {"version":3,"file":"Upload.js","sources":["../src/Upload.tsx"],"sourcesContent":["import {\n ReactElement,\n useRef,\n ReactNode,\n useEffect,\n useCallback,\n cloneElement,\n MouseEvent,\n ComponentProps,\n useMemo,\n} from 'react';\nimport { useDropzone, Accept, DropEvent, FileRejection } from 'react-dropzone';\nimport classnames from 'classnames';\n\nimport { Action } from '@hh.ru/magritte-ui-action';\nimport { Avatar } from '@hh.ru/magritte-ui-avatar';\nimport { Button } from '@hh.ru/magritte-ui-button';\nimport {\n CrossOutlinedSize24,\n CheckCircleOutlinedSize16,\n ExclamationTriangleOutlinedSize32,\n ExclamationTriangleOutlinedSize16,\n TrashOutlinedSize24,\n} from '@hh.ru/magritte-ui-icon/icon';\nimport { Loader } from '@hh.ru/magritte-ui-loader';\nimport { VSpacing } from '@hh.ru/magritte-ui-spacing';\nimport { Text } from '@hh.ru/magritte-ui-typography';\nimport { FileName } from '@hh.ru/magritte-ui-upload/FileName';\nimport { UploadProps, UploadType, LoadedFileWithFileSize } from '@hh.ru/magritte-ui-upload/types';\nimport { getUploadIcon } from '@hh.ru/magritte-ui-upload/utils';\n\nimport styles from './upload.less';\n\nconst order = 1024 * 1024;\nconst bytes2mb = (value: number): string => {\n return (value / order).toFixed(2);\n};\n\n// парсим accept в нормальный формат\nconst getAvaliableFileTypes = (accept: Accept): UploadType => {\n const avaliableTypes = Object.keys(accept);\n if (avaliableTypes.length === 0) {\n throw new Error(`Magritte component Upload: accept can't be empty`);\n }\n if (avaliableTypes.length > 1) {\n return 'mixed';\n }\n const avaliableType = avaliableTypes[0];\n return avaliableType.split('/')[0] as UploadType;\n};\n\nconst RenderFileInfoDefault = (loadedFile: LoadedFileWithFileSize): ReactNode => {\n return loadedFile.fileSizeMB;\n};\n\nconst DEFAULT_ACCEPT: Accept = {\n 'image/*': ['.png', '.jpeg', '.jpg'],\n};\n\nconst Upload = ({\n files,\n trls,\n size = 'medium',\n multiple = false,\n accept = DEFAULT_ACCEPT,\n selectFileButton: _selectFileButton,\n deleteFileButton: _deleteFileButton,\n replaceImageButton: _replaceImageButton,\n renderFileInfo = RenderFileInfoDefault,\n onDropAccepted: onDropAcceptedExternal,\n onDropRejected: onDropRejectedExternal,\n onFileDelete: onFileDeleteExternal,\n 'aria-label': ariaLabel,\n ...dropzoneProps\n}: UploadProps): ReactElement => {\n const bodyUploadRef = useRef<HTMLDivElement>(null);\n const uploadType = getAvaliableFileTypes(accept);\n const loadedFile = files.length > 0 ? files[0] : undefined;\n const isLoad = Boolean(loadedFile);\n const isLoading = Boolean(loadedFile?.loading);\n const isInvalid = Boolean(loadedFile?.error);\n const isSizeSmall = size === 'small';\n const isImageType = uploadType === 'image';\n\n const backgroundUploadPreview: string = useMemo(() => {\n if (!loadedFile || !isImageType) {\n return 'none';\n }\n if (loadedFile.loading) {\n return 'none';\n }\n if (isSizeSmall) {\n return URL.createObjectURL(loadedFile.data);\n }\n return `url('${URL.createObjectURL(loadedFile.data)}')`;\n }, [loadedFile, isImageType, isSizeSmall]);\n\n useEffect(() => {\n if (!bodyUploadRef.current) {\n return void 0;\n }\n if (isSizeSmall) {\n return void 0;\n }\n // фиксируем ширину, так как после выбора контент поменяется\n const currentElement = bodyUploadRef.current;\n currentElement.style.minHeight = `${bodyUploadRef.current.offsetHeight}px`;\n return () => {\n currentElement.style.minHeight = 'auto';\n };\n }, [isSizeSmall]);\n\n const onDropAccepted = useCallback(\n (acceptedFiles: File[], event: DropEvent) => {\n const acceptedLoadFiles = acceptedFiles.map((file) => ({ data: file, loading: true, loadPercentage: 0 }));\n onDropAcceptedExternal(acceptedLoadFiles, event);\n },\n [onDropAcceptedExternal]\n );\n const onDropRejected = useCallback(\n (fileRejections: FileRejection[], event: DropEvent) => {\n const rejectionLoadFiles = fileRejections.map((fileRejection) => ({\n data: fileRejection.file,\n loading: false,\n error: fileRejection.errors?.[0].code || '',\n }));\n onDropRejectedExternal?.(rejectionLoadFiles, event);\n },\n [onDropRejectedExternal]\n );\n const onFileDelete = useCallback(\n (event: MouseEvent) => {\n loadedFile && onFileDeleteExternal(loadedFile, 0);\n event.stopPropagation();\n },\n [loadedFile, onFileDeleteExternal]\n );\n\n const selectFileButton =\n _selectFileButton &&\n cloneElement(_selectFileButton, {\n key: 'selectFileButton',\n 'data-qa': 'magritte-select-file-button',\n } as Partial<ComponentProps<typeof Button>>);\n\n const deleteFileButton =\n _deleteFileButton &&\n cloneElement(_deleteFileButton, {\n key: 'deleteFileButton',\n 'data-qa': 'magritte-delete-file-button',\n onClick: (event: MouseEvent) => {\n onFileDelete(event);\n },\n } as Partial<ComponentProps<typeof Button>>);\n\n const replaceImageButton =\n _replaceImageButton &&\n cloneElement(_replaceImageButton, {\n key: 'replaceImageButton',\n 'data-qa': 'magritte-select-replace-image-button',\n } as Partial<ComponentProps<typeof Button>>);\n\n const { getRootProps, getInputProps, isDragActive } = useDropzone({\n ...dropzoneProps,\n accept,\n onDropAccepted,\n onDropRejected,\n multiple,\n });\n return (\n <div\n className={classnames(\n styles.root,\n styles[`root_${size}`],\n { [styles.dragActive]: isDragActive },\n { [styles.loading]: isLoading },\n { [styles.load]: isLoad },\n { [styles.invalid]: isInvalid }\n )}\n {...getRootProps()}\n >\n <div\n className={styles.background}\n style={{ backgroundImage: !isSizeSmall ? backgroundUploadPreview : 'none' }}\n />\n <div className={styles.body} ref={bodyUploadRef}>\n <input {...getInputProps()} />\n {isSizeSmall && (\n <>\n {loadedFile && (\n <>\n <Avatar\n mode={isImageType && !isLoading ? 'image' : 'icon'}\n style=\"secondary\"\n image={backgroundUploadPreview}\n size={48}\n icon={getUploadIcon(uploadType, loadedFile, true)}\n aria-label={ariaLabel || ''}\n />\n <div className={styles.smallFileInfoContainer}>\n <FileName file={loadedFile.data} />\n <VSpacing default={4} />\n <div className={styles.smallFileInfo}>\n {isInvalid && <ExclamationTriangleOutlinedSize16 initial=\"negative\" />}\n {isLoading && <Loader size={16} />}\n {!isInvalid && !isLoading && <CheckCircleOutlinedSize16 initial=\"positive\" />}\n {renderFileInfo({\n ...loadedFile,\n fileSizeMB: bytes2mb(loadedFile.data.size),\n })}\n </div>\n </div>\n <div className={styles.smallControls}>\n {isLoading && (\n <Action\n icon={CrossOutlinedSize24}\n mode=\"secondary\"\n onClick={(event) => {\n onFileDelete(event);\n }}\n />\n )}\n {!isLoading && (\n <Action\n icon={TrashOutlinedSize24}\n mode=\"secondary\"\n onClick={(event) => {\n onFileDelete(event);\n }}\n />\n )}\n </div>\n </>\n )}\n {!loadedFile && (\n <>\n <Avatar\n mode=\"icon\"\n style=\"secondary\"\n size={48}\n icon={getUploadIcon(uploadType, loadedFile, true)}\n aria-label={ariaLabel as string}\n />\n <div>\n <Text typography=\"label-2-regular\">{trls.title}</Text>\n <VSpacing default={4} />\n <Text typography=\"label-4-regular\" style=\"secondary\">\n {trls.subTitle}\n </Text>\n </div>\n {selectFileButton && <div className={styles.smallControls}>{selectFileButton}</div>}\n </>\n )}\n </>\n )}\n {!isSizeSmall && (\n <>\n {isLoading && (\n <div className={styles.loader}>\n <Loader size={64} />\n <div className={styles.cancel}>\n <CrossOutlinedSize24\n initial=\"accent\"\n onClick={(event) => {\n onFileDelete(event);\n }}\n />\n </div>\n </div>\n )}\n {isInvalid ? (\n <ExclamationTriangleOutlinedSize32 initial=\"negative\" />\n ) : (\n getUploadIcon(uploadType, loadedFile, false)\n )}\n <VSpacing default={16} />\n {loadedFile && (\n <>\n <FileName file={loadedFile.data} isSizeMedium />\n <VSpacing default={6} />\n <Text typography=\"label-4-regular\" style=\"secondary\">\n {renderFileInfo({\n ...loadedFile,\n fileSizeMB: bytes2mb(loadedFile.data.size),\n })}\n </Text>\n {!loadedFile.loading && !isImageType && deleteFileButton && (\n <>\n <VSpacing default={16} />\n {deleteFileButton}\n </>\n )}\n {!loadedFile.loading && isImageType && (replaceImageButton || deleteFileButton) && (\n <div className={styles.imageControls}>\n {replaceImageButton}\n {deleteFileButton}\n </div>\n )}\n </>\n )}\n {!loadedFile && (\n <>\n <Text typography=\"label-2-regular\">{trls.title}</Text>\n <VSpacing default={6} />\n <Text typography=\"label-4-regular\" style=\"secondary\">\n {trls.subTitle}\n </Text>\n {selectFileButton && (\n <>\n <VSpacing default={16} />\n {selectFileButton}\n </>\n )}\n </>\n )}\n </>\n )}\n </div>\n </div>\n );\n};\n\nexport { Upload };\n"],"names":["_jsxs","_jsx","_Fragment"],"mappings":"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"}
package/index.css CHANGED
@@ -1,3 +1,556 @@
1
+ :root{
2
+ --magritte-typography-title-1-semibold-font-family-v20-0-1:"hh sans";
3
+ --magritte-typography-title-1-semibold-font-weight-v20-0-1:500;
4
+ --magritte-typography-title-1-semibold-line-height-v20-0-1:60px;
5
+ --magritte-typography-title-1-semibold-font-size-v20-0-1:48px;
6
+ --magritte-typography-title-1-semibold-letter-spacing-v20-0-1:-0.02em;
7
+ --magritte-typography-title-1-semibold-text-indent-v20-0-1:0px;
8
+ --magritte-typography-title-1-semibold-text-transform-v20-0-1:none;
9
+ --magritte-typography-title-1-semibold-text-decoration-v20-0-1:none;
10
+ --magritte-typography-title-2-semibold-font-family-v20-0-1:"hh sans";
11
+ --magritte-typography-title-2-semibold-font-weight-v20-0-1:500;
12
+ --magritte-typography-title-2-semibold-line-height-v20-0-1:48px;
13
+ --magritte-typography-title-2-semibold-font-size-v20-0-1:36px;
14
+ --magritte-typography-title-2-semibold-letter-spacing-v20-0-1:-0.0175em;
15
+ --magritte-typography-title-2-semibold-text-indent-v20-0-1:0px;
16
+ --magritte-typography-title-2-semibold-text-transform-v20-0-1:none;
17
+ --magritte-typography-title-2-semibold-text-decoration-v20-0-1:none;
18
+ --magritte-typography-title-3-semibold-font-family-v20-0-1:"hh sans";
19
+ --magritte-typography-title-3-semibold-font-weight-v20-0-1:500;
20
+ --magritte-typography-title-3-semibold-line-height-v20-0-1:40px;
21
+ --magritte-typography-title-3-semibold-font-size-v20-0-1:28px;
22
+ --magritte-typography-title-3-semibold-letter-spacing-v20-0-1:-0.0125em;
23
+ --magritte-typography-title-3-semibold-text-indent-v20-0-1:0px;
24
+ --magritte-typography-title-3-semibold-text-transform-v20-0-1:none;
25
+ --magritte-typography-title-3-semibold-text-decoration-v20-0-1:none;
26
+ --magritte-typography-title-4-semibold-font-family-v20-0-1:"hh sans";
27
+ --magritte-typography-title-4-semibold-font-weight-v20-0-1:500;
28
+ --magritte-typography-title-4-semibold-line-height-v20-0-1:32px;
29
+ --magritte-typography-title-4-semibold-font-size-v20-0-1:22px;
30
+ --magritte-typography-title-4-semibold-letter-spacing-v20-0-1:-0.0075em;
31
+ --magritte-typography-title-4-semibold-text-indent-v20-0-1:0px;
32
+ --magritte-typography-title-4-semibold-text-transform-v20-0-1:none;
33
+ --magritte-typography-title-4-semibold-text-decoration-v20-0-1:none;
34
+ --magritte-typography-title-5-semibold-font-family-v20-0-1:"hh sans";
35
+ --magritte-typography-title-5-semibold-font-weight-v20-0-1:500;
36
+ --magritte-typography-title-5-semibold-line-height-v20-0-1:26px;
37
+ --magritte-typography-title-5-semibold-font-size-v20-0-1:18px;
38
+ --magritte-typography-title-5-semibold-letter-spacing-v20-0-1:0em;
39
+ --magritte-typography-title-5-semibold-text-indent-v20-0-1:0px;
40
+ --magritte-typography-title-5-semibold-text-transform-v20-0-1:none;
41
+ --magritte-typography-title-5-semibold-text-decoration-v20-0-1:none;
42
+ --magritte-typography-subtitle-1-semibold-font-family-v20-0-1:"hh sans";
43
+ --magritte-typography-subtitle-1-semibold-font-weight-v20-0-1:500;
44
+ --magritte-typography-subtitle-1-semibold-line-height-v20-0-1:22px;
45
+ --magritte-typography-subtitle-1-semibold-font-size-v20-0-1:16px;
46
+ --magritte-typography-subtitle-1-semibold-letter-spacing-v20-0-1:0em;
47
+ --magritte-typography-subtitle-1-semibold-text-indent-v20-0-1:0px;
48
+ --magritte-typography-subtitle-1-semibold-text-transform-v20-0-1:none;
49
+ --magritte-typography-subtitle-1-semibold-text-decoration-v20-0-1:none;
50
+ --magritte-typography-subtitle-2-semibold-font-family-v20-0-1:"hh sans";
51
+ --magritte-typography-subtitle-2-semibold-font-weight-v20-0-1:500;
52
+ --magritte-typography-subtitle-2-semibold-line-height-v20-0-1:20px;
53
+ --magritte-typography-subtitle-2-semibold-font-size-v20-0-1:14px;
54
+ --magritte-typography-subtitle-2-semibold-letter-spacing-v20-0-1:0.005em;
55
+ --magritte-typography-subtitle-2-semibold-text-indent-v20-0-1:0px;
56
+ --magritte-typography-subtitle-2-semibold-text-transform-v20-0-1:none;
57
+ --magritte-typography-subtitle-2-semibold-text-decoration-v20-0-1:none;
58
+ --magritte-typography-subtitle-3-semibold-font-family-v20-0-1:"hh sans";
59
+ --magritte-typography-subtitle-3-semibold-font-weight-v20-0-1:500;
60
+ --magritte-typography-subtitle-3-semibold-line-height-v20-0-1:18px;
61
+ --magritte-typography-subtitle-3-semibold-font-size-v20-0-1:12px;
62
+ --magritte-typography-subtitle-3-semibold-letter-spacing-v20-0-1:0.01em;
63
+ --magritte-typography-subtitle-3-semibold-text-indent-v20-0-1:0px;
64
+ --magritte-typography-subtitle-3-semibold-text-transform-v20-0-1:none;
65
+ --magritte-typography-subtitle-3-semibold-text-decoration-v20-0-1:none;
66
+ --magritte-typography-subtitle-4-semibold-font-family-v20-0-1:"hh sans";
67
+ --magritte-typography-subtitle-4-semibold-font-weight-v20-0-1:500;
68
+ --magritte-typography-subtitle-4-semibold-line-height-v20-0-1:16px;
69
+ --magritte-typography-subtitle-4-semibold-font-size-v20-0-1:10px;
70
+ --magritte-typography-subtitle-4-semibold-letter-spacing-v20-0-1:0.015em;
71
+ --magritte-typography-subtitle-4-semibold-text-indent-v20-0-1:0px;
72
+ --magritte-typography-subtitle-4-semibold-text-transform-v20-0-1:none;
73
+ --magritte-typography-subtitle-4-semibold-text-decoration-v20-0-1:none;
74
+ --magritte-typography-label-1-regular-font-family-v20-0-1:"hh sans";
75
+ --magritte-typography-label-1-regular-font-weight-v20-0-1:400;
76
+ --magritte-typography-label-1-regular-line-height-v20-0-1:26px;
77
+ --magritte-typography-label-1-regular-font-size-v20-0-1:18px;
78
+ --magritte-typography-label-1-regular-letter-spacing-v20-0-1:-0.005em;
79
+ --magritte-typography-label-1-regular-text-indent-v20-0-1:0px;
80
+ --magritte-typography-label-1-regular-text-transform-v20-0-1:none;
81
+ --magritte-typography-label-1-regular-text-decoration-v20-0-1:none;
82
+ --magritte-typography-label-2-regular-font-family-v20-0-1:"hh sans";
83
+ --magritte-typography-label-2-regular-font-weight-v20-0-1:400;
84
+ --magritte-typography-label-2-regular-line-height-v20-0-1:22px;
85
+ --magritte-typography-label-2-regular-font-size-v20-0-1:16px;
86
+ --magritte-typography-label-2-regular-letter-spacing-v20-0-1:0em;
87
+ --magritte-typography-label-2-regular-text-indent-v20-0-1:0px;
88
+ --magritte-typography-label-2-regular-text-transform-v20-0-1:none;
89
+ --magritte-typography-label-2-regular-text-decoration-v20-0-1:none;
90
+ --magritte-typography-label-3-regular-font-family-v20-0-1:"hh sans";
91
+ --magritte-typography-label-3-regular-font-weight-v20-0-1:400;
92
+ --magritte-typography-label-3-regular-line-height-v20-0-1:20px;
93
+ --magritte-typography-label-3-regular-font-size-v20-0-1:14px;
94
+ --magritte-typography-label-3-regular-letter-spacing-v20-0-1:0.005em;
95
+ --magritte-typography-label-3-regular-text-indent-v20-0-1:0px;
96
+ --magritte-typography-label-3-regular-text-transform-v20-0-1:none;
97
+ --magritte-typography-label-3-regular-text-decoration-v20-0-1:none;
98
+ --magritte-typography-label-4-regular-font-family-v20-0-1:"hh sans";
99
+ --magritte-typography-label-4-regular-font-weight-v20-0-1:400;
100
+ --magritte-typography-label-4-regular-line-height-v20-0-1:18px;
101
+ --magritte-typography-label-4-regular-font-size-v20-0-1:12px;
102
+ --magritte-typography-label-4-regular-letter-spacing-v20-0-1:0.01em;
103
+ --magritte-typography-label-4-regular-text-indent-v20-0-1:0px;
104
+ --magritte-typography-label-4-regular-text-transform-v20-0-1:none;
105
+ --magritte-typography-label-4-regular-text-decoration-v20-0-1:none;
106
+ --magritte-typography-label-5-regular-font-family-v20-0-1:"hh sans";
107
+ --magritte-typography-label-5-regular-font-weight-v20-0-1:400;
108
+ --magritte-typography-label-5-regular-line-height-v20-0-1:14px;
109
+ --magritte-typography-label-5-regular-font-size-v20-0-1:10px;
110
+ --magritte-typography-label-5-regular-letter-spacing-v20-0-1:0.02em;
111
+ --magritte-typography-label-5-regular-text-indent-v20-0-1:0px;
112
+ --magritte-typography-label-5-regular-text-transform-v20-0-1:none;
113
+ --magritte-typography-label-5-regular-text-decoration-v20-0-1:none;
114
+ --magritte-typography-paragraph-1-regular-font-family-v20-0-1:"hh sans";
115
+ --magritte-typography-paragraph-1-regular-font-weight-v20-0-1:400;
116
+ --magritte-typography-paragraph-1-regular-line-height-v20-0-1:28px;
117
+ --magritte-typography-paragraph-1-regular-font-size-v20-0-1:18px;
118
+ --magritte-typography-paragraph-1-regular-letter-spacing-v20-0-1:0em;
119
+ --magritte-typography-paragraph-1-regular-text-indent-v20-0-1:0px;
120
+ --magritte-typography-paragraph-1-regular-text-transform-v20-0-1:none;
121
+ --magritte-typography-paragraph-1-regular-text-decoration-v20-0-1:none;
122
+ --magritte-typography-paragraph-2-regular-font-family-v20-0-1:"hh sans";
123
+ --magritte-typography-paragraph-2-regular-font-weight-v20-0-1:400;
124
+ --magritte-typography-paragraph-2-regular-line-height-v20-0-1:26px;
125
+ --magritte-typography-paragraph-2-regular-font-size-v20-0-1:16px;
126
+ --magritte-typography-paragraph-2-regular-letter-spacing-v20-0-1:0.005em;
127
+ --magritte-typography-paragraph-2-regular-text-indent-v20-0-1:0px;
128
+ --magritte-typography-paragraph-2-regular-text-transform-v20-0-1:none;
129
+ --magritte-typography-paragraph-2-regular-text-decoration-v20-0-1:none;
130
+ --magritte-typography-paragraph-3-regular-font-family-v20-0-1:"hh sans";
131
+ --magritte-typography-paragraph-3-regular-font-weight-v20-0-1:400;
132
+ --magritte-typography-paragraph-3-regular-line-height-v20-0-1:24px;
133
+ --magritte-typography-paragraph-3-regular-font-size-v20-0-1:14px;
134
+ --magritte-typography-paragraph-3-regular-letter-spacing-v20-0-1:0.01em;
135
+ --magritte-typography-paragraph-3-regular-text-indent-v20-0-1:0px;
136
+ --magritte-typography-paragraph-3-regular-text-transform-v20-0-1:none;
137
+ --magritte-typography-paragraph-3-regular-text-decoration-v20-0-1:none;
138
+ --magritte-typography-paragraph-4-regular-font-family-v20-0-1:"hh sans";
139
+ --magritte-typography-paragraph-4-regular-font-weight-v20-0-1:400;
140
+ --magritte-typography-paragraph-4-regular-line-height-v20-0-1:22px;
141
+ --magritte-typography-paragraph-4-regular-font-size-v20-0-1:12px;
142
+ --magritte-typography-paragraph-4-regular-letter-spacing-v20-0-1:0.015em;
143
+ --magritte-typography-paragraph-4-regular-text-indent-v20-0-1:0px;
144
+ --magritte-typography-paragraph-4-regular-text-transform-v20-0-1:none;
145
+ --magritte-typography-paragraph-4-regular-text-decoration-v20-0-1:none;
146
+ --magritte-typography-_custom-1-semibold-font-family-v20-0-1:"hh sans";
147
+ --magritte-typography-_custom-1-semibold-font-weight-v20-0-1:500;
148
+ --magritte-typography-_custom-1-semibold-line-height-v20-0-1:28px;
149
+ --magritte-typography-_custom-1-semibold-font-size-v20-0-1:18px;
150
+ --magritte-typography-_custom-1-semibold-letter-spacing-v20-0-1:0em;
151
+ --magritte-typography-_custom-1-semibold-text-indent-v20-0-1:0px;
152
+ --magritte-typography-_custom-1-semibold-text-transform-v20-0-1:none;
153
+ --magritte-typography-_custom-1-semibold-text-decoration-v20-0-1:none;
154
+ --magritte-typography-_custom-2-semibold-font-family-v20-0-1:"hh sans";
155
+ --magritte-typography-_custom-2-semibold-font-weight-v20-0-1:500;
156
+ --magritte-typography-_custom-2-semibold-line-height-v20-0-1:26px;
157
+ --magritte-typography-_custom-2-semibold-font-size-v20-0-1:16px;
158
+ --magritte-typography-_custom-2-semibold-letter-spacing-v20-0-1:0.005em;
159
+ --magritte-typography-_custom-2-semibold-text-indent-v20-0-1:0px;
160
+ --magritte-typography-_custom-2-semibold-text-transform-v20-0-1:none;
161
+ --magritte-typography-_custom-2-semibold-text-decoration-v20-0-1:none;
162
+ --magritte-typography-_custom-3-semibold-font-family-v20-0-1:"hh sans";
163
+ --magritte-typography-_custom-3-semibold-font-weight-v20-0-1:500;
164
+ --magritte-typography-_custom-3-semibold-line-height-v20-0-1:24px;
165
+ --magritte-typography-_custom-3-semibold-font-size-v20-0-1:14px;
166
+ --magritte-typography-_custom-3-semibold-letter-spacing-v20-0-1:0.01em;
167
+ --magritte-typography-_custom-3-semibold-text-indent-v20-0-1:0px;
168
+ --magritte-typography-_custom-3-semibold-text-transform-v20-0-1:none;
169
+ --magritte-typography-_custom-3-semibold-text-decoration-v20-0-1:none;
170
+ --magritte-typography-_custom-4-semibold-font-family-v20-0-1:"hh sans";
171
+ --magritte-typography-_custom-4-semibold-font-weight-v20-0-1:400;
172
+ --magritte-typography-_custom-4-semibold-line-height-v20-0-1:22px;
173
+ --magritte-typography-_custom-4-semibold-font-size-v20-0-1:12px;
174
+ --magritte-typography-_custom-4-semibold-letter-spacing-v20-0-1:0.015em;
175
+ --magritte-typography-_custom-4-semibold-text-indent-v20-0-1:0px;
176
+ --magritte-typography-_custom-4-semibold-text-transform-v20-0-1:none;
177
+ --magritte-typography-_custom-4-semibold-text-decoration-v20-0-1:none;
178
+ --magritte-typography-_custom-5-semibold-font-family-v20-0-1:"hh sans";
179
+ --magritte-typography-_custom-5-semibold-font-weight-v20-0-1:400;
180
+ --magritte-typography-_custom-5-semibold-line-height-v20-0-1:12px;
181
+ --magritte-typography-_custom-5-semibold-font-size-v20-0-1:10px;
182
+ --magritte-typography-_custom-5-semibold-letter-spacing-v20-0-1:0.015em;
183
+ --magritte-typography-_custom-5-semibold-text-indent-v20-0-1:0px;
184
+ --magritte-typography-_custom-5-semibold-text-transform-v20-0-1:none;
185
+ --magritte-typography-_custom-5-semibold-text-decoration-v20-0-1:none;
186
+ --magritte-typography-_custom-1-medium-font-family-v20-0-1:"hh sans";
187
+ --magritte-typography-_custom-1-medium-font-weight-v20-0-1:500;
188
+ --magritte-typography-_custom-1-medium-line-height-v20-0-1:28px;
189
+ --magritte-typography-_custom-1-medium-font-size-v20-0-1:18px;
190
+ --magritte-typography-_custom-1-medium-letter-spacing-v20-0-1:0em;
191
+ --magritte-typography-_custom-1-medium-text-indent-v20-0-1:0px;
192
+ --magritte-typography-_custom-1-medium-text-transform-v20-0-1:none;
193
+ --magritte-typography-_custom-1-medium-text-decoration-v20-0-1:none;
194
+ --magritte-typography-_custom-2-medium-font-family-v20-0-1:"hh sans";
195
+ --magritte-typography-_custom-2-medium-font-weight-v20-0-1:500;
196
+ --magritte-typography-_custom-2-medium-line-height-v20-0-1:26px;
197
+ --magritte-typography-_custom-2-medium-font-size-v20-0-1:16px;
198
+ --magritte-typography-_custom-2-medium-letter-spacing-v20-0-1:0.005em;
199
+ --magritte-typography-_custom-2-medium-text-indent-v20-0-1:0px;
200
+ --magritte-typography-_custom-2-medium-text-transform-v20-0-1:none;
201
+ --magritte-typography-_custom-2-medium-text-decoration-v20-0-1:none;
202
+ --magritte-typography-_custom-3-medium-font-family-v20-0-1:"hh sans";
203
+ --magritte-typography-_custom-3-medium-font-weight-v20-0-1:500;
204
+ --magritte-typography-_custom-3-medium-line-height-v20-0-1:24px;
205
+ --magritte-typography-_custom-3-medium-font-size-v20-0-1:14px;
206
+ --magritte-typography-_custom-3-medium-letter-spacing-v20-0-1:0.01em;
207
+ --magritte-typography-_custom-3-medium-text-indent-v20-0-1:0px;
208
+ --magritte-typography-_custom-3-medium-text-transform-v20-0-1:none;
209
+ --magritte-typography-_custom-3-medium-text-decoration-v20-0-1:none;
210
+ --magritte-typography-_custom-4-medium-font-family-v20-0-1:"hh sans";
211
+ --magritte-typography-_custom-4-medium-font-weight-v20-0-1:500;
212
+ --magritte-typography-_custom-4-medium-line-height-v20-0-1:22px;
213
+ --magritte-typography-_custom-4-medium-font-size-v20-0-1:12px;
214
+ --magritte-typography-_custom-4-medium-letter-spacing-v20-0-1:0.015em;
215
+ --magritte-typography-_custom-4-medium-text-indent-v20-0-1:0px;
216
+ --magritte-typography-_custom-4-medium-text-transform-v20-0-1:none;
217
+ --magritte-typography-_custom-4-medium-text-decoration-v20-0-1:none;
218
+ --magritte-typography-_custom-5-medium-font-family-v20-0-1:"hh sans";
219
+ --magritte-typography-_custom-5-medium-font-weight-v20-0-1:500;
220
+ --magritte-typography-_custom-5-medium-line-height-v20-0-1:12px;
221
+ --magritte-typography-_custom-5-medium-font-size-v20-0-1:10px;
222
+ --magritte-typography-_custom-5-medium-letter-spacing-v20-0-1:0.015em;
223
+ --magritte-typography-_custom-5-medium-text-indent-v20-0-1:0px;
224
+ --magritte-typography-_custom-5-medium-text-transform-v20-0-1:none;
225
+ --magritte-typography-_custom-5-medium-text-decoration-v20-0-1:none;
226
+ --magritte-typography-_custom-1-italic-font-family-v20-0-1:"hh sans";
227
+ --magritte-typography-_custom-1-italic-font-weight-v20-0-1:400;
228
+ --magritte-typography-_custom-1-italic-line-height-v20-0-1:28px;
229
+ --magritte-typography-_custom-1-italic-font-size-v20-0-1:18px;
230
+ --magritte-typography-_custom-1-italic-letter-spacing-v20-0-1:0em;
231
+ --magritte-typography-_custom-1-italic-text-indent-v20-0-1:0px;
232
+ --magritte-typography-_custom-1-italic-text-transform-v20-0-1:none;
233
+ --magritte-typography-_custom-1-italic-text-decoration-v20-0-1:none;
234
+ --magritte-typography-_custom-2-italic-font-family-v20-0-1:"hh sans";
235
+ --magritte-typography-_custom-2-italic-font-weight-v20-0-1:400;
236
+ --magritte-typography-_custom-2-italic-line-height-v20-0-1:26px;
237
+ --magritte-typography-_custom-2-italic-font-size-v20-0-1:16px;
238
+ --magritte-typography-_custom-2-italic-letter-spacing-v20-0-1:0.005em;
239
+ --magritte-typography-_custom-2-italic-text-indent-v20-0-1:0px;
240
+ --magritte-typography-_custom-2-italic-text-transform-v20-0-1:none;
241
+ --magritte-typography-_custom-2-italic-text-decoration-v20-0-1:none;
242
+ --magritte-typography-_custom-3-italic-font-family-v20-0-1:"hh sans";
243
+ --magritte-typography-_custom-3-italic-font-weight-v20-0-1:400;
244
+ --magritte-typography-_custom-3-italic-line-height-v20-0-1:24px;
245
+ --magritte-typography-_custom-3-italic-font-size-v20-0-1:14px;
246
+ --magritte-typography-_custom-3-italic-letter-spacing-v20-0-1:0.01em;
247
+ --magritte-typography-_custom-3-italic-text-indent-v20-0-1:0px;
248
+ --magritte-typography-_custom-3-italic-text-transform-v20-0-1:none;
249
+ --magritte-typography-_custom-3-italic-text-decoration-v20-0-1:none;
250
+ --magritte-typography-_custom-4-italic-font-family-v20-0-1:"hh sans";
251
+ --magritte-typography-_custom-4-italic-font-weight-v20-0-1:400;
252
+ --magritte-typography-_custom-4-italic-line-height-v20-0-1:22px;
253
+ --magritte-typography-_custom-4-italic-font-size-v20-0-1:12px;
254
+ --magritte-typography-_custom-4-italic-letter-spacing-v20-0-1:0.015em;
255
+ --magritte-typography-_custom-4-italic-text-indent-v20-0-1:0px;
256
+ --magritte-typography-_custom-4-italic-text-transform-v20-0-1:none;
257
+ --magritte-typography-_custom-4-italic-text-decoration-v20-0-1:none;
258
+ --magritte-typography-_custom-5-italic-font-family-v20-0-1:"hh sans";
259
+ --magritte-typography-_custom-5-italic-font-weight-v20-0-1:400;
260
+ --magritte-typography-_custom-5-italic-line-height-v20-0-1:12px;
261
+ --magritte-typography-_custom-5-italic-font-size-v20-0-1:10px;
262
+ --magritte-typography-_custom-5-italic-letter-spacing-v20-0-1:0.015em;
263
+ --magritte-typography-_custom-5-italic-text-indent-v20-0-1:0px;
264
+ --magritte-typography-_custom-5-italic-text-transform-v20-0-1:none;
265
+ --magritte-typography-_custom-5-italic-text-decoration-v20-0-1:none;
266
+ }
267
+ .magritte-with-inter{
268
+ --magritte-typography-title-1-semibold-font-family-v20-0-1:"Inter";
269
+ --magritte-typography-title-1-semibold-font-weight-v20-0-1:600;
270
+ --magritte-typography-title-1-semibold-line-height-v20-0-1:60px;
271
+ --magritte-typography-title-1-semibold-font-size-v20-0-1:48px;
272
+ --magritte-typography-title-1-semibold-letter-spacing-v20-0-1:-0.02em;
273
+ --magritte-typography-title-1-semibold-text-indent-v20-0-1:0px;
274
+ --magritte-typography-title-1-semibold-text-transform-v20-0-1:none;
275
+ --magritte-typography-title-1-semibold-text-decoration-v20-0-1:none;
276
+ --magritte-typography-title-2-semibold-font-family-v20-0-1:"Inter";
277
+ --magritte-typography-title-2-semibold-font-weight-v20-0-1:600;
278
+ --magritte-typography-title-2-semibold-line-height-v20-0-1:48px;
279
+ --magritte-typography-title-2-semibold-font-size-v20-0-1:36px;
280
+ --magritte-typography-title-2-semibold-letter-spacing-v20-0-1:-0.0175em;
281
+ --magritte-typography-title-2-semibold-text-indent-v20-0-1:0px;
282
+ --magritte-typography-title-2-semibold-text-transform-v20-0-1:none;
283
+ --magritte-typography-title-2-semibold-text-decoration-v20-0-1:none;
284
+ --magritte-typography-title-3-semibold-font-family-v20-0-1:"Inter";
285
+ --magritte-typography-title-3-semibold-font-weight-v20-0-1:600;
286
+ --magritte-typography-title-3-semibold-line-height-v20-0-1:40px;
287
+ --magritte-typography-title-3-semibold-font-size-v20-0-1:28px;
288
+ --magritte-typography-title-3-semibold-letter-spacing-v20-0-1:-0.0125em;
289
+ --magritte-typography-title-3-semibold-text-indent-v20-0-1:0px;
290
+ --magritte-typography-title-3-semibold-text-transform-v20-0-1:none;
291
+ --magritte-typography-title-3-semibold-text-decoration-v20-0-1:none;
292
+ --magritte-typography-title-4-semibold-font-family-v20-0-1:"Inter";
293
+ --magritte-typography-title-4-semibold-font-weight-v20-0-1:600;
294
+ --magritte-typography-title-4-semibold-line-height-v20-0-1:32px;
295
+ --magritte-typography-title-4-semibold-font-size-v20-0-1:22px;
296
+ --magritte-typography-title-4-semibold-letter-spacing-v20-0-1:-0.0075em;
297
+ --magritte-typography-title-4-semibold-text-indent-v20-0-1:0px;
298
+ --magritte-typography-title-4-semibold-text-transform-v20-0-1:none;
299
+ --magritte-typography-title-4-semibold-text-decoration-v20-0-1:none;
300
+ --magritte-typography-title-5-semibold-font-family-v20-0-1:"Inter";
301
+ --magritte-typography-title-5-semibold-font-weight-v20-0-1:600;
302
+ --magritte-typography-title-5-semibold-line-height-v20-0-1:26px;
303
+ --magritte-typography-title-5-semibold-font-size-v20-0-1:18px;
304
+ --magritte-typography-title-5-semibold-letter-spacing-v20-0-1:0em;
305
+ --magritte-typography-title-5-semibold-text-indent-v20-0-1:0px;
306
+ --magritte-typography-title-5-semibold-text-transform-v20-0-1:none;
307
+ --magritte-typography-title-5-semibold-text-decoration-v20-0-1:none;
308
+ --magritte-typography-subtitle-1-semibold-font-family-v20-0-1:"Inter";
309
+ --magritte-typography-subtitle-1-semibold-font-weight-v20-0-1:600;
310
+ --magritte-typography-subtitle-1-semibold-line-height-v20-0-1:22px;
311
+ --magritte-typography-subtitle-1-semibold-font-size-v20-0-1:16px;
312
+ --magritte-typography-subtitle-1-semibold-letter-spacing-v20-0-1:0em;
313
+ --magritte-typography-subtitle-1-semibold-text-indent-v20-0-1:0px;
314
+ --magritte-typography-subtitle-1-semibold-text-transform-v20-0-1:none;
315
+ --magritte-typography-subtitle-1-semibold-text-decoration-v20-0-1:none;
316
+ --magritte-typography-subtitle-2-semibold-font-family-v20-0-1:"Inter";
317
+ --magritte-typography-subtitle-2-semibold-font-weight-v20-0-1:600;
318
+ --magritte-typography-subtitle-2-semibold-line-height-v20-0-1:20px;
319
+ --magritte-typography-subtitle-2-semibold-font-size-v20-0-1:14px;
320
+ --magritte-typography-subtitle-2-semibold-letter-spacing-v20-0-1:0.005em;
321
+ --magritte-typography-subtitle-2-semibold-text-indent-v20-0-1:0px;
322
+ --magritte-typography-subtitle-2-semibold-text-transform-v20-0-1:none;
323
+ --magritte-typography-subtitle-2-semibold-text-decoration-v20-0-1:none;
324
+ --magritte-typography-subtitle-3-semibold-font-family-v20-0-1:"Inter";
325
+ --magritte-typography-subtitle-3-semibold-font-weight-v20-0-1:600;
326
+ --magritte-typography-subtitle-3-semibold-line-height-v20-0-1:18px;
327
+ --magritte-typography-subtitle-3-semibold-font-size-v20-0-1:12px;
328
+ --magritte-typography-subtitle-3-semibold-letter-spacing-v20-0-1:0.01em;
329
+ --magritte-typography-subtitle-3-semibold-text-indent-v20-0-1:0px;
330
+ --magritte-typography-subtitle-3-semibold-text-transform-v20-0-1:none;
331
+ --magritte-typography-subtitle-3-semibold-text-decoration-v20-0-1:none;
332
+ --magritte-typography-subtitle-4-semibold-font-family-v20-0-1:"Inter";
333
+ --magritte-typography-subtitle-4-semibold-font-weight-v20-0-1:600;
334
+ --magritte-typography-subtitle-4-semibold-line-height-v20-0-1:16px;
335
+ --magritte-typography-subtitle-4-semibold-font-size-v20-0-1:10px;
336
+ --magritte-typography-subtitle-4-semibold-letter-spacing-v20-0-1:0.015em;
337
+ --magritte-typography-subtitle-4-semibold-text-indent-v20-0-1:0px;
338
+ --magritte-typography-subtitle-4-semibold-text-transform-v20-0-1:none;
339
+ --magritte-typography-subtitle-4-semibold-text-decoration-v20-0-1:none;
340
+ --magritte-typography-label-1-regular-font-family-v20-0-1:"Inter";
341
+ --magritte-typography-label-1-regular-font-weight-v20-0-1:400;
342
+ --magritte-typography-label-1-regular-line-height-v20-0-1:26px;
343
+ --magritte-typography-label-1-regular-font-size-v20-0-1:18px;
344
+ --magritte-typography-label-1-regular-letter-spacing-v20-0-1:-0.005em;
345
+ --magritte-typography-label-1-regular-text-indent-v20-0-1:0px;
346
+ --magritte-typography-label-1-regular-text-transform-v20-0-1:none;
347
+ --magritte-typography-label-1-regular-text-decoration-v20-0-1:none;
348
+ --magritte-typography-label-2-regular-font-family-v20-0-1:"Inter";
349
+ --magritte-typography-label-2-regular-font-weight-v20-0-1:400;
350
+ --magritte-typography-label-2-regular-line-height-v20-0-1:22px;
351
+ --magritte-typography-label-2-regular-font-size-v20-0-1:16px;
352
+ --magritte-typography-label-2-regular-letter-spacing-v20-0-1:0em;
353
+ --magritte-typography-label-2-regular-text-indent-v20-0-1:0px;
354
+ --magritte-typography-label-2-regular-text-transform-v20-0-1:none;
355
+ --magritte-typography-label-2-regular-text-decoration-v20-0-1:none;
356
+ --magritte-typography-label-3-regular-font-family-v20-0-1:"Inter";
357
+ --magritte-typography-label-3-regular-font-weight-v20-0-1:400;
358
+ --magritte-typography-label-3-regular-line-height-v20-0-1:20px;
359
+ --magritte-typography-label-3-regular-font-size-v20-0-1:14px;
360
+ --magritte-typography-label-3-regular-letter-spacing-v20-0-1:0.005em;
361
+ --magritte-typography-label-3-regular-text-indent-v20-0-1:0px;
362
+ --magritte-typography-label-3-regular-text-transform-v20-0-1:none;
363
+ --magritte-typography-label-3-regular-text-decoration-v20-0-1:none;
364
+ --magritte-typography-label-4-regular-font-family-v20-0-1:"Inter";
365
+ --magritte-typography-label-4-regular-font-weight-v20-0-1:400;
366
+ --magritte-typography-label-4-regular-line-height-v20-0-1:18px;
367
+ --magritte-typography-label-4-regular-font-size-v20-0-1:12px;
368
+ --magritte-typography-label-4-regular-letter-spacing-v20-0-1:0.01em;
369
+ --magritte-typography-label-4-regular-text-indent-v20-0-1:0px;
370
+ --magritte-typography-label-4-regular-text-transform-v20-0-1:none;
371
+ --magritte-typography-label-4-regular-text-decoration-v20-0-1:none;
372
+ --magritte-typography-label-5-regular-font-family-v20-0-1:"Inter";
373
+ --magritte-typography-label-5-regular-font-weight-v20-0-1:400;
374
+ --magritte-typography-label-5-regular-line-height-v20-0-1:14px;
375
+ --magritte-typography-label-5-regular-font-size-v20-0-1:10px;
376
+ --magritte-typography-label-5-regular-letter-spacing-v20-0-1:0.02em;
377
+ --magritte-typography-label-5-regular-text-indent-v20-0-1:0px;
378
+ --magritte-typography-label-5-regular-text-transform-v20-0-1:none;
379
+ --magritte-typography-label-5-regular-text-decoration-v20-0-1:none;
380
+ --magritte-typography-paragraph-1-regular-font-family-v20-0-1:"Inter";
381
+ --magritte-typography-paragraph-1-regular-font-weight-v20-0-1:400;
382
+ --magritte-typography-paragraph-1-regular-line-height-v20-0-1:28px;
383
+ --magritte-typography-paragraph-1-regular-font-size-v20-0-1:18px;
384
+ --magritte-typography-paragraph-1-regular-letter-spacing-v20-0-1:0em;
385
+ --magritte-typography-paragraph-1-regular-text-indent-v20-0-1:0px;
386
+ --magritte-typography-paragraph-1-regular-text-transform-v20-0-1:none;
387
+ --magritte-typography-paragraph-1-regular-text-decoration-v20-0-1:none;
388
+ --magritte-typography-paragraph-2-regular-font-family-v20-0-1:"Inter";
389
+ --magritte-typography-paragraph-2-regular-font-weight-v20-0-1:400;
390
+ --magritte-typography-paragraph-2-regular-line-height-v20-0-1:26px;
391
+ --magritte-typography-paragraph-2-regular-font-size-v20-0-1:16px;
392
+ --magritte-typography-paragraph-2-regular-letter-spacing-v20-0-1:0.005em;
393
+ --magritte-typography-paragraph-2-regular-text-indent-v20-0-1:0px;
394
+ --magritte-typography-paragraph-2-regular-text-transform-v20-0-1:none;
395
+ --magritte-typography-paragraph-2-regular-text-decoration-v20-0-1:none;
396
+ --magritte-typography-paragraph-3-regular-font-family-v20-0-1:"Inter";
397
+ --magritte-typography-paragraph-3-regular-font-weight-v20-0-1:400;
398
+ --magritte-typography-paragraph-3-regular-line-height-v20-0-1:24px;
399
+ --magritte-typography-paragraph-3-regular-font-size-v20-0-1:14px;
400
+ --magritte-typography-paragraph-3-regular-letter-spacing-v20-0-1:0.01em;
401
+ --magritte-typography-paragraph-3-regular-text-indent-v20-0-1:0px;
402
+ --magritte-typography-paragraph-3-regular-text-transform-v20-0-1:none;
403
+ --magritte-typography-paragraph-3-regular-text-decoration-v20-0-1:none;
404
+ --magritte-typography-paragraph-4-regular-font-family-v20-0-1:"Inter";
405
+ --magritte-typography-paragraph-4-regular-font-weight-v20-0-1:400;
406
+ --magritte-typography-paragraph-4-regular-line-height-v20-0-1:22px;
407
+ --magritte-typography-paragraph-4-regular-font-size-v20-0-1:12px;
408
+ --magritte-typography-paragraph-4-regular-letter-spacing-v20-0-1:0.015em;
409
+ --magritte-typography-paragraph-4-regular-text-indent-v20-0-1:0px;
410
+ --magritte-typography-paragraph-4-regular-text-transform-v20-0-1:none;
411
+ --magritte-typography-paragraph-4-regular-text-decoration-v20-0-1:none;
412
+ --magritte-typography-_custom-1-semibold-font-family-v20-0-1:"Inter";
413
+ --magritte-typography-_custom-1-semibold-font-weight-v20-0-1:600;
414
+ --magritte-typography-_custom-1-semibold-line-height-v20-0-1:28px;
415
+ --magritte-typography-_custom-1-semibold-font-size-v20-0-1:18px;
416
+ --magritte-typography-_custom-1-semibold-letter-spacing-v20-0-1:0em;
417
+ --magritte-typography-_custom-1-semibold-text-indent-v20-0-1:0px;
418
+ --magritte-typography-_custom-1-semibold-text-transform-v20-0-1:none;
419
+ --magritte-typography-_custom-1-semibold-text-decoration-v20-0-1:none;
420
+ --magritte-typography-_custom-2-semibold-font-family-v20-0-1:"Inter";
421
+ --magritte-typography-_custom-2-semibold-font-weight-v20-0-1:600;
422
+ --magritte-typography-_custom-2-semibold-line-height-v20-0-1:26px;
423
+ --magritte-typography-_custom-2-semibold-font-size-v20-0-1:16px;
424
+ --magritte-typography-_custom-2-semibold-letter-spacing-v20-0-1:0.005em;
425
+ --magritte-typography-_custom-2-semibold-text-indent-v20-0-1:0px;
426
+ --magritte-typography-_custom-2-semibold-text-transform-v20-0-1:none;
427
+ --magritte-typography-_custom-2-semibold-text-decoration-v20-0-1:none;
428
+ --magritte-typography-_custom-3-semibold-font-family-v20-0-1:"Inter";
429
+ --magritte-typography-_custom-3-semibold-font-weight-v20-0-1:600;
430
+ --magritte-typography-_custom-3-semibold-line-height-v20-0-1:24px;
431
+ --magritte-typography-_custom-3-semibold-font-size-v20-0-1:14px;
432
+ --magritte-typography-_custom-3-semibold-letter-spacing-v20-0-1:0.01em;
433
+ --magritte-typography-_custom-3-semibold-text-indent-v20-0-1:0px;
434
+ --magritte-typography-_custom-3-semibold-text-transform-v20-0-1:none;
435
+ --magritte-typography-_custom-3-semibold-text-decoration-v20-0-1:none;
436
+ --magritte-typography-_custom-4-semibold-font-family-v20-0-1:"Inter";
437
+ --magritte-typography-_custom-4-semibold-font-weight-v20-0-1:400;
438
+ --magritte-typography-_custom-4-semibold-line-height-v20-0-1:22px;
439
+ --magritte-typography-_custom-4-semibold-font-size-v20-0-1:12px;
440
+ --magritte-typography-_custom-4-semibold-letter-spacing-v20-0-1:0.015em;
441
+ --magritte-typography-_custom-4-semibold-text-indent-v20-0-1:0px;
442
+ --magritte-typography-_custom-4-semibold-text-transform-v20-0-1:none;
443
+ --magritte-typography-_custom-4-semibold-text-decoration-v20-0-1:none;
444
+ --magritte-typography-_custom-5-semibold-font-family-v20-0-1:"Inter";
445
+ --magritte-typography-_custom-5-semibold-font-weight-v20-0-1:400;
446
+ --magritte-typography-_custom-5-semibold-line-height-v20-0-1:12px;
447
+ --magritte-typography-_custom-5-semibold-font-size-v20-0-1:10px;
448
+ --magritte-typography-_custom-5-semibold-letter-spacing-v20-0-1:0.015em;
449
+ --magritte-typography-_custom-5-semibold-text-indent-v20-0-1:0px;
450
+ --magritte-typography-_custom-5-semibold-text-transform-v20-0-1:none;
451
+ --magritte-typography-_custom-5-semibold-text-decoration-v20-0-1:none;
452
+ --magritte-typography-_custom-1-medium-font-family-v20-0-1:"Inter";
453
+ --magritte-typography-_custom-1-medium-font-weight-v20-0-1:undefined;
454
+ --magritte-typography-_custom-1-medium-line-height-v20-0-1:28px;
455
+ --magritte-typography-_custom-1-medium-font-size-v20-0-1:18px;
456
+ --magritte-typography-_custom-1-medium-letter-spacing-v20-0-1:0em;
457
+ --magritte-typography-_custom-1-medium-text-indent-v20-0-1:0px;
458
+ --magritte-typography-_custom-1-medium-text-transform-v20-0-1:none;
459
+ --magritte-typography-_custom-1-medium-text-decoration-v20-0-1:none;
460
+ --magritte-typography-_custom-2-medium-font-family-v20-0-1:"Inter";
461
+ --magritte-typography-_custom-2-medium-font-weight-v20-0-1:undefined;
462
+ --magritte-typography-_custom-2-medium-line-height-v20-0-1:26px;
463
+ --magritte-typography-_custom-2-medium-font-size-v20-0-1:16px;
464
+ --magritte-typography-_custom-2-medium-letter-spacing-v20-0-1:0.005em;
465
+ --magritte-typography-_custom-2-medium-text-indent-v20-0-1:0px;
466
+ --magritte-typography-_custom-2-medium-text-transform-v20-0-1:none;
467
+ --magritte-typography-_custom-2-medium-text-decoration-v20-0-1:none;
468
+ --magritte-typography-_custom-3-medium-font-family-v20-0-1:"Inter";
469
+ --magritte-typography-_custom-3-medium-font-weight-v20-0-1:undefined;
470
+ --magritte-typography-_custom-3-medium-line-height-v20-0-1:24px;
471
+ --magritte-typography-_custom-3-medium-font-size-v20-0-1:14px;
472
+ --magritte-typography-_custom-3-medium-letter-spacing-v20-0-1:0.01em;
473
+ --magritte-typography-_custom-3-medium-text-indent-v20-0-1:0px;
474
+ --magritte-typography-_custom-3-medium-text-transform-v20-0-1:none;
475
+ --magritte-typography-_custom-3-medium-text-decoration-v20-0-1:none;
476
+ --magritte-typography-_custom-4-medium-font-family-v20-0-1:"Inter";
477
+ --magritte-typography-_custom-4-medium-font-weight-v20-0-1:undefined;
478
+ --magritte-typography-_custom-4-medium-line-height-v20-0-1:22px;
479
+ --magritte-typography-_custom-4-medium-font-size-v20-0-1:12px;
480
+ --magritte-typography-_custom-4-medium-letter-spacing-v20-0-1:0.015em;
481
+ --magritte-typography-_custom-4-medium-text-indent-v20-0-1:0px;
482
+ --magritte-typography-_custom-4-medium-text-transform-v20-0-1:none;
483
+ --magritte-typography-_custom-4-medium-text-decoration-v20-0-1:none;
484
+ --magritte-typography-_custom-5-medium-font-family-v20-0-1:"Inter";
485
+ --magritte-typography-_custom-5-medium-font-weight-v20-0-1:undefined;
486
+ --magritte-typography-_custom-5-medium-line-height-v20-0-1:12px;
487
+ --magritte-typography-_custom-5-medium-font-size-v20-0-1:10px;
488
+ --magritte-typography-_custom-5-medium-letter-spacing-v20-0-1:0.015em;
489
+ --magritte-typography-_custom-5-medium-text-indent-v20-0-1:0px;
490
+ --magritte-typography-_custom-5-medium-text-transform-v20-0-1:none;
491
+ --magritte-typography-_custom-5-medium-text-decoration-v20-0-1:none;
492
+ --magritte-typography-_custom-1-italic-font-family-v20-0-1:"Inter";
493
+ --magritte-typography-_custom-1-italic-font-weight-v20-0-1:200;
494
+ --magritte-typography-_custom-1-italic-line-height-v20-0-1:28px;
495
+ --magritte-typography-_custom-1-italic-font-size-v20-0-1:18px;
496
+ --magritte-typography-_custom-1-italic-letter-spacing-v20-0-1:0em;
497
+ --magritte-typography-_custom-1-italic-text-indent-v20-0-1:0px;
498
+ --magritte-typography-_custom-1-italic-text-transform-v20-0-1:none;
499
+ --magritte-typography-_custom-1-italic-text-decoration-v20-0-1:none;
500
+ --magritte-typography-_custom-2-italic-font-family-v20-0-1:"Inter";
501
+ --magritte-typography-_custom-2-italic-font-weight-v20-0-1:200;
502
+ --magritte-typography-_custom-2-italic-line-height-v20-0-1:26px;
503
+ --magritte-typography-_custom-2-italic-font-size-v20-0-1:16px;
504
+ --magritte-typography-_custom-2-italic-letter-spacing-v20-0-1:0.005em;
505
+ --magritte-typography-_custom-2-italic-text-indent-v20-0-1:0px;
506
+ --magritte-typography-_custom-2-italic-text-transform-v20-0-1:none;
507
+ --magritte-typography-_custom-2-italic-text-decoration-v20-0-1:none;
508
+ --magritte-typography-_custom-3-italic-font-family-v20-0-1:"Inter";
509
+ --magritte-typography-_custom-3-italic-font-weight-v20-0-1:200;
510
+ --magritte-typography-_custom-3-italic-line-height-v20-0-1:24px;
511
+ --magritte-typography-_custom-3-italic-font-size-v20-0-1:14px;
512
+ --magritte-typography-_custom-3-italic-letter-spacing-v20-0-1:0.01em;
513
+ --magritte-typography-_custom-3-italic-text-indent-v20-0-1:0px;
514
+ --magritte-typography-_custom-3-italic-text-transform-v20-0-1:none;
515
+ --magritte-typography-_custom-3-italic-text-decoration-v20-0-1:none;
516
+ --magritte-typography-_custom-4-italic-font-family-v20-0-1:"Inter";
517
+ --magritte-typography-_custom-4-italic-font-weight-v20-0-1:200;
518
+ --magritte-typography-_custom-4-italic-line-height-v20-0-1:22px;
519
+ --magritte-typography-_custom-4-italic-font-size-v20-0-1:12px;
520
+ --magritte-typography-_custom-4-italic-letter-spacing-v20-0-1:0.015em;
521
+ --magritte-typography-_custom-4-italic-text-indent-v20-0-1:0px;
522
+ --magritte-typography-_custom-4-italic-text-transform-v20-0-1:none;
523
+ --magritte-typography-_custom-4-italic-text-decoration-v20-0-1:none;
524
+ --magritte-typography-_custom-5-italic-font-family-v20-0-1:"Inter";
525
+ --magritte-typography-_custom-5-italic-font-weight-v20-0-1:200;
526
+ --magritte-typography-_custom-5-italic-line-height-v20-0-1:12px;
527
+ --magritte-typography-_custom-5-italic-font-size-v20-0-1:10px;
528
+ --magritte-typography-_custom-5-italic-letter-spacing-v20-0-1:0.015em;
529
+ --magritte-typography-_custom-5-italic-text-indent-v20-0-1:0px;
530
+ --magritte-typography-_custom-5-italic-text-transform-v20-0-1:none;
531
+ --magritte-typography-_custom-5-italic-text-decoration-v20-0-1:none;
532
+ }
533
+ .magritte-file-name-body___PTTMc_2-0-0{
534
+ display:flex;
535
+ width:100%;
536
+ overflow:hidden;
537
+ font-family:var(--magritte-typography-label-2-regular-font-family-v20-0-1);
538
+ font-weight:var(--magritte-typography-label-2-regular-font-weight-v20-0-1);
539
+ line-height:var(--magritte-typography-label-2-regular-line-height-v20-0-1);
540
+ font-size:var(--magritte-typography-label-2-regular-font-size-v20-0-1);
541
+ letter-spacing:var(--magritte-typography-label-2-regular-letter-spacing-v20-0-1);
542
+ text-indent:var(--magritte-typography-label-2-regular-text-indent-v20-0-1);
543
+ text-transform:var(--magritte-typography-label-2-regular-text-transform-v20-0-1);
544
+ text-decoration:var(--magritte-typography-label-2-regular-text-decoration-v20-0-1);
545
+ }
546
+ .magritte-file-name-body_medium___sfmmq_2-0-0{
547
+ justify-content:center;
548
+ }
549
+ .magritte-file-name___ZSL2g_2-0-0{
550
+ overflow:hidden;
551
+ text-overflow:ellipsis;
552
+ }
553
+
1
554
  :root{
2
555
  --magritte-color-background-primary-v20-0-1:#ffffff;
3
556
  --magritte-color-stroke-neutral-v20-0-1:#DCE3EB;
@@ -550,56 +1103,56 @@
550
1103
  --magritte-typography-_custom-5-italic-text-transform-v20-0-1:none;
551
1104
  --magritte-typography-_custom-5-italic-text-decoration-v20-0-1:none;
552
1105
  }
553
- .magritte-root___FV1tC_1-2-0{
1106
+ .magritte-root___FV1tC_2-0-0{
554
1107
  position:relative;
555
1108
  display:flex;
556
1109
  overflow:hidden;
557
1110
  border-radius:var(--magritte-static-border-radius-600-v20-0-1);
558
1111
  background-color:var(--magritte-color-background-primary-v20-0-1);
559
1112
  }
560
- .magritte-root___FV1tC_1-2-0:hover{
1113
+ .magritte-root___FV1tC_2-0-0:hover{
561
1114
  cursor:pointer;
562
1115
  }
563
- .magritte-root___FV1tC_1-2-0:hover .magritte-background___RfZ0U_1-2-0{
1116
+ .magritte-root___FV1tC_2-0-0:hover .magritte-background___RfZ0U_2-0-0{
564
1117
  border-color:var(--magritte-color-stroke-accent-v20-0-1);
565
1118
  }
566
- .magritte-root___FV1tC_1-2-0.magritte-drag-active___dihBL_1-2-0 .magritte-background___RfZ0U_1-2-0{
1119
+ .magritte-root___FV1tC_2-0-0.magritte-drag-active___dihBL_2-0-0 .magritte-background___RfZ0U_2-0-0{
567
1120
  border-color:var(--magritte-color-stroke-accent-v20-0-1);
568
1121
  }
569
- .magritte-root___FV1tC_1-2-0.focus-visible{
1122
+ .magritte-root___FV1tC_2-0-0.focus-visible{
570
1123
  outline:var(--magritte-color-stroke-state-focused-accessible-v20-0-1) solid 4px;
571
1124
  }
572
- .magritte-root___FV1tC_1-2-0.focus-visible .magritte-background___RfZ0U_1-2-0{
1125
+ .magritte-root___FV1tC_2-0-0.focus-visible .magritte-background___RfZ0U_2-0-0{
573
1126
  border-color:var(--magritte-color-stroke-accent-v20-0-1);
574
1127
  }
575
- .magritte-root___FV1tC_1-2-0.magritte-load___MghDA_1-2-0 .magritte-background___RfZ0U_1-2-0,
576
- .magritte-root___FV1tC_1-2-0.magritte-loading___9E3p-_1-2-0 .magritte-background___RfZ0U_1-2-0{
1128
+ .magritte-root___FV1tC_2-0-0.magritte-load___MghDA_2-0-0 .magritte-background___RfZ0U_2-0-0,
1129
+ .magritte-root___FV1tC_2-0-0.magritte-loading___9E3p-_2-0-0 .magritte-background___RfZ0U_2-0-0{
577
1130
  border-style:solid;
578
1131
  border-width:7px;
579
1132
  }
580
- .magritte-root___FV1tC_1-2-0.magritte-invalid___Rt10-_1-2-0.focus-visible{
1133
+ .magritte-root___FV1tC_2-0-0.magritte-invalid___Rt10-_2-0-0.focus-visible{
581
1134
  outline:var(--magritte-color-component-input-stroke-state-negative-focused-accessible-v20-0-1) solid 4px;
582
1135
  }
583
- .magritte-root___FV1tC_1-2-0.magritte-invalid___Rt10-_1-2-0 .magritte-background___RfZ0U_1-2-0{
1136
+ .magritte-root___FV1tC_2-0-0.magritte-invalid___Rt10-_2-0-0 .magritte-background___RfZ0U_2-0-0{
584
1137
  border-color:var(--magritte-color-stroke-neutral-v20-0-1);
585
1138
  }
586
- .magritte-root_medium___67WJa_1-2-0{
1139
+ .magritte-root_medium___67WJa_2-0-0{
587
1140
  justify-content:center;
588
1141
  padding:var(--magritte-static-space-600-v20-0-1);
589
1142
  }
590
- .magritte-root_medium___67WJa_1-2-0 .magritte-body___O7ROl_1-2-0{
1143
+ .magritte-root_medium___67WJa_2-0-0 .magritte-body___O7ROl_2-0-0{
591
1144
  flex-direction:column;
592
1145
  align-items:center;
593
1146
  justify-content:center;
594
1147
  }
595
- .magritte-root_small___dkUYq_1-2-0{
1148
+ .magritte-root_small___dkUYq_2-0-0{
596
1149
  padding:var(--magritte-static-space-400-v20-0-1) var(--magritte-static-space-500-v20-0-1) var(--magritte-static-space-400-v20-0-1) var(--magritte-static-space-400-v20-0-1);
597
1150
  }
598
- .magritte-root_small___dkUYq_1-2-0 .magritte-body___O7ROl_1-2-0{
1151
+ .magritte-root_small___dkUYq_2-0-0 .magritte-body___O7ROl_2-0-0{
599
1152
  width:100%;
600
1153
  gap:var(--magritte-static-space-400-v20-0-1);
601
1154
  }
602
- .magritte-background___RfZ0U_1-2-0{
1155
+ .magritte-background___RfZ0U_2-0-0{
603
1156
  position:absolute;
604
1157
  border-width:8px;
605
1158
  border-style:dashed;
@@ -612,14 +1165,15 @@
612
1165
  background-position:center;
613
1166
  background-size:100%;
614
1167
  }
615
- .magritte-body___O7ROl_1-2-0{
1168
+ .magritte-body___O7ROl_2-0-0{
616
1169
  display:flex;
1170
+ width:100%;
617
1171
  }
618
- .magritte-loader___XYpWg_1-2-0{
1172
+ .magritte-loader___XYpWg_2-0-0{
619
1173
  position:relative;
620
1174
  display:flex;
621
1175
  }
622
- .magritte-cancel___tQ-yX_1-2-0{
1176
+ .magritte-cancel___tQ-yX_2-0-0{
623
1177
  position:absolute;
624
1178
  top:0;
625
1179
  left:0;
@@ -629,19 +1183,31 @@
629
1183
  align-items:center;
630
1184
  justify-content:center;
631
1185
  }
632
- .magritte-image-controls___vLf94_1-2-0{
1186
+ .magritte-image-controls___vLf94_2-0-0{
633
1187
  display:flex;
634
1188
  position:absolute;
635
1189
  right:var(--magritte-static-space-300-v20-0-1);
636
1190
  bottom:var(--magritte-static-space-300-v20-0-1);
637
1191
  gap:var(--magritte-static-space-300-v20-0-1);
638
1192
  }
639
- .magritte-small-controls___Qn9TP_1-2-0{
1193
+ .magritte-small-controls___Qn9TP_2-0-0{
640
1194
  display:flex;
641
1195
  align-items:center;
642
1196
  margin-left:auto;
643
1197
  }
644
- .magritte-small-file-info___cMns-_1-2-0{
1198
+ .magritte-small-file-info-container___MIN5r_2-0-0{
1199
+ flex-grow:1;
1200
+ width:50px;
1201
+ }
1202
+ .magritte-small-file-info___cMns-_2-0-0{
645
1203
  display:flex;
646
1204
  gap:var(--magritte-static-space-100-v20-0-1);
1205
+ font-family:var(--magritte-typography-label-4-regular-font-family-v20-0-1);
1206
+ font-weight:var(--magritte-typography-label-4-regular-font-weight-v20-0-1);
1207
+ line-height:var(--magritte-typography-label-4-regular-line-height-v20-0-1);
1208
+ font-size:var(--magritte-typography-label-4-regular-font-size-v20-0-1);
1209
+ letter-spacing:var(--magritte-typography-label-4-regular-letter-spacing-v20-0-1);
1210
+ text-indent:var(--magritte-typography-label-4-regular-text-indent-v20-0-1);
1211
+ text-transform:var(--magritte-typography-label-4-regular-text-transform-v20-0-1);
1212
+ text-decoration:var(--magritte-typography-label-4-regular-text-decoration-v20-0-1);
647
1213
  }
package/index.js CHANGED
@@ -10,5 +10,6 @@ import '@hh.ru/magritte-ui-icon/icon';
10
10
  import '@hh.ru/magritte-ui-loader';
11
11
  import '@hh.ru/magritte-ui-spacing';
12
12
  import '@hh.ru/magritte-ui-typography';
13
+ import './FileName.js';
13
14
  import './utils.js';
14
15
  //# sourceMappingURL=index.js.map
package/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;"}
1
+ {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@hh.ru/magritte-ui-upload",
3
- "version": "1.2.0",
3
+ "version": "2.0.0",
4
4
  "main": "index.js",
5
5
  "types": "index.d.ts",
6
6
  "sideEffects": [
@@ -36,5 +36,5 @@
36
36
  "@hh.ru/magritte-ui-typography": "3.0.22",
37
37
  "react-dropzone": "14.3.5"
38
38
  },
39
- "gitHead": "b341cdeb2e54dcbbb25e420ad3a5c23e50362e5c"
39
+ "gitHead": "e95d78ab1b3938b0db634e8e13c914877b35ccc5"
40
40
  }
package/types.d.ts CHANGED
@@ -21,13 +21,12 @@ interface UploadTrls {
21
21
  type DropzoneOptionsHepler = Omit<DropzoneOptions, 'onDropAccepted' | 'onDropRejected'>;
22
22
  export interface UploadProps extends DropzoneOptionsHepler {
23
23
  files: LoadedFile[];
24
+ trls: UploadTrls;
24
25
  size?: UploadSize;
25
26
  multiple?: boolean;
26
- selectFileButton: ButtonElement;
27
+ selectFileButton?: ButtonElement;
27
28
  deleteFileButton?: ButtonElement;
28
29
  replaceImageButton?: ButtonElement;
29
- deleteImageButton?: ButtonElement;
30
- trls: UploadTrls;
31
30
  onFileDelete: (loadedFile: LoadedFile, fileIndex: number) => void;
32
31
  onDropAccepted: (files: LoadedFile[], event: DropEvent) => void;
33
32
  onDropRejected?: (files: LoadedFile[], event: DropEvent) => void;