@gympass/yoga 7.37.0 → 7.38.0

package/esm/RadioGroup/native/Radio/Radio.js

@@ -0,0 +1,88 @@
+var _excluded = ["value", "disabled"],
+    _excluded2 = ["onChange", "small", "selectedValue"];
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
+import React, { useContext, useState } from 'react';
+import styled from 'styled-components';
+import { string, oneOfType, number, bool } from 'prop-types';
+import { TouchableWithoutFeedback } from 'react-native';
+import { hexToRgb } from '@gympass/yoga-common';
+import RadioGroupContext from '../../RadioGroupContext';
+var RadioMark = styled.View(function (_ref) {
+  var _ref$theme$yoga = _ref.theme.yoga,
+      white = _ref$theme$yoga.colors.white,
+      radiogroup = _ref$theme$yoga.components.radiogroup,
+      checked = _ref.checked,
+      disabled = _ref.disabled,
+      pressed = _ref.pressed;
+  return "\n  justify-content: center;\n  align-items: center;\n  \n  height: " + radiogroup.radio.size + "px;\n  width: " + radiogroup.radio.size + "px;\n\n  background-color: " + (pressed ? hexToRgb(radiogroup.hover.backgroundColor, 0.75) : white) + ";\n\n  border-width: " + radiogroup.radio.size * 0.1 + "px;\n  border-style: solid;\n  border-color: " + radiogroup.radio.backgroundColor + ";\n  border-radius: " + radiogroup.radio.border.radius + "px;\n\n  " + (checked ? "\n          border-color: " + radiogroup.checked.backgroundColor + ";\n          background-color: " + (pressed ? hexToRgb(radiogroup.checked.hover.backgroundColor, 0.75) : white) + "\n        " : "") + "\n\n  " + (disabled ? "\n          border-color: " + radiogroup.disabled.backgroundColor + ";\n        " : "") + "\n";
+});
+var Dot = styled.View(function (_ref2) {
+  var radiogroup = _ref2.theme.yoga.components.radiogroup,
+      checked = _ref2.checked,
+      disabled = _ref2.disabled;
+  return "\n  height: " + radiogroup.radio.size * 0.5 + "px;\n  width: " + radiogroup.radio.size * 0.5 + "px;\n\n  background-color: " + radiogroup.radio.backgroundColor + ";\n  border-radius: " + radiogroup.radio.border.radius + "px;\n\n  " + (checked ? "\n          background-color: " + radiogroup.checked.backgroundColor + ";\n        " : "") + "\n\n  " + (disabled ? "\n          background-color: " + radiogroup.disabled.backgroundColor + ";\n        " : "") + "\n";
+});
+var Shadow = styled.View(function (_ref3) {
+  var checked = _ref3.checked,
+      radiogroup = _ref3.theme.yoga.components.radiogroup;
+  return "\n  position: absolute;\n  height: " + (radiogroup.radio.size + radiogroup.radio.size * 0.4 * 2) + "px;\n  width: " + (radiogroup.radio.size + radiogroup.radio.size * 0.4 * 2) + "px;\n\n  border-width: " + radiogroup.radio.size * 0.4 + "px;\n  border-style: solid;\n  border-color: " + (checked ? hexToRgb(radiogroup.checked.hover.backgroundColor, 0.75) : hexToRgb(radiogroup.hover.backgroundColor, 0.75)) + ";\n  border-radius: " + radiogroup.radio.border.radius + "px;\n\n  opacity: 0.75;\n";
+});
+/** The Radio is a type of selection control that allows the user to select a
+ * single option from a list.  */
+
+var RadioGroupRadio = /*#__PURE__*/React.forwardRef(function (_ref4, ref) {
+  var value = _ref4.value,
+      disabled = _ref4.disabled,
+      rest = _objectWithoutPropertiesLoose(_ref4, _excluded);
+
+  var _useContext = useContext(RadioGroupContext),
+      onChange = _useContext.onChange,
+      small = _useContext.small,
+      selectedValue = _useContext.selectedValue,
+      context = _objectWithoutPropertiesLoose(_useContext, _excluded2);
+
+  var _useState = useState(false),
+      pressing = _useState[0],
+      togglePressing = _useState[1];
+
+  var inputValue = value;
+  var checked = inputValue === selectedValue;
+  return /*#__PURE__*/React.createElement(TouchableWithoutFeedback, _extends({
+    onPressIn: function onPressIn() {
+      togglePressing(true);
+    },
+    onPress: function onPress() {
+      onChange({
+        value: inputValue
+      });
+    },
+    onPressOut: function onPressOut() {
+      togglePressing(false);
+    },
+    disabled: disabled
+  }, context), /*#__PURE__*/React.createElement(RadioMark, _extends({
+    checked: checked,
+    disabled: disabled,
+    pressed: pressing,
+    ref: ref
+  }, rest), checked && /*#__PURE__*/React.createElement(Dot, {
+    checked: checked,
+    disabled: disabled
+  }), pressing && /*#__PURE__*/React.createElement(Shadow, {
+    checked: checked
+  })));
+});
+RadioGroupRadio.displayName = 'RadioGroup.Radio';
+RadioGroupRadio.propTypes = {
+  disabled: bool,
+  value: oneOfType([string, number])
+};
+RadioGroupRadio.defaultProps = {
+  disabled: false,
+  value: ''
+};
+export default RadioGroupRadio;

package/esm/RadioGroup/native/Radio/Radio.test.js

@@ -0,0 +1,102 @@
+import React from 'react';
+import { render, fireEvent, toJSON } from '@testing-library/react-native';
+import RadioGroup from '../..';
+import ThemeProvider from '../../../Theme';
+import RadioGroupContext from '../../RadioGroupContext';
+describe('<RadioGroup />', function () {
+  describe('<RadioGroup.Radio />', function () {
+    describe('Snapshots', function () {
+      it('should match snapshot with default radio', function () {
+        var _render = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(RadioGroup.Radio, null))),
+            container = _render.container;
+
+        expect(toJSON(container)).toMatchSnapshot();
+      });
+      it('should match snapshot with disabled radio', function () {
+        var _render2 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(RadioGroup.Radio, {
+          disabled: true
+        }))),
+            container = _render2.container;
+
+        expect(toJSON(container)).toMatchSnapshot();
+      });
+      it('should match snapshot with default radio', function () {
+        var _render3 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(RadioGroup.Radio, null))),
+            container = _render3.container;
+
+        expect(toJSON(container)).toMatchSnapshot();
+      });
+      it('should match snapshot with default radio pressed', function () {
+        var _render4 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(RadioGroup.Radio, {
+          testID: "radio"
+        }))),
+            container = _render4.container,
+            getByTestId = _render4.getByTestId;
+
+        var radio = getByTestId(/^radio/);
+        fireEvent.pressIn(radio);
+        expect(toJSON(container)).toMatchSnapshot();
+      });
+    });
+    describe('Props', function () {
+      it('checked should be the selectedValue provided from Context', function () {
+        var _render5 = render( /*#__PURE__*/React.createElement(RadioGroupContext.Provider, {
+          value: {
+            selectedValue: 'Radio 2'
+          }
+        }, /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(RadioGroup.Radio, {
+          testID: "radio",
+          value: "Radio 1"
+        }), /*#__PURE__*/React.createElement(RadioGroup.Radio, {
+          testID: "radio",
+          value: "Radio 2"
+        })))),
+            getAllByTestId = _render5.getAllByTestId;
+
+        var _getAllByTestId = getAllByTestId(/^radio/),
+            radio = _getAllByTestId[0],
+            radio2 = _getAllByTestId[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 _render6 = render( /*#__PURE__*/React.createElement(RadioGroupContext.Provider, {
+          value: {
+            onChange: onChangeMock
+          }
+        }, /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(RadioGroup.Radio, {
+          testID: "radio"
+        })))),
+            getByTestId = _render6.getByTestId;
+
+        var radio = getByTestId(/^radio/);
+        fireEvent.press(radio);
+        expect(onChangeMock).toHaveBeenCalled();
+      });
+      it('value should be as prop value', function () {
+        var onChangeMock = jest.fn();
+
+        var _render7 = render( /*#__PURE__*/React.createElement(RadioGroupContext.Provider, {
+          value: {
+            onChange: onChangeMock
+          }
+        }, /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(RadioGroup.Radio, {
+          value: "radio1",
+          testID: "radio"
+        })))),
+            getByTestId = _render7.getByTestId;
+
+        var radio = getByTestId(/^radio/);
+        fireEvent.press(radio);
+        expect(onChangeMock).toHaveBeenCalledWith({
+          value: 'radio1'
+        });
+      });
+    });
+  });
+});

package/esm/RadioGroup/native/RadioGroup.js

@@ -0,0 +1,66 @@
+var _excluded = ["onChange", "selectedValue", "small", "children"];
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
+import React, { useState } from 'react';
+import { View } from 'react-native';
+import { string, func, oneOfType, number, bool, node } from 'prop-types';
+import styled from 'styled-components';
+import RadioGroupContext from '../RadioGroupContext';
+import RadioButton from './Button/RadioButton';
+var Group = styled.View(function () {
+  return "\n    align-self: center;\n    position: relative;\n    flex-direction: row;\n  ";
+});
+var GrayLine = styled.View(function (_ref) {
+  var radiogroup = _ref.theme.yoga.components.radiogroup;
+  return "\n    position: absolute;\n    height: 100%;\n    border-radius: " + radiogroup.button.border.radius + "px;\n    border-width: " + radiogroup.button.border.width + "px;\n    border-color: " + radiogroup.button.border.color + ";\n  ";
+});
+
+var RadioGroup = function RadioGroup(_ref2) {
+  var onChange = _ref2.onChange,
+      selectedValue = _ref2.selectedValue,
+      small = _ref2.small,
+      children = _ref2.children,
+      rest = _objectWithoutPropertiesLoose(_ref2, _excluded);
+
+  var _useState = useState(0),
+      groupSize = _useState[0],
+      setGroupSize = _useState[1];
+
+  var isButton = React.Children.map(children, function (child) {
+    return child.type;
+  }).every(function (child) {
+    return child === RadioButton;
+  });
+  return /*#__PURE__*/React.createElement(RadioGroupContext.Provider, {
+    value: _extends({
+      selectedValue: selectedValue,
+      onChange: onChange,
+      small: small
+    }, rest)
+  }, /*#__PURE__*/React.createElement(View, null, /*#__PURE__*/React.createElement(Group, _extends({}, rest, {
+    onLayout: function onLayout(_ref3) {
+      var width = _ref3.nativeEvent.layout.width;
+      return setGroupSize(width);
+    }
+  }), Boolean(isButton && groupSize) && /*#__PURE__*/React.createElement(GrayLine, {
+    style: {
+      width: groupSize
+    }
+  }), children)));
+};
+
+RadioGroup.propTypes = {
+  onChange: func,
+  selectedValue: oneOfType([string, number]),
+  small: bool,
+  children: node.isRequired
+};
+RadioGroup.defaultProps = {
+  onChange: function onChange() {},
+  selectedValue: '',
+  small: false
+};
+export default RadioGroup;

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

@@ -0,0 +1,48 @@
+import React from 'react';
+import { render, fireEvent, toJSON } from '@testing-library/react-native';
+import RadioGroup from '..';
+import ThemeProvider from '../../Theme';
+describe('<RadioGroup />', function () {
+  describe('Snapshots', function () {
+    it('should match snapshot with radio button as children', function () {
+      var _render = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(RadioGroup, null, /*#__PURE__*/React.createElement(RadioGroup.Button, null, "Option 1"), /*#__PURE__*/React.createElement(RadioGroup.Button, null, "Option 2"), /*#__PURE__*/React.createElement(RadioGroup.Button, null, "Option 3")))),
+          container = _render.container,
+          getAllByText = _render.getAllByText;
+
+      expect(toJSON(container)).toMatchSnapshot();
+      expect(getAllByText(/^Option/)).toHaveLength(3);
+    });
+    it('should match snapshot with small radios', function () {
+      var _render2 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(RadioGroup, {
+        small: true
+      }, /*#__PURE__*/React.createElement(RadioGroup.Button, null, "Option 1"), /*#__PURE__*/React.createElement(RadioGroup.Button, null, "Option 2"), /*#__PURE__*/React.createElement(RadioGroup.Button, null, "Option 3")))),
+          container = _render2.container;
+
+      expect(toJSON(container)).toMatchSnapshot();
+    });
+    it('should has setted the selected value', function () {
+      var _render3 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(RadioGroup, {
+        selectedValue: "Option 2"
+      }, /*#__PURE__*/React.createElement(RadioGroup.Button, null, "Option 1"), /*#__PURE__*/React.createElement(RadioGroup.Button, null, "Option 2"), /*#__PURE__*/React.createElement(RadioGroup.Button, null, "Option 3")))),
+          container = _render3.container,
+          getByText = _render3.getByText;
+
+      expect(container).toMatchSnapshot();
+      expect(getByText('Option 2').props.checked).toBe(true);
+    });
+  });
+});
+describe('Events', function () {
+  it('should set the onchange for its children', function () {
+    var onChangeMock = jest.fn();
+
+    var _render4 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(RadioGroup, {
+      onChange: onChangeMock
+    }, /*#__PURE__*/React.createElement(RadioGroup.Button, null, "Option 1"), /*#__PURE__*/React.createElement(RadioGroup.Button, null, "Option 2"), /*#__PURE__*/React.createElement(RadioGroup.Button, null, "Option 3")))),
+        getByText = _render4.getByText;
+
+    var firstOption = getByText('Option 1');
+    fireEvent.press(firstOption);
+    expect(onChangeMock).toHaveBeenCalled();
+  });
+});

package/esm/RadioGroup/native/index.js

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

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

@@ -0,0 +1,121 @@
+/* eslint-disable no-console */
+import React from 'react';
+import { render, fireEvent } from '@testing-library/react';
+import RadioGroup from '../..';
+import ThemeProvider from '../../../Theme';
+import RadioGroupContext from '../../RadioGroupContext';
+var originalError = console.error;
+beforeEach(function () {
+  console.error = jest.fn();
+});
+afterEach(function () {
+  console.error = originalError;
+});
+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;
+
+        expect(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;
+
+        expect(container).toMatchSnapshot();
+      });
+    });
+    describe('Props', function () {
+      it('should contains input type radio', function () {
+        var _render3 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(RadioGroup.Button, {
+          "data-testid": "radio"
+        }, "Radio 1"))),
+            getByTestId = _render3.getByTestId;
+
+        expect(getByTestId('radio').type).toBe('radio');
+      });
+      it('value should be as prop value', function () {
+        var _render4 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(RadioGroup.Button, {
+          "data-testid": "radio",
+          value: "radio1"
+        }, "Radio 1"))),
+            getByTestId = _render4.getByTestId;
+
+        expect(getByTestId('radio').value).toBe('radio1');
+      });
+      it('value should be children if prop value is ommited', function () {
+        var _render5 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(RadioGroup.Button, {
+          "data-testid": "radio"
+        }, "Radio 1"))),
+            getByTestId = _render5.getByTestId,
+            getByText = _render5.getByText;
+
+        var label = getByText('Radio 1');
+        var radio = getByTestId('radio');
+        expect(radio.value).toBe(label.textContent);
+      });
+      it('checked should be the selectedValue provided from Context', function () {
+        var _render6 = render( /*#__PURE__*/React.createElement(RadioGroupContext.Provider, {
+          value: {
+            selectedValue: 'Radio 2'
+          }
+        }, /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(RadioGroup.Button, {
+          "data-testid": "radio"
+        }, "Radio 1"), /*#__PURE__*/React.createElement(RadioGroup.Button, {
+          "data-testid": "radio"
+        }, "Radio 2")))),
+            getAllByTestId = _render6.getAllByTestId;
+
+        var _getAllByTestId = getAllByTestId('radio'),
+            radio = _getAllByTestId[0],
+            radio2 = _getAllByTestId[1];
+
+        expect(radio.checked).toBe(false);
+        expect(radio2.checked).toBe(true);
+      });
+      it('name should the one provided by context', function () {
+        var name = 'test';
+
+        var _render7 = render( /*#__PURE__*/React.createElement(RadioGroupContext.Provider, {
+          value: {
+            name: name
+          }
+        }, /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(RadioGroup.Button, {
+          "data-testid": "radio"
+        }, "Radio 1"), /*#__PURE__*/React.createElement(RadioGroup.Button, {
+          "data-testid": "radio"
+        }, "Radio 2"), /*#__PURE__*/React.createElement(RadioGroup.Button, {
+          "data-testid": "radio"
+        }, "Radio 3")))),
+            getAllByTestId = _render7.getAllByTestId;
+
+        var radios = getAllByTestId('radio');
+        radios.map(function (radio) {
+          return expect(radio.name).toBe(name);
+        });
+      });
+    });
+    describe('Events', function () {
+      it('should call onchange from Context', function () {
+        var onChangeMock = jest.fn();
+
+        var _render8 = render( /*#__PURE__*/React.createElement(RadioGroupContext.Provider, {
+          value: {
+            onChange: onChangeMock
+          }
+        }, /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(RadioGroup.Button, null, "Radio 1")))),
+            getByText = _render8.getByText;
+
+        var radio = getByText('Radio 1');
+        fireEvent.click(radio);
+        expect(onChangeMock).toHaveBeenCalled();
+      });
+    });
+  });
+});

package/esm/RadioGroup/web/Radio/Radio.test.js

@@ -0,0 +1,108 @@
+/* eslint-disable no-console */
+import React from 'react';
+import { render, fireEvent } from '@testing-library/react';
+import RadioGroup from '../..';
+import ThemeProvider from '../../../Theme';
+import RadioGroupContext from '../../RadioGroupContext';
+var originalError = console.error;
+beforeEach(function () {
+  console.error = jest.fn();
+});
+afterEach(function () {
+  console.error = originalError;
+});
+describe('<RadioGroup />', function () {
+  describe('<RadioGroup.Radio />', function () {
+    describe('Snapshots', function () {
+      it('should match snapshot with default radio', function () {
+        var _render = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(RadioGroup.Radio, null))),
+            container = _render.container;
+
+        expect(container).toMatchSnapshot();
+      });
+    });
+    describe('Props', function () {
+      it('should contains input type radio', function () {
+        var _render2 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(RadioGroup.Radio, {
+          "data-testid": "radio"
+        }))),
+            getByTestId = _render2.getByTestId;
+
+        expect(getByTestId('radio').type).toBe('radio');
+      });
+      it('value should be as prop value', function () {
+        var _render3 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(RadioGroup.Radio, {
+          "data-testid": "radio",
+          value: "radio1"
+        }))),
+            getByTestId = _render3.getByTestId;
+
+        expect(getByTestId('radio').value).toBe('radio1');
+      });
+      it('checked should be the selectedValue provided from Context', function () {
+        var _render4 = render( /*#__PURE__*/React.createElement(RadioGroupContext.Provider, {
+          value: {
+            selectedValue: 'Radio 2'
+          }
+        }, /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(RadioGroup.Radio, {
+          "data-testid": "radio",
+          value: "Radio 1"
+        }), /*#__PURE__*/React.createElement(RadioGroup.Radio, {
+          "data-testid": "radio",
+          value: "Radio 2"
+        })))),
+            getAllByTestId = _render4.getAllByTestId;
+
+        var _getAllByTestId = getAllByTestId('radio'),
+            radio = _getAllByTestId[0],
+            radio2 = _getAllByTestId[1];
+
+        expect(radio.checked).toBe(false);
+        expect(radio2.checked).toBe(true);
+      });
+      it('name should be the one provided by context', function () {
+        var name = 'test';
+
+        var _render5 = render( /*#__PURE__*/React.createElement(RadioGroupContext.Provider, {
+          value: {
+            name: name
+          }
+        }, /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(RadioGroup.Radio, {
+          "data-testid": "radio",
+          value: "Radio 1"
+        }), /*#__PURE__*/React.createElement(RadioGroup.Radio, {
+          "data-testid": "radio",
+          value: "Radio 2"
+        }), /*#__PURE__*/React.createElement(RadioGroup.Radio, {
+          "data-testid": "radio",
+          value: "Radio 3"
+        })))),
+            getAllByTestId = _render5.getAllByTestId;
+
+        var radios = getAllByTestId('radio');
+        radios.map(function (radio) {
+          return expect(radio.name).toBe(name);
+        });
+      });
+    });
+    describe('Events', function () {
+      it('should call onchange from Context', 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.Radio, {
+          "data-testid": "radio",
+          value: "Radio 1"
+        })))),
+            getByTestId = _render6.getByTestId;
+
+        var radio = getByTestId('radio');
+        fireEvent.click(radio);
+        expect(onChangeMock).toHaveBeenCalled();
+      });
+    });
+  });
+});

package/esm/RadioGroup/web/RadioGroup.test.js

@@ -0,0 +1,83 @@
+import React from 'react';
+import { render, fireEvent } from '@testing-library/react';
+import RadioGroup from '..';
+import ThemeProvider from '../../Theme';
+describe('<RadioGroup />', function () {
+  describe('Snapshots', function () {
+    it('should match snapshot with default radiogroup', function () {
+      var _render = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(RadioGroup, null))),
+          container = _render.container;
+
+      expect(container).toMatchSnapshot();
+    });
+    it('should match snapshot with full radiogroup', function () {
+      var _render2 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(RadioGroup, {
+        full: true
+      }))),
+          container = _render2.container;
+
+      expect(container).toMatchSnapshot();
+    });
+    it('should match snapshot with radios as children', function () {
+      var _render3 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(RadioGroup, null, /*#__PURE__*/React.createElement(RadioGroup.Button, null, "Option 1"), /*#__PURE__*/React.createElement(RadioGroup.Button, null, "Option 2"), /*#__PURE__*/React.createElement(RadioGroup.Button, null, "Option 3")))),
+          container = _render3.container,
+          getAllByText = _render3.getAllByText;
+
+      expect(container).toMatchSnapshot();
+      expect(getAllByText(/^Option/)).toHaveLength(3);
+    });
+    it('should match snapshot with small radios', function () {
+      var _render4 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(RadioGroup, {
+        small: true
+      }, /*#__PURE__*/React.createElement(RadioGroup.Button, null, "Option 1"), /*#__PURE__*/React.createElement(RadioGroup.Button, null, "Option 2"), /*#__PURE__*/React.createElement(RadioGroup.Button, null, "Option 3")))),
+          container = _render4.container;
+
+      expect(container).toMatchSnapshot();
+    });
+    it('should has setted the selected value', function () {
+      var _render5 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(RadioGroup, {
+        selectedValue: "Option 2"
+      }, /*#__PURE__*/React.createElement(RadioGroup.Button, null, "Option 1"), /*#__PURE__*/React.createElement(RadioGroup.Button, null, "Option 2"), /*#__PURE__*/React.createElement(RadioGroup.Button, null, "Option 3")))),
+          container = _render5.container,
+          getByText = _render5.getByText;
+
+      expect(container).toMatchSnapshot();
+      expect(getByText('Option 2').checked).toBe(true);
+    });
+    it('should set the name for all children', function () {
+      var groupName = 'test';
+
+      var _render6 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(RadioGroup, {
+        name: groupName
+      }, /*#__PURE__*/React.createElement(RadioGroup.Button, {
+        "data-testid": "Option 1"
+      }, "Option 1"), /*#__PURE__*/React.createElement(RadioGroup.Button, {
+        "data-testid": "Option 2"
+      }, "Option 2"), /*#__PURE__*/React.createElement(RadioGroup.Button, {
+        "data-testid": "Option 3"
+      }, "Option 3")))),
+          container = _render6.container,
+          getAllByTestId = _render6.getAllByTestId;
+
+      expect(container).toMatchSnapshot(); // use testid to get the input[type=radio] instead of label
+
+      getAllByTestId(/^Option/).map(function (radio) {
+        return expect(radio.name).toBe(groupName);
+      });
+    });
+  });
+});
+describe('Events', function () {
+  it('should set the onchange for its children', function () {
+    var onChangeMock = jest.fn();
+
+    var _render7 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(RadioGroup, {
+      onChange: onChangeMock
+    }, /*#__PURE__*/React.createElement(RadioGroup.Button, null, "Option 1"), /*#__PURE__*/React.createElement(RadioGroup.Button, null, "Option 2"), /*#__PURE__*/React.createElement(RadioGroup.Button, null, "Option 3")))),
+        getByText = _render7.getByText;
+
+    var firstOption = getByText('Option 1');
+    fireEvent.click(firstOption);
+    expect(onChangeMock).toHaveBeenCalled();
+  });
+});

package/esm/Rating/index.native.js

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