@chayns-components/core/lib/cjs/hooks/container.js

A set of beautiful React components for developing your own applications with chayns.

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.useContainer = exports.ContainerAnchor = void 0;
var _react = require("react");
let ContainerAnchor = exports.ContainerAnchor = /*#__PURE__*/function (ContainerAnchor) {
  ContainerAnchor["TAPP"] = ".tapp";
  ContainerAnchor["BODY"] = "body";
  ContainerAnchor["DIALOG"] = ".dialog-inner";
  ContainerAnchor["PAGE"] = ".page-provider";
  return ContainerAnchor;
}({});
const DEFAULT_CONTAINER_ANCHORS = [ContainerAnchor.DIALOG, ContainerAnchor.PAGE, ContainerAnchor.TAPP, ContainerAnchor.BODY];
const useContainer = ({
  ref,
  container,
  anchors = DEFAULT_CONTAINER_ANCHORS
}) => {
  const [newContainer, setNewContainer] = (0, _react.useState)(container ?? null);

  // Get the closest container if none is set
  (0, _react.useEffect)(() => {
    if (ref.current && !container) {
      const el = ref.current;
      const element = el.closest(anchors === null || anchors === void 0 ? void 0 : anchors.join(', '));
      setNewContainer(element);
    }
  }, [anchors, container, ref]);
  (0, _react.useEffect)(() => {
    if (container instanceof Element) {
      setNewContainer(container);
    }
  }, [container]);
  return newContainer;
};
exports.useContainer = useContainer;
//# sourceMappingURL=container.js.map