@box/blueprint-web-assets 4.121.8 → 4.123.0

package/dist/icons/Medium/FolderTree.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+declare const ForwardRef: React.ForwardRefExoticComponent<Omit<React.SVGProps<SVGSVGElement>, "ref"> & React.RefAttributes<SVGSVGElement>>;
+export default ForwardRef;

package/dist/icons/Medium/FolderTree.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef } from 'react';
+const SvgFolderTree = (props, ref) => (_jsx("svg", { width: "1em", height: "1em", fill: "none", viewBox: "0 0 24 24", role: "img", ref: ref, ...props, children: _jsx("path", { fill: props.color || '#909090', fillRule: "evenodd", d: "M6 2a2.998 2.998 0 0 1 1 5.825V8a2 2 0 0 0 2 2h6.174A2.998 2.998 0 0 1 21 11a3 3 0 0 1-5.826 1H9a3.98 3.98 0 0 1-2-.537V16a2 2 0 0 0 2 2h6.174A2.998 2.998 0 0 1 21 19a3 3 0 0 1-5.826 1H9a4 4 0 0 1-4-4V7.825A2.998 2.998 0 0 1 6 2Zm12 16a1 1 0 1 0 0 2 1 1 0 0 0 0-2Zm0-8a1 1 0 1 0 0 2 1 1 0 0 0 0-2ZM6 4a1 1 0 1 0 0 2 1 1 0 0 0 0-2Z", clipRule: "evenodd" }) }));
+const ForwardRef = forwardRef(SvgFolderTree);
+export default ForwardRef;

package/dist/icons/Medium/index.d.ts

@@ -117,6 +117,7 @@ export { default as Folder } from './Folder';
 export { default as FolderArrow } from './FolderArrow';
 export { default as FolderArrowUp } from './FolderArrowUp';
 export { default as FolderPlus } from './FolderPlus';
+export { default as FolderTree } from './FolderTree';
 export { default as Funnel } from './Funnel';
 export { default as Gavel } from './Gavel';
 export { default as Gear } from './Gear';

package/dist/icons/Medium/index.js

@@ -117,6 +117,7 @@ export { default as Folder } from './Folder';
 export { default as FolderArrow } from './FolderArrow';
 export { default as FolderArrowUp } from './FolderArrowUp';
 export { default as FolderPlus } from './FolderPlus';
+export { default as FolderTree } from './FolderTree';
 export { default as Funnel } from './Funnel';
 export { default as Gavel } from './Gavel';
 export { default as Gear } from './Gear';

package/dist/tokens/BP2/dark_mode_value/px-tokens.d.ts

@@ -2,7 +2,13 @@
  * Do not edit directly, this file was auto-generated.
  */
 
+export const bpBackgroundBackgroundLightBlue: string;
+export const bpBackgroundBackgroundLightDarkBlue: string;
+export const bpBackgroundBackgroundLightGreen: string;
+export const bpBackgroundBackgroundLightGrimace: string;
+export const bpBorderAccordionBorder: string;
 export const bpBorderAccordionBorderHover: string;
+export const bpBorderAccordionBorderOutlined: string;
 export const bpBorderAvatarBorderHover: string;
 export const bpBorderAvatarBorderPressed: string;
 export const bpBorderBadgeBorder: string;
@@ -140,10 +146,14 @@ export const bpIconNavIconOnLight: string;
 export const bpIconNavIconOnLightFocus: string;
 export const bpIconNavIconOnLightHover: string;
 export const bpIconNavIconOnLightSelected: string;
+export const bpIconIconAnnotation: string;
 export const bpIconIconBlue: string;
+export const bpIconIconDarkBlue: string;
 export const bpIconIconDestructiveOnLight: string;
 export const bpIconIconErrorOnColor: string;
 export const bpIconIconErrorOnLight: string;
+export const bpIconIconGreen: string;
+export const bpIconIconGrimace: string;
 export const bpIconIconIllustrator: string;
 export const bpIconIconIndesign: string;
 export const bpIconIconInfoOnColor: string;
@@ -154,6 +164,7 @@ export const bpIconIconOnLightTertiary: string;
 export const bpIconIconPhotoshop: string;
 export const bpIconIconRequiredOnLight: string;
 export const bpIconIconSuccessOnColor: string;
+export const bpIconIconVariable: string;
 export const bpIconIconWarningOnColor: string;
 export const bpOutlineFocusOnDark: string;
 export const bpOutlineFocusOnLight: string;
@@ -163,6 +174,7 @@ export const bpSurfaceAccordionSurfaceCollapsed: string;
 export const bpSurfaceAccordionSurfaceCollapsedHover: string;
 export const bpSurfaceAccordionSurfaceExpanded: string;
 export const bpSurfaceAccordionSurfaceExpandedHover: string;
+export const bpSurfaceAccordionSurfaceExpandedOutlined: string;
 export const bpSurfaceBadgeSurfaceAdmin: string;
 export const bpSurfaceBadgeSurfaceAlert: string;
 export const bpSurfaceBadgeSurfaceAnnotation: string;
@@ -175,6 +187,7 @@ export const bpSurfaceBadgeSurfaceCoadmin: string;
 export const bpSurfaceBadgeSurfaceCode: string;
 export const bpSurfaceBadgeSurfaceCollection: string;
 export const bpSurfaceBadgeSurfaceCompleted: string;
+export const bpSurfaceBadgeSurfaceContentOffline: string;
 export const bpSurfaceBadgeSurfaceDefault: string;
 export const bpSurfaceBadgeSurfaceDocs: string;
 export const bpSurfaceBadgeSurfaceDrawing: string;
@@ -198,6 +211,7 @@ export const bpSurfaceBadgeSurfaceOffline: string;
 export const bpSurfaceBadgeSurfaceOnline: string;
 export const bpSurfaceBadgeSurfacePages: string;
 export const bpSurfaceBadgeSurfacePdf: string;
+export const bpSurfaceBadgeSurfacePending: string;
 export const bpSurfaceBadgeSurfacePhotoshop: string;
 export const bpSurfaceBadgeSurfacePin: string;
 export const bpSurfaceBadgeSurfacePowerpoint: string;
@@ -285,6 +299,8 @@ export const bpSurfaceDatePickerSurfaceDisabled: string;
 export const bpSurfaceDatePickerSurfaceError: string;
 export const bpSurfaceDatePickerSurfaceFocus: string;
 export const bpSurfaceDatePickerSurfaceHover: string;
+export const bpSurfaceDropdownQuaternarySurfaceHover: string;
+export const bpSurfaceDropdownQuaternarySurfacePressed: string;
 export const bpSurfaceDropdownSecondarySurface: string;
 export const bpSurfaceDropdownSecondarySurfaceHover: string;
 export const bpSurfaceDropdownSecondarySurfacePressed: string;
@@ -344,8 +360,15 @@ export const bpSurfaceInputSurfaceFocus: string;
 export const bpSurfaceInputSurfaceHover: string;
 export const bpSurfaceInputSurfaceReadOnly: string;
 export const bpSurfaceInputChipSurface: string;
+export const bpSurfaceInputChipSurfaceAnnotation: string;
+export const bpSurfaceInputChipSurfaceAnnotationHover: string;
+export const bpSurfaceInputChipSurfaceAnnotationPressed: string;
+export const bpSurfaceInputChipSurfaceDisabled: string;
 export const bpSurfaceInputChipSurfaceError: string;
 export const bpSurfaceInputChipSurfaceHover: string;
+export const bpSurfaceInputChipSurfaceVariable: string;
+export const bpSurfaceInputChipSurfaceVariableHover: string;
+export const bpSurfaceInputChipSurfaceVariablePressed: string;
 export const bpSurfaceItemSmallSurface: string;
 export const bpSurfaceItemSmallSurfaceHover: string;
 export const bpSurfaceItemSmallSurfaceSelected: string;
@@ -493,6 +516,9 @@ export const bpTextCtaLinkSecondary: string;
 export const bpTextCtaLinkSecondaryHover: string;
 export const bpTextCtaLinkSecondaryPressed: string;
 export const bpTextCtaPromo: string;
+export const bpTextCtaSecondary: string;
+export const bpTextCtaSecondaryHover: string;
+export const bpTextCtaSecondaryPressed: string;
 export const bpTextNavTextOnDark: string;
 export const bpTextNavTextOnDarkFocus: string;
 export const bpTextNavTextOnDarkHover: string;
@@ -502,6 +528,7 @@ export const bpTextNavTextOnLightFocus: string;
 export const bpTextNavTextOnLightHover: string;
 export const bpTextNavTextOnLightSelected: string;
 export const bpTextToggleTextText: string;
+export const bpTextTextAnnotationOnColor: string;
 export const bpTextTextBrandOnColor: string;
 export const bpTextTextDestructiveOnLight: string;
 export const bpTextTextErrorOnColor: string;
@@ -514,6 +541,7 @@ export const bpTextTextOnLightSecondary: string;
 export const bpTextTextOnLightSecondaryHover: string;
 export const bpTextTextOnLightTertiary: string;
 export const bpTextTextSuccessOnColor: string;
+export const bpTextTextVariableOnColor: string;
 export const bpTextTextWarningOnColor: string;
 export const bpBoxBlue10: string;
 export const bpBoxBlue20: string;
@@ -1000,6 +1028,19 @@ export const bpOrangeOpacity90: string;
 export const bpOrangeOpacity00: string;
 export const bpOrangeOpacity04: string;
 export const bpOrangeOpacity08: string;
+export const bpPurpleRainOpacity12: string;
+export const bpPurpleRainOpacity16: string;
+export const bpPurpleRainOpacity20: string;
+export const bpPurpleRainOpacity24: string;
+export const bpPurpleRainOpacity30: string;
+export const bpPurpleRainOpacity50: string;
+export const bpPurpleRainOpacity60: string;
+export const bpPurpleRainOpacity70: string;
+export const bpPurpleRainOpacity80: string;
+export const bpPurpleRainOpacity90: string;
+export const bpPurpleRainOpacity00: string;
+export const bpPurpleRainOpacity04: string;
+export const bpPurpleRainOpacity08: string;
 export const bpWatermelonRedOpacity12: string;
 export const bpWatermelonRedOpacity16: string;
 export const bpWatermelonRedOpacity20: string;

package/dist/tokens/BP2/dark_mode_value/px-tokens.js

@@ -2,7 +2,13 @@
  * Do not edit directly, this file was auto-generated.
  */
 
+export const bpBackgroundBackgroundLightBlue = '#e5effa';
+export const bpBackgroundBackgroundLightDarkBlue = '#e5ebf2';
+export const bpBackgroundBackgroundLightGreen = '#e9f8f2';
+export const bpBackgroundBackgroundLightGrimace = '#ece9f8';
+export const bpBorderAccordionBorder = '#e8e8e8';
 export const bpBorderAccordionBorderHover = '#e8e8e8';
+export const bpBorderAccordionBorderOutlined = '#0061d5';
 export const bpBorderAvatarBorderHover = 'rgba(0, 0, 0, 0.04)';
 export const bpBorderAvatarBorderPressed = 'rgba(0, 0, 0, 0.08)';
 export const bpBorderBadgeBorder = '#ffffff';
@@ -140,10 +146,14 @@ export const bpIconNavIconOnLight = '#222222';
 export const bpIconNavIconOnLightFocus = '#222222';
 export const bpIconNavIconOnLightHover = '#222222';
 export const bpIconNavIconOnLightSelected = '#222222';
+export const bpIconIconAnnotation = '#0057c0';
 export const bpIconIconBlue = '#0061d5';
+export const bpIconIconDarkBlue = '#003677';
 export const bpIconIconDestructiveOnLight = '#d5324e';
 export const bpIconIconErrorOnColor = '#821e30';
 export const bpIconIconErrorOnLight = '#d5324e';
+export const bpIconIconGreen = '#1e9b67';
+export const bpIconIconGrimace = '#4122af';
 export const bpIconIconIllustrator = '#ff9400';
 export const bpIconIconIndesign = '#ff57a1';
 export const bpIconIconInfoOnColor = '#00316b';
@@ -154,15 +164,17 @@ export const bpIconIconOnLightTertiary = 'rgba(0, 0, 0, 0.5)';
 export const bpIconIconPhotoshop = '#26c9ff';
 export const bpIconIconRequiredOnLight = '#d5324e';
 export const bpIconIconSuccessOnColor = '#0f4e34';
+export const bpIconIconVariable = '#8f39d5';
 export const bpIconIconWarningOnColor = '#62480b';
 export const bpOutlineFocusOnDark = '#ffffff';
 export const bpOutlineFocusOnLight = '#2486fc';
 export const bpOverlayModalOverlay = 'rgba(0, 0, 0, 0.5)';
 export const bpOverlaySidePanelOverlay = 'rgba(0, 0, 0, 0.5)';
-export const bpSurfaceAccordionSurfaceCollapsed = 'rgba(0, 0, 0, 0.04)';
+export const bpSurfaceAccordionSurfaceCollapsed = '#ffffff';
 export const bpSurfaceAccordionSurfaceCollapsedHover = 'rgba(0, 0, 0, 0.08)';
 export const bpSurfaceAccordionSurfaceExpanded = '#ffffff';
 export const bpSurfaceAccordionSurfaceExpandedHover = '#ffffff';
+export const bpSurfaceAccordionSurfaceExpandedOutlined = '#fafcfe';
 export const bpSurfaceBadgeSurfaceAdmin = '#003c84';
 export const bpSurfaceBadgeSurfaceAlert = '#d97417';
 export const bpSurfaceBadgeSurfaceAnnotation = '#f5b31b';
@@ -175,6 +187,7 @@ export const bpSurfaceBadgeSurfaceCoadmin = '#9f3fed';
 export const bpSurfaceBadgeSurfaceCode = '#ed3757';
 export const bpSurfaceBadgeSurfaceCollection = '#e8e8e8';
 export const bpSurfaceBadgeSurfaceCompleted = '#1e9b67';
+export const bpSurfaceBadgeSurfaceContentOffline = '#20a56e';
 export const bpSurfaceBadgeSurfaceDefault = '#6f6f6f';
 export const bpSurfaceBadgeSurfaceDocs = '#4083f7';
 export const bpSurfaceBadgeSurfaceDrawing = '#009aed';
@@ -198,6 +211,7 @@ export const bpSurfaceBadgeSurfaceOffline = '#26c281';
 export const bpSurfaceBadgeSurfaceOnline = '#1e9b67';
 export const bpSurfaceBadgeSurfacePages = '#ff9500';
 export const bpSurfaceBadgeSurfacePdf = '#d0021b';
+export const bpSurfaceBadgeSurfacePending = '#d97417';
 export const bpSurfaceBadgeSurfacePhotoshop = '#131415';
 export const bpSurfaceBadgeSurfacePin = '#e8e8e8';
 export const bpSurfaceBadgeSurfacePowerpoint = '#c43e1c';
@@ -285,6 +299,8 @@ export const bpSurfaceDatePickerSurfaceDisabled = '#ffffff';
 export const bpSurfaceDatePickerSurfaceError = '#ffffff';
 export const bpSurfaceDatePickerSurfaceFocus = '#ffffff';
 export const bpSurfaceDatePickerSurfaceHover = '#ffffff';
+export const bpSurfaceDropdownQuaternarySurfaceHover = 'rgba(255, 255, 255, 0.04)';
+export const bpSurfaceDropdownQuaternarySurfacePressed = 'rgba(255, 255, 255, 0.08)';
 export const bpSurfaceDropdownSecondarySurface = 'rgba(255, 255, 255, 0.7)';
 export const bpSurfaceDropdownSecondarySurfaceHover = 'rgba(0, 0, 0, 0.04)';
 export const bpSurfaceDropdownSecondarySurfacePressed = 'rgba(0, 0, 0, 0.08)';
@@ -344,8 +360,15 @@ export const bpSurfaceInputSurfaceFocus = '#ffffff';
 export const bpSurfaceInputSurfaceHover = '#ffffff';
 export const bpSurfaceInputSurfaceReadOnly = '#fbfbfb';
 export const bpSurfaceInputChipSurface = '#e8e8e8';
+export const bpSurfaceInputChipSurfaceAnnotation = 'rgba(0, 97, 213, 0.08)';
+export const bpSurfaceInputChipSurfaceAnnotationHover = 'rgba(0, 97, 213, 0.12)';
+export const bpSurfaceInputChipSurfaceAnnotationPressed = 'rgba(0, 97, 213, 0.16)';
+export const bpSurfaceInputChipSurfaceDisabled = 'rgba(0, 0, 0, 0.04)';
 export const bpSurfaceInputChipSurfaceError = '#fdebee';
 export const bpSurfaceInputChipSurfaceHover = '#e8e8e8';
+export const bpSurfaceInputChipSurfaceVariable = 'rgba(159, 63, 237, 0.08)';
+export const bpSurfaceInputChipSurfaceVariableHover = 'rgba(159, 63, 237, 0.12)';
+export const bpSurfaceInputChipSurfaceVariablePressed = 'rgba(159, 63, 237, 0.16)';
 export const bpSurfaceItemSmallSurface = '#ffffff';
 export const bpSurfaceItemSmallSurfaceHover = '#f4f4f4';
 export const bpSurfaceItemSmallSurfaceSelected = '#f2f7fd';
@@ -493,6 +516,9 @@ export const bpTextCtaLinkSecondary = '#6f6f6f';
 export const bpTextCtaLinkSecondaryHover = '#6f6f6f';
 export const bpTextCtaLinkSecondaryPressed = '#6f6f6f';
 export const bpTextCtaPromo = '#4826c2';
+export const bpTextCtaSecondary = '#6f6f6f';
+export const bpTextCtaSecondaryHover = '#4e4e4e';
+export const bpTextCtaSecondaryPressed = '#4e4e4e';
 export const bpTextNavTextOnDark = '#ffffff';
 export const bpTextNavTextOnDarkFocus = '#ffffff';
 export const bpTextNavTextOnDarkHover = '#ffffff';
@@ -502,6 +528,7 @@ export const bpTextNavTextOnLightFocus = '#ffffff';
 export const bpTextNavTextOnLightHover = '#ffffff';
 export const bpTextNavTextOnLightSelected = '#ffffff';
 export const bpTextToggleTextText = '#004eaa';
+export const bpTextTextAnnotationOnColor = '#0057c0';
 export const bpTextTextBrandOnColor = '#ffffff';
 export const bpTextTextDestructiveOnLight = '#d5324e';
 export const bpTextTextErrorOnColor = '#821e30';
@@ -514,6 +541,7 @@ export const bpTextTextOnLightSecondary = '#6f6f6f';
 export const bpTextTextOnLightSecondaryHover = '#4e4e4e';
 export const bpTextTextOnLightTertiary = '#909090';
 export const bpTextTextSuccessOnColor = '#0f4e34';
+export const bpTextTextVariableOnColor = '#8f39d5';
 export const bpTextTextWarningOnColor = '#62480b';
 export const bpBoxBlue10 = '#e5effa';
 export const bpBoxBlue20 = '#ccdff7';
@@ -1000,6 +1028,19 @@ export const bpOrangeOpacity90 = 'rgba(245, 179, 27, 0.9)';
 export const bpOrangeOpacity00 = 'rgba(245, 179, 27, 0)';
 export const bpOrangeOpacity04 = 'rgba(245, 179, 27, 0.04)';
 export const bpOrangeOpacity08 = 'rgba(245, 179, 27, 0.08)';
+export const bpPurpleRainOpacity12 = 'rgba(159, 63, 237, 0.12)';
+export const bpPurpleRainOpacity16 = 'rgba(159, 63, 237, 0.16)';
+export const bpPurpleRainOpacity20 = 'rgba(159, 63, 237, 0.2)';
+export const bpPurpleRainOpacity24 = 'rgba(159, 63, 237, 0.24)';
+export const bpPurpleRainOpacity30 = 'rgba(159, 63, 237, 0.3)';
+export const bpPurpleRainOpacity50 = 'rgba(159, 63, 237, 0.5)';
+export const bpPurpleRainOpacity60 = 'rgba(159, 63, 237, 0.6)';
+export const bpPurpleRainOpacity70 = 'rgba(159, 63, 237, 0.7)';
+export const bpPurpleRainOpacity80 = 'rgba(159, 63, 237, 0.8)';
+export const bpPurpleRainOpacity90 = 'rgba(159, 63, 237, 0.9)';
+export const bpPurpleRainOpacity00 = 'rgba(159, 63, 237, 0)';
+export const bpPurpleRainOpacity04 = 'rgba(159, 63, 237, 0.04)';
+export const bpPurpleRainOpacity08 = 'rgba(159, 63, 237, 0.08)';
 export const bpWatermelonRedOpacity12 = 'rgba(237, 55, 87, 0.12)';
 export const bpWatermelonRedOpacity16 = 'rgba(237, 55, 87, 0.16)';
 export const bpWatermelonRedOpacity20 = 'rgba(237, 55, 87, 0.2)';
@@ -1067,6 +1108,6 @@ export const bpDurationMedium = '150ms';
 export const bpDurationShort = '100ms';
 export const bpOpacityHidden = '0';
 export const bpOpacityVisible = '1';
-export const bpScaleDefault = 'scale(1.00)';
-export const bpScaleLarge = 'scale(1.12)';
-export const bpScaleSmall = 'scale(0.98)';
+export const bpScaleDefault = '1.00';
+export const bpScaleLarge = '1.12';
+export const bpScaleSmall = '0.98';

package/dist/tokens/BP2/dark_mode_value/tokens.css

@@ -526,6 +526,19 @@
     --bp-orange-opacity-00: rgba(245, 179, 27, 0);
     --bp-orange-opacity-04: rgba(245, 179, 27, 0.04);
     --bp-orange-opacity-08: rgba(245, 179, 27, 0.08);
+    --bp-purple-rain-opacity-12: rgba(159, 63, 237, 0.12);
+    --bp-purple-rain-opacity-16: rgba(159, 63, 237, 0.16);
+    --bp-purple-rain-opacity-20: rgba(159, 63, 237, 0.2);
+    --bp-purple-rain-opacity-24: rgba(159, 63, 237, 0.24);
+    --bp-purple-rain-opacity-30: rgba(159, 63, 237, 0.3);
+    --bp-purple-rain-opacity-50: rgba(159, 63, 237, 0.5);
+    --bp-purple-rain-opacity-60: rgba(159, 63, 237, 0.6);
+    --bp-purple-rain-opacity-70: rgba(159, 63, 237, 0.7);
+    --bp-purple-rain-opacity-80: rgba(159, 63, 237, 0.8);
+    --bp-purple-rain-opacity-90: rgba(159, 63, 237, 0.9);
+    --bp-purple-rain-opacity-00: rgba(159, 63, 237, 0);
+    --bp-purple-rain-opacity-04: rgba(159, 63, 237, 0.04);
+    --bp-purple-rain-opacity-08: rgba(159, 63, 237, 0.08);
     --bp-watermelon-red-opacity-12: rgba(237, 55, 87, 0.12);
     --bp-watermelon-red-opacity-16: rgba(237, 55, 87, 0.16);
     --bp-watermelon-red-opacity-20: rgba(237, 55, 87, 0.2);
@@ -593,10 +606,16 @@
     --bp-duration-short: 100ms;
     --bp-opacity-hidden: 0;
     --bp-opacity-visible: 1;
-    --bp-scale-default: scale(1);
-    --bp-scale-large: scale(1.12);
-    --bp-scale-small: scale(0.98);
+    --bp-scale-default: 1;
+    --bp-scale-large: 1.12;
+    --bp-scale-small: 0.98;
+    --bp-background-background-light-blue: var(--bp-box-blue-10);
+    --bp-background-background-light-dark-blue: var(--bp-dark-blue-10);
+    --bp-background-background-light-green: var(--bp-green-light-10);
+    --bp-background-background-light-grimace: var(--bp-grimace-10);
+    --bp-border-accordion-border: var(--bp-gray-10);
     --bp-border-accordion-border-hover: var(--bp-gray-10);
+    --bp-border-accordion-border-outlined: var(--bp-box-blue-100);
     --bp-border-avatar-border-hover: var(--bp-black-opacity-04);
     --bp-border-avatar-border-pressed: var(--bp-black-opacity-08);
     --bp-border-badge-border: var(--bp-gray-white);
@@ -722,10 +741,14 @@
     --bp-icon-nav-icon-on-light-focus: var(--bp-gray-100);
     --bp-icon-nav-icon-on-light-hover: var(--bp-gray-100);
     --bp-icon-nav-icon-on-light-selected: var(--bp-gray-100);
+    --bp-icon-icon-annotation: var(--bp-box-blue-110);
     --bp-icon-icon-blue: var(--bp-box-blue-100);
+    --bp-icon-icon-dark-blue: var(--bp-dark-blue-110);
     --bp-icon-icon-destructive-on-light: var(--bp-watermelon-red-110);
     --bp-icon-icon-error-on-color: var(--bp-watermelon-red-145);
     --bp-icon-icon-error-on-light: var(--bp-watermelon-red-110);
+    --bp-icon-icon-green: var(--bp-green-light-120);
+    --bp-icon-icon-grimace: var(--bp-grimace-110);
     --bp-icon-icon-info-on-color: var(--bp-box-blue-150);
     --bp-icon-icon-on-dark: var(--bp-gray-white);
     --bp-icon-icon-on-light: var(--bp-black-opacity-90);
@@ -733,15 +756,17 @@
     --bp-icon-icon-on-light-tertiary: var(--bp-black-opacity-50);
     --bp-icon-icon-required-on-light: var(--bp-watermelon-red-110);
     --bp-icon-icon-success-on-color: var(--bp-green-light-160);
+    --bp-icon-icon-variable: var(--bp-purple-rain-110);
     --bp-icon-icon-warning-on-color: var(--bp-yellorange-160);
     --bp-outline-focus-on-dark: var(--bp-gray-white);
     --bp-outline-focus-on-light: var(--bp-light-blue-100);
     --bp-overlay-modal-overlay: var(--bp-black-opacity-50);
     --bp-overlay-side-panel-overlay: var(--bp-black-opacity-50);
-    --bp-surface-accordion-surface-collapsed: var(--bp-black-opacity-04);
+    --bp-surface-accordion-surface-collapsed: var(--bp-gray-white);
     --bp-surface-accordion-surface-collapsed-hover: var(--bp-black-opacity-08);
     --bp-surface-accordion-surface-expanded: var(--bp-gray-white);
     --bp-surface-accordion-surface-expanded-hover: var(--bp-gray-white);
+    --bp-surface-accordion-surface-expanded-outlined: var(--bp-box-blue-02);
     --bp-surface-badge-surface-admin: var(--bp-dark-blue-100);
     --bp-surface-badge-surface-alert: var(--bp-orange-110);
     --bp-surface-badge-surface-annotation: var(--bp-yellorange-100);
@@ -754,6 +779,7 @@
     --bp-surface-badge-surface-code: var(--bp-watermelon-red-100);
     --bp-surface-badge-surface-collection: var(--bp-gray-10);
     --bp-surface-badge-surface-completed: var(--bp-green-light-120);
+    --bp-surface-badge-surface-content-offline: var(--bp-green-light-115);
     --bp-surface-badge-surface-default: var(--bp-gray-65);
     --bp-surface-badge-surface-error: var(--bp-watermelon-red-110);
     --bp-surface-badge-surface-external: var(--bp-gray-50);
@@ -768,6 +794,7 @@
     --bp-surface-badge-surface-notification: var(--bp-watermelon-red-110);
     --bp-surface-badge-surface-offline: var(--bp-green-light-100);
     --bp-surface-badge-surface-online: var(--bp-green-light-120);
+    --bp-surface-badge-surface-pending: var(--bp-orange-110);
     --bp-surface-badge-surface-pin: var(--bp-gray-10);
     --bp-surface-badge-surface-presentation: var(--bp-orange-110);
     --bp-surface-badge-surface-progress: var(--bp-yellorange-100);
@@ -847,6 +874,8 @@
     --bp-surface-date-picker-surface-error: var(--bp-gray-white);
     --bp-surface-date-picker-surface-focus: var(--bp-gray-white);
     --bp-surface-date-picker-surface-hover: var(--bp-gray-white);
+    --bp-surface-dropdown-quaternary-surface-hover: var(--bp-white-opacity-04);
+    --bp-surface-dropdown-quaternary-surface-pressed: var(--bp-white-opacity-08);
     --bp-surface-dropdown-secondary-surface: var(--bp-white-opacity-70);
     --bp-surface-dropdown-secondary-surface-hover: var(--bp-black-opacity-04);
     --bp-surface-dropdown-secondary-surface-pressed: var(--bp-black-opacity-08);
@@ -906,8 +935,15 @@
     --bp-surface-input-surface-hover: var(--bp-gray-white);
     --bp-surface-input-surface-read-only: var(--bp-gray-02);
     --bp-surface-input-chip-surface: var(--bp-gray-10);
+    --bp-surface-input-chip-surface-annotation: var(--bp-box-blue-opacity-08);
+    --bp-surface-input-chip-surface-annotation-hover: var(--bp-box-blue-opacity-12);
+    --bp-surface-input-chip-surface-annotation-pressed: var(--bp-box-blue-opacity-16);
+    --bp-surface-input-chip-surface-disabled: var(--bp-black-opacity-04);
     --bp-surface-input-chip-surface-error: var(--bp-watermelon-red-10);
     --bp-surface-input-chip-surface-hover: var(--bp-gray-10);
+    --bp-surface-input-chip-surface-variable: var(--bp-purple-rain-opacity-08);
+    --bp-surface-input-chip-surface-variable-hover: var(--bp-purple-rain-opacity-12);
+    --bp-surface-input-chip-surface-variable-pressed: var(--bp-purple-rain-opacity-16);
     --bp-surface-item-small-surface: var(--bp-gray-white);
     --bp-surface-item-small-surface-hover: var(--bp-gray-05);
     --bp-surface-item-small-surface-selected: var(--bp-box-blue-05);
@@ -1049,6 +1085,9 @@
     --bp-text-cta-link-secondary-hover: var(--bp-gray-65);
     --bp-text-cta-link-secondary-pressed: var(--bp-gray-65);
     --bp-text-cta-promo: var(--bp-grimace-100);
+    --bp-text-cta-secondary: var(--bp-gray-65);
+    --bp-text-cta-secondary-hover: var(--bp-gray-80);
+    --bp-text-cta-secondary-pressed: var(--bp-gray-80);
     --bp-text-nav-text-on-dark: var(--bp-gray-white);
     --bp-text-nav-text-on-dark-focus: var(--bp-gray-white);
     --bp-text-nav-text-on-dark-hover: var(--bp-gray-white);
@@ -1058,6 +1097,7 @@
     --bp-text-nav-text-on-light-hover: var(--bp-gray-white);
     --bp-text-nav-text-on-light-selected: var(--bp-gray-white);
     --bp-text-toggle-text-text: var(--bp-box-blue-120);
+    --bp-text-text-annotation-on-color: var(--bp-box-blue-110);
     --bp-text-text-brand-on-color: var(--bp-gray-white);
     --bp-text-text-destructive-on-light: var(--bp-watermelon-red-110);
     --bp-text-text-error-on-color: var(--bp-watermelon-red-145);
@@ -1070,5 +1110,6 @@
     --bp-text-text-on-light-secondary-hover: var(--bp-gray-80);
     --bp-text-text-on-light-tertiary: var(--bp-gray-50);
     --bp-text-text-success-on-color: var(--bp-green-light-160);
+    --bp-text-text-variable-on-color: var(--bp-purple-rain-110);
     --bp-text-text-warning-on-color: var(--bp-yellorange-160);
 }

package/dist/tokens/BP2/dark_mode_value/tokens.d.ts

@@ -1,4 +1,10 @@
+export const bpBackgroundBackgroundLightBlue: string;
+export const bpBackgroundBackgroundLightDarkBlue: string;
+export const bpBackgroundBackgroundLightGreen: string;
+export const bpBackgroundBackgroundLightGrimace: string;
+export const bpBorderAccordionBorder: string;
 export const bpBorderAccordionBorderHover: string;
+export const bpBorderAccordionBorderOutlined: string;
 export const bpBorderAvatarBorderHover: string;
 export const bpBorderAvatarBorderPressed: string;
 export const bpBorderBadgeBorder: string;
@@ -136,10 +142,14 @@ export const bpIconNavIconOnLight: string;
 export const bpIconNavIconOnLightFocus: string;
 export const bpIconNavIconOnLightHover: string;
 export const bpIconNavIconOnLightSelected: string;
+export const bpIconIconAnnotation: string;
 export const bpIconIconBlue: string;
+export const bpIconIconDarkBlue: string;
 export const bpIconIconDestructiveOnLight: string;
 export const bpIconIconErrorOnColor: string;
 export const bpIconIconErrorOnLight: string;
+export const bpIconIconGreen: string;
+export const bpIconIconGrimace: string;
 export const bpIconIconIllustrator: string;
 export const bpIconIconIndesign: string;
 export const bpIconIconInfoOnColor: string;
@@ -150,6 +160,7 @@ export const bpIconIconOnLightTertiary: string;
 export const bpIconIconPhotoshop: string;
 export const bpIconIconRequiredOnLight: string;
 export const bpIconIconSuccessOnColor: string;
+export const bpIconIconVariable: string;
 export const bpIconIconWarningOnColor: string;
 export const bpOutlineFocusOnDark: string;
 export const bpOutlineFocusOnLight: string;
@@ -159,6 +170,7 @@ export const bpSurfaceAccordionSurfaceCollapsed: string;
 export const bpSurfaceAccordionSurfaceCollapsedHover: string;
 export const bpSurfaceAccordionSurfaceExpanded: string;
 export const bpSurfaceAccordionSurfaceExpandedHover: string;
+export const bpSurfaceAccordionSurfaceExpandedOutlined: string;
 export const bpSurfaceBadgeSurfaceAdmin: string;
 export const bpSurfaceBadgeSurfaceAlert: string;
 export const bpSurfaceBadgeSurfaceAnnotation: string;
@@ -171,6 +183,7 @@ export const bpSurfaceBadgeSurfaceCoadmin: string;
 export const bpSurfaceBadgeSurfaceCode: string;
 export const bpSurfaceBadgeSurfaceCollection: string;
 export const bpSurfaceBadgeSurfaceCompleted: string;
+export const bpSurfaceBadgeSurfaceContentOffline: string;
 export const bpSurfaceBadgeSurfaceDefault: string;
 export const bpSurfaceBadgeSurfaceDocs: string;
 export const bpSurfaceBadgeSurfaceDrawing: string;
@@ -194,6 +207,7 @@ export const bpSurfaceBadgeSurfaceOffline: string;
 export const bpSurfaceBadgeSurfaceOnline: string;
 export const bpSurfaceBadgeSurfacePages: string;
 export const bpSurfaceBadgeSurfacePdf: string;
+export const bpSurfaceBadgeSurfacePending: string;
 export const bpSurfaceBadgeSurfacePhotoshop: string;
 export const bpSurfaceBadgeSurfacePin: string;
 export const bpSurfaceBadgeSurfacePowerpoint: string;
@@ -281,6 +295,8 @@ export const bpSurfaceDatePickerSurfaceDisabled: string;
 export const bpSurfaceDatePickerSurfaceError: string;
 export const bpSurfaceDatePickerSurfaceFocus: string;
 export const bpSurfaceDatePickerSurfaceHover: string;
+export const bpSurfaceDropdownQuaternarySurfaceHover: string;
+export const bpSurfaceDropdownQuaternarySurfacePressed: string;
 export const bpSurfaceDropdownSecondarySurface: string;
 export const bpSurfaceDropdownSecondarySurfaceHover: string;
 export const bpSurfaceDropdownSecondarySurfacePressed: string;
@@ -340,8 +356,15 @@ export const bpSurfaceInputSurfaceFocus: string;
 export const bpSurfaceInputSurfaceHover: string;
 export const bpSurfaceInputSurfaceReadOnly: string;
 export const bpSurfaceInputChipSurface: string;
+export const bpSurfaceInputChipSurfaceAnnotation: string;
+export const bpSurfaceInputChipSurfaceAnnotationHover: string;
+export const bpSurfaceInputChipSurfaceAnnotationPressed: string;
+export const bpSurfaceInputChipSurfaceDisabled: string;
 export const bpSurfaceInputChipSurfaceError: string;
 export const bpSurfaceInputChipSurfaceHover: string;
+export const bpSurfaceInputChipSurfaceVariable: string;
+export const bpSurfaceInputChipSurfaceVariableHover: string;
+export const bpSurfaceInputChipSurfaceVariablePressed: string;
 export const bpSurfaceItemSmallSurface: string;
 export const bpSurfaceItemSmallSurfaceHover: string;
 export const bpSurfaceItemSmallSurfaceSelected: string;
@@ -489,6 +512,9 @@ export const bpTextCtaLinkSecondary: string;
 export const bpTextCtaLinkSecondaryHover: string;
 export const bpTextCtaLinkSecondaryPressed: string;
 export const bpTextCtaPromo: string;
+export const bpTextCtaSecondary: string;
+export const bpTextCtaSecondaryHover: string;
+export const bpTextCtaSecondaryPressed: string;
 export const bpTextNavTextOnDark: string;
 export const bpTextNavTextOnDarkFocus: string;
 export const bpTextNavTextOnDarkHover: string;
@@ -498,6 +524,7 @@ export const bpTextNavTextOnLightFocus: string;
 export const bpTextNavTextOnLightHover: string;
 export const bpTextNavTextOnLightSelected: string;
 export const bpTextToggleTextText: string;
+export const bpTextTextAnnotationOnColor: string;
 export const bpTextTextBrandOnColor: string;
 export const bpTextTextDestructiveOnLight: string;
 export const bpTextTextErrorOnColor: string;
@@ -510,6 +537,7 @@ export const bpTextTextOnLightSecondary: string;
 export const bpTextTextOnLightSecondaryHover: string;
 export const bpTextTextOnLightTertiary: string;
 export const bpTextTextSuccessOnColor: string;
+export const bpTextTextVariableOnColor: string;
 export const bpTextTextWarningOnColor: string;
 export const bpBoxBlue10: string;
 export const bpBoxBlue20: string;
@@ -996,6 +1024,19 @@ export const bpOrangeOpacity90: string;
 export const bpOrangeOpacity00: string;
 export const bpOrangeOpacity04: string;
 export const bpOrangeOpacity08: string;
+export const bpPurpleRainOpacity12: string;
+export const bpPurpleRainOpacity16: string;
+export const bpPurpleRainOpacity20: string;
+export const bpPurpleRainOpacity24: string;
+export const bpPurpleRainOpacity30: string;
+export const bpPurpleRainOpacity50: string;
+export const bpPurpleRainOpacity60: string;
+export const bpPurpleRainOpacity70: string;
+export const bpPurpleRainOpacity80: string;
+export const bpPurpleRainOpacity90: string;
+export const bpPurpleRainOpacity00: string;
+export const bpPurpleRainOpacity04: string;
+export const bpPurpleRainOpacity08: string;
 export const bpWatermelonRedOpacity12: string;
 export const bpWatermelonRedOpacity16: string;
 export const bpWatermelonRedOpacity20: string;