@gympass/yoga 7.70.1 → 7.71.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (20) hide show
  1. package/cjs/AutoComplete/web/AutoComplete.js +2 -1
  2. package/cjs/Dropdown/web/Dropdown.js +2 -1
  3. package/cjs/Heading/web/Title.js +1 -1
  4. package/cjs/Input/web/Helper.js +14 -6
  5. package/cjs/Input/web/Input.js +38 -7
  6. package/cjs/Text/native/Text.js +1 -1
  7. package/cjs/Text/sharedTextStyle.js +3 -1
  8. package/cjs/Text/web/Text.js +6 -3
  9. package/esm/AutoComplete/web/AutoComplete.js +2 -1
  10. package/esm/Dropdown/web/Dropdown.js +2 -1
  11. package/esm/Heading/web/Title.js +1 -1
  12. package/esm/Input/web/Helper.js +14 -6
  13. package/esm/Input/web/Input.js +38 -7
  14. package/esm/Input/web/Input.test.js +32 -4
  15. package/esm/Text/native/Text.js +6 -3
  16. package/esm/Text/native/Text.test.js +38 -24
  17. package/esm/Text/sharedTextStyle.js +3 -1
  18. package/esm/Text/web/Text.js +6 -3
  19. package/esm/Text/web/Text.test.js +38 -24
  20. package/package.json +2 -2
package/cjs/AutoComplete/web/AutoComplete.js CHANGED
@@ -175,7 +175,8 @@ var AutoComplete = /*#__PURE__*/_react["default"].forwardRef(function (_ref6, re
175
175
  onClick: handleOpenSuggestions,
176
176
  "aria-label": openSuggestionsAriaLabel
177
177
  }),
178
- ref: inputRef
178
+ ref: inputRef,
179
+ includeAriaAttributes: false
179
180
  })), isSuggestionsOpen && /*#__PURE__*/_react["default"].createElement(List, _extends({}, getMenuProps(), {
180
181
  full: full,
181
182
  error: !!error
package/cjs/Dropdown/web/Dropdown.js CHANGED
@@ -155,7 +155,8 @@ var Dropdown = /*#__PURE__*/_react["default"].forwardRef(function (_ref10, ref)
155
155
  isOpen: isOpen,
156
156
  label: label,
157
157
  full: full,
158
- ref: inputRef
158
+ ref: inputRef,
159
+ includeAriaAttributes: false
159
160
  }, getInputProps())), /*#__PURE__*/_react["default"].createElement(Button, _extends({
160
161
  isOpen: isOpen,
161
162
  disabled: disabled
package/cjs/Heading/web/Title.js CHANGED
@@ -27,7 +27,7 @@ var Title = function Title(_ref) {
27
27
  w: "100%",
28
28
  textAlign: "center"
29
29
  }, /*#__PURE__*/_react["default"].createElement(_Text["default"].Medium, _extends({}, props, {
30
- size: "small",
30
+ fontSize: "small",
31
31
  as: "h1"
32
32
  }), children));
33
33
  };
package/cjs/Input/web/Helper.js CHANGED
@@ -15,6 +15,8 @@ var _templateObject, _templateObject2;
15
15
 
16
16
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
17
17
 
18
+ 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); }
19
+
18
20
  function _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.slice(0); } strings.raw = raw; return strings; }
19
21
 
20
22
  var Wrapper = _styledComponents["default"].div(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: space-between;\n ", "\n"])), function (_ref) {
@@ -39,13 +41,17 @@ var Helper = function Helper(_ref3) {
39
41
  helper = _ref3.helper,
40
42
  maxLength = _ref3.maxLength,
41
43
  length = _ref3.length,
42
- hideMaxLength = _ref3.hideMaxLength;
44
+ hideMaxLength = _ref3.hideMaxLength,
45
+ a11yId = _ref3.a11yId;
43
46
  return /*#__PURE__*/_react["default"].createElement(Wrapper, {
44
47
  disabled: disabled,
45
48
  error: error
46
- }, (error || helper) && /*#__PURE__*/_react["default"].createElement(Info, {
47
- as: "span"
48
- }, error || helper), maxLength && !hideMaxLength && /*#__PURE__*/_react["default"].createElement(Info, {
49
+ }, (error || helper) && /*#__PURE__*/_react["default"].createElement(Info, _extends({
50
+ as: "span",
51
+ "aria-live": "polite"
52
+ }, a11yId && {
53
+ id: a11yId
54
+ }), error || helper), maxLength && !hideMaxLength && /*#__PURE__*/_react["default"].createElement(Info, {
49
55
  as: "span"
50
56
  }, length, "/", maxLength));
51
57
  };
@@ -56,7 +62,8 @@ Helper.propTypes = {
56
62
  helper: _propTypes.string,
57
63
  maxLength: _propTypes.number,
58
64
  length: _propTypes.number,
59
- hideMaxLength: _propTypes.bool
65
+ hideMaxLength: _propTypes.bool,
66
+ a11yId: _propTypes.string
60
67
  };
61
68
  Helper.defaultProps = {
62
69
  disabled: undefined,
@@ -64,7 +71,8 @@ Helper.defaultProps = {
64
71
  helper: undefined,
65
72
  maxLength: undefined,
66
73
  length: undefined,
67
- hideMaxLength: undefined
74
+ hideMaxLength: undefined,
75
+ a11yId: undefined
68
76
  };
69
77
  var _default = Helper;
70
78
  exports["default"] = _default;
package/cjs/Input/web/Input.js CHANGED
@@ -23,7 +23,7 @@ var _Legend = _interopRequireDefault(require("./Legend"));
23
23
 
24
24
  var _Label = _interopRequireDefault(require("./Label"));
25
25
 
26
- var _excluded = ["cleanable", "children", "disabled", "error", "full", "helper", "label", "maxLength", "readOnly", "style", "value", "onChange", "onClean", "hideMaxLength", "rightIcon"];
26
+ var _excluded = ["cleanable", "children", "disabled", "error", "full", "helper", "label", "maxLength", "readOnly", "style", "value", "onChange", "onClean", "hideMaxLength", "rightIcon", "a11yId", "includeAriaAttributes"];
27
27
 
28
28
  var _templateObject, _templateObject2, _templateObject3, _templateObject4;
29
29
 
@@ -71,6 +71,8 @@ var Input = /*#__PURE__*/_react["default"].forwardRef(function (_ref3, ref) {
71
71
  onClean = _ref3.onClean,
72
72
  hideMaxLength = _ref3.hideMaxLength,
73
73
  rightIcon = _ref3.rightIcon,
74
+ a11yId = _ref3.a11yId,
75
+ includeAriaAttributes = _ref3.includeAriaAttributes,
74
76
  props = _objectWithoutPropertiesLoose(_ref3, _excluded);
75
77
 
76
78
  var inputRef = ref || (0, _react.useRef)(null);
@@ -83,6 +85,24 @@ var Input = /*#__PURE__*/_react["default"].forwardRef(function (_ref3, ref) {
83
85
  }
84
86
  };
85
87
 
88
+ var hasHelper = helper || maxLength || error;
89
+ var helperA11yId = includeAriaAttributes && a11yId && a11yId + "-helper";
90
+ var labelA11yId = includeAriaAttributes && a11yId && a11yId + "-label";
91
+ var a11yFieldProps;
92
+
93
+ if (includeAriaAttributes) {
94
+ a11yFieldProps = a11yId ? _extends({}, hasHelper && {
95
+ 'aria-describedby': helperA11yId
96
+ }, label && {
97
+ 'aria-labelledby': labelA11yId
98
+ }) : _extends({}, label && {
99
+ 'aria-label': label
100
+ });
101
+ a11yFieldProps['aria-invalid'] = !!error;
102
+ } else {
103
+ a11yFieldProps = {};
104
+ }
105
+
86
106
  return /*#__PURE__*/_react["default"].createElement(Control, {
87
107
  full: full
88
108
  }, /*#__PURE__*/_react["default"].createElement(_Fieldset["default"], {
@@ -103,10 +123,12 @@ var Input = /*#__PURE__*/_react["default"].forwardRef(function (_ref3, ref) {
103
123
  ref: inputRef,
104
124
  value: value,
105
125
  onChange: onChange
106
- })) : children, /*#__PURE__*/_react["default"].createElement(_Label["default"], {
126
+ }, a11yFieldProps)) : children, /*#__PURE__*/_react["default"].createElement(_Label["default"], _extends({
107
127
  error: error,
108
128
  disabled: disabled
109
- }, label), label && /*#__PURE__*/_react["default"].createElement(_Legend["default"], null, label), cleanable && !readOnly && value && /*#__PURE__*/_react["default"].createElement(IconWrapper, {
129
+ }, labelA11yId && {
130
+ id: labelA11yId
131
+ }), label), label && /*#__PURE__*/_react["default"].createElement(_Legend["default"], null, label), cleanable && !readOnly && value && /*#__PURE__*/_react["default"].createElement(IconWrapper, {
110
132
  tabIndex: 0,
111
133
  disabled: disabled,
112
134
  onClick: cleanField,
@@ -123,13 +145,14 @@ var Input = /*#__PURE__*/_react["default"].forwardRef(function (_ref3, ref) {
123
145
  width: 20,
124
146
  height: 20,
125
147
  role: "button"
126
- }, rightIcon)), (helper || maxLength || error) && /*#__PURE__*/_react["default"].createElement(_Helper["default"], {
148
+ }, rightIcon)), hasHelper && /*#__PURE__*/_react["default"].createElement(_Helper["default"], {
127
149
  error: error,
128
150
  helper: helper,
129
151
  maxLength: maxLength,
130
152
  length: value.length,
131
153
  disabled: disabled,
132
- hideMaxLength: hideMaxLength
154
+ hideMaxLength: hideMaxLength,
155
+ a11yId: helperA11yId
133
156
  }));
134
157
  });
135
158
 
@@ -162,7 +185,13 @@ Input.propTypes = {
162
185
  /** when max length helper is unnecessary to appear */
163
186
  hideMaxLength: _propTypes.bool,
164
187
  placeholder: _propTypes.string,
165
- rightIcon: _propTypes.node
188
+ rightIcon: _propTypes.node,
189
+
190
+ /** a unique prefix to generate HTML IDs to be used for aria-labelledby and aria-describedby */
191
+ a11yId: _propTypes.string,
192
+
193
+ /** useful for components that extend the Input component and have their own ARIA attributes implementation (e.g. Dropdown) */
194
+ includeAriaAttributes: _propTypes.bool
166
195
  };
167
196
  Input.defaultProps = {
168
197
  className: undefined,
@@ -181,7 +210,9 @@ Input.defaultProps = {
181
210
  onClean: function onClean() {},
182
211
  hideMaxLength: false,
183
212
  placeholder: undefined,
184
- rightIcon: undefined
213
+ rightIcon: undefined,
214
+ a11yId: undefined,
215
+ includeAriaAttributes: true
185
216
  };
186
217
  var _default = Input;
187
218
  exports["default"] = _default;
package/cjs/Text/native/Text.js CHANGED
@@ -1 +1 @@
1
- var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.Tiny=exports.Text=exports.SmallestException=exports.Small=exports.SectionTitle=exports.Regular=exports.Medium=exports.Light=exports.H5=exports.H4=exports.H3=exports.H2=exports.H1=exports.Bold=exports.Black=void 0;var _taggedTemplateLiteralLoose2=_interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _react=_interopRequireDefault(require("react"));var _styledComponents=_interopRequireDefault(require("styled-components"));var _propTypes=require("prop-types");var _yogaSystem=require("@gympass/yoga-system");var _textStyle=_interopRequireDefault(require("../textStyle"));var _shared=require("../../shared");var _templateObject;var styledText=function styledText(type){return _styledComponents["default"].Text(_templateObject||(_templateObject=(0,_taggedTemplateLiteralLoose2["default"])(["\n ","\n ","\n"])),(0,_textStyle["default"])(type),_yogaSystem.system);};var H1=styledText('h1');exports.H1=H1;H1.displayName='Text.H1';var H2=styledText('h2');exports.H2=H2;H2.displayName='Text.H2';var H3=styledText('h3');exports.H3=H3;H3.displayName='Text.H3';var H4=styledText('h4');exports.H4=H4;H4.displayName='Text.H4';var H5=styledText('h5');exports.H5=H5;H5.displayName='Text.H5';var Small=styledText('small');exports.Small=Small;Small.displayName='Text.Small';var Tiny=styledText('tiny');exports.Tiny=Tiny;Tiny.displayName='Text.Tiny';var Light=styledText('light');exports.Light=Light;Light.displayName='Text.Light';var Regular=styledText('regular');exports.Regular=Regular;Regular.displayName='Text.Regular';var Medium=styledText('medium');exports.Medium=Medium;Medium.displayName='Text.Medium';var Bold=styledText('bold');exports.Bold=Bold;Bold.displayName='Text.Bold';var Black=styledText('black');exports.Black=Black;Black.displayName='Text.Black';var SectionTitle=styledText('sectionTitle');exports.SectionTitle=SectionTitle;SectionTitle.displayName='Text.SectionTitle';var SmallestException=styledText('smallestException');exports.SmallestException=SmallestException;SmallestException.displayName='Text.SmallestException';var TextRenderer=styledText('p');var Text=function Text(props){return _react["default"].createElement(TextRenderer,props);};exports.Text=Text;Text.displayName='Text';Text.propTypes={inverted:_propTypes.bool,variant:(0,_shared.deprecated)((0,_propTypes.oneOf)(['primary','secondary','vibin','hope','energy','relax','peace','verve','uplift','deepPurple','stamina','deep','medium','light','clear','white']),'Use `color` system prop instead'),size:(0,_shared.deprecated)((0,_propTypes.oneOf)(['xxsmall','xsmall','small','medium','large','xlarge','xxlarge','xxxlarge','huge']),'Use `fontSize` system prop instead'),light:_propTypes.bool};Text.defaultProps={inverted:false,variant:undefined,size:'medium',light:false};
1
+ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.Tiny=exports.Text=exports.SmallestException=exports.Small=exports.SectionTitle=exports.Regular=exports.Medium=exports.Light=exports.H5=exports.H4=exports.H3=exports.H2=exports.H1=exports.Bold=exports.Black=void 0;var _taggedTemplateLiteralLoose2=_interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _react=_interopRequireDefault(require("react"));var _styledComponents=_interopRequireDefault(require("styled-components"));var _propTypes=require("prop-types");var _yogaSystem=require("@gympass/yoga-system");var _textStyle=_interopRequireDefault(require("../textStyle"));var _shared=require("../../shared");var _templateObject;var styledText=function styledText(type){return _styledComponents["default"].Text(_templateObject||(_templateObject=(0,_taggedTemplateLiteralLoose2["default"])(["\n ","\n ","\n"])),(0,_textStyle["default"])(type),_yogaSystem.system);};var H1=styledText('h1');exports.H1=H1;H1.displayName='Text.H1';var H2=styledText('h2');exports.H2=H2;H2.displayName='Text.H2';var H3=styledText('h3');exports.H3=H3;H3.displayName='Text.H3';var H4=styledText('h4');exports.H4=H4;H4.displayName='Text.H4';var H5=styledText('h5');exports.H5=H5;H5.displayName='Text.H5';var Small=styledText('small');exports.Small=Small;Small.displayName='Text.Small';var Tiny=styledText('tiny');exports.Tiny=Tiny;Tiny.displayName='Text.Tiny';var Light=styledText('light');exports.Light=Light;Light.displayName='Text.Light';var Regular=styledText('regular');exports.Regular=Regular;Regular.displayName='Text.Regular';var Medium=styledText('medium');exports.Medium=Medium;Medium.displayName='Text.Medium';var Bold=styledText('bold');exports.Bold=Bold;Bold.displayName='Text.Bold';var Black=styledText('black');exports.Black=Black;Black.displayName='Text.Black';var SectionTitle=styledText('sectionTitle');exports.SectionTitle=SectionTitle;SectionTitle.displayName='Text.SectionTitle';var SmallestException=styledText('smallestException');exports.SmallestException=SmallestException;SmallestException.displayName='Text.SmallestException';var TextRenderer=styledText('p');var Text=function Text(props){return _react["default"].createElement(TextRenderer,props);};exports.Text=Text;Text.displayName='Text';var fontSizes=(0,_propTypes.oneOf)(['xxsmall','xsmall','small','medium','large','xlarge','xxlarge','xxxlarge','huge']);Text.propTypes={inverted:_propTypes.bool,variant:(0,_shared.deprecated)((0,_propTypes.oneOf)(['primary','secondary','vibin','hope','energy','relax','peace','verve','uplift','deepPurple','stamina','deep','medium','light','clear','white']),'Use `color` system prop instead'),size:(0,_shared.deprecated)(fontSizes,'Use `fontSize` system prop instead'),light:_propTypes.bool,fontSize:fontSizes};Text.defaultProps={inverted:false,variant:undefined,size:undefined,fontSize:'medium',light:false};
package/cjs/Text/sharedTextStyle.js CHANGED
@@ -15,12 +15,14 @@ var textStyle = function textStyle(type) {
15
15
  var light = _ref.light,
16
16
  variant = _ref.variant,
17
17
  inverted = _ref.inverted,
18
+ _ref$fontSize = _ref.fontSize,
19
+ fontSize = _ref$fontSize === void 0 ? 'medium' : _ref$fontSize,
18
20
  _ref$size = _ref.size,
19
21
  size = _ref$size === void 0 ? 'medium' : _ref$size,
20
22
  _ref$theme$yoga = _ref.theme.yoga,
21
23
  baseFont = _ref$theme$yoga.baseFont,
22
24
  fontWeights = _ref$theme$yoga.fontWeights,
23
- pSize = _ref$theme$yoga.fontSizes[size],
25
+ pSize = _ref$theme$yoga.fontSizes[size || fontSize],
24
26
  _ref$theme$yoga$color = _ref$theme$yoga.colors,
25
27
  color = _ref$theme$yoga$color[variant],
26
28
  text = _ref$theme$yoga$color.text,
package/cjs/Text/web/Text.js CHANGED
@@ -80,6 +80,7 @@ var Text = function Text(props) {
80
80
 
81
81
  exports.Text = Text;
82
82
  Text.displayName = 'Text';
83
+ var fontSizes = (0, _propTypes.oneOf)(['xxsmall', 'xsmall', 'small', 'medium', 'large', 'xlarge', 'xxlarge', 'xxxlarge', 'huge']);
83
84
  Text.propTypes = {
84
85
  inverted: _propTypes.bool,
85
86
  numberOfLines: _propTypes.number,
@@ -88,15 +89,17 @@ Text.propTypes = {
88
89
  variant: (0, _shared.deprecated)((0, _propTypes.oneOf)(['primary', 'secondary', 'vibin', 'hope', 'energy', 'relax', 'peace', 'verve', 'uplift', 'deepPurple', 'stamina', 'deep', 'medium', 'light', 'clear', 'white']), 'Use `color` system prop instead'),
89
90
 
90
91
  /** (deprecated: use fontSize instead) style the text following the theme */
91
- size: (0, _shared.deprecated)((0, _propTypes.oneOf)(['xxsmall', 'xsmall', 'small', 'medium', 'large', 'xlarge', 'xxlarge', 'xxxlarge', 'huge']), 'Use `fontSize` system prop instead'),
92
+ size: (0, _shared.deprecated)(fontSizes, 'Use `fontSize` system prop instead'),
92
93
 
93
94
  /** set the font-weight to regular */
94
- light: _propTypes.bool
95
+ light: _propTypes.bool,
96
+ fontSize: fontSizes
95
97
  };
96
98
  Text.defaultProps = {
97
99
  inverted: false,
98
100
  variant: undefined,
99
- size: 'medium',
101
+ size: undefined,
102
+ fontSize: 'medium',
100
103
  numberOfLines: undefined,
101
104
  light: false
102
105
  };
package/esm/AutoComplete/web/AutoComplete.js CHANGED
@@ -156,7 +156,8 @@ var AutoComplete = /*#__PURE__*/React.forwardRef(function (_ref6, ref) {
156
156
  onClick: handleOpenSuggestions,
157
157
  "aria-label": openSuggestionsAriaLabel
158
158
  }),
159
- ref: inputRef
159
+ ref: inputRef,
160
+ includeAriaAttributes: false
160
161
  })), isSuggestionsOpen && /*#__PURE__*/React.createElement(List, _extends({}, getMenuProps(), {
161
162
  full: full,
162
163
  error: !!error
package/esm/Dropdown/web/Dropdown.js CHANGED
@@ -129,7 +129,8 @@ var Dropdown = /*#__PURE__*/React.forwardRef(function (_ref10, ref) {
129
129
  isOpen: isOpen,
130
130
  label: label,
131
131
  full: full,
132
- ref: inputRef
132
+ ref: inputRef,
133
+ includeAriaAttributes: false
133
134
  }, getInputProps())), /*#__PURE__*/React.createElement(Button, _extends({
134
135
  isOpen: isOpen,
135
136
  disabled: disabled
package/esm/Heading/web/Title.js CHANGED
@@ -17,7 +17,7 @@ var Title = function Title(_ref) {
17
17
  w: "100%",
18
18
  textAlign: "center"
19
19
  }, /*#__PURE__*/React.createElement(Text.Medium, _extends({}, props, {
20
- size: "small",
20
+ fontSize: "small",
21
21
  as: "h1"
22
22
  }), children));
23
23
  };
package/esm/Input/web/Helper.js CHANGED
@@ -1,5 +1,7 @@
1
1
  var _templateObject, _templateObject2;
2
2
 
3
+ 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); }
4
+
3
5
  function _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.slice(0); } strings.raw = raw; return strings; }
4
6
 
5
7
  import React from 'react';
@@ -26,13 +28,17 @@ var Helper = function Helper(_ref3) {
26
28
  helper = _ref3.helper,
27
29
  maxLength = _ref3.maxLength,
28
30
  length = _ref3.length,
29
- hideMaxLength = _ref3.hideMaxLength;
31
+ hideMaxLength = _ref3.hideMaxLength,
32
+ a11yId = _ref3.a11yId;
30
33
  return /*#__PURE__*/React.createElement(Wrapper, {
31
34
  disabled: disabled,
32
35
  error: error
33
- }, (error || helper) && /*#__PURE__*/React.createElement(Info, {
34
- as: "span"
35
- }, error || helper), maxLength && !hideMaxLength && /*#__PURE__*/React.createElement(Info, {
36
+ }, (error || helper) && /*#__PURE__*/React.createElement(Info, _extends({
37
+ as: "span",
38
+ "aria-live": "polite"
39
+ }, a11yId && {
40
+ id: a11yId
41
+ }), error || helper), maxLength && !hideMaxLength && /*#__PURE__*/React.createElement(Info, {
36
42
  as: "span"
37
43
  }, length, "/", maxLength));
38
44
  };
@@ -43,7 +49,8 @@ Helper.propTypes = {
43
49
  helper: string,
44
50
  maxLength: number,
45
51
  length: number,
46
- hideMaxLength: bool
52
+ hideMaxLength: bool,
53
+ a11yId: string
47
54
  };
48
55
  Helper.defaultProps = {
49
56
  disabled: undefined,
@@ -51,6 +58,7 @@ Helper.defaultProps = {
51
58
  helper: undefined,
52
59
  maxLength: undefined,
53
60
  length: undefined,
54
- hideMaxLength: undefined
61
+ hideMaxLength: undefined,
62
+ a11yId: undefined
55
63
  };
56
64
  export default Helper;
package/esm/Input/web/Input.js CHANGED
@@ -1,4 +1,4 @@
1
- var _excluded = ["cleanable", "children", "disabled", "error", "full", "helper", "label", "maxLength", "readOnly", "style", "value", "onChange", "onClean", "hideMaxLength", "rightIcon"];
1
+ var _excluded = ["cleanable", "children", "disabled", "error", "full", "helper", "label", "maxLength", "readOnly", "style", "value", "onChange", "onClean", "hideMaxLength", "rightIcon", "a11yId", "includeAriaAttributes"];
2
2
 
3
3
  var _templateObject, _templateObject2, _templateObject3, _templateObject4;
4
4
 
@@ -48,6 +48,8 @@ var Input = /*#__PURE__*/React.forwardRef(function (_ref3, ref) {
48
48
  onClean = _ref3.onClean,
49
49
  hideMaxLength = _ref3.hideMaxLength,
50
50
  rightIcon = _ref3.rightIcon,
51
+ a11yId = _ref3.a11yId,
52
+ includeAriaAttributes = _ref3.includeAriaAttributes,
51
53
  props = _objectWithoutPropertiesLoose(_ref3, _excluded);
52
54
 
53
55
  var inputRef = ref || useRef(null);
@@ -60,6 +62,24 @@ var Input = /*#__PURE__*/React.forwardRef(function (_ref3, ref) {
60
62
  }
61
63
  };
62
64
 
65
+ var hasHelper = helper || maxLength || error;
66
+ var helperA11yId = includeAriaAttributes && a11yId && a11yId + "-helper";
67
+ var labelA11yId = includeAriaAttributes && a11yId && a11yId + "-label";
68
+ var a11yFieldProps;
69
+
70
+ if (includeAriaAttributes) {
71
+ a11yFieldProps = a11yId ? _extends({}, hasHelper && {
72
+ 'aria-describedby': helperA11yId
73
+ }, label && {
74
+ 'aria-labelledby': labelA11yId
75
+ }) : _extends({}, label && {
76
+ 'aria-label': label
77
+ });
78
+ a11yFieldProps['aria-invalid'] = !!error;
79
+ } else {
80
+ a11yFieldProps = {};
81
+ }
82
+
63
83
  return /*#__PURE__*/React.createElement(Control, {
64
84
  full: full
65
85
  }, /*#__PURE__*/React.createElement(Fieldset, {
@@ -80,10 +100,12 @@ var Input = /*#__PURE__*/React.forwardRef(function (_ref3, ref) {
80
100
  ref: inputRef,
81
101
  value: value,
82
102
  onChange: onChange
83
- })) : children, /*#__PURE__*/React.createElement(Label, {
103
+ }, a11yFieldProps)) : children, /*#__PURE__*/React.createElement(Label, _extends({
84
104
  error: error,
85
105
  disabled: disabled
86
- }, label), label && /*#__PURE__*/React.createElement(Legend, null, label), cleanable && !readOnly && value && /*#__PURE__*/React.createElement(IconWrapper, {
106
+ }, labelA11yId && {
107
+ id: labelA11yId
108
+ }), label), label && /*#__PURE__*/React.createElement(Legend, null, label), cleanable && !readOnly && value && /*#__PURE__*/React.createElement(IconWrapper, {
87
109
  tabIndex: 0,
88
110
  disabled: disabled,
89
111
  onClick: cleanField,
@@ -100,13 +122,14 @@ var Input = /*#__PURE__*/React.forwardRef(function (_ref3, ref) {
100
122
  width: 20,
101
123
  height: 20,
102
124
  role: "button"
103
- }, rightIcon)), (helper || maxLength || error) && /*#__PURE__*/React.createElement(Helper, {
125
+ }, rightIcon)), hasHelper && /*#__PURE__*/React.createElement(Helper, {
104
126
  error: error,
105
127
  helper: helper,
106
128
  maxLength: maxLength,
107
129
  length: value.length,
108
130
  disabled: disabled,
109
- hideMaxLength: hideMaxLength
131
+ hideMaxLength: hideMaxLength,
132
+ a11yId: helperA11yId
110
133
  }));
111
134
  });
112
135
  Input.propTypes = {
@@ -138,7 +161,13 @@ Input.propTypes = {
138
161
  /** when max length helper is unnecessary to appear */
139
162
  hideMaxLength: bool,
140
163
  placeholder: string,
141
- rightIcon: node
164
+ rightIcon: node,
165
+
166
+ /** a unique prefix to generate HTML IDs to be used for aria-labelledby and aria-describedby */
167
+ a11yId: string,
168
+
169
+ /** useful for components that extend the Input component and have their own ARIA attributes implementation (e.g. Dropdown) */
170
+ includeAriaAttributes: bool
142
171
  };
143
172
  Input.defaultProps = {
144
173
  className: undefined,
@@ -157,6 +186,8 @@ Input.defaultProps = {
157
186
  onClean: function onClean() {},
158
187
  hideMaxLength: false,
159
188
  placeholder: undefined,
160
- rightIcon: undefined
189
+ rightIcon: undefined,
190
+ a11yId: undefined,
191
+ includeAriaAttributes: true
161
192
  };
162
193
  export default Input;
package/esm/Input/web/Input.test.js CHANGED
@@ -61,6 +61,34 @@ describe('<Input />', function () {
61
61
 
62
62
  expect(container).toMatchSnapshot();
63
63
  });
64
+ it('should match with a11yId', function () {
65
+ var _render8 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Input, {
66
+ label: "Label",
67
+ a11yId: "id"
68
+ }))),
69
+ container = _render8.container;
70
+
71
+ expect(container).toMatchSnapshot();
72
+ });
73
+ it('should match with a11yId and error', function () {
74
+ var _render9 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Input, {
75
+ label: "Label",
76
+ a11yId: "id",
77
+ error: "Error message"
78
+ }))),
79
+ container = _render9.container;
80
+
81
+ expect(container).toMatchSnapshot();
82
+ });
83
+ it('should match with includeAriaAttributes set to false', function () {
84
+ var _render10 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Input, {
85
+ label: "Label",
86
+ includeAriaAttributes: false
87
+ }))),
88
+ container = _render10.container;
89
+
90
+ expect(container).toMatchSnapshot();
91
+ });
64
92
  });
65
93
  describe('Events', function () {
66
94
  it('should call onChange', function () {
@@ -101,11 +129,11 @@ describe('<Input />', function () {
101
129
  });
102
130
  describe('maxLength', function () {
103
131
  it('should update maxLength counter when add character', function () {
104
- var _render8 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Input, {
132
+ var _render11 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Input, {
105
133
  label: "Input",
106
134
  maxLength: 10
107
135
  }))),
108
- rerender = _render8.rerender;
136
+ rerender = _render11.rerender;
109
137
 
110
138
  expect(screen.getByText('0/10').textContent).toBe('0/10');
111
139
  rerender( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Input, {
@@ -128,10 +156,10 @@ describe('<Input />', function () {
128
156
  expect(onClean).toHaveBeenCalled();
129
157
  });
130
158
  it('should test if clean button is present', function () {
131
- var _render9 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Input, {
159
+ var _render12 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Input, {
132
160
  label: "Input"
133
161
  }))),
134
- rerender = _render9.rerender; // closeButton
162
+ rerender = _render12.rerender; // closeButton
135
163
 
136
164
 
137
165
  expect(screen.queryByRole('button')).toBeNull();
package/esm/Text/native/Text.js CHANGED
@@ -48,6 +48,7 @@ var Text = function Text(props) {
48
48
  };
49
49
 
50
50
  Text.displayName = 'Text';
51
+ var fontSizes = oneOf(['xxsmall', 'xsmall', 'small', 'medium', 'large', 'xlarge', 'xxlarge', 'xxxlarge', 'huge']);
51
52
  Text.propTypes = {
52
53
  inverted: bool,
53
54
 
@@ -55,15 +56,17 @@ Text.propTypes = {
55
56
  variant: deprecated(oneOf(['primary', 'secondary', 'vibin', 'hope', 'energy', 'relax', 'peace', 'verve', 'uplift', 'deepPurple', 'stamina', 'deep', 'medium', 'light', 'clear', 'white']), 'Use `color` system prop instead'),
56
57
 
57
58
  /** (deprecated: use fontSize instead) style the text following the theme */
58
- size: deprecated(oneOf(['xxsmall', 'xsmall', 'small', 'medium', 'large', 'xlarge', 'xxlarge', 'xxxlarge', 'huge']), 'Use `fontSize` system prop instead'),
59
+ size: deprecated(fontSizes, 'Use `fontSize` system prop instead'),
59
60
 
60
61
  /** set the font-weight to regular */
61
- light: bool
62
+ light: bool,
63
+ fontSize: fontSizes
62
64
  };
63
65
  Text.defaultProps = {
64
66
  inverted: false,
65
67
  variant: undefined,
66
- size: 'medium',
68
+ size: undefined,
69
+ fontSize: 'medium',
67
70
  light: false
68
71
  };
69
72
  export { Text, H1, H2, H3, H4, H5, Small, Tiny, Light, Regular, Medium, Bold, Black, SectionTitle, SmallestException };
package/esm/Text/native/Text.test.js CHANGED
@@ -34,8 +34,22 @@ describe('<Text />', function () {
34
34
 
35
35
  expect(toJSON()).toMatchSnapshot();
36
36
  });
37
- it('should match snapshot with Text size', function () {
37
+ it('should match snapshot with Text fontSize', function () {
38
38
  var _render4 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Text.Small, {
39
+ fontSize: "xsmall"
40
+ }, "Live the small mission"), /*#__PURE__*/React.createElement(Text.Tiny, {
41
+ fontSize: "medium"
42
+ }, "Live the medium mission"), /*#__PURE__*/React.createElement(Text.Regular, {
43
+ fontSize: "xlarge"
44
+ }, "Live the xlarge mission"), /*#__PURE__*/React.createElement(Text.Medium, {
45
+ fontSize: "xxxlarge"
46
+ }, "Live the xxxlarge mission"))),
47
+ toJSON = _render4.toJSON;
48
+
49
+ expect(toJSON()).toMatchSnapshot();
50
+ });
51
+ it('should match snapshot with Text size', function () {
52
+ var _render5 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Text.Small, {
39
53
  size: "xsmall"
40
54
  }, "Live the small mission"), /*#__PURE__*/React.createElement(Text.Tiny, {
41
55
  size: "medium"
@@ -44,104 +58,104 @@ describe('<Text />', function () {
44
58
  }, "Live the xlarge mission"), /*#__PURE__*/React.createElement(Text.Medium, {
45
59
  size: "xxxlarge"
46
60
  }, "Live the xxxlarge mission"))),
47
- toJSON = _render4.toJSON;
61
+ toJSON = _render5.toJSON;
48
62
 
49
63
  expect(toJSON()).toMatchSnapshot();
50
64
  });
51
65
  it('should match snapshot with inverted Text', function () {
52
- var _render5 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Text, {
66
+ var _render6 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Text, {
53
67
  inverted: true
54
68
  }, "Live the mission"))),
55
- toJSON = _render5.toJSON;
69
+ toJSON = _render6.toJSON;
56
70
 
57
71
  expect(toJSON()).toMatchSnapshot();
58
72
  });
59
73
  it('should match snapshot with truncated lines Text', function () {
60
- var _render6 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Text, {
74
+ var _render7 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Text, {
61
75
  numberOfLines: 1
62
76
  }, "Live the mission", /*#__PURE__*/React.createElement("br", null), "even in one line"))),
63
- toJSON = _render6.toJSON;
77
+ toJSON = _render7.toJSON;
64
78
 
65
79
  expect(toJSON()).toMatchSnapshot();
66
80
  });
67
81
  it('should match snapshot with border prop system', function () {
68
- var _render7 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Text, {
82
+ var _render8 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Text, {
69
83
  border: "small",
70
84
  bRadius: "small"
71
85
  }, "Live the mission"))),
72
- toJSON = _render7.toJSON;
86
+ toJSON = _render8.toJSON;
73
87
 
74
88
  expect(toJSON()).toMatchSnapshot();
75
89
  });
76
90
  it('should match snapshot with background color prop system', function () {
77
- var _render8 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Text, {
91
+ var _render9 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Text, {
78
92
  backgroundColor: "vibin"
79
93
  }, "Live the mission"))),
80
- toJSON = _render8.toJSON;
94
+ toJSON = _render9.toJSON;
81
95
 
82
96
  expect(toJSON()).toMatchSnapshot();
83
97
  });
84
98
  it('should match snapshot with elevation prop system', function () {
85
- var _render9 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Text, {
99
+ var _render10 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Text, {
86
100
  elevation: "medium"
87
101
  }, "Live the mission"))),
88
- toJSON = _render9.toJSON;
102
+ toJSON = _render10.toJSON;
89
103
 
90
104
  expect(toJSON()).toMatchSnapshot();
91
105
  });
92
106
  it('should match snapshot with spacing prop system', function () {
93
- var _render10 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Text, {
107
+ var _render11 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Text, {
94
108
  m: "medium",
95
109
  paddingVertical: "large",
96
110
  paddingHorizontal: "small"
97
111
  }, "Live the mission"))),
98
- toJSON = _render10.toJSON;
112
+ toJSON = _render11.toJSON;
99
113
 
100
114
  expect(toJSON()).toMatchSnapshot();
101
115
  });
102
116
  it('should match snapshot with typography prop system', function () {
103
- var _render11 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Text, {
117
+ var _render12 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Text, {
104
118
  color: "text.primary",
105
119
  fontSize: "small",
106
120
  fontWeight: "medium",
107
121
  lineHeight: "small"
108
122
  }, "Live the mission"))),
109
- toJSON = _render11.toJSON;
123
+ toJSON = _render12.toJSON;
110
124
 
111
125
  expect(toJSON()).toMatchSnapshot();
112
126
  });
113
127
  it('should match snapshot with display prop system', function () {
114
- var _render12 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Text, {
128
+ var _render13 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Text, {
115
129
  display: "flex"
116
130
  }, "Live the mission"))),
117
- toJSON = _render12.toJSON;
131
+ toJSON = _render13.toJSON;
118
132
 
119
133
  expect(toJSON()).toMatchSnapshot();
120
134
  });
121
135
  it('should match snapshot with position prop system', function () {
122
- var _render13 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Text, {
136
+ var _render14 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Text, {
123
137
  position: "absolute",
124
138
  top: "small",
125
139
  left: "small"
126
140
  }, "Live the mission"))),
127
- toJSON = _render13.toJSON;
141
+ toJSON = _render14.toJSON;
128
142
 
129
143
  expect(toJSON()).toMatchSnapshot();
130
144
  });
131
145
  it('should match snapshot with flexes prop system', function () {
132
- var _render14 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Text, {
146
+ var _render15 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Text, {
133
147
  display: "flex",
134
148
  flexGrow: 1
135
149
  }, "Live the mission"))),
136
- toJSON = _render14.toJSON;
150
+ toJSON = _render15.toJSON;
137
151
 
138
152
  expect(toJSON()).toMatchSnapshot();
139
153
  });
140
154
  it('should match snapshot with overflows prop system', function () {
141
- var _render15 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Text, {
155
+ var _render16 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Text, {
142
156
  overflow: "scroll"
143
157
  }, "Live the mission"))),
144
- toJSON = _render15.toJSON;
158
+ toJSON = _render16.toJSON;
145
159
 
146
160
  expect(toJSON()).toMatchSnapshot();
147
161
  });
package/esm/Text/sharedTextStyle.js CHANGED
@@ -10,12 +10,14 @@ var textStyle = function textStyle(type) {
10
10
  var light = _ref.light,
11
11
  variant = _ref.variant,
12
12
  inverted = _ref.inverted,
13
+ _ref$fontSize = _ref.fontSize,
14
+ fontSize = _ref$fontSize === void 0 ? 'medium' : _ref$fontSize,
13
15
  _ref$size = _ref.size,
14
16
  size = _ref$size === void 0 ? 'medium' : _ref$size,
15
17
  _ref$theme$yoga = _ref.theme.yoga,
16
18
  baseFont = _ref$theme$yoga.baseFont,
17
19
  fontWeights = _ref$theme$yoga.fontWeights,
18
- pSize = _ref$theme$yoga.fontSizes[size],
20
+ pSize = _ref$theme$yoga.fontSizes[size || fontSize],
19
21
  _ref$theme$yoga$color = _ref$theme$yoga.colors,
20
22
  color = _ref$theme$yoga$color[variant],
21
23
  text = _ref$theme$yoga$color.text,
package/esm/Text/web/Text.js CHANGED
@@ -52,6 +52,7 @@ var Text = function Text(props) {
52
52
  };
53
53
 
54
54
  Text.displayName = 'Text';
55
+ var fontSizes = oneOf(['xxsmall', 'xsmall', 'small', 'medium', 'large', 'xlarge', 'xxlarge', 'xxxlarge', 'huge']);
55
56
  Text.propTypes = {
56
57
  inverted: bool,
57
58
  numberOfLines: number,
@@ -60,15 +61,17 @@ Text.propTypes = {
60
61
  variant: deprecated(oneOf(['primary', 'secondary', 'vibin', 'hope', 'energy', 'relax', 'peace', 'verve', 'uplift', 'deepPurple', 'stamina', 'deep', 'medium', 'light', 'clear', 'white']), 'Use `color` system prop instead'),
61
62
 
62
63
  /** (deprecated: use fontSize instead) style the text following the theme */
63
- size: deprecated(oneOf(['xxsmall', 'xsmall', 'small', 'medium', 'large', 'xlarge', 'xxlarge', 'xxxlarge', 'huge']), 'Use `fontSize` system prop instead'),
64
+ size: deprecated(fontSizes, 'Use `fontSize` system prop instead'),
64
65
 
65
66
  /** set the font-weight to regular */
66
- light: bool
67
+ light: bool,
68
+ fontSize: fontSizes
67
69
  };
68
70
  Text.defaultProps = {
69
71
  inverted: false,
70
72
  variant: undefined,
71
- size: 'medium',
73
+ size: undefined,
74
+ fontSize: 'medium',
72
75
  numberOfLines: undefined,
73
76
  light: false
74
77
  };
package/esm/Text/web/Text.test.js CHANGED
@@ -34,8 +34,22 @@ describe('<Text />', function () {
34
34
 
35
35
  expect(container).toMatchSnapshot();
36
36
  });
37
- it('should match snapshot with Text size', function () {
37
+ it('should match snapshot with Text fontSize', function () {
38
38
  var _render4 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Text.Small, {
39
+ fontSize: "xsmall"
40
+ }, "Live the small mission"), /*#__PURE__*/React.createElement(Text.Tiny, {
41
+ fontSize: "medium"
42
+ }, "Live the medium mission"), /*#__PURE__*/React.createElement(Text.Regular, {
43
+ fontSize: "xlarge"
44
+ }, "Live the xlarge mission"), /*#__PURE__*/React.createElement(Text.Medium, {
45
+ fontSize: "xxxlarge"
46
+ }, "Live the xxxlarge mission"))),
47
+ container = _render4.container;
48
+
49
+ expect(container).toMatchSnapshot();
50
+ });
51
+ it('should match snapshot with Text size', function () {
52
+ var _render5 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Text.Small, {
39
53
  size: "xsmall"
40
54
  }, "Live the small mission"), /*#__PURE__*/React.createElement(Text.Tiny, {
41
55
  size: "medium"
@@ -44,104 +58,104 @@ describe('<Text />', function () {
44
58
  }, "Live the xlarge mission"), /*#__PURE__*/React.createElement(Text.Medium, {
45
59
  size: "xxxlarge"
46
60
  }, "Live the xxxlarge mission"))),
47
- container = _render4.container;
61
+ container = _render5.container;
48
62
 
49
63
  expect(container).toMatchSnapshot();
50
64
  });
51
65
  it('should match snapshot with inverted Text', function () {
52
- var _render5 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Text, {
66
+ var _render6 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Text, {
53
67
  inverted: true
54
68
  }, "Live the mission"))),
55
- container = _render5.container;
69
+ container = _render6.container;
56
70
 
57
71
  expect(container).toMatchSnapshot();
58
72
  });
59
73
  it('should match snapshot with truncated lines Text', function () {
60
- var _render6 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Text, {
74
+ var _render7 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Text, {
61
75
  numberOfLines: 1
62
76
  }, "Live the mission", /*#__PURE__*/React.createElement("br", null), "even in one line"))),
63
- container = _render6.container;
77
+ container = _render7.container;
64
78
 
65
79
  expect(container).toMatchSnapshot();
66
80
  });
67
81
  it('should match snapshot with border prop system', function () {
68
- var _render7 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Text, {
82
+ var _render8 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Text, {
69
83
  border: "small",
70
84
  bRadius: "small"
71
85
  }, "Live the mission"))),
72
- container = _render7.container;
86
+ container = _render8.container;
73
87
 
74
88
  expect(container).toMatchSnapshot();
75
89
  });
76
90
  it('should match snapshot with background color prop system', function () {
77
- var _render8 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Text, {
91
+ var _render9 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Text, {
78
92
  backgroundColor: "vibin"
79
93
  }, "Live the mission"))),
80
- container = _render8.container;
94
+ container = _render9.container;
81
95
 
82
96
  expect(container).toMatchSnapshot();
83
97
  });
84
98
  it('should match snapshot with elevation prop system', function () {
85
- var _render9 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Text, {
99
+ var _render10 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Text, {
86
100
  elevation: "medium"
87
101
  }, "Live the mission"))),
88
- container = _render9.container;
102
+ container = _render10.container;
89
103
 
90
104
  expect(container).toMatchSnapshot();
91
105
  });
92
106
  it('should match snapshot with spacing prop system', function () {
93
- var _render10 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Text, {
107
+ var _render11 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Text, {
94
108
  m: "medium",
95
109
  paddingVertical: "large",
96
110
  paddingHorizontal: "small"
97
111
  }, "Live the mission"))),
98
- container = _render10.container;
112
+ container = _render11.container;
99
113
 
100
114
  expect(container).toMatchSnapshot();
101
115
  });
102
116
  it('should match snapshot with typography prop system', function () {
103
- var _render11 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Text, {
117
+ var _render12 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Text, {
104
118
  color: "text.primary",
105
119
  fontSize: "small",
106
120
  fontWeight: "medium",
107
121
  lineHeight: "small"
108
122
  }, "Live the mission"))),
109
- container = _render11.container;
123
+ container = _render12.container;
110
124
 
111
125
  expect(container).toMatchSnapshot();
112
126
  });
113
127
  it('should match snapshot with display prop system', function () {
114
- var _render12 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Text, {
128
+ var _render13 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Text, {
115
129
  display: "inline-flex"
116
130
  }, "Live the mission"))),
117
- container = _render12.container;
131
+ container = _render13.container;
118
132
 
119
133
  expect(container).toMatchSnapshot();
120
134
  });
121
135
  it('should match snapshot with position prop system', function () {
122
- var _render13 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Text, {
136
+ var _render14 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Text, {
123
137
  position: "fixed",
124
138
  top: "small",
125
139
  left: "small"
126
140
  }, "Live the mission"))),
127
- container = _render13.container;
141
+ container = _render14.container;
128
142
 
129
143
  expect(container).toMatchSnapshot();
130
144
  });
131
145
  it('should match snapshot with flexes prop system', function () {
132
- var _render14 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Text, {
146
+ var _render15 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Text, {
133
147
  display: "flex",
134
148
  flexGrow: 1
135
149
  }, "Live the mission"))),
136
- container = _render14.container;
150
+ container = _render15.container;
137
151
 
138
152
  expect(container).toMatchSnapshot();
139
153
  });
140
154
  it('should match snapshot with overflows prop system', function () {
141
- var _render15 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Text, {
155
+ var _render16 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Text, {
142
156
  overflow: "scroll"
143
157
  }, "Live the mission"))),
144
- container = _render15.container;
158
+ container = _render16.container;
145
159
 
146
160
  expect(container).toMatchSnapshot();
147
161
  });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gympass/yoga",
3
- "version": "7.70.1",
3
+ "version": "7.71.0",
4
4
  "description": "Gympass component library",
5
5
  "main": "./cjs",
6
6
  "sideEffects": false,
@@ -53,7 +53,7 @@
53
53
  "react": ">=16",
54
54
  "styled-components": "^4.4.0"
55
55
  },
56
- "gitHead": "29cc52332ff1c6d5a8c39828ddcb0bc5ee611373",
56
+ "gitHead": "9dab18e17e33d1ce97064c09c9ccf722c647e8a9",
57
57
  "module": "./esm",
58
58
  "private": false,
59
59
  "react-native": "./cjs/index.native.js"