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

package/NumberInput/index.js

@@ -40,8 +40,8 @@ function NumberInput(props) {
         decimals: decimals,
         integerOnly: integerOnly,
         onChange: onChange
-    }), 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;
+    }), 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;
     var valueDisplay = useMemo(function () { return (typing ? value : roundedValue); }, [typing, value, roundedValue]);
-    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)) })) })));
+    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)) })) })));
 }
 export default NumberInput;

package/NumberInput/types.d.ts

@@ -1,4 +1,4 @@
-import { CSSProperties, ChangeEvent, MouseEventHandler, FocusEventHandler, KeyboardEventHandler } from "react";
+import { CSSProperties, ChangeEvent, FocusEventHandler, KeyboardEventHandler } from "react";
 import { TextFieldProps } from "@mui/material/TextField";
 export interface InteractionStates {
     typing: boolean;
@@ -7,7 +7,6 @@ export interface InteractionStates {
     roundedValue: string;
     exceedError: boolean;
     handleKeyboardEvent: KeyboardEventHandler<HTMLInputElement | HTMLTextAreaElement>;
-    handleClick: MouseEventHandler<HTMLInputElement | HTMLTextAreaElement>;
     handleChange: (event: ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => void;
     handleFocus: FocusEventHandler<HTMLInputElement | HTMLTextAreaElement>;
     handleBlur: FocusEventHandler<HTMLInputElement | HTMLTextAreaElement>;

package/NumberInput/useInteractions.d.ts

@@ -7,7 +7,6 @@ declare function useInteractions(props: InteractionProps): {
     roundedValue: string;
     handleBlur: import("react").FocusEventHandler<HTMLInputElement | HTMLTextAreaElement>;
     handleFocus: import("react").FocusEventHandler<HTMLInputElement | HTMLTextAreaElement>;
-    handleClick: import("react").MouseEventHandler<HTMLInputElement | HTMLTextAreaElement>;
     handleChange: (event: import("react").ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => void;
     onOpenTooltip: () => void;
     onCloseTooltip: () => void;

package/NumberInput/useInteractions.js

@@ -3,7 +3,6 @@ function useInteractions(props) {
     var value = props.value, _a = props.decimals, decimals = _a === void 0 ? 0 : _a, integerOnly = props.integerOnly, _b = props.minValue, minValue = _b === void 0 ? Number.MIN_SAFE_INTEGER : _b, _c = props.maxValue, maxValue = _c === void 0 ? Number.MAX_SAFE_INTEGER : _c, onChange = props.onChange;
     var _d = useState(false), tooltipOpen = _d[0], setTooltipOpen = _d[1];
     var _e = useState(false), typing = _e[0], setTyping = _e[1];
-    var _f = useState(0), cursorIndex = _f[0], setCursorIndex = _f[1];
     var roundedValue = useMemo(function () {
         if (value === null || value === undefined) {
             return "";
@@ -26,7 +25,7 @@ function useInteractions(props) {
     }, [value, decimals]);
     var exceedError = useMemo(function () { return !!value && (Number(value) < minValue || Number(value) > maxValue); }, [value, minValue, maxValue]);
     var handleKeyboardEvent = useCallback(function (event) {
-        var key = event.key;
+        var key = event.key, currentTarget = event.currentTarget;
         if (key === "e") {
             event.preventDefault();
         }
@@ -43,14 +42,15 @@ function useInteractions(props) {
                 event.preventDefault();
             }
             else if (String(value).includes(".") && decimals > 0) {
+                var selectionStart = currentTarget.selectionStart;
                 var decimalPointIndex = String(value).lastIndexOf(".");
                 var decimalStrLen = String(value).split(".")[1].length;
                 console.log({
-                    cursorIndex: cursorIndex,
                     decimalPointIndex: decimalPointIndex,
-                    decimalStrLen: decimalStrLen
+                    decimalStrLen: decimalStrLen,
+                    selectionStart: selectionStart
                 });
-                if (cursorIndex && decimalPointIndex <= cursorIndex) {
+                if (selectionStart && decimalPointIndex < selectionStart) {
                     if (![
                         "Backspace",
                         "ArrowUp",
@@ -64,7 +64,7 @@ function useInteractions(props) {
                 }
             }
         }
-    }, [value, minValue, cursorIndex, integerOnly]);
+    }, [value, minValue, integerOnly]);
     var handleChange = useCallback(function (event) {
         event.preventDefault();
         var val = event.currentTarget.value;
@@ -78,13 +78,6 @@ function useInteractions(props) {
             return;
         onChange(val);
     }, [onChange, minValue, integerOnly]);
-    var handleClick = useCallback(function (event) {
-        console.log({
-            cts: event.currentTarget.selectionStart,
-            cte: event.currentTarget.selectionEnd
-        });
-        event.currentTarget.setSelectionRange(value.length - 1, value.length - 1);
-    }, [value]);
     var handleFocus = useCallback(function () {
         setTyping(true);
     }, []);
@@ -122,7 +115,6 @@ function useInteractions(props) {
         roundedValue: roundedValue,
         handleBlur: handleBlur,
         handleFocus: handleFocus,
-        handleClick: handleClick,
         handleChange: handleChange,
         onOpenTooltip: onOpenTooltip,
         onCloseTooltip: onCloseTooltip,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@symply.io/basic-components",
-  "version": "1.5.5-alpha.6",
+  "version": "1.5.5-beta.1",
   "description": "Basic and reusable components for all frontend of Symply apps",
   "keywords": [
     "react",