@gympass/yoga 7.32.1 → 7.34.0

package/cjs/Heading/Heading.theme.js

@@ -0,0 +1,24 @@
+"use strict";
+
+exports.__esModule = true;
+exports["default"] = void 0;
+
+var Heading = function Heading(_ref) {
+  var spacing = _ref.spacing,
+      colors = _ref.colors;
+  return {
+    background: colors.white,
+    padding: {
+      vertical: spacing.small,
+      horizontal: spacing.huge
+    },
+    height: 48,
+    button: {
+      width: 48,
+      height: spacing.xxlarge
+    }
+  };
+};
+
+var _default = Heading;
+exports["default"] = _default;

package/cjs/Heading/index.js

@@ -0,0 +1,11 @@
+"use strict";
+
+exports.__esModule = true;
+exports["default"] = void 0;
+
+var _web = _interopRequireDefault(require("./web"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+var _default = _web["default"];
+exports["default"] = _default;

package/cjs/Heading/web/BackButton.js

@@ -0,0 +1,37 @@
+"use strict";
+
+exports.__esModule = true;
+exports["default"] = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _yogaIcons = require("@gympass/yoga-icons");
+
+var _Button = _interopRequireDefault(require("../../Button"));
+
+var _excluded = ["onClick"];
+
+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; }
+
+var BackButton = function BackButton(_ref) {
+  var onClick = _ref.onClick,
+      props = _objectWithoutPropertiesLoose(_ref, _excluded);
+
+  return /*#__PURE__*/_react["default"].createElement(_Button["default"].Icon, _extends({}, props, {
+    icon: _yogaIcons.ArrowLeft,
+    inverted: true,
+    onClick: onClick
+  }));
+};
+
+BackButton.propTypes = {
+  onClick: _propTypes["default"].func.isRequired
+};
+var _default = BackButton;
+exports["default"] = _default;

package/cjs/Heading/web/Heading.js

@@ -0,0 +1,55 @@
+"use strict";
+
+exports.__esModule = true;
+exports["default"] = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _StyledHeading = _interopRequireWildcard(require("./StyledHeading"));
+
+var _Box = _interopRequireDefault(require("../../Box"));
+
+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 _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+var Heading = function Heading(_ref) {
+  var children = _ref.children;
+  var backButton = null;
+  var title = null;
+  var rightButtons = [];
+  if (!children) throw new Error('Heading needs at least one child');
+
+  var defineComponent = function defineComponent(child) {
+    if (child.type.name === 'Title') title = child;
+    if (child.type.name === 'BackButton') backButton = child;
+    if (child.type.name === 'RightButton') rightButtons.push(child);
+  };
+
+  if (Array.isArray(children)) {
+    children.forEach(function (child) {
+      return defineComponent(child);
+    });
+  } else {
+    defineComponent(children);
+  }
+
+  return /*#__PURE__*/_react["default"].createElement(_StyledHeading["default"], null, backButton || /*#__PURE__*/_react["default"].createElement(_StyledHeading.Button, null), title || /*#__PURE__*/_react["default"].createElement(_Box["default"], {
+    w: "100%"
+  }), /*#__PURE__*/_react["default"].createElement(_Box["default"], {
+    display: "flex",
+    "justify-content": "space-between",
+    alignItems: "center"
+  }, rightButtons.length > 0 ? rightButtons : /*#__PURE__*/_react["default"].createElement(_StyledHeading.Button, null)));
+};
+
+Heading.propTypes = {
+  children: _propTypes["default"].oneOfType([_propTypes["default"].arrayOf(_propTypes["default"].node), _propTypes["default"].node]).isRequired
+};
+Heading.defaultProps = {};
+var _default = Heading;
+exports["default"] = _default;

package/cjs/Heading/web/RightButton.js

@@ -0,0 +1,37 @@
+"use strict";
+
+exports.__esModule = true;
+exports["default"] = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _Button = _interopRequireDefault(require("../../Button"));
+
+var _excluded = ["onClick", "icon"];
+
+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; }
+
+var RightButton = function RightButton(_ref) {
+  var onClick = _ref.onClick,
+      icon = _ref.icon,
+      props = _objectWithoutPropertiesLoose(_ref, _excluded);
+
+  return /*#__PURE__*/_react["default"].createElement(_Button["default"].Icon, _extends({}, props, {
+    icon: icon,
+    inverted: true,
+    onClick: onClick
+  }));
+};
+
+RightButton.propTypes = {
+  onClick: _propTypes["default"].func.isRequired,
+  icon: _propTypes["default"].node.isRequired
+};
+var _default = RightButton;
+exports["default"] = _default;

package/cjs/Heading/web/StyledHeading.js

@@ -0,0 +1,26 @@
+"use strict";
+
+exports.__esModule = true;
+exports["default"] = exports.Button = void 0;
+
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+
+var _templateObject, _templateObject2;
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.slice(0); } strings.raw = raw; return strings; }
+
+var StyledHeading = _styledComponents["default"].header(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n  ", "\n"])), function (_ref) {
+  var heading = _ref.theme.yoga.components.heading;
+  return "\n    background: " + heading.background + ";\n    padding: " + heading.padding.vertical + "px;\n    width: 100%;\n    min-height: " + heading.height + "px;\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n\n    @media(min-width: 769px) {\n        padding: " + heading.padding.vertical + "px " + heading.padding.horizontal + "px;\n    }\n  ";
+});
+
+var Button = _styledComponents["default"].div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n  ", "\n"])), function (_ref2) {
+  var heading = _ref2.theme.yoga.components.heading;
+  return "\n    width: " + heading.button.width + "px;\n    height: " + heading.button.height + "px;\n  ";
+});
+
+exports.Button = Button;
+var _default = StyledHeading;
+exports["default"] = _default;

package/cjs/Heading/web/Title.js

@@ -0,0 +1,39 @@
+"use strict";
+
+exports.__esModule = true;
+exports["default"] = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _Text = _interopRequireDefault(require("../../Text"));
+
+var _Box = _interopRequireDefault(require("../../Box"));
+
+var _excluded = ["children"];
+
+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; }
+
+var Title = function Title(_ref) {
+  var children = _ref.children,
+      props = _objectWithoutPropertiesLoose(_ref, _excluded);
+
+  return /*#__PURE__*/_react["default"].createElement(_Box["default"], {
+    w: "100%",
+    textAlign: "center"
+  }, /*#__PURE__*/_react["default"].createElement(_Text["default"].Medium, _extends({}, props, {
+    size: "small",
+    as: "h1"
+  }), children));
+};
+
+Title.propTypes = {
+  children: _propTypes["default"].string.isRequired
+};
+var _default = Title;
+exports["default"] = _default;

package/cjs/Heading/web/index.js

@@ -0,0 +1,20 @@
+"use strict";
+
+exports.__esModule = true;
+exports["default"] = void 0;
+
+var _Heading = _interopRequireDefault(require("./Heading"));
+
+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 }; }
+
+_Heading["default"].Title = _Title["default"];
+_Heading["default"].BackButton = _BackButton["default"];
+_Heading["default"].RightButton = _RightButton["default"];
+var _default = _Heading["default"];
+exports["default"] = _default;

package/cjs/Snackbar/Snackbar.theme.js

@@ -19,7 +19,9 @@ var Snackbar = function Snackbar(_ref) {
       max: spacing.huge
     },
     padding: {
-      "default": spacing.small
+      "default": spacing.small,
+      vertical: spacing.xsmall,
+      horizontal: spacing.small
     },
     position: {
       desktop: {
@@ -39,7 +41,9 @@ var Snackbar = function Snackbar(_ref) {
       color: {
         success: colors.feedback.success.light,
         failure: colors.feedback.attention.light,
-        info: colors.feedback.informative.light
+        info: colors.feedback.informative.light,
+        attention: colors.feedback.attention.light,
+        informative: colors.feedback.informative.light
       },
       icon: {
         success: _yogaIcons.CheckedFull,
@@ -53,6 +57,13 @@ var Snackbar = function Snackbar(_ref) {
     },
     maxWidth: {
       "default": 600
+    },
+    margin: {
+      top: spacing.zero,
+      right: spacing.medium,
+      bottom: spacing.medium,
+      left: spacing.medium,
+      horizontal: spacing.medium
     }
   };
 };

package/cjs/Snackbar/index.native.js

@@ -0,0 +1 @@
+var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports["default"]=void 0;var _native=_interopRequireDefault(require("./native"));var _default=_native["default"];exports["default"]=_default;

package/cjs/Snackbar/native/Snackbar.js

@@ -0,0 +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 _taggedTemplateLiteralLoose2=_interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _react=_interopRequireWildcard(require("react"));var _styledComponents=_interopRequireDefault(require("styled-components"));var _propTypes=require("prop-types");var _reactNative=require("react-native");var _Box=_interopRequireDefault(require("../../Box"));var _Button=_interopRequireDefault(require("../../Button"));var _Icon=_interopRequireDefault(require("../../Icon"));var _Text=_interopRequireDefault(require("../../Text"));var _SnackbarAnimationWrapper=_interopRequireDefault(require("./SnackbarAnimationWrapper"));var _excluded=["icon","message","actionLabel","onAction","variant","onSnackbarClose","duration","bottomOffset"];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 SWIPE_THRESHOLD=32;var SnackbarContainer=_styledComponents["default"].View(_templateObject||(_templateObject=(0,_taggedTemplateLiteralLoose2["default"])(["\n  ","\n"])),function(_ref){var bottomOffset=_ref.bottomOffset,variant=_ref.variant,_ref$theme$yoga=_ref.theme.yoga,feedback=_ref$theme$yoga.colors.feedback,_ref$theme$yoga$compo=_ref$theme$yoga.components.snackbar,padding=_ref$theme$yoga$compo.padding,margin=_ref$theme$yoga$compo.margin,_ref$theme$yoga$compo2=_ref$theme$yoga$compo.variant.color[variant],backgroundColor=_ref$theme$yoga$compo2===void 0?feedback.success.light:_ref$theme$yoga$compo2,border=_ref$theme$yoga$compo.border;return"\n    padding: "+padding.vertical+"px "+padding.horizontal+"px;\n    margin-horizontal: "+margin.horizontal+"px\n    margin-bottom: "+(margin.bottom+bottomOffset)+"px;\n    background-color: "+backgroundColor+";\n    border-radius: "+border.radius+"px;\n    flex-direction: row;\n    align-items: center;\n  ";});var Snackbar=(0,_react.forwardRef)(function(props,ref){var icon=props.icon,message=props.message,actionLabel=props.actionLabel,onAction=props.onAction,variant=props.variant,onSnackbarClose=props.onSnackbarClose,duration=props.duration,bottomOffset=props.bottomOffset,rest=(0,_objectWithoutProperties2["default"])(props,_excluded);var wrapperRef=(0,_react.useRef)();var _useState=(0,_react.useState)({icon:icon,message:message,actionLabel:actionLabel,onAction:onAction,variant:variant}),_useState2=(0,_slicedToArray2["default"])(_useState,2),currentProps=_useState2[0],setCurrentProps=_useState2[1];(0,_react.useImperativeHandle)(ref,function(){return{open:function open(){wrapperRef.current.open();},close:function close(){wrapperRef.current.close();}};});(0,_react.useEffect)(function(){if(wrapperRef.current&&currentProps.message){wrapperRef.current.close(function(){setCurrentProps({icon:icon,message:message,actionLabel:actionLabel,onAction:onAction,variant:variant});wrapperRef.current.open();});}else{setCurrentProps({icon:icon,message:message,actionLabel:actionLabel,onAction:onAction,variant:variant});}},[icon,message,actionLabel,onAction,variant]);var handlePanResponderRelease=function handlePanResponderRelease(_evt,gestureState){if(gestureState.dy>SWIPE_THRESHOLD){wrapperRef.current.close();}else{wrapperRef.current.open();}};var panResponder=_reactNative.PanResponder.create({onPanResponderMove:function onPanResponderMove(_,gestureState){if(gestureState.dy>0){wrapperRef.current.translateY(gestureState.dy);}},onPanResponderRelease:handlePanResponderRelease,onPanResponderTerminate:handlePanResponderRelease,onStartShouldSetPanResponder:function onStartShouldSetPanResponder(){return true;},onMoveShouldSetPanResponder:function onMoveShouldSetPanResponder(_,gestureState){return!(gestureState.dy<=2&&gestureState.dy>=-2);},onMoveShouldSetPanResponderCapture:function onMoveShouldSetPanResponderCapture(){return true;},onPanResponderTerminationRequest:function onPanResponderTerminationRequest(){return true;},onShouldBlockNativeResponder:function onShouldBlockNativeResponder(){return true;}});var handleOnAction=function handleOnAction(){wrapperRef.current.close();if(currentProps.onAction){currentProps.onAction();}};return _react["default"].createElement(_SnackbarAnimationWrapper["default"],{onSnackbarClose:onSnackbarClose,duration:duration,ref:wrapperRef},_react["default"].createElement(SnackbarContainer,(0,_extends2["default"])({variant:currentProps.variant,bottomOffset:bottomOffset},rest,panResponder.panHandlers),currentProps.icon&&_react["default"].createElement(_Icon["default"],{as:currentProps.icon,fill:"secondary",size:"large",marginRight:"xxsmall"}),_react["default"].createElement(_Text["default"],{flex:1,fontSize:"small",marginVertical:"xxxsmall",numberOfLines:2},currentProps.message),currentProps.actionLabel&&_react["default"].createElement(_Box["default"],{as:_Button["default"].Text,small:true,secondary:true,marginLeft:"xxsmall",onPress:handleOnAction},currentProps.actionLabel)));});Snackbar.propTypes={variant:(0,_propTypes.oneOf)(['success','informative','attention']),icon:_propTypes.elementType,message:_propTypes.string,actionLabel:_propTypes.string,onAction:_propTypes.func,onSnackbarClose:_propTypes.func,duration:(0,_propTypes.oneOf)(['fast','default','slow','indefinite']),bottomOffset:_propTypes.number};Snackbar.defaultProps={variant:'success',icon:undefined,message:'',actionLabel:undefined,onAction:undefined,onSnackbarClose:undefined,duration:'default',bottomOffset:0};var _default=Snackbar;exports["default"]=_default;

package/cjs/Snackbar/native/SnackbarAnimationWrapper.js

@@ -0,0 +1 @@
+var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports["default"]=void 0;var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _propTypes=require("prop-types");var _styledComponents=_interopRequireDefault(require("styled-components"));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 durationDictionary={fast:4000,"default":8000,slow:10000,indefinite:-1};var Wrapper=(0,_styledComponents["default"])(_reactNative.Animated.View)(function(){return"\n    position: absolute;\n    width: 100%;\n    bottom: 0px;\n  ";});var SnackbarAnimationWrapper=(0,_react.forwardRef)(function(_ref,ref){var onSnackbarClose=_ref.onSnackbarClose,children=_ref.children,duration=_ref.duration;var _useWindowDimensions=(0,_reactNative.useWindowDimensions)(),windowHeight=_useWindowDimensions.height;var _useState=(0,_react.useState)(),_useState2=(0,_slicedToArray2["default"])(_useState,2),childrenHeight=_useState2[0],setChildrenHeight=_useState2[1];var _translateY=(0,_react.useRef)(new _reactNative.Animated.Value(windowHeight)).current;var timeoutRef=(0,_react.useRef)();var childrenRef=(0,_react.useRef)();var openAnimation=function openAnimation(){_reactNative.Animated.spring(_translateY,{toValue:0,bounciness:0,useNativeDriver:true}).start();};var closeAnimation=function closeAnimation(callback){if(childrenHeight){_reactNative.Animated.spring(_translateY,{toValue:childrenHeight,bounciness:0,useNativeDriver:true}).start(function(_ref2){var finished=_ref2.finished;if(finished&&callback){callback();}});if(onSnackbarClose){onSnackbarClose();}}};var setupSnackbarTimeout=function setupSnackbarTimeout(){var timeoutDuration=durationDictionary[duration];var shouldCloseOnTimer=childrenHeight&&timeoutDuration>0;if(shouldCloseOnTimer){timeoutRef.current=setTimeout(function(){clearTimeout(timeoutRef.current);closeAnimation();},timeoutDuration);}};var openSnackbar=function openSnackbar(){openAnimation();setupSnackbarTimeout();};var closeSnackbar=function closeSnackbar(callback){clearTimeout(timeoutRef.current);closeAnimation(callback);};(0,_react.useImperativeHandle)(ref,function(){return{open:function open(){openSnackbar();},close:function close(callback){closeSnackbar(callback);},translateY:function translateY(dy){_translateY.setValue(dy);}};});(0,_react.useEffect)(function(){return function(){return clearTimeout(timeoutRef.current);};},[]);return _react["default"].createElement(Wrapper,{style:{zIndex:10,transform:[{translateY:_translateY}]}},_react["default"].createElement(_reactNative.View,{testID:"wrapper",ref:childrenRef,onLayout:function onLayout(_ref3){var height=_ref3.nativeEvent.layout.height;setChildrenHeight(height);_translateY.setValue(height);}},children));});SnackbarAnimationWrapper.propTypes={onSnackbarClose:_propTypes.func,children:_propTypes.node.isRequired,duration:(0,_propTypes.oneOf)(['fast','default','slow','indefinite']).isRequired};SnackbarAnimationWrapper.defaultProps={onSnackbarClose:undefined};var _default=SnackbarAnimationWrapper;exports["default"]=_default;

package/cjs/Snackbar/native/index.js

@@ -0,0 +1 @@
+var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports["default"]=void 0;var _Snackbar=_interopRequireDefault(require("./Snackbar"));var _default=_Snackbar["default"];exports["default"]=_default;

package/cjs/Snackbar/web/Snackbar.js

@@ -51,6 +51,13 @@ var StyledSnackbar = _styledComponents["default"].div(_templateObject3 || (_temp
 
 var fadeIn = (0, _styledComponents.keyframes)(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n  0% {\n    opacity: 0;\n  }\n  100% {\n    opacity: 1;\n  }\n"])));
 var AnimatedSnackbar = (0, _styledComponents["default"])(StyledSnackbar)(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n  animation: ", " 0.2s ease-in-out;\n"])), fadeIn);
+/**
+ * Gympass `<Snackbar />` is the proper component to show alert messages.
+ *
+ * For web components, the `Snackbar` may have an icon, a custom action and a close button.
+ *
+ * For native, the `Snackbar` may have an icon and a custom action.
+ */
 
 var Snackbar = function Snackbar(_ref2) {
   var open = _ref2.open,

package/cjs/Theme/theme/theme.js

@@ -35,6 +35,8 @@ var _GridTheme = _interopRequireDefault(require("./../../Grid/Grid.theme.js"));
 
 var _HeaderTheme = _interopRequireDefault(require("./../../Header/Header.theme.js"));
 
+var _HeadingTheme = _interopRequireDefault(require("./../../Heading/Heading.theme.js"));
+
 var _IconTheme = _interopRequireDefault(require("./../../Icon/Icon.theme.js"));
 
 var _InputTheme = _interopRequireDefault(require("./../../Input/Input.theme.js"));
@@ -81,6 +83,7 @@ var componentThemes = {
   Dropdown$Dropdown: _DropdownTheme["default"],
   Grid$Grid: _GridTheme["default"],
   Header$Header: _HeaderTheme["default"],
+  Heading$Heading: _HeadingTheme["default"],
   Icon$Icon: _IconTheme["default"],
   Input$Input: _InputTheme["default"],
   List$List: _ListTheme["default"],

package/cjs/index.js

@@ -119,6 +119,10 @@ var _Banner = _interopRequireDefault(require("./Banner"));
 
 exports.Banner = _Banner["default"];
 
+var _Heading = _interopRequireDefault(require("./Heading"));
+
+exports.Heading = _Heading["default"];
+
 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); }

package/cjs/index.native.js

@@ -1 +1 @@
-var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});Object.defineProperty(exports,"Avatar",{enumerable:true,get:function get(){return _Avatar["default"];}});Object.defineProperty(exports,"Banner",{enumerable:true,get:function get(){return _Banner["default"];}});Object.defineProperty(exports,"Box",{enumerable:true,get:function get(){return _Box["default"];}});Object.defineProperty(exports,"Button",{enumerable:true,get:function get(){return _Button["default"];}});Object.defineProperty(exports,"Card",{enumerable:true,get:function get(){return _native.Card;}});Object.defineProperty(exports,"Checkbox",{enumerable:true,get:function get(){return _Checkbox["default"];}});Object.defineProperty(exports,"Chips",{enumerable:true,get:function get(){return _Chips["default"];}});Object.defineProperty(exports,"Divider",{enumerable:true,get:function get(){return _Divider["default"];}});Object.defineProperty(exports,"Dropdown",{enumerable:true,get:function get(){return _Dropdown["default"];}});Object.defineProperty(exports,"EventCard",{enumerable:true,get:function get(){return _native.EventCard;}});Object.defineProperty(exports,"GymCard",{enumerable:true,get:function get(){return _native.GymCard;}});Object.defineProperty(exports,"Icon",{enumerable:true,get:function get(){return _Icon["default"];}});Object.defineProperty(exports,"Input",{enumerable:true,get:function get(){return _Input["default"];}});Object.defineProperty(exports,"List",{enumerable:true,get:function get(){return _List["default"];}});Object.defineProperty(exports,"PlanCard",{enumerable:true,get:function get(){return _native.PlanCard;}});Object.defineProperty(exports,"Progress",{enumerable:true,get:function get(){return _Progress["default"];}});Object.defineProperty(exports,"RadioGroup",{enumerable:true,get:function get(){return _RadioGroup["default"];}});Object.defineProperty(exports,"Rating",{enumerable:true,get:function get(){return _Rating["default"];}});Object.defineProperty(exports,"Result",{enumerable:true,get:function get(){return _Result["default"];}});Object.defineProperty(exports,"Slider",{enumerable:true,get:function get(){return _Slider["default"];}});Object.defineProperty(exports,"Stepper",{enumerable:true,get:function get(){return _Stepper["default"];}});Object.defineProperty(exports,"Tag",{enumerable:true,get:function get(){return _Tag["default"];}});Object.defineProperty(exports,"Text",{enumerable:true,get:function get(){return _Text["default"];}});Object.defineProperty(exports,"TextArea",{enumerable:true,get:function get(){return _TextArea["default"];}});Object.defineProperty(exports,"ThemeProvider",{enumerable:true,get:function get(){return _Theme["default"];}});Object.defineProperty(exports,"createTheme",{enumerable:true,get:function get(){return _Theme.createTheme;}});Object.defineProperty(exports,"theme",{enumerable:true,get:function get(){return _Theme.theme;}});Object.defineProperty(exports,"yogaTheme",{enumerable:true,get:function get(){return _Theme.yogaTheme;}});var _Theme=_interopRequireWildcard(require("./Theme"));var _Button=_interopRequireDefault(require("./Button"));var _List=_interopRequireDefault(require("./List"));var _Checkbox=_interopRequireDefault(require("./Checkbox"));var _Slider=_interopRequireDefault(require("./Slider"));var _RadioGroup=_interopRequireDefault(require("./RadioGroup"));var _native=require("./Card/native");var _Stepper=_interopRequireDefault(require("./Stepper"));var _Text=_interopRequireDefault(require("./Text"));var _Rating=_interopRequireDefault(require("./Rating"));var _Tag=_interopRequireDefault(require("./Tag"));var _Input=_interopRequireDefault(require("./Input"));var _Progress=_interopRequireDefault(require("./Progress"));var _Dropdown=_interopRequireDefault(require("./Dropdown"));var _TextArea=_interopRequireDefault(require("./TextArea"));var _Icon=_interopRequireDefault(require("./Icon"));var _Chips=_interopRequireDefault(require("./Chips"));var _Box=_interopRequireDefault(require("./Box"));var _Avatar=_interopRequireDefault(require("./Avatar"));var _Result=_interopRequireDefault(require("./Result"));var _Divider=_interopRequireDefault(require("./Divider"));var _Banner=_interopRequireDefault(require("./Banner"));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 _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});Object.defineProperty(exports,"Avatar",{enumerable:true,get:function get(){return _Avatar["default"];}});Object.defineProperty(exports,"Banner",{enumerable:true,get:function get(){return _Banner["default"];}});Object.defineProperty(exports,"Box",{enumerable:true,get:function get(){return _Box["default"];}});Object.defineProperty(exports,"Button",{enumerable:true,get:function get(){return _Button["default"];}});Object.defineProperty(exports,"Card",{enumerable:true,get:function get(){return _native.Card;}});Object.defineProperty(exports,"Checkbox",{enumerable:true,get:function get(){return _Checkbox["default"];}});Object.defineProperty(exports,"Chips",{enumerable:true,get:function get(){return _Chips["default"];}});Object.defineProperty(exports,"Divider",{enumerable:true,get:function get(){return _Divider["default"];}});Object.defineProperty(exports,"Dropdown",{enumerable:true,get:function get(){return _Dropdown["default"];}});Object.defineProperty(exports,"EventCard",{enumerable:true,get:function get(){return _native.EventCard;}});Object.defineProperty(exports,"GymCard",{enumerable:true,get:function get(){return _native.GymCard;}});Object.defineProperty(exports,"Icon",{enumerable:true,get:function get(){return _Icon["default"];}});Object.defineProperty(exports,"Input",{enumerable:true,get:function get(){return _Input["default"];}});Object.defineProperty(exports,"List",{enumerable:true,get:function get(){return _List["default"];}});Object.defineProperty(exports,"PlanCard",{enumerable:true,get:function get(){return _native.PlanCard;}});Object.defineProperty(exports,"Progress",{enumerable:true,get:function get(){return _Progress["default"];}});Object.defineProperty(exports,"RadioGroup",{enumerable:true,get:function get(){return _RadioGroup["default"];}});Object.defineProperty(exports,"Rating",{enumerable:true,get:function get(){return _Rating["default"];}});Object.defineProperty(exports,"Result",{enumerable:true,get:function get(){return _Result["default"];}});Object.defineProperty(exports,"Slider",{enumerable:true,get:function get(){return _Slider["default"];}});Object.defineProperty(exports,"Snackbar",{enumerable:true,get:function get(){return _Snackbar["default"];}});Object.defineProperty(exports,"Stepper",{enumerable:true,get:function get(){return _Stepper["default"];}});Object.defineProperty(exports,"Tag",{enumerable:true,get:function get(){return _Tag["default"];}});Object.defineProperty(exports,"Text",{enumerable:true,get:function get(){return _Text["default"];}});Object.defineProperty(exports,"TextArea",{enumerable:true,get:function get(){return _TextArea["default"];}});Object.defineProperty(exports,"ThemeProvider",{enumerable:true,get:function get(){return _Theme["default"];}});Object.defineProperty(exports,"createTheme",{enumerable:true,get:function get(){return _Theme.createTheme;}});Object.defineProperty(exports,"theme",{enumerable:true,get:function get(){return _Theme.theme;}});Object.defineProperty(exports,"yogaTheme",{enumerable:true,get:function get(){return _Theme.yogaTheme;}});var _Theme=_interopRequireWildcard(require("./Theme"));var _Button=_interopRequireDefault(require("./Button"));var _List=_interopRequireDefault(require("./List"));var _Checkbox=_interopRequireDefault(require("./Checkbox"));var _Slider=_interopRequireDefault(require("./Slider"));var _RadioGroup=_interopRequireDefault(require("./RadioGroup"));var _native=require("./Card/native");var _Stepper=_interopRequireDefault(require("./Stepper"));var _Text=_interopRequireDefault(require("./Text"));var _Rating=_interopRequireDefault(require("./Rating"));var _Tag=_interopRequireDefault(require("./Tag"));var _Input=_interopRequireDefault(require("./Input"));var _Progress=_interopRequireDefault(require("./Progress"));var _Dropdown=_interopRequireDefault(require("./Dropdown"));var _TextArea=_interopRequireDefault(require("./TextArea"));var _Icon=_interopRequireDefault(require("./Icon"));var _Chips=_interopRequireDefault(require("./Chips"));var _Box=_interopRequireDefault(require("./Box"));var _Avatar=_interopRequireDefault(require("./Avatar"));var _Result=_interopRequireDefault(require("./Result"));var _Divider=_interopRequireDefault(require("./Divider"));var _Snackbar=_interopRequireDefault(require("./Snackbar"));var _Banner=_interopRequireDefault(require("./Banner"));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;}

package/esm/Heading/Heading.theme.js

@@ -0,0 +1,18 @@
+var Heading = function Heading(_ref) {
+  var spacing = _ref.spacing,
+      colors = _ref.colors;
+  return {
+    background: colors.white,
+    padding: {
+      vertical: spacing.small,
+      horizontal: spacing.huge
+    },
+    height: 48,
+    button: {
+      width: 48,
+      height: spacing.xxlarge
+    }
+  };
+};
+
+export default Heading;

package/esm/Heading/index.js

@@ -0,0 +1,2 @@
+import Heading from './web';
+export default Heading;

package/esm/Heading/web/BackButton.js

@@ -0,0 +1,26 @@
+var _excluded = ["onClick"];
+
+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; }
+
+import React from 'react';
+import PropTypes from 'prop-types';
+import { ArrowLeft } from '@gympass/yoga-icons';
+import Button from '../../Button';
+
+var BackButton = function BackButton(_ref) {
+  var onClick = _ref.onClick,
+      props = _objectWithoutPropertiesLoose(_ref, _excluded);
+
+  return /*#__PURE__*/React.createElement(Button.Icon, _extends({}, props, {
+    icon: ArrowLeft,
+    inverted: true,
+    onClick: onClick
+  }));
+};
+
+BackButton.propTypes = {
+  onClick: PropTypes.func.isRequired
+};
+export default BackButton;

package/esm/Heading/web/Heading.js

@@ -0,0 +1,40 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import StyledHeading, { Button } from './StyledHeading';
+import Box from '../../Box';
+
+var Heading = function Heading(_ref) {
+  var children = _ref.children;
+  var backButton = null;
+  var title = null;
+  var rightButtons = [];
+  if (!children) throw new Error('Heading needs at least one child');
+
+  var defineComponent = function defineComponent(child) {
+    if (child.type.name === 'Title') title = child;
+    if (child.type.name === 'BackButton') backButton = child;
+    if (child.type.name === 'RightButton') rightButtons.push(child);
+  };
+
+  if (Array.isArray(children)) {
+    children.forEach(function (child) {
+      return defineComponent(child);
+    });
+  } else {
+    defineComponent(children);
+  }
+
+  return /*#__PURE__*/React.createElement(StyledHeading, null, backButton || /*#__PURE__*/React.createElement(Button, null), title || /*#__PURE__*/React.createElement(Box, {
+    w: "100%"
+  }), /*#__PURE__*/React.createElement(Box, {
+    display: "flex",
+    "justify-content": "space-between",
+    alignItems: "center"
+  }, rightButtons.length > 0 ? rightButtons : /*#__PURE__*/React.createElement(Button, null)));
+};
+
+Heading.propTypes = {
+  children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]).isRequired
+};
+Heading.defaultProps = {};
+export default Heading;

package/esm/Heading/web/RightButton.js

@@ -0,0 +1,27 @@
+var _excluded = ["onClick", "icon"];
+
+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; }
+
+import React from 'react';
+import PropTypes from 'prop-types';
+import Button from '../../Button';
+
+var RightButton = function RightButton(_ref) {
+  var onClick = _ref.onClick,
+      icon = _ref.icon,
+      props = _objectWithoutPropertiesLoose(_ref, _excluded);
+
+  return /*#__PURE__*/React.createElement(Button.Icon, _extends({}, props, {
+    icon: icon,
+    inverted: true,
+    onClick: onClick
+  }));
+};
+
+RightButton.propTypes = {
+  onClick: PropTypes.func.isRequired,
+  icon: PropTypes.node.isRequired
+};
+export default RightButton;

package/esm/Heading/web/StyledHeading.js

@@ -0,0 +1,14 @@
+var _templateObject, _templateObject2;
+
+function _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.slice(0); } strings.raw = raw; return strings; }
+
+import styled from 'styled-components';
+var StyledHeading = styled.header(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n  ", "\n"])), function (_ref) {
+  var heading = _ref.theme.yoga.components.heading;
+  return "\n    background: " + heading.background + ";\n    padding: " + heading.padding.vertical + "px;\n    width: 100%;\n    min-height: " + heading.height + "px;\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n\n    @media(min-width: 769px) {\n        padding: " + heading.padding.vertical + "px " + heading.padding.horizontal + "px;\n    }\n  ";
+});
+export var Button = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n  ", "\n"])), function (_ref2) {
+  var heading = _ref2.theme.yoga.components.heading;
+  return "\n    width: " + heading.button.width + "px;\n    height: " + heading.button.height + "px;\n  ";
+});
+export default StyledHeading;

package/esm/Heading/web/Title.js

@@ -0,0 +1,28 @@
+var _excluded = ["children"];
+
+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; }
+
+import React from 'react';
+import PropTypes from 'prop-types';
+import Text from '../../Text';
+import Box from '../../Box';
+
+var Title = function Title(_ref) {
+  var children = _ref.children,
+      props = _objectWithoutPropertiesLoose(_ref, _excluded);
+
+  return /*#__PURE__*/React.createElement(Box, {
+    w: "100%",
+    textAlign: "center"
+  }, /*#__PURE__*/React.createElement(Text.Medium, _extends({}, props, {
+    size: "small",
+    as: "h1"
+  }), children));
+};
+
+Title.propTypes = {
+  children: PropTypes.string.isRequired
+};
+export default Title;

package/esm/Heading/web/index.js

@@ -0,0 +1,8 @@
+import Heading from './Heading';
+import Title from './Title';
+import BackButton from './BackButton';
+import RightButton from './RightButton';
+Heading.Title = Title;
+Heading.BackButton = BackButton;
+Heading.RightButton = RightButton;
+export default Heading;

package/esm/Snackbar/Snackbar.theme.js

@@ -14,7 +14,9 @@ var Snackbar = function Snackbar(_ref) {
       max: spacing.huge
     },
     padding: {
-      "default": spacing.small
+      "default": spacing.small,
+      vertical: spacing.xsmall,
+      horizontal: spacing.small
     },
     position: {
       desktop: {
@@ -34,7 +36,9 @@ var Snackbar = function Snackbar(_ref) {
       color: {
         success: colors.feedback.success.light,
         failure: colors.feedback.attention.light,
-        info: colors.feedback.informative.light
+        info: colors.feedback.informative.light,
+        attention: colors.feedback.attention.light,
+        informative: colors.feedback.informative.light
       },
       icon: {
         success: CheckedFull,
@@ -48,6 +52,13 @@ var Snackbar = function Snackbar(_ref) {
     },
     maxWidth: {
       "default": 600
+    },
+    margin: {
+      top: spacing.zero,
+      right: spacing.medium,
+      bottom: spacing.medium,
+      left: spacing.medium,
+      horizontal: spacing.medium
     }
   };
 };

package/esm/Snackbar/web/Snackbar.js

@@ -27,6 +27,13 @@ var StyledSnackbar = styled.div(_templateObject3 || (_templateObject3 = _taggedT
 }, media.md(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n    left: auto;\n    bottom: ", "px;\n    right: ", "px;\n\n    min-width: ", "px;\n  "])), theme.components.snackbar.position.desktop.bottom, theme.components.snackbar.position.desktop.right, theme.components.snackbar.minWidth.desktop));
 var fadeIn = keyframes(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n  0% {\n    opacity: 0;\n  }\n  100% {\n    opacity: 1;\n  }\n"])));
 var AnimatedSnackbar = styled(StyledSnackbar)(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n  animation: ", " 0.2s ease-in-out;\n"])), fadeIn);
+/**
+ * Gympass `<Snackbar />` is the proper component to show alert messages.
+ *
+ * For web components, the `Snackbar` may have an icon, a custom action and a close button.
+ *
+ * For native, the `Snackbar` may have an icon and a custom action.
+ */
 
 var Snackbar = function Snackbar(_ref2) {
   var open = _ref2.open,

package/esm/Theme/theme/theme.js

@@ -17,6 +17,7 @@ import _componentThemes_Divider$Divider from "./../../Divider/Divider.theme.js";
 import _componentThemes_Dropdown$Dropdown from "./../../Dropdown/Dropdown.theme.js";
 import _componentThemes_Grid$Grid from "./../../Grid/Grid.theme.js";
 import _componentThemes_Header$Header from "./../../Header/Header.theme.js";
+import _componentThemes_Heading$Heading from "./../../Heading/Heading.theme.js";
 import _componentThemes_Icon$Icon from "./../../Icon/Icon.theme.js";
 import _componentThemes_Input$Input from "./../../Input/Input.theme.js";
 import _componentThemes_List$List from "./../../List/List.theme.js";
@@ -46,6 +47,7 @@ var componentThemes = {
   Dropdown$Dropdown: _componentThemes_Dropdown$Dropdown,
   Grid$Grid: _componentThemes_Grid$Grid,
   Header$Header: _componentThemes_Header$Header,
+  Heading$Heading: _componentThemes_Heading$Heading,
   Icon$Icon: _componentThemes_Icon$Icon,
   Input$Input: _componentThemes_Input$Input,
   List$List: _componentThemes_List$List,

package/esm/index.js

@@ -25,4 +25,5 @@ import Dialog from './Dialog';
 import Divider from './Divider';
 import Header from './Header';
 import Banner from './Banner';
-export { ThemeProvider, FontLoader, createTheme, yogaTheme, theme, Button, List, Checkbox, RadioGroup, Slider, Card, PlanCard, Stepper, Container, Row, Col, Hide, Text, Rating, EventCard, Tag, Input, Progress, Dropdown, TextArea, AutoComplete, Icon, Chips, Box, Snackbar, Avatar, BottomSheet, Dialog, Divider, Header, Banner };
+import Heading from './Heading';
+export { ThemeProvider, FontLoader, createTheme, yogaTheme, theme, Button, List, Checkbox, RadioGroup, Slider, Card, PlanCard, Stepper, Container, Row, Col, Hide, Text, Rating, EventCard, Tag, Input, Progress, Dropdown, TextArea, AutoComplete, Icon, Chips, Box, Snackbar, Avatar, BottomSheet, Dialog, Divider, Header, Banner, Heading };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gympass/yoga",
-  "version": "7.32.1",
+  "version": "7.34.0",
   "description": "Gympass component library",
   "main": "./cjs",
   "sideEffects": false,
@@ -29,7 +29,7 @@
     "@gympass/yoga-helpers": "^1.0.1",
     "@gympass/yoga-icons": "^1.4.2",
     "@gympass/yoga-system": "^0.10.0",
-    "@gympass/yoga-tokens": "^3.1.1",
+    "@gympass/yoga-tokens": "^3.1.2",
     "@ptomasroos/react-native-multi-slider": "^1.0.0",
     "downshift": "^5.0.0",
     "lodash.get": "^4.4.2",
@@ -49,7 +49,7 @@
     "react": ">=16",
     "styled-components": "^4.4.0"
   },
-  "gitHead": "e64983be9b9e5c1989319ec426c68eaacb03c38a",
+  "gitHead": "4ae69799109ce02a4036fef8ca8a8974dfdad93b",
   "module": "./esm",
   "private": false,
   "react-native": "./cjs/index.native.js"