insert-css.js 1.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657
  1. // https://github.com/substack/insert-css
  2. var containers = []; // will store container HTMLElement references
  3. var styleElements = []; // will store {prepend: HTMLElement, append: HTMLElement}
  4. var usage = 'insert-css: You need to provide a CSS string. Usage: insertCss(cssString[, options]).';
  5. function createStyleElement() {
  6. var styleElement = document.createElement('style');
  7. styleElement.setAttribute('type', 'text/css');
  8. return styleElement;
  9. } // eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types
  10. function insertCss(css, options) {
  11. options = options || {};
  12. if (css === undefined) {
  13. throw new Error(usage);
  14. }
  15. var position = options.prepend === true ? 'prepend' : 'append';
  16. var container = options.container !== undefined ? options.container : document.querySelector('head');
  17. var containerId = containers.indexOf(container); // first time we see this container, create the necessary entries
  18. if (containerId === -1) {
  19. containerId = containers.push(container) - 1;
  20. styleElements[containerId] = {};
  21. } // try to get the correponding container + position styleElement, create it otherwise
  22. var styleElement;
  23. if (styleElements[containerId] !== undefined && styleElements[containerId][position] !== undefined) {
  24. styleElement = styleElements[containerId][position];
  25. } else {
  26. styleElement = styleElements[containerId][position] = createStyleElement();
  27. var referenceNode = position === 'prepend' ? container.childNodes[0] || null : null;
  28. container.insertBefore(styleElement, referenceNode);
  29. } // strip potential UTF-8 BOM if css was read from a file
  30. if (css.charCodeAt(0) === 0xfeff) {
  31. css = css.substr(1, css.length);
  32. } // actually add the stylesheet
  33. if (styleElement.styleSheet) {
  34. styleElement.styleSheet.cssText += css;
  35. } else {
  36. styleElement.textContent += css;
  37. }
  38. return styleElement;
  39. }
  40. export default insertCss;