@tecsinapse/cortex-react 1.7.0-beta.0 → 1.7.0-beta.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.
Files changed (49) hide show
  1. package/dist/cjs/components/Avatar.js +3 -2
  2. package/dist/cjs/components/DatePicker/DatePickerInput.js +4 -4
  3. package/dist/cjs/components/DatePicker/DateRangePickerInput.js +7 -7
  4. package/dist/cjs/components/Input/index.js +2 -0
  5. package/dist/cjs/components/Input/masks.js +4 -2
  6. package/dist/cjs/components/Popover/Provider.js +2 -2
  7. package/dist/cjs/components/Popover/Trigger.js +3 -2
  8. package/dist/cjs/components/Tooltip.js +13 -10
  9. package/dist/cjs/hooks/useCalendar.js +4 -3
  10. package/dist/cjs/hooks/useDatePickerInput.js +3 -3
  11. package/dist/cjs/hooks/useDateRangePickerInput.js +5 -5
  12. package/dist/cjs/hooks/{useFloatingLogic.js → useFloatingElement.js} +8 -12
  13. package/dist/cjs/hooks/useNumberMask.js +3 -2
  14. package/dist/cjs/hooks/useRangeCalendar.js +5 -5
  15. package/dist/cjs/index.js +2 -2
  16. package/dist/cjs/{components/utils.js → utils/date.js} +0 -14
  17. package/dist/cjs/utils/react.js +9 -0
  18. package/dist/cjs/utils/string.js +12 -0
  19. package/dist/esm/components/Avatar.js +2 -1
  20. package/dist/esm/components/DatePicker/DatePickerInput.js +3 -3
  21. package/dist/esm/components/DatePicker/DateRangePickerInput.js +3 -3
  22. package/dist/esm/components/Input/index.js +2 -0
  23. package/dist/esm/components/Input/masks.js +3 -1
  24. package/dist/esm/components/Popover/Provider.js +2 -2
  25. package/dist/esm/components/Popover/Trigger.js +2 -1
  26. package/dist/esm/components/Tooltip.js +10 -7
  27. package/dist/esm/hooks/useCalendar.js +2 -1
  28. package/dist/esm/hooks/useDatePickerInput.js +1 -1
  29. package/dist/esm/hooks/useDateRangePickerInput.js +1 -1
  30. package/dist/esm/hooks/{useFloatingLogic.js → useFloatingElement.js} +8 -12
  31. package/dist/esm/hooks/useNumberMask.js +2 -1
  32. package/dist/esm/hooks/useRangeCalendar.js +1 -1
  33. package/dist/esm/index.js +1 -1
  34. package/dist/esm/utils/date.js +14 -0
  35. package/dist/esm/utils/react.js +7 -0
  36. package/dist/esm/utils/string.js +10 -0
  37. package/dist/types/components/Tooltip.d.ts +2 -0
  38. package/dist/types/hooks/index.d.ts +1 -1
  39. package/dist/types/hooks/{useFloatingLogic.d.ts → useFloatingElement.d.ts} +8 -6
  40. package/dist/types/utils/date.d.ts +3 -0
  41. package/dist/types/utils/index.d.ts +4 -1
  42. package/dist/types/utils/react.d.ts +2 -0
  43. package/dist/types/utils/string.d.ts +1 -0
  44. package/package.json +3 -3
  45. package/dist/esm/components/utils.js +0 -26
  46. package/dist/types/components/utils.d.ts +0 -6
  47. /package/dist/cjs/utils/{extractNumbersFromString.js → extractors.js} +0 -0
  48. /package/dist/esm/utils/{extractNumbersFromString.js → extractors.js} +0 -0
  49. /package/dist/types/utils/{extractNumbersFromString.d.ts → extractors.d.ts} +0 -0
@@ -2,7 +2,8 @@
2
2
 
3
3
  var clsx = require('clsx');
4
4
  var React = require('react');
5
- var utils = require('./utils.js');
5
+ require('@internationalized/date');
6
+ var string = require('../utils/string.js');
6
7
 
7
8
  const Avatar = ({ src, name, className, ...rest }) => {
8
9
  const [hasError, setHasError] = React.useState(false);
@@ -27,7 +28,7 @@ const Avatar = ({ src, name, className, ...rest }) => {
27
28
  onError: () => setHasError(true),
28
29
  "data-testid": "avatar-img"
29
30
  }
30
- ) : /* @__PURE__ */ React.createElement("p", { className: "font-bold text-white text-base", "data-testid": "avatar-p" }, utils.getNameInitials(name))
31
+ ) : /* @__PURE__ */ React.createElement("p", { className: "font-bold text-white text-base", "data-testid": "avatar-p" }, string.getNameInitials(name))
31
32
  );
32
33
  };
33
34
 
@@ -4,18 +4,18 @@ var React = require('react');
4
4
  require('@internationalized/date');
5
5
  require('react-aria');
6
6
  require('react-stately');
7
- var utils = require('../utils.js');
7
+ var date = require('../../utils/date.js');
8
8
  var useDatePickerInput = require('../../hooks/useDatePickerInput.js');
9
9
  require('@floating-ui/react');
10
10
  require('currency.js');
11
11
  require('react-dropzone');
12
12
  require('uuid');
13
13
  var Calendar = require('../Calendar/Calendar.js');
14
- var DateField = require('./DateField.js');
15
- var DatePickerInputBase = require('./DatePickerInputBase.js');
16
14
  var index = require('../Popover/index.js');
17
15
  var Context = require('../Popover/Context.js');
18
16
  var Content = require('./Content.js');
17
+ var DateField = require('./DateField.js');
18
+ var DatePickerInputBase = require('./DatePickerInputBase.js');
19
19
 
20
20
  const DatePickerInputWithPopover = (props) => {
21
21
  const { setIsOpen } = Context.usePopoverContext();
@@ -45,7 +45,7 @@ const DatePickerInputWithPopover = (props) => {
45
45
  value,
46
46
  onChange: (value2) => {
47
47
  setIsOpen(false);
48
- state.setDateValue(utils.dateToCalendarDate(value2));
48
+ state.setDateValue(date.dateToCalendarDate(value2));
49
49
  }
50
50
  }
51
51
  )));
@@ -4,18 +4,18 @@ var React = require('react');
4
4
  require('@internationalized/date');
5
5
  require('react-aria');
6
6
  require('react-stately');
7
- var utils = require('../utils.js');
7
+ var date = require('../../utils/date.js');
8
8
  var useDateRangePickerInput = require('../../hooks/useDateRangePickerInput.js');
9
9
  require('@floating-ui/react');
10
10
  require('currency.js');
11
11
  require('react-dropzone');
12
12
  require('uuid');
13
13
  var RangeCalendar = require('../Calendar/RangeCalendar.js');
14
- var DateField = require('./DateField.js');
15
- var DatePickerInputBase = require('./DatePickerInputBase.js');
16
14
  var index = require('../Popover/index.js');
17
15
  var Context = require('../Popover/Context.js');
18
16
  var Content = require('./Content.js');
17
+ var DateField = require('./DateField.js');
18
+ var DatePickerInputBase = require('./DatePickerInputBase.js');
19
19
 
20
20
  const DateRangePickerInputWithPopover = (props) => {
21
21
  const { setIsOpen } = Context.usePopoverContext();
@@ -34,7 +34,7 @@ const DateRangePickerInputWithPopover = (props) => {
34
34
  DateField.DateField,
35
35
  {
36
36
  ...startFieldProps,
37
- value: utils.dateToCalendarDate(value?.start),
37
+ value: date.dateToCalendarDate(value?.start),
38
38
  onChange: (value2) => {
39
39
  state.setDate("start", value2);
40
40
  }
@@ -43,7 +43,7 @@ const DateRangePickerInputWithPopover = (props) => {
43
43
  DateField.DateField,
44
44
  {
45
45
  ...endFieldProps,
46
- value: utils.dateToCalendarDate(value?.end),
46
+ value: date.dateToCalendarDate(value?.end),
47
47
  onChange: (value2) => {
48
48
  state.setDate("end", value2);
49
49
  }
@@ -56,8 +56,8 @@ const DateRangePickerInputWithPopover = (props) => {
56
56
  onChange: (value2) => {
57
57
  setIsOpen?.(false);
58
58
  state.setDateRange({
59
- start: utils.dateToCalendarDate(value2.start),
60
- end: utils.dateToCalendarDate(value2.end)
59
+ start: date.dateToCalendarDate(value2.start),
60
+ end: date.dateToCalendarDate(value2.end)
61
61
  });
62
62
  }
63
63
  }
@@ -7,6 +7,8 @@ var Mask = require('./Mask.js');
7
7
  var Right = require('./Right.js');
8
8
  var Root = require('./Root.js');
9
9
  var Search = require('./Search.js');
10
+ require('@internationalized/date');
11
+ require('react');
10
12
 
11
13
  const Input = {
12
14
  Root: Root.InputRoot,
@@ -1,6 +1,8 @@
1
1
  'use strict';
2
2
 
3
- var extractNumbersFromString = require('../../utils/extractNumbersFromString.js');
3
+ require('@internationalized/date');
4
+ var extractors = require('../../utils/extractors.js');
5
+ require('react');
4
6
 
5
7
  const ExpressionMasks = {
6
8
  CPF: "000.000.000-00",
@@ -48,7 +50,7 @@ const Masks = {
48
50
  PHONE: ["(99) 9999-9999"],
49
51
  PHONE_EXTENDED: ["(99) 99999-9999"],
50
52
  COMBINED_PHONE: (value) => {
51
- const onlyNumbers = extractNumbersFromString.extractDigitsFromString(value);
53
+ const onlyNumbers = extractors.extractDigitsFromString(value);
52
54
  const isCellPhoneExtended = onlyNumbers.length === 11;
53
55
  return value?.length <= 14 && !isCellPhoneExtended ? Masks.PHONE : Masks.PHONE_EXTENDED;
54
56
  },
@@ -4,7 +4,7 @@ var React = require('react');
4
4
  require('@internationalized/date');
5
5
  require('react-aria');
6
6
  require('react-stately');
7
- var useFloatingLogic = require('../../hooks/useFloatingLogic.js');
7
+ var useFloatingElement = require('../../hooks/useFloatingElement.js');
8
8
  require('currency.js');
9
9
  require('react-dropzone');
10
10
  require('uuid');
@@ -15,7 +15,7 @@ const PopoverProvider = ({
15
15
  placement,
16
16
  trigger
17
17
  }) => {
18
- const floatingLogic = useFloatingLogic.useFloatingLogic({ placement, trigger });
18
+ const floatingLogic = useFloatingElement.useFloatingElement({ placement, trigger });
19
19
  return /* @__PURE__ */ React.createElement(Context.Context.Provider, { value: { ...floatingLogic } }, children);
20
20
  };
21
21
 
@@ -1,12 +1,13 @@
1
1
  'use strict';
2
2
 
3
- var utils = require('../utils.js');
3
+ require('@internationalized/date');
4
+ var react = require('../../utils/react.js');
4
5
  var Context = require('./Context.js');
5
6
 
6
7
  const PopoverTrigger = ({ children }) => {
7
8
  const { triggerProps } = Context.usePopoverContext();
8
9
  const isDisabled = children.props?.disabled;
9
- return utils.cloneWithProps(children, isDisabled ? {} : triggerProps);
10
+ return react.cloneWithProps(children, isDisabled ? {} : triggerProps);
10
11
  };
11
12
 
12
13
  exports.PopoverTrigger = PopoverTrigger;
@@ -1,12 +1,12 @@
1
1
  'use strict';
2
2
 
3
- var react = require('@floating-ui/react');
3
+ var react$1 = require('@floating-ui/react');
4
4
  var React = require('react');
5
5
  require('@internationalized/date');
6
6
  require('react-aria');
7
7
  require('react-stately');
8
- var utils = require('./utils.js');
9
- var useFloatingLogic = require('../hooks/useFloatingLogic.js');
8
+ var react = require('../utils/react.js');
9
+ var useFloatingElement = require('../hooks/useFloatingElement.js');
10
10
  require('currency.js');
11
11
  require('react-dropzone');
12
12
  require('uuid');
@@ -19,7 +19,8 @@ const Tooltip = React.forwardRef(
19
19
  trigger = "hover",
20
20
  placement = "top",
21
21
  width,
22
- height
22
+ height,
23
+ delay = { open: 500, close: 0 }
23
24
  } = props;
24
25
  const arrowRef = React.useRef(null);
25
26
  const {
@@ -30,9 +31,10 @@ const Tooltip = React.forwardRef(
30
31
  strategy,
31
32
  refs,
32
33
  context,
33
- floatingStyles
34
- } = useFloatingLogic.useFloatingLogic({ placement, arrowRef, trigger });
35
- return /* @__PURE__ */ React.createElement(React.Fragment, null, utils.cloneWithProps(children, triggerProps), isOpen ? /* @__PURE__ */ React.createElement(
34
+ floatingStyles,
35
+ getFloatingProps
36
+ } = useFloatingElement.useFloatingElement({ placement, arrowRef, trigger, delay });
37
+ return /* @__PURE__ */ React.createElement(React.Fragment, null, react.cloneWithProps(children, triggerProps), isOpen ? /* @__PURE__ */ React.createElement(
36
38
  "div",
37
39
  {
38
40
  ref: ref || refs.setFloating,
@@ -44,11 +46,12 @@ const Tooltip = React.forwardRef(
44
46
  width,
45
47
  height,
46
48
  ...floatingStyles
47
- }
49
+ },
50
+ ...getFloatingProps()
48
51
  },
49
52
  text,
50
- /* @__PURE__ */ React.createElement(react.FloatingArrow, { ref: arrowRef, context, fill: "black" })
51
- ) : /* @__PURE__ */ React.createElement(React.Fragment, null));
53
+ /* @__PURE__ */ React.createElement(react$1.FloatingArrow, { ref: arrowRef, context, fill: "black" })
54
+ ) : null);
52
55
  }
53
56
  );
54
57
 
@@ -3,15 +3,16 @@
3
3
  var date = require('@internationalized/date');
4
4
  var reactAria = require('react-aria');
5
5
  var reactStately = require('react-stately');
6
- var utils = require('../components/utils.js');
6
+ var date$1 = require('../utils/date.js');
7
+ require('react');
7
8
 
8
9
  const useCalendar = ({ value, onChange }) => {
9
10
  const { locale } = reactAria.useLocale();
10
11
  const state = reactStately.useCalendarState({
11
12
  locale,
12
13
  createCalendar: date.createCalendar,
13
- defaultValue: utils.dateToCalendarDate(value),
14
- onChange: (value2) => onChange(utils.calendarDateToDate(value2))
14
+ defaultValue: date$1.dateToCalendarDate(value),
15
+ onChange: (value2) => onChange(date$1.calendarDateToDate(value2))
15
16
  });
16
17
  const { calendarProps, title } = reactAria.useCalendar({}, state);
17
18
  return {
@@ -3,16 +3,16 @@
3
3
  var React = require('react');
4
4
  var reactAria = require('react-aria');
5
5
  var reactStately = require('react-stately');
6
- var utils = require('../components/utils.js');
6
+ var date = require('../utils/date.js');
7
7
 
8
8
  const useDatePickerInput = ({
9
9
  value,
10
10
  onChange
11
11
  }) => {
12
12
  const state = reactStately.useDatePickerState({
13
- defaultValue: utils.dateToCalendarDate(value),
13
+ defaultValue: date.dateToCalendarDate(value),
14
14
  onChange: (value2) => {
15
- onChange(utils.calendarDateToDate(value2));
15
+ onChange(date.calendarDateToDate(value2));
16
16
  }
17
17
  });
18
18
  const ref = React.useRef(null);
@@ -3,7 +3,7 @@
3
3
  var React = require('react');
4
4
  var reactAria = require('react-aria');
5
5
  var reactStately = require('react-stately');
6
- var utils = require('../components/utils.js');
6
+ var date = require('../utils/date.js');
7
7
 
8
8
  const useDateRangePickerInput = ({
9
9
  value,
@@ -11,13 +11,13 @@ const useDateRangePickerInput = ({
11
11
  }) => {
12
12
  const state = reactStately.useDateRangePickerState({
13
13
  defaultValue: {
14
- start: utils.dateToCalendarDate(value?.start),
15
- end: utils.dateToCalendarDate(value?.end)
14
+ start: date.dateToCalendarDate(value?.start),
15
+ end: date.dateToCalendarDate(value?.end)
16
16
  },
17
17
  onChange: (value2) => {
18
18
  onChange({
19
- start: utils.calendarDateToDate(value2.start),
20
- end: utils.calendarDateToDate(value2.end)
19
+ start: date.calendarDateToDate(value2.start),
20
+ end: date.calendarDateToDate(value2.end)
21
21
  });
22
22
  }
23
23
  });
@@ -1,11 +1,12 @@
1
1
  'use strict';
2
2
 
3
- var React = require('react');
4
3
  var react = require('@floating-ui/react');
4
+ var React = require('react');
5
5
 
6
- const useFloatingLogic = ({
6
+ const useFloatingElement = ({
7
7
  placement,
8
8
  trigger,
9
+ delay,
9
10
  arrowRef
10
11
  }) => {
11
12
  const [isOpen, setIsOpen] = React.useState(false);
@@ -26,26 +27,21 @@ const useFloatingLogic = ({
26
27
  ]
27
28
  }
28
29
  );
29
- const click = react.useClick(context);
30
+ const click = react.useClick(context, { enabled: trigger === "click" });
30
31
  const dismiss = react.useDismiss(context);
31
32
  const role = react.useRole(context);
33
+ const hover = react.useHover(context, { enabled: trigger === "hover", delay });
32
34
  const { getReferenceProps, getFloatingProps } = react.useInteractions([
33
35
  click,
34
36
  dismiss,
35
- role
37
+ role,
38
+ hover
36
39
  ]);
37
40
  React.useEffect(() => {
38
41
  if (isOpen) update();
39
42
  }, [isOpen, update]);
40
43
  const triggerProps = {
41
44
  ref: refs.setReference,
42
- ...trigger === "hover" && {
43
- onMouseEnter: () => setIsOpen(true),
44
- onMouseLeave: () => setIsOpen(false)
45
- },
46
- ...trigger === "click" && {
47
- onClick: () => setIsOpen((prev) => !prev)
48
- },
49
45
  ...getReferenceProps()
50
46
  };
51
47
  return {
@@ -63,4 +59,4 @@ const useFloatingLogic = ({
63
59
  };
64
60
  };
65
61
 
66
- exports.useFloatingLogic = useFloatingLogic;
62
+ exports.useFloatingElement = useFloatingElement;
@@ -2,7 +2,8 @@
2
2
 
3
3
  var currency = require('currency.js');
4
4
  var React = require('react');
5
- var extractNumbersFromString = require('../utils/extractNumbersFromString.js');
5
+ require('@internationalized/date');
6
+ var extractors = require('../utils/extractors.js');
6
7
 
7
8
  const DEFAULT_OPTIONS = {
8
9
  symbol: "R$ ",
@@ -29,7 +30,7 @@ const getInternalNumberAndMask = (value, options) => {
29
30
  internalNumber = value;
30
31
  }
31
32
  } else {
32
- const onlyNumbers = String(extractNumbersFromString.extractNumbersFromString(value));
33
+ const onlyNumbers = String(extractors.extractNumbersFromString(value));
33
34
  const padZeros = String(onlyNumbers).padStart(precision + 1, "0");
34
35
  internalNumber = Number(padZeros.replace(getRegex(precision), "."));
35
36
  }
@@ -4,7 +4,7 @@ var date = require('@internationalized/date');
4
4
  var React = require('react');
5
5
  var reactAria = require('react-aria');
6
6
  var reactStately = require('react-stately');
7
- var utils = require('../components/utils.js');
7
+ var date$1 = require('../utils/date.js');
8
8
 
9
9
  const useRangeCalendar = ({
10
10
  value,
@@ -15,12 +15,12 @@ const useRangeCalendar = ({
15
15
  locale,
16
16
  createCalendar: date.createCalendar,
17
17
  defaultValue: {
18
- start: utils.dateToCalendarDate(value?.start),
19
- end: utils.dateToCalendarDate(value?.end)
18
+ start: date$1.dateToCalendarDate(value?.start),
19
+ end: date$1.dateToCalendarDate(value?.end)
20
20
  },
21
21
  onChange: (value2) => onChange({
22
- start: utils.calendarDateToDate(value2.start),
23
- end: utils.calendarDateToDate(value2.end)
22
+ start: date$1.calendarDateToDate(value2.start),
23
+ end: date$1.calendarDateToDate(value2.end)
24
24
  })
25
25
  });
26
26
  const ref = React.useRef(null);
package/dist/cjs/index.js CHANGED
@@ -46,7 +46,7 @@ var useCalendarGrid = require('./hooks/useCalendarGrid.js');
46
46
  var useDatePickerInput = require('./hooks/useDatePickerInput.js');
47
47
  var useDateRangePickerInput = require('./hooks/useDateRangePickerInput.js');
48
48
  var useDebouncedState = require('./hooks/useDebouncedState.js');
49
- var useFloatingLogic = require('./hooks/useFloatingLogic.js');
49
+ var useFloatingElement = require('./hooks/useFloatingElement.js');
50
50
  var useNumberMask = require('./hooks/useNumberMask.js');
51
51
  var useOutsideClickListener = require('./hooks/useOutsideClickListener.js');
52
52
  var useRangeCalendar = require('./hooks/useRangeCalendar.js');
@@ -120,7 +120,7 @@ exports.useCalendarGrid = useCalendarGrid.useCalendarGrid;
120
120
  exports.useDatePickerInput = useDatePickerInput.useDatePickerInput;
121
121
  exports.useDateRangePickerInput = useDateRangePickerInput.useDateRangePickerInput;
122
122
  exports.useDebouncedState = useDebouncedState.useDebouncedState;
123
- exports.useFloatingLogic = useFloatingLogic.useFloatingLogic;
123
+ exports.useFloatingElement = useFloatingElement.useFloatingElement;
124
124
  exports.getInternalNumberAndMask = useNumberMask.getInternalNumberAndMask;
125
125
  exports.useNumberMask = useNumberMask.useNumberMask;
126
126
  exports.useOutsideClickListener = useOutsideClickListener.useOutsideClickListener;
@@ -1,16 +1,7 @@
1
1
  'use strict';
2
2
 
3
3
  var date = require('@internationalized/date');
4
- var React = require('react');
5
4
 
6
- const getNameInitials = (name) => {
7
- const nameSplit = name.split(" ");
8
- const length = nameSplit.length;
9
- if (length > 1) {
10
- return `${nameSplit[0][0]}${nameSplit[length - 1][0]}`;
11
- }
12
- return name[0];
13
- };
14
5
  const dateToCalendarDate = (value) => {
15
6
  return new date.CalendarDate(
16
7
  value?.getFullYear() ?? (/* @__PURE__ */ new Date()).getFullYear(),
@@ -21,11 +12,6 @@ const dateToCalendarDate = (value) => {
21
12
  const calendarDateToDate = (value) => {
22
13
  return value.toDate(date.getLocalTimeZone());
23
14
  };
24
- function cloneWithProps(children, triggerProps) {
25
- return React.cloneElement(/* @__PURE__ */ React.createElement("div", null, children), triggerProps);
26
- }
27
15
 
28
16
  exports.calendarDateToDate = calendarDateToDate;
29
- exports.cloneWithProps = cloneWithProps;
30
17
  exports.dateToCalendarDate = dateToCalendarDate;
31
- exports.getNameInitials = getNameInitials;
@@ -0,0 +1,9 @@
1
+ 'use strict';
2
+
3
+ var React = require('react');
4
+
5
+ function cloneWithProps(children, props) {
6
+ return React.cloneElement(/* @__PURE__ */ React.createElement("div", null, children), props);
7
+ }
8
+
9
+ exports.cloneWithProps = cloneWithProps;
@@ -0,0 +1,12 @@
1
+ 'use strict';
2
+
3
+ const getNameInitials = (name) => {
4
+ const nameSplit = name.split(" ");
5
+ const length = nameSplit.length;
6
+ if (length > 1) {
7
+ return `${nameSplit[0][0]}${nameSplit[length - 1][0]}`;
8
+ }
9
+ return name[0];
10
+ };
11
+
12
+ exports.getNameInitials = getNameInitials;
@@ -1,6 +1,7 @@
1
1
  import clsx from 'clsx';
2
2
  import React__default from 'react';
3
- import { getNameInitials } from './utils.js';
3
+ import '@internationalized/date';
4
+ import { getNameInitials } from '../utils/string.js';
4
5
 
5
6
  const Avatar = ({ src, name, className, ...rest }) => {
6
7
  const [hasError, setHasError] = React__default.useState(false);
@@ -2,18 +2,18 @@ import React__default from 'react';
2
2
  import '@internationalized/date';
3
3
  import 'react-aria';
4
4
  import 'react-stately';
5
- import { dateToCalendarDate } from '../utils.js';
5
+ import { dateToCalendarDate } from '../../utils/date.js';
6
6
  import { useDatePickerInput } from '../../hooks/useDatePickerInput.js';
7
7
  import '@floating-ui/react';
8
8
  import 'currency.js';
9
9
  import 'react-dropzone';
10
10
  import 'uuid';
11
11
  import { Calendar } from '../Calendar/Calendar.js';
12
- import { DateField } from './DateField.js';
13
- import { DatePickerInputBase } from './DatePickerInputBase.js';
14
12
  import { Popover } from '../Popover/index.js';
15
13
  import { usePopoverContext } from '../Popover/Context.js';
16
14
  import { Content } from './Content.js';
15
+ import { DateField } from './DateField.js';
16
+ import { DatePickerInputBase } from './DatePickerInputBase.js';
17
17
 
18
18
  const DatePickerInputWithPopover = (props) => {
19
19
  const { setIsOpen } = usePopoverContext();
@@ -2,18 +2,18 @@ import React__default from 'react';
2
2
  import '@internationalized/date';
3
3
  import 'react-aria';
4
4
  import 'react-stately';
5
- import { dateToCalendarDate } from '../utils.js';
5
+ import { dateToCalendarDate } from '../../utils/date.js';
6
6
  import { useDateRangePickerInput } from '../../hooks/useDateRangePickerInput.js';
7
7
  import '@floating-ui/react';
8
8
  import 'currency.js';
9
9
  import 'react-dropzone';
10
10
  import 'uuid';
11
11
  import { RangeCalendar } from '../Calendar/RangeCalendar.js';
12
- import { DateField } from './DateField.js';
13
- import { DatePickerInputBase } from './DatePickerInputBase.js';
14
12
  import { Popover } from '../Popover/index.js';
15
13
  import { usePopoverContext } from '../Popover/Context.js';
16
14
  import { Content } from './Content.js';
15
+ import { DateField } from './DateField.js';
16
+ import { DatePickerInputBase } from './DatePickerInputBase.js';
17
17
 
18
18
  const DateRangePickerInputWithPopover = (props) => {
19
19
  const { setIsOpen } = usePopoverContext();
@@ -5,6 +5,8 @@ import { InputMask } from './Mask.js';
5
5
  import { InputRight } from './Right.js';
6
6
  import { InputRoot } from './Root.js';
7
7
  import { InputSearch } from './Search.js';
8
+ import '@internationalized/date';
9
+ import 'react';
8
10
 
9
11
  const Input = {
10
12
  Root: InputRoot,
@@ -1,4 +1,6 @@
1
- import { extractDigitsFromString } from '../../utils/extractNumbersFromString.js';
1
+ import '@internationalized/date';
2
+ import { extractDigitsFromString } from '../../utils/extractors.js';
3
+ import 'react';
2
4
 
3
5
  const ExpressionMasks = {
4
6
  CPF: "000.000.000-00",
@@ -2,7 +2,7 @@ import React__default from 'react';
2
2
  import '@internationalized/date';
3
3
  import 'react-aria';
4
4
  import 'react-stately';
5
- import { useFloatingLogic } from '../../hooks/useFloatingLogic.js';
5
+ import { useFloatingElement } from '../../hooks/useFloatingElement.js';
6
6
  import 'currency.js';
7
7
  import 'react-dropzone';
8
8
  import 'uuid';
@@ -13,7 +13,7 @@ const PopoverProvider = ({
13
13
  placement,
14
14
  trigger
15
15
  }) => {
16
- const floatingLogic = useFloatingLogic({ placement, trigger });
16
+ const floatingLogic = useFloatingElement({ placement, trigger });
17
17
  return /* @__PURE__ */ React__default.createElement(Context.Provider, { value: { ...floatingLogic } }, children);
18
18
  };
19
19
 
@@ -1,4 +1,5 @@
1
- import { cloneWithProps } from '../utils.js';
1
+ import '@internationalized/date';
2
+ import { cloneWithProps } from '../../utils/react.js';
2
3
  import { usePopoverContext } from './Context.js';
3
4
 
4
5
  const PopoverTrigger = ({ children }) => {
@@ -3,8 +3,8 @@ import React__default, { forwardRef, useRef } from 'react';
3
3
  import '@internationalized/date';
4
4
  import 'react-aria';
5
5
  import 'react-stately';
6
- import { cloneWithProps } from './utils.js';
7
- import { useFloatingLogic } from '../hooks/useFloatingLogic.js';
6
+ import { cloneWithProps } from '../utils/react.js';
7
+ import { useFloatingElement } from '../hooks/useFloatingElement.js';
8
8
  import 'currency.js';
9
9
  import 'react-dropzone';
10
10
  import 'uuid';
@@ -17,7 +17,8 @@ const Tooltip = forwardRef(
17
17
  trigger = "hover",
18
18
  placement = "top",
19
19
  width,
20
- height
20
+ height,
21
+ delay = { open: 500, close: 0 }
21
22
  } = props;
22
23
  const arrowRef = useRef(null);
23
24
  const {
@@ -28,8 +29,9 @@ const Tooltip = forwardRef(
28
29
  strategy,
29
30
  refs,
30
31
  context,
31
- floatingStyles
32
- } = useFloatingLogic({ placement, arrowRef, trigger });
32
+ floatingStyles,
33
+ getFloatingProps
34
+ } = useFloatingElement({ placement, arrowRef, trigger, delay });
33
35
  return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, cloneWithProps(children, triggerProps), isOpen ? /* @__PURE__ */ React__default.createElement(
34
36
  "div",
35
37
  {
@@ -42,11 +44,12 @@ const Tooltip = forwardRef(
42
44
  width,
43
45
  height,
44
46
  ...floatingStyles
45
- }
47
+ },
48
+ ...getFloatingProps()
46
49
  },
47
50
  text,
48
51
  /* @__PURE__ */ React__default.createElement(FloatingArrow, { ref: arrowRef, context, fill: "black" })
49
- ) : /* @__PURE__ */ React__default.createElement(React__default.Fragment, null));
52
+ ) : null);
50
53
  }
51
54
  );
52
55
 
@@ -1,7 +1,8 @@
1
1
  import { createCalendar } from '@internationalized/date';
2
2
  import { useLocale, useCalendar as useCalendar$1 } from 'react-aria';
3
3
  import { useCalendarState } from 'react-stately';
4
- import { dateToCalendarDate, calendarDateToDate } from '../components/utils.js';
4
+ import { dateToCalendarDate, calendarDateToDate } from '../utils/date.js';
5
+ import 'react';
5
6
 
6
7
  const useCalendar = ({ value, onChange }) => {
7
8
  const { locale } = useLocale();
@@ -1,7 +1,7 @@
1
1
  import { useRef } from 'react';
2
2
  import { useDatePicker } from 'react-aria';
3
3
  import { useDatePickerState } from 'react-stately';
4
- import { dateToCalendarDate, calendarDateToDate } from '../components/utils.js';
4
+ import { dateToCalendarDate, calendarDateToDate } from '../utils/date.js';
5
5
 
6
6
  const useDatePickerInput = ({
7
7
  value,
@@ -1,7 +1,7 @@
1
1
  import { useRef } from 'react';
2
2
  import { useDateRangePicker } from 'react-aria';
3
3
  import { useDateRangePickerState } from 'react-stately';
4
- import { dateToCalendarDate, calendarDateToDate } from '../components/utils.js';
4
+ import { dateToCalendarDate, calendarDateToDate } from '../utils/date.js';
5
5
 
6
6
  const useDateRangePickerInput = ({
7
7
  value,
@@ -1,9 +1,10 @@
1
+ import { useFloating, autoUpdate, offset, flip, shift, arrow, useClick, useDismiss, useRole, useHover, useInteractions } from '@floating-ui/react';
1
2
  import { useState, useEffect } from 'react';
2
- import { useFloating, autoUpdate, offset, flip, shift, arrow, useClick, useDismiss, useRole, useInteractions } from '@floating-ui/react';
3
3
 
4
- const useFloatingLogic = ({
4
+ const useFloatingElement = ({
5
5
  placement,
6
6
  trigger,
7
+ delay,
7
8
  arrowRef
8
9
  }) => {
9
10
  const [isOpen, setIsOpen] = useState(false);
@@ -24,26 +25,21 @@ const useFloatingLogic = ({
24
25
  ]
25
26
  }
26
27
  );
27
- const click = useClick(context);
28
+ const click = useClick(context, { enabled: trigger === "click" });
28
29
  const dismiss = useDismiss(context);
29
30
  const role = useRole(context);
31
+ const hover = useHover(context, { enabled: trigger === "hover", delay });
30
32
  const { getReferenceProps, getFloatingProps } = useInteractions([
31
33
  click,
32
34
  dismiss,
33
- role
35
+ role,
36
+ hover
34
37
  ]);
35
38
  useEffect(() => {
36
39
  if (isOpen) update();
37
40
  }, [isOpen, update]);
38
41
  const triggerProps = {
39
42
  ref: refs.setReference,
40
- ...trigger === "hover" && {
41
- onMouseEnter: () => setIsOpen(true),
42
- onMouseLeave: () => setIsOpen(false)
43
- },
44
- ...trigger === "click" && {
45
- onClick: () => setIsOpen((prev) => !prev)
46
- },
47
43
  ...getReferenceProps()
48
44
  };
49
45
  return {
@@ -61,4 +57,4 @@ const useFloatingLogic = ({
61
57
  };
62
58
  };
63
59
 
64
- export { useFloatingLogic };
60
+ export { useFloatingElement };
@@ -1,6 +1,7 @@
1
1
  import currency from 'currency.js';
2
2
  import { useCallback, useState } from 'react';
3
- import { extractNumbersFromString } from '../utils/extractNumbersFromString.js';
3
+ import '@internationalized/date';
4
+ import { extractNumbersFromString } from '../utils/extractors.js';
4
5
 
5
6
  const DEFAULT_OPTIONS = {
6
7
  symbol: "R$ ",
@@ -2,7 +2,7 @@ import { createCalendar } from '@internationalized/date';
2
2
  import { useRef } from 'react';
3
3
  import { useLocale, useRangeCalendar as useRangeCalendar$1 } from 'react-aria';
4
4
  import { useRangeCalendarState } from 'react-stately';
5
- import { dateToCalendarDate, calendarDateToDate } from '../components/utils.js';
5
+ import { dateToCalendarDate, calendarDateToDate } from '../utils/date.js';
6
6
 
7
7
  const useRangeCalendar = ({
8
8
  value,
package/dist/esm/index.js CHANGED
@@ -44,7 +44,7 @@ export { useCalendarGrid } from './hooks/useCalendarGrid.js';
44
44
  export { useDatePickerInput } from './hooks/useDatePickerInput.js';
45
45
  export { useDateRangePickerInput } from './hooks/useDateRangePickerInput.js';
46
46
  export { useDebouncedState } from './hooks/useDebouncedState.js';
47
- export { useFloatingLogic } from './hooks/useFloatingLogic.js';
47
+ export { useFloatingElement } from './hooks/useFloatingElement.js';
48
48
  export { getInternalNumberAndMask, useNumberMask } from './hooks/useNumberMask.js';
49
49
  export { useOutsideClickListener } from './hooks/useOutsideClickListener.js';
50
50
  export { useRangeCalendar } from './hooks/useRangeCalendar.js';
@@ -0,0 +1,14 @@
1
+ import { CalendarDate, getLocalTimeZone } from '@internationalized/date';
2
+
3
+ const dateToCalendarDate = (value) => {
4
+ return new CalendarDate(
5
+ value?.getFullYear() ?? (/* @__PURE__ */ new Date()).getFullYear(),
6
+ value?.getMonth() ? value.getMonth() + 1 : (/* @__PURE__ */ new Date()).getMonth() + 1,
7
+ value?.getDate() ?? (/* @__PURE__ */ new Date()).getDate()
8
+ );
9
+ };
10
+ const calendarDateToDate = (value) => {
11
+ return value.toDate(getLocalTimeZone());
12
+ };
13
+
14
+ export { calendarDateToDate, dateToCalendarDate };
@@ -0,0 +1,7 @@
1
+ import React__default from 'react';
2
+
3
+ function cloneWithProps(children, props) {
4
+ return React__default.cloneElement(/* @__PURE__ */ React__default.createElement("div", null, children), props);
5
+ }
6
+
7
+ export { cloneWithProps };
@@ -0,0 +1,10 @@
1
+ const getNameInitials = (name) => {
2
+ const nameSplit = name.split(" ");
3
+ const length = nameSplit.length;
4
+ if (length > 1) {
5
+ return `${nameSplit[0][0]}${nameSplit[length - 1][0]}`;
6
+ }
7
+ return name[0];
8
+ };
9
+
10
+ export { getNameInitials };
@@ -1,5 +1,6 @@
1
1
  import { Placement } from '@floating-ui/react';
2
2
  import React from 'react';
3
+ import { type Delay } from '../hooks';
3
4
  interface TooltipProps {
4
5
  children: React.ReactElement;
5
6
  text: string;
@@ -7,6 +8,7 @@ interface TooltipProps {
7
8
  placement?: Placement;
8
9
  width?: number;
9
10
  height?: number;
11
+ delay?: Delay;
10
12
  style?: React.CSSProperties;
11
13
  }
12
14
  export declare const Tooltip: React.ForwardRefExoticComponent<TooltipProps & React.RefAttributes<HTMLDivElement>>;
@@ -4,7 +4,7 @@ export * from './useCalendarGrid';
4
4
  export * from './useDatePickerInput';
5
5
  export * from './useDateRangePickerInput';
6
6
  export * from './useDebouncedState';
7
- export * from './useFloatingLogic';
7
+ export * from './useFloatingElement';
8
8
  export * from './useNumberMask';
9
9
  export * from './useOutsideClickListener';
10
10
  export * from './useRangeCalendar';
@@ -1,11 +1,16 @@
1
- import { RefObject } from 'react';
2
1
  import { Placement } from '@floating-ui/react';
3
- interface FloatingLogicProps {
2
+ import { RefObject } from 'react';
3
+ export type Delay = number | {
4
+ open?: number;
5
+ close?: number;
6
+ };
7
+ interface FloatingElementProps {
4
8
  placement?: Placement;
5
9
  trigger?: 'hover' | 'click';
10
+ delay?: Delay;
6
11
  arrowRef?: RefObject<SVGSVGElement>;
7
12
  }
8
- export declare const useFloatingLogic: ({ placement, trigger, arrowRef, }: FloatingLogicProps) => {
13
+ export declare const useFloatingElement: ({ placement, trigger, delay, arrowRef, }: FloatingElementProps) => {
9
14
  isOpen: boolean;
10
15
  setIsOpen: import("react").Dispatch<import("react").SetStateAction<boolean>>;
11
16
  x: number;
@@ -37,9 +42,6 @@ export declare const useFloatingLogic: ({ placement, trigger, arrowRef, }: Float
37
42
  };
38
43
  floatingStyles: import("react").CSSProperties;
39
44
  triggerProps: {
40
- onClick?: (() => void) | undefined;
41
- onMouseEnter?: (() => void) | undefined;
42
- onMouseLeave?: (() => void) | undefined;
43
45
  ref: ((node: import("@floating-ui/react-dom").ReferenceType | null) => void) & ((node: import("@floating-ui/react").ReferenceType | null) => void);
44
46
  };
45
47
  getReferenceProps: (userProps?: import("react").HTMLProps<Element> | undefined) => Record<string, unknown>;
@@ -0,0 +1,3 @@
1
+ import { CalendarDate } from '@internationalized/date';
2
+ export declare const dateToCalendarDate: (value?: Date) => CalendarDate;
3
+ export declare const calendarDateToDate: (value: CalendarDate) => Date;
@@ -1 +1,4 @@
1
- export * from './extractNumbersFromString';
1
+ export * from './date';
2
+ export * from './extractors';
3
+ export * from './react';
4
+ export * from './string';
@@ -0,0 +1,2 @@
1
+ import React from 'react';
2
+ export declare function cloneWithProps(children: React.ReactElement, props: any): React.FunctionComponentElement<any>;
@@ -0,0 +1 @@
1
+ export declare const getNameInitials: (name: string) => string;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tecsinapse/cortex-react",
3
- "version": "1.7.0-beta.0",
3
+ "version": "1.7.0-beta.2",
4
4
  "description": "React components based in @tecsinapse/cortex-core",
5
5
  "license": "MIT",
6
6
  "main": "dist/esm/index.js",
@@ -20,7 +20,7 @@
20
20
  "dependencies": {
21
21
  "@floating-ui/react": "^0.26.18",
22
22
  "@internationalized/date": "*",
23
- "@tecsinapse/cortex-core": "0.4.0-beta.0",
23
+ "@tecsinapse/cortex-core": "0.4.0-beta.1",
24
24
  "clsx": "*",
25
25
  "currency.js": "~2.0.4",
26
26
  "react-aria": "^3.33.1",
@@ -48,5 +48,5 @@
48
48
  "react-dom": ">=18.0.0",
49
49
  "tailwind": ">=3.3.0"
50
50
  },
51
- "gitHead": "5031f62ebd62cf2e07f26aec3ca08eebf6d3d11c"
51
+ "gitHead": "5f1743019ab6fa1d0cb67905737d89bc42f20a2a"
52
52
  }
@@ -1,26 +0,0 @@
1
- import { CalendarDate, getLocalTimeZone } from '@internationalized/date';
2
- import React__default from 'react';
3
-
4
- const getNameInitials = (name) => {
5
- const nameSplit = name.split(" ");
6
- const length = nameSplit.length;
7
- if (length > 1) {
8
- return `${nameSplit[0][0]}${nameSplit[length - 1][0]}`;
9
- }
10
- return name[0];
11
- };
12
- const dateToCalendarDate = (value) => {
13
- return new CalendarDate(
14
- value?.getFullYear() ?? (/* @__PURE__ */ new Date()).getFullYear(),
15
- value?.getMonth() ? value.getMonth() + 1 : (/* @__PURE__ */ new Date()).getMonth() + 1,
16
- value?.getDate() ?? (/* @__PURE__ */ new Date()).getDate()
17
- );
18
- };
19
- const calendarDateToDate = (value) => {
20
- return value.toDate(getLocalTimeZone());
21
- };
22
- function cloneWithProps(children, triggerProps) {
23
- return React__default.cloneElement(/* @__PURE__ */ React__default.createElement("div", null, children), triggerProps);
24
- }
25
-
26
- export { calendarDateToDate, cloneWithProps, dateToCalendarDate, getNameInitials };
@@ -1,6 +0,0 @@
1
- import { CalendarDate } from '@internationalized/date';
2
- import React from 'react';
3
- export declare const getNameInitials: (name: string) => string;
4
- export declare const dateToCalendarDate: (value?: Date) => CalendarDate;
5
- export declare const calendarDateToDate: (value: CalendarDate) => Date;
6
- export declare function cloneWithProps(children: React.ReactElement, triggerProps: any): React.FunctionComponentElement<any>;