react-currency-input-field - npm Package Compare versions

Comparing version 0.8.4 to 0.9.0

CHANGELOG.md

@@ -0,1 +1,8 @@
+# [0.9.0](https://github.com/cchanxzy/react-currency-input-field/compare/v0.8.4...v0.9.0) (2020-05-08)
+
+
+### Features
+
+* allow props for input to be passed ([998c3ae](https://github.com/cchanxzy/react-currency-input-field/commit/998c3ae6a0379290d80846f89236d566cd4a9757))
+
 ## [0.8.4](https://github.com/cchanxzy/react-currency-input-field/compare/v0.8.3...v0.8.4) (2020-05-06)
@@ -2,0 +9,0 @@

dist/components/CurrencyInputProps.d.ts

@@ -1,4 +0,6 @@
-export declare type CurrencyInputProps = {
+/// <reference types="react" />
+declare type Overwrite<T, U> = Pick<T, Exclude<keyof T, keyof U>> & U;
+export declare type CurrencyInputProps = Overwrite<React.InputHTMLAttributes<HTMLInputElement>, {
     /**
-     * Allow decimals.
+     * Allow decimals
      * Default = true
@@ -34,3 +36,3 @@ */
     /**
-     * Handle change in value
+     * Handle change in value. Value will be `null` or `number`
      */
@@ -47,5 +49,6 @@ onChange?: (value: number | null, name?: string) => void;
     /**
-     *  Max Length
+     *  Maximum characters the user can enter
      */
     maxLength?: number;
-};
+}>;
+export {};

dist/index.js

@@ -1,2 +0,2 @@
-module.exports=function(e){var t={};function r(n){if(t[n])return t[n].exports;var u=t[n]={i:n,l:!1,exports:{}};return e[n].call(u.exports,u,u.exports,r),u.l=!0,u.exports}return r.m=e,r.c=t,r.d=function(e,t,n){r.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:n})},r.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.t=function(e,t){if(1&t&&(e=r(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var n=Object.create(null);if(r.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var u in e)r.d(n,u,function(t){return e[t]}.bind(null,u));return n},r.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return r.d(t,"a",t),t},r.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r.p="",r(r.s=0)}([function(e,t,r){"use strict";var n=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(t,"__esModule",{value:!0});var u=n(r(1));t.default=u.default},function(e,t,r){"use strict";var n=this&&this.__importStar||function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var r in e)Object.hasOwnProperty.call(e,r)&&(t[r]=e[r]);return t.default=e,t};Object.defineProperty(t,"__esModule",{value:!0});var u=n(r(2)),a=r(3);t.CurrencyInput=function(e){var t=e.allowDecimals,r=void 0===t||t,n=e.id,o=e.name,l=e.className,i=e.decimalsLimit,c=void 0===i?2:i,f=e.defaultValue,d=e.disabled,s=void 0!==d&&d,m=e.onChange,p=e.placeholder,v=e.prefix,b=e.maxLength,_=f?a.formatValue(String(f),v):"",y=u.useState(_),g=y[0],h=y[1],O=u.useState(0),j=O[0],x=O[1],S=u.useRef(null);return u.useEffect((function(){S&&S.current&&S.current.setSelectionRange(j,j)}),[j,S,g]),u.default.createElement("input",{type:"text",inputMode:"decimal",id:n,name:o,className:l,onChange:function(e){var t=e.target,n=t.selectionStart,u=t.value,l=a.cleanValue(u,r,c,v);if(!l)return m&&m(null,o),h("");if(a.checkIsValidNumber(l)){var i=a.formatValue(l,v);if(n){var f=n+(i.length-u.length)||1;x(f)}h(i)}m&&m(Number(l),o)},onFocus:function(){return g?g.length:0},placeholder:p,disabled:s,value:g,ref:S,maxLength:b})},t.default=t.CurrencyInput},function(e,t){e.exports=require("react")},function(e,t,r){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.addCommas=function(e){return e.replace(/\B(?=(\d{3})+(?!\d))/g,",")},t.removeCommas=function(e){return e.replace(/,/g,"")},t.checkIsValidNumber=function(e){return!(Number(e)<0||isNaN(Number(e)))},t.cleanValue=function(e,r,n,u){var a=u?e.replace(u,""):e,o=t.removeCommas(a);if(o.includes(".")){var l=o.split("."),i=l[0],c=l[1];return""+i+(r?"."+(n?c.slice(0,n):c):"")}return o},t.formatValue=function(e,r){var n=e.split("."),u=n[0],a=n[1],o=r||"",l=e.includes(".")?"."+a:"";return""+o+t.addCommas(u)+l}}]);
+module.exports=function(e){var t={};function r(n){if(t[n])return t[n].exports;var u=t[n]={i:n,l:!1,exports:{}};return e[n].call(u.exports,u,u.exports,r),u.l=!0,u.exports}return r.m=e,r.c=t,r.d=function(e,t,n){r.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:n})},r.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.t=function(e,t){if(1&t&&(e=r(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var n=Object.create(null);if(r.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var u in e)r.d(n,u,function(t){return e[t]}.bind(null,u));return n},r.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return r.d(t,"a",t),t},r.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r.p="",r(r.s=0)}([function(e,t,r){"use strict";var n=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(t,"__esModule",{value:!0});var u=n(r(1));t.default=u.default},function(e,t,r){"use strict";var n=this&&this.__assign||function(){return(n=Object.assign||function(e){for(var t,r=1,n=arguments.length;r<n;r++)for(var u in t=arguments[r])Object.prototype.hasOwnProperty.call(t,u)&&(e[u]=t[u]);return e}).apply(this,arguments)},u=this&&this.__rest||function(e,t){var r={};for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&t.indexOf(n)<0&&(r[n]=e[n]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var u=0;for(n=Object.getOwnPropertySymbols(e);u<n.length;u++)t.indexOf(n[u])<0&&Object.prototype.propertyIsEnumerable.call(e,n[u])&&(r[n[u]]=e[n[u]])}return r},a=this&&this.__importStar||function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var r in e)Object.hasOwnProperty.call(e,r)&&(t[r]=e[r]);return t.default=e,t};Object.defineProperty(t,"__esModule",{value:!0});var o=a(r(2)),l=r(3);t.CurrencyInput=function(e){var t=e.allowDecimals,r=void 0===t||t,a=e.id,i=e.name,c=e.className,f=e.decimalsLimit,s=void 0===f?2:f,d=e.defaultValue,p=e.disabled,m=void 0!==p&&p,v=e.onChange,b=e.placeholder,y=e.prefix,h=e.maxLength,g=u(e,["allowDecimals","id","name","className","decimalsLimit","defaultValue","disabled","onChange","placeholder","prefix","maxLength"]),O=d?l.formatValue(String(d),y):"",_=o.useState(O),j=_[0],x=_[1],P=o.useState(0),S=P[0],M=P[1],N=o.useRef(null);return o.useEffect((function(){N&&N.current&&N.current.setSelectionRange(S,S)}),[S,N,j]),o.default.createElement("input",n({type:"text",inputMode:"decimal",id:a,name:i,className:c,onChange:function(e){var t=e.target,n=t.selectionStart,u=t.value,a=l.cleanValue(u,r,s,y);if(!a)return v&&v(null,i),x("");if(l.checkIsValidNumber(a)){var o=l.formatValue(a,y);if(n){var c=n+(o.length-u.length)||1;M(c)}x(o)}v&&v(Number(a),i)},onFocus:function(){return j?j.length:0},placeholder:b,disabled:m,value:j,ref:N,maxLength:h},g))},t.default=t.CurrencyInput},function(e,t){e.exports=require("react")},function(e,t,r){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.addCommas=function(e){return e.replace(/\B(?=(\d{3})+(?!\d))/g,",")},t.removeCommas=function(e){return e.replace(/,/g,"")},t.checkIsValidNumber=function(e){return!(Number(e)<0||isNaN(Number(e)))},t.cleanValue=function(e,r,n,u){var a=u?e.replace(u,""):e,o=t.removeCommas(a);if(o.includes(".")){var l=o.split("."),i=l[0],c=l[1];return""+i+(r?"."+(n?c.slice(0,n):c):"")}return o},t.formatValue=function(e,r){var n=e.split("."),u=n[0],a=n[1],o=r||"",l=e.includes(".")?"."+a:"";return""+o+t.addCommas(u)+l}}]);
 //# sourceMappingURL=index.js.map

package.json

 {
   "name": "react-currency-input-field",
-  "version": "0.8.4",
-  "description": "React input field component for currency and numbers",
+  "version": "0.9.0",
+  "description": "React <input /> component for formatting currency and numbers.",
   "files": [
@@ -6,0 +6,0 @@ "dist/**/*"

README.md

@@ -5,12 +5,11 @@ # React Currency Input Field Component
 
-Features:
+## Features
 
+- Prefix option eg. £ or \$
+- Can allow/disallow decimals
+- Automatically inserts comma separator
 - Only allows numbers
-- Can handle decimals
-- Can add prefix eg. £ or \$
-- Automatically inserts commas
 - Lightweight and simple
-- Works well with Bootstrap styling
 
-[Demo](https://cchanxzy.github.io/react-currency-input-field)
+[Live Demo](https://cchanxzy.github.io/react-currency-input-field)
 
@@ -30,3 +29,3 @@ ![React Currency Input Demo](demo/demo.gif)
 ```js
-import CurrencyInput from 'react-currency-input-field'
+import CurrencyInput from 'react-currency-input-field';
 
@@ -40,4 +39,4 @@ <CurrencyInput
   decimalsLimit={2}
-  onChange={(value, name) => {process(value, name)}}
-/>
+  onChange={(value, name) => console.log(value, name)}
+/>;
 ```
@@ -49,15 +48,15 @@
 
-| Name          | Type       | Default | Description                                     |
-| ------------- | ---------- | ------- | ----------------------------------------------- |
-| allowDecimals | `boolean`  | `true`  | Allow decimals                                  |
-| id            | `string`   |         | Component id                                    |
-| name          | `string`   |         | Component (input) name                          |
-| className     | `string`   |         | Class names                                     |
-| decimalsLimit | `number`   | `2`     | Limit length of decimals allowed                |
-| defaultValue  | `number`   |         | Default value                                   |
-| disabled      | `boolean`  | `false` | Disabled                                        |
-| onChange      | `function` |         | Handle change in value                          |
-| placeholder   | `string`   |         | Placeholder if no input                         |
-| prefix        | `string`   |         | Include a prefix eg. £ or \$                    |
-| maxLength     | `number`   |         | Maximum number of characters the user can enter |
+| Name          | Type       | Default | Description                                              |
+| ------------- | ---------- | ------- | -------------------------------------------------------- |
+| allowDecimals | `boolean`  | `true`  | Allow decimals                                           |
+| id            | `string`   |         | Component id                                             |
+| name          | `string`   |         | Component (input) name                                   |
+| className     | `string`   |         | Class names                                              |
+| decimalsLimit | `number`   | `2`     | Limit length of decimals allowed                         |
+| defaultValue  | `number`   |         | Default value                                            |
+| disabled      | `boolean`  | `false` | Disabled                                                 |
+| onChange      | `function` |         | Handle change in value. Value will be `null` or `number` |
+| placeholder   | `string`   |         | Placeholder if no value                                  |
+| prefix        | `string`   |         | Include a prefix eg. £ or \$                             |
+| maxLength     | `number`   |         | Maximum characters the user can enter                    |
 
@@ -64,0 +63,0 @@ ## Issues

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

30018

increased by4.86%

Lines of code

83

increased by6.41%

Worsened metrics

Number of lines in readme file

62

decreased by-1.59%

No dependency changes