@gympass/yoga 7.65.0 → 7.66.1

package/cjs/Dialog/web/Dialog.js

@@ -17,7 +17,7 @@ var _hooks = require("../../hooks");
 
 var _ = require("../..");
 
-var _excluded = ["isOpen", "hideCloseButton", "children", "onClose"];
+var _excluded = ["isOpen", "hideCloseButton", "children", "onClose", "zIndex"];
 
 var _templateObject, _templateObject2;
 
@@ -41,15 +41,17 @@ var StyledDialog = (0, _styledComponents["default"])(_.Card)(_templateObject ||
 exports.StyledDialog = StyledDialog;
 
 var Overlay = _styledComponents["default"].div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n  ", "\n"])), function (_ref2) {
-  var dialog = _ref2.theme.yoga.components.dialog;
-  return "\n  display: flex;\n  z-index: 3;\n  justify-content: center;\n  align-items: center;\n\n  position: fixed;\n  top: " + dialog.position["default"] + ";\n  right: " + dialog.position["default"] + ";\n  left: " + dialog.position["default"] + ";\n  bottom: " + dialog.position["default"] + ";\n\n  background-color: rgba(35, 27, 34, 0.48);\n  ";
+  var zIndex = _ref2.zIndex,
+      dialog = _ref2.theme.yoga.components.dialog;
+  return "\n  display: flex;\n  z-index: " + zIndex + ";\n  justify-content: center;\n  align-items: center;\n\n  position: fixed;\n  top: " + dialog.position["default"] + ";\n  right: " + dialog.position["default"] + ";\n  left: " + dialog.position["default"] + ";\n  bottom: " + dialog.position["default"] + ";\n\n  background-color: rgba(35, 27, 34, 0.48);\n  ";
 });
 
-var Dialog = function Dialog(_ref3) {
+function Dialog(_ref3) {
   var isOpen = _ref3.isOpen,
       hideCloseButton = _ref3.hideCloseButton,
       children = _ref3.children,
       onClose = _ref3.onClose,
+      zIndex = _ref3.zIndex,
       props = _objectWithoutPropertiesLoose(_ref3, _excluded);
 
   var dialogRef = (0, _react.useRef)(null);
@@ -78,7 +80,8 @@ var Dialog = function Dialog(_ref3) {
   return isOpen ? /*#__PURE__*/(0, _reactDom.createPortal)( /*#__PURE__*/_react["default"].createElement(Overlay, {
     onClick: closeDialog,
     onClose: onClose,
-    ref: dialogRef
+    ref: dialogRef,
+    zIndex: zIndex
   }, /*#__PURE__*/_react["default"].createElement(StyledDialog, _extends({
     onClose: onClose
   }, props), isCloseButtonVisible && /*#__PURE__*/_react["default"].createElement(_.Box, {
@@ -90,7 +93,7 @@ var Dialog = function Dialog(_ref3) {
     inverted: true,
     onClick: onClose
   })), children)), dialogElement) : /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null);
-};
+}
 
 Dialog.propTypes = {
   /** Control the dialog visibility. */
@@ -101,12 +104,14 @@ Dialog.propTypes = {
 
   /** Function to close the dialog. */
   onClose: _propTypes.func,
+  zIndex: _propTypes.number,
   children: _propTypes.node.isRequired
 };
 Dialog.defaultProps = {
   isOpen: false,
   hideCloseButton: false,
-  onClose: undefined
+  onClose: undefined,
+  zIndex: 3
 };
 Dialog.displayName = 'Dialog';
 var _default = Dialog;

package/cjs/Drawer/web/Drawer.js

@@ -27,7 +27,11 @@ function Drawer(props) {
 }
 
 Drawer.propTypes = {
-  children: _propTypes.node.isRequired
+  children: _propTypes.node.isRequired,
+  zIndex: _propTypes.number
+};
+Drawer.defaultProps = {
+  zIndex: 3
 };
 var _default = Drawer;
 exports["default"] = _default;

package/cjs/Input/index.js

@@ -9,5 +9,6 @@ _web.Input.Password = _web.Password;
 _web.Input.Email = _web.Email;
 _web.Input.Number = _web.InputNumber;
 _web.Input.Tel = _web.Tel;
+_web.Input.Phone = _web.Phone;
 var _default = _web.Input;
 exports["default"] = _default;

package/cjs/Input/web/Input.js

@@ -23,7 +23,7 @@ var _Legend = _interopRequireDefault(require("./Legend"));
 
 var _Label = _interopRequireDefault(require("./Label"));
 
-var _excluded = ["cleanable", "disabled", "error", "full", "helper", "label", "maxLength", "readOnly", "style", "value", "onChange", "onClean", "hideMaxLength", "rightIcon"];
+var _excluded = ["cleanable", "children", "disabled", "error", "full", "helper", "label", "maxLength", "readOnly", "style", "value", "onChange", "onClean", "hideMaxLength", "rightIcon"];
 
 var _templateObject, _templateObject2, _templateObject3, _templateObject4;
 
@@ -57,6 +57,7 @@ var IconWrapper = _styledComponents["default"].div(_templateObject3 || (_templat
 
 var Input = /*#__PURE__*/_react["default"].forwardRef(function (_ref3, ref) {
   var cleanable = _ref3.cleanable,
+      children = _ref3.children,
       disabled = _ref3.disabled,
       error = _ref3.error,
       full = _ref3.full,
@@ -91,7 +92,7 @@ var Input = /*#__PURE__*/_react["default"].forwardRef(function (_ref3, ref) {
     label: label,
     style: style,
     value: value
-  }, /*#__PURE__*/_react["default"].createElement(_Field["default"], _extends({}, props, {
+  }, !children ? /*#__PURE__*/_react["default"].createElement(_Field["default"], _extends({}, props, {
     label: label,
     cleanable: cleanable,
     disabled: disabled,
@@ -102,7 +103,7 @@ var Input = /*#__PURE__*/_react["default"].forwardRef(function (_ref3, ref) {
     ref: inputRef,
     value: value,
     onChange: onChange
-  })), /*#__PURE__*/_react["default"].createElement(_Label["default"], {
+  })) : children, /*#__PURE__*/_react["default"].createElement(_Label["default"], {
     error: error,
     disabled: disabled
   }, label), label && /*#__PURE__*/_react["default"].createElement(_Legend["default"], null, label), cleanable && !readOnly && value && /*#__PURE__*/_react["default"].createElement(IconWrapper, {
@@ -135,6 +136,9 @@ var Input = /*#__PURE__*/_react["default"].forwardRef(function (_ref3, ref) {
 Input.propTypes = {
   className: _propTypes.string,
 
+  /** a children node to override default input component */
+  children: (0, _propTypes.oneOfType)([(0, _propTypes.arrayOf)(_propTypes.node), _propTypes.node]),
+
   /** display a close icon to clean the field */
   cleanable: _propTypes.bool,
   disabled: _propTypes.bool,
@@ -162,6 +166,7 @@ Input.propTypes = {
 };
 Input.defaultProps = {
   className: undefined,
+  children: undefined,
   cleanable: true,
   disabled: false,
   error: undefined,

package/cjs/Input/web/Phone.js

@@ -0,0 +1,144 @@
+"use strict";
+
+exports.__esModule = true;
+exports["default"] = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _reactPhoneInput = _interopRequireDefault(require("react-phone-input-2"));
+
+var _propTypes = _interopRequireWildcard(require("prop-types"));
+
+var S = _interopRequireWildcard(require("./Phone.style"));
+
+var _Input = _interopRequireDefault(require("./Input"));
+
+var _hooks = require("../../hooks");
+
+var _excluded = ["defaultCountry", "disabled", "readOnly", "error", "full", "helper", "label", "placeholder", "value", "onChange"];
+
+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 ? Object.assign.bind() : 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 phoneBaseSettings = {
+  onlyCountries: ['ar', 'br', 'cl', 'de', 'es', 'gb', 'ie', 'it', 'mx', 'pt', 'us']
+};
+
+var Phone = /*#__PURE__*/_react["default"].forwardRef(function (_ref, forwardedRef) {
+  var defaultCountry = _ref.defaultCountry,
+      disabled = _ref.disabled,
+      readOnly = _ref.readOnly,
+      error = _ref.error,
+      full = _ref.full,
+      helper = _ref.helper,
+      label = _ref.label,
+      placeholder = _ref.placeholder,
+      value = _ref.value,
+      _onChange = _ref.onChange,
+      rest = _objectWithoutPropertiesLoose(_ref, _excluded);
+
+  var inputRef = (0, _hooks.useCombinedRefs)(forwardedRef);
+  var currentCountry = (0, _react.useRef)(defaultCountry);
+  var onChangeCountry = (0, _react.useCallback)(function (countryCode) {
+    if (currentCountry.current !== countryCode) {
+      inputRef.current.focus();
+      currentCountry.current = countryCode;
+    }
+  }, []);
+  return /*#__PURE__*/_react["default"].createElement(_Input["default"], _extends({}, _extends({
+    disabled: disabled,
+    readOnly: readOnly,
+    error: error,
+    full: full,
+    helper: helper,
+    value: value
+  }, rest), {
+    ref: inputRef,
+    label: "",
+    onClean: function onClean(phoneNumber) {
+      return _onChange(phoneNumber);
+    }
+  }), /*#__PURE__*/_react["default"].createElement(S.Container, {
+    error: error,
+    disabled: disabled,
+    full: full
+  }, /*#__PURE__*/_react["default"].createElement(_reactPhoneInput["default"], _extends({}, phoneBaseSettings, {
+    ref: function ref(phoneRef) {
+      inputRef.current = phoneRef == null ? void 0 : phoneRef.numberInputRef;
+    },
+    inputProps: {
+      readOnly: readOnly
+    },
+    disabled: disabled,
+    disableDropdown: readOnly,
+    country: defaultCountry,
+    specialLabel: label,
+    placeholder: placeholder,
+    onChange: function onChange(phoneNumber, options) {
+      _onChange(phoneNumber, options);
+
+      onChangeCountry(options.countryCode);
+    },
+    value: value
+  }))));
+});
+
+Phone.propTypes = {
+  className: _propTypes.string,
+
+  /** display a close icon to clean the field */
+  cleanable: _propTypes.bool,
+
+  /** default country to be selected on the dropdown */
+  defaultCountry: _propTypes["default"].string,
+
+  /** disable the whole input */
+  disabled: _propTypes.bool,
+
+  /** display a error message and error style */
+  error: _propTypes.string,
+
+  /** should occupy the whole container width */
+  full: _propTypes.bool,
+
+  /** a helper text to be displayed below field */
+  helper: _propTypes.string,
+
+  /** label for the input */
+  label: _propTypes.string,
+
+  /** make the input read only */
+  readOnly: _propTypes.bool,
+
+  /** value of the input */
+  value: _propTypes.string,
+
+  /** callback invoked when value changes, either by typing of selecting a country */
+  onChange: _propTypes.func,
+
+  /** placeholder to show when the input is cleared */
+  placeholder: _propTypes.string
+};
+Phone.defaultProps = {
+  className: undefined,
+  cleanable: true,
+  defaultCountry: 'br',
+  disabled: false,
+  error: undefined,
+  full: false,
+  helper: undefined,
+  label: '',
+  readOnly: false,
+  value: '',
+  onChange: function onChange() {},
+  placeholder: '+55 (11) 999999999'
+};
+var _default = Phone;
+exports["default"] = _default;

package/cjs/Input/web/Phone.style.js

@@ -0,0 +1,41 @@
+"use strict";
+
+exports.__esModule = true;
+exports.Container = void 0;
+
+require("react-phone-input-2/lib/material.css");
+
+var _styledComponents = _interopRequireWildcard(require("styled-components"));
+
+var _dataImages = require("./data-images");
+
+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); }
+
+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 _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.slice(0); } strings.raw = raw; return strings; }
+
+var flagsPositioning = (0, _styledComponents.css)(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n  .ar {\n    background-position: 0px 0px;\n  }\n\n  .br {\n    background-position: -20px 0px;\n  }\n\n  .cl {\n    background-position: 0px -20px;\n  }\n\n  .de {\n    background-position: -20px -20px;\n  }\n\n  .es {\n    background-position: -20px -40px;\n  }\n\n  .gb {\n    background-position: -60px 0px;\n  }\n\n  .ie {\n    background-position: -40px 0px;\n  }\n\n  .it {\n    background-position: -40px -20px;\n  }\n\n  .mx {\n    background-position: 0px -40px;\n  }\n\n  .pt {\n    background-position: -40px -40px;\n  }\n\n  .us {\n    background-position: -60px -20px;\n  }\n"])));
+var flagReset = (0, _styledComponents.css)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n  position: relative;\n  top: initial;\n  left: initial;\n  margin-top: 0;\n"])));
+var hiddenScrollBar = (0, _styledComponents.css)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n  ::-webkit-scrollbar {\n    display: none;\n  }\n\n  -ms-overflow-style: none;\n  scrollbar-width: none;\n"])));
+
+var labelStateColors = function labelStateColors(_ref) {
+  var disabled = _ref.disabled,
+      error = _ref.error,
+      colors = _ref.theme.yoga.colors;
+  return (0, _styledComponents.css)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n  ", "\n  ", "\n"])), disabled ? "color: " + colors.text.disabled + ";" : '', error ? "color: " + colors.feedback.attention[1] + ";" : '');
+};
+
+var Container = _styledComponents["default"].div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n  --fieldset-left-offset: 12px;\n  --dropdown-zIndex: 1;\n\n  height: inherit;\n\n  ", "\n"])), function (_ref2) {
+  var disabled = _ref2.disabled,
+      _ref2$theme$yoga = _ref2.theme.yoga,
+      spacing = _ref2$theme$yoga.spacing,
+      colors = _ref2$theme$yoga.colors,
+      baseFont = _ref2$theme$yoga.baseFont,
+      input = _ref2$theme$yoga.components.input;
+  return (0, _styledComponents.css)(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n    .react-tel-input {\n      width: inherit;\n      height: inherit;\n      font-family: ", ", sans-serif;\n      font-size: ", "px;\n      font-weight: ", ";\n      display: grid;\n      grid-template-areas: 'dropdown input';\n      grid-template-columns: min-content 1fr;\n\n      .special-label {\n        z-index: unset;\n        left: unset;\n        font-size: ", "px;\n        color: ", ";\n        letter-spacing: normal;\n        ", ";\n      }\n\n      &:focus-within {\n        .special-label {\n          font-weight: ", ";\n          color: ", ";\n          ", ";\n        }\n      }\n\n      .form-control {\n        background: transparent;\n        border: unset;\n        padding: unset;\n        box-sizing: border-box;\n        width: 100%;\n        grid-area: input;\n        color: ", ";\n        font-size: ", "px;\n        padding-left: ", "px;\n\n        &:disabled {\n          cursor: not-allowed;\n        }\n\n        &::placeholder {\n          color: ", ";\n        }\n\n        &:hover,\n        &:focus {\n          box-shadow: none;\n        }\n\n        &.open {\n          z-index: calc(var(--dropdown-zIndex) + 1);\n        }\n      }\n\n      .flag-dropdown {\n        border: none;\n        width: inherit;\n        position: unset;\n        top: unset;\n        bottom: unset;\n        padding: unset;\n        grid-area: dropdown;\n\n        &.open {\n          width: 100%;\n          z-index: var(--dropdown-zIndex);\n        }\n\n        &.open,\n        &.open .selected-flag,\n        &:hover,\n        &:focus {\n          background: transparent;\n        }\n      }\n\n      .selected-flag {\n        border: none;\n        padding: 0;\n        padding-left: ", "px;\n        display: flex;\n        align-items: center;\n        opacity: ", ";\n\n        &::after {\n          content: '';\n          position: absolute;\n          background-color: ", ";\n          height: 28px;\n          right: -", "px;\n          width: 1px;\n          top: 50%;\n          transform: translate(0, -50%);\n        }\n\n        .flag {\n          ", ";\n          display: flex;\n          align-items: center;\n\n          .arrow {\n            background-color: ", ";\n            mask-image: url('data:image/svg+xml;utf8,", "');\n            border: none;\n            top: unset;\n            margin-top: unset;\n            width: 16px;\n            height: 16px;\n            transition: 0.6s, color 0.1s;\n\n            &.up {\n              border: none;\n              transform: rotateX(180deg);\n            }\n\n            &:hover,\n            &:focus {\n              border: none;\n              background-color: ", ";\n            }\n          }\n        }\n      }\n\n      .flag {\n        width: 20px;\n        height: 20px;\n        background-image: url('data:image/png;base64,", "');\n      }\n\n      ", ";\n\n      .country-list {\n        box-shadow: none;\n        border-radius: unset;\n        max-height: 18rem;\n        margin: -", "px 0 0 calc(-1 * var(--fieldset-left-offset) -\n              1px);\n        width: calc(100% + var(--fieldset-left-offset) + 2px);\n        z-index: var(--dropdown-zIndex);\n        border: 1px solid ", ";\n        border-top: 0;\n        border-bottom-left-radius: ", "px;\n        border-bottom-right-radius: ", "px;\n\n        ", ";\n\n        .country {\n          display: flex;\n          align-items: center;\n          outline: 0;\n          padding: ", "px ", "px ", "px\n            ", "px;\n          color: ", ";\n\n          .flag {\n            ", ";\n            margin-right: ", "px;\n          }\n\n          .dial-code {\n            color: inherit;\n            display: flex;\n            flex: 1;\n\n            ::before {\n              content: '(';\n            }\n\n            ::after {\n              content: ')';\n            }\n          }\n\n          &.highlight {\n            background-color: transparent;\n            color: ", ";\n\n            &::after {\n              content: '';\n              background-color: ", ";\n              mask-image: url('data:image/svg+xml;utf8,", "');\n              width: 16px;\n              height: 16px;\n            }\n          }\n\n          &.focus,\n          &:hover {\n            background-color: ", ";\n          }\n        }\n      }\n    }\n  "])), baseFont.family, input.font.size, input.font.weight, input.label.font.size.typed, input.label.color["default"], labelStateColors, input.label.font.weight.typed, input.label.color.focus, labelStateColors, disabled ? colors.text.disabled : input.font.color.focus, input.font.size, spacing.xsmall, input.font.color["default"], spacing.xxxsmall, disabled ? 0.5 : 1, input.border.color["default"], spacing.xxxsmall, flagReset, input.label.color["default"], _dataImages.chevronSvg, input.label.color.focus, _dataImages.flagsSprite, flagsPositioning, spacing.xxsmall, input.border.color.typed, spacing.xxsmall, spacing.xxsmall, hiddenScrollBar, spacing.xsmall, spacing.small, spacing.xsmall, spacing.small, input.font.color.focus, flagReset, spacing.small, colors.primary, colors.primary, _dataImages.checkSvg, colors.clear);
+});
+
+exports.Container = Container;

package/cjs/Input/web/data-images.js

@@ -0,0 +1,10 @@
+"use strict";
+
+exports.__esModule = true;
+exports.flagsSprite = exports.chevronSvg = exports.checkSvg = void 0;
+var chevronSvg = encodeURI("\n  <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 12 12\">\n    <path fill-rule=\"evenodd\" d=\"M3.146 4.146a.5.5 0 0 1 .708 0L6 6.293l2.146-2.147a.5.5 0 0 1 .708.708l-2.5 2.5a.5.5 0 0 1-.708 0l-2.5-2.5a.5.5 0 0 1 0-.708Z\" clip-rule=\"evenodd\"/>\n  </svg>\n");
+exports.chevronSvg = chevronSvg;
+var checkSvg = encodeURI("\n  <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 12 12\">\n    <path fill-rule=\"evenodd\" d=\"M9.854 3.146a.5.5 0 0 1 0 .708l-4.5 4.5a.5.5 0 0 1-.708 0l-2.5-2.5a.5.5 0 1 1 .708-.708L5 7.293l4.146-4.147a.5.5 0 0 1 .708 0Z\" clip-rule=\"evenodd\"/>\n  </svg>\n");
+exports.checkSvg = checkSvg;
+var flagsSprite = encodeURI('iVBORw0KGgoAAAANSUhEUgAAAFAAAAA8CAYAAADxJz2MAAAAAXNSR0IArs4c6QAAEBZJREFUeF7NXHlwXMWZ//XoGB86ZnwIc1hostYBjrM+CCZYWTvYZCvYRIdZAnLIaljA2PEhkQXbRcUa7W7WmCRYSmxnnThItVhaUottTZBIeTEpREQKFz6mloA1EqyeBXb5nifJthgdr7e+N/NGb2bem3lvZli2/8Kj7l9//Xtf99f9/bph0CjLXNw2OHWwmnHLUg4+n4EVBKt5AAgc3H3yuZxmrbZav9U0LbONZ1iqYbEsZWDzOecyHgPzcMYFcMn9yzV/NIX37flPVN/rWLUUwHwAin0CAE96f4c762trDOOh/LANlozqfU8VLy2/1jvf91CtjDf9yH7PIT5LWPvr024c+q4mHosc8KKdg+WwsCZw2GITxAQOqT4ekRtal5czzpqAeHhcAHh9PCIVvG8VPmy7r+hhTRMn/aUB1r80CuC8nq0TYxO5+vVyBO3b+w9FeIh/hqur1sm409p/hdfYbVj/2x763AIwXh9JZBiBC386tItx1Bj1LKrHGVwnn82u12qzuXXFLskkHrPA9YtHj8bF+1bhw4hDYMAkxlxs7VVNvIGBgV3r9ntrWt+9KFeNTSBQtSQPO0686rq99aUQXojAhT8dqmMcLjPkKXUZYw3Hn82qVbfd9B8r6riUGJ6FoaGx6mhMPMMEBlhsYE9fDcM7U/VMXVr+za6srU/KHkYkxiIwSB7S8m9B9rYnG3Jzc2U8mcCFLw5WM8jTLPHCecWJLTltBLCx5b5qwKKJNyUdeGIOMDwOHOoHrvi1u+TMUrG76r908cwRSCO1VLC1V2Q8VP6+uqp0VtOO479DWv4sKCSWltg0p3BXt0ieJ5OXtfWJAOF/ulCBtgfbZAJ/8sZg3/WRUKBIiMSMNC7WlI477Ha7uKlleR+fCDwhvMJsYI0DmGYN/HTVD7QIQO+gZpdi2siYo8H5tiaeeQIhIpM7mFMUUdnRB/CCqtI8qEnsv/w5ZnV/FLYGni+5E7nbXwwnLzDlRUijDubz+aoZS9L7guPnnNduf2O1qOV937kV+M4tgODLgfvDv5JblM39BAX2QfzhLPCHcxokctSCSZp4pgkkeInXsqP/HoYXSeJI18kwAqWBIYx90DvhecH1MmhtLRHYxhgri+V21hsd4OAYmbIqpndyzt3bOx6ihTuEN90a8Lo52UBj1wLUtNPOY6I0PNiJzUtO4ewNYP/HUVPaDc7D8JSWCRHIuXtfwTFIUvh4S0tykPfeMWSWLpTJUkfh9HmFsORmg7yzyxs+VSzgbiaKYp9qHxU2OMv4JVhvtCNzuEP+fWTSMoxMXoXxDGXbFcWnsL3jIZEH9magKUvr3eR0QErLw/NdW+UGAzfG0HHqqmwUlb4tL8ueSFOaPPHYZQWXCwwshKfuLSECAeGyo03ko+OyfVpl9INeDG17Sf5T9o5aZMwr0nUa/rlfIAK5Xo300Q8xZeBFMOm6XIVIGM75IcYy5uqC/pg8kNbpfGDZTRPVRiavhNf/KPov+zEvfypyp6Sjq3sA61/uxTPfOCJ7oVJ0p7Sq1wQJhPfpPF3bE/lDfAIH94CNB/ZJnE3FDdtzhgik9Y7WPaVETt/SklzseOQryJ9hxcend+O+2V2hum9fCEToWOX/E4G6UzhtTJCncMbnb8tjIS/yT1kFKW2m3tg829/4O5tyVFs8IxA4KOr6/NMwre4HUe12PPoVbFn4L/JHGh4LrIO9Q0o1LjBmgYKnbpwggZ6LM1ptbJJVdw0a/aAHQ9t2BafwM8iYV6j7HVlGhsdwECEU/5SVMb1CK4gQeU/OAW6dAjS8uwC1r4cHkV0PdqJmySl8PAgcEAJbG1X5vwkixTnInzEJSsRVBxEi0N91EhcXL9YOIj6fr4YxFqA8ycI5d27vWG0Ds0ThKVPa1DYGklM+k2vgJeSBnDvZmwfojB+yj04YdAK59sJvkD6vGJbcrLAoTJH52gv7Md5/DtsWPSKfWCaK5CQPtDX8Ka1vVIp32I/N7tRMCM8/kOOQMy+Z6bQsRCUjNDfSfeopq+6DC79c85YuXgIECuxpnyOYeZHtU5M33n8eA//8LGadjt5Ik3dGk8gEHFrpkE8icgaGscPJOCAf586T2wIprg2vLC9nFm08mtKrZwOT04DffAJ53dMuklPJzGjhmSaQvE/JzJS/Xl71zZsOK55H5G1b9D3oHuW8IvY+Tl6q9sTzTsrMhJIJi14cagCwORESGUf98S3ZYYmIDa8sb2AWlhAel1C/+7GjMfFMEchZPVt3NQzP5/M1XN+5f7NCXtxkQmleiMTR/nP1jtaXZLywdNZdO4dcnKHOFIkSGk9szdZMgW14ZYWLWczhcbDG3WvejItnnEDWyJ6+qonXV/WM6/lFj9QZTmeV5mGPs7DRbreH8KISqoHMjKWODttxiBTBuVPJwOjVpcwMA6vTSi5EtBE5487dVW8FMiY6RcFbVvi9gjj5QBGMO9laMSYeZWaANHm8cfKBMh4OPhiGF0WgYneAyLSybCufP+QPkMnB6Gjl4XysUxqWmj0uu2jUW4MprjIGFChHPcaYwDn3gEudaaNSM2VejOK9e7qjeu7NS+jMHZXSz+xu6px8ur5ZzrwYLZW/r9731B1llexcwZW/fUo+6tlfaxDasuZ41v7a2wlptBltFVF42gQGNQIwthScDOQF4sulhClrDrTfs9vtxjWHQESuBhCpYcgaCwA3AMN4FOljaSLDh99y3+xcbRhP0UTycqxLLw6OqMcb0IBijDeaQJVGoP54QQLVPxFwvQEiywEY0ERkIilVHnPgRjQR2tNde2G/rNncgd6YeD6fr3zB1hNNEodt7+OF6Dh1Bb968xyMjjecwMp22mBqLrgagDKZjDFXbm6upuYQ3LCa0lgAWQZIShMJEhiwD9xVjB5NvH/93Ue7bp9prVmz+7Rct/25eWh994K8We49/jPNyS/1nwvDmyCwsoMWUjk008ZRSTUpKHoEBkkMaQSqXimaJ6SxAKAtVcKaiJpAsscCNBTBG4aH4HjVY6UMEaXaqHQf+pHu6qnGCxAoR6IJDYN26P1X/HK6yQiBcoDhvMJutysRita75DQWoAJAQppIJIFBT6woRo+MV7L+reru88NNNM6VC6Zj26t0MAFoCise+D8XW2KGn/Q5BRX5zTsCmoiiEdDXUEDpS3R5B2R3Jm+M5YHBnkTOuayJUI5UL0kb06rwPxKOg7QHLY0l1j5Qi0DCscLvcEAQF/2os+9E31ABkUfpNFrzqFBmiJyG1kGj42WR3rfu/ltkICqK3Ef/bQCQvLC22f5V8RP4k/U+uf9cpNUOtsw1rYnoEEiQteUb94rdZ4dD9lFy94P+QMJYPYWNjpehor0NDCENgzywaslNyJ9pxfrf9oamsUFA9wX7PWRLTI3FhBe69xy4zbQmEoNANzvzDupfO1NGM4scJX+6VZ7CuVPS5KxMa9cF2SPPTPpjfDPHJTfD6vZTgb1eoFCmWFn71F/HCIG0Z7pgW6ypYcS3RrOGsLdltmlNJAaBgvtgG/YcOVtAyxLNNvK6F9yB9Df9myQHmsKxgojKUoGhsl1XE1EPySCBOG9bnCBX2s32tMzW/EMCa6CMU1L5c0P2GSQQrBvFhgg01OsXUCnVBM4Sj6XUSiIwFRFTMYqOPnRsi5eIMDoIz97W/JDGom6UoAd6ZonHUmofEUh7o5Qt+sFBpgwv1UEk599cYJKUEvu4xeJm3bijBpBSo4lActofy7al2dJTgufvHXHu/P4005qIXhDhkJwM6bZUjpf1ocDmh1VTwzA6z4L1hBJ4HbxvmQ2j2pqIOTwusKLENBEdAmX7Uj1e+STyEYrKLUhSE4HkVDIf3Ls8aY0F5C1FgWu/ZjURLQLJ+xT7zu1qKk8vvD0pDWj8ks9JKbNQMqEbxQlrIhys/g50hyUOeM/yBiAxTQQc9aw4cU0kkkAt+0gTYSwx+4JpvGhN5DRKXAzcnCYCNJbAq5my4t4VLpjVWMAaWVFymkgEgbr2+Xw+l/TpeVPjtcyeFVsTOY2S6iCJ8bYiIgN3KhkOvfWN99BtVVYHjQuXEW1kjYUVJ6+JBAk0ZF+y49XVRAjYAlbGIYVpDgwWD4fUaYW/mTIbRgODTCSzlIHLe8TA0ZEzARbuAaROpEvNzJEaTeTavv/sHN3yE1P2KeMFpJBmQ0fTeOPVJJBuK5CGwUgTCRdt4moEWoQGI181A5YGBaXgOxEijwkSJHe81LsalzSRe14drF5w5HpK8Iw6gVa9KAJJc7h79rebvjtvbcx3IoNbfi5c3/dqXM3Bi6JyHrjAHufdCT3gia9hKJrI1w8O2u4+NJHw1RicIbxkyKO2YQQq7zoW3LYMlX+9ISb2wPp/wnBrR0zNoQfFuyQdjUUPPJaGoX538vWDg4hDoNxFLLxkyQsjUP2uwwyBBKKlOXhRRGJ6QpqIFl7kuxOjBOrZlwryQgRGvuswS2DwS4c0h2BkSyorzcBDeFrvTswQGGlfqsgLERipOSRCoFpzSFGGJ6RhaGkiZglU25dSArW+boIEkl21t/xiuujvHUvK+5QBWmys1lUyNUoToXuGSz/zY9qhIVw/OmyGj9oSeOnElbLCNh5Y3qZ+10HIkQRmel8Gz5qN0VvvD3WsBJEIS9zFXm0NIyGLOdyb3p94J0JvTujZBF0XVsro2TF8+tgljH6me9FQ3bW7BF66KZGywja1rDilXPZRUInAh2++i56Myj+lX3wPPDMH47Y75X/7v1qDK64jchSOKEJx72xRrbEkZykXNr8/8U6EHuzM+8SPK7snti+5FVORfms6Pn1MffVWt1c5I5OcTeGt2caWFVEpfcUDfX+uQUE/3fuZKEJ+Gez3NkDHA1Hco61hJGr0pvcnWu5cCIy4b+DijhFYV/4N/B3vwP4DC6b9fRZ67zprqIsSeHVPX4YAIirFJPCND5tg7W3CspELcrNjGdMhFj+JB+50fqkEXtqbiZn/3YaLt6/48gnc1Hp/X+Q7DMUDxeFL2PPOP+LzsYDwPCljKn74zZ/BNnmmHoGe4p58m4HLmUY/tmfzcRbSRCpnA0vGxyCUnQdYFsCvw+G+CdeP+XF+61UjmJ4SeBcYqWi0TtwgQiT+ua9dxrvXsUomj8qXEUToYvqWuUD25THcODaCqYszQevPp9+/BAomBkrqg8jGA/fVRL7DSHQbQ1nfvB/PsEnieEo0EWthuvP5aZOiNJGv2YC7z/gx/dAQrpnYxqiz0gbINlSFab3rSJDAL0Rz0Ht3ksBGOuURmBiWI1Kk5pAIgeqvm2qNRUsTMUvgF+F9IQKDJIbedZglUEtzSLXGEvnuxAyBWvYZmp8GKoXtiZR3HSYJ1NUcUq2xqN+dmCBQ1z4D/MStErWppLPxNxyr6h648/GYmshgzQ5xuPlwXE0kWc0hcgTKO5G7Dg4VxMkHGtJE4jIUp4Lurjz4P6OgKxATGsbEM4dOuk0fvI1qyIZENQc98I575lfPec9fZlbDMGSsiUr/C+U5BKMm6UjbAAAAAElFTkSuQmCC');
+exports.flagsSprite = flagsSprite;

package/cjs/Input/web/index.js

@@ -10,6 +10,10 @@ var _Password = _interopRequireDefault(require("./Password"));
 
 exports.Password = _Password["default"];
 
+var _Phone = _interopRequireDefault(require("./Phone"));
+
+exports.Phone = _Phone["default"];
+
 var _Number = _interopRequireDefault(require("./Number"));
 
 exports.InputNumber = _Number["default"];

package/cjs/hooks/index.js

@@ -16,4 +16,12 @@ Object.keys(_useKeyPress).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _useKeyPress[key]) return;
   exports[key] = _useKeyPress[key];
+});
+
+var _useCombinedRefs = require("./useCombinedRefs");
+
+Object.keys(_useCombinedRefs).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _useCombinedRefs[key]) return;
+  exports[key] = _useCombinedRefs[key];
 });

package/cjs/hooks/useCombinedRefs.js

@@ -0,0 +1,32 @@
+"use strict";
+
+exports.__esModule = true;
+exports.useCombinedRefs = void 0;
+
+var _react = require("react");
+
+/**
+ *  A hook for combining multiple refs into one ref.
+ */
+var useCombinedRefs = function useCombinedRefs() {
+  for (var _len = arguments.length, refs = new Array(_len), _key = 0; _key < _len; _key++) {
+    refs[_key] = arguments[_key];
+  }
+
+  var targetRef = (0, _react.useRef)(null);
+  (0, _react.useEffect)(function () {
+    for (var i = 0; i < refs.length; i++) {
+      var ref = refs[i];
+      if (!ref) return;
+
+      if (typeof ref === 'function') {
+        ref(targetRef.current);
+      } else {
+        ref.current = targetRef.current;
+      }
+    }
+  }, [refs]);
+  return targetRef;
+};
+
+exports.useCombinedRefs = useCombinedRefs;

package/esm/Accordion/web/Accordion.test.js

@@ -0,0 +1,19 @@
+import React from 'react';
+import { render, cleanup } from '@testing-library/react';
+import { Text, Button } from '@gympass/yoga';
+import { ThemeProvider } from '../..';
+import Accordion from '.';
+describe('<Accordion />', function () {
+  afterEach(cleanup);
+  it('should match snapshot', function () {
+    var _render = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Accordion, {
+      title: "Title"
+    }, /*#__PURE__*/React.createElement(Accordion.Content, null, /*#__PURE__*/React.createElement(Text, null, "Content"), /*#__PURE__*/React.createElement(Button, {
+      small: true,
+      inverted: true
+    }, "Small button"))))),
+        baseElement = _render.baseElement;
+
+    expect(baseElement).toMatchSnapshot();
+  });
+});

package/esm/ActionRequirement/index.native.js

@@ -0,0 +1,2 @@
+import ActionRequirement from './native';
+export default ActionRequirement;

package/esm/ActionRequirement/native/ActionRequirement.js

@@ -0,0 +1,48 @@
+var _templateObject;
+
+function _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.slice(0); } strings.raw = raw; return strings; }
+
+import React from 'react';
+import { arrayOf, node, oneOfType, string } from 'prop-types';
+import styled from 'styled-components/native';
+import { View } from 'react-native';
+import Box from '../../Box';
+import { Title } from './ActionRequirementStyles';
+import Text from '../../Text';
+var StyledActionRequirement = styled.View(_templateObject || (_templateObject = _taggedTemplateLiteralLoose([""])));
+
+function ActionRequirement(props) {
+  var title = props.title,
+      description = props.description,
+      children = props.children,
+      checkable = props.checkable,
+      illustration = props.illustration,
+      list = props.list;
+  return /*#__PURE__*/React.createElement(StyledActionRequirement, props, illustration && /*#__PURE__*/React.createElement(Box, null, illustration), /*#__PURE__*/React.createElement(Title, null, title), /*#__PURE__*/React.createElement(Text, {
+    mt: "small",
+    color: "deep"
+  }, description), list && /*#__PURE__*/React.createElement(Text, {
+    mt: "small",
+    color: "deep"
+  }, /*#__PURE__*/React.createElement(Box, {
+    mt: "xxxlarge"
+  }, list)), checkable && /*#__PURE__*/React.createElement(Box, {
+    mt: "xxxlarge"
+  }, checkable), /*#__PURE__*/React.createElement(View, null, children));
+}
+
+ActionRequirement.propTypes = {
+  title: string.isRequired,
+  children: oneOfType([arrayOf(node), node]),
+  description: string.isRequired,
+  checkable: oneOfType([arrayOf(node), node]),
+  illustration: oneOfType([arrayOf(node), node]),
+  list: oneOfType([arrayOf(node), node])
+};
+ActionRequirement.defaultProps = {
+  children: undefined,
+  checkable: undefined,
+  illustration: undefined,
+  list: undefined
+};
+export default ActionRequirement;

package/esm/ActionRequirement/native/ActionRequirement.test.js

@@ -0,0 +1,45 @@
+import React from 'react';
+import { render } from '@testing-library/react-native';
+import { Box, Checkbox, Text } from '@gympass/yoga';
+import { Img2d01 } from '@gympass/yoga-illustrations';
+import { Dumbbell, User, Star } from '@gympass/yoga-icons';
+import { ThemeProvider } from '../..';
+import ActionRequirement from './ActionRequirement';
+
+function handleGetCheckableContent() {
+  return /*#__PURE__*/React.createElement(Box, {
+    display: "flex",
+    flexDirection: "row",
+    alignItems: "center"
+  }, /*#__PURE__*/React.createElement(Checkbox, null), /*#__PURE__*/React.createElement(Text, null, "I have read and agree to the Terms of Use and Privacy Policy."));
+}
+
+function handleGetIllustration() {
+  return /*#__PURE__*/React.createElement(Img2d01, {
+    width: 375,
+    height: 375
+  });
+}
+
+function handleGetList() {
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Text, null, /*#__PURE__*/React.createElement(Dumbbell, null), " 1x/day standard access"), /*#__PURE__*/React.createElement(Text, {
+    mt: "small"
+  }, /*#__PURE__*/React.createElement(User, null), " 4x/month 1-on-1 sessions"), /*#__PURE__*/React.createElement(Text, {
+    mt: "small"
+  }, /*#__PURE__*/React.createElement(Star, null), " 2x/month premium classes"));
+}
+
+describe('<ActionRequirement />', function () {
+  it('should match snapshot', function () {
+    var _render = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(ActionRequirement, {
+      title: "Welcome to the world of feeling good!",
+      description: "Lets make it a good day!",
+      illustration: handleGetIllustration(),
+      checkable: handleGetCheckableContent(),
+      list: handleGetList()
+    }))),
+        toJSON = _render.toJSON;
+
+    expect(toJSON()).toMatchSnapshot();
+  });
+});

package/esm/ActionRequirement/native/ActionRequirementStyles.js

@@ -0,0 +1,25 @@
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8;
+
+function _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.slice(0); } strings.raw = raw; return strings; }
+
+import styled, { css } from 'styled-components';
+import Text from '../../Text/index.native';
+import Box from '../../Box/index.native';
+import Button from '../../Button/index.native';
+export var Title = styled(Text.H4)(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n  ", "\n"])), function (_ref) {
+  var fontSizes = _ref.theme.yoga.fontSizes;
+  return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n    @media (min-width: 769px) {\n      max-width: 700px;\n      font-size: ", "px;\n      line-height: ", "px;\n    }\n  "])), fontSizes.huge, fontSizes.huge);
+});
+export var Actions = styled(Box)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n  ", "\n"])), function (_ref2) {
+  var spacing = _ref2.theme.yoga.spacing;
+  return css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n    display: flex;\n    flex-direction: column;\n\n    @media (min-width: 769px) {\n      flex-direction: row;\n      margin-top: ", "px;\n    }\n  "])), spacing.xlarge);
+});
+var buttonsStyles = css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n  ", "\n"])), function (_ref3) {
+  var spacing = _ref3.theme.yoga.spacing;
+  return css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n    width: 100%;\n\n    :last-child(:not(:first-child)) {\n      margin-top: ", "px;\n    }\n\n    @media (min-width: 769px) {\n      width: auto;\n\n      :last-child(:not(:first-child)) {\n        margin-top: 0;\n        margin-left: ", "px;\n      }\n    }\n  "])), spacing.small, spacing.large);
+});
+export var PrimaryButton = styled(Button)(_templateObject7 || (_templateObject7 = _taggedTemplateLiteralLoose(["\n  ", "\n"])), buttonsStyles);
+export var SecondaryButton = styled(Button.Text)(_templateObject8 || (_templateObject8 = _taggedTemplateLiteralLoose(["\n  ", "\n"])), buttonsStyles);
+Title.displayName = 'ActionRequirement.Title';
+PrimaryButton.displayName = 'ActionRequirement.PrimaryButton';
+SecondaryButton.displayName = 'ActionRequirement.SecondaryButton';

package/esm/ActionRequirement/native/index.js

@@ -0,0 +1,6 @@
+import ActionRequirement from './ActionRequirement';
+import { Title, PrimaryButton, SecondaryButton } from './ActionRequirementStyles';
+ActionRequirement.Title = Title;
+ActionRequirement.PrimaryButton = PrimaryButton;
+ActionRequirement.SecondaryButton = SecondaryButton;
+export default ActionRequirement;

package/esm/ActionRequirement/web/ActionRequirement.test.js

@@ -0,0 +1,36 @@
+import React from 'react';
+import { render } from '@testing-library/react';
+import { Text } from '@gympass/yoga';
+import { Dumbbell, User, Star } from '@gympass/yoga-icons';
+import ActionRequirement from './ActionRequirement';
+import { ThemeProvider } from '../..';
+
+function handleGetList() {
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Text, null, /*#__PURE__*/React.createElement(Dumbbell, null), " 1x/day standard access"), /*#__PURE__*/React.createElement(Text, {
+    mt: "small"
+  }, /*#__PURE__*/React.createElement(User, null), " 4x/month 1-on-1 sessions"), /*#__PURE__*/React.createElement(Text, {
+    mt: "small"
+  }, /*#__PURE__*/React.createElement(Star, null), " 2x/month premium classes"));
+}
+
+describe('<ActionRequirement />', function () {
+  it('should default match snapshot', function () {
+    var _render = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(ActionRequirement, {
+      title: "title",
+      description: "description"
+    }))),
+        container = _render.container;
+
+    expect(container).toMatchSnapshot();
+  });
+  it('should match snapshot with list', function () {
+    var _render2 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(ActionRequirement, {
+      title: "title",
+      description: "description",
+      list: handleGetList()
+    }))),
+        container = _render2.container;
+
+    expect(container).toMatchSnapshot();
+  });
+});