@primer/primitives 10.4.0-rc.ea0a5a9d → 10.4.0-rc.eab36abe
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/dist/css/primitives.css +0 -6
- package/package.json +1 -1
- package/dist/css/functional/motion/motion.css +0 -6
- package/dist/docs/functional/motion/motion.json +0 -66
- package/dist/fallbacks/functional/motion/motion.json +0 -6
- package/dist/styleLint/functional/motion/motion.json +0 -66
- package/src/tokens/functional/motion/loading.json5 +0 -17
- package/src/tokens/functional/motion/patterns.json5 +0 -35
package/dist/css/primitives.css
CHANGED
|
@@ -43,12 +43,6 @@
|
|
|
43
43
|
--base-text-weight-normal: 400;
|
|
44
44
|
--base-text-weight-semibold: 600;
|
|
45
45
|
}
|
|
46
|
-
:root {
|
|
47
|
-
--motion-loading-delay-default: var(--base-duration-1000); /* The amount of time to wait before showing a loading indicator or announcing a loading state to assistive technologies. */
|
|
48
|
-
--motion-skeletonLoader-shimmer-duration-scale: var(--base-duration-1000); /* The amount of times it takes the "shimmer" effect to go from the start (left) of the skeleton loader to the end (right) */
|
|
49
|
-
--motion-spinner-duration-rotation: var(--base-duration-1000); /* The amount of time it takes the "Spinner" loading indicator to make a full 360deg rotation */
|
|
50
|
-
--motion-spinner-easing-rotation: var(--base-easing-linear); /* The easing curve for the "Spinner" loading indicator rotation */
|
|
51
|
-
}
|
|
52
46
|
:root {
|
|
53
47
|
--borderRadius-full: 624.9375rem; /* Use this border radius for pill shaped elements */
|
|
54
48
|
--borderRadius-large: 0.75rem;
|
package/package.json
CHANGED
|
@@ -1,6 +0,0 @@
|
|
|
1
|
-
:root {
|
|
2
|
-
--motion-loading-delay-default: var(--base-duration-1000); /* The amount of time to wait before showing a loading indicator or announcing a loading state to assistive technologies. */
|
|
3
|
-
--motion-skeletonLoader-shimmer-duration-scale: var(--base-duration-1000); /* The amount of times it takes the "shimmer" effect to go from the start (left) of the skeleton loader to the end (right) */
|
|
4
|
-
--motion-spinner-duration-rotation: var(--base-duration-1000); /* The amount of time it takes the "Spinner" loading indicator to make a full 360deg rotation */
|
|
5
|
-
--motion-spinner-easing-rotation: var(--base-easing-linear); /* The easing curve for the "Spinner" loading indicator rotation */
|
|
6
|
-
}
|
|
@@ -1,66 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"motion-loading-delay-default": {
|
|
3
|
-
"filePath": "src/tokens/functional/motion/loading.json5",
|
|
4
|
-
"isSource": true,
|
|
5
|
-
"original": {
|
|
6
|
-
"$value": "{base.duration.1000}",
|
|
7
|
-
"$type": "duration",
|
|
8
|
-
"$description": "The amount of time to wait before showing a loading indicator or announcing a loading state to assistive technologies."
|
|
9
|
-
},
|
|
10
|
-
"name": "motion-loading-delay-default",
|
|
11
|
-
"attributes": {},
|
|
12
|
-
"path": ["motion", "loading", "delay", "default"],
|
|
13
|
-
"key": "{motion.loading.delay.default}",
|
|
14
|
-
"value": "1000ms",
|
|
15
|
-
"type": "duration",
|
|
16
|
-
"description": "The amount of time to wait before showing a loading indicator or announcing a loading state to assistive technologies."
|
|
17
|
-
},
|
|
18
|
-
"motion-skeletonLoader-shimmer-duration-scale": {
|
|
19
|
-
"filePath": "src/tokens/functional/motion/patterns.json5",
|
|
20
|
-
"isSource": true,
|
|
21
|
-
"original": {
|
|
22
|
-
"$value": "{base.duration.1000}",
|
|
23
|
-
"$type": "duration",
|
|
24
|
-
"$description": "The amount of times it takes the \"shimmer\" effect to go from the start (left) of the skeleton loader to the end (right)"
|
|
25
|
-
},
|
|
26
|
-
"name": "motion-skeletonLoader-shimmer-duration-scale",
|
|
27
|
-
"attributes": {},
|
|
28
|
-
"path": ["motion", "skeletonLoader", "shimmer", "duration", "scale"],
|
|
29
|
-
"key": "{motion.skeletonLoader.shimmer.duration.scale}",
|
|
30
|
-
"value": "1000ms",
|
|
31
|
-
"type": "duration",
|
|
32
|
-
"description": "The amount of times it takes the \"shimmer\" effect to go from the start (left) of the skeleton loader to the end (right)"
|
|
33
|
-
},
|
|
34
|
-
"motion-spinner-duration-rotation": {
|
|
35
|
-
"filePath": "src/tokens/functional/motion/patterns.json5",
|
|
36
|
-
"isSource": true,
|
|
37
|
-
"original": {
|
|
38
|
-
"$value": "{base.duration.1000}",
|
|
39
|
-
"$type": "duration",
|
|
40
|
-
"$description": "The amount of time it takes the \"Spinner\" loading indicator to make a full 360deg rotation"
|
|
41
|
-
},
|
|
42
|
-
"name": "motion-spinner-duration-rotation",
|
|
43
|
-
"attributes": {},
|
|
44
|
-
"path": ["motion", "spinner", "duration", "rotation"],
|
|
45
|
-
"key": "{motion.spinner.duration.rotation}",
|
|
46
|
-
"value": "1000ms",
|
|
47
|
-
"type": "duration",
|
|
48
|
-
"description": "The amount of time it takes the \"Spinner\" loading indicator to make a full 360deg rotation"
|
|
49
|
-
},
|
|
50
|
-
"motion-spinner-easing-rotation": {
|
|
51
|
-
"filePath": "src/tokens/functional/motion/patterns.json5",
|
|
52
|
-
"isSource": true,
|
|
53
|
-
"original": {
|
|
54
|
-
"$value": "{base.easing.linear}",
|
|
55
|
-
"$type": "cubicBezier",
|
|
56
|
-
"$description": "The easing curve for the \"Spinner\" loading indicator rotation"
|
|
57
|
-
},
|
|
58
|
-
"name": "motion-spinner-easing-rotation",
|
|
59
|
-
"attributes": {},
|
|
60
|
-
"path": ["motion", "spinner", "easing", "rotation"],
|
|
61
|
-
"key": "{motion.spinner.easing.rotation}",
|
|
62
|
-
"value": [0, 0, 1, 1],
|
|
63
|
-
"type": "cubicBezier",
|
|
64
|
-
"description": "The easing curve for the \"Spinner\" loading indicator rotation"
|
|
65
|
-
}
|
|
66
|
-
}
|
|
@@ -1,66 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"motion-loading-delay-default": {
|
|
3
|
-
"$value": "1000ms",
|
|
4
|
-
"$type": "duration",
|
|
5
|
-
"$description": "The amount of time to wait before showing a loading indicator or announcing a loading state to assistive technologies.",
|
|
6
|
-
"filePath": "src/tokens/functional/motion/loading.json5",
|
|
7
|
-
"isSource": true,
|
|
8
|
-
"original": {
|
|
9
|
-
"$value": "{base.duration.1000}",
|
|
10
|
-
"$type": "duration",
|
|
11
|
-
"$description": "The amount of time to wait before showing a loading indicator or announcing a loading state to assistive technologies."
|
|
12
|
-
},
|
|
13
|
-
"name": "motion-loading-delay-default",
|
|
14
|
-
"attributes": {},
|
|
15
|
-
"path": ["motion", "loading", "delay", "default"],
|
|
16
|
-
"key": "{motion.loading.delay.default}"
|
|
17
|
-
},
|
|
18
|
-
"motion-skeletonLoader-shimmer-duration-scale": {
|
|
19
|
-
"$value": "1000ms",
|
|
20
|
-
"$type": "duration",
|
|
21
|
-
"$description": "The amount of times it takes the \"shimmer\" effect to go from the start (left) of the skeleton loader to the end (right)",
|
|
22
|
-
"filePath": "src/tokens/functional/motion/patterns.json5",
|
|
23
|
-
"isSource": true,
|
|
24
|
-
"original": {
|
|
25
|
-
"$value": "{base.duration.1000}",
|
|
26
|
-
"$type": "duration",
|
|
27
|
-
"$description": "The amount of times it takes the \"shimmer\" effect to go from the start (left) of the skeleton loader to the end (right)"
|
|
28
|
-
},
|
|
29
|
-
"name": "motion-skeletonLoader-shimmer-duration-scale",
|
|
30
|
-
"attributes": {},
|
|
31
|
-
"path": ["motion", "skeletonLoader", "shimmer", "duration", "scale"],
|
|
32
|
-
"key": "{motion.skeletonLoader.shimmer.duration.scale}"
|
|
33
|
-
},
|
|
34
|
-
"motion-spinner-duration-rotation": {
|
|
35
|
-
"$value": "1000ms",
|
|
36
|
-
"$type": "duration",
|
|
37
|
-
"$description": "The amount of time it takes the \"Spinner\" loading indicator to make a full 360deg rotation",
|
|
38
|
-
"filePath": "src/tokens/functional/motion/patterns.json5",
|
|
39
|
-
"isSource": true,
|
|
40
|
-
"original": {
|
|
41
|
-
"$value": "{base.duration.1000}",
|
|
42
|
-
"$type": "duration",
|
|
43
|
-
"$description": "The amount of time it takes the \"Spinner\" loading indicator to make a full 360deg rotation"
|
|
44
|
-
},
|
|
45
|
-
"name": "motion-spinner-duration-rotation",
|
|
46
|
-
"attributes": {},
|
|
47
|
-
"path": ["motion", "spinner", "duration", "rotation"],
|
|
48
|
-
"key": "{motion.spinner.duration.rotation}"
|
|
49
|
-
},
|
|
50
|
-
"motion-spinner-easing-rotation": {
|
|
51
|
-
"$value": [0, 0, 1, 1],
|
|
52
|
-
"$type": "cubicBezier",
|
|
53
|
-
"$description": "The easing curve for the \"Spinner\" loading indicator rotation",
|
|
54
|
-
"filePath": "src/tokens/functional/motion/patterns.json5",
|
|
55
|
-
"isSource": true,
|
|
56
|
-
"original": {
|
|
57
|
-
"$value": "{base.easing.linear}",
|
|
58
|
-
"$type": "cubicBezier",
|
|
59
|
-
"$description": "The easing curve for the \"Spinner\" loading indicator rotation"
|
|
60
|
-
},
|
|
61
|
-
"name": "motion-spinner-easing-rotation",
|
|
62
|
-
"attributes": {},
|
|
63
|
-
"path": ["motion", "spinner", "easing", "rotation"],
|
|
64
|
-
"key": "{motion.spinner.easing.rotation}"
|
|
65
|
-
}
|
|
66
|
-
}
|
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Loading
|
|
3
|
-
* @description Used for consistent durations of loading indicator animations
|
|
4
|
-
*/
|
|
5
|
-
{
|
|
6
|
-
motion: {
|
|
7
|
-
loading: {
|
|
8
|
-
delay: {
|
|
9
|
-
default: {
|
|
10
|
-
$value: '{base.duration.1000}',
|
|
11
|
-
$type: 'duration',
|
|
12
|
-
$description: 'The amount of time to wait before showing a loading indicator or announcing a loading state to assistive technologies.',
|
|
13
|
-
},
|
|
14
|
-
},
|
|
15
|
-
},
|
|
16
|
-
},
|
|
17
|
-
}
|
|
@@ -1,35 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Motion patterns
|
|
3
|
-
* @description Used to create animated components
|
|
4
|
-
*/
|
|
5
|
-
{
|
|
6
|
-
motion: {
|
|
7
|
-
spinner: {
|
|
8
|
-
duration: {
|
|
9
|
-
rotation: {
|
|
10
|
-
$value: '{base.duration.1000}',
|
|
11
|
-
$type: 'duration',
|
|
12
|
-
$description: 'The amount of time it takes the "Spinner" loading indicator to make a full 360deg rotation',
|
|
13
|
-
},
|
|
14
|
-
},
|
|
15
|
-
easing: {
|
|
16
|
-
rotation: {
|
|
17
|
-
$value: '{base.easing.linear}',
|
|
18
|
-
$type: 'cubicBezier',
|
|
19
|
-
$description: 'The easing curve for the "Spinner" loading indicator rotation',
|
|
20
|
-
},
|
|
21
|
-
},
|
|
22
|
-
},
|
|
23
|
-
skeletonLoader: {
|
|
24
|
-
shimmer: {
|
|
25
|
-
duration: {
|
|
26
|
-
scale: {
|
|
27
|
-
$value: '{base.duration.1000}',
|
|
28
|
-
$type: 'duration',
|
|
29
|
-
$description: 'The amount of times it takes the "shimmer" effect to go from the start (left) of the skeleton loader to the end (right)',
|
|
30
|
-
},
|
|
31
|
-
},
|
|
32
|
-
},
|
|
33
|
-
},
|
|
34
|
-
},
|
|
35
|
-
}
|