@payfit/unity-components 2.46.12 → 2.46.13

package/dist/esm/components/checkbox/parts/CheckboxIndicator.js

@@ -1,163 +0,0 @@
-import { jsx as e } from "react/jsx-runtime";
-import { uyTv as u } from "@payfit/unity-themes";
-const b = u({
-  slots: {
-    base: [
-      "uy:flex uy:items-center uy:justify-center uy:rounded-50 uy:m-25 uy:w-200 uy:h-200 uy:text-content-inverted uy:border uy:border-solid uy:transition-all uy:duration-100"
-    ],
-    checkmark: [
-      "uy:w-[16px] uy:fill-none uy:stroke-[2px] uy:stroke-content-inverted uy:transition-all uy:duration-500"
-    ]
-  },
-  variants: {
-    isSelected: {
-      true: ""
-    },
-    isDisabled: {
-      true: ""
-    },
-    isReadOnly: {
-      true: ""
-    },
-    isInvalid: {
-      true: ""
-    }
-  },
-  defaultVariants: {
-    isSelected: !1,
-    isDisabled: !1,
-    isInvalid: !1,
-    isReadOnly: !1
-  },
-  compoundVariants: [
-    {
-      isSelected: !1,
-      isDisabled: !1,
-      isInvalid: !1,
-      isReadOnly: !1,
-      className: {
-        base: "uy:border-border-form-enabled uy:hover:border-border-form-hover uy:group-data-[hovered=true]:border-border-form-hover uy:group-hover:border-border-form-hover uy:focus-visible:border-border-form-focus uy:group-data-[focus-visible=true]:border-border-form-focus uy:bg-surface-form-enabled"
-      }
-    },
-    {
-      isSelected: !0,
-      isDisabled: !1,
-      isInvalid: !1,
-      isReadOnly: !1,
-      className: {
-        base: [
-          "uy:bg-surface-form-active",
-          "uy:theme-legacy:border-border-form-selected uy:theme-legacy:hover:border-border-form-active",
-          "uy:theme-rebrand:border-transparent uy:theme-rebrand:hover:border-transparent"
-        ]
-      }
-    },
-    {
-      isSelected: !1,
-      isDisabled: !0,
-      className: {
-        base: "uy:bg-surface-form-disabled! uy:border-border-form-disabled",
-        checkmark: "uy:text-transparent"
-      }
-    },
-    {
-      isSelected: !0,
-      isDisabled: !0,
-      className: {
-        base: "uy:bg-surface-form-disabled! uy:border-border-form-disabled!",
-        checkmark: "uy:text-border-form-disabled"
-      }
-    },
-    {
-      isSelected: !1,
-      isInvalid: !0,
-      className: {
-        base: "uy:border-border-form-error uy:bg-surface-form-enabled",
-        checkmark: "uy:text-transparent"
-      }
-    },
-    {
-      isSelected: !0,
-      isDisabled: !1,
-      isInvalid: !0,
-      isReadOnly: !1,
-      className: {
-        base: [
-          "uy:bg-surface-danger!",
-          "uy:theme-legacy:border-border-form-error!",
-          "uy:theme-rebrand:border-transparent!"
-        ],
-        checkmark: "uy:text-content-inverted"
-      }
-    },
-    {
-      isSelected: !1,
-      isReadOnly: !0,
-      className: {
-        base: "uy:border-border-form-disabled uy:bg-surface-form-disabled",
-        checkmark: "uy:text-transparent"
-      }
-    },
-    {
-      isSelected: !0,
-      isReadOnly: !0,
-      className: {
-        base: "uy:bg-surface-form-disabled! uy:border-border-form-disabled!",
-        checkmark: "uy:text-surface-form-read-only!"
-      }
-    }
-  ]
-});
-function c({
-  isSelected: r,
-  isDisabled: s,
-  isIndeterminate: a,
-  isInvalid: o,
-  isReadOnly: t,
-  className: d
-}) {
-  const { base: l, checkmark: i } = b({
-    isSelected: r || a,
-    isDisabled: s,
-    isInvalid: o,
-    isReadOnly: t
-  });
-  return /* @__PURE__ */ e("div", { className: l({ className: d }), "data-dd-privacy": "mask", children: /* @__PURE__ */ e(
-    "svg",
-    {
-      fill: "none",
-      stroke: "currentColor",
-      viewBox: "0 0 16 16",
-      "aria-hidden": "true",
-      className: i(),
-      style: {
-        strokeDashoffset: r ? 44 : 66
-      },
-      children: a ? /* @__PURE__ */ e(
-        "rect",
-        {
-          x: "3",
-          y: "7",
-          width: "10",
-          height: "2",
-          rx: "0.5",
-          stroke: "none",
-          fill: "currentColor"
-        }
-      ) : /* @__PURE__ */ e(
-        "polyline",
-        {
-          points: "3.5,8 6.5,11 12.5,5",
-          stroke: "currentColor",
-          strokeDasharray: "22",
-          strokeLinecap: "butt",
-          strokeLinejoin: "bevel"
-        }
-      )
-    }
-  ) });
-}
-c.displayName = "CheckboxIndicator";
-export {
-  c as CheckboxIndicator
-};

package/dist/esm/components/checkbox-field/CheckboxField.d.ts

@@ -1,76 +0,0 @@
-import { StandardSchemaV1 } from '@standard-schema/spec';
-import { ForwardedRef, JSX, ReactNode } from 'react';
-import { FieldPath, FieldValues } from 'react-hook-form';
-import { Schema } from '../../hooks/use-form.types.js';
-import { LabelProps } from '../label/Label.js';
-interface FieldProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> extends Pick<LabelProps, 'isRequired' | 'requiredVariant'> {
-    /** The name of the field, which should match the form schema. */
-    name: TName;
-    /** The label for the checkbox. */
-    children: ReactNode;
-    /** Helper text to display below the checkbox. */
-    helperText?: ReactNode;
-    /** A contextual link to display below the checkbox. */
-    contextualLink?: ReactNode;
-    /** The default selected value of the checkbox. */
-    defaultSelected?: boolean;
-    /** Whether the checkbox is disabled. */
-    isDisabled?: boolean;
-    /** Whether the checkbox is read-only. */
-    isReadOnly?: boolean;
-    /** Whether the checkbox is invalid. */
-    isInvalid?: boolean;
-    /** Whether the checkbox is loading. */
-    isLoading?: boolean;
-}
-export type CheckboxFieldProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = FieldProps<TFieldValues, TName>;
-type CheckboxFieldComponent = (<TSchema extends Schema>(props: CheckboxFieldProps<StandardSchemaV1.InferOutput<TSchema>> & {
-    ref?: ForwardedRef<HTMLLabelElement>;
-}) => JSX.Element) & {
-    displayName?: string;
-};
-/**
- * The `CheckboxField` component enhances the base Checkbox with form integration capabilities,
- * making it easy to handle boolean values in forms with proper validation and feedback.
- *
- * It provides form validation, helper text, and error feedback while maintaining the same
- * API as the base Checkbox component. The component automatically integrates with Unity's
- * form context and handles value updates through the form's state management.
- * @param {CheckboxFieldProps} props - Props for the CheckboxField component
- * @see {@link CheckboxFieldProps} for all available props
- * @example
- * ```tsx
- * import { useUnityForm, CheckboxField } from '@payfit/unity-components'
- * import * as z from 'zod'
- *
- * function Example() {
- *   const schema = z.object({
- *     acceptTerms: z.boolean().refine(Boolean, {
- *       message: 'You must accept the terms',
- *     }),
- *   })
- *
- *   const { Form } = useUnityForm(schema)
- *
- *   return (
- *     <Form action={handleSubmit}>
- *       <CheckboxField<typeof schema>
- *         name="acceptTerms"
- *         helperText="Please read our terms carefully"
- *       >
- *         Accept terms and conditions
- *       </CheckboxField>
- *     </Form>
- *   )
- * }
- * ```
- * @remarks
- * [API](/?path=/docs/forms-checkboxfield--docs) • [Demo](/?path=/story/forms-checkboxfield--primary)
- * @note The schema type parameter is needed to ensure type safety with the form's
- schema.
- * If you omit it, the `name` prop will not be type-safe.
- * @deprecated React Hook Form components are deprecated. Use the TanStack Form version instead.
- * @see Storybook docs: https://unity-components.payfit.io/?path=/docs/forms-introduction-to-unity-forms--docs
- */
-declare const CheckboxField: CheckboxFieldComponent;
-export { CheckboxField };

package/dist/esm/components/checkbox-field/CheckboxField.js

@@ -1,67 +0,0 @@
-import { jsxs as k, jsx as m } from "react/jsx-runtime";
-import { forwardRef as C, useMemo as y } from "react";
-import { useFormContext as R } from "react-hook-form";
-import { createSchemaAdapter as q } from "../../utils/createSchemaAdapter.js";
-import { Checkbox as P } from "../checkbox/Checkbox.js";
-import { FormField as S } from "../form-field/FormField.js";
-import { FormControl as j } from "../form-field/parts/FormControl.js";
-import { FormFeedbackText as v } from "../form-field/parts/FormFeedbackText.js";
-import { isFieldRequired as w } from "../form-field/utils/isFieldRequired.js";
-import { useUnityFormProvider as N } from "../form/Form.context.js";
-function T({
-  name: o,
-  children: e,
-  defaultSelected: r,
-  helperText: t,
-  contextualLink: c,
-  isRequired: s,
-  isInvalid: d,
-  isLoading: l,
-  isDisabled: n,
-  isReadOnly: f,
-  requiredVariant: p,
-  ...u
-}, x) {
-  const { control: F, watch: a } = R(), { schema: i } = N(), h = y(
-    () => w(q(i), o),
-    [i, o]
-  ), b = a(o);
-  return /* @__PURE__ */ k(
-    S,
-    {
-      control: F,
-      name: o,
-      className: "uy:flex uy:flex-col uy:gap-100",
-      ...{
-        isInvalid: d,
-        isLoading: l,
-        isDisabled: n,
-        isReadOnly: f
-      },
-      children: [
-        /* @__PURE__ */ m(j, { children: /* @__PURE__ */ m(
-          P,
-          {
-            ref: x,
-            defaultSelected: r,
-            isSelected: b,
-            requiredVariant: p,
-            helperText: t,
-            feedbackText: /* @__PURE__ */ m(v, {}),
-            ...u,
-            isRequired: h ?? s,
-            children: e
-          }
-        ) }),
-        c
-      ]
-    }
-  );
-}
-const U = C(function(e, r) {
-  return T(e, r);
-});
-U.displayName = "CheckboxField";
-export {
-  U as CheckboxField
-};

package/dist/esm/components/checkbox-field/TanstackCheckboxField.d.ts

@@ -1,14 +0,0 @@
-import { ReactNode } from 'react';
-import { TanstackCheckboxProps } from '../checkbox/TanstackCheckbox.js';
-import { LabelProps } from '../label/Label.js';
-export interface FieldProps extends Pick<LabelProps, 'isRequired' | 'requiredVariant'> {
-    /** The label for the checkbox. */
-    children: ReactNode;
-    /** Helper text to display below the checkbox. */
-    helperText?: ReactNode;
-    /** A contextual link to display below the checkbox. */
-    contextualLink?: ReactNode;
-}
-export type TanstackCheckboxFieldProps = FieldProps & TanstackCheckboxProps;
-declare const TanstackCheckboxField: import('react').ForwardRefExoticComponent<FieldProps & TanstackCheckboxProps & import('react').RefAttributes<HTMLLabelElement>>;
-export { TanstackCheckboxField };

package/dist/esm/components/checkbox-field/TanstackCheckboxField.js

@@ -1,40 +0,0 @@
-import { jsxs as n, jsx as e } from "react/jsx-runtime";
-import { forwardRef as f } from "react";
-import { TanstackCheckbox as x } from "../checkbox/TanstackCheckbox.js";
-import { TanstackFormFeedbackText as p } from "../form-field/parts/TanstackFormFeedbackText.js";
-import { TanstackFormField as l } from "../form-field/TanstackFormField.js";
-function F({
-  children: o,
-  helperText: r,
-  contextualLink: i,
-  isRequired: t,
-  isDisabled: a,
-  isReadOnly: c,
-  requiredVariant: m,
-  value: s,
-  ...d
-}, k) {
-  return /* @__PURE__ */ n(l, { children: [
-    /* @__PURE__ */ e(
-      x,
-      {
-        ref: k,
-        value: s,
-        requiredVariant: m,
-        helperText: r,
-        feedbackText: /* @__PURE__ */ e(p, {}),
-        ...d,
-        isDisabled: a,
-        isReadOnly: c,
-        isRequired: t,
-        children: o
-      }
-    ),
-    i
-  ] });
-}
-const T = f(F);
-T.displayName = "TanstackCheckboxField";
-export {
-  T as TanstackCheckboxField
-};

package/dist/esm/components/checkbox-group/CheckboxGroup.d.ts

@@ -1,65 +0,0 @@
-import { VariantProps } from '@payfit/unity-themes';
-import { ReactNode } from 'react';
-import { CheckboxGroupProps as AriaCheckboxGroupProps } from 'react-aria-components/CheckboxGroup';
-export declare const checkboxGroup: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, "uy:flex uy:flex-col uy:gap-50", {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, "uy:flex uy:flex-col uy:gap-50", unknown, unknown, undefined>>;
-export interface CheckboxGroupProps extends VariantProps<typeof checkboxGroup>, Omit<AriaCheckboxGroupProps, 'className' | 'class'> {
-    /** The label for the checkbox group. */
-    label: string;
-    /** Helper text to display below the checkbox group. */
-    helperText?: ReactNode;
-    /** Feedback text to display below the checkbox group. */
-    feedbackText?: ReactNode;
-    /** The default selected values of the checkbox group. */
-    defaultValue?: string[];
-    /** The current selected values of the checkbox group (controlled). */
-    value?: string[];
-    /** Whether the checkbox group is disabled. */
-    isDisabled?: boolean;
-    /** Whether the checkbox group is read-only. */
-    isReadOnly?: boolean;
-    /** Whether the checkbox group is invalid. */
-    isInvalid?: boolean;
-    /** Whether the checkbox group is required. */
-    isRequired?: boolean;
-    /** Whether the checkbox group is loading. */
-    isLoading?: boolean;
-    /** The variant of the required indicator. */
-    requiredVariant?: 'required' | 'optional';
-    /** Callback when the selection changes. */
-    onChange?: (value: string[]) => void;
-    /**
-     * Handler called when the checkbox receives focus.
-     */
-    onFocus?: AriaCheckboxGroupProps['onFocus'];
-    /**
-     * Handler called when the checkbox loses focus.
-     */
-    onBlur?: AriaCheckboxGroupProps['onBlur'];
-    /**
-     * Handler that is called when the element's focus status changes.
-     * @param isFocused
-     */
-    onFocusChange?: (isFocused: boolean) => void;
-    children: ReactNode;
-}
-/**
- * The `CheckboxGroup` component is an accessible group of related checkboxes.
- * It provides a way to select multiple options from a list of choices.
- * @param {CheckboxGroupProps} props - The props for the `CheckboxGroup` component
- * @example
- * ```tsx
- * import { CheckboxGroup, Checkbox } from '@payfit/unity-components'
- *
- * <CheckboxGroup
- *   label="Notification preferences"
- *   helperText="Choose how you want to receive notifications"
- * >
- *   <Checkbox value="email">Email notifications</Checkbox>
- *   <Checkbox value="sms">SMS notifications</Checkbox>
- *   <Checkbox value="push">Push notifications</Checkbox>
- * </CheckboxGroup>
- * ```
- * @see {@link CheckboxProps} for all available props
- */
-declare const CheckboxGroup: import('react').ForwardRefExoticComponent<CheckboxGroupProps & import('react').RefAttributes<HTMLDivElement>>;
-export { CheckboxGroup };

package/dist/esm/components/checkbox-group/CheckboxGroup.js

@@ -1,73 +0,0 @@
-import { jsxs as f, jsx as r } from "react/jsx-runtime";
-import { forwardRef as d, isValidElement as x, cloneElement as h } from "react";
-import { uyTv as g } from "@payfit/unity-themes";
-import { CheckboxGroup as b } from "react-aria-components/CheckboxGroup";
-import { Label as v } from "../label/Label.js";
-import { Text as c } from "../text/Text.js";
-const G = g({
-  base: "uy:flex uy:flex-col uy:gap-50"
-}), C = d(
-  ({
-    label: l,
-    helperText: m,
-    feedbackText: o,
-    isDisabled: e,
-    isReadOnly: n,
-    isInvalid: t,
-    isRequired: s,
-    isLoading: a,
-    children: p,
-    requiredVariant: i,
-    ...u
-  }, y) => /* @__PURE__ */ f(
-    b,
-    {
-      ...{
-        isDisabled: e,
-        isReadOnly: n,
-        isInvalid: t,
-        isRequired: s,
-        isLoading: a
-      },
-      ...u,
-      ref: y,
-      className: G(),
-      children: [
-        l && /* @__PURE__ */ r(v, { isRequired: s, requiredVariant: i, children: l }),
-        m && /* @__PURE__ */ r(
-          c,
-          {
-            variant: "bodySmall",
-            color: "content.neutral.low",
-            slot: "description",
-            children: m
-          }
-        ),
-        /* @__PURE__ */ r(
-          "div",
-          {
-            className: "uy:mt-100 uy:flex uy:flex-col uy:gap-150 uy:py-25",
-            "data-dd-privacy": "mask",
-            children: p
-          }
-        ),
-        t && (typeof o == "string" ? /* @__PURE__ */ r(
-          c,
-          {
-            variant: "bodySmallStrong",
-            color: "content.form.invalid",
-            slot: "errorMessage",
-            children: o
-          }
-        ) : x(o) && h(o, {
-          slot: "errorMessage"
-        }))
-      ]
-    }
-  )
-);
-C.displayName = "CheckboxGroup";
-export {
-  C as CheckboxGroup,
-  G as checkboxGroup
-};

package/dist/esm/components/checkbox-group/TanstackCheckboxGroup.d.ts

@@ -1,4 +0,0 @@
-import { CheckboxGroupProps } from './CheckboxGroup.js';
-export type TanstackCheckboxGroupProps = Omit<CheckboxGroupProps, 'name' | 'value' | 'defaultValue' | 'isInvalid'>;
-declare const TanstackCheckboxGroup: import('react').ForwardRefExoticComponent<TanstackCheckboxGroupProps & import('react').RefAttributes<HTMLDivElement>>;
-export { TanstackCheckboxGroup };

package/dist/esm/components/checkbox-group/TanstackCheckboxGroup.js

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

package/dist/esm/components/checkbox-group-field/CheckboxGroupField.d.ts

@@ -1,81 +0,0 @@
-import { StandardSchemaV1 } from '@standard-schema/spec';
-import { ForwardedRef, JSX, PropsWithChildren, ReactNode } from 'react';
-import { FieldPath, FieldValues } from 'react-hook-form';
-import { Schema } from '../../hooks/use-form.types.js';
-import { CheckboxGroupProps } from '../checkbox-group/CheckboxGroup.js';
-import { LabelProps } from '../label/Label.js';
-interface FieldProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> extends PropsWithChildren<Pick<LabelProps, 'isRequired' | 'requiredVariant'>> {
-    /** The name of the field, which should match the form schema. */
-    name: TName;
-    /** The label for the checkbox group. */
-    label: string;
-    /** Helper text to display below the checkbox group. */
-    helperText?: ReactNode;
-    /** A contextual link to display below the checkbox group. */
-    contextualLink?: ReactNode;
-    /** The default selected values of the checkbox group. */
-    defaultValue?: string[];
-    /** Whether the checkbox group is disabled. */
-    isDisabled?: boolean;
-    /** Whether the checkbox group is read-only. */
-    isReadOnly?: boolean;
-    /** Whether the checkbox group is invalid. */
-    isInvalid?: boolean;
-    /** Whether the checkbox group is loading. */
-    isLoading?: boolean;
-    /** Callback when the selection changes. */
-    onChange?: (value: string[]) => void;
-    /**
-     * Handler called when the checkbox receives focus.
-     */
-    onFocus?: CheckboxGroupProps['onFocus'];
-    /**
-     * Handler called when the checkbox loses focus.
-     */
-    onBlur?: CheckboxGroupProps['onBlur'];
-    /**
-     * Handler that is called when the element's focus status changes.
-     * @param isFocused
-     */
-    onFocusChange?: (isFocused: boolean) => void;
-}
-export type CheckboxGroupFieldProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = FieldProps<TFieldValues, TName>;
-type CheckboxGroupFieldComponent = (<TSchema extends Schema>(props: CheckboxGroupFieldProps<StandardSchemaV1.InferOutput<TSchema>> & {
-    ref?: ForwardedRef<HTMLDivElement>;
-}) => JSX.Element) & {
-    displayName?: string;
-};
-/**
- * The `CheckboxGroupField` component renders a group of related checkboxes that can be used in forms.
- * It integrates with the `Form` component automatically and provides form validation, helper text,
- * and error feedback.
- * @example
- * ```tsx
- * const schema = z.object({
- *   preferences: z.array(z.string())
- * })
- *
- * function MyForm() {
- *   const { Form } = useUnityForm(schema)
- *
- *   return (
- *     <Form action={handleSubmit}>
- *       <CheckboxGroupField<typeof schema>
- *         name="preferences"
- *         label="Select your preferences"
- *         helperText="Choose all that apply"
- *       >
- *         <Checkbox value="email">Email notifications</Checkbox>
- *         <Checkbox value="sms">SMS notifications</Checkbox>
- *       </CheckboxGroupField>
- *     </Form>
- *   )
- * }
- * ```
- * @note The schema type parameter is needed to ensure type safety with the form's schema.
- * If you omit it, the `name` prop will not be type-safe.
- * @deprecated React Hook Form components are deprecated. Use the TanStack Form version instead.
- * @see Storybook docs: https://unity-components.payfit.io/?path=/docs/forms-introduction-to-unity-forms--docs
- */
-declare const CheckboxGroupField: CheckboxGroupFieldComponent;
-export { CheckboxGroupField };

package/dist/esm/components/checkbox-group-field/CheckboxGroupField.js

@@ -1,57 +0,0 @@
-import { jsxs as k, jsx as t } from "react/jsx-runtime";
-import { forwardRef as C } from "react";
-import { useFormContext as a } from "react-hook-form";
-import { CheckboxGroup as G } from "../checkbox-group/CheckboxGroup.js";
-import { FormField as j } from "../form-field/FormField.js";
-import { FormControl as w } from "../form-field/parts/FormControl.js";
-import { FormFeedbackText as y } from "../form-field/parts/FormFeedbackText.js";
-function P({
-  name: o,
-  label: r,
-  defaultValue: e,
-  helperText: m,
-  contextualLink: c,
-  isRequired: i,
-  isInvalid: n,
-  isLoading: p,
-  isDisabled: f,
-  isReadOnly: l,
-  requiredVariant: d,
-  children: s,
-  ...u
-}, x) {
-  const { control: F, watch: h } = a(), b = h(o);
-  return /* @__PURE__ */ k(j, { control: F, name: o, ...{
-    isRequired: i,
-    isInvalid: n,
-    isLoading: p,
-    isDisabled: f,
-    isReadOnly: l
-  }, children: [
-    /* @__PURE__ */ t(w, { children: /* @__PURE__ */ t(
-      G,
-      {
-        ref: x,
-        label: r,
-        defaultValue: e,
-        value: b,
-        helperText: m,
-        feedbackText: /* @__PURE__ */ t(y, {}),
-        requiredVariant: d,
-        ...u,
-        children: s
-      }
-    ) }),
-    c
-  ] });
-}
-const T = C(function(r, e) {
-  return P(
-    r,
-    e
-  );
-});
-T.displayName = "CheckboxGroupField";
-export {
-  T as CheckboxGroupField
-};