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

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

import { useEffect, useState } from 'react';
export let 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];
export const useContainer = _ref => {
  let {
    ref,
    container,
    anchors = DEFAULT_CONTAINER_ANCHORS
  } = _ref;
  const [newContainer, setNewContainer] = useState(container ?? null);

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