@pedidopago/ui 1.5.5 → 1.5.6

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 (5) hide show
  1. package/dist/components/Button/styles.d.ts.map +1 -1
  2. package/dist/components/Button/styles.js +55 -33
  3. package/dist/components/Tooltip/styles.d.ts.map +1 -1
  4. package/dist/components/Tooltip/styles.js +1 -1
  5. package/package.json +1 -1
package/dist/components/Button/styles.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/components/Button/styles.ts"],"names":[],"mappings":";AAGA,OAAO,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAGtC,eAAO,MAAM,eAAe;;;mIAgI3B,CAAC;AAEF,eAAO,MAAM,aAAa;;;yGAKzB,CAAC;AAEF,eAAO,MAAM,WAAW;;;yGAIvB,CAAC"}
1
+ {"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/components/Button/styles.ts"],"names":[],"mappings":";AAGA,OAAO,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAGtC,eAAO,MAAM,eAAe;;;mIA4I3B,CAAC;AAEF,eAAO,MAAM,aAAa;;;yGAKzB,CAAC;AAEF,eAAO,MAAM,WAAW;;;yGAIvB,CAAC"}
package/dist/components/Button/styles.js CHANGED
@@ -19,24 +19,46 @@ function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" =
19
19
 
20
20
  function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
21
21
 
22
- var ButtonContainer = _styled.default.button(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n font-family: inherit;\n font-weight: ", ";\n font-size: ", ";\n border-radius: 8px;\n border: 0px;\n cursor: pointer;\n\n --button-brightness: brightness(0.85);\n\n transition: all 0.15s ease-in-out;\n\n color: ", ";\n\n background-color: ", ";\n\n width: ", ";\n\n &:disabled {\n filter: opacity(0.5);\n cursor: default;\n pointer-events: none;\n }\n\n ", "\n\n @media screen and (min-width: ", ") {\n width: ", ";\n }\n\n @media screen and (min-width: ", ") {\n width: ", ";\n }\n\n @media screen and (min-width: ", ") {\n width: ", ";\n }\n\n @media screen and (min-width: ", ") {\n width: ", ";\n }\n"])), function (_ref) {
22
+ var ButtonContainer = _styled.default.button(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n font-family: inherit;\n font-weight: ", ";\n font-size: ", ";\n border-radius: 8px;\n border: 0px;\n cursor: pointer;\n padding: ", ";\n\n --button-brightness: brightness(0.85);\n\n transition: all 0.15s ease-in-out;\n\n color: ", ";\n\n background-color: ", ";\n\n width: ", ";\n\n &:disabled {\n filter: opacity(0.5);\n cursor: default;\n pointer-events: none;\n }\n\n ", "\n\n @media screen and (min-width: ", ") {\n width: ", ";\n }\n\n @media screen and (min-width: ", ") {\n width: ", ";\n }\n\n @media screen and (min-width: ", ") {\n width: ", ";\n }\n\n @media screen and (min-width: ", ") {\n width: ", ";\n }\n"])), function (_ref) {
23
23
  var theme = _ref.theme;
24
24
  return theme.fontWeight[600];
25
25
  }, function (_ref2) {
26
26
  var theme = _ref2.theme;
27
27
  return theme.fontSizes.xs;
28
28
  }, function (_ref3) {
29
- var theme = _ref3.theme,
30
- textColor = _ref3.textColor,
31
- bgColor = _ref3.bgColor;
32
- var baseColor = (0, _invertColor.invertColor)(textColor || bgColor || theme.colors.primary.default, true);
33
- return textColor !== null && textColor !== void 0 ? textColor : baseColor;
29
+ var size = _ref3.size;
30
+
31
+ switch (size) {
32
+ case 'xs':
33
+ return '4px 8px';
34
+
35
+ case 'sm':
36
+ return '8px 16px';
37
+
38
+ case 'md':
39
+ return '12px 24px';
40
+
41
+ case 'lg':
42
+ return '16px 32px';
43
+
44
+ case 'xl':
45
+ return '20px 40px';
46
+
47
+ default:
48
+ return '12px 24px';
49
+ }
34
50
  }, function (_ref4) {
35
51
  var theme = _ref4.theme,
52
+ textColor = _ref4.textColor,
36
53
  bgColor = _ref4.bgColor;
37
- return bgColor !== null && bgColor !== void 0 ? bgColor : theme.colors.primary.default;
54
+ var baseColor = (0, _invertColor.invertColor)(textColor || bgColor || theme.colors.primary.default, true);
55
+ return textColor !== null && textColor !== void 0 ? textColor : baseColor;
38
56
  }, function (_ref5) {
39
- var fullWidth = _ref5.fullWidth;
57
+ var theme = _ref5.theme,
58
+ bgColor = _ref5.bgColor;
59
+ return bgColor !== null && bgColor !== void 0 ? bgColor : theme.colors.primary.default;
60
+ }, function (_ref6) {
61
+ var fullWidth = _ref6.fullWidth;
40
62
 
41
63
  if (fullWidth) {
42
64
  if (_typeof(fullWidth) === 'object' && fullWidth !== undefined) {
@@ -45,63 +67,63 @@ var ButtonContainer = _styled.default.button(_templateObject || (_templateObject
45
67
 
46
68
  return '100%';
47
69
  }
48
- }, function (_ref6) {
49
- var theme = _ref6.theme,
50
- variant = _ref6.variant,
51
- textColor = _ref6.textColor,
52
- bgColor = _ref6.bgColor;
70
+ }, function (_ref7) {
71
+ var theme = _ref7.theme,
72
+ variant = _ref7.variant,
73
+ textColor = _ref7.textColor,
74
+ bgColor = _ref7.bgColor;
53
75
 
54
76
  switch (variant) {
55
77
  case 'solid':
56
- return (0, _react.css)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n padding: 0.875rem 2rem;\n &:is(&:hover, &:focus):not(:disabled) {\n box-shadow: inset 0 0 40px 40px rgba(0, 0, 0, 0.08);\n }\n "])));
78
+ return (0, _react.css)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n &:is(&:hover, &:focus):not(:disabled) {\n box-shadow: inset 0 0 40px 40px rgba(0, 0, 0, 0.08);\n }\n "])));
57
79
 
58
80
  case 'outline':
59
- return (0, _react.css)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n padding: 0.875rem 2rem;\n background-color: transparent;\n color: ", ";\n border: 3px ", " solid;\n box-shadow: none;\n &:is(&:hover, &:focus):not(:disabled) {\n filter: var(--button-brightness);\n }\n "])), textColor || bgColor || theme.colors.primary.default, bgColor || textColor || theme.colors.primary.default);
81
+ return (0, _react.css)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n background-color: transparent;\n color: ", ";\n border: 3px ", " solid;\n box-shadow: none;\n &:is(&:hover, &:focus):not(:disabled) {\n filter: var(--button-brightness);\n }\n "])), textColor || bgColor || theme.colors.primary.default, bgColor || textColor || theme.colors.primary.default);
60
82
 
61
83
  case 'ghost':
62
- return (0, _react.css)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n padding-inline: 0;\n background-color: transparent;\n color: ", ";\n &:is(&:hover, &:focus):not(:disabled) {\n filter: var(--button-brightness);\n }\n "])), bgColor || textColor || theme.colors.primary.default);
84
+ return (0, _react.css)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n background-color: transparent;\n color: ", ";\n &:is(&:hover, &:focus):not(:disabled) {\n filter: var(--button-brightness);\n }\n "])), bgColor || textColor || theme.colors.primary.default);
63
85
 
64
86
  case 'link':
65
- return (0, _react.css)(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n padding-inline: 0;\n text-decoration: underline;\n background-color: transparent;\n color: ", ";\n &:is(&:hover, &:focus):not(:disabled) {\n filter: var(--button-brightness);\n }\n "])), bgColor || textColor || theme.colors.primary.default);
87
+ return (0, _react.css)(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n text-decoration: underline;\n background-color: transparent;\n color: ", ";\n &:is(&:hover, &:focus):not(:disabled) {\n filter: var(--button-brightness);\n }\n "])), bgColor || textColor || theme.colors.primary.default);
66
88
  }
67
- }, function (_ref7) {
68
- var theme = _ref7.theme;
69
- return theme.breakpoints.sm;
70
89
  }, function (_ref8) {
71
- var fullWidth = _ref8.fullWidth;
90
+ var theme = _ref8.theme;
91
+ return theme.breakpoints.sm;
92
+ }, function (_ref9) {
93
+ var fullWidth = _ref9.fullWidth;
72
94
 
73
95
  if (_typeof(fullWidth) === 'object') {
74
96
  var widthWasNotSet = fullWidth.sm === undefined;
75
97
  if (widthWasNotSet) return;
76
98
  return fullWidth.sm ? '100%' : 'fit-content';
77
99
  }
78
- }, function (_ref9) {
79
- var theme = _ref9.theme;
80
- return theme.breakpoints.md;
81
100
  }, function (_ref10) {
82
- var fullWidth = _ref10.fullWidth;
101
+ var theme = _ref10.theme;
102
+ return theme.breakpoints.md;
103
+ }, function (_ref11) {
104
+ var fullWidth = _ref11.fullWidth;
83
105
 
84
106
  if (_typeof(fullWidth) === 'object') {
85
107
  var widthWasNotSet = fullWidth.md === undefined;
86
108
  if (widthWasNotSet) return;
87
109
  return fullWidth.md ? '100%' : 'fit-content';
88
110
  }
89
- }, function (_ref11) {
90
- var theme = _ref11.theme;
91
- return theme.breakpoints.lg;
92
111
  }, function (_ref12) {
93
- var fullWidth = _ref12.fullWidth;
112
+ var theme = _ref12.theme;
113
+ return theme.breakpoints.lg;
114
+ }, function (_ref13) {
115
+ var fullWidth = _ref13.fullWidth;
94
116
 
95
117
  if (_typeof(fullWidth) === 'object') {
96
118
  var widthWasNotSet = fullWidth.lg === undefined;
97
119
  if (widthWasNotSet) return;
98
120
  return fullWidth.lg ? '100%' : 'fit-content';
99
121
  }
100
- }, function (_ref13) {
101
- var theme = _ref13.theme;
102
- return theme.breakpoints.xl;
103
122
  }, function (_ref14) {
104
- var fullWidth = _ref14.fullWidth;
123
+ var theme = _ref14.theme;
124
+ return theme.breakpoints.xl;
125
+ }, function (_ref15) {
126
+ var fullWidth = _ref15.fullWidth;
105
127
 
106
128
  if (_typeof(fullWidth) === 'object') {
107
129
  var widthWasNotSet = fullWidth.xl === undefined;
package/dist/components/Tooltip/styles.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/components/Tooltip/styles.ts"],"names":[],"mappings":";AAIA,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAEvC,eAAO,MAAM,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;yBA8B7B,CAAC;AAEH,eAAO,MAAM,cAAc;;;yGAK1B,CAAC;AAEF,eAAO,MAAM,cAAc;;UAI1B,CAAC"}
1
+ {"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/components/Tooltip/styles.ts"],"names":[],"mappings":";AAIA,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAEvC,eAAO,MAAM,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;yBA8B7B,CAAC;AAEH,eAAO,MAAM,cAAc;;;yGAAe,CAAC;AAE3C,eAAO,MAAM,cAAc;;UAI1B,CAAC"}
package/dist/components/Tooltip/styles.js CHANGED
@@ -26,7 +26,7 @@ var StyledTooltipLabel = (0, _styled.default)(_framerMotion.motion.div)(function
26
26
  });
27
27
  exports.StyledTooltipLabel = StyledTooltipLabel;
28
28
 
29
- var TooltipWrapper = _styled.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n width: fit-content;\n height: fit-content;\n display: flex;\n justify-content: end;\n"])));
29
+ var TooltipWrapper = _styled.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral([""])));
30
30
 
31
31
  exports.TooltipWrapper = TooltipWrapper;
32
32
  var ViewMoreButton = (0, _styled.default)(_Button.default)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n height: fit-content;\n margin-right: auto;\n text-decoration: underline;\n"])));
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@pedidopago/ui",
3
- "version": "1.5.5",
3
+ "version": "1.5.6",
4
4
  "description": "Quick build beatiful Pedido Pago apps",
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.ts",