/*! © 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_client_Pressable = require("../client/Pressable.cjs");
const require_components_IconSlot = require("../IconSlot.cjs");
const require_components_Text = require("../Text.cjs");
const require_components_Banner_utils = require("./utils.cjs");
let _yahoo_uds_icons = require("@yahoo/uds-icons");
let react = require("react");
let react_jsx_runtime = require("react/jsx-runtime");
//#region src/components/Banner/Banner.tsx
const BASE_CLASS = "uds-banner";
/**
* Inject button variants on Button children that don't have an explicit
* variant set. The last unset Button gets the banner-mapped "primary"
* variant; any preceding unset Buttons get "secondary". Leaves Link,
* other elements, and Buttons with an explicit variant untouched.
*/
function bindActionVariants(actions, bannerVariant) {
	const primaryVariant = require_components_Banner_utils.BANNER_TO_BUTTON_VARIANT[bannerVariant];
	const unsetIndices = [];
	actions.forEach((child, i) => {
		if (require_components_Banner_utils.hasDisplayName(child, "Button") && (0, react.isValidElement)(child) && child.props.variant === void 0) unsetIndices.push(i);
	});
	return actions.map((child, i) => {
		if (!unsetIndices.includes(i)) return child;
		const variant = i === unsetIndices[unsetIndices.length - 1] ? primaryVariant : "secondary";
		return (0, react.cloneElement)(child, {
			key: child.key ?? i,
			variant
		});
	});
}
/**
* **An inline notification banner for contextual messages with optional actions.**
*
* @componentType Server component
*
* @description
* Banner is an inline, non-floating notification component that sits in normal document flow.
* It supports 12 color variants, an optional icon, title, description (truncated to 3 lines),
* composable actions via children, and an optional dismiss button.
*
* Use `title` and `description` props for simple text content, or pass `BannerContent`
* with `BannerTitle` and `BannerDescription` subcomponents for rich ReactNode content.
* Any non-BannerContent children are rendered in the actions area.
*
* @see
* Check out the {@link https://uds.build/docs/components/banner Banner Docs} for more info
*
* @example
* ```tsx
* // Simple — props-based
* <Banner variant="info" startIcon={Info} title="Update available" />
*
* // With actions as children
* <Banner variant="brand-secondary" startIcon={Megaphone} title="Notification"
*   description="Description text." onDismiss={() => {}}>
*   <Link href="/docs">Learn more</Link>
*   <Button variant="secondary" size="sm">Edit</Button>
*   <Button variant="brand" size="sm">Send</Button>
* </Banner>
*
* // Rich content via subcomponents
* <Banner variant="alert" startIcon={Error} onDismiss={() => {}}>
*   <BannerContent>
*     <BannerTitle>Error <strong>occurred</strong></BannerTitle>
*     <BannerDescription>Something went wrong.</BannerDescription>
*   </BannerContent>
*   <Button variant="alert" size="sm">Retry</Button>
* </Banner>
* ```
*
* @related [Badge](https://uds.build/docs/components/badge), [Toast](https://uds.build/docs/components/toast)
**/
const Banner = (0, react.forwardRef)(function Banner({ variant = "primary", size = "default", startIcon, title, description, onDismiss, dismissAriaLabel = "Dismiss", className, children, slotProps, ...rest }, ref) {
	const hasTitle = !!(typeof title === "string" ? title.trim() : title);
	const hasDescription = !!(typeof description === "string" ? description.trim() : description);
	const rootStyles = require_styles_styler.getStyles({
		bannerVariantRoot: variant,
		bannerSizeRoot: size,
		className: require_styles_styler.cx(BASE_CLASS, "flex flex-row", hasTitle !== hasDescription ? "items-center" : "items-start", "min-w-[300px]", className)
	});
	const iconStyles = require_styles_styler.getStyles({
		bannerVariantIcon: variant,
		bannerSizeIcon: size
	});
	const titleStyles = require_styles_styler.getStyles({
		bannerVariantTitle: variant,
		bannerSizeTitle: size,
		className: "truncate"
	});
	const descriptionStyles = require_styles_styler.getStyles({
		bannerVariantDescription: variant,
		bannerSizeDescription: size,
		className: "line-clamp-3"
	});
	const dismissStyles = require_styles_styler.getStyles({ bannerSizeClose: size });
	const { content: bannerContent, actions: rawActions } = require_components_Banner_utils.separateChildren(children);
	const actions = bindActionVariants(rawActions, variant);
	const hasActions = actions.length > 0;
	const contentArea = bannerContent ?? (hasTitle || hasDescription ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
		className: "flex flex-col self-stretch flex-1 min-w-0 gap-0.5",
		"data-testid": "banner-content",
		children: [hasTitle && (typeof title === "string" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_Text.Text, {
			className: titleStyles,
			"data-testid": "banner-title",
			children: title
		}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
			className: "w-full truncate leading-none",
			"data-testid": "banner-title",
			children: title
		})), hasDescription && (typeof description === "string" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_Text.Text, {
			className: descriptionStyles,
			"data-testid": "banner-description",
			children: description
		}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
			className: "w-full line-clamp-3",
			"data-testid": "banner-description",
			children: description
		}))]
	}) : null);
	const dismissContainerStyles = require_styles_styler.getStyles({
		spacing: "2",
		borderRadius: "full",
		color: "primary",
		className: require_styles_styler.cx("transition-[background-color] motion-safe:duration-120", "bg-carbon-15/0 hover:bg-carbon-15/10 active:bg-carbon-15/15", "uds-ring", "shrink-0 self-start")
	});
	const dismissButton = onDismiss ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_client_Pressable.Pressable, {
		"aria-label": dismissAriaLabel,
		onClick: onDismiss,
		className: dismissContainerStyles,
		"data-testid": "banner-dismiss",
		...slotProps?.dismiss,
		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_IconSlot.IconSlot, {
			icon: _yahoo_uds_icons.Cross,
			iconProps: {
				color: "inherit",
				className: dismissStyles
			}
		})
	}) : null;
	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
		ref,
		className: rootStyles,
		...rest,
		children: [
			startIcon && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_IconSlot.IconSlot, {
				icon: startIcon,
				iconProps: { color: "inherit" },
				className: require_styles_styler.cx(iconStyles, "shrink-0"),
				"data-testid": "banner-start-icon",
				...slotProps?.startIcon
			}),
			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
				className: require_styles_styler.cx("flex flex-1 min-w-0 flex-col items-start gap-[inherit] uds-sm:flex-row", hasTitle !== hasDescription && "uds-sm:items-center"),
				children: [contentArea, hasActions && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
					className: "flex self-stretch flex-row items-center gap-1.5 uds-sm:self-center uds-sm:shrink-0",
					"data-testid": "banner-actions",
					...slotProps?.actions,
					children: actions
				})]
			}),
			dismissButton
		]
	});
});
Banner.displayName = "Banner";
//#endregion
exports.Banner = Banner;
