@activecollab/components

Version:
ActiveCollab Components
47 lines (45 loc) • 1.92 kB
JavaScript
"use strict";

var _fs = require("fs");
var _path = require("path");
var _themes = require("./themes");
var GLOBAL_STYLE = (0, _fs.readFileSync)((0, _path.join)(__dirname, "../components/GlobalStyle.ts"), "utf-8");
var SWATCH_VARS = ["color-secondary", "color-primary", "body-bg-main"];
var collectBlocks = function collectBlocks(selector) {
  var re = new RegExp("".concat(selector, "\\s*\\{([^}]*)\\}"), "g");
  var declarations = "";
  var match;
  while (match = re.exec(GLOBAL_STYLE)) declarations += "".concat(match[1], ";");
  return declarations;
};
var readVar = function readVar(block, name) {
  var _block$match;
  return (_block$match = block.match(new RegExp("--".concat(name, "\\s*:\\s*([^;}]+)")))) === null || _block$match === void 0 ? void 0 : _block$match[1].trim();
};
var toHex = function toHex(value) {
  var rgb = value.match(/rgb\(\s*(\d+)[,\s]+(\d+)[,\s]+(\d+)\s*\)/);
  if (!rgb) return value.toLowerCase();
  return "#".concat(rgb.slice(1).map(function (channel) {
    return Number(channel).toString(16).padStart(2, "0");
  }).join(""));
};

// indigo has no class block of its own — it is the :root default every other theme overrides.
var declarationsFor = function declarationsFor(name) {
  return (name === "indigo" ? "" : collectBlocks("\\.".concat(name))) + collectBlocks(":root");
};
describe("theme swatches", function () {
  it("should match the colours GlobalStyle defines for each theme", function () {
    var fromStylesheet = _themes.THEMES.map(function (_ref) {
      var name = _ref.name;
      var block = declarationsFor(name);
      return [name, SWATCH_VARS.map(function (cssVar) {
        return toHex(readVar(block, cssVar));
      })];
    });
    expect(fromStylesheet).toEqual(_themes.THEMES.map(function (_ref2) {
      var name = _ref2.name,
        swatch = _ref2.swatch;
      return [name, swatch];
    }));
  });
});
//# sourceMappingURL=themes.swatch.test.js.map