@box/blueprint-web 7.36.1 → 7.36.2

package/lib-esm/index.css

@@ -5142,7 +5142,7 @@ table.bp_inline_table_module_inlineTable--b023b tr:not(:last-child) td{
   margin-block:var(--space-2);
 }
 
-.bp_side_panel_module_content--9d0c1{
+.bp_side_panel_module_content--4e61a{
   background-color:var(--gray-white);
   border-inline-start:var(--border-1) solid var(--border-divider-border);
   display:flex;
@@ -5151,15 +5151,15 @@ table.bp_inline_table_module_inlineTable--b023b tr:not(:last-child) td{
   height:100%;
   margin-inline-start:auto;
   max-width:100%;
-  min-width:320px;
+  min-width:100%;
   overflow:hidden;
 }
-@media only screen and (max-width: 374px){
-  .bp_side_panel_module_content--9d0c1{
-    min-width:100%;
+@media only screen and (width > 374px){
+  .bp_side_panel_module_content--4e61a{
+    min-width:320px;
   }
 }
-.bp_side_panel_module_content--9d0c1 .bp_side_panel_module_header--9d0c1{
+.bp_side_panel_module_content--4e61a .bp_side_panel_module_header--4e61a{
   align-items:center;
   background-color:var(--surface-surface);
   border-bottom:var(--border-1) solid var(--border-divider-border);
@@ -5174,68 +5174,68 @@ table.bp_inline_table_module_inlineTable--b023b tr:not(:last-child) td{
   transition-timing-function:cubic-bezier(0, 0, .6, 1);
   word-break:break-word;
 }
-.bp_side_panel_module_content--9d0c1 .bp_side_panel_module_header--9d0c1,.bp_side_panel_module_content--9d0c1 .bp_side_panel_module_header--9d0c1.bp_side_panel_module_headerMobile--9d0c1{
+.bp_side_panel_module_content--4e61a .bp_side_panel_module_header--4e61a,.bp_side_panel_module_content--4e61a .bp_side_panel_module_header--4e61a.bp_side_panel_module_headerMobile--4e61a{
   font-family:Lato, -apple-system, BlinkMacSystemFont, "San Francisco", "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
   font-weight:700;
   letter-spacing:.01875rem;
   text-decoration:none;
   text-transform:none;
 }
-.bp_side_panel_module_content--9d0c1 .bp_side_panel_module_header--9d0c1.bp_side_panel_module_headerMobile--9d0c1{
+.bp_side_panel_module_content--4e61a .bp_side_panel_module_header--4e61a.bp_side_panel_module_headerMobile--4e61a{
   font-size:.9375rem;
   line-height:1.25rem;
 }
-.bp_side_panel_module_content--9d0c1 .bp_side_panel_module_headerShadow--9d0c1{
+.bp_side_panel_module_content--4e61a .bp_side_panel_module_headerShadow--4e61a{
   box-shadow:var(--dropshadow-3);
 }
 
-.bp_side_panel_module_persistentContent--9d0c1{
+.bp_side_panel_module_persistentContent--4e61a{
   position:relative;
 }
 
-.bp_side_panel_module_contentAnimatedSlideIn--9d0c1{
+.bp_side_panel_module_contentAnimatedSlideIn--4e61a{
   animation-duration:.2s;
-  animation-name:bp_side_panel_module_slideIn--9d0c1;
+  animation-name:bp_side_panel_module_slideIn--4e61a;
   animation-timing-function:cubic-bezier(0, 0, .6, 1);
 }
 
-.bp_side_panel_module_contentAnimatedSlideOut--9d0c1[data-state=closed]{
+.bp_side_panel_module_contentAnimatedSlideOut--4e61a[data-state=closed]{
   animation-duration:.2s;
-  animation-name:bp_side_panel_module_slideOut--9d0c1;
+  animation-name:bp_side_panel_module_slideOut--4e61a;
   animation-timing-function:cubic-bezier(0, 0, .6, 1);
 }
 
-.bp_side_panel_module_contentNormal--9d0c1{
+.bp_side_panel_module_contentNormal--4e61a{
   width:360px;
 }
 
-.bp_side_panel_module_contentLarge--9d0c1{
+.bp_side_panel_module_contentLarge--4e61a{
   width:420px;
 }
 
-.bp_side_panel_module_dropShadowContent--9d0c1{
+.bp_side_panel_module_dropShadowContent--4e61a{
   box-shadow:var(--dropshadow-3);
 }
 
-.bp_side_panel_module_content--9d0c1 .bp_side_panel_module_close--9d0c1{
+.bp_side_panel_module_content--4e61a .bp_side_panel_module_close--4e61a{
   color:var(--gray-65);
   position:absolute;
   right:var(--space-4);
   top:var(--space-5);
 }
 
-.bp_side_panel_module_overlayContent--9d0c1{
+.bp_side_panel_module_overlayContent--4e61a{
   box-shadow:var(--dropshadow-3);
   position:fixed;
   right:0;
   top:0;
   z-index:300;
 }
-.bp_side_panel_module_overlayContent--9d0c1 .bp_side_panel_module_header--9d0c1{
+.bp_side_panel_module_overlayContent--4e61a .bp_side_panel_module_header--4e61a{
   padding:var(--space-6) var(--space-14) var(--space-6) var(--space-4);
 }
 
-.bp_side_panel_module_overlay--9d0c1{
+.bp_side_panel_module_overlay--4e61a{
   background-color:var(--black-opacity-80);
   bottom:0;
   display:flex;
@@ -5246,20 +5246,20 @@ table.bp_inline_table_module_inlineTable--b023b tr:not(:last-child) td{
   top:0;
   z-index:300;
 }
-.bp_side_panel_module_overlay--9d0c1 .bp_side_panel_module_content--9d0c1 .bp_side_panel_module_header--9d0c1{
+.bp_side_panel_module_overlay--4e61a .bp_side_panel_module_content--4e61a .bp_side_panel_module_header--4e61a{
   padding:var(--space-6) var(--space-14) var(--space-6) var(--space-4);
 }
 
-.bp_side_panel_module_dropShadowOverlay--9d0c1{
+.bp_side_panel_module_dropShadowOverlay--4e61a{
   background-color:initial;
 }
 
-.bp_side_panel_module_scrollableContainer--9d0c1{
+.bp_side_panel_module_scrollableContainer--4e61a{
   flex-grow:1;
   overflow-y:auto;
 }
 
-.bp_side_panel_module_footer--9d0c1{
+.bp_side_panel_module_footer--4e61a{
   background-color:var(--surface-surface);
   display:flex;
   justify-content:flex-end;
@@ -5269,19 +5269,19 @@ table.bp_inline_table_module_inlineTable--b023b tr:not(:last-child) td{
   transition-timing-function:cubic-bezier(0, 0, .6, 1);
 }
 
-.bp_side_panel_module_footerShadow--9d0c1{
+.bp_side_panel_module_footerShadow--4e61a{
   box-shadow:var(--dropshadow-3-inverse);
 }
 
-.bp_side_panel_module_footerButton--9d0c1{
+.bp_side_panel_module_footerButton--4e61a{
   margin-inline-start:var(--space-2);
 }
 
-.bp_side_panel_module_footerButton--9d0c1 + .bp_side_panel_module_footerButton--9d0c1{
+.bp_side_panel_module_footerButton--4e61a + .bp_side_panel_module_footerButton--4e61a{
   margin-inline-start:var(--space-3);
 }
 
-@keyframes bp_side_panel_module_slideIn--9d0c1{
+@keyframes bp_side_panel_module_slideIn--4e61a{
   from{
     inset-inline-end:-100%;
   }
@@ -5289,7 +5289,7 @@ table.bp_inline_table_module_inlineTable--b023b tr:not(:last-child) td{
     inset-inline-end:0;
   }
 }
-@keyframes bp_side_panel_module_slideOut--9d0c1{
+@keyframes bp_side_panel_module_slideOut--4e61a{
   from{
     inset-inline-end:0;
   }

package/lib-esm/side-panel/side-panel.module.js

@@ -1,4 +1,4 @@
 import '../index.css';
-var styles = {"content":"bp_side_panel_module_content--9d0c1","header":"bp_side_panel_module_header--9d0c1","headerMobile":"bp_side_panel_module_headerMobile--9d0c1","headerShadow":"bp_side_panel_module_headerShadow--9d0c1","persistentContent":"bp_side_panel_module_persistentContent--9d0c1","contentAnimatedSlideIn":"bp_side_panel_module_contentAnimatedSlideIn--9d0c1","slideIn":"bp_side_panel_module_slideIn--9d0c1","contentAnimatedSlideOut":"bp_side_panel_module_contentAnimatedSlideOut--9d0c1","slideOut":"bp_side_panel_module_slideOut--9d0c1","contentNormal":"bp_side_panel_module_contentNormal--9d0c1","contentLarge":"bp_side_panel_module_contentLarge--9d0c1","dropShadowContent":"bp_side_panel_module_dropShadowContent--9d0c1","close":"bp_side_panel_module_close--9d0c1","overlayContent":"bp_side_panel_module_overlayContent--9d0c1","overlay":"bp_side_panel_module_overlay--9d0c1","dropShadowOverlay":"bp_side_panel_module_dropShadowOverlay--9d0c1","scrollableContainer":"bp_side_panel_module_scrollableContainer--9d0c1","footer":"bp_side_panel_module_footer--9d0c1","footerShadow":"bp_side_panel_module_footerShadow--9d0c1","footerButton":"bp_side_panel_module_footerButton--9d0c1"};
+var styles = {"content":"bp_side_panel_module_content--4e61a","header":"bp_side_panel_module_header--4e61a","headerMobile":"bp_side_panel_module_headerMobile--4e61a","headerShadow":"bp_side_panel_module_headerShadow--4e61a","persistentContent":"bp_side_panel_module_persistentContent--4e61a","contentAnimatedSlideIn":"bp_side_panel_module_contentAnimatedSlideIn--4e61a","slideIn":"bp_side_panel_module_slideIn--4e61a","contentAnimatedSlideOut":"bp_side_panel_module_contentAnimatedSlideOut--4e61a","slideOut":"bp_side_panel_module_slideOut--4e61a","contentNormal":"bp_side_panel_module_contentNormal--4e61a","contentLarge":"bp_side_panel_module_contentLarge--4e61a","dropShadowContent":"bp_side_panel_module_dropShadowContent--4e61a","close":"bp_side_panel_module_close--4e61a","overlayContent":"bp_side_panel_module_overlayContent--4e61a","overlay":"bp_side_panel_module_overlay--4e61a","dropShadowOverlay":"bp_side_panel_module_dropShadowOverlay--4e61a","scrollableContainer":"bp_side_panel_module_scrollableContainer--4e61a","footer":"bp_side_panel_module_footer--4e61a","footerShadow":"bp_side_panel_module_footerShadow--4e61a","footerButton":"bp_side_panel_module_footerButton--4e61a"};
 
 export { styles as default };

package/lib-esm/split-button/split-button.js

@@ -1,6 +1,6 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
 import clsx from 'clsx';
-import { forwardRef, useState, useCallback } from 'react';
+import { forwardRef, useState, useRef, useCallback } from 'react';
 import { Button } from '../button/button.js';
 import { DropdownMenu } from '../primitives/dropdown-menu/index.js';
 import { useControllableState } from '../utils/useControllableState.js';
@@ -10,6 +10,16 @@ import styles from './styles.module.js';
 const getLeftButtonWidth = (loading, leftButtonSize, rightButtonSize) => {
   return loading && leftButtonSize && rightButtonSize ? leftButtonSize + rightButtonSize : undefined;
 };
+const updateForwardedRef = (forwardedRef, button) => {
+  if (!forwardedRef) {
+    return;
+  }
+  if (typeof forwardedRef === 'function') {
+    forwardedRef(button);
+  } else {
+    forwardedRef.current = button;
+  }
+};
 const SplitButton = /*#__PURE__*/forwardRef((props, forwardedRef) => {
   const {
     align = 'end',
@@ -34,19 +44,14 @@ const SplitButton = /*#__PURE__*/forwardRef((props, forwardedRef) => {
     onChange: onOpenChange,
     defaultProp: defaultOpen
   });
+  const localLeftRef = useRef(null);
   const onLeftButtonMountCallback = useCallback(button => {
     if (button?.offsetWidth) {
       setLeftButtonSize(button?.offsetWidth);
     }
-    if (!forwardedRef) {
-      return;
-    }
-    if (typeof forwardedRef === 'function') {
-      forwardedRef(button);
-    } else {
-      forwardedRef.current = button;
-    }
-  }, [forwardedRef]);
+    localLeftRef.current = button;
+    updateForwardedRef(forwardedRef, button);
+  }, [forwardedRef, setLeftButtonSize]);
   const onRightButtonMountCallback = useCallback(button => {
     if (button?.offsetWidth) {
       setRightButtonSize(button.offsetWidth);
@@ -56,6 +61,9 @@ const SplitButton = /*#__PURE__*/forwardRef((props, forwardedRef) => {
     if (disabled) {
       return;
     }
+    if (localLeftRef.current?.offsetWidth) {
+      setLeftButtonSize(localLeftRef.current.offsetWidth);
+    }
     setOpen(!open);
   }, [disabled, open, setOpen]);
   const shouldAlignToLeft = align === 'start' && leftButtonSize;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@box/blueprint-web",
-    "version": "7.36.1",
+    "version": "7.36.2",
     "type": "module",
     "license": "SEE LICENSE IN LICENSE",
     "publishConfig": {
@@ -63,7 +63,7 @@
         "react-stately": "^3.31.1",
         "tsx": "^4.16.5"
     },
-    "gitHead": "36614341a1bf61c7180c7f08e3cd523db717fa3d",
+    "gitHead": "f127b11dc4b59418aa99af4725e798f2e1f48c15",
     "module": "lib-esm/index.js",
     "main": "lib-esm/index.js",
     "exports": {