@teamturing/react-kit 2.55.0 → 2.56.1
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.
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { HTMLProps } from 'react';
|
|
1
|
+
import { ComponentType, HTMLProps, SVGProps } from 'react';
|
|
2
2
|
import { SxProp } from '../../utils/styled-system';
|
|
3
3
|
type Props = {
|
|
4
4
|
file: File | Blob;
|
|
@@ -19,7 +19,11 @@ type Props = {
|
|
|
19
19
|
* 시각적인 후행 부분에 상호작용할 요소를 정의합니다.
|
|
20
20
|
*/
|
|
21
21
|
trailingAction?: React.ReactElement<HTMLProps<HTMLButtonElement>>;
|
|
22
|
+
/**
|
|
23
|
+
* file 일 때의 icon을 결정합니다.
|
|
24
|
+
*/
|
|
25
|
+
renderFileIcon?: (fileType: string, file: Props['file']) => ComponentType<SVGProps<SVGSVGElement>>;
|
|
22
26
|
} & SxProp;
|
|
23
|
-
declare const FileItem: ({ file, variant, disabled, loading, validationStatus, trailingAction, ...props }: Props) => import("react/jsx-runtime").JSX.Element;
|
|
27
|
+
declare const FileItem: ({ file, variant, disabled, loading, validationStatus, trailingAction, renderFileIcon, ...props }: Props) => import("react/jsx-runtime").JSX.Element;
|
|
24
28
|
export default FileItem;
|
|
25
29
|
export type { Props as FileItemProps };
|
package/dist/index.js
CHANGED
|
@@ -6880,11 +6880,12 @@ const FileItem = ({
|
|
|
6880
6880
|
loading,
|
|
6881
6881
|
validationStatus,
|
|
6882
6882
|
trailingAction,
|
|
6883
|
+
renderFileIcon = () => icons.DocumentIcon,
|
|
6883
6884
|
...props
|
|
6884
6885
|
}) => {
|
|
6885
6886
|
const fileType = file.type.match('image/*') ? 'image' : file.type.match('video/*') ? 'video' : 'whatever';
|
|
6886
6887
|
const fileName = 'name' in file ? file.name : '';
|
|
6887
|
-
const FileIcon = fileType === 'image' ? icons.PictureIcon : fileType === 'video' ? icons.VideoIcon :
|
|
6888
|
+
const FileIcon = fileType === 'image' ? icons.PictureIcon : fileType === 'video' ? icons.VideoIcon : renderFileIcon(fileType, file);
|
|
6888
6889
|
const [objectUrl, setObjectUrl] = React.useState('');
|
|
6889
6890
|
React.useEffect(() => {
|
|
6890
6891
|
const url = URL.createObjectURL(file);
|
|
@@ -6923,7 +6924,7 @@ const FileItem = ({
|
|
|
6923
6924
|
}), /*#__PURE__*/jsxRuntime.jsx(icons.VideoIcon, {})]
|
|
6924
6925
|
}) : /*#__PURE__*/jsxRuntime.jsxs("div", {
|
|
6925
6926
|
className: 'file__thumbnail__whatever',
|
|
6926
|
-
children: [/*#__PURE__*/jsxRuntime.jsx(
|
|
6927
|
+
children: [/*#__PURE__*/jsxRuntime.jsx(FileIcon, {}), /*#__PURE__*/jsxRuntime.jsx("span", {
|
|
6927
6928
|
title: fileName,
|
|
6928
6929
|
children: fileName
|
|
6929
6930
|
})]
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { PictureIcon, VideoIcon, ExclamationPointInCircleIcon, DocumentIcon } from '@teamturing/icons';
|
|
2
2
|
import { forcePixelValue } from '@teamturing/utils';
|
|
3
3
|
import { useState, useEffect } from 'react';
|
|
4
4
|
import styled from 'styled-components';
|
|
@@ -16,11 +16,12 @@ const FileItem = ({
|
|
|
16
16
|
loading,
|
|
17
17
|
validationStatus,
|
|
18
18
|
trailingAction,
|
|
19
|
+
renderFileIcon = () => DocumentIcon,
|
|
19
20
|
...props
|
|
20
21
|
}) => {
|
|
21
22
|
const fileType = file.type.match('image/*') ? 'image' : file.type.match('video/*') ? 'video' : 'whatever';
|
|
22
23
|
const fileName = 'name' in file ? file.name : '';
|
|
23
|
-
const FileIcon = fileType === 'image' ? PictureIcon : fileType === 'video' ? VideoIcon :
|
|
24
|
+
const FileIcon = fileType === 'image' ? PictureIcon : fileType === 'video' ? VideoIcon : renderFileIcon(fileType, file);
|
|
24
25
|
const [objectUrl, setObjectUrl] = useState('');
|
|
25
26
|
useEffect(() => {
|
|
26
27
|
const url = URL.createObjectURL(file);
|
|
@@ -59,7 +60,7 @@ const FileItem = ({
|
|
|
59
60
|
}), /*#__PURE__*/jsx(VideoIcon, {})]
|
|
60
61
|
}) : /*#__PURE__*/jsxs("div", {
|
|
61
62
|
className: 'file__thumbnail__whatever',
|
|
62
|
-
children: [/*#__PURE__*/jsx(
|
|
63
|
+
children: [/*#__PURE__*/jsx(FileIcon, {}), /*#__PURE__*/jsx("span", {
|
|
63
64
|
title: fileName,
|
|
64
65
|
children: fileName
|
|
65
66
|
})]
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@teamturing/react-kit",
|
|
3
|
-
"version": "2.
|
|
3
|
+
"version": "2.56.1",
|
|
4
4
|
"description": "React components, hooks for create teamturing web application",
|
|
5
5
|
"author": "Sungchang Park <psch300@gmail.com> (https://github.com/psch300)",
|
|
6
6
|
"homepage": "https://github.com/weareteamturing/bombe#readme",
|
|
@@ -66,5 +66,5 @@
|
|
|
66
66
|
"react-textarea-autosize": "^8.5.3",
|
|
67
67
|
"styled-system": "^5.1.5"
|
|
68
68
|
},
|
|
69
|
-
"gitHead": "
|
|
69
|
+
"gitHead": "82584aaf122e3e1a0c85f94e97274973c0b3195c"
|
|
70
70
|
}
|