@audira/carbon-react-native/lib/module/providers/dialog/_controller/_overlay/Overlay.js

Build React Native apps with component and shared patterns using Carbon

"use strict";

import { forwardRef, useEffect, useImperativeHandle, useRef } from 'react';
import { Animated } from 'react-native';
import { CarbonStyleSheet } from "../../../../carbon-style-sheet/index.js";
import { jsx as _jsx } from "react/jsx-runtime";
export const Overlay = /*#__PURE__*/forwardRef(function ({
  // type,
  animationConfig,
  style,
  ...props
}, ref) {
  const viewRef = useRef(null),
    opacityRef = useRef(0),
    /**
     * 0 = unmounted
     * 1 = mounted
     */
    opacity = useRef(new Animated.Value(0));
  useEffect(() => {
    if (opacityRef.current == 0) {
      opacityRef.current = 1;
      Animated.timing(opacity.current, {
        toValue: 1,
        duration: animationConfig.duration,
        useNativeDriver: true
      }).start();
    }
  }, [animationConfig, opacity]);
  useImperativeHandle(ref, () => {
    return Object.assign(viewRef.current ?? {}, {
      animateUnmount() {
        return new Promise(resolve => {
          opacityRef.current = 0;
          Animated.timing(opacity.current, {
            toValue: 0,
            duration: animationConfig.duration,
            useNativeDriver: true
          }).start(({
            finished
          }) => {
            if (finished) {
              resolve();
            }
          });
        });
      }
    });
  }, [animationConfig, opacity]);
  return /*#__PURE__*/_jsx(Animated.View, {
    ref: viewRef,
    ...props,
    style: [styleSheet.overlay, {
      opacity: opacity.current
    }, style]
  });
});
const styleSheet = CarbonStyleSheet.create({
  overlay: {
    backgroundColor: CarbonStyleSheet.color.overlay,
    position: 'absolute',
    top: 0,
    right: 0,
    bottom: 0,
    left: 0,
    overflow: 'hidden'
  }
});
//# sourceMappingURL=Overlay.js.map