@payfit/unity-components 2.46.11 → 2.46.13

package/dist/esm/components/pagination/parts/PaginationEllipsis.d.ts

@@ -1,30 +0,0 @@
-import { VariantProps } from '@payfit/unity-themes';
-import { ButtonProps } from 'react-aria-components/Button';
-declare const paginationEllipsis: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, string[], {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, string[], unknown, unknown, undefined>>;
-export interface PaginationEllipsisProps extends VariantProps<typeof paginationEllipsis>, Omit<ButtonProps, 'value' | 'children' | 'className' | 'style' | 'slot'> {
-    /**
-     * The id of the ellipsis element
-     */
-    id?: string;
-    /**
-     * Whether the ellipsis is disabled
-     */
-    isDisabled?: boolean;
-    /**
-     * The range of pages represented by this ellipsis [start, end]
-     * When end is Infinity, it indicates an unknown page count
-     */
-    value: [number, number];
-}
-/**
- * The PaginationEllipsis component renders an ellipsis indicator for pagination.
- * This component is used to indicate that there are more pages between the visible range.
- * @example
- * ```tsx
- * import { PaginationEllipsis } from '@payfit/unity-components'
- *
- * <PaginationEllipsis value={[5, 10]} />
- * ```
- */
-declare const PaginationEllipsis: import('react').ForwardRefExoticComponent<PaginationEllipsisProps & import('react').RefAttributes<HTMLButtonElement>>;
-export { PaginationEllipsis };

package/dist/esm/components/pagination/parts/PaginationEllipsis.js

@@ -1,34 +0,0 @@
-import { jsxs as a, jsx as i } from "react/jsx-runtime";
-import { forwardRef as r } from "react";
-import { uyTv as y } from "@payfit/unity-themes";
-import { Button as c } from "react-aria-components/Button";
-import { useIntl as p, FormattedMessage as f } from "react-intl";
-const m = y({
-  base: [
-    "uy:min-w-300 uy:h-300 uy:p-25 uy:flex uy:justify-center uy:items-center uy:typography-action uy:rounded-pill uy:cursor-default",
-    "uy:focus-visible:outline-2 uy:focus-visible:outline-solid uy:focus-visible:outline-utility-focus-ring uy:focus-visible:outline-offset-2"
-  ]
-}), d = r(({ value: n, ...s }, o) => {
-  const t = p(), [u, e] = n, l = e === 1 / 0 ? t.formatMessage({
-    id: "unity:component:common:unknown",
-    defaultMessage: "unknown"
-  }) : e;
-  return /* @__PURE__ */ a(c, { ref: o, className: m(), ...s, children: [
-    /* @__PURE__ */ i("span", { "aria-hidden": !0, children: "…" }),
-    /* @__PURE__ */ i("span", { className: "uy:sr-only", children: /* @__PURE__ */ i(
-      f,
-      {
-        id: "unity:component:pagination:ellipsis:label",
-        defaultMessage: "More pages",
-        values: {
-          start: u,
-          end: l
-        }
-      }
-    ) })
-  ] });
-});
-d.displayName = "PaginationEllipsis";
-export {
-  d as PaginationEllipsis
-};

package/dist/esm/components/pagination/parts/PaginationItem.d.ts

@@ -1,38 +0,0 @@
-import { ComponentPropsWithoutRef, ReactNode } from 'react';
-export interface PaginationItemProps extends ComponentPropsWithoutRef<'li'> {
-    children: ReactNode;
-    /**
-     * The position of this item in the set (for aria-posinset)
-     * If not provided, will be calculated from context
-     */
-    pageNumber?: number;
-    /**
-     * The total number of pages (for aria-setsize)
-     * If not provided, will be calculated from context
-     */
-    pageCount?: number;
-}
-/**
- * The PaginationItem component provides a list item wrapper for individual pagination controls.
- * This component renders as a li element and should contain pagination links or buttons.
- * It automatically gets pageCount from context and calculates aria attributes.
- * @param props.children - The children to render.
- * @param props.pageNumber - The position of this item in the set (for aria-posinset).
- * @param props.pageCount - The total number of pages (for aria-setsize).
- * @example
- * ```tsx
- * import { PaginationItem, RawPaginationLink } from '@payfit/unity-components'
- *
- * function MyPaginationItem() {
- *   return (
- *     <PaginationItem pageNumber={1}>
- *       <RawPaginationLink href="/page/1" isActive>
- *         1
- *       </RawPaginationLink>
- *     </PaginationItem>
- *   )
- * }
- * ```
- */
-declare const PaginationItem: import('react').ForwardRefExoticComponent<PaginationItemProps & import('react').RefAttributes<HTMLLIElement>>;
-export { PaginationItem };

package/dist/esm/components/pagination/parts/PaginationItem.js

@@ -1,22 +0,0 @@
-import { jsx as s } from "react/jsx-runtime";
-import { forwardRef as m } from "react";
-import { usePaginationContext as p } from "../PaginationContext.js";
-const f = m(
-  ({ children: o, pageNumber: a, pageCount: i, ...e }, n) => {
-    const { pageCount: r } = p(), t = i ?? r;
-    return /* @__PURE__ */ s(
-      "li",
-      {
-        ...e,
-        ref: n,
-        "aria-setsize": t !== -1 ? t : void 0,
-        "aria-posinset": a,
-        children: o
-      }
-    );
-  }
-);
-f.displayName = "PaginationItem";
-export {
-  f as PaginationItem
-};

package/dist/esm/components/pagination/parts/RawPaginationLink.d.ts

@@ -1,11 +0,0 @@
-import { VariantProps } from '@payfit/unity-themes';
-import { LinkProps } from 'react-aria-components/Link';
-export declare const paginationLink: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, string[], {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, string[], unknown, unknown, undefined>>;
-export interface PaginationLinkProps extends LinkProps, VariantProps<typeof paginationLink> {
-    value: number;
-    id?: string;
-    isDisabled?: boolean;
-    isCurrent?: boolean;
-}
-declare const RawPaginationLink: import('react').ForwardRefExoticComponent<PaginationLinkProps & import('react').RefAttributes<HTMLAnchorElement>>;
-export { RawPaginationLink };

package/dist/esm/components/pagination/parts/RawPaginationLink.js

@@ -1,60 +0,0 @@
-import { jsx as m } from "react/jsx-runtime";
-import { forwardRef as w, useRef as h, useCallback as u } from "react";
-import { uyTv as v } from "@payfit/unity-themes";
-import { Link as x } from "react-aria-components/Link";
-import { useIntl as P } from "react-intl";
-import { usePaginationContext as k } from "../PaginationContext.js";
-const R = v({
-  base: [
-    "uy:min-w-300 uy:h-300 uy:p-25 uy:flex uy:justify-center uy:items-center uy:typography-action uy:rounded-pill uy:transition-colors",
-    "uy:enabled:text-content-neutral-enabled uy:enabled:bg-transparent uy:cursor-pointer",
-    "uy:data-[disabled]:text-content-neutral-disabled uy:data-[disabled]:bg-surface-neutral-lowest-disabled uy:data-[disabled]:cursor-not-allowed",
-    "uy:hover:text-content-neutral-hover uy:hover:bg-surface-neutral-lowest-hover",
-    "uy:active:text-content-neutral-pressed uy:active:bg-surface-neutral-lowest-pressed uy:data-[pressed]:text-content-neutral-pressed uy:data-[pressed]:bg-surface-neutral-lowest-pressed",
-    "uy:aria-[current=page]:bg-surface-neutral-lowest-selected",
-    "uy:focus-visible:outline-2 uy:focus-visible:outline-solid uy:focus-visible:outline-utility-focus-ring uy:focus-visible:outline-offset-2",
-    "uy:data-[focus-visible]:outline-2 uy:data-[focus-visible]:outline-solid uy:data-[focus-visible]:outline-utility-focus-ring uy:data-[focus-visible]:outline-offset-2"
-  ]
-}), C = w(
-  ({ isCurrent: r, isDisabled: l, value: t, onPress: c, ...a }, n) => {
-    const y = P(), { currentPage: s, onKeyDown: f, pageRefs: i, onPageChange: o } = k(), d = h(null), g = u(
-      (e) => {
-        d.current = e, e ? i.current.set(t, e) : i.current.delete(t), typeof n == "function" ? n(e) : n && (n.current = e);
-      },
-      [t, i, n]
-    ), b = r ?? s === t, p = u(() => {
-      if (!a.href) {
-        const e = t > s ? 1 : -1;
-        o(t, s, e);
-      }
-    }, [t, s, o, a.href]);
-    return /* @__PURE__ */ m(
-      x,
-      {
-        ...a,
-        ref: g,
-        className: R(),
-        isDisabled: l,
-        onPress: c ?? p,
-        "aria-current": b ? "page" : void 0,
-        "aria-label": y.formatMessage(
-          {
-            id: "unity:component:pagination:link:label",
-            defaultMessage: "Page {page}"
-          },
-          {
-            page: t
-          }
-        ),
-        onKeyDown: (e) => {
-          f(e);
-        }
-      }
-    );
-  }
-);
-C.displayName = "RawPaginationLink";
-export {
-  C as RawPaginationLink,
-  R as paginationLink
-};

package/dist/esm/components/pagination/parts/RawPaginationNext.d.ts

@@ -1,22 +0,0 @@
-import { VariantProps } from '@payfit/unity-themes';
-import { LinkProps } from 'react-aria-components/Link';
-declare const paginationNavButton: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, string[], {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, string[], unknown, unknown, undefined>>;
-export interface RawPaginationNextProps extends Omit<LinkProps, 'children' | 'className' | 'style' | 'isDisabled' | 'aria-label' | 'title'>, VariantProps<typeof paginationNavButton> {
-    id?: string;
-    isDisabled?: boolean;
-    href?: string;
-}
-/**
- * The RawPaginationNext component renders a "Next" link for pagination.
- * This component is always a link for consistent integration with routing libraries.
- * @example
- * ```tsx
- * import { RawPaginationNext } from '@payfit/unity-components'
- *
- * <RawPaginationNext href="/page/3" isDisabled={currentPage === pageCount}>
- *   Next
- * </RawPaginationNext>
- * ```
- */
-declare const RawPaginationNext: import('react').ForwardRefExoticComponent<RawPaginationNextProps & import('react').RefAttributes<HTMLAnchorElement>>;
-export { RawPaginationNext };

package/dist/esm/components/pagination/parts/RawPaginationNext.js

@@ -1,70 +0,0 @@
-import { jsx as o } from "react/jsx-runtime";
-import { forwardRef as g } from "react";
-import { uyTv as b } from "@payfit/unity-themes";
-import { Link as x } from "react-aria-components/Link";
-import { useIntl as v } from "react-intl";
-import { Icon as w } from "../../icon/Icon.js";
-import { Tooltip as h } from "../../tooltip/Tooltip.js";
-import { usePaginationContext as P } from "../PaginationContext.js";
-const N = b({
-  base: [
-    "uy:min-w-300 uy:h-300 uy:p-25 uy:flex uy:justify-center uy:items-center uy:typography-action uy:rounded-circle uy:transition-colors",
-    "uy:text-content-neutral-lowest uy:enabled:bg-transparent uy:cursor-pointer",
-    "uy:hover:text-content-neutral-hover uy:hover:bg-surface-neutral-lowest-hover",
-    "uy:active:text-content-neutral-pressed uy:active:bg-surface-neutral-lowest-pressed",
-    "uy:data-[pressed=true]:text-content-neutral-pressed uy:data-[pressed=true]:bg-surface-neutral-lowest-pressed",
-    "uy:data-[disabled=true]:text-content-neutral-disabled uy:data-[disabled=true]:bg-transparent uy:data-[disabled=true]:cursor-not-allowed",
-    "uy:focus-visible:outline-2 uy:focus-visible:outline-solid uy:focus-visible:outline-utility-focus-ring uy:focus-visible:outline-offset-2"
-  ]
-}), D = g(
-  ({ isDisabled: i, href: n, onPress: s, ...u }, l) => {
-    const a = v(), {
-      onKeyDown: c,
-      currentPage: e,
-      pageCount: r,
-      onPageChange: y
-    } = P(), t = a.formatMessage({
-      id: "unity:component:common:next",
-      defaultMessage: "Next"
-    }), d = a.formatMessage(
-      {
-        id: "unity:component:pagination:nav-button:description",
-        defaultMessage: "Go to next page"
-      },
-      {
-        variant: t
-      }
-    ), p = (m) => {
-      c(m);
-    }, f = () => {
-      !n && (r === -1 || e < r) && y(e + 1, e, 1);
-    };
-    return /* @__PURE__ */ o(h, { title: t, children: /* @__PURE__ */ o(
-      x,
-      {
-        ref: l,
-        href: n,
-        className: N(),
-        isDisabled: i,
-        onPress: s ?? f,
-        "aria-label": t,
-        "aria-description": d,
-        onKeyDown: p,
-        ...u,
-        children: /* @__PURE__ */ o(
-          w,
-          {
-            src: "CaretRightOutlined",
-            size: 20,
-            color: "inherit",
-            role: "presentation"
-          }
-        )
-      }
-    ) });
-  }
-);
-D.displayName = "RawPaginationNext";
-export {
-  D as RawPaginationNext
-};

package/dist/esm/components/pagination/parts/RawPaginationPrevious.d.ts

@@ -1,22 +0,0 @@
-import { VariantProps } from '@payfit/unity-themes';
-import { LinkProps } from 'react-aria-components/Link';
-declare const paginationNavButton: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, string[], {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, string[], unknown, unknown, undefined>>;
-export interface RawPaginationPreviousProps extends Omit<LinkProps, 'children' | 'className' | 'style' | 'isDisabled' | 'aria-label' | 'title'>, VariantProps<typeof paginationNavButton> {
-    id?: string;
-    isDisabled?: boolean;
-    href?: string;
-}
-/**
- * The RawPaginationPrevious component renders a "Next" link for pagination.
- * This component is always a link for consistent integration with routing libraries.
- * @example
- * ```tsx
- * import { RawPaginationPrevious } from '@payfit/unity-components'
- *
- * <RawPaginationPrevious href="/page/3" isDisabled={currentPage === pageCount}>
- *   Next
- * </RawPaginationPrevious>
- * ```
- */
-declare const RawPaginationPrevious: import('react').ForwardRefExoticComponent<RawPaginationPreviousProps & import('react').RefAttributes<HTMLAnchorElement>>;
-export { RawPaginationPrevious };

package/dist/esm/components/pagination/parts/RawPaginationPrevious.js

@@ -1,67 +0,0 @@
-import { jsx as o } from "react/jsx-runtime";
-import { forwardRef as m } from "react";
-import { uyTv as g } from "@payfit/unity-themes";
-import { Link as v } from "react-aria-components/Link";
-import { useIntl as b } from "react-intl";
-import { Icon as w } from "../../icon/Icon.js";
-import { Tooltip as h } from "../../tooltip/Tooltip.js";
-import { usePaginationContext as x } from "../PaginationContext.js";
-const P = g({
-  base: [
-    "uy:min-w-300 uy:h-300 uy:p-25 uy:flex uy:justify-center uy:items-center uy:typography-action uy:rounded-circle uy:transition-colors",
-    "uy:text-content-neutral-lowest uy:enabled:bg-transparent uy:cursor-pointer",
-    "uy:hover:text-content-neutral-hover uy:hover:bg-surface-neutral-lowest-hover",
-    "uy:active:text-content-neutral-pressed uy:active:bg-surface-neutral-lowest-pressed",
-    "uy:data-[pressed]:text-content-neutral-pressed uy:data-[pressed]:bg-surface-neutral-lowest-pressed",
-    "uy:data-[disabled]:text-content-neutral-disabled uy:data-[disabled]:bg-transparent uy:data-[disabled]:cursor-not-allowed",
-    "uy:focus-visible:outline-2 uy:focus-visible:outline-solid uy:focus-visible:outline-utility-focus-ring uy:focus-visible:outline-offset-2"
-  ]
-}), D = m(({ isDisabled: a, href: n, onPress: s, ...i }, u) => {
-  const r = b(), {
-    onKeyDown: l,
-    currentPage: e,
-    onPageChange: c
-  } = x(), t = r.formatMessage({
-    id: "unity:component:common:previous",
-    defaultMessage: "Previous"
-  }), y = r.formatMessage(
-    {
-      id: "unity:component:pagination:nav-button:description",
-      defaultMessage: "Go to previous page"
-    },
-    {
-      variant: t
-    }
-  ), d = (f) => {
-    l(f);
-  }, p = () => {
-    !n && e > 1 && c(e - 1, e, -1);
-  };
-  return /* @__PURE__ */ o(h, { title: t, children: /* @__PURE__ */ o(
-    v,
-    {
-      ref: u,
-      href: n,
-      className: P(),
-      isDisabled: a,
-      onPress: s ?? p,
-      "aria-label": t,
-      "aria-description": y,
-      onKeyDown: d,
-      ...i,
-      children: /* @__PURE__ */ o(
-        w,
-        {
-          src: "CaretLeftOutlined",
-          size: 20,
-          color: "inherit",
-          role: "presentation"
-        }
-      )
-    }
-  ) });
-});
-D.displayName = "RawPaginationPrevious";
-export {
-  D as RawPaginationPrevious
-};

package/dist/esm/components/pagination/utils/pagination-window.d.ts

@@ -1,8 +0,0 @@
-export type PageItem = {
-    type: 'page';
-    value: number;
-} | {
-    type: 'ellipsis';
-    value: [number, number];
-};
-export declare function generatePaginationWithWindow(pageCount: number, currentPage: number, maxWindowSize: number): PageItem[];

package/dist/esm/components/pagination/utils/pagination-window.js

@@ -1,42 +0,0 @@
-function y(s, l) {
-  return Array.from({ length: l - s + 1 }, (p, t) => t + s).map(
-    (p) => ({
-      type: "page",
-      value: p
-    })
-  );
-}
-const n = 5;
-function d(s, l, p) {
-  const t = Math.max(
-    n,
-    p % 2 === 0 ? p + 1 : p
-  ), h = t - 2;
-  if (s === -1) {
-    const e = [];
-    e.push({ type: "page", value: 1 });
-    const o = h - 1, u = Math.floor(o / 2);
-    return l <= 3 + u ? (e.push(...y(2, t - 1)), e.push({ type: "ellipsis", value: [t, 1 / 0] })) : (e.push({ type: "ellipsis", value: [2, l - u] }), e.push(...y(l - u + 1, l + u)), e.push({
-      type: "ellipsis",
-      value: [l + u + 1, 1 / 0]
-    })), e;
-  }
-  if (s <= t)
-    return Array.from({ length: s }, (e, o) => ({
-      type: "page",
-      value: o + 1
-    }));
-  const i = [];
-  i.push({ type: "page", value: 1 });
-  const v = h - 2, f = Math.floor(v / 2);
-  return l <= 3 + f ? (i.push(...y(2, h)), i.push({ type: "ellipsis", value: [h + 1, s - 1] })) : l >= s - (2 + f) ? (i.push({
-    type: "ellipsis",
-    value: [2, s - (h - 1) - 1]
-  }), i.push(...y(s - (h - 1), s - 1))) : (i.push({ type: "ellipsis", value: [2, l - f - 1] }), i.push(...y(l - f, l + f)), i.push({
-    type: "ellipsis",
-    value: [l + f + 1, s - 1]
-  })), i.push({ type: "page", value: s }), i;
-}
-export {
-  d as generatePaginationWithWindow
-};

package/dist/esm/components/password-field/TanstackPasswordField.d.ts

@@ -1,113 +0,0 @@
-import { ReactNode } from 'react';
-import { LabelProps } from '../label/Label.js';
-import { PasswordInputProps } from './parts/PasswordInput.js';
-import { PasswordRule } from './types.js';
-export interface TanstackPasswordFieldProps extends Omit<PasswordInputProps, 'name' | 'value' | 'defaultValue' | 'isInvalid'>, Pick<LabelProps, 'isRequired' | 'requiredVariant'> {
-    /** Label for the password field */
-    label: string;
-    /** Helper text below the label */
-    helperText?: ReactNode;
-    /** Title for the validation rules section (default: "Your password must have:") */
-    rulesTitle?: ReactNode;
-    /** Array of password rules to display - status is controlled by consumer */
-    rules?: PasswordRule[];
-    /** A contextual link to display below the text field. */
-    contextualLink?: ReactNode;
-    /** Callback function to be called when the clear button is pressed */
-    onClearButtonPress?: () => void;
-}
-/**
- * The `TanstackPasswordField` component provides a complete password input solution with visibility toggle,
- * validation rules display, and caps lock detection, fully integrated with TanStack Form.
- *
- * Use this component to collect password input with real-time validation feedback. The component displays
- * a list of password requirements that update dynamically as users type, helping them create passwords
- * that meet your security criteria.
- *
- * The component acts as a **presentation layer only**. Define all validation logic externally using
- * TanStack Form validators, then pass the evaluated rule statuses to the component for display.
- *
- * **Key features:**
- * - Password visibility toggle for showing/hiding entered text
- * - Real-time validation rules display with checked/unchecked visual feedback
- * - Caps Lock warning indicator to prevent accidental input mistakes
- * - Full accessibility support with ARIA labels and keyboard navigation
- * - Integration with TanStack Form for validation and state management
- * - Contextual link support for "Forgot password?" or similar actions
- *
- * **Important props:**
- * - `label` — Required text label for the field
- * - `rules` — Array of password rules with their validation status (you control the logic)
- * - `helperText` — Optional helper text displayed below the label
- * - `rulesTitle` — Custom title for the rules section (defaults to "Your password must have:")
- * - `showCapsLockWarning` — Enable/disable caps lock detection (default: true)
- * - `autoComplete` — Browser autocomplete hint: 'current-password' or 'new-password'
- * - `contextualLink` — Optional link element (e.g., "Forgot password?")
- * @param {TanstackPasswordFieldProps} props - Component properties
- * @example
- * ```tsx
- * import { useTanstackUnityForm, fieldRevalidateLogic } from '@payfit/unity-components'
- * import { z } from 'zod'
- *
- * function PasswordForm() {
- *   const ruleDefs = [
- *     {
- *       id: 'length',
- *       label: 'At least 10 characters',
- *       validate: (value: string) => value.length >= 10
- *     }
- *   ]
- *
- *   const form = useTanstackUnityForm({
- *     defaultValues: { password: '' },
- *     validationLogic: fieldRevalidateLogic({
- *       whenPristine: 'blur',
- *       whenDirty: 'change',
- *       fields: ['password'],
- *     })
- *   })
- *
- *   return (
- *     <form.AppForm>
- *       <form.Form>
- *         <form.AppField name="password">
- *           {(field) => {
- *             const rules = ruleDefs.map(rule => ({
- *               id: rule.id,
- *               label: rule.label,
- *               status: rule.validate(field.state.value) ? 'checked' : 'unchecked'
- *             }))
- *
- *             return (
- *               <field.PasswordField
- *                 label="Create Password"
- *                 rules={rules}
- *                 isRequired
- *               />
- *             )
- *           }}
- *         </form.AppField>
- *       </form.Form>
- *     </form.AppForm>
- *   )
- * }
- * ```
- * @remarks
- * - Access the component via `<field.PasswordField>` within `<form.AppField name="...">` scope
- * - Do not pass `name`, `value`, or `isInvalid` props — these are managed by TanStack Form context
- * - The `rules` prop is purely presentational — compute rule statuses in your component and pass them in
- * - For async validation (e.g., checking password breaches), use TanStack Form's `onDynamicAsync` validator
- * - Use `autoComplete="current-password"` for login forms and `autoComplete="new-password"` for registration
- * - **New to password fields?** See the step-by-step tutorial in the developer docs
- * - **Want to understand the architecture?** Read the validation guide in the developer docs
- * @see {@link TanstackPasswordFieldProps} for all available props
- * @see {@link useTanstackUnityForm} for form setup and validation
- * @see Tutorial: Adding Password Field with Validation in the developer docs
- * @see Guide: Understanding Password Field Validation in the developer docs
- * @see Source code in {@link https://github.com/PayFit/hr-apps/tree/master/libs/shared/unity/components/src/components/password-field GitHub}
- * @see Design specs in {@link https://www.figma.com/design/poaMyU7abAgL9VRhx4ygyy/Unity-DS-%3E-Components-Library Figma}
- * @see Design docs at {@link https://www.payfit.design/ Payfit.design}
- * @see Developer docs at {@link https://unity-components.payfit.io/?path=/docs/forms-reference-passwordfield--docs unity-components.payfit.io}
- */
-declare const TanstackPasswordField: import('react').ForwardRefExoticComponent<TanstackPasswordFieldProps & import('react').RefAttributes<HTMLInputElement>>;
-export { TanstackPasswordField };

package/dist/esm/components/password-field/TanstackPasswordField.js

@@ -1,83 +0,0 @@
-import { jsxs as I, jsx as e } from "react/jsx-runtime";
-import { forwardRef as B } from "react";
-import { useIntl as R } from "react-intl";
-import { useFieldContext as b } from "../../hooks/tanstack-form-context.js";
-import { TanstackFormFeedbackText as j } from "../form-field/parts/TanstackFormFeedbackText.js";
-import { TanstackFormHelperText as y } from "../form-field/parts/TanstackFormHelperText.js";
-import { TanstackFormLabel as M } from "../form-field/parts/TanstackFormLabel.js";
-import { TanstackFormField as V } from "../form-field/TanstackFormField.js";
-import { PasswordFieldDetails as D } from "./parts/PasswordFieldDetails.js";
-import { PasswordInput as H } from "./parts/PasswordInput.js";
-function L({
-  label: r,
-  helperText: s,
-  rulesTitle: i,
-  rules: o,
-  contextualLink: l,
-  isRequired: n,
-  requiredVariant: m,
-  isLoading: d,
-  isDisabled: c,
-  isReadOnly: u,
-  showCapsLockWarning: f,
-  autoComplete: p,
-  onBlur: F,
-  onFocus: h,
-  onChange: T,
-  onClearButtonPress: k,
-  ...w
-}, g) {
-  const P = R(), t = b(), x = t.state.meta.isTouched && !t.state.meta.isValid, v = o && o.length > 0, C = P.formatMessage({
-    id: "unity:component:password-field:rules-title",
-    defaultMessage: "Your password must have:"
-  });
-  return /* @__PURE__ */ I(V, { children: [
-    /* @__PURE__ */ e(
-      M,
-      {
-        requiredVariant: m,
-        isRequired: n,
-        children: r
-      }
-    ),
-    s && /* @__PURE__ */ e(y, { children: s }),
-    /* @__PURE__ */ e(
-      H,
-      {
-        ...w,
-        ref: g,
-        value: t.state.value,
-        onChange: (a) => {
-          t.handleChange(a.target.value), T?.(a);
-        },
-        onBlur: (a) => {
-          t.handleBlur(), F?.(a);
-        },
-        onFocus: h,
-        isLoading: d,
-        isDisabled: c,
-        isReadOnly: u,
-        isInvalid: x,
-        showCapsLockWarning: f,
-        autoComplete: p,
-        onClearButtonPress: () => {
-          t.setValue(""), k?.();
-        }
-      }
-    ),
-    /* @__PURE__ */ e(j, {}),
-    v && /* @__PURE__ */ e(
-      D,
-      {
-        title: i ?? C,
-        rules: o
-      }
-    ),
-    l
-  ] });
-}
-const N = B(L);
-N.displayName = "TanstackPasswordField";
-export {
-  N as TanstackPasswordField
-};

package/dist/esm/components/password-field/hooks/use-caps-lock.d.ts

@@ -1,5 +0,0 @@
-/**
- * Hook to detect when Caps Lock is enabled
- * @returns boolean indicating if Caps Lock is currently enabled
- */
-export declare function useCapsLock(): boolean;

package/dist/esm/components/password-field/hooks/use-caps-lock.js

@@ -1,12 +0,0 @@
-import { useState as s, useCallback as r, useEffect as i } from "react";
-function d() {
-  const [n, t] = s(!1), e = r((o) => {
-    t(o.getModifierState("CapsLock"));
-  }, []);
-  return i(() => (window.addEventListener("keydown", e), window.addEventListener("keyup", e), () => {
-    window.removeEventListener("keydown", e), window.removeEventListener("keyup", e);
-  }), [e]), n;
-}
-export {
-  d as useCapsLock
-};