@gympass/yoga 7.87.1 → 7.88.1

package/esm/Snackbar/native/Snackbar.js

@@ -1,200 +1,246 @@
-var _excluded = ["icon", "message", "actionLabel", "onAction", "variant", "onSnackbarClose", "duration", "bottomOffset"];
-
-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 _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, useEffect, useImperativeHandle, useRef, useState } from 'react';
-import styled from 'styled-components';
-import { string, oneOf, func, elementType, number } from 'prop-types';
-import { PanResponder } from 'react-native';
-import Box from '../../Box';
-import Button from '../../Button';
-import Icon from '../../Icon';
-import Text from '../../Text';
-import SnackbarAnimationWrapper from './SnackbarAnimationWrapper';
-var SWIPE_THRESHOLD = 32;
-var SnackbarContainer = styled.View(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\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  ";
-});
-/**
- * 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 = /*#__PURE__*/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 = _objectWithoutPropertiesLoose(props, _excluded);
-
-  var wrapperRef = useRef();
-
-  var _useState = useState({
-    icon: icon,
-    message: message,
-    actionLabel: actionLabel,
-    onAction: onAction,
-    variant: variant
-  }),
-      currentProps = _useState[0],
-      setCurrentProps = _useState[1];
-
-  useImperativeHandle(ref, function () {
-    return {
-      open: function open() {
-        wrapperRef.current.open();
-      },
-      close: function close() {
-        wrapperRef.current.close();
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+import { jsx, jsxs } from "react/jsx-runtime";
+import React, {
+  forwardRef,
+  useEffect,
+  useImperativeHandle,
+  useRef,
+  useState
+} from "react";
+import styled from "styled-components";
+import { string, oneOf, func, elementType, number } from "prop-types";
+import { PanResponder } from "react-native";
+import Box from "../../Box";
+import Button from "../../Button";
+import Icon from "../../Icon";
+import Text from "../../Text";
+import SnackbarAnimationWrapper from "./SnackbarAnimationWrapper";
+const SWIPE_THRESHOLD = 32;
+const SnackbarContainer = styled.View`
+  ${({
+  bottomOffset,
+  variant,
+  theme: {
+    yoga: {
+      colors: { feedback },
+      components: {
+        snackbar: {
+          padding,
+          margin,
+          variant: {
+            color: { [variant]: backgroundColor = feedback.success.light }
+          },
+          border
+        }
       }
-    };
+    }
+  }
+}) => `
+    padding: ${padding.vertical}px ${padding.horizontal}px;
+    margin-horizontal: ${margin.horizontal}px
+    margin-bottom: ${margin.bottom + bottomOffset}px;
+    background-color: ${backgroundColor};
+    border-radius: ${border.radius}px;
+    flex-direction: row;
+    align-items: center;
+  `}
+`;
+const Snackbar = forwardRef((props, ref) => {
+  const _a = props, {
+    icon,
+    message,
+    actionLabel,
+    onAction,
+    variant,
+    onSnackbarClose,
+    duration,
+    bottomOffset
+  } = _a, rest = __objRest(_a, [
+    "icon",
+    "message",
+    "actionLabel",
+    "onAction",
+    "variant",
+    "onSnackbarClose",
+    "duration",
+    "bottomOffset"
+  ]);
+  const wrapperRef = useRef();
+  const [currentProps, setCurrentProps] = useState({
+    icon,
+    message,
+    actionLabel,
+    onAction,
+    variant
   });
-  useEffect(function () {
+  useImperativeHandle(ref, () => ({
+    open: () => {
+      wrapperRef.current.open();
+    },
+    close: () => {
+      wrapperRef.current.close();
+    }
+  }));
+  useEffect(() => {
     if (wrapperRef.current && currentProps.message) {
-      wrapperRef.current.close(function () {
+      wrapperRef.current.close(() => {
         setCurrentProps({
-          icon: icon,
-          message: message,
-          actionLabel: actionLabel,
-          onAction: onAction,
-          variant: variant
+          icon,
+          message,
+          actionLabel,
+          onAction,
+          variant
         });
         wrapperRef.current.open();
       });
     } else {
       setCurrentProps({
-        icon: icon,
-        message: message,
-        actionLabel: actionLabel,
-        onAction: onAction,
-        variant: variant
+        icon,
+        message,
+        actionLabel,
+        onAction,
+        variant
       });
     }
   }, [icon, message, actionLabel, onAction, variant]);
-
-  var handlePanResponderRelease = function handlePanResponderRelease(_evt, gestureState) {
+  const handlePanResponderRelease = (_evt, gestureState) => {
     if (gestureState.dy > SWIPE_THRESHOLD) {
       wrapperRef.current.close();
     } else {
       wrapperRef.current.open();
     }
   };
-
-  var panResponder = PanResponder.create({
-    onPanResponderMove: function onPanResponderMove(_, gestureState) {
+  const panResponder = PanResponder.create({
+    onPanResponderMove: (_, gestureState) => {
       if (gestureState.dy > 0) {
         wrapperRef.current.translateY(gestureState.dy);
       }
     },
     onPanResponderRelease: handlePanResponderRelease,
     onPanResponderTerminate: handlePanResponderRelease,
-    onStartShouldSetPanResponder: function onStartShouldSetPanResponder() {
-      return true;
-    },
-    onMoveShouldSetPanResponder: function onMoveShouldSetPanResponder(_, gestureState) {
+    onStartShouldSetPanResponder: () => true,
+    onMoveShouldSetPanResponder: (_, gestureState) => {
       return !(gestureState.dy <= 2 && gestureState.dy >= -2);
     },
-    onMoveShouldSetPanResponderCapture: function onMoveShouldSetPanResponderCapture() {
-      return true;
-    },
-    onPanResponderTerminationRequest: function onPanResponderTerminationRequest() {
-      return true;
-    },
-    onShouldBlockNativeResponder: function onShouldBlockNativeResponder() {
-      return true;
-    }
+    onMoveShouldSetPanResponderCapture: () => true,
+    onPanResponderTerminationRequest: () => true,
+    onShouldBlockNativeResponder: () => true
   });
-
-  var handleOnAction = function handleOnAction() {
+  const handleOnAction = () => {
     wrapperRef.current.close();
-
     if (currentProps.onAction) {
       currentProps.onAction();
     }
   };
-
-  return /*#__PURE__*/React.createElement(SnackbarAnimationWrapper, {
-    onSnackbarClose: onSnackbarClose,
-    duration: duration,
-    ref: wrapperRef
-  }, /*#__PURE__*/React.createElement(SnackbarContainer, _extends({
-    variant: currentProps.variant,
-    bottomOffset: bottomOffset
-  }, rest, panResponder.panHandlers), currentProps.icon && /*#__PURE__*/React.createElement(Icon, {
-    as: currentProps.icon,
-    fill: "secondary",
-    size: "large",
-    marginRight: "xxsmall"
-  }), /*#__PURE__*/React.createElement(Text, {
-    flex: 1,
-    fontSize: "small",
-    marginTop: "xxxsmall",
-    marginBottom: "xxxsmall",
-    numberOfLines: 2
-  }, currentProps.message), currentProps.actionLabel && /*#__PURE__*/React.createElement(Box, {
-    as: Button.Text,
-    small: true,
-    secondary: true,
-    marginLeft: "xxsmall",
-    onPress: handleOnAction
-  }, currentProps.actionLabel)));
+  return /* @__PURE__ */ jsx(
+    SnackbarAnimationWrapper,
+    {
+      onSnackbarClose,
+      duration,
+      ref: wrapperRef,
+      children: /* @__PURE__ */ jsxs(
+        SnackbarContainer,
+        __spreadProps(__spreadValues(__spreadValues({
+          variant: currentProps.variant,
+          bottomOffset
+        }, rest), panResponder.panHandlers), {
+          children: [
+            currentProps.icon && /* @__PURE__ */ jsx(
+              Icon,
+              {
+                as: currentProps.icon,
+                fill: "secondary",
+                size: "large",
+                marginRight: "xxsmall"
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              Text,
+              {
+                flex: 1,
+                fontSize: "small",
+                marginTop: "xxxsmall",
+                marginBottom: "xxxsmall",
+                numberOfLines: 2,
+                children: currentProps.message
+              }
+            ),
+            currentProps.actionLabel && /* @__PURE__ */ jsx(
+              Box,
+              {
+                as: Button.Text,
+                small: true,
+                secondary: true,
+                marginLeft: "xxsmall",
+                onPress: handleOnAction,
+                children: currentProps.actionLabel
+              }
+            )
+          ]
+        })
+      )
+    }
+  );
 });
 Snackbar.propTypes = {
   /** The style variant change the color of the component, it may be "success", "informative" or "attention". */
-  variant: oneOf(['success', 'informative', 'attention']),
-
+  variant: oneOf(["success", "informative", "attention"]),
   /** Can be any icon of yoga-icons. */
   icon: elementType,
-
   /** The message shown when snackbar is opened. The maximum number of lines is two. */
   message: string,
-
   /** Label for a custom action. */
   actionLabel: string,
-
   /** Function for the custom action. The `actionLabel` becomes required when passing this function. */
   onAction: func,
-
   /** Callback function triggered by the Snackbar close action. Can be used for events, for example. */
   onSnackbarClose: func,
-
   /** The duration sets how long it will take to close snackbar automatically, it may be "fast" (4 seconds), "default" (8 seconds), "slow" (10 seconds) or "indefinite" (it doesn't close automatically). */
-  duration: oneOf(['fast', 'default', 'slow', 'indefinite']),
-
+  duration: oneOf(["fast", "default", "slow", "indefinite"]),
   /** Add extra margin to Snackbar. Can be useful for SafeAreaView or button cases. */
   bottomOffset: number
 };
 Snackbar.defaultProps = {
-  variant: 'success',
-  icon: undefined,
-  message: '',
-  actionLabel: undefined,
-  onAction: undefined,
-  onSnackbarClose: undefined,
-  duration: 'default',
+  variant: "success",
+  icon: void 0,
+  message: "",
+  actionLabel: void 0,
+  onAction: void 0,
+  onSnackbarClose: void 0,
+  duration: "default",
   bottomOffset: 0
 };
-export default Snackbar;
+var Snackbar_default = Snackbar;
+export {
+  Snackbar_default as default
+};

package/esm/Snackbar/native/Snackbar.test.js

@@ -1,100 +1,108 @@
-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); }
-
-import React, { useRef } from 'react';
-import { render, fireEvent } from '@testing-library/react-native';
-import * as RN from 'react-native';
-import { CheckedFull } from '@gympass/yoga-icons';
-import { ThemeProvider, Snackbar } from '../..';
-import Button from '../../Button';
+var __defProp = Object.defineProperty;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+import { jsx, jsxs } from "react/jsx-runtime";
+import React, { useRef } from "react";
+import { render, fireEvent } from "@testing-library/react-native";
+import * as RN from "react-native";
+import { CheckedFull } from "@gympass/yoga-icons";
+import { ThemeProvider, Snackbar } from "../..";
+import Button from "../../Button";
 RN.Animated.spring = jest.fn().mockReturnValue({
   start: jest.fn()
 });
-
-var Component = function Component(overrideProps) {
-  var snackbarRef = useRef();
-  return /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Button, {
-    full: true,
-    small: true,
-    onPress: function onPress() {
-      snackbarRef.current.open();
-    }
-  }, "Tap to open snackbar"), /*#__PURE__*/React.createElement(Snackbar, _extends({
-    ref: snackbarRef,
-    message: "Feedback Message"
-  }, overrideProps)));
+const Component = (overrideProps) => {
+  const snackbarRef = useRef();
+  return /* @__PURE__ */ jsxs(ThemeProvider, { children: [
+    /* @__PURE__ */ jsx(
+      Button,
+      {
+        full: true,
+        small: true,
+        onPress: () => {
+          snackbarRef.current.open();
+        },
+        children: "Tap to open snackbar"
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      Snackbar,
+      __spreadValues({
+        ref: snackbarRef,
+        message: "Feedback Message"
+      }, overrideProps)
+    )
+  ] });
 };
-
-describe('<Snackbar />', function () {
-  it('should match snapshot when snackbar is default', function () {
-    var _render = render( /*#__PURE__*/React.createElement(Component, null)),
-        toJSON = _render.toJSON;
-
+describe("<Snackbar />", () => {
+  it("should match snapshot when snackbar is default", () => {
+    const { toJSON } = render(/* @__PURE__ */ jsx(Component, {}));
     expect(toJSON()).toMatchSnapshot();
   });
-  it('should match snapshot when have an icon and action', function () {
-    var overrideProps = {
+  it("should match snapshot when have an icon and action", () => {
+    const overrideProps = {
       icon: CheckedFull,
-      actionLabel: 'Action',
-      onAction: function onAction() {}
+      actionLabel: "Action",
+      onAction: () => {
+      }
     };
-
-    var _render2 = render( /*#__PURE__*/React.createElement(Component, overrideProps)),
-        toJSON = _render2.toJSON;
-
+    const { toJSON } = render(/* @__PURE__ */ jsx(Component, __spreadValues({}, overrideProps)));
     expect(toJSON()).toMatchSnapshot();
   });
-  it('should match snapshot when have a long text', function () {
-    var overrideProps = {
-      message: 'Lorem Ipsum is simply dummy text of the printing and types.',
+  it("should match snapshot when have a long text", () => {
+    const overrideProps = {
+      message: "Lorem Ipsum is simply dummy text of the printing and types.",
       icon: CheckedFull,
-      actionLabel: 'Action',
-      onAction: function onAction() {}
+      actionLabel: "Action",
+      onAction: () => {
+      }
     };
-
-    var _render3 = render( /*#__PURE__*/React.createElement(Component, overrideProps)),
-        toJSON = _render3.toJSON;
-
+    const { toJSON } = render(/* @__PURE__ */ jsx(Component, __spreadValues({}, overrideProps)));
     expect(toJSON()).toMatchSnapshot();
   });
-  it('should match snapshot when have a variant informative or attention prop', function () {
-    var overrideProps = {
-      variant: 'informative'
+  it("should match snapshot when have a variant informative or attention prop", () => {
+    const overrideProps = {
+      variant: "informative"
     };
-
-    var _render4 = render( /*#__PURE__*/React.createElement(Component, overrideProps)),
-        toJSON = _render4.toJSON;
-
+    const { toJSON } = render(/* @__PURE__ */ jsx(Component, __spreadValues({}, overrideProps)));
     expect(toJSON()).toMatchSnapshot();
   });
-  it('should show and hide snackbar when the open and close Animation function is called', function () {
-    var overrideProps = {
+  it("should show and hide snackbar when the open and close Animation function is called", () => {
+    const overrideProps = {
       onSnackbarClose: jest.fn(),
-      actionLabel: 'Action',
+      actionLabel: "Action",
       onAction: jest.fn()
     };
-
-    var _render5 = render( /*#__PURE__*/React.createElement(Component, overrideProps)),
-        getByText = _render5.getByText,
-        getByTestId = _render5.getByTestId;
-
-    fireEvent(getByTestId('wrapper'), 'layout', {
+    const { getByText, getByTestId } = render(/* @__PURE__ */ jsx(Component, __spreadValues({}, overrideProps)));
+    fireEvent(getByTestId("wrapper"), "layout", {
       nativeEvent: {
-        layout: {
-          height: 200
-        }
+        layout: { height: 200 }
       }
     });
-    fireEvent.press(getByText('Tap to open snackbar'));
+    fireEvent.press(getByText("Tap to open snackbar"));
     expect(RN.Animated.spring.mock.calls[0][1]).toEqual({
       toValue: 0,
       bounciness: 0,
       useNativeDriver: true
     });
-    fireEvent.press(getByText('Action'));
+    fireEvent.press(getByText("Action"));
     expect(RN.Animated.spring.mock.calls[1][1]).toEqual({
       toValue: 200,
       bounciness: 0,
       useNativeDriver: true
     });
   });
-});
+});