@atlaskit/tokens 5.5.0 → 5.6.1
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.
- package/CHANGELOG.md +18 -0
- package/dist/cjs/artifacts/theme-import-map.js +7 -1
- package/dist/cjs/artifacts/themes/atlassian-typography.js +12 -0
- package/dist/cjs/artifacts/tokens-raw/atlassian-typography.js +646 -0
- package/dist/cjs/theme-config.js +12 -1
- package/dist/es2019/artifacts/theme-import-map.js +3 -1
- package/dist/es2019/artifacts/themes/atlassian-typography.js +33 -0
- package/dist/es2019/artifacts/tokens-raw/atlassian-typography.js +640 -0
- package/dist/es2019/theme-config.js +12 -1
- package/dist/esm/artifacts/theme-import-map.js +5 -1
- package/dist/esm/artifacts/themes/atlassian-typography.js +6 -0
- package/dist/esm/artifacts/tokens-raw/atlassian-typography.js +640 -0
- package/dist/esm/theme-config.js +12 -1
- package/dist/types/artifacts/theme-import-map.d.ts +1 -1
- package/dist/types/artifacts/themes/atlassian-typography.d.ts +7 -0
- package/dist/types/artifacts/tokens-raw/atlassian-typography.d.ts +58 -0
- package/dist/types/theme-config.d.ts +8 -3
- package/dist/types-ts4.5/artifacts/theme-import-map.d.ts +1 -1
- package/dist/types-ts4.5/artifacts/themes/atlassian-typography.d.ts +7 -0
- package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-typography.d.ts +58 -0
- package/dist/types-ts4.5/theme-config.d.ts +8 -1
- package/figma/atlassian-typography.json +83 -1
- package/package.json +9 -6
package/dist/esm/theme-config.js
CHANGED
|
@@ -40,7 +40,7 @@ var themeContrastModes = ['more', 'no-preference', 'auto'];
|
|
|
40
40
|
*
|
|
41
41
|
* These ids must be kebab case
|
|
42
42
|
*/
|
|
43
|
-
export var themeIds = ['light-increased-contrast', 'light', 'light-future', 'light-brand-refresh', 'dark', 'dark-future', 'dark-increased-contrast', 'dark-brand-refresh', 'legacy-light', 'legacy-dark', 'spacing', 'shape', 'typography-adg3', 'typography-modernized', 'typography-refreshed'];
|
|
43
|
+
export var themeIds = ['light-increased-contrast', 'light', 'light-future', 'light-brand-refresh', 'dark', 'dark-future', 'dark-increased-contrast', 'dark-brand-refresh', 'legacy-light', 'legacy-dark', 'spacing', 'shape', 'typography', 'typography-adg3', 'typography-modernized', 'typography-refreshed'];
|
|
44
44
|
/**
|
|
45
45
|
* Theme override ids: the equivalent of themeIds for theme overrides.
|
|
46
46
|
* Theme overrides are temporary and there may not be any defined at times.
|
|
@@ -152,6 +152,14 @@ var themeConfig = {
|
|
|
152
152
|
type: 'spacing'
|
|
153
153
|
}
|
|
154
154
|
},
|
|
155
|
+
'atlassian-typography': {
|
|
156
|
+
id: 'typography',
|
|
157
|
+
displayName: 'Atlassian Typography',
|
|
158
|
+
palette: 'typographyPalette',
|
|
159
|
+
attributes: {
|
|
160
|
+
type: 'typography'
|
|
161
|
+
}
|
|
162
|
+
},
|
|
155
163
|
'atlassian-typography-adg3': {
|
|
156
164
|
id: 'typography-adg3',
|
|
157
165
|
displayName: 'ADG3 Typography',
|
|
@@ -228,6 +236,9 @@ export var themeStateDefaults = {
|
|
|
228
236
|
shape: undefined,
|
|
229
237
|
spacing: 'spacing',
|
|
230
238
|
typography: function typography() {
|
|
239
|
+
if (fg('platform-default-typography-refreshed')) {
|
|
240
|
+
return 'typography';
|
|
241
|
+
}
|
|
231
242
|
if (fg('platform-default-typography-modernized')) {
|
|
232
243
|
return 'typography-modernized';
|
|
233
244
|
}
|
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
* This allows users to compose their themes and only use the tokens that are requested.
|
|
7
7
|
* When a new theme is created, the import should automatically be added to the map
|
|
8
8
|
*
|
|
9
|
-
* @codegen <<SignedSource::
|
|
9
|
+
* @codegen <<SignedSource::4131829e60733a1a5e513dcc84af81de>>
|
|
10
10
|
* @codegenCommand yarn build tokens
|
|
11
11
|
*/
|
|
12
12
|
import { type ThemeIds, type ThemeOverrideIds } from '../theme-config';
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
|
|
3
|
+
* @codegen <<SignedSource::a352be05995afa0bd55c0b0530178fe7>>
|
|
4
|
+
* @codegenCommand yarn build tokens
|
|
5
|
+
*/
|
|
6
|
+
declare const _default: "\nhtml[data-theme~=\"typography:typography\"] {\n --ds-font-heading-xxlarge: normal 653 2rem/2.25rem \"Atlassian Sans\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif;\n --ds-font-heading-xlarge: normal 653 1.75rem/2rem \"Atlassian Sans\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif;\n --ds-font-heading-large: normal 653 1.5rem/1.75rem \"Atlassian Sans\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif;\n --ds-font-heading-medium: normal 653 1.25rem/1.5rem \"Atlassian Sans\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif;\n --ds-font-heading-small: normal 653 1rem/1.25rem \"Atlassian Sans\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif;\n --ds-font-heading-xsmall: normal 653 0.875rem/1.25rem \"Atlassian Sans\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif;\n --ds-font-heading-xxsmall: normal 653 0.75rem/1rem \"Atlassian Sans\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif;\n --ds-font-body-large: normal 400 1rem/1.5rem \"Atlassian Sans\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif;\n --ds-font-body: normal 400 0.875rem/1.25rem \"Atlassian Sans\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif;\n --ds-font-body-small: normal 400 0.75rem/1rem \"Atlassian Sans\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif;\n --ds-font-body-UNSAFE_small: normal 400 0.75rem/1rem \"Atlassian Sans\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif;\n --ds-font-metric-large: normal 653 1.75rem/2rem \"Atlassian Sans\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif;\n --ds-font-metric-medium: normal 653 1.5rem/1.75rem \"Atlassian Sans\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif;\n --ds-font-metric-small: normal 653 1rem/1.25rem \"Atlassian Sans\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif;\n --ds-font-code: normal 400 0.875em/1 \"Atlassian Mono\", ui-monospace, Menlo, \"Segoe UI Mono\", \"Ubuntu Mono\", monospace;\n --ds-font-weight-regular: 400;\n --ds-font-weight-medium: 500;\n --ds-font-weight-semibold: 600;\n --ds-font-weight-bold: 653;\n --ds-font-family-heading: \"Atlassian Sans\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif;\n --ds-font-family-body: \"Atlassian Sans\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif;\n --ds-font-family-code: \"Atlassian Mono\", ui-monospace, Menlo, \"Segoe UI Mono\", \"Ubuntu Mono\", monospace;\n --ds-font-family-brand-heading: \"Charlie Display\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif;\n --ds-font-family-brand-body: \"Charlie Text\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif;\n}\n";
|
|
7
|
+
export default _default;
|
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
|
|
3
|
+
* @codegen <<SignedSource::98ab89891ee24bccb839dea132325f91>>
|
|
4
|
+
* @codegenCommand yarn build tokens
|
|
5
|
+
*/
|
|
6
|
+
declare const tokens: ({
|
|
7
|
+
attributes: {
|
|
8
|
+
group: string;
|
|
9
|
+
state: string;
|
|
10
|
+
introduced: string;
|
|
11
|
+
description: string;
|
|
12
|
+
};
|
|
13
|
+
value: string;
|
|
14
|
+
filePath: string;
|
|
15
|
+
isSource: boolean;
|
|
16
|
+
original: {
|
|
17
|
+
attributes: {
|
|
18
|
+
group: string;
|
|
19
|
+
state: string;
|
|
20
|
+
introduced: string;
|
|
21
|
+
description: string;
|
|
22
|
+
};
|
|
23
|
+
value: {
|
|
24
|
+
fontWeight: string;
|
|
25
|
+
fontSize: string;
|
|
26
|
+
lineHeight: string;
|
|
27
|
+
fontFamily: string;
|
|
28
|
+
fontStyle: string;
|
|
29
|
+
letterSpacing: string;
|
|
30
|
+
};
|
|
31
|
+
};
|
|
32
|
+
name: string;
|
|
33
|
+
path: string[];
|
|
34
|
+
cleanName: string;
|
|
35
|
+
} | {
|
|
36
|
+
attributes: {
|
|
37
|
+
group: string;
|
|
38
|
+
state: string;
|
|
39
|
+
introduced: string;
|
|
40
|
+
description: string;
|
|
41
|
+
};
|
|
42
|
+
value: string;
|
|
43
|
+
filePath: string;
|
|
44
|
+
isSource: boolean;
|
|
45
|
+
original: {
|
|
46
|
+
attributes: {
|
|
47
|
+
group: string;
|
|
48
|
+
state: string;
|
|
49
|
+
introduced: string;
|
|
50
|
+
description: string;
|
|
51
|
+
};
|
|
52
|
+
value: string;
|
|
53
|
+
};
|
|
54
|
+
name: string;
|
|
55
|
+
path: string[];
|
|
56
|
+
cleanName: string;
|
|
57
|
+
})[];
|
|
58
|
+
export default tokens;
|
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
* These ids are what the actual theme files/folders are called.
|
|
7
7
|
* style-dictionary will attempt to locate these in the file-system.
|
|
8
8
|
*/
|
|
9
|
-
export type Themes = 'atlassian-light' | 'atlassian-light-future' | 'atlassian-light-increased-contrast' | 'atlassian-light-brand-refresh' | 'atlassian-dark' | 'atlassian-dark-future' | 'atlassian-dark-increased-contrast' | 'atlassian-dark-brand-refresh' | 'atlassian-legacy-light' | 'atlassian-legacy-dark' | 'atlassian-shape' | 'atlassian-spacing' | 'atlassian-typography-refreshed' | 'atlassian-typography-modernized' | 'atlassian-typography-adg3';
|
|
9
|
+
export type Themes = 'atlassian-light' | 'atlassian-light-future' | 'atlassian-light-increased-contrast' | 'atlassian-light-brand-refresh' | 'atlassian-dark' | 'atlassian-dark-future' | 'atlassian-dark-increased-contrast' | 'atlassian-dark-brand-refresh' | 'atlassian-legacy-light' | 'atlassian-legacy-dark' | 'atlassian-shape' | 'atlassian-spacing' | 'atlassian-typography' | 'atlassian-typography-refreshed' | 'atlassian-typography-modernized' | 'atlassian-typography-adg3';
|
|
10
10
|
export type ThemeFileNames = Themes;
|
|
11
11
|
/**
|
|
12
12
|
* ThemeOverrides: The internal identifier of a theme override. Which are themes that contain
|
|
@@ -42,7 +42,7 @@ export type DataContrastModes = 'more' | 'no-preference' | 'auto';
|
|
|
42
42
|
*
|
|
43
43
|
* These ids must be kebab case
|
|
44
44
|
*/
|
|
45
|
-
export declare const themeIds: readonly ["light-increased-contrast", "light", "light-future", "light-brand-refresh", "dark", "dark-future", "dark-increased-contrast", "dark-brand-refresh", "legacy-light", "legacy-dark", "spacing", "shape", "typography-adg3", "typography-modernized", "typography-refreshed"];
|
|
45
|
+
export declare const themeIds: readonly ["light-increased-contrast", "light", "light-future", "light-brand-refresh", "dark", "dark-future", "dark-increased-contrast", "dark-brand-refresh", "legacy-light", "legacy-dark", "spacing", "shape", "typography", "typography-adg3", "typography-modernized", "typography-refreshed"];
|
|
46
46
|
export type ThemeIds = (typeof themeIds)[number];
|
|
47
47
|
/**
|
|
48
48
|
* Theme override ids: the equivalent of themeIds for theme overrides.
|
|
@@ -50,7 +50,7 @@ export type ThemeIds = (typeof themeIds)[number];
|
|
|
50
50
|
*/
|
|
51
51
|
declare const themeOverrideIds: readonly [];
|
|
52
52
|
export type ThemeOverrideIds = (typeof themeOverrideIds)[number];
|
|
53
|
-
export declare const themeIdsWithOverrides: readonly ["light-increased-contrast", "light", "light-future", "light-brand-refresh", "dark", "dark-future", "dark-increased-contrast", "dark-brand-refresh", "legacy-light", "legacy-dark", "spacing", "shape", "typography-adg3", "typography-modernized", "typography-refreshed"];
|
|
53
|
+
export declare const themeIdsWithOverrides: readonly ["light-increased-contrast", "light", "light-future", "light-brand-refresh", "dark", "dark-future", "dark-increased-contrast", "dark-brand-refresh", "legacy-light", "legacy-dark", "spacing", "shape", "typography", "typography-adg3", "typography-modernized", "typography-refreshed"];
|
|
54
54
|
export type ThemeIdsWithOverrides = (typeof themeIdsWithOverrides)[number];
|
|
55
55
|
/**
|
|
56
56
|
* Theme to use a base. This will create the theme as
|
|
@@ -121,6 +121,11 @@ export interface ThemeState {
|
|
|
121
121
|
contrastMode: ThemeContrastModes;
|
|
122
122
|
shape?: Extract<ThemeIds, 'shape'>;
|
|
123
123
|
spacing: Extract<ThemeIds, 'spacing'>;
|
|
124
|
+
/**
|
|
125
|
+
* @deprecated 'typography-adg3' is deprecated, use 'typography' instead
|
|
126
|
+
* @deprecated 'typography-modernized' is deprecated, use 'typography' instead
|
|
127
|
+
* @deprecated 'typography-refreshed' is deprecated, use 'typography' instead
|
|
128
|
+
*/
|
|
124
129
|
typography?: Extract<ThemeIds, 'typography' | 'typography-adg3' | 'typography-modernized' | 'typography-refreshed'>;
|
|
125
130
|
UNSAFE_themeOptions?: ThemeOptionsSchema;
|
|
126
131
|
}
|
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
* This allows users to compose their themes and only use the tokens that are requested.
|
|
7
7
|
* When a new theme is created, the import should automatically be added to the map
|
|
8
8
|
*
|
|
9
|
-
* @codegen <<SignedSource::
|
|
9
|
+
* @codegen <<SignedSource::4131829e60733a1a5e513dcc84af81de>>
|
|
10
10
|
* @codegenCommand yarn build tokens
|
|
11
11
|
*/
|
|
12
12
|
import { type ThemeIds, type ThemeOverrideIds } from '../theme-config';
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
|
|
3
|
+
* @codegen <<SignedSource::a352be05995afa0bd55c0b0530178fe7>>
|
|
4
|
+
* @codegenCommand yarn build tokens
|
|
5
|
+
*/
|
|
6
|
+
declare const _default: "\nhtml[data-theme~=\"typography:typography\"] {\n --ds-font-heading-xxlarge: normal 653 2rem/2.25rem \"Atlassian Sans\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif;\n --ds-font-heading-xlarge: normal 653 1.75rem/2rem \"Atlassian Sans\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif;\n --ds-font-heading-large: normal 653 1.5rem/1.75rem \"Atlassian Sans\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif;\n --ds-font-heading-medium: normal 653 1.25rem/1.5rem \"Atlassian Sans\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif;\n --ds-font-heading-small: normal 653 1rem/1.25rem \"Atlassian Sans\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif;\n --ds-font-heading-xsmall: normal 653 0.875rem/1.25rem \"Atlassian Sans\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif;\n --ds-font-heading-xxsmall: normal 653 0.75rem/1rem \"Atlassian Sans\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif;\n --ds-font-body-large: normal 400 1rem/1.5rem \"Atlassian Sans\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif;\n --ds-font-body: normal 400 0.875rem/1.25rem \"Atlassian Sans\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif;\n --ds-font-body-small: normal 400 0.75rem/1rem \"Atlassian Sans\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif;\n --ds-font-body-UNSAFE_small: normal 400 0.75rem/1rem \"Atlassian Sans\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif;\n --ds-font-metric-large: normal 653 1.75rem/2rem \"Atlassian Sans\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif;\n --ds-font-metric-medium: normal 653 1.5rem/1.75rem \"Atlassian Sans\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif;\n --ds-font-metric-small: normal 653 1rem/1.25rem \"Atlassian Sans\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif;\n --ds-font-code: normal 400 0.875em/1 \"Atlassian Mono\", ui-monospace, Menlo, \"Segoe UI Mono\", \"Ubuntu Mono\", monospace;\n --ds-font-weight-regular: 400;\n --ds-font-weight-medium: 500;\n --ds-font-weight-semibold: 600;\n --ds-font-weight-bold: 653;\n --ds-font-family-heading: \"Atlassian Sans\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif;\n --ds-font-family-body: \"Atlassian Sans\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif;\n --ds-font-family-code: \"Atlassian Mono\", ui-monospace, Menlo, \"Segoe UI Mono\", \"Ubuntu Mono\", monospace;\n --ds-font-family-brand-heading: \"Charlie Display\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif;\n --ds-font-family-brand-body: \"Charlie Text\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif;\n}\n";
|
|
7
|
+
export default _default;
|
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
|
|
3
|
+
* @codegen <<SignedSource::98ab89891ee24bccb839dea132325f91>>
|
|
4
|
+
* @codegenCommand yarn build tokens
|
|
5
|
+
*/
|
|
6
|
+
declare const tokens: ({
|
|
7
|
+
attributes: {
|
|
8
|
+
group: string;
|
|
9
|
+
state: string;
|
|
10
|
+
introduced: string;
|
|
11
|
+
description: string;
|
|
12
|
+
};
|
|
13
|
+
value: string;
|
|
14
|
+
filePath: string;
|
|
15
|
+
isSource: boolean;
|
|
16
|
+
original: {
|
|
17
|
+
attributes: {
|
|
18
|
+
group: string;
|
|
19
|
+
state: string;
|
|
20
|
+
introduced: string;
|
|
21
|
+
description: string;
|
|
22
|
+
};
|
|
23
|
+
value: {
|
|
24
|
+
fontWeight: string;
|
|
25
|
+
fontSize: string;
|
|
26
|
+
lineHeight: string;
|
|
27
|
+
fontFamily: string;
|
|
28
|
+
fontStyle: string;
|
|
29
|
+
letterSpacing: string;
|
|
30
|
+
};
|
|
31
|
+
};
|
|
32
|
+
name: string;
|
|
33
|
+
path: string[];
|
|
34
|
+
cleanName: string;
|
|
35
|
+
} | {
|
|
36
|
+
attributes: {
|
|
37
|
+
group: string;
|
|
38
|
+
state: string;
|
|
39
|
+
introduced: string;
|
|
40
|
+
description: string;
|
|
41
|
+
};
|
|
42
|
+
value: string;
|
|
43
|
+
filePath: string;
|
|
44
|
+
isSource: boolean;
|
|
45
|
+
original: {
|
|
46
|
+
attributes: {
|
|
47
|
+
group: string;
|
|
48
|
+
state: string;
|
|
49
|
+
introduced: string;
|
|
50
|
+
description: string;
|
|
51
|
+
};
|
|
52
|
+
value: string;
|
|
53
|
+
};
|
|
54
|
+
name: string;
|
|
55
|
+
path: string[];
|
|
56
|
+
cleanName: string;
|
|
57
|
+
})[];
|
|
58
|
+
export default tokens;
|
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
* These ids are what the actual theme files/folders are called.
|
|
7
7
|
* style-dictionary will attempt to locate these in the file-system.
|
|
8
8
|
*/
|
|
9
|
-
export type Themes = 'atlassian-light' | 'atlassian-light-future' | 'atlassian-light-increased-contrast' | 'atlassian-light-brand-refresh' | 'atlassian-dark' | 'atlassian-dark-future' | 'atlassian-dark-increased-contrast' | 'atlassian-dark-brand-refresh' | 'atlassian-legacy-light' | 'atlassian-legacy-dark' | 'atlassian-shape' | 'atlassian-spacing' | 'atlassian-typography-refreshed' | 'atlassian-typography-modernized' | 'atlassian-typography-adg3';
|
|
9
|
+
export type Themes = 'atlassian-light' | 'atlassian-light-future' | 'atlassian-light-increased-contrast' | 'atlassian-light-brand-refresh' | 'atlassian-dark' | 'atlassian-dark-future' | 'atlassian-dark-increased-contrast' | 'atlassian-dark-brand-refresh' | 'atlassian-legacy-light' | 'atlassian-legacy-dark' | 'atlassian-shape' | 'atlassian-spacing' | 'atlassian-typography' | 'atlassian-typography-refreshed' | 'atlassian-typography-modernized' | 'atlassian-typography-adg3';
|
|
10
10
|
export type ThemeFileNames = Themes;
|
|
11
11
|
/**
|
|
12
12
|
* ThemeOverrides: The internal identifier of a theme override. Which are themes that contain
|
|
@@ -63,6 +63,7 @@ export declare const themeIds: readonly [
|
|
|
63
63
|
"legacy-dark",
|
|
64
64
|
"spacing",
|
|
65
65
|
"shape",
|
|
66
|
+
"typography",
|
|
66
67
|
"typography-adg3",
|
|
67
68
|
"typography-modernized",
|
|
68
69
|
"typography-refreshed"
|
|
@@ -88,6 +89,7 @@ export declare const themeIdsWithOverrides: readonly [
|
|
|
88
89
|
"legacy-dark",
|
|
89
90
|
"spacing",
|
|
90
91
|
"shape",
|
|
92
|
+
"typography",
|
|
91
93
|
"typography-adg3",
|
|
92
94
|
"typography-modernized",
|
|
93
95
|
"typography-refreshed"
|
|
@@ -162,6 +164,11 @@ export interface ThemeState {
|
|
|
162
164
|
contrastMode: ThemeContrastModes;
|
|
163
165
|
shape?: Extract<ThemeIds, 'shape'>;
|
|
164
166
|
spacing: Extract<ThemeIds, 'spacing'>;
|
|
167
|
+
/**
|
|
168
|
+
* @deprecated 'typography-adg3' is deprecated, use 'typography' instead
|
|
169
|
+
* @deprecated 'typography-modernized' is deprecated, use 'typography' instead
|
|
170
|
+
* @deprecated 'typography-refreshed' is deprecated, use 'typography' instead
|
|
171
|
+
*/
|
|
165
172
|
typography?: Extract<ThemeIds, 'typography' | 'typography-adg3' | 'typography-modernized' | 'typography-refreshed'>;
|
|
166
173
|
UNSAFE_themeOptions?: ThemeOptionsSchema;
|
|
167
174
|
}
|
|
@@ -1,5 +1,87 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "Typography",
|
|
3
|
-
"tokens": {
|
|
3
|
+
"tokens": {
|
|
4
|
+
"Typography/font.weight.regular": {
|
|
5
|
+
"attributes": {
|
|
6
|
+
"group": "fontWeight",
|
|
7
|
+
"state": "active",
|
|
8
|
+
"introduced": "0.10.33",
|
|
9
|
+
"description": "Default font weight for body text styles."
|
|
10
|
+
},
|
|
11
|
+
"value": "400"
|
|
12
|
+
},
|
|
13
|
+
"Typography/font.weight.medium": {
|
|
14
|
+
"attributes": {
|
|
15
|
+
"group": "fontWeight",
|
|
16
|
+
"state": "active",
|
|
17
|
+
"introduced": "0.10.33",
|
|
18
|
+
"description": "For all text that may appear beside iconography, such as in a button."
|
|
19
|
+
},
|
|
20
|
+
"value": "500"
|
|
21
|
+
},
|
|
22
|
+
"Typography/font.weight.semibold": {
|
|
23
|
+
"attributes": {
|
|
24
|
+
"group": "fontWeight",
|
|
25
|
+
"state": "active",
|
|
26
|
+
"introduced": "0.10.33",
|
|
27
|
+
"description": "Use with caution as fallback fonts do not support this font weight and will default to bold weight."
|
|
28
|
+
},
|
|
29
|
+
"value": "600"
|
|
30
|
+
},
|
|
31
|
+
"Typography/font.weight.bold": {
|
|
32
|
+
"attributes": {
|
|
33
|
+
"group": "fontWeight",
|
|
34
|
+
"state": "active",
|
|
35
|
+
"introduced": "0.10.33",
|
|
36
|
+
"description": "Use sparingly for emphasising text, such as in a lozenge."
|
|
37
|
+
},
|
|
38
|
+
"value": "653"
|
|
39
|
+
},
|
|
40
|
+
"Typography/font.family.heading": {
|
|
41
|
+
"attributes": {
|
|
42
|
+
"group": "fontFamily",
|
|
43
|
+
"state": "active",
|
|
44
|
+
"introduced": "1.14.0",
|
|
45
|
+
"description": "For our default product UI heading text."
|
|
46
|
+
},
|
|
47
|
+
"value": "\"Atlassian Sans\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif"
|
|
48
|
+
},
|
|
49
|
+
"Typography/font.family.body": {
|
|
50
|
+
"attributes": {
|
|
51
|
+
"group": "fontFamily",
|
|
52
|
+
"state": "active",
|
|
53
|
+
"introduced": "1.14.0",
|
|
54
|
+
"description": "For our default product UI body text."
|
|
55
|
+
},
|
|
56
|
+
"value": "\"Atlassian Sans\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif"
|
|
57
|
+
},
|
|
58
|
+
"Typography/font.family.code": {
|
|
59
|
+
"attributes": {
|
|
60
|
+
"group": "fontFamily",
|
|
61
|
+
"state": "active",
|
|
62
|
+
"introduced": "1.14.0",
|
|
63
|
+
"description": "For representing code only."
|
|
64
|
+
},
|
|
65
|
+
"value": "\"Atlassian Mono\", ui-monospace, Menlo, \"Segoe UI Mono\", \"Ubuntu Mono\", monospace"
|
|
66
|
+
},
|
|
67
|
+
"Typography/font.family.brand.heading": {
|
|
68
|
+
"attributes": {
|
|
69
|
+
"group": "fontFamily",
|
|
70
|
+
"state": "active",
|
|
71
|
+
"introduced": "1.14.0",
|
|
72
|
+
"description": "For our brand heading text. Uses Charlie Display."
|
|
73
|
+
},
|
|
74
|
+
"value": "\"Charlie Display\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif"
|
|
75
|
+
},
|
|
76
|
+
"Typography/font.family.brand.body": {
|
|
77
|
+
"attributes": {
|
|
78
|
+
"group": "fontFamily",
|
|
79
|
+
"state": "active",
|
|
80
|
+
"introduced": "1.14.0",
|
|
81
|
+
"description": "For our brand body text. Uses Charlie Text."
|
|
82
|
+
},
|
|
83
|
+
"value": "\"Charlie Text\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif"
|
|
84
|
+
}
|
|
85
|
+
},
|
|
4
86
|
"renameMap": {}
|
|
5
87
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/tokens",
|
|
3
|
-
"version": "5.
|
|
3
|
+
"version": "5.6.1",
|
|
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/"
|
|
@@ -30,7 +30,7 @@
|
|
|
30
30
|
"codegen-tokens": "run-ts ./scripts/style-dictionary/build.tsx && cd $(npx repo-root)/packages/design-system/primitives && yarn codegen-styles && cd $(npx repo-root)/packages/design-system/ds-explorations && yarn codegen-styles && cd $(npx repo-root)/packages/design-system/heading && yarn codegen"
|
|
31
31
|
},
|
|
32
32
|
"dependencies": {
|
|
33
|
-
"@atlaskit/ds-lib": "^
|
|
33
|
+
"@atlaskit/ds-lib": "^5.0.0",
|
|
34
34
|
"@atlaskit/platform-feature-flags": "^1.1.0",
|
|
35
35
|
"@babel/runtime": "^7.0.0",
|
|
36
36
|
"@babel/traverse": "^7.23.2",
|
|
@@ -50,20 +50,20 @@
|
|
|
50
50
|
"@atlaskit/code": "^17.2.0",
|
|
51
51
|
"@atlaskit/css": "^0.12.0",
|
|
52
52
|
"@atlaskit/docs": "^11.0.0",
|
|
53
|
-
"@atlaskit/dropdown-menu": "^16.
|
|
53
|
+
"@atlaskit/dropdown-menu": "^16.3.0",
|
|
54
54
|
"@atlaskit/dynamic-table": "^18.2.0",
|
|
55
55
|
"@atlaskit/form": "^12.0.0",
|
|
56
56
|
"@atlaskit/grid": "^0.18.0",
|
|
57
57
|
"@atlaskit/heading": "^5.2.0",
|
|
58
|
-
"@atlaskit/icon": "^27.
|
|
58
|
+
"@atlaskit/icon": "^27.6.0",
|
|
59
59
|
"@atlaskit/inline-message": "^15.3.0",
|
|
60
60
|
"@atlaskit/link": "^3.2.0",
|
|
61
61
|
"@atlaskit/lozenge": "^13.0.0",
|
|
62
62
|
"@atlaskit/popup": "^4.3.0",
|
|
63
63
|
"@atlaskit/primitives": "^14.10.0",
|
|
64
64
|
"@atlaskit/radio": "^8.1.0",
|
|
65
|
-
"@atlaskit/section-message": "^8.
|
|
66
|
-
"@atlaskit/select": "^21.
|
|
65
|
+
"@atlaskit/section-message": "^8.3.0",
|
|
66
|
+
"@atlaskit/select": "^21.2.0",
|
|
67
67
|
"@atlaskit/tag": "^14.0.0",
|
|
68
68
|
"@atlaskit/textarea": "^8.0.0",
|
|
69
69
|
"@atlaskit/textfield": "^8.0.0",
|
|
@@ -142,6 +142,9 @@
|
|
|
142
142
|
"platform-component-visual-refresh": {
|
|
143
143
|
"type": "boolean"
|
|
144
144
|
},
|
|
145
|
+
"platform-default-typography-refreshed": {
|
|
146
|
+
"type": "boolean"
|
|
147
|
+
},
|
|
145
148
|
"platform-default-typography-modernized": {
|
|
146
149
|
"type": "boolean"
|
|
147
150
|
},
|