@box/blueprint-web 12.81.2 → 12.81.4

package/dist/lib-esm/content-card/content-card-body.js

@@ -1,6 +1,7 @@
 import { jsx } from 'react/jsx-runtime';
 import clsx from 'clsx';
 import { forwardRef } from 'react';
+import { useBlueprintModernization } from '../blueprint-modernization-context/useBlueprintModernization.js';
 import { Text } from '../text/text.js';
 import styles from './content-card.module.js';
 
@@ -10,6 +11,10 @@ const ContentCardBody = /*#__PURE__*/forwardRef((props, forwardedRef) => {
     children,
     ...rest
   } = props;
+  const {
+    enableModernizedComponents
+  } = useBlueprintModernization();
+  const variant = enableModernizedComponents ? 'caption' : 'bodyDefault';
   return jsx("div", {
     className: clsx(styles.cardBody, className),
     children: jsx(Text, {
@@ -18,7 +23,7 @@ const ContentCardBody = /*#__PURE__*/forwardRef((props, forwardedRef) => {
       as: "p",
       className: styles.cardBodyText,
       color: "textOnLightDefault",
-      variant: "bodyDefault",
+      variant: variant,
       children: children
     })
   });

package/dist/lib-esm/content-card/content-card.module.js

@@ -1,4 +1,4 @@
 import '../index.css';
-var styles = {"card":"bp_content_card_module_card--085da","ghostCard":"bp_content_card_module_ghostCard--085da","cardContent":"bp_content_card_module_cardContent--085da","cardTitle":"bp_content_card_module_cardTitle--085da","cardTitleText":"bp_content_card_module_cardTitleText--085da","cardBody":"bp_content_card_module_cardBody--085da","cardBodyText":"bp_content_card_module_cardBodyText--085da","cardIcon":"bp_content_card_module_cardIcon--085da","cardBackground":"bp_content_card_module_cardBackground--085da","image":"bp_content_card_module_image--085da","iconGhost":"bp_content_card_module_iconGhost--085da","titleGhost":"bp_content_card_module_titleGhost--085da","bodyGhost":"bp_content_card_module_bodyGhost--085da","pillGhostContainer":"bp_content_card_module_pillGhostContainer--085da","pillGhost":"bp_content_card_module_pillGhost--085da"};
+var styles = {"card":"bp_content_card_module_card--daa2d","ghostCard":"bp_content_card_module_ghostCard--daa2d","cardContent":"bp_content_card_module_cardContent--daa2d","cardTitle":"bp_content_card_module_cardTitle--daa2d","cardTitleText":"bp_content_card_module_cardTitleText--daa2d","cardBody":"bp_content_card_module_cardBody--daa2d","cardBodyText":"bp_content_card_module_cardBodyText--daa2d","cardIcon":"bp_content_card_module_cardIcon--daa2d","cardBackground":"bp_content_card_module_cardBackground--daa2d","image":"bp_content_card_module_image--daa2d","iconGhost":"bp_content_card_module_iconGhost--daa2d","titleGhost":"bp_content_card_module_titleGhost--daa2d","bodyGhost":"bp_content_card_module_bodyGhost--daa2d","pillGhostContainer":"bp_content_card_module_pillGhostContainer--daa2d","pillGhost":"bp_content_card_module_pillGhost--daa2d"};
 
 export { styles as default };

package/dist/lib-esm/index.css

@@ -3349,7 +3349,7 @@
   margin-block:var(--select-content-viewport-option-separator-margin-block);
 }
 
-.bp_content_card_module_card--085da[data-modern=false],.bp_content_card_module_ghostCard--085da[data-modern=false]{
+.bp_content_card_module_card--daa2d[data-modern=false],.bp_content_card_module_ghostCard--daa2d[data-modern=false]{
   --content-card-background-color:var(--surface-surface);
   --content-card-background-height:var(--size-15);
   --content-card-border-radius:var(--size-3);
@@ -3358,6 +3358,8 @@
   --content-card-dropshadow:var(--dropshadow-3);
   --content-card-focused-border-color:var(--outline-focus-on-light);
   --content-card-focused-border-size:var(--border-2);
+  --content-card-icon-border-radius:var(--size-3);
+  --content-card-icon-image-border-radius:unset;
   --content-card-icon-border-size:var(--size-1);
   --content-card-icon-position:var(--size-3);
   --content-card-icon-size:var(--size-14);
@@ -3366,20 +3368,25 @@
   --content-card-padding:var(--size-4);
   --content-card-pressed-background-color:var(--surface-card-surface-pressed);
   --content-card-text-height:var(--size-12);
+  --content-card-text-height-min:unset;
+  --content-card-text-height-max:unset;
+  --content-card-title-align-items:center;
   --content-card-border:var(--border-1) solid var(--border-card-border);
   --content-card-focused-border:var(--border-2) solid var(--outline-focus-on-light);
   --content-card-pressed-border:var(--border-1) solid var(--border-card-border);
 }
 
-.bp_content_card_module_card--085da[data-modern=true],.bp_content_card_module_ghostCard--085da[data-modern=true]{
+.bp_content_card_module_card--daa2d[data-modern=true],.bp_content_card_module_ghostCard--daa2d[data-modern=true]{
   --content-card-background-color:var(--bp-surface-card-surface);
   --content-card-background-height:var(--bp-size-150);
-  --content-card-border-radius:var(--bp-radius-10);
+  --content-card-border-radius:var(--bp-radius-08);
   --content-card-border-size:var(--bp-border-01);
   --content-card-content-gap:var(--bp-space-020);
   --content-card-dropshadow:var(--dropshadow-3);
   --content-card-focused-border-color:var(--bp-outline-focus-on-light);
   --content-card-focused-border-size:var(--bp-border-02);
+  --content-card-icon-border-radius:var(--bp-radius-08);
+  --content-card-icon-image-border-radius:var(--bp-radius-06);
   --content-card-icon-border-size:var(--bp-size-010);
   --content-card-icon-position:var(--bp-size-030);
   --content-card-icon-size:var(--bp-size-140);
@@ -3387,13 +3394,16 @@
   --content-card-min-width:13.75rem;
   --content-card-padding:var(--bp-space-040);
   --content-card-pressed-background-color:var(--bp-surface-card-surface-pressed);
-  --content-card-text-height:var(--bp-size-120);
+  --content-card-text-height:unset;
+  --content-card-text-height-min:var(--bp-size-080);
+  --content-card-text-height-max:var(--bp-size-120);
+  --content-card-title-align-items:flex-start;
   --content-card-border:var(--bp-border-01) solid var(--bp-border-card-border);
   --content-card-focused-border:var(--bp-border-02) solid var(--bp-outline-focus-on-light);
   --content-card-pressed-border:var(--bp-border-01) solid var(--bp-border-card-border);
 }
 
-.bp_content_card_module_card--085da{
+.bp_content_card_module_card--daa2d{
   background-color:var(--content-card-background-color);
   border:var(--content-card-border);
   border-radius:var(--content-card-border-radius);
@@ -3404,21 +3414,21 @@
   padding:var(--content-card-padding);
   position:relative;
 }
-.bp_content_card_module_card--085da:hover{
+.bp_content_card_module_card--daa2d:hover{
   box-shadow:var(--content-card-dropshadow);
 }
-.bp_content_card_module_card--085da:focus-visible{
+.bp_content_card_module_card--daa2d:focus-visible{
   border:var(--content-card-focused-border);
   box-shadow:var(--content-card-dropshadow);
   outline:none;
 }
-.bp_content_card_module_card--085da:active{
+.bp_content_card_module_card--daa2d:active{
   background-color:var(--content-card-pressed-background-color);
   border:var(--content-card-pressed-border);
   box-shadow:none;
 }
 
-.bp_content_card_module_cardContent--085da{
+.bp_content_card_module_cardContent--daa2d{
   display:flex;
   flex-direction:column;
   gap:var(--content-card-content-gap);
@@ -3427,35 +3437,37 @@
   padding-block-start:calc(var(--content-card-icon-size) + var(--content-card-content-gap) + var(--content-card-icon-border-size));
 }
 
-.bp_content_card_module_cardTitle--085da{
-  align-items:center;
+.bp_content_card_module_cardTitle--daa2d{
+  align-items:var(--content-card-title-align-items);
   display:flex;
   height:var(--content-card-text-height);
+  max-height:var(--content-card-text-height-max);
+  min-height:var(--content-card-text-height-min);
 }
 
-.bp_content_card_module_cardTitleText--085da{
+.bp_content_card_module_cardTitleText--daa2d{
   -webkit-box-orient:vertical;
   -webkit-line-clamp:2;
   display:-webkit-inline-box;
   overflow:hidden;
 }
 
-.bp_content_card_module_cardBody--085da{
+.bp_content_card_module_cardBody--daa2d{
   height:var(--content-card-text-height);
   margin-block-end:var(--content-card-content-gap);
 }
 
-.bp_content_card_module_cardBodyText--085da{
+.bp_content_card_module_cardBodyText--daa2d{
   -webkit-box-orient:vertical;
   -webkit-line-clamp:2;
   display:-webkit-inline-box;
   overflow:hidden;
 }
 
-.bp_content_card_module_cardIcon--085da{
+.bp_content_card_module_cardIcon--daa2d{
   background-color:var(--content-card-background-color);
   border:var(--content-card-icon-border-size) solid var(--content-card-background-color);
-  border-radius:var(--content-card-border-radius);
+  border-radius:var(--content-card-icon-border-radius);
   height:var(--content-card-icon-size);
   left:var(--content-card-icon-position);
   overflow:hidden;
@@ -3465,7 +3477,7 @@
   z-index:1;
 }
 
-.bp_content_card_module_cardBackground--085da{
+.bp_content_card_module_cardBackground--daa2d{
   height:var(--content-card-background-height);
   left:0;
   overflow:hidden;
@@ -3474,12 +3486,13 @@
   width:100%;
 }
 
-.bp_content_card_module_image--085da{
+.bp_content_card_module_image--daa2d{
+  border-radius:var(--content-card-icon-image-border-radius);
   height:100%;
   width:100%;
 }
 
-.bp_content_card_module_ghostCard--085da{
+.bp_content_card_module_ghostCard--daa2d{
   display:flex;
   flex-direction:column;
   max-width:calc(var(--content-card-max-width) - var(--content-card-padding));
@@ -3488,21 +3501,21 @@
   position:relative;
 }
 
-.bp_content_card_module_iconGhost--085da,.bp_content_card_module_titleGhost--085da{
+.bp_content_card_module_iconGhost--daa2d,.bp_content_card_module_titleGhost--daa2d{
   margin-block-end:var(--content-card-padding);
 }
 
-.bp_content_card_module_bodyGhost--085da{
+.bp_content_card_module_bodyGhost--daa2d{
   margin-block-end:var(--content-card-content-gap);
 }
 
-.bp_content_card_module_pillGhostContainer--085da{
+.bp_content_card_module_pillGhostContainer--daa2d{
   display:flex;
   margin-block-end:var(--content-card-padding);
   margin-block-start:var(--content-card-content-gap);
 }
 
-.bp_content_card_module_pillGhost--085da{
+.bp_content_card_module_pillGhost--daa2d{
   margin-inline-end:var(--content-card-content-gap);
 }
 .bp_content_field_module_contentFieldWrapper--dabac{
@@ -6774,7 +6787,7 @@ table.bp_inline_table_module_inlineTable--f6f94[data-modern=true] td:last-child,
 .bp_page_module_portalEntry--96006{
   display:contents;
 }
-.bp_page_header_module_pageHeader--2768d[data-modern=false]{
+.bp_page_header_module_pageHeader--dd564[data-modern=false]{
   --page-header-min-height:var(--size-10);
   --page-header-max-height:var(--size-16);
   --page-header-background:var(--surface-surface);
@@ -6783,7 +6796,7 @@ table.bp_inline_table_module_inlineTable--f6f94[data-modern=true] td:last-child,
   --page-header-inline-height:var(--size-10);
 }
 
-.bp_page_header_module_pageHeader--2768d[data-modern=true]{
+.bp_page_header_module_pageHeader--dd564[data-modern=true]{
   --page-header-min-height:var(--bp-size-100);
   --page-header-max-height:var(--bp-size-160);
   --page-header-background:var(--bp-surface-surface);
@@ -6791,13 +6804,14 @@ table.bp_inline_table_module_inlineTable--f6f94[data-modern=true] td:last-child,
   --page-header-default-padding-inline:var(--bp-space-020);
   --page-header-inline-height:var(--bp-size-100);
 }
-.bp_page_header_module_pageHeader--2768d[data-modern=true]:not(.bp_page_header_module_inline--2768d){
+.bp_page_header_module_pageHeader--dd564[data-modern=true]:not(.bp_page_header_module_inline--dd564){
   border-bottom:var(--bp-border-01) solid var(--bp-border-header-border);
 }
 
-.bp_page_header_module_pageHeader--2768d{
+.bp_page_header_module_pageHeader--dd564{
   align-items:center;
   background:var(--page-header-background);
+  box-sizing:border-box;
   display:flex;
   flex-direction:row;
   justify-content:space-between;
@@ -6805,35 +6819,35 @@ table.bp_inline_table_module_inlineTable--f6f94[data-modern=true] td:last-child,
   min-height:var(--page-header-min-height);
   width:100%;
 }
-.bp_page_header_module_pageHeader--2768d.bp_page_header_module_sticky--2768d{
+.bp_page_header_module_pageHeader--dd564.bp_page_header_module_sticky--dd564{
   bottom:var(--blueprint-page-header-bottom, 0);
   left:var(--blueprint-page-header-left, 0);
   position:sticky;
   right:var(--blueprint-page-header-right, 0);
   top:var(--blueprint-page-header-top, 0);
 }
-.bp_page_header_module_pageHeader--2768d.bp_page_header_module_default--2768d{
+.bp_page_header_module_pageHeader--dd564.bp_page_header_module_default--dd564{
   height:var(--page-header-default-height);
   padding-inline:var(--page-header-default-padding-inline);
 }
-.bp_page_header_module_pageHeader--2768d.bp_page_header_module_inline--2768d{
+.bp_page_header_module_pageHeader--dd564.bp_page_header_module_inline--dd564{
   height:var(--page-header-inline-height);
 }
-.bp_page_header_module_pageHeader--2768d .bp_page_header_module_corner--2768d{
+.bp_page_header_module_pageHeader--dd564 .bp_page_header_module_corner--dd564{
   align-items:center;
   display:flex;
   flex-basis:content;
   flex-grow:0;
   flex-shrink:0;
 }
-.bp_page_header_module_pageHeader--2768d .bp_page_header_module_startElements--2768d{
+.bp_page_header_module_pageHeader--dd564 .bp_page_header_module_startElements--dd564{
   align-items:center;
   display:flex;
   flex-grow:1;
   justify-content:flex-start;
   overflow:hidden;
 }
-.bp_page_header_module_pageHeader--2768d .bp_page_header_module_endElements--2768d{
+.bp_page_header_module_pageHeader--dd564 .bp_page_header_module_endElements--dd564{
   align-items:center;
   display:flex;
   flex-direction:row;

package/dist/lib-esm/primitives/page-header/page-header.module.js

@@ -1,4 +1,4 @@
 import '../../index.css';
-var styles = {"pageHeader":"bp_page_header_module_pageHeader--2768d","inline":"bp_page_header_module_inline--2768d","sticky":"bp_page_header_module_sticky--2768d","default":"bp_page_header_module_default--2768d","corner":"bp_page_header_module_corner--2768d","startElements":"bp_page_header_module_startElements--2768d","endElements":"bp_page_header_module_endElements--2768d"};
+var styles = {"pageHeader":"bp_page_header_module_pageHeader--dd564","inline":"bp_page_header_module_inline--dd564","sticky":"bp_page_header_module_sticky--dd564","default":"bp_page_header_module_default--dd564","corner":"bp_page_header_module_corner--dd564","startElements":"bp_page_header_module_startElements--dd564","endElements":"bp_page_header_module_endElements--dd564"};
 
 export { styles as default };

package/package.json

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