keyframekit 1.1.4 → 1.1.6
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/README.md +2 -2
- package/dist/KeyframeKit.d.ts +41 -8
- package/dist/KeyframeKit.d.ts.map +1 -1
- package/dist/KeyframeKit.js +38 -5
- package/dist/KeyframeKit.js.map +1 -1
- package/docs/.vitepress/config.ts +2 -2
- package/docs/.vitepress/theme/base-styles.css +4 -0
- package/docs/docs/public/playground/KeyframeKit/dist/KeyframeKit.d.ts +41 -8
- package/docs/docs/public/playground/KeyframeKit/dist/KeyframeKit.d.ts.map +1 -1
- package/docs/docs/public/playground/KeyframeKit/dist/KeyframeKit.js +38 -5
- package/docs/docs/public/playground/KeyframeKit/dist/KeyframeKit.js.map +1 -1
- package/docs/docs/reference/classes/KeyframeEffectParameters.md +5 -3
- package/docs/docs/reference/index.md +1 -1
- package/docs/docs/reference/interfaces/KeyframesFactory.md +33 -4
- package/docs/docs/reference/navigation.json +4 -4
- package/docs/docs/reference/type-aliases/CSSStyleSheetSource.md +7 -0
- package/docs/package.json +3 -6
- package/docs/typedoc/plugin-markdown-fix.js +43 -0
- package/docs/typedoc/plugin-param-names.js +10 -45
- package/docs/{typedoc.json → typedoc.config.js} +25 -10
- package/package.json +1 -1
- package/src/KeyframeKit.ts +42 -10
- package/docs/docs/reference/_media/LICENSE +0 -21
- package/docs/docs/reference/type-aliases/KeyframesFactorySource.md +0 -9
package/README.md
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
# <img src="/docs/docs/public/icon.png" width="30px" height="40px">
|
|
1
|
+
# [<img src="/docs/docs/public/icon.png" width="30px" height="40px"> KeyframeKit][1]
|
|
2
2
|
|
|
3
3
|
Unlock fine-grained control over your CSS animations with JavaScript.
|
|
4
4
|
|
|
5
|
-
[](/LICENSE) [](https://www.npmjs.com/package/keyframekit)
|
|
5
|
+
[](/LICENSE) [](https://www.npmjs.com/package/keyframekit) [](https://www.npmjs.com/package/keyframekit)
|
|
6
6
|
|
|
7
7
|
## About
|
|
8
8
|
|
package/dist/KeyframeKit.d.ts
CHANGED
|
@@ -1,7 +1,8 @@
|
|
|
1
|
-
export type
|
|
1
|
+
export type CSSStyleSheetSource = CSSStyleSheet | StyleSheetList;
|
|
2
2
|
declare class KeyframesFactory {
|
|
3
3
|
#private;
|
|
4
4
|
readonly Error: {
|
|
5
|
+
/** Keyframes rule name must be a string. */
|
|
5
6
|
readonly KeyframesRuleNameTypeError: {
|
|
6
7
|
new (message?: string): {
|
|
7
8
|
message: string;
|
|
@@ -29,6 +30,7 @@ declare class KeyframesFactory {
|
|
|
29
30
|
};
|
|
30
31
|
isError(error: unknown): error is Error;
|
|
31
32
|
};
|
|
33
|
+
/** Source must be either a `CSSStyleSheet` or a `StyleSheetList`. */
|
|
32
34
|
readonly SourceTypeError: {
|
|
33
35
|
new (message?: string): {
|
|
34
36
|
message: string;
|
|
@@ -56,6 +58,7 @@ declare class KeyframesFactory {
|
|
|
56
58
|
};
|
|
57
59
|
isError(error: unknown): error is Error;
|
|
58
60
|
};
|
|
61
|
+
/** The stylesheet could not be imported. */
|
|
59
62
|
readonly StyleSheetImportError: {
|
|
60
63
|
new (message?: string): {
|
|
61
64
|
message: string;
|
|
@@ -72,21 +75,48 @@ declare class KeyframesFactory {
|
|
|
72
75
|
isError(error: unknown): error is Error;
|
|
73
76
|
};
|
|
74
77
|
};
|
|
78
|
+
/**
|
|
79
|
+
* Gets a document's stylesheets when it loads,
|
|
80
|
+
* or immediately returns them if it's already loaded.
|
|
81
|
+
* @param obj
|
|
82
|
+
* @param obj.document The document to get stylesheets from.
|
|
83
|
+
*/
|
|
75
84
|
getDocumentStyleSheetsOnLoad({ document }?: {
|
|
76
85
|
document?: Document;
|
|
77
86
|
}): Promise<StyleSheetList>;
|
|
78
|
-
/**
|
|
87
|
+
/**
|
|
88
|
+
* Imports a stylesheet from a URL.
|
|
89
|
+
* @param url The URL of the stylesheet to import.
|
|
90
|
+
* @remarks
|
|
79
91
|
* Note: `@import` rules won't be resolved in imported stylesheets.
|
|
80
|
-
* See https://github.com/WICG/construct-stylesheets/issues/119#issuecomment-588352418.
|
|
92
|
+
* See https://github.com/WICG/construct-stylesheets/issues/119#issuecomment-588352418.
|
|
93
|
+
*/
|
|
81
94
|
importStyleSheet(url: string): Promise<CSSStyleSheet>;
|
|
82
|
-
/**
|
|
95
|
+
/**
|
|
96
|
+
* Gets a CSS keyframes rule from a stylesheet or stylesheet list,
|
|
97
|
+
* then converts it to Web Animations API keyframes.
|
|
98
|
+
* @param obj
|
|
99
|
+
* @param obj.of The name of the `@keyframes` rule to get keyframes from.
|
|
100
|
+
* @param obj.in The stylesheet or stylesheet list where the rule resides.
|
|
101
|
+
*/
|
|
83
102
|
getStyleSheetKeyframes({ of: ruleName, in: source }: {
|
|
84
103
|
of: string;
|
|
85
|
-
in:
|
|
104
|
+
in: CSSStyleSheetSource;
|
|
86
105
|
}): ParsedKeyframes | undefined;
|
|
106
|
+
/**
|
|
107
|
+
* Gets all the CSS keyframes rules in a stylesheet or stylesheet list,
|
|
108
|
+
* then converts them to Web Animations API keyframes.
|
|
109
|
+
* @param obj
|
|
110
|
+
* @param obj.in The style sheet or style sheet list to get keyframes from.
|
|
111
|
+
*/
|
|
87
112
|
getAllStyleSheetKeyframesRules({ in: source }: {
|
|
88
|
-
in:
|
|
113
|
+
in: CSSStyleSheetSource;
|
|
89
114
|
}): ParsedKeyframesRules;
|
|
115
|
+
/**
|
|
116
|
+
* Converts a CSS keyframes rule to Web Animations API keyframes.
|
|
117
|
+
* @param obj
|
|
118
|
+
* @param obj.rule The rule to convert.
|
|
119
|
+
*/
|
|
90
120
|
parseKeyframesRule({ rule: keyframes }: {
|
|
91
121
|
rule: CSSKeyframesRule;
|
|
92
122
|
}): ParsedKeyframes;
|
|
@@ -102,6 +132,7 @@ export declare class KeyframeEffectParameters {
|
|
|
102
132
|
keyframes: KeyframeArgument;
|
|
103
133
|
options: KeyframeEffectOptions;
|
|
104
134
|
/**
|
|
135
|
+
* @param obj
|
|
105
136
|
* @param obj.keyframes [MDN Reference](https://developer.mozilla.org/en-US/docs/Web/API/Web_Animations_API/Keyframe_Formats)
|
|
106
137
|
* @param obj.options [MDN Reference](https://developer.mozilla.org/en-US/docs/Web/API/KeyframeEffect/KeyframeEffect#options)
|
|
107
138
|
*/
|
|
@@ -110,9 +141,11 @@ export declare class KeyframeEffectParameters {
|
|
|
110
141
|
options?: number | KeyframeEffectOptions;
|
|
111
142
|
});
|
|
112
143
|
/**
|
|
144
|
+
* @param obj
|
|
113
145
|
* @param obj.target An element to attach the animation to.
|
|
114
146
|
* @param obj.options Additional keyframe effect options. Can override existing keys.
|
|
115
|
-
*
|
|
147
|
+
* [MDN Reference](https://developer.mozilla.org/en-US/docs/Web/API/KeyframeEffect/KeyframeEffect#options)
|
|
148
|
+
* @param obj.timeline [MDN Reference](https://developer.mozilla.org/en-US/docs/Web/API/Animation/Animation#timeline)
|
|
116
149
|
*
|
|
117
150
|
* @see Specifications:
|
|
118
151
|
* - https://drafts.csswg.org/web-animations-1/#the-keyframeeffect-interface
|
|
@@ -121,7 +154,7 @@ export declare class KeyframeEffectParameters {
|
|
|
121
154
|
toAnimation({ target, options: additionalOptions, timeline }: {
|
|
122
155
|
target: Element | null;
|
|
123
156
|
options?: number | KeyframeEffectOptions;
|
|
124
|
-
timeline?: AnimationTimeline;
|
|
157
|
+
timeline?: AnimationTimeline | null;
|
|
125
158
|
}): Animation;
|
|
126
159
|
}
|
|
127
160
|
export declare class ParsedKeyframes {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"KeyframeKit.d.ts","sourceRoot":"","sources":["../src/KeyframeKit.ts"],"names":[],"mappings":"AAgBA,MAAM,MAAM,
|
|
1
|
+
{"version":3,"file":"KeyframeKit.d.ts","sourceRoot":"","sources":["../src/KeyframeKit.ts"],"names":[],"mappings":"AAgBA,MAAM,MAAM,mBAAmB,GAAG,aAAa,GAAG,cAAc,CAAC;AAEjE,cAAM,gBAAgB;;IAEpB,QAAQ,CAAC,KAAK;QACZ,4CAA4C;;;;;;;;;;;;;;;;;;;;;;;;;;;;QAI5C,qEAAqE;;;;;;;;;;;;;;;;;;;;;;;;;;;;QAIrE,4CAA4C;;;;;;;;;;;;;;;;MAInC;IAGX;;;;;OAKG;IACG,4BAA4B,CAAC,EAAE,QAA0B,EAAE,GAAE;QACjE,QAAQ,CAAC,EAAE,QAAQ,CAAA;KACf;IAWN;;;;;;OAMG;IACG,gBAAgB,CAAC,GAAG,EAAE,MAAM;IAwBlC;;;;;;OAMG;IACH,sBAAsB,CAAC,EAAE,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE;QACnD,EAAE,EAAE,MAAM,CAAC;QACX,EAAE,EAAE,mBAAmB,CAAA;KACxB,GAAG,eAAe,GAAG,SAAS;IA0E/B;;;;;OAKG;IACH,8BAA8B,CAAC,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE;QAC7C,EAAE,EAAE,mBAAmB,CAAA;KACxB,GAAG,oBAAoB;IAsExB;;;;OAIG;IACH,kBAAkB,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;QACtC,IAAI,EAAE,gBAAgB,CAAA;KACvB,GAAG,eAAe;CAiHpB;;AAED,wBAAsC;AACtC,YAAY,EAAE,gBAAgB,EAAE,CAAC;AAMjC,iFAAiF;AACjF,MAAM,MAAM,gBAAgB,GAAG,QAAQ,EAAE,GAAG,wBAAwB,CAAC;AAErE,8EAA8E;AAC9E,qBAAa,wBAAwB;;IAEnC,SAAS,EAAE,gBAAgB,CAAC;IAC5B,OAAO,EAAE,qBAAqB,CAAC;IAE/B;;;;OAIG;gBACS,EAAE,SAAS,EAAE,OAAY,EAAE,EAAE;QACvC,SAAS,EAAE,gBAAgB,CAAC;QAC5B,OAAO,CAAC,EAAE,MAAM,GAAG,qBAAqB,CAAA;KACzC;IAKD;;;;;;;;;;OAUG;IACH,WAAW,CAAC,EAAE,MAAM,EAAE,OAAO,EAAE,iBAAsB,EAAE,QAA4B,EAAE,EAAE;QACrF,MAAM,EAAE,OAAO,GAAG,IAAI,CAAC;QACvB,OAAO,CAAC,EAAE,MAAM,GAAG,qBAAqB,CAAC;QACzC,QAAQ,CAAC,EAAE,iBAAiB,GAAG,IAAI,CAAA;KACpC,GAAG,SAAS;CAqCd;AAGD,qBAAa,eAAe;IAE1B,SAAS,EAAE,QAAQ,EAAE,CAAC;gBAEV,SAAS,EAAE,QAAQ,EAAE;IAIjC;;;OAGG;IACH,gBAAgB,CACd,OAAO,EAAE,MAAM,GAAG,qBAAqB,GAAG,IAAI,GAC7C,wBAAwB;CAwB5B;AAGD,MAAM,MAAM,oBAAoB,GAAG;IACjC,CAAC,QAAQ,EAAE,MAAM,GAAG,eAAe,CAAA;CACpC,CAAC"}
|
package/dist/KeyframeKit.js
CHANGED
|
@@ -12,25 +12,38 @@ const CHARS = {
|
|
|
12
12
|
};
|
|
13
13
|
class KeyframesFactory {
|
|
14
14
|
Error = {
|
|
15
|
+
/** Keyframes rule name must be a string. */
|
|
15
16
|
KeyframesRuleNameTypeError: class KeyframesRuleNameTypeError extends TypeError {
|
|
16
17
|
message = `Keyframes rule name must be a string.`;
|
|
17
18
|
},
|
|
19
|
+
/** Source must be either a `CSSStyleSheet` or a `StyleSheetList`. */
|
|
18
20
|
SourceTypeError: class SourceTypeError extends TypeError {
|
|
19
|
-
message = `Source must be either a
|
|
21
|
+
message = `Source must be either a CSSStyleSheet or a StyleSheetList.`;
|
|
20
22
|
},
|
|
23
|
+
/** The stylesheet could not be imported. */
|
|
21
24
|
StyleSheetImportError: class StyleSheetImportError extends Error {
|
|
22
25
|
message = `The stylesheet could not be imported.`;
|
|
23
26
|
}
|
|
24
27
|
};
|
|
28
|
+
/**
|
|
29
|
+
* Gets a document's stylesheets when it loads,
|
|
30
|
+
* or immediately returns them if it's already loaded.
|
|
31
|
+
* @param obj
|
|
32
|
+
* @param obj.document The document to get stylesheets from.
|
|
33
|
+
*/
|
|
25
34
|
async getDocumentStyleSheetsOnLoad({ document = window.document } = {}) {
|
|
26
35
|
await waitForDocumentLoad({
|
|
27
36
|
document: document
|
|
28
37
|
});
|
|
29
38
|
return document.styleSheets;
|
|
30
39
|
}
|
|
31
|
-
/**
|
|
40
|
+
/**
|
|
41
|
+
* Imports a stylesheet from a URL.
|
|
42
|
+
* @param url The URL of the stylesheet to import.
|
|
43
|
+
* @remarks
|
|
32
44
|
* Note: `@import` rules won't be resolved in imported stylesheets.
|
|
33
|
-
* See https://github.com/WICG/construct-stylesheets/issues/119#issuecomment-588352418.
|
|
45
|
+
* See https://github.com/WICG/construct-stylesheets/issues/119#issuecomment-588352418.
|
|
46
|
+
*/
|
|
34
47
|
async importStyleSheet(url) {
|
|
35
48
|
const resp = await fetch(url);
|
|
36
49
|
if (!resp.ok) {
|
|
@@ -45,7 +58,13 @@ class KeyframesFactory {
|
|
|
45
58
|
await styleSheet.replace(respText);
|
|
46
59
|
return styleSheet;
|
|
47
60
|
}
|
|
48
|
-
/**
|
|
61
|
+
/**
|
|
62
|
+
* Gets a CSS keyframes rule from a stylesheet or stylesheet list,
|
|
63
|
+
* then converts it to Web Animations API keyframes.
|
|
64
|
+
* @param obj
|
|
65
|
+
* @param obj.of The name of the `@keyframes` rule to get keyframes from.
|
|
66
|
+
* @param obj.in The stylesheet or stylesheet list where the rule resides.
|
|
67
|
+
*/
|
|
49
68
|
getStyleSheetKeyframes({ of: ruleName, in: source }) {
|
|
50
69
|
if (typeof ruleName !== 'string') {
|
|
51
70
|
throw new this.Error.KeyframesRuleNameTypeError();
|
|
@@ -90,6 +109,12 @@ class KeyframesFactory {
|
|
|
90
109
|
}
|
|
91
110
|
}
|
|
92
111
|
}
|
|
112
|
+
/**
|
|
113
|
+
* Gets all the CSS keyframes rules in a stylesheet or stylesheet list,
|
|
114
|
+
* then converts them to Web Animations API keyframes.
|
|
115
|
+
* @param obj
|
|
116
|
+
* @param obj.in The style sheet or style sheet list to get keyframes from.
|
|
117
|
+
*/
|
|
93
118
|
getAllStyleSheetKeyframesRules({ in: source }) {
|
|
94
119
|
if (source instanceof StyleSheetList) {
|
|
95
120
|
return this.#getAllStyleSheetKeyframesRulesInStyleSheetList({
|
|
@@ -131,6 +156,11 @@ class KeyframesFactory {
|
|
|
131
156
|
}
|
|
132
157
|
return keyframesRules;
|
|
133
158
|
}
|
|
159
|
+
/**
|
|
160
|
+
* Converts a CSS keyframes rule to Web Animations API keyframes.
|
|
161
|
+
* @param obj
|
|
162
|
+
* @param obj.rule The rule to convert.
|
|
163
|
+
*/
|
|
134
164
|
parseKeyframesRule({ rule: keyframes }) {
|
|
135
165
|
let parsedKeyframes = [];
|
|
136
166
|
for (const keyframe of keyframes) {
|
|
@@ -208,6 +238,7 @@ export class KeyframeEffectParameters {
|
|
|
208
238
|
keyframes;
|
|
209
239
|
options;
|
|
210
240
|
/**
|
|
241
|
+
* @param obj
|
|
211
242
|
* @param obj.keyframes [MDN Reference](https://developer.mozilla.org/en-US/docs/Web/API/Web_Animations_API/Keyframe_Formats)
|
|
212
243
|
* @param obj.options [MDN Reference](https://developer.mozilla.org/en-US/docs/Web/API/KeyframeEffect/KeyframeEffect#options)
|
|
213
244
|
*/
|
|
@@ -216,9 +247,11 @@ export class KeyframeEffectParameters {
|
|
|
216
247
|
this.options = this.#parseOptionsArg(options);
|
|
217
248
|
}
|
|
218
249
|
/**
|
|
250
|
+
* @param obj
|
|
219
251
|
* @param obj.target An element to attach the animation to.
|
|
220
252
|
* @param obj.options Additional keyframe effect options. Can override existing keys.
|
|
221
|
-
*
|
|
253
|
+
* [MDN Reference](https://developer.mozilla.org/en-US/docs/Web/API/KeyframeEffect/KeyframeEffect#options)
|
|
254
|
+
* @param obj.timeline [MDN Reference](https://developer.mozilla.org/en-US/docs/Web/API/Animation/Animation#timeline)
|
|
222
255
|
*
|
|
223
256
|
* @see Specifications:
|
|
224
257
|
* - https://drafts.csswg.org/web-animations-1/#the-keyframeeffect-interface
|
package/dist/KeyframeKit.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"KeyframeKit.js","sourceRoot":"","sources":["../src/KeyframeKit.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAGH,MAAM,KAAK,GAAG;IACZ,YAAY,EAAE,GAAG;IACjB,YAAY,EAAE,GAAG;IACjB,mBAAmB,EAAE,IAAI;IACzB,aAAa,EAAE,UAAU;CACjB,CAAC;AAKX,MAAM,gBAAgB;IAEX,KAAK,GAAG;QACf,0BAA0B,EAAE,MAAM,0BAA2B,SAAQ,SAAS;YAC5E,OAAO,GAAG,uCAAuC,CAAC;SACnD;QACD,eAAe,EAAE,MAAM,eAAgB,SAAQ,SAAS;YACtD,OAAO,GAAG,
|
|
1
|
+
{"version":3,"file":"KeyframeKit.js","sourceRoot":"","sources":["../src/KeyframeKit.ts"],"names":[],"mappings":"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"}
|
|
@@ -44,14 +44,14 @@ export default defineConfig({
|
|
|
44
44
|
nav: [
|
|
45
45
|
{ text: 'Home', link: '/' },
|
|
46
46
|
{ text: 'Get Started', link: '/get-started' },
|
|
47
|
-
{ text: 'Reference', link: '/reference' }
|
|
47
|
+
{ text: 'Reference', link: '/reference/' }
|
|
48
48
|
],
|
|
49
49
|
|
|
50
50
|
sidebar: {
|
|
51
51
|
'/reference/': [
|
|
52
52
|
{
|
|
53
53
|
text: 'Reference',
|
|
54
|
-
link: '/reference',
|
|
54
|
+
link: '/reference/',
|
|
55
55
|
items: referenceNavigationItems
|
|
56
56
|
}
|
|
57
57
|
]
|
|
@@ -1,7 +1,8 @@
|
|
|
1
|
-
export type
|
|
1
|
+
export type CSSStyleSheetSource = CSSStyleSheet | StyleSheetList;
|
|
2
2
|
declare class KeyframesFactory {
|
|
3
3
|
#private;
|
|
4
4
|
readonly Error: {
|
|
5
|
+
/** Keyframes rule name must be a string. */
|
|
5
6
|
readonly KeyframesRuleNameTypeError: {
|
|
6
7
|
new (message?: string): {
|
|
7
8
|
message: string;
|
|
@@ -29,6 +30,7 @@ declare class KeyframesFactory {
|
|
|
29
30
|
};
|
|
30
31
|
isError(error: unknown): error is Error;
|
|
31
32
|
};
|
|
33
|
+
/** Source must be either a `CSSStyleSheet` or a `StyleSheetList`. */
|
|
32
34
|
readonly SourceTypeError: {
|
|
33
35
|
new (message?: string): {
|
|
34
36
|
message: string;
|
|
@@ -56,6 +58,7 @@ declare class KeyframesFactory {
|
|
|
56
58
|
};
|
|
57
59
|
isError(error: unknown): error is Error;
|
|
58
60
|
};
|
|
61
|
+
/** The stylesheet could not be imported. */
|
|
59
62
|
readonly StyleSheetImportError: {
|
|
60
63
|
new (message?: string): {
|
|
61
64
|
message: string;
|
|
@@ -72,21 +75,48 @@ declare class KeyframesFactory {
|
|
|
72
75
|
isError(error: unknown): error is Error;
|
|
73
76
|
};
|
|
74
77
|
};
|
|
78
|
+
/**
|
|
79
|
+
* Gets a document's stylesheets when it loads,
|
|
80
|
+
* or immediately returns them if it's already loaded.
|
|
81
|
+
* @param obj
|
|
82
|
+
* @param obj.document The document to get stylesheets from.
|
|
83
|
+
*/
|
|
75
84
|
getDocumentStyleSheetsOnLoad({ document }?: {
|
|
76
85
|
document?: Document;
|
|
77
86
|
}): Promise<StyleSheetList>;
|
|
78
|
-
/**
|
|
87
|
+
/**
|
|
88
|
+
* Imports a stylesheet from a URL.
|
|
89
|
+
* @param url The URL of the stylesheet to import.
|
|
90
|
+
* @remarks
|
|
79
91
|
* Note: `@import` rules won't be resolved in imported stylesheets.
|
|
80
|
-
* See https://github.com/WICG/construct-stylesheets/issues/119#issuecomment-588352418.
|
|
92
|
+
* See https://github.com/WICG/construct-stylesheets/issues/119#issuecomment-588352418.
|
|
93
|
+
*/
|
|
81
94
|
importStyleSheet(url: string): Promise<CSSStyleSheet>;
|
|
82
|
-
/**
|
|
95
|
+
/**
|
|
96
|
+
* Gets a CSS keyframes rule from a stylesheet or stylesheet list,
|
|
97
|
+
* then converts it to Web Animations API keyframes.
|
|
98
|
+
* @param obj
|
|
99
|
+
* @param obj.of The name of the `@keyframes` rule to get keyframes from.
|
|
100
|
+
* @param obj.in The stylesheet or stylesheet list where the rule resides.
|
|
101
|
+
*/
|
|
83
102
|
getStyleSheetKeyframes({ of: ruleName, in: source }: {
|
|
84
103
|
of: string;
|
|
85
|
-
in:
|
|
104
|
+
in: CSSStyleSheetSource;
|
|
86
105
|
}): ParsedKeyframes | undefined;
|
|
106
|
+
/**
|
|
107
|
+
* Gets all the CSS keyframes rules in a stylesheet or stylesheet list,
|
|
108
|
+
* then converts them to Web Animations API keyframes.
|
|
109
|
+
* @param obj
|
|
110
|
+
* @param obj.in The style sheet or style sheet list to get keyframes from.
|
|
111
|
+
*/
|
|
87
112
|
getAllStyleSheetKeyframesRules({ in: source }: {
|
|
88
|
-
in:
|
|
113
|
+
in: CSSStyleSheetSource;
|
|
89
114
|
}): ParsedKeyframesRules;
|
|
115
|
+
/**
|
|
116
|
+
* Converts a CSS keyframes rule to Web Animations API keyframes.
|
|
117
|
+
* @param obj
|
|
118
|
+
* @param obj.rule The rule to convert.
|
|
119
|
+
*/
|
|
90
120
|
parseKeyframesRule({ rule: keyframes }: {
|
|
91
121
|
rule: CSSKeyframesRule;
|
|
92
122
|
}): ParsedKeyframes;
|
|
@@ -102,6 +132,7 @@ export declare class KeyframeEffectParameters {
|
|
|
102
132
|
keyframes: KeyframeArgument;
|
|
103
133
|
options: KeyframeEffectOptions;
|
|
104
134
|
/**
|
|
135
|
+
* @param obj
|
|
105
136
|
* @param obj.keyframes [MDN Reference](https://developer.mozilla.org/en-US/docs/Web/API/Web_Animations_API/Keyframe_Formats)
|
|
106
137
|
* @param obj.options [MDN Reference](https://developer.mozilla.org/en-US/docs/Web/API/KeyframeEffect/KeyframeEffect#options)
|
|
107
138
|
*/
|
|
@@ -110,9 +141,11 @@ export declare class KeyframeEffectParameters {
|
|
|
110
141
|
options?: number | KeyframeEffectOptions;
|
|
111
142
|
});
|
|
112
143
|
/**
|
|
144
|
+
* @param obj
|
|
113
145
|
* @param obj.target An element to attach the animation to.
|
|
114
146
|
* @param obj.options Additional keyframe effect options. Can override existing keys.
|
|
115
|
-
*
|
|
147
|
+
* [MDN Reference](https://developer.mozilla.org/en-US/docs/Web/API/KeyframeEffect/KeyframeEffect#options)
|
|
148
|
+
* @param obj.timeline [MDN Reference](https://developer.mozilla.org/en-US/docs/Web/API/Animation/Animation#timeline)
|
|
116
149
|
*
|
|
117
150
|
* @see Specifications:
|
|
118
151
|
* - https://drafts.csswg.org/web-animations-1/#the-keyframeeffect-interface
|
|
@@ -121,7 +154,7 @@ export declare class KeyframeEffectParameters {
|
|
|
121
154
|
toAnimation({ target, options: additionalOptions, timeline }: {
|
|
122
155
|
target: Element | null;
|
|
123
156
|
options?: number | KeyframeEffectOptions;
|
|
124
|
-
timeline?: AnimationTimeline;
|
|
157
|
+
timeline?: AnimationTimeline | null;
|
|
125
158
|
}): Animation;
|
|
126
159
|
}
|
|
127
160
|
export declare class ParsedKeyframes {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"KeyframeKit.d.ts","sourceRoot":"","sources":["../src/KeyframeKit.ts"],"names":[],"mappings":"AAgBA,MAAM,MAAM,
|
|
1
|
+
{"version":3,"file":"KeyframeKit.d.ts","sourceRoot":"","sources":["../src/KeyframeKit.ts"],"names":[],"mappings":"AAgBA,MAAM,MAAM,mBAAmB,GAAG,aAAa,GAAG,cAAc,CAAC;AAEjE,cAAM,gBAAgB;;IAEpB,QAAQ,CAAC,KAAK;QACZ,4CAA4C;;;;;;;;;;;;;;;;;;;;;;;;;;;;QAI5C,qEAAqE;;;;;;;;;;;;;;;;;;;;;;;;;;;;QAIrE,4CAA4C;;;;;;;;;;;;;;;;MAInC;IAGX;;;;;OAKG;IACG,4BAA4B,CAAC,EAAE,QAA0B,EAAE,GAAE;QACjE,QAAQ,CAAC,EAAE,QAAQ,CAAA;KACf;IAWN;;;;;;OAMG;IACG,gBAAgB,CAAC,GAAG,EAAE,MAAM;IAwBlC;;;;;;OAMG;IACH,sBAAsB,CAAC,EAAE,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE;QACnD,EAAE,EAAE,MAAM,CAAC;QACX,EAAE,EAAE,mBAAmB,CAAA;KACxB,GAAG,eAAe,GAAG,SAAS;IA0E/B;;;;;OAKG;IACH,8BAA8B,CAAC,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE;QAC7C,EAAE,EAAE,mBAAmB,CAAA;KACxB,GAAG,oBAAoB;IAsExB;;;;OAIG;IACH,kBAAkB,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;QACtC,IAAI,EAAE,gBAAgB,CAAA;KACvB,GAAG,eAAe;CAiHpB;;AAED,wBAAsC;AACtC,YAAY,EAAE,gBAAgB,EAAE,CAAC;AAMjC,iFAAiF;AACjF,MAAM,MAAM,gBAAgB,GAAG,QAAQ,EAAE,GAAG,wBAAwB,CAAC;AAErE,8EAA8E;AAC9E,qBAAa,wBAAwB;;IAEnC,SAAS,EAAE,gBAAgB,CAAC;IAC5B,OAAO,EAAE,qBAAqB,CAAC;IAE/B;;;;OAIG;gBACS,EAAE,SAAS,EAAE,OAAY,EAAE,EAAE;QACvC,SAAS,EAAE,gBAAgB,CAAC;QAC5B,OAAO,CAAC,EAAE,MAAM,GAAG,qBAAqB,CAAA;KACzC;IAKD;;;;;;;;;;OAUG;IACH,WAAW,CAAC,EAAE,MAAM,EAAE,OAAO,EAAE,iBAAsB,EAAE,QAA4B,EAAE,EAAE;QACrF,MAAM,EAAE,OAAO,GAAG,IAAI,CAAC;QACvB,OAAO,CAAC,EAAE,MAAM,GAAG,qBAAqB,CAAC;QACzC,QAAQ,CAAC,EAAE,iBAAiB,GAAG,IAAI,CAAA;KACpC,GAAG,SAAS;CAqCd;AAGD,qBAAa,eAAe;IAE1B,SAAS,EAAE,QAAQ,EAAE,CAAC;gBAEV,SAAS,EAAE,QAAQ,EAAE;IAIjC;;;OAGG;IACH,gBAAgB,CACd,OAAO,EAAE,MAAM,GAAG,qBAAqB,GAAG,IAAI,GAC7C,wBAAwB;CAwB5B;AAGD,MAAM,MAAM,oBAAoB,GAAG;IACjC,CAAC,QAAQ,EAAE,MAAM,GAAG,eAAe,CAAA;CACpC,CAAC"}
|
|
@@ -12,25 +12,38 @@ const CHARS = {
|
|
|
12
12
|
};
|
|
13
13
|
class KeyframesFactory {
|
|
14
14
|
Error = {
|
|
15
|
+
/** Keyframes rule name must be a string. */
|
|
15
16
|
KeyframesRuleNameTypeError: class KeyframesRuleNameTypeError extends TypeError {
|
|
16
17
|
message = `Keyframes rule name must be a string.`;
|
|
17
18
|
},
|
|
19
|
+
/** Source must be either a `CSSStyleSheet` or a `StyleSheetList`. */
|
|
18
20
|
SourceTypeError: class SourceTypeError extends TypeError {
|
|
19
|
-
message = `Source must be either a
|
|
21
|
+
message = `Source must be either a CSSStyleSheet or a StyleSheetList.`;
|
|
20
22
|
},
|
|
23
|
+
/** The stylesheet could not be imported. */
|
|
21
24
|
StyleSheetImportError: class StyleSheetImportError extends Error {
|
|
22
25
|
message = `The stylesheet could not be imported.`;
|
|
23
26
|
}
|
|
24
27
|
};
|
|
28
|
+
/**
|
|
29
|
+
* Gets a document's stylesheets when it loads,
|
|
30
|
+
* or immediately returns them if it's already loaded.
|
|
31
|
+
* @param obj
|
|
32
|
+
* @param obj.document The document to get stylesheets from.
|
|
33
|
+
*/
|
|
25
34
|
async getDocumentStyleSheetsOnLoad({ document = window.document } = {}) {
|
|
26
35
|
await waitForDocumentLoad({
|
|
27
36
|
document: document
|
|
28
37
|
});
|
|
29
38
|
return document.styleSheets;
|
|
30
39
|
}
|
|
31
|
-
/**
|
|
40
|
+
/**
|
|
41
|
+
* Imports a stylesheet from a URL.
|
|
42
|
+
* @param url The URL of the stylesheet to import.
|
|
43
|
+
* @remarks
|
|
32
44
|
* Note: `@import` rules won't be resolved in imported stylesheets.
|
|
33
|
-
* See https://github.com/WICG/construct-stylesheets/issues/119#issuecomment-588352418.
|
|
45
|
+
* See https://github.com/WICG/construct-stylesheets/issues/119#issuecomment-588352418.
|
|
46
|
+
*/
|
|
34
47
|
async importStyleSheet(url) {
|
|
35
48
|
const resp = await fetch(url);
|
|
36
49
|
if (!resp.ok) {
|
|
@@ -45,7 +58,13 @@ class KeyframesFactory {
|
|
|
45
58
|
await styleSheet.replace(respText);
|
|
46
59
|
return styleSheet;
|
|
47
60
|
}
|
|
48
|
-
/**
|
|
61
|
+
/**
|
|
62
|
+
* Gets a CSS keyframes rule from a stylesheet or stylesheet list,
|
|
63
|
+
* then converts it to Web Animations API keyframes.
|
|
64
|
+
* @param obj
|
|
65
|
+
* @param obj.of The name of the `@keyframes` rule to get keyframes from.
|
|
66
|
+
* @param obj.in The stylesheet or stylesheet list where the rule resides.
|
|
67
|
+
*/
|
|
49
68
|
getStyleSheetKeyframes({ of: ruleName, in: source }) {
|
|
50
69
|
if (typeof ruleName !== 'string') {
|
|
51
70
|
throw new this.Error.KeyframesRuleNameTypeError();
|
|
@@ -90,6 +109,12 @@ class KeyframesFactory {
|
|
|
90
109
|
}
|
|
91
110
|
}
|
|
92
111
|
}
|
|
112
|
+
/**
|
|
113
|
+
* Gets all the CSS keyframes rules in a stylesheet or stylesheet list,
|
|
114
|
+
* then converts them to Web Animations API keyframes.
|
|
115
|
+
* @param obj
|
|
116
|
+
* @param obj.in The style sheet or style sheet list to get keyframes from.
|
|
117
|
+
*/
|
|
93
118
|
getAllStyleSheetKeyframesRules({ in: source }) {
|
|
94
119
|
if (source instanceof StyleSheetList) {
|
|
95
120
|
return this.#getAllStyleSheetKeyframesRulesInStyleSheetList({
|
|
@@ -131,6 +156,11 @@ class KeyframesFactory {
|
|
|
131
156
|
}
|
|
132
157
|
return keyframesRules;
|
|
133
158
|
}
|
|
159
|
+
/**
|
|
160
|
+
* Converts a CSS keyframes rule to Web Animations API keyframes.
|
|
161
|
+
* @param obj
|
|
162
|
+
* @param obj.rule The rule to convert.
|
|
163
|
+
*/
|
|
134
164
|
parseKeyframesRule({ rule: keyframes }) {
|
|
135
165
|
let parsedKeyframes = [];
|
|
136
166
|
for (const keyframe of keyframes) {
|
|
@@ -208,6 +238,7 @@ export class KeyframeEffectParameters {
|
|
|
208
238
|
keyframes;
|
|
209
239
|
options;
|
|
210
240
|
/**
|
|
241
|
+
* @param obj
|
|
211
242
|
* @param obj.keyframes [MDN Reference](https://developer.mozilla.org/en-US/docs/Web/API/Web_Animations_API/Keyframe_Formats)
|
|
212
243
|
* @param obj.options [MDN Reference](https://developer.mozilla.org/en-US/docs/Web/API/KeyframeEffect/KeyframeEffect#options)
|
|
213
244
|
*/
|
|
@@ -216,9 +247,11 @@ export class KeyframeEffectParameters {
|
|
|
216
247
|
this.options = this.#parseOptionsArg(options);
|
|
217
248
|
}
|
|
218
249
|
/**
|
|
250
|
+
* @param obj
|
|
219
251
|
* @param obj.target An element to attach the animation to.
|
|
220
252
|
* @param obj.options Additional keyframe effect options. Can override existing keys.
|
|
221
|
-
*
|
|
253
|
+
* [MDN Reference](https://developer.mozilla.org/en-US/docs/Web/API/KeyframeEffect/KeyframeEffect#options)
|
|
254
|
+
* @param obj.timeline [MDN Reference](https://developer.mozilla.org/en-US/docs/Web/API/Animation/Animation#timeline)
|
|
222
255
|
*
|
|
223
256
|
* @see Specifications:
|
|
224
257
|
* - https://drafts.csswg.org/web-animations-1/#the-keyframeeffect-interface
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"KeyframeKit.js","sourceRoot":"","sources":["../src/KeyframeKit.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAGH,MAAM,KAAK,GAAG;IACZ,YAAY,EAAE,GAAG;IACjB,YAAY,EAAE,GAAG;IACjB,mBAAmB,EAAE,IAAI;IACzB,aAAa,EAAE,UAAU;CACjB,CAAC;AAKX,MAAM,gBAAgB;IAEX,KAAK,GAAG;QACf,0BAA0B,EAAE,MAAM,0BAA2B,SAAQ,SAAS;YAC5E,OAAO,GAAG,uCAAuC,CAAC;SACnD;QACD,eAAe,EAAE,MAAM,eAAgB,SAAQ,SAAS;YACtD,OAAO,GAAG,
|
|
1
|
+
{"version":3,"file":"KeyframeKit.js","sourceRoot":"","sources":["../src/KeyframeKit.ts"],"names":[],"mappings":"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"}
|
|
@@ -59,7 +59,7 @@ options: KeyframeEffectOptions;
|
|
|
59
59
|
toAnimation(obj: {
|
|
60
60
|
options?: number | KeyframeEffectOptions;
|
|
61
61
|
target: Element | null;
|
|
62
|
-
timeline?: AnimationTimeline;
|
|
62
|
+
timeline?: AnimationTimeline | null;
|
|
63
63
|
}): Animation;
|
|
64
64
|
```
|
|
65
65
|
|
|
@@ -72,7 +72,7 @@ toAnimation(obj: {
|
|
|
72
72
|
`number` \| `KeyframeEffectOptions` = `{}`
|
|
73
73
|
|
|
74
74
|
Additional keyframe effect options. Can override existing keys.
|
|
75
|
-
[MDN Reference](https://developer.mozilla.org/en-US/docs/Web/API/KeyframeEffect/KeyframeEffect#options)
|
|
75
|
+
[MDN Reference](https://developer.mozilla.org/en-US/docs/Web/API/KeyframeEffect/KeyframeEffect#options)
|
|
76
76
|
|
|
77
77
|
###### target
|
|
78
78
|
|
|
@@ -82,7 +82,9 @@ An element to attach the animation to.
|
|
|
82
82
|
|
|
83
83
|
###### timeline?
|
|
84
84
|
|
|
85
|
-
[`AnimationTimeline`](https://developer.mozilla.org/docs/Web/API/AnimationTimeline) = `document.timeline`
|
|
85
|
+
[`AnimationTimeline`](https://developer.mozilla.org/docs/Web/API/AnimationTimeline) \| `null` = `document.timeline`
|
|
86
|
+
|
|
87
|
+
[MDN Reference](https://developer.mozilla.org/en-US/docs/Web/API/Animation/Animation#timeline)
|
|
86
88
|
|
|
87
89
|
#### Returns
|
|
88
90
|
|
|
@@ -11,8 +11,8 @@
|
|
|
11
11
|
|
|
12
12
|
## Type Aliases
|
|
13
13
|
|
|
14
|
+
- [CSSStyleSheetSource](type-aliases/CSSStyleSheetSource.md)
|
|
14
15
|
- [KeyframeArgument](type-aliases/KeyframeArgument.md)
|
|
15
|
-
- [KeyframesFactorySource](type-aliases/KeyframesFactorySource.md)
|
|
16
16
|
- [ParsedKeyframesRules](type-aliases/ParsedKeyframesRules.md)
|
|
17
17
|
|
|
18
18
|
## Variables
|
|
@@ -20,35 +20,46 @@ readonly Error: {
|
|
|
20
20
|
readonly KeyframesRuleNameTypeError: typeof KeyframesRuleNameTypeError;
|
|
21
21
|
```
|
|
22
22
|
|
|
23
|
+
Keyframes rule name must be a string.
|
|
24
|
+
|
|
23
25
|
#### SourceTypeError
|
|
24
26
|
|
|
25
27
|
```ts
|
|
26
28
|
readonly SourceTypeError: typeof SourceTypeError;
|
|
27
29
|
```
|
|
28
30
|
|
|
31
|
+
Source must be either a `CSSStyleSheet` or a `StyleSheetList`.
|
|
32
|
+
|
|
29
33
|
#### StyleSheetImportError
|
|
30
34
|
|
|
31
35
|
```ts
|
|
32
36
|
readonly StyleSheetImportError: typeof StyleSheetImportError;
|
|
33
37
|
```
|
|
34
38
|
|
|
39
|
+
The stylesheet could not be imported.
|
|
40
|
+
|
|
35
41
|
## Methods
|
|
36
42
|
|
|
37
43
|
### getAllStyleSheetKeyframesRules()
|
|
38
44
|
|
|
39
45
|
```ts
|
|
40
46
|
getAllStyleSheetKeyframesRules(obj: {
|
|
41
|
-
in:
|
|
47
|
+
in: CSSStyleSheetSource;
|
|
42
48
|
}): ParsedKeyframesRules;
|
|
43
49
|
```
|
|
44
50
|
|
|
51
|
+
Gets all the CSS keyframes rules in a stylesheet or stylesheet list,
|
|
52
|
+
then converts them to Web Animations API keyframes.
|
|
53
|
+
|
|
45
54
|
#### Parameters
|
|
46
55
|
|
|
47
56
|
##### obj
|
|
48
57
|
|
|
49
58
|
###### in
|
|
50
59
|
|
|
51
|
-
[`
|
|
60
|
+
[`CSSStyleSheetSource`](../type-aliases/CSSStyleSheetSource.md)
|
|
61
|
+
|
|
62
|
+
The style sheet or style sheet list to get keyframes from.
|
|
52
63
|
|
|
53
64
|
#### Returns
|
|
54
65
|
|
|
@@ -64,6 +75,9 @@ getDocumentStyleSheetsOnLoad(obj?: {
|
|
|
64
75
|
}): Promise<StyleSheetList>;
|
|
65
76
|
```
|
|
66
77
|
|
|
78
|
+
Gets a document's stylesheets when it loads,
|
|
79
|
+
or immediately returns them if it's already loaded.
|
|
80
|
+
|
|
67
81
|
#### Parameters
|
|
68
82
|
|
|
69
83
|
##### obj?
|
|
@@ -72,6 +86,8 @@ getDocumentStyleSheetsOnLoad(obj?: {
|
|
|
72
86
|
|
|
73
87
|
[`Document`](https://developer.mozilla.org/docs/Web/API/Document) = `window.document`
|
|
74
88
|
|
|
89
|
+
The document to get stylesheets from.
|
|
90
|
+
|
|
75
91
|
#### Returns
|
|
76
92
|
|
|
77
93
|
[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)\<[`StyleSheetList`](https://developer.mozilla.org/docs/Web/API/StyleSheetList)\>
|
|
@@ -82,18 +98,23 @@ getDocumentStyleSheetsOnLoad(obj?: {
|
|
|
82
98
|
|
|
83
99
|
```ts
|
|
84
100
|
getStyleSheetKeyframes(obj: {
|
|
85
|
-
in:
|
|
101
|
+
in: CSSStyleSheetSource;
|
|
86
102
|
of: string;
|
|
87
103
|
}): ParsedKeyframes | undefined;
|
|
88
104
|
```
|
|
89
105
|
|
|
106
|
+
Gets a CSS keyframes rule from a stylesheet or stylesheet list,
|
|
107
|
+
then converts it to Web Animations API keyframes.
|
|
108
|
+
|
|
90
109
|
#### Parameters
|
|
91
110
|
|
|
92
111
|
##### obj
|
|
93
112
|
|
|
94
113
|
###### in
|
|
95
114
|
|
|
96
|
-
[`
|
|
115
|
+
[`CSSStyleSheetSource`](../type-aliases/CSSStyleSheetSource.md)
|
|
116
|
+
|
|
117
|
+
The stylesheet or stylesheet list where the rule resides.
|
|
97
118
|
|
|
98
119
|
###### of
|
|
99
120
|
|
|
@@ -113,12 +134,16 @@ The name of the `@keyframes` rule to get keyframes from.
|
|
|
113
134
|
importStyleSheet(url: string): Promise<CSSStyleSheet>;
|
|
114
135
|
```
|
|
115
136
|
|
|
137
|
+
Imports a stylesheet from a URL.
|
|
138
|
+
|
|
116
139
|
#### Parameters
|
|
117
140
|
|
|
118
141
|
##### url
|
|
119
142
|
|
|
120
143
|
`string`
|
|
121
144
|
|
|
145
|
+
The URL of the stylesheet to import.
|
|
146
|
+
|
|
122
147
|
#### Returns
|
|
123
148
|
|
|
124
149
|
[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)\<[`CSSStyleSheet`](https://developer.mozilla.org/docs/Web/API/CSSStyleSheet)\>
|
|
@@ -138,6 +163,8 @@ parseKeyframesRule(obj: {
|
|
|
138
163
|
}): ParsedKeyframes;
|
|
139
164
|
```
|
|
140
165
|
|
|
166
|
+
Converts a CSS keyframes rule to Web Animations API keyframes.
|
|
167
|
+
|
|
141
168
|
#### Parameters
|
|
142
169
|
|
|
143
170
|
##### obj
|
|
@@ -146,6 +173,8 @@ parseKeyframesRule(obj: {
|
|
|
146
173
|
|
|
147
174
|
[`CSSKeyframesRule`](https://developer.mozilla.org/docs/Web/API/CSSKeyframesRule)
|
|
148
175
|
|
|
176
|
+
The rule to convert.
|
|
177
|
+
|
|
149
178
|
#### Returns
|
|
150
179
|
|
|
151
180
|
[`ParsedKeyframes`](../classes/ParsedKeyframes.md)
|
|
@@ -31,15 +31,15 @@
|
|
|
31
31
|
"title": "Type Aliases",
|
|
32
32
|
"children": [
|
|
33
33
|
{
|
|
34
|
-
"title": "
|
|
34
|
+
"title": "CSSStyleSheetSource",
|
|
35
35
|
"kind": 2097152,
|
|
36
|
-
"path": "type-aliases/
|
|
36
|
+
"path": "type-aliases/CSSStyleSheetSource.md",
|
|
37
37
|
"isDeprecated": false
|
|
38
38
|
},
|
|
39
39
|
{
|
|
40
|
-
"title": "
|
|
40
|
+
"title": "KeyframeArgument",
|
|
41
41
|
"kind": 2097152,
|
|
42
|
-
"path": "type-aliases/
|
|
42
|
+
"path": "type-aliases/KeyframeArgument.md",
|
|
43
43
|
"isDeprecated": false
|
|
44
44
|
},
|
|
45
45
|
{
|
package/docs/package.json
CHANGED
|
@@ -1,21 +1,18 @@
|
|
|
1
1
|
{
|
|
2
|
+
"type": "module",
|
|
2
3
|
"scripts": {
|
|
3
4
|
"dev": "vitepress dev",
|
|
4
5
|
"build": "vitepress build",
|
|
5
6
|
"preview": "vitepress preview",
|
|
6
7
|
"bump": "npm run reference && npm run playground:bumplib",
|
|
7
|
-
"reference": "typedoc
|
|
8
|
+
"reference": "typedoc",
|
|
8
9
|
"playground:bumplib": "mkdir -p ./docs/public/playground/KeyframeKit && cp -r ../dist ./docs/public/playground/KeyframeKit/"
|
|
9
10
|
},
|
|
10
11
|
"devDependencies": {
|
|
11
|
-
"remark-collapse": "^0.1.2",
|
|
12
|
-
"remark-insert-headings": "^0.0.0",
|
|
13
|
-
"remark-toc": "^9.0.0",
|
|
14
12
|
"typedoc": "^0.28.17",
|
|
15
|
-
"typedoc-plugin-inline-sources": "^1.3.0",
|
|
16
13
|
"typedoc-plugin-markdown": "^4.10.0",
|
|
17
14
|
"typedoc-plugin-mdn-links": "^5.1.1",
|
|
18
|
-
"typedoc-plugin-
|
|
15
|
+
"typedoc-plugin-no-inherit": "^1.6.1",
|
|
19
16
|
"vitepress": "^2.0.0-alpha.16",
|
|
20
17
|
"vue": "^3.5.28"
|
|
21
18
|
},
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
// @ts-check
|
|
2
|
+
|
|
3
|
+
import { MarkdownThemeContext } from 'typedoc-plugin-markdown';
|
|
4
|
+
import { UnionType } from 'typedoc';
|
|
5
|
+
|
|
6
|
+
/// https://typedoc-plugin-markdown.org/docs/customization#hooks
|
|
7
|
+
/**
|
|
8
|
+
* @param {import('typedoc-plugin-markdown').MarkdownApplication} app
|
|
9
|
+
*/
|
|
10
|
+
export function load(app) {
|
|
11
|
+
|
|
12
|
+
app.renderer.markdownHooks.on('page.begin', (context) => {
|
|
13
|
+
|
|
14
|
+
context.partials.unionType = (model) => { return unionType(context, model) };
|
|
15
|
+
|
|
16
|
+
// console.log(context);
|
|
17
|
+
|
|
18
|
+
return '';
|
|
19
|
+
// return `**Generated using "page.begin" hook**`;
|
|
20
|
+
|
|
21
|
+
});
|
|
22
|
+
|
|
23
|
+
}
|
|
24
|
+
|
|
25
|
+
/// https://github.com/typedoc2md/typedoc-plugin-markdown/blob/main/packages/typedoc-plugin-markdown/src/theme/context/partials/type.union.ts
|
|
26
|
+
/**
|
|
27
|
+
* @param {MarkdownThemeContext} thiss @param {UnionType} model @returns {string}
|
|
28
|
+
*/
|
|
29
|
+
function unionType(
|
|
30
|
+
thiss,
|
|
31
|
+
model,
|
|
32
|
+
) {
|
|
33
|
+
// const useCodeBlocks = thiss.options.getValue('useCodeBlocks');
|
|
34
|
+
const typesOut = model.types.map((unionType) =>
|
|
35
|
+
thiss.partials.someType(unionType, { forceCollapse: true }),
|
|
36
|
+
);
|
|
37
|
+
/* const shouldFormat =
|
|
38
|
+
useCodeBlocks &&
|
|
39
|
+
(typesOut?.join('').length > 70 || typesOut?.join('').includes('\n')); */
|
|
40
|
+
const md = typesOut.join(` \\| `); // typesOut.join(shouldFormat ? `\n \\| ` : ` \\| `);
|
|
41
|
+
// console.log(md);
|
|
42
|
+
return md; // shouldFormat ? `\n \\| ` + md : md;
|
|
43
|
+
}
|
|
@@ -1,52 +1,17 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
const typedoc_1 = require("typedoc");
|
|
5
|
-
const paramNameOption = 'namedParamName';
|
|
6
|
-
const detectFromCommentsOption = 'detectNamedParamFromComments';
|
|
7
|
-
const changeParamTagOption = 'changeNamedParamTag';
|
|
8
|
-
const load = (app) => {
|
|
9
|
-
app.options.addDeclaration({
|
|
10
|
-
name: paramNameOption,
|
|
11
|
-
help: 'Specifies the name to replace __namedParameters with, if a @param tag isn’t found.',
|
|
12
|
-
type: typedoc_1.ParameterType.String,
|
|
13
|
-
defaultValue: 'options'
|
|
14
|
-
});
|
|
15
|
-
app.options.addDeclaration({
|
|
16
|
-
name: detectFromCommentsOption,
|
|
17
|
-
help: 'Whether to detect the name of parameters from the documentation comments.',
|
|
18
|
-
type: typedoc_1.ParameterType.Boolean,
|
|
19
|
-
defaultValue: true
|
|
20
|
-
});
|
|
21
|
-
app.options.addDeclaration({
|
|
22
|
-
name: changeParamTagOption,
|
|
23
|
-
help: `Whether to change the name of the @param tag to ${paramNameOption} so documentation is shown for a corresponding __namedParameters parameter. Ignored if ${detectFromCommentsOption} is true.`,
|
|
24
|
-
type: typedoc_1.ParameterType.Boolean,
|
|
25
|
-
defaultValue: true
|
|
26
|
-
});
|
|
27
|
-
let paramName;
|
|
28
|
-
let detectFromComments;
|
|
29
|
-
let changeParamTag;
|
|
30
|
-
app.converter.on(typedoc_1.Converter.EVENT_BEGIN, () => {
|
|
31
|
-
paramName = app.options.getValue(paramNameOption);
|
|
32
|
-
detectFromComments = app.options.getValue(detectFromCommentsOption);
|
|
33
|
-
changeParamTag = app.options.getValue(changeParamTagOption);
|
|
34
|
-
if (!changeParamTag && detectFromComments) {
|
|
35
|
-
app.logger.warn(`${changeParamTagOption} is ignored when ${detectFromCommentsOption} is true`);
|
|
36
|
-
}
|
|
37
|
-
});
|
|
38
|
-
app.converter.on(typedoc_1.Converter.EVENT_CREATE_SIGNATURE, (context, sig) => {
|
|
39
|
-
var _a, _b;
|
|
1
|
+
// @ts-check
|
|
2
|
+
|
|
3
|
+
import * as td from "typedoc";
|
|
40
4
|
|
|
41
|
-
|
|
5
|
+
/** @param {td.Application} app */
|
|
6
|
+
export function load(app) {
|
|
7
|
+
app.converter.on(td.Converter.EVENT_CREATE_SIGNATURE, (context, sig) => {
|
|
8
|
+
if (!sig.parameters) {
|
|
42
9
|
return;
|
|
10
|
+
}
|
|
43
11
|
for (const [i, param] of sig.parameters.entries()) {
|
|
44
|
-
if (param.name
|
|
45
|
-
continue;
|
|
46
|
-
else {
|
|
12
|
+
if (param.name === '__namedParameters') {
|
|
47
13
|
param.name = 'obj';
|
|
48
14
|
}
|
|
49
15
|
}
|
|
50
16
|
});
|
|
51
|
-
}
|
|
52
|
-
exports.load = load;
|
|
17
|
+
}
|
|
@@ -1,12 +1,17 @@
|
|
|
1
|
-
|
|
1
|
+
// @ts-check
|
|
2
|
+
|
|
3
|
+
/** @type {import('typedoc').TypeDocOptions & import('typedoc-plugin-markdown').PluginOptions & { inheritNone?: boolean }} */
|
|
4
|
+
export default {
|
|
2
5
|
"name": "KeyframeKit",
|
|
3
6
|
|
|
4
7
|
"plugin": [
|
|
5
|
-
"./typedoc/plugin-param-names.js",
|
|
6
8
|
"typedoc-plugin-mdn-links",
|
|
7
|
-
"typedoc-plugin-inline-sources",
|
|
8
9
|
"typedoc-plugin-markdown",
|
|
9
|
-
"typedoc-plugin-
|
|
10
|
+
"typedoc-plugin-no-inherit",
|
|
11
|
+
"./typedoc/plugin-param-names.js",
|
|
12
|
+
"./typedoc/plugin-markdown-fix.js",
|
|
13
|
+
//"typedoc-plugin-inline-sources",
|
|
14
|
+
//"typedoc-plugin-remark",
|
|
10
15
|
//"typedoc-github-wiki-theme",
|
|
11
16
|
//"typedoc-plugin-missing-exports"
|
|
12
17
|
],
|
|
@@ -27,20 +32,22 @@
|
|
|
27
32
|
|
|
28
33
|
"router": "member", // "module"
|
|
29
34
|
|
|
30
|
-
|
|
35
|
+
"readme": "none",
|
|
31
36
|
|
|
32
37
|
//"sidebar": {
|
|
33
38
|
//"autoConfiguration": false,
|
|
34
39
|
//"heading": "[KeyframeKit](../wiki)"
|
|
35
40
|
//},
|
|
36
41
|
|
|
37
|
-
"remarkPlugins": [
|
|
42
|
+
/* "remarkPlugins": [
|
|
38
43
|
["remark-insert-headings", { "text": "Contents", "minHeadingCount": 1 }],
|
|
39
44
|
["remark-toc", { "maxDepth": 3, "tight": true }],
|
|
40
45
|
//["remark-collapse", {"test": "Contents"}]
|
|
41
|
-
],
|
|
46
|
+
], */
|
|
42
47
|
|
|
43
|
-
"modulesFileName": "index", // KeyframeKit
|
|
48
|
+
//"modulesFileName": "index", // KeyframeKit
|
|
49
|
+
|
|
50
|
+
"entryFileName": "index",
|
|
44
51
|
|
|
45
52
|
"expandParameters": true,
|
|
46
53
|
"expandObjects": true,
|
|
@@ -59,5 +66,13 @@
|
|
|
59
66
|
"includeCategories": true,
|
|
60
67
|
"includeGroups": true,
|
|
61
68
|
"includeFolders": true,
|
|
62
|
-
}
|
|
63
|
-
|
|
69
|
+
},
|
|
70
|
+
|
|
71
|
+
"inheritNone": true,
|
|
72
|
+
|
|
73
|
+
//"pageTitleTemplates": {
|
|
74
|
+
//"index": "Reference"
|
|
75
|
+
//},
|
|
76
|
+
|
|
77
|
+
//"hideBreadcrumbs": true
|
|
78
|
+
};
|
package/package.json
CHANGED
package/src/KeyframeKit.ts
CHANGED
|
@@ -14,23 +14,32 @@ const CHARS = {
|
|
|
14
14
|
} as const;
|
|
15
15
|
|
|
16
16
|
|
|
17
|
-
export type
|
|
17
|
+
export type CSSStyleSheetSource = CSSStyleSheet | StyleSheetList;
|
|
18
18
|
|
|
19
19
|
class KeyframesFactory {
|
|
20
20
|
|
|
21
21
|
readonly Error = {
|
|
22
|
+
/** Keyframes rule name must be a string. */
|
|
22
23
|
KeyframesRuleNameTypeError: class KeyframesRuleNameTypeError extends TypeError {
|
|
23
24
|
message = `Keyframes rule name must be a string.`;
|
|
24
25
|
},
|
|
26
|
+
/** Source must be either a `CSSStyleSheet` or a `StyleSheetList`. */
|
|
25
27
|
SourceTypeError: class SourceTypeError extends TypeError {
|
|
26
|
-
message = `Source must be either a
|
|
28
|
+
message = `Source must be either a CSSStyleSheet or a StyleSheetList.`;
|
|
27
29
|
},
|
|
30
|
+
/** The stylesheet could not be imported. */
|
|
28
31
|
StyleSheetImportError: class StyleSheetImportError extends Error {
|
|
29
32
|
message = `The stylesheet could not be imported.`;
|
|
30
33
|
}
|
|
31
34
|
} as const;
|
|
32
35
|
|
|
33
36
|
|
|
37
|
+
/**
|
|
38
|
+
* Gets a document's stylesheets when it loads,
|
|
39
|
+
* or immediately returns them if it's already loaded.
|
|
40
|
+
* @param obj
|
|
41
|
+
* @param obj.document The document to get stylesheets from.
|
|
42
|
+
*/
|
|
34
43
|
async getDocumentStyleSheetsOnLoad({ document = window.document }: {
|
|
35
44
|
document?: Document
|
|
36
45
|
} = {}) {
|
|
@@ -44,9 +53,13 @@ class KeyframesFactory {
|
|
|
44
53
|
}
|
|
45
54
|
|
|
46
55
|
|
|
47
|
-
/**
|
|
56
|
+
/**
|
|
57
|
+
* Imports a stylesheet from a URL.
|
|
58
|
+
* @param url The URL of the stylesheet to import.
|
|
59
|
+
* @remarks
|
|
48
60
|
* Note: `@import` rules won't be resolved in imported stylesheets.
|
|
49
|
-
* See https://github.com/WICG/construct-stylesheets/issues/119#issuecomment-588352418.
|
|
61
|
+
* See https://github.com/WICG/construct-stylesheets/issues/119#issuecomment-588352418.
|
|
62
|
+
*/
|
|
50
63
|
async importStyleSheet(url: string) {
|
|
51
64
|
|
|
52
65
|
const resp = await fetch(url);
|
|
@@ -71,10 +84,16 @@ class KeyframesFactory {
|
|
|
71
84
|
}
|
|
72
85
|
|
|
73
86
|
|
|
74
|
-
/**
|
|
87
|
+
/**
|
|
88
|
+
* Gets a CSS keyframes rule from a stylesheet or stylesheet list,
|
|
89
|
+
* then converts it to Web Animations API keyframes.
|
|
90
|
+
* @param obj
|
|
91
|
+
* @param obj.of The name of the `@keyframes` rule to get keyframes from.
|
|
92
|
+
* @param obj.in The stylesheet or stylesheet list where the rule resides.
|
|
93
|
+
*/
|
|
75
94
|
getStyleSheetKeyframes({ of: ruleName, in: source }: {
|
|
76
95
|
of: string,
|
|
77
|
-
in:
|
|
96
|
+
in: CSSStyleSheetSource
|
|
78
97
|
}): ParsedKeyframes | undefined {
|
|
79
98
|
|
|
80
99
|
if (typeof ruleName !== 'string') {
|
|
@@ -149,8 +168,14 @@ class KeyframesFactory {
|
|
|
149
168
|
}
|
|
150
169
|
|
|
151
170
|
|
|
171
|
+
/**
|
|
172
|
+
* Gets all the CSS keyframes rules in a stylesheet or stylesheet list,
|
|
173
|
+
* then converts them to Web Animations API keyframes.
|
|
174
|
+
* @param obj
|
|
175
|
+
* @param obj.in The style sheet or style sheet list to get keyframes from.
|
|
176
|
+
*/
|
|
152
177
|
getAllStyleSheetKeyframesRules({ in: source }: {
|
|
153
|
-
in:
|
|
178
|
+
in: CSSStyleSheetSource
|
|
154
179
|
}): ParsedKeyframesRules {
|
|
155
180
|
|
|
156
181
|
if (source instanceof StyleSheetList) {
|
|
@@ -221,6 +246,11 @@ class KeyframesFactory {
|
|
|
221
246
|
}
|
|
222
247
|
|
|
223
248
|
|
|
249
|
+
/**
|
|
250
|
+
* Converts a CSS keyframes rule to Web Animations API keyframes.
|
|
251
|
+
* @param obj
|
|
252
|
+
* @param obj.rule The rule to convert.
|
|
253
|
+
*/
|
|
224
254
|
parseKeyframesRule({ rule: keyframes }: {
|
|
225
255
|
rule: CSSKeyframesRule
|
|
226
256
|
}): ParsedKeyframes {
|
|
@@ -355,6 +385,7 @@ export class KeyframeEffectParameters {
|
|
|
355
385
|
options: KeyframeEffectOptions;
|
|
356
386
|
|
|
357
387
|
/**
|
|
388
|
+
* @param obj
|
|
358
389
|
* @param obj.keyframes [MDN Reference](https://developer.mozilla.org/en-US/docs/Web/API/Web_Animations_API/Keyframe_Formats)
|
|
359
390
|
* @param obj.options [MDN Reference](https://developer.mozilla.org/en-US/docs/Web/API/KeyframeEffect/KeyframeEffect#options)
|
|
360
391
|
*/
|
|
@@ -367,9 +398,11 @@ export class KeyframeEffectParameters {
|
|
|
367
398
|
}
|
|
368
399
|
|
|
369
400
|
/**
|
|
401
|
+
* @param obj
|
|
370
402
|
* @param obj.target An element to attach the animation to.
|
|
371
403
|
* @param obj.options Additional keyframe effect options. Can override existing keys.
|
|
372
|
-
*
|
|
404
|
+
* [MDN Reference](https://developer.mozilla.org/en-US/docs/Web/API/KeyframeEffect/KeyframeEffect#options)
|
|
405
|
+
* @param obj.timeline [MDN Reference](https://developer.mozilla.org/en-US/docs/Web/API/Animation/Animation#timeline)
|
|
373
406
|
*
|
|
374
407
|
* @see Specifications:
|
|
375
408
|
* - https://drafts.csswg.org/web-animations-1/#the-keyframeeffect-interface
|
|
@@ -378,7 +411,7 @@ export class KeyframeEffectParameters {
|
|
|
378
411
|
toAnimation({ target, options: additionalOptions = {}, timeline = document.timeline }: {
|
|
379
412
|
target: Element | null,
|
|
380
413
|
options?: number | KeyframeEffectOptions,
|
|
381
|
-
timeline?: AnimationTimeline
|
|
414
|
+
timeline?: AnimationTimeline | null
|
|
382
415
|
}): Animation {
|
|
383
416
|
|
|
384
417
|
additionalOptions = this.#parseOptionsArg(additionalOptions);
|
|
@@ -477,7 +510,6 @@ function removeSuffix({ of: string, suffix }: {
|
|
|
477
510
|
|
|
478
511
|
}
|
|
479
512
|
|
|
480
|
-
|
|
481
513
|
async function waitForDocumentLoad({ document }: {
|
|
482
514
|
document: Document
|
|
483
515
|
}) {
|
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
MIT License
|
|
2
|
-
|
|
3
|
-
Copyright (c) 2026 Ben Hatsor
|
|
4
|
-
|
|
5
|
-
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
-
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
-
in the Software without restriction, including without limitation the rights
|
|
8
|
-
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
-
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
-
furnished to do so, subject to the following conditions:
|
|
11
|
-
|
|
12
|
-
The above copyright notice and this permission notice shall be included in all
|
|
13
|
-
copies or substantial portions of the Software.
|
|
14
|
-
|
|
15
|
-
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
-
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
-
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
-
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
-
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
-
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
-
SOFTWARE.
|