@acusti/styling 1.1.1 → 2.0.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/dist/Style.d.ts +1 -1
- package/dist/index.d.ts +1 -0
- package/dist/index.js +183 -3
- package/dist/index.js.map +1 -1
- package/dist/minifyStyles.d.ts +0 -1
- package/package.json +10 -7
- package/dist/Style.js +0 -9
- package/dist/Style.js.flow +0 -15
- package/dist/Style.js.map +0 -1
- package/dist/index.js.flow +0 -9
- package/dist/minifyStyles.js +0 -131
- package/dist/minifyStyles.js.flow +0 -25
- package/dist/minifyStyles.js.map +0 -1
- package/dist/minifyStyles.test.d.ts +0 -1
- package/dist/minifyStyles.test.js +0 -32
- package/dist/minifyStyles.test.js.flow +0 -6
- package/dist/minifyStyles.test.js.map +0 -1
- package/dist/style-registry.d.ts +0 -23
- package/dist/style-registry.js +0 -94
- package/dist/style-registry.js.flow +0 -25
- package/dist/style-registry.js.map +0 -1
- package/dist/style-registry.test.d.ts +0 -1
- package/dist/style-registry.test.js +0 -121
- package/dist/style-registry.test.js.flow +0 -6
- package/dist/style-registry.test.js.map +0 -1
- package/dist/useStyles.js +0 -63
- package/dist/useStyles.js.flow +0 -25
- package/dist/useStyles.js.map +0 -1
- package/dist/useStyles.test.d.ts +0 -1
- package/dist/useStyles.test.js +0 -79
- package/dist/useStyles.test.js.flow +0 -6
- package/dist/useStyles.test.js.map +0 -1
- package/src/Style.tsx +0 -22
- package/src/index.ts +0 -4
- package/src/minifyStyles.test.ts +0 -44
- package/src/minifyStyles.ts +0 -178
- package/src/useStyles.test.tsx +0 -111
- package/src/useStyles.ts +0 -76
package/dist/style-registry.js
DELETED
|
@@ -1,94 +0,0 @@
|
|
|
1
|
-
const styleRegistry = new Map();
|
|
2
|
-
export const getRegisteredStyles = ({ ownerDocument, styles }) => {
|
|
3
|
-
var _a;
|
|
4
|
-
if (!styles) return null;
|
|
5
|
-
const stylesMap = styleRegistry.get(styles);
|
|
6
|
-
if (!stylesMap) return null;
|
|
7
|
-
return (_a = stylesMap.get(ownerDocument)) !== null && _a !== void 0 ? _a : null;
|
|
8
|
-
};
|
|
9
|
-
// NOTE a more idiomatic API than (register|unregister)Styles would be
|
|
10
|
-
// to make registerStyles a thunk that returns a cleanup function
|
|
11
|
-
export const registerStyles = ({ ownerDocument, styles }) => {
|
|
12
|
-
if (!styles) return;
|
|
13
|
-
const existingStylesItem = getRegisteredStyles({ ownerDocument, styles });
|
|
14
|
-
if (existingStylesItem) {
|
|
15
|
-
existingStylesItem.referenceCount++;
|
|
16
|
-
return;
|
|
17
|
-
}
|
|
18
|
-
if (ownerDocument === 'global') {
|
|
19
|
-
const stylesItem = { element: null, referenceCount: 1 };
|
|
20
|
-
let stylesMap = styleRegistry.get(styles);
|
|
21
|
-
if (stylesMap) {
|
|
22
|
-
stylesMap.set(ownerDocument, stylesItem);
|
|
23
|
-
} else {
|
|
24
|
-
stylesMap = new Map([[ownerDocument, stylesItem]]);
|
|
25
|
-
}
|
|
26
|
-
styleRegistry.set(styles, stylesMap);
|
|
27
|
-
return;
|
|
28
|
-
}
|
|
29
|
-
const element = ownerDocument.createElement('style');
|
|
30
|
-
element.setAttribute('data-ukt-styling', '');
|
|
31
|
-
element.innerHTML = styles;
|
|
32
|
-
ownerDocument.head.appendChild(element);
|
|
33
|
-
const stylesItem = { element, referenceCount: 1 };
|
|
34
|
-
const stylesMap = styleRegistry.get(styles);
|
|
35
|
-
if (stylesMap) {
|
|
36
|
-
stylesMap.set(ownerDocument, stylesItem);
|
|
37
|
-
return;
|
|
38
|
-
}
|
|
39
|
-
styleRegistry.set(styles, new Map([[ownerDocument, stylesItem]]));
|
|
40
|
-
};
|
|
41
|
-
export const unregisterStyles = ({ ownerDocument, styles }) => {
|
|
42
|
-
if (!styles) return;
|
|
43
|
-
const stylesItem = getRegisteredStyles({ ownerDocument, styles });
|
|
44
|
-
if (!stylesItem) return;
|
|
45
|
-
stylesItem.referenceCount--;
|
|
46
|
-
if (stylesItem.referenceCount) return;
|
|
47
|
-
// If no more references to these styles in this document, remove <style> element from the DOM
|
|
48
|
-
if (stylesItem.element) {
|
|
49
|
-
const { parentElement } = stylesItem.element;
|
|
50
|
-
if (parentElement) {
|
|
51
|
-
parentElement.removeChild(stylesItem.element);
|
|
52
|
-
}
|
|
53
|
-
}
|
|
54
|
-
// Then remove the document Map
|
|
55
|
-
const stylesMap = styleRegistry.get(styles);
|
|
56
|
-
stylesMap.delete(ownerDocument);
|
|
57
|
-
if (stylesMap.size) return;
|
|
58
|
-
// If no more references to these styles in any document, remove it entirely
|
|
59
|
-
styleRegistry.delete(styles);
|
|
60
|
-
};
|
|
61
|
-
export const updateStyles = ({ ownerDocument, previousStyles, styles }) => {
|
|
62
|
-
if (previousStyles === styles) return;
|
|
63
|
-
const stylesMap = styleRegistry.get(previousStyles);
|
|
64
|
-
const stylesItem =
|
|
65
|
-
stylesMap === null || stylesMap === void 0
|
|
66
|
-
? void 0
|
|
67
|
-
: stylesMap.get(ownerDocument);
|
|
68
|
-
if (
|
|
69
|
-
stylesMap &&
|
|
70
|
-
(stylesItem === null || stylesItem === void 0 ? void 0 : stylesItem.element) &&
|
|
71
|
-
(stylesItem === null || stylesItem === void 0
|
|
72
|
-
? void 0
|
|
73
|
-
: stylesItem.referenceCount) === 1
|
|
74
|
-
) {
|
|
75
|
-
// Mutate existing <style> element with updated styles
|
|
76
|
-
stylesItem.element.innerHTML = styles;
|
|
77
|
-
styleRegistry.set(styles, new Map([[ownerDocument, stylesItem]]));
|
|
78
|
-
// Cleanup previous stylesMap
|
|
79
|
-
stylesMap.delete(ownerDocument);
|
|
80
|
-
if (!stylesMap.size) {
|
|
81
|
-
styleRegistry.delete(previousStyles);
|
|
82
|
-
}
|
|
83
|
-
return;
|
|
84
|
-
}
|
|
85
|
-
if (previousStyles) {
|
|
86
|
-
unregisterStyles({ ownerDocument, styles: previousStyles });
|
|
87
|
-
}
|
|
88
|
-
registerStyles({ ownerDocument, styles });
|
|
89
|
-
};
|
|
90
|
-
export const getStyleRegistryKeys = () => styleRegistry.keys();
|
|
91
|
-
export const clearRegistry = () => {
|
|
92
|
-
styleRegistry.clear();
|
|
93
|
-
};
|
|
94
|
-
//# sourceMappingURL=style-registry.js.map
|
|
@@ -1,25 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Flowtype definitions for style-registry
|
|
3
|
-
* Generated by Flowgen from a Typescript Definition
|
|
4
|
-
* Flowgen v1.21.0
|
|
5
|
-
* @flow
|
|
6
|
-
*/
|
|
7
|
-
|
|
8
|
-
declare type Payload = {|
|
|
9
|
-
ownerDocument: Document | "global",
|
|
10
|
-
styles: string,
|
|
11
|
-
|};
|
|
12
|
-
declare export var getRegisteredStyles: (x: Payload) => {|
|
|
13
|
-
element: HTMLStyleElement | null,
|
|
14
|
-
referenceCount: number,
|
|
15
|
-
|} | null;
|
|
16
|
-
declare export var registerStyles: (x: Payload) => void;
|
|
17
|
-
declare export var unregisterStyles: (x: Payload) => void;
|
|
18
|
-
declare type UpdatePayload = {|
|
|
19
|
-
ownerDocument: Document,
|
|
20
|
-
previousStyles: string,
|
|
21
|
-
styles: string,
|
|
22
|
-
|};
|
|
23
|
-
declare export var updateStyles: (x: UpdatePayload) => void;
|
|
24
|
-
declare export var getStyleRegistryKeys: () => IterableIterator<string>;
|
|
25
|
-
declare export var clearRegistry: () => void;
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"style-registry.js","sourceRoot":"","sources":["../src/style-registry.ts"],"names":[],"mappings":"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"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
|
@@ -1,121 +0,0 @@
|
|
|
1
|
-
// @vitest-environment happy-dom
|
|
2
|
-
import { beforeEach, describe, expect, it } from 'vitest';
|
|
3
|
-
import {
|
|
4
|
-
clearRegistry,
|
|
5
|
-
getRegisteredStyles,
|
|
6
|
-
getStyleRegistryKeys,
|
|
7
|
-
registerStyles,
|
|
8
|
-
unregisterStyles,
|
|
9
|
-
updateStyles,
|
|
10
|
-
} from './style-registry.js';
|
|
11
|
-
describe('@acusti/styling', () => {
|
|
12
|
-
describe('style-registry.ts', () => {
|
|
13
|
-
const mockStyles = '.test { color: red; }';
|
|
14
|
-
// reset styleRegistry before each test
|
|
15
|
-
beforeEach(clearRegistry);
|
|
16
|
-
describe('registerStyles', () => {
|
|
17
|
-
it('should add styles to the registry keyed by the style string', () => {
|
|
18
|
-
const payload = { ownerDocument: document, styles: mockStyles };
|
|
19
|
-
registerStyles(payload);
|
|
20
|
-
const styleRegistryKeys = getStyleRegistryKeys();
|
|
21
|
-
const keysArray = [...styleRegistryKeys];
|
|
22
|
-
expect(keysArray.length).toBe(1);
|
|
23
|
-
expect(keysArray[0]).toBe(mockStyles);
|
|
24
|
-
const result = getRegisteredStyles(payload);
|
|
25
|
-
expect(result.element).toBeDefined();
|
|
26
|
-
expect(result.referenceCount).toBe(1);
|
|
27
|
-
});
|
|
28
|
-
it('should allow registering styles without a DOM via ownerDocument: "global"', () => {
|
|
29
|
-
const payload = Object.freeze({
|
|
30
|
-
ownerDocument: 'global',
|
|
31
|
-
styles: mockStyles,
|
|
32
|
-
});
|
|
33
|
-
registerStyles(payload);
|
|
34
|
-
const registryKeys = [...getStyleRegistryKeys()];
|
|
35
|
-
expect(registryKeys.length).toBe(1);
|
|
36
|
-
expect(registryKeys[0]).toBe(mockStyles);
|
|
37
|
-
const result = getRegisteredStyles(payload);
|
|
38
|
-
expect(result.element).toBeNull();
|
|
39
|
-
expect(result.referenceCount).toBe(1);
|
|
40
|
-
});
|
|
41
|
-
});
|
|
42
|
-
describe('getRegisteredStyles', () => {
|
|
43
|
-
it('should retrieve registered styles', () => {
|
|
44
|
-
const payload = { ownerDocument: document, styles: mockStyles };
|
|
45
|
-
registerStyles(payload);
|
|
46
|
-
const result = getRegisteredStyles(payload);
|
|
47
|
-
expect(result.element.tagName).toBe('STYLE');
|
|
48
|
-
expect(result.referenceCount).toBe(1);
|
|
49
|
-
});
|
|
50
|
-
});
|
|
51
|
-
describe('unregisterStyles', () => {
|
|
52
|
-
it('should remove styles from the registry if no other references to same styles exist', () => {
|
|
53
|
-
const payload = { ownerDocument: document, styles: mockStyles };
|
|
54
|
-
const otherPayload = Object.freeze({
|
|
55
|
-
ownerDocument: 'global',
|
|
56
|
-
styles: mockStyles,
|
|
57
|
-
});
|
|
58
|
-
registerStyles(payload);
|
|
59
|
-
registerStyles(otherPayload);
|
|
60
|
-
expect(getStyleRegistryKeys().next().value).toBe(mockStyles);
|
|
61
|
-
expect(getRegisteredStyles(payload).referenceCount).toBe(1);
|
|
62
|
-
expect(getRegisteredStyles(otherPayload).referenceCount).toBe(1);
|
|
63
|
-
unregisterStyles(payload);
|
|
64
|
-
// style registry for this style should still exist
|
|
65
|
-
expect(getStyleRegistryKeys().next().value).toBe(mockStyles);
|
|
66
|
-
// but this document’s styles item should be cleared
|
|
67
|
-
expect(getRegisteredStyles(payload)).toBeNull();
|
|
68
|
-
unregisterStyles(otherPayload);
|
|
69
|
-
// now the style registry should be empty
|
|
70
|
-
expect([...getStyleRegistryKeys()].length).toBe(0);
|
|
71
|
-
});
|
|
72
|
-
});
|
|
73
|
-
describe('updateStyles', () => {
|
|
74
|
-
it('should update styles in the registry, reusing the existing DOM element if no other reference', () => {
|
|
75
|
-
const previousStyles = '.previous { color: blue; }';
|
|
76
|
-
const payload = {
|
|
77
|
-
ownerDocument: document,
|
|
78
|
-
styles: previousStyles,
|
|
79
|
-
};
|
|
80
|
-
registerStyles(payload);
|
|
81
|
-
const previousStylesItem = getRegisteredStyles(payload);
|
|
82
|
-
expect(previousStylesItem.element.innerText).toBe(previousStyles);
|
|
83
|
-
updateStyles({
|
|
84
|
-
ownerDocument: document,
|
|
85
|
-
previousStyles,
|
|
86
|
-
styles: mockStyles,
|
|
87
|
-
});
|
|
88
|
-
const stylesItem = getRegisteredStyles({
|
|
89
|
-
ownerDocument: document,
|
|
90
|
-
styles: mockStyles,
|
|
91
|
-
});
|
|
92
|
-
expect(previousStylesItem.element).toBe(stylesItem.element);
|
|
93
|
-
expect(stylesItem.element.innerText).toBe(mockStyles);
|
|
94
|
-
expect(getRegisteredStyles(payload)).toBeNull();
|
|
95
|
-
});
|
|
96
|
-
it('should update styles in the registry, creating a new DOM element if there are other references', () => {
|
|
97
|
-
const previousStyles = '.previous { color: blue; }';
|
|
98
|
-
const payload = { ownerDocument: document, styles: previousStyles };
|
|
99
|
-
registerStyles(payload);
|
|
100
|
-
// create multiple references to the same styles and document
|
|
101
|
-
registerStyles(payload);
|
|
102
|
-
const previousStylesItem = getRegisteredStyles(payload);
|
|
103
|
-
expect(previousStylesItem.referenceCount).toBe(2);
|
|
104
|
-
expect(previousStylesItem.element.innerText).toBe(previousStyles);
|
|
105
|
-
updateStyles({
|
|
106
|
-
ownerDocument: document,
|
|
107
|
-
previousStyles,
|
|
108
|
-
styles: mockStyles,
|
|
109
|
-
});
|
|
110
|
-
const stylesItem = getRegisteredStyles({
|
|
111
|
-
ownerDocument: document,
|
|
112
|
-
styles: mockStyles,
|
|
113
|
-
});
|
|
114
|
-
expect(previousStylesItem.element).not.toBe(stylesItem.element);
|
|
115
|
-
expect(stylesItem.element.innerText).toBe(mockStyles);
|
|
116
|
-
expect(getRegisteredStyles(payload).referenceCount).toBe(1);
|
|
117
|
-
});
|
|
118
|
-
});
|
|
119
|
-
});
|
|
120
|
-
});
|
|
121
|
-
//# sourceMappingURL=style-registry.test.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"style-registry.test.js","sourceRoot":"","sources":["../src/style-registry.test.ts"],"names":[],"mappings":"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"}
|
package/dist/useStyles.js
DELETED
|
@@ -1,63 +0,0 @@
|
|
|
1
|
-
import { useEffect, useState } from 'react';
|
|
2
|
-
import { minifyStyles } from './minifyStyles.js';
|
|
3
|
-
const styleCache = new Map();
|
|
4
|
-
const EMPTY_STYLES_ITEM = { href: '', referenceCount: 0, styles: '' };
|
|
5
|
-
export function useStyles(styles, initialHref) {
|
|
6
|
-
const [stylesItem, setStylesItem] = useState(() => {
|
|
7
|
-
if (!styles)
|
|
8
|
-
return EMPTY_STYLES_ITEM;
|
|
9
|
-
const key = initialHref !== null && initialHref !== void 0 ? initialHref : styles;
|
|
10
|
-
let item = styleCache.get(key);
|
|
11
|
-
if (item) {
|
|
12
|
-
item.referenceCount++;
|
|
13
|
-
}
|
|
14
|
-
else {
|
|
15
|
-
const minified = minifyStyles(styles);
|
|
16
|
-
item = {
|
|
17
|
-
href: sanitizeHref(initialHref !== null && initialHref !== void 0 ? initialHref : minified),
|
|
18
|
-
referenceCount: 1,
|
|
19
|
-
styles: minified,
|
|
20
|
-
};
|
|
21
|
-
styleCache.set(key, item);
|
|
22
|
-
}
|
|
23
|
-
return item;
|
|
24
|
-
});
|
|
25
|
-
useEffect(() => {
|
|
26
|
-
if (!styles)
|
|
27
|
-
return;
|
|
28
|
-
const key = initialHref !== null && initialHref !== void 0 ? initialHref : styles;
|
|
29
|
-
if (!styleCache.get(key)) {
|
|
30
|
-
const minified = minifyStyles(styles);
|
|
31
|
-
const item = {
|
|
32
|
-
href: sanitizeHref(initialHref !== null && initialHref !== void 0 ? initialHref : minified),
|
|
33
|
-
referenceCount: 1,
|
|
34
|
-
styles: minified,
|
|
35
|
-
};
|
|
36
|
-
styleCache.set(key, item);
|
|
37
|
-
setStylesItem(item);
|
|
38
|
-
}
|
|
39
|
-
return () => {
|
|
40
|
-
const existingItem = styleCache.get(styles);
|
|
41
|
-
if (existingItem) {
|
|
42
|
-
existingItem.referenceCount--;
|
|
43
|
-
if (!existingItem.referenceCount) {
|
|
44
|
-
// TODO try scheduling this via setTimeout
|
|
45
|
-
// and add another referenceCount check
|
|
46
|
-
// to deal with instance where existing <Style>
|
|
47
|
-
// component is moved in the tree or re-keyed
|
|
48
|
-
styleCache.delete(styles);
|
|
49
|
-
}
|
|
50
|
-
}
|
|
51
|
-
};
|
|
52
|
-
}, [initialHref, styles]);
|
|
53
|
-
return stylesItem;
|
|
54
|
-
}
|
|
55
|
-
export default useStyles;
|
|
56
|
-
// Dashes in selectors in href prop create happy-dom / jsdom test errors:
|
|
57
|
-
// Invalid regular expression (“Range out of order in character class”)
|
|
58
|
-
function sanitizeHref(text) {
|
|
59
|
-
return text.replace(/-/g, '');
|
|
60
|
-
}
|
|
61
|
-
// The following export is for test usage only
|
|
62
|
-
export const getStyleCache = () => styleCache;
|
|
63
|
-
//# sourceMappingURL=useStyles.js.map
|
package/dist/useStyles.js.flow
DELETED
|
@@ -1,25 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Flowtype definitions for useStyles
|
|
3
|
-
* Generated by Flowgen from a Typescript Definition
|
|
4
|
-
* Flowgen v1.21.0
|
|
5
|
-
* @flow
|
|
6
|
-
*/
|
|
7
|
-
|
|
8
|
-
declare type StyleCache = Map<
|
|
9
|
-
string,
|
|
10
|
-
{|
|
|
11
|
-
href: string,
|
|
12
|
-
referenceCount: number,
|
|
13
|
-
styles: string,
|
|
14
|
-
|}
|
|
15
|
-
>;
|
|
16
|
-
declare export function useStyles(
|
|
17
|
-
styles: string,
|
|
18
|
-
initialHref?: string
|
|
19
|
-
): {|
|
|
20
|
-
href: string,
|
|
21
|
-
referenceCount: number,
|
|
22
|
-
styles: string,
|
|
23
|
-
|};
|
|
24
|
-
declare export default typeof useStyles;
|
|
25
|
-
declare export var getStyleCache: () => StyleCache;
|
package/dist/useStyles.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"useStyles.js","sourceRoot":"","sources":["../src/useStyles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAE5C,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAIjD,MAAM,UAAU,GAAe,IAAI,GAAG,EAAE,CAAC;AAEzC,MAAM,iBAAiB,GAAG,EAAE,IAAI,EAAE,EAAE,EAAE,cAAc,EAAE,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC;AAEtE,MAAM,UAAU,SAAS,CAAC,MAAc,EAAE,WAAoB;IAC1D,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,GAAG,EAAE;QAC9C,IAAI,CAAC,MAAM;YAAE,OAAO,iBAAiB,CAAC;QAEtC,MAAM,GAAG,GAAG,WAAW,aAAX,WAAW,cAAX,WAAW,GAAI,MAAM,CAAC;QAClC,IAAI,IAAI,GAAG,UAAU,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;QAE/B,IAAI,IAAI,EAAE,CAAC;YACP,IAAI,CAAC,cAAc,EAAE,CAAC;QAC1B,CAAC;aAAM,CAAC;YACJ,MAAM,QAAQ,GAAG,YAAY,CAAC,MAAM,CAAC,CAAC;YACtC,IAAI,GAAG;gBACH,IAAI,EAAE,YAAY,CAAC,WAAW,aAAX,WAAW,cAAX,WAAW,GAAI,QAAQ,CAAC;gBAC3C,cAAc,EAAE,CAAC;gBACjB,MAAM,EAAE,QAAQ;aACnB,CAAC;YACF,UAAU,CAAC,GAAG,CAAC,GAAG,EAAE,IAAI,CAAC,CAAC;QAC9B,CAAC;QAED,OAAO,IAAI,CAAC;IAChB,CAAC,CAAC,CAAC;IAEH,SAAS,CAAC,GAAG,EAAE;QACX,IAAI,CAAC,MAAM;YAAE,OAAO;QAEpB,MAAM,GAAG,GAAG,WAAW,aAAX,WAAW,cAAX,WAAW,GAAI,MAAM,CAAC;QAElC,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC;YACvB,MAAM,QAAQ,GAAG,YAAY,CAAC,MAAM,CAAC,CAAC;YACtC,MAAM,IAAI,GAAG;gBACT,IAAI,EAAE,YAAY,CAAC,WAAW,aAAX,WAAW,cAAX,WAAW,GAAI,QAAQ,CAAC;gBAC3C,cAAc,EAAE,CAAC;gBACjB,MAAM,EAAE,QAAQ;aACnB,CAAC;YACF,UAAU,CAAC,GAAG,CAAC,GAAG,EAAE,IAAI,CAAC,CAAC;YAC1B,aAAa,CAAC,IAAI,CAAC,CAAC;QACxB,CAAC;QAED,OAAO,GAAG,EAAE;YACR,MAAM,YAAY,GAAG,UAAU,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC;YAC5C,IAAI,YAAY,EAAE,CAAC;gBACf,YAAY,CAAC,cAAc,EAAE,CAAC;gBAC9B,IAAI,CAAC,YAAY,CAAC,cAAc,EAAE,CAAC;oBAC/B,0CAA0C;oBAC1C,uCAAuC;oBACvC,+CAA+C;oBAC/C,6CAA6C;oBAC7C,UAAU,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;gBAC9B,CAAC;YACL,CAAC;QACL,CAAC,CAAC;IACN,CAAC,EAAE,CAAC,WAAW,EAAE,MAAM,CAAC,CAAC,CAAC;IAE1B,OAAO,UAAU,CAAC;AACtB,CAAC;AAED,eAAe,SAAS,CAAC;AAEzB,yEAAyE;AACzE,uEAAuE;AACvE,SAAS,YAAY,CAAC,IAAY;IAC9B,OAAO,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;AAClC,CAAC;AAED,8CAA8C;AAC9C,MAAM,CAAC,MAAM,aAAa,GAAG,GAAG,EAAE,CAAC,UAAU,CAAC"}
|
package/dist/useStyles.test.d.ts
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
package/dist/useStyles.test.js
DELETED
|
@@ -1,79 +0,0 @@
|
|
|
1
|
-
// @vitest-environment happy-dom
|
|
2
|
-
import { render } from '@testing-library/react';
|
|
3
|
-
import React from 'react';
|
|
4
|
-
import { beforeEach, describe, expect, it } from 'vitest';
|
|
5
|
-
import Style from './Style.js';
|
|
6
|
-
import { getStyleCache } from './useStyles.js';
|
|
7
|
-
describe('@acusti/styling', () => {
|
|
8
|
-
describe('useStyles.ts', () => {
|
|
9
|
-
const mockStylesA = '.test-a {\n color: cyan;\n}';
|
|
10
|
-
const mockStylesB = '.test-b {\n padding: 10px;\n}';
|
|
11
|
-
// reset styleCache before each test
|
|
12
|
-
beforeEach(() => {
|
|
13
|
-
getStyleCache().clear();
|
|
14
|
-
});
|
|
15
|
-
it('should cache minified styles in the registry keyed by the style string', () => {
|
|
16
|
-
const styleCache = getStyleCache();
|
|
17
|
-
const { rerender } = render(React.createElement(React.Fragment, null,
|
|
18
|
-
React.createElement(Style, null, mockStylesA),
|
|
19
|
-
React.createElement(Style, null, mockStylesA)));
|
|
20
|
-
let stylesItemA = styleCache.get(mockStylesA);
|
|
21
|
-
expect(stylesItemA === null || stylesItemA === void 0 ? void 0 : stylesItemA.referenceCount).toBe(2);
|
|
22
|
-
expect(stylesItemA === null || stylesItemA === void 0 ? void 0 : stylesItemA.styles).toBe('.test-a{color:cyan}');
|
|
23
|
-
expect(styleCache.size).toBe(1);
|
|
24
|
-
rerender(React.createElement(Style, null, mockStylesA));
|
|
25
|
-
expect(stylesItemA === null || stylesItemA === void 0 ? void 0 : stylesItemA.referenceCount).toBe(1);
|
|
26
|
-
expect(stylesItemA).toBe(styleCache.get(mockStylesA));
|
|
27
|
-
expect(styleCache.size).toBe(1);
|
|
28
|
-
rerender(React.createElement(Style, null, mockStylesB));
|
|
29
|
-
stylesItemA = styleCache.get(mockStylesA);
|
|
30
|
-
expect(stylesItemA).toBe(undefined);
|
|
31
|
-
let stylesItemB = styleCache.get(mockStylesB);
|
|
32
|
-
expect(stylesItemB === null || stylesItemB === void 0 ? void 0 : stylesItemB.referenceCount).toBe(1);
|
|
33
|
-
expect(styleCache.size).toBe(1);
|
|
34
|
-
rerender(React.createElement(React.Fragment, null,
|
|
35
|
-
React.createElement(Style, null, mockStylesA),
|
|
36
|
-
React.createElement(Style, null, mockStylesB)));
|
|
37
|
-
stylesItemA = styleCache.get(mockStylesA);
|
|
38
|
-
expect(stylesItemA === null || stylesItemA === void 0 ? void 0 : stylesItemA.referenceCount).toBe(1);
|
|
39
|
-
expect(stylesItemA).toBe(styleCache.get(mockStylesA));
|
|
40
|
-
stylesItemB = styleCache.get(mockStylesB);
|
|
41
|
-
expect(stylesItemB === null || stylesItemB === void 0 ? void 0 : stylesItemB.referenceCount).toBe(1);
|
|
42
|
-
expect(styleCache.size).toBe(2);
|
|
43
|
-
rerender(React.createElement("div", null));
|
|
44
|
-
expect(styleCache.size).toBe(0);
|
|
45
|
-
});
|
|
46
|
-
it('should preserve style cache across component position changes and re-keying', () => {
|
|
47
|
-
const styleCache = getStyleCache();
|
|
48
|
-
const { rerender } = render(React.createElement(React.Fragment, null,
|
|
49
|
-
React.createElement(Style, null, mockStylesA)));
|
|
50
|
-
const stylesItemA = styleCache.get(mockStylesA);
|
|
51
|
-
expect(stylesItemA === null || stylesItemA === void 0 ? void 0 : stylesItemA.referenceCount).toBe(1);
|
|
52
|
-
expect(stylesItemA === null || stylesItemA === void 0 ? void 0 : stylesItemA.styles).toBe('.test-a{color:cyan}');
|
|
53
|
-
expect(styleCache.size).toBe(1);
|
|
54
|
-
rerender(React.createElement(React.Fragment, null,
|
|
55
|
-
React.createElement(Style, null, mockStylesB),
|
|
56
|
-
React.createElement(Style, null, mockStylesA)));
|
|
57
|
-
expect(stylesItemA === null || stylesItemA === void 0 ? void 0 : stylesItemA.referenceCount).toBe(1);
|
|
58
|
-
expect(stylesItemA).toBe(styleCache.get(mockStylesA));
|
|
59
|
-
rerender(React.createElement(Style, { key: "new-a" }, mockStylesA));
|
|
60
|
-
expect(stylesItemA === null || stylesItemA === void 0 ? void 0 : stylesItemA.referenceCount).toBe(1);
|
|
61
|
-
expect(stylesItemA).toBe(styleCache.get(mockStylesA));
|
|
62
|
-
rerender(React.createElement(React.Fragment, null,
|
|
63
|
-
React.createElement(Style, null, mockStylesA),
|
|
64
|
-
React.createElement(Style, { key: "new-a" }, mockStylesA)));
|
|
65
|
-
expect(stylesItemA === null || stylesItemA === void 0 ? void 0 : stylesItemA.referenceCount).toBe(2);
|
|
66
|
-
expect(stylesItemA).toBe(styleCache.get(mockStylesA));
|
|
67
|
-
rerender(React.createElement("div", null));
|
|
68
|
-
expect(stylesItemA === null || stylesItemA === void 0 ? void 0 : stylesItemA.referenceCount).toBe(0);
|
|
69
|
-
expect(styleCache.size).toBe(0);
|
|
70
|
-
});
|
|
71
|
-
it('should sanitize styles used as href prop if no href prop provided', () => {
|
|
72
|
-
render(React.createElement(Style, null, `div[data-foo-bar] { color: cyan; }`));
|
|
73
|
-
// the two-dash attribute selector results in “Range out of order in character class”
|
|
74
|
-
// and render() fails with SyntaxError: Invalid regular expression if not sanitized
|
|
75
|
-
expect(true).toBeTruthy();
|
|
76
|
-
});
|
|
77
|
-
});
|
|
78
|
-
});
|
|
79
|
-
//# sourceMappingURL=useStyles.test.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"useStyles.test.js","sourceRoot":"","sources":["../src/useStyles.test.tsx"],"names":[],"mappings":"AAAA,gCAAgC;AAChC,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAC;AAChD,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,QAAQ,CAAC;AAE1D,OAAO,KAAK,MAAM,YAAY,CAAC;AAC/B,OAAO,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAE/C,QAAQ,CAAC,iBAAiB,EAAE,GAAG,EAAE;IAC7B,QAAQ,CAAC,cAAc,EAAE,GAAG,EAAE;QAC1B,MAAM,WAAW,GAAG,8BAA8B,CAAC;QACnD,MAAM,WAAW,GAAG,gCAAgC,CAAC;QAErD,oCAAoC;QACpC,UAAU,CAAC,GAAG,EAAE;YACZ,aAAa,EAAE,CAAC,KAAK,EAAE,CAAC;QAC5B,CAAC,CAAC,CAAC;QAEH,EAAE,CAAC,wEAAwE,EAAE,GAAG,EAAE;YAC9E,MAAM,UAAU,GAAG,aAAa,EAAE,CAAC;YAEnC,MAAM,EAAE,QAAQ,EAAE,GAAG,MAAM,CACvB,oBAAC,KAAK,CAAC,QAAQ;gBACX,oBAAC,KAAK,QAAE,WAAW,CAAS;gBAC5B,oBAAC,KAAK,QAAE,WAAW,CAAS,CACf,CACpB,CAAC;YAEF,IAAI,WAAW,GAAG,UAAU,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;YAC9C,MAAM,CAAC,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,cAAc,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;YAC5C,MAAM,CAAC,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,MAAM,CAAC,CAAC,IAAI,CAAC,qBAAqB,CAAC,CAAC;YACxD,MAAM,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;YAEhC,QAAQ,CAAC,oBAAC,KAAK,QAAE,WAAW,CAAS,CAAC,CAAC;YACvC,MAAM,CAAC,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,cAAc,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;YAC5C,MAAM,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC,CAAC;YACtD,MAAM,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;YAEhC,QAAQ,CAAC,oBAAC,KAAK,QAAE,WAAW,CAAS,CAAC,CAAC;YACvC,WAAW,GAAG,UAAU,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;YAC1C,MAAM,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;YACpC,IAAI,WAAW,GAAG,UAAU,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;YAC9C,MAAM,CAAC,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,cAAc,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;YAC5C,MAAM,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;YAEhC,QAAQ,CACJ,oBAAC,KAAK,CAAC,QAAQ;gBACX,oBAAC,KAAK,QAAE,WAAW,CAAS;gBAC5B,oBAAC,KAAK,QAAE,WAAW,CAAS,CACf,CACpB,CAAC;YACF,WAAW,GAAG,UAAU,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;YAC1C,MAAM,CAAC,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,cAAc,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;YAC5C,MAAM,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC,CAAC;YACtD,WAAW,GAAG,UAAU,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;YAC1C,MAAM,CAAC,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,cAAc,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;YAC5C,MAAM,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;YAEhC,QAAQ,CAAC,gCAAO,CAAC,CAAC;YAClB,MAAM,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;QACpC,CAAC,CAAC,CAAC;QAEH,EAAE,CAAC,6EAA6E,EAAE,GAAG,EAAE;YACnF,MAAM,UAAU,GAAG,aAAa,EAAE,CAAC;YAEnC,MAAM,EAAE,QAAQ,EAAE,GAAG,MAAM,CACvB,oBAAC,KAAK,CAAC,QAAQ;gBACX,oBAAC,KAAK,QAAE,WAAW,CAAS,CACf,CACpB,CAAC;YAEF,MAAM,WAAW,GAAG,UAAU,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;YAChD,MAAM,CAAC,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,cAAc,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;YAC5C,MAAM,CAAC,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,MAAM,CAAC,CAAC,IAAI,CAAC,qBAAqB,CAAC,CAAC;YACxD,MAAM,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;YAEhC,QAAQ,CACJ,oBAAC,KAAK,CAAC,QAAQ;gBACX,oBAAC,KAAK,QAAE,WAAW,CAAS;gBAC5B,oBAAC,KAAK,QAAE,WAAW,CAAS,CACf,CACpB,CAAC;YACF,MAAM,CAAC,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,cAAc,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;YAC5C,MAAM,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC,CAAC;YAEtD,QAAQ,CAAC,oBAAC,KAAK,IAAC,GAAG,EAAC,OAAO,IAAE,WAAW,CAAS,CAAC,CAAC;YACnD,MAAM,CAAC,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,cAAc,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;YAC5C,MAAM,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC,CAAC;YAEtD,QAAQ,CACJ,oBAAC,KAAK,CAAC,QAAQ;gBACX,oBAAC,KAAK,QAAE,WAAW,CAAS;gBAC5B,oBAAC,KAAK,IAAC,GAAG,EAAC,OAAO,IAAE,WAAW,CAAS,CAC3B,CACpB,CAAC;YACF,MAAM,CAAC,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,cAAc,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;YAC5C,MAAM,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC,CAAC;YAEtD,QAAQ,CAAC,gCAAO,CAAC,CAAC;YAClB,MAAM,CAAC,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,cAAc,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;YAC5C,MAAM,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;QACpC,CAAC,CAAC,CAAC;QAEH,EAAE,CAAC,mEAAmE,EAAE,GAAG,EAAE;YACzE,MAAM,CAAC,oBAAC,KAAK,QAAE,oCAAoC,CAAS,CAAC,CAAC;YAC9D,qFAAqF;YACrF,mFAAmF;YACnF,MAAM,CAAC,IAAI,CAAC,CAAC,UAAU,EAAE,CAAC;QAC9B,CAAC,CAAC,CAAC;IACP,CAAC,CAAC,CAAC;AACP,CAAC,CAAC,CAAC"}
|
package/src/Style.tsx
DELETED
|
@@ -1,22 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
|
|
3
|
-
import { useStyles } from './useStyles.js';
|
|
4
|
-
|
|
5
|
-
type Props = {
|
|
6
|
-
children: string;
|
|
7
|
-
href?: string;
|
|
8
|
-
precedence?: string;
|
|
9
|
-
};
|
|
10
|
-
|
|
11
|
-
const Style = ({ children, href: _href, precedence = 'medium' }: Props) => {
|
|
12
|
-
// Minify CSS styles to prevent unnecessary cache misses
|
|
13
|
-
const { href, styles } = useStyles(children, _href);
|
|
14
|
-
|
|
15
|
-
return (
|
|
16
|
-
<style href={href} precedence={precedence}>
|
|
17
|
-
{styles}
|
|
18
|
-
</style>
|
|
19
|
-
);
|
|
20
|
-
};
|
|
21
|
-
|
|
22
|
-
export default Style;
|
package/src/index.ts
DELETED
package/src/minifyStyles.test.ts
DELETED
|
@@ -1,44 +0,0 @@
|
|
|
1
|
-
import { describe, expect, it } from 'vitest';
|
|
2
|
-
|
|
3
|
-
import { minifyStyles } from './minifyStyles.js';
|
|
4
|
-
|
|
5
|
-
describe('@acusti/styling', () => {
|
|
6
|
-
describe('minifyStyles.ts', () => {
|
|
7
|
-
it('minifies basic CSS declarations', () => {
|
|
8
|
-
expect(
|
|
9
|
-
minifyStyles(`
|
|
10
|
-
.foo {
|
|
11
|
-
padding: 10px;
|
|
12
|
-
color: red;
|
|
13
|
-
}`),
|
|
14
|
-
).toBe('.foo{padding:10px;color:red}');
|
|
15
|
-
});
|
|
16
|
-
|
|
17
|
-
it('preserves whitespace where needed in selectors', () => {
|
|
18
|
-
expect(
|
|
19
|
-
minifyStyles(`
|
|
20
|
-
.foo > .bar :hover {
|
|
21
|
-
background-color: cyan;
|
|
22
|
-
}`),
|
|
23
|
-
).toBe('.foo>.bar :hover{background-color:cyan}');
|
|
24
|
-
});
|
|
25
|
-
|
|
26
|
-
it('minifies 0.6 to .6, but only when preceded by : or a whitespace', () => {
|
|
27
|
-
expect(
|
|
28
|
-
minifyStyles(`
|
|
29
|
-
.foo {
|
|
30
|
-
opacity: 0.6;
|
|
31
|
-
}`),
|
|
32
|
-
).toBe('.foo{opacity:.6}');
|
|
33
|
-
});
|
|
34
|
-
|
|
35
|
-
it('strips out comments', () => {
|
|
36
|
-
expect(
|
|
37
|
-
minifyStyles(`
|
|
38
|
-
.bar {
|
|
39
|
-
font-weight: 900;/*.bar is so *strong**/
|
|
40
|
-
}`),
|
|
41
|
-
).toBe('.bar{font-weight:900}');
|
|
42
|
-
});
|
|
43
|
-
});
|
|
44
|
-
});
|