1 | import _extends from 'babel-runtime/helpers/extends';
|
2 | import _classCallCheck from 'babel-runtime/helpers/classCallCheck';
|
3 | import _possibleConstructorReturn from 'babel-runtime/helpers/possibleConstructorReturn';
|
4 | import _inherits from 'babel-runtime/helpers/inherits';
|
5 |
|
6 | var _class, _temp2;
|
7 |
|
8 | import React from 'react';
|
9 | import PropTypes from 'prop-types';
|
10 | import { func } from '../../util';
|
11 | import { uid } from '../util';
|
12 |
|
13 | var noop = func.noop;
|
14 |
|
15 |
|
16 |
|
17 |
|
18 |
|
19 |
|
20 | var Selecter = (_temp2 = _class = function (_React$Component) {
|
21 | _inherits(Selecter, _React$Component);
|
22 |
|
23 | function Selecter() {
|
24 | var _temp, _this, _ret;
|
25 |
|
26 | _classCallCheck(this, Selecter);
|
27 |
|
28 | for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
|
29 | args[_key] = arguments[_key];
|
30 | }
|
31 |
|
32 | return _ret = (_temp = (_this = _possibleConstructorReturn(this, _React$Component.call.apply(_React$Component, [this].concat(args))), _this), _this.onSelect = function (e) {
|
33 | var files = e.target.files;
|
34 | var filesArr = files.length ? Array.prototype.slice.call(files) : [files];
|
35 |
|
36 | filesArr.forEach(function (file) {
|
37 | file.uid = uid();
|
38 | });
|
39 |
|
40 | _this.props.onSelect(filesArr);
|
41 | }, _this.onClick = function () {
|
42 | var el = _this.fileRef;
|
43 | if (!el) {
|
44 | return;
|
45 | }
|
46 |
|
47 | el.value = '';
|
48 | el.click();
|
49 | }, _this.onKeyDown = function (e) {
|
50 | if (e.key === 'Enter') {
|
51 | _this.onClick();
|
52 | }
|
53 | }, _this.onDrop = function (e) {
|
54 | e.preventDefault();
|
55 |
|
56 | var files = e.dataTransfer.files;
|
57 | var filesArr = Array.prototype.slice.call(files);
|
58 |
|
59 | _this.props.onDrop(filesArr);
|
60 | }, _this.onDragOver = function (e) {
|
61 | e.preventDefault();
|
62 | _this.props.onDragOver(e);
|
63 | }, _this.saveFileRef = function (ref) {
|
64 | _this.fileRef = ref;
|
65 | }, _temp), _possibleConstructorReturn(_this, _ret);
|
66 | }
|
67 |
|
68 | |
69 |
|
70 |
|
71 |
|
72 |
|
73 |
|
74 | |
75 |
|
76 |
|
77 |
|
78 |
|
79 |
|
80 |
|
81 | |
82 |
|
83 |
|
84 |
|
85 |
|
86 |
|
87 |
|
88 | Selecter.prototype.render = function render() {
|
89 | var _props = this.props,
|
90 | accept = _props.accept,
|
91 | multiple = _props.multiple,
|
92 | capture = _props.capture,
|
93 | webkitdirectory = _props.webkitdirectory,
|
94 | children = _props.children,
|
95 | id = _props.id,
|
96 | disabled = _props.disabled,
|
97 | dragable = _props.dragable,
|
98 | style = _props.style,
|
99 | className = _props.className,
|
100 | name = _props.name;
|
101 |
|
102 |
|
103 | var events = {};
|
104 | if (!disabled) {
|
105 | events = _extends({
|
106 | onClick: this.onClick,
|
107 | onKeyDown: this.onKeyDown,
|
108 | tabIndex: '0'
|
109 | }, dragable ? {
|
110 | onDrop: this.onDrop,
|
111 | onDragOver: this.onDragOver,
|
112 | onDragLeave: this.props.onDragLeave
|
113 | } : {});
|
114 | }
|
115 |
|
116 | var otherProps = {};
|
117 | if (webkitdirectory) {
|
118 | otherProps.webkitdirectory = '';
|
119 | }
|
120 | if (capture) {
|
121 | otherProps.capture = capture;
|
122 | }
|
123 |
|
124 | return React.createElement(
|
125 | 'div',
|
126 | _extends({ role: 'application', style: style, className: className }, events),
|
127 | React.createElement('input', _extends({}, otherProps, {
|
128 | type: 'file',
|
129 | name: name,
|
130 | id: id,
|
131 | ref: this.saveFileRef,
|
132 | style: { display: 'none' },
|
133 | accept: accept,
|
134 | 'aria-hidden': true,
|
135 | multiple: multiple,
|
136 | onChange: this.onSelect,
|
137 | disabled: disabled
|
138 | })),
|
139 | children
|
140 | );
|
141 | };
|
142 |
|
143 | return Selecter;
|
144 | }(React.Component), _class.propTypes = {
|
145 | id: PropTypes.string,
|
146 | style: PropTypes.object,
|
147 | className: PropTypes.string,
|
148 | |
149 |
|
150 |
|
151 | disabled: PropTypes.bool,
|
152 | |
153 |
|
154 |
|
155 | multiple: PropTypes.bool,
|
156 | |
157 |
|
158 |
|
159 | webkitdirectory: PropTypes.bool,
|
160 | |
161 |
|
162 |
|
163 | capture: PropTypes.string,
|
164 | |
165 |
|
166 |
|
167 | dragable: PropTypes.bool,
|
168 | |
169 |
|
170 |
|
171 | accept: PropTypes.string,
|
172 | |
173 |
|
174 |
|
175 | onSelect: PropTypes.func,
|
176 | |
177 |
|
178 |
|
179 | onDragOver: PropTypes.func,
|
180 | |
181 |
|
182 |
|
183 | onDragLeave: PropTypes.func,
|
184 | |
185 |
|
186 |
|
187 | onDrop: PropTypes.func,
|
188 | children: PropTypes.node,
|
189 | name: PropTypes.string
|
190 | }, _class.defaultProps = {
|
191 | name: 'file',
|
192 | multiple: false,
|
193 | onSelect: noop,
|
194 | onDragOver: noop,
|
195 | onDragLeave: noop,
|
196 | onDrop: noop
|
197 | }, _temp2);
|
198 | Selecter.displayName = 'Selecter';
|
199 | export { Selecter as default }; |
\ | No newline at end of file |