@atlaskit/tokens 1.26.1 → 1.28.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/tokens",
-  "version": "1.26.1",
+  "version": "1.28.0",
   "description": "Design tokens are the single source of truth to name and store design decisions.",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -113,9 +113,6 @@
     "platform.design-system-team.border-checkbox_nyoiu": {
       "type": "boolean"
     },
-    "platform.design-system-team.saturated-palette-changes_asoro": {
-      "type": "boolean"
-    },
     "platform.design-system-team.increased-contrast-themes": {
       "type": "boolean"
     }

package/report.api.md

@@ -1038,7 +1038,7 @@ type ExtensionThemeId = ThemeIds;
 type FlattenKeys<T, Prefix extends string = ''> = {
   [Key in keyof T]: T[Key] extends object
     ? T[Key] extends {
-        value: string;
+        value: any;
       }
       ? `${Prefix}${Key & string}`
       : `${Prefix}${Key & string}.${FlattenKeys<T[Key]>}`
@@ -1574,8 +1574,7 @@ type Palettes =
   | 'legacyPalette'
   | 'shapePalette'
   | 'spacingScale'
-  | 'typographyPalette'
-  | 'updatedSaturatedPalette';
+  | 'typographyPalette';
 
 // @public (undocumented)
 export type RawToken = DesignToken<string, 'raw'>;
@@ -1583,6 +1582,9 @@ export type RawToken = DesignToken<string, 'raw'>;
 // @public (undocumented)
 type Replacement = InternalTokenIds | InternalTokenIds[];
 
+// @public (undocumented)
+type ResponsiveTypographyTokens = FlattenKeys<TypographyTokenSchema<any>>;
+
 // @public
 export const setGlobalTheme: (
   {
@@ -1698,8 +1700,6 @@ const themeIdsWithOverrides: readonly [
   'typography-minor3',
   'light-new-input-border',
   'dark-new-input-border',
-  'light-saturated-palette-changes',
-  'dark-saturated-palette-changes',
 ];
 
 // @public
@@ -1734,16 +1734,12 @@ type ThemeOverrideIds = (typeof themeOverrideIds)[number];
 const themeOverrideIds: readonly [
   'light-new-input-border',
   'dark-new-input-border',
-  'light-saturated-palette-changes',
-  'dark-saturated-palette-changes',
 ];
 
 // @public
 type ThemeOverrides =
   | 'atlassian-dark-new-input-border'
-  | 'atlassian-dark-saturated-palette-changes'
-  | 'atlassian-light-new-input-border'
-  | 'atlassian-light-saturated-palette-changes';
+  | 'atlassian-light-new-input-border';
 
 // @public
 export type Themes =
@@ -2313,6 +2309,15 @@ type TokenState =
   | DeprecatedTokenState
   | ExperimentalTokenState;
 
+// @public (undocumented)
+interface TypographyDesignToken<TValue>
+  extends DesignToken<TValue, 'typography'> {
+  // (undocumented)
+  attributes: DesignToken<TValue, 'typography'>['attributes'] & {
+    responsiveSmallerVariant?: ResponsiveTypographyTokens;
+  };
+}
+
 // @public
 export type TypographyToken<
   TPalette extends {
@@ -2321,18 +2326,52 @@ export type TypographyToken<
     lineHeight: string;
     fontFamily: string;
     letterSpacing: string;
+    responsiveToken?: string;
   },
-> = DesignToken<
-  {
-    fontStyle: 'normal';
-    fontWeight: TPalette['fontWeight'];
-    fontFamily: FlattenKeys<FontFamilyTokenSchema<any>>;
-    fontSize: TPalette['fontSize'];
-    lineHeight: TPalette['lineHeight'];
-    letterSpacing: TPalette['letterSpacing'];
+> = TypographyDesignToken<{
+  fontStyle: 'normal';
+  fontWeight: TPalette['fontWeight'];
+  fontFamily: FlattenKeys<FontFamilyTokenSchema<any>>;
+  fontSize: TPalette['fontSize'];
+  lineHeight: TPalette['lineHeight'];
+  letterSpacing: TPalette['letterSpacing'];
+}>;
+
+// @public
+interface TypographyTokenSchema<
+  TPalette extends {
+    fontWeight: string;
+    fontSize: string;
+    lineHeight: string;
+    fontFamily: string;
+    letterSpacing: string;
   },
-  'typography'
->;
+> {
+  // (undocumented)
+  font: {
+    heading: {
+      xxlarge: TypographyToken<TPalette>;
+      xlarge: TypographyToken<TPalette>;
+      large: TypographyToken<TPalette>;
+      medium: TypographyToken<TPalette>;
+      small: TypographyToken<TPalette>;
+      xsmall: TypographyToken<TPalette>;
+      xxsmall: TypographyToken<TPalette>;
+    };
+    ui: {
+      '[default]': TypographyToken<TPalette>;
+      small: TypographyToken<TPalette>;
+    };
+    body: {
+      '[default]': TypographyToken<TPalette>;
+      small: TypographyToken<TPalette>;
+      large: TypographyToken<TPalette>;
+    };
+    code: {
+      '[default]': TypographyToken<TPalette>;
+    };
+  };
+}
 
 // @public
 export const useThemeObserver: () => Partial<ActiveThemeState>;

package/tmp/api-report-tmp.d.ts

@@ -558,7 +558,7 @@ type ExtensionThemeId = ThemeIds;
 // @public (undocumented)
 type FlattenKeys<T, Prefix extends string = ''> = {
     [Key in keyof T]: T[Key] extends object ? T[Key] extends {
-        value: string;
+        value: any;
     } ? `${Prefix}${Key & string}` : `${Prefix}${Key & string}.${FlattenKeys<T[Key]>}` : `${Prefix}.${Key & string}`;
 }[keyof T];
 
@@ -608,7 +608,7 @@ export type OpacityToken = DesignToken<string, 'opacity'>;
 export type PaintToken<BaseToken> = DesignToken<BaseToken, 'paint'>;
 
 // @public
-type Palettes = 'defaultPalette' | 'legacyPalette' | 'shapePalette' | 'spacingScale' | 'typographyPalette' | 'updatedSaturatedPalette';
+type Palettes = 'defaultPalette' | 'legacyPalette' | 'shapePalette' | 'spacingScale' | 'typographyPalette';
 
 // @public (undocumented)
 export type RawToken = DesignToken<string, 'raw'>;
@@ -616,6 +616,9 @@ export type RawToken = DesignToken<string, 'raw'>;
 // @public (undocumented)
 type Replacement = InternalTokenIds | InternalTokenIds[];
 
+// @public (undocumented)
+type ResponsiveTypographyTokens = FlattenKeys<TypographyTokenSchema<any>>;
+
 // @public
 export const setGlobalTheme: ({ colorMode, contrastMode, dark, light, shape, spacing, typography, UNSAFE_themeOptions, }?: Partial<ThemeState>, themeLoader?: ((id: ThemeIdsWithOverrides) => Promise<void> | void) | undefined) => Promise<UnbindFn>;
 
@@ -685,7 +688,7 @@ const themeIds: readonly ["light-increased-contrast", "light", "dark", "dark-inc
 type ThemeIdsWithOverrides = (typeof themeIdsWithOverrides)[number];
 
 // @public (undocumented)
-const themeIdsWithOverrides: readonly ["light-increased-contrast", "light", "dark", "dark-increased-contrast", "legacy-light", "legacy-dark", "spacing", "typography", "shape", "typography-adg3", "typography-minor3", "light-new-input-border", "dark-new-input-border", "light-saturated-palette-changes", "dark-saturated-palette-changes"];
+const themeIdsWithOverrides: readonly ["light-increased-contrast", "light", "dark", "dark-increased-contrast", "legacy-light", "legacy-dark", "spacing", "typography", "shape", "typography-adg3", "typography-minor3", "light-new-input-border", "dark-new-input-border"];
 
 // @public
 type ThemeKinds = 'color' | 'shape' | 'spacing' | 'typography';
@@ -716,10 +719,10 @@ export interface ThemeOptionsSchema {
 type ThemeOverrideIds = (typeof themeOverrideIds)[number];
 
 // @public
-const themeOverrideIds: readonly ["light-new-input-border", "dark-new-input-border", "light-saturated-palette-changes", "dark-saturated-palette-changes"];
+const themeOverrideIds: readonly ["light-new-input-border", "dark-new-input-border"];
 
 // @public
-type ThemeOverrides = 'atlassian-dark-new-input-border' | 'atlassian-dark-saturated-palette-changes' | 'atlassian-light-new-input-border' | 'atlassian-light-saturated-palette-changes';
+type ThemeOverrides = 'atlassian-dark-new-input-border' | 'atlassian-light-new-input-border';
 
 // @public
 export type Themes = 'atlassian-dark' | 'atlassian-dark-increased-contrast' | 'atlassian-legacy-dark' | 'atlassian-legacy-light' | 'atlassian-light' | 'atlassian-light-increased-contrast' | 'atlassian-shape' | 'atlassian-spacing' | 'atlassian-typography' | 'atlassian-typography-adg3' | 'atlassian-typography-minor3';
@@ -1252,6 +1255,14 @@ type Tokens_2 = typeof tokens;
 // @public (undocumented)
 type TokenState = ActiveTokenState | DeletedTokenState | DeprecatedTokenState | ExperimentalTokenState;
 
+// @public (undocumented)
+interface TypographyDesignToken<TValue> extends DesignToken<TValue, 'typography'> {
+    // (undocumented)
+    attributes: DesignToken<TValue, 'typography'>['attributes'] & {
+        responsiveSmallerVariant?: ResponsiveTypographyTokens;
+    };
+}
+
 // @public
 export type TypographyToken<TPalette extends {
     fontWeight: string;
@@ -1259,14 +1270,49 @@ export type TypographyToken<TPalette extends {
     lineHeight: string;
     fontFamily: string;
     letterSpacing: string;
-}> = DesignToken<{
+    responsiveToken?: string;
+}> = TypographyDesignToken<{
     fontStyle: 'normal';
     fontWeight: TPalette['fontWeight'];
     fontFamily: FlattenKeys<FontFamilyTokenSchema<any>>;
     fontSize: TPalette['fontSize'];
     lineHeight: TPalette['lineHeight'];
     letterSpacing: TPalette['letterSpacing'];
-}, 'typography'>;
+}>;
+
+// @public
+interface TypographyTokenSchema<TPalette extends {
+    fontWeight: string;
+    fontSize: string;
+    lineHeight: string;
+    fontFamily: string;
+    letterSpacing: string;
+}> {
+    // (undocumented)
+    font: {
+        heading: {
+            xxlarge: TypographyToken<TPalette>;
+            xlarge: TypographyToken<TPalette>;
+            large: TypographyToken<TPalette>;
+            medium: TypographyToken<TPalette>;
+            small: TypographyToken<TPalette>;
+            xsmall: TypographyToken<TPalette>;
+            xxsmall: TypographyToken<TPalette>;
+        };
+        ui: {
+            '[default]': TypographyToken<TPalette>;
+            small: TypographyToken<TPalette>;
+        };
+        body: {
+            '[default]': TypographyToken<TPalette>;
+            small: TypographyToken<TPalette>;
+            large: TypographyToken<TPalette>;
+        };
+        code: {
+            '[default]': TypographyToken<TPalette>;
+        };
+    };
+}
 
 // @public
 export const useThemeObserver: () => Partial<ActiveThemeState>;