@rys-fe_vite-plugin-theme_es_client.js 5.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181
  1. import "./chunk-2LSFTFF7.js";
  2. // node_modules/.pnpm/@rys-fe+vite-plugin-theme@0.8.6_vite@4.5.3/node_modules/@rys-fe/vite-plugin-theme/es/client.js
  3. var globalField = "__VITE_THEME__";
  4. var styleTagId = "__VITE_PLUGIN_THEME__";
  5. var darkStyleTagId = "__VITE_PLUGIN_DARK_THEME__";
  6. var linkID = "__VITE_PLUGIN_THEME-ANTD_DARK_THEME_LINK__";
  7. var colorPluginOutputFileName = __COLOR_PLUGIN_OUTPUT_FILE_NAME__;
  8. var isProd = __PROD__;
  9. var colorPluginOptions = __COLOR_PLUGIN_OPTIONS__;
  10. var injectTo = colorPluginOptions.injectTo;
  11. var debounceThemeRender = debounce(200, renderTheme);
  12. var darkCssIsReady = false;
  13. (() => {
  14. if (!window[globalField]) {
  15. window[globalField] = {
  16. styleIdMap: /* @__PURE__ */ new Map(),
  17. styleRenderQueueMap: /* @__PURE__ */ new Map()
  18. };
  19. }
  20. setGlobalOptions("replaceStyleVariables", replaceStyleVariables);
  21. if (!getGlobalOptions("defaultOptions")) {
  22. setGlobalOptions("defaultOptions", colorPluginOptions);
  23. }
  24. })();
  25. function addCssToQueue(id, styleString) {
  26. const styleIdMap = getGlobalOptions("styleIdMap");
  27. if (!styleIdMap.get(id)) {
  28. window[globalField].styleRenderQueueMap.set(id, styleString);
  29. debounceThemeRender();
  30. }
  31. }
  32. function renderTheme() {
  33. const variables = getGlobalOptions("colorVariables");
  34. if (!variables) {
  35. return;
  36. }
  37. const styleRenderQueueMap = getGlobalOptions("styleRenderQueueMap");
  38. const styleDom = getStyleDom(styleTagId);
  39. let html = styleDom.innerHTML;
  40. for (const [id, css] of styleRenderQueueMap.entries()) {
  41. html += css;
  42. window[globalField].styleRenderQueueMap.delete(id);
  43. window[globalField].styleIdMap.set(id, css);
  44. }
  45. replaceCssColors(html, variables).then((processCss) => {
  46. appendCssToDom(styleDom, processCss, injectTo);
  47. });
  48. }
  49. async function replaceStyleVariables({ colorVariables, customCssHandler }) {
  50. setGlobalOptions("colorVariables", colorVariables);
  51. const styleIdMap = getGlobalOptions("styleIdMap");
  52. const styleRenderQueueMap = getGlobalOptions("styleRenderQueueMap");
  53. if (!isProd) {
  54. for (const [id, css] of styleIdMap.entries()) {
  55. styleRenderQueueMap.set(id, css);
  56. }
  57. renderTheme();
  58. } else {
  59. try {
  60. const cssText = await fetchCss(colorPluginOutputFileName);
  61. const styleDom = getStyleDom(styleTagId);
  62. const processCss = await replaceCssColors(cssText, colorVariables, customCssHandler);
  63. appendCssToDom(styleDom, processCss, injectTo);
  64. } catch (error) {
  65. throw new Error(error);
  66. }
  67. }
  68. }
  69. async function loadDarkThemeCss() {
  70. const extractCss = __ANTD_DARK_PLUGIN_EXTRACT_CSS__;
  71. const isLoadLink = __ANTD_DARK_PLUGIN_LOAD_LINK__;
  72. if (darkCssIsReady || !extractCss) {
  73. return;
  74. }
  75. if (isLoadLink) {
  76. const linkTag = document.getElementById(linkID);
  77. if (linkTag) {
  78. linkTag.removeAttribute("disabled");
  79. linkTag.setAttribute("rel", "stylesheet");
  80. }
  81. } else {
  82. const colorPluginOutputFileName2 = __ANTD_DARK_PLUGIN_OUTPUT_FILE_NAME__;
  83. const cssText = await fetchCss(colorPluginOutputFileName2);
  84. const styleDom = getStyleDom(darkStyleTagId);
  85. appendCssToDom(styleDom, cssText, injectTo);
  86. }
  87. darkCssIsReady = true;
  88. }
  89. async function replaceCssColors(css, colors, customCssHandler) {
  90. let retCss = css;
  91. const defaultOptions = getGlobalOptions("defaultOptions");
  92. const colorVariables = defaultOptions ? defaultOptions.colorVariables || [] : [];
  93. colorVariables.forEach(function(color, index) {
  94. const reg = new RegExp(color.replace(/,/g, ",\\s*").replace(/\s/g, "").replace("(", `\\(`).replace(")", `\\)`) + "([\\da-f]{2})?(\\b|\\)|,|\\s)?", "ig");
  95. retCss = retCss.replace(reg, colors[index] + "$1$2").replace("$1$2", "");
  96. if (customCssHandler && typeof customCssHandler === "function") {
  97. retCss = customCssHandler(retCss) || retCss;
  98. }
  99. });
  100. return retCss;
  101. }
  102. function setGlobalOptions(key, value) {
  103. window[globalField][key] = value;
  104. }
  105. function getGlobalOptions(key) {
  106. return window[globalField][key];
  107. }
  108. function getStyleDom(id) {
  109. let style = document.getElementById(id);
  110. if (!style) {
  111. style = document.createElement("style");
  112. style.setAttribute("id", id);
  113. }
  114. return style;
  115. }
  116. async function appendCssToDom(styleDom, cssText, appendTo = "body") {
  117. styleDom.innerHTML = cssText;
  118. if (appendTo === "head") {
  119. document.head.appendChild(styleDom);
  120. } else if (appendTo === "body") {
  121. document.body.appendChild(styleDom);
  122. } else if (appendTo === "body-prepend") {
  123. const firstChildren = document.body.firstChild;
  124. document.body.insertBefore(styleDom, firstChildren);
  125. }
  126. }
  127. function fetchCss(fileName) {
  128. return new Promise((resolve, reject) => {
  129. const append = getGlobalOptions("appended");
  130. if (append) {
  131. setGlobalOptions("appended", false);
  132. resolve("");
  133. return;
  134. }
  135. const xhr = new XMLHttpRequest();
  136. xhr.onload = function() {
  137. if (xhr.readyState === 4) {
  138. if (xhr.status === 200) {
  139. resolve(xhr.responseText);
  140. } else {
  141. reject(xhr.status);
  142. }
  143. }
  144. };
  145. xhr.onerror = function(e) {
  146. reject(e);
  147. };
  148. xhr.ontimeout = function(e) {
  149. reject(e);
  150. };
  151. xhr.open("GET", fileName, true);
  152. xhr.send();
  153. });
  154. }
  155. function debounce(delay, fn) {
  156. let timer;
  157. return function(...args) {
  158. const ctx = this;
  159. clearTimeout(timer);
  160. timer = setTimeout(function() {
  161. fn.apply(ctx, args);
  162. }, delay);
  163. };
  164. }
  165. export {
  166. addCssToQueue,
  167. appendCssToDom,
  168. darkCssIsReady,
  169. darkStyleTagId,
  170. getGlobalOptions,
  171. getStyleDom,
  172. globalField,
  173. linkID,
  174. loadDarkThemeCss,
  175. replaceCssColors,
  176. replaceStyleVariables,
  177. setGlobalOptions,
  178. styleTagId
  179. };
  180. //# sourceMappingURL=@rys-fe_vite-plugin-theme_es_client.js.map