"use client";
import * as React from "react";
import { useRenderElement } from "../../utils/useRenderElement.js";
import { AvatarRootContext } from "./AvatarRootContext.js";
import { avatarStateAttributesMapping } from "./stateAttributesMapping.js";
import { jsx } from "react/jsx-runtime";
const AvatarRoot = /* @__PURE__ */ React.forwardRef(function AvatarRoot2(componentProps, forwardedRef) {
  const {
    className,
    render,
    ...elementProps
  } = componentProps;
  const [imageLoadingStatus, setImageLoadingStatus] = React.useState("idle");
  const state = React.useMemo(() => ({
    imageLoadingStatus
  }), [imageLoadingStatus]);
  const contextValue = React.useMemo(() => ({
    imageLoadingStatus,
    setImageLoadingStatus
  }), [imageLoadingStatus, setImageLoadingStatus]);
  const element = useRenderElement("span", componentProps, {
    state,
    ref: forwardedRef,
    props: elementProps,
    stateAttributesMapping: avatarStateAttributesMapping
  });
  return /* @__PURE__ */ jsx(AvatarRootContext.Provider, {
    value: contextValue,
    children: element
  });
});
if (process.env.NODE_ENV !== "production") AvatarRoot.displayName = "AvatarRoot";
export {
  AvatarRoot
};
//# sourceMappingURL=AvatarRoot.js.map
