@alfalab/core-components-file-upload-item 5.6.10 → 5.7.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/Component.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  /// <reference types="react" />
2
2
  import React from 'react';
3
- import { ElementType, MouseEvent, ReactNode } from "react";
3
+ import { ElementType, HTMLAttributeAnchorTarget, MouseEvent, ReactNode } from "react";
4
4
  type FileStatuses = 'ERROR' | 'SUCCESS' | 'LOADING' | 'UPLOADING';
5
5
  type FileUploadItemProps = {
6
6
  /**
@@ -82,6 +82,10 @@ type FileUploadItemProps = {
82
82
  * Разрешить многострочное название файла
83
83
  */
84
84
  multiline?: boolean;
85
+ /**
86
+ * Указывает, где открыть скачиваемый документ
87
+ */
88
+ target?: HTMLAttributeAnchorTarget;
85
89
  /**
86
90
  * Идентификатор для систем автоматизированного тестирования
87
91
  */
package/Component.js CHANGED
@@ -19,11 +19,11 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
19
19
  var React__default = /*#__PURE__*/_interopDefaultCompat(React);
20
20
  var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
21
21
 
22
- var styles = {"component":"file-upload-item__component_1vzfs","infoSection":"file-upload-item__infoSection_1vzfs","info":"file-upload-item__info_1vzfs","icon":"file-upload-item__icon_1vzfs","errorIcon":"file-upload-item__errorIcon_1vzfs","successIcon":"file-upload-item__successIcon_1vzfs","name":"file-upload-item__name_1vzfs","rowLimit":"file-upload-item__rowLimit_1vzfs","meta":"file-upload-item__meta_1vzfs","size":"file-upload-item__size_1vzfs","delete":"file-upload-item__delete_1vzfs","download":"file-upload-item__download_1vzfs","errorWrapper":"file-upload-item__errorWrapper_1vzfs","restore":"file-upload-item__restore_1vzfs","spinnerWrapper":"file-upload-item__spinnerWrapper_1vzfs","spinner":"file-upload-item__spinner_1vzfs","uploadPercent":"file-upload-item__uploadPercent_1vzfs"};
22
+ var styles = {"component":"file-upload-item__component_18dki","infoSection":"file-upload-item__infoSection_18dki","info":"file-upload-item__info_18dki","icon":"file-upload-item__icon_18dki","errorIcon":"file-upload-item__errorIcon_18dki","successIcon":"file-upload-item__successIcon_18dki","name":"file-upload-item__name_18dki","rowLimit":"file-upload-item__rowLimit_18dki","meta":"file-upload-item__meta_18dki","size":"file-upload-item__size_18dki","delete":"file-upload-item__delete_18dki","download":"file-upload-item__download_18dki","errorWrapper":"file-upload-item__errorWrapper_18dki","restore":"file-upload-item__restore_18dki","spinnerWrapper":"file-upload-item__spinnerWrapper_18dki","spinner":"file-upload-item__spinner_18dki","uploadPercent":"file-upload-item__uploadPercent_18dki"};
23
23
  require('./index.css')
24
24
 
25
25
  var FileUploadItem = function (_a) {
26
- var className = _a.className, children = _a.children, _b = _a.id, id = _b === void 0 ? '0' : _b, _c = _a.name, name = _c === void 0 ? '' : _c, size = _a.size, _d = _a.icon, Icon = _d === void 0 ? utils.fileIcon(name) : _d, uploadDate = _a.uploadDate, downloadLink = _a.downloadLink, download = _a.download, uploadStatus = _a.uploadStatus, _e = _a.uploadPercent, uploadPercent = _e === void 0 ? 0 : _e, error = _a.error, showDelete = _a.showDelete, showRestore = _a.showRestore, onDelete = _a.onDelete, onDownload = _a.onDownload, onRestore = _a.onRestore, disableButtons = _a.disableButtons, _f = _a.multiline, multiline = _f === void 0 ? false : _f, dataTestId = _a.dataTestId;
26
+ var className = _a.className, children = _a.children, _b = _a.id, id = _b === void 0 ? '0' : _b, _c = _a.name, name = _c === void 0 ? '' : _c, size = _a.size, _d = _a.icon, Icon = _d === void 0 ? utils.fileIcon(name) : _d, uploadDate = _a.uploadDate, downloadLink = _a.downloadLink, download = _a.download, uploadStatus = _a.uploadStatus, _e = _a.uploadPercent, uploadPercent = _e === void 0 ? 0 : _e, error = _a.error, showDelete = _a.showDelete, showRestore = _a.showRestore, onDelete = _a.onDelete, onDownload = _a.onDownload, onRestore = _a.onRestore, disableButtons = _a.disableButtons, _f = _a.multiline, multiline = _f === void 0 ? false : _f, target = _a.target, dataTestId = _a.dataTestId;
27
27
  var handleDownload = function (event) {
28
28
  if (onDownload) {
29
29
  event.preventDefault();
@@ -76,7 +76,7 @@ var FileUploadItem = function (_a) {
76
76
  uploadDate && React__default.default.createElement("span", { key: uploadDate }, uploadDate),
77
77
  size && (React__default.default.createElement("span", { key: size, className: styles.size }, utils.humanFileSize(size)))))),
78
78
  showRestore && (React__default.default.createElement(coreComponentsLink.Link, { pseudo: true, className: styles.restore, onClick: handleRestore }, "\u0412\u043E\u0441\u0441\u0442\u0430\u043D\u043E\u0432\u0438\u0442\u044C")),
79
- showDownload && (React__default.default.createElement(coreComponentsIconButton.IconButton, { size: 'xxs', icon: PointerDownSIcon.PointerDownSIcon, className: styles.download, "aria-label": '\u0441\u043A\u0430\u0447\u0430\u0442\u044C', href: downloadLink, onClick: handleDownload, disabled: disableButtons, download: download })),
79
+ showDownload && (React__default.default.createElement(coreComponentsIconButton.IconButton, { size: 'xxs', icon: PointerDownSIcon.PointerDownSIcon, className: styles.download, "aria-label": '\u0441\u043A\u0430\u0447\u0430\u0442\u044C', href: downloadLink, onClick: handleDownload, disabled: disableButtons, download: download, target: target })),
80
80
  showDelete && !showRestore && (React__default.default.createElement(coreComponentsIconButton.IconButton, { size: 'xxs', icon: CrossSIcon.CrossSIcon, onClick: handleDelete, disabled: disableButtons, className: styles.delete, "aria-label": '\u0443\u0434\u0430\u043B\u0438\u0442\u044C' }))));
81
81
  };
82
82
 
@@ -1,6 +1,6 @@
1
1
  /// <reference types="react" />
2
2
  import React from 'react';
3
- import { ElementType, MouseEvent, ReactNode } from "react";
3
+ import { ElementType, HTMLAttributeAnchorTarget, MouseEvent, ReactNode } from "react";
4
4
  type FileStatuses = 'ERROR' | 'SUCCESS' | 'LOADING' | 'UPLOADING';
5
5
  type FileUploadItemProps = {
6
6
  /**
@@ -82,6 +82,10 @@ type FileUploadItemProps = {
82
82
  * Разрешить многострочное название файла
83
83
  */
84
84
  multiline?: boolean;
85
+ /**
86
+ * Указывает, где открыть скачиваемый документ
87
+ */
88
+ target?: HTMLAttributeAnchorTarget;
85
89
  /**
86
90
  * Идентификатор для систем автоматизированного тестирования
87
91
  */
package/cssm/Component.js CHANGED
@@ -22,7 +22,7 @@ var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
22
22
  var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
23
23
 
24
24
  var FileUploadItem = function (_a) {
25
- var className = _a.className, children = _a.children, _b = _a.id, id = _b === void 0 ? '0' : _b, _c = _a.name, name = _c === void 0 ? '' : _c, size = _a.size, _d = _a.icon, Icon = _d === void 0 ? utils.fileIcon(name) : _d, uploadDate = _a.uploadDate, downloadLink = _a.downloadLink, download = _a.download, uploadStatus = _a.uploadStatus, _e = _a.uploadPercent, uploadPercent = _e === void 0 ? 0 : _e, error = _a.error, showDelete = _a.showDelete, showRestore = _a.showRestore, onDelete = _a.onDelete, onDownload = _a.onDownload, onRestore = _a.onRestore, disableButtons = _a.disableButtons, _f = _a.multiline, multiline = _f === void 0 ? false : _f, dataTestId = _a.dataTestId;
25
+ var className = _a.className, children = _a.children, _b = _a.id, id = _b === void 0 ? '0' : _b, _c = _a.name, name = _c === void 0 ? '' : _c, size = _a.size, _d = _a.icon, Icon = _d === void 0 ? utils.fileIcon(name) : _d, uploadDate = _a.uploadDate, downloadLink = _a.downloadLink, download = _a.download, uploadStatus = _a.uploadStatus, _e = _a.uploadPercent, uploadPercent = _e === void 0 ? 0 : _e, error = _a.error, showDelete = _a.showDelete, showRestore = _a.showRestore, onDelete = _a.onDelete, onDownload = _a.onDownload, onRestore = _a.onRestore, disableButtons = _a.disableButtons, _f = _a.multiline, multiline = _f === void 0 ? false : _f, target = _a.target, dataTestId = _a.dataTestId;
26
26
  var handleDownload = function (event) {
27
27
  if (onDownload) {
28
28
  event.preventDefault();
@@ -75,7 +75,7 @@ var FileUploadItem = function (_a) {
75
75
  uploadDate && React__default.default.createElement("span", { key: uploadDate }, uploadDate),
76
76
  size && (React__default.default.createElement("span", { key: size, className: styles__default.default.size }, utils.humanFileSize(size)))))),
77
77
  showRestore && (React__default.default.createElement(coreComponentsLink.Link, { pseudo: true, className: styles__default.default.restore, onClick: handleRestore }, "\u0412\u043E\u0441\u0441\u0442\u0430\u043D\u043E\u0432\u0438\u0442\u044C")),
78
- showDownload && (React__default.default.createElement(coreComponentsIconButton.IconButton, { size: 'xxs', icon: PointerDownSIcon.PointerDownSIcon, className: styles__default.default.download, "aria-label": '\u0441\u043A\u0430\u0447\u0430\u0442\u044C', href: downloadLink, onClick: handleDownload, disabled: disableButtons, download: download })),
78
+ showDownload && (React__default.default.createElement(coreComponentsIconButton.IconButton, { size: 'xxs', icon: PointerDownSIcon.PointerDownSIcon, className: styles__default.default.download, "aria-label": '\u0441\u043A\u0430\u0447\u0430\u0442\u044C', href: downloadLink, onClick: handleDownload, disabled: disableButtons, download: download, target: target })),
79
79
  showDelete && !showRestore && (React__default.default.createElement(coreComponentsIconButton.IconButton, { size: 'xxs', icon: CrossSIcon.CrossSIcon, onClick: handleDelete, disabled: disableButtons, className: styles__default.default.delete, "aria-label": '\u0443\u0434\u0430\u043B\u0438\u0442\u044C' }))));
80
80
  };
81
81
 
@@ -1,6 +1,6 @@
1
1
  /// <reference types="react" />
2
2
  import React from 'react';
3
- import { ElementType, MouseEvent, ReactNode } from "react";
3
+ import { ElementType, HTMLAttributeAnchorTarget, MouseEvent, ReactNode } from "react";
4
4
  type FileStatuses = 'ERROR' | 'SUCCESS' | 'LOADING' | 'UPLOADING';
5
5
  type FileUploadItemProps = {
6
6
  /**
@@ -82,6 +82,10 @@ type FileUploadItemProps = {
82
82
  * Разрешить многострочное название файла
83
83
  */
84
84
  multiline?: boolean;
85
+ /**
86
+ * Указывает, где открыть скачиваемый документ
87
+ */
88
+ target?: HTMLAttributeAnchorTarget;
85
89
  /**
86
90
  * Идентификатор для систем автоматизированного тестирования
87
91
  */
package/esm/Component.js CHANGED
@@ -10,11 +10,11 @@ import { CrossSIcon } from '@alfalab/icons-glyph/CrossSIcon';
10
10
  import { PointerDownSIcon } from '@alfalab/icons-glyph/PointerDownSIcon';
11
11
  import { fileIcon, humanFileSize } from './utils.js';
12
12
 
13
- var styles = {"component":"file-upload-item__component_1vzfs","infoSection":"file-upload-item__infoSection_1vzfs","info":"file-upload-item__info_1vzfs","icon":"file-upload-item__icon_1vzfs","errorIcon":"file-upload-item__errorIcon_1vzfs","successIcon":"file-upload-item__successIcon_1vzfs","name":"file-upload-item__name_1vzfs","rowLimit":"file-upload-item__rowLimit_1vzfs","meta":"file-upload-item__meta_1vzfs","size":"file-upload-item__size_1vzfs","delete":"file-upload-item__delete_1vzfs","download":"file-upload-item__download_1vzfs","errorWrapper":"file-upload-item__errorWrapper_1vzfs","restore":"file-upload-item__restore_1vzfs","spinnerWrapper":"file-upload-item__spinnerWrapper_1vzfs","spinner":"file-upload-item__spinner_1vzfs","uploadPercent":"file-upload-item__uploadPercent_1vzfs"};
13
+ var styles = {"component":"file-upload-item__component_18dki","infoSection":"file-upload-item__infoSection_18dki","info":"file-upload-item__info_18dki","icon":"file-upload-item__icon_18dki","errorIcon":"file-upload-item__errorIcon_18dki","successIcon":"file-upload-item__successIcon_18dki","name":"file-upload-item__name_18dki","rowLimit":"file-upload-item__rowLimit_18dki","meta":"file-upload-item__meta_18dki","size":"file-upload-item__size_18dki","delete":"file-upload-item__delete_18dki","download":"file-upload-item__download_18dki","errorWrapper":"file-upload-item__errorWrapper_18dki","restore":"file-upload-item__restore_18dki","spinnerWrapper":"file-upload-item__spinnerWrapper_18dki","spinner":"file-upload-item__spinner_18dki","uploadPercent":"file-upload-item__uploadPercent_18dki"};
14
14
  require('./index.css')
15
15
 
16
16
  var FileUploadItem = function (_a) {
17
- var className = _a.className, children = _a.children, _b = _a.id, id = _b === void 0 ? '0' : _b, _c = _a.name, name = _c === void 0 ? '' : _c, size = _a.size, _d = _a.icon, Icon = _d === void 0 ? fileIcon(name) : _d, uploadDate = _a.uploadDate, downloadLink = _a.downloadLink, download = _a.download, uploadStatus = _a.uploadStatus, _e = _a.uploadPercent, uploadPercent = _e === void 0 ? 0 : _e, error = _a.error, showDelete = _a.showDelete, showRestore = _a.showRestore, onDelete = _a.onDelete, onDownload = _a.onDownload, onRestore = _a.onRestore, disableButtons = _a.disableButtons, _f = _a.multiline, multiline = _f === void 0 ? false : _f, dataTestId = _a.dataTestId;
17
+ var className = _a.className, children = _a.children, _b = _a.id, id = _b === void 0 ? '0' : _b, _c = _a.name, name = _c === void 0 ? '' : _c, size = _a.size, _d = _a.icon, Icon = _d === void 0 ? fileIcon(name) : _d, uploadDate = _a.uploadDate, downloadLink = _a.downloadLink, download = _a.download, uploadStatus = _a.uploadStatus, _e = _a.uploadPercent, uploadPercent = _e === void 0 ? 0 : _e, error = _a.error, showDelete = _a.showDelete, showRestore = _a.showRestore, onDelete = _a.onDelete, onDownload = _a.onDownload, onRestore = _a.onRestore, disableButtons = _a.disableButtons, _f = _a.multiline, multiline = _f === void 0 ? false : _f, target = _a.target, dataTestId = _a.dataTestId;
18
18
  var handleDownload = function (event) {
19
19
  if (onDownload) {
20
20
  event.preventDefault();
@@ -67,7 +67,7 @@ var FileUploadItem = function (_a) {
67
67
  uploadDate && React.createElement("span", { key: uploadDate }, uploadDate),
68
68
  size && (React.createElement("span", { key: size, className: styles.size }, humanFileSize(size)))))),
69
69
  showRestore && (React.createElement(Link, { pseudo: true, className: styles.restore, onClick: handleRestore }, "\u0412\u043E\u0441\u0441\u0442\u0430\u043D\u043E\u0432\u0438\u0442\u044C")),
70
- showDownload && (React.createElement(IconButton, { size: 'xxs', icon: PointerDownSIcon, className: styles.download, "aria-label": '\u0441\u043A\u0430\u0447\u0430\u0442\u044C', href: downloadLink, onClick: handleDownload, disabled: disableButtons, download: download })),
70
+ showDownload && (React.createElement(IconButton, { size: 'xxs', icon: PointerDownSIcon, className: styles.download, "aria-label": '\u0441\u043A\u0430\u0447\u0430\u0442\u044C', href: downloadLink, onClick: handleDownload, disabled: disableButtons, download: download, target: target })),
71
71
  showDelete && !showRestore && (React.createElement(IconButton, { size: 'xxs', icon: CrossSIcon, onClick: handleDelete, disabled: disableButtons, className: styles.delete, "aria-label": '\u0443\u0434\u0430\u043B\u0438\u0442\u044C' }))));
72
72
  };
73
73
 
package/esm/index.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: dt4qp */
1
+ /* hash: 1rs3w */
2
2
  :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
3
3
  } /* deprecated */ :root {
4
4
  --color-light-neutral-300: #e7e8eb;
@@ -30,7 +30,7 @@
30
30
  /* новые значения, используйте их */
31
31
  } :root {
32
32
  } :root {
33
- } .file-upload-item__component_1vzfs {
33
+ } .file-upload-item__component_18dki {
34
34
  font-size: 13px;
35
35
  line-height: 16px;
36
36
  font-weight: 400;
@@ -42,78 +42,78 @@
42
42
  color: var(--color-light-text-secondary);
43
43
  box-shadow: 0 -1px 0 0 var(--color-light-neutral-300) inset;
44
44
  box-sizing: border-box
45
- } .file-upload-item__component_1vzfs svg {
45
+ } .file-upload-item__component_18dki svg {
46
46
  display: block;
47
- } .file-upload-item__component_1vzfs:last-child {
47
+ } .file-upload-item__component_18dki:last-child {
48
48
  box-shadow: none;
49
- } .file-upload-item__infoSection_1vzfs {
49
+ } .file-upload-item__infoSection_18dki {
50
50
  display: flex;
51
51
  flex-direction: column;
52
52
  flex: 1;
53
53
  margin-top: var(--gap-2xs);
54
54
  margin-left: var(--gap-s);
55
55
  min-width: 40%;
56
- } .file-upload-item__info_1vzfs {
56
+ } .file-upload-item__info_18dki {
57
57
  display: flex;
58
58
  flex-wrap: wrap;
59
59
  flex: 1;
60
60
  overflow: hidden;
61
- } .file-upload-item__icon_1vzfs {
61
+ } .file-upload-item__icon_18dki {
62
62
  display: block;
63
63
  flex-shrink: 0;
64
64
  color: var(--color-light-neutral-translucent-1300);
65
- } .file-upload-item__errorIcon_1vzfs {
65
+ } .file-upload-item__errorIcon_18dki {
66
66
  flex-shrink: 0;
67
67
  color: var(--color-light-status-negative);
68
- } .file-upload-item__successIcon_1vzfs {
68
+ } .file-upload-item__successIcon_18dki {
69
69
  flex-shrink: 0;
70
70
  color: var(--color-light-status-positive);
71
- } .file-upload-item__name_1vzfs {
71
+ } .file-upload-item__name_18dki {
72
72
  color: var(--color-light-text-primary)
73
- } .file-upload-item__name_1vzfs a {
73
+ } .file-upload-item__name_18dki a {
74
74
  display: block;
75
75
  margin-bottom: 1px;
76
- } .file-upload-item__name_1vzfs.file-upload-item__rowLimit_1vzfs {
76
+ } .file-upload-item__name_18dki.file-upload-item__rowLimit_18dki {
77
77
  white-space: nowrap;
78
78
  overflow: hidden;
79
79
  text-overflow: ellipsis;
80
- } .file-upload-item__meta_1vzfs {
80
+ } .file-upload-item__meta_18dki {
81
81
  display: flex;
82
82
  white-space: nowrap;
83
83
  margin-right: var(--gap-2xs);
84
84
  margin-left: 36px;
85
85
  padding: var(--gap-2xs) 0
86
- } .file-upload-item__meta_1vzfs > * {
86
+ } .file-upload-item__meta_18dki > * {
87
87
  margin-right: var(--gap-s)
88
- } .file-upload-item__meta_1vzfs > *:last-child {
88
+ } .file-upload-item__meta_18dki > *:last-child {
89
89
  margin-right: 0;
90
- } .file-upload-item__size_1vzfs {
90
+ } .file-upload-item__size_18dki {
91
91
  text-align: right;
92
- } .file-upload-item__delete_1vzfs,
93
- .file-upload-item__download_1vzfs {
92
+ } .file-upload-item__delete_18dki,
93
+ .file-upload-item__download_18dki {
94
94
  height: 24px;
95
95
  width: 24px;
96
96
  margin-left: var(--gap-xs);
97
- } .file-upload-item__errorWrapper_1vzfs {
97
+ } .file-upload-item__errorWrapper_18dki {
98
98
  margin-top: var(--gap-2xs);
99
99
  color: var(--color-light-text-negative);
100
- } .file-upload-item__restore_1vzfs {
100
+ } .file-upload-item__restore_18dki {
101
101
  font-size: 14px;
102
102
  line-height: 20px;
103
103
  font-weight: 400;
104
104
 
105
105
  margin-left: var(--gap-s);
106
106
  margin-top: var(--gap-3xs);
107
- } .file-upload-item__spinnerWrapper_1vzfs {
107
+ } .file-upload-item__spinnerWrapper_18dki {
108
108
  display: flex;
109
109
  justify-content: center;
110
110
  align-items: center;
111
111
  width: 24px;
112
112
  height: 24px;
113
- } .file-upload-item__spinner_1vzfs {
113
+ } .file-upload-item__spinner_18dki {
114
114
  width: 20px;
115
115
  height: 20px;
116
- } .file-upload-item__uploadPercent_1vzfs {
116
+ } .file-upload-item__uploadPercent_18dki {
117
117
  margin-top: var(--gap-2xs);
118
118
  margin-left: var(--gap-xl);
119
119
  }
package/index.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: dt4qp */
1
+ /* hash: 1rs3w */
2
2
  :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
3
3
  } /* deprecated */ :root {
4
4
  --color-light-neutral-300: #e7e8eb;
@@ -30,7 +30,7 @@
30
30
  /* новые значения, используйте их */
31
31
  } :root {
32
32
  } :root {
33
- } .file-upload-item__component_1vzfs {
33
+ } .file-upload-item__component_18dki {
34
34
  font-size: 13px;
35
35
  line-height: 16px;
36
36
  font-weight: 400;
@@ -42,78 +42,78 @@
42
42
  color: var(--color-light-text-secondary);
43
43
  box-shadow: 0 -1px 0 0 var(--color-light-neutral-300) inset;
44
44
  box-sizing: border-box
45
- } .file-upload-item__component_1vzfs svg {
45
+ } .file-upload-item__component_18dki svg {
46
46
  display: block;
47
- } .file-upload-item__component_1vzfs:last-child {
47
+ } .file-upload-item__component_18dki:last-child {
48
48
  box-shadow: none;
49
- } .file-upload-item__infoSection_1vzfs {
49
+ } .file-upload-item__infoSection_18dki {
50
50
  display: flex;
51
51
  flex-direction: column;
52
52
  flex: 1;
53
53
  margin-top: var(--gap-2xs);
54
54
  margin-left: var(--gap-s);
55
55
  min-width: 40%;
56
- } .file-upload-item__info_1vzfs {
56
+ } .file-upload-item__info_18dki {
57
57
  display: flex;
58
58
  flex-wrap: wrap;
59
59
  flex: 1;
60
60
  overflow: hidden;
61
- } .file-upload-item__icon_1vzfs {
61
+ } .file-upload-item__icon_18dki {
62
62
  display: block;
63
63
  flex-shrink: 0;
64
64
  color: var(--color-light-neutral-translucent-1300);
65
- } .file-upload-item__errorIcon_1vzfs {
65
+ } .file-upload-item__errorIcon_18dki {
66
66
  flex-shrink: 0;
67
67
  color: var(--color-light-status-negative);
68
- } .file-upload-item__successIcon_1vzfs {
68
+ } .file-upload-item__successIcon_18dki {
69
69
  flex-shrink: 0;
70
70
  color: var(--color-light-status-positive);
71
- } .file-upload-item__name_1vzfs {
71
+ } .file-upload-item__name_18dki {
72
72
  color: var(--color-light-text-primary)
73
- } .file-upload-item__name_1vzfs a {
73
+ } .file-upload-item__name_18dki a {
74
74
  display: block;
75
75
  margin-bottom: 1px;
76
- } .file-upload-item__name_1vzfs.file-upload-item__rowLimit_1vzfs {
76
+ } .file-upload-item__name_18dki.file-upload-item__rowLimit_18dki {
77
77
  white-space: nowrap;
78
78
  overflow: hidden;
79
79
  text-overflow: ellipsis;
80
- } .file-upload-item__meta_1vzfs {
80
+ } .file-upload-item__meta_18dki {
81
81
  display: flex;
82
82
  white-space: nowrap;
83
83
  margin-right: var(--gap-2xs);
84
84
  margin-left: 36px;
85
85
  padding: var(--gap-2xs) 0
86
- } .file-upload-item__meta_1vzfs > * {
86
+ } .file-upload-item__meta_18dki > * {
87
87
  margin-right: var(--gap-s)
88
- } .file-upload-item__meta_1vzfs > *:last-child {
88
+ } .file-upload-item__meta_18dki > *:last-child {
89
89
  margin-right: 0;
90
- } .file-upload-item__size_1vzfs {
90
+ } .file-upload-item__size_18dki {
91
91
  text-align: right;
92
- } .file-upload-item__delete_1vzfs,
93
- .file-upload-item__download_1vzfs {
92
+ } .file-upload-item__delete_18dki,
93
+ .file-upload-item__download_18dki {
94
94
  height: 24px;
95
95
  width: 24px;
96
96
  margin-left: var(--gap-xs);
97
- } .file-upload-item__errorWrapper_1vzfs {
97
+ } .file-upload-item__errorWrapper_18dki {
98
98
  margin-top: var(--gap-2xs);
99
99
  color: var(--color-light-text-negative);
100
- } .file-upload-item__restore_1vzfs {
100
+ } .file-upload-item__restore_18dki {
101
101
  font-size: 14px;
102
102
  line-height: 20px;
103
103
  font-weight: 400;
104
104
 
105
105
  margin-left: var(--gap-s);
106
106
  margin-top: var(--gap-3xs);
107
- } .file-upload-item__spinnerWrapper_1vzfs {
107
+ } .file-upload-item__spinnerWrapper_18dki {
108
108
  display: flex;
109
109
  justify-content: center;
110
110
  align-items: center;
111
111
  width: 24px;
112
112
  height: 24px;
113
- } .file-upload-item__spinner_1vzfs {
113
+ } .file-upload-item__spinner_18dki {
114
114
  width: 20px;
115
115
  height: 20px;
116
- } .file-upload-item__uploadPercent_1vzfs {
116
+ } .file-upload-item__uploadPercent_18dki {
117
117
  margin-top: var(--gap-2xs);
118
118
  margin-left: var(--gap-xl);
119
119
  }
@@ -1,6 +1,6 @@
1
1
  /// <reference types="react" />
2
2
  import React from 'react';
3
- import { ElementType, MouseEvent, ReactNode } from "react";
3
+ import { ElementType, HTMLAttributeAnchorTarget, MouseEvent, ReactNode } from "react";
4
4
  type FileStatuses = 'ERROR' | 'SUCCESS' | 'LOADING' | 'UPLOADING';
5
5
  type FileUploadItemProps = {
6
6
  /**
@@ -82,6 +82,10 @@ type FileUploadItemProps = {
82
82
  * Разрешить многострочное название файла
83
83
  */
84
84
  multiline?: boolean;
85
+ /**
86
+ * Указывает, где открыть скачиваемый документ
87
+ */
88
+ target?: HTMLAttributeAnchorTarget;
85
89
  /**
86
90
  * Идентификатор для систем автоматизированного тестирования
87
91
  */
@@ -10,10 +10,10 @@ import { CrossSIcon } from '@alfalab/icons-glyph/CrossSIcon';
10
10
  import { PointerDownSIcon } from '@alfalab/icons-glyph/PointerDownSIcon';
11
11
  import { humanFileSize, fileIcon } from './utils.js';
12
12
 
13
- const styles = {"component":"file-upload-item__component_1vzfs","infoSection":"file-upload-item__infoSection_1vzfs","info":"file-upload-item__info_1vzfs","icon":"file-upload-item__icon_1vzfs","errorIcon":"file-upload-item__errorIcon_1vzfs","successIcon":"file-upload-item__successIcon_1vzfs","name":"file-upload-item__name_1vzfs","rowLimit":"file-upload-item__rowLimit_1vzfs","meta":"file-upload-item__meta_1vzfs","size":"file-upload-item__size_1vzfs","delete":"file-upload-item__delete_1vzfs","download":"file-upload-item__download_1vzfs","errorWrapper":"file-upload-item__errorWrapper_1vzfs","restore":"file-upload-item__restore_1vzfs","spinnerWrapper":"file-upload-item__spinnerWrapper_1vzfs","spinner":"file-upload-item__spinner_1vzfs","uploadPercent":"file-upload-item__uploadPercent_1vzfs"};
13
+ const styles = {"component":"file-upload-item__component_18dki","infoSection":"file-upload-item__infoSection_18dki","info":"file-upload-item__info_18dki","icon":"file-upload-item__icon_18dki","errorIcon":"file-upload-item__errorIcon_18dki","successIcon":"file-upload-item__successIcon_18dki","name":"file-upload-item__name_18dki","rowLimit":"file-upload-item__rowLimit_18dki","meta":"file-upload-item__meta_18dki","size":"file-upload-item__size_18dki","delete":"file-upload-item__delete_18dki","download":"file-upload-item__download_18dki","errorWrapper":"file-upload-item__errorWrapper_18dki","restore":"file-upload-item__restore_18dki","spinnerWrapper":"file-upload-item__spinnerWrapper_18dki","spinner":"file-upload-item__spinner_18dki","uploadPercent":"file-upload-item__uploadPercent_18dki"};
14
14
  require('./index.css')
15
15
 
16
- const FileUploadItem = ({ className, children, id = '0', name = '', size, icon: Icon = fileIcon(name), uploadDate, downloadLink, download, uploadStatus, uploadPercent = 0, error, showDelete, showRestore, onDelete, onDownload, onRestore, disableButtons, multiline = false, dataTestId, }) => {
16
+ const FileUploadItem = ({ className, children, id = '0', name = '', size, icon: Icon = fileIcon(name), uploadDate, downloadLink, download, uploadStatus, uploadPercent = 0, error, showDelete, showRestore, onDelete, onDownload, onRestore, disableButtons, multiline = false, target, dataTestId, }) => {
17
17
  const handleDownload = (event) => {
18
18
  if (onDownload) {
19
19
  event.preventDefault();
@@ -65,7 +65,7 @@ const FileUploadItem = ({ className, children, id = '0', name = '', size, icon:
65
65
  uploadDate && React.createElement("span", { key: uploadDate }, uploadDate),
66
66
  size && (React.createElement("span", { key: size, className: styles.size }, humanFileSize(size)))))),
67
67
  showRestore && (React.createElement(Link, { pseudo: true, className: styles.restore, onClick: handleRestore }, "\u0412\u043E\u0441\u0441\u0442\u0430\u043D\u043E\u0432\u0438\u0442\u044C")),
68
- showDownload && (React.createElement(IconButton, { size: 'xxs', icon: PointerDownSIcon, className: styles.download, "aria-label": '\u0441\u043A\u0430\u0447\u0430\u0442\u044C', href: downloadLink, onClick: handleDownload, disabled: disableButtons, download: download })),
68
+ showDownload && (React.createElement(IconButton, { size: 'xxs', icon: PointerDownSIcon, className: styles.download, "aria-label": '\u0441\u043A\u0430\u0447\u0430\u0442\u044C', href: downloadLink, onClick: handleDownload, disabled: disableButtons, download: download, target: target })),
69
69
  showDelete && !showRestore && (React.createElement(IconButton, { size: 'xxs', icon: CrossSIcon, onClick: handleDelete, disabled: disableButtons, className: styles.delete, "aria-label": '\u0443\u0434\u0430\u043B\u0438\u0442\u044C' }))));
70
70
  };
71
71
 
package/modern/index.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: dt4qp */
1
+ /* hash: 1rs3w */
2
2
  :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
3
3
  } /* deprecated */ :root {
4
4
  --color-light-neutral-300: #e7e8eb;
@@ -30,7 +30,7 @@
30
30
  /* новые значения, используйте их */
31
31
  } :root {
32
32
  } :root {
33
- } .file-upload-item__component_1vzfs {
33
+ } .file-upload-item__component_18dki {
34
34
  font-size: 13px;
35
35
  line-height: 16px;
36
36
  font-weight: 400;
@@ -42,78 +42,78 @@
42
42
  color: var(--color-light-text-secondary);
43
43
  box-shadow: 0 -1px 0 0 var(--color-light-neutral-300) inset;
44
44
  box-sizing: border-box
45
- } .file-upload-item__component_1vzfs svg {
45
+ } .file-upload-item__component_18dki svg {
46
46
  display: block;
47
- } .file-upload-item__component_1vzfs:last-child {
47
+ } .file-upload-item__component_18dki:last-child {
48
48
  box-shadow: none;
49
- } .file-upload-item__infoSection_1vzfs {
49
+ } .file-upload-item__infoSection_18dki {
50
50
  display: flex;
51
51
  flex-direction: column;
52
52
  flex: 1;
53
53
  margin-top: var(--gap-2xs);
54
54
  margin-left: var(--gap-s);
55
55
  min-width: 40%;
56
- } .file-upload-item__info_1vzfs {
56
+ } .file-upload-item__info_18dki {
57
57
  display: flex;
58
58
  flex-wrap: wrap;
59
59
  flex: 1;
60
60
  overflow: hidden;
61
- } .file-upload-item__icon_1vzfs {
61
+ } .file-upload-item__icon_18dki {
62
62
  display: block;
63
63
  flex-shrink: 0;
64
64
  color: var(--color-light-neutral-translucent-1300);
65
- } .file-upload-item__errorIcon_1vzfs {
65
+ } .file-upload-item__errorIcon_18dki {
66
66
  flex-shrink: 0;
67
67
  color: var(--color-light-status-negative);
68
- } .file-upload-item__successIcon_1vzfs {
68
+ } .file-upload-item__successIcon_18dki {
69
69
  flex-shrink: 0;
70
70
  color: var(--color-light-status-positive);
71
- } .file-upload-item__name_1vzfs {
71
+ } .file-upload-item__name_18dki {
72
72
  color: var(--color-light-text-primary)
73
- } .file-upload-item__name_1vzfs a {
73
+ } .file-upload-item__name_18dki a {
74
74
  display: block;
75
75
  margin-bottom: 1px;
76
- } .file-upload-item__name_1vzfs.file-upload-item__rowLimit_1vzfs {
76
+ } .file-upload-item__name_18dki.file-upload-item__rowLimit_18dki {
77
77
  white-space: nowrap;
78
78
  overflow: hidden;
79
79
  text-overflow: ellipsis;
80
- } .file-upload-item__meta_1vzfs {
80
+ } .file-upload-item__meta_18dki {
81
81
  display: flex;
82
82
  white-space: nowrap;
83
83
  margin-right: var(--gap-2xs);
84
84
  margin-left: 36px;
85
85
  padding: var(--gap-2xs) 0
86
- } .file-upload-item__meta_1vzfs > * {
86
+ } .file-upload-item__meta_18dki > * {
87
87
  margin-right: var(--gap-s)
88
- } .file-upload-item__meta_1vzfs > *:last-child {
88
+ } .file-upload-item__meta_18dki > *:last-child {
89
89
  margin-right: 0;
90
- } .file-upload-item__size_1vzfs {
90
+ } .file-upload-item__size_18dki {
91
91
  text-align: right;
92
- } .file-upload-item__delete_1vzfs,
93
- .file-upload-item__download_1vzfs {
92
+ } .file-upload-item__delete_18dki,
93
+ .file-upload-item__download_18dki {
94
94
  height: 24px;
95
95
  width: 24px;
96
96
  margin-left: var(--gap-xs);
97
- } .file-upload-item__errorWrapper_1vzfs {
97
+ } .file-upload-item__errorWrapper_18dki {
98
98
  margin-top: var(--gap-2xs);
99
99
  color: var(--color-light-text-negative);
100
- } .file-upload-item__restore_1vzfs {
100
+ } .file-upload-item__restore_18dki {
101
101
  font-size: 14px;
102
102
  line-height: 20px;
103
103
  font-weight: 400;
104
104
 
105
105
  margin-left: var(--gap-s);
106
106
  margin-top: var(--gap-3xs);
107
- } .file-upload-item__spinnerWrapper_1vzfs {
107
+ } .file-upload-item__spinnerWrapper_18dki {
108
108
  display: flex;
109
109
  justify-content: center;
110
110
  align-items: center;
111
111
  width: 24px;
112
112
  height: 24px;
113
- } .file-upload-item__spinner_1vzfs {
113
+ } .file-upload-item__spinner_18dki {
114
114
  width: 20px;
115
115
  height: 20px;
116
- } .file-upload-item__uploadPercent_1vzfs {
116
+ } .file-upload-item__uploadPercent_18dki {
117
117
  margin-top: var(--gap-2xs);
118
118
  margin-left: var(--gap-xl);
119
119
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@alfalab/core-components-file-upload-item",
3
- "version": "5.6.10",
3
+ "version": "5.7.0",
4
4
  "description": "",
5
5
  "keywords": [],
6
6
  "license": "MIT",
package/src/Component.tsx CHANGED
@@ -1,4 +1,4 @@
1
- import React, { ElementType, MouseEvent, ReactNode } from 'react';
1
+ import React, { ElementType, HTMLAttributeAnchorTarget, MouseEvent, ReactNode } from 'react';
2
2
  import cn from 'classnames';
3
3
 
4
4
  import { IconButton } from '@alfalab/core-components-icon-button';
@@ -113,6 +113,11 @@ export type FileUploadItemProps = {
113
113
  */
114
114
  multiline?: boolean;
115
115
 
116
+ /**
117
+ * Указывает, где открыть скачиваемый документ
118
+ */
119
+ target?: HTMLAttributeAnchorTarget;
120
+
116
121
  /**
117
122
  * Идентификатор для систем автоматизированного тестирования
118
123
  */
@@ -139,6 +144,7 @@ export const FileUploadItem: React.FC<FileUploadItemProps> = ({
139
144
  onRestore,
140
145
  disableButtons,
141
146
  multiline = false,
147
+ target,
142
148
  dataTestId,
143
149
  }) => {
144
150
  const handleDownload = (event: MouseEvent<HTMLElement>) => {
@@ -249,6 +255,7 @@ export const FileUploadItem: React.FC<FileUploadItemProps> = ({
249
255
  onClick={handleDownload}
250
256
  disabled={disableButtons}
251
257
  download={download}
258
+ target={target}
252
259
  />
253
260
  )}
254
261