/*! © 2026 Yahoo, Inc. UDS v0.0.0-development */
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
require("../../_virtual/_rolldown/runtime.cjs");
const require_styles_styler = require("../../styles/styler.cjs");
const require_components_Text = require("../Text.cjs");
let react = require("react");
let react_jsx_runtime = require("react/jsx-runtime");
//#region src/components/Banner/BannerDescription.tsx
/**
* **Styled description for use inside `BannerContent`.**
*
* @description
* Applies the Banner description typography tokens and truncates text to
* 3 lines. Use this subcomponent instead of the `description` prop when
* you need rich ReactNode content.
*
* @example
* ```tsx
* <Banner variant="alert" startIcon={Error}>
*   <BannerContent>
*     <BannerTitle>Something went wrong</BannerTitle>
*     <BannerDescription>
*       Please try again or <Link href="/support">contact support</Link>.
*     </BannerDescription>
*   </BannerContent>
* </Banner>
* ```
*
* @see {@link Banner} for the parent component
* @see {@link BannerContent} for the required wrapper
*/
const BannerDescription = (0, react.forwardRef)(function BannerDescription({ children, className, ...rest }, ref) {
	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_Text.Text, {
		ref,
		className: require_styles_styler.cx(require_styles_styler.getStyles({
			bannerSizeDescription: "default",
			className: "w-full line-clamp-3"
		}), className),
		...rest,
		children
	});
});
BannerDescription.displayName = "BannerDescription";
//#endregion
exports.BannerDescription = BannerDescription;
