ywana-core8 0.0.952 → 0.0.954
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/index.cjs +254 -228
- package/dist/index.cjs.map +1 -1
- package/dist/index.css +80 -80
- package/dist/index.css.map +1 -1
- package/dist/index.modern.js +253 -227
- package/dist/index.modern.js.map +1 -1
- package/dist/index.umd.js +257 -231
- package/dist/index.umd.js.map +1 -1
- package/package.json +1 -1
- package/src/html/table.js +17 -0
package/dist/index.cjs
CHANGED
@@ -1,10 +1,10 @@
|
|
1
1
|
require('material-design-icons-iconfont/dist/material-design-icons.css');
|
2
2
|
var React = require('react');
|
3
|
+
var ResumableJS = require('resumablejs');
|
3
4
|
var RSwitch = require('react-switch');
|
4
5
|
var moment$1 = require('moment');
|
5
6
|
var momentRange = require('moment-range');
|
6
7
|
require('moment/locale/es');
|
7
|
-
var ResumableJS = require('resumablejs');
|
8
8
|
var reactNotificationsComponent = require('react-notifications-component');
|
9
9
|
require('react-notifications-component/dist/theme.css');
|
10
10
|
var axios = require('axios');
|
@@ -13,9 +13,9 @@ var equal = require('deep-equal');
|
|
13
13
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
14
14
|
|
15
15
|
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
16
|
+
var ResumableJS__default = /*#__PURE__*/_interopDefaultLegacy(ResumableJS);
|
16
17
|
var RSwitch__default = /*#__PURE__*/_interopDefaultLegacy(RSwitch);
|
17
18
|
var moment__default = /*#__PURE__*/_interopDefaultLegacy(moment$1);
|
18
|
-
var ResumableJS__default = /*#__PURE__*/_interopDefaultLegacy(ResumableJS);
|
19
19
|
var axios__default = /*#__PURE__*/_interopDefaultLegacy(axios);
|
20
20
|
var equal__default = /*#__PURE__*/_interopDefaultLegacy(equal);
|
21
21
|
|
@@ -1680,6 +1680,210 @@ var PasswordField = function PasswordField(props) {
|
|
1680
1680
|
}));
|
1681
1681
|
};
|
1682
1682
|
|
1683
|
+
/**
|
1684
|
+
* Upload Area
|
1685
|
+
*/
|
1686
|
+
var UploadArea = function UploadArea(props) {
|
1687
|
+
var _props$label = props.label,
|
1688
|
+
label = _props$label === void 0 ? 'Add file or drop file here...' : _props$label;
|
1689
|
+
var areaElement = React.useRef();
|
1690
|
+
var _useState = React.useState(false),
|
1691
|
+
drag = _useState[0],
|
1692
|
+
setDrag = _useState[1];
|
1693
|
+
var resumable = props.resumable;
|
1694
|
+
React.useEffect(function () {
|
1695
|
+
if (resumable && areaElement) {
|
1696
|
+
resumable.assignDrop(areaElement.current);
|
1697
|
+
}
|
1698
|
+
}, []);
|
1699
|
+
var onDragOver = function onDragOver() {
|
1700
|
+
setDrag(true);
|
1701
|
+
};
|
1702
|
+
var onDragLeave = function onDragLeave() {
|
1703
|
+
setDrag(false);
|
1704
|
+
};
|
1705
|
+
var dragging = drag === true ? 'drag-over' : '';
|
1706
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
1707
|
+
className: "upload-area6 " + dragging,
|
1708
|
+
onDragOver: onDragOver,
|
1709
|
+
onDragLeave: onDragLeave,
|
1710
|
+
ref: areaElement
|
1711
|
+
}, /*#__PURE__*/React__default["default"].createElement(UploadIcon, {
|
1712
|
+
resumable: resumable
|
1713
|
+
}), /*#__PURE__*/React__default["default"].createElement("label", null, label));
|
1714
|
+
};
|
1715
|
+
|
1716
|
+
/**
|
1717
|
+
* Upload Icon
|
1718
|
+
*/
|
1719
|
+
var UploadIcon = function UploadIcon(_ref) {
|
1720
|
+
var _ref$icon = _ref.icon,
|
1721
|
+
icon = _ref$icon === void 0 ? "folder_open" : _ref$icon,
|
1722
|
+
resumable = _ref.resumable;
|
1723
|
+
var iconElement = React.useRef();
|
1724
|
+
React.useEffect(function () {
|
1725
|
+
if (resumable && iconElement.current) {
|
1726
|
+
resumable.assignBrowse(iconElement.current);
|
1727
|
+
}
|
1728
|
+
}, [iconElement]);
|
1729
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
1730
|
+
className: "upload-icon",
|
1731
|
+
ref: iconElement
|
1732
|
+
}, /*#__PURE__*/React__default["default"].createElement(Icon, {
|
1733
|
+
icon: icon,
|
1734
|
+
clickable: true
|
1735
|
+
}));
|
1736
|
+
};
|
1737
|
+
|
1738
|
+
var UPLOAD_STATES = {
|
1739
|
+
IDLE: 0,
|
1740
|
+
RUNNING: 1,
|
1741
|
+
SUCCESS: 2,
|
1742
|
+
ERROR: 3,
|
1743
|
+
COMPLETED: 4
|
1744
|
+
};
|
1745
|
+
|
1746
|
+
/**
|
1747
|
+
* Upload File
|
1748
|
+
*/
|
1749
|
+
var UploadFile$1 = function UploadFile(_ref) {
|
1750
|
+
var file = _ref.file;
|
1751
|
+
var icon = file.icon,
|
1752
|
+
name = file.name,
|
1753
|
+
state = file.state,
|
1754
|
+
progress = file.progress,
|
1755
|
+
error = file.error;
|
1756
|
+
return /*#__PURE__*/React__default["default"].createElement(React.Fragment, null, /*#__PURE__*/React__default["default"].createElement("div", {
|
1757
|
+
className: "upload-file"
|
1758
|
+
}, icon ? /*#__PURE__*/React__default["default"].createElement(Icon, {
|
1759
|
+
icon: icon
|
1760
|
+
}) : null, /*#__PURE__*/React__default["default"].createElement("label", null, name), state === UPLOAD_STATES.RUNNING ? /*#__PURE__*/React__default["default"].createElement("main", null, /*#__PURE__*/React__default["default"].createElement(LinearProgress, {
|
1761
|
+
progress: progress
|
1762
|
+
}), /*#__PURE__*/React__default["default"].createElement(Icon, {
|
1763
|
+
icon: "close",
|
1764
|
+
clickable: true
|
1765
|
+
})) : '', state === UPLOAD_STATES.SUCCESS ? /*#__PURE__*/React__default["default"].createElement("main", null, /*#__PURE__*/React__default["default"].createElement(Icon, {
|
1766
|
+
icon: "done"
|
1767
|
+
})) : '', state === UPLOAD_STATES.ERROR ? /*#__PURE__*/React__default["default"].createElement("main", null, /*#__PURE__*/React__default["default"].createElement("div", {
|
1768
|
+
className: "error"
|
1769
|
+
}, error), /*#__PURE__*/React__default["default"].createElement(Icon, {
|
1770
|
+
icon: "error"
|
1771
|
+
})) : ''));
|
1772
|
+
};
|
1773
|
+
|
1774
|
+
var UploadProgress = function UploadProgress(_ref) {
|
1775
|
+
var _ref$files = _ref.files,
|
1776
|
+
files = _ref$files === void 0 ? [] : _ref$files;
|
1777
|
+
return /*#__PURE__*/React__default["default"].createElement("div", null, files.map(function (file) {
|
1778
|
+
var f = {
|
1779
|
+
icon: "description",
|
1780
|
+
name: file.fileName,
|
1781
|
+
progress: file.progress() * 100,
|
1782
|
+
state: file.uploadState,
|
1783
|
+
error: file.uploadError
|
1784
|
+
};
|
1785
|
+
return /*#__PURE__*/React__default["default"].createElement(UploadFile$1, {
|
1786
|
+
key: f.name,
|
1787
|
+
file: f
|
1788
|
+
});
|
1789
|
+
}));
|
1790
|
+
};
|
1791
|
+
|
1792
|
+
/**
|
1793
|
+
* Uploader
|
1794
|
+
*/
|
1795
|
+
var Uploader = function Uploader(_ref) {
|
1796
|
+
var icon = _ref.icon,
|
1797
|
+
label = _ref.label,
|
1798
|
+
_ref$view = _ref.view,
|
1799
|
+
view = _ref$view === void 0 ? "area" : _ref$view,
|
1800
|
+
target = _ref.target,
|
1801
|
+
accept = _ref.accept,
|
1802
|
+
_ref$simultaneousUplo = _ref.simultaneousUploads,
|
1803
|
+
simultaneousUploads = _ref$simultaneousUplo === void 0 ? 1 : _ref$simultaneousUplo,
|
1804
|
+
className = _ref.className,
|
1805
|
+
onProgress = _ref.onProgress,
|
1806
|
+
onSuccess = _ref.onSuccess,
|
1807
|
+
onError = _ref.onError,
|
1808
|
+
onComplete = _ref.onComplete;
|
1809
|
+
var resumable = React.useMemo(function () {
|
1810
|
+
var config = {
|
1811
|
+
target: target,
|
1812
|
+
chunkSize: 1 * 1024 * 1024,
|
1813
|
+
simultaneousUploads: simultaneousUploads,
|
1814
|
+
testChunks: false,
|
1815
|
+
throttleProgressCallbacks: 1,
|
1816
|
+
fileType: accept
|
1817
|
+
};
|
1818
|
+
var resumable = new ResumableJS__default["default"](config);
|
1819
|
+
resumable.on('fileAdded', onFileAdded);
|
1820
|
+
resumable.on('fileProgress', onFileProgress);
|
1821
|
+
resumable.on('fileSuccess', onFileSuccess);
|
1822
|
+
resumable.on('fileError', onFileError);
|
1823
|
+
resumable.on('complete', onAllComplete);
|
1824
|
+
return resumable;
|
1825
|
+
}, []);
|
1826
|
+
var _useState = React.useState(0),
|
1827
|
+
setProgress = _useState[1];
|
1828
|
+
var _useState2 = React.useState(UPLOAD_STATES.IDLE),
|
1829
|
+
state = _useState2[0],
|
1830
|
+
setState = _useState2[1];
|
1831
|
+
var _useState3 = React.useState([]),
|
1832
|
+
files = _useState3[0],
|
1833
|
+
setFiles = _useState3[1];
|
1834
|
+
function onFileAdded(file) {
|
1835
|
+
files.push(file);
|
1836
|
+
setFiles(files);
|
1837
|
+
setState(UPLOAD_STATES.RUNNING);
|
1838
|
+
resumable.upload();
|
1839
|
+
}
|
1840
|
+
function onFileProgress(file) {
|
1841
|
+
file.uploadState = UPLOAD_STATES.RUNNING;
|
1842
|
+
var progress = file.progress();
|
1843
|
+
setProgress(progress);
|
1844
|
+
if (onProgress) onProgress(files);
|
1845
|
+
}
|
1846
|
+
function onFileSuccess(file, message) {
|
1847
|
+
file.uploadState = UPLOAD_STATES.SUCCESS;
|
1848
|
+
if (onSuccess) onSuccess(file, message);
|
1849
|
+
}
|
1850
|
+
function onFileError(file, message) {
|
1851
|
+
file.uploadState = UPLOAD_STATES.ERROR;
|
1852
|
+
file.uploadError = message;
|
1853
|
+
if (onError) onError(file, message);
|
1854
|
+
}
|
1855
|
+
function onAllComplete() {
|
1856
|
+
setState(UPLOAD_STATES.COMPLETED);
|
1857
|
+
if (onComplete) onComplete(files);
|
1858
|
+
}
|
1859
|
+
function renderView() {
|
1860
|
+
switch (view) {
|
1861
|
+
case "area":
|
1862
|
+
return /*#__PURE__*/React__default["default"].createElement(UploadArea, {
|
1863
|
+
resumable: resumable,
|
1864
|
+
icon: icon,
|
1865
|
+
label: label
|
1866
|
+
});
|
1867
|
+
case "icon":
|
1868
|
+
return /*#__PURE__*/React__default["default"].createElement(UploadIcon, {
|
1869
|
+
resumable: resumable,
|
1870
|
+
icon: icon
|
1871
|
+
});
|
1872
|
+
default:
|
1873
|
+
return /*#__PURE__*/React__default["default"].createElement(UploadArea, {
|
1874
|
+
resumable: resumable,
|
1875
|
+
icon: icon,
|
1876
|
+
label: label
|
1877
|
+
});
|
1878
|
+
}
|
1879
|
+
}
|
1880
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
1881
|
+
className: "uploader " + className
|
1882
|
+
}, state === UPLOAD_STATES.IDLE ? renderView() : /*#__PURE__*/React__default["default"].createElement(UploadProgress, {
|
1883
|
+
files: files
|
1884
|
+
}));
|
1885
|
+
};
|
1886
|
+
|
1683
1887
|
var isFunction$1 = function isFunction(value) {
|
1684
1888
|
return value && (Object.prototype.toString.call(value) === "[object Function]" || "function" === typeof value || value instanceof Function);
|
1685
1889
|
};
|
@@ -2063,6 +2267,12 @@ var DataTableCell = function DataTableCell(_ref6) {
|
|
2063
2267
|
return _onChange(row.id, id, value);
|
2064
2268
|
}
|
2065
2269
|
});
|
2270
|
+
case "Image":
|
2271
|
+
return /*#__PURE__*/React__default["default"].createElement(ImageCellViewer, {
|
2272
|
+
id: id,
|
2273
|
+
value: cell,
|
2274
|
+
uploadURL: column.uploadURL
|
2275
|
+
});
|
2066
2276
|
default:
|
2067
2277
|
return cell;
|
2068
2278
|
}
|
@@ -2094,6 +2304,10 @@ var DataTableCell = function DataTableCell(_ref6) {
|
|
2094
2304
|
format: format,
|
2095
2305
|
maxDecimals: maxDecimals
|
2096
2306
|
});
|
2307
|
+
case "Image":
|
2308
|
+
return /*#__PURE__*/React__default["default"].createElement("img", {
|
2309
|
+
src: cell
|
2310
|
+
});
|
2097
2311
|
default:
|
2098
2312
|
return cell;
|
2099
2313
|
}
|
@@ -2109,14 +2323,30 @@ var DataTableCell = function DataTableCell(_ref6) {
|
|
2109
2323
|
}, render(column.type));
|
2110
2324
|
};
|
2111
2325
|
|
2326
|
+
/**
|
2327
|
+
* Image Cell Viewer
|
2328
|
+
*/
|
2329
|
+
var ImageCellViewer = function ImageCellViewer(_ref7) {
|
2330
|
+
var value = _ref7.value,
|
2331
|
+
uploadURL = _ref7.uploadURL;
|
2332
|
+
var canUpload = uploadURL ? true : false;
|
2333
|
+
return canUpload ? /*#__PURE__*/React__default["default"].createElement(Uploader, {
|
2334
|
+
view: "icon",
|
2335
|
+
icon: "cloud_upload",
|
2336
|
+
target: uploadURL
|
2337
|
+
}) : /*#__PURE__*/React__default["default"].createElement("img", {
|
2338
|
+
src: value
|
2339
|
+
});
|
2340
|
+
};
|
2341
|
+
|
2112
2342
|
/**
|
2113
2343
|
* Entity Cell Viewer
|
2114
2344
|
* @param {*} param0
|
2115
2345
|
* @returns
|
2116
2346
|
*/
|
2117
|
-
var EntityCellViewer = function EntityCellViewer(
|
2118
|
-
var item =
|
2119
|
-
value =
|
2347
|
+
var EntityCellViewer = function EntityCellViewer(_ref8) {
|
2348
|
+
var item = _ref8.item,
|
2349
|
+
value = _ref8.value;
|
2120
2350
|
var fields = Object.values(item).filter(function (field) {
|
2121
2351
|
return field.column === true;
|
2122
2352
|
});
|
@@ -2181,9 +2411,9 @@ var EntityCellViewer = function EntityCellViewer(_ref7) {
|
|
2181
2411
|
/**
|
2182
2412
|
* Boolean Cell Viewer
|
2183
2413
|
*/
|
2184
|
-
var BooleanCellViewer = function BooleanCellViewer(
|
2185
|
-
var
|
2186
|
-
value =
|
2414
|
+
var BooleanCellViewer = function BooleanCellViewer(_ref9) {
|
2415
|
+
var _ref9$value = _ref9.value,
|
2416
|
+
value = _ref9$value === void 0 ? false : _ref9$value;
|
2187
2417
|
var icon = value === true ? "check_box" : "check_box_outline_blank";
|
2188
2418
|
return /*#__PURE__*/React__default["default"].createElement(Icon, {
|
2189
2419
|
icon: icon
|
@@ -2193,10 +2423,10 @@ var BooleanCellViewer = function BooleanCellViewer(_ref8) {
|
|
2193
2423
|
/**
|
2194
2424
|
* NumberCellViewer
|
2195
2425
|
*/
|
2196
|
-
var NumberCellViewer = function NumberCellViewer(
|
2197
|
-
var value =
|
2198
|
-
format =
|
2199
|
-
maxDecimals =
|
2426
|
+
var NumberCellViewer = function NumberCellViewer(_ref10) {
|
2427
|
+
var value = _ref10.value,
|
2428
|
+
format = _ref10.format,
|
2429
|
+
maxDecimals = _ref10.maxDecimals;
|
2200
2430
|
/*
|
2201
2431
|
function formatNumber(number) {
|
2202
2432
|
// convert number to numeric
|
@@ -2266,12 +2496,12 @@ var NumberCellViewer = function NumberCellViewer(_ref9) {
|
|
2266
2496
|
/**
|
2267
2497
|
* String Cell Viewer
|
2268
2498
|
*/
|
2269
|
-
var StringCellViewer = function StringCellViewer(
|
2270
|
-
var id =
|
2271
|
-
value =
|
2272
|
-
format =
|
2273
|
-
options =
|
2274
|
-
action =
|
2499
|
+
var StringCellViewer = function StringCellViewer(_ref11) {
|
2500
|
+
var id = _ref11.id,
|
2501
|
+
value = _ref11.value,
|
2502
|
+
format = _ref11.format,
|
2503
|
+
options = _ref11.options,
|
2504
|
+
action = _ref11.action;
|
2275
2505
|
function buildOptions() {
|
2276
2506
|
var opts = typeof options === 'function' ? options() : options;
|
2277
2507
|
return opts;
|
@@ -2341,12 +2571,12 @@ var StringCellViewer = function StringCellViewer(_ref10) {
|
|
2341
2571
|
/**
|
2342
2572
|
* String Cell Editor
|
2343
2573
|
*/
|
2344
|
-
var StringCellEditor = function StringCellEditor(
|
2345
|
-
var id =
|
2346
|
-
|
2347
|
-
value =
|
2348
|
-
options =
|
2349
|
-
onChange =
|
2574
|
+
var StringCellEditor = function StringCellEditor(_ref12) {
|
2575
|
+
var id = _ref12.id,
|
2576
|
+
_ref12$value = _ref12.value,
|
2577
|
+
value = _ref12$value === void 0 ? '' : _ref12$value,
|
2578
|
+
options = _ref12.options,
|
2579
|
+
onChange = _ref12.onChange;
|
2350
2580
|
function change(id, value) {
|
2351
2581
|
if (onChange) onChange(id, value);
|
2352
2582
|
}
|
@@ -3896,210 +4126,6 @@ var EventCard = function EventCard(props) {
|
|
3896
4126
|
}, title);
|
3897
4127
|
};
|
3898
4128
|
|
3899
|
-
/**
|
3900
|
-
* Upload Area
|
3901
|
-
*/
|
3902
|
-
var UploadArea = function UploadArea(props) {
|
3903
|
-
var _props$label = props.label,
|
3904
|
-
label = _props$label === void 0 ? 'Add file or drop file here...' : _props$label;
|
3905
|
-
var areaElement = React.useRef();
|
3906
|
-
var _useState = React.useState(false),
|
3907
|
-
drag = _useState[0],
|
3908
|
-
setDrag = _useState[1];
|
3909
|
-
var resumable = props.resumable;
|
3910
|
-
React.useEffect(function () {
|
3911
|
-
if (resumable && areaElement) {
|
3912
|
-
resumable.assignDrop(areaElement.current);
|
3913
|
-
}
|
3914
|
-
}, []);
|
3915
|
-
var onDragOver = function onDragOver() {
|
3916
|
-
setDrag(true);
|
3917
|
-
};
|
3918
|
-
var onDragLeave = function onDragLeave() {
|
3919
|
-
setDrag(false);
|
3920
|
-
};
|
3921
|
-
var dragging = drag === true ? 'drag-over' : '';
|
3922
|
-
return /*#__PURE__*/React__default["default"].createElement("div", {
|
3923
|
-
className: "upload-area6 " + dragging,
|
3924
|
-
onDragOver: onDragOver,
|
3925
|
-
onDragLeave: onDragLeave,
|
3926
|
-
ref: areaElement
|
3927
|
-
}, /*#__PURE__*/React__default["default"].createElement(UploadIcon, {
|
3928
|
-
resumable: resumable
|
3929
|
-
}), /*#__PURE__*/React__default["default"].createElement("label", null, label));
|
3930
|
-
};
|
3931
|
-
|
3932
|
-
/**
|
3933
|
-
* Upload Icon
|
3934
|
-
*/
|
3935
|
-
var UploadIcon = function UploadIcon(_ref) {
|
3936
|
-
var _ref$icon = _ref.icon,
|
3937
|
-
icon = _ref$icon === void 0 ? "folder_open" : _ref$icon,
|
3938
|
-
resumable = _ref.resumable;
|
3939
|
-
var iconElement = React.useRef();
|
3940
|
-
React.useEffect(function () {
|
3941
|
-
if (resumable && iconElement.current) {
|
3942
|
-
resumable.assignBrowse(iconElement.current);
|
3943
|
-
}
|
3944
|
-
}, [iconElement]);
|
3945
|
-
return /*#__PURE__*/React__default["default"].createElement("div", {
|
3946
|
-
className: "upload-icon",
|
3947
|
-
ref: iconElement
|
3948
|
-
}, /*#__PURE__*/React__default["default"].createElement(Icon, {
|
3949
|
-
icon: icon,
|
3950
|
-
clickable: true
|
3951
|
-
}));
|
3952
|
-
};
|
3953
|
-
|
3954
|
-
var UPLOAD_STATES = {
|
3955
|
-
IDLE: 0,
|
3956
|
-
RUNNING: 1,
|
3957
|
-
SUCCESS: 2,
|
3958
|
-
ERROR: 3,
|
3959
|
-
COMPLETED: 4
|
3960
|
-
};
|
3961
|
-
|
3962
|
-
/**
|
3963
|
-
* Upload File
|
3964
|
-
*/
|
3965
|
-
var UploadFile$1 = function UploadFile(_ref) {
|
3966
|
-
var file = _ref.file;
|
3967
|
-
var icon = file.icon,
|
3968
|
-
name = file.name,
|
3969
|
-
state = file.state,
|
3970
|
-
progress = file.progress,
|
3971
|
-
error = file.error;
|
3972
|
-
return /*#__PURE__*/React__default["default"].createElement(React.Fragment, null, /*#__PURE__*/React__default["default"].createElement("div", {
|
3973
|
-
className: "upload-file"
|
3974
|
-
}, icon ? /*#__PURE__*/React__default["default"].createElement(Icon, {
|
3975
|
-
icon: icon
|
3976
|
-
}) : null, /*#__PURE__*/React__default["default"].createElement("label", null, name), state === UPLOAD_STATES.RUNNING ? /*#__PURE__*/React__default["default"].createElement("main", null, /*#__PURE__*/React__default["default"].createElement(LinearProgress, {
|
3977
|
-
progress: progress
|
3978
|
-
}), /*#__PURE__*/React__default["default"].createElement(Icon, {
|
3979
|
-
icon: "close",
|
3980
|
-
clickable: true
|
3981
|
-
})) : '', state === UPLOAD_STATES.SUCCESS ? /*#__PURE__*/React__default["default"].createElement("main", null, /*#__PURE__*/React__default["default"].createElement(Icon, {
|
3982
|
-
icon: "done"
|
3983
|
-
})) : '', state === UPLOAD_STATES.ERROR ? /*#__PURE__*/React__default["default"].createElement("main", null, /*#__PURE__*/React__default["default"].createElement("div", {
|
3984
|
-
className: "error"
|
3985
|
-
}, error), /*#__PURE__*/React__default["default"].createElement(Icon, {
|
3986
|
-
icon: "error"
|
3987
|
-
})) : ''));
|
3988
|
-
};
|
3989
|
-
|
3990
|
-
var UploadProgress = function UploadProgress(_ref) {
|
3991
|
-
var _ref$files = _ref.files,
|
3992
|
-
files = _ref$files === void 0 ? [] : _ref$files;
|
3993
|
-
return /*#__PURE__*/React__default["default"].createElement("div", null, files.map(function (file) {
|
3994
|
-
var f = {
|
3995
|
-
icon: "description",
|
3996
|
-
name: file.fileName,
|
3997
|
-
progress: file.progress() * 100,
|
3998
|
-
state: file.uploadState,
|
3999
|
-
error: file.uploadError
|
4000
|
-
};
|
4001
|
-
return /*#__PURE__*/React__default["default"].createElement(UploadFile$1, {
|
4002
|
-
key: f.name,
|
4003
|
-
file: f
|
4004
|
-
});
|
4005
|
-
}));
|
4006
|
-
};
|
4007
|
-
|
4008
|
-
/**
|
4009
|
-
* Uploader
|
4010
|
-
*/
|
4011
|
-
var Uploader = function Uploader(_ref) {
|
4012
|
-
var icon = _ref.icon,
|
4013
|
-
label = _ref.label,
|
4014
|
-
_ref$view = _ref.view,
|
4015
|
-
view = _ref$view === void 0 ? "area" : _ref$view,
|
4016
|
-
target = _ref.target,
|
4017
|
-
accept = _ref.accept,
|
4018
|
-
_ref$simultaneousUplo = _ref.simultaneousUploads,
|
4019
|
-
simultaneousUploads = _ref$simultaneousUplo === void 0 ? 1 : _ref$simultaneousUplo,
|
4020
|
-
className = _ref.className,
|
4021
|
-
onProgress = _ref.onProgress,
|
4022
|
-
onSuccess = _ref.onSuccess,
|
4023
|
-
onError = _ref.onError,
|
4024
|
-
onComplete = _ref.onComplete;
|
4025
|
-
var resumable = React.useMemo(function () {
|
4026
|
-
var config = {
|
4027
|
-
target: target,
|
4028
|
-
chunkSize: 1 * 1024 * 1024,
|
4029
|
-
simultaneousUploads: simultaneousUploads,
|
4030
|
-
testChunks: false,
|
4031
|
-
throttleProgressCallbacks: 1,
|
4032
|
-
fileType: accept
|
4033
|
-
};
|
4034
|
-
var resumable = new ResumableJS__default["default"](config);
|
4035
|
-
resumable.on('fileAdded', onFileAdded);
|
4036
|
-
resumable.on('fileProgress', onFileProgress);
|
4037
|
-
resumable.on('fileSuccess', onFileSuccess);
|
4038
|
-
resumable.on('fileError', onFileError);
|
4039
|
-
resumable.on('complete', onAllComplete);
|
4040
|
-
return resumable;
|
4041
|
-
}, []);
|
4042
|
-
var _useState = React.useState(0),
|
4043
|
-
setProgress = _useState[1];
|
4044
|
-
var _useState2 = React.useState(UPLOAD_STATES.IDLE),
|
4045
|
-
state = _useState2[0],
|
4046
|
-
setState = _useState2[1];
|
4047
|
-
var _useState3 = React.useState([]),
|
4048
|
-
files = _useState3[0],
|
4049
|
-
setFiles = _useState3[1];
|
4050
|
-
function onFileAdded(file) {
|
4051
|
-
files.push(file);
|
4052
|
-
setFiles(files);
|
4053
|
-
setState(UPLOAD_STATES.RUNNING);
|
4054
|
-
resumable.upload();
|
4055
|
-
}
|
4056
|
-
function onFileProgress(file) {
|
4057
|
-
file.uploadState = UPLOAD_STATES.RUNNING;
|
4058
|
-
var progress = file.progress();
|
4059
|
-
setProgress(progress);
|
4060
|
-
if (onProgress) onProgress(files);
|
4061
|
-
}
|
4062
|
-
function onFileSuccess(file, message) {
|
4063
|
-
file.uploadState = UPLOAD_STATES.SUCCESS;
|
4064
|
-
if (onSuccess) onSuccess(file, message);
|
4065
|
-
}
|
4066
|
-
function onFileError(file, message) {
|
4067
|
-
file.uploadState = UPLOAD_STATES.ERROR;
|
4068
|
-
file.uploadError = message;
|
4069
|
-
if (onError) onError(file, message);
|
4070
|
-
}
|
4071
|
-
function onAllComplete() {
|
4072
|
-
setState(UPLOAD_STATES.COMPLETED);
|
4073
|
-
if (onComplete) onComplete(files);
|
4074
|
-
}
|
4075
|
-
function renderView() {
|
4076
|
-
switch (view) {
|
4077
|
-
case "area":
|
4078
|
-
return /*#__PURE__*/React__default["default"].createElement(UploadArea, {
|
4079
|
-
resumable: resumable,
|
4080
|
-
icon: icon,
|
4081
|
-
label: label
|
4082
|
-
});
|
4083
|
-
case "icon":
|
4084
|
-
return /*#__PURE__*/React__default["default"].createElement(UploadIcon, {
|
4085
|
-
resumable: resumable,
|
4086
|
-
icon: icon
|
4087
|
-
});
|
4088
|
-
default:
|
4089
|
-
return /*#__PURE__*/React__default["default"].createElement(UploadArea, {
|
4090
|
-
resumable: resumable,
|
4091
|
-
icon: icon,
|
4092
|
-
label: label
|
4093
|
-
});
|
4094
|
-
}
|
4095
|
-
}
|
4096
|
-
return /*#__PURE__*/React__default["default"].createElement("div", {
|
4097
|
-
className: "uploader " + className
|
4098
|
-
}, state === UPLOAD_STATES.IDLE ? renderView() : /*#__PURE__*/React__default["default"].createElement(UploadProgress, {
|
4099
|
-
files: files
|
4100
|
-
}));
|
4101
|
-
};
|
4102
|
-
|
4103
4129
|
/**
|
4104
4130
|
* Page Context
|
4105
4131
|
*/
|