@uipath/apollo-wind 2.60.0 → 2.61.0

package/dist/components/ui/button.d.ts

@@ -1,8 +1,8 @@
 import { type VariantProps } from 'class-variance-authority';
 import * as React from 'react';
 declare const buttonVariants: (props?: ({
-    variant?: "text" | "default" | "secondary" | "destructive" | "outline" | "ghost" | "link" | null | undefined;
-    size?: "sm" | "lg" | "default" | "xs" | "2xs" | "3xs" | "4xs" | "icon" | null | undefined;
+    variant?: "default" | "destructive" | "outline" | "secondary" | "ghost" | "link" | "text" | null | undefined;
+    size?: "default" | "lg" | "sm" | "xs" | "2xs" | "3xs" | "4xs" | "icon" | null | undefined;
     icon?: boolean | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {

package/dist/components/ui/command.d.ts

@@ -6,7 +6,7 @@ declare const Command: React.ForwardRefExoticComponent<Omit<{
     ref?: React.Ref<HTMLDivElement>;
 } & {
     asChild?: boolean;
-}, "key" | "asChild" | keyof React.HTMLAttributes<HTMLDivElement>> & {
+}, "asChild" | "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
     label?: string;
     shouldFilter?: boolean;
     filter?: (value: string, search: string, keywords?: string[]) => number;
@@ -22,7 +22,7 @@ declare const CommandInput: React.ForwardRefExoticComponent<Omit<Omit<Pick<Pick<
     ref?: React.Ref<HTMLInputElement>;
 } & {
     asChild?: boolean;
-}, "key" | "asChild" | keyof React.InputHTMLAttributes<HTMLInputElement>>, "type" | "onChange" | "value"> & {
+}, "asChild" | "key" | keyof React.InputHTMLAttributes<HTMLInputElement>>, "type" | "value" | "onChange"> & {
     value?: string;
     onValueChange?: (search: string) => void;
 } & React.RefAttributes<HTMLInputElement>, "ref"> & React.RefAttributes<HTMLInputElement>>;
@@ -32,7 +32,7 @@ declare const CommandList: React.ForwardRefExoticComponent<Omit<{
     ref?: React.Ref<HTMLDivElement>;
 } & {
     asChild?: boolean;
-}, "key" | "asChild" | keyof React.HTMLAttributes<HTMLDivElement>> & {
+}, "asChild" | "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
     label?: string;
 } & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
 declare const CommandEmpty: React.ForwardRefExoticComponent<Omit<{
@@ -41,14 +41,14 @@ declare const CommandEmpty: React.ForwardRefExoticComponent<Omit<{
     ref?: React.Ref<HTMLDivElement>;
 } & {
     asChild?: boolean;
-}, "key" | "asChild" | keyof React.HTMLAttributes<HTMLDivElement>> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+}, "asChild" | "key" | keyof React.HTMLAttributes<HTMLDivElement>> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
 declare const CommandGroup: React.ForwardRefExoticComponent<Omit<{
     children?: React.ReactNode;
 } & Omit<Pick<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
     ref?: React.Ref<HTMLDivElement>;
 } & {
     asChild?: boolean;
-}, "key" | "asChild" | keyof React.HTMLAttributes<HTMLDivElement>>, "value" | "heading"> & {
+}, "asChild" | "key" | keyof React.HTMLAttributes<HTMLDivElement>>, "value" | "heading"> & {
     heading?: React.ReactNode;
     value?: string;
     forceMount?: boolean;
@@ -57,7 +57,7 @@ declare const CommandSeparator: React.ForwardRefExoticComponent<Omit<Pick<Pick<R
     ref?: React.Ref<HTMLDivElement>;
 } & {
     asChild?: boolean;
-}, "key" | "asChild" | keyof React.HTMLAttributes<HTMLDivElement>> & {
+}, "asChild" | "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
     alwaysRender?: boolean;
 } & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
 declare const CommandItem: React.ForwardRefExoticComponent<Omit<{
@@ -66,7 +66,7 @@ declare const CommandItem: React.ForwardRefExoticComponent<Omit<{
     ref?: React.Ref<HTMLDivElement>;
 } & {
     asChild?: boolean;
-}, "key" | "asChild" | keyof React.HTMLAttributes<HTMLDivElement>>, "value" | "disabled" | "onSelect"> & {
+}, "asChild" | "key" | keyof React.HTMLAttributes<HTMLDivElement>>, "disabled" | "value" | "onSelect"> & {
     disabled?: boolean;
     onSelect?: (value: string) => void;
     value?: string;

package/dist/components/ui/dialog.cjs

@@ -158,6 +158,7 @@ const dialog_DialogContent = /*#__PURE__*/ external_react_namespaceObject.forwar
                         className: "flex h-12 shrink-0 items-center gap-3 border-b border-border-subtle px-4",
                         children: [
                             null != headerTitle ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_dialog_namespaceObject.Title, {
+                                "data-slot": "dialog-takeover-title",
                                 className: "min-w-0 flex-1 truncate text-sm font-semibold",
                                 children: headerTitle
                             }) : /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {

package/dist/components/ui/dialog.js

@@ -111,6 +111,7 @@ const dialog_DialogContent = /*#__PURE__*/ forwardRef(function({ className, chil
                         className: "flex h-12 shrink-0 items-center gap-3 border-b border-border-subtle px-4",
                         children: [
                             null != headerTitle ? /*#__PURE__*/ jsx(Title, {
+                                "data-slot": "dialog-takeover-title",
                                 className: "min-w-0 flex-1 truncate text-sm font-semibold",
                                 children: headerTitle
                             }) : /*#__PURE__*/ jsx("div", {

package/dist/components/ui/drawer.cjs

@@ -79,7 +79,7 @@ const DrawerContent = /*#__PURE__*/ external_react_namespaceObject.forwardRef(({
             /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(external_vaul_namespaceObject.Drawer.Content, {
                 ref: ref,
                 "data-slot": "drawer-content",
-                className: (0, index_cjs_namespaceObject.cn)('fixed inset-x-0 bottom-0 z-50 mt-24 flex h-auto flex-col rounded-t-[10px] border bg-background', className),
+                className: (0, index_cjs_namespaceObject.cn)('fixed inset-x-0 bottom-0 z-50 mt-24 flex h-auto flex-col rounded-t-[10px] border bg-background text-foreground', className),
                 ...props,
                 children: [
                     /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {

package/dist/components/ui/drawer.js

@@ -42,7 +42,7 @@ const DrawerContent = /*#__PURE__*/ forwardRef(({ className, children, container
             /*#__PURE__*/ jsxs(Drawer.Content, {
                 ref: ref,
                 "data-slot": "drawer-content",
-                className: cn('fixed inset-x-0 bottom-0 z-50 mt-24 flex h-auto flex-col rounded-t-[10px] border bg-background', className),
+                className: cn('fixed inset-x-0 bottom-0 z-50 mt-24 flex h-auto flex-col rounded-t-[10px] border bg-background text-foreground', className),
                 ...props,
                 children: [
                     /*#__PURE__*/ jsx("div", {

package/dist/components/ui/field-addons/field-menu.cjs

@@ -118,6 +118,7 @@ function FieldMenu({ mode, onSelect, modes, extraModes, actions, checked, modesD
                         return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(external_dropdown_menu_cjs_namespaceObject.DropdownMenuItem, {
                             disabled: action.disabled,
                             onClick: action.onSelect,
+                            className: (0, index_cjs_namespaceObject.cn)(action.destructive && 'text-error focus:text-error'),
                             children: [
                                 ActionIcon ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(ActionIcon, {}) : action.iconDataUri && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("img", {
                                     src: action.iconDataUri,

package/dist/components/ui/field-addons/field-menu.d.ts

@@ -9,6 +9,8 @@ export interface FieldMenuItem {
     /** Icon as a data URI, used when `icon` is absent. */
     iconDataUri?: string;
     disabled?: boolean;
+    /** Styles the row as one that removes or discards something. */
+    destructive?: boolean;
     onSelect: () => void;
 }
 /** A mode to list: a full option, or the id of a built-in mode that `Id` shares. */

package/dist/components/ui/field-addons/field-menu.js

@@ -89,6 +89,7 @@ function FieldMenu({ mode, onSelect, modes, extraModes, actions, checked, modesD
                         return /*#__PURE__*/ jsxs(DropdownMenuItem, {
                             disabled: action.disabled,
                             onClick: action.onSelect,
+                            className: cn(action.destructive && 'text-error focus:text-error'),
                             children: [
                                 ActionIcon ? /*#__PURE__*/ jsx(ActionIcon, {}) : action.iconDataUri && /*#__PURE__*/ jsx("img", {
                                     src: action.iconDataUri,

package/dist/components/ui/field-addons/index.cjs

@@ -25,6 +25,7 @@ var __webpack_exports__ = {};
 __webpack_require__.r(__webpack_exports__);
 __webpack_require__.d(__webpack_exports__, {
     BUILTIN_VALUE_MODES: ()=>external_built_in_value_modes_cjs_namespaceObject.BUILTIN_VALUE_MODES,
+    ValueModeSwitchDialog: ()=>external_value_mode_switch_dialog_cjs_namespaceObject.ValueModeSwitchDialog,
     builtInValueModes: ()=>external_built_in_value_modes_cjs_namespaceObject.builtInValueModes,
     DEFAULT_VALUE_MODE_STRINGS: ()=>external_value_mode_strings_cjs_namespaceObject.DEFAULT_VALUE_MODE_STRINGS,
     FieldMenu: ()=>external_field_menu_cjs_namespaceObject.FieldMenu,
@@ -34,16 +35,19 @@ const external_built_in_value_modes_cjs_namespaceObject = require("./built-in-va
 const external_field_menu_cjs_namespaceObject = require("./field-menu.cjs");
 const external_value_mode_indicator_cjs_namespaceObject = require("./value-mode-indicator.cjs");
 const external_value_mode_strings_cjs_namespaceObject = require("./value-mode-strings.cjs");
+const external_value_mode_switch_dialog_cjs_namespaceObject = require("./value-mode-switch-dialog.cjs");
 exports.BUILTIN_VALUE_MODES = __webpack_exports__.BUILTIN_VALUE_MODES;
 exports.DEFAULT_VALUE_MODE_STRINGS = __webpack_exports__.DEFAULT_VALUE_MODE_STRINGS;
 exports.FieldMenu = __webpack_exports__.FieldMenu;
 exports.ValueModeIndicator = __webpack_exports__.ValueModeIndicator;
+exports.ValueModeSwitchDialog = __webpack_exports__.ValueModeSwitchDialog;
 exports.builtInValueModes = __webpack_exports__.builtInValueModes;
 for(var __rspack_i in __webpack_exports__)if (-1 === [
     "BUILTIN_VALUE_MODES",
     "DEFAULT_VALUE_MODE_STRINGS",
     "FieldMenu",
     "ValueModeIndicator",
+    "ValueModeSwitchDialog",
     "builtInValueModes"
 ].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
 Object.defineProperty(exports, '__esModule', {

package/dist/components/ui/field-addons/index.d.ts

@@ -2,3 +2,4 @@ export { BUILTIN_VALUE_MODES, type BuiltInValueModesOptions, builtInValueModes,
 export { FieldMenu, type FieldMenuItem, type FieldMenuMode, type FieldMenuProps, } from './field-menu';
 export { ValueModeIndicator, type ValueModeIndicatorProps } from './value-mode-indicator';
 export { DEFAULT_VALUE_MODE_STRINGS, type ValueMode, type ValueModeStrings, } from './value-mode-strings';
+export { ValueModeSwitchDialog, type ValueModeSwitchDialogProps } from './value-mode-switch-dialog';

package/dist/components/ui/field-addons/index.js

@@ -2,4 +2,5 @@ import { BUILTIN_VALUE_MODES, builtInValueModes } from "./built-in-value-modes.j
 import { FieldMenu } from "./field-menu.js";
 import { ValueModeIndicator } from "./value-mode-indicator.js";
 import { DEFAULT_VALUE_MODE_STRINGS } from "./value-mode-strings.js";
-export { BUILTIN_VALUE_MODES, DEFAULT_VALUE_MODE_STRINGS, FieldMenu, ValueModeIndicator, builtInValueModes };
+import { ValueModeSwitchDialog } from "./value-mode-switch-dialog.js";
+export { BUILTIN_VALUE_MODES, DEFAULT_VALUE_MODE_STRINGS, FieldMenu, ValueModeIndicator, ValueModeSwitchDialog, builtInValueModes };

package/dist/components/ui/field-addons/value-mode-strings.cjs

@@ -38,9 +38,15 @@ const DEFAULT_VALUE_MODE_STRINGS = {
     promptTitle: 'Prompt',
     promptDescription: 'Describe the value for the agent to fill in',
     variablePlaceholder: 'Select a variable',
+    variableSearchPlaceholder: 'Search variables...',
+    variableEmpty: 'No variables found.',
     promptPlaceholder: 'Describe the value',
     fieldActions: 'Field actions',
-    expressionIndicator: 'JavaScript expression'
+    expressionIndicator: 'JavaScript expression',
+    lossyTitle: 'Switch value mode?',
+    lossyDescription: 'The current value will be cleared. This cannot be undone.',
+    confirm: 'Switch',
+    cancel: 'Cancel'
 };
 exports.DEFAULT_VALUE_MODE_STRINGS = __webpack_exports__.DEFAULT_VALUE_MODE_STRINGS;
 for(var __rspack_i in __webpack_exports__)if (-1 === [

package/dist/components/ui/field-addons/value-mode-strings.d.ts

@@ -20,11 +20,20 @@ export interface ValueModeStrings {
     promptDescription: string;
     /** Shown in the variable control while no variable is bound. */
     variablePlaceholder: string;
+    /** The variable picker's search box and its empty state. */
+    variableSearchPlaceholder: string;
+    variableEmpty: string;
     /** Shown in the prompt control while the prompt is empty. */
     promptPlaceholder: string;
     /** Names the menu trigger when it offers only actions and no modes. */
     fieldActions: string;
     /** Hover text on the `=` indicator. */
     expressionIndicator: string;
+    /** Title of the dialog confirming a switch that loses the current value. */
+    lossyTitle: string;
+    lossyDescription: string;
+    /** The dialog's confirm and cancel buttons. */
+    confirm: string;
+    cancel: string;
 }
 export declare const DEFAULT_VALUE_MODE_STRINGS: ValueModeStrings;

package/dist/components/ui/field-addons/value-mode-strings.js

@@ -10,8 +10,14 @@ const DEFAULT_VALUE_MODE_STRINGS = {
     promptTitle: 'Prompt',
     promptDescription: 'Describe the value for the agent to fill in',
     variablePlaceholder: 'Select a variable',
+    variableSearchPlaceholder: 'Search variables...',
+    variableEmpty: 'No variables found.',
     promptPlaceholder: 'Describe the value',
     fieldActions: 'Field actions',
-    expressionIndicator: 'JavaScript expression'
+    expressionIndicator: 'JavaScript expression',
+    lossyTitle: 'Switch value mode?',
+    lossyDescription: 'The current value will be cleared. This cannot be undone.',
+    confirm: 'Switch',
+    cancel: 'Cancel'
 };
 export { DEFAULT_VALUE_MODE_STRINGS };

package/dist/components/ui/field-addons/value-mode-switch-dialog.cjs

@@ -0,0 +1,73 @@
+"use strict";
+var __webpack_require__ = {};
+(()=>{
+    __webpack_require__.d = (exports1, definition)=>{
+        for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
+            enumerable: true,
+            get: definition[key]
+        });
+    };
+})();
+(()=>{
+    __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
+})();
+(()=>{
+    __webpack_require__.r = (exports1)=>{
+        if ("u" > typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
+            value: 'Module'
+        });
+        Object.defineProperty(exports1, '__esModule', {
+            value: true
+        });
+    };
+})();
+var __webpack_exports__ = {};
+__webpack_require__.r(__webpack_exports__);
+__webpack_require__.d(__webpack_exports__, {
+    ValueModeSwitchDialog: ()=>ValueModeSwitchDialog
+});
+const jsx_runtime_namespaceObject = require("react/jsx-runtime");
+const external_alert_dialog_cjs_namespaceObject = require("../alert-dialog.cjs");
+const external_value_mode_strings_cjs_namespaceObject = require("./value-mode-strings.cjs");
+function ValueModeSwitchDialog({ open, onConfirm, onCancel, title, description, confirmLabel, strings }) {
+    const text = {
+        ...external_value_mode_strings_cjs_namespaceObject.DEFAULT_VALUE_MODE_STRINGS,
+        ...strings
+    };
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_alert_dialog_cjs_namespaceObject.AlertDialog, {
+        open: open,
+        onOpenChange: (next)=>!next && onCancel(),
+        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(external_alert_dialog_cjs_namespaceObject.AlertDialogContent, {
+            children: [
+                /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(external_alert_dialog_cjs_namespaceObject.AlertDialogHeader, {
+                    children: [
+                        /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_alert_dialog_cjs_namespaceObject.AlertDialogTitle, {
+                            children: title ?? text.lossyTitle
+                        }),
+                        /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_alert_dialog_cjs_namespaceObject.AlertDialogDescription, {
+                            children: description ?? text.lossyDescription
+                        })
+                    ]
+                }),
+                /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(external_alert_dialog_cjs_namespaceObject.AlertDialogFooter, {
+                    children: [
+                        /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_alert_dialog_cjs_namespaceObject.AlertDialogCancel, {
+                            children: text.cancel
+                        }),
+                        /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_alert_dialog_cjs_namespaceObject.AlertDialogAction, {
+                            onClick: onConfirm,
+                            children: confirmLabel ?? text.confirm
+                        })
+                    ]
+                })
+            ]
+        })
+    });
+}
+exports.ValueModeSwitchDialog = __webpack_exports__.ValueModeSwitchDialog;
+for(var __rspack_i in __webpack_exports__)if (-1 === [
+    "ValueModeSwitchDialog"
+].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/components/ui/field-addons/value-mode-switch-dialog.d.ts

@@ -0,0 +1,16 @@
+import { type ValueModeStrings } from './value-mode-strings';
+export interface ValueModeSwitchDialogProps {
+    open: boolean;
+    onConfirm: () => void;
+    onCancel: () => void;
+    /** Replaces `strings.lossyTitle`, for a switch whose loss the codec describes itself. */
+    title?: string;
+    /** Replaces `strings.lossyDescription`. */
+    description?: string;
+    /** Replaces `strings.confirm`, such as Replace for a value about to be overwritten. */
+    confirmLabel?: string;
+    /** Overrides for any subset of the English strings. */
+    strings?: Partial<ValueModeStrings>;
+}
+/** Confirms a mode switch that would lose the field's current value. */
+export declare function ValueModeSwitchDialog({ open, onConfirm, onCancel, title, description, confirmLabel, strings, }: ValueModeSwitchDialogProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/ui/field-addons/value-mode-switch-dialog.js

@@ -0,0 +1,39 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogTitle } from "../alert-dialog.js";
+import { DEFAULT_VALUE_MODE_STRINGS } from "./value-mode-strings.js";
+function ValueModeSwitchDialog({ open, onConfirm, onCancel, title, description, confirmLabel, strings }) {
+    const text = {
+        ...DEFAULT_VALUE_MODE_STRINGS,
+        ...strings
+    };
+    return /*#__PURE__*/ jsx(AlertDialog, {
+        open: open,
+        onOpenChange: (next)=>!next && onCancel(),
+        children: /*#__PURE__*/ jsxs(AlertDialogContent, {
+            children: [
+                /*#__PURE__*/ jsxs(AlertDialogHeader, {
+                    children: [
+                        /*#__PURE__*/ jsx(AlertDialogTitle, {
+                            children: title ?? text.lossyTitle
+                        }),
+                        /*#__PURE__*/ jsx(AlertDialogDescription, {
+                            children: description ?? text.lossyDescription
+                        })
+                    ]
+                }),
+                /*#__PURE__*/ jsxs(AlertDialogFooter, {
+                    children: [
+                        /*#__PURE__*/ jsx(AlertDialogCancel, {
+                            children: text.cancel
+                        }),
+                        /*#__PURE__*/ jsx(AlertDialogAction, {
+                            onClick: onConfirm,
+                            children: confirmLabel ?? text.confirm
+                        })
+                    ]
+                })
+            ]
+        })
+    });
+}
+export { ValueModeSwitchDialog };

package/dist/components/ui/form-field.cjs

@@ -93,7 +93,7 @@ const FormFieldError = /*#__PURE__*/ external_react_namespaceObject.forwardRef((
     });
 });
 FormFieldError.displayName = 'FormFieldError';
-const FormFieldHeader = /*#__PURE__*/ external_react_namespaceObject.forwardRef(({ label, htmlFor, required, tooltip, tooltipAriaLabel, leading, badge, actions, variant = 'default', className, ...props }, ref)=>{
+const FormFieldHeader = /*#__PURE__*/ external_react_namespaceObject.forwardRef(({ label, labelId, htmlFor, required, tooltip, tooltipAriaLabel, leading, badge, actions, variant = 'default', className, ...props }, ref)=>{
     if (!label && !actions) return null;
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
         ref: ref,
@@ -106,6 +106,7 @@ const FormFieldHeader = /*#__PURE__*/ external_react_namespaceObject.forwardRef(
                 children: [
                     leading,
                     label && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(FormFieldLabel, {
+                        id: labelId,
                         htmlFor: htmlFor,
                         required: required,
                         tooltip: tooltip,

package/dist/components/ui/form-field.d.ts

@@ -51,6 +51,8 @@ export type FormFieldErrorProps = React.ComponentPropsWithoutRef<'p'>;
 declare const FormFieldError: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
 export interface FormFieldHeaderProps extends Pick<FormFieldLabelProps, 'htmlFor' | 'required' | 'tooltip' | 'tooltipAriaLabel'>, Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> {
     label?: React.ReactNode;
+    /** The label element's id, for a control that names itself with `aria-labelledby`. */
+    labelId?: string;
     /** Ahead of the label, such as a type glyph. Never opens the row on its own. */
     leading?: React.ReactNode;
     /** After the label, such as a spelled-out type chip. Never opens the row on its own. */

package/dist/components/ui/form-field.js

@@ -61,7 +61,7 @@ const FormFieldError = /*#__PURE__*/ forwardRef(({ children, className, ...props
     });
 });
 FormFieldError.displayName = 'FormFieldError';
-const FormFieldHeader = /*#__PURE__*/ forwardRef(({ label, htmlFor, required, tooltip, tooltipAriaLabel, leading, badge, actions, variant = 'default', className, ...props }, ref)=>{
+const FormFieldHeader = /*#__PURE__*/ forwardRef(({ label, labelId, htmlFor, required, tooltip, tooltipAriaLabel, leading, badge, actions, variant = 'default', className, ...props }, ref)=>{
     if (!label && !actions) return null;
     return /*#__PURE__*/ jsxs("div", {
         ref: ref,
@@ -74,6 +74,7 @@ const FormFieldHeader = /*#__PURE__*/ forwardRef(({ label, htmlFor, required, to
                 children: [
                     leading,
                     label && /*#__PURE__*/ jsx(FormFieldLabel, {
+                        id: labelId,
                         htmlFor: htmlFor,
                         required: required,
                         tooltip: tooltip,