99 lines
3.5 KiB
JavaScript
99 lines
3.5 KiB
JavaScript
|
"use strict";
|
||
|
|
|
||
|
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
||
|
|
Object.defineProperty(exports, "__esModule", {
|
||
|
|
value: true
|
||
|
|
});
|
||
|
|
exports.flattenToken = flattenToken;
|
||
|
|
exports.supportLayer = supportLayer;
|
||
|
|
exports.supportLogicProps = supportLogicProps;
|
||
|
|
exports.supportWhere = supportWhere;
|
||
|
|
exports.token2key = token2key;
|
||
|
|
var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
|
||
|
|
var _hash = _interopRequireDefault(require("@emotion/hash"));
|
||
|
|
var _canUseDom = _interopRequireDefault(require("rc-util/lib/Dom/canUseDom"));
|
||
|
|
var _dynamicCSS = require("rc-util/lib/Dom/dynamicCSS");
|
||
|
|
var _theme = require("./theme");
|
||
|
|
// Create a cache here to avoid always loop generate
|
||
|
|
var flattenTokenCache = new WeakMap();
|
||
|
|
function flattenToken(token) {
|
||
|
|
var str = flattenTokenCache.get(token) || '';
|
||
|
|
if (!str) {
|
||
|
|
Object.keys(token).forEach(function (key) {
|
||
|
|
var value = token[key];
|
||
|
|
str += key;
|
||
|
|
if (value instanceof _theme.Theme) {
|
||
|
|
str += value.id;
|
||
|
|
} else if (value && (0, _typeof2.default)(value) === 'object') {
|
||
|
|
str += flattenToken(value);
|
||
|
|
} else {
|
||
|
|
str += value;
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
// Put in cache
|
||
|
|
flattenTokenCache.set(token, str);
|
||
|
|
}
|
||
|
|
return str;
|
||
|
|
}
|
||
|
|
|
||
|
|
/**
|
||
|
|
* Convert derivative token to key string
|
||
|
|
*/
|
||
|
|
function token2key(token, salt) {
|
||
|
|
return (0, _hash.default)("".concat(salt, "_").concat(flattenToken(token)));
|
||
|
|
}
|
||
|
|
var randomSelectorKey = "random-".concat(Date.now(), "-").concat(Math.random()).replace(/\./g, '');
|
||
|
|
|
||
|
|
// Magic `content` for detect selector support
|
||
|
|
var checkContent = '_bAmBoO_';
|
||
|
|
function supportSelector(styleStr, handleElement, supportCheck) {
|
||
|
|
if ((0, _canUseDom.default)()) {
|
||
|
|
var _getComputedStyle$con, _ele$parentNode;
|
||
|
|
(0, _dynamicCSS.updateCSS)(styleStr, randomSelectorKey);
|
||
|
|
var _ele = document.createElement('div');
|
||
|
|
_ele.style.position = 'fixed';
|
||
|
|
_ele.style.left = '0';
|
||
|
|
_ele.style.top = '0';
|
||
|
|
handleElement === null || handleElement === void 0 ? void 0 : handleElement(_ele);
|
||
|
|
document.body.appendChild(_ele);
|
||
|
|
if (process.env.NODE_ENV !== 'production') {
|
||
|
|
_ele.innerHTML = 'Test';
|
||
|
|
_ele.style.zIndex = '9999999';
|
||
|
|
}
|
||
|
|
var support = supportCheck ? supportCheck(_ele) : (_getComputedStyle$con = getComputedStyle(_ele).content) === null || _getComputedStyle$con === void 0 ? void 0 : _getComputedStyle$con.includes(checkContent);
|
||
|
|
(_ele$parentNode = _ele.parentNode) === null || _ele$parentNode === void 0 ? void 0 : _ele$parentNode.removeChild(_ele);
|
||
|
|
(0, _dynamicCSS.removeCSS)(randomSelectorKey);
|
||
|
|
return support;
|
||
|
|
}
|
||
|
|
return false;
|
||
|
|
}
|
||
|
|
var canLayer = undefined;
|
||
|
|
function supportLayer() {
|
||
|
|
if (canLayer === undefined) {
|
||
|
|
canLayer = supportSelector("@layer ".concat(randomSelectorKey, " { .").concat(randomSelectorKey, " { content: \"").concat(checkContent, "\"!important; } }"), function (ele) {
|
||
|
|
ele.className = randomSelectorKey;
|
||
|
|
});
|
||
|
|
}
|
||
|
|
return canLayer;
|
||
|
|
}
|
||
|
|
var canWhere = undefined;
|
||
|
|
function supportWhere() {
|
||
|
|
if (canWhere === undefined) {
|
||
|
|
canWhere = supportSelector(":where(.".concat(randomSelectorKey, ") { content: \"").concat(checkContent, "\"!important; }"), function (ele) {
|
||
|
|
ele.className = randomSelectorKey;
|
||
|
|
});
|
||
|
|
}
|
||
|
|
return canWhere;
|
||
|
|
}
|
||
|
|
var canLogic = undefined;
|
||
|
|
function supportLogicProps() {
|
||
|
|
if (canLogic === undefined) {
|
||
|
|
canLogic = supportSelector(".".concat(randomSelectorKey, " { inset-block: 93px !important; }"), function (ele) {
|
||
|
|
ele.className = randomSelectorKey;
|
||
|
|
}, function (ele) {
|
||
|
|
return getComputedStyle(ele).bottom === '93px';
|
||
|
|
});
|
||
|
|
}
|
||
|
|
return canLogic;
|
||
|
|
}
|