@skdx/react 0.26.0

package/dist/form/FormControl.d.ts

@@ -0,0 +1,20 @@
+import * as React from 'react';
+import type { FormControlProps } from './types.js';
+/**
+ * Injects `id`, `name`, `aria-invalid`, and `aria-describedby` (pointing at
+ * the field's `FormMessage`) onto its single child input, using
+ * {@link Slot} so no extra DOM element is added. Must be rendered inside a
+ * `FormField`, and typically inside a `Form` so validity is tracked. Renders
+ * `aria-invalid`/`aria-describedby` only once the field has failed native
+ * constraint validation.
+ *
+ * @example
+ * ```tsx
+ * <FormField name="email">
+ *   <FormControl>
+ *     <input type="email" required />
+ *   </FormControl>
+ * </FormField>
+ * ```
+ */
+export declare const FormControl: React.ForwardRefExoticComponent<FormControlProps & React.RefAttributes<HTMLElement>>;

package/dist/form/FormErrorSummary.d.cts

@@ -0,0 +1,30 @@
+import * as React from 'react';
+import type { FormErrorSummaryProps } from './types.cjs';
+/**
+ * The GOV.UK error summary for a {@link Form}: a `role="alert"` container
+ * listing one in-page link per currently-failing `Field`, focused the first
+ * time it appears so a keyboard or screen-reader user lands on the errors
+ * rather than back at the top of the page.
+ *
+ * It keeps no field registry. It scans its form for
+ * `[data-skdx-field][data-invalid]` and re-scans whenever a Field's bubbling
+ * `validity-change` event reaches it, so any Field anywhere in the form is
+ * listed without registering itself. Clicking a link focuses that field's
+ * control — or, when the field is a group, the first control *inside* the
+ * group, which is the GOV.UK rule.
+ *
+ * Rendered (empty and `hidden`) even with nothing to report, so the alert
+ * fires when its content appears.
+ *
+ * @example
+ * ```tsx
+ * <Form onSubmit={save}>
+ *   <FormErrorSummary>
+ *     <h2>There is a problem</h2>
+ *   </FormErrorSummary>
+ *   <Field validate={required}>…</Field>
+ *   <FormSubmit>Save</FormSubmit>
+ * </Form>
+ * ```
+ */
+export declare const FormErrorSummary: React.ForwardRefExoticComponent<Omit<FormErrorSummaryProps, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/dist/form/FormErrorSummary.d.ts

@@ -0,0 +1,30 @@
+import * as React from 'react';
+import type { FormErrorSummaryProps } from './types.js';
+/**
+ * The GOV.UK error summary for a {@link Form}: a `role="alert"` container
+ * listing one in-page link per currently-failing `Field`, focused the first
+ * time it appears so a keyboard or screen-reader user lands on the errors
+ * rather than back at the top of the page.
+ *
+ * It keeps no field registry. It scans its form for
+ * `[data-skdx-field][data-invalid]` and re-scans whenever a Field's bubbling
+ * `validity-change` event reaches it, so any Field anywhere in the form is
+ * listed without registering itself. Clicking a link focuses that field's
+ * control — or, when the field is a group, the first control *inside* the
+ * group, which is the GOV.UK rule.
+ *
+ * Rendered (empty and `hidden`) even with nothing to report, so the alert
+ * fires when its content appears.
+ *
+ * @example
+ * ```tsx
+ * <Form onSubmit={save}>
+ *   <FormErrorSummary>
+ *     <h2>There is a problem</h2>
+ *   </FormErrorSummary>
+ *   <Field validate={required}>…</Field>
+ *   <FormSubmit>Save</FormSubmit>
+ * </Form>
+ * ```
+ */
+export declare const FormErrorSummary: React.ForwardRefExoticComponent<Omit<FormErrorSummaryProps, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/dist/form/FormField.d.cts

@@ -0,0 +1,25 @@
+import * as React from 'react';
+import type { FormFieldContextValue, FormFieldProps } from './types.cjs';
+export declare const FormFieldProvider: {
+    (props: FormFieldContextValue & {
+        children: React.ReactNode;
+    }): React.JSX.Element;
+    displayName: string;
+}, useFormFieldContext: (consumerName: string) => FormFieldContextValue;
+/**
+ * Groups one field's `FormLabel`, `FormControl`, and `FormMessage`(s),
+ * generating the shared `id`/`messageId` pair and distributing them plus
+ * `name` via context. Renders a plain `<div>`.
+ *
+ * @example
+ * ```tsx
+ * <FormField name="username">
+ *   <FormLabel>Username</FormLabel>
+ *   <FormControl>
+ *     <input required />
+ *   </FormControl>
+ *   <FormMessage>Username is required.</FormMessage>
+ * </FormField>
+ * ```
+ */
+export declare const FormField: React.ForwardRefExoticComponent<Omit<FormFieldProps, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/dist/form/FormField.d.ts

@@ -0,0 +1,25 @@
+import * as React from 'react';
+import type { FormFieldContextValue, FormFieldProps } from './types.js';
+export declare const FormFieldProvider: {
+    (props: FormFieldContextValue & {
+        children: React.ReactNode;
+    }): React.JSX.Element;
+    displayName: string;
+}, useFormFieldContext: (consumerName: string) => FormFieldContextValue;
+/**
+ * Groups one field's `FormLabel`, `FormControl`, and `FormMessage`(s),
+ * generating the shared `id`/`messageId` pair and distributing them plus
+ * `name` via context. Renders a plain `<div>`.
+ *
+ * @example
+ * ```tsx
+ * <FormField name="username">
+ *   <FormLabel>Username</FormLabel>
+ *   <FormControl>
+ *     <input required />
+ *   </FormControl>
+ *   <FormMessage>Username is required.</FormMessage>
+ * </FormField>
+ * ```
+ */
+export declare const FormField: React.ForwardRefExoticComponent<Omit<FormFieldProps, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/dist/form/FormLabel.d.cts

@@ -0,0 +1,18 @@
+import * as React from 'react';
+import type { FormLabelProps } from './types.cjs';
+/**
+ * A `<label>` for a {@link FormField}'s control. Reads the field's `id` from
+ * context and sets `htmlFor` to it, so it must be rendered inside a
+ * `FormField` alongside a `FormControl`.
+ *
+ * @example
+ * ```tsx
+ * <FormField name="email">
+ *   <FormLabel>Email</FormLabel>
+ *   <FormControl>
+ *     <input type="email" />
+ *   </FormControl>
+ * </FormField>
+ * ```
+ */
+export declare const FormLabel: React.ForwardRefExoticComponent<Omit<FormLabelProps, "ref"> & React.RefAttributes<HTMLLabelElement>>;

package/dist/form/FormLabel.d.ts

@@ -0,0 +1,18 @@
+import * as React from 'react';
+import type { FormLabelProps } from './types.js';
+/**
+ * A `<label>` for a {@link FormField}'s control. Reads the field's `id` from
+ * context and sets `htmlFor` to it, so it must be rendered inside a
+ * `FormField` alongside a `FormControl`.
+ *
+ * @example
+ * ```tsx
+ * <FormField name="email">
+ *   <FormLabel>Email</FormLabel>
+ *   <FormControl>
+ *     <input type="email" />
+ *   </FormControl>
+ * </FormField>
+ * ```
+ */
+export declare const FormLabel: React.ForwardRefExoticComponent<Omit<FormLabelProps, "ref"> & React.RefAttributes<HTMLLabelElement>>;

package/dist/form/FormMessage.d.cts

@@ -0,0 +1,21 @@
+import * as React from 'react';
+import type { FormMessageProps } from './types.cjs';
+/**
+ * A validation message for a {@link FormField}, rendered as a `<span>` whose
+ * `id` matches the field's `aria-describedby`. Renders nothing until either
+ * `forceMatch` is set, or the field has a validity snapshot that matches:
+ * with `match`, only when that specific `ValidityState` flag (e.g.
+ * `valueMissing`) is true; without it, whenever the field is invalid at all.
+ *
+ * @example
+ * ```tsx
+ * <FormField name="email">
+ *   <FormControl>
+ *     <input type="email" required />
+ *   </FormControl>
+ *   <FormMessage match="valueMissing">Email is required.</FormMessage>
+ *   <FormMessage match="typeMismatch">Enter a valid email.</FormMessage>
+ * </FormField>
+ * ```
+ */
+export declare const FormMessage: React.ForwardRefExoticComponent<Omit<FormMessageProps, "ref"> & React.RefAttributes<HTMLSpanElement>>;

package/dist/form/FormMessage.d.ts

@@ -0,0 +1,21 @@
+import * as React from 'react';
+import type { FormMessageProps } from './types.js';
+/**
+ * A validation message for a {@link FormField}, rendered as a `<span>` whose
+ * `id` matches the field's `aria-describedby`. Renders nothing until either
+ * `forceMatch` is set, or the field has a validity snapshot that matches:
+ * with `match`, only when that specific `ValidityState` flag (e.g.
+ * `valueMissing`) is true; without it, whenever the field is invalid at all.
+ *
+ * @example
+ * ```tsx
+ * <FormField name="email">
+ *   <FormControl>
+ *     <input type="email" required />
+ *   </FormControl>
+ *   <FormMessage match="valueMissing">Email is required.</FormMessage>
+ *   <FormMessage match="typeMismatch">Enter a valid email.</FormMessage>
+ * </FormField>
+ * ```
+ */
+export declare const FormMessage: React.ForwardRefExoticComponent<Omit<FormMessageProps, "ref"> & React.RefAttributes<HTMLSpanElement>>;

package/dist/form/FormSubmit.d.cts

@@ -0,0 +1,14 @@
+import * as React from 'react';
+import type { FormSubmitProps } from './types.cjs';
+/**
+ * A `type="submit"` button for a {@link Form}. No context reads — submitting
+ * triggers the form's native `checkValidity()` pass.
+ *
+ * @example
+ * ```tsx
+ * <Form onSubmit={(e) => console.log('submitted')}>
+ *   <FormSubmit>Submit</FormSubmit>
+ * </Form>
+ * ```
+ */
+export declare const FormSubmit: React.ForwardRefExoticComponent<Omit<FormSubmitProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;

package/dist/form/FormSubmit.d.ts

@@ -0,0 +1,14 @@
+import * as React from 'react';
+import type { FormSubmitProps } from './types.js';
+/**
+ * A `type="submit"` button for a {@link Form}. No context reads — submitting
+ * triggers the form's native `checkValidity()` pass.
+ *
+ * @example
+ * ```tsx
+ * <Form onSubmit={(e) => console.log('submitted')}>
+ *   <FormSubmit>Submit</FormSubmit>
+ * </Form>
+ * ```
+ */
+export declare const FormSubmit: React.ForwardRefExoticComponent<Omit<FormSubmitProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;

package/dist/form/index.d.cts

@@ -0,0 +1,8 @@
+export * from './Form.cjs';
+export { FormField } from './FormField.cjs';
+export { FormLabel } from './FormLabel.cjs';
+export { FormControl } from './FormControl.cjs';
+export { FormMessage } from './FormMessage.cjs';
+export { FormSubmit } from './FormSubmit.cjs';
+export { FormErrorSummary } from './FormErrorSummary.cjs';
+export type { FormProps, FormFieldProps, FormLabelProps, FormControlProps, FormMessageProps, FormSubmitProps, FormErrorSummaryProps, } from './types.cjs';

package/dist/form/index.d.ts

@@ -0,0 +1,8 @@
+export * from './Form.js';
+export { FormField } from './FormField.js';
+export { FormLabel } from './FormLabel.js';
+export { FormControl } from './FormControl.js';
+export { FormMessage } from './FormMessage.js';
+export { FormSubmit } from './FormSubmit.js';
+export { FormErrorSummary } from './FormErrorSummary.js';
+export type { FormProps, FormFieldProps, FormLabelProps, FormControlProps, FormMessageProps, FormSubmitProps, FormErrorSummaryProps, } from './types.js';

package/dist/form/types.d.cts

@@ -0,0 +1,76 @@
+import type * as React from 'react';
+import type { PrimitivePropsWithRef } from '../utils/primitive.cjs';
+import type { SlotProps } from '../utils/slot.cjs';
+/**
+ * A plain-object mirror of the native `ValidityState` for one field, as
+ * captured by {@link Form} after a `checkValidity()`/`invalid`/`blur`/`change`
+ * pass. Used by {@link FormMessage}'s `match` prop to target a specific
+ * failure reason.
+ */
+export interface ValiditySnapshot {
+    badInput: boolean;
+    customError: boolean;
+    patternMismatch: boolean;
+    rangeOverflow: boolean;
+    rangeUnderflow: boolean;
+    stepMismatch: boolean;
+    tooLong: boolean;
+    tooShort: boolean;
+    typeMismatch: boolean;
+    valueMissing: boolean;
+    valid: boolean;
+}
+/** @internal Per-field validity snapshots distributed from {@link Form} to its descendants via context. Not part of the public API. */
+export interface FormContextValue {
+    validities: Record<string, ValiditySnapshot | undefined>;
+}
+/** Props for the {@link Form} root. */
+export interface FormProps extends Omit<PrimitivePropsWithRef<'form'>, 'onSubmit'> {
+    /**
+     * Fires on submit only once every field passes native constraint validation.
+     * @default undefined — no-op if omitted.
+     */
+    onSubmit?: (event: React.FormEvent<HTMLFormElement>) => void;
+}
+/** @internal Field identity distributed from {@link FormField} to its descendants via context. Not part of the public API. */
+export interface FormFieldContextValue {
+    name: string;
+    id: string;
+    messageId: string;
+}
+/** Props for {@link FormField}, a per-field grouping of label, control, and message. */
+export interface FormFieldProps extends PrimitivePropsWithRef<'div'> {
+    /** Field name, matched against the `name` attribute of the native input rendered inside `FormControl`. */
+    name: string;
+}
+/** Props for {@link FormLabel}, a label wired to its `FormField`'s control. */
+export interface FormLabelProps extends PrimitivePropsWithRef<'label'> {
+}
+/** Props for {@link FormControl}, which injects field attributes onto its single child input. */
+export interface FormControlProps extends SlotProps {
+}
+/** Props for {@link FormMessage}, a conditionally-rendered validation message. */
+export interface FormMessageProps extends PrimitivePropsWithRef<'span'> {
+    /**
+     * Which `ValidityState` flag to show this message for; omit to match any invalid state.
+     * @default undefined — matches any invalid state.
+     */
+    match?: keyof ValiditySnapshot;
+    /**
+     * Always render regardless of native validity — for async/server errors.
+     * @default false
+     */
+    forceMatch?: boolean;
+}
+/** Props for {@link FormSubmit}, a `type="submit"` button. */
+export interface FormSubmitProps extends PrimitivePropsWithRef<'button'> {
+}
+/** Props for {@link FormErrorSummary}, the GOV.UK error summary for a form's `Field`s. */
+export interface FormErrorSummaryProps extends Omit<PrimitivePropsWithRef<'div'>, 'autoFocus'> {
+    /**
+     * Focus the summary the first time it appears. Turn it off when your own
+     * routing or scroll restoration already moves focus.
+     * @default true
+     */
+    autoFocus?: boolean;
+}

package/dist/form/types.d.ts

@@ -0,0 +1,76 @@
+import type * as React from 'react';
+import type { PrimitivePropsWithRef } from '../utils/primitive.js';
+import type { SlotProps } from '../utils/slot.js';
+/**
+ * A plain-object mirror of the native `ValidityState` for one field, as
+ * captured by {@link Form} after a `checkValidity()`/`invalid`/`blur`/`change`
+ * pass. Used by {@link FormMessage}'s `match` prop to target a specific
+ * failure reason.
+ */
+export interface ValiditySnapshot {
+    badInput: boolean;
+    customError: boolean;
+    patternMismatch: boolean;
+    rangeOverflow: boolean;
+    rangeUnderflow: boolean;
+    stepMismatch: boolean;
+    tooLong: boolean;
+    tooShort: boolean;
+    typeMismatch: boolean;
+    valueMissing: boolean;
+    valid: boolean;
+}
+/** @internal Per-field validity snapshots distributed from {@link Form} to its descendants via context. Not part of the public API. */
+export interface FormContextValue {
+    validities: Record<string, ValiditySnapshot | undefined>;
+}
+/** Props for the {@link Form} root. */
+export interface FormProps extends Omit<PrimitivePropsWithRef<'form'>, 'onSubmit'> {
+    /**
+     * Fires on submit only once every field passes native constraint validation.
+     * @default undefined — no-op if omitted.
+     */
+    onSubmit?: (event: React.FormEvent<HTMLFormElement>) => void;
+}
+/** @internal Field identity distributed from {@link FormField} to its descendants via context. Not part of the public API. */
+export interface FormFieldContextValue {
+    name: string;
+    id: string;
+    messageId: string;
+}
+/** Props for {@link FormField}, a per-field grouping of label, control, and message. */
+export interface FormFieldProps extends PrimitivePropsWithRef<'div'> {
+    /** Field name, matched against the `name` attribute of the native input rendered inside `FormControl`. */
+    name: string;
+}
+/** Props for {@link FormLabel}, a label wired to its `FormField`'s control. */
+export interface FormLabelProps extends PrimitivePropsWithRef<'label'> {
+}
+/** Props for {@link FormControl}, which injects field attributes onto its single child input. */
+export interface FormControlProps extends SlotProps {
+}
+/** Props for {@link FormMessage}, a conditionally-rendered validation message. */
+export interface FormMessageProps extends PrimitivePropsWithRef<'span'> {
+    /**
+     * Which `ValidityState` flag to show this message for; omit to match any invalid state.
+     * @default undefined — matches any invalid state.
+     */
+    match?: keyof ValiditySnapshot;
+    /**
+     * Always render regardless of native validity — for async/server errors.
+     * @default false
+     */
+    forceMatch?: boolean;
+}
+/** Props for {@link FormSubmit}, a `type="submit"` button. */
+export interface FormSubmitProps extends PrimitivePropsWithRef<'button'> {
+}
+/** Props for {@link FormErrorSummary}, the GOV.UK error summary for a form's `Field`s. */
+export interface FormErrorSummaryProps extends Omit<PrimitivePropsWithRef<'div'>, 'autoFocus'> {
+    /**
+     * Focus the summary the first time it appears. Turn it off when your own
+     * routing or scroll restoration already moves focus.
+     * @default true
+     */
+    autoFocus?: boolean;
+}

package/dist/hover-card/HoverCard.cjs

@@ -0,0 +1 @@
+"use strict";var _=Object.create;var R=Object.defineProperty;var $=Object.getOwnPropertyDescriptor;var j=Object.getOwnPropertyNames;var ee=Object.getPrototypeOf,oe=Object.prototype.hasOwnProperty;var re=(e,r)=>{for(var o in r)R(e,o,{get:r[o],enumerable:!0})},N=(e,r,o,p)=>{if(r&&typeof r=="object"||typeof r=="function")for(let s of j(r))!oe.call(e,s)&&s!==o&&R(e,s,{get:()=>r[s],enumerable:!(p=$(r,s))||p.enumerable});return e};var g=(e,r,o)=>(o=e!=null?_(ee(e)):{},N(r||!e||!e.__esModule?R(o,"default",{value:e,enumerable:!0}):o,e)),te=e=>N(R({},"__esModule",{value:!0}),e);var ne={};re(ne,{HoverCard:()=>M,HoverCardArrow:()=>I,HoverCardContent:()=>E,HoverCardPortal:()=>y,HoverCardRootProvider:()=>A,HoverCardTrigger:()=>x,useHoverCardContext:()=>f});module.exports=te(ne);var t=g(require("react"),1),b=require("../utils/createContext.cjs"),k=require("../utils/part.cjs"),H=require("../utils/popper.cjs"),F=require("../utils/useControllableState.cjs"),O=require("../utils/useOpenChangeComplete.cjs"),P=require("react/jsx-runtime"),[A,f]=(0,b.createSafeContext)("HoverCard");function M({children:e,open:r,defaultOpen:o=!1,onOpenChange:p,onOpenChangeComplete:s,openDelay:l=700,closeDelay:C=300}){let m=t.useRef(null),u=t.useRef(null),n=t.useRef(!1),v=t.useRef(0),a=t.useRef(0),[w=!1,c]=(0,F.useControllableState)({prop:r,defaultProp:o,onChange:p});(0,O.useOpenChangeComplete)(w,u,s);let i=t.useCallback(()=>{window.clearTimeout(v.current),window.clearTimeout(a.current)},[]);t.useEffect(()=>i,[i]);let X=t.useCallback(()=>{i(),c(!0)},[i,c]),Y=t.useCallback(()=>{i(),c(!1)},[i,c]),Z=t.useCallback(()=>{i(),v.current=window.setTimeout(()=>c(!0),l)},[i,c,l]),L=t.useCallback(()=>{i(),a.current=window.setTimeout(()=>c(!1),C)},[i,c,C]);return(0,P.jsx)(H.PopperRoot,{children:(0,P.jsx)(A,{contentId:t.useId(),open:w,triggerRef:m,contentRef:u,ignoreNextFocusRef:n,onOpen:X,onClose:Y,onTriggerEnter:Z,onTriggerLeave:L,onContentEnter:i,onContentLeave:L,children:e})})}M.displayName="HoverCard";var I=t.forwardRef((e,r)=>(0,P.jsx)(H.PopperArrow,{...e,...(0,k.skdxPart)("hover-card","arrow",e.className),ref:r}));I.displayName="HoverCardArrow";var D=g(require("react"),1),S=require("../utils/composeRefs.cjs"),B=require("../utils/part.cjs"),V=require("../utils/popper.cjs"),d=require("../utils/primitive.cjs");var T=require("react/jsx-runtime"),x=D.forwardRef((e,r)=>{let o=f("HoverCardTrigger"),p=(0,S.useComposedRefs)(r,o.triggerRef);return(0,T.jsx)(V.PopperAnchor,{asChild:!0,children:(0,T.jsx)(d.Primitive.a,{"aria-describedby":o.open?o.contentId:void 0,"data-state":o.open?"open":"closed",...e,...(0,B.skdxPart)("hover-card","trigger",e.className),ref:p,onPointerEnter:(0,d.composeEventHandlers)(e.onPointerEnter,s=>{s.pointerType!=="touch"&&o.onTriggerEnter()}),onPointerLeave:(0,d.composeEventHandlers)(e.onPointerLeave,s=>{s.pointerType!=="touch"&&o.onTriggerLeave()}),onFocus:(0,d.composeEventHandlers)(e.onFocus,()=>{if(o.ignoreNextFocusRef.current){o.ignoreNextFocusRef.current=!1;return}o.onOpen()}),onBlur:(0,d.composeEventHandlers)(e.onBlur,o.onClose)})})});x.displayName="HoverCardTrigger";var W=require("../utils/portal.cjs");var K=require("react/jsx-runtime"),y=({forceMount:e,children:r,...o})=>{let p=f("HoverCardPortal");return e||p.open?(0,K.jsx)(W.Portal,{...o,children:r}):null};y.displayName="HoverCardPortal";var q=g(require("react"),1),z=require("../utils/composeRefs.cjs"),G=require("../utils/part.cjs"),J=require("../utils/popper.cjs"),h=require("../utils/primitive.cjs"),Q=require("../utils/useDismiss.cjs");var U=require("react/jsx-runtime"),E=q.forwardRef(({forceMount:e,side:r="bottom",sideOffset:o=4,onEscapeKeyDown:p,onPointerDownOutside:s,onFocusOutside:l,onInteractOutside:C,...m},u)=>{let n=f("HoverCardContent"),v=(0,z.useComposedRefs)(u,n.contentRef);return(0,Q.useDismiss)({enabled:n.open,onEscapeKeyDown:a=>{p?.(a),a.defaultPrevented||(n.onClose(),n.ignoreNextFocusRef.current=!0,n.triggerRef.current?.focus())},onInteractOutside:C,onPointerDownOutside:a=>{s?.(a),a.defaultPrevented||n.onClose()},onFocusOutside:a=>{l?.(a),a.defaultPrevented||n.onClose()}},[n.triggerRef,n.contentRef]),e||n.open?(0,U.jsx)(J.PopperContent,{component:"hover-card",id:n.contentId,"data-state":n.open?"open":"closed",side:r,sideOffset:o,...m,...(0,G.skdxPart)("hover-card","content",m.className),ref:v,onPointerEnter:(0,h.composeEventHandlers)(m.onPointerEnter,a=>{a.pointerType!=="touch"&&n.onContentEnter()}),onPointerLeave:(0,h.composeEventHandlers)(m.onPointerLeave,a=>{a.pointerType!=="touch"&&n.onContentLeave()})}):null});E.displayName="HoverCardContent";0&&(module.exports={HoverCard,HoverCardArrow,HoverCardContent,HoverCardPortal,HoverCardRootProvider,HoverCardTrigger,useHoverCardContext});

package/dist/hover-card/HoverCard.d.cts

@@ -0,0 +1,55 @@
+import * as React from 'react';
+import type { PrimitivePropsWithRef } from '../utils/primitive.cjs';
+import type { HoverCardContextValue, HoverCardProps } from './types.cjs';
+export declare const HoverCardRootProvider: {
+    (props: HoverCardContextValue & {
+        children: React.ReactNode;
+    }): React.JSX.Element;
+    displayName: string;
+}, useHoverCardContext: (consumerName: string) => HoverCardContextValue;
+/**
+ * Root of a hover-revealed preview card (e.g. a user profile preview behind
+ * a link): owns open state with independent open/close delays and hands it
+ * down to `HoverCardTrigger` / `HoverCardPortal` / `HoverCardContent` /
+ * `HoverCardArrow` via context. Wraps children in the shared popper
+ * positioning root. Renders no DOM element itself.
+ *
+ * Unlike `Tooltip`, the pointer can move from the trigger onto the content
+ * itself without the card closing — `HoverCardContent` cancels the close
+ * timer on pointer-enter. Escape closes the card and returns focus to the
+ * trigger: `HoverCardContent` listens for it on the document while open, so a
+ * card opened by hover is dismissable even when keyboard focus is elsewhere
+ * (WCAG 2.2 SC 1.4.13). Works controlled (`open` + `onOpenChange`) or
+ * uncontrolled (`defaultOpen`).
+ *
+ * @example
+ * ```tsx
+ * <HoverCard>
+ *   <HoverCardTrigger href="/users/kent">@kentcdodds</HoverCardTrigger>
+ *   <HoverCardPortal>
+ *     <HoverCardContent>
+ *       <p>Kent C. Dodds</p>
+ *       <HoverCardArrow />
+ *     </HoverCardContent>
+ *   </HoverCardPortal>
+ * </HoverCard>
+ * ```
+ */
+export declare function HoverCard({ children, open: openProp, defaultOpen, onOpenChange, onOpenChangeComplete, openDelay, closeDelay, }: HoverCardProps): React.JSX.Element;
+export declare namespace HoverCard {
+    var displayName: string;
+}
+/**
+ * Optional visual arrow pointing from `HoverCardContent` back at the
+ * trigger. Must be rendered inside `HoverCardContent`; self-positions based
+ * on the resolved `side`.
+ *
+ * @example
+ * ```tsx
+ * <HoverCardContent>
+ *   <p>Kent C. Dodds</p>
+ *   <HoverCardArrow />
+ * </HoverCardContent>
+ * ```
+ */
+export declare const HoverCardArrow: React.ForwardRefExoticComponent<Omit<PrimitivePropsWithRef<"span">, "ref"> & React.RefAttributes<HTMLSpanElement>>;

package/dist/hover-card/HoverCard.d.ts

@@ -0,0 +1,55 @@
+import * as React from 'react';
+import type { PrimitivePropsWithRef } from '../utils/primitive.js';
+import type { HoverCardContextValue, HoverCardProps } from './types.js';
+export declare const HoverCardRootProvider: {
+    (props: HoverCardContextValue & {
+        children: React.ReactNode;
+    }): React.JSX.Element;
+    displayName: string;
+}, useHoverCardContext: (consumerName: string) => HoverCardContextValue;
+/**
+ * Root of a hover-revealed preview card (e.g. a user profile preview behind
+ * a link): owns open state with independent open/close delays and hands it
+ * down to `HoverCardTrigger` / `HoverCardPortal` / `HoverCardContent` /
+ * `HoverCardArrow` via context. Wraps children in the shared popper
+ * positioning root. Renders no DOM element itself.
+ *
+ * Unlike `Tooltip`, the pointer can move from the trigger onto the content
+ * itself without the card closing — `HoverCardContent` cancels the close
+ * timer on pointer-enter. Escape closes the card and returns focus to the
+ * trigger: `HoverCardContent` listens for it on the document while open, so a
+ * card opened by hover is dismissable even when keyboard focus is elsewhere
+ * (WCAG 2.2 SC 1.4.13). Works controlled (`open` + `onOpenChange`) or
+ * uncontrolled (`defaultOpen`).
+ *
+ * @example
+ * ```tsx
+ * <HoverCard>
+ *   <HoverCardTrigger href="/users/kent">@kentcdodds</HoverCardTrigger>
+ *   <HoverCardPortal>
+ *     <HoverCardContent>
+ *       <p>Kent C. Dodds</p>
+ *       <HoverCardArrow />
+ *     </HoverCardContent>
+ *   </HoverCardPortal>
+ * </HoverCard>
+ * ```
+ */
+export declare function HoverCard({ children, open: openProp, defaultOpen, onOpenChange, onOpenChangeComplete, openDelay, closeDelay, }: HoverCardProps): React.JSX.Element;
+export declare namespace HoverCard {
+    var displayName: string;
+}
+/**
+ * Optional visual arrow pointing from `HoverCardContent` back at the
+ * trigger. Must be rendered inside `HoverCardContent`; self-positions based
+ * on the resolved `side`.
+ *
+ * @example
+ * ```tsx
+ * <HoverCardContent>
+ *   <p>Kent C. Dodds</p>
+ *   <HoverCardArrow />
+ * </HoverCardContent>
+ * ```
+ */
+export declare const HoverCardArrow: React.ForwardRefExoticComponent<Omit<PrimitivePropsWithRef<"span">, "ref"> & React.RefAttributes<HTMLSpanElement>>;

package/dist/hover-card/HoverCard.js

@@ -0,0 +1 @@
+import*as e from"react";import{createSafeContext as k}from"../utils/createContext.js";import{skdxPart as F}from"../utils/part.js";import{PopperArrow as O,PopperRoot as A}from"../utils/popper.js";import{useControllableState as M}from"../utils/useControllableState.js";import{useOpenChangeComplete as I}from"../utils/useOpenChangeComplete.js";import{jsx as R}from"react/jsx-runtime";var[D,d]=k("HoverCard");function S({children:t,open:s,defaultOpen:o=!1,onOpenChange:p,onOpenChangeComplete:c,openDelay:m=700,closeDelay:l=300}){let f=e.useRef(null),C=e.useRef(null),r=e.useRef(!1),u=e.useRef(0),n=e.useRef(0),[P=!1,i]=M({prop:s,defaultProp:o,onChange:p});I(P,C,c);let a=e.useCallback(()=>{window.clearTimeout(u.current),window.clearTimeout(n.current)},[]);e.useEffect(()=>a,[a]);let L=e.useCallback(()=>{a(),i(!0)},[a,i]),N=e.useCallback(()=>{a(),i(!1)},[a,i]),b=e.useCallback(()=>{a(),u.current=window.setTimeout(()=>i(!0),m)},[a,i,m]),H=e.useCallback(()=>{a(),n.current=window.setTimeout(()=>i(!1),l)},[a,i,l]);return R(A,{children:R(D,{contentId:e.useId(),open:P,triggerRef:f,contentRef:C,ignoreNextFocusRef:r,onOpen:L,onClose:N,onTriggerEnter:b,onTriggerLeave:H,onContentEnter:a,onContentLeave:H,children:t})})}S.displayName="HoverCard";var B=e.forwardRef((t,s)=>R(O,{...t,...F("hover-card","arrow",t.className),ref:s}));B.displayName="HoverCardArrow";import*as T from"react";import{useComposedRefs as V}from"../utils/composeRefs.js";import{skdxPart as W}from"../utils/part.js";import{PopperAnchor as K}from"../utils/popper.js";import{composeEventHandlers as v,Primitive as q}from"../utils/primitive.js";import{jsx as g}from"react/jsx-runtime";var x=T.forwardRef((t,s)=>{let o=d("HoverCardTrigger"),p=V(s,o.triggerRef);return g(K,{asChild:!0,children:g(q.a,{"aria-describedby":o.open?o.contentId:void 0,"data-state":o.open?"open":"closed",...t,...W("hover-card","trigger",t.className),ref:p,onPointerEnter:v(t.onPointerEnter,c=>{c.pointerType!=="touch"&&o.onTriggerEnter()}),onPointerLeave:v(t.onPointerLeave,c=>{c.pointerType!=="touch"&&o.onTriggerLeave()}),onFocus:v(t.onFocus,()=>{if(o.ignoreNextFocusRef.current){o.ignoreNextFocusRef.current=!1;return}o.onOpen()}),onBlur:v(t.onBlur,o.onClose)})})});x.displayName="HoverCardTrigger";import{Portal as z}from"../utils/portal.js";import{jsx as G}from"react/jsx-runtime";var y=({forceMount:t,children:s,...o})=>{let p=d("HoverCardPortal");return t||p.open?G(z,{...o,children:s}):null};y.displayName="HoverCardPortal";import*as E from"react";import{useComposedRefs as J}from"../utils/composeRefs.js";import{skdxPart as Q}from"../utils/part.js";import{PopperContent as U}from"../utils/popper.js";import{composeEventHandlers as h}from"../utils/primitive.js";import{useDismiss as X}from"../utils/useDismiss.js";import{jsx as Y}from"react/jsx-runtime";var w=E.forwardRef(({forceMount:t,side:s="bottom",sideOffset:o=4,onEscapeKeyDown:p,onPointerDownOutside:c,onFocusOutside:m,onInteractOutside:l,...f},C)=>{let r=d("HoverCardContent"),u=J(C,r.contentRef);return X({enabled:r.open,onEscapeKeyDown:n=>{p?.(n),n.defaultPrevented||(r.onClose(),r.ignoreNextFocusRef.current=!0,r.triggerRef.current?.focus())},onInteractOutside:l,onPointerDownOutside:n=>{c?.(n),n.defaultPrevented||r.onClose()},onFocusOutside:n=>{m?.(n),n.defaultPrevented||r.onClose()}},[r.triggerRef,r.contentRef]),t||r.open?Y(U,{component:"hover-card",id:r.contentId,"data-state":r.open?"open":"closed",side:s,sideOffset:o,...f,...Q("hover-card","content",f.className),ref:u,onPointerEnter:h(f.onPointerEnter,n=>{n.pointerType!=="touch"&&r.onContentEnter()}),onPointerLeave:h(f.onPointerLeave,n=>{n.pointerType!=="touch"&&r.onContentLeave()})}):null});w.displayName="HoverCardContent";export{S as HoverCard,B as HoverCardArrow,w as HoverCardContent,y as HoverCardPortal,D as HoverCardRootProvider,x as HoverCardTrigger,d as useHoverCardContext};

package/dist/hover-card/HoverCardContent.d.cts

@@ -0,0 +1,27 @@
+import * as React from 'react';
+import type { HoverCardContentProps } from './types.cjs';
+/**
+ * The card's floating panel, `data-state` (`open`/`closed`), positioned via
+ * the shared popper layer against the trigger using `side` (defaults to
+ * `'bottom'`) / `align` / `sideOffset` (defaults to `4`) / `alignOffset`,
+ * flipping/shifting to avoid viewport collisions unless `avoidCollisions` is
+ * `false`. Also exposes `data-side`/`data-align` reflecting the resolved
+ * placement. Entering the content with the pointer cancels the pending close
+ * timer; leaving it reschedules the close. Closes on Escape or on an outside
+ * interaction: pointer-down outside or focus moving outside, each reported to
+ * `onPointerDownOutside`/`onFocusOutside` and, just before them and with the
+ * same event, to `onInteractOutside`. Any of those (or `onEscapeKeyDown`)
+ * calling `event.preventDefault()` keeps it open. Mounts only while open
+ * unless `forceMount` is set.
+ *
+ * @example
+ * ```tsx
+ * <HoverCardPortal>
+ *   <HoverCardContent side="bottom" align="start">
+ *     <p>Kent C. Dodds</p>
+ *     <HoverCardArrow />
+ *   </HoverCardContent>
+ * </HoverCardPortal>
+ * ```
+ */
+export declare const HoverCardContent: React.ForwardRefExoticComponent<Omit<HoverCardContentProps, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/dist/hover-card/HoverCardContent.d.ts

@@ -0,0 +1,27 @@
+import * as React from 'react';
+import type { HoverCardContentProps } from './types.js';
+/**
+ * The card's floating panel, `data-state` (`open`/`closed`), positioned via
+ * the shared popper layer against the trigger using `side` (defaults to
+ * `'bottom'`) / `align` / `sideOffset` (defaults to `4`) / `alignOffset`,
+ * flipping/shifting to avoid viewport collisions unless `avoidCollisions` is
+ * `false`. Also exposes `data-side`/`data-align` reflecting the resolved
+ * placement. Entering the content with the pointer cancels the pending close
+ * timer; leaving it reschedules the close. Closes on Escape or on an outside
+ * interaction: pointer-down outside or focus moving outside, each reported to
+ * `onPointerDownOutside`/`onFocusOutside` and, just before them and with the
+ * same event, to `onInteractOutside`. Any of those (or `onEscapeKeyDown`)
+ * calling `event.preventDefault()` keeps it open. Mounts only while open
+ * unless `forceMount` is set.
+ *
+ * @example
+ * ```tsx
+ * <HoverCardPortal>
+ *   <HoverCardContent side="bottom" align="start">
+ *     <p>Kent C. Dodds</p>
+ *     <HoverCardArrow />
+ *   </HoverCardContent>
+ * </HoverCardPortal>
+ * ```
+ */
+export declare const HoverCardContent: React.ForwardRefExoticComponent<Omit<HoverCardContentProps, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/dist/hover-card/HoverCardPortal.d.cts

@@ -0,0 +1,20 @@
+import type { HoverCardPortalProps } from './types.cjs';
+/**
+ * Teleports `HoverCardContent` to `document.body` (or a custom `container`),
+ * so the card escapes any clipping/`overflow` ancestors. Mounts only while
+ * open unless `forceMount` is set.
+ *
+ * @example
+ * ```tsx
+ * <HoverCard>
+ *   <HoverCardTrigger href="/users/kent">@kentcdodds</HoverCardTrigger>
+ *   <HoverCardPortal>
+ *     <HoverCardContent>…</HoverCardContent>
+ *   </HoverCardPortal>
+ * </HoverCard>
+ * ```
+ */
+export declare const HoverCardPortal: {
+    ({ forceMount, children, ...props }: HoverCardPortalProps): import("react").JSX.Element | null;
+    displayName: string;
+};