@s-ui/react-atom-input - npm Package Compare versions

Comparing version 1.13.0 to 1.14.0

CHANGELOG.md

@@ -5,2 +5,7 @@ # Change Log
 
+<a name="1.14.0"></a>
+# 1.14.0 (2018-10-23)
+
+
+
 <a name="1.13.0"></a>
@@ -14,3 +19,5 @@ # 1.13.0 (2018-10-23)
 * iconRight & clickHander & hoc features reorganization ([5c89813](https://github.com/SUI-Components/sui-components/commit/5c89813))
+* improved documentation ([fbe91ab](https://github.com/SUI-Components/sui-components/commit/fbe91ab))
 * left & right icon managed by HOC ([45dac5d](https://github.com/SUI-Components/sui-components/commit/45dac5d))
+* merge master & solved conflicts ([a90cb72](https://github.com/SUI-Components/sui-components/commit/a90cb72))
 
@@ -17,0 +24,0 @@

lib/index.js

@@ -68,60 +68,60 @@ 'use strict';
 AtomInput.propTypes = process.env.NODE_ENV !== "production" ? process.env.NODE_ENV !== "production" ? {
-  /* native types (text, date, ...), 'sui-password' */
+  /** native types (text, date, ...), 'sui-password' */
   type: _propTypes2.default.oneOf((0, _values2.default)(TYPES)),
 
-  /* Left addon component, text,... */
+  /** Left addon component, text,... */
   leftAddon: _propTypes2.default.any,
 
-  /* Right addon component, text,... */
+  /** Right addon component, text,... */
   rightAddon: _propTypes2.default.any,
 
-  /* Left Icon */
+  /** Left Icon */
   leftIcon: _propTypes2.default.any,
 
-  /* Left Icon */
+  /** Left Icon */
   rightIcon: _propTypes2.default.any,
 
-  /* Left icon click callback */
+  /** Left icon click callback */
   onClickLeftIcon: _propTypes2.default.func,
 
-  /* Right icon click callback */
+  /** Right icon click callback */
   onClickRightIcon: _propTypes2.default.func,
 
-  /* Text to be shown in order to show the password on click */
+  /** Text to be shown in order to show the password on click */
   pwShowLabel: _propTypes2.default.string,
 
-  /* Text to be shown in order to hide the password on click */
+  /** Text to be shown in order to hide the password on click */
   pwHideLabel: _propTypes2.default.string,
 
-  /* onBlur callback */
+  /** onBlur callback */
   onBlur: _propTypes2.default.func,
 
-  /* onChange callback */
+  /** onChange callback */
   onChange: _propTypes2.default.func,
 
-  /* sets the name property of an element in the DOM */
+  /** sets the name property of an element in the DOM */
   name: _propTypes2.default.string,
 
-  /* The DOM id global attribute. */
+  /** The DOM id global attribute. */
   id: _propTypes2.default.string,
 
-  /* A hint to the user of what can be entered in the control. The placeholder text must not contain carriage returns or line-feeds. */
+  /** A hint to the user of what can be entered in the control. The placeholder text must not contain carriage returns or line-feeds. */
   placeholder: _propTypes2.default.string,
 
-  /* This Boolean attribute prevents the user from interacting with the input */
+  /** This Boolean attribute prevents the user from interacting with the input */
   disabled: _propTypes2.default.bool,
 
-  /* 's' or 'm', default: 'm' */
+  /** 's' or 'm', default: 'm' */
   size: _propTypes2.default.oneOf((0, _values2.default)(_Input.inputSizes)),
 
-  /* width of input based in number of characters (native "size" attribute) */
+  /** width of input based in number of characters (native "size" attribute) */
   charsSize: _propTypes2.default.number,
 
-  /* true = error, false = success, null = neutral */
+  /** true = error, false = success, null = neutral */
   errorState: _propTypes2.default.bool,
 
-  /* value of the control */
+  /** value of the control */
   value: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.bool]),
 
-  /* mask object, see https://unmanner.github.io/imaskjs/ */
+  /** mask object, see https://unmanner.github.io/imaskjs/ */
   mask: _propTypes2.default.object
@@ -128,0 +128,0 @@ } : {} : {};

package.json

 {
   "name": "@s-ui/react-atom-input",
-  "version": "1.13.0",
+  "version": "1.14.0",
   "description": "",
@@ -5,0 +5,0 @@ "main": "lib/index.js",

README.md

@@ -33,3 +33,3 @@ # AtomInput
 
-### Mask
+#### Mask
 
@@ -46,10 +46,23 @@ Wraps the https://unmanner.github.io/imaskjs/ lib, used if the input must follow a regex or a specific format/pattern . Using `type='mask'` activates this input, which will be expecting the `mask` prop type to be passed by.
 
-## Addons
+### Sizes
 
->[What are addons?](https://paper.dropbox.com/doc/SUI-Input-03mHJFkOCjviSZevsaTwm#:uid=125362683844628624581838&h2=Icons-and-addons-inside-the-in)
+There are defined 2 sizes (`MEDIUM` and `SMALL`) available at the exported object `inputSizes` and that can be set through the prop `size`
 
-Addons are passed as prop, use **leftAddon** or **rightAddon** in order to set the position inside the Input, or **leftIcon** to use an icon inside the input 
+```js
+<AtomInput
+  size={inputSizes.SMALL}
+  name="first"
+  placeholder="Small input"
+/>
+```
 
-### Addon usage
 
+### Addons
+
+> [What are addons?](https://paper.dropbox.com/doc/SUI-Input-03mHJFkOCjviSZevsaTwm#:uid=125362683844628624581838&h2=Icons-and-addons-inside-the-in)
+
+Addons are passed as prop, use **leftAddon** or **rightAddon** in order to set the position inside the Input
+
+#### Addon usage
+
 ```js
@@ -61,2 +74,7 @@ import AtomInput from '@s-ui/react-atom-input'
 
+### Icons
+
+Icons are passed as prop, use **leftIcon** or **rightIcon** in order to set the position inside the Input
+
+
 ```js
@@ -71,4 +89,17 @@ import AtomInput from '@s-ui/react-atom-input'
 
-## Error states
+You can also pass a handler for each Icon using the props **onClickLeftIcon** or **onClickRightIcon**
 
+```js
+<AtomInput
+  name="second"
+  placeholder="Medium Input"
+  leftIcon={LeftIcon}
+  rightIcon={IconLocation}
+  onClickRightIcon={ e => alert("clicked right icon")}
+/>
+```
+
+
+### Error states
+
 There are 3 error states:
@@ -80,4 +111,11 @@
 
+```js
+<AtomInput 
+  name="second" 
+  placeholder="Success input" 
+  errorState={false} 
+/>
+```
 
-## Form Usage
+### Form Usage
 
@@ -84,0 +122,0 @@ Each field returns its value on every onChange event so you can save it inside your form state.

No alert changes

Improved metrics

Total package byte prevSize

38193

increased by2.62%

Number of lines in readme file

200

increased by23.46%

No dependency changes