1 | /**
|
2 | * Shape of a Paste Design Token
|
3 | */
|
4 | export interface DesignToken {
|
5 | /** category of design token */
|
6 | category: string;
|
7 | comment?: string;
|
8 | name: string;
|
9 | /** value in the original format listed in the yaml file */
|
10 | originalValue: string;
|
11 | /** tokens that when paired with this token, must pass the text color contrast ratio requirement */
|
12 | text_contrast_pairing?: string[];
|
13 | /** tokens that when paired with this token, must pass the ui control color contrast ratio requirement */
|
14 | uicontrol_contrast_pairing?: string[];
|
15 | /** tokens that when paired with this token, must pass the data visualization color contrast ratio requirement */
|
16 | data_visualization_contrast_pairing?: string[];
|
17 | type: string;
|
18 | value: string;
|
19 | deprecated?: boolean;
|
20 | }
|
21 |
|
22 | export interface GenericDesignToken {
|
23 | /** category of design token */
|
24 | category: string;
|
25 | comment?: string;
|
26 | name: string;
|
27 | /** tokens that when paired with this token, must pass the text color contrast ratio requirement */
|
28 | text_contrast_pairing?: string[];
|
29 | /** tokens that when paired with this token, must pass the ui control color contrast ratio requirement */
|
30 | uicontrol_contrast_pairing?: string[];
|
31 | /** tokens that when paired with this token, must pass the data visualization color contrast ratio requirement */
|
32 | data_visualization_contrast_pairing?: string[];
|
33 | type: string;
|
34 | value: string;
|
35 | altValue: string | null;
|
36 | deprecated?: boolean;
|
37 | }
|
38 |
|
39 | /**
|
40 | * Shape of the Paste Design Token JSON Object
|
41 | */
|
42 | export interface DesignTokensJSON {
|
43 | [key: string]: DesignToken;
|
44 | }
|
45 |
|
46 | /**
|
47 | * Object represeting the color contrast rating between two design tokens
|
48 | *
|
49 | * @export
|
50 | * @interface TokenPairContrastRating
|
51 | */
|
52 | export interface TokenPairContrastRating {
|
53 | foreground: string;
|
54 | foregroundValue: string;
|
55 | background: string;
|
56 | backgroundValue: string;
|
57 | /**
|
58 | * color contrast ration between the foreground and backgound color
|
59 | */
|
60 | contrast: number;
|
61 | /**
|
62 | * WCAG AA text contrast rating
|
63 | */
|
64 | aa: boolean;
|
65 | /**
|
66 | * WCAG AA text contrast rating for bold text 18px and above or large text 24px and above.
|
67 | * WCAG AA UI contrast rating for UI controls against their background
|
68 | */
|
69 | aaLarge: boolean;
|
70 | /**
|
71 | * WCAG AAA text contrast rating
|
72 | */
|
73 | aaa: boolean;
|
74 | /**
|
75 | * WCAG AAA text contrast rating for bold text 18px and above or large text 24px and above
|
76 | */
|
77 | aaaLarge: boolean;
|
78 | }
|