@gympass/yoga 7.67.2 → 7.67.4
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.
|
@@ -3,13 +3,11 @@
|
|
|
3
3
|
exports.__esModule = true;
|
|
4
4
|
exports.Container = void 0;
|
|
5
5
|
|
|
6
|
-
require("react-phone-input-2/lib/material.css");
|
|
7
|
-
|
|
8
6
|
var _styledComponents = _interopRequireWildcard(require("styled-components"));
|
|
9
7
|
|
|
10
8
|
var _dataImages = require("./data-images");
|
|
11
9
|
|
|
12
|
-
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5
|
|
10
|
+
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
|
|
13
11
|
|
|
14
12
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
15
13
|
|
|
@@ -18,24 +16,23 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
|
|
|
18
16
|
function _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.slice(0); } strings.raw = raw; return strings; }
|
|
19
17
|
|
|
20
18
|
var flagsPositioning = (0, _styledComponents.css)(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n .ar {\n background-position: 0px 0px;\n }\n\n .br {\n background-position: -20px 0px;\n }\n\n .cl {\n background-position: 0px -20px;\n }\n\n .de {\n background-position: -20px -20px;\n }\n\n .es {\n background-position: -20px -40px;\n }\n\n .gb {\n background-position: -60px 0px;\n }\n\n .ie {\n background-position: -40px 0px;\n }\n\n .it {\n background-position: -40px -20px;\n }\n\n .mx {\n background-position: 0px -40px;\n }\n\n .pt {\n background-position: -40px -40px;\n }\n\n .us {\n background-position: -60px -20px;\n }\n"])));
|
|
21
|
-
var
|
|
22
|
-
var hiddenScrollBar = (0, _styledComponents.css)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n ::-webkit-scrollbar {\n display: none;\n }\n\n -ms-overflow-style: none;\n scrollbar-width: none;\n"])));
|
|
19
|
+
var hiddenScrollBar = (0, _styledComponents.css)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n ::-webkit-scrollbar {\n display: none;\n }\n\n -ms-overflow-style: none;\n scrollbar-width: none;\n"])));
|
|
23
20
|
|
|
24
21
|
var labelStateColors = function labelStateColors(_ref) {
|
|
25
22
|
var disabled = _ref.disabled,
|
|
26
23
|
error = _ref.error,
|
|
27
24
|
colors = _ref.theme.yoga.colors;
|
|
28
|
-
return (0, _styledComponents.css)(
|
|
25
|
+
return (0, _styledComponents.css)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n ", "\n ", "\n"])), disabled ? "color: " + colors.text.disabled + ";" : '', error ? "color: " + colors.feedback.attention[1] + ";" : '');
|
|
29
26
|
};
|
|
30
27
|
|
|
31
|
-
var Container = _styledComponents["default"].div(
|
|
28
|
+
var Container = _styledComponents["default"].div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n --fieldset-left-offset: 12px;\n --dropdown-zIndex: 1;\n\n height: inherit;\n\n ", "\n"])), function (_ref2) {
|
|
32
29
|
var disabled = _ref2.disabled,
|
|
33
30
|
_ref2$theme$yoga = _ref2.theme.yoga,
|
|
34
31
|
spacing = _ref2$theme$yoga.spacing,
|
|
35
32
|
colors = _ref2$theme$yoga.colors,
|
|
36
33
|
baseFont = _ref2$theme$yoga.baseFont,
|
|
37
34
|
input = _ref2$theme$yoga.components.input;
|
|
38
|
-
return (0, _styledComponents.css)(
|
|
35
|
+
return (0, _styledComponents.css)(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n .react-tel-input {\n box-sizing: border-box;\n position: relative;\n width: 100%;\n height: inherit;\n font-family: ", ", sans-serif;\n font-size: ", "px;\n font-weight: ", ";\n display: grid;\n grid-template-areas: 'dropdown input';\n grid-template-columns: min-content 1fr;\n\n .special-label {\n position: absolute;\n top: -", "px;\n display: block;\n background: white;\n padding: 0 ", "px;\n white-space: nowrap;\n font-size: ", "px;\n color: ", ";\n letter-spacing: normal;\n ", ";\n }\n\n &:focus-within {\n .special-label {\n font-weight: ", ";\n color: ", ";\n ", ";\n }\n }\n\n input[disabled] + .flag-dropdown:hover {\n cursor: not-allowed;\n }\n\n .form-control {\n background: transparent;\n border: none;\n width: 100%;\n outline: none;\n grid-area: input;\n color: ", ";\n font-family: ", ", sans-serif;\n font-size: ", "px;\n padding-left: ", "px;\n\n &:disabled {\n cursor: not-allowed;\n }\n\n &::placeholder {\n color: ", ";\n }\n\n &:hover,\n &:focus {\n box-shadow: none;\n }\n\n &.open {\n z-index: calc(var(--dropdown-zIndex) + 1);\n }\n }\n\n .flag-dropdown {\n border: none;\n width: inherit;\n grid-area: dropdown;\n\n &.open {\n width: 100%;\n z-index: var(--dropdown-zIndex);\n }\n\n &.open,\n &.open .selected-flag,\n &:hover,\n &:focus {\n cursor: pointer;\n background: transparent;\n }\n }\n\n .selected-flag {\n display: flex;\n position: relative;\n width: 52px;\n height: 100%;\n padding: 0;\n padding-left: ", "px;\n align-items: center;\n opacity: ", ";\n\n &::after {\n content: '';\n position: absolute;\n background-color: ", ";\n height: 28px;\n right: -", "px;\n width: 1px;\n top: 50%;\n transform: translate(0, -50%);\n }\n\n .flag {\n display: flex;\n align-items: center;\n\n .arrow {\n background-color: ", ";\n mask-image: url('data:image/svg+xml;utf8,", "');\n width: 16px;\n height: 16px;\n transition: 0.6s, color 0.1s;\n position: relative;\n left: ", "px;\n\n &.up {\n border: none;\n transform: rotateX(180deg);\n }\n\n &:hover,\n &:focus {\n border: none;\n background-color: ", ";\n }\n }\n }\n }\n\n .flag {\n width: 20px;\n height: 20px;\n background-image: url('data:image/png;base64,", "');\n background-repeat: no-repeat;\n }\n\n ", ";\n\n .country-list {\n background-color: white;\n position: absolute;\n padding: 0;\n outline: none;\n overflow-y: scroll;\n list-style: none;\n max-height: 18rem;\n margin: -", "px 0 0 calc(-1 * var(--fieldset-left-offset) -\n 1px);\n width: calc(100% + var(--fieldset-left-offset) + 2px);\n z-index: var(--dropdown-zIndex);\n border: 1px solid ", ";\n border-top: 0;\n border-bottom-left-radius: ", "px;\n border-bottom-right-radius: ", "px;\n\n ", ";\n\n .country {\n display: flex;\n align-items: center;\n outline: 0;\n padding: ", "px ", "px ", "px\n ", "px;\n color: ", ";\n\n .flag {\n margin-right: ", "px;\n }\n\n .country-name {\n margin-right: ", "px;\n }\n\n .dial-code {\n color: inherit;\n display: flex;\n flex: 1;\n\n ::before {\n content: '(';\n }\n\n ::after {\n content: ')';\n }\n }\n\n &.highlight {\n background-color: transparent;\n color: ", ";\n\n &::after {\n content: '';\n background-color: ", ";\n mask-image: url('data:image/svg+xml;utf8,", "');\n width: 16px;\n height: 16px;\n }\n }\n\n &.focus,\n &:hover {\n background-color: ", ";\n }\n }\n }\n }\n "])), baseFont.family, input.font.size, input.font.weight, spacing.xxsmall, spacing.xxxsmall, input.label.font.size.typed, input.label.color["default"], labelStateColors, input.label.font.weight.typed, input.label.color.focus, labelStateColors, disabled ? colors.text.disabled : input.font.color.focus, baseFont.family, input.font.size, spacing.xsmall, input.font.color["default"], spacing.xxxsmall, disabled ? 0.5 : 1, input.border.color["default"], spacing.xxxsmall, input.label.color["default"], _dataImages.chevronSvg, spacing.large + spacing.xxxsmall, input.label.color.focus, _dataImages.flagsSprite, flagsPositioning, spacing.xxsmall, input.border.color.typed, spacing.xxsmall, spacing.xxsmall, hiddenScrollBar, spacing.xsmall, spacing.small, spacing.xsmall, spacing.small, input.font.color.focus, spacing.small, spacing.xxxsmall, colors.primary, colors.primary, _dataImages.checkSvg, colors.clear);
|
|
39
36
|
});
|
|
40
37
|
|
|
41
38
|
exports.Container = Container;
|
|
@@ -1,27 +1,25 @@
|
|
|
1
|
-
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5
|
|
1
|
+
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
|
|
2
2
|
|
|
3
3
|
function _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.slice(0); } strings.raw = raw; return strings; }
|
|
4
4
|
|
|
5
|
-
import 'react-phone-input-2/lib/material.css';
|
|
6
5
|
import styled, { css } from 'styled-components';
|
|
7
6
|
import { flagsSprite, chevronSvg, checkSvg } from './data-images';
|
|
8
7
|
var flagsPositioning = css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n .ar {\n background-position: 0px 0px;\n }\n\n .br {\n background-position: -20px 0px;\n }\n\n .cl {\n background-position: 0px -20px;\n }\n\n .de {\n background-position: -20px -20px;\n }\n\n .es {\n background-position: -20px -40px;\n }\n\n .gb {\n background-position: -60px 0px;\n }\n\n .ie {\n background-position: -40px 0px;\n }\n\n .it {\n background-position: -40px -20px;\n }\n\n .mx {\n background-position: 0px -40px;\n }\n\n .pt {\n background-position: -40px -40px;\n }\n\n .us {\n background-position: -60px -20px;\n }\n"])));
|
|
9
|
-
var
|
|
10
|
-
var hiddenScrollBar = css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n ::-webkit-scrollbar {\n display: none;\n }\n\n -ms-overflow-style: none;\n scrollbar-width: none;\n"])));
|
|
8
|
+
var hiddenScrollBar = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n ::-webkit-scrollbar {\n display: none;\n }\n\n -ms-overflow-style: none;\n scrollbar-width: none;\n"])));
|
|
11
9
|
|
|
12
10
|
var labelStateColors = function labelStateColors(_ref) {
|
|
13
11
|
var disabled = _ref.disabled,
|
|
14
12
|
error = _ref.error,
|
|
15
13
|
colors = _ref.theme.yoga.colors;
|
|
16
|
-
return css(
|
|
14
|
+
return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n ", "\n ", "\n"])), disabled ? "color: " + colors.text.disabled + ";" : '', error ? "color: " + colors.feedback.attention[1] + ";" : '');
|
|
17
15
|
};
|
|
18
16
|
|
|
19
|
-
export var Container = styled.div(
|
|
17
|
+
export var Container = styled.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n --fieldset-left-offset: 12px;\n --dropdown-zIndex: 1;\n\n height: inherit;\n\n ", "\n"])), function (_ref2) {
|
|
20
18
|
var disabled = _ref2.disabled,
|
|
21
19
|
_ref2$theme$yoga = _ref2.theme.yoga,
|
|
22
20
|
spacing = _ref2$theme$yoga.spacing,
|
|
23
21
|
colors = _ref2$theme$yoga.colors,
|
|
24
22
|
baseFont = _ref2$theme$yoga.baseFont,
|
|
25
23
|
input = _ref2$theme$yoga.components.input;
|
|
26
|
-
return css(
|
|
24
|
+
return css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n .react-tel-input {\n box-sizing: border-box;\n position: relative;\n width: 100%;\n height: inherit;\n font-family: ", ", sans-serif;\n font-size: ", "px;\n font-weight: ", ";\n display: grid;\n grid-template-areas: 'dropdown input';\n grid-template-columns: min-content 1fr;\n\n .special-label {\n position: absolute;\n top: -", "px;\n display: block;\n background: white;\n padding: 0 ", "px;\n white-space: nowrap;\n font-size: ", "px;\n color: ", ";\n letter-spacing: normal;\n ", ";\n }\n\n &:focus-within {\n .special-label {\n font-weight: ", ";\n color: ", ";\n ", ";\n }\n }\n\n input[disabled] + .flag-dropdown:hover {\n cursor: not-allowed;\n }\n\n .form-control {\n background: transparent;\n border: none;\n width: 100%;\n outline: none;\n grid-area: input;\n color: ", ";\n font-family: ", ", sans-serif;\n font-size: ", "px;\n padding-left: ", "px;\n\n &:disabled {\n cursor: not-allowed;\n }\n\n &::placeholder {\n color: ", ";\n }\n\n &:hover,\n &:focus {\n box-shadow: none;\n }\n\n &.open {\n z-index: calc(var(--dropdown-zIndex) + 1);\n }\n }\n\n .flag-dropdown {\n border: none;\n width: inherit;\n grid-area: dropdown;\n\n &.open {\n width: 100%;\n z-index: var(--dropdown-zIndex);\n }\n\n &.open,\n &.open .selected-flag,\n &:hover,\n &:focus {\n cursor: pointer;\n background: transparent;\n }\n }\n\n .selected-flag {\n display: flex;\n position: relative;\n width: 52px;\n height: 100%;\n padding: 0;\n padding-left: ", "px;\n align-items: center;\n opacity: ", ";\n\n &::after {\n content: '';\n position: absolute;\n background-color: ", ";\n height: 28px;\n right: -", "px;\n width: 1px;\n top: 50%;\n transform: translate(0, -50%);\n }\n\n .flag {\n display: flex;\n align-items: center;\n\n .arrow {\n background-color: ", ";\n mask-image: url('data:image/svg+xml;utf8,", "');\n width: 16px;\n height: 16px;\n transition: 0.6s, color 0.1s;\n position: relative;\n left: ", "px;\n\n &.up {\n border: none;\n transform: rotateX(180deg);\n }\n\n &:hover,\n &:focus {\n border: none;\n background-color: ", ";\n }\n }\n }\n }\n\n .flag {\n width: 20px;\n height: 20px;\n background-image: url('data:image/png;base64,", "');\n background-repeat: no-repeat;\n }\n\n ", ";\n\n .country-list {\n background-color: white;\n position: absolute;\n padding: 0;\n outline: none;\n overflow-y: scroll;\n list-style: none;\n max-height: 18rem;\n margin: -", "px 0 0 calc(-1 * var(--fieldset-left-offset) -\n 1px);\n width: calc(100% + var(--fieldset-left-offset) + 2px);\n z-index: var(--dropdown-zIndex);\n border: 1px solid ", ";\n border-top: 0;\n border-bottom-left-radius: ", "px;\n border-bottom-right-radius: ", "px;\n\n ", ";\n\n .country {\n display: flex;\n align-items: center;\n outline: 0;\n padding: ", "px ", "px ", "px\n ", "px;\n color: ", ";\n\n .flag {\n margin-right: ", "px;\n }\n\n .country-name {\n margin-right: ", "px;\n }\n\n .dial-code {\n color: inherit;\n display: flex;\n flex: 1;\n\n ::before {\n content: '(';\n }\n\n ::after {\n content: ')';\n }\n }\n\n &.highlight {\n background-color: transparent;\n color: ", ";\n\n &::after {\n content: '';\n background-color: ", ";\n mask-image: url('data:image/svg+xml;utf8,", "');\n width: 16px;\n height: 16px;\n }\n }\n\n &.focus,\n &:hover {\n background-color: ", ";\n }\n }\n }\n }\n "])), baseFont.family, input.font.size, input.font.weight, spacing.xxsmall, spacing.xxxsmall, input.label.font.size.typed, input.label.color["default"], labelStateColors, input.label.font.weight.typed, input.label.color.focus, labelStateColors, disabled ? colors.text.disabled : input.font.color.focus, baseFont.family, input.font.size, spacing.xsmall, input.font.color["default"], spacing.xxxsmall, disabled ? 0.5 : 1, input.border.color["default"], spacing.xxxsmall, input.label.color["default"], chevronSvg, spacing.large + spacing.xxxsmall, input.label.color.focus, flagsSprite, flagsPositioning, spacing.xxsmall, input.border.color.typed, spacing.xxsmall, spacing.xxsmall, hiddenScrollBar, spacing.xsmall, spacing.small, spacing.xsmall, spacing.small, input.font.color.focus, spacing.small, spacing.xxxsmall, colors.primary, colors.primary, checkSvg, colors.clear);
|
|
27
25
|
});
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@gympass/yoga",
|
|
3
|
-
"version": "7.67.
|
|
3
|
+
"version": "7.67.4",
|
|
4
4
|
"description": "Gympass component library",
|
|
5
5
|
"main": "./cjs",
|
|
6
6
|
"sideEffects": false,
|
|
@@ -27,7 +27,7 @@
|
|
|
27
27
|
"dependencies": {
|
|
28
28
|
"@gympass/yoga-common": "^1.1.2",
|
|
29
29
|
"@gympass/yoga-helpers": "^1.0.3",
|
|
30
|
-
"@gympass/yoga-icons": "^1.
|
|
30
|
+
"@gympass/yoga-icons": "^1.9.0",
|
|
31
31
|
"@gympass/yoga-illustrations": "^0.5.1",
|
|
32
32
|
"@gympass/yoga-system": "^0.10.3",
|
|
33
33
|
"@gympass/yoga-tokens": "^3.1.5",
|
|
@@ -53,7 +53,7 @@
|
|
|
53
53
|
"react": ">=16",
|
|
54
54
|
"styled-components": "^4.4.0"
|
|
55
55
|
},
|
|
56
|
-
"gitHead": "
|
|
56
|
+
"gitHead": "3fbab60c17c40c2a903631136119731886ccc360",
|
|
57
57
|
"module": "./esm",
|
|
58
58
|
"private": false,
|
|
59
59
|
"react-native": "./cjs/index.native.js"
|