@payfit/unity-components 3.1.13 → 3.1.15

package/dist/esm/components/funnel-layout/FunnelLayout.d.ts

@@ -1,40 +0,0 @@
-import { default as React, PropsWithChildren } from 'react';
-import { VariantProps } from '@payfit/unity-themes';
-export declare const funnelLayout: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, "uy:relative uy:h-dvh uy:flex uy:flex-col uy:bg-canvas uy:overflow-auto", {} | {}, undefined, import('tailwind-variants').TVReturnTypeLike<unknown, undefined>>;
-export interface FunnelLayoutProps extends PropsWithChildren<VariantProps<typeof funnelLayout>> {
-    /** The header content for the funnel layout, typically a FunnelTopBar component */
-    header: React.JSX.Element;
-}
-/**
- * The `FunnelLayout` component provides a structured layout for multi-step processes and funnels.
- * It creates a responsive layout with a fixed top bar and a main content area that accepts
- * children components like FunnelBody, FunnelSidebar, and FunnelPage.
- * @param {FunnelLayoutProps} props - The props for the `FunnelLayout` component
- * @example
- * ```tsx
- * import { FunnelLayout, FunnelTopBar, FunnelBody, FunnelSidebar, FunnelPage } from '@payfit/unity-components'
- *
- * function Example() {
- *   return (
- *     <FunnelLayout header={<FunnelTopBar title="Setup Process" leading={<FunnelBackButton label="Back" onPress={handleBack} />} />}>
- *       <FunnelBody>
- *         <FunnelSidebar>Sidebar content</FunnelSidebar>
- *         <FunnelPage>Main content</FunnelPage>
- *       </FunnelBody>
- *     </FunnelLayout>
- *   )
- * }
- * ```
- * @remarks
- * - Provides skip navigation links for keyboard users
- * - Automatically generates unique IDs for accessibility attributes
- * - Creates a full viewport height layout with sticky top bar
- * - Automatically sets DataDog's session replay privacy to `data-dd-privacy="mask-user-input"`
- * @see {@link FunnelLayoutProps} for all available props
- * @see Source code in {@link https://github.com/PayFit/hr-apps/blob/master/libs/shared/unity/components/src/components/funnel-layout GitHub}
- * @see Design specs {@link https://www.figma.com/design/poaMyU7abAgL9VRhx4ygyy/Unity-DS-%3E-Components-Library?node-id=10802-11500&m=dev Figma}
- * @see Design docs in {@link https://www.payfit.design/24f360409/p/88f9fc-funnel/b/24ca6f Payfit.design}
- * @see Developer docs in {@link https://unity-components.payfit.io/?path=/docs/layout-funnellayout--docs unity-components.payfit.io}
- */
-declare const FunnelLayout: React.ForwardRefExoticComponent<FunnelLayoutProps & React.RefAttributes<HTMLDivElement>>;
-export { FunnelLayout };

package/dist/esm/components/funnel-layout/FunnelLayout.js

@@ -1,75 +0,0 @@
-import { SkipLink as e, SkipLinks as t } from "../skip-links/SkipLinks.js";
-import { FunnelLayoutProvider as n } from "./FunnelLayout.context.js";
-import { forwardRef as r, useMemo as i } from "react";
-import { uyTv as a } from "@payfit/unity-themes";
-import { jsx as o, jsxs as s } from "react/jsx-runtime";
-import { FormattedMessage as c } from "react-intl";
-import { useId as l } from "react-aria/useId";
-//#region src/components/funnel-layout/FunnelLayout.tsx
-var u = a({ base: "uy:relative uy:h-dvh uy:flex uy:flex-col uy:bg-canvas uy:overflow-auto" }), d = r(({ children: r, header: a, ...d }, f) => {
-	let p = l(), m = i(() => ({
-		mainContentId: `funnel-main-content-${p}`,
-		topbarId: `funnel-top-bar-${p}`,
-		asideId: `funnel-complementary-left-content-${p}`,
-		funnelTitleId: `funnel-title-${p}`,
-		funnelDescriptionId: `funnel-description-${p}`,
-		funnelStatusId: `funnel-status-${p}`,
-		footerId: `funnel-footer-${p}`
-	}), [p]);
-	return /* @__PURE__ */ o(n, {
-		ids: m,
-		children: /* @__PURE__ */ s("div", {
-			"data-dd-privacy": "mask-user-input",
-			...d,
-			ref: f,
-			className: u(),
-			"data-unity-component": "FunnelLayout",
-			style: { "--uy-funnel-sidebar-offset": "calc(var(--uy-spacing-800) + var(--uy-spacing-600))" },
-			children: [
-				/* @__PURE__ */ s(t, { children: [
-					/* @__PURE__ */ o(e, {
-						targetId: m.topbarId,
-						children: /* @__PURE__ */ o(c, {
-							id: "unity:layout:funnel:skip-links:top-bar",
-							defaultMessage: "Top bar"
-						})
-					}),
-					/* @__PURE__ */ o(e, {
-						targetId: m.mainContentId,
-						children: /* @__PURE__ */ o(c, {
-							id: "unity:layout:funnel:skip-links:main-content",
-							defaultMessage: "Main content"
-						})
-					}),
-					/* @__PURE__ */ o(e, {
-						targetId: m.asideId,
-						children: /* @__PURE__ */ o(c, {
-							id: "unity:layout:funnel:skip-links:sidebar",
-							defaultMessage: "Sidebar"
-						})
-					}),
-					/* @__PURE__ */ o(e, {
-						targetId: m.footerId,
-						children: /* @__PURE__ */ o(c, {
-							id: "unity:layout:funnel:skip-links:footer",
-							defaultMessage: "Footer"
-						})
-					})
-				] }),
-				/* @__PURE__ */ o("div", {
-					"data-unity-component": "FunnelTopBar",
-					className: "uy:sticky uy:top-0 uy:z-10",
-					children: a
-				}),
-				/* @__PURE__ */ o("div", {
-					className: "uy:flex-1 uy:flex uy:md:block uy:overflow-visible",
-					"data-unity-slot": "funnel-layout-content-wrapper",
-					children: r
-				})
-			]
-		})
-	});
-});
-d.displayName = "FunnelLayout";
-//#endregion
-export { d as FunnelLayout, u as funnelLayout };

package/dist/esm/components/funnel-layout/parts/FunnelBackButton.js

@@ -1,25 +0,0 @@
-import { useBreakpointListener as e } from "../../../hooks/use-breakpoint-listener.js";
-import { Button as t } from "../../button/Button.js";
-import { IconButton as n } from "../../icon-button/IconButton.js";
-import { jsx as r } from "react/jsx-runtime";
-//#region src/components/funnel-layout/parts/FunnelBackButton.tsx
-var i = ({ label: i, onPress: a, truncateLabelLength: o }) => {
-	let s = e();
-	return ["xs", "sm"].includes(s) ? /* @__PURE__ */ r(n, {
-		variant: "ghost",
-		color: "neutral",
-		icon: "ArrowLeftOutlined",
-		label: i,
-		onClick: a
-	}) : /* @__PURE__ */ r(t, {
-		variant: "ghost",
-		color: "neutral",
-		prefixIcon: "ArrowLeftOutlined",
-		onPress: a,
-		truncateLabelLength: o,
-		children: i
-	});
-};
-i.displayName = "FunnelBackButton";
-//#endregion
-export { i as FunnelBackButton };

package/dist/esm/components/funnel-layout/parts/FunnelBody.d.ts

@@ -1,36 +0,0 @@
-import { VariantProps } from '@payfit/unity-themes';
-import { PropsWithChildren } from 'react';
-export declare const funnelBody: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, "uy:group/funnelbody uy:mx-auto uy:w-full uy:min-h-full uy:flex-1 uy:md:max-w-(--uy-container-lg) uy:md:px-300 uy:lg:max-w-(--uy-container-xl) uy:flex uy:flex-col uy:md:flex-row uy:gap-x-200 uy:md:py-600", {} | {}, undefined, import('tailwind-variants').TVReturnTypeLike<unknown, undefined>>;
-export type FunnelBodyProps = PropsWithChildren<VariantProps<typeof funnelBody>>;
-/**
- * The `FunnelBody` component provides the main content container for the funnel layout.
- * It creates a responsive flex layout that accommodates both sidebar and main content areas
- * with proper spacing and maximum width constraints.
- * @param {FunnelBodyProps} props - The props for the `FunnelBody` component
- * @example
- * ```tsx
- * import { FunnelBody } from '@payfit/unity-components'
- *
- * function Example() {
- *   return (
- *     <FunnelBody>
- *       <FunnelSidebar>Sidebar content</FunnelSidebar>
- *       <FunnelPage>Main content</FunnelPage>
- *     </FunnelBody>
- *   )
- * }
- * ```
- * @remarks
- * - Automatically adjusts layout based on presence of sidebar
- * - Provides responsive breakpoints for mobile and desktop layouts
- * - Automatically sets DataDog's session replay privacy to `data-dd-privacy="allow"`
- * @see {@link FunnelBodyProps} for all available props
- * @see Source code in {@link https://github.com/PayFit/hr-apps/blob/master/libs/shared/unity/components/src/components/funnel-layout/parts GitHub}
- * @see Design specs {@link https://www.figma.com/design/poaMyU7abAgL9VRhx4ygyy/Unity-DS-%3E-Components-Library?node-id=10802-11500&m=dev Figma}
- * @see Design docs in {@link https://www.payfit.design/24f360409/p/88f9fc-funnel/b/24ca6f Payfit.design}
- * @see Developer docs in {@link https://unity-components.payfit.io/?path=/docs/layout-funnellayout-funnelbody--docs unity-components.payfit.io}
- */
-declare const FunnelBody: import('react').ForwardRefExoticComponent<VariantProps<import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, "uy:group/funnelbody uy:mx-auto uy:w-full uy:min-h-full uy:flex-1 uy:md:max-w-(--uy-container-lg) uy:md:px-300 uy:lg:max-w-(--uy-container-xl) uy:flex uy:flex-col uy:md:flex-row uy:gap-x-200 uy:md:py-600", {} | {}, undefined, import('tailwind-variants').TVReturnTypeLike<unknown, undefined>>> & {
-    children?: import('react').ReactNode | undefined;
-} & import('react').RefAttributes<HTMLDivElement>>;
-export { FunnelBody };

package/dist/esm/components/funnel-layout/parts/FunnelBody.js

@@ -1,15 +0,0 @@
-import { forwardRef as e } from "react";
-import { uyTv as t } from "@payfit/unity-themes";
-import { jsx as n } from "react/jsx-runtime";
-//#region src/components/funnel-layout/parts/FunnelBody.tsx
-var r = t({ base: "uy:group/funnelbody uy:mx-auto uy:w-full uy:min-h-full uy:flex-1 uy:md:max-w-(--uy-container-lg) uy:md:px-300 uy:lg:max-w-(--uy-container-xl) uy:flex uy:flex-col uy:md:flex-row uy:gap-x-200 uy:md:py-600" }), i = e(({ children: e, ...t }, i) => /* @__PURE__ */ n("div", {
-	ref: i,
-	"data-dd-privacy": "allow",
-	...t,
-	className: r(),
-	"data-unity-component": "FunnelBody",
-	children: e
-}));
-i.displayName = "FunnelBody";
-//#endregion
-export { i as FunnelBody, r as funnelBody };

package/dist/esm/components/funnel-layout/parts/FunnelPage.d.ts

@@ -1,36 +0,0 @@
-import { VariantProps } from '@payfit/unity-themes';
-import { PropsWithChildren } from 'react';
-export declare const funnelPage: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, string[], {} | {}, undefined, import('tailwind-variants').TVReturnTypeLike<unknown, undefined>>;
-export type FunnelPageProps = PropsWithChildren<VariantProps<typeof funnelPage>>;
-/**
- * The `FunnelPage` component represents the main content area of the funnel layout.
- * It provides the primary content container with proper accessibility attributes
- * and responsive sizing that adapts based on whether a sidebar is present.
- * @param {FunnelPageProps} props - The props for the `FunnelPage` component
- * @example
- * ```tsx
- * import { FunnelPage } from '@payfit/unity-components'
- *
- * function Example() {
- *   return (
- *     <FunnelPage>
- *       <div>Main content here</div>
- *     </FunnelPage>
- *   )
- * }
- * ```
- * @remarks
- * - Automatically receives accessibility attributes from `FunnelLayout` context
- * - Adapts width based on sidebar presence
- * - Provides proper semantic structure with main element
- * - Automatically sets DataDog's session replay privacy to `data-dd-privacy="mask-user-input"`
- * @see {@link FunnelPageProps} for all available props
- * @see Source code in {@link https://github.com/PayFit/hr-apps/blob/master/libs/shared/unity/components/src/components/funnel-layout/parts GitHub}
- * @see Design specs {@link https://www.figma.com/design/poaMyU7abAgL9VRhx4ygyy/Unity-DS-%3E-Components-Library?node-id=10802-11500&m=dev Figma}
- * @see Design docs in {@link https://www.payfit.design/24f360409/p/88f9fc-funnel/b/24ca6f Payfit.design}
- * @see Developer docs in {@link https://unity-components.payfit.io/?path=/docs/layout-funnellayout-funnelpage--docs unity-components.payfit.io}
- */
-declare const FunnelPage: import('react').ForwardRefExoticComponent<VariantProps<import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, string[], {} | {}, undefined, import('tailwind-variants').TVReturnTypeLike<unknown, undefined>>> & {
-    children?: import('react').ReactNode | undefined;
-} & import('react').RefAttributes<HTMLElement>>;
-export { FunnelPage };

package/dist/esm/components/funnel-layout/parts/FunnelPage.js

@@ -1,27 +0,0 @@
-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";
-//#region src/components/funnel-layout/parts/FunnelPage.tsx
-var i = n({ base: [
-	"uy:group/funnelpage uy:bg-surface-neutral uy:p-100 uy:pb-500 uy:md:shadow-raising uy:md:border-border-neutral uy:md:border uy:md:border-solid uy:md:rounded-400",
-	"uy:basis-full uy:shrink-0 uy:grow-1 uy:md:shrink",
-	"uy:flex uy:flex-col",
-	"uy:md:max-w-container-lg uy:lg:max-w-container-xl"
-] }), a = t(({ children: t, ...n }, a) => {
-	let { ids: o } = e();
-	return /* @__PURE__ */ r("main", {
-		"data-dd-privacy": "mask-user-input",
-		...n,
-		ref: a,
-		id: o.mainContentId,
-		"aria-labelledby": o.funnelTitleId,
-		"aria-describedby": o.funnelDescriptionId,
-		className: i(),
-		"data-unity-component": "FunnelPage",
-		children: t
-	});
-});
-a.displayName = "FunnelPage";
-//#endregion
-export { a as FunnelPage, i as funnelPage };

package/dist/esm/components/funnel-layout/parts/FunnelPageAction.d.ts

@@ -1,40 +0,0 @@
-import { PropsWithChildren } from 'react';
-import { ButtonProps } from '../../button/Button.js';
-export interface FunnelPageActionProps extends PropsWithChildren<Omit<ButtonProps, 'variant' | 'color' | 'size'>> {
-    /**
-     * The action type determines the default styling and behavior.
-     * - 'previous': Uses outlined variant for navigation back
-     * - 'next': Uses primary variant for progression forward
-     * - 'optional': Uses ghost variant for optional actions like skip
-     */
-    actionType: 'previous' | 'next' | 'optional';
-}
-/**
- * The `FunnelPageAction` component is a wrapper around the Button component specifically designed for funnel page actions.
- * It provides sensible defaults based on the action type while allowing full customization through Button props.
- * @param {FunnelPageActionProps} props - The props for the `FunnelPageAction` component
- * @example
- * ```tsx
- * import { FunnelPageAction } from '@payfit/unity-components'
- *
- * function Example() {
- *   return (
- *     <FunnelPageAction actionType="next" onPress={handleNext}>
- *       Next
- *     </FunnelPageAction>
- *   )
- * }
- * ```
- * @remarks
- * - Automatically applies appropriate button variants based on action type
- * - Previous actions use outlined variant, next actions use primary variant
- * - Optional actions use ghost variant for less prominent actions
- * - Automatically sets DataDog's session replay privacy to `data-dd-privacy="allow"`
- * @see {@link FunnelPageActionProps} for all available props
- * @see Source code in {@link https://github.com/PayFit/hr-apps/blob/master/libs/shared/unity/components/src/components/funnel-layout/parts GitHub}
- * @see Design specs {@link https://www.figma.com/design/poaMyU7abAgL9VRhx4ygyy/Unity-DS-%3E-Components-Library?node-id=10802-11500&m=dev Figma}
- * @see Design docs in {@link https://www.payfit.design/24f360409/p/88f9fc-funnel/b/24ca6f Payfit.design}
- * @see Developer docs in {@link https://unity-components.payfit.io/?path=/docs/layout-funnellayout-funnelpage-funnelpageaction--docs unity-components.payfit.io}
- */
-declare const FunnelPageAction: import('react').ForwardRefExoticComponent<FunnelPageActionProps & import('react').RefAttributes<HTMLButtonElement>>;
-export { FunnelPageAction };

package/dist/esm/components/funnel-layout/parts/FunnelPageAction.js

@@ -1,28 +0,0 @@
-import { Button as e } from "../../button/Button.js";
-import { forwardRef as t, useCallback as n } from "react";
-import { jsx as r } from "react/jsx-runtime";
-//#region src/components/funnel-layout/parts/FunnelPageAction.tsx
-var i = t(({ actionType: t, children: i, ...a }, o) => /* @__PURE__ */ r(e, {
-	ref: o,
-	"data-dd-privacy": "allow",
-	...n((e) => {
-		switch (e) {
-			case "previous": return { variant: "outlined" };
-			case "next": return {
-				variant: "primary",
-				color: "primary"
-			};
-			case "optional": return {
-				variant: "ghost",
-				color: "neutral"
-			};
-		}
-	}, [])(t),
-	...a,
-	"data-unity-component": "FunnelPageAction",
-	"data-action-type": t,
-	children: i
-}));
-i.displayName = "FunnelPageAction";
-//#endregion
-export { i as FunnelPageAction };

package/dist/esm/components/funnel-layout/parts/FunnelPageActions.d.ts

@@ -1,47 +0,0 @@
-import { VariantProps } from '@payfit/unity-themes';
-export declare const funnelPageActions: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, "uy:flex uy:flex-col uy:gap-200 uy:md:flex-row uy:md:justify-between", {} | {}, undefined, import('tailwind-variants').TVReturnTypeLike<unknown, undefined>>;
-export interface FunnelPageActionsProps extends VariantProps<typeof funnelPageActions> {
-    /**
-     * Render function for the next action. This is mandatory as it's the only action that's always shown.
-     */
-    renderNext: () => React.ReactNode;
-    /**
-     * Render function for the previous action. Only rendered if provided.
-     */
-    renderPrevious?: () => React.ReactNode;
-    /**
-     * Render function for optional actions (like skip). Only rendered if provided.
-     */
-    renderOptionalActions?: () => React.ReactNode;
-}
-/**
- * The `FunnelPageActions` component provides a structured way to render funnel page actions.
- * It manages the layout and rendering of previous, next, and optional actions with proper spacing and responsive design.
- * @param {FunnelPageActionsProps} props - The props for the `FunnelPageActions` component
- * @example
- * ```tsx
- * import { FunnelPageActions } from '@payfit/unity-components'
- *
- * function Example() {
- *   return (
- *     <FunnelPageActions
- *       renderNext={() => <Button variant="primary">Next</Button>}
- *       renderPrevious={() => <Button variant="secondary">Previous</Button>}
- *       renderOptionalActions={() => <Button variant="ghost">Skip</Button>}
- *     />
- *   )
- * }
- * ```
- * @remarks
- * - Automatically adapts layout based on screen size (mobile vs desktop)
- * - Provides consistent spacing between action groups
- * - Uses render functions for maximum flexibility in action content
- * - Automatically sets DataDog's session replay privacy to `data-dd-privacy="allow"`
- * @see {@link FunnelPageActionsProps} for all available props
- * @see Source code in {@link https://github.com/PayFit/hr-apps/blob/master/libs/shared/unity/components/src/components/funnel-layout/parts GitHub}
- * @see Design specs {@link https://www.figma.com/design/poaMyU7abAgL9VRhx4ygyy/Unity-DS-%3E-Components-Library?node-id=10802-11500&m=dev Figma}
- * @see Design docs in {@link https://www.payfit.design/24f360409/p/88f9fc-funnel/b/24ca6f Payfit.design}
- * @see Developer docs in {@link https://unity-components.payfit.io/?path=/docs/layout-funnellayout-funnelpage-funnelpageactions--docs unity-components.payfit.io}
- */
-declare const FunnelPageActions: import('react').ForwardRefExoticComponent<FunnelPageActionsProps & import('react').RefAttributes<HTMLDivElement>>;
-export { FunnelPageActions };

package/dist/esm/components/funnel-layout/parts/FunnelPageActions.js

@@ -1,30 +0,0 @@
-import { useBreakpointListener as e } from "../../../hooks/use-breakpoint-listener.js";
-import { forwardRef as t } from "react";
-import { uyTv as n } from "@payfit/unity-themes";
-import { Fragment as r, jsx as i, jsxs as a } from "react/jsx-runtime";
-//#region src/components/funnel-layout/parts/FunnelPageActions.tsx
-var o = n({ base: "uy:flex uy:flex-col uy:gap-200 uy:md:flex-row uy:md:justify-between" }), s = t(({ renderNext: t, renderPrevious: n, renderOptionalActions: s, ...c }, l) => {
-	let u = e(), d = u === "xs" || u === "sm";
-	return /* @__PURE__ */ a("div", {
-		ref: l,
-		"data-dd-privacy": "allow",
-		...c,
-		className: o(),
-		role: "group",
-		"data-unity-component": "FunnelPageActions",
-		children: [d && /* @__PURE__ */ a(r, { children: [
-			t(),
-			n?.(),
-			s?.()
-		] }), !d && /* @__PURE__ */ a(r, { children: [/* @__PURE__ */ i("div", {
-			className: "uy:flex uy:gap-100",
-			children: s?.()
-		}), /* @__PURE__ */ a("div", {
-			className: "uy:flex uy:gap-100",
-			children: [n?.(), t()]
-		})] })]
-	});
-});
-s.displayName = "FunnelPageActions";
-//#endregion
-export { s as FunnelPageActions, o as funnelPageActions };

package/dist/esm/components/funnel-layout/parts/FunnelPageContent.d.ts

@@ -1,35 +0,0 @@
-import { VariantProps } from '@payfit/unity-themes';
-import { PropsWithChildren } from 'react';
-export declare const funnelPageContent: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, "uy:flex-1 uy:px-300 uy:my-400 uy:md:px-400 uy:group-has-[[data-unity-component=\"FunnelPageHeader\"]]/funnelpage:mt-0", {} | {}, undefined, import('tailwind-variants').TVReturnTypeLike<unknown, undefined>>;
-export type FunnelPageContentProps = PropsWithChildren<VariantProps<typeof funnelPageContent>>;
-/**
- * The `FunnelPageContent` component provides the main content area of a funnel page.
- * It creates a flexible content container with responsive padding that adapts to different screen sizes.
- * @param {FunnelPageContentProps} props - The props for the `FunnelPageContent` component
- * @example
- * ```tsx
- * import { FunnelPageContent } from '@payfit/unity-components'
- *
- * function Example() {
- *   return (
- *     <FunnelPageContent>
- *       <div>Main content here</div>
- *     </FunnelPageContent>
- *   )
- * }
- * ```
- * @remarks
- * - Automatically adjusts top margin when FunnelPageHeader is present
- * - Provides consistent padding across different screen sizes
- * - Uses semantic section element for proper document structure
- * - Automatically sets DataDog's session replay privacy to `data-dd-privacy="mask"`
- * @see {@link FunnelPageContentProps} for all available props
- * @see Source code in {@link https://github.com/PayFit/hr-apps/blob/master/libs/shared/unity/components/src/components/funnel-layout/parts GitHub}
- * @see Design specs {@link https://www.figma.com/design/poaMyU7abAgL9VRhx4ygyy/Unity-DS-%3E-Components-Library?node-id=10802-11500&m=dev Figma}
- * @see Design docs in {@link https://www.payfit.design/24f360409/p/88f9fc-funnel/b/24ca6f Payfit.design}
- * @see Developer docs in {@link https://unity-components.payfit.io/?path=/docs/layout-funnellayout-funnelpage-funnelpagecontent--docs unity-components.payfit.io}
- */
-declare const FunnelPageContent: import('react').ForwardRefExoticComponent<VariantProps<import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, "uy:flex-1 uy:px-300 uy:my-400 uy:md:px-400 uy:group-has-[[data-unity-component=\"FunnelPageHeader\"]]/funnelpage:mt-0", {} | {}, undefined, import('tailwind-variants').TVReturnTypeLike<unknown, undefined>>> & {
-    children?: import('react').ReactNode | undefined;
-} & import('react').RefAttributes<HTMLElement>>;
-export { FunnelPageContent };

package/dist/esm/components/funnel-layout/parts/FunnelPageContent.js

@@ -1,15 +0,0 @@
-import { forwardRef as e } from "react";
-import { uyTv as t } from "@payfit/unity-themes";
-import { jsx as n } from "react/jsx-runtime";
-//#region src/components/funnel-layout/parts/FunnelPageContent.tsx
-var r = t({ base: "uy:flex-1 uy:px-300 uy:my-400 uy:md:px-400 uy:group-has-[[data-unity-component=\"FunnelPageHeader\"]]/funnelpage:mt-0" }), i = e(({ children: e, ...t }, i) => /* @__PURE__ */ n("section", {
-	"data-dd-privacy": "mask",
-	...t,
-	ref: i,
-	className: r(),
-	"data-unity-component": "FunnelPageContent",
-	children: e
-}));
-i.displayName = "FunnelPageContent";
-//#endregion
-export { i as FunnelPageContent, r as funnelPageContent };

package/dist/esm/components/funnel-layout/parts/FunnelPageFooter.d.ts

@@ -1,36 +0,0 @@
-import { VariantProps } from '@payfit/unity-themes';
-import { PropsWithChildren } from 'react';
-export declare const funnelPageFooter: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, "uy:px-300 uy:md:px-400", {} | {}, undefined, import('tailwind-variants').TVReturnTypeLike<unknown, undefined>>;
-export type FunnelPageFooterProps = PropsWithChildren<VariantProps<typeof funnelPageFooter>>;
-/**
- * The `FunnelPageFooter` component provides the footer section of a funnel page.
- * It creates a flexible footer container with responsive layout that adapts to different screen sizes.
- * @param {FunnelPageFooterProps} props - The props for the `FunnelPageFooter` component
- * @example
- * ```tsx
- * import { FunnelPageFooter } from '@payfit/unity-components'
- *
- * function Example() {
- *   return (
- *     <FunnelPageFooter>
- *       <Button>Previous</Button>
- *       <Button>Next</Button>
- *     </FunnelPageFooter>
- *   )
- * }
- * ```
- * @remarks
- * - Automatically receives accessibility attributes from FunnelLayout context
- * - Provides consistent padding across different screen sizes
- * - Uses semantic footer element for proper document structure
- * - Automatically sets DataDog's session replay privacy to `data-dd-privacy="allow"`
- * @see {@link FunnelPageFooterProps} for all available props
- * @see Source code in {@link https://github.com/PayFit/hr-apps/blob/master/libs/shared/unity/components/src/components/funnel-layout/parts GitHub}
- * @see Design specs {@link https://www.figma.com/design/poaMyU7abAgL9VRhx4ygyy/Unity-DS-%3E-Components-Library?node-id=10802-11500&m=dev Figma}
- * @see Design docs in {@link https://www.payfit.design/24f360409/p/88f9fc-funnel/b/24ca6f Payfit.design}
- * @see Developer docs in {@link https://unity-components.payfit.io/?path=/docs/layout-funnellayout-funnelpage-funnelpagefooter--docs unity-components.payfit.io}
- */
-declare const FunnelPageFooter: import('react').ForwardRefExoticComponent<VariantProps<import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, "uy:px-300 uy:md:px-400", {} | {}, undefined, import('tailwind-variants').TVReturnTypeLike<unknown, undefined>>> & {
-    children?: import('react').ReactNode | undefined;
-} & import('react').RefAttributes<HTMLElement>>;
-export { FunnelPageFooter };

package/dist/esm/components/funnel-layout/parts/FunnelPageFooter.js

@@ -1,20 +0,0 @@
-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";
-//#region src/components/funnel-layout/parts/FunnelPageFooter.tsx
-var i = n({ base: "uy:px-300 uy:md:px-400" }), a = t(({ children: t, ...n }, a) => {
-	let { ids: o } = e();
-	return /* @__PURE__ */ r("footer", {
-		ref: a,
-		"data-dd-privacy": "allow",
-		...n,
-		className: i(),
-		"data-unity-component": "FunnelPageFooter",
-		id: o.footerId,
-		children: t
-	});
-});
-a.displayName = "FunnelPageFooter";
-//#endregion
-export { a as FunnelPageFooter, i as funnelPageFooter };

package/dist/esm/components/funnel-layout/parts/FunnelPageHeader.d.ts

@@ -1,77 +0,0 @@
-import { VariantProps } from '@payfit/unity-themes';
-import { PropsWithChildren, ReactNode } from 'react';
-export declare const funnelPageHeader: import('tailwind-variants').TVReturnType<{
-    gradient: {
-        default: {
-            base: string;
-        };
-    };
-}, {
-    base: string;
-    hgroup: string;
-    figure: string;
-    figcaption: string;
-}, undefined, {
-    gradient: {
-        default: {
-            base: string;
-        };
-    };
-}, {
-    base: string;
-    hgroup: string;
-    figure: string;
-    figcaption: string;
-}, import('tailwind-variants').TVReturnTypeLike<{
-    gradient: {
-        default: {
-            base: string;
-        };
-    };
-}, {
-    base: string;
-    hgroup: string;
-    figure: string;
-    figcaption: string;
-}>>;
-export interface FunnelPageHeaderProps extends PropsWithChildren<VariantProps<typeof funnelPageHeader>> {
-    title: string;
-    subtitle: ReactNode;
-    style?: VariantProps<typeof funnelPageHeader>['gradient'];
-    imageSlot?: React.ReactNode;
-    imageSlotAltText?: string;
-}
-/**
- * The `FunnelPageHeader` component provides the header section of a funnel page with title, subtitle, and optional image.
- * It displays the page title and subtitle in a structured layout with a responsive design that adapts to different screen sizes.
- * You can control the gradient appearance using the `gradient` prop to indicate different states or contexts.
- * @param {FunnelPageHeaderProps} props - The props for the `FunnelPageHeader` component
- * @example
- * ```tsx
- * import { FunnelPageHeader } from '@payfit/unity-components'
- *
- * function Example() {
- *   return (
- *     <FunnelPageHeader
- *       title="Page Title"
- *       subtitle="Page Subtitle"
- *       style="warning"
- *       imageSlot={<img src="image.jpg" alt="description" />}
- *       imageSlotAltText="Image description"
- *     />
- *   )
- * }
- * ```
- * @remarks
- * - Automatically provides accessibility attributes for screen readers
- * - Supports different gradient styles for visual context
- * - Responsive image display that adapts to screen size
- * - Automatically sets DataDog's session replay privacy to `data-dd-privacy="allow"`
- * @see {@link FunnelPageHeaderProps} for all available props
- * @see Source code in {@link https://github.com/PayFit/hr-apps/blob/master/libs/shared/unity/components/src/components/funnel-layout/parts GitHub}
- * @see Design specs {@link https://www.figma.com/design/poaMyU7abAgL9VRhx4ygyy/Unity-DS-%3E-Components-Library?node-id=10802-11500&m=dev Figma}
- * @see Design docs in {@link https://www.payfit.design/24f360409/p/88f9fc-funnel/b/24ca6f Payfit.design}
- * @see Developer docs in {@link https://unity-components.payfit.io/?path=/docs/layout-funnellayout-funnelpage-funnelpageheader--docs unity-components.payfit.io}
- */
-declare const FunnelPageHeader: import('react').ForwardRefExoticComponent<FunnelPageHeaderProps & import('react').RefAttributes<HTMLElement>>;
-export { FunnelPageHeader };