@superdispatch/ui 0.21.5-alpha.0 → 0.21.5-alpha.2

package/dist-node/index.js

@@ -11,13 +11,13 @@ var material = require('@mui/material');
 var React = require('react');
 var lab = require('@mui/lab');
 var jsxRuntime = require('react/jsx-runtime');
-var core = require('@material-ui/core');
 var styled = require('styled-components');
 var styled__default = _interopDefault(styled);
 var resizeObserver = require('@juggle/resize-observer');
 var hooks = require('@superdispatch/hooks');
 var styles = require('@mui/styles');
 var flattenChildren = _interopDefault(require('react-keyed-flatten-children'));
+var NumberFormat = _interopDefault(require('react-number-format'));
 var clsx = _interopDefault(require('clsx'));
 var system = require('@mui/system');
 
@@ -106,7 +106,7 @@ var DropdownButton = /*#__PURE__*/React.forwardRef((_ref2, ref) => {
   }
 
   return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
-    children: [/*#__PURE__*/jsxRuntime.jsxs(core.ButtonGroup, _objectSpread(_objectSpread({}, ButtonGroupProps), {}, {
+    children: [/*#__PURE__*/jsxRuntime.jsxs(material.ButtonGroup, _objectSpread(_objectSpread({}, ButtonGroupProps), {}, {
       ref: mergeRefs(ButtonGroupProps === null || ButtonGroupProps === void 0 ? void 0 : ButtonGroupProps.ref, anchorRef),
       fullWidth: (ButtonGroupProps === null || ButtonGroupProps === void 0 ? void 0 : ButtonGroupProps.fullWidth) || buttonProps.fullWidth,
       children: [/*#__PURE__*/jsxRuntime.jsx(Button, _objectSpread(_objectSpread({
@@ -126,7 +126,7 @@ var DropdownButton = /*#__PURE__*/React.forwardRef((_ref2, ref) => {
         "aria-expanded": open ? 'true' : undefined,
         children: /*#__PURE__*/jsxRuntime.jsx(CaretDownIcon, {})
       })]
-    })), /*#__PURE__*/jsxRuntime.jsx(core.Popover, {
+    })), /*#__PURE__*/jsxRuntime.jsx(material.Popover, {
       open: open,
       onClose: handleClose,
       anchorEl: anchorRef.current,
@@ -138,7 +138,7 @@ var DropdownButton = /*#__PURE__*/React.forwardRef((_ref2, ref) => {
         style: {
           minWidth: (_anchorRef$current2 = anchorRef.current) === null || _anchorRef$current2 === void 0 ? void 0 : _anchorRef$current2.clientWidth
         },
-        children: /*#__PURE__*/jsxRuntime.jsx(core.MenuList, _objectSpread(_objectSpread({}, MenuListProps), {}, {
+        children: /*#__PURE__*/jsxRuntime.jsx(material.MenuList, _objectSpread(_objectSpread({}, MenuListProps), {}, {
           id: uid,
           onClick: () => {
             setOpen(false);
@@ -1685,7 +1685,58 @@ var Inline = /*#__PURE__*/React.forwardRef((_ref2, ref) => {
 });
 if (process.env.NODE_ENV !== "production") Inline.displayName = "Inline";
 
-var _excluded$f = ["label", "error", "checked", "onBlur", "onChange", "helperText", "FormControlLabelProps"];
+var _excluded$f = ["value", "inputRef", "onChange", "isNumericString", "thousandSeparator", "disableValueParsing"],
+    _excluded2$1 = ["id", "InputProps"];
+
+function NumberInputComponent(_ref) {
+  var {
+    value,
+    inputRef,
+    onChange,
+    isNumericString = true,
+    thousandSeparator = true,
+    disableValueParsing
+  } = _ref,
+      props = _objectWithoutProperties(_ref, _excluded$f);
+
+  return /*#__PURE__*/jsxRuntime.jsx(NumberFormat, _objectSpread(_objectSpread({}, props), {}, {
+    value: value !== null && value !== void 0 ? value : '',
+    inputMode: "decimal",
+    getInputRef: inputRef,
+    isNumericString: isNumericString,
+    thousandSeparator: thousandSeparator,
+    allowedDecimalSeparators: ['.', ','],
+    onValueChange: values => {
+      var floatValue = !Number.isNaN(Number(values.floatValue)) ? values.floatValue : null;
+      var event = {
+        target: {
+          value: disableValueParsing ? values.value : floatValue
+        }
+      };
+      onChange === null || onChange === void 0 ? void 0 : onChange(event);
+    }
+  }));
+}
+
+var NumberField = /*#__PURE__*/React.forwardRef(_ref2 => {
+  var {
+    id,
+    InputProps
+  } = _ref2,
+      props = _objectWithoutProperties(_ref2, _excluded2$1);
+
+  var uid = useUID(id);
+  return /*#__PURE__*/jsxRuntime.jsx(material.TextField, _objectSpread(_objectSpread({}, props), {}, {
+    id: uid,
+    InputProps: _objectSpread(_objectSpread({}, InputProps), {}, {
+      inputComponent: NumberInputComponent
+    })
+  }));
+});
+if (process.env.NODE_ENV !== "production") NumberField.displayName = "NumberField";
+NumberField.displayName = 'NumberField';
+
+var _excluded$g = ["label", "error", "checked", "onBlur", "onChange", "helperText", "FormControlLabelProps"];
 var RadioField = /*#__PURE__*/React.forwardRef((_ref, ref) => {
   var {
     label,
@@ -1696,7 +1747,7 @@ var RadioField = /*#__PURE__*/React.forwardRef((_ref, ref) => {
     helperText,
     FormControlLabelProps: formControlLabelProps
   } = _ref,
-      props = _objectWithoutProperties(_ref, _excluded$f);
+      props = _objectWithoutProperties(_ref, _excluded$g);
 
   return /*#__PURE__*/jsxRuntime.jsxs(material.FormControl, {
     error: error,
@@ -1716,7 +1767,7 @@ var RadioField = /*#__PURE__*/React.forwardRef((_ref, ref) => {
 });
 if (process.env.NODE_ENV !== "production") RadioField.displayName = "RadioField";
 
-var _excluded$g = ["name", "value", "onChange", "RadioGroupProps", "label", "FormLabelProps", "helperText", "FormHelperTextProps", "children"];
+var _excluded$h = ["name", "value", "onChange", "RadioGroupProps", "label", "FormLabelProps", "helperText", "FormHelperTextProps", "children"];
 var RadioGroupField = /*#__PURE__*/React.forwardRef((_ref, ref) => {
   var {
     name,
@@ -1729,7 +1780,7 @@ var RadioGroupField = /*#__PURE__*/React.forwardRef((_ref, ref) => {
     FormHelperTextProps: formHelperTextProps,
     children
   } = _ref,
-      formControlProps = _objectWithoutProperties(_ref, _excluded$g);
+      formControlProps = _objectWithoutProperties(_ref, _excluded$h);
 
   return /*#__PURE__*/jsxRuntime.jsxs(material.FormControl, _objectSpread(_objectSpread({}, formControlProps), {}, {
     hiddenLabel: !label,
@@ -1779,8 +1830,8 @@ function useMinBreakpoint(minBreakpoint) {
   return minBreakpointIDX < breakpointIDX;
 }
 
-var _excluded$h = ["action", "children", "onClose", "className", "classes", "variant"],
-    _excluded2$1 = ["icon", "closeButton", "variantError", "variantSuccess"];
+var _excluded$i = ["action", "children", "onClose", "className", "classes", "variant"],
+    _excluded2$2 = ["icon", "closeButton", "variantError", "variantSuccess"];
 var useStyles$1 = /*#__PURE__*/styles.makeStyles(theme => ({
   root: {
     color: exports.Color.White,
@@ -1824,7 +1875,7 @@ var SnackbarContent = /*#__PURE__*/React.forwardRef((_ref, ref) => {
     classes,
     variant = 'default'
   } = _ref,
-      props = _objectWithoutProperties(_ref, _excluded$h);
+      props = _objectWithoutProperties(_ref, _excluded$i);
 
   var _useStyles = useStyles$1({
     classes
@@ -1835,7 +1886,7 @@ var SnackbarContent = /*#__PURE__*/React.forwardRef((_ref, ref) => {
     variantError,
     variantSuccess
   } = _useStyles,
-      styles = _objectWithoutProperties(_useStyles, _excluded2$1);
+      styles = _objectWithoutProperties(_useStyles, _excluded2$2);
 
   var Icon = variant === 'error' ? iconsMaterial.Warning : variant === 'success' ? iconsMaterial.CheckCircle : undefined;
   return /*#__PURE__*/jsxRuntime.jsx(material.SnackbarContent, _objectSpread(_objectSpread({}, props), {}, {
@@ -1874,7 +1925,7 @@ var SnackbarContent = /*#__PURE__*/React.forwardRef((_ref, ref) => {
 });
 if (process.env.NODE_ENV !== "production") SnackbarContent.displayName = "SnackbarContent";
 
-var _excluded$i = ["open", "action", "variant", "onClose", "children", "ContentProps", "hasCloseButton", "TransitionComponent"];
+var _excluded$j = ["open", "action", "variant", "onClose", "children", "ContentProps", "hasCloseButton", "TransitionComponent"];
 
 function SlideTransition(props) {
   return /*#__PURE__*/jsxRuntime.jsx(material.Slide, _objectSpread(_objectSpread({}, props), {}, {
@@ -1893,7 +1944,7 @@ var Snackbar = /*#__PURE__*/React.forwardRef((_ref, ref) => {
     hasCloseButton = onClose != null,
     TransitionComponent = SlideTransition
   } = _ref,
-      props = _objectWithoutProperties(_ref, _excluded$i);
+      props = _objectWithoutProperties(_ref, _excluded$j);
 
   function handleClose(reason) {
     if (reason !== 'clickaway') {
@@ -1922,7 +1973,7 @@ var Snackbar = /*#__PURE__*/React.forwardRef((_ref, ref) => {
 });
 if (process.env.NODE_ENV !== "production") Snackbar.displayName = "Snackbar";
 
-var _excluded$j = ["onClose", "variant", "key", "id", "autoHideDuration"];
+var _excluded$k = ["onClose", "variant", "key", "id", "autoHideDuration"];
 
 function warnContext() {
   // eslint-disable-next-line no-console
@@ -1968,7 +2019,7 @@ function SnackbarStackProvider(_ref2) {
       id = String(key),
       autoHideDuration = 5000
     } = _ref3,
-        props = _objectWithoutProperties(_ref3, _excluded$j);
+        props = _objectWithoutProperties(_ref3, _excluded$k);
 
     function removeSnackbar() {
       setStack(prev => {
@@ -2065,7 +2116,7 @@ var Stack = /*#__PURE__*/React.forwardRef((_ref2, ref) => {
 });
 if (process.env.NODE_ENV !== "production") Stack.displayName = "Stack";
 
-var _excluded$k = ["color", "variant", "children", "classes", "className", "noWrap", "fontWeight", "component"];
+var _excluded$l = ["color", "variant", "children", "classes", "className", "noWrap", "fontWeight", "component"];
 var useStyles$2 = /*#__PURE__*/styles.makeStyles(theme => ({
   root: {
     maxWidth: '100%',
@@ -2149,7 +2200,7 @@ var Tag = /*#__PURE__*/React.forwardRef((_ref, ref) => {
     fontWeight = 'bold',
     component = 'div'
   } = _ref,
-      props = _objectWithoutProperties(_ref, _excluded$k);
+      props = _objectWithoutProperties(_ref, _excluded$l);
 
   var styles = useStyles$2({
     classes
@@ -3805,6 +3856,7 @@ exports.GridStack = GridStack;
 exports.InfoCard = InfoCard;
 exports.Inline = Inline;
 exports.InlineGrid = InlineGrid;
+exports.NumberField = NumberField;
 exports.OverflowText = OverflowText;
 exports.RadioField = RadioField;
 exports.RadioGroupField = RadioGroupField;