@symply.io/basic-components 1.5.5-alpha.6 → 1.5.5-alpha.7

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 (5) hide show
  1. package/NumberInput/index.js +2 -2
  2. package/NumberInput/types.d.ts +1 -2
  3. package/NumberInput/useInteractions.d.ts +0 -1
  4. package/NumberInput/useInteractions.js +5 -11
  5. package/package.json +1 -1
package/NumberInput/index.js CHANGED
@@ -40,8 +40,8 @@ function NumberInput(props) {
40
40
  decimals: decimals,
41
41
  integerOnly: integerOnly,
42
42
  onChange: onChange
43
- }), typing = _f.typing, exceedError = _f.exceedError, tooltipOpen = _f.tooltipOpen, roundedValue = _f.roundedValue, handleBlur = _f.handleBlur, handleFocus = _f.handleFocus, handleClick = _f.handleClick, handleChange = _f.handleChange, onOpenTooltip = _f.onOpenTooltip, onCloseTooltip = _f.onCloseTooltip, handleKeyboardEvent = _f.handleKeyboardEvent;
43
+ }), typing = _f.typing, exceedError = _f.exceedError, tooltipOpen = _f.tooltipOpen, roundedValue = _f.roundedValue, handleBlur = _f.handleBlur, handleFocus = _f.handleFocus, handleChange = _f.handleChange, onOpenTooltip = _f.onOpenTooltip, onCloseTooltip = _f.onCloseTooltip, handleKeyboardEvent = _f.handleKeyboardEvent;
44
44
  var valueDisplay = useMemo(function () { return (typing ? value : roundedValue); }, [typing, value, roundedValue]);
45
- return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsx(Tooltip, __assign({ arrow: true, placement: "top", title: tooltip !== null && tooltip !== void 0 ? tooltip : "", open: !!tooltip && tooltipOpen }, { children: _jsx(Field, __assign({ size: size, margin: "dense", type: "number", value: value === undefined || value === null ? "" : valueDisplay, onMouseEnter: onOpenTooltip, onMouseLeave: onCloseTooltip, onBlur: handleBlur, onFocus: handleFocus, onChange: handleChange, error: error || exceedError, helperText: helperText || (exceedError ? EXCEED_ERROR : ""), inputProps: { onKeyDown: handleKeyboardEvent, onClick: handleClick } }, rest)) })) })));
45
+ return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsx(Tooltip, __assign({ arrow: true, placement: "top", title: tooltip !== null && tooltip !== void 0 ? tooltip : "", open: !!tooltip && tooltipOpen }, { children: _jsx(Field, __assign({ size: size, margin: "dense", type: "text", value: value === undefined || value === null ? "" : valueDisplay, onMouseEnter: onOpenTooltip, onMouseLeave: onCloseTooltip, onBlur: handleBlur, onFocus: handleFocus, onChange: handleChange, error: error || exceedError, helperText: helperText || (exceedError ? EXCEED_ERROR : ""), inputProps: { onKeyDown: handleKeyboardEvent } }, rest)) })) })));
46
46
  }
47
47
  export default NumberInput;
package/NumberInput/types.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import { CSSProperties, ChangeEvent, MouseEventHandler, FocusEventHandler, KeyboardEventHandler } from "react";
1
+ import { CSSProperties, ChangeEvent, FocusEventHandler, KeyboardEventHandler } from "react";
2
2
  import { TextFieldProps } from "@mui/material/TextField";
3
3
  export interface InteractionStates {
4
4
  typing: boolean;
@@ -7,7 +7,6 @@ export interface InteractionStates {
7
7
  roundedValue: string;
8
8
  exceedError: boolean;
9
9
  handleKeyboardEvent: KeyboardEventHandler<HTMLInputElement | HTMLTextAreaElement>;
10
- handleClick: MouseEventHandler<HTMLInputElement | HTMLTextAreaElement>;
11
10
  handleChange: (event: ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => void;
12
11
  handleFocus: FocusEventHandler<HTMLInputElement | HTMLTextAreaElement>;
13
12
  handleBlur: FocusEventHandler<HTMLInputElement | HTMLTextAreaElement>;
package/NumberInput/useInteractions.d.ts CHANGED
@@ -7,7 +7,6 @@ declare function useInteractions(props: InteractionProps): {
7
7
  roundedValue: string;
8
8
  handleBlur: import("react").FocusEventHandler<HTMLInputElement | HTMLTextAreaElement>;
9
9
  handleFocus: import("react").FocusEventHandler<HTMLInputElement | HTMLTextAreaElement>;
10
- handleClick: import("react").MouseEventHandler<HTMLInputElement | HTMLTextAreaElement>;
11
10
  handleChange: (event: import("react").ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => void;
12
11
  onOpenTooltip: () => void;
13
12
  onCloseTooltip: () => void;
package/NumberInput/useInteractions.js CHANGED
@@ -26,7 +26,7 @@ function useInteractions(props) {
26
26
  }, [value, decimals]);
27
27
  var exceedError = useMemo(function () { return !!value && (Number(value) < minValue || Number(value) > maxValue); }, [value, minValue, maxValue]);
28
28
  var handleKeyboardEvent = useCallback(function (event) {
29
- var key = event.key;
29
+ var key = event.key, currentTarget = event.currentTarget;
30
30
  if (key === "e") {
31
31
  event.preventDefault();
32
32
  }
@@ -43,14 +43,16 @@ function useInteractions(props) {
43
43
  event.preventDefault();
44
44
  }
45
45
  else if (String(value).includes(".") && decimals > 0) {
46
+ var selectionStart = currentTarget.selectionStart;
46
47
  var decimalPointIndex = String(value).lastIndexOf(".");
47
48
  var decimalStrLen = String(value).split(".")[1].length;
48
49
  console.log({
49
50
  cursorIndex: cursorIndex,
50
51
  decimalPointIndex: decimalPointIndex,
51
- decimalStrLen: decimalStrLen
52
+ decimalStrLen: decimalStrLen,
53
+ selectionStart: selectionStart
52
54
  });
53
- if (cursorIndex && decimalPointIndex <= cursorIndex) {
55
+ if (selectionStart && decimalPointIndex <= selectionStart) {
54
56
  if (![
55
57
  "Backspace",
56
58
  "ArrowUp",
@@ -78,13 +80,6 @@ function useInteractions(props) {
78
80
  return;
79
81
  onChange(val);
80
82
  }, [onChange, minValue, integerOnly]);
81
- var handleClick = useCallback(function (event) {
82
- console.log({
83
- cts: event.currentTarget.selectionStart,
84
- cte: event.currentTarget.selectionEnd
85
- });
86
- event.currentTarget.setSelectionRange(value.length - 1, value.length - 1);
87
- }, [value]);
88
83
  var handleFocus = useCallback(function () {
89
84
  setTyping(true);
90
85
  }, []);
@@ -122,7 +117,6 @@ function useInteractions(props) {
122
117
  roundedValue: roundedValue,
123
118
  handleBlur: handleBlur,
124
119
  handleFocus: handleFocus,
125
- handleClick: handleClick,
126
120
  handleChange: handleChange,
127
121
  onOpenTooltip: onOpenTooltip,
128
122
  onCloseTooltip: onCloseTooltip,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@symply.io/basic-components",
3
- "version": "1.5.5-alpha.6",
3
+ "version": "1.5.5-alpha.7",
4
4
  "description": "Basic and reusable components for all frontend of Symply apps",
5
5
  "keywords": [
6
6
  "react",