@box/content-field 2.1.34 → 2.1.36

package/dist/chunks/content-field-icon.js

@@ -1,39 +1 @@
-import { useBlueprintModernization as e } from "@box/blueprint-web";
-import { FileDefault as t, Folder as n } from "@box/blueprint-web-assets/icons/Fill";
-import { Space4 as r, Space6 as i, bpSpace040 as a, bpSpace060 as o } from "@box/blueprint-web-assets/tokens/tokens";
-import { createElement as s } from "react";
-import { FileVariable as c, FolderVariable as l } from "@box/blueprint-web-assets/icons/Content";
-import { jsx as u } from "react/jsx-runtime";
-import '../styles/content-field-icon.css';var d = {
-	contentFieldWrapper: "_contentFieldWrapper_hg8tt_1",
-	contentField: "_contentField_hg8tt_1",
-	inlineError: "_inlineError_hg8tt_64",
-	contentButton: "_contentButton_hg8tt_68",
-	error: "_error_hg8tt_82",
-	hasSelection: "_hasSelection_hg8tt_86",
-	disabled: "_disabled_hg8tt_99",
-	labelWrapper: "_labelWrapper_hg8tt_116",
-	contentLabel: "_contentLabel_hg8tt_122",
-	variable: "_variable_hg8tt_127",
-	variableError: "_variableError_hg8tt_131",
-	circledIconContainer: "_circledIconContainer_hg8tt_135",
-	clearButton: "_clearButton_hg8tt_146"
-}, f = ({ icon: t }) => {
-	let { enableModernizedComponents: n } = e();
-	return /*#__PURE__*/ s(t, {
-		role: "presentation",
-		height: n ? o : i,
-		width: n ? o : i
-	});
-}, p = ({ icon: t }) => {
-	let { enableModernizedComponents: n } = e();
-	return /* @__PURE__ */ u("div", {
-		className: d.circledIconContainer,
-		children: /*#__PURE__*/ s(t, {
-			role: "presentation",
-			height: n ? a : r,
-			width: n ? a : r
-		})
-	});
-}, m = () => /* @__PURE__ */ u(p, { icon: n }), h = () => /* @__PURE__ */ u(p, { icon: t }), g = () => /* @__PURE__ */ u(f, { icon: l }), _ = () => /* @__PURE__ */ u(f, { icon: c });
-export { _ as a, f as i, h as n, g as o, m as r, d as s, p as t };
+import{useBlueprintModernization}from"@box/blueprint-web";import{FileDefault,Folder}from"@box/blueprint-web-assets/icons/Fill";import{Space4,Space6,bpSpace040,bpSpace060}from"@box/blueprint-web-assets/tokens/tokens";import{createElement}from"react";import{FileVariable,FolderVariable}from"@box/blueprint-web-assets/icons/Content";import{jsx}from"react/jsx-runtime";import '../styles/content-field-icon.css';var content_field_module_default={contentFieldWrapper:`_contentFieldWrapper_hg8tt_1`,contentField:`_contentField_hg8tt_1`,inlineError:`_inlineError_hg8tt_64`,contentButton:`_contentButton_hg8tt_68`,error:`_error_hg8tt_82`,hasSelection:`_hasSelection_hg8tt_86`,disabled:`_disabled_hg8tt_99`,labelWrapper:`_labelWrapper_hg8tt_116`,contentLabel:`_contentLabel_hg8tt_122`,variable:`_variable_hg8tt_127`,variableError:`_variableError_hg8tt_131`,circledIconContainer:`_circledIconContainer_hg8tt_135`,clearButton:`_clearButton_hg8tt_146`},ContentFieldIcon=({icon})=>{let{enableModernizedComponents}=useBlueprintModernization();return createElement(icon,{role:`presentation`,height:enableModernizedComponents?bpSpace060:Space6,width:enableModernizedComponents?bpSpace060:Space6})},ContentFieldCircledIcon=({icon})=>{let{enableModernizedComponents}=useBlueprintModernization();return jsx(`div`,{className:content_field_module_default.circledIconContainer,children:createElement(icon,{role:`presentation`,height:enableModernizedComponents?bpSpace040:Space4,width:enableModernizedComponents?bpSpace040:Space4})})},ContentFieldFolderIcon=()=>jsx(ContentFieldCircledIcon,{icon:Folder}),ContentFieldFileIcon=()=>jsx(ContentFieldCircledIcon,{icon:FileDefault}),ContentFieldVariableFolderIcon=()=>jsx(ContentFieldIcon,{icon:FolderVariable}),ContentFieldVariableFileIcon=()=>jsx(ContentFieldIcon,{icon:FileVariable});export{ContentFieldVariableFileIcon as a,ContentFieldIcon as i,ContentFieldFileIcon as n,ContentFieldVariableFolderIcon as o,ContentFieldFolderIcon as r,content_field_module_default as s,ContentFieldCircledIcon as t};

package/dist/esm/index.js

@@ -1,2 +1 @@
-import { ContentField as e } from "./lib/content-field.js";
-export { e as ContentField };
+import{ContentField}from"./lib/content-field.js";export{ContentField};

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

@@ -1,2 +1 @@
-import { a as e, i as t, n, o as r, r as i, t as a } from "../../chunks/content-field-icon.js";
-export { a as ContentFieldCircledIcon, n as ContentFieldFileIcon, i as ContentFieldFolderIcon, t as ContentFieldIcon, e as ContentFieldVariableFileIcon, r as ContentFieldVariableFolderIcon };
+import{a as ContentFieldVariableFileIcon,i as ContentFieldIcon,n as ContentFieldFileIcon,o as ContentFieldVariableFolderIcon,r as ContentFieldFolderIcon,t as ContentFieldCircledIcon}from"../../chunks/content-field-icon.js";export{ContentFieldCircledIcon,ContentFieldFileIcon,ContentFieldFolderIcon,ContentFieldIcon,ContentFieldVariableFileIcon,ContentFieldVariableFolderIcon};

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

@@ -1,79 +1 @@
-import { a as e, i as t, n, o as r, r as i, s as a } from "../../chunks/content-field-icon.js";
-import { useContentFieldTooltip as o } from "./hooks/useContentFieldTooltip.js";
-import s from "./messages.js";
-import { Button as c } from "@ariakit/react";
-import { InlineError as l, Text as u, useBlueprintModernization as d, useUniqueId as f } from "@box/blueprint-web";
-import { XMark as p } from "@box/blueprint-web-assets/icons/Fill";
-import { Space6 as m, bpSpace040 as h } from "@box/blueprint-web-assets/tokens/tokens";
-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: _, 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: k,
-		className: a.contentFieldWrapper,
-		"data-modern": j,
-		children: [/* @__PURE__ */ x("div", {
-			className: a.contentField,
-			children: [/* @__PURE__ */ b(F, {
-				...I,
-				variant: B,
-				children: /* @__PURE__ */ x(c, {
-					ref: D,
-					"aria-describedby": R,
-					className: g(a.contentButton, {
-						[a.hasSelection]: i,
-						[a.error]: !!_,
-						[a.disabled]: T
-					}),
-					disabled: T,
-					onClick: n,
-					type: "button",
-					...O,
-					children: [/* @__PURE__ */ b(C, {
-						icon: e,
-						isVariableWithTitle: z,
-						variant: E
-					}), /* @__PURE__ */ b("div", {
-						className: a.labelWrapper,
-						children: /* @__PURE__ */ b(u, {
-							ref: N,
-							as: "span",
-							className: g(a.contentLabel, {
-								[a.variable]: z,
-								[a.variableError]: z && _
-							}),
-							variant: z ? "bodyDefaultBold" : "bodyDefault",
-							children: P
-						})
-					})]
-				})
-			}), M && /* @__PURE__ */ b(c, {
-				ref: w,
-				"aria-label": A.formatMessage(s.clearButtonLabel),
-				className: g(a.clearButton, {
-					[a.hasSelection]: M,
-					[a.error]: !!_,
-					[a.disabled]: T
-				}),
-				disabled: T,
-				onClick: L,
-				type: "button",
-				children: /* @__PURE__ */ b(p, {
-					height: j ? h : m,
-					role: "presentation",
-					width: j ? h : m
-				})
-			})]
-		}), /* @__PURE__ */ b(l, {
-			className: a.inlineError,
-			id: R,
-			children: _
-		})]
-	});
-});
-export { w as ContentField };
+import{a as ContentFieldVariableFileIcon,i as ContentFieldIcon,n as ContentFieldFileIcon,o as ContentFieldVariableFolderIcon,r as ContentFieldFolderIcon,s as content_field_module_default}from"../../chunks/content-field-icon.js";import{useContentFieldTooltip}from"./hooks/useContentFieldTooltip.js";import messages_default from"./messages.js";import{Button}from"@ariakit/react";import{InlineError,Text,useBlueprintModernization,useUniqueId}from"@box/blueprint-web";import{XMark}from"@box/blueprint-web-assets/icons/Fill";import{Space6,bpSpace040}from"@box/blueprint-web-assets/tokens/tokens";import clsx from"clsx";import{forwardRef,useRef}from"react";import{useIntl}from"react-intl";import{jsx,jsxs}from"react/jsx-runtime";var isVariable=title=>title?.type===`variable`,ContentIcon=({icon,variant,isVariableWithTitle})=>icon?jsx(ContentFieldIcon,{icon}):jsx(isVariableWithTitle?variant===`file`?ContentFieldVariableFileIcon:ContentFieldVariableFolderIcon:variant===`file`?ContentFieldFileIcon:ContentFieldFolderIcon,{}),ContentField=forwardRef(({icon,placeholder,onClick,onClear,title,error,clearButtonRef,disabled=!1,variant=`folder`,triggerRef,...rest},forwardedRef)=>{let intl=useIntl(),{enableModernizedComponents}=useBlueprintModernization(),{titleValue}=title??{},labelRef=useRef(null),textValue=titleValue??placeholder,{TooltipComponent,tooltipProps}=useContentFieldTooltip(labelRef,title),handleOnClickClearButton=event=>{labelRef.current?.focus(),onClear(event)},inlineErrorId=useUniqueId(`inline-error-`),isVariableWithTitle=isVariable(title)&&!!titleValue,tooltipVariant=error?`error`:`standard`;return jsxs(`div`,{ref:forwardedRef,className:content_field_module_default.contentFieldWrapper,"data-modern":enableModernizedComponents,children:[jsxs(`div`,{className:content_field_module_default.contentField,children:[jsx(TooltipComponent,{...tooltipProps,variant:tooltipVariant,children:jsxs(Button,{ref:triggerRef,"aria-describedby":inlineErrorId,className:clsx(content_field_module_default.contentButton,{[content_field_module_default.hasSelection]:title,[content_field_module_default.error]:!!error,[content_field_module_default.disabled]:disabled}),disabled,onClick,type:`button`,...rest,children:[jsx(ContentIcon,{icon,isVariableWithTitle,variant}),jsx(`div`,{className:content_field_module_default.labelWrapper,children:jsx(Text,{ref:labelRef,as:`span`,className:clsx(content_field_module_default.contentLabel,{[content_field_module_default.variable]:isVariableWithTitle,[content_field_module_default.variableError]:isVariableWithTitle&&error}),variant:isVariableWithTitle?`bodyDefaultBold`:`bodyDefault`,children:textValue})})]})}),titleValue&&jsx(Button,{ref:clearButtonRef,"aria-label":intl.formatMessage(messages_default.clearButtonLabel),className:clsx(content_field_module_default.clearButton,{[content_field_module_default.hasSelection]:titleValue,[content_field_module_default.error]:!!error,[content_field_module_default.disabled]:disabled}),disabled,onClick:handleOnClickClearButton,type:`button`,children:jsx(XMark,{height:enableModernizedComponents?bpSpace040:Space6,role:`presentation`,width:enableModernizedComponents?bpSpace040:Space6})})]}),jsx(InlineError,{className:content_field_module_default.inlineError,id:inlineErrorId,children:error})]})});export{ContentField};

package/dist/esm/lib/hooks/useContentFieldTooltip.js

@@ -1,15 +1 @@
-import { Tooltip as e, useFullTextTooltip as t } from "@box/blueprint-web";
-var n = (n, r) => {
-	let { Wrapper: i, wrapperProps: a } = t({
-		ref: n,
-		textValue: r?.titleValue
-	}), o = r?.type === "variable";
-	return {
-		TooltipComponent: o ? e : i,
-		tooltipProps: {
-			content: o ? r?.technicalName : r?.titleValue,
-			wrapperProps: a
-		}
-	};
-};
-export { n as useContentFieldTooltip };
+import{Tooltip,useFullTextTooltip}from"@box/blueprint-web";var useContentFieldTooltip=(ref,title)=>{let{Wrapper:FullTextTooltip,wrapperProps}=useFullTextTooltip({ref,textValue:title?.titleValue}),isVariable=title?.type===`variable`;return{TooltipComponent:isVariable?Tooltip:FullTextTooltip,tooltipProps:{content:isVariable?title?.technicalName:title?.titleValue,wrapperProps}}};export{useContentFieldTooltip};

package/dist/esm/lib/messages.js

@@ -1,6 +1 @@
-import { defineMessages as e } from "react-intl";
-var t = e({ clearButtonLabel: {
-	id: "contentField.clearButtonLabel",
-	defaultMessage: "Clear"
-} });
-export { t as default };
+import{defineMessages}from"react-intl";var messages_default=defineMessages({clearButtonLabel:{id:`contentField.clearButtonLabel`,defaultMessage:`Clear`}});export{messages_default as default};

package/package.json

@@ -1,20 +1,20 @@
 {
     "name": "@box/content-field",
-    "version": "2.1.34",
+    "version": "2.1.36",
     "license": "SEE LICENSE IN LICENSE",
     "peerDependencies": {
         "@ariakit/react": "^0.4.21",
-        "@box/blueprint-web": "^16.13.0",
-        "@box/blueprint-web-assets": "^5.5.9",
+        "@box/blueprint-web": "^16.13.2",
+        "@box/blueprint-web-assets": "^5.5.11",
         "react": "^18.0.0",
         "react-dom": "^18.0.0",
         "react-intl": "^6.4.2"
     },
     "devDependencies": {
-        "@box/blueprint-web": "^16.13.0",
-        "@box/blueprint-web-assets": "^5.5.9",
-        "@box/eslint-plugin-blueprint": "2.1.10",
-        "@box/storybook-utils": "1.1.33",
+        "@box/blueprint-web": "^16.13.2",
+        "@box/blueprint-web-assets": "^5.5.11",
+        "@box/eslint-plugin-blueprint": "2.1.11",
+        "@box/storybook-utils": "1.1.35",
         "@testing-library/react": "^15.0.6",
         "react-intl": "^6.4.2"
     },