simplestyle-js 3.4.0 → 3.4.2-alpha.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.
Files changed (74) hide show
  1. package/LICENSE +1 -1
  2. package/dist/cjs/createStyles.cjs +202 -0
  3. package/dist/cjs/createStyles.d.ts +47 -0
  4. package/dist/cjs/generateClassName.cjs +62 -0
  5. package/dist/cjs/generateClassName.d.ts +3 -0
  6. package/dist/cjs/index.cjs +71 -0
  7. package/dist/cjs/numToAlpha.cjs +14 -0
  8. package/dist/cjs/numToAlpha.d.ts +1 -0
  9. package/dist/cjs/package.json +1 -0
  10. package/dist/cjs/plugins.cjs +25 -0
  11. package/dist/cjs/plugins.d.ts +3 -0
  12. package/dist/cjs/react/index.cjs +18 -0
  13. package/dist/cjs/react/useCreateStyles.cjs +73 -0
  14. package/dist/cjs/react/useCreateStyles.d.ts +3 -0
  15. package/dist/cjs/simpleStyleRegistry.cjs +25 -0
  16. package/dist/cjs/simpleStyleRegistry.d.ts +11 -0
  17. package/dist/cjs/types.cjs +4 -0
  18. package/{src/types.ts → dist/cjs/types.d.ts} +1 -3
  19. package/dist/cjs/util/deepEqual.cjs +27 -0
  20. package/dist/cjs/util/deepEqual.d.ts +1 -0
  21. package/dist/cjs/util/index.cjs +18 -0
  22. package/dist/esm/createStyles.d.ts +47 -0
  23. package/dist/esm/createStyles.mjs +174 -0
  24. package/dist/esm/generateClassName.d.ts +3 -0
  25. package/dist/esm/generateClassName.mjs +36 -0
  26. package/dist/esm/index.d.ts +6 -0
  27. package/dist/esm/index.mjs +3 -0
  28. package/dist/esm/numToAlpha.d.ts +1 -0
  29. package/dist/esm/numToAlpha.mjs +4 -0
  30. package/dist/esm/package.json +1 -0
  31. package/dist/esm/plugins.d.ts +3 -0
  32. package/dist/esm/plugins.mjs +7 -0
  33. package/dist/esm/react/index.d.ts +1 -0
  34. package/dist/esm/react/index.mjs +1 -0
  35. package/dist/esm/react/useCreateStyles.d.ts +3 -0
  36. package/dist/esm/react/useCreateStyles.mjs +58 -0
  37. package/dist/esm/simpleStyleRegistry.d.ts +11 -0
  38. package/dist/esm/simpleStyleRegistry.mjs +15 -0
  39. package/dist/esm/types.d.ts +5 -0
  40. package/dist/esm/types.mjs +1 -0
  41. package/dist/esm/util/deepEqual.d.ts +1 -0
  42. package/dist/esm/util/deepEqual.mjs +17 -0
  43. package/dist/esm/util/index.d.ts +1 -0
  44. package/dist/esm/util/index.mjs +1 -0
  45. package/package.json +14 -1
  46. package/.coveralls.yml +0 -2
  47. package/.editorconfig +0 -7
  48. package/.prettierrc +0 -7
  49. package/.tool-versions +0 -3
  50. package/.travis.yml +0 -8
  51. package/.vscode/launch.json +0 -36
  52. package/.vscode/settings.json +0 -3
  53. package/CHANGELOG.md +0 -273
  54. package/eslint.config.js +0 -3
  55. package/setup.sh +0 -4
  56. package/src/createStyles.ts +0 -251
  57. package/src/generateClassName.ts +0 -43
  58. package/src/numToAlpha.ts +0 -5
  59. package/src/plugins.ts +0 -11
  60. package/src/react/useCreateStyles.ts +0 -58
  61. package/src/util/deepEqual.ts +0 -20
  62. package/test/createStyles.spec.ts +0 -330
  63. package/test/deepEqual.spec.ts +0 -97
  64. package/test/generateClassName.spec.ts +0 -48
  65. package/test/keyframes.spec.ts +0 -19
  66. package/test/plugins.spec.ts +0 -43
  67. package/test/react/useCreateStyles.spec.tsx +0 -65
  68. package/test/updateStyles.spec.ts +0 -41
  69. package/tsconfig.build.json +0 -8
  70. package/tsconfig.json +0 -37
  71. package/vite.config.ts +0 -9
  72. /package/{src/index.ts → dist/cjs/index.d.ts} +0 -0
  73. /package/{src/react/index.ts → dist/cjs/react/index.d.ts} +0 -0
  74. /package/{src/util/index.ts → dist/cjs/util/index.d.ts} +0 -0
package/LICENSE CHANGED
@@ -1,6 +1,6 @@
1
1
  MIT License
2
2
 
3
- Copyright (c) 2020 Benjamin Duran
3
+ Copyright (c) 2025 Benjamin Duran
4
4
 
5
5
  Permission is hereby granted, free of charge, to any person obtaining a copy
6
6
  of this software and associated documentation files (the "Software"), to deal
@@ -0,0 +1,202 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", {
3
+ value: true
4
+ });
5
+ function _export(target, all) {
6
+ for(var name in all)Object.defineProperty(target, name, {
7
+ enumerable: true,
8
+ get: Object.getOwnPropertyDescriptor(all, name).get
9
+ });
10
+ }
11
+ _export(exports, {
12
+ get default () {
13
+ return createStyles;
14
+ },
15
+ get keyframes () {
16
+ return keyframes;
17
+ },
18
+ get makeCreateStyle () {
19
+ return makeCreateStyle;
20
+ },
21
+ get rawStyles () {
22
+ return rawStyles;
23
+ }
24
+ });
25
+ const _deepmerge = /*#__PURE__*/ _interop_require_default(require("deepmerge"));
26
+ const _generateClassName = require("./generateClassName.cjs");
27
+ const _plugins = require("./plugins.cjs");
28
+ function _interop_require_default(obj) {
29
+ return obj && obj.__esModule ? obj : {
30
+ default: obj
31
+ };
32
+ }
33
+ function isNestedSelector(r) {
34
+ return /&/g.test(r);
35
+ }
36
+ function isMedia(r) {
37
+ return r.toLowerCase().startsWith('@media');
38
+ }
39
+ function formatCSSRuleName(rule) {
40
+ return rule.replaceAll(/([A-Z])/g, (p1)=>`-${p1.toLowerCase()}`);
41
+ }
42
+ function formatCSSRules(cssRules) {
43
+ return Object.entries(cssRules).reduce((prev, [cssProp, cssVal])=>`${prev}${formatCSSRuleName(cssProp)}:${String(cssVal)};`, '');
44
+ }
45
+ function execCreateStyles(rules, options, parentSelector, noGenerateClassName = false) {
46
+ const out = {};
47
+ let sheetBuffer = '';
48
+ let mediaQueriesBuffer = '';
49
+ const styleEntries = Object.entries(rules);
50
+ let ruleWriteOpen = false;
51
+ const guardCloseRuleWrite = ()=>{
52
+ if (ruleWriteOpen) sheetBuffer += '}';
53
+ ruleWriteOpen = false;
54
+ };
55
+ for (const [classNameOrCSSRule, classNameRules] of styleEntries){
56
+ // if the classNameRules is a string, we are dealing with a display: none; type rule
57
+ if (isMedia(classNameOrCSSRule)) {
58
+ if (typeof classNameRules !== 'object') throw new Error('Unable to map @media query because rules / props are an invalid type');
59
+ guardCloseRuleWrite();
60
+ mediaQueriesBuffer += `${classNameOrCSSRule}{`;
61
+ const { mediaQueriesBuffer: mediaQueriesOutput, sheetBuffer: regularOutput } = execCreateStyles(classNameRules, options, parentSelector);
62
+ mediaQueriesBuffer += regularOutput;
63
+ mediaQueriesBuffer += '}';
64
+ mediaQueriesBuffer += mediaQueriesOutput;
65
+ } else if (isNestedSelector(classNameOrCSSRule)) {
66
+ if (!parentSelector) throw new Error('Unable to generate nested rule because parentSelector is missing');
67
+ guardCloseRuleWrite();
68
+ // format of { '& > span': { display: 'none' } } (or further nesting)
69
+ const replaced = classNameOrCSSRule.replaceAll('&', parentSelector);
70
+ for (const selector of replaced.split(/,\s*/)){
71
+ const { mediaQueriesBuffer: mediaQueriesOutput, sheetBuffer: regularOutput } = execCreateStyles(classNameRules, options, selector);
72
+ sheetBuffer += regularOutput;
73
+ mediaQueriesBuffer += mediaQueriesOutput;
74
+ }
75
+ } else if (!parentSelector && typeof classNameRules === 'object') {
76
+ guardCloseRuleWrite();
77
+ const generated = noGenerateClassName ? classNameOrCSSRule : (0, _generateClassName.generateClassName)(classNameOrCSSRule);
78
+ // @ts-expect-error - yes, we can index this object here, so be quiet
79
+ out[classNameOrCSSRule] = generated;
80
+ const generatedSelector = `${noGenerateClassName ? '' : '.'}${generated}`;
81
+ const { mediaQueriesBuffer: mediaQueriesOutput, sheetBuffer: regularOutput } = execCreateStyles(classNameRules, options, generatedSelector);
82
+ sheetBuffer += regularOutput;
83
+ mediaQueriesBuffer += mediaQueriesOutput;
84
+ } else {
85
+ if (!parentSelector) throw new Error('Unable to write css props because parent selector is null');
86
+ if (ruleWriteOpen) {
87
+ sheetBuffer += formatCSSRules({
88
+ [classNameOrCSSRule]: classNameRules
89
+ });
90
+ } else {
91
+ sheetBuffer += `${parentSelector}{${formatCSSRules({
92
+ [classNameOrCSSRule]: classNameRules
93
+ })}`;
94
+ ruleWriteOpen = true;
95
+ }
96
+ }
97
+ }
98
+ guardCloseRuleWrite();
99
+ return {
100
+ classes: out,
101
+ sheetBuffer,
102
+ mediaQueriesBuffer
103
+ };
104
+ }
105
+ function replaceBackReferences(out, sheetContents) {
106
+ let outputSheetContents = sheetContents;
107
+ const toReplace = [];
108
+ const toReplaceRegex = /\$\w([a-zA-Z0-9_-]+)?/gm;
109
+ let matches = toReplaceRegex.exec(outputSheetContents);
110
+ while(matches){
111
+ toReplace.push(matches[0].valueOf());
112
+ matches = toReplaceRegex.exec(outputSheetContents);
113
+ }
114
+ for (const r of toReplace){
115
+ outputSheetContents = outputSheetContents.replace(r, `.${out[r.slice(1)] ?? ''}`);
116
+ }
117
+ return (0, _plugins.getPosthooks)().reduce((prev, hook)=>hook(prev), outputSheetContents);
118
+ }
119
+ function createSheet(sheetContents) {
120
+ const doc = globalThis.document;
121
+ if (doc === undefined) return null;
122
+ // eslint-disable-next-line @typescript-eslint/no-deprecated
123
+ if (typeof doc?.head?.appendChild !== 'function' || typeof doc.createElement !== 'function') return null;
124
+ const styleTag = doc.createElement('style');
125
+ styleTag.innerHTML = sheetContents;
126
+ return styleTag;
127
+ }
128
+ function flushSheetContents(sheetContents, options) {
129
+ // In case we're in come weird test environment that doesn't support JSDom
130
+ const styleTag = createSheet(sheetContents);
131
+ if (styleTag) {
132
+ if (options?.insertAfter && options.insertBefore) {
133
+ throw new Error('Both insertAfter and insertBefore were provided. Please choose only one.');
134
+ }
135
+ if (options?.insertAfter?.after) options.insertAfter.after(styleTag);
136
+ else if (options?.insertBefore?.before) options.insertBefore.before(styleTag);
137
+ else document.head.append(styleTag);
138
+ }
139
+ return styleTag;
140
+ }
141
+ function coerceCreateStylesOptions(options) {
142
+ return {
143
+ flush: options && typeof options.flush === 'boolean' ? options.flush : true
144
+ };
145
+ }
146
+ function rawStyles(rules, options) {
147
+ const coerced = coerceCreateStylesOptions(options);
148
+ const { sheetBuffer: sheetContents, mediaQueriesBuffer: mediaQueriesContents } = execCreateStyles(rules, coerced, null, true);
149
+ const mergedContents = `${sheetContents}${mediaQueriesContents}`;
150
+ if (coerced.flush) flushSheetContents(mergedContents, options);
151
+ return mergedContents;
152
+ }
153
+ function keyframes(frames, options) {
154
+ const coerced = coerceCreateStylesOptions(options);
155
+ const keyframeName = (0, _generateClassName.generateClassName)('keyframes_');
156
+ const { sheetBuffer: keyframesContents } = execCreateStyles(frames, coerced, null, true);
157
+ const sheetContents = `@keyframes ${keyframeName}{${keyframesContents}}`;
158
+ if (coerced.flush) flushSheetContents(sheetContents);
159
+ return [
160
+ keyframeName,
161
+ sheetContents
162
+ ];
163
+ }
164
+ function makeCreateStyle(registry) {
165
+ return function wrappedCreateStyles(rules) {
166
+ return createStyles(rules, {
167
+ registry
168
+ });
169
+ };
170
+ }
171
+ function createStyles(rules, options) {
172
+ const coerced = coerceCreateStylesOptions(options);
173
+ const { classes: out, sheetBuffer: sheetContents, mediaQueriesBuffer: mediaQueriesContents } = execCreateStyles(rules, coerced, null);
174
+ const mergedContents = `${sheetContents}${mediaQueriesContents}`;
175
+ const replacedSheetContents = replaceBackReferences(out, mergedContents);
176
+ let sheet = null;
177
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
178
+ const updateSheet = (updatedRules)=>{
179
+ if ((options?.flush || options?.registry) && sheet || !options?.flush) {
180
+ // We prefer the first set, and then we shallow merge
181
+ const { classes: updatedOut, sheetBuffer: updatedSheetContents, mediaQueriesBuffer: updatedMediaQueriesContents } = execCreateStyles((0, _deepmerge.default)(rules, updatedRules), {
182
+ flush: false
183
+ }, null);
184
+ const updatedMergedContents = `${updatedSheetContents}${updatedMediaQueriesContents}`;
185
+ const updatedReplacedSheetContents = replaceBackReferences(out, updatedMergedContents);
186
+ if (sheet) sheet.innerHTML = updatedReplacedSheetContents;
187
+ return {
188
+ classes: updatedOut,
189
+ stylesheet: updatedSheetContents
190
+ };
191
+ }
192
+ return null;
193
+ };
194
+ if (!options?.registry && coerced.flush) sheet = flushSheetContents(replacedSheetContents, options);
195
+ else if (options?.registry) options.registry.add(replacedSheetContents);
196
+ // Need this TS cast to get solid code assist from the consumption-side
197
+ return {
198
+ classes: out,
199
+ stylesheet: replacedSheetContents,
200
+ updateSheet
201
+ };
202
+ }
@@ -0,0 +1,47 @@
1
+ import { Properties } from 'csstype';
2
+ import { SimpleStyleRegistry } from './simpleStyleRegistry.js';
3
+ import { SimpleStyleRules } from './types.js';
4
+ export type CreateStylesOptions = Partial<{
5
+ /**
6
+ * If true, automatically renders generated styles
7
+ * to the DOM in an injected <style /> tag
8
+ */
9
+ flush: boolean;
10
+ /**
11
+ * If set, along with flush: true,
12
+ * will render the injected <style /> after this element
13
+ */
14
+ insertAfter?: HTMLElement;
15
+ /**
16
+ * If set, along with flush: true,
17
+ * will render the injects <style /> before this element
18
+ */
19
+ insertBefore?: HTMLElement;
20
+ /**
21
+ * if set, will automatically prevent any styles from
22
+ * being flushed to the DOM or inserted at all.
23
+ * All styles will be accumulated in the registry
24
+ * and it will be up to you to determine how they should
25
+ * be flushed.
26
+ */
27
+ registry?: SimpleStyleRegistry;
28
+ }>;
29
+ export declare function rawStyles<T extends SimpleStyleRules, K extends keyof T, O extends Record<K, string>>(rules: T, options?: Partial<CreateStylesOptions>): string;
30
+ export declare function keyframes<T extends Record<string, Properties>>(frames: T, options?: CreateStylesOptions): [string, string];
31
+ export declare function makeCreateStyle(registry: SimpleStyleRegistry): <T extends SimpleStyleRules, K extends keyof T, O extends Record<K, string>>(rules: T) => {
32
+ classes: O;
33
+ stylesheet: string;
34
+ updateSheet: <T2 extends SimpleStyleRules, K2 extends keyof T2, O2 extends Record<K2, string>>(updatedRules: Partial<T2>) => {
35
+ classes: Record<string | number | keyof T2, string>;
36
+ stylesheet: string;
37
+ } | null;
38
+ };
39
+ export default function createStyles<T extends SimpleStyleRules, K extends keyof T, O extends Record<K, string>>(rules: T, options?: Partial<CreateStylesOptions>): {
40
+ classes: O;
41
+ stylesheet: string;
42
+ updateSheet: <T2 extends SimpleStyleRules, K2 extends keyof T2, O2 extends Record<K2, string>>(updatedRules: Partial<T2>) => {
43
+ classes: Record<string | number | keyof T2, string>;
44
+ stylesheet: string;
45
+ } | null;
46
+ };
47
+ export type CreateStylesArgs = Parameters<typeof createStyles>;
@@ -0,0 +1,62 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", {
3
+ value: true
4
+ });
5
+ function _export(target, all) {
6
+ for(var name in all)Object.defineProperty(target, name, {
7
+ enumerable: true,
8
+ get: Object.getOwnPropertyDescriptor(all, name).get
9
+ });
10
+ }
11
+ _export(exports, {
12
+ get generateClassName () {
13
+ return generateClassName;
14
+ },
15
+ get getUniqueSuffix () {
16
+ return getUniqueSuffix;
17
+ },
18
+ get setSeed () {
19
+ return setSeed;
20
+ }
21
+ });
22
+ const _numToAlpha = /*#__PURE__*/ _interop_require_default(require("./numToAlpha.cjs"));
23
+ function _interop_require_default(obj) {
24
+ return obj && obj.__esModule ? obj : {
25
+ default: obj
26
+ };
27
+ }
28
+ let inc = Date.now();
29
+ function setSeed(seed) {
30
+ if (seed === null) {
31
+ inc = Date.now();
32
+ return;
33
+ }
34
+ if (typeof seed !== 'number') throw new Error('Unable to setSeed as provided seed was not a valid number');
35
+ if (seed === Number.MAX_SAFE_INTEGER) throw new Error('Unable to setSeed because the seed was already the maximum safe JavaScript number allowed');
36
+ if (seed === Number.POSITIVE_INFINITY || seed === Number.NEGATIVE_INFINITY) throw new Error('Unable to setSeed. Positive or negative infinity is not allowed');
37
+ if (seed < 0) throw new Error('Unable to setSeed. Seed must be a number >= 0');
38
+ inc = seed;
39
+ }
40
+ const numPairsRegex = /(\d{1,2})/g;
41
+ function getUniqueSuffix() {
42
+ const numPairs = [];
43
+ const incStr = inc.toString();
44
+ let result = numPairsRegex.exec(incStr);
45
+ while(result){
46
+ numPairs.push(result[0]);
47
+ result = numPairsRegex.exec(incStr);
48
+ }
49
+ let out = '_';
50
+ for (const pair of numPairs){
51
+ const val = +pair;
52
+ if (val > 25) {
53
+ const [first, second] = pair.split('');
54
+ out += `${(0, _numToAlpha.default)(Number(first))}${(0, _numToAlpha.default)(Number(second))}`;
55
+ } else out += (0, _numToAlpha.default)(val);
56
+ }
57
+ inc += 1;
58
+ return out;
59
+ }
60
+ function generateClassName(c) {
61
+ return `${c}${getUniqueSuffix()}`;
62
+ }
@@ -0,0 +1,3 @@
1
+ export declare function setSeed(seed: number | null): void;
2
+ export declare function getUniqueSuffix(): string;
3
+ export declare function generateClassName(c: string): string;
@@ -0,0 +1,71 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", {
3
+ value: true
4
+ });
5
+ function _export(target, all) {
6
+ for(var name in all)Object.defineProperty(target, name, {
7
+ enumerable: true,
8
+ get: Object.getOwnPropertyDescriptor(all, name).get
9
+ });
10
+ }
11
+ _export(exports, {
12
+ get createStyles () {
13
+ return _createStyles.default;
14
+ },
15
+ get keyframes () {
16
+ return _createStyles.keyframes;
17
+ },
18
+ get rawStyles () {
19
+ return _createStyles.rawStyles;
20
+ },
21
+ get registerPosthook () {
22
+ return _plugins.registerPosthook;
23
+ },
24
+ get setSeed () {
25
+ return _generateClassName.setSeed;
26
+ }
27
+ });
28
+ const _createStyles = /*#__PURE__*/ _interop_require_wildcard(require("./createStyles.cjs"));
29
+ const _generateClassName = require("./generateClassName.cjs");
30
+ const _plugins = require("./plugins.cjs");
31
+ function _getRequireWildcardCache(nodeInterop) {
32
+ if (typeof WeakMap !== "function") return null;
33
+ var cacheBabelInterop = new WeakMap();
34
+ var cacheNodeInterop = new WeakMap();
35
+ return (_getRequireWildcardCache = function(nodeInterop) {
36
+ return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
37
+ })(nodeInterop);
38
+ }
39
+ function _interop_require_wildcard(obj, nodeInterop) {
40
+ if (!nodeInterop && obj && obj.__esModule) {
41
+ return obj;
42
+ }
43
+ if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
44
+ return {
45
+ default: obj
46
+ };
47
+ }
48
+ var cache = _getRequireWildcardCache(nodeInterop);
49
+ if (cache && cache.has(obj)) {
50
+ return cache.get(obj);
51
+ }
52
+ var newObj = {
53
+ __proto__: null
54
+ };
55
+ var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
56
+ for(var key in obj){
57
+ if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
58
+ var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
59
+ if (desc && (desc.get || desc.set)) {
60
+ Object.defineProperty(newObj, key, desc);
61
+ } else {
62
+ newObj[key] = obj[key];
63
+ }
64
+ }
65
+ }
66
+ newObj.default = obj;
67
+ if (cache) {
68
+ cache.set(obj, newObj);
69
+ }
70
+ return newObj;
71
+ }
@@ -0,0 +1,14 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", {
3
+ value: true
4
+ });
5
+ Object.defineProperty(exports, "default", {
6
+ enumerable: true,
7
+ get: function() {
8
+ return numToAlpha;
9
+ }
10
+ });
11
+ const alphas = 'abcdefghijklmnopqrstuvwxyz'.split('');
12
+ function numToAlpha(num) {
13
+ return String(alphas[num]);
14
+ }
@@ -0,0 +1 @@
1
+ export default function numToAlpha(num: number): string;
@@ -0,0 +1 @@
1
+ { "type": "commonjs" }
@@ -0,0 +1,25 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", {
3
+ value: true
4
+ });
5
+ function _export(target, all) {
6
+ for(var name in all)Object.defineProperty(target, name, {
7
+ enumerable: true,
8
+ get: Object.getOwnPropertyDescriptor(all, name).get
9
+ });
10
+ }
11
+ _export(exports, {
12
+ get getPosthooks () {
13
+ return getPosthooks;
14
+ },
15
+ get registerPosthook () {
16
+ return registerPosthook;
17
+ }
18
+ });
19
+ const posthooks = [];
20
+ function getPosthooks() {
21
+ return posthooks;
22
+ }
23
+ function registerPosthook(posthook) {
24
+ posthooks.push(posthook);
25
+ }
@@ -0,0 +1,3 @@
1
+ export type PosthookPlugin = (sheetContents: string) => string;
2
+ export declare function getPosthooks(): PosthookPlugin[];
3
+ export declare function registerPosthook(posthook: PosthookPlugin): void;
@@ -0,0 +1,18 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", {
3
+ value: true
4
+ });
5
+ _export_star(require("./useCreateStyles.cjs"), exports);
6
+ function _export_star(from, to) {
7
+ Object.keys(from).forEach(function(k) {
8
+ if (k !== "default" && !Object.prototype.hasOwnProperty.call(to, k)) {
9
+ Object.defineProperty(to, k, {
10
+ enumerable: true,
11
+ get: function() {
12
+ return from[k];
13
+ }
14
+ });
15
+ }
16
+ });
17
+ return from;
18
+ }
@@ -0,0 +1,73 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", {
3
+ value: true
4
+ });
5
+ Object.defineProperty(exports, "useCreateStyles", {
6
+ enumerable: true,
7
+ get: function() {
8
+ return useCreateStyles;
9
+ }
10
+ });
11
+ const _react = require("react");
12
+ const _createStyles = /*#__PURE__*/ _interop_require_default(require("../createStyles.cjs"));
13
+ const _index = require("../util/index.cjs");
14
+ function _interop_require_default(obj) {
15
+ return obj && obj.__esModule ? obj : {
16
+ default: obj
17
+ };
18
+ }
19
+ function useCreateStyles(rules, options) {
20
+ // cache rules to compare later
21
+ const [cachedRules, setCachedRules] = (0, _react.useState)(()=>rules);
22
+ // memoize options but keep them live
23
+ const cachedOptions = (0, _react.useMemo)(()=>({
24
+ ...options
25
+ }), [
26
+ options
27
+ ]);
28
+ const didFirstWriteRef = (0, _react.useRef)(false);
29
+ const styleTagRef = (0, _react.useRef)(typeof document === 'undefined' ? null : document.createElement('style'));
30
+ // initialize styles
31
+ const [styleState, setStyleState] = (0, _react.useState)(()=>(0, _createStyles.default)(rules, {
32
+ ...cachedOptions,
33
+ flush: false
34
+ }));
35
+ const { classes, stylesheet, updateSheet } = styleState;
36
+ // mount/unmount style tag
37
+ (0, _react.useEffect)(()=>{
38
+ if (!styleTagRef.current) return;
39
+ const { current: s } = styleTagRef;
40
+ document.head.append(s);
41
+ return ()=>{
42
+ s.remove();
43
+ };
44
+ }, []);
45
+ // update stylesheet when rules change
46
+ (0, _react.useEffect)(()=>{
47
+ if (!styleTagRef.current) return;
48
+ if (!didFirstWriteRef.current) {
49
+ didFirstWriteRef.current = true;
50
+ styleTagRef.current.innerHTML = stylesheet;
51
+ return;
52
+ }
53
+ if (!(0, _index.deepEqual)(rules, cachedRules)) {
54
+ setCachedRules(rules);
55
+ const updated = updateSheet(rules);
56
+ if (updated) {
57
+ styleTagRef.current.innerHTML = updated.stylesheet;
58
+ // use the fresh updateSheet from updated
59
+ // @ts-expect-error - this cast is safe and is only for us, internally, anyways
60
+ setStyleState({
61
+ ...updated,
62
+ updateSheet
63
+ });
64
+ }
65
+ }
66
+ }, [
67
+ cachedRules,
68
+ rules,
69
+ stylesheet,
70
+ updateSheet
71
+ ]); // only depend on rules + updater
72
+ return classes;
73
+ }
@@ -0,0 +1,3 @@
1
+ import { CreateStylesOptions } from '../createStyles.js';
2
+ import { SimpleStyleRules } from '../types.js';
3
+ export declare function useCreateStyles<T extends SimpleStyleRules, K extends keyof T, O extends Record<K, string>>(rules: T, options?: Partial<Omit<CreateStylesOptions, 'flush'>>): O;
@@ -0,0 +1,25 @@
1
+ /**
2
+ * Acts as an accumulator for all
3
+ * generated css that occurs via createStyles().
4
+ *
5
+ * React variant of this will come after the baseline one is created
6
+ */ "use strict";
7
+ Object.defineProperty(exports, "__esModule", {
8
+ value: true
9
+ });
10
+ Object.defineProperty(exports, "SimpleStyleRegistry", {
11
+ enumerable: true,
12
+ get: function() {
13
+ return SimpleStyleRegistry;
14
+ }
15
+ });
16
+ class SimpleStyleRegistry {
17
+ sheets = [];
18
+ add(contents) {
19
+ this.sheets.push(contents);
20
+ }
21
+ getCSS() {
22
+ return this.sheets.reduce((prev, contents)=>`${prev}
23
+ ${contents}`, '');
24
+ }
25
+ }
@@ -0,0 +1,11 @@
1
+ /**
2
+ * Acts as an accumulator for all
3
+ * generated css that occurs via createStyles().
4
+ *
5
+ * React variant of this will come after the baseline one is created
6
+ */
7
+ export declare class SimpleStyleRegistry {
8
+ private sheets;
9
+ add(contents: string): void;
10
+ getCSS(): string;
11
+ }
@@ -0,0 +1,4 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", {
3
+ value: true
4
+ });
@@ -1,7 +1,5 @@
1
1
  import { Properties } from 'csstype';
2
-
3
2
  export type SimpleStyleRules = {
4
- [key: string]: Properties | SimpleStyleRules;
3
+ [key: string]: Properties | SimpleStyleRules;
5
4
  };
6
-
7
5
  export type RenderableSimpleStyleRules = SimpleStyleRules & Record<string, Properties[]>;
@@ -0,0 +1,27 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", {
3
+ value: true
4
+ });
5
+ Object.defineProperty(exports, "deepEqual", {
6
+ enumerable: true,
7
+ get: function() {
8
+ return deepEqual;
9
+ }
10
+ });
11
+ function deepEqual(o1, o2) {
12
+ // We'll sort the keys, just in case the user kept things the same but the object is all wonky, order-wise
13
+ const o1Keys = Object.keys(o1).sort();
14
+ const o2Keys = Object.keys(o2).sort();
15
+ if (o1Keys.length !== o2Keys.length) return false;
16
+ if (o1Keys.some((key, i)=>o2Keys[i] !== key)) return false;
17
+ // Okay, the keys SHOULD be the same
18
+ // so we need to test their values, recursively, to verify equality
19
+ return o1Keys.reduce((prev, key)=>{
20
+ if (!prev) return prev; // we've already failed equality checks here
21
+ if (!(key in o2)) return false;
22
+ if (typeof o1[key] !== 'object') {
23
+ return o1[key] === o2[key];
24
+ }
25
+ return deepEqual(o1[key], o2[key]);
26
+ }, true);
27
+ }
@@ -0,0 +1 @@
1
+ export declare function deepEqual<O1 extends Record<string | number | symbol, any>, O2 extends Record<string | number | symbol, any>>(o1: O1, o2: O2): boolean;
@@ -0,0 +1,18 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", {
3
+ value: true
4
+ });
5
+ _export_star(require("./deepEqual.cjs"), exports);
6
+ function _export_star(from, to) {
7
+ Object.keys(from).forEach(function(k) {
8
+ if (k !== "default" && !Object.prototype.hasOwnProperty.call(to, k)) {
9
+ Object.defineProperty(to, k, {
10
+ enumerable: true,
11
+ get: function() {
12
+ return from[k];
13
+ }
14
+ });
15
+ }
16
+ });
17
+ return from;
18
+ }