import { dynamic } from "@solidjs/web";
import { createSignal, omit } from "solid-js";
import { mergeRootProps } from "../../internals/merge-root-props.jsx";
import { resolveClassStyle } from "../../internals/resolve-class-style.jsx";
import { useIsoLayoutEffect } from "../../internals/use-iso-layout-effect.jsx";
import { useToastRootContext } from "../root/toast-root-context.jsx";
/**
 * Container for toast contents. Observes size changes and triggers root
 * height re-measurement.
 */
export function ToastContent(props) {
  const ctx = useToastRootContext();
  const [contentEl, setContentEl] = createSignal(null, {
    ownedWrite: true
  });
  useIsoLayoutEffect(() => contentEl(), node => {
    if (!node) return undefined;
    ctx.recalculateHeight();
    if (typeof ResizeObserver !== "function" || typeof MutationObserver !== "function") {
      return undefined;
    }
    const resizeObserver = new ResizeObserver(() => {
      ctx.recalculateHeight();
    });
    const mutationObserver = new MutationObserver(() => {
      ctx.recalculateHeight();
    });
    resizeObserver.observe(node);
    mutationObserver.observe(node, {
      childList: true,
      subtree: true,
      characterData: true
    });
    return () => {
      resizeObserver.disconnect();
      mutationObserver.disconnect();
    };
  });
  const userClassStyle = resolveClassStyle(props, () => ({
    expanded: ctx.expanded(),
    behind: ctx.visibleIndex() > 0
  }));
  const userHtmlProps = omit(props, "as", "class", "style", "attrs", "children");
  const internalProps = {
    ref: setContentEl,
    get "data-expanded"() {
      return ctx.expanded() ? "" : undefined;
    },
    get "data-behind"() {
      return ctx.visibleIndex() > 0 ? "" : undefined;
    }
  };
  const merged = mergeRootProps(mergeRootProps(internalProps, userClassStyle), userHtmlProps);
  const Tag = dynamic(() => props.as ?? "div");
  return <Tag {...merged}>{props.children}</Tag>;
}
//# sourceMappingURL=toast-content.jsx.map