@gympass/yoga 7.66.0 → 7.67.0

package/esm/Progress/native/Progress.test.js

@@ -0,0 +1,222 @@
+import React from 'react';
+import { render } from '@testing-library/react-native';
+import { ThemeProvider, Progress } from '../..';
+describe('<Progress />', function () {
+  it('should match snapshot', function () {
+    var _render = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Progress, null), /*#__PURE__*/React.createElement(Progress, {
+      max: 100
+    }), /*#__PURE__*/React.createElement(Progress, {
+      max: 100,
+      value: 60
+    }))),
+        toJSON = _render.toJSON;
+
+    expect(toJSON()).toMatchSnapshot();
+  });
+  it('should match snapshot with label string', function () {
+    var _render2 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Progress, {
+      max: 100,
+      label: {
+        value: 'Some decription here'
+      }
+    }), /*#__PURE__*/React.createElement(Progress, {
+      max: 100,
+      value: 65,
+      label: {
+        value: 'Some decription here',
+        placement: 'right'
+      }
+    }))),
+        toJSON = _render2.toJSON;
+
+    expect(toJSON()).toMatchSnapshot();
+  });
+  it('should match snapshot with label number', function () {
+    var _render3 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Progress, {
+      max: 100,
+      value: 20,
+      label: {
+        value: 20
+      }
+    }), /*#__PURE__*/React.createElement(Progress, {
+      max: 100,
+      value: 65,
+      label: {
+        value: 65,
+        placement: 'right'
+      }
+    }))),
+        toJSON = _render3.toJSON;
+
+    expect(toJSON()).toMatchSnapshot();
+  });
+  it('should match snapshot with all variants', function () {
+    var _render4 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Progress, {
+      max: 100,
+      value: 20,
+      label: {
+        value: 20
+      },
+      variant: "primary"
+    }), /*#__PURE__*/React.createElement(Progress, {
+      max: 100,
+      value: 20,
+      label: {
+        value: 20
+      },
+      variant: "secondary"
+    }), /*#__PURE__*/React.createElement(Progress, {
+      max: 100,
+      value: 20,
+      label: {
+        value: 20
+      },
+      variant: "vibin"
+    }), /*#__PURE__*/React.createElement(Progress, {
+      max: 100,
+      value: 20,
+      label: {
+        value: 20
+      },
+      variant: "hope"
+    }), /*#__PURE__*/React.createElement(Progress, {
+      max: 100,
+      value: 20,
+      label: {
+        value: 20
+      },
+      variant: "energy"
+    }), /*#__PURE__*/React.createElement(Progress, {
+      max: 100,
+      value: 20,
+      label: {
+        value: 20
+      },
+      variant: "relax"
+    }), /*#__PURE__*/React.createElement(Progress, {
+      max: 100,
+      value: 20,
+      label: {
+        value: 20
+      },
+      variant: "peace"
+    }), /*#__PURE__*/React.createElement(Progress, {
+      max: 100,
+      value: 20,
+      label: {
+        value: 20
+      },
+      variant: "verve"
+    }), /*#__PURE__*/React.createElement(Progress, {
+      max: 100,
+      value: 20,
+      label: {
+        value: 20
+      },
+      variant: "uplift"
+    }), /*#__PURE__*/React.createElement(Progress, {
+      max: 100,
+      value: 20,
+      label: {
+        value: 20
+      },
+      variant: "deepPurple"
+    }), /*#__PURE__*/React.createElement(Progress, {
+      max: 100,
+      value: 20,
+      label: {
+        value: 20
+      },
+      variant: "stamina"
+    }), /*#__PURE__*/React.createElement(Progress, {
+      max: 100,
+      value: 20,
+      label: {
+        value: 20
+      },
+      variant: "dark"
+    }), /*#__PURE__*/React.createElement(Progress, {
+      max: 100,
+      value: 20,
+      label: {
+        value: 20
+      },
+      variant: "medium"
+    }), /*#__PURE__*/React.createElement(Progress, {
+      max: 100,
+      value: 20,
+      label: {
+        value: 20
+      },
+      variant: "deep"
+    }), /*#__PURE__*/React.createElement(Progress, {
+      max: 100,
+      value: 20,
+      label: {
+        value: 20
+      },
+      variant: "light"
+    }), /*#__PURE__*/React.createElement(Progress, {
+      max: 100,
+      value: 20,
+      label: {
+        value: 20
+      },
+      variant: "clear"
+    }), /*#__PURE__*/React.createElement(Progress, {
+      max: 100,
+      value: 20,
+      label: {
+        value: 20
+      },
+      variant: "white"
+    }))),
+        toJSON = _render4.toJSON;
+
+    expect(toJSON()).toMatchSnapshot();
+  });
+  it('should match snapshot with positions prop system', function () {
+    var _render5 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Progress, {
+      position: "absolute",
+      top: "small",
+      left: "small"
+    }))),
+        toJSON = _render5.toJSON;
+
+    expect(toJSON()).toMatchSnapshot();
+  });
+  it('should match snapshot with spacing prop system', function () {
+    var _render6 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Progress, {
+      m: "small",
+      padding: "medium"
+    }))),
+        toJSON = _render6.toJSON;
+
+    expect(toJSON()).toMatchSnapshot();
+  });
+  it('should match snapshot with background color prop system', function () {
+    var _render7 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Progress, {
+      backgroundColor: "primary"
+    }))),
+        toJSON = _render7.toJSON;
+
+    expect(toJSON()).toMatchSnapshot();
+  });
+  it('should match snapshot with border prop system', function () {
+    var _render8 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Progress, {
+      b: "small",
+      bRadius: "small"
+    }))),
+        toJSON = _render8.toJSON;
+
+    expect(toJSON()).toMatchSnapshot();
+  });
+  it('should match snapshot with elevation prop system', function () {
+    var _render9 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Progress, {
+      elevation: "small"
+    }))),
+        toJSON = _render9.toJSON;
+
+    expect(toJSON()).toMatchSnapshot();
+  });
+});

package/esm/Progress/native/index.js

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

package/esm/Progress/web/Progress.test.js

@@ -0,0 +1,222 @@
+import React from 'react';
+import { render } from '@testing-library/react';
+import { ThemeProvider, Progress } from '../..';
+describe('<Progress />', function () {
+  it('should match snapshot', function () {
+    var _render = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Progress, null), /*#__PURE__*/React.createElement(Progress, {
+      max: 100
+    }), /*#__PURE__*/React.createElement(Progress, {
+      max: 100,
+      value: 60
+    }))),
+        container = _render.container;
+
+    expect(container).toMatchSnapshot();
+  });
+  it('should match snapshot with label string', function () {
+    var _render2 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Progress, {
+      max: 100,
+      label: {
+        value: 'Some decription here'
+      }
+    }), /*#__PURE__*/React.createElement(Progress, {
+      max: 100,
+      value: 65,
+      label: {
+        value: 'Some decription here',
+        placement: 'right'
+      }
+    }))),
+        container = _render2.container;
+
+    expect(container).toMatchSnapshot();
+  });
+  it('should match snapshot with label number', function () {
+    var _render3 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Progress, {
+      max: 100,
+      value: 20,
+      label: {
+        value: 20
+      }
+    }), /*#__PURE__*/React.createElement(Progress, {
+      max: 100,
+      value: 65,
+      label: {
+        value: 65,
+        placement: 'right'
+      }
+    }))),
+        container = _render3.container;
+
+    expect(container).toMatchSnapshot();
+  });
+  it('should match snapshot with all variants', function () {
+    var _render4 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Progress, {
+      max: 100,
+      value: 20,
+      label: {
+        value: 20
+      },
+      variant: "primary"
+    }), /*#__PURE__*/React.createElement(Progress, {
+      max: 100,
+      value: 20,
+      label: {
+        value: 20
+      },
+      variant: "secondary"
+    }), /*#__PURE__*/React.createElement(Progress, {
+      max: 100,
+      value: 20,
+      label: {
+        value: 20
+      },
+      variant: "vibin"
+    }), /*#__PURE__*/React.createElement(Progress, {
+      max: 100,
+      value: 20,
+      label: {
+        value: 20
+      },
+      variant: "hope"
+    }), /*#__PURE__*/React.createElement(Progress, {
+      max: 100,
+      value: 20,
+      label: {
+        value: 20
+      },
+      variant: "energy"
+    }), /*#__PURE__*/React.createElement(Progress, {
+      max: 100,
+      value: 20,
+      label: {
+        value: 20
+      },
+      variant: "relax"
+    }), /*#__PURE__*/React.createElement(Progress, {
+      max: 100,
+      value: 20,
+      label: {
+        value: 20
+      },
+      variant: "peace"
+    }), /*#__PURE__*/React.createElement(Progress, {
+      max: 100,
+      value: 20,
+      label: {
+        value: 20
+      },
+      variant: "verve"
+    }), /*#__PURE__*/React.createElement(Progress, {
+      max: 100,
+      value: 20,
+      label: {
+        value: 20
+      },
+      variant: "uplift"
+    }), /*#__PURE__*/React.createElement(Progress, {
+      max: 100,
+      value: 20,
+      label: {
+        value: 20
+      },
+      variant: "deepPurple"
+    }), /*#__PURE__*/React.createElement(Progress, {
+      max: 100,
+      value: 20,
+      label: {
+        value: 20
+      },
+      variant: "stamina"
+    }), /*#__PURE__*/React.createElement(Progress, {
+      max: 100,
+      value: 20,
+      label: {
+        value: 20
+      },
+      variant: "dark"
+    }), /*#__PURE__*/React.createElement(Progress, {
+      max: 100,
+      value: 20,
+      label: {
+        value: 20
+      },
+      variant: "medium"
+    }), /*#__PURE__*/React.createElement(Progress, {
+      max: 100,
+      value: 20,
+      label: {
+        value: 20
+      },
+      variant: "deep"
+    }), /*#__PURE__*/React.createElement(Progress, {
+      max: 100,
+      value: 20,
+      label: {
+        value: 20
+      },
+      variant: "light"
+    }), /*#__PURE__*/React.createElement(Progress, {
+      max: 100,
+      value: 20,
+      label: {
+        value: 20
+      },
+      variant: "clear"
+    }), /*#__PURE__*/React.createElement(Progress, {
+      max: 100,
+      value: 20,
+      label: {
+        value: 20
+      },
+      variant: "white"
+    }))),
+        container = _render4.container;
+
+    expect(container).toMatchSnapshot();
+  });
+  it('should match snapshot with positions prop system', function () {
+    var _render5 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Progress, {
+      position: "fixed",
+      top: "small",
+      left: "small"
+    }))),
+        container = _render5.container;
+
+    expect(container).toMatchSnapshot();
+  });
+  it('should match snapshot with spacing prop system', function () {
+    var _render6 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Progress, {
+      m: "small",
+      padding: "medium"
+    }))),
+        container = _render6.container;
+
+    expect(container).toMatchSnapshot();
+  });
+  it('should match snapshot with background color prop system', function () {
+    var _render7 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Progress, {
+      backgroundColor: "primary"
+    }))),
+        container = _render7.container;
+
+    expect(container).toMatchSnapshot();
+  });
+  it('should match snapshot with border prop system', function () {
+    var _render8 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Progress, {
+      b: "small",
+      bRadius: "small"
+    }))),
+        container = _render8.container;
+
+    expect(container).toMatchSnapshot();
+  });
+  it('should match snapshot with elevation prop system', function () {
+    var _render9 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Progress, {
+      elevation: "small"
+    }))),
+        container = _render9.container;
+
+    expect(container).toMatchSnapshot();
+  });
+});

package/esm/RadioGroup/index.native.js

@@ -0,0 +1,4 @@
+import { RadioGroup, RadioButton, Radio } from './native';
+RadioGroup.Button = RadioButton;
+RadioGroup.Radio = Radio;
+export default RadioGroup;

package/esm/RadioGroup/native/Button/RadioButton.js

@@ -0,0 +1,64 @@
+var _excluded = ["value", "children"],
+    _excluded2 = ["onChange", "small", "selectedValue"];
+
+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, { useContext } from 'react';
+import { string, oneOfType, number, node } from 'prop-types';
+import { TouchableWithoutFeedback } from 'react-native';
+import styled from 'styled-components';
+import RadioGroupContext from '../../RadioGroupContext';
+var RadioMark = styled.View(function (_ref) {
+  var radiogroup = _ref.theme.yoga.components.radiogroup,
+      small = _ref.small,
+      checked = _ref.checked;
+  return "\n  align-items: center;\n  justify-content: center;\n\n  height: " + (small ? radiogroup.button.height.small : radiogroup.button.height.normal) + "px;\n  padding-left: " + radiogroup.button.padding.left + "px;\n  padding-right: " + radiogroup.button.padding.right + "px;\n\n  background-color: " + radiogroup.button.backgroundColor + ";\n  border-radius: " + radiogroup.button.border.radius + "px;\n\n  font-size: " + radiogroup.font.size + "px;\n\n  " + (checked ? "\n          background-color: " + radiogroup.checked.backgroundColor + ";\n        " : "") + "\n";
+});
+var Text = styled.Text(function (_ref2) {
+  var _ref2$theme$yoga = _ref2.theme.yoga,
+      baseFont = _ref2$theme$yoga.baseFont,
+      radiogroup = _ref2$theme$yoga.components.radiogroup,
+      checked = _ref2.checked;
+  return "\n    font-family: " + baseFont.family + ";\n    color: " + radiogroup.font.color + ";\n\n    " + (checked ? "\n          color: " + radiogroup.checked.font.color + ";\n          font-weight: " + radiogroup.checked.font.weight + ";\n        " : '') + "\n    ";
+});
+/** Radio group allows user to select one option from a set of options. Use
+value on group to set the selected option. */
+
+var RadioGroupButton = /*#__PURE__*/React.forwardRef(function (_ref3, ref) {
+  var value = _ref3.value,
+      children = _ref3.children,
+      rest = _objectWithoutPropertiesLoose(_ref3, _excluded);
+
+  var _useContext = useContext(RadioGroupContext),
+      onChange = _useContext.onChange,
+      small = _useContext.small,
+      selectedValue = _useContext.selectedValue,
+      context = _objectWithoutPropertiesLoose(_useContext, _excluded2);
+
+  var inputValue = value || children;
+  var checked = inputValue === selectedValue;
+  return /*#__PURE__*/React.createElement(TouchableWithoutFeedback, _extends({
+    onPress: function onPress() {
+      onChange({
+        value: inputValue
+      });
+    }
+  }, context), /*#__PURE__*/React.createElement(RadioMark, _extends({
+    small: small,
+    checked: checked,
+    ref: ref
+  }, rest), /*#__PURE__*/React.createElement(Text, {
+    checked: checked
+  }, children)));
+});
+RadioGroupButton.displayName = 'RadioGroup.Button';
+RadioGroupButton.propTypes = {
+  value: oneOfType([string, number]),
+  children: node.isRequired
+};
+RadioGroupButton.defaultProps = {
+  value: ''
+};
+export default RadioGroupButton;

package/esm/RadioGroup/native/Button/RadioButton.test.js

@@ -0,0 +1,96 @@
+import React from 'react';
+import { render, fireEvent } from '@testing-library/react-native';
+import RadioGroup from '../..';
+import ThemeProvider from '../../../Theme';
+import RadioGroupContext from '../../RadioGroupContext';
+describe('<RadioGroup />', function () {
+  describe('<RadioGroup.Button />', function () {
+    describe('Snapshots', function () {
+      it('should match snapshot with default radio button', function () {
+        var _render = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(RadioGroup.Button, null, "Radio 1"))),
+            container = _render.container,
+            toJSON = _render.toJSON;
+
+        expect(toJSON(container)).toMatchSnapshot();
+      });
+      it('should match snapshot with small radio button', function () {
+        var _render2 = render( /*#__PURE__*/React.createElement(RadioGroupContext.Provider, {
+          value: {
+            small: true
+          }
+        }, /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(RadioGroup.Button, null, "Radio 1")))),
+            container = _render2.container,
+            toJSON = _render2.toJSON;
+
+        expect(toJSON(container)).toMatchSnapshot();
+      });
+    });
+    describe('Props', function () {
+      it('checked should be the selectedValue provided from Context', function () {
+        var _render3 = render( /*#__PURE__*/React.createElement(RadioGroupContext.Provider, {
+          value: {
+            selectedValue: 'Radio 2'
+          }
+        }, /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(RadioGroup.Button, null, "Radio 1"), /*#__PURE__*/React.createElement(RadioGroup.Button, null, "Radio 2")))),
+            getAllByText = _render3.getAllByText;
+
+        var _getAllByText = getAllByText(/^Radio/),
+            radio = _getAllByText[0],
+            radio2 = _getAllByText[1];
+
+        expect(radio.props.checked).toBe(false);
+        expect(radio2.props.checked).toBe(true);
+      });
+    });
+    describe('Events', function () {
+      it('should call onchange from Context', function () {
+        var onChangeMock = jest.fn();
+
+        var _render4 = render( /*#__PURE__*/React.createElement(RadioGroupContext.Provider, {
+          value: {
+            onChange: onChangeMock
+          }
+        }, /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(RadioGroup.Button, null, "Radio 1")))),
+            getByText = _render4.getByText;
+
+        var radio = getByText(/^Radio/);
+        fireEvent.press(radio);
+        expect(onChangeMock).toHaveBeenCalled();
+      });
+      it('value should be as prop value', function () {
+        var onChangeMock = jest.fn();
+
+        var _render5 = render( /*#__PURE__*/React.createElement(RadioGroupContext.Provider, {
+          value: {
+            onChange: onChangeMock
+          }
+        }, /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(RadioGroup.Button, {
+          value: "radio1"
+        }, "Radio 1")))),
+            getByText = _render5.getByText;
+
+        var radio = getByText(/^Radio/);
+        fireEvent.press(radio);
+        expect(onChangeMock).toHaveBeenCalledWith({
+          value: 'radio1'
+        });
+      });
+      it('value should be children if prop value is ommited', function () {
+        var onChangeMock = jest.fn();
+
+        var _render6 = render( /*#__PURE__*/React.createElement(RadioGroupContext.Provider, {
+          value: {
+            onChange: onChangeMock
+          }
+        }, /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(RadioGroup.Button, null, "Radio 1")))),
+            getByText = _render6.getByText;
+
+        var radio = getByText(/^Radio/);
+        fireEvent.press(radio);
+        expect(onChangeMock).toHaveBeenCalledWith({
+          value: 'Radio 1'
+        });
+      });
+    });
+  });
+});