temp

packages/components/src/button/index.tsx

@@ -3,3 +3,12 @@ import MuiButton, { ButtonProps } from '@mui/material/Button';
 export const Button = (props: ButtonProps) => {
   return <MuiButton {...props} />;
 };
+
+export const IconButton = (props: ButtonProps) => {
+  const { variant = 'contained', color = 'primary', sx, children, ...rest } = props;
+  return (
+    <MuiButton variant={variant} color={color} {...rest} sx={{ color: 'white', minWidth: '32px', padding: '4px', ...sx }}>
+      {children}
+    </MuiButton>
+  );
+};

packages/components/src/theme/index.tsx

@@ -1,6 +1,7 @@
 import { createTheme, Shadows, ThemeOptions } from '@mui/material/styles';
 import { useTheme as useMuiTheme, Theme } from '@mui/material/styles';
 import { amber, red } from '@mui/material/colors';
+import { ThemeProvider } from '@mui/material/styles';
 const generateShadows = (color: string): Shadows => {
   return [
     'none',
@@ -139,6 +140,20 @@ export const themeOptions: ThemeOptions = {
  */
 export const theme = createTheme(themeOptions);
 
+/**
+ *
+ * @returns
+ */
 export const useTheme = () => {
   return useMuiTheme<Theme>();
 };
+
+/**
+ * 自定义主题设置。
+ * @param param0 
+ * @returns 
+ */
+export const CustomThemeProvider = ({ children, themeOptions: customThemeOptions }: { children: React.ReactNode; themeOptions?: ThemeOptions }) => {
+  const theme = createTheme(customThemeOptions || themeOptions);
+  return <ThemeProvider theme={theme}>{children}</ThemeProvider>;
+};

packages/components/src/theme/wind-theme.css

@@ -0,0 +1,6 @@
+@import 'tailwindcss';
+
+@theme {
+  --light-color-primary: oklch(0.72 0.11 178);
+  --light-color-secondary: oklch(0.72 0.11 178);
+}