@lobehub/ui 1.96.0 → 1.96.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/es/ColorScales/index.d.ts +1 -1
- package/es/FontLoader/index.js +5 -2
- package/es/Giscus/style.js +1 -1
- package/es/Highlighter/theme.js +1 -1
- package/es/ThemeProvider/GlobalStyle/antdOverride.js +2 -1
- package/es/ThemeProvider/index.d.ts +8 -23
- package/es/ThemeProvider/index.js +22 -10
- package/es/styles/{algorithms → colors}/generateColorPalette.d.ts +1 -1
- package/es/styles/customTheme.js +2 -2
- package/es/styles/index.d.ts +6 -8
- package/es/styles/index.js +6 -8
- package/es/styles/theme/algorithms/darkAlgorithm.d.ts +2 -0
- package/es/styles/theme/algorithms/darkAlgorithm.js +32 -0
- package/es/styles/theme/algorithms/lightAlgorithm.d.ts +2 -0
- package/es/styles/{algorithms/generateCustomTheme.js → theme/algorithms/lightAlgorithm.js} +15 -17
- package/es/styles/theme/antdTheme.d.ts +15 -0
- package/es/styles/{algorithms/generateTheme.js → theme/antdTheme.js} +22 -16
- package/es/styles/{algorithms/generateCustomToken.js → theme/customToken.js} +1 -3
- package/es/styles/theme/{dark.js → token/dark.js} +3 -4
- package/es/styles/theme/{light.js → token/light.js} +3 -4
- package/package.json +1 -1
- package/es/styles/algorithms/generateCustomTheme.d.ts +0 -9
- package/es/styles/algorithms/generateTheme.d.ts +0 -5
- /package/es/styles/{colors.d.ts → colors/colors.d.ts} +0 -0
- /package/es/styles/{colors.js → colors/colors.js} +0 -0
- /package/es/styles/{algorithms → colors}/generateColorPalette.js +0 -0
- /package/es/styles/{neutralColors.d.ts → colors/neutralColors.d.ts} +0 -0
- /package/es/styles/{neutralColors.js → colors/neutralColors.js} +0 -0
- /package/es/styles/{algorithms/generateCustomStylish.d.ts → theme/customStylish.d.ts} +0 -0
- /package/es/styles/{algorithms/generateCustomStylish.js → theme/customStylish.js} +0 -0
- /package/es/styles/{algorithms/generateCustomToken.d.ts → theme/customToken.d.ts} +0 -0
- /package/es/styles/theme/{base.d.ts → token/base.d.ts} +0 -0
- /package/es/styles/theme/{base.js → token/base.js} +0 -0
- /package/es/styles/theme/{dark.d.ts → token/dark.d.ts} +0 -0
- /package/es/styles/theme/{light.d.ts → token/light.d.ts} +0 -0
package/es/FontLoader/index.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { memo, useEffect } from 'react';
|
|
1
|
+
import { memo, useEffect, useRef } from 'react';
|
|
2
2
|
var createElement = function createElement(url) {
|
|
3
3
|
var element = document.createElement('link');
|
|
4
4
|
element.rel = 'stylesheet';
|
|
@@ -7,10 +7,13 @@ var createElement = function createElement(url) {
|
|
|
7
7
|
};
|
|
8
8
|
var FontLoader = /*#__PURE__*/memo(function (_ref) {
|
|
9
9
|
var url = _ref.url;
|
|
10
|
+
var loadRef = useRef(false);
|
|
10
11
|
useEffect(function () {
|
|
12
|
+
if (loadRef.current) return;
|
|
13
|
+
loadRef.current = true;
|
|
11
14
|
var element = createElement(url);
|
|
12
15
|
document.head.append(element);
|
|
13
16
|
}, []);
|
|
14
|
-
return
|
|
17
|
+
return null;
|
|
15
18
|
});
|
|
16
19
|
export default FontLoader;
|
package/es/Giscus/style.js
CHANGED
|
@@ -2,7 +2,7 @@ import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLit
|
|
|
2
2
|
var _templateObject;
|
|
3
3
|
import { css } from 'antd-style';
|
|
4
4
|
import { readableColor, rgba } from 'polished';
|
|
5
|
-
import { colorScales } from "../styles/colors";
|
|
5
|
+
import { colorScales } from "../styles/colors/colors";
|
|
6
6
|
export var genStyles = function genStyles(token, isDarkMode) {
|
|
7
7
|
var type = isDarkMode ? 'dark' : 'light';
|
|
8
8
|
var colorText = colorScales.gray[type][11];
|
package/es/Highlighter/theme.js
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
|
|
2
2
|
var _templateObject;
|
|
3
3
|
import { css } from 'antd-style';
|
|
4
|
+
import { readableColor } from 'polished';
|
|
4
5
|
export default (function (token) {
|
|
5
|
-
return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n .ant-tooltip-inner {\n display: flex;\n align-items: center;\n justify-content: center;\n\n min-height: unset;\n padding: 4px 8px;\n\n color: ", " !important;\n\n background-color: ", " !important;\n border-radius: ", "px !important;\n }\n\n .ant-tooltip-arrow {\n &::before,\n &::after {\n background: ", " !important;\n }\n }\n\n .ant-switch-handle::before {\n background: ", " !important;\n }\n"])), token.colorBgLayout, token.colorText, token.borderRadiusSM, token.colorText, token.colorBgContainer);
|
|
6
|
+
return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n .ant-btn-primary {\n color: ", " !important;\n }\n\n .ant-tooltip-inner {\n display: flex;\n align-items: center;\n justify-content: center;\n\n min-height: unset;\n padding: 4px 8px;\n\n color: ", " !important;\n\n background-color: ", " !important;\n border-radius: ", "px !important;\n }\n\n .ant-tooltip-arrow {\n &::before,\n &::after {\n background: ", " !important;\n }\n }\n\n .ant-switch-handle::before {\n background: ", " !important;\n }\n"])), readableColor(token.colorPrimary), token.colorBgLayout, token.colorText, token.borderRadiusSM, token.colorText, token.colorBgContainer);
|
|
6
7
|
});
|
|
@@ -1,21 +1,14 @@
|
|
|
1
|
-
|
|
2
|
-
import
|
|
3
|
-
import {
|
|
4
|
-
export interface ThemeProviderProps {
|
|
5
|
-
/**
|
|
6
|
-
* @description Cache for the extracted static styles
|
|
7
|
-
*/
|
|
8
|
-
cache?: typeof extractStaticStyle.cache;
|
|
9
|
-
/**
|
|
10
|
-
* @description The children of the ThemeProvider component
|
|
11
|
-
*/
|
|
12
|
-
children: ReactNode;
|
|
13
|
-
/**
|
|
14
|
-
* @description Custom stylish
|
|
15
|
-
*/
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { ThemeProviderProps as AntdThemeProviderProps, CustomStylishParams, CustomTokenParams } from 'antd-style';
|
|
3
|
+
import { NeutralColors, PrimaryColors } from "../styles";
|
|
4
|
+
export interface ThemeProviderProps extends Omit<AntdThemeProviderProps<any>, 'theme'> {
|
|
16
5
|
customStylish?: (theme: CustomStylishParams) => {
|
|
17
6
|
[key: string]: any;
|
|
18
7
|
};
|
|
8
|
+
customTheme?: {
|
|
9
|
+
neutralColor?: NeutralColors;
|
|
10
|
+
primaryColor?: PrimaryColors;
|
|
11
|
+
};
|
|
19
12
|
/**
|
|
20
13
|
* @description Custom extra token
|
|
21
14
|
*/
|
|
@@ -23,14 +16,6 @@ export interface ThemeProviderProps {
|
|
|
23
16
|
[key: string]: any;
|
|
24
17
|
};
|
|
25
18
|
enableWebfonts?: boolean;
|
|
26
|
-
/**
|
|
27
|
-
* @description Whether to inline the styles on server-side rendering or not
|
|
28
|
-
*/
|
|
29
|
-
ssrInline?: boolean;
|
|
30
|
-
/**
|
|
31
|
-
* @description The mode of the theme (light or dark)
|
|
32
|
-
*/
|
|
33
|
-
themeMode?: ThemeMode;
|
|
34
19
|
/**
|
|
35
20
|
* @description Webfont loader css strings
|
|
36
21
|
*/
|
|
@@ -1,4 +1,6 @@
|
|
|
1
1
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
2
|
+
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
|
|
3
|
+
var _excluded = ["children", "customStylish", "customToken", "enableWebfonts", "webfonts", "customTheme"];
|
|
2
4
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
3
5
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
4
6
|
import { App } from 'antd';
|
|
@@ -7,19 +9,22 @@ import { memo, useCallback, useEffect } from 'react';
|
|
|
7
9
|
import { ThemeContext } from 'styled-components';
|
|
8
10
|
import { useCdnFn } from "../ConfigProvider";
|
|
9
11
|
import FontLoader from "../FontLoader";
|
|
10
|
-
import { lobeCustomStylish, lobeCustomToken
|
|
12
|
+
import { lobeCustomStylish, lobeCustomToken } from "../styles";
|
|
13
|
+
import { createLobeAntdTheme } from "../styles/theme/antdTheme";
|
|
11
14
|
import GlobalStyle from "./GlobalStyle";
|
|
12
15
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
13
16
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
14
17
|
import { Fragment as _Fragment } from "react/jsx-runtime";
|
|
15
18
|
var ThemeProvider = /*#__PURE__*/memo(function (_ref) {
|
|
16
19
|
var children = _ref.children,
|
|
17
|
-
themeMode = _ref.themeMode,
|
|
18
20
|
customStylish = _ref.customStylish,
|
|
19
21
|
customToken = _ref.customToken,
|
|
20
22
|
_ref$enableWebfonts = _ref.enableWebfonts,
|
|
21
23
|
enableWebfonts = _ref$enableWebfonts === void 0 ? true : _ref$enableWebfonts,
|
|
22
|
-
webfonts = _ref.webfonts
|
|
24
|
+
webfonts = _ref.webfonts,
|
|
25
|
+
_ref$customTheme = _ref.customTheme,
|
|
26
|
+
customTheme = _ref$customTheme === void 0 ? {} : _ref$customTheme,
|
|
27
|
+
res = _objectWithoutProperties(_ref, _excluded);
|
|
23
28
|
var genCdnUrl = useCdnFn();
|
|
24
29
|
var webfontUrls = webfonts || [genCdnUrl({
|
|
25
30
|
path: 'css/index.css',
|
|
@@ -49,18 +54,25 @@ var ThemeProvider = /*#__PURE__*/memo(function (_ref) {
|
|
|
49
54
|
var token = useCallback(function (theme) {
|
|
50
55
|
return _objectSpread(_objectSpread({}, lobeCustomToken(theme)), customToken === null || customToken === void 0 ? void 0 : customToken(theme));
|
|
51
56
|
}, [customToken]);
|
|
57
|
+
var theme = useCallback(function (appearance) {
|
|
58
|
+
return createLobeAntdTheme({
|
|
59
|
+
appearance: appearance,
|
|
60
|
+
neutralColor: customTheme.neutralColor,
|
|
61
|
+
primaryColor: customTheme.primaryColor
|
|
62
|
+
});
|
|
63
|
+
}, [customTheme.primaryColor, customTheme.neutralColor]);
|
|
52
64
|
return /*#__PURE__*/_jsxs(_Fragment, {
|
|
53
|
-
children: [enableWebfonts && (webfontUrls === null || webfontUrls === void 0 ? void 0 : webfontUrls.length) > 0 && webfontUrls.map(function (webfont
|
|
65
|
+
children: [enableWebfonts && (webfontUrls === null || webfontUrls === void 0 ? void 0 : webfontUrls.length) > 0 && webfontUrls.map(function (webfont) {
|
|
54
66
|
return /*#__PURE__*/_jsx(FontLoader, {
|
|
55
67
|
url: webfont
|
|
56
|
-
},
|
|
68
|
+
}, webfont);
|
|
57
69
|
}), /*#__PURE__*/_jsx(StyleProvider, {
|
|
58
70
|
speedy: process.env.NODE_ENV === 'production',
|
|
59
|
-
children: /*#__PURE__*/_jsxs(AntdThemeProvider, {
|
|
71
|
+
children: /*#__PURE__*/_jsxs(AntdThemeProvider, _objectSpread(_objectSpread({
|
|
60
72
|
customStylish: stylish,
|
|
61
|
-
customToken: token
|
|
62
|
-
|
|
63
|
-
|
|
73
|
+
customToken: token
|
|
74
|
+
}, res), {}, {
|
|
75
|
+
theme: theme,
|
|
64
76
|
children: [/*#__PURE__*/_jsx(GlobalStyle, {}), /*#__PURE__*/_jsx(App, {
|
|
65
77
|
style: {
|
|
66
78
|
minHeight: 'inherit',
|
|
@@ -68,7 +80,7 @@ var ThemeProvider = /*#__PURE__*/memo(function (_ref) {
|
|
|
68
80
|
},
|
|
69
81
|
children: children
|
|
70
82
|
})]
|
|
71
|
-
})
|
|
83
|
+
}))
|
|
72
84
|
})]
|
|
73
85
|
});
|
|
74
86
|
});
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { AliasToken } from 'antd/es/theme/interface';
|
|
2
|
-
import { ColorScaleItem } from "
|
|
2
|
+
import { ColorScaleItem } from "./colors";
|
|
3
3
|
export declare const generateColorPalette: ({ type, scale, appearance, }: {
|
|
4
4
|
appearance: 'light' | 'dark';
|
|
5
5
|
scale: ColorScaleItem;
|
package/es/styles/customTheme.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { colorScales } from "./colors";
|
|
2
|
-
import { neutralColorScales } from "./neutralColors";
|
|
1
|
+
import { colorScales } from "./colors/colors";
|
|
2
|
+
import { neutralColorScales } from "./colors/neutralColors";
|
|
3
3
|
export var primaryColors = {
|
|
4
4
|
blue: colorScales.blue.dark[9],
|
|
5
5
|
cyan: colorScales.cyan.dark[9],
|
package/es/styles/index.d.ts
CHANGED
|
@@ -1,9 +1,7 @@
|
|
|
1
|
-
export {
|
|
2
|
-
export {
|
|
3
|
-
export {
|
|
4
|
-
export {
|
|
5
|
-
export { generateTheme as lobeTheme } from './algorithms/generateTheme';
|
|
6
|
-
export { colorScales as colors } from './colors';
|
|
7
|
-
export { colorScales } from './colors';
|
|
1
|
+
export { colorScales as colors } from './colors/colors';
|
|
2
|
+
export { colorScales } from './colors/colors';
|
|
3
|
+
export { generateColorNeutralPalette, generateColorPalette } from './colors/generateColorPalette';
|
|
4
|
+
export { neutralColorScales } from './colors/neutralColors';
|
|
8
5
|
export * from './customTheme';
|
|
9
|
-
export {
|
|
6
|
+
export { generateCustomStylish as lobeCustomStylish } from './theme/customStylish';
|
|
7
|
+
export { generateCustomToken as lobeCustomToken } from './theme/customToken';
|
package/es/styles/index.js
CHANGED
|
@@ -1,9 +1,7 @@
|
|
|
1
|
-
export {
|
|
2
|
-
export {
|
|
3
|
-
export {
|
|
4
|
-
export {
|
|
5
|
-
export { generateTheme as lobeTheme } from "./algorithms/generateTheme";
|
|
6
|
-
export { colorScales as colors } from "./colors";
|
|
7
|
-
export { colorScales } from "./colors";
|
|
1
|
+
export { colorScales as colors } from "./colors/colors";
|
|
2
|
+
export { colorScales } from "./colors/colors";
|
|
3
|
+
export { generateColorNeutralPalette, generateColorPalette } from "./colors/generateColorPalette";
|
|
4
|
+
export { neutralColorScales } from "./colors/neutralColors";
|
|
8
5
|
export * from "./customTheme";
|
|
9
|
-
export {
|
|
6
|
+
export { generateCustomStylish as lobeCustomStylish } from "./theme/customStylish";
|
|
7
|
+
export { generateCustomToken as lobeCustomToken } from "./theme/customToken";
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
2
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
3
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
4
|
+
import { generateColorNeutralPalette, generateColorPalette, neutralColorScales } from "../..";
|
|
5
|
+
import { colorScales } from "../../colors/colors";
|
|
6
|
+
import darkBaseToken from "../token/dark";
|
|
7
|
+
export var darkAlgorithm = function darkAlgorithm(seedToken, mapToken) {
|
|
8
|
+
var primaryColor = seedToken.primaryColor;
|
|
9
|
+
var neutralColor = seedToken.neutralColor;
|
|
10
|
+
var primaryTokens = {};
|
|
11
|
+
var neutralTokens = {};
|
|
12
|
+
|
|
13
|
+
// generate primary color Token with colorPrimary
|
|
14
|
+
var primaryScale = colorScales[primaryColor];
|
|
15
|
+
if (primaryScale) {
|
|
16
|
+
primaryTokens = generateColorPalette({
|
|
17
|
+
appearance: 'dark',
|
|
18
|
+
scale: primaryScale,
|
|
19
|
+
type: 'Primary'
|
|
20
|
+
});
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
// generate neutral color Token with colorBgBase
|
|
24
|
+
var neutralScale = neutralColorScales[neutralColor];
|
|
25
|
+
if (neutralScale) {
|
|
26
|
+
neutralTokens = generateColorNeutralPalette({
|
|
27
|
+
appearance: 'dark',
|
|
28
|
+
scale: neutralScale
|
|
29
|
+
});
|
|
30
|
+
}
|
|
31
|
+
return _objectSpread(_objectSpread(_objectSpread(_objectSpread({}, mapToken), darkBaseToken), primaryTokens), neutralTokens);
|
|
32
|
+
};
|
|
@@ -1,30 +1,28 @@
|
|
|
1
1
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
2
2
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
3
3
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
6
|
-
import
|
|
7
|
-
export var
|
|
8
|
-
var primaryColor =
|
|
9
|
-
|
|
10
|
-
isDarkMode = _ref.isDarkMode;
|
|
11
|
-
var appearance = isDarkMode ? 'dark' : 'light';
|
|
4
|
+
import { generateColorNeutralPalette, generateColorPalette, neutralColorScales } from "../..";
|
|
5
|
+
import { colorScales } from "../../colors/colors";
|
|
6
|
+
import lightBaseToken from "../token/light";
|
|
7
|
+
export var lightAlgorithm = function lightAlgorithm(seedToken, mapToken) {
|
|
8
|
+
var primaryColor = seedToken.colorPrimary;
|
|
9
|
+
var neutralColor = seedToken.colorBgBase;
|
|
12
10
|
var primaryTokens = {};
|
|
13
11
|
var neutralTokens = {};
|
|
14
|
-
|
|
15
|
-
|
|
12
|
+
var primaryScale = colorScales[primaryColor];
|
|
13
|
+
if (primaryScale) {
|
|
16
14
|
primaryTokens = generateColorPalette({
|
|
17
|
-
appearance:
|
|
18
|
-
scale:
|
|
15
|
+
appearance: 'light',
|
|
16
|
+
scale: primaryScale,
|
|
19
17
|
type: 'Primary'
|
|
20
18
|
});
|
|
21
19
|
}
|
|
22
|
-
|
|
23
|
-
|
|
20
|
+
var neutralScale = neutralColorScales[neutralColor];
|
|
21
|
+
if (neutralScale) {
|
|
24
22
|
neutralTokens = generateColorNeutralPalette({
|
|
25
|
-
appearance:
|
|
26
|
-
scale:
|
|
23
|
+
appearance: 'light',
|
|
24
|
+
scale: neutralScale
|
|
27
25
|
});
|
|
28
26
|
}
|
|
29
|
-
return _objectSpread(_objectSpread({}, primaryTokens), neutralTokens);
|
|
27
|
+
return _objectSpread(_objectSpread(_objectSpread(_objectSpread({}, mapToken), lightBaseToken), primaryTokens), neutralTokens);
|
|
30
28
|
};
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { ThemeConfig } from 'antd';
|
|
2
|
+
import { ThemeAppearance } from 'antd-style';
|
|
3
|
+
import { NeutralColors, PrimaryColors } from "..";
|
|
4
|
+
export interface LobeAntdThemeParams {
|
|
5
|
+
appearance: ThemeAppearance;
|
|
6
|
+
neutralColor?: NeutralColors;
|
|
7
|
+
primaryColor?: PrimaryColors;
|
|
8
|
+
}
|
|
9
|
+
/**
|
|
10
|
+
* create A LobeHub Style Antd Theme Object
|
|
11
|
+
* @param neutralColor
|
|
12
|
+
* @param appearance
|
|
13
|
+
* @param primaryColor
|
|
14
|
+
*/
|
|
15
|
+
export declare const createLobeAntdTheme: ({ neutralColor, appearance, primaryColor, }: LobeAntdThemeParams) => ThemeConfig;
|
|
@@ -1,20 +1,26 @@
|
|
|
1
1
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
2
2
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
3
3
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
4
|
-
import
|
|
5
|
-
import
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
4
|
+
import { darkAlgorithm } from "./algorithms/darkAlgorithm";
|
|
5
|
+
import { lightAlgorithm } from "./algorithms/lightAlgorithm";
|
|
6
|
+
import { baseToken } from "./token/base";
|
|
7
|
+
/**
|
|
8
|
+
* create A LobeHub Style Antd Theme Object
|
|
9
|
+
* @param neutralColor
|
|
10
|
+
* @param appearance
|
|
11
|
+
* @param primaryColor
|
|
12
|
+
*/
|
|
13
|
+
export var createLobeAntdTheme = function createLobeAntdTheme(_ref) {
|
|
14
|
+
var neutralColor = _ref.neutralColor,
|
|
15
|
+
appearance = _ref.appearance,
|
|
16
|
+
primaryColor = _ref.primaryColor;
|
|
17
|
+
var isDark = appearance === 'dark';
|
|
18
|
+
return {
|
|
19
|
+
algorithm: isDark ? darkAlgorithm : lightAlgorithm,
|
|
20
|
+
token: _objectSpread(_objectSpread({}, baseToken), {}, {
|
|
21
|
+
// @ts-ignore
|
|
22
|
+
neutralColor: neutralColor,
|
|
23
|
+
primaryColor: primaryColor
|
|
24
|
+
})
|
|
25
|
+
};
|
|
20
26
|
};
|
|
@@ -6,7 +6,7 @@ function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol
|
|
|
6
6
|
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
7
7
|
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
|
|
8
8
|
import { camelCase } from 'lodash-es';
|
|
9
|
-
import { colorScales } from "../colors";
|
|
9
|
+
import { colorScales } from "../colors/colors";
|
|
10
10
|
var generateColorPalette = function generateColorPalette(_ref) {
|
|
11
11
|
var _ref2;
|
|
12
12
|
var name = _ref.name,
|
|
@@ -55,8 +55,6 @@ var generateCustomColorPalette = function generateCustomColorPalette(_ref3) {
|
|
|
55
55
|
scale: scale
|
|
56
56
|
}));
|
|
57
57
|
};
|
|
58
|
-
|
|
59
|
-
// @ts-ignore
|
|
60
58
|
export var generateCustomToken = function generateCustomToken(_ref4) {
|
|
61
59
|
var isDarkMode = _ref4.isDarkMode;
|
|
62
60
|
var colorCustomToken = {};
|
|
@@ -1,9 +1,8 @@
|
|
|
1
1
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
2
2
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
3
3
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
4
|
-
import { generateColorNeutralPalette, generateColorPalette } from "
|
|
5
|
-
import { colorScales } from "
|
|
6
|
-
import { baseToken } from "./base";
|
|
4
|
+
import { generateColorNeutralPalette, generateColorPalette } from "../../colors/generateColorPalette";
|
|
5
|
+
import { colorScales } from "../../colors/colors";
|
|
7
6
|
var primaryToken = generateColorPalette({
|
|
8
7
|
appearance: 'dark',
|
|
9
8
|
scale: colorScales.bnw,
|
|
@@ -33,7 +32,7 @@ var infoToken = generateColorPalette({
|
|
|
33
32
|
scale: colorScales.blue,
|
|
34
33
|
type: 'Info'
|
|
35
34
|
});
|
|
36
|
-
var darkBaseToken = _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(
|
|
35
|
+
var darkBaseToken = _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({}, primaryToken), neutralToken), successToken), warningToken), errorToken), infoToken), {}, {
|
|
37
36
|
boxShadow: '0 12px 20px 6px rgb(0 0 0 / 0.08)',
|
|
38
37
|
boxShadowSecondary: '0 2px 8px 2px rgb(0 0 0 / 0.07), 0 2px 4px -1px rgb(0 0 0 / 0.04)',
|
|
39
38
|
colorLink: infoToken.colorInfoText,
|
|
@@ -1,9 +1,8 @@
|
|
|
1
1
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
2
2
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
3
3
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
4
|
-
import { generateColorNeutralPalette, generateColorPalette } from "
|
|
5
|
-
import { colorScales } from "
|
|
6
|
-
import { baseToken } from "./base";
|
|
4
|
+
import { generateColorNeutralPalette, generateColorPalette } from "../../colors/generateColorPalette";
|
|
5
|
+
import { colorScales } from "../../colors/colors";
|
|
7
6
|
var primaryToken = generateColorPalette({
|
|
8
7
|
appearance: 'light',
|
|
9
8
|
scale: colorScales.bnw,
|
|
@@ -33,7 +32,7 @@ var infoToken = generateColorPalette({
|
|
|
33
32
|
scale: colorScales.geekblue,
|
|
34
33
|
type: 'Info'
|
|
35
34
|
});
|
|
36
|
-
var lightBaseToken = _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(
|
|
35
|
+
var lightBaseToken = _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({}, primaryToken), neutralToken), successToken), warningToken), errorToken), infoToken), {}, {
|
|
37
36
|
boxShadow: '0 12px 20px 6px rgb(104 112 118 / 0.08)',
|
|
38
37
|
boxShadowSecondary: '0 2px 8px 2px rgb(104 112 118 / 0.07), 0 2px 4px -1px rgb(104 112 118 / 0.04)',
|
|
39
38
|
colorLink: infoToken.colorInfoText,
|
package/package.json
CHANGED
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
import { AliasToken } from 'antd/es/theme/interface';
|
|
2
|
-
import { type NeutralColors, type PrimaryColors } from '../customTheme';
|
|
3
|
-
interface generateCustomThemeProps {
|
|
4
|
-
isDarkMode: boolean;
|
|
5
|
-
neutralColor?: NeutralColors | '';
|
|
6
|
-
primaryColor?: PrimaryColors | '';
|
|
7
|
-
}
|
|
8
|
-
export declare const generateCustomTheme: ({ primaryColor, neutralColor, isDarkMode, }: generateCustomThemeProps) => Partial<AliasToken>;
|
|
9
|
-
export {};
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|