@oliasoft-open-source/react-ui-library 3.4.2 → 3.5.1

package/dist/index.js

@@ -61950,6 +61950,137 @@ const styles$7 = {
   popover,
   disabledPointerEvents
 };
+const NumberInput = ({
+  name: name2,
+  placeholder: placeholder3,
+  disabled: disabled2,
+  error: error2,
+  left: left2,
+  small: small2,
+  width,
+  value,
+  onChange,
+  onClick,
+  onFocus,
+  testId,
+  warning: warning2,
+  validationCallback,
+  allowEmpty,
+  isInTable: isInTable2
+}) => {
+  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);
+    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,
+    isInTable: isInTable2
+  }, 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
+};
 const getCellAlignment = (alignment, styles2, isGetText = false) => {
   if (!alignment) {
     return null;
@@ -61990,6 +62121,29 @@ const getHeaderAlignment = (alignments, isHeader, rowIndex) => {
     return [];
   }
 };
+const NumberInputCell = (props) => {
+  const {
+    cell: cell2,
+    columnAlignment,
+    testId
+  } = props;
+  return /* @__PURE__ */ jsx(NumberInput, {
+    name: cell2.name,
+    value: cell2.value,
+    onChange: (ev) => cell2.onChange(ev),
+    placeholder: cell2.placeholder,
+    error: cell2.error,
+    warning: cell2.warning,
+    disabled: cell2.disabled,
+    isInTable: true,
+    left: cell2.left,
+    testId,
+    tabIndex: cell2.disabled ? -1 : 0,
+    tooltip: cell2.tooltip,
+    validationCallback: cell2.validationCallback,
+    allowEmpty: cell2.allowEmpty
+  });
+};
 const InputCell = (props) => {
   const {
     cell: cell2,
@@ -62273,6 +62427,10 @@ const InputCellWrapper = (props) => {
       cell: cell2,
       columnAlignment,
       testId
+    }) : cell2.type === "NumberInput" ? /* @__PURE__ */ jsx(NumberInputCell, {
+      cell: cell2,
+      columnAlignment,
+      testId
     }) : cell2.type === "Select" ? /* @__PURE__ */ jsx(SelectCell, {
       cell: cell2,
       columnAlignment,
@@ -62290,6 +62448,7 @@ const CellWrapper = (props) => {
   if (cell2) {
     switch (cell2.type) {
       case "Input":
+      case "NumberInput":
       case "Select":
         return /* @__PURE__ */ jsx(InputCellWrapper, {
           cell: cell2,
@@ -62353,7 +62512,7 @@ const Cell = (props) => {
   };
   const cellAlignmentStyle = getCellAlignment(alignment, styles$7);
   const cellAlignmentText = getCellAlignment(alignment, styles$7, true);
-  const className = cx$2(styles$7.cellWrapper, cell2.type === "Input" || cell2.type === "Select" || cell2.type === "Popover" ? styles$7.inputCell : "", cell2.type === "Slider" ? styles$7.sliderCell : "", cell2.type === "CheckBox" ? styles$7.checkBoxCell : "", cell2.type === "Actions" ? styles$7.actionsCell : "", cell2.type === "Icon" ? styles$7.iconCell : "", cell2.type === "Static" || cell2.type === "Link" || !cell2.type ? styles$7.staticCell : "", cell2.hasSort ? styles$7.sortingCell : null, cellAlignmentStyle, cell2.breakWord ? styles$7.breakWord : "");
+  const className = cx$2(styles$7.cellWrapper, cell2.type === "Input" || cell2.type === "NumberInput" || cell2.type === "Select" || cell2.type === "Popover" ? styles$7.inputCell : "", cell2.type === "Slider" ? styles$7.sliderCell : "", cell2.type === "CheckBox" ? styles$7.checkBoxCell : "", cell2.type === "Actions" ? styles$7.actionsCell : "", cell2.type === "Icon" ? styles$7.iconCell : "", cell2.type === "Static" || cell2.type === "Link" || !cell2.type ? styles$7.staticCell : "", cell2.hasSort ? styles$7.sortingCell : null, cellAlignmentStyle, cell2.breakWord ? styles$7.breakWord : "");
   const isWidthCustomSelect = cell2.type === "Select" && cell2.native !== true && cell2.width !== void 0;
   return isHeader ? /* @__PURE__ */ jsx("th", {
     className,
@@ -62397,7 +62556,7 @@ const Cell = (props) => {
     })
   });
 };
-const cellType = PropTypes__default.oneOf(["Static", "Icon", "Select", "Input", "Popover", "CheckBox", "Actions", "Link", "Unit"]);
+const cellType = PropTypes__default.oneOf(["Static", "Icon", "Select", "Input", "NumberInput", "Popover", "CheckBox", "Actions", "Link", "Unit"]);
 const cellShape = PropTypes__default.oneOfType([PropTypes__default.shape({
   value: PropTypes__default.oneOfType([PropTypes__default.string, PropTypes__default.number]),
   type: cellType,
@@ -62447,14 +62606,25 @@ const cellShape = PropTypes__default.oneOfType([PropTypes__default.shape({
   placeholder: PropTypes__default.oneOfType([PropTypes__default.string, PropTypes__default.number]),
   error: PropTypes__default.oneOfType([PropTypes__default.string, PropTypes__default.number, PropTypes__default.node]),
   warning: PropTypes__default.oneOfType([PropTypes__default.string, PropTypes__default.number, PropTypes__default.node]),
+  disabled: PropTypes__default.bool,
   tooltip: PropTypes__default.oneOfType([PropTypes__default.string, PropTypes__default.number, PropTypes__default.node]),
-  hasSort: PropTypes__default.bool,
-  sort: PropTypes__default.oneOf(["", "up", "down"]),
-  sortPriority: PropTypes__default.number,
-  onSort: PropTypes__default.func,
   colSpan: PropTypes__default.number,
   maxTooltipWidth: PropTypes__default.oneOfType([PropTypes__default.string, PropTypes__default.number]),
   testId: PropTypes__default.string
+}), PropTypes__default.shape({
+  name: PropTypes__default.string,
+  value: PropTypes__default.oneOfType([PropTypes__default.string, PropTypes__default.number]),
+  type: cellType.isRequired,
+  onChange: PropTypes__default.func,
+  placeholder: PropTypes__default.oneOfType([PropTypes__default.string, PropTypes__default.number]),
+  error: PropTypes__default.oneOfType([PropTypes__default.string, PropTypes__default.number, PropTypes__default.node]),
+  warning: PropTypes__default.oneOfType([PropTypes__default.string, PropTypes__default.number, PropTypes__default.node]),
+  disabled: PropTypes__default.bool,
+  tooltip: PropTypes__default.oneOfType([PropTypes__default.string, PropTypes__default.number, PropTypes__default.node]),
+  left: PropTypes__default.bool,
+  testId: PropTypes__default.string,
+  validationCallback: PropTypes__default.func,
+  allowEmpty: PropTypes__default.bool
 }), PropTypes__default.shape({
   label: PropTypes__default.oneOfType([PropTypes__default.string, PropTypes__default.number]),
   checked: PropTypes__default.bool,
@@ -70603,135 +70773,6 @@ 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);
-    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,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oliasoft-open-source/react-ui-library",
-  "version": "3.4.2",
+  "version": "3.5.1",
   "description": "Reusable UI components for React projects",
   "homepage": "https://oliasoft-open-source.gitlab.io/react-ui-library",
   "bugs": {