index.js 4.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141
  1. import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
  2. import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
  3. import _typeof from "@babel/runtime/helpers/esm/typeof";
  4. import hash from '@emotion/hash';
  5. import canUseDom from "rc-util/es/Dom/canUseDom";
  6. import { removeCSS, updateCSS } from "rc-util/es/Dom/dynamicCSS";
  7. import { ATTR_MARK, ATTR_TOKEN } from "../StyleContext";
  8. import { Theme } from "../theme";
  9. // Create a cache for memo concat
  10. var resultCache = new WeakMap();
  11. var RESULT_VALUE = {};
  12. export function memoResult(callback, deps) {
  13. var current = resultCache;
  14. for (var i = 0; i < deps.length; i += 1) {
  15. var dep = deps[i];
  16. if (!current.has(dep)) {
  17. current.set(dep, new WeakMap());
  18. }
  19. current = current.get(dep);
  20. }
  21. if (!current.has(RESULT_VALUE)) {
  22. current.set(RESULT_VALUE, callback());
  23. }
  24. return current.get(RESULT_VALUE);
  25. }
  26. // Create a cache here to avoid always loop generate
  27. var flattenTokenCache = new WeakMap();
  28. /**
  29. * Flatten token to string, this will auto cache the result when token not change
  30. */
  31. export function flattenToken(token) {
  32. var str = flattenTokenCache.get(token) || '';
  33. if (!str) {
  34. Object.keys(token).forEach(function (key) {
  35. var value = token[key];
  36. str += key;
  37. if (value instanceof Theme) {
  38. str += value.id;
  39. } else if (value && _typeof(value) === 'object') {
  40. str += flattenToken(value);
  41. } else {
  42. str += value;
  43. }
  44. });
  45. // https://github.com/ant-design/ant-design/issues/48386
  46. // Should hash the string to avoid style tag name too long
  47. str = hash(str);
  48. // Put in cache
  49. flattenTokenCache.set(token, str);
  50. }
  51. return str;
  52. }
  53. /**
  54. * Convert derivative token to key string
  55. */
  56. export function token2key(token, salt) {
  57. return hash("".concat(salt, "_").concat(flattenToken(token)));
  58. }
  59. var randomSelectorKey = "random-".concat(Date.now(), "-").concat(Math.random()).replace(/\./g, '');
  60. // Magic `content` for detect selector support
  61. var checkContent = '_bAmBoO_';
  62. function supportSelector(styleStr, handleElement, supportCheck) {
  63. if (canUseDom()) {
  64. var _getComputedStyle$con, _ele$parentNode;
  65. updateCSS(styleStr, randomSelectorKey);
  66. var _ele = document.createElement('div');
  67. _ele.style.position = 'fixed';
  68. _ele.style.left = '0';
  69. _ele.style.top = '0';
  70. handleElement === null || handleElement === void 0 || handleElement(_ele);
  71. document.body.appendChild(_ele);
  72. if (process.env.NODE_ENV !== 'production') {
  73. _ele.innerHTML = 'Test';
  74. _ele.style.zIndex = '9999999';
  75. }
  76. var support = supportCheck ? supportCheck(_ele) : (_getComputedStyle$con = getComputedStyle(_ele).content) === null || _getComputedStyle$con === void 0 ? void 0 : _getComputedStyle$con.includes(checkContent);
  77. (_ele$parentNode = _ele.parentNode) === null || _ele$parentNode === void 0 || _ele$parentNode.removeChild(_ele);
  78. removeCSS(randomSelectorKey);
  79. return support;
  80. }
  81. return false;
  82. }
  83. var canLayer = undefined;
  84. export function supportLayer() {
  85. if (canLayer === undefined) {
  86. canLayer = supportSelector("@layer ".concat(randomSelectorKey, " { .").concat(randomSelectorKey, " { content: \"").concat(checkContent, "\"!important; } }"), function (ele) {
  87. ele.className = randomSelectorKey;
  88. });
  89. }
  90. return canLayer;
  91. }
  92. var canWhere = undefined;
  93. export function supportWhere() {
  94. if (canWhere === undefined) {
  95. canWhere = supportSelector(":where(.".concat(randomSelectorKey, ") { content: \"").concat(checkContent, "\"!important; }"), function (ele) {
  96. ele.className = randomSelectorKey;
  97. });
  98. }
  99. return canWhere;
  100. }
  101. var canLogic = undefined;
  102. export function supportLogicProps() {
  103. if (canLogic === undefined) {
  104. canLogic = supportSelector(".".concat(randomSelectorKey, " { inset-block: 93px !important; }"), function (ele) {
  105. ele.className = randomSelectorKey;
  106. }, function (ele) {
  107. return getComputedStyle(ele).bottom === '93px';
  108. });
  109. }
  110. return canLogic;
  111. }
  112. export var isClientSide = canUseDom();
  113. export function unit(num) {
  114. if (typeof num === 'number') {
  115. return "".concat(num, "px");
  116. }
  117. return num;
  118. }
  119. export function toStyleStr(style, tokenKey, styleId) {
  120. var customizeAttrs = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {};
  121. var plain = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : false;
  122. if (plain) {
  123. return style;
  124. }
  125. var attrs = _objectSpread(_objectSpread({}, customizeAttrs), {}, _defineProperty(_defineProperty({}, ATTR_TOKEN, tokenKey), ATTR_MARK, styleId));
  126. var attrStr = Object.keys(attrs).map(function (attr) {
  127. var val = attrs[attr];
  128. return val ? "".concat(attr, "=\"").concat(val, "\"") : null;
  129. }).filter(function (v) {
  130. return v;
  131. }).join(' ');
  132. return "<style ".concat(attrStr, ">").concat(style, "</style>");
  133. }