@gympass/yoga 7.87.1 → 7.88.0

package/esm/Button/native/Link.js

@@ -1,35 +0,0 @@
-var _templateObject;
-
-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 _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.slice(0); } strings.raw = raw; return strings; }
-
-import React, { forwardRef } from 'react';
-import styled from 'styled-components';
-import { bool } from 'prop-types';
-import { hexToRgb } from '@gympass/yoga-common';
-import withTouchable from './withTouchable';
-import { Label } from './Button';
-var Link = styled(Label)(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\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: " + hexToRgb(link.font[state].color, 0.75) + ";" : '') + "\n    ";
-});
-var ButtonLink = /*#__PURE__*/forwardRef(function (props, ref) {
-  return /*#__PURE__*/React.createElement(Link, _extends({}, props, {
-    ref: ref
-  }));
-});
-ButtonLink.propTypes = {
-  disabled: bool,
-  secondary: bool
-};
-ButtonLink.defaultProps = {
-  disabled: false,
-  secondary: false
-};
-ButtonLink.displayName = 'Button.Link';
-export default withTouchable(ButtonLink);

package/esm/Button/native/Text.js

@@ -1,74 +0,0 @@
-var _excluded = ["children", "disabled", "pressed", "small", "secondary", "inverted", "icon", "theme"];
-
-var _templateObject, _templateObject2;
-
-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; }
-
-function _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.slice(0); } strings.raw = raw; return strings; }
-
-import React, { forwardRef } from 'react';
-import styled, { withTheme } from 'styled-components';
-import { hexToRgb } from '@gympass/yoga-common';
-import withTouchable from './withTouchable';
-import { Label, ButtonContainer } from './Button';
-var LabelText = styled(Label)(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n  ", "\n"])), function (_ref) {
-  var color = _ref.color;
-  return "color: " + color + ";";
-});
-var ButtonContainerText = styled(ButtonContainer)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n  ", "\n"])), function (_ref2) {
-  var button = _ref2.theme.yoga.components.button;
-  return "\n    background-color: " + button.types.text.backgroundColor + ";\n  ";
-});
-var ButtonText = /*#__PURE__*/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 = _objectWithoutPropertiesLoose(_ref3, _excluded);
-
-  var state = secondary ? 'secondary' : 'primary';
-  var textColor = colors[state];
-
-  if (disabled) {
-    textColor = button.types.text.disabled;
-  } else if (inverted) {
-    textColor = colors.white;
-
-    if (pressed) {
-      textColor = hexToRgb(colors.white, 0.75);
-    }
-  } else if (pressed) {
-    textColor = hexToRgb(colors[state], 0.75);
-  }
-
-  return /*#__PURE__*/React.createElement(ButtonContainerText, _extends({}, rest, {
-    disabled: disabled,
-    pressed: pressed,
-    small: small,
-    ref: ref
-  }), Icon && /*#__PURE__*/React.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
-    }
-  }), /*#__PURE__*/React.createElement(LabelText, {
-    disabled: disabled,
-    pressed: pressed,
-    small: small,
-    secondary: secondary,
-    color: textColor
-  }, children));
-});
-ButtonText.propTypes = ButtonContainer.propTypes;
-ButtonText.defaultProps = ButtonContainer.defaultProps;
-export default withTouchable(withTheme(ButtonText));

package/esm/Button/native/withTouchable.js

@@ -1,63 +0,0 @@
-var _excluded = ["onPressIn", "onPressOut", "onChange", "onPress"];
-
-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; }
-
-import React, { useState } from 'react';
-import { View, TouchableWithoutFeedback } from 'react-native';
-import { element, func } from 'prop-types';
-
-var withTouchable = function withTouchable(Component) {
-  var WithTouchable = function WithTouchable(_ref) {
-    var _onPressIn = _ref.onPressIn,
-        _onPressOut = _ref.onPressOut,
-        onChange = _ref.onChange,
-        _ref$onPress = _ref.onPress,
-        onPress = _ref$onPress === void 0 ? onChange : _ref$onPress,
-        rest = _objectWithoutPropertiesLoose(_ref, _excluded);
-
-    var _useState = useState(false),
-        pressed = _useState[0],
-        setPressed = _useState[1];
-
-    return /*#__PURE__*/React.createElement(TouchableWithoutFeedback, _extends({
-      onPressIn: function onPressIn(e) {
-        setPressed(true);
-
-        _onPressIn(e);
-      },
-      onPressOut: function onPressOut(e) {
-        setPressed(false);
-
-        _onPressOut(e);
-      },
-      onPress: onPress
-    }, rest), /*#__PURE__*/React.createElement(View, {
-      style: {
-        flexDirection: 'row'
-      }
-    }, /*#__PURE__*/React.createElement(Component, _extends({}, rest, {
-      pressed: pressed
-    }))));
-  };
-
-  WithTouchable.propTypes = {
-    onPressIn: func,
-    onPressOut: func,
-    onChange: func,
-    onPress: func
-  };
-  WithTouchable.defaultProps = {
-    onPressIn: function onPressIn() {},
-    onPressOut: function onPressOut() {},
-    onChange: undefined,
-    onPress: undefined
-  };
-  return WithTouchable;
-};
-
-withTouchable.propTypes = {
-  Component: element
-};
-export default withTouchable;

package/esm/Card/Card.native.theme.js

@@ -1,47 +0,0 @@
-var CardNative = function CardNative(_ref) {
-  var colors = _ref.colors,
-      spacing = _ref.spacing,
-      lineHeights = _ref.lineHeights;
-  return {
-    plan: {
-      title: {
-        margin: {
-          bottom: spacing.xxsmall
-        },
-        lineHeight: lineHeights.medium
-      },
-      description: {
-        color: colors.text.secondary
-      },
-      price: {
-        margin: {
-          bottom: spacing.large
-        }
-      },
-      list: {
-        margin: {
-          top: spacing.large
-        },
-        item: {
-          icon: {
-            margin: {
-              right: spacing.xxsmall
-            }
-          }
-        }
-      },
-      actions: {
-        buttonText: {
-          margin: {
-            top: spacing.xsmall
-          }
-        },
-        margin: {
-          top: spacing.xxsmall
-        }
-      }
-    }
-  };
-};
-
-export default CardNative;

package/esm/Card/Card.theme.js

@@ -1,156 +0,0 @@
-var Card = function Card(_ref) {
-  var colors = _ref.colors,
-      spacing = _ref.spacing,
-      radii = _ref.radii,
-      elevations = _ref.elevations,
-      borders = _ref.borders,
-      fontWeights = _ref.fontWeights,
-      fontSizes = _ref.fontSizes;
-  return {
-    backgroundColor: colors.white,
-    padding: {
-      top: spacing.small,
-      right: spacing.small,
-      bottom: spacing.small,
-      left: spacing.small
-    },
-    radii: radii.small,
-    elevation: elevations.small,
-    ribbon: {
-      radius: radii.circle
-    },
-    plan: {
-      padding: {
-        top: spacing.xxxlarge,
-        right: spacing.large,
-        bottom: spacing.large,
-        left: spacing.large
-      },
-      radius: 16,
-      tag: {
-        position: {
-          top: spacing.large,
-          left: spacing.large
-        }
-      },
-      subtitle: {
-        margin: {
-          bottom: spacing.xxsmall
-        },
-        font: {
-          color: colors.text.secondary,
-          weight: fontWeights.medium,
-          size: fontSizes.xsmall
-        }
-      },
-      title: {
-        color: colors.text.primary
-      },
-      description: {
-        color: colors.text.secondary
-      },
-      price: {
-        currency: {
-          margin: {
-            right: spacing.xxxsmall
-          }
-        },
-        margin: {
-          top: spacing.xxsmall
-        }
-      },
-      list: {
-        item: {
-          margin: {
-            bottom: spacing.small
-          },
-          font: {
-            color: colors.text.primary
-          }
-        },
-        button: {
-          font: {
-            color: colors.secondary,
-            size: fontSizes.xsmall,
-            weight: fontWeights.medium
-          },
-          margin: {
-            top: spacing.xsmall
-          }
-        }
-      },
-      actions: {
-        buttonText: {
-          margin: {
-            bottom: spacing.zero
-          }
-        }
-      }
-    },
-    gym: {
-      checkIn: {
-        header: {
-          margin: {
-            bottom: spacing.small
-          }
-        },
-        avatar: {
-          border: {
-            radius: radii.small,
-            width: borders.small
-          }
-        },
-        content: {
-          margin: {
-            top: spacing.small
-          }
-        },
-        title: {
-          font: {
-            weight: fontWeights.regular
-          },
-          margin: {
-            bottom: spacing.xxsmall
-          }
-        }
-      }
-    },
-    event: {
-      icon: {
-        fill: colors.text.primary
-      },
-      info: {
-        padding: {
-          top: spacing.small,
-          right: spacing.small,
-          left: spacing.small,
-          bottom: spacing.small
-        },
-        name: {
-          height: spacing.medium,
-          fontWeight: fontWeights.medium,
-          fontSize: fontSizes.medium,
-          marginBottom: spacing.xxsmall
-        },
-        place: {
-          height: spacing.medium,
-          color: colors.text.secondary,
-          marginBottom: spacing.xxsmall
-        }
-      },
-      date: {
-        backgroundColor: colors.primary,
-        radius: radii.small,
-        dayOfWeek: {
-          fontWeight: fontWeights.regular,
-          marginBottom: spacing.xxsmall
-        },
-        month: {
-          fontWeight: fontWeights.medium
-        }
-      }
-    }
-  };
-};
-
-export default Card;

package/esm/Card/Card.web.theme.js

@@ -1,43 +0,0 @@
-var CardWeb = function CardWeb(_ref) {
-  var spacing = _ref.spacing,
-      lineHeights = _ref.lineHeights;
-  return {
-    plan: {
-      title: {
-        margin: {
-          bottom: spacing.xxsmall
-        },
-        lineHeight: lineHeights.medium
-      },
-      price: {
-        margin: {
-          bottom: spacing.large
-        }
-      },
-      list: {
-        margin: {
-          top: spacing.large
-        },
-        item: {
-          icon: {
-            margin: {
-              right: spacing.xxsmall
-            }
-          }
-        }
-      },
-      actions: {
-        buttonText: {
-          margin: {
-            top: spacing.xsmall
-          }
-        },
-        margin: {
-          top: spacing.large
-        }
-      }
-    }
-  };
-};
-
-export default CardWeb;

package/esm/Card/index.js

@@ -1,2 +0,0 @@
-import { Card, PlanCard, EventCard } from './web';
-export { Card, PlanCard, EventCard };

package/esm/Card/index.native.js

@@ -1,2 +0,0 @@
-import { Card, PlanCard, EventCard, GymCard } from './native';
-export { Card, PlanCard, EventCard, GymCard };

package/esm/Card/native/Card/Actions.js

@@ -1,12 +0,0 @@
-var _templateObject;
-
-function _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.slice(0); } strings.raw = raw; return strings; }
-
-import styled from 'styled-components';
-import { node } from 'prop-types';
-var Actions = styled.View(_templateObject || (_templateObject = _taggedTemplateLiteralLoose([""])));
-Actions.propTypes = {
-  children: node.isRequired
-};
-Actions.displayName = 'Card.Actions';
-export default Actions;

package/esm/Card/native/Card/Card.js

@@ -1,92 +0,0 @@
-var _excluded = ["ribbon", "children"];
-
-var _templateObject, _templateObject2, _templateObject3, _templateObject4;
-
-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; }
-
-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 { string, shape, oneOf, node } from 'prop-types';
-import Text from '../../../Text';
-import Box from '../../../Box';
-var CardShadow = styled(Box).attrs(function (_ref) {
-  var elevation = _ref.theme.yoga.components.card.elevation;
-  return {
-    elevation: elevation
-  };
-})(_templateObject || (_templateObject = _taggedTemplateLiteralLoose([""])));
-var CardStyled = styled(Box).attrs(function (_ref2) {
-  var variant = _ref2.variant,
-      _ref2$theme$yoga = _ref2.theme.yoga,
-      color = _ref2$theme$yoga.colors[variant],
-      card = _ref2$theme$yoga.components.card;
-  return {
-    elevation: card.elevation,
-    pt: card.padding.top,
-    pr: card.padding.right,
-    pb: card.padding.bottom,
-    pl: card.padding.left,
-    bRadius: card.radii,
-    bgColor: variant ? color : card.backgroundColor,
-    overflow: 'hidden'
-  };
-})(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose([""])));
-var Ribbon = styled.View(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n  ", "\n"])), function (_ref3) {
-  var variant = _ref3.variant,
-      _ref3$theme$yoga = _ref3.theme.yoga,
-      card = _ref3$theme$yoga.components.card,
-      spacing = _ref3$theme$yoga.spacing,
-      _ref3$theme$yoga$colo = _ref3$theme$yoga.colors,
-      elements = _ref3$theme$yoga$colo.elements,
-      color = _ref3$theme$yoga$colo[variant],
-      white = _ref3$theme$yoga$colo.white,
-      dark = _ref3$theme$yoga$colo.dark;
-  return "\n    align-self: flex-start;\n\n    margin-bottom: " + card.padding.bottom + "px;\n    margin-left: -" + card.padding.left + "px;\n\n    padding:\n      " + spacing.xxxsmall + "px\n      " + spacing.xsmall + "px\n      " + spacing.xxxsmall + "px\n      " + spacing.small + "px;\n\n    border-top-right-radius: " + card.ribbon.radius + "px;\n    border-bottom-right-radius: " + card.ribbon.radius + "px;\n    background-color: " + (variant ? color : elements.backgroundAndDisabled) + ";\n\n    color: " + (variant ? white : dark) + ";\n  ";
-});
-var RibbonText = styled(Text.Tiny)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n  ", "\n"])), function (_ref4) {
-  var variant = _ref4.variant,
-      _ref4$theme$yoga$colo = _ref4.theme.yoga.colors,
-      white = _ref4$theme$yoga$colo.white,
-      dark = _ref4$theme$yoga$colo.dark;
-  return "\n    color: " + (variant ? white : dark) + ";\n  ";
-});
-var Card = /*#__PURE__*/React.forwardRef(function (_ref5, ref) {
-  var ribbon = _ref5.ribbon,
-      children = _ref5.children,
-      rest = _objectWithoutPropertiesLoose(_ref5, _excluded);
-
-  return /*#__PURE__*/React.createElement(CardShadow, null, /*#__PURE__*/React.createElement(CardStyled, _extends({
-    ref: ref
-  }, rest), Object.keys(ribbon).length > 0 && /*#__PURE__*/React.createElement(Ribbon, {
-    variant: ribbon.variant
-  }, /*#__PURE__*/React.createElement(RibbonText, {
-    variant: ribbon.variant
-  }, ribbon.text)), children));
-});
-Card.propTypes = {
-  /** text: the content inside the Card Ribbon
-   * variant: style the card following the theme (primary, secondary, vibin,
-   * hope, energy, relax, peace, verve, uplift, deepPurple, deep, stamina, dark,
-   * medium, light, clear, white) */
-  ribbon: shape({
-    text: string,
-    variant: oneOf(['', 'primary', 'secondary', 'vibin', 'hope', 'energy', 'relax', 'peace', 'verve', 'uplift', 'deepPurple', 'stamina', 'dark', 'medium', 'deep', 'light', 'clear', 'white'])
-  }),
-  children: node,
-
-  /** style the card following the theme (primary, secondary, vibin, hope,
-   * energy, relax, peace, verve, uplift, deepPurple, deep, stamina, dark,
-   * medium, light, clear, white) */
-  variant: oneOf(['', 'primary', 'secondary', 'vibin', 'hope', 'energy', 'relax', 'peace', 'verve', 'uplift', 'deepPurple', 'stamina', 'dark', 'medium', 'deep', 'light', 'clear', 'white'])
-};
-Card.defaultProps = {
-  ribbon: {},
-  children: null,
-  variant: ''
-};
-Card.displayName = 'Card';
-export default Card;

package/esm/Card/native/Card/Card.test.js

@@ -1,15 +0,0 @@
-import React from 'react';
-import { render } from '@testing-library/react-native';
-import { Text } from 'react-native';
-import { ThemeProvider, Button } from '../../..';
-import Card from '.';
-describe('<Card />', function () {
-  describe('Snapshots', function () {
-    it('should match snapshot with default Card', function () {
-      var _render = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Card, null, /*#__PURE__*/React.createElement(Card.Header, null, /*#__PURE__*/React.createElement(Text, null, "Hello World")), /*#__PURE__*/React.createElement(Card.Content, null, /*#__PURE__*/React.createElement(Text, null, "It's fine here")), /*#__PURE__*/React.createElement(Card.Actions, null, /*#__PURE__*/React.createElement(Button, null, "Action's children must be Button"))))),
-          toJSON = _render.toJSON;
-
-      expect(toJSON()).toMatchSnapshot();
-    });
-  });
-});

package/esm/Card/native/Card/Content.js

@@ -1,8 +0,0 @@
-var _templateObject;
-
-function _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.slice(0); } strings.raw = raw; return strings; }
-
-import styled from 'styled-components';
-var Content = styled.View(_templateObject || (_templateObject = _taggedTemplateLiteralLoose([""])));
-Content.displayName = 'Card.Content';
-export default Content;

package/esm/Card/native/Card/Header.js

@@ -1,8 +0,0 @@
-var _templateObject;
-
-function _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.slice(0); } strings.raw = raw; return strings; }
-
-import styled from 'styled-components';
-var Header = styled.View(_templateObject || (_templateObject = _taggedTemplateLiteralLoose([""])));
-Header.displayName = 'Card.Header';
-export default Header;

package/esm/Card/native/Card/index.js

@@ -1,8 +0,0 @@
-import Card from './Card';
-import Header from './Header';
-import Content from './Content';
-import Actions from './Actions';
-Card.Header = Header;
-Card.Content = Content;
-Card.Actions = Actions;
-export default Card;