@alfalab/core-components-file-upload-item 5.1.5 → 5.1.7

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.js CHANGED
@@ -7,16 +7,16 @@ var cn = require('classnames');
7
7
  var coreComponentsIconButton = require('@alfalab/core-components-icon-button');
8
8
  var coreComponentsLink = require('@alfalab/core-components-link');
9
9
  var coreComponentsSpinner = require('@alfalab/core-components-spinner');
10
- var CrossMIcon = require('@alfalab/icons-glyph/CrossMIcon');
11
- var CheckmarkCircleMIcon = require('@alfalab/icons-glyph/CheckmarkCircleMIcon');
12
10
  var AlertCircleMIcon = require('@alfalab/icons-glyph/AlertCircleMIcon');
13
- var PointerDownMIcon = require('@alfalab/icons-glyph/PointerDownMIcon');
11
+ var CheckmarkCircleMIcon = require('@alfalab/icons-glyph/CheckmarkCircleMIcon');
14
12
  var ClockMIcon = require('@alfalab/icons-glyph/ClockMIcon');
13
+ var CrossSIcon = require('@alfalab/icons-glyph/CrossSIcon');
14
+ var PointerDownSIcon = require('@alfalab/icons-glyph/PointerDownSIcon');
15
15
  require('@alfalab/icons-glyph/DocumentDocMIcon');
16
+ require('@alfalab/icons-glyph/DocumentImageMIcon');
16
17
  require('@alfalab/icons-glyph/DocumentPdfMIcon');
17
18
  require('@alfalab/icons-glyph/DocumentTxtMIcon');
18
19
  require('@alfalab/icons-glyph/DocumentUnknownMIcon');
19
- require('@alfalab/icons-glyph/DocumentImageMIcon');
20
20
  var utils = require('./utils.js');
21
21
 
22
22
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -24,7 +24,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
24
24
  var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
25
25
  var cn__default = /*#__PURE__*/_interopDefaultLegacy(cn);
26
26
 
27
- var styles = {"component":"file-upload-item__component_1g1pw","infoSection":"file-upload-item__infoSection_1g1pw","info":"file-upload-item__info_1g1pw","icon":"file-upload-item__icon_1g1pw","errorIcon":"file-upload-item__errorIcon_1g1pw","successIcon":"file-upload-item__successIcon_1g1pw","name":"file-upload-item__name_1g1pw","meta":"file-upload-item__meta_1g1pw","size":"file-upload-item__size_1g1pw","delete":"file-upload-item__delete_1g1pw","download":"file-upload-item__download_1g1pw","errorWrapper":"file-upload-item__errorWrapper_1g1pw","restore":"file-upload-item__restore_1g1pw","spinnerWrapper":"file-upload-item__spinnerWrapper_1g1pw","spinner":"file-upload-item__spinner_1g1pw","uploadPercent":"file-upload-item__uploadPercent_1g1pw"};
27
+ var styles = {"component":"file-upload-item__component_w4zr7","infoSection":"file-upload-item__infoSection_w4zr7","info":"file-upload-item__info_w4zr7","icon":"file-upload-item__icon_w4zr7","errorIcon":"file-upload-item__errorIcon_w4zr7","successIcon":"file-upload-item__successIcon_w4zr7","name":"file-upload-item__name_w4zr7","meta":"file-upload-item__meta_w4zr7","size":"file-upload-item__size_w4zr7","delete":"file-upload-item__delete_w4zr7","download":"file-upload-item__download_w4zr7","errorWrapper":"file-upload-item__errorWrapper_w4zr7","restore":"file-upload-item__restore_w4zr7","spinnerWrapper":"file-upload-item__spinnerWrapper_w4zr7","spinner":"file-upload-item__spinner_w4zr7","uploadPercent":"file-upload-item__uploadPercent_w4zr7"};
28
28
  require('./index.css')
29
29
 
30
30
  var FileUploadItem = function (_a) {
@@ -80,8 +80,8 @@ var FileUploadItem = function (_a) {
80
80
  uploadDate && React__default['default'].createElement("span", { key: uploadDate }, uploadDate),
81
81
  size && (React__default['default'].createElement("span", { key: size, className: styles.size }, utils.humanFileSize(size)))))),
82
82
  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")),
83
- showDownload && (React__default['default'].createElement(coreComponentsIconButton.IconButton, { size: 'xxs', icon: PointerDownMIcon.PointerDownMIcon, className: styles.download, "aria-label": '\u0441\u043A\u0430\u0447\u0430\u0442\u044C', href: downloadLink, onClick: handleDownload, disabled: disableButtons, download: download })),
84
- showDelete && !showRestore && (React__default['default'].createElement(coreComponentsIconButton.IconButton, { size: 'xxs', icon: CrossMIcon.CrossMIcon, onClick: handleDelete, disabled: disableButtons, className: styles.delete, "aria-label": '\u0443\u0434\u0430\u043B\u0438\u0442\u044C' }))));
83
+ 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 })),
84
+ 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' }))));
85
85
  };
86
86
 
87
87
  exports.FileUploadItem = FileUploadItem;
package/cssm/Component.js CHANGED
@@ -7,16 +7,16 @@ var cn = require('classnames');
7
7
  var coreComponentsIconButton = require('@alfalab/core-components-icon-button/cssm');
8
8
  var coreComponentsLink = require('@alfalab/core-components-link/cssm');
9
9
  var coreComponentsSpinner = require('@alfalab/core-components-spinner/cssm');
10
- var CrossMIcon = require('@alfalab/icons-glyph/CrossMIcon');
11
- var CheckmarkCircleMIcon = require('@alfalab/icons-glyph/CheckmarkCircleMIcon');
12
10
  var AlertCircleMIcon = require('@alfalab/icons-glyph/AlertCircleMIcon');
13
- var PointerDownMIcon = require('@alfalab/icons-glyph/PointerDownMIcon');
11
+ var CheckmarkCircleMIcon = require('@alfalab/icons-glyph/CheckmarkCircleMIcon');
14
12
  var ClockMIcon = require('@alfalab/icons-glyph/ClockMIcon');
13
+ var CrossSIcon = require('@alfalab/icons-glyph/CrossSIcon');
14
+ var PointerDownSIcon = require('@alfalab/icons-glyph/PointerDownSIcon');
15
15
  require('@alfalab/icons-glyph/DocumentDocMIcon');
16
+ require('@alfalab/icons-glyph/DocumentImageMIcon');
16
17
  require('@alfalab/icons-glyph/DocumentPdfMIcon');
17
18
  require('@alfalab/icons-glyph/DocumentTxtMIcon');
18
19
  require('@alfalab/icons-glyph/DocumentUnknownMIcon');
19
- require('@alfalab/icons-glyph/DocumentImageMIcon');
20
20
  var utils = require('./utils.js');
21
21
  var styles = require('./index.module.css');
22
22
 
@@ -79,8 +79,8 @@ var FileUploadItem = function (_a) {
79
79
  uploadDate && React__default['default'].createElement("span", { key: uploadDate }, uploadDate),
80
80
  size && (React__default['default'].createElement("span", { key: size, className: styles__default['default'].size }, utils.humanFileSize(size)))))),
81
81
  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")),
82
- showDownload && (React__default['default'].createElement(coreComponentsIconButton.IconButton, { size: 'xxs', icon: PointerDownMIcon.PointerDownMIcon, className: styles__default['default'].download, "aria-label": '\u0441\u043A\u0430\u0447\u0430\u0442\u044C', href: downloadLink, onClick: handleDownload, disabled: disableButtons, download: download })),
83
- showDelete && !showRestore && (React__default['default'].createElement(coreComponentsIconButton.IconButton, { size: 'xxs', icon: CrossMIcon.CrossMIcon, onClick: handleDelete, disabled: disableButtons, className: styles__default['default'].delete, "aria-label": '\u0443\u0434\u0430\u043B\u0438\u0442\u044C' }))));
82
+ 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 })),
83
+ 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' }))));
84
84
  };
85
85
 
86
86
  exports.FileUploadItem = FileUploadItem;
package/cssm/index.js CHANGED
@@ -7,16 +7,16 @@ require('classnames');
7
7
  require('@alfalab/core-components-icon-button/cssm');
8
8
  require('@alfalab/core-components-link/cssm');
9
9
  require('@alfalab/core-components-spinner/cssm');
10
- require('@alfalab/icons-glyph/CrossMIcon');
11
- require('@alfalab/icons-glyph/CheckmarkCircleMIcon');
12
10
  require('@alfalab/icons-glyph/AlertCircleMIcon');
13
- require('@alfalab/icons-glyph/PointerDownMIcon');
11
+ require('@alfalab/icons-glyph/CheckmarkCircleMIcon');
14
12
  require('@alfalab/icons-glyph/ClockMIcon');
13
+ require('@alfalab/icons-glyph/CrossSIcon');
14
+ require('@alfalab/icons-glyph/PointerDownSIcon');
15
15
  require('@alfalab/icons-glyph/DocumentDocMIcon');
16
+ require('@alfalab/icons-glyph/DocumentImageMIcon');
16
17
  require('@alfalab/icons-glyph/DocumentPdfMIcon');
17
18
  require('@alfalab/icons-glyph/DocumentTxtMIcon');
18
19
  require('@alfalab/icons-glyph/DocumentUnknownMIcon');
19
- require('@alfalab/icons-glyph/DocumentImageMIcon');
20
20
  require('./utils.js');
21
21
  require('./index.module.css');
22
22
  var Component = require('./Component.js');
@@ -93,12 +93,8 @@
93
93
  .download {
94
94
  height: 24px;
95
95
  width: 24px;
96
- margin-left: var(--gap-xs)
96
+ margin-left: var(--gap-xs);
97
97
  }
98
- .delete svg, .download svg {
99
- width: 18px;
100
- height: 18px;
101
- }
102
98
  .errorWrapper {
103
99
  margin-top: var(--gap-s);
104
100
  color: var(--color-light-text-accent)
package/cssm/utils.js CHANGED
@@ -3,10 +3,10 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  var DocumentDocMIcon = require('@alfalab/icons-glyph/DocumentDocMIcon');
6
+ var DocumentImageMIcon = require('@alfalab/icons-glyph/DocumentImageMIcon');
6
7
  var DocumentPdfMIcon = require('@alfalab/icons-glyph/DocumentPdfMIcon');
7
8
  var DocumentTxtMIcon = require('@alfalab/icons-glyph/DocumentTxtMIcon');
8
9
  var DocumentUnknownMIcon = require('@alfalab/icons-glyph/DocumentUnknownMIcon');
9
- var DocumentImageMIcon = require('@alfalab/icons-glyph/DocumentImageMIcon');
10
10
 
11
11
  function humanFileSize(size) {
12
12
  var units = ['B', 'KB', 'MB', 'GB'];
package/esm/Component.js CHANGED
@@ -3,19 +3,19 @@ import cn from 'classnames';
3
3
  import { IconButton } from '@alfalab/core-components-icon-button/esm';
4
4
  import { Link } from '@alfalab/core-components-link/esm';
5
5
  import { Spinner } from '@alfalab/core-components-spinner/esm';
6
- import { CrossMIcon } from '@alfalab/icons-glyph/CrossMIcon';
7
- import { CheckmarkCircleMIcon } from '@alfalab/icons-glyph/CheckmarkCircleMIcon';
8
6
  import { AlertCircleMIcon } from '@alfalab/icons-glyph/AlertCircleMIcon';
9
- import { PointerDownMIcon } from '@alfalab/icons-glyph/PointerDownMIcon';
7
+ import { CheckmarkCircleMIcon } from '@alfalab/icons-glyph/CheckmarkCircleMIcon';
10
8
  import { ClockMIcon } from '@alfalab/icons-glyph/ClockMIcon';
9
+ import { CrossSIcon } from '@alfalab/icons-glyph/CrossSIcon';
10
+ import { PointerDownSIcon } from '@alfalab/icons-glyph/PointerDownSIcon';
11
11
  import '@alfalab/icons-glyph/DocumentDocMIcon';
12
+ import '@alfalab/icons-glyph/DocumentImageMIcon';
12
13
  import '@alfalab/icons-glyph/DocumentPdfMIcon';
13
14
  import '@alfalab/icons-glyph/DocumentTxtMIcon';
14
15
  import '@alfalab/icons-glyph/DocumentUnknownMIcon';
15
- import '@alfalab/icons-glyph/DocumentImageMIcon';
16
16
  import { fileIcon, humanFileSize } from './utils.js';
17
17
 
18
- var styles = {"component":"file-upload-item__component_1g1pw","infoSection":"file-upload-item__infoSection_1g1pw","info":"file-upload-item__info_1g1pw","icon":"file-upload-item__icon_1g1pw","errorIcon":"file-upload-item__errorIcon_1g1pw","successIcon":"file-upload-item__successIcon_1g1pw","name":"file-upload-item__name_1g1pw","meta":"file-upload-item__meta_1g1pw","size":"file-upload-item__size_1g1pw","delete":"file-upload-item__delete_1g1pw","download":"file-upload-item__download_1g1pw","errorWrapper":"file-upload-item__errorWrapper_1g1pw","restore":"file-upload-item__restore_1g1pw","spinnerWrapper":"file-upload-item__spinnerWrapper_1g1pw","spinner":"file-upload-item__spinner_1g1pw","uploadPercent":"file-upload-item__uploadPercent_1g1pw"};
18
+ var styles = {"component":"file-upload-item__component_w4zr7","infoSection":"file-upload-item__infoSection_w4zr7","info":"file-upload-item__info_w4zr7","icon":"file-upload-item__icon_w4zr7","errorIcon":"file-upload-item__errorIcon_w4zr7","successIcon":"file-upload-item__successIcon_w4zr7","name":"file-upload-item__name_w4zr7","meta":"file-upload-item__meta_w4zr7","size":"file-upload-item__size_w4zr7","delete":"file-upload-item__delete_w4zr7","download":"file-upload-item__download_w4zr7","errorWrapper":"file-upload-item__errorWrapper_w4zr7","restore":"file-upload-item__restore_w4zr7","spinnerWrapper":"file-upload-item__spinnerWrapper_w4zr7","spinner":"file-upload-item__spinner_w4zr7","uploadPercent":"file-upload-item__uploadPercent_w4zr7"};
19
19
  require('./index.css')
20
20
 
21
21
  var FileUploadItem = function (_a) {
@@ -71,8 +71,8 @@ var FileUploadItem = function (_a) {
71
71
  uploadDate && React.createElement("span", { key: uploadDate }, uploadDate),
72
72
  size && (React.createElement("span", { key: size, className: styles.size }, humanFileSize(size)))))),
73
73
  showRestore && (React.createElement(Link, { pseudo: true, className: styles.restore, onClick: handleRestore }, "\u0412\u043E\u0441\u0441\u0442\u0430\u043D\u043E\u0432\u0438\u0442\u044C")),
74
- showDownload && (React.createElement(IconButton, { size: 'xxs', icon: PointerDownMIcon, className: styles.download, "aria-label": '\u0441\u043A\u0430\u0447\u0430\u0442\u044C', href: downloadLink, onClick: handleDownload, disabled: disableButtons, download: download })),
75
- showDelete && !showRestore && (React.createElement(IconButton, { size: 'xxs', icon: CrossMIcon, onClick: handleDelete, disabled: disableButtons, className: styles.delete, "aria-label": '\u0443\u0434\u0430\u043B\u0438\u0442\u044C' }))));
74
+ 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 })),
75
+ 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' }))));
76
76
  };
77
77
 
78
78
  export { FileUploadItem };
package/esm/index.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: 1cjtj */
1
+ /* hash: kvk7c */
2
2
  :root {
3
3
  --color-light-border-primary: #dbdee1;
4
4
  --color-light-graphic-negative: #f15045;
@@ -22,7 +22,7 @@
22
22
  --gap-s: 12px;
23
23
  --gap-xl: 24px;
24
24
  }
25
- .file-upload-item__component_1g1pw {
25
+ .file-upload-item__component_w4zr7 {
26
26
  font-size: 13px;
27
27
  line-height: 16px;
28
28
  font-weight: 400;
@@ -34,10 +34,10 @@
34
34
  box-shadow: 0 -1px 0 0 var(--color-light-border-primary) inset;
35
35
  box-sizing: border-box
36
36
  }
37
- .file-upload-item__component_1g1pw svg {
37
+ .file-upload-item__component_w4zr7 svg {
38
38
  display: block;
39
39
  }
40
- .file-upload-item__infoSection_1g1pw {
40
+ .file-upload-item__infoSection_w4zr7 {
41
41
  display: flex;
42
42
  flex-direction: column;
43
43
  flex: 1;
@@ -45,90 +45,86 @@
45
45
  margin-left: var(--gap-s);
46
46
  min-width: 40%;
47
47
  }
48
- .file-upload-item__info_1g1pw {
48
+ .file-upload-item__info_w4zr7 {
49
49
  display: flex;
50
50
  flex-wrap: wrap;
51
51
  flex: 1;
52
52
  overflow: hidden;
53
53
  }
54
- .file-upload-item__icon_1g1pw {
54
+ .file-upload-item__icon_w4zr7 {
55
55
  display: block;
56
56
  flex-shrink: 0;
57
57
  color: var(--color-light-text-primary);
58
58
  }
59
- .file-upload-item__errorIcon_1g1pw {
59
+ .file-upload-item__errorIcon_w4zr7 {
60
60
  flex-shrink: 0;
61
61
  color: var(--color-light-graphic-negative);
62
62
  }
63
- .file-upload-item__successIcon_1g1pw {
63
+ .file-upload-item__successIcon_w4zr7 {
64
64
  flex-shrink: 0;
65
65
  color: var(--color-light-graphic-positive);
66
66
  }
67
- .file-upload-item__name_1g1pw {
67
+ .file-upload-item__name_w4zr7 {
68
68
  white-space: nowrap;
69
69
  overflow: hidden;
70
70
  text-overflow: ellipsis;
71
71
  color: var(--color-light-text-primary)
72
72
  }
73
- .file-upload-item__name_1g1pw a {
73
+ .file-upload-item__name_w4zr7 a {
74
74
  display: block;
75
75
  margin-bottom: 1px;
76
76
  }
77
- .file-upload-item__meta_1g1pw {
77
+ .file-upload-item__meta_w4zr7 {
78
78
  display: flex;
79
79
  white-space: nowrap;
80
80
  margin-right: var(--gap-2xs);
81
81
  margin-left: var(--gap-xl);
82
82
  padding: var(--gap-2xs) 0
83
83
  }
84
- .file-upload-item__meta_1g1pw > * {
84
+ .file-upload-item__meta_w4zr7 > * {
85
85
  margin-right: var(--gap-s)
86
86
  }
87
- .file-upload-item__meta_1g1pw > *:last-child {
87
+ .file-upload-item__meta_w4zr7 > *:last-child {
88
88
  margin-right: 0;
89
89
  }
90
- .file-upload-item__size_1g1pw {
90
+ .file-upload-item__size_w4zr7 {
91
91
  text-align: right;
92
92
  }
93
- .file-upload-item__delete_1g1pw,
94
- .file-upload-item__download_1g1pw {
93
+ .file-upload-item__delete_w4zr7,
94
+ .file-upload-item__download_w4zr7 {
95
95
  height: 24px;
96
96
  width: 24px;
97
- margin-left: var(--gap-xs)
97
+ margin-left: var(--gap-xs);
98
98
  }
99
- .file-upload-item__delete_1g1pw svg, .file-upload-item__download_1g1pw svg {
100
- width: 18px;
101
- height: 18px;
102
- }
103
- .file-upload-item__errorWrapper_1g1pw {
99
+ .file-upload-item__errorWrapper_w4zr7 {
104
100
  margin-top: var(--gap-s);
105
101
  color: var(--color-light-text-accent)
106
102
  }
107
103
  @media (--small-only) {
108
- .file-upload-item__errorWrapper_1g1pw {
104
+ .file-upload-item__errorWrapper_w4zr7 {
109
105
  flex: 1 0 100%;
110
106
  margin-top: var(--gap-3xs)
111
107
  }
112
108
  }
113
- .file-upload-item__restore_1g1pw {
109
+ .file-upload-item__restore_w4zr7 {
114
110
  font-size: 14px;
115
111
  line-height: 20px;
116
112
  font-weight: 400;
117
113
 
118
114
  margin-left: var(--gap-s);
119
115
  }
120
- .file-upload-item__spinnerWrapper_1g1pw {
116
+ .file-upload-item__spinnerWrapper_w4zr7 {
121
117
  display: flex;
122
118
  justify-content: center;
123
119
  align-items: center;
124
120
  width: 24px;
125
121
  height: 24px;
126
122
  }
127
- .file-upload-item__spinner_1g1pw {
123
+ .file-upload-item__spinner_w4zr7 {
128
124
  width: 20px;
129
125
  height: 20px;
130
126
  }
131
- .file-upload-item__uploadPercent_1g1pw {
127
+ .file-upload-item__uploadPercent_w4zr7 {
132
128
  margin-top: var(--gap-2xs);
133
129
  margin-left: var(--gap-xl);
134
130
  }
package/esm/index.js CHANGED
@@ -3,15 +3,15 @@ import 'classnames';
3
3
  import '@alfalab/core-components-icon-button/esm';
4
4
  import '@alfalab/core-components-link/esm';
5
5
  import '@alfalab/core-components-spinner/esm';
6
- import '@alfalab/icons-glyph/CrossMIcon';
7
- import '@alfalab/icons-glyph/CheckmarkCircleMIcon';
8
6
  import '@alfalab/icons-glyph/AlertCircleMIcon';
9
- import '@alfalab/icons-glyph/PointerDownMIcon';
7
+ import '@alfalab/icons-glyph/CheckmarkCircleMIcon';
10
8
  import '@alfalab/icons-glyph/ClockMIcon';
9
+ import '@alfalab/icons-glyph/CrossSIcon';
10
+ import '@alfalab/icons-glyph/PointerDownSIcon';
11
11
  import '@alfalab/icons-glyph/DocumentDocMIcon';
12
+ import '@alfalab/icons-glyph/DocumentImageMIcon';
12
13
  import '@alfalab/icons-glyph/DocumentPdfMIcon';
13
14
  import '@alfalab/icons-glyph/DocumentTxtMIcon';
14
15
  import '@alfalab/icons-glyph/DocumentUnknownMIcon';
15
- import '@alfalab/icons-glyph/DocumentImageMIcon';
16
16
  import './utils.js';
17
17
  export { FileUploadItem } from './Component.js';
package/esm/utils.js CHANGED
@@ -1,8 +1,8 @@
1
1
  import { DocumentDocMIcon } from '@alfalab/icons-glyph/DocumentDocMIcon';
2
+ import { DocumentImageMIcon } from '@alfalab/icons-glyph/DocumentImageMIcon';
2
3
  import { DocumentPdfMIcon } from '@alfalab/icons-glyph/DocumentPdfMIcon';
3
4
  import { DocumentTxtMIcon } from '@alfalab/icons-glyph/DocumentTxtMIcon';
4
5
  import { DocumentUnknownMIcon } from '@alfalab/icons-glyph/DocumentUnknownMIcon';
5
- import { DocumentImageMIcon } from '@alfalab/icons-glyph/DocumentImageMIcon';
6
6
 
7
7
  function humanFileSize(size) {
8
8
  var units = ['B', 'KB', 'MB', 'GB'];
package/index.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: 1cjtj */
1
+ /* hash: kvk7c */
2
2
  :root {
3
3
  --color-light-border-primary: #dbdee1;
4
4
  --color-light-graphic-negative: #f15045;
@@ -22,7 +22,7 @@
22
22
  --gap-s: 12px;
23
23
  --gap-xl: 24px;
24
24
  }
25
- .file-upload-item__component_1g1pw {
25
+ .file-upload-item__component_w4zr7 {
26
26
  font-size: 13px;
27
27
  line-height: 16px;
28
28
  font-weight: 400;
@@ -34,10 +34,10 @@
34
34
  box-shadow: 0 -1px 0 0 var(--color-light-border-primary) inset;
35
35
  box-sizing: border-box
36
36
  }
37
- .file-upload-item__component_1g1pw svg {
37
+ .file-upload-item__component_w4zr7 svg {
38
38
  display: block;
39
39
  }
40
- .file-upload-item__infoSection_1g1pw {
40
+ .file-upload-item__infoSection_w4zr7 {
41
41
  display: flex;
42
42
  flex-direction: column;
43
43
  flex: 1;
@@ -45,90 +45,86 @@
45
45
  margin-left: var(--gap-s);
46
46
  min-width: 40%;
47
47
  }
48
- .file-upload-item__info_1g1pw {
48
+ .file-upload-item__info_w4zr7 {
49
49
  display: flex;
50
50
  flex-wrap: wrap;
51
51
  flex: 1;
52
52
  overflow: hidden;
53
53
  }
54
- .file-upload-item__icon_1g1pw {
54
+ .file-upload-item__icon_w4zr7 {
55
55
  display: block;
56
56
  flex-shrink: 0;
57
57
  color: var(--color-light-text-primary);
58
58
  }
59
- .file-upload-item__errorIcon_1g1pw {
59
+ .file-upload-item__errorIcon_w4zr7 {
60
60
  flex-shrink: 0;
61
61
  color: var(--color-light-graphic-negative);
62
62
  }
63
- .file-upload-item__successIcon_1g1pw {
63
+ .file-upload-item__successIcon_w4zr7 {
64
64
  flex-shrink: 0;
65
65
  color: var(--color-light-graphic-positive);
66
66
  }
67
- .file-upload-item__name_1g1pw {
67
+ .file-upload-item__name_w4zr7 {
68
68
  white-space: nowrap;
69
69
  overflow: hidden;
70
70
  text-overflow: ellipsis;
71
71
  color: var(--color-light-text-primary)
72
72
  }
73
- .file-upload-item__name_1g1pw a {
73
+ .file-upload-item__name_w4zr7 a {
74
74
  display: block;
75
75
  margin-bottom: 1px;
76
76
  }
77
- .file-upload-item__meta_1g1pw {
77
+ .file-upload-item__meta_w4zr7 {
78
78
  display: flex;
79
79
  white-space: nowrap;
80
80
  margin-right: var(--gap-2xs);
81
81
  margin-left: var(--gap-xl);
82
82
  padding: var(--gap-2xs) 0
83
83
  }
84
- .file-upload-item__meta_1g1pw > * {
84
+ .file-upload-item__meta_w4zr7 > * {
85
85
  margin-right: var(--gap-s)
86
86
  }
87
- .file-upload-item__meta_1g1pw > *:last-child {
87
+ .file-upload-item__meta_w4zr7 > *:last-child {
88
88
  margin-right: 0;
89
89
  }
90
- .file-upload-item__size_1g1pw {
90
+ .file-upload-item__size_w4zr7 {
91
91
  text-align: right;
92
92
  }
93
- .file-upload-item__delete_1g1pw,
94
- .file-upload-item__download_1g1pw {
93
+ .file-upload-item__delete_w4zr7,
94
+ .file-upload-item__download_w4zr7 {
95
95
  height: 24px;
96
96
  width: 24px;
97
- margin-left: var(--gap-xs)
97
+ margin-left: var(--gap-xs);
98
98
  }
99
- .file-upload-item__delete_1g1pw svg, .file-upload-item__download_1g1pw svg {
100
- width: 18px;
101
- height: 18px;
102
- }
103
- .file-upload-item__errorWrapper_1g1pw {
99
+ .file-upload-item__errorWrapper_w4zr7 {
104
100
  margin-top: var(--gap-s);
105
101
  color: var(--color-light-text-accent)
106
102
  }
107
103
  @media (--small-only) {
108
- .file-upload-item__errorWrapper_1g1pw {
104
+ .file-upload-item__errorWrapper_w4zr7 {
109
105
  flex: 1 0 100%;
110
106
  margin-top: var(--gap-3xs)
111
107
  }
112
108
  }
113
- .file-upload-item__restore_1g1pw {
109
+ .file-upload-item__restore_w4zr7 {
114
110
  font-size: 14px;
115
111
  line-height: 20px;
116
112
  font-weight: 400;
117
113
 
118
114
  margin-left: var(--gap-s);
119
115
  }
120
- .file-upload-item__spinnerWrapper_1g1pw {
116
+ .file-upload-item__spinnerWrapper_w4zr7 {
121
117
  display: flex;
122
118
  justify-content: center;
123
119
  align-items: center;
124
120
  width: 24px;
125
121
  height: 24px;
126
122
  }
127
- .file-upload-item__spinner_1g1pw {
123
+ .file-upload-item__spinner_w4zr7 {
128
124
  width: 20px;
129
125
  height: 20px;
130
126
  }
131
- .file-upload-item__uploadPercent_1g1pw {
127
+ .file-upload-item__uploadPercent_w4zr7 {
132
128
  margin-top: var(--gap-2xs);
133
129
  margin-left: var(--gap-xl);
134
130
  }
package/index.js CHANGED
@@ -7,16 +7,16 @@ require('classnames');
7
7
  require('@alfalab/core-components-icon-button');
8
8
  require('@alfalab/core-components-link');
9
9
  require('@alfalab/core-components-spinner');
10
- require('@alfalab/icons-glyph/CrossMIcon');
11
- require('@alfalab/icons-glyph/CheckmarkCircleMIcon');
12
10
  require('@alfalab/icons-glyph/AlertCircleMIcon');
13
- require('@alfalab/icons-glyph/PointerDownMIcon');
11
+ require('@alfalab/icons-glyph/CheckmarkCircleMIcon');
14
12
  require('@alfalab/icons-glyph/ClockMIcon');
13
+ require('@alfalab/icons-glyph/CrossSIcon');
14
+ require('@alfalab/icons-glyph/PointerDownSIcon');
15
15
  require('@alfalab/icons-glyph/DocumentDocMIcon');
16
+ require('@alfalab/icons-glyph/DocumentImageMIcon');
16
17
  require('@alfalab/icons-glyph/DocumentPdfMIcon');
17
18
  require('@alfalab/icons-glyph/DocumentTxtMIcon');
18
19
  require('@alfalab/icons-glyph/DocumentUnknownMIcon');
19
- require('@alfalab/icons-glyph/DocumentImageMIcon');
20
20
  require('./utils.js');
21
21
  var Component = require('./Component.js');
22
22
 
@@ -3,19 +3,19 @@ import cn from 'classnames';
3
3
  import { IconButton } from '@alfalab/core-components-icon-button/modern';
4
4
  import { Link } from '@alfalab/core-components-link/modern';
5
5
  import { Spinner } from '@alfalab/core-components-spinner/modern';
6
- import { CrossMIcon } from '@alfalab/icons-glyph/CrossMIcon';
7
- import { CheckmarkCircleMIcon } from '@alfalab/icons-glyph/CheckmarkCircleMIcon';
8
6
  import { AlertCircleMIcon } from '@alfalab/icons-glyph/AlertCircleMIcon';
9
- import { PointerDownMIcon } from '@alfalab/icons-glyph/PointerDownMIcon';
7
+ import { CheckmarkCircleMIcon } from '@alfalab/icons-glyph/CheckmarkCircleMIcon';
10
8
  import { ClockMIcon } from '@alfalab/icons-glyph/ClockMIcon';
9
+ import { CrossSIcon } from '@alfalab/icons-glyph/CrossSIcon';
10
+ import { PointerDownSIcon } from '@alfalab/icons-glyph/PointerDownSIcon';
11
11
  import '@alfalab/icons-glyph/DocumentDocMIcon';
12
+ import '@alfalab/icons-glyph/DocumentImageMIcon';
12
13
  import '@alfalab/icons-glyph/DocumentPdfMIcon';
13
14
  import '@alfalab/icons-glyph/DocumentTxtMIcon';
14
15
  import '@alfalab/icons-glyph/DocumentUnknownMIcon';
15
- import '@alfalab/icons-glyph/DocumentImageMIcon';
16
16
  import { fileIcon, humanFileSize } from './utils.js';
17
17
 
18
- var styles = {"component":"file-upload-item__component_1g1pw","infoSection":"file-upload-item__infoSection_1g1pw","info":"file-upload-item__info_1g1pw","icon":"file-upload-item__icon_1g1pw","errorIcon":"file-upload-item__errorIcon_1g1pw","successIcon":"file-upload-item__successIcon_1g1pw","name":"file-upload-item__name_1g1pw","meta":"file-upload-item__meta_1g1pw","size":"file-upload-item__size_1g1pw","delete":"file-upload-item__delete_1g1pw","download":"file-upload-item__download_1g1pw","errorWrapper":"file-upload-item__errorWrapper_1g1pw","restore":"file-upload-item__restore_1g1pw","spinnerWrapper":"file-upload-item__spinnerWrapper_1g1pw","spinner":"file-upload-item__spinner_1g1pw","uploadPercent":"file-upload-item__uploadPercent_1g1pw"};
18
+ var styles = {"component":"file-upload-item__component_w4zr7","infoSection":"file-upload-item__infoSection_w4zr7","info":"file-upload-item__info_w4zr7","icon":"file-upload-item__icon_w4zr7","errorIcon":"file-upload-item__errorIcon_w4zr7","successIcon":"file-upload-item__successIcon_w4zr7","name":"file-upload-item__name_w4zr7","meta":"file-upload-item__meta_w4zr7","size":"file-upload-item__size_w4zr7","delete":"file-upload-item__delete_w4zr7","download":"file-upload-item__download_w4zr7","errorWrapper":"file-upload-item__errorWrapper_w4zr7","restore":"file-upload-item__restore_w4zr7","spinnerWrapper":"file-upload-item__spinnerWrapper_w4zr7","spinner":"file-upload-item__spinner_w4zr7","uploadPercent":"file-upload-item__uploadPercent_w4zr7"};
19
19
  require('./index.css')
20
20
 
21
21
  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, dataTestId, }) => {
@@ -70,8 +70,8 @@ const FileUploadItem = ({ className, children, id = '0', name = '', size, icon:
70
70
  uploadDate && React.createElement("span", { key: uploadDate }, uploadDate),
71
71
  size && (React.createElement("span", { key: size, className: styles.size }, humanFileSize(size)))))),
72
72
  showRestore && (React.createElement(Link, { pseudo: true, className: styles.restore, onClick: handleRestore }, "\u0412\u043E\u0441\u0441\u0442\u0430\u043D\u043E\u0432\u0438\u0442\u044C")),
73
- showDownload && (React.createElement(IconButton, { size: 'xxs', icon: PointerDownMIcon, className: styles.download, "aria-label": '\u0441\u043A\u0430\u0447\u0430\u0442\u044C', href: downloadLink, onClick: handleDownload, disabled: disableButtons, download: download })),
74
- showDelete && !showRestore && (React.createElement(IconButton, { size: 'xxs', icon: CrossMIcon, onClick: handleDelete, disabled: disableButtons, className: styles.delete, "aria-label": '\u0443\u0434\u0430\u043B\u0438\u0442\u044C' }))));
73
+ 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 })),
74
+ 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' }))));
75
75
  };
76
76
 
77
77
  export { FileUploadItem };
package/modern/index.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: 1cjtj */
1
+ /* hash: kvk7c */
2
2
  :root {
3
3
  --color-light-border-primary: #dbdee1;
4
4
  --color-light-graphic-negative: #f15045;
@@ -22,7 +22,7 @@
22
22
  --gap-s: 12px;
23
23
  --gap-xl: 24px;
24
24
  }
25
- .file-upload-item__component_1g1pw {
25
+ .file-upload-item__component_w4zr7 {
26
26
  font-size: 13px;
27
27
  line-height: 16px;
28
28
  font-weight: 400;
@@ -34,10 +34,10 @@
34
34
  box-shadow: 0 -1px 0 0 var(--color-light-border-primary) inset;
35
35
  box-sizing: border-box
36
36
  }
37
- .file-upload-item__component_1g1pw svg {
37
+ .file-upload-item__component_w4zr7 svg {
38
38
  display: block;
39
39
  }
40
- .file-upload-item__infoSection_1g1pw {
40
+ .file-upload-item__infoSection_w4zr7 {
41
41
  display: flex;
42
42
  flex-direction: column;
43
43
  flex: 1;
@@ -45,90 +45,86 @@
45
45
  margin-left: var(--gap-s);
46
46
  min-width: 40%;
47
47
  }
48
- .file-upload-item__info_1g1pw {
48
+ .file-upload-item__info_w4zr7 {
49
49
  display: flex;
50
50
  flex-wrap: wrap;
51
51
  flex: 1;
52
52
  overflow: hidden;
53
53
  }
54
- .file-upload-item__icon_1g1pw {
54
+ .file-upload-item__icon_w4zr7 {
55
55
  display: block;
56
56
  flex-shrink: 0;
57
57
  color: var(--color-light-text-primary);
58
58
  }
59
- .file-upload-item__errorIcon_1g1pw {
59
+ .file-upload-item__errorIcon_w4zr7 {
60
60
  flex-shrink: 0;
61
61
  color: var(--color-light-graphic-negative);
62
62
  }
63
- .file-upload-item__successIcon_1g1pw {
63
+ .file-upload-item__successIcon_w4zr7 {
64
64
  flex-shrink: 0;
65
65
  color: var(--color-light-graphic-positive);
66
66
  }
67
- .file-upload-item__name_1g1pw {
67
+ .file-upload-item__name_w4zr7 {
68
68
  white-space: nowrap;
69
69
  overflow: hidden;
70
70
  text-overflow: ellipsis;
71
71
  color: var(--color-light-text-primary)
72
72
  }
73
- .file-upload-item__name_1g1pw a {
73
+ .file-upload-item__name_w4zr7 a {
74
74
  display: block;
75
75
  margin-bottom: 1px;
76
76
  }
77
- .file-upload-item__meta_1g1pw {
77
+ .file-upload-item__meta_w4zr7 {
78
78
  display: flex;
79
79
  white-space: nowrap;
80
80
  margin-right: var(--gap-2xs);
81
81
  margin-left: var(--gap-xl);
82
82
  padding: var(--gap-2xs) 0
83
83
  }
84
- .file-upload-item__meta_1g1pw > * {
84
+ .file-upload-item__meta_w4zr7 > * {
85
85
  margin-right: var(--gap-s)
86
86
  }
87
- .file-upload-item__meta_1g1pw > *:last-child {
87
+ .file-upload-item__meta_w4zr7 > *:last-child {
88
88
  margin-right: 0;
89
89
  }
90
- .file-upload-item__size_1g1pw {
90
+ .file-upload-item__size_w4zr7 {
91
91
  text-align: right;
92
92
  }
93
- .file-upload-item__delete_1g1pw,
94
- .file-upload-item__download_1g1pw {
93
+ .file-upload-item__delete_w4zr7,
94
+ .file-upload-item__download_w4zr7 {
95
95
  height: 24px;
96
96
  width: 24px;
97
- margin-left: var(--gap-xs)
97
+ margin-left: var(--gap-xs);
98
98
  }
99
- .file-upload-item__delete_1g1pw svg, .file-upload-item__download_1g1pw svg {
100
- width: 18px;
101
- height: 18px;
102
- }
103
- .file-upload-item__errorWrapper_1g1pw {
99
+ .file-upload-item__errorWrapper_w4zr7 {
104
100
  margin-top: var(--gap-s);
105
101
  color: var(--color-light-text-accent)
106
102
  }
107
103
  @media (--small-only) {
108
- .file-upload-item__errorWrapper_1g1pw {
104
+ .file-upload-item__errorWrapper_w4zr7 {
109
105
  flex: 1 0 100%;
110
106
  margin-top: var(--gap-3xs)
111
107
  }
112
108
  }
113
- .file-upload-item__restore_1g1pw {
109
+ .file-upload-item__restore_w4zr7 {
114
110
  font-size: 14px;
115
111
  line-height: 20px;
116
112
  font-weight: 400;
117
113
 
118
114
  margin-left: var(--gap-s);
119
115
  }
120
- .file-upload-item__spinnerWrapper_1g1pw {
116
+ .file-upload-item__spinnerWrapper_w4zr7 {
121
117
  display: flex;
122
118
  justify-content: center;
123
119
  align-items: center;
124
120
  width: 24px;
125
121
  height: 24px;
126
122
  }
127
- .file-upload-item__spinner_1g1pw {
123
+ .file-upload-item__spinner_w4zr7 {
128
124
  width: 20px;
129
125
  height: 20px;
130
126
  }
131
- .file-upload-item__uploadPercent_1g1pw {
127
+ .file-upload-item__uploadPercent_w4zr7 {
132
128
  margin-top: var(--gap-2xs);
133
129
  margin-left: var(--gap-xl);
134
130
  }
package/modern/index.js CHANGED
@@ -3,15 +3,15 @@ import 'classnames';
3
3
  import '@alfalab/core-components-icon-button/modern';
4
4
  import '@alfalab/core-components-link/modern';
5
5
  import '@alfalab/core-components-spinner/modern';
6
- import '@alfalab/icons-glyph/CrossMIcon';
7
- import '@alfalab/icons-glyph/CheckmarkCircleMIcon';
8
6
  import '@alfalab/icons-glyph/AlertCircleMIcon';
9
- import '@alfalab/icons-glyph/PointerDownMIcon';
7
+ import '@alfalab/icons-glyph/CheckmarkCircleMIcon';
10
8
  import '@alfalab/icons-glyph/ClockMIcon';
9
+ import '@alfalab/icons-glyph/CrossSIcon';
10
+ import '@alfalab/icons-glyph/PointerDownSIcon';
11
11
  import '@alfalab/icons-glyph/DocumentDocMIcon';
12
+ import '@alfalab/icons-glyph/DocumentImageMIcon';
12
13
  import '@alfalab/icons-glyph/DocumentPdfMIcon';
13
14
  import '@alfalab/icons-glyph/DocumentTxtMIcon';
14
15
  import '@alfalab/icons-glyph/DocumentUnknownMIcon';
15
- import '@alfalab/icons-glyph/DocumentImageMIcon';
16
16
  import './utils.js';
17
17
  export { FileUploadItem } from './Component.js';
package/modern/utils.js CHANGED
@@ -1,8 +1,8 @@
1
1
  import { DocumentDocMIcon } from '@alfalab/icons-glyph/DocumentDocMIcon';
2
+ import { DocumentImageMIcon } from '@alfalab/icons-glyph/DocumentImageMIcon';
2
3
  import { DocumentPdfMIcon } from '@alfalab/icons-glyph/DocumentPdfMIcon';
3
4
  import { DocumentTxtMIcon } from '@alfalab/icons-glyph/DocumentTxtMIcon';
4
5
  import { DocumentUnknownMIcon } from '@alfalab/icons-glyph/DocumentUnknownMIcon';
5
- import { DocumentImageMIcon } from '@alfalab/icons-glyph/DocumentImageMIcon';
6
6
 
7
7
  function humanFileSize(size) {
8
8
  const units = ['B', 'KB', 'MB', 'GB'];
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@alfalab/core-components-file-upload-item",
3
- "version": "5.1.5",
3
+ "version": "5.1.7",
4
4
  "description": "",
5
5
  "keywords": [],
6
6
  "license": "MIT",
@@ -14,7 +14,7 @@
14
14
  "react": "^16.9.0 || ^17.0.1 || ^18.0.0"
15
15
  },
16
16
  "dependencies": {
17
- "@alfalab/core-components-icon-button": "^5.0.5",
17
+ "@alfalab/core-components-icon-button": "^6.0.0",
18
18
  "@alfalab/core-components-link": "^5.0.1",
19
19
  "@alfalab/core-components-spinner": "^3.0.2",
20
20
  "@alfalab/icons-glyph": "^2.71.0"
package/utils.js CHANGED
@@ -3,10 +3,10 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  var DocumentDocMIcon = require('@alfalab/icons-glyph/DocumentDocMIcon');
6
+ var DocumentImageMIcon = require('@alfalab/icons-glyph/DocumentImageMIcon');
6
7
  var DocumentPdfMIcon = require('@alfalab/icons-glyph/DocumentPdfMIcon');
7
8
  var DocumentTxtMIcon = require('@alfalab/icons-glyph/DocumentTxtMIcon');
8
9
  var DocumentUnknownMIcon = require('@alfalab/icons-glyph/DocumentUnknownMIcon');
9
- var DocumentImageMIcon = require('@alfalab/icons-glyph/DocumentImageMIcon');
10
10
 
11
11
  function humanFileSize(size) {
12
12
  var units = ['B', 'KB', 'MB', 'GB'];