@box/blueprint-web 12.81.2 → 12.81.3

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{

package/package.json

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