@box/blueprint-web 16.20.7 → 17.0.0

package/dist/lib-esm/list-item/table-column.js

@@ -1,12 +1,11 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
-import { ArrowUp as ArrowUp$1, ArrowDown as ArrowDown$1 } from '@box/blueprint-web-assets/icons/Fill';
+import '@box/blueprint-web-assets/icons/Fill';
 import { ArrowUp, ArrowDown } from '@box/blueprint-web-assets/icons/Medium';
-import { bpSize040, Size4, bpTextTextOnLight, TextTextOnLight } from '@box/blueprint-web-assets/tokens/tokens';
+import { bpSize040, bpTextTextOnLight } from '@box/blueprint-web-assets/tokens/tokens';
 import clsx from 'clsx';
 import { forwardRef } from 'react';
 import { useFocusRing } from 'react-aria';
 import { Column as Column$1, ColumnResizer } from 'react-aria-components';
-import { useBlueprintModernization } from '../blueprint-modernization-context/useBlueprintModernization.js';
 import { Focusable } from '../focusable/focusable.js';
 import { useBreakpoint, Breakpoint } from '../utils/useBreakpoint.js';
 import { VisuallyHidden } from '../visually-hidden/visually-hidden.js';
@@ -17,28 +16,20 @@ function SortingArrowIcon({
   visibility = 'visible',
   direction
 }) {
-  const {
-    enableModernizedComponents
-  } = useBlueprintModernization();
   const props = {
-    color: enableModernizedComponents ? bpTextTextOnLight : TextTextOnLight,
-    height: enableModernizedComponents ? bpSize040 : Size4,
+    color: bpTextTextOnLight ,
+    height: bpSize040 ,
     role: 'presentation',
     visibility,
-    width: enableModernizedComponents ? bpSize040 : Size4
+    width: bpSize040 
   };
-  if (enableModernizedComponents) {
+  {
     return direction === 'up' ? jsx(ArrowUp, {
       ...props
     }) : jsx(ArrowDown, {
       ...props
     });
   }
-  return direction === 'up' ? jsx(ArrowUp$1, {
-    ...props
-  }) : jsx(ArrowDown$1, {
-    ...props
-  });
 }
 function SortIndicator({
   direction

package/dist/lib-esm/list-item/table-header-default.js

@@ -2,7 +2,6 @@ import { jsx } from 'react/jsx-runtime';
 import clsx from 'clsx';
 import { forwardRef } from 'react';
 import { TableHeader } from 'react-aria-components';
-import { useBlueprintModernization } from '../blueprint-modernization-context/useBlueprintModernization.js';
 import styles from './main.module.js';
 
 const TableHeaderInner = (props, ref) => {
@@ -12,14 +11,11 @@ const TableHeaderInner = (props, ref) => {
     className,
     ...rest
   } = props;
-  const {
-    enableModernizedComponents
-  } = useBlueprintModernization();
   return jsx(TableHeader, {
     ...rest,
     ref: ref,
     className: clsx(styles.tableHeader, className),
-    "data-modern": enableModernizedComponents ? 'true' : 'false',
+    "data-modern": 'true' ,
     children: children
   });
 };

package/dist/lib-esm/list-item/table.js

@@ -3,7 +3,6 @@ import { forwardRef, useRef } from 'react';
 import { ResizableTableContainer, Table as Table$1 } from 'react-aria-components';
 import clsx from 'clsx';
 import { noop } from '../utils/noop.js';
-import { useBlueprintModernization } from '../blueprint-modernization-context/useBlueprintModernization.js';
 import styles from './main.module.js';
 import { ColumnVisibilityProvider, useColumnVisibilityContext } from './utils/column-visibility-context/columnVisibilityContext.js';
 import { TableSortingProvider, useTableSortingContext } from './utils/table-sorting-context/tableSortingContext.js';
@@ -28,9 +27,7 @@ const Table = /*#__PURE__*/forwardRef((props, ref) => {
   } = props;
   const resizableContainerRef = useRef(null);
   const dropdownHeaderContainerRef = useRef(null);
-  const {
-    enableModernizedComponents
-  } = useBlueprintModernization();
+  const enableModernizedComponents = true;
   return jsx(TableSortingProvider, {
     defaultSortDescriptor: defaultSortDescriptor,
     dropdownHeaderContainerRef: dropdownHeaderContainerRef,

package/dist/lib-esm/loading-indicator/loading-indicator.js

@@ -1,7 +1,5 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { clsx } from 'clsx';
-import 'react';
-import { useBlueprintModernization } from '../blueprint-modernization-context/useBlueprintModernization.js';
 import styles from './loading-indicator.module.js';
 
 function LoadingIndicator(props) {
@@ -13,15 +11,12 @@ function LoadingIndicator(props) {
     className = '',
     ...rest
   } = props;
-  const {
-    enableModernizedComponents
-  } = useBlueprintModernization();
   return jsxs("div", {
     ...rest,
     "aria-label": ariaLabel,
     "aria-live": ariaLive,
     className: clsx(styles.crawler, styles[variant], styles[size], className),
-    "data-modern": enableModernizedComponents ? 'true' : 'false',
+    "data-modern": 'true' ,
     role: "status",
     children: [jsx("div", {
       className: styles.segment

package/dist/lib-esm/modal/modal-close.js

@@ -1,10 +1,9 @@
 import { jsx } from 'react/jsx-runtime';
-import { XMark as XMark$1 } from '@box/blueprint-web-assets/icons/Fill';
+import '@box/blueprint-web-assets/icons/Fill';
 import { XMark } from '@box/blueprint-web-assets/icons/Medium';
 import * as RadixDialog from '@radix-ui/react-dialog';
 import clsx from 'clsx';
 import { forwardRef } from 'react';
-import { useBlueprintModernization } from '../blueprint-modernization-context/useBlueprintModernization.js';
 import { IconButton } from '../primitives/icon-button/icon-button.js';
 import { useMedia } from '../utils/useMedia.js';
 import styles from './modal.module.js';
@@ -23,10 +22,7 @@ const ModalClose = /*#__PURE__*/forwardRef(({
   variant = 'default',
   ...rest
 }, forwardedRef) => {
-  const {
-    enableModernizedComponents
-  } = useBlueprintModernization();
-  const defaultIcon = enableModernizedComponents ? XMark : XMark$1;
+  const defaultIcon = XMark ;
   // Change IconButton size for Mobile (only when IconButton size is large)
   // TODO: change to media query tokens
   const breakpoint = 459;

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

@@ -5,7 +5,6 @@ import { forwardRef } from 'react';
 import '../blueprint-configuration-context/blueprint-configuration-context.js';
 import '../blueprint-configuration-context/consts.js';
 import { useBlueprintConfiguration } from '../blueprint-configuration-context/useBlueprintConfiguration.js';
-import { useBlueprintModernization } from '../blueprint-modernization-context/useBlueprintModernization.js';
 import styles from './modal.module.js';
 
 /**
@@ -20,9 +19,6 @@ const ModalContent = /*#__PURE__*/forwardRef(({
   size,
   ...props
 }, forwardedRef) => {
-  const {
-    enableModernizedComponents
-  } = useBlueprintModernization();
   const {
     componentsWithAnimationEnabled
   } = useBlueprintConfiguration();
@@ -32,7 +28,7 @@ const ModalContent = /*#__PURE__*/forwardRef(({
     children: jsx(RadixDialog.Overlay, {
       className: styles.overlay,
       "data-bp-animated": isAnimationEnabled ? 'true' : 'false',
-      "data-modern": enableModernizedComponents ? 'true' : 'false',
+      "data-modern": 'true' ,
       children: jsx(RadixDialog.Content, {
         ...props,
         ref: forwardedRef,

package/dist/lib-esm/navigation-menu/navigation-menu-content.js

@@ -1,7 +1,6 @@
 import { jsx } from 'react/jsx-runtime';
 import { forwardRef } from 'react';
 import { useBlueprintConfiguration } from '../blueprint-configuration-context/useBlueprintConfiguration.js';
-import { useBlueprintModernization } from '../blueprint-modernization-context/useBlueprintModernization.js';
 import { DropdownMenu } from '../primitives/dropdown-menu/index.js';
 
 /**
@@ -12,9 +11,6 @@ const NavigationMenuContent = /*#__PURE__*/forwardRef((props, forwardedRef) => {
     children,
     ...rest
   } = props;
-  const {
-    enableModernizedComponents
-  } = useBlueprintModernization();
   const {
     componentsWithAnimationEnabled
   } = useBlueprintConfiguration();
@@ -23,7 +19,7 @@ const NavigationMenuContent = /*#__PURE__*/forwardRef((props, forwardedRef) => {
     ...rest,
     ref: forwardedRef,
     "data-bp-animated": isAnimationEnabled ? 'true' : 'false',
-    "data-modern": enableModernizedComponents ? 'true' : 'false',
+    "data-modern": 'true' ,
     children: children
   });
 });

package/dist/lib-esm/navigation-menu/navigation-menu-link.js

@@ -2,7 +2,6 @@ import { jsx } from 'react/jsx-runtime';
 import clsx from 'clsx';
 import { forwardRef } from 'react';
 import { Link } from '../primitives/link/link.js';
-import { useBlueprintModernization } from '../blueprint-modernization-context/useBlueprintModernization.js';
 import styles from './navigation-menu.module.js';
 
 /**
@@ -13,14 +12,11 @@ const NavigationMenuLink = /*#__PURE__*/forwardRef((props, forwardedRef) => {
     children,
     ...rest
   } = props;
-  const {
-    enableModernizedComponents
-  } = useBlueprintModernization();
   return jsx(Link, {
     ...rest,
     ref: forwardedRef,
     className: clsx([styles.link, styles.ellipsis]),
-    "data-modern": enableModernizedComponents ? 'true' : 'false',
+    "data-modern": 'true' ,
     inheritFont: true,
     variant: "standalone",
     children: children

package/dist/lib-esm/page/page-root.js

@@ -1,7 +1,6 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
 import clsx from 'clsx';
 import { forwardRef, useEffect, Children, isValidElement } from 'react';
-import { useBlueprintModernization } from '../blueprint-modernization-context/useBlueprintModernization.js';
 import { useBreakpoint, Breakpoint } from '../utils/useBreakpoint.js';
 import { useRefWithEffect as useRefWithEffectMemoized } from '../utils/useRefWithEffect.js';
 import { PageProvider, usePageStore } from './page-context.js';
@@ -57,9 +56,6 @@ const PageLayout = /*#__PURE__*/forwardRef(({
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
   const Slots = getChildrenForLandmarks(children);
-  const {
-    enableModernizedComponents
-  } = useBlueprintModernization();
   return jsxs("div", {
     ...rest,
     ref: setRefs,
@@ -68,7 +64,7 @@ const PageLayout = /*#__PURE__*/forwardRef(({
       [styles.pageNavigationXXLargeCollapsed]: xxLargeBreakpointActive && !navigationExpanded,
       [styles.pageMediumOrLessViewport]: breakpoint <= Breakpoint.Medium
     }, className),
-    "data-modern": enableModernizedComponents ? 'true' : 'false',
+    "data-modern": 'true' ,
     children: [Slots.Navigation, jsxs("div", {
       className: styles.pageBody,
       children: [Slots.SidePanel, jsxs("div", {

package/dist/lib-esm/primitives/base-button/base-button-icon.js

@@ -1,7 +1,6 @@
 import { jsx } from 'react/jsx-runtime';
 import clsx from 'clsx';
 import { forwardRef, useCallback, createElement } from 'react';
-import { useBlueprintModernization } from '../../blueprint-modernization-context/useBlueprintModernization.js';
 import { useBaseButtonContext } from './base-button-context.js';
 import styles from './base-button.module.js';
 import { buttonVariantToIconColorMap, getIconSize } from './utils.js';
@@ -19,9 +18,7 @@ const BaseButtonIcon = /*#__PURE__*/forwardRef((props, forwardedRef) => {
     buttonType,
     ariaLabel
   } = useBaseButtonContext();
-  const {
-    enableModernizedComponents
-  } = useBlueprintModernization();
+  const enableModernizedComponents = true;
   const isIconOnly = buttonType === 'icon-only';
   const renderIcon = useCallback(() => {
     if (!icon) {

package/dist/lib-esm/primitives/base-button/base-button.js

@@ -5,7 +5,6 @@ import { forwardRef, useRef, useMemo } from 'react';
 import '../../blueprint-configuration-context/blueprint-configuration-context.js';
 import '../../blueprint-configuration-context/consts.js';
 import { useBlueprintConfiguration } from '../../blueprint-configuration-context/useBlueprintConfiguration.js';
-import { useBlueprintModernization } from '../../blueprint-modernization-context/useBlueprintModernization.js';
 import { LoadingIndicator } from '../../loading-indicator/loading-indicator.js';
 import { getButtonOptions } from '../../utils/getButtonOptions.js';
 import { useForkRef } from '../../utils/useForkRef.js';
@@ -37,9 +36,6 @@ const BaseButton = /*#__PURE__*/forwardRef((props, forwardedRef) => {
     ...rest
   } = getButtonOptions(props);
   const effectiveSize = size === 'x-small' && !VALID_X_SMALL_VARIANTS.includes(variant) ? 'small' : size;
-  const {
-    enableModernizedComponents
-  } = useBlueprintModernization();
   const {
     componentsWithAnimationEnabled
   } = useBlueprintConfiguration();
@@ -58,7 +54,7 @@ const BaseButton = /*#__PURE__*/forwardRef((props, forwardedRef) => {
     ref: useForkRef(ref, forwardedRef),
     "aria-label": loading ? undefined : ariaLabel,
     className: getButtonClassName(variant, effectiveSize, buttonType, loading, className),
-    "data-modern": enableModernizedComponents ? 'true' : 'false',
+    "data-modern": 'true' ,
     "data-bp-animated": isAnimationEnabled ? 'true' : 'false',
     children: jsxs(BaseButtonContext.Provider, {
       value: context,

package/dist/lib-esm/primitives/base-inline-notice/base-inline-notice-icon.js

@@ -1,13 +1,8 @@
 import { jsx } from 'react/jsx-runtime';
-import { bpSize050, Size5, bpIconIconOnLightSecondary, bpIconIconOnLight, IconIconOnLightSecondary, IconIconOnLight } from '@box/blueprint-web-assets/tokens/tokens';
+import { bpSize050, bpIconIconOnLightSecondary, bpIconIconOnLight } from '@box/blueprint-web-assets/tokens/tokens';
 import { forwardRef, createElement } from 'react';
-import { useBlueprintModernization } from '../../blueprint-modernization-context/useBlueprintModernization.js';
 import styles from './base-inline-notice.module.js';
 
-const IconColorMap = {
-  IconIconOnLight,
-  IconIconOnLightSecondary
-};
 const IconColorModernizedMap = {
   IconIconOnLight: bpIconIconOnLight,
   IconIconOnLightSecondary: bpIconIconOnLightSecondary
@@ -19,17 +14,14 @@ const BaseInlineNoticeIcon = /*#__PURE__*/forwardRef((props, forwardedRef) => {
     iconColor = 'IconIconOnLight',
     ...rest
   } = props;
-  const {
-    enableModernizedComponents
-  } = useBlueprintModernization();
   if (!icon) {
     return null;
   }
-  const color = enableModernizedComponents ? IconColorModernizedMap[iconColor] : IconColorMap[iconColor];
+  const color = IconColorModernizedMap[iconColor] ;
   const iconElement = /*#__PURE__*/createElement(icon, {
     color,
-    width: enableModernizedComponents ? bpSize050 : Size5,
-    height: enableModernizedComponents ? bpSize050 : Size5,
+    width: bpSize050 ,
+    height: bpSize050 ,
     'aria-label': iconAriaLabel
   });
   return jsx("span", {

package/dist/lib-esm/primitives/base-inline-notice/base-inline-notice.js

@@ -1,7 +1,6 @@
 import { jsx } from 'react/jsx-runtime';
 import clsx from 'clsx';
 import { forwardRef } from 'react';
-import { useBlueprintModernization } from '../../blueprint-modernization-context/useBlueprintModernization.js';
 import styles from './base-inline-notice.module.js';
 
 const BaseInlineNotice = /*#__PURE__*/forwardRef((props, forwardedRef) => {
@@ -12,15 +11,12 @@ const BaseInlineNotice = /*#__PURE__*/forwardRef((props, forwardedRef) => {
     enableContainerQueryLayout = false,
     ...rest
   } = props;
-  const {
-    enableModernizedComponents
-  } = useBlueprintModernization();
   return jsx("div", {
     ...rest,
     ref: forwardedRef,
     className: clsx(styles.noticeWrapper, styles[backgroundColor], className),
     "data-container-query-layout": enableContainerQueryLayout ? 'true' : 'false',
-    "data-modern": enableModernizedComponents ? 'true' : 'false',
+    "data-modern": 'true' ,
     children: children
   });
 });

package/dist/lib-esm/primitives/base-text-input/base-text-input.js

@@ -1,10 +1,9 @@
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
-import { AlertBadge } from '@box/blueprint-web-assets/icons/Fill';
+import '@box/blueprint-web-assets/icons/Fill';
 import { AlertCircle } from '@box/blueprint-web-assets/icons/Medium';
 import { IconIconErrorOnLight } from '@box/blueprint-web-assets/tokens/tokens';
 import clsx from 'clsx';
 import { forwardRef, useState, useMemo, cloneElement } from 'react';
-import { useBlueprintModernization } from '../../blueprint-modernization-context/useBlueprintModernization.js';
 import { Focusable } from '../../focusable/focusable.js';
 import { Text } from '../../text/text.js';
 import { Tooltip } from '../../tooltip/tooltip.js';
@@ -72,16 +71,13 @@ const BaseTextInput = /*#__PURE__*/forwardRef((props, forwardedRef) => {
     className: clsx(endIcon.props?.className, styles.endIcon)
   }), [endIcon]);
   const Label = useLabelable(label, inputId, required);
-  const {
-    enableModernizedComponents
-  } = useBlueprintModernization();
   return jsxs("div", {
     className: clsx(styles.textInputContainerOuter, {
       [styles.disabled]: disabled,
       [styles.error]: shouldMarkError
     }, className),
     "data-bp-animated": animatedDataAttribute ?? 'false',
-    "data-modern": enableModernizedComponents ? 'true' : 'false',
+    "data-modern": 'true' ,
     children: [jsx(Label, {
       className: clsx([styles.label], {
         [styles.hidden]: hideLabel
@@ -117,11 +113,9 @@ const BaseTextInput = /*#__PURE__*/forwardRef((props, forwardedRef) => {
             ref: setValueUsing(setEndIconWidth),
             "aria-labelledby": inlineErrorId,
             className: clsx(styles.endIcon, styles.inlineErrorIcon),
-            children: enableModernizedComponents ? jsx(AlertCircle, {
-              color: IconIconErrorOnLight
-            }) : jsx(AlertBadge, {
+            children: jsx(AlertCircle, {
               color: IconIconErrorOnLight
-            })
+            }) 
           })
         }), jsx(VisuallyHidden, {
           id: inlineErrorId,

package/dist/lib-esm/primitives/calendar/calendar.js

@@ -1,12 +1,11 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
-import { ChevronLeft as ChevronLeft$1, ChevronRight as ChevronRight$1 } from '@box/blueprint-web-assets/icons/Fill';
+import '@box/blueprint-web-assets/icons/Fill';
 import { ChevronLeft, ChevronRight } from '@box/blueprint-web-assets/icons/Medium';
 import { Gray65 } from '@box/blueprint-web-assets/tokens/tokens';
 import { isSameDay, today, getLocalTimeZone } from '@internationalized/date';
 import { clsx } from 'clsx';
 import { forwardRef, useMemo, useRef, useEffect } from 'react';
 import { Calendar as Calendar$1, Button, Heading, CalendarGrid, CalendarGridHeader, CalendarHeaderCell, CalendarGridBody, CalendarCell } from 'react-aria-components';
-import { useBlueprintModernization } from '../../blueprint-modernization-context/useBlueprintModernization.js';
 import styles from './calendar.module.js';
 
 // Dispatch duplicated event with bubbling enabled, so Radix popover knows that this click happened.
@@ -63,17 +62,15 @@ const Calendar = /*#__PURE__*/forwardRef((props, forwardedRef) => {
     nextMonthAriaLabel,
     ...rest
   } = props;
-  const {
-    enableModernizedComponents
-  } = useBlueprintModernization();
-  const ChevronLeftIcon = useMemo(() => enableModernizedComponents ? ChevronLeft : ChevronLeft$1, [enableModernizedComponents]);
-  const ChevronRightIcon = useMemo(() => enableModernizedComponents ? ChevronRight : ChevronRight$1, [enableModernizedComponents]);
+  const enableModernizedComponents = true;
+  const ChevronLeftIcon = useMemo(() => ChevronLeft , [enableModernizedComponents]);
+  const ChevronRightIcon = useMemo(() => ChevronRight , [enableModernizedComponents]);
   return jsxs(Calendar$1, {
     ...rest,
     ref: forwardedRef,
     "aria-label": calendarAriaLabel,
     className: clsx(styles.calendar, className),
-    "data-modern": enableModernizedComponents ? 'true' : 'false',
+    "data-modern": 'true' ,
     children: [jsxs("header", {
       className: styles.calendarHeader,
       children: [jsx(Button, {

package/dist/lib-esm/primitives/chips/chip.js

@@ -2,7 +2,6 @@ import { jsx } from 'react/jsx-runtime';
 import * as ToggleGroup from '@radix-ui/react-toggle-group';
 import clsx from 'clsx';
 import { forwardRef } from 'react';
-import { useBlueprintModernization } from '../../blueprint-modernization-context/useBlueprintModernization.js';
 import styles from './chip.module.js';
 
 const Chip = /*#__PURE__*/forwardRef((props, forwardedRef) => {
@@ -11,14 +10,11 @@ const Chip = /*#__PURE__*/forwardRef((props, forwardedRef) => {
     children,
     ...rest
   } = props;
-  const {
-    enableModernizedComponents
-  } = useBlueprintModernization();
   return jsx(ToggleGroup.Item, {
     ...rest,
     ref: forwardedRef,
     className: clsx(styles.chip, className),
-    "data-modern": enableModernizedComponents ? 'true' : 'false',
+    "data-modern": 'true' ,
     children: children
   });
 });

package/dist/lib-esm/primitives/chips/chips-group.js

@@ -2,7 +2,6 @@ import { jsx } from 'react/jsx-runtime';
 import * as ToggleGroup from '@radix-ui/react-toggle-group';
 import clsx from 'clsx';
 import { forwardRef } from 'react';
-import { useBlueprintModernization } from '../../blueprint-modernization-context/useBlueprintModernization.js';
 import styles from './chip.module.js';
 
 /** Provides a container for Chips, this component handles keyboard navigation and chips selection state  */
@@ -12,14 +11,11 @@ const ChipsGroup = /*#__PURE__*/forwardRef((props, forwardedRef) => {
     children,
     ...rest
   } = props;
-  const {
-    enableModernizedComponents
-  } = useBlueprintModernization();
   return jsx(ToggleGroup.Root, {
     ...rest,
     ref: forwardedRef,
     className: clsx([styles.chipsGroup, className]),
-    "data-modern": enableModernizedComponents ? 'true' : 'false',
+    "data-modern": 'true' ,
     children: children
   });
 });

package/dist/lib-esm/primitives/context-menu/context-menu-item.js

@@ -1,12 +1,11 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
-import { Size4, bpIconIconOnLightSecondary, IconIconOnLightSecondary } from '@box/blueprint-web-assets/tokens/tokens';
+import { Size4, bpIconIconOnLightSecondary } from '@box/blueprint-web-assets/tokens/tokens';
 import * as ContextMenuPrimitve from '@radix-ui/react-context-menu';
 import clsx from 'clsx';
 import { forwardRef, useCallback, createElement } from 'react';
 import '../../blueprint-configuration-context/blueprint-configuration-context.js';
 import '../../blueprint-configuration-context/consts.js';
 import { useBlueprintConfiguration } from '../../blueprint-configuration-context/useBlueprintConfiguration.js';
-import { useBlueprintModernization } from '../../blueprint-modernization-context/useBlueprintModernization.js';
 import { MenuItemSideContent, MenuItemMainContent } from '../../util-components/menu-item-sections/menu-item-sections.js';
 import styles from './context-menu.module.js';
 
@@ -43,10 +42,7 @@ const ContextMenuItemStartElement = /*#__PURE__*/forwardRef(({
   icon,
   ...rest
 }, ref) => {
-  const {
-    enableModernizedComponents
-  } = useBlueprintModernization();
-  const iconColor = enableModernizedComponents ? bpIconIconOnLightSecondary : IconIconOnLightSecondary;
+  const iconColor = bpIconIconOnLightSecondary ;
   return jsxs("div", {
     ...rest,
     ref: ref,

package/dist/lib-esm/primitives/context-menu/context-menu-menu-content.js

@@ -5,7 +5,6 @@ import { forwardRef, Children, isValidElement } from 'react';
 import '../../blueprint-configuration-context/blueprint-configuration-context.js';
 import '../../blueprint-configuration-context/consts.js';
 import { useBlueprintConfiguration } from '../../blueprint-configuration-context/useBlueprintConfiguration.js';
-import { useBlueprintModernization } from '../../blueprint-modernization-context/useBlueprintModernization.js';
 import { useContentSizeObserver } from '../../utils/useContentSizeObserver.js';
 import { useForkRef } from '../../utils/useForkRef.js';
 import { useFullScreenContextMenu } from '../menu-utils/responsiveness/FullScreenContextMenuContext.js';
@@ -38,9 +37,6 @@ const ContextMenuMenuContent = /*#__PURE__*/forwardRef((props, forwardedRef) =>
     className,
     ...rest
   } = props;
-  const {
-    enableModernizedComponents
-  } = useBlueprintModernization();
   const {
     componentsWithAnimationEnabled
   } = useBlueprintConfiguration();
@@ -62,7 +58,7 @@ const ContextMenuMenuContent = /*#__PURE__*/forwardRef((props, forwardedRef) =>
         ref: ref,
         className: clsx(styles.menuBlock, className),
         "data-menu-fullscreen": true,
-        "data-modern": enableModernizedComponents ? 'true' : 'false',
+        "data-modern": 'true' ,
         children: [Header, jsx("div", {
           className: styles.fullScreenContent,
           children: OtherChildren
@@ -76,7 +72,7 @@ const ContextMenuMenuContent = /*#__PURE__*/forwardRef((props, forwardedRef) =>
       ...rest,
       ref: ref,
       className: clsx(styles.menuBlock, className),
-      "data-modern": enableModernizedComponents ? 'true' : 'false',
+      "data-modern": 'true' ,
       "data-bp-animated": isAnimationEnabled ? 'true' : 'false',
       children: children
     })

package/dist/lib-esm/primitives/context-menu/context-menu-menu-header.js

@@ -2,7 +2,6 @@ import { jsx, jsxs } from 'react/jsx-runtime';
 import { PointerChevronLeft, XMark } from '@box/blueprint-web-assets/icons/Fill';
 import clsx from 'clsx';
 import { forwardRef, useCallback } from 'react';
-import { useBlueprintModernization } from '../../blueprint-modernization-context/useBlueprintModernization.js';
 import { Text } from '../../text/text.js';
 import { composeEventHandlers } from '../../utils/composeEventHandlers.js';
 import { IconButton } from '../icon-button/icon-button.js';
@@ -56,13 +55,10 @@ const MenuHeaderPrimitive = ({
   className,
   ...rest
 }) => {
-  const {
-    enableModernizedComponents
-  } = useBlueprintModernization();
   return jsx("div", {
     ...rest,
     className: clsx(styles.menuHeader, className),
-    "data-modern": enableModernizedComponents ? 'true' : 'false',
+    "data-modern": 'true' ,
     role: "presentation",
     children: children
   });

package/dist/lib-esm/primitives/context-menu/context-menu-sub-menu-content.js

@@ -5,7 +5,6 @@ import { forwardRef, useCallback } from 'react';
 import '../../blueprint-configuration-context/blueprint-configuration-context.js';
 import '../../blueprint-configuration-context/consts.js';
 import { useBlueprintConfiguration } from '../../blueprint-configuration-context/useBlueprintConfiguration.js';
-import { useBlueprintModernization } from '../../blueprint-modernization-context/useBlueprintModernization.js';
 import { useContentSizeObserver } from '../../utils/useContentSizeObserver.js';
 import { useForkRef } from '../../utils/useForkRef.js';
 import { useFullScreenContextMenu } from '../menu-utils/responsiveness/FullScreenContextMenuContext.js';
@@ -25,9 +24,6 @@ const ContextMenuSubMenuContent = /*#__PURE__*/forwardRef((props, forwardedRef)
     className,
     ...rest
   } = props;
-  const {
-    enableModernizedComponents
-  } = useBlueprintModernization();
   const {
     componentsWithAnimationEnabled
   } = useBlueprintConfiguration();
@@ -51,7 +47,7 @@ const ContextMenuSubMenuContent = /*#__PURE__*/forwardRef((props, forwardedRef)
         alignOffset: alignOffsetPx,
         className: clsx(styles.menuBlock, className),
         "data-menu-fullscreen": true,
-        "data-modern": enableModernizedComponents ? 'true' : 'false',
+        "data-modern": 'true' ,
         // Prevents submenu from closing, when detects focus outside submenu in fullscreen mode,
         // while mouse is moving over submenu.
         onFocusOutside: preventDefault,
@@ -70,7 +66,7 @@ const ContextMenuSubMenuContent = /*#__PURE__*/forwardRef((props, forwardedRef)
       ref: ref,
       alignOffset: alignOffsetPx,
       className: clsx(styles.menuBlock, className),
-      "data-modern": enableModernizedComponents ? 'true' : 'false',
+      "data-modern": 'true' ,
       "data-bp-animated": isAnimationEnabled ? 'true' : 'false',
       sideOffset: sideOffsetPx,
       children: children