@gympass/yoga 7.83.1 → 7.84.0

package/cjs/ActionRequirement/web/ActionRequirementStyles.js

@@ -27,7 +27,7 @@ var Title = (0, _styledComponents["default"])(_Text["default"].H4).attrs({
   as: 'p'
 })(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n  ", "\n"])), function (_ref) {
   var fontSizes = _ref.theme.yoga.fontSizes;
-  return (0, _styledComponents.css)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n    margin-bottom: 6px;\n    @media (min-width: 769px) {\n      max-width: 700px;\n      font-size: ", "px;\n      line-height: ", "px;\n    }\n  "])), fontSizes.huge, fontSizes.huge);
+  return (0, _styledComponents.css)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n    margin-bottom: 6px;\n\n    @media (min-width: 769px) {\n      max-width: 700px;\n      font-size: ", "px;\n      line-height: ", "px;\n    }\n  "])), fontSizes.huge, fontSizes.huge);
 });
 exports.Title = Title;
 var Actions = (0, _styledComponents["default"])(_Box["default"])(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n  ", "\n"])), function (_ref2) {

package/cjs/Button/web/Button.js

@@ -9,7 +9,7 @@ var _propTypes = require("prop-types");
 
 var _StyledButton = _interopRequireDefault(require("./StyledButton"));
 
-var _excluded = ["children", "onClick", "full", "disabled", "inverted", "small", "secondary", "icon"];
+var _excluded = ["ariaLabel", "children", "onClick", "full", "disabled", "inverted", "small", "secondary", "icon"];
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
@@ -23,7 +23,8 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
 
 /** Buttons make common actions more obvious and help users more easily perform them. Buttons use labels and sometimes icons to communicate the action that will occur when the user touches them. */
 var Button = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
-  var children = _ref.children,
+  var ariaLabel = _ref.ariaLabel,
+      children = _ref.children,
       onClick = _ref.onClick,
       full = _ref.full,
       disabled = _ref.disabled,
@@ -42,6 +43,8 @@ var Button = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
   return /*#__PURE__*/_react["default"].createElement(_StyledButton["default"], _extends({
     ref: ref,
     disabled: disabled,
+    "aria-disabled": disabled,
+    "aria-label": ariaLabel,
     full: full,
     inverted: inverted,
     onClick: onClick,
@@ -50,6 +53,7 @@ var Button = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
   }, finalProps), Icon && /*#__PURE__*/_react["default"].createElement(Icon, null), children);
 });
 Button.propTypes = {
+  ariaLabel: _propTypes.string,
   children: _propTypes.node,
   disabled: _propTypes.bool,
   full: _propTypes.bool,
@@ -63,8 +67,9 @@ Button.propTypes = {
   href: _propTypes.string
 };
 Button.defaultProps = {
+  ariaLabel: undefined,
   children: 'Button',
-  disabled: false,
+  disabled: undefined,
   full: false,
   inverted: false,
   onClick: function onClick() {},

package/cjs/Button/web/Icon.js

@@ -13,7 +13,7 @@ var _StyledButton = _interopRequireDefault(require("./StyledButton"));
 
 var _Icon = _interopRequireDefault(require("../../Icon"));
 
-var _excluded = ["icon", "theme", "small"];
+var _excluded = ["icon", "theme", "small", "disabled", "ariaLabel"];
 
 var _templateObject;
 
@@ -38,11 +38,16 @@ var ButtonIcon = /*#__PURE__*/(0, _react.forwardRef)(function (_ref2, ref) {
   var icon = _ref2.icon,
       button = _ref2.theme.yoga.components.button,
       small = _ref2.small,
+      disabled = _ref2.disabled,
+      ariaLabel = _ref2.ariaLabel,
       props = _objectWithoutPropertiesLoose(_ref2, _excluded);
 
   return /*#__PURE__*/_react["default"].createElement(IconStyled, _extends({}, props, {
     ref: ref,
-    small: small
+    small: small,
+    disabled: disabled,
+    "aria-disabled": disabled,
+    "aria-label": ariaLabel
   }), /*#__PURE__*/_react["default"].createElement(_Icon["default"], {
     as: icon,
     size: small ? button.icon.size.small : button.icon.size["default"]
@@ -53,14 +58,16 @@ ButtonIcon.propTypes = {
   disabled: _propTypes.bool,
   secondary: _propTypes.bool,
   inverted: _propTypes.bool,
-  icon: (0, _propTypes.oneOfType)([_propTypes.node, _propTypes.func])
+  icon: (0, _propTypes.oneOfType)([_propTypes.node, _propTypes.func]),
+  ariaLabel: _propTypes.string
 };
 ButtonIcon.defaultProps = {
   small: false,
-  disabled: false,
+  disabled: undefined,
   secondary: false,
   inverted: false,
-  icon: undefined
+  icon: undefined,
+  ariaLabel: undefined
 };
 ButtonIcon.displayName = 'Button.Icon';
 

package/cjs/Button/web/Link.js

@@ -13,10 +13,16 @@ var _yogaCommon = require("@gympass/yoga-common");
 
 var _Button = _interopRequireDefault(require("./Button"));
 
+var _excluded = ["disabled"];
+
 var _templateObject;
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
+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 Link = (0, _styledComponents["default"])(_Button["default"])(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n  ", "\n"])), function (_ref) {
@@ -27,8 +33,14 @@ var Link = (0, _styledComponents["default"])(_Button["default"])(_templateObject
   return "\n      height: unset;\n      padding: 0;\n      background-color: unset;\n      border: none;\n      border-radius: 0;\n      color: " + button.types.link.font[state].color + ";\n\n      svg {\n        margin-right: " + button.types.link.icon.margin.right + "px;\n        fill: " + button.types.link.font[state].color + ";\n      }\n\n      &:disabled,\n      &:not([disabled]):hover,\n      &:not([disabled]):focus,\n      &:not([disabled]):active {\n        box-shadow: unset;\n        background-color: unset;\n      }\n\n      &:not([disabled]):hover  {\n        color: " + (0, _yogaCommon.hexToRgb)(button.types.link.font[state].color, 0.5) + ";\n\n        svg {\n          fill: " + (0, _yogaCommon.hexToRgb)(button.types.link.font[state].color, 0.5) + ";\n        }\n      }\n\n      &:not([disabled]):focus, &:not([disabled]):active {\n        color: " + (0, _yogaCommon.hexToRgb)(button.types.link.font[state].color, 0.75) + ";\n\n        svg {\n          fill: " + (0, _yogaCommon.hexToRgb)(button.types.link.font[state].color, 0.75) + ";\n        }\n      }\n\n      &:disabled {\n        color: " + button.types.link.font.disabled.color + ";\n\n        svg {\n          fill: " + button.types.link.font.disabled.color + ";\n        }\n      }\n\n      " + (full ? 'width: 100%' : '') + "\n    ";
 });
 
-var ButtonLink = function ButtonLink(props) {
-  return /*#__PURE__*/_react["default"].createElement(Link, props);
+var ButtonLink = function ButtonLink(_ref2) {
+  var disabled = _ref2.disabled,
+      props = _objectWithoutPropertiesLoose(_ref2, _excluded);
+
+  return /*#__PURE__*/_react["default"].createElement(Link, _extends({}, props, {
+    disabled: disabled,
+    "aria-disabled": disabled
+  }));
 };
 
 ButtonLink.propTypes = {
@@ -40,7 +52,7 @@ ButtonLink.propTypes = {
   icon: (0, _propTypes.oneOfType)([_propTypes.node, _propTypes.func])
 };
 ButtonLink.defaultProps = {
-  disabled: false,
+  disabled: undefined,
   secondary: false,
   href: undefined,
   icon: undefined

package/esm/ActionRequirement/web/ActionRequirementStyles.js

@@ -11,7 +11,7 @@ export var Title = styled(Text.H4).attrs({
   as: 'p'
 })(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n  ", "\n"])), function (_ref) {
   var fontSizes = _ref.theme.yoga.fontSizes;
-  return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n    margin-bottom: 6px;\n    @media (min-width: 769px) {\n      max-width: 700px;\n      font-size: ", "px;\n      line-height: ", "px;\n    }\n  "])), fontSizes.huge, fontSizes.huge);
+  return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n    margin-bottom: 6px;\n\n    @media (min-width: 769px) {\n      max-width: 700px;\n      font-size: ", "px;\n      line-height: ", "px;\n    }\n  "])), fontSizes.huge, fontSizes.huge);
 });
 export var Actions = styled(Box)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n  ", "\n"])), function (_ref2) {
   var spacing = _ref2.theme.yoga.spacing;

package/esm/Button/web/Button.js

@@ -1,4 +1,4 @@
-var _excluded = ["children", "onClick", "full", "disabled", "inverted", "small", "secondary", "icon"];
+var _excluded = ["ariaLabel", "children", "onClick", "full", "disabled", "inverted", "small", "secondary", "icon"];
 
 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); }
 
@@ -10,7 +10,8 @@ import StyledButton from './StyledButton';
 /** Buttons make common actions more obvious and help users more easily perform them. Buttons use labels and sometimes icons to communicate the action that will occur when the user touches them. */
 
 var Button = /*#__PURE__*/forwardRef(function (_ref, ref) {
-  var children = _ref.children,
+  var ariaLabel = _ref.ariaLabel,
+      children = _ref.children,
       onClick = _ref.onClick,
       full = _ref.full,
       disabled = _ref.disabled,
@@ -29,6 +30,8 @@ var Button = /*#__PURE__*/forwardRef(function (_ref, ref) {
   return /*#__PURE__*/React.createElement(StyledButton, _extends({
     ref: ref,
     disabled: disabled,
+    "aria-disabled": disabled,
+    "aria-label": ariaLabel,
     full: full,
     inverted: inverted,
     onClick: onClick,
@@ -37,6 +40,7 @@ var Button = /*#__PURE__*/forwardRef(function (_ref, ref) {
   }, finalProps), Icon && /*#__PURE__*/React.createElement(Icon, null), children);
 });
 Button.propTypes = {
+  ariaLabel: string,
   children: node,
   disabled: bool,
   full: bool,
@@ -50,8 +54,9 @@ Button.propTypes = {
   href: string
 };
 Button.defaultProps = {
+  ariaLabel: undefined,
   children: 'Button',
-  disabled: false,
+  disabled: undefined,
   full: false,
   inverted: false,
   onClick: function onClick() {},

package/esm/Button/web/Icon.js

@@ -1,4 +1,4 @@
-var _excluded = ["icon", "theme", "small"];
+var _excluded = ["icon", "theme", "small", "disabled", "ariaLabel"];
 
 var _templateObject;
 
@@ -9,7 +9,7 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
 function _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.slice(0); } strings.raw = raw; return strings; }
 
 import React, { forwardRef } from 'react';
-import { oneOfType, func, node, bool } from 'prop-types';
+import { oneOfType, func, node, bool, string } from 'prop-types';
 import styled, { withTheme } from 'styled-components';
 import StyledButton from './StyledButton';
 import Icon from '../../Icon';
@@ -22,11 +22,16 @@ var ButtonIcon = /*#__PURE__*/forwardRef(function (_ref2, ref) {
   var icon = _ref2.icon,
       button = _ref2.theme.yoga.components.button,
       small = _ref2.small,
+      disabled = _ref2.disabled,
+      ariaLabel = _ref2.ariaLabel,
       props = _objectWithoutPropertiesLoose(_ref2, _excluded);
 
   return /*#__PURE__*/React.createElement(IconStyled, _extends({}, props, {
     ref: ref,
-    small: small
+    small: small,
+    disabled: disabled,
+    "aria-disabled": disabled,
+    "aria-label": ariaLabel
   }), /*#__PURE__*/React.createElement(Icon, {
     as: icon,
     size: small ? button.icon.size.small : button.icon.size["default"]
@@ -37,14 +42,16 @@ ButtonIcon.propTypes = {
   disabled: bool,
   secondary: bool,
   inverted: bool,
-  icon: oneOfType([node, func])
+  icon: oneOfType([node, func]),
+  ariaLabel: string
 };
 ButtonIcon.defaultProps = {
   small: false,
-  disabled: false,
+  disabled: undefined,
   secondary: false,
   inverted: false,
-  icon: undefined
+  icon: undefined,
+  ariaLabel: undefined
 };
 ButtonIcon.displayName = 'Button.Icon';
 export default withTheme(ButtonIcon);

package/esm/Button/web/Link.js

@@ -1,5 +1,11 @@
+var _excluded = ["disabled"];
+
 var _templateObject;
 
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
 function _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.slice(0); } strings.raw = raw; return strings; }
 
 import React from 'react';
@@ -15,8 +21,14 @@ var Link = styled(Button)(_templateObject || (_templateObject = _taggedTemplateL
   return "\n      height: unset;\n      padding: 0;\n      background-color: unset;\n      border: none;\n      border-radius: 0;\n      color: " + button.types.link.font[state].color + ";\n\n      svg {\n        margin-right: " + button.types.link.icon.margin.right + "px;\n        fill: " + button.types.link.font[state].color + ";\n      }\n\n      &:disabled,\n      &:not([disabled]):hover,\n      &:not([disabled]):focus,\n      &:not([disabled]):active {\n        box-shadow: unset;\n        background-color: unset;\n      }\n\n      &:not([disabled]):hover  {\n        color: " + hexToRgb(button.types.link.font[state].color, 0.5) + ";\n\n        svg {\n          fill: " + hexToRgb(button.types.link.font[state].color, 0.5) + ";\n        }\n      }\n\n      &:not([disabled]):focus, &:not([disabled]):active {\n        color: " + hexToRgb(button.types.link.font[state].color, 0.75) + ";\n\n        svg {\n          fill: " + hexToRgb(button.types.link.font[state].color, 0.75) + ";\n        }\n      }\n\n      &:disabled {\n        color: " + button.types.link.font.disabled.color + ";\n\n        svg {\n          fill: " + button.types.link.font.disabled.color + ";\n        }\n      }\n\n      " + (full ? 'width: 100%' : '') + "\n    ";
 });
 
-var ButtonLink = function ButtonLink(props) {
-  return /*#__PURE__*/React.createElement(Link, props);
+var ButtonLink = function ButtonLink(_ref2) {
+  var disabled = _ref2.disabled,
+      props = _objectWithoutPropertiesLoose(_ref2, _excluded);
+
+  return /*#__PURE__*/React.createElement(Link, _extends({}, props, {
+    disabled: disabled,
+    "aria-disabled": disabled
+  }));
 };
 
 ButtonLink.propTypes = {
@@ -28,7 +40,7 @@ ButtonLink.propTypes = {
   icon: oneOfType([node, func])
 };
 ButtonLink.defaultProps = {
-  disabled: false,
+  disabled: undefined,
   secondary: false,
   href: undefined,
   icon: undefined

package/package.json

@@ -1,8 +1,8 @@
 {
   "name": "@gympass/yoga",
-  "version": "7.83.1",
+  "version": "7.84.0",
   "description": "Gympass component library",
-  "main": "./cjs",
+  "main": "./cjs/index.js",
   "sideEffects": false,
   "keywords": [
     "Gympass",
@@ -25,12 +25,12 @@
     "url": "https://github.com/Gympass/yoga/issues"
   },
   "dependencies": {
-    "@gympass/yoga-common": "^1.2.0",
-    "@gympass/yoga-helpers": "^1.0.3",
+    "@gympass/yoga-common": "^1.2.1",
+    "@gympass/yoga-helpers": "^1.0.4",
     "@gympass/yoga-icons": "^1.16.0",
-    "@gympass/yoga-illustrations": "^0.5.1",
-    "@gympass/yoga-system": "^0.11.0",
-    "@gympass/yoga-tokens": "^3.2.0",
+    "@gympass/yoga-illustrations": "^0.5.2",
+    "@gympass/yoga-system": "^0.11.1",
+    "@gympass/yoga-tokens": "^3.2.1",
     "@ptomasroos/react-native-multi-slider": "^2.1.1",
     "@radix-ui/react-dropdown-menu": "^2.0.1",
     "date-fns": "^2.29.2",
@@ -55,14 +55,14 @@
     "react-native": "0.72.3",
     "styled-components": "^4.4.0"
   },
-  "gitHead": "4cbae54a4a40e7081461982b3e17fc70be057349",
-  "module": "./esm",
+  "gitHead": "f4ff629d7f0f900398d0504f164071af2d25d9e4",
+  "module": "./esm/index.js",
   "types": "./typings/index.d.ts",
   "private": false,
   "exports": {
     ".": {
-      "require": "./cjs",
-      "import": "./esm"
+      "require": "./cjs/index.js",
+      "import": "./esm/index.js"
     }
   },
   "react-native": "./cjs/index.native.js"