gdx-ui 1.15.1 → 1.15.2

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 onClickBtn = function onClickBtn() {
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: onClickBtn,
56
- icon: open ? _freeSolidSvgIcons.faTimes : _freeSolidSvgIcons.faPlus
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(_ref2) {
60
- var children = _ref2.children,
61
- className = _ref2.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 _excluded = ["type", "label", "error", "placeholder", "required", "expanded", "value", "onChange", "onReset", "inputClass", "inputStyle", "showArrows", "align"];
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,6 +33,7 @@ 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,
@@ -32,6 +41,8 @@ var Input = exports.Input = /*#__PURE__*/_react["default"].forwardRef(function (
32
41
  showArrows = _ref$showArrows === void 0 ? true : _ref$showArrows,
33
42
  _ref$align = _ref.align,
34
43
  align = _ref$align === void 0 ? 'left' : _ref$align,
44
+ min = _ref.min,
45
+ max = _ref.max,
35
46
  props = _objectWithoutProperties(_ref, _excluded);
36
47
  // show the button if the component is reseteable and has a value
37
48
  var showReset = onReset && value && value !== '';
@@ -40,6 +51,44 @@ var Input = exports.Input = /*#__PURE__*/_react["default"].forwardRef(function (
40
51
  var onClickReset = function onClickReset() {
41
52
  if (onReset) onReset();
42
53
  };
54
+
55
+ // Manejar onChange para inputs numéricos
56
+ var handleChange = function handleChange(e) {
57
+ if (type === 'number') {
58
+ var val = e.target.value;
59
+ // Permitir vacío temporalmente para que el usuario pueda borrar
60
+ if (val === '') {
61
+ // Crear un evento sintético con valor vacío
62
+ var syntheticEvent = _objectSpread(_objectSpread({}, e), {}, {
63
+ target: _objectSpread(_objectSpread({}, e.target), {}, {
64
+ value: ''
65
+ })
66
+ });
67
+ if (onChange) onChange(syntheticEvent);
68
+ return;
69
+ }
70
+ }
71
+ if (onChange) onChange(e);
72
+ };
73
+
74
+ // Manejar onBlur para inputs numéricos
75
+ var handleBlur = function handleBlur(e) {
76
+ if (type === 'number') {
77
+ var val = e.target.value;
78
+ // Si está vacío o es inválido, usar el valor mínimo o 0
79
+ if (val === '' || isNaN(Number(val))) {
80
+ var defaultValue = min !== undefined ? min : 0;
81
+ // Crear un evento sintético con el valor por defecto
82
+ var syntheticEvent = _objectSpread(_objectSpread({}, e), {}, {
83
+ target: _objectSpread(_objectSpread({}, e.target), {}, {
84
+ value: defaultValue
85
+ })
86
+ });
87
+ if (onChange) onChange(syntheticEvent);
88
+ }
89
+ }
90
+ if (onBlur) onBlur(e);
91
+ };
43
92
  placeholder !== null && placeholder !== void 0 ? placeholder : placeholder = "".concat(label || '', " ").concat(required ? '(obligatorio)' : '');
44
93
  return /*#__PURE__*/_react["default"].createElement("label", {
45
94
  className: "form-element"
@@ -54,10 +103,13 @@ var Input = exports.Input = /*#__PURE__*/_react["default"].forwardRef(function (
54
103
  ref: ref,
55
104
  type: type,
56
105
  value: value,
57
- onChange: onChange,
106
+ onChange: handleChange,
107
+ onBlur: handleBlur,
58
108
  className: "".concat(expanded ? 'expanded' : '', " \n ").concat(type === 'number' ? 'right' : '', "\n ").concat(error ? 'input-alert' : '', " \n ").concat(showArrows ? '' : 'hidden-arrows', "\n ").concat(align, "\n ").concat(inputClass ? inputClass : ''),
59
109
  style: inputStyle,
60
- placeholder: placeholder
110
+ placeholder: placeholder,
111
+ min: type === 'number' ? min : undefined,
112
+ max: type === 'number' ? max : undefined
61
113
  }, props)), showReset && /*#__PURE__*/_react["default"].createElement("span", {
62
114
  className: "input-reset-btn"
63
115
  }, /*#__PURE__*/_react["default"].createElement(_button.IconButton, {
@@ -78,6 +130,9 @@ Input.propTypes = {
78
130
  required: _propTypes["default"].bool,
79
131
  value: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].number]),
80
132
  onChange: _propTypes["default"].func,
133
+ onBlur: _propTypes["default"].func,
81
134
  onReset: _propTypes["default"].func,
82
- inputClass: _propTypes["default"].string
135
+ inputClass: _propTypes["default"].string,
136
+ min: _propTypes["default"].number,
137
+ max: _propTypes["default"].number
83
138
  };
@@ -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
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "gdx-ui",
3
- "version": "1.15.1",
3
+ "version": "1.15.2",
4
4
  "description": "UI gdx",
5
5
  "main": "index.js",
6
6
  "module": "index.js",
@@ -47,13 +47,15 @@ var Reseteable = exports.Reseteable = {
47
47
  };
48
48
  var TypeNumber = exports.TypeNumber = {
49
49
  args: {
50
- label: 'Campo numérico',
50
+ label: 'Número',
51
51
  type: 'number',
52
- placeholder: 'Escribe un número',
52
+ placeholder: '#',
53
53
  expanded: true,
54
54
  align: 'right',
55
- showArrows: true,
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
- };