@krelborn/stylesui 0.0.0-stage → 0.8.1

package/dist/components/Textarea/Textarea.js

@@ -0,0 +1,12 @@
+import { TextControl as e } from "../TextControl/TextControl.js";
+import { jsx as t } from "react/jsx-runtime";
+//#region src/components/Textarea/Textarea.tsx
+function n({ size: n = "md", ...r }) {
+	return /* @__PURE__ */ t(e, {
+		...r,
+		as: "textarea",
+		size: n
+	});
+}
+//#endregion
+export { n as Textarea };

package/dist/components/Textarea/index.d.ts

@@ -0,0 +1,2 @@
+export { Textarea } from "./Textarea";
+export type { TextareaProps } from "./Textarea";

package/dist/components/Theme/Theme.d.ts

@@ -0,0 +1,46 @@
+import type { JSX } from "react";
+import type { BoxElement, BoxProps } from "../Box";
+/**
+ * Names of the themes shipped in `styles.css`
+ */
+export type ThemeName = "default" | "playful";
+/**
+ * Colour mode; `system` follows the operating system preference
+ */
+export type ThemeMode = "dark" | "light" | "system";
+/**
+ * Names of the colour palettes shipped in `styles.css`
+ */
+export type PaletteName = "bright" | "dusk" | "mist" | "paper" | "pop";
+interface ThemeOwnProps {
+    /**
+     * Colour mode for this subtree. Inherited from the nearest ancestor when omitted.
+     */
+    mode?: ThemeMode;
+    /**
+     * Colour palette for this subtree. Defaults to the theme's companion palette on an element that sets `theme`, and
+     * is inherited from the nearest ancestor otherwise.
+     */
+    palette?: PaletteName;
+    /**
+     * Theme for this subtree. Inherited from the nearest ancestor when omitted.
+     */
+    theme?: ThemeName;
+}
+/**
+ * Props for `Theme`: its own props plus every prop supported by the element given in `as`
+ */
+export type ThemeProps<E extends BoxElement = "div"> = ThemeOwnProps & Omit<BoxProps<E>, keyof ThemeOwnProps>;
+/**
+ * Sets the theme, palette and colour mode attributes for its subtree. `styles.css` paints the
+ * background, text colour and font of any element that carries these attributes, so this needs
+ * `@krelborn/stylesui/styles.css` imported once by the app.
+ *
+ * @example
+ * <Theme mode="dark" theme="playful">...</Theme>
+ *
+ * @example
+ * <Theme palette="pop" theme="default">...</Theme>
+ */
+export declare function Theme<E extends BoxElement = "div">({ as, mode, palette, theme, ...rest }: ThemeProps<E>): JSX.Element;
+export {};

package/dist/components/Theme/Theme.js

@@ -0,0 +1,18 @@
+import { Box as e } from "../Box/Box.js";
+import { c as t } from "react/compiler-runtime";
+import { jsx as n } from "react/jsx-runtime";
+//#region src/components/Theme/Theme.tsx
+function r(r) {
+	let i = t(12), a, o, s, c, l;
+	i[0] === r ? (a = i[1], o = i[2], s = i[3], c = i[4], l = i[5]) : ({as: a, mode: o, palette: s, theme: l, ...c} = r, i[0] = r, i[1] = a, i[2] = o, i[3] = s, i[4] = c, i[5] = l);
+	let u = c, d = a, f;
+	return i[6] !== u || i[7] !== o || i[8] !== s || i[9] !== d || i[10] !== l ? (f = /* @__PURE__ */ n(e, {
+		...u,
+		as: d,
+		"data-sui-mode": o,
+		"data-sui-palette": s,
+		"data-sui-theme": l
+	}), i[6] = u, i[7] = o, i[8] = s, i[9] = d, i[10] = l, i[11] = f) : f = i[11], f;
+}
+//#endregion
+export { r as Theme };

package/dist/components/Theme/index.d.ts

@@ -0,0 +1,2 @@
+export { Theme } from "./Theme";
+export type { PaletteName, ThemeMode, ThemeName, ThemeProps } from "./Theme";

package/dist/components/Tooltip/Tooltip.css

@@ -0,0 +1 @@
+.sui-tooltip-UA7H9{max-inline-size:var(--sui-tooltip-max-width,20rem);padding:var(--sui-space-1,.25rem) var(--sui-space-2,.5rem);border-radius:var(--sui-radius-md,4px);background-color:var(--sui-color-tooltip,#111827);box-shadow:var(--sui-shadow-sm,0 1px 3px #0000001f);color:var(--sui-color-on-tooltip,#fff);font-family:var(--sui-font-body,system-ui, sans-serif);font-size:var(--sui-font-size-sm,.875rem);line-height:var(--sui-line-height-normal,1.5);transition:opacity .12s ease-out}@starting-style{.sui-tooltip-UA7H9{opacity:0}}@media (prefers-reduced-motion:reduce){.sui-tooltip-UA7H9{transition:none}}

package/dist/components/Tooltip/Tooltip.d.ts

@@ -0,0 +1,49 @@
+import type { JSX, PointerEventHandler } from "react";
+import type { OverlayPlacement } from "../../overlays";
+import type { BoxProps } from "../Box";
+/**
+ * Props `getOverlayProps` from `useTooltip` returns, which every `Tooltip` takes
+ */
+export interface TooltipOverlayProps {
+    /**
+     * `anchor-name` of the trigger the tooltip is positioned against. From `getOverlayProps`.
+     */
+    anchorName: string;
+    /**
+     * The tooltip's id, which the trigger's `aria-describedby` or `aria-labelledby` points at. From `getOverlayProps`.
+     */
+    id: string;
+    /**
+     * Keeps the tooltip open while the pointer is over it. From `getOverlayProps`.
+     */
+    onPointerEnter?: PointerEventHandler<HTMLElement>;
+    /**
+     * Hides the tooltip after the hide delay once the pointer leaves it. From `getOverlayProps`.
+     */
+    onPointerLeave?: PointerEventHandler<HTMLElement>;
+    /**
+     * Whether the tooltip is shown. From `getOverlayProps`.
+     */
+    open: boolean;
+    /**
+     * Side of the trigger the tooltip opens on. From `getOverlayProps`.
+     */
+    placement: OverlayPlacement;
+}
+/**
+ * Props for `Tooltip`: the props `getOverlayProps` returns plus every `span` prop except `popover`, `ref` and `role`
+ */
+export interface TooltipProps extends TooltipOverlayProps, Omit<BoxProps<"span">, "as" | "popover" | "ref" | "role" | keyof TooltipOverlayProps> {
+}
+/**
+ * Short text shown beside the element it belongs to while the pointer rests on that element or it has keyboard
+ * focus. `useTooltip` connects the two: spread `getTriggerProps()` on the element and `getOverlayProps()` on the
+ * tooltip, inside the same `Theme`. A tooltip holds text only, nothing interactive.
+ *
+ * @example
+ * const tooltip = useTooltip();
+ *
+ * <Button {...tooltip.getTriggerProps()}>Publish</Button>
+ * <Tooltip {...tooltip.getOverlayProps()}>Sends to all subscribers</Tooltip>
+ */
+export declare function Tooltip({ className, ...rest }: TooltipProps): JSX.Element;

package/dist/components/Tooltip/Tooltip.js

@@ -0,0 +1,22 @@
+import { Overlay as e } from "../Overlay/Overlay.js";
+import t from "./Tooltip.module.js";
+import { clsx as n } from "clsx";
+import { c as r } from "react/compiler-runtime";
+import { jsx as i } from "react/jsx-runtime";
+//#region src/components/Tooltip/Tooltip.tsx
+function a(a) {
+	let o = r(8), s, c;
+	o[0] === a ? (s = o[1], c = o[2]) : ({className: s, ...c} = a, o[0] = a, o[1] = s, o[2] = c);
+	let l;
+	o[3] === s ? l = o[4] : (l = n(t.tooltip, s), o[3] = s, o[4] = l);
+	let u;
+	return o[5] !== c || o[6] !== l ? (u = /* @__PURE__ */ i(e, {
+		...c,
+		as: "span",
+		className: l,
+		popover: "manual",
+		role: "tooltip"
+	}), o[5] = c, o[6] = l, o[7] = u) : u = o[7], u;
+}
+//#endregion
+export { a as Tooltip };

package/dist/components/Tooltip/Tooltip.module.js

@@ -0,0 +1,4 @@
+import './Tooltip.css';//#region src/components/Tooltip/Tooltip.module.css
+var e = "sui-tooltip-UA7H9", t = { tooltip: e };
+//#endregion
+export { t as default, e as tooltip };

package/dist/components/Tooltip/index.d.ts

@@ -0,0 +1,4 @@
+export { Tooltip } from "./Tooltip";
+export type { TooltipProps } from "./Tooltip";
+export { useTooltip } from "./useTooltip";
+export type { TooltipRelationship, UseTooltipOptions, UseTooltipResult } from "./useTooltip";

package/dist/components/Tooltip/tooltipCoordinator.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Records a tooltip as the one open tooltip, hiding the tooltip that was open before it
+ *
+ * @param id the claiming tooltip's id
+ * @param hide hides the claiming tooltip when a later tooltip claims
+ * @returns releases the claim; call it when the tooltip closes or unmounts
+ */
+export declare function claimTooltip(id: string, hide: () => void): () => void;
+/**
+ * Whether a tooltip opening now should skip its show delay
+ *
+ * @returns true while a tooltip is open, and for 300ms after the last one closes
+ */
+export declare function isTooltipWarm(): boolean;

package/dist/components/Tooltip/tooltipCoordinator.js

@@ -0,0 +1,17 @@
+//#region src/components/Tooltip/tooltipCoordinator.ts
+var e = null, t = -Infinity;
+function n(n, r) {
+	e !== null && e.id !== n && e.hide();
+	let i = {
+		hide: r,
+		id: n
+	};
+	return e = i, () => {
+		e === i && (e = null, t = Date.now());
+	};
+}
+function r() {
+	return e !== null || Date.now() - t < 300;
+}
+//#endregion
+export { n as claimTooltip, r as isTooltipWarm };

package/dist/components/Tooltip/useTooltip.d.ts

@@ -0,0 +1,119 @@
+import type { CSSProperties, FocusEventHandler, MouseEventHandler, PointerEventHandler } from "react";
+import type { OverlayDelay, OverlayPlacement } from "../../overlays";
+import type { TooltipOverlayProps } from "./Tooltip";
+/**
+ * Whether a tooltip names its trigger or describes it
+ */
+export type TooltipRelationship = "description" | "label";
+/**
+ * Options for `useTooltip`
+ */
+export interface UseTooltipOptions {
+    /**
+     * Whether the tooltip starts open when uncontrolled. Defaults to `false`.
+     */
+    defaultOpen?: boolean;
+    /**
+     * Show and hide delays. Defaults to 400ms to show and 150ms to hide; an omitted field keeps its default. A hide
+     * delay too short for the pointer to cross from the trigger to the tooltip hides the tooltip on the way.
+     */
+    delay?: OverlayDelay;
+    /**
+     * Called with the requested open state whenever the tooltip asks to open or close
+     */
+    onOpenChange?: (open: boolean) => void;
+    /**
+     * Controls whether the tooltip is open. The hook then only reports through `onOpenChange`.
+     */
+    open?: boolean;
+    /**
+     * Side of the trigger the tooltip opens on. It flips to the opposite side when there is no room. Defaults to `top`.
+     */
+    placement?: OverlayPlacement;
+    /**
+     * `label` makes the tooltip the trigger's accessible name, for a trigger with no text of its own, and
+     * `description` adds it as the trigger's description. Defaults to `description`.
+     */
+    relationship?: TooltipRelationship;
+}
+/**
+ * Props `getTriggerProps` sets on the trigger
+ */
+interface TooltipTriggerProps {
+    /**
+     * The tooltip's id when it describes the trigger
+     */
+    "aria-describedby"?: string;
+    /**
+     * The tooltip's id when it names the trigger
+     */
+    "aria-labelledby"?: string;
+    /**
+     * Hides the tooltip
+     */
+    onBlur: FocusEventHandler<HTMLElement>;
+    /**
+     * Hides the tooltip when the keyboard presses the trigger
+     */
+    onClick: MouseEventHandler<HTMLElement>;
+    /**
+     * Shows the tooltip when focus arrives from the keyboard
+     */
+    onFocus: FocusEventHandler<HTMLElement>;
+    /**
+     * Hides the tooltip
+     */
+    onPointerDown: PointerEventHandler<HTMLElement>;
+    /**
+     * Shows the tooltip after the show delay, for a mouse or pen
+     */
+    onPointerEnter: PointerEventHandler<HTMLElement>;
+    /**
+     * Cancels a pending show and hides the tooltip after the hide delay, for a mouse or pen, unless keyboard focus
+     * opened the tooltip and it is still open
+     */
+    onPointerLeave: PointerEventHandler<HTMLElement>;
+    /**
+     * Names the trigger as the tooltip's anchor
+     */
+    style: CSSProperties;
+}
+/**
+ * Prop getters for a tooltip's trigger and the `Tooltip`, and whether the tooltip is open
+ */
+export interface UseTooltipResult {
+    /**
+     * Returns the props to spread on the `Tooltip`, merged with any given
+     */
+    getOverlayProps: <Props extends object>(props?: Props & Partial<TooltipOverlayProps>) => Omit<Props, keyof TooltipOverlayProps> & TooltipOverlayProps;
+    /**
+     * Returns the props to spread on the trigger, merged with any given: where both set a handler, both run, the given
+     * one first; the tooltip's id comes before any given `aria-describedby` or `aria-labelledby` ids; and `style`
+     * objects merge
+     */
+    getTriggerProps: <Props extends object>(props?: Props & Partial<TooltipTriggerProps>) => Omit<Props, keyof TooltipTriggerProps> & TooltipTriggerProps;
+    /**
+     * Whether the tooltip is open
+     */
+    open: boolean;
+}
+/**
+ * Connects a `Tooltip` to the element it belongs to. Spread `getTriggerProps()` on that element and
+ * `getOverlayProps()` on the `Tooltip`. The tooltip opens after the show delay when a mouse or pen rests on the
+ * trigger and at once when the trigger takes keyboard focus, or once the popover has closed when closing a popover
+ * returns keyboard focus to the trigger. It stays open while the pointer is over the tooltip, and hides after the hide
+ * delay once the pointer leaves both, or at once on blur, on Escape and when the trigger is pressed. A tooltip that
+ * keyboard focus opened stays open when the pointer leaves, until blur or Escape. Only one tooltip is open at a time,
+ * and while one is open, or for 300ms after it closes, the next opens without its show delay.
+ *
+ * @param options open state, delays, placement and how the tooltip relates to its trigger
+ * @returns prop getters for the trigger and the `Tooltip`, and whether the tooltip is open
+ *
+ * @example
+ * const tooltip = useTooltip({ relationship: "label" });
+ *
+ * <Button {...tooltip.getTriggerProps()}><CopyIcon /></Button>
+ * <Tooltip {...tooltip.getOverlayProps()}>Copy link</Tooltip>
+ */
+export declare function useTooltip({ defaultOpen, delay, onOpenChange, open: controlledOpen, placement, relationship, }?: UseTooltipOptions): UseTooltipResult;
+export {};

package/dist/components/Tooltip/useTooltip.js

@@ -0,0 +1,74 @@
+import { mergeProps as e } from "../../overlays/mergeProps.js";
+import { useOverlay as t } from "../../overlays/useOverlay.js";
+import { claimTooltip as n, isTooltipWarm as r } from "./tooltipCoordinator.js";
+import { useEffect as i, useEffectEvent as a, useRef as o } from "react";
+//#region src/components/Tooltip/useTooltip.ts
+var s = {
+	hide: 150,
+	show: 400
+};
+function c({ defaultOpen: c = !1, delay: u, onOpenChange: d, open: f, placement: p = "top", relationship: m = "description" } = {}) {
+	let h = t({
+		defaultOpen: c,
+		delay: {
+			hide: u?.hide ?? s.hide,
+			show: u?.show ?? s.show
+		},
+		onOpenChange: d,
+		open: f
+	}), g = o(!1), _ = a(() => h.hide()), { id: v, open: y } = h;
+	i(() => {
+		if (y) return n(v, () => _());
+	}, [v, y]), i(() => {
+		y || (g.current = !1);
+	}, [y]);
+	function b(e) {
+		e.pointerType !== "touch" && (r() ? h.show() : h.showAfterDelay());
+	}
+	function x(e) {
+		e.pointerType !== "touch" && !(g.current && y) && h.hideAfterDelay();
+	}
+	function S(e) {
+		g.current = e.currentTarget.matches(":focus-visible"), g.current && (l(e) ? h.showAfterTask() : h.show());
+	}
+	function C() {
+		g.current = !1, h.hide();
+	}
+	function w(e) {
+		e.detail === 0 && h.hide();
+	}
+	let T = {
+		anchorName: h.anchorName,
+		id: h.id,
+		onPointerEnter: h.cancelDelay,
+		onPointerLeave: x,
+		open: h.open,
+		placement: p
+	}, E = {
+		...m === "label" ? { "aria-labelledby": h.id } : { "aria-describedby": h.id },
+		onBlur: C,
+		onClick: w,
+		onFocus: S,
+		onPointerDown: h.hide,
+		onPointerEnter: b,
+		onPointerLeave: x,
+		style: { anchorName: h.anchorName }
+	};
+	function D(t) {
+		return e(t, T);
+	}
+	function O(t) {
+		return e(t, E);
+	}
+	return {
+		getOverlayProps: D,
+		getTriggerProps: O,
+		open: h.open
+	};
+}
+function l(e) {
+	let t = e.relatedTarget instanceof Element ? e.relatedTarget.closest("[popover]") : null;
+	return t !== null && !t.matches(":popover-open");
+}
+//#endregion
+export { c as useTooltip };

package/dist/components/VisuallyHidden/VisuallyHidden.css

@@ -0,0 +1 @@
+.sui-visuallyHidden-KiAzg{clip-path:inset(50%);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}

package/dist/components/VisuallyHidden/VisuallyHidden.d.ts

@@ -0,0 +1,14 @@
+import type { JSX } from "react";
+import type { BoxElement, BoxProps } from "../Box";
+/**
+ * Props for `VisuallyHidden`: every prop supported by the element given in `as`
+ */
+export type VisuallyHiddenProps<E extends BoxElement = "span"> = BoxProps<E>;
+/**
+ * Hides its content from view while keeping it in the accessibility tree, for text that only
+ * assistive technology needs, such as the name of an icon-only button
+ *
+ * @example
+ * <Button><span aria-hidden={true}>×</span><VisuallyHidden>Close</VisuallyHidden></Button>
+ */
+export declare function VisuallyHidden<E extends BoxElement = "span">({ as, className, ...rest }: VisuallyHiddenProps<E>): JSX.Element;

package/dist/components/VisuallyHidden/VisuallyHidden.js

@@ -0,0 +1,20 @@
+import { Box as e } from "../Box/Box.js";
+import t from "./VisuallyHidden.module.js";
+import { clsx as n } from "clsx";
+import { c as r } from "react/compiler-runtime";
+import { jsx as i } from "react/jsx-runtime";
+//#region src/components/VisuallyHidden/VisuallyHidden.tsx
+function a(a) {
+	let o = r(10), s, c, l;
+	o[0] === a ? (s = o[1], c = o[2], l = o[3]) : ({as: s, className: c, ...l} = a, o[0] = a, o[1] = s, o[2] = c, o[3] = l);
+	let u = l, d = s ?? "span", f;
+	o[4] === c ? f = o[5] : (f = n(t.visuallyHidden, c), o[4] = c, o[5] = f);
+	let p;
+	return o[6] !== u || o[7] !== d || o[8] !== f ? (p = /* @__PURE__ */ i(e, {
+		...u,
+		as: d,
+		className: f
+	}), o[6] = u, o[7] = d, o[8] = f, o[9] = p) : p = o[9], p;
+}
+//#endregion
+export { a as VisuallyHidden };

package/dist/components/VisuallyHidden/VisuallyHidden.module.js

@@ -0,0 +1,4 @@
+import './VisuallyHidden.css';//#region src/components/VisuallyHidden/VisuallyHidden.module.css
+var e = "sui-visuallyHidden-KiAzg", t = { visuallyHidden: e };
+//#endregion
+export { t as default, e as visuallyHidden };

package/dist/components/VisuallyHidden/index.d.ts

@@ -0,0 +1,2 @@
+export { VisuallyHidden } from "./VisuallyHidden";
+export type { VisuallyHiddenProps } from "./VisuallyHidden";

package/dist/errors/MissingContextError.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Thrown when a part of a compound component renders outside the component that provides its state
+ */
+export declare class MissingContextError extends Error {
+    readonly name = "MissingContextError";
+    /**
+     * @param part the part that rendered, such as `Tab`
+     * @param provider the component it must render inside, such as `Tabs`
+     */
+    constructor(part: string, provider: string);
+}

package/dist/errors/MissingContextError.js

@@ -0,0 +1,9 @@
+//#region src/errors/MissingContextError.ts
+var e = class extends Error {
+	name = "MissingContextError";
+	constructor(e, t) {
+		super(`${e} must be rendered inside ${t}`);
+	}
+};
+//#endregion
+export { e as MissingContextError };

package/dist/errors/PopoverRefusedError.d.ts

@@ -0,0 +1,12 @@
+/**
+ * Thrown when the browser refuses to show or hide a popover, even once it has finished showing or hiding another
+ */
+export declare class PopoverRefusedError extends Error {
+    readonly name = "PopoverRefusedError";
+    /**
+     * @param popover the popover the browser refused
+     * @param open whether the browser was asked to show the popover rather than hide it
+     * @param cause the browser's refusal
+     */
+    constructor(popover: HTMLElement, open: boolean, cause: DOMException);
+}

package/dist/errors/PopoverRefusedError.js

@@ -0,0 +1,9 @@
+//#region src/errors/PopoverRefusedError.ts
+var e = class extends Error {
+	name = "PopoverRefusedError";
+	constructor(e, t, n) {
+		super(`The browser refused to ${t ? "show" : "hide"} the popover with id "${e.id}"`, { cause: n });
+	}
+};
+//#endregion
+export { e as PopoverRefusedError };

package/dist/errors/index.d.ts

@@ -0,0 +1,2 @@
+export { MissingContextError } from "./MissingContextError";
+export { PopoverRefusedError } from "./PopoverRefusedError";

package/dist/forms/ControlSize.d.ts

@@ -0,0 +1,4 @@
+/**
+ * Height of a form control, matching the `Button` sizes
+ */
+export type ControlSize = "sm" | "md" | "lg";

package/dist/forms/FieldContext.d.ts

@@ -0,0 +1,29 @@
+/**
+ * State a `Field` shares with the control it holds
+ */
+export interface FieldContextValue {
+    /**
+     * The `id` the control must render, so the label points at it
+     */
+    controlId: string;
+    /**
+     * Space-separated ids of the description and error, or undefined when the field renders neither
+     */
+    describedBy: string | undefined;
+    /**
+     * Whether the field disables its control
+     */
+    disabled: boolean;
+    /**
+     * Whether the field shows an error for its control
+     */
+    invalid: boolean;
+    /**
+     * Whether the control must be filled in
+     */
+    required: boolean;
+}
+/**
+ * Carries a `Field`'s state to its control; null when the control is not inside a `Field`
+ */
+export declare const FieldContext: import("react").Context<FieldContextValue | null>;

package/dist/forms/FieldContext.js

@@ -0,0 +1,5 @@
+import { createContext as e } from "react";
+//#region src/forms/FieldContext.ts
+var t = e(null);
+//#endregion
+export { t as FieldContext };

package/dist/forms/RadioGroupContext.d.ts

@@ -0,0 +1,34 @@
+/**
+ * State a `RadioGroup` shares with the radios it holds
+ */
+interface RadioGroupContextValue {
+    /**
+     * The value selected at first when the group is uncontrolled, or undefined when the group sets none
+     */
+    defaultValue: string | undefined;
+    /**
+     * Whether the group shows an error, which each radio draws on its own box
+     */
+    invalid: boolean;
+    /**
+     * The `name` every radio renders, so the browser lets only one of them be selected
+     */
+    name: string;
+    /**
+     * Called with the value of the radio the user selects, after that radio's own `onChange`
+     */
+    onValueChange: ((value: string) => void) | undefined;
+    /**
+     * Whether one radio must be selected, which each radio renders as the native `required`
+     */
+    required: boolean;
+    /**
+     * The value selected when the group is controlled, or undefined when the group is uncontrolled
+     */
+    value: string | undefined;
+}
+/**
+ * Carries a `RadioGroup`'s state to its radios; null when a radio is not inside a `RadioGroup`
+ */
+export declare const RadioGroupContext: import("react").Context<RadioGroupContextValue | null>;
+export {};

package/dist/forms/RadioGroupContext.js

@@ -0,0 +1,5 @@
+import { createContext as e } from "react";
+//#region src/forms/RadioGroupContext.ts
+var t = e(null);
+//#endregion
+export { t as RadioGroupContext };

package/dist/forms/hasContent.d.ts

@@ -0,0 +1,10 @@
+import type { ReactNode } from "react";
+/**
+ * Tells whether a node holds a value other than an empty one, so an empty `description` or `error` slot can be
+ * skipped
+ *
+ * @param node the node to check
+ * @returns false for `undefined`, `null`, a boolean, an empty string, and an array or fragment holding only those;
+ *   otherwise true, including for a component that renders nothing
+ */
+export declare function hasContent(node: ReactNode): boolean;

package/dist/forms/hasContent.js

@@ -0,0 +1,7 @@
+import { Fragment as e, isValidElement as t } from "react";
+//#region src/forms/hasContent.ts
+function n(r) {
+	return Array.isArray(r) ? r.some(n) : t(r) && r.type === e ? n(r.props.children) : r != null && typeof r != "boolean" && r !== "";
+}
+//#endregion
+export { n as hasContent };

package/dist/forms/index.d.ts

@@ -0,0 +1,8 @@
+export type { ControlSize } from "./ControlSize";
+export { FieldContext } from "./FieldContext";
+export type { FieldContextValue } from "./FieldContext";
+export { hasContent } from "./hasContent";
+export { RadioGroupContext } from "./RadioGroupContext";
+export { useFieldControl } from "./useFieldControl";
+export type { FieldControlProps } from "./useFieldControl";
+export { useRadioGroupItem } from "./useRadioGroupItem";

package/dist/forms/useFieldControl.d.ts

@@ -0,0 +1,36 @@
+import type { AriaAttributes } from "react";
+/**
+ * The props a form control passes to `useFieldControl` and renders from what it returns
+ */
+export interface FieldControlProps {
+    /**
+     * Ids of the elements that describe the control, separated by spaces
+     */
+    "aria-describedby"?: AriaAttributes["aria-describedby"];
+    /**
+     * Whether the control's value fails validation
+     */
+    "aria-invalid"?: AriaAttributes["aria-invalid"];
+    /**
+     * Whether the control is disabled
+     */
+    disabled?: boolean;
+    /**
+     * The control's `id`, which a label points at
+     */
+    id?: string;
+    /**
+     * Whether the control must be filled in
+     */
+    required?: boolean;
+}
+/**
+ * Merges the state of the surrounding `Field` into a form control's own props
+ *
+ * @param props the control's own `aria-describedby`, `aria-invalid`, `disabled`, `id` and `required`
+ * @returns the props to render on the control. Outside a `Field` they are the given props. Inside one, the
+ *   field's control id replaces the control's own `id`, the field's description and error ids come before the
+ *   control's own `aria-describedby`, and the control's own `aria-invalid`, `disabled` and `required` win over
+ *   the field's, which are left absent rather than false.
+ */
+export declare function useFieldControl({ "aria-describedby": ownDescribedBy, "aria-invalid": ownInvalid, disabled: ownDisabled, id: ownId, required: ownRequired, }: FieldControlProps): FieldControlProps;