@agentscope-ai/design 1.0.11 → 1.0.12

package/README.md

@@ -1,84 +1,254 @@
-<div align="center"><a name="readme-top"></a>
+# @ali/agentscope-ai-design
 
-  <img height="120" src="https://img.alicdn.com/imgextra/i1/O1CN01ipemFb1EzmZI9LiTe_!!6000000000423-55-tps-28-28.svg">
+[![NPM version](https://img.shields.io/npm/v/@ali/agentscope-ai-design.svg?style=flat)](https://npmjs.org/package/@ali/agentscope-ai-design)
+[![NPM downloads](http://img.shields.io/npm/dm/@ali/agentscope-ai-design.svg?style=flat)](https://npmjs.org/package/@ali/agentscope-ai-design)
 
-  <h1>@agentscope-ai/design</h1>
-</div>
-🎨 @agentscope-ai/design is a front-end component library for LLM scenarios, used to build excellent LLM product experience, including a series of rich basic components and scenario components with LLM characteristics.
-<br />
-<br />
+百炼ui库
+## 目录结构
+```md
+.
+├── README.md                         # 说明文件
+├── .dumi
+├── theme                             # dumi自定义主题配置，用于组件库站点的功能/样式定制
+├── .dumirc.ts                        # The project config
+├── package.json   
+├── src
+│   ├── antd                          # antd相关逻辑&主题配置
+│   │   ├── ConfigProvider            # 替换antd原有的ConfigProvider
+│   │   ├── styles                    # less组件的局部样式，暴露给用户
+│   │   ├── token.ts                  # 设计导出的antd TOKEN
+│   │   ├── bailianCssVariables.ts    # 设计导出的css变量
+│   ├── ├── xconsoleCssVariables.ts   # XConsole主题的css变量配置
+│   ├── hooks                         # 对外输出的公共hooks
+│   ├── libs                          # 工具函数，按需导出
+│   ├── components                    # 组件目录
+|   │   ├── atomComponents            # 原子组件
+|   |   │   ├── BLCompatibleComponents   # 兼容antd的组件
+|   |   │   │   ├── BLButton          # 具体的组件
+|   |   |   │   │   ├── index.tsx     # 组件入口文件
+|   |   |   │   │   ├── index.md      # 文档入口文件
+|   |   |   │   │   ├── demo          # demo示例代码
+|   |   |   |   │   │   ├── demo1.tsx
+|   |   |   |   │   │   ├── demo2.tsx
+|   |   │   ├── BLInCompatibleComponents # 不兼容antd的组件
+|   │   ├── proComponents             # 高级组件（原子组件基础上封装程度较高的组件）
+|   │   ├── bizComponents             # 业务组件
+|   |   │   ├── bailian               # 百炼控制台业务组件（只放有复用场景的）
+|   |   │   ├── quanmiao              # 全妙业务组件（只放有复用场景的）
+│   ├── demos                         # 【deprecated】临时存放Demo UI层的相关文件，后续会迁移到theme中
+│   ├── i18n                          # 国际化相关
+│   ├── config.ts                     # 配置项
+│   ├── index.less                    # 【deprecated】组件库全局样式（历史包袱，后续考虑删掉）
+│   ├── index.ts                      # 入口文件，所有组件、hooks、工具函数都从这里用export导出
+│   └── typings.d.ts                  # 类型文件
+├── docs                              
+│   ├── guide                         # 指南页
+│   ├── index.md                      # 首页
+└── tsconfig.json
+```
+## Usage
+
+映射关系：
+bailian-web：
+NewIconFont -> BLIconFont
+CutButton -> BLButton
+BizAlert -> BLAlert
+BizBreadcrumb -> BLBreadcrumb
+BizDragList -> -
+BizDrawer -> BLDrawer
+BizDropMenu -> BLDropMenu
+BizEmpty -> BLEmpty
+BizForm -> Form
+BizIdIcon -> BLIDIcon
+BizLoadingIcon -> BLLoadingIcon
+BizModal -> Modal
+BizPopConfirm -> Popconfirm
+BizPopover -> BLPopover
+BizSearch -> Search
+BizSelect -> Select
+BizSliderSelector -> SliderSelector
+BizTabs -> Tabs
+BizTag -> Tag
+BizTourGuide -> TourGuide
+BizTriggerModal -> TriggerModal
+BizUpload -> Upload
 
-💬 @agentscope-ai/chat: A free AI Chat framework for building an excellent LLM Chat experience similar to ChatGPT
+为了让所有 antd 组件使用 Spark Design 的自定义图标，需要在项目的 `package.json` 中添加 overrides 配置：
 
-## ✨ Features
-- <img height="15" src="https://gw.alipayobjects.com/zos/rmsportal/KDpgvguMpGfqaHPjicRK.svg"> Based on Ant Design, compatible with the Ant Design ecosystem.
-- 🛡 Written in TypeScript with predictable static types.
-- 🎨 Multiple preset themes.
-- ⚙️ Lightweight configuration, ready to use out of the box.
-- ☀️ Supports light and dark modes.
+```json
+{
+  "name": "your-project",
+  "dependencies": {
+    "@ali/agentscope-ai-design": "^4.4.0",
+    "antd": "^5.21.0"
+  },
+  "pnpm": {
+    "overrides": {
+      "@ant-design/icons": "@agentscope-ai/icons-override-antd"
+    }
+  }
+}
+```
 
-## 📦 Install
+配置完成后，**删除现有依赖并重新安装**：
 
 ```bash
-npm install antd @ant-design/icons @agentscope-ai/design
+# 清理现有依赖
+rm -rf node_modules
+rm -f package-lock.json pnpm-lock.yaml yarn.lock
+
+# 重新安装
+npm install  # 或 pnpm install
 ```
 
-## 🔨 Usage
-```tsx
-import {
-  Button,
-  ConfigProvider,
-  purpleDarkTheme,
-  purpleTheme,
-} from '@agentscope-ai/design';
-import { Flex } from 'antd';
-import zhCN from 'antd/locale/zh_CN';
-import { useState } from 'react';
-
-const App = () => {
-  const [colorMode, setColorMode] = useState<'light' | 'dark'>('light');
-  const theme = colorMode === 'light' ? purpleTheme : purpleDarkTheme;
-
-  const prefix = 'consume';
+### 3. 使用组件
+
+配置完成后，所有 antd 组件都会自动使用自定义图标：
+
+```jsx
+import { Select, Input, Button } from 'antd';
+import { BLSelect, BLButton, BLModal } from '@ali/agentscope-ai-design';
+
+function App() {
   return (
-    <ConfigProvider
-      {...theme} // you can choose from purpleTheme, purpleDarkTheme, carbonTheme and carbonDarkTheme
-      prefix={prefix} // prefix for Ant Design and @agentscope-ai/design
-      iconfont="//at.alicdn.com/t/a/font_4807885_ugexdeaoq7.js" // optional parameter, you can get it from https://www.iconfont.cn/
-      locale={zhCN} // language pack from Ant Design
-    >
-      <Flex
-        style={{
-          backgroundColor: `var(--${prefix}-ant-color-bg-base)`,
-          padding: '16px 24px',
-        }}
-        vertical
-        gap={16}
-      >
-        <div style={{ color: `var(--${prefix}-ant-color-text-base)` }}>
-          Hello World!
-        </div>
-        <Button
-          type="primary"
-          onClick={() => {
-            setColorMode(colorMode === 'light' ? 'dark' : 'light');
-          }}
-        >
-          {colorMode === 'light' ? 'dark' : 'light'} mode
-        </Button>
-      </Flex>
-    </ConfigProvider>
+    <div>
+      {/* 原生 antd 组件，使用自定义图标 */}
+      <Select 
+        placeholder="选择器" 
+        options={[
+          { value: 'option1', label: 'Option 1' },
+          { value: 'option2', label: 'Option 2' },
+        ]} 
+      />
+      <Input.Password placeholder="密码输入" />
+      
+      {/* Spark Design 封装组件，内置更多功能 */}
+      <BLSelect placeholder="封装选择器" />
+      <BLButton type="primary">封装按钮</BLButton>
+    </div>
   );
-};
+}
+```
+
+## 📦 组件分类
+
+### 🎨 原生 antd 组件
+从 antd 直接导出，通过 overrides 配置使用自定义图标：
+- `Alert`, `Badge`, `Button`, `Checkbox`, `Input`, `Modal`, `Select` 等
+
+### 🔧 Spark 封装组件  
+基于 antd 封装，提供额外功能和样式：
+- `BLSelect`, `BLButton`, `BLModal`, `BLForm`, `BLTable` 等
 
-export default App;
+### 🎯 工具函数和 Hooks
+- `message`, `notification`
+- `useGlobalStyle`, `generateCssVars`
+- 各种工具函数
+
+## 🛠 配置说明
+
+### 为什么需要配置 overrides？
+
+Spark Design 使用自定义的图标包 `@agentscope-ai/icons-override-antd` 来替换 antd 默认的图标。通过 overrides 配置，可以让整个项目（包括 antd 内部）都使用我们的自定义图标。
+
+### 包管理器兼容性
+
+- ✅ **npm**: 使用 `overrides` 字段
+```json
+{
+  "overrides": {
+    "@ant-design/icons": "@agentscope-ai/icons-override-antd"
+  }
+}
 ```
-## Built-in Themes
-We provide four built-in themes:
-<span style="display: inline-block; width: 12px; height: 12px; background-color: #615CED;"></span> purpleTheme
-<span style="display: inline-block; width: 12px; height: 12px; background-color: #5551CC;"></span> purpleDarkTheme (for dark mode)
-<span style="display: inline-block; width: 12px; height: 12px; background-color: rgba(26, 26, 29, 1);"></span> carbonTheme
-<span style="display: inline-block; width: 12px; height: 12px; background-color: #676767;"></span> carbonDarkTheme (for dark mode)
-
-## 🏗️ Coming Soon
-Our website featuring design language, component documentation, theme switching, icon library and more is coming soon. Stay tuned!
+
+- ✅ **pnpm**: 使用 `pnpm.overrides` 字段  
+```json
+{
+  "pnpm": {
+    "overrides": {
+      "@ant-design/icons": "@agentscope-ai/icons-override-antd"
+    }
+  }
+}
+```
+
+- ✅ **yarn**: 使用 `overrides` 字段
+
+建议同时配置 `overrides` 和 `pnpm.overrides`，确保在不同包管理器下都能正常工作。
+
+### TypeScript 支持
+
+如果使用 TypeScript 且遇到类型错误，可以在 `tsconfig.json` 中添加路径映射：
+
+```json
+{
+  "compilerOptions": {
+    "paths": {
+      "@ant-design/icons": ["node_modules/@agentscope-ai/icons-override-antd"]
+    }
+  }
+}
+```
+
+### Lightning 支持
+
+使用 Lightning 工具时，需要在 lightning.config.mts 文件中配置：
+
+```javascript
+{
+  "build": {
+    "resolve": {
+      "alias": {
+        '@ant-design/icons': path.resolve(
+          __dirname,
+          './node_modules/@agentscope-ai/icons-override-antd',
+        )
+      }
+    }
+  }
+}
+```
+
+### Vite 项目额外配置
+
+某些 Vite 版本可能需要额外的 alias 配置：
+
+```javascript
+// vite.config.js
+export default {
+  resolve: {
+    alias: {
+      '@ant-design/icons': '@agentscope-ai/icons-override-antd'
+    }
+  }
+}
+```
+
+## 🔧 故障排除
+
+### 图标未正确显示？
+
+1. **确认配置**：检查 `package.json` 中的 overrides 配置是否正确
+2. **清理依赖**：删除 `node_modules` 和锁文件后重新安装
+3. **检查版本**：确保使用兼容的 antd 版本 (^5.18.0)
+4. **构建工具**：检查是否需要额外的 alias 配置
+
+### 开发环境和生产环境表现不一致？
+
+这通常是缓存问题，尝试：
+- 清理构建缓存
+- 添加构建工具的 alias 配置
+- 确保 overrides 配置在所有环境中都生效
+
+## 📖 更新日志
+
+查看 [CHANGELOG.md](./CHANGELOG.md) 了解版本更新信息。
+
+## 🤝 贡献
+
+欢迎提交 Issue 和 Pull Request！
+
+## 📄 License
+
+MIT

package/lib/antd/styles/select.style.js

@@ -1,7 +1,13 @@
 var _templateObject;
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 import createGlobalStyle from "../../libs/createStyle";
-export var useSelectStyle = createGlobalStyle(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n.", "-select-dropdown {\n  border: 1px solid var(--", "-color-border-secondary);\n  box-shadow: 0px 4px 6px 0px rgba(0, 0, 0, 0.08);\n  border-radius: var(--", "-border-radius);\n}\n\n.", "-select-outlined:not(.", "-select-customize-input) .", "-select-selector {\n  border-color: var(--", "-color-border-secondary);\n}\n\n.", "-select .", "-select-arrow {\n  color: var(--", "-color-text-secondary);\n}\n\n.", "-select-outlined.", "-select-multiple {\n  .", "-select-selection-item {\n    border-radius: 4px;\n    background-color: var(--", "-color-mauve-bg);\n  }\n}\n\n.", "-select-selection-overflow {\n  color: var(--", "-color-mauve);\n  \n  .", "-select-selection-item-remove {\n    .anticon-close {\n      font-size: 14px;\n      color: var(--", "-color-mauve);\n    }\n  }\n}\n\n.", "-select-disabled.", "-select-multiple .", "-select-selection-overflow .", "-select-selection-item {\n  color: var(--", "-color-mauve);\n}\n"])), function (p) {
+export var useSelectStyle = createGlobalStyle(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n.", "-select-dropdown {\n  border: 1px solid var(--", "-color-border-secondary);\n  box-shadow: 0px 4px 6px 0px rgba(0, 0, 0, 0.08);\n  border-radius: var(--", "-border-radius);\n}\n\n.", "-select-outlined:not(.", "-select-customize-input) .", "-select-selector {\n  border-color: var(--", "-color-border-secondary);\n}\n\n.", "-select .", "-select-arrow {\n  color: var(--", "-color-text-secondary);\n}\n\n.", "-select-outlined.", "-select-multiple {\n  .", "-select-selection-item {\n    border-radius: 4px;\n    background-color: var(--", "-color-mauve-bg);\n  }\n}\n\n.", "-select-selection-overflow {\n  color: var(--", "-color-mauve);\n  \n  .", "-select-selection-item-remove {\n    .anticon-close {\n      font-size: 14px;\n      color: var(--", "-color-mauve);\n    }\n  }\n}\n\n.", "-select-disabled.", "-select-multiple .", "-select-selection-overflow .", "-select-selection-item {\n  color: var(--", "-color-mauve);\n}\n\n.", "-select .", "-select-selection-placeholder {\n  color: var(--", "-color-text-tertiary);\n}\n"])), function (p) {
+  return p.antPrefix;
+}, function (p) {
+  return p.antPrefix;
+}, function (p) {
+  return p.antPrefix;
+}, function (p) {
   return p.antPrefix;
 }, function (p) {
   return p.antPrefix;

package/lib/antd/themes/bailianDarkTheme.json

@@ -84,6 +84,13 @@
   "colorMauve": "#8E8C99",
   "colorMauveHover": "#BBB8CA",
   "colorMauveBg": "rgba(239, 240, 243, 0.2)",
+ "colorSlate": "#2C3A50",
+  "colorSlateHover": "#354252",
+  "colorSlateBg": "#232B36",
+  "colorLavender": "#A77BFF",
+  "colorLavenderHover": "#BFA5F3",
+  "colorLavenderBg": "rgba(150, 143, 167, 0.48)",
+
   "boxShadowTertiary": "0px 12px 32px -16px rgba(255, 255, 255, 0.16),0px 12px 60px 0px rgba(255, 255, 255, 0.08),0px 0px 1px 0px rgba(255, 255, 255, 0.02)",
   "boxShadowTertiaryLeft": "-12px 0px 32px -16px rgba(255, 255, 255, 0.16),-12px 0px 60px 0px rgba(255, 255, 255, 0.08),0px 0px 1px 0px rgba(255, 255, 255, 0.02);",
   "boxShadowInput": "0px 12px 24px -16px rgba(255, 255, 255, 0.08),0px 12px 40px 0px rgba(255, 255, 255, 0.16),0px 0px 1px 0px rgba(255, 255, 255, 0.04)"

package/lib/antd/themes/bailianTheme.json

@@ -84,6 +84,13 @@
   "colorMauve": "#8E8C99",
   "colorMauveHover": "#C0BFC8",
   "colorMauveBg": "rgba(239, 240, 243, 0.8)",
+  "colorSlate": "#1E293B",
+  "colorSlateHover": "#475569",
+  "colorSlateBg": "#E2E8F0",
+  "colorLavender": "#A77BFF",
+  "colorLavenderHover": "#BB99FF",
+  "colorLavenderBg": "rgba(226, 212, 255, 0.8)",
+
   "boxShadowTertiary": "0px 12px 32px -16px rgba(0, 0, 0, 0.24),0px 12px 60px 0px rgba(0, 0, 0, 0.12),0px 0px 1px 0px rgba(0, 0, 0, 0.04)",
   "boxShadowTertiaryLeft": "-12px 0px 32px -16px rgba(0, 0, 0, 0.24),-12px 0px 60px 0px rgba(0, 0, 0, 0.12),0px 0px 1px 0px rgba(0, 0, 0, 0.04)",
   "boxShadowInput": "0px 12px 24px -16px rgba(54, 54, 73, 0.04),0px 12px 40px 0px rgba(51, 51, 71, 0.08),0px 0px 1px 0px rgba(44, 44, 54, 0.02)"

package/lib/antd/themes/carbonDarkTheme.json

@@ -84,6 +84,13 @@
   "colorMauve": "#8E8C99",
   "colorMauveHover": "#BBB8CA",
   "colorMauveBg": "#5859647A",
+  "colorSlate": "#2C3A50",
+  "colorSlateHover": "#354252",
+  "colorSlateBg": "#232B36",
+  "colorLavender": "#A77BFF",
+  "colorLavenderHover": "#BFA5F3",
+  "colorLavenderBg": "rgba(150, 143, 167, 0.48)",
+
   "boxShadowTertiary": "0px 12px 32px -16px rgba(255, 255, 255, 0.24),0px 12px 60px 0px rgba(255, 255, 255, 0.12),0px 0px 1px 0px rgba(255, 255, 255, 0.04)",
   "boxShadowTertiaryLeft": "-12px 0px 32px -16px rgba(255, 255, 255, 0.24),-12px 0px 60px 0px rgba(255, 255, 255, 0.12),0px 0px 1px 0px rgba(255, 255, 255, 0.04)",
   "boxShadowInput": "0px 12px 24px -16px rgba(255, 255, 255, 0.08),0px 12px 40px 0px rgba(255, 255, 255, 0.16),0px 0px 1px 0px rgba(255, 255, 255, 0.04)",

package/lib/antd/themes/carbonTheme.json

@@ -84,6 +84,9 @@
   "colorMauve": "rgba(142, 140, 153, 1)",
   "colorMauveHover": "#C0BFC8",
   "colorMauveBg": "rgba(239, 240, 243, 0.8)",
+  "colorSlate": "#2C3A50",
+  "colorSlateHover": "#354252",
+  "colorSlateBg": "#232B36",
   "boxShadowTertiary": "0px 12px 32px -16px rgba(0, 0, 0, 0.24),0px 12px 60px 0px rgba(0, 0, 0, 0.12),0px 0px 1px 0px rgba(0, 0, 0, 0.04)",
   "boxShadowTertiaryLeft": "-12px 0px 32px -16px rgba(0, 0, 0, 0.24),-12px 0px 60px 0px rgba(0, 0, 0, 0.12),0px 0px 1px 0px rgba(0, 0, 0, 0.04)",
   "boxShadowInput": "0px 12px 24px -16px rgba(54, 54, 73, 0.04),0px 12px 40px 0px rgba(51, 51, 71, 0.08),0px 0px 1px 0px rgba(44, 44, 54, 0.02)"

package/lib/antd/themes/generateTheme.d.ts

@@ -0,0 +1,132 @@
+/**
+ * 主题生成器 - Theme Generator
+
+ * 核心功能：
+ * 1. 颜色空间转换（HEX/RGB/HSL）
+ * 2. 颜色调整和生成
+ * 3. 完整主题配置生成（支持浅色/暗色模式）
+ *
+ * 设计原则（参考 Radix Colors）：
+ * - 浅色模式：背景 95-99% 亮度，边框 80-90% 亮度，文本 15-25% 亮度
+ * - 暗色模式：背景 0-10% 亮度，边框使用透明度，文本 85-95% 亮度
+ * - 状态色和装饰色在暗色模式下使用预设优化值
+ *
+ * 生成规则：
+ * - 主色 (Primary)：从输入的主色生成，暗色模式自动调整亮度
+ * - 背景色系：基于 bgBase 生成，保持色相统一
+ * - 文本色系：基于 textBase 生成，保持色相统一
+ * - 边框色系：基于 bgBase 生成，饱和度提高以增强可见度
+ * - 填充色系：暗色模式基于文本色+透明度，浅色模式基于背景色
+ * - 状态色/装饰色/阴影：暗色模式使用预设优化值，浅色模式使用配置文件
+ */
+/**
+ * 生成完整主题
+ * @param {string} primaryHex - 主色调
+ * @param {string} bgBaseHex - 背景基础色
+ * @param {string} textBaseHex - 文本基础色
+ * @param {boolean} darkMode - 是否为暗色模式
+ * @returns {Object} 完整的主题配置对象
+ */
+interface GenerateThemeProps {
+    primaryHex: string;
+    bgBaseHex?: string;
+    textBaseHex?: string;
+    darkMode: boolean;
+}
+declare const generateTheme: ({ primaryHex, bgBaseHex, textBaseHex, darkMode, }: GenerateThemeProps) => {
+    borderRadiusXS: number;
+    borderRadiusSM: number;
+    borderRadius: number;
+    borderRadiusLG: number;
+    borderRadiusXL: number;
+    borderRadiusFull: number;
+    wireframe: boolean;
+    colorPrimary: any;
+    colorPrimaryHover: any;
+    colorPrimaryActive: any;
+    colorPrimaryBg: any;
+    colorPrimaryBgHover: any;
+    colorPrimaryBorder: any;
+    colorPrimaryBorderHover: any;
+    colorPrimaryText: any;
+    colorPrimaryTextHover: any;
+    colorPrimaryTextActive: any;
+    colorTextBase: string;
+    colorText: string;
+    colorTextSecondary: string;
+    colorTextTertiary: string;
+    colorTextQuaternary: string;
+    colorTextWhite: string;
+    colorBgBase: string;
+    colorBgContainer: any;
+    colorBgElevated: any;
+    colorBgLayout: any;
+    colorBgSpotlight: string;
+    colorBgMask: string;
+    colorBorder: any;
+    colorBorderSecondary: any;
+    colorFill: string;
+    colorFillSecondary: string;
+    colorFillTertiary: string;
+    colorFillQuaternary: string;
+    colorFillDisable: any;
+    colorLink: any;
+    colorInfo: string;
+    colorInfoHover: string;
+    colorInfoText: string;
+    colorInfoBg: string;
+    colorInfoBgHover: string;
+    colorInfoBorder: string;
+    colorInfoBorderHover: string;
+    colorSuccess: string;
+    colorSuccessHover: string;
+    colorSuccessBg: string;
+    colorSuccessBgHover: string;
+    colorSuccessBorder: string;
+    colorSuccessBorderHover: string;
+    colorWarning: string;
+    colorWarningHover: string;
+    colorWarningBg: string;
+    colorWarningBgHover: string;
+    colorWarningBorder: string;
+    colorWarningBorderHover: string;
+    colorError: string;
+    colorErrorHover: string;
+    colorErrorBg: string;
+    colorErrorBgHover: string;
+    colorErrorBorder: string;
+    colorErrorBorderHover: string;
+    colorPurple: string;
+    colorPurpleHover: string;
+    colorPurpleBg: string;
+    colorPink: string;
+    colorPinkHover: string;
+    colorPinkBg: string;
+    colorYellow: string;
+    colorYellowHover: string;
+    colorYellowBg: string;
+    colorOrange: string;
+    colorOrangeHover: string;
+    colorOrangeBg: string;
+    colorTeal: string;
+    colorTealHover: string;
+    colorTealBg: string;
+    colorBlue: string;
+    colorBlueHover: string;
+    colorBlueBg: string;
+    colorMauve: string;
+    colorMauveHover: string;
+    colorMauveBg: string;
+    colorSlate: string;
+    colorSlateHover: string;
+    colorSlateBg: string;
+    colorLavender: string;
+    colorLavenderHover: string;
+    colorLavenderBg: string;
+    boxShadow: string;
+    boxShadowSecondary: string;
+    boxShadowTertiary: string;
+    boxShadowTertiaryLeft: string;
+    boxShadowInput: string;
+};
+export default generateTheme;