zss-engine 0.2.8 → 0.2.10

package/types/index.d.ts

@@ -1,8 +1,130 @@
-export * from './types';
-export * from './utils/helper';
-export { genBase36Hash } from './utils/hash';
-export { injectClientCSS } from './utils/inject-client-css';
-export { injectClientGlobalCSS } from './utils/inject-client-global-css';
-export { injectServerCSS, getServerCSS } from './utils/inject-server-css';
-export { build } from './utils/build';
-export { transpiler } from './utils/transpiler';
+import { Properties, Property } from 'csstype';
+
+type VarsDefinition = Record<string, string | number | Record<string, string | number>>;
+type CSSVariableKey = `--${string}`;
+type CSSVariableValue = `var(${CSSVariableKey})`;
+type CSSVariableProperties = {
+    [key: CSSVariableKey]: string | number;
+};
+type VarsTransformed = {
+    [key: string]: CSSVariableProperties;
+};
+
+type ColorValue = Exclude<Property.Color, '-moz-initial'> | (string & {});
+type CSSColorProperty = Exclude<ColorValue, SystemColorKeyword>;
+type SystemColorKeyword = 'ActiveBorder' | 'ActiveCaption' | 'AppWorkspace' | 'Background' | 'ButtonFace' | 'ButtonHighlight' | 'ButtonShadow' | 'ButtonText' | 'CaptionText' | 'GrayText' | 'Highlight' | 'HighlightText' | 'InactiveBorder' | 'InactiveCaption' | 'InactiveCaptionText' | 'InfoBackground' | 'InfoText' | 'Menu' | 'MenuText' | 'Scrollbar' | 'ThreeDDarkShadow' | 'ThreeDFace' | 'ThreeDHighlight' | 'ThreeDLightShadow' | 'ThreeDShadow' | 'Window' | 'WindowFrame' | 'WindowText';
+type ExcludeMozInitial<T> = Exclude<T, '-moz-initial'>;
+type CSSTypeProperties = Properties<number | (string & {})>;
+type CSSProperties = {
+    [K in keyof CSSTypeProperties]: ExcludeMozInitial<CSSTypeProperties[K]>;
+};
+type BaseCSSProperties = {
+    [K in keyof CSSProperties]: CSSProperties[K] | CSSVariableValue;
+};
+interface CommonProperties extends BaseCSSProperties {
+    accentColor?: CSSColorProperty;
+    color?: CSSColorProperty;
+    borderLeftColor?: CSSColorProperty;
+    borderRightColor?: CSSColorProperty;
+    borderTopColor?: CSSColorProperty;
+    borderBottomColor?: CSSColorProperty;
+    borderBlockColor?: CSSColorProperty;
+    borderBlockStartColor?: CSSColorProperty;
+    borderBlockEndColor?: CSSColorProperty;
+    borderInlineColor?: CSSColorProperty;
+    borderInlineStartColor?: CSSColorProperty;
+    borderInlineEndColor?: CSSColorProperty;
+    backgroundColor?: CSSColorProperty;
+    outlineColor?: CSSColorProperty;
+    textDecorationColor?: CSSColorProperty;
+    caretColor?: CSSColorProperty;
+    columnRuleColor?: CSSColorProperty;
+}
+type AndString = `&${string}`;
+type AndStringType = {
+    [key in AndString]: CommonProperties;
+};
+type Colon = `:${string}`;
+type ColonType = {
+    [key in Colon]: CommonProperties;
+};
+type MediaQuery = `@media ${string}`;
+type MediaQueryType = {
+    [K in MediaQuery]: CommonProperties | ColonType | AndStringType;
+};
+type CustomProperties = CommonProperties | ColonType | AndStringType | MediaQueryType;
+
+type PropertyValue = string | number | PropertyType;
+type PropertyType = {
+    [key: string]: PropertyValue;
+};
+
+type CreateStyle<T> = {
+    readonly [K in keyof T]: T[K] extends CustomProperties ? CustomProperties : T[K];
+};
+type ClassesStyle = {
+    [key: string]: CustomProperties;
+};
+type ReturnType<T> = {
+    [key in keyof T]: string;
+};
+
+type JSXType = keyof HTMLElementTagNameMap | '*' | ':root';
+type HTMLType = {
+    [K in JSXType]: CustomProperties;
+};
+type ClassName = `.${string}`;
+type ClassNameType = {
+    [K in ClassName]: CustomProperties;
+};
+type Attribute = `${string}[${string}]${string}`;
+type AttributeType = {
+    [K in Attribute]: CustomProperties;
+};
+type Consecutive = `${JSXType} ${string}`;
+type ConsecutiveType = {
+    [K in Consecutive]: CustomProperties;
+};
+type PseudoClass = `${JSXType}:${string}`;
+type PseudoClassType = {
+    [K in PseudoClass]: CustomProperties;
+};
+type PseudoElement = `::${string}`;
+type PseudoElementType = {
+    [K in PseudoElement]: CustomProperties;
+};
+type KeyframeSelector = 'from' | 'to' | `${number}%`;
+type KeyframesDefinition = {
+    [K in KeyframeSelector]?: CustomProperties;
+};
+type KeyframesType = {
+    [K in `@keyframes ${string}`]: KeyframesDefinition;
+};
+type MediaQueryHTMLType = {
+    [K in MediaQuery]: CustomHTMLType;
+};
+type CustomHTMLType = HTMLType | ClassNameType | AttributeType | ConsecutiveType | PseudoClassType | PseudoElementType | KeyframesType | MediaQueryHTMLType;
+
+declare const isServer: boolean;
+declare const isDevelopment: boolean;
+declare const isDevAndTest: boolean;
+declare const isDevServer: boolean;
+declare const applyCssValue: (value: string | number, cssProp: string) => string;
+declare const camelToKebabCase: (property: string) => string;
+
+declare function genBase36Hash(object: ClassesStyle | KeyframesDefinition | VarsDefinition, n: number): string;
+
+declare function injectClientCSS(hash: string, sheet: string): void;
+
+declare function injectClientGlobalCSS(sheet: string, scoped: string): void;
+
+declare function injectServerCSS(hash: string, sheet: string): void;
+declare function getServerCSS(): string;
+
+declare const build: (styleSheet: string, filePath: string, global?: string) => Promise<void>;
+
+declare function transpiler(object: ClassesStyle | CustomHTMLType | VarsDefinition, base36Hash?: string, core?: string): {
+    styleSheet: string;
+};
+
+export { type CSSVariableValue, type ClassesStyle, type CreateStyle, type CustomHTMLType, type CustomProperties, type KeyframesDefinition, type MediaQuery, type PropertyType, type ReturnType, type VarsDefinition, type VarsTransformed, applyCssValue, build, camelToKebabCase, genBase36Hash, getServerCSS, injectClientCSS, injectClientGlobalCSS, injectServerCSS, isDevAndTest, isDevServer, isDevelopment, isServer, transpiler };

package/dist/types/common/css-properties.js

@@ -1,2 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });

package/dist/types/common/css-properties.mjs

@@ -1 +0,0 @@
-export {};

package/dist/types/common/css-property.js

@@ -1,2 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });

package/dist/types/common/css-property.mjs

@@ -1 +0,0 @@
-export {};

package/dist/types/index.js

@@ -1,21 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-__exportStar(require("./common/css-properties"), exports);
-__exportStar(require("./common/css-property"), exports);
-__exportStar(require("./main/create"), exports);
-__exportStar(require("./main/global"), exports);
-__exportStar(require("./main/vars"), exports);

package/dist/types/index.mjs

@@ -1,5 +0,0 @@
-export * from './common/css-properties';
-export * from './common/css-property';
-export * from './main/create';
-export * from './main/global';
-export * from './main/vars';

package/dist/types/main/create.js

@@ -1,2 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });

package/dist/types/main/create.mjs

@@ -1 +0,0 @@
-export {};

package/dist/types/main/global.js

@@ -1,2 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });

package/dist/types/main/global.mjs

@@ -1 +0,0 @@
-export {};

package/dist/types/main/vars.js

@@ -1,2 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });

package/dist/types/main/vars.mjs

@@ -1 +0,0 @@
-export {};

package/dist/utils/build.js

@@ -1,27 +0,0 @@
-'use server';
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.build = void 0;
-const helper_1 = require("./helper");
-const build = async (styleSheet, filePath, global) => {
-    if (!helper_1.isServer)
-        return;
-    const fs = require('fs');
-    const { styleText } = require('util');
-    const message = global === '--global' ? styleText('underline', `✅Generated global CSS\n\n`) : styleText('underline', `✅Generated create CSS\n\n`);
-    try {
-        if (fs.existsSync(filePath)) {
-            const cssData = fs.readFileSync(filePath, 'utf-8');
-            if (!cssData.includes(styleSheet)) {
-                fs.appendFileSync(filePath, styleSheet, 'utf-8');
-                if (process.argv.includes('--log'))
-                    console.log(message + styleSheet);
-            }
-        }
-        return;
-    }
-    catch (error) {
-        console.error('Error writing to file:', error);
-    }
-};
-exports.build = build;

package/dist/utils/build.mjs

@@ -1,23 +0,0 @@
-'use server';
-import { isServer } from './helper';
-export const build = async (styleSheet, filePath, global) => {
-    if (!isServer)
-        return;
-    const fs = require('fs');
-    const { styleText } = require('util');
-    const message = global === '--global' ? styleText('underline', `✅Generated global CSS\n\n`) : styleText('underline', `✅Generated create CSS\n\n`);
-    try {
-        if (fs.existsSync(filePath)) {
-            const cssData = fs.readFileSync(filePath, 'utf-8');
-            if (!cssData.includes(styleSheet)) {
-                fs.appendFileSync(filePath, styleSheet, 'utf-8');
-                if (process.argv.includes('--log'))
-                    console.log(message + styleSheet);
-            }
-        }
-        return;
-    }
-    catch (error) {
-        console.error('Error writing to file:', error);
-    }
-};

package/dist/utils/hash.js

@@ -1,34 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.genBase36Hash = genBase36Hash;
-const chars = 'abcdefghijklmnopqrstuvwxyz0123456789';
-function simpleHash(str) {
-    let hash = 0;
-    for (let i = 0; i < str.length; i++) {
-        const char = str.charCodeAt(i);
-        hash = (hash << 5) - hash + char;
-    }
-    return Math.abs(hash);
-}
-function encodeBase36(num) {
-    let result = '';
-    do {
-        result = chars[num % 36] + result;
-        num = Math.floor(num / 36);
-    } while (num > 0);
-    return result;
-}
-function getStartingChar(hash) {
-    const chars = 'abcdefghijklmnopqrstuvwxyz';
-    return chars[hash % chars.length];
-}
-function genBase36Hash(object, n) {
-    const serialized = JSON.stringify(object);
-    const hash = simpleHash(serialized);
-    let base36Hash = encodeBase36(hash);
-    const startingChar = getStartingChar(hash);
-    while (base36Hash.length < n - 1) {
-        base36Hash = chars[hash % chars.length] + base36Hash;
-    }
-    return startingChar + base36Hash.slice(0, n - 1);
-}

package/dist/utils/hash.mjs

@@ -1,31 +0,0 @@
-const chars = 'abcdefghijklmnopqrstuvwxyz0123456789';
-function simpleHash(str) {
-    let hash = 0;
-    for (let i = 0; i < str.length; i++) {
-        const char = str.charCodeAt(i);
-        hash = (hash << 5) - hash + char;
-    }
-    return Math.abs(hash);
-}
-function encodeBase36(num) {
-    let result = '';
-    do {
-        result = chars[num % 36] + result;
-        num = Math.floor(num / 36);
-    } while (num > 0);
-    return result;
-}
-function getStartingChar(hash) {
-    const chars = 'abcdefghijklmnopqrstuvwxyz';
-    return chars[hash % chars.length];
-}
-export function genBase36Hash(object, n) {
-    const serialized = JSON.stringify(object);
-    const hash = simpleHash(serialized);
-    let base36Hash = encodeBase36(hash);
-    const startingChar = getStartingChar(hash);
-    while (base36Hash.length < n - 1) {
-        base36Hash = chars[hash % chars.length] + base36Hash;
-    }
-    return startingChar + base36Hash.slice(0, n - 1);
-}

package/dist/utils/helper.js

@@ -1,21 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.camelToKebabCase = exports.applyCssValue = exports.isDevServer = exports.isDevAndTest = exports.isDevelopment = exports.isServer = void 0;
-const isWindowDefined = typeof window !== 'undefined';
-const isDocumentDefined = typeof document !== 'undefined';
-exports.isServer = !isWindowDefined || !isDocumentDefined;
-exports.isDevelopment = process.env.NODE_ENV === 'development';
-exports.isDevAndTest = process.env.NODE_ENV === 'development' || process.env.NODE_ENV === 'test';
-exports.isDevServer = exports.isDevelopment && exports.isServer;
-const exception = ['line-height', 'font-weight', 'opacity', 'scale', 'z-index', 'column-count', 'order', 'orphans', 'widows'];
-const applyCssValue = (value, cssProp) => {
-    if (typeof value === 'number') {
-        return exception.includes(cssProp) ? value.toString() : value + 'px';
-    }
-    return value;
-};
-exports.applyCssValue = applyCssValue;
-const camelToKebabCase = (property) => {
-    return property.replace(/([A-Z])/g, '-$1').toLowerCase();
-};
-exports.camelToKebabCase = camelToKebabCase;

package/dist/utils/helper.mjs

@@ -1,16 +0,0 @@
-const isWindowDefined = typeof window !== 'undefined';
-const isDocumentDefined = typeof document !== 'undefined';
-export const isServer = !isWindowDefined || !isDocumentDefined;
-export const isDevelopment = process.env.NODE_ENV === 'development';
-export const isDevAndTest = process.env.NODE_ENV === 'development' || process.env.NODE_ENV === 'test';
-export const isDevServer = isDevelopment && isServer;
-const exception = ['line-height', 'font-weight', 'opacity', 'scale', 'z-index', 'column-count', 'order', 'orphans', 'widows'];
-export const applyCssValue = (value, cssProp) => {
-    if (typeof value === 'number') {
-        return exception.includes(cssProp) ? value.toString() : value + 'px';
-    }
-    return value;
-};
-export const camelToKebabCase = (property) => {
-    return property.replace(/([A-Z])/g, '-$1').toLowerCase();
-};

package/dist/utils/inject-client-css.js

@@ -1,51 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.createStyleElement = createStyleElement;
-exports.injectClientCSS = injectClientCSS;
-const __1 = require("..");
-const styleSheets = {};
-const hashCache = {};
-function createStyleElement(hash) {
-    if (document.getElementById(hash))
-        return null;
-    const styleElement = document.createElement('style');
-    styleElement.setAttribute('id', hash);
-    styleElement.setAttribute('type', 'text/css');
-    styleSheets[hash] = styleElement;
-    document.head.appendChild(styleElement);
-    return styleSheets[hash];
-}
-function injectClientCSS(hash, sheet) {
-    if (__1.isServer)
-        return;
-    requestAnimationFrame(() => {
-        styleCleanUp();
-    });
-    hashCache[hash] = hash;
-    const styleElement = createStyleElement(hash);
-    if (styleElement == null)
-        return;
-    styleElement.textContent = sheet;
-}
-function styleCleanUp() {
-    requestAnimationFrame(() => {
-        for (const hash in hashCache) {
-            const classElements = document.querySelectorAll(`[class*="${hash}"]`);
-            if (classElements.length === 0) {
-                removeStyleElement(hashCache[hash]);
-            }
-        }
-    });
-}
-function removeStyleElement(hash) {
-    if (styleSheets[hash]) {
-        delete styleSheets[hash];
-        if (hashCache.hasOwnProperty.call(hashCache, hash)) {
-            delete hashCache[hash];
-        }
-        const styleElement = document.getElementById(hash);
-        if (styleElement) {
-            document.head.removeChild(styleElement);
-        }
-    }
-}

package/dist/utils/inject-client-css.mjs

@@ -1,47 +0,0 @@
-import { isServer } from '..';
-const styleSheets = {};
-const hashCache = {};
-export function createStyleElement(hash) {
-    if (document.getElementById(hash))
-        return null;
-    const styleElement = document.createElement('style');
-    styleElement.setAttribute('id', hash);
-    styleElement.setAttribute('type', 'text/css');
-    styleSheets[hash] = styleElement;
-    document.head.appendChild(styleElement);
-    return styleSheets[hash];
-}
-export function injectClientCSS(hash, sheet) {
-    if (isServer)
-        return;
-    requestAnimationFrame(() => {
-        styleCleanUp();
-    });
-    hashCache[hash] = hash;
-    const styleElement = createStyleElement(hash);
-    if (styleElement == null)
-        return;
-    styleElement.textContent = sheet;
-}
-function styleCleanUp() {
-    requestAnimationFrame(() => {
-        for (const hash in hashCache) {
-            const classElements = document.querySelectorAll(`[class*="${hash}"]`);
-            if (classElements.length === 0) {
-                removeStyleElement(hashCache[hash]);
-            }
-        }
-    });
-}
-function removeStyleElement(hash) {
-    if (styleSheets[hash]) {
-        delete styleSheets[hash];
-        if (hashCache.hasOwnProperty.call(hashCache, hash)) {
-            delete hashCache[hash];
-        }
-        const styleElement = document.getElementById(hash);
-        if (styleElement) {
-            document.head.removeChild(styleElement);
-        }
-    }
-}

package/dist/utils/inject-client-global-css.js

@@ -1,18 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.injectClientGlobalCSS = injectClientGlobalCSS;
-const __1 = require("..");
-function injectClientGlobalCSS(sheet, scoped) {
-    if (__1.isServer)
-        return;
-    const existingStyleElement = document.querySelector(`[data-scope="${scoped}"]`);
-    if (existingStyleElement instanceof HTMLStyleElement) {
-        existingStyleElement.textContent += sheet;
-        return;
-    }
-    const styleElement = document.createElement('style');
-    styleElement.setAttribute('data-scope', scoped);
-    styleElement.setAttribute('type', 'text/css');
-    styleElement.textContent = sheet;
-    document.head.appendChild(styleElement);
-}

package/dist/utils/inject-client-global-css.mjs

@@ -1,15 +0,0 @@
-import { isServer } from '..';
-export function injectClientGlobalCSS(sheet, scoped) {
-    if (isServer)
-        return;
-    const existingStyleElement = document.querySelector(`[data-scope="${scoped}"]`);
-    if (existingStyleElement instanceof HTMLStyleElement) {
-        existingStyleElement.textContent += sheet;
-        return;
-    }
-    const styleElement = document.createElement('style');
-    styleElement.setAttribute('data-scope', scoped);
-    styleElement.setAttribute('type', 'text/css');
-    styleElement.textContent = sheet;
-    document.head.appendChild(styleElement);
-}

package/dist/utils/inject-server-css.js

@@ -1,11 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.injectServerCSS = injectServerCSS;
-exports.getServerCSS = getServerCSS;
-const styleSheets = {};
-function injectServerCSS(hash, sheet) {
-    styleSheets[hash] = sheet;
-}
-function getServerCSS() {
-    return Object.values(styleSheets).join('\n');
-}

package/dist/utils/inject-server-css.mjs

@@ -1,7 +0,0 @@
-const styleSheets = {};
-export function injectServerCSS(hash, sheet) {
-    styleSheets[hash] = sheet;
-}
-export function getServerCSS() {
-    return Object.values(styleSheets).join('\n');
-}

package/dist/utils/transpiler.js

@@ -1,125 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.transpiler = transpiler;
-const __1 = require("..");
-const createKeyframes = (property, content) => {
-    let keyframesRules = `${property} {\n`;
-    for (const key in content) {
-        if (Object.prototype.hasOwnProperty.call(content, key)) {
-            const keyframeValue = content[key];
-            keyframesRules += `  ${key} {\n`;
-            for (const prop in keyframeValue) {
-                if (Object.prototype.hasOwnProperty.call(keyframeValue, prop)) {
-                    const CSSProp = (0, __1.camelToKebabCase)(prop);
-                    const value = keyframeValue[prop];
-                    if (typeof value === 'string' || typeof value === 'number') {
-                        const applyValue = (0, __1.applyCssValue)(value, CSSProp);
-                        keyframesRules += `    ${CSSProp}: ${applyValue};\n`;
-                    }
-                }
-            }
-            keyframesRules += `  }\n`;
-        }
-    }
-    keyframesRules += `}\n`;
-    return keyframesRules;
-};
-function transpiler(object, base36Hash, core) {
-    let styleSheet = '';
-    const mediaQueries = [];
-    const classNameType = (property) => {
-        return core === '--global' ? property : `.${property}_${base36Hash}`;
-    };
-    const rules = (indent, rulesValue, property) => {
-        if (typeof property !== 'string')
-            return '';
-        const value = rulesValue[property];
-        const cssProp = (0, __1.camelToKebabCase)(property);
-        return `${indent}${cssProp}: ${value};\n`;
-    };
-    const stringConverter = (className, properties, indentLevel = 0) => {
-        const classSelector = {};
-        const indent = ''.repeat(indentLevel);
-        const innerIndent = ' '.repeat(indentLevel + 1);
-        let cssRule = '';
-        for (const property in properties) {
-            if (Object.prototype.hasOwnProperty.call(properties, property)) {
-                const value = properties[property];
-                if (typeof value === 'string' || typeof value === 'number') {
-                    let CSSProp = (0, __1.camelToKebabCase)(property);
-                    if (property.startsWith('ms')) {
-                        CSSProp = `-${CSSProp}`;
-                    }
-                    const applyValue = (0, __1.applyCssValue)(value, CSSProp);
-                    cssRule += `  ${CSSProp}: ${applyValue};\n`;
-                }
-                else if (!property.startsWith('@')) {
-                    const kebabPseudoSelector = (0, __1.camelToKebabCase)(property.replace('&', ''));
-                    const styles = stringConverter(className + kebabPseudoSelector, value, indentLevel);
-                    Object.assign(classSelector, styles);
-                }
-                else if (property.startsWith('@media') || property.startsWith('@container')) {
-                    const mediaRule = property;
-                    let nestedRules = '';
-                    let regularRules = '';
-                    for (const mediaProp in value) {
-                        if (Object.prototype.hasOwnProperty.call(value, mediaProp)) {
-                            const mediaValue = value[mediaProp];
-                            const isColon = mediaProp.startsWith(':');
-                            const isAnd = mediaProp.startsWith('&');
-                            if (isColon || isAnd) {
-                                const kebabMediaProp = (0, __1.camelToKebabCase)(mediaProp.replace('&', ''));
-                                let pseudoClassRule = '';
-                                if (typeof mediaValue === 'object' && mediaValue !== null) {
-                                    for (const pseudoProp in mediaValue) {
-                                        if (Object.prototype.hasOwnProperty.call(mediaValue, pseudoProp)) {
-                                            const CSSProp = (0, __1.camelToKebabCase)(pseudoProp);
-                                            const applyValue = (0, __1.applyCssValue)(mediaValue[pseudoProp], CSSProp);
-                                            pseudoClassRule += rules(innerIndent + '  ', { [pseudoProp]: applyValue }, pseudoProp);
-                                        }
-                                    }
-                                }
-                                nestedRules += `${innerIndent}${className}${kebabMediaProp} {\n${pseudoClassRule}${innerIndent}}\n`;
-                            }
-                            else {
-                                const CSSProp = (0, __1.camelToKebabCase)(mediaProp);
-                                const applyValue = (0, __1.applyCssValue)(mediaValue, CSSProp);
-                                regularRules += rules(innerIndent + '  ', { [mediaProp]: applyValue }, mediaProp);
-                            }
-                        }
-                    }
-                    if (regularRules) {
-                        mediaQueries.push({
-                            media: mediaRule,
-                            css: `${mediaRule} {\n${innerIndent}${className} {\n${regularRules}  }\n${nestedRules}${indent}}${indent}\n`,
-                        });
-                    }
-                    else {
-                        mediaQueries.push({
-                            media: mediaRule,
-                            css: `${mediaRule} {\n${nestedRules}${indent}}\n`,
-                        });
-                    }
-                }
-            }
-        }
-        classSelector[className] = cssRule;
-        return classSelector;
-    };
-    for (const property in object) {
-        if (property.startsWith('@keyframes')) {
-            const keyframesContent = object[property];
-            styleSheet += createKeyframes(property, keyframesContent);
-        }
-        const classSelectors = stringConverter(classNameType(property), object[property], 1);
-        for (const selector in classSelectors) {
-            if (!selector.startsWith('@keyframes') && classSelectors[selector]) {
-                styleSheet += selector + ' {\n' + classSelectors[selector] + '}\n';
-            }
-        }
-    }
-    mediaQueries.forEach(({ css }) => {
-        styleSheet += css;
-    });
-    return { styleSheet };
-}