@gympass/yoga 7.65.0 → 7.66.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.
- package/cjs/Input/index.js +1 -0
- package/cjs/Input/web/Input.js +8 -3
- package/cjs/Input/web/Phone.js +144 -0
- package/cjs/Input/web/Phone.style.js +41 -0
- package/cjs/Input/web/data-images.js +10 -0
- package/cjs/Input/web/index.js +4 -0
- package/cjs/hooks/index.js +8 -0
- package/cjs/hooks/useCombinedRefs.js +32 -0
- package/esm/Input/index.js +2 -1
- package/esm/Input/web/Input.js +9 -4
- package/esm/Input/web/Phone.js +124 -0
- package/esm/Input/web/Phone.style.js +27 -0
- package/esm/Input/web/data-images.js +3 -0
- package/esm/Input/web/index.js +2 -1
- package/esm/hooks/index.js +2 -1
- package/esm/hooks/useCombinedRefs.js +25 -0
- package/package.json +4 -3
package/cjs/Input/index.js
CHANGED
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", "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"];
|
|
27
27
|
|
|
28
28
|
var _templateObject, _templateObject2, _templateObject3, _templateObject4;
|
|
29
29
|
|
|
@@ -57,6 +57,7 @@ var IconWrapper = _styledComponents["default"].div(_templateObject3 || (_templat
|
|
|
57
57
|
|
|
58
58
|
var Input = /*#__PURE__*/_react["default"].forwardRef(function (_ref3, ref) {
|
|
59
59
|
var cleanable = _ref3.cleanable,
|
|
60
|
+
children = _ref3.children,
|
|
60
61
|
disabled = _ref3.disabled,
|
|
61
62
|
error = _ref3.error,
|
|
62
63
|
full = _ref3.full,
|
|
@@ -91,7 +92,7 @@ var Input = /*#__PURE__*/_react["default"].forwardRef(function (_ref3, ref) {
|
|
|
91
92
|
label: label,
|
|
92
93
|
style: style,
|
|
93
94
|
value: value
|
|
94
|
-
}, /*#__PURE__*/_react["default"].createElement(_Field["default"], _extends({}, props, {
|
|
95
|
+
}, !children ? /*#__PURE__*/_react["default"].createElement(_Field["default"], _extends({}, props, {
|
|
95
96
|
label: label,
|
|
96
97
|
cleanable: cleanable,
|
|
97
98
|
disabled: disabled,
|
|
@@ -102,7 +103,7 @@ var Input = /*#__PURE__*/_react["default"].forwardRef(function (_ref3, ref) {
|
|
|
102
103
|
ref: inputRef,
|
|
103
104
|
value: value,
|
|
104
105
|
onChange: onChange
|
|
105
|
-
})), /*#__PURE__*/_react["default"].createElement(_Label["default"], {
|
|
106
|
+
})) : children, /*#__PURE__*/_react["default"].createElement(_Label["default"], {
|
|
106
107
|
error: error,
|
|
107
108
|
disabled: disabled
|
|
108
109
|
}, label), label && /*#__PURE__*/_react["default"].createElement(_Legend["default"], null, label), cleanable && !readOnly && value && /*#__PURE__*/_react["default"].createElement(IconWrapper, {
|
|
@@ -135,6 +136,9 @@ var Input = /*#__PURE__*/_react["default"].forwardRef(function (_ref3, ref) {
|
|
|
135
136
|
Input.propTypes = {
|
|
136
137
|
className: _propTypes.string,
|
|
137
138
|
|
|
139
|
+
/** a children node to override default input component */
|
|
140
|
+
children: (0, _propTypes.oneOfType)([(0, _propTypes.arrayOf)(_propTypes.node), _propTypes.node]),
|
|
141
|
+
|
|
138
142
|
/** display a close icon to clean the field */
|
|
139
143
|
cleanable: _propTypes.bool,
|
|
140
144
|
disabled: _propTypes.bool,
|
|
@@ -162,6 +166,7 @@ Input.propTypes = {
|
|
|
162
166
|
};
|
|
163
167
|
Input.defaultProps = {
|
|
164
168
|
className: undefined,
|
|
169
|
+
children: undefined,
|
|
165
170
|
cleanable: true,
|
|
166
171
|
disabled: false,
|
|
167
172
|
error: undefined,
|
|
@@ -0,0 +1,144 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
exports.__esModule = true;
|
|
4
|
+
exports["default"] = void 0;
|
|
5
|
+
|
|
6
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
7
|
+
|
|
8
|
+
var _reactPhoneInput = _interopRequireDefault(require("react-phone-input-2"));
|
|
9
|
+
|
|
10
|
+
var _propTypes = _interopRequireWildcard(require("prop-types"));
|
|
11
|
+
|
|
12
|
+
var S = _interopRequireWildcard(require("./Phone.style"));
|
|
13
|
+
|
|
14
|
+
var _Input = _interopRequireDefault(require("./Input"));
|
|
15
|
+
|
|
16
|
+
var _hooks = require("../../hooks");
|
|
17
|
+
|
|
18
|
+
var _excluded = ["defaultCountry", "disabled", "readOnly", "error", "full", "helper", "label", "placeholder", "value", "onChange"];
|
|
19
|
+
|
|
20
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
21
|
+
|
|
22
|
+
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); }
|
|
23
|
+
|
|
24
|
+
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
25
|
+
|
|
26
|
+
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); }
|
|
27
|
+
|
|
28
|
+
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; }
|
|
29
|
+
|
|
30
|
+
var phoneBaseSettings = {
|
|
31
|
+
onlyCountries: ['ar', 'br', 'cl', 'de', 'es', 'gb', 'ie', 'it', 'mx', 'pt', 'us']
|
|
32
|
+
};
|
|
33
|
+
|
|
34
|
+
var Phone = /*#__PURE__*/_react["default"].forwardRef(function (_ref, forwardedRef) {
|
|
35
|
+
var defaultCountry = _ref.defaultCountry,
|
|
36
|
+
disabled = _ref.disabled,
|
|
37
|
+
readOnly = _ref.readOnly,
|
|
38
|
+
error = _ref.error,
|
|
39
|
+
full = _ref.full,
|
|
40
|
+
helper = _ref.helper,
|
|
41
|
+
label = _ref.label,
|
|
42
|
+
placeholder = _ref.placeholder,
|
|
43
|
+
value = _ref.value,
|
|
44
|
+
_onChange = _ref.onChange,
|
|
45
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded);
|
|
46
|
+
|
|
47
|
+
var inputRef = (0, _hooks.useCombinedRefs)(forwardedRef);
|
|
48
|
+
var currentCountry = (0, _react.useRef)(defaultCountry);
|
|
49
|
+
var onChangeCountry = (0, _react.useCallback)(function (countryCode) {
|
|
50
|
+
if (currentCountry.current !== countryCode) {
|
|
51
|
+
inputRef.current.focus();
|
|
52
|
+
currentCountry.current = countryCode;
|
|
53
|
+
}
|
|
54
|
+
}, []);
|
|
55
|
+
return /*#__PURE__*/_react["default"].createElement(_Input["default"], _extends({}, _extends({
|
|
56
|
+
disabled: disabled,
|
|
57
|
+
readOnly: readOnly,
|
|
58
|
+
error: error,
|
|
59
|
+
full: full,
|
|
60
|
+
helper: helper,
|
|
61
|
+
value: value
|
|
62
|
+
}, rest), {
|
|
63
|
+
ref: inputRef,
|
|
64
|
+
label: "",
|
|
65
|
+
onClean: function onClean(phoneNumber) {
|
|
66
|
+
return _onChange(phoneNumber);
|
|
67
|
+
}
|
|
68
|
+
}), /*#__PURE__*/_react["default"].createElement(S.Container, {
|
|
69
|
+
error: error,
|
|
70
|
+
disabled: disabled,
|
|
71
|
+
full: full
|
|
72
|
+
}, /*#__PURE__*/_react["default"].createElement(_reactPhoneInput["default"], _extends({}, phoneBaseSettings, {
|
|
73
|
+
ref: function ref(phoneRef) {
|
|
74
|
+
inputRef.current = phoneRef == null ? void 0 : phoneRef.numberInputRef;
|
|
75
|
+
},
|
|
76
|
+
inputProps: {
|
|
77
|
+
readOnly: readOnly
|
|
78
|
+
},
|
|
79
|
+
disabled: disabled,
|
|
80
|
+
disableDropdown: readOnly,
|
|
81
|
+
country: defaultCountry,
|
|
82
|
+
specialLabel: label,
|
|
83
|
+
placeholder: placeholder,
|
|
84
|
+
onChange: function onChange(phoneNumber, options) {
|
|
85
|
+
_onChange(phoneNumber, options);
|
|
86
|
+
|
|
87
|
+
onChangeCountry(options.countryCode);
|
|
88
|
+
},
|
|
89
|
+
value: value
|
|
90
|
+
}))));
|
|
91
|
+
});
|
|
92
|
+
|
|
93
|
+
Phone.propTypes = {
|
|
94
|
+
className: _propTypes.string,
|
|
95
|
+
|
|
96
|
+
/** display a close icon to clean the field */
|
|
97
|
+
cleanable: _propTypes.bool,
|
|
98
|
+
|
|
99
|
+
/** default country to be selected on the dropdown */
|
|
100
|
+
defaultCountry: _propTypes["default"].string,
|
|
101
|
+
|
|
102
|
+
/** disable the whole input */
|
|
103
|
+
disabled: _propTypes.bool,
|
|
104
|
+
|
|
105
|
+
/** display a error message and error style */
|
|
106
|
+
error: _propTypes.string,
|
|
107
|
+
|
|
108
|
+
/** should occupy the whole container width */
|
|
109
|
+
full: _propTypes.bool,
|
|
110
|
+
|
|
111
|
+
/** a helper text to be displayed below field */
|
|
112
|
+
helper: _propTypes.string,
|
|
113
|
+
|
|
114
|
+
/** label for the input */
|
|
115
|
+
label: _propTypes.string,
|
|
116
|
+
|
|
117
|
+
/** make the input read only */
|
|
118
|
+
readOnly: _propTypes.bool,
|
|
119
|
+
|
|
120
|
+
/** value of the input */
|
|
121
|
+
value: _propTypes.string,
|
|
122
|
+
|
|
123
|
+
/** callback invoked when value changes, either by typing of selecting a country */
|
|
124
|
+
onChange: _propTypes.func,
|
|
125
|
+
|
|
126
|
+
/** placeholder to show when the input is cleared */
|
|
127
|
+
placeholder: _propTypes.string
|
|
128
|
+
};
|
|
129
|
+
Phone.defaultProps = {
|
|
130
|
+
className: undefined,
|
|
131
|
+
cleanable: true,
|
|
132
|
+
defaultCountry: 'br',
|
|
133
|
+
disabled: false,
|
|
134
|
+
error: undefined,
|
|
135
|
+
full: false,
|
|
136
|
+
helper: undefined,
|
|
137
|
+
label: '',
|
|
138
|
+
readOnly: false,
|
|
139
|
+
value: '',
|
|
140
|
+
onChange: function onChange() {},
|
|
141
|
+
placeholder: '+55 (11) 999999999'
|
|
142
|
+
};
|
|
143
|
+
var _default = Phone;
|
|
144
|
+
exports["default"] = _default;
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
exports.__esModule = true;
|
|
4
|
+
exports.Container = void 0;
|
|
5
|
+
|
|
6
|
+
require("react-phone-input-2/lib/material.css");
|
|
7
|
+
|
|
8
|
+
var _styledComponents = _interopRequireWildcard(require("styled-components"));
|
|
9
|
+
|
|
10
|
+
var _dataImages = require("./data-images");
|
|
11
|
+
|
|
12
|
+
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
|
|
13
|
+
|
|
14
|
+
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
|
+
|
|
16
|
+
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
17
|
+
|
|
18
|
+
function _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.slice(0); } strings.raw = raw; return strings; }
|
|
19
|
+
|
|
20
|
+
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 flagReset = (0, _styledComponents.css)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n position: relative;\n top: initial;\n left: initial;\n margin-top: 0;\n"])));
|
|
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"])));
|
|
23
|
+
|
|
24
|
+
var labelStateColors = function labelStateColors(_ref) {
|
|
25
|
+
var disabled = _ref.disabled,
|
|
26
|
+
error = _ref.error,
|
|
27
|
+
colors = _ref.theme.yoga.colors;
|
|
28
|
+
return (0, _styledComponents.css)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n ", "\n ", "\n"])), disabled ? "color: " + colors.text.disabled + ";" : '', error ? "color: " + colors.feedback.attention[1] + ";" : '');
|
|
29
|
+
};
|
|
30
|
+
|
|
31
|
+
var Container = _styledComponents["default"].div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n --fieldset-left-offset: 12px;\n --dropdown-zIndex: 1;\n\n height: inherit;\n\n ", "\n"])), function (_ref2) {
|
|
32
|
+
var disabled = _ref2.disabled,
|
|
33
|
+
_ref2$theme$yoga = _ref2.theme.yoga,
|
|
34
|
+
spacing = _ref2$theme$yoga.spacing,
|
|
35
|
+
colors = _ref2$theme$yoga.colors,
|
|
36
|
+
baseFont = _ref2$theme$yoga.baseFont,
|
|
37
|
+
input = _ref2$theme$yoga.components.input;
|
|
38
|
+
return (0, _styledComponents.css)(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n .react-tel-input {\n width: inherit;\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 z-index: unset;\n left: unset;\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 .form-control {\n background: transparent;\n border: unset;\n padding: unset;\n box-sizing: border-box;\n width: 100%;\n grid-area: input;\n color: ", ";\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 position: unset;\n top: unset;\n bottom: unset;\n padding: unset;\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 background: transparent;\n }\n }\n\n .selected-flag {\n border: none;\n padding: 0;\n padding-left: ", "px;\n display: flex;\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 ", ";\n display: flex;\n align-items: center;\n\n .arrow {\n background-color: ", ";\n mask-image: url('data:image/svg+xml;utf8,", "');\n border: none;\n top: unset;\n margin-top: unset;\n width: 16px;\n height: 16px;\n transition: 0.6s, color 0.1s;\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 }\n\n ", ";\n\n .country-list {\n box-shadow: none;\n border-radius: unset;\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 ", ";\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, 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, input.font.size, spacing.xsmall, input.font.color["default"], spacing.xxxsmall, disabled ? 0.5 : 1, input.border.color["default"], spacing.xxxsmall, flagReset, input.label.color["default"], _dataImages.chevronSvg, 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, flagReset, spacing.small, colors.primary, colors.primary, _dataImages.checkSvg, colors.clear);
|
|
39
|
+
});
|
|
40
|
+
|
|
41
|
+
exports.Container = Container;
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
exports.__esModule = true;
|
|
4
|
+
exports.flagsSprite = exports.chevronSvg = exports.checkSvg = void 0;
|
|
5
|
+
var chevronSvg = encodeURI("\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 12 12\">\n <path fill-rule=\"evenodd\" d=\"M3.146 4.146a.5.5 0 0 1 .708 0L6 6.293l2.146-2.147a.5.5 0 0 1 .708.708l-2.5 2.5a.5.5 0 0 1-.708 0l-2.5-2.5a.5.5 0 0 1 0-.708Z\" clip-rule=\"evenodd\"/>\n </svg>\n");
|
|
6
|
+
exports.chevronSvg = chevronSvg;
|
|
7
|
+
var checkSvg = encodeURI("\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 12 12\">\n <path fill-rule=\"evenodd\" d=\"M9.854 3.146a.5.5 0 0 1 0 .708l-4.5 4.5a.5.5 0 0 1-.708 0l-2.5-2.5a.5.5 0 1 1 .708-.708L5 7.293l4.146-4.147a.5.5 0 0 1 .708 0Z\" clip-rule=\"evenodd\"/>\n </svg>\n");
|
|
8
|
+
exports.checkSvg = checkSvg;
|
|
9
|
+
var flagsSprite = encodeURI('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');
|
|
10
|
+
exports.flagsSprite = flagsSprite;
|
package/cjs/Input/web/index.js
CHANGED
|
@@ -10,6 +10,10 @@ var _Password = _interopRequireDefault(require("./Password"));
|
|
|
10
10
|
|
|
11
11
|
exports.Password = _Password["default"];
|
|
12
12
|
|
|
13
|
+
var _Phone = _interopRequireDefault(require("./Phone"));
|
|
14
|
+
|
|
15
|
+
exports.Phone = _Phone["default"];
|
|
16
|
+
|
|
13
17
|
var _Number = _interopRequireDefault(require("./Number"));
|
|
14
18
|
|
|
15
19
|
exports.InputNumber = _Number["default"];
|
package/cjs/hooks/index.js
CHANGED
|
@@ -16,4 +16,12 @@ Object.keys(_useKeyPress).forEach(function (key) {
|
|
|
16
16
|
if (key === "default" || key === "__esModule") return;
|
|
17
17
|
if (key in exports && exports[key] === _useKeyPress[key]) return;
|
|
18
18
|
exports[key] = _useKeyPress[key];
|
|
19
|
+
});
|
|
20
|
+
|
|
21
|
+
var _useCombinedRefs = require("./useCombinedRefs");
|
|
22
|
+
|
|
23
|
+
Object.keys(_useCombinedRefs).forEach(function (key) {
|
|
24
|
+
if (key === "default" || key === "__esModule") return;
|
|
25
|
+
if (key in exports && exports[key] === _useCombinedRefs[key]) return;
|
|
26
|
+
exports[key] = _useCombinedRefs[key];
|
|
19
27
|
});
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
exports.__esModule = true;
|
|
4
|
+
exports.useCombinedRefs = void 0;
|
|
5
|
+
|
|
6
|
+
var _react = require("react");
|
|
7
|
+
|
|
8
|
+
/**
|
|
9
|
+
* A hook for combining multiple refs into one ref.
|
|
10
|
+
*/
|
|
11
|
+
var useCombinedRefs = function useCombinedRefs() {
|
|
12
|
+
for (var _len = arguments.length, refs = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
13
|
+
refs[_key] = arguments[_key];
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
var targetRef = (0, _react.useRef)(null);
|
|
17
|
+
(0, _react.useEffect)(function () {
|
|
18
|
+
for (var i = 0; i < refs.length; i++) {
|
|
19
|
+
var ref = refs[i];
|
|
20
|
+
if (!ref) return;
|
|
21
|
+
|
|
22
|
+
if (typeof ref === 'function') {
|
|
23
|
+
ref(targetRef.current);
|
|
24
|
+
} else {
|
|
25
|
+
ref.current = targetRef.current;
|
|
26
|
+
}
|
|
27
|
+
}
|
|
28
|
+
}, [refs]);
|
|
29
|
+
return targetRef;
|
|
30
|
+
};
|
|
31
|
+
|
|
32
|
+
exports.useCombinedRefs = useCombinedRefs;
|
package/esm/Input/index.js
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
|
-
import { Input, Password, Email, InputNumber, Tel } from './web';
|
|
1
|
+
import { Input, Password, Email, InputNumber, Tel, Phone } from './web';
|
|
2
2
|
Input.Password = Password;
|
|
3
3
|
Input.Email = Email;
|
|
4
4
|
Input.Number = InputNumber;
|
|
5
5
|
Input.Tel = Tel;
|
|
6
|
+
Input.Phone = Phone;
|
|
6
7
|
export default Input;
|
package/esm/Input/web/Input.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
var _excluded = ["cleanable", "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"];
|
|
2
2
|
|
|
3
3
|
var _templateObject, _templateObject2, _templateObject3, _templateObject4;
|
|
4
4
|
|
|
@@ -10,7 +10,7 @@ function _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.s
|
|
|
10
10
|
|
|
11
11
|
import React, { useRef } from 'react';
|
|
12
12
|
import styled, { css } from 'styled-components';
|
|
13
|
-
import { func, string, bool, number, shape, oneOfType, node } from 'prop-types';
|
|
13
|
+
import { arrayOf, func, string, bool, number, shape, oneOfType, node } from 'prop-types';
|
|
14
14
|
import { Close } from '@gympass/yoga-icons';
|
|
15
15
|
import { theme } from '../../Theme';
|
|
16
16
|
import Field from './Field';
|
|
@@ -34,6 +34,7 @@ var IconWrapper = styled.div(_templateObject3 || (_templateObject3 = _taggedTemp
|
|
|
34
34
|
});
|
|
35
35
|
var Input = /*#__PURE__*/React.forwardRef(function (_ref3, ref) {
|
|
36
36
|
var cleanable = _ref3.cleanable,
|
|
37
|
+
children = _ref3.children,
|
|
37
38
|
disabled = _ref3.disabled,
|
|
38
39
|
error = _ref3.error,
|
|
39
40
|
full = _ref3.full,
|
|
@@ -68,7 +69,7 @@ var Input = /*#__PURE__*/React.forwardRef(function (_ref3, ref) {
|
|
|
68
69
|
label: label,
|
|
69
70
|
style: style,
|
|
70
71
|
value: value
|
|
71
|
-
}, /*#__PURE__*/React.createElement(Field, _extends({}, props, {
|
|
72
|
+
}, !children ? /*#__PURE__*/React.createElement(Field, _extends({}, props, {
|
|
72
73
|
label: label,
|
|
73
74
|
cleanable: cleanable,
|
|
74
75
|
disabled: disabled,
|
|
@@ -79,7 +80,7 @@ var Input = /*#__PURE__*/React.forwardRef(function (_ref3, ref) {
|
|
|
79
80
|
ref: inputRef,
|
|
80
81
|
value: value,
|
|
81
82
|
onChange: onChange
|
|
82
|
-
})), /*#__PURE__*/React.createElement(Label, {
|
|
83
|
+
})) : children, /*#__PURE__*/React.createElement(Label, {
|
|
83
84
|
error: error,
|
|
84
85
|
disabled: disabled
|
|
85
86
|
}, label), label && /*#__PURE__*/React.createElement(Legend, null, label), cleanable && !readOnly && value && /*#__PURE__*/React.createElement(IconWrapper, {
|
|
@@ -111,6 +112,9 @@ var Input = /*#__PURE__*/React.forwardRef(function (_ref3, ref) {
|
|
|
111
112
|
Input.propTypes = {
|
|
112
113
|
className: string,
|
|
113
114
|
|
|
115
|
+
/** a children node to override default input component */
|
|
116
|
+
children: oneOfType([arrayOf(node), node]),
|
|
117
|
+
|
|
114
118
|
/** display a close icon to clean the field */
|
|
115
119
|
cleanable: bool,
|
|
116
120
|
disabled: bool,
|
|
@@ -138,6 +142,7 @@ Input.propTypes = {
|
|
|
138
142
|
};
|
|
139
143
|
Input.defaultProps = {
|
|
140
144
|
className: undefined,
|
|
145
|
+
children: undefined,
|
|
141
146
|
cleanable: true,
|
|
142
147
|
disabled: false,
|
|
143
148
|
error: undefined,
|
|
@@ -0,0 +1,124 @@
|
|
|
1
|
+
var _excluded = ["defaultCountry", "disabled", "readOnly", "error", "full", "helper", "label", "placeholder", "value", "onChange"];
|
|
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
|
+
|
|
5
|
+
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; }
|
|
6
|
+
|
|
7
|
+
import React, { useRef, useCallback } from 'react';
|
|
8
|
+
import BasePhoneInput from 'react-phone-input-2';
|
|
9
|
+
import PropTypes, { func, string, bool } from 'prop-types';
|
|
10
|
+
import * as S from './Phone.style';
|
|
11
|
+
import Input from './Input';
|
|
12
|
+
import { useCombinedRefs } from '../../hooks';
|
|
13
|
+
var phoneBaseSettings = {
|
|
14
|
+
onlyCountries: ['ar', 'br', 'cl', 'de', 'es', 'gb', 'ie', 'it', 'mx', 'pt', 'us']
|
|
15
|
+
};
|
|
16
|
+
var Phone = /*#__PURE__*/React.forwardRef(function (_ref, forwardedRef) {
|
|
17
|
+
var defaultCountry = _ref.defaultCountry,
|
|
18
|
+
disabled = _ref.disabled,
|
|
19
|
+
readOnly = _ref.readOnly,
|
|
20
|
+
error = _ref.error,
|
|
21
|
+
full = _ref.full,
|
|
22
|
+
helper = _ref.helper,
|
|
23
|
+
label = _ref.label,
|
|
24
|
+
placeholder = _ref.placeholder,
|
|
25
|
+
value = _ref.value,
|
|
26
|
+
_onChange = _ref.onChange,
|
|
27
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded);
|
|
28
|
+
|
|
29
|
+
var inputRef = useCombinedRefs(forwardedRef);
|
|
30
|
+
var currentCountry = useRef(defaultCountry);
|
|
31
|
+
var onChangeCountry = useCallback(function (countryCode) {
|
|
32
|
+
if (currentCountry.current !== countryCode) {
|
|
33
|
+
inputRef.current.focus();
|
|
34
|
+
currentCountry.current = countryCode;
|
|
35
|
+
}
|
|
36
|
+
}, []);
|
|
37
|
+
return /*#__PURE__*/React.createElement(Input, _extends({}, _extends({
|
|
38
|
+
disabled: disabled,
|
|
39
|
+
readOnly: readOnly,
|
|
40
|
+
error: error,
|
|
41
|
+
full: full,
|
|
42
|
+
helper: helper,
|
|
43
|
+
value: value
|
|
44
|
+
}, rest), {
|
|
45
|
+
ref: inputRef,
|
|
46
|
+
label: "",
|
|
47
|
+
onClean: function onClean(phoneNumber) {
|
|
48
|
+
return _onChange(phoneNumber);
|
|
49
|
+
}
|
|
50
|
+
}), /*#__PURE__*/React.createElement(S.Container, {
|
|
51
|
+
error: error,
|
|
52
|
+
disabled: disabled,
|
|
53
|
+
full: full
|
|
54
|
+
}, /*#__PURE__*/React.createElement(BasePhoneInput, _extends({}, phoneBaseSettings, {
|
|
55
|
+
ref: function ref(phoneRef) {
|
|
56
|
+
inputRef.current = phoneRef == null ? void 0 : phoneRef.numberInputRef;
|
|
57
|
+
},
|
|
58
|
+
inputProps: {
|
|
59
|
+
readOnly: readOnly
|
|
60
|
+
},
|
|
61
|
+
disabled: disabled,
|
|
62
|
+
disableDropdown: readOnly,
|
|
63
|
+
country: defaultCountry,
|
|
64
|
+
specialLabel: label,
|
|
65
|
+
placeholder: placeholder,
|
|
66
|
+
onChange: function onChange(phoneNumber, options) {
|
|
67
|
+
_onChange(phoneNumber, options);
|
|
68
|
+
|
|
69
|
+
onChangeCountry(options.countryCode);
|
|
70
|
+
},
|
|
71
|
+
value: value
|
|
72
|
+
}))));
|
|
73
|
+
});
|
|
74
|
+
Phone.propTypes = {
|
|
75
|
+
className: string,
|
|
76
|
+
|
|
77
|
+
/** display a close icon to clean the field */
|
|
78
|
+
cleanable: bool,
|
|
79
|
+
|
|
80
|
+
/** default country to be selected on the dropdown */
|
|
81
|
+
defaultCountry: PropTypes.string,
|
|
82
|
+
|
|
83
|
+
/** disable the whole input */
|
|
84
|
+
disabled: bool,
|
|
85
|
+
|
|
86
|
+
/** display a error message and error style */
|
|
87
|
+
error: string,
|
|
88
|
+
|
|
89
|
+
/** should occupy the whole container width */
|
|
90
|
+
full: bool,
|
|
91
|
+
|
|
92
|
+
/** a helper text to be displayed below field */
|
|
93
|
+
helper: string,
|
|
94
|
+
|
|
95
|
+
/** label for the input */
|
|
96
|
+
label: string,
|
|
97
|
+
|
|
98
|
+
/** make the input read only */
|
|
99
|
+
readOnly: bool,
|
|
100
|
+
|
|
101
|
+
/** value of the input */
|
|
102
|
+
value: string,
|
|
103
|
+
|
|
104
|
+
/** callback invoked when value changes, either by typing of selecting a country */
|
|
105
|
+
onChange: func,
|
|
106
|
+
|
|
107
|
+
/** placeholder to show when the input is cleared */
|
|
108
|
+
placeholder: string
|
|
109
|
+
};
|
|
110
|
+
Phone.defaultProps = {
|
|
111
|
+
className: undefined,
|
|
112
|
+
cleanable: true,
|
|
113
|
+
defaultCountry: 'br',
|
|
114
|
+
disabled: false,
|
|
115
|
+
error: undefined,
|
|
116
|
+
full: false,
|
|
117
|
+
helper: undefined,
|
|
118
|
+
label: '',
|
|
119
|
+
readOnly: false,
|
|
120
|
+
value: '',
|
|
121
|
+
onChange: function onChange() {},
|
|
122
|
+
placeholder: '+55 (11) 999999999'
|
|
123
|
+
};
|
|
124
|
+
export default Phone;
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
|
|
2
|
+
|
|
3
|
+
function _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.slice(0); } strings.raw = raw; return strings; }
|
|
4
|
+
|
|
5
|
+
import 'react-phone-input-2/lib/material.css';
|
|
6
|
+
import styled, { css } from 'styled-components';
|
|
7
|
+
import { flagsSprite, chevronSvg, checkSvg } from './data-images';
|
|
8
|
+
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 flagReset = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n position: relative;\n top: initial;\n left: initial;\n margin-top: 0;\n"])));
|
|
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"])));
|
|
11
|
+
|
|
12
|
+
var labelStateColors = function labelStateColors(_ref) {
|
|
13
|
+
var disabled = _ref.disabled,
|
|
14
|
+
error = _ref.error,
|
|
15
|
+
colors = _ref.theme.yoga.colors;
|
|
16
|
+
return css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n ", "\n ", "\n"])), disabled ? "color: " + colors.text.disabled + ";" : '', error ? "color: " + colors.feedback.attention[1] + ";" : '');
|
|
17
|
+
};
|
|
18
|
+
|
|
19
|
+
export var Container = styled.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n --fieldset-left-offset: 12px;\n --dropdown-zIndex: 1;\n\n height: inherit;\n\n ", "\n"])), function (_ref2) {
|
|
20
|
+
var disabled = _ref2.disabled,
|
|
21
|
+
_ref2$theme$yoga = _ref2.theme.yoga,
|
|
22
|
+
spacing = _ref2$theme$yoga.spacing,
|
|
23
|
+
colors = _ref2$theme$yoga.colors,
|
|
24
|
+
baseFont = _ref2$theme$yoga.baseFont,
|
|
25
|
+
input = _ref2$theme$yoga.components.input;
|
|
26
|
+
return css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n .react-tel-input {\n width: inherit;\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 z-index: unset;\n left: unset;\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 .form-control {\n background: transparent;\n border: unset;\n padding: unset;\n box-sizing: border-box;\n width: 100%;\n grid-area: input;\n color: ", ";\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 position: unset;\n top: unset;\n bottom: unset;\n padding: unset;\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 background: transparent;\n }\n }\n\n .selected-flag {\n border: none;\n padding: 0;\n padding-left: ", "px;\n display: flex;\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 ", ";\n display: flex;\n align-items: center;\n\n .arrow {\n background-color: ", ";\n mask-image: url('data:image/svg+xml;utf8,", "');\n border: none;\n top: unset;\n margin-top: unset;\n width: 16px;\n height: 16px;\n transition: 0.6s, color 0.1s;\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 }\n\n ", ";\n\n .country-list {\n box-shadow: none;\n border-radius: unset;\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 ", ";\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, 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, input.font.size, spacing.xsmall, input.font.color["default"], spacing.xxxsmall, disabled ? 0.5 : 1, input.border.color["default"], spacing.xxxsmall, flagReset, input.label.color["default"], chevronSvg, 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, flagReset, spacing.small, colors.primary, colors.primary, checkSvg, colors.clear);
|
|
27
|
+
});
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
export var chevronSvg = encodeURI("\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 12 12\">\n <path fill-rule=\"evenodd\" d=\"M3.146 4.146a.5.5 0 0 1 .708 0L6 6.293l2.146-2.147a.5.5 0 0 1 .708.708l-2.5 2.5a.5.5 0 0 1-.708 0l-2.5-2.5a.5.5 0 0 1 0-.708Z\" clip-rule=\"evenodd\"/>\n </svg>\n");
|
|
2
|
+
export var checkSvg = encodeURI("\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 12 12\">\n <path fill-rule=\"evenodd\" d=\"M9.854 3.146a.5.5 0 0 1 0 .708l-4.5 4.5a.5.5 0 0 1-.708 0l-2.5-2.5a.5.5 0 1 1 .708-.708L5 7.293l4.146-4.147a.5.5 0 0 1 .708 0Z\" clip-rule=\"evenodd\"/>\n </svg>\n");
|
|
3
|
+
export var flagsSprite = encodeURI('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');
|
package/esm/Input/web/index.js
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import Input from './Input';
|
|
2
2
|
import Password from './Password';
|
|
3
|
+
import Phone from './Phone';
|
|
3
4
|
import InputNumber from './Number';
|
|
4
5
|
import Tel from './Tel';
|
|
5
6
|
import Email from './Email';
|
|
6
|
-
export { Input, Password, InputNumber, Tel, Email };
|
|
7
|
+
export { Input, Password, InputNumber, Tel, Email, Phone };
|
package/esm/hooks/index.js
CHANGED
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import { useEffect, useRef } from 'react';
|
|
2
|
+
/**
|
|
3
|
+
* A hook for combining multiple refs into one ref.
|
|
4
|
+
*/
|
|
5
|
+
|
|
6
|
+
export var useCombinedRefs = function useCombinedRefs() {
|
|
7
|
+
for (var _len = arguments.length, refs = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
8
|
+
refs[_key] = arguments[_key];
|
|
9
|
+
}
|
|
10
|
+
|
|
11
|
+
var targetRef = useRef(null);
|
|
12
|
+
useEffect(function () {
|
|
13
|
+
for (var i = 0; i < refs.length; i++) {
|
|
14
|
+
var ref = refs[i];
|
|
15
|
+
if (!ref) return;
|
|
16
|
+
|
|
17
|
+
if (typeof ref === 'function') {
|
|
18
|
+
ref(targetRef.current);
|
|
19
|
+
} else {
|
|
20
|
+
ref.current = targetRef.current;
|
|
21
|
+
}
|
|
22
|
+
}
|
|
23
|
+
}, [refs]);
|
|
24
|
+
return targetRef;
|
|
25
|
+
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@gympass/yoga",
|
|
3
|
-
"version": "7.
|
|
3
|
+
"version": "7.66.0",
|
|
4
4
|
"description": "Gympass component library",
|
|
5
5
|
"main": "./cjs",
|
|
6
6
|
"sideEffects": false,
|
|
@@ -39,7 +39,8 @@
|
|
|
39
39
|
"prop-types": "^15.7.2",
|
|
40
40
|
"proxy-polyfill": "^0.3.1",
|
|
41
41
|
"rc-slider": "^8.7.1",
|
|
42
|
-
"react-google-font-loader": "^1.1.0"
|
|
42
|
+
"react-google-font-loader": "^1.1.0",
|
|
43
|
+
"react-phone-input-2": "^2.15.1"
|
|
43
44
|
},
|
|
44
45
|
"devDependencies": {
|
|
45
46
|
"@testing-library/react": "^12.0.4",
|
|
@@ -52,7 +53,7 @@
|
|
|
52
53
|
"react": ">=16",
|
|
53
54
|
"styled-components": "^4.4.0"
|
|
54
55
|
},
|
|
55
|
-
"gitHead": "
|
|
56
|
+
"gitHead": "be5fcc8bdaa4f8d32ae3f78815ef7f669ccbcfe2",
|
|
56
57
|
"module": "./esm",
|
|
57
58
|
"private": false,
|
|
58
59
|
"react-native": "./cjs/index.native.js"
|