sea-react-components 1.2.2 → 1.2.3
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/dist/components/calendar/index.d.ts.map +1 -1
- package/dist/components/calendar/index.js +3 -1
- package/dist/components/month-calendar/index.d.ts.map +1 -1
- package/dist/components/month-calendar/index.js +3 -1
- package/package.json +1 -2
- package/dist/components/file-input-v2/file-input/index.d.ts +0 -14
- package/dist/components/file-input-v2/file-input/index.d.ts.map +0 -1
- package/dist/components/file-input-v2/file-input/index.js +0 -6
- package/dist/components/file-input-v2/file-input-container/index.d.ts +0 -59
- package/dist/components/file-input-v2/file-input-container/index.d.ts.map +0 -1
- package/dist/components/file-input-v2/file-input-container/index.js +0 -99
- package/dist/components/file-input-v2/index.d.ts +0 -3
- package/dist/components/file-input-v2/index.d.ts.map +0 -1
- package/dist/components/file-input-v2/index.js +0 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/calendar/index.tsx"],"names":[],"mappings":"AAOA,MAAM,MAAM,KAAK,GAAG;IAClB,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACtB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,EAAE,GAAG;QAAE,KAAK,EAAE,IAAI,CAAC;QAAC,GAAG,EAAE,IAAI,CAAA;KAAE,KAAK,IAAI,CAAC;IACtE,aAAa,CAAC,EAAE,CAAC,MAAM,GAAG,IAAI,CAAC,EAAE,CAAC;IAClC,YAAY,CAAC,EAAE,CAAC,MAAM,GAAG,IAAI,CAAC,EAAE,CAAC;IACjC,UAAU,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,OAAO,CAAC;CAC3C,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,EAC/B,KAAK,EACL,QAAQ,EACR,aAAkB,EAClB,YAAY,EACZ,UAAqB,GACtB,EAAE,KAAK,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/calendar/index.tsx"],"names":[],"mappings":"AAOA,MAAM,MAAM,KAAK,GAAG;IAClB,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACtB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,EAAE,GAAG;QAAE,KAAK,EAAE,IAAI,CAAC;QAAC,GAAG,EAAE,IAAI,CAAA;KAAE,KAAK,IAAI,CAAC;IACtE,aAAa,CAAC,EAAE,CAAC,MAAM,GAAG,IAAI,CAAC,EAAE,CAAC;IAClC,YAAY,CAAC,EAAE,CAAC,MAAM,GAAG,IAAI,CAAC,EAAE,CAAC;IACjC,UAAU,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,OAAO,CAAC;CAC3C,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,EAC/B,KAAK,EACL,QAAQ,EACR,aAAkB,EAClB,YAAY,EACZ,UAAqB,GACtB,EAAE,KAAK,2CA6LP"}
|
|
@@ -100,7 +100,9 @@ export default function Calendar({ value, onChange, disabledDates = [], allowedD
|
|
|
100
100
|
setCurrentMonth(start.clone().startOf("month"));
|
|
101
101
|
}
|
|
102
102
|
}, [value, selectMode]);
|
|
103
|
-
return (_jsxs("div", { className: "p-4 max-w-sm mx-auto rounded-xl", children: [_jsxs("div", { className: "flex justify-between items-center mb-4", children: [_jsx("button", { onClick: handlePrevMonth, className: "custom-animation", children: _jsx(Icon, { icon: "weui:arrow-filled", className: "rotate-180 h-6 w-6 hover:text-primary hover:text-opacity-70 hover:-translate-x-1 custom-animation" }) }), _jsx("h2", { className: "text-lg font-semibold text-primary", children: currentMonth.format("MMMM YYYY") }), _jsx("button", { onClick: handleNextMonth, className: "custom-animation", children: _jsx(Icon, { icon: "weui:arrow-filled", className: "h-6 w-6 hover:text-primary hover:text-opacity-70 hover:translate-x-1 custom-animation" }) })] }), _jsx("div", { className: "grid grid-cols-7 text-center text-text text-sm mb-2", children: ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"].map((day) => (_jsx("div", { children: day }, day))) }), _jsx("div", { className: "grid grid-cols-7 gap-1 animate-fade-in", children: calendar
|
|
103
|
+
return (_jsxs("div", { className: "p-4 max-w-sm mx-auto rounded-xl", children: [_jsxs("div", { className: "flex justify-between items-center mb-4", children: [_jsx("button", { onClick: handlePrevMonth, className: "custom-animation", children: _jsx(Icon, { icon: "weui:arrow-filled", className: "rotate-180 h-6 w-6 hover:text-primary hover:text-opacity-70 hover:-translate-x-1 custom-animation" }) }), _jsx("h2", { className: "text-lg font-semibold text-primary", children: currentMonth.format("MMMM YYYY") }), _jsx("button", { onClick: handleNextMonth, className: "custom-animation", children: _jsx(Icon, { icon: "weui:arrow-filled", className: "h-6 w-6 hover:text-primary hover:text-opacity-70 hover:translate-x-1 custom-animation" }) })] }), _jsx("div", { className: "grid grid-cols-7 text-center text-text text-sm mb-2", children: ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"].map((day) => (_jsx("div", { children: day }, day))) }), _jsx("div", { className: "grid grid-cols-7 gap-1 animate-fade-in", children: calendar
|
|
104
|
+
.reduce((acc, week) => [...acc, ...week], [])
|
|
105
|
+
.map((dayItem, i) => {
|
|
104
106
|
const disabled = isDateDisabled(dayItem);
|
|
105
107
|
const outOfMonth = !isCurrentMonth(dayItem);
|
|
106
108
|
return (_jsx("button", { onClick: () => handleDateClick(dayItem), disabled: disabled, className: clsx("w-8 h-8 rounded-lg text-sm flex items-center justify-center custom-animation", {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/month-calendar/index.tsx"],"names":[],"mappings":"AAiBA,MAAM,MAAM,KAAK,CAAC,CAAC,IAAI;IACrB,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,CAAC,EAAE,CAAC,CAAC;IAC5B,SAAS,EAAE,CAAC,KAAK,EAAE;QAAE,KAAK,EAAE,CAAC,CAAA;KAAE,KAAK,GAAG,CAAC,OAAO,CAAC;IAChD,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE;QACR,WAAW,CAAC,EAAE,MAAM,CAAC;KACtB,CAAC;IACF,mBAAmB,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;CAChD,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,CAAC,EAAE,EACvC,KAAK,EACL,MAAM,EACN,SAAS,EACT,OAAO,EACP,OAEC,EACD,mBAAmB,GACpB,EAAE,KAAK,CAAC,CAAC,CAAC,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/month-calendar/index.tsx"],"names":[],"mappings":"AAiBA,MAAM,MAAM,KAAK,CAAC,CAAC,IAAI;IACrB,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,CAAC,EAAE,CAAC,CAAC;IAC5B,SAAS,EAAE,CAAC,KAAK,EAAE;QAAE,KAAK,EAAE,CAAC,CAAA;KAAE,KAAK,GAAG,CAAC,OAAO,CAAC;IAChD,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE;QACR,WAAW,CAAC,EAAE,MAAM,CAAC;KACtB,CAAC;IACF,mBAAmB,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;CAChD,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,CAAC,EAAE,EACvC,KAAK,EACL,MAAM,EACN,SAAS,EACT,OAAO,EACP,OAEC,EACD,mBAAmB,GACpB,EAAE,KAAK,CAAC,CAAC,CAAC,2CA8GV"}
|
|
@@ -42,7 +42,9 @@ export default function MonthCalendar({ month, events, EventItem, loading, optio
|
|
|
42
42
|
}
|
|
43
43
|
return weeks;
|
|
44
44
|
}, [visibleDays]);
|
|
45
|
-
return (_jsxs("div", { className: "flex flex-col", children: [_jsx("div", { className: "grid grid-cols-7 text-center text-text text-lg font-semibold p-1", children: WeekDays.map((day) => (_jsx("p", { children: day }, day))) }), _jsx("div", { className: "grid grid-cols-7 animate-fade-in", children: calendar
|
|
45
|
+
return (_jsxs("div", { className: "flex flex-col", children: [_jsx("div", { className: "grid grid-cols-7 text-center text-text text-lg font-semibold p-1", children: WeekDays.map((day) => (_jsx("p", { children: day }, day))) }), _jsx("div", { className: "grid grid-cols-7 animate-fade-in", children: calendar
|
|
46
|
+
.reduce((acc, week) => [...acc, ...week], [])
|
|
47
|
+
.map((dayItem, i) => {
|
|
46
48
|
const day = dayItem.format("YYYY-MM-DD");
|
|
47
49
|
const dayEvents = events[day] || [];
|
|
48
50
|
const dayEventsSlice = dayEvents.slice(0, options.eventsInDay);
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "sea-react-components",
|
|
3
3
|
"description": "SEA react components library",
|
|
4
|
-
"version": "1.2.
|
|
4
|
+
"version": "1.2.3",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"scripts": {
|
|
7
7
|
"build": "tsc --build && npx postcss src/styles.css -o dist/styles.css && npx postcss src/components/text-editor/style.css -o dist/components/text-editor/style.css",
|
|
@@ -45,7 +45,6 @@
|
|
|
45
45
|
"jwt-decode": "^4.0.0",
|
|
46
46
|
"lowlight": "^3.3.0",
|
|
47
47
|
"react-dom": "^18.3.1",
|
|
48
|
-
"sea-backend-helpers": "^1.0.0",
|
|
49
48
|
"sea-platform-helpers": "^1.4.0",
|
|
50
49
|
"sea-react-components": "file:",
|
|
51
50
|
"yup": "^1.5.0"
|
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
import React from "react";
|
|
2
|
-
export type Props = {
|
|
3
|
-
inputRef: React.RefObject<HTMLInputElement>;
|
|
4
|
-
inputProps: React.InputHTMLAttributes<HTMLInputElement>;
|
|
5
|
-
handleClick: () => void;
|
|
6
|
-
handleDrop: (e: React.DragEvent<HTMLDivElement>) => void;
|
|
7
|
-
handleDragOver: (e: React.DragEvent<HTMLDivElement>) => void;
|
|
8
|
-
handleDragLeave: () => void;
|
|
9
|
-
isDragging: boolean;
|
|
10
|
-
errorMessage?: string | boolean;
|
|
11
|
-
children?: React.ReactNode;
|
|
12
|
-
};
|
|
13
|
-
export default function FileInputV2({ inputRef, inputProps, handleClick, handleDrop, handleDragOver, handleDragLeave, isDragging, errorMessage, children, }: Props): import("react/jsx-runtime").JSX.Element;
|
|
14
|
-
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/file-input-v2/file-input/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,MAAM,MAAM,KAAK,GAAG;IAClB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC,gBAAgB,CAAC,CAAC;IAC5C,UAAU,EAAE,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,CAAC;IACxD,WAAW,EAAE,MAAM,IAAI,CAAC;IACxB,UAAU,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;IACzD,cAAc,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;IAC7D,eAAe,EAAE,MAAM,IAAI,CAAC;IAC5B,UAAU,EAAE,OAAO,CAAC;IACpB,YAAY,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAChC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EAClC,QAAQ,EACR,UAAU,EACV,WAAW,EACX,UAAU,EACV,cAAc,EACd,eAAe,EACf,UAAU,EACV,YAAY,EACZ,QAAQ,GACT,EAAE,KAAK,2CAuBP"}
|
|
@@ -1,6 +0,0 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
-
import clsx from "clsx";
|
|
4
|
-
export default function FileInputV2({ inputRef, inputProps, handleClick, handleDrop, handleDragOver, handleDragLeave, isDragging, errorMessage, children, }) {
|
|
5
|
-
return (_jsxs("div", { className: "w-full flex flex-col gap-1", children: [_jsxs("div", { className: clsx("border-0.5 px-3 py-2 rounded-xl text-center", "cursor-pointer transition-all duration-200 ease-in-out", "hover:border-primary", errorMessage ? "border-error" : isDragging && "border-primary"), onClick: handleClick, onDragOver: handleDragOver, onDragLeave: handleDragLeave, onDrop: handleDrop, children: [children || _jsx("p", { className: "text-text-light", children: "Click or drag to upload" }), _jsx("input", Object.assign({ ref: inputRef, className: "hidden" }, inputProps))] }), errorMessage && (_jsx("p", { className: "pl-1 text-sm text-error", children: errorMessage }))] }));
|
|
6
|
-
}
|
|
@@ -1,59 +0,0 @@
|
|
|
1
|
-
import React from "react";
|
|
2
|
-
export declare enum AcceptedTypes {
|
|
3
|
-
Image = "image/*",
|
|
4
|
-
Audio = "audio/*",
|
|
5
|
-
Video = "video/*",
|
|
6
|
-
PDF = "application/pdf",
|
|
7
|
-
TEXT = "text/plain"
|
|
8
|
-
}
|
|
9
|
-
export type AcceptedValuesArray = (AcceptedTypes | string)[];
|
|
10
|
-
export declare enum UploadStatuses {
|
|
11
|
-
Pending = "Pending",
|
|
12
|
-
Uploading = "Uploading",
|
|
13
|
-
Uploaded = "Uploaded",
|
|
14
|
-
Failed = "Failed"
|
|
15
|
-
}
|
|
16
|
-
export type FileState = {
|
|
17
|
-
id: string;
|
|
18
|
-
serverId?: string;
|
|
19
|
-
file?: File;
|
|
20
|
-
name: string;
|
|
21
|
-
size: number;
|
|
22
|
-
type: string;
|
|
23
|
-
progress: number;
|
|
24
|
-
status: UploadStatuses;
|
|
25
|
-
};
|
|
26
|
-
type UploadResponse<T> = {
|
|
27
|
-
id: string;
|
|
28
|
-
} & T;
|
|
29
|
-
export type Props<T> = {
|
|
30
|
-
name: string;
|
|
31
|
-
multiple?: boolean;
|
|
32
|
-
acceptedTypes?: AcceptedValuesArray;
|
|
33
|
-
onUpload: (file: FileState) => Promise<UploadResponse<T>>;
|
|
34
|
-
onDelete: (file: FileState) => Promise<UploadResponse<T>>;
|
|
35
|
-
onUploadSuccess?: (file: T) => void;
|
|
36
|
-
onDeleteSuccess?: (file: T) => void;
|
|
37
|
-
children: (params: {
|
|
38
|
-
files: FileState[];
|
|
39
|
-
inputRef: React.RefObject<HTMLInputElement>;
|
|
40
|
-
handleClick: () => void;
|
|
41
|
-
handleDeleteFile: (file: FileState) => void;
|
|
42
|
-
handleUploadFile: (file: FileState) => void;
|
|
43
|
-
handleDrop: (e: React.DragEvent<HTMLDivElement>) => void;
|
|
44
|
-
handleDragOver: (e: React.DragEvent<HTMLDivElement>) => void;
|
|
45
|
-
handleDragLeave: () => void;
|
|
46
|
-
isDragging: boolean;
|
|
47
|
-
inputProps: {
|
|
48
|
-
id: string;
|
|
49
|
-
name: string;
|
|
50
|
-
type: string;
|
|
51
|
-
accept: string;
|
|
52
|
-
multiple: boolean;
|
|
53
|
-
onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
|
|
54
|
-
};
|
|
55
|
-
}) => React.ReactNode;
|
|
56
|
-
};
|
|
57
|
-
export default function FileInputContainerV2<T>({ name, multiple, acceptedTypes, onUpload, onDelete, onUploadSuccess, onDeleteSuccess, children, }: Props<T>): import("react/jsx-runtime").JSX.Element;
|
|
58
|
-
export {};
|
|
59
|
-
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/file-input-v2/file-input-container/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAwC,MAAM,OAAO,CAAC;AAK7D,oBAAY,aAAa;IACvB,KAAK,YAAY;IACjB,KAAK,YAAY;IACjB,KAAK,YAAY;IACjB,GAAG,oBAAoB;IACvB,IAAI,eAAe;CACpB;AAED,MAAM,MAAM,mBAAmB,GAAG,CAAC,aAAa,GAAG,MAAM,CAAC,EAAE,CAAC;AAE7D,oBAAY,cAAc;IACxB,OAAO,YAAY;IACnB,SAAS,cAAc;IACvB,QAAQ,aAAa;IACrB,MAAM,WAAW;CAClB;AAED,MAAM,MAAM,SAAS,GAAG;IACtB,EAAE,EAAE,MAAM,CAAC;IACX,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,IAAI,CAAC,EAAE,IAAI,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,MAAM,CAAC;IACjB,MAAM,EAAE,cAAc,CAAC;CACxB,CAAC;AAEF,KAAK,cAAc,CAAC,CAAC,IAAI;IAAE,EAAE,EAAE,MAAM,CAAA;CAAE,GAAG,CAAC,CAAC;AAE5C,MAAM,MAAM,KAAK,CAAC,CAAC,IAAI;IACrB,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,aAAa,CAAC,EAAE,mBAAmB,CAAC;IACpC,QAAQ,EAAE,CAAC,IAAI,EAAE,SAAS,KAAK,OAAO,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC;IAC1D,QAAQ,EAAE,CAAC,IAAI,EAAE,SAAS,KAAK,OAAO,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC;IAC1D,eAAe,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,IAAI,CAAC;IACpC,eAAe,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,IAAI,CAAC;IACpC,QAAQ,EAAE,CAAC,MAAM,EAAE;QACjB,KAAK,EAAE,SAAS,EAAE,CAAC;QACnB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC,gBAAgB,CAAC,CAAC;QAC5C,WAAW,EAAE,MAAM,IAAI,CAAC;QACxB,gBAAgB,EAAE,CAAC,IAAI,EAAE,SAAS,KAAK,IAAI,CAAC;QAC5C,gBAAgB,EAAE,CAAC,IAAI,EAAE,SAAS,KAAK,IAAI,CAAC;QAC5C,UAAU,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;QACzD,cAAc,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;QAC7D,eAAe,EAAE,MAAM,IAAI,CAAC;QAC5B,UAAU,EAAE,OAAO,CAAC;QACpB,UAAU,EAAE;YACV,EAAE,EAAE,MAAM,CAAC;YACX,IAAI,EAAE,MAAM,CAAC;YACb,IAAI,EAAE,MAAM,CAAC;YACb,MAAM,EAAE,MAAM,CAAC;YACf,QAAQ,EAAE,OAAO,CAAC;YAClB,QAAQ,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;SAC5D,CAAC;KACH,KAAK,KAAK,CAAC,SAAS,CAAC;CACvB,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,oBAAoB,CAAC,CAAC,EAAE,EAC9C,IAAI,EACJ,QAAgB,EAChB,aAAkB,EAClB,QAAQ,EACR,QAAQ,EACR,eAAe,EACf,eAAe,EACf,QAAQ,GACT,EAAE,KAAK,CAAC,CAAC,CAAC,2CAyGV"}
|
|
@@ -1,99 +0,0 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
|
|
3
|
-
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
|
|
4
|
-
return new (P || (P = Promise))(function (resolve, reject) {
|
|
5
|
-
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
|
|
6
|
-
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
|
|
7
|
-
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
|
|
8
|
-
step((generator = generator.apply(thisArg, _arguments || [])).next());
|
|
9
|
-
});
|
|
10
|
-
};
|
|
11
|
-
import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
|
|
12
|
-
import { useRef, useState, useCallback } from "react";
|
|
13
|
-
const generateTempFileId = (type, size, name) => `(${type})-${size}-${name}`;
|
|
14
|
-
export var AcceptedTypes;
|
|
15
|
-
(function (AcceptedTypes) {
|
|
16
|
-
AcceptedTypes["Image"] = "image/*";
|
|
17
|
-
AcceptedTypes["Audio"] = "audio/*";
|
|
18
|
-
AcceptedTypes["Video"] = "video/*";
|
|
19
|
-
AcceptedTypes["PDF"] = "application/pdf";
|
|
20
|
-
AcceptedTypes["TEXT"] = "text/plain";
|
|
21
|
-
})(AcceptedTypes || (AcceptedTypes = {}));
|
|
22
|
-
export var UploadStatuses;
|
|
23
|
-
(function (UploadStatuses) {
|
|
24
|
-
UploadStatuses["Pending"] = "Pending";
|
|
25
|
-
UploadStatuses["Uploading"] = "Uploading";
|
|
26
|
-
UploadStatuses["Uploaded"] = "Uploaded";
|
|
27
|
-
UploadStatuses["Failed"] = "Failed";
|
|
28
|
-
})(UploadStatuses || (UploadStatuses = {}));
|
|
29
|
-
export default function FileInputContainerV2({ name, multiple = false, acceptedTypes = [], onUpload, onDelete, onUploadSuccess, onDeleteSuccess, children, }) {
|
|
30
|
-
const [files, setFiles] = useState([]);
|
|
31
|
-
const [isDragging, setIsDragging] = useState(false);
|
|
32
|
-
const inputRef = useRef(null);
|
|
33
|
-
const currentFileIds = files.map((file) => generateTempFileId(file.type, file.size, file.name));
|
|
34
|
-
const handleFiles = useCallback((selectedFiles) => {
|
|
35
|
-
if (!selectedFiles)
|
|
36
|
-
return;
|
|
37
|
-
const selectedArray = Array.from(selectedFiles);
|
|
38
|
-
const newFiles = selectedArray
|
|
39
|
-
.filter((f) => !currentFileIds.includes(generateTempFileId(f.type, f.size, f.name)))
|
|
40
|
-
.map((f) => ({
|
|
41
|
-
id: generateTempFileId(f.type, f.size, f.name),
|
|
42
|
-
file: f,
|
|
43
|
-
type: f.type,
|
|
44
|
-
name: f.name,
|
|
45
|
-
size: f.size,
|
|
46
|
-
progress: 0,
|
|
47
|
-
status: UploadStatuses.Pending,
|
|
48
|
-
}));
|
|
49
|
-
setFiles((prev) => [...prev, ...newFiles]);
|
|
50
|
-
newFiles.forEach(handleUploadFile);
|
|
51
|
-
}, [currentFileIds]);
|
|
52
|
-
const handleUploadFile = (file) => __awaiter(this, void 0, void 0, function* () {
|
|
53
|
-
setFiles((prev) => prev.map((f) => f.id === file.id ? Object.assign(Object.assign({}, f), { status: UploadStatuses.Uploading }) : f));
|
|
54
|
-
try {
|
|
55
|
-
const result = yield onUpload(file);
|
|
56
|
-
onUploadSuccess === null || onUploadSuccess === void 0 ? void 0 : onUploadSuccess(result);
|
|
57
|
-
setFiles((prev) => prev.map((f) => f.id === file.id
|
|
58
|
-
? Object.assign(Object.assign({}, f), { serverId: result.id, status: UploadStatuses.Uploaded, progress: 100 }) : f));
|
|
59
|
-
}
|
|
60
|
-
catch (_a) {
|
|
61
|
-
setFiles((prev) => prev.map((f) => f.id === file.id ? Object.assign(Object.assign({}, f), { status: UploadStatuses.Failed }) : f));
|
|
62
|
-
}
|
|
63
|
-
});
|
|
64
|
-
const handleDeleteFile = (file) => __awaiter(this, void 0, void 0, function* () {
|
|
65
|
-
try {
|
|
66
|
-
const result = yield onDelete(file);
|
|
67
|
-
onDeleteSuccess === null || onDeleteSuccess === void 0 ? void 0 : onDeleteSuccess(result);
|
|
68
|
-
setFiles((prev) => prev.filter((f) => f.serverId !== result.id));
|
|
69
|
-
}
|
|
70
|
-
catch (_a) { }
|
|
71
|
-
});
|
|
72
|
-
return (_jsx(_Fragment, { children: children({
|
|
73
|
-
files,
|
|
74
|
-
inputRef,
|
|
75
|
-
isDragging,
|
|
76
|
-
handleClick: () => { var _a; return (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.click(); },
|
|
77
|
-
handleUploadFile,
|
|
78
|
-
handleDeleteFile,
|
|
79
|
-
handleDrop: (e) => {
|
|
80
|
-
e.preventDefault();
|
|
81
|
-
e.stopPropagation();
|
|
82
|
-
setIsDragging(false);
|
|
83
|
-
handleFiles(e.dataTransfer.files);
|
|
84
|
-
},
|
|
85
|
-
handleDragOver: (e) => {
|
|
86
|
-
e.preventDefault();
|
|
87
|
-
setIsDragging(true);
|
|
88
|
-
},
|
|
89
|
-
handleDragLeave: () => setIsDragging(false),
|
|
90
|
-
inputProps: {
|
|
91
|
-
id: name,
|
|
92
|
-
name,
|
|
93
|
-
type: "file",
|
|
94
|
-
accept: acceptedTypes.join(","),
|
|
95
|
-
multiple,
|
|
96
|
-
onChange: (e) => handleFiles(e.target.files),
|
|
97
|
-
},
|
|
98
|
-
}) }));
|
|
99
|
-
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/file-input-v2/index.ts"],"names":[],"mappings":"AAAA,cAAc,wBAAwB,CAAC;AACvC,cAAc,cAAc,CAAC"}
|