gdx-ui 1.15.1 → 1.15.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -8,7 +8,6 @@ exports.ExpandableButton = exports.ExpandableArea = exports.Expandable = void 0;
|
|
|
8
8
|
var _react = _interopRequireWildcard(require("react"));
|
|
9
9
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
10
10
|
var _IconButton = require("../button/IconButton");
|
|
11
|
-
var _reactFontawesome = require("@fortawesome/react-fontawesome");
|
|
12
11
|
var _freeSolidSvgIcons = require("@fortawesome/free-solid-svg-icons");
|
|
13
12
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
|
|
14
13
|
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
|
|
@@ -41,31 +40,53 @@ var Expandable = exports.Expandable = function Expandable(_ref) {
|
|
|
41
40
|
}
|
|
42
41
|
}, children);
|
|
43
42
|
};
|
|
44
|
-
var ExpandableButton = exports.ExpandableButton = function ExpandableButton() {
|
|
43
|
+
var ExpandableButton = exports.ExpandableButton = function ExpandableButton(_ref2) {
|
|
44
|
+
var onClick = _ref2.onClick;
|
|
45
45
|
var _useContext = (0, _react.useContext)(ExpandableContext),
|
|
46
46
|
settings = _useContext.settings,
|
|
47
47
|
setSettings = _useContext.setSettings;
|
|
48
48
|
var open = settings.open;
|
|
49
|
-
var
|
|
49
|
+
var handleClick = function handleClick(e) {
|
|
50
50
|
setSettings(_objectSpread(_objectSpread({}, settings), {}, {
|
|
51
51
|
open: !open
|
|
52
52
|
}));
|
|
53
|
+
onClick && onClick(e);
|
|
53
54
|
};
|
|
54
55
|
return /*#__PURE__*/_react["default"].createElement(_IconButton.IconButton, {
|
|
55
|
-
onClick:
|
|
56
|
-
icon:
|
|
56
|
+
onClick: handleClick,
|
|
57
|
+
icon: _freeSolidSvgIcons.faPlus,
|
|
58
|
+
style: {
|
|
59
|
+
transition: 'transform 0.2s ease',
|
|
60
|
+
transform: open ? 'rotate(45deg)' : 'rotate(0deg)'
|
|
61
|
+
}
|
|
57
62
|
});
|
|
58
63
|
};
|
|
59
|
-
var ExpandableArea = exports.ExpandableArea = function ExpandableArea(
|
|
60
|
-
var children =
|
|
61
|
-
className =
|
|
64
|
+
var ExpandableArea = exports.ExpandableArea = function ExpandableArea(_ref3) {
|
|
65
|
+
var children = _ref3.children,
|
|
66
|
+
className = _ref3.className,
|
|
67
|
+
_ref3$animated = _ref3.animated,
|
|
68
|
+
animated = _ref3$animated === void 0 ? false : _ref3$animated;
|
|
62
69
|
var _useContext2 = (0, _react.useContext)(ExpandableContext),
|
|
63
70
|
settings = _useContext2.settings;
|
|
64
71
|
var open = settings.open;
|
|
65
72
|
return /*#__PURE__*/_react["default"].createElement("div", {
|
|
66
|
-
className: "".concat(open ? '' : 'hidden', " ").concat(className)
|
|
73
|
+
className: "".concat(open ? '' : 'hidden', " ").concat(className),
|
|
74
|
+
style: animated ? {
|
|
75
|
+
maxHeight: open ? '1000px' : '0',
|
|
76
|
+
opacity: open ? 1 : 0,
|
|
77
|
+
transition: 'max-height 0.4s ease-in-out, opacity 0.3s ease-in-out'
|
|
78
|
+
} : {}
|
|
67
79
|
}, children);
|
|
68
80
|
};
|
|
69
81
|
Expandable.propTypes = {
|
|
70
82
|
children: _propTypes["default"].any
|
|
83
|
+
};
|
|
84
|
+
ExpandableButton.propTypes = {
|
|
85
|
+
children: _propTypes["default"].any,
|
|
86
|
+
onClick: _propTypes["default"].func
|
|
87
|
+
};
|
|
88
|
+
ExpandableArea.propTypes = {
|
|
89
|
+
children: _propTypes["default"].any,
|
|
90
|
+
className: _propTypes["default"].string,
|
|
91
|
+
animated: _propTypes["default"].bool
|
|
71
92
|
};
|
|
@@ -1,18 +1,26 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
+
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
|
3
4
|
Object.defineProperty(exports, "__esModule", {
|
|
4
5
|
value: true
|
|
5
6
|
});
|
|
6
7
|
exports.Input = void 0;
|
|
7
8
|
var _react = _interopRequireDefault(require("react"));
|
|
8
9
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
9
|
-
var _button = require("../button");
|
|
10
10
|
var _freeSolidSvgIcons = require("@fortawesome/free-solid-svg-icons");
|
|
11
|
-
var
|
|
11
|
+
var _button = require("../button");
|
|
12
|
+
var _excluded = ["type", "label", "error", "placeholder", "required", "expanded", "value", "onChange", "onBlur", "onReset", "inputClass", "inputStyle", "showArrows", "align", "min", "max"];
|
|
12
13
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
|
|
13
14
|
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
|
|
15
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
16
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
17
|
+
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
|
|
18
|
+
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
|
|
19
|
+
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
|
14
20
|
function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
|
|
15
21
|
function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
|
|
22
|
+
// import { IconButton } from 'gdx-ui/components/button/IconButton';
|
|
23
|
+
|
|
16
24
|
var Input = exports.Input = /*#__PURE__*/_react["default"].forwardRef(function (_ref, ref) {
|
|
17
25
|
var _ref$type = _ref.type,
|
|
18
26
|
type = _ref$type === void 0 ? 'text' : _ref$type,
|
|
@@ -25,13 +33,15 @@ var Input = exports.Input = /*#__PURE__*/_react["default"].forwardRef(function (
|
|
|
25
33
|
expanded = _ref$expanded === void 0 ? true : _ref$expanded,
|
|
26
34
|
value = _ref.value,
|
|
27
35
|
onChange = _ref.onChange,
|
|
36
|
+
onBlur = _ref.onBlur,
|
|
28
37
|
onReset = _ref.onReset,
|
|
29
38
|
inputClass = _ref.inputClass,
|
|
30
39
|
inputStyle = _ref.inputStyle,
|
|
31
40
|
_ref$showArrows = _ref.showArrows,
|
|
32
41
|
showArrows = _ref$showArrows === void 0 ? true : _ref$showArrows,
|
|
33
|
-
|
|
34
|
-
|
|
42
|
+
align = _ref.align,
|
|
43
|
+
min = _ref.min,
|
|
44
|
+
max = _ref.max,
|
|
35
45
|
props = _objectWithoutProperties(_ref, _excluded);
|
|
36
46
|
// show the button if the component is reseteable and has a value
|
|
37
47
|
var showReset = onReset && value && value !== '';
|
|
@@ -40,7 +50,68 @@ var Input = exports.Input = /*#__PURE__*/_react["default"].forwardRef(function (
|
|
|
40
50
|
var onClickReset = function onClickReset() {
|
|
41
51
|
if (onReset) onReset();
|
|
42
52
|
};
|
|
53
|
+
|
|
54
|
+
// Manejar onChange para inputs numéricos
|
|
55
|
+
var handleChange = function handleChange(e) {
|
|
56
|
+
if (type === 'number') {
|
|
57
|
+
var val = e.target.value;
|
|
58
|
+
// Permitir vacío temporalmente para que el usuario pueda borrar
|
|
59
|
+
if (val === '') {
|
|
60
|
+
// Crear un evento sintético con valor vacío
|
|
61
|
+
var syntheticEvent = _objectSpread(_objectSpread({}, e), {}, {
|
|
62
|
+
target: _objectSpread(_objectSpread({}, e.target), {}, {
|
|
63
|
+
value: ''
|
|
64
|
+
})
|
|
65
|
+
});
|
|
66
|
+
if (onChange) onChange(syntheticEvent);
|
|
67
|
+
return;
|
|
68
|
+
}
|
|
69
|
+
}
|
|
70
|
+
if (onChange) onChange(e);
|
|
71
|
+
};
|
|
72
|
+
|
|
73
|
+
// Manejar onBlur para inputs numéricos
|
|
74
|
+
var handleBlur = function handleBlur(e) {
|
|
75
|
+
if (type === 'number') {
|
|
76
|
+
var val = e.target.value;
|
|
77
|
+
var correctedValue = null;
|
|
78
|
+
|
|
79
|
+
// Si está vacío o es inválido, usar el valor mínimo o 0
|
|
80
|
+
if (val === '' || isNaN(Number(val))) {
|
|
81
|
+
correctedValue = min !== undefined ? min : 0;
|
|
82
|
+
}
|
|
83
|
+
// Validar que el valor no sea menor que el mínimo
|
|
84
|
+
else if (min !== undefined && Number(val) < min) {
|
|
85
|
+
correctedValue = min;
|
|
86
|
+
}
|
|
87
|
+
// Validar que el valor no sea mayor que el máximo
|
|
88
|
+
else if (max !== undefined && Number(val) > max) {
|
|
89
|
+
correctedValue = max;
|
|
90
|
+
}
|
|
91
|
+
|
|
92
|
+
// Si se necesita corrección, actualizar el valor
|
|
93
|
+
if (correctedValue !== null) {
|
|
94
|
+
// Actualizar el input directamente
|
|
95
|
+
e.target.value = correctedValue;
|
|
96
|
+
|
|
97
|
+
// Crear evento sintético con el valor corregido como NUMBER
|
|
98
|
+
var syntheticEvent = _objectSpread(_objectSpread({}, e), {}, {
|
|
99
|
+
target: _objectSpread(_objectSpread({}, e.target), {}, {
|
|
100
|
+
value: correctedValue,
|
|
101
|
+
valueAsNumber: correctedValue // ✅ Para react-hook-form
|
|
102
|
+
})
|
|
103
|
+
});
|
|
104
|
+
|
|
105
|
+
// Llamar a onChange con el valor corregido
|
|
106
|
+
if (onChange) onChange(syntheticEvent);
|
|
107
|
+
}
|
|
108
|
+
}
|
|
109
|
+
|
|
110
|
+
// Llamar al onBlur original si existe
|
|
111
|
+
if (onBlur) onBlur(e);
|
|
112
|
+
};
|
|
43
113
|
placeholder !== null && placeholder !== void 0 ? placeholder : placeholder = "".concat(label || '', " ").concat(required ? '(obligatorio)' : '');
|
|
114
|
+
var alignClass = !align ? type === 'number' ? 'right' : 'left' : align;
|
|
44
115
|
return /*#__PURE__*/_react["default"].createElement("label", {
|
|
45
116
|
className: "form-element"
|
|
46
117
|
}, label && /*#__PURE__*/_react["default"].createElement("div", {
|
|
@@ -54,10 +125,13 @@ var Input = exports.Input = /*#__PURE__*/_react["default"].forwardRef(function (
|
|
|
54
125
|
ref: ref,
|
|
55
126
|
type: type,
|
|
56
127
|
value: value,
|
|
57
|
-
onChange:
|
|
58
|
-
|
|
128
|
+
onChange: handleChange,
|
|
129
|
+
onBlur: handleBlur,
|
|
130
|
+
className: "".concat(expanded ? 'expanded' : '', " \n ").concat(alignClass, "\n ").concat(error ? 'input-alert' : '', " \n ").concat(showArrows ? '' : 'hidden-arrows', "\n ").concat(inputClass ? inputClass : ''),
|
|
59
131
|
style: inputStyle,
|
|
60
|
-
placeholder: placeholder
|
|
132
|
+
placeholder: placeholder,
|
|
133
|
+
min: type === 'number' ? min : undefined,
|
|
134
|
+
max: type === 'number' ? max : undefined
|
|
61
135
|
}, props)), showReset && /*#__PURE__*/_react["default"].createElement("span", {
|
|
62
136
|
className: "input-reset-btn"
|
|
63
137
|
}, /*#__PURE__*/_react["default"].createElement(_button.IconButton, {
|
|
@@ -78,6 +152,9 @@ Input.propTypes = {
|
|
|
78
152
|
required: _propTypes["default"].bool,
|
|
79
153
|
value: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].number]),
|
|
80
154
|
onChange: _propTypes["default"].func,
|
|
155
|
+
onBlur: _propTypes["default"].func,
|
|
81
156
|
onReset: _propTypes["default"].func,
|
|
82
|
-
inputClass: _propTypes["default"].string
|
|
157
|
+
inputClass: _propTypes["default"].string,
|
|
158
|
+
min: _propTypes["default"].number,
|
|
159
|
+
max: _propTypes["default"].number
|
|
83
160
|
};
|
|
@@ -7,6 +7,9 @@ exports.Anchor = void 0;
|
|
|
7
7
|
var _react = _interopRequireDefault(require("react"));
|
|
8
8
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
9
9
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
|
|
10
|
+
/**
|
|
11
|
+
* @deprecated Use Link from react-router-dom instead
|
|
12
|
+
*/
|
|
10
13
|
var Anchor = exports.Anchor = function Anchor(_ref) {
|
|
11
14
|
var children = _ref.children,
|
|
12
15
|
href = _ref.href,
|
package/package.json
CHANGED
|
@@ -47,13 +47,15 @@ var Reseteable = exports.Reseteable = {
|
|
|
47
47
|
};
|
|
48
48
|
var TypeNumber = exports.TypeNumber = {
|
|
49
49
|
args: {
|
|
50
|
-
label: '
|
|
50
|
+
label: 'Número',
|
|
51
51
|
type: 'number',
|
|
52
|
-
placeholder: '
|
|
52
|
+
placeholder: '#',
|
|
53
53
|
expanded: true,
|
|
54
54
|
align: 'right',
|
|
55
|
-
showArrows:
|
|
55
|
+
showArrows: false,
|
|
56
56
|
step: 1,
|
|
57
|
-
required: false
|
|
57
|
+
required: false,
|
|
58
|
+
min: 0,
|
|
59
|
+
max: 10
|
|
58
60
|
}
|
|
59
61
|
};
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports["default"] = exports.Default = void 0;
|
|
7
|
+
var _react = _interopRequireDefault(require("react"));
|
|
8
|
+
var _Table = require("../../components/table/Table");
|
|
9
|
+
var _Expandable = require("../../components/expandable/Expandable");
|
|
10
|
+
var _Separator = require("../../components/util/Separator");
|
|
11
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
|
|
12
|
+
var _default = exports["default"] = {
|
|
13
|
+
title: 'Components/Expandable',
|
|
14
|
+
component: _Expandable.Expandable,
|
|
15
|
+
tags: ['autodocs']
|
|
16
|
+
};
|
|
17
|
+
var Default = exports.Default = {
|
|
18
|
+
render: function render() {
|
|
19
|
+
return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_Expandable.Expandable, {
|
|
20
|
+
open: false
|
|
21
|
+
}, /*#__PURE__*/_react["default"].createElement(_Expandable.ExpandableButton, null), /*#__PURE__*/_react["default"].createElement(_Separator.Separator, null), /*#__PURE__*/_react["default"].createElement(_Expandable.ExpandableArea, null, /*#__PURE__*/_react["default"].createElement("div", {
|
|
22
|
+
className: "box"
|
|
23
|
+
}, /*#__PURE__*/_react["default"].createElement("div", {
|
|
24
|
+
className: "content"
|
|
25
|
+
}, "More information shown when expanded.")))));
|
|
26
|
+
}
|
|
27
|
+
};
|
|
@@ -1,151 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
|
4
|
-
Object.defineProperty(exports, "__esModule", {
|
|
5
|
-
value: true
|
|
6
|
-
});
|
|
7
|
-
exports.ListItem = exports.List = void 0;
|
|
8
|
-
var _react = _interopRequireWildcard(require("react"));
|
|
9
|
-
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
10
|
-
var _reactBeautifulDnd = require("react-beautiful-dnd");
|
|
11
|
-
var _reactFontawesome = require("@fortawesome/react-fontawesome");
|
|
12
|
-
var _freeSolidSvgIcons = require("@fortawesome/free-solid-svg-icons");
|
|
13
|
-
var _excluded = ["children"];
|
|
14
|
-
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
|
|
15
|
-
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
|
|
16
|
-
function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
|
|
17
|
-
function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
|
|
18
|
-
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
|
|
19
|
-
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
20
|
-
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
21
|
-
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
|
|
22
|
-
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
|
|
23
|
-
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
|
24
|
-
function _toConsumableArray(r) { return _arrayWithoutHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray(r) || _nonIterableSpread(); }
|
|
25
|
-
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
26
|
-
function _iterableToArray(r) { if ("undefined" != typeof Symbol && null != r[Symbol.iterator] || null != r["@@iterator"]) return Array.from(r); }
|
|
27
|
-
function _arrayWithoutHoles(r) { if (Array.isArray(r)) return _arrayLikeToArray(r); }
|
|
28
|
-
function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
|
|
29
|
-
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
30
|
-
function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
|
|
31
|
-
function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
|
|
32
|
-
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
|
|
33
|
-
function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
|
|
34
|
-
var List = exports.List = function List(_ref) {
|
|
35
|
-
var children = _ref.children,
|
|
36
|
-
_ref$bullets = _ref.bullets,
|
|
37
|
-
bullets = _ref$bullets === void 0 ? false : _ref$bullets,
|
|
38
|
-
_ref$inline = _ref.inline,
|
|
39
|
-
inline = _ref$inline === void 0 ? false : _ref$inline,
|
|
40
|
-
_ref$className = _ref.className,
|
|
41
|
-
className = _ref$className === void 0 ? '' : _ref$className,
|
|
42
|
-
_ref$sortable = _ref.sortable,
|
|
43
|
-
sortable = _ref$sortable === void 0 ? false : _ref$sortable,
|
|
44
|
-
onReorder = _ref.onReorder,
|
|
45
|
-
_ref$dragHandle = _ref.dragHandle,
|
|
46
|
-
dragHandle = _ref$dragHandle === void 0 ? false : _ref$dragHandle;
|
|
47
|
-
// Estado interno para manejar el orden de children
|
|
48
|
-
var _useState = (0, _react.useState)(function () {
|
|
49
|
-
return _react["default"].Children.toArray(children);
|
|
50
|
-
}),
|
|
51
|
-
_useState2 = _slicedToArray(_useState, 2),
|
|
52
|
-
internalChildren = _useState2[0],
|
|
53
|
-
setInternalChildren = _useState2[1];
|
|
54
|
-
|
|
55
|
-
// Actualiza el estado interno cuando children cambia
|
|
56
|
-
(0, _react.useEffect)(function () {
|
|
57
|
-
setInternalChildren(_react["default"].Children.toArray(children));
|
|
58
|
-
}, [children]);
|
|
59
|
-
var handleOnDragEnd = function handleOnDragEnd(result) {
|
|
60
|
-
if (!result.destination) return;
|
|
61
|
-
var startIndex = result.source.index;
|
|
62
|
-
var endIndex = result.destination.index;
|
|
63
|
-
if (startIndex === endIndex) return;
|
|
64
|
-
|
|
65
|
-
// Reordena el estado interno
|
|
66
|
-
var newChildren = _toConsumableArray(internalChildren);
|
|
67
|
-
var _newChildren$splice = newChildren.splice(startIndex, 1),
|
|
68
|
-
_newChildren$splice2 = _slicedToArray(_newChildren$splice, 1),
|
|
69
|
-
moved = _newChildren$splice2[0];
|
|
70
|
-
newChildren.splice(endIndex, 0, moved);
|
|
71
|
-
setInternalChildren(newChildren);
|
|
72
|
-
|
|
73
|
-
// Notifica al padre si hay callback
|
|
74
|
-
if (onReorder) {
|
|
75
|
-
onReorder(startIndex, endIndex);
|
|
76
|
-
}
|
|
77
|
-
};
|
|
78
|
-
if (sortable) {
|
|
79
|
-
return /*#__PURE__*/_react["default"].createElement(_reactBeautifulDnd.DragDropContext, {
|
|
80
|
-
onDragEnd: handleOnDragEnd
|
|
81
|
-
}, /*#__PURE__*/_react["default"].createElement(_reactBeautifulDnd.Droppable, {
|
|
82
|
-
droppableId: "list",
|
|
83
|
-
direction: inline ? 'horizontal' : 'vertical'
|
|
84
|
-
}, function (provided) {
|
|
85
|
-
return /*#__PURE__*/_react["default"].createElement("div", _extends({
|
|
86
|
-
className: "".concat(bullets ? '' : 'clear-list', " ").concat(inline ? 'inline-list' : '', " ").concat(className)
|
|
87
|
-
}, provided.droppableProps, {
|
|
88
|
-
ref: provided.innerRef
|
|
89
|
-
}), /*#__PURE__*/_react["default"].createElement("ul", null, internalChildren.map(function (child, index) {
|
|
90
|
-
var _child$key;
|
|
91
|
-
return /*#__PURE__*/_react["default"].createElement(_reactBeautifulDnd.Draggable, {
|
|
92
|
-
key: child.key || index,
|
|
93
|
-
draggableId: ((_child$key = child.key) === null || _child$key === void 0 ? void 0 : _child$key.toString()) || index.toString(),
|
|
94
|
-
index: index
|
|
95
|
-
}, function (provided, snapshot) {
|
|
96
|
-
return /*#__PURE__*/_react["default"].createElement("li", _extends({
|
|
97
|
-
ref: provided.innerRef
|
|
98
|
-
}, provided.draggableProps, !dragHandle ? provided.dragHandleProps : {}, {
|
|
99
|
-
style: _objectSpread(_objectSpread({}, provided.draggableProps.style), {}, {
|
|
100
|
-
opacity: snapshot.isDragging ? 0.8 : 1,
|
|
101
|
-
cursor: dragHandle ? 'default' : 'move',
|
|
102
|
-
display: 'flex',
|
|
103
|
-
alignItems: 'center',
|
|
104
|
-
flexDirection: inline ? 'column' : 'row'
|
|
105
|
-
}),
|
|
106
|
-
className: "list-item"
|
|
107
|
-
}), dragHandle && /*#__PURE__*/_react["default"].createElement("div", _extends({}, provided.dragHandleProps, {
|
|
108
|
-
style: {
|
|
109
|
-
padding: '8px',
|
|
110
|
-
cursor: 'grab',
|
|
111
|
-
display: 'flex',
|
|
112
|
-
alignItems: 'center',
|
|
113
|
-
marginRight: inline ? '0' : '8px',
|
|
114
|
-
marginBottom: inline ? '4px' : '0'
|
|
115
|
-
}
|
|
116
|
-
}), /*#__PURE__*/_react["default"].createElement(_reactFontawesome.FontAwesomeIcon, {
|
|
117
|
-
icon: _freeSolidSvgIcons.faGripVertical
|
|
118
|
-
})), /*#__PURE__*/_react["default"].createElement("div", {
|
|
119
|
-
style: {
|
|
120
|
-
flex: 1
|
|
121
|
-
}
|
|
122
|
-
}, child.props.children));
|
|
123
|
-
});
|
|
124
|
-
}), provided.placeholder));
|
|
125
|
-
}));
|
|
126
|
-
}
|
|
127
|
-
|
|
128
|
-
// Renderizado normal
|
|
129
|
-
return /*#__PURE__*/_react["default"].createElement("div", {
|
|
130
|
-
className: "".concat(bullets ? '' : 'clear-list', " ").concat(inline ? 'inline-list' : '', " ").concat(className)
|
|
131
|
-
}, /*#__PURE__*/_react["default"].createElement("ul", null, children));
|
|
132
|
-
};
|
|
133
|
-
var ListItem = exports.ListItem = function ListItem(_ref2) {
|
|
134
|
-
var children = _ref2.children,
|
|
135
|
-
props = _objectWithoutProperties(_ref2, _excluded);
|
|
136
|
-
return /*#__PURE__*/_react["default"].createElement("li", _extends({
|
|
137
|
-
className: "list-item"
|
|
138
|
-
}, props), children);
|
|
139
|
-
};
|
|
140
|
-
List.propTypes = {
|
|
141
|
-
children: _propTypes["default"].any,
|
|
142
|
-
className: _propTypes["default"].string,
|
|
143
|
-
inline: _propTypes["default"].bool,
|
|
144
|
-
bullets: _propTypes["default"].bool,
|
|
145
|
-
sortable: _propTypes["default"].bool,
|
|
146
|
-
onReorder: _propTypes["default"].func,
|
|
147
|
-
dragHandle: _propTypes["default"].bool
|
|
148
|
-
};
|
|
149
|
-
ListItem.propTypes = {
|
|
150
|
-
children: _propTypes["default"].any.isRequired
|
|
151
|
-
};
|