@unicef/material-ui 0.8.1 → 0.8.2

package/lib/dev.js

@@ -53512,6 +53512,71 @@ UPositiveInteger.propTypes = {
   withRequiredValidator: PropTypes__default.bool
 };
 
+var useStyles$n = makeStyles$1(function (theme) {
+  return {
+    startAdornmentContainer: {
+      marginRight: theme.spacing(0.5)
+    }
+  };
+});
+
+function UCurrencyField(_ref) {
+  var inputPrefix = _ref.inputPrefix,
+      decimalScale = _ref.decimalScale,
+      InputProps = _ref.InputProps,
+      inputProps = _ref.inputProps,
+      props = objectWithoutProperties(_ref, ['inputPrefix', 'decimalScale', 'InputProps', 'inputProps']);
+
+  var classes = useStyles$n(props);
+  return React__default.createElement(UPositiveInteger, _extends$1({
+    variant: 'outlined',
+    InputProps: _extends$1({
+      startAdornment: React__default.createElement(
+        'span',
+        { className: classes.startAdornmentContainer },
+        inputPrefix
+      )
+    }, InputProps),
+    inputProps: _extends$1({ decimalScale: decimalScale }, inputProps)
+  }, props));
+}
+
+UCurrencyField.propTypes = {
+  /** label */
+  label: PropTypes__default.string,
+  /** placeholder text*/
+  placeholder: PropTypes__default.string,
+  /**
+   * Array of validators.See list of default validators above.
+   *
+   * Ex: `validators={['required', 'isEmail']}`
+   */
+  validators: PropTypes__default.array,
+  /** Attributes applied to the input element. */
+  inputProps: PropTypes__default.object,
+  /** Props applied to the Input element. */
+  InputProps: PropTypes__default.object,
+  /** Prefix string for the input. */
+  inputPrefix: PropTypes__default.string,
+  /** Decimal digit number to be used as default. */
+  decimalScale: PropTypes__default.number,
+  /**
+   * customErrorMessages is an object with key as validator and value as customised error message.
+   *
+   * Ex: `customErrorMessages={{required: 'This field is required'}`
+   */
+  customErrorMessages: PropTypes__default.object,
+  /** To make the content readOnly */
+  readOnly: PropTypes__default.bool,
+  /** Name of input. */
+  name: PropTypes__default.string
+};
+
+UCurrencyField.defaultProps = {
+  inputPrefix: '$',
+  decimalScale: 2
+};
+
 function ActiveFormPositiveInteger(_ref) {
   var InputProps = _ref.InputProps,
       props = objectWithoutProperties(_ref, ['InputProps']);
@@ -53560,6 +53625,81 @@ ActiveFormPositiveInteger.propTypes = {
   withRequiredValidator: PropTypes__default.bool
 };
 
+var useStyles$o = makeStyles$1(function (theme) {
+  return {
+    startAdornmentContainer: {
+      marginRight: theme.spacing(0.5)
+    }
+  };
+});
+
+function ActiveCurrencyField(_ref) {
+  var inputPrefix = _ref.inputPrefix,
+      decimalScale = _ref.decimalScale,
+      InputProps = _ref.InputProps,
+      inputProps = _ref.inputProps,
+      props = objectWithoutProperties(_ref, ['inputPrefix', 'decimalScale', 'InputProps', 'inputProps']);
+
+  var classes = useStyles$o(props);
+  return React__default.createElement(ActiveFormPositiveInteger, _extends$1({
+    variant: 'outlined',
+    InputProps: _extends$1({
+      startAdornment: React__default.createElement(
+        'span',
+        { className: classes.startAdornmentContainer },
+        inputPrefix
+      )
+    }, InputProps),
+    inputProps: _extends$1({ decimalScale: decimalScale }, inputProps)
+  }, props));
+}
+
+ActiveCurrencyField.propTypes = {
+  /** label */
+  label: PropTypes__default.string,
+  /** placeholder text*/
+  placeholder: PropTypes__default.string,
+  /** Typography for text inside the input (Ex: h1, div, etc.) */
+  typographyVariant: PropTypes__default.string,
+  /** Input has some default padding already, to make changes to it pass padding like `inputPadding='0px 2px'` */
+  inputPadding: PropTypes__default.string,
+  /** To hide or display the textfied border*/
+  showBorder: PropTypes__default.bool,
+  /**
+   * Array of validators.See list of default validators above.
+   *
+   * Ex: `validators={['required', 'isEmail']}`
+   */
+  validators: PropTypes__default.array,
+  /** Attributes applied to the input element. */
+  inputProps: PropTypes__default.object,
+  /** Props applied to the Input element. */
+  InputProps: PropTypes__default.object,
+  /** Prefix string for the input. */
+  inputPrefix: PropTypes__default.string,
+  /** Decimal digit number to be used as default. */
+  decimalScale: PropTypes__default.number,
+  /**
+   * customErrorMessages is an object with key as validator and value as customised error message.
+   *
+   * Ex: `customErrorMessages={{required: 'This field is required'}`
+   */
+  customErrorMessages: PropTypes__default.object,
+  /** To make the content readOnly */
+  readOnly: PropTypes__default.bool,
+  /** Name of input. */
+  name: PropTypes__default.string,
+  /** It triggers after each validation.It will return true or false. */
+  validatorListener: PropTypes__default.func,
+  /** Allow to use required validator in any validation trigger, not only form submit. */
+  withRequiredValidator: PropTypes__default.bool
+};
+
+ActiveCurrencyField.defaultProps = {
+  inputPrefix: '$',
+  decimalScale: 2
+};
+
 var DeleteOutlined = createCommonjsModule(function (module, exports) {
 
 
@@ -53584,7 +53724,7 @@ exports.default = _default;
 
 var DeleteOutlinedIcon = unwrapExports(DeleteOutlined);
 
-var useStyles$n = makeStyles$1(function (theme) {
+var useStyles$p = makeStyles$1(function (theme) {
   return {
     menuDelete: {
       width: '500px'
@@ -53604,7 +53744,7 @@ var useStyles$n = makeStyles$1(function (theme) {
  * It has two varint icon/menu item
  */
 function UConfirmationButton(props) {
-  var classes = useStyles$n();
+  var classes = useStyles$p();
   var onConfirm = props.onConfirm,
       id = props.id,
       buttonText = props.buttonText,
@@ -53719,7 +53859,7 @@ UConfirmationButton.defaultProps = {
 /**
  * displays radio buttons
  */
-var useStyles$o = makeStyles$1(function (theme) {
+var useStyles$q = makeStyles$1(function (theme) {
   return {
     padding: {
       paddingLeft: theme.spacing(3)
@@ -53740,7 +53880,7 @@ function URadioButtons(_ref) {
       optionLabels = _ref.optionLabels,
       optionValues = _ref.optionValues;
 
-  var classes = useStyles$o();
+  var classes = useStyles$q();
   var handleOnChange = function handleOnChange(event) {
     onChange && onChange(event);
   };
@@ -53844,7 +53984,7 @@ exports.default = _default;
 
 var DoneIcon = unwrapExports(Done);
 
-var useStyles$p = makeStyles$1(function (theme) {
+var useStyles$r = makeStyles$1(function (theme) {
   return {
     root: {
       position: 'fixed',
@@ -53876,7 +54016,7 @@ function UAsyncBadge(_ref) {
       visible = _ref.visible,
       onReset = _ref.onReset;
 
-  var classes = useStyles$p();
+  var classes = useStyles$r();
 
   /**  If variant is success or error, after few seconds, it will set asyncResponse visible to false */
   React.useEffect(function () {
@@ -53915,7 +54055,7 @@ UAsyncBadge.propTypes = {
   onReset: PropTypes__default.func
 };
 
-var useStyles$q = makeStyles$1(function () {
+var useStyles$s = makeStyles$1(function () {
   return {
     pageLoadingProgress: {
       height: '50vh',
@@ -53930,7 +54070,7 @@ var useStyles$q = makeStyles$1(function () {
  * 2. Display text message
  */
 function UPageLoadingProgress(props) {
-  var classes = useStyles$q();
+  var classes = useStyles$s();
   var text = props.text;
 
   return React__default.createElement(
@@ -56313,7 +56453,7 @@ UErrorAlert.defaultProps = {
 
 var filter = createFilterOptions();
 
-var useStyles$r = makeStyles$1(function (theme) {
+var useStyles$t = makeStyles$1(function (theme) {
   return {
     controlStyle: {
       marginTop: theme.spacing(2),
@@ -56341,7 +56481,7 @@ function UAutoComplete(_ref) {
       allowContextSpecific = _ref.allowContextSpecific,
       props = _ref.props;
 
-  var classes = useStyles$r();
+  var classes = useStyles$t();
   //const dispatch = useDispatch()
 
   var _useState = React.useState(value || null),
@@ -56490,7 +56630,7 @@ UAutoComplete.defaultProps = {
 
 /* eslint-disable no-nested-ternary */
 
-var useStyles$s = makeStyles$1(function (theme) {
+var useStyles$u = makeStyles$1(function (theme) {
   var _ref;
 
   return _ref = {
@@ -56522,7 +56662,7 @@ var useStyles$s = makeStyles$1(function (theme) {
  * Breadcrumbs is a component to implement current user path of the application
  */
 function UBreadcrumbs(props) {
-  var classes = useStyles$s();
+  var classes = useStyles$u();
   var breadcrumbLinks = props.breadcrumbLinks;
 
 
@@ -56599,7 +56739,7 @@ UInfiniteScroll.propTypes = {
   onEndOfScroll: PropTypes__default.func
 };
 
-var useStyles$t = makeStyles$1(function (theme) {
+var useStyles$v = makeStyles$1(function (theme) {
   return {
     small: {
       width: theme.spacing(4),
@@ -56644,7 +56784,7 @@ function UAvatarImage(_ref) {
       zIndexValue = _ref.zIndexValue,
       loadPhoto = _ref.loadPhoto;
 
-  var classes = useStyles$t();
+  var classes = useStyles$v();
 
   var _useState = React.useState(''),
       _useState2 = slicedToArray(_useState, 2),
@@ -57076,7 +57216,7 @@ exports.default = _default;
 
 var CloseIcon$1 = unwrapExports(Close);
 
-var useStyles$u = makeStyles$1(function (theme) {
+var useStyles$w = makeStyles$1(function (theme) {
   return {
     root: {
       width: '100%',
@@ -57116,7 +57256,7 @@ function USearchBox(_ref) {
       searchValue = _useState2[0],
       setSearch = _useState2[1];
 
-  var classes = useStyles$u();
+  var classes = useStyles$w();
 
   var handleChange = function handleChange(event) {
     setSearch(event.target.value);
@@ -57217,7 +57357,7 @@ var styles$16 = {
   }
 };
 
-var useStyles$v = makeStyles$1(function (theme) {
+var useStyles$x = makeStyles$1(function (theme) {
   return {
     textField: {
       marginTop: theme.spacing(0.25),
@@ -57260,7 +57400,7 @@ var useStyles$v = makeStyles$1(function (theme) {
  * ActiveKeyboardDatePicker is a customized [Material Ui KeyboardDatePicker]('https://material-ui-pickers.dev/api/KeyboardDatePicker') for more details
  */
 function ActiveKeyboardDatePicker(props) {
-  var classes = useStyles$v(props);
+  var classes = useStyles$x(props);
   var autoOk = props.autoOk,
       variant = props.variant,
       inputVariant = props.inputVariant,
@@ -57379,7 +57519,7 @@ var styles$17 = {
   }
 };
 
-var useStyles$w = makeStyles$1(function (theme) {
+var useStyles$y = makeStyles$1(function (theme) {
   return {
     textField: {
       marginTop: theme.spacing(0.25),
@@ -57418,7 +57558,7 @@ var useStyles$w = makeStyles$1(function (theme) {
  * Please have look at [Material Ui Date Picker]('https://material-ui-pickers.dev/api/DatePicker') for more details
  */
 function ActiveDatePicker(props) {
-  var classes = useStyles$w(props);
+  var classes = useStyles$y(props);
   var autoOk = props.autoOk,
       variant = props.variant,
       inputVariant = props.inputVariant,
@@ -57512,7 +57652,7 @@ var styles$18 = {
   }
 };
 
-var useStyles$x = makeStyles$1(function (theme) {
+var useStyles$z = makeStyles$1(function (theme) {
   return {
     textField: {
       marginTop: theme.spacing(0.25),
@@ -57551,7 +57691,7 @@ var useStyles$x = makeStyles$1(function (theme) {
  * Please have look at [Material Ui TimePicker]('https://material-ui-pickers.dev/api/TimePicker') for more details
  */
 function ActiveTimePicker(props) {
-  var classes = useStyles$x(props);
+  var classes = useStyles$z(props);
   var inputVariant = props.inputVariant,
       readOnly = props.readOnly,
       interactiveMode = props.interactiveMode,
@@ -57636,7 +57776,7 @@ var styles$19 = {
   }
 };
 
-var useStyles$y = makeStyles$1(function (theme) {
+var useStyles$A = makeStyles$1(function (theme) {
   return {
     textField: {
       marginTop: theme.spacing(0.25),
@@ -57679,7 +57819,7 @@ var useStyles$y = makeStyles$1(function (theme) {
  * ActiveKeyboardTimePicker is customized [ Material Ui KeyboardTimePicker](https://material-ui-pickers.dev/api/KeyboardTimePicker)
  */
 function ActiveKeyboardTimePicker(props) {
-  var classes = useStyles$y(props);
+  var classes = useStyles$A(props);
   var inputVariant = props.inputVariant,
       readOnly = props.readOnly,
       interactiveMode = props.interactiveMode,
@@ -57781,6 +57921,7 @@ ActiveKeyboardTimePicker.defaultProps = {
   variant: 'inline'
 };
 
+exports.ActiveCurrencyField = ActiveCurrencyField;
 exports.ActiveDatePicker = ActiveDatePicker;
 exports.ActiveFormCoordinateField = ActiveFormCoordinateField;
 exports.ActiveFormPositiveInteger = ActiveFormPositiveInteger;
@@ -57797,6 +57938,7 @@ exports.UButton = UButton;
 exports.UConfirmationButton = UConfirmationButton;
 exports.UContent = UContent;
 exports.UCoordinateField = UCoordinateField;
+exports.UCurrencyField = UCurrencyField;
 exports.UDatePicker = UDatePicker;
 exports.UDateTimePicker = UDateTimePicker;
 exports.UErrorAlert = UErrorAlert;