zss-engine 0.2.19 → 0.2.20
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/index.js +20 -0
- package/dist/{utils → cjs/utils}/build.js +2 -2
- package/dist/{utils → cjs/utils}/inject-client-css.js +2 -2
- package/dist/{utils → cjs/utils}/inject-client-global-css.js +2 -2
- package/dist/{utils → cjs/utils}/transpiler.js +12 -12
- package/dist/esm/index.js +7 -0
- package/dist/{utils/build.mjs → esm/utils/build.js} +2 -1
- package/dist/{utils/inject-client-css.mjs → esm/utils/inject-client-css.js} +1 -1
- package/dist/{utils/inject-client-global-css.mjs → esm/utils/inject-client-global-css.js} +1 -1
- package/dist/{utils/transpiler.mjs → esm/utils/transpiler.js} +1 -1
- package/{types → dist/types}/index.d.ts +7 -7
- package/{types → dist/types}/utils/hash.d.ts +1 -1
- package/{types → dist/types}/utils/transpiler.d.ts +1 -1
- package/package.json +10 -12
- package/dist/index.js +0 -20
- package/dist/index.mjs +0 -7
- /package/dist/{types → cjs/types}/common/css-properties.js +0 -0
- /package/dist/{types → cjs/types}/common/css-property.js +0 -0
- /package/dist/{types → cjs/types}/main/create.js +0 -0
- /package/dist/{types → cjs/types}/main/global.js +0 -0
- /package/dist/{types → cjs/types}/main/vars.js +0 -0
- /package/dist/{utils → cjs/utils}/hash.js +0 -0
- /package/dist/{utils → cjs/utils}/helper.js +0 -0
- /package/dist/{utils → cjs/utils}/inject-server-css.js +0 -0
- /package/dist/{types/common/css-properties.mjs → esm/types/common/css-properties.js} +0 -0
- /package/dist/{types/common/css-property.mjs → esm/types/common/css-property.js} +0 -0
- /package/dist/{types/main/create.mjs → esm/types/main/create.js} +0 -0
- /package/dist/{types/main/global.mjs → esm/types/main/global.js} +0 -0
- /package/dist/{types/main/vars.mjs → esm/types/main/vars.js} +0 -0
- /package/dist/{utils/hash.mjs → esm/utils/hash.js} +0 -0
- /package/dist/{utils/helper.mjs → esm/utils/helper.js} +0 -0
- /package/dist/{utils/inject-server-css.mjs → esm/utils/inject-server-css.js} +0 -0
- /package/{types → dist/types}/types/common/css-properties.d.ts +0 -0
- /package/{types → dist/types}/types/common/css-property.d.ts +0 -0
- /package/{types → dist/types}/types/main/create.d.ts +0 -0
- /package/{types → dist/types}/types/main/global.d.ts +0 -0
- /package/{types → dist/types}/types/main/vars.d.ts +0 -0
- /package/{types → dist/types}/utils/build.d.ts +0 -0
- /package/{types → dist/types}/utils/helper.d.ts +0 -0
- /package/{types → dist/types}/utils/inject-client-css.d.ts +0 -0
- /package/{types → dist/types}/utils/inject-client-global-css.d.ts +0 -0
- /package/{types → dist/types}/utils/inject-server-css.d.ts +0 -0
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.getServerCSS = exports.injectServerCSS = exports.injectClientGlobalCSS = exports.injectClientCSS = exports.build = exports.transpiler = exports.genBase36Hash = exports.isDevAndTest = exports.isDevelopment = exports.isServer = void 0;
|
|
4
|
+
var helper_js_1 = require("./utils/helper.js");
|
|
5
|
+
Object.defineProperty(exports, "isServer", { enumerable: true, get: function () { return helper_js_1.isServer; } });
|
|
6
|
+
Object.defineProperty(exports, "isDevelopment", { enumerable: true, get: function () { return helper_js_1.isDevelopment; } });
|
|
7
|
+
Object.defineProperty(exports, "isDevAndTest", { enumerable: true, get: function () { return helper_js_1.isDevAndTest; } });
|
|
8
|
+
var hash_js_1 = require("./utils/hash.js");
|
|
9
|
+
Object.defineProperty(exports, "genBase36Hash", { enumerable: true, get: function () { return hash_js_1.genBase36Hash; } });
|
|
10
|
+
var transpiler_js_1 = require("./utils/transpiler.js");
|
|
11
|
+
Object.defineProperty(exports, "transpiler", { enumerable: true, get: function () { return transpiler_js_1.transpiler; } });
|
|
12
|
+
var build_js_1 = require("./utils/build.js");
|
|
13
|
+
Object.defineProperty(exports, "build", { enumerable: true, get: function () { return build_js_1.build; } });
|
|
14
|
+
var inject_client_css_js_1 = require("./utils/inject-client-css.js");
|
|
15
|
+
Object.defineProperty(exports, "injectClientCSS", { enumerable: true, get: function () { return inject_client_css_js_1.injectClientCSS; } });
|
|
16
|
+
var inject_client_global_css_js_1 = require("./utils/inject-client-global-css.js");
|
|
17
|
+
Object.defineProperty(exports, "injectClientGlobalCSS", { enumerable: true, get: function () { return inject_client_global_css_js_1.injectClientGlobalCSS; } });
|
|
18
|
+
var inject_server_css_js_1 = require("./utils/inject-server-css.js");
|
|
19
|
+
Object.defineProperty(exports, "injectServerCSS", { enumerable: true, get: function () { return inject_server_css_js_1.injectServerCSS; } });
|
|
20
|
+
Object.defineProperty(exports, "getServerCSS", { enumerable: true, get: function () { return inject_server_css_js_1.getServerCSS; } });
|
|
@@ -2,9 +2,9 @@
|
|
|
2
2
|
"use strict";
|
|
3
3
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
4
|
exports.build = void 0;
|
|
5
|
-
const
|
|
5
|
+
const helper_js_1 = require("./helper.js");
|
|
6
6
|
const build = async (styleSheet, filePath, global) => {
|
|
7
|
-
if (!
|
|
7
|
+
if (!helper_js_1.isServer)
|
|
8
8
|
return;
|
|
9
9
|
const fs = require('fs');
|
|
10
10
|
const { styleText } = require('util');
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.createStyleElement = createStyleElement;
|
|
4
4
|
exports.injectClientCSS = injectClientCSS;
|
|
5
|
-
const
|
|
5
|
+
const index_js_1 = require("../index.js");
|
|
6
6
|
const styleSheets = {};
|
|
7
7
|
const hashCache = {};
|
|
8
8
|
function createStyleElement(hash) {
|
|
@@ -16,7 +16,7 @@ function createStyleElement(hash) {
|
|
|
16
16
|
return styleSheets[hash];
|
|
17
17
|
}
|
|
18
18
|
function injectClientCSS(hash, sheet) {
|
|
19
|
-
if (
|
|
19
|
+
if (index_js_1.isServer)
|
|
20
20
|
return;
|
|
21
21
|
requestAnimationFrame(() => {
|
|
22
22
|
styleCleanUp();
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.injectClientGlobalCSS = injectClientGlobalCSS;
|
|
4
|
-
const
|
|
4
|
+
const index_js_1 = require("../index.js");
|
|
5
5
|
function injectClientGlobalCSS(sheet, scoped) {
|
|
6
|
-
if (
|
|
6
|
+
if (index_js_1.isServer)
|
|
7
7
|
return;
|
|
8
8
|
const existingStyleElement = document.querySelector(`[data-scope="${scoped}"]`);
|
|
9
9
|
if (existingStyleElement instanceof HTMLStyleElement) {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.transpiler = transpiler;
|
|
4
|
-
const
|
|
4
|
+
const helper_js_1 = require("./helper.js");
|
|
5
5
|
const createKeyframes = (property, content) => {
|
|
6
6
|
let keyframesRules = `${property} {\n`;
|
|
7
7
|
for (const key in content) {
|
|
@@ -10,10 +10,10 @@ const createKeyframes = (property, content) => {
|
|
|
10
10
|
keyframesRules += ` ${key} {\n`;
|
|
11
11
|
for (const prop in keyframeValue) {
|
|
12
12
|
if (Object.prototype.hasOwnProperty.call(keyframeValue, prop)) {
|
|
13
|
-
const CSSProp = (0,
|
|
13
|
+
const CSSProp = (0, helper_js_1.camelToKebabCase)(prop);
|
|
14
14
|
const value = keyframeValue[prop];
|
|
15
15
|
if (typeof value === 'string' || typeof value === 'number') {
|
|
16
|
-
const applyValue = (0,
|
|
16
|
+
const applyValue = (0, helper_js_1.applyCssValue)(value, CSSProp);
|
|
17
17
|
keyframesRules += ` ${CSSProp}: ${applyValue};\n`;
|
|
18
18
|
}
|
|
19
19
|
}
|
|
@@ -34,7 +34,7 @@ function transpiler(object, base36Hash, core) {
|
|
|
34
34
|
if (typeof property !== 'string')
|
|
35
35
|
return '';
|
|
36
36
|
const value = rulesValue[property];
|
|
37
|
-
const cssProp = (0,
|
|
37
|
+
const cssProp = (0, helper_js_1.camelToKebabCase)(property);
|
|
38
38
|
return `${indent}${cssProp}: ${value};\n`;
|
|
39
39
|
};
|
|
40
40
|
const stringConverter = (className, properties, indentLevel = 0) => {
|
|
@@ -46,15 +46,15 @@ function transpiler(object, base36Hash, core) {
|
|
|
46
46
|
if (Object.prototype.hasOwnProperty.call(properties, property)) {
|
|
47
47
|
const value = properties[property];
|
|
48
48
|
if (typeof value === 'string' || typeof value === 'number') {
|
|
49
|
-
let CSSProp = (0,
|
|
49
|
+
let CSSProp = (0, helper_js_1.camelToKebabCase)(property);
|
|
50
50
|
if (property.startsWith('ms')) {
|
|
51
51
|
CSSProp = `-${CSSProp}`;
|
|
52
52
|
}
|
|
53
|
-
const applyValue = (0,
|
|
53
|
+
const applyValue = (0, helper_js_1.applyCssValue)(value, CSSProp);
|
|
54
54
|
cssRule += ` ${CSSProp}: ${applyValue};\n`;
|
|
55
55
|
}
|
|
56
56
|
else if (!property.startsWith('@')) {
|
|
57
|
-
const kebabPseudoSelector = (0,
|
|
57
|
+
const kebabPseudoSelector = (0, helper_js_1.camelToKebabCase)(property.replace('&', ''));
|
|
58
58
|
const styles = stringConverter(className + kebabPseudoSelector, value, indentLevel);
|
|
59
59
|
Object.assign(classSelector, styles);
|
|
60
60
|
}
|
|
@@ -68,13 +68,13 @@ function transpiler(object, base36Hash, core) {
|
|
|
68
68
|
const isColon = mediaProp.startsWith(':');
|
|
69
69
|
const isAnd = mediaProp.startsWith('&');
|
|
70
70
|
if (isColon || isAnd) {
|
|
71
|
-
const kebabMediaProp = (0,
|
|
71
|
+
const kebabMediaProp = (0, helper_js_1.camelToKebabCase)(mediaProp.replace('&', ''));
|
|
72
72
|
let pseudoClassRule = '';
|
|
73
73
|
if (typeof mediaValue === 'object' && mediaValue !== null) {
|
|
74
74
|
for (const pseudoProp in mediaValue) {
|
|
75
75
|
if (Object.prototype.hasOwnProperty.call(mediaValue, pseudoProp)) {
|
|
76
|
-
const CSSProp = (0,
|
|
77
|
-
const applyValue = (0,
|
|
76
|
+
const CSSProp = (0, helper_js_1.camelToKebabCase)(pseudoProp);
|
|
77
|
+
const applyValue = (0, helper_js_1.applyCssValue)(mediaValue[pseudoProp], CSSProp);
|
|
78
78
|
pseudoClassRule += rules(innerIndent + ' ', { [pseudoProp]: applyValue }, pseudoProp);
|
|
79
79
|
}
|
|
80
80
|
}
|
|
@@ -82,8 +82,8 @@ function transpiler(object, base36Hash, core) {
|
|
|
82
82
|
nestedRules += `${innerIndent}${className}${kebabMediaProp} {\n${pseudoClassRule}${innerIndent}}\n`;
|
|
83
83
|
}
|
|
84
84
|
else {
|
|
85
|
-
const CSSProp = (0,
|
|
86
|
-
const applyValue = (0,
|
|
85
|
+
const CSSProp = (0, helper_js_1.camelToKebabCase)(mediaProp);
|
|
86
|
+
const applyValue = (0, helper_js_1.applyCssValue)(mediaValue, CSSProp);
|
|
87
87
|
regularRules += rules(innerIndent + ' ', { [mediaProp]: applyValue }, mediaProp);
|
|
88
88
|
}
|
|
89
89
|
}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
export { isServer, isDevelopment, isDevAndTest } from './utils/helper.js';
|
|
2
|
+
export { genBase36Hash } from './utils/hash.js';
|
|
3
|
+
export { transpiler } from './utils/transpiler.js';
|
|
4
|
+
export { build } from './utils/build.js';
|
|
5
|
+
export { injectClientCSS } from './utils/inject-client-css.js';
|
|
6
|
+
export { injectClientGlobalCSS } from './utils/inject-client-global-css.js';
|
|
7
|
+
export { injectServerCSS, getServerCSS } from './utils/inject-server-css.js';
|
|
@@ -2,10 +2,10 @@ export type { CustomProperties } from './types/common/css-properties';
|
|
|
2
2
|
export type { CreateStyle, ClassesStyle, ReturnType } from './types/main/create';
|
|
3
3
|
export type { KeyframesDefinition, CustomHTMLType } from './types/main/global';
|
|
4
4
|
export type { VarsDefinition, VarsTransformed } from './types/main/vars';
|
|
5
|
-
export { isServer, isDevelopment, isDevAndTest } from './utils/helper';
|
|
6
|
-
export { genBase36Hash } from './utils/hash';
|
|
7
|
-
export { transpiler } from './utils/transpiler';
|
|
8
|
-
export { build } from './utils/build';
|
|
9
|
-
export { injectClientCSS } from './utils/inject-client-css';
|
|
10
|
-
export { injectClientGlobalCSS } from './utils/inject-client-global-css';
|
|
11
|
-
export { injectServerCSS, getServerCSS } from './utils/inject-server-css';
|
|
5
|
+
export { isServer, isDevelopment, isDevAndTest } from './utils/helper.js';
|
|
6
|
+
export { genBase36Hash } from './utils/hash.js';
|
|
7
|
+
export { transpiler } from './utils/transpiler.js';
|
|
8
|
+
export { build } from './utils/build.js';
|
|
9
|
+
export { injectClientCSS } from './utils/inject-client-css.js';
|
|
10
|
+
export { injectClientGlobalCSS } from './utils/inject-client-global-css.js';
|
|
11
|
+
export { injectServerCSS, getServerCSS } from './utils/inject-server-css.js';
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { ClassesStyle, KeyframesDefinition, VarsDefinition } from '
|
|
1
|
+
import { ClassesStyle, KeyframesDefinition, VarsDefinition } from '../index.js';
|
|
2
2
|
export declare function genBase36Hash(object: ClassesStyle | KeyframesDefinition | VarsDefinition, n: number): string;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type { ClassesStyle, CustomHTMLType, VarsDefinition } from '../index';
|
|
1
|
+
import type { ClassesStyle, CustomHTMLType, VarsDefinition } from '../index.js';
|
|
2
2
|
export declare function transpiler(object: ClassesStyle | CustomHTMLType | VarsDefinition, base36Hash?: string, core?: string): {
|
|
3
3
|
styleSheet: string;
|
|
4
4
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "zss-engine",
|
|
3
|
-
"version": "0.2.
|
|
3
|
+
"version": "0.2.20",
|
|
4
4
|
"description": "Zero-runtime Style Sheet Engine",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"zero-runtime",
|
|
@@ -15,22 +15,21 @@
|
|
|
15
15
|
"exports": {
|
|
16
16
|
"./package.json": "./package.json",
|
|
17
17
|
".": {
|
|
18
|
-
"types": "./types/index.d.ts",
|
|
19
|
-
"import": "./dist/index.
|
|
20
|
-
"default": "./dist/index.js"
|
|
18
|
+
"types": "./dist/types/index.d.ts",
|
|
19
|
+
"import": "./dist/esm/index.js",
|
|
20
|
+
"default": "./dist/cjs/index.js"
|
|
21
21
|
}
|
|
22
22
|
},
|
|
23
|
-
"main": "dist/index.js",
|
|
24
|
-
"module": "dist/index.
|
|
25
|
-
"types": "types/index.d.ts",
|
|
23
|
+
"main": "dist/cjs/index.js",
|
|
24
|
+
"module": "dist/esm/index.js",
|
|
25
|
+
"types": "dist/types/index.d.ts",
|
|
26
26
|
"files": [
|
|
27
|
-
"dist/"
|
|
28
|
-
"types/"
|
|
27
|
+
"dist/"
|
|
29
28
|
],
|
|
30
29
|
"scripts": {
|
|
31
|
-
"build": "rimraf dist
|
|
30
|
+
"build": "rimraf dist && pnpm esm && pnpm cjs",
|
|
32
31
|
"cjs": "tsc --project tsconfig.cjs.json",
|
|
33
|
-
"esm": "tsc --project tsconfig.esm.json
|
|
32
|
+
"esm": "tsc --project tsconfig.esm.json",
|
|
34
33
|
"test": "jest"
|
|
35
34
|
},
|
|
36
35
|
"dependencies": {
|
|
@@ -39,7 +38,6 @@
|
|
|
39
38
|
"devDependencies": {
|
|
40
39
|
"@types/jest": "^29.5.14",
|
|
41
40
|
"@types/node": "^22.13.10",
|
|
42
|
-
"fast-glob": "^3.3.3",
|
|
43
41
|
"jest": "^29.7.0",
|
|
44
42
|
"jest-environment-jsdom": "^29.7.0",
|
|
45
43
|
"rimraf": "^6.0.1",
|
package/dist/index.js
DELETED
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.getServerCSS = exports.injectServerCSS = exports.injectClientGlobalCSS = exports.injectClientCSS = exports.build = exports.transpiler = exports.genBase36Hash = exports.isDevAndTest = exports.isDevelopment = exports.isServer = void 0;
|
|
4
|
-
var helper_1 = require("./utils/helper");
|
|
5
|
-
Object.defineProperty(exports, "isServer", { enumerable: true, get: function () { return helper_1.isServer; } });
|
|
6
|
-
Object.defineProperty(exports, "isDevelopment", { enumerable: true, get: function () { return helper_1.isDevelopment; } });
|
|
7
|
-
Object.defineProperty(exports, "isDevAndTest", { enumerable: true, get: function () { return helper_1.isDevAndTest; } });
|
|
8
|
-
var hash_1 = require("./utils/hash");
|
|
9
|
-
Object.defineProperty(exports, "genBase36Hash", { enumerable: true, get: function () { return hash_1.genBase36Hash; } });
|
|
10
|
-
var transpiler_1 = require("./utils/transpiler");
|
|
11
|
-
Object.defineProperty(exports, "transpiler", { enumerable: true, get: function () { return transpiler_1.transpiler; } });
|
|
12
|
-
var build_1 = require("./utils/build");
|
|
13
|
-
Object.defineProperty(exports, "build", { enumerable: true, get: function () { return build_1.build; } });
|
|
14
|
-
var inject_client_css_1 = require("./utils/inject-client-css");
|
|
15
|
-
Object.defineProperty(exports, "injectClientCSS", { enumerable: true, get: function () { return inject_client_css_1.injectClientCSS; } });
|
|
16
|
-
var inject_client_global_css_1 = require("./utils/inject-client-global-css");
|
|
17
|
-
Object.defineProperty(exports, "injectClientGlobalCSS", { enumerable: true, get: function () { return inject_client_global_css_1.injectClientGlobalCSS; } });
|
|
18
|
-
var inject_server_css_1 = require("./utils/inject-server-css");
|
|
19
|
-
Object.defineProperty(exports, "injectServerCSS", { enumerable: true, get: function () { return inject_server_css_1.injectServerCSS; } });
|
|
20
|
-
Object.defineProperty(exports, "getServerCSS", { enumerable: true, get: function () { return inject_server_css_1.getServerCSS; } });
|
package/dist/index.mjs
DELETED
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
export { isServer, isDevelopment, isDevAndTest } from './utils/helper';
|
|
2
|
-
export { genBase36Hash } from './utils/hash';
|
|
3
|
-
export { transpiler } from './utils/transpiler';
|
|
4
|
-
export { build } from './utils/build';
|
|
5
|
-
export { injectClientCSS } from './utils/inject-client-css';
|
|
6
|
-
export { injectClientGlobalCSS } from './utils/inject-client-global-css';
|
|
7
|
-
export { injectServerCSS, getServerCSS } from './utils/inject-server-css';
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|