"use strict";

// import variables from './variables'
// import * as theme from './theme'
const variables = require('./variables');

const theme = require('./theme');

const {
  extraBigOrLarger,
  desktopOrLarger,
  tabletOrLarger,
  desktopOrSmaller,
  tabletOrSmaller,
  phoneOrSmaller,
  phoneOrLarger,
  rem,
  vw,
  container,
  dynamicHeight,
  font,
  qa
} = theme;
const SHOULD_PRETTIFY = process.env.NODE_ENV === 'development';
const matchPhoneOrSmaller = /@phone-or-smaller\(\)/gm;
const matchPhoneOrLarger = /@phone-or-larger\(\)/gm;
const matchTabletOrSmaller = /@tablet-or-smaller\(\)/gm;
const matchDesktopOrSmaller = /@desktop-or-smaller\(\)/gm;
const matchTabletOrLarger = /@tablet-or-larger\(\)/gm;
const matchDesktopOrLarger = /@desktop-or-larger\(\)/gm;
const matchBigOrLarger = /@big-or-larger\(\)/gm;
const matchExtraBigeOrLarger = /@extrabig-or-larger\(\)/gm;
const matchContainer = /@container\(\)/gm;
const matchREM = /rem\((-?\d+(\.\d+)?)\)/gm;
const matchVW = /vw\((-?\d+(\.\d+)?)\)/gm;
const matchDynamicHeight = /@dynamic-height\(\)/gm;
const matchFont = /@font(?:\s)?\((\d*|\w*),? *?(\d*|\w*)\)/gm;
const matchQualityAssurance = /@qa\.?#?(\d|\w|-)*;/gm;
const replacements = [[matchQualityAssurance, qa], [matchPhoneOrSmaller, phoneOrSmaller], [matchPhoneOrLarger, phoneOrLarger], [matchTabletOrSmaller, tabletOrSmaller], [matchDesktopOrSmaller, desktopOrSmaller], [matchTabletOrLarger, tabletOrLarger], [matchDesktopOrLarger, desktopOrLarger], [matchExtraBigeOrLarger, extraBigOrLarger], [matchREM, rem], [matchVW, vw], [matchContainer, container], [matchDynamicHeight, dynamicHeight], [matchFont, font]];
const variableKeyList = Object.keys(variables);
console.log(variableKeyList);
const map = new Map();

function transpileStyles(styleString) {
  // cache
  if (map.has(styleString)) {
    return map.get(styleString);
  }

  let css = styleString; // styles = styles.replace(matchPhoneOrSmaller, phoneOrSmaller())

  replacements.forEach(replacement => {
    const [match, mixinFunction] = replacement;
    css = css.replace(match, mixinFunction);
  });
  /**
   * @todo @james @fixme @invalid @logic (bad regexp replacement typo in escape here)
   */

  const horribleRenderReplaceHack = name => {
    const value = variables[name]; // const match = new RegExp('\$' + escape(name) + ';', 'gmi')
    // const match = new RegExp('\\$' + escape(name) + '$;', 'gmi')

    const asVar = '$' + name; // console.log({ asVar })

    let iterations = 0;

    while (css.includes(asVar) && iterations < 30) {
      iterations += 1;
      css = css.replace(asVar, value);
    } // console.log(match, css, match.test(css))
    // css = css.replace(match, value)

  };

  variableKeyList.forEach(horribleRenderReplaceHack); // console.log({ css })
  // css = styleh(' \n', css)
  // console.log({ css })
  // if (SHOULD_PRETTIFY) css = prettify(css)
  // console.log({ css })

  map.set(styleString, css);
  return css;
}

module.exports = transpileStyles; // export default transpileStyles