@atlaskit/navigation-system/dist/esm/ui/page-layout/use-layout-area-sizing.js

The latest navigation system for Atlassian apps.

import { useCallback, useContext, useEffect, useRef } from 'react';
import { LayoutAreaSizingContext } from './layout-area-sizing-context';
import { layoutAreaStateContexts } from './layout-area-state-contexts';
export function useLayoutAreaSizing(_ref) {
  var area = _ref.area,
    config = _ref.config;
  var context = useContext(LayoutAreaSizingContext);
  var requestedWidth = config.requestedWidth,
    defaultWidth = config.defaultWidth,
    compactDefaultWidth = config.compactDefaultWidth,
    minWidth = config.minWidth,
    maxWidth = config.maxWidth,
    isOpen = config.isOpen,
    onRequestClose = config.onRequestClose;
  var registerArea = context === null || context === void 0 ? void 0 : context.registerArea;
  var unregisterArea = context === null || context === void 0 ? void 0 : context.unregisterArea;
  var startAreaResize = context === null || context === void 0 ? void 0 : context.startResize;
  var resizeArea = context === null || context === void 0 ? void 0 : context.resize;
  var completeAreaResize = context === null || context === void 0 ? void 0 : context.completeResize;
  var getAreaResizeBounds = context === null || context === void 0 ? void 0 : context.getResizeBounds;
  var state = useContext(layoutAreaStateContexts[area]);
  // Dismissal is not a sizing input. Register a stable delegate while keeping
  // the consumer's latest committed callback outside allocation state.
  var onRequestCloseRef = useRef(onRequestClose);
  useEffect(function () {
    onRequestCloseRef.current = onRequestClose;
  }, [onRequestClose]);
  var requestClose = useCallback(function () {
    var _onRequestCloseRef$cu;
    return (_onRequestCloseRef$cu = onRequestCloseRef.current) === null || _onRequestCloseRef$cu === void 0 ? void 0 : _onRequestCloseRef$cu.call(onRequestCloseRef);
  }, []);
  useEffect(function () {
    registerArea === null || registerArea === void 0 || registerArea(area, {
      requestedWidth: requestedWidth,
      defaultWidth: defaultWidth,
      compactDefaultWidth: compactDefaultWidth,
      minWidth: minWidth,
      maxWidth: maxWidth,
      isOpen: isOpen,
      onRequestClose: requestClose
    });
  }, [area, compactDefaultWidth, defaultWidth, isOpen, maxWidth, minWidth, registerArea, requestClose, requestedWidth]);
  useEffect(function () {
    return function () {
      return unregisterArea === null || unregisterArea === void 0 ? void 0 : unregisterArea(area);
    };
  }, [area, unregisterArea]);
  var startResize = useCallback(function (mode) {
    return startAreaResize === null || startAreaResize === void 0 ? void 0 : startAreaResize(area, mode);
  }, [area, startAreaResize]);
  var resize = useCallback(function (mode, width) {
    return resizeArea === null || resizeArea === void 0 ? void 0 : resizeArea(area, mode, width);
  }, [area, resizeArea]);
  var completeResize = useCallback(function (mode, width) {
    return completeAreaResize === null || completeAreaResize === void 0 ? void 0 : completeAreaResize(area, mode, width);
  }, [area, completeAreaResize]);
  var getResizeBounds = useCallback(function () {
    return getAreaResizeBounds === null || getAreaResizeBounds === void 0 ? void 0 : getAreaResizeBounds(area);
  }, [area, getAreaResizeBounds]);
  return {
    state: state,
    startResize: startResize,
    resize: resize,
    completeResize: completeResize,
    getResizeBounds: getResizeBounds,
    isManaged: context !== null,
    prepareResize: context === null || context === void 0 ? void 0 : context.prepareResize
  };
}