@chenhui996/gg-ui 0.0.11 → 0.1.0-beta.0

package/gz-ui-lib/{components → src/components}/config-provider/index.d.ts

@@ -1,10 +1,11 @@
 import { ConfigProviderProps } from 'antd/es/config-provider';
+import { GZThemeMode } from '../../styles/themes/themeConfig';
 export interface GZConfigProviderProps extends ConfigProviderProps {
     /**
      * 组件库的主题模式
-     * @default 'light'
+     * @default 'gold-dark'
      */
-    mode?: 'light' | 'dark';
+    mode?: GZThemeMode;
 }
-declare const ConfigProvider: ({ mode, theme: customTheme, locale, children, ...rest }: GZConfigProviderProps) => import("react/jsx-runtime").JSX.Element;
+declare const ConfigProvider: ({ mode, theme: customTheme, locale, button: customButton, children, ...rest }: GZConfigProviderProps) => import("react/jsx-runtime").JSX.Element;
 export default ConfigProvider;

package/gz-ui-lib/{index.d.ts → src/index.d.ts}

@@ -1,3 +1,4 @@
+export { blueDarkThemeConfig, blueDarkThemeCustomTokens, blueDarkThemeTokens, blueLightThemeConfig, blueLightThemeCustomTokens, blueLightThemeTokens, defaultThemeConfig, defaultThemeMode, getThemeConfig, goldDarkThemeConfig, goldDarkThemeCustomTokens, goldDarkThemeTokens, goldLightThemeConfig, goldLightThemeCustomTokens, goldLightThemeTokens, type GZThemeMode, type GZThemeName, type GZThemeSelection, type GZThemeVariant, } from './styles/themes/themeConfig';
 export { default as Button, type GZButtonProps as ButtonProps } from './components/button';
 export { default as Divider, type GZDividerProps as DividerProps } from './components/divider';
 export { default as Space, type GZSpaceProps as SpaceProps } from './components/space';

package/gz-ui-lib/src/styles/themes/buttonGradient.d.ts

@@ -0,0 +1,20 @@
+import { CSSProperties } from 'react';
+import { ThemeConfig } from 'antd/es/config-provider/context';
+export declare const goldDarkButtonGradientClassName = "gz-button-gold-dark-gradient";
+type CSSVariableProperties = CSSProperties & Record<`--${string}`, string | number | undefined>;
+type ButtonGradientTokens = {
+    primaryGradientStart?: string;
+    primaryGradientEnd?: string;
+    primaryGradientStartHover?: string;
+    primaryGradientEndHover?: string;
+    primaryGradientStartActive?: string;
+    primaryGradientEndActive?: string;
+    primaryText?: string;
+    primaryTextHover?: string;
+    primaryTextActive?: string;
+};
+export declare const isGoldDarkMode: (mode: string) => mode is "goldDark" | "gold-dark";
+export declare const getButtonGradientTokens: (themeConfig: ThemeConfig) => ButtonGradientTokens;
+export declare const hasPrimarySolidGradientTokens: (tokens: ButtonGradientTokens) => boolean;
+export declare const getButtonGradientStyleVars: (tokens: ButtonGradientTokens) => CSSVariableProperties;
+export {};

package/gz-ui-lib/src/styles/themes/themeConfig.d.ts

@@ -0,0 +1,273 @@
+import { ThemeConfig } from 'antd/es/config-provider/context';
+import { blueDarkThemeTokens } from '../../../guozhi-design-tokens/blue-theme/dark-mode/blueDarkThemeTokens';
+import { blueLightThemeTokens } from '../../../guozhi-design-tokens/blue-theme/light-mode/blueLightThemeTokens';
+import { goldDarkThemeTokens } from '../../../guozhi-design-tokens/gold-theme/dark-mode/goldDarkThemeTokens';
+import { goldLightThemeTokens } from '../../../guozhi-design-tokens/gold-theme/light-mode/goldLightThemeTokens';
+export type GZThemeName = "gold" | "blue";
+export type GZThemeVariant = "light" | "dark";
+export type GZThemeSelection = `${GZThemeName}-${GZThemeVariant}`;
+export type GZThemeMode = GZThemeSelection | "goldDark" | "goldLight" | "blueDark" | "blueLight" | "light" | "dark";
+export declare const defaultThemeMode: GZThemeSelection;
+export declare const getThemeConfig: (mode: GZThemeMode) => ThemeConfig;
+export declare const defaultThemeConfig: ThemeConfig;
+export declare const goldDarkThemeConfig: ThemeConfig;
+export declare const goldLightThemeConfig: ThemeConfig;
+export declare const blueDarkThemeConfig: ThemeConfig;
+export declare const blueLightThemeConfig: ThemeConfig;
+export declare const goldDarkThemeCustomTokens: {
+    responsive: {
+        "Desktop SM": {
+            device: number;
+            deviceMin: number;
+            deviceMax: number;
+            hideOnDesktop: number;
+            hideOnDesktopSM: number;
+            hideOnTablet: number;
+            hideOnMobile: number;
+            onlyDesktop: number;
+            onlyDesktopSM: number;
+            onlyTablet: number;
+            onlyMobile: number;
+            gutter: number;
+            pageOffset: number;
+        };
+        Desktop: {
+            device: number;
+            deviceMin: number;
+            deviceMax: number;
+            hideOnDesktop: number;
+            hideOnDesktopSM: number;
+            hideOnTablet: number;
+            hideOnMobile: number;
+            onlyDesktop: number;
+            onlyDesktopSM: number;
+            onlyTablet: number;
+            onlyMobile: number;
+            gutter: number;
+            pageOffset: number;
+        };
+        Mobile: {
+            device: number;
+            deviceMin: number;
+            deviceMax: number;
+            hideOnDesktop: number;
+            hideOnDesktopSM: number;
+            hideOnTablet: number;
+            hideOnMobile: number;
+            onlyDesktop: number;
+            onlyDesktopSM: number;
+            onlyTablet: number;
+            onlyMobile: number;
+            gutter: number;
+            pageOffset: number;
+        };
+        Tablet: {
+            device: number;
+            deviceMin: number;
+            deviceMax: number;
+            hideOnDesktop: number;
+            hideOnDesktopSM: number;
+            hideOnTablet: number;
+            hideOnMobile: number;
+            onlyDesktop: number;
+            onlyDesktopSM: number;
+            onlyTablet: number;
+            onlyMobile: number;
+            gutter: number;
+            pageOffset: number;
+        };
+    };
+};
+export declare const goldLightThemeCustomTokens: {
+    responsive: {
+        "Desktop SM": {
+            device: number;
+            deviceMin: number;
+            deviceMax: number;
+            hideOnDesktop: number;
+            hideOnDesktopSM: number;
+            hideOnTablet: number;
+            hideOnMobile: number;
+            onlyDesktop: number;
+            onlyDesktopSM: number;
+            onlyTablet: number;
+            onlyMobile: number;
+            gutter: number;
+            pageOffset: number;
+        };
+        Desktop: {
+            device: number;
+            deviceMin: number;
+            deviceMax: number;
+            hideOnDesktop: number;
+            hideOnDesktopSM: number;
+            hideOnTablet: number;
+            hideOnMobile: number;
+            onlyDesktop: number;
+            onlyDesktopSM: number;
+            onlyTablet: number;
+            onlyMobile: number;
+            gutter: number;
+            pageOffset: number;
+        };
+        Mobile: {
+            device: number;
+            deviceMin: number;
+            deviceMax: number;
+            hideOnDesktop: number;
+            hideOnDesktopSM: number;
+            hideOnTablet: number;
+            hideOnMobile: number;
+            onlyDesktop: number;
+            onlyDesktopSM: number;
+            onlyTablet: number;
+            onlyMobile: number;
+            gutter: number;
+            pageOffset: number;
+        };
+        Tablet: {
+            device: number;
+            deviceMin: number;
+            deviceMax: number;
+            hideOnDesktop: number;
+            hideOnDesktopSM: number;
+            hideOnTablet: number;
+            hideOnMobile: number;
+            onlyDesktop: number;
+            onlyDesktopSM: number;
+            onlyTablet: number;
+            onlyMobile: number;
+            gutter: number;
+            pageOffset: number;
+        };
+    };
+};
+export declare const blueDarkThemeCustomTokens: {
+    responsive: {
+        "Desktop SM": {
+            device: number;
+            deviceMin: number;
+            deviceMax: number;
+            hideOnDesktop: number;
+            hideOnDesktopSM: number;
+            hideOnTablet: number;
+            hideOnMobile: number;
+            onlyDesktop: number;
+            onlyDesktopSM: number;
+            onlyTablet: number;
+            onlyMobile: number;
+            gutter: number;
+            pageOffset: number;
+        };
+        Desktop: {
+            device: number;
+            deviceMin: number;
+            deviceMax: number;
+            hideOnDesktop: number;
+            hideOnDesktopSM: number;
+            hideOnTablet: number;
+            hideOnMobile: number;
+            onlyDesktop: number;
+            onlyDesktopSM: number;
+            onlyTablet: number;
+            onlyMobile: number;
+            gutter: number;
+            pageOffset: number;
+        };
+        Mobile: {
+            device: number;
+            deviceMin: number;
+            deviceMax: number;
+            hideOnDesktop: number;
+            hideOnDesktopSM: number;
+            hideOnTablet: number;
+            hideOnMobile: number;
+            onlyDesktop: number;
+            onlyDesktopSM: number;
+            onlyTablet: number;
+            onlyMobile: number;
+            gutter: number;
+            pageOffset: number;
+        };
+        Tablet: {
+            device: number;
+            deviceMin: number;
+            deviceMax: number;
+            hideOnDesktop: number;
+            hideOnDesktopSM: number;
+            hideOnTablet: number;
+            hideOnMobile: number;
+            onlyDesktop: number;
+            onlyDesktopSM: number;
+            onlyTablet: number;
+            onlyMobile: number;
+            gutter: number;
+            pageOffset: number;
+        };
+    };
+};
+export declare const blueLightThemeCustomTokens: {
+    responsive: {
+        "Desktop SM": {
+            device: number;
+            deviceMin: number;
+            deviceMax: number;
+            hideOnDesktop: number;
+            hideOnDesktopSM: number;
+            hideOnTablet: number;
+            hideOnMobile: number;
+            onlyDesktop: number;
+            onlyDesktopSM: number;
+            onlyTablet: number;
+            onlyMobile: number;
+            gutter: number;
+            pageOffset: number;
+        };
+        Desktop: {
+            device: number;
+            deviceMin: number;
+            deviceMax: number;
+            hideOnDesktop: number;
+            hideOnDesktopSM: number;
+            hideOnTablet: number;
+            hideOnMobile: number;
+            onlyDesktop: number;
+            onlyDesktopSM: number;
+            onlyTablet: number;
+            onlyMobile: number;
+            gutter: number;
+            pageOffset: number;
+        };
+        Mobile: {
+            device: number;
+            deviceMin: number;
+            deviceMax: number;
+            hideOnDesktop: number;
+            hideOnDesktopSM: number;
+            hideOnTablet: number;
+            hideOnMobile: number;
+            onlyDesktop: number;
+            onlyDesktopSM: number;
+            onlyTablet: number;
+            onlyMobile: number;
+            gutter: number;
+            pageOffset: number;
+        };
+        Tablet: {
+            device: number;
+            deviceMin: number;
+            deviceMax: number;
+            hideOnDesktop: number;
+            hideOnDesktopSM: number;
+            hideOnTablet: number;
+            hideOnMobile: number;
+            onlyDesktop: number;
+            onlyDesktopSM: number;
+            onlyTablet: number;
+            onlyMobile: number;
+            gutter: number;
+            pageOffset: number;
+        };
+    };
+};
+export { blueDarkThemeTokens, blueLightThemeTokens, goldDarkThemeTokens, goldLightThemeTokens, };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@chenhui996/gg-ui",
   "private": false,
-  "version": "0.0.11",
+  "version": "0.1.0-beta.0",
   "type": "module",
   "files": [
     "gz-ui-lib"
@@ -28,7 +28,11 @@
     "preview": "vite preview",
     "dev": "dumi dev",
     "docs:build": "dumi build",
-    "tokens:transform": "node scripts/transformFullTokens.js"
+    "tokens:transform": "node scripts/transformFullTokens.js",
+    "tokens:transform:gold-dark": "node scripts/transformFullTokens.js --source guozhi-design-tokens-origin/gold-theme --output guozhi-design-tokens/gold-theme/dark-mode --mode Dark --name goldDarkTheme",
+    "tokens:transform:gold-light": "node scripts/transformFullTokens.js --source guozhi-design-tokens-origin/gold-theme --output guozhi-design-tokens/gold-theme/light-mode --mode Light --name goldLightTheme",
+    "tokens:transform:blue-dark": "node scripts/transformFullTokens.js --source guozhi-design-tokens-origin/blue-theme --output guozhi-design-tokens/blue-theme/dark-mode --mode Dark --name blueDarkTheme",
+    "tokens:transform:blue-light": "node scripts/transformFullTokens.js --source guozhi-design-tokens-origin/blue-theme --output guozhi-design-tokens/blue-theme/light-mode --mode Light --name blueLightTheme"
   },
   "dependencies": {
     "@ant-design/happy-work-theme": "^2.0.0",

package/gz-ui-lib/styles/themes/themeConfig.d.ts

@@ -1,3 +0,0 @@
-import { ThemeConfig } from 'antd/es/config-provider/context';
-export declare const getThemeConfig: (mode: "light" | "dark") => ThemeConfig;
-export declare const defaultThemeConfig: ThemeConfig;