diff --git a/PROPS.md b/PROPS.md
index 2a4cf08..4a620cb 100644
--- a/PROPS.md
+++ b/PROPS.md
@@ -26,7 +26,7 @@
| `buttonTextColor` | Custom color of the button of the Spinner | String | Auto | |
| `buttonPressTextStyle` | Button Style on Pressed state (Plus and Minus buttons) | Object | | Could overwrite other props |
| `buttonTextStyle` | Button text Style state (Plus and Minus buttons) | Object | | Could overwrite other props |
-| `colorAsBackground` | Use color as background | Bool | `false` |
+| `colorAsBackground` | Use color as background | Bool | `false` | |
| `colorLeft` | Custom color of the Spinner left button | String | `#3E525F` | |
| `colorMax` | Custom color of the Spinner when reach max value | String | | |
| `colorMin` | Custom color of the Spinner when reach min value | String | | |
@@ -39,12 +39,13 @@
| `emptied` | Set if input can be empty | Boolean | `false` | |
| `fontFamily` | Custom fontFamily of the text input of the Spinner | String | System Default | |
| `fontSize` | Custom fontSize of the text input of the Spinner | Number | `14` | |
+| `formatter` | Custom formatting of the Spinner text | Function | `null` | `(value) => { ...; return formattedValue }`. `editable` must be `false` |
| `height` | Custom height of the Spinner | Number | `50` | |
| `initialValue` | Initial value of the Spinner | String
Number | `0` | |
| `inputStyle` | Input Style (Text number at middle) | Object | | Could overwrite other props |
| `inputProps` | Customized TextInput Component props | Object | `null` | |
| `leftButtonProps` | Customized left button (Touchable Component) props | Object | `null` | |
-| `longStep` | Value to increment or decrement the current spinner value `onLongPress` | String
Number | `step` |
+| `longStep` | Value to increment or decrement the current spinner value `onLongPress` | String
Number | `step` | |
| `maxLength` | Limits the maximum number of characters that can be entered. | Number | | |
| `max` | Max number permitted | String
Number | `null` | |
| `min` | Min value permitted | String
Number | `0` | |
diff --git a/README.md b/README.md
index 9e7e876..d0ae102 100644
--- a/README.md
+++ b/README.md
@@ -145,6 +145,7 @@ Check the "[Props List](PROPS.md)" file to have the complete list of component p
| `typingTime` | Time before debounce and trigger `onChange` event | Number | `750` | |
| `type` | Type of spinner | String | `int` | Can be `int` or `real`/`float`... |
| `value` | Controlled value of the Spinner | String
Number | `0` | |
+| `formatter` | An optional function that is called to format the value for display | Function | `null` | Should return a `string`. `editable` must be `false`. |
#### Screenshots
diff --git a/src/InputSpinner.js b/src/InputSpinner.js
index 3358577..a9f7b5d 100644
--- a/src/InputSpinner.js
+++ b/src/InputSpinner.js
@@ -484,14 +484,23 @@ class InputSpinner extends Component {
value = String(this._parseNum(value));
}
let hasPlaceholder = value === "0" && !isEmpty(this.props.placeholder);
- return hasPlaceholder
- ? ""
- : value.replace(
- ".",
- !isEmpty(this.props.decimalSeparator)
- ? this.props.decimalSeparator
- : ".",
- );
+
+ let accountingForDecimals = hasPlaceholder
+ ? ""
+ : value.replace(
+ ".",
+ !isEmpty(this.props.decimalSeparator)
+ ? this.props.decimalSeparator
+ : ".",
+ );
+
+ // Only apply the formatter if the field is not user-editable
+ if (this.props.formatter !== null && typeof(this.props.formatter) === 'function' && !this.props.editable) {
+ return this.props.formatter(value)
+ }
+ else {
+ return accountingForDecimals
+ }
}
/**
@@ -1451,6 +1460,7 @@ InputSpinner.propTypes = {
leftButtonProps: PropTypes.object,
rightButtonProps: PropTypes.object,
buttonTextProps: PropTypes.object,
+ formatter: PropTypes.func,
};
InputSpinner.defaultProps = {
@@ -1512,6 +1522,7 @@ InputSpinner.defaultProps = {
leftButtonProps: null,
rightButtonProps: null,
buttonTextProps: null,
+ formatter: null,
};
export default InputSpinner;
diff --git a/src/index.d.ts b/src/index.d.ts
index c5724b2..3fe1f44 100644
--- a/src/index.d.ts
+++ b/src/index.d.ts
@@ -79,5 +79,6 @@ export interface ReactNativeInputSpinnerProps {
leftButtonProps?: object;
rightButtonProps?: object;
buttonTextProps?: TextProps;
+ formatter?(...args: unknown[]): unknown;
}
export default class InputSpinner extends Component {}