@audira/carbon-react-native
Version:
Build React Native apps with component and shared patterns using Carbon
81 lines (80 loc) • 3.17 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.Modal = void 0;
var _react = require("react");
var _reactNative = require("react-native");
var _index = require("../../../../_internal/style-sheets/index.js");
var _index2 = require("../../../../const/index.js");
var _jsxRuntime = require("react/jsx-runtime");
const Modal = exports.Modal = /*#__PURE__*/(0, _react.forwardRef)(function ({
animationConfig = _index2.DialogAnimationConfigs.CarbonReact,
style,
...props
}, ref) {
const initialAnimation = (0, _react.useRef)(false),
/**
* - 0 = unmounted
* - 1 = mounted
* - 2 = hidden behind of next dialog
*/
interpolation = (0, _react.useRef)(new _reactNative.Animated.Value(0));
(0, _react.useEffect)(() => {
if (!initialAnimation.current) {
initialAnimation.current = true;
_reactNative.Animated.timing(interpolation.current, {
toValue: 1,
duration: Array.isArray(animationConfig.duration) ? animationConfig.duration[1] : animationConfig.duration,
easing: Array.isArray(animationConfig.modalEasing) ? animationConfig.modalEasing[1] : animationConfig.modalEasing,
useNativeDriver: true
}).start();
}
}, [animationConfig, interpolation]);
(0, _react.useImperativeHandle)(ref, () => {
return {
toState(value) {
return new Promise(resolve => {
_reactNative.Animated.timing(interpolation.current, {
toValue: value,
duration: Array.isArray(animationConfig.duration) ? animationConfig.duration[value] : animationConfig.duration,
easing: Array.isArray(animationConfig.modalEasing) ? animationConfig.modalEasing[value] : animationConfig.modalEasing,
useNativeDriver: true
}).start(({
finished
}) => {
if (finished) {
resolve();
}
});
});
},
fromToState(from, to) {
return new Promise(resolve => {
_reactNative.Animated.sequence([_reactNative.Animated.timing(interpolation.current, {
toValue: from,
duration: 0,
useNativeDriver: true
}), _reactNative.Animated.timing(interpolation.current, {
toValue: to,
duration: Array.isArray(animationConfig.duration) ? animationConfig.duration[to] : animationConfig.duration,
easing: Array.isArray(animationConfig.modalEasing) ? animationConfig.modalEasing[to] : animationConfig.modalEasing,
useNativeDriver: true
})]).start(({
finished
}) => {
if (finished) {
resolve();
}
});
});
}
};
}, [animationConfig, interpolation]);
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Animated.View, {
...props,
style: [_reactNative.StyleSheet.absoluteFill, _index.FlexStyleSheet.items_center, _index.FlexStyleSheet.justify_center, animationConfig.modalStyleFactory(interpolation.current, interpolationInputRange), style]
});
});
const interpolationInputRange = [0, 1, 2];
//# sourceMappingURL=Modal.js.map