@box/blueprint-web 12.126.0 → 12.127.0

package/dist/lib-esm/index.css

@@ -10223,7 +10223,7 @@ div[data-radix-popper-content-wrapper]:has([role=menu]):has([data-state=open]):h
 .bp_tabs_module_tabsListContainer--1c0ce .bp_tabs_module_tabList--1c0ce .bp_tabs_module_tab--1c0ce[aria-disabled=true]{
   opacity:.5;
 }
-.bp_radio_group_module_root--d183c[data-modern=false]{
+.bp_radio_group_module_root--4220f[data-modern=false]{
   --radio-line-height:var(--body-default-line-height);
   font-family:var(--body-default-font-family);
   font-size:var(--body-default-font-size);
@@ -10235,7 +10235,7 @@ div[data-radix-popper-content-wrapper]:has([role=menu]):has([data-state=open]):h
   text-transform:var(--body-default-text-case);
 }
 
-.bp_radio_group_module_root--d183c[data-modern=true]{
+.bp_radio_group_module_root--4220f[data-modern=true]{
   --radio-line-height:var(--bp-font-line-height-04);
   font-family:var(--bp-font-font-family), -apple-system, BlinkMacSystemFont, "San Francisco", "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
   font-size:var(--bp-font-size-05);
@@ -10245,36 +10245,38 @@ div[data-radix-popper-content-wrapper]:has([role=menu]):has([data-state=open]):h
   line-height:var(--bp-font-line-height-04);
 }
 
-.bp_radio_group_module_root--d183c{
+.bp_radio_group_module_root--4220f{
   display:flex;
   flex-direction:column;
   gap:var(--space-2);
 }
 
-.bp_radio_group_module_horizontal--d183c{
+.bp_radio_group_module_horizontal--4220f{
   flex-direction:row;
   gap:1.625rem;
 }
 
-.bp_radio_group_module_radioOption--d183c{
+.bp_radio_group_module_radioOption--4220f{
   display:flex;
   flex-direction:column;
 }
-.bp_radio_group_module_radioOption--d183c .bp_radio_group_module_label--d183c{
+.bp_radio_group_module_radioOption--4220f .bp_radio_group_module_label--4220f{
   align-items:flex-start;
   cursor:pointer;
   display:inline-flex;
   gap:var(--size-3);
+  width:-moz-fit-content;
+  width:fit-content;
 }
-.bp_radio_group_module_radioOption--d183c .bp_radio_group_module_description--d183c{
+.bp_radio_group_module_radioOption--4220f .bp_radio_group_module_description--4220f{
   padding-left:calc(var(--size-4) + var(--size-3));
 }
-.bp_radio_group_module_radioOption--d183c.bp_radio_group_module_disabled--d183c .bp_radio_group_module_label--d183c,[role=radiogroup][data-disabled] .bp_radio_group_module_radioOption--d183c .bp_radio_group_module_label--d183c{
+.bp_radio_group_module_radioOption--4220f.bp_radio_group_module_disabled--4220f .bp_radio_group_module_label--4220f,[role=radiogroup][data-disabled] .bp_radio_group_module_radioOption--4220f .bp_radio_group_module_label--4220f{
   color:var(--text-text-on-light-secondary);
   cursor:default;
 }
 
-.bp_radio_group_module_radioButton--d183c{
+.bp_radio_group_module_radioButton--4220f{
   all:unset;
   align-items:center;
   background-color:var(--surface-radio-surface);
@@ -10288,33 +10290,33 @@ div[data-radix-popper-content-wrapper]:has([role=menu]):has([data-state=open]):h
   margin:calc((var(--radio-line-height) - var(--size-4))/2) 0 0 0;
   width:var(--size-4);
 }
-.bp_radio_group_module_radioButton--d183c .bp_radio_group_module_indicator--d183c{
+.bp_radio_group_module_radioButton--4220f .bp_radio_group_module_indicator--4220f{
   background-color:var(--surface-radio-surface-selected);
   border-radius:50%;
   height:var(--size-2);
   transition:transform .1s;
   width:var(--size-2);
 }
-.bp_radio_group_module_radioButton--d183c:focus-visible{
+.bp_radio_group_module_radioButton--4220f:focus-visible{
   box-shadow:0 0 0 var(--border-1, 1px) var(--background-background), 0 0 0 var(--border-3) var(--outline-focus-on-light);
 }
-.bp_radio_group_module_radioButton--d183c[data-disabled]{
+.bp_radio_group_module_radioButton--4220f[data-disabled]{
   opacity:60%;
 }
-.bp_radio_group_module_radioButton--d183c[data-state=unchecked]{
+.bp_radio_group_module_radioButton--4220f[data-state=unchecked]{
   background-color:var(--surface-radio-surface);
   border:var(--border-2) solid var(--border-radio-border);
 }
-.bp_radio_group_module_radioButton--d183c[data-state=unchecked] .bp_radio_group_module_indicator--d183c{
+.bp_radio_group_module_radioButton--4220f[data-state=unchecked] .bp_radio_group_module_indicator--4220f{
   transform:scale(0);
 }
-.bp_radio_group_module_radioButton--d183c:not([data-disabled]):focus-visible,.bp_radio_group_module_radioButton--d183c:not([data-disabled]):hover{
+.bp_radio_group_module_radioButton--4220f:not([data-disabled]):focus-visible,.bp_radio_group_module_radioButton--4220f:not([data-disabled]):hover{
   border:var(--border-2) solid var(--border-radio-border-hover);
 }
-.bp_radio_group_module_radioButton--d183c:not([data-disabled]):focus-visible[data-state=checked],.bp_radio_group_module_radioButton--d183c:not([data-disabled]):hover[data-state=checked]{
+.bp_radio_group_module_radioButton--4220f:not([data-disabled]):focus-visible[data-state=checked],.bp_radio_group_module_radioButton--4220f:not([data-disabled]):hover[data-state=checked]{
   border:var(--border-2) solid var(--border-radio-border-selected-hover);
 }
-.bp_radio_group_module_radioButton--d183c:not([data-disabled]):focus-visible[data-state=checked] .bp_radio_group_module_indicator--d183c,.bp_radio_group_module_radioButton--d183c:not([data-disabled]):hover[data-state=checked] .bp_radio_group_module_indicator--d183c{
+.bp_radio_group_module_radioButton--4220f:not([data-disabled]):focus-visible[data-state=checked] .bp_radio_group_module_indicator--4220f,.bp_radio_group_module_radioButton--4220f:not([data-disabled]):hover[data-state=checked] .bp_radio_group_module_indicator--4220f{
   background-color:var(--surface-radio-surface-selected-hover);
 }
 .bp_radio_tiles_option_module_radioTileOption--07c71[data-modern=false]{

package/dist/lib-esm/modal/alert-modal.d.ts

@@ -1,6 +1,6 @@
 import { type AlertModalProps } from './alert-modal.types';
 export declare const AlertModal: {
-    ({ children, closeButtonAriaLabel, closeButtonDisabled, container, heading, onOpenChange, open, size, textContent, ...props }: AlertModalProps): import("react/jsx-runtime").JSX.Element;
+    ({ children, closeButtonAriaLabel, closeButtonDisabled, container, heading, onOpenChange, open, size, textContent, trigger, ...props }: AlertModalProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 } & {
     PrimaryButton: import("react").ForwardRefExoticComponent<(Omit<import("../primitives/base-button").BaseButtonInterface & Required<Pick<import("../primitives/base-button").Loading, keyof import("../primitives/base-button").Loading>> & Omit<import("../primitives/base-button").Loading, keyof import("../primitives/base-button").Loading> & {

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

@@ -1,4 +1,4 @@
-import { jsx, jsxs } from 'react/jsx-runtime';
+import { jsxs, jsx } from 'react/jsx-runtime';
 import { useId, Children, isValidElement } from 'react';
 import { Modal } from './modal.js';
 import { ModalFooter } from './modal-footer.js';
@@ -26,6 +26,7 @@ const validateChildren = children => {
  * - Has role="alertdialog" for accessibility
  * - Announces the content of the modal to the user when it is opened
  * - Always includes a close button with i18n support (disabled state can be controlled via closeButtonDisabled prop)
+ * - Optionally accepts a trigger element
  *
  * @example
  * <AlertModal
@@ -35,6 +36,7 @@ const validateChildren = children => {
  *   closeButtonDisabled={isSubmittingRequest}
  *   textContent="Are you sure you want to delete this item?"
  *   closeButtonAriaLabel={formatMessage(commonMessages.closeButtonText)}
+ *   trigger={<Button>Open</Button>}
  * >
  *   <AlertModal.SecondaryButton onClick={() => setIsOpen(false)}>
  *     Cancel
@@ -54,15 +56,18 @@ const AlertModalComponent = ({
   open,
   size = 'small',
   textContent,
+  trigger,
   ...props
 }) => {
   const textContentId = useId();
   validateChildren(children);
-  return jsx(Modal, {
+  return jsxs(Modal, {
     onOpenChange: onOpenChange,
     open: open,
     ...props,
-    children: jsxs(Modal.Content, {
+    children: [trigger && jsx(Modal.Trigger, {
+      children: trigger
+    }), jsxs(Modal.Content, {
       "aria-describedby": textContentId,
       container: container,
       role: "alertdialog",
@@ -80,7 +85,7 @@ const AlertModalComponent = ({
         "aria-label": closeButtonAriaLabel,
         disabled: closeButtonDisabled
       })]
-    })
+    })]
   });
 };
 AlertModalComponent.displayName = 'AlertModal';

package/dist/lib-esm/modal/alert-modal.types.d.ts

@@ -1,5 +1,5 @@
 import { type DialogPortalProps, type DialogProps } from '@radix-ui/react-dialog';
-import { type ReactNode } from 'react';
+import { type ReactElement, type ReactNode } from 'react';
 import { type ModalContentSize } from './types';
 export interface AlertModalProps extends Omit<DialogProps, 'modal'>, Pick<DialogPortalProps, 'container'> {
     /** The text content to display in the modal body. Should be an i18n string (e.g., from formatMessage). */
@@ -14,4 +14,6 @@ export interface AlertModalProps extends Omit<DialogProps, 'modal'>, Pick<Dialog
     closeButtonAriaLabel: string;
     /** Whether to disable the close button. Defaults to false. */
     closeButtonDisabled?: boolean;
+    /** Optional trigger element to open the modal. Must be a single React element (e.g., <button>Open</button>). */
+    trigger?: ReactElement;
 }

package/dist/lib-esm/radio-group/radio-group.module.js

@@ -1,4 +1,4 @@
 import '../index.css';
-var styles = {"root":"bp_radio_group_module_root--d183c","horizontal":"bp_radio_group_module_horizontal--d183c","radioOption":"bp_radio_group_module_radioOption--d183c","label":"bp_radio_group_module_label--d183c","description":"bp_radio_group_module_description--d183c","disabled":"bp_radio_group_module_disabled--d183c","radioButton":"bp_radio_group_module_radioButton--d183c","indicator":"bp_radio_group_module_indicator--d183c"};
+var styles = {"root":"bp_radio_group_module_root--4220f","horizontal":"bp_radio_group_module_horizontal--4220f","radioOption":"bp_radio_group_module_radioOption--4220f","label":"bp_radio_group_module_label--4220f","description":"bp_radio_group_module_description--4220f","disabled":"bp_radio_group_module_disabled--4220f","radioButton":"bp_radio_group_module_radioButton--4220f","indicator":"bp_radio_group_module_indicator--4220f"};
 
 export { styles as default };

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@box/blueprint-web",
-    "version": "12.126.0",
+    "version": "12.127.0",
     "type": "module",
     "license": "SEE LICENSE IN LICENSE",
     "publishConfig": {
@@ -47,7 +47,7 @@
     "dependencies": {
         "@ariakit/react": "0.4.15",
         "@ariakit/react-core": "0.4.15",
-        "@box/blueprint-web-assets": "^4.96.5",
+        "@box/blueprint-web-assets": "^4.96.7",
         "@internationalized/date": "^3.7.0",
         "@radix-ui/react-accordion": "1.1.2",
         "@radix-ui/react-checkbox": "1.0.4",
@@ -77,7 +77,7 @@
         "type-fest": "^3.2.0"
     },
     "devDependencies": {
-        "@box/storybook-utils": "^0.16.16",
+        "@box/storybook-utils": "^0.16.18",
         "@figma/code-connect": "1.3.12",
         "@types/react": "^18.0.0",
         "@types/react-dom": "^18.0.0",