@gympass/yoga 7.127.3 → 7.128.0

package/esm/Input/web/Input.js

@@ -111,28 +111,30 @@ const LeftElementWrapper = styled.div`
     transform: translateY(-50%);
   `}
 `;
+const noop = () => {
+};
 const Input = React.forwardRef(
   (_a, ref) => {
     var _b = _a, {
-      cleanable,
+      cleanable = true,
       children,
-      disabled,
+      disabled = false,
       error,
-      full,
+      full = false,
       helper,
       label,
       ariaLabel,
       maxLength,
-      readOnly,
+      readOnly = false,
       style,
-      value,
-      onChange,
-      onClean,
-      hideMaxLength,
+      value = "",
+      onChange = noop,
+      onClean = noop,
+      hideMaxLength = false,
       rightIcon,
       a11yId,
-      closeAriaLabel,
-      includeAriaAttributes,
+      closeAriaLabel = "Clear",
+      includeAriaAttributes = true,
       leftElement
     } = _b, props = __objRest(_b, [
       "cleanable",
@@ -299,32 +301,6 @@ Input.propTypes = {
   /** element on the left */
   leftElement: node
 };
-Input.defaultProps = {
-  className: void 0,
-  children: void 0,
-  cleanable: true,
-  disabled: false,
-  error: void 0,
-  full: false,
-  helper: void 0,
-  label: void 0,
-  ariaLabel: void 0,
-  maxLength: void 0,
-  readOnly: false,
-  style: void 0,
-  value: "",
-  onChange: () => {
-  },
-  onClean: () => {
-  },
-  hideMaxLength: false,
-  placeholder: void 0,
-  rightIcon: void 0,
-  a11yId: void 0,
-  closeAriaLabel: "Clear",
-  includeAriaAttributes: true,
-  leftElement: void 0
-};
 var Input_default = Input;
 export {
   Input_default as default

package/esm/Input/web/Password.js

@@ -100,10 +100,10 @@ const IconWrapper = styled.div`
 `;
 const Password = (_a) => {
   var _b = _a, {
-    disabled,
+    disabled = false,
     style,
     className,
-    full,
+    full = false,
     showPasswordAriaLabel,
     hidePasswordAriaLabel
   } = _b, props = __objRest(_b, [
@@ -164,14 +164,6 @@ Password.propTypes = {
   hidePasswordAriaLabel: string,
   style: shape({})
 };
-Password.defaultProps = {
-  className: void 0,
-  disabled: false,
-  full: false,
-  style: void 0,
-  showPasswordAriaLabel: void 0,
-  hidePasswordAriaLabel: void 0
-};
 var Password_default = Password;
 export {
   Password_default as default

package/esm/Input/web/Phone.js

@@ -52,19 +52,23 @@ const phoneBaseSettings = {
     "ca"
   ]
 };
+const noop = () => {
+};
 const Phone = React.forwardRef(
   (_a, forwardedRef) => {
     var _b = _a, {
-      defaultCountry,
-      disabled,
-      readOnly,
+      defaultCountry = "br",
+      disabled = false,
+      readOnly = false,
       error,
-      full,
+      full = false,
       helper,
-      label,
-      placeholder,
-      value,
-      onChange
+      label = "",
+      placeholder = "+55 (11) 999999999",
+      value = "",
+      countries = phoneBaseSettings.onlyCountries,
+      onChange = noop,
+      cleanable = true
     } = _b, rest = __objRest(_b, [
       "defaultCountry",
       "disabled",
@@ -75,7 +79,9 @@ const Phone = React.forwardRef(
       "label",
       "placeholder",
       "value",
-      "onChange"
+      "countries",
+      "onChange",
+      "cleanable"
     ]);
     const inputRef = useCombinedRefs(forwardedRef);
     const currentCountry = useRef(defaultCountry);
@@ -85,6 +91,9 @@ const Phone = React.forwardRef(
         currentCountry.current = countryCode;
       }
     }, []);
+    const availableCountries = {
+      onlyCountries: (countries == null ? void 0 : countries.length) > 0 ? countries : phoneBaseSettings.onlyCountries
+    };
     return /* @__PURE__ */ jsx(
       Input,
       __spreadProps(__spreadValues({}, __spreadValues({
@@ -93,14 +102,15 @@ const Phone = React.forwardRef(
         error,
         full,
         helper,
-        value
+        value,
+        cleanable
       }, rest)), {
         ref: inputRef,
         label: "",
         onClean: (phoneNumber) => onChange(phoneNumber),
         children: /* @__PURE__ */ jsx(S.Container, { error, disabled, full, children: /* @__PURE__ */ jsx(
           BasePhoneInput,
-          __spreadProps(__spreadValues({}, phoneBaseSettings), {
+          __spreadProps(__spreadValues({}, availableCountries), {
             ref: (phoneRef) => {
               inputRef.current = phoneRef == null ? void 0 : phoneRef.numberInputRef;
             },
@@ -144,22 +154,9 @@ Phone.propTypes = {
   /** callback invoked when value changes, either by typing of selecting a country */
   onChange: func,
   /** placeholder to show when the input is cleared */
-  placeholder: string
-};
-Phone.defaultProps = {
-  className: void 0,
-  cleanable: true,
-  defaultCountry: "br",
-  disabled: false,
-  error: void 0,
-  full: false,
-  helper: void 0,
-  label: "",
-  readOnly: false,
-  value: "",
-  onChange: () => {
-  },
-  placeholder: "+55 (11) 999999999"
+  placeholder: string,
+  /** countries for mask field and dropdown, make sure to use ISO 3166-1 alpha-2 lowercase */
+  countries: PropTypes.arrayOf(string)
 };
 var Phone_default = Phone;
 export {

package/esm/Input/web/Phone.test.js

@@ -81,6 +81,21 @@ var require_Phone_test = __commonJS({
             expect(getByDisplayValue(spec.expected)).toBeInTheDocument();
           });
         });
+        it(`Should only format and show countries numbers when props is given`, () => {
+          const USPhone = numbersFormats[1];
+          const { queryByDisplayValue } = render(
+            /* @__PURE__ */ jsx(ThemeProvider, { children: /* @__PURE__ */ jsx(Input.Phone, { countries: ["br", "pt"], value: USPhone.base }) })
+          );
+          expect(queryByDisplayValue(USPhone.expected)).not.toBeInTheDocument();
+        });
+        it(`Should return all countries validation if countries equals to empty array`, () => {
+          const USPhone = numbersFormats[1];
+          const { getAllByRole } = render(
+            /* @__PURE__ */ jsx(ThemeProvider, { children: /* @__PURE__ */ jsx(Input.Phone, { countries: [], value: USPhone.base }) })
+          );
+          fireEvent.click(getAllByRole("button")[0]);
+          expect(getAllByRole("option").length).toBe(12);
+        });
         it("should prefix the phone number with newly selected country dial code", () => __async(exports, null, function* () {
           const { getByRole, getByText, getByDisplayValue } = render(
             /* @__PURE__ */ jsx(ThemeProvider, { children: /* @__PURE__ */ jsx(Input.Phone, { defaultCountry: "us" }) })

package/esm/List/web/List.js

@@ -60,18 +60,16 @@ const StyledList = styled.ul`
     }
   `}
 `;
-const List = React.forwardRef((_a, ref) => {
-  var _b = _a, { horizontal, divided } = _b, rest = __objRest(_b, ["horizontal", "divided"]);
-  return /* @__PURE__ */ jsx(StyledList, __spreadValues({ horizontal, divided, ref }, rest));
-});
+const List = React.forwardRef(
+  (_a, ref) => {
+    var _b = _a, { horizontal = false, divided = true } = _b, rest = __objRest(_b, ["horizontal", "divided"]);
+    return /* @__PURE__ */ jsx(StyledList, __spreadValues({ horizontal, divided, ref }, rest));
+  }
+);
 List.propTypes = {
   horizontal: PropTypes.bool,
   divided: PropTypes.bool
 };
-List.defaultProps = {
-  horizontal: false,
-  divided: true
-};
 List.displayName = "List";
 var List_default = List;
 export {

package/esm/Menu/web/Menu.js

@@ -2,7 +2,7 @@ import { jsx } from "react/jsx-runtime";
 import React from "react";
 import { Root as MenuRoot } from "@radix-ui/react-dropdown-menu";
 import { bool, node } from "prop-types";
-const Menu = ({ children, onMouseHover }) => {
+const Menu = ({ children, onMouseHover = true }) => {
   const [isOpen, setIsOpen] = React.useState(false);
   function handleOpenMenu() {
     setIsOpen(!isOpen);
@@ -17,9 +17,6 @@ Menu.propTypes = {
   /** when mouse hover menu open as default is true */
   onMouseHover: bool
 };
-Menu.defaultProps = {
-  onMouseHover: true
-};
 Menu.displayName = "Menu";
 var Menu_default = Menu;
 export {

package/esm/Menu/web/MenuItem.js

@@ -98,8 +98,8 @@ const MenuItem = forwardRef(
     var _b = _a, {
       icon: Icon,
       href,
-      active,
-      disabled,
+      active = false,
+      disabled = false,
       iconColor,
       iconSize,
       children,
@@ -146,14 +146,6 @@ MenuItem.propTypes = {
   iconColor: string,
   iconSize: string
 };
-MenuItem.defaultProps = {
-  icon: void 0,
-  href: void 0,
-  disabled: false,
-  active: false,
-  iconColor: void 0,
-  iconSize: void 0
-};
 MenuItem.displayName = "Menu.Item";
 var MenuItem_default = withTheme(MenuItem);
 export {

package/esm/Menu/web/MenuList.js

@@ -30,7 +30,14 @@ const StyledMenuList = styled(MenuListRoot)`
 }}
 `;
 const MenuList = forwardRef(
-  ({ children, align, alignOffset, side, sideOffset, zIndex }, ref) => {
+  ({
+    children,
+    align = "start",
+    alignOffset = 0,
+    side = "bottom",
+    sideOffset = 4,
+    zIndex = "auto"
+  }, ref) => {
     return /* @__PURE__ */ jsx(Portal, { children: /* @__PURE__ */ jsx(
       StyledMenuList,
       {
@@ -59,13 +66,6 @@ MenuList.propTypes = {
   /** Add z-index value to Menu.List. Set to 'auto' by default */
   zIndex: string || number
 };
-MenuList.defaultProps = {
-  align: "start",
-  alignOffset: 0,
-  side: "bottom",
-  sideOffset: 4,
-  zIndex: "auto"
-};
 MenuList.displayName = "Menu.List";
 var MenuList_default = MenuList;
 export {

package/esm/Popover/web/Popover.js

@@ -41,12 +41,12 @@ const Popover = React.forwardRef(
       children,
       title,
       description,
-      position,
-      width,
-      height,
-      zIndex,
+      position = "bottom-center",
+      width = 265,
+      height = 200,
+      zIndex = 1,
       a11yId,
-      hover
+      hover = false
     } = _b, props = __objRest(_b, [
       "children",
       "title",
@@ -134,15 +134,6 @@ Popover.propTypes = {
   zIndex: number,
   hover: bool
 };
-Popover.defaultProps = {
-  a11yId: void 0,
-  title: void 0,
-  position: "bottom-center",
-  width: 265,
-  height: 200,
-  zIndex: 1,
-  hover: false
-};
 var Popover_default = Popover;
 export {
   Popover_default as default

package/esm/Progress/web/Progress.js

@@ -108,8 +108,8 @@ const Wrapper = styled.div`
   width: 100%;
 
   ${({
-  isNumber,
-  align,
+  isNumber = false,
+  align = "left",
   theme: {
     yoga: { spacing }
   }
@@ -149,13 +149,13 @@ Wrapper.propTypes = {
   align: oneOf(["left", "right"]),
   isNumber: bool
 };
-Wrapper.defaultProps = {
-  align: "left",
-  isNumber: false
+const defaultLabel = {
+  value: void 0,
+  placement: "left"
 };
 const Progress = React.forwardRef(
   (_a, ref) => {
-    var _b = _a, { label, max, value, variant } = _b, props = __objRest(_b, ["label", "max", "value", "variant"]);
+    var _b = _a, { label = defaultLabel, max = 1, value, variant = "verve" } = _b, props = __objRest(_b, ["label", "max", "value", "variant"]);
     const isNumber = !/[a-zA-Z]/g.test(label.value);
     return /* @__PURE__ */ jsxs(Wrapper, __spreadProps(__spreadValues({ isNumber, align: label.placement, ref }, props), { children: [
       /* @__PURE__ */ jsx(ProgressBar, { max, value, variant }),
@@ -203,15 +203,6 @@ Progress.propTypes = {
     "white"
   ])
 };
-Progress.defaultProps = {
-  label: {
-    value: void 0,
-    placement: "left"
-  },
-  max: 1,
-  value: void 0,
-  variant: "verve"
-};
 var Progress_default = Progress;
 export {
   Progress_default as default

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

@@ -91,10 +91,10 @@ const ButtonWrapper = styled.div`
     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;
@@ -104,7 +104,7 @@ const ButtonWrapper = styled.div`
       border-top-left-radius: ${radiogroup.button.border.radius}px;
       border-bottom-left-radius: ${radiogroup.button.border.radius}px;
     }
-  
+
     &:last-child {
       border-left-width: 0;
 
@@ -119,7 +119,7 @@ const ButtonWrapper = styled.div`
 `;
 const RadioGroupButton = React.forwardRef(
   (_a, ref) => {
-    var _b = _a, { children, value } = _b, rest = __objRest(_b, ["children", "value"]);
+    var _b = _a, { children, value = "" } = _b, rest = __objRest(_b, ["children", "value"]);
     const _a2 = useContext(RadioGroupContext), { name, onChange, small, selectedValue } = _a2, context = __objRest(_a2, ["name", "onChange", "small", "selectedValue"]);
     const inputValue = value || children;
     const checked = inputValue === selectedValue;
@@ -144,9 +144,6 @@ RadioGroupButton.propTypes = {
   children: oneOfType([string, number]).isRequired,
   value: oneOfType([string, number])
 };
-RadioGroupButton.defaultProps = {
-  value: ""
-};
 var RadioButton_default = RadioGroupButton;
 export {
   RadioButton_default as default

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

@@ -54,7 +54,7 @@ const Radio = styled.span`
       width: ${radio.size}px;
       height: ${radio.size}px;
 
-      border-width: ${radio.size * 0.1}px; 
+      border-width: ${radio.size * 0.1}px;
       border-style: solid;
       border-color: ${radio.backgroundColor};
       border-radius: ${radio.border.radius}px;
@@ -107,28 +107,28 @@ const Wrapper = styled.div`
     }
 
     ${checked ? `
-    
+
       &:hover {
         ${Radio} {
           background-color: ${stateColors.hover};
-          box-shadow: 0 0 0 ${radiogroup.radio.size * 0.4}px 
+          box-shadow: 0 0 0 ${radiogroup.radio.size * 0.4}px
             ${stateColors.hover};
         }
       }
-    
+
       &:focus-within {
         ${Radio} {
           z-index: 1;
           background-color: ${stateColors.focusWithin};
-          box-shadow: 0 0 0 ${radiogroup.radio.size * 0.4}px 
+          box-shadow: 0 0 0 ${radiogroup.radio.size * 0.4}px
             ${stateColors.focusWithin};
         }
       }
-    
+
       &:active {
         ${Radio} {
           background-color: ${stateColors.active};
-          box-shadow: 0 0 0 ${radiogroup.radio.size * 0.4}px 
+          box-shadow: 0 0 0 ${radiogroup.radio.size * 0.4}px
             ${stateColors.active};
         }
       }
@@ -143,12 +143,12 @@ const Wrapper = styled.div`
 
           width: ${radiogroup.radio.size * 0.5}px;
           height: ${radiogroup.radio.size * 0.5}px;
-          
+
           border-radius: 100%;
           background-color: ${radiogroup.checked.backgroundColor};
-          
+
           transform: translate(-50%, -50%);
-          
+
           content: '';
         }
       }
@@ -177,9 +177,10 @@ const Wrapper = styled.div`
   `;
 }}
 `;
+const emptyObj = {};
 const RadioGroupRadio = React.forwardRef(
   (_a, ref) => {
-    var _b = _a, { value, disabled, style, className } = _b, rest = __objRest(_b, ["value", "disabled", "style", "className"]);
+    var _b = _a, { value = "", disabled = false, style = emptyObj, className } = _b, rest = __objRest(_b, ["value", "disabled", "style", "className"]);
     const _a2 = useContext(RadioGroupContext), { name, onChange, selectedValue } = _a2, context = __objRest(_a2, ["name", "onChange", "selectedValue"]);
     const inputValue = value;
     const checked = inputValue === selectedValue;
@@ -219,12 +220,6 @@ RadioGroupRadio.propTypes = {
   style: shape({}),
   value: oneOfType([string, number])
 };
-RadioGroupRadio.defaultProps = {
-  className: void 0,
-  disabled: false,
-  style: {},
-  value: ""
-};
 var Radio_default = RadioGroupRadio;
 export {
   Radio_default as default

package/esm/RadioGroup/web/RadioGroup.js

@@ -45,15 +45,18 @@ const Group = styled.div.attrs({
     ${full ? `width: 100%;` : ``}
   `}
 `;
+const noop = () => {
+};
+const emptyObj = {};
 const RadioGroup = (_a) => {
   var _b = _a, {
-    name,
-    onChange,
-    selectedValue,
-    small,
-    full,
-    children,
-    style
+    name = "",
+    onChange = noop,
+    selectedValue = "",
+    small = false,
+    full = false,
+    children = null,
+    style = emptyObj
   } = _b, rest = __objRest(_b, [
     "name",
     "onChange",
@@ -85,16 +88,6 @@ RadioGroup.propTypes = {
   children: node,
   style: shape({})
 };
-RadioGroup.defaultProps = {
-  name: "",
-  onChange: () => {
-  },
-  selectedValue: "",
-  small: false,
-  full: false,
-  children: null,
-  style: {}
-};
 var RadioGroup_default = RadioGroup;
 export {
   RadioGroup_default as default

package/esm/Rating/web/Rating.js

@@ -53,22 +53,31 @@ const RatingWrapper = styled.div`
     ${readOnly ? "pointer-events: none;" : ""}
   `}
 `;
+const noop = () => {
+};
+const defaultIcon = {
+  type: StarFilled,
+  size: 12
+};
 const Rating = (_a) => {
   var _b = _a, {
     value,
-    max,
-    readOnly,
-    onRate,
-    onMouseOver,
-    onMouseMove,
-    onMouseLeave,
+    max = 5,
+    readOnly = true,
+    onRate = noop,
+    onMouseOver = noop,
+    onMouseMove = noop,
+    onMouseLeave = noop,
     theme: {
       yoga: {
         colors,
         components: { rating }
       }
     },
-    icon: { type: Icon = StarFilled, size: iconSize = rating.icon.size }
+    icon: {
+      type: Icon = StarFilled,
+      size: iconSize = rating.icon.size
+    } = defaultIcon
   } = _b, rest = __objRest(_b, [
     "value",
     "max",
@@ -184,24 +193,6 @@ Rating.propTypes = {
   onMouseMove: func,
   onMouseLeave: func
 };
-Rating.defaultProps = {
-  value: void 0,
-  icon: {
-    type: StarFilled,
-    size: 12
-  },
-  max: 5,
-  readOnly: true,
-  onRate: (rating) => {
-  },
-  // eslint-disable-line no-unused-vars
-  onMouseOver: () => {
-  },
-  onMouseMove: () => {
-  },
-  onMouseLeave: () => {
-  }
-};
 var Rating_default = withTheme(Rating);
 export {
   Rating_default as default

package/esm/Skeleton/web/Skeleton.js

@@ -1,4 +1,6 @@
 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;
@@ -14,6 +16,19 @@ var __spreadValues = (a, b) => {
     }
   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 } from "react/jsx-runtime";
 import React from "react";
 import { checkPropTypes, oneOf } from "prop-types";
@@ -65,8 +80,9 @@ const StyledSkeleton = styled.div`
     }
   `}
 `;
-function Skeleton(props) {
-  return /* @__PURE__ */ jsx(StyledSkeleton, __spreadValues({}, props));
+function Skeleton(_a) {
+  var _b = _a, { animation = "pulse", color = "primary" } = _b, rest = __objRest(_b, ["animation", "color"]);
+  return /* @__PURE__ */ jsx(StyledSkeleton, __spreadProps(__spreadValues({}, rest), { animation, color }));
 }
 Skeleton.propTypes = {
   /**
@@ -117,11 +133,6 @@ Skeleton.propTypes = {
    */
   animation: oneOf(["pulse", false])
 };
-Skeleton.defaultProps = {
-  variant: void 0,
-  animation: "pulse",
-  color: "primary"
-};
 var Skeleton_default = Skeleton;
 export {
   Skeleton_default as default