@dash-ui/styles/server/dist/esm/index.dev.mjs

A tiny, powerful, framework-agnostic CSS-in-JS library.

function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {
  try {
    var info = gen[key](arg);
    var value = info.value;
  } catch (error) {
    reject(error);
    return;
  }

  if (info.done) {
    resolve(value);
  } else {
    Promise.resolve(value).then(_next, _throw);
  }
}

function _asyncToGenerator(fn) {
  return function () {
    var self = this,
        args = arguments;
    return new Promise(function (resolve, reject) {
      var gen = fn.apply(self, args);

      function _next(value) {
        asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value);
      }

      function _throw(err) {
        asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err);
      }

      _next(undefined);
    });
  };
}

/* eslint-disable @typescript-eslint/no-var-requires */

/**
 * Creates a string of CSS based on the dash `inserted` cache. This
 * is an extremely fast way to generate a CSS string. It returns an
 * object containing the hash names of all of the styles used as well
 * as the CSS string.
 *
 * Note that this function is unsafe in asynchronous render environments
 * because multiple pages using the same cache will dirty the results.
 * This means it will not work with Gatsby, for example.
 *
 * @param styles - A `styles()` instance
 * @param options - Configuration options
 */
function createStylesFromCache(styles, options) {
  if (styles === void 0) {
    styles = require("@dash-ui/styles").styles;
  }

  if (options === void 0) {
    options = {};
  }

  var {
    clearCache = false
  } = options;
  var {
    dash
  } = styles;
  var styleCache = dash.cache;
  var names = new Set([...dash.sheets.keys(), ...dash.inserted.values()]);
  var css = "";

  for (var name of names) {
    css += styleCache.get(name);
  }

  if (clearCache) dash.inserted.clear();
  return {
    names: [...names],
    css
  };
}
/**
 * Creates a `<style>` tag w/ CSS based on the dash `inserted` cache. This
 * is an extremely fast way to generate a `<style>` tag.
 *
 * Note that this function is unsafe in asynchronous render environments
 * because multiple pages using the same cache will dirty the results.
 * This means it will not work with Gatsby, for example.
 *
 * @param styles - A `styles()` instance
 * @param options - Configuration options
 */

function createStyleTagFromCache(styles, options) {
  if (styles === void 0) {
    styles = require("@dash-ui/styles").styles;
  }

  if (options === void 0) {
    options = {};
  }

  var {
    css,
    names
  } = createStylesFromCache(styles, options);
  var nonceString = styles.dash.sheet.nonce ? " nonce=\"" + styles.dash.sheet.nonce + "\"" : "";
  return "<style data-dash=\"" + names.join(" ") + "\" data-cache=\"" + styles.dash.key + "\"" + nonceString + ">" + css + "</style>";
}
/**
 * Writes a CSS to a file based on the dash `inserted` cache. This
 * is an extremely fast way to generate a CSS file.
 *
 * Note that this function is unsafe in asynchronous render environments
 * because multiple pages using the same cache will dirty the results.
 * This means it will not work with Gatsby, for example.
 *
 * @param outputPath - An absolute or relative path dictating where you want to
 *  output the CSS file.
 * @param styles - A `styles()` instance
 * @param options - Configuration options
 */

function writeStylesFromCache(_x, _x2, _x3) {
  return _writeStylesFromCache.apply(this, arguments);
}
/**
 * Creates a string of CSS based on an HTML string. This function will
 * parse your HTML output for Dash class names and pull the styles associated
 * with them from the Dash cache. It returns an object containing the hash names
 * of all of the styles used as well as the CSS string.
 *
 * This is a safe way to generate style strings in an asynchronous environment
 *
 * @param html - An HTML string
 * @param styles - A `styles()` instance
 */

function* _ref(outputPath, styles, options) {
  if (outputPath === void 0) {
    outputPath = "";
  }

  if (styles === void 0) {
    styles = require("@dash-ui/styles").styles;
  }

  // Requiring in here prevents webpack errors in stuff like Next.js apps
  var fs = require("fs");

  var path = require("path");

  var {
    name,
    hash = styles.hash,
    clearCache = false
  } = options || {};
  var {
    css,
    names
  } = createStylesFromCache(styles, {
    clearCache
  });
  name = "" + (name || styles.dash.key + "-" + hash(css) + ".css");
  var filename = path.join(outputPath, name);
  yield fs.promises.writeFile(filename, css);
  return {
    filename,
    name,
    path: outputPath,
    css,
    names
  };
}

function _writeStylesFromCache() {
  _writeStylesFromCache = _asyncToGenerator(_ref);
  return _writeStylesFromCache.apply(this, arguments);
}

function createStylesFromString(html, styles) {
  if (styles === void 0) {
    styles = require("@dash-ui/styles").styles;
  }

  var {
    dash
  } = styles;
  var styleCache = dash.cache;
  var names = new Set(dash.sheets.keys());
  var css = "";

  for (var name of names) {
    css += styleCache.get(name);
  }

  var re = new RegExp("[\"\\s'=]" + dash.key + "-(\\w+)", "g");

  for (var [, _name] of html.matchAll(re)) {
    if (!names.has(_name)) {
      css += styleCache.get(_name) || "";
      names.add(_name);
    }
  }

  return {
    names: [...names],
    css
  };
}
/**
 * Creates a `<style>` tag w/ CSS based on an HTML string. This function will
 * parse your HTML output for Dash class names and pull the styles associated
 * with them from the Dash cache.
 *
 * This is a safe way to generate `<style>` tags in an asynchronous environment.
 *
 * @param html - An HTML string
 * @param styles - A `styles()` instance
 */

function createStyleTagFromString(html, styles) {
  if (styles === void 0) {
    styles = require("@dash-ui/styles").styles;
  }

  var {
    css,
    names
  } = createStylesFromString(html, styles);
  var nonceString = styles.dash.sheet.nonce ? " nonce=\"" + styles.dash.sheet.nonce + "\"" : "";
  return "<style data-dash=\"" + names.join(" ") + "\" data-cache=\"" + styles.dash.key + "\"" + nonceString + ">" + css + "</style>";
}
/**
 * Writes a CSS to a file based on an HTML string. This function will
 * parse your HTML output for Dash class names and pull the styles associated
 * with them from the Dash cache.
 *
 * This is a safe way to generate `<style>` tags in an asynchronous environment.
 *
 * @param html
 * @param styles - A `styles()` instance
 * @param outputPath - An absolute or relative path dictating where you want to
 *  output the CSS file.
 * @param options - Configuration options
 */

function writeStylesFromString(_x4, _x5, _x6, _x7) {
  return _writeStylesFromString.apply(this, arguments);
}

function* _ref2(html, outputPath, styles, options) {
  if (outputPath === void 0) {
    outputPath = "";
  }

  if (styles === void 0) {
    styles = require("@dash-ui/styles").styles;
  }

  // Requiring in here prevents webpack errors in stuff like Next.js apps
  var fs = require("fs");

  var path = require("path");

  var {
    name,
    hash = styles.hash
  } = options || {};
  var {
    css,
    names
  } = createStylesFromString(html, styles);
  name = "" + (name || styles.dash.key + "-" + hash(css) + ".css");
  var filename = path.join(outputPath, name);
  yield fs.promises.writeFile(filename, css);
  return {
    filename,
    name,
    path: outputPath,
    css,
    names
  };
}

function _writeStylesFromString() {
  _writeStylesFromString = _asyncToGenerator(_ref2);
  return _writeStylesFromString.apply(this, arguments);
}

export { createStyleTagFromCache, createStyleTagFromString, createStylesFromCache, createStylesFromString, writeStylesFromCache, writeStylesFromString };
//# sourceMappingURL=index.dev.mjs.map