@atlaskit/tokens 0.10.28 → 0.10.30

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (72) hide show
  1. package/CHANGELOG.md +67 -0
  2. package/css/atlassian-dark.css +298 -2
  3. package/css/atlassian-legacy-dark.css +298 -2
  4. package/css/atlassian-legacy-light.css +298 -2
  5. package/css/atlassian-light.css +298 -2
  6. package/css/atlassian-spacing.css +66 -3
  7. package/dist/cjs/artifacts/rename-mapping/atlassian-spacing.js +254 -2
  8. package/dist/cjs/artifacts/tokens-raw/atlassian-spacing.js +1493 -24
  9. package/dist/cjs/artifacts/typescript/atlassian-spacing-token-default-values.js +66 -3
  10. package/dist/cjs/artifacts/typescript/atlassian-spacing-token-names.js +66 -3
  11. package/dist/cjs/constants.js +4 -13
  12. package/dist/cjs/get-token.js +1 -1
  13. package/dist/cjs/index.js +8 -0
  14. package/dist/cjs/set-global-theme.js +30 -4
  15. package/dist/cjs/theme-change-observer.js +3 -2
  16. package/dist/cjs/theme-config.js +95 -0
  17. package/dist/cjs/tokens/atlassian-spacing/spacing.js +218 -5
  18. package/dist/cjs/tokens/default/spacing/spacing.js +612 -11
  19. package/dist/cjs/version.json +1 -1
  20. package/dist/es2019/artifacts/rename-mapping/atlassian-spacing.js +254 -2
  21. package/dist/es2019/artifacts/tokens-raw/atlassian-spacing.js +1493 -24
  22. package/dist/es2019/artifacts/typescript/atlassian-spacing-token-default-values.js +66 -3
  23. package/dist/es2019/artifacts/typescript/atlassian-spacing-token-names.js +66 -3
  24. package/dist/es2019/constants.js +2 -10
  25. package/dist/es2019/get-token.js +1 -1
  26. package/dist/es2019/index.js +1 -0
  27. package/dist/es2019/set-global-theme.js +25 -5
  28. package/dist/es2019/theme-change-observer.js +5 -3
  29. package/dist/es2019/theme-config.js +87 -0
  30. package/dist/es2019/tokens/atlassian-spacing/spacing.js +218 -5
  31. package/dist/es2019/tokens/default/spacing/spacing.js +612 -11
  32. package/dist/es2019/version.json +1 -1
  33. package/dist/esm/artifacts/rename-mapping/atlassian-spacing.js +254 -2
  34. package/dist/esm/artifacts/tokens-raw/atlassian-spacing.js +1493 -24
  35. package/dist/esm/artifacts/typescript/atlassian-spacing-token-default-values.js +66 -3
  36. package/dist/esm/artifacts/typescript/atlassian-spacing-token-names.js +66 -3
  37. package/dist/esm/constants.js +2 -10
  38. package/dist/esm/get-token.js +1 -1
  39. package/dist/esm/index.js +1 -0
  40. package/dist/esm/set-global-theme.js +28 -5
  41. package/dist/esm/theme-change-observer.js +5 -3
  42. package/dist/esm/theme-config.js +87 -0
  43. package/dist/esm/tokens/atlassian-spacing/spacing.js +218 -5
  44. package/dist/esm/tokens/default/spacing/spacing.js +612 -11
  45. package/dist/esm/version.json +1 -1
  46. package/dist/types/artifacts/rename-mapping/atlassian-spacing.d.ts +1 -1
  47. package/dist/types/artifacts/token-default-values.d.ts +64 -1
  48. package/dist/types/artifacts/token-names.d.ts +64 -1
  49. package/dist/types/artifacts/tokens-raw/atlassian-spacing.d.ts +32 -3
  50. package/dist/types/artifacts/typescript/atlassian-spacing-token-default-values.d.ts +65 -2
  51. package/dist/types/artifacts/typescript/atlassian-spacing-token-names.d.ts +129 -3
  52. package/dist/types/constants.d.ts +1 -8
  53. package/dist/types/index.d.ts +2 -1
  54. package/dist/types/set-global-theme.d.ts +2 -2
  55. package/dist/types/theme-change-observer.d.ts +4 -3
  56. package/dist/types/theme-config.d.ts +53 -0
  57. package/dist/types/types.d.ts +104 -6
  58. package/dist/types-ts4.0/artifacts/rename-mapping/atlassian-spacing.d.ts +1 -1
  59. package/dist/types-ts4.0/artifacts/token-default-values.d.ts +64 -1
  60. package/dist/types-ts4.0/artifacts/token-names.d.ts +64 -1
  61. package/dist/types-ts4.0/artifacts/tokens-raw/atlassian-spacing.d.ts +32 -3
  62. package/dist/types-ts4.0/artifacts/typescript/atlassian-spacing-token-default-values.d.ts +65 -2
  63. package/dist/types-ts4.0/artifacts/typescript/atlassian-spacing-token-names.d.ts +129 -3
  64. package/dist/types-ts4.0/constants.d.ts +1 -14
  65. package/dist/types-ts4.0/index.d.ts +2 -1
  66. package/dist/types-ts4.0/set-global-theme.d.ts +2 -2
  67. package/dist/types-ts4.0/theme-change-observer.d.ts +4 -3
  68. package/dist/types-ts4.0/theme-config.d.ts +53 -0
  69. package/dist/types-ts4.0/types.d.ts +104 -6
  70. package/package.json +3 -3
  71. package/report.api.md +180 -17
  72. package/tmp/api-report-tmp.d.ts +164 -10
package/dist/types-ts4.0/set-global-theme.d.ts CHANGED
@@ -1,3 +1,3 @@
1
- import type { Themes } from './types';
2
- declare const setGlobalTheme: (theme: Themes) => void;
1
+ import { ThemeIds } from './theme-config';
2
+ declare const setGlobalTheme: (themeId: ThemeIds, shouldMatchSystem?: boolean) => void;
3
3
  export default setGlobalTheme;
package/dist/types-ts4.0/theme-change-observer.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import { Themes } from './types';
1
+ import { ThemeIds } from './theme-config';
2
2
  /**
3
3
  * A MutationObserver which watches the `<html>` element for changes to the theme.
4
4
  *
@@ -15,7 +15,8 @@ import { Themes } from './types';
15
15
  export declare class ThemeMutationObserver {
16
16
  private callback;
17
17
  observer: MutationObserver | null;
18
- constructor(callback: (theme: Themes | null) => unknown);
18
+ mediaObserver: any;
19
+ constructor(callback: (theme: ThemeIds | null) => unknown);
19
20
  observe(): void;
20
21
  disconnect(): void;
21
22
  }
@@ -32,4 +33,4 @@ export declare class ThemeMutationObserver {
32
33
  * }, [theme]);
33
34
  * ```
34
35
  */
35
- export declare const useThemeObserver: () => Themes | null;
36
+ export declare const useThemeObserver: () => ThemeIds | null;
package/dist/types-ts4.0/theme-config.d.ts ADDED
@@ -0,0 +1,53 @@
1
+ /**
2
+ * This file contains the source of truth for themes and all associated meta data.
3
+ */
4
+ /**
5
+ * Themes: The internal identifier of a theme.
6
+ * These ids are what the actual theme files/folders are called.
7
+ * style-dictionary will attempt to locate these in the file-system.
8
+ */
9
+ export declare type Themes = 'atlassian-light' | 'atlassian-dark' | 'atlassian-legacy-light' | 'atlassian-legacy-dark' | 'atlassian-spacing';
10
+ export declare type ThemeFileNames = Themes;
11
+ /**
12
+ * Theme kinds: The type of theme.
13
+ * Some themes are entirely focused on Color, whilst others are purely focused on spacing.
14
+ * In the future other types may be introduced such as typography.
15
+ */
16
+ export declare type ThemeKinds = 'color' | 'spacing';
17
+ /**
18
+ * Theme modes: The general purpose of a theme.
19
+ * This attr is used to apply the appropriate system-preference media selector
20
+ * It may also be used as a selector for mode-specific overrides such as light/dark images.
21
+ * The idea is there may exist many color themes, but every theme must either fit into light or dark.
22
+ */
23
+ export declare type ThemeColorModes = 'light' | 'dark';
24
+ /**
25
+ * Theme ids: The value that will mounted to the DOM as a data attr
26
+ * For example: `data-theme="light"
27
+ *
28
+ * These ids must be kebab case
29
+ */
30
+ export declare type ThemeIds = 'light' | 'dark' | 'legacy-light' | 'legacy-dark' | 'spacing';
31
+ /**
32
+ * Palettes: The set of base tokens a given theme may be populated with.
33
+ * For example: legacy light & dark themes use the "legacyPalette" containing colors from our
34
+ * previous color set.
35
+ */
36
+ export declare type Palettes = 'defaultPalette' | 'legacyPalette' | 'spacingScale';
37
+ /**
38
+ * ThemeConfig: the source of truth for all theme meta-data.
39
+ * This object should be used whenever interfacing with themes.
40
+ */
41
+ interface ThemeConfig {
42
+ id: ThemeIds;
43
+ displayName: string;
44
+ palette: Palettes;
45
+ attributes: {
46
+ type: 'color';
47
+ mode: ThemeColorModes;
48
+ } | {
49
+ type: 'spacing';
50
+ };
51
+ }
52
+ declare const themeConfig: Record<Themes, ThemeConfig>;
53
+ export default themeConfig;
package/dist/types-ts4.0/types.d.ts CHANGED
@@ -1,5 +1,4 @@
1
1
  import { InternalTokenIds } from './artifacts/types-internal';
2
- import { THEME_NAME_MAP, THEMES } from './constants';
3
2
  export declare type Groups = 'raw' | 'paint' | 'shadow' | 'palette' | 'opacity' | 'spacing' | 'scale';
4
3
  export declare type ActiveTokenState = 'active';
5
4
  export declare type DeprecatedTokenState = 'deprecated';
@@ -10,8 +9,6 @@ export declare type Replacement = InternalTokenIds | InternalTokenIds[];
10
9
  export declare type ExperimentalReplacement = InternalTokenIds | InternalTokenIds[] | string;
11
10
  export declare type PaletteCategory = 'blue' | 'purple' | 'red' | 'magenta' | 'orange' | 'yellow' | 'green' | 'teal' | 'light mode neutral' | 'dark mode neutral';
12
11
  export declare type ValueCategory = 'opacity';
13
- export declare type Themes = typeof THEMES[number];
14
- export declare type ThemesLongName = keyof typeof THEME_NAME_MAP;
15
12
  export interface Token<TValue, Group extends Groups> {
16
13
  value: TValue;
17
14
  attributes: {
@@ -40,6 +37,7 @@ export interface DesignToken<TValue, Group extends Groups> extends Token<TValue,
40
37
  group: Group;
41
38
  description: string;
42
39
  introduced: string;
40
+ suggest?: string[];
43
41
  } | {
44
42
  state: DeprecatedTokenState;
45
43
  group: Group;
@@ -61,6 +59,7 @@ export interface DesignToken<TValue, Group extends Groups> extends Token<TValue,
61
59
  description: string;
62
60
  introduced: string;
63
61
  replacement?: ExperimentalReplacement;
62
+ suggest?: string[];
64
63
  };
65
64
  }
66
65
  declare type OmitDistributive<T, K extends PropertyKey> = T extends any ? T extends object ? Id<DeepOmit<T, K>> : T : never;
@@ -674,9 +673,6 @@ export declare type ColorTokenSchema<BaseToken> = BackgroundColorTokenSchema<Bas
674
673
  export declare type TokenSchema<BaseToken> = ColorTokenSchema<BaseToken> & ElevationTokenSchema<BaseToken>;
675
674
  export interface SpacingTokenSchema<BaseToken> {
676
675
  spacing: {
677
- container: {
678
- gutter: SpacingToken<BaseToken>;
679
- };
680
676
  scale: {
681
677
  '0': SpacingToken<BaseToken>;
682
678
  '025': SpacingToken<BaseToken>;
@@ -691,6 +687,108 @@ export interface SpacingTokenSchema<BaseToken> {
691
687
  '500': SpacingToken<BaseToken>;
692
688
  '600': SpacingToken<BaseToken>;
693
689
  };
690
+ scaleLinear: {
691
+ '0': SpacingToken<BaseToken>;
692
+ '100': SpacingToken<BaseToken>;
693
+ '200': SpacingToken<BaseToken>;
694
+ '300': SpacingToken<BaseToken>;
695
+ '400': SpacingToken<BaseToken>;
696
+ '500': SpacingToken<BaseToken>;
697
+ '600': SpacingToken<BaseToken>;
698
+ '700': SpacingToken<BaseToken>;
699
+ '800': SpacingToken<BaseToken>;
700
+ '900': SpacingToken<BaseToken>;
701
+ '1000': SpacingToken<BaseToken>;
702
+ '1100': SpacingToken<BaseToken>;
703
+ };
704
+ pixel: {
705
+ '0': SpacingToken<BaseToken>;
706
+ '2': SpacingToken<BaseToken>;
707
+ '4': SpacingToken<BaseToken>;
708
+ '6': SpacingToken<BaseToken>;
709
+ '8': SpacingToken<BaseToken>;
710
+ '12': SpacingToken<BaseToken>;
711
+ '16': SpacingToken<BaseToken>;
712
+ '20': SpacingToken<BaseToken>;
713
+ '24': SpacingToken<BaseToken>;
714
+ '32': SpacingToken<BaseToken>;
715
+ '40': SpacingToken<BaseToken>;
716
+ '48': SpacingToken<BaseToken>;
717
+ };
718
+ size: {
719
+ none: SpacingToken<BaseToken>;
720
+ xxxxSmall: SpacingToken<BaseToken>;
721
+ xxxSmall: SpacingToken<BaseToken>;
722
+ xxSmall: SpacingToken<BaseToken>;
723
+ xsmall: SpacingToken<BaseToken>;
724
+ small: SpacingToken<BaseToken>;
725
+ medium: SpacingToken<BaseToken>;
726
+ large: SpacingToken<BaseToken>;
727
+ xlarge: SpacingToken<BaseToken>;
728
+ xxlarge: SpacingToken<BaseToken>;
729
+ xxxlarge: SpacingToken<BaseToken>;
730
+ xxxxlarge: SpacingToken<BaseToken>;
731
+ };
732
+ ecl: {
733
+ element: {
734
+ '2': SpacingToken<BaseToken>;
735
+ '4': SpacingToken<BaseToken>;
736
+ '6': SpacingToken<BaseToken>;
737
+ '8': SpacingToken<BaseToken>;
738
+ };
739
+ container: {
740
+ '12': SpacingToken<BaseToken>;
741
+ '16': SpacingToken<BaseToken>;
742
+ '20': SpacingToken<BaseToken>;
743
+ '24': SpacingToken<BaseToken>;
744
+ };
745
+ layout: {
746
+ '32': SpacingToken<BaseToken>;
747
+ '40': SpacingToken<BaseToken>;
748
+ '64': SpacingToken<BaseToken>;
749
+ };
750
+ };
751
+ ccc: {
752
+ component: {
753
+ '2': SpacingToken<BaseToken>;
754
+ '4': SpacingToken<BaseToken>;
755
+ '6': SpacingToken<BaseToken>;
756
+ '8': SpacingToken<BaseToken>;
757
+ };
758
+ content: {
759
+ '12': SpacingToken<BaseToken>;
760
+ '16': SpacingToken<BaseToken>;
761
+ '20': SpacingToken<BaseToken>;
762
+ '24': SpacingToken<BaseToken>;
763
+ };
764
+ container: {
765
+ '32': SpacingToken<BaseToken>;
766
+ '40': SpacingToken<BaseToken>;
767
+ '48': SpacingToken<BaseToken>;
768
+ };
769
+ };
770
+ gap: {
771
+ 100: {
772
+ value: 'Space100';
773
+ };
774
+ 200: {
775
+ value: 'Space200';
776
+ };
777
+ 300: {
778
+ value: 'Space300';
779
+ };
780
+ };
781
+ inset: {
782
+ 100: {
783
+ value: 'Space100';
784
+ };
785
+ 200: {
786
+ value: 'Space200';
787
+ };
788
+ 300: {
789
+ value: 'Space300';
790
+ };
791
+ };
694
792
  };
695
793
  }
696
794
  export {};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/tokens",
3
- "version": "0.10.28",
3
+ "version": "0.10.30",
4
4
  "author": "Atlassian Pty Ltd",
5
5
  "description": "Design tokens are the single source of truth to name and store design decisions.",
6
6
  "license": "Apache-2.0",
@@ -8,12 +8,12 @@
8
8
  "registry": "https://registry.npmjs.org/"
9
9
  },
10
10
  "atlassian": {
11
+ "disableProductCI": true,
11
12
  "team": "Design System Team",
12
13
  "releaseModel": "continuous",
13
14
  "website": {
14
15
  "name": "Design tokens",
15
- "category": "Libraries",
16
- "draft": true
16
+ "category": "Libraries"
17
17
  }
18
18
  },
19
19
  "repository": "https://bitbucket.org/atlassian/atlassian-frontend-mirror",
package/report.api.md CHANGED
@@ -1,4 +1,4 @@
1
- <!-- API Report Version: 2.2 -->
1
+ <!-- API Report Version: 2.3 -->
2
2
 
3
3
  ## API Report File for "@atlaskit/tokens"
4
4
 
@@ -317,7 +317,6 @@ type CSSTokenMap_2 = {
317
317
 
318
318
  // @public (undocumented)
319
319
  type CSSTokenMap_3 = {
320
- 'spacing.container.gutter': 'var(--ds-container-gutter)';
321
320
  'spacing.scale.0': 'var(--ds-scale-0)';
322
321
  'spacing.scale.100': 'var(--ds-scale-100)';
323
322
  'spacing.scale.150': 'var(--ds-scale-150)';
@@ -330,33 +329,134 @@ type CSSTokenMap_3 = {
330
329
  'spacing.scale.025': 'var(--ds-scale-025)';
331
330
  'spacing.scale.050': 'var(--ds-scale-050)';
332
331
  'spacing.scale.075': 'var(--ds-scale-075)';
332
+ 'spacing.scaleLinear.0': 'var(--ds-scaleLinear-0)';
333
+ 'spacing.scaleLinear.100': 'var(--ds-scaleLinear-100)';
334
+ 'spacing.scaleLinear.200': 'var(--ds-scaleLinear-200)';
335
+ 'spacing.scaleLinear.300': 'var(--ds-scaleLinear-300)';
336
+ 'spacing.scaleLinear.400': 'var(--ds-scaleLinear-400)';
337
+ 'spacing.scaleLinear.500': 'var(--ds-scaleLinear-500)';
338
+ 'spacing.scaleLinear.600': 'var(--ds-scaleLinear-600)';
339
+ 'spacing.scaleLinear.700': 'var(--ds-scaleLinear-700)';
340
+ 'spacing.scaleLinear.800': 'var(--ds-scaleLinear-800)';
341
+ 'spacing.scaleLinear.900': 'var(--ds-scaleLinear-900)';
342
+ 'spacing.scaleLinear.1000': 'var(--ds-scaleLinear-1000)';
343
+ 'spacing.scaleLinear.1100': 'var(--ds-scaleLinear-1100)';
344
+ 'spacing.pixel.0': 'var(--ds-pixel-0)';
345
+ 'spacing.pixel.2': 'var(--ds-pixel-2)';
346
+ 'spacing.pixel.4': 'var(--ds-pixel-4)';
347
+ 'spacing.pixel.6': 'var(--ds-pixel-6)';
348
+ 'spacing.pixel.8': 'var(--ds-pixel-8)';
349
+ 'spacing.pixel.12': 'var(--ds-pixel-12)';
350
+ 'spacing.pixel.16': 'var(--ds-pixel-16)';
351
+ 'spacing.pixel.20': 'var(--ds-pixel-20)';
352
+ 'spacing.pixel.24': 'var(--ds-pixel-24)';
353
+ 'spacing.pixel.32': 'var(--ds-pixel-32)';
354
+ 'spacing.pixel.40': 'var(--ds-pixel-40)';
355
+ 'spacing.pixel.48': 'var(--ds-pixel-48)';
356
+ 'spacing.size.none': 'var(--ds-size-none)';
357
+ 'spacing.size.xxxxSmall': 'var(--ds-size-xxxxSmall)';
358
+ 'spacing.size.xxxSmall': 'var(--ds-size-xxxSmall)';
359
+ 'spacing.size.xxSmall': 'var(--ds-size-xxSmall)';
360
+ 'spacing.size.xsmall': 'var(--ds-size-xsmall)';
361
+ 'spacing.size.small': 'var(--ds-size-small)';
362
+ 'spacing.size.medium': 'var(--ds-size-medium)';
363
+ 'spacing.size.large': 'var(--ds-size-large)';
364
+ 'spacing.size.xlarge': 'var(--ds-size-xlarge)';
365
+ 'spacing.size.xxlarge': 'var(--ds-size-xxlarge)';
366
+ 'spacing.size.xxxlarge': 'var(--ds-size-xxxlarge)';
367
+ 'spacing.size.xxxxlarge': 'var(--ds-size-xxxxlarge)';
368
+ 'spacing.ecl.element.2': 'var(--ds-ecl-element-2)';
369
+ 'spacing.ecl.element.4': 'var(--ds-ecl-element-4)';
370
+ 'spacing.ecl.element.6': 'var(--ds-ecl-element-6)';
371
+ 'spacing.ecl.element.8': 'var(--ds-ecl-element-8)';
372
+ 'spacing.ecl.container.12': 'var(--ds-ecl-container-12)';
373
+ 'spacing.ecl.container.16': 'var(--ds-ecl-container-16)';
374
+ 'spacing.ecl.container.20': 'var(--ds-ecl-container-20)';
375
+ 'spacing.ecl.container.24': 'var(--ds-ecl-container-24)';
376
+ 'spacing.ecl.layout.32': 'var(--ds-ecl-layout-32)';
377
+ 'spacing.ecl.layout.40': 'var(--ds-ecl-layout-40)';
378
+ 'spacing.ecl.layout.64': 'var(--ds-ecl-layout-64)';
379
+ 'spacing.ccc.component.2': 'var(--ds-ccc-component-2)';
380
+ 'spacing.ccc.component.4': 'var(--ds-ccc-component-4)';
381
+ 'spacing.ccc.component.6': 'var(--ds-ccc-component-6)';
382
+ 'spacing.ccc.component.8': 'var(--ds-ccc-component-8)';
383
+ 'spacing.ccc.content.12': 'var(--ds-ccc-content-12)';
384
+ 'spacing.ccc.content.16': 'var(--ds-ccc-content-16)';
385
+ 'spacing.ccc.content.20': 'var(--ds-ccc-content-20)';
386
+ 'spacing.ccc.content.24': 'var(--ds-ccc-content-24)';
387
+ 'spacing.ccc.container.32': 'var(--ds-ccc-container-32)';
388
+ 'spacing.ccc.container.40': 'var(--ds-ccc-container-40)';
389
+ 'spacing.ccc.container.48': 'var(--ds-ccc-container-48)';
390
+ 'spacing.gap.100': 'var(--ds-gap-100)';
391
+ 'spacing.gap.200': 'var(--ds-gap-200)';
392
+ 'spacing.gap.300': 'var(--ds-gap-300)';
393
+ 'spacing.inset.100': 'var(--ds-inset-100)';
394
+ 'spacing.inset.200': 'var(--ds-inset-200)';
395
+ 'spacing.inset.300': 'var(--ds-inset-300)';
333
396
  };
334
397
 
398
+ // @public
399
+ type Palettes = 'defaultPalette' | 'legacyPalette' | 'spacingScale';
400
+
401
+ // @public (undocumented)
402
+ export const setGlobalTheme: (
403
+ themeId: ThemeIds,
404
+ shouldMatchSystem?: boolean,
405
+ ) => void;
406
+
407
+ // @public
408
+ type ThemeColorModes = 'dark' | 'light';
409
+
410
+ // @public
411
+ interface ThemeConfig {
412
+ // (undocumented)
413
+ attributes:
414
+ | {
415
+ type: 'color';
416
+ mode: ThemeColorModes;
417
+ }
418
+ | {
419
+ type: 'spacing';
420
+ };
421
+ // (undocumented)
422
+ displayName: string;
423
+ // (undocumented)
424
+ id: ThemeIds;
425
+ // (undocumented)
426
+ palette: Palettes;
427
+ }
428
+
335
429
  // @public (undocumented)
336
- export const setGlobalTheme: (theme: Themes) => void;
430
+ export const themeConfig: Record<Themes, ThemeConfig>;
431
+
432
+ // @public
433
+ export type ThemeIds =
434
+ | 'dark'
435
+ | 'legacy-dark'
436
+ | 'legacy-light'
437
+ | 'light'
438
+ | 'spacing';
337
439
 
338
440
  // @public
339
441
  export class ThemeMutationObserver {
340
- constructor(callback: (theme: Themes | null) => unknown);
442
+ constructor(callback: (theme: ThemeIds | null) => unknown);
341
443
  // (undocumented)
342
444
  disconnect(): void;
343
445
  // (undocumented)
446
+ mediaObserver: any;
447
+ // (undocumented)
344
448
  observe(): void;
345
449
  // (undocumented)
346
450
  observer: MutationObserver | null;
347
451
  }
348
452
 
349
- // @public (undocumented)
350
- const THEMES: readonly [
351
- 'light',
352
- 'dark',
353
- 'legacy-light',
354
- 'legacy-dark',
355
- 'spacing',
356
- ];
357
-
358
- // @public (undocumented)
359
- export type Themes = typeof THEMES[number];
453
+ // @public
454
+ export type Themes =
455
+ | 'atlassian-dark'
456
+ | 'atlassian-legacy-dark'
457
+ | 'atlassian-legacy-light'
458
+ | 'atlassian-light'
459
+ | 'atlassian-spacing';
360
460
 
361
461
  // @public (undocumented)
362
462
  export function token<T extends keyof Tokens>(
@@ -369,7 +469,6 @@ type Tokens = typeof tokens;
369
469
 
370
470
  // @public (undocumented)
371
471
  const tokens: {
372
- readonly 'spacing.container.gutter': '--ds-container-gutter';
373
472
  readonly 'spacing.scale.0': '--ds-scale-0';
374
473
  readonly 'spacing.scale.100': '--ds-scale-100';
375
474
  readonly 'spacing.scale.150': '--ds-scale-150';
@@ -382,6 +481,70 @@ const tokens: {
382
481
  readonly 'spacing.scale.025': '--ds-scale-025';
383
482
  readonly 'spacing.scale.050': '--ds-scale-050';
384
483
  readonly 'spacing.scale.075': '--ds-scale-075';
484
+ readonly 'spacing.scaleLinear.0': '--ds-scaleLinear-0';
485
+ readonly 'spacing.scaleLinear.100': '--ds-scaleLinear-100';
486
+ readonly 'spacing.scaleLinear.200': '--ds-scaleLinear-200';
487
+ readonly 'spacing.scaleLinear.300': '--ds-scaleLinear-300';
488
+ readonly 'spacing.scaleLinear.400': '--ds-scaleLinear-400';
489
+ readonly 'spacing.scaleLinear.500': '--ds-scaleLinear-500';
490
+ readonly 'spacing.scaleLinear.600': '--ds-scaleLinear-600';
491
+ readonly 'spacing.scaleLinear.700': '--ds-scaleLinear-700';
492
+ readonly 'spacing.scaleLinear.800': '--ds-scaleLinear-800';
493
+ readonly 'spacing.scaleLinear.900': '--ds-scaleLinear-900';
494
+ readonly 'spacing.scaleLinear.1000': '--ds-scaleLinear-1000';
495
+ readonly 'spacing.scaleLinear.1100': '--ds-scaleLinear-1100';
496
+ readonly 'spacing.pixel.0': '--ds-pixel-0';
497
+ readonly 'spacing.pixel.2': '--ds-pixel-2';
498
+ readonly 'spacing.pixel.4': '--ds-pixel-4';
499
+ readonly 'spacing.pixel.6': '--ds-pixel-6';
500
+ readonly 'spacing.pixel.8': '--ds-pixel-8';
501
+ readonly 'spacing.pixel.12': '--ds-pixel-12';
502
+ readonly 'spacing.pixel.16': '--ds-pixel-16';
503
+ readonly 'spacing.pixel.20': '--ds-pixel-20';
504
+ readonly 'spacing.pixel.24': '--ds-pixel-24';
505
+ readonly 'spacing.pixel.32': '--ds-pixel-32';
506
+ readonly 'spacing.pixel.40': '--ds-pixel-40';
507
+ readonly 'spacing.pixel.48': '--ds-pixel-48';
508
+ readonly 'spacing.size.none': '--ds-size-none';
509
+ readonly 'spacing.size.xxxxSmall': '--ds-size-xxxxSmall';
510
+ readonly 'spacing.size.xxxSmall': '--ds-size-xxxSmall';
511
+ readonly 'spacing.size.xxSmall': '--ds-size-xxSmall';
512
+ readonly 'spacing.size.xsmall': '--ds-size-xsmall';
513
+ readonly 'spacing.size.small': '--ds-size-small';
514
+ readonly 'spacing.size.medium': '--ds-size-medium';
515
+ readonly 'spacing.size.large': '--ds-size-large';
516
+ readonly 'spacing.size.xlarge': '--ds-size-xlarge';
517
+ readonly 'spacing.size.xxlarge': '--ds-size-xxlarge';
518
+ readonly 'spacing.size.xxxlarge': '--ds-size-xxxlarge';
519
+ readonly 'spacing.size.xxxxlarge': '--ds-size-xxxxlarge';
520
+ readonly 'spacing.ecl.element.2': '--ds-ecl-element-2';
521
+ readonly 'spacing.ecl.element.4': '--ds-ecl-element-4';
522
+ readonly 'spacing.ecl.element.6': '--ds-ecl-element-6';
523
+ readonly 'spacing.ecl.element.8': '--ds-ecl-element-8';
524
+ readonly 'spacing.ecl.container.12': '--ds-ecl-container-12';
525
+ readonly 'spacing.ecl.container.16': '--ds-ecl-container-16';
526
+ readonly 'spacing.ecl.container.20': '--ds-ecl-container-20';
527
+ readonly 'spacing.ecl.container.24': '--ds-ecl-container-24';
528
+ readonly 'spacing.ecl.layout.32': '--ds-ecl-layout-32';
529
+ readonly 'spacing.ecl.layout.40': '--ds-ecl-layout-40';
530
+ readonly 'spacing.ecl.layout.64': '--ds-ecl-layout-64';
531
+ readonly 'spacing.ccc.component.2': '--ds-ccc-component-2';
532
+ readonly 'spacing.ccc.component.4': '--ds-ccc-component-4';
533
+ readonly 'spacing.ccc.component.6': '--ds-ccc-component-6';
534
+ readonly 'spacing.ccc.component.8': '--ds-ccc-component-8';
535
+ readonly 'spacing.ccc.content.12': '--ds-ccc-content-12';
536
+ readonly 'spacing.ccc.content.16': '--ds-ccc-content-16';
537
+ readonly 'spacing.ccc.content.20': '--ds-ccc-content-20';
538
+ readonly 'spacing.ccc.content.24': '--ds-ccc-content-24';
539
+ readonly 'spacing.ccc.container.32': '--ds-ccc-container-32';
540
+ readonly 'spacing.ccc.container.40': '--ds-ccc-container-40';
541
+ readonly 'spacing.ccc.container.48': '--ds-ccc-container-48';
542
+ readonly 'spacing.gap.100': '--ds-gap-100';
543
+ readonly 'spacing.gap.200': '--ds-gap-200';
544
+ readonly 'spacing.gap.300': '--ds-gap-300';
545
+ readonly 'spacing.inset.100': '--ds-inset-100';
546
+ readonly 'spacing.inset.200': '--ds-inset-200';
547
+ readonly 'spacing.inset.300': '--ds-inset-300';
385
548
  readonly 'color.text.accent.blue': '--ds-text-accent-blue';
386
549
  readonly 'color.text.accent.blue.bolder': '--ds-text-accent-blue-bolder';
387
550
  readonly 'color.text.accent.red': '--ds-text-accent-red';
@@ -676,7 +839,7 @@ const tokens: {
676
839
  };
677
840
 
678
841
  // @public
679
- export const useThemeObserver: () => Themes | null;
842
+ export const useThemeObserver: () => ThemeIds | null;
680
843
 
681
844
  // (No @packageDocumentation comment for this package)
682
845
  ```