@hh.ru/magritte-ui-upload 3.2.13 → 3.2.14

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/FileName.js CHANGED
@@ -2,7 +2,7 @@ import './index.css';
2
2
  import { jsxs, jsx } from 'react/jsx-runtime';
3
3
  import classnames from 'classnames';
4
4
 
5
- var styles = {"file-name-body":"magritte-file-name-body___PTTMc_3-2-13","fileNameBody":"magritte-file-name-body___PTTMc_3-2-13","file-name-body_medium":"magritte-file-name-body_medium___sfmmq_3-2-13","fileNameBodyMedium":"magritte-file-name-body_medium___sfmmq_3-2-13","file-name":"magritte-file-name___ZSL2g_3-2-13","fileName":"magritte-file-name___ZSL2g_3-2-13"};
5
+ var styles = {"file-name-body":"magritte-file-name-body___PTTMc_3-2-14","fileNameBody":"magritte-file-name-body___PTTMc_3-2-14","file-name-body_medium":"magritte-file-name-body_medium___sfmmq_3-2-14","fileNameBodyMedium":"magritte-file-name-body_medium___sfmmq_3-2-14","file-name":"magritte-file-name___ZSL2g_3-2-14","fileName":"magritte-file-name___ZSL2g_3-2-14"};
6
6
 
7
7
  const parse = (file) => {
8
8
  const name = file.name;
package/FileView.js CHANGED
@@ -10,13 +10,13 @@ import { FileName } from './FileName.js';
10
10
  import { getUploadIcon, bytes2mb } from './utils.js';
11
11
  import 'classnames';
12
12
 
13
- var styles = {"file-info-body":"magritte-file-info-body___HmfXd_3-2-13","fileInfoBody":"magritte-file-info-body___HmfXd_3-2-13","file-info-and-controls":"magritte-file-info-and-controls___61iyY_3-2-13","fileInfoAndControls":"magritte-file-info-and-controls___61iyY_3-2-13","file-info-container":"magritte-file-info-container___WFab8_3-2-13","fileInfoContainer":"magritte-file-info-container___WFab8_3-2-13","file-info":"magritte-file-info___HrqiB_3-2-13","fileInfo":"magritte-file-info___HrqiB_3-2-13","controls":"magritte-controls___WdH7A_3-2-13"};
13
+ var styles = {"file-info-body":"magritte-file-info-body___HmfXd_3-2-14","fileInfoBody":"magritte-file-info-body___HmfXd_3-2-14","file-info-and-controls":"magritte-file-info-and-controls___61iyY_3-2-14","fileInfoAndControls":"magritte-file-info-and-controls___61iyY_3-2-14","file-info-container":"magritte-file-info-container___WFab8_3-2-14","fileInfoContainer":"magritte-file-info-container___WFab8_3-2-14","file-info":"magritte-file-info___HrqiB_3-2-14","fileInfo":"magritte-file-info___HrqiB_3-2-14","controls":"magritte-controls___WdH7A_3-2-14"};
14
14
 
15
15
  const FileView = ({ uploadType, loadedFile, preview, renderFileInfo, onFileDelete, 'aria-label': ariaLabel, isLast = false, }) => {
16
16
  const isLoading = Boolean(loadedFile?.loading);
17
17
  const isInvalid = Boolean(loadedFile?.error);
18
18
  const isImageType = uploadType === 'image';
19
- return (jsxs(Fragment, { children: [jsx(Avatar, { mode: isImageType && !isLoading && !isInvalid ? 'image' : 'icon', style: "secondary", image: preview, size: 48, icon: getUploadIcon(uploadType, loadedFile, true), "aria-label": ariaLabel }), jsxs("div", { className: styles.fileInfoBody, children: [jsxs("div", { className: styles.fileInfoAndControls, children: [jsxs("div", { className: styles.fileInfoContainer, children: [jsx(FileName, { file: loadedFile.data }), jsx(VSpacing, { default: 4 }), jsxs("div", { className: styles.fileInfo, children: [isInvalid && jsx(ExclamationTriangleOutlinedSize16, { initial: "negative" }), isLoading && jsx(Loader, { size: 16 }), !isInvalid && !isLoading && jsx(CheckCircleOutlinedSize16, { initial: "positive" }), renderFileInfo({
19
+ return (jsxs(Fragment, { children: [jsx(Avatar, { mode: isImageType && !isLoading && !isInvalid ? 'image' : 'icon', style: "secondary", image: preview, size: 48, icon: getUploadIcon(uploadType, loadedFile, true), "aria-label": ariaLabel }), jsxs("div", { className: styles.fileInfoBody, children: [jsxs("div", { className: styles.fileInfoAndControls, children: [jsxs("div", { className: styles.fileInfoContainer, children: [jsx(FileName, { file: loadedFile.data }), jsx(VSpacing, { default: 4 }), jsxs("div", { className: styles.fileInfo, children: [isInvalid && jsx(ExclamationTriangleOutlinedSize16, { initialColor: "negative" }), isLoading && jsx(Loader, { size: 16 }), !isInvalid && !isLoading && jsx(CheckCircleOutlinedSize16, { initialColor: "positive" }), renderFileInfo({
20
20
  ...loadedFile,
21
21
  fileSizeMB: bytes2mb(loadedFile.data.size),
22
22
  })] })] }), jsxs("div", { className: styles.controls, children: [isLoading && jsx(Action, { icon: CrossOutlinedSize24, mode: "secondary", onClick: onFileDelete }), !isLoading && (jsx(Action, { icon: TrashOutlinedSize24, mode: "secondary", onClick: onFileDelete, "data-qa": "magritte-upload-delete-file-action" }))] })] }), !isLast && (jsxs("div", { children: [jsx(VSpacing, { default: 16 }), jsx(Divider, {}), jsx(VSpacing, { default: 16 })] }))] })] }));
package/FileView.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"FileView.js","sources":["../src/FileView.tsx"],"sourcesContent":["import { ReactElement, MouseEvent } from 'react';\n\nimport { Action } from '@hh.ru/magritte-ui-action';\nimport { Avatar } from '@hh.ru/magritte-ui-avatar';\nimport { Divider } from '@hh.ru/magritte-ui-divider';\nimport {\n CrossOutlinedSize24,\n CheckCircleOutlinedSize16,\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 { FileName } from '@hh.ru/magritte-ui-upload/FileName';\nimport { UploadType, LoadedFile, RenderFileInfo } from '@hh.ru/magritte-ui-upload/types';\nimport { getUploadIcon, bytes2mb } from '@hh.ru/magritte-ui-upload/utils';\n\nimport styles from './file-view.less';\n\nexport interface FileViewProps {\n uploadType: UploadType;\n loadedFile: LoadedFile;\n renderFileInfo: RenderFileInfo;\n onFileDelete: (event: MouseEvent) => void;\n preview: string;\n 'aria-label': string;\n isLast?: boolean;\n}\n\nconst FileView = ({\n uploadType,\n loadedFile,\n preview,\n renderFileInfo,\n onFileDelete,\n 'aria-label': ariaLabel,\n isLast = false,\n}: FileViewProps): ReactElement => {\n const isLoading = Boolean(loadedFile?.loading);\n const isInvalid = Boolean(loadedFile?.error);\n const isImageType = uploadType === 'image';\n return (\n <>\n <Avatar\n mode={isImageType && !isLoading && !isInvalid ? 'image' : 'icon'}\n style=\"secondary\"\n image={preview}\n size={48}\n icon={getUploadIcon(uploadType, loadedFile, true)}\n aria-label={ariaLabel}\n />\n <div className={styles.fileInfoBody}>\n <div className={styles.fileInfoAndControls}>\n <div className={styles.fileInfoContainer}>\n <FileName file={loadedFile.data} />\n <VSpacing default={4} />\n <div className={styles.fileInfo}>\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.controls}>\n {isLoading && <Action icon={CrossOutlinedSize24} mode=\"secondary\" onClick={onFileDelete} />}\n {!isLoading && (\n <Action\n icon={TrashOutlinedSize24}\n mode=\"secondary\"\n onClick={onFileDelete}\n data-qa=\"magritte-upload-delete-file-action\"\n />\n )}\n </div>\n </div>\n {!isLast && (\n <div>\n <VSpacing default={16} />\n <Divider />\n <VSpacing default={16} />\n </div>\n )}\n </div>\n </>\n );\n};\n\nexport { FileView };\n"],"names":["_jsxs","_Fragment","_jsx"],"mappings":";;;;;;;;;;;;;AA6BM,MAAA,QAAQ,GAAG,CAAC,EACd,UAAU,EACV,UAAU,EACV,OAAO,EACP,cAAc,EACd,YAAY,EACZ,YAAY,EAAE,SAAS,EACvB,MAAM,GAAG,KAAK,GACF,KAAkB;IAC9B,MAAM,SAAS,GAAG,OAAO,CAAC,UAAU,EAAE,OAAO,CAAC,CAAC;IAC/C,MAAM,SAAS,GAAG,OAAO,CAAC,UAAU,EAAE,KAAK,CAAC,CAAC;AAC7C,IAAA,MAAM,WAAW,GAAG,UAAU,KAAK,OAAO,CAAC;AAC3C,IAAA,QACIA,IAAA,CAAAC,QAAA,EAAA,EAAA,QAAA,EAAA,CACIC,GAAC,CAAA,MAAM,EACH,EAAA,IAAI,EAAE,WAAW,IAAI,CAAC,SAAS,IAAI,CAAC,SAAS,GAAG,OAAO,GAAG,MAAM,EAChE,KAAK,EAAC,WAAW,EACjB,KAAK,EAAE,OAAO,EACd,IAAI,EAAE,EAAE,EACR,IAAI,EAAE,aAAa,CAAC,UAAU,EAAE,UAAU,EAAE,IAAI,CAAC,gBACrC,SAAS,EAAA,CACvB,EACFF,IAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,MAAM,CAAC,YAAY,EAAA,QAAA,EAAA,CAC/BA,IAAK,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,MAAM,CAAC,mBAAmB,aACtCA,IAAK,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,MAAM,CAAC,iBAAiB,EACpC,QAAA,EAAA,CAAAE,GAAA,CAAC,QAAQ,EAAA,EAAC,IAAI,EAAE,UAAU,CAAC,IAAI,EAAA,CAAI,EACnCA,GAAA,CAAC,QAAQ,EAAA,EAAC,OAAO,EAAE,CAAC,EAAA,CAAI,EACxBF,IAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,MAAM,CAAC,QAAQ,EAAA,QAAA,EAAA,CAC1B,SAAS,IAAIE,GAAA,CAAC,iCAAiC,EAAA,EAAC,OAAO,EAAC,UAAU,EAAA,CAAG,EACrE,SAAS,IAAIA,GAAA,CAAC,MAAM,EAAA,EAAC,IAAI,EAAE,EAAE,EAAI,CAAA,EACjC,CAAC,SAAS,IAAI,CAAC,SAAS,IAAIA,GAAC,CAAA,yBAAyB,EAAC,EAAA,OAAO,EAAC,UAAU,EAAG,CAAA,EAC5E,cAAc,CAAC;AACZ,gDAAA,GAAG,UAAU;gDACb,UAAU,EAAE,QAAQ,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC;AAC7C,6CAAA,CAAC,IACA,CACJ,EAAA,CAAA,EACNF,IAAK,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,MAAM,CAAC,QAAQ,EAAA,QAAA,EAAA,CAC1B,SAAS,IAAIE,GAAA,CAAC,MAAM,EAAC,EAAA,IAAI,EAAE,mBAAmB,EAAE,IAAI,EAAC,WAAW,EAAC,OAAO,EAAE,YAAY,EAAA,CAAI,EAC1F,CAAC,SAAS,KACPA,IAAC,MAAM,EAAA,EACH,IAAI,EAAE,mBAAmB,EACzB,IAAI,EAAC,WAAW,EAChB,OAAO,EAAE,YAAY,EACb,SAAA,EAAA,oCAAoC,GAC9C,CACL,CAAA,EAAA,CACC,CACJ,EAAA,CAAA,EACL,CAAC,MAAM,KACJF,IACI,CAAA,KAAA,EAAA,EAAA,QAAA,EAAA,CAAAE,GAAA,CAAC,QAAQ,EAAC,EAAA,OAAO,EAAE,EAAE,GAAI,EACzBA,GAAA,CAAC,OAAO,EAAG,EAAA,CAAA,EACXA,IAAC,QAAQ,EAAA,EAAC,OAAO,EAAE,EAAE,EAAI,CAAA,CAAA,EAAA,CACvB,CACT,CACC,EAAA,CAAA,CAAA,EAAA,CACP,EACL;AACN;;;;"}
1
+ {"version":3,"file":"FileView.js","sources":["../src/FileView.tsx"],"sourcesContent":["import { ReactElement, MouseEvent } from 'react';\n\nimport { Action } from '@hh.ru/magritte-ui-action';\nimport { Avatar } from '@hh.ru/magritte-ui-avatar';\nimport { Divider } from '@hh.ru/magritte-ui-divider';\nimport {\n CrossOutlinedSize24,\n CheckCircleOutlinedSize16,\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 { FileName } from '@hh.ru/magritte-ui-upload/FileName';\nimport { UploadType, LoadedFile, RenderFileInfo } from '@hh.ru/magritte-ui-upload/types';\nimport { getUploadIcon, bytes2mb } from '@hh.ru/magritte-ui-upload/utils';\n\nimport styles from './file-view.less';\n\nexport interface FileViewProps {\n uploadType: UploadType;\n loadedFile: LoadedFile;\n renderFileInfo: RenderFileInfo;\n onFileDelete: (event: MouseEvent) => void;\n preview: string;\n 'aria-label': string;\n isLast?: boolean;\n}\n\nconst FileView = ({\n uploadType,\n loadedFile,\n preview,\n renderFileInfo,\n onFileDelete,\n 'aria-label': ariaLabel,\n isLast = false,\n}: FileViewProps): ReactElement => {\n const isLoading = Boolean(loadedFile?.loading);\n const isInvalid = Boolean(loadedFile?.error);\n const isImageType = uploadType === 'image';\n return (\n <>\n <Avatar\n mode={isImageType && !isLoading && !isInvalid ? 'image' : 'icon'}\n style=\"secondary\"\n image={preview}\n size={48}\n icon={getUploadIcon(uploadType, loadedFile, true)}\n aria-label={ariaLabel}\n />\n <div className={styles.fileInfoBody}>\n <div className={styles.fileInfoAndControls}>\n <div className={styles.fileInfoContainer}>\n <FileName file={loadedFile.data} />\n <VSpacing default={4} />\n <div className={styles.fileInfo}>\n {isInvalid && <ExclamationTriangleOutlinedSize16 initialColor=\"negative\" />}\n {isLoading && <Loader size={16} />}\n {!isInvalid && !isLoading && <CheckCircleOutlinedSize16 initialColor=\"positive\" />}\n {renderFileInfo({\n ...loadedFile,\n fileSizeMB: bytes2mb(loadedFile.data.size),\n })}\n </div>\n </div>\n <div className={styles.controls}>\n {isLoading && <Action icon={CrossOutlinedSize24} mode=\"secondary\" onClick={onFileDelete} />}\n {!isLoading && (\n <Action\n icon={TrashOutlinedSize24}\n mode=\"secondary\"\n onClick={onFileDelete}\n data-qa=\"magritte-upload-delete-file-action\"\n />\n )}\n </div>\n </div>\n {!isLast && (\n <div>\n <VSpacing default={16} />\n <Divider />\n <VSpacing default={16} />\n </div>\n )}\n </div>\n </>\n );\n};\n\nexport { FileView };\n"],"names":["_jsxs","_Fragment","_jsx"],"mappings":";;;;;;;;;;;;;AA6BM,MAAA,QAAQ,GAAG,CAAC,EACd,UAAU,EACV,UAAU,EACV,OAAO,EACP,cAAc,EACd,YAAY,EACZ,YAAY,EAAE,SAAS,EACvB,MAAM,GAAG,KAAK,GACF,KAAkB;IAC9B,MAAM,SAAS,GAAG,OAAO,CAAC,UAAU,EAAE,OAAO,CAAC,CAAC;IAC/C,MAAM,SAAS,GAAG,OAAO,CAAC,UAAU,EAAE,KAAK,CAAC,CAAC;AAC7C,IAAA,MAAM,WAAW,GAAG,UAAU,KAAK,OAAO,CAAC;AAC3C,IAAA,QACIA,IAAA,CAAAC,QAAA,EAAA,EAAA,QAAA,EAAA,CACIC,GAAC,CAAA,MAAM,EACH,EAAA,IAAI,EAAE,WAAW,IAAI,CAAC,SAAS,IAAI,CAAC,SAAS,GAAG,OAAO,GAAG,MAAM,EAChE,KAAK,EAAC,WAAW,EACjB,KAAK,EAAE,OAAO,EACd,IAAI,EAAE,EAAE,EACR,IAAI,EAAE,aAAa,CAAC,UAAU,EAAE,UAAU,EAAE,IAAI,CAAC,gBACrC,SAAS,EAAA,CACvB,EACFF,IAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,MAAM,CAAC,YAAY,EAAA,QAAA,EAAA,CAC/BA,IAAK,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,MAAM,CAAC,mBAAmB,aACtCA,IAAK,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,MAAM,CAAC,iBAAiB,EACpC,QAAA,EAAA,CAAAE,GAAA,CAAC,QAAQ,EAAA,EAAC,IAAI,EAAE,UAAU,CAAC,IAAI,EAAA,CAAI,EACnCA,GAAA,CAAC,QAAQ,EAAA,EAAC,OAAO,EAAE,CAAC,EAAA,CAAI,EACxBF,IAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,MAAM,CAAC,QAAQ,EAAA,QAAA,EAAA,CAC1B,SAAS,IAAIE,GAAA,CAAC,iCAAiC,EAAA,EAAC,YAAY,EAAC,UAAU,EAAA,CAAG,EAC1E,SAAS,IAAIA,GAAA,CAAC,MAAM,EAAA,EAAC,IAAI,EAAE,EAAE,EAAI,CAAA,EACjC,CAAC,SAAS,IAAI,CAAC,SAAS,IAAIA,GAAC,CAAA,yBAAyB,EAAC,EAAA,YAAY,EAAC,UAAU,EAAG,CAAA,EACjF,cAAc,CAAC;AACZ,gDAAA,GAAG,UAAU;gDACb,UAAU,EAAE,QAAQ,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC;AAC7C,6CAAA,CAAC,IACA,CACJ,EAAA,CAAA,EACNF,IAAK,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,MAAM,CAAC,QAAQ,EAAA,QAAA,EAAA,CAC1B,SAAS,IAAIE,GAAA,CAAC,MAAM,EAAC,EAAA,IAAI,EAAE,mBAAmB,EAAE,IAAI,EAAC,WAAW,EAAC,OAAO,EAAE,YAAY,EAAA,CAAI,EAC1F,CAAC,SAAS,KACPA,IAAC,MAAM,EAAA,EACH,IAAI,EAAE,mBAAmB,EACzB,IAAI,EAAC,WAAW,EAChB,OAAO,EAAE,YAAY,EACb,SAAA,EAAA,oCAAoC,GAC9C,CACL,CAAA,EAAA,CACC,CACJ,EAAA,CAAA,EACL,CAAC,MAAM,KACJF,IACI,CAAA,KAAA,EAAA,EAAA,QAAA,EAAA,CAAAE,GAAA,CAAC,QAAQ,EAAC,EAAA,OAAO,EAAE,EAAE,GAAI,EACzBA,GAAA,CAAC,OAAO,EAAG,EAAA,CAAA,EACXA,IAAC,QAAQ,EAAA,EAAC,OAAO,EAAE,EAAE,EAAI,CAAA,CAAA,EAAA,CACvB,CACT,CACC,EAAA,CAAA,CAAA,EAAA,CACP,EACL;AACN;;;;"}
@@ -13,7 +13,7 @@ import './FileName.js';
13
13
  import 'classnames';
14
14
  import 'react';
15
15
 
16
- var styles = {"item":"magritte-item___vVDG-_3-2-13"};
16
+ var styles = {"item":"magritte-item___vVDG-_3-2-14"};
17
17
 
18
18
  const FileViewWithPreview = ({ loadedFile, ...otherProps }) => {
19
19
  const uploadType = getFileType(loadedFile.data.type);
package/MultiUpload.js CHANGED
@@ -8,7 +8,7 @@ import { Placeholder } from './Placeholder.js';
8
8
  import { useDropActions } from './useDropActions.js';
9
9
  import { useDropButtons } from './useDropButtons.js';
10
10
  import { getAvaliableFileTypes, getUploadIcon, DEFAULT_ACCEPT, RenderFileInfoDefault } from './utils.js';
11
- import { s as styles } from './upload-0nSYx5lz.js';
11
+ import { s as styles } from './upload-C-Nas2hq.js';
12
12
  import './FileView.js';
13
13
  import '@hh.ru/magritte-ui-action';
14
14
  import '@hh.ru/magritte-ui-avatar';
package/SingleUpload.js CHANGED
@@ -15,7 +15,7 @@ import { useDropActions } from './useDropActions.js';
15
15
  import { useDropButtons } from './useDropButtons.js';
16
16
  import { useFilePreview } from './useFilePreview.js';
17
17
  import { getAvaliableFileTypes, getUploadIcon, bytes2mb, DEFAULT_ACCEPT, RenderFileInfoDefault } from './utils.js';
18
- import { s as styles } from './upload-0nSYx5lz.js';
18
+ import { s as styles } from './upload-C-Nas2hq.js';
19
19
  import '@hh.ru/magritte-ui-action';
20
20
  import '@hh.ru/magritte-ui-divider';
21
21
  import '@hh.ru/magritte-ui-breakpoint';
@@ -70,9 +70,9 @@ const SingleUpload = ({ files, trls, size = 'medium', accept = DEFAULT_ACCEPT, s
70
70
  : {};
71
71
  return (jsxs("div", { className: classnames(styles.root, styles[`root_${size}`], { [styles.dragActive]: isDragActive }, { [styles.loading]: isLoading }, { [styles.load]: isLoad }, { [styles.invalid]: isInvalid }), ...getRootProps(), "data-qa": "magritte-single-upload", children: [jsx("input", { ...getInputProps(), "data-qa": "magritte-single-upload-input" }), jsx("div", { className: styles.background, style: backgroundStyles, "data-qa": "magritte-single-upload-background" }), jsxs("div", { className: styles.body, ref: bodyUploadRef, children: [isSizeSmall && (jsxs(Fragment, { children: [loadedFile && (jsx(FileView, { uploadType: uploadType, loadedFile: loadedFile, renderFileInfo: renderFileInfo, onFileDelete: (event) => {
72
72
  onFileDelete(event, loadedFile, 0);
73
- }, preview: preview, "aria-label": ariaLabel || '', isLast: true })), !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) => {
73
+ }, preview: preview, "aria-label": ariaLabel || '', isLast: true })), !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, { initialColor: "accent", onClick: (event) => {
74
74
  onFileDelete(event, loadedFile, 0);
75
- } }) })] })), isInvalid ? (jsx(ExclamationTriangleOutlinedSize32, { initial: "negative" })) : (!usePreview && getUploadIcon(uploadType, loadedFile, false)), jsx(VSpacing, { default: 16 }), loadedFile && (jsxs(Fragment, { children: [!usePreview && (jsxs(Fragment, { children: [jsx(FileName, { file: loadedFile.data, isSizeMedium: true }), jsx(VSpacing, { default: 6 }), jsx(Text, { typography: "label-4-regular", style: "secondary", children: renderFileInfo({
75
+ } }) })] })), isInvalid ? (jsx(ExclamationTriangleOutlinedSize32, { initialColor: "negative" })) : (!usePreview && getUploadIcon(uploadType, loadedFile, false)), jsx(VSpacing, { default: 16 }), loadedFile && (jsxs(Fragment, { children: [!usePreview && (jsxs(Fragment, { children: [jsx(FileName, { file: loadedFile.data, isSizeMedium: true }), jsx(VSpacing, { default: 6 }), jsx(Text, { typography: "label-4-regular", style: "secondary", children: renderFileInfo({
76
76
  ...loadedFile,
77
77
  fileSizeMB: bytes2mb(loadedFile.data.size),
78
78
  }) })] })), !isLoading && (!isImageType || isInvalid) && deleteFileButton && (jsxs(Fragment, { children: [jsx(VSpacing, { default: 16 }), deleteFileButton] })), !isLoading &&
@@ -1 +1 @@
1
- {"version":3,"file":"SingleUpload.js","sources":["../src/SingleUpload.tsx"],"sourcesContent":["import { ReactElement, useRef, useEffect, MouseEvent } from 'react';\nimport { useDropzone } from 'react-dropzone';\nimport classnames from 'classnames';\n\nimport { Avatar } from '@hh.ru/magritte-ui-avatar';\nimport { CrossOutlinedSize24, ExclamationTriangleOutlinedSize32 } 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 { FileView } from '@hh.ru/magritte-ui-upload/FileView';\nimport { Placeholder } from '@hh.ru/magritte-ui-upload/Placeholder';\nimport { UploadProps } from '@hh.ru/magritte-ui-upload/types';\nimport { useDropActions } from '@hh.ru/magritte-ui-upload/useDropActions';\nimport { useDropButtons } from '@hh.ru/magritte-ui-upload/useDropButtons';\nimport { useFilePreview } from '@hh.ru/magritte-ui-upload/useFilePreview';\nimport {\n getUploadIcon,\n bytes2mb,\n getAvaliableFileTypes,\n RenderFileInfoDefault,\n DEFAULT_ACCEPT,\n} from '@hh.ru/magritte-ui-upload/utils';\n\nimport styles from './upload.less';\n\nconst SingleUpload = ({\n files,\n trls,\n size = 'medium',\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 const preview = useFilePreview({ loadedFile, isImageType });\n const usePreview = preview !== 'none';\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, onDropRejected, onFileDelete } = useDropActions({\n onDropAccepted: onDropAcceptedExternal,\n onDropRejected: onDropRejectedExternal,\n onFileDelete: onFileDeleteExternal,\n });\n const { getRootProps, getInputProps, isDragActive } = useDropzone({\n ...dropzoneProps,\n accept,\n onDropAccepted,\n onDropRejected,\n multiple: false,\n });\n\n const { selectFileButton, deleteFileButton, replaceImageButton } = useDropButtons({\n selectFileButton: _selectFileButton,\n deleteFileButton: _deleteFileButton,\n replaceImageButton: _replaceImageButton,\n onFileDelete: (event: MouseEvent) => {\n onFileDelete(event, loadedFile, 0);\n },\n });\n\n const backgroundStyles = !isSizeSmall\n ? { backgroundImage: preview !== 'none' ? `url('${preview}')` : preview }\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 data-qa=\"magritte-single-upload\"\n >\n <input {...getInputProps()} data-qa=\"magritte-single-upload-input\" />\n <div className={styles.background} style={backgroundStyles} data-qa=\"magritte-single-upload-background\" />\n <div className={styles.body} ref={bodyUploadRef}>\n {isSizeSmall && (\n <>\n {loadedFile && (\n <FileView\n uploadType={uploadType}\n loadedFile={loadedFile}\n renderFileInfo={renderFileInfo}\n onFileDelete={(event) => {\n onFileDelete(event, loadedFile, 0);\n }}\n preview={preview}\n aria-label={ariaLabel || ''}\n isLast\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 || ''}\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, loadedFile, 0);\n }}\n />\n </div>\n </div>\n )}\n {isInvalid ? (\n <ExclamationTriangleOutlinedSize32 initial=\"negative\" />\n ) : (\n !usePreview && getUploadIcon(uploadType, loadedFile, false)\n )}\n <VSpacing default={16} />\n {loadedFile && (\n <>\n {!usePreview && (\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 </>\n )}\n {!isLoading && (!isImageType || isInvalid) && deleteFileButton && (\n <>\n <VSpacing default={16} />\n {deleteFileButton}\n </>\n )}\n {!isLoading &&\n isImageType &&\n !isInvalid &&\n (replaceImageButton || deleteFileButton) && (\n <div className={styles.imageControls}>\n {replaceImageButton}\n {deleteFileButton}\n </div>\n )}\n </>\n )}\n {!loadedFile && <Placeholder trls={trls} selectFileButton={selectFileButton} />}\n </>\n )}\n </div>\n </div>\n );\n};\n\nexport { SingleUpload };\n"],"names":["_jsxs","_jsx","_Fragment"],"mappings":"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"}
1
+ {"version":3,"file":"SingleUpload.js","sources":["../src/SingleUpload.tsx"],"sourcesContent":["import { ReactElement, useRef, useEffect, MouseEvent } from 'react';\nimport { useDropzone } from 'react-dropzone';\nimport classnames from 'classnames';\n\nimport { Avatar } from '@hh.ru/magritte-ui-avatar';\nimport { CrossOutlinedSize24, ExclamationTriangleOutlinedSize32 } 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 { FileView } from '@hh.ru/magritte-ui-upload/FileView';\nimport { Placeholder } from '@hh.ru/magritte-ui-upload/Placeholder';\nimport { UploadProps } from '@hh.ru/magritte-ui-upload/types';\nimport { useDropActions } from '@hh.ru/magritte-ui-upload/useDropActions';\nimport { useDropButtons } from '@hh.ru/magritte-ui-upload/useDropButtons';\nimport { useFilePreview } from '@hh.ru/magritte-ui-upload/useFilePreview';\nimport {\n getUploadIcon,\n bytes2mb,\n getAvaliableFileTypes,\n RenderFileInfoDefault,\n DEFAULT_ACCEPT,\n} from '@hh.ru/magritte-ui-upload/utils';\n\nimport styles from './upload.less';\n\nconst SingleUpload = ({\n files,\n trls,\n size = 'medium',\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 const preview = useFilePreview({ loadedFile, isImageType });\n const usePreview = preview !== 'none';\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, onDropRejected, onFileDelete } = useDropActions({\n onDropAccepted: onDropAcceptedExternal,\n onDropRejected: onDropRejectedExternal,\n onFileDelete: onFileDeleteExternal,\n });\n const { getRootProps, getInputProps, isDragActive } = useDropzone({\n ...dropzoneProps,\n accept,\n onDropAccepted,\n onDropRejected,\n multiple: false,\n });\n\n const { selectFileButton, deleteFileButton, replaceImageButton } = useDropButtons({\n selectFileButton: _selectFileButton,\n deleteFileButton: _deleteFileButton,\n replaceImageButton: _replaceImageButton,\n onFileDelete: (event: MouseEvent) => {\n onFileDelete(event, loadedFile, 0);\n },\n });\n\n const backgroundStyles = !isSizeSmall\n ? { backgroundImage: preview !== 'none' ? `url('${preview}')` : preview }\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 data-qa=\"magritte-single-upload\"\n >\n <input {...getInputProps()} data-qa=\"magritte-single-upload-input\" />\n <div className={styles.background} style={backgroundStyles} data-qa=\"magritte-single-upload-background\" />\n <div className={styles.body} ref={bodyUploadRef}>\n {isSizeSmall && (\n <>\n {loadedFile && (\n <FileView\n uploadType={uploadType}\n loadedFile={loadedFile}\n renderFileInfo={renderFileInfo}\n onFileDelete={(event) => {\n onFileDelete(event, loadedFile, 0);\n }}\n preview={preview}\n aria-label={ariaLabel || ''}\n isLast\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 || ''}\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 initialColor=\"accent\"\n onClick={(event) => {\n onFileDelete(event, loadedFile, 0);\n }}\n />\n </div>\n </div>\n )}\n {isInvalid ? (\n <ExclamationTriangleOutlinedSize32 initialColor=\"negative\" />\n ) : (\n !usePreview && getUploadIcon(uploadType, loadedFile, false)\n )}\n <VSpacing default={16} />\n {loadedFile && (\n <>\n {!usePreview && (\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 </>\n )}\n {!isLoading && (!isImageType || isInvalid) && deleteFileButton && (\n <>\n <VSpacing default={16} />\n {deleteFileButton}\n </>\n )}\n {!isLoading &&\n isImageType &&\n !isInvalid &&\n (replaceImageButton || deleteFileButton) && (\n <div className={styles.imageControls}>\n {replaceImageButton}\n {deleteFileButton}\n </div>\n )}\n </>\n )}\n {!loadedFile && <Placeholder trls={trls} selectFileButton={selectFileButton} />}\n </>\n )}\n </div>\n </div>\n );\n};\n\nexport { SingleUpload };\n"],"names":["_jsxs","_jsx","_Fragment"],"mappings":"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"}
package/Upload.js CHANGED
@@ -21,7 +21,7 @@ import '@hh.ru/magritte-ui-breakpoint';
21
21
  import '@hh.ru/magritte-ui-typography';
22
22
  import './useDropActions.js';
23
23
  import './useDropButtons.js';
24
- import './upload-0nSYx5lz.js';
24
+ import './upload-C-Nas2hq.js';
25
25
 
26
26
  const Upload = ({ multiple, noDragEventsBubbling = true, ...uploadProps }) => {
27
27
  if (multiple) {
package/index.css CHANGED
@@ -1,178 +1,178 @@
1
1
  :root{
2
- --magritte-typography-label-2-regular-font-family-v21-3-0:"hh sans";
3
- --magritte-typography-label-2-regular-font-weight-v21-3-0:400;
4
- --magritte-typography-label-2-regular-line-height-v21-3-0:22px;
5
- --magritte-typography-label-2-regular-font-size-v21-3-0:16px;
6
- --magritte-typography-label-2-regular-letter-spacing-v21-3-0:0em;
7
- --magritte-typography-label-2-regular-text-indent-v21-3-0:0px;
8
- --magritte-typography-label-2-regular-text-transform-v21-3-0:none;
9
- --magritte-typography-label-2-regular-text-decoration-v21-3-0:none;
10
- }
11
- .magritte-file-name-body___PTTMc_3-2-13{
2
+ --magritte-typography-label-2-regular-font-family-v21-3-1:"hh sans";
3
+ --magritte-typography-label-2-regular-font-weight-v21-3-1:400;
4
+ --magritte-typography-label-2-regular-line-height-v21-3-1:22px;
5
+ --magritte-typography-label-2-regular-font-size-v21-3-1:16px;
6
+ --magritte-typography-label-2-regular-letter-spacing-v21-3-1:0em;
7
+ --magritte-typography-label-2-regular-text-indent-v21-3-1:0px;
8
+ --magritte-typography-label-2-regular-text-transform-v21-3-1:none;
9
+ --magritte-typography-label-2-regular-text-decoration-v21-3-1:none;
10
+ }
11
+ .magritte-file-name-body___PTTMc_3-2-14{
12
12
  display:flex;
13
13
  width:100%;
14
14
  overflow:hidden;
15
- font-family:var(--magritte-typography-label-2-regular-font-family-v21-3-0);
16
- font-weight:var(--magritte-typography-label-2-regular-font-weight-v21-3-0);
17
- line-height:var(--magritte-typography-label-2-regular-line-height-v21-3-0);
18
- font-size:var(--magritte-typography-label-2-regular-font-size-v21-3-0);
19
- letter-spacing:var(--magritte-typography-label-2-regular-letter-spacing-v21-3-0);
20
- text-indent:var(--magritte-typography-label-2-regular-text-indent-v21-3-0);
21
- text-transform:var(--magritte-typography-label-2-regular-text-transform-v21-3-0);
22
- text-decoration:var(--magritte-typography-label-2-regular-text-decoration-v21-3-0);
23
- }
24
- .magritte-file-name-body_medium___sfmmq_3-2-13{
15
+ font-family:var(--magritte-typography-label-2-regular-font-family-v21-3-1);
16
+ font-weight:var(--magritte-typography-label-2-regular-font-weight-v21-3-1);
17
+ line-height:var(--magritte-typography-label-2-regular-line-height-v21-3-1);
18
+ font-size:var(--magritte-typography-label-2-regular-font-size-v21-3-1);
19
+ letter-spacing:var(--magritte-typography-label-2-regular-letter-spacing-v21-3-1);
20
+ text-indent:var(--magritte-typography-label-2-regular-text-indent-v21-3-1);
21
+ text-transform:var(--magritte-typography-label-2-regular-text-transform-v21-3-1);
22
+ text-decoration:var(--magritte-typography-label-2-regular-text-decoration-v21-3-1);
23
+ }
24
+ .magritte-file-name-body_medium___sfmmq_3-2-14{
25
25
  justify-content:center;
26
26
  }
27
- .magritte-file-name___ZSL2g_3-2-13{
27
+ .magritte-file-name___ZSL2g_3-2-14{
28
28
  overflow:hidden;
29
29
  text-overflow:ellipsis;
30
30
  }
31
31
 
32
32
  :root{
33
- --magritte-typography-label-4-regular-font-family-v21-3-0:"hh sans";
34
- --magritte-typography-label-4-regular-font-weight-v21-3-0:400;
35
- --magritte-typography-label-4-regular-line-height-v21-3-0:18px;
36
- --magritte-typography-label-4-regular-font-size-v21-3-0:12px;
37
- --magritte-typography-label-4-regular-letter-spacing-v21-3-0:0.01em;
38
- --magritte-typography-label-4-regular-text-indent-v21-3-0:0px;
39
- --magritte-typography-label-4-regular-text-transform-v21-3-0:none;
40
- --magritte-typography-label-4-regular-text-decoration-v21-3-0:none;
41
- --magritte-static-space-100-v21-3-0:4px;
42
- --magritte-static-space-400-v21-3-0:16px;
43
- }
44
- .magritte-file-info-body___HmfXd_3-2-13{
33
+ --magritte-typography-label-4-regular-font-family-v21-3-1:"hh sans";
34
+ --magritte-typography-label-4-regular-font-weight-v21-3-1:400;
35
+ --magritte-typography-label-4-regular-line-height-v21-3-1:18px;
36
+ --magritte-typography-label-4-regular-font-size-v21-3-1:12px;
37
+ --magritte-typography-label-4-regular-letter-spacing-v21-3-1:0.01em;
38
+ --magritte-typography-label-4-regular-text-indent-v21-3-1:0px;
39
+ --magritte-typography-label-4-regular-text-transform-v21-3-1:none;
40
+ --magritte-typography-label-4-regular-text-decoration-v21-3-1:none;
41
+ --magritte-static-space-100-v21-3-1:4px;
42
+ --magritte-static-space-400-v21-3-1:16px;
43
+ }
44
+ .magritte-file-info-body___HmfXd_3-2-14{
45
45
  flex-grow:1;
46
46
  }
47
- .magritte-file-info-and-controls___61iyY_3-2-13{
47
+ .magritte-file-info-and-controls___61iyY_3-2-14{
48
48
  display:flex;
49
- gap:var(--magritte-static-space-400-v21-3-0);
49
+ gap:var(--magritte-static-space-400-v21-3-1);
50
50
  }
51
- .magritte-file-info-container___WFab8_3-2-13{
51
+ .magritte-file-info-container___WFab8_3-2-14{
52
52
  flex-grow:1;
53
53
  width:50px;
54
54
  }
55
- .magritte-file-info___HrqiB_3-2-13{
55
+ .magritte-file-info___HrqiB_3-2-14{
56
56
  display:flex;
57
- gap:var(--magritte-static-space-100-v21-3-0);
58
- font-family:var(--magritte-typography-label-4-regular-font-family-v21-3-0);
59
- font-weight:var(--magritte-typography-label-4-regular-font-weight-v21-3-0);
60
- line-height:var(--magritte-typography-label-4-regular-line-height-v21-3-0);
61
- font-size:var(--magritte-typography-label-4-regular-font-size-v21-3-0);
62
- letter-spacing:var(--magritte-typography-label-4-regular-letter-spacing-v21-3-0);
63
- text-indent:var(--magritte-typography-label-4-regular-text-indent-v21-3-0);
64
- text-transform:var(--magritte-typography-label-4-regular-text-transform-v21-3-0);
65
- text-decoration:var(--magritte-typography-label-4-regular-text-decoration-v21-3-0);
66
- }
67
- .magritte-controls___WdH7A_3-2-13{
57
+ gap:var(--magritte-static-space-100-v21-3-1);
58
+ font-family:var(--magritte-typography-label-4-regular-font-family-v21-3-1);
59
+ font-weight:var(--magritte-typography-label-4-regular-font-weight-v21-3-1);
60
+ line-height:var(--magritte-typography-label-4-regular-line-height-v21-3-1);
61
+ font-size:var(--magritte-typography-label-4-regular-font-size-v21-3-1);
62
+ letter-spacing:var(--magritte-typography-label-4-regular-letter-spacing-v21-3-1);
63
+ text-indent:var(--magritte-typography-label-4-regular-text-indent-v21-3-1);
64
+ text-transform:var(--magritte-typography-label-4-regular-text-transform-v21-3-1);
65
+ text-decoration:var(--magritte-typography-label-4-regular-text-decoration-v21-3-1);
66
+ }
67
+ .magritte-controls___WdH7A_3-2-14{
68
68
  display:flex;
69
69
  align-items:center;
70
70
  margin-left:auto;
71
- margin-right:var(--magritte-static-space-400-v21-3-0);
71
+ margin-right:var(--magritte-static-space-400-v21-3-1);
72
72
  }
73
73
 
74
74
  :root{
75
- --magritte-static-space-400-v21-3-0:16px;
75
+ --magritte-static-space-400-v21-3-1:16px;
76
76
  }
77
- .magritte-item___vVDG-_3-2-13{
77
+ .magritte-item___vVDG-_3-2-14{
78
78
  display:flex;
79
79
  width:100%;
80
- gap:var(--magritte-static-space-400-v21-3-0);
80
+ gap:var(--magritte-static-space-400-v21-3-1);
81
81
  }
82
82
 
83
83
  :root{
84
- --magritte-color-background-primary-v21-3-0:#ffffff;
85
- --magritte-color-stroke-neutral-v21-3-0:#DCE3EB;
86
- --magritte-color-stroke-accent-v21-3-0:#0070ff;
87
- --magritte-color-stroke-state-focused-accessible-v21-3-0:#0070ff7a;
88
- --magritte-color-component-input-stroke-state-negative-focused-accessible-v21-3-0:#ff4d3a7a;
84
+ --magritte-color-background-primary-v21-3-1:#ffffff;
85
+ --magritte-color-stroke-neutral-v21-3-1:#DCE3EB;
86
+ --magritte-color-stroke-accent-v21-3-1:#0070ff;
87
+ --magritte-color-stroke-state-focused-accessible-v21-3-1:#0070ff7a;
88
+ --magritte-color-component-input-stroke-state-negative-focused-accessible-v21-3-1:#ff4d3a7a;
89
89
  }
90
90
  :root{
91
- --magritte-static-space-300-v21-3-0:12px;
92
- --magritte-static-space-400-v21-3-0:16px;
93
- --magritte-static-space-500-v21-3-0:20px;
94
- --magritte-static-space-600-v21-3-0:24px;
95
- --magritte-static-border-radius-600-v21-3-0:24px;
91
+ --magritte-static-space-300-v21-3-1:12px;
92
+ --magritte-static-space-400-v21-3-1:16px;
93
+ --magritte-static-space-500-v21-3-1:20px;
94
+ --magritte-static-space-600-v21-3-1:24px;
95
+ --magritte-static-border-radius-600-v21-3-1:24px;
96
96
  }
97
97
  .magritte-night-theme{
98
- --magritte-color-background-primary-v21-3-0:#1B1B1B;
99
- --magritte-color-stroke-neutral-v21-3-0:#303030;
100
- --magritte-color-stroke-accent-v21-3-0:#2b7fff;
101
- --magritte-color-stroke-state-focused-accessible-v21-3-0:#0070ff7a;
102
- --magritte-color-component-input-stroke-state-negative-focused-accessible-v21-3-0:#ff4d3a7a;
98
+ --magritte-color-background-primary-v21-3-1:#1B1B1B;
99
+ --magritte-color-stroke-neutral-v21-3-1:#303030;
100
+ --magritte-color-stroke-accent-v21-3-1:#2b7fff;
101
+ --magritte-color-stroke-state-focused-accessible-v21-3-1:#0070ff7a;
102
+ --magritte-color-component-input-stroke-state-negative-focused-accessible-v21-3-1:#ff4d3a7a;
103
103
  }
104
- .magritte-root___FV1tC_3-2-13{
104
+ .magritte-root___FV1tC_3-2-14{
105
105
  position:relative;
106
106
  display:flex;
107
107
  overflow:hidden;
108
- border-radius:var(--magritte-static-border-radius-600-v21-3-0);
109
- background-color:var(--magritte-color-background-primary-v21-3-0);
108
+ border-radius:var(--magritte-static-border-radius-600-v21-3-1);
109
+ background-color:var(--magritte-color-background-primary-v21-3-1);
110
110
  }
111
- .magritte-root___FV1tC_3-2-13:hover{
111
+ .magritte-root___FV1tC_3-2-14:hover{
112
112
  cursor:pointer;
113
113
  }
114
- .magritte-root___FV1tC_3-2-13:hover .magritte-background___RfZ0U_3-2-13{
115
- border-color:var(--magritte-color-stroke-accent-v21-3-0);
114
+ .magritte-root___FV1tC_3-2-14:hover .magritte-background___RfZ0U_3-2-14{
115
+ border-color:var(--magritte-color-stroke-accent-v21-3-1);
116
116
  }
117
- .magritte-root___FV1tC_3-2-13.magritte-drag-active___dihBL_3-2-13 .magritte-background___RfZ0U_3-2-13{
118
- border-color:var(--magritte-color-stroke-accent-v21-3-0);
117
+ .magritte-root___FV1tC_3-2-14.magritte-drag-active___dihBL_3-2-14 .magritte-background___RfZ0U_3-2-14{
118
+ border-color:var(--magritte-color-stroke-accent-v21-3-1);
119
119
  }
120
- .magritte-root___FV1tC_3-2-13.focus-visible{
121
- outline:var(--magritte-color-stroke-state-focused-accessible-v21-3-0) solid 4px;
120
+ .magritte-root___FV1tC_3-2-14.focus-visible{
121
+ outline:var(--magritte-color-stroke-state-focused-accessible-v21-3-1) solid 4px;
122
122
  }
123
- .magritte-root___FV1tC_3-2-13.focus-visible .magritte-background___RfZ0U_3-2-13{
124
- border-color:var(--magritte-color-stroke-accent-v21-3-0);
123
+ .magritte-root___FV1tC_3-2-14.focus-visible .magritte-background___RfZ0U_3-2-14{
124
+ border-color:var(--magritte-color-stroke-accent-v21-3-1);
125
125
  }
126
- .magritte-root___FV1tC_3-2-13.magritte-load___MghDA_3-2-13 .magritte-background___RfZ0U_3-2-13,
127
- .magritte-root___FV1tC_3-2-13.magritte-loading___9E3p-_3-2-13 .magritte-background___RfZ0U_3-2-13{
126
+ .magritte-root___FV1tC_3-2-14.magritte-load___MghDA_3-2-14 .magritte-background___RfZ0U_3-2-14,
127
+ .magritte-root___FV1tC_3-2-14.magritte-loading___9E3p-_3-2-14 .magritte-background___RfZ0U_3-2-14{
128
128
  border-style:solid;
129
129
  border-width:7px;
130
130
  }
131
- .magritte-root___FV1tC_3-2-13.magritte-invalid___Rt10-_3-2-13.focus-visible{
132
- outline:var(--magritte-color-component-input-stroke-state-negative-focused-accessible-v21-3-0) solid 4px;
131
+ .magritte-root___FV1tC_3-2-14.magritte-invalid___Rt10-_3-2-14.focus-visible{
132
+ outline:var(--magritte-color-component-input-stroke-state-negative-focused-accessible-v21-3-1) solid 4px;
133
133
  }
134
- .magritte-root___FV1tC_3-2-13.magritte-invalid___Rt10-_3-2-13 .magritte-background___RfZ0U_3-2-13{
135
- border-color:var(--magritte-color-stroke-neutral-v21-3-0);
134
+ .magritte-root___FV1tC_3-2-14.magritte-invalid___Rt10-_3-2-14 .magritte-background___RfZ0U_3-2-14{
135
+ border-color:var(--magritte-color-stroke-neutral-v21-3-1);
136
136
  }
137
- .magritte-root_medium___67WJa_3-2-13{
137
+ .magritte-root_medium___67WJa_3-2-14{
138
138
  justify-content:center;
139
- padding:var(--magritte-static-space-600-v21-3-0);
139
+ padding:var(--magritte-static-space-600-v21-3-1);
140
140
  }
141
- .magritte-root_medium___67WJa_3-2-13 .magritte-body___O7ROl_3-2-13{
141
+ .magritte-root_medium___67WJa_3-2-14 .magritte-body___O7ROl_3-2-14{
142
142
  flex-direction:column;
143
143
  align-items:center;
144
144
  justify-content:center;
145
145
  }
146
- .magritte-root_small___dkUYq_3-2-13{
147
- padding-top:var(--magritte-static-space-400-v21-3-0);
148
- padding-bottom:var(--magritte-static-space-400-v21-3-0);
149
- padding-left:var(--magritte-static-space-400-v21-3-0);
146
+ .magritte-root_small___dkUYq_3-2-14{
147
+ padding-top:var(--magritte-static-space-400-v21-3-1);
148
+ padding-bottom:var(--magritte-static-space-400-v21-3-1);
149
+ padding-left:var(--magritte-static-space-400-v21-3-1);
150
150
  }
151
- .magritte-root_small___dkUYq_3-2-13 .magritte-body___O7ROl_3-2-13{
152
- gap:var(--magritte-static-space-400-v21-3-0);
151
+ .magritte-root_small___dkUYq_3-2-14 .magritte-body___O7ROl_3-2-14{
152
+ gap:var(--magritte-static-space-400-v21-3-1);
153
153
  }
154
- .magritte-background___RfZ0U_3-2-13{
154
+ .magritte-background___RfZ0U_3-2-14{
155
155
  position:absolute;
156
156
  border-width:8px;
157
157
  border-style:dashed;
158
- border-color:var(--magritte-color-stroke-neutral-v21-3-0);
158
+ border-color:var(--magritte-color-stroke-neutral-v21-3-1);
159
159
  top:-6px;
160
160
  bottom:-6px;
161
161
  left:-6px;
162
162
  right:-6px;
163
- border-radius:calc(var(--magritte-static-border-radius-600-v21-3-0) + 6px);
163
+ border-radius:calc(var(--magritte-static-border-radius-600-v21-3-1) + 6px);
164
164
  background-position:center;
165
165
  background-size:100%;
166
166
  }
167
- .magritte-body___O7ROl_3-2-13{
167
+ .magritte-body___O7ROl_3-2-14{
168
168
  display:flex;
169
169
  width:100%;
170
170
  }
171
- .magritte-loader___XYpWg_3-2-13{
171
+ .magritte-loader___XYpWg_3-2-14{
172
172
  position:relative;
173
173
  display:flex;
174
174
  }
175
- .magritte-cancel___tQ-yX_3-2-13{
175
+ .magritte-cancel___tQ-yX_3-2-14{
176
176
  position:absolute;
177
177
  top:0;
178
178
  left:0;
@@ -182,25 +182,25 @@
182
182
  align-items:center;
183
183
  justify-content:center;
184
184
  }
185
- .magritte-image-controls___vLf94_3-2-13{
185
+ .magritte-image-controls___vLf94_3-2-14{
186
186
  display:flex;
187
187
  position:absolute;
188
- right:var(--magritte-static-space-300-v21-3-0);
189
- bottom:var(--magritte-static-space-300-v21-3-0);
190
- gap:var(--magritte-static-space-300-v21-3-0);
188
+ right:var(--magritte-static-space-300-v21-3-1);
189
+ bottom:var(--magritte-static-space-300-v21-3-1);
190
+ gap:var(--magritte-static-space-300-v21-3-1);
191
191
  }
192
- .magritte-small-controls___Qn9TP_3-2-13{
192
+ .magritte-small-controls___Qn9TP_3-2-14{
193
193
  display:flex;
194
194
  align-items:center;
195
195
  margin-left:auto;
196
- margin-right:var(--magritte-static-space-500-v21-3-0);
196
+ margin-right:var(--magritte-static-space-500-v21-3-1);
197
197
  }
198
- .magritte-file-list___L9uHt_3-2-13{
199
- margin-top:var(--magritte-static-space-300-v21-3-0);
200
- box-shadow:inset 0 0 0 1px var(--magritte-color-stroke-neutral-v21-3-0);
201
- border-radius:var(--magritte-static-border-radius-600-v21-3-0);
202
- padding-top:var(--magritte-static-space-400-v21-3-0);
198
+ .magritte-file-list___L9uHt_3-2-14{
199
+ margin-top:var(--magritte-static-space-300-v21-3-1);
200
+ box-shadow:inset 0 0 0 1px var(--magritte-color-stroke-neutral-v21-3-1);
201
+ border-radius:var(--magritte-static-border-radius-600-v21-3-1);
202
+ padding-top:var(--magritte-static-space-400-v21-3-1);
203
203
  padding-right:0;
204
- padding-bottom:var(--magritte-static-space-400-v21-3-0);
205
- padding-left:var(--magritte-static-space-400-v21-3-0);
204
+ padding-bottom:var(--magritte-static-space-400-v21-3-1);
205
+ padding-left:var(--magritte-static-space-400-v21-3-1);
206
206
  }
package/index.js CHANGED
@@ -22,6 +22,6 @@ import '@hh.ru/magritte-ui-breakpoint';
22
22
  import '@hh.ru/magritte-ui-typography';
23
23
  import './useDropActions.js';
24
24
  import './useDropButtons.js';
25
- import './upload-0nSYx5lz.js';
25
+ import './upload-C-Nas2hq.js';
26
26
  import './SingleUpload.js';
27
27
  //# sourceMappingURL=index.js.map
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@hh.ru/magritte-ui-upload",
3
- "version": "3.2.13",
3
+ "version": "3.2.14",
4
4
  "main": "index.js",
5
5
  "types": "index.d.ts",
6
6
  "sideEffects": [
@@ -27,19 +27,19 @@
27
27
  "react": ">=18.2.0"
28
28
  },
29
29
  "dependencies": {
30
- "@hh.ru/magritte-ui-action": "4.4.30",
31
- "@hh.ru/magritte-ui-avatar": "5.1.5",
30
+ "@hh.ru/magritte-ui-action": "4.4.31",
31
+ "@hh.ru/magritte-ui-avatar": "5.1.6",
32
32
  "@hh.ru/magritte-ui-breakpoint": "5.0.0",
33
- "@hh.ru/magritte-ui-button": "5.2.24",
34
- "@hh.ru/magritte-ui-button-stack": "2.1.44",
35
- "@hh.ru/magritte-ui-divider": "1.1.43",
36
- "@hh.ru/magritte-ui-icon": "8.0.3",
37
- "@hh.ru/magritte-ui-loader": "1.3.22",
33
+ "@hh.ru/magritte-ui-button": "5.2.25",
34
+ "@hh.ru/magritte-ui-button-stack": "2.1.45",
35
+ "@hh.ru/magritte-ui-divider": "1.1.44",
36
+ "@hh.ru/magritte-ui-icon": "9.0.0",
37
+ "@hh.ru/magritte-ui-loader": "1.3.23",
38
38
  "@hh.ru/magritte-ui-mock-component": "1.0.12",
39
- "@hh.ru/magritte-ui-spacing": "2.0.41",
40
- "@hh.ru/magritte-ui-theme-provider": "1.1.39",
41
- "@hh.ru/magritte-ui-typography": "3.0.29",
39
+ "@hh.ru/magritte-ui-spacing": "2.0.42",
40
+ "@hh.ru/magritte-ui-theme-provider": "1.1.40",
41
+ "@hh.ru/magritte-ui-typography": "3.0.30",
42
42
  "react-dropzone": "14.3.5"
43
43
  },
44
- "gitHead": "f34863ead2fa1b6fd393104b762f2ba9f3d5d907"
44
+ "gitHead": "f0580e3372548c1cf344118a05710a20826f423d"
45
45
  }
@@ -0,0 +1,5 @@
1
+ import './index.css';
2
+ var styles = {"root":"magritte-root___FV1tC_3-2-14","background":"magritte-background___RfZ0U_3-2-14","drag-active":"magritte-drag-active___dihBL_3-2-14","dragActive":"magritte-drag-active___dihBL_3-2-14","load":"magritte-load___MghDA_3-2-14","loading":"magritte-loading___9E3p-_3-2-14","invalid":"magritte-invalid___Rt10-_3-2-14","root_medium":"magritte-root_medium___67WJa_3-2-14","rootMedium":"magritte-root_medium___67WJa_3-2-14","body":"magritte-body___O7ROl_3-2-14","root_small":"magritte-root_small___dkUYq_3-2-14","rootSmall":"magritte-root_small___dkUYq_3-2-14","loader":"magritte-loader___XYpWg_3-2-14","cancel":"magritte-cancel___tQ-yX_3-2-14","image-controls":"magritte-image-controls___vLf94_3-2-14","imageControls":"magritte-image-controls___vLf94_3-2-14","small-controls":"magritte-small-controls___Qn9TP_3-2-14","smallControls":"magritte-small-controls___Qn9TP_3-2-14","file-list":"magritte-file-list___L9uHt_3-2-14","fileList":"magritte-file-list___L9uHt_3-2-14"};
3
+
4
+ export { styles as s };
5
+ //# sourceMappingURL=upload-C-Nas2hq.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"upload-C-Nas2hq.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
package/utils.js CHANGED
@@ -34,19 +34,19 @@ const getUploadIcon = (uploadType, loadedFile, isSmall) => {
34
34
  return undefined;
35
35
  }
36
36
  if (uploadType === 'image') {
37
- return isSmall ? jsx(ImageSize24, { initial: "accent" }) : jsx(ImageSize32, { initial: "secondary" });
37
+ return isSmall ? jsx(ImageSize24, { initialColor: "accent" }) : jsx(ImageSize32, { initialColor: "secondary" });
38
38
  }
39
39
  if (uploadType === 'video') {
40
- return isSmall ? (jsx(VideocameraOutlinedSize24, { initial: "accent" })) : (jsx(VideocameraOutlinedSize32, { initial: "secondary" }));
40
+ return isSmall ? (jsx(VideocameraOutlinedSize24, { initialColor: "accent" })) : (jsx(VideocameraOutlinedSize32, { initialColor: "secondary" }));
41
41
  }
42
42
  // mixed, application
43
- return isSmall ? jsx(DocumentOutlinedSize24, { initial: "accent" }) : jsx(DocumentOutlinedSize32, { initial: "secondary" });
43
+ return isSmall ? (jsx(DocumentOutlinedSize24, { initialColor: "accent" })) : (jsx(DocumentOutlinedSize32, { initialColor: "secondary" }));
44
44
  }
45
45
  if (uploadType === 'video' || uploadType === 'image') {
46
- return isSmall ? jsx(ImageSize24, { initial: "secondary" }) : jsx(ImageSize32, { initial: "secondary" });
46
+ return isSmall ? jsx(ImageSize24, { initialColor: "secondary" }) : jsx(ImageSize32, { initialColor: "secondary" });
47
47
  }
48
48
  // mixed, application
49
- return isSmall ? (jsx(DocumentArrowUpOutlinedSize24, { initial: "secondary" })) : (jsx(DocumentArrowUpOutlinedSize32, { initial: "secondary" }));
49
+ return isSmall ? (jsx(DocumentArrowUpOutlinedSize24, { initialColor: "secondary" })) : (jsx(DocumentArrowUpOutlinedSize32, { initialColor: "secondary" }));
50
50
  };
51
51
 
52
52
  export { DEFAULT_ACCEPT, RenderFileInfoDefault, bytes2mb, getAvaliableFileTypes, getFileType, getUploadIcon };
package/utils.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"utils.js","sources":["../src/utils.tsx"],"sourcesContent":["import { ReactElement, ReactNode } from 'react';\nimport { Accept } from 'react-dropzone';\n\nimport {\n DocumentArrowUpOutlinedSize32,\n DocumentOutlinedSize32,\n VideocameraOutlinedSize32,\n ImageSize32,\n DocumentArrowUpOutlinedSize24,\n DocumentOutlinedSize24,\n VideocameraOutlinedSize24,\n ImageSize24,\n} from '@hh.ru/magritte-ui-icon/icon';\nimport { LoadedFile, UploadType, LoadedFileWithFileSize } from '@hh.ru/magritte-ui-upload/types';\n\nexport const RenderFileInfoDefault = (loadedFile: LoadedFileWithFileSize): ReactNode => {\n return loadedFile.fileSizeMB;\n};\n\nexport const DEFAULT_ACCEPT: Accept = {\n 'image/*': ['.png', '.jpeg', '.jpg'],\n};\n\nconst order = 1024 * 1024;\nexport const bytes2mb = (value: number): string => {\n return (value / order).toFixed(2);\n};\n\nexport const getFileType = (avaliableType: string): UploadType => {\n return avaliableType.split('/')[0] as UploadType;\n};\n\n// парсим accept в нормальный формат\nexport const 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 return getFileType(avaliableTypes[0]);\n};\n\n// иконка (тип и цвет) может меняться в зависимости от типа, размера и состояния загрузки\nexport const getUploadIcon = (\n uploadType: UploadType,\n loadedFile: LoadedFile | undefined,\n isSmall: boolean\n): ReactElement | undefined => {\n if (loadedFile) {\n const { error, loading } = loadedFile;\n if ((loading || error) && !isSmall) {\n return undefined;\n }\n if (uploadType === 'image') {\n return isSmall ? <ImageSize24 initial=\"accent\" /> : <ImageSize32 initial=\"secondary\" />;\n }\n if (uploadType === 'video') {\n return isSmall ? (\n <VideocameraOutlinedSize24 initial=\"accent\" />\n ) : (\n <VideocameraOutlinedSize32 initial=\"secondary\" />\n );\n }\n // mixed, application\n return isSmall ? <DocumentOutlinedSize24 initial=\"accent\" /> : <DocumentOutlinedSize32 initial=\"secondary\" />;\n }\n if (uploadType === 'video' || uploadType === 'image') {\n return isSmall ? <ImageSize24 initial=\"secondary\" /> : <ImageSize32 initial=\"secondary\" />;\n }\n // mixed, application\n return isSmall ? (\n <DocumentArrowUpOutlinedSize24 initial=\"secondary\" />\n ) : (\n <DocumentArrowUpOutlinedSize32 initial=\"secondary\" />\n );\n};\n"],"names":["_jsx"],"mappings":";;;AAea,MAAA,qBAAqB,GAAG,CAAC,UAAkC,KAAe;IACnF,OAAO,UAAU,CAAC,UAAU,CAAC;AACjC,EAAE;AAEW,MAAA,cAAc,GAAW;AAClC,IAAA,SAAS,EAAE,CAAC,MAAM,EAAE,OAAO,EAAE,MAAM,CAAC;EACtC;AAEF,MAAM,KAAK,GAAG,IAAI,GAAG,IAAI,CAAC;AACb,MAAA,QAAQ,GAAG,CAAC,KAAa,KAAY;IAC9C,OAAO,CAAC,KAAK,GAAG,KAAK,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC;AACtC,EAAE;AAEW,MAAA,WAAW,GAAG,CAAC,aAAqB,KAAgB;IAC7D,OAAO,aAAa,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,CAAe,CAAC;AACrD,EAAE;AAEF;AACa,MAAA,qBAAqB,GAAG,CAAC,MAAc,KAAgB;IAChE,MAAM,cAAc,GAAG,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;AAC3C,IAAA,IAAI,cAAc,CAAC,MAAM,KAAK,CAAC,EAAE;AAC7B,QAAA,MAAM,IAAI,KAAK,CAAC,CAAA,gDAAA,CAAkD,CAAC,CAAC;KACvE;AACD,IAAA,IAAI,cAAc,CAAC,MAAM,GAAG,CAAC,EAAE;AAC3B,QAAA,OAAO,OAAO,CAAC;KAClB;AACD,IAAA,OAAO,WAAW,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC;AAC1C,EAAE;AAEF;AACa,MAAA,aAAa,GAAG,CACzB,UAAsB,EACtB,UAAkC,EAClC,OAAgB,KACU;IAC1B,IAAI,UAAU,EAAE;AACZ,QAAA,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,GAAG,UAAU,CAAC;QACtC,IAAI,CAAC,OAAO,IAAI,KAAK,KAAK,CAAC,OAAO,EAAE;AAChC,YAAA,OAAO,SAAS,CAAC;SACpB;AACD,QAAA,IAAI,UAAU,KAAK,OAAO,EAAE;YACxB,OAAO,OAAO,GAAGA,IAAC,WAAW,EAAA,EAAC,OAAO,EAAC,QAAQ,GAAG,GAAGA,GAAC,CAAA,WAAW,IAAC,OAAO,EAAC,WAAW,EAAA,CAAG,CAAC;SAC3F;AACD,QAAA,IAAI,UAAU,KAAK,OAAO,EAAE;YACxB,OAAO,OAAO,IACVA,IAAC,yBAAyB,EAAA,EAAC,OAAO,EAAC,QAAQ,EAAA,CAAG,KAE9CA,GAAC,CAAA,yBAAyB,EAAC,EAAA,OAAO,EAAC,WAAW,EAAG,CAAA,CACpD,CAAC;SACL;;QAED,OAAO,OAAO,GAAGA,IAAC,sBAAsB,EAAA,EAAC,OAAO,EAAC,QAAQ,GAAG,GAAGA,GAAC,CAAA,sBAAsB,IAAC,OAAO,EAAC,WAAW,EAAA,CAAG,CAAC;KACjH;IACD,IAAI,UAAU,KAAK,OAAO,IAAI,UAAU,KAAK,OAAO,EAAE;QAClD,OAAO,OAAO,GAAGA,IAAC,WAAW,EAAA,EAAC,OAAO,EAAC,WAAW,GAAG,GAAGA,GAAC,CAAA,WAAW,IAAC,OAAO,EAAC,WAAW,EAAA,CAAG,CAAC;KAC9F;;IAED,OAAO,OAAO,IACVA,IAAC,6BAA6B,EAAA,EAAC,OAAO,EAAC,WAAW,EAAA,CAAG,KAErDA,GAAC,CAAA,6BAA6B,EAAC,EAAA,OAAO,EAAC,WAAW,EAAG,CAAA,CACxD,CAAC;AACN;;;;"}
1
+ {"version":3,"file":"utils.js","sources":["../src/utils.tsx"],"sourcesContent":["import { ReactElement, ReactNode } from 'react';\nimport { Accept } from 'react-dropzone';\n\nimport {\n DocumentArrowUpOutlinedSize32,\n DocumentOutlinedSize32,\n VideocameraOutlinedSize32,\n ImageSize32,\n DocumentArrowUpOutlinedSize24,\n DocumentOutlinedSize24,\n VideocameraOutlinedSize24,\n ImageSize24,\n} from '@hh.ru/magritte-ui-icon/icon';\nimport { LoadedFile, UploadType, LoadedFileWithFileSize } from '@hh.ru/magritte-ui-upload/types';\n\nexport const RenderFileInfoDefault = (loadedFile: LoadedFileWithFileSize): ReactNode => {\n return loadedFile.fileSizeMB;\n};\n\nexport const DEFAULT_ACCEPT: Accept = {\n 'image/*': ['.png', '.jpeg', '.jpg'],\n};\n\nconst order = 1024 * 1024;\nexport const bytes2mb = (value: number): string => {\n return (value / order).toFixed(2);\n};\n\nexport const getFileType = (avaliableType: string): UploadType => {\n return avaliableType.split('/')[0] as UploadType;\n};\n\n// парсим accept в нормальный формат\nexport const 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 return getFileType(avaliableTypes[0]);\n};\n\n// иконка (тип и цвет) может меняться в зависимости от типа, размера и состояния загрузки\nexport const getUploadIcon = (\n uploadType: UploadType,\n loadedFile: LoadedFile | undefined,\n isSmall: boolean\n): ReactElement | undefined => {\n if (loadedFile) {\n const { error, loading } = loadedFile;\n if ((loading || error) && !isSmall) {\n return undefined;\n }\n if (uploadType === 'image') {\n return isSmall ? <ImageSize24 initialColor=\"accent\" /> : <ImageSize32 initialColor=\"secondary\" />;\n }\n if (uploadType === 'video') {\n return isSmall ? (\n <VideocameraOutlinedSize24 initialColor=\"accent\" />\n ) : (\n <VideocameraOutlinedSize32 initialColor=\"secondary\" />\n );\n }\n // mixed, application\n return isSmall ? (\n <DocumentOutlinedSize24 initialColor=\"accent\" />\n ) : (\n <DocumentOutlinedSize32 initialColor=\"secondary\" />\n );\n }\n if (uploadType === 'video' || uploadType === 'image') {\n return isSmall ? <ImageSize24 initialColor=\"secondary\" /> : <ImageSize32 initialColor=\"secondary\" />;\n }\n // mixed, application\n return isSmall ? (\n <DocumentArrowUpOutlinedSize24 initialColor=\"secondary\" />\n ) : (\n <DocumentArrowUpOutlinedSize32 initialColor=\"secondary\" />\n );\n};\n"],"names":["_jsx"],"mappings":";;;AAea,MAAA,qBAAqB,GAAG,CAAC,UAAkC,KAAe;IACnF,OAAO,UAAU,CAAC,UAAU,CAAC;AACjC,EAAE;AAEW,MAAA,cAAc,GAAW;AAClC,IAAA,SAAS,EAAE,CAAC,MAAM,EAAE,OAAO,EAAE,MAAM,CAAC;EACtC;AAEF,MAAM,KAAK,GAAG,IAAI,GAAG,IAAI,CAAC;AACb,MAAA,QAAQ,GAAG,CAAC,KAAa,KAAY;IAC9C,OAAO,CAAC,KAAK,GAAG,KAAK,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC;AACtC,EAAE;AAEW,MAAA,WAAW,GAAG,CAAC,aAAqB,KAAgB;IAC7D,OAAO,aAAa,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,CAAe,CAAC;AACrD,EAAE;AAEF;AACa,MAAA,qBAAqB,GAAG,CAAC,MAAc,KAAgB;IAChE,MAAM,cAAc,GAAG,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;AAC3C,IAAA,IAAI,cAAc,CAAC,MAAM,KAAK,CAAC,EAAE;AAC7B,QAAA,MAAM,IAAI,KAAK,CAAC,CAAA,gDAAA,CAAkD,CAAC,CAAC;KACvE;AACD,IAAA,IAAI,cAAc,CAAC,MAAM,GAAG,CAAC,EAAE;AAC3B,QAAA,OAAO,OAAO,CAAC;KAClB;AACD,IAAA,OAAO,WAAW,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC;AAC1C,EAAE;AAEF;AACa,MAAA,aAAa,GAAG,CACzB,UAAsB,EACtB,UAAkC,EAClC,OAAgB,KACU;IAC1B,IAAI,UAAU,EAAE;AACZ,QAAA,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,GAAG,UAAU,CAAC;QACtC,IAAI,CAAC,OAAO,IAAI,KAAK,KAAK,CAAC,OAAO,EAAE;AAChC,YAAA,OAAO,SAAS,CAAC;SACpB;AACD,QAAA,IAAI,UAAU,KAAK,OAAO,EAAE;YACxB,OAAO,OAAO,GAAGA,IAAC,WAAW,EAAA,EAAC,YAAY,EAAC,QAAQ,GAAG,GAAGA,GAAC,CAAA,WAAW,IAAC,YAAY,EAAC,WAAW,EAAA,CAAG,CAAC;SACrG;AACD,QAAA,IAAI,UAAU,KAAK,OAAO,EAAE;YACxB,OAAO,OAAO,IACVA,IAAC,yBAAyB,EAAA,EAAC,YAAY,EAAC,QAAQ,EAAA,CAAG,KAEnDA,GAAC,CAAA,yBAAyB,EAAC,EAAA,YAAY,EAAC,WAAW,EAAG,CAAA,CACzD,CAAC;SACL;;QAED,OAAO,OAAO,IACVA,IAAC,sBAAsB,EAAA,EAAC,YAAY,EAAC,QAAQ,EAAA,CAAG,KAEhDA,GAAC,CAAA,sBAAsB,EAAC,EAAA,YAAY,EAAC,WAAW,EAAG,CAAA,CACtD,CAAC;KACL;IACD,IAAI,UAAU,KAAK,OAAO,IAAI,UAAU,KAAK,OAAO,EAAE;QAClD,OAAO,OAAO,GAAGA,IAAC,WAAW,EAAA,EAAC,YAAY,EAAC,WAAW,GAAG,GAAGA,GAAC,CAAA,WAAW,IAAC,YAAY,EAAC,WAAW,EAAA,CAAG,CAAC;KACxG;;IAED,OAAO,OAAO,IACVA,IAAC,6BAA6B,EAAA,EAAC,YAAY,EAAC,WAAW,EAAA,CAAG,KAE1DA,GAAC,CAAA,6BAA6B,EAAC,EAAA,YAAY,EAAC,WAAW,EAAG,CAAA,CAC7D,CAAC;AACN;;;;"}
@@ -1,5 +0,0 @@
1
- import './index.css';
2
- var styles = {"root":"magritte-root___FV1tC_3-2-13","background":"magritte-background___RfZ0U_3-2-13","drag-active":"magritte-drag-active___dihBL_3-2-13","dragActive":"magritte-drag-active___dihBL_3-2-13","load":"magritte-load___MghDA_3-2-13","loading":"magritte-loading___9E3p-_3-2-13","invalid":"magritte-invalid___Rt10-_3-2-13","root_medium":"magritte-root_medium___67WJa_3-2-13","rootMedium":"magritte-root_medium___67WJa_3-2-13","body":"magritte-body___O7ROl_3-2-13","root_small":"magritte-root_small___dkUYq_3-2-13","rootSmall":"magritte-root_small___dkUYq_3-2-13","loader":"magritte-loader___XYpWg_3-2-13","cancel":"magritte-cancel___tQ-yX_3-2-13","image-controls":"magritte-image-controls___vLf94_3-2-13","imageControls":"magritte-image-controls___vLf94_3-2-13","small-controls":"magritte-small-controls___Qn9TP_3-2-13","smallControls":"magritte-small-controls___Qn9TP_3-2-13","file-list":"magritte-file-list___L9uHt_3-2-13","fileList":"magritte-file-list___L9uHt_3-2-13"};
3
-
4
- export { styles as s };
5
- //# sourceMappingURL=upload-0nSYx5lz.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"upload-0nSYx5lz.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}