@box/content-field 1.42.27 → 1.42.28

package/dist/esm/lib/content-field.js

@@ -9,67 +9,69 @@ import g from "clsx";
 import { forwardRef as _, useRef as v } from "react";
 import { useIntl as y } from "react-intl";
 import { jsx as b, jsxs as x } from "react/jsx-runtime";
-var S = (e) => e?.type === "variable", C = ({ icon: a, variant: o, isVariableWithTitle: s }) => a ? /* @__PURE__ */ b(t, { icon: a }) : b(s ? o === "file" ? e : r : o === "file" ? n : i, {}), w = /* @__PURE__ */ _(({ icon: e, placeholder: t, onClick: n, onClear: r, title: i, error: _, disabled: w = !1, variant: T = "folder", ...E }, D) => {
-	let O = y(), { enableModernizedComponents: k } = d(), { titleValue: A } = i ?? {}, j = v(null), M = A ?? t, { TooltipComponent: N, tooltipProps: P } = o(j, i), F = (e) => {
-		j.current?.focus(), r(e);
-	}, I = f("inline-error-"), L = S(i) && !!A, R = _ ? "error" : "standard";
+var S = (e) => e?.type === "variable", C = ({ icon: a, variant: o, isVariableWithTitle: s }) => a ? /* @__PURE__ */ b(t, { icon: a }) : b(s ? o === "file" ? e : r : o === "file" ? n : i, {}), w = /* @__PURE__ */ _(({ icon: e, placeholder: t, onClick: n, onClear: r, title: i, error: _, clearButtonRef: w, disabled: T = !1, variant: E = "folder", triggerRef: D, ...O }, k) => {
+	let A = y(), { enableModernizedComponents: j } = d(), { titleValue: M } = i ?? {}, N = v(null), P = M ?? t, { TooltipComponent: F, tooltipProps: I } = o(N, i), L = (e) => {
+		N.current?.focus(), r(e);
+	}, R = f("inline-error-"), z = S(i) && !!M, B = _ ? "error" : "standard";
 	return /* @__PURE__ */ x("div", {
-		ref: D,
+		ref: k,
 		className: a.contentFieldWrapper,
-		"data-modern": k,
+		"data-modern": j,
 		children: [/* @__PURE__ */ x("div", {
 			className: a.contentField,
-			children: [/* @__PURE__ */ b(N, {
-				...P,
-				variant: R,
+			children: [/* @__PURE__ */ b(F, {
+				...I,
+				variant: B,
 				children: /* @__PURE__ */ x(c, {
-					"aria-describedby": I,
+					ref: D,
+					"aria-describedby": R,
 					className: g(a.contentButton, {
 						[a.hasSelection]: i,
 						[a.error]: !!_,
-						[a.disabled]: w
+						[a.disabled]: T
 					}),
-					disabled: w,
+					disabled: T,
 					onClick: n,
 					type: "button",
-					...E,
+					...O,
 					children: [/* @__PURE__ */ b(C, {
 						icon: e,
-						isVariableWithTitle: L,
-						variant: T
+						isVariableWithTitle: z,
+						variant: E
 					}), /* @__PURE__ */ b("div", {
 						className: a.labelWrapper,
 						children: /* @__PURE__ */ b(u, {
-							ref: j,
+							ref: N,
 							as: "span",
 							className: g(a.contentLabel, {
-								[a.variable]: L,
-								[a.variableError]: L && _
+								[a.variable]: z,
+								[a.variableError]: z && _
 							}),
-							variant: L ? "bodyDefaultBold" : "bodyDefault",
-							children: M
+							variant: z ? "bodyDefaultBold" : "bodyDefault",
+							children: P
 						})
 					})]
 				})
-			}), A && /* @__PURE__ */ b(c, {
-				"aria-label": O.formatMessage(s.clearButtonLabel),
+			}), M && /* @__PURE__ */ b(c, {
+				ref: w,
+				"aria-label": A.formatMessage(s.clearButtonLabel),
 				className: g(a.clearButton, {
-					[a.hasSelection]: A,
+					[a.hasSelection]: M,
 					[a.error]: !!_,
-					[a.disabled]: w
+					[a.disabled]: T
 				}),
-				disabled: w,
-				onClick: F,
+				disabled: T,
+				onClick: L,
 				type: "button",
 				children: /* @__PURE__ */ b(p, {
-					height: k ? h : m,
+					height: j ? h : m,
 					role: "presentation",
-					width: k ? h : m
+					width: j ? h : m
 				})
 			})]
 		}), /* @__PURE__ */ b(l, {
 			className: a.inlineError,
-			id: I,
+			id: R,
 			children: _
 		})]
 	});

package/dist/types/lib/types.d.ts

@@ -1,4 +1,4 @@
-import { ReactNode, MouseEvent, SVGProps, ComponentType } from 'react';
+import { ComponentType, MouseEvent, ReactNode, Ref, SVGProps } from 'react';
 /** Configuration for a content field with a fixed display title */
 export interface ContentFieldConstantTitle {
     /** The text to display as the title */
@@ -25,6 +25,8 @@ export interface ContentFieldProps {
     error?: ReactNode;
     onClear: (e: MouseEvent<HTMLButtonElement>) => void;
     onClick: (e: MouseEvent<HTMLButtonElement>) => void;
+    clearButtonRef?: Ref<HTMLButtonElement>;
     disabled?: boolean;
     variant?: 'folder' | 'file';
+    triggerRef?: Ref<HTMLButtonElement>;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@box/content-field",
-    "version": "1.42.27",
+    "version": "1.42.28",
     "license": "SEE LICENSE IN LICENSE",
     "peerDependencies": {
         "@ariakit/react": "^0.4.21",