@atlaskit/tokens 8.6.1 → 9.1.0

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 (8) hide show
  1. package/CHANGELOG.md +16 -0
  2. package/dist/types/entry-points/css-type-schema.codegen.d.ts +2 -2
  3. package/dist/types/index.d.ts +1 -1
  4. package/dist/types/theme-config.d.ts +1 -1
  5. package/dist/types-ts4.5/entry-points/css-type-schema.codegen.d.ts +2 -2
  6. package/dist/types-ts4.5/index.d.ts +1 -1
  7. package/dist/types-ts4.5/theme-config.d.ts +1 -1
  8. package/package.json +12 -13
package/CHANGELOG.md CHANGED
@@ -1,5 +1,21 @@
1
1
  # @atlaskit/tokens
2
2
 
3
+ ## 9.1.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [`018bda95d97eb`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/018bda95d97eb) -
8
+ Added new export for ThemeContrastModes
9
+
10
+ ## 9.0.0
11
+
12
+ ### Major Changes
13
+
14
+ - [`55546332d4ef4`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/55546332d4ef4) -
15
+ Restricted `borderRadius` xcss and cssMap types to only accept tokens, 0, and "inherit".
16
+ Restricted `borderWidth` types to only accept tokens and 0. Previously any string was allowed,
17
+ this is no longer the case and will throw a type error.
18
+
3
19
  ## 8.6.1
4
20
 
5
21
  ### Patch Changes
package/dist/types/entry-points/css-type-schema.codegen.d.ts CHANGED
@@ -3,7 +3,7 @@
3
3
  *
4
4
  * Strict design token based typedef representing a subset of safe CSS properties.
5
5
  *
6
- * @codegen <<SignedSource::9505f10fa9d06df6b3fd52a4916db1d2>>
6
+ * @codegen <<SignedSource::1a2d573fb8c14220f04597b1b0376420>>
7
7
  * @codegenCommand yarn build tokens
8
8
  */
9
9
  export type BackgroundColorHovered = 'var(--ds-background-accent-lime-subtlest-hovered)' | 'var(--ds-background-accent-lime-subtler-hovered)' | 'var(--ds-background-accent-lime-subtle-hovered)' | 'var(--ds-background-accent-lime-bolder-hovered)' | 'var(--ds-background-accent-red-subtlest-hovered)' | 'var(--ds-background-accent-red-subtler-hovered)' | 'var(--ds-background-accent-red-subtle-hovered)' | 'var(--ds-background-accent-red-bolder-hovered)' | 'var(--ds-background-accent-orange-subtlest-hovered)' | 'var(--ds-background-accent-orange-subtler-hovered)' | 'var(--ds-background-accent-orange-subtle-hovered)' | 'var(--ds-background-accent-orange-bolder-hovered)' | 'var(--ds-background-accent-yellow-subtlest-hovered)' | 'var(--ds-background-accent-yellow-subtler-hovered)' | 'var(--ds-background-accent-yellow-subtle-hovered)' | 'var(--ds-background-accent-yellow-bolder-hovered)' | 'var(--ds-background-accent-green-subtlest-hovered)' | 'var(--ds-background-accent-green-subtler-hovered)' | 'var(--ds-background-accent-green-subtle-hovered)' | 'var(--ds-background-accent-green-bolder-hovered)' | 'var(--ds-background-accent-teal-subtlest-hovered)' | 'var(--ds-background-accent-teal-subtler-hovered)' | 'var(--ds-background-accent-teal-subtle-hovered)' | 'var(--ds-background-accent-teal-bolder-hovered)' | 'var(--ds-background-accent-blue-subtlest-hovered)' | 'var(--ds-background-accent-blue-subtler-hovered)' | 'var(--ds-background-accent-blue-subtle-hovered)' | 'var(--ds-background-accent-blue-bolder-hovered)' | 'var(--ds-background-accent-purple-subtlest-hovered)' | 'var(--ds-background-accent-purple-subtler-hovered)' | 'var(--ds-background-accent-purple-subtle-hovered)' | 'var(--ds-background-accent-purple-bolder-hovered)' | 'var(--ds-background-accent-magenta-subtlest-hovered)' | 'var(--ds-background-accent-magenta-subtler-hovered)' | 'var(--ds-background-accent-magenta-subtle-hovered)' | 'var(--ds-background-accent-magenta-bolder-hovered)' | 'var(--ds-background-accent-gray-subtlest-hovered)' | 'var(--ds-background-accent-gray-subtler-hovered)' | 'var(--ds-background-accent-gray-subtle-hovered)' | 'var(--ds-background-accent-gray-bolder-hovered)' | 'var(--ds-background-input-hovered)' | 'var(--ds-background-inverse-subtle-hovered)' | 'var(--ds-background-neutral-hovered)' | 'var(--ds-background-neutral-subtle-hovered)' | 'var(--ds-background-neutral-bold-hovered)' | 'var(--ds-background-selected-hovered)' | 'var(--ds-background-selected-bold-hovered)' | 'var(--ds-background-brand-subtlest-hovered)' | 'var(--ds-background-brand-bold-hovered)' | 'var(--ds-background-brand-boldest-hovered)' | 'var(--ds-background-danger-hovered)' | 'var(--ds-background-danger-subtler-hovered)' | 'var(--ds-background-danger-bold-hovered)' | 'var(--ds-background-warning-hovered)' | 'var(--ds-background-warning-subtler-hovered)' | 'var(--ds-background-warning-bold-hovered)' | 'var(--ds-background-success-hovered)' | 'var(--ds-background-success-subtler-hovered)' | 'var(--ds-background-success-bold-hovered)' | 'var(--ds-background-discovery-hovered)' | 'var(--ds-background-discovery-subtler-hovered)' | 'var(--ds-background-discovery-bold-hovered)' | 'var(--ds-background-information-hovered)' | 'var(--ds-background-information-subtler-hovered)' | 'var(--ds-background-information-bold-hovered)' | 'var(--ds-surface-hovered)' | 'var(--ds-surface-overlay-hovered)' | 'var(--ds-surface-raised-hovered)';
@@ -13,7 +13,7 @@ export type FontShorthand = 'var(--ds-font-heading-xxlarge)' | 'var(--ds-font-he
13
13
  export type IconColorPressed = 'var(--ds-link-pressed)' | 'var(--ds-link-visited-pressed)';
14
14
  export type IconColor = IconColorPressed | 'var(--ds-link)' | 'var(--ds-link-visited)' | 'var(--ds-icon)' | 'var(--ds-icon-accent-lime)' | 'var(--ds-icon-accent-red)' | 'var(--ds-icon-accent-orange)' | 'var(--ds-icon-accent-yellow)' | 'var(--ds-icon-accent-green)' | 'var(--ds-icon-accent-teal)' | 'var(--ds-icon-accent-blue)' | 'var(--ds-icon-accent-purple)' | 'var(--ds-icon-accent-magenta)' | 'var(--ds-icon-accent-gray)' | 'var(--ds-icon-disabled)' | 'var(--ds-icon-inverse)' | 'var(--ds-icon-selected)' | 'var(--ds-icon-brand)' | 'var(--ds-icon-danger)' | 'var(--ds-icon-warning)' | 'var(--ds-icon-warning-inverse)' | 'var(--ds-icon-success)' | 'var(--ds-icon-discovery)' | 'var(--ds-icon-information)' | 'var(--ds-icon-subtlest)' | 'var(--ds-icon-subtle)';
15
15
  export type BorderColor = 'transparent' | 'var(--ds-border)' | 'var(--ds-border-accent-lime)' | 'var(--ds-border-accent-red)' | 'var(--ds-border-accent-orange)' | 'var(--ds-border-accent-yellow)' | 'var(--ds-border-accent-green)' | 'var(--ds-border-accent-teal)' | 'var(--ds-border-accent-blue)' | 'var(--ds-border-accent-purple)' | 'var(--ds-border-accent-magenta)' | 'var(--ds-border-accent-gray)' | 'var(--ds-border-disabled)' | 'var(--ds-border-focused)' | 'var(--ds-border-input)' | 'var(--ds-border-inverse)' | 'var(--ds-border-selected)' | 'var(--ds-border-brand)' | 'var(--ds-border-danger)' | 'var(--ds-border-warning)' | 'var(--ds-border-success)' | 'var(--ds-border-discovery)' | 'var(--ds-border-information)' | 'var(--ds-border-bold)';
16
- export type BorderRadius = 'var(--ds-radius-xsmall)' | 'var(--ds-radius-small)' | 'var(--ds-radius-medium)' | 'var(--ds-radius-large)' | 'var(--ds-radius-xlarge)' | 'var(--ds-radius-xxlarge)' | 'var(--ds-radius-full)' | 'var(--ds-radius-tile)' | 'inherit' | `${number}px` | `${number}rem`;
16
+ export type BorderRadius = 'var(--ds-radius-xsmall)' | 'var(--ds-radius-small)' | 'var(--ds-radius-medium)' | 'var(--ds-radius-large)' | 'var(--ds-radius-xlarge)' | 'var(--ds-radius-xxlarge)' | 'var(--ds-radius-full)' | 'var(--ds-radius-tile)' | 0 | '0' | 'inherit';
17
17
  export type BorderWidth = 'var(--ds-border-width)' | 'var(--ds-border-width-selected)' | 'var(--ds-border-width-focused)' | 0 | '0';
18
18
  export type BorderShorthand = 'none' | `${BorderWidth} solid ${BorderColor}`;
19
19
  type NumericSize = `${number}px` | `${number}rem` | `${number}vh` | `${number}vw` | `${number}%`;
package/dist/types/index.d.ts CHANGED
@@ -12,6 +12,6 @@ export { default as getGlobalTheme } from './get-global-theme';
12
12
  export { themeStringToObject, themeObjectToString } from './theme-state-transformer';
13
13
  export type { CSSToken } from './artifacts/token-names';
14
14
  export type { ActiveTokens } from './artifacts/types';
15
- export type { ThemeColorModes, Themes, ThemeFileNames, ThemeIds, ThemeOptionsSchema, ThemeState, ActiveThemeState, } from './theme-config';
15
+ export type { ThemeColorModes, ThemeContrastModes, Themes, ThemeFileNames, ThemeIds, ThemeOptionsSchema, ThemeState, ActiveThemeState, } from './theme-config';
16
16
  export type { FontFamilyToken, FontWeightToken, Groups, OpacityToken, PaintToken, RawToken, ShadowToken, SpacingToken, ShapeToken, TypographyToken, } from './types';
17
17
  export { CURRENT_SURFACE_CSS_VAR } from './constants';
package/dist/types/theme-config.d.ts CHANGED
@@ -34,7 +34,7 @@ export type DataColorModes = Exclude<ThemeColorModes, 'auto'>;
34
34
  * Contrast preferences: The system contrast preference
35
35
  */
36
36
  declare const themeContrastModes: readonly ["more", "no-preference", "auto"];
37
- type ThemeContrastModes = (typeof themeContrastModes)[number];
37
+ export type ThemeContrastModes = (typeof themeContrastModes)[number];
38
38
  export type DataContrastModes = 'more' | 'no-preference' | 'auto';
39
39
  /**
40
40
  * Theme ids: The value that will be mounted to the DOM as a data attr
package/dist/types-ts4.5/entry-points/css-type-schema.codegen.d.ts CHANGED
@@ -3,7 +3,7 @@
3
3
  *
4
4
  * Strict design token based typedef representing a subset of safe CSS properties.
5
5
  *
6
- * @codegen <<SignedSource::9505f10fa9d06df6b3fd52a4916db1d2>>
6
+ * @codegen <<SignedSource::1a2d573fb8c14220f04597b1b0376420>>
7
7
  * @codegenCommand yarn build tokens
8
8
  */
9
9
  export type BackgroundColorHovered = 'var(--ds-background-accent-lime-subtlest-hovered)' | 'var(--ds-background-accent-lime-subtler-hovered)' | 'var(--ds-background-accent-lime-subtle-hovered)' | 'var(--ds-background-accent-lime-bolder-hovered)' | 'var(--ds-background-accent-red-subtlest-hovered)' | 'var(--ds-background-accent-red-subtler-hovered)' | 'var(--ds-background-accent-red-subtle-hovered)' | 'var(--ds-background-accent-red-bolder-hovered)' | 'var(--ds-background-accent-orange-subtlest-hovered)' | 'var(--ds-background-accent-orange-subtler-hovered)' | 'var(--ds-background-accent-orange-subtle-hovered)' | 'var(--ds-background-accent-orange-bolder-hovered)' | 'var(--ds-background-accent-yellow-subtlest-hovered)' | 'var(--ds-background-accent-yellow-subtler-hovered)' | 'var(--ds-background-accent-yellow-subtle-hovered)' | 'var(--ds-background-accent-yellow-bolder-hovered)' | 'var(--ds-background-accent-green-subtlest-hovered)' | 'var(--ds-background-accent-green-subtler-hovered)' | 'var(--ds-background-accent-green-subtle-hovered)' | 'var(--ds-background-accent-green-bolder-hovered)' | 'var(--ds-background-accent-teal-subtlest-hovered)' | 'var(--ds-background-accent-teal-subtler-hovered)' | 'var(--ds-background-accent-teal-subtle-hovered)' | 'var(--ds-background-accent-teal-bolder-hovered)' | 'var(--ds-background-accent-blue-subtlest-hovered)' | 'var(--ds-background-accent-blue-subtler-hovered)' | 'var(--ds-background-accent-blue-subtle-hovered)' | 'var(--ds-background-accent-blue-bolder-hovered)' | 'var(--ds-background-accent-purple-subtlest-hovered)' | 'var(--ds-background-accent-purple-subtler-hovered)' | 'var(--ds-background-accent-purple-subtle-hovered)' | 'var(--ds-background-accent-purple-bolder-hovered)' | 'var(--ds-background-accent-magenta-subtlest-hovered)' | 'var(--ds-background-accent-magenta-subtler-hovered)' | 'var(--ds-background-accent-magenta-subtle-hovered)' | 'var(--ds-background-accent-magenta-bolder-hovered)' | 'var(--ds-background-accent-gray-subtlest-hovered)' | 'var(--ds-background-accent-gray-subtler-hovered)' | 'var(--ds-background-accent-gray-subtle-hovered)' | 'var(--ds-background-accent-gray-bolder-hovered)' | 'var(--ds-background-input-hovered)' | 'var(--ds-background-inverse-subtle-hovered)' | 'var(--ds-background-neutral-hovered)' | 'var(--ds-background-neutral-subtle-hovered)' | 'var(--ds-background-neutral-bold-hovered)' | 'var(--ds-background-selected-hovered)' | 'var(--ds-background-selected-bold-hovered)' | 'var(--ds-background-brand-subtlest-hovered)' | 'var(--ds-background-brand-bold-hovered)' | 'var(--ds-background-brand-boldest-hovered)' | 'var(--ds-background-danger-hovered)' | 'var(--ds-background-danger-subtler-hovered)' | 'var(--ds-background-danger-bold-hovered)' | 'var(--ds-background-warning-hovered)' | 'var(--ds-background-warning-subtler-hovered)' | 'var(--ds-background-warning-bold-hovered)' | 'var(--ds-background-success-hovered)' | 'var(--ds-background-success-subtler-hovered)' | 'var(--ds-background-success-bold-hovered)' | 'var(--ds-background-discovery-hovered)' | 'var(--ds-background-discovery-subtler-hovered)' | 'var(--ds-background-discovery-bold-hovered)' | 'var(--ds-background-information-hovered)' | 'var(--ds-background-information-subtler-hovered)' | 'var(--ds-background-information-bold-hovered)' | 'var(--ds-surface-hovered)' | 'var(--ds-surface-overlay-hovered)' | 'var(--ds-surface-raised-hovered)';
@@ -13,7 +13,7 @@ export type FontShorthand = 'var(--ds-font-heading-xxlarge)' | 'var(--ds-font-he
13
13
  export type IconColorPressed = 'var(--ds-link-pressed)' | 'var(--ds-link-visited-pressed)';
14
14
  export type IconColor = IconColorPressed | 'var(--ds-link)' | 'var(--ds-link-visited)' | 'var(--ds-icon)' | 'var(--ds-icon-accent-lime)' | 'var(--ds-icon-accent-red)' | 'var(--ds-icon-accent-orange)' | 'var(--ds-icon-accent-yellow)' | 'var(--ds-icon-accent-green)' | 'var(--ds-icon-accent-teal)' | 'var(--ds-icon-accent-blue)' | 'var(--ds-icon-accent-purple)' | 'var(--ds-icon-accent-magenta)' | 'var(--ds-icon-accent-gray)' | 'var(--ds-icon-disabled)' | 'var(--ds-icon-inverse)' | 'var(--ds-icon-selected)' | 'var(--ds-icon-brand)' | 'var(--ds-icon-danger)' | 'var(--ds-icon-warning)' | 'var(--ds-icon-warning-inverse)' | 'var(--ds-icon-success)' | 'var(--ds-icon-discovery)' | 'var(--ds-icon-information)' | 'var(--ds-icon-subtlest)' | 'var(--ds-icon-subtle)';
15
15
  export type BorderColor = 'transparent' | 'var(--ds-border)' | 'var(--ds-border-accent-lime)' | 'var(--ds-border-accent-red)' | 'var(--ds-border-accent-orange)' | 'var(--ds-border-accent-yellow)' | 'var(--ds-border-accent-green)' | 'var(--ds-border-accent-teal)' | 'var(--ds-border-accent-blue)' | 'var(--ds-border-accent-purple)' | 'var(--ds-border-accent-magenta)' | 'var(--ds-border-accent-gray)' | 'var(--ds-border-disabled)' | 'var(--ds-border-focused)' | 'var(--ds-border-input)' | 'var(--ds-border-inverse)' | 'var(--ds-border-selected)' | 'var(--ds-border-brand)' | 'var(--ds-border-danger)' | 'var(--ds-border-warning)' | 'var(--ds-border-success)' | 'var(--ds-border-discovery)' | 'var(--ds-border-information)' | 'var(--ds-border-bold)';
16
- export type BorderRadius = 'var(--ds-radius-xsmall)' | 'var(--ds-radius-small)' | 'var(--ds-radius-medium)' | 'var(--ds-radius-large)' | 'var(--ds-radius-xlarge)' | 'var(--ds-radius-xxlarge)' | 'var(--ds-radius-full)' | 'var(--ds-radius-tile)' | 'inherit' | `${number}px` | `${number}rem`;
16
+ export type BorderRadius = 'var(--ds-radius-xsmall)' | 'var(--ds-radius-small)' | 'var(--ds-radius-medium)' | 'var(--ds-radius-large)' | 'var(--ds-radius-xlarge)' | 'var(--ds-radius-xxlarge)' | 'var(--ds-radius-full)' | 'var(--ds-radius-tile)' | 0 | '0' | 'inherit';
17
17
  export type BorderWidth = 'var(--ds-border-width)' | 'var(--ds-border-width-selected)' | 'var(--ds-border-width-focused)' | 0 | '0';
18
18
  export type BorderShorthand = 'none' | `${BorderWidth} solid ${BorderColor}`;
19
19
  type NumericSize = `${number}px` | `${number}rem` | `${number}vh` | `${number}vw` | `${number}%`;
package/dist/types-ts4.5/index.d.ts CHANGED
@@ -12,6 +12,6 @@ export { default as getGlobalTheme } from './get-global-theme';
12
12
  export { themeStringToObject, themeObjectToString } from './theme-state-transformer';
13
13
  export type { CSSToken } from './artifacts/token-names';
14
14
  export type { ActiveTokens } from './artifacts/types';
15
- export type { ThemeColorModes, Themes, ThemeFileNames, ThemeIds, ThemeOptionsSchema, ThemeState, ActiveThemeState, } from './theme-config';
15
+ export type { ThemeColorModes, ThemeContrastModes, Themes, ThemeFileNames, ThemeIds, ThemeOptionsSchema, ThemeState, ActiveThemeState, } from './theme-config';
16
16
  export type { FontFamilyToken, FontWeightToken, Groups, OpacityToken, PaintToken, RawToken, ShadowToken, SpacingToken, ShapeToken, TypographyToken, } from './types';
17
17
  export { CURRENT_SURFACE_CSS_VAR } from './constants';
package/dist/types-ts4.5/theme-config.d.ts CHANGED
@@ -42,7 +42,7 @@ declare const themeContrastModes: readonly [
42
42
  "no-preference",
43
43
  "auto"
44
44
  ];
45
- type ThemeContrastModes = (typeof themeContrastModes)[number];
45
+ export type ThemeContrastModes = (typeof themeContrastModes)[number];
46
46
  export type DataContrastModes = 'more' | 'no-preference' | 'auto';
47
47
  /**
48
48
  * Theme ids: The value that will be mounted to the DOM as a data attr
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/tokens",
3
- "version": "8.6.1",
3
+ "version": "9.1.0",
4
4
  "description": "Design tokens are the single source of truth to name and store design decisions.",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -44,24 +44,24 @@
44
44
  "@af/formatting": "workspace:^",
45
45
  "@af/visual-regression": "workspace:^",
46
46
  "@atlaskit/avatar": "^25.6.0",
47
- "@atlaskit/button": "^23.8.0",
47
+ "@atlaskit/button": "^23.9.0",
48
48
  "@atlaskit/calendar": "^17.2.0",
49
- "@atlaskit/checkbox": "^17.2.0",
49
+ "@atlaskit/checkbox": "^17.3.0",
50
50
  "@atlaskit/code": "^17.4.0",
51
- "@atlaskit/css": "^0.18.0",
51
+ "@atlaskit/css": "^0.19.0",
52
52
  "@atlaskit/docs": "^11.2.0",
53
- "@atlaskit/dropdown-menu": "^16.3.0",
53
+ "@atlaskit/dropdown-menu": "^16.4.0",
54
54
  "@atlaskit/dynamic-table": "^18.3.0",
55
- "@atlaskit/form": "^15.1.0",
55
+ "@atlaskit/form": "^15.2.0",
56
56
  "@atlaskit/grid": "^0.18.0",
57
57
  "@atlaskit/heading": "^5.2.0",
58
58
  "@atlaskit/icon": "^29.3.0",
59
- "@atlaskit/inline-message": "^15.4.0",
60
- "@atlaskit/link": "^3.2.0",
61
- "@atlaskit/lozenge": "^13.2.0",
62
- "@atlaskit/popup": "^4.7.0",
63
- "@atlaskit/primitives": "^16.4.0",
64
- "@atlaskit/radio": "^8.3.0",
59
+ "@atlaskit/inline-message": "^15.5.0",
60
+ "@atlaskit/link": "^3.3.0",
61
+ "@atlaskit/lozenge": "^13.3.0",
62
+ "@atlaskit/popup": "^4.11.0",
63
+ "@atlaskit/primitives": "^17.0.0",
64
+ "@atlaskit/radio": "^8.4.0",
65
65
  "@atlaskit/section-message": "^8.11.0",
66
66
  "@atlaskit/select": "^21.6.0",
67
67
  "@atlaskit/tag": "^14.2.0",
@@ -71,7 +71,6 @@
71
71
  "@atlaskit/tooltip": "^20.11.0",
72
72
  "@atlassian/codegen": "^0.1.0",
73
73
  "@atlassian/feature-flags-test-utils": "^1.0.0",
74
- "@atlassian/repo-feature-flags-statsig": "^1.11.0",
75
74
  "@atlassian/ts-loader": "^0.1.0",
76
75
  "@babel/core": "7.24.9",
77
76
  "@compiled/react": "^0.18.6",