@gympass/yoga 7.87.0 → 7.88.0

package/cjs/RadioGroup/native/RadioGroup.js

@@ -1 +1,135 @@
-var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports["default"]=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _propTypes=require("prop-types");var _styledComponents=_interopRequireDefault(require("styled-components"));var _RadioGroupContext=_interopRequireDefault(require("../RadioGroupContext"));var _RadioButton=_interopRequireDefault(require("./Button/RadioButton"));var _excluded=["onChange","selectedValue","small","children"];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;}var Group=_styledComponents["default"].View(function(){return"\n    align-self: center;\n    position: relative;\n    flex-direction: row;\n  ";});var GrayLine=_styledComponents["default"].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=(0,_objectWithoutProperties2["default"])(_ref2,_excluded);var _useState=(0,_react.useState)(0),_useState2=(0,_slicedToArray2["default"])(_useState,2),groupSize=_useState2[0],setGroupSize=_useState2[1];var isButton=_react["default"].Children.map(children,function(child){return child.type;}).every(function(child){return child===_RadioButton["default"];});return _react["default"].createElement(_RadioGroupContext["default"].Provider,{value:(0,_extends2["default"])({selectedValue:selectedValue,onChange:onChange,small:small},rest)},_react["default"].createElement(_reactNative.View,null,_react["default"].createElement(Group,(0,_extends2["default"])({},rest,{onLayout:function onLayout(_ref3){var width=_ref3.nativeEvent.layout.width;return setGroupSize(width);}}),Boolean(isButton&&groupSize)&&_react["default"].createElement(GrayLine,{style:{width:groupSize}}),children)));};RadioGroup.propTypes={onChange:_propTypes.func,selectedValue:(0,_propTypes.oneOfType)([_propTypes.string,_propTypes.number]),small:_propTypes.bool,children:_propTypes.node.isRequired};RadioGroup.defaultProps={onChange:function onChange(){},selectedValue:'',small:false};var _default=RadioGroup;exports["default"]=_default;
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __getProtoOf = Object.getPrototypeOf;
+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;
+};
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var RadioGroup_exports = {};
+__export(RadioGroup_exports, {
+  default: () => RadioGroup_default
+});
+module.exports = __toCommonJS(RadioGroup_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_react = __toESM(require("react"));
+var import_react_native = require("react-native");
+var import_prop_types = require("prop-types");
+var import_styled_components = __toESM(require("styled-components"));
+var import_RadioGroupContext = __toESM(require("../RadioGroupContext"));
+var import_RadioButton = __toESM(require("./Button/RadioButton"));
+const Group = import_styled_components.default.View(
+  () => `
+    align-self: center;
+    position: relative;
+    flex-direction: row;
+  `
+);
+const GrayLine = import_styled_components.default.View(
+  ({
+    theme: {
+      yoga: {
+        components: { radiogroup }
+      }
+    }
+  }) => `
+    position: absolute;
+    height: 100%;
+    border-radius: ${radiogroup.button.border.radius}px;
+    border-width: ${radiogroup.button.border.width}px;
+    border-color: ${radiogroup.button.border.color};
+  `
+);
+const RadioGroup = (_a) => {
+  var _b = _a, { onChange, selectedValue, small, children } = _b, rest = __objRest(_b, ["onChange", "selectedValue", "small", "children"]);
+  const [groupSize, setGroupSize] = (0, import_react.useState)(0);
+  const isButton = import_react.default.Children.map(children, (child) => child.type).every(
+    (child) => child === import_RadioButton.default
+  );
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_RadioGroupContext.default.Provider,
+    {
+      value: __spreadValues({
+        selectedValue,
+        onChange,
+        small
+      }, rest),
+      children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native.View, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+        Group,
+        __spreadProps(__spreadValues({}, rest), {
+          onLayout: ({
+            nativeEvent: {
+              layout: { width }
+            }
+          }) => setGroupSize(width),
+          children: [
+            Boolean(isButton && groupSize) && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(GrayLine, { style: { width: groupSize } }),
+            children
+          ]
+        })
+      ) })
+    }
+  );
+};
+RadioGroup.propTypes = {
+  onChange: import_prop_types.func,
+  selectedValue: (0, import_prop_types.oneOfType)([import_prop_types.string, import_prop_types.number]),
+  small: import_prop_types.bool,
+  children: import_prop_types.node.isRequired
+};
+RadioGroup.defaultProps = {
+  onChange: () => {
+  },
+  selectedValue: "",
+  small: false
+};
+var RadioGroup_default = RadioGroup;

package/cjs/RadioGroup/native/RadioGroup.test.js

@@ -0,0 +1,79 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_react = __toESM(require("react"));
+var import_react_native = require("@testing-library/react-native");
+var import__ = __toESM(require(".."));
+var import_Theme = __toESM(require("../../Theme"));
+describe("<RadioGroup />", () => {
+  describe("Snapshots", () => {
+    it("should match snapshot with radio button as children", () => {
+      const { root, getAllByText, toJSON } = (0, import_react_native.render)(
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Theme.default, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import__.default, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import__.default.Button, { children: "Option 1" }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import__.default.Button, { children: "Option 2" }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import__.default.Button, { children: "Option 3" })
+        ] }) })
+      );
+      expect(toJSON(root)).toMatchSnapshot();
+      expect(getAllByText(/^Option/)).toHaveLength(3);
+    });
+    it("should match snapshot with small radios", () => {
+      const { root, toJSON } = (0, import_react_native.render)(
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Theme.default, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import__.default, { small: true, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import__.default.Button, { children: "Option 1" }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import__.default.Button, { children: "Option 2" }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import__.default.Button, { children: "Option 3" })
+        ] }) })
+      );
+      expect(toJSON(root)).toMatchSnapshot();
+    });
+    it("should has setted the selected value", () => {
+      const { toJSON, getByText } = (0, import_react_native.render)(
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Theme.default, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import__.default, { selectedValue: "Option 2", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import__.default.Button, { children: "Option 1" }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import__.default.Button, { children: "Option 2" }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import__.default.Button, { children: "Option 3" })
+        ] }) })
+      );
+      expect(toJSON()).toMatchSnapshot();
+      expect(getByText("Option 2").props.checked).toBe(true);
+    });
+  });
+});
+describe("Events", () => {
+  it("should set the onchange for its children", () => {
+    const onChangeMock = jest.fn();
+    const { getByText } = (0, import_react_native.render)(
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Theme.default, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import__.default, { onChange: onChangeMock, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import__.default.Button, { children: "Option 1" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import__.default.Button, { children: "Option 2" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import__.default.Button, { children: "Option 3" })
+      ] }) })
+    );
+    const firstOption = getByText("Option 1");
+    import_react_native.fireEvent.press(firstOption);
+    expect(onChangeMock).toHaveBeenCalled();
+  });
+});

package/cjs/RadioGroup/native/index.js

@@ -1 +1,44 @@
-var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});Object.defineProperty(exports,"Radio",{enumerable:true,get:function get(){return _Radio["default"];}});Object.defineProperty(exports,"RadioButton",{enumerable:true,get:function get(){return _RadioButton["default"];}});Object.defineProperty(exports,"RadioGroup",{enumerable:true,get:function get(){return _RadioGroup["default"];}});var _RadioGroup=_interopRequireDefault(require("./RadioGroup"));var _RadioButton=_interopRequireDefault(require("./Button/RadioButton"));var _Radio=_interopRequireDefault(require("./Radio/Radio"));
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var native_exports = {};
+__export(native_exports, {
+  Radio: () => import_Radio.default,
+  RadioButton: () => import_RadioButton.default,
+  RadioGroup: () => import_RadioGroup.default
+});
+module.exports = __toCommonJS(native_exports);
+var import_RadioGroup = __toESM(require("./RadioGroup"));
+var import_RadioButton = __toESM(require("./Button/RadioButton"));
+var import_Radio = __toESM(require("./Radio/Radio"));
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Radio,
+  RadioButton,
+  RadioGroup
+});

package/cjs/RadioGroup/web/Button/RadioButton.js

@@ -1,84 +1,181 @@
 "use strict";
-
-exports.__esModule = true;
-exports["default"] = void 0;
-
-var _react = _interopRequireWildcard(require("react"));
-
-var _propTypes = require("prop-types");
-
-var _styledComponents = _interopRequireDefault(require("styled-components"));
-
-var _RadioGroupContext = _interopRequireDefault(require("../../RadioGroupContext"));
-
-var _shared = require("../../../shared");
-
-var _excluded = ["children", "value"],
-    _excluded2 = ["name", "onChange", "small", "selectedValue"];
-
-var _templateObject, _templateObject2;
-
-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; }
-
-function _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.slice(0); } strings.raw = raw; return strings; }
-
-var Button = _styledComponents["default"].label(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n  position: relative;\n  display: flex;\n  flex: 1;\n  align-items: center;\n  justify-content: center;\n\n  min-width: 126px;\n  white-space: nowrap;\n\n  cursor: pointer;\n\n  ", "\n"])), function (_ref) {
-  var radiogroup = _ref.theme.yoga.components.radiogroup,
-      small = _ref.small,
-      checked = _ref.checked;
-  return "\n    box-sizing: border-box;\n    background-color: " + radiogroup.button.backgroundColor + ";\n    border-radius: " + radiogroup.button.border.radius + "px;\n\n    " + (checked ? "\n            background-color: " + radiogroup.checked.backgroundColor + ";\n            box-shadow: 0 0 0  " + radiogroup.button.border.width + "px " + radiogroup.checked.backgroundColor + ";\n            color: " + radiogroup.checked.font.color + ";\n            font-weight: " + radiogroup.checked.font.weight + ";\n            z-index: 1;\n          " : "\n          &:hover, &:focus {\n            background-color: " + radiogroup.hover.backgroundColor + ";\n          }\n        ") + "\n\n    font-size: " + radiogroup.font.size + "px;\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  ";
-});
-
-var ButtonWrapper = _styledComponents["default"].div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n  border-style: solid;\n\n  ", "\n"])), function (_ref2) {
-  var radiogroup = _ref2.theme.yoga.components.radiogroup;
-  return "\n    border-color: " + radiogroup.button.border.color + ";\n    border-top-width: " + radiogroup.button.border.width + "px;\n    border-bottom-width: " + radiogroup.button.border.width + "px;\n    \n    border-left: none;\n    border-right: none;\n    \n    &:first-child {\n      border-right-width: 0;\n      border-left-width: " + radiogroup.button.border.width + "px;\n      border-left-style: solid;\n      border-left-color: " + radiogroup.button.border.color + ";\n\n      border-top-left-radius: " + radiogroup.button.border.radius + "px;\n      border-bottom-left-radius: " + radiogroup.button.border.radius + "px;\n    }\n  \n    &:last-child {\n      border-left-width: 0;\n\n      border-right-width: " + radiogroup.button.border.width + "px;\n      border-right-style: solid;\n      border-right-color: " + radiogroup.button.border.color + ";\n\n      border-top-right-radius: " + radiogroup.button.border.radius + "px;\n      border-bottom-right-radius: " + radiogroup.button.border.radius + "px;\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["default"].forwardRef(function (_ref3, ref) {
-  var children = _ref3.children,
-      value = _ref3.value,
-      rest = _objectWithoutPropertiesLoose(_ref3, _excluded);
-
-  var _useContext = (0, _react.useContext)(_RadioGroupContext["default"]),
-      name = _useContext.name,
-      onChange = _useContext.onChange,
-      small = _useContext.small,
-      selectedValue = _useContext.selectedValue,
-      context = _objectWithoutPropertiesLoose(_useContext, _excluded2);
-
-  var inputValue = value || children;
-  var checked = inputValue === selectedValue;
-  return /*#__PURE__*/_react["default"].createElement(ButtonWrapper, null, /*#__PURE__*/_react["default"].createElement(Button, {
-    small: small,
-    checked: checked
-  }, /*#__PURE__*/_react["default"].createElement(_shared.HiddenInput, _extends({
-    type: "radio",
-    value: inputValue,
-    checked: checked,
-    name: name,
-    onChange: onChange,
-    ref: ref
-  }, rest, context)), children));
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __getProtoOf = Object.getPrototypeOf;
+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;
+};
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var RadioButton_exports = {};
+__export(RadioButton_exports, {
+  default: () => RadioButton_default
 });
-
-RadioGroupButton.displayName = 'RadioGroup.Button';
+module.exports = __toCommonJS(RadioButton_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_react = __toESM(require("react"));
+var import_prop_types = require("prop-types");
+var import_styled_components = __toESM(require("styled-components"));
+var import_RadioGroupContext = __toESM(require("../../RadioGroupContext"));
+var import_shared = require("../../../shared");
+const Button = import_styled_components.default.label`
+  position: relative;
+  display: flex;
+  flex: 1;
+  align-items: center;
+  justify-content: center;
+
+  min-width: 126px;
+  white-space: nowrap;
+
+  cursor: pointer;
+
+  ${({
+  theme: {
+    yoga: {
+      components: { radiogroup }
+    }
+  },
+  small,
+  checked
+}) => `
+    box-sizing: border-box;
+    background-color: ${radiogroup.button.backgroundColor};
+    border-radius: ${radiogroup.button.border.radius}px;
+
+    ${checked ? `
+            background-color: ${radiogroup.checked.backgroundColor};
+            box-shadow: 0 0 0  ${radiogroup.button.border.width}px ${radiogroup.checked.backgroundColor};
+            color: ${radiogroup.checked.font.color};
+            font-weight: ${radiogroup.checked.font.weight};
+            z-index: 1;
+          ` : `
+          &:hover, &:focus {
+            background-color: ${radiogroup.hover.backgroundColor};
+          }
+        `}
+
+    font-size: ${radiogroup.font.size}px;
+    height: ${small ? radiogroup.button.height.small : radiogroup.button.height.normal}px;
+    padding-left: ${radiogroup.button.padding.left}px;
+    padding-right: ${radiogroup.button.padding.right}px;
+  `}
+`;
+const ButtonWrapper = import_styled_components.default.div`
+  border-style: solid;
+
+  ${({
+  theme: {
+    yoga: {
+      components: { radiogroup }
+    }
+  }
+}) => `
+    border-color: ${radiogroup.button.border.color};
+    border-top-width: ${radiogroup.button.border.width}px;
+    border-bottom-width: ${radiogroup.button.border.width}px;
+    
+    border-left: none;
+    border-right: none;
+    
+    &:first-child {
+      border-right-width: 0;
+      border-left-width: ${radiogroup.button.border.width}px;
+      border-left-style: solid;
+      border-left-color: ${radiogroup.button.border.color};
+
+      border-top-left-radius: ${radiogroup.button.border.radius}px;
+      border-bottom-left-radius: ${radiogroup.button.border.radius}px;
+    }
+  
+    &:last-child {
+      border-left-width: 0;
+
+      border-right-width: ${radiogroup.button.border.width}px;
+      border-right-style: solid;
+      border-right-color: ${radiogroup.button.border.color};
+
+      border-top-right-radius: ${radiogroup.button.border.radius}px;
+      border-bottom-right-radius: ${radiogroup.button.border.radius}px;
+    }
+  `}
+`;
+const RadioGroupButton = import_react.default.forwardRef(
+  (_a, ref) => {
+    var _b = _a, { children, value } = _b, rest = __objRest(_b, ["children", "value"]);
+    const _a2 = (0, import_react.useContext)(import_RadioGroupContext.default), { name, onChange, small, selectedValue } = _a2, context = __objRest(_a2, ["name", "onChange", "small", "selectedValue"]);
+    const inputValue = value || children;
+    const checked = inputValue === selectedValue;
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ButtonWrapper, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Button, __spreadProps(__spreadValues({}, { small, checked }), { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_shared.HiddenInput,
+        __spreadValues(__spreadValues({
+          type: "radio",
+          value: inputValue,
+          checked,
+          name,
+          onChange,
+          ref
+        }, rest), context)
+      ),
+      children
+    ] })) });
+  }
+);
+RadioGroupButton.displayName = "RadioGroup.Button";
 RadioGroupButton.propTypes = {
-  children: (0, _propTypes.oneOfType)([_propTypes.string, _propTypes.number]).isRequired,
-  value: (0, _propTypes.oneOfType)([_propTypes.string, _propTypes.number])
+  children: (0, import_prop_types.oneOfType)([import_prop_types.string, import_prop_types.number]).isRequired,
+  value: (0, import_prop_types.oneOfType)([import_prop_types.string, import_prop_types.number])
 };
 RadioGroupButton.defaultProps = {
-  value: ''
+  value: ""
 };
-var _default = RadioGroupButton;
-exports["default"] = _default;
+var RadioButton_default = RadioGroupButton;

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

@@ -0,0 +1,110 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_react = __toESM(require("react"));
+var import_react2 = require("@testing-library/react");
+var import__ = __toESM(require("../.."));
+var import_Theme = __toESM(require("../../../Theme"));
+var import_RadioGroupContext = __toESM(require("../../RadioGroupContext"));
+const originalError = console.error;
+beforeEach(() => {
+  console.error = jest.fn();
+});
+afterEach(() => {
+  console.error = originalError;
+});
+describe("<RadioGroup />", () => {
+  describe("<RadioGroup.Button />", () => {
+    describe("Snapshots", () => {
+      it("should match snapshot with default radio button", () => {
+        const { container } = (0, import_react2.render)(
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Theme.default, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import__.default.Button, { children: "Radio 1" }) })
+        );
+        expect(container).toMatchSnapshot();
+      });
+      it("should match snapshot with small radio button", () => {
+        const { container } = (0, import_react2.render)(
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_RadioGroupContext.default.Provider, { value: { small: true }, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Theme.default, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import__.default.Button, { children: "Radio 1" }) }) })
+        );
+        expect(container).toMatchSnapshot();
+      });
+    });
+    describe("Props", () => {
+      it("should contains input type radio", () => {
+        const { getByTestId } = (0, import_react2.render)(
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Theme.default, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import__.default.Button, { "data-testid": "radio", children: "Radio 1" }) })
+        );
+        expect(getByTestId("radio").type).toBe("radio");
+      });
+      it("value should be as prop value", () => {
+        const { getByTestId } = (0, import_react2.render)(
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Theme.default, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import__.default.Button, { "data-testid": "radio", value: "radio1", children: "Radio 1" }) })
+        );
+        expect(getByTestId("radio").value).toBe("radio1");
+      });
+      it("value should be children if prop value is ommited", () => {
+        const { getByTestId, getByText } = (0, import_react2.render)(
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Theme.default, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import__.default.Button, { "data-testid": "radio", children: "Radio 1" }) })
+        );
+        const label = getByText("Radio 1");
+        const radio = getByTestId("radio");
+        expect(radio.value).toBe(label.textContent);
+      });
+      it("checked should be the selectedValue provided from Context", () => {
+        const { getAllByTestId } = (0, import_react2.render)(
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_RadioGroupContext.default.Provider, { value: { selectedValue: "Radio 2" }, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_Theme.default, { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import__.default.Button, { "data-testid": "radio", children: "Radio 1" }),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import__.default.Button, { "data-testid": "radio", children: "Radio 2" })
+          ] }) })
+        );
+        const [radio, radio2] = getAllByTestId("radio");
+        expect(radio.checked).toBe(false);
+        expect(radio2.checked).toBe(true);
+      });
+      it("name should the one provided by context", () => {
+        const name = "test";
+        const { getAllByTestId } = (0, import_react2.render)(
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_RadioGroupContext.default.Provider, { value: { name }, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_Theme.default, { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import__.default.Button, { "data-testid": "radio", children: "Radio 1" }),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import__.default.Button, { "data-testid": "radio", children: "Radio 2" }),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import__.default.Button, { "data-testid": "radio", children: "Radio 3" })
+          ] }) })
+        );
+        const radios = getAllByTestId("radio");
+        radios.map((radio) => expect(radio.name).toBe(name));
+      });
+    });
+    describe("Events", () => {
+      it("should call onchange from Context", () => {
+        const onChangeMock = jest.fn();
+        const { getByText } = (0, import_react2.render)(
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_RadioGroupContext.default.Provider, { value: { onChange: onChangeMock }, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Theme.default, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import__.default.Button, { children: "Radio 1" }) }) })
+        );
+        const radio = getByText("Radio 1");
+        import_react2.fireEvent.click(radio);
+        expect(onChangeMock).toHaveBeenCalled();
+      });
+    });
+  });
+});