{
  "schemaVersion": 1,
  "scope": "Components independently discovered in emitted declarations. Every callable component/part needs JSX use or an explicit documented disposition. Runtime verification is separate.",
  "count": 155,
  "components": [
    {
      "name": "AccessibilityPreferences",
      "entry": "@fayegram-ai/faye-ui/patterns/accessibility-preferences",
      "guide": "/docs/patterns/",
      "declaration": "packages/faye-ui/dist/patterns/accessibility-preferences.d.ts",
      "signature": "({ value, onValueChange, labels, disabled, className, ...props }: AccessibilityPreferencesProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "labels",
          "optional": true,
          "type": "Partial<Record<\"system\" | \"title\" | \"reset\" | \"reduced\" | \"focus\" | \"hints\" | \"contrast\" | \"motion\" | \"automatic\" | \"keyboardFocus\" | \"everyFocus\" | \"more\", string>> | undefined",
          "description": ""
        },
        {
          "name": "onValueChange",
          "optional": false,
          "type": "(value: AccessibilityPreferencesValue) => void",
          "description": ""
        },
        {
          "name": "value",
          "optional": false,
          "type": "AccessibilityPreferencesValue",
          "description": ""
        }
      ],
      "parts": [],
      "description": "Controlled, optional UI. The application owns persistence and provider updates.",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-patterns-accessibility-preferences/#accessibilitypreferences",
      "api": "/api/packages/patterns/accessibility-preferences.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "accessibility",
          "title": "Accessibility and input behavior",
          "example": "accessibility",
          "source": "/examples/accessibility.tsx"
        }
      ]
    },
    {
      "name": "Accordion",
      "entry": "@fayegram-ai/faye-ui/navigation/accordion",
      "guide": "/docs/navigation/",
      "declaration": "packages/faye-ui/dist/navigation/accordion.d.ts",
      "signature": null,
      "props": [],
      "parts": [
        {
          "name": "Root",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: Base.Root.State<Value>) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "defaultValue",
              "optional": true,
              "type": "AccordionValue<Value> | undefined",
              "description": "The uncontrolled value of the item(s) that should be initially expanded.\n\nTo render a controlled accordion, use the `value` prop instead."
            },
            {
              "name": "disabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component should ignore user interaction."
            },
            {
              "name": "hiddenUntilFound",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Allows the browser's built-in page search to find and expand the panel contents.\n\nOverrides the `keepMounted` prop and uses `hidden=\"until-found\"`\nto hide the element without removing it from the DOM."
            },
            {
              "name": "keepMounted",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to keep the element in the DOM while the panel is closed.\nThis prop is ignored when `hiddenUntilFound` is used."
            },
            {
              "name": "loopFocus",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Deprecated following the [APG guidance update](https://github.com/w3c/aria-practices/pull/3434)\nto remove roving focus.\n\nThis prop no longer affects keyboard focus behavior."
            },
            {
              "name": "multiple",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether multiple items can be open at the same time."
            },
            {
              "name": "onValueChange",
              "optional": true,
              "type": "((value: AccordionValue<Value>, eventDetails: AccordionRootChangeEventDetails) => void) | undefined",
              "description": "Event handler called when an accordion item is expanded or collapsed.\nProvides the new value as an argument."
            },
            {
              "name": "orientation",
              "optional": true,
              "type": "Orientation | undefined",
              "description": "Deprecated following the [APG guidance update](https://github.com/w3c/aria-practices/pull/3434)\nto remove roving focus.\n\nThis prop no longer affects keyboard focus behavior."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, Base.Root.State<Value>> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: Base.Root.State<Value>) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "value",
              "optional": true,
              "type": "AccordionValue<Value> | undefined",
              "description": "The controlled value of the item(s) that should be expanded.\n\nTo render an uncontrolled accordion, use the `defaultValue` prop instead."
            }
          ]
        },
        {
          "name": "Item",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: AccordionItemState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "disabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component should ignore user interaction."
            },
            {
              "name": "onOpenChange",
              "optional": true,
              "type": "((open: boolean, eventDetails: Base.Item.ChangeEventDetails) => void) | undefined",
              "description": "Event handler called when the panel is opened or closed."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, AccordionItemState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: AccordionItemState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "value",
              "optional": true,
              "type": "any",
              "description": "A unique value that identifies this accordion item.\nIf no value is provided, a unique ID will be generated automatically.\nUse when controlling the accordion programmatically, or to set an initial\nopen state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"accordion\", \"variant\"> | undefined; readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"accordion\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"accordion\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Header",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: AccordionHeaderState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, AccordionHeaderState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: AccordionHeaderState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"accordion\", \"variant\"> | undefined; readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"accordion\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"accordion\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Trigger",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: AccordionTriggerState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "hideIndicator",
              "optional": true,
              "type": "boolean | undefined",
              "description": ""
            },
            {
              "name": "indicator",
              "optional": true,
              "type": "ReactNode",
              "description": ""
            },
            {
              "name": "indicatorPosition",
              "optional": true,
              "type": "\"start\" | \"end\" | undefined",
              "description": ""
            },
            {
              "name": "nativeButton",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component renders a native `<button>` element when replacing it\nvia the `render` prop.\nSet to `false` if the rendered element is not a button (for example, `<div>`)."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, AccordionTriggerState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: AccordionTriggerState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"accordion\", \"variant\"> | undefined; readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"accordion\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"accordion\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Panel",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: AccordionPanelState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "hiddenUntilFound",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Allows the browser's built-in page search to find and expand the panel contents.\n\nOverrides the `keepMounted` prop and uses `hidden=\"until-found\"`\nto hide the element without removing it from the DOM."
            },
            {
              "name": "keepMounted",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to keep the element in the DOM while the panel is closed.\nThis prop is ignored when `hiddenUntilFound` is used."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, AccordionPanelState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: AccordionPanelState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"accordion\", \"variant\"> | undefined; readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"accordion\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"accordion\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        }
      ],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-navigation-accordion/#accordion",
      "api": "/api/packages/navigation/accordion.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "consumer-experience",
          "title": "Interactive consumer experience",
          "example": "consumer-experience",
          "source": "/examples/consumer-experience.tsx"
        },
        {
          "slug": "navigation",
          "title": "Navigation and disclosure",
          "example": "navigation",
          "source": "/examples/navigation.tsx"
        }
      ]
    },
    {
      "name": "ActivityPanel",
      "entry": "@fayegram-ai/faye-ui/example-extension",
      "guide": "/docs/extensions/",
      "declaration": "packages/faye-ui/dist/example-extension/index.d.ts",
      "signature": "({ entries, profile, ...props }: HTMLAttributes<HTMLElement> & { entries: readonly ActivityEntry[]; profile?: ComponentProfile; }): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "entries",
          "optional": false,
          "type": "readonly ActivityEntry[]",
          "description": ""
        },
        {
          "name": "profile",
          "optional": true,
          "type": "ComponentProfile | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-example-extension/#activitypanel",
      "api": "/api/packages/example-extension/index.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "extensions",
          "title": "Extension packages",
          "example": "extensions",
          "source": "/examples/extensions.tsx"
        }
      ]
    },
    {
      "name": "Alert",
      "entry": "@fayegram-ai/faye-ui/feedback/alert",
      "guide": "/docs/feedback/",
      "declaration": "packages/faye-ui/dist/feedback/alert.d.ts",
      "signature": "({ profile, tone, title, icon, action, announce, children, className, ...props }: AlertProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "action",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "announce",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "icon",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "profile",
          "optional": true,
          "type": "ComponentProfile | undefined",
          "description": ""
        },
        {
          "name": "title",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "tone",
          "optional": true,
          "type": "VisualVariant<\"alert\", \"tone\"> | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-feedback-alert/#alert",
      "api": "/api/packages/feedback/alert.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "feedback",
          "title": "Feedback and status",
          "example": "feedback",
          "source": "/examples/feedback.tsx"
        }
      ]
    },
    {
      "name": "AlertDialog",
      "entry": "@fayegram-ai/faye-ui/overlays/alert-dialog",
      "guide": "/docs/dialogs/",
      "declaration": "packages/faye-ui/dist/overlays/alert-dialog.d.ts",
      "signature": null,
      "props": [],
      "parts": [
        {
          "name": "Root",
          "props": [
            {
              "name": "actionsRef",
              "optional": true,
              "type": "React.RefObject<DialogRootActions | null> | undefined",
              "description": "A ref to imperative actions.\n- `unmount`: Manually unmounts the alert dialog.\nCall this after any externally controlled closing animation finishes.\n- `close`: Closes the alert dialog imperatively when called."
            },
            {
              "name": "children",
              "optional": true,
              "type": "React.ReactNode | PayloadChildRenderFunction<Payload>",
              "description": "The content of the dialog.\nThis can be a regular React node or a render function that receives the `payload` of the active trigger."
            },
            {
              "name": "defaultOpen",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the dialog is initially open.\n\nTo render a controlled dialog, use the `open` prop instead."
            },
            {
              "name": "defaultTriggerId",
              "optional": true,
              "type": "string | null | undefined",
              "description": "ID of the trigger that the dialog is associated with.\nThis is useful in conjunction with the `defaultOpen` prop to create an initially open dialog."
            },
            {
              "name": "handle",
              "optional": true,
              "type": "AlertDialogHandle<Payload> | undefined",
              "description": "A handle to associate the alert dialog with a trigger.\nIf specified, allows external triggers to control the alert dialog's open state.\nCan be created with the AlertDialog.createHandle() method."
            },
            {
              "name": "onOpenChange",
              "optional": true,
              "type": "((open: boolean, eventDetails: AlertDialogRoot.ChangeEventDetails) => void) | undefined",
              "description": "Event handler called when the alert dialog is opened or closed."
            },
            {
              "name": "onOpenChangeComplete",
              "optional": true,
              "type": "((open: boolean) => void) | undefined",
              "description": "Event handler called after any animations complete when the dialog is opened or closed."
            },
            {
              "name": "open",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the dialog is currently open."
            },
            {
              "name": "triggerId",
              "optional": true,
              "type": "string | null | undefined",
              "description": "ID of the trigger that the dialog is associated with.\nThis is useful in conjunction with the `open` prop to create a controlled dialog.\nThere's no need to specify this prop when the dialog is uncontrolled (that is, when the `open` prop is not set)."
            }
          ]
        },
        {
          "name": "Trigger",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: DialogTriggerState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "handle",
              "optional": true,
              "type": "Base.Handle<unknown> | undefined",
              "description": "A handle to associate the trigger with an alert dialog.\nCan be created with the AlertDialog.createHandle() method."
            },
            {
              "name": "id",
              "optional": true,
              "type": "string | undefined",
              "description": "ID of the trigger. In addition to being forwarded to the rendered element,\nit is also used to specify the active trigger for the dialog in controlled mode (with the DialogRoot `triggerId` prop)."
            },
            {
              "name": "nativeButton",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component renders a native `<button>` element when replacing it\nvia the `render` prop.\nSet to `false` if the rendered element is not a button (for example, `<div>`)."
            },
            {
              "name": "payload",
              "optional": true,
              "type": "unknown",
              "description": "A payload to pass to the dialog when it is opened."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, DialogTriggerState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: DialogTriggerState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"alert-dialog\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"alert-dialog\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Backdrop",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: DialogBackdropState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "forceRender",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the backdrop is forced to render even when nested."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, DialogBackdropState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: DialogBackdropState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"alert-dialog\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"alert-dialog\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Popup",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: DialogPopupState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "finalFocus",
              "optional": true,
              "type": "boolean | RefObject<HTMLElement | null> | ((closeType: InteractionType) => boolean | HTMLElement | null | void) | undefined",
              "description": "Determines the element to focus when the dialog is closed.\n\n- `false`: Do not move focus.\n- `true`: Move focus based on the default behavior (trigger or previously focused element).\n- `RefObject`: Move focus to the ref element.\n- `function`: Called with the interaction type (`mouse`, `touch`, `pen`, or `keyboard`).\n  Return an element to focus, `true` to use the default behavior, `null` to fall back to the default behavior, or `false`/`undefined` to do nothing."
            },
            {
              "name": "initialFocus",
              "optional": true,
              "type": "boolean | RefObject<HTMLElement | null> | ((openType: InteractionType) => boolean | HTMLElement | null | void) | undefined",
              "description": "Determines the element to focus when the dialog is opened.\nBy default, focus moves to the first tabbable element inside the popup, except when the dialog\nis opened by touch — then the popup itself is focused to avoid opening the virtual keyboard.\n\n- `false`: Do not move focus.\n- `true`: Move focus based on the default behavior (first tabbable element or popup).\n- `RefObject`: Move focus to the ref element.\n- `function`: Called with the interaction type (`mouse`, `touch`, `pen`, or `keyboard`).\n  Return an element to focus, `true` to use the default behavior, `null` to fall back to the default behavior, or `false`/`undefined` to do nothing."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, DialogPopupState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: DialogPopupState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"alert-dialog\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"alert-dialog\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Title",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: DialogTitleState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, DialogTitleState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: DialogTitleState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"alert-dialog\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"alert-dialog\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Description",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: DialogDescriptionState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, DialogDescriptionState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: DialogDescriptionState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"alert-dialog\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"alert-dialog\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Close",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: DialogCloseState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "nativeButton",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component renders a native `<button>` element when replacing it\nvia the `render` prop.\nSet to `false` if the rendered element is not a button (for example, `<div>`)."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, DialogCloseState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: DialogCloseState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"alert-dialog\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"alert-dialog\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Viewport",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: DialogViewportState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, DialogViewportState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: DialogViewportState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"alert-dialog\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"alert-dialog\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Header",
          "props": [
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"alert-dialog\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"alert-dialog\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Body",
          "props": [
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"alert-dialog\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"alert-dialog\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Actions",
          "props": [
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"alert-dialog\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"alert-dialog\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Portal",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: DialogPortalState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "container",
              "optional": true,
              "type": "HTMLElement | ShadowRoot | RefObject<HTMLElement | ShadowRoot | null> | null | undefined",
              "description": "A parent element to render the portal element into."
            },
            {
              "name": "keepMounted",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to keep the portal mounted in the DOM while the popup is hidden."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, DialogPortalState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: DialogPortalState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            }
          ]
        }
      ],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-overlays-alert-dialog/#alertdialog",
      "api": "/api/packages/overlays/alert-dialog.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "surface-compositions",
          "title": "Cards, media and composed dialogs",
          "example": "surface-compositions",
          "source": "/examples/surface-compositions.tsx"
        },
        {
          "slug": "dialogs",
          "title": "Dialogs, modal and drawers",
          "example": "dialogs",
          "source": "/examples/dialogs.tsx"
        }
      ]
    },
    {
      "name": "AppBar",
      "entry": "@fayegram-ai/faye-ui/patterns/application-navigation",
      "guide": "/docs/patterns/",
      "declaration": "packages/faye-ui/dist/patterns/application-navigation.d.ts",
      "signature": "({ children, className, ...props }: HTMLAttributes<HTMLElement>): import(\"react\").JSX.Element",
      "props": [],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-patterns-application-navigation/#appbar",
      "api": "/api/packages/patterns/application-navigation.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "patterns",
          "title": "Application patterns",
          "example": "patterns",
          "source": "/examples/patterns.tsx"
        }
      ]
    },
    {
      "name": "AppShell",
      "entry": "@fayegram-ai/faye-ui/patterns/shell",
      "guide": "/docs/patterns/",
      "declaration": "packages/faye-ui/dist/patterns/shell.d.ts",
      "signature": "({ sidebar, header, footer, sidebarLabel, mainAs: Main, mainId, mainLabel, height, scroll, className, children, ...props }: AppShellProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "footer",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "header",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "height",
          "optional": true,
          "type": "\"content\" | \"parent\" | \"viewport\" | undefined",
          "description": "Viewport preserves the original default. Content is for embedded examples."
        },
        {
          "name": "mainAs",
          "optional": true,
          "type": "\"div\" | \"main\" | \"section\" | undefined",
          "description": ""
        },
        {
          "name": "mainId",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "mainLabel",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "scroll",
          "optional": true,
          "type": "\"document\" | \"workspace\" | undefined",
          "description": "Workspace gives the main region its own scroll container in a bounded shell."
        },
        {
          "name": "sidebar",
          "optional": false,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "sidebarLabel",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "Use a Drawer for narrow-screen navigation. Never hide the only navigation path.",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-patterns-shell/#appshell",
      "api": "/api/packages/patterns/shell.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "patterns",
          "title": "Application patterns",
          "example": "patterns",
          "source": "/examples/patterns.tsx"
        }
      ]
    },
    {
      "name": "AspectRatio",
      "entry": "@fayegram-ai/faye-ui/layout/layout",
      "guide": "/docs/layout/",
      "declaration": "packages/faye-ui/dist/layout/layout.d.ts",
      "signature": "({ ratio, style, className, ...props }: HTMLAttributes<HTMLDivElement> & { ratio?: number; }): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "ratio",
          "optional": true,
          "type": "number | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-layout-layout/#aspectratio",
      "api": "/api/packages/layout/layout.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "layout",
          "title": "Layout primitives",
          "example": "layout",
          "source": "/examples/layout.tsx"
        }
      ]
    },
    {
      "name": "Autocomplete",
      "entry": "@fayegram-ai/faye-ui/controls/autocomplete",
      "guide": "/docs/pickers/",
      "declaration": "packages/faye-ui/dist/controls/autocomplete.d.ts",
      "signature": null,
      "props": [],
      "parts": [
        {
          "name": "Root",
          "props": [
            {
              "name": "actionsRef",
              "optional": true,
              "type": "React.RefObject<AutocompleteRootActions | null> | undefined",
              "description": "A ref to imperative actions.\n- `unmount`: Manually unmounts the autocomplete.\nCall this after any externally controlled closing animation finishes."
            },
            {
              "name": "autoHighlight",
              "optional": true,
              "type": "boolean | \"always\" | undefined",
              "description": "Whether the first matching item is highlighted automatically.\n- `true`: highlight after the user types and keep the highlight while the query changes.\n- `'always'`: always highlight the first item."
            },
            {
              "name": "children",
              "optional": true,
              "type": "React.ReactNode",
              "description": ""
            },
            {
              "name": "defaultOpen",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the popup is initially open.\n\nTo render a controlled popup, use the `open` prop instead."
            },
            {
              "name": "defaultValue",
              "optional": true,
              "type": "string | number | readonly string[] | undefined",
              "description": "The uncontrolled input value of the autocomplete when it's initially rendered.\n\nTo render a controlled autocomplete, use the `value` prop instead."
            },
            {
              "name": "disabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component should ignore user interaction."
            },
            {
              "name": "filter",
              "optional": true,
              "type": "((item: Items[number][\"items\"][number], query: string, itemToString?: ((item: Items[number][\"items\"][number]) => string) | undefined) => boolean) | null | undefined",
              "description": "Filter function used to match items against the input query."
            },
            {
              "name": "filteredItems",
              "optional": true,
              "type": "readonly Items[number][\"items\"][number][] | readonly Group<Items[number][\"items\"][number]>[] | undefined",
              "description": "Filtered items to display in the list.\nWhen provided, the list uses these items instead of filtering the `items` prop internally.\nWhen `items` is also provided, this array must preserve its flat or grouped structure.\nNullish entries are not supported, as in `items`.\nUse when you want to control filtering logic externally with the `useFilter()` hook."
            },
            {
              "name": "form",
              "optional": true,
              "type": "string | undefined",
              "description": "Identifies the form that owns the internal input.\nUseful when the autocomplete is rendered outside the form."
            },
            {
              "name": "grid",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether list items are presented in a grid layout.\nWhen enabled, arrow keys navigate across rows and columns inferred from DOM rows."
            },
            {
              "name": "highlightItemOnHover",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether moving the pointer over items should highlight them.\nDisabling this prop allows CSS `:hover` to be differentiated from the `:focus` (`data-highlighted`) state."
            },
            {
              "name": "id",
              "optional": true,
              "type": "string | undefined",
              "description": "The id of the component."
            },
            {
              "name": "inline",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the list is rendered inline without using the component's own popup.\n\nSpecify `open` unconditionally in conjunction with this prop so the list is considered\nvisible: `<Autocomplete.Root inline open>`"
            },
            {
              "name": "inputRef",
              "optional": true,
              "type": "React.Ref<HTMLInputElement> | undefined",
              "description": "A ref to the hidden input element."
            },
            {
              "name": "items",
              "optional": false,
              "type": "Items",
              "description": "The items to be displayed in the list.\nCan be either a flat array of items or an array of groups with items.\nNullish entries are not supported: remove them from the data before passing it."
            },
            {
              "name": "itemToStringValue",
              "optional": true,
              "type": "((itemValue: Items[number][\"items\"][number]) => string) | undefined",
              "description": "When the item values are objects (`<Autocomplete.Item value={object}>`), this function converts the object value to a string representation for both display in the input and form submission.\nIf the shape of the object is `{ value, label }`, the label will be used automatically without needing to specify this prop."
            },
            {
              "name": "keepHighlight",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the highlighted item should be preserved when the pointer leaves the list."
            },
            {
              "name": "limit",
              "optional": true,
              "type": "number | undefined",
              "description": "The maximum number of items to display in the list."
            },
            {
              "name": "locale",
              "optional": true,
              "type": "Intl.LocalesArgument",
              "description": "The locale to use for string comparison.\nDefaults to the user's runtime locale."
            },
            {
              "name": "loopFocus",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to loop keyboard focus back to the input when the end of the list is reached while using the arrow keys. The first item can then be reached by pressing <kbd>ArrowDown</kbd> again from the input, or the last item can be reached by pressing <kbd>ArrowUp</kbd> from the input.\nThe input is always included in the focus loop per [ARIA Authoring Practices](https://www.w3.org/WAI/ARIA/apg/patterns/combobox/).\nWhen disabled, focus does not move when on the last element and the user presses <kbd>ArrowDown</kbd>, or when on the first element and the user presses <kbd>ArrowUp</kbd>."
            },
            {
              "name": "modal",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Determines if the popup enters a modal state when open.\n- `true`: user interaction is limited to the popup: document page scroll is locked and pointer interactions on outside elements are disabled.\n- `false`: user interaction with the rest of the document is allowed.\n\nOn touch devices, a `true` modal blocks outside taps but leaves the page scrollable unless the popup spans nearly the full viewport width, matching native iOS behavior."
            },
            {
              "name": "mode",
              "optional": true,
              "type": "\"list\" | \"none\" | \"inline\" | \"both\" | undefined",
              "description": "Controls how the autocomplete behaves with respect to list filtering and inline autocompletion.\n- `list` (default): items are dynamically filtered based on the input value. The input value does not change based on the active item.\n- `both`: items are dynamically filtered based on the input value, which will temporarily change based on the active item (inline autocompletion).\n- `inline`: items are static (not filtered), and the input value will temporarily change based on the active item (inline autocompletion).\n- `none`: items are static (not filtered), and the input value will not change based on the active item."
            },
            {
              "name": "name",
              "optional": true,
              "type": "string | undefined",
              "description": "Identifies the field when a form is submitted."
            },
            {
              "name": "onItemHighlighted",
              "optional": true,
              "type": "((highlightedValue: Items[number][\"items\"][number] | undefined, eventDetails: AutocompleteRootHighlightEventDetails) => void) | undefined",
              "description": "Callback fired when an item is highlighted or unhighlighted.\nReceives the highlighted item value (or `undefined` if no item is highlighted) and event details with a `reason` property describing why the highlight changed.\nThe `reason` can be:\n- `'keyboard'`: the highlight changed due to keyboard navigation.\n- `'pointer'`: the highlight changed due to pointer hovering.\n- `'none'`: the highlight changed programmatically."
            },
            {
              "name": "onOpenChange",
              "optional": true,
              "type": "((open: boolean, eventDetails: AutocompleteRootChangeEventDetails) => void) | undefined",
              "description": "Event handler called when the popup is opened or closed."
            },
            {
              "name": "onOpenChangeComplete",
              "optional": true,
              "type": "((open: boolean) => void) | undefined",
              "description": "Event handler called after any animations complete when the popup is opened or closed."
            },
            {
              "name": "onValueChange",
              "optional": true,
              "type": "((value: string, eventDetails: AutocompleteRootChangeEventDetails) => void) | undefined",
              "description": "Event handler called when the input value of the autocomplete changes."
            },
            {
              "name": "open",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the popup is currently open. Use when controlled."
            },
            {
              "name": "openOnInputClick",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the popup opens when clicking the input."
            },
            {
              "name": "readOnly",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the user should be unable to choose a different option from the popup."
            },
            {
              "name": "required",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the user must choose a value before submitting a form."
            },
            {
              "name": "submitOnItemClick",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether clicking an item should submit the autocomplete's owning form.\nBy default, clicking an item via a pointer or <kbd>Enter</kbd> key does not submit the owning form.\nUseful when the autocomplete is used as a single-field form search input."
            },
            {
              "name": "value",
              "optional": true,
              "type": "string | number | readonly string[] | undefined",
              "description": "The input value of the autocomplete. Use when controlled."
            },
            {
              "name": "virtualized",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the items are being externally virtualized."
            }
          ]
        },
        {
          "name": "List",
          "props": [
            {
              "name": "children",
              "optional": true,
              "type": "ReactNode | ((item: any, index: number) => React.ReactNode)",
              "description": ""
            },
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ComboboxListState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ComboboxListState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ComboboxListState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            }
          ]
        },
        {
          "name": "Collection",
          "props": [
            {
              "name": "children",
              "optional": false,
              "type": "(item: any, index: number) => React.ReactNode",
              "description": ""
            }
          ]
        },
        {
          "name": "Value",
          "props": [
            {
              "name": "children",
              "optional": true,
              "type": "React.ReactNode | ((value: string) => React.ReactNode)",
              "description": ""
            }
          ]
        },
        {
          "name": "Portal",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ComboboxPortalState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "container",
              "optional": true,
              "type": "HTMLElement | ShadowRoot | RefObject<HTMLElement | ShadowRoot | null> | null | undefined",
              "description": "A parent element to render the portal element into."
            },
            {
              "name": "keepMounted",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to keep the portal mounted in the DOM while the popup is hidden."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ComboboxPortalState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ComboboxPortalState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            }
          ]
        },
        {
          "name": "Input",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ComboboxInputState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "disabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component should ignore user interaction."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ComboboxInputState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ComboboxInputState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"autocomplete\", \"variant\"> | undefined; readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"autocomplete\", \"size\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "InputGroup",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: AutocompleteInputGroupState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, AutocompleteInputGroupState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: AutocompleteInputGroupState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"autocomplete\", \"variant\"> | undefined; readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"autocomplete\", \"size\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Trigger",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: AutocompleteTriggerState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "disabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component should ignore user interaction."
            },
            {
              "name": "nativeButton",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component renders a native `<button>` element when replacing it\nvia the `render` prop.\nSet to `false` if the rendered element is not a button (for example, `<div>`)."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, AutocompleteTriggerState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: AutocompleteTriggerState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"autocomplete\", \"variant\"> | undefined; readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"autocomplete\", \"size\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Icon",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ComboboxIconState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ComboboxIconState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ComboboxIconState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"autocomplete\", \"variant\"> | undefined; readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"autocomplete\", \"size\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Clear",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ComboboxClearState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "disabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component should ignore user interaction."
            },
            {
              "name": "keepMounted",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component should remain mounted in the DOM when not visible."
            },
            {
              "name": "nativeButton",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component renders a native `<button>` element when replacing it\nvia the `render` prop.\nSet to `false` if the rendered element is not a button (for example, `<div>`)."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ComboboxClearState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ComboboxClearState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"autocomplete\", \"variant\"> | undefined; readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"autocomplete\", \"size\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Backdrop",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ComboboxBackdropState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ComboboxBackdropState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ComboboxBackdropState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"autocomplete\", \"variant\"> | undefined; readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"autocomplete\", \"size\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Positioner",
          "props": [
            {
              "name": "align",
              "optional": true,
              "type": "Align | undefined",
              "description": "How to align the popup relative to the specified side."
            },
            {
              "name": "alignOffset",
              "optional": true,
              "type": "number | OffsetFunction | undefined",
              "description": "Additional offset along the alignment axis in pixels.\nAlso accepts a function that returns the offset to read the dimensions of the anchor\nand positioner elements, along with its side and alignment.\n\nThe function takes a `data` object parameter with the following properties:\n- `data.anchor`: the dimensions of the anchor element with properties `width` and `height`.\n- `data.positioner`: the dimensions of the positioner element with properties `width` and `height`.\n- `data.side`: which side of the anchor element the positioner is aligned against.\n- `data.align`: how the positioner is aligned relative to the specified side."
            },
            {
              "name": "anchor",
              "optional": true,
              "type": "Element | VirtualElement | RefObject<Element | null> | (() => Element | VirtualElement | null) | null | undefined",
              "description": "An element to position the popup against.\nBy default, the popup will be positioned against the trigger."
            },
            {
              "name": "arrowPadding",
              "optional": true,
              "type": "number | undefined",
              "description": "Minimum distance to maintain between the arrow and the edges of the popup.\n\nUse it to prevent the arrow element from hanging out of the rounded corners of a popup."
            },
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ComboboxPositionerState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "collisionAvoidance",
              "optional": true,
              "type": "CollisionAvoidance | undefined",
              "description": "Determines how to handle collisions when positioning the popup.\n\n`side` controls overflow on the preferred placement axis (`top`/`bottom` or `left`/`right`):\n- `'flip'`: keep the requested side when it fits; otherwise try the opposite side\n  (`top` and `bottom`, or `left` and `right`).\n- `'shift'`: never change side; keep the requested side and move the popup within\n  the clipping boundary so it stays visible.\n- `'none'`: do not correct side-axis overflow.\n\n`align` controls overflow on the alignment axis (`start`/`center`/`end`):\n- `'flip'`: keep side, but swap `start` and `end` when the requested alignment overflows.\n- `'shift'`: keep side and requested alignment, then nudge the popup along the\n  alignment axis to fit.\n- `'none'`: do not correct alignment-axis overflow.\n\n`fallbackAxisSide` controls fallback behavior on the perpendicular axis when the\npreferred axis cannot fit:\n- `'start'`: allow perpendicular fallback and try the logical start side first\n  (`top` before `bottom`, or `left` before `right` in LTR).\n- `'end'`: allow perpendicular fallback and try the logical end side first\n  (`bottom` before `top`, or `right` before `left` in LTR).\n- `'none'`: do not fallback to the perpendicular axis.\n\nWhen `side` is `'shift'`, explicitly setting `align` only supports `'shift'` or `'none'`.\nIf `align` is omitted, it defaults to `'flip'`."
            },
            {
              "name": "collisionBoundary",
              "optional": true,
              "type": "Boundary | undefined",
              "description": "An element or a rectangle that delimits the area that the popup is confined to."
            },
            {
              "name": "collisionPadding",
              "optional": true,
              "type": "Padding | undefined",
              "description": "Additional space to maintain from the edge of the collision boundary."
            },
            {
              "name": "disableAnchorTracking",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to disable the popup from tracking any layout shift of its positioning anchor."
            },
            {
              "name": "positionMethod",
              "optional": true,
              "type": "\"absolute\" | \"fixed\" | undefined",
              "description": "Determines which CSS `position` property to use."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ComboboxPositionerState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "side",
              "optional": true,
              "type": "Side | undefined",
              "description": "Which side of the anchor element to align the popup against.\nMay automatically change to avoid collisions."
            },
            {
              "name": "sideOffset",
              "optional": true,
              "type": "number | OffsetFunction | undefined",
              "description": "Distance between the anchor and the popup in pixels.\nAlso accepts a function that returns the distance to read the dimensions of the anchor\nand positioner elements, along with its side and alignment.\n\nThe function takes a `data` object parameter with the following properties:\n- `data.anchor`: the dimensions of the anchor element with properties `width` and `height`.\n- `data.positioner`: the dimensions of the positioner element with properties `width` and `height`.\n- `data.side`: which side of the anchor element the positioner is aligned against.\n- `data.align`: how the positioner is aligned relative to the specified side."
            },
            {
              "name": "sticky",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to maintain the popup in the viewport after\nthe anchor element was scrolled out of view."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ComboboxPositionerState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"autocomplete\", \"variant\"> | undefined; readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"autocomplete\", \"size\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Popup",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ComboboxPopupState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "finalFocus",
              "optional": true,
              "type": "boolean | RefObject<HTMLElement | null> | ((closeType: InteractionType) => void | boolean | HTMLElement | null) | undefined",
              "description": "Determines the element to focus when the popup is closed.\n\n- `false`: Do not move focus.\n- `true`: Move focus based on the default behavior (trigger or previously focused element).\n- `RefObject`: Move focus to the ref element.\n- `function`: Called with the interaction type (`mouse`, `touch`, `pen`, or `keyboard`).\n  Return an element to focus, `true` to use the default behavior, or `false`/`undefined` to do nothing."
            },
            {
              "name": "initialFocus",
              "optional": true,
              "type": "boolean | RefObject<HTMLElement | null> | ((openType: InteractionType) => void | boolean | HTMLElement | null) | undefined",
              "description": "Determines the element to focus when the popup is opened.\n\n- `false`: Do not move focus.\n- `true`: Move focus based on the default behavior (first tabbable element or popup).\n- `RefObject`: Move focus to the ref element.\n- `function`: Called with the interaction type (`mouse`, `touch`, `pen`, or `keyboard`).\n  Return an element to focus, `true` to use the default behavior, or `false`/`undefined` to do nothing."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ComboboxPopupState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ComboboxPopupState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"autocomplete\", \"variant\"> | undefined; readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"autocomplete\", \"size\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Arrow",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ComboboxArrowState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ComboboxArrowState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ComboboxArrowState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"autocomplete\", \"variant\"> | undefined; readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"autocomplete\", \"size\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Status",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ComboboxStatusState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ComboboxStatusState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ComboboxStatusState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"autocomplete\", \"variant\"> | undefined; readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"autocomplete\", \"size\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Empty",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ComboboxEmptyState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ComboboxEmptyState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ComboboxEmptyState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"autocomplete\", \"variant\"> | undefined; readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"autocomplete\", \"size\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Row",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ComboboxRowState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ComboboxRowState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ComboboxRowState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"autocomplete\", \"variant\"> | undefined; readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"autocomplete\", \"size\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Item",
          "props": [
            {
              "name": "children",
              "optional": true,
              "type": "ReactNode",
              "description": ""
            },
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: AutocompleteItemState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "disabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component should ignore user interaction."
            },
            {
              "name": "index",
              "optional": true,
              "type": "number | undefined",
              "description": "The index of the item in the list. Improves performance when specified by avoiding the need to calculate the index automatically from the DOM."
            },
            {
              "name": "nativeButton",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component renders a native `<button>` element when replacing it\nvia the `render` prop.\nSet to `true` if the rendered element is a native button."
            },
            {
              "name": "onClick",
              "optional": true,
              "type": "((event: BaseUIEvent<MouseEvent<HTMLDivElement, MouseEvent>>) => void) | undefined",
              "description": "An optional click handler for the item when selected.\nIt fires when clicking the item with the pointer, as well as when pressing `Enter` with the keyboard if the item is highlighted when the `Input` or `List` element has focus."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, AutocompleteItemState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: AutocompleteItemState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "value",
              "optional": true,
              "type": "any",
              "description": "A unique value that identifies this item."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"autocomplete\", \"variant\"> | undefined; readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"autocomplete\", \"size\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Group",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ComboboxGroupState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "items",
              "optional": true,
              "type": "readonly any[] | undefined",
              "description": "Items to be rendered within this group.\nWhen provided, child `Collection` components will use these items."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ComboboxGroupState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ComboboxGroupState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"autocomplete\", \"variant\"> | undefined; readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"autocomplete\", \"size\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "GroupLabel",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ComboboxGroupLabelState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ComboboxGroupLabelState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ComboboxGroupLabelState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"autocomplete\", \"variant\"> | undefined; readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"autocomplete\", \"size\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Separator",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: AutocompleteSeparatorState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "orientation",
              "optional": true,
              "type": "Orientation | undefined",
              "description": "The orientation of the separator."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, AutocompleteSeparatorState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: AutocompleteSeparatorState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"autocomplete\", \"variant\"> | undefined; readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"autocomplete\", \"size\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        }
      ],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-controls-autocomplete/#autocomplete",
      "api": "/api/packages/controls/autocomplete.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "pickers",
          "title": "Select and autocomplete",
          "example": "pickers",
          "source": "/examples/pickers.tsx"
        }
      ]
    },
    {
      "name": "AutosizeTextarea",
      "entry": "@fayegram-ai/faye-ui/controls/autosize-textarea",
      "guide": "/docs/fields/",
      "declaration": "packages/faye-ui/dist/controls/autosize-textarea.d.ts",
      "signature": "({ minRows, maxRows, ref, value, defaultValue, onChange, style, ...props }: AutosizeTextareaProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "invalid",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "maxRows",
          "optional": true,
          "type": "number | undefined",
          "description": ""
        },
        {
          "name": "minRows",
          "optional": true,
          "type": "number | undefined",
          "description": ""
        },
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLTextAreaElement> | undefined",
          "description": ""
        },
        {
          "name": "resize",
          "optional": true,
          "type": "\"vertical\" | \"none\" | \"both\" | undefined",
          "description": ""
        },
        {
          "name": "size",
          "optional": true,
          "type": "VisualVariant<\"textarea\", \"size\"> | undefined",
          "description": ""
        },
        {
          "name": "variant",
          "optional": true,
          "type": "VisualVariant<\"textarea\", \"variant\"> | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-controls-autosize-textarea/#autosizetextarea",
      "api": "/api/packages/controls/autosize-textarea.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "fields",
          "title": "Text fields and forms",
          "example": "fields",
          "source": "/examples/fields.tsx"
        }
      ]
    },
    {
      "name": "Avatar",
      "entry": "@fayegram-ai/faye-ui/display/avatar",
      "guide": "/docs/display/",
      "declaration": "packages/faye-ui/dist/display/avatar.d.ts",
      "signature": null,
      "props": [],
      "parts": [
        {
          "name": "Root",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: AvatarRootState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, AvatarRootState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: AvatarRootState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"avatar\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"avatar\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Image",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: AvatarImageState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "keepMounted",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the image element stays mounted and loads in place instead of being preloaded.\nSupports `loading=\"lazy\"` and optimized image components such as `next/image`."
            },
            {
              "name": "onLoadingStatusChange",
              "optional": true,
              "type": "((status: ImageLoadingStatus) => void) | undefined",
              "description": "Callback fired when the loading status changes."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<DetailedHTMLProps<ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, AvatarImageState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: AvatarImageState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"avatar\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"avatar\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Fallback",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: AvatarFallbackState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "delay",
              "optional": true,
              "type": "number | undefined",
              "description": "How long to wait before showing the fallback. Specified in milliseconds."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, AvatarFallbackState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: AvatarFallbackState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"avatar\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"avatar\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        }
      ],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-display-avatar/#avatar",
      "api": "/api/packages/display/avatar.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "surface-compositions",
          "title": "Cards, media and composed dialogs",
          "example": "surface-compositions",
          "source": "/examples/surface-compositions.tsx"
        },
        {
          "slug": "display",
          "title": "Tables, lists and display",
          "example": "display",
          "source": "/examples/display.tsx"
        }
      ]
    },
    {
      "name": "AvatarGroup",
      "entry": "@fayegram-ai/faye-ui/display/avatar-group",
      "guide": "/docs/display/",
      "declaration": "packages/faye-ui/dist/display/avatar-group.d.ts",
      "signature": "({ profile, max, children, total, remainderLabel, className, ...props }: HTMLAttributes<HTMLDivElement> & { profile?: ComponentProfile; max?: number; total?: number; remainderLabel?: (count: number) => string; children: ReactNode; }): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "children",
          "optional": false,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "max",
          "optional": true,
          "type": "number | undefined",
          "description": ""
        },
        {
          "name": "profile",
          "optional": true,
          "type": "ComponentProfile | undefined",
          "description": ""
        },
        {
          "name": "remainderLabel",
          "optional": true,
          "type": "((count: number) => string) | undefined",
          "description": ""
        },
        {
          "name": "total",
          "optional": true,
          "type": "number | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-display-avatar-group/#avatargroup",
      "api": "/api/packages/display/avatar-group.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "display",
          "title": "Tables, lists and display",
          "example": "display",
          "source": "/examples/display.tsx"
        }
      ]
    },
    {
      "name": "Backdrop",
      "entry": "@fayegram-ai/faye-ui/overlays/backdrop",
      "guide": "/docs/floating/",
      "declaration": "packages/faye-ui/dist/overlays/backdrop.d.ts",
      "signature": "({ className, ...props }: HTMLAttributes<HTMLDivElement>): import(\"react\").JSX.Element",
      "props": [],
      "parts": [],
      "description": "Visual primitive only. For modal dismissal and accessibility use Dialog.Backdrop.",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-overlays-backdrop/#backdrop",
      "api": "/api/packages/overlays/backdrop.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "floating",
          "title": "Portals and floating content",
          "example": "floating",
          "source": "/examples/floating.tsx"
        }
      ]
    },
    {
      "name": "Badge",
      "entry": "@fayegram-ai/faye-ui/feedback/badge",
      "guide": "/docs/feedback/",
      "declaration": "packages/faye-ui/dist/feedback/badge.d.ts",
      "signature": "({ profile, tone, dot, overflow, className, children, ...props }: BadgeProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "dot",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "overflow",
          "optional": true,
          "type": "\"nowrap\" | \"wrap\" | undefined",
          "description": "Short status labels stay on one line. Opt into wrapping for long content."
        },
        {
          "name": "profile",
          "optional": true,
          "type": "ComponentProfile | undefined",
          "description": ""
        },
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLSpanElement> | undefined",
          "description": ""
        },
        {
          "name": "tone",
          "optional": true,
          "type": "VisualVariant<\"badge\", \"tone\"> | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-feedback-badge/#badge",
      "api": "/api/packages/feedback/badge.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "surface-compositions",
          "title": "Cards, media and composed dialogs",
          "example": "surface-compositions",
          "source": "/examples/surface-compositions.tsx"
        },
        {
          "slug": "component-reference",
          "title": "Component reference",
          "example": "component-reference",
          "source": "/examples/component-reference.tsx"
        },
        {
          "slug": "feedback",
          "title": "Feedback and status",
          "example": "feedback",
          "source": "/examples/feedback.tsx"
        },
        {
          "slug": "consumer-experience",
          "title": "Interactive consumer experience",
          "example": "consumer-experience",
          "source": "/examples/consumer-experience.tsx"
        },
        {
          "slug": "display",
          "title": "Tables, lists and display",
          "example": "display",
          "source": "/examples/display.tsx"
        }
      ]
    },
    {
      "name": "BadgeIndicator",
      "entry": "@fayegram-ai/faye-ui/feedback/badge-indicator",
      "guide": "/docs/feedback/",
      "declaration": "packages/faye-ui/dist/feedback/badge-indicator.d.ts",
      "signature": "({ profile, className, children, count, maximum, dot, showZero, label, position, overlap, tone, ...props }: BadgeIndicatorProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "children",
          "optional": false,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "count",
          "optional": true,
          "type": "number | undefined",
          "description": ""
        },
        {
          "name": "dot",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "label",
          "optional": false,
          "type": "string",
          "description": ""
        },
        {
          "name": "maximum",
          "optional": true,
          "type": "number | undefined",
          "description": ""
        },
        {
          "name": "overlap",
          "optional": true,
          "type": "VisualVariant<\"badge-indicator\", \"overlap\"> | undefined",
          "description": "Circular artwork moves the badge inward to follow its perimeter."
        },
        {
          "name": "position",
          "optional": true,
          "type": "VisualVariant<\"badge-indicator\", \"position\"> | undefined",
          "description": ""
        },
        {
          "name": "profile",
          "optional": true,
          "type": "ComponentProfile | undefined",
          "description": ""
        },
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLSpanElement> | undefined",
          "description": ""
        },
        {
          "name": "showZero",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "tone",
          "optional": true,
          "type": "VisualVariant<\"badge-indicator\", \"tone\"> | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "Accessible text is caller supplied. The visual count is hidden from assistive technology.",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-feedback-badge-indicator/#badgeindicator",
      "api": "/api/packages/feedback/badge-indicator.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "functional-completion",
          "title": "Consumer interactions and navigation",
          "example": "functional-completion",
          "source": "/examples/functional-completion.tsx"
        },
        {
          "slug": "feedback",
          "title": "Feedback and status",
          "example": "feedback",
          "source": "/examples/feedback.tsx"
        }
      ]
    },
    {
      "name": "Bleed",
      "entry": "@fayegram-ai/faye-ui/layout/layout",
      "guide": "/docs/layout/",
      "declaration": "packages/faye-ui/dist/layout/layout.d.ts",
      "signature": "({ amount, style, ...props }: HTMLAttributes<HTMLDivElement> & { amount?: Space; }): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "amount",
          "optional": true,
          "type": "Space | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-layout-layout/#bleed",
      "api": "/api/packages/layout/layout.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "layout",
          "title": "Layout primitives",
          "example": "layout",
          "source": "/examples/layout.tsx"
        }
      ]
    },
    {
      "name": "BottomNavigation",
      "entry": "@fayegram-ai/faye-ui/patterns/application-navigation",
      "guide": "/docs/patterns/",
      "declaration": "packages/faye-ui/dist/patterns/application-navigation.d.ts",
      "signature": "({ items, current, label, className, ...props }: HTMLAttributes<HTMLElement> & { items: readonly NavigationItem[]; current?: string; label?: string; }): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "current",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "items",
          "optional": false,
          "type": "readonly NavigationItem[]",
          "description": ""
        },
        {
          "name": "label",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-patterns-application-navigation/#bottomnavigation",
      "api": "/api/packages/patterns/application-navigation.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "patterns",
          "title": "Application patterns",
          "example": "patterns",
          "source": "/examples/patterns.tsx"
        }
      ]
    },
    {
      "name": "Box",
      "entry": "@fayegram-ai/faye-ui/core/box",
      "guide": "/docs/foundations/",
      "declaration": "packages/faye-ui/dist/core/box.d.ts",
      "signature": "<E extends ElementType = \"div\">({ as, p, px, py, className, ...props }: BoxProps<E>): import(\"react\").ReactElement<any, string | import(\"react\").JSXElementConstructor<any>>",
      "props": [
        {
          "name": "as",
          "optional": true,
          "type": "E | undefined",
          "description": ""
        },
        {
          "name": "className",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "p",
          "optional": true,
          "type": "Space | undefined",
          "description": ""
        },
        {
          "name": "px",
          "optional": true,
          "type": "Space | undefined",
          "description": ""
        },
        {
          "name": "py",
          "optional": true,
          "type": "Space | undefined",
          "description": ""
        },
        {
          "name": "style",
          "optional": true,
          "type": "CSSProperties | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "No context or hooks: safe to execute in a Server Component.",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-core-box/#box",
      "api": "/api/packages/core/box.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "foundations",
          "title": "Typography and surfaces",
          "example": "foundations",
          "source": "/examples/foundations.tsx"
        }
      ]
    },
    {
      "name": "Breadcrumbs",
      "entry": "@fayegram-ai/faye-ui/navigation/breadcrumbs",
      "guide": "/docs/navigation/",
      "declaration": "packages/faye-ui/dist/navigation/breadcrumbs.d.ts",
      "signature": "({ items, label, separator: separatorContent, profile, className, ...props }: BreadcrumbsProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "items",
          "optional": false,
          "type": "readonly BreadcrumbItem[]",
          "description": ""
        },
        {
          "name": "label",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "profile",
          "optional": true,
          "type": "ComponentProfile | undefined",
          "description": ""
        },
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLElement> | undefined",
          "description": ""
        },
        {
          "name": "separator",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-navigation-breadcrumbs/#breadcrumbs",
      "api": "/api/packages/navigation/breadcrumbs.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "navigation",
          "title": "Navigation and disclosure",
          "example": "navigation",
          "source": "/examples/navigation.tsx"
        }
      ]
    },
    {
      "name": "Button",
      "entry": "@fayegram-ai/faye-ui/controls/button",
      "guide": "/docs/buttons/",
      "declaration": "packages/faye-ui/dist/controls/button.d.ts",
      "signature": "(input: ButtonProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "className",
          "optional": true,
          "type": "string | ((state: ButtonState) => string | undefined) | undefined",
          "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
        },
        {
          "name": "endIcon",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "focusableWhenDisabled",
          "optional": true,
          "type": "boolean | undefined",
          "description": "Whether the button should be focusable when disabled."
        },
        {
          "name": "fullWidth",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "nativeButton",
          "optional": true,
          "type": "boolean | undefined",
          "description": "Whether the component renders a native `<button>` element when replacing it\nvia the `render` prop.\nSet to `false` if the rendered element is not a button (for example, `<div>`)."
        },
        {
          "name": "pending",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "pendingIndicator",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "pendingPosition",
          "optional": true,
          "type": "\"center\" | \"start\" | \"end\" | undefined",
          "description": "Center replaces the label without a size change; start/end reserve an indicator slot."
        },
        {
          "name": "render",
          "optional": true,
          "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ButtonState> | undefined",
          "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
        },
        {
          "name": "size",
          "optional": true,
          "type": "ButtonSize | undefined",
          "description": ""
        },
        {
          "name": "startIcon",
          "optional": true,
          "type": "ReactNode",
          "description": "Decorative slots keep artwork and labels centered with the same gap on either side."
        },
        {
          "name": "style",
          "optional": true,
          "type": "CSSProperties | ((state: ButtonState) => React.CSSProperties | undefined) | undefined",
          "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
        },
        {
          "name": "tone",
          "optional": true,
          "type": "ButtonTone | undefined",
          "description": ""
        },
        {
          "name": "variant",
          "optional": true,
          "type": "ButtonVariant | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-controls-button/#button",
      "api": "/api/packages/controls/button.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "accessibility",
          "title": "Accessibility and input behavior",
          "example": "accessibility",
          "source": "/examples/accessibility.tsx"
        },
        {
          "slug": "advanced-fields",
          "title": "Advanced field compositions",
          "example": "advanced-fields",
          "source": "/examples/advanced-fields.tsx"
        },
        {
          "slug": "patterns",
          "title": "Application patterns",
          "example": "patterns",
          "source": "/examples/patterns.tsx"
        },
        {
          "slug": "async-workflows",
          "title": "Asynchronous workflows",
          "example": "async-workflows",
          "source": "/examples/async-workflows.tsx"
        },
        {
          "slug": "utilities",
          "title": "Browser and interaction utilities",
          "example": "utilities",
          "source": "/examples/utilities.tsx"
        },
        {
          "slug": "buttons",
          "title": "Buttons and actions",
          "example": "buttons",
          "source": "/examples/buttons.tsx"
        },
        {
          "slug": "surface-compositions",
          "title": "Cards, media and composed dialogs",
          "example": "surface-compositions",
          "source": "/examples/surface-compositions.tsx"
        },
        {
          "slug": "functional-completion",
          "title": "Consumer interactions and navigation",
          "example": "functional-completion",
          "source": "/examples/functional-completion.tsx"
        },
        {
          "slug": "customization",
          "title": "Customization sheets",
          "example": "customization",
          "source": "/examples/customization.tsx"
        },
        {
          "slug": "dialogs",
          "title": "Dialogs, modal and drawers",
          "example": "dialogs",
          "source": "/examples/dialogs.tsx"
        },
        {
          "slug": "feedback",
          "title": "Feedback and status",
          "example": "feedback",
          "source": "/examples/feedback.tsx"
        },
        {
          "slug": "consumer-experience",
          "title": "Interactive consumer experience",
          "example": "consumer-experience",
          "source": "/examples/consumer-experience.tsx"
        },
        {
          "slug": "localization",
          "title": "Localization",
          "example": "localization",
          "source": "/examples/localization.tsx"
        },
        {
          "slug": "menus",
          "title": "Menus and contextual actions",
          "example": "menus",
          "source": "/examples/menus.tsx"
        },
        {
          "slug": "interaction-compositions",
          "title": "Motion and interactive navigation",
          "example": "interaction-compositions",
          "source": "/examples/interaction-compositions.tsx"
        },
        {
          "slug": "motion",
          "title": "Motion and presence",
          "example": "motion",
          "source": "/examples/motion.tsx"
        },
        {
          "slug": "navigation",
          "title": "Navigation and disclosure",
          "example": "navigation",
          "source": "/examples/navigation.tsx"
        },
        {
          "slug": "floating",
          "title": "Portals and floating content",
          "example": "floating",
          "source": "/examples/floating.tsx"
        },
        {
          "slug": "pickers",
          "title": "Select and autocomplete",
          "example": "pickers",
          "source": "/examples/pickers.tsx"
        },
        {
          "slug": "fields",
          "title": "Text fields and forms",
          "example": "fields",
          "source": "/examples/fields.tsx"
        },
        {
          "slug": "theming",
          "title": "Theme and color system",
          "example": "theming",
          "source": "/examples/theming.tsx"
        },
        {
          "slug": "studio",
          "title": "Theme studio",
          "example": "studio",
          "source": "/examples/studio.tsx"
        }
      ]
    },
    {
      "name": "ButtonGroup",
      "entry": "@fayegram-ai/faye-ui/controls/button",
      "guide": "/docs/buttons/",
      "declaration": "packages/faye-ui/dist/controls/button.d.ts",
      "signature": "(input: ButtonGroupProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "orientation",
          "optional": true,
          "type": "\"horizontal\" | \"vertical\" | undefined",
          "description": ""
        },
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLDivElement> | undefined",
          "description": ""
        },
        {
          "name": "size",
          "optional": true,
          "type": "ButtonSize | undefined",
          "description": ""
        },
        {
          "name": "tone",
          "optional": true,
          "type": "ButtonTone | undefined",
          "description": ""
        },
        {
          "name": "variant",
          "optional": true,
          "type": "ButtonVariant | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-controls-button/#buttongroup",
      "api": "/api/packages/controls/button.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "buttons",
          "title": "Buttons and actions",
          "example": "buttons",
          "source": "/examples/buttons.tsx"
        }
      ]
    },
    {
      "name": "Card",
      "entry": "@fayegram-ai/faye-ui/core/surface",
      "guide": "/docs/foundations/",
      "declaration": "packages/faye-ui/dist/core/surface.d.ts",
      "signature": "({ profile, variant, padding, className, ...props }: SurfaceProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "padding",
          "optional": true,
          "type": "VisualVariant<\"surface\", \"padding\"> | undefined",
          "description": ""
        },
        {
          "name": "profile",
          "optional": true,
          "type": "ComponentProfile | undefined",
          "description": ""
        },
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLDivElement> | undefined",
          "description": ""
        },
        {
          "name": "variant",
          "optional": true,
          "type": "VisualVariant<\"surface\", \"variant\"> | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "Static cards use explicit profiles, including on their individual parts.",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-core-surface/#card",
      "api": "/api/packages/core/surface.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "surface-compositions",
          "title": "Cards, media and composed dialogs",
          "example": "surface-compositions",
          "source": "/examples/surface-compositions.tsx"
        },
        {
          "slug": "functional-completion",
          "title": "Consumer interactions and navigation",
          "example": "functional-completion",
          "source": "/examples/functional-completion.tsx"
        },
        {
          "slug": "consumer-experience",
          "title": "Interactive consumer experience",
          "example": "consumer-experience",
          "source": "/examples/consumer-experience.tsx"
        },
        {
          "slug": "interaction-compositions",
          "title": "Motion and interactive navigation",
          "example": "interaction-compositions",
          "source": "/examples/interaction-compositions.tsx"
        },
        {
          "slug": "foundations",
          "title": "Typography and surfaces",
          "example": "foundations",
          "source": "/examples/foundations.tsx"
        }
      ]
    },
    {
      "name": "CardActions",
      "entry": "@fayegram-ai/faye-ui/core/surface",
      "guide": "/docs/foundations/",
      "declaration": "packages/faye-ui/dist/core/surface.d.ts",
      "signature": "({ profile, className, ...props }: CardPartProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "profile",
          "optional": true,
          "type": "ComponentProfile | undefined",
          "description": ""
        },
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLDivElement> | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-core-surface/#cardactions",
      "api": "/api/packages/core/surface.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "surface-compositions",
          "title": "Cards, media and composed dialogs",
          "example": "surface-compositions",
          "source": "/examples/surface-compositions.tsx"
        }
      ]
    },
    {
      "name": "CardBody",
      "entry": "@fayegram-ai/faye-ui/core/surface",
      "guide": "/docs/foundations/",
      "declaration": "packages/faye-ui/dist/core/surface.d.ts",
      "signature": "({ profile, className, ...props }: CardPartProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "profile",
          "optional": true,
          "type": "ComponentProfile | undefined",
          "description": ""
        },
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLDivElement> | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-core-surface/#cardbody",
      "api": "/api/packages/core/surface.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "surface-compositions",
          "title": "Cards, media and composed dialogs",
          "example": "surface-compositions",
          "source": "/examples/surface-compositions.tsx"
        },
        {
          "slug": "functional-completion",
          "title": "Consumer interactions and navigation",
          "example": "functional-completion",
          "source": "/examples/functional-completion.tsx"
        },
        {
          "slug": "consumer-experience",
          "title": "Interactive consumer experience",
          "example": "consumer-experience",
          "source": "/examples/consumer-experience.tsx"
        },
        {
          "slug": "interaction-compositions",
          "title": "Motion and interactive navigation",
          "example": "interaction-compositions",
          "source": "/examples/interaction-compositions.tsx"
        },
        {
          "slug": "foundations",
          "title": "Typography and surfaces",
          "example": "foundations",
          "source": "/examples/foundations.tsx"
        }
      ]
    },
    {
      "name": "CardDescription",
      "entry": "@fayegram-ai/faye-ui/core/surface",
      "guide": "/docs/foundations/",
      "declaration": "packages/faye-ui/dist/core/surface.d.ts",
      "signature": "({ profile, className, ...props }: HTMLAttributes<HTMLParagraphElement> & { profile?: ComponentProfile; ref?: Ref<HTMLParagraphElement>; }): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "profile",
          "optional": true,
          "type": "ComponentProfile | undefined",
          "description": ""
        },
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLParagraphElement> | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-core-surface/#carddescription",
      "api": "/api/packages/core/surface.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "surface-compositions",
          "title": "Cards, media and composed dialogs",
          "example": "surface-compositions",
          "source": "/examples/surface-compositions.tsx"
        },
        {
          "slug": "functional-completion",
          "title": "Consumer interactions and navigation",
          "example": "functional-completion",
          "source": "/examples/functional-completion.tsx"
        },
        {
          "slug": "consumer-experience",
          "title": "Interactive consumer experience",
          "example": "consumer-experience",
          "source": "/examples/consumer-experience.tsx"
        }
      ]
    },
    {
      "name": "CardFooter",
      "entry": "@fayegram-ai/faye-ui/core/surface",
      "guide": "/docs/foundations/",
      "declaration": "packages/faye-ui/dist/core/surface.d.ts",
      "signature": "({ className, ...props }: CardPartProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "profile",
          "optional": true,
          "type": "ComponentProfile | undefined",
          "description": ""
        },
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLDivElement> | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "Compatibility name for the card's actions region.",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-core-surface/#cardfooter",
      "api": "/api/packages/core/surface.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "foundations",
          "title": "Typography and surfaces",
          "example": "foundations",
          "source": "/examples/foundations.tsx"
        }
      ]
    },
    {
      "name": "CardHeader",
      "entry": "@fayegram-ai/faye-ui/core/surface",
      "guide": "/docs/foundations/",
      "declaration": "packages/faye-ui/dist/core/surface.d.ts",
      "signature": "({ profile, avatar, action, className, children, ...props }: CardPartProps & { avatar?: ReactNode; action?: ReactNode; }): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "action",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "avatar",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "profile",
          "optional": true,
          "type": "ComponentProfile | undefined",
          "description": ""
        },
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLDivElement> | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-core-surface/#cardheader",
      "api": "/api/packages/core/surface.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "surface-compositions",
          "title": "Cards, media and composed dialogs",
          "example": "surface-compositions",
          "source": "/examples/surface-compositions.tsx"
        },
        {
          "slug": "functional-completion",
          "title": "Consumer interactions and navigation",
          "example": "functional-completion",
          "source": "/examples/functional-completion.tsx"
        },
        {
          "slug": "consumer-experience",
          "title": "Interactive consumer experience",
          "example": "consumer-experience",
          "source": "/examples/consumer-experience.tsx"
        },
        {
          "slug": "foundations",
          "title": "Typography and surfaces",
          "example": "foundations",
          "source": "/examples/foundations.tsx"
        }
      ]
    },
    {
      "name": "CardMedia",
      "entry": "@fayegram-ai/faye-ui/core/surface",
      "guide": "/docs/foundations/",
      "declaration": "packages/faye-ui/dist/core/surface.d.ts",
      "signature": "({ profile, className, ratio, style, children, ...props }: CardPartProps & { ratio?: number; }): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "profile",
          "optional": true,
          "type": "ComponentProfile | undefined",
          "description": ""
        },
        {
          "name": "ratio",
          "optional": true,
          "type": "number | undefined",
          "description": ""
        },
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLDivElement> | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-core-surface/#cardmedia",
      "api": "/api/packages/core/surface.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "surface-compositions",
          "title": "Cards, media and composed dialogs",
          "example": "surface-compositions",
          "source": "/examples/surface-compositions.tsx"
        },
        {
          "slug": "consumer-experience",
          "title": "Interactive consumer experience",
          "example": "consumer-experience",
          "source": "/examples/consumer-experience.tsx"
        }
      ]
    },
    {
      "name": "CardPrimaryAction",
      "entry": "@fayegram-ai/faye-ui/core/surface",
      "guide": "/docs/foundations/",
      "declaration": "packages/faye-ui/dist/core/surface.d.ts",
      "signature": "({ profile, className, ...props }: CardPrimaryActionProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "href",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "profile",
          "optional": true,
          "type": "ComponentProfile | undefined",
          "description": ""
        },
        {
          "name": "ref",
          "optional": true,
          "type": "((instance: HTMLAnchorElement | null) => void | (() => VoidOrUndefinedOnly) | DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | RefObject<HTMLAnchorElement | null> | ((instance: HTMLButtonElement | null) => void | (() => VoidOrUndefinedOnly) | DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | RefObject<HTMLButtonElement | null> | null | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "A stretched native primary control; actions in CardActions/Header.action remain independent.",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-core-surface/#cardprimaryaction",
      "api": "/api/packages/core/surface.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "surface-compositions",
          "title": "Cards, media and composed dialogs",
          "example": "surface-compositions",
          "source": "/examples/surface-compositions.tsx"
        }
      ]
    },
    {
      "name": "CardTitle",
      "entry": "@fayegram-ai/faye-ui/core/surface",
      "guide": "/docs/foundations/",
      "declaration": "packages/faye-ui/dist/core/surface.d.ts",
      "signature": "({ profile, className, level, ...props }: HTMLAttributes<HTMLHeadingElement> & { profile?: ComponentProfile; level?: 1 | 2 | 3 | 4 | 5 | 6; ref?: Ref<HTMLHeadingElement>; }): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "level",
          "optional": true,
          "type": "2 | 3 | 1 | 5 | 4 | 6 | undefined",
          "description": ""
        },
        {
          "name": "profile",
          "optional": true,
          "type": "ComponentProfile | undefined",
          "description": ""
        },
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLHeadingElement> | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-core-surface/#cardtitle",
      "api": "/api/packages/core/surface.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "surface-compositions",
          "title": "Cards, media and composed dialogs",
          "example": "surface-compositions",
          "source": "/examples/surface-compositions.tsx"
        },
        {
          "slug": "functional-completion",
          "title": "Consumer interactions and navigation",
          "example": "functional-completion",
          "source": "/examples/functional-completion.tsx"
        },
        {
          "slug": "consumer-experience",
          "title": "Interactive consumer experience",
          "example": "consumer-experience",
          "source": "/examples/consumer-experience.tsx"
        },
        {
          "slug": "interaction-compositions",
          "title": "Motion and interactive navigation",
          "example": "interaction-compositions",
          "source": "/examples/interaction-compositions.tsx"
        }
      ]
    },
    {
      "name": "Center",
      "entry": "@fayegram-ai/faye-ui/layout/layout",
      "guide": "/docs/layout/",
      "declaration": "packages/faye-ui/dist/layout/layout.d.ts",
      "signature": "(props: LayoutProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "align",
          "optional": true,
          "type": "Responsive<\"center\" | \"start\" | \"end\" | \"stretch\" | \"baseline\"> | undefined",
          "description": ""
        },
        {
          "name": "columnGap",
          "optional": true,
          "type": "Responsive<Space> | undefined",
          "description": "Overrides the horizontal gap independently of row spacing."
        },
        {
          "name": "gap",
          "optional": true,
          "type": "Responsive<Space> | undefined",
          "description": ""
        },
        {
          "name": "justify",
          "optional": true,
          "type": "Responsive<\"center\" | \"start\" | \"end\" | \"between\" | \"around\"> | undefined",
          "description": ""
        },
        {
          "name": "p",
          "optional": true,
          "type": "Responsive<Space> | undefined",
          "description": ""
        },
        {
          "name": "px",
          "optional": true,
          "type": "Responsive<Space> | undefined",
          "description": ""
        },
        {
          "name": "py",
          "optional": true,
          "type": "Responsive<Space> | undefined",
          "description": ""
        },
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLDivElement> | undefined",
          "description": ""
        },
        {
          "name": "rowGap",
          "optional": true,
          "type": "Responsive<Space> | undefined",
          "description": "Overrides the vertical gap, including between wrapped rows."
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-layout-layout/#center",
      "api": "/api/packages/layout/layout.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "layout",
          "title": "Layout primitives",
          "example": "layout",
          "source": "/examples/layout.tsx"
        }
      ]
    },
    {
      "name": "Checkbox",
      "entry": "@fayegram-ai/faye-ui/controls/checkbox",
      "guide": "/docs/selection/",
      "declaration": "packages/faye-ui/dist/controls/checkbox.d.ts",
      "signature": null,
      "props": [],
      "parts": [
        {
          "name": "Root",
          "props": [
            {
              "name": "checked",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the checkbox is currently ticked.\n\nTo render an uncontrolled checkbox, use the `defaultChecked` prop instead."
            },
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: CheckboxRootState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "defaultChecked",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the checkbox is initially ticked.\n\nTo render a controlled checkbox, use the `checked` prop instead."
            },
            {
              "name": "disabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component should ignore user interaction."
            },
            {
              "name": "form",
              "optional": true,
              "type": "string | undefined",
              "description": "Identifies the form that owns the hidden input.\nUseful when the checkbox is rendered outside the form."
            },
            {
              "name": "id",
              "optional": true,
              "type": "string | undefined",
              "description": "The id of the input element."
            },
            {
              "name": "indeterminate",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the checkbox is in a mixed state: neither ticked, nor unticked."
            },
            {
              "name": "inputRef",
              "optional": true,
              "type": "Ref<HTMLInputElement> | undefined",
              "description": "A ref to access the hidden `<input>` element."
            },
            {
              "name": "name",
              "optional": true,
              "type": "string | undefined",
              "description": "Identifies the field when a form is submitted."
            },
            {
              "name": "nativeButton",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component renders a native `<button>` element when replacing it\nvia the `render` prop.\nSet to `true` if the rendered element is a native button."
            },
            {
              "name": "onCheckedChange",
              "optional": true,
              "type": "((checked: boolean, eventDetails: CheckboxRootChangeEventDetails) => void) | undefined",
              "description": "Event handler called when the checkbox is ticked or unticked."
            },
            {
              "name": "parent",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the checkbox controls a group of child checkboxes.\n\nMust be used in a [Checkbox Group](https://base-ui.com/react/components/checkbox-group)."
            },
            {
              "name": "readOnly",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the user should be unable to tick or untick the checkbox."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, CheckboxRootState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "required",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the user must tick the checkbox before submitting a form."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: CheckboxRootState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "uncheckedValue",
              "optional": true,
              "type": "string | undefined",
              "description": "The value submitted with the form when the checkbox is unchecked.\nBy default, unchecked checkboxes do not submit any value, matching native checkbox behavior."
            },
            {
              "name": "value",
              "optional": true,
              "type": "string | undefined",
              "description": "The checkbox's value. Identifies it within a [Checkbox Group](https://base-ui.com/react/components/checkbox-group), falling back to `name` when omitted.\nWhen submitting a form, a checked box submits `value`; with no `value`, it submits the native \"on\"."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"checkbox\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"checkbox\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Indicator",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: CheckboxIndicatorState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "keepMounted",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to keep the element in the DOM when the checkbox is not checked."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, CheckboxIndicatorState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: CheckboxIndicatorState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"checkbox\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"checkbox\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        }
      ],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-controls-checkbox/#checkbox",
      "api": "/api/packages/controls/checkbox.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "async-workflows",
          "title": "Asynchronous workflows",
          "example": "async-workflows",
          "source": "/examples/async-workflows.tsx"
        },
        {
          "slug": "selection",
          "title": "Checkboxes, radios and switches",
          "example": "selection",
          "source": "/examples/selection.tsx"
        },
        {
          "slug": "customization",
          "title": "Customization sheets",
          "example": "customization",
          "source": "/examples/customization.tsx"
        }
      ]
    },
    {
      "name": "CheckboxGroup",
      "entry": "@fayegram-ai/faye-ui/controls/checkbox-group",
      "guide": "/docs/selection/",
      "declaration": "packages/faye-ui/dist/controls/checkbox-group.d.ts",
      "signature": "(input: Omit<import(\"@base-ui/react\").CheckboxGroupProps, \"ref\"> & import(\"react\").RefAttributes<HTMLDivElement> & { variants?: Readonly<Record<string, string>> | undefined; }): import(\"react\").ReactElement",
      "props": [
        {
          "name": "allValues",
          "optional": true,
          "type": "string[] | undefined",
          "description": "Names of all checkboxes in the group. Use this when creating a parent checkbox."
        },
        {
          "name": "className",
          "optional": true,
          "type": "string | ((state: CheckboxGroupState) => string | undefined) | undefined",
          "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
        },
        {
          "name": "defaultValue",
          "optional": true,
          "type": "string[] | undefined",
          "description": "Names of the checkboxes in the group that should be initially ticked.\n\nTo render a controlled checkbox group, use the `value` prop instead."
        },
        {
          "name": "disabled",
          "optional": true,
          "type": "boolean | undefined",
          "description": "Whether the component should ignore user interaction."
        },
        {
          "name": "onValueChange",
          "optional": true,
          "type": "((value: string[], eventDetails: CheckboxGroupChangeEventDetails) => void) | undefined",
          "description": "Event handler called when a checkbox in the group is ticked or unticked.\nProvides the new value as an argument."
        },
        {
          "name": "render",
          "optional": true,
          "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, CheckboxGroupState> | undefined",
          "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
        },
        {
          "name": "style",
          "optional": true,
          "type": "CSSProperties | ((state: CheckboxGroupState) => React.CSSProperties | undefined) | undefined",
          "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
        },
        {
          "name": "value",
          "optional": true,
          "type": "string[] | undefined",
          "description": "Names of the checkboxes in the group that should be ticked.\n\nTo render an uncontrolled checkbox group, use the `defaultValue` prop instead."
        },
        {
          "name": "variants",
          "optional": true,
          "type": "Readonly<Record<string, string>> | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-controls-checkbox-group/#checkboxgroup",
      "api": "/api/packages/controls/checkbox-group.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "selection",
          "title": "Checkboxes, radios and switches",
          "example": "selection",
          "source": "/examples/selection.tsx"
        }
      ]
    },
    {
      "name": "Chip",
      "entry": "@fayegram-ai/faye-ui/controls/chip",
      "guide": "/docs/buttons/",
      "declaration": "packages/faye-ui/dist/controls/chip.d.ts",
      "signature": "(input: ChipProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "children",
          "optional": false,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "disabled",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "href",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "leading",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "onClick",
          "optional": true,
          "type": "MouseEventHandler<HTMLButtonElement | HTMLAnchorElement> | undefined",
          "description": ""
        },
        {
          "name": "onRemove",
          "optional": true,
          "type": "(() => void) | undefined",
          "description": ""
        },
        {
          "name": "overflow",
          "optional": true,
          "type": "\"nowrap\" | \"wrap\" | undefined",
          "description": ""
        },
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLSpanElement> | undefined",
          "description": ""
        },
        {
          "name": "rel",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "removeLabel",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "selected",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "size",
          "optional": true,
          "type": "\"sm\" | \"md\" | undefined",
          "description": ""
        },
        {
          "name": "target",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "tone",
          "optional": true,
          "type": "VisualVariant<\"chip\", \"tone\"> | undefined",
          "description": ""
        },
        {
          "name": "trailing",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "variant",
          "optional": true,
          "type": "\"soft\" | \"outline\" | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "Primary action/link and removal are sibling controls; a passive chip stays out of the tab order.",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-controls-chip/#chip",
      "api": "/api/packages/controls/chip.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "advanced-fields",
          "title": "Advanced field compositions",
          "example": "advanced-fields",
          "source": "/examples/advanced-fields.tsx"
        },
        {
          "slug": "buttons",
          "title": "Buttons and actions",
          "example": "buttons",
          "source": "/examples/buttons.tsx"
        },
        {
          "slug": "localization",
          "title": "Localization",
          "example": "localization",
          "source": "/examples/localization.tsx"
        }
      ]
    },
    {
      "name": "CircularProgress",
      "entry": "@fayegram-ai/faye-ui/feedback/circular-progress",
      "guide": "/docs/feedback/",
      "declaration": "packages/faye-ui/dist/feedback/circular-progress.d.ts",
      "signature": "({ value, min, max, label, size, profile, className, ...props }: CircularProgressProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "label",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "max",
          "optional": true,
          "type": "number | undefined",
          "description": ""
        },
        {
          "name": "min",
          "optional": true,
          "type": "number | undefined",
          "description": ""
        },
        {
          "name": "profile",
          "optional": true,
          "type": "ComponentProfile | undefined",
          "description": ""
        },
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLSpanElement> | undefined",
          "description": ""
        },
        {
          "name": "size",
          "optional": true,
          "type": "\"sm\" | \"md\" | \"lg\" | undefined",
          "description": ""
        },
        {
          "name": "value",
          "optional": true,
          "type": "number | null | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "Server-safe progress; null represents an unknown duration, never a false percentage.",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-feedback-circular-progress/#circularprogress",
      "api": "/api/packages/feedback/circular-progress.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "feedback",
          "title": "Feedback and status",
          "example": "feedback",
          "source": "/examples/feedback.tsx"
        },
        {
          "slug": "consumer-experience",
          "title": "Interactive consumer experience",
          "example": "consumer-experience",
          "source": "/examples/consumer-experience.tsx"
        }
      ]
    },
    {
      "name": "ClickAwayListener",
      "entry": "@fayegram-ai/faye-ui/hooks/click-away",
      "guide": "/docs/utilities/",
      "declaration": "packages/faye-ui/dist/hooks/click-away.d.ts",
      "signature": "({ onClickAway, enabled, branches, ownerDocument, children, ...props }: ClickAwayListenerProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "branches",
          "optional": true,
          "type": "readonly RefObject<Element | null>[] | undefined",
          "description": "Include portalled branches explicitly; DOM ancestry alone does not identify them."
        },
        {
          "name": "enabled",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "onClickAway",
          "optional": false,
          "type": "(event: PointerEvent) => void",
          "description": ""
        },
        {
          "name": "ownerDocument",
          "optional": true,
          "type": "Document | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "A structural wrapper for custom surfaces. Do not add a second dismiss listener to Base UI overlays.",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-hooks-click-away/#clickawaylistener",
      "api": "/api/packages/hooks/click-away.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "floating",
          "title": "Portals and floating content",
          "example": "floating",
          "source": "/examples/floating.tsx"
        }
      ]
    },
    {
      "name": "ClientOnly",
      "entry": "@fayegram-ai/faye-ui/hooks/client-only",
      "guide": "/docs/utilities/",
      "declaration": "packages/faye-ui/dist/hooks/client-only.d.ts",
      "signature": "({ children, fallback }: { children: ReactNode | (() => ReactNode); fallback?: ReactNode; }): ReactNode",
      "props": [
        {
          "name": "children",
          "optional": false,
          "type": "ReactNode | (() => ReactNode)",
          "description": ""
        },
        {
          "name": "fallback",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        }
      ],
      "parts": [],
      "description": "Opt-in browser-only boundary. Never use it to silently bypass a component's SSR contract.",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-hooks-client-only/#clientonly",
      "api": "/api/packages/hooks/client-only.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "utilities",
          "title": "Browser and interaction utilities",
          "example": "utilities",
          "source": "/examples/utilities.tsx"
        }
      ]
    },
    {
      "name": "Cluster",
      "entry": "@fayegram-ai/faye-ui/layout/layout",
      "guide": "/docs/layout/",
      "declaration": "packages/faye-ui/dist/layout/layout.d.ts",
      "signature": "(props: LayoutProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "align",
          "optional": true,
          "type": "Responsive<\"center\" | \"start\" | \"end\" | \"stretch\" | \"baseline\"> | undefined",
          "description": ""
        },
        {
          "name": "columnGap",
          "optional": true,
          "type": "Responsive<Space> | undefined",
          "description": "Overrides the horizontal gap independently of row spacing."
        },
        {
          "name": "gap",
          "optional": true,
          "type": "Responsive<Space> | undefined",
          "description": ""
        },
        {
          "name": "justify",
          "optional": true,
          "type": "Responsive<\"center\" | \"start\" | \"end\" | \"between\" | \"around\"> | undefined",
          "description": ""
        },
        {
          "name": "p",
          "optional": true,
          "type": "Responsive<Space> | undefined",
          "description": ""
        },
        {
          "name": "px",
          "optional": true,
          "type": "Responsive<Space> | undefined",
          "description": ""
        },
        {
          "name": "py",
          "optional": true,
          "type": "Responsive<Space> | undefined",
          "description": ""
        },
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLDivElement> | undefined",
          "description": ""
        },
        {
          "name": "rowGap",
          "optional": true,
          "type": "Responsive<Space> | undefined",
          "description": "Overrides the vertical gap, including between wrapped rows."
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-layout-layout/#cluster",
      "api": "/api/packages/layout/layout.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "layout",
          "title": "Layout primitives",
          "example": "layout",
          "source": "/examples/layout.tsx"
        }
      ]
    },
    {
      "name": "Code",
      "entry": "@fayegram-ai/faye-ui/core/code",
      "guide": "/docs/foundations/",
      "declaration": "packages/faye-ui/dist/core/code.d.ts",
      "signature": "({ className, ...props }: HTMLAttributes<HTMLElement>): import(\"react\").JSX.Element",
      "props": [],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-core-code/#code",
      "api": "/api/packages/core/code.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "foundations",
          "title": "Typography and surfaces",
          "example": "foundations",
          "source": "/examples/foundations.tsx"
        }
      ]
    },
    {
      "name": "Collapse",
      "entry": "@fayegram-ai/faye-ui/motion/presence",
      "guide": "/docs/motion/",
      "declaration": "packages/faye-ui/dist/motion/presence.d.ts",
      "signature": "(props: Omit<PresenceProps, \"effect\">): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "appear",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "container",
          "optional": true,
          "type": "HTMLElement | RefObject<HTMLElement | null> | null | undefined",
          "description": "Optional boundary to slide fully outside instead of using the small default offset."
        },
        {
          "name": "direction",
          "optional": true,
          "type": "\"start\" | \"end\" | \"left\" | \"right\" | \"up\" | \"down\" | undefined",
          "description": "Slide starts at this edge; start/end follow computed text direction."
        },
        {
          "name": "enterDuration",
          "optional": true,
          "type": "number | undefined",
          "description": ""
        },
        {
          "name": "exitDuration",
          "optional": true,
          "type": "number | undefined",
          "description": ""
        },
        {
          "name": "keepMounted",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "onExitComplete",
          "optional": true,
          "type": "(() => void) | undefined",
          "description": ""
        },
        {
          "name": "orientation",
          "optional": true,
          "type": "\"horizontal\" | \"vertical\" | undefined",
          "description": ""
        },
        {
          "name": "present",
          "optional": false,
          "type": "boolean",
          "description": ""
        },
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLDivElement> | undefined",
          "description": ""
        },
        {
          "name": "scaleOrigin",
          "optional": true,
          "type": "Property.TransformOrigin<string | number> | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-motion-presence/#collapse",
      "api": "/api/packages/motion/presence.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "interaction-compositions",
          "title": "Motion and interactive navigation",
          "example": "interaction-compositions",
          "source": "/examples/interaction-compositions.tsx"
        },
        {
          "slug": "motion",
          "title": "Motion and presence",
          "example": "motion",
          "source": "/examples/motion.tsx"
        }
      ]
    },
    {
      "name": "CollapsedBreadcrumbs",
      "entry": "@fayegram-ai/faye-ui/patterns/collapsed-breadcrumbs",
      "guide": "/docs/patterns/",
      "declaration": "packages/faye-ui/dist/patterns/collapsed-breadcrumbs.d.ts",
      "signature": "({ items, maxItems, beforeCollapse, afterCollapse, expandLabel, ...props }: CollapsedBreadcrumbsProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "afterCollapse",
          "optional": true,
          "type": "number | undefined",
          "description": ""
        },
        {
          "name": "beforeCollapse",
          "optional": true,
          "type": "number | undefined",
          "description": ""
        },
        {
          "name": "expandLabel",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "items",
          "optional": false,
          "type": "readonly BreadcrumbItem[]",
          "description": ""
        },
        {
          "name": "label",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "maxItems",
          "optional": true,
          "type": "number | undefined",
          "description": ""
        },
        {
          "name": "profile",
          "optional": true,
          "type": "ComponentProfile | undefined",
          "description": ""
        },
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLElement> | undefined",
          "description": ""
        },
        {
          "name": "separator",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        }
      ],
      "parts": [],
      "description": "Hidden ancestors remain navigable; Menu restores focus to the expansion control.",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-patterns-collapsed-breadcrumbs/#collapsedbreadcrumbs",
      "api": "/api/packages/patterns/collapsed-breadcrumbs.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "functional-completion",
          "title": "Consumer interactions and navigation",
          "example": "functional-completion",
          "source": "/examples/functional-completion.tsx"
        }
      ]
    },
    {
      "name": "Collapsible",
      "entry": "@fayegram-ai/faye-ui/navigation/collapsible",
      "guide": "/docs/navigation/",
      "declaration": "packages/faye-ui/dist/navigation/collapsible.d.ts",
      "signature": null,
      "props": [],
      "parts": [
        {
          "name": "Root",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: CollapsibleRootState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "defaultOpen",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the collapsible panel is initially open.\n\nTo render a controlled collapsible, use the `open` prop instead."
            },
            {
              "name": "disabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component should ignore user interaction."
            },
            {
              "name": "onOpenChange",
              "optional": true,
              "type": "((open: boolean, eventDetails: CollapsibleRootChangeEventDetails) => void) | undefined",
              "description": "Event handler called when the panel is opened or closed."
            },
            {
              "name": "open",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the collapsible panel is currently open.\n\nTo render an uncontrolled collapsible, use the `defaultOpen` prop instead."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, CollapsibleRootState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: CollapsibleRootState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"collapsible\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"collapsible\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Trigger",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: CollapsibleTriggerState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "nativeButton",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component renders a native `<button>` element when replacing it\nvia the `render` prop.\nSet to `false` if the rendered element is not a button (for example, `<div>`)."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, CollapsibleTriggerState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: CollapsibleTriggerState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"collapsible\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"collapsible\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Panel",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: CollapsiblePanelState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "hiddenUntilFound",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Allows the browser's built-in page search to find and expand the panel contents.\n\nOverrides the `keepMounted` prop and uses `hidden=\"until-found\"`\nto hide the element without removing it from the DOM."
            },
            {
              "name": "keepMounted",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to keep the element in the DOM while the panel is hidden.\nThis prop is ignored when `hiddenUntilFound` is used."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, CollapsiblePanelState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: CollapsiblePanelState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"collapsible\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"collapsible\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        }
      ],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-navigation-collapsible/#collapsible",
      "api": "/api/packages/navigation/collapsible.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "navigation",
          "title": "Navigation and disclosure",
          "example": "navigation",
          "source": "/examples/navigation.tsx"
        }
      ]
    },
    {
      "name": "CollectedStyles",
      "entry": "@fayegram-ai/faye-ui/runtime-styles/server",
      "guide": "/docs/runtime-styles/",
      "declaration": "packages/faye-ui/dist/runtime-styles/server.d.ts",
      "signature": "({ entries, nonce }: { entries: readonly StyleEntry[]; nonce?: string; }): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "entries",
          "optional": false,
          "type": "readonly StyleEntry[]",
          "description": ""
        },
        {
          "name": "nonce",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "Precollect before first flush. Suspended dynamic rules need a framework-specific flush adapter.",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-runtime-styles-server/#collectedstyles",
      "api": "/api/packages/runtime-styles/server.json",
      "clientBoundary": false,
      "pages": []
    },
    {
      "name": "Combobox",
      "entry": "@fayegram-ai/faye-ui/controls/combobox",
      "guide": "/docs/pickers/",
      "declaration": "packages/faye-ui/dist/controls/combobox.d.ts",
      "signature": null,
      "props": [],
      "parts": [
        {
          "name": "Root",
          "props": [
            {
              "name": "actionsRef",
              "optional": true,
              "type": "React.RefObject<AriaCombobox.Actions | null> | undefined",
              "description": "A ref to imperative actions.\n- `unmount`: Manually unmounts the combobox.\nCall this after any externally controlled closing animation finishes."
            },
            {
              "name": "autoComplete",
              "optional": true,
              "type": "string | undefined",
              "description": "Provides a hint to the browser for autofill."
            },
            {
              "name": "autoHighlight",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the first matching item is highlighted automatically while filtering."
            },
            {
              "name": "children",
              "optional": true,
              "type": "React.ReactNode",
              "description": ""
            },
            {
              "name": "defaultInputValue",
              "optional": true,
              "type": "string | number | readonly string[] | undefined",
              "description": "The uncontrolled input value when initially rendered.\n\nTo render a controlled input, use the `inputValue` prop instead."
            },
            {
              "name": "defaultOpen",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the popup is initially open.\n\nTo render a controlled popup, use the `open` prop instead."
            },
            {
              "name": "defaultValue",
              "optional": true,
              "type": "ComboboxValueType<Value, Multiple> | null | undefined",
              "description": "The uncontrolled selected value of the combobox when it's initially rendered.\n\nTo render a controlled combobox, use the `value` prop instead."
            },
            {
              "name": "disabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component should ignore user interaction."
            },
            {
              "name": "filter",
              "optional": true,
              "type": "((item: Item, query: string, itemToString?: ((item: Item) => string) | undefined) => boolean) | null | undefined",
              "description": "Filter function used to match items vs input query.\nReceives the source item, which is the derived value's item when `items` is a `createItems()`\ncollection, and the item itself otherwise."
            },
            {
              "name": "filteredItems",
              "optional": true,
              "type": "readonly Item[] | readonly Group<Item>[] | undefined",
              "description": "Filtered items to display in the list.\nWhen provided, the list uses these items instead of filtering the `items` prop internally.\nWhen `items` is also provided, this array must preserve its flat or grouped structure.\nWith a `createItems()` collection, pass source items rather than derived values.\nNullish entries are not supported, as in `items`.\nUse when you want to control filtering logic externally with the `useFilter()` hook."
            },
            {
              "name": "form",
              "optional": true,
              "type": "string | undefined",
              "description": "Identifies the form that owns the internal input.\nUseful when the combobox is rendered outside the form."
            },
            {
              "name": "grid",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether list items are presented in a grid layout.\nWhen enabled, arrow keys navigate across rows and columns inferred from DOM rows."
            },
            {
              "name": "highlightItemOnHover",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether moving the pointer over items should highlight them.\nDisabling this prop allows CSS `:hover` to be differentiated from the `:focus` (`data-highlighted`) state."
            },
            {
              "name": "id",
              "optional": true,
              "type": "string | undefined",
              "description": "The id of the component."
            },
            {
              "name": "inline",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the list is rendered inline without using the component's own popup.\n\nSpecify `open` unconditionally in conjunction with this prop so the list is considered\nvisible: `<Combobox.Root inline open>`\n\nIn a `Combobox.Root` > `Dialog.Root` composition, bind the Combobox's `open` and\n`onOpenChange` props to the `Dialog`'s `open` and `onOpenChange` state instead so the\ncomponent resets its transient state (filter query, highlighted item, and input value) when\nthe dialog closes."
            },
            {
              "name": "inputRef",
              "optional": true,
              "type": "React.Ref<HTMLInputElement> | undefined",
              "description": "A ref to the hidden input element."
            },
            {
              "name": "inputValue",
              "optional": true,
              "type": "string | number | readonly string[] | undefined",
              "description": "The input value of the combobox. Use when controlled."
            },
            {
              "name": "isItemEqualToValue",
              "optional": true,
              "type": "((itemValue: Value, value: Value) => boolean) | undefined",
              "description": "Custom comparison logic used to determine if a combobox item value matches the current selected value. Useful when item values are objects without matching referentially.\nWith a `createItems()` collection, both arguments are derived values.\nDefaults to `Object.is` comparison."
            },
            {
              "name": "items",
              "optional": true,
              "type": "readonly any[] | readonly Group<any>[] | ComboboxItemCollection<Item, Value> | undefined",
              "description": "The items to be displayed in the list.\nCan be a flat array of items, an array of groups with items, or a collection created by\nthe `createItems()` function, which derives each item's selection value and label.\nNullish entries are not supported: remove them from the data before passing it."
            },
            {
              "name": "itemToStringLabel",
              "optional": true,
              "type": "((itemValue: Value) => string) | undefined",
              "description": "When the item values are objects (`<Combobox.Item value={object}>`), this function converts the object value to a string representation for display in the input.\nIf the shape of the object is `{ value, label }`, the label will be used automatically without needing to specify this prop.\nWith a `createItems()` collection, this receives the derived value, and the collection's\n`getLabel` takes precedence for values it can resolve."
            },
            {
              "name": "itemToStringValue",
              "optional": true,
              "type": "((itemValue: Value) => string) | undefined",
              "description": "When the item values are objects (`<Combobox.Item value={object}>`), this function converts the object value to a string representation for form submission.\nIf the shape of the object is `{ value, label }`, the value will be used automatically without needing to specify this prop.\nWith a `createItems()` collection, this receives the derived value."
            },
            {
              "name": "limit",
              "optional": true,
              "type": "number | undefined",
              "description": "The maximum number of items to display in the list."
            },
            {
              "name": "locale",
              "optional": true,
              "type": "Intl.LocalesArgument",
              "description": "The locale to use for string comparison.\nDefaults to the user's runtime locale."
            },
            {
              "name": "loopFocus",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to loop keyboard focus back to the input when the end of the list is reached while using the arrow keys. The first item can then be reached by pressing <kbd>ArrowDown</kbd> again from the input, or the last item can be reached by pressing <kbd>ArrowUp</kbd> from the input.\nThe input is always included in the focus loop per [ARIA Authoring Practices](https://www.w3.org/WAI/ARIA/apg/patterns/combobox/).\nWhen disabled, focus does not move when on the last element and the user presses <kbd>ArrowDown</kbd>, or when on the first element and the user presses <kbd>ArrowUp</kbd>."
            },
            {
              "name": "modal",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Determines if the popup enters a modal state when open.\n- `true`: user interaction is limited to the popup: document page scroll is locked and pointer interactions on outside elements are disabled.\n- `false`: user interaction with the rest of the document is allowed.\n\nOn touch devices, a `true` modal blocks outside taps but leaves the page scrollable unless the popup spans nearly the full viewport width, matching native iOS behavior."
            },
            {
              "name": "multiple",
              "optional": true,
              "type": "Multiple | undefined",
              "description": "Whether multiple items can be selected."
            },
            {
              "name": "name",
              "optional": true,
              "type": "string | undefined",
              "description": "Identifies the field when a form is submitted."
            },
            {
              "name": "onInputValueChange",
              "optional": true,
              "type": "((inputValue: string, eventDetails: ComboboxRoot.ChangeEventDetails) => void) | undefined",
              "description": "Event handler called when the input value changes."
            },
            {
              "name": "onItemHighlighted",
              "optional": true,
              "type": "((highlightedValue: Value | undefined, eventDetails: ComboboxRoot.HighlightEventDetails) => void) | undefined",
              "description": "Callback fired when an item is highlighted or unhighlighted.\nReceives the highlighted item value (or `undefined` if no item is highlighted) and event details with a `reason` property describing why the highlight changed.\nThe `reason` can be:\n- `'keyboard'`: the highlight changed due to keyboard navigation.\n- `'pointer'`: the highlight changed due to pointer hovering.\n- `'none'`: the highlight changed programmatically."
            },
            {
              "name": "onOpenChange",
              "optional": true,
              "type": "((open: boolean, eventDetails: ComboboxRoot.ChangeEventDetails) => void) | undefined",
              "description": "Event handler called when the popup is opened or closed."
            },
            {
              "name": "onOpenChangeComplete",
              "optional": true,
              "type": "((open: boolean) => void) | undefined",
              "description": "Event handler called after any animations complete when the popup is opened or closed."
            },
            {
              "name": "onValueChange",
              "optional": true,
              "type": "((value: ComboboxValueType<Value, Multiple> | (Multiple extends true ? never : null), eventDetails: ComboboxRoot.ChangeEventDetails) => void) | undefined",
              "description": "Event handler called when the selected value of the combobox changes."
            },
            {
              "name": "open",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the popup is currently open. Use when controlled."
            },
            {
              "name": "openOnInputClick",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the popup opens when clicking the input."
            },
            {
              "name": "readOnly",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the user should be unable to choose a different option from the popup."
            },
            {
              "name": "required",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the user must choose a value before submitting a form."
            },
            {
              "name": "value",
              "optional": true,
              "type": "ComboboxValueType<Value, Multiple> | null | undefined",
              "description": "The selected value of the combobox. Use when controlled."
            },
            {
              "name": "virtualized",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the items are being externally virtualized."
            }
          ]
        },
        {
          "name": "List",
          "props": [
            {
              "name": "children",
              "optional": true,
              "type": "ReactNode | ((item: any, index: number) => React.ReactNode)",
              "description": ""
            },
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ComboboxListState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ComboboxListState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ComboboxListState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            }
          ]
        },
        {
          "name": "Collection",
          "props": [
            {
              "name": "children",
              "optional": false,
              "type": "(item: any, index: number) => React.ReactNode",
              "description": ""
            }
          ]
        },
        {
          "name": "Value",
          "props": [
            {
              "name": "children",
              "optional": true,
              "type": "React.ReactNode | ((selectedValue: any) => React.ReactNode)",
              "description": "Accepts a function that returns a `ReactNode` to format the selected value.\nTreat the value as read-only: in `multiple` mode it may be a shared frozen array\nwhen nothing is selected."
            },
            {
              "name": "placeholder",
              "optional": true,
              "type": "React.ReactNode",
              "description": "The placeholder value to display when no value is selected.\nThis is overridden by `children` if specified, or by a null item's label in `items`."
            }
          ]
        },
        {
          "name": "Label",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ComboboxLabelState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ComboboxLabelState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ComboboxLabelState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"variant\"> | undefined; readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Input",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ComboboxInputState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "disabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component should ignore user interaction."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ComboboxInputState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ComboboxInputState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"variant\"> | undefined; readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "InputGroup",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ComboboxInputGroupState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ComboboxInputGroupState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ComboboxInputGroupState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"variant\"> | undefined; readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Trigger",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ComboboxTriggerState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "disabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component should ignore user interaction."
            },
            {
              "name": "nativeButton",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component renders a native `<button>` element when replacing it\nvia the `render` prop.\nSet to `false` if the rendered element is not a button (for example, `<div>`)."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ComboboxTriggerState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ComboboxTriggerState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"variant\"> | undefined; readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Clear",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ComboboxClearState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "disabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component should ignore user interaction."
            },
            {
              "name": "keepMounted",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component should remain mounted in the DOM when not visible."
            },
            {
              "name": "nativeButton",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component renders a native `<button>` element when replacing it\nvia the `render` prop.\nSet to `false` if the rendered element is not a button (for example, `<div>`)."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ComboboxClearState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ComboboxClearState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"variant\"> | undefined; readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Icon",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ComboboxIconState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ComboboxIconState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ComboboxIconState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"variant\"> | undefined; readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Positioner",
          "props": [
            {
              "name": "align",
              "optional": true,
              "type": "Align | undefined",
              "description": "How to align the popup relative to the specified side."
            },
            {
              "name": "alignOffset",
              "optional": true,
              "type": "number | OffsetFunction | undefined",
              "description": "Additional offset along the alignment axis in pixels.\nAlso accepts a function that returns the offset to read the dimensions of the anchor\nand positioner elements, along with its side and alignment.\n\nThe function takes a `data` object parameter with the following properties:\n- `data.anchor`: the dimensions of the anchor element with properties `width` and `height`.\n- `data.positioner`: the dimensions of the positioner element with properties `width` and `height`.\n- `data.side`: which side of the anchor element the positioner is aligned against.\n- `data.align`: how the positioner is aligned relative to the specified side."
            },
            {
              "name": "anchor",
              "optional": true,
              "type": "Element | VirtualElement | RefObject<Element | null> | (() => Element | VirtualElement | null) | null | undefined",
              "description": "An element to position the popup against.\nBy default, the popup will be positioned against the trigger."
            },
            {
              "name": "arrowPadding",
              "optional": true,
              "type": "number | undefined",
              "description": "Minimum distance to maintain between the arrow and the edges of the popup.\n\nUse it to prevent the arrow element from hanging out of the rounded corners of a popup."
            },
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ComboboxPositionerState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "collisionAvoidance",
              "optional": true,
              "type": "CollisionAvoidance | undefined",
              "description": "Determines how to handle collisions when positioning the popup.\n\n`side` controls overflow on the preferred placement axis (`top`/`bottom` or `left`/`right`):\n- `'flip'`: keep the requested side when it fits; otherwise try the opposite side\n  (`top` and `bottom`, or `left` and `right`).\n- `'shift'`: never change side; keep the requested side and move the popup within\n  the clipping boundary so it stays visible.\n- `'none'`: do not correct side-axis overflow.\n\n`align` controls overflow on the alignment axis (`start`/`center`/`end`):\n- `'flip'`: keep side, but swap `start` and `end` when the requested alignment overflows.\n- `'shift'`: keep side and requested alignment, then nudge the popup along the\n  alignment axis to fit.\n- `'none'`: do not correct alignment-axis overflow.\n\n`fallbackAxisSide` controls fallback behavior on the perpendicular axis when the\npreferred axis cannot fit:\n- `'start'`: allow perpendicular fallback and try the logical start side first\n  (`top` before `bottom`, or `left` before `right` in LTR).\n- `'end'`: allow perpendicular fallback and try the logical end side first\n  (`bottom` before `top`, or `right` before `left` in LTR).\n- `'none'`: do not fallback to the perpendicular axis.\n\nWhen `side` is `'shift'`, explicitly setting `align` only supports `'shift'` or `'none'`.\nIf `align` is omitted, it defaults to `'flip'`."
            },
            {
              "name": "collisionBoundary",
              "optional": true,
              "type": "Boundary | undefined",
              "description": "An element or a rectangle that delimits the area that the popup is confined to."
            },
            {
              "name": "collisionPadding",
              "optional": true,
              "type": "Padding | undefined",
              "description": "Additional space to maintain from the edge of the collision boundary."
            },
            {
              "name": "disableAnchorTracking",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to disable the popup from tracking any layout shift of its positioning anchor."
            },
            {
              "name": "positionMethod",
              "optional": true,
              "type": "\"absolute\" | \"fixed\" | undefined",
              "description": "Determines which CSS `position` property to use."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ComboboxPositionerState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "side",
              "optional": true,
              "type": "Side | undefined",
              "description": "Which side of the anchor element to align the popup against.\nMay automatically change to avoid collisions."
            },
            {
              "name": "sideOffset",
              "optional": true,
              "type": "number | OffsetFunction | undefined",
              "description": "Distance between the anchor and the popup in pixels.\nAlso accepts a function that returns the distance to read the dimensions of the anchor\nand positioner elements, along with its side and alignment.\n\nThe function takes a `data` object parameter with the following properties:\n- `data.anchor`: the dimensions of the anchor element with properties `width` and `height`.\n- `data.positioner`: the dimensions of the positioner element with properties `width` and `height`.\n- `data.side`: which side of the anchor element the positioner is aligned against.\n- `data.align`: how the positioner is aligned relative to the specified side."
            },
            {
              "name": "sticky",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to maintain the popup in the viewport after\nthe anchor element was scrolled out of view."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ComboboxPositionerState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"variant\"> | undefined; readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Popup",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ComboboxPopupState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "finalFocus",
              "optional": true,
              "type": "boolean | RefObject<HTMLElement | null> | ((closeType: InteractionType) => void | boolean | HTMLElement | null) | undefined",
              "description": "Determines the element to focus when the popup is closed.\n\n- `false`: Do not move focus.\n- `true`: Move focus based on the default behavior (trigger or previously focused element).\n- `RefObject`: Move focus to the ref element.\n- `function`: Called with the interaction type (`mouse`, `touch`, `pen`, or `keyboard`).\n  Return an element to focus, `true` to use the default behavior, or `false`/`undefined` to do nothing."
            },
            {
              "name": "initialFocus",
              "optional": true,
              "type": "boolean | RefObject<HTMLElement | null> | ((openType: InteractionType) => void | boolean | HTMLElement | null) | undefined",
              "description": "Determines the element to focus when the popup is opened.\n\n- `false`: Do not move focus.\n- `true`: Move focus based on the default behavior (first tabbable element or popup).\n- `RefObject`: Move focus to the ref element.\n- `function`: Called with the interaction type (`mouse`, `touch`, `pen`, or `keyboard`).\n  Return an element to focus, `true` to use the default behavior, or `false`/`undefined` to do nothing."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ComboboxPopupState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ComboboxPopupState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"variant\"> | undefined; readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Item",
          "props": [
            {
              "name": "children",
              "optional": true,
              "type": "ReactNode",
              "description": ""
            },
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ComboboxItemState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "disabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component should ignore user interaction."
            },
            {
              "name": "index",
              "optional": true,
              "type": "number | undefined",
              "description": "The index of the item in the list. Improves performance when specified by avoiding the need to calculate the index automatically from the DOM."
            },
            {
              "name": "nativeButton",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component renders a native `<button>` element when replacing it\nvia the `render` prop.\nSet to `true` if the rendered element is a native button."
            },
            {
              "name": "onClick",
              "optional": true,
              "type": "((event: BaseUIEvent<MouseEvent<HTMLDivElement, MouseEvent>>) => void) | undefined",
              "description": "An optional click handler for the item when selected.\nIt fires when clicking the item with the pointer, as well as when pressing `Enter` with the keyboard if the item is highlighted when the `Input` or `List` element has focus."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ComboboxItemState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ComboboxItemState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "value",
              "optional": true,
              "type": "any",
              "description": "A unique value that identifies this item."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"variant\"> | undefined; readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "ItemIndicator",
          "props": [
            {
              "name": "children",
              "optional": true,
              "type": "ReactNode",
              "description": ""
            },
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ComboboxItemIndicatorState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "keepMounted",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to keep the HTML element in the DOM when the item is not selected."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ComboboxItemIndicatorState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ComboboxItemIndicatorState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"variant\"> | undefined; readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Group",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ComboboxGroupState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "items",
              "optional": true,
              "type": "readonly any[] | undefined",
              "description": "Items to be rendered within this group.\nWhen provided, child `Collection` components will use these items."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ComboboxGroupState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ComboboxGroupState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"variant\"> | undefined; readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "GroupLabel",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ComboboxGroupLabelState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ComboboxGroupLabelState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ComboboxGroupLabelState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"variant\"> | undefined; readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Chips",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ComboboxChipsState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ComboboxChipsState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ComboboxChipsState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"variant\"> | undefined; readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Chip",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ComboboxChipState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ComboboxChipState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ComboboxChipState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"variant\"> | undefined; readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "ChipRemove",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ComboboxChipRemoveState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "nativeButton",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component renders a native `<button>` element when replacing it\nvia the `render` prop.\nSet to `false` if the rendered element is not a button (for example, `<div>`)."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ComboboxChipRemoveState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ComboboxChipRemoveState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"variant\"> | undefined; readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Empty",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ComboboxEmptyState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ComboboxEmptyState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ComboboxEmptyState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"variant\"> | undefined; readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Status",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ComboboxStatusState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ComboboxStatusState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ComboboxStatusState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"variant\"> | undefined; readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Row",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ComboboxRowState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ComboboxRowState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ComboboxRowState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"variant\"> | undefined; readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"combobox\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Portal",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ComboboxPortalState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "container",
              "optional": true,
              "type": "HTMLElement | ShadowRoot | RefObject<HTMLElement | ShadowRoot | null> | null | undefined",
              "description": "A parent element to render the portal element into."
            },
            {
              "name": "keepMounted",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to keep the portal mounted in the DOM while the popup is hidden."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ComboboxPortalState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ComboboxPortalState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            }
          ]
        }
      ],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-controls-combobox/#combobox",
      "api": "/api/packages/controls/combobox.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "advanced-fields",
          "title": "Advanced field compositions",
          "example": "advanced-fields",
          "source": "/examples/advanced-fields.tsx"
        },
        {
          "slug": "pickers",
          "title": "Select and autocomplete",
          "example": "pickers",
          "source": "/examples/pickers.tsx"
        }
      ]
    },
    {
      "name": "CommandPalette",
      "entry": "@fayegram-ai/faye-ui/patterns/command-palette",
      "guide": "/docs/patterns/",
      "declaration": "packages/faye-ui/dist/patterns/command-palette.d.ts",
      "signature": "(input: CommandPaletteProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "closeIcon",
          "optional": true,
          "type": "ReactNode",
          "description": "Optional dismissal artwork; the built-in close icon is used by default."
        },
        {
          "name": "closeLabel",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "commands",
          "optional": false,
          "type": "readonly Command[]",
          "description": ""
        },
        {
          "name": "emptyMessage",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "onOpenChange",
          "optional": false,
          "type": "(open: boolean) => void",
          "description": ""
        },
        {
          "name": "onSelect",
          "optional": false,
          "type": "(command: Command) => void",
          "description": ""
        },
        {
          "name": "open",
          "optional": false,
          "type": "boolean",
          "description": ""
        },
        {
          "name": "placeholder",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "title",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "Supplied commands only. No remote search, global shortcut capture or business actions in core.",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-patterns-command-palette/#commandpalette",
      "api": "/api/packages/patterns/command-palette.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "patterns",
          "title": "Application patterns",
          "example": "patterns",
          "source": "/examples/patterns.tsx"
        }
      ]
    },
    {
      "name": "ComponentSheetEditor",
      "entry": "@fayegram-ai/faye-ui/devtools/sheet-editor",
      "guide": "/docs/studio/",
      "declaration": "packages/faye-ui/dist/devtools/sheet-editor.d.ts",
      "signature": "({ sheet, descriptor, onChange, schema, children }: ComponentSheetEditorProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "children",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "descriptor",
          "optional": false,
          "type": "ComponentDescriptor",
          "description": ""
        },
        {
          "name": "onChange",
          "optional": false,
          "type": "(sheet: ComponentSheet) => void",
          "description": ""
        },
        {
          "name": "schema",
          "optional": true,
          "type": "Readonly<Record<string, TokenSpec>> | undefined",
          "description": ""
        },
        {
          "name": "sheet",
          "optional": false,
          "type": "ComponentSheet",
          "description": ""
        }
      ],
      "parts": [],
      "description": "Separate styling plane: descriptor-bounded defaults, rules and an actual profile preview.",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-devtools-sheet-editor/#componentsheeteditor",
      "api": "/api/packages/devtools/sheet-editor.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "studio",
          "title": "Theme studio",
          "example": "studio",
          "source": "/examples/studio.tsx"
        }
      ]
    },
    {
      "name": "ComponentStyleScope",
      "entry": "@fayegram-ai/faye-ui/provider/provider",
      "guide": "/docs/theming/",
      "declaration": "packages/faye-ui/dist/provider/provider.d.ts",
      "signature": "<N extends string>({ name, variants, children }: { name: N; variants: VisualVariants<N>; children: ReactNode; }): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "children",
          "optional": false,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "name",
          "optional": false,
          "type": "N",
          "description": ""
        },
        {
          "name": "variants",
          "optional": false,
          "type": "VisualVariants<N>",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-provider-provider/#componentstylescope",
      "api": "/api/packages/provider/provider.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "customization",
          "title": "Customization sheets",
          "example": "customization",
          "source": "/examples/customization.tsx"
        }
      ]
    },
    {
      "name": "Container",
      "entry": "@fayegram-ai/faye-ui/layout/layout",
      "guide": "/docs/layout/",
      "declaration": "packages/faye-ui/dist/layout/layout.d.ts",
      "signature": "({ width, gutter, ...props }: ContainerProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "align",
          "optional": true,
          "type": "Responsive<\"center\" | \"start\" | \"end\" | \"stretch\" | \"baseline\"> | undefined",
          "description": ""
        },
        {
          "name": "columnGap",
          "optional": true,
          "type": "Responsive<Space> | undefined",
          "description": "Overrides the horizontal gap independently of row spacing."
        },
        {
          "name": "gap",
          "optional": true,
          "type": "Responsive<Space> | undefined",
          "description": ""
        },
        {
          "name": "gutter",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "justify",
          "optional": true,
          "type": "Responsive<\"center\" | \"start\" | \"end\" | \"between\" | \"around\"> | undefined",
          "description": ""
        },
        {
          "name": "p",
          "optional": true,
          "type": "Responsive<Space> | undefined",
          "description": ""
        },
        {
          "name": "px",
          "optional": true,
          "type": "Responsive<Space> | undefined",
          "description": ""
        },
        {
          "name": "py",
          "optional": true,
          "type": "Responsive<Space> | undefined",
          "description": ""
        },
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLDivElement> | undefined",
          "description": ""
        },
        {
          "name": "rowGap",
          "optional": true,
          "type": "Responsive<Space> | undefined",
          "description": "Overrides the vertical gap, including between wrapped rows."
        },
        {
          "name": "width",
          "optional": true,
          "type": "\"content\" | \"reading\" | \"full\" | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-layout-layout/#container",
      "api": "/api/packages/layout/layout.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "layout",
          "title": "Layout primitives",
          "example": "layout",
          "source": "/examples/layout.tsx"
        }
      ]
    },
    {
      "name": "ContextMenu",
      "entry": "@fayegram-ai/faye-ui/overlays/context-menu",
      "guide": "/docs/menus/",
      "declaration": "packages/faye-ui/dist/overlays/context-menu.d.ts",
      "signature": null,
      "props": [],
      "parts": [
        {
          "name": "SubmenuRoot",
          "props": [
            {
              "name": "actionsRef",
              "optional": true,
              "type": "React.RefObject<MenuRootActions | null> | undefined",
              "description": "A ref to imperative actions.\n- `unmount`: Manually unmounts the menu.\n  Call this after any externally controlled closing animation finishes.\n- `close`: When specified, the menu can be closed imperatively."
            },
            {
              "name": "children",
              "optional": true,
              "type": "React.ReactNode",
              "description": "The content of the submenu."
            },
            {
              "name": "closeParentOnEsc",
              "optional": true,
              "type": "boolean | undefined",
              "description": "When in a submenu, determines whether pressing the Escape key\ncloses the entire menu, or only the current child menu."
            },
            {
              "name": "defaultOpen",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the menu is initially open.\n\nTo render a controlled menu, use the `open` prop instead."
            },
            {
              "name": "disabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component should ignore user interaction."
            },
            {
              "name": "highlightItemOnHover",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether moving the pointer over items should highlight them.\nDisabling this prop allows CSS `:hover` to be differentiated from the `:focus` (`data-highlighted`) state."
            },
            {
              "name": "loopFocus",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to loop keyboard focus back to the first item\nwhen the end of the list is reached while using the arrow keys."
            },
            {
              "name": "onOpenChange",
              "optional": true,
              "type": "((open: boolean, eventDetails: MenuSubmenuRoot.ChangeEventDetails) => void) | undefined",
              "description": "Event handler called when the menu is opened or closed."
            },
            {
              "name": "onOpenChangeComplete",
              "optional": true,
              "type": "((open: boolean) => void) | undefined",
              "description": "Event handler called after any animations complete when the menu is opened or closed."
            },
            {
              "name": "open",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the menu is currently open."
            },
            {
              "name": "orientation",
              "optional": true,
              "type": "MenuRootOrientation | undefined",
              "description": "The visual orientation of the menu.\nControls whether roving focus uses up/down or left/right arrow keys."
            }
          ]
        },
        {
          "name": "RadioGroup",
          "props": [
            {
              "name": "children",
              "optional": true,
              "type": "ReactNode",
              "description": "The content of the component."
            },
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: MenuRadioGroupState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "defaultValue",
              "optional": true,
              "type": "any",
              "description": "The uncontrolled value of the radio item that should be initially selected.\n\nTo render a controlled radio group, use the `value` prop instead."
            },
            {
              "name": "disabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component should ignore user interaction."
            },
            {
              "name": "onValueChange",
              "optional": true,
              "type": "((value: any, eventDetails: MenuRadioGroup.ChangeEventDetails) => void) | undefined",
              "description": "Function called when the selected value changes."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, MenuRadioGroupState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: MenuRadioGroupState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "value",
              "optional": true,
              "type": "any",
              "description": "The controlled value of the radio item that should be currently selected.\n\nTo render an uncontrolled radio group, use the `defaultValue` prop instead."
            }
          ]
        },
        {
          "name": "Positioner",
          "props": [
            {
              "name": "align",
              "optional": true,
              "type": "Align | undefined",
              "description": "How to align the popup relative to the specified side.\n\nSubmenus and menubars default to `'start'`."
            },
            {
              "name": "alignOffset",
              "optional": true,
              "type": "number | OffsetFunction | undefined",
              "description": "Additional offset along the alignment axis in pixels.\nAlso accepts a function that returns the offset to read the dimensions of the anchor\nand positioner elements, along with its side and alignment.\n\nThe function takes a `data` object parameter with the following properties:\n- `data.anchor`: the dimensions of the anchor element with properties `width` and `height`.\n- `data.positioner`: the dimensions of the positioner element with properties `width` and `height`.\n- `data.side`: which side of the anchor element the positioner is aligned against.\n- `data.align`: how the positioner is aligned relative to the specified side."
            },
            {
              "name": "anchor",
              "optional": true,
              "type": "Element | VirtualElement | RefObject<Element | null> | (() => Element | VirtualElement | null) | null | undefined",
              "description": "An element to position the popup against.\nBy default, the popup will be positioned against the trigger."
            },
            {
              "name": "arrowPadding",
              "optional": true,
              "type": "number | undefined",
              "description": "Minimum distance to maintain between the arrow and the edges of the popup.\n\nUse it to prevent the arrow element from hanging out of the rounded corners of a popup."
            },
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: MenuPositionerState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "collisionAvoidance",
              "optional": true,
              "type": "CollisionAvoidance | undefined",
              "description": "Determines how to handle collisions when positioning the popup.\n\n`side` controls overflow on the preferred placement axis (`top`/`bottom` or `left`/`right`):\n- `'flip'`: keep the requested side when it fits; otherwise try the opposite side\n  (`top` and `bottom`, or `left` and `right`).\n- `'shift'`: never change side; keep the requested side and move the popup within\n  the clipping boundary so it stays visible.\n- `'none'`: do not correct side-axis overflow.\n\n`align` controls overflow on the alignment axis (`start`/`center`/`end`):\n- `'flip'`: keep side, but swap `start` and `end` when the requested alignment overflows.\n- `'shift'`: keep side and requested alignment, then nudge the popup along the\n  alignment axis to fit.\n- `'none'`: do not correct alignment-axis overflow.\n\n`fallbackAxisSide` controls fallback behavior on the perpendicular axis when the\npreferred axis cannot fit:\n- `'start'`: allow perpendicular fallback and try the logical start side first\n  (`top` before `bottom`, or `left` before `right` in LTR).\n- `'end'`: allow perpendicular fallback and try the logical end side first\n  (`bottom` before `top`, or `right` before `left` in LTR).\n- `'none'`: do not fallback to the perpendicular axis.\n\nWhen `side` is `'shift'`, explicitly setting `align` only supports `'shift'` or `'none'`.\nIf `align` is omitted, it defaults to `'flip'`."
            },
            {
              "name": "collisionBoundary",
              "optional": true,
              "type": "Boundary | undefined",
              "description": "An element or a rectangle that delimits the area that the popup is confined to."
            },
            {
              "name": "collisionPadding",
              "optional": true,
              "type": "Padding | undefined",
              "description": "Additional space to maintain from the edge of the collision boundary."
            },
            {
              "name": "disableAnchorTracking",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to disable the popup from tracking any layout shift of its positioning anchor."
            },
            {
              "name": "positionMethod",
              "optional": true,
              "type": "\"absolute\" | \"fixed\" | undefined",
              "description": "Determines which CSS `position` property to use."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, MenuPositionerState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "side",
              "optional": true,
              "type": "Side | undefined",
              "description": "Which side of the anchor element to align the popup against.\nMay automatically change to avoid collisions.\n\nSubmenus and vertical menubars default to `'inline-end'`."
            },
            {
              "name": "sideOffset",
              "optional": true,
              "type": "number | OffsetFunction | undefined",
              "description": "Distance between the anchor and the popup in pixels.\nAlso accepts a function that returns the distance to read the dimensions of the anchor\nand positioner elements, along with its side and alignment.\n\nThe function takes a `data` object parameter with the following properties:\n- `data.anchor`: the dimensions of the anchor element with properties `width` and `height`.\n- `data.positioner`: the dimensions of the positioner element with properties `width` and `height`.\n- `data.side`: which side of the anchor element the positioner is aligned against.\n- `data.align`: how the positioner is aligned relative to the specified side."
            },
            {
              "name": "sticky",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to maintain the popup in the viewport after\nthe anchor element was scrolled out of view."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: MenuPositionerState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Popup",
          "props": [
            {
              "name": "children",
              "optional": true,
              "type": "ReactNode",
              "description": ""
            },
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: MenuPopupState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "finalFocus",
              "optional": true,
              "type": "boolean | RefObject<HTMLElement | null> | ((closeType: InteractionType) => boolean | HTMLElement | null | void) | undefined",
              "description": "Determines the element to focus when the menu is closed.\n\n- `false`: Do not move focus.\n- `true`: Move focus based on the default behavior (trigger or previously focused element).\n- `RefObject`: Move focus to the ref element.\n- `function`: Called with the interaction type (`mouse`, `touch`, `pen`, or `keyboard`).\n  Return an element to focus, `true` to use the default behavior, or `false`/`undefined` to do nothing."
            },
            {
              "name": "id",
              "optional": true,
              "type": "string | undefined",
              "description": ""
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, MenuPopupState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: MenuPopupState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Item",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: MenuItemState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "closeOnClick",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to close the menu when the item is clicked."
            },
            {
              "name": "disabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component should ignore user interaction."
            },
            {
              "name": "id",
              "optional": true,
              "type": "string | undefined",
              "description": ""
            },
            {
              "name": "label",
              "optional": true,
              "type": "string | undefined",
              "description": "Overrides the text label to use when the item is matched during keyboard text navigation."
            },
            {
              "name": "nativeButton",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component renders a native `<button>` element when replacing it\nvia the `render` prop.\nSet to `true` if the rendered element is a native button."
            },
            {
              "name": "onClick",
              "optional": true,
              "type": "((event: BaseUIEvent<MouseEvent<HTMLDivElement, MouseEvent>>) => void) | undefined",
              "description": "The click handler for the menu item."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, MenuItemState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: MenuItemState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "LinkItem",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: MenuLinkItemState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "closeOnClick",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to close the menu when the item is clicked."
            },
            {
              "name": "id",
              "optional": true,
              "type": "string | undefined",
              "description": ""
            },
            {
              "name": "label",
              "optional": true,
              "type": "string | undefined",
              "description": "Overrides the text label to use when the item is matched during keyboard text navigation."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<DetailedHTMLProps<AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, MenuLinkItemState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: MenuLinkItemState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "CheckboxItemIndicator",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: MenuCheckboxItemIndicatorState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "keepMounted",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to keep the HTML element in the DOM when the checkbox item is not checked."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, MenuCheckboxItemIndicatorState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: MenuCheckboxItemIndicatorState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "RadioItemIndicator",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: MenuRadioItemIndicatorState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "keepMounted",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to keep the HTML element in the DOM when the radio item is inactive."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, MenuRadioItemIndicatorState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: MenuRadioItemIndicatorState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Backdrop",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: MenuBackdropState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, MenuBackdropState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: MenuBackdropState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Arrow",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: MenuArrowState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, MenuArrowState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: MenuArrowState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Viewport",
          "props": [
            {
              "name": "children",
              "optional": true,
              "type": "ReactNode",
              "description": "The content to render inside the transition container."
            },
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: MenuViewportState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, MenuViewportState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: MenuViewportState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "CheckboxItem",
          "props": [
            {
              "name": "checked",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the checkbox item is currently ticked.\n\nTo render an uncontrolled checkbox item, use the `defaultChecked` prop instead."
            },
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: MenuCheckboxItemState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "closeOnClick",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to close the menu when the item is clicked."
            },
            {
              "name": "defaultChecked",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the checkbox item is initially ticked.\n\nTo render a controlled checkbox item, use the `checked` prop instead."
            },
            {
              "name": "disabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component should ignore user interaction."
            },
            {
              "name": "id",
              "optional": true,
              "type": "string | undefined",
              "description": ""
            },
            {
              "name": "label",
              "optional": true,
              "type": "string | undefined",
              "description": "Overrides the text label to use when the item is matched during keyboard text navigation."
            },
            {
              "name": "nativeButton",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component renders a native `<button>` element when replacing it\nvia the `render` prop.\nSet to `true` if the rendered element is a native button."
            },
            {
              "name": "onCheckedChange",
              "optional": true,
              "type": "((checked: boolean, eventDetails: Base.CheckboxItem.ChangeEventDetails) => void) | undefined",
              "description": "Event handler called when the checkbox item is ticked or unticked."
            },
            {
              "name": "onClick",
              "optional": true,
              "type": "((event: BaseUIEvent<MouseEvent<HTMLDivElement, MouseEvent>>) => void) | undefined",
              "description": "The click handler for the menu item."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, MenuCheckboxItemState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: MenuCheckboxItemState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "RadioItem",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: MenuRadioItemState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "closeOnClick",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to close the menu when the item is clicked."
            },
            {
              "name": "disabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component should ignore user interaction."
            },
            {
              "name": "id",
              "optional": true,
              "type": "string | undefined",
              "description": ""
            },
            {
              "name": "label",
              "optional": true,
              "type": "string | undefined",
              "description": "Overrides the text label to use when the item is matched during keyboard text navigation."
            },
            {
              "name": "nativeButton",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component renders a native `<button>` element when replacing it\nvia the `render` prop.\nSet to `true` if the rendered element is a native button."
            },
            {
              "name": "onClick",
              "optional": true,
              "type": "((event: BaseUIEvent<MouseEvent<HTMLDivElement, MouseEvent>>) => void) | undefined",
              "description": "The click handler for the menu item."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, MenuRadioItemState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: MenuRadioItemState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "value",
              "optional": false,
              "type": "any",
              "description": "Value of the radio item.\nThis is the value that will be set in the MenuRadioGroup when the item is selected."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Group",
          "props": [
            {
              "name": "children",
              "optional": true,
              "type": "ReactNode",
              "description": "The content of the component."
            },
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: MenuGroupState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, MenuGroupState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: MenuGroupState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "GroupLabel",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: MenuGroupLabelState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, MenuGroupLabelState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: MenuGroupLabelState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Separator",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: SeparatorState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "orientation",
              "optional": true,
              "type": "Orientation | undefined",
              "description": "The orientation of the separator."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, SeparatorState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: SeparatorState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "SubmenuTrigger",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: MenuSubmenuTriggerState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "closeDelay",
              "optional": true,
              "type": "number | undefined",
              "description": "How long to wait before closing the menu that was opened on hover.\nSpecified in milliseconds.\n\nRequires the `openOnHover` prop."
            },
            {
              "name": "delay",
              "optional": true,
              "type": "number | undefined",
              "description": "How long to wait before the menu may be opened on hover. Specified in milliseconds.\n\nRequires the `openOnHover` prop."
            },
            {
              "name": "disabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component should ignore user interaction."
            },
            {
              "name": "id",
              "optional": true,
              "type": "string | undefined",
              "description": ""
            },
            {
              "name": "label",
              "optional": true,
              "type": "string | undefined",
              "description": "Overrides the text label to use when the item is matched during keyboard text navigation."
            },
            {
              "name": "nativeButton",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component renders a native `<button>` element when replacing it\nvia the `render` prop.\nSet to `true` if the rendered element is a native button."
            },
            {
              "name": "onClick",
              "optional": true,
              "type": "((event: BaseUIEvent<MouseEvent<HTMLDivElement, MouseEvent>>) => void) | undefined",
              "description": ""
            },
            {
              "name": "openOnHover",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the menu should also open when the trigger is hovered."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, MenuSubmenuTriggerState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: MenuSubmenuTriggerState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Portal",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: MenuPortalState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "container",
              "optional": true,
              "type": "HTMLElement | ShadowRoot | RefObject<HTMLElement | ShadowRoot | null> | null | undefined",
              "description": "A parent element to render the portal element into."
            },
            {
              "name": "keepMounted",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to keep the portal mounted in the DOM while the popup is hidden."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, MenuPortalState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: MenuPortalState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            }
          ]
        },
        {
          "name": "Root",
          "props": [
            {
              "name": "actionsRef",
              "optional": true,
              "type": "React.RefObject<MenuRootActions | null> | undefined",
              "description": "A ref to imperative actions.\n- `unmount`: Manually unmounts the menu.\n  Call this after any externally controlled closing animation finishes.\n- `close`: When specified, the menu can be closed imperatively."
            },
            {
              "name": "children",
              "optional": true,
              "type": "React.ReactNode",
              "description": ""
            },
            {
              "name": "closeParentOnEsc",
              "optional": true,
              "type": "boolean | undefined",
              "description": ""
            },
            {
              "name": "defaultOpen",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the menu is initially open.\n\nTo render a controlled menu, use the `open` prop instead."
            },
            {
              "name": "disabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component should ignore user interaction."
            },
            {
              "name": "highlightItemOnHover",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether moving the pointer over items should highlight them.\nDisabling this prop allows CSS `:hover` to be differentiated from the `:focus` (`data-highlighted`) state."
            },
            {
              "name": "loopFocus",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to loop keyboard focus back to the first item\nwhen the end of the list is reached while using the arrow keys."
            },
            {
              "name": "onOpenChange",
              "optional": true,
              "type": "((open: boolean, eventDetails: ContextMenuRoot.ChangeEventDetails) => void) | undefined",
              "description": "Event handler called when the menu is opened or closed."
            },
            {
              "name": "onOpenChangeComplete",
              "optional": true,
              "type": "((open: boolean) => void) | undefined",
              "description": "Event handler called after any animations complete when the menu is opened or closed."
            },
            {
              "name": "open",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the menu is currently open."
            },
            {
              "name": "orientation",
              "optional": true,
              "type": "MenuRootOrientation | undefined",
              "description": "The visual orientation of the menu.\nControls whether roving focus uses up/down or left/right arrow keys."
            }
          ]
        },
        {
          "name": "Trigger",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ContextMenuTriggerState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ContextMenuTriggerState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ContextMenuTriggerState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"context-menu\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"context-menu\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        }
      ],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-overlays-context-menu/#contextmenu",
      "api": "/api/packages/overlays/context-menu.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "menus",
          "title": "Menus and contextual actions",
          "example": "menus",
          "source": "/examples/menus.tsx"
        }
      ]
    },
    {
      "name": "ControlLabel",
      "entry": "@fayegram-ai/faye-ui/controls/field-layout",
      "guide": "/docs/fields/",
      "declaration": "packages/faye-ui/dist/controls/field-layout.d.ts",
      "signature": "({ label, description, controlId, describedBy, disabled, children, className, ...props }: ControlLabelProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "children",
          "optional": false,
          "type": "(attributes: ControlLabelAttributes) => ReactNode",
          "description": ""
        },
        {
          "name": "controlId",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "describedBy",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "description",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "disabled",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "label",
          "optional": false,
          "type": "ReactNode",
          "description": ""
        }
      ],
      "parts": [],
      "description": "A native label for a checkbox, radio or switch, aligned with the first line of its copy.",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-controls-field-layout/#controllabel",
      "api": "/api/packages/controls/field-layout.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "accessibility",
          "title": "Accessibility and input behavior",
          "example": "accessibility",
          "source": "/examples/accessibility.tsx"
        },
        {
          "slug": "async-workflows",
          "title": "Asynchronous workflows",
          "example": "async-workflows",
          "source": "/examples/async-workflows.tsx"
        },
        {
          "slug": "selection",
          "title": "Checkboxes, radios and switches",
          "example": "selection",
          "source": "/examples/selection.tsx"
        },
        {
          "slug": "customization",
          "title": "Customization sheets",
          "example": "customization",
          "source": "/examples/customization.tsx"
        },
        {
          "slug": "consumer-experience",
          "title": "Interactive consumer experience",
          "example": "consumer-experience",
          "source": "/examples/consumer-experience.tsx"
        }
      ]
    },
    {
      "name": "Dialog",
      "entry": "@fayegram-ai/faye-ui/overlays/dialog",
      "guide": "/docs/dialogs/",
      "declaration": "packages/faye-ui/dist/overlays/dialog.d.ts",
      "signature": null,
      "props": [],
      "parts": [
        {
          "name": "Root",
          "props": [
            {
              "name": "actionsRef",
              "optional": true,
              "type": "RefObject<DialogRootActions | null> | undefined",
              "description": "A ref to imperative actions.\n- `unmount`: Manually unmounts the dialog.\nCall this after any externally controlled closing animation finishes.\n- `close`: Closes the dialog imperatively when called."
            },
            {
              "name": "children",
              "optional": true,
              "type": "ReactNode | PayloadChildRenderFunction<Payload>",
              "description": "The content of the dialog.\nThis can be a regular React node or a render function that receives the `payload` of the active trigger."
            },
            {
              "name": "defaultOpen",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the dialog is initially open.\n\nTo render a controlled dialog, use the `open` prop instead."
            },
            {
              "name": "defaultTriggerId",
              "optional": true,
              "type": "string | null | undefined",
              "description": "ID of the trigger that the dialog is associated with.\nThis is useful in conjunction with the `defaultOpen` prop to create an initially open dialog."
            },
            {
              "name": "disablePointerDismissal",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to prevent the dialog from closing on outside presses.\nFor non-modal dialogs, this also prevents the dialog from closing when focus moves outside of it."
            },
            {
              "name": "handle",
              "optional": true,
              "type": "Base.Handle<Payload> | undefined",
              "description": "A handle to associate the dialog with a trigger.\nIf specified, allows external triggers to control the dialog's open state.\nCan be created with the Dialog.createHandle() method."
            },
            {
              "name": "modal",
              "optional": true,
              "type": "boolean | \"trap-focus\" | undefined",
              "description": "Determines if the dialog enters a modal state when open.\n- `true`: user interaction is limited to just the dialog: focus is trapped, document page scroll is locked, and pointer interactions on outside elements are disabled.\n- `false`: user interaction with the rest of the document is allowed.\n- `'trap-focus'`: focus is trapped inside the dialog, but document page scroll is not locked and pointer interactions outside of it remain enabled.\n\nWhen `modal` is `true` or `'trap-focus'`, render `<Dialog.Close>` inside `<Dialog.Popup>` so\ntouch screen readers can escape the popup."
            },
            {
              "name": "onOpenChange",
              "optional": true,
              "type": "((open: boolean, eventDetails: Base.Root.ChangeEventDetails) => void) | undefined",
              "description": "Event handler called when the dialog is opened or closed."
            },
            {
              "name": "onOpenChangeComplete",
              "optional": true,
              "type": "((open: boolean) => void) | undefined",
              "description": "Event handler called after any animations complete when the dialog is opened or closed."
            },
            {
              "name": "open",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the dialog is currently open."
            },
            {
              "name": "triggerId",
              "optional": true,
              "type": "string | null | undefined",
              "description": "ID of the trigger that the dialog is associated with.\nThis is useful in conjunction with the `open` prop to create a controlled dialog.\nThere's no need to specify this prop when the dialog is uncontrolled (that is, when the `open` prop is not set)."
            }
          ]
        },
        {
          "name": "Trigger",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: DialogTriggerState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "handle",
              "optional": true,
              "type": "Base.Handle<unknown> | undefined",
              "description": "A handle to associate the trigger with a dialog.\nCan be created with the Dialog.createHandle() method."
            },
            {
              "name": "id",
              "optional": true,
              "type": "string | undefined",
              "description": "ID of the trigger. In addition to being forwarded to the rendered element,\nit is also used to specify the active trigger for the dialog in controlled mode (with the DialogRoot `triggerId` prop)."
            },
            {
              "name": "nativeButton",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component renders a native `<button>` element when replacing it\nvia the `render` prop.\nSet to `false` if the rendered element is not a button (for example, `<div>`)."
            },
            {
              "name": "payload",
              "optional": true,
              "type": "unknown",
              "description": "A payload to pass to the dialog when it is opened."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, DialogTriggerState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: DialogTriggerState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"dialog\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"dialog\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Backdrop",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: DialogBackdropState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "forceRender",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the backdrop is forced to render even when nested."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, DialogBackdropState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: DialogBackdropState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"dialog\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"dialog\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Popup",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: DialogPopupState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "finalFocus",
              "optional": true,
              "type": "boolean | RefObject<HTMLElement | null> | ((closeType: InteractionType) => boolean | HTMLElement | null | void) | undefined",
              "description": "Determines the element to focus when the dialog is closed.\n\n- `false`: Do not move focus.\n- `true`: Move focus based on the default behavior (trigger or previously focused element).\n- `RefObject`: Move focus to the ref element.\n- `function`: Called with the interaction type (`mouse`, `touch`, `pen`, or `keyboard`).\n  Return an element to focus, `true` to use the default behavior, `null` to fall back to the default behavior, or `false`/`undefined` to do nothing."
            },
            {
              "name": "initialFocus",
              "optional": true,
              "type": "boolean | RefObject<HTMLElement | null> | ((openType: InteractionType) => boolean | HTMLElement | null | void) | undefined",
              "description": "Determines the element to focus when the dialog is opened.\nBy default, focus moves to the first tabbable element inside the popup, except when the dialog\nis opened by touch — then the popup itself is focused to avoid opening the virtual keyboard.\n\n- `false`: Do not move focus.\n- `true`: Move focus based on the default behavior (first tabbable element or popup).\n- `RefObject`: Move focus to the ref element.\n- `function`: Called with the interaction type (`mouse`, `touch`, `pen`, or `keyboard`).\n  Return an element to focus, `true` to use the default behavior, `null` to fall back to the default behavior, or `false`/`undefined` to do nothing."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, DialogPopupState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: DialogPopupState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"dialog\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"dialog\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Title",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: DialogTitleState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, DialogTitleState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: DialogTitleState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"dialog\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"dialog\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Description",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: DialogDescriptionState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, DialogDescriptionState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: DialogDescriptionState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"dialog\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"dialog\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Close",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: DialogCloseState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "nativeButton",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component renders a native `<button>` element when replacing it\nvia the `render` prop.\nSet to `false` if the rendered element is not a button (for example, `<div>`)."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, DialogCloseState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: DialogCloseState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"dialog\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"dialog\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Viewport",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: DialogViewportState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, DialogViewportState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: DialogViewportState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"dialog\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"dialog\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Header",
          "props": [
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"dialog\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"dialog\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Body",
          "props": [
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"dialog\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"dialog\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Actions",
          "props": [
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"dialog\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"dialog\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Portal",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: DialogPortalState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "container",
              "optional": true,
              "type": "HTMLElement | ShadowRoot | RefObject<HTMLElement | ShadowRoot | null> | null | undefined",
              "description": "A parent element to render the portal element into."
            },
            {
              "name": "keepMounted",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to keep the portal mounted in the DOM while the popup is hidden."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, DialogPortalState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: DialogPortalState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            }
          ]
        }
      ],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-overlays-dialog/#dialog",
      "api": "/api/packages/overlays/dialog.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "accessibility",
          "title": "Accessibility and input behavior",
          "example": "accessibility",
          "source": "/examples/accessibility.tsx"
        },
        {
          "slug": "surface-compositions",
          "title": "Cards, media and composed dialogs",
          "example": "surface-compositions",
          "source": "/examples/surface-compositions.tsx"
        },
        {
          "slug": "dialogs",
          "title": "Dialogs, modal and drawers",
          "example": "dialogs",
          "source": "/examples/dialogs.tsx"
        },
        {
          "slug": "theming",
          "title": "Theme and color system",
          "example": "theming",
          "source": "/examples/theming.tsx"
        }
      ]
    },
    {
      "name": "Drawer",
      "entry": "@fayegram-ai/faye-ui/overlays/drawer",
      "guide": "/docs/dialogs/",
      "declaration": "packages/faye-ui/dist/overlays/drawer.d.ts",
      "signature": null,
      "props": [],
      "parts": [
        {
          "name": "Root",
          "props": [
            {
              "name": "actionsRef",
              "optional": true,
              "type": "RefObject<DialogRootActions | null> | undefined",
              "description": "A ref to imperative actions.\n- `unmount`: Manually unmounts the dialog.\nCall this after any externally controlled closing animation finishes.\n- `close`: Closes the dialog imperatively when called."
            },
            {
              "name": "children",
              "optional": true,
              "type": "ReactNode | PayloadChildRenderFunction<Payload>",
              "description": "The content of the dialog.\nThis can be a regular React node or a render function that receives the `payload` of the active trigger."
            },
            {
              "name": "defaultOpen",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the dialog is initially open.\n\nTo render a controlled dialog, use the `open` prop instead."
            },
            {
              "name": "defaultTriggerId",
              "optional": true,
              "type": "string | null | undefined",
              "description": "ID of the trigger that the dialog is associated with.\nThis is useful in conjunction with the `defaultOpen` prop to create an initially open dialog."
            },
            {
              "name": "disablePointerDismissal",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to prevent the dialog from closing on outside presses.\nFor non-modal dialogs, this also prevents the dialog from closing when focus moves outside of it."
            },
            {
              "name": "handle",
              "optional": true,
              "type": "Base.Handle<Payload> | undefined",
              "description": "A handle to associate the dialog with a trigger.\nIf specified, allows external triggers to control the dialog's open state.\nCan be created with the Dialog.createHandle() method."
            },
            {
              "name": "modal",
              "optional": true,
              "type": "boolean | \"trap-focus\" | undefined",
              "description": "Determines if the dialog enters a modal state when open.\n- `true`: user interaction is limited to just the dialog: focus is trapped, document page scroll is locked, and pointer interactions on outside elements are disabled.\n- `false`: user interaction with the rest of the document is allowed.\n- `'trap-focus'`: focus is trapped inside the dialog, but document page scroll is not locked and pointer interactions outside of it remain enabled.\n\nWhen `modal` is `true` or `'trap-focus'`, render `<Dialog.Close>` inside `<Dialog.Popup>` so\ntouch screen readers can escape the popup."
            },
            {
              "name": "onOpenChange",
              "optional": true,
              "type": "((open: boolean, eventDetails: Base.Root.ChangeEventDetails) => void) | undefined",
              "description": "Event handler called when the dialog is opened or closed."
            },
            {
              "name": "onOpenChangeComplete",
              "optional": true,
              "type": "((open: boolean) => void) | undefined",
              "description": "Event handler called after any animations complete when the dialog is opened or closed."
            },
            {
              "name": "open",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the dialog is currently open."
            },
            {
              "name": "triggerId",
              "optional": true,
              "type": "string | null | undefined",
              "description": "ID of the trigger that the dialog is associated with.\nThis is useful in conjunction with the `open` prop to create a controlled dialog.\nThere's no need to specify this prop when the dialog is uncontrolled (that is, when the `open` prop is not set)."
            }
          ]
        },
        {
          "name": "Trigger",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: DialogTriggerState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "handle",
              "optional": true,
              "type": "Base.Handle<unknown> | undefined",
              "description": "A handle to associate the trigger with a dialog.\nCan be created with the Dialog.createHandle() method."
            },
            {
              "name": "id",
              "optional": true,
              "type": "string | undefined",
              "description": "ID of the trigger. In addition to being forwarded to the rendered element,\nit is also used to specify the active trigger for the dialog in controlled mode (with the DialogRoot `triggerId` prop)."
            },
            {
              "name": "nativeButton",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component renders a native `<button>` element when replacing it\nvia the `render` prop.\nSet to `false` if the rendered element is not a button (for example, `<div>`)."
            },
            {
              "name": "payload",
              "optional": true,
              "type": "unknown",
              "description": "A payload to pass to the dialog when it is opened."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, DialogTriggerState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: DialogTriggerState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"dialog\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"dialog\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Backdrop",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: DialogBackdropState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "forceRender",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the backdrop is forced to render even when nested."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, DialogBackdropState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: DialogBackdropState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"dialog\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"dialog\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Viewport",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: DialogViewportState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, DialogViewportState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: DialogViewportState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"dialog\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"dialog\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Portal",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: DialogPortalState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "container",
              "optional": true,
              "type": "HTMLElement | ShadowRoot | RefObject<HTMLElement | ShadowRoot | null> | null | undefined",
              "description": "A parent element to render the portal element into."
            },
            {
              "name": "keepMounted",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to keep the portal mounted in the DOM while the popup is hidden."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, DialogPortalState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: DialogPortalState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            }
          ]
        },
        {
          "name": "Title",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: DialogTitleState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, DialogTitleState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: DialogTitleState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"dialog\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"dialog\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Description",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: DialogDescriptionState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, DialogDescriptionState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: DialogDescriptionState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"dialog\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"dialog\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Close",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: DialogCloseState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "nativeButton",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component renders a native `<button>` element when replacing it\nvia the `render` prop.\nSet to `false` if the rendered element is not a button (for example, `<div>`)."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, DialogCloseState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: DialogCloseState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"dialog\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"dialog\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Header",
          "props": [
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"dialog\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"dialog\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Body",
          "props": [
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"dialog\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"dialog\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Actions",
          "props": [
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"dialog\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"dialog\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Popup",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: DialogPopupState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "edge",
              "optional": true,
              "type": "\"start\" | \"end\" | \"top\" | \"bottom\" | undefined",
              "description": ""
            },
            {
              "name": "finalFocus",
              "optional": true,
              "type": "boolean | RefObject<HTMLElement | null> | ((closeType: InteractionType) => boolean | HTMLElement | null | void) | undefined",
              "description": "Determines the element to focus when the dialog is closed.\n\n- `false`: Do not move focus.\n- `true`: Move focus based on the default behavior (trigger or previously focused element).\n- `RefObject`: Move focus to the ref element.\n- `function`: Called with the interaction type (`mouse`, `touch`, `pen`, or `keyboard`).\n  Return an element to focus, `true` to use the default behavior, `null` to fall back to the default behavior, or `false`/`undefined` to do nothing."
            },
            {
              "name": "initialFocus",
              "optional": true,
              "type": "boolean | RefObject<HTMLElement | null> | ((openType: InteractionType) => boolean | HTMLElement | null | void) | undefined",
              "description": "Determines the element to focus when the dialog is opened.\nBy default, focus moves to the first tabbable element inside the popup, except when the dialog\nis opened by touch — then the popup itself is focused to avoid opening the virtual keyboard.\n\n- `false`: Do not move focus.\n- `true`: Move focus based on the default behavior (first tabbable element or popup).\n- `RefObject`: Move focus to the ref element.\n- `function`: Called with the interaction type (`mouse`, `touch`, `pen`, or `keyboard`).\n  Return an element to focus, `true` to use the default behavior, `null` to fall back to the default behavior, or `false`/`undefined` to do nothing."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, DialogPopupState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: DialogPopupState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"packages/faye-ui/dist/contracts/visual-variants\").VisualVariant<\"dialog\", \"size\"> | undefined; readonly tone?: import(\"packages/faye-ui/dist/contracts/visual-variants\").VisualVariant<\"dialog\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        }
      ],
      "description": "Modal sheet composition. Does not claim swipe/gesture behavior.",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-overlays-drawer/#drawer",
      "api": "/api/packages/overlays/drawer.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "functional-completion",
          "title": "Consumer interactions and navigation",
          "example": "functional-completion",
          "source": "/examples/functional-completion.tsx"
        },
        {
          "slug": "dialogs",
          "title": "Dialogs, modal and drawers",
          "example": "dialogs",
          "source": "/examples/dialogs.tsx"
        }
      ]
    },
    {
      "name": "EmptyState",
      "entry": "@fayegram-ai/faye-ui/patterns/content",
      "guide": "/docs/patterns/",
      "declaration": "packages/faye-ui/dist/patterns/content.d.ts",
      "signature": "({ title, description, icon, action, className, ...props }: Omit<HTMLAttributes<HTMLDivElement>, \"title\"> & { title: ReactNode; description?: ReactNode; icon?: ReactNode; action?: ReactNode; }): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "action",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "description",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "icon",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "title",
          "optional": false,
          "type": "ReactNode",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-patterns-content/#emptystate",
      "api": "/api/packages/patterns/content.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "patterns",
          "title": "Application patterns",
          "example": "patterns",
          "source": "/examples/patterns.tsx"
        },
        {
          "slug": "consumer-experience",
          "title": "Interactive consumer experience",
          "example": "consumer-experience",
          "source": "/examples/consumer-experience.tsx"
        }
      ]
    },
    {
      "name": "Fade",
      "entry": "@fayegram-ai/faye-ui/motion/presence",
      "guide": "/docs/motion/",
      "declaration": "packages/faye-ui/dist/motion/presence.d.ts",
      "signature": "(props: Omit<PresenceProps, \"effect\">): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "appear",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "container",
          "optional": true,
          "type": "HTMLElement | RefObject<HTMLElement | null> | null | undefined",
          "description": "Optional boundary to slide fully outside instead of using the small default offset."
        },
        {
          "name": "direction",
          "optional": true,
          "type": "\"start\" | \"end\" | \"left\" | \"right\" | \"up\" | \"down\" | undefined",
          "description": "Slide starts at this edge; start/end follow computed text direction."
        },
        {
          "name": "enterDuration",
          "optional": true,
          "type": "number | undefined",
          "description": ""
        },
        {
          "name": "exitDuration",
          "optional": true,
          "type": "number | undefined",
          "description": ""
        },
        {
          "name": "keepMounted",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "onExitComplete",
          "optional": true,
          "type": "(() => void) | undefined",
          "description": ""
        },
        {
          "name": "orientation",
          "optional": true,
          "type": "\"horizontal\" | \"vertical\" | undefined",
          "description": ""
        },
        {
          "name": "present",
          "optional": false,
          "type": "boolean",
          "description": ""
        },
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLDivElement> | undefined",
          "description": ""
        },
        {
          "name": "scaleOrigin",
          "optional": true,
          "type": "Property.TransformOrigin<string | number> | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-motion-presence/#fade",
      "api": "/api/packages/motion/presence.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "consumer-experience",
          "title": "Interactive consumer experience",
          "example": "consumer-experience",
          "source": "/examples/consumer-experience.tsx"
        },
        {
          "slug": "motion",
          "title": "Motion and presence",
          "example": "motion",
          "source": "/examples/motion.tsx"
        }
      ]
    },
    {
      "name": "FayeUIProvider",
      "entry": "@fayegram-ai/faye-ui/provider/provider",
      "guide": "/docs/theming/",
      "declaration": "packages/faye-ui/dist/provider/provider.d.ts",
      "signature": "({ accessibility, interaction, children, initialPreference, serverScheme, storageKey, store: externalStore, density, direction, locale, catalogs, themeId, axes, motion, variables, profiles, settings, ownerDocument, portalContainer, nonce, applyToDocument }: FayeUIProviderProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "accessibility",
          "optional": true,
          "type": "AccessibilityOptions | undefined",
          "description": ""
        },
        {
          "name": "applyToDocument",
          "optional": true,
          "type": "boolean | undefined",
          "description": "Set false when another root already owns the document theme."
        },
        {
          "name": "axes",
          "optional": true,
          "type": "Readonly<Record<string, string>> | undefined",
          "description": ""
        },
        {
          "name": "catalogs",
          "optional": true,
          "type": "readonly MessageCatalog[] | undefined",
          "description": ""
        },
        {
          "name": "children",
          "optional": false,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "density",
          "optional": true,
          "type": "Density | undefined",
          "description": ""
        },
        {
          "name": "direction",
          "optional": true,
          "type": "Direction | undefined",
          "description": ""
        },
        {
          "name": "initialPreference",
          "optional": true,
          "type": "ColorPreference | undefined",
          "description": ""
        },
        {
          "name": "interaction",
          "optional": true,
          "type": "InteractionOptions | undefined",
          "description": ""
        },
        {
          "name": "locale",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "motion",
          "optional": true,
          "type": "\"system\" | \"reduced\" | undefined",
          "description": ""
        },
        {
          "name": "nonce",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "ownerDocument",
          "optional": true,
          "type": "Document | undefined",
          "description": ""
        },
        {
          "name": "portalContainer",
          "optional": true,
          "type": "HTMLElement | ShadowRoot | undefined",
          "description": ""
        },
        {
          "name": "profiles",
          "optional": true,
          "type": "readonly ComponentProfile[] | undefined",
          "description": ""
        },
        {
          "name": "serverScheme",
          "optional": true,
          "type": "Scheme | undefined",
          "description": ""
        },
        {
          "name": "settings",
          "optional": true,
          "type": "readonly ComponentSettings[] | undefined",
          "description": ""
        },
        {
          "name": "storageKey",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "store",
          "optional": true,
          "type": "PreferenceStore | undefined",
          "description": ""
        },
        {
          "name": "themeId",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "variables",
          "optional": true,
          "type": "Readonly<Record<`--faye-ui-${string}`, string>> | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-provider-provider/#fayeuiprovider",
      "api": "/api/packages/provider/provider.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "localization",
          "title": "Localization",
          "example": "localization",
          "source": "/examples/localization.tsx"
        }
      ]
    },
    {
      "name": "FayeUIStyleRegistry",
      "entry": "@fayegram-ai/faye-ui/nextjs",
      "guide": "/docs/server-rendering/",
      "declaration": "packages/faye-ui/dist/nextjs/index.d.ts",
      "signature": "({ children, nonce }: { children: ReactNode; nonce?: string; }): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "children",
          "optional": false,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "nonce",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "Optional Next integration. Static component CSS does not need this registry.",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-nextjs/#fayeuistyleregistry",
      "api": "/api/packages/nextjs/index.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "runtime-styles",
          "title": "Optional runtime styling",
          "example": "runtime-styles",
          "source": "/examples/runtime-styles.tsx"
        }
      ]
    },
    {
      "name": "Field",
      "entry": "@fayegram-ai/faye-ui/controls/field",
      "guide": "/docs/fields/",
      "declaration": "packages/faye-ui/dist/controls/field.d.ts",
      "signature": null,
      "props": [],
      "parts": [
        {
          "name": "Control",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: FieldControlState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "defaultValue",
              "optional": true,
              "type": "string | number | readonly string[] | undefined",
              "description": ""
            },
            {
              "name": "onValueChange",
              "optional": true,
              "type": "((value: string, eventDetails: FieldControl.ChangeEventDetails) => void) | undefined",
              "description": "Callback fired when the `value` changes. Use when controlled."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, FieldControlState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: FieldControlState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            }
          ]
        },
        {
          "name": "Validity",
          "props": [
            {
              "name": "children",
              "optional": false,
              "type": "(state: FieldValidityState) => React.ReactNode",
              "description": "A function that accepts the field validity state as an argument.\n\n```jsx\n<Field.Validity>\n  {(validity) => {\n    return <div>...</div>\n  }}\n</Field.Validity>\n```"
            }
          ]
        },
        {
          "name": "Root",
          "props": [
            {
              "name": "actionsRef",
              "optional": true,
              "type": "RefObject<FieldRootActions | null> | undefined",
              "description": "A ref to imperative actions.\n- `validate`: Validates the field when called."
            },
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: FieldRootState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "dirty",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the field's value has been changed from its initial value.\nUseful when the field state is controlled by an external library."
            },
            {
              "name": "disabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component should ignore user interaction.\nTakes precedence over the `disabled` prop on the `<Field.Control>` component."
            },
            {
              "name": "invalid",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the field is invalid.\nUseful when the field state is controlled by an external library."
            },
            {
              "name": "name",
              "optional": true,
              "type": "string | undefined",
              "description": "Identifies the field when a form is submitted.\nTakes precedence over the `name` prop on the `<Field.Control>` component."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, FieldRootState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: FieldRootState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "touched",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the field has been touched.\nUseful when the field state is controlled by an external library."
            },
            {
              "name": "validate",
              "optional": true,
              "type": "((value: unknown, formValues: Form.Values) => string | string[] | null | void | Promise<string | string[] | null | void>) | undefined",
              "description": "A function for custom validation. Return a string or an array of strings with\nthe error message(s) if the value is invalid. Returning nothing, `null`, an empty\nstring, or an empty array means the value is valid.\nAsynchronous functions are supported, but they do not prevent form submission\nwhen using `validationMode=\"onSubmit\"`."
            },
            {
              "name": "validationDebounceTime",
              "optional": true,
              "type": "number | undefined",
              "description": "How long to wait between `validate` callbacks if\n`validationMode=\"onChange\"` is used. Specified in milliseconds."
            },
            {
              "name": "validationMode",
              "optional": true,
              "type": "FormValidationMode | undefined",
              "description": "Determines when the field should be validated.\nThis takes precedence over the `validationMode` prop on `<Form>`.\n\n- `onSubmit`: triggers validation when the form is submitted, and re-validates on change after submission.\n- `onBlur`: triggers validation when the control loses focus.\n- `onChange`: triggers validation on every change to the control value."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"field\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"field\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Label",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: FieldLabelState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "nativeLabel",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component renders a native `<label>` element when replacing it via the `render` prop.\nSet to `false` if the rendered element is not a label (for example, `<div>`).\n\nThis is useful to avoid inheriting label behaviors on `<button>` controls (such as `<Select.Trigger>` and `<Combobox.Trigger>`), including avoiding `:hover` on the button when hovering the label, and preventing clicks on the label from firing on the button."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, FieldLabelState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: FieldLabelState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"field\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"field\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Description",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: FieldDescriptionState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, FieldDescriptionState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: FieldDescriptionState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"field\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"field\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Error",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: FieldErrorState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "match",
              "optional": true,
              "type": "boolean | keyof ValidityState | undefined",
              "description": "Determines whether to show the error message according to the field's\n[ValidityState](https://developer.mozilla.org/en-US/docs/Web/API/ValidityState).\nSpecifying `true` will always show the error message, and lets external libraries\ncontrol the visibility."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, FieldErrorState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: FieldErrorState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"field\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"field\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        }
      ],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-controls-field/#field",
      "api": "/api/packages/controls/field.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "accessibility",
          "title": "Accessibility and input behavior",
          "example": "accessibility",
          "source": "/examples/accessibility.tsx"
        },
        {
          "slug": "fields",
          "title": "Text fields and forms",
          "example": "fields",
          "source": "/examples/fields.tsx"
        }
      ]
    },
    {
      "name": "FieldLayout",
      "entry": "@fayegram-ai/faye-ui/controls/field-layout",
      "guide": "/docs/fields/",
      "declaration": "packages/faye-ui/dist/controls/field-layout.d.ts",
      "signature": "({ label, controlId, description, error, required, invalid, describedBy, children, ...props }: FieldLayoutProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "children",
          "optional": false,
          "type": "ReactNode | ((attributes: FieldControlAttributes) => ReactNode)",
          "description": ""
        },
        {
          "name": "controlId",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "describedBy",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "description",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "error",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "invalid",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "label",
          "optional": false,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "required",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "variants",
          "optional": true,
          "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"field\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"field\", \"tone\"> | undefined; } | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "Native field anatomy for any labelable control; children receive stable ARIA relationships.",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-controls-field-layout/#fieldlayout",
      "api": "/api/packages/controls/field-layout.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "advanced-fields",
          "title": "Advanced field compositions",
          "example": "advanced-fields",
          "source": "/examples/advanced-fields.tsx"
        },
        {
          "slug": "pickers",
          "title": "Select and autocomplete",
          "example": "pickers",
          "source": "/examples/pickers.tsx"
        },
        {
          "slug": "fields",
          "title": "Text fields and forms",
          "example": "fields",
          "source": "/examples/fields.tsx"
        }
      ]
    },
    {
      "name": "Fieldset",
      "entry": "@fayegram-ai/faye-ui/controls/fieldset",
      "guide": "/docs/fields/",
      "declaration": "packages/faye-ui/dist/controls/fieldset.d.ts",
      "signature": null,
      "props": [],
      "parts": [
        {
          "name": "Root",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: FieldsetRootState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, FieldsetRootState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: FieldsetRootState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"fieldset\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"fieldset\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Legend",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: FieldsetLegendState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, FieldsetLegendState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: FieldsetLegendState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"fieldset\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"fieldset\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        }
      ],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-controls-fieldset/#fieldset",
      "api": "/api/packages/controls/fieldset.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "fields",
          "title": "Text fields and forms",
          "example": "fields",
          "source": "/examples/fields.tsx"
        }
      ]
    },
    {
      "name": "FilterBar",
      "entry": "@fayegram-ai/faye-ui/patterns/content",
      "guide": "/docs/patterns/",
      "declaration": "packages/faye-ui/dist/patterns/content.d.ts",
      "signature": "({ children, className, ...props }: HTMLAttributes<HTMLDivElement>): import(\"react\").JSX.Element",
      "props": [],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-patterns-content/#filterbar",
      "api": "/api/packages/patterns/content.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "patterns",
          "title": "Application patterns",
          "example": "patterns",
          "source": "/examples/patterns.tsx"
        }
      ]
    },
    {
      "name": "FloatingAction",
      "entry": "@fayegram-ai/faye-ui/patterns/floating-actions",
      "guide": "/docs/patterns/",
      "declaration": "packages/faye-ui/dist/patterns/floating-actions.d.ts",
      "signature": "({ edge, className, ...props }: ButtonProps & { edge?: \"start\" | \"end\"; }): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "className",
          "optional": true,
          "type": "string | ((state: ButtonState) => string | undefined) | undefined",
          "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
        },
        {
          "name": "edge",
          "optional": true,
          "type": "\"start\" | \"end\" | undefined",
          "description": ""
        },
        {
          "name": "endIcon",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "focusableWhenDisabled",
          "optional": true,
          "type": "boolean | undefined",
          "description": "Whether the button should be focusable when disabled."
        },
        {
          "name": "fullWidth",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "nativeButton",
          "optional": true,
          "type": "boolean | undefined",
          "description": "Whether the component renders a native `<button>` element when replacing it\nvia the `render` prop.\nSet to `false` if the rendered element is not a button (for example, `<div>`)."
        },
        {
          "name": "pending",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "pendingIndicator",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "pendingPosition",
          "optional": true,
          "type": "\"center\" | \"start\" | \"end\" | undefined",
          "description": "Center replaces the label without a size change; start/end reserve an indicator slot."
        },
        {
          "name": "render",
          "optional": true,
          "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ButtonState> | undefined",
          "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
        },
        {
          "name": "size",
          "optional": true,
          "type": "ButtonSize | undefined",
          "description": ""
        },
        {
          "name": "startIcon",
          "optional": true,
          "type": "ReactNode",
          "description": "Decorative slots keep artwork and labels centered with the same gap on either side."
        },
        {
          "name": "style",
          "optional": true,
          "type": "CSSProperties | ((state: ButtonState) => React.CSSProperties | undefined) | undefined",
          "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
        },
        {
          "name": "tone",
          "optional": true,
          "type": "ButtonTone | undefined",
          "description": ""
        },
        {
          "name": "variant",
          "optional": true,
          "type": "ButtonVariant | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-patterns-floating-actions/#floatingaction",
      "api": "/api/packages/patterns/floating-actions.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "patterns",
          "title": "Application patterns",
          "example": "patterns",
          "source": "/examples/patterns.tsx"
        }
      ]
    },
    {
      "name": "FloatingActions",
      "entry": "@fayegram-ai/faye-ui/patterns/floating-actions",
      "guide": "/docs/patterns/",
      "declaration": "packages/faye-ui/dist/patterns/floating-actions.d.ts",
      "signature": "({ label, items, edge, direction, openOnHover, triggerProps, positionerProps, popupProps, ...rootProps }: FloatingActionsProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "actionsRef",
          "optional": true,
          "type": "RefObject<MenuRootActions | null> | undefined",
          "description": "A ref to imperative actions.\n- `unmount`: Manually unmounts the menu.\n  Call this after any externally controlled closing animation finishes.\n- `close`: When specified, the menu can be closed imperatively."
        },
        {
          "name": "closeParentOnEsc",
          "optional": true,
          "type": "boolean | undefined",
          "description": "When in a submenu, determines whether pressing the Escape key\ncloses the entire menu, or only the current child menu."
        },
        {
          "name": "defaultOpen",
          "optional": true,
          "type": "boolean | undefined",
          "description": "Whether the menu is initially open.\n\nTo render a controlled menu, use the `open` prop instead."
        },
        {
          "name": "defaultTriggerId",
          "optional": true,
          "type": "string | null | undefined",
          "description": "ID of the trigger that the menu is associated with.\nThis is useful in conjunction with the `defaultOpen` prop to create an initially open menu."
        },
        {
          "name": "direction",
          "optional": true,
          "type": "\"start\" | \"end\" | \"up\" | \"down\" | undefined",
          "description": ""
        },
        {
          "name": "disabled",
          "optional": true,
          "type": "boolean | undefined",
          "description": "Whether the component should ignore user interaction."
        },
        {
          "name": "edge",
          "optional": true,
          "type": "\"start\" | \"end\" | undefined",
          "description": ""
        },
        {
          "name": "handle",
          "optional": true,
          "type": "MenuHandle<unknown> | undefined",
          "description": "A handle to associate the menu with a trigger.\nIf specified, allows external triggers to control the menu's open state."
        },
        {
          "name": "highlightItemOnHover",
          "optional": true,
          "type": "boolean | undefined",
          "description": "Whether moving the pointer over items should highlight them.\nDisabling this prop allows CSS `:hover` to be differentiated from the `:focus` (`data-highlighted`) state."
        },
        {
          "name": "items",
          "optional": false,
          "type": "readonly FloatingActionItem[]",
          "description": ""
        },
        {
          "name": "label",
          "optional": false,
          "type": "string",
          "description": ""
        },
        {
          "name": "loopFocus",
          "optional": true,
          "type": "boolean | undefined",
          "description": "Whether to loop keyboard focus back to the first item\nwhen the end of the list is reached while using the arrow keys."
        },
        {
          "name": "modal",
          "optional": true,
          "type": "boolean | undefined",
          "description": "Determines if the menu enters a modal state when open.\n- `true`: user interaction is limited to the menu: document page scroll is locked and pointer interactions on outside elements are disabled.\n- `false`: user interaction with the rest of the document is allowed.\n\nOn touch devices, a `true` modal blocks outside taps but leaves the page scrollable unless the popup spans nearly the full viewport width, matching native iOS behavior.\n\nNested menus ignore this prop, and menus opened by hover are never modal."
        },
        {
          "name": "onOpenChange",
          "optional": true,
          "type": "((open: boolean, eventDetails: MenuRoot.ChangeEventDetails) => void) | undefined",
          "description": "Event handler called when the menu is opened or closed."
        },
        {
          "name": "onOpenChangeComplete",
          "optional": true,
          "type": "((open: boolean) => void) | undefined",
          "description": "Event handler called after any animations complete when the menu is opened or closed."
        },
        {
          "name": "open",
          "optional": true,
          "type": "boolean | undefined",
          "description": "Whether the menu is currently open."
        },
        {
          "name": "openOnHover",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "popupProps",
          "optional": true,
          "type": "(Omit<MenuPopupProps, \"ref\"> & RefAttributes<HTMLDivElement> & { variants?: { readonly size?: import(\"packages/faye-ui/dist/contracts/visual-variants\").VisualVariant<\"menu\", \"size\"> | undefined; readonly tone?: import(\"packages/faye-ui/dist/contracts/visual-variants\").VisualVariant<\"menu\", \"tone\"> | undefined; } | undefined; }) | undefined",
          "description": ""
        },
        {
          "name": "positionerProps",
          "optional": true,
          "type": "(Omit<MenuPositionerProps, \"ref\"> & RefAttributes<HTMLDivElement> & { variants?: { readonly size?: import(\"packages/faye-ui/dist/contracts/visual-variants\").VisualVariant<\"menu\", \"size\"> | undefined; readonly tone?: import(\"packages/faye-ui/dist/contracts/visual-variants\").VisualVariant<\"menu\", \"tone\"> | undefined; } | undefined; }) | undefined",
          "description": ""
        },
        {
          "name": "triggerId",
          "optional": true,
          "type": "string | null | undefined",
          "description": "ID of the trigger that the menu is associated with.\nThis is useful in conjunction with the `open` prop to create a controlled menu.\nThere's no need to specify this prop when the menu is uncontrolled (that is, when the `open` prop is not set)."
        },
        {
          "name": "triggerProps",
          "optional": true,
          "type": "(MenuTriggerProps<unknown> & RefAttributes<HTMLElement> & { variants?: { readonly size?: import(\"packages/faye-ui/dist/contracts/visual-variants\").VisualVariant<\"menu\", \"size\"> | undefined; readonly tone?: import(\"packages/faye-ui/dist/contracts/visual-variants\").VisualVariant<\"menu\", \"tone\"> | undefined; } | undefined; }) | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "Accessible directional action dock, with Menu owning focus, hover and dismissal.",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-patterns-floating-actions/#floatingactions",
      "api": "/api/packages/patterns/floating-actions.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "patterns",
          "title": "Application patterns",
          "example": "patterns",
          "source": "/examples/patterns.tsx"
        },
        {
          "slug": "functional-completion",
          "title": "Consumer interactions and navigation",
          "example": "functional-completion",
          "source": "/examples/functional-completion.tsx"
        }
      ]
    },
    {
      "name": "Form",
      "entry": "@fayegram-ai/faye-ui/controls/form",
      "guide": "/docs/fields/",
      "declaration": "packages/faye-ui/dist/controls/form.d.ts",
      "signature": "(input: Base.Props<Record<string, any>> & { ref?: React.Ref<HTMLFormElement> | undefined; } & { variants?: Readonly<Record<string, string>> | undefined; }): import(\"react\").ReactElement",
      "props": [
        {
          "name": "actionsRef",
          "optional": true,
          "type": "RefObject<FormActions | null> | undefined",
          "description": "A ref to imperative actions.\n- `validate`: Validates all fields when called. Optionally pass a field name to validate a single field."
        },
        {
          "name": "className",
          "optional": true,
          "type": "string | ((state: FormState) => string | undefined) | undefined",
          "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
        },
        {
          "name": "errors",
          "optional": true,
          "type": "Errors | undefined",
          "description": "Validation errors returned externally, typically after submission by a server or a form action.\nThis should be an object where keys correspond to the `name` attribute on `<Field.Root>`,\nand values correspond to error(s) related to that field."
        },
        {
          "name": "onFormSubmit",
          "optional": true,
          "type": "((formValues: Record<string, any>, eventDetails: Base.SubmitEventDetails) => void) | undefined",
          "description": "Event handler called when the form is submitted.\n`preventDefault()` is called on the native submit event when used."
        },
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLFormElement> | undefined",
          "description": "Allows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref)."
        },
        {
          "name": "render",
          "optional": true,
          "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<DetailedHTMLProps<FormHTMLAttributes<HTMLFormElement>, HTMLFormElement>, FormState> | undefined",
          "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
        },
        {
          "name": "style",
          "optional": true,
          "type": "CSSProperties | ((state: FormState) => React.CSSProperties | undefined) | undefined",
          "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
        },
        {
          "name": "validationMode",
          "optional": true,
          "type": "FormValidationMode | undefined",
          "description": "Determines when the form should be validated.\nThe `validationMode` prop on `<Field.Root>` takes precedence over this.\n\n- `onSubmit` (default): validates the field when the form is submitted, afterwards fields will re-validate on change.\n- `onBlur`: validates a field when it loses focus.\n- `onChange`: validates the field on every change to its value."
        },
        {
          "name": "variants",
          "optional": true,
          "type": "Readonly<Record<string, string>> | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-controls-form/#form",
      "api": "/api/packages/controls/form.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "fields",
          "title": "Text fields and forms",
          "example": "fields",
          "source": "/examples/fields.tsx"
        }
      ]
    },
    {
      "name": "FormSection",
      "entry": "@fayegram-ai/faye-ui/patterns/content",
      "guide": "/docs/patterns/",
      "declaration": "packages/faye-ui/dist/patterns/content.d.ts",
      "signature": "({ title, description, children, ...props }: Omit<HTMLAttributes<HTMLFieldSetElement>, \"title\"> & { title: ReactNode; description?: ReactNode; }): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "description",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "title",
          "optional": false,
          "type": "ReactNode",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-patterns-content/#formsection",
      "api": "/api/packages/patterns/content.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "patterns",
          "title": "Application patterns",
          "example": "patterns",
          "source": "/examples/patterns.tsx"
        }
      ]
    },
    {
      "name": "GlobalStyles",
      "entry": "@fayegram-ai/faye-ui/runtime-styles/react",
      "guide": "/docs/runtime-styles/",
      "declaration": "packages/faye-ui/dist/runtime-styles/react.d.ts",
      "signature": "({ id, css, order }: { id: string; css: string; order?: number; }): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "css",
          "optional": false,
          "type": "string",
          "description": ""
        },
        {
          "name": "id",
          "optional": false,
          "type": "string",
          "description": ""
        },
        {
          "name": "order",
          "optional": true,
          "type": "number | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "Trusted authored CSS only. Portable user data must go through the sheet/token validators.",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-runtime-styles-react/#globalstyles",
      "api": "/api/packages/runtime-styles/react.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "runtime-styles",
          "title": "Optional runtime styling",
          "example": "runtime-styles",
          "source": "/examples/runtime-styles.tsx"
        }
      ]
    },
    {
      "name": "Grid",
      "entry": "@fayegram-ai/faye-ui/layout/layout",
      "guide": "/docs/layout/",
      "declaration": "packages/faye-ui/dist/layout/layout.d.ts",
      "signature": "({ columns, minItemWidth, style, className, ...props }: GridProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "align",
          "optional": true,
          "type": "Responsive<\"center\" | \"start\" | \"end\" | \"stretch\" | \"baseline\"> | undefined",
          "description": ""
        },
        {
          "name": "columnGap",
          "optional": true,
          "type": "Responsive<Space> | undefined",
          "description": "Overrides the horizontal gap independently of row spacing."
        },
        {
          "name": "columns",
          "optional": true,
          "type": "Responsive<2 | 3 | 1 | 5 | 4 | 12 | 6 | 8> | undefined",
          "description": ""
        },
        {
          "name": "gap",
          "optional": true,
          "type": "Responsive<Space> | undefined",
          "description": ""
        },
        {
          "name": "justify",
          "optional": true,
          "type": "Responsive<\"center\" | \"start\" | \"end\" | \"between\" | \"around\"> | undefined",
          "description": ""
        },
        {
          "name": "minItemWidth",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "p",
          "optional": true,
          "type": "Responsive<Space> | undefined",
          "description": ""
        },
        {
          "name": "px",
          "optional": true,
          "type": "Responsive<Space> | undefined",
          "description": ""
        },
        {
          "name": "py",
          "optional": true,
          "type": "Responsive<Space> | undefined",
          "description": ""
        },
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLDivElement> | undefined",
          "description": ""
        },
        {
          "name": "rowGap",
          "optional": true,
          "type": "Responsive<Space> | undefined",
          "description": "Overrides the vertical gap, including between wrapped rows."
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-layout-layout/#grid",
      "api": "/api/packages/layout/layout.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "advanced-fields",
          "title": "Advanced field compositions",
          "example": "advanced-fields",
          "source": "/examples/advanced-fields.tsx"
        },
        {
          "slug": "surface-compositions",
          "title": "Cards, media and composed dialogs",
          "example": "surface-compositions",
          "source": "/examples/surface-compositions.tsx"
        },
        {
          "slug": "consumer-experience",
          "title": "Interactive consumer experience",
          "example": "consumer-experience",
          "source": "/examples/consumer-experience.tsx"
        },
        {
          "slug": "layout",
          "title": "Layout primitives",
          "example": "layout",
          "source": "/examples/layout.tsx"
        },
        {
          "slug": "motion",
          "title": "Motion and presence",
          "example": "motion",
          "source": "/examples/motion.tsx"
        },
        {
          "slug": "pickers",
          "title": "Select and autocomplete",
          "example": "pickers",
          "source": "/examples/pickers.tsx"
        },
        {
          "slug": "display",
          "title": "Tables, lists and display",
          "example": "display",
          "source": "/examples/display.tsx"
        },
        {
          "slug": "theming",
          "title": "Theme and color system",
          "example": "theming",
          "source": "/examples/theming.tsx"
        }
      ]
    },
    {
      "name": "GridItem",
      "entry": "@fayegram-ai/faye-ui/layout/grid-item",
      "guide": "/docs/layout/",
      "declaration": "packages/faye-ui/dist/layout/grid-item.d.ts",
      "signature": "({ profile, span, start, order, className, ...props }: GridItemProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "order",
          "optional": true,
          "type": "Responsive<0 | GridLine> | undefined",
          "description": ""
        },
        {
          "name": "profile",
          "optional": true,
          "type": "ComponentProfile | undefined",
          "description": ""
        },
        {
          "name": "span",
          "optional": true,
          "type": "Responsive<\"auto\" | \"full\" | GridLine> | undefined",
          "description": ""
        },
        {
          "name": "start",
          "optional": true,
          "type": "Responsive<\"auto\" | GridLine> | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-layout-grid-item/#griditem",
      "api": "/api/packages/layout/grid-item.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "layout",
          "title": "Layout primitives",
          "example": "layout",
          "source": "/examples/layout.tsx"
        }
      ]
    },
    {
      "name": "Heading",
      "entry": "@fayegram-ai/faye-ui/core/text",
      "guide": "/docs/foundations/",
      "declaration": "packages/faye-ui/dist/core/text.d.ts",
      "signature": "({ level, size, variant, profile, className, ...props }: HeadingProps): import(\"react\").DetailedReactHTMLElement<{ className: string; \"data-variant\": string; \"data-size\": string | undefined; ref?: Ref<HTMLHeadingElement>; defaultChecked?: boolean | undefined; defaultValue?: string | number | readonly string[] | undefined; suppressContentEditableWarning?: boolean | undefined; suppressHydrationWarning?: boolean | undefined; accessKey?: string | undefined; autoCapitalize?: \"off\" | \"none\" | \"on\" | \"sentences\" | \"words\" | \"characters\" | undefined | (string & {}); autoFocus?: boolean | undefined; contentEditable?: (boolean | \"true\" | \"false\") | \"inherit\" | \"plaintext-only\" | undefined; contextMenu?: string | undefined; dir?: string | undefined; draggable?: (boolean | \"true\" | \"false\") | undefined; enterKeyHint?: \"enter\" | \"done\" | \"go\" | \"next\" | \"previous\" | \"search\" | \"send\" | undefined; hidden?: boolean | undefined; id?: string | undefined; lang?: string | undefined; nonce?: string | undefined; slot?: string | undefined; spellCheck?: (boolean | \"true\" | \"false\") | undefined; style?: import(\"react\").CSSProperties | undefined; tabIndex?: number | undefined; title?: string | undefined; translate?: \"yes\" | \"no\" | undefined; radioGroup?: string | undefined; role?: import(\"react\").AriaRole | undefined; about?: string | undefined; content?: string | undefined; datatype?: string | undefined; inlist?: any; prefix?: string | undefined; property?: string | undefined; rel?: string | undefined; resource?: string | undefined; rev?: string | undefined; typeof?: string | undefined; vocab?: string | undefined; autoCorrect?: string | undefined; autoSave?: string | undefined; color?: string | undefined; itemProp?: string | undefined; itemScope?: boolean | undefined; itemType?: string | undefined; itemID?: string | undefined; itemRef?: string | undefined; results?: number | undefined; security?: string | undefined; unselectable?: \"on\" | \"off\" | undefined; popover?: \"\" | \"auto\" | \"manual\" | \"hint\" | undefined; popoverTargetAction?: \"toggle\" | \"show\" | \"hide\" | undefined; popoverTarget?: string | undefined; inert?: boolean | undefined; inputMode?: \"none\" | \"text\" | \"tel\" | \"url\" | \"email\" | \"numeric\" | \"decimal\" | \"search\" | undefined; is?: string | undefined; exportparts?: string | undefined; part?: string | undefined; \"aria-activedescendant\"?: string | undefined; \"aria-atomic\"?: (boolean | \"true\" | \"false\") | undefined; \"aria-autocomplete\"?: \"none\" | \"inline\" | \"list\" | \"both\" | undefined; \"aria-braillelabel\"?: string | undefined; \"aria-brailleroledescription\"?: string | undefined; \"aria-busy\"?: (boolean | \"true\" | \"false\") | undefined; \"aria-checked\"?: boolean | \"false\" | \"mixed\" | \"true\" | undefined; \"aria-colcount\"?: number | undefined; \"aria-colindex\"?: number | undefined; \"aria-colindextext\"?: string | undefined; \"aria-colspan\"?: number | undefined; \"aria-controls\"?: string | undefined; \"aria-current\"?: boolean | \"false\" | \"true\" | \"page\" | \"step\" | \"location\" | \"date\" | \"time\" | undefined; \"aria-describedby\"?: string | undefined; \"aria-description\"?: string | undefined; \"aria-details\"?: string | undefined; \"aria-disabled\"?: (boolean | \"true\" | \"false\") | undefined; \"aria-dropeffect\"?: \"none\" | \"copy\" | \"execute\" | \"link\" | \"move\" | \"popup\" | undefined; \"aria-errormessage\"?: string | undefined; \"aria-expanded\"?: (boolean | \"true\" | \"false\") | undefined; \"aria-flowto\"?: string | undefined; \"aria-grabbed\"?: (boolean | \"true\" | \"false\") | undefined; \"aria-haspopup\"?: boolean | \"false\" | \"true\" | \"menu\" | \"listbox\" | \"tree\" | \"grid\" | \"dialog\" | undefined; \"aria-hidden\"?: (boolean | \"true\" | \"false\") | undefined; \"aria-invalid\"?: boolean | \"false\" | \"true\" | \"grammar\" | \"spelling\" | undefined; \"aria-keyshortcuts\"?: string | undefined; \"aria-label\"?: string | undefined; \"aria-labelledby\"?: string | undefined; \"aria-level\"?: number | undefined; \"aria-live\"?: \"off\" | \"assertive\" | \"polite\" | undefined; \"aria-modal\"?: (boolean | \"true\" | \"false\") | undefined; \"aria-multiline\"?: (boolean | \"true\" | \"false\") | undefined; \"aria-multiselectable\"?: (boolean | \"true\" | \"false\") | undefined; \"aria-orientation\"?: \"horizontal\" | \"vertical\" | undefined; \"aria-owns\"?: string | undefined; \"aria-placeholder\"?: string | undefined; \"aria-posinset\"?: number | undefined; \"aria-pressed\"?: boolean | \"false\" | \"mixed\" | \"true\" | undefined; \"aria-readonly\"?: (boolean | \"true\" | \"false\") | undefined; \"aria-relevant\"?: \"additions\" | \"additions removals\" | \"additions text\" | \"all\" | \"removals\" | \"removals additions\" | \"removals text\" | \"text\" | \"text additions\" | \"text removals\" | undefined; \"aria-required\"?: (boolean | \"true\" | \"false\") | undefined; \"aria-roledescription\"?: string | undefined; \"aria-rowcount\"?: number | undefined; \"aria-rowindex\"?: number | undefined; \"aria-rowindextext\"?: string | undefined; \"aria-rowspan\"?: number | undefined; \"aria-selected\"?: (boolean | \"true\" | \"false\") | undefined; \"aria-setsize\"?: number | undefined; \"aria-sort\"?: \"none\" | \"ascending\" | \"descending\" | \"other\" | undefined; \"aria-valuemax\"?: number | undefined; \"aria-valuemin\"?: number | undefined; \"aria-valuenow\"?: number | undefined; \"aria-valuetext\"?: string | undefined; children?: import(\"react\").ReactNode | undefined; dangerouslySetInnerHTML?: { __html: string | TrustedHTML; } | undefined; onCopy?: import(\"react\").ClipboardEventHandler<HTMLHeadingElement> | undefined; onCopyCapture?: import(\"react\").ClipboardEventHandler<HTMLHeadingElement> | undefined; onCut?: import(\"react\").ClipboardEventHandler<HTMLHeadingElement> | undefined; onCutCapture?: import(\"react\").ClipboardEventHandler<HTMLHeadingElement> | undefined; onPaste?: import(\"react\").ClipboardEventHandler<HTMLHeadingElement> | undefined; onPasteCapture?: import(\"react\").ClipboardEventHandler<HTMLHeadingElement> | undefined; onCompositionEnd?: import(\"react\").CompositionEventHandler<HTMLHeadingElement> | undefined; onCompositionEndCapture?: import(\"react\").CompositionEventHandler<HTMLHeadingElement> | undefined; onCompositionStart?: import(\"react\").CompositionEventHandler<HTMLHeadingElement> | undefined; onCompositionStartCapture?: import(\"react\").CompositionEventHandler<HTMLHeadingElement> | undefined; onCompositionUpdate?: import(\"react\").CompositionEventHandler<HTMLHeadingElement> | undefined; onCompositionUpdateCapture?: import(\"react\").CompositionEventHandler<HTMLHeadingElement> | undefined; onFocus?: import(\"react\").FocusEventHandler<HTMLHeadingElement> | undefined; onFocusCapture?: import(\"react\").FocusEventHandler<HTMLHeadingElement> | undefined; onBlur?: import(\"react\").FocusEventHandler<HTMLHeadingElement> | undefined; onBlurCapture?: import(\"react\").FocusEventHandler<HTMLHeadingElement> | undefined; onChange?: import(\"react\").ChangeEventHandler<HTMLHeadingElement, Element> | undefined; onChangeCapture?: import(\"react\").ChangeEventHandler<HTMLHeadingElement, Element> | undefined; onBeforeInput?: import(\"react\").InputEventHandler<HTMLHeadingElement> | undefined; onBeforeInputCapture?: import(\"react\").InputEventHandler<HTMLHeadingElement> | undefined; onInput?: import(\"react\").InputEventHandler<HTMLHeadingElement> | undefined; onInputCapture?: import(\"react\").InputEventHandler<HTMLHeadingElement> | undefined; onReset?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onResetCapture?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onSubmit?: import(\"react\").SubmitEventHandler<HTMLHeadingElement> | undefined; onSubmitCapture?: import(\"react\").SubmitEventHandler<HTMLHeadingElement> | undefined; onInvalid?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onInvalidCapture?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onLoad?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onLoadCapture?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onError?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onErrorCapture?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onKeyDown?: import(\"react\").KeyboardEventHandler<HTMLHeadingElement> | undefined; onKeyDownCapture?: import(\"react\").KeyboardEventHandler<HTMLHeadingElement> | undefined; onKeyPress?: import(\"react\").KeyboardEventHandler<HTMLHeadingElement> | undefined; onKeyPressCapture?: import(\"react\").KeyboardEventHandler<HTMLHeadingElement> | undefined; onKeyUp?: import(\"react\").KeyboardEventHandler<HTMLHeadingElement> | undefined; onKeyUpCapture?: import(\"react\").KeyboardEventHandler<HTMLHeadingElement> | undefined; onAbort?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onAbortCapture?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onCanPlay?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onCanPlayCapture?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onCanPlayThrough?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onCanPlayThroughCapture?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onDurationChange?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onDurationChangeCapture?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onEmptied?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onEmptiedCapture?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onEncrypted?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onEncryptedCapture?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onEnded?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onEndedCapture?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onLoadedData?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onLoadedDataCapture?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onLoadedMetadata?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onLoadedMetadataCapture?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onLoadStart?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onLoadStartCapture?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onPause?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onPauseCapture?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onPlay?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onPlayCapture?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onPlaying?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onPlayingCapture?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onProgress?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onProgressCapture?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onRateChange?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onRateChangeCapture?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onSeeked?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onSeekedCapture?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onSeeking?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onSeekingCapture?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onStalled?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onStalledCapture?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onSuspend?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onSuspendCapture?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onTimeUpdate?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onTimeUpdateCapture?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onVolumeChange?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onVolumeChangeCapture?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onWaiting?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onWaitingCapture?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onAuxClick?: import(\"react\").MouseEventHandler<HTMLHeadingElement> | undefined; onAuxClickCapture?: import(\"react\").MouseEventHandler<HTMLHeadingElement> | undefined; onClick?: import(\"react\").MouseEventHandler<HTMLHeadingElement> | undefined; onClickCapture?: import(\"react\").MouseEventHandler<HTMLHeadingElement> | undefined; onContextMenu?: import(\"react\").MouseEventHandler<HTMLHeadingElement> | undefined; onContextMenuCapture?: import(\"react\").MouseEventHandler<HTMLHeadingElement> | undefined; onDoubleClick?: import(\"react\").MouseEventHandler<HTMLHeadingElement> | undefined; onDoubleClickCapture?: import(\"react\").MouseEventHandler<HTMLHeadingElement> | undefined; onDrag?: import(\"react\").DragEventHandler<HTMLHeadingElement> | undefined; onDragCapture?: import(\"react\").DragEventHandler<HTMLHeadingElement> | undefined; onDragEnd?: import(\"react\").DragEventHandler<HTMLHeadingElement> | undefined; onDragEndCapture?: import(\"react\").DragEventHandler<HTMLHeadingElement> | undefined; onDragEnter?: import(\"react\").DragEventHandler<HTMLHeadingElement> | undefined; onDragEnterCapture?: import(\"react\").DragEventHandler<HTMLHeadingElement> | undefined; onDragExit?: import(\"react\").DragEventHandler<HTMLHeadingElement> | undefined; onDragExitCapture?: import(\"react\").DragEventHandler<HTMLHeadingElement> | undefined; onDragLeave?: import(\"react\").DragEventHandler<HTMLHeadingElement> | undefined; onDragLeaveCapture?: import(\"react\").DragEventHandler<HTMLHeadingElement> | undefined; onDragOver?: import(\"react\").DragEventHandler<HTMLHeadingElement> | undefined; onDragOverCapture?: import(\"react\").DragEventHandler<HTMLHeadingElement> | undefined; onDragStart?: import(\"react\").DragEventHandler<HTMLHeadingElement> | undefined; onDragStartCapture?: import(\"react\").DragEventHandler<HTMLHeadingElement> | undefined; onDrop?: import(\"react\").DragEventHandler<HTMLHeadingElement> | undefined; onDropCapture?: import(\"react\").DragEventHandler<HTMLHeadingElement> | undefined; onMouseDown?: import(\"react\").MouseEventHandler<HTMLHeadingElement> | undefined; onMouseDownCapture?: import(\"react\").MouseEventHandler<HTMLHeadingElement> | undefined; onMouseEnter?: import(\"react\").MouseEventHandler<HTMLHeadingElement> | undefined; onMouseLeave?: import(\"react\").MouseEventHandler<HTMLHeadingElement> | undefined; onMouseMove?: import(\"react\").MouseEventHandler<HTMLHeadingElement> | undefined; onMouseMoveCapture?: import(\"react\").MouseEventHandler<HTMLHeadingElement> | undefined; onMouseOut?: import(\"react\").MouseEventHandler<HTMLHeadingElement> | undefined; onMouseOutCapture?: import(\"react\").MouseEventHandler<HTMLHeadingElement> | undefined; onMouseOver?: import(\"react\").MouseEventHandler<HTMLHeadingElement> | undefined; onMouseOverCapture?: import(\"react\").MouseEventHandler<HTMLHeadingElement> | undefined; onMouseUp?: import(\"react\").MouseEventHandler<HTMLHeadingElement> | undefined; onMouseUpCapture?: import(\"react\").MouseEventHandler<HTMLHeadingElement> | undefined; onSelect?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onSelectCapture?: import(\"react\").ReactEventHandler<HTMLHeadingElement> | undefined; onTouchCancel?: import(\"react\").TouchEventHandler<HTMLHeadingElement> | undefined; onTouchCancelCapture?: import(\"react\").TouchEventHandler<HTMLHeadingElement> | undefined; onTouchEnd?: import(\"react\").TouchEventHandler<HTMLHeadingElement> | undefined; onTouchEndCapture?: import(\"react\").TouchEventHandler<HTMLHeadingElement> | undefined; onTouchMove?: import(\"react\").TouchEventHandler<HTMLHeadingElement> | undefined; onTouchMoveCapture?: import(\"react\").TouchEventHandler<HTMLHeadingElement> | undefined; onTouchStart?: import(\"react\").TouchEventHandler<HTMLHeadingElement> | undefined; onTouchStartCapture?: import(\"react\").TouchEventHandler<HTMLHeadingElement> | undefined; onPointerDown?: import(\"react\").PointerEventHandler<HTMLHeadingElement> | undefined; onPointerDownCapture?: import(\"react\").PointerEventHandler<HTMLHeadingElement> | undefined; onPointerMove?: import(\"react\").PointerEventHandler<HTMLHeadingElement> | undefined; onPointerMoveCapture?: import(\"react\").PointerEventHandler<HTMLHeadingElement> | undefined; onPointerUp?: import(\"react\").PointerEventHandler<HTMLHeadingElement> | undefined; onPointerUpCapture?: import(\"react\").PointerEventHandler<HTMLHeadingElement> | undefined; onPointerCancel?: import(\"react\").PointerEventHandler<HTMLHeadingElement> | undefined; onPointerCancelCapture?: import(\"react\").PointerEventHandler<HTMLHeadingElement> | undefined; onPointerEnter?: import(\"react\").PointerEventHandler<HTMLHeadingElement> | undefined; onPointerLeave?: import(\"react\").PointerEventHandler<HTMLHeadingElement> | undefined; onPointerOver?: import(\"react\").PointerEventHandler<HTMLHeadingElement> | undefined; onPointerOverCapture?: import(\"react\").PointerEventHandler<HTMLHeadingElement> | undefined; onPointerOut?: import(\"react\").PointerEventHandler<HTMLHeadingElement> | undefined; onPointerOutCapture?: import(\"react\").PointerEventHandler<HTMLHeadingElement> | undefined; onGotPointerCapture?: import(\"react\").PointerEventHandler<HTMLHeadingElement> | undefined; onGotPointerCaptureCapture?: import(\"react\").PointerEventHandler<HTMLHeadingElement> | undefined; onLostPointerCapture?: import(\"react\").PointerEventHandler<HTMLHeadingElement> | undefined; onLostPointerCaptureCapture?: import(\"react\").PointerEventHandler<HTMLHeadingElement> | undefined; onScroll?: import(\"react\").UIEventHandler<HTMLHeadingElement> | undefined; onScrollCapture?: import(\"react\").UIEventHandler<HTMLHeadingElement> | undefined; onScrollEnd?: import(\"react\").UIEventHandler<HTMLHeadingElement> | undefined; onScrollEndCapture?: import(\"react\").UIEventHandler<HTMLHeadingElement> | undefined; onWheel?: import(\"react\").WheelEventHandler<HTMLHeadingElement> | undefined; onWheelCapture?: import(\"react\").WheelEventHandler<HTMLHeadingElement> | undefined; onAnimationStart?: import(\"react\").AnimationEventHandler<HTMLHeadingElement> | undefined; onAnimationStartCapture?: import(\"react\").AnimationEventHandler<HTMLHeadingElement> | undefined; onAnimationEnd?: import(\"react\").AnimationEventHandler<HTMLHeadingElement> | undefined; onAnimationEndCapture?: import(\"react\").AnimationEventHandler<HTMLHeadingElement> | undefined; onAnimationIteration?: import(\"react\").AnimationEventHandler<HTMLHeadingElement> | undefined; onAnimationIterationCapture?: import(\"react\").AnimationEventHandler<HTMLHeadingElement> | undefined; onToggle?: import(\"react\").ToggleEventHandler<HTMLHeadingElement> | undefined; onBeforeToggle?: import(\"react\").ToggleEventHandler<HTMLHeadingElement> | undefined; onTransitionCancel?: import(\"react\").TransitionEventHandler<HTMLHeadingElement> | undefined; onTransitionCancelCapture?: import(\"react\").TransitionEventHandler<HTMLHeadingElement> | undefined; onTransitionEnd?: import(\"react\").TransitionEventHandler<HTMLHeadingElement> | undefined; onTransitionEndCapture?: import(\"react\").TransitionEventHandler<HTMLHeadingElement> | undefined; onTransitionRun?: import(\"react\").TransitionEventHandler<HTMLHeadingElement> | undefined; onTransitionRunCapture?: import(\"react\").TransitionEventHandler<HTMLHeadingElement> | undefined; onTransitionStart?: import(\"react\").TransitionEventHandler<HTMLHeadingElement> | undefined; onTransitionStartCapture?: import(\"react\").TransitionEventHandler<HTMLHeadingElement> | undefined; }, HTMLHeadingElement>",
      "props": [
        {
          "name": "level",
          "optional": true,
          "type": "2 | 3 | 1 | 5 | 4 | 6 | undefined",
          "description": ""
        },
        {
          "name": "profile",
          "optional": true,
          "type": "ComponentProfile | undefined",
          "description": ""
        },
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLHeadingElement> | undefined",
          "description": ""
        },
        {
          "name": "size",
          "optional": true,
          "type": "VisualVariant<\"heading\", \"size\"> | undefined",
          "description": ""
        },
        {
          "name": "variant",
          "optional": true,
          "type": "VisualVariant<\"heading\", \"variant\"> | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-core-text/#heading",
      "api": "/api/packages/core/text.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "advanced-fields",
          "title": "Advanced field compositions",
          "example": "advanced-fields",
          "source": "/examples/advanced-fields.tsx"
        },
        {
          "slug": "all-components",
          "title": "All components gallery",
          "example": "all-components",
          "source": "/examples/all-components.tsx"
        },
        {
          "slug": "surface-compositions",
          "title": "Cards, media and composed dialogs",
          "example": "surface-compositions",
          "source": "/examples/surface-compositions.tsx"
        },
        {
          "slug": "consumer-experience",
          "title": "Interactive consumer experience",
          "example": "consumer-experience",
          "source": "/examples/consumer-experience.tsx"
        },
        {
          "slug": "interaction-compositions",
          "title": "Motion and interactive navigation",
          "example": "interaction-compositions",
          "source": "/examples/interaction-compositions.tsx"
        },
        {
          "slug": "theming",
          "title": "Theme and color system",
          "example": "theming",
          "source": "/examples/theming.tsx"
        },
        {
          "slug": "foundations",
          "title": "Typography and surfaces",
          "example": "foundations",
          "source": "/examples/foundations.tsx"
        }
      ]
    },
    {
      "name": "Icon",
      "entry": "@fayegram-ai/faye-ui/core/icon",
      "guide": "/docs/foundations/",
      "declaration": "packages/faye-ui/dist/core/icon.d.ts",
      "signature": "({ icon, size, label, mirrorInRtl, className, children, ...props }: IconProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "children",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "icon",
          "optional": true,
          "type": "IconDefinition | undefined",
          "description": ""
        },
        {
          "name": "label",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "mirrorInRtl",
          "optional": true,
          "type": "boolean | undefined",
          "description": "Mirrors artwork in RTL without changing the outer SVG positioning transform."
        },
        {
          "name": "size",
          "optional": true,
          "type": "\"xs\" | \"sm\" | \"md\" | \"lg\" | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "One SVG renderer; icon collections are supplied by consumers, never imported here.",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-core-icon/#icon",
      "api": "/api/packages/core/icon.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "advanced-fields",
          "title": "Advanced field compositions",
          "example": "advanced-fields",
          "source": "/examples/advanced-fields.tsx"
        },
        {
          "slug": "patterns",
          "title": "Application patterns",
          "example": "patterns",
          "source": "/examples/patterns.tsx"
        },
        {
          "slug": "buttons",
          "title": "Buttons and actions",
          "example": "buttons",
          "source": "/examples/buttons.tsx"
        },
        {
          "slug": "surface-compositions",
          "title": "Cards, media and composed dialogs",
          "example": "surface-compositions",
          "source": "/examples/surface-compositions.tsx"
        },
        {
          "slug": "selection",
          "title": "Checkboxes, radios and switches",
          "example": "selection",
          "source": "/examples/selection.tsx"
        },
        {
          "slug": "functional-completion",
          "title": "Consumer interactions and navigation",
          "example": "functional-completion",
          "source": "/examples/functional-completion.tsx"
        },
        {
          "slug": "feedback",
          "title": "Feedback and status",
          "example": "feedback",
          "source": "/examples/feedback.tsx"
        },
        {
          "slug": "consumer-experience",
          "title": "Interactive consumer experience",
          "example": "consumer-experience",
          "source": "/examples/consumer-experience.tsx"
        },
        {
          "slug": "menus",
          "title": "Menus and contextual actions",
          "example": "menus",
          "source": "/examples/menus.tsx"
        },
        {
          "slug": "interaction-compositions",
          "title": "Motion and interactive navigation",
          "example": "interaction-compositions",
          "source": "/examples/interaction-compositions.tsx"
        },
        {
          "slug": "motion",
          "title": "Motion and presence",
          "example": "motion",
          "source": "/examples/motion.tsx"
        },
        {
          "slug": "navigation",
          "title": "Navigation and disclosure",
          "example": "navigation",
          "source": "/examples/navigation.tsx"
        },
        {
          "slug": "numeric",
          "title": "Numeric and specialized input",
          "example": "numeric",
          "source": "/examples/numeric.tsx"
        },
        {
          "slug": "fields",
          "title": "Text fields and forms",
          "example": "fields",
          "source": "/examples/fields.tsx"
        },
        {
          "slug": "foundations",
          "title": "Typography and surfaces",
          "example": "foundations",
          "source": "/examples/foundations.tsx"
        }
      ]
    },
    {
      "name": "IconButton",
      "entry": "@fayegram-ai/faye-ui/controls/button",
      "guide": "/docs/buttons/",
      "declaration": "packages/faye-ui/dist/controls/button.d.ts",
      "signature": "({ className, pendingPosition, ...props }: IconButtonProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "aria-label",
          "optional": false,
          "type": "string",
          "description": "Defines a string value that labels the current element."
        },
        {
          "name": "children",
          "optional": false,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "className",
          "optional": true,
          "type": "string | ((state: ButtonState) => string | undefined) | undefined",
          "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
        },
        {
          "name": "endIcon",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "focusableWhenDisabled",
          "optional": true,
          "type": "boolean | undefined",
          "description": "Whether the button should be focusable when disabled."
        },
        {
          "name": "fullWidth",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "nativeButton",
          "optional": true,
          "type": "boolean | undefined",
          "description": "Whether the component renders a native `<button>` element when replacing it\nvia the `render` prop.\nSet to `false` if the rendered element is not a button (for example, `<div>`)."
        },
        {
          "name": "pending",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "pendingIndicator",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "pendingPosition",
          "optional": true,
          "type": "\"center\" | \"start\" | \"end\" | undefined",
          "description": "Center replaces the label without a size change; start/end reserve an indicator slot."
        },
        {
          "name": "render",
          "optional": true,
          "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ButtonState> | undefined",
          "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
        },
        {
          "name": "size",
          "optional": true,
          "type": "ButtonSize | undefined",
          "description": ""
        },
        {
          "name": "startIcon",
          "optional": true,
          "type": "ReactNode",
          "description": "Decorative slots keep artwork and labels centered with the same gap on either side."
        },
        {
          "name": "style",
          "optional": true,
          "type": "CSSProperties | ((state: ButtonState) => React.CSSProperties | undefined) | undefined",
          "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
        },
        {
          "name": "tone",
          "optional": true,
          "type": "ButtonTone | undefined",
          "description": ""
        },
        {
          "name": "variant",
          "optional": true,
          "type": "ButtonVariant | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-controls-button/#iconbutton",
      "api": "/api/packages/controls/button.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "advanced-fields",
          "title": "Advanced field compositions",
          "example": "advanced-fields",
          "source": "/examples/advanced-fields.tsx"
        },
        {
          "slug": "buttons",
          "title": "Buttons and actions",
          "example": "buttons",
          "source": "/examples/buttons.tsx"
        },
        {
          "slug": "surface-compositions",
          "title": "Cards, media and composed dialogs",
          "example": "surface-compositions",
          "source": "/examples/surface-compositions.tsx"
        },
        {
          "slug": "functional-completion",
          "title": "Consumer interactions and navigation",
          "example": "functional-completion",
          "source": "/examples/functional-completion.tsx"
        },
        {
          "slug": "consumer-experience",
          "title": "Interactive consumer experience",
          "example": "consumer-experience",
          "source": "/examples/consumer-experience.tsx"
        },
        {
          "slug": "interaction-compositions",
          "title": "Motion and interactive navigation",
          "example": "interaction-compositions",
          "source": "/examples/interaction-compositions.tsx"
        }
      ]
    },
    {
      "name": "ImageList",
      "entry": "@fayegram-ai/faye-ui/display/image-list",
      "guide": "/docs/display/",
      "declaration": "packages/faye-ui/dist/display/image-list.d.ts",
      "signature": "({ profile, variant, children, className, ...props }: HTMLAttributes<HTMLUListElement> & { profile?: ComponentProfile; variant?: \"standard\" | \"quilted\" | \"woven\"; ref?: Ref<HTMLUListElement>; }): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "profile",
          "optional": true,
          "type": "ComponentProfile | undefined",
          "description": ""
        },
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLUListElement> | undefined",
          "description": ""
        },
        {
          "name": "variant",
          "optional": true,
          "type": "\"standard\" | \"quilted\" | \"woven\" | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-display-image-list/#imagelist",
      "api": "/api/packages/display/image-list.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "surface-compositions",
          "title": "Cards, media and composed dialogs",
          "example": "surface-compositions",
          "source": "/examples/surface-compositions.tsx"
        },
        {
          "slug": "display",
          "title": "Tables, lists and display",
          "example": "display",
          "source": "/examples/display.tsx"
        }
      ]
    },
    {
      "name": "ImageListItem",
      "entry": "@fayegram-ai/faye-ui/display/image-list",
      "guide": "/docs/display/",
      "declaration": "packages/faye-ui/dist/display/image-list.d.ts",
      "signature": "({ profile, caption, actions, captionPosition, columns, rows, ratio, style, children, className, ...props }: HTMLAttributes<HTMLLIElement> & { profile?: ComponentProfile; caption?: ReactNode; actions?: ReactNode; captionPosition?: \"below\" | \"overlay\"; columns?: 1 | 2; rows?: 1 | 2; ratio?: number; ref?: Ref<HTMLLIElement>; }): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "actions",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "caption",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "captionPosition",
          "optional": true,
          "type": "\"below\" | \"overlay\" | undefined",
          "description": ""
        },
        {
          "name": "columns",
          "optional": true,
          "type": "2 | 1 | undefined",
          "description": ""
        },
        {
          "name": "profile",
          "optional": true,
          "type": "ComponentProfile | undefined",
          "description": ""
        },
        {
          "name": "ratio",
          "optional": true,
          "type": "number | undefined",
          "description": ""
        },
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLLIElement> | undefined",
          "description": ""
        },
        {
          "name": "rows",
          "optional": true,
          "type": "2 | 1 | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-display-image-list/#imagelistitem",
      "api": "/api/packages/display/image-list.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "surface-compositions",
          "title": "Cards, media and composed dialogs",
          "example": "surface-compositions",
          "source": "/examples/surface-compositions.tsx"
        },
        {
          "slug": "display",
          "title": "Tables, lists and display",
          "example": "display",
          "source": "/examples/display.tsx"
        }
      ]
    },
    {
      "name": "Inline",
      "entry": "@fayegram-ai/faye-ui/layout/layout",
      "guide": "/docs/layout/",
      "declaration": "packages/faye-ui/dist/layout/layout.d.ts",
      "signature": "({ wrap, ...props }: InlineProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "align",
          "optional": true,
          "type": "Responsive<\"center\" | \"start\" | \"end\" | \"stretch\" | \"baseline\"> | undefined",
          "description": ""
        },
        {
          "name": "columnGap",
          "optional": true,
          "type": "Responsive<Space> | undefined",
          "description": "Overrides the horizontal gap independently of row spacing."
        },
        {
          "name": "gap",
          "optional": true,
          "type": "Responsive<Space> | undefined",
          "description": ""
        },
        {
          "name": "justify",
          "optional": true,
          "type": "Responsive<\"center\" | \"start\" | \"end\" | \"between\" | \"around\"> | undefined",
          "description": ""
        },
        {
          "name": "p",
          "optional": true,
          "type": "Responsive<Space> | undefined",
          "description": ""
        },
        {
          "name": "px",
          "optional": true,
          "type": "Responsive<Space> | undefined",
          "description": ""
        },
        {
          "name": "py",
          "optional": true,
          "type": "Responsive<Space> | undefined",
          "description": ""
        },
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLDivElement> | undefined",
          "description": ""
        },
        {
          "name": "rowGap",
          "optional": true,
          "type": "Responsive<Space> | undefined",
          "description": "Overrides the vertical gap, including between wrapped rows."
        },
        {
          "name": "wrap",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-layout-layout/#inline",
      "api": "/api/packages/layout/layout.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "accessibility",
          "title": "Accessibility and input behavior",
          "example": "accessibility",
          "source": "/examples/accessibility.tsx"
        },
        {
          "slug": "advanced-fields",
          "title": "Advanced field compositions",
          "example": "advanced-fields",
          "source": "/examples/advanced-fields.tsx"
        },
        {
          "slug": "async-workflows",
          "title": "Asynchronous workflows",
          "example": "async-workflows",
          "source": "/examples/async-workflows.tsx"
        },
        {
          "slug": "buttons",
          "title": "Buttons and actions",
          "example": "buttons",
          "source": "/examples/buttons.tsx"
        },
        {
          "slug": "selection",
          "title": "Checkboxes, radios and switches",
          "example": "selection",
          "source": "/examples/selection.tsx"
        },
        {
          "slug": "functional-completion",
          "title": "Consumer interactions and navigation",
          "example": "functional-completion",
          "source": "/examples/functional-completion.tsx"
        },
        {
          "slug": "customization",
          "title": "Customization sheets",
          "example": "customization",
          "source": "/examples/customization.tsx"
        },
        {
          "slug": "dialogs",
          "title": "Dialogs, modal and drawers",
          "example": "dialogs",
          "source": "/examples/dialogs.tsx"
        },
        {
          "slug": "feedback",
          "title": "Feedback and status",
          "example": "feedback",
          "source": "/examples/feedback.tsx"
        },
        {
          "slug": "consumer-experience",
          "title": "Interactive consumer experience",
          "example": "consumer-experience",
          "source": "/examples/consumer-experience.tsx"
        },
        {
          "slug": "layout",
          "title": "Layout primitives",
          "example": "layout",
          "source": "/examples/layout.tsx"
        },
        {
          "slug": "interaction-compositions",
          "title": "Motion and interactive navigation",
          "example": "interaction-compositions",
          "source": "/examples/interaction-compositions.tsx"
        },
        {
          "slug": "motion",
          "title": "Motion and presence",
          "example": "motion",
          "source": "/examples/motion.tsx"
        },
        {
          "slug": "numeric",
          "title": "Numeric and specialized input",
          "example": "numeric",
          "source": "/examples/numeric.tsx"
        },
        {
          "slug": "floating",
          "title": "Portals and floating content",
          "example": "floating",
          "source": "/examples/floating.tsx"
        },
        {
          "slug": "fields",
          "title": "Text fields and forms",
          "example": "fields",
          "source": "/examples/fields.tsx"
        },
        {
          "slug": "theming",
          "title": "Theme and color system",
          "example": "theming",
          "source": "/examples/theming.tsx"
        },
        {
          "slug": "foundations",
          "title": "Typography and surfaces",
          "example": "foundations",
          "source": "/examples/foundations.tsx"
        }
      ]
    },
    {
      "name": "Input",
      "entry": "@fayegram-ai/faye-ui/controls/input",
      "guide": "/docs/fields/",
      "declaration": "packages/faye-ui/dist/controls/input.d.ts",
      "signature": "(input: InputProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "className",
          "optional": true,
          "type": "string | ((state: InputState) => string | undefined) | undefined",
          "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
        },
        {
          "name": "defaultValue",
          "optional": true,
          "type": "string | number | readonly string[] | undefined",
          "description": "The default value of the input. Use when uncontrolled."
        },
        {
          "name": "htmlSize",
          "optional": true,
          "type": "number | undefined",
          "description": ""
        },
        {
          "name": "invalid",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "onValueChange",
          "optional": true,
          "type": "((value: string, eventDetails: BaseInput.ChangeEventDetails) => void) | undefined",
          "description": "Callback fired when the `value` changes. Use when controlled."
        },
        {
          "name": "render",
          "optional": true,
          "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, InputState> | undefined",
          "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
        },
        {
          "name": "size",
          "optional": true,
          "type": "VisualVariant<\"input\", \"size\"> | undefined",
          "description": ""
        },
        {
          "name": "style",
          "optional": true,
          "type": "CSSProperties | ((state: InputState) => React.CSSProperties | undefined) | undefined",
          "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
        },
        {
          "name": "value",
          "optional": true,
          "type": "string | number | readonly string[] | undefined",
          "description": "The value of the input. Use when controlled."
        },
        {
          "name": "variant",
          "optional": true,
          "type": "VisualVariant<\"input\", \"variant\"> | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-controls-input/#input",
      "api": "/api/packages/controls/input.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "accessibility",
          "title": "Accessibility and input behavior",
          "example": "accessibility",
          "source": "/examples/accessibility.tsx"
        },
        {
          "slug": "utilities",
          "title": "Browser and interaction utilities",
          "example": "utilities",
          "source": "/examples/utilities.tsx"
        },
        {
          "slug": "component-reference",
          "title": "Component reference",
          "example": "component-reference",
          "source": "/examples/component-reference.tsx"
        },
        {
          "slug": "fields",
          "title": "Text fields and forms",
          "example": "fields",
          "source": "/examples/fields.tsx"
        }
      ]
    },
    {
      "name": "InputAdornment",
      "entry": "@fayegram-ai/faye-ui/controls/input-group",
      "guide": "/docs/fields/",
      "declaration": "packages/faye-ui/dist/controls/input-group.d.ts",
      "signature": "({ profile, position, className, ...props }: HTMLAttributes<HTMLSpanElement> & { position?: \"start\" | \"end\"; profile?: ComponentProfile; }): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "position",
          "optional": true,
          "type": "\"start\" | \"end\" | undefined",
          "description": ""
        },
        {
          "name": "profile",
          "optional": true,
          "type": "ComponentProfile | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-controls-input-group/#inputadornment",
      "api": "/api/packages/controls/input-group.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "fields",
          "title": "Text fields and forms",
          "example": "fields",
          "source": "/examples/fields.tsx"
        }
      ]
    },
    {
      "name": "InputGroup",
      "entry": "@fayegram-ai/faye-ui/controls/input-group",
      "guide": "/docs/fields/",
      "declaration": "packages/faye-ui/dist/controls/input-group.d.ts",
      "signature": "({ profile, className, frame, variant, invalid, disabled, readOnly, ...props }: InputGroupProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "disabled",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "frame",
          "optional": true,
          "type": "boolean | undefined",
          "description": "One shared frame by default; false retains a frameless sibling layout."
        },
        {
          "name": "invalid",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "profile",
          "optional": true,
          "type": "ComponentProfile | undefined",
          "description": ""
        },
        {
          "name": "readOnly",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLDivElement> | undefined",
          "description": ""
        },
        {
          "name": "variant",
          "optional": true,
          "type": "VisualVariant<\"input-group\", \"variant\"> | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "State props expose styling hooks; native control behavior still belongs to the input.",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-controls-input-group/#inputgroup",
      "api": "/api/packages/controls/input-group.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "fields",
          "title": "Text fields and forms",
          "example": "fields",
          "source": "/examples/fields.tsx"
        }
      ]
    },
    {
      "name": "InteractionHint",
      "entry": "@fayegram-ai/faye-ui/overlays/interaction-hint",
      "guide": "/docs/floating/",
      "declaration": "packages/faye-ui/dist/overlays/interaction-hint.d.ts",
      "signature": "({ children, content, disabled, id, side, align }: InteractionHintProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "align",
          "optional": true,
          "type": "Align | undefined",
          "description": ""
        },
        {
          "name": "children",
          "optional": false,
          "type": "ReactElement<unknown, string | JSXElementConstructor<any>>",
          "description": "One ref-forwarding control or composite control; no extra focus stop is added."
        },
        {
          "name": "content",
          "optional": false,
          "type": "ReactNode",
          "description": "Optional, noninteractive instructions. Essential labels/help belong on the control."
        },
        {
          "name": "disabled",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "id",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "side",
          "optional": true,
          "type": "Side | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "Compact guidance on keyboard focus, or any focus when hints=\"always\".",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-overlays-interaction-hint/#interactionhint",
      "api": "/api/packages/overlays/interaction-hint.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "accessibility",
          "title": "Accessibility and input behavior",
          "example": "accessibility",
          "source": "/examples/accessibility.tsx"
        }
      ]
    },
    {
      "name": "Kbd",
      "entry": "@fayegram-ai/faye-ui/core/code",
      "guide": "/docs/foundations/",
      "declaration": "packages/faye-ui/dist/core/code.d.ts",
      "signature": "({ className, ...props }: HTMLAttributes<HTMLElement>): import(\"react\").JSX.Element",
      "props": [],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-core-code/#kbd",
      "api": "/api/packages/core/code.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "foundations",
          "title": "Typography and surfaces",
          "example": "foundations",
          "source": "/examples/foundations.tsx"
        }
      ]
    },
    {
      "name": "LinearProgress",
      "entry": "@fayegram-ai/faye-ui/feedback/progress",
      "guide": "/docs/feedback/",
      "declaration": "packages/faye-ui/dist/feedback/progress.d.ts",
      "signature": "({ value, bufferValue, mode, min, max, label, showValue, ...props }: LinearProgressProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "animationDirection",
          "optional": true,
          "type": "\"ltr\" | \"rtl\" | undefined",
          "description": "Physical direction of indeterminate/query motion, independent of text direction."
        },
        {
          "name": "aria-valuetext",
          "optional": true,
          "type": "string | undefined",
          "description": "A string value that provides a user-friendly name for `aria-valuenow`, the current value of the progress bar."
        },
        {
          "name": "bufferValue",
          "optional": true,
          "type": "number | undefined",
          "description": ""
        },
        {
          "name": "className",
          "optional": true,
          "type": "string | ((state: ProgressRootState) => string | undefined) | undefined",
          "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
        },
        {
          "name": "format",
          "optional": true,
          "type": "Intl.NumberFormatOptions | undefined",
          "description": "Options to format the value."
        },
        {
          "name": "getAriaValueText",
          "optional": true,
          "type": "((formattedValue: string, value: number | null) => string) | undefined",
          "description": "Accepts a function which returns a string value that provides a human-readable text alternative for the current value of the progress bar."
        },
        {
          "name": "label",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "locale",
          "optional": true,
          "type": "Intl.LocalesArgument",
          "description": "The locale used by `Intl.NumberFormat` when formatting the value.\nDefaults to the user's runtime locale."
        },
        {
          "name": "max",
          "optional": true,
          "type": "number | undefined",
          "description": "The maximum value."
        },
        {
          "name": "min",
          "optional": true,
          "type": "number | undefined",
          "description": "The minimum value."
        },
        {
          "name": "mode",
          "optional": true,
          "type": "\"indeterminate\" | \"determinate\" | \"buffer\" | \"query\" | undefined",
          "description": ""
        },
        {
          "name": "render",
          "optional": true,
          "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ProgressRootState> | undefined",
          "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
        },
        {
          "name": "showValue",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "style",
          "optional": true,
          "type": "CSSProperties | ((state: ProgressRootState) => React.CSSProperties | undefined) | undefined",
          "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
        },
        {
          "name": "value",
          "optional": true,
          "type": "number | null | undefined",
          "description": ""
        },
        {
          "name": "variants",
          "optional": true,
          "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"progress\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"progress\", \"tone\"> | undefined; } | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "A buffer is a visual loaded amount; the accessible value remains completed work.",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-feedback-progress/#linearprogress",
      "api": "/api/packages/feedback/progress.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "advanced-fields",
          "title": "Advanced field compositions",
          "example": "advanced-fields",
          "source": "/examples/advanced-fields.tsx"
        },
        {
          "slug": "feedback",
          "title": "Feedback and status",
          "example": "feedback",
          "source": "/examples/feedback.tsx"
        },
        {
          "slug": "consumer-experience",
          "title": "Interactive consumer experience",
          "example": "consumer-experience",
          "source": "/examples/consumer-experience.tsx"
        }
      ]
    },
    {
      "name": "Link",
      "entry": "@fayegram-ai/faye-ui/controls/link",
      "guide": "/docs/buttons/",
      "declaration": "packages/faye-ui/dist/controls/link.d.ts",
      "signature": "({ subtle, className, target, rel, ...props }: LinkProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLAnchorElement> | undefined",
          "description": ""
        },
        {
          "name": "subtle",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-controls-link/#link",
      "api": "/api/packages/controls/link.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "buttons",
          "title": "Buttons and actions",
          "example": "buttons",
          "source": "/examples/buttons.tsx"
        }
      ]
    },
    {
      "name": "List",
      "entry": "@fayegram-ai/faye-ui/display/list",
      "guide": "/docs/display/",
      "declaration": "packages/faye-ui/dist/display/list.d.ts",
      "signature": "({ profile, className, ...props }: HTMLAttributes<HTMLUListElement> & { profile?: ComponentProfile; ref?: Ref<HTMLUListElement>; }): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "profile",
          "optional": true,
          "type": "ComponentProfile | undefined",
          "description": ""
        },
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLUListElement> | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-display-list/#list",
      "api": "/api/packages/display/list.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "surface-compositions",
          "title": "Cards, media and composed dialogs",
          "example": "surface-compositions",
          "source": "/examples/surface-compositions.tsx"
        },
        {
          "slug": "display",
          "title": "Tables, lists and display",
          "example": "display",
          "source": "/examples/display.tsx"
        }
      ]
    },
    {
      "name": "ListItem",
      "entry": "@fayegram-ai/faye-ui/display/list",
      "guide": "/docs/display/",
      "declaration": "packages/faye-ui/dist/display/list.d.ts",
      "signature": "({ profile, leading, trailing, className, children, ...props }: LiHTMLAttributes<HTMLLIElement> & { profile?: ComponentProfile; leading?: ReactNode; trailing?: ReactNode; ref?: Ref<HTMLLIElement>; }): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "leading",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "profile",
          "optional": true,
          "type": "ComponentProfile | undefined",
          "description": ""
        },
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLLIElement> | undefined",
          "description": ""
        },
        {
          "name": "trailing",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-display-list/#listitem",
      "api": "/api/packages/display/list.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "surface-compositions",
          "title": "Cards, media and composed dialogs",
          "example": "surface-compositions",
          "source": "/examples/surface-compositions.tsx"
        },
        {
          "slug": "display",
          "title": "Tables, lists and display",
          "example": "display",
          "source": "/examples/display.tsx"
        }
      ]
    },
    {
      "name": "ListItemButton",
      "entry": "@fayegram-ai/faye-ui/display/list",
      "guide": "/docs/display/",
      "declaration": "packages/faye-ui/dist/display/list.d.ts",
      "signature": "({ profile, selected, className, ...props }: ButtonHTMLAttributes<HTMLButtonElement> & { profile?: ComponentProfile; selected?: boolean; ref?: Ref<HTMLButtonElement>; }): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "profile",
          "optional": true,
          "type": "ComponentProfile | undefined",
          "description": ""
        },
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLButtonElement> | undefined",
          "description": ""
        },
        {
          "name": "selected",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "The row action and ListItem.trailing are siblings, so secondary controls never nest.",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-display-list/#listitembutton",
      "api": "/api/packages/display/list.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "surface-compositions",
          "title": "Cards, media and composed dialogs",
          "example": "surface-compositions",
          "source": "/examples/surface-compositions.tsx"
        }
      ]
    },
    {
      "name": "ListSubheader",
      "entry": "@fayegram-ai/faye-ui/display/list",
      "guide": "/docs/display/",
      "declaration": "packages/faye-ui/dist/display/list.d.ts",
      "signature": "({ profile, className, level, children, ...props }: LiHTMLAttributes<HTMLLIElement> & { profile?: ComponentProfile; level?: number; ref?: Ref<HTMLLIElement>; }): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "level",
          "optional": true,
          "type": "number | undefined",
          "description": ""
        },
        {
          "name": "profile",
          "optional": true,
          "type": "ComponentProfile | undefined",
          "description": ""
        },
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLLIElement> | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-display-list/#listsubheader",
      "api": "/api/packages/display/list.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "surface-compositions",
          "title": "Cards, media and composed dialogs",
          "example": "surface-compositions",
          "source": "/examples/surface-compositions.tsx"
        }
      ]
    },
    {
      "name": "Masonry",
      "entry": "@fayegram-ai/faye-ui/layout/masonry",
      "guide": "/docs/layout/",
      "declaration": "packages/faye-ui/dist/layout/masonry.d.ts",
      "signature": "({ profile, columns, gap, className, style, ...props }: HTMLAttributes<HTMLDivElement> & { profile?: ComponentProfile; columns?: Responsive<1 | 2 | 3 | 4 | 5 | 6>; gap?: Space; }): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "columns",
          "optional": true,
          "type": "Responsive<2 | 3 | 1 | 5 | 4 | 6> | undefined",
          "description": ""
        },
        {
          "name": "gap",
          "optional": true,
          "type": "Space | undefined",
          "description": ""
        },
        {
          "name": "profile",
          "optional": true,
          "type": "ComponentProfile | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "Native CSS columns: visual and keyboard reading order is column-major, not row-major.",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-layout-masonry/#masonry",
      "api": "/api/packages/layout/masonry.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "layout",
          "title": "Layout primitives",
          "example": "layout",
          "source": "/examples/layout.tsx"
        }
      ]
    },
    {
      "name": "Menu",
      "entry": "@fayegram-ai/faye-ui/overlays/menu",
      "guide": "/docs/menus/",
      "declaration": "packages/faye-ui/dist/overlays/menu.d.ts",
      "signature": null,
      "props": [],
      "parts": [
        {
          "name": "Root",
          "props": [
            {
              "name": "actionsRef",
              "optional": true,
              "type": "React.RefObject<MenuRootActions | null> | undefined",
              "description": "A ref to imperative actions.\n- `unmount`: Manually unmounts the menu.\n  Call this after any externally controlled closing animation finishes.\n- `close`: When specified, the menu can be closed imperatively."
            },
            {
              "name": "children",
              "optional": true,
              "type": "React.ReactNode | PayloadChildRenderFunction<Payload>",
              "description": "The content of the menu.\nThis can be a regular React node or a render function that receives the `payload` of the active trigger."
            },
            {
              "name": "closeParentOnEsc",
              "optional": true,
              "type": "boolean | undefined",
              "description": "When in a submenu, determines whether pressing the Escape key\ncloses the entire menu, or only the current child menu."
            },
            {
              "name": "defaultOpen",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the menu is initially open.\n\nTo render a controlled menu, use the `open` prop instead."
            },
            {
              "name": "defaultTriggerId",
              "optional": true,
              "type": "string | null | undefined",
              "description": "ID of the trigger that the menu is associated with.\nThis is useful in conjunction with the `defaultOpen` prop to create an initially open menu."
            },
            {
              "name": "disabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component should ignore user interaction."
            },
            {
              "name": "handle",
              "optional": true,
              "type": "MenuHandle<Payload> | undefined",
              "description": "A handle to associate the menu with a trigger.\nIf specified, allows external triggers to control the menu's open state."
            },
            {
              "name": "highlightItemOnHover",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether moving the pointer over items should highlight them.\nDisabling this prop allows CSS `:hover` to be differentiated from the `:focus` (`data-highlighted`) state."
            },
            {
              "name": "loopFocus",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to loop keyboard focus back to the first item\nwhen the end of the list is reached while using the arrow keys."
            },
            {
              "name": "modal",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Determines if the menu enters a modal state when open.\n- `true`: user interaction is limited to the menu: document page scroll is locked and pointer interactions on outside elements are disabled.\n- `false`: user interaction with the rest of the document is allowed.\n\nOn touch devices, a `true` modal blocks outside taps but leaves the page scrollable unless the popup spans nearly the full viewport width, matching native iOS behavior.\n\nNested menus ignore this prop, and menus opened by hover are never modal."
            },
            {
              "name": "onOpenChange",
              "optional": true,
              "type": "((open: boolean, eventDetails: MenuRoot.ChangeEventDetails) => void) | undefined",
              "description": "Event handler called when the menu is opened or closed."
            },
            {
              "name": "onOpenChangeComplete",
              "optional": true,
              "type": "((open: boolean) => void) | undefined",
              "description": "Event handler called after any animations complete when the menu is opened or closed."
            },
            {
              "name": "open",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the menu is currently open."
            },
            {
              "name": "orientation",
              "optional": true,
              "type": "MenuRootOrientation | undefined",
              "description": "The visual orientation of the menu.\nControls whether roving focus uses up/down or left/right arrow keys."
            },
            {
              "name": "triggerId",
              "optional": true,
              "type": "string | null | undefined",
              "description": "ID of the trigger that the menu is associated with.\nThis is useful in conjunction with the `open` prop to create a controlled menu.\nThere's no need to specify this prop when the menu is uncontrolled (that is, when the `open` prop is not set)."
            }
          ]
        },
        {
          "name": "SubmenuRoot",
          "props": [
            {
              "name": "actionsRef",
              "optional": true,
              "type": "React.RefObject<MenuRootActions | null> | undefined",
              "description": "A ref to imperative actions.\n- `unmount`: Manually unmounts the menu.\n  Call this after any externally controlled closing animation finishes.\n- `close`: When specified, the menu can be closed imperatively."
            },
            {
              "name": "children",
              "optional": true,
              "type": "React.ReactNode",
              "description": "The content of the submenu."
            },
            {
              "name": "closeParentOnEsc",
              "optional": true,
              "type": "boolean | undefined",
              "description": "When in a submenu, determines whether pressing the Escape key\ncloses the entire menu, or only the current child menu."
            },
            {
              "name": "defaultOpen",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the menu is initially open.\n\nTo render a controlled menu, use the `open` prop instead."
            },
            {
              "name": "disabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component should ignore user interaction."
            },
            {
              "name": "highlightItemOnHover",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether moving the pointer over items should highlight them.\nDisabling this prop allows CSS `:hover` to be differentiated from the `:focus` (`data-highlighted`) state."
            },
            {
              "name": "loopFocus",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to loop keyboard focus back to the first item\nwhen the end of the list is reached while using the arrow keys."
            },
            {
              "name": "onOpenChange",
              "optional": true,
              "type": "((open: boolean, eventDetails: MenuSubmenuRoot.ChangeEventDetails) => void) | undefined",
              "description": "Event handler called when the menu is opened or closed."
            },
            {
              "name": "onOpenChangeComplete",
              "optional": true,
              "type": "((open: boolean) => void) | undefined",
              "description": "Event handler called after any animations complete when the menu is opened or closed."
            },
            {
              "name": "open",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the menu is currently open."
            },
            {
              "name": "orientation",
              "optional": true,
              "type": "MenuRootOrientation | undefined",
              "description": "The visual orientation of the menu.\nControls whether roving focus uses up/down or left/right arrow keys."
            }
          ]
        },
        {
          "name": "RadioGroup",
          "props": [
            {
              "name": "children",
              "optional": true,
              "type": "ReactNode",
              "description": "The content of the component."
            },
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: MenuRadioGroupState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "defaultValue",
              "optional": true,
              "type": "any",
              "description": "The uncontrolled value of the radio item that should be initially selected.\n\nTo render a controlled radio group, use the `value` prop instead."
            },
            {
              "name": "disabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component should ignore user interaction."
            },
            {
              "name": "onValueChange",
              "optional": true,
              "type": "((value: any, eventDetails: MenuRadioGroup.ChangeEventDetails) => void) | undefined",
              "description": "Function called when the selected value changes."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, MenuRadioGroupState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: MenuRadioGroupState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "value",
              "optional": true,
              "type": "any",
              "description": "The controlled value of the radio item that should be currently selected.\n\nTo render an uncontrolled radio group, use the `defaultValue` prop instead."
            }
          ]
        },
        {
          "name": "Trigger",
          "props": [
            {
              "name": "children",
              "optional": true,
              "type": "ReactNode",
              "description": ""
            },
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: MenuTriggerState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "closeDelay",
              "optional": true,
              "type": "number | undefined",
              "description": "How long to wait before closing the menu that was opened on hover.\nSpecified in milliseconds.\n\nRequires the `openOnHover` prop."
            },
            {
              "name": "delay",
              "optional": true,
              "type": "number | undefined",
              "description": "How long to wait before the menu may be opened on hover. Specified in milliseconds.\n\nRequires the `openOnHover` prop."
            },
            {
              "name": "disabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component should ignore user interaction."
            },
            {
              "name": "handle",
              "optional": true,
              "type": "Base.Handle<unknown> | undefined",
              "description": "A handle to associate the trigger with a menu."
            },
            {
              "name": "nativeButton",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component renders a native `<button>` element when replacing it\nvia the `render` prop.\nSet to `false` if the rendered element is not a button (for example, `<div>`)."
            },
            {
              "name": "openOnHover",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the menu should also open when the trigger is hovered."
            },
            {
              "name": "payload",
              "optional": true,
              "type": "unknown",
              "description": "A payload to pass to the menu when it is opened."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, MenuTriggerState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: MenuTriggerState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Positioner",
          "props": [
            {
              "name": "align",
              "optional": true,
              "type": "Align | undefined",
              "description": "How to align the popup relative to the specified side.\n\nSubmenus and menubars default to `'start'`."
            },
            {
              "name": "alignOffset",
              "optional": true,
              "type": "number | OffsetFunction | undefined",
              "description": "Additional offset along the alignment axis in pixels.\nAlso accepts a function that returns the offset to read the dimensions of the anchor\nand positioner elements, along with its side and alignment.\n\nThe function takes a `data` object parameter with the following properties:\n- `data.anchor`: the dimensions of the anchor element with properties `width` and `height`.\n- `data.positioner`: the dimensions of the positioner element with properties `width` and `height`.\n- `data.side`: which side of the anchor element the positioner is aligned against.\n- `data.align`: how the positioner is aligned relative to the specified side."
            },
            {
              "name": "anchor",
              "optional": true,
              "type": "Element | VirtualElement | RefObject<Element | null> | (() => Element | VirtualElement | null) | null | undefined",
              "description": "An element to position the popup against.\nBy default, the popup will be positioned against the trigger."
            },
            {
              "name": "arrowPadding",
              "optional": true,
              "type": "number | undefined",
              "description": "Minimum distance to maintain between the arrow and the edges of the popup.\n\nUse it to prevent the arrow element from hanging out of the rounded corners of a popup."
            },
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: MenuPositionerState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "collisionAvoidance",
              "optional": true,
              "type": "CollisionAvoidance | undefined",
              "description": "Determines how to handle collisions when positioning the popup.\n\n`side` controls overflow on the preferred placement axis (`top`/`bottom` or `left`/`right`):\n- `'flip'`: keep the requested side when it fits; otherwise try the opposite side\n  (`top` and `bottom`, or `left` and `right`).\n- `'shift'`: never change side; keep the requested side and move the popup within\n  the clipping boundary so it stays visible.\n- `'none'`: do not correct side-axis overflow.\n\n`align` controls overflow on the alignment axis (`start`/`center`/`end`):\n- `'flip'`: keep side, but swap `start` and `end` when the requested alignment overflows.\n- `'shift'`: keep side and requested alignment, then nudge the popup along the\n  alignment axis to fit.\n- `'none'`: do not correct alignment-axis overflow.\n\n`fallbackAxisSide` controls fallback behavior on the perpendicular axis when the\npreferred axis cannot fit:\n- `'start'`: allow perpendicular fallback and try the logical start side first\n  (`top` before `bottom`, or `left` before `right` in LTR).\n- `'end'`: allow perpendicular fallback and try the logical end side first\n  (`bottom` before `top`, or `right` before `left` in LTR).\n- `'none'`: do not fallback to the perpendicular axis.\n\nWhen `side` is `'shift'`, explicitly setting `align` only supports `'shift'` or `'none'`.\nIf `align` is omitted, it defaults to `'flip'`."
            },
            {
              "name": "collisionBoundary",
              "optional": true,
              "type": "Boundary | undefined",
              "description": "An element or a rectangle that delimits the area that the popup is confined to."
            },
            {
              "name": "collisionPadding",
              "optional": true,
              "type": "Padding | undefined",
              "description": "Additional space to maintain from the edge of the collision boundary."
            },
            {
              "name": "disableAnchorTracking",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to disable the popup from tracking any layout shift of its positioning anchor."
            },
            {
              "name": "positionMethod",
              "optional": true,
              "type": "\"absolute\" | \"fixed\" | undefined",
              "description": "Determines which CSS `position` property to use."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, MenuPositionerState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "side",
              "optional": true,
              "type": "Side | undefined",
              "description": "Which side of the anchor element to align the popup against.\nMay automatically change to avoid collisions.\n\nSubmenus and vertical menubars default to `'inline-end'`."
            },
            {
              "name": "sideOffset",
              "optional": true,
              "type": "number | OffsetFunction | undefined",
              "description": "Distance between the anchor and the popup in pixels.\nAlso accepts a function that returns the distance to read the dimensions of the anchor\nand positioner elements, along with its side and alignment.\n\nThe function takes a `data` object parameter with the following properties:\n- `data.anchor`: the dimensions of the anchor element with properties `width` and `height`.\n- `data.positioner`: the dimensions of the positioner element with properties `width` and `height`.\n- `data.side`: which side of the anchor element the positioner is aligned against.\n- `data.align`: how the positioner is aligned relative to the specified side."
            },
            {
              "name": "sticky",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to maintain the popup in the viewport after\nthe anchor element was scrolled out of view."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: MenuPositionerState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Popup",
          "props": [
            {
              "name": "children",
              "optional": true,
              "type": "ReactNode",
              "description": ""
            },
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: MenuPopupState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "finalFocus",
              "optional": true,
              "type": "boolean | RefObject<HTMLElement | null> | ((closeType: InteractionType) => boolean | HTMLElement | null | void) | undefined",
              "description": "Determines the element to focus when the menu is closed.\n\n- `false`: Do not move focus.\n- `true`: Move focus based on the default behavior (trigger or previously focused element).\n- `RefObject`: Move focus to the ref element.\n- `function`: Called with the interaction type (`mouse`, `touch`, `pen`, or `keyboard`).\n  Return an element to focus, `true` to use the default behavior, or `false`/`undefined` to do nothing."
            },
            {
              "name": "id",
              "optional": true,
              "type": "string | undefined",
              "description": ""
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, MenuPopupState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: MenuPopupState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Item",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: MenuItemState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "closeOnClick",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to close the menu when the item is clicked."
            },
            {
              "name": "disabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component should ignore user interaction."
            },
            {
              "name": "id",
              "optional": true,
              "type": "string | undefined",
              "description": ""
            },
            {
              "name": "label",
              "optional": true,
              "type": "string | undefined",
              "description": "Overrides the text label to use when the item is matched during keyboard text navigation."
            },
            {
              "name": "nativeButton",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component renders a native `<button>` element when replacing it\nvia the `render` prop.\nSet to `true` if the rendered element is a native button."
            },
            {
              "name": "onClick",
              "optional": true,
              "type": "((event: BaseUIEvent<MouseEvent<HTMLDivElement, MouseEvent>>) => void) | undefined",
              "description": "The click handler for the menu item."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, MenuItemState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: MenuItemState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "LinkItem",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: MenuLinkItemState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "closeOnClick",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to close the menu when the item is clicked."
            },
            {
              "name": "id",
              "optional": true,
              "type": "string | undefined",
              "description": ""
            },
            {
              "name": "label",
              "optional": true,
              "type": "string | undefined",
              "description": "Overrides the text label to use when the item is matched during keyboard text navigation."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<DetailedHTMLProps<AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, MenuLinkItemState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: MenuLinkItemState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "CheckboxItemIndicator",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: MenuCheckboxItemIndicatorState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "keepMounted",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to keep the HTML element in the DOM when the checkbox item is not checked."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, MenuCheckboxItemIndicatorState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: MenuCheckboxItemIndicatorState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "RadioItemIndicator",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: MenuRadioItemIndicatorState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "keepMounted",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to keep the HTML element in the DOM when the radio item is inactive."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, MenuRadioItemIndicatorState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: MenuRadioItemIndicatorState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Backdrop",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: MenuBackdropState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, MenuBackdropState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: MenuBackdropState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Arrow",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: MenuArrowState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, MenuArrowState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: MenuArrowState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Viewport",
          "props": [
            {
              "name": "children",
              "optional": true,
              "type": "ReactNode",
              "description": "The content to render inside the transition container."
            },
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: MenuViewportState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, MenuViewportState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: MenuViewportState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "CheckboxItem",
          "props": [
            {
              "name": "checked",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the checkbox item is currently ticked.\n\nTo render an uncontrolled checkbox item, use the `defaultChecked` prop instead."
            },
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: MenuCheckboxItemState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "closeOnClick",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to close the menu when the item is clicked."
            },
            {
              "name": "defaultChecked",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the checkbox item is initially ticked.\n\nTo render a controlled checkbox item, use the `checked` prop instead."
            },
            {
              "name": "disabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component should ignore user interaction."
            },
            {
              "name": "id",
              "optional": true,
              "type": "string | undefined",
              "description": ""
            },
            {
              "name": "label",
              "optional": true,
              "type": "string | undefined",
              "description": "Overrides the text label to use when the item is matched during keyboard text navigation."
            },
            {
              "name": "nativeButton",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component renders a native `<button>` element when replacing it\nvia the `render` prop.\nSet to `true` if the rendered element is a native button."
            },
            {
              "name": "onCheckedChange",
              "optional": true,
              "type": "((checked: boolean, eventDetails: Base.CheckboxItem.ChangeEventDetails) => void) | undefined",
              "description": "Event handler called when the checkbox item is ticked or unticked."
            },
            {
              "name": "onClick",
              "optional": true,
              "type": "((event: BaseUIEvent<MouseEvent<HTMLDivElement, MouseEvent>>) => void) | undefined",
              "description": "The click handler for the menu item."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, MenuCheckboxItemState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: MenuCheckboxItemState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "RadioItem",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: MenuRadioItemState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "closeOnClick",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to close the menu when the item is clicked."
            },
            {
              "name": "disabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component should ignore user interaction."
            },
            {
              "name": "id",
              "optional": true,
              "type": "string | undefined",
              "description": ""
            },
            {
              "name": "label",
              "optional": true,
              "type": "string | undefined",
              "description": "Overrides the text label to use when the item is matched during keyboard text navigation."
            },
            {
              "name": "nativeButton",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component renders a native `<button>` element when replacing it\nvia the `render` prop.\nSet to `true` if the rendered element is a native button."
            },
            {
              "name": "onClick",
              "optional": true,
              "type": "((event: BaseUIEvent<MouseEvent<HTMLDivElement, MouseEvent>>) => void) | undefined",
              "description": "The click handler for the menu item."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, MenuRadioItemState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: MenuRadioItemState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "value",
              "optional": false,
              "type": "any",
              "description": "Value of the radio item.\nThis is the value that will be set in the MenuRadioGroup when the item is selected."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Group",
          "props": [
            {
              "name": "children",
              "optional": true,
              "type": "ReactNode",
              "description": "The content of the component."
            },
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: MenuGroupState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, MenuGroupState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: MenuGroupState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "GroupLabel",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: MenuGroupLabelState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, MenuGroupLabelState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: MenuGroupLabelState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Separator",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: SeparatorState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "orientation",
              "optional": true,
              "type": "Orientation | undefined",
              "description": "The orientation of the separator."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, SeparatorState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: SeparatorState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "SubmenuTrigger",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: MenuSubmenuTriggerState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "closeDelay",
              "optional": true,
              "type": "number | undefined",
              "description": "How long to wait before closing the menu that was opened on hover.\nSpecified in milliseconds.\n\nRequires the `openOnHover` prop."
            },
            {
              "name": "delay",
              "optional": true,
              "type": "number | undefined",
              "description": "How long to wait before the menu may be opened on hover. Specified in milliseconds.\n\nRequires the `openOnHover` prop."
            },
            {
              "name": "disabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component should ignore user interaction."
            },
            {
              "name": "id",
              "optional": true,
              "type": "string | undefined",
              "description": ""
            },
            {
              "name": "label",
              "optional": true,
              "type": "string | undefined",
              "description": "Overrides the text label to use when the item is matched during keyboard text navigation."
            },
            {
              "name": "nativeButton",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component renders a native `<button>` element when replacing it\nvia the `render` prop.\nSet to `true` if the rendered element is a native button."
            },
            {
              "name": "onClick",
              "optional": true,
              "type": "((event: BaseUIEvent<MouseEvent<HTMLDivElement, MouseEvent>>) => void) | undefined",
              "description": ""
            },
            {
              "name": "openOnHover",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the menu should also open when the trigger is hovered."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, MenuSubmenuTriggerState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: MenuSubmenuTriggerState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"menu\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Portal",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: MenuPortalState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "container",
              "optional": true,
              "type": "HTMLElement | ShadowRoot | RefObject<HTMLElement | ShadowRoot | null> | null | undefined",
              "description": "A parent element to render the portal element into."
            },
            {
              "name": "keepMounted",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to keep the portal mounted in the DOM while the popup is hidden."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, MenuPortalState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: MenuPortalState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            }
          ]
        }
      ],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-overlays-menu/#menu",
      "api": "/api/packages/overlays/menu.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "menus",
          "title": "Menus and contextual actions",
          "example": "menus",
          "source": "/examples/menus.tsx"
        },
        {
          "slug": "interaction-compositions",
          "title": "Motion and interactive navigation",
          "example": "interaction-compositions",
          "source": "/examples/interaction-compositions.tsx"
        }
      ]
    },
    {
      "name": "Menubar",
      "entry": "@fayegram-ai/faye-ui/navigation/menubar",
      "guide": "/docs/navigation/",
      "declaration": "packages/faye-ui/dist/navigation/menubar.d.ts",
      "signature": "(input: Omit<import(\"@base-ui/react\").MenubarProps, \"ref\"> & import(\"react\").RefAttributes<HTMLDivElement> & { variants?: {} | undefined; }): import(\"react\").ReactElement",
      "props": [
        {
          "name": "className",
          "optional": true,
          "type": "string | ((state: MenubarState) => string | undefined) | undefined",
          "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
        },
        {
          "name": "disabled",
          "optional": true,
          "type": "boolean | undefined",
          "description": "Whether the whole menubar is disabled."
        },
        {
          "name": "loopFocus",
          "optional": true,
          "type": "boolean | undefined",
          "description": "Whether to loop keyboard focus back to the first item\nwhen the end of the list is reached while using the arrow keys."
        },
        {
          "name": "modal",
          "optional": true,
          "type": "boolean | undefined",
          "description": "Whether the menubar is modal."
        },
        {
          "name": "orientation",
          "optional": true,
          "type": "MenuRootOrientation | undefined",
          "description": "The orientation of the menubar."
        },
        {
          "name": "render",
          "optional": true,
          "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, MenubarState> | undefined",
          "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
        },
        {
          "name": "style",
          "optional": true,
          "type": "CSSProperties | ((state: MenubarState) => React.CSSProperties | undefined) | undefined",
          "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
        },
        {
          "name": "variants",
          "optional": true,
          "type": "{} | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-navigation-menubar/#menubar",
      "api": "/api/packages/navigation/menubar.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "menus",
          "title": "Menus and contextual actions",
          "example": "menus",
          "source": "/examples/menus.tsx"
        }
      ]
    },
    {
      "name": "Meter",
      "entry": "@fayegram-ai/faye-ui/feedback/meter",
      "guide": "/docs/feedback/",
      "declaration": "packages/faye-ui/dist/feedback/meter.d.ts",
      "signature": null,
      "props": [],
      "parts": [
        {
          "name": "Root",
          "props": [
            {
              "name": "aria-valuetext",
              "optional": true,
              "type": "string | undefined",
              "description": "A string value that provides a user-friendly name for `aria-valuenow`, the current value of the meter."
            },
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: MeterRootState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "format",
              "optional": true,
              "type": "Intl.NumberFormatOptions | undefined",
              "description": "Options to format the value."
            },
            {
              "name": "getAriaValueText",
              "optional": true,
              "type": "((formattedValue: string, value: number) => string) | undefined",
              "description": "A function that returns a string value that provides a human-readable text alternative for `aria-valuenow`, the current value of the meter."
            },
            {
              "name": "locale",
              "optional": true,
              "type": "Intl.LocalesArgument",
              "description": "The locale used by `Intl.NumberFormat` when formatting the value.\nDefaults to the user's runtime locale."
            },
            {
              "name": "max",
              "optional": true,
              "type": "number | undefined",
              "description": "The maximum value"
            },
            {
              "name": "min",
              "optional": true,
              "type": "number | undefined",
              "description": "The minimum value"
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, MeterRootState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: MeterRootState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "value",
              "optional": false,
              "type": "number",
              "description": "The current value."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"meter\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"meter\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Track",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: MeterTrackState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, MeterTrackState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: MeterTrackState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"meter\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"meter\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Indicator",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: MeterIndicatorState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, MeterIndicatorState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: MeterIndicatorState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"meter\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"meter\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Value",
          "props": [
            {
              "name": "children",
              "optional": true,
              "type": "((formattedValue: string, value: number) => React.ReactNode) | null | undefined",
              "description": ""
            },
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: MeterValueState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, MeterValueState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: MeterValueState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"meter\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"meter\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Label",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: MeterLabelState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, MeterLabelState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: MeterLabelState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"meter\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"meter\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        }
      ],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-feedback-meter/#meter",
      "api": "/api/packages/feedback/meter.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "feedback",
          "title": "Feedback and status",
          "example": "feedback",
          "source": "/examples/feedback.tsx"
        }
      ]
    },
    {
      "name": "MobileStepper",
      "entry": "@fayegram-ai/faye-ui/navigation/mobile-stepper",
      "guide": "/docs/navigation/",
      "declaration": "packages/faye-ui/dist/navigation/mobile-stepper.d.ts",
      "signature": "({ steps, activeStep, variant, label, backButton, nextButton, formatLabel, profile, className, ...props }: MobileStepperProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "activeStep",
          "optional": false,
          "type": "number",
          "description": ""
        },
        {
          "name": "backButton",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "formatLabel",
          "optional": true,
          "type": "((current: number, total: number) => ReactNode) | undefined",
          "description": ""
        },
        {
          "name": "label",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "nextButton",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "profile",
          "optional": true,
          "type": "ComponentProfile | undefined",
          "description": ""
        },
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLDivElement> | undefined",
          "description": ""
        },
        {
          "name": "steps",
          "optional": false,
          "type": "number",
          "description": ""
        },
        {
          "name": "variant",
          "optional": true,
          "type": "\"progress\" | \"text\" | \"dots\" | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-navigation-mobile-stepper/#mobilestepper",
      "api": "/api/packages/navigation/mobile-stepper.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "interaction-compositions",
          "title": "Motion and interactive navigation",
          "example": "interaction-compositions",
          "source": "/examples/interaction-compositions.tsx"
        }
      ]
    },
    {
      "name": "Modal",
      "entry": "@fayegram-ai/faye-ui/overlays/modal",
      "guide": "/docs/dialogs/",
      "declaration": "packages/faye-ui/dist/overlays/modal.d.ts",
      "signature": "(input: ModalProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "children",
          "optional": false,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "closeLabel",
          "optional": true,
          "type": "string | undefined",
          "description": "Accessible label for the close control; localizable through modal/root settings."
        },
        {
          "name": "closeProps",
          "optional": true,
          "type": "(Omit<DialogCloseProps, \"ref\"> & RefAttributes<HTMLButtonElement> & { variants?: { readonly size?: import(\"packages/faye-ui/dist/contracts/visual-variants\").VisualVariant<\"dialog\", \"size\"> | undefined; readonly tone?: import(\"packages/faye-ui/dist/contracts/visual-variants\").VisualVariant<\"dialog\", \"tone\"> | undefined; } | undefined; }) | undefined",
          "description": "Override the default icon, events, styling or render element."
        },
        {
          "name": "description",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "footer",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "onOpenChange",
          "optional": false,
          "type": "(open: boolean) => void",
          "description": ""
        },
        {
          "name": "open",
          "optional": false,
          "type": "boolean",
          "description": ""
        },
        {
          "name": "size",
          "optional": true,
          "type": "\"sm\" | \"md\" | \"lg\" | undefined",
          "description": ""
        },
        {
          "name": "title",
          "optional": false,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "trigger",
          "optional": true,
          "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | undefined",
          "description": "Associate an opening control with the dialog for dismissal and focus restoration."
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-overlays-modal/#modal",
      "api": "/api/packages/overlays/modal.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "advanced-fields",
          "title": "Advanced field compositions",
          "example": "advanced-fields",
          "source": "/examples/advanced-fields.tsx"
        },
        {
          "slug": "dialogs",
          "title": "Dialogs, modal and drawers",
          "example": "dialogs",
          "source": "/examples/dialogs.tsx"
        },
        {
          "slug": "consumer-experience",
          "title": "Interactive consumer experience",
          "example": "consumer-experience",
          "source": "/examples/consumer-experience.tsx"
        },
        {
          "slug": "localization",
          "title": "Localization",
          "example": "localization",
          "source": "/examples/localization.tsx"
        }
      ]
    },
    {
      "name": "NativeSelect",
      "entry": "@fayegram-ai/faye-ui/controls/native-select",
      "guide": "/docs/pickers/",
      "declaration": "packages/faye-ui/dist/controls/native-select.d.ts",
      "signature": "({ profile, size, variant, htmlSize, invalid, className, ...props }: NativeSelectProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "htmlSize",
          "optional": true,
          "type": "number | undefined",
          "description": ""
        },
        {
          "name": "invalid",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "profile",
          "optional": true,
          "type": "ComponentProfile | undefined",
          "description": ""
        },
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLSelectElement> | undefined",
          "description": ""
        },
        {
          "name": "size",
          "optional": true,
          "type": "VisualVariant<\"native-select\", \"size\"> | undefined",
          "description": ""
        },
        {
          "name": "variant",
          "optional": true,
          "type": "VisualVariant<\"native-select\", \"variant\"> | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "Explicit profiles keep this primitive usable from Server Components.",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-controls-native-select/#nativeselect",
      "api": "/api/packages/controls/native-select.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "advanced-fields",
          "title": "Advanced field compositions",
          "example": "advanced-fields",
          "source": "/examples/advanced-fields.tsx"
        },
        {
          "slug": "localization",
          "title": "Localization",
          "example": "localization",
          "source": "/examples/localization.tsx"
        },
        {
          "slug": "pickers",
          "title": "Select and autocomplete",
          "example": "pickers",
          "source": "/examples/pickers.tsx"
        },
        {
          "slug": "fields",
          "title": "Text fields and forms",
          "example": "fields",
          "source": "/examples/fields.tsx"
        }
      ]
    },
    {
      "name": "NavigationDrawer",
      "entry": "@fayegram-ai/faye-ui/patterns/navigation-drawer",
      "guide": "/docs/patterns/",
      "declaration": "packages/faye-ui/dist/patterns/navigation-drawer.d.ts",
      "signature": "({ open, onOpenChange, title, navigation, miniNavigation, mode, edge, toggleLabel, closeLabel, triggerProps, closeProps, desktopTriggerProps, desktopCloseProps, className, children, ...props }: NavigationDrawerProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "closeLabel",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "closeProps",
          "optional": true,
          "type": "(Omit<DialogCloseProps, \"ref\"> & RefAttributes<HTMLButtonElement> & { variants?: { readonly size?: import(\"packages/faye-ui/dist/contracts/visual-variants\").VisualVariant<\"dialog\", \"size\"> | undefined; readonly tone?: import(\"packages/faye-ui/dist/contracts/visual-variants\").VisualVariant<\"dialog\", \"tone\"> | undefined; } | undefined; }) | undefined",
          "description": ""
        },
        {
          "name": "desktopCloseProps",
          "optional": true,
          "type": "Partial<IconButtonProps> | undefined",
          "description": ""
        },
        {
          "name": "desktopTriggerProps",
          "optional": true,
          "type": "ButtonProps | undefined",
          "description": ""
        },
        {
          "name": "edge",
          "optional": true,
          "type": "\"start\" | \"end\" | undefined",
          "description": ""
        },
        {
          "name": "miniNavigation",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "mode",
          "optional": true,
          "type": "\"persistent\" | \"mini\" | undefined",
          "description": ""
        },
        {
          "name": "navigation",
          "optional": false,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "onOpenChange",
          "optional": false,
          "type": "(open: boolean) => void",
          "description": ""
        },
        {
          "name": "open",
          "optional": false,
          "type": "boolean",
          "description": ""
        },
        {
          "name": "title",
          "optional": false,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "toggleLabel",
          "optional": true,
          "type": "string | undefined",
          "description": "Accessible name for the opening control; the actual render element stays configurable."
        },
        {
          "name": "triggerProps",
          "optional": true,
          "type": "(DialogTriggerProps<unknown> & RefAttributes<HTMLElement> & { variants?: { readonly size?: import(\"packages/faye-ui/dist/contracts/visual-variants\").VisualVariant<\"dialog\", \"size\"> | undefined; readonly tone?: import(\"packages/faye-ui/dist/contracts/visual-variants\").VisualVariant<\"dialog\", \"tone\"> | undefined; } | undefined; }) | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "Desktop navigation pushes content; below 48rem the same navigation uses a modal drawer.",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-patterns-navigation-drawer/#navigationdrawer",
      "api": "/api/packages/patterns/navigation-drawer.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "functional-completion",
          "title": "Consumer interactions and navigation",
          "example": "functional-completion",
          "source": "/examples/functional-completion.tsx"
        }
      ]
    },
    {
      "name": "NavigationMenu",
      "entry": "@fayegram-ai/faye-ui/navigation/navigation-menu",
      "guide": "/docs/navigation/",
      "declaration": "packages/faye-ui/dist/navigation/navigation-menu.d.ts",
      "signature": null,
      "props": [],
      "parts": [
        {
          "name": "Root",
          "props": [
            {
              "name": "actionsRef",
              "optional": true,
              "type": "RefObject<NavigationMenuRootActions | null> | undefined",
              "description": "A ref to imperative actions."
            },
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: NavigationMenuRootState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "closeDelay",
              "optional": true,
              "type": "number | undefined",
              "description": "How long to wait before closing the navigation popup. Specified in milliseconds."
            },
            {
              "name": "defaultValue",
              "optional": true,
              "type": "unknown",
              "description": "The uncontrolled value of the item that should be initially selected.\n\nTo render a controlled navigation menu, use the `value` prop instead."
            },
            {
              "name": "delay",
              "optional": true,
              "type": "number | undefined",
              "description": "How long to wait before opening the navigation popup. Specified in milliseconds."
            },
            {
              "name": "onOpenChangeComplete",
              "optional": true,
              "type": "((open: boolean) => void) | undefined",
              "description": "Event handler called after any animations complete when the navigation menu is closed."
            },
            {
              "name": "onValueChange",
              "optional": true,
              "type": "((value: unknown, eventDetails: Base.Root.ChangeEventDetails) => void) | undefined",
              "description": "Callback fired when the value changes."
            },
            {
              "name": "orientation",
              "optional": true,
              "type": "\"horizontal\" | \"vertical\" | undefined",
              "description": "The orientation of the navigation menu."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, NavigationMenuRootState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: NavigationMenuRootState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "value",
              "optional": true,
              "type": "unknown",
              "description": "The controlled value of the navigation menu item that should be currently open.\nWhen non-nullish, the menu will be open. When nullish, the menu will be closed.\n\nTo render an uncontrolled navigation menu, use the `defaultValue` prop instead."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"navigation-menu\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"navigation-menu\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "List",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: NavigationMenuListState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, NavigationMenuListState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: NavigationMenuListState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"navigation-menu\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"navigation-menu\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Item",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: NavigationMenuItemState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, NavigationMenuItemState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: NavigationMenuItemState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "value",
              "optional": true,
              "type": "any",
              "description": "A unique value that identifies this navigation menu item.\nIf no value is provided, a unique ID will be generated automatically.\nUse when controlling the navigation menu programmatically."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"navigation-menu\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"navigation-menu\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Trigger",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: NavigationMenuTriggerState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "disabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component should ignore user interaction."
            },
            {
              "name": "nativeButton",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component renders a native `<button>` element when replacing it\nvia the `render` prop.\nSet to `false` if the rendered element is not a button (for example, `<div>`)."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, NavigationMenuTriggerState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: NavigationMenuTriggerState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"navigation-menu\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"navigation-menu\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Content",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: NavigationMenuContentState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "keepMounted",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to keep the content mounted in the DOM while the popup is closed.\nEnsures the content is present during server-side rendering for web crawlers."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, NavigationMenuContentState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: NavigationMenuContentState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"navigation-menu\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"navigation-menu\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Link",
          "props": [
            {
              "name": "active",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the link is the currently active page."
            },
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: NavigationMenuLinkState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "closeOnClick",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to close the navigation menu when the link is clicked."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<DetailedHTMLProps<AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, NavigationMenuLinkState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: NavigationMenuLinkState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"navigation-menu\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"navigation-menu\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Positioner",
          "props": [
            {
              "name": "align",
              "optional": true,
              "type": "Align | undefined",
              "description": "How to align the popup relative to the specified side."
            },
            {
              "name": "alignOffset",
              "optional": true,
              "type": "number | OffsetFunction | undefined",
              "description": "Additional offset along the alignment axis in pixels.\nAlso accepts a function that returns the offset to read the dimensions of the anchor\nand positioner elements, along with its side and alignment.\n\nThe function takes a `data` object parameter with the following properties:\n- `data.anchor`: the dimensions of the anchor element with properties `width` and `height`.\n- `data.positioner`: the dimensions of the positioner element with properties `width` and `height`.\n- `data.side`: which side of the anchor element the positioner is aligned against.\n- `data.align`: how the positioner is aligned relative to the specified side."
            },
            {
              "name": "anchor",
              "optional": true,
              "type": "Element | VirtualElement | RefObject<Element | null> | (() => Element | VirtualElement | null) | null | undefined",
              "description": "An element to position the popup against.\nBy default, the popup will be positioned against the trigger."
            },
            {
              "name": "arrowPadding",
              "optional": true,
              "type": "number | undefined",
              "description": "Minimum distance to maintain between the arrow and the edges of the popup.\n\nUse it to prevent the arrow element from hanging out of the rounded corners of a popup."
            },
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: NavigationMenuPositionerState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "collisionAvoidance",
              "optional": true,
              "type": "CollisionAvoidance | undefined",
              "description": "Determines how to handle collisions when positioning the popup.\n\n`side` controls overflow on the preferred placement axis (`top`/`bottom` or `left`/`right`):\n- `'flip'`: keep the requested side when it fits; otherwise try the opposite side\n  (`top` and `bottom`, or `left` and `right`).\n- `'shift'`: never change side; keep the requested side and move the popup within\n  the clipping boundary so it stays visible.\n- `'none'`: do not correct side-axis overflow.\n\n`align` controls overflow on the alignment axis (`start`/`center`/`end`):\n- `'flip'`: keep side, but swap `start` and `end` when the requested alignment overflows.\n- `'shift'`: keep side and requested alignment, then nudge the popup along the\n  alignment axis to fit.\n- `'none'`: do not correct alignment-axis overflow.\n\n`fallbackAxisSide` controls fallback behavior on the perpendicular axis when the\npreferred axis cannot fit:\n- `'start'`: allow perpendicular fallback and try the logical start side first\n  (`top` before `bottom`, or `left` before `right` in LTR).\n- `'end'`: allow perpendicular fallback and try the logical end side first\n  (`bottom` before `top`, or `right` before `left` in LTR).\n- `'none'`: do not fallback to the perpendicular axis.\n\nWhen `side` is `'shift'`, explicitly setting `align` only supports `'shift'` or `'none'`.\nIf `align` is omitted, it defaults to `'flip'`."
            },
            {
              "name": "collisionBoundary",
              "optional": true,
              "type": "Boundary | undefined",
              "description": "An element or a rectangle that delimits the area that the popup is confined to."
            },
            {
              "name": "collisionPadding",
              "optional": true,
              "type": "Padding | undefined",
              "description": "Additional space to maintain from the edge of the collision boundary."
            },
            {
              "name": "disableAnchorTracking",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to disable the popup from tracking any layout shift of its positioning anchor."
            },
            {
              "name": "positionMethod",
              "optional": true,
              "type": "\"absolute\" | \"fixed\" | undefined",
              "description": "Determines which CSS `position` property to use."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, NavigationMenuPositionerState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "side",
              "optional": true,
              "type": "Side | undefined",
              "description": "Which side of the anchor element to align the popup against.\nMay automatically change to avoid collisions."
            },
            {
              "name": "sideOffset",
              "optional": true,
              "type": "number | OffsetFunction | undefined",
              "description": "Distance between the anchor and the popup in pixels.\nAlso accepts a function that returns the distance to read the dimensions of the anchor\nand positioner elements, along with its side and alignment.\n\nThe function takes a `data` object parameter with the following properties:\n- `data.anchor`: the dimensions of the anchor element with properties `width` and `height`.\n- `data.positioner`: the dimensions of the positioner element with properties `width` and `height`.\n- `data.side`: which side of the anchor element the positioner is aligned against.\n- `data.align`: how the positioner is aligned relative to the specified side."
            },
            {
              "name": "sticky",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to maintain the popup in the viewport after\nthe anchor element was scrolled out of view."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: NavigationMenuPositionerState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"navigation-menu\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"navigation-menu\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Popup",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: NavigationMenuPopupState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, NavigationMenuPopupState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: NavigationMenuPopupState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"navigation-menu\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"navigation-menu\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Viewport",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: NavigationMenuViewportState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, NavigationMenuViewportState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: NavigationMenuViewportState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"navigation-menu\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"navigation-menu\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Arrow",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: NavigationMenuArrowState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, NavigationMenuArrowState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: NavigationMenuArrowState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"navigation-menu\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"navigation-menu\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Portal",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: NavigationMenuPortalState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "container",
              "optional": true,
              "type": "HTMLElement | ShadowRoot | RefObject<HTMLElement | ShadowRoot | null> | null | undefined",
              "description": "A parent element to render the portal element into."
            },
            {
              "name": "keepMounted",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to keep the portal mounted in the DOM while the popup is hidden."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, NavigationMenuPortalState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: NavigationMenuPortalState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            }
          ]
        }
      ],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-navigation-navigation-menu/#navigationmenu",
      "api": "/api/packages/navigation/navigation-menu.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "navigation",
          "title": "Navigation and disclosure",
          "example": "navigation",
          "source": "/examples/navigation.tsx"
        }
      ]
    },
    {
      "name": "NumberField",
      "entry": "@fayegram-ai/faye-ui/controls/number-field",
      "guide": "/docs/numeric/",
      "declaration": "packages/faye-ui/dist/controls/number-field.d.ts",
      "signature": null,
      "props": [],
      "parts": [
        {
          "name": "Root",
          "props": [
            {
              "name": "allowOutOfRange",
              "optional": true,
              "type": "boolean | undefined",
              "description": "When true, direct text entry may be outside the `min`/`max` range without clamping,\nso native range underflow/overflow validation can occur.\nStep-based interactions (keyboard arrows, buttons, wheel, scrub) still clamp."
            },
            {
              "name": "allowWheelScrub",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to allow the user to scrub the input value with the mouse wheel while focused and\nhovering over the input."
            },
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: NumberFieldRootState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "defaultValue",
              "optional": true,
              "type": "number | undefined",
              "description": "The uncontrolled value of the field when it's initially rendered.\n\nTo render a controlled number field, use the `value` prop instead."
            },
            {
              "name": "disabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component should ignore user interaction."
            },
            {
              "name": "form",
              "optional": true,
              "type": "string | undefined",
              "description": "Identifies the form that owns the hidden input.\nUseful when the number field is rendered outside the form."
            },
            {
              "name": "format",
              "optional": true,
              "type": "Intl.NumberFormatOptions | undefined",
              "description": "Options to format the input value."
            },
            {
              "name": "id",
              "optional": true,
              "type": "string | undefined",
              "description": "The id of the input element."
            },
            {
              "name": "inputRef",
              "optional": true,
              "type": "Ref<HTMLInputElement> | undefined",
              "description": "A ref to access the hidden input element."
            },
            {
              "name": "largeStep",
              "optional": true,
              "type": "number | undefined",
              "description": "The large step value of the input element when incrementing while the shift key is held.\nSnaps to multiples of this value when `snapOnStep` is enabled."
            },
            {
              "name": "locale",
              "optional": true,
              "type": "Intl.LocalesArgument",
              "description": "The locale of the input element.\nDefaults to the user's runtime locale."
            },
            {
              "name": "max",
              "optional": true,
              "type": "number | undefined",
              "description": "The maximum value of the input element."
            },
            {
              "name": "min",
              "optional": true,
              "type": "number | undefined",
              "description": "The minimum value of the input element."
            },
            {
              "name": "name",
              "optional": true,
              "type": "string | undefined",
              "description": "Identifies the field when a form is submitted."
            },
            {
              "name": "onValueChange",
              "optional": true,
              "type": "((value: number | null, eventDetails: Base.Root.ChangeEventDetails) => void) | undefined",
              "description": "Callback fired when the number value changes.\n\nThe `eventDetails.reason` indicates what triggered the change:\n- `'input-change'` for parseable typing or programmatic text updates\n- `'input-clear'` when the field becomes empty\n- `'input-blur'` when formatting (and clamping, if enabled) occurs on blur\n- `'input-paste'` for paste interactions\n- `'keyboard'` for arrow-key/Home/End stepping (typing digits uses `'input-change'`/`'input-clear'`)\n- `'increment-press'` / `'decrement-press'` for button presses on the increment and decrement controls\n- `'wheel'` for wheel-based scrubbing\n- `'scrub'` for scrub area drags"
            },
            {
              "name": "onValueCommitted",
              "optional": true,
              "type": "((value: number | null, eventDetails: Base.Root.CommitEventDetails) => void) | undefined",
              "description": "Callback function that is fired when the value is committed.\nIt runs later than `onValueChange`, when:\n- The input is blurred after typing a value.\n- The pointer is released after scrubbing or pressing the increment/decrement buttons.\n\nIt runs simultaneously with `onValueChange` when interacting with the keyboard or the\nmouse wheel.\n\n**Warning**: This is a generic event not a change event."
            },
            {
              "name": "readOnly",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the user should be unable to change the field value."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, NumberFieldRootState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "required",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the user must enter a value before submitting a form."
            },
            {
              "name": "smallStep",
              "optional": true,
              "type": "number | undefined",
              "description": "The small step value of the input element when incrementing while the alt key is held.\nSnaps to multiples of this value when `snapOnStep` is enabled."
            },
            {
              "name": "snapOnStep",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the value should snap to the nearest step when incrementing or decrementing."
            },
            {
              "name": "step",
              "optional": true,
              "type": "number | \"any\" | undefined",
              "description": "Amount to increment and decrement with the buttons and arrow keys, or to scrub with pointer movement in the scrub area.\nTo always enable step validation on form submission, specify the `min` prop explicitly in conjunction with this prop.\nSpecify `step=\"any\"` to always disable step validation; interactive stepping then uses a base amount of `1`, while the alt and shift keys still step by `smallStep` and `largeStep`."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: NumberFieldRootState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "value",
              "optional": true,
              "type": "number | null | undefined",
              "description": "The raw numeric value of the field."
            }
          ]
        },
        {
          "name": "Group",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: NumberFieldGroupState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, NumberFieldGroupState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: NumberFieldGroupState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"number-field\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"number-field\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Input",
          "props": [
            {
              "name": "aria-roledescription",
              "optional": true,
              "type": "string | undefined",
              "description": "A user-friendly description of the input's role for assistive tech. This is a role\ndescription, not an accessible name — use `Field.Label` or `aria-label` to name the control."
            },
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: NumberFieldInputState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<DetailedHTMLProps<InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, NumberFieldInputState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: NumberFieldInputState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"number-field\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"number-field\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Increment",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: NumberFieldIncrementState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "nativeButton",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component renders a native `<button>` element when replacing it\nvia the `render` prop.\nSet to `false` if the rendered element is not a button (for example, `<div>`)."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, NumberFieldIncrementState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: NumberFieldIncrementState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"number-field\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"number-field\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Decrement",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: NumberFieldDecrementState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "nativeButton",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component renders a native `<button>` element when replacing it\nvia the `render` prop.\nSet to `false` if the rendered element is not a button (for example, `<div>`)."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, NumberFieldDecrementState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: NumberFieldDecrementState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"number-field\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"number-field\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "ScrubArea",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: NumberFieldScrubAreaState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "direction",
              "optional": true,
              "type": "\"horizontal\" | \"vertical\" | undefined",
              "description": "Cursor movement direction in the scrub area."
            },
            {
              "name": "pixelSensitivity",
              "optional": true,
              "type": "number | undefined",
              "description": "Determines how many pixels the cursor must move before the value changes.\nA higher value will make scrubbing less sensitive."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, NumberFieldScrubAreaState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: NumberFieldScrubAreaState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "teleportDistance",
              "optional": true,
              "type": "number | undefined",
              "description": "If specified, determines the distance that the cursor may move from the center\nof the scrub area before it will loop back around."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"number-field\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"number-field\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "ScrubAreaCursor",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: NumberFieldScrubAreaCursorState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, NumberFieldScrubAreaCursorState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: NumberFieldScrubAreaCursorState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"number-field\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"number-field\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        }
      ],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-controls-number-field/#numberfield",
      "api": "/api/packages/controls/number-field.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "advanced-fields",
          "title": "Advanced field compositions",
          "example": "advanced-fields",
          "source": "/examples/advanced-fields.tsx"
        },
        {
          "slug": "numeric",
          "title": "Numeric and specialized input",
          "example": "numeric",
          "source": "/examples/numeric.tsx"
        }
      ]
    },
    {
      "name": "OTPField",
      "entry": "@fayegram-ai/faye-ui/controls/otp-field",
      "guide": "/docs/numeric/",
      "declaration": "packages/faye-ui/dist/controls/otp-field.d.ts",
      "signature": null,
      "props": [],
      "parts": [
        {
          "name": "Root",
          "props": [
            {
              "name": "autoComplete",
              "optional": true,
              "type": "string | undefined",
              "description": "The input autocomplete attribute. Applied to the first slot and hidden validation input."
            },
            {
              "name": "autoSubmit",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to submit the owning form when the OTP becomes complete."
            },
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: OTPFieldRootState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "defaultValue",
              "optional": true,
              "type": "string | undefined",
              "description": "The uncontrolled OTP value when the component is initially rendered."
            },
            {
              "name": "disabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component should ignore user interaction."
            },
            {
              "name": "form",
              "optional": true,
              "type": "string | undefined",
              "description": "A string specifying the `form` element with which the hidden input is associated.\nThis string's value must match the id of a `form` element in the same document."
            },
            {
              "name": "id",
              "optional": true,
              "type": "string | undefined",
              "description": "The id of the first input element.\nSubsequent inputs derive their ids from it (`{id}-2`, `{id}-3`, and so on)."
            },
            {
              "name": "inputMode",
              "optional": true,
              "type": "\"text\" | \"search\" | \"none\" | \"tel\" | \"url\" | \"email\" | \"numeric\" | \"decimal\" | undefined",
              "description": "The virtual keyboard hint applied to the slot inputs and hidden validation input.\n\nBuilt-in validation modes provide sensible defaults, but you can override them when needed."
            },
            {
              "name": "length",
              "optional": false,
              "type": "number",
              "description": "The number of OTP input slots.\nRequired so the root can clamp values, detect completion, and generate\nconsistent validation markup before all slots hydrate."
            },
            {
              "name": "mask",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the slot inputs should mask entered characters.\nPass `type` directly to individual `<OTPField.Input>` parts to use a custom\ninput type."
            },
            {
              "name": "name",
              "optional": true,
              "type": "string | undefined",
              "description": "Identifies the field when a form is submitted."
            },
            {
              "name": "normalizeValue",
              "optional": true,
              "type": "((value: string) => string) | undefined",
              "description": "Function that normalizes the OTP value after whitespace and `validationType` filtering.\nIt runs whenever OTP Field normalizes a value, including initial/default values, controlled\nvalues, and user edits.\n\nThe returned value is filtered by `validationType` again, then clamped to `length`.\nIt should be idempotent because OTP Field may normalize the same value more than once while\nhandling edits, storing state, and rendering controlled or uncontrolled values. Non-idempotent\nnormalizers can compound across those normalization passes. Characters rejected while\nnormalizing typed or pasted text are reported through `onValueInvalid`."
            },
            {
              "name": "onValueChange",
              "optional": true,
              "type": "((value: string, eventDetails: OTPFieldRoot.ChangeEventDetails) => void) | undefined",
              "description": "Callback fired when the OTP value changes.\n\nThe `eventDetails.reason` indicates what triggered the change:\n- `'input-change'` for typing or autofill\n- `'input-clear'` when a character is removed by text input\n- `'input-paste'` for paste interactions\n- `'keyboard'` for keyboard interactions that change the value"
            },
            {
              "name": "onValueComplete",
              "optional": true,
              "type": "((value: string, eventDetails: OTPFieldRoot.CompleteEventDetails) => void) | undefined",
              "description": "Callback function that is fired when the OTP value becomes complete, or when a complete value\nis pasted while the OTP is already complete.\n\nWhen the value changes, it runs later than `onValueChange`, after the internal value update is\napplied. If a complete pasted value matches the current value, `onValueChange` does not fire.\n\nIf `autoSubmit` is enabled, it runs immediately before the owning form is submitted."
            },
            {
              "name": "onValueInvalid",
              "optional": true,
              "type": "((value: string, eventDetails: OTPFieldRoot.InvalidEventDetails) => void) | undefined",
              "description": "Callback fired when entered text contains characters that are rejected by validation or\nnormalization before the OTP value updates.\n\nThe `value` argument is the attempted user-entered string before normalization."
            },
            {
              "name": "readOnly",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the user should be unable to change the field value."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, OTPFieldRootState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "required",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the user must enter a value before submitting a form."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: OTPFieldRootState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "validationType",
              "optional": true,
              "type": "OTPValidationType | undefined",
              "description": "The type of input validation to apply to the OTP value."
            },
            {
              "name": "value",
              "optional": true,
              "type": "string | undefined",
              "description": "The OTP value."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{} | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Input",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: OTPFieldInputState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<DetailedHTMLProps<InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, OTPFieldInputState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: OTPFieldInputState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{} | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Separator",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: SeparatorState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "orientation",
              "optional": true,
              "type": "Orientation | undefined",
              "description": "The orientation of the separator."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, SeparatorState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: SeparatorState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{} | undefined",
              "description": ""
            }
          ]
        }
      ],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-controls-otp-field/#otpfield",
      "api": "/api/packages/controls/otp-field.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "numeric",
          "title": "Numeric and specialized input",
          "example": "numeric",
          "source": "/examples/numeric.tsx"
        }
      ]
    },
    {
      "name": "PackedMasonry",
      "entry": "@fayegram-ai/faye-ui/display/packed-masonry",
      "guide": "/docs/display/",
      "declaration": "packages/faye-ui/dist/display/packed-masonry.d.ts",
      "signature": "({ profile, columns, gap, className, style, children, ref, ...props }: PackedMasonryProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "columns",
          "optional": true,
          "type": "Responsive<2 | 3 | 1 | 5 | 4 | 6> | undefined",
          "description": ""
        },
        {
          "name": "gap",
          "optional": true,
          "type": "Space | undefined",
          "description": ""
        },
        {
          "name": "profile",
          "optional": true,
          "type": "ComponentProfile | undefined",
          "description": ""
        },
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLDivElement> | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "Shortest-column packing with stable DOM/tab order. SSR renders a usable grid until measured.",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-display-packed-masonry/#packedmasonry",
      "api": "/api/packages/display/packed-masonry.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "surface-compositions",
          "title": "Cards, media and composed dialogs",
          "example": "surface-compositions",
          "source": "/examples/surface-compositions.tsx"
        }
      ]
    },
    {
      "name": "PageHeader",
      "entry": "@fayegram-ai/faye-ui/patterns/content",
      "guide": "/docs/patterns/",
      "declaration": "packages/faye-ui/dist/patterns/content.d.ts",
      "signature": "({ eyebrow, title, description, actions, headingLevel, titleSize, className, ...props }: Omit<HTMLAttributes<HTMLElement>, \"title\"> & { eyebrow?: ReactNode; headingLevel?: 1 | 2 | 3 | 4 | 5 | 6; titleSize?: HeadingProps[\"size\"]; title: ReactNode; description?: ReactNode; actions?: ReactNode; }): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "actions",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "description",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "eyebrow",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "headingLevel",
          "optional": true,
          "type": "2 | 3 | 1 | 5 | 4 | 6 | undefined",
          "description": ""
        },
        {
          "name": "title",
          "optional": false,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "titleSize",
          "optional": true,
          "type": "VisualVariant<\"heading\", \"size\"> | undefined",
          "description": "Visual size is independent of the semantic heading level."
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-patterns-content/#pageheader",
      "api": "/api/packages/patterns/content.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "patterns",
          "title": "Application patterns",
          "example": "patterns",
          "source": "/examples/patterns.tsx"
        },
        {
          "slug": "consumer-experience",
          "title": "Interactive consumer experience",
          "example": "consumer-experience",
          "source": "/examples/consumer-experience.tsx"
        }
      ]
    },
    {
      "name": "Pagination",
      "entry": "@fayegram-ai/faye-ui/navigation/pagination",
      "guide": "/docs/navigation/",
      "declaration": "packages/faye-ui/dist/navigation/pagination.d.ts",
      "signature": "(input: PaginationProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "boundaries",
          "optional": true,
          "type": "number | undefined",
          "description": ""
        },
        {
          "name": "count",
          "optional": false,
          "type": "number",
          "description": ""
        },
        {
          "name": "disabled",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "firstIcon",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "firstLabel",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "hideNext",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "hidePrevious",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "label",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "lastIcon",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "lastLabel",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "nextIcon",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "nextLabel",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "onPageChange",
          "optional": false,
          "type": "(page: number) => void",
          "description": ""
        },
        {
          "name": "page",
          "optional": false,
          "type": "number",
          "description": ""
        },
        {
          "name": "pageLabel",
          "optional": true,
          "type": "((page: number) => string) | undefined",
          "description": ""
        },
        {
          "name": "previousIcon",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "previousLabel",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "showFirst",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "showLast",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "siblings",
          "optional": true,
          "type": "number | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-navigation-pagination/#pagination",
      "api": "/api/packages/navigation/pagination.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "localization",
          "title": "Localization",
          "example": "localization",
          "source": "/examples/localization.tsx"
        },
        {
          "slug": "navigation",
          "title": "Navigation and disclosure",
          "example": "navigation",
          "source": "/examples/navigation.tsx"
        }
      ]
    },
    {
      "name": "Popover",
      "entry": "@fayegram-ai/faye-ui/overlays/popover",
      "guide": "/docs/floating/",
      "declaration": "packages/faye-ui/dist/overlays/popover.d.ts",
      "signature": null,
      "props": [],
      "parts": [
        {
          "name": "Root",
          "props": [
            {
              "name": "actionsRef",
              "optional": true,
              "type": "React.RefObject<PopoverRootActions | null> | undefined",
              "description": "A ref to imperative actions.\n- `unmount`: Manually unmounts the popover.\nCall this after any externally controlled closing animation finishes.\n- `close`: Closes the popover imperatively when called."
            },
            {
              "name": "children",
              "optional": true,
              "type": "React.ReactNode | PayloadChildRenderFunction<Payload>",
              "description": "The content of the popover.\nThis can be a regular React node or a render function that receives the `payload` of the active trigger."
            },
            {
              "name": "defaultOpen",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the popover is initially open.\n\nTo render a controlled popover, use the `open` prop instead."
            },
            {
              "name": "defaultTriggerId",
              "optional": true,
              "type": "string | null | undefined",
              "description": "ID of the trigger that the popover is associated with.\nThis is useful in conjunction with the `defaultOpen` prop to create an initially open popover."
            },
            {
              "name": "handle",
              "optional": true,
              "type": "PopoverHandle<Payload> | undefined",
              "description": "A handle to associate the popover with a trigger.\nIf specified, allows external triggers to control the popover's open state."
            },
            {
              "name": "modal",
              "optional": true,
              "type": "boolean | \"trap-focus\" | undefined",
              "description": "Determines if the popover enters a modal state when open.\n- `true`: user interaction is limited to the popover: document page scroll is locked, and pointer interactions on outside elements are disabled.\n- `false`: user interaction with the rest of the document is allowed.\n- `'trap-focus'`: focus is trapped inside the popover, but document page scroll is not locked and pointer interactions outside of it remain enabled.\n\nOn touch devices, a `true` modal blocks outside taps but leaves the page scrollable unless the popup spans nearly the full viewport width, matching native iOS behavior.\n\nWhen `modal` is `true`, focus trapping is enabled only if `<Popover.Close>` is rendered\ninside `<Popover.Popup>`. It can be visually hidden with your own CSS if needed, such as\nTailwind's `sr-only` utility.\n\nWhen `modal` is `'trap-focus'`, render `<Popover.Close>` inside `<Popover.Popup>` so touch\nscreen readers can escape the popup."
            },
            {
              "name": "onOpenChange",
              "optional": true,
              "type": "((open: boolean, eventDetails: PopoverRoot.ChangeEventDetails) => void) | undefined",
              "description": "Event handler called when the popover is opened or closed."
            },
            {
              "name": "onOpenChangeComplete",
              "optional": true,
              "type": "((open: boolean) => void) | undefined",
              "description": "Event handler called after any animations complete when the popover is opened or closed."
            },
            {
              "name": "open",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the popover is currently open."
            },
            {
              "name": "triggerId",
              "optional": true,
              "type": "string | null | undefined",
              "description": "ID of the trigger that the popover is associated with.\nThis is useful in conjunction with the `open` prop to create a controlled popover.\nThere's no need to specify this prop when the popover is uncontrolled (that is, when the `open` prop is not set)."
            }
          ]
        },
        {
          "name": "Trigger",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: import(\"@base-ui/react\").PopoverTriggerState) => string | undefined) | undefined",
              "description": ""
            },
            {
              "name": "closeDelay",
              "optional": true,
              "type": "number | undefined",
              "description": ""
            },
            {
              "name": "delay",
              "optional": true,
              "type": "number | undefined",
              "description": ""
            },
            {
              "name": "handle",
              "optional": true,
              "type": "Base.Handle<unknown> | undefined",
              "description": ""
            },
            {
              "name": "id",
              "optional": true,
              "type": "string | undefined",
              "description": ""
            },
            {
              "name": "nativeButton",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component renders a native `<button>` element when replacing it\nvia the `render` prop.\nSet to `false` if the rendered element is not a button (for example, `<div>`)."
            },
            {
              "name": "openOnHover",
              "optional": true,
              "type": "boolean | undefined",
              "description": ""
            },
            {
              "name": "payload",
              "optional": true,
              "type": "unknown",
              "description": ""
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps<any>, PopoverTriggerState> | undefined",
              "description": ""
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: import(\"@base-ui/react\").PopoverTriggerState) => React.CSSProperties | undefined) | undefined",
              "description": ""
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"popover\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"popover\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Positioner",
          "props": [
            {
              "name": "align",
              "optional": true,
              "type": "Align | undefined",
              "description": "How to align the popup relative to the specified side."
            },
            {
              "name": "alignOffset",
              "optional": true,
              "type": "number | OffsetFunction | undefined",
              "description": "Additional offset along the alignment axis in pixels.\nAlso accepts a function that returns the offset to read the dimensions of the anchor\nand positioner elements, along with its side and alignment.\n\nThe function takes a `data` object parameter with the following properties:\n- `data.anchor`: the dimensions of the anchor element with properties `width` and `height`.\n- `data.positioner`: the dimensions of the positioner element with properties `width` and `height`.\n- `data.side`: which side of the anchor element the positioner is aligned against.\n- `data.align`: how the positioner is aligned relative to the specified side."
            },
            {
              "name": "anchor",
              "optional": true,
              "type": "Element | VirtualElement | RefObject<Element | null> | (() => Element | VirtualElement | null) | null | undefined",
              "description": "An element to position the popup against.\nBy default, the popup will be positioned against the trigger."
            },
            {
              "name": "arrowPadding",
              "optional": true,
              "type": "number | undefined",
              "description": "Minimum distance to maintain between the arrow and the edges of the popup.\n\nUse it to prevent the arrow element from hanging out of the rounded corners of a popup."
            },
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: PopoverPositionerState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "collisionAvoidance",
              "optional": true,
              "type": "CollisionAvoidance | undefined",
              "description": "Determines how to handle collisions when positioning the popup.\n\n`side` controls overflow on the preferred placement axis (`top`/`bottom` or `left`/`right`):\n- `'flip'`: keep the requested side when it fits; otherwise try the opposite side\n  (`top` and `bottom`, or `left` and `right`).\n- `'shift'`: never change side; keep the requested side and move the popup within\n  the clipping boundary so it stays visible.\n- `'none'`: do not correct side-axis overflow.\n\n`align` controls overflow on the alignment axis (`start`/`center`/`end`):\n- `'flip'`: keep side, but swap `start` and `end` when the requested alignment overflows.\n- `'shift'`: keep side and requested alignment, then nudge the popup along the\n  alignment axis to fit.\n- `'none'`: do not correct alignment-axis overflow.\n\n`fallbackAxisSide` controls fallback behavior on the perpendicular axis when the\npreferred axis cannot fit:\n- `'start'`: allow perpendicular fallback and try the logical start side first\n  (`top` before `bottom`, or `left` before `right` in LTR).\n- `'end'`: allow perpendicular fallback and try the logical end side first\n  (`bottom` before `top`, or `right` before `left` in LTR).\n- `'none'`: do not fallback to the perpendicular axis.\n\nWhen `side` is `'shift'`, explicitly setting `align` only supports `'shift'` or `'none'`.\nIf `align` is omitted, it defaults to `'flip'`."
            },
            {
              "name": "collisionBoundary",
              "optional": true,
              "type": "Boundary | undefined",
              "description": "An element or a rectangle that delimits the area that the popup is confined to."
            },
            {
              "name": "collisionPadding",
              "optional": true,
              "type": "Padding | undefined",
              "description": "Additional space to maintain from the edge of the collision boundary."
            },
            {
              "name": "disableAnchorTracking",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to disable the popup from tracking any layout shift of its positioning anchor."
            },
            {
              "name": "positionMethod",
              "optional": true,
              "type": "\"absolute\" | \"fixed\" | undefined",
              "description": "Determines which CSS `position` property to use."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, PopoverPositionerState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "side",
              "optional": true,
              "type": "Side | undefined",
              "description": "Which side of the anchor element to align the popup against.\nMay automatically change to avoid collisions."
            },
            {
              "name": "sideOffset",
              "optional": true,
              "type": "number | OffsetFunction | undefined",
              "description": "Distance between the anchor and the popup in pixels.\nAlso accepts a function that returns the distance to read the dimensions of the anchor\nand positioner elements, along with its side and alignment.\n\nThe function takes a `data` object parameter with the following properties:\n- `data.anchor`: the dimensions of the anchor element with properties `width` and `height`.\n- `data.positioner`: the dimensions of the positioner element with properties `width` and `height`.\n- `data.side`: which side of the anchor element the positioner is aligned against.\n- `data.align`: how the positioner is aligned relative to the specified side."
            },
            {
              "name": "sticky",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to maintain the popup in the viewport after\nthe anchor element was scrolled out of view."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: PopoverPositionerState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"popover\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"popover\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Popup",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: PopoverPopupState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "finalFocus",
              "optional": true,
              "type": "boolean | RefObject<HTMLElement | null> | ((closeType: InteractionType) => void | boolean | HTMLElement | null) | undefined",
              "description": "Determines the element to focus when the popover is closed.\n\n- `false`: Do not move focus.\n- `true`: Move focus based on the default behavior (trigger or previously focused element).\n- `RefObject`: Move focus to the ref element.\n- `function`: Called with the interaction type (`mouse`, `touch`, `pen`, or `keyboard`).\n  Return an element to focus, `true` to use the default behavior, `null` to fall back to the default behavior, or `false`/`undefined` to do nothing."
            },
            {
              "name": "initialFocus",
              "optional": true,
              "type": "boolean | RefObject<HTMLElement | null> | ((openType: InteractionType) => void | boolean | HTMLElement | null) | undefined",
              "description": "Determines the element to focus when the popover is opened.\nBy default, focus moves to the first tabbable element inside the popup, except when the popover\nis opened by touch — then the popup itself is focused to avoid opening the virtual keyboard.\n\n- `false`: Do not move focus.\n- `true`: Move focus based on the default behavior (first tabbable element or popup).\n- `RefObject`: Move focus to the ref element.\n- `function`: Called with the interaction type (`mouse`, `touch`, `pen`, or `keyboard`).\n  Return an element to focus, `true` to use the default behavior, `null` to fall back to the default behavior, or `false`/`undefined` to do nothing."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, PopoverPopupState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: PopoverPopupState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"popover\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"popover\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Title",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: PopoverTitleState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, PopoverTitleState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: PopoverTitleState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"popover\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"popover\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Description",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: PopoverDescriptionState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, PopoverDescriptionState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: PopoverDescriptionState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"popover\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"popover\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Close",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: PopoverCloseState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "nativeButton",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component renders a native `<button>` element when replacing it\nvia the `render` prop.\nSet to `false` if the rendered element is not a button (for example, `<div>`)."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, PopoverCloseState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: PopoverCloseState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"popover\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"popover\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Arrow",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: PopoverArrowState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, PopoverArrowState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: PopoverArrowState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"popover\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"popover\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Portal",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: PopoverPortalState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "container",
              "optional": true,
              "type": "HTMLElement | ShadowRoot | RefObject<HTMLElement | ShadowRoot | null> | null | undefined",
              "description": "A parent element to render the portal element into."
            },
            {
              "name": "keepMounted",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to keep the portal mounted in the DOM while the popup is hidden."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, PopoverPortalState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: PopoverPortalState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            }
          ]
        }
      ],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-overlays-popover/#popover",
      "api": "/api/packages/overlays/popover.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "floating",
          "title": "Portals and floating content",
          "example": "floating",
          "source": "/examples/floating.tsx"
        }
      ]
    },
    {
      "name": "Popper",
      "entry": "@fayegram-ai/faye-ui/overlays/popper",
      "guide": "/docs/floating/",
      "declaration": "packages/faye-ui/dist/overlays/popper.d.ts",
      "signature": "({ open, anchor, placement, strategy, distance, collisionPadding, portalled, container, onPositionError, style, className, children, ...props }: PopperProps): import(\"react\").JSX.Element | null",
      "props": [
        {
          "name": "anchor",
          "optional": false,
          "type": "ReferenceElement | null",
          "description": ""
        },
        {
          "name": "collisionPadding",
          "optional": true,
          "type": "number | undefined",
          "description": ""
        },
        {
          "name": "container",
          "optional": true,
          "type": "HTMLElement | ShadowRoot | undefined",
          "description": ""
        },
        {
          "name": "distance",
          "optional": true,
          "type": "number | undefined",
          "description": ""
        },
        {
          "name": "onPositionError",
          "optional": true,
          "type": "((error: unknown) => void) | undefined",
          "description": ""
        },
        {
          "name": "open",
          "optional": false,
          "type": "boolean",
          "description": ""
        },
        {
          "name": "placement",
          "optional": true,
          "type": "Placement | undefined",
          "description": ""
        },
        {
          "name": "portalled",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "strategy",
          "optional": true,
          "type": "Strategy | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "Positioning only: no implicit role, focus trap, dismissal, or modal semantics.",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-overlays-popper/#popper",
      "api": "/api/packages/overlays/popper.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "floating",
          "title": "Portals and floating content",
          "example": "floating",
          "source": "/examples/floating.tsx"
        }
      ]
    },
    {
      "name": "Portal",
      "entry": "@fayegram-ai/faye-ui/overlays/portal",
      "guide": "/docs/floating/",
      "declaration": "packages/faye-ui/dist/overlays/portal.d.ts",
      "signature": "({ children, container, disabled }: PortalProps): import(\"react\").JSX.Element | null",
      "props": [
        {
          "name": "children",
          "optional": false,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "container",
          "optional": true,
          "type": "HTMLElement | ShadowRoot | null | undefined",
          "description": ""
        },
        {
          "name": "disabled",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-overlays-portal/#portal",
      "api": "/api/packages/overlays/portal.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "floating",
          "title": "Portals and floating content",
          "example": "floating",
          "source": "/examples/floating.tsx"
        }
      ]
    },
    {
      "name": "PortalTheme",
      "entry": "@fayegram-ai/faye-ui/provider/provider",
      "guide": "/docs/theming/",
      "declaration": "packages/faye-ui/dist/provider/provider.d.ts",
      "signature": "({ children }: { children: ReactNode; }): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "children",
          "optional": false,
          "type": "ReactNode",
          "description": ""
        }
      ],
      "parts": [],
      "description": "Mirrors the logical scope onto the actual portal DOM, without another focus manager.",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-provider-provider/#portaltheme",
      "api": "/api/packages/provider/provider.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "floating",
          "title": "Portals and floating content",
          "example": "floating",
          "source": "/examples/floating.tsx"
        }
      ]
    },
    {
      "name": "Presence",
      "entry": "@fayegram-ai/faye-ui/motion/presence",
      "guide": "/docs/motion/",
      "declaration": "packages/faye-ui/dist/motion/presence.d.ts",
      "signature": "({ present, keepMounted, appear, effect, onExitComplete, direction, container, orientation, scaleOrigin, enterDuration, exitDuration, ref, style, children, className, ...props }: PresenceProps): import(\"react\").JSX.Element | null",
      "props": [
        {
          "name": "appear",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "container",
          "optional": true,
          "type": "HTMLElement | RefObject<HTMLElement | null> | null | undefined",
          "description": "Optional boundary to slide fully outside instead of using the small default offset."
        },
        {
          "name": "direction",
          "optional": true,
          "type": "\"start\" | \"end\" | \"left\" | \"right\" | \"up\" | \"down\" | undefined",
          "description": "Slide starts at this edge; start/end follow computed text direction."
        },
        {
          "name": "effect",
          "optional": true,
          "type": "\"scale\" | \"fade\" | \"slide\" | \"collapse\" | undefined",
          "description": ""
        },
        {
          "name": "enterDuration",
          "optional": true,
          "type": "number | undefined",
          "description": ""
        },
        {
          "name": "exitDuration",
          "optional": true,
          "type": "number | undefined",
          "description": ""
        },
        {
          "name": "keepMounted",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "onExitComplete",
          "optional": true,
          "type": "(() => void) | undefined",
          "description": ""
        },
        {
          "name": "orientation",
          "optional": true,
          "type": "\"horizontal\" | \"vertical\" | undefined",
          "description": ""
        },
        {
          "name": "present",
          "optional": false,
          "type": "boolean",
          "description": ""
        },
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLDivElement> | undefined",
          "description": ""
        },
        {
          "name": "scaleOrigin",
          "optional": true,
          "type": "Property.TransformOrigin<string | number> | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "Show and hide ordinary content. Dialogs, menus and drawers include their own transitions.",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-motion-presence/#presence",
      "api": "/api/packages/motion/presence.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "motion",
          "title": "Motion and presence",
          "example": "motion",
          "source": "/examples/motion.tsx"
        }
      ]
    },
    {
      "name": "PreviewCard",
      "entry": "@fayegram-ai/faye-ui/overlays/preview-card",
      "guide": "/docs/floating/",
      "declaration": "packages/faye-ui/dist/overlays/preview-card.d.ts",
      "signature": null,
      "props": [],
      "parts": [
        {
          "name": "Root",
          "props": [
            {
              "name": "actionsRef",
              "optional": true,
              "type": "RefObject<PreviewCardRootActions | null> | undefined",
              "description": "A ref to imperative actions.\n- `unmount`: Unmounts the preview card popup.\n- `close`: Closes the preview card imperatively when called."
            },
            {
              "name": "children",
              "optional": true,
              "type": "ReactNode | PayloadChildRenderFunction<Payload>",
              "description": "The content of the preview card.\nThis can be a regular React node or a render function that receives the `payload` of the active trigger."
            },
            {
              "name": "defaultOpen",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the preview card is initially open.\n\nTo render a controlled preview card, use the `open` prop instead."
            },
            {
              "name": "defaultTriggerId",
              "optional": true,
              "type": "string | null | undefined",
              "description": "ID of the trigger that the preview card is associated with.\nThis is useful in conjunction with the `defaultOpen` prop to create an initially open preview card."
            },
            {
              "name": "handle",
              "optional": true,
              "type": "Base.Handle<Payload> | undefined",
              "description": "A handle to associate the preview card with a trigger.\nIf specified, allows external triggers to control the card's open state.\nCan be created with the PreviewCard.createHandle() method."
            },
            {
              "name": "onOpenChange",
              "optional": true,
              "type": "((open: boolean, eventDetails: Base.Root.ChangeEventDetails) => void) | undefined",
              "description": "Event handler called when the preview card is opened or closed."
            },
            {
              "name": "onOpenChangeComplete",
              "optional": true,
              "type": "((open: boolean) => void) | undefined",
              "description": "Event handler called after any animations complete when the preview card is opened or closed."
            },
            {
              "name": "open",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the preview card is currently open."
            },
            {
              "name": "triggerId",
              "optional": true,
              "type": "string | null | undefined",
              "description": "ID of the trigger that the preview card is associated with.\nThis is useful in conjunction with the `open` prop to create a controlled preview card.\nThere's no need to specify this prop when the preview card is uncontrolled (that is, when the `open` prop is not set)."
            }
          ]
        },
        {
          "name": "Trigger",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: PreviewCardTriggerState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "closeDelay",
              "optional": true,
              "type": "number | undefined",
              "description": "How long to wait before closing the preview card. Specified in milliseconds."
            },
            {
              "name": "delay",
              "optional": true,
              "type": "number | undefined",
              "description": "How long to wait before the preview card opens. Specified in milliseconds."
            },
            {
              "name": "handle",
              "optional": true,
              "type": "Base.Handle<unknown> | undefined",
              "description": "A handle to associate the trigger with a preview card."
            },
            {
              "name": "payload",
              "optional": true,
              "type": "unknown",
              "description": "A payload to pass to the preview card when it is opened."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<DetailedHTMLProps<AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, PreviewCardTriggerState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: PreviewCardTriggerState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"preview-card\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"preview-card\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Positioner",
          "props": [
            {
              "name": "align",
              "optional": true,
              "type": "Align | undefined",
              "description": "How to align the popup relative to the specified side."
            },
            {
              "name": "alignOffset",
              "optional": true,
              "type": "number | OffsetFunction | undefined",
              "description": "Additional offset along the alignment axis in pixels.\nAlso accepts a function that returns the offset to read the dimensions of the anchor\nand positioner elements, along with its side and alignment.\n\nThe function takes a `data` object parameter with the following properties:\n- `data.anchor`: the dimensions of the anchor element with properties `width` and `height`.\n- `data.positioner`: the dimensions of the positioner element with properties `width` and `height`.\n- `data.side`: which side of the anchor element the positioner is aligned against.\n- `data.align`: how the positioner is aligned relative to the specified side."
            },
            {
              "name": "anchor",
              "optional": true,
              "type": "Element | VirtualElement | RefObject<Element | null> | (() => Element | VirtualElement | null) | null | undefined",
              "description": "An element to position the popup against.\nBy default, the popup will be positioned against the trigger."
            },
            {
              "name": "arrowPadding",
              "optional": true,
              "type": "number | undefined",
              "description": "Minimum distance to maintain between the arrow and the edges of the popup.\n\nUse it to prevent the arrow element from hanging out of the rounded corners of a popup."
            },
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: PreviewCardPositionerState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "collisionAvoidance",
              "optional": true,
              "type": "CollisionAvoidance | undefined",
              "description": "Determines how to handle collisions when positioning the popup.\n\n`side` controls overflow on the preferred placement axis (`top`/`bottom` or `left`/`right`):\n- `'flip'`: keep the requested side when it fits; otherwise try the opposite side\n  (`top` and `bottom`, or `left` and `right`).\n- `'shift'`: never change side; keep the requested side and move the popup within\n  the clipping boundary so it stays visible.\n- `'none'`: do not correct side-axis overflow.\n\n`align` controls overflow on the alignment axis (`start`/`center`/`end`):\n- `'flip'`: keep side, but swap `start` and `end` when the requested alignment overflows.\n- `'shift'`: keep side and requested alignment, then nudge the popup along the\n  alignment axis to fit.\n- `'none'`: do not correct alignment-axis overflow.\n\n`fallbackAxisSide` controls fallback behavior on the perpendicular axis when the\npreferred axis cannot fit:\n- `'start'`: allow perpendicular fallback and try the logical start side first\n  (`top` before `bottom`, or `left` before `right` in LTR).\n- `'end'`: allow perpendicular fallback and try the logical end side first\n  (`bottom` before `top`, or `right` before `left` in LTR).\n- `'none'`: do not fallback to the perpendicular axis.\n\nWhen `side` is `'shift'`, explicitly setting `align` only supports `'shift'` or `'none'`.\nIf `align` is omitted, it defaults to `'flip'`."
            },
            {
              "name": "collisionBoundary",
              "optional": true,
              "type": "Boundary | undefined",
              "description": "An element or a rectangle that delimits the area that the popup is confined to."
            },
            {
              "name": "collisionPadding",
              "optional": true,
              "type": "Padding | undefined",
              "description": "Additional space to maintain from the edge of the collision boundary."
            },
            {
              "name": "disableAnchorTracking",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to disable the popup from tracking any layout shift of its positioning anchor."
            },
            {
              "name": "positionMethod",
              "optional": true,
              "type": "\"absolute\" | \"fixed\" | undefined",
              "description": "Determines which CSS `position` property to use."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, PreviewCardPositionerState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "side",
              "optional": true,
              "type": "Side | undefined",
              "description": "Which side of the anchor element to align the popup against.\nMay automatically change to avoid collisions."
            },
            {
              "name": "sideOffset",
              "optional": true,
              "type": "number | OffsetFunction | undefined",
              "description": "Distance between the anchor and the popup in pixels.\nAlso accepts a function that returns the distance to read the dimensions of the anchor\nand positioner elements, along with its side and alignment.\n\nThe function takes a `data` object parameter with the following properties:\n- `data.anchor`: the dimensions of the anchor element with properties `width` and `height`.\n- `data.positioner`: the dimensions of the positioner element with properties `width` and `height`.\n- `data.side`: which side of the anchor element the positioner is aligned against.\n- `data.align`: how the positioner is aligned relative to the specified side."
            },
            {
              "name": "sticky",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to maintain the popup in the viewport after\nthe anchor element was scrolled out of view."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: PreviewCardPositionerState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"preview-card\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"preview-card\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Popup",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: PreviewCardPopupState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, PreviewCardPopupState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: PreviewCardPopupState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"preview-card\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"preview-card\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Arrow",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: PreviewCardArrowState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, PreviewCardArrowState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: PreviewCardArrowState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"preview-card\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"preview-card\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Portal",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: PreviewCardPortalState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "container",
              "optional": true,
              "type": "HTMLElement | ShadowRoot | RefObject<HTMLElement | ShadowRoot | null> | null | undefined",
              "description": "A parent element to render the portal element into."
            },
            {
              "name": "keepMounted",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to keep the portal mounted in the DOM while the popup is hidden."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, PreviewCardPortalState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: PreviewCardPortalState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            }
          ]
        }
      ],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-overlays-preview-card/#previewcard",
      "api": "/api/packages/overlays/preview-card.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "floating",
          "title": "Portals and floating content",
          "example": "floating",
          "source": "/examples/floating.tsx"
        }
      ]
    },
    {
      "name": "Progress",
      "entry": "@fayegram-ai/faye-ui/feedback/progress",
      "guide": "/docs/feedback/",
      "declaration": "packages/faye-ui/dist/feedback/progress.d.ts",
      "signature": null,
      "props": [],
      "parts": [
        {
          "name": "Root",
          "props": [
            {
              "name": "animationDirection",
              "optional": true,
              "type": "\"ltr\" | \"rtl\" | undefined",
              "description": "Physical direction of indeterminate/query motion, independent of text direction."
            },
            {
              "name": "aria-valuetext",
              "optional": true,
              "type": "string | undefined",
              "description": "A string value that provides a user-friendly name for `aria-valuenow`, the current value of the progress bar."
            },
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ProgressRootState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "format",
              "optional": true,
              "type": "Intl.NumberFormatOptions | undefined",
              "description": "Options to format the value."
            },
            {
              "name": "getAriaValueText",
              "optional": true,
              "type": "((formattedValue: string, value: number | null) => string) | undefined",
              "description": "Accepts a function which returns a string value that provides a human-readable text alternative for the current value of the progress bar."
            },
            {
              "name": "locale",
              "optional": true,
              "type": "Intl.LocalesArgument",
              "description": "The locale used by `Intl.NumberFormat` when formatting the value.\nDefaults to the user's runtime locale."
            },
            {
              "name": "max",
              "optional": true,
              "type": "number | undefined",
              "description": "The maximum value."
            },
            {
              "name": "min",
              "optional": true,
              "type": "number | undefined",
              "description": "The minimum value."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ProgressRootState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ProgressRootState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "value",
              "optional": false,
              "type": "number | null",
              "description": "The current value. The component is indeterminate when value is `null`."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"progress\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"progress\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Track",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ProgressTrackState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ProgressTrackState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ProgressTrackState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"progress\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"progress\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Indicator",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ProgressIndicatorState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ProgressIndicatorState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ProgressIndicatorState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"progress\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"progress\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Value",
          "props": [
            {
              "name": "children",
              "optional": true,
              "type": "((formattedValue: string | null, value: number | null) => React.ReactNode) | null | undefined",
              "description": ""
            },
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ProgressValueState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ProgressValueState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ProgressValueState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"progress\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"progress\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Label",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ProgressLabelState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ProgressLabelState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ProgressLabelState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"progress\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"progress\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Buffer",
          "props": [
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"progress\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"progress\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        }
      ],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-feedback-progress/#progress",
      "api": "/api/packages/feedback/progress.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "feedback",
          "title": "Feedback and status",
          "example": "feedback",
          "source": "/examples/feedback.tsx"
        }
      ]
    },
    {
      "name": "QueryContainer",
      "entry": "@fayegram-ai/faye-ui/layout/layout",
      "guide": "/docs/layout/",
      "declaration": "packages/faye-ui/dist/layout/layout.d.ts",
      "signature": "({ name, type, style, ...props }: HTMLAttributes<HTMLDivElement> & { name?: string; type?: \"inline-size\" | \"size\"; }): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "name",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "type",
          "optional": true,
          "type": "\"size\" | \"inline-size\" | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "Establishes an explicit container-query boundary. Stylesheets still own the query rules.",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-layout-layout/#querycontainer",
      "api": "/api/packages/layout/layout.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "layout",
          "title": "Layout primitives",
          "example": "layout",
          "source": "/examples/layout.tsx"
        },
        {
          "slug": "pickers",
          "title": "Select and autocomplete",
          "example": "pickers",
          "source": "/examples/pickers.tsx"
        }
      ]
    },
    {
      "name": "Radio",
      "entry": "@fayegram-ai/faye-ui/controls/radio",
      "guide": "/docs/selection/",
      "declaration": "packages/faye-ui/dist/controls/radio.d.ts",
      "signature": null,
      "props": [],
      "parts": [
        {
          "name": "Root",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: RadioRootState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "disabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component should ignore user interaction."
            },
            {
              "name": "inputRef",
              "optional": true,
              "type": "Ref<HTMLInputElement> | undefined",
              "description": "A ref to access the hidden input element."
            },
            {
              "name": "nativeButton",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component renders a native `<button>` element when replacing it\nvia the `render` prop.\nSet to `true` if the rendered element is a native button."
            },
            {
              "name": "readOnly",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the user should be unable to select the radio button."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, RadioRootState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "required",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the user must choose a value before submitting a form."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: RadioRootState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "value",
              "optional": false,
              "type": "unknown",
              "description": "The unique identifying value of the radio in a group."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"radio\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"radio\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Indicator",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: RadioIndicatorState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "keepMounted",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to keep the HTML element in the DOM when the radio button is inactive."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, RadioIndicatorState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: RadioIndicatorState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"radio\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"radio\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        }
      ],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-controls-radio/#radio",
      "api": "/api/packages/controls/radio.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "accessibility",
          "title": "Accessibility and input behavior",
          "example": "accessibility",
          "source": "/examples/accessibility.tsx"
        },
        {
          "slug": "selection",
          "title": "Checkboxes, radios and switches",
          "example": "selection",
          "source": "/examples/selection.tsx"
        },
        {
          "slug": "consumer-experience",
          "title": "Interactive consumer experience",
          "example": "consumer-experience",
          "source": "/examples/consumer-experience.tsx"
        }
      ]
    },
    {
      "name": "RadioGroup",
      "entry": "@fayegram-ai/faye-ui/controls/radio-group",
      "guide": "/docs/selection/",
      "declaration": "packages/faye-ui/dist/controls/radio-group.d.ts",
      "signature": "(input: Base.Props<unknown> & { variants?: Readonly<Record<string, string>> | undefined; }): import(\"react\").ReactElement",
      "props": [
        {
          "name": "className",
          "optional": true,
          "type": "string | ((state: RadioGroupState) => string | undefined) | undefined",
          "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
        },
        {
          "name": "defaultValue",
          "optional": true,
          "type": "unknown",
          "description": "The uncontrolled value of the radio button that should be initially selected.\n\nTo render a controlled radio group, use the `value` prop instead."
        },
        {
          "name": "disabled",
          "optional": true,
          "type": "boolean | undefined",
          "description": "Whether the component should ignore user interaction."
        },
        {
          "name": "form",
          "optional": true,
          "type": "string | undefined",
          "description": "Identifies the form that owns the radio inputs.\nUseful when the radio group is rendered outside the form."
        },
        {
          "name": "inputRef",
          "optional": true,
          "type": "Ref<HTMLInputElement> | undefined",
          "description": "A ref to access the hidden input element."
        },
        {
          "name": "name",
          "optional": true,
          "type": "string | undefined",
          "description": "Identifies the field when a form is submitted."
        },
        {
          "name": "onValueChange",
          "optional": true,
          "type": "((value: unknown, eventDetails: Base.ChangeEventDetails) => void) | undefined",
          "description": "Callback fired when the value changes."
        },
        {
          "name": "readOnly",
          "optional": true,
          "type": "boolean | undefined",
          "description": "Whether the user should be unable to select a different radio button in the group."
        },
        {
          "name": "render",
          "optional": true,
          "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, RadioGroupState> | undefined",
          "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
        },
        {
          "name": "required",
          "optional": true,
          "type": "boolean | undefined",
          "description": "Whether the user must choose a value before submitting a form."
        },
        {
          "name": "style",
          "optional": true,
          "type": "CSSProperties | ((state: RadioGroupState) => React.CSSProperties | undefined) | undefined",
          "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
        },
        {
          "name": "value",
          "optional": true,
          "type": "unknown",
          "description": "The controlled value of the radio item that should be currently selected.\n\nTo render an uncontrolled radio group, use the `defaultValue` prop instead."
        },
        {
          "name": "variants",
          "optional": true,
          "type": "Readonly<Record<string, string>> | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-controls-radio-group/#radiogroup",
      "api": "/api/packages/controls/radio-group.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "accessibility",
          "title": "Accessibility and input behavior",
          "example": "accessibility",
          "source": "/examples/accessibility.tsx"
        },
        {
          "slug": "selection",
          "title": "Checkboxes, radios and switches",
          "example": "selection",
          "source": "/examples/selection.tsx"
        },
        {
          "slug": "consumer-experience",
          "title": "Interactive consumer experience",
          "example": "consumer-experience",
          "source": "/examples/consumer-experience.tsx"
        }
      ]
    },
    {
      "name": "Rating",
      "entry": "@fayegram-ai/faye-ui/controls/rating",
      "guide": "/docs/numeric/",
      "declaration": "packages/faye-ui/dist/controls/rating.d.ts",
      "signature": "(input: RatingProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "clearable",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "clearLabel",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "defaultValue",
          "optional": true,
          "type": "number | undefined",
          "description": ""
        },
        {
          "name": "disabled",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "emptyIcon",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "form",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "getValueLabel",
          "optional": true,
          "type": "((value: number, max: number) => string) | undefined",
          "description": ""
        },
        {
          "name": "icon",
          "optional": true,
          "type": "ReactNode",
          "description": "Decorative artwork. Supply matching empty/filled geometry; native rating semantics stay intact."
        },
        {
          "name": "label",
          "optional": false,
          "type": "string",
          "description": ""
        },
        {
          "name": "max",
          "optional": true,
          "type": "number | undefined",
          "description": ""
        },
        {
          "name": "name",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "onPreviewChange",
          "optional": true,
          "type": "((value: number | null) => void) | undefined",
          "description": "Pointer preview does not change the selected or submitted value; null means no preview."
        },
        {
          "name": "onValueChange",
          "optional": true,
          "type": "((value: number) => void) | undefined",
          "description": ""
        },
        {
          "name": "precision",
          "optional": true,
          "type": "number | undefined",
          "description": ""
        },
        {
          "name": "readOnly",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "value",
          "optional": true,
          "type": "number | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-controls-rating/#rating",
      "api": "/api/packages/controls/rating.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "accessibility",
          "title": "Accessibility and input behavior",
          "example": "accessibility",
          "source": "/examples/accessibility.tsx"
        },
        {
          "slug": "numeric",
          "title": "Numeric and specialized input",
          "example": "numeric",
          "source": "/examples/numeric.tsx"
        }
      ]
    },
    {
      "name": "RuntimeStyleProvider",
      "entry": "@fayegram-ai/faye-ui/runtime-styles/react",
      "guide": "/docs/runtime-styles/",
      "declaration": "packages/faye-ui/dist/runtime-styles/react.d.ts",
      "signature": "({ registry, collector, children }: RuntimeContext & { children: ReactNode; }): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "children",
          "optional": false,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "collector",
          "optional": true,
          "type": "{ add(entry: StyleEntry): void; } | undefined",
          "description": ""
        },
        {
          "name": "registry",
          "optional": true,
          "type": "StyleRegistry | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "Explicit ownership. A server collector is request-local and only used during server rendering.",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-runtime-styles-react/#runtimestyleprovider",
      "api": "/api/packages/runtime-styles/react.json",
      "clientBoundary": true,
      "pages": []
    },
    {
      "name": "Scale",
      "entry": "@fayegram-ai/faye-ui/motion/presence",
      "guide": "/docs/motion/",
      "declaration": "packages/faye-ui/dist/motion/presence.d.ts",
      "signature": "(props: Omit<PresenceProps, \"effect\">): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "appear",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "container",
          "optional": true,
          "type": "HTMLElement | RefObject<HTMLElement | null> | null | undefined",
          "description": "Optional boundary to slide fully outside instead of using the small default offset."
        },
        {
          "name": "direction",
          "optional": true,
          "type": "\"start\" | \"end\" | \"left\" | \"right\" | \"up\" | \"down\" | undefined",
          "description": "Slide starts at this edge; start/end follow computed text direction."
        },
        {
          "name": "enterDuration",
          "optional": true,
          "type": "number | undefined",
          "description": ""
        },
        {
          "name": "exitDuration",
          "optional": true,
          "type": "number | undefined",
          "description": ""
        },
        {
          "name": "keepMounted",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "onExitComplete",
          "optional": true,
          "type": "(() => void) | undefined",
          "description": ""
        },
        {
          "name": "orientation",
          "optional": true,
          "type": "\"horizontal\" | \"vertical\" | undefined",
          "description": ""
        },
        {
          "name": "present",
          "optional": false,
          "type": "boolean",
          "description": ""
        },
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLDivElement> | undefined",
          "description": ""
        },
        {
          "name": "scaleOrigin",
          "optional": true,
          "type": "Property.TransformOrigin<string | number> | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-motion-presence/#scale",
      "api": "/api/packages/motion/presence.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "interaction-compositions",
          "title": "Motion and interactive navigation",
          "example": "interaction-compositions",
          "source": "/examples/interaction-compositions.tsx"
        },
        {
          "slug": "motion",
          "title": "Motion and presence",
          "example": "motion",
          "source": "/examples/motion.tsx"
        }
      ]
    },
    {
      "name": "ScopedBaseline",
      "entry": "@fayegram-ai/faye-ui/core/scoped-baseline",
      "guide": "/docs/foundations/",
      "declaration": "packages/faye-ui/dist/core/scoped-baseline.d.ts",
      "signature": "({ profile, className, ...props }: HTMLAttributes<HTMLDivElement> & { profile?: ComponentProfile; }): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "profile",
          "optional": true,
          "type": "ComponentProfile | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "A local baseline. Does not reset document styles or promise isolation from arbitrary host CSS.",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-core-scoped-baseline/#scopedbaseline",
      "api": "/api/packages/core/scoped-baseline.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "foundations",
          "title": "Typography and surfaces",
          "example": "foundations",
          "source": "/examples/foundations.tsx"
        }
      ]
    },
    {
      "name": "ScrollAppBar",
      "entry": "@fayegram-ai/faye-ui/patterns/application-navigation",
      "guide": "/docs/patterns/",
      "declaration": "packages/faye-ui/dist/patterns/application-navigation.d.ts",
      "signature": "({ hidden, elevated, className, ...props }: HTMLAttributes<HTMLElement> & { hidden?: boolean; elevated?: boolean; }): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "elevated",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "hidden",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "Compose with useScrollTrigger; focus within keeps the navigation visible and operable.",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-patterns-application-navigation/#scrollappbar",
      "api": "/api/packages/patterns/application-navigation.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "functional-completion",
          "title": "Consumer interactions and navigation",
          "example": "functional-completion",
          "source": "/examples/functional-completion.tsx"
        }
      ]
    },
    {
      "name": "ScrollArea",
      "entry": "@fayegram-ai/faye-ui/display/scroll-area",
      "guide": "/docs/display/",
      "declaration": "packages/faye-ui/dist/display/scroll-area.d.ts",
      "signature": null,
      "props": [],
      "parts": [
        {
          "name": "Root",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ScrollAreaRootState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "interaction",
              "optional": true,
              "type": "InteractionOptions | undefined",
              "description": ""
            },
            {
              "name": "overflowEdgeThreshold",
              "optional": true,
              "type": "number | Partial<{ xStart: number; xEnd: number; yStart: number; yEnd: number; }> | undefined",
              "description": "The threshold in pixels that must be passed before the overflow edge attributes are applied.\nAccepts a single number for all edges or an object to configure them individually."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ScrollAreaRootState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ScrollAreaRootState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"scroll-area\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"scroll-area\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Viewport",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ScrollAreaViewportState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ScrollAreaViewportState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "scrollChaining",
              "optional": true,
              "type": "\"auto\" | \"contain\" | undefined",
              "description": "Allow page scrolling at the boundary by default; contain is opt-in for bounded panels."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ScrollAreaViewportState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"scroll-area\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"scroll-area\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Scrollbar",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ScrollAreaScrollbarState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "keepMounted",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to keep the HTML element in the DOM when the viewport isn't scrollable."
            },
            {
              "name": "orientation",
              "optional": true,
              "type": "\"horizontal\" | \"vertical\" | undefined",
              "description": "Whether the scrollbar controls vertical or horizontal scroll."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ScrollAreaScrollbarState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ScrollAreaScrollbarState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"scroll-area\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"scroll-area\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Thumb",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ScrollAreaThumbState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ScrollAreaThumbState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ScrollAreaThumbState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"scroll-area\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"scroll-area\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Corner",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ScrollAreaCornerState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ScrollAreaCornerState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ScrollAreaCornerState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"scroll-area\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"scroll-area\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Content",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ScrollAreaContentState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ScrollAreaContentState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ScrollAreaContentState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"scroll-area\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"scroll-area\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        }
      ],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-display-scroll-area/#scrollarea",
      "api": "/api/packages/display/scroll-area.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "display",
          "title": "Tables, lists and display",
          "example": "display",
          "source": "/examples/display.tsx"
        }
      ]
    },
    {
      "name": "SearchField",
      "entry": "@fayegram-ai/faye-ui/patterns/search-field",
      "guide": "/docs/patterns/",
      "declaration": "packages/faye-ui/dist/patterns/search-field.d.ts",
      "signature": "({ label, id, ...props }: SearchFieldProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "className",
          "optional": true,
          "type": "string | ((state: InputState) => string | undefined) | undefined",
          "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
        },
        {
          "name": "defaultValue",
          "optional": true,
          "type": "string | number | readonly string[] | undefined",
          "description": "The default value of the input. Use when uncontrolled."
        },
        {
          "name": "htmlSize",
          "optional": true,
          "type": "number | undefined",
          "description": ""
        },
        {
          "name": "invalid",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "label",
          "optional": false,
          "type": "string",
          "description": ""
        },
        {
          "name": "onValueChange",
          "optional": true,
          "type": "((value: string, eventDetails: Input.ChangeEventDetails) => void) | undefined",
          "description": "Callback fired when the `value` changes. Use when controlled."
        },
        {
          "name": "render",
          "optional": true,
          "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, InputState> | undefined",
          "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
        },
        {
          "name": "size",
          "optional": true,
          "type": "VisualVariant<\"input\", \"size\"> | undefined",
          "description": ""
        },
        {
          "name": "style",
          "optional": true,
          "type": "CSSProperties | ((state: InputState) => React.CSSProperties | undefined) | undefined",
          "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
        },
        {
          "name": "value",
          "optional": true,
          "type": "string | number | readonly string[] | undefined",
          "description": "The value of the input. Use when controlled."
        },
        {
          "name": "variant",
          "optional": true,
          "type": "VisualVariant<\"input\", \"variant\"> | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-patterns-search-field/#searchfield",
      "api": "/api/packages/patterns/search-field.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "patterns",
          "title": "Application patterns",
          "example": "patterns",
          "source": "/examples/patterns.tsx"
        }
      ]
    },
    {
      "name": "Select",
      "entry": "@fayegram-ai/faye-ui/controls/select",
      "guide": "/docs/pickers/",
      "declaration": "packages/faye-ui/dist/controls/select.d.ts",
      "signature": null,
      "props": [],
      "parts": [
        {
          "name": "Root",
          "props": [
            {
              "name": "actionsRef",
              "optional": true,
              "type": "React.RefObject<SelectRootActions | null> | undefined",
              "description": "A ref to imperative actions.\n- `unmount`: Manually unmounts the select.\nCall this after any externally controlled closing animation finishes."
            },
            {
              "name": "autoComplete",
              "optional": true,
              "type": "string | undefined",
              "description": "Provides a hint to the browser for autofill."
            },
            {
              "name": "children",
              "optional": true,
              "type": "React.ReactNode",
              "description": ""
            },
            {
              "name": "defaultOpen",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the select popup is initially open.\n\nTo render a controlled select popup, use the `open` prop instead."
            },
            {
              "name": "defaultValue",
              "optional": true,
              "type": "SelectValueType<Value, Multiple> | null | undefined",
              "description": "The uncontrolled value of the select when it's initially rendered.\n\nTo render a controlled select, use the `value` prop instead."
            },
            {
              "name": "disabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component should ignore user interaction."
            },
            {
              "name": "form",
              "optional": true,
              "type": "string | undefined",
              "description": "Identifies the form that owns the hidden input.\nUseful when the select is rendered outside the form."
            },
            {
              "name": "highlightItemOnHover",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether moving the pointer over items should highlight them.\nDisabling this prop allows CSS `:hover` to be differentiated from the `:focus` (`data-highlighted`) state."
            },
            {
              "name": "id",
              "optional": true,
              "type": "string | undefined",
              "description": "The id of the Select."
            },
            {
              "name": "inputRef",
              "optional": true,
              "type": "React.Ref<HTMLInputElement> | undefined",
              "description": "A ref to access the hidden input element."
            },
            {
              "name": "isItemEqualToValue",
              "optional": true,
              "type": "((itemValue: Value, value: Value) => boolean) | undefined",
              "description": "Custom comparison logic used to determine if a select item value matches the current selected value. Useful when item values are objects without matching referentially.\nDefaults to `Object.is` comparison."
            },
            {
              "name": "items",
              "optional": true,
              "type": "readonly Group<any>[] | Record<string, React.ReactNode> | readonly { label: React.ReactNode; value: any; }[] | undefined",
              "description": "Data structure of the items rendered in the select popup.\nWhen specified, `<Select.Value>` renders the label of the selected item instead of the raw value."
            },
            {
              "name": "itemToStringLabel",
              "optional": true,
              "type": "((itemValue: Value) => string) | undefined",
              "description": "When the item values are objects (`<Select.Item value={object}>`), this function converts the object value to a string representation for display in the trigger.\nIf the shape of the object is `{ value, label }`, the label will be used automatically without needing to specify this prop."
            },
            {
              "name": "itemToStringValue",
              "optional": true,
              "type": "((itemValue: Value) => string) | undefined",
              "description": "When the item values are objects (`<Select.Item value={object}>`), this function converts the object value to a string representation for form submission.\nIf the shape of the object is `{ value, label }`, the value will be used automatically without needing to specify this prop."
            },
            {
              "name": "modal",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Determines if the select enters a modal state when open.\n- `true`: user interaction is limited to the select: document page scroll is locked and pointer interactions on outside elements are disabled.\n- `false`: user interaction with the rest of the document is allowed.\n\nOn touch devices, a `true` modal blocks outside taps but leaves the page scrollable unless the popup spans nearly the full viewport width, matching native iOS behavior."
            },
            {
              "name": "multiple",
              "optional": true,
              "type": "Multiple | undefined",
              "description": "Whether multiple items can be selected."
            },
            {
              "name": "name",
              "optional": true,
              "type": "string | undefined",
              "description": "Identifies the field when a form is submitted."
            },
            {
              "name": "onOpenChange",
              "optional": true,
              "type": "((open: boolean, eventDetails: SelectRootChangeEventDetails) => void) | undefined",
              "description": "Event handler called when the select popup is opened or closed."
            },
            {
              "name": "onOpenChangeComplete",
              "optional": true,
              "type": "((open: boolean) => void) | undefined",
              "description": "Event handler called after any animations complete when the select popup is opened or closed."
            },
            {
              "name": "onValueChange",
              "optional": true,
              "type": "((value: SelectValueType<Value, Multiple> | (Multiple extends true ? never : null), eventDetails: SelectRootChangeEventDetails) => void) | undefined",
              "description": "Event handler called when the value of the select changes."
            },
            {
              "name": "open",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the select popup is currently open."
            },
            {
              "name": "readOnly",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the user should be unable to choose a different option from the select popup."
            },
            {
              "name": "required",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the user must choose a value before submitting a form."
            },
            {
              "name": "value",
              "optional": true,
              "type": "SelectValueType<Value, Multiple> | null | undefined",
              "description": "The value of the select. Use when controlled."
            }
          ]
        },
        {
          "name": "List",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: SelectListState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, SelectListState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: SelectListState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: VisualVariant<\"select\", \"variant\"> | undefined; readonly size?: VisualVariant<\"select\", \"size\"> | undefined; readonly tone?: VisualVariant<\"select\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Trigger",
          "props": [
            {
              "name": "children",
              "optional": true,
              "type": "ReactNode",
              "description": ""
            },
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: SelectTriggerState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "disabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component should ignore user interaction."
            },
            {
              "name": "nativeButton",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component renders a native `<button>` element when replacing it\nvia the `render` prop.\nSet to `false` if the rendered element is not a button (for example, `<div>`)."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, SelectTriggerState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: SelectTriggerState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: VisualVariant<\"select\", \"variant\"> | undefined; readonly size?: VisualVariant<\"select\", \"size\"> | undefined; readonly tone?: VisualVariant<\"select\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Value",
          "props": [
            {
              "name": "children",
              "optional": true,
              "type": "ReactNode | ((value: any) => React.ReactNode)",
              "description": "Accepts a function that returns a `ReactNode` to format the selected value.\nTreat the value as read-only: in `multiple` mode it may be a shared frozen array\nwhen nothing is selected."
            },
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: SelectValueState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "placeholder",
              "optional": true,
              "type": "ReactNode",
              "description": "The placeholder value to display when no value is selected.\nThis is overridden by `children` if specified, or by a null item's label in `items`."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, SelectValueState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: SelectValueState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: VisualVariant<\"select\", \"variant\"> | undefined; readonly size?: VisualVariant<\"select\", \"size\"> | undefined; readonly tone?: VisualVariant<\"select\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Icon",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: SelectIconState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, SelectIconState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: SelectIconState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: VisualVariant<\"select\", \"variant\"> | undefined; readonly size?: VisualVariant<\"select\", \"size\"> | undefined; readonly tone?: VisualVariant<\"select\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Positioner",
          "props": [
            {
              "name": "align",
              "optional": true,
              "type": "Align | undefined",
              "description": "How to align the popup relative to the specified side."
            },
            {
              "name": "alignItemWithTrigger",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the positioner overlaps the trigger so the selected item's text is aligned with the trigger's value text. This only applies to mouse input and is automatically disabled if there is not enough space."
            },
            {
              "name": "alignOffset",
              "optional": true,
              "type": "number | OffsetFunction | undefined",
              "description": "Additional offset along the alignment axis in pixels.\nAlso accepts a function that returns the offset to read the dimensions of the anchor\nand positioner elements, along with its side and alignment.\n\nThe function takes a `data` object parameter with the following properties:\n- `data.anchor`: the dimensions of the anchor element with properties `width` and `height`.\n- `data.positioner`: the dimensions of the positioner element with properties `width` and `height`.\n- `data.side`: which side of the anchor element the positioner is aligned against.\n- `data.align`: how the positioner is aligned relative to the specified side."
            },
            {
              "name": "anchor",
              "optional": true,
              "type": "Element | VirtualElement | RefObject<Element | null> | (() => Element | VirtualElement | null) | null | undefined",
              "description": "An element to position the popup against.\nBy default, the popup will be positioned against the trigger."
            },
            {
              "name": "arrowPadding",
              "optional": true,
              "type": "number | undefined",
              "description": "Minimum distance to maintain between the arrow and the edges of the popup.\n\nUse it to prevent the arrow element from hanging out of the rounded corners of a popup."
            },
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: SelectPositionerState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "collisionAvoidance",
              "optional": true,
              "type": "CollisionAvoidance | undefined",
              "description": "Determines how to handle collisions when positioning the popup.\n\n`side` controls overflow on the preferred placement axis (`top`/`bottom` or `left`/`right`):\n- `'flip'`: keep the requested side when it fits; otherwise try the opposite side\n  (`top` and `bottom`, or `left` and `right`).\n- `'shift'`: never change side; keep the requested side and move the popup within\n  the clipping boundary so it stays visible.\n- `'none'`: do not correct side-axis overflow.\n\n`align` controls overflow on the alignment axis (`start`/`center`/`end`):\n- `'flip'`: keep side, but swap `start` and `end` when the requested alignment overflows.\n- `'shift'`: keep side and requested alignment, then nudge the popup along the\n  alignment axis to fit.\n- `'none'`: do not correct alignment-axis overflow.\n\n`fallbackAxisSide` controls fallback behavior on the perpendicular axis when the\npreferred axis cannot fit:\n- `'start'`: allow perpendicular fallback and try the logical start side first\n  (`top` before `bottom`, or `left` before `right` in LTR).\n- `'end'`: allow perpendicular fallback and try the logical end side first\n  (`bottom` before `top`, or `right` before `left` in LTR).\n- `'none'`: do not fallback to the perpendicular axis.\n\nWhen `side` is `'shift'`, explicitly setting `align` only supports `'shift'` or `'none'`.\nIf `align` is omitted, it defaults to `'flip'`."
            },
            {
              "name": "collisionBoundary",
              "optional": true,
              "type": "Boundary | undefined",
              "description": "An element or a rectangle that delimits the area that the popup is confined to."
            },
            {
              "name": "collisionPadding",
              "optional": true,
              "type": "Padding | undefined",
              "description": "Additional space to maintain from the edge of the collision boundary."
            },
            {
              "name": "disableAnchorTracking",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to disable the popup from tracking any layout shift of its positioning anchor."
            },
            {
              "name": "positionMethod",
              "optional": true,
              "type": "\"absolute\" | \"fixed\" | undefined",
              "description": "Determines which CSS `position` property to use."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, SelectPositionerState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "side",
              "optional": true,
              "type": "Side | undefined",
              "description": "Which side of the anchor element to align the popup against.\nMay automatically change to avoid collisions."
            },
            {
              "name": "sideOffset",
              "optional": true,
              "type": "number | OffsetFunction | undefined",
              "description": "Distance between the anchor and the popup in pixels.\nAlso accepts a function that returns the distance to read the dimensions of the anchor\nand positioner elements, along with its side and alignment.\n\nThe function takes a `data` object parameter with the following properties:\n- `data.anchor`: the dimensions of the anchor element with properties `width` and `height`.\n- `data.positioner`: the dimensions of the positioner element with properties `width` and `height`.\n- `data.side`: which side of the anchor element the positioner is aligned against.\n- `data.align`: how the positioner is aligned relative to the specified side."
            },
            {
              "name": "sticky",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to maintain the popup in the viewport after\nthe anchor element was scrolled out of view."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: SelectPositionerState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: VisualVariant<\"select\", \"variant\"> | undefined; readonly size?: VisualVariant<\"select\", \"size\"> | undefined; readonly tone?: VisualVariant<\"select\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Popup",
          "props": [
            {
              "name": "children",
              "optional": true,
              "type": "ReactNode",
              "description": ""
            },
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: SelectPopupState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "finalFocus",
              "optional": true,
              "type": "boolean | RefObject<HTMLElement | null> | ((closeType: InteractionType) => boolean | HTMLElement | null | void) | undefined",
              "description": "Determines the element to focus when the select popup is closed.\n\n- `false`: Do not move focus.\n- `true`: Move focus based on the default behavior (trigger or previously focused element).\n- `RefObject`: Move focus to the ref element.\n- `function`: Called with the interaction type (`mouse`, `touch`, `pen`, or `keyboard`).\n  Return an element to focus, `true` to use the default behavior, or `false`/`undefined` to do nothing."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, SelectPopupState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: SelectPopupState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: VisualVariant<\"select\", \"variant\"> | undefined; readonly size?: VisualVariant<\"select\", \"size\"> | undefined; readonly tone?: VisualVariant<\"select\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Item",
          "props": [
            {
              "name": "children",
              "optional": true,
              "type": "ReactNode",
              "description": ""
            },
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: SelectItemState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "disabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component should ignore user interaction."
            },
            {
              "name": "label",
              "optional": true,
              "type": "string | undefined",
              "description": "Specifies the text label to use when the item is matched during keyboard text navigation.\n\nDefaults to the item text content if not provided."
            },
            {
              "name": "nativeButton",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component renders a native `<button>` element when replacing it\nvia the `render` prop.\nSet to `true` if the rendered element is a native button."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, SelectItemState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: SelectItemState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "value",
              "optional": true,
              "type": "any",
              "description": "A unique value that identifies this select item."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: VisualVariant<\"select\", \"variant\"> | undefined; readonly size?: VisualVariant<\"select\", \"size\"> | undefined; readonly tone?: VisualVariant<\"select\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "ItemText",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: SelectItemTextState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, SelectItemTextState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: SelectItemTextState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: VisualVariant<\"select\", \"variant\"> | undefined; readonly size?: VisualVariant<\"select\", \"size\"> | undefined; readonly tone?: VisualVariant<\"select\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "ItemIndicator",
          "props": [
            {
              "name": "children",
              "optional": true,
              "type": "ReactNode",
              "description": ""
            },
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: SelectItemIndicatorState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "keepMounted",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to keep the HTML element in the DOM when the item is not selected."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, SelectItemIndicatorState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: SelectItemIndicatorState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: VisualVariant<\"select\", \"variant\"> | undefined; readonly size?: VisualVariant<\"select\", \"size\"> | undefined; readonly tone?: VisualVariant<\"select\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Group",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: SelectGroupState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, SelectGroupState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: SelectGroupState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: VisualVariant<\"select\", \"variant\"> | undefined; readonly size?: VisualVariant<\"select\", \"size\"> | undefined; readonly tone?: VisualVariant<\"select\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "GroupLabel",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: SelectGroupLabelState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, SelectGroupLabelState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: SelectGroupLabelState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: VisualVariant<\"select\", \"variant\"> | undefined; readonly size?: VisualVariant<\"select\", \"size\"> | undefined; readonly tone?: VisualVariant<\"select\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "ScrollUpArrow",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: SelectScrollDownArrowState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "keepMounted",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to keep the HTML element in the DOM while the select popup is not scrollable."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, SelectScrollDownArrowState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: SelectScrollDownArrowState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: VisualVariant<\"select\", \"variant\"> | undefined; readonly size?: VisualVariant<\"select\", \"size\"> | undefined; readonly tone?: VisualVariant<\"select\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "ScrollDownArrow",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: SelectScrollDownArrowState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "keepMounted",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to keep the HTML element in the DOM while the select popup is not scrollable."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, SelectScrollDownArrowState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: SelectScrollDownArrowState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly variant?: VisualVariant<\"select\", \"variant\"> | undefined; readonly size?: VisualVariant<\"select\", \"size\"> | undefined; readonly tone?: VisualVariant<\"select\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Portal",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: SelectPortalState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "container",
              "optional": true,
              "type": "HTMLElement | ShadowRoot | RefObject<HTMLElement | ShadowRoot | null> | null | undefined",
              "description": "A parent element to render the portal element into."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, SelectPortalState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: SelectPortalState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            }
          ]
        }
      ],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-controls-select/#select",
      "api": "/api/packages/controls/select.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "advanced-fields",
          "title": "Advanced field compositions",
          "example": "advanced-fields",
          "source": "/examples/advanced-fields.tsx"
        },
        {
          "slug": "pickers",
          "title": "Select and autocomplete",
          "example": "pickers",
          "source": "/examples/pickers.tsx"
        }
      ]
    },
    {
      "name": "SelectField",
      "entry": "@fayegram-ai/faye-ui/controls/select",
      "guide": "/docs/pickers/",
      "declaration": "packages/faye-ui/dist/controls/select.d.ts",
      "signature": "({ items, value, defaultValue, onValueChange, name, form, required, disabled, invalid, placeholder, nativeOnMobile, native, size, variant, tone, ref, ...props }: SelectFieldProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "defaultValue",
          "optional": true,
          "type": "string | null | undefined",
          "description": ""
        },
        {
          "name": "disabled",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "form",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "invalid",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "items",
          "optional": false,
          "type": "readonly SelectFieldItem[]",
          "description": ""
        },
        {
          "name": "name",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "native",
          "optional": true,
          "type": "boolean | undefined",
          "description": "Explicit native picker on every device."
        },
        {
          "name": "nativeOnMobile",
          "optional": true,
          "type": "boolean | undefined",
          "description": "Use the operating system picker when the primary pointer is coarse."
        },
        {
          "name": "onValueChange",
          "optional": true,
          "type": "((value: string | null) => void) | undefined",
          "description": ""
        },
        {
          "name": "placeholder",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLButtonElement | HTMLSelectElement> | undefined",
          "description": ""
        },
        {
          "name": "required",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "size",
          "optional": true,
          "type": "VisualVariant<\"select\", \"size\"> | undefined",
          "description": ""
        },
        {
          "name": "tone",
          "optional": true,
          "type": "VisualVariant<\"select\", \"tone\"> | undefined",
          "description": ""
        },
        {
          "name": "value",
          "optional": true,
          "type": "string | null | undefined",
          "description": ""
        },
        {
          "name": "variant",
          "optional": true,
          "type": "VisualVariant<\"select\", \"variant\"> | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "String-valued convenience control; compound Select remains available for richer collections.",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-controls-select/#selectfield",
      "api": "/api/packages/controls/select.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "pickers",
          "title": "Select and autocomplete",
          "example": "pickers",
          "source": "/examples/pickers.tsx"
        }
      ]
    },
    {
      "name": "Separator",
      "entry": "@fayegram-ai/faye-ui/core/separator",
      "guide": "/docs/foundations/",
      "declaration": "packages/faye-ui/dist/core/separator.d.ts",
      "signature": "({ orientation, decorative, textAlign, children, className, ...props }: SeparatorProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "decorative",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "orientation",
          "optional": true,
          "type": "\"horizontal\" | \"vertical\" | undefined",
          "description": ""
        },
        {
          "name": "textAlign",
          "optional": true,
          "type": "\"center\" | \"start\" | \"end\" | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-core-separator/#separator",
      "api": "/api/packages/core/separator.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "foundations",
          "title": "Typography and surfaces",
          "example": "foundations",
          "source": "/examples/foundations.tsx"
        }
      ]
    },
    {
      "name": "SheetInspector",
      "entry": "@fayegram-ai/faye-ui/devtools/inspector",
      "guide": "/docs/studio/",
      "declaration": "packages/faye-ui/dist/devtools/inspector.d.ts",
      "signature": "({ sheet }: { sheet: CompiledSheet; }): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "sheet",
          "optional": false,
          "type": "CompiledSheet",
          "description": ""
        }
      ],
      "parts": [],
      "description": "Build tooling may include provenance. It is not required by component runtime.",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-devtools-inspector/#sheetinspector",
      "api": "/api/packages/devtools/inspector.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "customization",
          "title": "Customization sheets",
          "example": "customization",
          "source": "/examples/customization.tsx"
        }
      ]
    },
    {
      "name": "Skeleton",
      "entry": "@fayegram-ai/faye-ui/feedback/loading",
      "guide": "/docs/feedback/",
      "declaration": "packages/faye-ui/dist/feedback/loading.d.ts",
      "signature": "({ width, height, shape, animation, profile, className, style, ...props }: HTMLAttributes<HTMLDivElement> & { width?: CSSProperties[\"width\"]; height?: CSSProperties[\"height\"]; shape?: \"text\" | \"rectangle\" | \"circle\"; animation?: \"pulse\" | \"wave\" | \"none\"; profile?: ComponentProfile; ref?: Ref<HTMLDivElement>; }): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "animation",
          "optional": true,
          "type": "\"none\" | \"pulse\" | \"wave\" | undefined",
          "description": ""
        },
        {
          "name": "height",
          "optional": true,
          "type": "Property.Height<string | number> | undefined",
          "description": ""
        },
        {
          "name": "profile",
          "optional": true,
          "type": "ComponentProfile | undefined",
          "description": ""
        },
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLDivElement> | undefined",
          "description": ""
        },
        {
          "name": "shape",
          "optional": true,
          "type": "\"text\" | \"circle\" | \"rectangle\" | undefined",
          "description": ""
        },
        {
          "name": "width",
          "optional": true,
          "type": "Property.Width<string | number> | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-feedback-loading/#skeleton",
      "api": "/api/packages/feedback/loading.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "feedback",
          "title": "Feedback and status",
          "example": "feedback",
          "source": "/examples/feedback.tsx"
        }
      ]
    },
    {
      "name": "SkipLink",
      "entry": "@fayegram-ai/faye-ui/core/visually-hidden",
      "guide": "/docs/foundations/",
      "declaration": "packages/faye-ui/dist/core/visually-hidden.d.ts",
      "signature": "({ href, children, className, ...props }: React.AnchorHTMLAttributes<HTMLAnchorElement>): import(\"react\").JSX.Element",
      "props": [],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-core-visually-hidden/#skiplink",
      "api": "/api/packages/core/visually-hidden.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "foundations",
          "title": "Typography and surfaces",
          "example": "foundations",
          "source": "/examples/foundations.tsx"
        }
      ]
    },
    {
      "name": "Slide",
      "entry": "@fayegram-ai/faye-ui/motion/presence",
      "guide": "/docs/motion/",
      "declaration": "packages/faye-ui/dist/motion/presence.d.ts",
      "signature": "(props: Omit<PresenceProps, \"effect\">): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "appear",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "container",
          "optional": true,
          "type": "HTMLElement | RefObject<HTMLElement | null> | null | undefined",
          "description": "Optional boundary to slide fully outside instead of using the small default offset."
        },
        {
          "name": "direction",
          "optional": true,
          "type": "\"start\" | \"end\" | \"left\" | \"right\" | \"up\" | \"down\" | undefined",
          "description": "Slide starts at this edge; start/end follow computed text direction."
        },
        {
          "name": "enterDuration",
          "optional": true,
          "type": "number | undefined",
          "description": ""
        },
        {
          "name": "exitDuration",
          "optional": true,
          "type": "number | undefined",
          "description": ""
        },
        {
          "name": "keepMounted",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "onExitComplete",
          "optional": true,
          "type": "(() => void) | undefined",
          "description": ""
        },
        {
          "name": "orientation",
          "optional": true,
          "type": "\"horizontal\" | \"vertical\" | undefined",
          "description": ""
        },
        {
          "name": "present",
          "optional": false,
          "type": "boolean",
          "description": ""
        },
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLDivElement> | undefined",
          "description": ""
        },
        {
          "name": "scaleOrigin",
          "optional": true,
          "type": "Property.TransformOrigin<string | number> | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-motion-presence/#slide",
      "api": "/api/packages/motion/presence.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "consumer-experience",
          "title": "Interactive consumer experience",
          "example": "consumer-experience",
          "source": "/examples/consumer-experience.tsx"
        },
        {
          "slug": "interaction-compositions",
          "title": "Motion and interactive navigation",
          "example": "interaction-compositions",
          "source": "/examples/interaction-compositions.tsx"
        },
        {
          "slug": "motion",
          "title": "Motion and presence",
          "example": "motion",
          "source": "/examples/motion.tsx"
        }
      ]
    },
    {
      "name": "Slider",
      "entry": "@fayegram-ai/faye-ui/controls/slider",
      "guide": "/docs/numeric/",
      "declaration": "packages/faye-ui/dist/controls/slider.d.ts",
      "signature": null,
      "props": [],
      "parts": [
        {
          "name": "Root",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: SliderRootState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "defaultValue",
              "optional": true,
              "type": "Value | undefined",
              "description": "The uncontrolled value of the slider when it's initially rendered.\n\nTo render a controlled slider, use the `value` prop instead."
            },
            {
              "name": "disabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the slider should ignore user interaction."
            },
            {
              "name": "form",
              "optional": true,
              "type": "string | undefined",
              "description": "Identifies the form that owns the slider inputs.\nUseful when the slider is rendered outside the form."
            },
            {
              "name": "format",
              "optional": true,
              "type": "Intl.NumberFormatOptions | undefined",
              "description": "Options to format the value."
            },
            {
              "name": "formatValue",
              "optional": true,
              "type": "((value: number) => string) | undefined",
              "description": ""
            },
            {
              "name": "interaction",
              "optional": true,
              "type": "InteractionOptions | undefined",
              "description": ""
            },
            {
              "name": "largeStep",
              "optional": true,
              "type": "number | undefined",
              "description": "The granularity with which the slider can step through values when using Page Up/Page Down or Shift + Arrow Up/Arrow Down."
            },
            {
              "name": "locale",
              "optional": true,
              "type": "Intl.LocalesArgument",
              "description": "The locale used by `Intl.NumberFormat` when formatting the value.\nDefaults to the user's runtime locale."
            },
            {
              "name": "max",
              "optional": true,
              "type": "number | undefined",
              "description": "The maximum allowed value of the slider.\nShould not be equal to min."
            },
            {
              "name": "min",
              "optional": true,
              "type": "number | undefined",
              "description": "The minimum allowed value of the slider.\nShould not be equal to max."
            },
            {
              "name": "minStepsBetweenValues",
              "optional": true,
              "type": "number | undefined",
              "description": "The minimum steps between values in a range slider."
            },
            {
              "name": "name",
              "optional": true,
              "type": "string | undefined",
              "description": "Identifies the field when a form is submitted."
            },
            {
              "name": "onValueChange",
              "optional": true,
              "type": "((value: Value extends number ? number : Value, eventDetails: SliderRoot.ChangeEventDetails) => void) | undefined",
              "description": "Callback function that is fired when the slider's value changed.\nReceives the new value as the first argument; the originating event is\navailable as `eventDetails.event`. The value is also reflected on\n`eventDetails.event.target.value` for form integration.\n\nThe `eventDetails.reason` indicates what triggered the change:\n\n- `'input-change'` when the hidden range input emits a change event (for example, via form integration)\n- `'track-press'` when the control track is pressed\n- `'drag'` while dragging a thumb\n- `'keyboard'` for keyboard input\n- `'none'` when the change is triggered without a specific interaction"
            },
            {
              "name": "onValueCommitted",
              "optional": true,
              "type": "((value: Value extends number ? number : Value, eventDetails: SliderRoot.CommitEventDetails) => void) | undefined",
              "description": "Callback function that is fired when a value change is committed.\nDoes not fire if the value did not change, or if the change was canceled.\n**Warning**: This is a generic event, not a change event.\n\nThe `eventDetails.reason` indicates what triggered the commit:\n\n- `'drag'` while dragging a thumb\n- `'track-press'` when the control track is pressed\n- `'keyboard'` for keyboard input\n- `'input-change'` when the hidden range input emits a change event (for example, via form integration)\n- `'none'` when the commit occurs without a specific interaction"
            },
            {
              "name": "orientation",
              "optional": true,
              "type": "Orientation | undefined",
              "description": "The component orientation."
            },
            {
              "name": "ref",
              "optional": true,
              "type": "Ref<HTMLDivElement> | undefined",
              "description": "Allows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref)."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, SliderRootState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "scale",
              "optional": true,
              "type": "((value: number) => number) | undefined",
              "description": "Transform displayed/announced values while retaining raw values for forms and positioning."
            },
            {
              "name": "step",
              "optional": true,
              "type": "number | undefined",
              "description": "The granularity with which the slider can step through values. (A \"discrete\" slider.)\nThe `min` prop serves as the origin for the valid values.\nWe recommend (max - min) to be evenly divisible by the step."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: SliderRootState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "thumbAlignment",
              "optional": true,
              "type": "\"center\" | \"edge\" | \"edge-client-only\" | undefined",
              "description": "How the thumb(s) are aligned relative to `Slider.Control` when the value is at `min` or `max`:\n- `center`: The center of the thumb is aligned with the control edge\n- `edge`: The thumb is inset within the control such that its edge is aligned with the control edge\n- `edge-client-only`: Same as `edge` but renders after React hydration on the client, reducing bundle size in return"
            },
            {
              "name": "thumbCollisionBehavior",
              "optional": true,
              "type": "\"push\" | \"none\" | \"swap\" | undefined",
              "description": "Controls how thumbs behave when they collide during pointer interactions.\n\n- `'push'` (default): Thumbs push each other without restoring their previous positions when dragged back.\n- `'swap'`: Thumbs swap places when dragged past each other.\n- `'none'`: Thumbs cannot move past each other; excess movement is ignored."
            },
            {
              "name": "value",
              "optional": true,
              "type": "Value | undefined",
              "description": "The value of the slider.\nFor range sliders, provide an array with one value per thumb."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly tone?: VisualVariant<\"slider\", \"tone\"> | undefined; readonly size?: VisualVariant<\"slider\", \"size\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "DiscreteRoot",
          "props": [
            {
              "name": "allowedValues",
              "optional": false,
              "type": "readonly number[]",
              "description": ""
            },
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: SliderRootState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "defaultValue",
              "optional": true,
              "type": "Value | undefined",
              "description": "The uncontrolled value of the slider when it's initially rendered.\n\nTo render a controlled slider, use the `value` prop instead."
            },
            {
              "name": "disabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the slider should ignore user interaction."
            },
            {
              "name": "form",
              "optional": true,
              "type": "string | undefined",
              "description": "Identifies the form that owns the slider inputs.\nUseful when the slider is rendered outside the form."
            },
            {
              "name": "format",
              "optional": true,
              "type": "Intl.NumberFormatOptions | undefined",
              "description": "Options to format the value."
            },
            {
              "name": "formatValue",
              "optional": true,
              "type": "((value: number) => string) | undefined",
              "description": ""
            },
            {
              "name": "interaction",
              "optional": true,
              "type": "InteractionOptions | undefined",
              "description": ""
            },
            {
              "name": "largeStep",
              "optional": true,
              "type": "number | undefined",
              "description": "The granularity with which the slider can step through values when using Page Up/Page Down or Shift + Arrow Up/Arrow Down."
            },
            {
              "name": "locale",
              "optional": true,
              "type": "Intl.LocalesArgument",
              "description": "The locale used by `Intl.NumberFormat` when formatting the value.\nDefaults to the user's runtime locale."
            },
            {
              "name": "minStepsBetweenValues",
              "optional": true,
              "type": "number | undefined",
              "description": "The minimum steps between values in a range slider."
            },
            {
              "name": "name",
              "optional": true,
              "type": "string | undefined",
              "description": "Identifies the field when a form is submitted."
            },
            {
              "name": "onValueChange",
              "optional": true,
              "type": "((value: Value extends number ? number : Value, eventDetails: SliderRoot.ChangeEventDetails) => void) | undefined",
              "description": "Callback function that is fired when the slider's value changed.\nReceives the new value as the first argument; the originating event is\navailable as `eventDetails.event`. The value is also reflected on\n`eventDetails.event.target.value` for form integration.\n\nThe `eventDetails.reason` indicates what triggered the change:\n\n- `'input-change'` when the hidden range input emits a change event (for example, via form integration)\n- `'track-press'` when the control track is pressed\n- `'drag'` while dragging a thumb\n- `'keyboard'` for keyboard input\n- `'none'` when the change is triggered without a specific interaction"
            },
            {
              "name": "onValueCommitted",
              "optional": true,
              "type": "((value: Value extends number ? number : Value, eventDetails: SliderRoot.CommitEventDetails) => void) | undefined",
              "description": "Callback function that is fired when a value change is committed.\nDoes not fire if the value did not change, or if the change was canceled.\n**Warning**: This is a generic event, not a change event.\n\nThe `eventDetails.reason` indicates what triggered the commit:\n\n- `'drag'` while dragging a thumb\n- `'track-press'` when the control track is pressed\n- `'keyboard'` for keyboard input\n- `'input-change'` when the hidden range input emits a change event (for example, via form integration)\n- `'none'` when the commit occurs without a specific interaction"
            },
            {
              "name": "orientation",
              "optional": true,
              "type": "Orientation | undefined",
              "description": "The component orientation."
            },
            {
              "name": "ref",
              "optional": true,
              "type": "Ref<HTMLDivElement> | undefined",
              "description": "Allows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref)."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, SliderRootState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "scale",
              "optional": true,
              "type": "((value: number) => number) | undefined",
              "description": "Transform displayed/announced values while retaining raw values for forms and positioning."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: SliderRootState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "thumbAlignment",
              "optional": true,
              "type": "\"center\" | \"edge\" | \"edge-client-only\" | undefined",
              "description": "How the thumb(s) are aligned relative to `Slider.Control` when the value is at `min` or `max`:\n- `center`: The center of the thumb is aligned with the control edge\n- `edge`: The thumb is inset within the control such that its edge is aligned with the control edge\n- `edge-client-only`: Same as `edge` but renders after React hydration on the client, reducing bundle size in return"
            },
            {
              "name": "value",
              "optional": true,
              "type": "Value | undefined",
              "description": "The value of the slider.\nFor range sliders, provide an array with one value per thumb."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly tone?: VisualVariant<\"slider\", \"tone\"> | undefined; readonly size?: VisualVariant<\"slider\", \"size\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Marks",
          "props": [
            {
              "name": "marks",
              "optional": false,
              "type": "readonly SliderMark[]",
              "description": ""
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"slider\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"slider\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Control",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: SliderControlState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, SliderControlState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: SliderControlState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"slider\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"slider\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Track",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: SliderTrackState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, SliderTrackState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: SliderTrackState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"slider\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"slider\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Indicator",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: SliderIndicatorState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, SliderIndicatorState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: SliderIndicatorState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"slider\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"slider\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Thumb",
          "props": [
            {
              "name": "aria-valuetext",
              "optional": true,
              "type": "string | undefined",
              "description": "A string value forwarded to the [`aria-valuetext`](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-valuetext) attribute of the `input`.\nIgnored when `getAriaValueText` is provided."
            },
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: SliderThumbState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "disabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the thumb should ignore user interaction."
            },
            {
              "name": "getAriaLabel",
              "optional": true,
              "type": "((index: number) => string) | null | undefined",
              "description": "A function which returns a string value for the [`aria-label`](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-label) attribute of the `input`."
            },
            {
              "name": "getAriaValueText",
              "optional": true,
              "type": "((formattedValue: string, value: number, index: number) => string) | null | undefined",
              "description": "A function which returns a string value for the [`aria-valuetext`](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-valuetext) attribute of the `input`.\nThis is important for screen reader users."
            },
            {
              "name": "index",
              "optional": true,
              "type": "number | undefined",
              "description": "The index of the thumb which corresponds to the index of its value in the\n`value` or `defaultValue` array.\nThis prop is required to support server-side rendering for range sliders\nwith multiple thumbs."
            },
            {
              "name": "inputRef",
              "optional": true,
              "type": "Ref<HTMLInputElement> | undefined",
              "description": "A ref to access the nested input element."
            },
            {
              "name": "onBlur",
              "optional": true,
              "type": "FocusEventHandler<HTMLInputElement> | undefined",
              "description": "A blur handler forwarded to the `input`."
            },
            {
              "name": "onFocus",
              "optional": true,
              "type": "FocusEventHandler<HTMLInputElement> | undefined",
              "description": "A focus handler forwarded to the `input`."
            },
            {
              "name": "onKeyDown",
              "optional": true,
              "type": "KeyboardEventHandler<HTMLInputElement> | undefined",
              "description": "A keydown handler forwarded to the `input`."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, SliderThumbState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: SliderThumbState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "tabIndex",
              "optional": true,
              "type": "number | undefined",
              "description": "Optional tab index attribute forwarded to the `input`."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"slider\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"slider\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Value",
          "props": [
            {
              "name": "children",
              "optional": true,
              "type": "((formattedValues: readonly string[], values: readonly number[]) => React.ReactNode) | null | undefined",
              "description": ""
            },
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: SliderValueState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, SliderValueState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: SliderValueState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"slider\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"slider\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        }
      ],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-controls-slider/#slider",
      "api": "/api/packages/controls/slider.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "accessibility",
          "title": "Accessibility and input behavior",
          "example": "accessibility",
          "source": "/examples/accessibility.tsx"
        },
        {
          "slug": "functional-completion",
          "title": "Consumer interactions and navigation",
          "example": "functional-completion",
          "source": "/examples/functional-completion.tsx"
        },
        {
          "slug": "customization",
          "title": "Customization sheets",
          "example": "customization",
          "source": "/examples/customization.tsx"
        },
        {
          "slug": "numeric",
          "title": "Numeric and specialized input",
          "example": "numeric",
          "source": "/examples/numeric.tsx"
        },
        {
          "slug": "theming",
          "title": "Theme and color system",
          "example": "theming",
          "source": "/examples/theming.tsx"
        }
      ]
    },
    {
      "name": "Spacer",
      "entry": "@fayegram-ai/faye-ui/layout/layout",
      "guide": "/docs/layout/",
      "declaration": "packages/faye-ui/dist/layout/layout.d.ts",
      "signature": "({ style, ...props }: HTMLAttributes<HTMLDivElement>): import(\"react\").JSX.Element",
      "props": [],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-layout-layout/#spacer",
      "api": "/api/packages/layout/layout.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "layout",
          "title": "Layout primitives",
          "example": "layout",
          "source": "/examples/layout.tsx"
        }
      ]
    },
    {
      "name": "Spinner",
      "entry": "@fayegram-ai/faye-ui/feedback/loading",
      "guide": "/docs/feedback/",
      "declaration": "packages/faye-ui/dist/feedback/loading.d.ts",
      "signature": "({ label, size, profile, className, ...props }: HTMLAttributes<HTMLSpanElement> & { label?: string; size?: \"sm\" | \"md\" | \"lg\"; profile?: ComponentProfile; ref?: Ref<HTMLSpanElement>; }): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "label",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "profile",
          "optional": true,
          "type": "ComponentProfile | undefined",
          "description": ""
        },
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLSpanElement> | undefined",
          "description": ""
        },
        {
          "name": "size",
          "optional": true,
          "type": "\"sm\" | \"md\" | \"lg\" | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-feedback-loading/#spinner",
      "api": "/api/packages/feedback/loading.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "advanced-fields",
          "title": "Advanced field compositions",
          "example": "advanced-fields",
          "source": "/examples/advanced-fields.tsx"
        },
        {
          "slug": "async-workflows",
          "title": "Asynchronous workflows",
          "example": "async-workflows",
          "source": "/examples/async-workflows.tsx"
        },
        {
          "slug": "feedback",
          "title": "Feedback and status",
          "example": "feedback",
          "source": "/examples/feedback.tsx"
        }
      ]
    },
    {
      "name": "Split",
      "entry": "@fayegram-ai/faye-ui/layout/layout",
      "guide": "/docs/layout/",
      "declaration": "packages/faye-ui/dist/layout/layout.d.ts",
      "signature": "({ ratio, collapseAt, ...props }: SplitProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "align",
          "optional": true,
          "type": "Responsive<\"center\" | \"start\" | \"end\" | \"stretch\" | \"baseline\"> | undefined",
          "description": ""
        },
        {
          "name": "collapseAt",
          "optional": true,
          "type": "\"sm\" | \"md\" | \"lg\" | undefined",
          "description": ""
        },
        {
          "name": "columnGap",
          "optional": true,
          "type": "Responsive<Space> | undefined",
          "description": "Overrides the horizontal gap independently of row spacing."
        },
        {
          "name": "gap",
          "optional": true,
          "type": "Responsive<Space> | undefined",
          "description": ""
        },
        {
          "name": "justify",
          "optional": true,
          "type": "Responsive<\"center\" | \"start\" | \"end\" | \"between\" | \"around\"> | undefined",
          "description": ""
        },
        {
          "name": "p",
          "optional": true,
          "type": "Responsive<Space> | undefined",
          "description": ""
        },
        {
          "name": "px",
          "optional": true,
          "type": "Responsive<Space> | undefined",
          "description": ""
        },
        {
          "name": "py",
          "optional": true,
          "type": "Responsive<Space> | undefined",
          "description": ""
        },
        {
          "name": "ratio",
          "optional": true,
          "type": "\"equal\" | \"sidebar-start\" | \"sidebar-end\" | undefined",
          "description": ""
        },
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLDivElement> | undefined",
          "description": ""
        },
        {
          "name": "rowGap",
          "optional": true,
          "type": "Responsive<Space> | undefined",
          "description": "Overrides the vertical gap, including between wrapped rows."
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-layout-layout/#split",
      "api": "/api/packages/layout/layout.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "layout",
          "title": "Layout primitives",
          "example": "layout",
          "source": "/examples/layout.tsx"
        }
      ]
    },
    {
      "name": "Stack",
      "entry": "@fayegram-ai/faye-ui/layout/layout",
      "guide": "/docs/layout/",
      "declaration": "packages/faye-ui/dist/layout/layout.d.ts",
      "signature": "(props: LayoutProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "align",
          "optional": true,
          "type": "Responsive<\"center\" | \"start\" | \"end\" | \"stretch\" | \"baseline\"> | undefined",
          "description": ""
        },
        {
          "name": "columnGap",
          "optional": true,
          "type": "Responsive<Space> | undefined",
          "description": "Overrides the horizontal gap independently of row spacing."
        },
        {
          "name": "gap",
          "optional": true,
          "type": "Responsive<Space> | undefined",
          "description": ""
        },
        {
          "name": "justify",
          "optional": true,
          "type": "Responsive<\"center\" | \"start\" | \"end\" | \"between\" | \"around\"> | undefined",
          "description": ""
        },
        {
          "name": "p",
          "optional": true,
          "type": "Responsive<Space> | undefined",
          "description": ""
        },
        {
          "name": "px",
          "optional": true,
          "type": "Responsive<Space> | undefined",
          "description": ""
        },
        {
          "name": "py",
          "optional": true,
          "type": "Responsive<Space> | undefined",
          "description": ""
        },
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLDivElement> | undefined",
          "description": ""
        },
        {
          "name": "rowGap",
          "optional": true,
          "type": "Responsive<Space> | undefined",
          "description": "Overrides the vertical gap, including between wrapped rows."
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-layout-layout/#stack",
      "api": "/api/packages/layout/layout.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "accessibility",
          "title": "Accessibility and input behavior",
          "example": "accessibility",
          "source": "/examples/accessibility.tsx"
        },
        {
          "slug": "advanced-fields",
          "title": "Advanced field compositions",
          "example": "advanced-fields",
          "source": "/examples/advanced-fields.tsx"
        },
        {
          "slug": "all-components",
          "title": "All components gallery",
          "example": "all-components",
          "source": "/examples/all-components.tsx"
        },
        {
          "slug": "patterns",
          "title": "Application patterns",
          "example": "patterns",
          "source": "/examples/patterns.tsx"
        },
        {
          "slug": "async-workflows",
          "title": "Asynchronous workflows",
          "example": "async-workflows",
          "source": "/examples/async-workflows.tsx"
        },
        {
          "slug": "buttons",
          "title": "Buttons and actions",
          "example": "buttons",
          "source": "/examples/buttons.tsx"
        },
        {
          "slug": "surface-compositions",
          "title": "Cards, media and composed dialogs",
          "example": "surface-compositions",
          "source": "/examples/surface-compositions.tsx"
        },
        {
          "slug": "selection",
          "title": "Checkboxes, radios and switches",
          "example": "selection",
          "source": "/examples/selection.tsx"
        },
        {
          "slug": "component-reference",
          "title": "Component reference",
          "example": "component-reference",
          "source": "/examples/component-reference.tsx"
        },
        {
          "slug": "functional-completion",
          "title": "Consumer interactions and navigation",
          "example": "functional-completion",
          "source": "/examples/functional-completion.tsx"
        },
        {
          "slug": "customization",
          "title": "Customization sheets",
          "example": "customization",
          "source": "/examples/customization.tsx"
        },
        {
          "slug": "dialogs",
          "title": "Dialogs, modal and drawers",
          "example": "dialogs",
          "source": "/examples/dialogs.tsx"
        },
        {
          "slug": "feedback",
          "title": "Feedback and status",
          "example": "feedback",
          "source": "/examples/feedback.tsx"
        },
        {
          "slug": "consumer-experience",
          "title": "Interactive consumer experience",
          "example": "consumer-experience",
          "source": "/examples/consumer-experience.tsx"
        },
        {
          "slug": "layout",
          "title": "Layout primitives",
          "example": "layout",
          "source": "/examples/layout.tsx"
        },
        {
          "slug": "interaction-compositions",
          "title": "Motion and interactive navigation",
          "example": "interaction-compositions",
          "source": "/examples/interaction-compositions.tsx"
        },
        {
          "slug": "numeric",
          "title": "Numeric and specialized input",
          "example": "numeric",
          "source": "/examples/numeric.tsx"
        },
        {
          "slug": "floating",
          "title": "Portals and floating content",
          "example": "floating",
          "source": "/examples/floating.tsx"
        },
        {
          "slug": "pickers",
          "title": "Select and autocomplete",
          "example": "pickers",
          "source": "/examples/pickers.tsx"
        },
        {
          "slug": "fields",
          "title": "Text fields and forms",
          "example": "fields",
          "source": "/examples/fields.tsx"
        },
        {
          "slug": "theming",
          "title": "Theme and color system",
          "example": "theming",
          "source": "/examples/theming.tsx"
        },
        {
          "slug": "foundations",
          "title": "Typography and surfaces",
          "example": "foundations",
          "source": "/examples/foundations.tsx"
        }
      ]
    },
    {
      "name": "Stepper",
      "entry": "@fayegram-ai/faye-ui/navigation/stepper",
      "guide": "/docs/navigation/",
      "declaration": "packages/faye-ui/dist/navigation/stepper.d.ts",
      "signature": "({ steps, label, activeStep, orientation, nonLinear, onStepChange, optionalLabel, errorLabel, profile, className, ...props }: StepperProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "activeStep",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "errorLabel",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "label",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "nonLinear",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "onStepChange",
          "optional": true,
          "type": "((key: string, index: number) => void) | undefined",
          "description": ""
        },
        {
          "name": "optionalLabel",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "orientation",
          "optional": true,
          "type": "\"horizontal\" | \"vertical\" | undefined",
          "description": ""
        },
        {
          "name": "profile",
          "optional": true,
          "type": "ComponentProfile | undefined",
          "description": ""
        },
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLOListElement> | undefined",
          "description": ""
        },
        {
          "name": "steps",
          "optional": false,
          "type": "readonly Step[]",
          "description": ""
        }
      ],
      "parts": [],
      "description": "Application-owned progress/navigation. Static when onStepChange is omitted.",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-navigation-stepper/#stepper",
      "api": "/api/packages/navigation/stepper.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "interaction-compositions",
          "title": "Motion and interactive navigation",
          "example": "interaction-compositions",
          "source": "/examples/interaction-compositions.tsx"
        },
        {
          "slug": "navigation",
          "title": "Navigation and disclosure",
          "example": "navigation",
          "source": "/examples/navigation.tsx"
        }
      ]
    },
    {
      "name": "StyleResources",
      "entry": "@fayegram-ai/faye-ui/integrations/react",
      "guide": "/docs/server-rendering/",
      "declaration": "packages/faye-ui/dist/integrations/react.d.ts",
      "signature": "({ hrefs, nonce }: { hrefs: readonly string[]; nonce?: string; }): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "hrefs",
          "optional": false,
          "type": "readonly string[]",
          "description": ""
        },
        {
          "name": "nonce",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "React 19 stylesheet resources; keep precedence names stable across streamed boundaries.",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-integrations-react/#styleresources",
      "api": "/api/packages/integrations/react.json",
      "clientBoundary": false,
      "pages": []
    },
    {
      "name": "Surface",
      "entry": "@fayegram-ai/faye-ui/core/surface",
      "guide": "/docs/foundations/",
      "declaration": "packages/faye-ui/dist/core/surface.d.ts",
      "signature": "({ variant, padding, profile, className, ...props }: SurfaceProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "padding",
          "optional": true,
          "type": "VisualVariant<\"surface\", \"padding\"> | undefined",
          "description": ""
        },
        {
          "name": "profile",
          "optional": true,
          "type": "ComponentProfile | undefined",
          "description": ""
        },
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLDivElement> | undefined",
          "description": ""
        },
        {
          "name": "variant",
          "optional": true,
          "type": "VisualVariant<\"surface\", \"variant\"> | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-core-surface/#surface",
      "api": "/api/packages/core/surface.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "surface-compositions",
          "title": "Cards, media and composed dialogs",
          "example": "surface-compositions",
          "source": "/examples/surface-compositions.tsx"
        },
        {
          "slug": "interaction-compositions",
          "title": "Motion and interactive navigation",
          "example": "interaction-compositions",
          "source": "/examples/interaction-compositions.tsx"
        },
        {
          "slug": "foundations",
          "title": "Typography and surfaces",
          "example": "foundations",
          "source": "/examples/foundations.tsx"
        }
      ]
    },
    {
      "name": "SwipeDrawer",
      "entry": "@fayegram-ai/faye-ui/overlays/swipe-drawer",
      "guide": "/docs/dialogs/",
      "declaration": "packages/faye-ui/dist/overlays/swipe-drawer.d.ts",
      "signature": null,
      "props": [],
      "parts": [
        {
          "name": "Root",
          "props": [
            {
              "name": "actionsRef",
              "optional": true,
              "type": "React.RefObject<DrawerRootActions | null> | undefined",
              "description": "A ref to imperative actions.\n- `unmount`: Manually unmounts the drawer.\nCall this after any externally controlled closing animation finishes.\n- `close`: Closes the drawer imperatively when called."
            },
            {
              "name": "children",
              "optional": true,
              "type": "React.ReactNode | PayloadChildRenderFunction<Payload>",
              "description": "The content of the drawer."
            },
            {
              "name": "defaultOpen",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the drawer is initially open.\n\nTo render a controlled drawer, use the `open` prop instead."
            },
            {
              "name": "defaultSnapPoint",
              "optional": true,
              "type": "DrawerSnapPoint | null | undefined",
              "description": "The initial snap point value when uncontrolled."
            },
            {
              "name": "defaultTriggerId",
              "optional": true,
              "type": "string | null | undefined",
              "description": "ID of the trigger that the drawer is associated with.\nThis is useful in conjunction with the `defaultOpen` prop to create an initially open drawer."
            },
            {
              "name": "disablePointerDismissal",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to prevent the drawer from closing on outside presses.\nFor non-modal drawers, this also prevents the drawer from closing when focus moves outside of it."
            },
            {
              "name": "handle",
              "optional": true,
              "type": "DrawerHandle<Payload> | undefined",
              "description": "A handle to associate the drawer with a trigger.\nIf specified, allows detached triggers to control the drawer's open state.\nCan be created with the Drawer.createHandle() method."
            },
            {
              "name": "modal",
              "optional": true,
              "type": "boolean | \"trap-focus\" | undefined",
              "description": "Determines if the drawer enters a modal state when open.\n- `true`: user interaction is limited to just the drawer: focus is trapped, document page scroll is locked, and pointer interactions on outside elements are disabled.\n- `false`: user interaction with the rest of the document is allowed.\n- `'trap-focus'`: focus is trapped inside the drawer, but document page scroll is not locked and pointer interactions outside of it remain enabled."
            },
            {
              "name": "onOpenChange",
              "optional": true,
              "type": "((open: boolean, eventDetails: DrawerRoot.ChangeEventDetails) => void) | undefined",
              "description": "Event handler called when the drawer is opened or closed."
            },
            {
              "name": "onOpenChangeComplete",
              "optional": true,
              "type": "((open: boolean) => void) | undefined",
              "description": "Event handler called after any animations complete when the drawer is opened or closed."
            },
            {
              "name": "onSnapPointChange",
              "optional": true,
              "type": "((snapPoint: DrawerSnapPoint | null, eventDetails: DrawerRoot.SnapPointChangeEventDetails) => void) | undefined",
              "description": "Callback fired when the snap point changes."
            },
            {
              "name": "open",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the drawer is currently open."
            },
            {
              "name": "snapPoint",
              "optional": true,
              "type": "DrawerSnapPoint | null | undefined",
              "description": "The currently active snap point. Use with `onSnapPointChange` to control the snap point."
            },
            {
              "name": "snapPoints",
              "optional": true,
              "type": "DrawerSnapPoint[] | undefined",
              "description": "Snap points used to position the drawer.\nUse numbers between 0 and 1 to represent fractions of the viewport height,\nnumbers greater than 1 as pixel values, or strings in `px`/`rem` units\n(for example, `'148px'` or `'30rem'`)."
            },
            {
              "name": "snapToSequentialPoints",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Disables velocity-based snap skipping so drag distance determines the next snap point."
            },
            {
              "name": "swipeDirection",
              "optional": true,
              "type": "SwipeDirection | undefined",
              "description": "The swipe direction used to dismiss the drawer."
            },
            {
              "name": "triggerId",
              "optional": true,
              "type": "string | null | undefined",
              "description": "ID of the trigger that the drawer is associated with.\nThis is useful in conjunction with the `open` prop to create a controlled drawer.\nThere's no need to specify this prop when the drawer is uncontrolled (that is, when the `open` prop is not set)."
            }
          ]
        },
        {
          "name": "Provider",
          "props": [
            {
              "name": "children",
              "optional": true,
              "type": "React.ReactNode",
              "description": ""
            }
          ]
        },
        {
          "name": "VirtualKeyboardProvider",
          "props": [
            {
              "name": "children",
              "optional": true,
              "type": "React.ReactNode",
              "description": ""
            }
          ]
        },
        {
          "name": "Portal",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: DrawerPortalState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "container",
              "optional": true,
              "type": "HTMLElement | ShadowRoot | RefObject<HTMLElement | ShadowRoot | null> | null | undefined",
              "description": "A parent element to render the portal element into."
            },
            {
              "name": "keepMounted",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to keep the portal mounted in the DOM while the popup is hidden."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, DrawerPortalState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: DrawerPortalState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            }
          ]
        },
        {
          "name": "Trigger",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: DrawerTriggerState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "handle",
              "optional": true,
              "type": "Base.Handle<unknown> | undefined",
              "description": "A handle to associate the trigger with a drawer.\nCan be created with the Drawer.createHandle() method."
            },
            {
              "name": "id",
              "optional": true,
              "type": "string | undefined",
              "description": "ID of the trigger. In addition to being forwarded to the rendered element,\nit is also used to specify the active trigger for drawers in controlled mode (with the Drawer.Root `triggerId` prop)."
            },
            {
              "name": "nativeButton",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component renders a native `<button>` element when replacing it\nvia the `render` prop.\nSet to `false` if the rendered element is not a button (for example, `<div>`)."
            },
            {
              "name": "payload",
              "optional": true,
              "type": "unknown",
              "description": "A payload to pass to the drawer when it is opened."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, DrawerTriggerState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: DrawerTriggerState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{} | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "SwipeArea",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: DrawerSwipeAreaState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "disabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the swipe area is disabled."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, DrawerSwipeAreaState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: DrawerSwipeAreaState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "swipeDirection",
              "optional": true,
              "type": "SwipeDirection | undefined",
              "description": "The swipe direction that opens the drawer.\nDefaults to the opposite of `Drawer.Root` `swipeDirection`."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{} | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Backdrop",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: DrawerBackdropState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "forceRender",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the backdrop is forced to render even when nested."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, DrawerBackdropState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: DrawerBackdropState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{} | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Viewport",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: DrawerViewportState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, DrawerViewportState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: DrawerViewportState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{} | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Popup",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: DrawerPopupState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "finalFocus",
              "optional": true,
              "type": "boolean | RefObject<HTMLElement | null> | ((closeType: InteractionType) => boolean | HTMLElement | null | void) | undefined",
              "description": "Determines the element to focus when the drawer is closed.\n\n- `false`: Do not move focus.\n- `true`: Move focus based on the default behavior (trigger or previously focused element).\n- `RefObject`: Move focus to the ref element.\n- `function`: Called with the interaction type (`mouse`, `touch`, `pen`, or `keyboard`).\n  Return an element to focus, `true` to use the default behavior, or `false`/`undefined` to do nothing."
            },
            {
              "name": "initialFocus",
              "optional": true,
              "type": "boolean | RefObject<HTMLElement | null> | ((openType: InteractionType) => boolean | HTMLElement | null | void) | undefined",
              "description": "Determines the element to focus when the drawer is opened.\n\n- `false`: Do not move focus.\n- `true`: Move focus based on the default behavior (first tabbable element or popup).\n- `RefObject`: Move focus to the ref element.\n- `function`: Called with the interaction type (`mouse`, `touch`, `pen`, or `keyboard`).\n  Return an element to focus, `true` to use the default behavior, or `false`/`undefined` to do nothing."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, DrawerPopupState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: DrawerPopupState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{} | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Content",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: DrawerContentState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, DrawerContentState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: DrawerContentState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{} | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Header",
          "props": [
            {
              "name": "variants",
              "optional": true,
              "type": "{} | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Title",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: DrawerTitleState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, DrawerTitleState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: DrawerTitleState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{} | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Description",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: DrawerDescriptionState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, DrawerDescriptionState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: DrawerDescriptionState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{} | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Close",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: DrawerCloseState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "nativeButton",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component renders a native `<button>` element when replacing it\nvia the `render` prop.\nSet to `false` if the rendered element is not a button (for example, `<div>`)."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, DrawerCloseState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: DrawerCloseState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{} | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Indent",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: DrawerIndentState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, DrawerIndentState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: DrawerIndentState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{} | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "IndentBackground",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: DrawerIndentBackgroundState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, DrawerIndentBackgroundState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: DrawerIndentBackgroundState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{} | undefined",
              "description": ""
            }
          ]
        }
      ],
      "description": "Gesture/snap-point drawer. Physical swipeDirection and positioning agree; no second gesture or focus engine.",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-overlays-swipe-drawer/#swipedrawer",
      "api": "/api/packages/overlays/swipe-drawer.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "dialogs",
          "title": "Dialogs, modal and drawers",
          "example": "dialogs",
          "source": "/examples/dialogs.tsx"
        }
      ]
    },
    {
      "name": "Switch",
      "entry": "@fayegram-ai/faye-ui/controls/switch",
      "guide": "/docs/selection/",
      "declaration": "packages/faye-ui/dist/controls/switch.d.ts",
      "signature": null,
      "props": [],
      "parts": [
        {
          "name": "Root",
          "props": [
            {
              "name": "checked",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the switch is currently active.\n\nTo render an uncontrolled switch, use the `defaultChecked` prop instead."
            },
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: SwitchRootState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "defaultChecked",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the switch is initially active.\n\nTo render a controlled switch, use the `checked` prop instead."
            },
            {
              "name": "disabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component should ignore user interaction."
            },
            {
              "name": "form",
              "optional": true,
              "type": "string | undefined",
              "description": "Identifies the form that owns the hidden input.\nUseful when the switch is rendered outside the form."
            },
            {
              "name": "id",
              "optional": true,
              "type": "string | undefined",
              "description": "The id of the hidden input element.\n\nWhen `nativeButton` is `true`, the id is applied to the root element."
            },
            {
              "name": "inputRef",
              "optional": true,
              "type": "Ref<HTMLInputElement> | undefined",
              "description": "A ref to access the hidden `<input>` element."
            },
            {
              "name": "name",
              "optional": true,
              "type": "string | undefined",
              "description": "Identifies the field when a form is submitted."
            },
            {
              "name": "nativeButton",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component renders a native `<button>` element when replacing it\nvia the `render` prop.\nSet to `true` if the rendered element is a native button."
            },
            {
              "name": "onCheckedChange",
              "optional": true,
              "type": "((checked: boolean, eventDetails: SwitchRoot.ChangeEventDetails) => void) | undefined",
              "description": "Event handler called when the switch is activated or deactivated."
            },
            {
              "name": "readOnly",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the user should be unable to activate or deactivate the switch."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, SwitchRootState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "required",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the user must activate the switch before submitting a form."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: SwitchRootState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "uncheckedValue",
              "optional": true,
              "type": "string | undefined",
              "description": "The value submitted with the form when the switch is off.\nBy default, unchecked switches do not submit any value, matching native checkbox behavior."
            },
            {
              "name": "value",
              "optional": true,
              "type": "string | undefined",
              "description": "The value submitted with the form when the switch is on.\nBy default, switch submits the \"on\" value, matching native checkbox behavior."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"switch\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"switch\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Thumb",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: SwitchThumbState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, SwitchThumbState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: SwitchThumbState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"switch\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"switch\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        }
      ],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-controls-switch/#switch",
      "api": "/api/packages/controls/switch.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "selection",
          "title": "Checkboxes, radios and switches",
          "example": "selection",
          "source": "/examples/selection.tsx"
        }
      ]
    },
    {
      "name": "Table",
      "entry": "@fayegram-ai/faye-ui/display/table",
      "guide": "/docs/display/",
      "declaration": "packages/faye-ui/dist/display/table.d.ts",
      "signature": null,
      "props": [],
      "parts": [
        {
          "name": "Root",
          "props": []
        },
        {
          "name": "Container",
          "props": [
            {
              "name": "scrollChaining",
              "optional": true,
              "type": "\"auto\" | \"contain\" | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Head",
          "props": []
        },
        {
          "name": "Body",
          "props": []
        },
        {
          "name": "Footer",
          "props": []
        },
        {
          "name": "Row",
          "props": []
        },
        {
          "name": "Header",
          "props": []
        },
        {
          "name": "Cell",
          "props": []
        },
        {
          "name": "Caption",
          "props": []
        }
      ],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-display-table/#table",
      "api": "/api/packages/display/table.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "display",
          "title": "Tables, lists and display",
          "example": "display",
          "source": "/examples/display.tsx"
        }
      ]
    },
    {
      "name": "TablePagination",
      "entry": "@fayegram-ai/faye-ui/display/table-controls",
      "guide": "/docs/display/",
      "declaration": "packages/faye-ui/dist/display/table-controls.d.ts",
      "signature": "(input: TablePaginationProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "allLabel",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "count",
          "optional": false,
          "type": "number",
          "description": ""
        },
        {
          "name": "formatRange",
          "optional": true,
          "type": "((from: number, to: number, count: number) => string) | undefined",
          "description": ""
        },
        {
          "name": "label",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "nextLabel",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "onPageChange",
          "optional": false,
          "type": "(page: number) => void",
          "description": ""
        },
        {
          "name": "onPageSizeChange",
          "optional": false,
          "type": "(size: number) => void",
          "description": ""
        },
        {
          "name": "page",
          "optional": false,
          "type": "number",
          "description": ""
        },
        {
          "name": "pageSize",
          "optional": false,
          "type": "number",
          "description": ""
        },
        {
          "name": "pageSizeLabel",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "pageSizes",
          "optional": true,
          "type": "readonly number[] | undefined",
          "description": ""
        },
        {
          "name": "previousLabel",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "Zero-based page state; count=-1 means unknown total. No fetching or data-engine dependency.",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-display-table-controls/#tablepagination",
      "api": "/api/packages/display/table-controls.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "display",
          "title": "Tables, lists and display",
          "example": "display",
          "source": "/examples/display.tsx"
        }
      ]
    },
    {
      "name": "TableSortLabel",
      "entry": "@fayegram-ai/faye-ui/display/table-controls",
      "guide": "/docs/display/",
      "declaration": "packages/faye-ui/dist/display/table-controls.d.ts",
      "signature": "(input: TableSortLabelProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "active",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "direction",
          "optional": true,
          "type": "\"ascending\" | \"descending\" | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "Set aria-sort on the containing th. The label itself remains a native button.",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-display-table-controls/#tablesortlabel",
      "api": "/api/packages/display/table-controls.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "display",
          "title": "Tables, lists and display",
          "example": "display",
          "source": "/examples/display.tsx"
        }
      ]
    },
    {
      "name": "Tabs",
      "entry": "@fayegram-ai/faye-ui/navigation/tabs",
      "guide": "/docs/navigation/",
      "declaration": "packages/faye-ui/dist/navigation/tabs.d.ts",
      "signature": null,
      "props": [],
      "parts": [
        {
          "name": "Root",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: TabsRootState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "defaultValue",
              "optional": true,
              "type": "any",
              "description": "The default value. Use when the component is not controlled.\nWhen the value is `null`, no Tab will be active."
            },
            {
              "name": "onValueChange",
              "optional": true,
              "type": "((value: TabsTab.Value, eventDetails: TabsRoot.ChangeEventDetails) => void) | undefined",
              "description": "Callback invoked when new value is being set.\n\nThe event `reason` is `'none'` for user-initiated changes, such as a click\nor keyboard navigation; `'initial'` for the first automatic selection or\nfallback in uncontrolled roots when `defaultValue` is omitted or\n`undefined`, including when the implicit initial value is disabled or\nmissing; `'disabled'` for automatic fallback when the selected tab becomes\ndisabled in uncontrolled roots; or `'missing'` for automatic fallback when\nthe selected tab is removed, or when an explicit `defaultValue` never\nmatches a mounted tab in uncontrolled roots.\n\nFor automatic changes, the selected value can be `null` when no enabled Tab\nis available as a fallback.\n\nAutomatic changes cannot be canceled; calling `eventDetails.cancel()` for\n`'initial'`, `'disabled'`, or `'missing'` has no effect."
            },
            {
              "name": "orientation",
              "optional": true,
              "type": "Orientation | undefined",
              "description": "The component orientation (layout flow direction)."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, TabsRootState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: TabsRootState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "value",
              "optional": true,
              "type": "any",
              "description": "The value of the currently active `Tab`. Use when the component is controlled.\nWhen the value is `null`, no Tab will be active."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"tabs\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"tabs\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "List",
          "props": [
            {
              "name": "activateOnFocus",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to automatically change the active tab on arrow key focus.\nOtherwise, tabs will be activated using <kbd>Enter</kbd> or <kbd>Space</kbd> key press."
            },
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: TabsListState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "loopFocus",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to loop keyboard focus back to the first item\nwhen the end of the list is reached while using the arrow keys."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, TabsListState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: TabsListState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"tabs\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"tabs\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "ScrollableList",
          "props": [
            {
              "name": "activateOnFocus",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to automatically change the active tab on arrow key focus.\nOtherwise, tabs will be activated using <kbd>Enter</kbd> or <kbd>Space</kbd> key press."
            },
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: TabsListState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "containerClassName",
              "optional": true,
              "type": "string | undefined",
              "description": ""
            },
            {
              "name": "loopFocus",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to loop keyboard focus back to the first item\nwhen the end of the list is reached while using the arrow keys."
            },
            {
              "name": "nextLabel",
              "optional": true,
              "type": "string | undefined",
              "description": ""
            },
            {
              "name": "previousLabel",
              "optional": true,
              "type": "string | undefined",
              "description": ""
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, TabsListState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: TabsListState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"tabs\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"tabs\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Tab",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: TabsTabState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "disabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the Tab is disabled.\n\nIf a first Tab on a `<Tabs.List>` is disabled, it won't initially be selected.\nInstead, the next enabled Tab will be selected.\nHowever, it does not work like this during server-side rendering, as it is not known\nduring pre-rendering which Tabs are disabled.\nTo work around it, ensure that `defaultValue` or `value` on `<Tabs.Root>` is set to an enabled Tab's value."
            },
            {
              "name": "nativeButton",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component renders a native `<button>` element when replacing it\nvia the `render` prop.\nSet to `false` if the rendered element is not a button (for example, `<div>`)."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, TabsTabState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: TabsTabState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "value",
              "optional": false,
              "type": "any",
              "description": "The value of the Tab."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"tabs\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"tabs\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Panel",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: TabsPanelState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "keepMounted",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to keep the HTML element in the DOM while the panel is hidden."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, TabsPanelState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: TabsPanelState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "value",
              "optional": false,
              "type": "any",
              "description": "The value of the TabPanel. It will be shown when the Tab with the corresponding value is active."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"tabs\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"tabs\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Indicator",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: TabsIndicatorState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, TabsIndicatorState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "renderBeforeHydration",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to render itself before React hydrates.\nThis minimizes the time that the indicator isn't visible after server-side rendering."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: TabsIndicatorState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"tabs\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"tabs\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        }
      ],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-navigation-tabs/#tabs",
      "api": "/api/packages/navigation/tabs.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "interaction-compositions",
          "title": "Motion and interactive navigation",
          "example": "interaction-compositions",
          "source": "/examples/interaction-compositions.tsx"
        },
        {
          "slug": "navigation",
          "title": "Navigation and disclosure",
          "example": "navigation",
          "source": "/examples/navigation.tsx"
        }
      ]
    },
    {
      "name": "Text",
      "entry": "@fayegram-ai/faye-ui/core/text",
      "guide": "/docs/foundations/",
      "declaration": "packages/faye-ui/dist/core/text.d.ts",
      "signature": "({ as, size, tone, weight, variant, profile, truncate, balance, className, ...props }: TextProps): import(\"react\").DetailedReactHTMLElement<{ className: string; \"data-variant\": string; \"data-size\": string | undefined; \"data-tone\": string; \"data-weight\": string | undefined; \"data-truncate\": true | undefined; \"data-balance\": true | undefined; ref?: Ref<HTMLElement>; defaultChecked?: boolean | undefined; defaultValue?: string | number | readonly string[] | undefined; suppressContentEditableWarning?: boolean | undefined; suppressHydrationWarning?: boolean | undefined; accessKey?: string | undefined; autoCapitalize?: \"off\" | \"none\" | \"on\" | \"sentences\" | \"words\" | \"characters\" | undefined | (string & {}); autoFocus?: boolean | undefined; contentEditable?: (boolean | \"true\" | \"false\") | \"inherit\" | \"plaintext-only\" | undefined; contextMenu?: string | undefined; dir?: string | undefined; draggable?: (boolean | \"true\" | \"false\") | undefined; enterKeyHint?: \"enter\" | \"done\" | \"go\" | \"next\" | \"previous\" | \"search\" | \"send\" | undefined; hidden?: boolean | undefined; id?: string | undefined; lang?: string | undefined; nonce?: string | undefined; slot?: string | undefined; spellCheck?: (boolean | \"true\" | \"false\") | undefined; style?: import(\"react\").CSSProperties | undefined; tabIndex?: number | undefined; title?: string | undefined; translate?: \"yes\" | \"no\" | undefined; radioGroup?: string | undefined; role?: import(\"react\").AriaRole | undefined; about?: string | undefined; content?: string | undefined; datatype?: string | undefined; inlist?: any; prefix?: string | undefined; property?: string | undefined; rel?: string | undefined; resource?: string | undefined; rev?: string | undefined; typeof?: string | undefined; vocab?: string | undefined; autoCorrect?: string | undefined; autoSave?: string | undefined; color?: string | undefined; itemProp?: string | undefined; itemScope?: boolean | undefined; itemType?: string | undefined; itemID?: string | undefined; itemRef?: string | undefined; results?: number | undefined; security?: string | undefined; unselectable?: \"on\" | \"off\" | undefined; popover?: \"\" | \"auto\" | \"manual\" | \"hint\" | undefined; popoverTargetAction?: \"toggle\" | \"show\" | \"hide\" | undefined; popoverTarget?: string | undefined; inert?: boolean | undefined; inputMode?: \"none\" | \"text\" | \"tel\" | \"url\" | \"email\" | \"numeric\" | \"decimal\" | \"search\" | undefined; is?: string | undefined; exportparts?: string | undefined; part?: string | undefined; \"aria-activedescendant\"?: string | undefined; \"aria-atomic\"?: (boolean | \"true\" | \"false\") | undefined; \"aria-autocomplete\"?: \"none\" | \"inline\" | \"list\" | \"both\" | undefined; \"aria-braillelabel\"?: string | undefined; \"aria-brailleroledescription\"?: string | undefined; \"aria-busy\"?: (boolean | \"true\" | \"false\") | undefined; \"aria-checked\"?: boolean | \"false\" | \"mixed\" | \"true\" | undefined; \"aria-colcount\"?: number | undefined; \"aria-colindex\"?: number | undefined; \"aria-colindextext\"?: string | undefined; \"aria-colspan\"?: number | undefined; \"aria-controls\"?: string | undefined; \"aria-current\"?: boolean | \"false\" | \"true\" | \"page\" | \"step\" | \"location\" | \"date\" | \"time\" | undefined; \"aria-describedby\"?: string | undefined; \"aria-description\"?: string | undefined; \"aria-details\"?: string | undefined; \"aria-disabled\"?: (boolean | \"true\" | \"false\") | undefined; \"aria-dropeffect\"?: \"none\" | \"copy\" | \"execute\" | \"link\" | \"move\" | \"popup\" | undefined; \"aria-errormessage\"?: string | undefined; \"aria-expanded\"?: (boolean | \"true\" | \"false\") | undefined; \"aria-flowto\"?: string | undefined; \"aria-grabbed\"?: (boolean | \"true\" | \"false\") | undefined; \"aria-haspopup\"?: boolean | \"false\" | \"true\" | \"menu\" | \"listbox\" | \"tree\" | \"grid\" | \"dialog\" | undefined; \"aria-hidden\"?: (boolean | \"true\" | \"false\") | undefined; \"aria-invalid\"?: boolean | \"false\" | \"true\" | \"grammar\" | \"spelling\" | undefined; \"aria-keyshortcuts\"?: string | undefined; \"aria-label\"?: string | undefined; \"aria-labelledby\"?: string | undefined; \"aria-level\"?: number | undefined; \"aria-live\"?: \"off\" | \"assertive\" | \"polite\" | undefined; \"aria-modal\"?: (boolean | \"true\" | \"false\") | undefined; \"aria-multiline\"?: (boolean | \"true\" | \"false\") | undefined; \"aria-multiselectable\"?: (boolean | \"true\" | \"false\") | undefined; \"aria-orientation\"?: \"horizontal\" | \"vertical\" | undefined; \"aria-owns\"?: string | undefined; \"aria-placeholder\"?: string | undefined; \"aria-posinset\"?: number | undefined; \"aria-pressed\"?: boolean | \"false\" | \"mixed\" | \"true\" | undefined; \"aria-readonly\"?: (boolean | \"true\" | \"false\") | undefined; \"aria-relevant\"?: \"additions\" | \"additions removals\" | \"additions text\" | \"all\" | \"removals\" | \"removals additions\" | \"removals text\" | \"text\" | \"text additions\" | \"text removals\" | undefined; \"aria-required\"?: (boolean | \"true\" | \"false\") | undefined; \"aria-roledescription\"?: string | undefined; \"aria-rowcount\"?: number | undefined; \"aria-rowindex\"?: number | undefined; \"aria-rowindextext\"?: string | undefined; \"aria-rowspan\"?: number | undefined; \"aria-selected\"?: (boolean | \"true\" | \"false\") | undefined; \"aria-setsize\"?: number | undefined; \"aria-sort\"?: \"none\" | \"ascending\" | \"descending\" | \"other\" | undefined; \"aria-valuemax\"?: number | undefined; \"aria-valuemin\"?: number | undefined; \"aria-valuenow\"?: number | undefined; \"aria-valuetext\"?: string | undefined; children?: import(\"react\").ReactNode | undefined; dangerouslySetInnerHTML?: { __html: string | TrustedHTML; } | undefined; onCopy?: import(\"react\").ClipboardEventHandler<HTMLElement> | undefined; onCopyCapture?: import(\"react\").ClipboardEventHandler<HTMLElement> | undefined; onCut?: import(\"react\").ClipboardEventHandler<HTMLElement> | undefined; onCutCapture?: import(\"react\").ClipboardEventHandler<HTMLElement> | undefined; onPaste?: import(\"react\").ClipboardEventHandler<HTMLElement> | undefined; onPasteCapture?: import(\"react\").ClipboardEventHandler<HTMLElement> | undefined; onCompositionEnd?: import(\"react\").CompositionEventHandler<HTMLElement> | undefined; onCompositionEndCapture?: import(\"react\").CompositionEventHandler<HTMLElement> | undefined; onCompositionStart?: import(\"react\").CompositionEventHandler<HTMLElement> | undefined; onCompositionStartCapture?: import(\"react\").CompositionEventHandler<HTMLElement> | undefined; onCompositionUpdate?: import(\"react\").CompositionEventHandler<HTMLElement> | undefined; onCompositionUpdateCapture?: import(\"react\").CompositionEventHandler<HTMLElement> | undefined; onFocus?: import(\"react\").FocusEventHandler<HTMLElement> | undefined; onFocusCapture?: import(\"react\").FocusEventHandler<HTMLElement> | undefined; onBlur?: import(\"react\").FocusEventHandler<HTMLElement> | undefined; onBlurCapture?: import(\"react\").FocusEventHandler<HTMLElement> | undefined; onChange?: import(\"react\").ChangeEventHandler<HTMLElement, Element> | undefined; onChangeCapture?: import(\"react\").ChangeEventHandler<HTMLElement, Element> | undefined; onBeforeInput?: import(\"react\").InputEventHandler<HTMLElement> | undefined; onBeforeInputCapture?: import(\"react\").InputEventHandler<HTMLElement> | undefined; onInput?: import(\"react\").InputEventHandler<HTMLElement> | undefined; onInputCapture?: import(\"react\").InputEventHandler<HTMLElement> | undefined; onReset?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onResetCapture?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onSubmit?: import(\"react\").SubmitEventHandler<HTMLElement> | undefined; onSubmitCapture?: import(\"react\").SubmitEventHandler<HTMLElement> | undefined; onInvalid?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onInvalidCapture?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onLoad?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onLoadCapture?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onError?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onErrorCapture?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onKeyDown?: import(\"react\").KeyboardEventHandler<HTMLElement> | undefined; onKeyDownCapture?: import(\"react\").KeyboardEventHandler<HTMLElement> | undefined; onKeyPress?: import(\"react\").KeyboardEventHandler<HTMLElement> | undefined; onKeyPressCapture?: import(\"react\").KeyboardEventHandler<HTMLElement> | undefined; onKeyUp?: import(\"react\").KeyboardEventHandler<HTMLElement> | undefined; onKeyUpCapture?: import(\"react\").KeyboardEventHandler<HTMLElement> | undefined; onAbort?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onAbortCapture?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onCanPlay?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onCanPlayCapture?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onCanPlayThrough?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onCanPlayThroughCapture?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onDurationChange?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onDurationChangeCapture?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onEmptied?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onEmptiedCapture?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onEncrypted?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onEncryptedCapture?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onEnded?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onEndedCapture?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onLoadedData?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onLoadedDataCapture?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onLoadedMetadata?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onLoadedMetadataCapture?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onLoadStart?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onLoadStartCapture?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onPause?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onPauseCapture?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onPlay?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onPlayCapture?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onPlaying?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onPlayingCapture?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onProgress?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onProgressCapture?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onRateChange?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onRateChangeCapture?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onSeeked?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onSeekedCapture?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onSeeking?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onSeekingCapture?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onStalled?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onStalledCapture?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onSuspend?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onSuspendCapture?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onTimeUpdate?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onTimeUpdateCapture?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onVolumeChange?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onVolumeChangeCapture?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onWaiting?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onWaitingCapture?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onAuxClick?: import(\"react\").MouseEventHandler<HTMLElement> | undefined; onAuxClickCapture?: import(\"react\").MouseEventHandler<HTMLElement> | undefined; onClick?: import(\"react\").MouseEventHandler<HTMLElement> | undefined; onClickCapture?: import(\"react\").MouseEventHandler<HTMLElement> | undefined; onContextMenu?: import(\"react\").MouseEventHandler<HTMLElement> | undefined; onContextMenuCapture?: import(\"react\").MouseEventHandler<HTMLElement> | undefined; onDoubleClick?: import(\"react\").MouseEventHandler<HTMLElement> | undefined; onDoubleClickCapture?: import(\"react\").MouseEventHandler<HTMLElement> | undefined; onDrag?: import(\"react\").DragEventHandler<HTMLElement> | undefined; onDragCapture?: import(\"react\").DragEventHandler<HTMLElement> | undefined; onDragEnd?: import(\"react\").DragEventHandler<HTMLElement> | undefined; onDragEndCapture?: import(\"react\").DragEventHandler<HTMLElement> | undefined; onDragEnter?: import(\"react\").DragEventHandler<HTMLElement> | undefined; onDragEnterCapture?: import(\"react\").DragEventHandler<HTMLElement> | undefined; onDragExit?: import(\"react\").DragEventHandler<HTMLElement> | undefined; onDragExitCapture?: import(\"react\").DragEventHandler<HTMLElement> | undefined; onDragLeave?: import(\"react\").DragEventHandler<HTMLElement> | undefined; onDragLeaveCapture?: import(\"react\").DragEventHandler<HTMLElement> | undefined; onDragOver?: import(\"react\").DragEventHandler<HTMLElement> | undefined; onDragOverCapture?: import(\"react\").DragEventHandler<HTMLElement> | undefined; onDragStart?: import(\"react\").DragEventHandler<HTMLElement> | undefined; onDragStartCapture?: import(\"react\").DragEventHandler<HTMLElement> | undefined; onDrop?: import(\"react\").DragEventHandler<HTMLElement> | undefined; onDropCapture?: import(\"react\").DragEventHandler<HTMLElement> | undefined; onMouseDown?: import(\"react\").MouseEventHandler<HTMLElement> | undefined; onMouseDownCapture?: import(\"react\").MouseEventHandler<HTMLElement> | undefined; onMouseEnter?: import(\"react\").MouseEventHandler<HTMLElement> | undefined; onMouseLeave?: import(\"react\").MouseEventHandler<HTMLElement> | undefined; onMouseMove?: import(\"react\").MouseEventHandler<HTMLElement> | undefined; onMouseMoveCapture?: import(\"react\").MouseEventHandler<HTMLElement> | undefined; onMouseOut?: import(\"react\").MouseEventHandler<HTMLElement> | undefined; onMouseOutCapture?: import(\"react\").MouseEventHandler<HTMLElement> | undefined; onMouseOver?: import(\"react\").MouseEventHandler<HTMLElement> | undefined; onMouseOverCapture?: import(\"react\").MouseEventHandler<HTMLElement> | undefined; onMouseUp?: import(\"react\").MouseEventHandler<HTMLElement> | undefined; onMouseUpCapture?: import(\"react\").MouseEventHandler<HTMLElement> | undefined; onSelect?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onSelectCapture?: import(\"react\").ReactEventHandler<HTMLElement> | undefined; onTouchCancel?: import(\"react\").TouchEventHandler<HTMLElement> | undefined; onTouchCancelCapture?: import(\"react\").TouchEventHandler<HTMLElement> | undefined; onTouchEnd?: import(\"react\").TouchEventHandler<HTMLElement> | undefined; onTouchEndCapture?: import(\"react\").TouchEventHandler<HTMLElement> | undefined; onTouchMove?: import(\"react\").TouchEventHandler<HTMLElement> | undefined; onTouchMoveCapture?: import(\"react\").TouchEventHandler<HTMLElement> | undefined; onTouchStart?: import(\"react\").TouchEventHandler<HTMLElement> | undefined; onTouchStartCapture?: import(\"react\").TouchEventHandler<HTMLElement> | undefined; onPointerDown?: import(\"react\").PointerEventHandler<HTMLElement> | undefined; onPointerDownCapture?: import(\"react\").PointerEventHandler<HTMLElement> | undefined; onPointerMove?: import(\"react\").PointerEventHandler<HTMLElement> | undefined; onPointerMoveCapture?: import(\"react\").PointerEventHandler<HTMLElement> | undefined; onPointerUp?: import(\"react\").PointerEventHandler<HTMLElement> | undefined; onPointerUpCapture?: import(\"react\").PointerEventHandler<HTMLElement> | undefined; onPointerCancel?: import(\"react\").PointerEventHandler<HTMLElement> | undefined; onPointerCancelCapture?: import(\"react\").PointerEventHandler<HTMLElement> | undefined; onPointerEnter?: import(\"react\").PointerEventHandler<HTMLElement> | undefined; onPointerLeave?: import(\"react\").PointerEventHandler<HTMLElement> | undefined; onPointerOver?: import(\"react\").PointerEventHandler<HTMLElement> | undefined; onPointerOverCapture?: import(\"react\").PointerEventHandler<HTMLElement> | undefined; onPointerOut?: import(\"react\").PointerEventHandler<HTMLElement> | undefined; onPointerOutCapture?: import(\"react\").PointerEventHandler<HTMLElement> | undefined; onGotPointerCapture?: import(\"react\").PointerEventHandler<HTMLElement> | undefined; onGotPointerCaptureCapture?: import(\"react\").PointerEventHandler<HTMLElement> | undefined; onLostPointerCapture?: import(\"react\").PointerEventHandler<HTMLElement> | undefined; onLostPointerCaptureCapture?: import(\"react\").PointerEventHandler<HTMLElement> | undefined; onScroll?: import(\"react\").UIEventHandler<HTMLElement> | undefined; onScrollCapture?: import(\"react\").UIEventHandler<HTMLElement> | undefined; onScrollEnd?: import(\"react\").UIEventHandler<HTMLElement> | undefined; onScrollEndCapture?: import(\"react\").UIEventHandler<HTMLElement> | undefined; onWheel?: import(\"react\").WheelEventHandler<HTMLElement> | undefined; onWheelCapture?: import(\"react\").WheelEventHandler<HTMLElement> | undefined; onAnimationStart?: import(\"react\").AnimationEventHandler<HTMLElement> | undefined; onAnimationStartCapture?: import(\"react\").AnimationEventHandler<HTMLElement> | undefined; onAnimationEnd?: import(\"react\").AnimationEventHandler<HTMLElement> | undefined; onAnimationEndCapture?: import(\"react\").AnimationEventHandler<HTMLElement> | undefined; onAnimationIteration?: import(\"react\").AnimationEventHandler<HTMLElement> | undefined; onAnimationIterationCapture?: import(\"react\").AnimationEventHandler<HTMLElement> | undefined; onToggle?: import(\"react\").ToggleEventHandler<HTMLElement> | undefined; onBeforeToggle?: import(\"react\").ToggleEventHandler<HTMLElement> | undefined; onTransitionCancel?: import(\"react\").TransitionEventHandler<HTMLElement> | undefined; onTransitionCancelCapture?: import(\"react\").TransitionEventHandler<HTMLElement> | undefined; onTransitionEnd?: import(\"react\").TransitionEventHandler<HTMLElement> | undefined; onTransitionEndCapture?: import(\"react\").TransitionEventHandler<HTMLElement> | undefined; onTransitionRun?: import(\"react\").TransitionEventHandler<HTMLElement> | undefined; onTransitionRunCapture?: import(\"react\").TransitionEventHandler<HTMLElement> | undefined; onTransitionStart?: import(\"react\").TransitionEventHandler<HTMLElement> | undefined; onTransitionStartCapture?: import(\"react\").TransitionEventHandler<HTMLElement> | undefined; }, HTMLElement>",
      "props": [
        {
          "name": "as",
          "optional": true,
          "type": "\"span\" | \"code\" | \"div\" | \"label\" | \"p\" | undefined",
          "description": ""
        },
        {
          "name": "balance",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "profile",
          "optional": true,
          "type": "ComponentProfile | undefined",
          "description": ""
        },
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLElement> | undefined",
          "description": ""
        },
        {
          "name": "size",
          "optional": true,
          "type": "VisualVariant<\"text\", \"size\"> | undefined",
          "description": ""
        },
        {
          "name": "tone",
          "optional": true,
          "type": "VisualVariant<\"text\", \"tone\"> | undefined",
          "description": ""
        },
        {
          "name": "truncate",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "variant",
          "optional": true,
          "type": "VisualVariant<\"text\", \"variant\"> | undefined",
          "description": "Visual typography only. Never changes semantic element or heading level."
        },
        {
          "name": "weight",
          "optional": true,
          "type": "VisualVariant<\"text\", \"weight\"> | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-core-text/#text",
      "api": "/api/packages/core/text.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "accessibility",
          "title": "Accessibility and input behavior",
          "example": "accessibility",
          "source": "/examples/accessibility.tsx"
        },
        {
          "slug": "advanced-fields",
          "title": "Advanced field compositions",
          "example": "advanced-fields",
          "source": "/examples/advanced-fields.tsx"
        },
        {
          "slug": "all-components",
          "title": "All components gallery",
          "example": "all-components",
          "source": "/examples/all-components.tsx"
        },
        {
          "slug": "async-workflows",
          "title": "Asynchronous workflows",
          "example": "async-workflows",
          "source": "/examples/async-workflows.tsx"
        },
        {
          "slug": "surface-compositions",
          "title": "Cards, media and composed dialogs",
          "example": "surface-compositions",
          "source": "/examples/surface-compositions.tsx"
        },
        {
          "slug": "component-reference",
          "title": "Component reference",
          "example": "component-reference",
          "source": "/examples/component-reference.tsx"
        },
        {
          "slug": "consumer-experience",
          "title": "Interactive consumer experience",
          "example": "consumer-experience",
          "source": "/examples/consumer-experience.tsx"
        },
        {
          "slug": "layout",
          "title": "Layout primitives",
          "example": "layout",
          "source": "/examples/layout.tsx"
        },
        {
          "slug": "interaction-compositions",
          "title": "Motion and interactive navigation",
          "example": "interaction-compositions",
          "source": "/examples/interaction-compositions.tsx"
        },
        {
          "slug": "numeric",
          "title": "Numeric and specialized input",
          "example": "numeric",
          "source": "/examples/numeric.tsx"
        },
        {
          "slug": "theming",
          "title": "Theme and color system",
          "example": "theming",
          "source": "/examples/theming.tsx"
        },
        {
          "slug": "foundations",
          "title": "Typography and surfaces",
          "example": "foundations",
          "source": "/examples/foundations.tsx"
        }
      ]
    },
    {
      "name": "Textarea",
      "entry": "@fayegram-ai/faye-ui/controls/input",
      "guide": "/docs/fields/",
      "declaration": "packages/faye-ui/dist/controls/input.d.ts",
      "signature": "(input: TextareaProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "invalid",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLTextAreaElement> | undefined",
          "description": ""
        },
        {
          "name": "resize",
          "optional": true,
          "type": "\"vertical\" | \"none\" | \"both\" | undefined",
          "description": ""
        },
        {
          "name": "size",
          "optional": true,
          "type": "VisualVariant<\"textarea\", \"size\"> | undefined",
          "description": ""
        },
        {
          "name": "variant",
          "optional": true,
          "type": "VisualVariant<\"textarea\", \"variant\"> | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-controls-input/#textarea",
      "api": "/api/packages/controls/input.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "fields",
          "title": "Text fields and forms",
          "example": "fields",
          "source": "/examples/fields.tsx"
        }
      ]
    },
    {
      "name": "TextareaField",
      "entry": "@fayegram-ai/faye-ui/controls/textarea-field",
      "guide": "/docs/fields/",
      "declaration": "packages/faye-ui/dist/controls/textarea-field.d.ts",
      "signature": "({ label, description, error, containerClassName, autosize, minRows, maxRows, id, ...props }: TextareaFieldProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "autosize",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "containerClassName",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "description",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "error",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "invalid",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "label",
          "optional": false,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "maxRows",
          "optional": true,
          "type": "number | undefined",
          "description": ""
        },
        {
          "name": "minRows",
          "optional": true,
          "type": "number | undefined",
          "description": ""
        },
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLTextAreaElement> | undefined",
          "description": ""
        },
        {
          "name": "resize",
          "optional": true,
          "type": "\"vertical\" | \"none\" | \"both\" | undefined",
          "description": ""
        },
        {
          "name": "size",
          "optional": true,
          "type": "VisualVariant<\"textarea\", \"size\"> | undefined",
          "description": ""
        },
        {
          "name": "variant",
          "optional": true,
          "type": "VisualVariant<\"textarea\", \"variant\"> | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "Multiline counterpart to TextField; the ref and native form props reach the textarea.",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-controls-textarea-field/#textareafield",
      "api": "/api/packages/controls/textarea-field.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "advanced-fields",
          "title": "Advanced field compositions",
          "example": "advanced-fields",
          "source": "/examples/advanced-fields.tsx"
        },
        {
          "slug": "consumer-experience",
          "title": "Interactive consumer experience",
          "example": "consumer-experience",
          "source": "/examples/consumer-experience.tsx"
        }
      ]
    },
    {
      "name": "TextField",
      "entry": "@fayegram-ai/faye-ui/controls/text-field",
      "guide": "/docs/fields/",
      "declaration": "packages/faye-ui/dist/controls/text-field.d.ts",
      "signature": "({ label, description, error, id, containerClassName, startAdornment, endAdornment, ...props }: TextFieldProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "className",
          "optional": true,
          "type": "string | ((state: InputState) => string | undefined) | undefined",
          "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
        },
        {
          "name": "containerClassName",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "defaultValue",
          "optional": true,
          "type": "string | number | readonly string[] | undefined",
          "description": "The default value of the input. Use when uncontrolled."
        },
        {
          "name": "description",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "endAdornment",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "error",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "htmlSize",
          "optional": true,
          "type": "number | undefined",
          "description": ""
        },
        {
          "name": "invalid",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "label",
          "optional": false,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "onValueChange",
          "optional": true,
          "type": "((value: string, eventDetails: Input.ChangeEventDetails) => void) | undefined",
          "description": "Callback fired when the `value` changes. Use when controlled."
        },
        {
          "name": "render",
          "optional": true,
          "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, InputState> | undefined",
          "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
        },
        {
          "name": "size",
          "optional": true,
          "type": "VisualVariant<\"input\", \"size\"> | undefined",
          "description": ""
        },
        {
          "name": "startAdornment",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "style",
          "optional": true,
          "type": "CSSProperties | ((state: InputState) => React.CSSProperties | undefined) | undefined",
          "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
        },
        {
          "name": "value",
          "optional": true,
          "type": "string | number | readonly string[] | undefined",
          "description": "The value of the input. Use when controlled."
        },
        {
          "name": "variant",
          "optional": true,
          "type": "VisualVariant<\"input\", \"variant\"> | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "Convenience composition with native label/description semantics; Field remains available for advanced validation.",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-controls-text-field/#textfield",
      "api": "/api/packages/controls/text-field.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "advanced-fields",
          "title": "Advanced field compositions",
          "example": "advanced-fields",
          "source": "/examples/advanced-fields.tsx"
        },
        {
          "slug": "patterns",
          "title": "Application patterns",
          "example": "patterns",
          "source": "/examples/patterns.tsx"
        },
        {
          "slug": "async-workflows",
          "title": "Asynchronous workflows",
          "example": "async-workflows",
          "source": "/examples/async-workflows.tsx"
        },
        {
          "slug": "surface-compositions",
          "title": "Cards, media and composed dialogs",
          "example": "surface-compositions",
          "source": "/examples/surface-compositions.tsx"
        },
        {
          "slug": "functional-completion",
          "title": "Consumer interactions and navigation",
          "example": "functional-completion",
          "source": "/examples/functional-completion.tsx"
        },
        {
          "slug": "dialogs",
          "title": "Dialogs, modal and drawers",
          "example": "dialogs",
          "source": "/examples/dialogs.tsx"
        },
        {
          "slug": "consumer-experience",
          "title": "Interactive consumer experience",
          "example": "consumer-experience",
          "source": "/examples/consumer-experience.tsx"
        },
        {
          "slug": "interaction-compositions",
          "title": "Motion and interactive navigation",
          "example": "interaction-compositions",
          "source": "/examples/interaction-compositions.tsx"
        },
        {
          "slug": "fields",
          "title": "Text fields and forms",
          "example": "fields",
          "source": "/examples/fields.tsx"
        },
        {
          "slug": "theming",
          "title": "Theme and color system",
          "example": "theming",
          "source": "/examples/theming.tsx"
        }
      ]
    },
    {
      "name": "ThemeEditor",
      "entry": "@fayegram-ai/faye-ui/devtools/theme-editor",
      "guide": "/docs/studio/",
      "declaration": "packages/faye-ui/dist/devtools/theme-editor.d.ts",
      "signature": "({ theme, onChange, schema }: ThemeEditorProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "onChange",
          "optional": false,
          "type": "(theme: ThemeDefinition) => void",
          "description": ""
        },
        {
          "name": "schema",
          "optional": true,
          "type": "Readonly<Record<string, TokenSpec>> | undefined",
          "description": "Supply the extended contract when editing extension-owned tokens."
        },
        {
          "name": "theme",
          "optional": false,
          "type": "ThemeDefinition",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-devtools-theme-editor/#themeeditor",
      "api": "/api/packages/devtools/theme-editor.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "studio",
          "title": "Theme studio",
          "example": "studio",
          "source": "/examples/studio.tsx"
        }
      ]
    },
    {
      "name": "ThemeScope",
      "entry": "@fayegram-ai/faye-ui/provider/provider",
      "guide": "/docs/theming/",
      "declaration": "packages/faye-ui/dist/provider/provider.d.ts",
      "signature": "({ accessibility, interaction, scheme, density, direction, themeId, axes, motion, variables, mode, profiles, settings, children, style, className, ...props }: ThemeScopeProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "accessibility",
          "optional": true,
          "type": "AccessibilityOptions | undefined",
          "description": ""
        },
        {
          "name": "axes",
          "optional": true,
          "type": "Readonly<Record<string, string>> | undefined",
          "description": ""
        },
        {
          "name": "density",
          "optional": true,
          "type": "Density | undefined",
          "description": ""
        },
        {
          "name": "direction",
          "optional": true,
          "type": "Direction | undefined",
          "description": ""
        },
        {
          "name": "interaction",
          "optional": true,
          "type": "InteractionOptions | undefined",
          "description": ""
        },
        {
          "name": "mode",
          "optional": true,
          "type": "\"extend\" | \"isolate\" | undefined",
          "description": ""
        },
        {
          "name": "motion",
          "optional": true,
          "type": "\"system\" | \"reduced\" | undefined",
          "description": ""
        },
        {
          "name": "profiles",
          "optional": true,
          "type": "readonly ComponentProfile[] | undefined",
          "description": ""
        },
        {
          "name": "scheme",
          "optional": true,
          "type": "Scheme | undefined",
          "description": ""
        },
        {
          "name": "settings",
          "optional": true,
          "type": "readonly ComponentSettings[] | undefined",
          "description": ""
        },
        {
          "name": "themeId",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "variables",
          "optional": true,
          "type": "Readonly<Record<`--faye-ui-${string}`, string>> | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-provider-provider/#themescope",
      "api": "/api/packages/provider/provider.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "accessibility",
          "title": "Accessibility and input behavior",
          "example": "accessibility",
          "source": "/examples/accessibility.tsx"
        },
        {
          "slug": "advanced-fields",
          "title": "Advanced field compositions",
          "example": "advanced-fields",
          "source": "/examples/advanced-fields.tsx"
        },
        {
          "slug": "surface-compositions",
          "title": "Cards, media and composed dialogs",
          "example": "surface-compositions",
          "source": "/examples/surface-compositions.tsx"
        },
        {
          "slug": "selection",
          "title": "Checkboxes, radios and switches",
          "example": "selection",
          "source": "/examples/selection.tsx"
        },
        {
          "slug": "functional-completion",
          "title": "Consumer interactions and navigation",
          "example": "functional-completion",
          "source": "/examples/functional-completion.tsx"
        },
        {
          "slug": "customization",
          "title": "Customization sheets",
          "example": "customization",
          "source": "/examples/customization.tsx"
        },
        {
          "slug": "dialogs",
          "title": "Dialogs, modal and drawers",
          "example": "dialogs",
          "source": "/examples/dialogs.tsx"
        },
        {
          "slug": "interaction-compositions",
          "title": "Motion and interactive navigation",
          "example": "interaction-compositions",
          "source": "/examples/interaction-compositions.tsx"
        },
        {
          "slug": "theming",
          "title": "Theme and color system",
          "example": "theming",
          "source": "/examples/theming.tsx"
        },
        {
          "slug": "foundations",
          "title": "Typography and surfaces",
          "example": "foundations",
          "source": "/examples/foundations.tsx"
        }
      ]
    },
    {
      "name": "ThemeScript",
      "entry": "@fayegram-ai/faye-ui/integrations/react",
      "guide": "/docs/server-rendering/",
      "declaration": "packages/faye-ui/dist/integrations/react.d.ts",
      "signature": "({ nonce, ...options }: BootstrapOptions & { nonce?: string; }): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "accessibility",
          "optional": true,
          "type": "AccessibilityOptions | undefined",
          "description": "Omission preserves server-authored presentation; match the provider when explicit."
        },
        {
          "name": "axes",
          "optional": true,
          "type": "Readonly<Record<string, string>> | undefined",
          "description": "Omission preserves server-authored axes; an explicit map replaces them."
        },
        {
          "name": "defaultPreference",
          "optional": true,
          "type": "\"light\" | \"dark\" | \"system\" | undefined",
          "description": ""
        },
        {
          "name": "density",
          "optional": true,
          "type": "\"comfortable\" | \"compact\" | undefined",
          "description": ""
        },
        {
          "name": "direction",
          "optional": true,
          "type": "\"ltr\" | \"rtl\" | undefined",
          "description": ""
        },
        {
          "name": "motion",
          "optional": true,
          "type": "\"system\" | \"reduced\" | undefined",
          "description": ""
        },
        {
          "name": "nonce",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "serverScheme",
          "optional": true,
          "type": "\"light\" | \"dark\" | undefined",
          "description": "Fallback when browser media preferences cannot be read. Match the hydration snapshot."
        },
        {
          "name": "storageKey",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "themeId",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-integrations-react/#themescript",
      "api": "/api/packages/integrations/react.json",
      "clientBoundary": false,
      "pages": []
    },
    {
      "name": "Timeline",
      "entry": "@fayegram-ai/faye-ui/display/timeline",
      "guide": "/docs/display/",
      "declaration": "packages/faye-ui/dist/display/timeline.d.ts",
      "signature": "({ profile, className, position, orientation, tabIndex, ...props }: HTMLAttributes<HTMLOListElement> & { profile?: ComponentProfile; ref?: Ref<HTMLOListElement>; position?: VisualVariant<\"timeline\", \"position\">; orientation?: \"vertical\" | \"horizontal\"; }): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "orientation",
          "optional": true,
          "type": "\"horizontal\" | \"vertical\" | undefined",
          "description": ""
        },
        {
          "name": "position",
          "optional": true,
          "type": "VisualVariant<\"timeline\", \"position\"> | undefined",
          "description": ""
        },
        {
          "name": "profile",
          "optional": true,
          "type": "ComponentProfile | undefined",
          "description": ""
        },
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLOListElement> | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-display-timeline/#timeline",
      "api": "/api/packages/display/timeline.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "functional-completion",
          "title": "Consumer interactions and navigation",
          "example": "functional-completion",
          "source": "/examples/functional-completion.tsx"
        },
        {
          "slug": "display",
          "title": "Tables, lists and display",
          "example": "display",
          "source": "/examples/display.tsx"
        }
      ]
    },
    {
      "name": "TimelineItem",
      "entry": "@fayegram-ai/faye-ui/display/timeline",
      "guide": "/docs/display/",
      "declaration": "packages/faye-ui/dist/display/timeline.d.ts",
      "signature": "({ profile, marker, timestamp, dateTime, opposite, tone, className, children, ...props }: TimelineItemProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "dateTime",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "marker",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "opposite",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "profile",
          "optional": true,
          "type": "ComponentProfile | undefined",
          "description": ""
        },
        {
          "name": "ref",
          "optional": true,
          "type": "Ref<HTMLLIElement> | undefined",
          "description": ""
        },
        {
          "name": "timestamp",
          "optional": true,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "tone",
          "optional": true,
          "type": "VisualVariant<\"timeline-item\", \"tone\"> | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-display-timeline/#timelineitem",
      "api": "/api/packages/display/timeline.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "functional-completion",
          "title": "Consumer interactions and navigation",
          "example": "functional-completion",
          "source": "/examples/functional-completion.tsx"
        },
        {
          "slug": "display",
          "title": "Tables, lists and display",
          "example": "display",
          "source": "/examples/display.tsx"
        }
      ]
    },
    {
      "name": "Toast",
      "entry": "@fayegram-ai/faye-ui/feedback/toast",
      "guide": "/docs/feedback/",
      "declaration": "packages/faye-ui/dist/feedback/toast.d.ts",
      "signature": null,
      "props": [],
      "parts": [
        {
          "name": "Provider",
          "props": [
            {
              "name": "children",
              "optional": true,
              "type": "ReactNode",
              "description": ""
            },
            {
              "name": "limit",
              "optional": true,
              "type": "number | undefined",
              "description": "The maximum number of toasts that can be displayed at once.\nWhen the limit is exceeded, the oldest toasts are marked as `limited` (via the `data-limited`\nattribute) rather than removed, so they can be hidden or animated out."
            },
            {
              "name": "timeout",
              "optional": true,
              "type": "number | undefined",
              "description": "The default amount of time (in ms) before a toast is auto dismissed.\nA value of `0` will prevent the toast from being dismissed automatically."
            },
            {
              "name": "toastManager",
              "optional": true,
              "type": "ToastManager<any> | undefined",
              "description": "A global manager for toasts to use outside of a React component."
            }
          ]
        },
        {
          "name": "Viewport",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ToastViewportState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ToastViewportState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ToastViewportState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"toast\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"toast\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Root",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ToastRootState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ToastRootState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ToastRootState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "swipeDirection",
              "optional": true,
              "type": "\"left\" | \"right\" | \"up\" | \"down\" | (\"left\" | \"right\" | \"up\" | \"down\")[] | undefined",
              "description": "Direction(s) in which the toast can be swiped to dismiss."
            },
            {
              "name": "toast",
              "optional": false,
              "type": "ToastRootToastObject<any>",
              "description": "The toast to render."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"toast\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"toast\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Positioner",
          "props": [
            {
              "name": "align",
              "optional": true,
              "type": "Align | undefined",
              "description": "How to align the popup relative to the specified side."
            },
            {
              "name": "alignOffset",
              "optional": true,
              "type": "number | OffsetFunction | undefined",
              "description": "Additional offset along the alignment axis in pixels.\nAlso accepts a function that returns the offset to read the dimensions of the anchor\nand positioner elements, along with its side and alignment.\n\nThe function takes a `data` object parameter with the following properties:\n- `data.anchor`: the dimensions of the anchor element with properties `width` and `height`.\n- `data.positioner`: the dimensions of the positioner element with properties `width` and `height`.\n- `data.side`: which side of the anchor element the positioner is aligned against.\n- `data.align`: how the positioner is aligned relative to the specified side."
            },
            {
              "name": "anchor",
              "optional": true,
              "type": "Element | null | undefined",
              "description": "An element to position the toast against."
            },
            {
              "name": "arrowPadding",
              "optional": true,
              "type": "number | undefined",
              "description": "Minimum distance to maintain between the arrow and the edges of the popup.\n\nUse it to prevent the arrow element from hanging out of the rounded corners of a popup."
            },
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ToastPositionerState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "collisionAvoidance",
              "optional": true,
              "type": "CollisionAvoidance | undefined",
              "description": "Determines how to handle collisions when positioning the popup.\n\n`side` controls overflow on the preferred placement axis (`top`/`bottom` or `left`/`right`):\n- `'flip'`: keep the requested side when it fits; otherwise try the opposite side\n  (`top` and `bottom`, or `left` and `right`).\n- `'shift'`: never change side; keep the requested side and move the popup within\n  the clipping boundary so it stays visible.\n- `'none'`: do not correct side-axis overflow.\n\n`align` controls overflow on the alignment axis (`start`/`center`/`end`):\n- `'flip'`: keep side, but swap `start` and `end` when the requested alignment overflows.\n- `'shift'`: keep side and requested alignment, then nudge the popup along the\n  alignment axis to fit.\n- `'none'`: do not correct alignment-axis overflow.\n\n`fallbackAxisSide` controls fallback behavior on the perpendicular axis when the\npreferred axis cannot fit:\n- `'start'`: allow perpendicular fallback and try the logical start side first\n  (`top` before `bottom`, or `left` before `right` in LTR).\n- `'end'`: allow perpendicular fallback and try the logical end side first\n  (`bottom` before `top`, or `right` before `left` in LTR).\n- `'none'`: do not fallback to the perpendicular axis.\n\nWhen `side` is `'shift'`, explicitly setting `align` only supports `'shift'` or `'none'`.\nIf `align` is omitted, it defaults to `'flip'`."
            },
            {
              "name": "collisionBoundary",
              "optional": true,
              "type": "Boundary | undefined",
              "description": "An element or a rectangle that delimits the area that the popup is confined to."
            },
            {
              "name": "collisionPadding",
              "optional": true,
              "type": "Padding | undefined",
              "description": "Additional space to maintain from the edge of the collision boundary."
            },
            {
              "name": "disableAnchorTracking",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to disable the popup from tracking any layout shift of its positioning anchor."
            },
            {
              "name": "positionMethod",
              "optional": true,
              "type": "\"absolute\" | \"fixed\" | undefined",
              "description": "Determines which CSS `position` property to use."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ToastPositionerState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "side",
              "optional": true,
              "type": "Side | undefined",
              "description": "Which side of the anchor element to align the toast against.\nMay automatically change to avoid collisions."
            },
            {
              "name": "sideOffset",
              "optional": true,
              "type": "number | OffsetFunction | undefined",
              "description": "Distance between the anchor and the popup in pixels.\nAlso accepts a function that returns the distance to read the dimensions of the anchor\nand positioner elements, along with its side and alignment.\n\nThe function takes a `data` object parameter with the following properties:\n- `data.anchor`: the dimensions of the anchor element with properties `width` and `height`.\n- `data.positioner`: the dimensions of the positioner element with properties `width` and `height`.\n- `data.side`: which side of the anchor element the positioner is aligned against.\n- `data.align`: how the positioner is aligned relative to the specified side."
            },
            {
              "name": "sticky",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to maintain the popup in the viewport after\nthe anchor element was scrolled out of view."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ToastPositionerState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "toast",
              "optional": false,
              "type": "ToastObject<any>",
              "description": "The toast object associated with the positioner."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"toast\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"toast\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Arrow",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ToastArrowState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ToastArrowState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ToastArrowState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"toast\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"toast\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Content",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ToastContentState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ToastContentState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ToastContentState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"toast\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"toast\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Icon",
          "props": [
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"toast\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"toast\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Message",
          "props": [
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"toast\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"toast\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Actions",
          "props": [
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"toast\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"toast\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Title",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ToastTitleState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ToastTitleState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ToastTitleState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"toast\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"toast\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Description",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ToastDescriptionState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ToastDescriptionState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ToastDescriptionState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"toast\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"toast\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Close",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ToastCloseState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "nativeButton",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component renders a native `<button>` element when replacing it\nvia the `render` prop.\nSet to `false` if the rendered element is not a button (for example, `<div>`)."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ToastCloseState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ToastCloseState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"toast\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"toast\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Action",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ToastActionState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "nativeButton",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component renders a native `<button>` element when replacing it\nvia the `render` prop.\nSet to `false` if the rendered element is not a button (for example, `<div>`)."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ToastActionState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ToastActionState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"toast\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"toast\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Portal",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ToastPortalState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "container",
              "optional": true,
              "type": "HTMLElement | ShadowRoot | RefObject<HTMLElement | ShadowRoot | null> | null | undefined",
              "description": "A parent element to render the portal element into."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ToastPortalState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ToastPortalState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            }
          ]
        }
      ],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-feedback-toast/#toast",
      "api": "/api/packages/feedback/toast.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "functional-completion",
          "title": "Consumer interactions and navigation",
          "example": "functional-completion",
          "source": "/examples/functional-completion.tsx"
        },
        {
          "slug": "feedback",
          "title": "Feedback and status",
          "example": "feedback",
          "source": "/examples/feedback.tsx"
        }
      ]
    },
    {
      "name": "Toaster",
      "entry": "@fayegram-ai/faye-ui/patterns/toaster",
      "guide": "/docs/patterns/",
      "declaration": "packages/faye-ui/dist/patterns/toaster.d.ts",
      "signature": "(input?: ToasterProps): import(\"react\").JSX.Element",
      "props": [],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-patterns-toaster/#toaster",
      "api": "/api/packages/patterns/toaster.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "functional-completion",
          "title": "Consumer interactions and navigation",
          "example": "functional-completion",
          "source": "/examples/functional-completion.tsx"
        },
        {
          "slug": "feedback",
          "title": "Feedback and status",
          "example": "feedback",
          "source": "/examples/feedback.tsx"
        }
      ]
    },
    {
      "name": "Toggle",
      "entry": "@fayegram-ai/faye-ui/controls/toggle",
      "guide": "/docs/buttons/",
      "declaration": "packages/faye-ui/dist/controls/toggle.d.ts",
      "signature": "(input: Base.Props<string> & import(\"react\").RefAttributes<HTMLButtonElement> & { variants?: Readonly<Record<string, string>> | undefined; }): import(\"react\").ReactElement",
      "props": [
        {
          "name": "className",
          "optional": true,
          "type": "string | ((state: ToggleState) => string | undefined) | undefined",
          "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
        },
        {
          "name": "defaultPressed",
          "optional": true,
          "type": "boolean | undefined",
          "description": "Whether the toggle button is currently pressed.\nThis is the uncontrolled counterpart of `pressed`."
        },
        {
          "name": "disabled",
          "optional": true,
          "type": "boolean | undefined",
          "description": "Whether the component should ignore user interaction."
        },
        {
          "name": "nativeButton",
          "optional": true,
          "type": "boolean | undefined",
          "description": "Whether the component renders a native `<button>` element when replacing it\nvia the `render` prop.\nSet to `false` if the rendered element is not a button (for example, `<div>`)."
        },
        {
          "name": "onPressedChange",
          "optional": true,
          "type": "((pressed: boolean, eventDetails: Base.ChangeEventDetails) => void) | undefined",
          "description": "Callback fired when the pressed state is changed."
        },
        {
          "name": "pressed",
          "optional": true,
          "type": "boolean | undefined",
          "description": "Whether the toggle button is currently pressed.\nThis is the controlled counterpart of `defaultPressed`."
        },
        {
          "name": "render",
          "optional": true,
          "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ToggleState> | undefined",
          "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
        },
        {
          "name": "style",
          "optional": true,
          "type": "CSSProperties | ((state: ToggleState) => React.CSSProperties | undefined) | undefined",
          "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
        },
        {
          "name": "value",
          "optional": true,
          "type": "string | undefined",
          "description": "A unique string that identifies the toggle when used\ninside a toggle group."
        },
        {
          "name": "variants",
          "optional": true,
          "type": "Readonly<Record<string, string>> | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-controls-toggle/#toggle",
      "api": "/api/packages/controls/toggle.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "buttons",
          "title": "Buttons and actions",
          "example": "buttons",
          "source": "/examples/buttons.tsx"
        }
      ]
    },
    {
      "name": "ToggleGroup",
      "entry": "@fayegram-ai/faye-ui/controls/toggle-group",
      "guide": "/docs/buttons/",
      "declaration": "packages/faye-ui/dist/controls/toggle-group.d.ts",
      "signature": "(input: Base.Props<string> & import(\"react\").RefAttributes<HTMLDivElement> & { variants?: Readonly<Record<string, string>> | undefined; }): import(\"react\").ReactElement",
      "props": [
        {
          "name": "className",
          "optional": true,
          "type": "string | ((state: ToggleGroupState) => string | undefined) | undefined",
          "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
        },
        {
          "name": "defaultValue",
          "optional": true,
          "type": "readonly string[] | undefined",
          "description": "The pressed state of the toggle group represented by an array of\nthe values of all pressed toggle buttons.\nThis is the uncontrolled counterpart of `value`."
        },
        {
          "name": "disabled",
          "optional": true,
          "type": "boolean | undefined",
          "description": "Whether the toggle group should ignore user interaction."
        },
        {
          "name": "loopFocus",
          "optional": true,
          "type": "boolean | undefined",
          "description": "Whether to loop keyboard focus back to the first item\nwhen the end of the list is reached while using the arrow keys."
        },
        {
          "name": "multiple",
          "optional": true,
          "type": "boolean | undefined",
          "description": "When `false` only one item in the group can be pressed. If any item in\nthe group becomes pressed, the others will become unpressed.\nWhen `true` multiple items can be pressed."
        },
        {
          "name": "onValueChange",
          "optional": true,
          "type": "((groupValue: string[], eventDetails: Base.ChangeEventDetails) => void) | undefined",
          "description": "Callback fired when the pressed states of the toggle group changes."
        },
        {
          "name": "orientation",
          "optional": true,
          "type": "Orientation | undefined",
          "description": ""
        },
        {
          "name": "render",
          "optional": true,
          "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ToggleGroupState> | undefined",
          "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
        },
        {
          "name": "style",
          "optional": true,
          "type": "CSSProperties | ((state: ToggleGroupState) => React.CSSProperties | undefined) | undefined",
          "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
        },
        {
          "name": "value",
          "optional": true,
          "type": "readonly string[] | undefined",
          "description": "The pressed state of the toggle group represented by an array of\nthe values of all pressed toggle buttons.\nThis is the controlled counterpart of `defaultValue`."
        },
        {
          "name": "variants",
          "optional": true,
          "type": "Readonly<Record<string, string>> | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-controls-toggle-group/#togglegroup",
      "api": "/api/packages/controls/toggle-group.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "buttons",
          "title": "Buttons and actions",
          "example": "buttons",
          "source": "/examples/buttons.tsx"
        }
      ]
    },
    {
      "name": "Toolbar",
      "entry": "@fayegram-ai/faye-ui/navigation/toolbar",
      "guide": "/docs/navigation/",
      "declaration": "packages/faye-ui/dist/navigation/toolbar.d.ts",
      "signature": null,
      "props": [],
      "parts": [
        {
          "name": "Root",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ToolbarRootState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "disabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": ""
            },
            {
              "name": "loopFocus",
              "optional": true,
              "type": "boolean | undefined",
              "description": "If `true`, using keyboard navigation will wrap focus to the other end of the toolbar once the end is reached."
            },
            {
              "name": "orientation",
              "optional": true,
              "type": "Orientation | undefined",
              "description": "The orientation of the toolbar."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ToolbarRootState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ToolbarRootState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"toolbar\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"toolbar\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Button",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ToolbarButtonState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "disabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": "When `true` the item is disabled."
            },
            {
              "name": "focusableWhenDisabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": "When `true` the item remains focusable when disabled."
            },
            {
              "name": "nativeButton",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the component renders a native `<button>` element when replacing it\nvia the `render` prop.\nSet to `false` if the rendered element is not a button (for example, `<div>`)."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ToolbarButtonState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ToolbarButtonState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"toolbar\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"toolbar\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Link",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ToolbarLinkState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<DetailedHTMLProps<AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, ToolbarLinkState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ToolbarLinkState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"toolbar\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"toolbar\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Input",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ToolbarInputState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "defaultValue",
              "optional": true,
              "type": "string | number | readonly string[] | undefined",
              "description": ""
            },
            {
              "name": "disabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": "When `true` the item is disabled."
            },
            {
              "name": "focusableWhenDisabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": "When `true` the item remains focusable when disabled."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ToolbarInputState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ToolbarInputState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"toolbar\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"toolbar\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Separator",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: SeparatorState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "orientation",
              "optional": true,
              "type": "Orientation | undefined",
              "description": "The orientation of the separator. Defaults to the opposite of the toolbar's\norientation, so a horizontal toolbar renders vertical separators."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, SeparatorState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: SeparatorState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"toolbar\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"toolbar\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Group",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: ToolbarGroupState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "disabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": "When `true` all toolbar items in the group are disabled."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, ToolbarGroupState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: ToolbarGroupState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"toolbar\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"toolbar\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        }
      ],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-navigation-toolbar/#toolbar",
      "api": "/api/packages/navigation/toolbar.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "interaction-compositions",
          "title": "Motion and interactive navigation",
          "example": "interaction-compositions",
          "source": "/examples/interaction-compositions.tsx"
        },
        {
          "slug": "navigation",
          "title": "Navigation and disclosure",
          "example": "navigation",
          "source": "/examples/navigation.tsx"
        }
      ]
    },
    {
      "name": "Tooltip",
      "entry": "@fayegram-ai/faye-ui/overlays/tooltip",
      "guide": "/docs/floating/",
      "declaration": "packages/faye-ui/dist/overlays/tooltip.d.ts",
      "signature": null,
      "props": [],
      "parts": [
        {
          "name": "Provider",
          "props": [
            {
              "name": "children",
              "optional": true,
              "type": "ReactNode",
              "description": ""
            },
            {
              "name": "closeDelay",
              "optional": true,
              "type": "number | undefined",
              "description": "How long to wait before closing a tooltip. Specified in milliseconds."
            },
            {
              "name": "delay",
              "optional": true,
              "type": "number | undefined",
              "description": "How long to wait before opening the tooltip on hover. Specified in milliseconds."
            },
            {
              "name": "timeout",
              "optional": true,
              "type": "number | undefined",
              "description": "Another tooltip will open instantly if the previous tooltip\nis closed within this timeout. Specified in milliseconds."
            }
          ]
        },
        {
          "name": "Root",
          "props": [
            {
              "name": "actionsRef",
              "optional": true,
              "type": "RefObject<TooltipRootActions | null> | undefined",
              "description": "A ref to imperative actions.\n- `unmount`: Unmounts the tooltip popup.\n- `close`: Closes the tooltip imperatively when called."
            },
            {
              "name": "children",
              "optional": true,
              "type": "ReactNode | PayloadChildRenderFunction<Payload>",
              "description": "The content of the tooltip.\nThis can be a regular React node or a render function that receives the `payload` of the active trigger."
            },
            {
              "name": "defaultOpen",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the tooltip is initially open.\n\nTo render a controlled tooltip, use the `open` prop instead."
            },
            {
              "name": "defaultTriggerId",
              "optional": true,
              "type": "string | null | undefined",
              "description": "ID of the trigger that the tooltip is associated with.\nThis is useful in conjunction with the `defaultOpen` prop to create an initially open tooltip."
            },
            {
              "name": "disabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the tooltip is disabled."
            },
            {
              "name": "disableHoverablePopup",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the tooltip contents can be hovered without closing the tooltip."
            },
            {
              "name": "handle",
              "optional": true,
              "type": "Base.Handle<Payload> | undefined",
              "description": "A handle to associate the tooltip with a trigger.\nIf specified, allows external triggers to control the tooltip's open state.\nCan be created with the Tooltip.createHandle() method."
            },
            {
              "name": "onOpenChange",
              "optional": true,
              "type": "((open: boolean, eventDetails: Base.Root.ChangeEventDetails) => void) | undefined",
              "description": "Event handler called when the tooltip is opened or closed."
            },
            {
              "name": "onOpenChangeComplete",
              "optional": true,
              "type": "((open: boolean) => void) | undefined",
              "description": "Event handler called after any animations complete when the tooltip is opened or closed."
            },
            {
              "name": "open",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the tooltip is currently open."
            },
            {
              "name": "trackCursorAxis",
              "optional": true,
              "type": "\"none\" | \"x\" | \"y\" | \"both\" | undefined",
              "description": "Determines which axis the tooltip should track the cursor on."
            },
            {
              "name": "triggerId",
              "optional": true,
              "type": "string | null | undefined",
              "description": "ID of the trigger that the tooltip is associated with.\nThis is useful in conjunction with the `open` prop to create a controlled tooltip.\nThere's no need to specify this prop when the tooltip is uncontrolled (that is, when the `open` prop is not set)."
            }
          ]
        },
        {
          "name": "Trigger",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: TooltipTriggerState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "closeDelay",
              "optional": true,
              "type": "number | undefined",
              "description": "How long to wait before closing the tooltip. Specified in milliseconds."
            },
            {
              "name": "closeOnClick",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether the tooltip should close when this trigger is clicked."
            },
            {
              "name": "delay",
              "optional": true,
              "type": "number | undefined",
              "description": "How long to wait before opening the tooltip on hover. Specified in milliseconds."
            },
            {
              "name": "disabled",
              "optional": true,
              "type": "boolean | undefined",
              "description": "If `true`, the tooltip will not open when interacting with this trigger.\nNote that this doesn't apply the `disabled` attribute to the trigger element.\nIf you want to disable the trigger element itself, you can pass the `disabled` prop to the trigger element via the `render` prop."
            },
            {
              "name": "handle",
              "optional": true,
              "type": "Base.Handle<unknown> | undefined",
              "description": "A handle to associate the trigger with a tooltip."
            },
            {
              "name": "payload",
              "optional": true,
              "type": "unknown",
              "description": "A payload to pass to the tooltip when it is opened."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, TooltipTriggerState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: TooltipTriggerState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"tooltip\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"tooltip\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Positioner",
          "props": [
            {
              "name": "align",
              "optional": true,
              "type": "Align | undefined",
              "description": "How to align the popup relative to the specified side."
            },
            {
              "name": "alignOffset",
              "optional": true,
              "type": "number | OffsetFunction | undefined",
              "description": "Additional offset along the alignment axis in pixels.\nAlso accepts a function that returns the offset to read the dimensions of the anchor\nand positioner elements, along with its side and alignment.\n\nThe function takes a `data` object parameter with the following properties:\n- `data.anchor`: the dimensions of the anchor element with properties `width` and `height`.\n- `data.positioner`: the dimensions of the positioner element with properties `width` and `height`.\n- `data.side`: which side of the anchor element the positioner is aligned against.\n- `data.align`: how the positioner is aligned relative to the specified side."
            },
            {
              "name": "anchor",
              "optional": true,
              "type": "Element | VirtualElement | RefObject<Element | null> | (() => Element | VirtualElement | null) | null | undefined",
              "description": "An element to position the popup against.\nBy default, the popup will be positioned against the trigger."
            },
            {
              "name": "arrowPadding",
              "optional": true,
              "type": "number | undefined",
              "description": "Minimum distance to maintain between the arrow and the edges of the popup.\n\nUse it to prevent the arrow element from hanging out of the rounded corners of a popup."
            },
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: TooltipPositionerState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "collisionAvoidance",
              "optional": true,
              "type": "CollisionAvoidance | undefined",
              "description": "Determines how to handle collisions when positioning the popup.\n\n`side` controls overflow on the preferred placement axis (`top`/`bottom` or `left`/`right`):\n- `'flip'`: keep the requested side when it fits; otherwise try the opposite side\n  (`top` and `bottom`, or `left` and `right`).\n- `'shift'`: never change side; keep the requested side and move the popup within\n  the clipping boundary so it stays visible.\n- `'none'`: do not correct side-axis overflow.\n\n`align` controls overflow on the alignment axis (`start`/`center`/`end`):\n- `'flip'`: keep side, but swap `start` and `end` when the requested alignment overflows.\n- `'shift'`: keep side and requested alignment, then nudge the popup along the\n  alignment axis to fit.\n- `'none'`: do not correct alignment-axis overflow.\n\n`fallbackAxisSide` controls fallback behavior on the perpendicular axis when the\npreferred axis cannot fit:\n- `'start'`: allow perpendicular fallback and try the logical start side first\n  (`top` before `bottom`, or `left` before `right` in LTR).\n- `'end'`: allow perpendicular fallback and try the logical end side first\n  (`bottom` before `top`, or `right` before `left` in LTR).\n- `'none'`: do not fallback to the perpendicular axis.\n\nWhen `side` is `'shift'`, explicitly setting `align` only supports `'shift'` or `'none'`.\nIf `align` is omitted, it defaults to `'flip'`."
            },
            {
              "name": "collisionBoundary",
              "optional": true,
              "type": "Boundary | undefined",
              "description": "An element or a rectangle that delimits the area that the popup is confined to."
            },
            {
              "name": "collisionPadding",
              "optional": true,
              "type": "Padding | undefined",
              "description": "Additional space to maintain from the edge of the collision boundary."
            },
            {
              "name": "disableAnchorTracking",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to disable the popup from tracking any layout shift of its positioning anchor."
            },
            {
              "name": "positionMethod",
              "optional": true,
              "type": "\"absolute\" | \"fixed\" | undefined",
              "description": "Determines which CSS `position` property to use."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, TooltipPositionerState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "side",
              "optional": true,
              "type": "Side | undefined",
              "description": "Which side of the anchor element to align the popup against.\nMay automatically change to avoid collisions."
            },
            {
              "name": "sideOffset",
              "optional": true,
              "type": "number | OffsetFunction | undefined",
              "description": "Distance between the anchor and the popup in pixels.\nAlso accepts a function that returns the distance to read the dimensions of the anchor\nand positioner elements, along with its side and alignment.\n\nThe function takes a `data` object parameter with the following properties:\n- `data.anchor`: the dimensions of the anchor element with properties `width` and `height`.\n- `data.positioner`: the dimensions of the positioner element with properties `width` and `height`.\n- `data.side`: which side of the anchor element the positioner is aligned against.\n- `data.align`: how the positioner is aligned relative to the specified side."
            },
            {
              "name": "sticky",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to maintain the popup in the viewport after\nthe anchor element was scrolled out of view."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: TooltipPositionerState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"tooltip\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"tooltip\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Popup",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: TooltipPopupState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, TooltipPopupState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: TooltipPopupState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"tooltip\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"tooltip\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Arrow",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: TooltipArrowState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, TooltipArrowState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: TooltipArrowState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            },
            {
              "name": "variants",
              "optional": true,
              "type": "{ readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"tooltip\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"tooltip\", \"tone\"> | undefined; } | undefined",
              "description": ""
            }
          ]
        },
        {
          "name": "Portal",
          "props": [
            {
              "name": "className",
              "optional": true,
              "type": "string | ((state: TooltipPortalState) => string | undefined) | undefined",
              "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
            },
            {
              "name": "container",
              "optional": true,
              "type": "HTMLElement | ShadowRoot | RefObject<HTMLElement | ShadowRoot | null> | null | undefined",
              "description": "A parent element to render the portal element into."
            },
            {
              "name": "keepMounted",
              "optional": true,
              "type": "boolean | undefined",
              "description": "Whether to keep the portal mounted in the DOM while the popup is hidden."
            },
            {
              "name": "render",
              "optional": true,
              "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, TooltipPortalState> | undefined",
              "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
            },
            {
              "name": "style",
              "optional": true,
              "type": "CSSProperties | ((state: TooltipPortalState) => React.CSSProperties | undefined) | undefined",
              "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
            }
          ]
        }
      ],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-overlays-tooltip/#tooltip",
      "api": "/api/packages/overlays/tooltip.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "floating",
          "title": "Portals and floating content",
          "example": "floating",
          "source": "/examples/floating.tsx"
        }
      ]
    },
    {
      "name": "TouchTooltip",
      "entry": "@fayegram-ai/faye-ui/overlays/tooltip",
      "guide": "/docs/floating/",
      "declaration": "packages/faye-ui/dist/overlays/tooltip.d.ts",
      "signature": "({ children, content, open, defaultOpen, onOpenChange, disabled, longPressDelay, touchCloseDelay, moveTolerance, triggerProps, positionerProps, popupProps }: TouchTooltipProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "children",
          "optional": false,
          "type": "ReactElement<unknown, string | JSXElementConstructor<any>>",
          "description": ""
        },
        {
          "name": "content",
          "optional": false,
          "type": "ReactNode",
          "description": ""
        },
        {
          "name": "defaultOpen",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "disabled",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "longPressDelay",
          "optional": true,
          "type": "number | undefined",
          "description": ""
        },
        {
          "name": "moveTolerance",
          "optional": true,
          "type": "number | undefined",
          "description": ""
        },
        {
          "name": "onOpenChange",
          "optional": true,
          "type": "((open: boolean) => void) | undefined",
          "description": ""
        },
        {
          "name": "open",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "popupProps",
          "optional": true,
          "type": "(Omit<TooltipPopupProps, \"ref\"> & RefAttributes<HTMLDivElement> & { variants?: { readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"tooltip\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"tooltip\", \"tone\"> | undefined; } | undefined; }) | undefined",
          "description": ""
        },
        {
          "name": "positionerProps",
          "optional": true,
          "type": "(Omit<TooltipPositionerProps, \"ref\"> & RefAttributes<HTMLDivElement> & { variants?: { readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"tooltip\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"tooltip\", \"tone\"> | undefined; } | undefined; }) | undefined",
          "description": ""
        },
        {
          "name": "touchCloseDelay",
          "optional": true,
          "type": "number | undefined",
          "description": ""
        },
        {
          "name": "triggerProps",
          "optional": true,
          "type": "(Base.Trigger.Props<unknown> & RefAttributes<HTMLElement> & { variants?: { readonly size?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"tooltip\", \"size\"> | undefined; readonly tone?: import(\"@fayegram-ai/faye-ui/contracts/visual-variants\").VisualVariant<\"tooltip\", \"tone\"> | undefined; } | undefined; }) | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "Touch hold supplements the existing hover/focus/dismissal engine. A normal tap still activates its control.",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-overlays-tooltip/#touchtooltip",
      "api": "/api/packages/overlays/tooltip.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "functional-completion",
          "title": "Consumer interactions and navigation",
          "example": "functional-completion",
          "source": "/examples/functional-completion.tsx"
        }
      ]
    },
    {
      "name": "TransferList",
      "entry": "@fayegram-ai/faye-ui/patterns/transfer-list",
      "guide": "/docs/patterns/",
      "declaration": "packages/faye-ui/dist/patterns/transfer-list.d.ts",
      "signature": "(input: TransferListProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "addLabel",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "availableLabel",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "chosenLabel",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "disabled",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "emptyMessage",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "formatAnnouncement",
          "optional": true,
          "type": "((count: number, destination: string) => string) | undefined",
          "description": ""
        },
        {
          "name": "getMoveLabel",
          "optional": true,
          "type": "((destination: string) => string) | undefined",
          "description": ""
        },
        {
          "name": "getSelectAllLabel",
          "optional": true,
          "type": "((list: string) => string) | undefined",
          "description": ""
        },
        {
          "name": "items",
          "optional": false,
          "type": "readonly TransferItem[]",
          "description": ""
        },
        {
          "name": "onValueChange",
          "optional": false,
          "type": "(value: string[]) => void",
          "description": ""
        },
        {
          "name": "removeLabel",
          "optional": true,
          "type": "string | undefined",
          "description": ""
        },
        {
          "name": "showSelectAll",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "value",
          "optional": false,
          "type": "readonly string[]",
          "description": ""
        }
      ],
      "parts": [],
      "description": "A controlled checklist pattern, not a remote list engine. Order follows the supplied items.",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-patterns-transfer-list/#transferlist",
      "api": "/api/packages/patterns/transfer-list.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "patterns",
          "title": "Application patterns",
          "example": "patterns",
          "source": "/examples/patterns.tsx"
        }
      ]
    },
    {
      "name": "TransitionGroup",
      "entry": "@fayegram-ai/faye-ui/motion/transition-group",
      "guide": "/docs/motion/",
      "declaration": "packages/faye-ui/dist/motion/transition-group.d.ts",
      "signature": "({ children, mode, effect, appear, direction, enterDuration, exitDuration, onExitComplete, layout, className, ...props }: TransitionGroupProps): import(\"react\").JSX.Element",
      "props": [
        {
          "name": "appear",
          "optional": true,
          "type": "boolean | undefined",
          "description": ""
        },
        {
          "name": "children",
          "optional": false,
          "type": "ReactElement<unknown, string | JSXElementConstructor<any>> | readonly ReactElement<unknown, string | JSXElementConstructor<any>>[]",
          "description": ""
        },
        {
          "name": "direction",
          "optional": true,
          "type": "\"start\" | \"end\" | \"left\" | \"right\" | \"up\" | \"down\" | undefined",
          "description": ""
        },
        {
          "name": "effect",
          "optional": true,
          "type": "\"scale\" | \"fade\" | \"slide\" | \"collapse\" | undefined",
          "description": ""
        },
        {
          "name": "enterDuration",
          "optional": true,
          "type": "number | undefined",
          "description": ""
        },
        {
          "name": "exitDuration",
          "optional": true,
          "type": "number | undefined",
          "description": ""
        },
        {
          "name": "layout",
          "optional": true,
          "type": "boolean | undefined",
          "description": "Animate keyed position changes in stack mode, preserving child state and focus."
        },
        {
          "name": "mode",
          "optional": true,
          "type": "\"overlap\" | \"stack\" | undefined",
          "description": ""
        },
        {
          "name": "onExitComplete",
          "optional": true,
          "type": "((key: string) => void) | undefined",
          "description": ""
        }
      ],
      "parts": [],
      "description": "Retains removed keys for their exit; re-entry cancels removal and preserves child state.",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-motion-transition-group/#transitiongroup",
      "api": "/api/packages/motion/transition-group.json",
      "clientBoundary": true,
      "pages": [
        {
          "slug": "consumer-experience",
          "title": "Interactive consumer experience",
          "example": "consumer-experience",
          "source": "/examples/consumer-experience.tsx"
        },
        {
          "slug": "interaction-compositions",
          "title": "Motion and interactive navigation",
          "example": "interaction-compositions",
          "source": "/examples/interaction-compositions.tsx"
        }
      ]
    },
    {
      "name": "VisuallyHidden",
      "entry": "@fayegram-ai/faye-ui/core/visually-hidden",
      "guide": "/docs/foundations/",
      "declaration": "packages/faye-ui/dist/core/visually-hidden.d.ts",
      "signature": "({ className, ...props }: HTMLAttributes<HTMLSpanElement>): import(\"react\").JSX.Element",
      "props": [],
      "parts": [],
      "description": "",
      "propsScope": "Dependency-resolved declaration properties. Common React/native HTML attributes are omitted from the table; use the full declaration and React/native references. Generic and union restrictions remain authoritative in TypeScript.",
      "reference": "/docs/api-core-visually-hidden/#visuallyhidden",
      "api": "/api/packages/core/visually-hidden.json",
      "clientBoundary": false,
      "pages": [
        {
          "slug": "foundations",
          "title": "Typography and surfaces",
          "example": "foundations",
          "source": "/examples/foundations.tsx"
        }
      ]
    }
  ]
}
