@gympass/yoga 7.29.1 → 7.31.0

package/cjs/Avatar/native/Avatar.js

@@ -1 +1 @@
-var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports["default"]=void 0;var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _react=_interopRequireDefault(require("react"));var _yogaIcons=require("@gympass/yoga-icons");var _propTypes=require("prop-types");var _reactNative=require("react-native");var _Box=_interopRequireDefault(require("../../Box"));var _Icon=_interopRequireDefault(require("../../Icon"));var _excluded=["icon","src","children","fill","stroke"];function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly){symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable;});}keys.push.apply(keys,symbols);}return keys;}function _objectSpread(target){for(var i=1;i<arguments.length;i++){var source=arguments[i]!=null?arguments[i]:{};if(i%2){ownKeys(Object(source),true).forEach(function(key){(0,_defineProperty2["default"])(target,key,source[key]);});}else if(Object.getOwnPropertyDescriptors){Object.defineProperties(target,Object.getOwnPropertyDescriptors(source));}else{ownKeys(Object(source)).forEach(function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key));});}}return target;}var Content=function Content(_ref){var icon=_ref.icon,src=_ref.src,fill=_ref.fill,content=_ref.content,stroke=_ref.stroke;if(src){return _react["default"].createElement(_Box["default"],{as:_reactNative.Image,width:"100%",height:"100%",source:src});}if(content){return content;}return _react["default"].createElement(_Icon["default"],{as:icon,width:"50%",height:"50%",fill:fill,stroke:stroke});};var Avatar=function Avatar(_ref2){var _ref2$icon=_ref2.icon,icon=_ref2$icon===void 0?_yogaIcons.BuildingFilled:_ref2$icon,src=_ref2.src,children=_ref2.children,fill=_ref2.fill,stroke=_ref2.stroke,props=(0,_objectWithoutProperties2["default"])(_ref2,_excluded);return _react["default"].createElement(_Box["default"],(0,_extends2["default"])({bgColor:"elements.selectionAndIcons",display:"flex",alignItems:"center",justifyContent:"center",width:48,height:48,borderRadius:"small",elevation:"small",overflow:"hidden"},props),_react["default"].createElement(Content,{icon:icon,src:src,fill:fill,stroke:stroke,content:children}));};Content.propTypes=_objectSpread({src:_reactNative.Image.propTypes.source,icon:_propTypes.func,fill:_propTypes.string},_Box["default"].propTypes);Content.defaultProps={src:undefined,fill:'white',icon:_yogaIcons.BuildingFilled};Avatar.propTypes=_objectSpread({src:_reactNative.Image.propTypes.source,icon:_propTypes.func,fill:_propTypes.string},_Box["default"].propTypes);Avatar.defaultProps=_objectSpread({src:undefined,fill:'white'},_Box["default"].defaultProps);Avatar.displayName='Avatar';var _default=Avatar;exports["default"]=_default;
+var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports["default"]=void 0;var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _react=_interopRequireWildcard(require("react"));var _yogaIcons=require("@gympass/yoga-icons");var _propTypes=require("prop-types");var _reactNative=require("react-native");var _Box=_interopRequireDefault(require("../../Box"));var _Icon=_interopRequireDefault(require("../../Icon"));var _excluded=["icon","src","children","fill","stroke"];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;}function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly){symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable;});}keys.push.apply(keys,symbols);}return keys;}function _objectSpread(target){for(var i=1;i<arguments.length;i++){var source=arguments[i]!=null?arguments[i]:{};if(i%2){ownKeys(Object(source),true).forEach(function(key){(0,_defineProperty2["default"])(target,key,source[key]);});}else if(Object.getOwnPropertyDescriptors){Object.defineProperties(target,Object.getOwnPropertyDescriptors(source));}else{ownKeys(Object(source)).forEach(function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key));});}}return target;}var Content=function Content(_ref){var icon=_ref.icon,src=_ref.src,fill=_ref.fill,content=_ref.content,stroke=_ref.stroke;if(src){return _react["default"].createElement(_Box["default"],{as:_reactNative.Image,width:"100%",height:"100%",source:src});}if(content){return content;}return _react["default"].createElement(_Icon["default"],{as:icon,width:"50%",height:"50%",fill:fill,stroke:stroke});};var Avatar=(0,_react.forwardRef)(function(_ref2,ref){var _ref2$icon=_ref2.icon,icon=_ref2$icon===void 0?_yogaIcons.BuildingFilled:_ref2$icon,src=_ref2.src,children=_ref2.children,fill=_ref2.fill,stroke=_ref2.stroke,props=(0,_objectWithoutProperties2["default"])(_ref2,_excluded);return _react["default"].createElement(_Box["default"],(0,_extends2["default"])({ref:ref,bgColor:"elements.selectionAndIcons",display:"flex",alignItems:"center",justifyContent:"center",width:48,height:48,borderRadius:"small",elevation:"small",overflow:"hidden"},props),_react["default"].createElement(Content,{icon:icon,src:src,fill:fill,stroke:stroke,content:children}));});Content.propTypes=_objectSpread({src:_reactNative.Image.propTypes.source,icon:_propTypes.func,fill:_propTypes.string},_Box["default"].propTypes);Content.defaultProps={src:undefined,fill:'white',icon:_yogaIcons.BuildingFilled};Avatar.propTypes=_objectSpread({src:_reactNative.Image.propTypes.source,icon:_propTypes.func,fill:_propTypes.string},_Box["default"].propTypes);Avatar.defaultProps=_objectSpread({src:undefined,fill:'white'},_Box["default"].defaultProps);Avatar.displayName='Avatar';var _default=Avatar;exports["default"]=_default;

package/cjs/Avatar/native/AvatarCircle.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 _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _react=_interopRequireDefault(require("react"));var _yogaIcons=require("@gympass/yoga-icons");var _Avatar=_interopRequireDefault(require("./Avatar"));var _excluded=["src"];var AvatarCircle=function AvatarCircle(_ref){var src=_ref.src,props=(0,_objectWithoutProperties2["default"])(_ref,_excluded);return _react["default"].createElement(_Avatar["default"],(0,_extends2["default"])({},props,{src:src,borderRadius:"circle",icon:!src?_yogaIcons.UserFilled:undefined}));};AvatarCircle.propTypes=_Avatar["default"].propTypes;AvatarCircle.defaultProps=_Avatar["default"].defaultProps;AvatarCircle.displayName='Avatar.Circle';var _default=AvatarCircle;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 _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _react=_interopRequireWildcard(require("react"));var _yogaIcons=require("@gympass/yoga-icons");var _Avatar=_interopRequireDefault(require("./Avatar"));var _excluded=["src"];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 AvatarCircle=(0,_react.forwardRef)(function(_ref,ref){var src=_ref.src,props=(0,_objectWithoutProperties2["default"])(_ref,_excluded);return _react["default"].createElement(_Avatar["default"],(0,_extends2["default"])({},props,{src:src,borderRadius:"circle",icon:!src?_yogaIcons.UserFilled:undefined,ref:ref}));});AvatarCircle.propTypes=_Avatar["default"].propTypes;AvatarCircle.defaultProps=_Avatar["default"].defaultProps;AvatarCircle.displayName='Avatar.Circle';var _default=AvatarCircle;exports["default"]=_default;

package/cjs/Avatar/web/Avatar.js

@@ -3,7 +3,7 @@
 exports.__esModule = true;
 exports["default"] = void 0;
 
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 
 var _styledComponents = _interopRequireDefault(require("styled-components"));
 
@@ -21,6 +21,10 @@ var _templateObject;
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
+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; }
+
 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; }
@@ -62,7 +66,7 @@ var Content = function Content(_ref) {
  */
 
 
-var Avatar = function Avatar(_ref2) {
+var Avatar = /*#__PURE__*/(0, _react.forwardRef)(function (_ref2, ref) {
   var src = _ref2.src,
       alt = _ref2.alt,
       fill = _ref2.fill,
@@ -81,7 +85,8 @@ var Avatar = function Avatar(_ref2) {
     height: 48,
     borderRadius: "small",
     elevation: "small",
-    overflow: "hidden"
+    overflow: "hidden",
+    ref: ref
   }, otherProps), /*#__PURE__*/_react["default"].createElement(Content, {
     icon: icon,
     src: src,
@@ -90,8 +95,7 @@ var Avatar = function Avatar(_ref2) {
     content: children,
     alt: alt
   }));
-};
-
+});
 Content.propTypes = _extends({
   src: _propTypes.string,
   icon: _propTypes.func,

package/cjs/Avatar/web/AvatarCircle.js

@@ -3,7 +3,7 @@
 exports.__esModule = true;
 exports["default"] = void 0;
 
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 
 var _yogaIcons = require("@gympass/yoga-icons");
 
@@ -13,24 +13,28 @@ var _excluded = ["src", "alt"];
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
+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; }
+
 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; }
 
-var AvatarCircle = function AvatarCircle(_ref) {
+var AvatarCircle = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
   var src = _ref.src,
       _ref$alt = _ref.alt,
       alt = _ref$alt === void 0 ? '' : _ref$alt,
       props = _objectWithoutPropertiesLoose(_ref, _excluded);
 
   return /*#__PURE__*/_react["default"].createElement(_Avatar["default"], _extends({}, props, {
+    ref: ref,
     src: src,
     alt: alt,
     borderRadius: "circle",
     icon: !src ? _yogaIcons.UserFilled : undefined
   }));
-};
-
+});
 AvatarCircle.propTypes = _Avatar["default"].propTypes;
 AvatarCircle.defaultProps = _Avatar["default"].defaultProps;
 AvatarCircle.displayName = 'Avatar.Circle';

package/cjs/Button/native/Button.js

@@ -1 +1 @@
-var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports["default"]=exports.Label=exports.ButtonContainer=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _taggedTemplateLiteralLoose2=_interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _react=_interopRequireDefault(require("react"));var _styledComponents=_interopRequireWildcard(require("styled-components"));var _propTypes=require("prop-types");var _withTouchable=_interopRequireDefault(require("./withTouchable"));var _Text=_interopRequireDefault(require("../../Text"));var _excluded=["children","full","disabled","small","pressed","inverted","secondary","icon","theme"];var _templateObject,_templateObject2;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 Label=(0,_styledComponents["default"])(_Text["default"].Medium)(_templateObject||(_templateObject=(0,_taggedTemplateLiteralLoose2["default"])(["\n  text-align: center;\n  ","\n"])),function(_ref){var small=_ref.small,color=_ref.color,button=_ref.theme.yoga.components.button;return"\n      font-size: "+(small?button.font.size.small:button.font.size["default"])+"px;\n      color: "+color+";\n    ";});exports.Label=Label;var ButtonContainer=_styledComponents["default"].View(_templateObject2||(_templateObject2=(0,_taggedTemplateLiteralLoose2["default"])(["\n  ","\n"])),function(_ref2){var pressed=_ref2.pressed,disabled=_ref2.disabled,full=_ref2.full,small=_ref2.small,inverted=_ref2.inverted,secondary=_ref2.secondary,button=_ref2.theme.yoga.components.button;var state=secondary?'secondary':'primary';return"\n      flex-direction: row;\n      align-items: center;\n      justify-content: center;\n\n      background-color: "+button.types.contained.backgroundColor[state]["default"]+";\n      border-radius: "+button.border.radius+"px;\n      height: "+(small?button.height.small:button.height["default"])+";\n      justify-content: center;\n      padding-left: "+(small?button.padding.small.left:button.padding["default"].left)+"px;\n      padding-right: "+(small?button.padding.small.right:button.padding["default"].right)+"px;\n      "+(full?'width: 100%;':'')+"\n\n      "+(!disabled&&pressed?"\n        background-color: "+button.types.contained.backgroundColor[state].pressed+";\n      ":'')+"\n\n      "+(disabled?"\n        background-color: "+button.types.contained.backgroundColor.disabled+";\n      ":'')+"\n\n      "+(inverted&&!disabled?"\n          background-color: "+button.types.contained.font["default"].color+";\n        ":'')+"\n    ";});exports.ButtonContainer=ButtonContainer;var Button=function Button(_ref3){var children=_ref3.children,full=_ref3.full,disabled=_ref3.disabled,small=_ref3.small,pressed=_ref3.pressed,inverted=_ref3.inverted,secondary=_ref3.secondary,Icon=_ref3.icon,button=_ref3.theme.yoga.components.button,rest=(0,_objectWithoutProperties2["default"])(_ref3,_excluded);var state=secondary?'secondary':'primary';var textColor=button.types.contained.font["default"].color;if(disabled){textColor=button.types.contained.font.disabled.color;}else if(inverted){textColor=button.types.contained.backgroundColor[state]["default"];if(pressed){textColor=button.types.contained.backgroundColor[state].pressed;}}else if(pressed){textColor=button.types.contained.font.pressed.color;}return _react["default"].createElement(ButtonContainer,(0,_extends2["default"])({},rest,{full:full,pressed:pressed,disabled:disabled,small:small,inverted:inverted,secondary:secondary}),Icon&&_react["default"].createElement(Icon,{width:small?button.icon.size.small:button.icon.size["default"],height:small?button.icon.size.small:button.icon.size["default"],fill:textColor,style:{marginRight:button.icon.margin.right}}),_react["default"].createElement(Label,{disabled:disabled,pressed:pressed,inverted:inverted,small:small,color:textColor},children));};Button.propTypes={children:_propTypes.node,full:_propTypes.bool,disabled:_propTypes.bool,small:_propTypes.bool,pressed:_propTypes.bool,inverted:_propTypes.bool,secondary:_propTypes.bool,icon:(0,_propTypes.oneOfType)([_propTypes.bool,_propTypes.func])};Button.defaultProps={children:'Button',full:false,disabled:false,small:false,pressed:false,inverted:false,secondary:false,icon:undefined};var ButtonWithTouchable=(0,_withTouchable["default"])((0,_styledComponents.withTheme)(Button));exports["default"]=ButtonWithTouchable;
+var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports["default"]=exports.Label=exports.ButtonContainer=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _taggedTemplateLiteralLoose2=_interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _react=_interopRequireWildcard(require("react"));var _styledComponents=_interopRequireWildcard(require("styled-components"));var _propTypes=require("prop-types");var _withTouchable=_interopRequireDefault(require("./withTouchable"));var _Text=_interopRequireDefault(require("../../Text"));var _excluded=["children","full","disabled","small","pressed","inverted","secondary","icon","theme"];var _templateObject,_templateObject2;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 Label=(0,_styledComponents["default"])(_Text["default"].Medium)(_templateObject||(_templateObject=(0,_taggedTemplateLiteralLoose2["default"])(["\n  text-align: center;\n  ","\n"])),function(_ref){var small=_ref.small,color=_ref.color,button=_ref.theme.yoga.components.button;return"\n      font-size: "+(small?button.font.size.small:button.font.size["default"])+"px;\n      color: "+color+";\n    ";});exports.Label=Label;var ButtonContainer=_styledComponents["default"].View(_templateObject2||(_templateObject2=(0,_taggedTemplateLiteralLoose2["default"])(["\n  ","\n"])),function(_ref2){var pressed=_ref2.pressed,disabled=_ref2.disabled,full=_ref2.full,small=_ref2.small,inverted=_ref2.inverted,secondary=_ref2.secondary,button=_ref2.theme.yoga.components.button;var state=secondary?'secondary':'primary';return"\n      flex-direction: row;\n      align-items: center;\n      justify-content: center;\n\n      background-color: "+button.types.contained.backgroundColor[state]["default"]+";\n      border-radius: "+button.border.radius+"px;\n      height: "+(small?button.height.small:button.height["default"])+";\n      justify-content: center;\n      padding-left: "+(small?button.padding.small.left:button.padding["default"].left)+"px;\n      padding-right: "+(small?button.padding.small.right:button.padding["default"].right)+"px;\n      "+(full?'width: 100%;':'')+"\n\n      "+(!disabled&&pressed?"\n        background-color: "+button.types.contained.backgroundColor[state].pressed+";\n      ":'')+"\n\n      "+(disabled?"\n        background-color: "+button.types.contained.backgroundColor.disabled+";\n      ":'')+"\n\n      "+(inverted&&!disabled?"\n          background-color: "+button.types.contained.font["default"].color+";\n        ":'')+"\n    ";});exports.ButtonContainer=ButtonContainer;var Button=(0,_react.forwardRef)(function(_ref3,ref){var children=_ref3.children,full=_ref3.full,disabled=_ref3.disabled,small=_ref3.small,pressed=_ref3.pressed,inverted=_ref3.inverted,secondary=_ref3.secondary,Icon=_ref3.icon,button=_ref3.theme.yoga.components.button,rest=(0,_objectWithoutProperties2["default"])(_ref3,_excluded);var state=secondary?'secondary':'primary';var textColor=button.types.contained.font["default"].color;if(disabled){textColor=button.types.contained.font.disabled.color;}else if(inverted){textColor=button.types.contained.backgroundColor[state]["default"];if(pressed){textColor=button.types.contained.backgroundColor[state].pressed;}}else if(pressed){textColor=button.types.contained.font.pressed.color;}return _react["default"].createElement(ButtonContainer,(0,_extends2["default"])({},rest,{full:full,pressed:pressed,disabled:disabled,small:small,inverted:inverted,secondary:secondary,ref:ref}),Icon&&_react["default"].createElement(Icon,{width:small?button.icon.size.small:button.icon.size["default"],height:small?button.icon.size.small:button.icon.size["default"],fill:textColor,style:{marginRight:button.icon.margin.right}}),_react["default"].createElement(Label,{disabled:disabled,pressed:pressed,inverted:inverted,small:small,color:textColor},children));});Button.propTypes={children:_propTypes.node,full:_propTypes.bool,disabled:_propTypes.bool,small:_propTypes.bool,pressed:_propTypes.bool,inverted:_propTypes.bool,secondary:_propTypes.bool,icon:(0,_propTypes.oneOfType)([_propTypes.bool,_propTypes.func])};Button.defaultProps={children:'Button',full:false,disabled:false,small:false,pressed:false,inverted:false,secondary:false,icon:undefined};var ButtonWithTouchable=(0,_withTouchable["default"])((0,_styledComponents.withTheme)(Button));exports["default"]=ButtonWithTouchable;

package/cjs/Button/native/Link.js

@@ -1 +1 @@
-var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports["default"]=void 0;var _taggedTemplateLiteralLoose2=_interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _react=_interopRequireDefault(require("react"));var _styledComponents=_interopRequireDefault(require("styled-components"));var _propTypes=require("prop-types");var _yogaCommon=require("@gympass/yoga-common");var _withTouchable=_interopRequireDefault(require("./withTouchable"));var _Button=require("./Button");var _templateObject;var Link=(0,_styledComponents["default"])(_Button.Label)(_templateObject||(_templateObject=(0,_taggedTemplateLiteralLoose2["default"])(["\n  ","\n"])),function(_ref){var disabled=_ref.disabled,pressed=_ref.pressed,secondary=_ref.secondary,link=_ref.theme.yoga.components.button.types.link;var state=secondary?'secondary':'primary';return"\n      color: "+link.font[state].color+";\n\n      "+(disabled?"color: "+link.font.disabled.color+";":'')+"\n      "+(!disabled&&pressed?"color: "+(0,_yogaCommon.hexToRgb)(link.font[state].color,0.75)+";":'')+"\n    ";});var ButtonLink=function ButtonLink(props){return _react["default"].createElement(Link,props);};ButtonLink.propTypes={disabled:_propTypes.bool,secondary:_propTypes.bool};ButtonLink.defaultProps={disabled:false,secondary:false};ButtonLink.displayName='Button.Link';var _default=(0,_withTouchable["default"])(ButtonLink);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 _taggedTemplateLiteralLoose2=_interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _react=_interopRequireWildcard(require("react"));var _styledComponents=_interopRequireDefault(require("styled-components"));var _propTypes=require("prop-types");var _yogaCommon=require("@gympass/yoga-common");var _withTouchable=_interopRequireDefault(require("./withTouchable"));var _Button=require("./Button");var _templateObject;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 Link=(0,_styledComponents["default"])(_Button.Label)(_templateObject||(_templateObject=(0,_taggedTemplateLiteralLoose2["default"])(["\n  ","\n"])),function(_ref){var disabled=_ref.disabled,pressed=_ref.pressed,secondary=_ref.secondary,link=_ref.theme.yoga.components.button.types.link;var state=secondary?'secondary':'primary';return"\n      color: "+link.font[state].color+";\n\n      "+(disabled?"color: "+link.font.disabled.color+";":'')+"\n      "+(!disabled&&pressed?"color: "+(0,_yogaCommon.hexToRgb)(link.font[state].color,0.75)+";":'')+"\n    ";});var ButtonLink=(0,_react.forwardRef)(function(props,ref){return _react["default"].createElement(Link,(0,_extends2["default"])({},props,{ref:ref}));});ButtonLink.propTypes={disabled:_propTypes.bool,secondary:_propTypes.bool};ButtonLink.defaultProps={disabled:false,secondary:false};ButtonLink.displayName='Button.Link';var _default=(0,_withTouchable["default"])(ButtonLink);exports["default"]=_default;

package/cjs/Button/native/Text.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 _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _taggedTemplateLiteralLoose2=_interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _react=_interopRequireDefault(require("react"));var _styledComponents=_interopRequireWildcard(require("styled-components"));var _yogaCommon=require("@gympass/yoga-common");var _withTouchable=_interopRequireDefault(require("./withTouchable"));var _Button=require("./Button");var _excluded=["children","disabled","pressed","small","secondary","inverted","icon","theme"];var _templateObject,_templateObject2;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 LabelText=(0,_styledComponents["default"])(_Button.Label)(_templateObject||(_templateObject=(0,_taggedTemplateLiteralLoose2["default"])(["\n  ","\n"])),function(_ref){var color=_ref.color;return"color: "+color+";";});var ButtonContainerText=(0,_styledComponents["default"])(_Button.ButtonContainer)(_templateObject2||(_templateObject2=(0,_taggedTemplateLiteralLoose2["default"])(["\n  ","\n"])),function(_ref2){var button=_ref2.theme.yoga.components.button;return"\n    background-color: "+button.types.text.backgroundColor+";\n  ";});var ButtonText=function ButtonText(_ref3){var children=_ref3.children,disabled=_ref3.disabled,pressed=_ref3.pressed,small=_ref3.small,secondary=_ref3.secondary,inverted=_ref3.inverted,Icon=_ref3.icon,_ref3$theme$yoga=_ref3.theme.yoga,colors=_ref3$theme$yoga.colors,button=_ref3$theme$yoga.components.button,rest=(0,_objectWithoutProperties2["default"])(_ref3,_excluded);var state=secondary?'secondary':'primary';var textColor=colors[state];if(disabled){textColor=colors.text.disabled;}else if(inverted){textColor=colors.white;if(pressed){textColor=(0,_yogaCommon.hexToRgb)(colors.white,0.75);}}else if(pressed){textColor=(0,_yogaCommon.hexToRgb)(colors[state],0.75);}return _react["default"].createElement(ButtonContainerText,(0,_extends2["default"])({},rest,{disabled:disabled,pressed:pressed,small:small}),Icon&&_react["default"].createElement(Icon,{width:small?button.icon.size.small:button.icon.size["default"],height:small?button.icon.size.small:button.icon.size["default"],fill:textColor,style:{marginRight:button.icon.margin.right}}),_react["default"].createElement(LabelText,{disabled:disabled,pressed:pressed,small:small,secondary:secondary,color:textColor},children));};ButtonText.propTypes=_Button.ButtonContainer.propTypes;ButtonText.defaultProps=_Button.ButtonContainer.defaultProps;var _default=(0,_withTouchable["default"])((0,_styledComponents.withTheme)(ButtonText));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 _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _taggedTemplateLiteralLoose2=_interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _react=_interopRequireWildcard(require("react"));var _styledComponents=_interopRequireWildcard(require("styled-components"));var _yogaCommon=require("@gympass/yoga-common");var _withTouchable=_interopRequireDefault(require("./withTouchable"));var _Button=require("./Button");var _excluded=["children","disabled","pressed","small","secondary","inverted","icon","theme"];var _templateObject,_templateObject2;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 LabelText=(0,_styledComponents["default"])(_Button.Label)(_templateObject||(_templateObject=(0,_taggedTemplateLiteralLoose2["default"])(["\n  ","\n"])),function(_ref){var color=_ref.color;return"color: "+color+";";});var ButtonContainerText=(0,_styledComponents["default"])(_Button.ButtonContainer)(_templateObject2||(_templateObject2=(0,_taggedTemplateLiteralLoose2["default"])(["\n  ","\n"])),function(_ref2){var button=_ref2.theme.yoga.components.button;return"\n    background-color: "+button.types.text.backgroundColor+";\n  ";});var ButtonText=(0,_react.forwardRef)(function(_ref3,ref){var children=_ref3.children,disabled=_ref3.disabled,pressed=_ref3.pressed,small=_ref3.small,secondary=_ref3.secondary,inverted=_ref3.inverted,Icon=_ref3.icon,_ref3$theme$yoga=_ref3.theme.yoga,colors=_ref3$theme$yoga.colors,button=_ref3$theme$yoga.components.button,rest=(0,_objectWithoutProperties2["default"])(_ref3,_excluded);var state=secondary?'secondary':'primary';var textColor=colors[state];if(disabled){textColor=colors.text.disabled;}else if(inverted){textColor=colors.white;if(pressed){textColor=(0,_yogaCommon.hexToRgb)(colors.white,0.75);}}else if(pressed){textColor=(0,_yogaCommon.hexToRgb)(colors[state],0.75);}return _react["default"].createElement(ButtonContainerText,(0,_extends2["default"])({},rest,{disabled:disabled,pressed:pressed,small:small,ref:ref}),Icon&&_react["default"].createElement(Icon,{width:small?button.icon.size.small:button.icon.size["default"],height:small?button.icon.size.small:button.icon.size["default"],fill:textColor,style:{marginRight:button.icon.margin.right}}),_react["default"].createElement(LabelText,{disabled:disabled,pressed:pressed,small:small,secondary:secondary,color:textColor},children));});ButtonText.propTypes=_Button.ButtonContainer.propTypes;ButtonText.defaultProps=_Button.ButtonContainer.defaultProps;var _default=(0,_withTouchable["default"])((0,_styledComponents.withTheme)(ButtonText));exports["default"]=_default;

package/cjs/Button/web/Button.js

@@ -3,7 +3,7 @@
 exports.__esModule = true;
 exports["default"] = void 0;
 
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 
 var _propTypes = require("prop-types");
 
@@ -13,12 +13,16 @@ var _excluded = ["children", "onClick", "full", "disabled", "inverted", "small",
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
+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; }
+
 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; }
 
 /** Buttons make common actions more obvious and help users more easily perform them. Buttons use labels and sometimes icons to communicate the action that will occur when the user touches them. */
-var Button = function Button(_ref) {
+var Button = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
   var children = _ref.children,
       onClick = _ref.onClick,
       full = _ref.full,
@@ -36,6 +40,7 @@ var Button = function Button(_ref) {
   }
 
   return /*#__PURE__*/_react["default"].createElement(_StyledButton["default"], _extends({
+    ref: ref,
     disabled: disabled,
     full: full,
     inverted: inverted,
@@ -43,8 +48,7 @@ var Button = function Button(_ref) {
     small: small,
     secondary: secondary
   }, finalProps), Icon && /*#__PURE__*/_react["default"].createElement(Icon, null), children);
-};
-
+});
 Button.propTypes = {
   children: _propTypes.node,
   disabled: _propTypes.bool,

package/cjs/Button/web/Outline.js

@@ -3,12 +3,8 @@
 exports.__esModule = true;
 exports["default"] = void 0;
 
-var _react = _interopRequireDefault(require("react"));
-
 var _styledComponents = _interopRequireDefault(require("styled-components"));
 
-var _propTypes = require("prop-types");
-
 var _yogaCommon = require("@gympass/yoga-common");
 
 var _Button = _interopRequireDefault(require("./Button"));
@@ -19,7 +15,7 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "d
 
 function _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.slice(0); } strings.raw = raw; return strings; }
 
-var Outline = (0, _styledComponents["default"])(_Button["default"])(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n  ", "\n"])), function (_ref) {
+var ButtonOutline = (0, _styledComponents["default"])(_Button["default"])(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n  ", "\n"])), function (_ref) {
   var inverted = _ref.inverted,
       secondary = _ref.secondary,
       _ref$theme$yoga = _ref.theme.yoga,
@@ -28,31 +24,6 @@ var Outline = (0, _styledComponents["default"])(_Button["default"])(_templateObj
   var state = secondary ? 'secondary' : 'primary';
   return "\n      background-color: " + outline.backgroundColor["default"] + ";\n      border: " + outline.border.width + "px solid;\n      border-color: " + outline.font["default"][state].color + ";\n      color: " + outline.font["default"][state].color + ";\n\n      svg {\n        fill: " + outline.font["default"][state].color + ";\n      }\n\n      &:not([disabled]):hover, &:not([disabled]):focus {\n        background-color: " + outline.backgroundColor[state].hover + ";\n        color: " + outline.font.hover.color + ";\n\n        svg {\n          fill: " + outline.font.hover.color + ";\n        }\n      }\n\n      &:not([disabled]):active {\n        background-color: " + outline.backgroundColor["default"] + ";\n        border-color: " + outline.font.pressed[state].color + ";\n        color: " + outline.font.pressed[state].color + ";\n        box-shadow: none;\n\n        svg {\n          fill: " + outline.font.pressed[state].color + ";\n        }\n      }\n\n      &:disabled {\n        background-color: " + outline.backgroundColor["default"] + ";\n        border-color: " + outline.font.disabled.color + ";\n        color: " + outline.font.disabled.color + ";\n\n        svg {\n          fill: " + outline.font.disabled.color + ";\n        }\n      }\n\n      " + (inverted ? "\n            border-color: " + white + ";\n            color: " + white + ";\n\n            svg {\n              fill: " + white + ";\n            }\n\n            &:not([disabled]):hover, &:not([disabled]):focus {\n              background-color: " + white + ";\n              color: " + outline.font["default"][state].color + ";\n\n              svg {\n                fill: " + outline.font["default"][state].color + ";\n              }\n            }\n\n            &:not([disabled]):active {\n              background-color: " + outline.backgroundColor["default"] + ";\n              border-color: " + (0, _yogaCommon.hexToRgb)(white, 0.75) + ";\n              color: " + (0, _yogaCommon.hexToRgb)(white, 0.75) + ";\n\n              svg {\n                fill: " + (0, _yogaCommon.hexToRgb)(white, 0.75) + ";\n              }\n            }\n\n            &:disabled {\n              border-color: " + outline.font.disabled.color + ";\n              color: " + outline.font.disabled.color + ";\n              svg {\n                fill: " + outline.font.disabled.color + ";\n              }\n            }\n          " : '') + "\n    ";
 });
-
-var ButtonOutline = function ButtonOutline(props) {
-  return /*#__PURE__*/_react["default"].createElement(Outline, props);
-};
-
-ButtonOutline.propTypes = {
-  disabled: _propTypes.bool,
-  full: _propTypes.bool,
-  inverted: _propTypes.bool,
-  onClick: _propTypes.func,
-  secondary: _propTypes.bool,
-  small: _propTypes.bool,
-
-  /** an Icon from yoga-icons package */
-  icon: (0, _propTypes.oneOfType)([_propTypes.node, _propTypes.func])
-};
-ButtonOutline.defaultProps = {
-  disabled: false,
-  full: false,
-  inverted: false,
-  onClick: function onClick() {},
-  secondary: false,
-  small: false,
-  icon: undefined
-};
 ButtonOutline.displayName = 'Button.Outline';
 var _default = ButtonOutline;
 exports["default"] = _default;

package/cjs/Checkbox/web/Checkbox.js

@@ -3,7 +3,7 @@
 exports.__esModule = true;
 exports["default"] = void 0;
 
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 
 var _propTypes = require("prop-types");
 
@@ -15,7 +15,7 @@ var _yogaIcons = require("@gympass/yoga-icons");
 
 var _shared = require("../../shared");
 
-var _excluded = ["value", "label", "helper", "disabled", "checked", "error", "style", "className", "inverted", "theme"];
+var _excluded = ["value", "label", "helper", "disabled", "checked", "error", "style", "className", "inverted", "indeterminate", "theme"];
 
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7;
 
@@ -23,8 +23,6 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 
 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; }
 
-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; }
@@ -41,6 +39,7 @@ var CheckMark = _styledComponents["default"].div(_templateObject2 || (_templateO
       disabled = _ref2.disabled,
       inverted = _ref2.inverted,
       error = _ref2.error,
+      indeterminate = _ref2.indeterminate,
       _ref2$theme$yoga = _ref2.theme.yoga,
       _ref2$theme$yoga$colo = _ref2$theme$yoga.colors,
       primary = _ref2$theme$yoga$colo.primary,
@@ -56,18 +55,18 @@ var CheckMark = _styledComponents["default"].div(_templateObject2 || (_templateO
     var _feedback$attention = feedback.attention;
     borderColor = _feedback$attention[1];
 
-    if (checked) {
+    if (checked || indeterminate) {
       var _feedback$attention2 = feedback.attention;
       bgColor = _feedback$attention2[1];
     }
   } else if (disabled) {
     borderColor = checkbox.disabled.border.color;
 
-    if (checked) {
+    if (checked || indeterminate) {
       bgColor = checkbox.disabled.backgroundColor;
       borderColor = elements.lineAndBorders;
     }
-  } else if (checked) {
+  } else if (checked || indeterminate) {
     borderColor = primary;
     bgColor = primary;
     checkColor = checkbox.checked.icon.color;
@@ -99,6 +98,7 @@ var CheckboxStyled = _styledComponents["default"].div(_templateObject5 || (_temp
   var checked = _ref5.checked,
       inverted = _ref5.inverted,
       disabled = _ref5.disabled,
+      indeterminate = _ref5.indeterminate,
       _ref5$theme$yoga = _ref5.theme.yoga,
       _ref5$theme$yoga$colo = _ref5$theme$yoga.colors,
       primary = _ref5$theme$yoga$colo.primary,
@@ -112,7 +112,7 @@ var CheckboxStyled = _styledComponents["default"].div(_templateObject5 || (_temp
       return white;
     }
 
-    return checked ? primary : elements.backgroundAndDisabled;
+    return checked || indeterminate ? primary : elements.backgroundAndDisabled;
   };
 
   return "\n      " + (disabled ? "pointer-events: none" : '') + "\n\n      " + Label + ":active,\n      &:focus-within,\n      &:hover  {\n        " + Shadow + " {\n          display: block;\n        }\n      }\n\n      &:hover {\n        " + Shadow + " {\n          background-color: " + (0, _yogaCommon.hexToRgb)(shadowColor(), 0.25) + ";\n\n          box-shadow: 0 0 0 " + shadowSize + "px\n            " + (0, _yogaCommon.hexToRgb)(shadowColor(), 0.25) + ";\n        }\n      }\n\n      &:focus-within {\n        " + Shadow + " {\n          background-color: " + (0, _yogaCommon.hexToRgb)(shadowColor(), 0.5) + ";\n\n          box-shadow: 0 0 0 " + shadowSize + "px\n            " + (0, _yogaCommon.hexToRgb)(shadowColor(), 0.5) + ";\n        }\n      }\n\n      " + Label + ":active {\n        " + Shadow + " {\n          background-color: " + (0, _yogaCommon.hexToRgb)(shadowColor(), 0.75) + ";\n\n          box-shadow: 0 0 0 " + shadowSize + "px\n            " + (0, _yogaCommon.hexToRgb)(shadowColor(), 0.75) + ";\n        }\n      }\n    ";
@@ -145,27 +145,40 @@ var Checkbox = function Checkbox(_ref8) {
       style = _ref8.style,
       className = _ref8.className,
       inverted = _ref8.inverted,
+      indeterminate = _ref8.indeterminate,
       checkbox = _ref8.theme.yoga.components.checkbox,
       rest = _objectWithoutPropertiesLoose(_ref8, _excluded);
 
+  var inputRef = (0, _react.useRef)(null);
+  (0, _react.useEffect)(function () {
+    if (inputRef.current) {
+      inputRef.current.indeterminate = indeterminate;
+    }
+  });
   return /*#__PURE__*/_react["default"].createElement(CheckboxWrapper, {
     style: style,
     className: className,
     disabled: disabled
   }, /*#__PURE__*/_react["default"].createElement(CheckboxStyled, {
     checked: checked,
+    indeterminate: indeterminate,
     inverted: inverted,
     disabled: disabled
   }, /*#__PURE__*/_react["default"].createElement(Label, null, /*#__PURE__*/_react["default"].createElement(Shadow, null), /*#__PURE__*/_react["default"].createElement(CheckMark, {
     disabled: disabled,
     checked: checked,
     error: error,
-    inverted: inverted
-  }, checked && /*#__PURE__*/_react["default"].createElement(_yogaIcons.Check, {
+    inverted: inverted,
+    indeterminate: indeterminate
+  }, checked && !indeterminate && /*#__PURE__*/_react["default"].createElement(_yogaIcons.Check, {
+    width: checkbox.size,
+    height: checkbox.size
+  }), indeterminate && /*#__PURE__*/_react["default"].createElement(_yogaIcons.Rectangle, {
     width: checkbox.size,
     height: checkbox.size
   })), /*#__PURE__*/_react["default"].createElement(_shared.HiddenInput, _extends({
     type: "checkbox",
+    ref: inputRef,
     checked: checked,
     disabled: disabled
   }, rest)), label)), (helper || error) && /*#__PURE__*/_react["default"].createElement(HelperWrapper, null, /*#__PURE__*/_react["default"].createElement(Helper, {
@@ -184,6 +197,9 @@ Checkbox.propTypes = {
   inverted: _propTypes.bool,
   error: _propTypes.string,
 
+  /** if true, the component appears indeterminate */
+  indeterminate: _propTypes.bool,
+
   /** set a style to the checkbox container */
   style: (0, _propTypes.shape)({}),
   className: _propTypes.string
@@ -195,6 +211,7 @@ Checkbox.defaultProps = {
   checked: false,
   disabled: false,
   inverted: false,
+  indeterminate: false,
   error: undefined,
   style: undefined,
   className: undefined

package/cjs/Input/web/Field.js

@@ -5,7 +5,7 @@ exports["default"] = void 0;
 
 var _styledComponents = _interopRequireWildcard(require("styled-components"));
 
-var _templateObject, _templateObject2, _templateObject3, _templateObject4;
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
 
 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); }
 
@@ -22,7 +22,9 @@ var labelTransition = (0, _styledComponents.css)(_templateObject || (_templateOb
 });
 
 var Field = _styledComponents["default"].input(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n  width: 100%;\n\n  appearance: none;\n  background-color: transparent;\n  outline: none;\n\n  position: absolute;\n  bottom: 0;\n  left: 0;\n\n  border: none;\n  box-sizing: border-box;\n\n  ", "\n\n  &[type=\"number\"]::-webkit-outer-spin-button,\n  &[type=\"number\"]::-webkit-inner-spin-button {\n    display: none;\n  }\n\n  &:invalid {\n    box-shadow: none;\n  }\n"])), function (_ref2) {
-  var cleanable = _ref2.cleanable,
+  var label = _ref2.label,
+      placeholder = _ref2.placeholder,
+      cleanable = _ref2.cleanable,
       error = _ref2.error,
       value = _ref2.value,
       _ref2$theme$yoga = _ref2.theme.yoga,
@@ -30,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\n    &:disabled {\n      cursor: not-allowed;\n      color: ", ";\n    }\n\n    &::placeholder {\n      color: ", ";\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, colors.text.disabled, input.label.color["default"], value && (0, _styledComponents.css)(_templateObject4 || (_templateObject4 = _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\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.js

@@ -89,6 +89,7 @@ var Input = /*#__PURE__*/_react["default"].forwardRef(function (_ref3, ref) {
     style: style,
     value: value
   }, /*#__PURE__*/_react["default"].createElement(_Field["default"], _extends({}, props, {
+    label: label,
     cleanable: cleanable,
     disabled: disabled,
     error: error,
@@ -143,7 +144,8 @@ Input.propTypes = {
   onClean: _propTypes.func,
 
   /** when max length helper is unnecessary to appear */
-  hideMaxLength: _propTypes.bool
+  hideMaxLength: _propTypes.bool,
+  placeholder: _propTypes.string
 };
 Input.defaultProps = {
   className: undefined,
@@ -159,7 +161,8 @@ Input.defaultProps = {
   value: '',
   onChange: function onChange() {},
   onClean: function onClean() {},
-  hideMaxLength: false
+  hideMaxLength: false,
+  placeholder: undefined
 };
 var _default = Input;
 exports["default"] = _default;

package/esm/Avatar/web/Avatar.js

@@ -8,7 +8,7 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
 
 function _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.slice(0); } strings.raw = raw; return strings; }
 
-import React from 'react';
+import React, { forwardRef } from 'react';
 import styled from 'styled-components';
 import { BuildingFilled } from '@gympass/yoga-icons';
 import { string, func, checkPropTypes } from 'prop-types';
@@ -49,7 +49,7 @@ var Content = function Content(_ref) {
  */
 
 
-var Avatar = function Avatar(_ref2) {
+var Avatar = /*#__PURE__*/forwardRef(function (_ref2, ref) {
   var src = _ref2.src,
       alt = _ref2.alt,
       fill = _ref2.fill,
@@ -68,7 +68,8 @@ var Avatar = function Avatar(_ref2) {
     height: 48,
     borderRadius: "small",
     elevation: "small",
-    overflow: "hidden"
+    overflow: "hidden",
+    ref: ref
   }, otherProps), /*#__PURE__*/React.createElement(Content, {
     icon: icon,
     src: src,
@@ -77,8 +78,7 @@ var Avatar = function Avatar(_ref2) {
     content: children,
     alt: alt
   }));
-};
-
+});
 Content.propTypes = _extends({
   src: string,
   icon: func,

package/esm/Avatar/web/AvatarCircle.js

@@ -4,24 +4,23 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
 
 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; }
 
-import React from 'react';
+import React, { forwardRef } from 'react';
 import { UserFilled } from '@gympass/yoga-icons';
 import Avatar from './Avatar';
-
-var AvatarCircle = function AvatarCircle(_ref) {
+var AvatarCircle = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var src = _ref.src,
       _ref$alt = _ref.alt,
       alt = _ref$alt === void 0 ? '' : _ref$alt,
       props = _objectWithoutPropertiesLoose(_ref, _excluded);
 
   return /*#__PURE__*/React.createElement(Avatar, _extends({}, props, {
+    ref: ref,
     src: src,
     alt: alt,
     borderRadius: "circle",
     icon: !src ? UserFilled : undefined
   }));
-};
-
+});
 AvatarCircle.propTypes = Avatar.propTypes;
 AvatarCircle.defaultProps = Avatar.defaultProps;
 AvatarCircle.displayName = 'Avatar.Circle';

package/esm/Button/web/Button.js

@@ -4,12 +4,12 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
 
 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; }
 
-import React from 'react';
+import React, { forwardRef } from 'react';
 import { func, node, oneOfType, bool, string } from 'prop-types';
 import StyledButton from './StyledButton';
 /** Buttons make common actions more obvious and help users more easily perform them. Buttons use labels and sometimes icons to communicate the action that will occur when the user touches them. */
 
-var Button = function Button(_ref) {
+var Button = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var children = _ref.children,
       onClick = _ref.onClick,
       full = _ref.full,
@@ -27,6 +27,7 @@ var Button = function Button(_ref) {
   }
 
   return /*#__PURE__*/React.createElement(StyledButton, _extends({
+    ref: ref,
     disabled: disabled,
     full: full,
     inverted: inverted,
@@ -34,8 +35,7 @@ var Button = function Button(_ref) {
     small: small,
     secondary: secondary
   }, finalProps), Icon && /*#__PURE__*/React.createElement(Icon, null), children);
-};
-
+});
 Button.propTypes = {
   children: node,
   disabled: bool,

package/esm/Button/web/Outline.js

@@ -2,12 +2,10 @@ var _templateObject;
 
 function _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.slice(0); } strings.raw = raw; return strings; }
 
-import React from 'react';
 import styled from 'styled-components';
-import { bool, func, node, oneOfType } from 'prop-types';
 import { hexToRgb } from '@gympass/yoga-common';
 import Button from './Button';
-var Outline = styled(Button)(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n  ", "\n"])), function (_ref) {
+var ButtonOutline = styled(Button)(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n  ", "\n"])), function (_ref) {
   var inverted = _ref.inverted,
       secondary = _ref.secondary,
       _ref$theme$yoga = _ref.theme.yoga,
@@ -16,30 +14,5 @@ var Outline = styled(Button)(_templateObject || (_templateObject = _taggedTempla
   var state = secondary ? 'secondary' : 'primary';
   return "\n      background-color: " + outline.backgroundColor["default"] + ";\n      border: " + outline.border.width + "px solid;\n      border-color: " + outline.font["default"][state].color + ";\n      color: " + outline.font["default"][state].color + ";\n\n      svg {\n        fill: " + outline.font["default"][state].color + ";\n      }\n\n      &:not([disabled]):hover, &:not([disabled]):focus {\n        background-color: " + outline.backgroundColor[state].hover + ";\n        color: " + outline.font.hover.color + ";\n\n        svg {\n          fill: " + outline.font.hover.color + ";\n        }\n      }\n\n      &:not([disabled]):active {\n        background-color: " + outline.backgroundColor["default"] + ";\n        border-color: " + outline.font.pressed[state].color + ";\n        color: " + outline.font.pressed[state].color + ";\n        box-shadow: none;\n\n        svg {\n          fill: " + outline.font.pressed[state].color + ";\n        }\n      }\n\n      &:disabled {\n        background-color: " + outline.backgroundColor["default"] + ";\n        border-color: " + outline.font.disabled.color + ";\n        color: " + outline.font.disabled.color + ";\n\n        svg {\n          fill: " + outline.font.disabled.color + ";\n        }\n      }\n\n      " + (inverted ? "\n            border-color: " + white + ";\n            color: " + white + ";\n\n            svg {\n              fill: " + white + ";\n            }\n\n            &:not([disabled]):hover, &:not([disabled]):focus {\n              background-color: " + white + ";\n              color: " + outline.font["default"][state].color + ";\n\n              svg {\n                fill: " + outline.font["default"][state].color + ";\n              }\n            }\n\n            &:not([disabled]):active {\n              background-color: " + outline.backgroundColor["default"] + ";\n              border-color: " + hexToRgb(white, 0.75) + ";\n              color: " + hexToRgb(white, 0.75) + ";\n\n              svg {\n                fill: " + hexToRgb(white, 0.75) + ";\n              }\n            }\n\n            &:disabled {\n              border-color: " + outline.font.disabled.color + ";\n              color: " + outline.font.disabled.color + ";\n              svg {\n                fill: " + outline.font.disabled.color + ";\n              }\n            }\n          " : '') + "\n    ";
 });
-
-var ButtonOutline = function ButtonOutline(props) {
-  return /*#__PURE__*/React.createElement(Outline, props);
-};
-
-ButtonOutline.propTypes = {
-  disabled: bool,
-  full: bool,
-  inverted: bool,
-  onClick: func,
-  secondary: bool,
-  small: bool,
-
-  /** an Icon from yoga-icons package */
-  icon: oneOfType([node, func])
-};
-ButtonOutline.defaultProps = {
-  disabled: false,
-  full: false,
-  inverted: false,
-  onClick: function onClick() {},
-  secondary: false,
-  small: false,
-  icon: undefined
-};
 ButtonOutline.displayName = 'Button.Outline';
 export default ButtonOutline;

package/esm/Checkbox/web/Checkbox.js

@@ -1,4 +1,4 @@
-var _excluded = ["value", "label", "helper", "disabled", "checked", "error", "style", "className", "inverted", "theme"];
+var _excluded = ["value", "label", "helper", "disabled", "checked", "error", "style", "className", "inverted", "indeterminate", "theme"];
 
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7;
 
@@ -8,11 +8,11 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
 
 function _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.slice(0); } strings.raw = raw; return strings; }
 
-import React from 'react';
+import React, { useEffect, useRef } from 'react';
 import { bool, string, shape } from 'prop-types';
 import styled, { withTheme } from 'styled-components';
 import { hexToRgb } from '@gympass/yoga-common';
-import { Check } from '@gympass/yoga-icons';
+import { Check, Rectangle } from '@gympass/yoga-icons';
 import { HiddenInput } from '../../shared';
 var CheckboxWrapper = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n  display: inline-block;\n\n  * {\n    box-sizing: border-box;\n  }\n\n  ", "\n"])), function (_ref) {
   var disabled = _ref.disabled;
@@ -23,6 +23,7 @@ var CheckMark = styled.div(_templateObject2 || (_templateObject2 = _taggedTempla
       disabled = _ref2.disabled,
       inverted = _ref2.inverted,
       error = _ref2.error,
+      indeterminate = _ref2.indeterminate,
       _ref2$theme$yoga = _ref2.theme.yoga,
       _ref2$theme$yoga$colo = _ref2$theme$yoga.colors,
       primary = _ref2$theme$yoga$colo.primary,
@@ -38,18 +39,18 @@ var CheckMark = styled.div(_templateObject2 || (_templateObject2 = _taggedTempla
     var _feedback$attention = feedback.attention;
     borderColor = _feedback$attention[1];
 
-    if (checked) {
+    if (checked || indeterminate) {
       var _feedback$attention2 = feedback.attention;
       bgColor = _feedback$attention2[1];
     }
   } else if (disabled) {
     borderColor = checkbox.disabled.border.color;
 
-    if (checked) {
+    if (checked || indeterminate) {
       bgColor = checkbox.disabled.backgroundColor;
       borderColor = elements.lineAndBorders;
     }
-  } else if (checked) {
+  } else if (checked || indeterminate) {
     borderColor = primary;
     bgColor = primary;
     checkColor = checkbox.checked.icon.color;
@@ -78,6 +79,7 @@ var CheckboxStyled = styled.div(_templateObject5 || (_templateObject5 = _taggedT
   var checked = _ref5.checked,
       inverted = _ref5.inverted,
       disabled = _ref5.disabled,
+      indeterminate = _ref5.indeterminate,
       _ref5$theme$yoga = _ref5.theme.yoga,
       _ref5$theme$yoga$colo = _ref5$theme$yoga.colors,
       primary = _ref5$theme$yoga$colo.primary,
@@ -91,7 +93,7 @@ var CheckboxStyled = styled.div(_templateObject5 || (_templateObject5 = _taggedT
       return white;
     }
 
-    return checked ? primary : elements.backgroundAndDisabled;
+    return checked || indeterminate ? primary : elements.backgroundAndDisabled;
   };
 
   return "\n      " + (disabled ? "pointer-events: none" : '') + "\n\n      " + Label + ":active,\n      &:focus-within,\n      &:hover  {\n        " + Shadow + " {\n          display: block;\n        }\n      }\n\n      &:hover {\n        " + Shadow + " {\n          background-color: " + hexToRgb(shadowColor(), 0.25) + ";\n\n          box-shadow: 0 0 0 " + shadowSize + "px\n            " + hexToRgb(shadowColor(), 0.25) + ";\n        }\n      }\n\n      &:focus-within {\n        " + Shadow + " {\n          background-color: " + hexToRgb(shadowColor(), 0.5) + ";\n\n          box-shadow: 0 0 0 " + shadowSize + "px\n            " + hexToRgb(shadowColor(), 0.5) + ";\n        }\n      }\n\n      " + Label + ":active {\n        " + Shadow + " {\n          background-color: " + hexToRgb(shadowColor(), 0.75) + ";\n\n          box-shadow: 0 0 0 " + shadowSize + "px\n            " + hexToRgb(shadowColor(), 0.75) + ";\n        }\n      }\n    ";
@@ -121,27 +123,40 @@ var Checkbox = function Checkbox(_ref8) {
       style = _ref8.style,
       className = _ref8.className,
       inverted = _ref8.inverted,
+      indeterminate = _ref8.indeterminate,
       checkbox = _ref8.theme.yoga.components.checkbox,
       rest = _objectWithoutPropertiesLoose(_ref8, _excluded);
 
+  var inputRef = useRef(null);
+  useEffect(function () {
+    if (inputRef.current) {
+      inputRef.current.indeterminate = indeterminate;
+    }
+  });
   return /*#__PURE__*/React.createElement(CheckboxWrapper, {
     style: style,
     className: className,
     disabled: disabled
   }, /*#__PURE__*/React.createElement(CheckboxStyled, {
     checked: checked,
+    indeterminate: indeterminate,
     inverted: inverted,
     disabled: disabled
   }, /*#__PURE__*/React.createElement(Label, null, /*#__PURE__*/React.createElement(Shadow, null), /*#__PURE__*/React.createElement(CheckMark, {
     disabled: disabled,
     checked: checked,
     error: error,
-    inverted: inverted
-  }, checked && /*#__PURE__*/React.createElement(Check, {
+    inverted: inverted,
+    indeterminate: indeterminate
+  }, checked && !indeterminate && /*#__PURE__*/React.createElement(Check, {
+    width: checkbox.size,
+    height: checkbox.size
+  }), indeterminate && /*#__PURE__*/React.createElement(Rectangle, {
     width: checkbox.size,
     height: checkbox.size
   })), /*#__PURE__*/React.createElement(HiddenInput, _extends({
     type: "checkbox",
+    ref: inputRef,
     checked: checked,
     disabled: disabled
   }, rest)), label)), (helper || error) && /*#__PURE__*/React.createElement(HelperWrapper, null, /*#__PURE__*/React.createElement(Helper, {
@@ -160,6 +175,9 @@ Checkbox.propTypes = {
   inverted: bool,
   error: string,
 
+  /** if true, the component appears indeterminate */
+  indeterminate: bool,
+
   /** set a style to the checkbox container */
   style: shape({}),
   className: string
@@ -171,6 +189,7 @@ Checkbox.defaultProps = {
   checked: false,
   disabled: false,
   inverted: false,
+  indeterminate: false,
   error: undefined,
   style: undefined,
   className: undefined

package/esm/Input/web/Field.js

@@ -1,4 +1,4 @@
-var _templateObject, _templateObject2, _templateObject3, _templateObject4;
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
 
 function _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.slice(0); } strings.raw = raw; return strings; }
 
@@ -11,7 +11,9 @@ var labelTransition = css(_templateObject || (_templateObject = _taggedTemplateL
   return "\n    transform: translateY(-" + (input.height / 2 - 2) + "px);\n    transition-property: transform, font-size, color;\n    transition-duration: " + transition.duration[1] + "ms;\n    transition-timing-function: cubic-bezier(" + transition.timing[0].join() + ");\n\n    font-size: " + input.label.font.size.typed + "px;\n  ";
 });
 var Field = styled.input(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n  width: 100%;\n\n  appearance: none;\n  background-color: transparent;\n  outline: none;\n\n  position: absolute;\n  bottom: 0;\n  left: 0;\n\n  border: none;\n  box-sizing: border-box;\n\n  ", "\n\n  &[type=\"number\"]::-webkit-outer-spin-button,\n  &[type=\"number\"]::-webkit-inner-spin-button {\n    display: none;\n  }\n\n  &:invalid {\n    box-shadow: none;\n  }\n"])), function (_ref2) {
-  var cleanable = _ref2.cleanable,
+  var label = _ref2.label,
+      placeholder = _ref2.placeholder,
+      cleanable = _ref2.cleanable,
       error = _ref2.error,
       value = _ref2.value,
       _ref2$theme$yoga = _ref2.theme.yoga,
@@ -19,6 +21,6 @@ var Field = styled.input(_templateObject2 || (_templateObject2 = _taggedTemplate
       colors = _ref2$theme$yoga.colors,
       baseFont = _ref2$theme$yoga.baseFont,
       input = _ref2$theme$yoga.components.input;
-  return 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\n    &:disabled {\n      cursor: not-allowed;\n      color: ", ";\n    }\n\n    &::placeholder {\n      color: ", ";\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, colors.text.disabled, input.label.color["default"], value && css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n        & ~ legend {\n          max-width: max-content;\n        }\n\n        & ~ label {\n          color: ", ";\n          ", "\n        }\n      "])), error ? "" + colors.feedback.attention[1] : '', labelTransition));
+  return 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 ? css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n            &::placeholder {\n              color: transparent;\n            }\n          "]))) : css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n            &::placeholder {\n              color: ", ";\n            }\n          "])), input.label.color["default"]), value && 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));
 });
 export default Field;

package/esm/Input/web/Input.js

@@ -66,6 +66,7 @@ var Input = /*#__PURE__*/React.forwardRef(function (_ref3, ref) {
     style: style,
     value: value
   }, /*#__PURE__*/React.createElement(Field, _extends({}, props, {
+    label: label,
     cleanable: cleanable,
     disabled: disabled,
     error: error,
@@ -119,7 +120,8 @@ Input.propTypes = {
   onClean: func,
 
   /** when max length helper is unnecessary to appear */
-  hideMaxLength: bool
+  hideMaxLength: bool,
+  placeholder: string
 };
 Input.defaultProps = {
   className: undefined,
@@ -135,6 +137,7 @@ Input.defaultProps = {
   value: '',
   onChange: function onChange() {},
   onClean: function onClean() {},
-  hideMaxLength: false
+  hideMaxLength: false,
+  placeholder: undefined
 };
 export default Input;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gympass/yoga",
-  "version": "7.29.1",
+  "version": "7.31.0",
   "description": "Gympass component library",
   "main": "./cjs",
   "sideEffects": false,
@@ -27,7 +27,7 @@
   "dependencies": {
     "@gympass/yoga-common": "^1.1.0",
     "@gympass/yoga-helpers": "^1.0.1",
-    "@gympass/yoga-icons": "^1.4.1",
+    "@gympass/yoga-icons": "^1.4.2",
     "@gympass/yoga-system": "^0.10.0",
     "@gympass/yoga-tokens": "^3.1.1",
     "@ptomasroos/react-native-multi-slider": "^1.0.0",
@@ -49,7 +49,7 @@
     "react": ">=16",
     "styled-components": "^4.4.0"
   },
-  "gitHead": "2249c0de370c820761a9afd6f904c0d680308e23",
+  "gitHead": "d34436120c855348d2b248e0058694a55ef5a83c",
   "module": "./esm",
   "private": false,
   "react-native": "./cjs/index.native.js"