@payfit/unity-components 2.46.15 → 2.46.17

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

@@ -1,27 +0,0 @@
-import { jsx as n } from "react/jsx-runtime";
-import { createContext as r, useContext as u } from "react";
-const e = r(
-  void 0
-), a = () => {
-  const t = u(e);
-  if (!t)
-    throw new Error(
-      "useFunnelLayout must be used within a FunnelLayoutProvider"
-    );
-  return t;
-}, x = ({
-  children: t,
-  ids: o
-}) => /* @__PURE__ */ n(
-  e.Provider,
-  {
-    value: {
-      ids: o
-    },
-    children: t
-  }
-);
-export {
-  x as FunnelLayoutProvider,
-  a as useFunnelLayoutContext
-};

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

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

@@ -1,41 +0,0 @@
-import { FC } from 'react';
-export interface FunnelBackButtonProps {
-    /**
-     * Label for the back button.
-     * Shown as text on desktop, used as aria-label on mobile.
-     */
-    label: string;
-    /**
-     * Callback when back button is pressed.
-     */
-    onPress: () => void;
-    /**
-     * Maximum length of the label to truncate.
-     * Defaults to 10 characters.
-     */
-    truncateLabelLength?: number;
-}
-/**
- * Back button component for use in FunnelTopBar leading slot.
- * Automatically adapts between desktop (text + icon) and mobile (icon only) layouts.
- * @example
- * ```tsx
- * import { FunnelTopBar, FunnelBackButton } from '@payfit/unity-components'
- *
- * function MyFunnel() {
- *   return (
- *     <FunnelTopBar
- *       leading={
- *         <FunnelBackButton
- *           label="Back to dashboard"
- *           onPress={handleBack}
- *         />
- *       }
- *       title="Step 2"
- *       progressValue={50}
- *     />
- *   )
- * }
- * ```
- */
-export declare const FunnelBackButton: FC<FunnelBackButtonProps>;

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

@@ -1,35 +0,0 @@
-import { jsx as n } from "react/jsx-runtime";
-import { useBreakpointListener as i } from "../../../hooks/use-breakpoint-listener.js";
-import { Button as s } from "../../button/Button.js";
-import { IconButton as c } from "../../icon-button/IconButton.js";
-const u = ({
-  label: t,
-  onPress: o,
-  truncateLabelLength: r
-}) => {
-  const e = i();
-  return !["xs", "sm"].includes(e) ? /* @__PURE__ */ n(
-    s,
-    {
-      variant: "ghost",
-      color: "neutral",
-      prefixIcon: "ArrowLeftOutlined",
-      onPress: o,
-      truncateLabelLength: r,
-      children: t
-    }
-  ) : /* @__PURE__ */ n(
-    c,
-    {
-      variant: "ghost",
-      color: "neutral",
-      icon: "ArrowLeftOutlined",
-      label: t,
-      onClick: o
-    }
-  );
-};
-u.displayName = "FunnelBackButton";
-export {
-  u 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').TVReturnType<unknown, 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", unknown, 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').TVReturnType<unknown, 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", unknown, unknown, undefined>>> & {
-    children?: import('react').ReactNode | undefined;
-} & import('react').RefAttributes<HTMLDivElement>>;
-export { FunnelBody };

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

@@ -1,23 +0,0 @@
-import { jsx as l } from "react/jsx-runtime";
-import { forwardRef as n } from "react";
-import { uyTv as a } from "@payfit/unity-themes";
-const e = a({
-  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"
-}), m = n(
-  ({ children: u, ...y }, o) => /* @__PURE__ */ l(
-    "div",
-    {
-      ref: o,
-      "data-dd-privacy": "allow",
-      ...y,
-      className: e(),
-      "data-unity-component": "FunnelBody",
-      children: u
-    }
-  )
-);
-m.displayName = "FunnelBody";
-export {
-  m as FunnelBody,
-  e 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').TVReturnType<unknown, undefined, string[], unknown, 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').TVReturnType<unknown, undefined, string[], unknown, unknown, undefined>>> & {
-    children?: import('react').ReactNode | undefined;
-} & import('react').RefAttributes<HTMLElement>>;
-export { FunnelPage };

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

@@ -1,35 +0,0 @@
-import { jsx as a } from "react/jsx-runtime";
-import { forwardRef as o } from "react";
-import { uyTv as d } from "@payfit/unity-themes";
-import { useFunnelLayoutContext as i } from "../FunnelLayout.context.js";
-const l = d({
-  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"
-  ]
-}), t = o(
-  ({ children: n, ...r }, u) => {
-    const { ids: e } = i();
-    return /* @__PURE__ */ a(
-      "main",
-      {
-        "data-dd-privacy": "mask-user-input",
-        ...r,
-        ref: u,
-        id: e.mainContentId,
-        "aria-labelledby": e.funnelTitleId,
-        "aria-describedby": e.funnelDescriptionId,
-        className: l(),
-        "data-unity-component": "FunnelPage",
-        children: n
-      }
-    );
-  }
-);
-t.displayName = "FunnelPage";
-export {
-  t as FunnelPage,
-  l 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 secondary variant for navigation back, outlined in rebrand
-     * - '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 secondary variant in legacy and outlined in rebrand, 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,39 +0,0 @@
-import { jsx as s } from "react/jsx-runtime";
-import { forwardRef as c, useCallback as u } from "react";
-import { useUnityTheme as l } from "@payfit/unity-themes";
-import { Button as p } from "../../button/Button.js";
-const m = c(
-  ({ actionType: t, children: a, ...e }, o) => {
-    const { theme: r } = l(), n = u(
-      (i) => {
-        switch (i) {
-          case "previous":
-            return {
-              variant: r === "rebrand" ? "outlined" : "secondary"
-            };
-          case "next":
-            return { variant: "primary", color: "primary" };
-          case "optional":
-            return { variant: "ghost", color: "neutral" };
-        }
-      },
-      [r]
-    )(t);
-    return /* @__PURE__ */ s(
-      p,
-      {
-        ref: o,
-        "data-dd-privacy": "allow",
-        ...n,
-        ...e,
-        "data-unity-component": "FunnelPageAction",
-        "data-action-type": t,
-        children: a
-      }
-    );
-  }
-);
-m.displayName = "FunnelPageAction";
-export {
-  m 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').TVReturnType<unknown, undefined, "uy:flex uy:flex-col uy:gap-200 uy:md:flex-row uy:md:justify-between", unknown, 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,41 +0,0 @@
-import { jsxs as e, Fragment as l, jsx as c } from "react/jsx-runtime";
-import { forwardRef as u } from "react";
-import { uyTv as m } from "@payfit/unity-themes";
-import { useBreakpointListener as y } from "../../../hooks/use-breakpoint-listener.js";
-const d = m({
-  base: "uy:flex uy:flex-col uy:gap-200 uy:md:flex-row uy:md:justify-between"
-}), f = u(
-  ({ renderNext: a, renderPrevious: n, renderOptionalActions: o, ...t }, r) => {
-    const s = y(), i = s === "xs" || s === "sm";
-    return /* @__PURE__ */ e(
-      "div",
-      {
-        ref: r,
-        "data-dd-privacy": "allow",
-        ...t,
-        className: d(),
-        role: "group",
-        "data-unity-component": "FunnelPageActions",
-        children: [
-          i && /* @__PURE__ */ e(l, { children: [
-            a(),
-            n?.(),
-            o?.()
-          ] }),
-          !i && /* @__PURE__ */ e(l, { children: [
-            /* @__PURE__ */ c("div", { className: "uy:flex uy:gap-100", children: o?.() }),
-            /* @__PURE__ */ e("div", { className: "uy:flex uy:gap-100", children: [
-              n?.(),
-              a()
-            ] })
-          ] })
-        ]
-      }
-    );
-  }
-);
-f.displayName = "FunnelPageActions";
-export {
-  f as FunnelPageActions,
-  d 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').TVReturnType<unknown, undefined, "uy:flex-1 uy:px-300 uy:my-400 uy:md:px-400 uy:group-has-[[data-unity-component=\"FunnelPageHeader\"]]/funnelpage:mt-0", unknown, 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').TVReturnType<unknown, undefined, "uy:flex-1 uy:px-300 uy:my-400 uy:md:px-400 uy:group-has-[[data-unity-component=\"FunnelPageHeader\"]]/funnelpage:mt-0", unknown, unknown, undefined>>> & {
-    children?: import('react').ReactNode | undefined;
-} & import('react').RefAttributes<HTMLElement>>;
-export { FunnelPageContent };

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

@@ -1,23 +0,0 @@
-import { jsx as a } from "react/jsx-runtime";
-import { forwardRef as o } from "react";
-import { uyTv as u } from "@payfit/unity-themes";
-const m = u({
-  base: 'uy:flex-1 uy:px-300 uy:my-400 uy:md:px-400 uy:group-has-[[data-unity-component="FunnelPageHeader"]]/funnelpage:mt-0'
-}), r = o(
-  ({ children: n, ...e }, t) => /* @__PURE__ */ a(
-    "section",
-    {
-      "data-dd-privacy": "mask",
-      ...e,
-      ref: t,
-      className: m(),
-      "data-unity-component": "FunnelPageContent",
-      children: n
-    }
-  )
-);
-r.displayName = "FunnelPageContent";
-export {
-  r as FunnelPageContent,
-  m 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').TVReturnType<unknown, undefined, "uy:px-300 uy:md:px-400", unknown, 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').TVReturnType<unknown, undefined, "uy:px-300 uy:md:px-400", unknown, unknown, undefined>>> & {
-    children?: import('react').ReactNode | undefined;
-} & import('react').RefAttributes<HTMLElement>>;
-export { FunnelPageFooter };