@alicloud/console-components/lib/utils/useCssVar.js

Alibaba Cloud React Components

"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.useCssVar = void 0;
var react_1 = require("react");
var config_provider_1 = __importDefault(require("../config-provider"));
var nextId = 0;
function useCssVar(cssVarName) {
    var _a = react_1.useState(''), v = _a[0], setV = _a[1];
    var refElement = config_provider_1.default.useRefElement();
    react_1.useLayoutEffect(function () {
        var _a;
        check();
        var checkArr = (window['__recheck_css_var'] = (_a = window['__recheck_css_var']) !== null && _a !== void 0 ? _a : []);
        while (checkArr[nextId]) {
            // 如果一个页面下有份此组件库（即有多个nextId指针），需要避免冲突
            nextId++;
        }
        var id = nextId++;
        checkArr[id] = check;
        return function () {
            delete checkArr[id];
        };
        function check() {
            var _a, _b;
            var val = (_b = (_a = window.getComputedStyle) === null || _a === void 0 ? void 0 : _a.call(window, refElement).getPropertyValue(cssVarName)) !== null && _b !== void 0 ? _b : '';
            setV(val);
        }
    }, [refElement, cssVarName]);
    return v;
}
exports.useCssVar = useCssVar;