@gympass/yoga 7.36.0 → 7.37.2

package/cjs/Grid/web/Hide.test.js

@@ -0,0 +1,39 @@
+"use strict";
+
+var _react = _interopRequireDefault(require("react"));
+
+var _react2 = require("@testing-library/react");
+
+var _ = require("../..");
+
+var _2 = require(".");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+describe('<Hide />', function () {
+  describe('Snapshots', function () {
+    it('should match snapshot', function () {
+      var _render = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_.ThemeProvider, null, /*#__PURE__*/_react["default"].createElement(_2.Hide, {
+        xxs: true,
+        xs: true,
+        sm: true,
+        md: true,
+        lg: true,
+        xl: true,
+        xxl: true,
+        xxxl: true
+      }, /*#__PURE__*/_react["default"].createElement("div", null, "foo")))),
+          container = _render.container;
+
+      expect(container).toMatchSnapshot();
+    });
+    it('should hide starting from md breakpoint', function () {
+      var _render2 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_.ThemeProvider, null, /*#__PURE__*/_react["default"].createElement(_2.Hide, {
+        "md-start": true
+      }, /*#__PURE__*/_react["default"].createElement("div", null, "foo")))),
+          container = _render2.container;
+
+      expect(container).toMatchSnapshot();
+    });
+  });
+});

package/cjs/Grid/web/Row.test.js

@@ -0,0 +1,22 @@
+"use strict";
+
+var _react = _interopRequireDefault(require("react"));
+
+var _react2 = require("@testing-library/react");
+
+var _ = require("../..");
+
+var _2 = require(".");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+describe('<Row />', function () {
+  describe('Snapshots', function () {
+    it('should match snapshot with default Row', function () {
+      var _render = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_.ThemeProvider, null, /*#__PURE__*/_react["default"].createElement(_2.Row, null))),
+          container = _render.container;
+
+      expect(container).toMatchSnapshot();
+    });
+  });
+});

package/cjs/Header/web/Header.test.js

@@ -0,0 +1,44 @@
+"use strict";
+
+var _react = _interopRequireDefault(require("react"));
+
+var _react2 = require("@testing-library/react");
+
+var _ = require("../..");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+describe('<Header />', function () {
+  it('should match snapshot', function () {
+    var _render = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_.ThemeProvider, null, /*#__PURE__*/_react["default"].createElement(_.Header, null))),
+        container = _render.container;
+
+    expect(container).toMatchSnapshot();
+  });
+  it('should have link', function () {
+    var gympassLink = 'https://site.gympass.com/br';
+    (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_.ThemeProvider, null, /*#__PURE__*/_react["default"].createElement(_.Header, {
+      link: gympassLink
+    })));
+
+    _react2.screen.getByRole('link', {
+      href: gympassLink
+    });
+  });
+  it('should show custom logo', function () {
+    var CustomLogo = function CustomLogo() {
+      return /*#__PURE__*/_react["default"].createElement("div", null, "Custom logo");
+    };
+
+    (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_.ThemeProvider, null, /*#__PURE__*/_react["default"].createElement(_.Header, {
+      logo: CustomLogo
+    })));
+
+    _react2.screen.getByText('Custom logo');
+  });
+  it('should show children', function () {
+    (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_.ThemeProvider, null, /*#__PURE__*/_react["default"].createElement(_.Header, null, /*#__PURE__*/_react["default"].createElement("p", null, "Make wellbeing universal"))));
+
+    _react2.screen.getByText('Make wellbeing universal');
+  });
+});

package/cjs/Heading/web/Heading.test.js

@@ -0,0 +1,55 @@
+"use strict";
+
+var _react = _interopRequireDefault(require("react"));
+
+var _react2 = require("@testing-library/react");
+
+var _src = require("@gympass/yoga-icons/src");
+
+var _ = require("../..");
+
+var _Title = _interopRequireDefault(require("./Title"));
+
+var _BackButton = _interopRequireDefault(require("./BackButton"));
+
+var _RightButton = _interopRequireDefault(require("./RightButton"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+var onClick = function onClick() {};
+
+describe('<Heading />', function () {
+  it('should match snapshot with title', function () {
+    var _render = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_.ThemeProvider, null, /*#__PURE__*/_react["default"].createElement(_.Heading, null, /*#__PURE__*/_react["default"].createElement(_Title["default"], null, "Gympass")))),
+        container = _render.container;
+
+    expect(container).toMatchSnapshot();
+  });
+  it('should match snapshot with title and back button', function () {
+    var _render2 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_.ThemeProvider, null, /*#__PURE__*/_react["default"].createElement(_.Heading, null, /*#__PURE__*/_react["default"].createElement(_Title["default"], null, "Gympass"), /*#__PURE__*/_react["default"].createElement(_BackButton["default"], {
+      onClick: onClick
+    })))),
+        container = _render2.container;
+
+    expect(container).toMatchSnapshot();
+  });
+  it('should match snapshot with all components', function () {
+    var _render3 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_.ThemeProvider, null, /*#__PURE__*/_react["default"].createElement(_.Heading, null, /*#__PURE__*/_react["default"].createElement(_Title["default"], null, "Gympass"), /*#__PURE__*/_react["default"].createElement(_BackButton["default"], {
+      onClick: onClick
+    }), /*#__PURE__*/_react["default"].createElement(_RightButton["default"], {
+      icon: _src.Upload2,
+      onClick: onClick
+    })))),
+        container = _render3.container;
+
+    expect(container).toMatchSnapshot();
+  });
+  it('should match snapshot with back button', function () {
+    var _render4 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_.ThemeProvider, null, /*#__PURE__*/_react["default"].createElement(_.Heading, null, /*#__PURE__*/_react["default"].createElement(_BackButton["default"], {
+      onClick: onClick
+    })))),
+        container = _render4.container;
+
+    expect(container).toMatchSnapshot();
+  });
+});

package/cjs/Icon/native/Icon.test.js

@@ -0,0 +1 @@
+var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _react=_interopRequireDefault(require("react"));var _reactNative=require("@testing-library/react-native");var _=require("../..");var Circle=function Circle(props){return _react["default"].createElement("svg",props,_react["default"].createElement("circle",{cx:"16",cy:"16",r:"16"}));};describe('Snapshots',function(){it('should match snapshot',function(){var _render=(0,_reactNative.render)(_react["default"].createElement(_.ThemeProvider,null,_react["default"].createElement(_.Icon,{as:Circle,width:"small",height:"small",fill:"stamina"}))),container=_render.container;expect(container).toMatchSnapshot();});it('should match snapshot with size prop',function(){var _render2=(0,_reactNative.render)(_react["default"].createElement(_.ThemeProvider,null,_react["default"].createElement(_.Icon,{as:Circle,size:"small",fill:"stamina"}))),container=_render2.container;expect(container).toMatchSnapshot();});it('should match snapshot with system props',function(){var _render3=(0,_reactNative.render)(_react["default"].createElement(_.ThemeProvider,null,_react["default"].createElement(_.Icon,{as:Circle,size:"small",fill:"stamina",margin:"medium",elevation:"medium"}))),container=_render3.container;expect(container).toMatchSnapshot();});});

package/cjs/Icon/web/Icon.test.js

@@ -0,0 +1,53 @@
+"use strict";
+
+var _react = _interopRequireDefault(require("react"));
+
+var _react2 = require("@testing-library/react");
+
+var _ = require("../..");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+var Circle = function Circle(props) {
+  return /*#__PURE__*/_react["default"].createElement("svg", props, /*#__PURE__*/_react["default"].createElement("circle", {
+    cx: "16",
+    cy: "16",
+    r: "16"
+  }));
+};
+
+describe('Snapshots', function () {
+  it('should match snapshot', function () {
+    var _render = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_.ThemeProvider, null, /*#__PURE__*/_react["default"].createElement(_.Icon, {
+      as: Circle,
+      width: "small",
+      height: "small",
+      fill: "stamina"
+    }))),
+        container = _render.container;
+
+    expect(container).toMatchSnapshot();
+  });
+  it('should match snapshot with size prop', function () {
+    var _render2 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_.ThemeProvider, null, /*#__PURE__*/_react["default"].createElement(_.Icon, {
+      as: Circle,
+      size: "small",
+      fill: "stamina"
+    }))),
+        container = _render2.container;
+
+    expect(container).toMatchSnapshot();
+  });
+  it('should match snapshot with system props', function () {
+    var _render3 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_.ThemeProvider, null, /*#__PURE__*/_react["default"].createElement(_.Icon, {
+      as: Circle,
+      size: "small",
+      fill: "stamina",
+      margin: "medium",
+      elevation: "medium"
+    }))),
+        container = _render3.container;
+
+    expect(container).toMatchSnapshot();
+  });
+});

package/cjs/Input/native/Email.js

@@ -1 +1 @@
-var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports["default"]=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _react=_interopRequireDefault(require("react"));var _Input=_interopRequireDefault(require("./Input"));var Email=function Email(props){return _react["default"].createElement(_Input["default"],(0,_extends2["default"])({},props,{autoCompleteType:"email",autoCapitalize:"none",keyboardType:"email-address",textContentType:"emailAddress"}));};var _default=Email;exports["default"]=_default;
+var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports["default"]=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _react=_interopRequireDefault(require("react"));var _Input=_interopRequireDefault(require("./Input"));var Email=_react["default"].forwardRef(function(props,ref){return _react["default"].createElement(_Input["default"],(0,_extends2["default"])({ref:ref},props,{autoCompleteType:"email",autoCapitalize:"none",keyboardType:"email-address",textContentType:"emailAddress"}));});var _default=Email;exports["default"]=_default;

package/cjs/Input/native/Email.test.js

@@ -0,0 +1 @@
+var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _react=_interopRequireDefault(require("react"));var _reactNative=require("@testing-library/react-native");var _=require("../..");describe('<Input.Email />',function(){describe('Snapshots',function(){it('should match with default input',function(){var _render=(0,_reactNative.render)(_react["default"].createElement(_.ThemeProvider,null,_react["default"].createElement(_.Input.Email,null))),container=_render.container;expect(container).toMatchSnapshot();});});});

package/cjs/Input/native/Helper.js

@@ -1 +1 @@
-var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports["default"]=void 0;var _react=_interopRequireDefault(require("react"));var _styledComponents=_interopRequireDefault(require("styled-components"));var _propTypes=require("prop-types");var _Text=_interopRequireDefault(require("../../Text"));var HelperWrapper=_styledComponents["default"].View(function(_ref){var full=_ref.full,input=_ref.theme.yoga.components.input;return"\n    width: "+(full?'100%':input.width+"px")+";\n    max-width: "+input.width+"px;\n    flex-direction: row;\n    justify-content: space-between;\n\n    margin-top: "+input.helper.margin.top+"px;\n  ";});var Info=(0,_styledComponents["default"])(_Text["default"].Regular)(function(_ref2){var disabled=_ref2.disabled,focused=_ref2.focused,error=_ref2.error,_ref2$theme$yoga=_ref2.theme.yoga,colors=_ref2$theme$yoga.colors,input=_ref2$theme$yoga.components.input;return"\n    flex-wrap: wrap;\n\n    color: "+input.helper.color["default"]+";\n    font-size: "+input.helper.font.size+"px;\n\n    "+(disabled?"color: "+colors.text.disabled+";":'')+"\n    "+(focused?"color: "+input.helper.color.focus+";":'')+"\n    "+(error?"color: "+colors.feedback.attention.dark+";":'')+"\n  ";});var Helper=function Helper(_ref3){var full=_ref3.full,error=_ref3.error,helper=_ref3.helper,disabled=_ref3.disabled,focused=_ref3.focused,maxLength=_ref3.maxLength,length=_ref3.length,hideMaxLength=_ref3.hideMaxLength;return _react["default"].createElement(HelperWrapper,{full:full,disabled:disabled},(error||helper)&&_react["default"].createElement(Info,{disabled:disabled,focused:focused,error:error},error||helper),!hideMaxLength&&maxLength&&_react["default"].createElement(Info,{disabled:disabled,focused:focused,error:error},length,"/",maxLength));};Helper.propTypes={disabled:_propTypes.bool,error:_propTypes.string,focused:_propTypes.bool,full:_propTypes.bool,helper:_propTypes.string,maxLength:_propTypes.number,length:_propTypes.number,hideMaxLength:_propTypes.bool};Helper.defaultProps={disabled:undefined,error:undefined,focused:false,full:false,helper:undefined,maxLength:undefined,length:undefined,hideMaxLength:false};var _default=Helper;exports["default"]=_default;
+var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports["default"]=void 0;var _react=_interopRequireDefault(require("react"));var _styledComponents=_interopRequireDefault(require("styled-components"));var _propTypes=require("prop-types");var _Text=_interopRequireDefault(require("../../Text"));var HelperWrapper=_styledComponents["default"].View(function(_ref){var full=_ref.full,input=_ref.theme.yoga.components.input;return"\n    width: "+(full?'100%':input.width+"px")+";\n    max-width: "+input.width+"px;\n    flex-direction: row;\n    justify-content: space-between;\n\n    margin-top: "+input.helper.margin.top+"px;\n  ";});var Info=(0,_styledComponents["default"])(_Text["default"].Regular)(function(_ref2){var disabled=_ref2.disabled,focused=_ref2.focused,error=_ref2.error,_ref2$theme$yoga=_ref2.theme.yoga,colors=_ref2$theme$yoga.colors,input=_ref2$theme$yoga.components.input;return"\n    flex-wrap: wrap;\n\n    color: "+input.helper.color["default"]+";\n    font-size: "+input.helper.font.size+"px;\n\n    "+(disabled?"color: "+colors.text.disabled+";":'')+"\n    "+(focused?"color: "+input.helper.color.focus+";":'')+"\n    "+(error?"color: "+colors.feedback.attention.dark+";":'')+"\n  ";});var Helper=_react["default"].forwardRef(function(_ref3,ref){var full=_ref3.full,error=_ref3.error,helper=_ref3.helper,disabled=_ref3.disabled,focused=_ref3.focused,maxLength=_ref3.maxLength,length=_ref3.length,hideMaxLength=_ref3.hideMaxLength;return _react["default"].createElement(HelperWrapper,{ref:ref,full:full,disabled:disabled},(error||helper)&&_react["default"].createElement(Info,{disabled:disabled,focused:focused,error:error},error||helper),!hideMaxLength&&maxLength&&_react["default"].createElement(Info,{disabled:disabled,focused:focused,error:error},length,"/",maxLength));});Helper.propTypes={disabled:_propTypes.bool,error:_propTypes.string,focused:_propTypes.bool,full:_propTypes.bool,helper:_propTypes.string,maxLength:_propTypes.number,length:_propTypes.number,hideMaxLength:_propTypes.bool};Helper.defaultProps={disabled:undefined,error:undefined,focused:false,full:false,helper:undefined,maxLength:undefined,length:undefined,hideMaxLength:false};var _default=Helper;exports["default"]=_default;

package/cjs/Input/native/Input.js

@@ -1 +1 @@
-var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports["default"]=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _toConsumableArray2=_interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _propTypes=require("prop-types");var _styledComponents=_interopRequireWildcard(require("styled-components"));var _yogaIcons=require("@gympass/yoga-icons");var _Helper=_interopRequireDefault(require("./Helper"));var _excluded=["cleanable","disabled","error","full","helper","label","maxLength","readOnly","style","textContentType","value","onBlur","onClean","onFocus","hideMaxLength","theme"],_excluded2=["height"];function _getRequireWildcardCache(nodeInterop){if(typeof WeakMap!=="function")return null;var cacheBabelInterop=new WeakMap();var cacheNodeInterop=new WeakMap();return(_getRequireWildcardCache=function _getRequireWildcardCache(nodeInterop){return nodeInterop?cacheNodeInterop:cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj,nodeInterop){if(!nodeInterop&&obj&&obj.__esModule){return obj;}if(obj===null||typeof obj!=="object"&&typeof obj!=="function"){return{"default":obj};}var cache=_getRequireWildcardCache(nodeInterop);if(cache&&cache.has(obj)){return cache.get(obj);}var newObj={};var hasPropertyDescriptor=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var key in obj){if(key!=="default"&&Object.prototype.hasOwnProperty.call(obj,key)){var desc=hasPropertyDescriptor?Object.getOwnPropertyDescriptor(obj,key):null;if(desc&&(desc.get||desc.set)){Object.defineProperty(newObj,key,desc);}else{newObj[key]=obj[key];}}}newObj["default"]=obj;if(cache){cache.set(obj,newObj);}return newObj;}var ICON_SIZE=20;var Wrapper=_styledComponents["default"].View(function(_ref){var full=_ref.full,input=_ref.theme.yoga.components.input;return"\n    position: relative;\n    width: "+(full?'100%':input.width+"px")+";\n  ";});var Field=_styledComponents["default"].TextInput(function(_ref2){var cleanable=_ref2.cleanable,disabled=_ref2.disabled,error=_ref2.error,focus=_ref2.focus,full=_ref2.full,textContentType=_ref2.textContentType,typed=_ref2.typed,_ref2$theme$yoga=_ref2.theme.yoga,baseFont=_ref2$theme$yoga.baseFont,colors=_ref2$theme$yoga.colors,input=_ref2$theme$yoga.components.input;return"\n    width: "+(full?'100%':input.width+"px")+";\n\n    padding-top: "+input.padding.top+"px;\n    padding-right: "+(cleanable||textContentType==='password'?ICON_SIZE+input.padding.right*2:input.padding.right)+"px;\n    padding-bottom: "+input.padding.bottom+"px;\n    padding-left: "+input.padding.left+"px;\n\n    border-radius: "+input.border.radius+"px;\n    border: "+input.border.width+"px solid "+input.border.color["default"]+";\n\n    color: "+input.font.color["default"]+";\n    font-family: "+baseFont.family+";\n    font-size: "+input.font.size+"px;\n\n    "+(focus?"border-color: "+input.border.color.typed+";":'')+"\n    "+(focus||typed?"color: "+input.font.color.focus+";":'')+"\n    "+(error?"border-color: "+colors.feedback.attention[1]+";":'')+"\n\n    "+(disabled?"\n          border-color: "+colors.elements.lineAndBorders+";\n          color: "+colors.text.disabled+";\n        ":'')+"\n  ";});var LabelWrapper=(0,_styledComponents["default"])(_reactNative.Animated.View)(function(_ref3){var focus=_ref3.focus,typed=_ref3.typed,input=_ref3.theme.yoga.components.input;return"\n    position: absolute;\n    left: "+input.padding.left+"px;\n\n    transform: translateY(-"+input.padding.top/2+"px);\n\n    "+(focus||typed?"left: "+(input.padding.left-2)+"px;":'')+"\n  ";});var Label=(0,_styledComponents["default"])(_reactNative.Animated.Text)(function(_ref4){var disabled=_ref4.disabled,error=_ref4.error,focus=_ref4.focus,typed=_ref4.typed,_ref4$theme$yoga=_ref4.theme.yoga,colors=_ref4$theme$yoga.colors,baseFont=_ref4$theme$yoga.baseFont,input=_ref4$theme$yoga.components.input;return"\n    background-color: "+colors.white+";\n\n    font-family: "+baseFont.family+";\n    color: "+input.label.color["default"]+";\n\n    "+(focus?"\n          color: "+input.label.color.focus+";\n        ":'')+"\n\n    "+(focus||typed?"\n        padding-right: "+input.label.padding.right+"px;\n        padding-left: "+input.label.padding.left+"px;\n      ":'')+"\n\n    "+(error?"color: "+colors.feedback.attention[1]+";":'')+"\n    "+(disabled?"color: "+colors.text.disabled+";":'')+"\n  ";});var CloseIcon=_styledComponents["default"].View(function(_ref5){var spacing=_ref5.theme.yoga.spacing;return"\n    position: absolute;\n    top: 0px;\n    right: 0px;\n\n    padding-right: "+spacing.small+"px;\n    padding-left: "+spacing.small+"px;\n  ";});var Input=function Input(_ref6){var cleanable=_ref6.cleanable,disabled=_ref6.disabled,error=_ref6.error,full=_ref6.full,helper=_ref6.helper,label=_ref6.label,maxLength=_ref6.maxLength,readOnly=_ref6.readOnly,style=_ref6.style,textContentType=_ref6.textContentType,value=_ref6.value,_onBlur=_ref6.onBlur,onClean=_ref6.onClean,_onFocus=_ref6.onFocus,hideMaxLength=_ref6.hideMaxLength,_ref6$theme$yoga=_ref6.theme.yoga,colors=_ref6$theme$yoga.colors,transition=_ref6$theme$yoga.transition,input=_ref6$theme$yoga.components.input,props=(0,_objectWithoutProperties2["default"])(_ref6,_excluded);var _useState=(0,_react.useState)(false),_useState2=(0,_slicedToArray2["default"])(_useState,2),focused=_useState2[0],setFocused=_useState2[1];var _useState3=(0,_react.useState)(Boolean(value)),_useState4=(0,_slicedToArray2["default"])(_useState3,2),typed=_useState4[0],setTyped=_useState4[1];(0,_react.useEffect)(function(){setTyped(Boolean(value));},[value]);var iconColor=function iconColor(){if(disabled){return colors.elements.backgroundAndDisabled;}if(focused){return input.font.color.focus;}return input.font.color["default"];};var _useState5=(0,_react.useState)(new _reactNative.Animated.Value(input.padding.top*1.5)),_useState6=(0,_slicedToArray2["default"])(_useState5,1),labelTopAnimation=_useState6[0];var _useState7=(0,_react.useState)(new _reactNative.Animated.Value(input.label.font.size["default"])),_useState8=(0,_slicedToArray2["default"])(_useState7,1),fontSizeAnimation=_useState8[0];var animate=function animate(animation,toValue){return _reactNative.Animated.timing(animation,{toValue:toValue,duration:transition.duration[1],easing:_reactNative.Easing.bezier.apply(_reactNative.Easing,(0,_toConsumableArray2["default"])(transition.timing[0])),useNativeDriver:false}).start();};(0,_react.useEffect)(function(){var shouldAnimate=typed||focused;animate(labelTopAnimation,shouldAnimate?1:input.padding.top*1.5);animate(fontSizeAnimation,shouldAnimate?input.label.font.size.typed:input.label.font.size["default"]);},[focused,typed]);var _ref7=Array.isArray(style)?Object.assign.apply(Object,[{}].concat((0,_toConsumableArray2["default"])(style))):style,_ref7$height=_ref7.height,height=_ref7$height===void 0?input.height:_ref7$height,styles=(0,_objectWithoutProperties2["default"])(_ref7,_excluded2);return _react["default"].createElement(Wrapper,{full:full,style:styles},_react["default"].createElement(Field,(0,_extends2["default"])({},props,{cleanable:cleanable,disabled:disabled,editable:!(readOnly||disabled),error:error,focus:focused,full:full,maxLength:maxLength,style:{height:height},textContentType:textContentType,typed:typed,value:value,onFocus:function onFocus(e){setFocused(true);_onFocus(e);},onBlur:function onBlur(e){setFocused(false);_onBlur(e);}})),Boolean(label)&&_react["default"].createElement(LabelWrapper,{focus:focused,pointerEvents:"none",typed:typed,style:{top:labelTopAnimation}},_react["default"].createElement(Label,{disabled:disabled,error:error,focus:focused,typed:typed,style:{fontSize:fontSizeAnimation}},label)),cleanable&&typed&&_react["default"].createElement(_reactNative.TouchableWithoutFeedback,{accessibilityRole:"button",onPress:function onPress(){if(disabled)return;onClean('');}},_react["default"].createElement(CloseIcon,null,_react["default"].createElement(_yogaIcons.Close,{height:input.height,width:20,fill:iconColor()}))),(helper||maxLength||error)&&_react["default"].createElement(_Helper["default"],{full:full,error:error,helper:helper,focused:focused,disabled:disabled,maxLength:maxLength,length:value.length,hideMaxLength:hideMaxLength}));};Input.propTypes={cleanable:_propTypes.bool,disabled:_propTypes.bool,error:_propTypes.string,full:_propTypes.bool,helper:_propTypes.string,label:_propTypes.string,maxLength:_propTypes.number,readOnly:_propTypes.bool,textContentType:_propTypes.string,value:(0,_propTypes.oneOfType)([_propTypes.string,_propTypes.number]),style:(0,_propTypes.oneOfType)([(0,_propTypes.shape)({}),(0,_propTypes.arrayOf)((0,_propTypes.shape)({}))]),onBlur:_propTypes.func,onClean:_propTypes.func,onFocus:_propTypes.func,hideMaxLength:_propTypes.bool};Input.defaultProps={cleanable:true,disabled:false,error:undefined,full:false,helper:undefined,label:'',maxLength:undefined,readOnly:false,style:{},textContentType:undefined,value:'',onBlur:function onBlur(){},onClean:function onClean(){},onFocus:function onFocus(){},hideMaxLength:false};var _default=(0,_styledComponents.withTheme)(Input);exports["default"]=_default;
+var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports["default"]=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _toConsumableArray2=_interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _propTypes=require("prop-types");var _styledComponents=_interopRequireWildcard(require("styled-components"));var _yogaIcons=require("@gympass/yoga-icons");var _Helper=_interopRequireDefault(require("./Helper"));var _excluded=["cleanable","disabled","error","full","helper","label","maxLength","readOnly","style","textContentType","value","onBlur","onClean","onFocus","hideMaxLength","theme"],_excluded2=["height"];function _getRequireWildcardCache(nodeInterop){if(typeof WeakMap!=="function")return null;var cacheBabelInterop=new WeakMap();var cacheNodeInterop=new WeakMap();return(_getRequireWildcardCache=function _getRequireWildcardCache(nodeInterop){return nodeInterop?cacheNodeInterop:cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj,nodeInterop){if(!nodeInterop&&obj&&obj.__esModule){return obj;}if(obj===null||typeof obj!=="object"&&typeof obj!=="function"){return{"default":obj};}var cache=_getRequireWildcardCache(nodeInterop);if(cache&&cache.has(obj)){return cache.get(obj);}var newObj={};var hasPropertyDescriptor=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var key in obj){if(key!=="default"&&Object.prototype.hasOwnProperty.call(obj,key)){var desc=hasPropertyDescriptor?Object.getOwnPropertyDescriptor(obj,key):null;if(desc&&(desc.get||desc.set)){Object.defineProperty(newObj,key,desc);}else{newObj[key]=obj[key];}}}newObj["default"]=obj;if(cache){cache.set(obj,newObj);}return newObj;}var ICON_SIZE=20;var Wrapper=_styledComponents["default"].View(function(_ref){var full=_ref.full,input=_ref.theme.yoga.components.input;return"\n    position: relative;\n    width: "+(full?'100%':input.width+"px")+";\n  ";});var Field=_styledComponents["default"].TextInput(function(_ref2){var cleanable=_ref2.cleanable,disabled=_ref2.disabled,error=_ref2.error,focus=_ref2.focus,full=_ref2.full,textContentType=_ref2.textContentType,typed=_ref2.typed,_ref2$theme$yoga=_ref2.theme.yoga,baseFont=_ref2$theme$yoga.baseFont,colors=_ref2$theme$yoga.colors,input=_ref2$theme$yoga.components.input;return"\n    width: "+(full?'100%':input.width+"px")+";\n\n    padding-top: "+input.padding.top+"px;\n    padding-right: "+(cleanable||textContentType==='password'?ICON_SIZE+input.padding.right*2:input.padding.right)+"px;\n    padding-bottom: "+input.padding.bottom+"px;\n    padding-left: "+input.padding.left+"px;\n\n    border-radius: "+input.border.radius+"px;\n    border: "+input.border.width+"px solid "+input.border.color["default"]+";\n\n    color: "+input.font.color["default"]+";\n    font-family: "+baseFont.family+";\n    font-size: "+input.font.size+"px;\n\n    "+(focus?"border-color: "+input.border.color.typed+";":'')+"\n    "+(focus||typed?"color: "+input.font.color.focus+";":'')+"\n    "+(error?"border-color: "+colors.feedback.attention[1]+";":'')+"\n\n    "+(disabled?"\n          border-color: "+colors.elements.lineAndBorders+";\n          color: "+colors.text.disabled+";\n        ":'')+"\n  ";});var LabelWrapper=(0,_styledComponents["default"])(_reactNative.Animated.View)(function(_ref3){var focus=_ref3.focus,typed=_ref3.typed,input=_ref3.theme.yoga.components.input;return"\n    position: absolute;\n    left: "+input.padding.left+"px;\n\n    transform: translateY(-"+input.padding.top/2+"px);\n\n    "+(focus||typed?"left: "+(input.padding.left-2)+"px;":'')+"\n  ";});var Label=(0,_styledComponents["default"])(_reactNative.Animated.Text)(function(_ref4){var disabled=_ref4.disabled,error=_ref4.error,focus=_ref4.focus,typed=_ref4.typed,_ref4$theme$yoga=_ref4.theme.yoga,colors=_ref4$theme$yoga.colors,baseFont=_ref4$theme$yoga.baseFont,input=_ref4$theme$yoga.components.input;return"\n    background-color: "+colors.white+";\n\n    font-family: "+baseFont.family+";\n    color: "+input.label.color["default"]+";\n\n    "+(focus?"\n          color: "+input.label.color.focus+";\n        ":'')+"\n\n    "+(focus||typed?"\n        padding-right: "+input.label.padding.right+"px;\n        padding-left: "+input.label.padding.left+"px;\n      ":'')+"\n\n    "+(error?"color: "+colors.feedback.attention[1]+";":'')+"\n    "+(disabled?"color: "+colors.text.disabled+";":'')+"\n  ";});var CloseIcon=_styledComponents["default"].View(function(_ref5){var spacing=_ref5.theme.yoga.spacing;return"\n    position: absolute;\n    top: 0px;\n    right: 0px;\n\n    padding-right: "+spacing.small+"px;\n    padding-left: "+spacing.small+"px;\n  ";});var Input=_react["default"].forwardRef(function(_ref6,ref){var cleanable=_ref6.cleanable,disabled=_ref6.disabled,error=_ref6.error,full=_ref6.full,helper=_ref6.helper,label=_ref6.label,maxLength=_ref6.maxLength,readOnly=_ref6.readOnly,style=_ref6.style,textContentType=_ref6.textContentType,value=_ref6.value,_onBlur=_ref6.onBlur,onClean=_ref6.onClean,_onFocus=_ref6.onFocus,hideMaxLength=_ref6.hideMaxLength,_ref6$theme$yoga=_ref6.theme.yoga,colors=_ref6$theme$yoga.colors,transition=_ref6$theme$yoga.transition,input=_ref6$theme$yoga.components.input,props=(0,_objectWithoutProperties2["default"])(_ref6,_excluded);var inputRef=ref||(0,_react.useRef)(null);var _useState=(0,_react.useState)(false),_useState2=(0,_slicedToArray2["default"])(_useState,2),focused=_useState2[0],setFocused=_useState2[1];var _useState3=(0,_react.useState)(Boolean(value)),_useState4=(0,_slicedToArray2["default"])(_useState3,2),typed=_useState4[0],setTyped=_useState4[1];(0,_react.useEffect)(function(){setTyped(Boolean(value));},[value]);var iconColor=function iconColor(){if(disabled){return colors.elements.backgroundAndDisabled;}if(focused){return input.font.color.focus;}return input.font.color["default"];};var _useState5=(0,_react.useState)(new _reactNative.Animated.Value(input.padding.top*1.5)),_useState6=(0,_slicedToArray2["default"])(_useState5,1),labelTopAnimation=_useState6[0];var _useState7=(0,_react.useState)(new _reactNative.Animated.Value(input.label.font.size["default"])),_useState8=(0,_slicedToArray2["default"])(_useState7,1),fontSizeAnimation=_useState8[0];var animate=function animate(animation,toValue){return _reactNative.Animated.timing(animation,{toValue:toValue,duration:transition.duration[1],easing:_reactNative.Easing.bezier.apply(_reactNative.Easing,(0,_toConsumableArray2["default"])(transition.timing[0])),useNativeDriver:false}).start();};(0,_react.useEffect)(function(){var shouldAnimate=typed||focused;animate(labelTopAnimation,shouldAnimate?1:input.padding.top*1.5);animate(fontSizeAnimation,shouldAnimate?input.label.font.size.typed:input.label.font.size["default"]);},[focused,typed]);var _ref7=Array.isArray(style)?Object.assign.apply(Object,[{}].concat((0,_toConsumableArray2["default"])(style))):style,_ref7$height=_ref7.height,height=_ref7$height===void 0?input.height:_ref7$height,styles=(0,_objectWithoutProperties2["default"])(_ref7,_excluded2);return _react["default"].createElement(Wrapper,{full:full,style:styles},_react["default"].createElement(Field,(0,_extends2["default"])({},props,{cleanable:cleanable,disabled:disabled,editable:!(readOnly||disabled),error:error,focus:focused,full:full,maxLength:maxLength,style:{height:height},textContentType:textContentType,typed:typed,value:value,onFocus:function onFocus(e){setFocused(true);_onFocus(e);},onBlur:function onBlur(e){setFocused(false);_onBlur(e);},ref:inputRef})),Boolean(label)&&_react["default"].createElement(LabelWrapper,{focus:focused,pointerEvents:"none",typed:typed,style:{top:labelTopAnimation}},_react["default"].createElement(Label,{disabled:disabled,error:error,focus:focused,typed:typed,style:{fontSize:fontSizeAnimation}},label)),cleanable&&typed&&_react["default"].createElement(_reactNative.TouchableWithoutFeedback,{accessibilityRole:"button",onPress:function onPress(){if(disabled)return;onClean('');}},_react["default"].createElement(CloseIcon,null,_react["default"].createElement(_yogaIcons.Close,{height:input.height,width:20,fill:iconColor()}))),(helper||maxLength||error)&&_react["default"].createElement(_Helper["default"],{full:full,error:error,helper:helper,focused:focused,disabled:disabled,maxLength:maxLength,length:value.length,hideMaxLength:hideMaxLength}));});Input.propTypes={cleanable:_propTypes.bool,disabled:_propTypes.bool,error:_propTypes.string,full:_propTypes.bool,helper:_propTypes.string,label:_propTypes.string,maxLength:_propTypes.number,readOnly:_propTypes.bool,textContentType:_propTypes.string,value:(0,_propTypes.oneOfType)([_propTypes.string,_propTypes.number]),style:(0,_propTypes.oneOfType)([(0,_propTypes.shape)({}),(0,_propTypes.arrayOf)((0,_propTypes.shape)({}))]),onBlur:_propTypes.func,onClean:_propTypes.func,onFocus:_propTypes.func,hideMaxLength:_propTypes.bool};Input.defaultProps={cleanable:true,disabled:false,error:undefined,full:false,helper:undefined,label:'',maxLength:undefined,readOnly:false,style:{},textContentType:undefined,value:'',onBlur:function onBlur(){},onClean:function onClean(){},onFocus:function onFocus(){},hideMaxLength:false};var _default=(0,_styledComponents.withTheme)(Input);exports["default"]=_default;

package/cjs/Input/native/Input.test.js

@@ -0,0 +1 @@
+var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _react=_interopRequireDefault(require("react"));var _reactNative=require("@testing-library/react-native");var _=require("../..");describe('<Input />',function(){describe('Snapshots',function(){it('should match with default input',function(){var _render=(0,_reactNative.render)(_react["default"].createElement(_.ThemeProvider,null,_react["default"].createElement(_.Input,null))),container=_render.container;expect(container).toMatchSnapshot();});it('should match with label',function(){var _render2=(0,_reactNative.render)(_react["default"].createElement(_.ThemeProvider,null,_react["default"].createElement(_.Input,{label:"Input"}))),container=_render2.container;expect(container).toMatchSnapshot();});it('should match when input is focused',function(){var _render3=(0,_reactNative.render)(_react["default"].createElement(_.ThemeProvider,null,_react["default"].createElement(_.Input,{label:"Input",testID:"input"}))),container=_render3.container,getByTestId=_render3.getByTestId;_reactNative.fireEvent.focus(getByTestId('input'));expect(container).toMatchSnapshot();});it('should match with disabled input',function(){var _render4=(0,_reactNative.render)(_react["default"].createElement(_.ThemeProvider,null,_react["default"].createElement(_.Input,{disabled:true}))),container=_render4.container;expect(container).toMatchSnapshot();});it('should match with error',function(){var _render5=(0,_reactNative.render)(_react["default"].createElement(_.ThemeProvider,null,_react["default"].createElement(_.Input,{error:"Error message"}))),container=_render5.container;expect(container).toMatchSnapshot();});it('should match with helper text and max length',function(){var _render6=(0,_reactNative.render)(_react["default"].createElement(_.ThemeProvider,null,_react["default"].createElement(_.Input,{helper:"Helper text",maxLength:20}))),container=_render6.container;expect(container).toMatchSnapshot();});it('should match with helper text, max length and hideMaxLength',function(){var _render7=(0,_reactNative.render)(_react["default"].createElement(_.ThemeProvider,null,_react["default"].createElement(_.Input,{helper:"Helper text",maxLength:20,hideMaxLength:true}))),container=_render7.container;expect(container).toMatchSnapshot();});it('should match with full width',function(){var _render8=(0,_reactNative.render)(_react["default"].createElement(_.ThemeProvider,null,_react["default"].createElement(_.Input,{label:"Label",full:true}))),container=_render8.container;expect(container).toMatchSnapshot();});});describe('Events',function(){it('should call onChangeText',function(){var onChangeTextMock=jest.fn();var _render9=(0,_reactNative.render)(_react["default"].createElement(_.ThemeProvider,null,_react["default"].createElement(_.Input,{label:"Input",testID:"input",onChangeText:onChangeTextMock}))),getByTestId=_render9.getByTestId;_reactNative.fireEvent.changeText(getByTestId('input'),'foo');expect(onChangeTextMock).toHaveBeenCalled();});it('should not call onChangeText when input is disabled',function(){var onChangeTextMock=jest.fn();var _render10=(0,_reactNative.render)(_react["default"].createElement(_.ThemeProvider,null,_react["default"].createElement(_.Input,{label:"Input",testID:"input",onChangeText:onChangeTextMock,disabled:true}))),getByTestId=_render10.getByTestId;_reactNative.fireEvent.changeText(getByTestId('input'),'foo');expect(onChangeTextMock).not.toHaveBeenCalled();});it('should call onFocus',function(){var onFocusMock=jest.fn();var _render11=(0,_reactNative.render)(_react["default"].createElement(_.ThemeProvider,null,_react["default"].createElement(_.Input,{label:"Input",testID:"input",onFocus:onFocusMock}))),getByTestId=_render11.getByTestId;_reactNative.fireEvent.focus(getByTestId('input'));expect(onFocusMock).toHaveBeenCalled();});it('should call onBlur',function(){var onBlurMock=jest.fn();var _render12=(0,_reactNative.render)(_react["default"].createElement(_.ThemeProvider,null,_react["default"].createElement(_.Input,{label:"Input",testID:"input",onBlur:onBlurMock}))),getByTestId=_render12.getByTestId;_reactNative.fireEvent.focus(getByTestId('input'));_reactNative.fireEvent.blur(getByTestId('input'));expect(onBlurMock).toHaveBeenCalled();});});describe('maxLength',function(){it('should update maxLength counter when add character',function(){var _render13=(0,_reactNative.render)(_react["default"].createElement(_.ThemeProvider,null,_react["default"].createElement(_.Input,{label:"Input",testID:"input",maxLength:10}))),getByText=_render13.getByText,rerender=_render13.rerender;expect(getByText('0/10').children.join('')).toBe('0/10');rerender(_react["default"].createElement(_.ThemeProvider,null,_react["default"].createElement(_.Input,{label:"Input",value:"foo",maxLength:10})));expect(getByText('3/10').children.join('')).toBe('3/10');});});describe('clean button',function(){it('should call onClean when press clean button',function(){var onCleanMock=jest.fn();var _render14=(0,_reactNative.render)(_react["default"].createElement(_.ThemeProvider,null,_react["default"].createElement(_.Input,{label:"Input",value:"foo",onClean:onCleanMock}))),getByRole=_render14.getByRole;_reactNative.fireEvent.press(getByRole('button'));expect(onCleanMock).toHaveBeenCalledWith('');});it('should test if clean button is present',function(){var _render15=(0,_reactNative.render)(_react["default"].createElement(_.ThemeProvider,null,_react["default"].createElement(_.Input,{label:"Input"}))),rerender=_render15.rerender,queryByRole=_render15.queryByRole;expect(queryByRole('button')).toBeNull();rerender(_react["default"].createElement(_.ThemeProvider,null,_react["default"].createElement(_.Input,{label:"Input",value:"foo"})));expect(queryByRole('button')).not.toBeNull();});});});

package/cjs/Input/native/Number.js

@@ -1 +1 @@
-var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports["default"]=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _react=_interopRequireDefault(require("react"));var _Input=_interopRequireDefault(require("./Input"));var InputNumber=function InputNumber(props){return _react["default"].createElement(_Input["default"],(0,_extends2["default"])({},props,{keyboardType:"numeric"}));};var _default=InputNumber;exports["default"]=_default;
+var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports["default"]=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _react=_interopRequireDefault(require("react"));var _Input=_interopRequireDefault(require("./Input"));var InputNumber=_react["default"].forwardRef(function(props,ref){return _react["default"].createElement(_Input["default"],(0,_extends2["default"])({ref:ref},props,{keyboardType:"numeric"}));});var _default=InputNumber;exports["default"]=_default;

package/cjs/Input/native/Number.test.js

@@ -0,0 +1 @@
+var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _react=_interopRequireDefault(require("react"));var _reactNative=require("@testing-library/react-native");var _=require("../..");describe('<Input.Number />',function(){describe('Snapshots',function(){it('should match with default input',function(){var _render=(0,_reactNative.render)(_react["default"].createElement(_.ThemeProvider,null,_react["default"].createElement(_.Input.Number,null))),container=_render.container;expect(container).toMatchSnapshot();});});});

package/cjs/Input/native/Password.js

@@ -1 +1 @@
-var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports["default"]=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _styledComponents=_interopRequireWildcard(require("styled-components"));var _propTypes=require("prop-types");var _yogaIcons=require("@gympass/yoga-icons");var _Input=_interopRequireDefault(require("./Input"));var _excluded=["disabled","style","full","onBlur","onFocus","theme"];function _getRequireWildcardCache(nodeInterop){if(typeof WeakMap!=="function")return null;var cacheBabelInterop=new WeakMap();var cacheNodeInterop=new WeakMap();return(_getRequireWildcardCache=function _getRequireWildcardCache(nodeInterop){return nodeInterop?cacheNodeInterop:cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj,nodeInterop){if(!nodeInterop&&obj&&obj.__esModule){return obj;}if(obj===null||typeof obj!=="object"&&typeof obj!=="function"){return{"default":obj};}var cache=_getRequireWildcardCache(nodeInterop);if(cache&&cache.has(obj)){return cache.get(obj);}var newObj={};var hasPropertyDescriptor=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var key in obj){if(key!=="default"&&Object.prototype.hasOwnProperty.call(obj,key)){var desc=hasPropertyDescriptor?Object.getOwnPropertyDescriptor(obj,key):null;if(desc&&(desc.get||desc.set)){Object.defineProperty(newObj,key,desc);}else{newObj[key]=obj[key];}}}newObj["default"]=obj;if(cache){cache.set(obj,newObj);}return newObj;}var Wrapper=_styledComponents["default"].View(function(_ref){var full=_ref.full,input=_ref.theme.yoga.components.input;return"\n    position: relative;\n\n    width: "+(full?'100%':input.width+"px")+";\n  ";});var IconWrapper=_styledComponents["default"].View(function(_ref2){var spacing=_ref2.theme.yoga.spacing;return"\n    position: absolute;\n    top: 0;\n    right: 0;\n\n    padding-right: "+spacing.small+"px;\n    padding-left: "+spacing.xxsmall+"px;\n  ";});var Password=function Password(_ref3){var disabled=_ref3.disabled,style=_ref3.style,full=_ref3.full,_onBlur=_ref3.onBlur,_onFocus=_ref3.onFocus,_ref3$theme$yoga=_ref3.theme.yoga,colors=_ref3$theme$yoga.colors,input=_ref3$theme$yoga.components.input,props=(0,_objectWithoutProperties2["default"])(_ref3,_excluded);var _useState=(0,_react.useState)(false),_useState2=(0,_slicedToArray2["default"])(_useState,2),showPassword=_useState2[0],toggleShowPassword=_useState2[1];var _useState3=(0,_react.useState)(false),_useState4=(0,_slicedToArray2["default"])(_useState3,2),focused=_useState4[0],setFocused=_useState4[1];var iconColor=function iconColor(){if(disabled){return colors.elements.backgroundAndDisabled;}if(focused){return input.font.color.focus;}return input.font.color["default"];};return _react["default"].createElement(Wrapper,{style:style,full:full},_react["default"].createElement(_Input["default"],(0,_extends2["default"])({},props,{autoCompleteType:"password",blurOnSubmit:false,cleanable:false,clearTextOnFocus:false,disabled:disabled,full:full,secureTextEntry:!showPassword,textContentType:"password",onSubmitEditing:function onSubmitEditing(){return _reactNative.Keyboard.dismiss();},onBlur:function onBlur(e){setFocused(false);_onBlur(e);},onFocus:function onFocus(e){setFocused(true);_onFocus(e);}})),_react["default"].createElement(_reactNative.TouchableWithoutFeedback,{accessibilityRole:"button",onPress:function onPress(){if(disabled)return;toggleShowPassword(!showPassword);}},_react["default"].createElement(IconWrapper,{disabled:disabled},showPassword?_react["default"].createElement(_yogaIcons.Visibility,{height:input.height,width:20,fill:iconColor()}):_react["default"].createElement(_yogaIcons.VisibilityOff,{height:input.height,width:20,fill:iconColor()}))));};Password.propTypes={disabled:_propTypes.bool,full:_propTypes.bool,style:(0,_propTypes.shape)({}),onBlur:_propTypes.func,onFocus:_propTypes.func};Password.defaultProps={disabled:false,full:false,style:undefined,onBlur:function onBlur(){},onFocus:function onFocus(){}};var _default=(0,_styledComponents.withTheme)(Password);exports["default"]=_default;
+var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports["default"]=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _styledComponents=_interopRequireWildcard(require("styled-components"));var _propTypes=require("prop-types");var _yogaIcons=require("@gympass/yoga-icons");var _Input=_interopRequireDefault(require("./Input"));var _excluded=["disabled","style","full","onBlur","onFocus","theme"];function _getRequireWildcardCache(nodeInterop){if(typeof WeakMap!=="function")return null;var cacheBabelInterop=new WeakMap();var cacheNodeInterop=new WeakMap();return(_getRequireWildcardCache=function _getRequireWildcardCache(nodeInterop){return nodeInterop?cacheNodeInterop:cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj,nodeInterop){if(!nodeInterop&&obj&&obj.__esModule){return obj;}if(obj===null||typeof obj!=="object"&&typeof obj!=="function"){return{"default":obj};}var cache=_getRequireWildcardCache(nodeInterop);if(cache&&cache.has(obj)){return cache.get(obj);}var newObj={};var hasPropertyDescriptor=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var key in obj){if(key!=="default"&&Object.prototype.hasOwnProperty.call(obj,key)){var desc=hasPropertyDescriptor?Object.getOwnPropertyDescriptor(obj,key):null;if(desc&&(desc.get||desc.set)){Object.defineProperty(newObj,key,desc);}else{newObj[key]=obj[key];}}}newObj["default"]=obj;if(cache){cache.set(obj,newObj);}return newObj;}var Wrapper=_styledComponents["default"].View(function(_ref){var full=_ref.full,input=_ref.theme.yoga.components.input;return"\n    position: relative;\n\n    width: "+(full?'100%':input.width+"px")+";\n  ";});var IconWrapper=_styledComponents["default"].View(function(_ref2){var spacing=_ref2.theme.yoga.spacing;return"\n    position: absolute;\n    top: 0;\n    right: 0;\n\n    padding-right: "+spacing.small+"px;\n    padding-left: "+spacing.xxsmall+"px;\n  ";});var Password=_react["default"].forwardRef(function(_ref3,ref){var disabled=_ref3.disabled,style=_ref3.style,full=_ref3.full,_onBlur=_ref3.onBlur,_onFocus=_ref3.onFocus,_ref3$theme$yoga=_ref3.theme.yoga,colors=_ref3$theme$yoga.colors,input=_ref3$theme$yoga.components.input,props=(0,_objectWithoutProperties2["default"])(_ref3,_excluded);var _useState=(0,_react.useState)(false),_useState2=(0,_slicedToArray2["default"])(_useState,2),showPassword=_useState2[0],toggleShowPassword=_useState2[1];var _useState3=(0,_react.useState)(false),_useState4=(0,_slicedToArray2["default"])(_useState3,2),focused=_useState4[0],setFocused=_useState4[1];var iconColor=function iconColor(){if(disabled){return colors.elements.backgroundAndDisabled;}if(focused){return input.font.color.focus;}return input.font.color["default"];};return _react["default"].createElement(Wrapper,{style:style,full:full},_react["default"].createElement(_Input["default"],(0,_extends2["default"])({ref:ref},props,{autoCompleteType:"password",blurOnSubmit:false,cleanable:false,clearTextOnFocus:false,disabled:disabled,full:full,secureTextEntry:!showPassword,textContentType:"password",onSubmitEditing:function onSubmitEditing(){return _reactNative.Keyboard.dismiss();},onBlur:function onBlur(e){setFocused(false);_onBlur(e);},onFocus:function onFocus(e){setFocused(true);_onFocus(e);}})),_react["default"].createElement(_reactNative.TouchableWithoutFeedback,{accessibilityRole:"button",onPress:function onPress(){if(disabled)return;toggleShowPassword(!showPassword);}},_react["default"].createElement(IconWrapper,{disabled:disabled},showPassword?_react["default"].createElement(_yogaIcons.Visibility,{height:input.height,width:20,fill:iconColor()}):_react["default"].createElement(_yogaIcons.VisibilityOff,{height:input.height,width:20,fill:iconColor()}))));});Password.propTypes={disabled:_propTypes.bool,full:_propTypes.bool,style:(0,_propTypes.shape)({}),onBlur:_propTypes.func,onFocus:_propTypes.func};Password.defaultProps={disabled:false,full:false,style:undefined,onBlur:function onBlur(){},onFocus:function onFocus(){}};var _default=(0,_styledComponents.withTheme)(Password);exports["default"]=_default;

package/cjs/Input/native/Password.test.js

@@ -0,0 +1 @@
+var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _react=_interopRequireDefault(require("react"));var _reactNative=require("@testing-library/react-native");var _=require("../..");describe('<Input.Password />',function(){describe('Snapshots',function(){it('should match with default input',function(){var _render=(0,_reactNative.render)(_react["default"].createElement(_.ThemeProvider,null,_react["default"].createElement(_.Input.Password,null))),container=_render.container;expect(container).toMatchSnapshot();});it('should match when input is focused',function(){var _render2=(0,_reactNative.render)(_react["default"].createElement(_.ThemeProvider,null,_react["default"].createElement(_.Input.Password,{label:"Input",testID:"input"}))),container=_render2.container,getByTestId=_render2.getByTestId;_reactNative.fireEvent.focus(getByTestId('input'));expect(container).toMatchSnapshot();});it('should match with disabled input',function(){var _render3=(0,_reactNative.render)(_react["default"].createElement(_.ThemeProvider,null,_react["default"].createElement(_.Input.Password,{disabled:true}))),container=_render3.container;expect(container).toMatchSnapshot();});it('should match with full width',function(){var _render4=(0,_reactNative.render)(_react["default"].createElement(_.ThemeProvider,null,_react["default"].createElement(_.Input.Password,{label:"Label",full:true}))),container=_render4.container;expect(container).toMatchSnapshot();});});describe('Events',function(){it('should call onChangeText',function(){var onChangeTextMock=jest.fn();var _render5=(0,_reactNative.render)(_react["default"].createElement(_.ThemeProvider,null,_react["default"].createElement(_.Input.Password,{label:"Input",testID:"input",onChangeText:onChangeTextMock}))),getByTestId=_render5.getByTestId;_reactNative.fireEvent.changeText(getByTestId('input'),'foo');expect(onChangeTextMock).toHaveBeenCalled();});it('should not call onChangeText when input is readOnly',function(){var onChangeTextMock=jest.fn();var _render6=(0,_reactNative.render)(_react["default"].createElement(_.ThemeProvider,null,_react["default"].createElement(_.Input.Password,{label:"Input",testID:"input",onChangeText:onChangeTextMock,readOnly:true}))),getByTestId=_render6.getByTestId;_reactNative.fireEvent.focus(getByTestId('input'));expect(onChangeTextMock).not.toHaveBeenCalled();});it('should not call onChangeText when input is disabled',function(){var onChangeTextMock=jest.fn();var _render7=(0,_reactNative.render)(_react["default"].createElement(_.ThemeProvider,null,_react["default"].createElement(_.Input.Password,{label:"Input",testID:"input",onChangeText:onChangeTextMock,disabled:true}))),getByTestId=_render7.getByTestId;_reactNative.fireEvent.changeText(getByTestId('input'),'foo');expect(onChangeTextMock).not.toHaveBeenCalled();});it('should call onFocus',function(){var onFocusMock=jest.fn();var _render8=(0,_reactNative.render)(_react["default"].createElement(_.ThemeProvider,null,_react["default"].createElement(_.Input.Password,{label:"Input",testID:"input",onFocus:onFocusMock}))),getByTestId=_render8.getByTestId;_reactNative.fireEvent.focus(getByTestId('input'));expect(onFocusMock).toHaveBeenCalled();});it('should call onBlur',function(){var onBlurMock=jest.fn();var _render9=(0,_reactNative.render)(_react["default"].createElement(_.ThemeProvider,null,_react["default"].createElement(_.Input.Password,{label:"Input",testID:"input",onBlur:onBlurMock}))),getByTestId=_render9.getByTestId;_reactNative.fireEvent.focus(getByTestId('input'));_reactNative.fireEvent.blur(getByTestId('input'));expect(onBlurMock).toHaveBeenCalled();});});describe('visibility button',function(){it('should toggle password visibility when press visibility button',function(){var _render10=(0,_reactNative.render)(_react["default"].createElement(_.ThemeProvider,null,_react["default"].createElement(_.Input.Password,{label:"Input",testID:"input"}))),getByRole=_render10.getByRole,getByTestId=_render10.getByTestId;expect(getByTestId('input').props.secureTextEntry).toBe(true);_reactNative.fireEvent.press(getByRole('button'));expect(getByTestId('input').props.secureTextEntry).toBe(false);});});});

package/cjs/Input/native/Tel.js

@@ -1 +1 @@
-var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports["default"]=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _react=_interopRequireDefault(require("react"));var _Input=_interopRequireDefault(require("./Input"));var Tel=function Tel(props){return _react["default"].createElement(_Input["default"],(0,_extends2["default"])({},props,{keyboardType:"phone-pad",autoCompleteType:"tel",textContentType:"telephoneNumber"}));};var _default=Tel;exports["default"]=_default;
+var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports["default"]=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _react=_interopRequireDefault(require("react"));var _Input=_interopRequireDefault(require("./Input"));var Tel=_react["default"].forwardRef(function(props,ref){return _react["default"].createElement(_Input["default"],(0,_extends2["default"])({ref:ref},props,{keyboardType:"phone-pad",autoCompleteType:"tel",textContentType:"telephoneNumber"}));});var _default=Tel;exports["default"]=_default;

package/cjs/Input/native/Tel.test.js

@@ -0,0 +1 @@
+var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _react=_interopRequireDefault(require("react"));var _reactNative=require("@testing-library/react-native");var _=require("../..");describe('<Input.Tel />',function(){describe('Snapshots',function(){it('should match with default input',function(){var _render=(0,_reactNative.render)(_react["default"].createElement(_.ThemeProvider,null,_react["default"].createElement(_.Input.Tel,null))),container=_render.container;expect(container).toMatchSnapshot();});});});

package/cjs/Input/web/Email.js

@@ -11,11 +11,13 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "d
 
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
-var Email = function Email(props) {
-  return /*#__PURE__*/_react["default"].createElement(_Input["default"], _extends({}, props, {
+var Email = /*#__PURE__*/_react["default"].forwardRef(function (props, ref) {
+  return /*#__PURE__*/_react["default"].createElement(_Input["default"], _extends({
+    ref: ref
+  }, props, {
     type: "email"
   }));
-};
+});
 
 var _default = Email;
 exports["default"] = _default;

package/cjs/Input/web/Email.test.js

@@ -0,0 +1,20 @@
+"use strict";
+
+var _react = _interopRequireDefault(require("react"));
+
+var _react2 = require("@testing-library/react");
+
+var _ = require("../..");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+describe('<Input.Email />', function () {
+  describe('Snapshots', function () {
+    it('should match with default input', function () {
+      var _render = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_.ThemeProvider, null, /*#__PURE__*/_react["default"].createElement(_.Input.Email, null))),
+          container = _render.container;
+
+      expect(container).toMatchSnapshot();
+    });
+  });
+});

package/cjs/Input/web/Field.js

@@ -32,7 +32,7 @@ var Field = _styledComponents["default"].input(_templateObject2 || (_templateObj
       colors = _ref2$theme$yoga.colors,
       baseFont = _ref2$theme$yoga.baseFont,
       input = _ref2$theme$yoga.components.input;
-  return (0, _styledComponents.css)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n    height: ", "px;\n    padding-top: ", "px;\n    padding-right: ", "px;\n    padding-bottom: ", "px;\n    padding-left: ", "px;\n\n    color: ", ";\n    font-family: ", ", sans-serif;\n    font-size: ", "px;\n    font-weight: ", ";\n\n    &:focus {\n      color: ", ";\n\n      & ~ legend {\n        max-width: max-content;\n        transition-property: max-width;\n        transition-duration: ", "ms;\n      }\n\n      & ~ label {\n        ", "\n\n        font-weight: ", ";\n        color: ", ";\n\n      }\n\n      &::placeholder {\n        color: ", ";\n      }\n    }\n\n    &:disabled {\n      cursor: not-allowed;\n      color: ", ";\n    }\n\n    ", "\n\n    ", "\n  "])), input.height, input.padding.top, cleanable ? ICON_SIZE + input.padding.right * 2 : input.padding.right, input.padding.bottom, input.padding.left, input.font.color.focus, baseFont.family, input.font.size, input.font.weight, input.font.color.focus, transition.duration[1], labelTransition, input.label.font.weight, error ? "" + colors.feedback.attention[1] : "" + colors.text.primary, input.label.color["default"], colors.text.disabled, placeholder && label ? (0, _styledComponents.css)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n            &::placeholder {\n              color: transparent;\n            }\n          "]))) : (0, _styledComponents.css)(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n            &::placeholder {\n              color: ", ";\n            }\n          "])), input.label.color["default"]), value && (0, _styledComponents.css)(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n        & ~ legend {\n          max-width: max-content;\n        }\n\n        & ~ label {\n          color: ", ";\n          ", "\n        }\n      "])), error ? "" + colors.feedback.attention[1] : '', labelTransition));
+  return (0, _styledComponents.css)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n    height: ", "px;\n    padding-top: ", "px;\n    padding-right: ", "px;\n    padding-bottom: ", "px;\n    padding-left: ", "px;\n\n    color: ", ";\n    font-family: ", ", sans-serif;\n    font-size: ", "px;\n    font-weight: ", ";\n\n    &:focus {\n      color: ", ";\n\n      & ~ legend {\n        max-width: max-content;\n        transition-property: max-width;\n        transition-duration: ", "ms;\n      }\n\n      & ~ label {\n        ", "\n\n        font-weight: ", ";\n        color: ", ";\n      }\n\n      &::placeholder {\n        color: ", ";\n      }\n    }\n\n    &:disabled {\n      cursor: not-allowed;\n      color: ", ";\n    }\n\n    ", "\n\n    ", "\n  "])), input.height, input.padding.top, cleanable ? ICON_SIZE + input.padding.right * 2 : input.padding.right, input.padding.bottom, input.padding.left, input.font.color.focus, baseFont.family, input.font.size, input.font.weight, input.font.color.focus, transition.duration[1], labelTransition, input.label.font.weight, error ? "" + colors.feedback.attention[1] : "" + colors.text.primary, input.label.color["default"], colors.text.disabled, placeholder && label ? (0, _styledComponents.css)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n          &::placeholder {\n            color: transparent;\n          }\n        "]))) : (0, _styledComponents.css)(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n          &::placeholder {\n            color: ", ";\n          }\n        "])), input.label.color["default"]), value && (0, _styledComponents.css)(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n      & ~ legend {\n        max-width: max-content;\n      }\n\n      & ~ label {\n        color: ", ";\n        ", "\n      }\n    "])), error ? "" + colors.feedback.attention[1] : '', labelTransition));
 });
 
 var _default = Field;

package/cjs/Input/web/Input.test.js

@@ -0,0 +1,161 @@
+"use strict";
+
+var _react = _interopRequireDefault(require("react"));
+
+var _react2 = require("@testing-library/react");
+
+var _ = require("../..");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+describe('<Input />', function () {
+  describe('Snapshots', function () {
+    it('should match with default input', function () {
+      var _render = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_.ThemeProvider, null, /*#__PURE__*/_react["default"].createElement(_.Input, null))),
+          container = _render.container;
+
+      expect(container).toMatchSnapshot();
+    });
+    it('should match with label', function () {
+      var _render2 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_.ThemeProvider, null, /*#__PURE__*/_react["default"].createElement(_.Input, {
+        label: "Input"
+      }))),
+          container = _render2.container;
+
+      expect(container).toMatchSnapshot();
+    });
+    it('should match with disabled input', function () {
+      var _render3 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_.ThemeProvider, null, /*#__PURE__*/_react["default"].createElement(_.Input, {
+        disabled: true
+      }))),
+          container = _render3.container;
+
+      expect(container).toMatchSnapshot();
+    });
+    it('should match with error', function () {
+      var _render4 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_.ThemeProvider, null, /*#__PURE__*/_react["default"].createElement(_.Input, {
+        error: "Error message"
+      }))),
+          container = _render4.container;
+
+      expect(container).toMatchSnapshot();
+    });
+    it('should match with helper text and max length', function () {
+      var _render5 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_.ThemeProvider, null, /*#__PURE__*/_react["default"].createElement(_.Input, {
+        helper: "Helper text",
+        maxLength: 20
+      }))),
+          container = _render5.container;
+
+      expect(container).toMatchSnapshot();
+    });
+    it('should match with helper text, max length and hideMaxLength', function () {
+      var _render6 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_.ThemeProvider, null, /*#__PURE__*/_react["default"].createElement(_.Input, {
+        helper: "Helper text",
+        maxLength: 20,
+        hideMaxLength: true
+      }))),
+          container = _render6.container;
+
+      expect(container).toMatchSnapshot();
+    });
+    it('should match with full width', function () {
+      var _render7 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_.ThemeProvider, null, /*#__PURE__*/_react["default"].createElement(_.Input, {
+        label: "Label",
+        full: true
+      }))),
+          container = _render7.container;
+
+      expect(container).toMatchSnapshot();
+    });
+  });
+  describe('Events', function () {
+    it('should call onChange', function () {
+      var onChangeMock = jest.fn();
+      (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_.ThemeProvider, null, /*#__PURE__*/_react["default"].createElement(_.Input, {
+        label: "Input",
+        onChange: onChangeMock,
+        "data-testid": "input"
+      })));
+
+      _react2.fireEvent.change(_react2.screen.getByTestId('input'), {
+        target: {
+          value: 'foo'
+        }
+      });
+
+      expect(onChangeMock).toHaveBeenCalled();
+    });
+    it('should call onFocus', function () {
+      var onFocusMock = jest.fn();
+      (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_.ThemeProvider, null, /*#__PURE__*/_react["default"].createElement(_.Input, {
+        label: "Input",
+        "data-testid": "input",
+        onFocus: onFocusMock
+      })));
+
+      _react2.fireEvent.focus(_react2.screen.getByTestId('input'));
+
+      expect(onFocusMock).toHaveBeenCalled();
+    });
+    it('should call onBlur', function () {
+      var onBlurMock = jest.fn();
+      (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_.ThemeProvider, null, /*#__PURE__*/_react["default"].createElement(_.Input, {
+        label: "Input",
+        "data-testid": "input",
+        onBlur: onBlurMock
+      })));
+
+      _react2.fireEvent.focus(_react2.screen.getByTestId('input'));
+
+      _react2.fireEvent.blur(_react2.screen.getByTestId('input'));
+
+      expect(onBlurMock).toHaveBeenCalled();
+    });
+  });
+  describe('maxLength', function () {
+    it('should update maxLength counter when add character', function () {
+      var _render8 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_.ThemeProvider, null, /*#__PURE__*/_react["default"].createElement(_.Input, {
+        label: "Input",
+        maxLength: 10
+      }))),
+          rerender = _render8.rerender;
+
+      expect(_react2.screen.getByText('0/10').textContent).toBe('0/10');
+      rerender( /*#__PURE__*/_react["default"].createElement(_.ThemeProvider, null, /*#__PURE__*/_react["default"].createElement(_.Input, {
+        label: "Input",
+        value: "foo",
+        maxLength: 10
+      })));
+      expect(_react2.screen.getByText('3/10').textContent).toBe('3/10');
+    });
+  });
+  describe('clean button', function () {
+    it('should call onClean when press clean button', function () {
+      var onClean = jest.fn();
+      (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_.ThemeProvider, null, /*#__PURE__*/_react["default"].createElement(_.Input, {
+        label: "Input",
+        value: "foo",
+        onClean: onClean
+      })));
+
+      _react2.fireEvent.click(_react2.screen.queryByRole('button'));
+
+      expect(onClean).toHaveBeenCalled();
+    });
+    it('should test if clean button is present', function () {
+      var _render9 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_.ThemeProvider, null, /*#__PURE__*/_react["default"].createElement(_.Input, {
+        label: "Input"
+      }))),
+          rerender = _render9.rerender; // closeButton
+
+
+      expect(_react2.screen.queryByRole('button')).toBeNull();
+      rerender( /*#__PURE__*/_react["default"].createElement(_.ThemeProvider, null, /*#__PURE__*/_react["default"].createElement(_.Input, {
+        label: "Input",
+        value: "foo"
+      })));
+      expect(_react2.screen.queryByRole('button')).not.toBeNull();
+    });
+  });
+});

package/cjs/Input/web/Legend.js

@@ -15,6 +15,8 @@ var _templateObject, _templateObject2;
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 
 function _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.slice(0); } strings.raw = raw; return strings; }
@@ -29,12 +31,14 @@ var HiddenSpan = _styledComponents["default"].span(_templateObject2 || (_templat
   return "\n    padding-left: " + input.label.padding.left + "px;\n    padding-right: " + input.label.padding.right + "px;\n  ";
 });
 
-var Legend = function Legend(_ref3) {
+var Legend = /*#__PURE__*/_react["default"].forwardRef(function (_ref3, ref) {
   var children = _ref3.children,
       props = _objectWithoutPropertiesLoose(_ref3, _excluded);
 
-  return /*#__PURE__*/_react["default"].createElement(StyledLegend, props, /*#__PURE__*/_react["default"].createElement(HiddenSpan, null, children));
-};
+  return /*#__PURE__*/_react["default"].createElement(StyledLegend, _extends({
+    ref: ref
+  }, props), /*#__PURE__*/_react["default"].createElement(HiddenSpan, null, children));
+});
 
 Legend.propTypes = {
   children: _propTypes.node.isRequired