@lobehub/ui 1.1.0

package/es/index.d.ts

@@ -0,0 +1,6 @@
+export { default as ActionIcon, type ActionIconProps } from './ActionIcon';
+export { default as DraggablePanel, type DraggablePanelProps } from './DraggablePanel';
+export { default as Logo } from './Logo';
+export { default as SideNav, type SideNavProps } from './SideNav';
+export { default as Template, type TemplateProps } from './Template';
+export { default as ThemeProvider } from './ThemeProvider';

package/es/index.js

@@ -0,0 +1,6 @@
+export { default as ActionIcon } from "./ActionIcon";
+export { default as DraggablePanel } from "./DraggablePanel";
+export { default as Logo } from "./Logo";
+export { default as SideNav } from "./SideNav";
+export { default as Template } from "./Template";
+export { default as ThemeProvider } from "./ThemeProvider";

package/es/styles/algorithms/colorRelationship.d.ts

@@ -0,0 +1,6 @@
+export declare const generateAssociatedColors: (baseColor: string, adjustWarning?: boolean) => {
+    success: string;
+    error: string;
+    warning: string;
+    info: string;
+};

package/es/styles/algorithms/colorRelationship.js

@@ -0,0 +1,88 @@
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import chroma from 'chroma-js';
+var baseColors = [{
+  name: 'red',
+  hue: 0
+}, {
+  name: 'orange',
+  hue: 30
+}, {
+  name: 'yellow',
+  hue: 60
+}, {
+  name: 'yellow-green',
+  hue: 90
+}, {
+  name: 'green',
+  hue: 120
+}, {
+  name: 'cyan-green',
+  hue: 150
+}, {
+  name: 'cyan',
+  hue: 180
+}, {
+  name: 'cyan-blue',
+  hue: 210
+}, {
+  name: 'blue',
+  hue: 240
+}, {
+  name: 'blue-violet',
+  hue: 270
+}, {
+  name: 'violet',
+  hue: 300
+}, {
+  name: 'red-violet',
+  hue: 330
+}];
+var findClosestColorBase = function findClosestColorBase(hue) {
+  var minDifference = 360;
+  var closestColorBase = {
+    name: '',
+    hue: 0
+  };
+  baseColors.forEach(function (colorBase) {
+    var hueDifference = Math.abs(hue - colorBase.hue);
+    var adjustedDifference = Math.min(hueDifference, 360 - hueDifference);
+    if (adjustedDifference < minDifference) {
+      minDifference = adjustedDifference;
+      closestColorBase = colorBase;
+    }
+  });
+  return closestColorBase.hue;
+};
+export var generateAssociatedColors = function generateAssociatedColors(baseColor) {
+  var adjustWarning = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
+  var color = chroma(baseColor);
+  var _color$oklch = color.oklch(),
+    _color$oklch2 = _slicedToArray(_color$oklch, 3),
+    baseLightness = _color$oklch2[0],
+    baseChroma = _color$oklch2[1],
+    baseHue = _color$oklch2[2];
+  var closestColorHue = findClosestColorBase(baseHue);
+
+  // 计算色相偏移量
+  // const hueOffset = 0;
+  var hueOffset = baseHue - closestColorHue;
+
+  // 应用色相偏移量
+
+  var successBaseHue = 150; // 绿色基准色相值
+  var errorBaseHue = 30; // 红色基准色相值
+  var warningBaseHue = 90; // 黄色基准色相值
+  var infoBaseHue = 255; // 蓝色基准色相值
+
+  var successHue = (successBaseHue + hueOffset) % 360;
+  var errorHue = (errorBaseHue + hueOffset) % 360;
+  var warningHue = (warningBaseHue + hueOffset) % 360;
+  var infoHue = (infoBaseHue + hueOffset) % 360;
+  var warningLightness = adjustWarning ? 0.8 + baseLightness * 0.2 : baseLightness;
+  return {
+    success: chroma.oklch(baseLightness, baseChroma, successHue).hex(),
+    error: chroma.oklch(baseLightness, baseChroma, errorHue).hex(),
+    warning: chroma.oklch(warningLightness, baseChroma, warningHue).hex(),
+    info: chroma.oklch(baseLightness, baseChroma, infoHue).hex()
+  };
+};

package/es/styles/algorithms/index.d.ts

@@ -0,0 +1,15 @@
+import { ColorMapToken } from 'antd/es/theme/interface/maps/colors';
+import { ColorPalettes, NeutralPaletteOptions, SeedColors, TokenType } from './paletteGenerator';
+export declare type TokenRelationship = (type: TokenType) => Partial<Record<keyof ColorMapToken, number>>;
+interface MapTokenAlgorithm extends NeutralPaletteOptions {
+    relationship?: TokenRelationship;
+    seedColors?: Partial<SeedColors>;
+    infoColorFollowPrimary?: boolean;
+    adjustWarning?: boolean;
+    brandColor?: string;
+}
+export declare const genMapTokenAlgorithm: (mode: 'dark' | 'light', params?: MapTokenAlgorithm) => {
+    palettes: ColorPalettes;
+    tokens: Partial<Record<keyof ColorMapToken, string>>;
+};
+export type { ColorPalettes } from './paletteGenerator';

package/es/styles/algorithms/index.js

@@ -0,0 +1,67 @@
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+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; }
+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; }
+import { generateAssociatedColors } from "./colorRelationship";
+import { generateColorPalette, generateNeutralPalette } from "./paletteGenerator";
+var defaultRelationship = function defaultRelationship(type) {
+  var _ref;
+  var key = type.toUpperCase()[0] + type.slice(1);
+  return _ref = {}, _defineProperty(_ref, "color".concat(key, "Bg"), 1), _defineProperty(_ref, "color".concat(key, "BgHover"), 2), _defineProperty(_ref, "color".concat(key, "Border"), 3), _defineProperty(_ref, "color".concat(key, "BorderHover"), 4), _defineProperty(_ref, "color".concat(key, "Hover"), 5), _defineProperty(_ref, "color".concat(key), 6), _defineProperty(_ref, "color".concat(key, "Active"), 7), _defineProperty(_ref, "color".concat(key, "TextHover"), 8), _defineProperty(_ref, "color".concat(key, "Text"), 9), _defineProperty(_ref, "color".concat(key, "TextActive"), 10), _ref;
+};
+export var genMapTokenAlgorithm = function genMapTokenAlgorithm(mode, params) {
+  var _ref2 = params || {},
+    _ref2$relationship = _ref2.relationship,
+    relationship = _ref2$relationship === void 0 ? defaultRelationship : _ref2$relationship,
+    _ref2$infoColorFollow = _ref2.infoColorFollowPrimary,
+    infoColorFollowPrimary = _ref2$infoColorFollow === void 0 ? false : _ref2$infoColorFollow,
+    adjustWarning = _ref2.adjustWarning,
+    _ref2$brandColor = _ref2.brandColor,
+    brandColor = _ref2$brandColor === void 0 ? mode === 'dark' ? '#fff' : '#000' : _ref2$brandColor;
+  var funcColors = generateAssociatedColors(brandColor, adjustWarning);
+  var seedColors = _objectSpread(_objectSpread({
+    primary: brandColor
+  }, funcColors), params === null || params === void 0 ? void 0 : params.seedColors);
+  if (infoColorFollowPrimary) {
+    seedColors.info = brandColor;
+  }
+  var palettes = {
+    primary: generateColorPalette(seedColors.primary, params).map(function (color) {
+      return color.hex;
+    }),
+    error: generateColorPalette(seedColors.error, params).map(function (c) {
+      return c.hex;
+    }),
+    warning: generateColorPalette(seedColors.warning, params).map(function (c) {
+      return c.hex;
+    }),
+    success: generateColorPalette(seedColors.success, params).map(function (c) {
+      return c.hex;
+    }),
+    info: generateColorPalette(seedColors.info, params).map(function (color) {
+      return color.hex;
+    }),
+    neutral: generateNeutralPalette(seedColors.primary, _objectSpread(_objectSpread({}, params), {}, {
+      neutral: true
+    })).map(function (c) {
+      return c.hex;
+    }),
+    grey: generateNeutralPalette(seedColors.primary, params).map(function (c) {
+      return c.hex;
+    })
+  };
+  var tokens = {};
+  var types = ['primary', 'error', 'warning', 'success', 'info'];
+  types.forEach(function (type) {
+    Object.entries(relationship(type)).forEach(function (_ref3) {
+      var _ref4 = _slicedToArray(_ref3, 2),
+        key = _ref4[0],
+        value = _ref4[1];
+      tokens[key] = palettes[type][value];
+    });
+  });
+  return {
+    palettes: palettes,
+    tokens: tokens
+  };
+};

package/es/styles/algorithms/paletteGenerator.d.ts

@@ -0,0 +1,51 @@
+export interface Color {
+    hex: string;
+    oklch: [number, number, number];
+}
+/**
+ * @title 阴影参数
+ */
+interface AdjustParams {
+    /**
+     * @title 步骤
+     * @description 阴影的层数，即需要生成几个阴影层，默认为 5。
+     */
+    steps: number;
+    /**
+     * @title 目标亮度
+     * @description 阴影的最终亮度值，取值范围为 0~255，默认为 0。
+     */
+    targetBrightness: number;
+    /**
+     * @title 色相调整
+     * @description 调整阴影颜色的色相值，取值范围为 -180~180，默认为 0。
+     */
+    hueAdjustment: number;
+    /**
+     * @title 饱和度调整
+     * @description 调整阴影颜色的饱和度值，取值范围为 -100~100，默认为 0。
+     */
+    saturationAdjustment: number;
+    /**
+     * @title 饱和度缩放
+     * @description 缩放阴影颜色的饱和度值，取值范围为 0~1，默认为 1。
+     */
+    saturationScale: number;
+}
+export interface ColorPaletteOptions {
+    lighter?: Partial<AdjustParams>;
+    darker?: Partial<AdjustParams>;
+    reverse?: boolean;
+}
+export declare type TokenType = 'primary' | 'success' | 'warning' | 'error' | 'info' | 'grey' | 'neutral';
+export declare type ColorPalettes = Record<TokenType, string[]>;
+export declare type SeedColors = Record<TokenType, string>;
+export declare const generateColorPalette: (baseColorHex: string, options?: ColorPaletteOptions) => Color[];
+export interface NeutralPaletteOptions {
+    lighter?: Partial<AdjustParams>;
+    darker?: Partial<AdjustParams>;
+    reverse?: boolean;
+    neutral?: boolean;
+}
+export declare const generateNeutralPalette: (baseColorHex: string, options?: NeutralPaletteOptions) => Color[];
+export {};

package/es/styles/algorithms/paletteGenerator.js

@@ -0,0 +1,74 @@
+import chroma from 'chroma-js';
+import { merge } from 'lodash';
+var defaultLight = {
+  steps: 6,
+  targetBrightness: 0.98,
+  saturationAdjustment: 0.4,
+  saturationScale: 1.6,
+  hueAdjustment: 1
+};
+var defaultDark = {
+  steps: 4,
+  targetBrightness: 0.3,
+  saturationAdjustment: 0.6,
+  saturationScale: 1.6,
+  hueAdjustment: 1.03
+};
+
+// 生成 OKLCH 色板
+export var generateColorPalette = function generateColorPalette(baseColorHex) {
+  var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+  var lighter = merge({}, defaultLight, options.lighter);
+  var darker = merge({}, defaultDark, options.darker);
+  var baseColor = chroma(baseColorHex);
+  var baseColorOKLCH = baseColor.oklch();
+  var colorPalette = [];
+  for (var i = lighter.steps; i > 0; i--) {
+    var lightness = baseColorOKLCH[0] + (lighter.targetBrightness - baseColorOKLCH[0]) / lighter.steps * i;
+    var chromaValue = baseColorOKLCH[1] - (1 - lighter.saturationAdjustment) * lighter.saturationScale * baseColorOKLCH[1] / lighter.steps * i;
+    var newColor = chroma.oklch(lightness, chromaValue, baseColorOKLCH[2]);
+    colorPalette.push({
+      hex: newColor.hex(),
+      oklch: newColor.oklch()
+    });
+  }
+  colorPalette.push({
+    hex: baseColorHex,
+    oklch: baseColorOKLCH
+  });
+  for (var _i = 1; _i <= darker.steps; _i++) {
+    var _lightness = baseColorOKLCH[0] - (baseColorOKLCH[0] - darker.targetBrightness) / darker.steps * _i;
+    var _chromaValue = baseColorOKLCH[1] - (1 - darker.saturationAdjustment) * darker.saturationScale * baseColorOKLCH[1] / darker.steps * _i;
+
+    // 色相调整因子
+    var hue = baseColorOKLCH[2] * darker.hueAdjustment;
+
+    // 确保色相值在 0 到 360 之间
+    if (hue > 360) {
+      hue = hue % 360;
+    } else if (hue < 0) {
+      hue = 360 + hue % 360;
+    }
+    var _newColor = chroma.oklch(_lightness, _chromaValue, hue);
+    colorPalette.push({
+      hex: _newColor.hex(),
+      oklch: _newColor.oklch()
+    });
+  }
+  return options.reverse ? colorPalette.reverse() : colorPalette;
+};
+export var generateNeutralPalette = function generateNeutralPalette(baseColorHex) {
+  var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+  var baseColor = chroma(baseColorHex);
+  var baseColorOKLCH = baseColor.oklch();
+
+  // 计算中性颜色的色相
+  var neutralHue = baseColorOKLCH[2];
+
+  // 将主色的饱和度降低以获得中性颜色
+  var neutralChromaValue = options.neutral ? baseColorOKLCH[1] * 0.2 : 0;
+
+  // 使用降低饱和度的颜色作为基础色重新生成色板
+  var neutralBaseColor = chroma.oklch(baseColorOKLCH[0], neutralChromaValue, neutralHue);
+  return generateColorPalette(neutralBaseColor.hex(), options);
+};

package/es/styles/antdTheme.d.ts

@@ -0,0 +1,2 @@
+import { GetAntdTheme } from 'antd-style';
+export declare const getAntdTheme: GetAntdTheme;

package/es/styles/antdTheme.js

@@ -0,0 +1,4 @@
+import { darkTheme, lightTheme } from "./theme";
+export var getAntdTheme = function getAntdTheme(appearance) {
+  return appearance === 'dark' ? darkTheme : lightTheme;
+};

package/es/styles/customStylish.d.ts

@@ -0,0 +1,17 @@
+import { GetCustomStylish } from 'antd-style';
+declare module 'antd-style' {
+    interface CustomStylish extends SiteStylish {
+    }
+}
+export interface SiteStylish {
+    clickableText: string;
+    resetLinkColor: string;
+    heroButtonGradient: string;
+    heroGradient: string;
+    heroTextShadow: string;
+    heroGradientFlow: string;
+    heroBlurBall: string;
+    iconGradientDefault: string;
+    blur: string;
+}
+export declare const getCustomStylish: GetCustomStylish<SiteStylish>;

package/es/styles/customStylish.js

@@ -0,0 +1,19 @@
+import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9;
+import { rgba } from 'polished';
+export var getCustomStylish = function getCustomStylish(_ref) {
+  var css = _ref.css,
+    token = _ref.token,
+    isDarkMode = _ref.isDarkMode;
+  return {
+    clickableText: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n      cursor: pointer;\n      color: ", ";\n\n      &:hover {\n        color: ", ";\n      }\n    "])), token.colorTextSecondary, token.colorText),
+    resetLinkColor: css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n      color: inherit;\n\n      &:hover,\n      &:active {\n        color: inherit;\n      }\n    "]))),
+    heroButtonGradient: css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n      background: linear-gradient(90deg, ", " 0%, ", " 100%);\n    "])), token.gradientColor1, token.gradientColor2),
+    heroGradient: css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n      background-image: ", ";\n      background-size: 300% 300%;\n    "])), token.gradientHeroBgG),
+    heroGradientFlow: css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n      animation: flow 5s ease infinite;\n\n      @keyframes flow {\n        0% {\n          background-position: 0 0;\n        }\n\n        50% {\n          background-position: 100% 100%;\n        }\n\n        100% {\n          background-position: 0 0;\n        }\n      }\n    "]))),
+    heroTextShadow: css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n      will-change: transform;\n\n      text-shadow: 0 8px 20px ", ",\n        0 8px 60px ", ",\n        0 8px 80px ", ";\n    "])), rgba(token.gradientColor2, 0.2), rgba(token.gradientColor3, 0.2), rgba(token.cyan, isDarkMode ? 0.2 : 0.4)),
+    heroBlurBall: css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n      filter: blur(69px);\n      will-change: transform;\n      background: linear-gradient(\n        135deg,\n        ", " 0%,\n        ", " 30%,\n        ", " 70%,\n        ", " 100%\n      );\n      background-size: 200% 200%;\n      animation: glow 10s ease infinite;\n\n      @keyframes glow {\n        0% {\n          background-position: 0 -100%;\n        }\n\n        50% {\n          background-position: 200% 50%;\n        }\n\n        100% {\n          background-position: 0 -100%;\n        }\n      }\n    "])), token.gradientColor3, token.gradientColor1, token.red, token.cyan),
+    iconGradientDefault: css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n      radial-gradient(\n        100% 100% at 50% 0,\n        ", " 0,\n        ", " 100%\n      )"])), rgba(token.colorSolid, 0.2), rgba(token.colorSolid, 0.1)),
+    blur: css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n      backdrop-filter: blur(7px);\n      // background: ", ";\n    "])), rgba(token.colorBgBase, 0.5))
+  };
+};

package/es/styles/customToken.d.ts

@@ -0,0 +1,65 @@
+import type { GetCustomToken } from 'antd-style';
+declare module 'antd-style' {
+    interface CustomToken extends SiteToken {
+    }
+}
+/**
+ * @title 站点主题 Token
+ * @description 站点的一些基础配置信息
+ */
+export interface SiteToken {
+    /**
+     * @title 头部高度
+     */
+    headerHeight: number;
+    /**
+     * @title 底部高度
+     */
+    footerHeight: number;
+    /**
+     * @title 侧边栏宽度
+     */
+    sidebarWidth: number;
+    /**
+     * @title 目录宽度
+     */
+    tocWidth: number;
+    /**
+     * @title 内容最大宽度
+     * @description 文本内容的最大宽度 1152
+     */
+    contentMaxWidth: number | string;
+    /**
+     * @title 渐变色1
+     */
+    gradientColor1: string;
+    /**
+     * @title 渐变色2
+     */
+    gradientColor2: string;
+    /**
+     * @title 渐变色3
+     */
+    gradientColor3: string;
+    /**
+     * @title 渐变背景色
+     */
+    gradientHeroBgG: string;
+    /**
+     * @title 默认图标渐变色
+     */
+    gradientIconDefault: string;
+    /**
+     * @title 实色
+     */
+    colorSolid: string;
+    /**
+     * @title 代码高亮字体
+     */
+    fontFamilyHighlighter: string;
+    /**
+     * 是否让 Demo 继承站点主题
+     */
+    demoInheritSiteTheme: boolean;
+}
+export declare const createCustomToken: GetCustomToken<SiteToken>;

package/es/styles/customToken.js

@@ -0,0 +1,24 @@
+import { rgba } from 'polished';
+export var createCustomToken = function createCustomToken(_ref) {
+  var isDarkMode = _ref.isDarkMode,
+    token = _ref.token;
+  var gradientColor1 = token.blue;
+  var gradientColor2 = isDarkMode ? token.pink : token.cyan;
+  var gradientColor3 = token.purple;
+  var colorSolid = isDarkMode ? token.colorWhite : '#000';
+  return {
+    headerHeight: 64,
+    footerHeight: 300,
+    sidebarWidth: 240,
+    tocWidth: 176,
+    contentMaxWidth: 1152,
+    fontFamilyHighlighter: "'Fira Code', 'Fira Mono', Menlo, Consolas, 'DejaVu Sans Mono', monospace",
+    colorSolid: colorSolid,
+    gradientColor1: gradientColor1,
+    gradientColor2: gradientColor2,
+    gradientColor3: gradientColor3,
+    gradientHeroBgG: "radial-gradient(at 80% 20%, ".concat(gradientColor1, " 0%, ").concat(gradientColor2, " 80%, ").concat(gradientColor3, " 130%)"),
+    gradientIconDefault: "radial-gradient(\n        100% 100% at 50% 0,\n        ".concat(rgba(colorSolid, isDarkMode ? 0.2 : 0.2), " 0,\n        ").concat(rgba(colorSolid, isDarkMode ? 0.1 : 0.4), " 100%\n      )"),
+    demoInheritSiteTheme: false
+  };
+};

package/es/styles/index.d.ts

@@ -0,0 +1,3 @@
+export * from './antdTheme';
+export * from './customStylish';
+export * from './customToken';

package/es/styles/index.js

@@ -0,0 +1,3 @@
+export * from "./antdTheme";
+export * from "./customStylish";
+export * from "./customToken";

package/es/styles/theme/dark.d.ts

@@ -0,0 +1,4 @@
+import { ThemeConfig } from 'antd';
+import { ColorPalettes } from '../algorithms';
+export declare const darkColorPalettes: ColorPalettes;
+export declare const darkTheme: ThemeConfig;

package/es/styles/theme/dark.js

@@ -0,0 +1,82 @@
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+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; }
+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; }
+import { theme } from 'antd';
+import { genMapTokenAlgorithm } from "../algorithms";
+var cyanColors = ['rgba(0, 225, 242, 0.12)', 'rgba(0, 232, 245, 0.22)', 'rgba(0, 237, 250, 0.32)', 'rgba(0, 243, 255, 0.42)', 'rgba(0, 247, 255, 0.53)', 'rgba(0, 246, 254, 0.65)', 'rgba(0, 247, 253, 0.77)', 'rgba(0, 245, 255, 0.75)', 'rgba(0, 244, 255, 0.73)', 'rgba(0, 239, 253, 0.72)', 'rgba(0, 237, 253, 0.7)'];
+var darkModeRelationship = function darkModeRelationship(type) {
+  var _ref;
+  var key = type.toUpperCase()[0] + type.slice(1);
+  return _ref = {}, _defineProperty(_ref, "color".concat(key, "Bg"), 1), _defineProperty(_ref, "color".concat(key, "BgHover"), 2), _defineProperty(_ref, "color".concat(key, "Border"), 3), _defineProperty(_ref, "color".concat(key, "BorderHover"), 4), _defineProperty(_ref, "color".concat(key, "Hover"), 7), _defineProperty(_ref, "color".concat(key), 6), _defineProperty(_ref, "color".concat(key, "Active"), 5), _defineProperty(_ref, "color".concat(key, "TextHover"), 8), _defineProperty(_ref, "color".concat(key, "Text"), 9), _defineProperty(_ref, "color".concat(key, "TextActive"), 10), _ref;
+};
+var darkMode = genMapTokenAlgorithm('dark', {
+  lighter: {
+    steps: 4,
+    // 减少较亮颜色的数量
+    targetBrightness: 0.8,
+    // 降低最大亮度值
+    saturationAdjustment: 0.6 // 减小较亮颜色的饱和度调整
+    // saturationScale: 1,
+  },
+
+  darker: {
+    steps: 6,
+    // 增加较暗颜色的数量
+    targetBrightness: 0.2,
+    // 降低最小亮度值
+    saturationAdjustment: 0.4,
+    // 增加较暗颜色的饱和度调整
+    hueAdjustment: 1,
+    // 保持暗色调的色相调整因子
+    saturationScale: 1
+  },
+  reverse: true,
+  relationship: darkModeRelationship
+});
+export var darkColorPalettes = darkMode.palettes;
+var darkAlgorithm = function darkAlgorithm(seedToken, mapToken) {
+  return _objectSpread(_objectSpread(_objectSpread({}, theme.darkAlgorithm(seedToken, mapToken)), darkMode.tokens), {}, {
+    'cyan-1': cyanColors[1],
+    'cyan-2': cyanColors[2],
+    'cyan-3': cyanColors[3],
+    'cyan-4': cyanColors[4],
+    'cyan-5': cyanColors[5],
+    'cyan-6': cyanColors[6],
+    'cyan-7': cyanColors[7],
+    'cyan-8': cyanColors[8],
+    'cyan-9': cyanColors[9],
+    'cyan-10': cyanColors[10]
+  });
+};
+export var darkTheme = {
+  token: {
+    colorTextLightSolid: '#000000',
+    colorBgLayout: '#000000',
+    colorBgContainer: '#111111',
+    colorBgElevated: '#222222',
+    colorBgSpotlight: '#444444',
+    colorBorder: '#333333',
+    colorBorderSecondary: '#333333',
+    colorText: '#ffffff',
+    colorTextSecondary: '#999999',
+    colorTextTertiary: '#888888',
+    colorTextQuaternary: '#666666',
+    colorPrimary: '#ffffff',
+    colorInfo: '#0070f3',
+    colorSuccess: '#50e3c2',
+    colorWarning: '#f5a623',
+    colorError: '#ee0000',
+    colorFillQuaternary: 'rgba(0,0,0,0)',
+    borderRadius: 5,
+    borderRadiusXS: 3,
+    borderRadiusSM: 3,
+    borderRadiusLG: 8,
+    controlHeight: 36,
+    boxShadow: '0 12px 20px 6px rgb(0 0 0 / 0.08)',
+    boxShadowSecondary: '0 2px 8px 2px rgb(0 0 0 / 0.07), 0 2px 4px -1px rgb(0 0 0 / 0.04)',
+    colorLinkHover: darkColorPalettes.primary[7],
+    colorLink: darkColorPalettes.primary[6],
+    colorLinkActive: darkColorPalettes.primary[5]
+  },
+  algorithm: darkAlgorithm
+};

package/es/styles/theme/index.d.ts

@@ -0,0 +1,2 @@
+export { darkTheme } from './dark';
+export { lightTheme } from './light';

package/es/styles/theme/index.js

@@ -0,0 +1,2 @@
+export { darkTheme } from "./dark";
+export { lightTheme } from "./light";

package/es/styles/theme/light.d.ts

@@ -0,0 +1,4 @@
+import { ThemeConfig } from 'antd';
+import { ColorPalettes } from '../algorithms';
+export declare const lightColorPalettes: ColorPalettes;
+export declare const lightTheme: ThemeConfig;

package/es/styles/theme/light.js

@@ -0,0 +1,36 @@
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+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; }
+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; }
+import { genMapTokenAlgorithm } from "../algorithms";
+var lightMode = genMapTokenAlgorithm('light');
+export var lightColorPalettes = lightMode.palettes;
+export var lightTheme = {
+  token: {
+    colorTextLightSolid: '#ffffff',
+    colorBgLayout: '#ffffff',
+    colorBgContainer: '#fafafa',
+    colorBgElevated: '#f2f2f2',
+    colorBgSpotlight: '#999999',
+    colorBorder: '#eaeaea',
+    colorBorderSecondary: '#eaeaea',
+    colorText: '#000000',
+    colorTextSecondary: '#444444',
+    colorTextTertiary: '#666666',
+    colorTextQuaternary: '#888888',
+    colorPrimary: '#000000',
+    colorFillQuaternary: 'rgba(0,0,0,0)',
+    borderRadius: 5,
+    borderRadiusXS: 3,
+    borderRadiusSM: 3,
+    borderRadiusLG: 8,
+    controlHeight: 36,
+    boxShadow: '0 12px 20px 6px rgb(104 112 118 / 0.08)',
+    boxShadowSecondary: '0 2px 8px 2px rgb(104 112 118 / 0.07), 0 2px 4px -1px rgb(104 112 118 / 0.04)',
+    colorLinkHover: lightColorPalettes.primary[5],
+    colorLink: lightColorPalettes.primary[6],
+    colorLinkActive: lightColorPalettes.primary[7]
+  },
+  algorithm: function algorithm(seedToken, mapToken) {
+    return _objectSpread(_objectSpread({}, mapToken), lightMode.tokens);
+  }
+};

package/es/types/index.d.ts

@@ -0,0 +1,9 @@
+import { Theme as AntdStyleTheme } from 'antd-style';
+import React from 'react';
+declare module 'styled-components' {
+    interface DefaultTheme extends AntdStyleTheme {
+    }
+}
+export declare type DivProps = React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>;
+export declare type SvgProps = React.DetailedHTMLProps<React.HTMLAttributes<SVGSVGElement>, SVGSVGElement>;
+export declare type ImgProps = React.DetailedHTMLProps<React.HTMLAttributes<HTMLImageElement>, HTMLImageElement>;

package/es/types/index.js

@@ -0,0 +1 @@
+export {};

package/es/utils/colorUtils.d.ts

@@ -0,0 +1 @@
+export declare const convertAlphaToSolid: (foreground: string, background: string) => string;

package/es/utils/colorUtils.js

@@ -0,0 +1,10 @@
+import chroma from 'chroma-js';
+export var convertAlphaToSolid = function convertAlphaToSolid(foreground, background) {
+  var fgColor = chroma(foreground);
+  var bgColor = chroma(background);
+  var alpha = fgColor.alpha();
+  var alphaComplement = 1 - alpha;
+  var mixedColor = [fgColor.get('rgb.r') * alpha + bgColor.get('rgb.r') * alphaComplement, fgColor.get('rgb.g') * alpha + bgColor.get('rgb.g') * alphaComplement, fgColor.get('rgb.b') * alpha + bgColor.get('rgb.b') * alphaComplement];
+  var resultColor = chroma(mixedColor);
+  return resultColor.hex();
+};