index.js 5.5 KB

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