@atlaskit/tokens 11.4.3 → 12.0.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.
- package/CHANGELOG.md +58 -0
- package/dist/cjs/artifacts/palettes-raw/motion-palette.js +123 -305
- package/dist/cjs/artifacts/replacement-mapping.js +82 -7
- package/dist/cjs/artifacts/themes/atlassian-motion.js +2 -2
- package/dist/cjs/artifacts/token-default-values.js +50 -25
- package/dist/cjs/artifacts/token-names.js +32 -7
- package/dist/cjs/artifacts/tokens-raw/atlassian-motion.js +653 -135
- package/dist/es2019/artifacts/palettes-raw/motion-palette.js +123 -305
- package/dist/es2019/artifacts/replacement-mapping.js +82 -7
- package/dist/es2019/artifacts/themes/atlassian-motion.js +64 -91
- package/dist/es2019/artifacts/token-default-values.js +50 -25
- package/dist/es2019/artifacts/token-names.js +32 -7
- package/dist/es2019/artifacts/tokens-raw/atlassian-motion.js +653 -135
- package/dist/esm/artifacts/palettes-raw/motion-palette.js +123 -305
- package/dist/esm/artifacts/replacement-mapping.js +82 -7
- package/dist/esm/artifacts/themes/atlassian-motion.js +2 -2
- package/dist/esm/artifacts/token-default-values.js +50 -25
- package/dist/esm/artifacts/token-names.js +32 -7
- package/dist/esm/artifacts/tokens-raw/atlassian-motion.js +653 -135
- package/dist/types/artifacts/palettes-raw/motion-palette.d.ts +3 -15
- package/dist/types/artifacts/replacement-mapping.d.ts +1 -1
- package/dist/types/artifacts/themes/atlassian-motion.d.ts +2 -2
- package/dist/types/artifacts/token-default-values.d.ts +50 -25
- package/dist/types/artifacts/token-names.d.ts +63 -13
- package/dist/types/artifacts/tokens-raw/atlassian-motion.d.ts +5 -5
- package/dist/types/entry-points/css-type-schema.codegen.d.ts +5 -2
- package/dist/types/types.d.ts +93 -14
- package/dist/types-ts4.5/artifacts/palettes-raw/motion-palette.d.ts +3 -15
- package/dist/types-ts4.5/artifacts/replacement-mapping.d.ts +1 -1
- package/dist/types-ts4.5/artifacts/themes/atlassian-motion.d.ts +2 -2
- package/dist/types-ts4.5/artifacts/token-default-values.d.ts +50 -25
- package/dist/types-ts4.5/artifacts/token-names.d.ts +63 -13
- package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-motion.d.ts +5 -5
- package/dist/types-ts4.5/entry-points/css-type-schema.codegen.d.ts +5 -2
- package/dist/types-ts4.5/types.d.ts +93 -14
- package/package.json +8 -8
|
@@ -12,7 +12,7 @@
|
|
|
12
12
|
* These changes will then be picked up by our tooling which will attempt to
|
|
13
13
|
* migrate as many of these renames as possible.
|
|
14
14
|
*
|
|
15
|
-
* @codegen <<SignedSource::
|
|
15
|
+
* @codegen <<SignedSource::26489b868b6a67a598f0fa4a421cae65>>
|
|
16
16
|
* @codegenCommand yarn build tokens
|
|
17
17
|
*/
|
|
18
18
|
|
|
@@ -26,22 +26,49 @@ var replacementMapper = [{
|
|
|
26
26
|
"path": "motion.avatar.hovered",
|
|
27
27
|
"state": "experimental"
|
|
28
28
|
}, {
|
|
29
|
-
"path": "motion.
|
|
29
|
+
"path": "motion.blanket.enter",
|
|
30
30
|
"state": "experimental"
|
|
31
31
|
}, {
|
|
32
|
-
"path": "motion.
|
|
32
|
+
"path": "motion.blanket.exit",
|
|
33
33
|
"state": "experimental"
|
|
34
34
|
}, {
|
|
35
|
-
"path": "motion.
|
|
35
|
+
"path": "motion.duration.instant",
|
|
36
36
|
"state": "experimental"
|
|
37
37
|
}, {
|
|
38
|
-
"path": "motion.
|
|
38
|
+
"path": "motion.duration.long",
|
|
39
39
|
"state": "experimental"
|
|
40
40
|
}, {
|
|
41
|
-
"path": "motion.
|
|
41
|
+
"path": "motion.duration.medium",
|
|
42
42
|
"state": "experimental"
|
|
43
43
|
}, {
|
|
44
|
-
"path": "motion.
|
|
44
|
+
"path": "motion.duration.short",
|
|
45
|
+
"state": "experimental"
|
|
46
|
+
}, {
|
|
47
|
+
"path": "motion.duration.xlong",
|
|
48
|
+
"state": "experimental"
|
|
49
|
+
}, {
|
|
50
|
+
"path": "motion.duration.xshort",
|
|
51
|
+
"state": "experimental"
|
|
52
|
+
}, {
|
|
53
|
+
"path": "motion.duration.xxlong",
|
|
54
|
+
"state": "experimental"
|
|
55
|
+
}, {
|
|
56
|
+
"path": "motion.duration.xxshort",
|
|
57
|
+
"state": "experimental"
|
|
58
|
+
}, {
|
|
59
|
+
"path": "motion.easing.in.practical",
|
|
60
|
+
"state": "experimental"
|
|
61
|
+
}, {
|
|
62
|
+
"path": "motion.easing.inout.bold",
|
|
63
|
+
"state": "experimental"
|
|
64
|
+
}, {
|
|
65
|
+
"path": "motion.easing.out.practical",
|
|
66
|
+
"state": "experimental"
|
|
67
|
+
}, {
|
|
68
|
+
"path": "motion.easing.out.bold",
|
|
69
|
+
"state": "experimental"
|
|
70
|
+
}, {
|
|
71
|
+
"path": "motion.easing.spring",
|
|
45
72
|
"state": "experimental"
|
|
46
73
|
}, {
|
|
47
74
|
"path": "motion.flag.enter",
|
|
@@ -52,6 +79,54 @@ var replacementMapper = [{
|
|
|
52
79
|
}, {
|
|
53
80
|
"path": "motion.flag.reposition",
|
|
54
81
|
"state": "experimental"
|
|
82
|
+
}, {
|
|
83
|
+
"path": "motion.keyframe.fade.in",
|
|
84
|
+
"state": "experimental"
|
|
85
|
+
}, {
|
|
86
|
+
"path": "motion.keyframe.fade.out",
|
|
87
|
+
"state": "experimental"
|
|
88
|
+
}, {
|
|
89
|
+
"path": "motion.keyframe.scale.in.medium",
|
|
90
|
+
"state": "experimental"
|
|
91
|
+
}, {
|
|
92
|
+
"path": "motion.keyframe.scale.in.small",
|
|
93
|
+
"state": "experimental"
|
|
94
|
+
}, {
|
|
95
|
+
"path": "motion.keyframe.scale.out.medium",
|
|
96
|
+
"state": "experimental"
|
|
97
|
+
}, {
|
|
98
|
+
"path": "motion.keyframe.scale.out.small",
|
|
99
|
+
"state": "experimental"
|
|
100
|
+
}, {
|
|
101
|
+
"path": "motion.keyframe.slide.in.bottom.short",
|
|
102
|
+
"state": "experimental"
|
|
103
|
+
}, {
|
|
104
|
+
"path": "motion.keyframe.slide.in.left.half",
|
|
105
|
+
"state": "experimental"
|
|
106
|
+
}, {
|
|
107
|
+
"path": "motion.keyframe.slide.in.left.short",
|
|
108
|
+
"state": "experimental"
|
|
109
|
+
}, {
|
|
110
|
+
"path": "motion.keyframe.slide.in.right.short",
|
|
111
|
+
"state": "experimental"
|
|
112
|
+
}, {
|
|
113
|
+
"path": "motion.keyframe.slide.in.top.short",
|
|
114
|
+
"state": "experimental"
|
|
115
|
+
}, {
|
|
116
|
+
"path": "motion.keyframe.slide.out.bottom.short",
|
|
117
|
+
"state": "experimental"
|
|
118
|
+
}, {
|
|
119
|
+
"path": "motion.keyframe.slide.out.left.half",
|
|
120
|
+
"state": "experimental"
|
|
121
|
+
}, {
|
|
122
|
+
"path": "motion.keyframe.slide.out.left.short",
|
|
123
|
+
"state": "experimental"
|
|
124
|
+
}, {
|
|
125
|
+
"path": "motion.keyframe.slide.out.right.short",
|
|
126
|
+
"state": "experimental"
|
|
127
|
+
}, {
|
|
128
|
+
"path": "motion.keyframe.slide.out.top.short",
|
|
129
|
+
"state": "experimental"
|
|
55
130
|
}, {
|
|
56
131
|
"path": "motion.modal.enter",
|
|
57
132
|
"state": "experimental"
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
|
|
3
|
-
* @codegen <<SignedSource::
|
|
3
|
+
* @codegen <<SignedSource::e2c90de3fa6bd9d4da20a85c310b97e2>>
|
|
4
4
|
* @codegenCommand yarn build tokens
|
|
5
5
|
*/
|
|
6
|
-
export default "\n@keyframes
|
|
6
|
+
export default "\n@keyframes SlideInTop8px {\n 0% {\n transform: translateY(8px);\n }\n 100% {\n transform: translateY(0px);\n }\n}\n@keyframes SlideInBottom8px {\n 0% {\n transform: translateY(-8px);\n }\n 100% {\n transform: translateY(0px);\n }\n}\n@keyframes SlideInLeft8px {\n 0% {\n transform: translateX(8px);\n }\n 100% {\n transform: translateX(0px);\n }\n}\n@keyframes SlideInRight8px {\n 0% {\n transform: translateX(-8px);\n }\n 100% {\n transform: translateX(0px);\n }\n}\n@keyframes SlideOutTop8px {\n 0% {\n transform: translateY(0px);\n }\n 100% {\n transform: translateY(4px);\n }\n}\n@keyframes SlideOutBottom8px {\n 0% {\n transform: translateY(0px);\n }\n 100% {\n transform: translateY(-4px);\n }\n}\n@keyframes SlideOutLeft8px {\n 0% {\n transform: translateX(0px);\n }\n 100% {\n transform: translateX(4px);\n }\n}\n@keyframes SlideOutRight8px {\n 0% {\n transform: translateX(0px);\n }\n 100% {\n transform: translateX(-4px);\n }\n}\n@keyframes ScaleIn80to100 {\n 0% {\n transform: scale(0.8);\n }\n 100% {\n transform: scale(1);\n }\n}\n@keyframes ScaleIn95to100 {\n 0% {\n transform: scale(0.95);\n }\n 100% {\n transform: scale(1);\n }\n}\n@keyframes ScaleOut100to80 {\n 0% {\n transform: scale(1);\n }\n 100% {\n transform: scale(0.8);\n }\n}\n@keyframes ScaleOut100to95 {\n 0% {\n transform: scale(1);\n }\n 100% {\n transform: scale(0.95);\n }\n}\n@keyframes FadeIn0to100 {\n 0% {\n opacity: 0;\n }\n 100% {\n opacity: 1;\n }\n}\n@keyframes FadeOut100to0 {\n 0% {\n opacity: 1;\n }\n 100% {\n opacity: 0;\n }\n}\n@keyframes SlideOut15PercentLeft {\n 0% {\n transform: translateX(0px);\n transform-origin: left;\n }\n 100% {\n transform: translateX(-15%);\n transform-origin: left;\n }\n}\n@keyframes SlideIn50PercentLeft {\n 0% {\n transform: translateX(-50%);\n transform-origin: left;\n }\n 100% {\n transform: translateX(0px);\n transform-origin: left;\n }\n}\nhtml[data-theme~=\"motion:motion\"], [data-subtree-theme][data-theme~=\"motion:motion\"] {\n --ds-avatar-enter: 150ms cubic-bezier(0.4, 1, 0.6, 1) ScaleIn80to100, 150ms cubic-bezier(0.4, 1, 0.6, 1) FadeIn0to100;\n --ds-avatar-exit: 100ms cubic-bezier(0.6, 0, 0.8, 0.6) ScaleOut100to80, 100ms cubic-bezier(0.6, 0, 0.8, 0.6) FadeOut100to0;\n --ds-avatar-hovered: transform 250ms linear(0, 0.021, 0.058, 0.107, 0.164, 0.227, 0.292, 0.359, 0.425, 0.49, 0.552, 0.61, 0.664, 0.714, 0.759, 0.8, 0.837, 0.869, 0.898, 0.922, 0.943, 0.961, 0.976, 0.988, 0.998, 1.006, 1.013, 1.017, 1.02, 1.023, 1.024, 1.024, 1.024, 1.024, 1.023, 1.022, 1.02, 1.019, 1.017, 1.015, 1.014, 1.012, 1.011, 1.009, 1.008, 1.007, 1.006, 1.005, 1.004, 1.003, 1.002, 1.002, 1.001, 1.001, 1.001, 1, 1, 1, 1, 1, 0.999, 0.999, 0.999, 0.999, 1);\n --ds-blanket-enter: 250ms cubic-bezier(0.4, 0, 0, 1) FadeIn0to100;\n --ds-blanket-exit: 200ms cubic-bezier(0.6, 0, 0.8, 0.6) FadeOut100to0;\n --ds-duration-instant: 0ms;\n --ds-duration-long: 250ms;\n --ds-duration-medium: 200ms;\n --ds-duration-short: 150ms;\n --ds-duration-xlong: 400ms;\n --ds-duration-xshort: 100ms;\n --ds-duration-xxlong: 600ms;\n --ds-duration-xxshort: 50ms;\n --ds-easing-in-practical: cubic-bezier(0.6, 0, 0.8, 0.6);\n --ds-easing-inout-bold: cubic-bezier(0.4, 0, 0, 1);\n --ds-easing-out-practical: cubic-bezier(0.4, 1, 0.6, 1);\n --ds-easing-out-bold: cubic-bezier(0, 0.4, 0, 1);\n --ds-easing-spring: linear(0, 0.021, 0.058, 0.107, 0.164, 0.227, 0.292, 0.359, 0.425, 0.49, 0.552, 0.61, 0.664, 0.714, 0.759, 0.8, 0.837, 0.869, 0.898, 0.922, 0.943, 0.961, 0.976, 0.988, 0.998, 1.006, 1.013, 1.017, 1.02, 1.023, 1.024, 1.024, 1.024, 1.024, 1.023, 1.022, 1.02, 1.019, 1.017, 1.015, 1.014, 1.012, 1.011, 1.009, 1.008, 1.007, 1.006, 1.005, 1.004, 1.003, 1.002, 1.002, 1.001, 1.001, 1.001, 1, 1, 1, 1, 1, 0.999, 0.999, 0.999, 0.999, 1);\n --ds-flag-enter: 250ms cubic-bezier(0, 0.4, 0, 1) SlideIn50PercentLeft, 250ms cubic-bezier(0, 0.4, 0, 1) FadeIn0to100;\n --ds-flag-exit: 200ms cubic-bezier(0.6, 0, 0.8, 0.6) SlideOut15PercentLeft, 200ms cubic-bezier(0.6, 0, 0.8, 0.6) FadeOut100to0;\n --ds-flag-reposition: transform 250ms cubic-bezier(0.4, 0, 0, 1);\n --ds-keyframe-fade-in: FadeIn0to100;\n --ds-keyframe-fade-out: FadeOut100to0;\n --ds-keyframe-scale-in-medium: ScaleIn80to100;\n --ds-keyframe-scale-in-small: ScaleIn95to100;\n --ds-keyframe-scale-out-medium: ScaleOut100to80;\n --ds-keyframe-scale-out-small: ScaleOut100to95;\n --ds-keyframe-slide-in-bottom-short: SlideInBottom8px;\n --ds-keyframe-slide-in-left-half: SlideIn50PercentLeft;\n --ds-keyframe-slide-in-left-short: SlideInLeft8px;\n --ds-keyframe-slide-in-right-short: SlideInRight8px;\n --ds-keyframe-slide-in-top-short: SlideInTop8px;\n --ds-keyframe-slide-out-bottom-short: SlideOutBottom8px;\n --ds-keyframe-slide-out-left-half: SlideOut15PercentLeft;\n --ds-keyframe-slide-out-left-short: SlideOutLeft8px;\n --ds-keyframe-slide-out-right-short: SlideOutRight8px;\n --ds-keyframe-slide-out-top-short: SlideOutTop8px;\n --ds-modal-enter: 250ms cubic-bezier(0.4, 0, 0, 1) ScaleIn95to100;\n --ds-modal-exit: 200ms cubic-bezier(0.6, 0, 0.8, 0.6) ScaleOut100to95;\n --ds-popup-enter-bottom: 150ms cubic-bezier(0.4, 1, 0.6, 1) SlideInBottom8px, 150ms cubic-bezier(0.4, 1, 0.6, 1) FadeIn0to100;\n --ds-popup-enter-left: 150ms cubic-bezier(0.4, 1, 0.6, 1) SlideInLeft8px, 150ms cubic-bezier(0.4, 1, 0.6, 1) FadeIn0to100;\n --ds-popup-enter-right: 150ms cubic-bezier(0.4, 1, 0.6, 1) SlideInRight8px, 150ms cubic-bezier(0.4, 1, 0.6, 1) FadeIn0to100;\n --ds-popup-enter-top: 150ms cubic-bezier(0.4, 1, 0.6, 1) SlideInTop8px, 150ms cubic-bezier(0.4, 1, 0.6, 1) FadeIn0to100;\n --ds-popup-exit-bottom: 100ms cubic-bezier(0.6, 0, 0.8, 0.6) SlideOutBottom8px, 100ms cubic-bezier(0.6, 0, 0.8, 0.6) FadeOut100to0;\n --ds-popup-exit-left: 100ms cubic-bezier(0.6, 0, 0.8, 0.6) SlideOutLeft8px, 100ms cubic-bezier(0.6, 0, 0.8, 0.6) FadeOut100to0;\n --ds-popup-exit-right: 100ms cubic-bezier(0.6, 0, 0.8, 0.6) SlideOutRight8px, 100ms cubic-bezier(0.6, 0, 0.8, 0.6) FadeOut100to0;\n --ds-popup-exit-top: 100ms cubic-bezier(0.6, 0, 0.8, 0.6) SlideOutTop8px, 100ms cubic-bezier(0.6, 0, 0.8, 0.6) FadeOut100to0;\n --ds-spotlight-enter: 250ms cubic-bezier(0.4, 0, 0, 1) ScaleIn95to100, 250ms cubic-bezier(0.4, 0, 0, 1) FadeIn0to100;\n --ds-spotlight-exit: 200ms cubic-bezier(0.6, 0, 0.8, 0.6) ScaleOut100to95, 200ms cubic-bezier(0.6, 0, 0.8, 0.6) FadeOut100to0;\n}\n";
|
|
@@ -7,34 +7,59 @@
|
|
|
7
7
|
* Token names mapped to their value in the default Atlassian themes ('light').
|
|
8
8
|
* These default values are used by the Babel plugin to optionally provide automatic fallbacks.
|
|
9
9
|
*
|
|
10
|
-
* @codegen <<SignedSource::
|
|
10
|
+
* @codegen <<SignedSource::0fbc9a08bd94ff0842a2dd504e6a9ce6>>
|
|
11
11
|
* @codegenCommand yarn build tokens
|
|
12
12
|
*/
|
|
13
13
|
var defaultTokenValues = {
|
|
14
|
-
'motion.avatar.enter': '150ms cubic-bezier(0.
|
|
15
|
-
'motion.avatar.exit': '100ms cubic-bezier(0.
|
|
16
|
-
'motion.avatar.hovered': 'transform
|
|
17
|
-
'motion.
|
|
18
|
-
'motion.
|
|
19
|
-
'motion.
|
|
20
|
-
'motion.
|
|
21
|
-
'motion.
|
|
22
|
-
'motion.
|
|
23
|
-
'motion.
|
|
24
|
-
'motion.
|
|
25
|
-
'motion.
|
|
26
|
-
'motion.
|
|
27
|
-
'motion.
|
|
28
|
-
'motion.
|
|
29
|
-
'motion.
|
|
30
|
-
'motion.
|
|
31
|
-
'motion.
|
|
32
|
-
'motion.
|
|
33
|
-
'motion.
|
|
34
|
-
'motion.
|
|
35
|
-
'motion.
|
|
36
|
-
'motion.
|
|
37
|
-
'motion.
|
|
14
|
+
'motion.avatar.enter': '150ms cubic-bezier(0.4, 1, 0.6, 1) ScaleIn80to100, 150ms cubic-bezier(0.4, 1, 0.6, 1) FadeIn0to100',
|
|
15
|
+
'motion.avatar.exit': '100ms cubic-bezier(0.6, 0, 0.8, 0.6) ScaleOut100to80, 100ms cubic-bezier(0.6, 0, 0.8, 0.6) FadeOut100to0',
|
|
16
|
+
'motion.avatar.hovered': 'transform 250ms linear(0, 0.021, 0.058, 0.107, 0.164, 0.227, 0.292, 0.359, 0.425, 0.49, 0.552, 0.61, 0.664, 0.714, 0.759, 0.8, 0.837, 0.869, 0.898, 0.922, 0.943, 0.961, 0.976, 0.988, 0.998, 1.006, 1.013, 1.017, 1.02, 1.023, 1.024, 1.024, 1.024, 1.024, 1.023, 1.022, 1.02, 1.019, 1.017, 1.015, 1.014, 1.012, 1.011, 1.009, 1.008, 1.007, 1.006, 1.005, 1.004, 1.003, 1.002, 1.002, 1.001, 1.001, 1.001, 1, 1, 1, 1, 1, 0.999, 0.999, 0.999, 0.999, 1)',
|
|
17
|
+
'motion.blanket.enter': '250ms cubic-bezier(0.4, 0, 0, 1) FadeIn0to100',
|
|
18
|
+
'motion.blanket.exit': '200ms cubic-bezier(0.6, 0, 0.8, 0.6) FadeOut100to0',
|
|
19
|
+
'motion.duration.instant': '0ms',
|
|
20
|
+
'motion.duration.long': '250ms',
|
|
21
|
+
'motion.duration.medium': '200ms',
|
|
22
|
+
'motion.duration.short': '150ms',
|
|
23
|
+
'motion.duration.xlong': '400ms',
|
|
24
|
+
'motion.duration.xshort': '100ms',
|
|
25
|
+
'motion.duration.xxlong': '600ms',
|
|
26
|
+
'motion.duration.xxshort': '50ms',
|
|
27
|
+
'motion.easing.in.practical': 'cubic-bezier(0.6, 0, 0.8, 0.6)',
|
|
28
|
+
'motion.easing.inout.bold': 'cubic-bezier(0.4, 0, 0, 1)',
|
|
29
|
+
'motion.easing.out.practical': 'cubic-bezier(0.4, 1, 0.6, 1)',
|
|
30
|
+
'motion.easing.out.bold': 'cubic-bezier(0, 0.4, 0, 1)',
|
|
31
|
+
'motion.easing.spring': 'linear(0, 0.021, 0.058, 0.107, 0.164, 0.227, 0.292, 0.359, 0.425, 0.49, 0.552, 0.61, 0.664, 0.714, 0.759, 0.8, 0.837, 0.869, 0.898, 0.922, 0.943, 0.961, 0.976, 0.988, 0.998, 1.006, 1.013, 1.017, 1.02, 1.023, 1.024, 1.024, 1.024, 1.024, 1.023, 1.022, 1.02, 1.019, 1.017, 1.015, 1.014, 1.012, 1.011, 1.009, 1.008, 1.007, 1.006, 1.005, 1.004, 1.003, 1.002, 1.002, 1.001, 1.001, 1.001, 1, 1, 1, 1, 1, 0.999, 0.999, 0.999, 0.999, 1)',
|
|
32
|
+
'motion.flag.enter': '250ms cubic-bezier(0, 0.4, 0, 1) SlideIn50PercentLeft, 250ms cubic-bezier(0, 0.4, 0, 1) FadeIn0to100',
|
|
33
|
+
'motion.flag.exit': '200ms cubic-bezier(0.6, 0, 0.8, 0.6) SlideOut15PercentLeft, 200ms cubic-bezier(0.6, 0, 0.8, 0.6) FadeOut100to0',
|
|
34
|
+
'motion.flag.reposition': 'transform 250ms cubic-bezier(0.4, 0, 0, 1)',
|
|
35
|
+
'motion.keyframe.fade.in': 'FadeIn0to100',
|
|
36
|
+
'motion.keyframe.fade.out': 'FadeOut100to0',
|
|
37
|
+
'motion.keyframe.scale.in.medium': 'ScaleIn80to100',
|
|
38
|
+
'motion.keyframe.scale.in.small': 'ScaleIn95to100',
|
|
39
|
+
'motion.keyframe.scale.out.medium': 'ScaleOut100to80',
|
|
40
|
+
'motion.keyframe.scale.out.small': 'ScaleOut100to95',
|
|
41
|
+
'motion.keyframe.slide.in.bottom.short': 'SlideInBottom8px',
|
|
42
|
+
'motion.keyframe.slide.in.left.half': 'SlideIn50PercentLeft',
|
|
43
|
+
'motion.keyframe.slide.in.left.short': 'SlideInLeft8px',
|
|
44
|
+
'motion.keyframe.slide.in.right.short': 'SlideInRight8px',
|
|
45
|
+
'motion.keyframe.slide.in.top.short': 'SlideInTop8px',
|
|
46
|
+
'motion.keyframe.slide.out.bottom.short': 'SlideOutBottom8px',
|
|
47
|
+
'motion.keyframe.slide.out.left.half': 'SlideOut15PercentLeft',
|
|
48
|
+
'motion.keyframe.slide.out.left.short': 'SlideOutLeft8px',
|
|
49
|
+
'motion.keyframe.slide.out.right.short': 'SlideOutRight8px',
|
|
50
|
+
'motion.keyframe.slide.out.top.short': 'SlideOutTop8px',
|
|
51
|
+
'motion.modal.enter': '250ms cubic-bezier(0.4, 0, 0, 1) ScaleIn95to100',
|
|
52
|
+
'motion.modal.exit': '200ms cubic-bezier(0.6, 0, 0.8, 0.6) ScaleOut100to95',
|
|
53
|
+
'motion.popup.enter.bottom': '150ms cubic-bezier(0.4, 1, 0.6, 1) SlideInBottom8px, 150ms cubic-bezier(0.4, 1, 0.6, 1) FadeIn0to100',
|
|
54
|
+
'motion.popup.enter.left': '150ms cubic-bezier(0.4, 1, 0.6, 1) SlideInLeft8px, 150ms cubic-bezier(0.4, 1, 0.6, 1) FadeIn0to100',
|
|
55
|
+
'motion.popup.enter.right': '150ms cubic-bezier(0.4, 1, 0.6, 1) SlideInRight8px, 150ms cubic-bezier(0.4, 1, 0.6, 1) FadeIn0to100',
|
|
56
|
+
'motion.popup.enter.top': '150ms cubic-bezier(0.4, 1, 0.6, 1) SlideInTop8px, 150ms cubic-bezier(0.4, 1, 0.6, 1) FadeIn0to100',
|
|
57
|
+
'motion.popup.exit.bottom': '100ms cubic-bezier(0.6, 0, 0.8, 0.6) SlideOutBottom8px, 100ms cubic-bezier(0.6, 0, 0.8, 0.6) FadeOut100to0',
|
|
58
|
+
'motion.popup.exit.left': '100ms cubic-bezier(0.6, 0, 0.8, 0.6) SlideOutLeft8px, 100ms cubic-bezier(0.6, 0, 0.8, 0.6) FadeOut100to0',
|
|
59
|
+
'motion.popup.exit.right': '100ms cubic-bezier(0.6, 0, 0.8, 0.6) SlideOutRight8px, 100ms cubic-bezier(0.6, 0, 0.8, 0.6) FadeOut100to0',
|
|
60
|
+
'motion.popup.exit.top': '100ms cubic-bezier(0.6, 0, 0.8, 0.6) SlideOutTop8px, 100ms cubic-bezier(0.6, 0, 0.8, 0.6) FadeOut100to0',
|
|
61
|
+
'motion.spotlight.enter': '250ms cubic-bezier(0.4, 0, 0, 1) ScaleIn95to100, 250ms cubic-bezier(0.4, 0, 0, 1) FadeIn0to100',
|
|
62
|
+
'motion.spotlight.exit': '200ms cubic-bezier(0.6, 0, 0.8, 0.6) ScaleOut100to95, 200ms cubic-bezier(0.6, 0, 0.8, 0.6) FadeOut100to0',
|
|
38
63
|
'color.text': '#292A2E',
|
|
39
64
|
'color.text.accent.lime': '#4C6B1F',
|
|
40
65
|
'color.text.accent.lime.bolder': '#37471F',
|
|
@@ -1,21 +1,46 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
|
|
3
|
-
* @codegen <<SignedSource::
|
|
3
|
+
* @codegen <<SignedSource::c7da53f7a9d4a33334530aad043ae18b>>
|
|
4
4
|
* @codegenCommand yarn build tokens
|
|
5
5
|
*/
|
|
6
6
|
var tokens = {
|
|
7
7
|
'motion.avatar.enter': '--ds-avatar-enter',
|
|
8
8
|
'motion.avatar.exit': '--ds-avatar-exit',
|
|
9
9
|
'motion.avatar.hovered': '--ds-avatar-hovered',
|
|
10
|
-
'motion.
|
|
11
|
-
'motion.
|
|
12
|
-
'motion.
|
|
13
|
-
'motion.
|
|
14
|
-
'motion.
|
|
15
|
-
'motion.
|
|
10
|
+
'motion.blanket.enter': '--ds-blanket-enter',
|
|
11
|
+
'motion.blanket.exit': '--ds-blanket-exit',
|
|
12
|
+
'motion.duration.instant': '--ds-duration-instant',
|
|
13
|
+
'motion.duration.long': '--ds-duration-long',
|
|
14
|
+
'motion.duration.medium': '--ds-duration-medium',
|
|
15
|
+
'motion.duration.short': '--ds-duration-short',
|
|
16
|
+
'motion.duration.xlong': '--ds-duration-xlong',
|
|
17
|
+
'motion.duration.xshort': '--ds-duration-xshort',
|
|
18
|
+
'motion.duration.xxlong': '--ds-duration-xxlong',
|
|
19
|
+
'motion.duration.xxshort': '--ds-duration-xxshort',
|
|
20
|
+
'motion.easing.in.practical': '--ds-easing-in-practical',
|
|
21
|
+
'motion.easing.inout.bold': '--ds-easing-inout-bold',
|
|
22
|
+
'motion.easing.out.practical': '--ds-easing-out-practical',
|
|
23
|
+
'motion.easing.out.bold': '--ds-easing-out-bold',
|
|
24
|
+
'motion.easing.spring': '--ds-easing-spring',
|
|
16
25
|
'motion.flag.enter': '--ds-flag-enter',
|
|
17
26
|
'motion.flag.exit': '--ds-flag-exit',
|
|
18
27
|
'motion.flag.reposition': '--ds-flag-reposition',
|
|
28
|
+
'motion.keyframe.fade.in': '--ds-keyframe-fade-in',
|
|
29
|
+
'motion.keyframe.fade.out': '--ds-keyframe-fade-out',
|
|
30
|
+
'motion.keyframe.scale.in.medium': '--ds-keyframe-scale-in-medium',
|
|
31
|
+
'motion.keyframe.scale.in.small': '--ds-keyframe-scale-in-small',
|
|
32
|
+
'motion.keyframe.scale.out.medium': '--ds-keyframe-scale-out-medium',
|
|
33
|
+
'motion.keyframe.scale.out.small': '--ds-keyframe-scale-out-small',
|
|
34
|
+
'motion.keyframe.slide.in.bottom.short': '--ds-keyframe-slide-in-bottom-short',
|
|
35
|
+
'motion.keyframe.slide.in.left.half': '--ds-keyframe-slide-in-left-half',
|
|
36
|
+
'motion.keyframe.slide.in.left.short': '--ds-keyframe-slide-in-left-short',
|
|
37
|
+
'motion.keyframe.slide.in.right.short': '--ds-keyframe-slide-in-right-short',
|
|
38
|
+
'motion.keyframe.slide.in.top.short': '--ds-keyframe-slide-in-top-short',
|
|
39
|
+
'motion.keyframe.slide.out.bottom.short': '--ds-keyframe-slide-out-bottom-short',
|
|
40
|
+
'motion.keyframe.slide.out.left.half': '--ds-keyframe-slide-out-left-half',
|
|
41
|
+
'motion.keyframe.slide.out.left.short': '--ds-keyframe-slide-out-left-short',
|
|
42
|
+
'motion.keyframe.slide.out.right.short': '--ds-keyframe-slide-out-right-short',
|
|
43
|
+
'motion.keyframe.slide.out.top.short': '--ds-keyframe-slide-out-top-short',
|
|
19
44
|
'motion.modal.enter': '--ds-modal-enter',
|
|
20
45
|
'motion.modal.exit': '--ds-modal-exit',
|
|
21
46
|
'motion.popup.enter.bottom': '--ds-popup-enter-bottom',
|