@box/metadata-template-editor 2.3.21 → 2.3.23

package/dist/chunks/field-context-menu.js

@@ -1 +1 @@
-import{general}from"../esm/lib/components/metadata-field-configurator/messages/configurator-messages.js";import{Divider,DropdownMenu,IconButton,Text}from"@box/blueprint-web";import{FormattedMessage,useIntl}from"react-intl";import{Fragment,jsx,jsxs}from"react/jsx-runtime";import{Ellipsis}from"@box/blueprint-web-assets/icons/Fill";import React from"react";import{IconIconErrorOnLight}from"@box/blueprint-web-assets/tokens/tokens";import clsx from"clsx";import{ArrowDown,ArrowUp,Hidden,Trash,TwoFiles,Visible}from"@box/blueprint-web-assets/icons/Line";import '../styles/field-context-menu.css';var field_context_menu_module_default={contextMenuTrigger:`_contextMenuTrigger_102vn_1`,menuItem:`_menuItem_102vn_5`,contextMenu:`_contextMenu_102vn_1`,divider:`_divider_102vn_14`},FieldContextMenu=({className,index,maxIndex,isHidden=!1,onReorderFields,onToggleVisibility,onRequestDelete,onRequestDuplicate,onOpenChange})=>{let intl=useIntl(),[contextMenuOpen,setContextMenuOpen]=React.useState(!1),contextMenuRef=React.useRef(null),handleOpenChange=open=>{setContextMenuOpen(open),onOpenChange?.(open)},handleMoveUp=()=>{index>0&&onReorderFields?.(index,index-1)},handleMoveDown=()=>{onReorderFields?.(index,index+1)},hasItemsAboveDelete=!!(onReorderFields||onRequestDuplicate||onToggleVisibility);return jsxs(DropdownMenu.Root,{open:contextMenuOpen,onOpenChange:handleOpenChange,modal:!1,children:[jsx(DropdownMenu.Trigger,{className:clsx(field_context_menu_module_default.contextMenuTrigger,className),children:jsx(IconButton,{icon:Ellipsis,"aria-label":intl.formatMessage(general.contextMenuAriaLabel),size:`large`})}),jsxs(DropdownMenu.Content,{ref:contextMenuRef,align:`end`,className:field_context_menu_module_default.contextMenu,children:[onReorderFields&&jsxs(Fragment,{children:[jsx(DropdownMenu.Item,{disabled:index===0,onClick:handleMoveUp,"aria-label":intl.formatMessage(general.moveUpAriaLabel),children:jsxs(`div`,{className:field_context_menu_module_default.menuItem,children:[jsx(ArrowUp,{"aria-hidden":`true`}),jsx(FormattedMessage,{...general.moveUp})]})}),jsx(DropdownMenu.Item,{disabled:index===maxIndex,onClick:handleMoveDown,"aria-label":intl.formatMessage(general.moveDownAriaLabel),children:jsxs(`div`,{className:field_context_menu_module_default.menuItem,children:[jsx(ArrowDown,{"aria-hidden":`true`}),jsx(FormattedMessage,{...general.moveDown})]})})]}),onRequestDuplicate&&jsx(DropdownMenu.Item,{onClick:onRequestDuplicate,"aria-label":intl.formatMessage(general.duplicateFieldAriaLabel),children:jsxs(`div`,{className:field_context_menu_module_default.menuItem,children:[jsx(TwoFiles,{"aria-hidden":`true`}),jsx(FormattedMessage,{...general.duplicateField})]})}),onToggleVisibility&&jsx(DropdownMenu.Item,{onClick:()=>onToggleVisibility(!isHidden),"aria-label":intl.formatMessage(isHidden?general.showField:general.hideField),children:jsxs(`div`,{className:field_context_menu_module_default.menuItem,children:[jsx(isHidden?Visible:Hidden,{"aria-hidden":`true`}),jsx(FormattedMessage,{...isHidden?general.showField:general.hideField})]})}),onRequestDelete&&jsxs(Fragment,{children:[hasItemsAboveDelete&&jsx(Divider,{className:field_context_menu_module_default.divider}),jsx(DropdownMenu.Item,{onClick:onRequestDelete,"aria-label":intl.formatMessage(general.deleteFieldAriaLabel),children:jsxs(`div`,{className:field_context_menu_module_default.menuItem,children:[jsx(Trash,{color:IconIconErrorOnLight,"aria-hidden":`true`}),jsx(Text,{as:`span`,color:`textOnLightError`,children:jsx(FormattedMessage,{...general.deleteField})})]})})]})]})]})};export{FieldContextMenu as t};
+import{general}from"../esm/lib/components/metadata-field-configurator/messages/configurator-messages.js";import{Divider,DropdownMenu,IconButton,Text}from"@box/blueprint-web";import{FormattedMessage,useIntl}from"react-intl";import{Fragment,jsx,jsxs}from"react/jsx-runtime";import{Ellipsis}from"@box/blueprint-web-assets/icons/Fill";import React,{Children}from"react";import{IconIconErrorOnLight}from"@box/blueprint-web-assets/tokens/tokens";import clsx from"clsx";import{ArrowDown,ArrowUp,Hidden,Trash,TwoFiles,Visible}from"@box/blueprint-web-assets/icons/Line";import '../styles/field-context-menu.css';var field_context_menu_module_default={contextMenuTrigger:`_contextMenuTrigger_102vn_1`,menuItem:`_menuItem_102vn_5`,contextMenu:`_contextMenu_102vn_1`,divider:`_divider_102vn_14`},FieldContextMenu=({className,index,maxIndex,isHidden=!1,onReorderFields,onToggleVisibility,onRequestDelete,onRequestDuplicate,onOpenChange})=>{let intl=useIntl(),[contextMenuOpen,setContextMenuOpen]=React.useState(!1),contextMenuRef=React.useRef(null),handleOpenChange=open=>{setContextMenuOpen(open),onOpenChange?.(open)},handleMoveUp=()=>{index>0&&onReorderFields?.(index,index-1)},handleMoveDown=()=>{onReorderFields?.(index,index+1)},hasItemsAboveDelete=!!(onReorderFields||onRequestDuplicate||onToggleVisibility),menuContent=jsxs(Fragment,{children:[onReorderFields&&jsxs(Fragment,{children:[jsx(DropdownMenu.Item,{disabled:index===0,onClick:handleMoveUp,"aria-label":intl.formatMessage(general.moveUpAriaLabel),children:jsxs(`div`,{className:field_context_menu_module_default.menuItem,children:[jsx(ArrowUp,{"aria-hidden":`true`}),jsx(FormattedMessage,{...general.moveUp})]})}),jsx(DropdownMenu.Item,{disabled:index===maxIndex,onClick:handleMoveDown,"aria-label":intl.formatMessage(general.moveDownAriaLabel),children:jsxs(`div`,{className:field_context_menu_module_default.menuItem,children:[jsx(ArrowDown,{"aria-hidden":`true`}),jsx(FormattedMessage,{...general.moveDown})]})})]}),onRequestDuplicate&&jsx(DropdownMenu.Item,{onClick:onRequestDuplicate,"aria-label":intl.formatMessage(general.duplicateFieldAriaLabel),children:jsxs(`div`,{className:field_context_menu_module_default.menuItem,children:[jsx(TwoFiles,{"aria-hidden":`true`}),jsx(FormattedMessage,{...general.duplicateField})]})}),onToggleVisibility&&jsx(DropdownMenu.Item,{onClick:()=>onToggleVisibility(!isHidden),"aria-label":intl.formatMessage(isHidden?general.showField:general.hideField),children:jsxs(`div`,{className:field_context_menu_module_default.menuItem,children:[jsx(isHidden?Visible:Hidden,{"aria-hidden":`true`}),jsx(FormattedMessage,{...isHidden?general.showField:general.hideField})]})}),onRequestDelete&&jsxs(Fragment,{children:[hasItemsAboveDelete&&jsx(Divider,{className:field_context_menu_module_default.divider}),jsx(DropdownMenu.Item,{onClick:onRequestDelete,"aria-label":intl.formatMessage(general.deleteFieldAriaLabel),children:jsxs(`div`,{className:field_context_menu_module_default.menuItem,children:[jsx(Trash,{color:IconIconErrorOnLight,"aria-hidden":`true`}),jsx(Text,{as:`span`,color:`textOnLightError`,children:jsx(FormattedMessage,{...general.deleteField})})]})})]})]}),menuItems=Children.toArray(menuContent.props.children);return menuItems.length===0?null:jsxs(DropdownMenu.Root,{open:contextMenuOpen,onOpenChange:handleOpenChange,modal:!1,children:[jsx(DropdownMenu.Trigger,{className:clsx(field_context_menu_module_default.contextMenuTrigger,className),children:jsx(IconButton,{icon:Ellipsis,"aria-label":intl.formatMessage(general.contextMenuAriaLabel),size:`large`})}),jsx(DropdownMenu.Content,{ref:contextMenuRef,align:`end`,className:field_context_menu_module_default.contextMenu,children:menuItems})]})};export{FieldContextMenu as t};

package/dist/chunks/metadata-field-configurator.module.js

@@ -1 +1 @@
-import '../styles/metadata-field-configurator.css';var metadata_field_configurator_module_default={fieldset:`_fieldset_1fcv5_1`,expandedContent:`_expandedContent_1fcv5_7`,basic:`_basic_1fcv5_13`,fieldTypeSelect:`_fieldTypeSelect_1fcv5_18`,typeSpecific:`_typeSpecific_1fcv5_22`,description:`_description_1fcv5_29`,labelWithTooltip:`_labelWithTooltip_1fcv5_34`,fieldActionSlot:`_fieldActionSlot_1fcv5_39`,expandedToolbarActions:`_expandedToolbarActions_1fcv5_46`,extensionTabsContainer:`_extensionTabsContainer_1fcv5_52`,extensionContent:`_extensionContent_1fcv5_58`,fieldCollapsedText:`_fieldCollapsedText_1fcv5_62`,expanded:`_expanded_1fcv5_7`,contextMenuWithCollapsedText:`_contextMenuWithCollapsedText_1fcv5_71`,fieldAccordionItem:`_fieldAccordionItem_1fcv5_77`,fieldContextMenu:`_fieldContextMenu_1fcv5_84`,menuOpen:`_menuOpen_1fcv5_87`};export{metadata_field_configurator_module_default as t};
+import '../styles/metadata-field-configurator.css';var metadata_field_configurator_module_default={fieldset:`_fieldset_1dkyn_1`,expandedContent:`_expandedContent_1dkyn_7`,basic:`_basic_1dkyn_13`,fieldTypeSelect:`_fieldTypeSelect_1dkyn_18`,typeSpecific:`_typeSpecific_1dkyn_22`,description:`_description_1dkyn_29`,labelWithTooltip:`_labelWithTooltip_1dkyn_34`,fieldActionSlot:`_fieldActionSlot_1dkyn_39`,expandedToolbarActions:`_expandedToolbarActions_1dkyn_46`,extensionTabsContainer:`_extensionTabsContainer_1dkyn_52`,extensionContent:`_extensionContent_1dkyn_58`,fieldCollapsedText:`_fieldCollapsedText_1dkyn_62`,expanded:`_expanded_1dkyn_7`,contextMenuWithCollapsedText:`_contextMenuWithCollapsedText_1dkyn_71`,fieldAccordionItem:`_fieldAccordionItem_1dkyn_77`,fieldContextMenu:`_fieldContextMenu_1dkyn_84`,menuOpen:`_menuOpen_1dkyn_87`,hiddenBadge:`_hiddenBadge_1dkyn_106`};export{metadata_field_configurator_module_default as t};

package/dist/styles/metadata-field-configurator.css

@@ -1 +1 @@
-._fieldset_1fcv5_1{border:0;margin:0;padding:0}._expandedContent_1fcv5_7{gap:var(--space-4);flex-direction:column;display:flex}._basic_1fcv5_13{gap:var(--space-4);grid-template-columns:3fr 2fr;display:grid}._basic_1fcv5_13 ._fieldTypeSelect_1fcv5_18{min-width:145px}._typeSpecific_1fcv5_22{margin-top:var(--space-2);gap:var(--space-4);flex-direction:column;display:flex}._description_1fcv5_29{gap:var(--space-4);flex-direction:column;display:flex}._description_1fcv5_29 ._labelWithTooltip_1fcv5_34{margin-block-end:var(--space-2);display:inline-block}._fieldActionSlot_1fcv5_39{align-items:center;gap:var(--space-2);display:flex;position:relative}._expandedToolbarActions_1fcv5_46{align-items:center;gap:var(--space-1);display:flex}._extensionTabsContainer_1fcv5_52{border-right:1px solid var(--border-border-on-light);height:auto;overflow:visible}._extensionContent_1fcv5_58{padding:var(--space-4) 0}._fieldCollapsedText_1fcv5_62{visibility:visible;display:block}._expanded_1fcv5_7 ._fieldCollapsedText_1fcv5_62{visibility:hidden}._contextMenuWithCollapsedText_1fcv5_71{background-color:#0000;position:absolute;right:0}._fieldAccordionItem_1fcv5_77{max-width:650px}._fieldAccordionItem_1fcv5_77[data-state=closed] ._fieldActionSlot_1fcv5_39{position:relative}._fieldAccordionItem_1fcv5_77[data-state=closed] ._fieldContextMenu_1fcv5_84{display:none}._fieldAccordionItem_1fcv5_77[data-state=closed] ._fieldContextMenu_1fcv5_84._menuOpen_1fcv5_87{display:flex}._fieldAccordionItem_1fcv5_77[data-state=closed] ._extensionTabsContainer_1fcv5_52{display:none}._fieldAccordionItem_1fcv5_77[data-state=closed]:has(:hover) ._fieldContextMenu_1fcv5_84{display:flex}._fieldAccordionItem_1fcv5_77[data-state=closed]:has(:hover) ._contextMenuWithCollapsedText_1fcv5_71{position:absolute;top:-50%;right:0}
+._fieldset_1dkyn_1{border:0;margin:0;padding:0}._expandedContent_1dkyn_7{gap:var(--space-4);flex-direction:column;display:flex}._basic_1dkyn_13{gap:var(--space-4);grid-template-columns:3fr 2fr;display:grid}._basic_1dkyn_13 ._fieldTypeSelect_1dkyn_18{min-width:145px}._typeSpecific_1dkyn_22{margin-top:var(--space-2);gap:var(--space-4);flex-direction:column;display:flex}._description_1dkyn_29{gap:var(--space-4);flex-direction:column;display:flex}._description_1dkyn_29 ._labelWithTooltip_1dkyn_34{margin-block-end:var(--space-2);display:inline-block}._fieldActionSlot_1dkyn_39{align-items:center;gap:var(--space-2);display:flex;position:relative}._expandedToolbarActions_1dkyn_46{align-items:center;gap:var(--space-1);display:flex}._extensionTabsContainer_1dkyn_52{border-right:1px solid var(--border-border-on-light);height:auto;overflow:visible}._extensionContent_1dkyn_58{padding:var(--space-4) 0}._fieldCollapsedText_1dkyn_62{visibility:visible;display:block}._expanded_1dkyn_7 ._fieldCollapsedText_1dkyn_62{visibility:hidden}._contextMenuWithCollapsedText_1dkyn_71{background-color:#0000;position:absolute;right:0}._fieldAccordionItem_1dkyn_77{max-width:650px}._fieldAccordionItem_1dkyn_77[data-state=closed] ._fieldActionSlot_1dkyn_39{position:relative}._fieldAccordionItem_1dkyn_77[data-state=closed] ._fieldContextMenu_1dkyn_84{display:none}._fieldAccordionItem_1dkyn_77[data-state=closed] ._fieldContextMenu_1dkyn_84._menuOpen_1dkyn_87{display:flex}._fieldAccordionItem_1dkyn_77[data-state=closed] ._extensionTabsContainer_1dkyn_52{display:none}._fieldAccordionItem_1dkyn_77[data-state=closed]:has(>:hover) ._fieldContextMenu_1dkyn_84{background-color:#ebebeb;display:flex}._fieldAccordionItem_1dkyn_77[data-state=closed]:has(>:hover) ._fieldContextMenu_1dkyn_84:before{content:"";width:var(--space-3);background:linear-gradient(90deg,#0000,#ebebeb);position:absolute;top:0;bottom:0;right:99%}._fieldAccordionItem_1dkyn_77[data-state=closed]:has(>:hover) ._fieldActionSlot_1dkyn_39:has(._fieldContextMenu_1dkyn_84,._contextMenuWithCollapsedText_1dkyn_71) ._hiddenBadge_1dkyn_106{visibility:hidden}._fieldAccordionItem_1dkyn_77[data-state=closed]:has(>:hover) ._contextMenuWithCollapsedText_1dkyn_71{position:absolute;top:-50%;right:0}

package/dist/types/lib/components/metadata-field-configurator/components/field-action-slot/field-action-slot.d.ts

@@ -4,7 +4,7 @@ type FieldActionSlotBaseProps = {
     isExpanded?: boolean;
     index: number;
     maxIndex?: number;
-    onReorderFields: (fromIndex: number, toIndex: number) => void;
+    onReorderFields?: (fromIndex: number, toIndex: number) => void;
     onToggleVisibility?: (hidden: boolean) => void;
     onRequestDelete?: () => void;
     onRequestDuplicate?: () => void;
@@ -17,7 +17,8 @@ type FieldActionSlotBaseProps = {
     /**
      * A custom menu slot to render in place of the built-in context menu when collapsed.
      * When provided and collapsed, this is shown instead of FieldContextMenu.
-     * When expanded, FieldContextMenu is always used.
+     * When expanded, FieldContextMenu is always used — though it renders nothing when
+     * no action handlers are supplied (see the component docs).
      */
     collapsedMenuSlot?: React.ReactNode;
     /**
@@ -34,6 +35,10 @@ export type FieldActionSlotProps = FieldActionSlotBaseProps;
  * - "Hidden" status badge (when field is hidden)
  * - Extension ContentSwitcher tabs (when extensions are provided)
  * - Field context menu, or a custom `menuSlot` when provided
+ *
+ * The context menu is omitted entirely when none of `onReorderFields`, `onToggleVisibility`,
+ * `onRequestDelete`, or `onRequestDuplicate` is provided, so an actionless field renders no
+ * "…" trigger instead of one that opens an empty menu. Extension tabs are unaffected.
  */
 export declare const FieldActionSlot: ({ isHidden, isExpanded, index, maxIndex, onReorderFields, onToggleVisibility, onRequestDelete, onRequestDuplicate, extensions, fieldCollapsedText, collapsedMenuSlot, readOnly, }: FieldActionSlotProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/types/lib/components/metadata-field-configurator/components/field-context-menu/field-context-menu.d.ts

@@ -22,6 +22,10 @@ type FieldContextMenuProps = {
  * An ellipsis icon button that opens a dropdown menu with actions for a single
  * metadata field: move up, move down, toggle visibility, duplicate (when
  * `onRequestDuplicate` is provided), and delete.
+ *
+ * Every menu item is gated on its own handler, and the rendered items are counted
+ * before the trigger is drawn, so when no handler is provided the component renders
+ * `null` rather than a trigger that opens an empty menu.
  */
-export declare const FieldContextMenu: ({ className, index, maxIndex, isHidden, onReorderFields, onToggleVisibility, onRequestDelete, onRequestDuplicate, onOpenChange, }: FieldContextMenuProps) => import("react/jsx-runtime").JSX.Element;
+export declare const FieldContextMenu: ({ className, index, maxIndex, isHidden, onReorderFields, onToggleVisibility, onRequestDelete, onRequestDuplicate, onOpenChange, }: FieldContextMenuProps) => import("react/jsx-runtime").JSX.Element | null;
 export {};

package/package.json

@@ -1,10 +1,10 @@
 {
     "name": "@box/metadata-template-editor",
-    "version": "2.3.21",
+    "version": "2.3.23",
     "license": "SEE LICENSE IN LICENSE",
     "peerDependencies": {
-        "@box/blueprint-web": "^16.20.3",
-        "@box/blueprint-web-assets": "^5.7.10",
+        "@box/blueprint-web": "^16.20.4",
+        "@box/blueprint-web-assets": "^5.7.11",
         "@dnd-kit/core": "^6.1.0",
         "@dnd-kit/sortable": "^8.0.0",
         "@dnd-kit/utilities": "^3.2.2",
@@ -17,10 +17,10 @@
         "yup": "^1.6.1"
     },
     "devDependencies": {
-        "@box/blueprint-web": "^16.20.3",
-        "@box/blueprint-web-assets": "^5.7.10",
-        "@box/eslint-plugin-blueprint": "2.2.6",
-        "@box/storybook-utils": "1.2.19",
+        "@box/blueprint-web": "^16.20.4",
+        "@box/blueprint-web-assets": "^5.7.11",
+        "@box/eslint-plugin-blueprint": "2.2.7",
+        "@box/storybook-utils": "1.2.20",
         "@dnd-kit/core": "^6.1.0",
         "@dnd-kit/sortable": "^8.0.0",
         "@dnd-kit/utilities": "^3.2.2",