@nutui/nutui-react
Version:
京东风格的轻量级移动端 React 组件库，支持一套代码生成 H5 和小程序
78 lines (77 loc) • 2.77 kB
JavaScript
import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
import { _ as _object_spread_props } from "@swc/helpers/_/_object_spread_props";
import { _ as _object_without_properties } from "@swc/helpers/_/_object_without_properties";
import React, { createContext, useContext } from "react";
import classNames from "classnames";
import kebabCase from "lodash.kebabcase";
import isEqual from "react-fast-compare";
import { useMemo } from "../../hooks/use-memo";
import zhCN from "../../locales/zh-CN";
import { inBrowser } from "../../utils";
var classPrefix = 'nut-configprovider';
export var defaultConfigRef = {
current: {
locale: zhCN
}
};
export var setDefaultConfig = function(config) {
defaultConfigRef.current = config;
};
export var getDefaultConfig = function() {
return defaultConfigRef.current;
};
var ConfigContext = /*#__PURE__*/ createContext(null);
export var useConfig = function() {
var _useContext;
return (_useContext = useContext(ConfigContext)) !== null && _useContext !== void 0 ? _useContext : getDefaultConfig();
};
function convertThemeVarsToCSSVars(themeVars) {
var cssVars = {};
Object.keys(themeVars).forEach(function(key) {
cssVars["--".concat(kebabCase(key))] = themeVars[key];
});
return cssVars;
}
export var useRtl = function() {
var direction = useConfig().direction;
if (direction) {
return direction === 'rtl';
}
return inBrowser && document.dir === 'rtl';
};
export var ConfigProvider = function(props) {
var style = props.style, className = props.className, children = props.children, direction = props.direction, config = _object_without_properties(props, [
"style",
"className",
"children",
"direction"
]);
var mergedConfig = useMemo(function() {
return _object_spread_props(_object_spread({}, getDefaultConfig(), config), {
direction: direction
});
}, [
config,
direction
], function(prev, next) {
return prev.some(function(prevTheme, index) {
var nextTheme = next[index];
return !isEqual(prevTheme, nextTheme);
});
});
var cssVarStyle = React.useMemo(function() {
return convertThemeVarsToCSSVars(mergedConfig.theme || {});
}, [
mergedConfig.theme
]);
return /*#__PURE__*/ React.createElement(ConfigContext.Provider, {
value: mergedConfig
}, /*#__PURE__*/ React.createElement("div", {
className: classNames(classPrefix, className),
style: _object_spread_props(_object_spread({}, cssVarStyle, style), {
direction: direction
}),
dir: direction
}, children));
};
ConfigProvider.displayName = 'NutConfigProvider';