@sendbird/uikit-utils/lib/commonjs/hooks/react-native.js

A collection of utility functions and constants for building chat UI components with Sendbird UIKit.

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.useSafeAreaPadding = exports.useDeferredModalState = exports.useAppState = void 0;
var _react = require("react");
var _reactNative = require("react-native");
var _reactNativeSafeAreaContext = require("react-native-safe-area-context");
const edgePaddingMap = {
  ltr: {
    left: 'paddingStart',
    right: 'paddingEnd',
    top: 'paddingTop',
    bottom: 'paddingBottom'
  },
  rtl: {
    left: 'paddingEnd',
    right: 'paddingStart',
    top: 'paddingTop',
    bottom: 'paddingBottom'
  }
};
const useSafeAreaPadding = (edges, direction = _reactNative.I18nManager.isRTL ? 'rtl' : 'ltr') => {
  const safeAreaInsets = (0, _reactNativeSafeAreaContext.useSafeAreaInsets)();
  return edges.reduce((map, edge) => {
    const paddingKey = edgePaddingMap[direction][edge];
    map[paddingKey] = safeAreaInsets[edge];
    if (edge === 'left') {
      // @ts-expect-error backward compatibility
      map['paddingLeft'] = safeAreaInsets[edge];
    }
    if (edge === 'right') {
      // @ts-expect-error backward compatibility
      map['paddingRight'] = safeAreaInsets[edge];
    }
    return map;
  }, {});
};
exports.useSafeAreaPadding = useSafeAreaPadding;
const useAppState = (type, listener) => {
  const callbackRef = (0, _react.useRef)(listener);
  callbackRef.current = listener;
  (0, _react.useEffect)(() => {
    const eventListener = state => callbackRef.current(state);
    const subscriber = _reactNative.AppState.addEventListener(type, eventListener);
    return () => {
      if (subscriber !== null && subscriber !== void 0 && subscriber.remove) subscriber.remove();
    };
  }, []);
};

/**
 * To display a new modal in React-Native, you should ensure that a new modal is opened only after the existing modal has been dismissed to avoid conflicts.
 * To achieve this, you can use a deferred onClose that can be awaited until the onDismiss is called.
 * */
exports.useAppState = useAppState;
const useDeferredModalState = () => {
  const resolveRef = (0, _react.useRef)();
  const [visible, setVisible] = (0, _react.useState)(false);
  return {
    onClose: () => {
      return new Promise(resolve => {
        resolveRef.current = resolve;
        setVisible(false);
      });
    },
    onDismiss: () => {
      var _resolveRef$current;
      (_resolveRef$current = resolveRef.current) === null || _resolveRef$current === void 0 || _resolveRef$current.call(resolveRef);
    },
    visible,
    setVisible
  };
};
exports.useDeferredModalState = useDeferredModalState;
//# sourceMappingURL=react-native.js.map