@payfit/unity-components 2.46.12 → 2.46.13

package/dist/esm/components/promo-dialog/PromoDialog.js

@@ -1,220 +0,0 @@
-import { jsx as t, jsxs as c } from "react/jsx-runtime";
-import { useRef as P, Children as m, isValidElement as l, useLayoutEffect as b } from "react";
-import { uyTv as N } from "@payfit/unity-themes";
-import { DialogContext as C, Dialog as A } from "react-aria-components/Dialog";
-import { ModalOverlay as E, Modal as I } from "react-aria-components/Modal";
-import { useId as j } from "react-aria/useId";
-import { useIntl as z } from "react-intl";
-import { useHasScroll as M } from "../../hooks/use-has-scroll.js";
-import { DialogButton as H } from "../dialog/parts/DialogActions/DialogButton.js";
-import { CircularIconButton as T } from "../icon-button/CircularIconButton.js";
-import { PromoDialogActions as v } from "./parts/PromoDialogActions.js";
-import { PromoDialogHero as W } from "./parts/PromoDialogHero.js";
-import { PromoDialogTitle as _ } from "./parts/PromoDialogTitle.js";
-const k = N({
-  slots: {
-    overlay: [
-      "uy:@container",
-      "uy:fixed uy:inset-0 uy:z-30 uy:overflow-y-auto",
-      "uy:min-h-full",
-      "uy:flex uy:items-end uy:md:items-center uy:md:justify-center uy:md:text-center",
-      "uy:bg-utility-backdrop",
-      // enter/leave animation
-      "uy:data-[entering]:animate-fade-in uy:data-[exiting]:animate-fade-out",
-      "uy:motion-reduce:data-[entering]:animate-none uy:motion-reduce:data-[exiting]:animate-none"
-    ],
-    wrapper: [
-      "uy:w-full uy:relative uy:isolate",
-      "uy:m-0",
-      "uy:rounded-t-300 uy:md:rounded-300",
-      "uy:bg-surface-neutral",
-      "uy:text-left uy:align-middle uy:shadow-400",
-      // Mobile: enter/leave animation
-      "uy:data-[entering]:animate-slide-up-fade-in uy:data-[exiting]:animate-slide-down-fade-out",
-      "uy:md:[animation-delay:100ms]",
-      // Desktop: enter/leave animation
-      "uy:md:data-[entering]:animate-zoom-in uy:md:data-[exiting]:animate-zoom-out",
-      "uy:motion-reduce:data-[entering]:animate-none uy:motion-reduce:data-[exiting]:animate-none",
-      // Mobile: scrollable with max height
-      "uy:max-h-[95dvh] uy:overflow-y-auto",
-      // Desktop: max height (adapts to content), no overflow on wrapper
-      "uy:md:h-[82dvh] uy:md:max-h-65 uy:lg:max-h-85 uy:md:overflow-hidden",
-      "uy:md:w-10/12 uy:md:max-w-[1000px] uy:p-300 uy:pb-0 uy:md:p-200"
-    ],
-    content: [
-      "uy:group/promo-dialog uy:outline-none uy:relative",
-      // Mobile: auto height (wrapper scrolls)
-      "uy:h-auto",
-      // Desktop: full height (content scrolls internally)
-      "uy:md:h-full"
-    ],
-    dismissIcon: [
-      // Mobile: sticky button that takes some padding at the top
-      "uy:sticky uy:top-0 uy:right-0 uy:flex uy:justify-end",
-      // Desktop: close button is positioned absolutely at the top-right corner
-      "uy:md:absolute uy:md:right-100 uy:md:top-100 uy:md:z-20"
-    ],
-    // Layout slots
-    layoutWrapper: [
-      "uy:flex uy:flex-col uy:md:flex-row",
-      // Mobile: auto height (wrapper scrolls)
-      "uy:h-auto",
-      // Desktop: full height for flex layout
-      "uy:md:h-full uy:gap-300 uy:md:gap-0"
-    ],
-    contentColumn: [
-      "uy:group/content-column",
-      "uy:flex uy:flex-col",
-      // Mobile: auto height
-      "uy:h-auto",
-      // Desktop: takes 2/3 of width, fixed max height, enables scrolling
-      "uy:md:basis-2/3 uy:md:h-full uy:md:max-h-85 uy:md:overflow-y-auto uy:md:pt-600 uy:md:[scrollbar-gutter:stable]"
-    ],
-    scrollableContent: [
-      "uy:md:pl-[clamp(var(--uy-spacing-400),11%,var(--uy-spacing-800))] uy:md:pr-1000 uy:[scrollbar-width:thin] uy:md:scroll-mt-1000",
-      // Mobile: flex-1 to fill space (wrapper scrolls)
-      "uy:flex-1",
-      // desktop: centered layout
-      "uy:md:flex uy:md:flex-col uy:md:justify-center"
-    ],
-    actionsWrapper: [
-      "uy:py-300 uy:md:py-0 uy:sticky uy:-bottom-px uy:bg-surface-neutral",
-      // Apply shadow when parent group has scroll
-      "uy:group-data-[has-scroll=true]/content-column:shadow-[0_-1px_6px_0_var(--uy-color-utility-shadow-floating)]"
-    ]
-  }
-}), B = (r) => {
-  const n = m.toArray(r).find(
-    (e) => l(e) && e.type === v
-  );
-  return l(
-    n
-  ) ? m.toArray(n.props.children).some(
-    (e) => l(
-      e
-    ) && e.type === H && e.props.variant === "danger"
-  ) : !1;
-};
-function q({
-  children: r,
-  isOpen: n,
-  onOpenChange: e,
-  isDismissable: p = !0,
-  ...y
-}) {
-  const f = z(), d = j(), g = P(null), { hasAnyScroll: i } = M(g, {
-    strategy: "both",
-    watchMutations: !0
-  }), s = m.toArray(r), u = s.find(
-    (o) => l(o) && o.type === W
-  ), h = s.find(
-    (o) => l(o) && o.type === v
-  ), w = s.filter(
-    (o) => o !== u && o !== h
-  );
-  b(() => {
-    u || console.error(
-      "PromoDialog: PromoDialogHero is required. Please add <PromoDialogHero> as a child of your PromoDialog component."
-    );
-  }, [u]), b(() => {
-    const D = m.toArray(r).some(
-      (x) => l(x) && x.type === _
-    );
-    !y["aria-label"] && !D && console.error(
-      "PromoDialog: Either an aria-label or a PromoDialogTitle is required for accessibility. Provide one to ensure screen reader users can identify the dialog."
-    );
-  }, [r, y]);
-  const a = k();
-  return /* @__PURE__ */ t(
-    E,
-    {
-      isDismissable: p,
-      isOpen: n,
-      onOpenChange: e,
-      className: a.overlay(),
-      children: /* @__PURE__ */ t(
-        I,
-        {
-          className: a.wrapper(),
-          "data-unity-promo-dialog": !0,
-          "data-dd-privacy": "allow",
-          children: /* @__PURE__ */ t(C.Provider, { value: { "aria-describedby": d }, children: /* @__PURE__ */ c(
-            A,
-            {
-              role: B(r) ? "alertdialog" : "dialog",
-              "aria-modal": "true",
-              className: a.content(),
-              "aria-label": y["aria-label"],
-              "aria-describedby": d,
-              "data-unity-slot": "promo-dialog",
-              children: [
-                p && /* @__PURE__ */ t("div", { className: a.dismissIcon(), children: /* @__PURE__ */ t(
-                  T,
-                  {
-                    asElement: "button",
-                    icon: "CloseOutlined",
-                    color: "content.neutral.low",
-                    size: "large",
-                    title: f.formatMessage({
-                      id: "unity:component:common:close:label"
-                    }),
-                    slot: "close",
-                    className: "uy:relative uy:-top-100 uy:-right-100 uy:md:static"
-                  }
-                ) }),
-                /* @__PURE__ */ c(
-                  "div",
-                  {
-                    className: a.layoutWrapper(),
-                    "data-slot": "promo-dialog.layout-wrapper",
-                    children: [
-                      u,
-                      /* @__PURE__ */ c(
-                        "div",
-                        {
-                          ref: g,
-                          className: a.contentColumn(),
-                          "data-slot": "promo-dialog.content-column",
-                          "data-has-scroll": i,
-                          role: i ? "region" : void 0,
-                          "aria-label": i ? f.formatMessage({
-                            id: "unity:component:common:scrollable-content:label"
-                          }) : void 0,
-                          tabIndex: i ? 0 : void 0,
-                          children: [
-                            /* @__PURE__ */ t(
-                              "div",
-                              {
-                                id: d,
-                                className: a.scrollableContent(),
-                                "data-slot": "promo-dialog.scrollable-content",
-                                children: w
-                              }
-                            ),
-                            /* @__PURE__ */ t(
-                              "div",
-                              {
-                                className: a.actionsWrapper(),
-                                "data-slot": "promo-dialog.actions-wrapper",
-                                children: h
-                              }
-                            )
-                          ]
-                        }
-                      )
-                    ]
-                  }
-                )
-              ]
-            }
-          ) })
-        }
-      )
-    }
-  );
-}
-q.displayName = "PromoDialog";
-export {
-  q as PromoDialog,
-  k as promoDialog
-};

package/dist/esm/components/promo-dialog/parts/PromoDialogActions.d.ts

@@ -1,44 +0,0 @@
-import { PropsWithChildren } from 'react';
-/**
- * PromoDialogActions contains the action buttons for a promo dialog.
- * It provides consistent layout and spacing for dialog action buttons.
- *
- * This component should be used within a `PromoDialog` to display action buttons like
- * confirm, cancel, or close actions. The buttons are automatically arranged in a row
- * on desktop and stacked on mobile.
- * @param props - The props for the PromoDialogActions component
- * @param props.children - The action buttons (typically DialogButton components)
- * @example
- * ```tsx
- * import { PromoDialog, PromoDialogHero, DialogTitle, PromoDialogContent, PromoDialogActions, DialogButton } from '@payfit/unity-components'
- * import { Illustration } from '@payfit/unity-illustrations'
- * import ContractSignature from '@payfit/unity-illustrations/assets/ContractSignature'
- *
- * function PromoExample() {
- *   return (
- *     <PromoDialog>
- *       <PromoDialogHero>
- *         <Illustration src={ContractSignature} variant="picture" />
- *       </PromoDialogHero>
- *       <DialogTitle>Welcome</DialogTitle>
- *       <PromoDialogContent>
- *         <p>Content here...</p>
- *       </PromoDialogContent>
- *       <PromoDialogActions>
- *         <DialogButton variant="close">Skip</DialogButton>
- *         <DialogButton variant="confirm">Continue</DialogButton>
- *       </PromoDialogActions>
- *     </PromoDialog>
- *   )
- * }
- * ```
- * @remarks
- * - Buttons are stacked vertically on mobile (reverse order) and horizontal on desktop
- * - Use DialogButton components as children for consistent styling
- * - **Accessibility**: Actions are grouped with role="group" for better screen reader navigation
- */
-declare const PromoDialogActions: {
-    ({ children }: PropsWithChildren<object>): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
-export { PromoDialogActions };

package/dist/esm/components/promo-dialog/parts/PromoDialogActions.js

@@ -1,29 +0,0 @@
-import { jsx as a } from "react/jsx-runtime";
-import { uyTv as i } from "@payfit/unity-themes";
-import { useIntl as r } from "react-intl";
-const s = i({
-  base: [
-    "uy:md:pt-250 uy:md:pb-100 uy:md:px-200 uy:flex uy:flex-col-reverse uy:md:flex-row uy:md:justify-end uy:md:items-start",
-    "uy:gap-150 uy:md:gap-100",
-    "uy:self-stretch"
-  ]
-}), e = ({ children: o }) => {
-  const t = r();
-  return /* @__PURE__ */ a(
-    "div",
-    {
-      role: "group",
-      "aria-label": t.formatMessage({
-        id: "unity:component:dialog:actions:label"
-      }),
-      className: s(),
-      "data-unity-slot": "promo-dialog.actions",
-      "data-dd-privacy": "allow",
-      children: o
-    }
-  );
-};
-e.displayName = "PromoDialogActions";
-export {
-  e as PromoDialogActions
-};

package/dist/esm/components/promo-dialog/parts/PromoDialogContent.d.ts

@@ -1,43 +0,0 @@
-import { PropsWithChildren } from 'react';
-/**
- * PromoDialogContent contains the main content of a promo dialog.
- * It provides consistent spacing and typography for dialog content.
- *
- * This component should be used within a `PromoDialog` to display the main message,
- * description, or any other content that needs to be presented to the user.
- * @param props - The props for the PromoDialogContent component
- * @param props.children - The content to be displayed in the dialog body
- * @example
- * ```tsx
- * import { PromoDialog, PromoDialogHero, DialogTitle, PromoDialogContent, PromoDialogActions, DialogButton } from '@payfit/unity-components'
- * import { Illustration } from '@payfit/unity-illustrations'
- * import ContractSignature from '@payfit/unity-illustrations/assets/ContractSignature'
- *
- * function PromoExample() {
- *   return (
- *     <PromoDialog>
- *       <PromoDialogHero>
- *         <Illustration src={ContractSignature} variant="picture" />
- *       </PromoDialogHero>
- *       <DialogTitle>Welcome</DialogTitle>
- *       <PromoDialogContent>
- *         <p>This is the main content of the promo dialog.</p>
- *       </PromoDialogContent>
- *       <PromoDialogActions>
- *         <DialogButton variant="close">Skip</DialogButton>
- *         <DialogButton variant="confirm">Continue</DialogButton>
- *       </PromoDialogActions>
- *     </PromoDialog>
- *   )
- * }
- * ```
- * @remarks
- * - Use this component for the main body text and content
- * - Content will automatically scroll when it overflows
- * - Maintains consistent spacing with other promo dialog parts
- */
-declare const PromoDialogContent: {
-    ({ children }: PropsWithChildren<object>): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
-export { PromoDialogContent };

package/dist/esm/components/promo-dialog/parts/PromoDialogContent.js

@@ -1,20 +0,0 @@
-import { jsx as t } from "react/jsx-runtime";
-import { uyTv as n } from "@payfit/unity-themes";
-const a = n({
-  base: [
-    "uy:flex uy:flex-col uy:gap-200",
-    "uy:text-content-neutral",
-    "uy:typography-body"
-  ]
-}), e = ({ children: o }) => /* @__PURE__ */ t(
-  "div",
-  {
-    className: a(),
-    "data-unity-slot": "promo-dialog.content",
-    children: o
-  }
-);
-e.displayName = "PromoDialogContent";
-export {
-  e as PromoDialogContent
-};

package/dist/esm/components/promo-dialog/parts/PromoDialogHero.d.ts

@@ -1,47 +0,0 @@
-import { PropsWithChildren } from 'react';
-export interface PromoDialogHeroProps extends PropsWithChildren {
-    /**
-     * Additional class names for the hero
-     */
-    className?: string;
-}
-/**
- * PromoDialogHero displays a promotional illustration or hero image in promo dialogs.
- * It's designed to complement important announcements, feature introductions, or promotional content.
- *
- * This component is required when using `PromoDialog` and automatically triggers
- * a special layout with the hero section on the left (desktop) or top (mobile), and content on the right/bottom.
- * @param props - The props for the PromoDialogHero component
- * @param props.children - The hero content, typically an Illustration component
- * @example
- * ```tsx
- * import { PromoDialog, PromoDialogHero, DialogTitle, DialogContent } from '@payfit/unity-components'
- * import { Illustration } from '@payfit/unity-illustrations'
- * import ContractSignature from '@payfit/unity-illustrations/assets/ContractSignature'
- *
- * function PromoExample() {
- *   return (
- *     <PromoDialog>
- *       <PromoDialogHero>
- *         <Illustration src={ContractSignature} variant="picture" />
- *       </PromoDialogHero>
- *       <DialogTitle>Welcome to our new feature</DialogTitle>
- *       <DialogContent>
- *         Discover how this feature can help you...
- *       </DialogContent>
- *     </PromoDialog>
- *   )
- * }
- * ```
- * @remarks
- * - This component is specifically designed for promo dialogs and triggers a special horizontal split layout on desktop
- * - On mobile devices, the layout automatically adjusts to a vertical stack
- * - The hero section has a light blue background by default
- * - Use with illustrations from `@payfit/unity-illustrations` for consistent branding
- * - **Accessibility**: Hero content is marked as decorative (aria-hidden) as it's purely visual
- */
-declare const PromoDialogHero: {
-    ({ children, className }: PromoDialogHeroProps): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
-export { PromoDialogHero };

package/dist/esm/components/promo-dialog/parts/PromoDialogHero.js

@@ -1,25 +0,0 @@
-import { jsx as a } from "react/jsx-runtime";
-import { uyTv as e } from "@payfit/unity-themes";
-const t = e({
-  base: [
-    "uy:rounded-150 uy:bg-surface-neutral-lowest",
-    "uy:flex uy:items-center uy:justify-center",
-    // Mobile: auto height for vertical stack
-    "uy:h-auto",
-    // Desktop: takes 1/3 of width, stretches to row height
-    "uy:md:basis-[40%] uy:lg:basis-[37.2%] uy:md:shrink-0"
-  ]
-}), u = ({ children: o, className: r }) => /* @__PURE__ */ a(
-  "div",
-  {
-    className: t({ className: r }),
-    "data-unity-slot": "promo-dialog.hero",
-    "data-dd-privacy": "allow",
-    "aria-hidden": "true",
-    children: o
-  }
-);
-u.displayName = "PromoDialogHero";
-export {
-  u as PromoDialogHero
-};

package/dist/esm/components/promo-dialog/parts/PromoDialogSubtitle.d.ts

@@ -1,53 +0,0 @@
-import { TextProps } from '../../text/Text.js';
-export type PromoDialogSubtitleProps = Omit<TextProps, 'variant' | 'color'>;
-/**
- * PromoDialogSubtitle displays a subtitle text above the title in a promo dialog.
- * It provides consistent styling with body variant and neutral lowest color.
- *
- * This component should be used within a `PromoDialog` to display additional context
- * or information above the main title, such as step indicators or feature labels.
- * @param props - The props for the PromoDialogSubtitle component
- * @param props.children - The subtitle text to be displayed
- * @example
- * ```tsx
- * import {
- *   PromoDialog,
- *   PromoDialogHero,
- *   PromoDialogSubtitle,
- *   PromoDialogTitle,
- *   PromoDialogContent,
- *   PromoDialogActions,
- *   DialogButton,
- * } from '@payfit/unity-components'
- * import { Illustration } from '@payfit/unity-illustrations'
- * import ContractSignature from '@payfit/unity-illustrations/assets/ContractSignature'
- *
- * function PromoExample() {
- *   return (
- *     <PromoDialog>
- *       <PromoDialogHero>
- *         <Illustration src={ContractSignature} variant="picture" />
- *       </PromoDialogHero>
- *       <PromoDialogSubtitle>Step 1/3</PromoDialogSubtitle>
- *       <PromoDialogTitle>Welcome</PromoDialogTitle>
- *       <PromoDialogContent>
- *         <p>This is the main content of the promo dialog.</p>
- *       </PromoDialogContent>
- *       <PromoDialogActions>
- *         <DialogButton variant="close">Skip</DialogButton>
- *         <DialogButton variant="confirm">Continue</DialogButton>
- *       </PromoDialogActions>
- *     </PromoDialog>
- *   )
- * }
- * ```
- * @remarks
- * - Use this component for displaying contextual information above the title
- * - Styled with body variant and content.neutral.lowest color
- * - Automatically positioned above PromoDialogTitle when used together
- */
-declare const PromoDialogSubtitle: {
-    ({ children, ...rest }: PromoDialogSubtitleProps): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
-export { PromoDialogSubtitle };

package/dist/esm/components/promo-dialog/parts/PromoDialogSubtitle.js

@@ -1,21 +0,0 @@
-import { jsx as a } from "react/jsx-runtime";
-import { Text as l } from "../../text/Text.js";
-const r = ({
-  children: o,
-  ...t
-}) => /* @__PURE__ */ a(
-  l,
-  {
-    ...t,
-    variant: "body",
-    asElement: "h4",
-    color: "content.neutral.lowest",
-    "data-unity-slot": "promo-dialog.subtitle",
-    className: "uy:typography-body-small uy:md:typography-body uy:mb-100",
-    children: o
-  }
-);
-r.displayName = "PromoDialogSubtitle";
-export {
-  r as PromoDialogSubtitle
-};

package/dist/esm/components/promo-dialog/parts/PromoDialogTitle.d.ts

@@ -1,6 +0,0 @@
-import { PropsWithChildren } from 'react';
-declare const PromoDialogTitle: {
-    ({ children }: PropsWithChildren<object>): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
-export { PromoDialogTitle };

package/dist/esm/components/promo-dialog/parts/PromoDialogTitle.js

@@ -1,18 +0,0 @@
-import { jsx as t } from "react/jsx-runtime";
-import { uyTv as a } from "@payfit/unity-themes";
-import { Heading as m } from "react-aria-components/Heading";
-const r = a({
-  base: ["uy:typography-h2 uy:md:typography-h1", "uy:mb-150 uy:md:mb-250"]
-}), i = ({ children: o }) => /* @__PURE__ */ t(
-  m,
-  {
-    slot: "title",
-    className: r(),
-    "data-dd-privacy": "allow",
-    children: o
-  }
-);
-i.displayName = "PromoDialogTitle";
-export {
-  i as PromoDialogTitle
-};

package/dist/esm/components/radio-button-group/RadioButtonGroup.d.ts

@@ -1,22 +0,0 @@
-import { RadioGroupProps } from 'react-aria-components/RadioGroup';
-/**
- * Props for the RadioButtonGroup component.
- * Excludes className and style props as they are handled internally.
- */
-export type RadioButtonGroupProps = Omit<RadioGroupProps, 'className' | 'style'>;
-/**
- * The `RadioButtonGroup` component enables users to select a single option from a set of mutually exclusive choices.
- * It manages the selection state, keyboard navigation, focus handling, and accessibility features for a group of RadioButton components.
- * @example
- * ```tsx
- * import { RadioButton, RadioButtonGroup } from '@payfit/unity-components'
- *
- * <RadioButtonGroup value="option1" onChange={setValue}>
- *   <RadioButton value="option1">Option 1</RadioButton>
- *   <RadioButton value="option2">Option 2</RadioButton>
- *   <RadioButton value="option3">Option 3</RadioButton>
- * </RadioButtonGroup>
- * ```
- */
-declare const RadioButtonGroup: import('react').ForwardRefExoticComponent<RadioButtonGroupProps & import('react').RefAttributes<HTMLDivElement>>;
-export { RadioButtonGroup };

package/dist/esm/components/radio-button-group/RadioButtonGroup.js

@@ -1,23 +0,0 @@
-import { jsx as f } from "react/jsx-runtime";
-import { forwardRef as i } from "react";
-import { RadioGroup as d } from "react-aria-components/RadioGroup";
-const l = i(
-  ({ children: o, isReadOnly: r, isDisabled: t, value: a, onChange: p, onBlur: u, ...m }, e) => /* @__PURE__ */ f(
-    d,
-    {
-      ...m,
-      isReadOnly: r,
-      isDisabled: t,
-      value: a,
-      onBlur: u,
-      onChange: p,
-      className: "uy:flex uy:flex-col uy:gap-150",
-      ref: e,
-      children: o
-    }
-  )
-);
-l.displayName = "RadioButtonGroup";
-export {
-  l as RadioButtonGroup
-};

package/dist/esm/components/radio-button-group/TanstackRadioButtonGroup.d.ts

@@ -1,13 +0,0 @@
-import { RadioButtonGroupProps } from './RadioButtonGroup.js';
-/**
- * Props for `TanstackRadioButtonGroup`.
- *
- * Inherits all visual/interaction props from the base `RadioButtonGroup`, but removes
- * form‑control props that are provided by the TanStack Form field context instead.
- *
- * Omitted props:
- * - `name`, `value`, `defaultValue`, `isInvalid` — these are driven by the form context.
- */
-export type TanstackRadioButtonGroupProps = Omit<RadioButtonGroupProps, 'value' | 'defaultValue' | 'isInvalid' | 'name'>;
-declare const TanstackRadioButtonGroup: import('react').ForwardRefExoticComponent<TanstackRadioButtonGroupProps & import('react').RefAttributes<HTMLDivElement>>;
-export { TanstackRadioButtonGroup };

package/dist/esm/components/radio-button-group/TanstackRadioButtonGroup.js

@@ -1,43 +0,0 @@
-import { jsx as m } from "react/jsx-runtime";
-import { forwardRef as p } from "react";
-import { useFieldContext as f } from "../../hooks/tanstack-form-context.js";
-import { useFieldA11yContext as B } from "../form-field/TanstackFormField.context.js";
-import { RadioButtonGroup as b } from "./RadioButtonGroup.js";
-function h({
-  onChange: d,
-  onBlur: n,
-  isDisabled: r,
-  isReadOnly: l,
-  children: s,
-  ...u
-}, c) {
-  const a = f(), t = B(), e = a.state.meta.isTouched && !a.state.meta.isValid, i = [t.helperTextId, t.feedbackTextId].filter(Boolean).join(" ");
-  return /* @__PURE__ */ m(
-    b,
-    {
-      ...u,
-      ref: c,
-      id: t.inputId,
-      value: a.state.value,
-      onChange: (o) => {
-        a.handleChange(o), d?.(o);
-      },
-      onBlur: (o) => {
-        a.handleBlur(), n?.(o);
-      },
-      isDisabled: r,
-      isReadOnly: l,
-      "aria-labelledby": t.labelId,
-      "aria-describedby": i.length > 0 ? i : void 0,
-      "aria-details": t.contextualLinkId,
-      "aria-invalid": e || void 0,
-      "data-invalid": e || void 0,
-      children: s
-    }
-  );
-}
-const v = p(h);
-v.displayName = "TanstackRadioButtonGroup";
-export {
-  v as TanstackRadioButtonGroup
-};