@gympass/yoga 7.55.0 → 7.56.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.
|
@@ -1 +1 @@
|
|
|
1
|
-
var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports["default"]=void 0;var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _taggedTemplateLiteralLoose2=_interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _propTypes=require("prop-types");var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _styledComponents=_interopRequireDefault(require("styled-components"));var _yogaSystem=require("@gympass/yoga-system");var _excluded=["animation"];var _templateObject;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);}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;}var StyledSkeleton=_styledComponents["default"].View(_templateObject||(_templateObject=(0,_taggedTemplateLiteralLoose2["default"])(["\n display: flex;\n align-items: center;\n\n ","\n\n ","\n\n ","\n\n ","\n"])),_yogaSystem.margins,_yogaSystem.widths,_yogaSystem.heights,function(_ref){var type=_ref.type,variant=_ref.variant,_ref$theme$yoga=_ref.theme.yoga,colors=_ref$theme$yoga.colors,_ref$theme$yoga$compo=_ref$theme$yoga.components.skeleton,borderRadius=_ref$theme$yoga$compo.border[type],_ref$theme$yoga$compo2=_ref$theme$yoga$compo.height[type];_ref$theme$yoga$compo2=_ref$theme$yoga$compo2===void 0?{}:_ref$theme$yoga$compo2;var height=_ref$theme$yoga$compo2[variant];return"\n background-color: "+colors.elements.backgroundAndDisabled+";\n "+(borderRadius?"border-radius: "+borderRadius+"px;":'')+"\n "+(height?"height: "+height+"px;":'')+"\n ";});function Skeleton(_ref2){var _ref2$animation=_ref2.animation,animation=_ref2$animation===void 0?'pulse':_ref2$animation,props=(0,_objectWithoutProperties2["default"])(_ref2,_excluded);var _useState=(0,_react.useState)(new _reactNative.Animated.Value(0.
|
|
1
|
+
var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports["default"]=void 0;var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _taggedTemplateLiteralLoose2=_interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _propTypes=require("prop-types");var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _styledComponents=_interopRequireDefault(require("styled-components"));var _yogaSystem=require("@gympass/yoga-system");var _excluded=["animation"];var _templateObject;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);}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;}var StyledSkeleton=_styledComponents["default"].View(_templateObject||(_templateObject=(0,_taggedTemplateLiteralLoose2["default"])(["\n display: flex;\n align-items: center;\n\n ","\n\n ","\n\n ","\n\n ","\n"])),_yogaSystem.margins,_yogaSystem.widths,_yogaSystem.heights,function(_ref){var type=_ref.type,variant=_ref.variant,_ref$theme$yoga=_ref.theme.yoga,colors=_ref$theme$yoga.colors,_ref$theme$yoga$compo=_ref$theme$yoga.components.skeleton,borderRadius=_ref$theme$yoga$compo.border[type],_ref$theme$yoga$compo2=_ref$theme$yoga$compo.height[type];_ref$theme$yoga$compo2=_ref$theme$yoga$compo2===void 0?{}:_ref$theme$yoga$compo2;var height=_ref$theme$yoga$compo2[variant];return"\n background-color: "+colors.elements.backgroundAndDisabled+";\n "+(borderRadius?"border-radius: "+borderRadius+"px;":'')+"\n "+(height?"height: "+height+"px;":'')+"\n ";});function Skeleton(_ref2){var _ref2$animation=_ref2.animation,animation=_ref2$animation===void 0?'pulse':_ref2$animation,props=(0,_objectWithoutProperties2["default"])(_ref2,_excluded);var _useState=(0,_react.useState)(new _reactNative.Animated.Value(0.4)),_useState2=(0,_slicedToArray2["default"])(_useState,1),opacity=_useState2[0];(0,_react.useEffect)(function(){if(animation){_reactNative.Animated.loop(_reactNative.Animated.sequence([_reactNative.Animated.timing(opacity,{toValue:1,delay:500,duration:1000,easing:_reactNative.Easing.inOut(_reactNative.Easing.linear),useNativeDriver:true}),_reactNative.Animated.timing(opacity,{toValue:0.4,duration:500,easing:_reactNative.Easing.inOut(_reactNative.Easing.linear),useNativeDriver:true})])).start();}},[opacity]);return _react["default"].createElement(_reactNative.Animated.View,{style:{opacity:opacity}},_react["default"].createElement(StyledSkeleton,props));}Skeleton.propTypes={type:(0,_propTypes.oneOf)(['circular','rectangular','text']).isRequired,variant:function variant(props,propName,componentName){var type=props.type;if(type!=='text'&&!!props[propName]){return new Error("The "+propName+" prop must only be used when the type is equal to \"text\".");}if(type==='text'){return(0,_propTypes.checkPropTypes)((0,_defineProperty2["default"])({},propName,(0,_propTypes.oneOf)(['h1','h2','h3','h4','h5','body1','body2','overline','exception']).isRequired),props,'prop',componentName);}return null;},animation:(0,_propTypes.oneOf)(['pulse',false])};Skeleton.defaultProps={variant:undefined,animation:'pulse'};var _default=Skeleton;exports["default"]=_default;
|
|
@@ -33,7 +33,7 @@ var StyledSkeleton = _styledComponents["default"].div(_templateObject || (_templ
|
|
|
33
33
|
_ref$theme$yoga$compo2 = _ref$theme$yoga$compo.height[type];
|
|
34
34
|
_ref$theme$yoga$compo2 = _ref$theme$yoga$compo2 === void 0 ? {} : _ref$theme$yoga$compo2;
|
|
35
35
|
var height = _ref$theme$yoga$compo2[variant];
|
|
36
|
-
return (0, _styledComponents.css)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n background-color: ", ";\n ", "\n ", "\n\n ", "\n\n @keyframes placeholderShimmer {\n 0
|
|
36
|
+
return (0, _styledComponents.css)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n background-color: ", ";\n ", "\n ", "\n\n ", "\n\n @keyframes placeholderShimmer {\n 0%,\n 100% {\n opacity: 1;\n }\n 50% {\n opacity: 0.4;\n }\n }\n "])), colors.elements.backgroundAndDisabled, borderRadius ? "border-radius: " + borderRadius + "px;" : '', height ? "height: " + height + "px;" : '', animation && (0, _styledComponents.css)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n animation: placeholderShimmer 1.5s ease-in-out 0.5s infinite;\n "]))));
|
|
37
37
|
});
|
|
38
38
|
|
|
39
39
|
function Skeleton(props) {
|
|
@@ -8,7 +8,7 @@ function _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.s
|
|
|
8
8
|
|
|
9
9
|
import { checkPropTypes, oneOf } from 'prop-types';
|
|
10
10
|
import React, { useEffect, useState } from 'react';
|
|
11
|
-
import { Animated } from 'react-native';
|
|
11
|
+
import { Animated, Easing } from 'react-native';
|
|
12
12
|
import styled from 'styled-components';
|
|
13
13
|
import { margins, widths, heights } from '@gympass/yoga-system';
|
|
14
14
|
var StyledSkeleton = styled.View(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n"])), margins, widths, heights, function (_ref) {
|
|
@@ -29,18 +29,21 @@ function Skeleton(_ref2) {
|
|
|
29
29
|
animation = _ref2$animation === void 0 ? 'pulse' : _ref2$animation,
|
|
30
30
|
props = _objectWithoutPropertiesLoose(_ref2, _excluded);
|
|
31
31
|
|
|
32
|
-
var _useState = useState(new Animated.Value(0.
|
|
32
|
+
var _useState = useState(new Animated.Value(0.4)),
|
|
33
33
|
opacity = _useState[0];
|
|
34
34
|
|
|
35
35
|
useEffect(function () {
|
|
36
36
|
if (animation) {
|
|
37
37
|
Animated.loop(Animated.sequence([Animated.timing(opacity, {
|
|
38
|
-
toValue:
|
|
38
|
+
toValue: 1,
|
|
39
|
+
delay: 500,
|
|
39
40
|
duration: 1000,
|
|
41
|
+
easing: Easing.inOut(Easing.linear),
|
|
40
42
|
useNativeDriver: true
|
|
41
43
|
}), Animated.timing(opacity, {
|
|
42
|
-
toValue: 0.
|
|
43
|
-
duration:
|
|
44
|
+
toValue: 0.4,
|
|
45
|
+
duration: 500,
|
|
46
|
+
easing: Easing.inOut(Easing.linear),
|
|
44
47
|
useNativeDriver: true
|
|
45
48
|
})])).start();
|
|
46
49
|
}
|
|
@@ -18,7 +18,7 @@ var StyledSkeleton = styled.div(_templateObject || (_templateObject = _taggedTem
|
|
|
18
18
|
_ref$theme$yoga$compo2 = _ref$theme$yoga$compo.height[type];
|
|
19
19
|
_ref$theme$yoga$compo2 = _ref$theme$yoga$compo2 === void 0 ? {} : _ref$theme$yoga$compo2;
|
|
20
20
|
var height = _ref$theme$yoga$compo2[variant];
|
|
21
|
-
return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n background-color: ", ";\n ", "\n ", "\n\n ", "\n\n @keyframes placeholderShimmer {\n 0
|
|
21
|
+
return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n background-color: ", ";\n ", "\n ", "\n\n ", "\n\n @keyframes placeholderShimmer {\n 0%,\n 100% {\n opacity: 1;\n }\n 50% {\n opacity: 0.4;\n }\n }\n "])), colors.elements.backgroundAndDisabled, borderRadius ? "border-radius: " + borderRadius + "px;" : '', height ? "height: " + height + "px;" : '', animation && css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n animation: placeholderShimmer 1.5s ease-in-out 0.5s infinite;\n "]))));
|
|
22
22
|
});
|
|
23
23
|
|
|
24
24
|
function Skeleton(props) {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@gympass/yoga",
|
|
3
|
-
"version": "7.
|
|
3
|
+
"version": "7.56.0",
|
|
4
4
|
"description": "Gympass component library",
|
|
5
5
|
"main": "./cjs",
|
|
6
6
|
"sideEffects": false,
|
|
@@ -52,7 +52,7 @@
|
|
|
52
52
|
"react": ">=16",
|
|
53
53
|
"styled-components": "^4.4.0"
|
|
54
54
|
},
|
|
55
|
-
"gitHead": "
|
|
55
|
+
"gitHead": "b3230f487807d99b32fbdad8b437587a8eadea06",
|
|
56
56
|
"module": "./esm",
|
|
57
57
|
"private": false,
|
|
58
58
|
"react-native": "./cjs/index.native.js"
|