@uipath/apollo-wind 2.62.0 → 2.64.0

package/dist/components/forms/mode-aware-field.js

@@ -10,6 +10,7 @@ import { Input } from "../ui/input.js";
 import { InputGroup, InputGroupAddon } from "../ui/input-group.js";
 import { PromptValueControl } from "../ui/prompt-value-control.js";
 import { VariableValueControl } from "../ui/variable-value-control.js";
+import { joinIds } from "./aria-ids.js";
 import { DEFAULT_FIELD_ACTION_REGISTRY, resolveFieldActions, resolveVariables } from "./field-actions.js";
 import { FIELD_CONTROL_GEOMETRY, FieldControl } from "./field-control.js";
 import { DEFAULT_METADATA_FORM_STRINGS } from "./form-strings.js";
@@ -67,7 +68,7 @@ const TEXT_GEOMETRY = {
     labelTarget: 'control',
     insertable: true
 };
-function FieldAnatomy({ field, context, customComponents, disabled, required, options, formField, error }) {
+function FieldAnatomy({ field, context, customComponents, disabled, required, options, formField, error, describedBy }) {
     const form = useFormContext();
     const registry = context.valueModes ?? DEFAULT_VALUE_MODE_REGISTRY;
     const actionRegistry = context.fieldActions ?? DEFAULT_FIELD_ACTION_REGISTRY;
@@ -76,6 +77,7 @@ function FieldAnatomy({ field, context, customComponents, disabled, required, op
     const { name } = field;
     const errorId = `${name}-error`;
     const labelId = `${name}-label`;
+    const controlDescribedBy = joinIds(error && errorId, describedBy);
     const formVariables = context.variables;
     const variables = useCallback(()=>resolveVariables(formVariables, field), [
         formVariables,
@@ -235,6 +237,7 @@ function FieldAnatomy({ field, context, customComponents, disabled, required, op
         required,
         error,
         errorId,
+        describedBy,
         valueModeProps: ()=>({
                 value: inner,
                 onChange: (next)=>writeInner(next),
@@ -258,7 +261,7 @@ function FieldAnatomy({ field, context, customComponents, disabled, required, op
                 controlProps: {
                     'data-slot': 'input-group-control',
                     'aria-invalid': error ? true : void 0,
-                    'aria-describedby': error ? errorId : void 0,
+                    'aria-describedby': controlDescribedBy,
                     'aria-errormessage': error ? errorId : void 0
                 }
             })
@@ -492,7 +495,7 @@ function resolveControl(input) {
         source: 'fallback'
     };
 }
-function FallbackControl({ field, binding, disabled, error, errorId }) {
+function FallbackControl({ field, binding, disabled, error, errorId, describedBy }) {
     const { value } = binding;
     return /*#__PURE__*/ jsx(Input, {
         id: field.name,
@@ -504,7 +507,7 @@ function FallbackControl({ field, binding, disabled, error, errorId }) {
         placeholder: field.placeholder,
         disabled: disabled,
         "aria-invalid": error ? true : void 0,
-        "aria-describedby": error ? errorId : void 0,
+        "aria-describedby": joinIds(error && errorId, describedBy),
         "aria-errormessage": error ? errorId : void 0
     });
 }
@@ -533,7 +536,8 @@ function builtInLiteral(input) {
                 required: required,
                 error: error,
                 controlRef: input.controlRef,
-                labelId: input.labelId
+                labelId: input.labelId,
+                "aria-describedby": joinIds(field.componentProps?.['aria-describedby'], input.describedBy)
             }),
             geometry: registrationGeometry(registration),
             source: 'custom'
@@ -546,7 +550,8 @@ function builtInLiteral(input) {
             options: options,
             disabled: disabled,
             invalid: !!error,
-            strings: strings.boolean
+            strings: strings.boolean,
+            describedBy: input.describedBy
         }),
         geometry: FIELD_CONTROL_GEOMETRY[field.type] ?? unfittedGeometry(field),
         source: 'field-type'

package/dist/components/forms/string-list-field.cjs

@@ -37,7 +37,7 @@ const textarea_cjs_namespaceObject = require("../ui/textarea.cjs");
 function formatTemplate(template, values) {
     return template.replace(/\{\{(\w+)\}\}/g, (match, token)=>token in values ? String(values[token]) : match);
 }
-function StringListField({ field, value, onChange, onBlur, error, disabled = false, required = false, inputRef }) {
+function StringListField({ field, value, onChange, onBlur, error, disabled = false, required = false, inputRef, ariaDescribedBy = error ? `${field.name}-error` : void 0 }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(form_field_cjs_namespaceObject.FormField, {
         "data-slot": "string-list-field",
         children: [
@@ -54,7 +54,8 @@ function StringListField({ field, value, onChange, onBlur, error, disabled = fal
                 onBlur: onBlur,
                 invalid: !!error,
                 disabled: disabled,
-                inputRef: inputRef
+                inputRef: inputRef,
+                ariaDescribedBy: ariaDescribedBy
             }),
             /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(form_field_cjs_namespaceObject.FormFieldDescription, {
                 children: field.description
@@ -66,7 +67,7 @@ function StringListField({ field, value, onChange, onBlur, error, disabled = fal
         ]
     });
 }
-function StringListControl({ field, value, onChange, onBlur, invalid = false, disabled = false, inputRef }) {
+function StringListControl({ field, value, onChange, onBlur, invalid = false, disabled = false, inputRef, ariaDescribedBy = invalid ? `${field.name}-error` : void 0 }) {
     const items = value ?? [];
     const maxItems = field.maxItems ?? 1 / 0;
     const canAdd = !disabled && items.length < maxItems;
@@ -126,7 +127,7 @@ function StringListControl({ field, value, onChange, onBlur, invalid = false, di
                                 disabled: disabled,
                                 "aria-label": `${field.label} ${index + 1}`,
                                 "aria-invalid": invalid || void 0,
-                                "aria-describedby": invalid ? `${field.name}-error` : void 0,
+                                "aria-describedby": ariaDescribedBy,
                                 "aria-errormessage": invalid ? `${field.name}-error` : void 0,
                                 className: "flex-1"
                             }),

package/dist/components/forms/string-list-field.d.ts

@@ -18,6 +18,8 @@ export interface StringListFieldProps {
      * indication of where it is.
      */
     inputRef?: React.Ref<HTMLTextAreaElement>;
+    /** Every row's aria-describedby. Defaults to the error message's id while there is an error. */
+    ariaDescribedBy?: string;
 }
 /**
  * Repeated multiline rows with Add / Remove — the `string-list` field type.
@@ -26,10 +28,10 @@ export interface StringListFieldProps {
  * the info trigger is a Radix tooltip, which throws without one. Inside `MetadataForm` this
  * is handled for you — it mounts a provider for schemas that use tooltip metadata.
  */
-export declare function StringListField({ field, value, onChange, onBlur, error, disabled, required, inputRef, }: StringListFieldProps): import("react/jsx-runtime").JSX.Element;
+export declare function StringListField({ field, value, onChange, onBlur, error, disabled, required, inputRef, ariaDescribedBy, }: StringListFieldProps): import("react/jsx-runtime").JSX.Element;
 export interface StringListControlProps extends Omit<StringListFieldProps, 'error' | 'required'> {
     /** Marks every row invalid and points it at the `${field.name}-error` message. */
     invalid?: boolean;
 }
 /** The rows and Add button of a string list, without its label, description or error. */
-export declare function StringListControl({ field, value, onChange, onBlur, invalid, disabled, inputRef, }: StringListControlProps): import("react/jsx-runtime").JSX.Element;
+export declare function StringListControl({ field, value, onChange, onBlur, invalid, disabled, inputRef, ariaDescribedBy, }: StringListControlProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/forms/string-list-field.js

@@ -7,7 +7,7 @@ import { Textarea } from "../ui/textarea.js";
 function formatTemplate(template, values) {
     return template.replace(/\{\{(\w+)\}\}/g, (match, token)=>token in values ? String(values[token]) : match);
 }
-function StringListField({ field, value, onChange, onBlur, error, disabled = false, required = false, inputRef }) {
+function StringListField({ field, value, onChange, onBlur, error, disabled = false, required = false, inputRef, ariaDescribedBy = error ? `${field.name}-error` : void 0 }) {
     return /*#__PURE__*/ jsxs(FormField, {
         "data-slot": "string-list-field",
         children: [
@@ -24,7 +24,8 @@ function StringListField({ field, value, onChange, onBlur, error, disabled = fal
                 onBlur: onBlur,
                 invalid: !!error,
                 disabled: disabled,
-                inputRef: inputRef
+                inputRef: inputRef,
+                ariaDescribedBy: ariaDescribedBy
             }),
             /*#__PURE__*/ jsx(FormFieldDescription, {
                 children: field.description
@@ -36,7 +37,7 @@ function StringListField({ field, value, onChange, onBlur, error, disabled = fal
         ]
     });
 }
-function StringListControl({ field, value, onChange, onBlur, invalid = false, disabled = false, inputRef }) {
+function StringListControl({ field, value, onChange, onBlur, invalid = false, disabled = false, inputRef, ariaDescribedBy = invalid ? `${field.name}-error` : void 0 }) {
     const items = value ?? [];
     const maxItems = field.maxItems ?? 1 / 0;
     const canAdd = !disabled && items.length < maxItems;
@@ -96,7 +97,7 @@ function StringListControl({ field, value, onChange, onBlur, invalid = false, di
                                 disabled: disabled,
                                 "aria-label": `${field.label} ${index + 1}`,
                                 "aria-invalid": invalid || void 0,
-                                "aria-describedby": invalid ? `${field.name}-error` : void 0,
+                                "aria-describedby": ariaDescribedBy,
                                 "aria-errormessage": invalid ? `${field.name}-error` : void 0,
                                 className: "flex-1"
                             }),

package/dist/components/ui/folder-picker/components/folder-breadcrumb.cjs

@@ -0,0 +1,72 @@
+"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__, {
+    FolderBreadcrumb: ()=>FolderBreadcrumb
+});
+const jsx_runtime_namespaceObject = require("react/jsx-runtime");
+const external_react_namespaceObject = require("react");
+const external_breadcrumb_cjs_namespaceObject = require("../../breadcrumb.cjs");
+function FolderBreadcrumb({ crumbs, onJump, label = 'breadcrumb' }) {
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_breadcrumb_cjs_namespaceObject.Breadcrumb, {
+        "aria-label": label,
+        className: "border-b border-border px-3 py-2",
+        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_breadcrumb_cjs_namespaceObject.BreadcrumbList, {
+            className: "flex-nowrap gap-0.5 overflow-hidden text-xs sm:gap-0.5",
+            children: crumbs.map((crumb, index)=>{
+                const isCurrent = index === crumbs.length - 1;
+                return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(external_react_namespaceObject.Fragment, {
+                    children: [
+                        index > 0 && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_breadcrumb_cjs_namespaceObject.BreadcrumbSeparator, {
+                            className: "shrink-0 text-foreground-subtle [&>svg]:size-3"
+                        }),
+                        /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_breadcrumb_cjs_namespaceObject.BreadcrumbItem, {
+                            className: "min-w-0",
+                            children: isCurrent ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_breadcrumb_cjs_namespaceObject.BreadcrumbPage, {
+                                className: "truncate text-xs font-medium text-foreground",
+                                children: crumb.label
+                            }) : /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_breadcrumb_cjs_namespaceObject.BreadcrumbLink, {
+                                asChild: true,
+                                children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("button", {
+                                    type: "button",
+                                    className: "cursor-pointer truncate rounded px-0.5 text-xs text-foreground-muted transition-colors hover:text-foreground",
+                                    onClick: ()=>onJump(crumb.stack),
+                                    children: crumb.label
+                                })
+                            })
+                        })
+                    ]
+                }, crumb.key);
+            })
+        })
+    });
+}
+exports.FolderBreadcrumb = __webpack_exports__.FolderBreadcrumb;
+for(var __rspack_i in __webpack_exports__)if (-1 === [
+    "FolderBreadcrumb"
+].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/components/ui/folder-picker/components/folder-breadcrumb.d.ts

@@ -0,0 +1,14 @@
+export interface FolderCrumb {
+    /** The path this crumb jumps to, unique down the trail. */
+    key: string;
+    label: string;
+    stack: string[];
+}
+export interface FolderBreadcrumbProps {
+    crumbs: FolderCrumb[];
+    onJump: (stack: string[]) => void;
+    /** Accessible name for the breadcrumb's navigation landmark. */
+    label?: string;
+}
+/** The path above the list. Every segment but the last jumps back up. */
+export declare function FolderBreadcrumb({ crumbs, onJump, label }: FolderBreadcrumbProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/ui/folder-picker/components/folder-breadcrumb.js

@@ -0,0 +1,38 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Fragment } from "react";
+import { Breadcrumb, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator } from "../../breadcrumb.js";
+function FolderBreadcrumb({ crumbs, onJump, label = 'breadcrumb' }) {
+    return /*#__PURE__*/ jsx(Breadcrumb, {
+        "aria-label": label,
+        className: "border-b border-border px-3 py-2",
+        children: /*#__PURE__*/ jsx(BreadcrumbList, {
+            className: "flex-nowrap gap-0.5 overflow-hidden text-xs sm:gap-0.5",
+            children: crumbs.map((crumb, index)=>{
+                const isCurrent = index === crumbs.length - 1;
+                return /*#__PURE__*/ jsxs(Fragment, {
+                    children: [
+                        index > 0 && /*#__PURE__*/ jsx(BreadcrumbSeparator, {
+                            className: "shrink-0 text-foreground-subtle [&>svg]:size-3"
+                        }),
+                        /*#__PURE__*/ jsx(BreadcrumbItem, {
+                            className: "min-w-0",
+                            children: isCurrent ? /*#__PURE__*/ jsx(BreadcrumbPage, {
+                                className: "truncate text-xs font-medium text-foreground",
+                                children: crumb.label
+                            }) : /*#__PURE__*/ jsx(BreadcrumbLink, {
+                                asChild: true,
+                                children: /*#__PURE__*/ jsx("button", {
+                                    type: "button",
+                                    className: "cursor-pointer truncate rounded px-0.5 text-xs text-foreground-muted transition-colors hover:text-foreground",
+                                    onClick: ()=>onJump(crumb.stack),
+                                    children: crumb.label
+                                })
+                            })
+                        })
+                    ]
+                }, crumb.key);
+            })
+        })
+    });
+}
+export { FolderBreadcrumb };

package/dist/components/ui/folder-picker/components/folder-picker-empty-state.cjs

@@ -0,0 +1,75 @@
+"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__, {
+    FolderPickerEmptyState: ()=>FolderPickerEmptyState
+});
+const jsx_runtime_namespaceObject = require("react/jsx-runtime");
+const external_button_cjs_namespaceObject = require("../../button.cjs");
+const external_spinner_cjs_namespaceObject = require("../../spinner.cjs");
+const defaultNoMatchText = (query)=>`No folders match “${query}”.`;
+function FolderPickerEmptyState({ error, loading = false, query = '', emptyText = 'No subfolders.', noMatchText = defaultNoMatchText, loadingText = 'Loading…', onRetry, retryLabel = 'Retry' }) {
+    if (error) return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
+        className: "flex items-center justify-between gap-2 px-3 py-2",
+        children: [
+            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
+                role: "alert",
+                className: "text-xs text-destructive",
+                children: error
+            }),
+            onRetry && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_button_cjs_namespaceObject.Button, {
+                variant: "ghost",
+                size: "xs",
+                type: "button",
+                className: "h-7",
+                onClick: onRetry,
+                children: retryLabel
+            })
+        ]
+    });
+    if (loading) return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
+        role: "status",
+        className: "flex items-center gap-2 px-3 py-2 text-xs text-foreground-muted",
+        children: [
+            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_spinner_cjs_namespaceObject.Spinner, {
+                className: "[&_svg]:size-3.5",
+                "aria-hidden": "true"
+            }),
+            loadingText
+        ]
+    });
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
+        role: "status",
+        className: "px-3 py-2 text-xs text-foreground-muted",
+        children: query ? noMatchText(query) : emptyText
+    });
+}
+exports.FolderPickerEmptyState = __webpack_exports__.FolderPickerEmptyState;
+for(var __rspack_i in __webpack_exports__)if (-1 === [
+    "FolderPickerEmptyState"
+].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/components/ui/folder-picker/components/folder-picker-empty-state.d.ts

@@ -0,0 +1,26 @@
+export interface FolderPickerEmptyStateProps {
+    /** A load that failed. Takes precedence over every other state. */
+    error?: string | null;
+    /** The level on screen has never resolved, so its contents are unknown. */
+    loading?: boolean;
+    /** The active search text, trimmed. Empty when the list is unfiltered. */
+    query?: string;
+    emptyText?: string;
+    noMatchText?: (query: string) => string;
+    loadingText?: string;
+    /** Requests the failed level again. Without it, the error offers no action. */
+    onRetry?: () => void;
+    retryLabel?: string;
+}
+/**
+ * What the list shows when it has no rows.
+ *
+ * The four cases say different things and must not collapse into one message:
+ * a level still loading is not an empty folder, an empty folder is not a failed
+ * search, and neither is an error. Ordered by precedence, so a folder that
+ * fails to load reports the failure rather than claiming to be empty.
+ *
+ * Always renders one of the four messages, falling back to the empty-folder
+ * text, so the caller renders it only when the list has no rows.
+ */
+export declare function FolderPickerEmptyState({ error, loading, query, emptyText, noMatchText, loadingText, onRetry, retryLabel, }: FolderPickerEmptyStateProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/ui/folder-picker/components/folder-picker-empty-state.js

@@ -0,0 +1,41 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Button } from "../../button.js";
+import { Spinner } from "../../spinner.js";
+const defaultNoMatchText = (query)=>`No folders match “${query}”.`;
+function FolderPickerEmptyState({ error, loading = false, query = '', emptyText = 'No subfolders.', noMatchText = defaultNoMatchText, loadingText = 'Loading…', onRetry, retryLabel = 'Retry' }) {
+    if (error) return /*#__PURE__*/ jsxs("div", {
+        className: "flex items-center justify-between gap-2 px-3 py-2",
+        children: [
+            /*#__PURE__*/ jsx("span", {
+                role: "alert",
+                className: "text-xs text-destructive",
+                children: error
+            }),
+            onRetry && /*#__PURE__*/ jsx(Button, {
+                variant: "ghost",
+                size: "xs",
+                type: "button",
+                className: "h-7",
+                onClick: onRetry,
+                children: retryLabel
+            })
+        ]
+    });
+    if (loading) return /*#__PURE__*/ jsxs("div", {
+        role: "status",
+        className: "flex items-center gap-2 px-3 py-2 text-xs text-foreground-muted",
+        children: [
+            /*#__PURE__*/ jsx(Spinner, {
+                className: "[&_svg]:size-3.5",
+                "aria-hidden": "true"
+            }),
+            loadingText
+        ]
+    });
+    return /*#__PURE__*/ jsx("div", {
+        role: "status",
+        className: "px-3 py-2 text-xs text-foreground-muted",
+        children: query ? noMatchText(query) : emptyText
+    });
+}
+export { FolderPickerEmptyState };

package/dist/components/ui/folder-picker/components/folder-picker-footer.cjs

@@ -0,0 +1,70 @@
+"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__, {
+    FolderPickerFooter: ()=>FolderPickerFooter
+});
+const jsx_runtime_namespaceObject = require("react/jsx-runtime");
+const external_button_cjs_namespaceObject = require("../../button.cjs");
+function FolderPickerFooter({ leading, onCancel, onSelect, selectDisabled = false, cancelLabel = 'Cancel', selectLabel = 'Select' }) {
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
+        className: "flex shrink-0 items-center justify-between gap-2 border-t border-border px-3 py-2",
+        children: [
+            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
+                className: "flex min-w-0 items-center gap-1",
+                children: leading
+            }),
+            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
+                className: "flex shrink-0 items-center gap-1",
+                children: [
+                    onCancel && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_button_cjs_namespaceObject.Button, {
+                        variant: "ghost",
+                        size: "xs",
+                        type: "button",
+                        className: "h-7",
+                        onClick: onCancel,
+                        children: cancelLabel
+                    }),
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_button_cjs_namespaceObject.Button, {
+                        variant: "default",
+                        size: "xs",
+                        type: "button",
+                        className: "h-7",
+                        disabled: selectDisabled,
+                        onClick: onSelect,
+                        children: selectLabel
+                    })
+                ]
+            })
+        ]
+    });
+}
+exports.FolderPickerFooter = __webpack_exports__.FolderPickerFooter;
+for(var __rspack_i in __webpack_exports__)if (-1 === [
+    "FolderPickerFooter"
+].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/components/ui/folder-picker/components/folder-picker-footer.d.ts

@@ -0,0 +1,20 @@
+import type { ReactNode } from 'react';
+export interface FolderPickerFooterProps {
+    /** Whatever the picker wants to say about the pending choice. */
+    leading?: ReactNode;
+    /** Omitted when there is nothing to dismiss, which hides the button. */
+    onCancel?: () => void;
+    onSelect: () => void;
+    selectDisabled?: boolean;
+    cancelLabel?: string;
+    selectLabel?: string;
+}
+/**
+ * The action row that ends the interaction.
+ *
+ * "Select", not "Apply": the button finishes choosing a value, where "Apply"
+ * would belong on a form that has been edited. Cancel renders only when the
+ * consumer supplies a handler, so an embedded surface with nothing to dismiss
+ * does not show a button that does nothing.
+ */
+export declare function FolderPickerFooter({ leading, onCancel, onSelect, selectDisabled, cancelLabel, selectLabel, }: FolderPickerFooterProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/ui/folder-picker/components/folder-picker-footer.js

@@ -0,0 +1,36 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Button } from "../../button.js";
+function FolderPickerFooter({ leading, onCancel, onSelect, selectDisabled = false, cancelLabel = 'Cancel', selectLabel = 'Select' }) {
+    return /*#__PURE__*/ jsxs("div", {
+        className: "flex shrink-0 items-center justify-between gap-2 border-t border-border px-3 py-2",
+        children: [
+            /*#__PURE__*/ jsx("div", {
+                className: "flex min-w-0 items-center gap-1",
+                children: leading
+            }),
+            /*#__PURE__*/ jsxs("div", {
+                className: "flex shrink-0 items-center gap-1",
+                children: [
+                    onCancel && /*#__PURE__*/ jsx(Button, {
+                        variant: "ghost",
+                        size: "xs",
+                        type: "button",
+                        className: "h-7",
+                        onClick: onCancel,
+                        children: cancelLabel
+                    }),
+                    /*#__PURE__*/ jsx(Button, {
+                        variant: "default",
+                        size: "xs",
+                        type: "button",
+                        className: "h-7",
+                        disabled: selectDisabled,
+                        onClick: onSelect,
+                        children: selectLabel
+                    })
+                ]
+            })
+        ]
+    });
+}
+export { FolderPickerFooter };

package/dist/components/ui/folder-picker/components/folder-picker-search.cjs

@@ -0,0 +1,79 @@
+"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__, {
+    FolderPickerSearch: ()=>FolderPickerSearch
+});
+const jsx_runtime_namespaceObject = require("react/jsx-runtime");
+const external_lucide_react_namespaceObject = require("lucide-react");
+const external_react_namespaceObject = require("react");
+function FolderPickerSearch({ value, onChange, placeholder = 'Search...', clearLabel = 'Clear search' }) {
+    const inputRef = (0, external_react_namespaceObject.useRef)(null);
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
+        className: "flex items-center border-b border-border px-3",
+        children: [
+            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.Search, {
+                className: "mr-2 size-4 shrink-0 opacity-50"
+            }),
+            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("input", {
+                ref: inputRef,
+                "data-slot": "folder-picker-search",
+                type: "text",
+                autoComplete: "off",
+                "aria-label": placeholder,
+                placeholder: placeholder,
+                value: value,
+                onChange: (event)=>onChange(event.target.value),
+                className: "flex h-9 w-full rounded-md bg-transparent py-2 text-sm outline-none placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50",
+                onKeyDown: (event)=>{
+                    if ('Escape' === event.key && value) {
+                        event.preventDefault();
+                        event.stopPropagation();
+                        onChange('');
+                    }
+                }
+            }),
+            value && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("button", {
+                type: "button",
+                "aria-label": clearLabel,
+                className: "ml-1 grid size-5 shrink-0 cursor-pointer place-items-center rounded text-muted-foreground transition-colors hover:text-foreground",
+                onClick: ()=>{
+                    inputRef.current?.focus();
+                    onChange('');
+                },
+                children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.X, {
+                    className: "size-3.5"
+                })
+            })
+        ]
+    });
+}
+exports.FolderPickerSearch = __webpack_exports__.FolderPickerSearch;
+for(var __rspack_i in __webpack_exports__)if (-1 === [
+    "FolderPickerSearch"
+].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});