etendo-ui-library 1.3.41 → 1.3.42
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/dist-native/components/alert/Alert.d.ts +1 -1
- package/dist-native/components/alert/Alert.js +1 -1
- package/dist-native/components/alert/Alert.style.d.ts +0 -1
- package/dist-native/components/alert/Alert.style.js +1 -1
- package/dist-web/components/alert/Alert.d.ts +1 -1
- package/dist-web/components/alert/Alert.js +20 -6
- package/dist-web/components/alert/Alert.style.d.ts +0 -1
- package/dist-web/components/alert/Alert.style.js +0 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _AlertManager=require("./AlertManager");var _colors=require("../../styles/colors");var _icons=require("../../assets/images/icons");var _Alert=require("./Alert.style");var _this=this,_jsxFileName="/home/jenkins/agent/workspace/etendo_ui_library_develop/etendo_ui_library/src/components/alert/Alert.tsx";function _getRequireWildcardCache(e){if("function"!=typeof WeakMap)return null;var r=new WeakMap(),t=new WeakMap();return(_getRequireWildcardCache=function _getRequireWildcardCache(e){return e?t:r;})(e);}function _interopRequireWildcard(e,r){if(!r&&e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};var t=_getRequireWildcardCache(r);if(t&&t.has(e))return t.get(e);var n={__proto__:null},a=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var u in e)if("default"!==u&&Object.prototype.hasOwnProperty.call(e,u)){var i=a?Object.getOwnPropertyDescriptor(e,u):null;i&&(i.get||i.set)?Object.defineProperty(n,u,i):n[u]=e[u];}return n.default=e,t&&t.set(e,n),n;}var MAX_LENGTH_TEXT=70;var Alert=function Alert(){var _useState=(0,_react.useState)(''),_useState2=(0,_slicedToArray2.default)(_useState,2),message=_useState2[0],setMessage=_useState2[1];var _useState3=(0,_react.useState)('info'),_useState4=(0,_slicedToArray2.default)(_useState3,2),typeMessage=_useState4[0],setTypeMessage=_useState4[1];var alertTimer=(0,_react.useRef)(undefined);var slideAnim=(0,_react.useRef)(new _reactNative.Animated.Value(
|
|
1
|
+
var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _AlertManager=require("./AlertManager");var _colors=require("../../styles/colors");var _icons=require("../../assets/images/icons");var _Alert=require("./Alert.style");var _this=this,_jsxFileName="/home/jenkins/agent/workspace/etendo_ui_library_develop/etendo_ui_library/src/components/alert/Alert.tsx";function _getRequireWildcardCache(e){if("function"!=typeof WeakMap)return null;var r=new WeakMap(),t=new WeakMap();return(_getRequireWildcardCache=function _getRequireWildcardCache(e){return e?t:r;})(e);}function _interopRequireWildcard(e,r){if(!r&&e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};var t=_getRequireWildcardCache(r);if(t&&t.has(e))return t.get(e);var n={__proto__:null},a=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var u in e)if("default"!==u&&Object.prototype.hasOwnProperty.call(e,u)){var i=a?Object.getOwnPropertyDescriptor(e,u):null;i&&(i.get||i.set)?Object.defineProperty(n,u,i):n[u]=e[u];}return n.default=e,t&&t.set(e,n),n;}var MAX_LENGTH_TEXT=70;var HEIGHT_MESSAGE=100;var HEIGHT_WINDOWS=_reactNative.Dimensions.get('window').height;var Alert=function Alert(){var _useState=(0,_react.useState)(''),_useState2=(0,_slicedToArray2.default)(_useState,2),message=_useState2[0],setMessage=_useState2[1];var _useState3=(0,_react.useState)('info'),_useState4=(0,_slicedToArray2.default)(_useState3,2),typeMessage=_useState4[0],setTypeMessage=_useState4[1];var alertTimer=(0,_react.useRef)(undefined);var _useState5=(0,_react.useState)(false),_useState6=(0,_slicedToArray2.default)(_useState5,2),isVisible=_useState6[0],setIsVisible=_useState6[1];var slideAnim=(0,_react.useRef)(new _reactNative.Animated.Value(HEIGHT_WINDOWS)).current;var slideIn=function slideIn(){_reactNative.Animated.timing(slideAnim,{toValue:HEIGHT_WINDOWS-HEIGHT_MESSAGE,duration:500,useNativeDriver:true}).start();};var slideOut=function slideOut(){_reactNative.Animated.timing(slideAnim,{toValue:HEIGHT_WINDOWS,duration:500,useNativeDriver:true}).start();};(0,_react.useEffect)(function(){var showListener=function showListener(_ref){var message=_ref.message,type=_ref.type,duration=_ref.duration;setMessage(message);setTypeMessage(type);setIsVisible(true);slideIn();if(typeof alertTimer.current==='number'){clearTimeout(alertTimer.current);}alertTimer.current=setTimeout(function(){slideOut();setTimeout(function(){return setIsVisible(false);},500);},duration);};var clearListener=function clearListener(){slideOut();setTimeout(function(){return setIsVisible(false);},500);};(0,_AlertManager.on)('clear',clearListener);(0,_AlertManager.on)('show',showListener);return function(){(0,_AlertManager.removeListener)('show',showListener);if(typeof alertTimer.current==='number'){clearTimeout(alertTimer.current);}(0,_AlertManager.removeListener)('clear',clearListener);};},[slideAnim]);var onPressClose=function onPressClose(){if(typeof alertTimer.current==='number'){clearTimeout(alertTimer.current);}(0,_AlertManager.nextMessage)();};var stylesAlert=(0,_react.useMemo)(function(){var backgroundColor;var textColor;var icon;var marginLeft;var imageColor;switch(typeMessage){case'info':backgroundColor=_colors.TERTIARY_101;textColor=_colors.PRIMARY_100;imageColor=_colors.PRIMARY_100;marginLeft=0;icon=_react.default.createElement(_react.default.Fragment,null);break;case'success':backgroundColor=_colors.SUCCESS_110;textColor=_colors.SUCCESS_900;imageColor=_colors.SUCCESS_800;marginLeft=8;icon=_react.default.createElement(_icons.SuccessCircleIcon,{style:{width:20,height:20,marginRight:8},fill:imageColor,__self:_this,__source:{fileName:_jsxFileName,lineNumber:123,columnNumber:11}});break;case'error':backgroundColor=_colors.DANGER_100;textColor=_colors.DANGER_700;imageColor=_colors.DANGER_700;marginLeft=8;icon=_react.default.createElement(_icons.CancelCircleIcon,{style:{width:20,height:20,marginRight:8},fill:imageColor,__self:_this,__source:{fileName:_jsxFileName,lineNumber:135,columnNumber:11}});break;case'warning':backgroundColor=_colors.IP_100;textColor=_colors.IP_900;imageColor=_colors.IP_600;marginLeft=8;icon=_react.default.createElement(_icons.WarningCircleIcon,{style:{width:20,height:20},fill:imageColor,__self:_this,__source:{fileName:_jsxFileName,lineNumber:147,columnNumber:11}});break;default:backgroundColor=_colors.TERTIARY_100;textColor=_colors.PRIMARY_100;marginLeft=0;imageColor=_colors.PRIMARY_100;icon=_react.default.createElement(_react.default.Fragment,null);}return{backgroundColor:backgroundColor,textColor:textColor,icon:icon,marginLeft:marginLeft,imageColor:imageColor};},[typeMessage]);if(!isVisible){return null;}return _react.default.createElement(_reactNative.Animated.View,{style:[{backgroundColor:stylesAlert.backgroundColor},_Alert.styles.container,{transform:[{translateY:slideAnim}]}],__self:_this,__source:{fileName:_jsxFileName,lineNumber:168,columnNumber:5}},stylesAlert.icon,_react.default.createElement(_reactNative.Text,{numberOfLines:2,style:[{color:stylesAlert.textColor,marginLeft:stylesAlert.marginLeft},_Alert.styles.text],__self:_this,__source:{fileName:_jsxFileName,lineNumber:175,columnNumber:7}},message.length>MAX_LENGTH_TEXT?message.slice(0,MAX_LENGTH_TEXT):message),_react.default.createElement(_reactNative.Pressable,{style:_Alert.styles.closeButton,onPress:onPressClose,__self:_this,__source:{fileName:_jsxFileName,lineNumber:188,columnNumber:7}},_react.default.createElement(_icons.CancelIcon,{style:_Alert.styles.closeIcon,fill:stylesAlert.imageColor,__self:_this,__source:{fileName:_jsxFileName,lineNumber:189,columnNumber:9}})));};var _default=exports.default=Alert;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
Object.defineProperty(exports,"__esModule",{value:true});exports.styles=void 0;var _reactNative=require("react-native");var styles=exports.styles=_reactNative.StyleSheet.create({container:{width:344,position:'absolute',
|
|
1
|
+
Object.defineProperty(exports,"__esModule",{value:true});exports.styles=void 0;var _reactNative=require("react-native");var styles=exports.styles=_reactNative.StyleSheet.create({container:{width:344,position:'absolute',alignSelf:'center',borderRadius:8,elevation:6,justifyContent:'center',display:'flex',paddingLeft:16,paddingVertical:14,paddingRight:4,flexDirection:'row'},text:{fontFamily:'Inter',fontWeight:'500',lineHeight:20,flex:1},closeButton:{width:48,alignItems:'center',justifyContent:'center'},closeIcon:{height:14,width:14}});
|
|
@@ -5,12 +5,14 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
|
|
|
5
5
|
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
|
|
6
6
|
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
7
7
|
import React, { useState, useEffect, useRef, useMemo } from 'react';
|
|
8
|
-
import { Text, Animated, Pressable } from "react-native-web";
|
|
8
|
+
import { Text, Animated, Pressable, Dimensions } from "react-native-web";
|
|
9
9
|
import { nextMessage, on, removeListener } from "./AlertManager";
|
|
10
10
|
import { DANGER_100, DANGER_700, IP_100, IP_600, IP_900, PRIMARY_100, SUCCESS_110, SUCCESS_800, SUCCESS_900, TERTIARY_100, TERTIARY_101 } from "../../styles/colors";
|
|
11
11
|
import { CancelCircleIcon, CancelIcon, WarningCircleIcon, SuccessCircleIcon } from "../../assets/images/icons";
|
|
12
12
|
import { styles } from "./Alert.style";
|
|
13
13
|
var MAX_LENGTH_TEXT = 70;
|
|
14
|
+
var HEIGHT_MESSAGE = 100;
|
|
15
|
+
var HEIGHT_WINDOWS = Dimensions.get('window').height;
|
|
14
16
|
var Alert = function Alert() {
|
|
15
17
|
var _useState = useState(''),
|
|
16
18
|
_useState2 = _slicedToArray(_useState, 2),
|
|
@@ -21,17 +23,21 @@ var Alert = function Alert() {
|
|
|
21
23
|
typeMessage = _useState4[0],
|
|
22
24
|
setTypeMessage = _useState4[1];
|
|
23
25
|
var alertTimer = useRef(undefined);
|
|
24
|
-
var
|
|
26
|
+
var _useState5 = useState(false),
|
|
27
|
+
_useState6 = _slicedToArray(_useState5, 2),
|
|
28
|
+
isVisible = _useState6[0],
|
|
29
|
+
setIsVisible = _useState6[1];
|
|
30
|
+
var slideAnim = useRef(new Animated.Value(HEIGHT_WINDOWS)).current;
|
|
25
31
|
var slideIn = function slideIn() {
|
|
26
32
|
Animated.timing(slideAnim, {
|
|
27
|
-
toValue: -
|
|
33
|
+
toValue: HEIGHT_WINDOWS - HEIGHT_MESSAGE,
|
|
28
34
|
duration: 500,
|
|
29
35
|
useNativeDriver: true
|
|
30
36
|
}).start();
|
|
31
37
|
};
|
|
32
38
|
var slideOut = function slideOut() {
|
|
33
39
|
Animated.timing(slideAnim, {
|
|
34
|
-
toValue:
|
|
40
|
+
toValue: HEIGHT_WINDOWS,
|
|
35
41
|
duration: 500,
|
|
36
42
|
useNativeDriver: true
|
|
37
43
|
}).start();
|
|
@@ -43,18 +49,23 @@ var Alert = function Alert() {
|
|
|
43
49
|
duration = _ref.duration;
|
|
44
50
|
setMessage(message);
|
|
45
51
|
setTypeMessage(type);
|
|
52
|
+
setIsVisible(true);
|
|
46
53
|
slideIn();
|
|
47
54
|
if (typeof alertTimer.current === 'number') {
|
|
48
55
|
clearTimeout(alertTimer.current);
|
|
49
56
|
}
|
|
50
57
|
alertTimer.current = setTimeout(function () {
|
|
51
|
-
setMessage('');
|
|
52
58
|
slideOut();
|
|
59
|
+
setTimeout(function () {
|
|
60
|
+
return setIsVisible(false);
|
|
61
|
+
}, 500);
|
|
53
62
|
}, duration);
|
|
54
63
|
};
|
|
55
64
|
var clearListener = function clearListener() {
|
|
56
|
-
setMessage('');
|
|
57
65
|
slideOut();
|
|
66
|
+
setTimeout(function () {
|
|
67
|
+
return setIsVisible(false);
|
|
68
|
+
}, 500);
|
|
58
69
|
};
|
|
59
70
|
on('clear', clearListener);
|
|
60
71
|
on('show', showListener);
|
|
@@ -142,6 +153,9 @@ var Alert = function Alert() {
|
|
|
142
153
|
imageColor: imageColor
|
|
143
154
|
};
|
|
144
155
|
}, [typeMessage]);
|
|
156
|
+
if (!isVisible) {
|
|
157
|
+
return null;
|
|
158
|
+
}
|
|
145
159
|
return /*#__PURE__*/React.createElement(Animated.View, {
|
|
146
160
|
style: [{
|
|
147
161
|
backgroundColor: stylesAlert.backgroundColor
|