@particle-network/ui-react 0.4.0-beta.4 → 0.4.0-beta.5

package/dist/components/UXTabs/tabs.classes.js

@@ -252,7 +252,7 @@ const tabsClasses = {
             color: 'default',
             class: {
                 cursor: [
-                    'bg-background-200'
+                    '!bg-background-200'
                 ],
                 tabContent: 'group-data-[selected=true]:text-default-foreground'
             }
@@ -264,9 +264,9 @@ const tabsClasses = {
             color: 'default',
             class: {
                 cursor: [
-                    'bg-foreground-100'
+                    '!bg-tertiary'
                 ],
-                tabContent: 'group-data-[selected=true]:text-default-foreground'
+                tabContent: 'group-data-[selected=true]:text-tertiary-foreground'
             }
         },
         {
@@ -276,9 +276,9 @@ const tabsClasses = {
             color: 'default',
             class: {
                 cursor: [
-                    'bg-background-300'
+                    '!bg-background-300'
                 ],
-                tabContent: 'group-data-[selected=true]:text-default-foreground'
+                tabContent: 'group-data-[selected=true]:text-foreground'
             }
         },
         {

package/dist/components/UXThemeSwitch/theme-switch.js

@@ -2,7 +2,7 @@ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import "react";
 import { Drawer, DrawerBody, DrawerContent, DrawerFooter, DrawerHeader } from "@heroui/drawer";
 import { useDisclosure } from "@heroui/use-disclosure";
-import { ThemeSwitchIcon } from "@particle-network/icons/web";
+import { ChartColorSwitchIcon } from "@particle-network/icons/web";
 import { useI18n } from "../../hooks/index.js";
 import { Flex, HStack, VStack } from "../layout/index.js";
 import { Text } from "../typography/Text.js";
@@ -132,7 +132,7 @@ const UXThemeSwitch = ({ children })=>{
             isIconOnly: true,
             variant: "light",
             onPress: onOpen,
-            children: /*#__PURE__*/ jsx(ThemeSwitchIcon, {})
+            children: /*#__PURE__*/ jsx(ChartColorSwitchIcon, {})
         });
     };
     return /*#__PURE__*/ jsxs(Fragment, {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@particle-network/ui-react",
-  "version": "0.4.0-beta.4",
+  "version": "0.4.0-beta.5",
   "type": "module",
   "exports": {
     ".": {
@@ -39,8 +39,8 @@
     "@types/react": "^19.1.10",
     "react": "^19.1.0",
     "typescript": "^5.8.3",
-    "@particle-network/lintstaged-config": "0.1.0",
-    "@particle-network/eslint-config": "0.3.0"
+    "@particle-network/eslint-config": "0.3.0",
+    "@particle-network/lintstaged-config": "0.1.0"
   },
   "peerDependencies": {
     "react": ">=16.9.0",
@@ -50,8 +50,8 @@
     "ahooks": "^3.9.4",
     "copy-to-clipboard": "^3.3.3",
     "zustand": "^5.0.8",
-    "@particle-network/ui-shared": "0.3.0-beta.1",
-    "@particle-network/icons": "0.4.0-beta.2"
+    "@particle-network/icons": "0.4.0-beta.2",
+    "@particle-network/ui-shared": "0.3.0-beta.1"
   },
   "scripts": {
     "build": "rslib build",

package/tailwind-preset.js

@@ -6,6 +6,9 @@ const plugin = require('tailwindcss/plugin');
 module.exports = {
   theme: {
     extend: {
+      colors: {
+        brand: '#D745FF',
+      },
       gap: {
         xs: '0.125rem', // 2px
         sm: '0.375rem', // 6px
@@ -72,12 +75,12 @@ module.exports = {
       },
     },
   },
-  darkMode: 'class',
+  darkMode: ['selector', '[data-theme="dark"]'],
   plugins: [
     heroui({
       addCommonColors: true,
-      defaultTheme: 'ux-purple-gold-light',
-      defaultExtendTheme: 'light',
+      defaultTheme: 'ux-purple-gold-dark',
+      defaultExtendTheme: 'ux-purple-gold-dark',
       layout: {
         radius: {
           small: '6px', // rounded-small
@@ -509,7 +512,7 @@ module.exports = {
             },
             tertiary: {
               DEFAULT: '#7B7B85',
-              foreground: '#000000',
+              foreground: '#FFFFFF',
             },
             success: {
               DEFAULT: '#19AB5E',
@@ -1014,7 +1017,7 @@ module.exports = {
         addVariant('max-2xh', '@media (max-height: 1300px)');
 
         // light mode variant
-        addVariant('light', '&:not(.dark *)');
+        addVariant('light', '&:not([data-theme="dark"] *)');
 
         // button styles
         addComponents({
@@ -1064,7 +1067,7 @@ module.exports = {
         '.shadow-box': {
           boxShadow: '0px 2px 12px 0px rgba(23, 23, 28, 0.15)',
         },
-        '.dark .shadow-box': {
+        '[data-theme="dark"] .shadow-box': {
           boxShadow: '0px 2px 12px 0px rgba(0, 0, 0, 0.5)',
         },
       });