@wordpress/style-engine/build-module/index.js

A suite of parsers and compilers for WordPress styles.

// packages/style-engine/src/index.ts
import { paramCase as kebabCase } from "change-case";
import { styleDefinitions } from "./styles";
import { getCSSValueFromRawStyle } from "./styles/utils";
function compileCSS(style, options = {}) {
  const rules = getCSSRules(style, options);
  if (!options?.selector) {
    const inlineRules = [];
    rules.forEach((rule) => {
      inlineRules.push(`${kebabCase(rule.key)}: ${rule.value};`);
    });
    return inlineRules.join(" ");
  }
  const groupedRules = rules.reduce(
    (acc, rule) => {
      const { selector } = rule;
      if (!selector) {
        return acc;
      }
      if (!acc[selector]) {
        acc[selector] = [];
      }
      acc[selector].push(rule);
      return acc;
    },
    {}
  );
  const selectorRules = Object.keys(groupedRules).reduce(
    (acc, subSelector) => {
      acc.push(
        `${subSelector} { ${groupedRules[subSelector].map(
          (rule) => `${kebabCase(rule.key)}: ${rule.value};`
        ).join(" ")} }`
      );
      return acc;
    },
    []
  );
  return selectorRules.join("\n");
}
function getCSSRules(style, options = {}) {
  const rules = [];
  styleDefinitions.forEach((definition) => {
    if (typeof definition.generate === "function") {
      rules.push(...definition.generate(style, options));
    }
  });
  return rules;
}
export {
  compileCSS,
  getCSSRules,
  getCSSValueFromRawStyle
};
//# sourceMappingURL=index.js.map