@box/blueprint-web 16.20.7 → 17.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (100) hide show
  1. package/dist/lib-esm/accordion/accordion.js +7 -18
  2. package/dist/lib-esm/avatar/avatar.js +1 -5
  3. package/dist/lib-esm/blueprint-modernization-context/blueprint-modernization-context.d.ts +20 -1
  4. package/dist/lib-esm/blueprint-modernization-context/blueprint-modernization-context.js +10 -2
  5. package/dist/lib-esm/blueprint-modernization-context/index.d.ts +4 -0
  6. package/dist/lib-esm/blueprint-modernization-context/useBlueprintModernization.d.ts +4 -0
  7. package/dist/lib-esm/blueprint-modernization-context/useBlueprintModernization.js +4 -0
  8. package/dist/lib-esm/card/card.js +1 -5
  9. package/dist/lib-esm/card-tooltip/card-tooltip.js +1 -5
  10. package/dist/lib-esm/checkbox/checkbox-item.js +1 -5
  11. package/dist/lib-esm/collapsible/collapsible-section.js +6 -9
  12. package/dist/lib-esm/combobox/combobox.js +8 -15
  13. package/dist/lib-esm/combobox-group/combobox-group.js +1 -5
  14. package/dist/lib-esm/content-card/content-card-body.js +2 -6
  15. package/dist/lib-esm/content-card/content-card.js +2 -9
  16. package/dist/lib-esm/date-picker/date-picker.js +1 -5
  17. package/dist/lib-esm/ghost/ghost.js +1 -4
  18. package/dist/lib-esm/icon-dual-state-button/icon-dual-state-button.js +1 -5
  19. package/dist/lib-esm/icon-toggle-button/icon-toggle-button.js +5 -14
  20. package/dist/lib-esm/inline-table/inline-table.js +1 -5
  21. package/dist/lib-esm/input-chip/input-chip.js +2 -5
  22. package/dist/lib-esm/list-item/table-column.js +6 -15
  23. package/dist/lib-esm/list-item/table-header-default.js +1 -5
  24. package/dist/lib-esm/list-item/table.js +1 -4
  25. package/dist/lib-esm/loading-indicator/loading-indicator.js +1 -6
  26. package/dist/lib-esm/modal/modal-close.js +2 -6
  27. package/dist/lib-esm/modal/modal-content.js +1 -5
  28. package/dist/lib-esm/navigation-menu/navigation-menu-content.js +1 -5
  29. package/dist/lib-esm/navigation-menu/navigation-menu-link.js +1 -5
  30. package/dist/lib-esm/page/page-root.js +1 -5
  31. package/dist/lib-esm/primitives/base-button/base-button-icon.js +1 -4
  32. package/dist/lib-esm/primitives/base-button/base-button.js +1 -5
  33. package/dist/lib-esm/primitives/base-inline-notice/base-inline-notice-icon.js +4 -12
  34. package/dist/lib-esm/primitives/base-inline-notice/base-inline-notice.js +1 -5
  35. package/dist/lib-esm/primitives/base-text-input/base-text-input.js +4 -10
  36. package/dist/lib-esm/primitives/calendar/calendar.js +5 -8
  37. package/dist/lib-esm/primitives/chips/chip.js +1 -5
  38. package/dist/lib-esm/primitives/chips/chips-group.js +1 -5
  39. package/dist/lib-esm/primitives/context-menu/context-menu-item.js +2 -6
  40. package/dist/lib-esm/primitives/context-menu/context-menu-menu-content.js +2 -6
  41. package/dist/lib-esm/primitives/context-menu/context-menu-menu-header.js +1 -5
  42. package/dist/lib-esm/primitives/context-menu/context-menu-sub-menu-content.js +2 -6
  43. package/dist/lib-esm/primitives/dropdown-menu/dropdown-menu-checkbox-item.js +6 -10
  44. package/dist/lib-esm/primitives/dropdown-menu/dropdown-menu-content.js +2 -6
  45. package/dist/lib-esm/primitives/dropdown-menu/dropdown-menu-header.js +4 -11
  46. package/dist/lib-esm/primitives/dropdown-menu/dropdown-menu-item.js +3 -7
  47. package/dist/lib-esm/primitives/dropdown-menu/dropdown-menu-radio-select-item.js +6 -10
  48. package/dist/lib-esm/primitives/dropdown-menu/dropdown-menu-sub-menu-content.js +2 -6
  49. package/dist/lib-esm/primitives/icon-button/icon-button.js +1 -5
  50. package/dist/lib-esm/primitives/inline-error/inline-error.js +3 -6
  51. package/dist/lib-esm/primitives/link/link.js +1 -5
  52. package/dist/lib-esm/primitives/menu-combobox/menu-combobox-content.js +1 -5
  53. package/dist/lib-esm/primitives/menu-combobox/menu-combobox-empty.js +1 -5
  54. package/dist/lib-esm/primitives/menu-combobox/menu-combobox-header.js +2 -6
  55. package/dist/lib-esm/primitives/menu-combobox/menu-combobox-search.js +3 -7
  56. package/dist/lib-esm/primitives/notification/private-notification-element.js +8 -39
  57. package/dist/lib-esm/primitives/page-header/page-header.js +1 -4
  58. package/dist/lib-esm/primitives/popover/popover-content-container.js +1 -5
  59. package/dist/lib-esm/primitives/select-menu-grid/select-menu-grid-option.js +6 -24
  60. package/dist/lib-esm/primitives/tabs/tab-list.js +2 -6
  61. package/dist/lib-esm/progress-bar/progress-bar.js +1 -5
  62. package/dist/lib-esm/radio-group/radio-group.js +1 -5
  63. package/dist/lib-esm/radio-tiles/radio-tiles-option.js +1 -5
  64. package/dist/lib-esm/radio-tiles/radio-tiles.js +1 -5
  65. package/dist/lib-esm/search-input/search-input-controlled/search-input-controlled.js +5 -8
  66. package/dist/lib-esm/search-input/search-input.js +5 -8
  67. package/dist/lib-esm/select/select.js +5 -15
  68. package/dist/lib-esm/side-panel/side-panel-close.js +3 -6
  69. package/dist/lib-esm/side-panel/side-panel-content.js +2 -9
  70. package/dist/lib-esm/side-panel/side-panel-overlay.js +1 -5
  71. package/dist/lib-esm/small-list-item/small-list.js +1 -5
  72. package/dist/lib-esm/split-button/split-button.js +2 -6
  73. package/dist/lib-esm/status/status.js +1 -5
  74. package/dist/lib-esm/switch/switch-item.js +1 -5
  75. package/dist/lib-esm/text/text.js +1 -5
  76. package/dist/lib-esm/text-area/text-area-autosize/text-area-autosize.js +5 -19
  77. package/dist/lib-esm/text-area/text-area-autosize/text-area-autosize.module.js +1 -1
  78. package/dist/lib-esm/text-area/text-area.js +1 -5
  79. package/dist/lib-esm/text-button/text-button.js +1 -5
  80. package/dist/lib-esm/text-input/text-input.js +3 -6
  81. package/dist/lib-esm/text-toggle-button/text-toggle-button.js +1 -5
  82. package/dist/lib-esm/time-picker/time-picker.js +6 -22
  83. package/dist/lib-esm/toolbar/toolbar-button.js +1 -5
  84. package/dist/lib-esm/toolbar/toolbar-dropdown-indicator.js +3 -6
  85. package/dist/lib-esm/toolbar/toolbar-input.js +1 -5
  86. package/dist/lib-esm/toolbar/toolbar-link.js +1 -5
  87. package/dist/lib-esm/toolbar/toolbar-root.js +3 -6
  88. package/dist/lib-esm/toolbar/toolbar-text-toggle-item.js +1 -5
  89. package/dist/lib-esm/toolbar/toolbar-toggle-group.js +1 -5
  90. package/dist/lib-esm/toolbar/toolbar-toggle-item.js +1 -5
  91. package/dist/lib-esm/tooltip/tooltip.js +2 -19
  92. package/dist/lib-esm/trigger-button/trigger-button.js +4 -11
  93. package/dist/lib-esm/util-components/base-grid-list-item/base-grid-list.js +1 -5
  94. package/dist/lib-esm/util-components/base-grid-list-item/utils/rac-tooltip.js +3 -6
  95. package/dist/lib-esm/util-components/legend/legend.js +1 -6
  96. package/dist/lib-esm/util-components/list-checkbox/list-checkbox.js +1 -5
  97. package/dist/lib-esm/util-components/menu-item-sections/menu-item-sections.js +2 -9
  98. package/dist/lib-esm/util-components/text-with-info-badge/text-with-info-badge.js +1 -6
  99. package/dist/lib-esm/utils/TooltipWrapper.d.ts +1 -1
  100. package/package.json +3 -3
@@ -2,7 +2,6 @@ import { jsx } from 'react/jsx-runtime';
2
2
  import { TabList as TabList$1 } from '@ariakit/react';
3
3
  import clsx from 'clsx';
4
4
  import { forwardRef } from 'react';
5
- import { useBlueprintModernization } from '../../blueprint-modernization-context/useBlueprintModernization.js';
6
5
  import styles from './tabs.module.js';
7
6
  import { useTabs } from './use-tabs.js';
8
7
 
@@ -14,20 +13,17 @@ const TabList = /*#__PURE__*/forwardRef(function TabList(props, ref) {
14
13
  ...rest
15
14
  } = props;
16
15
  const tab = useTabs();
17
- const {
18
- enableModernizedComponents
19
- } = useBlueprintModernization();
20
16
  if (!tab) {
21
17
  throw new Error('TabList must be wrapped in a Tabs component');
22
18
  }
23
19
  return jsx("div", {
24
20
  className: clsx(styles.tabsListContainer, containerClassname),
25
- "data-modern": enableModernizedComponents ? 'true' : 'false',
21
+ "data-modern": 'true' ,
26
22
  children: jsx(TabList$1, {
27
23
  ...rest,
28
24
  ref: ref,
29
25
  className: clsx(variant === 'contentSwitcher' ? styles.contentSwitchTabList : styles.tabList, className),
30
- "data-modern": enableModernizedComponents ? 'true' : 'false',
26
+ "data-modern": 'true' ,
31
27
  store: tab
32
28
  })
33
29
  });
@@ -1,7 +1,6 @@
1
1
  import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
2
2
  import clsx from 'clsx';
3
3
  import { ProgressBar as ProgressBar$1 } from 'react-aria-components';
4
- import { useBlueprintModernization } from '../blueprint-modernization-context/useBlueprintModernization.js';
5
4
  import { useUniqueId } from '../utils/useUniqueId.js';
6
5
  import styles from './progress-bar.module.js';
7
6
 
@@ -13,9 +12,6 @@ function ProgressBar({
13
12
  ...rest
14
13
  }) {
15
14
  const resolvedLabelId = useUniqueId('progress-bar-label-', !labelId) || labelId;
16
- const {
17
- enableModernizedComponents
18
- } = useBlueprintModernization();
19
15
  return jsxs(Fragment, {
20
16
  children: [label && jsx("div", {
21
17
  className: "label",
@@ -26,7 +22,7 @@ function ProgressBar({
26
22
  "aria-label": ariaLabel,
27
23
  "aria-labelledby": label ? resolvedLabelId : undefined,
28
24
  className: clsx(styles.reactAriaProgressBar, className),
29
- "data-modern": enableModernizedComponents ? 'true' : 'false',
25
+ "data-modern": 'true' ,
30
26
  children: ({
31
27
  percentage
32
28
  }) => {
@@ -2,7 +2,6 @@ import { jsx } from 'react/jsx-runtime';
2
2
  import * as RadixRadioGroup from '@radix-ui/react-radio-group';
3
3
  import clsx from 'clsx';
4
4
  import { forwardRef } from 'react';
5
- import { useBlueprintModernization } from '../blueprint-modernization-context/useBlueprintModernization.js';
6
5
  import styles from './radio-group.module.js';
7
6
 
8
7
  const RadioGroup = /*#__PURE__*/forwardRef((props, ref) => {
@@ -17,16 +16,13 @@ const RadioGroup = /*#__PURE__*/forwardRef((props, ref) => {
17
16
  orientation,
18
17
  ...rest
19
18
  } = props;
20
- const {
21
- enableModernizedComponents
22
- } = useBlueprintModernization();
23
19
  return jsx(RadixRadioGroup.Root, {
24
20
  ...rest,
25
21
  ref: ref,
26
22
  className: clsx([styles.root], {
27
23
  [styles.horizontal]: orientation === 'horizontal'
28
24
  }, className),
29
- "data-modern": enableModernizedComponents ? 'true' : 'false',
25
+ "data-modern": 'true' ,
30
26
  defaultValue: defaultValue,
31
27
  loop: loop,
32
28
  name: name,
@@ -3,7 +3,6 @@ import clsx from 'clsx';
3
3
  import React__default, { useRef } from 'react';
4
4
  import { Text } from '../text/text.js';
5
5
  import { useRadioTilesContext } from './radio-tiles.context.js';
6
- import { useBlueprintModernization } from '../blueprint-modernization-context/useBlueprintModernization.js';
7
6
  import { useFullTextTooltip } from '../utils/useFullTextTooltip.js';
8
7
  import { VisuallyHidden } from '../visually-hidden/visually-hidden.js';
9
8
  import styles from './radio-tiles-option.module.js';
@@ -45,16 +44,13 @@ const RadioTilesOption = function RadioTilesOption({
45
44
  [styles.checked]: isSelected,
46
45
  [styles.disabled]: isDisabled
47
46
  }, className);
48
- const {
49
- enableModernizedComponents
50
- } = useBlueprintModernization();
51
47
  return (
52
48
  // @ts-expect-error Fix this type error - DSYS-1597
53
49
  jsx(Tooltip, {
54
50
  ...wrapperProps,
55
51
  children: jsx("div", {
56
52
  className: radioTileClassNames,
57
- "data-modern": enableModernizedComponents ? 'true' : 'false',
53
+ "data-modern": 'true' ,
58
54
  "data-target-id": dataTargetId,
59
55
  children: jsxs("label", {
60
56
  className: clsx({
@@ -1,7 +1,6 @@
1
1
  import { jsx, jsxs } from 'react/jsx-runtime';
2
2
  import clsx from 'clsx';
3
3
  import { useMemo } from 'react';
4
- import { useBlueprintModernization } from '../blueprint-modernization-context/useBlueprintModernization.js';
5
4
  import { InlineError } from '../primitives/inline-error/inline-error.js';
6
5
  import { useUniqueId } from '../utils/useUniqueId.js';
7
6
  import { RadioTilesOption } from './radio-tiles-option.js';
@@ -28,9 +27,6 @@ const RadioTilesRoot = ({
28
27
  [styles.hasColumns]: Number(columns) > 0,
29
28
  [variant === 'compact' ? styles.compact : styles.default]: true
30
29
  }, className);
31
- const {
32
- enableModernizedComponents
33
- } = useBlueprintModernization();
34
30
  const hasError = !!error && !disabled;
35
31
  const inlineErrorId = useUniqueId('inline-error-');
36
32
  const contextValue = useMemo(() => ({
@@ -43,7 +39,7 @@ const RadioTilesRoot = ({
43
39
  value: contextValue,
44
40
  children: jsxs("div", {
45
41
  className: styles.container,
46
- "data-modern": enableModernizedComponents ? 'true' : 'false',
42
+ "data-modern": 'true' ,
47
43
  children: [jsx("div", {
48
44
  "aria-describedby": hasError ? inlineErrorId : undefined,
49
45
  "aria-invalid": hasError || undefined,
@@ -1,10 +1,9 @@
1
1
  import { jsx, jsxs } from 'react/jsx-runtime';
2
- import { Search as Search$1 } from '@box/blueprint-web-assets/icons/Fill';
2
+ import '@box/blueprint-web-assets/icons/Fill';
3
3
  import { Search } from '@box/blueprint-web-assets/icons/Medium';
4
4
  import { IconCtaIcon, IconIconOnLightSecondary } from '@box/blueprint-web-assets/tokens/tokens';
5
5
  import clsx from 'clsx';
6
6
  import { forwardRef, Children, useMemo, cloneElement } from 'react';
7
- import { useBlueprintModernization } from '../../blueprint-modernization-context/useBlueprintModernization.js';
8
7
  import { IconButton } from '../../primitives/icon-button/icon-button.js';
9
8
  import { Tooltip } from '../../tooltip/tooltip.js';
10
9
  import { switchCase } from '../../utils/switchCase.js';
@@ -30,9 +29,7 @@ const SearchInputControlled = /*#__PURE__*/forwardRef((props, forwardedRef) => {
30
29
  variant,
31
30
  ...rest
32
31
  } = props;
33
- const {
34
- enableModernizedComponents
35
- } = useBlueprintModernization();
32
+ const enableModernizedComponents = true;
36
33
  const handleIEMComposition = e => {
37
34
  if (e.nativeEvent.isComposing) {
38
35
  e.preventDefault();
@@ -81,11 +78,11 @@ const SearchInputControlled = /*#__PURE__*/forwardRef((props, forwardedRef) => {
81
78
  const CustomStartIconComponent = useMemo(() => startIcon && /*#__PURE__*/cloneElement(startIcon, {
82
79
  className: clsx(startIcon.props?.className, styles.searchIcon, isGlobal && styles.global)
83
80
  }), [startIcon, isGlobal]);
84
- const Search$2 = useMemo(() => enableModernizedComponents ? Search : Search$1, [enableModernizedComponents]);
81
+ const Search$1 = useMemo(() => Search , [enableModernizedComponents]);
85
82
  return jsxs("div", {
86
83
  className: clsx(styles.search, disabled && styles.disabled, className),
87
- "data-modern": enableModernizedComponents ? 'true' : 'false',
88
- children: [startIcon ? CustomStartIconComponent : jsx(Search$2, {
84
+ "data-modern": 'true' ,
85
+ children: [startIcon ? CustomStartIconComponent : jsx(Search$1, {
89
86
  "aria-hidden": "true",
90
87
  className: clsx(styles.searchIcon, isGlobal && styles.global),
91
88
  color: IconIconOnLightSecondary
@@ -1,10 +1,9 @@
1
1
  import { jsxs, jsx } from 'react/jsx-runtime';
2
- import { Search as Search$1, XMark as XMark$1 } from '@box/blueprint-web-assets/icons/Fill';
2
+ import { XMark as XMark$1 } from '@box/blueprint-web-assets/icons/Fill';
3
3
  import { Search, XMark } from '@box/blueprint-web-assets/icons/Medium';
4
4
  import { IconIconOnLightSecondary, IconCtaIcon } from '@box/blueprint-web-assets/tokens/tokens';
5
5
  import clsx from 'clsx';
6
6
  import { forwardRef, useState, useCallback, Children } from 'react';
7
- import { useBlueprintModernization } from '../blueprint-modernization-context/useBlueprintModernization.js';
8
7
  import { IconButton } from '../primitives/icon-button/icon-button.js';
9
8
  import { switchCase } from '../utils/switchCase.js';
10
9
  import styles from './search.module.js';
@@ -77,9 +76,7 @@ const SearchInput = /*#__PURE__*/forwardRef((props, forwardedRef) => {
77
76
  variant,
78
77
  ...rest
79
78
  } = props;
80
- const {
81
- enableModernizedComponents
82
- } = useBlueprintModernization();
79
+ const enableModernizedComponents = true;
83
80
  const [searchInputValue, setSearchInputValue] = useState(defaultValue);
84
81
  const updateSearchValue = useCallback(value => {
85
82
  setSearchInputValue(value);
@@ -104,12 +101,12 @@ const SearchInput = /*#__PURE__*/forwardRef((props, forwardedRef) => {
104
101
  };
105
102
  const isGlobal = variant === 'global';
106
103
  const showActionButton = Children.count(children) > 0;
107
- const Search$2 = enableModernizedComponents ? Search : Search$1;
104
+ const Search$1 = Search ;
108
105
  const ClearIcon = useCallback(() => getClearIcon(isGlobal, enableModernizedComponents)(), [isGlobal, enableModernizedComponents]);
109
106
  return jsxs("div", {
110
107
  className: clsx(styles.search, disabled && styles.disabled, className),
111
- "data-modern": enableModernizedComponents ? 'true' : 'false',
112
- children: [jsx(Search$2, {
108
+ "data-modern": 'true' ,
109
+ children: [jsx(Search$1, {
113
110
  "aria-hidden": "true",
114
111
  className: clsx(styles.searchIcon, isGlobal && styles.global),
115
112
  color: IconIconOnLightSecondary
@@ -1,5 +1,5 @@
1
1
  import { jsx, jsxs } from 'react/jsx-runtime';
2
- import { PencilCrossed as PencilCrossed$1, Caret, Checkmark } from '@box/blueprint-web-assets/icons/Fill';
2
+ import { Checkmark } from '@box/blueprint-web-assets/icons/Fill';
3
3
  import { PencilCrossed, ChevronDown } from '@box/blueprint-web-assets/icons/Medium';
4
4
  import { bpSize030, bpIconIconOnLight } from '@box/blueprint-web-assets/tokens/tokens';
5
5
  import * as ScrollArea from '@radix-ui/react-scroll-area';
@@ -9,7 +9,6 @@ import { forwardRef, useEffect, useCallback, useLayoutEffect } from 'react';
9
9
  import '../blueprint-configuration-context/blueprint-configuration-context.js';
10
10
  import '../blueprint-configuration-context/consts.js';
11
11
  import { useBlueprintConfiguration } from '../blueprint-configuration-context/useBlueprintConfiguration.js';
12
- import { useBlueprintModernization } from '../blueprint-modernization-context/useBlueprintModernization.js';
13
12
  import { InlineError } from '../primitives/inline-error/inline-error.js';
14
13
  import { Text } from '../text/text.js';
15
14
  import { useLabelable } from '../util-components/labelable/useLabelable.js';
@@ -59,9 +58,6 @@ const Root = /*#__PURE__*/forwardRef((props, forwardedRef) => {
59
58
  onChange: onValueChangeProp
60
59
  });
61
60
  const selectId = useUniqueId('select-', !id) || id || 'default-select-id';
62
- const {
63
- enableModernizedComponents
64
- } = useBlueprintModernization();
65
61
  const {
66
62
  componentsWithAnimationEnabled
67
63
  } = useBlueprintConfiguration();
@@ -108,12 +104,12 @@ const Root = /*#__PURE__*/forwardRef((props, forwardedRef) => {
108
104
  });
109
105
  const icon = (() => {
110
106
  if (readonly) {
111
- const PencilCrossedIcon = enableModernizedComponents ? PencilCrossed : PencilCrossed$1;
107
+ const PencilCrossedIcon = PencilCrossed ;
112
108
  return jsx(PencilCrossedIcon, {
113
109
  className: styles.iconPencilCrossed
114
110
  });
115
111
  }
116
- if (enableModernizedComponents) {
112
+ {
117
113
  return jsx(ChevronDown, {
118
114
  className: styles.iconCaret,
119
115
  color: bpIconIconOnLight,
@@ -121,16 +117,13 @@ const Root = /*#__PURE__*/forwardRef((props, forwardedRef) => {
121
117
  width: bpSize030
122
118
  });
123
119
  }
124
- return jsx(Caret, {
125
- className: styles.iconCaret
126
- });
127
120
  })();
128
121
  return jsxs("div", {
129
122
  className: clsx(styles.container, {
130
123
  [styles.disabled]: disabled
131
124
  }, className),
132
125
  "data-bp-animated": isAnimationEnabled ? 'true' : 'false',
133
- "data-modern": enableModernizedComponents ? 'true' : 'false',
126
+ "data-modern": 'true' ,
134
127
  children: [jsx(Label, {
135
128
  className: styles.label,
136
129
  hideLabel: hideLabel
@@ -227,9 +220,6 @@ const Content = /*#__PURE__*/forwardRef((props, forwardedRef) => {
227
220
  onAnimationEnd: onAnimationEndProp,
228
221
  ...contentProps
229
222
  } = props;
230
- const {
231
- enableModernizedComponents
232
- } = useBlueprintModernization();
233
223
  const {
234
224
  completeExit,
235
225
  hasExitStyles,
@@ -248,7 +238,7 @@ const Content = /*#__PURE__*/forwardRef((props, forwardedRef) => {
248
238
  className: clsx(styles.content, className),
249
239
  "data-bp-animated": isAnimationEnabled ? 'true' : 'false',
250
240
  "data-bp-exiting": hasExitStyles ? 'true' : 'false',
251
- "data-modern": enableModernizedComponents ? 'true' : 'false',
241
+ "data-modern": 'true' ,
252
242
  onAnimationEnd: composeEventHandlers(onAnimationEndProp, handleExitAnimationEvent, {
253
243
  checkForDefaultPrevented: false
254
244
  }),
@@ -1,9 +1,8 @@
1
1
  import { jsx } from 'react/jsx-runtime';
2
- import { XMark as XMark$1 } from '@box/blueprint-web-assets/icons/Fill';
2
+ import '@box/blueprint-web-assets/icons/Fill';
3
3
  import { XMark } from '@box/blueprint-web-assets/icons/Medium';
4
4
  import * as RadixDialog from '@radix-ui/react-dialog';
5
5
  import { forwardRef, useMemo } from 'react';
6
- import { useBlueprintModernization } from '../blueprint-modernization-context/useBlueprintModernization.js';
7
6
  import { IconButton } from '../primitives/icon-button/icon-button.js';
8
7
  import { useBreakpoint, Breakpoint } from '../utils/useBreakpoint.js';
9
8
  import styles from './side-panel.module.js';
@@ -21,12 +20,10 @@ const SidePanelClose = /*#__PURE__*/forwardRef(({
21
20
  }, forwardedRef) => {
22
21
  const breakpoint = useBreakpoint();
23
22
  const smallBreakpointActive = breakpoint === Breakpoint.Small;
24
- const {
25
- enableModernizedComponents
26
- } = useBlueprintModernization();
23
+ const enableModernizedComponents = true;
27
24
  const finalProps = smallBreakpointActive ? smallViewportProps : {};
28
25
  const closeIcon = useMemo(() => {
29
- return enableModernizedComponents ? XMark : XMark$1;
26
+ return XMark ;
30
27
  }, [enableModernizedComponents]);
31
28
  return jsx(RadixDialog.Close, {
32
29
  ref: forwardedRef,
@@ -3,7 +3,6 @@ import * as RadixDialog from '@radix-ui/react-dialog';
3
3
  import { FocusScope } from '@radix-ui/react-focus-scope';
4
4
  import { clsx } from 'clsx';
5
5
  import { forwardRef, useCallback } from 'react';
6
- import { useBlueprintModernization } from '../blueprint-modernization-context/useBlueprintModernization.js';
7
6
  import styles from './side-panel.module.js';
8
7
  import { useVariant } from './variant-context.js';
9
8
 
@@ -25,9 +24,6 @@ const SidePanelContent = /*#__PURE__*/forwardRef(({
25
24
  event.preventDefault();
26
25
  }
27
26
  }, [isInteractiveOverlayVariant]);
28
- const {
29
- enableModernizedComponents
30
- } = useBlueprintModernization();
31
27
  return jsx(FocusScope, {
32
28
  trapped: !isInteractiveOverlayVariant,
33
29
  children: jsx(RadixDialog.Content, {
@@ -41,7 +37,7 @@ const SidePanelContent = /*#__PURE__*/forwardRef(({
41
37
  [styles.dropShadowContent]: variant === 'dropShadowOverlay',
42
38
  [styles.overlayContent]: isOverlayVariant
43
39
  }, className),
44
- "data-modern": enableModernizedComponents ? 'true' : 'false',
40
+ "data-modern": 'true' ,
45
41
  onInteractOutside: handleInteractOutside,
46
42
  children: children
47
43
  })
@@ -55,13 +51,10 @@ const SidePanelPersistentContent = /*#__PURE__*/forwardRef(({
55
51
  className,
56
52
  ...props
57
53
  }, forwardedRef) => {
58
- const {
59
- enableModernizedComponents
60
- } = useBlueprintModernization();
61
54
  return jsx("div", {
62
55
  ref: forwardedRef,
63
56
  className: clsx(styles.content, styles.contentNormal, styles.persistentContent, className),
64
- "data-modern": enableModernizedComponents ? 'true' : 'false',
57
+ "data-modern": 'true' ,
65
58
  ...props,
66
59
  children: children
67
60
  });
@@ -2,7 +2,6 @@ import { jsx } from 'react/jsx-runtime';
2
2
  import * as RadixDialog from '@radix-ui/react-dialog';
3
3
  import { clsx } from 'clsx';
4
4
  import { forwardRef } from 'react';
5
- import { useBlueprintModernization } from '../blueprint-modernization-context/useBlueprintModernization.js';
6
5
  import styles from './side-panel.module.js';
7
6
  import { useVariant } from './variant-context.js';
8
7
 
@@ -17,9 +16,6 @@ const SidePanelOverlay = /*#__PURE__*/forwardRef(({
17
16
  ...props
18
17
  }, forwardedRef) => {
19
18
  const variant = useVariant();
20
- const {
21
- enableModernizedComponents
22
- } = useBlueprintModernization();
23
19
  return jsx(RadixDialog.Portal, {
24
20
  container: container,
25
21
  children: variant === 'interactiveOverlay' ? children : jsx(RadixDialog.Overlay, {
@@ -27,7 +23,7 @@ const SidePanelOverlay = /*#__PURE__*/forwardRef(({
27
23
  className: clsx(styles.overlay, {
28
24
  [styles.dropShadowOverlay]: variant === 'dropShadowOverlay'
29
25
  }, className),
30
- "data-modern": enableModernizedComponents ? 'true' : 'false',
26
+ "data-modern": 'true' ,
31
27
  ...props,
32
28
  children: children
33
29
  })
@@ -1,6 +1,5 @@
1
1
  import { jsx } from 'react/jsx-runtime';
2
2
  import { forwardRef } from 'react';
3
- import { useBlueprintModernization } from '../blueprint-modernization-context/useBlueprintModernization.js';
4
3
  import { BaseGridList } from '../util-components/base-grid-list-item/base-grid-list.js';
5
4
 
6
5
  const SmallList = /*#__PURE__*/forwardRef(function SmallList(props, forwardedRef) {
@@ -8,13 +7,10 @@ const SmallList = /*#__PURE__*/forwardRef(function SmallList(props, forwardedRef
8
7
  children,
9
8
  ...rest
10
9
  } = props;
11
- const {
12
- enableModernizedComponents
13
- } = useBlueprintModernization();
14
10
  return jsx(BaseGridList, {
15
11
  ...rest,
16
12
  ref: forwardedRef,
17
- "data-modern": enableModernizedComponents ? 'true' : 'false',
13
+ "data-modern": 'true' ,
18
14
  layoutStyle: "small-list",
19
15
  children: children
20
16
  });
@@ -1,7 +1,6 @@
1
1
  import { jsxs, jsx } from 'react/jsx-runtime';
2
2
  import clsx from 'clsx';
3
3
  import { forwardRef, useState, useRef, useCallback } from 'react';
4
- import { useBlueprintModernization } from '../blueprint-modernization-context/useBlueprintModernization.js';
5
4
  import { Button } from '../button/button.js';
6
5
  import { DropdownMenu } from '../primitives/dropdown-menu/index.js';
7
6
  import { useControllableState } from '../utils/useControllableState.js';
@@ -46,9 +45,6 @@ const SplitButton = /*#__PURE__*/forwardRef((props, forwardedRef) => {
46
45
  onChange: onOpenChange,
47
46
  defaultProp: defaultOpen
48
47
  });
49
- const {
50
- enableModernizedComponents
51
- } = useBlueprintModernization();
52
48
  const localLeftRef = useRef(null);
53
49
  const onLeftButtonMountCallback = useCallback(button => {
54
50
  if (button?.offsetWidth) {
@@ -88,7 +84,7 @@ const SplitButton = /*#__PURE__*/forwardRef((props, forwardedRef) => {
88
84
  open: open,
89
85
  children: [jsxs("span", {
90
86
  className: styles.splitButton,
91
- "data-modern": enableModernizedComponents ? 'true' : 'false',
87
+ "data-modern": 'true' ,
92
88
  children: [jsx(Button, {
93
89
  ...rest,
94
90
  ref: onLeftButtonMountCallback,
@@ -116,7 +112,7 @@ const SplitButton = /*#__PURE__*/forwardRef((props, forwardedRef) => {
116
112
  }), jsx(DropdownMenu.Content, {
117
113
  className: styles.dropdown,
118
114
  container: container,
119
- "data-modern": enableModernizedComponents ? 'true' : 'false',
115
+ "data-modern": 'true' ,
120
116
  ...alignOpts,
121
117
  children: children
122
118
  })]
@@ -2,7 +2,6 @@ import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
2
2
  import { IconIconOnLight } from '@box/blueprint-web-assets/tokens/tokens';
3
3
  import clsx from 'clsx';
4
4
  import { forwardRef, useMemo, createElement } from 'react';
5
- import { useBlueprintModernization } from '../blueprint-modernization-context/useBlueprintModernization.js';
6
5
  import { colorToTokenMap, colors, colorsMap } from './consts.js';
7
6
  import styles from './status.module.js';
8
7
 
@@ -23,9 +22,6 @@ const Status = /*#__PURE__*/forwardRef((props, forwardedRef) => {
23
22
  'aria-label': ariaLabel,
24
23
  ...rest
25
24
  } = props;
26
- const {
27
- enableModernizedComponents
28
- } = useBlueprintModernization();
29
25
  const backgroundColor = useMemo(() => {
30
26
  const bgColor = color || getColorFromColorsMap(colorIndex);
31
27
  return colorToTokenMap[bgColor] || 'SurfaceStatusSurfaceGray';
@@ -78,7 +74,7 @@ const Status = /*#__PURE__*/forwardRef((props, forwardedRef) => {
78
74
  });
79
75
  return jsx("span", {
80
76
  className: clsx(styles.maxContainer, className),
81
- "data-modern": enableModernizedComponents ? 'true' : 'false',
77
+ "data-modern": 'true' ,
82
78
  children: innerElement
83
79
  });
84
80
  });
@@ -5,7 +5,6 @@ import { forwardRef, useState } from 'react';
5
5
  import '../blueprint-configuration-context/blueprint-configuration-context.js';
6
6
  import '../blueprint-configuration-context/consts.js';
7
7
  import { useBlueprintConfiguration } from '../blueprint-configuration-context/useBlueprintConfiguration.js';
8
- import { useBlueprintModernization } from '../blueprint-modernization-context/useBlueprintModernization.js';
9
8
  import { TextWithInfoBadge } from '../util-components/text-with-info-badge/text-with-info-badge.js';
10
9
  import { composeEventHandlers } from '../utils/composeEventHandlers.js';
11
10
  import { useUniqueId } from '../utils/useUniqueId.js';
@@ -29,9 +28,6 @@ const Switch = /*#__PURE__*/forwardRef((props, forwardedRef) => {
29
28
  ...rest
30
29
  } = props;
31
30
  const descriptionId = useUniqueId('description-', !!description);
32
- const {
33
- enableModernizedComponents
34
- } = useBlueprintModernization();
35
31
  const {
36
32
  componentsWithAnimationEnabled
37
33
  } = useBlueprintConfiguration();
@@ -41,7 +37,7 @@ const Switch = /*#__PURE__*/forwardRef((props, forwardedRef) => {
41
37
  className: clsx([styles.option], {
42
38
  [styles.disabled]: disabled
43
39
  }, className),
44
- "data-modern": enableModernizedComponents ? 'true' : 'false',
40
+ "data-modern": 'true' ,
45
41
  "data-bp-animated": isAnimationEnabled ? 'true' : 'false',
46
42
  children: [jsxs("label", {
47
43
  className: clsx(styles.label, {
@@ -1,7 +1,6 @@
1
1
  import clsx from 'clsx';
2
2
  import { forwardRef, createElement } from 'react';
3
3
  import { useBlueprintConfiguration } from '../blueprint-configuration-context/useBlueprintConfiguration.js';
4
- import { useBlueprintModernization } from '../blueprint-modernization-context/useBlueprintModernization.js';
5
4
  import styles from './text.module.js';
6
5
 
7
6
  const Text = /*#__PURE__*/forwardRef((props, forwardedRef) => {
@@ -13,9 +12,6 @@ const Text = /*#__PURE__*/forwardRef((props, forwardedRef) => {
13
12
  className,
14
13
  ...rest
15
14
  } = props;
16
- const {
17
- enableModernizedComponents
18
- } = useBlueprintModernization();
19
15
  const {
20
16
  typography
21
17
  } = useBlueprintConfiguration();
@@ -23,7 +19,7 @@ const Text = /*#__PURE__*/forwardRef((props, forwardedRef) => {
23
19
  ...rest,
24
20
  ref: forwardedRef,
25
21
  className: clsx(styles.textReset, styles.breakWord, styles[variant], styles[color], className),
26
- 'data-modern': enableModernizedComponents ? 'true' : 'false',
22
+ 'data-modern': 'true' ,
27
23
  'data-typography': typography
28
24
  }, children);
29
25
  });
@@ -3,7 +3,6 @@ import { PencilCrossed } from '@box/blueprint-web-assets/icons/Medium';
3
3
  import clsx from 'clsx';
4
4
  import { forwardRef, useRef, useState, useCallback, useEffect, useMemo, cloneElement } from 'react';
5
5
  import { flushSync } from 'react-dom';
6
- import { useBlueprintModernization } from '../../blueprint-modernization-context/useBlueprintModernization.js';
7
6
  import { LoadingIndicator } from '../../loading-indicator/loading-indicator.js';
8
7
  import { debounce } from '../../utils/debounce.js';
9
8
  import { ownerWindow } from '../../utils/ownerWindow.js';
@@ -62,9 +61,7 @@ const TextAreaAutosize = /*#__PURE__*/forwardRef(function TextAreaAutosize(props
62
61
  'data-bp-animated': animatedDataAttribute,
63
62
  ...rest
64
63
  } = props;
65
- const {
66
- enableModernizedComponents
67
- } = useBlueprintModernization();
64
+ const enableModernizedComponents = true;
68
65
  const {
69
66
  current: isControlled
70
67
  } = useRef(value != null);
@@ -241,9 +238,6 @@ const TextAreaAutosize = /*#__PURE__*/forwardRef(function TextAreaAutosize(props
241
238
  });
242
239
  const shouldCompensateScrollbar = !state.overflow && !isScrollbarVisible && (hasError || isLoading && !enableModernizedComponents);
243
240
  const endIcon = useMemo(() => {
244
- if (!enableModernizedComponents) {
245
- return null;
246
- }
247
241
  if (isLoading) {
248
242
  return jsx("div", {
249
243
  className: styles.loadingIndicatorReset,
@@ -272,7 +266,7 @@ const TextAreaAutosize = /*#__PURE__*/forwardRef(function TextAreaAutosize(props
272
266
  return jsxs("div", {
273
267
  className: clsx(styles.border, hasError && styles.hasError, readOnly && styles.readOnly, rest.disabled && styles.disabled),
274
268
  "data-bp-animated": animatedDataAttribute,
275
- "data-modern": enableModernizedComponents ? 'true' : 'false',
269
+ "data-modern": 'true' ,
276
270
  style: {
277
271
  '--end-icon-width': endIconWidth ? `${endIconWidth}px` : '0px'
278
272
  },
@@ -282,7 +276,7 @@ const TextAreaAutosize = /*#__PURE__*/forwardRef(function TextAreaAutosize(props
282
276
  className: clsx(classNames, {
283
277
  [styles.withEndIcon]: !!endIconComponent
284
278
  }, readOnly && styles.readOnly),
285
- "data-modern": enableModernizedComponents ? 'true' : 'false',
279
+ "data-modern": 'true' ,
286
280
  onBlur: onBlur,
287
281
  onChange: handleChange,
288
282
  onFocus: onFocus,
@@ -304,7 +298,7 @@ const TextAreaAutosize = /*#__PURE__*/forwardRef(function TextAreaAutosize(props
304
298
  ref: shadowRef,
305
299
  "aria-hidden": true,
306
300
  className: classNames,
307
- "data-modern": enableModernizedComponents ? 'true' : 'false',
301
+ "data-modern": 'true' ,
308
302
  readOnly: true,
309
303
  style: {
310
304
  ...hiddenTextAreaStyle.shadow,
@@ -312,15 +306,7 @@ const TextAreaAutosize = /*#__PURE__*/forwardRef(function TextAreaAutosize(props
312
306
  padding: 0
313
307
  },
314
308
  tabIndex: -1
315
- }), !enableModernizedComponents && isLoading && jsx(LoadingIndicator, {
316
- "aria-label": loadingAriaLabel,
317
- className: styles.loadingIndicator,
318
- "data-modern": "false",
319
- onClick: focusTextArea,
320
- style: !state.overflow ? {
321
- right: '0.75rem'
322
- } : {}
323
- }), enableModernizedComponents && endIconComponent && jsx("div", {
309
+ }), !enableModernizedComponents, endIconComponent && jsx("div", {
324
310
  className: styles.endIconWrap,
325
311
  children: endIconComponent
326
312
  })]
@@ -1,4 +1,4 @@
1
1
  import '../../index.css';
2
- var styles = {"textArea":"bp_text_area_autosize_module_textArea--970f2","loading":"bp_text_area_autosize_module_loading--970f2","readOnly":"bp_text_area_autosize_module_readOnly--970f2","withEndIcon":"bp_text_area_autosize_module_withEndIcon--970f2","error":"bp_text_area_autosize_module_error--970f2","loadingIndicator":"bp_text_area_autosize_module_loadingIndicator--970f2","loadingIndicatorReset":"bp_text_area_autosize_module_loadingIndicatorReset--970f2","border":"bp_text_area_autosize_module_border--970f2","hasError":"bp_text_area_autosize_module_hasError--970f2","disabled":"bp_text_area_autosize_module_disabled--970f2","endIconWrap":"bp_text_area_autosize_module_endIconWrap--970f2","endIcon":"bp_text_area_autosize_module_endIcon--970f2"};
2
+ var styles = {"textArea":"bp_text_area_autosize_module_textArea--970f2","loading":"bp_text_area_autosize_module_loading--970f2","readOnly":"bp_text_area_autosize_module_readOnly--970f2","withEndIcon":"bp_text_area_autosize_module_withEndIcon--970f2","error":"bp_text_area_autosize_module_error--970f2","loadingIndicatorReset":"bp_text_area_autosize_module_loadingIndicatorReset--970f2","border":"bp_text_area_autosize_module_border--970f2","hasError":"bp_text_area_autosize_module_hasError--970f2","disabled":"bp_text_area_autosize_module_disabled--970f2","endIconWrap":"bp_text_area_autosize_module_endIconWrap--970f2","endIcon":"bp_text_area_autosize_module_endIcon--970f2"};
3
3
 
4
4
  export { styles as default };
@@ -4,7 +4,6 @@ import { forwardRef } from 'react';
4
4
  import '../blueprint-configuration-context/blueprint-configuration-context.js';
5
5
  import '../blueprint-configuration-context/consts.js';
6
6
  import { useBlueprintConfiguration } from '../blueprint-configuration-context/useBlueprintConfiguration.js';
7
- import { useBlueprintModernization } from '../blueprint-modernization-context/useBlueprintModernization.js';
8
7
  import { InlineError } from '../primitives/inline-error/inline-error.js';
9
8
  import { useLabelable } from '../util-components/labelable/useLabelable.js';
10
9
  import { useUniqueId } from '../utils/useUniqueId.js';
@@ -24,9 +23,6 @@ const TextArea = /*#__PURE__*/forwardRef((props, forwardedRef) => {
24
23
  maxRows,
25
24
  ...rest
26
25
  } = props;
27
- const {
28
- enableModernizedComponents
29
- } = useBlueprintModernization();
30
26
  const {
31
27
  componentsWithAnimationEnabled
32
28
  } = useBlueprintConfiguration();
@@ -43,7 +39,7 @@ const TextArea = /*#__PURE__*/forwardRef((props, forwardedRef) => {
43
39
  [styles.disabled]: disabled,
44
40
  [styles.error]: hasError
45
41
  }, className),
46
- "data-modern": enableModernizedComponents ? 'true' : 'false',
42
+ "data-modern": 'true' ,
47
43
  children: [jsx(Label, {
48
44
  className: clsx([styles.label], {
49
45
  [styles.hidden]: hideLabel