@oliasoft-open-source/react-ui-library 3.3.23 → 3.4.1

package/dist/index.js

@@ -10,6 +10,7 @@ import * as PropTypes from "prop-types";
 import PropTypes__default from "prop-types";
 import { jsx, jsxs, Fragment as Fragment$1 } from "react/jsx-runtime";
 import ReactDOM, { createPortal, unstable_batchedUpdates, findDOMNode as findDOMNode$2, render } from "react-dom";
+import { validateNumber, validNumberSchema, toNum } from "@oliasoft-open-source/units";
 const global$2 = "";
 var commonjsGlobal = typeof globalThis !== "undefined" ? globalThis : typeof window !== "undefined" ? window : typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : {};
 function getDefaultExportFromCjs(x2) {
@@ -70602,6 +70603,135 @@ Tree.propTypes = {
   testId: PropTypes__default.string,
   isInitialOpen: PropTypes__default.bool
 };
+const NumberInput = ({
+  name: name2,
+  placeholder: placeholder3,
+  disabled: disabled2,
+  error: error2,
+  left: left2,
+  small: small2,
+  width,
+  value,
+  onChange,
+  onClick,
+  onFocus,
+  testId,
+  warning: warning2,
+  validationCallback,
+  allowEmpty
+}) => {
+  const [displayValue, setDisplayValue] = useState(value);
+  const [validationError, setValidationError] = useState(null);
+  const stringName = (name2 == null ? void 0 : name2.fieldName) || name2;
+  const validateInputValue = (value2) => {
+    let validation = validateNumber(value2, validNumberSchema);
+    if (allowEmpty && value2 === "" || validation.valid) {
+      return {
+        ...validation,
+        valid: true,
+        errors: void 0
+      };
+    } else {
+      return validation;
+    }
+  };
+  useEffect(() => {
+    const {
+      valid,
+      errors
+    } = validateInputValue(value);
+    if (valid) {
+      setValidationError(null);
+      validationCallback(name2, null);
+    } else {
+      setValidationError(errors[0]);
+      validationCallback(name2, errors[0]);
+    }
+  }, [value, error2]);
+  const onSetValue = (evt) => {
+    const input2 = evt.target;
+    const {
+      value: inputValue
+    } = input2;
+    const {
+      valid,
+      errors
+    } = validateInputValue(inputValue);
+    if (valid) {
+      const newValue = toNum(inputValue);
+      onChange({
+        target: {
+          value: newValue,
+          name: name2
+        }
+      });
+      setDisplayValue(inputValue);
+      setValidationError(null);
+      validationCallback(name2, null);
+    } else {
+      setDisplayValue(inputValue);
+      setValidationError(errors[0]);
+      validationCallback(name2, errors[0]);
+    }
+  };
+  return /* @__PURE__ */ jsx(Input$1, {
+    type: "text",
+    name: stringName,
+    testId,
+    disabled: disabled2,
+    placeholder: placeholder3,
+    onClick: (ev) => {
+      ev.stopPropagation();
+      return onClick && onClick(ev);
+    },
+    value: displayValue,
+    onChange: onSetValue,
+    onFocus,
+    error: error2 || validationError,
+    warning: warning2,
+    right: !left2,
+    small: small2,
+    width
+  }, stringName);
+};
+NumberInput.defaultProps = {
+  disabled: false,
+  error: false,
+  left: false,
+  onClick: () => {
+  },
+  onFocus: () => {
+  },
+  onChange: () => {
+  },
+  placeholder: "",
+  small: false,
+  width: "100%",
+  testId: void 0,
+  value: void 0,
+  validationCallback: () => {
+  },
+  allowEmpty: false,
+  name: void 0,
+  warning: false
+};
+NumberInput.propTypes = {
+  disabled: PropTypes__default.bool,
+  error: PropTypes__default.oneOfType([PropTypes__default.string, PropTypes__default.oneOf([false])]),
+  left: PropTypes__default.bool,
+  name: PropTypes__default.oneOfType([PropTypes__default.string, PropTypes__default.object]),
+  onChange: PropTypes__default.func,
+  onClick: PropTypes__default.func,
+  onFocus: PropTypes__default.func,
+  placeholder: PropTypes__default.string,
+  small: PropTypes__default.bool,
+  value: PropTypes__default.oneOfType([PropTypes__default.string, PropTypes__default.number]),
+  width: PropTypes__default.oneOfType([PropTypes__default.string, PropTypes__default.number]),
+  testId: PropTypes__default.string,
+  warning: PropTypes__default.oneOfType([PropTypes__default.string, PropTypes__default.oneOf([false])]),
+  validationCallback: PropTypes__default.func,
+  allowEmpty: PropTypes__default.bool
+};
 export {
   Accordion,
   AccordionWithDefaultToggle,
@@ -70638,6 +70768,7 @@ export {
   Message,
   Modal,
   NativeSelect,
+  NumberInput,
   OptionDropdown,
   Page,
   Pagination,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oliasoft-open-source/react-ui-library",
-  "version": "3.3.23",
+  "version": "3.4.1",
   "description": "Reusable UI components for React projects",
   "homepage": "https://oliasoft-open-source.gitlab.io/react-ui-library",
   "bugs": {
@@ -70,6 +70,7 @@
     "styled-components": "^5.3.1"
   },
   "devDependencies": {
+    "@oliasoft-open-source/units": "^2.6.1",
     "@storybook/addon-actions": "^6.5.10",
     "@storybook/addon-essentials": "^6.5.10",
     "@storybook/addon-links": "^6.5.13",
@@ -112,6 +113,7 @@
     "vitest": "^0.25.1"
   },
   "peerDependencies": {
+    "@oliasoft-open-source/units": "^2.6.1",
     "immer": "^9",
     "prop-types": "^15",
     "react": "^17",