@particle-network/ui-shared 0.2.0 → 0.3.0-beta.1

package/dist/color.d.ts

@@ -11,17 +11,23 @@ export declare const foregroundColorList: readonly ["default", "secondary", "ter
 export declare const colorToCSSVariable: {
     readonly default: "--heroui-foreground";
     readonly foreground: "--heroui-foreground";
-    readonly secondary: "--heroui-foreground-300";
+    readonly secondary: "--heroui-secondary";
     readonly white: "--color-white";
-    readonly tertiary: "--heroui-foreground-100";
+    readonly tertiary: "--heroui-tertiary";
     readonly primary: "--heroui-primary";
     readonly success: "--heroui-success";
     readonly danger: "--heroui-danger";
     readonly alert: "--heroui-alert";
     readonly warning: "--heroui-warning";
     readonly gold: "--heroui-gold";
-    readonly bullish: "--bullish-color";
-    readonly bearish: "--bearish-color";
+    readonly bullish: "--heroui-bullish";
+    readonly bearish: "--heroui-bearish";
+    readonly 'bg-default': "--heroui-background";
+    readonly 'bg-200': "--heroui-background-200";
+    readonly 'bg-300': "--heroui-background-300";
+    readonly 'bg-400': "--heroui-background-400";
+    readonly overlay: "--heroui-overlay";
+    readonly divider: "--heroui-divider";
 };
 export declare const colorToClassName: {
     readonly default: "text-foreground";
@@ -37,10 +43,16 @@ export declare const colorToClassName: {
     readonly gold: "text-gold";
     readonly bullish: "text-bullish";
     readonly bearish: "text-bearish";
+    readonly 'bg-default': "text-background";
+    readonly 'bg-200': "text-background-200";
+    readonly 'bg-300': "text-background-300";
+    readonly 'bg-400': "text-background-400";
+    readonly overlay: "text-background-overlay";
+    readonly divider: "text-background-divider";
 };
 export type ColorString = `#${string}`;
 export declare function hexColorToHSLValue(hex: ColorString): string;
 export declare function hexColorToHSL(hex: ColorString): string;
 export declare function hslToHex(hslStr: string): string;
-export declare const getHexColorFromCSSVariable: (color: UXForegroundColor) => string;
+export declare const getHexColorFromCSSVariable: (color: UXColor) => string;
 export declare const setColorWithOpacity: (color: string, opacity: number) => string;

package/dist/color.js

@@ -60,17 +60,23 @@ const foregroundColorList = [
 const colorToCSSVariable = {
     default: '--heroui-foreground',
     foreground: '--heroui-foreground',
-    secondary: '--heroui-foreground-300',
+    secondary: '--heroui-secondary',
     white: '--color-white',
-    tertiary: '--heroui-foreground-100',
+    tertiary: '--heroui-tertiary',
     primary: '--heroui-primary',
     success: '--heroui-success',
     danger: '--heroui-danger',
     alert: '--heroui-alert',
     warning: '--heroui-warning',
     gold: '--heroui-gold',
-    bullish: '--bullish-color',
-    bearish: '--bearish-color'
+    bullish: '--heroui-bullish',
+    bearish: '--heroui-bearish',
+    'bg-default': '--heroui-background',
+    'bg-200': '--heroui-background-200',
+    'bg-300': '--heroui-background-300',
+    'bg-400': '--heroui-background-400',
+    overlay: '--heroui-overlay',
+    divider: '--heroui-divider'
 };
 const colorToClassName = {
     default: 'text-foreground',
@@ -85,7 +91,13 @@ const colorToClassName = {
     warning: 'text-warning',
     gold: 'text-gold',
     bullish: 'text-bullish',
-    bearish: 'text-bearish'
+    bearish: 'text-bearish',
+    'bg-default': 'text-background',
+    'bg-200': 'text-background-200',
+    'bg-300': 'text-background-300',
+    'bg-400': 'text-background-400',
+    overlay: 'text-background-overlay',
+    divider: 'text-background-divider'
 };
 function hexColorToHSLValue(hex) {
     const hexWithoutHash = hex.replace('#', '');
@@ -172,6 +184,7 @@ function hslToHex(hslStr) {
     return `#${toHex(r)}${toHex(g)}${toHex(b)}`.toUpperCase();
 }
 const getHexColorFromCSSVariable = (color)=>{
+    if ('transparent' === color) return 'transparent';
     const rootStyles = getComputedStyle(document.documentElement);
     const value = rootStyles.getPropertyValue(colorToCSSVariable[color]).trim();
     if (!value) return '#000000';

package/dist/index.d.ts

@@ -3,4 +3,3 @@ export * from './radius';
 export * from './size';
 export * from './spacing';
 export * from './tailwind-color';
-export * from './theme';

package/dist/index.js

@@ -3,4 +3,3 @@ export * from "./radius.js";
 export * from "./size.js";
 export * from "./spacing.js";
 export * from "./tailwind-color.js";
-export * from "./theme.js";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@particle-network/ui-shared",
-  "version": "0.2.0",
+  "version": "0.3.0-beta.1",
   "type": "module",
   "main": "./dist/index.js",
   "react-native": "./dist/index.js",
@@ -46,8 +46,8 @@
     "@types/react": "^19.1.10",
     "react": "^19.1.0",
     "typescript": "^5.8.3",
-    "@particle-network/eslint-config": "0.3.0",
-    "@particle-network/lintstaged-config": "0.1.0"
+    "@particle-network/lintstaged-config": "0.1.0",
+    "@particle-network/eslint-config": "0.3.0"
   },
   "scripts": {
     "build": "rslib build",

package/dist/theme.d.ts

@@ -1,6 +0,0 @@
-type Theme = 'dark' | 'light';
-/**
- * 监听主题变化（兼容 data-theme 和 class 两种方式）
- */
-export declare function useTheme(): Theme;
-export {};

package/dist/theme.js

@@ -1,27 +0,0 @@
-import { useEffect, useState } from "react";
-function getCurrentTheme() {
-    const html = document.documentElement;
-    if (html.hasAttribute('data-theme')) return 'dark' === html.getAttribute('data-theme') ? 'dark' : 'light';
-    return html.classList.contains('dark') ? 'dark' : 'light';
-}
-function useTheme() {
-    const [theme, setTheme] = useState(getCurrentTheme);
-    useEffect(()=>{
-        const observer = new MutationObserver(()=>{
-            const newTheme = getCurrentTheme();
-            if (newTheme !== theme) setTheme(newTheme);
-        });
-        observer.observe(document.documentElement, {
-            attributes: true,
-            attributeFilter: [
-                'class',
-                'data-theme'
-            ]
-        });
-        return ()=>observer.disconnect();
-    }, [
-        theme
-    ]);
-    return theme;
-}
-export { useTheme };