@payfit/unity-components 0.0.0-alpha.11 → 0.0.0-alpha.6

package/dist/esm/components/selectable-button-group/parts/SelectableButton.d.ts

@@ -1,127 +0,0 @@
-import { AriaToggleButtonProps } from 'react-aria';
-import { UnityIcon } from '@payfit/unity-icons';
-import { ToggleButtonProps } from 'react-aria-components';
-export declare const selectableButton: import('tailwind-variants').TVReturnType<{
-    hasIcon: {
-        true: {
-            base: string;
-        };
-        false: {
-            base: string;
-        };
-    };
-}, {
-    base: string[];
-    icon: string[];
-    label: string[];
-}, undefined, import('tailwind-variants/dist/config.js').TVConfig<{
-    hasIcon: {
-        true: {
-            base: string;
-        };
-        false: {
-            base: string;
-        };
-    };
-}, {
-    hasIcon: {
-        true: {
-            base: string;
-        };
-        false: {
-            base: string;
-        };
-    };
-}>, {
-    hasIcon: {
-        true: {
-            base: string;
-        };
-        false: {
-            base: string;
-        };
-    };
-}, {
-    base: string[];
-    icon: string[];
-    label: string[];
-}, import('tailwind-variants').TVReturnType<{
-    hasIcon: {
-        true: {
-            base: string;
-        };
-        false: {
-            base: string;
-        };
-    };
-}, {
-    base: string[];
-    icon: string[];
-    label: string[];
-}, undefined, import('tailwind-variants/dist/config.js').TVConfig<{
-    hasIcon: {
-        true: {
-            base: string;
-        };
-        false: {
-            base: string;
-        };
-    };
-}, {
-    hasIcon: {
-        true: {
-            base: string;
-        };
-        false: {
-            base: string;
-        };
-    };
-}>, unknown, unknown, undefined>>;
-type IconName<T extends string> = T extends `${infer Base}${'Filled' | 'Outlined'}` ? Base : T;
-export interface SelectableButtonProps extends Omit<AriaToggleButtonProps, 'id' | 'className' | 'style'> {
-    /**
-     * A unique identifier for the button that will be used as its selection value.
-     * This value must be unique within the SelectableButtonGroup.
-     */
-    value: NonNullable<ToggleButtonProps['id']>;
-    /**
-     * Optional icon to display before the button's text content.
-     * The icon will automatically switch between outlined and filled variants based on selection state.
-     * Specify the base name of the icon without the 'Filled' or 'Outlined' suffix.
-     */
-    prefixIcon?: IconName<UnityIcon>;
-    /**
-     * Set to true to show a loading spinner and disable interaction.
-     * Use this when the button's action requires asynchronous processing.
-     * @default false
-     */
-    isLoading?: boolean;
-}
-/**
- * A toggleable button that works as part of a SelectableButtonGroup to create single or multiple choice selections.
- * Provides visual feedback for selection state and supports icons for enhanced visual hierarchy.
- * @component
- * @param {SelectableButtonProps} props - Props for configuring the button's behavior and appearance
- * @see {@link SelectableButtonProps} for all available props
- * @example
- * ```tsx
- * import { SelectableButtonGroup, SelectableButton } from '@payfit/unity-components'
- *
- * function Example() {
- *   return (
- *     <SelectableButtonGroup selectionMode="single" defaultValue={['morning']}>
- *       <SelectableButton value="morning">
- *         Morning
- *       </SelectableButton>
- *       <SelectableButton value="afternoon" prefixIcon="Sun">
- *         Afternoon
- *       </SelectableButton>
- *     </SelectableButtonGroup>
- *   )
- * }
- * ```
- * @remarks
- * [API](mdc:components/selectable-button-group/parts/SelectableButton) • [Design docs](mdc:design/components/selectable-button-group)
- */
-declare const SelectableButton: import('react').ForwardRefExoticComponent<SelectableButtonProps & import('react').RefAttributes<HTMLButtonElement>>;
-export { SelectableButton };

package/dist/esm/components/selectable-button-group/parts/SelectableButton.js

@@ -1,99 +0,0 @@
-import { jsxs as i, jsx as o, Fragment as g } from "react/jsx-runtime";
-import { forwardRef as v, useRef as h, useContext as x } from "react";
-import { useToggleButtonGroupItem as w, mergeProps as B } from "react-aria";
-import { tv as I } from "tailwind-variants";
-import { Icon as S } from "../../icon/Icon.js";
-import { Spinner as N } from "../../spinner/Spinner.js";
-import { SelectableButtonGroupContext as G } from "../SelectableButtonGroup.context.js";
-const P = I({
-  // add the component styles
-  slots: {
-    base: [
-      "uy-group uy-border uy-border-solid uy-rounded-75 uy-py-100 uy-flex uy-gap-50 uy-items-center",
-      // default background and border
-      "uy-border-border-form-enabled uy-bg-surface-form-enabled",
-      // pseudo-states
-      "hover:uy-bg-surface-form-hover hover:uy-border-border-form-hover",
-      "active:uy-bg-surface-form-pressed active:uy-border-border-form-pressed",
-      "focus-visible:uy-bg-surface-form-focus focus-visible:uy-border-border-form-focus",
-      "focus-visible:uy-outline-2 focus-visible:uy-outline focus-visible:uy-outline-offset-2 focus-visible:uy-outline-utility-focus-ring",
-      // Pressed
-      "data-[pressed=true]:uy-bg-surface-form-pressed data-[pressed=true]:uy-border-border-form-pressed data-[pressed=true]:uy-text-content-form-pressed",
-      // selected
-      "data-[selected=true]:uy-bg-surface-form-selected data-[selected=true]:uy-border-border-form-selected data-[selected=true]:uy-text-content-form-selected",
-      // Disabled
-      "disabled:uy-bg-surface-form-disabled disabled:uy-border-border-form-disabled disabled:uy-text-content-form-disabled disabled:uy-cursor-not-allowed",
-      // Loading
-      "data-[loading=true]:uy-bg-surface-form-disabled data-[loading=true]:uy-border-border-form-disabled data-[loading=true]:uy-text-content-form-disabled data-[loading=true]:uy-cursor-wait"
-    ],
-    icon: ["uy-p-25", "data-[loading=true]:uy-hidden"],
-    label: ["uy-typography-action"]
-  },
-  variants: {
-    hasIcon: {
-      true: {
-        base: "uy-pl-100 uy-pr-200"
-      },
-      false: {
-        base: "uy-px-200"
-      }
-    }
-  },
-  defaultVariants: {
-    hasIcon: !1
-  }
-}), R = v(
-  (t, n) => {
-    const s = h(null), a = x(G);
-    if (!a)
-      throw new Error(
-        "SelectableButton must be used within a ToggleButtonGroup component"
-      );
-    const { buttonProps: d, isPressed: c, isSelected: u } = w(
-      { id: t.value, ...t },
-      a,
-      s
-    ), { ref: b } = B({ ref: s }, { ref: n }), {
-      isDisabled: f = !1,
-      isLoading: e = !1,
-      prefixIcon: r,
-      children: l
-    } = t, { base: y, icon: m, label: p } = P({
-      hasIcon: !!r && !e
-    });
-    return /* @__PURE__ */ i(
-      "button",
-      {
-        "data-dd-privacy": "allow",
-        ...d,
-        ref: b,
-        className: y(),
-        disabled: d.disabled || f || e,
-        "data-loading": e ? !0 : void 0,
-        "data-pressed": c,
-        "data-selected": u,
-        "aria-busy": e,
-        children: [
-          r && !e && /* @__PURE__ */ o(
-            S,
-            {
-              src: u ? `${r}Filled` : `${r}Outlined`,
-              role: "presentation",
-              className: m(),
-              size: 20
-            }
-          ),
-          e ? /* @__PURE__ */ i(g, { children: [
-            /* @__PURE__ */ o(N, { label: "Loading", size: "small", color: "inherit" }),
-            /* @__PURE__ */ o("span", { className: "uy-sr-only", children: l })
-          ] }) : /* @__PURE__ */ o("span", { className: p(), children: l })
-        ]
-      }
-    );
-  }
-);
-R.displayName = "SelectableButton";
-export {
-  R as SelectableButton,
-  P as selectableButton
-};

package/dist/esm/components/selectable-card/internals/Content.d.ts

@@ -1,6 +0,0 @@
-import { ReactNode } from 'react';
-export type ContentProps = {
-    children: ReactNode;
-};
-export declare const content: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, string[], import('tailwind-variants/dist/config.js').TVConfig<unknown, {} | {}>, {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, string[], import('tailwind-variants/dist/config.js').TVConfig<unknown, {} | {}>, unknown, unknown, undefined>>;
-export declare const Content: ({ children }: ContentProps) => import("react/jsx-runtime").JSX.Element;

package/dist/esm/components/selectable-card/internals/Content.js

@@ -1,9 +0,0 @@
-import { jsx as t } from "react/jsx-runtime";
-import { tv as e } from "tailwind-variants";
-const n = e({
-  base: ["uy-flex uy-flex-col", "uy-py-300 uy-pl-150 uy-pr-300"]
-}), s = ({ children: o }) => /* @__PURE__ */ t("div", { className: n(), children: o });
-export {
-  s as Content,
-  n as content
-};

package/dist/esm/components/selectable-card/internals/Description.d.ts

@@ -1,6 +0,0 @@
-import { ReactNode } from 'react';
-export type DescriptionProps = {
-    children: ReactNode;
-};
-export declare const description: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, string[], import('tailwind-variants/dist/config.js').TVConfig<unknown, {} | {}>, {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, string[], import('tailwind-variants/dist/config.js').TVConfig<unknown, {} | {}>, unknown, unknown, undefined>>;
-export declare const Description: ({ children }: DescriptionProps) => import("react/jsx-runtime").JSX.Element;

package/dist/esm/components/selectable-card/internals/Description.js

@@ -1,10 +0,0 @@
-import { jsx as t } from "react/jsx-runtime";
-import { tv as r } from "tailwind-variants";
-import { Text as i } from "../../text/Text.js";
-const m = r({
-  base: ["uy-mt-200", "uy-line-clamp-2"]
-}), a = ({ children: o }) => /* @__PURE__ */ t(i, { className: m(), variant: "body", children: o });
-export {
-  a as Description,
-  m as description
-};

package/dist/esm/components/selectable-card/internals/Illustration.d.ts

@@ -1,6 +0,0 @@
-import { ReactNode } from 'react';
-export type IllustrationProps = {
-    children: ReactNode;
-};
-export declare const illustration: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, string[], import('tailwind-variants/dist/config.js').TVConfig<unknown, {} | {}>, {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, string[], import('tailwind-variants/dist/config.js').TVConfig<unknown, {} | {}>, unknown, unknown, undefined>>;
-export declare const Illustration: ({ children }: IllustrationProps) => import("react/jsx-runtime").JSX.Element;

package/dist/esm/components/selectable-card/internals/Illustration.js

@@ -1,9 +0,0 @@
-import { jsx as o } from "react/jsx-runtime";
-import { tv as s } from "tailwind-variants";
-const r = s({
-  base: ["uy-mb-300"]
-}), a = ({ children: t }) => /* @__PURE__ */ o("div", { className: r(), children: t });
-export {
-  a as Illustration,
-  r as illustration
-};

package/dist/esm/components/selectable-card/internals/SelectedIndicator.d.ts

@@ -1,6 +0,0 @@
-import { ReactNode } from 'react';
-export type SelectedIndicatorProps = {
-    children: ReactNode;
-};
-export declare const selectedIndicator: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, string[], import('tailwind-variants/dist/config.js').TVConfig<unknown, {} | {}>, {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, string[], import('tailwind-variants/dist/config.js').TVConfig<unknown, {} | {}>, unknown, unknown, undefined>>;
-export declare const SelectedIndicator: ({ children }: SelectedIndicatorProps) => import("react/jsx-runtime").JSX.Element;

package/dist/esm/components/selectable-card/internals/SelectedIndicator.js

@@ -1,9 +0,0 @@
-import { jsx as e } from "react/jsx-runtime";
-import { tv as o } from "tailwind-variants";
-const c = o({
-  base: ["uy-py-250 uy-px-150"]
-}), a = ({ children: t }) => /* @__PURE__ */ e("div", { className: c(), children: t });
-export {
-  a as SelectedIndicator,
-  c as selectedIndicator
-};

package/dist/esm/components/selectable-card/selectable-card-checkbox-group/SelectableCardCheckboxGroup.d.ts

@@ -1,20 +0,0 @@
-import { CheckboxGroupProps as AriaCheckboxGroupProps } from 'react-aria-components';
-export type SelectableCardCheckboxGroupProps = AriaCheckboxGroupProps;
-/**
- * The `SelectableCardCheckboxGroup` component renders a group of selectable card checkboxes.
- * Use it to display a set of options where multiple selections are allowed.
- * @example
- * ```tsx
- * import { SelectableCardCheckboxGroup, SelectableCardCheckbox } from '@payfit/unity-components'
- *
- * <SelectableCardCheckboxGroup>
- *   <SelectableCardCheckbox value="option1">Option 1</SelectableCardCheckbox>
- *   <SelectableCardCheckbox value="option2">Option 2</SelectableCardCheckbox>
- *   <SelectableCardCheckbox value="option3">Option 3</SelectableCardCheckbox>
- * </SelectableCardCheckboxGroup>
- * ```
- * @see {@link SelectableCardCheckboxGroupProps} for all available props
- * @remarks [API Docs](https://unity-components.payfit.io/?path=/docs/inputs-selectablecardgroup-selectablecardcheckboxgroup--docs) • [Design Docs](https://www.payfit.design/24f360409/p/05fc26-selectable-card)
- */
-declare const SelectableCardCheckboxGroup: import('react').ForwardRefExoticComponent<AriaCheckboxGroupProps & import('react').RefAttributes<HTMLDivElement>>;
-export { SelectableCardCheckboxGroup };

package/dist/esm/components/selectable-card/selectable-card-checkbox-group/SelectableCardCheckboxGroup.js

@@ -1,16 +0,0 @@
-import { jsx as a } from "react/jsx-runtime";
-import { forwardRef as l } from "react";
-import { CheckboxGroup as m } from "react-aria-components";
-const p = l(({ children: o, ...r }, e) => /* @__PURE__ */ a(
-  m,
-  {
-    ref: e,
-    className: "uy-group uy-flex md:uy-flex-row sm:uy-flex-col uy-gap-150",
-    ...r,
-    children: o
-  }
-));
-p.displayName = "SelectableCardCheckboxGroup";
-export {
-  p as SelectableCardCheckboxGroup
-};

package/dist/esm/components/selectable-card/selectable-card-checkbox-group/parts/SelectableCardCheckbox.d.ts

@@ -1,47 +0,0 @@
-import { ReactNode } from 'react';
-import { CheckboxProps as AriaCheckboxProps } from 'react-aria-components';
-import { VariantProps } from 'tailwind-variants';
-import { selectableCard } from '../../selectableCard.variant.js';
-export interface SelectableCardCheckboxProps extends Omit<AriaCheckboxProps, 'children'>, VariantProps<typeof selectableCard> {
-    /**
-     * The title of the selectable card.
-     */
-    title: string;
-    /**
-     * Optional description text to display below the title.
-     */
-    description?: string;
-    /**
-     * Optional illustration to display in the card.
-     */
-    illustration?: ReactNode;
-}
-/**
- * The `SelectableCardCheckbox` component renders a selectable card with a checkbox.
- * It is designed to be used within a `SelectableCardCheckboxGroup` component.
- * @param {string} props.title - The title of the selectable card
- * @param {string} [props.description] - Optional description text to display below the title
- * @param {ReactNode} [props.illustration] - Optional illustration to display in the card
- * @param {string} props.value - The value of the checkbox, used for selection in the checkbox group
- * @example
- * ```tsx
- * import { SelectableCardCheckbox, SelectableCardCheckboxGroup } from '@payfit/unity-components'
- *
- * <SelectableCardCheckboxGroup>
- *   <SelectableCardCheckbox
- *     title="Option 1"
- *     description="Description for option 1"
- *     value="option1"
- *   />
- *   <SelectableCardCheckbox
- *     title="Option 2"
- *     description="Description for option 2"
- *     value="option2"
- *   />
- * </SelectableCardCheckboxGroup>
- * ```
- * @see {@link SelectableCardCheckboxProps} for all available props
- * @remarks [API Docs](https://unity-components.payfit.io/?path=/docs/inputs-selectablecardgroup-selectablecardcheckboxgroup-selectablecardcheckbox--docs) • [Design Docs](https://www.payfit.design/24f360409/p/05fc26-selectable-card)
- */
-declare const SelectableCardCheckbox: import('react').ForwardRefExoticComponent<SelectableCardCheckboxProps & import('react').RefAttributes<HTMLLabelElement>>;
-export { SelectableCardCheckbox };

package/dist/esm/components/selectable-card/selectable-card-checkbox-group/parts/SelectableCardCheckbox.js

@@ -1,40 +0,0 @@
-import { jsx as r, jsxs as t, Fragment as n } from "react/jsx-runtime";
-import { forwardRef as f } from "react";
-import { useId as h } from "react-aria";
-import { Checkbox as p } from "react-aria-components";
-import { CheckboxIndicator as s } from "../../../checkbox/parts/CheckboxIndicator.js";
-import { Text as b } from "../../../text/Text.js";
-import { Content as x } from "../../internals/Content.js";
-import { Description as C } from "../../internals/Description.js";
-import { Illustration as k } from "../../internals/Illustration.js";
-import { SelectedIndicator as u } from "../../internals/SelectedIndicator.js";
-import { selectableCard as I } from "../../selectableCard.variant.js";
-const v = f(({ title: i, description: e, illustration: m, ...c }, a) => {
-  const { base: d } = I(), l = h();
-  return /* @__PURE__ */ r(
-    p,
-    {
-      ref: a,
-      className: ({ isFocusVisible: o }) => d({ isFocusVisible: o }),
-      ...c,
-      children: (o) => /* @__PURE__ */ t(n, { children: [
-        /* @__PURE__ */ r(u, { children: /* @__PURE__ */ r(
-          s,
-          {
-            className: "group-hover:uy-border-border-form-hover",
-            ...o
-          }
-        ) }),
-        /* @__PURE__ */ t(x, { children: [
-          m && /* @__PURE__ */ r(k, { children: m }),
-          /* @__PURE__ */ r(b, { variant: "h3", id: `${l}-label`, children: i }),
-          e && /* @__PURE__ */ r(C, { children: e })
-        ] })
-      ] })
-    }
-  );
-});
-v.displayName = "SelectableCardCheckbox";
-export {
-  v as SelectableCardCheckbox
-};

package/dist/esm/components/selectable-card/selectable-card-radio-group/SelectableCardRadioGroup.d.ts

@@ -1,20 +0,0 @@
-import { RadioGroupProps } from 'react-aria-components';
-export type SelectableCardRadioGroupProps = Omit<RadioGroupProps, 'className' | 'style' | 'isDisabled' | 'isReadOnly'>;
-/**
- * The `SelectableCardRadioGroup` component renders a group of mutually exclusive selectable card options.
- * Use it to display a set of choices where only one selection is allowed.
- * @example
- * ```tsx
- * import { SelectableCardRadioGroup, SelectableCardRadio } from '@payfit/unity-components'
- *
- * <SelectableCardRadioGroup>
- *   <SelectableCardRadio value="option1">Option 1</SelectableCardRadio>
- *   <SelectableCardRadio value="option2">Option 2</SelectableCardRadio>
- *   <SelectableCardRadio value="option3">Option 3</SelectableCardRadio>
- * </SelectableCardRadioGroup>
- * ```
- * @see {@link SelectableCardRadioGroupProps} for all available props
- * @remarks [API Docs](https://unity-components.payfit.io/?path=/docs/inputs-selectablecardgroup-selectablecardradiogroup-docs) • [Design Docs](https://www.payfit.design/24f360409/p/05fc26-selectable-card)
- */
-declare const SelectableCardRadioGroup: import('react').ForwardRefExoticComponent<SelectableCardRadioGroupProps & import('react').RefAttributes<HTMLDivElement>>;
-export { SelectableCardRadioGroup };

package/dist/esm/components/selectable-card/selectable-card-radio-group/SelectableCardRadioGroup.js

@@ -1,24 +0,0 @@
-import { jsx as s } from "react/jsx-runtime";
-import { forwardRef as m } from "react";
-import { RadioGroup as p } from "react-aria-components";
-import { useBreakpointListener as n } from "../../../hooks/use-breakpoint-listener.js";
-const u = m(({ children: r, value: e, onChange: i, onBlur: t, ...a }, l) => {
-  const o = n();
-  return /* @__PURE__ */ s(
-    p,
-    {
-      ...a,
-      orientation: o === "xs" || o === "sm" ? "vertical" : "horizontal",
-      value: e,
-      onBlur: t,
-      onChange: i,
-      className: "uy-flex md:uy-flex-row sm:uy-flex-col uy-gap-150",
-      ref: l,
-      children: r
-    }
-  );
-});
-u.displayName = "SelectableCardRadioGroup";
-export {
-  u as SelectableCardRadioGroup
-};

package/dist/esm/components/selectable-card/selectable-card-radio-group/parts/RadioIndicator.d.ts

@@ -1,8 +0,0 @@
-interface RadioIndocatorProps {
-    isSelected: boolean;
-}
-declare const RadioIndicator: {
-    ({ isSelected }: RadioIndocatorProps): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
-export default RadioIndicator;

package/dist/esm/components/selectable-card/selectable-card-radio-group/parts/RadioIndicator.js

@@ -1,67 +0,0 @@
-import { jsx as o, jsxs as i } from "react/jsx-runtime";
-import { tv as t } from "tailwind-variants";
-const e = t({
-  base: "",
-  variants: {
-    isSelected: {
-      false: [
-        "uy-stroke-border-form-enabled",
-        "hover:uy-stroke-border-form-hover",
-        "focus-visible:uy-stroke-border-form-focus"
-      ]
-    }
-  }
-}), d = ({ isSelected: r }) => r ? /* @__PURE__ */ o(
-  "svg",
-  {
-    width: "20",
-    height: "20",
-    viewBox: "0 0 20 20",
-    fill: "none",
-    xmlns: "http://www.w3.org/2000/svg",
-    children: /* @__PURE__ */ i("g", { id: "Radio input", children: [
-      /* @__PURE__ */ o(
-        "path",
-        {
-          id: "Background",
-          d: "M2.625 10C2.625 5.9269 5.9269 2.625 10 2.625C14.0731 2.625 17.375 5.9269 17.375 10C17.375 14.0731 14.0731 17.375 10 17.375C5.9269 17.375 2.625 14.0731 2.625 10Z",
-          fill: "white",
-          stroke: "#0157B2",
-          strokeWidth: "1.25"
-        }
-      ),
-      /* @__PURE__ */ o(
-        "path",
-        {
-          id: "Foreground",
-          d: "M5 10C5 7.23858 7.23858 5 10 5C12.7614 5 15 7.23858 15 10C15 12.7614 12.7614 15 10 15C7.23858 15 5 12.7614 5 10Z",
-          fill: "#0157B2"
-        }
-      )
-    ] })
-  }
-) : /* @__PURE__ */ o(
-  "svg",
-  {
-    width: "20",
-    height: "20",
-    viewBox: "0 0 20 20",
-    fill: "none",
-    xmlns: "http://www.w3.org/2000/svg",
-    children: /* @__PURE__ */ o("g", { id: "Radio input", children: /* @__PURE__ */ o(
-      "path",
-      {
-        className: e({ isSelected: r }),
-        id: "Background",
-        d: "M2.625 10C2.625 5.9269 5.9269 2.625 10 2.625C14.0731 2.625 17.375 5.9269 17.375 10C17.375 14.0731 14.0731 17.375 10 17.375C5.9269 17.375 2.625 14.0731 2.625 10Z",
-        fill: "white",
-        stroke: "currentColor",
-        strokeWidth: "1.25"
-      }
-    ) })
-  }
-);
-d.displayName = "RadioIndicator";
-export {
-  d as default
-};

package/dist/esm/components/selectable-card/selectable-card-radio-group/parts/SelectableCardRadio.d.ts

@@ -1,50 +0,0 @@
-import { PropsWithChildren, ReactNode } from 'react';
-import { RadioProps } from 'react-aria-components';
-import { VariantProps } from 'tailwind-variants';
-import { selectableCard } from '../../selectableCard.variant.js';
-export interface SelectableCardRadioProps extends Omit<RadioProps, 'children'>, PropsWithChildren<VariantProps<typeof selectableCard>> {
-    /**
-     * The title of the selectable card.
-     */
-    title: string;
-    /**
-     * Optional description text to display below the title.
-     */
-    description?: string;
-    /**
-     * Optional illustration to display in the card.
-     */
-    illustration?: ReactNode;
-}
-/**
- * The `SelectableCardRadio` component renders a selectable card with a radio button.
- * It is designed to be used within a `SelectableCardRadioGroup` component.
- * @param props.title - The title of the selectable card
- * @param [props.description] - Optional description text to display below the title
- * @param [props.illustration] - Optional illustration to display in the card
- * @param props.value - The value of the radio button, used for selection in the radio group
- * @example
- * ```tsx
- * import { SelectableCardRadio, SelectableCardRadioGroup } from '@payfit/unity-components'
- *
- * <SelectableCardRadioGroup>
- *   <SelectableCardRadio
- *     title="Option 1"
- *     description="Description for option 1"
- *     value="option1"
- *   />
- *   <SelectableCardRadio
- *     title="Option 2"
- *     description="Description for option 2"
- *     value="option2"
- *   />
- * </SelectableCardRadioGroup>
- * ```
- * @see {@link SelectableCardRadioProps} for all available props
- * @remarks [API Docs](https://unity-components.payfit.io/?path=/docs/inputs-selectablecardgroup-selectablecardradiogroup-selectablecardradio--docs) • [Design Docs](https://www.payfit.design/24f360409/p/05fc26-selectable-card)
- */
-declare const SelectableCardRadio: {
-    ({ title, description, illustration, ...props }: SelectableCardRadioProps): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
-export { SelectableCardRadio };

package/dist/esm/components/selectable-card/selectable-card-radio-group/parts/SelectableCardRadio.js

@@ -1,36 +0,0 @@
-import { jsx as r, jsxs as i, Fragment as c } from "react/jsx-runtime";
-import { Radio as l } from "react-aria-components";
-import { Text as n } from "../../../text/Text.js";
-import { Content as p } from "../../internals/Content.js";
-import { Description as s } from "../../internals/Description.js";
-import { Illustration as f } from "../../internals/Illustration.js";
-import { SelectedIndicator as h } from "../../internals/SelectedIndicator.js";
-import { selectableCard as b } from "../../selectableCard.variant.js";
-import x from "./RadioIndicator.js";
-const C = ({
-  title: m,
-  description: e,
-  illustration: t,
-  ...a
-}) => {
-  const { base: d } = b();
-  return /* @__PURE__ */ r(
-    l,
-    {
-      className: ({ isFocusVisible: o }) => d({ isFocusVisible: o }),
-      ...a,
-      children: ({ isSelected: o }) => /* @__PURE__ */ i(c, { children: [
-        /* @__PURE__ */ r(h, { children: /* @__PURE__ */ r(x, { isSelected: o }) }),
-        /* @__PURE__ */ i(p, { children: [
-          t && /* @__PURE__ */ r(f, { children: t }),
-          /* @__PURE__ */ r(n, { variant: "h3", children: m }),
-          e && /* @__PURE__ */ r(s, { children: e })
-        ] })
-      ] })
-    }
-  );
-};
-C.displayName = "SelectableCardRadio";
-export {
-  C as SelectableCardRadio
-};