Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
import {kashe} from 'kashe';
import {StyleDefinition, UsedTypes, UsedTypesRef} from "./types";
import {extractUnmatchable, fromAst, getUnmatchableRules} from "./parser/fromAst";
import {assertIsReady, getStylesInText} from "./utils";
export const getUnusableStyles = kashe((def: StyleDefinition): UsedTypesRef => (
Object
.keys(def.ast || {})
.filter(key => getUnmatchableRules(def.ast[key]).length > 0)
.reduce((acc, file) => {
acc[file] = true;
return acc;
}, {} as UsedTypesRef)
));
export const astToUsedStyles = kashe((styles: string[], def: StyleDefinition) => {
const {lookup, ast} = def;
const fetches: Record> = {};
const visitedStyles = new Set();
styles.forEach(className => {
if (visitedStyles.has(className)) {
return;
}
visitedStyles.add(className);
const classes = className.split(' ');
classes.forEach(singleClass => {
const files = lookup[singleClass];
if (files) {
files.forEach(file => {
if (!fetches[file]) {
const {fetches, usage} = astToUsedStyles(styles, def);
return (
usage
.map(file => fromAst(Object.keys(fetches[file]), ast[file], filter))
.join('\n')
);
});
export const wrapInStyle = (styles: string) => (
styles
? `<style data-used-styles="true" type="text/css">${styles}</style>`
: ''
);
export const extractAllUnmatchable = kashe((def: StyleDefinition) => (
Object
.keys(def.ast || {})
.reduce((acc, file) => acc + extractUnmatchable(def.ast[file]), '')
));
export const criticalStylesToString = (str: string, def: StyleDefinition, filter?: (selector: string) => boolean): string => {
assertIsReady(def);
return astToStyles(getStylesInText(str), def, filter);
};
export const getCriticalRules = (str: string, def: StyleDefinition, filter?: (selector: string) => boolean): string => {
assertIsReady(def);
return extractAllUnmatchable(def) + astToStyles(getStylesInText(str), def, filter);
};
export const getCriticalStyles = (str: string, def: StyleDefinition, filter?: (selector: string) => boolean): string => {
import {kashe} from 'kashe';
import {StyleDefinition, UsedTypes, UsedTypesRef} from "./types";
import {extractUnmatchable, fromAst, getUnmatchableRules} from "./parser/fromAst";
import {assertIsReady, getStylesInText} from "./utils";
export const getUnusableStyles = kashe((def: StyleDefinition): UsedTypesRef => (
Object
.keys(def.ast || {})
.filter(key => getUnmatchableRules(def.ast[key]).length > 0)
.reduce((acc, file) => {
acc[file] = true;
return acc;
}, {} as UsedTypesRef)
));
export const astToUsedStyles = kashe((styles: string[], def: StyleDefinition) => {
const {lookup, ast} = def;
const fetches: Record> = {};
const visitedStyles = new Set();
styles.forEach(className => {
if (visitedStyles.has(className)) {
return;
const prefix: string[] = [];
const postfix: string[] = [];
media.forEach(media => {
prefix.push(`@media ${media} {`);
postfix.push('}');
});
return [
prefix.join(separator),
postfix.join(separator),
]
};
type SelectorLookUp = Set;
const renderRule = kashe((rule: StyleSelector, style: StyleBody) => (
`${rule.selector} { ${declsToString(style.rules)} }`
));
const isMatching = (rule: StyleSelector, rules: SelectorLookUp) => (
rule.pieces.length > 0 &&
rule.pieces.every(piece => rules.has(piece))
);
const findMatchingSelectors = (rules: SelectorLookUp, selectors: StyleSelector[]): StyleSelector[] => (
selectors.filter(rule => isMatching(rule, rules))
);
const findUnmatchableSelectors = (selectors: StyleSelector[]): StyleSelector[] => (
selectors.filter(rule => rule.pieces.length === 0)
);
}, {})
};
return Object.keys(
Object
.keys(def.ast)
.reduce((acc, file) => {
if (flags[file]) {
acc[file] = true
}
return acc;
}, {})
);
};
export const astToStyles = kashe((styles: string[], def: StyleDefinition, filter?: (selector: string) => boolean): string => {
const {ast} = def;
const {fetches, usage} = astToUsedStyles(styles, def);
return (
usage
.map(file => fromAst(Object.keys(fetches[file]), ast[file], filter))
.join('\n')
);
});
export const wrapInStyle = (styles: string) => (
styles
? `<style data-used-styles="true" type="text/css">${styles}</style>`
: ''
);