common.cjs 2.8 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394
  1. 'use strict';
  2. const svg_html = require('../svg/html.cjs');
  3. const svg_size = require('../svg/size.cjs');
  4. const svg_url = require('../svg/url.cjs');
  5. const icon_square = require('../icon/square.cjs');
  6. const svg_build = require('../svg/build.cjs');
  7. require('../icon/defaults.cjs');
  8. require('../customisations/defaults.cjs');
  9. require('../svg/defs.cjs');
  10. function getCommonCSSRules(options) {
  11. const result = {
  12. display: "inline-block",
  13. width: "1em",
  14. height: "1em"
  15. };
  16. const varName = options.varName;
  17. if (options.pseudoSelector) {
  18. result["content"] = "''";
  19. }
  20. switch (options.mode) {
  21. case "background":
  22. if (varName) {
  23. result["background-image"] = "var(--" + varName + ")";
  24. }
  25. result["background-repeat"] = "no-repeat";
  26. result["background-size"] = "100% 100%";
  27. break;
  28. case "mask":
  29. result["background-color"] = "currentColor";
  30. if (varName) {
  31. result["mask-image"] = result["-webkit-mask-image"] = "var(--" + varName + ")";
  32. }
  33. result["mask-repeat"] = result["-webkit-mask-repeat"] = "no-repeat";
  34. result["mask-size"] = result["-webkit-mask-size"] = "100% 100%";
  35. break;
  36. }
  37. return result;
  38. }
  39. function generateItemCSSRules(icon, options) {
  40. const result = {};
  41. const varName = options.varName;
  42. const buildResult = svg_build.iconToSVG(icon);
  43. let viewBox = buildResult.viewBox;
  44. if (viewBox[2] !== viewBox[3]) {
  45. if (options.forceSquare) {
  46. viewBox = icon_square.makeViewBoxSquare(viewBox);
  47. } else {
  48. result["width"] = svg_size.calculateSize("1em", viewBox[2] / viewBox[3]);
  49. }
  50. }
  51. const svg = svg_html.iconToHTML(
  52. buildResult.body.replace(/currentColor/g, options.color || "black"),
  53. {
  54. viewBox: `${viewBox[0]} ${viewBox[1]} ${viewBox[2]} ${viewBox[3]}`,
  55. width: `${viewBox[2]}`,
  56. height: `${viewBox[3]}`
  57. }
  58. );
  59. const url = svg_url.svgToURL(svg);
  60. if (varName) {
  61. result["--" + varName] = url;
  62. } else {
  63. switch (options.mode) {
  64. case "background":
  65. result["background-image"] = url;
  66. break;
  67. case "mask":
  68. result["mask-image"] = result["-webkit-mask-image"] = url;
  69. break;
  70. }
  71. }
  72. return result;
  73. }
  74. function generateItemContent(icon, options) {
  75. const buildResult = svg_build.iconToSVG(icon);
  76. const viewBox = buildResult.viewBox;
  77. const height = options.height;
  78. const width = options.width ?? svg_size.calculateSize(height, viewBox[2] / viewBox[3]);
  79. const svg = svg_html.iconToHTML(
  80. buildResult.body.replace(/currentColor/g, options.color || "black"),
  81. {
  82. viewBox: `${viewBox[0]} ${viewBox[1]} ${viewBox[2]} ${viewBox[3]}`,
  83. width: width.toString(),
  84. height: height.toString()
  85. }
  86. );
  87. return svg_url.svgToURL(svg);
  88. }
  89. exports.generateItemCSSRules = generateItemCSSRules;
  90. exports.generateItemContent = generateItemContent;
  91. exports.getCommonCSSRules = getCommonCSSRules;