gdx-ui 1.15.3 → 2.0.1

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.
Files changed (56) hide show
  1. package/base.css +1 -1
  2. package/components/autocomplete/Autocomplete.js +64 -53
  3. package/components/badge/Badge.js +2 -2
  4. package/components/box/Box.js +34 -31
  5. package/components/dialog/Dialog.js +15 -26
  6. package/components/editable/Editable.js +105 -95
  7. package/components/editable/EditableArea.js +3 -0
  8. package/components/flex/Flex.js +51 -22
  9. package/components/forms/LabelInput.js +13 -4
  10. package/components/forms/LabelValue.js +13 -4
  11. package/components/images/CarouselImages.js +11 -12
  12. package/components/images/Img.js +14 -26
  13. package/components/images/Thumb.js +16 -40
  14. package/components/images/{ImageZoom.js → ZoomImage.js} +74 -111
  15. package/components/images/{PictureZoomBtns.js → ZoomImageButtons.js} +50 -63
  16. package/components/images/{Picture.js → ZoomImageSquare.js} +3 -3
  17. package/components/images/index.js +33 -11
  18. package/components/images/useImageLoader.js +76 -0
  19. package/components/list/ScrollableList.js +1 -1
  20. package/components/snackbar/Snackbar.js +1 -1
  21. package/components/table/Table.js +14 -1
  22. package/components/util/Note.js +14 -5
  23. package/components/util/Text.js +41 -9
  24. package/components/util/Title.js +35 -8
  25. package/components/util/index.js +0 -11
  26. package/components/widget/Widget.js +16 -5
  27. package/hooks/index.js +11 -0
  28. package/hooks/useAutocomplete.js +103 -0
  29. package/package.json +1 -1
  30. package/stories/box/Box.stories.js +32 -0
  31. package/stories/editable/Editable.stories.js +26 -0
  32. package/stories/editable/Editor.stories.js +33 -0
  33. package/stories/forms/Autocomplete.stories.js +101 -0
  34. package/stories/images/CarouselImages.stories.js +31 -0
  35. package/stories/images/{images.stories.js → Images.stories.js} +1 -1
  36. package/stories/images/ZoomImage.stories.js +24 -0
  37. package/stories/images/ZoomImageButtons.stories.js +23 -0
  38. package/stories/images/ZoomImageSquare.stories.js +23 -0
  39. package/stories/layout/Flex.stories.js +180 -0
  40. package/stories/list/ScrollableList.stories.js +37 -8
  41. package/stories/utils/Badge.stories.js +29 -0
  42. package/stories/utils/Expanded.stories.js +18 -7
  43. package/stories/utils/Loader.stories.js +32 -0
  44. package/stories/utils/Note.stories.js +38 -0
  45. package/stories/utils/Snackbar.stories.js +46 -0
  46. package/stories/utils/Text.stories.js +40 -0
  47. package/stories/utils/Tooltip.stories.js +22 -0
  48. package/stories/widget/Widget.stories.js +59 -0
  49. package/components/images/PictureZoomSquare.js +0 -60
  50. package/components/list/SortableList.js +0 -138
  51. package/components/list/SortableListOLD.js +0 -121
  52. package/components/scroller/ListScroller.js +0 -113
  53. package/components/util/Anchor.js +0 -30
  54. package/stories/flex/Flex.stories.js +0 -35
  55. package/stories/list/SorteableList.stories.js +0 -45
  56. /package/stories/images/{thumb.stories.js → Thumb.stories.js} +0 -0
@@ -0,0 +1,76 @@
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.useImageLoader = void 0;
8
+ var _react = require("react");
9
+ 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; }
10
+ 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; }
11
+ 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; }
12
+ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
13
+ 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
+ function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
15
+ 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."); }
16
+ 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; } }
17
+ 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; }
18
+ 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; } }
19
+ function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
20
+ var useImageLoader = exports.useImageLoader = function useImageLoader(src) {
21
+ var _useState = (0, _react.useState)({
22
+ isLoading: Boolean(src),
23
+ hasError: false,
24
+ width: 0,
25
+ height: 0
26
+ }),
27
+ _useState2 = _slicedToArray(_useState, 2),
28
+ state = _useState2[0],
29
+ setState = _useState2[1];
30
+ (0, _react.useEffect)(function () {
31
+ if (!src) {
32
+ setState({
33
+ isLoading: false,
34
+ hasError: true,
35
+ width: 0,
36
+ height: 0
37
+ });
38
+ return undefined;
39
+ }
40
+ var isCancelled = false;
41
+ var image = new Image();
42
+ setState(function (prev) {
43
+ return _objectSpread(_objectSpread({}, prev), {}, {
44
+ isLoading: true,
45
+ hasError: false
46
+ });
47
+ });
48
+ image.onload = function () {
49
+ if (isCancelled) {
50
+ return;
51
+ }
52
+ setState({
53
+ isLoading: false,
54
+ hasError: false,
55
+ width: image.width,
56
+ height: image.height
57
+ });
58
+ };
59
+ image.onerror = function () {
60
+ if (isCancelled) {
61
+ return;
62
+ }
63
+ setState({
64
+ isLoading: false,
65
+ hasError: true,
66
+ width: 0,
67
+ height: 0
68
+ });
69
+ };
70
+ image.src = src;
71
+ return function () {
72
+ isCancelled = true;
73
+ };
74
+ }, [src]);
75
+ return state;
76
+ };
@@ -36,7 +36,7 @@ var ScrollableList = exports.ScrollableList = function ScrollableList(_ref) {
36
36
  canScrollRight = _useState4[0],
37
37
  setCanScrollRight = _useState4[1];
38
38
 
39
- // Actualiza el estado de los botones según el scroll
39
+ // Update scroll buttons state
40
40
  var updateScrollButtons = function updateScrollButtons() {
41
41
  var el = containerRef.current;
42
42
  if (!el) return;
@@ -15,7 +15,7 @@ function _extends() { return _extends = Object.assign ? Object.assign.bind() : f
15
15
  var Snackbar = exports.Snackbar = function Snackbar(_ref) {
16
16
  var children = _ref.children,
17
17
  _ref$color = _ref.color,
18
- color = _ref$color === void 0 ? 'primary' : _ref$color,
18
+ color = _ref$color === void 0 ? 'default' : _ref$color,
19
19
  onClose = _ref.onClose,
20
20
  _ref$timer = _ref.timer,
21
21
  timer = _ref$timer === void 0 ? 5 : _ref$timer;
@@ -116,7 +116,20 @@ Table.propTypes = {
116
116
  hover: _propTypes["default"].bool
117
117
  };
118
118
  TableHeader.propTypes = {
119
- headers: _propTypes["default"].array
119
+ headers: _propTypes["default"].arrayOf(_propTypes["default"].shape({
120
+ /** Texto a mostrar en el header */
121
+ text: _propTypes["default"].string.isRequired,
122
+ /** Ancho de la columna (número para porcentaje relativo o string para valores fijos) */
123
+ width: _propTypes["default"].oneOfType([_propTypes["default"].number, _propTypes["default"].string]),
124
+ /** Alineación del texto */
125
+ align: _propTypes["default"].oneOf(['left', 'center', 'right']),
126
+ /** Campo usado para ordenar (debe coincidir con el nombre del campo en los datos) */
127
+ field: _propTypes["default"].string,
128
+ /** Tipo de orden actual: ascendente o descendente */
129
+ orderType: _propTypes["default"].oneOf(['ASC', 'DESC']),
130
+ /** Función callback que se ejecuta al hacer click en el header para ordenar */
131
+ onOrder: _propTypes["default"].func
132
+ })).isRequired
120
133
  };
121
134
  TableBody.propTypes = {
122
135
  children: _propTypes["default"].any
@@ -6,20 +6,29 @@ Object.defineProperty(exports, "__esModule", {
6
6
  exports.Note = void 0;
7
7
  var _react = _interopRequireDefault(require("react"));
8
8
  var _propTypes = _interopRequireDefault(require("prop-types"));
9
+ var _Text = require("./Text");
9
10
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
10
11
  var Note = exports.Note = function Note(_ref) {
11
12
  var children = _ref.children,
12
13
  _ref$className = _ref.className,
13
14
  className = _ref$className === void 0 ? '' : _ref$className,
15
+ as = _ref.as,
14
16
  _ref$inline = _ref.inline,
15
- inline = _ref$inline === void 0 ? false : _ref$inline;
16
- var Tag = inline ? 'span' : 'div';
17
- return /*#__PURE__*/_react["default"].createElement(Tag, {
18
- className: "note ".concat(inline ? '' : 'margin-bottom', " ").concat(className)
17
+ inline = _ref$inline === void 0 ? false : _ref$inline,
18
+ _ref$textWrap = _ref.textWrap,
19
+ textWrap = _ref$textWrap === void 0 ? false : _ref$textWrap;
20
+ return /*#__PURE__*/_react["default"].createElement(_Text.Text, {
21
+ as: as,
22
+ inline: inline,
23
+ size: "small",
24
+ className: "note ".concat(className),
25
+ textWrap: textWrap
19
26
  }, children);
20
27
  };
21
28
  Note.propTypes = {
22
29
  children: _propTypes["default"].any,
23
30
  className: _propTypes["default"].string,
24
- inline: _propTypes["default"].bool
31
+ as: _propTypes["default"].oneOf(['div', 'span', 'p']),
32
+ inline: _propTypes["default"].bool,
33
+ textWrap: _propTypes["default"].bool
25
34
  };
@@ -1,40 +1,72 @@
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.Text = void 0;
7
8
  var _react = _interopRequireDefault(require("react"));
8
9
  var _propTypes = _interopRequireDefault(require("prop-types"));
9
- var _excluded = ["children", "className", "size", "inline", "bold"];
10
+ var _excluded = ["children", "html", "className", "size", "as", "inline", "bold", "textWrap", "style"];
10
11
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
11
12
  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); }
13
+ 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; }
14
+ 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; }
15
+ 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; }
16
+ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
17
+ 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); }
12
18
  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; }
13
19
  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; }
14
20
  var Text = exports.Text = function Text(_ref) {
15
21
  var children = _ref.children,
22
+ html = _ref.html,
16
23
  _ref$className = _ref.className,
17
24
  className = _ref$className === void 0 ? '' : _ref$className,
18
25
  _ref$size = _ref.size,
19
26
  size = _ref$size === void 0 ? 'normal' : _ref$size,
27
+ as = _ref.as,
20
28
  _ref$inline = _ref.inline,
21
29
  inline = _ref$inline === void 0 ? false : _ref$inline,
22
30
  _ref$bold = _ref.bold,
23
31
  bold = _ref$bold === void 0 ? false : _ref$bold,
32
+ _ref$textWrap = _ref.textWrap,
33
+ textWrap = _ref$textWrap === void 0 ? false : _ref$textWrap,
34
+ style = _ref.style,
24
35
  props = _objectWithoutProperties(_ref, _excluded);
25
- var Tag = inline ? 'span' : 'div';
36
+ var Tag = as || (inline ? 'span' : 'div');
37
+ var isInlineTag = Tag === 'span';
38
+ var isHeadingTag = /^h[1-6]$/.test(Tag);
39
+ var addBottomMargin = !isInlineTag && Tag !== 'p' && !isHeadingTag;
40
+ var mergedStyle = _objectSpread({
41
+ whiteSpace: textWrap ? 'nowrap' : 'normal',
42
+ overflow: textWrap ? 'hidden' : undefined,
43
+ textOverflow: textWrap ? 'ellipsis' : undefined,
44
+ width: textWrap && !isInlineTag ? '100%' : undefined,
45
+ display: textWrap && isInlineTag ? 'inline-block' : undefined
46
+ }, style);
47
+ if (html !== undefined && html !== null) {
48
+ return /*#__PURE__*/_react["default"].createElement(Tag, _extends({
49
+ className: "\n text-size-".concat(size, " \n ").concat(addBottomMargin ? 'margin-bottom' : '', " \n ").concat(bold ? 'strong' : '', "\n ").concat(className),
50
+ style: mergedStyle
51
+ }, props, {
52
+ dangerouslySetInnerHTML: {
53
+ __html: html
54
+ }
55
+ }));
56
+ }
26
57
  return /*#__PURE__*/_react["default"].createElement(Tag, _extends({
27
- className: "\n text-size-".concat(size, " \n ").concat(inline ? '' : 'margin-bottom', " \n ").concat(bold ? 'strong' : '', "\n ").concat(className)
28
- }, props, {
29
- dangerouslySetInnerHTML: {
30
- __html: children
31
- }
32
- }));
58
+ className: "\n text-content\n text-size-".concat(size, " \n ").concat(addBottomMargin ? 'margin-bottom' : '', " \n ").concat(bold ? 'strong' : '', "\n ").concat(className),
59
+ style: mergedStyle
60
+ }, props), children);
33
61
  };
34
62
  Text.propTypes = {
35
63
  className: _propTypes["default"].string,
64
+ as: _propTypes["default"].oneOf(['div', 'span', 'p', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6']),
36
65
  inline: _propTypes["default"].bool,
37
66
  bold: _propTypes["default"].bool,
38
67
  size: _propTypes["default"].oneOf(['small', 'normal', 'large']),
39
- children: _propTypes["default"].string
68
+ children: _propTypes["default"].any,
69
+ html: _propTypes["default"].string,
70
+ textWrap: _propTypes["default"].bool,
71
+ style: _propTypes["default"].object
40
72
  };
@@ -1,23 +1,50 @@
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.Title = void 0;
7
8
  var _react = _interopRequireDefault(require("react"));
8
9
  var _propTypes = _interopRequireDefault(require("prop-types"));
10
+ var _Text = require("./Text");
11
+ var _excluded = ["children", "className", "as", "fullWidth", "textWrap", "style"];
9
12
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
13
+ 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); }
14
+ 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; }
15
+ 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; }
16
+ 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; }
17
+ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
18
+ 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); }
19
+ 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; }
20
+ 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; }
10
21
  var Title = exports.Title = function Title(_ref) {
11
- var variant = _ref.variant,
12
- children = _ref.children,
22
+ var children = _ref.children,
13
23
  _ref$className = _ref.className,
14
- className = _ref$className === void 0 ? '' : _ref$className;
15
- var Tag = variant || 'h1';
16
- return /*#__PURE__*/_react["default"].createElement(Tag, {
17
- className: className
18
- }, children);
24
+ className = _ref$className === void 0 ? '' : _ref$className,
25
+ _ref$as = _ref.as,
26
+ as = _ref$as === void 0 ? 'h1' : _ref$as,
27
+ _ref$fullWidth = _ref.fullWidth,
28
+ fullWidth = _ref$fullWidth === void 0 ? true : _ref$fullWidth,
29
+ _ref$textWrap = _ref.textWrap,
30
+ textWrap = _ref$textWrap === void 0 ? false : _ref$textWrap,
31
+ style = _ref.style,
32
+ props = _objectWithoutProperties(_ref, _excluded);
33
+ var mergedStyle = _objectSpread({
34
+ width: fullWidth ? '100%' : undefined
35
+ }, style);
36
+ return /*#__PURE__*/_react["default"].createElement(_Text.Text, _extends({
37
+ as: as,
38
+ className: className,
39
+ textWrap: textWrap,
40
+ style: mergedStyle
41
+ }, props), children);
19
42
  };
20
43
  Title.propTypes = {
21
44
  children: _propTypes["default"].any.isRequired,
22
- variant: _propTypes["default"].oneOf(['h1', 'h2', 'h3', 'h4', 'h5', 'h6'])
45
+ className: _propTypes["default"].string,
46
+ as: _propTypes["default"].oneOf(['h1', 'h2', 'h3', 'h4', 'h5', 'h6']),
47
+ fullWidth: _propTypes["default"].bool,
48
+ textWrap: _propTypes["default"].bool,
49
+ style: _propTypes["default"].object
23
50
  };
@@ -3,17 +3,6 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- var _Anchor = require("./Anchor");
7
- Object.keys(_Anchor).forEach(function (key) {
8
- if (key === "default" || key === "__esModule") return;
9
- if (key in exports && exports[key] === _Anchor[key]) return;
10
- Object.defineProperty(exports, key, {
11
- enumerable: true,
12
- get: function get() {
13
- return _Anchor[key];
14
- }
15
- });
16
- });
17
6
  var _List = require("./List");
18
7
  Object.keys(_List).forEach(function (key) {
19
8
  if (key === "default" || key === "__esModule") return;
@@ -6,18 +6,29 @@ Object.defineProperty(exports, "__esModule", {
6
6
  exports.Widget = void 0;
7
7
  var _react = _interopRequireDefault(require("react"));
8
8
  var _propTypes = _interopRequireDefault(require("prop-types"));
9
+ var _excluded = ["children", "className", "bordered", "spacing", "hover"];
9
10
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
11
+ 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); }
12
+ 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; }
13
+ 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; }
10
14
  var Widget = exports.Widget = function Widget(_ref) {
11
15
  var children = _ref.children,
12
16
  className = _ref.className,
17
+ _ref$bordered = _ref.bordered,
18
+ bordered = _ref$bordered === void 0 ? false : _ref$bordered,
13
19
  _ref$spacing = _ref.spacing,
14
- spacing = _ref$spacing === void 0 ? true : _ref$spacing;
15
- return /*#__PURE__*/_react["default"].createElement("div", {
16
- className: "box ".concat(spacing ? 'content' : '', " ").concat(className ? className : '')
17
- }, children);
20
+ spacing = _ref$spacing === void 0 ? true : _ref$spacing,
21
+ _ref$hover = _ref.hover,
22
+ hover = _ref$hover === void 0 ? false : _ref$hover,
23
+ props = _objectWithoutProperties(_ref, _excluded);
24
+ return /*#__PURE__*/_react["default"].createElement("div", _extends({
25
+ className: "widget ".concat(bordered ? 'bordered' : '', " ").concat(spacing ? 'content' : '', " ").concat(hover ? 'widget-hover' : '', " ").concat(className ? className : '')
26
+ }, props), children);
18
27
  };
19
28
  Widget.propTypes = {
20
29
  children: _propTypes["default"].any,
21
30
  className: _propTypes["default"].string,
22
- spacing: _propTypes["default"].bool
31
+ bordered: _propTypes["default"].bool,
32
+ spacing: _propTypes["default"].bool,
33
+ hover: _propTypes["default"].bool
23
34
  };
package/hooks/index.js CHANGED
@@ -13,4 +13,15 @@ Object.keys(_useScreenDimentions).forEach(function (key) {
13
13
  return _useScreenDimentions[key];
14
14
  }
15
15
  });
16
+ });
17
+ var _useAutocomplete = require("./useAutocomplete");
18
+ Object.keys(_useAutocomplete).forEach(function (key) {
19
+ if (key === "default" || key === "__esModule") return;
20
+ if (key in exports && exports[key] === _useAutocomplete[key]) return;
21
+ Object.defineProperty(exports, key, {
22
+ enumerable: true,
23
+ get: function get() {
24
+ return _useAutocomplete[key];
25
+ }
26
+ });
16
27
  });
@@ -0,0 +1,103 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.useAutocomplete = void 0;
7
+ var _react = require("react");
8
+ function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
9
+ 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."); }
10
+ 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; } }
11
+ 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; }
12
+ 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; } }
13
+ function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
14
+ /**
15
+ * Hook para manejar la lógica de Autocomplete
16
+ * @param {Object} options
17
+ * @param {number} options.debounceMs - Tiempo de debounce en ms (default 300)
18
+ * @param {Function} options.onSearch - Callback cuando el usuario escribe (recibe el valor, debe retornar promesa con data)
19
+ * @param {number} options.minChars - Caracteres mínimos para disparar búsqueda (default 1)
20
+ * @returns {Object} - { value, setValue, data, isLoading, handleChange, handleSelect }
21
+ */
22
+ var useAutocomplete = exports.useAutocomplete = function useAutocomplete() {
23
+ var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
24
+ _ref$debounceMs = _ref.debounceMs,
25
+ debounceMs = _ref$debounceMs === void 0 ? 300 : _ref$debounceMs,
26
+ _ref$onSearch = _ref.onSearch,
27
+ onSearch = _ref$onSearch === void 0 ? null : _ref$onSearch,
28
+ _ref$minChars = _ref.minChars,
29
+ minChars = _ref$minChars === void 0 ? 1 : _ref$minChars;
30
+ var _useState = (0, _react.useState)(''),
31
+ _useState2 = _slicedToArray(_useState, 2),
32
+ value = _useState2[0],
33
+ setValue = _useState2[1];
34
+ var _useState3 = (0, _react.useState)([]),
35
+ _useState4 = _slicedToArray(_useState3, 2),
36
+ data = _useState4[0],
37
+ setData = _useState4[1];
38
+ var _useState5 = (0, _react.useState)(false),
39
+ _useState6 = _slicedToArray(_useState5, 2),
40
+ isLoading = _useState6[0],
41
+ setIsLoading = _useState6[1];
42
+ var debounceTimerId = (0, _react.useRef)(null);
43
+ var handleChange = (0, _react.useCallback)(function (newValue) {
44
+ setValue(newValue);
45
+
46
+ // Limpiar timer anterior
47
+ if (debounceTimerId.current) {
48
+ clearTimeout(debounceTimerId.current);
49
+ }
50
+
51
+ // Si no hay callback, no hacer nada
52
+ if (!onSearch) {
53
+ setData([]);
54
+ return;
55
+ }
56
+
57
+ // Si no hay suficientes caracteres, limpiar resultados
58
+ if (newValue.trim().length < minChars) {
59
+ setData([]);
60
+ setIsLoading(false);
61
+ return;
62
+ }
63
+
64
+ // Debounce: esperar antes de buscar
65
+ debounceTimerId.current = setTimeout(function () {
66
+ setIsLoading(true);
67
+
68
+ // Ejecutar búsqueda (esperamos que retorne promesa)
69
+ Promise.resolve(onSearch(newValue)).then(function (results) {
70
+ setData(Array.isArray(results) ? results : []);
71
+ setIsLoading(false);
72
+ })["catch"](function (error) {
73
+ console.error('Error en búsqueda de autocomplete:', error);
74
+ setData([]);
75
+ setIsLoading(false);
76
+ });
77
+ }, debounceMs);
78
+ }, [debounceMs, onSearch, minChars]);
79
+ var handleSelect = (0, _react.useCallback)(function (selectedItem) {
80
+ // El padre decide qué hacer con la selección
81
+ setValue('');
82
+ setData([]);
83
+ return selectedItem;
84
+ }, []);
85
+
86
+ // Limpiar timeout al desmontar
87
+ (0, _react.useEffect)(function () {
88
+ return function () {
89
+ if (debounceTimerId.current) {
90
+ clearTimeout(debounceTimerId.current);
91
+ }
92
+ };
93
+ }, []);
94
+ return {
95
+ value: value,
96
+ setValue: setValue,
97
+ data: data,
98
+ setData: setData,
99
+ isLoading: isLoading,
100
+ handleChange: handleChange,
101
+ handleSelect: handleSelect
102
+ };
103
+ };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "gdx-ui",
3
- "version": "1.15.3",
3
+ "version": "2.0.1",
4
4
  "description": "UI gdx",
5
5
  "main": "index.js",
6
6
  "module": "index.js",
@@ -0,0 +1,32 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports["default"] = exports.BoxDefault = void 0;
7
+ var _react = _interopRequireDefault(require("react"));
8
+ var _Box = require("../../components/box/Box");
9
+ function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
10
+ var _default = exports["default"] = {
11
+ title: 'Layout/Box',
12
+ component: _Box.Box,
13
+ parameters: {
14
+ layout: 'centered'
15
+ },
16
+ tags: ['autodocs']
17
+ };
18
+ var BoxDefault = exports.BoxDefault = {
19
+ args: {
20
+ color: 'primary',
21
+ open: true,
22
+ collapsible: true,
23
+ isLoading: false
24
+ },
25
+ render: function render(args) {
26
+ return /*#__PURE__*/_react["default"].createElement("div", {
27
+ style: {
28
+ width: '400px'
29
+ }
30
+ }, /*#__PURE__*/_react["default"].createElement(_Box.Box, args, /*#__PURE__*/_react["default"].createElement(_Box.BoxHeader, null, "Box Header"), /*#__PURE__*/_react["default"].createElement(_Box.BoxContent, null, "The content of the box goes here. ", /*#__PURE__*/_react["default"].createElement("br", null), "The content of the box goes here. ", /*#__PURE__*/_react["default"].createElement("br", null), "The content of the box goes here. ", /*#__PURE__*/_react["default"].createElement("br", null))));
31
+ }
32
+ };
@@ -0,0 +1,26 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports["default"] = exports.BoxDefault = void 0;
7
+ var _react = _interopRequireDefault(require("react"));
8
+ var _Box = require("../../components/box/Box");
9
+ var _components = require("../../components");
10
+ function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
11
+ var _default = exports["default"] = {
12
+ title: 'Editable/Editable',
13
+ component: _components.Editable,
14
+ parameters: {
15
+ layout: 'centered'
16
+ },
17
+ tags: ['autodocs']
18
+ };
19
+ var BoxDefault = exports.BoxDefault = {
20
+ args: {
21
+ placeHolder: 'Click to edit'
22
+ },
23
+ render: function render(args) {
24
+ return /*#__PURE__*/_react["default"].createElement(_components.Editable, args, "Hola mundo");
25
+ }
26
+ };
@@ -0,0 +1,33 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports["default"] = exports.BoxDefault = void 0;
7
+ var _react = _interopRequireDefault(require("react"));
8
+ var _Box = require("../../components/box/Box");
9
+ var _components = require("../../components");
10
+ var _HTMLEditor = _interopRequireDefault(require("../../components/editor/HTMLEditor"));
11
+ function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
12
+ var _default = exports["default"] = {
13
+ title: 'Editable/HTMLEditor',
14
+ component: _HTMLEditor["default"],
15
+ parameters: {
16
+ layout: 'centered'
17
+ },
18
+ tags: ['autodocs']
19
+ };
20
+ var BoxDefault = exports.BoxDefault = {
21
+ args: {
22
+ content: 'Click to edit',
23
+ error: undefined,
24
+ height: 200
25
+ },
26
+ render: function render(args) {
27
+ return /*#__PURE__*/_react["default"].createElement("div", {
28
+ style: {
29
+ width: '600px'
30
+ }
31
+ }, /*#__PURE__*/_react["default"].createElement(_HTMLEditor["default"], args));
32
+ }
33
+ };