@payfit/unity-components 2.46.11 → 2.46.13

package/dist/esm/components/navigation-card/NavigationCard.variants.js

@@ -1,164 +0,0 @@
-import { uyTv as e } from "@payfit/unity-themes";
-const u = e({
-  slots: {
-    base: [
-      "uy:flex uy:flex-row uy:items-center uy:text-left",
-      "uy:rounded-lg uy:border-solid uy:border-1 uy:transition-colors uy:group",
-      "uy:cursor-pointer uy:data-[disabled]:cursor-not-allowed",
-      "uy:bg-surface-neutral uy:border-border-neutral",
-      "uy:theme-legacy:text-content-neutral-low uy:theme-rebrand:text-content-neutral",
-      "uy:data-[hovered]:bg-surface-neutral-hover uy:data-[hovered]:border-border-neutral-hover",
-      "uy:data-[pressed]:bg-surface-neutral-pressed uy:theme-legacy:data-[pressed]:border-border-neutral-pressed uy:theme-rebrand:data-[pressed]:border-transparent",
-      "uy:data-[focus-visible]:outline-utility-focus-ring uy:data-[focus-visible]:outline-2 uy:data-[focus-visible]:outline-solid uy:data-[focus-visible]:outline-offset-2",
-      "uy:data-[disabled]:bg-surface-neutral-disabled uy:data-[disabled]:border-border-neutral-disabled"
-    ],
-    prefix: ["uy:w-fit uy:contents uy:grow-0 uy:shrink-1"],
-    body: ["uy:flex-1 uy:space-y-50"],
-    suffix: ["uy:w-fit uy:grow-0 uy:shrink-1"]
-  },
-  variants: {
-    gap: {
-      $0: { base: "uy:gap-0" },
-      $25: { base: "uy:gap-25" },
-      $50: { base: "uy:gap-50" },
-      $75: { base: "uy:gap-75" },
-      $100: { base: "uy:gap-100" },
-      $125: { base: "uy:gap-125" },
-      $150: { base: "uy:gap-150" },
-      $200: { base: "uy:gap-200" },
-      $250: { base: "uy:gap-250" },
-      $300: { base: "uy:gap-300" },
-      $400: { base: "uy:gap-400" },
-      $500: { base: "uy:gap-500" },
-      $600: { base: "uy:gap-600" },
-      $800: { base: "uy:gap-800" },
-      $1000: { base: "uy:gap-1000" }
-    },
-    padding: {
-      $0: { base: "uy:p-0" },
-      $25: { base: "uy:p-25" },
-      $50: { base: "uy:p-50" },
-      $75: { base: "uy:p-75" },
-      $100: { base: "uy:p-100" },
-      $125: { base: "uy:p-125" },
-      $150: { base: "uy:p-150" },
-      $200: { base: "uy:p-200" },
-      $250: { base: "uy:p-250" },
-      $300: { base: "uy:p-300" },
-      $400: { base: "uy:p-400" },
-      $500: { base: "uy:p-500" },
-      $600: { base: "uy:p-600" },
-      $800: { base: "uy:p-800" },
-      $1000: { base: "uy:p-1000" }
-    },
-    paddingBlock: {
-      $0: { base: "uy:py-0" },
-      $25: { base: "uy:py-25" },
-      $50: { base: "uy:py-50" },
-      $75: { base: "uy:py-75" },
-      $100: { base: "uy:py-100" },
-      $125: { base: "uy:py-125" },
-      $150: { base: "uy:py-150" },
-      $200: { base: "uy:py-200" },
-      $250: { base: "uy:py-250" },
-      $300: { base: "uy:py-300" },
-      $400: { base: "uy:py-400" },
-      $500: { base: "uy:py-500" },
-      $600: { base: "uy:py-600" },
-      $800: { base: "uy:py-800" },
-      $1000: { base: "uy:py-1000" }
-    },
-    paddingInline: {
-      $0: { base: "uy:px-0" },
-      $25: { base: "uy:px-25" },
-      $50: { base: "uy:px-50" },
-      $75: { base: "uy:px-75" },
-      $100: { base: "uy:px-100" },
-      $125: { base: "uy:px-125" },
-      $150: { base: "uy:px-150" },
-      $200: { base: "uy:px-200" },
-      $250: { base: "uy:px-250" },
-      $300: { base: "uy:px-300" },
-      $400: { base: "uy:px-400" },
-      $500: { base: "uy:px-500" },
-      $600: { base: "uy:px-600" },
-      $800: { base: "uy:px-800" },
-      $1000: { base: "uy:px-1000" }
-    },
-    paddingTop: {
-      $0: { base: "uy:pt-0" },
-      $25: { base: "uy:pt-25" },
-      $50: { base: "uy:pt-50" },
-      $75: { base: "uy:pt-75" },
-      $100: { base: "uy:pt-100" },
-      $125: { base: "uy:pt-125" },
-      $150: { base: "uy:pt-150" },
-      $200: { base: "uy:pt-200" },
-      $250: { base: "uy:pt-250" },
-      $300: { base: "uy:pt-300" },
-      $400: { base: "uy:pt-400" },
-      $500: { base: "uy:pt-500" },
-      $600: { base: "uy:pt-600" },
-      $800: { base: "uy:pt-800" },
-      $1000: { base: "uy:pt-1000" }
-    },
-    paddingRight: {
-      $0: { base: "uy:pr-0" },
-      $25: { base: "uy:pr-25" },
-      $50: { base: "uy:pr-50" },
-      $75: { base: "uy:pr-75" },
-      $100: { base: "uy:pr-100" },
-      $125: { base: "uy:pr-125" },
-      $150: { base: "uy:pr-150" },
-      $200: { base: "uy:pr-200" },
-      $250: { base: "uy:pr-250" },
-      $300: { base: "uy:pr-300" },
-      $400: { base: "uy:pr-400" },
-      $500: { base: "uy:pr-500" },
-      $600: { base: "uy:pr-600" },
-      $800: { base: "uy:pr-800" },
-      $1000: { base: "uy:pr-1000" }
-    },
-    paddingBottom: {
-      $0: { base: "uy:pb-0" },
-      $25: { base: "uy:pb-25" },
-      $50: { base: "uy:pb-50" },
-      $75: { base: "uy:pb-75" },
-      $100: { base: "uy:pb-100" },
-      $125: { base: "uy:pb-125" },
-      $150: { base: "uy:pb-150" },
-      $200: { base: "uy:pb-200" },
-      $250: { base: "uy:pb-250" },
-      $300: { base: "uy:pb-300" },
-      $400: { base: "uy:pb-400" },
-      $500: { base: "uy:pb-500" },
-      $600: { base: "uy:pb-600" },
-      $800: { base: "uy:pb-800" },
-      $1000: { base: "uy:pb-1000" }
-    },
-    paddingLeft: {
-      $0: { base: "uy:pl-0" },
-      $25: { base: "uy:pl-25" },
-      $50: { base: "uy:pl-50" },
-      $75: { base: "uy:pl-75" },
-      $100: { base: "uy:pl-100" },
-      $125: { base: "uy:pl-125" },
-      $150: { base: "uy:pl-150" },
-      $200: { base: "uy:pl-200" },
-      $250: { base: "uy:pl-250" },
-      $300: { base: "uy:pl-300" },
-      $400: { base: "uy:pl-400" },
-      $500: { base: "uy:pl-500" },
-      $600: { base: "uy:pl-600" },
-      $800: { base: "uy:pl-800" },
-      $1000: { base: "uy:pl-1000" }
-    }
-  },
-  defaultVariants: {
-    padding: "$300",
-    gap: "$150"
-  }
-});
-export {
-  u as navigationCard
-};

package/dist/esm/components/navigation-card/parts/NavigationCardDescription.d.ts

@@ -1,39 +0,0 @@
-import { TextProps } from '../../text/Text.js';
-export type NavigationCardDescriptionProps = Omit<TextProps, 'variant' | 'color' | 'className' | 'style'>;
-/**
- * Displays supplementary descriptive text for a NavigationCard component.
- * Use this component to provide additional context or details about the navigation card's destination, helping users understand what they'll find when they navigate.
- * The description automatically connects to the parent NavigationCard for proper accessibility semantics.
- * @param {NavigationCardDescriptionProps} props - Standard text element props (excluding variant, color, className, and style which are preset)
- * @example
- * ```tsx
- * import {
- *   RawNavigationCard,
- *   NavigationCardLabel,
- *   NavigationCardDescription
- * } from '@payfit/unity-components'
- *
- * function Example() {
- *   return (
- *     <RawNavigationCard href="/reports">
- *       <NavigationCardLabel>Monthly Reports</NavigationCardLabel>
- *       <NavigationCardDescription>
- *         Access and download your company's monthly reports
- *       </NavigationCardDescription>
- *     </RawNavigationCard>
- *   )
- * }
- * ```
- * @remarks
- * - Must be used within a `NavigationCard` component to function correctly
- * - The description text is styled with the "body" typography variant and lower emphasis color
- * - Automatically receives proper accessibility IDs from the parent NavigationCard
- * - Supports all standard HTML text element props except styling props which are managed by the component
- * @see {@link NavigationCardDescriptionProps} for all available props
- * @see Source code in {@link https://github.com/PayFit/hr-apps/tree/master/libs/shared/unity/components/src/components/navigation-card/parts GitHub}
- * @see Design specs {@link https://www.figma.com/design/poaMyU7abAgL9VRhx4ygyy/Unity-DS-%3E-Components-Library?node-id=14505-64292 Figma}
- * @see Design docs in {@link https://www.payfit.design/ Payfit.design}
- * @see Developer docs in {@link https://unity-components.payfit.io/?path=/docs/navigation-navigationcard-navigationcarddescription--docs unity-components.payfit.io}
- */
-declare const NavigationCardDescription: import('react').ForwardRefExoticComponent<NavigationCardDescriptionProps & import('react').RefAttributes<HTMLDivElement>>;
-export { NavigationCardDescription };

package/dist/esm/components/navigation-card/parts/NavigationCardDescription.js

@@ -1,22 +0,0 @@
-import { jsx as a } from "react/jsx-runtime";
-import { forwardRef as i } from "react";
-import { Text as e } from "../../text/Text.js";
-import { useNavigationCardContext as n } from "../NavigationCard.context.js";
-const d = i((o, t) => {
-  const { descriptionId: r } = n();
-  return /* @__PURE__ */ a(
-    e,
-    {
-      id: r,
-      ...o,
-      ref: t,
-      variant: "body",
-      color: "content.neutral.low",
-      className: "uy:max-sm:typography-body-small uy:group-aria-disabled:text-content-neutral-disabled"
-    }
-  );
-});
-d.displayName = "NavigationCardDescription";
-export {
-  d as NavigationCardDescription
-};

package/dist/esm/components/navigation-card/parts/NavigationCardGroup.d.ts

@@ -1,146 +0,0 @@
-import { default as React, PropsWithChildren } from 'react';
-import { VariantProps } from '@payfit/unity-themes';
-export declare const navigationCardGroup: import('tailwind-variants').TVReturnType<{
-    orientation: {
-        horizontal: {
-            list: string;
-        };
-        vertical: {
-            list: string;
-        };
-    };
-    variant: {
-        compact: {
-            list: string;
-        };
-        comfortable: {
-            list: string;
-        };
-    };
-    showLabel: {
-        true: {
-            label: string;
-        };
-        false: {
-            label: string;
-        };
-    };
-}, {
-    base: string[];
-    label: string[];
-    list: string[];
-    listItem: string[];
-}, undefined, {
-    orientation: {
-        horizontal: {
-            list: string;
-        };
-        vertical: {
-            list: string;
-        };
-    };
-    variant: {
-        compact: {
-            list: string;
-        };
-        comfortable: {
-            list: string;
-        };
-    };
-    showLabel: {
-        true: {
-            label: string;
-        };
-        false: {
-            label: string;
-        };
-    };
-}, {
-    base: string[];
-    label: string[];
-    list: string[];
-    listItem: string[];
-}, import('tailwind-variants').TVReturnType<{
-    orientation: {
-        horizontal: {
-            list: string;
-        };
-        vertical: {
-            list: string;
-        };
-    };
-    variant: {
-        compact: {
-            list: string;
-        };
-        comfortable: {
-            list: string;
-        };
-    };
-    showLabel: {
-        true: {
-            label: string;
-        };
-        false: {
-            label: string;
-        };
-    };
-}, {
-    base: string[];
-    label: string[];
-    list: string[];
-    listItem: string[];
-}, undefined, unknown, unknown, undefined>>;
-export interface NavigationCardGroupProps extends PropsWithChildren {
-    label: string;
-    isLabelHidden?: boolean;
-    orientation?: VariantProps<typeof navigationCardGroup>['orientation'];
-    variant?: VariantProps<typeof navigationCardGroup>['variant'];
-}
-/**
- * Groups multiple NavigationCard components together with a shared label, consistent layout, and proper accessibility.
- * Use this component to organize related navigation cards into logical sections, creating clear visual hierarchy and improving discoverability.
- * The group automatically handles spacing, borders, and rounded corners for seamless visual integration between cards.
- * @param {NavigationCardGroupProps} props - Props including label, isLabelHidden, orientation, variant, and children
- * @example
- * ```tsx
- * import {
- *   NavigationCardGroup,
- *   RawNavigationCard,
- *   NavigationCardLabel
- * } from '@payfit/unity-components'
- *
- * function Example() {
- *   return (
- *     <NavigationCardGroup
- *       label="Quick Actions"
- *       variant="compact"
- *     >
- *       <RawNavigationCard href="/payroll">
- *         <NavigationCardLabel>Run Payroll</NavigationCardLabel>
- *       </RawNavigationCard>
- *       <RawNavigationCard href="/reports">
- *         <NavigationCardLabel>View Reports</NavigationCardLabel>
- *       </RawNavigationCard>
- *       <RawNavigationCard href="/settings">
- *         <NavigationCardLabel>Settings</NavigationCardLabel>
- *       </RawNavigationCard>
- *     </NavigationCardGroup>
- *   )
- * }
- * ```
- * @remarks
- * - Set the `variant` prop to `"compact"` to remove spacing between cards and merge their borders for a unified look
- * - Use `variant="comfortable"` (default) for cards with individual spacing and borders
- * - Set `orientation` to `"horizontal"` for responsive layout (stacks vertically on mobile, horizontally on larger screens)
- * - Use `isLabelHidden` to visually hide the label while keeping it accessible to screen readers
- * - The label is required for accessibility and provides context for navigation landmarks
- * - Only include NavigationCard components as direct children for proper styling
- * @see {@link NavigationCardGroupProps} for all available props
- * @see Source code in {@link https://github.com/PayFit/hr-apps/tree/master/libs/shared/unity/components/src/components/navigation-card/parts GitHub}
- * @see Design specs {@link https://www.figma.com/design/poaMyU7abAgL9VRhx4ygyy/Unity-DS-%3E-Components-Library?node-id=14505-64292 Figma}
- * @see Design docs in {@link https://www.payfit.design/ Payfit.design}
- * @see Developer docs in {@link https://unity-components.payfit.io/?path=/docs/navigation-navigationcard-navigationcardgroup--docs unity-components.payfit.io}
- */
-declare const NavigationCardGroup: React.ForwardRefExoticComponent<NavigationCardGroupProps & React.RefAttributes<HTMLElement>>;
-export { NavigationCardGroup };

package/dist/esm/components/navigation-card/parts/NavigationCardGroup.js

@@ -1,93 +0,0 @@
-import { jsxs as N, jsx as l } from "react/jsx-runtime";
-import i, { forwardRef as w } from "react";
-import { uyTv as C } from "@payfit/unity-themes";
-import { useId as I } from "react-aria/useId";
-const L = C({
-  // add the component styles
-  slots: {
-    base: ["uy:flex uy:flex-col uy:gap-100"],
-    label: ["uy:typography-action"],
-    list: ["uy:flex uy:list-none uy:group"],
-    listItem: [
-      "uy:contents",
-      "uy:data-[variant=compact]:*:rounded-none",
-      "uy:data-[variant=compact]:*:border-b-0",
-      "uy:data-[variant=compact]:first:*:rounded-t-lg",
-      "uy:data-[variant=compact]:last:*:rounded-b-lg",
-      "uy:data-[variant=compact]:last:*:border-b-1",
-      "uy:data-[variant=compact]:first:last:*:rounded-lg"
-    ]
-  },
-  variants: {
-    orientation: {
-      horizontal: {
-        list: "uy:flex-col uy:sm:flex-row"
-      },
-      vertical: {
-        list: "uy:flex-col"
-      }
-    },
-    variant: {
-      compact: {
-        list: "uy:gap-0"
-      },
-      comfortable: {
-        list: "uy:gap-100"
-      }
-    },
-    showLabel: {
-      true: {
-        label: ""
-      },
-      false: {
-        label: "uy:sr-only"
-      }
-    }
-  },
-  defaultVariants: {
-    orientation: "vertical",
-    variant: "comfortable",
-    showLabel: !0
-  }
-}), G = w(
-  ({
-    children: s,
-    label: n,
-    isLabelHidden: c = !1,
-    orientation: u = "vertical",
-    variant: t = "comfortable",
-    ...d
-  }, y) => {
-    const m = I(), {
-      base: p,
-      label: b,
-      list: f,
-      listItem: v
-    } = L({ orientation: u, variant: t, showLabel: !c }), r = i.Children.toArray(s), g = r.length, o = `navcard-group-label-${m}`;
-    return /* @__PURE__ */ N("nav", { ...d, ref: y, className: p(), "aria-labelledby": o, children: [
-      /* @__PURE__ */ l("span", { className: b(), id: o, children: n }),
-      /* @__PURE__ */ l("ul", { className: f(), "data-variant": t, children: r.map((a, e) => {
-        if (i.isValidElement(a)) {
-          const h = e === 0, x = e === g - 1;
-          return /* @__PURE__ */ l(
-            "li",
-            {
-              className: v(),
-              "data-variant": t,
-              "data-unity-first": h ? "" : void 0,
-              "data-unity-last": x ? "" : void 0,
-              children: a
-            },
-            a.key
-          );
-        }
-        return a;
-      }) })
-    ] });
-  }
-);
-G.displayName = "NavigationCardGroup";
-export {
-  G as NavigationCardGroup,
-  L as navigationCardGroup
-};

package/dist/esm/components/navigation-card/parts/NavigationCardLabel.d.ts

@@ -1,32 +0,0 @@
-import { TextProps } from '../../text/Text.js';
-export type NavigationCardLabelProps = Omit<TextProps, 'variant' | 'color' | 'className' | 'style'>;
-/**
- * Displays the primary label text for a NavigationCard component.
- * Use this component to provide the main identifying text for your navigation card, which serves as the accessible label for the entire card.
- * The label automatically connects to the parent NavigationCard for proper accessibility semantics.
- * @param {NavigationCardLabelProps} props - Standard text element props (excluding variant, color, className, and style which are preset)
- * @example
- * ```tsx
- * import { RawNavigationCard, NavigationCardLabel } from '@payfit/unity-components'
- *
- * function Example() {
- *   return (
- *     <RawNavigationCard href="/team">
- *       <NavigationCardLabel>Team Members</NavigationCardLabel>
- *     </RawNavigationCard>
- *   )
- * }
- * ```
- * @remarks
- * - Must be used within a `NavigationCard` component to function correctly
- * - The label text is styled with the "action" typography variant for consistency
- * - Automatically receives proper accessibility IDs from the parent NavigationCard
- * - Supports all standard HTML text element props except styling props which are managed by the component
- * @see {@link NavigationCardLabelProps} for all available props
- * @see Source code in {@link https://github.com/PayFit/hr-apps/tree/master/libs/shared/unity/components/src/components/navigation-card/parts GitHub}
- * @see Design specs {@link https://www.figma.com/design/poaMyU7abAgL9VRhx4ygyy/Unity-DS-%3E-Components-Library?node-id=14505-64292 Figma}
- * @see Design docs in {@link https://www.payfit.design/ Payfit.design}
- * @see Developer docs in {@link https://unity-components.payfit.io/?path=/docs/navigation-navigationcard-navigationcardlabel--docs unity-components.payfit.io}
- */
-declare const NavigationCardLabel: import('react').ForwardRefExoticComponent<NavigationCardLabelProps & import('react').RefAttributes<HTMLElement>>;
-export { NavigationCardLabel };

package/dist/esm/components/navigation-card/parts/NavigationCardLabel.js

@@ -1,24 +0,0 @@
-import { jsx as r } from "react/jsx-runtime";
-import { forwardRef as e } from "react";
-import { Text as i } from "../../text/Text.js";
-import { useNavigationCardContext as n } from "../NavigationCard.context.js";
-const d = e(
-  (a, t) => {
-    const { labelId: o } = n();
-    return /* @__PURE__ */ r(
-      i,
-      {
-        id: o,
-        ...a,
-        ref: t,
-        variant: "action",
-        color: "content.neutral",
-        className: "uy:group-aria-disabled:text-content-neutral-disabled"
-      }
-    );
-  }
-);
-d.displayName = "NavigationCardLabel";
-export {
-  d as NavigationCardLabel
-};

package/dist/esm/components/number-field/NumberField.d.ts

@@ -1,49 +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';
-import { NumberProps } from '../number-input/NumberInput.js';
-export declare const numberField: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, "uy:flex uy:flex-col uy:gap-100", {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, "uy:flex uy:flex-col uy:gap-100", unknown, unknown, undefined>>;
-export interface NumberFieldProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> extends Pick<LabelProps, 'isRequired' | 'requiredVariant'>, Omit<NumberProps, 'name'> {
-    /** The name of the field, which should match the form schema. */
-    name: TName;
-    /** The label for the text field. */
-    label: string;
-    /** Helper text to display below the text field. */
-    helperText?: ReactNode;
-    /** Feedback text to display below the text field. */
-    feedbackText?: ReactNode;
-    /** A contextual link to display below the text field. */
-    contextualLink?: ReactNode;
-}
-type NumberFieldComponent = (<TSchema extends Schema>(props: NumberFieldProps<StandardSchemaV1.InferOutput<TSchema>> & {
-    ref?: ForwardedRef<HTMLInputElement>;
-}) => JSX.Element) & {
-    displayName?: string;
-};
-/**
- * NumberField is a form control component that combines a number input with form field functionality.
- * It integrates with React Hook Form and provides features like validation, labels, helper text, and feedback.
- * @template TFieldValues - The type of the form values
- * @template TName - The type of the field name (must be a key of TFieldValues)
- * @example
- * ```tsx
- * import { NumberField } from '@payfit/unity-components'
- *
- * <NumberField
- *   name="age"
- *   label="Age"
- *   helperText="Enter your age in years"
- *   isRequired
- * />
- * ```
- * @template TSchema - The Zod schema type for form validation
- * @param {NumberFieldProps<StandardSchemaV1.InferOutput<TSchema>>} props - The props for the NumberField component
- * @param {ForwardedRef<HTMLInputElement>} ref - Ref forwarded to the underlying input element
- * @returns {JSX.Element} A NumberField component
- * @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 NumberField: NumberFieldComponent;
-export { NumberField };

package/dist/esm/components/number-field/NumberField.js

@@ -1,71 +0,0 @@
-import { jsxs as h, jsx as r } from "react/jsx-runtime";
-import { forwardRef as C } from "react";
-import { uyTv as I } from "@payfit/unity-themes";
-import { useFormContext as T } from "react-hook-form";
-import { FormField as j } from "../form-field/FormField.js";
-import { FormControl as B } from "../form-field/parts/FormControl.js";
-import { FormFeedbackText as P } from "../form-field/parts/FormFeedbackText.js";
-import { FormHelperText as g } from "../form-field/parts/FormHelperText.js";
-import { FormLabel as k } from "../form-field/parts/FormLabel.js";
-import { NumberInput as v } from "../number-input/NumberInput.js";
-const w = I({
-  base: "uy:flex uy:flex-col uy:gap-100"
-});
-function H({
-  name: o,
-  label: e,
-  defaultValue: t,
-  helperText: m,
-  feedbackText: n,
-  contextualLink: i,
-  isRequired: l,
-  isInvalid: s,
-  isLoading: u,
-  isDisabled: c,
-  isReadOnly: p,
-  requiredVariant: f,
-  onClearButtonPress: d,
-  ...a
-}, F) {
-  const { control: b, setValue: x } = T(), N = {
-    isRequired: l,
-    isInvalid: s,
-    isLoading: u,
-    isDisabled: c,
-    isReadOnly: p
-  }, y = d ?? (() => {
-    x(o, NaN);
-  });
-  return /* @__PURE__ */ h(
-    j,
-    {
-      control: b,
-      name: o,
-      className: w(),
-      ...N,
-      children: [
-        /* @__PURE__ */ r(k, { requiredVariant: f, children: e }),
-        m && /* @__PURE__ */ r(g, { children: m }),
-        /* @__PURE__ */ r(B, { children: /* @__PURE__ */ r(
-          v,
-          {
-            ref: F,
-            onClearButtonPress: y,
-            defaultValue: t,
-            ...a
-          }
-        ) }),
-        /* @__PURE__ */ r(P, { children: n }),
-        i
-      ]
-    }
-  );
-}
-const L = C(function(e, t) {
-  return H(e, t);
-});
-L.displayName = "NumberField";
-export {
-  L as NumberField,
-  w as numberField
-};