@atlaskit/primitives 19.0.0 → 19.0.2

package/dist/esm/utils/surface-context.js

@@ -0,0 +1,7 @@
+import { createContext } from 'react';
+/**
+ * __Surface context__
+ *
+ * A surface context provides context information on the current background (if set).
+ */
+export var SurfaceContext = /*#__PURE__*/createContext('elevation.surface');

package/dist/esm/utils/surface-provider.js

@@ -1,11 +1,5 @@
-import { createContext, useContext } from 'react';
-/**
- * __Surface context__
- *
- * A surface context provides context information on the current background (if set).
- */
-export var SurfaceContext = /*#__PURE__*/createContext('elevation.surface');
-
+import { useContext } from 'react';
+import { SurfaceContext } from './surface-context';
 /**
  * __useSurface__
  *
@@ -16,4 +10,5 @@ export var SurfaceContext = /*#__PURE__*/createContext('elevation.surface');
 export var useSurface = function useSurface() {
   return useContext(SurfaceContext);
 };
-SurfaceContext.displayName = 'SurfaceProvider';
+SurfaceContext.displayName = 'SurfaceProvider';
+export { SurfaceContext } from './surface-context';

package/dist/esm/xcss/style-maps.partial.js

@@ -67,10 +67,10 @@ export var allSpaceMap = _objectSpread(_objectSpread({}, positiveSpaceMap), nega
 
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::cefa2c59e15e6a3749ef38fa86c6adea>>
+ * @codegen <<SignedSource::5181bd08725ac44b53e0ae9f914067c1>>
  * @codegenId inverse-colors
  * @codegenCommand yarn workspace @atlaskit/primitives codegen-styles
- * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::38a7d4716f6999a6bdda9e4fe2bca6a1>>
+ * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::3c254494d015dde7566fc7c46750adf2>>
  */
 export var inverseColorMap = {
   'color.background.neutral.bold': 'color.text.inverse',
@@ -108,11 +108,11 @@ export var inverseColorMap = {
 
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::c673d53a0a31524e65f1c7051579eae5>>
+ * @codegen <<SignedSource::54e9dee77c5da7d77db6b6cb20970356>>
  * @codegenId elevation
  * @codegenCommand yarn workspace @atlaskit/primitives codegen-styles
  * @codegenParams ["opacity", "shadow", "surface"]
- * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::38a7d4716f6999a6bdda9e4fe2bca6a1>>
+ * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::3c254494d015dde7566fc7c46750adf2>>
  */
 export var opacityMap = {
   'opacity.disabled': "var(--ds-opacity-disabled, 0.4)",
@@ -143,24 +143,34 @@ export var surfaceColorMap = {
 
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::fa88ed1ec5a817750b0348ca36dbb5f1>>
+ * @codegen <<SignedSource::5fd7f92fbc474ab0beacc4e06dad8fca>>
  * @codegenId colors
  * @codegenCommand yarn workspace @atlaskit/primitives codegen-styles
  * @codegenParams ["border", "background", "text", "fill"]
- * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::38a7d4716f6999a6bdda9e4fe2bca6a1>>
+ * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::3c254494d015dde7566fc7c46750adf2>>
  */
 export var borderColorMap = {
   'color.border': "var(--ds-border, #0B120E24)",
   'color.border.accent.lime': "var(--ds-border-accent-lime, #6A9A23)",
+  'color.border.accent.lime.subtle': "var(--ds-border-accent-lime-subtle, #B3DF72)",
   'color.border.accent.red': "var(--ds-border-accent-red, #E2483D)",
+  'color.border.accent.red.subtle': "var(--ds-border-accent-red-subtle, #FD9891)",
   'color.border.accent.orange': "var(--ds-border-accent-orange, #E06C00)",
+  'color.border.accent.orange.subtle': "var(--ds-border-accent-orange-subtle, #FBC828)",
   'color.border.accent.yellow': "var(--ds-border-accent-yellow, #B38600)",
+  'color.border.accent.yellow.subtle': "var(--ds-border-accent-yellow-subtle, #EED12B)",
   'color.border.accent.green': "var(--ds-border-accent-green, #22A06B)",
+  'color.border.accent.green.subtle': "var(--ds-border-accent-green-subtle, #7EE2B8)",
   'color.border.accent.teal': "var(--ds-border-accent-teal, #2898BD)",
+  'color.border.accent.teal.subtle': "var(--ds-border-accent-teal-subtle, #9DD9EE)",
   'color.border.accent.blue': "var(--ds-border-accent-blue, #357DE8)",
+  'color.border.accent.blue.subtle': "var(--ds-border-accent-blue-subtle, #8FB8F6)",
   'color.border.accent.purple': "var(--ds-border-accent-purple, #AF59E1)",
+  'color.border.accent.purple.subtle': "var(--ds-border-accent-purple-subtle, #D8A0F7)",
   'color.border.accent.magenta': "var(--ds-border-accent-magenta, #CD519D)",
+  'color.border.accent.magenta.subtle': "var(--ds-border-accent-magenta-subtle, #F797D2)",
   'color.border.accent.gray': "var(--ds-border-accent-gray, #7D818A)",
+  'color.border.accent.gray.subtle': "var(--ds-border-accent-gray-subtle, #DDDEE1)",
   'color.border.disabled': "var(--ds-border-disabled, #0515240F)",
   'color.border.focused': "var(--ds-border-focused, #4688EC)",
   'color.border.input': "var(--ds-border-input, #8C8F97)",
@@ -168,10 +178,15 @@ export var borderColorMap = {
   'color.border.selected': "var(--ds-border-selected, #1868DB)",
   'color.border.brand': "var(--ds-border-brand, #1868DB)",
   'color.border.danger': "var(--ds-border-danger, #E2483D)",
+  'color.border.danger.subtle': "var(--ds-border-danger-subtle, #FD9891)",
   'color.border.warning': "var(--ds-border-warning, #E06C00)",
+  'color.border.warning.subtle': "var(--ds-border-warning-subtle, #FBC828)",
   'color.border.success': "var(--ds-border-success, #6A9A23)",
+  'color.border.success.subtle': "var(--ds-border-success-subtle, #B3DF72)",
   'color.border.discovery': "var(--ds-border-discovery, #AF59E1)",
+  'color.border.discovery.subtle': "var(--ds-border-discovery-subtle, #D8A0F7)",
   'color.border.information': "var(--ds-border-information, #357DE8)",
+  'color.border.information.subtle': "var(--ds-border-information-subtle, #8FB8F6)",
   'color.border.bold': "var(--ds-border-bold, #7D818A)"
 };
 export var backgroundColorMap = {
@@ -295,7 +310,7 @@ export var backgroundColorMap = {
   'color.background.accent.gray.bolder': "var(--ds-background-accent-gray-bolder, #6B6E76)",
   'color.background.accent.gray.bolder.hovered': "var(--ds-background-accent-gray-bolder-hovered, #505258)",
   'color.background.accent.gray.bolder.pressed': "var(--ds-background-accent-gray-bolder-pressed, #3B3D42)",
-  'color.background.disabled': "var(--ds-background-disabled, #17171708)",
+  'color.background.disabled': "var(--ds-background-disabled, #0515240F)",
   'color.background.input': "var(--ds-background-input, #FFFFFF)",
   'color.background.input.hovered': "var(--ds-background-input-hovered, #F8F8F8)",
   'color.background.input.pressed': "var(--ds-background-input-pressed, #FFFFFF)",
@@ -332,6 +347,7 @@ export var backgroundColorMap = {
   'color.background.danger.subtler': "var(--ds-background-danger-subtler, #FFD5D2)",
   'color.background.danger.subtler.hovered': "var(--ds-background-danger-subtler-hovered, #FFB8B2)",
   'color.background.danger.subtler.pressed': "var(--ds-background-danger-subtler-pressed, #FD9891)",
+  'color.background.danger.subtle': "var(--ds-background-danger-subtle, #FD9891)",
   'color.background.danger.bold': "var(--ds-background-danger-bold, #C9372C)",
   'color.background.danger.bold.hovered': "var(--ds-background-danger-bold-hovered, #AE2E24)",
   'color.background.danger.bold.pressed': "var(--ds-background-danger-bold-pressed, #872821)",
@@ -341,6 +357,7 @@ export var backgroundColorMap = {
   'color.background.warning.subtler': "var(--ds-background-warning-subtler, #FCE4A6)",
   'color.background.warning.subtler.hovered': "var(--ds-background-warning-subtler-hovered, #FBD779)",
   'color.background.warning.subtler.pressed': "var(--ds-background-warning-subtler-pressed, #FBC828)",
+  'color.background.warning.subtle': "var(--ds-background-warning-subtle, #FBD779)",
   'color.background.warning.bold': "var(--ds-background-warning-bold, #FBC828)",
   'color.background.warning.bold.hovered': "var(--ds-background-warning-bold-hovered, #FCA700)",
   'color.background.warning.bold.pressed': "var(--ds-background-warning-bold-pressed, #F68909)",
@@ -350,6 +367,7 @@ export var backgroundColorMap = {
   'color.background.success.subtler': "var(--ds-background-success-subtler, #D3F1A7)",
   'color.background.success.subtler.hovered': "var(--ds-background-success-subtler-hovered, #BDE97C)",
   'color.background.success.subtler.pressed': "var(--ds-background-success-subtler-pressed, #B3DF72)",
+  'color.background.success.subtle': "var(--ds-background-success-subtle, #B3DF72)",
   'color.background.success.bold': "var(--ds-background-success-bold, #5B7F24)",
   'color.background.success.bold.hovered': "var(--ds-background-success-bold-hovered, #4C6B1F)",
   'color.background.success.bold.pressed': "var(--ds-background-success-bold-pressed, #3F5224)",
@@ -359,6 +377,7 @@ export var backgroundColorMap = {
   'color.background.discovery.subtler': "var(--ds-background-discovery-subtler, #EED7FC)",
   'color.background.discovery.subtler.hovered': "var(--ds-background-discovery-subtler-hovered, #E3BDFA)",
   'color.background.discovery.subtler.pressed': "var(--ds-background-discovery-subtler-pressed, #D8A0F7)",
+  'color.background.discovery.subtle': "var(--ds-background-discovery-subtle, #D8A0F7)",
   'color.background.discovery.bold': "var(--ds-background-discovery-bold, #964AC0)",
   'color.background.discovery.bold.hovered': "var(--ds-background-discovery-bold-hovered, #803FA5)",
   'color.background.discovery.bold.pressed': "var(--ds-background-discovery-bold-pressed, #673286)",
@@ -368,6 +387,7 @@ export var backgroundColorMap = {
   'color.background.information.subtler': "var(--ds-background-information-subtler, #CFE1FD)",
   'color.background.information.subtler.hovered': "var(--ds-background-information-subtler-hovered, #ADCBFB)",
   'color.background.information.subtler.pressed': "var(--ds-background-information-subtler-pressed, #8FB8F6)",
+  'color.background.information.subtle': "var(--ds-background-information-subtle, #8FB8F6)",
   'color.background.information.bold': "var(--ds-background-information-bold, #1868DB)",
   'color.background.information.bold.hovered': "var(--ds-background-information-bold-hovered, #1558BC)",
   'color.background.information.bold.pressed': "var(--ds-background-information-bold-pressed, #144794)",

package/dist/esm/xcss/xcss.js

@@ -158,6 +158,7 @@ var baseXcss = function baseXcss(style) {
  * @private
  * @deprecated
  */
+// eslint-disable-next-line @atlaskit/volt-strict-mode/no-multiple-exports
 var _parseXcss = function parseXcss(args) {
   if (Array.isArray(args)) {
     var emotion = [];
@@ -223,6 +224,7 @@ export { _parseXcss as parseXcss }; // Media queries should not contain nested m
  * @deprecated Use `@atlaskit/css` with `@atlaskit/primitives/compiled` instead.
  * {@link https://hello.atlassian.net/wiki/spaces/DST/pages/4992259434/Guidance+Migrating+to+atlaskit+css+from+xcss Internal documentation for migration; no external access}
  */
+// eslint-disable-next-line @atlaskit/volt-strict-mode/no-multiple-exports
 export function xcss(style) {
   return baseXcss(style);
 }

package/dist/types/responsive/build-media-query-css.d.ts

@@ -1,63 +1,2 @@
-import { type CSSObject, type SerializedStyles } from '@emotion/react';
-import type { Breakpoint } from './types';
-/**
- * Build a map of breakpoints to css with media queries and nested styles.
- *
- * @internal Not intended to be used outside of DST at this stage.
- * @experimental Not intended to be used outside of DST at this stage.
- *
- * @example
- * A map to build optional `display:none` for consumption on a div.
- * ```ts
- * const hideMediaQueries = buildAboveMediaQueryCSS({ display: 'none' });
- *
- * const Component = ({ hideAtBreakpoints: ('xs' | 'sm')[], children: ReactNode }) => {
- *   return <div css={hideAtBreakpoints.map(b => hideMediaQueries[b])}>{children}</div>;
- * }
- * ```
- *
- * This roughly builds a map that will look roughly like this (if done manually):
- * ```ts
- * {
- *   xxs: css({ '@media all': { display: 'none' } }),
- *   xs: css({ '@media (min-width: 30rem)': { display: 'none' } }),
- *   sm: css({ '@media (min-width: 48rem)': { display: 'none' } }),
- * }
- * ```
- */
-export declare const UNSAFE_buildAboveMediaQueryCSS: (
-/**
- * The desired CSS to place inside of the media query.
- * This can either be a css object directly or functional with `breakpoint` as the arg to return a css object.
- */
-input: CSSObject | ((breakpoint: Breakpoint) => CSSObject)) => Required<Partial<Record<Breakpoint, SerializedStyles>>>;
-/**
- * Build a map of breakpoints to css with media queries and nested styles.
- *
- * @internal Not intended to be used outside of DST at this stage.
- * @experimental Not intended to be used outside of DST at this stage.
- *
- * @example
- * A map to build optional `display:none` for consumption on a div.
- * ```ts
- * const hideMediaQueries = buildBelowMediaQueryCSS({ display: 'none' });
- *
- * const Component = ({ hideAtBreakpoints: ('xs' | 'sm')[], children: ReactNode }) => {
- *   return <div css={hideAtBreakpoints.map(b => hideMediaQueries[b])}>{children}</div>;
- * }
- * ```
- *
- * This roughly builds a map that will look roughly like this (if done manually):
- * ```ts
- * {
- *   xs: css({ '@media not all and (min-width: 30rem)': { display: 'none' } }),
- *   sm: css({ '@media not all and (min-width: 48rem)': { display: 'none' } }),
- * }
- * ```
- */
-export declare const UNSAFE_buildBelowMediaQueryCSS: (
-/**
- * The desired CSS to place inside of the media query.
- * This can either be a css object directly or functional with `breakpoint` as the arg to return a css object.
- */
-input: CSSObject | ((breakpoint: Breakpoint) => CSSObject)) => Required<Partial<Record<Breakpoint, SerializedStyles>>>;
+export { UNSAFE_buildAboveMediaQueryCSS } from './unsafe-build-above-media-query-css';
+export { UNSAFE_buildBelowMediaQueryCSS } from './unsafe-build-below-media-query-css';

package/dist/types/responsive/media-helper.d.ts

@@ -1,38 +1,3 @@
-/**
- * This is an object of usable media query helpers using our internal breakpoints configuration.
- *
- * When using Compiled CSS-in-JS, please ensure that only a single declaration can take effect at a time.
- * This means that you should avoid multiple breakpoints taking effect at the same time,
- * eg. ```{ [media.above.xs]: { color: 'red' }, [media.above.sm]: { color: 'green' }}```.
- * Instead, make sure that only one breakpoint can take effect at a time,
- * e.g, ```{ [media.only.xs]: { color: 'red' }, [media.above.sm]: { color: 'green' }}```.
- * For more details, please see <https://compiledcssinjs.com/docs/atomic-css#selector-specificity>.
- */
-export declare const media: {
-    above: {
-        readonly xxs: "@media all";
-        readonly xs: "@media (min-width: 30rem)";
-        readonly sm: "@media (min-width: 48rem)";
-        readonly md: "@media (min-width: 64rem)";
-        readonly lg: "@media (min-width: 90rem)";
-        readonly xl: "@media (min-width: 110.5rem)";
-    };
-    only: {
-        readonly xxs: "@media (min-width: 0rem) and (max-width: 29.99rem)";
-        readonly xs: "@media (min-width: 30rem) and (max-width: 47.99rem)";
-        readonly sm: "@media (min-width: 48rem) and (max-width: 63.99rem)";
-        readonly md: "@media (min-width: 64rem) and (max-width: 89.99rem)";
-        readonly lg: "@media (min-width: 90rem) and (max-width: 110.49rem)";
-        readonly xl: "@media (min-width: 110.5rem)";
-    };
-    below: {
-        readonly xs: "@media not all and (min-width: 30rem)";
-        readonly sm: "@media not all and (min-width: 48rem)";
-        readonly md: "@media not all and (min-width: 64rem)";
-        readonly lg: "@media not all and (min-width: 90rem)";
-        readonly xl: "@media not all and (min-width: 110.5rem)";
-    };
-};
 /**
  * Keep `UNSAFE_media` for backwards compatibility.
  */
@@ -61,3 +26,4 @@ export declare const UNSAFE_media: {
         readonly xl: '@media not all and (min-width: 110.5rem)';
     };
 };
+export { media } from './media';

package/dist/types/responsive/media.d.ts

@@ -0,0 +1,25 @@
+export declare const media: {
+    above: {
+        readonly xxs: "@media all";
+        readonly xs: "@media (min-width: 30rem)";
+        readonly sm: "@media (min-width: 48rem)";
+        readonly md: "@media (min-width: 64rem)";
+        readonly lg: "@media (min-width: 90rem)";
+        readonly xl: "@media (min-width: 110.5rem)";
+    };
+    only: {
+        readonly xxs: "@media (min-width: 0rem) and (max-width: 29.99rem)";
+        readonly xs: "@media (min-width: 30rem) and (max-width: 47.99rem)";
+        readonly sm: "@media (min-width: 48rem) and (max-width: 63.99rem)";
+        readonly md: "@media (min-width: 64rem) and (max-width: 89.99rem)";
+        readonly lg: "@media (min-width: 90rem) and (max-width: 110.49rem)";
+        readonly xl: "@media (min-width: 110.5rem)";
+    };
+    below: {
+        readonly xs: "@media not all and (min-width: 30rem)";
+        readonly sm: "@media not all and (min-width: 48rem)";
+        readonly md: "@media not all and (min-width: 64rem)";
+        readonly lg: "@media not all and (min-width: 90rem)";
+        readonly xl: "@media not all and (min-width: 110.5rem)";
+    };
+};

package/dist/types/responsive/types.d.ts

@@ -1,5 +1,5 @@
 import { type SerializedStyles } from '@emotion/react';
-import { type media } from './media-helper';
+import type { media } from './media';
 /**
  * The breakpoints we have for responsiveness.
  */

package/dist/types/responsive/unsafe-build-above-media-query-css.d.ts

@@ -0,0 +1,33 @@
+import { type CSSObject, type SerializedStyles } from '@emotion/react';
+import type { Breakpoint } from './types';
+/**
+ * Build a map of breakpoints to css with media queries and nested styles.
+ *
+ * @internal Not intended to be used outside of DST at this stage.
+ * @experimental Not intended to be used outside of DST at this stage.
+ *
+ * @example
+ * A map to build optional `display:none` for consumption on a div.
+ * ```ts
+ * const hideMediaQueries = buildAboveMediaQueryCSS({ display: 'none' });
+ *
+ * const Component = ({ hideAtBreakpoints: ('xs' | 'sm')[], children: ReactNode }) => {
+ *   return <div css={hideAtBreakpoints.map(b => hideMediaQueries[b])}>{children}</div>;
+ * }
+ * ```
+ *
+ * This roughly builds a map that will look roughly like this (if done manually):
+ * ```ts
+ * {
+ *   xxs: css({ '@media all': { display: 'none' } }),
+ *   xs: css({ '@media (min-width: 30rem)': { display: 'none' } }),
+ *   sm: css({ '@media (min-width: 48rem)': { display: 'none' } }),
+ * }
+ * ```
+ */
+export declare const UNSAFE_buildAboveMediaQueryCSS: (
+/**
+ * The desired CSS to place inside of the media query.
+ * This can either be a css object directly or functional with `breakpoint` as the arg to return a css object.
+ */
+input: CSSObject | ((breakpoint: Breakpoint) => CSSObject)) => Required<Partial<Record<Breakpoint, SerializedStyles>>>;

package/dist/types/responsive/unsafe-build-below-media-query-css.d.ts

@@ -0,0 +1,32 @@
+import { type CSSObject, type SerializedStyles } from '@emotion/react';
+import type { Breakpoint } from './types';
+/**
+ * Build a map of breakpoints to css with media queries and nested styles.
+ *
+ * @internal Not intended to be used outside of DST at this stage.
+ * @experimental Not intended to be used outside of DST at this stage.
+ *
+ * @example
+ * A map to build optional `display:none` for consumption on a div.
+ * ```ts
+ * const hideMediaQueries = buildBelowMediaQueryCSS({ display: 'none' });
+ *
+ * const Component = ({ hideAtBreakpoints: ('xs' | 'sm')[], children: ReactNode }) => {
+ *   return <div css={hideAtBreakpoints.map(b => hideMediaQueries[b])}>{children}</div>;
+ * }
+ * ```
+ *
+ * This roughly builds a map that will look roughly like this (if done manually):
+ * ```ts
+ * {
+ *   xs: css({ '@media not all and (min-width: 30rem)': { display: 'none' } }),
+ *   sm: css({ '@media not all and (min-width: 48rem)': { display: 'none' } }),
+ * }
+ * ```
+ */
+export declare const UNSAFE_buildBelowMediaQueryCSS: (
+/**
+ * The desired CSS to place inside of the media query.
+ * This can either be a css object directly or functional with `breakpoint` as the arg to return a css object.
+ */
+input: CSSObject | ((breakpoint: Breakpoint) => CSSObject)) => Required<Partial<Record<Breakpoint, SerializedStyles>>>;

package/dist/types/utils/surface-context.d.ts

@@ -0,0 +1,8 @@
+import { type Context } from 'react';
+import type { BackgroundColorToken } from './types';
+/**
+ * __Surface context__
+ *
+ * A surface context provides context information on the current background (if set).
+ */
+export declare const SurfaceContext: Context<BackgroundColorToken>;

package/dist/types/utils/surface-provider.d.ts

@@ -1,11 +1,4 @@
-import { type Context } from 'react';
 import type { BackgroundColorToken } from './types';
-/**
- * __Surface context__
- *
- * A surface context provides context information on the current background (if set).
- */
-export declare const SurfaceContext: Context<BackgroundColorToken>;
 /**
  * __useSurface__
  *
@@ -14,3 +7,4 @@ export declare const SurfaceContext: Context<BackgroundColorToken>;
  * @see SurfaceContext
  */
 export declare const useSurface: () => BackgroundColorToken;
+export { SurfaceContext } from './surface-context';

package/dist/types/utils/types.d.ts

@@ -3,4 +3,4 @@
  * as we typically want to remove these from allowed elements.
  */
 export type SVGElements = 'svg' | 'animate' | 'animateMotion' | 'animateTransform' | 'circle' | 'clipPath' | 'defs' | 'desc' | 'ellipse' | 'feBlend' | 'feColorMatrix' | 'feComponentTransfer' | 'feComposite' | 'feConvolveMatrix' | 'feDiffuseLighting' | 'feDisplacementMap' | 'feDistantLight' | 'feDropShadow' | 'feFlood' | 'feFuncA' | 'feFuncB' | 'feFuncG' | 'feFuncR' | 'feGaussianBlur' | 'feImage' | 'feMerge' | 'feMergeNode' | 'feMorphology' | 'feOffset' | 'fePointLight' | 'feSpecularLighting' | 'feSpotLight' | 'feTile' | 'feTurbulence' | 'filter' | 'foreignObject' | 'g' | 'image' | 'line' | 'linearGradient' | 'marker' | 'mask' | 'metadata' | 'mpath' | 'path' | 'pattern' | 'polygon' | 'polyline' | 'radialGradient' | 'rect' | 'stop' | 'switch' | 'symbol' | 'text' | 'textPath' | 'tspan' | 'use' | 'view';
-export type BackgroundColorToken = 'color.background.accent.lime.subtlest' | 'color.background.accent.lime.subtlest.hovered' | 'color.background.accent.lime.subtlest.pressed' | 'color.background.accent.lime.subtler' | 'color.background.accent.lime.subtler.hovered' | 'color.background.accent.lime.subtler.pressed' | 'color.background.accent.lime.subtle' | 'color.background.accent.lime.subtle.hovered' | 'color.background.accent.lime.subtle.pressed' | 'color.background.accent.lime.bolder' | 'color.background.accent.lime.bolder.hovered' | 'color.background.accent.lime.bolder.pressed' | 'color.background.accent.red.subtlest' | 'color.background.accent.red.subtlest.hovered' | 'color.background.accent.red.subtlest.pressed' | 'color.background.accent.red.subtler' | 'color.background.accent.red.subtler.hovered' | 'color.background.accent.red.subtler.pressed' | 'color.background.accent.red.subtle' | 'color.background.accent.red.subtle.hovered' | 'color.background.accent.red.subtle.pressed' | 'color.background.accent.red.bolder' | 'color.background.accent.red.bolder.hovered' | 'color.background.accent.red.bolder.pressed' | 'color.background.accent.orange.subtlest' | 'color.background.accent.orange.subtlest.hovered' | 'color.background.accent.orange.subtlest.pressed' | 'color.background.accent.orange.subtler' | 'color.background.accent.orange.subtler.hovered' | 'color.background.accent.orange.subtler.pressed' | 'color.background.accent.orange.subtle' | 'color.background.accent.orange.subtle.hovered' | 'color.background.accent.orange.subtle.pressed' | 'color.background.accent.orange.bolder' | 'color.background.accent.orange.bolder.hovered' | 'color.background.accent.orange.bolder.pressed' | 'color.background.accent.yellow.subtlest' | 'color.background.accent.yellow.subtlest.hovered' | 'color.background.accent.yellow.subtlest.pressed' | 'color.background.accent.yellow.subtler' | 'color.background.accent.yellow.subtler.hovered' | 'color.background.accent.yellow.subtler.pressed' | 'color.background.accent.yellow.subtle' | 'color.background.accent.yellow.subtle.hovered' | 'color.background.accent.yellow.subtle.pressed' | 'color.background.accent.yellow.bolder' | 'color.background.accent.yellow.bolder.hovered' | 'color.background.accent.yellow.bolder.pressed' | 'color.background.accent.green.subtlest' | 'color.background.accent.green.subtlest.hovered' | 'color.background.accent.green.subtlest.pressed' | 'color.background.accent.green.subtler' | 'color.background.accent.green.subtler.hovered' | 'color.background.accent.green.subtler.pressed' | 'color.background.accent.green.subtle' | 'color.background.accent.green.subtle.hovered' | 'color.background.accent.green.subtle.pressed' | 'color.background.accent.green.bolder' | 'color.background.accent.green.bolder.hovered' | 'color.background.accent.green.bolder.pressed' | 'color.background.accent.teal.subtlest' | 'color.background.accent.teal.subtlest.hovered' | 'color.background.accent.teal.subtlest.pressed' | 'color.background.accent.teal.subtler' | 'color.background.accent.teal.subtler.hovered' | 'color.background.accent.teal.subtler.pressed' | 'color.background.accent.teal.subtle' | 'color.background.accent.teal.subtle.hovered' | 'color.background.accent.teal.subtle.pressed' | 'color.background.accent.teal.bolder' | 'color.background.accent.teal.bolder.hovered' | 'color.background.accent.teal.bolder.pressed' | 'color.background.accent.blue.subtlest' | 'color.background.accent.blue.subtlest.hovered' | 'color.background.accent.blue.subtlest.pressed' | 'color.background.accent.blue.subtler' | 'color.background.accent.blue.subtler.hovered' | 'color.background.accent.blue.subtler.pressed' | 'color.background.accent.blue.subtle' | 'color.background.accent.blue.subtle.hovered' | 'color.background.accent.blue.subtle.pressed' | 'color.background.accent.blue.bolder' | 'color.background.accent.blue.bolder.hovered' | 'color.background.accent.blue.bolder.pressed' | 'color.background.accent.purple.subtlest' | 'color.background.accent.purple.subtlest.hovered' | 'color.background.accent.purple.subtlest.pressed' | 'color.background.accent.purple.subtler' | 'color.background.accent.purple.subtler.hovered' | 'color.background.accent.purple.subtler.pressed' | 'color.background.accent.purple.subtle' | 'color.background.accent.purple.subtle.hovered' | 'color.background.accent.purple.subtle.pressed' | 'color.background.accent.purple.bolder' | 'color.background.accent.purple.bolder.hovered' | 'color.background.accent.purple.bolder.pressed' | 'color.background.accent.magenta.subtlest' | 'color.background.accent.magenta.subtlest.hovered' | 'color.background.accent.magenta.subtlest.pressed' | 'color.background.accent.magenta.subtler' | 'color.background.accent.magenta.subtler.hovered' | 'color.background.accent.magenta.subtler.pressed' | 'color.background.accent.magenta.subtle' | 'color.background.accent.magenta.subtle.hovered' | 'color.background.accent.magenta.subtle.pressed' | 'color.background.accent.magenta.bolder' | 'color.background.accent.magenta.bolder.hovered' | 'color.background.accent.magenta.bolder.pressed' | 'color.background.accent.gray.subtlest' | 'color.background.accent.gray.subtlest.hovered' | 'color.background.accent.gray.subtlest.pressed' | 'color.background.accent.gray.subtler' | 'color.background.accent.gray.subtler.hovered' | 'color.background.accent.gray.subtler.pressed' | 'color.background.accent.gray.subtle' | 'color.background.accent.gray.subtle.hovered' | 'color.background.accent.gray.subtle.pressed' | 'color.background.accent.gray.bolder' | 'color.background.accent.gray.bolder.hovered' | 'color.background.accent.gray.bolder.pressed' | 'color.background.disabled' | 'color.background.input' | 'color.background.input.hovered' | 'color.background.input.pressed' | 'color.background.inverse.subtle' | 'color.background.inverse.subtle.hovered' | 'color.background.inverse.subtle.pressed' | 'color.background.neutral' | 'color.background.neutral.hovered' | 'color.background.neutral.pressed' | 'color.background.neutral.subtle' | 'color.background.neutral.subtle.hovered' | 'color.background.neutral.subtle.pressed' | 'color.background.neutral.bold' | 'color.background.neutral.bold.hovered' | 'color.background.neutral.bold.pressed' | 'color.background.selected' | 'color.background.selected.hovered' | 'color.background.selected.pressed' | 'color.background.selected.bold' | 'color.background.selected.bold.hovered' | 'color.background.selected.bold.pressed' | 'color.background.brand.subtlest' | 'color.background.brand.subtlest.hovered' | 'color.background.brand.subtlest.pressed' | 'color.background.brand.bold' | 'color.background.brand.bold.hovered' | 'color.background.brand.bold.pressed' | 'color.background.brand.boldest' | 'color.background.brand.boldest.hovered' | 'color.background.brand.boldest.pressed' | 'color.background.danger' | 'color.background.danger.hovered' | 'color.background.danger.pressed' | 'color.background.danger.subtler' | 'color.background.danger.subtler.hovered' | 'color.background.danger.subtler.pressed' | 'color.background.danger.bold' | 'color.background.danger.bold.hovered' | 'color.background.danger.bold.pressed' | 'color.background.warning' | 'color.background.warning.hovered' | 'color.background.warning.pressed' | 'color.background.warning.subtler' | 'color.background.warning.subtler.hovered' | 'color.background.warning.subtler.pressed' | 'color.background.warning.bold' | 'color.background.warning.bold.hovered' | 'color.background.warning.bold.pressed' | 'color.background.success' | 'color.background.success.hovered' | 'color.background.success.pressed' | 'color.background.success.subtler' | 'color.background.success.subtler.hovered' | 'color.background.success.subtler.pressed' | 'color.background.success.bold' | 'color.background.success.bold.hovered' | 'color.background.success.bold.pressed' | 'color.background.discovery' | 'color.background.discovery.hovered' | 'color.background.discovery.pressed' | 'color.background.discovery.subtler' | 'color.background.discovery.subtler.hovered' | 'color.background.discovery.subtler.pressed' | 'color.background.discovery.bold' | 'color.background.discovery.bold.hovered' | 'color.background.discovery.bold.pressed' | 'color.background.information' | 'color.background.information.hovered' | 'color.background.information.pressed' | 'color.background.information.subtler' | 'color.background.information.subtler.hovered' | 'color.background.information.subtler.pressed' | 'color.background.information.bold' | 'color.background.information.bold.hovered' | 'color.background.information.bold.pressed' | 'color.blanket' | 'color.blanket.selected' | 'color.blanket.danger' | 'color.skeleton' | 'color.skeleton.subtle' | 'elevation.surface' | 'elevation.surface.hovered' | 'elevation.surface.pressed' | 'elevation.surface.overlay' | 'elevation.surface.overlay.hovered' | 'elevation.surface.overlay.pressed' | 'elevation.surface.raised' | 'elevation.surface.raised.hovered' | 'elevation.surface.raised.pressed' | 'elevation.surface.sunken' | 'utility.elevation.surface.current';
+export type BackgroundColorToken = 'color.background.accent.lime.subtlest' | 'color.background.accent.lime.subtlest.hovered' | 'color.background.accent.lime.subtlest.pressed' | 'color.background.accent.lime.subtler' | 'color.background.accent.lime.subtler.hovered' | 'color.background.accent.lime.subtler.pressed' | 'color.background.accent.lime.subtle' | 'color.background.accent.lime.subtle.hovered' | 'color.background.accent.lime.subtle.pressed' | 'color.background.accent.lime.bolder' | 'color.background.accent.lime.bolder.hovered' | 'color.background.accent.lime.bolder.pressed' | 'color.background.accent.red.subtlest' | 'color.background.accent.red.subtlest.hovered' | 'color.background.accent.red.subtlest.pressed' | 'color.background.accent.red.subtler' | 'color.background.accent.red.subtler.hovered' | 'color.background.accent.red.subtler.pressed' | 'color.background.accent.red.subtle' | 'color.background.accent.red.subtle.hovered' | 'color.background.accent.red.subtle.pressed' | 'color.background.accent.red.bolder' | 'color.background.accent.red.bolder.hovered' | 'color.background.accent.red.bolder.pressed' | 'color.background.accent.orange.subtlest' | 'color.background.accent.orange.subtlest.hovered' | 'color.background.accent.orange.subtlest.pressed' | 'color.background.accent.orange.subtler' | 'color.background.accent.orange.subtler.hovered' | 'color.background.accent.orange.subtler.pressed' | 'color.background.accent.orange.subtle' | 'color.background.accent.orange.subtle.hovered' | 'color.background.accent.orange.subtle.pressed' | 'color.background.accent.orange.bolder' | 'color.background.accent.orange.bolder.hovered' | 'color.background.accent.orange.bolder.pressed' | 'color.background.accent.yellow.subtlest' | 'color.background.accent.yellow.subtlest.hovered' | 'color.background.accent.yellow.subtlest.pressed' | 'color.background.accent.yellow.subtler' | 'color.background.accent.yellow.subtler.hovered' | 'color.background.accent.yellow.subtler.pressed' | 'color.background.accent.yellow.subtle' | 'color.background.accent.yellow.subtle.hovered' | 'color.background.accent.yellow.subtle.pressed' | 'color.background.accent.yellow.bolder' | 'color.background.accent.yellow.bolder.hovered' | 'color.background.accent.yellow.bolder.pressed' | 'color.background.accent.green.subtlest' | 'color.background.accent.green.subtlest.hovered' | 'color.background.accent.green.subtlest.pressed' | 'color.background.accent.green.subtler' | 'color.background.accent.green.subtler.hovered' | 'color.background.accent.green.subtler.pressed' | 'color.background.accent.green.subtle' | 'color.background.accent.green.subtle.hovered' | 'color.background.accent.green.subtle.pressed' | 'color.background.accent.green.bolder' | 'color.background.accent.green.bolder.hovered' | 'color.background.accent.green.bolder.pressed' | 'color.background.accent.teal.subtlest' | 'color.background.accent.teal.subtlest.hovered' | 'color.background.accent.teal.subtlest.pressed' | 'color.background.accent.teal.subtler' | 'color.background.accent.teal.subtler.hovered' | 'color.background.accent.teal.subtler.pressed' | 'color.background.accent.teal.subtle' | 'color.background.accent.teal.subtle.hovered' | 'color.background.accent.teal.subtle.pressed' | 'color.background.accent.teal.bolder' | 'color.background.accent.teal.bolder.hovered' | 'color.background.accent.teal.bolder.pressed' | 'color.background.accent.blue.subtlest' | 'color.background.accent.blue.subtlest.hovered' | 'color.background.accent.blue.subtlest.pressed' | 'color.background.accent.blue.subtler' | 'color.background.accent.blue.subtler.hovered' | 'color.background.accent.blue.subtler.pressed' | 'color.background.accent.blue.subtle' | 'color.background.accent.blue.subtle.hovered' | 'color.background.accent.blue.subtle.pressed' | 'color.background.accent.blue.bolder' | 'color.background.accent.blue.bolder.hovered' | 'color.background.accent.blue.bolder.pressed' | 'color.background.accent.purple.subtlest' | 'color.background.accent.purple.subtlest.hovered' | 'color.background.accent.purple.subtlest.pressed' | 'color.background.accent.purple.subtler' | 'color.background.accent.purple.subtler.hovered' | 'color.background.accent.purple.subtler.pressed' | 'color.background.accent.purple.subtle' | 'color.background.accent.purple.subtle.hovered' | 'color.background.accent.purple.subtle.pressed' | 'color.background.accent.purple.bolder' | 'color.background.accent.purple.bolder.hovered' | 'color.background.accent.purple.bolder.pressed' | 'color.background.accent.magenta.subtlest' | 'color.background.accent.magenta.subtlest.hovered' | 'color.background.accent.magenta.subtlest.pressed' | 'color.background.accent.magenta.subtler' | 'color.background.accent.magenta.subtler.hovered' | 'color.background.accent.magenta.subtler.pressed' | 'color.background.accent.magenta.subtle' | 'color.background.accent.magenta.subtle.hovered' | 'color.background.accent.magenta.subtle.pressed' | 'color.background.accent.magenta.bolder' | 'color.background.accent.magenta.bolder.hovered' | 'color.background.accent.magenta.bolder.pressed' | 'color.background.accent.gray.subtlest' | 'color.background.accent.gray.subtlest.hovered' | 'color.background.accent.gray.subtlest.pressed' | 'color.background.accent.gray.subtler' | 'color.background.accent.gray.subtler.hovered' | 'color.background.accent.gray.subtler.pressed' | 'color.background.accent.gray.subtle' | 'color.background.accent.gray.subtle.hovered' | 'color.background.accent.gray.subtle.pressed' | 'color.background.accent.gray.bolder' | 'color.background.accent.gray.bolder.hovered' | 'color.background.accent.gray.bolder.pressed' | 'color.background.disabled' | 'color.background.input' | 'color.background.input.hovered' | 'color.background.input.pressed' | 'color.background.inverse.subtle' | 'color.background.inverse.subtle.hovered' | 'color.background.inverse.subtle.pressed' | 'color.background.neutral' | 'color.background.neutral.hovered' | 'color.background.neutral.pressed' | 'color.background.neutral.subtle' | 'color.background.neutral.subtle.hovered' | 'color.background.neutral.subtle.pressed' | 'color.background.neutral.bold' | 'color.background.neutral.bold.hovered' | 'color.background.neutral.bold.pressed' | 'color.background.selected' | 'color.background.selected.hovered' | 'color.background.selected.pressed' | 'color.background.selected.bold' | 'color.background.selected.bold.hovered' | 'color.background.selected.bold.pressed' | 'color.background.brand.subtlest' | 'color.background.brand.subtlest.hovered' | 'color.background.brand.subtlest.pressed' | 'color.background.brand.bold' | 'color.background.brand.bold.hovered' | 'color.background.brand.bold.pressed' | 'color.background.brand.boldest' | 'color.background.brand.boldest.hovered' | 'color.background.brand.boldest.pressed' | 'color.background.danger' | 'color.background.danger.hovered' | 'color.background.danger.pressed' | 'color.background.danger.subtler' | 'color.background.danger.subtler.hovered' | 'color.background.danger.subtler.pressed' | 'color.background.danger.subtle' | 'color.background.danger.bold' | 'color.background.danger.bold.hovered' | 'color.background.danger.bold.pressed' | 'color.background.warning' | 'color.background.warning.hovered' | 'color.background.warning.pressed' | 'color.background.warning.subtler' | 'color.background.warning.subtler.hovered' | 'color.background.warning.subtler.pressed' | 'color.background.warning.subtle' | 'color.background.warning.bold' | 'color.background.warning.bold.hovered' | 'color.background.warning.bold.pressed' | 'color.background.success' | 'color.background.success.hovered' | 'color.background.success.pressed' | 'color.background.success.subtler' | 'color.background.success.subtler.hovered' | 'color.background.success.subtler.pressed' | 'color.background.success.subtle' | 'color.background.success.bold' | 'color.background.success.bold.hovered' | 'color.background.success.bold.pressed' | 'color.background.discovery' | 'color.background.discovery.hovered' | 'color.background.discovery.pressed' | 'color.background.discovery.subtler' | 'color.background.discovery.subtler.hovered' | 'color.background.discovery.subtler.pressed' | 'color.background.discovery.subtle' | 'color.background.discovery.bold' | 'color.background.discovery.bold.hovered' | 'color.background.discovery.bold.pressed' | 'color.background.information' | 'color.background.information.hovered' | 'color.background.information.pressed' | 'color.background.information.subtler' | 'color.background.information.subtler.hovered' | 'color.background.information.subtler.pressed' | 'color.background.information.subtle' | 'color.background.information.bold' | 'color.background.information.bold.hovered' | 'color.background.information.bold.pressed' | 'color.blanket' | 'color.blanket.selected' | 'color.blanket.danger' | 'color.skeleton' | 'color.skeleton.subtle' | 'elevation.surface' | 'elevation.surface.hovered' | 'elevation.surface.pressed' | 'elevation.surface.overlay' | 'elevation.surface.overlay.hovered' | 'elevation.surface.overlay.pressed' | 'elevation.surface.raised' | 'elevation.surface.raised.hovered' | 'elevation.surface.raised.pressed' | 'elevation.surface.sunken' | 'utility.elevation.surface.current';

package/dist/types/xcss/style-maps.partial.d.ts

@@ -90,10 +90,10 @@ export type AllSpace = keyof typeof allSpaceMap;
  */
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::cefa2c59e15e6a3749ef38fa86c6adea>>
+ * @codegen <<SignedSource::5181bd08725ac44b53e0ae9f914067c1>>
  * @codegenId inverse-colors
  * @codegenCommand yarn workspace @atlaskit/primitives codegen-styles
- * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::38a7d4716f6999a6bdda9e4fe2bca6a1>>
+ * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::3c254494d015dde7566fc7c46750adf2>>
  */
 export declare const inverseColorMap: {
     'color.background.neutral.bold': 'color.text.inverse';
@@ -129,11 +129,11 @@ export declare const inverseColorMap: {
  */
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::c673d53a0a31524e65f1c7051579eae5>>
+ * @codegen <<SignedSource::54e9dee77c5da7d77db6b6cb20970356>>
  * @codegenId elevation
  * @codegenCommand yarn workspace @atlaskit/primitives codegen-styles
  * @codegenParams ["opacity", "shadow", "surface"]
- * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::38a7d4716f6999a6bdda9e4fe2bca6a1>>
+ * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::3c254494d015dde7566fc7c46750adf2>>
  */
 export declare const opacityMap: {
     'opacity.disabled': 'var(--ds-opacity-disabled)';
@@ -166,24 +166,34 @@ export type SurfaceColor = keyof typeof surfaceColorMap;
  */
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::fa88ed1ec5a817750b0348ca36dbb5f1>>
+ * @codegen <<SignedSource::5fd7f92fbc474ab0beacc4e06dad8fca>>
  * @codegenId colors
  * @codegenCommand yarn workspace @atlaskit/primitives codegen-styles
  * @codegenParams ["border", "background", "text", "fill"]
- * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::38a7d4716f6999a6bdda9e4fe2bca6a1>>
+ * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::3c254494d015dde7566fc7c46750adf2>>
  */
 export declare const borderColorMap: {
     'color.border': 'var(--ds-border)';
     'color.border.accent.lime': 'var(--ds-border-accent-lime)';
+    'color.border.accent.lime.subtle': 'var(--ds-border-accent-lime-subtle)';
     'color.border.accent.red': 'var(--ds-border-accent-red)';
+    'color.border.accent.red.subtle': 'var(--ds-border-accent-red-subtle)';
     'color.border.accent.orange': 'var(--ds-border-accent-orange)';
+    'color.border.accent.orange.subtle': 'var(--ds-border-accent-orange-subtle)';
     'color.border.accent.yellow': 'var(--ds-border-accent-yellow)';
+    'color.border.accent.yellow.subtle': 'var(--ds-border-accent-yellow-subtle)';
     'color.border.accent.green': 'var(--ds-border-accent-green)';
+    'color.border.accent.green.subtle': 'var(--ds-border-accent-green-subtle)';
     'color.border.accent.teal': 'var(--ds-border-accent-teal)';
+    'color.border.accent.teal.subtle': 'var(--ds-border-accent-teal-subtle)';
     'color.border.accent.blue': 'var(--ds-border-accent-blue)';
+    'color.border.accent.blue.subtle': 'var(--ds-border-accent-blue-subtle)';
     'color.border.accent.purple': 'var(--ds-border-accent-purple)';
+    'color.border.accent.purple.subtle': 'var(--ds-border-accent-purple-subtle)';
     'color.border.accent.magenta': 'var(--ds-border-accent-magenta)';
+    'color.border.accent.magenta.subtle': 'var(--ds-border-accent-magenta-subtle)';
     'color.border.accent.gray': 'var(--ds-border-accent-gray)';
+    'color.border.accent.gray.subtle': 'var(--ds-border-accent-gray-subtle)';
     'color.border.disabled': 'var(--ds-border-disabled)';
     'color.border.focused': 'var(--ds-border-focused)';
     'color.border.input': 'var(--ds-border-input)';
@@ -191,10 +201,15 @@ export declare const borderColorMap: {
     'color.border.selected': 'var(--ds-border-selected)';
     'color.border.brand': 'var(--ds-border-brand)';
     'color.border.danger': 'var(--ds-border-danger)';
+    'color.border.danger.subtle': 'var(--ds-border-danger-subtle)';
     'color.border.warning': 'var(--ds-border-warning)';
+    'color.border.warning.subtle': 'var(--ds-border-warning-subtle)';
     'color.border.success': 'var(--ds-border-success)';
+    'color.border.success.subtle': 'var(--ds-border-success-subtle)';
     'color.border.discovery': 'var(--ds-border-discovery)';
+    'color.border.discovery.subtle': 'var(--ds-border-discovery-subtle)';
     'color.border.information': 'var(--ds-border-information)';
+    'color.border.information.subtle': 'var(--ds-border-information-subtle)';
     'color.border.bold': 'var(--ds-border-bold)';
 };
 export type BorderColor = keyof typeof borderColorMap;
@@ -356,6 +371,7 @@ export declare const backgroundColorMap: {
     'color.background.danger.subtler': 'var(--ds-background-danger-subtler)';
     'color.background.danger.subtler.hovered': 'var(--ds-background-danger-subtler-hovered)';
     'color.background.danger.subtler.pressed': 'var(--ds-background-danger-subtler-pressed)';
+    'color.background.danger.subtle': 'var(--ds-background-danger-subtle)';
     'color.background.danger.bold': 'var(--ds-background-danger-bold)';
     'color.background.danger.bold.hovered': 'var(--ds-background-danger-bold-hovered)';
     'color.background.danger.bold.pressed': 'var(--ds-background-danger-bold-pressed)';
@@ -365,6 +381,7 @@ export declare const backgroundColorMap: {
     'color.background.warning.subtler': 'var(--ds-background-warning-subtler)';
     'color.background.warning.subtler.hovered': 'var(--ds-background-warning-subtler-hovered)';
     'color.background.warning.subtler.pressed': 'var(--ds-background-warning-subtler-pressed)';
+    'color.background.warning.subtle': 'var(--ds-background-warning-subtle)';
     'color.background.warning.bold': 'var(--ds-background-warning-bold)';
     'color.background.warning.bold.hovered': 'var(--ds-background-warning-bold-hovered)';
     'color.background.warning.bold.pressed': 'var(--ds-background-warning-bold-pressed)';
@@ -374,6 +391,7 @@ export declare const backgroundColorMap: {
     'color.background.success.subtler': 'var(--ds-background-success-subtler)';
     'color.background.success.subtler.hovered': 'var(--ds-background-success-subtler-hovered)';
     'color.background.success.subtler.pressed': 'var(--ds-background-success-subtler-pressed)';
+    'color.background.success.subtle': 'var(--ds-background-success-subtle)';
     'color.background.success.bold': 'var(--ds-background-success-bold)';
     'color.background.success.bold.hovered': 'var(--ds-background-success-bold-hovered)';
     'color.background.success.bold.pressed': 'var(--ds-background-success-bold-pressed)';
@@ -383,6 +401,7 @@ export declare const backgroundColorMap: {
     'color.background.discovery.subtler': 'var(--ds-background-discovery-subtler)';
     'color.background.discovery.subtler.hovered': 'var(--ds-background-discovery-subtler-hovered)';
     'color.background.discovery.subtler.pressed': 'var(--ds-background-discovery-subtler-pressed)';
+    'color.background.discovery.subtle': 'var(--ds-background-discovery-subtle)';
     'color.background.discovery.bold': 'var(--ds-background-discovery-bold)';
     'color.background.discovery.bold.hovered': 'var(--ds-background-discovery-bold-hovered)';
     'color.background.discovery.bold.pressed': 'var(--ds-background-discovery-bold-pressed)';
@@ -392,6 +411,7 @@ export declare const backgroundColorMap: {
     'color.background.information.subtler': 'var(--ds-background-information-subtler)';
     'color.background.information.subtler.hovered': 'var(--ds-background-information-subtler-hovered)';
     'color.background.information.subtler.pressed': 'var(--ds-background-information-subtler-pressed)';
+    'color.background.information.subtle': 'var(--ds-background-information-subtle)';
     'color.background.information.bold': 'var(--ds-background-information-bold)';
     'color.background.information.bold.hovered': 'var(--ds-background-information-bold-hovered)';
     'color.background.information.bold.pressed': 'var(--ds-background-information-bold-pressed)';