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.umd.js
CHANGED
@@ -1,14 +1,14 @@
|
|
1
1
|
(function (global, factory) {
|
2
|
-
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('material-design-icons-iconfont/dist/material-design-icons.css'), require('react'), require('react-switch'), require('moment'), require('moment-range'), require('moment/locale/es'), require('
|
3
|
-
typeof define === 'function' && define.amd ? define(['exports', 'material-design-icons-iconfont/dist/material-design-icons.css', 'react', 'react-switch', 'moment', 'moment-range', 'moment/locale/es', '
|
4
|
-
(global = global || self, factory(global.ywanaCore8 = {}, null, global.react, global.reactSwitch, global.moment, global.momentRange, null, global.
|
5
|
-
})(this, (function (exports, materialDesignIcons_css, React, RSwitch, moment$1, momentRange, es,
|
2
|
+
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('material-design-icons-iconfont/dist/material-design-icons.css'), require('react'), require('resumablejs'), require('react-switch'), require('moment'), require('moment-range'), require('moment/locale/es'), require('react-notifications-component'), require('react-notifications-component/dist/theme.css'), require('axios'), require('deep-equal')) :
|
3
|
+
typeof define === 'function' && define.amd ? define(['exports', 'material-design-icons-iconfont/dist/material-design-icons.css', 'react', 'resumablejs', 'react-switch', 'moment', 'moment-range', 'moment/locale/es', 'react-notifications-component', 'react-notifications-component/dist/theme.css', 'axios', 'deep-equal'], factory) :
|
4
|
+
(global = global || self, factory(global.ywanaCore8 = {}, null, global.react, global.resumablejs, global.reactSwitch, global.moment, global.momentRange, null, global.reactNotificationsComponent, null, global.axios, global.deepEqual));
|
5
|
+
})(this, (function (exports, materialDesignIcons_css, React, ResumableJS, RSwitch, moment$1, momentRange, es, reactNotificationsComponent, theme_css, axios, equal) {
|
6
6
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
7
7
|
|
8
8
|
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
9
|
+
var ResumableJS__default = /*#__PURE__*/_interopDefaultLegacy(ResumableJS);
|
9
10
|
var RSwitch__default = /*#__PURE__*/_interopDefaultLegacy(RSwitch);
|
10
11
|
var moment__default = /*#__PURE__*/_interopDefaultLegacy(moment$1);
|
11
|
-
var ResumableJS__default = /*#__PURE__*/_interopDefaultLegacy(ResumableJS);
|
12
12
|
var axios__default = /*#__PURE__*/_interopDefaultLegacy(axios);
|
13
13
|
var equal__default = /*#__PURE__*/_interopDefaultLegacy(equal);
|
14
14
|
|
@@ -1673,6 +1673,210 @@
|
|
1673
1673
|
}));
|
1674
1674
|
};
|
1675
1675
|
|
1676
|
+
/**
|
1677
|
+
* Upload Area
|
1678
|
+
*/
|
1679
|
+
var UploadArea = function UploadArea(props) {
|
1680
|
+
var _props$label = props.label,
|
1681
|
+
label = _props$label === void 0 ? 'Add file or drop file here...' : _props$label;
|
1682
|
+
var areaElement = React.useRef();
|
1683
|
+
var _useState = React.useState(false),
|
1684
|
+
drag = _useState[0],
|
1685
|
+
setDrag = _useState[1];
|
1686
|
+
var resumable = props.resumable;
|
1687
|
+
React.useEffect(function () {
|
1688
|
+
if (resumable && areaElement) {
|
1689
|
+
resumable.assignDrop(areaElement.current);
|
1690
|
+
}
|
1691
|
+
}, []);
|
1692
|
+
var onDragOver = function onDragOver() {
|
1693
|
+
setDrag(true);
|
1694
|
+
};
|
1695
|
+
var onDragLeave = function onDragLeave() {
|
1696
|
+
setDrag(false);
|
1697
|
+
};
|
1698
|
+
var dragging = drag === true ? 'drag-over' : '';
|
1699
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
1700
|
+
className: "upload-area6 " + dragging,
|
1701
|
+
onDragOver: onDragOver,
|
1702
|
+
onDragLeave: onDragLeave,
|
1703
|
+
ref: areaElement
|
1704
|
+
}, /*#__PURE__*/React__default["default"].createElement(UploadIcon, {
|
1705
|
+
resumable: resumable
|
1706
|
+
}), /*#__PURE__*/React__default["default"].createElement("label", null, label));
|
1707
|
+
};
|
1708
|
+
|
1709
|
+
/**
|
1710
|
+
* Upload Icon
|
1711
|
+
*/
|
1712
|
+
var UploadIcon = function UploadIcon(_ref) {
|
1713
|
+
var _ref$icon = _ref.icon,
|
1714
|
+
icon = _ref$icon === void 0 ? "folder_open" : _ref$icon,
|
1715
|
+
resumable = _ref.resumable;
|
1716
|
+
var iconElement = React.useRef();
|
1717
|
+
React.useEffect(function () {
|
1718
|
+
if (resumable && iconElement.current) {
|
1719
|
+
resumable.assignBrowse(iconElement.current);
|
1720
|
+
}
|
1721
|
+
}, [iconElement]);
|
1722
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
1723
|
+
className: "upload-icon",
|
1724
|
+
ref: iconElement
|
1725
|
+
}, /*#__PURE__*/React__default["default"].createElement(Icon, {
|
1726
|
+
icon: icon,
|
1727
|
+
clickable: true
|
1728
|
+
}));
|
1729
|
+
};
|
1730
|
+
|
1731
|
+
var UPLOAD_STATES = {
|
1732
|
+
IDLE: 0,
|
1733
|
+
RUNNING: 1,
|
1734
|
+
SUCCESS: 2,
|
1735
|
+
ERROR: 3,
|
1736
|
+
COMPLETED: 4
|
1737
|
+
};
|
1738
|
+
|
1739
|
+
/**
|
1740
|
+
* Upload File
|
1741
|
+
*/
|
1742
|
+
var UploadFile$1 = function UploadFile(_ref) {
|
1743
|
+
var file = _ref.file;
|
1744
|
+
var icon = file.icon,
|
1745
|
+
name = file.name,
|
1746
|
+
state = file.state,
|
1747
|
+
progress = file.progress,
|
1748
|
+
error = file.error;
|
1749
|
+
return /*#__PURE__*/React__default["default"].createElement(React.Fragment, null, /*#__PURE__*/React__default["default"].createElement("div", {
|
1750
|
+
className: "upload-file"
|
1751
|
+
}, icon ? /*#__PURE__*/React__default["default"].createElement(Icon, {
|
1752
|
+
icon: icon
|
1753
|
+
}) : 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, {
|
1754
|
+
progress: progress
|
1755
|
+
}), /*#__PURE__*/React__default["default"].createElement(Icon, {
|
1756
|
+
icon: "close",
|
1757
|
+
clickable: true
|
1758
|
+
})) : '', state === UPLOAD_STATES.SUCCESS ? /*#__PURE__*/React__default["default"].createElement("main", null, /*#__PURE__*/React__default["default"].createElement(Icon, {
|
1759
|
+
icon: "done"
|
1760
|
+
})) : '', state === UPLOAD_STATES.ERROR ? /*#__PURE__*/React__default["default"].createElement("main", null, /*#__PURE__*/React__default["default"].createElement("div", {
|
1761
|
+
className: "error"
|
1762
|
+
}, error), /*#__PURE__*/React__default["default"].createElement(Icon, {
|
1763
|
+
icon: "error"
|
1764
|
+
})) : ''));
|
1765
|
+
};
|
1766
|
+
|
1767
|
+
var UploadProgress = function UploadProgress(_ref) {
|
1768
|
+
var _ref$files = _ref.files,
|
1769
|
+
files = _ref$files === void 0 ? [] : _ref$files;
|
1770
|
+
return /*#__PURE__*/React__default["default"].createElement("div", null, files.map(function (file) {
|
1771
|
+
var f = {
|
1772
|
+
icon: "description",
|
1773
|
+
name: file.fileName,
|
1774
|
+
progress: file.progress() * 100,
|
1775
|
+
state: file.uploadState,
|
1776
|
+
error: file.uploadError
|
1777
|
+
};
|
1778
|
+
return /*#__PURE__*/React__default["default"].createElement(UploadFile$1, {
|
1779
|
+
key: f.name,
|
1780
|
+
file: f
|
1781
|
+
});
|
1782
|
+
}));
|
1783
|
+
};
|
1784
|
+
|
1785
|
+
/**
|
1786
|
+
* Uploader
|
1787
|
+
*/
|
1788
|
+
var Uploader = function Uploader(_ref) {
|
1789
|
+
var icon = _ref.icon,
|
1790
|
+
label = _ref.label,
|
1791
|
+
_ref$view = _ref.view,
|
1792
|
+
view = _ref$view === void 0 ? "area" : _ref$view,
|
1793
|
+
target = _ref.target,
|
1794
|
+
accept = _ref.accept,
|
1795
|
+
_ref$simultaneousUplo = _ref.simultaneousUploads,
|
1796
|
+
simultaneousUploads = _ref$simultaneousUplo === void 0 ? 1 : _ref$simultaneousUplo,
|
1797
|
+
className = _ref.className,
|
1798
|
+
onProgress = _ref.onProgress,
|
1799
|
+
onSuccess = _ref.onSuccess,
|
1800
|
+
onError = _ref.onError,
|
1801
|
+
onComplete = _ref.onComplete;
|
1802
|
+
var resumable = React.useMemo(function () {
|
1803
|
+
var config = {
|
1804
|
+
target: target,
|
1805
|
+
chunkSize: 1 * 1024 * 1024,
|
1806
|
+
simultaneousUploads: simultaneousUploads,
|
1807
|
+
testChunks: false,
|
1808
|
+
throttleProgressCallbacks: 1,
|
1809
|
+
fileType: accept
|
1810
|
+
};
|
1811
|
+
var resumable = new ResumableJS__default["default"](config);
|
1812
|
+
resumable.on('fileAdded', onFileAdded);
|
1813
|
+
resumable.on('fileProgress', onFileProgress);
|
1814
|
+
resumable.on('fileSuccess', onFileSuccess);
|
1815
|
+
resumable.on('fileError', onFileError);
|
1816
|
+
resumable.on('complete', onAllComplete);
|
1817
|
+
return resumable;
|
1818
|
+
}, []);
|
1819
|
+
var _useState = React.useState(0),
|
1820
|
+
setProgress = _useState[1];
|
1821
|
+
var _useState2 = React.useState(UPLOAD_STATES.IDLE),
|
1822
|
+
state = _useState2[0],
|
1823
|
+
setState = _useState2[1];
|
1824
|
+
var _useState3 = React.useState([]),
|
1825
|
+
files = _useState3[0],
|
1826
|
+
setFiles = _useState3[1];
|
1827
|
+
function onFileAdded(file) {
|
1828
|
+
files.push(file);
|
1829
|
+
setFiles(files);
|
1830
|
+
setState(UPLOAD_STATES.RUNNING);
|
1831
|
+
resumable.upload();
|
1832
|
+
}
|
1833
|
+
function onFileProgress(file) {
|
1834
|
+
file.uploadState = UPLOAD_STATES.RUNNING;
|
1835
|
+
var progress = file.progress();
|
1836
|
+
setProgress(progress);
|
1837
|
+
if (onProgress) onProgress(files);
|
1838
|
+
}
|
1839
|
+
function onFileSuccess(file, message) {
|
1840
|
+
file.uploadState = UPLOAD_STATES.SUCCESS;
|
1841
|
+
if (onSuccess) onSuccess(file, message);
|
1842
|
+
}
|
1843
|
+
function onFileError(file, message) {
|
1844
|
+
file.uploadState = UPLOAD_STATES.ERROR;
|
1845
|
+
file.uploadError = message;
|
1846
|
+
if (onError) onError(file, message);
|
1847
|
+
}
|
1848
|
+
function onAllComplete() {
|
1849
|
+
setState(UPLOAD_STATES.COMPLETED);
|
1850
|
+
if (onComplete) onComplete(files);
|
1851
|
+
}
|
1852
|
+
function renderView() {
|
1853
|
+
switch (view) {
|
1854
|
+
case "area":
|
1855
|
+
return /*#__PURE__*/React__default["default"].createElement(UploadArea, {
|
1856
|
+
resumable: resumable,
|
1857
|
+
icon: icon,
|
1858
|
+
label: label
|
1859
|
+
});
|
1860
|
+
case "icon":
|
1861
|
+
return /*#__PURE__*/React__default["default"].createElement(UploadIcon, {
|
1862
|
+
resumable: resumable,
|
1863
|
+
icon: icon
|
1864
|
+
});
|
1865
|
+
default:
|
1866
|
+
return /*#__PURE__*/React__default["default"].createElement(UploadArea, {
|
1867
|
+
resumable: resumable,
|
1868
|
+
icon: icon,
|
1869
|
+
label: label
|
1870
|
+
});
|
1871
|
+
}
|
1872
|
+
}
|
1873
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
1874
|
+
className: "uploader " + className
|
1875
|
+
}, state === UPLOAD_STATES.IDLE ? renderView() : /*#__PURE__*/React__default["default"].createElement(UploadProgress, {
|
1876
|
+
files: files
|
1877
|
+
}));
|
1878
|
+
};
|
1879
|
+
|
1676
1880
|
var isFunction$1 = function isFunction(value) {
|
1677
1881
|
return value && (Object.prototype.toString.call(value) === "[object Function]" || "function" === typeof value || value instanceof Function);
|
1678
1882
|
};
|
@@ -2056,6 +2260,12 @@
|
|
2056
2260
|
return _onChange(row.id, id, value);
|
2057
2261
|
}
|
2058
2262
|
});
|
2263
|
+
case "Image":
|
2264
|
+
return /*#__PURE__*/React__default["default"].createElement(ImageCellViewer, {
|
2265
|
+
id: id,
|
2266
|
+
value: cell,
|
2267
|
+
uploadURL: column.uploadURL
|
2268
|
+
});
|
2059
2269
|
default:
|
2060
2270
|
return cell;
|
2061
2271
|
}
|
@@ -2087,6 +2297,10 @@
|
|
2087
2297
|
format: format,
|
2088
2298
|
maxDecimals: maxDecimals
|
2089
2299
|
});
|
2300
|
+
case "Image":
|
2301
|
+
return /*#__PURE__*/React__default["default"].createElement("img", {
|
2302
|
+
src: cell
|
2303
|
+
});
|
2090
2304
|
default:
|
2091
2305
|
return cell;
|
2092
2306
|
}
|
@@ -2102,14 +2316,30 @@
|
|
2102
2316
|
}, render(column.type));
|
2103
2317
|
};
|
2104
2318
|
|
2319
|
+
/**
|
2320
|
+
* Image Cell Viewer
|
2321
|
+
*/
|
2322
|
+
var ImageCellViewer = function ImageCellViewer(_ref7) {
|
2323
|
+
var value = _ref7.value,
|
2324
|
+
uploadURL = _ref7.uploadURL;
|
2325
|
+
var canUpload = uploadURL ? true : false;
|
2326
|
+
return canUpload ? /*#__PURE__*/React__default["default"].createElement(Uploader, {
|
2327
|
+
view: "icon",
|
2328
|
+
icon: "cloud_upload",
|
2329
|
+
target: uploadURL
|
2330
|
+
}) : /*#__PURE__*/React__default["default"].createElement("img", {
|
2331
|
+
src: value
|
2332
|
+
});
|
2333
|
+
};
|
2334
|
+
|
2105
2335
|
/**
|
2106
2336
|
* Entity Cell Viewer
|
2107
2337
|
* @param {*} param0
|
2108
2338
|
* @returns
|
2109
2339
|
*/
|
2110
|
-
var EntityCellViewer = function EntityCellViewer(
|
2111
|
-
var item =
|
2112
|
-
value =
|
2340
|
+
var EntityCellViewer = function EntityCellViewer(_ref8) {
|
2341
|
+
var item = _ref8.item,
|
2342
|
+
value = _ref8.value;
|
2113
2343
|
var fields = Object.values(item).filter(function (field) {
|
2114
2344
|
return field.column === true;
|
2115
2345
|
});
|
@@ -2174,9 +2404,9 @@
|
|
2174
2404
|
/**
|
2175
2405
|
* Boolean Cell Viewer
|
2176
2406
|
*/
|
2177
|
-
var BooleanCellViewer = function BooleanCellViewer(
|
2178
|
-
var
|
2179
|
-
value =
|
2407
|
+
var BooleanCellViewer = function BooleanCellViewer(_ref9) {
|
2408
|
+
var _ref9$value = _ref9.value,
|
2409
|
+
value = _ref9$value === void 0 ? false : _ref9$value;
|
2180
2410
|
var icon = value === true ? "check_box" : "check_box_outline_blank";
|
2181
2411
|
return /*#__PURE__*/React__default["default"].createElement(Icon, {
|
2182
2412
|
icon: icon
|
@@ -2186,10 +2416,10 @@
|
|
2186
2416
|
/**
|
2187
2417
|
* NumberCellViewer
|
2188
2418
|
*/
|
2189
|
-
var NumberCellViewer = function NumberCellViewer(
|
2190
|
-
var value =
|
2191
|
-
format =
|
2192
|
-
maxDecimals =
|
2419
|
+
var NumberCellViewer = function NumberCellViewer(_ref10) {
|
2420
|
+
var value = _ref10.value,
|
2421
|
+
format = _ref10.format,
|
2422
|
+
maxDecimals = _ref10.maxDecimals;
|
2193
2423
|
/*
|
2194
2424
|
function formatNumber(number) {
|
2195
2425
|
// convert number to numeric
|
@@ -2259,12 +2489,12 @@
|
|
2259
2489
|
/**
|
2260
2490
|
* String Cell Viewer
|
2261
2491
|
*/
|
2262
|
-
var StringCellViewer = function StringCellViewer(
|
2263
|
-
var id =
|
2264
|
-
value =
|
2265
|
-
format =
|
2266
|
-
options =
|
2267
|
-
action =
|
2492
|
+
var StringCellViewer = function StringCellViewer(_ref11) {
|
2493
|
+
var id = _ref11.id,
|
2494
|
+
value = _ref11.value,
|
2495
|
+
format = _ref11.format,
|
2496
|
+
options = _ref11.options,
|
2497
|
+
action = _ref11.action;
|
2268
2498
|
function buildOptions() {
|
2269
2499
|
var opts = typeof options === 'function' ? options() : options;
|
2270
2500
|
return opts;
|
@@ -2334,12 +2564,12 @@
|
|
2334
2564
|
/**
|
2335
2565
|
* String Cell Editor
|
2336
2566
|
*/
|
2337
|
-
var StringCellEditor = function StringCellEditor(
|
2338
|
-
var id =
|
2339
|
-
|
2340
|
-
value =
|
2341
|
-
options =
|
2342
|
-
onChange =
|
2567
|
+
var StringCellEditor = function StringCellEditor(_ref12) {
|
2568
|
+
var id = _ref12.id,
|
2569
|
+
_ref12$value = _ref12.value,
|
2570
|
+
value = _ref12$value === void 0 ? '' : _ref12$value,
|
2571
|
+
options = _ref12.options,
|
2572
|
+
onChange = _ref12.onChange;
|
2343
2573
|
function change(id, value) {
|
2344
2574
|
if (onChange) onChange(id, value);
|
2345
2575
|
}
|
@@ -3889,210 +4119,6 @@
|
|
3889
4119
|
}, title);
|
3890
4120
|
};
|
3891
4121
|
|
3892
|
-
/**
|
3893
|
-
* Upload Area
|
3894
|
-
*/
|
3895
|
-
var UploadArea = function UploadArea(props) {
|
3896
|
-
var _props$label = props.label,
|
3897
|
-
label = _props$label === void 0 ? 'Add file or drop file here...' : _props$label;
|
3898
|
-
var areaElement = React.useRef();
|
3899
|
-
var _useState = React.useState(false),
|
3900
|
-
drag = _useState[0],
|
3901
|
-
setDrag = _useState[1];
|
3902
|
-
var resumable = props.resumable;
|
3903
|
-
React.useEffect(function () {
|
3904
|
-
if (resumable && areaElement) {
|
3905
|
-
resumable.assignDrop(areaElement.current);
|
3906
|
-
}
|
3907
|
-
}, []);
|
3908
|
-
var onDragOver = function onDragOver() {
|
3909
|
-
setDrag(true);
|
3910
|
-
};
|
3911
|
-
var onDragLeave = function onDragLeave() {
|
3912
|
-
setDrag(false);
|
3913
|
-
};
|
3914
|
-
var dragging = drag === true ? 'drag-over' : '';
|
3915
|
-
return /*#__PURE__*/React__default["default"].createElement("div", {
|
3916
|
-
className: "upload-area6 " + dragging,
|
3917
|
-
onDragOver: onDragOver,
|
3918
|
-
onDragLeave: onDragLeave,
|
3919
|
-
ref: areaElement
|
3920
|
-
}, /*#__PURE__*/React__default["default"].createElement(UploadIcon, {
|
3921
|
-
resumable: resumable
|
3922
|
-
}), /*#__PURE__*/React__default["default"].createElement("label", null, label));
|
3923
|
-
};
|
3924
|
-
|
3925
|
-
/**
|
3926
|
-
* Upload Icon
|
3927
|
-
*/
|
3928
|
-
var UploadIcon = function UploadIcon(_ref) {
|
3929
|
-
var _ref$icon = _ref.icon,
|
3930
|
-
icon = _ref$icon === void 0 ? "folder_open" : _ref$icon,
|
3931
|
-
resumable = _ref.resumable;
|
3932
|
-
var iconElement = React.useRef();
|
3933
|
-
React.useEffect(function () {
|
3934
|
-
if (resumable && iconElement.current) {
|
3935
|
-
resumable.assignBrowse(iconElement.current);
|
3936
|
-
}
|
3937
|
-
}, [iconElement]);
|
3938
|
-
return /*#__PURE__*/React__default["default"].createElement("div", {
|
3939
|
-
className: "upload-icon",
|
3940
|
-
ref: iconElement
|
3941
|
-
}, /*#__PURE__*/React__default["default"].createElement(Icon, {
|
3942
|
-
icon: icon,
|
3943
|
-
clickable: true
|
3944
|
-
}));
|
3945
|
-
};
|
3946
|
-
|
3947
|
-
var UPLOAD_STATES = {
|
3948
|
-
IDLE: 0,
|
3949
|
-
RUNNING: 1,
|
3950
|
-
SUCCESS: 2,
|
3951
|
-
ERROR: 3,
|
3952
|
-
COMPLETED: 4
|
3953
|
-
};
|
3954
|
-
|
3955
|
-
/**
|
3956
|
-
* Upload File
|
3957
|
-
*/
|
3958
|
-
var UploadFile$1 = function UploadFile(_ref) {
|
3959
|
-
var file = _ref.file;
|
3960
|
-
var icon = file.icon,
|
3961
|
-
name = file.name,
|
3962
|
-
state = file.state,
|
3963
|
-
progress = file.progress,
|
3964
|
-
error = file.error;
|
3965
|
-
return /*#__PURE__*/React__default["default"].createElement(React.Fragment, null, /*#__PURE__*/React__default["default"].createElement("div", {
|
3966
|
-
className: "upload-file"
|
3967
|
-
}, icon ? /*#__PURE__*/React__default["default"].createElement(Icon, {
|
3968
|
-
icon: icon
|
3969
|
-
}) : 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, {
|
3970
|
-
progress: progress
|
3971
|
-
}), /*#__PURE__*/React__default["default"].createElement(Icon, {
|
3972
|
-
icon: "close",
|
3973
|
-
clickable: true
|
3974
|
-
})) : '', state === UPLOAD_STATES.SUCCESS ? /*#__PURE__*/React__default["default"].createElement("main", null, /*#__PURE__*/React__default["default"].createElement(Icon, {
|
3975
|
-
icon: "done"
|
3976
|
-
})) : '', state === UPLOAD_STATES.ERROR ? /*#__PURE__*/React__default["default"].createElement("main", null, /*#__PURE__*/React__default["default"].createElement("div", {
|
3977
|
-
className: "error"
|
3978
|
-
}, error), /*#__PURE__*/React__default["default"].createElement(Icon, {
|
3979
|
-
icon: "error"
|
3980
|
-
})) : ''));
|
3981
|
-
};
|
3982
|
-
|
3983
|
-
var UploadProgress = function UploadProgress(_ref) {
|
3984
|
-
var _ref$files = _ref.files,
|
3985
|
-
files = _ref$files === void 0 ? [] : _ref$files;
|
3986
|
-
return /*#__PURE__*/React__default["default"].createElement("div", null, files.map(function (file) {
|
3987
|
-
var f = {
|
3988
|
-
icon: "description",
|
3989
|
-
name: file.fileName,
|
3990
|
-
progress: file.progress() * 100,
|
3991
|
-
state: file.uploadState,
|
3992
|
-
error: file.uploadError
|
3993
|
-
};
|
3994
|
-
return /*#__PURE__*/React__default["default"].createElement(UploadFile$1, {
|
3995
|
-
key: f.name,
|
3996
|
-
file: f
|
3997
|
-
});
|
3998
|
-
}));
|
3999
|
-
};
|
4000
|
-
|
4001
|
-
/**
|
4002
|
-
* Uploader
|
4003
|
-
*/
|
4004
|
-
var Uploader = function Uploader(_ref) {
|
4005
|
-
var icon = _ref.icon,
|
4006
|
-
label = _ref.label,
|
4007
|
-
_ref$view = _ref.view,
|
4008
|
-
view = _ref$view === void 0 ? "area" : _ref$view,
|
4009
|
-
target = _ref.target,
|
4010
|
-
accept = _ref.accept,
|
4011
|
-
_ref$simultaneousUplo = _ref.simultaneousUploads,
|
4012
|
-
simultaneousUploads = _ref$simultaneousUplo === void 0 ? 1 : _ref$simultaneousUplo,
|
4013
|
-
className = _ref.className,
|
4014
|
-
onProgress = _ref.onProgress,
|
4015
|
-
onSuccess = _ref.onSuccess,
|
4016
|
-
onError = _ref.onError,
|
4017
|
-
onComplete = _ref.onComplete;
|
4018
|
-
var resumable = React.useMemo(function () {
|
4019
|
-
var config = {
|
4020
|
-
target: target,
|
4021
|
-
chunkSize: 1 * 1024 * 1024,
|
4022
|
-
simultaneousUploads: simultaneousUploads,
|
4023
|
-
testChunks: false,
|
4024
|
-
throttleProgressCallbacks: 1,
|
4025
|
-
fileType: accept
|
4026
|
-
};
|
4027
|
-
var resumable = new ResumableJS__default["default"](config);
|
4028
|
-
resumable.on('fileAdded', onFileAdded);
|
4029
|
-
resumable.on('fileProgress', onFileProgress);
|
4030
|
-
resumable.on('fileSuccess', onFileSuccess);
|
4031
|
-
resumable.on('fileError', onFileError);
|
4032
|
-
resumable.on('complete', onAllComplete);
|
4033
|
-
return resumable;
|
4034
|
-
}, []);
|
4035
|
-
var _useState = React.useState(0),
|
4036
|
-
setProgress = _useState[1];
|
4037
|
-
var _useState2 = React.useState(UPLOAD_STATES.IDLE),
|
4038
|
-
state = _useState2[0],
|
4039
|
-
setState = _useState2[1];
|
4040
|
-
var _useState3 = React.useState([]),
|
4041
|
-
files = _useState3[0],
|
4042
|
-
setFiles = _useState3[1];
|
4043
|
-
function onFileAdded(file) {
|
4044
|
-
files.push(file);
|
4045
|
-
setFiles(files);
|
4046
|
-
setState(UPLOAD_STATES.RUNNING);
|
4047
|
-
resumable.upload();
|
4048
|
-
}
|
4049
|
-
function onFileProgress(file) {
|
4050
|
-
file.uploadState = UPLOAD_STATES.RUNNING;
|
4051
|
-
var progress = file.progress();
|
4052
|
-
setProgress(progress);
|
4053
|
-
if (onProgress) onProgress(files);
|
4054
|
-
}
|
4055
|
-
function onFileSuccess(file, message) {
|
4056
|
-
file.uploadState = UPLOAD_STATES.SUCCESS;
|
4057
|
-
if (onSuccess) onSuccess(file, message);
|
4058
|
-
}
|
4059
|
-
function onFileError(file, message) {
|
4060
|
-
file.uploadState = UPLOAD_STATES.ERROR;
|
4061
|
-
file.uploadError = message;
|
4062
|
-
if (onError) onError(file, message);
|
4063
|
-
}
|
4064
|
-
function onAllComplete() {
|
4065
|
-
setState(UPLOAD_STATES.COMPLETED);
|
4066
|
-
if (onComplete) onComplete(files);
|
4067
|
-
}
|
4068
|
-
function renderView() {
|
4069
|
-
switch (view) {
|
4070
|
-
case "area":
|
4071
|
-
return /*#__PURE__*/React__default["default"].createElement(UploadArea, {
|
4072
|
-
resumable: resumable,
|
4073
|
-
icon: icon,
|
4074
|
-
label: label
|
4075
|
-
});
|
4076
|
-
case "icon":
|
4077
|
-
return /*#__PURE__*/React__default["default"].createElement(UploadIcon, {
|
4078
|
-
resumable: resumable,
|
4079
|
-
icon: icon
|
4080
|
-
});
|
4081
|
-
default:
|
4082
|
-
return /*#__PURE__*/React__default["default"].createElement(UploadArea, {
|
4083
|
-
resumable: resumable,
|
4084
|
-
icon: icon,
|
4085
|
-
label: label
|
4086
|
-
});
|
4087
|
-
}
|
4088
|
-
}
|
4089
|
-
return /*#__PURE__*/React__default["default"].createElement("div", {
|
4090
|
-
className: "uploader " + className
|
4091
|
-
}, state === UPLOAD_STATES.IDLE ? renderView() : /*#__PURE__*/React__default["default"].createElement(UploadProgress, {
|
4092
|
-
files: files
|
4093
|
-
}));
|
4094
|
-
};
|
4095
|
-
|
4096
4122
|
/**
|
4097
4123
|
* Page Context
|
4098
4124
|
*/
|