@box/blueprint-web 17.2.4 → 17.3.1

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 (16) hide show
  1. package/dist/lib-esm/components.css +288 -602
  2. package/dist/lib-esm/index.css +288 -602
  3. package/dist/lib-esm/primitives/base-button/base-button-icon.js +2 -3
  4. package/dist/lib-esm/primitives/base-button/base-button.js +0 -1
  5. package/dist/lib-esm/primitives/base-button/base-button.module.js +1 -1
  6. package/dist/lib-esm/primitives/base-button/utils.d.ts +1 -1
  7. package/dist/lib-esm/primitives/base-button/utils.js +3 -16
  8. package/dist/lib-esm/primitives/icon-button/icon-button.js +0 -1
  9. package/dist/lib-esm/primitives/icon-button/icon-button.module.js +1 -1
  10. package/dist/lib-esm/split-button/split-button.js +0 -2
  11. package/dist/lib-esm/split-button/styles.module.js +1 -1
  12. package/dist/lib-esm/text-button/text-button.js +0 -2
  13. package/dist/lib-esm/text-button/text-button.module.js +1 -1
  14. package/dist/lib-esm/trigger-button/trigger-button.js +1 -3
  15. package/dist/lib-esm/trigger-button/trigger-button.module.js +1 -1
  16. package/package.json +3 -3
package/dist/lib-esm/primitives/base-button/base-button-icon.js CHANGED
@@ -18,7 +18,6 @@ const BaseButtonIcon = /*#__PURE__*/forwardRef((props, forwardedRef) => {
18
18
  buttonType,
19
19
  ariaLabel
20
20
  } = useBaseButtonContext();
21
- const enableModernizedComponents = true;
22
21
  const isIconOnly = buttonType === 'icon-only';
23
22
  const renderIcon = useCallback(() => {
24
23
  if (!icon) {
@@ -30,12 +29,12 @@ const BaseButtonIcon = /*#__PURE__*/forwardRef((props, forwardedRef) => {
30
29
  return null;
31
30
  }
32
31
  return /*#__PURE__*/createElement(icon, {
33
- ...getIconSize(size, isIconOnly, enableModernizedComponents),
32
+ ...getIconSize(size),
34
33
  color: loading ? 'transparent' : buttonVariantToIconColorMap[variant],
35
34
  role: 'presentation',
36
35
  ...iconProps
37
36
  });
38
- }, [icon, isIconOnly, ariaLabel, size, loading, variant, iconProps, enableModernizedComponents]);
37
+ }, [icon, isIconOnly, ariaLabel, size, loading, variant, iconProps]);
39
38
  return jsx("span", {
40
39
  ref: forwardedRef,
41
40
  className: clsx(styles.icon, className, {
package/dist/lib-esm/primitives/base-button/base-button.js CHANGED
@@ -54,7 +54,6 @@ const BaseButton = /*#__PURE__*/forwardRef((props, forwardedRef) => {
54
54
  ref: useForkRef(ref, forwardedRef),
55
55
  "aria-label": loading ? undefined : ariaLabel,
56
56
  className: getButtonClassName(variant, effectiveSize, buttonType, loading, className),
57
- "data-modern": 'true' ,
58
57
  "data-bp-animated": isAnimationEnabled ? 'true' : 'false',
59
58
  children: jsxs(BaseButtonContext.Provider, {
60
59
  value: context,
package/dist/lib-esm/primitives/base-button/base-button.module.js CHANGED
@@ -1,4 +1,4 @@
1
1
  import '../../index.css';
2
- var styles = {"button":"bp_base_button_module_button--ead06","primary":"bp_base_button_module_primary--ead06","secondary":"bp_base_button_module_secondary--ead06","tertiary":"bp_base_button_module_tertiary--ead06","quaternary":"bp_base_button_module_quaternary--ead06","tertiary-destructive":"bp_base_button_module_tertiary-destructive--ead06","destructive":"bp_base_button_module_destructive--ead06","outline":"bp_base_button_module_outline--ead06","small":"bp_base_button_module_small--ead06","isIconButton":"bp_base_button_module_isIconButton--ead06","isTextWithIconEndButton":"bp_base_button_module_isTextWithIconEndButton--ead06","isTextWithIconStartButton":"bp_base_button_module_isTextWithIconStartButton--ead06","isTextWithStartAndEndIconButton":"bp_base_button_module_isTextWithStartAndEndIconButton--ead06","x-small":"bp_base_button_module_x-small--ead06","large":"bp_base_button_module_large--ead06","icon":"bp_base_button_module_icon--ead06","hide":"bp_base_button_module_hide--ead06"};
2
+ var styles = {"button":"bp_base_button_module_button--b1830","icon":"bp_base_button_module_icon--b1830","primary":"bp_base_button_module_primary--b1830","secondary":"bp_base_button_module_secondary--b1830","tertiary":"bp_base_button_module_tertiary--b1830","quaternary":"bp_base_button_module_quaternary--b1830","tertiary-destructive":"bp_base_button_module_tertiary-destructive--b1830","destructive":"bp_base_button_module_destructive--b1830","outline":"bp_base_button_module_outline--b1830","small":"bp_base_button_module_small--b1830","isIconButton":"bp_base_button_module_isIconButton--b1830","isTextWithIconEndButton":"bp_base_button_module_isTextWithIconEndButton--b1830","isTextWithIconStartButton":"bp_base_button_module_isTextWithIconStartButton--b1830","isTextWithStartAndEndIconButton":"bp_base_button_module_isTextWithStartAndEndIconButton--b1830","x-small":"bp_base_button_module_x-small--b1830","large":"bp_base_button_module_large--b1830","hide":"bp_base_button_module_hide--b1830"};
3
3
 
4
4
  export { styles as default };
package/dist/lib-esm/primitives/base-button/utils.d.ts CHANGED
@@ -4,7 +4,7 @@ import { type BaseButtonIcon } from './base-button-icon';
4
4
  import { type BaseButtonLabel } from './base-button-label';
5
5
  import { type BaseButtonButtonType, type BaseButtonProps } from './types';
6
6
  export declare function getButtonTypeFromChildren(children: ReactNode, baseButtonIcon: typeof BaseButtonIcon, baseButtonLabel: typeof BaseButtonLabel): BaseButtonButtonType;
7
- export declare const getIconSize: (buttonSize: NonNullable<BaseButtonProps["size"]>, isIconButton: boolean, enableModernizedComponents?: boolean) => {
7
+ export declare const getIconSize: (buttonSize: NonNullable<BaseButtonProps["size"]>) => {
8
8
  readonly width: string;
9
9
  readonly height: string;
10
10
  };
package/dist/lib-esm/primitives/base-button/utils.js CHANGED
@@ -1,4 +1,4 @@
1
- import { IconIconOnLight, TextCtaLinkSecondary, IconIconOnDark, TextTextDestructiveOnLight, TextCtaLink, bpSize040, Size4, bpSize050, Size5, Size3 } from '@box/blueprint-web-assets/tokens/tokens';
1
+ import { IconIconOnLight, TextCtaLinkSecondary, IconIconOnDark, TextTextDestructiveOnLight, TextCtaLink, bpSize050, bpSize040 } from '@box/blueprint-web-assets/tokens/tokens';
2
2
  import { Children, isValidElement } from 'react';
3
3
 
4
4
  function getButtonTypeFromChildren(children, baseButtonIcon, baseButtonLabel) {
@@ -20,21 +20,8 @@ function getButtonTypeFromChildren(children, baseButtonIcon, baseButtonLabel) {
20
20
  }
21
21
  return 'text-only';
22
22
  }
23
- const getIconSize = (buttonSize, isIconButton, enableModernizedComponents = false) => {
24
- const isLarge = buttonSize === 'large';
25
- const isXSmall = buttonSize === 'x-small';
26
- let size;
27
- if (isXSmall) {
28
- size = enableModernizedComponents ? bpSize040 : Size4;
29
- } else if (enableModernizedComponents && isIconButton) {
30
- size = isLarge ? bpSize050 : bpSize040;
31
- } else if (enableModernizedComponents && !isIconButton) {
32
- size = isLarge ? bpSize050 : bpSize040;
33
- } else if (!enableModernizedComponents && isIconButton) {
34
- size = isLarge ? Size5 : Size4;
35
- } else {
36
- size = isLarge ? Size4 : Size3;
37
- }
23
+ const getIconSize = buttonSize => {
24
+ const size = buttonSize === 'large' ? bpSize050 : bpSize040;
38
25
  return {
39
26
  width: size,
40
27
  height: size
package/dist/lib-esm/primitives/icon-button/icon-button.js CHANGED
@@ -22,7 +22,6 @@ const IconButton = /*#__PURE__*/forwardRef((props, forwardedRef) => {
22
22
  ...rest,
23
23
  ref: forwardedRef,
24
24
  className: clsx(styles.iconButton, styles[variant], sizeStyles, props.className),
25
- "data-modern": 'true' ,
26
25
  "data-bp-animated": isAnimationEnabled ? 'true' : 'false',
27
26
  children: /*#__PURE__*/createElement(icon, {
28
27
  className: styles.icon,
package/dist/lib-esm/primitives/icon-button/icon-button.module.js CHANGED
@@ -1,4 +1,4 @@
1
1
  import '../../index.css';
2
- var styles = {"iconButton":"bp_icon_button_module_iconButton--2eb85","icon":"bp_icon_button_module_icon--2eb85","default":"bp_icon_button_module_default--2eb85","icon-logo":"bp_icon_button_module_icon-logo--2eb85","high-contrast":"bp_icon_button_module_high-contrast--2eb85","on-dark":"bp_icon_button_module_on-dark--2eb85","small-utility":"bp_icon_button_module_small-utility--2eb85","large":"bp_icon_button_module_large--2eb85","small":"bp_icon_button_module_small--2eb85","x-small":"bp_icon_button_module_x-small--2eb85"};
2
+ var styles = {"iconButton":"bp_icon_button_module_iconButton--17523","icon":"bp_icon_button_module_icon--17523","default":"bp_icon_button_module_default--17523","icon-logo":"bp_icon_button_module_icon-logo--17523","high-contrast":"bp_icon_button_module_high-contrast--17523","on-dark":"bp_icon_button_module_on-dark--17523","small-utility":"bp_icon_button_module_small-utility--17523","large":"bp_icon_button_module_large--17523","small":"bp_icon_button_module_small--17523","x-small":"bp_icon_button_module_x-small--17523"};
3
3
 
4
4
  export { styles as default };
package/dist/lib-esm/split-button/split-button.js CHANGED
@@ -84,7 +84,6 @@ const SplitButton = /*#__PURE__*/forwardRef((props, forwardedRef) => {
84
84
  open: open,
85
85
  children: [jsxs("span", {
86
86
  className: styles.splitButton,
87
- "data-modern": 'true' ,
88
87
  children: [jsx(Button, {
89
88
  ...rest,
90
89
  ref: onLeftButtonMountCallback,
@@ -112,7 +111,6 @@ const SplitButton = /*#__PURE__*/forwardRef((props, forwardedRef) => {
112
111
  }), jsx(DropdownMenu.Content, {
113
112
  className: styles.dropdown,
114
113
  container: container,
115
- "data-modern": 'true' ,
116
114
  ...alignOpts,
117
115
  children: children
118
116
  })]
package/dist/lib-esm/split-button/styles.module.js CHANGED
@@ -1,4 +1,4 @@
1
1
  import '../index.css';
2
- var styles = {"splitButton":"bp_styles_module_splitButton--a3588","dropdown":"bp_styles_module_dropdown--a3588","splitButtonLeft":"bp_styles_module_splitButtonLeft--a3588","gap":"bp_styles_module_gap--a3588","skipRightBorder":"bp_styles_module_skipRightBorder--a3588","loadingButton":"bp_styles_module_loadingButton--a3588","splitButtonRight":"bp_styles_module_splitButtonRight--a3588","secondary":"bp_styles_module_secondary--a3588","invisible":"bp_styles_module_invisible--a3588"};
2
+ var styles = {"splitButton":"bp_styles_module_splitButton--8b2d4","splitButtonLeft":"bp_styles_module_splitButtonLeft--8b2d4","gap":"bp_styles_module_gap--8b2d4","skipRightBorder":"bp_styles_module_skipRightBorder--8b2d4","loadingButton":"bp_styles_module_loadingButton--8b2d4","splitButtonRight":"bp_styles_module_splitButtonRight--8b2d4","secondary":"bp_styles_module_secondary--8b2d4","invisible":"bp_styles_module_invisible--8b2d4","dropdown":"bp_styles_module_dropdown--8b2d4"};
3
3
 
4
4
  export { styles as default };
package/dist/lib-esm/text-button/text-button.js CHANGED
@@ -33,7 +33,6 @@ const TextButton = /*#__PURE__*/forwardRef((props, ref) => {
33
33
  current: null
34
34
  });
35
35
  const iconsSize = `0.875${inheritFont ? 'em' : 'rem'}`;
36
- const dataModernValue = 'true' ;
37
36
  return jsx(TooltipWrapper, {
38
37
  tooltipContent: children,
39
38
  tooltipSide: tooltipSide,
@@ -48,7 +47,6 @@ const TextButton = /*#__PURE__*/forwardRef((props, ref) => {
48
47
  [styles.isEllipsized]: ellipsizable
49
48
  }, className),
50
49
  "data-bp-animated": isAnimationEnabled ? 'true' : 'false',
51
- "data-modern": dataModernValue,
52
50
  children: [variant || color ? jsx(Text, {
53
51
  ref: textRef,
54
52
  as: "span",
package/dist/lib-esm/text-button/text-button.module.js CHANGED
@@ -1,4 +1,4 @@
1
1
  import '../index.css';
2
- var styles = {"textButton":"bp_text_button_module_textButton--426ff","isFontInherited":"bp_text_button_module_isFontInherited--426ff","isIconButton":"bp_text_button_module_isIconButton--426ff","scaleLoader":"bp_text_button_module_scaleLoader--426ff","icon":"bp_text_button_module_icon--426ff","hideTextContent":"bp_text_button_module_hideTextContent--426ff","isEllipsized":"bp_text_button_module_isEllipsized--426ff","text":"bp_text_button_module_text--426ff","visuallyHidden":"bp_text_button_module_visuallyHidden--426ff"};
2
+ var styles = {"textButton":"bp_text_button_module_textButton--b13a9","isFontInherited":"bp_text_button_module_isFontInherited--b13a9","isIconButton":"bp_text_button_module_isIconButton--b13a9","scaleLoader":"bp_text_button_module_scaleLoader--b13a9","icon":"bp_text_button_module_icon--b13a9","hideTextContent":"bp_text_button_module_hideTextContent--b13a9","isEllipsized":"bp_text_button_module_isEllipsized--b13a9","text":"bp_text_button_module_text--b13a9","visuallyHidden":"bp_text_button_module_visuallyHidden--b13a9"};
3
3
 
4
4
  export { styles as default };
package/dist/lib-esm/trigger-button/trigger-button.js CHANGED
@@ -1,5 +1,4 @@
1
1
  import { jsxs, jsx } from 'react/jsx-runtime';
2
- import '@box/blueprint-web-assets/icons/Fill';
3
2
  import { ChevronUp, ChevronDown } from '@box/blueprint-web-assets/icons/Medium';
4
3
  import clsx from 'clsx';
5
4
  import { forwardRef, useRef } from 'react';
@@ -49,7 +48,6 @@ const TriggerButton = /*#__PURE__*/forwardRef((props, forwardedRef) => {
49
48
  className: clsx(styles.triggerButton, styles[size], styles[variant], {
50
49
  [styles.startIcon]: !!startIcon
51
50
  }, className),
52
- "data-modern": 'true' ,
53
51
  size: baseButtonSize,
54
52
  variant: variant,
55
53
  ...rest,
@@ -73,7 +71,7 @@ const TriggerButton = /*#__PURE__*/forwardRef((props, forwardedRef) => {
73
71
  }), jsx(BaseButton.Icon, {
74
72
  className: styles.iconCaret,
75
73
  icon: caretDirection === 'up' ? ChevronUp : ChevronDown
76
- }) ]
74
+ })]
77
75
  });
78
76
  return overflow === 'ellipsis' && !disabled && !loading ? jsx(TooltipWrapper, {
79
77
  tooltipContent: label,
package/dist/lib-esm/trigger-button/trigger-button.module.js CHANGED
@@ -1,4 +1,4 @@
1
1
  import '../index.css';
2
- var styles = {"triggerButton":"bp_trigger_button_module_triggerButton--dda9e","secondary":"bp_trigger_button_module_secondary--dda9e","tertiary":"bp_trigger_button_module_tertiary--dda9e","extraSmall":"bp_trigger_button_module_extraSmall--dda9e","small":"bp_trigger_button_module_small--dda9e","large":"bp_trigger_button_module_large--dda9e","startIcon":"bp_trigger_button_module_startIcon--dda9e","labelEllipsis":"bp_trigger_button_module_labelEllipsis--dda9e","labelWrap":"bp_trigger_button_module_labelWrap--dda9e","iconCaret":"bp_trigger_button_module_iconCaret--dda9e"};
2
+ var styles = {"triggerButton":"bp_trigger_button_module_triggerButton--81ee1","secondary":"bp_trigger_button_module_secondary--81ee1","tertiary":"bp_trigger_button_module_tertiary--81ee1","extraSmall":"bp_trigger_button_module_extraSmall--81ee1","startIcon":"bp_trigger_button_module_startIcon--81ee1","small":"bp_trigger_button_module_small--81ee1","large":"bp_trigger_button_module_large--81ee1","labelEllipsis":"bp_trigger_button_module_labelEllipsis--81ee1","labelWrap":"bp_trigger_button_module_labelWrap--81ee1","iconCaret":"bp_trigger_button_module_iconCaret--81ee1"};
3
3
 
4
4
  export { styles as default };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@box/blueprint-web",
3
- "version": "17.2.4",
3
+ "version": "17.3.1",
4
4
  "type": "module",
5
5
  "license": "SEE LICENSE IN LICENSE",
6
6
  "publishConfig": {
@@ -55,7 +55,7 @@
55
55
  "dependencies": {
56
56
  "@ariakit/react": "0.4.21",
57
57
  "@ariakit/react-core": "0.4.21",
58
- "@box/blueprint-web-assets": "^5.9.0",
58
+ "@box/blueprint-web-assets": "^5.9.2",
59
59
  "@internationalized/date": "^3.12.0",
60
60
  "@radix-ui/react-accordion": "1.1.2",
61
61
  "@radix-ui/react-checkbox": "1.0.4",
@@ -86,7 +86,7 @@
86
86
  "devDependencies": {
87
87
  "@box/box-test-client": "^3.2.7",
88
88
  "@box/playwright-utils": "^2.8.5",
89
- "@box/storybook-utils": "^1.2.31",
89
+ "@box/storybook-utils": "^1.2.33",
90
90
  "@figma/code-connect": "1.4.4",
91
91
  "@playwright/test": "1.46.1",
92
92
  "@types/js-yaml": "^4.0.9",