@sima-land/ui-nucleons 45.0.0-alpha.35 → 45.0.0-alpha.36
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/file-icon/file-icon.d.ts
CHANGED
|
@@ -1,7 +1,8 @@
|
|
|
1
|
-
import { FileIconProps } from './types';
|
|
1
|
+
import type { FileIconProps } from './types';
|
|
2
|
+
export declare const KNOWN_TYPES: Set<string>;
|
|
2
3
|
/**
|
|
3
4
|
* Иконка файла.
|
|
4
5
|
* @param props Свойства. Поддерживаются свойства <svg />.
|
|
5
6
|
* @return Элемент.
|
|
6
7
|
*/
|
|
7
|
-
export declare function FileIcon({ type,
|
|
8
|
+
export declare function FileIcon({ type, isTypeVisible, ...svgProps }: FileIconProps): import("react/jsx-runtime").JSX.Element;
|
package/file-icon/file-icon.js
CHANGED
|
@@ -3,17 +3,20 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
3
3
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
4
|
};
|
|
5
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
+
exports.KNOWN_TYPES = void 0;
|
|
6
7
|
exports.FileIcon = FileIcon;
|
|
7
8
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
8
|
-
const
|
|
9
|
+
const classnames_1 = __importDefault(require("classnames"));
|
|
9
10
|
const file_icon_m_scss_1 = __importDefault(require("./file-icon.m.scss"));
|
|
10
|
-
const
|
|
11
|
-
|
|
11
|
+
const react_1 = require("react");
|
|
12
|
+
exports.KNOWN_TYPES = new Set([
|
|
13
|
+
'avi',
|
|
12
14
|
'doc',
|
|
13
15
|
'docx',
|
|
14
16
|
'heic',
|
|
15
17
|
'jpg',
|
|
16
18
|
'mov',
|
|
19
|
+
'mp3',
|
|
17
20
|
'mp4',
|
|
18
21
|
'pdf',
|
|
19
22
|
'png',
|
|
@@ -29,7 +32,14 @@ const KNOWN_TYPES = new Set([
|
|
|
29
32
|
* @param props Свойства. Поддерживаются свойства <svg />.
|
|
30
33
|
* @return Элемент.
|
|
31
34
|
*/
|
|
32
|
-
function FileIcon({ type,
|
|
33
|
-
|
|
35
|
+
function FileIcon({ type = '', isTypeVisible = typeof type === 'string' && exports.KNOWN_TYPES.has(type.toLowerCase()), ...svgProps }) {
|
|
36
|
+
const placeholder = (0, react_1.useMemo)(() => type === null ? (
|
|
37
|
+
/* иконка Stroked/Cross без обертки в виде <svg /> */
|
|
38
|
+
(0, jsx_runtime_1.jsx)("path", { d: 'M12.7071 4.70711C13.0976 4.31658 13.0976 3.68342 12.7071 3.29289C12.3166 2.90237 11.6834 2.90237 11.2929 3.29289L8 6.58579L4.70711 3.29289C4.31658 2.90237 3.68342 2.90237 3.29289 3.29289C2.90237 3.68342 2.90237 4.31658 3.29289 4.70711L6.58579 8L3.29289 11.2929C2.90237 11.6834 2.90237 12.3166 3.29289 12.7071C3.68342 13.0976 4.31658 13.0976 4.70711 12.7071L8 9.41421L11.2929 12.7071C11.6834 13.0976 12.3166 13.0976 12.7071 12.7071C13.0976 12.3166 13.0976 11.6834 12.7071 11.2929L9.41421 8L12.7071 4.70711Z', fill: '#9e9e9e', transform: 'translate(8,12)' })) : (
|
|
39
|
+
/* заглушка текста */
|
|
40
|
+
(0, jsx_runtime_1.jsxs)("g", { opacity: '0.8', children: [(0, jsx_runtime_1.jsx)("path", { d: 'M9 22H23V24H9V22Z', fill: '#fff' }), (0, jsx_runtime_1.jsx)("path", { d: 'M9 18H19V20H9V18Z', fill: '#fff' })] })), [type]);
|
|
41
|
+
return ((0, jsx_runtime_1.jsxs)("svg", { width: '32', height: '32', viewBox: '0 0 32 32', ...svgProps, children: [(0, jsx_runtime_1.jsx)("path", { className: (0, classnames_1.default)(file_icon_m_scss_1.default.main, type === null ? file_icon_m_scss_1.default.broken : file_icon_m_scss_1.default[type.toLowerCase()]), opacity: '0.88', d: 'M6 5C6 3.89543 6.89543 3 8 3H20L26 9V27C26 28.1046 25.1046 29 24 29H8C6.89543 29 6 28.1046 6 27V5Z' }), (0, jsx_runtime_1.jsx)("path", { opacity: '0.32', d: 'M21 9L26 9L20 3L20 8C20 8.55229 20.4477 9 21 9Z', fill: '#fff' }), (0, jsx_runtime_1.jsx)("path", { opacity: '0.24', d: 'M25.1667 9L21 9L26 15L26 9C25.5833 9 25.6269 9 25.1667 9Z', fill: 'black' }), type && isTypeVisible ? (
|
|
42
|
+
/* текст */
|
|
43
|
+
(0, jsx_runtime_1.jsx)("text", { x: '16', y: '23', textAnchor: 'middle', fontSize: '6.5', fontWeight: '700', fill: '#fff', children: type.toUpperCase() })) : (placeholder)] }));
|
|
34
44
|
}
|
|
35
45
|
//# sourceMappingURL=file-icon.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"file-icon.js","sourceRoot":"","sources":["../../src/file-icon/file-icon.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"file-icon.js","sourceRoot":"","sources":["../../src/file-icon/file-icon.tsx"],"names":[],"mappings":";;;;;;AA6BA,4BAmDC;;AA/ED,4DAA4B;AAC5B,0EAAwC;AACxC,iCAAgC;AAEnB,QAAA,WAAW,GAAG,IAAI,GAAG,CAAC;IACjC,KAAK;IACL,KAAK;IACL,MAAM;IACN,MAAM;IACN,KAAK;IACL,KAAK;IACL,KAAK;IACL,KAAK;IACL,KAAK;IACL,KAAK;IACL,KAAK;IACL,KAAK;IACL,KAAK;IACL,MAAM;IACN,KAAK;IACL,KAAK;CACN,CAAC,CAAC;AAEH;;;;GAIG;AACH,SAAgB,QAAQ,CAAC,EACvB,IAAI,GAAG,EAAE,EACT,aAAa,GAAG,OAAO,IAAI,KAAK,QAAQ,IAAI,mBAAW,CAAC,GAAG,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC,EAC/E,GAAG,QAAQ,EACG;IACd,MAAM,WAAW,GAAG,IAAA,eAAO,EACzB,GAAG,EAAE,CACH,IAAI,KAAK,IAAI,CAAC,CAAC,CAAC;IACd,qDAAqD;IACrD,iCACE,CAAC,EAAC,2fAA2f,EAC7f,IAAI,EAAC,SAAS,EACd,SAAS,EAAC,iBAAiB,GAC3B,CACH,CAAC,CAAC,CAAC;IACF,qBAAqB;IACrB,+BAAG,OAAO,EAAC,KAAK,aACd,iCAAM,CAAC,EAAC,mBAAmB,EAAC,IAAI,EAAC,MAAM,GAAG,EAC1C,iCAAM,CAAC,EAAC,mBAAmB,EAAC,IAAI,EAAC,MAAM,GAAG,IACxC,CACL,EACH,CAAC,IAAI,CAAC,CACP,CAAC;IAEF,OAAO,CACL,iCAAK,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,OAAO,EAAC,WAAW,KAAK,QAAQ,aAE1D,iCACE,SAAS,EAAE,IAAA,oBAAE,EAAC,0BAAM,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC,CAAC,CAAC,0BAAM,CAAC,MAAM,CAAC,CAAC,CAAC,0BAAM,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC,CAAC,EACtF,OAAO,EAAC,MAAM,EACd,CAAC,EAAC,oGAAoG,GACtG,EAGF,iCAAM,OAAO,EAAC,MAAM,EAAC,CAAC,EAAC,iDAAiD,EAAC,IAAI,EAAC,MAAM,GAAG,EACvF,iCACE,OAAO,EAAC,MAAM,EACd,CAAC,EAAC,2DAA2D,EAC7D,IAAI,EAAC,OAAO,GACZ,EAED,IAAI,IAAI,aAAa,CAAC,CAAC,CAAC;YACvB,WAAW;YACX,iCAAM,CAAC,EAAC,IAAI,EAAC,CAAC,EAAC,IAAI,EAAC,UAAU,EAAC,QAAQ,EAAC,QAAQ,EAAC,KAAK,EAAC,UAAU,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,YAChF,IAAI,CAAC,WAAW,EAAE,GACd,CACR,CAAC,CAAC,CAAC,CACF,WAAW,CACZ,IACG,CACP,CAAC;AACJ,CAAC"}
|
|
@@ -5,6 +5,10 @@
|
|
|
5
5
|
}
|
|
6
6
|
|
|
7
7
|
// ВАЖНО: далее используем цвет именно как резервное значение чтобы иметь возможность переопределения
|
|
8
|
+
.avi {
|
|
9
|
+
fill: var(--file-icon-primary-color, #{colors.$additional-blue-gray});
|
|
10
|
+
}
|
|
11
|
+
|
|
8
12
|
.doc {
|
|
9
13
|
fill: var(--file-icon-primary-color, #{colors.$additional-electric-blue});
|
|
10
14
|
}
|
|
@@ -25,6 +29,10 @@
|
|
|
25
29
|
fill: var(--file-icon-primary-color, #{colors.$additional-blue-gray});
|
|
26
30
|
}
|
|
27
31
|
|
|
32
|
+
.mp3 {
|
|
33
|
+
fill: var(--file-icon-primary-color, #{colors.$additional-blue-gray});
|
|
34
|
+
}
|
|
35
|
+
|
|
28
36
|
.mp4 {
|
|
29
37
|
fill: var(--file-icon-primary-color, #{colors.$additional-blue-gray});
|
|
30
38
|
}
|
|
@@ -60,3 +68,7 @@
|
|
|
60
68
|
.zip {
|
|
61
69
|
fill: var(--file-icon-primary-color, #{colors.$additional-teal});
|
|
62
70
|
}
|
|
71
|
+
|
|
72
|
+
.broken {
|
|
73
|
+
fill: var(--file-icon-primary-color, #{colors.$basic-gray12});
|
|
74
|
+
}
|
package/file-icon/types.d.ts
CHANGED
|
@@ -4,9 +4,9 @@ export interface FileIconStyle extends CSSProperties {
|
|
|
4
4
|
}
|
|
5
5
|
export interface FileIconProps extends Omit<SVGAttributes<SVGSVGElement>, 'type'> {
|
|
6
6
|
/** Тип файла. */
|
|
7
|
-
type?: string;
|
|
7
|
+
type?: string | null;
|
|
8
8
|
/** Нужно ли выводить название типа. */
|
|
9
|
-
|
|
9
|
+
isTypeVisible?: boolean;
|
|
10
10
|
/** Стили. */
|
|
11
11
|
style?: FileIconStyle;
|
|
12
12
|
}
|
package/package.json
CHANGED
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@sima-land/ui-nucleons",
|
|
3
3
|
"type": "commonjs",
|
|
4
|
-
"version": "45.0.0-alpha.
|
|
4
|
+
"version": "45.0.0-alpha.36",
|
|
5
5
|
"repository": "ssh://git@github.com:sima-land/ui-nucleons.git",
|
|
6
6
|
"author": "www.sima-land.ru team",
|
|
7
7
|
"license": "Apache-2.0",
|
|
8
8
|
"private": false,
|
|
9
9
|
"engines": {
|
|
10
|
-
"node": ">=
|
|
10
|
+
"node": ">=20.0.0"
|
|
11
11
|
},
|
|
12
12
|
"scripts": {
|
|
13
13
|
"export:colors": "node .template/build.mjs",
|