react-align 2.0.5 → 2.1.0

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.
@@ -1,615 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
6
-
7
- var React = require('react');
8
- var React__default = _interopDefault(React);
9
- var reactBeautifulDnd = require('react-beautiful-dnd');
10
-
11
- var Context = /*#__PURE__*/React.createContext({
12
- editing: false,
13
- isDragging: false
14
- });
15
- var useAlignContext = function useAlignContext() {
16
- return React.useContext(Context);
17
- };
18
-
19
- function styleInject(css, ref) {
20
- if ( ref === void 0 ) ref = {};
21
- var insertAt = ref.insertAt;
22
-
23
- if (!css || typeof document === 'undefined') { return; }
24
-
25
- var head = document.head || document.getElementsByTagName('head')[0];
26
- var style = document.createElement('style');
27
- style.type = 'text/css';
28
-
29
- if (insertAt === 'top') {
30
- if (head.firstChild) {
31
- head.insertBefore(style, head.firstChild);
32
- } else {
33
- head.appendChild(style);
34
- }
35
- } else {
36
- head.appendChild(style);
37
- }
38
-
39
- if (style.styleSheet) {
40
- style.styleSheet.cssText = css;
41
- } else {
42
- style.appendChild(document.createTextNode(css));
43
- }
44
- }
45
-
46
- var css_248z = ".wrapper{height:100%}.section,.wrapper{display:flex;justify-content:space-between}.section{flex-direction:column}.area{border:0 solid transparent;border-radius:8px;box-sizing:border-box;display:flex;position:relative}.area-transition-in{transition:all .3s ease-in-out,min-height .5s ease-in-out .2s,min-width .5s ease-in-out .2s}.area-transition-out{transition:all .3s ease-in-out .4s,min-height .5s ease-in-out .2s,min-width .5s ease-in-out .2s}.item{border:0 solid transparent;border-radius:6px;margin:6px;position:relative}.stretch{flex:auto}.middle{flex-grow:0;flex:auto}.just-centered{justify-content:center}.just-end{justify-content:flex-end}.end{align-items:flex-end}.hide{display:none}.overlay{background:rgba(0,0,0,.6);box-sizing:border-box;height:100%;left:0;position:absolute;top:0;width:100%}.overlay-buttons{box-sizing:border-box;display:flex;justify-content:space-between;padding:6px}";
47
- styleInject(css_248z);
48
-
49
- var GridWrapper = function GridWrapper(_ref) {
50
- var className = _ref.className,
51
- children = _ref.children,
52
- editing = _ref.editing,
53
- vertical = _ref.vertical,
54
- stretch = _ref.stretch,
55
- style = _ref.style,
56
- editorStyle = _ref.editorStyle,
57
- onMove = _ref.onMove,
58
- onAlignChange = _ref.onAlignChange,
59
- onExtend = _ref.onExtend;
60
-
61
- var _useState = React.useState(false),
62
- isDragging = _useState[0],
63
- setDragging = _useState[1];
64
-
65
- var handleDragStart = React.useCallback(function () {
66
- setDragging(true);
67
- }, []);
68
- var handleDragEnd = React.useCallback(function (result, _provided) {
69
- setDragging(false);
70
- if (!result.destination || result.reason !== 'DROP' || result.destination.droppableId === result.source.droppableId && result.destination.index === result.source.index) return;
71
- onMove == null ? void 0 : onMove(result.draggableId, result.destination.droppableId, result.destination.index, result.source.droppableId, result.source.index);
72
- }, [onMove]);
73
- return React__default.createElement("div", {
74
- className: "wrapper " + className + " " + (vertical && 'vertical') + " " + (stretch && 'stretch'),
75
- style: editing ? editorStyle : style
76
- }, React__default.createElement(reactBeautifulDnd.DragDropContext, {
77
- onDragStart: handleDragStart,
78
- onDragEnd: handleDragEnd
79
- }, React__default.createElement(Context.Provider, {
80
- value: {
81
- editing: !!editing,
82
- onAlignChange: onAlignChange,
83
- onExtend: onExtend,
84
- isDragging: isDragging
85
- }
86
- }, children)));
87
- };
88
-
89
- function _extends() {
90
- _extends = Object.assign || function (target) {
91
- for (var i = 1; i < arguments.length; i++) {
92
- var source = arguments[i];
93
-
94
- for (var key in source) {
95
- if (Object.prototype.hasOwnProperty.call(source, key)) {
96
- target[key] = source[key];
97
- }
98
- }
99
- }
100
-
101
- return target;
102
- };
103
-
104
- return _extends.apply(this, arguments);
105
- }
106
-
107
- function _objectWithoutPropertiesLoose(source, excluded) {
108
- if (source == null) return {};
109
- var target = {};
110
- var sourceKeys = Object.keys(source);
111
- var key, i;
112
-
113
- for (i = 0; i < sourceKeys.length; i++) {
114
- key = sourceKeys[i];
115
- if (excluded.indexOf(key) >= 0) continue;
116
- target[key] = source[key];
117
- }
118
-
119
- return target;
120
- }
121
-
122
- var GridSection = function GridSection(_ref) {
123
- var className = _ref.className,
124
- children = _ref.children,
125
- horizontal = _ref.horizontal,
126
- stretch = _ref.stretch,
127
- fixedWidth = _ref.fixedWidth,
128
- fixedHeight = _ref.fixedHeight,
129
- style = _ref.style,
130
- editorStyle = _ref.editorStyle;
131
-
132
- var _useAlignContext = useAlignContext(),
133
- enabled = _useAlignContext.editing;
134
-
135
- return React__default.createElement("div", {
136
- className: "section " + className + " " + (horizontal ? 'horizontal' : '') + " " + (stretch ? 'stretch' : ''),
137
- style: _extends({}, enabled ? editorStyle : style, typeof fixedHeight === 'number' ? {
138
- height: fixedHeight + 'px'
139
- } : {}, typeof fixedWidth === 'number' ? {
140
- width: fixedWidth + 'px'
141
- } : {})
142
- }, children);
143
- };
144
-
145
- var _path;
146
-
147
- function _extends$1() { _extends$1 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$1.apply(this, arguments); }
148
-
149
- function SvgHorizontalExtend(props) {
150
- return /*#__PURE__*/React.createElement("svg", _extends$1({
151
- width: 24,
152
- height: 24,
153
- fill: "none",
154
- xmlns: "http://www.w3.org/2000/svg"
155
- }, props), _path || (_path = /*#__PURE__*/React.createElement("path", {
156
- d: "M1 20.25V3.75M23 20.25V3.75M12 12h8.5M17.5 9l3 3-3 3M12 12H4M7 15l-3-3 3-3",
157
- stroke: "currentColor",
158
- strokeWidth: 1.5,
159
- strokeLinecap: "round",
160
- strokeLinejoin: "round"
161
- })));
162
- }
163
-
164
- var _path$1, _rect;
165
-
166
- function _extends$2() { _extends$2 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$2.apply(this, arguments); }
167
-
168
- function SvgHorizontalNormal(props) {
169
- return /*#__PURE__*/React.createElement("svg", _extends$2({
170
- width: 24,
171
- height: 24,
172
- fill: "none",
173
- xmlns: "http://www.w3.org/2000/svg"
174
- }, props), _path$1 || (_path$1 = /*#__PURE__*/React.createElement("path", {
175
- d: "M1 12h5M3 9l3 3-3 3M23 12h-5M21 15l-3-3 3-3",
176
- stroke: "currentColor",
177
- strokeWidth: 1.5,
178
- strokeLinecap: "round",
179
- strokeLinejoin: "round"
180
- })), _rect || (_rect = /*#__PURE__*/React.createElement("rect", {
181
- x: 8.75,
182
- y: 2.75,
183
- width: 6.5,
184
- height: 18.5,
185
- rx: 1.25,
186
- stroke: "currentColor",
187
- strokeWidth: 1.5
188
- })));
189
- }
190
-
191
- var _path$2;
192
-
193
- function _extends$3() { _extends$3 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$3.apply(this, arguments); }
194
-
195
- function SvgVerticalExtend(props) {
196
- return /*#__PURE__*/React.createElement("svg", _extends$3({
197
- width: 24,
198
- height: 24,
199
- fill: "none",
200
- xmlns: "http://www.w3.org/2000/svg"
201
- }, props), _path$2 || (_path$2 = /*#__PURE__*/React.createElement("path", {
202
- d: "M3.75 1h16.5M3.75 23h16.5M12 12v8.5M15 17.5l-3 3-3-3M12 12V4M9 7l3-3 3 3",
203
- stroke: "currentColor",
204
- strokeWidth: 1.5,
205
- strokeLinecap: "round",
206
- strokeLinejoin: "round"
207
- })));
208
- }
209
-
210
- var _path$3, _rect$1;
211
-
212
- function _extends$4() { _extends$4 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$4.apply(this, arguments); }
213
-
214
- function SvgVerticalNormal(props) {
215
- return /*#__PURE__*/React.createElement("svg", _extends$4({
216
- width: 24,
217
- height: 24,
218
- fill: "none",
219
- xmlns: "http://www.w3.org/2000/svg"
220
- }, props), _path$3 || (_path$3 = /*#__PURE__*/React.createElement("path", {
221
- d: "M12 1v5M15 3l-3 3-3-3M12 23v-5M9 21l3-3 3 3",
222
- stroke: "currentColor",
223
- strokeWidth: 1.5,
224
- strokeLinecap: "round",
225
- strokeLinejoin: "round"
226
- })), _rect$1 || (_rect$1 = /*#__PURE__*/React.createElement("rect", {
227
- x: 21.25,
228
- y: 8.75,
229
- width: 6.5,
230
- height: 18.5,
231
- rx: 1.25,
232
- transform: "rotate(90 21.25 8.75)",
233
- stroke: "currentColor",
234
- strokeWidth: 1.5
235
- })));
236
- }
237
-
238
- var _path$4;
239
-
240
- function _extends$5() { _extends$5 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$5.apply(this, arguments); }
241
-
242
- function SvgMoveArrows(props) {
243
- return /*#__PURE__*/React.createElement("svg", _extends$5({
244
- width: 24,
245
- height: 24,
246
- fill: "none",
247
- xmlns: "http://www.w3.org/2000/svg"
248
- }, props), _path$4 || (_path$4 = /*#__PURE__*/React.createElement("path", {
249
- d: "M14.651 19.098L12 21.749l-2.652-2.651M12 15v6.75M9.348 4.902L12 2.25l2.651 2.652M12 9V2.25M4.902 14.65L2.25 12l2.652-2.652M9 12H2.25M19.098 9.348l2.652 2.651-2.652 2.652M15 12h6.75",
250
- stroke: "currentColor",
251
- strokeWidth: 1.5,
252
- strokeLinecap: "round",
253
- strokeLinejoin: "round"
254
- })));
255
- }
256
-
257
- var _rect$2, _path$5;
258
-
259
- function _extends$6() { _extends$6 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$6.apply(this, arguments); }
260
-
261
- function SvgAlignStart(props) {
262
- return /*#__PURE__*/React.createElement("svg", _extends$6({
263
- width: 24,
264
- height: 24,
265
- fill: "none",
266
- xmlns: "http://www.w3.org/2000/svg"
267
- }, props), _rect$2 || (_rect$2 = /*#__PURE__*/React.createElement("rect", {
268
- width: 24,
269
- height: 24,
270
- rx: 4,
271
- fill: "#000",
272
- fillOpacity: 0.5
273
- })), _path$5 || (_path$5 = /*#__PURE__*/React.createElement("path", {
274
- fillRule: "evenodd",
275
- clipRule: "evenodd",
276
- d: "M5 5h14v14H5V5zM4 4h16v16H4V4zm2 6a1 1 0 012 0v4a1 1 0 11-2 0v-4zm3 0a1 1 0 012 0v4a1 1 0 11-2 0v-4zm4-1a1 1 0 00-1 1v4a1 1 0 102 0v-4a1 1 0 00-1-1z",
277
- fill: "currentColor"
278
- })));
279
- }
280
-
281
- var _rect$3, _path$6;
282
-
283
- function _extends$7() { _extends$7 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$7.apply(this, arguments); }
284
-
285
- function SvgAlignCenter(props) {
286
- return /*#__PURE__*/React.createElement("svg", _extends$7({
287
- width: 24,
288
- height: 24,
289
- fill: "none",
290
- xmlns: "http://www.w3.org/2000/svg"
291
- }, props), _rect$3 || (_rect$3 = /*#__PURE__*/React.createElement("rect", {
292
- width: 24,
293
- height: 24,
294
- rx: 4,
295
- fill: "#000",
296
- fillOpacity: 0.5
297
- })), _path$6 || (_path$6 = /*#__PURE__*/React.createElement("path", {
298
- fillRule: "evenodd",
299
- clipRule: "evenodd",
300
- d: "M19 19H5V5h14v14zm1 1H4V4h16v16zm-4-6a1 1 0 11-2 0v-4a1 1 0 112 0v4zm-3 0a1 1 0 11-2 0v-4a1 1 0 112 0v4zm-4 1a1 1 0 001-1v-4a1 1 0 10-2 0v4a1 1 0 001 1z",
301
- fill: "currentColor"
302
- })));
303
- }
304
-
305
- var _rect$4, _path$7;
306
-
307
- function _extends$8() { _extends$8 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$8.apply(this, arguments); }
308
-
309
- function SvgAlignEnd(props) {
310
- return /*#__PURE__*/React.createElement("svg", _extends$8({
311
- width: 24,
312
- height: 24,
313
- fill: "none",
314
- xmlns: "http://www.w3.org/2000/svg"
315
- }, props), _rect$4 || (_rect$4 = /*#__PURE__*/React.createElement("rect", {
316
- width: 24,
317
- height: 24,
318
- rx: 4,
319
- fill: "#000",
320
- fillOpacity: 0.5
321
- })), _path$7 || (_path$7 = /*#__PURE__*/React.createElement("path", {
322
- fillRule: "evenodd",
323
- clipRule: "evenodd",
324
- d: "M19 19H5V5h14v14zm1 1H4V4h16v16zm-2-6a1 1 0 11-2 0v-4a1 1 0 112 0v4zm-3 0a1 1 0 11-2 0v-4a1 1 0 112 0v4zm-4 1a1 1 0 001-1v-4a1 1 0 10-2 0v4a1 1 0 001 1z",
325
- fill: "currentColor"
326
- })));
327
- }
328
-
329
- var _rect$5, _path$8;
330
-
331
- function _extends$9() { _extends$9 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$9.apply(this, arguments); }
332
-
333
- function SvgAlignStartV(props) {
334
- return /*#__PURE__*/React.createElement("svg", _extends$9({
335
- width: 24,
336
- height: 24,
337
- fill: "none",
338
- xmlns: "http://www.w3.org/2000/svg"
339
- }, props), _rect$5 || (_rect$5 = /*#__PURE__*/React.createElement("rect", {
340
- y: 24,
341
- width: 24,
342
- height: 24,
343
- rx: 4,
344
- transform: "rotate(-90 0 24)",
345
- fill: "#000",
346
- fillOpacity: 0.5
347
- })), _path$8 || (_path$8 = /*#__PURE__*/React.createElement("path", {
348
- fillRule: "evenodd",
349
- clipRule: "evenodd",
350
- d: "M19 5v14H5V5h14zm1-1v16H4V4h16zm-6 2a1 1 0 110 2h-4a1 1 0 110-2h4zm0 3a1 1 0 110 2h-4a1 1 0 110-2h4zm1 4a1 1 0 00-1-1h-4a1 1 0 100 2h4a1 1 0 001-1z",
351
- fill: "currentColor"
352
- })));
353
- }
354
-
355
- var _rect$6, _path$9;
356
-
357
- function _extends$a() { _extends$a = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$a.apply(this, arguments); }
358
-
359
- function SvgAlignCenterV(props) {
360
- return /*#__PURE__*/React.createElement("svg", _extends$a({
361
- width: 24,
362
- height: 24,
363
- fill: "none",
364
- xmlns: "http://www.w3.org/2000/svg"
365
- }, props), _rect$6 || (_rect$6 = /*#__PURE__*/React.createElement("rect", {
366
- y: 24,
367
- width: 24,
368
- height: 24,
369
- rx: 4,
370
- transform: "rotate(-90 0 24)",
371
- fill: "#000",
372
- fillOpacity: 0.5
373
- })), _path$9 || (_path$9 = /*#__PURE__*/React.createElement("path", {
374
- fillRule: "evenodd",
375
- clipRule: "evenodd",
376
- d: "M19 5v14H5V5h14zm1-1v16H4V4h16zm-6 4a1 1 0 110 2h-4a1 1 0 110-2h4zm0 3a1 1 0 110 2h-4a1 1 0 110-2h4zm1 4a1 1 0 00-1-1h-4a1 1 0 100 2h4a1 1 0 001-1z",
377
- fill: "currentColor"
378
- })));
379
- }
380
-
381
- var _rect$7, _path$a;
382
-
383
- function _extends$b() { _extends$b = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$b.apply(this, arguments); }
384
-
385
- function SvgAlignEndV(props) {
386
- return /*#__PURE__*/React.createElement("svg", _extends$b({
387
- width: 24,
388
- height: 24,
389
- fill: "none",
390
- xmlns: "http://www.w3.org/2000/svg"
391
- }, props), _rect$7 || (_rect$7 = /*#__PURE__*/React.createElement("rect", {
392
- y: 24,
393
- width: 24,
394
- height: 24,
395
- rx: 4,
396
- transform: "rotate(-90 0 24)",
397
- fill: "#000",
398
- fillOpacity: 0.5
399
- })), _path$a || (_path$a = /*#__PURE__*/React.createElement("path", {
400
- fillRule: "evenodd",
401
- clipRule: "evenodd",
402
- d: "M5 19V5h14v14H5zm-1 1V4h16v16H4zm6-2a1 1 0 110-2h4a1 1 0 110 2h-4zm0-3a1 1 0 110-2h4a1 1 0 110 2h-4zm-1-4a1 1 0 001 1h4a1 1 0 100-2h-4a1 1 0 00-1 1z",
403
- fill: "currentColor"
404
- })));
405
- }
406
-
407
- var Icons = {
408
- horizontalExtend: SvgHorizontalExtend,
409
- horizontalNormal: SvgHorizontalNormal,
410
- verticalExtend: SvgVerticalExtend,
411
- verticalNormal: SvgVerticalNormal,
412
- moveArrows: SvgMoveArrows,
413
- alignStart: SvgAlignStart,
414
- alignCenter: SvgAlignCenter,
415
- alignEnd: SvgAlignEnd,
416
- alignStartV: SvgAlignStartV,
417
- alignCenterV: SvgAlignCenterV,
418
- alignEndV: SvgAlignEndV
419
- };
420
-
421
- var Icon = function Icon(_ref) {
422
- var className = _ref.className,
423
- name = _ref.name,
424
- onClick = _ref.onClick;
425
- var LocalIconComponent = Icons[name];
426
- return React__default.createElement(LocalIconComponent, {
427
- className: className,
428
- onClick: onClick
429
- });
430
- };
431
-
432
- var alignments = ['start', 'centered', 'end'];
433
- function GridArea(_ref) {
434
- var id = _ref.id,
435
- className = _ref.className,
436
- vertical = _ref.vertical,
437
- stretch = _ref.stretch,
438
- end = _ref.end,
439
- disabled = _ref.disabled,
440
- align = _ref.align,
441
- onAlignChange = _ref.onAlignChange,
442
- children = _ref.children,
443
- style = _ref.style,
444
- editorStyle = _ref.editorStyle,
445
- _ref$iconColor = _ref.iconColor,
446
- iconColor = _ref$iconColor === void 0 ? '#FFFFFF' : _ref$iconColor;
447
-
448
- var _useAlignContext = useAlignContext(),
449
- enabled = _useAlignContext.editing,
450
- onAlignChange2 = _useAlignContext.onAlignChange;
451
-
452
- var handleAlignChange = React.useCallback(function () {
453
- var a = alignments[(align ? alignments.indexOf(align) + 1 : 0) % alignments.length];
454
- onAlignChange == null ? void 0 : onAlignChange(a);
455
- onAlignChange2 == null ? void 0 : onAlignChange2(id, a);
456
- }, [align, onAlignChange, onAlignChange2, id]);
457
- var buttonStyle = React.useMemo(function () {
458
- return {
459
- position: 'absolute',
460
- left: vertical ? end ? 0 : undefined : '50%',
461
- right: vertical ? !end ? 0 : undefined : '50%',
462
- bottom: !vertical && !end ? 0 : vertical ? '50%' : undefined,
463
- top: vertical ? '50%' : end ? 0 : undefined,
464
- opacity: !disabled && enabled && align ? 1 : 0,
465
- pointerEvents: !disabled && enabled && align ? 'auto' : 'none',
466
- transition: 'all 0.5s ease-in-out'
467
- };
468
- }, [vertical, end, disabled, enabled, align]); // Rebuilds the GridItem children to receive their parent GridArea's 'end' and 'vertical' values.
469
- // Used to know where to align the overlay buttons (end) and how to extend the GridItems (vertical).
470
-
471
- var childrenWithParentProps = React.useMemo(function () {
472
- return React__default.Children.map(children, function (child) {
473
- return React__default.cloneElement(child, {
474
- end: end,
475
- vertical: vertical
476
- });
477
- });
478
- }, [children, end, vertical]);
479
- return React__default.createElement(reactBeautifulDnd.Droppable, {
480
- droppableId: id,
481
- direction: vertical ? 'vertical' : 'horizontal',
482
- isDropDisabled: disabled
483
- }, function (provided, snapshot) {
484
- return React__default.createElement("div", Object.assign({
485
- ref: provided.innerRef
486
- }, provided.droppableProps, {
487
- className: [className, 'area', stretch && 'stretch', end && 'end', align === 'centered' ? 'just-centered' : align === 'end' ? 'just-end' : 'start', enabled ? 'area-transition-in' : 'area-transition-out'].filter(Boolean).join(' '),
488
- style: _extends({
489
- flexDirection: vertical ? 'column' : 'row',
490
- minHeight: !React__default.Children.count(children) && !enabled ? '0px' : '26px',
491
- minWidth: !React__default.Children.count(children) && !enabled ? '0px' : '46px',
492
- opacity: snapshot.isDraggingOver ? 0.8 : 1
493
- }, enabled ? editorStyle : style)
494
- }), childrenWithParentProps, provided.placeholder, React__default.createElement("div", {
495
- style: buttonStyle
496
- }, React__default.createElement("div", {
497
- onClick: handleAlignChange,
498
- style: {
499
- cursor: 'pointer',
500
- color: iconColor
501
- }
502
- }, React__default.createElement(Icon, {
503
- name: align === 'centered' ? vertical ? 'alignCenterV' : 'alignCenter' : align === 'end' ? vertical ? 'alignEndV' : 'alignEnd' : vertical ? 'alignStartV' : 'alignStart'
504
- }))));
505
- });
506
- }
507
-
508
- function GridItem(_ref) {
509
- var className = _ref.className,
510
- children = _ref.children,
511
- id = _ref.id,
512
- index = _ref.index,
513
- _ref$extendable = _ref.extendable,
514
- extendable = _ref$extendable === void 0 ? false : _ref$extendable,
515
- _ref$extended = _ref.extended,
516
- extended = _ref$extended === void 0 ? false : _ref$extended,
517
- _ref$disabled = _ref.disabled,
518
- disabled = _ref$disabled === void 0 ? false : _ref$disabled,
519
- style = _ref.style,
520
- editorStyle = _ref.editorStyle,
521
- _ref$iconColor = _ref.iconColor,
522
- iconColor = _ref$iconColor === void 0 ? 'rgb(255, 255, 255)' : _ref$iconColor,
523
- props = _objectWithoutPropertiesLoose(_ref, ["className", "children", "id", "index", "extendable", "extended", "disabled", "style", "editorStyle", "iconColor"]);
524
-
525
- var vertical = props.vertical;
526
-
527
- var _useAlignContext = useAlignContext(),
528
- editing = _useAlignContext.editing,
529
- isDragging = _useAlignContext.isDragging,
530
- onExtend = _useAlignContext.onExtend;
531
-
532
- var _useState = React.useState(false),
533
- isHovered = _useState[0],
534
- setHovered = _useState[1];
535
-
536
- var handleExtend = React.useCallback(function () {
537
- if (!extendable) return;
538
- setHovered(false);
539
- onExtend == null ? void 0 : onExtend(id, !extended);
540
- }, [extendable, onExtend, extended, id]);
541
- var buttonStyles = React.useMemo(function () {
542
- return {
543
- alignItems: 'start',
544
- "float": 'left',
545
- color: iconColor
546
- };
547
- }, [iconColor]);
548
- var ctx = React.useMemo(function () {
549
- return {
550
- id: id,
551
- editing: editing,
552
- isDragging: isDragging,
553
- isHovered: isHovered,
554
- extended: extended,
555
- extendable: extendable,
556
- disabled: disabled,
557
- index: index
558
- };
559
- }, [disabled, editing, extendable, extended, id, index, isDragging, isHovered]);
560
- return React__default.createElement(reactBeautifulDnd.Draggable, {
561
- draggableId: id,
562
- index: index,
563
- isDragDisabled: disabled
564
- }, function (provided, snapshot) {
565
- return React__default.createElement("div", Object.assign({
566
- ref: provided.innerRef
567
- }, provided.draggableProps, {
568
- className: className + " item",
569
- style: _extends({
570
- flex: extended && !snapshot.isDragging ? 'auto' : undefined,
571
- opacity: snapshot.isDragging ? 0.5 : 1
572
- }, editing ? editorStyle : style, provided.draggableProps.style)
573
- }), React__default.createElement("div", {
574
- style: {
575
- display: 'inline-block',
576
- position: 'relative',
577
- minHeight: isHovered && !disabled ? '35px' : undefined,
578
- width: !vertical && extended ? '100%' : undefined,
579
- minWidth: isHovered && !disabled ? extendable ? '70px' : '35px' : undefined,
580
- height: vertical && extended ? '100%' : undefined
581
- },
582
- onMouseEnter: function onMouseEnter() {
583
- return setHovered(true);
584
- },
585
- onMouseLeave: function onMouseLeave() {
586
- return setHovered(false);
587
- }
588
- }, typeof children === 'function' ? children(ctx) : children, React__default.createElement("div", {
589
- className: "overlay",
590
- style: {
591
- display: !disabled && editing && isHovered && (snapshot.isDragging || !isDragging) ? 'block' : 'none'
592
- }
593
- }, React__default.createElement("div", {
594
- className: "overlay-buttons",
595
- style: buttonStyles
596
- }, React__default.createElement("div", Object.assign({}, provided.dragHandleProps), React__default.createElement(Icon, {
597
- name: "moveArrows"
598
- })), extendable && React__default.createElement("div", {
599
- style: {
600
- cursor: 'pointer',
601
- marginLeft: '8px'
602
- },
603
- onClick: handleExtend
604
- }, React__default.createElement(Icon, {
605
- name: vertical ? 'verticalExtend' : 'horizontalExtend'
606
- }))))));
607
- });
608
- }
609
-
610
- exports.GridArea = GridArea;
611
- exports.GridItem = GridItem;
612
- exports.GridSection = GridSection;
613
- exports.GridWrapper = GridWrapper;
614
- exports.Icon = Icon;
615
- //# sourceMappingURL=react-align.cjs.development.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"react-align.cjs.development.js","sources":["../src/context.tsx","../node_modules/style-inject/dist/style-inject.es.js","../src/GridWrapper.tsx","../src/GridSection.tsx","../src/Icon/icons.ts","../src/Icon/index.tsx","../src/GridArea.tsx","../src/GridItem.tsx"],"sourcesContent":["import { createContext, useContext } from 'react';\nimport { Alignment } from '.';\n\nexport const Context = createContext<{\n editing: boolean;\n isDragging: boolean;\n onAlignChange?: (areaId: string, align: Alignment) => void;\n onExtend?: (id: string, extended: boolean) => void;\n}>({ editing: false, isDragging: false });\nexport const useAlignContext = () => useContext(Context);\n","function styleInject(css, ref) {\n if ( ref === void 0 ) ref = {};\n var insertAt = ref.insertAt;\n\n if (!css || typeof document === 'undefined') { return; }\n\n var head = document.head || document.getElementsByTagName('head')[0];\n var style = document.createElement('style');\n style.type = 'text/css';\n\n if (insertAt === 'top') {\n if (head.firstChild) {\n head.insertBefore(style, head.firstChild);\n } else {\n head.appendChild(style);\n }\n } else {\n head.appendChild(style);\n }\n\n if (style.styleSheet) {\n style.styleSheet.cssText = css;\n } else {\n style.appendChild(document.createTextNode(css));\n }\n}\n\nexport default styleInject;\n","import React, { CSSProperties, ReactNode, useCallback, useState } from 'react';\nimport {\n DragDropContext,\n DropResult,\n ResponderProvided,\n} from 'react-beautiful-dnd';\n\nimport { Context } from './context';\nimport { Alignment } from './GridArea';\nimport './grid.css';\n\nexport type GridWrapperProps = {\n className?: string;\n children?: ReactNode;\n editing?: boolean;\n vertical?: boolean;\n stretch?: boolean;\n /** Extra customizable parts only for the really picky */\n style?: CSSProperties;\n editorStyle?: CSSProperties;\n onMove?: (\n id: string,\n destAreaId: string,\n destIndex: number,\n prevAreaId: string,\n prevIndex: number\n ) => void;\n onAlignChange?: (areaId: string, align: Alignment) => void;\n onExtend?: (id: string, extended: boolean) => void;\n};\n\nconst GridWrapper: React.FC<GridWrapperProps> = ({\n className,\n children,\n editing,\n vertical,\n stretch,\n style,\n editorStyle,\n onMove,\n onAlignChange,\n onExtend,\n}) => {\n const [isDragging, setDragging] = useState(false);\n\n const handleDragStart = useCallback(() => {\n setDragging(true);\n }, []);\n\n const handleDragEnd = useCallback(\n (result: DropResult, _provided: ResponderProvided) => {\n setDragging(false);\n if (\n !result.destination ||\n result.reason !== 'DROP' ||\n (result.destination.droppableId === result.source.droppableId &&\n result.destination.index === result.source.index)\n )\n return;\n onMove?.(\n result.draggableId,\n result.destination.droppableId,\n result.destination.index,\n result.source.droppableId,\n result.source.index\n );\n },\n [onMove]\n );\n\n return (\n <div\n className={`wrapper ${className} ${vertical && 'vertical'} ${stretch &&\n 'stretch'}`}\n style={editing ? editorStyle : style}\n >\n <DragDropContext onDragStart={handleDragStart} onDragEnd={handleDragEnd}>\n <Context.Provider\n value={{ editing: !!editing, onAlignChange, onExtend, isDragging }}\n >\n {children}\n </Context.Provider>\n </DragDropContext>\n </div>\n );\n};\n\nexport default GridWrapper;\n","import React, { CSSProperties, ReactNode } from 'react';\n\nimport { useAlignContext } from './context';\nimport './grid.css';\n\nexport type GridSectionProps = {\n className?: string;\n children?: ReactNode;\n horizontal?: boolean;\n stretch?: boolean;\n fixedWidth?: number;\n fixedHeight?: number;\n /** Extra customizable parts only for the really picky */\n style?: CSSProperties;\n editorStyle?: CSSProperties;\n};\n\nconst GridSection: React.FC<GridSectionProps> = ({\n className,\n children,\n horizontal,\n stretch,\n fixedWidth,\n fixedHeight,\n style,\n editorStyle,\n}) => {\n const { editing: enabled } = useAlignContext();\n\n return (\n <div\n className={`section ${className} ${horizontal ? 'horizontal' : ''} ${\n stretch ? 'stretch' : ''\n }`}\n style={{\n ...(enabled ? editorStyle : style),\n ...(typeof fixedHeight === 'number'\n ? {\n height: fixedHeight + 'px',\n }\n : {}),\n ...(typeof fixedWidth === 'number'\n ? {\n width: fixedWidth + 'px',\n }\n : {}),\n }}\n >\n {children}\n </div>\n );\n};\n\nexport default GridSection;\n","import HorizontalExtend from './Icons/horizontalExtend.svg';\nimport HorizontalNormal from './Icons/horizontalNormal.svg';\nimport VerticalExtend from './Icons/verticalExtend.svg';\nimport VerticalNormal from './Icons/verticalNormal.svg';\nimport MoveArrows from './Icons/moveArrows.svg';\nimport AlignStart from './Icons/alignStart.svg';\nimport AlignCenter from './Icons/alignCenter.svg';\nimport AlignEnd from './Icons/alignEnd.svg';\nimport AlignStartV from './Icons/alignStartV.svg';\nimport AlignCenterV from './Icons/alignCenterV.svg';\nimport AlignEndV from './Icons/alignEndV.svg';\n\nexport default {\n horizontalExtend: HorizontalExtend,\n horizontalNormal: HorizontalNormal,\n verticalExtend: VerticalExtend,\n verticalNormal: VerticalNormal,\n moveArrows: MoveArrows,\n alignStart: AlignStart,\n alignCenter: AlignCenter,\n alignEnd: AlignEnd,\n alignStartV: AlignStartV,\n alignCenterV: AlignCenterV,\n alignEndV: AlignEndV,\n};\n","import React from 'react';\n\nimport Icons from './icons';\n\nexport type Icons = keyof typeof Icons;\n\nexport type IconProps = {\n className?: string;\n name: string | Icons;\n onClick?: () => void;\n};\n\nconst Icon: React.FC<IconProps> = ({ className, name, onClick }) => {\n const LocalIconComponent = Icons[name as Icons];\n return <LocalIconComponent className={className} onClick={onClick} />;\n};\n\nexport default Icon;\n","import React, {\n CSSProperties,\n PropsWithChildren,\n useCallback,\n useMemo,\n} from 'react';\nimport { Droppable } from 'react-beautiful-dnd';\n\nimport { useAlignContext } from './context';\nimport Icon from './Icon';\nimport './grid.css';\n\nexport type Alignment = 'start' | 'centered' | 'end';\n\nexport type AreaProps = {\n id: string;\n className?: string;\n vertical?: boolean;\n stretch?: boolean;\n end?: boolean;\n align?: Alignment;\n disabled?: boolean;\n /** Extra customizable parts only for the really picky */\n style?: CSSProperties;\n editorStyle?: CSSProperties;\n iconColor?: string;\n onAlignChange?: (alignment: Alignment) => void;\n};\n\nconst alignments = ['start', 'centered', 'end'] as const;\n\nexport default function GridArea({\n id,\n className,\n vertical,\n stretch,\n end,\n disabled,\n align,\n onAlignChange,\n children,\n // Picky stuff\n style,\n editorStyle,\n iconColor = '#FFFFFF',\n}: PropsWithChildren<AreaProps>) {\n const { editing: enabled, onAlignChange: onAlignChange2 } = useAlignContext();\n\n const handleAlignChange = useCallback(() => {\n const a =\n alignments[\n (align ? alignments.indexOf(align) + 1 : 0) % alignments.length\n ];\n onAlignChange?.(a);\n onAlignChange2?.(id, a);\n }, [align, onAlignChange, onAlignChange2, id]);\n\n const buttonStyle: CSSProperties = useMemo(\n () => ({\n position: 'absolute',\n left: vertical ? (end ? 0 : undefined) : '50%',\n right: vertical ? (!end ? 0 : undefined) : '50%',\n bottom: !vertical && !end ? 0 : vertical ? '50%' : undefined,\n top: vertical ? '50%' : end ? 0 : undefined,\n opacity: !disabled && enabled && align ? 1 : 0,\n pointerEvents: !disabled && enabled && align ? 'auto' : 'none',\n transition: 'all 0.5s ease-in-out',\n }),\n [vertical, end, disabled, enabled, align]\n );\n\n // Rebuilds the GridItem children to receive their parent GridArea's 'end' and 'vertical' values.\n // Used to know where to align the overlay buttons (end) and how to extend the GridItems (vertical).\n const childrenWithParentProps = useMemo(\n () =>\n React.Children.map(children, child =>\n React.cloneElement(child as React.ReactElement<any>, {\n end,\n vertical,\n })\n ),\n [children, end, vertical]\n );\n\n return (\n <Droppable\n droppableId={id}\n direction={vertical ? 'vertical' : 'horizontal'}\n isDropDisabled={disabled}\n >\n {(provided, snapshot) => (\n <div\n ref={provided.innerRef}\n {...provided.droppableProps}\n className={[\n className,\n 'area',\n stretch && 'stretch',\n end && 'end',\n align === 'centered'\n ? 'just-centered'\n : align === 'end'\n ? 'just-end'\n : 'start',\n enabled ? 'area-transition-in' : 'area-transition-out',\n ]\n .filter(Boolean)\n .join(' ')}\n style={{\n flexDirection: vertical ? 'column' : 'row',\n minHeight:\n !React.Children.count(children) && !enabled ? '0px' : '26px',\n minWidth:\n !React.Children.count(children) && !enabled ? '0px' : '46px',\n opacity: snapshot.isDraggingOver ? 0.8 : 1,\n ...(enabled ? editorStyle : style),\n }}\n >\n {childrenWithParentProps}\n {provided.placeholder}\n <div style={buttonStyle}>\n <div\n onClick={handleAlignChange}\n style={{\n cursor: 'pointer',\n color: iconColor,\n }}\n >\n <Icon\n name={\n align === 'centered'\n ? vertical\n ? 'alignCenterV'\n : 'alignCenter'\n : align === 'end'\n ? vertical\n ? 'alignEndV'\n : 'alignEnd'\n : vertical\n ? 'alignStartV'\n : 'alignStart'\n }\n />\n </div>\n </div>\n </div>\n )}\n </Droppable>\n );\n}\n","import React, {\n useMemo,\n CSSProperties,\n useState,\n useCallback,\n ReactNode,\n} from 'react';\nimport { Draggable } from 'react-beautiful-dnd';\n\nimport { useAlignContext } from './context';\nimport Icon from './Icon';\nimport './grid.css';\n\nexport type ItemProps = {\n className?: string;\n id: string;\n index: number;\n extendable?: boolean;\n extended?: boolean;\n disabled?: boolean;\n onExtend?: (extended: boolean) => void;\n children?:\n | ReactNode\n | ((context: {\n id: string;\n editing: boolean;\n isDragging: boolean;\n isHovered: boolean;\n extended: boolean;\n extendable: boolean;\n disabled: boolean;\n index: number;\n }) => ReactNode);\n /** Extra customizable parts only for the really picky */\n style?: CSSProperties;\n editorStyle?: CSSProperties;\n iconColor?: string;\n};\n\nexport default function GridItem({\n className,\n children,\n id,\n index,\n extendable = false,\n extended = false,\n disabled = false,\n // Picky stuff.\n style,\n editorStyle,\n iconColor = 'rgb(255, 255, 255)',\n ...props\n}: ItemProps) {\n const { vertical } = props as {\n end?: boolean;\n vertical?: boolean;\n };\n const { editing, isDragging, onExtend } = useAlignContext();\n const [isHovered, setHovered] = useState(false);\n const handleExtend = useCallback(() => {\n if (!extendable) return;\n setHovered(false);\n onExtend?.(id, !extended);\n }, [extendable, onExtend, extended, id]);\n\n const buttonStyles: CSSProperties = useMemo(\n () => ({\n alignItems: 'start',\n float: 'left',\n color: iconColor,\n }),\n [iconColor]\n );\n\n const ctx = useMemo(\n () => ({\n id,\n editing,\n isDragging,\n isHovered,\n extended,\n extendable,\n disabled,\n index,\n }),\n [disabled, editing, extendable, extended, id, index, isDragging, isHovered]\n );\n\n return (\n <Draggable draggableId={id} index={index} isDragDisabled={disabled}>\n {(provided, snapshot) => (\n <div\n ref={provided.innerRef}\n {...provided.draggableProps}\n className={`${className} item`}\n style={{\n flex: extended && !snapshot.isDragging ? 'auto' : undefined,\n opacity: snapshot.isDragging ? 0.5 : 1,\n ...(editing ? editorStyle : style),\n ...provided.draggableProps.style,\n }}\n >\n <div\n style={{\n display: 'inline-block',\n position: 'relative',\n minHeight: isHovered && !disabled ? '35px' : undefined,\n width: !vertical && extended ? '100%' : undefined,\n minWidth:\n isHovered && !disabled\n ? extendable\n ? '70px'\n : '35px'\n : undefined,\n height: vertical && extended ? '100%' : undefined,\n }}\n onMouseEnter={() => setHovered(true)}\n onMouseLeave={() => setHovered(false)}\n >\n {typeof children === 'function' ? children(ctx) : children}\n <div\n className=\"overlay\"\n style={{\n display:\n !disabled &&\n editing &&\n isHovered &&\n (snapshot.isDragging || !isDragging)\n ? 'block'\n : 'none',\n }}\n >\n <div className=\"overlay-buttons\" style={buttonStyles}>\n <div {...provided.dragHandleProps}>\n <Icon name=\"moveArrows\" />\n </div>\n {extendable && (\n <div\n style={{ cursor: 'pointer', marginLeft: '8px' }}\n onClick={handleExtend}\n >\n <Icon\n name={vertical ? 'verticalExtend' : 'horizontalExtend'}\n />\n </div>\n )}\n </div>\n </div>\n </div>\n </div>\n )}\n </Draggable>\n );\n}\n"],"names":["Context","createContext","editing","isDragging","useAlignContext","useContext","GridWrapper","className","children","vertical","stretch","style","editorStyle","onMove","onAlignChange","onExtend","useState","setDragging","handleDragStart","useCallback","handleDragEnd","result","_provided","destination","reason","droppableId","source","index","draggableId","React","DragDropContext","onDragStart","onDragEnd","Provider","value","GridSection","horizontal","fixedWidth","fixedHeight","enabled","height","width","horizontalExtend","HorizontalExtend","horizontalNormal","HorizontalNormal","verticalExtend","VerticalExtend","verticalNormal","VerticalNormal","moveArrows","MoveArrows","alignStart","AlignStart","alignCenter","AlignCenter","alignEnd","AlignEnd","alignStartV","AlignStartV","alignCenterV","AlignCenterV","alignEndV","AlignEndV","Icon","name","onClick","LocalIconComponent","Icons","alignments","GridArea","id","end","disabled","align","iconColor","onAlignChange2","handleAlignChange","a","indexOf","length","buttonStyle","useMemo","position","left","undefined","right","bottom","top","opacity","pointerEvents","transition","childrenWithParentProps","Children","map","child","cloneElement","Droppable","direction","isDropDisabled","provided","snapshot","ref","innerRef","droppableProps","filter","Boolean","join","flexDirection","minHeight","count","minWidth","isDraggingOver","placeholder","cursor","color","GridItem","extendable","extended","props","isHovered","setHovered","handleExtend","buttonStyles","alignItems","ctx","Draggable","isDragDisabled","draggableProps","flex","display","onMouseEnter","onMouseLeave","dragHandleProps","marginLeft"],"mappings":"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"}