simplestyle-js 5.2.2 → 5.3.1-beta.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/SimpleStyleProvider.cjs +29 -0
- package/dist/cjs/SimpleStyleProvider.d.ts +3 -0
- package/dist/cjs/astro/index.cjs +25 -0
- package/dist/cjs/astro/index.d.ts +2 -0
- package/dist/cjs/createStyles.cjs +1 -1
- package/dist/cjs/index.cjs +1 -0
- package/dist/cjs/index.d.ts +1 -0
- package/dist/cjs/makeStyles.cjs +12 -4
- package/dist/cjs/makeStyles.d.ts +9 -13
- package/dist/cjs/next/index.cjs +20 -13
- package/dist/cjs/next/index.d.ts +2 -1
- package/dist/esm/SimpleStyleProvider.d.ts +3 -0
- package/dist/esm/SimpleStyleProvider.mjs +19 -0
- package/dist/esm/astro/index.d.ts +2 -0
- package/dist/esm/astro/index.mjs +15 -0
- package/dist/esm/createStyles.mjs +1 -1
- package/dist/esm/index.d.ts +1 -0
- package/dist/esm/index.mjs +1 -0
- package/dist/esm/makeStyles.d.ts +9 -13
- package/dist/esm/makeStyles.mjs +12 -4
- package/dist/esm/next/index.d.ts +2 -1
- package/dist/esm/next/index.mjs +15 -1
- package/package.json +22 -12
- package/dist/cjs/astro/SimpleStyleProvider.astro +0 -16
- package/dist/cjs/next/SimpleStyleProvider.cjs +0 -22
- package/dist/cjs/next/SimpleStyleProvider.d.ts +0 -12
- package/dist/esm/astro/SimpleStyleProvider.astro +0 -16
- package/dist/esm/next/SimpleStyleProvider.d.ts +0 -12
- package/dist/esm/next/SimpleStyleProvider.mjs +0 -17
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", {
|
|
3
|
+
value: true
|
|
4
|
+
});
|
|
5
|
+
Object.defineProperty(exports, "makeSimpleStyleProvider", {
|
|
6
|
+
enumerable: true,
|
|
7
|
+
get: function() {
|
|
8
|
+
return makeSimpleStyleProvider;
|
|
9
|
+
}
|
|
10
|
+
});
|
|
11
|
+
const _jsxruntime = require("react/jsx-runtime");
|
|
12
|
+
function makeSimpleStyleProvider(registry) {
|
|
13
|
+
/**
|
|
14
|
+
* Accumulates all CSS rules and writes
|
|
15
|
+
* them to your layout.
|
|
16
|
+
* Use this for Next.js or other Next.js-like frameworks
|
|
17
|
+
* that leverage React server components
|
|
18
|
+
*/ return function SimpleStyleProvider({ children }) {
|
|
19
|
+
return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
|
|
20
|
+
children: [
|
|
21
|
+
registry.getRulesById().map(([ruleId, css])=>/*#__PURE__*/ (0, _jsxruntime.jsx)("style", {
|
|
22
|
+
id: ruleId,
|
|
23
|
+
children: css
|
|
24
|
+
}, ruleId)),
|
|
25
|
+
children
|
|
26
|
+
]
|
|
27
|
+
});
|
|
28
|
+
};
|
|
29
|
+
}
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
import type { PropsWithChildren } from 'react';
|
|
2
|
+
import type { SimpleStyleRegistry } from './simpleStyleRegistry.js';
|
|
3
|
+
export declare function makeSimpleStyleProvider(registry: SimpleStyleRegistry): ({ children }: PropsWithChildren) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", {
|
|
3
|
+
value: true
|
|
4
|
+
});
|
|
5
|
+
Object.defineProperty(exports, "makeCssFuncs", {
|
|
6
|
+
enumerable: true,
|
|
7
|
+
get: function() {
|
|
8
|
+
return makeCssFuncs;
|
|
9
|
+
}
|
|
10
|
+
});
|
|
11
|
+
const _makeStyles = require("..\makeStyles.cjs");
|
|
12
|
+
const _SimpleStyleProvider = require("..\SimpleStyleProvider.cjs");
|
|
13
|
+
const _simpleStyleRegistry = require("..\simpleStyleRegistry.cjs");
|
|
14
|
+
const makeCssFuncs = (opts)=>{
|
|
15
|
+
const { registry: providedRegistry } = opts;
|
|
16
|
+
const registry = providedRegistry ?? new _simpleStyleRegistry.SimpleStyleRegistry();
|
|
17
|
+
const funcs = (0, _makeStyles.makeCssFuncs)({
|
|
18
|
+
...opts,
|
|
19
|
+
registry
|
|
20
|
+
});
|
|
21
|
+
return {
|
|
22
|
+
...funcs,
|
|
23
|
+
SimpleStyleProvider: (0, _SimpleStyleProvider.makeSimpleStyleProvider)(registry)
|
|
24
|
+
};
|
|
25
|
+
};
|
|
@@ -43,7 +43,7 @@ function formatCSSRuleName(rule) {
|
|
|
43
43
|
return rule.replaceAll(/([A-Z])/g, (p1)=>`-${p1.toLowerCase()}`);
|
|
44
44
|
}
|
|
45
45
|
function formatCSSRules(cssRules) {
|
|
46
|
-
return Object.entries(cssRules).reduce((prev, [cssProp, cssVal])=>`${prev}${formatCSSRuleName(cssProp)}:${String(cssVal)};`, '');
|
|
46
|
+
return Object.entries(cssRules).reduce((prev, [cssProp, cssVal])=>`${prev}${formatCSSRuleName(cssProp)}:${String(cssVal)}${typeof cssVal === 'number' ? 'px' : ''};`, '');
|
|
47
47
|
}
|
|
48
48
|
function execCreateStyles(ruleId, rules, options, parentSelector, noGenerateClassName = false) {
|
|
49
49
|
const out = {};
|
package/dist/cjs/index.cjs
CHANGED
|
@@ -29,6 +29,7 @@ const _createStyles = /*#__PURE__*/ _interop_require_wildcard(require("./createS
|
|
|
29
29
|
const _generateClassName = require("./generateClassName.cjs");
|
|
30
30
|
_export_star(require("./makeStyles.cjs"), exports);
|
|
31
31
|
const _plugins = require("./plugins.cjs");
|
|
32
|
+
_export_star(require("./simpleStyleRegistry.cjs"), exports);
|
|
32
33
|
_export_star(require("./types.cjs"), exports);
|
|
33
34
|
function _export_star(from, to) {
|
|
34
35
|
Object.keys(from).forEach(function(k) {
|
package/dist/cjs/index.d.ts
CHANGED
package/dist/cjs/makeStyles.cjs
CHANGED
|
@@ -11,25 +11,33 @@ Object.defineProperty(exports, "makeCssFuncs", {
|
|
|
11
11
|
const _createStyles = require("./createStyles.cjs");
|
|
12
12
|
function makeCssFuncs(opts) {
|
|
13
13
|
function wrappedCreateStyles(ruleId, rulesFnc, overrides) {
|
|
14
|
-
return (0, _createStyles.createStyles)(ruleId,
|
|
14
|
+
return (0, _createStyles.createStyles)(ruleId, // @ts-expect-error - we've gotten the consumption types this far
|
|
15
|
+
// so TSC can pound sand, because we know this operation is safe
|
|
16
|
+
()=>rulesFnc('variables' in opts ? opts.variables : undefined), {
|
|
15
17
|
...overrides,
|
|
16
18
|
registry: 'registry' in opts ? opts.registry : overrides?.registry
|
|
17
19
|
});
|
|
18
20
|
}
|
|
19
21
|
function wrappedCreateKeyframes(ruleId, rulesFnc, overrides) {
|
|
20
|
-
return (0, _createStyles.keyframes)(ruleId,
|
|
22
|
+
return (0, _createStyles.keyframes)(ruleId, // @ts-expect-error - we've gotten the consumption types this far
|
|
23
|
+
// so TSC can pound sand, because we know this operation is safe
|
|
24
|
+
()=>rulesFnc('variables' in opts ? opts.variables : undefined), {
|
|
21
25
|
...overrides,
|
|
22
26
|
registry: 'registry' in opts ? opts.registry : overrides?.registry
|
|
23
27
|
});
|
|
24
28
|
}
|
|
25
29
|
function wrappedRawStyles(ruleId, rulesFnc, overrides) {
|
|
26
|
-
return (0, _createStyles.rawStyles)(ruleId,
|
|
30
|
+
return (0, _createStyles.rawStyles)(ruleId, // @ts-expect-error - we've gotten the consumption types this far
|
|
31
|
+
// so TSC can pound sand, because we know this operation is safe
|
|
32
|
+
()=>rulesFnc('variables' in opts ? opts.variables : undefined), {
|
|
27
33
|
...overrides,
|
|
28
34
|
registry: 'registry' in opts ? opts.registry : overrides?.registry
|
|
29
35
|
});
|
|
30
36
|
}
|
|
31
37
|
function wrappedImports(ruleId, rulesFnc, overrides) {
|
|
32
|
-
return (0, _createStyles.imports)(ruleId,
|
|
38
|
+
return (0, _createStyles.imports)(ruleId, // @ts-expect-error - we've gotten the consumption types this far
|
|
39
|
+
// so TSC can pound sand, because we know this operation is safe
|
|
40
|
+
()=>rulesFnc('variables' in opts ? opts.variables : undefined), {
|
|
33
41
|
...overrides,
|
|
34
42
|
registry: 'registry' in opts ? opts.registry : overrides?.registry
|
|
35
43
|
});
|
package/dist/cjs/makeStyles.d.ts
CHANGED
|
@@ -1,14 +1,10 @@
|
|
|
1
1
|
import type { Properties } from 'csstype';
|
|
2
2
|
import { type CreateStylesOptions } from './createStyles.js';
|
|
3
3
|
import type { SimpleStyleRegistry } from './simpleStyleRegistry.js';
|
|
4
|
-
import type {
|
|
5
|
-
type MakeCssFuncsOpts<T extends object
|
|
6
|
-
registry
|
|
7
|
-
|
|
8
|
-
variables: T;
|
|
9
|
-
} | {
|
|
10
|
-
registry: SimpleStyleRegistry;
|
|
11
|
-
variables: T;
|
|
4
|
+
import type { SimpleStyleRules } from './types.js';
|
|
5
|
+
type MakeCssFuncsOpts<T extends object | undefined | null> = {
|
|
6
|
+
registry?: SimpleStyleRegistry;
|
|
7
|
+
variables?: T;
|
|
12
8
|
};
|
|
13
9
|
/**
|
|
14
10
|
* Creates all of your CSS functions, createStyles, keframes and rawStyles,
|
|
@@ -17,8 +13,8 @@ type MakeCssFuncsOpts<T extends object> = {} | {
|
|
|
17
13
|
* they accept a function as the 2nd parameter, instead of the usual object.
|
|
18
14
|
* The function will be provided with your variables
|
|
19
15
|
*/
|
|
20
|
-
export declare function makeCssFuncs<V extends object>(opts: MakeCssFuncsOpts<V>): {
|
|
21
|
-
createStyles: <T extends SimpleStyleRules, K extends keyof T, O extends Record<K, string>>(ruleId: string, rulesFnc: (vars
|
|
16
|
+
export declare function makeCssFuncs<V extends object | undefined | null | never = never>(opts: MakeCssFuncsOpts<V>): {
|
|
17
|
+
createStyles: <T extends SimpleStyleRules, K extends keyof T, O extends Record<K, string>>(ruleId: string, rulesFnc: (vars: V extends undefined | null | never ? never : V) => T, overrides?: CreateStylesOptions) => {
|
|
22
18
|
classes: O;
|
|
23
19
|
stylesheet: string;
|
|
24
20
|
updateSheet: <T2 extends SimpleStyleRules>(updatedRulesFnc: () => Partial<T2>) => {
|
|
@@ -26,11 +22,11 @@ export declare function makeCssFuncs<V extends object>(opts: MakeCssFuncsOpts<V>
|
|
|
26
22
|
stylesheet: string;
|
|
27
23
|
} | null;
|
|
28
24
|
};
|
|
29
|
-
imports: (ruleId: string, rulesFnc: (vars
|
|
30
|
-
keyframes: <T extends Record<string, Properties>>(ruleId: string, rulesFnc: (vars
|
|
25
|
+
imports: (ruleId: string, rulesFnc: (vars: V extends undefined | null | never ? never : V) => `@import ${string}`[], overrides?: CreateStylesOptions) => void;
|
|
26
|
+
keyframes: <T extends Record<string, Properties>>(ruleId: string, rulesFnc: (vars: V extends undefined | null | never ? never : V) => T, overrides?: CreateStylesOptions) => {
|
|
31
27
|
keyframe: string;
|
|
32
28
|
stylesheet: string;
|
|
33
29
|
};
|
|
34
|
-
rawStyles: <T extends SimpleStyleRules>(ruleId: string, rulesFnc: (vars
|
|
30
|
+
rawStyles: <T extends SimpleStyleRules>(ruleId: string, rulesFnc: (vars: V extends undefined | null | never ? never : V) => T, overrides?: CreateStylesOptions) => string;
|
|
35
31
|
};
|
|
36
32
|
export {};
|
package/dist/cjs/next/index.cjs
CHANGED
|
@@ -2,17 +2,24 @@
|
|
|
2
2
|
Object.defineProperty(exports, "__esModule", {
|
|
3
3
|
value: true
|
|
4
4
|
});
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
5
|
+
Object.defineProperty(exports, "makeCssFuncs", {
|
|
6
|
+
enumerable: true,
|
|
7
|
+
get: function() {
|
|
8
|
+
return makeCssFuncs;
|
|
9
|
+
}
|
|
10
|
+
});
|
|
11
|
+
const _makeStyles = require("..\makeStyles.cjs");
|
|
12
|
+
const _SimpleStyleProvider = require("..\SimpleStyleProvider.cjs");
|
|
13
|
+
const _simpleStyleRegistry = require("..\simpleStyleRegistry.cjs");
|
|
14
|
+
const makeCssFuncs = (opts)=>{
|
|
15
|
+
const { registry: providedRegistry } = opts;
|
|
16
|
+
const registry = providedRegistry ?? new _simpleStyleRegistry.SimpleStyleRegistry();
|
|
17
|
+
const funcs = (0, _makeStyles.makeCssFuncs)({
|
|
18
|
+
...opts,
|
|
19
|
+
registry
|
|
16
20
|
});
|
|
17
|
-
return
|
|
18
|
-
|
|
21
|
+
return {
|
|
22
|
+
...funcs,
|
|
23
|
+
SimpleStyleProvider: (0, _SimpleStyleProvider.makeSimpleStyleProvider)(registry)
|
|
24
|
+
};
|
|
25
|
+
};
|
package/dist/cjs/next/index.d.ts
CHANGED
|
@@ -1 +1,2 @@
|
|
|
1
|
-
|
|
1
|
+
import { makeCssFuncs as _makeCssFuncs } from '../makeStyles.js';
|
|
2
|
+
export declare const makeCssFuncs: typeof _makeCssFuncs;
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
import type { PropsWithChildren } from 'react';
|
|
2
|
+
import type { SimpleStyleRegistry } from './simpleStyleRegistry.js';
|
|
3
|
+
export declare function makeSimpleStyleProvider(registry: SimpleStyleRegistry): ({ children }: PropsWithChildren) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
|
+
export function makeSimpleStyleProvider(registry) {
|
|
3
|
+
/**
|
|
4
|
+
* Accumulates all CSS rules and writes
|
|
5
|
+
* them to your layout.
|
|
6
|
+
* Use this for Next.js or other Next.js-like frameworks
|
|
7
|
+
* that leverage React server components
|
|
8
|
+
*/ return function SimpleStyleProvider({ children }) {
|
|
9
|
+
return /*#__PURE__*/ _jsxs(_Fragment, {
|
|
10
|
+
children: [
|
|
11
|
+
registry.getRulesById().map(([ruleId, css])=>/*#__PURE__*/ _jsx("style", {
|
|
12
|
+
id: ruleId,
|
|
13
|
+
children: css
|
|
14
|
+
}, ruleId)),
|
|
15
|
+
children
|
|
16
|
+
]
|
|
17
|
+
});
|
|
18
|
+
};
|
|
19
|
+
}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { makeCssFuncs as _makeCssFuncs } from '..\makeStyles.mjs';
|
|
2
|
+
import { makeSimpleStyleProvider } from '..\SimpleStyleProvider.mjs';
|
|
3
|
+
import { SimpleStyleRegistry } from '..\simpleStyleRegistry.mjs';
|
|
4
|
+
export const makeCssFuncs = (opts)=>{
|
|
5
|
+
const { registry: providedRegistry } = opts;
|
|
6
|
+
const registry = providedRegistry ?? new SimpleStyleRegistry();
|
|
7
|
+
const funcs = _makeCssFuncs({
|
|
8
|
+
...opts,
|
|
9
|
+
registry
|
|
10
|
+
});
|
|
11
|
+
return {
|
|
12
|
+
...funcs,
|
|
13
|
+
SimpleStyleProvider: makeSimpleStyleProvider(registry)
|
|
14
|
+
};
|
|
15
|
+
};
|
|
@@ -11,7 +11,7 @@ function formatCSSRuleName(rule) {
|
|
|
11
11
|
return rule.replaceAll(/([A-Z])/g, (p1)=>`-${p1.toLowerCase()}`);
|
|
12
12
|
}
|
|
13
13
|
function formatCSSRules(cssRules) {
|
|
14
|
-
return Object.entries(cssRules).reduce((prev, [cssProp, cssVal])=>`${prev}${formatCSSRuleName(cssProp)}:${String(cssVal)};`, '');
|
|
14
|
+
return Object.entries(cssRules).reduce((prev, [cssProp, cssVal])=>`${prev}${formatCSSRuleName(cssProp)}:${String(cssVal)}${typeof cssVal === 'number' ? 'px' : ''};`, '');
|
|
15
15
|
}
|
|
16
16
|
function execCreateStyles(ruleId, rules, options, parentSelector, noGenerateClassName = false) {
|
|
17
17
|
const out = {};
|
package/dist/esm/index.d.ts
CHANGED
package/dist/esm/index.mjs
CHANGED
|
@@ -2,4 +2,5 @@ export { default as createStyles, keyframes, rawStyles } from './createStyles.mj
|
|
|
2
2
|
export { setSeed } from './generateClassName.mjs';
|
|
3
3
|
export * from './makeStyles.mjs';
|
|
4
4
|
export { registerPosthook } from './plugins.mjs';
|
|
5
|
+
export * from './simpleStyleRegistry.mjs';
|
|
5
6
|
export * from './types.mjs';
|
package/dist/esm/makeStyles.d.ts
CHANGED
|
@@ -1,14 +1,10 @@
|
|
|
1
1
|
import type { Properties } from 'csstype';
|
|
2
2
|
import { type CreateStylesOptions } from './createStyles.js';
|
|
3
3
|
import type { SimpleStyleRegistry } from './simpleStyleRegistry.js';
|
|
4
|
-
import type {
|
|
5
|
-
type MakeCssFuncsOpts<T extends object
|
|
6
|
-
registry
|
|
7
|
-
|
|
8
|
-
variables: T;
|
|
9
|
-
} | {
|
|
10
|
-
registry: SimpleStyleRegistry;
|
|
11
|
-
variables: T;
|
|
4
|
+
import type { SimpleStyleRules } from './types.js';
|
|
5
|
+
type MakeCssFuncsOpts<T extends object | undefined | null> = {
|
|
6
|
+
registry?: SimpleStyleRegistry;
|
|
7
|
+
variables?: T;
|
|
12
8
|
};
|
|
13
9
|
/**
|
|
14
10
|
* Creates all of your CSS functions, createStyles, keframes and rawStyles,
|
|
@@ -17,8 +13,8 @@ type MakeCssFuncsOpts<T extends object> = {} | {
|
|
|
17
13
|
* they accept a function as the 2nd parameter, instead of the usual object.
|
|
18
14
|
* The function will be provided with your variables
|
|
19
15
|
*/
|
|
20
|
-
export declare function makeCssFuncs<V extends object>(opts: MakeCssFuncsOpts<V>): {
|
|
21
|
-
createStyles: <T extends SimpleStyleRules, K extends keyof T, O extends Record<K, string>>(ruleId: string, rulesFnc: (vars
|
|
16
|
+
export declare function makeCssFuncs<V extends object | undefined | null | never = never>(opts: MakeCssFuncsOpts<V>): {
|
|
17
|
+
createStyles: <T extends SimpleStyleRules, K extends keyof T, O extends Record<K, string>>(ruleId: string, rulesFnc: (vars: V extends undefined | null | never ? never : V) => T, overrides?: CreateStylesOptions) => {
|
|
22
18
|
classes: O;
|
|
23
19
|
stylesheet: string;
|
|
24
20
|
updateSheet: <T2 extends SimpleStyleRules>(updatedRulesFnc: () => Partial<T2>) => {
|
|
@@ -26,11 +22,11 @@ export declare function makeCssFuncs<V extends object>(opts: MakeCssFuncsOpts<V>
|
|
|
26
22
|
stylesheet: string;
|
|
27
23
|
} | null;
|
|
28
24
|
};
|
|
29
|
-
imports: (ruleId: string, rulesFnc: (vars
|
|
30
|
-
keyframes: <T extends Record<string, Properties>>(ruleId: string, rulesFnc: (vars
|
|
25
|
+
imports: (ruleId: string, rulesFnc: (vars: V extends undefined | null | never ? never : V) => `@import ${string}`[], overrides?: CreateStylesOptions) => void;
|
|
26
|
+
keyframes: <T extends Record<string, Properties>>(ruleId: string, rulesFnc: (vars: V extends undefined | null | never ? never : V) => T, overrides?: CreateStylesOptions) => {
|
|
31
27
|
keyframe: string;
|
|
32
28
|
stylesheet: string;
|
|
33
29
|
};
|
|
34
|
-
rawStyles: <T extends SimpleStyleRules>(ruleId: string, rulesFnc: (vars
|
|
30
|
+
rawStyles: <T extends SimpleStyleRules>(ruleId: string, rulesFnc: (vars: V extends undefined | null | never ? never : V) => T, overrides?: CreateStylesOptions) => string;
|
|
35
31
|
};
|
|
36
32
|
export {};
|
package/dist/esm/makeStyles.mjs
CHANGED
|
@@ -7,25 +7,33 @@ import { createStyles, imports, keyframes, rawStyles } from './createStyles.mjs'
|
|
|
7
7
|
* The function will be provided with your variables
|
|
8
8
|
*/ export function makeCssFuncs(opts) {
|
|
9
9
|
function wrappedCreateStyles(ruleId, rulesFnc, overrides) {
|
|
10
|
-
return createStyles(ruleId,
|
|
10
|
+
return createStyles(ruleId, // @ts-expect-error - we've gotten the consumption types this far
|
|
11
|
+
// so TSC can pound sand, because we know this operation is safe
|
|
12
|
+
()=>rulesFnc('variables' in opts ? opts.variables : undefined), {
|
|
11
13
|
...overrides,
|
|
12
14
|
registry: 'registry' in opts ? opts.registry : overrides?.registry
|
|
13
15
|
});
|
|
14
16
|
}
|
|
15
17
|
function wrappedCreateKeyframes(ruleId, rulesFnc, overrides) {
|
|
16
|
-
return keyframes(ruleId,
|
|
18
|
+
return keyframes(ruleId, // @ts-expect-error - we've gotten the consumption types this far
|
|
19
|
+
// so TSC can pound sand, because we know this operation is safe
|
|
20
|
+
()=>rulesFnc('variables' in opts ? opts.variables : undefined), {
|
|
17
21
|
...overrides,
|
|
18
22
|
registry: 'registry' in opts ? opts.registry : overrides?.registry
|
|
19
23
|
});
|
|
20
24
|
}
|
|
21
25
|
function wrappedRawStyles(ruleId, rulesFnc, overrides) {
|
|
22
|
-
return rawStyles(ruleId,
|
|
26
|
+
return rawStyles(ruleId, // @ts-expect-error - we've gotten the consumption types this far
|
|
27
|
+
// so TSC can pound sand, because we know this operation is safe
|
|
28
|
+
()=>rulesFnc('variables' in opts ? opts.variables : undefined), {
|
|
23
29
|
...overrides,
|
|
24
30
|
registry: 'registry' in opts ? opts.registry : overrides?.registry
|
|
25
31
|
});
|
|
26
32
|
}
|
|
27
33
|
function wrappedImports(ruleId, rulesFnc, overrides) {
|
|
28
|
-
return imports(ruleId,
|
|
34
|
+
return imports(ruleId, // @ts-expect-error - we've gotten the consumption types this far
|
|
35
|
+
// so TSC can pound sand, because we know this operation is safe
|
|
36
|
+
()=>rulesFnc('variables' in opts ? opts.variables : undefined), {
|
|
29
37
|
...overrides,
|
|
30
38
|
registry: 'registry' in opts ? opts.registry : overrides?.registry
|
|
31
39
|
});
|
package/dist/esm/next/index.d.ts
CHANGED
|
@@ -1 +1,2 @@
|
|
|
1
|
-
|
|
1
|
+
import { makeCssFuncs as _makeCssFuncs } from '../makeStyles.js';
|
|
2
|
+
export declare const makeCssFuncs: typeof _makeCssFuncs;
|
package/dist/esm/next/index.mjs
CHANGED
|
@@ -1 +1,15 @@
|
|
|
1
|
-
|
|
1
|
+
import { makeCssFuncs as _makeCssFuncs } from '..\makeStyles.mjs';
|
|
2
|
+
import { makeSimpleStyleProvider } from '..\SimpleStyleProvider.mjs';
|
|
3
|
+
import { SimpleStyleRegistry } from '..\simpleStyleRegistry.mjs';
|
|
4
|
+
export const makeCssFuncs = (opts)=>{
|
|
5
|
+
const { registry: providedRegistry } = opts;
|
|
6
|
+
const registry = providedRegistry ?? new SimpleStyleRegistry();
|
|
7
|
+
const funcs = _makeCssFuncs({
|
|
8
|
+
...opts,
|
|
9
|
+
registry
|
|
10
|
+
});
|
|
11
|
+
return {
|
|
12
|
+
...funcs,
|
|
13
|
+
SimpleStyleProvider: makeSimpleStyleProvider(registry)
|
|
14
|
+
};
|
|
15
|
+
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "simplestyle-js",
|
|
3
|
-
"version": "5.
|
|
3
|
+
"version": "5.3.1-beta.0",
|
|
4
4
|
"description": "An incredibly straightforward and simple CSS-in-JS solution with zero runtime dependencies, and out-of-the-box TypeScript support",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"repository": {
|
|
@@ -70,6 +70,26 @@
|
|
|
70
70
|
"react": ">=16.8"
|
|
71
71
|
},
|
|
72
72
|
"exports": {
|
|
73
|
+
"./SimpleStyleProvider": {
|
|
74
|
+
"require": {
|
|
75
|
+
"types": "./dist/cjs/SimpleStyleProvider.d.ts",
|
|
76
|
+
"default": "./dist/cjs/SimpleStyleProvider.cjs"
|
|
77
|
+
},
|
|
78
|
+
"import": {
|
|
79
|
+
"types": "./dist/esm/SimpleStyleProvider.d.ts",
|
|
80
|
+
"default": "./dist/esm/SimpleStyleProvider.mjs"
|
|
81
|
+
}
|
|
82
|
+
},
|
|
83
|
+
"./astro": {
|
|
84
|
+
"require": {
|
|
85
|
+
"types": "./dist/cjs/astro/index.d.ts",
|
|
86
|
+
"default": "./dist/cjs/astro/index.cjs"
|
|
87
|
+
},
|
|
88
|
+
"import": {
|
|
89
|
+
"types": "./dist/esm/astro/index.d.ts",
|
|
90
|
+
"default": "./dist/esm/astro/index.mjs"
|
|
91
|
+
}
|
|
92
|
+
},
|
|
73
93
|
"./createStyles": {
|
|
74
94
|
"require": {
|
|
75
95
|
"types": "./dist/cjs/createStyles.d.ts",
|
|
@@ -110,16 +130,6 @@
|
|
|
110
130
|
"default": "./dist/esm/makeStyles.mjs"
|
|
111
131
|
}
|
|
112
132
|
},
|
|
113
|
-
"./next/SimpleStyleProvider": {
|
|
114
|
-
"require": {
|
|
115
|
-
"types": "./dist/cjs/next/SimpleStyleProvider.d.ts",
|
|
116
|
-
"default": "./dist/cjs/next/SimpleStyleProvider.cjs"
|
|
117
|
-
},
|
|
118
|
-
"import": {
|
|
119
|
-
"types": "./dist/esm/next/SimpleStyleProvider.d.ts",
|
|
120
|
-
"default": "./dist/esm/next/SimpleStyleProvider.mjs"
|
|
121
|
-
}
|
|
122
|
-
},
|
|
123
133
|
"./next": {
|
|
124
134
|
"require": {
|
|
125
135
|
"types": "./dist/cjs/next/index.d.ts",
|
|
@@ -199,4 +209,4 @@
|
|
|
199
209
|
"trustedDependencies": [
|
|
200
210
|
"@swc/core"
|
|
201
211
|
]
|
|
202
|
-
}
|
|
212
|
+
}
|
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
---
|
|
2
|
-
import type { SimpleStyleRegistry } from '../simpleStyleRegistry';
|
|
3
|
-
|
|
4
|
-
interface Props {
|
|
5
|
-
registry: SimpleStyleRegistry;
|
|
6
|
-
}
|
|
7
|
-
|
|
8
|
-
const { registry } = Astro.props;
|
|
9
|
-
|
|
10
|
-
const cssRulesById = registry.getRulesById();
|
|
11
|
-
---
|
|
12
|
-
{cssRulesById.map(([ruleId, css]) => (
|
|
13
|
-
<style id={ruleId} set:html={css}></style>
|
|
14
|
-
))}
|
|
15
|
-
|
|
16
|
-
<slot />
|
|
@@ -1,22 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", {
|
|
3
|
-
value: true
|
|
4
|
-
});
|
|
5
|
-
Object.defineProperty(exports, "SimpleStyleProvider", {
|
|
6
|
-
enumerable: true,
|
|
7
|
-
get: function() {
|
|
8
|
-
return SimpleStyleProvider;
|
|
9
|
-
}
|
|
10
|
-
});
|
|
11
|
-
const _jsxruntime = require("react/jsx-runtime");
|
|
12
|
-
function SimpleStyleProvider({ children, registry }) {
|
|
13
|
-
return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
|
|
14
|
-
children: [
|
|
15
|
-
registry.getRulesById().map(([ruleId, css])=>/*#__PURE__*/ (0, _jsxruntime.jsx)("style", {
|
|
16
|
-
id: ruleId,
|
|
17
|
-
children: css
|
|
18
|
-
}, ruleId)),
|
|
19
|
-
children
|
|
20
|
-
]
|
|
21
|
-
});
|
|
22
|
-
}
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
import type { PropsWithChildren } from 'react';
|
|
2
|
-
import type { SimpleStyleRegistry } from '../simpleStyleRegistry.js';
|
|
3
|
-
export type SimpleStyleProviderProps = PropsWithChildren & {
|
|
4
|
-
registry: SimpleStyleRegistry;
|
|
5
|
-
};
|
|
6
|
-
/**
|
|
7
|
-
* Accumulates all CSS rules and writes
|
|
8
|
-
* them to your layout.
|
|
9
|
-
* Use this for Next.js or other Next.js-like frameworks
|
|
10
|
-
* that leverage React server components
|
|
11
|
-
*/
|
|
12
|
-
export declare function SimpleStyleProvider({ children, registry, }: SimpleStyleProviderProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
---
|
|
2
|
-
import type { SimpleStyleRegistry } from '../simpleStyleRegistry';
|
|
3
|
-
|
|
4
|
-
interface Props {
|
|
5
|
-
registry: SimpleStyleRegistry;
|
|
6
|
-
}
|
|
7
|
-
|
|
8
|
-
const { registry } = Astro.props;
|
|
9
|
-
|
|
10
|
-
const cssRulesById = registry.getRulesById();
|
|
11
|
-
---
|
|
12
|
-
{cssRulesById.map(([ruleId, css]) => (
|
|
13
|
-
<style id={ruleId} set:html={css}></style>
|
|
14
|
-
))}
|
|
15
|
-
|
|
16
|
-
<slot />
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
import type { PropsWithChildren } from 'react';
|
|
2
|
-
import type { SimpleStyleRegistry } from '../simpleStyleRegistry.js';
|
|
3
|
-
export type SimpleStyleProviderProps = PropsWithChildren & {
|
|
4
|
-
registry: SimpleStyleRegistry;
|
|
5
|
-
};
|
|
6
|
-
/**
|
|
7
|
-
* Accumulates all CSS rules and writes
|
|
8
|
-
* them to your layout.
|
|
9
|
-
* Use this for Next.js or other Next.js-like frameworks
|
|
10
|
-
* that leverage React server components
|
|
11
|
-
*/
|
|
12
|
-
export declare function SimpleStyleProvider({ children, registry, }: SimpleStyleProviderProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
|
-
/**
|
|
3
|
-
* Accumulates all CSS rules and writes
|
|
4
|
-
* them to your layout.
|
|
5
|
-
* Use this for Next.js or other Next.js-like frameworks
|
|
6
|
-
* that leverage React server components
|
|
7
|
-
*/ export function SimpleStyleProvider({ children, registry }) {
|
|
8
|
-
return /*#__PURE__*/ _jsxs(_Fragment, {
|
|
9
|
-
children: [
|
|
10
|
-
registry.getRulesById().map(([ruleId, css])=>/*#__PURE__*/ _jsx("style", {
|
|
11
|
-
id: ruleId,
|
|
12
|
-
children: css
|
|
13
|
-
}, ruleId)),
|
|
14
|
-
children
|
|
15
|
-
]
|
|
16
|
-
});
|
|
17
|
-
}
|