@fountain-ui/core 2.0.0-beta.68 → 2.0.0-beta.69
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/build/commonjs/Slide/Slide.js +30 -18
- package/build/commonjs/Slide/Slide.js.map +1 -1
- package/build/commonjs/Slide/SlideProps.js.map +1 -1
- package/build/commonjs/Snackbar/SnackbarProps.js.map +1 -1
- package/build/module/Slide/Slide.js +28 -18
- package/build/module/Slide/Slide.js.map +1 -1
- package/build/module/Slide/SlideProps.js.map +1 -1
- package/build/module/Snackbar/SnackbarProps.js.map +1 -1
- package/build/typescript/Slide/SlideProps.d.ts +2 -3
- package/build/typescript/Snackbar/SnackbarProps.d.ts +2 -3
- package/package.json +2 -2
- package/src/Slide/Slide.tsx +19 -19
- package/src/Slide/SlideProps.ts +2 -3
- package/src/Snackbar/SnackbarProps.ts +3 -3
|
@@ -9,7 +9,7 @@ var _react = _interopRequireWildcard(require("react"));
|
|
|
9
9
|
|
|
10
10
|
var _reactNative = require("react-native");
|
|
11
11
|
|
|
12
|
-
var
|
|
12
|
+
var _hooks = require("../hooks");
|
|
13
13
|
|
|
14
14
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
15
15
|
|
|
@@ -35,41 +35,53 @@ function Slide(props) {
|
|
|
35
35
|
style,
|
|
36
36
|
...otherProps
|
|
37
37
|
} = props;
|
|
38
|
-
const y = (0,
|
|
38
|
+
const y = (0, _hooks.useAnimatedValue)(getDisappearingOffsetY());
|
|
39
39
|
const animatedY = animatedYProp || y;
|
|
40
|
-
const animatedStyle =
|
|
40
|
+
const animatedStyle = {
|
|
41
41
|
transform: [{
|
|
42
|
-
translateY: animatedY
|
|
42
|
+
translateY: animatedY
|
|
43
43
|
}]
|
|
44
|
-
}
|
|
44
|
+
};
|
|
45
45
|
(0, _react.useEffect)(() => {
|
|
46
46
|
if (appear) {
|
|
47
47
|
onEnter === null || onEnter === void 0 ? void 0 : onEnter();
|
|
48
48
|
const toValue = 0;
|
|
49
|
-
|
|
49
|
+
|
|
50
|
+
_reactNative.Animated.timing(animatedY, {
|
|
51
|
+
toValue,
|
|
50
52
|
duration: enterDuration,
|
|
51
|
-
easing:
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
53
|
+
easing: _reactNative.Easing.out(_reactNative.Easing.exp),
|
|
54
|
+
useNativeDriver: true
|
|
55
|
+
}).start(_ref => {
|
|
56
|
+
let {
|
|
57
|
+
finished
|
|
58
|
+
} = _ref;
|
|
59
|
+
|
|
60
|
+
if (finished && onEntered) {
|
|
61
|
+
onEntered();
|
|
56
62
|
}
|
|
57
63
|
});
|
|
58
64
|
} else {
|
|
59
65
|
onExit === null || onExit === void 0 ? void 0 : onExit();
|
|
60
66
|
const toValue = getDisappearingOffsetY();
|
|
61
|
-
|
|
67
|
+
|
|
68
|
+
_reactNative.Animated.timing(animatedY, {
|
|
69
|
+
toValue,
|
|
62
70
|
duration: exitDuration,
|
|
63
|
-
easing:
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
71
|
+
easing: _reactNative.Easing.in(_reactNative.Easing.ease),
|
|
72
|
+
useNativeDriver: true
|
|
73
|
+
}).start(_ref2 => {
|
|
74
|
+
let {
|
|
75
|
+
finished
|
|
76
|
+
} = _ref2;
|
|
77
|
+
|
|
78
|
+
if (finished && onExited) {
|
|
79
|
+
onExited();
|
|
68
80
|
}
|
|
69
81
|
});
|
|
70
82
|
}
|
|
71
83
|
}, [appear, onEnter, onEntered, onExit, onExited]);
|
|
72
|
-
return /*#__PURE__*/_react.default.createElement(
|
|
84
|
+
return /*#__PURE__*/_react.default.createElement(_reactNative.Animated.View, _extends({
|
|
73
85
|
pointerEvents: 'box-none',
|
|
74
86
|
style: [animatedStyle, style]
|
|
75
87
|
}, otherProps));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["defaultEnterDuration","defaultExitDuration","getDisappearingOffsetY","Dimensions","get","height","Slide","props","animatedY","animatedYProp","appear","enterDuration","exitDuration","onEnter","onEntered","onExit","onExited","style","otherProps","y","
|
|
1
|
+
{"version":3,"names":["defaultEnterDuration","defaultExitDuration","getDisappearingOffsetY","Dimensions","get","height","Slide","props","animatedY","animatedYProp","appear","enterDuration","exitDuration","onEnter","onEntered","onExit","onExited","style","otherProps","y","useAnimatedValue","animatedStyle","transform","translateY","useEffect","toValue","Animated","timing","duration","easing","Easing","out","exp","useNativeDriver","start","finished","in","ease"],"sources":["Slide.tsx"],"sourcesContent":["import React, { useEffect } from 'react';\nimport { Animated, Dimensions, Easing } from 'react-native';\nimport { useAnimatedValue } from '../hooks';\n\nimport type SlideProps from './SlideProps';\n\nconst defaultEnterDuration = 300;\nconst defaultExitDuration = 300;\n\nconst getDisappearingOffsetY = (): number => Dimensions.get('window').height;\n\nexport default function Slide(props: SlideProps) {\n const {\n animatedY: animatedYProp,\n appear,\n enterDuration = defaultEnterDuration,\n exitDuration = defaultExitDuration,\n onEnter,\n onEntered,\n onExit,\n onExited,\n style,\n ...otherProps\n } = props;\n\n const y = useAnimatedValue(getDisappearingOffsetY());\n const animatedY = animatedYProp || y;\n\n const animatedStyle = {\n transform: [{ translateY: animatedY }],\n };\n\n useEffect(() => {\n if (appear) {\n onEnter?.();\n\n const toValue = 0;\n Animated.timing(animatedY, {\n toValue,\n duration: enterDuration,\n easing: Easing.out(Easing.exp),\n useNativeDriver: true,\n }).start(({ finished }) => {\n if (finished && onEntered) {\n onEntered();\n }\n });\n } else {\n onExit?.();\n\n const toValue = getDisappearingOffsetY();\n Animated.timing(animatedY, {\n toValue,\n duration: exitDuration,\n easing: Easing.in(Easing.ease),\n useNativeDriver: true,\n }).start(({ finished }) => {\n if (finished && onExited) {\n onExited();\n }\n });\n }\n }, [appear, onEnter, onEntered, onExit, onExited]);\n\n return (\n <Animated.View\n pointerEvents={'box-none'}\n style={[\n animatedStyle,\n style,\n ]}\n {...otherProps}\n />\n );\n};\n"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;;;;;;;AAIA,MAAMA,oBAAoB,GAAG,GAA7B;AACA,MAAMC,mBAAmB,GAAG,GAA5B;;AAEA,MAAMC,sBAAsB,GAAG,MAAcC,uBAAA,CAAWC,GAAX,CAAe,QAAf,EAAyBC,MAAtE;;AAEe,SAASC,KAAT,CAAeC,KAAf,EAAkC;EAC7C,MAAM;IACFC,SAAS,EAAEC,aADT;IAEFC,MAFE;IAGFC,aAAa,GAAGX,oBAHd;IAIFY,YAAY,GAAGX,mBAJb;IAKFY,OALE;IAMFC,SANE;IAOFC,MAPE;IAQFC,QARE;IASFC,KATE;IAUF,GAAGC;EAVD,IAWFX,KAXJ;EAaA,MAAMY,CAAC,GAAG,IAAAC,uBAAA,EAAiBlB,sBAAsB,EAAvC,CAAV;EACA,MAAMM,SAAS,GAAGC,aAAa,IAAIU,CAAnC;EAEA,MAAME,aAAa,GAAG;IAClBC,SAAS,EAAE,CAAC;MAAEC,UAAU,EAAEf;IAAd,CAAD;EADO,CAAtB;EAIA,IAAAgB,gBAAA,EAAU,MAAM;IACZ,IAAId,MAAJ,EAAY;MACRG,OAAO,SAAP,IAAAA,OAAO,WAAP,YAAAA,OAAO;MAEP,MAAMY,OAAO,GAAG,CAAhB;;MACAC,qBAAA,CAASC,MAAT,CAAgBnB,SAAhB,EAA2B;QACvBiB,OADuB;QAEvBG,QAAQ,EAAEjB,aAFa;QAGvBkB,MAAM,EAAEC,mBAAA,CAAOC,GAAP,CAAWD,mBAAA,CAAOE,GAAlB,CAHe;QAIvBC,eAAe,EAAE;MAJM,CAA3B,EAKGC,KALH,CAKS,QAAkB;QAAA,IAAjB;UAAEC;QAAF,CAAiB;;QACvB,IAAIA,QAAQ,IAAIrB,SAAhB,EAA2B;UACvBA,SAAS;QACZ;MACJ,CATD;IAUH,CAdD,MAcO;MACHC,MAAM,SAAN,IAAAA,MAAM,WAAN,YAAAA,MAAM;MAEN,MAAMU,OAAO,GAAGvB,sBAAsB,EAAtC;;MACAwB,qBAAA,CAASC,MAAT,CAAgBnB,SAAhB,EAA2B;QACvBiB,OADuB;QAEvBG,QAAQ,EAAEhB,YAFa;QAGvBiB,MAAM,EAAEC,mBAAA,CAAOM,EAAP,CAAUN,mBAAA,CAAOO,IAAjB,CAHe;QAIvBJ,eAAe,EAAE;MAJM,CAA3B,EAKGC,KALH,CAKS,SAAkB;QAAA,IAAjB;UAAEC;QAAF,CAAiB;;QACvB,IAAIA,QAAQ,IAAInB,QAAhB,EAA0B;UACtBA,QAAQ;QACX;MACJ,CATD;IAUH;EACJ,CA9BD,EA8BG,CAACN,MAAD,EAASG,OAAT,EAAkBC,SAAlB,EAA6BC,MAA7B,EAAqCC,QAArC,CA9BH;EAgCA,oBACI,6BAAC,qBAAD,CAAU,IAAV;IACI,aAAa,EAAE,UADnB;IAEI,KAAK,EAAE,CACHK,aADG,EAEHJ,KAFG;EAFX,GAMQC,UANR,EADJ;AAUH;;AAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":[],"sources":["SlideProps.ts"],"sourcesContent":["import React from 'react';\nimport type { ViewProps } from 'react-native';\nimport
|
|
1
|
+
{"version":3,"names":[],"sources":["SlideProps.ts"],"sourcesContent":["import React from 'react';\nimport type { Animated, ViewProps } from 'react-native';\nimport type { OverridableComponentProps } from '../types';\n\nexport default interface SlideProps extends OverridableComponentProps<ViewProps, {\n /**\n * y value for animating.\n */\n animatedY?: Animated.Value;\n\n /**\n * If `true`, the component will transition in.\n */\n appear: boolean;\n\n /**\n * The number of milliseconds to enter animation.\n * @default 300\n */\n enterDuration?: number;\n\n /**\n * The number of milliseconds to exit animation.\n * @default 300\n */\n exitDuration?: number;\n\n /**\n * The content of the component.\n */\n children?: React.ReactNode;\n\n /**\n * Callback fired when the enter transition will start.\n */\n onEnter?: () => void,\n\n /**\n * Callback fired when the enter transition is completed.\n */\n onEntered?: () => void,\n\n /**\n * Callback fired when the exit transition will start.\n */\n onExit?: () => void,\n\n /**\n * Callback fired when the exit transition is completed.\n */\n onExited?: () => void,\n}> {}\n"],"mappings":""}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":[],"sources":["SnackbarProps.ts"],"sourcesContent":["import React from 'react';\nimport type { ViewProps } from 'react-native';\nimport
|
|
1
|
+
{"version":3,"names":[],"sources":["SnackbarProps.ts"],"sourcesContent":["import React from 'react';\n\nimport type { Animated, ViewProps } from 'react-native';\nimport type { OverridableComponentProps } from '../types';\n\nexport default interface SnackbarProps extends OverridableComponentProps<ViewProps, {\n /**\n * The text to use for the action component.\n */\n actionLabel?: string,\n\n /**\n * y value for animating.\n */\n animatedY?: Animated.Value;\n\n /**\n * The number of milliseconds to wait before automatically calling the\n * `onDismiss` function. `onDismiss` should then set the state of the `visible`\n * prop to hide the `Snackbar`. This behavior is disabled by default with\n * the `null` value.\n * @default null\n */\n autoHideDuration?: number | null,\n\n /**\n * Replace the `SnackbarContent` component.\n */\n children?: React.ReactNode;\n\n /**\n * The message to display.\n */\n message?: string,\n\n /**\n * Callback fired when the action component pressed.\n */\n onActionPress?: () => void\n\n /**\n * Callback fired when the component requests to be closed.\n */\n onClose?: () => void,\n\n /**\n * If `true`, `Snackbar` is shown.\n * @default false\n */\n visible?: boolean,\n}> {}\n"],"mappings":""}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
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); }
|
|
2
2
|
|
|
3
3
|
import React, { useEffect } from 'react';
|
|
4
|
-
import { Dimensions } from 'react-native';
|
|
5
|
-
import
|
|
4
|
+
import { Animated, Dimensions, Easing } from 'react-native';
|
|
5
|
+
import { useAnimatedValue } from '../hooks';
|
|
6
6
|
const defaultEnterDuration = 300;
|
|
7
7
|
const defaultExitDuration = 300;
|
|
8
8
|
|
|
@@ -21,36 +21,46 @@ export default function Slide(props) {
|
|
|
21
21
|
style,
|
|
22
22
|
...otherProps
|
|
23
23
|
} = props;
|
|
24
|
-
const y =
|
|
24
|
+
const y = useAnimatedValue(getDisappearingOffsetY());
|
|
25
25
|
const animatedY = animatedYProp || y;
|
|
26
|
-
const animatedStyle =
|
|
26
|
+
const animatedStyle = {
|
|
27
27
|
transform: [{
|
|
28
|
-
translateY: animatedY
|
|
28
|
+
translateY: animatedY
|
|
29
29
|
}]
|
|
30
|
-
}
|
|
30
|
+
};
|
|
31
31
|
useEffect(() => {
|
|
32
32
|
if (appear) {
|
|
33
33
|
onEnter === null || onEnter === void 0 ? void 0 : onEnter();
|
|
34
34
|
const toValue = 0;
|
|
35
|
-
|
|
35
|
+
Animated.timing(animatedY, {
|
|
36
|
+
toValue,
|
|
36
37
|
duration: enterDuration,
|
|
37
|
-
easing: Easing.out(Easing.exp)
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
38
|
+
easing: Easing.out(Easing.exp),
|
|
39
|
+
useNativeDriver: true
|
|
40
|
+
}).start(_ref => {
|
|
41
|
+
let {
|
|
42
|
+
finished
|
|
43
|
+
} = _ref;
|
|
44
|
+
|
|
45
|
+
if (finished && onEntered) {
|
|
46
|
+
onEntered();
|
|
42
47
|
}
|
|
43
48
|
});
|
|
44
49
|
} else {
|
|
45
50
|
onExit === null || onExit === void 0 ? void 0 : onExit();
|
|
46
51
|
const toValue = getDisappearingOffsetY();
|
|
47
|
-
|
|
52
|
+
Animated.timing(animatedY, {
|
|
53
|
+
toValue,
|
|
48
54
|
duration: exitDuration,
|
|
49
|
-
easing: Easing.in(Easing.ease)
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
55
|
+
easing: Easing.in(Easing.ease),
|
|
56
|
+
useNativeDriver: true
|
|
57
|
+
}).start(_ref2 => {
|
|
58
|
+
let {
|
|
59
|
+
finished
|
|
60
|
+
} = _ref2;
|
|
61
|
+
|
|
62
|
+
if (finished && onExited) {
|
|
63
|
+
onExited();
|
|
54
64
|
}
|
|
55
65
|
});
|
|
56
66
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","useEffect","
|
|
1
|
+
{"version":3,"names":["React","useEffect","Animated","Dimensions","Easing","useAnimatedValue","defaultEnterDuration","defaultExitDuration","getDisappearingOffsetY","get","height","Slide","props","animatedY","animatedYProp","appear","enterDuration","exitDuration","onEnter","onEntered","onExit","onExited","style","otherProps","y","animatedStyle","transform","translateY","toValue","timing","duration","easing","out","exp","useNativeDriver","start","finished","in","ease"],"sources":["Slide.tsx"],"sourcesContent":["import React, { useEffect } from 'react';\nimport { Animated, Dimensions, Easing } from 'react-native';\nimport { useAnimatedValue } from '../hooks';\n\nimport type SlideProps from './SlideProps';\n\nconst defaultEnterDuration = 300;\nconst defaultExitDuration = 300;\n\nconst getDisappearingOffsetY = (): number => Dimensions.get('window').height;\n\nexport default function Slide(props: SlideProps) {\n const {\n animatedY: animatedYProp,\n appear,\n enterDuration = defaultEnterDuration,\n exitDuration = defaultExitDuration,\n onEnter,\n onEntered,\n onExit,\n onExited,\n style,\n ...otherProps\n } = props;\n\n const y = useAnimatedValue(getDisappearingOffsetY());\n const animatedY = animatedYProp || y;\n\n const animatedStyle = {\n transform: [{ translateY: animatedY }],\n };\n\n useEffect(() => {\n if (appear) {\n onEnter?.();\n\n const toValue = 0;\n Animated.timing(animatedY, {\n toValue,\n duration: enterDuration,\n easing: Easing.out(Easing.exp),\n useNativeDriver: true,\n }).start(({ finished }) => {\n if (finished && onEntered) {\n onEntered();\n }\n });\n } else {\n onExit?.();\n\n const toValue = getDisappearingOffsetY();\n Animated.timing(animatedY, {\n toValue,\n duration: exitDuration,\n easing: Easing.in(Easing.ease),\n useNativeDriver: true,\n }).start(({ finished }) => {\n if (finished && onExited) {\n onExited();\n }\n });\n }\n }, [appear, onEnter, onEntered, onExit, onExited]);\n\n return (\n <Animated.View\n pointerEvents={'box-none'}\n style={[\n animatedStyle,\n style,\n ]}\n {...otherProps}\n />\n );\n};\n"],"mappings":";;AAAA,OAAOA,KAAP,IAAgBC,SAAhB,QAAiC,OAAjC;AACA,SAASC,QAAT,EAAmBC,UAAnB,EAA+BC,MAA/B,QAA6C,cAA7C;AACA,SAASC,gBAAT,QAAiC,UAAjC;AAIA,MAAMC,oBAAoB,GAAG,GAA7B;AACA,MAAMC,mBAAmB,GAAG,GAA5B;;AAEA,MAAMC,sBAAsB,GAAG,MAAcL,UAAU,CAACM,GAAX,CAAe,QAAf,EAAyBC,MAAtE;;AAEA,eAAe,SAASC,KAAT,CAAeC,KAAf,EAAkC;EAC7C,MAAM;IACFC,SAAS,EAAEC,aADT;IAEFC,MAFE;IAGFC,aAAa,GAAGV,oBAHd;IAIFW,YAAY,GAAGV,mBAJb;IAKFW,OALE;IAMFC,SANE;IAOFC,MAPE;IAQFC,QARE;IASFC,KATE;IAUF,GAAGC;EAVD,IAWFX,KAXJ;EAaA,MAAMY,CAAC,GAAGnB,gBAAgB,CAACG,sBAAsB,EAAvB,CAA1B;EACA,MAAMK,SAAS,GAAGC,aAAa,IAAIU,CAAnC;EAEA,MAAMC,aAAa,GAAG;IAClBC,SAAS,EAAE,CAAC;MAAEC,UAAU,EAAEd;IAAd,CAAD;EADO,CAAtB;EAIAZ,SAAS,CAAC,MAAM;IACZ,IAAIc,MAAJ,EAAY;MACRG,OAAO,SAAP,IAAAA,OAAO,WAAP,YAAAA,OAAO;MAEP,MAAMU,OAAO,GAAG,CAAhB;MACA1B,QAAQ,CAAC2B,MAAT,CAAgBhB,SAAhB,EAA2B;QACvBe,OADuB;QAEvBE,QAAQ,EAAEd,aAFa;QAGvBe,MAAM,EAAE3B,MAAM,CAAC4B,GAAP,CAAW5B,MAAM,CAAC6B,GAAlB,CAHe;QAIvBC,eAAe,EAAE;MAJM,CAA3B,EAKGC,KALH,CAKS,QAAkB;QAAA,IAAjB;UAAEC;QAAF,CAAiB;;QACvB,IAAIA,QAAQ,IAAIjB,SAAhB,EAA2B;UACvBA,SAAS;QACZ;MACJ,CATD;IAUH,CAdD,MAcO;MACHC,MAAM,SAAN,IAAAA,MAAM,WAAN,YAAAA,MAAM;MAEN,MAAMQ,OAAO,GAAGpB,sBAAsB,EAAtC;MACAN,QAAQ,CAAC2B,MAAT,CAAgBhB,SAAhB,EAA2B;QACvBe,OADuB;QAEvBE,QAAQ,EAAEb,YAFa;QAGvBc,MAAM,EAAE3B,MAAM,CAACiC,EAAP,CAAUjC,MAAM,CAACkC,IAAjB,CAHe;QAIvBJ,eAAe,EAAE;MAJM,CAA3B,EAKGC,KALH,CAKS,SAAkB;QAAA,IAAjB;UAAEC;QAAF,CAAiB;;QACvB,IAAIA,QAAQ,IAAIf,QAAhB,EAA0B;UACtBA,QAAQ;QACX;MACJ,CATD;IAUH;EACJ,CA9BQ,EA8BN,CAACN,MAAD,EAASG,OAAT,EAAkBC,SAAlB,EAA6BC,MAA7B,EAAqCC,QAArC,CA9BM,CAAT;EAgCA,oBACI,oBAAC,QAAD,CAAU,IAAV;IACI,aAAa,EAAE,UADnB;IAEI,KAAK,EAAE,CACHI,aADG,EAEHH,KAFG;EAFX,GAMQC,UANR,EADJ;AAUH;AAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":[],"sources":["SlideProps.ts"],"sourcesContent":["import React from 'react';\nimport type { ViewProps } from 'react-native';\nimport
|
|
1
|
+
{"version":3,"names":[],"sources":["SlideProps.ts"],"sourcesContent":["import React from 'react';\nimport type { Animated, ViewProps } from 'react-native';\nimport type { OverridableComponentProps } from '../types';\n\nexport default interface SlideProps extends OverridableComponentProps<ViewProps, {\n /**\n * y value for animating.\n */\n animatedY?: Animated.Value;\n\n /**\n * If `true`, the component will transition in.\n */\n appear: boolean;\n\n /**\n * The number of milliseconds to enter animation.\n * @default 300\n */\n enterDuration?: number;\n\n /**\n * The number of milliseconds to exit animation.\n * @default 300\n */\n exitDuration?: number;\n\n /**\n * The content of the component.\n */\n children?: React.ReactNode;\n\n /**\n * Callback fired when the enter transition will start.\n */\n onEnter?: () => void,\n\n /**\n * Callback fired when the enter transition is completed.\n */\n onEntered?: () => void,\n\n /**\n * Callback fired when the exit transition will start.\n */\n onExit?: () => void,\n\n /**\n * Callback fired when the exit transition is completed.\n */\n onExited?: () => void,\n}> {}\n"],"mappings":""}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":[],"sources":["SnackbarProps.ts"],"sourcesContent":["import React from 'react';\nimport type { ViewProps } from 'react-native';\nimport
|
|
1
|
+
{"version":3,"names":[],"sources":["SnackbarProps.ts"],"sourcesContent":["import React from 'react';\n\nimport type { Animated, ViewProps } from 'react-native';\nimport type { OverridableComponentProps } from '../types';\n\nexport default interface SnackbarProps extends OverridableComponentProps<ViewProps, {\n /**\n * The text to use for the action component.\n */\n actionLabel?: string,\n\n /**\n * y value for animating.\n */\n animatedY?: Animated.Value;\n\n /**\n * The number of milliseconds to wait before automatically calling the\n * `onDismiss` function. `onDismiss` should then set the state of the `visible`\n * prop to hide the `Snackbar`. This behavior is disabled by default with\n * the `null` value.\n * @default null\n */\n autoHideDuration?: number | null,\n\n /**\n * Replace the `SnackbarContent` component.\n */\n children?: React.ReactNode;\n\n /**\n * The message to display.\n */\n message?: string,\n\n /**\n * Callback fired when the action component pressed.\n */\n onActionPress?: () => void\n\n /**\n * Callback fired when the component requests to be closed.\n */\n onClose?: () => void,\n\n /**\n * If `true`, `Snackbar` is shown.\n * @default false\n */\n visible?: boolean,\n}> {}\n"],"mappings":""}
|
|
@@ -1,12 +1,11 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import type { ViewProps } from 'react-native';
|
|
3
|
-
import Animated from 'react-native-reanimated';
|
|
2
|
+
import type { Animated, ViewProps } from 'react-native';
|
|
4
3
|
import type { OverridableComponentProps } from '../types';
|
|
5
4
|
export default interface SlideProps extends OverridableComponentProps<ViewProps, {
|
|
6
5
|
/**
|
|
7
6
|
* y value for animating.
|
|
8
7
|
*/
|
|
9
|
-
animatedY?: Animated.
|
|
8
|
+
animatedY?: Animated.Value;
|
|
10
9
|
/**
|
|
11
10
|
* If `true`, the component will transition in.
|
|
12
11
|
*/
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import type { ViewProps } from 'react-native';
|
|
3
|
-
import Animated from 'react-native-reanimated';
|
|
2
|
+
import type { Animated, ViewProps } from 'react-native';
|
|
4
3
|
import type { OverridableComponentProps } from '../types';
|
|
5
4
|
export default interface SnackbarProps extends OverridableComponentProps<ViewProps, {
|
|
6
5
|
/**
|
|
@@ -10,7 +9,7 @@ export default interface SnackbarProps extends OverridableComponentProps<ViewPro
|
|
|
10
9
|
/**
|
|
11
10
|
* y value for animating.
|
|
12
11
|
*/
|
|
13
|
-
animatedY?: Animated.
|
|
12
|
+
animatedY?: Animated.Value;
|
|
14
13
|
/**
|
|
15
14
|
* The number of milliseconds to wait before automatically calling the
|
|
16
15
|
* `onDismiss` function. `onDismiss` should then set the state of the `visible`
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fountain-ui/core",
|
|
3
|
-
"version": "2.0.0-beta.
|
|
3
|
+
"version": "2.0.0-beta.69",
|
|
4
4
|
"author": "Fountain-UI Team",
|
|
5
5
|
"description": "React components that implement Tappytoon's Fountain Design.",
|
|
6
6
|
"license": "MIT",
|
|
@@ -67,5 +67,5 @@
|
|
|
67
67
|
"publishConfig": {
|
|
68
68
|
"access": "public"
|
|
69
69
|
},
|
|
70
|
-
"gitHead": "
|
|
70
|
+
"gitHead": "b302abff1359cc8518964252f0da1d7a9c1dc721"
|
|
71
71
|
}
|
package/src/Slide/Slide.tsx
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import React, { useEffect } from 'react';
|
|
2
|
-
import { Dimensions } from 'react-native';
|
|
3
|
-
import
|
|
4
|
-
|
|
2
|
+
import { Animated, Dimensions, Easing } from 'react-native';
|
|
3
|
+
import { useAnimatedValue } from '../hooks';
|
|
4
|
+
|
|
5
5
|
import type SlideProps from './SlideProps';
|
|
6
6
|
|
|
7
7
|
const defaultEnterDuration = 300;
|
|
@@ -23,40 +23,40 @@ export default function Slide(props: SlideProps) {
|
|
|
23
23
|
...otherProps
|
|
24
24
|
} = props;
|
|
25
25
|
|
|
26
|
-
const y =
|
|
26
|
+
const y = useAnimatedValue(getDisappearingOffsetY());
|
|
27
27
|
const animatedY = animatedYProp || y;
|
|
28
28
|
|
|
29
|
-
const animatedStyle =
|
|
30
|
-
transform: [{ translateY: animatedY
|
|
31
|
-
}
|
|
29
|
+
const animatedStyle = {
|
|
30
|
+
transform: [{ translateY: animatedY }],
|
|
31
|
+
};
|
|
32
32
|
|
|
33
33
|
useEffect(() => {
|
|
34
34
|
if (appear) {
|
|
35
35
|
onEnter?.();
|
|
36
36
|
|
|
37
37
|
const toValue = 0;
|
|
38
|
-
|
|
38
|
+
Animated.timing(animatedY, {
|
|
39
|
+
toValue,
|
|
39
40
|
duration: enterDuration,
|
|
40
41
|
easing: Easing.out(Easing.exp),
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
runOnJS(onEntered)();
|
|
42
|
+
useNativeDriver: true,
|
|
43
|
+
}).start(({ finished }) => {
|
|
44
|
+
if (finished && onEntered) {
|
|
45
|
+
onEntered();
|
|
46
46
|
}
|
|
47
47
|
});
|
|
48
48
|
} else {
|
|
49
49
|
onExit?.();
|
|
50
50
|
|
|
51
51
|
const toValue = getDisappearingOffsetY();
|
|
52
|
-
|
|
52
|
+
Animated.timing(animatedY, {
|
|
53
|
+
toValue,
|
|
53
54
|
duration: exitDuration,
|
|
54
55
|
easing: Easing.in(Easing.ease),
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
runOnJS(onExited)();
|
|
56
|
+
useNativeDriver: true,
|
|
57
|
+
}).start(({ finished }) => {
|
|
58
|
+
if (finished && onExited) {
|
|
59
|
+
onExited();
|
|
60
60
|
}
|
|
61
61
|
});
|
|
62
62
|
}
|
package/src/Slide/SlideProps.ts
CHANGED
|
@@ -1,13 +1,12 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import type { ViewProps } from 'react-native';
|
|
3
|
-
import Animated from 'react-native-reanimated';
|
|
2
|
+
import type { Animated, ViewProps } from 'react-native';
|
|
4
3
|
import type { OverridableComponentProps } from '../types';
|
|
5
4
|
|
|
6
5
|
export default interface SlideProps extends OverridableComponentProps<ViewProps, {
|
|
7
6
|
/**
|
|
8
7
|
* y value for animating.
|
|
9
8
|
*/
|
|
10
|
-
animatedY?: Animated.
|
|
9
|
+
animatedY?: Animated.Value;
|
|
11
10
|
|
|
12
11
|
/**
|
|
13
12
|
* If `true`, the component will transition in.
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
|
|
3
|
-
import Animated from 'react-native
|
|
2
|
+
|
|
3
|
+
import type { Animated, ViewProps } from 'react-native';
|
|
4
4
|
import type { OverridableComponentProps } from '../types';
|
|
5
5
|
|
|
6
6
|
export default interface SnackbarProps extends OverridableComponentProps<ViewProps, {
|
|
@@ -12,7 +12,7 @@ export default interface SnackbarProps extends OverridableComponentProps<ViewPro
|
|
|
12
12
|
/**
|
|
13
13
|
* y value for animating.
|
|
14
14
|
*/
|
|
15
|
-
animatedY?: Animated.
|
|
15
|
+
animatedY?: Animated.Value;
|
|
16
16
|
|
|
17
17
|
/**
|
|
18
18
|
* The number of milliseconds to wait before automatically calling the
|