@payfit/unity-components/dist/esm/components/funnel-layout/parts/FunnelSidebar.js

import { useFunnelLayoutContext as e } from "../FunnelLayout.context.js";
import { forwardRef as t } from "react";
import { uyTv as n } from "@payfit/unity-themes";
import { jsx as r } from "react/jsx-runtime";
import { useIntl as i } from "react-intl";
//#region src/components/funnel-layout/parts/FunnelSidebar.tsx
var a = n({
	base: [
		"uy:w-full uy:self-start uy:shrink uy:grow-0",
		"uy:sticky uy:top-8 uy:z-9",
		"uy:md:basis-1/3 uy:lg:basis-1/4 uy:md:shrink-0"
	],
	variants: { position: {
		sticky: ["uy:md:sticky uy:md:top-10"],
		static: ["uy:md:static"],
		fixed: ["uy:md:sticky uy:md:top-[var(--uy-funnel-sidebar-offset)]"]
	} },
	defaultVariants: { position: "sticky" }
}), o = t(({ children: t, position: n, "aria-label": o, ...s }, c) => {
	let { ids: l } = e(), u = i();
	return /* @__PURE__ */ r("aside", {
		ref: c,
		"aria-label": o ?? u.formatMessage({
			id: "unity:layout:funnel:sidebar:aria-label",
			defaultMessage: "Process steps"
		}),
		"aria-describedby": l.funnelTitleId,
		className: a({ position: n }),
		id: l.asideId,
		"data-unity-component": "FunnelSidebar",
		"data-dd-privacy": "allow",
		...s,
		children: t
	});
});
o.displayName = "FunnelSidebar";
//#endregion
export { o as FunnelSidebar, a as funnelSidebar };