deepsea-components 5.16.15 → 5.16.16

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.
Files changed (8) hide show
  1. package/dist/components/InputFile.cjs +11 -2
  2. package/dist/components/InputFile.d.ts +8 -0
  3. package/dist/components/InputFile.js +11 -2
  4. package/dist/components/InputFileButton.cjs +11 -2
  5. package/dist/components/InputFileButton.js +11 -2
  6. package/package.json +3 -3
  7. package/src/components/InputFile.tsx +23 -2
  8. package/src/components/InputFileButton.tsx +16 -2
package/dist/components/InputFile.cjs CHANGED
@@ -55,7 +55,7 @@ async function getFileData(file, type) {
55
55
  });
56
56
  }
57
57
  function InputFile(props) {
58
- const { multiple = false, type = "file", onChange: _onChange, disabled: _disabled, clearAfterChange, onValueChange, onFileChange, ...rest } = props;
58
+ const { multiple = false, type = "file", onChange: _onChange, disabled: _disabled, clearAfterChange, onValueChange, onFileChange, onDataChange, ...rest } = props;
59
59
  const [disabled, setDisabled] = (0, external_react_namespaceObject.useState)(false);
60
60
  async function onChange(e) {
61
61
  null == _onChange || _onChange(e);
@@ -73,10 +73,19 @@ function InputFile(props) {
73
73
  }
74
74
  null == onFileChange || onFileChange(files2);
75
75
  null == onValueChange || onValueChange(values);
76
+ null == onDataChange || onDataChange(files2.map((file, index)=>({
77
+ file,
78
+ value: values[index]
79
+ })));
76
80
  } else {
77
81
  const file = files[0];
78
82
  null == onFileChange || onFileChange(file);
79
- null == onValueChange || onValueChange(await getFileData(file, type));
83
+ const value = await getFileData(file, type);
84
+ null == onValueChange || onValueChange(value);
85
+ null == onDataChange || onDataChange({
86
+ file,
87
+ value
88
+ });
80
89
  }
81
90
  } finally{
82
91
  if (clearAfterChange) input.value = "";
package/dist/components/InputFile.d.ts CHANGED
@@ -12,11 +12,19 @@ export interface InputFileBaseProps extends Omit<ComponentProps<"input">, "multi
12
12
  }
13
13
  export type FileType<Multiple extends boolean> = Multiple extends true ? File[] : File;
14
14
  export type ValueType<Multiple extends boolean, Type extends InputFileDataType> = Multiple extends true ? InputFileDataTypeMap[Type][] : InputFileDataTypeMap[Type];
15
+ export type DataType<Multiple extends boolean, Type extends InputFileDataType> = Multiple extends true ? {
16
+ file: File;
17
+ value: InputFileDataTypeMap[Type];
18
+ }[] : {
19
+ file: File;
20
+ value: InputFileDataTypeMap[Type];
21
+ };
15
22
  export interface InputFileExtraProps<Multiple extends boolean = false, Type extends InputFileDataType = "file"> {
16
23
  multiple?: Multiple;
17
24
  type?: Type;
18
25
  onValueChange?: (data: ValueType<Multiple, Type>) => void;
19
26
  onFileChange?: (data: FileType<Multiple>) => void;
27
+ onDataChange?: (data: DataType<Multiple, Type>) => void;
20
28
  /** 是否在捕获文件后清除 input 上的文件，默认为 false，主要区别在于如果不清除，连续两次选择同样的文件不会触发 onChange 事件，如果用于 form 表单，请设置为 flase */
21
29
  clearAfterChange?: boolean;
22
30
  }
package/dist/components/InputFile.js CHANGED
@@ -26,7 +26,7 @@ async function getFileData(file, type) {
26
26
  });
27
27
  }
28
28
  function InputFile(props) {
29
- const { multiple = false, type = "file", onChange: _onChange, disabled: _disabled, clearAfterChange, onValueChange, onFileChange, ...rest } = props;
29
+ const { multiple = false, type = "file", onChange: _onChange, disabled: _disabled, clearAfterChange, onValueChange, onFileChange, onDataChange, ...rest } = props;
30
30
  const [disabled, setDisabled] = useState(false);
31
31
  async function onChange(e) {
32
32
  null == _onChange || _onChange(e);
@@ -44,10 +44,19 @@ function InputFile(props) {
44
44
  }
45
45
  null == onFileChange || onFileChange(files2);
46
46
  null == onValueChange || onValueChange(values);
47
+ null == onDataChange || onDataChange(files2.map((file, index)=>({
48
+ file,
49
+ value: values[index]
50
+ })));
47
51
  } else {
48
52
  const file = files[0];
49
53
  null == onFileChange || onFileChange(file);
50
- null == onValueChange || onValueChange(await getFileData(file, type));
54
+ const value = await getFileData(file, type);
55
+ null == onValueChange || onValueChange(value);
56
+ null == onDataChange || onDataChange({
57
+ file,
58
+ value
59
+ });
51
60
  }
52
61
  } finally{
53
62
  if (clearAfterChange) input.value = "";
package/dist/components/InputFileButton.cjs CHANGED
@@ -31,7 +31,7 @@ const jsx_runtime_namespaceObject = require("react/jsx-runtime");
31
31
  const external_react_namespaceObject = require("react");
32
32
  const external_InputFile_cjs_namespaceObject = require("./InputFile.cjs");
33
33
  function InputFileButton(props) {
34
- const { as = "button", onClick: _onClick, inputProps = {}, accept, onDrop: _onDrop, onDragOver: _onDragOver, dragFile, disabled: _disabled, type = "file", multiple, onValueChange, onFileChange, clearAfterChange, ...rest } = props;
34
+ const { as = "button", onClick: _onClick, inputProps = {}, accept, onDrop: _onDrop, onDragOver: _onDragOver, dragFile, disabled: _disabled, type = "file", multiple, onValueChange, onFileChange, onDataChange, clearAfterChange, ...rest } = props;
35
35
  const { ref, style, disabled: __disabled, ...restInputProps } = inputProps;
36
36
  const [disabled, setDisabled] = (0, external_react_namespaceObject.useState)(false);
37
37
  const input = (0, external_react_namespaceObject.useRef)(null);
@@ -60,10 +60,19 @@ function InputFileButton(props) {
60
60
  }
61
61
  null == onFileChange || onFileChange(files2);
62
62
  null == onValueChange || onValueChange(values);
63
+ null == onDataChange || onDataChange(files2.map((file, index)=>({
64
+ file,
65
+ value: values[index]
66
+ })));
63
67
  } else {
64
68
  const file = files[0];
65
69
  null == onFileChange || onFileChange(file);
66
- null == onValueChange || onValueChange(await (0, external_InputFile_cjs_namespaceObject.getFileData)(file, type));
70
+ const value = await (0, external_InputFile_cjs_namespaceObject.getFileData)(file, type);
71
+ null == onValueChange || onValueChange(value);
72
+ null == onDataChange || onDataChange({
73
+ file,
74
+ value
75
+ });
67
76
  }
68
77
  } finally{
69
78
  setDisabled(false);
package/dist/components/InputFileButton.js CHANGED
@@ -3,7 +3,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
3
3
  import { Fragment, createElement, useImperativeHandle, useRef, useState } from "react";
4
4
  import { InputFile, getFileData } from "./InputFile.js";
5
5
  function InputFileButton(props) {
6
- const { as = "button", onClick: _onClick, inputProps = {}, accept, onDrop: _onDrop, onDragOver: _onDragOver, dragFile, disabled: _disabled, type = "file", multiple, onValueChange, onFileChange, clearAfterChange, ...rest } = props;
6
+ const { as = "button", onClick: _onClick, inputProps = {}, accept, onDrop: _onDrop, onDragOver: _onDragOver, dragFile, disabled: _disabled, type = "file", multiple, onValueChange, onFileChange, onDataChange, clearAfterChange, ...rest } = props;
7
7
  const { ref, style, disabled: __disabled, ...restInputProps } = inputProps;
8
8
  const [disabled, setDisabled] = useState(false);
9
9
  const input = useRef(null);
@@ -32,10 +32,19 @@ function InputFileButton(props) {
32
32
  }
33
33
  null == onFileChange || onFileChange(files2);
34
34
  null == onValueChange || onValueChange(values);
35
+ null == onDataChange || onDataChange(files2.map((file, index)=>({
36
+ file,
37
+ value: values[index]
38
+ })));
35
39
  } else {
36
40
  const file = files[0];
37
41
  null == onFileChange || onFileChange(file);
38
- null == onValueChange || onValueChange(await getFileData(file, type));
42
+ const value = await getFileData(file, type);
43
+ null == onValueChange || onValueChange(value);
44
+ null == onDataChange || onDataChange({
45
+ file,
46
+ value
47
+ });
39
48
  }
40
49
  } finally{
41
50
  setDisabled(false);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "deepsea-components",
3
- "version": "5.16.15",
3
+ "version": "5.16.16",
4
4
  "description": "格数科技自用组件库",
5
5
  "type": "module",
6
6
  "exports": {
@@ -40,8 +40,8 @@
40
40
  "echarts": "^5.6.0",
41
41
  "hls.js": "^1.6.9",
42
42
  "smooth-scrollbar": "^8.8.4",
43
- "soda-hooks": "6.14.6",
44
- "deepsea-tools": "5.42.2"
43
+ "deepsea-tools": "5.42.2",
44
+ "soda-hooks": "6.14.6"
45
45
  },
46
46
  "devDependencies": {
47
47
  "typescript": "^5.9.2"
package/src/components/InputFile.tsx CHANGED
@@ -44,11 +44,19 @@ export type ValueType<Multiple extends boolean, Type extends InputFileDataType>
44
44
  ? InputFileDataTypeMap[Type][]
45
45
  : InputFileDataTypeMap[Type]
46
46
 
47
+ export type DataType<Multiple extends boolean, Type extends InputFileDataType> = Multiple extends true
48
+ ? { file: File; value: InputFileDataTypeMap[Type] }[]
49
+ : {
50
+ file: File
51
+ value: InputFileDataTypeMap[Type]
52
+ }
53
+
47
54
  export interface InputFileExtraProps<Multiple extends boolean = false, Type extends InputFileDataType = "file"> {
48
55
  multiple?: Multiple
49
56
  type?: Type
50
57
  onValueChange?: (data: ValueType<Multiple, Type>) => void
51
58
  onFileChange?: (data: FileType<Multiple>) => void
59
+ onDataChange?: (data: DataType<Multiple, Type>) => void
52
60
  /** 是否在捕获文件后清除 input 上的文件，默认为 false，主要区别在于如果不清除，连续两次选择同样的文件不会触发 onChange 事件，如果用于 form 表单，请设置为 flase */
53
61
  clearAfterChange?: boolean
54
62
  }
@@ -59,7 +67,17 @@ export interface InputFileProps<Multiple extends boolean = false, Type extends I
59
67
 
60
68
  /** 专用于读取文件的组件 */
61
69
  export function InputFile<Multiple extends boolean = false, Type extends InputFileDataType = "file">(props: InputFileProps<Multiple, Type>): ReactNode {
62
- const { multiple = false, type = "file", onChange: _onChange, disabled: _disabled, clearAfterChange, onValueChange, onFileChange, ...rest } = props
70
+ const {
71
+ multiple = false,
72
+ type = "file",
73
+ onChange: _onChange,
74
+ disabled: _disabled,
75
+ clearAfterChange,
76
+ onValueChange,
77
+ onFileChange,
78
+ onDataChange,
79
+ ...rest
80
+ } = props
63
81
  const [disabled, setDisabled] = useState(false)
64
82
 
65
83
  async function onChange(e: ChangeEvent<HTMLInputElement>) {
@@ -78,10 +96,13 @@ export function InputFile<Multiple extends boolean = false, Type extends InputFi
78
96
  }
79
97
  onFileChange?.(files2 as FileType<Multiple>)
80
98
  onValueChange?.(values as ValueType<Multiple, Type>)
99
+ onDataChange?.(files2.map((file, index) => ({ file, value: values[index] })) as DataType<Multiple, Type>)
81
100
  } else {
82
101
  const file = files[0]
83
102
  onFileChange?.(file as FileType<Multiple>)
84
- onValueChange?.((await getFileData(file, type)) as ValueType<Multiple, Type>)
103
+ const value = (await getFileData(file, type)) as InputFileDataTypeMap[Type]
104
+ onValueChange?.(value as ValueType<Multiple, Type>)
105
+ onDataChange?.({ file, value } as DataType<Multiple, Type>)
85
106
  }
86
107
  } finally {
87
108
  if (clearAfterChange) input.value = ""
package/src/components/InputFileButton.tsx CHANGED
@@ -14,7 +14,17 @@ import {
14
14
  useState,
15
15
  } from "react"
16
16
 
17
- import { FileType, InputFile, InputFileBaseProps, InputFileDataType, InputFileDataTypeMap, InputFileExtraProps, ValueType, getFileData } from "./InputFile"
17
+ import {
18
+ DataType,
19
+ FileType,
20
+ InputFile,
21
+ InputFileBaseProps,
22
+ InputFileDataType,
23
+ InputFileDataTypeMap,
24
+ InputFileExtraProps,
25
+ ValueType,
26
+ getFileData,
27
+ } from "./InputFile"
18
28
 
19
29
  export type InputFileButtonProps<
20
30
  Multiple extends boolean = false,
@@ -48,6 +58,7 @@ export function InputFileButton<
48
58
  multiple,
49
59
  onValueChange,
50
60
  onFileChange,
61
+ onDataChange,
51
62
  clearAfterChange,
52
63
  ...rest
53
64
  } = props
@@ -80,10 +91,13 @@ export function InputFileButton<
80
91
  }
81
92
  onFileChange?.(files2 as FileType<Multiple>)
82
93
  onValueChange?.(values as ValueType<Multiple, Type>)
94
+ onDataChange?.(files2.map((file, index) => ({ file, value: values[index] })) as DataType<Multiple, Type>)
83
95
  } else {
84
96
  const file = files[0]
85
97
  onFileChange?.(file as FileType<Multiple>)
86
- onValueChange?.((await getFileData(file, type)) as ValueType<Multiple, Type>)
98
+ const value = (await getFileData(file, type)) as InputFileDataTypeMap[Type]
99
+ onValueChange?.(value as ValueType<Multiple, Type>)
100
+ onDataChange?.({ file, value } as DataType<Multiple, Type>)
87
101
  }
88
102
  } finally {
89
103
  setDisabled(false)