ionbase-ui 0.84.0 → 0.86.0

package/dist/components/Checkbox.d.ts

@@ -1,4 +1,5 @@
 import React from 'react';
+import { type FieldsetOrientation } from './Fieldset.js';
 import { type SelectionProps } from './resolve-selection.js';
 export type CheckboxSize = 'sm' | 'md' | 'lg';
 export type CheckboxIntent = 'brand' | 'neutral' | 'danger';
@@ -34,4 +35,42 @@ export interface CheckboxProps extends Omit<React.InputHTMLAttributes<HTMLInputE
  * declaratively and it must be written after every render.
  */
 export declare const Checkbox: React.ForwardRefExoticComponent<CheckboxProps & React.RefAttributes<HTMLInputElement>>;
+export interface CheckboxGroupProps extends Omit<React.FieldsetHTMLAttributes<HTMLFieldSetElement>, 'onChange' | 'defaultValue' | 'disabled'> {
+    /** The question the options answer. Renders as the `<legend>`. */
+    label?: React.ReactNode;
+    /** Help text beneath the options. Replaced by `errorMessage` while invalid. */
+    description?: React.ReactNode;
+    /** Shown in the description's place while `isInvalid` is set. */
+    errorMessage?: React.ReactNode;
+    /** Marks every box invalid and shows `errorMessage`. */
+    isInvalid?: boolean;
+    /** At least one option must be selected — enforced by native validation. */
+    isRequired?: boolean;
+    /** The selected values (controlled). */
+    value?: readonly string[];
+    /** The initially selected values (uncontrolled). */
+    defaultValue?: readonly string[];
+    /** Receives the whole new selection, in the order the options were ticked. */
+    onChange?: (value: string[]) => void;
+    /** Shared input name, so a form submits every ticked value under it. */
+    name?: string;
+    size?: CheckboxSize;
+    intent?: CheckboxIntent;
+    /** Whether every checkbox in the group is disabled. */
+    isDisabled?: boolean;
+    orientation?: FieldsetOrientation;
+    /** Checkboxes, each with a `value`. */
+    children?: React.ReactNode;
+}
+/**
+ * A set of checkboxes that answers one question — "notify me when…", "which
+ * regions". Owns the selected values, the group's label, help text and error,
+ * and "select at least one".
+ *
+ * A row of loose Checkboxes can do none of that accessibly: the question is
+ * not announced with the options, an error has nothing to attach to, and
+ * "at least one" has no native expression at all. See the `required` note in
+ * Checkbox for how that last one is done.
+ */
+export declare const CheckboxGroup: React.ForwardRefExoticComponent<CheckboxGroupProps & React.RefAttributes<HTMLFieldSetElement>>;
 //# sourceMappingURL=Checkbox.d.ts.map

package/dist/components/Checkbox.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.d.ts","sourceRoot":"","sources":["../../src/components/Checkbox.tsx"],"names":[],"mappings":"AAEA,OAAO,KAKN,MAAM,OAAO,CAAC;AAEf,OAAO,EAAoB,KAAK,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAE/E,MAAM,MAAM,YAAY,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAC9C,MAAM,MAAM,cAAc,GAAG,OAAO,GAAG,SAAS,GAAG,QAAQ,CAAC;AAE5D,MAAM,WAAW,aACf,SACE,IAAI,CAAC,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC,EAClE,cAAc;IAChB,8DAA8D;IAC9D,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,iEAAiE;IACjE,MAAM,CAAC,EAAE,cAAc,CAAC;IACxB;;;OAGG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,wCAAwC;IACxC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,2DAA2D;IAC3D,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AA2BD;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,QAAQ,wFA8DpB,CAAC"}
+{"version":3,"file":"Checkbox.d.ts","sourceRoot":"","sources":["../../src/components/Checkbox.tsx"],"names":[],"mappings":"AAEA,OAAO,KAQN,MAAM,OAAO,CAAC;AACf,OAAO,EAGL,KAAK,mBAAmB,EACzB,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAoB,KAAK,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAE/E,MAAM,MAAM,YAAY,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAC9C,MAAM,MAAM,cAAc,GAAG,OAAO,GAAG,SAAS,GAAG,QAAQ,CAAC;AAwB5D,MAAM,WAAW,aACf,SACE,IAAI,CAAC,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC,EAClE,cAAc;IAChB,8DAA8D;IAC9D,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,iEAAiE;IACjE,MAAM,CAAC,EAAE,cAAc,CAAC;IACxB;;;OAGG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,wCAAwC;IACxC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,2DAA2D;IAC3D,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AA2BD;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,QAAQ,wFAsGpB,CAAC;AAIF,MAAM,WAAW,kBAAmB,SAAQ,IAAI,CAC9C,KAAK,CAAC,sBAAsB,CAAC,mBAAmB,CAAC,EACjD,UAAU,GAAG,cAAc,GAAG,UAAU,CACzC;IACC,kEAAkE;IAClE,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,+EAA+E;IAC/E,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,iEAAiE;IACjE,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC/B,wDAAwD;IACxD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,4EAA4E;IAC5E,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,wCAAwC;IACxC,KAAK,CAAC,EAAE,SAAS,MAAM,EAAE,CAAC;IAC1B,oDAAoD;IACpD,YAAY,CAAC,EAAE,SAAS,MAAM,EAAE,CAAC;IACjC,8EAA8E;IAC9E,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACrC,wEAAwE;IACxE,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,MAAM,CAAC,EAAE,cAAc,CAAC;IACxB,uDAAuD;IACvD,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,WAAW,CAAC,EAAE,mBAAmB,CAAC;IAClC,uCAAuC;IACvC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED;;;;;;;;;GASG;AACH,eAAO,MAAM,aAAa,gGA+DxB,CAAC"}

package/dist/components/Checkbox.js

@@ -1,8 +1,16 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef, useRef, useImperativeHandle, useEffect, } from 'react';
+import { createContext, forwardRef, useContext, useEffect, useImperativeHandle, useRef, useState, } from 'react';
+import { FieldsetShell, useFieldsetHelper, } from './Fieldset.js';
 import { resolveDisabled } from './resolve-disabled.js';
 import { resolveSelection } from './resolve-selection.js';
+/**
+ * Lets CheckboxGroup own the selected values the way RadioGroup owns the
+ * selected value: each Checkbox reads whether its `value` is in the set and
+ * reports its toggles, and the caller wires one `onChange` instead of one per
+ * option.
+ */
+const CheckboxGroupContext = createContext(null);
 /** Figma's check glyph. Inlined for the same reason as Select's chevron: it is
  *  part of the control, not a slot a caller fills. */
 const CheckMark = () => (_jsx("svg", { viewBox: "0 0 24 24", fill: "none", "aria-hidden": "true", focusable: "false", children: _jsx("path", { d: "m5 13 4 4L19 7", stroke: "currentColor", strokeWidth: "3", strokeLinecap: "round", strokeLinejoin: "round" }) }));
@@ -20,9 +28,35 @@ const DashMark = () => (_jsx("svg", { viewBox: "0 0 24 24", fill: "none", "aria-
  * declaratively and it must be written after every render.
  */
 export const Checkbox = forwardRef((props, forwardedRef) => {
-    const { size = 'md', intent = 'brand', isIndeterminate = false, className, children, isDisabled, disabled, isSelected, checked, onChange, onSelectionChange, ...rest } = props;
-    const resolvedDisabled = resolveDisabled(isDisabled, disabled);
+    const group = useContext(CheckboxGroupContext);
+    const { size = group?.size ?? 'md', intent = group?.intent ?? 'brand', isIndeterminate = false, className, children, isDisabled, disabled, isSelected, checked, onChange, onSelectionChange, name = group?.name, 'aria-describedby': describedBy, ...rest } = props;
+    const resolvedDisabled = resolveDisabled(isDisabled, disabled) ?? group?.isDisabled;
     const selection = resolveSelection(isSelected, checked, onChange, onSelectionChange);
+    /*
+     * Inside a group the group owns `checked`, and the box's own handlers still
+     * fire after it — the contract RadioGroup settled on, so neither control
+     * honours a handler in one mode and drops it in the other.
+     */
+    const value = rest.value === undefined ? '' : String(rest.value);
+    const groupSelection = group
+        ? {
+            checked: group.selected.includes(value),
+            onChange: (event) => {
+                group.toggle(value, event.target.checked);
+                selection.onChange?.(event);
+            },
+        }
+        : selection;
+    /*
+     * "Select at least one", in the platform's own words. `required` on a
+     * checkbox means "this one must be ticked", so it is set on every box while
+     * none is and dropped from all of them the moment one is: native
+     * validation then blocks the submit with the browser's localised message,
+     * and each box announces "required" exactly while the rule is unmet.
+     */
+    const required = group?.isRequired
+        ? group.selected.length === 0
+        : rest.required;
     const domRef = useRef(null);
     useImperativeHandle(forwardedRef, () => domRef.current);
     useEffect(() => {
@@ -38,7 +72,46 @@ export const Checkbox = forwardRef((props, forwardedRef) => {
     ]
         .filter(Boolean)
         .join(' ');
-    return (_jsxs("label", { className: classNames, children: [_jsx("input", { ...rest, ref: domRef, type: "checkbox", checked: selection.checked, onChange: selection.onChange, disabled: resolvedDisabled, className: "ion-checkbox__input" }), _jsx("span", { className: "ion-checkbox__indicator", "aria-hidden": "true", children: _jsx("span", { className: "ion-checkbox__mark", children: isIndeterminate ? _jsx(DashMark, {}) : _jsx(CheckMark, {}) }) }), children && _jsx("span", { className: "ion-checkbox__label", children: children })] }));
+    return (_jsxs("label", { className: classNames, children: [_jsx("input", { ...rest, ref: domRef, type: "checkbox", name: name, required: required, checked: groupSelection.checked, onChange: groupSelection.onChange, disabled: resolvedDisabled, "aria-invalid": group?.isInvalid || rest['aria-invalid'], "aria-describedby": [describedBy, group?.helperId].filter(Boolean).join(' ') ||
+                    undefined, className: "ion-checkbox__input" }), _jsx("span", { className: "ion-checkbox__indicator", "aria-hidden": "true", children: _jsx("span", { className: "ion-checkbox__mark", children: isIndeterminate ? _jsx(DashMark, {}) : _jsx(CheckMark, {}) }) }), children && _jsx("span", { className: "ion-checkbox__label", children: children })] }));
 });
 Checkbox.displayName = 'Checkbox';
+/**
+ * A set of checkboxes that answers one question — "notify me when…", "which
+ * regions". Owns the selected values, the group's label, help text and error,
+ * and "select at least one".
+ *
+ * A row of loose Checkboxes can do none of that accessibly: the question is
+ * not announced with the options, an error has nothing to attach to, and
+ * "at least one" has no native expression at all. See the `required` note in
+ * Checkbox for how that last one is done.
+ */
+export const CheckboxGroup = forwardRef((props, ref) => {
+    const { value: controlledValue, defaultValue, onChange, name, size, intent, isDisabled, isRequired, description, errorMessage, ...rest } = props;
+    const [uncontrolled, setUncontrolled] = useState(defaultValue ?? []);
+    const selected = controlledValue ?? uncontrolled;
+    const toggle = (value, isSelected) => {
+        const next = isSelected
+            ? selected.includes(value)
+                ? [...selected]
+                : [...selected, value]
+            : selected.filter((v) => v !== value);
+        if (controlledValue === undefined)
+            setUncontrolled(next);
+        onChange?.(next);
+    };
+    const { helper, helperId } = useFieldsetHelper(description, errorMessage, rest.isInvalid);
+    return (_jsx(CheckboxGroupContext.Provider, { value: {
+            name,
+            selected,
+            toggle,
+            size,
+            intent,
+            isDisabled,
+            isInvalid: rest.isInvalid,
+            isRequired,
+            helperId,
+        }, children: _jsx(FieldsetShell, { ...rest, ref: ref, disabled: isDisabled, isChoiceGroup: true, helper: helper, helperId: helperId }) }));
+});
+CheckboxGroup.displayName = 'CheckboxGroup';
 //# sourceMappingURL=Checkbox.js.map

package/dist/components/Checkbox.js.map

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.js","sourceRoot":"","sources":["../../src/components/Checkbox.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Checkbox.js","sourceRoot":"","sources":["../../src/components/Checkbox.tsx"],"names":[],"mappings":"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"}

package/dist/components/Fieldset.d.ts

@@ -0,0 +1,62 @@
+import React from 'react';
+export type FieldsetOrientation = 'vertical' | 'horizontal';
+export interface FieldsetProps extends Omit<React.FieldsetHTMLAttributes<HTMLFieldSetElement>, 'disabled'> {
+    /** The question the fields answer. Renders as the `<legend>`. */
+    label?: React.ReactNode;
+    /** Help text beneath the fields. Replaced by `errorMessage` while invalid. */
+    description?: React.ReactNode;
+    /** Shown in the description's place while `isInvalid` is set. */
+    errorMessage?: React.ReactNode;
+    /** Whether the group as a whole fails validation. */
+    isInvalid?: boolean;
+    /** How the fields flow. Horizontal wraps rather than overflowing. */
+    orientation?: FieldsetOrientation;
+    children?: React.ReactNode;
+}
+/**
+ * The ids a group hands down to its own controls. Kept separate from the
+ * rendering so CheckboxGroup and RadioGroup can give every checkbox and radio
+ * the same `aria-describedby` the fieldset carries — see FieldsetShell.
+ */
+export declare function useFieldsetHelper(description: React.ReactNode, errorMessage: React.ReactNode, isInvalid: boolean | undefined): {
+    helper: React.ReactNode;
+    helperId: string | undefined;
+};
+interface FieldsetShellProps extends Omit<FieldsetProps, 'description' | 'errorMessage'> {
+    /** Only the choice groups may disable natively — see Fieldset. */
+    disabled?: boolean;
+    /** Choice groups space their options at 8, not a form's 16. */
+    isChoiceGroup?: boolean;
+    /** The description or the error, whichever shows — see useFieldsetHelper. */
+    helper: React.ReactNode;
+    helperId: string | undefined;
+}
+/**
+ * The rendering shared by Fieldset, CheckboxGroup and RadioGroup.
+ *
+ * A real `<fieldset>`: the legend names the group for assistive technology and
+ * the inputs stay grouped for form submission, neither of which a div with
+ * `role="group"` gets for free.
+ *
+ * The fieldset is `display: block` on purpose. A rendered `<legend>` is not a
+ * flex item — browsers lay it out in the fieldset's border, outside the flex
+ * container — so a flex column here would put `gap` everywhere but under the
+ * legend. The fields get a flex wrapper of their own instead.
+ */
+export declare const FieldsetShell: React.ForwardRefExoticComponent<FieldsetShellProps & React.RefAttributes<HTMLFieldSetElement>>;
+/**
+ * Groups related fields under one label, with one description and one error —
+ * an address, a date range typed as two fields, a set of limits.
+ *
+ * For checkboxes use CheckboxGroup and for radios RadioGroup: both render this
+ * same shell, and add the selection state it deliberately does not own.
+ *
+ * There is no `isDisabled`. A native `disabled` fieldset does disable every
+ * control inside, but Input, Select and the rest draw their disabled state from
+ * their own prop, so the fields would stop working while still looking live.
+ * Disable the fields themselves; the choice groups can cascade because their
+ * checkboxes and radios style off `:disabled`.
+ */
+export declare const Fieldset: React.ForwardRefExoticComponent<FieldsetProps & React.RefAttributes<HTMLFieldSetElement>>;
+export {};
+//# sourceMappingURL=Fieldset.d.ts.map

package/dist/components/Fieldset.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Fieldset.d.ts","sourceRoot":"","sources":["../../src/components/Fieldset.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAEjD,MAAM,MAAM,mBAAmB,GAAG,UAAU,GAAG,YAAY,CAAC;AAE5D,MAAM,WAAW,aAAc,SAAQ,IAAI,CACzC,KAAK,CAAC,sBAAsB,CAAC,mBAAmB,CAAC,EACjD,UAAU,CACX;IACC,iEAAiE;IACjE,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,8EAA8E;IAC9E,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,iEAAiE;IACjE,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC/B,qDAAqD;IACrD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,qEAAqE;IACrE,WAAW,CAAC,EAAE,mBAAmB,CAAC;IAClC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED;;;;GAIG;AACH,wBAAgB,iBAAiB,CAC/B,WAAW,EAAE,KAAK,CAAC,SAAS,EAC5B,YAAY,EAAE,KAAK,CAAC,SAAS,EAC7B,SAAS,EAAE,OAAO,GAAG,SAAS;;;EAM/B;AAED,UAAU,kBAAmB,SAAQ,IAAI,CACvC,aAAa,EACb,aAAa,GAAG,cAAc,CAC/B;IACC,kEAAkE;IAClE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,+DAA+D;IAC/D,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,6EAA6E;IAC7E,MAAM,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,QAAQ,EAAE,MAAM,GAAG,SAAS,CAAC;CAC9B;AAED;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,aAAa,gGA4CxB,CAAC;AAIH;;;;;;;;;;;;GAYG;AACH,eAAO,MAAM,QAAQ,2FAYpB,CAAC"}

package/dist/components/Fieldset.js

@@ -0,0 +1,58 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef, useId } from 'react';
+/**
+ * The ids a group hands down to its own controls. Kept separate from the
+ * rendering so CheckboxGroup and RadioGroup can give every checkbox and radio
+ * the same `aria-describedby` the fieldset carries — see FieldsetShell.
+ */
+export function useFieldsetHelper(description, errorMessage, isInvalid) {
+    const helperId = useId();
+    // Input's convention: the error takes the helper's slot, it does not stack.
+    const helper = isInvalid && errorMessage ? errorMessage : description;
+    return { helper, helperId: helper ? helperId : undefined };
+}
+/**
+ * The rendering shared by Fieldset, CheckboxGroup and RadioGroup.
+ *
+ * A real `<fieldset>`: the legend names the group for assistive technology and
+ * the inputs stay grouped for form submission, neither of which a div with
+ * `role="group"` gets for free.
+ *
+ * The fieldset is `display: block` on purpose. A rendered `<legend>` is not a
+ * flex item — browsers lay it out in the fieldset's border, outside the flex
+ * container — so a flex column here would put `gap` everywhere but under the
+ * legend. The fields get a flex wrapper of their own instead.
+ */
+export const FieldsetShell = forwardRef((props, ref) => {
+    const { label, isInvalid, orientation = 'vertical', isChoiceGroup = false, helper, helperId, className, children, 'aria-describedby': describedBy, ...rest } = props;
+    return (_jsxs("fieldset", { ...rest, ref: ref, "aria-describedby": [describedBy, helperId].filter(Boolean).join(' ') || undefined, "data-invalid": isInvalid || undefined, className: [
+            'ion-fieldset',
+            isChoiceGroup ? 'ion-fieldset--choices' : '',
+            orientation === 'horizontal' ? 'ion-fieldset--horizontal' : '',
+            isInvalid ? 'ion-fieldset--error' : '',
+            className || '',
+        ]
+            .filter(Boolean)
+            .join(' '), children: [label && _jsx("legend", { className: "ion-fieldset__legend", children: label }), _jsx("div", { className: "ion-fieldset__content", children: children }), helper && (_jsx("span", { id: helperId, className: "ion-fieldset__helper", children: helper }))] }));
+});
+FieldsetShell.displayName = 'FieldsetShell';
+/**
+ * Groups related fields under one label, with one description and one error —
+ * an address, a date range typed as two fields, a set of limits.
+ *
+ * For checkboxes use CheckboxGroup and for radios RadioGroup: both render this
+ * same shell, and add the selection state it deliberately does not own.
+ *
+ * There is no `isDisabled`. A native `disabled` fieldset does disable every
+ * control inside, but Input, Select and the rest draw their disabled state from
+ * their own prop, so the fields would stop working while still looking live.
+ * Disable the fields themselves; the choice groups can cascade because their
+ * checkboxes and radios style off `:disabled`.
+ */
+export const Fieldset = forwardRef((props, ref) => {
+    const { description, errorMessage, ...rest } = props;
+    const { helper, helperId } = useFieldsetHelper(description, errorMessage, rest.isInvalid);
+    return (_jsx(FieldsetShell, { ...rest, ref: ref, helper: helper, helperId: helperId }));
+});
+Fieldset.displayName = 'Fieldset';
+//# sourceMappingURL=Fieldset.js.map

package/dist/components/Fieldset.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Fieldset.js","sourceRoot":"","sources":["../../src/components/Fieldset.tsx"],"names":[],"mappings":";AAAA,OAAc,EAAE,UAAU,EAAE,KAAK,EAAE,MAAM,OAAO,CAAC;AAqBjD;;;;GAIG;AACH,MAAM,UAAU,iBAAiB,CAC/B,WAA4B,EAC5B,YAA6B,EAC7B,SAA8B;IAE9B,MAAM,QAAQ,GAAG,KAAK,EAAE,CAAC;IACzB,4EAA4E;IAC5E,MAAM,MAAM,GAAG,SAAS,IAAI,YAAY,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,WAAW,CAAC;IACtE,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,EAAE,CAAC;AAC7D,CAAC;AAeD;;;;;;;;;;;GAWG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,UAAU,CAGrC,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;IACf,MAAM,EACJ,KAAK,EACL,SAAS,EACT,WAAW,GAAG,UAAU,EACxB,aAAa,GAAG,KAAK,EACrB,MAAM,EACN,QAAQ,EACR,SAAS,EACT,QAAQ,EACR,kBAAkB,EAAE,WAAW,EAC/B,GAAG,IAAI,EACR,GAAG,KAAK,CAAC;IAEV,OAAO,CACL,uBACM,IAAI,EACR,GAAG,EAAE,GAAG,sBAEN,CAAC,WAAW,EAAE,QAAQ,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,SAAS,kBAElD,SAAS,IAAI,SAAS,EACpC,SAAS,EAAE;YACT,cAAc;YACd,aAAa,CAAC,CAAC,CAAC,uBAAuB,CAAC,CAAC,CAAC,EAAE;YAC5C,WAAW,KAAK,YAAY,CAAC,CAAC,CAAC,0BAA0B,CAAC,CAAC,CAAC,EAAE;YAC9D,SAAS,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,EAAE;YACtC,SAAS,IAAI,EAAE;SAChB;aACE,MAAM,CAAC,OAAO,CAAC;aACf,IAAI,CAAC,GAAG,CAAC,aAEX,KAAK,IAAI,iBAAQ,SAAS,EAAC,sBAAsB,YAAE,KAAK,GAAU,EACnE,cAAK,SAAS,EAAC,uBAAuB,YAAE,QAAQ,GAAO,EACtD,MAAM,IAAI,CACT,eAAM,EAAE,EAAE,QAAQ,EAAE,SAAS,EAAC,sBAAsB,YACjD,MAAM,GACF,CACR,IACQ,CACZ,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,aAAa,CAAC,WAAW,GAAG,eAAe,CAAC;AAE5C;;;;;;;;;;;;GAYG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAG,UAAU,CAChC,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;IACb,MAAM,EAAE,WAAW,EAAE,YAAY,EAAE,GAAG,IAAI,EAAE,GAAG,KAAK,CAAC;IACrD,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,GAAG,iBAAiB,CAC5C,WAAW,EACX,YAAY,EACZ,IAAI,CAAC,SAAS,CACf,CAAC;IACF,OAAO,CACL,KAAC,aAAa,OAAK,IAAI,EAAE,GAAG,EAAE,GAAG,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,QAAQ,GAAI,CAC1E,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,QAAQ,CAAC,WAAW,GAAG,UAAU,CAAC"}

package/dist/components/Radio.d.ts

@@ -1,4 +1,5 @@
 import React from 'react';
+import { type FieldsetOrientation } from './Fieldset.js';
 export type RadioSize = 'sm' | 'md' | 'lg';
 export type RadioIntent = 'brand' | 'neutral' | 'danger';
 export interface RadioProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size' | 'type' | 'value'> {
@@ -20,7 +21,17 @@ export interface RadioGroupProps extends Omit<React.FieldsetHTMLAttributes<HTMLF
     value?: string;
     defaultValue?: string;
     onChange?: (value: string) => void;
+    /** The question the options answer. Renders as the `<legend>`. */
     label?: React.ReactNode;
+    /** Help text beneath the options. Replaced by `errorMessage` while invalid. */
+    description?: React.ReactNode;
+    /** Shown in the description's place while `isInvalid` is set. */
+    errorMessage?: React.ReactNode;
+    /** Shows `errorMessage` in the description's place. */
+    isInvalid?: boolean;
+    /** One option must be chosen before the form submits. */
+    isRequired?: boolean;
+    orientation?: FieldsetOrientation;
     size?: RadioSize;
     intent?: RadioIntent;
     /** Whether every radio in the group is disabled. */
@@ -36,6 +47,9 @@ export interface RadioGroupProps extends Omit<React.FieldsetHTMLAttributes<HTMLF
  * `role="radiogroup"`. Both are announced correctly, but a fieldset also groups
  * the inputs for form submission and native validation, which the ARIA version
  * does not.
+ *
+ * The fieldset itself is Fieldset's shell, shared with CheckboxGroup, so the
+ * two choice groups take the same label, help, error and orientation props.
  */
 export declare const RadioGroup: React.ForwardRefExoticComponent<RadioGroupProps & React.RefAttributes<HTMLFieldSetElement>>;
 //# sourceMappingURL=Radio.d.ts.map

package/dist/components/Radio.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Radio.d.ts","sourceRoot":"","sources":["../../src/components/Radio.tsx"],"names":[],"mappings":"AAEA,OAAO,KAON,MAAM,OAAO,CAAC;AAGf,MAAM,MAAM,SAAS,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAC3C,MAAM,MAAM,WAAW,GAAG,OAAO,GAAG,SAAS,GAAG,QAAQ,CAAC;AAoBzD,MAAM,WAAW,UAAW,SAAQ,IAAI,CACtC,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAC3C,MAAM,GAAG,MAAM,GAAG,OAAO,CAC1B;IACC,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,8EAA8E;IAC9E,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,eAAO,MAAM,KAAK,qFAuEjB,CAAC;AAIF,MAAM,WAAW,eAAgB,SAAQ,IAAI,CAC3C,KAAK,CAAC,sBAAsB,CAAC,mBAAmB,CAAC,EACjD,UAAU,CACX;IACC,iDAAiD;IACjD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,oDAAoD;IACpD,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED;;;;;GAKG;AACH,eAAO,MAAM,UAAU,6FA4CtB,CAAC"}
+{"version":3,"file":"Radio.d.ts","sourceRoot":"","sources":["../../src/components/Radio.tsx"],"names":[],"mappings":"AAEA,OAAO,KAON,MAAM,OAAO,CAAC;AACf,OAAO,EAGL,KAAK,mBAAmB,EACzB,MAAM,eAAe,CAAC;AAGvB,MAAM,MAAM,SAAS,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAC3C,MAAM,MAAM,WAAW,GAAG,OAAO,GAAG,SAAS,GAAG,QAAQ,CAAC;AAsBzD,MAAM,WAAW,UAAW,SAAQ,IAAI,CACtC,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAC3C,MAAM,GAAG,MAAM,GAAG,OAAO,CAC1B;IACC,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,8EAA8E;IAC9E,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,eAAO,MAAM,KAAK,qFAiFjB,CAAC;AAIF,MAAM,WAAW,eAAgB,SAAQ,IAAI,CAC3C,KAAK,CAAC,sBAAsB,CAAC,mBAAmB,CAAC,EACjD,UAAU,CACX;IACC,iDAAiD;IACjD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,kEAAkE;IAClE,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,+EAA+E;IAC/E,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,iEAAiE;IACjE,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC/B,uDAAuD;IACvD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,yDAAyD;IACzD,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,WAAW,CAAC,EAAE,mBAAmB,CAAC;IAClC,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,oDAAoD;IACpD,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED;;;;;;;;GAQG;AACH,eAAO,MAAM,UAAU,6FAoDtB,CAAC"}

package/dist/components/Radio.js

@@ -1,6 +1,7 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { forwardRef, useRef, useImperativeHandle, useContext, createContext, useId, } from 'react';
+import { FieldsetShell, useFieldsetHelper, } from './Fieldset.js';
 import { resolveDisabled } from './resolve-disabled.js';
 /**
  * A radio is meaningless alone — it needs siblings sharing a `name` and one
@@ -11,7 +12,7 @@ import { resolveDisabled } from './resolve-disabled.js';
 const RadioGroupContext = createContext(null);
 export const Radio = forwardRef((props, forwardedRef) => {
     const group = useContext(RadioGroupContext);
-    const { value, size = group?.size ?? 'md', intent = group?.intent ?? 'brand', className, children, isDisabled, disabled, name = group?.name, ...rest } = props;
+    const { value, size = group?.size ?? 'md', intent = group?.intent ?? 'brand', className, children, isDisabled, disabled, name = group?.name, 'aria-describedby': describedBy, ...rest } = props;
     const resolvedDisabled = resolveDisabled(isDisabled, disabled) ?? group?.isDisabled;
     const domRef = useRef(null);
     useImperativeHandle(forwardedRef, () => domRef.current);
@@ -40,7 +41,11 @@ export const Radio = forwardRef((props, forwardedRef) => {
         group?.onChange?.(value);
         rest.onChange?.(e);
     };
-    return (_jsxs("label", { className: classNames, children: [_jsx("input", { ...rest, ref: domRef, type: "radio", name: name, value: value, disabled: resolvedDisabled, className: "ion-radio__input", onChange: handleChange, ...(controlled
+    return (_jsxs("label", { className: classNames, children: [_jsx("input", { ...rest, ref: domRef, type: "radio", name: name, value: value, disabled: resolvedDisabled, 
+                // Native `required` on a radio already means "one of this name" —
+                // unlike a checkbox, it needs no toggling to say "at least one".
+                required: group?.isRequired || rest.required, "aria-describedby": [describedBy, group?.helperId].filter(Boolean).join(' ') ||
+                    undefined, className: "ion-radio__input", onChange: handleChange, ...(controlled
                     ? { checked: group.value === value }
                     : { defaultChecked: group?.defaultValue === value }) }), _jsx("span", { className: "ion-radio__indicator", "aria-hidden": "true", children: _jsx("span", { className: "ion-radio__dot" }) }), children && _jsx("span", { className: "ion-radio__label", children: children })] }));
 });
@@ -50,11 +55,15 @@ Radio.displayName = 'Radio';
  * `role="radiogroup"`. Both are announced correctly, but a fieldset also groups
  * the inputs for form submission and native validation, which the ARIA version
  * does not.
+ *
+ * The fieldset itself is Fieldset's shell, shared with CheckboxGroup, so the
+ * two choice groups take the same label, help, error and orientation props.
  */
 export const RadioGroup = forwardRef((props, ref) => {
-    const { name, value, defaultValue, onChange, label, size, intent, isDisabled, disabled, className, children, ...rest } = props;
+    const { name, value, defaultValue, onChange, size, intent, isDisabled, disabled, isRequired, description, errorMessage, className, ...rest } = props;
     const resolvedDisabled = resolveDisabled(isDisabled, disabled);
     const generated = useId();
+    const { helper, helperId } = useFieldsetHelper(description, errorMessage, rest.isInvalid);
     return (_jsx(RadioGroupContext.Provider, { value: {
             name: name ?? generated,
             value,
@@ -63,7 +72,9 @@ export const RadioGroup = forwardRef((props, ref) => {
             size,
             intent,
             isDisabled: resolvedDisabled,
-        }, children: _jsxs("fieldset", { ...rest, ref: ref, disabled: resolvedDisabled, className: ['ion-radio-group', className].filter(Boolean).join(' '), children: [label && _jsx("legend", { className: "ion-radio-group__label", children: label }), children] }) }));
+            isRequired,
+            helperId,
+        }, children: _jsx(FieldsetShell, { ...rest, ref: ref, disabled: resolvedDisabled, isChoiceGroup: true, helper: helper, helperId: helperId, className: ['ion-radio-group', className].filter(Boolean).join(' ') }) }));
 });
 RadioGroup.displayName = 'RadioGroup';
 //# sourceMappingURL=Radio.js.map

package/dist/components/Radio.js.map

@@ -1 +1 @@
-{"version":3,"file":"Radio.js","sourceRoot":"","sources":["../../src/components/Radio.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Radio.js","sourceRoot":"","sources":["../../src/components/Radio.tsx"],"names":[],"mappings":"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"}

package/dist/components/SearchField.d.ts

@@ -0,0 +1,36 @@
+import React from 'react';
+import type { AriaSearchFieldProps } from 'react-aria';
+export type SearchFieldSize = 'sm' | 'md' | 'lg';
+type SearchFieldDOMProps = Omit<React.InputHTMLAttributes<HTMLInputElement>, keyof AriaSearchFieldProps | 'size' | 'type' | 'disabled' | 'autoCapitalize'>;
+export interface SearchFieldProps extends AriaSearchFieldProps, SearchFieldDOMProps {
+    /** Input's sizes: Small, Medium, Large. */
+    size?: SearchFieldSize;
+    /** Class names for the control box (`.ion-input`). */
+    className?: string;
+    /** Class names for the `.ion-field` wrapper when a label or helper is shown. */
+    wrapperClassName?: string;
+}
+/**
+ * SearchField — a text field for a search query.
+ *
+ * NOT `<Input type="search">`. That gets the right input type and nothing
+ * else. `useSearchField` adds what a search box owes its user:
+ *
+ *   `role="searchbox"`, so a screen reader announces a search field, not a
+ *   text field. Enter calls `onSubmit` with the query. Escape clears it — a
+ *   second Escape then reaches whatever the field sits in, so a search inside
+ *   a dialog clears first and closes second. A clear button appears once there
+ *   is something to clear, named in the user's language by React Aria.
+ *
+ * The clear button is out of the tab order on purpose, as React Aria sets it:
+ * Escape is the keyboard's way to clear, and an extra tab stop in every search
+ * box costs every keyboard user a keystroke. Pressing it puts focus back in the
+ * field.
+ *
+ * The box IS Input's — the component renders `.ion-input` and its size and
+ * state classes, so a search field beside an Input in a toolbar matches it
+ * exactly and cannot drift. Same arrangement as NumberInput.
+ */
+export declare const SearchField: React.ForwardRefExoticComponent<SearchFieldProps & React.RefAttributes<HTMLInputElement>>;
+export {};
+//# sourceMappingURL=SearchField.d.ts.map

package/dist/components/SearchField.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchField.d.ts","sourceRoot":"","sources":["../../src/components/SearchField.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAkD,MAAM,OAAO,CAAC;AAQvE,OAAO,KAAK,EAAmB,oBAAoB,EAAE,MAAM,YAAY,CAAC;AAIxE,MAAM,MAAM,eAAe,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAEjD,KAAK,mBAAmB,GAAG,IAAI,CAC7B,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAC3C,MAAM,oBAAoB,GAAG,MAAM,GAAG,MAAM,GAAG,UAAU,GAAG,gBAAgB,CAC7E,CAAC;AAEF,MAAM,WAAW,gBACf,SAAQ,oBAAoB,EAAE,mBAAmB;IACjD,2CAA2C;IAC3C,IAAI,CAAC,EAAE,eAAe,CAAC;IACvB,sDAAsD;IACtD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gFAAgF;IAChF,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B;AA0CD;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,eAAO,MAAM,WAAW,2FAqGvB,CAAC"}

package/dist/components/SearchField.js

@@ -0,0 +1,76 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef, useImperativeHandle, useRef } from 'react';
+import { mergeProps, useButton, useFocusRing, useHover, useSearchField, } from 'react-aria';
+import { useSearchFieldState } from 'react-stately';
+import { ARIA_TEXT_FIELD_NON_DOM_PROPS, omitProps } from './dom-props.js';
+/** `onSubmit` and `onClear` are React Aria's, not the DOM's — never spread. */
+const SEARCH_FIELD_NON_DOM_PROPS = [
+    ...ARIA_TEXT_FIELD_NON_DOM_PROPS,
+    'onSubmit',
+    'onClear',
+];
+const Magnifier = () => (_jsxs("svg", { viewBox: "0 0 24 24", fill: "none", "aria-hidden": "true", focusable: "false", children: [_jsx("circle", { cx: "11", cy: "11", r: "7", stroke: "currentColor", strokeWidth: "2" }), _jsx("path", { d: "m20 20-3.5-3.5", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round" })] }));
+const Cross = () => (_jsx("svg", { viewBox: "0 0 24 24", fill: "none", "aria-hidden": "true", focusable: "false", children: _jsx("path", { d: "M18 6 6 18M6 6l12 12", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round" }) }));
+function ClearButton(props) {
+    const ref = useRef(null);
+    const { buttonProps } = useButton(props, ref);
+    return (_jsx("button", { ...buttonProps, ref: ref, className: "ion-search-field__clear", children: _jsx(Cross, {}) }));
+}
+/**
+ * SearchField — a text field for a search query.
+ *
+ * NOT `<Input type="search">`. That gets the right input type and nothing
+ * else. `useSearchField` adds what a search box owes its user:
+ *
+ *   `role="searchbox"`, so a screen reader announces a search field, not a
+ *   text field. Enter calls `onSubmit` with the query. Escape clears it — a
+ *   second Escape then reaches whatever the field sits in, so a search inside
+ *   a dialog clears first and closes second. A clear button appears once there
+ *   is something to clear, named in the user's language by React Aria.
+ *
+ * The clear button is out of the tab order on purpose, as React Aria sets it:
+ * Escape is the keyboard's way to clear, and an extra tab stop in every search
+ * box costs every keyboard user a keystroke. Pressing it puts focus back in the
+ * field.
+ *
+ * The box IS Input's — the component renders `.ion-input` and its size and
+ * state classes, so a search field beside an Input in a toolbar matches it
+ * exactly and cannot drift. Same arrangement as NumberInput.
+ */
+export const SearchField = forwardRef((props, forwardedRef) => {
+    const { size = 'md', label, description, errorMessage, isDisabled, isReadOnly, isInvalid, className, wrapperClassName, ...rest } = props;
+    const state = useSearchFieldState(props);
+    const ref = useRef(null);
+    useImperativeHandle(forwardedRef, () => ref.current);
+    const { labelProps, inputProps, clearButtonProps, descriptionProps, errorMessageProps, } = useSearchField(props, state, ref);
+    const { hoverProps, isHovered } = useHover({ isDisabled });
+    const { focusProps, isFocusVisible } = useFocusRing({ isTextInput: true });
+    const domProps = omitProps(rest, SEARCH_FIELD_NON_DOM_PROPS);
+    const canClear = state.value !== '' && !isDisabled && !isReadOnly;
+    const box = (_jsxs("div", { ...hoverProps, "data-hovered": isHovered || undefined, "data-focused": isFocusVisible || undefined, "data-invalid": isInvalid || undefined, "data-readonly": isReadOnly || undefined, "data-disabled": isDisabled || undefined, className: [
+            'ion-input',
+            'ion-search-field',
+            size !== 'md' ? `ion-input--${size}` : '',
+            canClear ? 'ion-search-field--clearable' : '',
+            isInvalid ? 'ion-input--invalid' : '',
+            isReadOnly ? 'ion-input--readonly' : '',
+            isDisabled ? 'ion-input--disabled' : '',
+            className || '',
+        ]
+            .filter(Boolean)
+            .join(' '), children: [_jsx("span", { className: "ion-input__icon-start", "aria-hidden": "true", children: _jsx(Magnifier, {}) }), _jsx("input", { ...domProps, ...mergeProps(inputProps, focusProps), ref: ref, className: "ion-input__field ion-search-field__field" }), canClear && _jsx(ClearButton, { ...clearButtonProps })] }));
+    const helper = isInvalid && errorMessage ? errorMessage : description;
+    const helperProps = isInvalid && errorMessage ? errorMessageProps : descriptionProps;
+    if (!label && !helper)
+        return box;
+    return (_jsxs("div", { className: [
+            'ion-field',
+            isInvalid ? 'ion-field--error' : '',
+            wrapperClassName || '',
+        ]
+            .filter(Boolean)
+            .join(' '), children: [label && (_jsx("label", { ...labelProps, className: "ion-field__label", children: label })), box, helper && (_jsx("span", { ...helperProps, className: "ion-field__helper", children: helper }))] }));
+});
+SearchField.displayName = 'SearchField';
+//# sourceMappingURL=SearchField.js.map

package/dist/components/SearchField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchField.js","sourceRoot":"","sources":["../../src/components/SearchField.tsx"],"names":[],"mappings":"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"}

package/dist/components/index.d.ts

@@ -16,8 +16,10 @@ export { PhoneInput } from './PhoneInput.js';
 export type { PhoneInputProps } from './PhoneInput.js';
 export { Select } from './Select.js';
 export type { SelectProps, SelectSize, SelectOption } from './Select.js';
-export { Checkbox } from './Checkbox.js';
-export type { CheckboxProps, CheckboxSize, CheckboxIntent, } from './Checkbox.js';
+export { Checkbox, CheckboxGroup } from './Checkbox.js';
+export type { CheckboxProps, CheckboxGroupProps, CheckboxSize, CheckboxIntent, } from './Checkbox.js';
+export { Fieldset } from './Fieldset.js';
+export type { FieldsetProps, FieldsetOrientation } from './Fieldset.js';
 export { Radio, RadioGroup } from './Radio.js';
 export type { RadioProps, RadioGroupProps, RadioSize, RadioIntent, } from './Radio.js';
 export { Toggle } from './Toggle.js';
@@ -87,6 +89,8 @@ export { SegmentedControl, SegmentedControlItem } from './SegmentedControl.js';
 export type { SegmentedControlProps, SegmentedControlItemProps, SegmentedControlSize, } from './SegmentedControl.js';
 export { NumberInput } from './NumberInput.js';
 export type { NumberInputProps, NumberInputSize } from './NumberInput.js';
+export { SearchField } from './SearchField.js';
+export type { SearchFieldProps, SearchFieldSize } from './SearchField.js';
 export { ToolCall } from './ToolCall.js';
 export type { ToolCallProps } from './ToolCall.js';
 export { PromptInput } from './PromptInput.js';