@box/blueprint-web 11.0.3 → 11.1.0

package/dist/lib-esm/index.css

@@ -2737,7 +2737,7 @@
   transform:translateZ(0);
 }
 
-.bp_dropdown_menu_module_content--4926a{
+.bp_dropdown_menu_module_content--75742{
   background-color:var(--surface-menu-surface);
   border:var(--border-1) solid var(--border-card-border);
   border-radius:var(--radius-3);
@@ -2758,7 +2758,7 @@
   text-transform:none;
   z-index:2147483647;
 }
-.bp_dropdown_menu_module_content--4926a[data-menu-fullscreen=true]{
+.bp_dropdown_menu_module_content--75742[data-menu-fullscreen=true]{
   border:unset;
   border-radius:unset;
   display:flex;
@@ -2771,18 +2771,24 @@
   position:relative;
   width:100vw;
 }
-.bp_dropdown_menu_module_content--4926a[data-menu-fullscreen=true] .bp_dropdown_menu_module_fullScreenContent--4926a{
+.bp_dropdown_menu_module_content--75742[data-menu-fullscreen=true] .bp_dropdown_menu_module_fullScreenContent--75742{
   overflow-y:auto;
   padding:var(--space-3);
 }
+.bp_dropdown_menu_module_content--75742 .bp_dropdown_menu_module_subheader--75742{
+  padding:var(--space-2);
+}
+.bp_dropdown_menu_module_content--75742 .bp_dropdown_menu_module_subheader--75742.bp_dropdown_menu_module_uppercased--75742{
+  text-transform:uppercase;
+}
 
-.bp_dropdown_menu_module_ellipsis--4926a{
+.bp_dropdown_menu_module_ellipsis--75742{
   overflow:hidden;
   text-overflow:ellipsis;
   white-space:nowrap;
 }
 
-.bp_dropdown_menu_module_checkmark--4926a{
+.bp_dropdown_menu_module_checkmark--75742{
   align-items:center;
   display:inline-flex;
   justify-content:center;
@@ -2790,7 +2796,7 @@
   position:absolute;
 }
 
-.bp_dropdown_menu_module_item--4926a,.bp_dropdown_menu_module_subMenuTrigger--4926a{
+.bp_dropdown_menu_module_item--75742,.bp_dropdown_menu_module_subMenuTrigger--75742{
   align-items:center;
   border:var(--border-2) solid #0000;
   border-radius:var(--radius-3);
@@ -2802,30 +2808,30 @@
   -webkit-user-select:none;
           user-select:none;
 }
-.bp_dropdown_menu_module_item--4926a[data-disabled],.bp_dropdown_menu_module_subMenuTrigger--4926a[data-disabled]{
+.bp_dropdown_menu_module_item--75742[data-disabled],.bp_dropdown_menu_module_subMenuTrigger--75742[data-disabled]{
   opacity:60%;
   pointer-events:none;
 }
-.bp_dropdown_menu_module_item--4926a[data-highlighted],.bp_dropdown_menu_module_subMenuTrigger--4926a[data-highlighted]{
+.bp_dropdown_menu_module_item--75742[data-highlighted],.bp_dropdown_menu_module_subMenuTrigger--75742[data-highlighted]{
   background-color:var(--surface-menu-surface-hover);
   border:var(--border-2) solid var(--outline-focus-on-light);
 }
-.bp_dropdown_menu_module_item--4926a:active,.bp_dropdown_menu_module_subMenuTrigger--4926a:active{
+.bp_dropdown_menu_module_item--75742:active,.bp_dropdown_menu_module_subMenuTrigger--75742:active{
   background-color:var(--surface-menu-surface-hover);
   border:var(--border-2) solid #0000;
 }
-.bp_dropdown_menu_module_item--4926a:hover,.bp_dropdown_menu_module_item--4926a[data-state=open],.bp_dropdown_menu_module_subMenuTrigger--4926a:hover,.bp_dropdown_menu_module_subMenuTrigger--4926a[data-state=open]{
+.bp_dropdown_menu_module_item--75742:hover,.bp_dropdown_menu_module_item--75742[data-state=open],.bp_dropdown_menu_module_subMenuTrigger--75742:hover,.bp_dropdown_menu_module_subMenuTrigger--75742[data-state=open]{
   background-color:var(--surface-menu-surface-hover);
 }
-.bp_dropdown_menu_module_item--4926a.bp_dropdown_menu_module_checkboxItem--4926a,.bp_dropdown_menu_module_item--4926a.bp_dropdown_menu_module_radioItem--4926a,.bp_dropdown_menu_module_subMenuTrigger--4926a.bp_dropdown_menu_module_checkboxItem--4926a,.bp_dropdown_menu_module_subMenuTrigger--4926a.bp_dropdown_menu_module_radioItem--4926a{
+.bp_dropdown_menu_module_item--75742.bp_dropdown_menu_module_checkboxItem--75742,.bp_dropdown_menu_module_item--75742.bp_dropdown_menu_module_radioItem--75742,.bp_dropdown_menu_module_subMenuTrigger--75742.bp_dropdown_menu_module_checkboxItem--75742,.bp_dropdown_menu_module_subMenuTrigger--75742.bp_dropdown_menu_module_radioItem--75742{
   padding:.4375rem .5rem .4375rem calc(var(--space-2) + var(--space-4) + var(--space-4));
 }
 
-.bp_dropdown_menu_module_dropdownMenuItemSeparator--4926a{
+.bp_dropdown_menu_module_dropdownMenuItemSeparator--75742{
   margin-block:var(--space-2);
 }
 
-.bp_dropdown_menu_module_menuHeader--4926a{
+.bp_dropdown_menu_module_menuHeader--75742{
   align-items:center;
   box-shadow:var(--dropshadow-1);
   display:grid;
@@ -2835,15 +2841,15 @@
   padding:var(--space-3);
 }
 
-.bp_dropdown_menu_module_headerTextContent--4926a{
+.bp_dropdown_menu_module_headerTextContent--75742{
   display:grid;
 }
 
-.bp_dropdown_menu_module_submenuCloseButton--4926a{
+.bp_dropdown_menu_module_submenuCloseButton--75742{
   grid-area:submenu-close;
 }
 
-.bp_dropdown_menu_module_menuCloseButton--4926a{
+.bp_dropdown_menu_module_menuCloseButton--75742{
   grid-area:close;
 }
 

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

@@ -24,6 +24,7 @@ import '../primitives/dropdown-menu/dropdown-menu-sub-menu-content.js';
 import '../primitives/dropdown-menu/dropdown-menu-sub-menu-root.js';
 import '../primitives/dropdown-menu/dropdown-menu-sub-menu-trigger.js';
 import '../primitives/dropdown-menu/dropdown-menu-trigger.js';
+import '../primitives/dropdown-menu/dropdown-menu-sub-header.js';
 
 const Cell = Cell$1;
 

package/dist/lib-esm/primitives/dropdown-menu/dropdown-menu-sub-header.d.ts

@@ -0,0 +1,3 @@
+import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
+export type DropdownMenuSubheaderProps = DropdownMenuPrimitive.DropdownMenuLabelProps;
+export declare const DropdownMenuSubHeader: import("react").ForwardRefExoticComponent<DropdownMenuPrimitive.DropdownMenuLabelProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist/lib-esm/primitives/dropdown-menu/dropdown-menu-sub-header.js

@@ -0,0 +1,28 @@
+import { jsx } from 'react/jsx-runtime';
+import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
+import { forwardRef } from 'react';
+import clsx from 'clsx';
+import { Text } from '../../text/text.js';
+import styles from './dropdown-menu.module.js';
+
+const DropdownMenuSubHeader = /*#__PURE__*/forwardRef((props, forwardedRef) => {
+  const {
+    children,
+    className,
+    ...rest
+  } = props;
+  return jsx(DropdownMenuPrimitive.Label, {
+    ...rest,
+    ref: forwardedRef,
+    children: jsx(Text, {
+      as: "div",
+      className: clsx(styles.ellipsis, styles.subheader, styles.uppercased, className),
+      color: "textOnLightSecondary",
+      variant: "label",
+      children: children
+    })
+  });
+});
+DropdownMenuSubHeader.displayName = 'DropdownMenuSubHeader';
+
+export { DropdownMenuSubHeader };

package/dist/lib-esm/primitives/dropdown-menu/dropdown-menu.module.js

@@ -1,4 +1,4 @@
 import '../../index.css';
-var styles = {"content":"bp_dropdown_menu_module_content--4926a","fullScreenContent":"bp_dropdown_menu_module_fullScreenContent--4926a","ellipsis":"bp_dropdown_menu_module_ellipsis--4926a","checkmark":"bp_dropdown_menu_module_checkmark--4926a","item":"bp_dropdown_menu_module_item--4926a","subMenuTrigger":"bp_dropdown_menu_module_subMenuTrigger--4926a","radioItem":"bp_dropdown_menu_module_radioItem--4926a","checkboxItem":"bp_dropdown_menu_module_checkboxItem--4926a","dropdownMenuItemSeparator":"bp_dropdown_menu_module_dropdownMenuItemSeparator--4926a","menuHeader":"bp_dropdown_menu_module_menuHeader--4926a","headerTextContent":"bp_dropdown_menu_module_headerTextContent--4926a","submenuCloseButton":"bp_dropdown_menu_module_submenuCloseButton--4926a","menuCloseButton":"bp_dropdown_menu_module_menuCloseButton--4926a"};
+var styles = {"content":"bp_dropdown_menu_module_content--75742","fullScreenContent":"bp_dropdown_menu_module_fullScreenContent--75742","subheader":"bp_dropdown_menu_module_subheader--75742","uppercased":"bp_dropdown_menu_module_uppercased--75742","ellipsis":"bp_dropdown_menu_module_ellipsis--75742","checkmark":"bp_dropdown_menu_module_checkmark--75742","item":"bp_dropdown_menu_module_item--75742","subMenuTrigger":"bp_dropdown_menu_module_subMenuTrigger--75742","radioItem":"bp_dropdown_menu_module_radioItem--75742","checkboxItem":"bp_dropdown_menu_module_checkboxItem--75742","dropdownMenuItemSeparator":"bp_dropdown_menu_module_dropdownMenuItemSeparator--75742","menuHeader":"bp_dropdown_menu_module_menuHeader--75742","headerTextContent":"bp_dropdown_menu_module_headerTextContent--75742","submenuCloseButton":"bp_dropdown_menu_module_submenuCloseButton--75742","menuCloseButton":"bp_dropdown_menu_module_menuCloseButton--75742"};
 
 export { styles as default };

package/dist/lib-esm/primitives/dropdown-menu/index.d.ts

@@ -28,6 +28,7 @@ export declare const DropdownMenu: {
             subtitle?: string;
         } & import("react").RefAttributes<HTMLDivElement>>;
     };
+    SubHeader: import("react").ForwardRefExoticComponent<import("@radix-ui/react-dropdown-menu").DropdownMenuLabelProps & import("react").RefAttributes<HTMLDivElement>>;
 };
 export { type DropdownMenuContentProps } from './dropdown-menu-content';
 export { type DropdownMenuItemProps } from './dropdown-menu-item';

package/dist/lib-esm/primitives/dropdown-menu/index.js

@@ -11,6 +11,7 @@ import { DropdownMenuSubMenuContent } from './dropdown-menu-sub-menu-content.js'
 import { DropdownMenuSubMenuRoot } from './dropdown-menu-sub-menu-root.js';
 import { DropdownMenuSubMenuTrigger } from './dropdown-menu-sub-menu-trigger.js';
 import { DropdownMenuTrigger } from './dropdown-menu-trigger.js';
+import { DropdownMenuSubHeader } from './dropdown-menu-sub-header.js';
 
 const DropdownMenu = {
   Root: DropdownMenuRoot,
@@ -25,7 +26,8 @@ const DropdownMenu = {
   SubMenuRoot: DropdownMenuSubMenuRoot,
   SubMenuTrigger: DropdownMenuSubMenuTrigger,
   SubMenuContent: DropdownMenuSubMenuContent,
-  Header: DropdownMenuHeader
+  Header: DropdownMenuHeader,
+  SubHeader: DropdownMenuSubHeader
 };
 
 export { DropdownMenu };

package/dist/lib-esm/text/types.d.ts

@@ -2,7 +2,7 @@ import { type HTMLAttributes, type LabelHTMLAttributes } from 'react';
 import { type StyledText } from '../utils/commonTypes';
 type TypographyVariant = 'titleMondo' | 'titleXLarge' | 'titleLarge' | 'titleMedium' | 'titleSmall' | 'subtitle' | 'bodyLargeBold' | 'bodyLarge' | 'bodyDefaultBold' | 'bodyDefaultSemibold' | 'bodyDefault' | 'caption' | 'labelBold' | 'label';
 type TypographyColors = 'textOnLightDefault' | 'textOnLightSecondary' | 'textOnLightLink' | 'textOnDarkDefault';
-type Element = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'p' | 'span' | 'legend' | 'label';
+type Element = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'p' | 'span' | 'legend' | 'label' | 'div';
 interface HeadingProps extends HTMLAttributes<HTMLHeadingElement> {
     as: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
 }
@@ -18,8 +18,11 @@ interface LegendProps extends HTMLAttributes<HTMLLegendElement> {
 interface LabelProps extends LabelHTMLAttributes<HTMLLabelElement> {
     as: 'label';
 }
+interface DivProps extends HTMLAttributes<HTMLDivElement> {
+    as: 'div';
+}
 /** Supported HTML elements for text */
-export type ElementTypes = HeadingProps | ParagraphProps | LegendProps | SpanProps | LabelProps;
+export type ElementTypes = HeadingProps | ParagraphProps | LegendProps | SpanProps | LabelProps | DivProps;
 export type TextProps = {
     /** The HTML element type which will render */
     as: Element;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@box/blueprint-web",
-    "version": "11.0.3",
+    "version": "11.1.0",
     "type": "module",
     "license": "SEE LICENSE IN LICENSE",
     "publishConfig": {