@gympass/yoga 7.91.0 → 7.91.1

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 (9) hide show
  1. package/cjs/Button/native/Link.js +6 -2
  2. package/cjs/Button/native/Text.js +5 -1
  3. package/cjs/Button/web/Link.js +19 -0
  4. package/cjs/Button/web/Text.js +25 -0
  5. package/esm/Button/native/Link.js +6 -2
  6. package/esm/Button/native/Text.js +5 -1
  7. package/esm/Button/web/Link.js +19 -0
  8. package/esm/Button/web/Text.js +25 -0
  9. package/package.json +2 -2
package/cjs/Button/native/Link.js CHANGED
@@ -73,9 +73,13 @@ const Link = (0, import_styled_components.default)(import_Button.Label)`
73
73
  const state = secondary ? "secondary" : "primary";
74
74
  return `
75
75
  color: ${link.font[state].color};
76
+ text-decoration: underline;
77
+ text-decoration-color: ${link.font[state].color};
76
78
 
77
- ${disabled ? `color: ${link.font.disabled.color};` : ""}
78
- ${!disabled && pressed ? `color: ${(0, import_yoga_common.hexToRgb)(link.font[state].color, 0.75)};` : ""}
79
+ ${disabled ? `color: ${link.font.disabled.color};
80
+ text-decoration-color: ${link.font.disabled.color};` : ""}
81
+ ${!disabled && pressed ? `color: ${(0, import_yoga_common.hexToRgb)(link.font[state].color, 0.75)};
82
+ text-decoration-color: ${(0, import_yoga_common.hexToRgb)(link.font[state].color, 0.75)};` : ""}
79
83
  `;
80
84
  }}
81
85
  `;
package/cjs/Button/native/Text.js CHANGED
@@ -67,7 +67,11 @@ var import_yoga_common = require("@gympass/yoga-common");
67
67
  var import_withTouchable = __toESM(require("./withTouchable"));
68
68
  var import_Button = require("./Button");
69
69
  const LabelText = (0, import_styled_components.default)(import_Button.Label)`
70
- ${({ color }) => `color: ${color};`}
70
+ ${({ color }) => `
71
+ color: ${color};
72
+ text-decoration: underline;
73
+ text-decoration-color: ${color};
74
+ `},
71
75
  `;
72
76
  const ButtonContainerText = (0, import_styled_components.default)(import_Button.ButtonContainer)`
73
77
  ${({
package/cjs/Button/web/Link.js CHANGED
@@ -84,12 +84,18 @@ const Link = (0, import_styled_components.default)(import_Button.default)`
84
84
  border: none;
85
85
  border-radius: 0;
86
86
  color: ${button.types.link.font[state].color};
87
+ text-decoration: underline;
88
+ text-decoration-color: ${button.types.link.font[state].color};
87
89
 
88
90
  svg {
89
91
  margin-right: ${button.types.link.icon.margin.right}px;
90
92
  fill: ${button.types.link.font[state].color};
91
93
  }
92
94
 
95
+ &:not([disabled]):link {
96
+ text-decoration: underline;
97
+ }
98
+
93
99
  &:disabled,
94
100
  &:not([disabled]):hover,
95
101
  &:not([disabled]):focus,
@@ -101,6 +107,11 @@ const Link = (0, import_styled_components.default)(import_Button.default)`
101
107
  &:not([disabled]):hover {
102
108
  color: ${(0, import_yoga_common.hexToRgb)(button.types.link.font[state].color, 0.5)};
103
109
 
110
+ text-decoration-color: ${(0, import_yoga_common.hexToRgb)(
111
+ button.types.link.font[state].color,
112
+ 0.5
113
+ )};
114
+
104
115
  svg {
105
116
  fill: ${(0, import_yoga_common.hexToRgb)(button.types.link.font[state].color, 0.5)};
106
117
  }
@@ -109,6 +120,11 @@ const Link = (0, import_styled_components.default)(import_Button.default)`
109
120
  &:not([disabled]):focus, &:not([disabled]):active {
110
121
  color: ${(0, import_yoga_common.hexToRgb)(button.types.link.font[state].color, 0.75)};
111
122
 
123
+ text-decoration-color: ${(0, import_yoga_common.hexToRgb)(
124
+ button.types.link.font[state].color,
125
+ 0.75
126
+ )};
127
+
112
128
  svg {
113
129
  fill: ${(0, import_yoga_common.hexToRgb)(button.types.link.font[state].color, 0.75)};
114
130
  }
@@ -117,6 +133,9 @@ const Link = (0, import_styled_components.default)(import_Button.default)`
117
133
  &:disabled {
118
134
  color: ${button.types.link.font.disabled.color};
119
135
 
136
+ text-decoration: underline;
137
+ text-decoration-color: ${button.types.link.font.disabled.color};
138
+
120
139
  svg {
121
140
  fill: ${button.types.link.font.disabled.color};
122
141
  }
package/cjs/Button/web/Text.js CHANGED
@@ -82,11 +82,17 @@ const StyledButton = (0, import_styled_components.default)(import_Button.default
82
82
  background-color: ${button.types.text.backgroundColor};
83
83
  border-color: ${button.types.text.backgroundColor};
84
84
  color: ${colors[state]};
85
+ text-decoration: underline;
86
+ text-decoration-color: ${button.types.link.font[state].color};
85
87
 
86
88
  svg {
87
89
  fill: ${colors[state]};
88
90
  }
89
91
 
92
+ &:not([disabled]):link {
93
+ text-decoration: underline;
94
+ }
95
+
90
96
  &:not([disabled]):hover, &:not([disabled]):focus, &:not([disabled]):active {
91
97
  background-color: ${button.types.text.backgroundColor};
92
98
  box-shadow: none;
@@ -94,6 +100,9 @@ const StyledButton = (0, import_styled_components.default)(import_Button.default
94
100
 
95
101
  &:not([disabled]):hover {
96
102
  color: ${(0, import_yoga_common.hexToRgb)(colors[state], 0.5)};
103
+
104
+ text-decoration-color: ${(0, import_yoga_common.hexToRgb)(colors[state], 0.5)};
105
+
97
106
  svg {
98
107
  fill: ${(0, import_yoga_common.hexToRgb)(colors[state], 0.5)};
99
108
  }
@@ -101,6 +110,9 @@ const StyledButton = (0, import_styled_components.default)(import_Button.default
101
110
 
102
111
  &:not([disabled]):focus, &:not([disabled]):active {
103
112
  color: ${(0, import_yoga_common.hexToRgb)(colors[state], 0.75)};
113
+
114
+ text-decoration-color: ${(0, import_yoga_common.hexToRgb)(colors[state], 0.75)};
115
+
104
116
  svg {
105
117
  fill: ${(0, import_yoga_common.hexToRgb)(colors[state], 0.75)};
106
118
  }
@@ -108,12 +120,18 @@ const StyledButton = (0, import_styled_components.default)(import_Button.default
108
120
 
109
121
  ${inverted ? `
110
122
  color: ${colors.white};
123
+
124
+ text-decoration-color: ${colors.white};
125
+
111
126
  svg {
112
127
  fill: ${colors.white};
113
128
  }
114
129
 
115
130
  &:not([disabled]):hover {
116
131
  color: ${(0, import_yoga_common.hexToRgb)(colors.white, 0.5)};
132
+
133
+ text-decoration-color: ${(0, import_yoga_common.hexToRgb)(colors.white, 0.5)};
134
+
117
135
  svg {
118
136
  fill: ${(0, import_yoga_common.hexToRgb)(colors.white, 0.5)};
119
137
  }
@@ -121,6 +139,9 @@ const StyledButton = (0, import_styled_components.default)(import_Button.default
121
139
 
122
140
  &:not([disabled]):focus, &:not([disabled]):active {
123
141
  color: ${(0, import_yoga_common.hexToRgb)(colors.white, 0.75)};
142
+
143
+ text-decoration-color: ${(0, import_yoga_common.hexToRgb)(colors.white, 0.75)};
144
+
124
145
  svg {
125
146
  fill: ${(0, import_yoga_common.hexToRgb)(colors.white, 0.75)};
126
147
  }
@@ -131,6 +152,10 @@ const StyledButton = (0, import_styled_components.default)(import_Button.default
131
152
  background-color: ${button.types.text.backgroundColor};
132
153
  border-color: ${button.types.text.backgroundColor};
133
154
  color: ${button.types.text.disabled};
155
+
156
+ text-decoration: underline;
157
+ text-decoration-color: ${button.types.text.disabled};
158
+
134
159
  svg {
135
160
  fill: ${button.types.text.disabled};
136
161
  }
package/esm/Button/native/Link.js CHANGED
@@ -42,9 +42,13 @@ const Link = styled(Label)`
42
42
  const state = secondary ? "secondary" : "primary";
43
43
  return `
44
44
  color: ${link.font[state].color};
45
+ text-decoration: underline;
46
+ text-decoration-color: ${link.font[state].color};
45
47
 
46
- ${disabled ? `color: ${link.font.disabled.color};` : ""}
47
- ${!disabled && pressed ? `color: ${hexToRgb(link.font[state].color, 0.75)};` : ""}
48
+ ${disabled ? `color: ${link.font.disabled.color};
49
+ text-decoration-color: ${link.font.disabled.color};` : ""}
50
+ ${!disabled && pressed ? `color: ${hexToRgb(link.font[state].color, 0.75)};
51
+ text-decoration-color: ${hexToRgb(link.font[state].color, 0.75)};` : ""}
48
52
  `;
49
53
  }}
50
54
  `;
package/esm/Button/native/Text.js CHANGED
@@ -36,7 +36,11 @@ import { hexToRgb } from "@gympass/yoga-common";
36
36
  import withTouchable from "./withTouchable";
37
37
  import { Label, ButtonContainer } from "./Button";
38
38
  const LabelText = styled(Label)`
39
- ${({ color }) => `color: ${color};`}
39
+ ${({ color }) => `
40
+ color: ${color};
41
+ text-decoration: underline;
42
+ text-decoration-color: ${color};
43
+ `},
40
44
  `;
41
45
  const ButtonContainerText = styled(ButtonContainer)`
42
46
  ${({
package/esm/Button/web/Link.js CHANGED
@@ -53,12 +53,18 @@ const Link = styled(Button)`
53
53
  border: none;
54
54
  border-radius: 0;
55
55
  color: ${button.types.link.font[state].color};
56
+ text-decoration: underline;
57
+ text-decoration-color: ${button.types.link.font[state].color};
56
58
 
57
59
  svg {
58
60
  margin-right: ${button.types.link.icon.margin.right}px;
59
61
  fill: ${button.types.link.font[state].color};
60
62
  }
61
63
 
64
+ &:not([disabled]):link {
65
+ text-decoration: underline;
66
+ }
67
+
62
68
  &:disabled,
63
69
  &:not([disabled]):hover,
64
70
  &:not([disabled]):focus,
@@ -70,6 +76,11 @@ const Link = styled(Button)`
70
76
  &:not([disabled]):hover {
71
77
  color: ${hexToRgb(button.types.link.font[state].color, 0.5)};
72
78
 
79
+ text-decoration-color: ${hexToRgb(
80
+ button.types.link.font[state].color,
81
+ 0.5
82
+ )};
83
+
73
84
  svg {
74
85
  fill: ${hexToRgb(button.types.link.font[state].color, 0.5)};
75
86
  }
@@ -78,6 +89,11 @@ const Link = styled(Button)`
78
89
  &:not([disabled]):focus, &:not([disabled]):active {
79
90
  color: ${hexToRgb(button.types.link.font[state].color, 0.75)};
80
91
 
92
+ text-decoration-color: ${hexToRgb(
93
+ button.types.link.font[state].color,
94
+ 0.75
95
+ )};
96
+
81
97
  svg {
82
98
  fill: ${hexToRgb(button.types.link.font[state].color, 0.75)};
83
99
  }
@@ -86,6 +102,9 @@ const Link = styled(Button)`
86
102
  &:disabled {
87
103
  color: ${button.types.link.font.disabled.color};
88
104
 
105
+ text-decoration: underline;
106
+ text-decoration-color: ${button.types.link.font.disabled.color};
107
+
89
108
  svg {
90
109
  fill: ${button.types.link.font.disabled.color};
91
110
  }
package/esm/Button/web/Text.js CHANGED
@@ -51,11 +51,17 @@ const StyledButton = styled(Button)`
51
51
  background-color: ${button.types.text.backgroundColor};
52
52
  border-color: ${button.types.text.backgroundColor};
53
53
  color: ${colors[state]};
54
+ text-decoration: underline;
55
+ text-decoration-color: ${button.types.link.font[state].color};
54
56
 
55
57
  svg {
56
58
  fill: ${colors[state]};
57
59
  }
58
60
 
61
+ &:not([disabled]):link {
62
+ text-decoration: underline;
63
+ }
64
+
59
65
  &:not([disabled]):hover, &:not([disabled]):focus, &:not([disabled]):active {
60
66
  background-color: ${button.types.text.backgroundColor};
61
67
  box-shadow: none;
@@ -63,6 +69,9 @@ const StyledButton = styled(Button)`
63
69
 
64
70
  &:not([disabled]):hover {
65
71
  color: ${hexToRgb(colors[state], 0.5)};
72
+
73
+ text-decoration-color: ${hexToRgb(colors[state], 0.5)};
74
+
66
75
  svg {
67
76
  fill: ${hexToRgb(colors[state], 0.5)};
68
77
  }
@@ -70,6 +79,9 @@ const StyledButton = styled(Button)`
70
79
 
71
80
  &:not([disabled]):focus, &:not([disabled]):active {
72
81
  color: ${hexToRgb(colors[state], 0.75)};
82
+
83
+ text-decoration-color: ${hexToRgb(colors[state], 0.75)};
84
+
73
85
  svg {
74
86
  fill: ${hexToRgb(colors[state], 0.75)};
75
87
  }
@@ -77,12 +89,18 @@ const StyledButton = styled(Button)`
77
89
 
78
90
  ${inverted ? `
79
91
  color: ${colors.white};
92
+
93
+ text-decoration-color: ${colors.white};
94
+
80
95
  svg {
81
96
  fill: ${colors.white};
82
97
  }
83
98
 
84
99
  &:not([disabled]):hover {
85
100
  color: ${hexToRgb(colors.white, 0.5)};
101
+
102
+ text-decoration-color: ${hexToRgb(colors.white, 0.5)};
103
+
86
104
  svg {
87
105
  fill: ${hexToRgb(colors.white, 0.5)};
88
106
  }
@@ -90,6 +108,9 @@ const StyledButton = styled(Button)`
90
108
 
91
109
  &:not([disabled]):focus, &:not([disabled]):active {
92
110
  color: ${hexToRgb(colors.white, 0.75)};
111
+
112
+ text-decoration-color: ${hexToRgb(colors.white, 0.75)};
113
+
93
114
  svg {
94
115
  fill: ${hexToRgb(colors.white, 0.75)};
95
116
  }
@@ -100,6 +121,10 @@ const StyledButton = styled(Button)`
100
121
  background-color: ${button.types.text.backgroundColor};
101
122
  border-color: ${button.types.text.backgroundColor};
102
123
  color: ${button.types.text.disabled};
124
+
125
+ text-decoration: underline;
126
+ text-decoration-color: ${button.types.text.disabled};
127
+
103
128
  svg {
104
129
  fill: ${button.types.text.disabled};
105
130
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gympass/yoga",
3
- "version": "7.91.0",
3
+ "version": "7.91.1",
4
4
  "description": "Gympass component library",
5
5
  "main": "./cjs",
6
6
  "types": "./typings/index.d.ts",
@@ -57,7 +57,7 @@
57
57
  "react-native": "0.72.3",
58
58
  "styled-components": "^4.4.0"
59
59
  },
60
- "gitHead": "7a0f5076e3001d2739d4e4bf161124cd4e020496",
60
+ "gitHead": "9cdfae959a192ee74b28474e57056d175b734906",
61
61
  "module": "./esm",
62
62
  "private": false,
63
63
  "react-native": "./cjs/index.native.js"