@aircall/blocks 0.7.0 → 0.10.0

package/dist/index.d.ts

@@ -1,9 +1,9 @@
 import { Badge, Button, CounterBadge, Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyTitle, SidebarProvider, TabsList, useSidebar } from "@aircall/ds";
 import * as React$1 from "react";
-import * as react_jsx_runtime1 from "react/jsx-runtime";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
 import { VariantProps } from "class-variance-authority";
 import * as _tanstack_react_form0 from "@tanstack/react-form";
-import { DeepKeys, DeepKeysOfType, FieldAsyncValidateOrFn, FieldValidateOrFn } from "@tanstack/react-form";
+import { DeepKeys, DeepKeysOfType, DeepValue, FieldAsyncValidateOrFn, FieldListeners, FieldValidateOrFn, FieldValidators } from "@tanstack/react-form";
 import { useRender } from "@base-ui/react/use-render";
 import * as class_variance_authority_types0 from "class-variance-authority/types";
 
@@ -119,41 +119,178 @@ declare function ChatbotResponseBlock({
   sources,
   onFeedback,
   className
-}: ChatbotResponseBlockProps): react_jsx_runtime1.JSX.Element;
+}: ChatbotResponseBlockProps): react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/components/chatbot-page.d.ts
 declare const ChatbotPage: React$1.ForwardRefExoticComponent<ChatbotPageProps & React$1.RefAttributes<HTMLDivElement>>;
 interface ChatbotPageProps {
-  children: React$1.ReactNode;
+  children?: React$1.ReactNode;
   className?: string;
 }
 declare namespace ChatbotPage {
   type Props = ChatbotPageProps;
 }
+/**
+ * Content area that fills the right side of `ChatbotPage`. Use alongside
+ * `ChatbotSidebar` as a direct child of `ChatbotPage`.
+ *
+ * In the **idle state** place `ChatbotPageBody`, then `ChatbotPageFooter`.
+ * In the **active conversation state** place `ChatbotPageConversation`,
+ * `ChatbotPageInputBar`, then `ChatbotPageFooter`.
+ *
+ * @example
+ * ```tsx
+ * <ChatbotPage>
+ *   <ChatbotSidebar conversations={[...]} />
+ *   <ChatbotPageContent>
+ *     <ChatbotPageBody>
+ *       <ChatbotPageHeading>Need help with Aircall?</ChatbotPageHeading>
+ *       <ChatbotInput />
+ *       <ChatbotExpandSuggestion categories={[...]} suggestions={[...]} />
+ *     </ChatbotPageBody>
+ *     <ChatbotPageFooter betaTermsHref="https://legal.aircall.io/..." />
+ *   </ChatbotPageContent>
+ * </ChatbotPage>
+ * ```
+ */
+declare const ChatbotPageContent: React$1.ForwardRefExoticComponent<Omit<ChatbotPageContentProps, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
+interface ChatbotPageContentProps extends React$1.ComponentProps<'div'> {}
+declare namespace ChatbotPageContent {
+  type Props = ChatbotPageContentProps;
+}
+/**
+ * Centered content area for the idle/empty state inside `ChatbotPageContent`.
+ * Constrains children to a max-width of 896px and vertically centers them.
+ * Place `ChatbotPageHeading`, `ChatbotInput`, and `ChatbotExpandSuggestion`
+ * as children.
+ */
+declare const ChatbotPageBody: React$1.ForwardRefExoticComponent<Omit<ChatbotPageBodyProps, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
+interface ChatbotPageBodyProps extends React$1.ComponentProps<'div'> {}
+declare namespace ChatbotPageBody {
+  type Props = ChatbotPageBodyProps;
+}
+/**
+ * Centered heading displayed above the input area in the idle state.
+ * Renders an `<h2>` element styled at 24px / medium weight.
+ *
+ * @example
+ * ```tsx
+ * <ChatbotPageHeading>Need help with Aircall?</ChatbotPageHeading>
+ * ```
+ */
+declare const ChatbotPageHeading: React$1.ForwardRefExoticComponent<Omit<ChatbotPageHeadingProps, "ref"> & React$1.RefAttributes<HTMLHeadingElement>>;
+interface ChatbotPageHeadingProps extends React$1.ComponentProps<'h2'> {}
+declare namespace ChatbotPageHeading {
+  type Props = ChatbotPageHeadingProps;
+}
+/**
+ * Footer bar showing the AI beta disclaimer. The "Beta terms" phrase is
+ * rendered as an external `Anchor` link pointing to `betaTermsHref`.
+ *
+ * @example
+ * ```tsx
+ * <ChatbotPageFooter betaTermsHref="https://legal.aircall.io/#template-9jw4r0usl" />
+ * ```
+ */
+declare const ChatbotPageFooter: React$1.ForwardRefExoticComponent<Omit<ChatbotPageFooterProps, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
+interface ChatbotPageFooterProps extends React$1.ComponentProps<'div'> {
+  /** URL for the "Beta terms" external link in the disclaimer footer. */
+  betaTermsHref: string;
+}
+declare namespace ChatbotPageFooter {
+  type Props = ChatbotPageFooterProps;
+}
+/**
+ * Scrollable conversation thread for the active chatbot state. Place
+ * `ChatbotUserMessage` and `ChatbotResponseBlock` as alternating children.
+ * Use alongside `ChatbotPageInputBar` and `ChatbotPageFooter` inside
+ * `ChatbotPageContent`.
+ *
+ * The component is `relative` so consumers can absolutely-position a
+ * scroll-to-bottom FAB inside it.
+ *
+ * @example
+ * ```tsx
+ * <ChatbotPageContent>
+ *   <ChatbotPageConversation>
+ *     <ChatbotUserMessage>How do I set my phone line?</ChatbotUserMessage>
+ *     <ChatbotResponseBlock messageId="1" markdown="..." />
+ *   </ChatbotPageConversation>
+ *   <ChatbotPageInputBar>
+ *     <ChatbotInput size="large" />
+ *   </ChatbotPageInputBar>
+ *   <ChatbotPageFooter betaTermsHref="https://legal.aircall.io/..." />
+ * </ChatbotPageContent>
+ * ```
+ */
+declare const ChatbotPageConversation: React$1.ForwardRefExoticComponent<Omit<ChatbotPageConversationProps, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
+interface ChatbotPageConversationProps extends React$1.ComponentProps<'div'> {}
+declare namespace ChatbotPageConversation {
+  type Props = ChatbotPageConversationProps;
+}
+/**
+ * Wrapper that anchors `ChatbotInput` to the bottom of `ChatbotPageContent`
+ * at the correct max-width. Place between `ChatbotPageConversation` and
+ * `ChatbotPageFooter`.
+ *
+ * @example
+ * ```tsx
+ * <ChatbotPageInputBar>
+ *   <ChatbotInput size="large" />
+ * </ChatbotPageInputBar>
+ * ```
+ */
+declare const ChatbotPageInputBar: React$1.ForwardRefExoticComponent<Omit<ChatbotPageInputBarProps, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
+interface ChatbotPageInputBarProps extends React$1.ComponentProps<'div'> {}
+declare namespace ChatbotPageInputBar {
+  type Props = ChatbotPageInputBarProps;
+}
 //#endregion
 //#region src/components/chatbot-panel-header.d.ts
 type ChatbotPanelHeaderProps = React$1.ComponentProps<'div'> & {
-  /** Panel title displayed in the header. Defaults to "Ask Aircall". */title?: React$1.ReactNode; /** Whether the panel body is currently expanded (controlled). */
-  open: boolean; /** Fires when the collapse (−) / expand (+) button is pressed. */
-  onOpenChange: (open: boolean) => void; /** Fires when the "Send feedback" button is pressed. Omit to hide the button. */
-  onFeedback?: () => void; /** Fires when the close (×) button is pressed. Omit to hide the close button. */
+  /** Title displayed in the header. Defaults to "Ask Aircall"; pass an empty
+   *  string to hide it. */
+  title?: string; /** Fires when the menu (☰) button is pressed. Omit to hide the button. */
+  onMenu?: () => void;
+  /** When provided, the menu (☰) opens a Popover rendering this content (e.g. the
+   *  conversation-history sidebar). The button shows even without `onMenu`. */
+  menuContent?: React$1.ReactNode;
+  /** Controls the `menuContent` Popover's open state. Omit to leave it
+   *  uncontrolled. Provide together with `onMenuOpenChange` to close it
+   *  programmatically (e.g. on conversation select). */
+  menuOpen?: boolean;
+  /** Fires when the `menuContent` Popover requests an open-state change (trigger
+   *  press, outside press, Escape). */
+  onMenuOpenChange?: (open: boolean) => void; /** Fires when the "Send feedback" button is pressed. Omit to hide it. */
+  onFeedback?: () => void; /** Fires when the expand (fullscreen) button is pressed. Omit to hide it. */
+  onExpand?: () => void;
+  /** Whether the panel body is currently expanded. Provide with `onOpenChange`
+   *  to show the collapse/expand (—/+) toggle. */
+  open?: boolean; /** Fires when the collapse/expand (—/+) toggle is pressed. Omit to hide it. */
+  onOpenChange?: (open: boolean) => void; /** Fires when the collapse (—) button is pressed. Omit to hide it. */
   onClose?: () => void;
 };
 /**
- * Header bar for the chatbot panel.
- *
- * Always visible — the panel body collapses/expands below it. Controlled by
- * the parent via `open` + `onOpenChange`; pass `onClose` to show the dismiss (×) button.
+ * Header bar for the chatbot panel. Each control renders only when its handler is
+ * provided. The leading ☰ opens a Popover (conversation history) when
+ * `menuContent` is set, otherwise fires `onMenu`; with no menu handler it falls
+ * back to a non-interactive panel indicator. Title is optional — pass an empty
+ * string to hide it.
  */
 declare function ChatbotPanelHeader({
   title,
+  onMenu,
+  menuContent,
+  menuOpen,
+  onMenuOpenChange,
+  onFeedback,
+  onExpand,
   open,
   onOpenChange,
-  onFeedback,
   onClose,
   className,
   ...props
-}: ChatbotPanelHeaderProps): react_jsx_runtime1.JSX.Element;
+}: ChatbotPanelHeaderProps): react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/components/chatbot-sidebar.d.ts
 interface ChatbotSidebarConversation {
@@ -187,6 +324,7 @@ interface ChatbotSidebarProps {
   renderConversationMenuContent?: (conversation: ChatbotSidebarConversation) => React$1.ReactNode;
   /** Label above the conversation list. Defaults to "Recent"*/
   recentLabel?: string;
+  popup?: boolean;
   className?: string;
 }
 declare const ChatbotSidebar: React$1.ForwardRefExoticComponent<ChatbotSidebarProps & React$1.RefAttributes<HTMLDivElement>>;
@@ -197,6 +335,7 @@ declare namespace ChatbotSidebar {
 //#region src/components/chatbot-input.d.ts
 declare const textareaVariants: (props?: ({
   size?: "default" | "large" | null | undefined;
+  expanded?: boolean | null | undefined;
 } & class_variance_authority_types0.ClassProp) | undefined) => string;
 type ChatbotInputProps = Omit<React$1.ComponentProps<'textarea'>, 'onChange' | 'value' | 'size' | 'onSubmit'> & VariantProps<typeof textareaVariants> & {
   /** Current text value (controlled). */value?: string; /** Called with the new text whenever the user types. */
@@ -205,6 +344,12 @@ type ChatbotInputProps = Omit<React$1.ComponentProps<'textarea'>, 'onChange' | '
   onStop?: () => void; /** Placeholder shown when empty. */
   placeholder?: string; /** When true, shows the stop button instead of send, and disables typing submission. */
   loading?: boolean;
+  /**
+   * When true, the textarea starts at 80px tall even when empty.
+   * Use in the idle/home state where a prominent input is desired.
+   * @default false
+   */
+  expanded?: boolean;
 };
 declare function ChatbotInput({
   className,
@@ -215,9 +360,10 @@ declare function ChatbotInput({
   placeholder,
   loading,
   size,
+  expanded,
   disabled,
   ...textareaProps
-}: ChatbotInputProps): react_jsx_runtime1.JSX.Element;
+}: ChatbotInputProps): react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/components/copy-button.d.ts
 declare const CopyButton: React$1.ForwardRefExoticComponent<Omit<CopyButtonProps, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;
@@ -253,7 +399,7 @@ type ChatbotPanelSuggestionProps = Omit<React.ComponentProps<typeof Button>, 'va
 declare function ChatbotPanelSuggestion({
   className,
   ...props
-}: ChatbotPanelSuggestionProps): react_jsx_runtime1.JSX.Element;
+}: ChatbotPanelSuggestionProps): react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/components/chatbot-user-message.d.ts
 type ChatbotUserMessageProps = React.ComponentProps<'div'>;
@@ -261,7 +407,7 @@ declare function ChatbotUserMessage({
   className,
   children,
   ...props
-}: ChatbotUserMessageProps): react_jsx_runtime1.JSX.Element;
+}: ChatbotUserMessageProps): react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/components/dashboard-standalone-page.d.ts
 declare const DashboardStandalonePage: React$1.ForwardRefExoticComponent<Omit<DashboardStandalonePageProps, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
@@ -426,7 +572,109 @@ declare function ChatbotPanelTrigger({
   icon,
   className,
   ...buttonProps
-}: ChatbotPanelTriggerProps): react_jsx_runtime1.JSX.Element;
+}: ChatbotPanelTriggerProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/components/chatbot-expand-suggestion.d.ts
+interface ChatbotExpandSuggestionCategory {
+  value: string;
+  label: string;
+}
+interface ChatbotExpandSuggestionItem {
+  id: string;
+  text: string;
+}
+interface ChatbotExpandSuggestionProps {
+  /** Category filter pills rendered above the suggestions list. Hidden when empty or undefined. */
+  categories?: ChatbotExpandSuggestionCategory[];
+  /** Controlled selected category value. Pass undefined to clear. */
+  selectedCategory?: string;
+  /** Fired when the user presses a category pill. Receives undefined when deselected. */
+  onCategoryChange?: (value: string | undefined) => void;
+  /** Label above the suggestion rows. Defaults to "Suggestions". */
+  label?: string;
+  /** Clickable suggestion rows. Hidden when empty or undefined. */
+  suggestions?: ChatbotExpandSuggestionItem[];
+  /** Fired when the user clicks a suggestion row. */
+  onSuggestionClick?: (suggestion: ChatbotExpandSuggestionItem) => void;
+  className?: string;
+}
+declare const ChatbotExpandSuggestion: React$1.ForwardRefExoticComponent<ChatbotExpandSuggestionProps & React$1.RefAttributes<HTMLDivElement>>;
+declare namespace ChatbotExpandSuggestion {
+  type Props = ChatbotExpandSuggestionProps;
+}
+//#endregion
+//#region src/components/chatbot-panel.d.ts
+type ChatbotPanelSuggestionItem = {
+  /** Stable id; falls back to the label when omitted. */id?: string; /** Pill copy, also used as the message text on select. */
+  label: string;
+};
+type ChatbotPanelProps = Omit<React$1.ComponentProps<'div'>, 'title' | 'onSubmit'> & {
+  /** Title shown in the header. Defaults to the i18n "Ask Aircall". */title?: string; /** Fires when the header menu (☰) is pressed. Omit to hide the button. */
+  onMenu?: () => void;
+  /** Recent conversations. When provided (even `[]`), the header ☰ opens a Popover
+   *  with the conversation history (reuses ChatbotSidebar). */
+  conversations?: ChatbotSidebarProps['conversations']; /** Highlights the active conversation row in the menu. */
+  activeConversationId?: ChatbotSidebarProps['activeConversationId']; /** Fires when "New chat" is selected in the menu. */
+  onNewChat?: ChatbotSidebarProps['onNewChat']; /** Fires when a conversation row is selected in the menu. */
+  onSelectConversation?: ChatbotSidebarProps['onSelectConversation']; /** Render prop for each conversation row's trailing ⋯ menu items. */
+  renderConversationMenuContent?: ChatbotSidebarProps['renderConversationMenuContent']; /** Fires when the header expand (fullscreen) is pressed. Omit to hide it. */
+  onExpand?: () => void; /** Fires when the header close (×) is pressed. Omit to hide the close button. */
+  onClose?: () => void; /** Empty-state heading. Defaults to the i18n "Need help with Aircall?". */
+  emptyTitle?: React$1.ReactNode; /** Empty-state subheading. Defaults to the i18n description. */
+  emptyDescription?: React$1.ReactNode; /** Suggestion pills shown in the empty state. */
+  suggestions?: ChatbotPanelSuggestionItem[]; /** Fires when a suggestion pill is selected. */
+  onSuggestionSelect?: (suggestion: ChatbotPanelSuggestionItem) => void; /** Composer value (controlled). */
+  inputValue?: string; /** Fires as the composer value changes. */
+  onInputValueChange?: (value: string) => void; /** Fires when the composer is submitted (Enter or send button). */
+  onSubmit?: (value: string) => void; /** Fires when the stop button is pressed while `loading`. */
+  onStop?: () => void; /** Shows the stop button instead of send. */
+  loading?: boolean; /** Composer placeholder. */
+  placeholder?: string;
+  /**
+   * Focus the composer when the panel mounts. Use this when the panel is
+   * mounted on open (e.g. `{open && <ChatbotPanel autoFocus />}`).
+   */
+  autoFocus?: boolean; /** Footer disclaimer. Pass `null` to hide; defaults to the AI beta notice. */
+  disclaimer?: React$1.ReactNode; /** Enable the left-edge resize handle. Defaults to true. */
+  resizable?: boolean; /** Initial width in px (uncontrolled). Defaults to 400. */
+  defaultWidth?: number; /** Minimum width in px. Defaults to 320. */
+  minWidth?: number; /** Maximum width in px. Defaults to 768. */
+  maxWidth?: number; /** Fires with the new width (px) as the panel is resized. */
+  onWidthChange?: (width: number) => void; /** Conversation content. When empty, the empty state renders instead. */
+  children?: React$1.ReactNode;
+};
+declare function ChatbotPanel({
+  title,
+  onMenu,
+  conversations,
+  activeConversationId,
+  onNewChat,
+  onSelectConversation,
+  renderConversationMenuContent,
+  onExpand,
+  onClose,
+  emptyTitle,
+  emptyDescription,
+  suggestions,
+  onSuggestionSelect,
+  inputValue,
+  onInputValueChange,
+  onSubmit,
+  onStop,
+  loading,
+  placeholder,
+  autoFocus,
+  disclaimer,
+  resizable,
+  defaultWidth,
+  minWidth,
+  maxWidth,
+  onWidthChange,
+  className,
+  style,
+  children,
+  ...props
+}: ChatbotPanelProps): react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/hooks/use-copy-to-clipboard.d.ts
 interface UseCopyToClipboardOptions {
@@ -463,7 +711,7 @@ declare function CardSaveBar({
   submitLabel,
   savingLabel,
   resetLabel
-}: CardSaveBarProps): react_jsx_runtime1.JSX.Element;
+}: CardSaveBarProps): react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/components/submit-button.d.ts
 /**
@@ -487,7 +735,7 @@ declare function SubmitButton({
   loadingLabel,
   className,
   ...buttonProps
-}: SubmitButtonProps): react_jsx_runtime1.JSX.Element;
+}: SubmitButtonProps): react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/form/use-form.d.ts
 /**
@@ -1036,17 +1284,33 @@ declare const useForm: <TFormData, TOnMount extends _tanstack_react_form0.FormVa
   readonly CardSaveBar: typeof CardSaveBar;
 }>;
 declare const withForm: <TFormData, TOnMount extends _tanstack_react_form0.FormValidateOrFn<TFormData> | undefined, TOnChange extends _tanstack_react_form0.FormValidateOrFn<TFormData> | undefined, TOnChangeAsync extends _tanstack_react_form0.FormAsyncValidateOrFn<TFormData> | undefined, TOnBlur extends _tanstack_react_form0.FormValidateOrFn<TFormData> | undefined, TOnBlurAsync extends _tanstack_react_form0.FormAsyncValidateOrFn<TFormData> | undefined, TOnSubmit extends _tanstack_react_form0.FormValidateOrFn<TFormData> | undefined, TOnSubmitAsync extends _tanstack_react_form0.FormAsyncValidateOrFn<TFormData> | undefined, TOnDynamic extends _tanstack_react_form0.FormValidateOrFn<TFormData> | undefined, TOnDynamicAsync extends _tanstack_react_form0.FormAsyncValidateOrFn<TFormData> | undefined, TOnServer extends _tanstack_react_form0.FormAsyncValidateOrFn<TFormData> | undefined, TSubmitMeta, TRenderProps extends object = {}>({
-  render,
-  props
-}: _tanstack_react_form0.WithFormProps<TFormData, TOnMount, TOnChange, TOnChangeAsync, TOnBlur, TOnBlurAsync, TOnSubmit, TOnSubmitAsync, TOnDynamic, TOnDynamicAsync, TOnServer, TSubmitMeta, {}, {
-  readonly SubmitButton: typeof SubmitButton;
-  readonly CardSaveBar: typeof CardSaveBar;
-}, TRenderProps>) => React$1.FunctionComponent<React$1.PropsWithChildren<NoInfer<[unknown] extends [TRenderProps] ? any : TRenderProps> & {
-  form: _tanstack_react_form0.AppFieldExtendedReactFormApi<[unknown] extends [TFormData] ? any : TFormData, [_tanstack_react_form0.FormValidateOrFn<TFormData> | undefined] extends [TOnMount] ? [TOnMount] extends [TOnMount & (_tanstack_react_form0.FormValidateOrFn<TFormData> | undefined)] ? any : TOnMount : TOnMount, [_tanstack_react_form0.FormValidateOrFn<TFormData> | undefined] extends [TOnChange] ? [TOnChange] extends [TOnChange & (_tanstack_react_form0.FormValidateOrFn<TFormData> | undefined)] ? any : TOnChange : TOnChange, [_tanstack_react_form0.FormValidateOrFn<TFormData> | undefined] extends [TOnChangeAsync] ? [TOnChangeAsync] extends [TOnChangeAsync & (_tanstack_react_form0.FormValidateOrFn<TFormData> | undefined)] ? any : TOnChangeAsync : TOnChangeAsync, [_tanstack_react_form0.FormValidateOrFn<TFormData> | undefined] extends [TOnBlur] ? [TOnBlur] extends [TOnBlur & (_tanstack_react_form0.FormValidateOrFn<TFormData> | undefined)] ? any : TOnBlur : TOnBlur, [_tanstack_react_form0.FormValidateOrFn<TFormData> | undefined] extends [TOnBlurAsync] ? [TOnBlurAsync] extends [TOnBlurAsync & (_tanstack_react_form0.FormValidateOrFn<TFormData> | undefined)] ? any : TOnBlurAsync : TOnBlurAsync, [_tanstack_react_form0.FormValidateOrFn<TFormData> | undefined] extends [TOnSubmit] ? [TOnSubmit] extends [TOnSubmit & (_tanstack_react_form0.FormValidateOrFn<TFormData> | undefined)] ? any : TOnSubmit : TOnSubmit, [_tanstack_react_form0.FormValidateOrFn<TFormData> | undefined] extends [TOnSubmitAsync] ? [TOnSubmitAsync] extends [TOnSubmitAsync & (_tanstack_react_form0.FormValidateOrFn<TFormData> | undefined)] ? any : TOnSubmitAsync : TOnSubmitAsync, [_tanstack_react_form0.FormValidateOrFn<TFormData> | undefined] extends [TOnDynamic] ? [TOnDynamic] extends [TOnDynamic & (_tanstack_react_form0.FormValidateOrFn<TFormData> | undefined)] ? any : TOnDynamic : TOnDynamic, [_tanstack_react_form0.FormValidateOrFn<TFormData> | undefined] extends [TOnDynamicAsync] ? [TOnDynamicAsync] extends [TOnDynamicAsync & (_tanstack_react_form0.FormValidateOrFn<TFormData> | undefined)] ? any : TOnDynamicAsync : TOnDynamicAsync, [_tanstack_react_form0.FormValidateOrFn<TFormData> | undefined] extends [TOnServer] ? [TOnServer] extends [TOnServer & (_tanstack_react_form0.FormValidateOrFn<TFormData> | undefined)] ? any : TOnServer : TOnServer, [unknown] extends [TSubmitMeta] ? any : TSubmitMeta, {}, {
+    render,
+    props
+  }: _tanstack_react_form0.WithFormProps<TFormData, TOnMount, TOnChange, TOnChangeAsync, TOnBlur, TOnBlurAsync, TOnSubmit, TOnSubmitAsync, TOnDynamic, TOnDynamicAsync, TOnServer, TSubmitMeta, {}, {
     readonly SubmitButton: typeof SubmitButton;
     readonly CardSaveBar: typeof CardSaveBar;
-  }>;
-}>>;
+  }, TRenderProps>) => React$1.FunctionComponent<React$1.PropsWithChildren<NoInfer<[unknown] extends [TRenderProps] ? any : TRenderProps> & {
+    form: _tanstack_react_form0.AppFieldExtendedReactFormApi<[unknown] extends [TFormData] ? any : TFormData, [_tanstack_react_form0.FormValidateOrFn<TFormData> | undefined] extends [TOnMount] ? [TOnMount] extends [TOnMount & (_tanstack_react_form0.FormValidateOrFn<TFormData> | undefined)] ? any : TOnMount : TOnMount, [_tanstack_react_form0.FormValidateOrFn<TFormData> | undefined] extends [TOnChange] ? [TOnChange] extends [TOnChange & (_tanstack_react_form0.FormValidateOrFn<TFormData> | undefined)] ? any : TOnChange : TOnChange, [_tanstack_react_form0.FormValidateOrFn<TFormData> | undefined] extends [TOnChangeAsync] ? [TOnChangeAsync] extends [TOnChangeAsync & (_tanstack_react_form0.FormValidateOrFn<TFormData> | undefined)] ? any : TOnChangeAsync : TOnChangeAsync, [_tanstack_react_form0.FormValidateOrFn<TFormData> | undefined] extends [TOnBlur] ? [TOnBlur] extends [TOnBlur & (_tanstack_react_form0.FormValidateOrFn<TFormData> | undefined)] ? any : TOnBlur : TOnBlur, [_tanstack_react_form0.FormValidateOrFn<TFormData> | undefined] extends [TOnBlurAsync] ? [TOnBlurAsync] extends [TOnBlurAsync & (_tanstack_react_form0.FormValidateOrFn<TFormData> | undefined)] ? any : TOnBlurAsync : TOnBlurAsync, [_tanstack_react_form0.FormValidateOrFn<TFormData> | undefined] extends [TOnSubmit] ? [TOnSubmit] extends [TOnSubmit & (_tanstack_react_form0.FormValidateOrFn<TFormData> | undefined)] ? any : TOnSubmit : TOnSubmit, [_tanstack_react_form0.FormValidateOrFn<TFormData> | undefined] extends [TOnSubmitAsync] ? [TOnSubmitAsync] extends [TOnSubmitAsync & (_tanstack_react_form0.FormValidateOrFn<TFormData> | undefined)] ? any : TOnSubmitAsync : TOnSubmitAsync, [_tanstack_react_form0.FormValidateOrFn<TFormData> | undefined] extends [TOnDynamic] ? [TOnDynamic] extends [TOnDynamic & (_tanstack_react_form0.FormValidateOrFn<TFormData> | undefined)] ? any : TOnDynamic : TOnDynamic, [_tanstack_react_form0.FormValidateOrFn<TFormData> | undefined] extends [TOnDynamicAsync] ? [TOnDynamicAsync] extends [TOnDynamicAsync & (_tanstack_react_form0.FormValidateOrFn<TFormData> | undefined)] ? any : TOnDynamicAsync : TOnDynamicAsync, [_tanstack_react_form0.FormValidateOrFn<TFormData> | undefined] extends [TOnServer] ? [TOnServer] extends [TOnServer & (_tanstack_react_form0.FormValidateOrFn<TFormData> | undefined)] ? any : TOnServer : TOnServer, [unknown] extends [TSubmitMeta] ? any : TSubmitMeta, {}, {
+      readonly SubmitButton: typeof SubmitButton;
+      readonly CardSaveBar: typeof CardSaveBar;
+    }>;
+  }>>, withFieldGroup: <TFieldGroupData, TSubmitMeta, TRenderProps extends object = {}>({
+    render,
+    props,
+    defaultValues
+  }: _tanstack_react_form0.WithFieldGroupProps<TFieldGroupData, {}, {
+    readonly SubmitButton: typeof SubmitButton;
+    readonly CardSaveBar: typeof CardSaveBar;
+  }, TSubmitMeta, TRenderProps>) => <TFormData, TFields extends _tanstack_react_form0.DeepKeysOfType<TFormData, TFieldGroupData | null | undefined> | _tanstack_react_form0.FieldsMap<TFormData, TFieldGroupData>, TOnMount extends _tanstack_react_form0.FormValidateOrFn<TFormData> | undefined, TOnChange extends _tanstack_react_form0.FormValidateOrFn<TFormData> | undefined, TOnChangeAsync extends _tanstack_react_form0.FormAsyncValidateOrFn<TFormData> | undefined, TOnBlur extends _tanstack_react_form0.FormValidateOrFn<TFormData> | undefined, TOnBlurAsync extends _tanstack_react_form0.FormAsyncValidateOrFn<TFormData> | undefined, TOnSubmit extends _tanstack_react_form0.FormValidateOrFn<TFormData> | undefined, TOnSubmitAsync extends _tanstack_react_form0.FormAsyncValidateOrFn<TFormData> | undefined, TOnDynamic extends _tanstack_react_form0.FormValidateOrFn<TFormData> | undefined, TOnDynamicAsync extends _tanstack_react_form0.FormAsyncValidateOrFn<TFormData> | undefined, TOnServer extends _tanstack_react_form0.FormAsyncValidateOrFn<TFormData> | undefined, TFormSubmitMeta>(params: React$1.PropsWithChildren<NoInfer<TRenderProps> & {
+    form: _tanstack_react_form0.AppFieldExtendedReactFormApi<TFormData, TOnMount, TOnChange, TOnChangeAsync, TOnBlur, TOnBlurAsync, TOnSubmit, TOnSubmitAsync, TOnDynamic, TOnDynamicAsync, TOnServer, unknown extends TSubmitMeta ? TFormSubmitMeta : TSubmitMeta, {}, {
+      readonly SubmitButton: typeof SubmitButton;
+      readonly CardSaveBar: typeof CardSaveBar;
+    }> | _tanstack_react_form0.AppFieldExtendedReactFieldGroupApi<unknown, TFormData, string | _tanstack_react_form0.FieldsMap<unknown, TFormData>, any, any, any, any, any, any, any, any, any, any, unknown extends TSubmitMeta ? TFormSubmitMeta : TSubmitMeta, {}, {
+      readonly SubmitButton: typeof SubmitButton;
+      readonly CardSaveBar: typeof CardSaveBar;
+    }>;
+    fields: TFields;
+  }>) => ReturnType<React$1.FunctionComponent>;
 //#endregion
 //#region src/form/form-context.d.ts
 /**
@@ -1096,26 +1360,62 @@ type BoundForm = {
   };
   AppField: (...args: never[]) => unknown;
 };
-type FieldValidator<TFormData, TName> = TName extends DeepKeys<TFormData> ? FieldValidateOrFn<TFormData, TName> : never;
-type FieldAsyncValidator<TFormData, TName> = TName extends DeepKeys<TFormData> ? FieldAsyncValidateOrFn<TFormData, TName> : never;
-/** Field validators typed against the field's value — the `validators` prop of every wrapper. */
-type FormFieldValidators<TFormData, TName> = {
-  onMount?: FieldValidator<TFormData, TName>;
-  onChange?: FieldValidator<TFormData, TName>;
-  onChangeAsync?: FieldAsyncValidator<TFormData, TName>;
-  onChangeAsyncDebounceMs?: number;
-  onBlur?: FieldValidator<TFormData, TName>;
-  onBlurAsync?: FieldAsyncValidator<TFormData, TName>;
-  onBlurAsyncDebounceMs?: number;
-  onSubmit?: FieldValidator<TFormData, TName>;
-  onSubmitAsync?: FieldAsyncValidator<TFormData, TName>;
+/**
+ * Field validators typed against the field's value — the `validators` prop of every wrapper.
+ *
+ * Reuses TanStack's own `FieldValidators` (the exact interface `AppField` accepts) instead of a
+ * hand-rolled mirror, so every slot AppField supports is exposed with identical typing:
+ * `onMount`, `onChange`/`onChangeAsync`/`onChangeListenTo`, `onBlur`/`onBlurAsync`/`onBlurListenTo`,
+ * `onSubmit`/`onSubmitAsync`, `onDynamic`/`onDynamicAsync`, plus the `*DebounceMs` knobs.
+ *
+ * The per-slot validator generics can't be inferred here (the wrapper is generic over `TForm`/
+ * `TName`, not a generic *function* like `AppField`), so each is instantiated to its widest
+ * `FieldValidateOrFn`/`FieldAsyncValidateOrFn`. `value` still infers as the field's real type
+ * because `TData` (`DeepValue<TFormData, TName>`) is concrete. The outer conditional keeps `TName`
+ * unconstrained at the boundary so `DeepKeysOfType` subsets (e.g. the string-only Select keys)
+ * resolve without a constraint clash, exactly like the previous guard.
+ */
+type FormFieldValidators<TFormData, TName> = TName extends DeepKeys<TFormData> ? FieldValidators<TFormData, TName, DeepValue<TFormData, TName>, FieldValidateOrFn<TFormData, TName>, FieldValidateOrFn<TFormData, TName>, FieldAsyncValidateOrFn<TFormData, TName>, FieldValidateOrFn<TFormData, TName>, FieldAsyncValidateOrFn<TFormData, TName>, FieldValidateOrFn<TFormData, TName>, FieldAsyncValidateOrFn<TFormData, TName>, FieldValidateOrFn<TFormData, TName>, FieldAsyncValidateOrFn<TFormData, TName>> : never;
+/**
+ * The full `AppField` binding surface every wrapper forwards, typed against the field's value.
+ *
+ * This is the **single source of truth** for which `form.AppField` props the `Form*Field` wrappers
+ * pass through — spread it into each wrapper's props so the set can't drift per-wrapper. The
+ * `app-field-coverage` type test asserts this stays in sync with `AppField`'s real prop surface:
+ * every `AppField` prop must be forwarded here or appear in that test's explicit omission list.
+ *
+ * Forwarded: `validators`, `listeners`, `defaultValue`, `asyncDebounceMs`, `asyncAlways`.
+ * Deliberately omitted (see the coverage test): `name`/`children` (owned by the wrapper),
+ * `defaultMeta`/`disableErrorFlat` (advanced escape hatches that fight the shared shell).
+ */
+type FieldBindingProps<TFormData, TName> = TName extends DeepKeys<TFormData> ? {
+  validators?: FormFieldValidators<TFormData, TName>;
+  listeners?: FieldListeners<TFormData, TName>;
+  defaultValue?: DeepValue<TFormData, TName>;
+  asyncDebounceMs?: number;
+  asyncAlways?: boolean;
+} : never;
+/**
+ * Presentational necessity props every wrapper exposes, forwarded to the DS `FieldLabel` to mark a
+ * field required/optional in the label. Enforcement stays in `validators` — this is label-only.
+ * Shared so the set can't drift per-wrapper.
+ */
+type NecessityProps = {
+  required?: boolean;
+  necessityIndicator?: 'icon' | 'label';
 };
 type FormFieldBaseProps<TData, TControl> = {
   form: Pick<BoundForm, 'AppField'>;
   name: string;
   validators?: unknown;
-  label: string;
-  description?: string; /** Builds the primitive-specific wiring bundle handed to `children`. */
+  listeners?: unknown;
+  defaultValue?: unknown;
+  asyncDebounceMs?: number;
+  asyncAlways?: boolean;
+  label?: string;
+  description?: string;
+  required?: boolean;
+  necessityIndicator?: 'icon' | 'label'; /** Builds the primitive-specific wiring bundle handed to `children`. */
   buildControl: (field: TypedField<TData>) => TControl;
   children: (field: TypedField<TData>, control: TControl) => React$1.ReactNode;
 };
@@ -1124,7 +1424,7 @@ type FormFieldBaseProps<TData, TControl> = {
  * Field-name/value/validator typing is enforced at each wrapper's boundary; this just renders
  * the AppField + shared shell. `TData`/`TControl` carry the precise field + bundle shapes through.
  */
-declare function FormFieldBase<TData, TControl>(props: FormFieldBaseProps<TData, TControl>): react_jsx_runtime1.JSX.Element;
+declare function FormFieldBase<TData, TControl>(props: FormFieldBaseProps<TData, TControl>): react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/components/form-select-field.d.ts
 /**
@@ -1145,11 +1445,10 @@ type SelectControl = {
 type FormSelectFieldProps<TForm extends BoundForm, TName extends DeepKeysOfType<TForm['state']['values'], string>> = {
   /** The form instance from `useForm()` — threaded as a prop so `name`/`validators` are typed. */form: TForm;
   name: TName;
-  label: string;
-  description?: string;
-  validators?: FormFieldValidators<TForm['state']['values'], TName>; /** Compose the Select yourself; spread the bundles. Trigger/content stay fully customizable. */
+  label?: string;
+  description?: string; /** Compose the Select yourself; spread the bundles. Trigger/content stay fully customizable. */
   children: (field: TypedField<string>, control: SelectControl) => React$1.ReactNode;
-};
+} & FieldBindingProps<TForm['state']['values'], TName> & NecessityProps;
 /**
  * Select field wrapper. Owns the binding + shared `Field/Label/Error` shell, and hands the
  * consumer pre-wired `selectProps` / `selectTriggerProps` to spread onto `@aircall/ds` Select
@@ -1168,7 +1467,7 @@ type FormSelectFieldProps<TForm extends BoundForm, TName extends DeepKeysOfType<
  *   )}
  * </FormSelectField>
  */
-declare function FormSelectField<TForm extends BoundForm, TName extends DeepKeysOfType<TForm['state']['values'], string>>(props: FormSelectFieldProps<TForm, TName>): react_jsx_runtime1.JSX.Element;
+declare function FormSelectField<TForm extends BoundForm, TName extends DeepKeysOfType<TForm['state']['values'], string>>(props: FormSelectFieldProps<TForm, TName>): react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/components/form-input-field.d.ts
 /**
@@ -1186,11 +1485,10 @@ type InputControl = {
 type FormInputFieldProps<TForm extends BoundForm, TName extends DeepKeysOfType<TForm['state']['values'], string>> = {
   form: TForm;
   name: TName;
-  label: string;
+  label?: string;
   description?: string;
-  validators?: FormFieldValidators<TForm['state']['values'], TName>;
   children: (field: TypedField<string>, control: InputControl) => React$1.ReactNode;
-};
+} & FieldBindingProps<TForm['state']['values'], TName> & NecessityProps;
 /**
  * Text-input field wrapper — same threaded-`form` typing and shared shell as `FormSelectField`,
  * with an `inputProps` bundle. Compose the input yourself (add adornments, counters, prefixes).
@@ -1201,7 +1499,7 @@ type FormInputFieldProps<TForm extends BoundForm, TName extends DeepKeysOfType<T
  *   {(field, { inputProps }) => <Input {...inputProps} type="email" placeholder="you@co.com" />}
  * </FormInputField>
  */
-declare function FormInputField<TForm extends BoundForm, TName extends DeepKeysOfType<TForm['state']['values'], string>>(props: FormInputFieldProps<TForm, TName>): react_jsx_runtime1.JSX.Element;
+declare function FormInputField<TForm extends BoundForm, TName extends DeepKeysOfType<TForm['state']['values'], string>>(props: FormInputFieldProps<TForm, TName>): react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/components/form-combobox-field.d.ts
 /**
@@ -1222,11 +1520,10 @@ type ComboboxControl = {
 type FormComboboxFieldProps<TForm extends BoundForm, TName extends DeepKeysOfType<TForm['state']['values'], string>> = {
   form: TForm;
   name: TName;
-  label: string;
+  label?: string;
   description?: string;
-  validators?: FormFieldValidators<TForm['state']['values'], TName>;
   children: (field: TypedField<string>, control: ComboboxControl) => React$1.ReactNode;
-};
+} & FieldBindingProps<TForm['state']['values'], TName> & NecessityProps;
 /**
  * Combobox (searchable single-select) field wrapper for **string-valued** fields. Same threaded-
  * `form` typing and shared shell as the other wrappers; the render-prop hands you `comboboxProps`
@@ -1246,7 +1543,7 @@ type FormComboboxFieldProps<TForm extends BoundForm, TName extends DeepKeysOfTyp
  *   )}
  * </FormComboboxField>
  */
-declare function FormComboboxField<TForm extends BoundForm, TName extends DeepKeysOfType<TForm['state']['values'], string>>(props: FormComboboxFieldProps<TForm, TName>): react_jsx_runtime1.JSX.Element;
+declare function FormComboboxField<TForm extends BoundForm, TName extends DeepKeysOfType<TForm['state']['values'], string>>(props: FormComboboxFieldProps<TForm, TName>): react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/components/form-multi-combobox-field.d.ts
 /**
@@ -1267,11 +1564,10 @@ type MultiComboboxControl = {
 type FormMultiComboboxFieldProps<TForm extends BoundForm, TName extends DeepKeysOfType<TForm['state']['values'], string[]>> = {
   form: TForm;
   name: TName;
-  label: string;
+  label?: string;
   description?: string;
-  validators?: FormFieldValidators<TForm['state']['values'], TName>;
   children: (field: TypedField<string[]>, control: MultiComboboxControl) => React$1.ReactNode;
-};
+} & FieldBindingProps<TForm['state']['values'], TName> & NecessityProps;
 /**
  * Multi-select combobox field wrapper — same threaded-`form` typing and shared shell as
  * `FormSelectField`, with `comboboxProps` / `comboboxInputProps` bundles. `name` is restricted
@@ -1286,7 +1582,7 @@ type FormMultiComboboxFieldProps<TForm extends BoundForm, TName extends DeepKeys
  *   )}
  * </FormMultiComboboxField>
  */
-declare function FormMultiComboboxField<TForm extends BoundForm, TName extends DeepKeysOfType<TForm['state']['values'], string[]>>(props: FormMultiComboboxFieldProps<TForm, TName>): react_jsx_runtime1.JSX.Element;
+declare function FormMultiComboboxField<TForm extends BoundForm, TName extends DeepKeysOfType<TForm['state']['values'], string[]>>(props: FormMultiComboboxFieldProps<TForm, TName>): react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/components/form-textarea-field.d.ts
 /**
@@ -1304,11 +1600,10 @@ type TextareaControl = {
 type FormTextareaFieldProps<TForm extends BoundForm, TName extends DeepKeysOfType<TForm['state']['values'], string>> = {
   form: TForm;
   name: TName;
-  label: string;
+  label?: string;
   description?: string;
-  validators?: FormFieldValidators<TForm['state']['values'], TName>;
   children: (field: TypedField<string>, control: TextareaControl) => React$1.ReactNode;
-};
+} & FieldBindingProps<TForm['state']['values'], TName> & NecessityProps;
 /**
  * Multiline text-input field wrapper — same threaded-`form` typing and shared shell as
  * `FormSelectField`, with a `textareaProps` bundle. Compose the textarea yourself (rows,
@@ -1319,7 +1614,7 @@ type FormTextareaFieldProps<TForm extends BoundForm, TName extends DeepKeysOfTyp
  *   {(field, { textareaProps }) => <Textarea {...textareaProps} rows={4} />}
  * </FormTextareaField>
  */
-declare function FormTextareaField<TForm extends BoundForm, TName extends DeepKeysOfType<TForm['state']['values'], string>>(props: FormTextareaFieldProps<TForm, TName>): react_jsx_runtime1.JSX.Element;
+declare function FormTextareaField<TForm extends BoundForm, TName extends DeepKeysOfType<TForm['state']['values'], string>>(props: FormTextareaFieldProps<TForm, TName>): react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/components/form-radio-group-field.d.ts
 /**
@@ -1338,11 +1633,10 @@ type RadioGroupControl = {
 type FormRadioGroupFieldProps<TForm extends BoundForm, TName extends DeepKeysOfType<TForm['state']['values'], string>> = {
   form: TForm;
   name: TName;
-  label: string;
+  label?: string;
   description?: string;
-  validators?: FormFieldValidators<TForm['state']['values'], TName>;
   children: (field: TypedField<string>, control: RadioGroupControl) => React$1.ReactNode;
-};
+} & FieldBindingProps<TForm['state']['values'], TName> & NecessityProps;
 /**
  * Radio-group field wrapper — same threaded-`form` typing and shared shell as `FormSelectField`,
  * with a `radioGroupProps` bundle. Compose the items yourself. `name` is restricted to the
@@ -1357,7 +1651,7 @@ type FormRadioGroupFieldProps<TForm extends BoundForm, TName extends DeepKeysOfT
  *   )}
  * </FormRadioGroupField>
  */
-declare function FormRadioGroupField<TForm extends BoundForm, TName extends DeepKeysOfType<TForm['state']['values'], string>>(props: FormRadioGroupFieldProps<TForm, TName>): react_jsx_runtime1.JSX.Element;
+declare function FormRadioGroupField<TForm extends BoundForm, TName extends DeepKeysOfType<TForm['state']['values'], string>>(props: FormRadioGroupFieldProps<TForm, TName>): react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/components/form-otp-field.d.ts
 /**
@@ -1375,11 +1669,10 @@ type OTPControl = {
 type FormOTPFieldProps<TForm extends BoundForm, TName extends DeepKeysOfType<TForm['state']['values'], string>> = {
   form: TForm;
   name: TName;
-  label: string;
+  label?: string;
   description?: string;
-  validators?: FormFieldValidators<TForm['state']['values'], TName>;
   children: (field: TypedField<string>, control: OTPControl) => React$1.ReactNode;
-};
+} & FieldBindingProps<TForm['state']['values'], TName> & NecessityProps;
 /**
  * One-time-code field wrapper — same threaded-`form` typing and shared shell as `FormSelectField`,
  * with an `otpProps` bundle. Compose the slots yourself. `name` is restricted to the form's
@@ -1390,7 +1683,7 @@ type FormOTPFieldProps<TForm extends BoundForm, TName extends DeepKeysOfType<TFo
  *   {(field, { otpProps }) => <InputOTP maxLength={6} {...otpProps}>{slots}</InputOTP>}
  * </FormOTPField>
  */
-declare function FormOTPField<TForm extends BoundForm, TName extends DeepKeysOfType<TForm['state']['values'], string>>(props: FormOTPFieldProps<TForm, TName>): react_jsx_runtime1.JSX.Element;
+declare function FormOTPField<TForm extends BoundForm, TName extends DeepKeysOfType<TForm['state']['values'], string>>(props: FormOTPFieldProps<TForm, TName>): react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/components/form-switch-field.d.ts
 /**
@@ -1408,11 +1701,10 @@ type SwitchControl = {
 type FormSwitchFieldProps<TForm extends BoundForm, TName extends DeepKeysOfType<TForm['state']['values'], boolean>> = {
   form: TForm;
   name: TName;
-  label: string;
+  label?: string;
   description?: string;
-  validators?: FormFieldValidators<TForm['state']['values'], TName>;
   children: (field: TypedField<boolean>, control: SwitchControl) => React$1.ReactNode;
-};
+} & FieldBindingProps<TForm['state']['values'], TName> & NecessityProps;
 /**
  * Toggle field wrapper — same threaded-`form` typing and shared shell as `FormSelectField`,
  * with a `switchProps` bundle. `name` is restricted to the form's **boolean** fields — a
@@ -1423,40 +1715,39 @@ type FormSwitchFieldProps<TForm extends BoundForm, TName extends DeepKeysOfType<
  *   {(field, { switchProps }) => <Switch {...switchProps} />}
  * </FormSwitchField>
  */
-declare function FormSwitchField<TForm extends BoundForm, TName extends DeepKeysOfType<TForm['state']['values'], boolean>>(props: FormSwitchFieldProps<TForm, TName>): react_jsx_runtime1.JSX.Element;
+declare function FormSwitchField<TForm extends BoundForm, TName extends DeepKeysOfType<TForm['state']['values'], boolean>>(props: FormSwitchFieldProps<TForm, TName>): react_jsx_runtime0.JSX.Element;
 //#endregion
-//#region src/components/form-number-field.d.ts
+//#region src/components/form-numeric-field.d.ts
 /**
- * Wiring bundle handed to a `FormNumberField` child. Spread `numberProps` onto a DS `Input`
- * with `type="number"` — value/onChange/onBlur/aria are pre-wired (empty input coerces to `0`).
+ * Wiring bundle handed to a `FormNumericField` child. Spread `numericProps` onto a DS
+ * `NumericInput` — value/onValueChange/onBlur/aria are pre-wired (a cleared input coerces to `0`).
  */
-type NumberControl = {
-  numberProps: {
+type NumericControl = {
+  numericProps: {
     value: number;
-    onChange: (event: React$1.ChangeEvent<HTMLInputElement>) => void;
+    onValueChange: (value: number | null) => void;
     onBlur: () => void;
     'aria-invalid': true | undefined;
   };
 };
-type FormNumberFieldProps<TForm extends BoundForm, TName extends DeepKeysOfType<TForm['state']['values'], number>> = {
+type FormNumericFieldProps<TForm extends BoundForm, TName extends DeepKeysOfType<TForm['state']['values'], number>> = {
   form: TForm;
   name: TName;
-  label: string;
+  label?: string;
   description?: string;
-  validators?: FormFieldValidators<TForm['state']['values'], TName>;
-  children: (field: TypedField<number>, control: NumberControl) => React$1.ReactNode;
-};
+  children: (field: TypedField<number>, control: NumericControl) => React$1.ReactNode;
+} & FieldBindingProps<TForm['state']['values'], TName> & NecessityProps;
 /**
- * Numeric-input field wrapper — same threaded-`form` typing and shared shell as `FormSelectField`,
- * with a `numberProps` bundle. `name` is restricted to the form's **number** fields — a
- * string/boolean `name` is a type error.
+ * Numeric field wrapper — same threaded-`form` typing and shared shell as `FormSelectField`,
+ * with a `numericProps` bundle for the DS `NumericInput` (prefer it over `Input type="number"`).
+ * `name` is restricted to the form's **number** fields — a string/boolean `name` is a type error.
  *
  * @example
- * <FormNumberField form={form} name="age" label="Age" validators={{ onChange }}>
- *   {(field, { numberProps }) => <Input type="number" {...numberProps} />}
- * </FormNumberField>
+ * <FormNumericField form={form} name="age" label="Age" validators={{ onChange }}>
+ *   {(field, { numericProps }) => <NumericInput {...numericProps} />}
+ * </FormNumericField>
  */
-declare function FormNumberField<TForm extends BoundForm, TName extends DeepKeysOfType<TForm['state']['values'], number>>(props: FormNumberFieldProps<TForm, TName>): react_jsx_runtime1.JSX.Element;
+declare function FormNumericField<TForm extends BoundForm, TName extends DeepKeysOfType<TForm['state']['values'], number>>(props: FormNumericFieldProps<TForm, TName>): react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/components/form-slider-field.d.ts
 /**
@@ -1473,11 +1764,10 @@ type SliderControl = {
 type FormSliderFieldProps<TForm extends BoundForm, TName extends DeepKeysOfType<TForm['state']['values'], number>> = {
   form: TForm;
   name: TName;
-  label: string;
+  label?: string;
   description?: string;
-  validators?: FormFieldValidators<TForm['state']['values'], TName>;
   children: (field: TypedField<number>, control: SliderControl) => React$1.ReactNode;
-};
+} & FieldBindingProps<TForm['state']['values'], TName> & NecessityProps;
 /**
  * Slider field wrapper — same threaded-`form` typing and shared shell as `FormSelectField`,
  * with a `sliderProps` bundle. `name` is restricted to the form's **number** fields; the bundle
@@ -1488,7 +1778,7 @@ type FormSliderFieldProps<TForm extends BoundForm, TName extends DeepKeysOfType<
  *   {(field, { sliderProps }) => <Slider min={0} max={100} step={1} {...sliderProps} />}
  * </FormSliderField>
  */
-declare function FormSliderField<TForm extends BoundForm, TName extends DeepKeysOfType<TForm['state']['values'], number>>(props: FormSliderFieldProps<TForm, TName>): react_jsx_runtime1.JSX.Element;
+declare function FormSliderField<TForm extends BoundForm, TName extends DeepKeysOfType<TForm['state']['values'], number>>(props: FormSliderFieldProps<TForm, TName>): react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/components/form-toggle-group-field.d.ts
 /**
@@ -1506,11 +1796,10 @@ type ToggleGroupControl = {
 type FormToggleGroupFieldProps<TForm extends BoundForm, TName extends DeepKeysOfType<TForm['state']['values'], string | null>> = {
   form: TForm;
   name: TName;
-  label: string;
+  label?: string;
   description?: string;
-  validators?: FormFieldValidators<TForm['state']['values'], TName>;
   children: (field: TypedField<string | null>, control: ToggleGroupControl) => React$1.ReactNode;
-};
+} & FieldBindingProps<TForm['state']['values'], TName> & NecessityProps;
 /**
  * Single-select toggle-group field wrapper — same threaded-`form` typing and shared shell as
  * `FormSelectField`, with a `toggleGroupProps` bundle. `name` is restricted to the form's
@@ -1526,7 +1815,7 @@ type FormToggleGroupFieldProps<TForm extends BoundForm, TName extends DeepKeysOf
  *   )}
  * </FormToggleGroupField>
  */
-declare function FormToggleGroupField<TForm extends BoundForm, TName extends DeepKeysOfType<TForm['state']['values'], string | null>>(props: FormToggleGroupFieldProps<TForm, TName>): react_jsx_runtime1.JSX.Element;
+declare function FormToggleGroupField<TForm extends BoundForm, TName extends DeepKeysOfType<TForm['state']['values'], string | null>>(props: FormToggleGroupFieldProps<TForm, TName>): react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/form/field-errors.d.ts
 /**
@@ -1574,7 +1863,7 @@ declare function SaveBar({
   savingLabel,
   resetLabel,
   className
-}: SaveBarProps): react_jsx_runtime1.JSX.Element;
+}: SaveBarProps): react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/components/dashboard-sidebar-nav.d.ts
 type DashboardSidebarNavSubmenuSeparator = {
@@ -1658,7 +1947,7 @@ type DashboardSidebarNavProps = {
 declare function DashboardSidebarNav({
   groups,
   renderLink
-}: DashboardSidebarNavProps): react_jsx_runtime1.JSX.Element;
+}: DashboardSidebarNavProps): react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/components/dashboard-sidebar.d.ts
 declare const DashboardSidebarProvider: React$1.ForwardRefExoticComponent<Omit<DashboardSidebarProviderProps, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
@@ -1758,4 +2047,4 @@ declare namespace DashboardSidebarSubmenuSeparator {
   type Props = DashboardSidebarSubmenuSeparatorProps;
 }
 //#endregion
-export { BetaBadge, type BoundForm, CardSaveBar, type CardSaveBarProps, ChatbotInput, type ChatbotInputProps, ChatbotPage, ChatbotPanelHeader, type ChatbotPanelHeaderProps, ChatbotPanelSuggestion, type ChatbotPanelSuggestionProps, ChatbotPanelTrigger, type ChatbotPanelTriggerProps, ChatbotResponseBlock, type ChatbotResponseBlockFeedback, type ChatbotResponseBlockProps, ChatbotSidebar, type ChatbotSidebarConversation, ChatbotUserMessage, type ChatbotUserMessageProps, type ComboboxControl, ComingSoonDescription, ComingSoonEmptyState, ComingSoonMedia, ComingSoonTitle, CommonForm, CopyButton, CopyButtonIcon, CopyButtonLabel, DashboardPage, DashboardPageBanner, DashboardPageContent, DashboardPageHeader, DashboardPageHeaderAction, DashboardPageHeaderActions, DashboardPageHeaderDescription, DashboardPageHeaderNav, DashboardPageHeaderNavBack, DashboardPageHeaderPrefix, DashboardPageHeaderSubtitle, DashboardPageHeaderTitle, DashboardPageHeaderTitleGroup, DashboardPageMain, DashboardPageTabs, DashboardSidebar, DashboardSidebarContent, DashboardSidebarFooter, DashboardSidebarGroup, DashboardSidebarGroupLabel, DashboardSidebarHeader, DashboardSidebarMenu, DashboardSidebarMenuBadge, DashboardSidebarMenuButton, DashboardSidebarMenuItem, DashboardSidebarNav, type DashboardSidebarNavGroup, type DashboardSidebarNavItem, type DashboardSidebarNavItemAction, type DashboardSidebarNavItemLink, type DashboardSidebarNavItemSubmenu, type DashboardSidebarNavSubmenuItem, DashboardSidebarProvider, DashboardSidebarSubmenu, DashboardSidebarSubmenuItem, DashboardSidebarSubmenuSeparator, DashboardSidebarTrigger, DashboardStandalonePage, DashboardStandalonePageAction, DashboardStandalonePageActions, DashboardStandalonePageContent, DashboardStandalonePageHeader, DashboardStandalonePageTitle, DeprecatedBadge, EmptyState, EmptyStateActions, EmptyStateButton, EmptyStateDescription, EmptyStateExternalLink, EmptyStateHeader, EmptyStateMedia, EmptyStateTitle, FormComboboxField, type FormComboboxFieldProps, FormFieldBase, type FormFieldValidators, FormInputField, type FormInputFieldProps, FormMultiComboboxField, type FormMultiComboboxFieldProps, FormNumberField, type FormNumberFieldProps, FormOTPField, type FormOTPFieldProps, FormRadioGroupField, type FormRadioGroupFieldProps, FormSelectField, type FormSelectFieldProps, FormSliderField, type FormSliderFieldProps, FormSwitchField, type FormSwitchFieldProps, FormTextareaField, type FormTextareaFieldProps, FormToggleGroupField, type FormToggleGroupFieldProps, type InputControl, type MultiComboboxControl, NewBadge, NoDataDescription, NoDataEmptyState, NoDataMedia, NoDataTitle, NoSupportDescription, NoSupportEmptyState, NoSupportMedia, NoSupportTitle, NotFoundDescription, NotFoundEmptyState, NotFoundMedia, NotFoundTitle, type NumberControl, type OTPControl, ProfessionalBadge, type RadioGroupControl, RestrictedAccessDescription, RestrictedAccessEmptyState, RestrictedAccessMedia, RestrictedAccessTitle, RoleBadge, type RoleBadgeRole, SaveBar, type SaveBarProps, type SelectControl, type SliderControl, SubmitButton, type SubmitButtonProps, type SwitchControl, type TextareaControl, type ToggleGroupControl, TrialBadge, type TypedField, UnknownErrorDescription, UnknownErrorEmptyState, UnknownErrorMedia, UnknownErrorTitle, fieldContext, formContext, toFieldErrors, useCopyToClipboard, useSidebar as useDashboardSidebar, useFieldContext, useForm, useFormContext, withForm };
+export { BetaBadge, type BoundForm, CardSaveBar, type CardSaveBarProps, ChatbotExpandSuggestion, type ChatbotExpandSuggestionProps, ChatbotInput, type ChatbotInputProps, ChatbotPage, ChatbotPageBody, type ChatbotPageBodyProps, ChatbotPageContent, type ChatbotPageContentProps, ChatbotPageConversation, type ChatbotPageConversationProps, ChatbotPageFooter, type ChatbotPageFooterProps, ChatbotPageHeading, type ChatbotPageHeadingProps, ChatbotPageInputBar, type ChatbotPageInputBarProps, type ChatbotPageProps, ChatbotPanel, ChatbotPanelHeader, type ChatbotPanelHeaderProps, type ChatbotPanelProps, ChatbotPanelSuggestion, type ChatbotPanelSuggestionItem, type ChatbotPanelSuggestionProps, ChatbotPanelTrigger, type ChatbotPanelTriggerProps, ChatbotResponseBlock, type ChatbotResponseBlockFeedback, type ChatbotResponseBlockProps, ChatbotSidebar, type ChatbotSidebarConversation, ChatbotUserMessage, type ChatbotUserMessageProps, type ComboboxControl, ComingSoonDescription, ComingSoonEmptyState, ComingSoonMedia, ComingSoonTitle, CommonForm, CopyButton, CopyButtonIcon, CopyButtonLabel, DashboardPage, DashboardPageBanner, DashboardPageContent, DashboardPageHeader, DashboardPageHeaderAction, DashboardPageHeaderActions, DashboardPageHeaderDescription, DashboardPageHeaderNav, DashboardPageHeaderNavBack, DashboardPageHeaderPrefix, DashboardPageHeaderSubtitle, DashboardPageHeaderTitle, DashboardPageHeaderTitleGroup, DashboardPageMain, DashboardPageTabs, DashboardSidebar, DashboardSidebarContent, DashboardSidebarFooter, DashboardSidebarGroup, DashboardSidebarGroupLabel, DashboardSidebarHeader, DashboardSidebarMenu, DashboardSidebarMenuBadge, DashboardSidebarMenuButton, DashboardSidebarMenuItem, DashboardSidebarNav, type DashboardSidebarNavGroup, type DashboardSidebarNavItem, type DashboardSidebarNavItemAction, type DashboardSidebarNavItemLink, type DashboardSidebarNavItemSubmenu, type DashboardSidebarNavSubmenuItem, DashboardSidebarProvider, DashboardSidebarSubmenu, DashboardSidebarSubmenuItem, DashboardSidebarSubmenuSeparator, DashboardSidebarTrigger, DashboardStandalonePage, DashboardStandalonePageAction, DashboardStandalonePageActions, DashboardStandalonePageContent, DashboardStandalonePageHeader, DashboardStandalonePageTitle, DeprecatedBadge, EmptyState, EmptyStateActions, EmptyStateButton, EmptyStateDescription, EmptyStateExternalLink, EmptyStateHeader, EmptyStateMedia, EmptyStateTitle, type FieldBindingProps, FormComboboxField, type FormComboboxFieldProps, FormFieldBase, type FormFieldValidators, FormInputField, type FormInputFieldProps, FormMultiComboboxField, type FormMultiComboboxFieldProps, FormNumericField, type FormNumericFieldProps, FormOTPField, type FormOTPFieldProps, FormRadioGroupField, type FormRadioGroupFieldProps, FormSelectField, type FormSelectFieldProps, FormSliderField, type FormSliderFieldProps, FormSwitchField, type FormSwitchFieldProps, FormTextareaField, type FormTextareaFieldProps, FormToggleGroupField, type FormToggleGroupFieldProps, type InputControl, type MultiComboboxControl, type NecessityProps, NewBadge, NoDataDescription, NoDataEmptyState, NoDataMedia, NoDataTitle, NoSupportDescription, NoSupportEmptyState, NoSupportMedia, NoSupportTitle, NotFoundDescription, NotFoundEmptyState, NotFoundMedia, NotFoundTitle, type NumericControl, type OTPControl, ProfessionalBadge, type RadioGroupControl, RestrictedAccessDescription, RestrictedAccessEmptyState, RestrictedAccessMedia, RestrictedAccessTitle, RoleBadge, type RoleBadgeRole, SaveBar, type SaveBarProps, type SelectControl, type SliderControl, SubmitButton, type SubmitButtonProps, type SwitchControl, type TextareaControl, type ToggleGroupControl, TrialBadge, type TypedField, UnknownErrorDescription, UnknownErrorEmptyState, UnknownErrorMedia, UnknownErrorTitle, fieldContext, formContext, toFieldErrors, useCopyToClipboard, useSidebar as useDashboardSidebar, useFieldContext, useForm, useFormContext, withFieldGroup, withForm };