@radix-ui/themes/dist/esm/components/callout.js

[](https://radix-ui.com/themes)

"use client";import*as o from"react";import p from"classnames";import{Slot as P}from"@radix-ui/react-slot";import{Text as d}from"./text.js";import{calloutRootPropDefs as s}from"./callout.props.js";import{extractProps as R}from"../helpers/extract-props.js";import{mapResponsiveProp as x,mapCalloutSizeToTextSize as y}from"../helpers/map-prop-values.js";import{marginPropDefs as T}from"../props/margin.props.js";const a=o.createContext({}),n=o.forwardRef((t,l)=>{const{size:e=s.size.default}=t,{asChild:r,children:u,className:i,color:c,...f}=R(t,s,T);return o.createElement(r?P:"div",{"data-accent-color":c,...f,className:p("rt-CalloutRoot",i),ref:l},o.createElement(a.Provider,{value:o.useMemo(()=>({size:e}),[e])},u))});n.displayName="Callout.Root";const m=o.forwardRef(({className:t,...l},e)=>o.createElement("div",{...l,className:p("rt-CalloutIcon",t),ref:e}));m.displayName="Callout.Icon";const C=o.forwardRef(({className:t,...l},e)=>{const{size:r}=o.useContext(a);return o.createElement(d,{as:"p",size:x(r,y),...l,asChild:!1,ref:e,className:p("rt-CalloutText",t)})});C.displayName="Callout.Text";export{m as Icon,n as Root,C as Text};
//# sourceMappingURL=callout.js.map